npm - @commercetools-uikit/creatable-select-input - Versions diffs - 13.0.2 → 14.0.1 - Mend

@commercetools-uikit/creatable-select-input 13.0.2 → 14.0.1

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 (6) hide show

package/README.md +10 -9
package/dist/commercetools-uikit-creatable-select-input.cjs.dev.js +41 -6
package/dist/commercetools-uikit-creatable-select-input.cjs.prod.js +41 -6
package/dist/commercetools-uikit-creatable-select-input.esm.js +42 -7
package/dist/declarations/src/creatable-select-input.d.ts +60 -1
package/package.json +12 -12

package/README.md CHANGED Viewed

@@ -61,6 +61,8 @@ export default Example;
 | `iconLeft`                | `ReactNode`                                                                                           |          |         | Icon to display on the left of the placeholder text and selected value. Has no effect when `isMulti` is enabled.                                                                                                                                                                                                                                                                            |
 | `aria-label`              | `CreatableProps['aria-label']`                                                                        |          |         | Aria label (for assistive tech)&#xA;<br>&#xA;[Props from React select was used](https://react-select.com/props#creatable-props)                                                                                                                                                                                                                                                             |
 | `aria-labelledby`         | `CreatableProps['aria-labelledby']`                                                                   |          |         | HTML ID of an element that should be used as the label (for assistive tech)&#xA;<br>&#xA;[Props from React select was used](https://react-select.com/props#creatable-props)                                                                                                                                                                                                                 |
+| `aria-invalid`            | `CreatableProps['aria-invalid']`                                                                      |          |         | Indicate if the value entered in the input is invalid.&#xA;<br>&#xA;[Props from React select was used](https://react-select.com/props)                                                                                                                                                                                                                                                      |
+| `aria-errormessage`       | `CreatableProps['aria-errormessage']`                                                                 |          |         | HTML ID of an element containing an error message related to the input.&#xA;<br>&#xA;[Props from React select was used](https://react-select.com/props)                                                                                                                                                                                                                                     |
 | `isAutofocussed`          | `boolean`                                                                                             |          |         | Focus the control when it is mounted                                                                                                                                                                                                                                                                                                                                                        |
 | `backspaceRemovesValue`   | `CreatableProps['backspaceRemovesValue']`                                                             |          |         | Remove the currently focused option when the user presses backspace&#xA;<br>&#xA;[Props from React select was used](https://react-select.com/props#creatable-props)                                                                                                                                                                                                                         |
 | `components`              | `CreatableProps['components']`                                                                        |          |         | Map of components to overwrite the default ones, see [what components you can override](https://react-select.com/components)&#xA;<br>&#xA;[Props from React select was used](https://react-select.com/props#creatable-props)                                                                                                                                                                |
@@ -124,36 +126,35 @@ The options support a `isDisabled` property which will render the option with a
 ### `isTouched(touched)`
-Expects to be called with an array or boolean.
-Returns `true` when truthy.
+Returns truthy value for the Formik `touched` value of this input field.
-### Components
+## Components
-It is possible to customize `SelectInput` by passing the `components` property.
-`SelectInput` exports the default underlying components as static exports.
+It is possible to customize `CreatableSelectInput` by passing the `components` property.
+`CreatableSelectInput` exports the default underlying components as static exports.
 Components available as static exports are:
 - `ClearIndicator`
 - `Control`
-- `DropdownIndicator`
-- `DownChevron`
 - `CrossIcon`
+- `DownChevron`
+- `DropdownIndicator`
 - `Group`
 - `GroupHeading`
 - `IndicatorsContainer`
 - `IndicatorSeparator`
 - `Input`
 - `LoadingIndicator`
+- `LoadingMessage`
 - `Menu`
 - `MenuList`
 - `MenuPortal`
-- `LoadingMessage`
-- `NoOptionsMessage`
 - `MultiValue`
 - `MultiValueContainer`
 - `MultiValueLabel`
 - `MultiValueRemove`
+- `NoOptionsMessage`
 - `Option`
 - `Placeholder`
 - `SelectContainer`

package/dist/commercetools-uikit-creatable-select-input.cjs.dev.js CHANGED Viewed

@@ -69,6 +69,8 @@ var CreatableSelectInput = function CreatableSelectInput(props) {
       children: jsxRuntime.jsx(CreatableSelect__default["default"], {
         "aria-label": props['aria-label'],
         "aria-labelledby": props['aria-labelledby'],
+        "aria-invalid": props['aria-invalid'],
+        "aria-errormessage": props['aria-errormessage'],
         autoFocus: props.isAutofocussed,
         backspaceRemovesValue: props.isReadOnly ? false : props.backspaceRemovesValue,
         components: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, customizedComponents), props.components), props.iconLeft && !props.isMulti ? selectUtils.customComponentsWithIcons : {}), props.isReadOnly ? {
@@ -191,21 +193,54 @@ CreatableSelectInput.propTypes = process.env.NODE_ENV !== "production" ? {
   }))]),
   showOptionGroupDivider: _pt__default["default"].bool
 } : {};
