@moda/om 21.6.1 → 21.6.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/dist/index.cjs.js +16 -5
  2. package/dist/index.cjs.js.map +1 -1
  3. package/dist/index.esm.js +16 -5
  4. package/dist/index.esm.js.map +1 -1
  5. package/dist/src/components/Select/Select.d.ts +1 -0
  6. package/dist/src/components/Select/SelectOptions.d.ts +1 -0
  7. package/package.json +1 -1
  8. package/src/components/Select/Select.tsx +2 -0
  9. package/src/components/Select/SelectOptions.tsx +8 -1
  10. package/src/components/Select/useSelect.ts +1 -1
package/dist/src/components/Select/Select.d.ts CHANGED
@@ -5,6 +5,7 @@ export type SelectExtraOption = {
5
5
  callback: (event?: React.MouseEvent<HTMLButtonElement>) => void;
6
6
  disabled?: boolean;
7
7
  label: string;
8
+ closeOnClick?: boolean;
8
9
  };
9
10
  export type SelectableOption = {
10
11
  value: string;
package/dist/src/components/Select/SelectOptions.d.ts CHANGED
@@ -11,5 +11,6 @@ export type SelectOptionsProps = Omit<React.HTMLAttributes<HTMLUListElement>, 'o
11
11
  onSelect(option: SelectableOption): void;
12
12
  dataTestId?: string;
13
13
  extraOption?: SelectExtraOption;
14
+ onCloseDropdown?: () => void;
14
15
  };
15
16
  export declare const SelectOptions: React.FC<SelectOptionsProps>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@moda/om",
3
- "version": "21.6.1",
3
+ "version": "21.6.3",
4
4
  "description": "Moda Operandi design system",
5
5
  "main": "dist/index.cjs.js",
6
6
  "module": "dist/index.esm.js",
package/src/components/Select/Select.tsx CHANGED
@@ -15,6 +15,7 @@ export type SelectExtraOption = {
15
15
  callback: (event?: React.MouseEvent<HTMLButtonElement>) => void;
16
16
  disabled?: boolean;
17
17
  label: string;
18
+ closeOnClick?: boolean;
18
19
  };
19
20
 
20
21
  export type SelectableOption = {
@@ -181,6 +182,7 @@ export const Select: React.FC<SelectProps> = ({
181
182
  onFocus={handleFocus}
182
183
  selectedOption={selected}
183
184
  extraOption={extraOption}
185
+ onCloseDropdown={() => dispatch({ type: 'CLOSE' })}
184
186
  />
185
187
  )}
186
188
  </div>
package/src/components/Select/SelectOptions.tsx CHANGED
@@ -23,6 +23,7 @@ export type SelectOptionsProps = Omit<
23
23
  onSelect(option: SelectableOption): void;
24
24
  dataTestId?: string;
25
25
  extraOption?: SelectExtraOption;
26
+ onCloseDropdown?: () => void;
26
27
  };
27
28
 
28
29
  export const SelectOptions: React.FC<SelectOptionsProps> = ({
@@ -36,6 +37,7 @@ export const SelectOptions: React.FC<SelectOptionsProps> = ({
36
37
  className,
37
38
  dataTestId,
38
39
  extraOption,
40
+ onCloseDropdown,
39
41
  ...rest
40
42
  }) => {
41
43
  const [searchPhrase, setSearchPhrase] = useState('');
@@ -100,7 +102,12 @@ export const SelectOptions: React.FC<SelectOptionsProps> = ({
100
102
  <ControlLink
101
103
  className='SelectOptions__extra-option'
102
104
  disabled={extraOption.disabled}
103
- onClick={extraOption.callback}
105
+ onClick={(event: React.MouseEvent<HTMLButtonElement>) => {
106
+ extraOption.callback(event);
107
+ if (extraOption.closeOnClick) {
108
+ onCloseDropdown?.();
109
+ }
110
+ }}
104
111
  >
105
112
  {extraOption.label}
106
113
  </ControlLink>
package/src/components/Select/useSelect.ts CHANGED
@@ -78,7 +78,7 @@ export const useSelect = ({ value, defaultValue }: UseSelectProps) => {
78
78
  }, [handleKeyDown]);
79
79
 
80
80
  useUpdateEffect(() => {
81
- if (value) dispatch({ type: 'SELECT', payload: { value } });
81
+ dispatch({ type: 'SELECT', payload: { value: value ?? '' } });
82
82
  }, [value]);
83
83
 
84
84
  return { state, dispatch, Mode, selectRef };