@commercetools-uikit/selectable-search-input 19.9.0 → 19.10.0

package/dist/commercetools-uikit-selectable-search-input.cjs.dev.js

@@ -582,7 +582,7 @@ SelectableSearchInput.getDropdownId = getDropdownName;
 var SelectableSearchInput$1 = SelectableSearchInput;
 
 // NOTE: This string will be replaced on build time with the package version.
-var version = "19.9.0";
+var version = "19.10.0";
 
 exports["default"] = SelectableSearchInput$1;
 exports.version = version;

package/dist/commercetools-uikit-selectable-search-input.cjs.prod.js

@@ -516,7 +516,7 @@ SelectableSearchInput.getDropdownId = getDropdownName;
 var SelectableSearchInput$1 = SelectableSearchInput;
 
 // NOTE: This string will be replaced on build time with the package version.
-var version = "19.9.0";
+var version = "19.10.0";
 
 exports["default"] = SelectableSearchInput$1;
 exports.version = version;

package/dist/commercetools-uikit-selectable-search-input.esm.js

@@ -555,6 +555,6 @@ SelectableSearchInput.getDropdownId = getDropdownName;
 var SelectableSearchInput$1 = SelectableSearchInput;
 
 // NOTE: This string will be replaced on build time with the package version.
-var version = "19.9.0";
+var version = "19.10.0";
 
 export { SelectableSearchInput$1 as default, version };

package/dist/declarations/src/selectable-search-input.d.ts