-CreatableSelectInput.displayName = 'CreatableSelectInput'; // Both "true" and an empty array [] represent a touched state. The Boolean
+CreatableSelectInput.displayName = 'CreatableSelectInput';
+CreatableSelectInput.defaultProps = defaultProps;
+/**
+ * Expose static helper methods.
+ */
+// Both "true" and an empty array [] represent a touched state. The Boolean
 // conveniently handles both cases
 CreatableSelectInput.isTouched = function (touched) {
   return Boolean(touched);
 };
+/**
+ * Expose react-select components for customization purposes.
+ */
+// custom
-CreatableSelectInput.defaultProps = defaultProps;
-utils.addStaticFields(CreatableSelectInput, _objectSpread(_objectSpread(_objectSpread({}, reactSelect.components), customizedComponents), {}, {
-  isTouched: CreatableSelectInput.isTouched
-}));
+CreatableSelectInput.ClearIndicator = customizedComponents.ClearIndicator;
+CreatableSelectInput.Control = reactSelect.components.Control;
+CreatableSelectInput.CrossIcon = reactSelect.components.CrossIcon;
+CreatableSelectInput.DownChevron = reactSelect.components.DownChevron; // custom
+CreatableSelectInput.DropdownIndicator = customizedComponents.DropdownIndicator;
+CreatableSelectInput.Group = reactSelect.components.Group;
+CreatableSelectInput.GroupHeading = reactSelect.components.GroupHeading;
+CreatableSelectInput.IndicatorSeparator = reactSelect.components.IndicatorSeparator;
+CreatableSelectInput.IndicatorsContainer = reactSelect.components.IndicatorsContainer;
+CreatableSelectInput.Input = reactSelect.components.Input;
+CreatableSelectInput.LoadingIndicator = reactSelect.components.LoadingIndicator;
+CreatableSelectInput.LoadingMessage = reactSelect.components.LoadingMessage;
+CreatableSelectInput.Menu = reactSelect.components.Menu;
+CreatableSelectInput.MenuList = reactSelect.components.MenuList;
+CreatableSelectInput.MenuPortal = reactSelect.components.MenuPortal;
+CreatableSelectInput.MultiValue = reactSelect.components.MultiValue;
+CreatableSelectInput.MultiValueContainer = reactSelect.components.MultiValueContainer;
+CreatableSelectInput.MultiValueLabel = reactSelect.components.MultiValueLabel; // custom
+CreatableSelectInput.MultiValueRemove = customizedComponents.MultiValueRemove;
+CreatableSelectInput.NoOptionsMessage = reactSelect.components.NoOptionsMessage;
+CreatableSelectInput.Option = reactSelect.components.Option;
+CreatableSelectInput.Placeholder = reactSelect.components.Placeholder;
+CreatableSelectInput.SelectContainer = reactSelect.components.SelectContainer;
+CreatableSelectInput.SingleValue = reactSelect.components.SingleValue;
+CreatableSelectInput.ValueContainer = reactSelect.components.ValueContainer;
 var CreatableSelectInput$1 = CreatableSelectInput;
 // NOTE: This string will be replaced on build time with the package version.
