tweak a style of Picklist input

Author: msmx-mnakagawa

src/scripts/Picklist.tsx

@@ -17,7 +17,7 @@ import { FormElement, FormElementProps } from './FormElement';
 import { Icon } from './Icon';
 import { AutoAlign, RectangleAlignment } from './AutoAlign';
 import { DropdownMenuProps } from './DropdownMenu';
-import { isElInChildren } from './util';
+import { registerStyle, isElInChildren } from './util';
 import { ComponentSettingsContext } from './ComponentSettings';
 import { useControlledValue, useEventCallback, useMergeRefs } from './hooks';
 import { createFC } from './common';
@@ -185,6 +185,18 @@ const PicklistContext = createContext<{
   optionIdPrefix: '',
 });
 
+/**
+ *
+ */
+function useInitComponentStyle() {
+  useEffect(() => {
+    registerStyle('picklist', [
+      ['.react-picklist-input:focus-visible', '{ outline: none; }'],
+      ['.react-picklist-input:not(:disabled)', '{ cursor: pointer; }'],
+    ]);
+  }, []);
+}
+
 /**
  *
  */
@@ -262,6 +274,8 @@ export const Picklist: (<MultiSelect extends boolean | undefined>(
       ...rprops
     } = props;
 
+    useInitComponentStyle();
+
     const fallbackId = useId();
     const id = id_ ?? fallbackId;
     const listboxId = `${id}-listbox`;
@@ -557,6 +571,7 @@ export const Picklist: (<MultiSelect extends boolean | undefined>(
       }
     );
     const inputClassNames = classnames(
+      'react-picklist-input',
       'slds-input_faux',
       'slds-combobox__input',
       {