@bolttech/molecules-dropdown 0.24.0 → 0.25.0
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.
package/README.md
CHANGED
|
@@ -67,7 +67,6 @@ The **Dropdown** component accepts the following props:
|
|
|
67
67
|
| `onFocus` | `function` | Callback function triggered when the dropdown is focused. |
|
|
68
68
|
| `placeholder` | `string` | Placeholder text for the input. |
|
|
69
69
|
| `disableSearch` | `boolean` | Boolean that represent if we should disable user searching on the dropdown. Defaults to false |
|
|
70
|
-
| `selectMaxHeight` | `string` | An optional string to indicate the select height |
|
|
71
70
|
|
|
72
71
|
## Functionality
|
|
73
72
|
|
package/index.cjs
CHANGED
|
@@ -2690,10 +2690,9 @@ const Dropdown = /*#__PURE__*/react.forwardRef((_a, ref) => {
|
|
|
2690
2690
|
placeholder,
|
|
2691
2691
|
onKeyUp,
|
|
2692
2692
|
onKeyDown,
|
|
2693
|
-
selectMaxHeight,
|
|
2694
2693
|
disableSearch
|
|
2695
2694
|
} = _a,
|
|
2696
|
-
props = __rest(_a, ["label", "variant", "required", "optionList", "disabled", "errorMessage", "urlFilterOptions", "id", "dataTestId", "filterOptionsParam", "value", "onChange", "onBlur", "onFocus", "placeholder", "onKeyUp", "onKeyDown", "
|
|
2695
|
+
props = __rest(_a, ["label", "variant", "required", "optionList", "disabled", "errorMessage", "urlFilterOptions", "id", "dataTestId", "filterOptionsParam", "value", "onChange", "onBlur", "onFocus", "placeholder", "onKeyUp", "onKeyDown", "disableSearch"]);
|
|
2697
2696
|
const [isFirstRender, setIsFirstRender] = react.useState(true);
|
|
2698
2697
|
const [showSelectComponent, setShowSelectComponent] = react.useState(false);
|
|
2699
2698
|
const [currentOptionList, setCurrentOptionList] = react.useState([]);
|
|
@@ -2792,8 +2791,7 @@ const Dropdown = /*#__PURE__*/react.forwardRef((_a, ref) => {
|
|
|
2792
2791
|
}
|
|
2793
2792
|
},
|
|
2794
2793
|
active: internalSelectedOption,
|
|
2795
|
-
options: currentOptionList
|
|
2796
|
-
maxHeight: selectMaxHeight
|
|
2794
|
+
options: currentOptionList
|
|
2797
2795
|
}, uiUtils.applyDataAttributes(props, 'select')))
|
|
2798
2796
|
})]
|
|
2799
2797
|
}));
|
|
@@ -2817,10 +2815,9 @@ const DropdownWithHeaders = /*#__PURE__*/react.forwardRef((_a, ref) => {
|
|
|
2817
2815
|
placeholder,
|
|
2818
2816
|
onKeyUp,
|
|
2819
2817
|
onKeyDown,
|
|
2820
|
-
selectMaxHeight,
|
|
2821
2818
|
disableSearch
|
|
2822
2819
|
} = _a,
|
|
2823
|
-
props = __rest(_a, ["label", "variant", "required", "optionList", "disabled", "errorMessage", "urlFilterOptions", "dataTestId", "filterOptionsParam", "value", "onChange", "onBlur", "onFocus", "placeholder", "onKeyUp", "onKeyDown", "
|
|
2820
|
+
props = __rest(_a, ["label", "variant", "required", "optionList", "disabled", "errorMessage", "urlFilterOptions", "dataTestId", "filterOptionsParam", "value", "onChange", "onBlur", "onFocus", "placeholder", "onKeyUp", "onKeyDown", "disableSearch"]);
|
|
2824
2821
|
const [isFirstRender, setIsFirstRender] = react.useState(true);
|
|
2825
2822
|
const [showSelectComponent, setShowSelectComponent] = react.useState(false);
|
|
2826
2823
|
const [currentOptionList, setCurrentOptionList] = react.useState([]);
|
|
@@ -2918,8 +2915,7 @@ const DropdownWithHeaders = /*#__PURE__*/react.forwardRef((_a, ref) => {
|
|
|
2918
2915
|
(_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.blur();
|
|
2919
2916
|
},
|
|
2920
2917
|
active: internalSelectedOption,
|
|
2921
|
-
options: currentOptionList
|
|
2922
|
-
maxHeight: selectMaxHeight
|
|
2918
|
+
options: currentOptionList
|
|
2923
2919
|
}, uiUtils.applyDataAttributes(props, 'select')))
|
|
2924
2920
|
})]
|
|
2925
2921
|
}));
|
package/package.json
CHANGED
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@bolttech/molecules-dropdown",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.25.0",
|
|
4
4
|
"main": "./index.cjs",
|
|
5
5
|
"type": "commonjs",
|
|
6
6
|
"types": "./src/index.d.ts",
|
|
7
7
|
"dependencies": {
|
|
8
8
|
"@bolttech/atoms-icon": "0.22.1",
|
|
9
9
|
"@bolttech/atoms-input": "0.21.1",
|
|
10
|
-
"@bolttech/atoms-select": "0.
|
|
10
|
+
"@bolttech/atoms-select": "0.21.0",
|
|
11
11
|
"@bolttech/default-theme": "0.3.0",
|
|
12
|
-
"@bolttech/form-engine": "0.
|
|
12
|
+
"@bolttech/form-engine": "0.10.3",
|
|
13
13
|
"@bolttech/frontend-foundations": "0.3.1",
|
|
14
|
-
"@bolttech/ui-utils": "0.2.
|
|
14
|
+
"@bolttech/ui-utils": "0.2.4",
|
|
15
15
|
"react": "18.2.0",
|
|
16
16
|
"react-dom": "18.2.0",
|
|
17
17
|
"styled-components": "6.1.1"
|
|
@@ -10,7 +10,6 @@ export declare const DropdownWithHeaders: import("react").ForwardRefExoticCompon
|
|
|
10
10
|
required?: boolean | undefined;
|
|
11
11
|
variant?: import("./molecules-dropdown.type").StyleVariants | undefined;
|
|
12
12
|
disableSearch?: boolean | undefined;
|
|
13
|
-
selectMaxHeight?: string | undefined;
|
|
14
13
|
onBlur?: ((value?: unknown) => void) | ((evt: import("react").FocusEvent<HTMLElement, Element>) => void) | undefined;
|
|
15
14
|
onFocus?: ((value?: unknown) => void) | ((evt: import("react").FocusEvent<HTMLElement, Element>) => void) | undefined;
|
|
16
15
|
} & {
|
|
@@ -10,7 +10,6 @@ export declare const Dropdown: import("react").ForwardRefExoticComponent<Pick<im
|
|
|
10
10
|
required?: boolean | undefined;
|
|
11
11
|
variant?: import("./molecules-dropdown.type").StyleVariants | undefined;
|
|
12
12
|
disableSearch?: boolean | undefined;
|
|
13
|
-
selectMaxHeight?: string | undefined;
|
|
14
13
|
onBlur?: ((value?: unknown) => void) | ((evt: import("react").FocusEvent<HTMLElement, Element>) => void) | undefined;
|
|
15
14
|
onFocus?: ((value?: unknown) => void) | ((evt: import("react").FocusEvent<HTMLElement, Element>) => void) | undefined;
|
|
16
15
|
} & {
|
|
@@ -17,7 +17,6 @@ Default props for Dropdown component
|
|
|
17
17
|
@property required - An optional boolean to indicate if the dropdown is required
|
|
18
18
|
@property variant - An optional string to set the variant of the dropdown
|
|
19
19
|
@property disableSearch - An optional boolean representing if the user can type and mobile phones should show the keyboard
|
|
20
|
-
@property selectMaxHeight - An optional string to indicate the select height
|
|
21
20
|
*/
|
|
22
21
|
type DefaultDropdownProps = {
|
|
23
22
|
label: string;
|
|
@@ -29,7 +28,6 @@ type DefaultDropdownProps = {
|
|
|
29
28
|
required?: boolean;
|
|
30
29
|
variant?: StyleVariants;
|
|
31
30
|
disableSearch?: boolean;
|
|
32
|
-
selectMaxHeight?: string;
|
|
33
31
|
onBlur?: ((value?: unknown) => void) | ((evt: React.FocusEvent<HTMLElement, Element>) => void);
|
|
34
32
|
onFocus?: ((value?: unknown) => void) | ((evt: React.FocusEvent<HTMLElement, Element>) => void);
|
|
35
33
|
};
|
|
@@ -172,7 +170,7 @@ export type DropdownWithHeadersProps = Pick<DOMAttributes<HTMLInputElement>, 'on
|
|
|
172
170
|
@property setSelectedOptionOnInputValue - A function to set the selected option based on the input value
|
|
173
171
|
@property inputRef - A ref to the input element of the dropdown
|
|
174
172
|
*/
|
|
175
|
-
export type ReusableDropdownComponentProps = DefaultProps & Pick<DOMAttributes<HTMLInputElement>, 'onKeyUp' | 'onKeyDown'> &
|
|
173
|
+
export type ReusableDropdownComponentProps = DefaultProps & Pick<DOMAttributes<HTMLInputElement>, 'onKeyUp' | 'onKeyDown'> & DefaultDropdownProps & {
|
|
176
174
|
setShowSelectComponent: React.Dispatch<React.SetStateAction<boolean>>;
|
|
177
175
|
showSelectComponent: boolean;
|
|
178
176
|
onChangeInputValue: React.Dispatch<React.SetStateAction<string>>;
|