-var version = "13.0.2";
+var version = "14.0.1";
 exports["default"] = CreatableSelectInput$1;
 exports.version = version;

package/dist/commercetools-uikit-creatable-select-input.cjs.prod.js CHANGED Viewed

@@ -68,6 +68,8 @@ var CreatableSelectInput = function CreatableSelectInput(props) {
       children: jsxRuntime.jsx(CreatableSelect__default["default"], {
         "aria-label": props['aria-label'],
         "aria-labelledby": props['aria-labelledby'],
+        "aria-invalid": props['aria-invalid'],
+        "aria-errormessage": props['aria-errormessage'],
         autoFocus: props.isAutofocussed,
         backspaceRemovesValue: props.isReadOnly ? false : props.backspaceRemovesValue,
         components: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, customizedComponents), props.components), props.iconLeft && !props.isMulti ? selectUtils.customComponentsWithIcons : {}), props.isReadOnly ? {
@@ -172,21 +174,54 @@ var CreatableSelectInput = function CreatableSelectInput(props) {
 };
 CreatableSelectInput.propTypes = {};
-CreatableSelectInput.displayName = 'CreatableSelectInput'; // Both "true" and an empty array [] represent a touched state. The Boolean
+CreatableSelectInput.displayName = 'CreatableSelectInput';
+CreatableSelectInput.defaultProps = defaultProps;
+/**
+ * Expose static helper methods.
+ */
+// Both "true" and an empty array [] represent a touched state. The Boolean
 // conveniently handles both cases
 CreatableSelectInput.isTouched = function (touched) {
   return Boolean(touched);
 };
+/**
+ * Expose react-select components for customization purposes.
+ */
+// custom
-CreatableSelectInput.defaultProps = defaultProps;
-utils.addStaticFields(CreatableSelectInput, _objectSpread(_objectSpread(_objectSpread({}, reactSelect.components), customizedComponents), {}, {
-  isTouched: CreatableSelectInput.isTouched
-}));
+CreatableSelectInput.ClearIndicator = customizedComponents.ClearIndicator;
+CreatableSelectInput.Control = reactSelect.components.Control;
+CreatableSelectInput.CrossIcon = reactSelect.components.CrossIcon;
+CreatableSelectInput.DownChevron = reactSelect.components.DownChevron; // custom
+CreatableSelectInput.DropdownIndicator = customizedComponents.DropdownIndicator;
+CreatableSelectInput.Group = reactSelect.components.Group;
+CreatableSelectInput.GroupHeading = reactSelect.components.GroupHeading;
+CreatableSelectInput.IndicatorSeparator = reactSelect.components.IndicatorSeparator;
+CreatableSelectInput.IndicatorsContainer = reactSelect.components.IndicatorsContainer;
+CreatableSelectInput.Input = reactSelect.components.Input;
+CreatableSelectInput.LoadingIndicator = reactSelect.components.LoadingIndicator;
+CreatableSelectInput.LoadingMessage = reactSelect.components.LoadingMessage;
+CreatableSelectInput.Menu = reactSelect.components.Menu;
+CreatableSelectInput.MenuList = reactSelect.components.MenuList;
+CreatableSelectInput.MenuPortal = reactSelect.components.MenuPortal;
+CreatableSelectInput.MultiValue = reactSelect.components.MultiValue;
+CreatableSelectInput.MultiValueContainer = reactSelect.components.MultiValueContainer;
+CreatableSelectInput.MultiValueLabel = reactSelect.components.MultiValueLabel; // custom
+CreatableSelectInput.MultiValueRemove = customizedComponents.MultiValueRemove;
+CreatableSelectInput.NoOptionsMessage = reactSelect.components.NoOptionsMessage;
+CreatableSelectInput.Option = reactSelect.components.Option;
+CreatableSelectInput.Placeholder = reactSelect.components.Placeholder;
+CreatableSelectInput.SelectContainer = reactSelect.components.SelectContainer;
+CreatableSelectInput.SingleValue = reactSelect.components.SingleValue;
+CreatableSelectInput.ValueContainer = reactSelect.components.ValueContainer;
 var CreatableSelectInput$1 = CreatableSelectInput;
 // NOTE: This string will be replaced on build time with the package version.
-var version = "13.0.2";
+var version = "14.0.1";
 exports["default"] = CreatableSelectInput$1;
 exports.version = version;

package/dist/commercetools-uikit-creatable-select-input.esm.js CHANGED Viewed

@@ -14,7 +14,7 @@ import { useTheme } from '@emotion/react';
 import { components } from 'react-select';
 import CreatableSelect from 'react-select/creatable';
 import Constraints from '@commercetools-uikit/constraints';
-import { filterDataAttributes, addStaticFields } from '@commercetools-uikit/utils';
+import { filterDataAttributes } from '@commercetools-uikit/utils';
 import { messages, customComponentsWithIcons, createSelectStyles, DropdownIndicator, ClearIndicator, TagRemove } from '@commercetools-uikit/select-utils';
 import { jsx } from '@emotion/react/jsx-runtime';
@@ -50,6 +50,8 @@ var CreatableSelectInput = function CreatableSelectInput(props) {
       children: jsx(CreatableSelect, {
         "aria-label": props['aria-label'],
         "aria-labelledby": props['aria-labelledby'],
+        "aria-invalid": props['aria-invalid'],
+        "aria-errormessage": props['aria-errormessage'],
         autoFocus: props.isAutofocussed,
         backspaceRemovesValue: props.isReadOnly ? false : props.backspaceRemovesValue,
         components: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, customizedComponents), props.components), props.iconLeft && !props.isMulti ? customComponentsWithIcons : {}), props.isReadOnly ? {
@@ -172,20 +174,53 @@ CreatableSelectInput.propTypes = process.env.NODE_ENV !== "production" ? {
   }))]),
   showOptionGroupDivider: _pt.bool
 } : {};