@@ -22,42 +22,176 @@ export type TOptionObject = {
 };
 export type TOptions = TOption[] | TOptionObject[];
 export type TSelectableSearchInputProps = {
+    /**
+     * Used as HTML id property. An id is auto-generated when it is not specified.
+     */
     id?: string;
+    /**
+     * Used as HTML autocomplete property
+     */
     autoComplete?: string;
+    /**
+     * Indicate if the value entered in the input is invalid.
+     */
     'aria-invalid'?: boolean;
+    /**
+     * HTML ID of an element containing an error message related to the input.
+     */
     'aria-errormessage'?: string;
+    /**
+     * Used as HTML name of the input component property.
+     */
     name?: string;
+    /**
+     * Value of the input. Consists of text input and selected option.
+     */
     value: TValue;
     _experimentalValue?: TValue;
+    /**
+     * Called with the event of the input or dropdown when either the selectable dropdown or the text input have changed.
+     * The change event from the text input has a suffix of `.textInput` and the change event from the dropdown has a suffix of `.dropdown`.
+     */
     onChange?: (event: TCustomEvent) => void;
+    /**
+     * Called when input is blurred
+     */
     onBlur?: (event: TCustomEvent) => void;
+    /**
+     * Called when input is focused
+     */
     onFocus?: (event: TCustomEvent) => void;
+    /**
+     * Handler when the search button is clicked.
+     */
     onSubmit: (value: TValue) => void;
+    /**
+     * Handler when the clear button is clicked.
+     */
     onReset?: () => void;
+    /**
+     * Focus the input on initial render
+     */
     isAutofocussed?: boolean;
+    /**
+     * Indicates that the input cannot be modified (e.g not authorized, or changes currently saving).
+     */
     isDisabled?: boolean;
+    /**
+     * Indicates that the field is displaying read-only content
+     */
     isReadOnly?: boolean;
+    /**
+     * Indicates if the input has invalid values
+     */
     hasError?: boolean;
+    /**
+     * Indicates if the input has warning values
+     */
     hasWarning?: boolean;
+    /**
+     * Placeholder text for the input
+     */
     placeholder?: string;
+    /**
+     * Indicates if the input should be cleared when the clear button is clicked.
+     * Defaults to true.
+     *
+     */
     isClearable?: boolean;
+    /**
+     * Use this property to reduce the paddings of the component for a ui compact variant
+     */
     isCondensed?: boolean;
+    /**
+     * Horizontal size limit of the input fields.
+     */
     horizontalConstraint?: 10 | 11 | 12 | 13 | 14 | 15 | 16 | 'scale' | 'auto';
+    /**
+     * Array of options that populate the select menu
+     */
     options: TOptions;
+    /**
+     * z-index value for the menu portal
+     * <br>
+     * Use in conjunction with `menuPortalTarget`
+     */
     menuPortalZIndex?: number;
+    /**
+     * Dom element to portal the select menu to
+     * <br>
+     * [Props from React select was used](https://react-select.com/props)
+     */
     menuPortalTarget?: ReactSelectProps['menuPortalTarget'];
+    /**
+     * whether the menu should block scroll while open
+     * <br>
+     * [Props from React select was used](https://react-select.com/props)
+     */
     menuShouldBlockScroll?: ReactSelectProps['menuShouldBlockScroll'];
+    /**
+     * Handle change events on the menu input
+     * <br>
+     * [Props from React select was used](https://react-select.com/props)
+     */
     onMenuInputChange?: ReactSelectProps['onInputChange'];
+    /**
+     * Can be used to render a custom value when there are no options (either because of no search results, or all options have been used, or there were none in the first place). Gets called with { inputValue: String }.
+     * <br />
+     * `inputValue` will be an empty string when no search text is present.
+     * <br>
+     * [Props from React select was used](https://react-select.com/props)
+     */
     noMenuOptionsMessage?: ReactSelectProps['noOptionsMessage'];
+    /**
+     * Whether to enable search functionality.
+     * <br>
+     * [Props from React select was used](https://react-select.com/props)
+     */
     isMenuSearchable?: ReactSelectProps['isSearchable'];
+    /**
+     * Maximum height of the menu before scrolling
+     * <br>
+     * [Props from React select was used](https://react-select.com/props)
+     */
     maxMenuHeight?: ReactSelectProps['maxMenuHeight'];
+    /**
+     * Whether the menu should close after a value is selected. Defaults to `true`.
+     * <br>
+     * [Props from React select was used](https://react-select.com/props)
+     */
     closeMenuOnSelect?: ReactSelectProps['closeMenuOnSelect'];
+    /**
+     * Horizontal size limit for the dropdown menu.
+     */
     menuHorizontalConstraint?: 3 | 4 | 5;
+    /**
+     * Show submit button in the input
+     */
     showSubmitButton?: boolean;
+    /**
+     *  used to pass data-* props to the select component.
+     * eg: selectDataProps={[{ 'prop-1': 'value-1' }, { 'prop-2': 'value-2' }]}
+     */
     selectDataProps?: Record<string, string>;
+    /**
+     *  used to pass data-* props to the input element.
+     * eg: inputDataProps={[{ 'prop-1': 'value-1' }, { 'prop-2': 'value-2' }]}
+     */
     inputDataProps?: Record<string, string>;
+    /**
+     * Map of components to overwrite the default ones, see what components you can override
+     * <br/>
+     * [Props from React select was used](https://react-select.com/props)
+     */
     selectCustomComponents?: ReactSelectProps['components'];
+    /**
+     * Custom action icon to be displayed on the right side of the input.
+     */
     rightActionIcon?: ReactElement;
+    /**
+     * Props for the right-action icon-button. Required when rightActionIcon is provided.
+     * At least a `label` and an `onClick` prop/function need to be provided.
+     */
     rightActionProps?: TIconButtonProps;
 };
 declare const SelectableSearchInput: {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@commercetools-uikit/selectable-search-input",
   "description": "A controlled selectable search input component for single-line strings with validation states.",
-  "version": "19.9.0",
+  "version": "19.10.0",
   "bugs": "https://github.com/commercetools/ui-kit/issues",
   "repository": {
     "type": "git",
@@ -21,15 +21,15 @@
   "dependencies": {
     "@babel/runtime": "^7.20.13",
     "@babel/runtime-corejs3": "^7.20.13",
-    "@commercetools-uikit/constraints": "19.9.0",
-    "@commercetools-uikit/design-system": "19.9.0",
-    "@commercetools-uikit/hooks": "19.9.0",
-    "@commercetools-uikit/icon-button": "19.9.0",
-    "@commercetools-uikit/icons": "19.9.0",
-    "@commercetools-uikit/input-utils": "19.9.0",
-    "@commercetools-uikit/secondary-icon-button": "19.9.0",
-    "@commercetools-uikit/select-utils": "19.9.0",
-    "@commercetools-uikit/utils": "19.9.0",
+    "@commercetools-uikit/constraints": "19.10.0",
+    "@commercetools-uikit/design-system": "19.10.0",
+    "@commercetools-uikit/hooks": "19.10.0",
+    "@commercetools-uikit/icon-button": "19.10.0",
+    "@commercetools-uikit/icons": "19.10.0",
+    "@commercetools-uikit/input-utils": "19.10.0",
+    "@commercetools-uikit/secondary-icon-button": "19.10.0",
+    "@commercetools-uikit/select-utils": "19.10.0",
+    "@commercetools-uikit/utils": "19.10.0",
     "@emotion/react": "^11.10.5",
     "@emotion/styled": "^11.10.5",
     "lodash": "4.17.21",