-CreatableSelectInput.displayName = 'CreatableSelectInput'; // Both "true" and an empty array [] represent a touched state. The Boolean
+CreatableSelectInput.displayName = 'CreatableSelectInput';
+CreatableSelectInput.defaultProps = defaultProps;
+/**
+ * Expose static helper methods.
+ */
+// Both "true" and an empty array [] represent a touched state. The Boolean
 // conveniently handles both cases
 CreatableSelectInput.isTouched = function (touched) {
   return Boolean(touched);
 };
+/**
+ * Expose react-select components for customization purposes.
+ */
+// custom
-CreatableSelectInput.defaultProps = defaultProps;
-addStaticFields(CreatableSelectInput, _objectSpread(_objectSpread(_objectSpread({}, components), customizedComponents), {}, {
-  isTouched: CreatableSelectInput.isTouched
-}));
+CreatableSelectInput.ClearIndicator = customizedComponents.ClearIndicator;
+CreatableSelectInput.Control = components.Control;
+CreatableSelectInput.CrossIcon = components.CrossIcon;
+CreatableSelectInput.DownChevron = components.DownChevron; // custom
+CreatableSelectInput.DropdownIndicator = customizedComponents.DropdownIndicator;
+CreatableSelectInput.Group = components.Group;
+CreatableSelectInput.GroupHeading = components.GroupHeading;
+CreatableSelectInput.IndicatorSeparator = components.IndicatorSeparator;
+CreatableSelectInput.IndicatorsContainer = components.IndicatorsContainer;
+CreatableSelectInput.Input = components.Input;
+CreatableSelectInput.LoadingIndicator = components.LoadingIndicator;
+CreatableSelectInput.LoadingMessage = components.LoadingMessage;
+CreatableSelectInput.Menu = components.Menu;
+CreatableSelectInput.MenuList = components.MenuList;
+CreatableSelectInput.MenuPortal = components.MenuPortal;
+CreatableSelectInput.MultiValue = components.MultiValue;
+CreatableSelectInput.MultiValueContainer = components.MultiValueContainer;
+CreatableSelectInput.MultiValueLabel = components.MultiValueLabel; // custom
+CreatableSelectInput.MultiValueRemove = customizedComponents.MultiValueRemove;
+CreatableSelectInput.NoOptionsMessage = components.NoOptionsMessage;
+CreatableSelectInput.Option = components.Option;
+CreatableSelectInput.Placeholder = components.Placeholder;
+CreatableSelectInput.SelectContainer = components.SelectContainer;
+CreatableSelectInput.SingleValue = components.SingleValue;
+CreatableSelectInput.ValueContainer = components.ValueContainer;
 var CreatableSelectInput$1 = CreatableSelectInput;
 // NOTE: This string will be replaced on build time with the package version.
-var version = "13.0.2";
+var version = "14.0.1";
 export { CreatableSelectInput$1 as default, version };

package/dist/declarations/src/creatable-select-input.d.ts CHANGED Viewed

@@ -23,6 +23,8 @@ declare type TCreatableSelectInputProps = {
     iconLeft?: ReactNode;
     'aria-label'?: ReactSelectCreatableProps['aria-label'];
     'aria-labelledby'?: ReactSelectCreatableProps['aria-labelledby'];
+    'aria-invalid'?: ReactSelectCreatableProps['aria-invalid'];
+    'aria-errormessage'?: ReactSelectCreatableProps['aria-errormessage'];
     isAutofocussed?: boolean;
     backspaceRemovesValue?: ReactSelectCreatableProps['backspaceRemovesValue'];
     components?: ReactSelectCreatableProps['components'];
@@ -62,7 +64,64 @@ declare type TCreatableSelectInputProps = {
 declare const CreatableSelectInput: {
     (props: TCreatableSelectInputProps): import("@emotion/react/jsx-runtime").JSX.Element;
     displayName: string;
-    isTouched(touched: unknown): boolean;
     defaultProps: Pick<TCreatableSelectInputProps, "value" | "isSearchable" | "menuPortalZIndex">;
+    isTouched(touched: unknown): boolean;
+    ClearIndicator: {
+        (props: {
+            innerProps: {
+                ref: import("react").LegacyRef<HTMLButtonElement>;
+            } & import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement>;
+        } & import("react-select").ClearIndicatorProps<unknown, boolean, GroupBase<unknown>>): import("@emotion/react/jsx-runtime").JSX.Element;
+        displayName: string;
+    };
+    Control: <Option_1, IsMulti_1 extends boolean, Group_1 extends GroupBase<Option_1>>(props: import("react-select").ControlProps<Option_1, IsMulti_1, Group_1>) => import("@emotion/react").jsx.JSX.Element;
+    CrossIcon: (props: import("react-select/dist/declarations/src/components/indicators").CrossIconProps) => import("@emotion/react").jsx.JSX.Element;
+    DownChevron: (props: import("react-select/dist/declarations/src/components/indicators").DownChevronProps) => import("@emotion/react").jsx.JSX.Element;
+    DropdownIndicator: {
+        (props: import("react-select").DropdownIndicatorProps<unknown, boolean, GroupBase<unknown>>): import("@emotion/react/jsx-runtime").JSX.Element;
+        displayName: string;
+    };
+    Group: <Option_3, IsMulti_3 extends boolean, Group_3 extends GroupBase<Option_3>>(props: import("react-select").GroupProps<Option_3, IsMulti_3, Group_3>) => import("@emotion/react").jsx.JSX.Element;
+    GroupHeading: <Option_4, IsMulti_4 extends boolean, Group_4 extends GroupBase<Option_4>>(props: import("react-select").GroupHeadingProps<Option_4, IsMulti_4, Group_4>) => import("@emotion/react").jsx.JSX.Element;
+    IndicatorSeparator: <Option_6, IsMulti_6 extends boolean, Group_6 extends GroupBase<Option_6>>(props: import("react-select").IndicatorSeparatorProps<Option_6, IsMulti_6, Group_6>) => import("@emotion/react").jsx.JSX.Element;
+    IndicatorsContainer: <Option_5, IsMulti_5 extends boolean, Group_5 extends GroupBase<Option_5>>(props: import("react-select").IndicatorsContainerProps<Option_5, IsMulti_5, Group_5>) => import("@emotion/react").jsx.JSX.Element;
+    Input: <Option_7, IsMulti_7 extends boolean, Group_7 extends GroupBase<Option_7>>(props: import("react-select").InputProps<Option_7, IsMulti_7, Group_7>) => import("@emotion/react").jsx.JSX.Element;
+    LoadingIndicator: {
+        <Option_8, IsMulti_8 extends boolean, Group_8 extends GroupBase<Option_8>>(props: import("react-select").LoadingIndicatorProps<Option_8, IsMulti_8, Group_8>): import("@emotion/react").jsx.JSX.Element;
+        defaultProps: {
+            size: number;
+        };
+    };
+    LoadingMessage: {
+        <Option_11, IsMulti_11 extends boolean, Group_11 extends GroupBase<Option_11>>(props: import("react-select").NoticeProps<Option_11, IsMulti_11, Group_11>): import("@emotion/react").jsx.JSX.Element;
+        defaultProps: {
+            children: string;
+        };
+    };
+    Menu: <Option_9, IsMulti_9 extends boolean, Group_9 extends GroupBase<Option_9>>(props: import("react-select").MenuProps<Option_9, IsMulti_9, Group_9>) => import("@emotion/react").jsx.JSX.Element;
+    MenuList: <Option_10, IsMulti_10 extends boolean, Group_10 extends GroupBase<Option_10>>(props: import("react-select").MenuListProps<Option_10, IsMulti_10, Group_10>) => import("@emotion/react").jsx.JSX.Element;
+    MenuPortal: typeof import("react-select/dist/declarations/src/components/Menu").MenuPortal;
+    MultiValue: <Option_13, IsMulti_13 extends boolean, Group_13 extends GroupBase<Option_13>>(props: import("react-select").MultiValueProps<Option_13, IsMulti_13, Group_13>) => import("@emotion/react").jsx.JSX.Element;
+    MultiValueContainer: <Option_14, IsMulti_14 extends boolean, Group_14 extends GroupBase<Option_14>>({ children, innerProps, }: import("react-select").MultiValueGenericProps<Option_14, IsMulti_14, Group_14>) => import("@emotion/react").jsx.JSX.Element;
+    MultiValueLabel: <Option_14_1, IsMulti_14_1 extends boolean, Group_14_1 extends GroupBase<Option_14_1>>({ children, innerProps, }: import("react-select").MultiValueGenericProps<Option_14_1, IsMulti_14_1, Group_14_1>) => import("@emotion/react").jsx.JSX.Element;
+    MultiValueRemove: {
+        (props: {
+            selectProps: {
+                isReadOnly: boolean;
+            } & import("react-select/dist/declarations/src/Select").Props<unknown, boolean, GroupBase<unknown>>;
+        } & import("react-select").MultiValueGenericProps<unknown, boolean, GroupBase<unknown>>): import("@emotion/react/jsx-runtime").JSX.Element;
+        displayName: string;
+    };
+    NoOptionsMessage: {
+        <Option_12, IsMulti_12 extends boolean, Group_12 extends GroupBase<Option_12>>(props: import("react-select").NoticeProps<Option_12, IsMulti_12, Group_12>): import("@emotion/react").jsx.JSX.Element;
+        defaultProps: {
+            children: string;
+        };
+    };
+    Option: <Option_15, IsMulti_15 extends boolean, Group_15 extends GroupBase<Option_15>>(props: import("react-select").OptionProps<Option_15, IsMulti_15, Group_15>) => import("@emotion/react").jsx.JSX.Element;
+    Placeholder: <Option_16, IsMulti_16 extends boolean, Group_16 extends GroupBase<Option_16>>(props: import("react-select").PlaceholderProps<Option_16, IsMulti_16, Group_16>) => import("@emotion/react").jsx.JSX.Element;
+    SelectContainer: <Option_17, IsMulti_17 extends boolean, Group_17 extends GroupBase<Option_17>>(props: import("react-select").ContainerProps<Option_17, IsMulti_17, Group_17>) => import("@emotion/react").jsx.JSX.Element;
+    SingleValue: <Option_18, IsMulti_18 extends boolean, Group_18 extends GroupBase<Option_18>>(props: import("react-select").SingleValueProps<Option_18, IsMulti_18, Group_18>) => import("@emotion/react").jsx.JSX.Element;
+    ValueContainer: <Option_19, IsMulti_19 extends boolean, Group_19 extends GroupBase<Option_19>>(props: import("react-select").ValueContainerProps<Option_19, IsMulti_19, Group_19>) => import("@emotion/react").jsx.JSX.Element;
 };
 export default CreatableSelectInput;

package/package.json CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "name": "@commercetools-uikit/creatable-select-input",
   "description": "An input component getting a selection from the user, and where options can also be created by the user.",
-  "version": "13.0.2",
+  "version": "14.0.1",
   "bugs": "https://github.com/commercetools/ui-kit/issues",
   "repository": {
     "type": "git",
@@ -9,7 +9,7 @@
     "directory": "packages/components/inputs/creatable-select-input"
   },
   "homepage": "https://uikit.commercetools.com",
-  "keywords": ["javascript", "design system", "react", "uikit"],
+  "keywords": ["javascript", "typescript", "design-system", "react", "uikit"],
   "license": "MIT",
   "publishConfig": {
     "access": "public"
@@ -19,15 +19,15 @@
   "module": "dist/commercetools-uikit-creatable-select-input.esm.js",
   "files": ["dist"],
   "dependencies": {
-    "@babel/runtime": "7.17.2",
-    "@babel/runtime-corejs3": "7.17.2",
-    "@commercetools-uikit/constraints": "13.0.2",
-    "@commercetools-uikit/design-system": "13.0.0",
-    "@commercetools-uikit/icons": "13.0.2",
-    "@commercetools-uikit/select-utils": "13.0.2",
-    "@commercetools-uikit/spacings": "13.0.2",
-    "@commercetools-uikit/text": "13.0.2",
-    "@commercetools-uikit/utils": "13.0.2",
+    "@babel/runtime": "^7.17.2",
+    "@babel/runtime-corejs3": "^7.17.2",
+    "@commercetools-uikit/constraints": "14.0.1",
+    "@commercetools-uikit/design-system": "14.0.0",
+    "@commercetools-uikit/icons": "14.0.1",
+    "@commercetools-uikit/select-utils": "14.0.1",
+    "@commercetools-uikit/spacings": "14.0.1",
+    "@commercetools-uikit/text": "14.0.1",
+    "@commercetools-uikit/utils": "14.0.1",
     "@emotion/react": "^11.4.0",
     "@emotion/styled": "^11.3.0",
     "lodash": "4.17.21",
@@ -37,7 +37,7 @@
   "devDependencies": {
     "react": "17.0.2",
     "react-dom": "17.0.2",
-    "react-intl": "5.24.6"
+    "react-intl": "^5.24.6"
   },
   "peerDependencies": {
     "react": "17.x",