@commonsku/styles 1.15.1 → 1.16.1

package/dist/index.d.ts

@@ -2,11 +2,14 @@
 import React$1, { CSSProperties, Component, ReactNode, WeakValidationMap, ComponentType } from 'react';
 import { FlattenInterpolation, ThemedStyledProps, StyledComponent, CSSObject, FlattenSimpleInterpolation, GlobalStyleComponent, DefaultTheme, ThemeProps, Keyframes, AnyStyledComponent, StyledComponentInnerComponent } from 'styled-components';
 import { DropzoneOptions } from 'react-dropzone';
-import BaseSelect, { Props } from 'react-select';
+import { AsyncAdditionalProps } from 'react-select/dist/declarations/src/useAsync';
+import { CreatableAdditionalProps } from 'react-select/dist/declarations/src/useCreatable';
+import { StateManagerAdditionalProps } from 'react-select/dist/declarations/src/useStateManager';
+import { GroupBase, GetOptionLabel, GetOptionValue, Options, MenuPlacement, MenuPosition, OptionsOrGroups, StylesConfig, SelectInstance } from 'react-select';
 export { components, createFilter, mergeStyles } from 'react-select';
-import BaseCreatableSelect, { Props as Props$2 } from 'react-select/creatable';
-export { makeCreatableSelect } from 'react-select/creatable';
-import BaseAsyncSelect, { Props as Props$1 } from 'react-select/async';
+import { FilterOptionOption } from 'react-select/dist/declarations/src/filters';
+import { SelectComponents } from 'react-select/dist/declarations/src/components';
+import { Props } from 'react-select/dist/declarations/src/Select';
 import BaseDatePicker, { ReactDatePickerProps } from 'react-datepicker';
 import { UseFiltersColumnProps, UseGroupByColumnProps, UseResizeColumnsColumnProps, UseSortByColumnProps, UseTableRowProps, UseExpandedRowProps, UseGroupByRowProps, UseRowSelectRowProps, UseRowStateRowProps, Column as Column$1, SortingRule, Cell } from 'react-table';
 import { ListOnScrollProps } from 'react-window';
@@ -385,7 +388,7 @@ declare type RadioIconProps = SVGIconProps & {
 };
 declare function RadioIcon({ color, hoverColor, disabledColor, size, hover, selected, disabled, altText, ...props }: RadioIconProps): JSX.Element;
 
-declare type CheckboxIconProps = SVGIconProps & {
+declare type BaseCheckboxIconProps = {
     selected?: boolean;
     hover?: boolean;
     hoverColor?: string;
@@ -393,6 +396,7 @@ declare type CheckboxIconProps = SVGIconProps & {
     disabledColor?: string;
     indeterminate?: boolean;
 };
+declare type CheckboxIconProps = SVGIconProps & BaseCheckboxIconProps;
 declare function CheckboxIcon({ color, hoverColor, disabledColor, size, hover, selected, disabled, indeterminate, altText, ...props }: CheckboxIconProps): JSX.Element;
 
 declare type CommonInputProp = {
@@ -492,6 +496,7 @@ declare type LabeledCheckboxProps = {
     stopPropagation?: boolean;
     labelProps?: React$1.LabelHTMLAttributes<HTMLLabelElement>;
     checkboxIconProps?: CheckboxIconProps;
+    indeterminate?: boolean;
     [key: string]: any;
 } & React$1.InputHTMLAttributes<HTMLInputElement>;
 declare const LabeledCheckbox: React$1.ForwardRefExoticComponent<LabeledCheckboxProps>;
@@ -522,32 +527,552 @@ declare type AdditionalSKUSelectProps = {
     menuRelative?: boolean;
     inPopup?: boolean;
 };
-declare type GenericObject = {
-    [key: string]: any;
-};
-declare type SKUSelectProps = AdditionalSKUSelectProps & Props;
-declare type SKUAsyncSelectProps = AdditionalSKUSelectProps & Props$1<GenericObject>;
-declare type SKUCreatableSelectProps = AdditionalSKUSelectProps & Props$2<GenericObject>;
-declare const SKUSelect: React$1.ForwardRefExoticComponent<SKUSelectProps & React$1.RefAttributes<BaseSelect>>;
-declare type LabeledSelectProp = SKUSelectProps & {
-    parentStyle?: React$1.CSSProperties;
-};
-declare type TLabeledSelect = React$1.ForwardRefExoticComponent<LabeledSelectProp & React$1.RefAttributes<BaseSelect>>;
-declare const LabeledSelect: TLabeledSelect;
-declare type TSKUCreatableSelect = React$1.ForwardRefExoticComponent<SKUCreatableSelectProps & React$1.RefAttributes<BaseCreatableSelect<GenericObject>>>;
-declare const SKUCreatableSelect: TSKUCreatableSelect;
-declare type LabeledCreatableSelectProps = SKUCreatableSelectProps & {
-    parentStyle?: React$1.CSSProperties;
-};
-declare type TLabeledCreatableSelect = React$1.ForwardRefExoticComponent<LabeledCreatableSelectProps & React$1.RefAttributes<BaseCreatableSelect<GenericObject>>>;
-declare const LabeledCreatableSelect: TLabeledCreatableSelect;
-declare type TSKUAsyncSelect = React$1.ForwardRefExoticComponent<SKUAsyncSelectProps & React$1.RefAttributes<BaseAsyncSelect<GenericObject>>>;
-declare const SKUAsyncSelect: TSKUAsyncSelect;
-declare type LabeledAsyncSelectProps = SKUAsyncSelectProps & {
-    parentStyle?: React$1.CSSProperties;
-};
-declare type TLabeledAsyncSelect = React$1.ForwardRefExoticComponent<LabeledAsyncSelectProps & React$1.RefAttributes<BaseAsyncSelect<GenericObject>>>;
-declare const LabeledAsyncSelect: TLabeledAsyncSelect;
+declare const SKUSelect: React$1.ForwardRefExoticComponent<AdditionalSKUSelectProps & Omit<Pick<Props<unknown, boolean, GroupBase<unknown>>, "aria-errormessage" | "aria-invalid" | "aria-label" | "aria-labelledby" | "ariaLiveMessages" | "autoFocus" | "className" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "id" | "inputValue" | "inputId" | "instanceId" | "isClearable" | "isOptionSelected" | "menuPortalTarget" | "name" | "onBlur" | "onChange" | "onFocus" | "onInputChange" | "onKeyDown" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom" | "theme" | "value" | "form"> & {
+    'aria-live'?: "off" | "assertive" | "polite" | undefined;
+    backspaceRemovesValue?: boolean | undefined;
+    blurInputOnSelect?: boolean | undefined;
+    captureMenuScroll?: boolean | undefined;
+    closeMenuOnSelect?: boolean | undefined;
+    closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
+    components?: Partial<SelectComponents<unknown, boolean, GroupBase<unknown>>> | undefined;
+    controlShouldRenderValue?: boolean | undefined;
+    escapeClearsValue?: boolean | undefined;
+    filterOption?: ((option: FilterOptionOption<unknown>, inputValue: string) => boolean) | null | undefined;
+    formatGroupLabel?: ((group: GroupBase<unknown>) => React$1.ReactNode) | undefined;
+    getOptionLabel?: GetOptionLabel<unknown> | undefined;
+    getOptionValue?: GetOptionValue<unknown> | undefined;
+    isDisabled?: boolean | undefined;
+    isLoading?: boolean | undefined;
+    isOptionDisabled?: ((option: unknown, selectValue: Options<unknown>) => boolean) | undefined;
+    isMulti?: boolean | undefined;
+    isRtl?: boolean | undefined;
+    isSearchable?: boolean | undefined;
+    loadingMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    minMenuHeight?: number | undefined;
+    maxMenuHeight?: number | undefined;
+    menuIsOpen?: boolean | undefined;
+    menuPlacement?: MenuPlacement | undefined;
+    menuPosition?: MenuPosition | undefined;
+    menuShouldBlockScroll?: boolean | undefined;
+    menuShouldScrollIntoView?: boolean | undefined;
+    noOptionsMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    openMenuOnFocus?: boolean | undefined;
+    openMenuOnClick?: boolean | undefined;
+    options?: OptionsOrGroups<unknown, GroupBase<unknown>> | undefined;
+    pageSize?: number | undefined;
+    placeholder?: React$1.ReactNode;
+    screenReaderStatus?: ((obj: {
+        count: number;
+    }) => string) | undefined;
+    styles?: StylesConfig<unknown, boolean, GroupBase<unknown>> | undefined;
+    tabIndex?: number | undefined;
+    tabSelectsValue?: boolean | undefined;
+} & {}, "inputValue" | "menuIsOpen" | "onChange" | "onInputChange" | "onMenuOpen" | "onMenuClose" | "value"> & Partial<Pick<Props<unknown, boolean, GroupBase<unknown>>, "aria-errormessage" | "aria-invalid" | "aria-label" | "aria-labelledby" | "ariaLiveMessages" | "autoFocus" | "className" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "id" | "inputValue" | "inputId" | "instanceId" | "isClearable" | "isOptionSelected" | "menuPortalTarget" | "name" | "onBlur" | "onChange" | "onFocus" | "onInputChange" | "onKeyDown" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom" | "theme" | "value" | "form"> & {
+    'aria-live'?: "off" | "assertive" | "polite" | undefined;
+    backspaceRemovesValue?: boolean | undefined;
+    blurInputOnSelect?: boolean | undefined;
+    captureMenuScroll?: boolean | undefined;
+    closeMenuOnSelect?: boolean | undefined;
+    closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
+    components?: Partial<SelectComponents<unknown, boolean, GroupBase<unknown>>> | undefined;
+    controlShouldRenderValue?: boolean | undefined;
+    escapeClearsValue?: boolean | undefined;
+    filterOption?: ((option: FilterOptionOption<unknown>, inputValue: string) => boolean) | null | undefined;
+    formatGroupLabel?: ((group: GroupBase<unknown>) => React$1.ReactNode) | undefined;
+    getOptionLabel?: GetOptionLabel<unknown> | undefined;
+    getOptionValue?: GetOptionValue<unknown> | undefined;
+    isDisabled?: boolean | undefined;
+    isLoading?: boolean | undefined;
+    isOptionDisabled?: ((option: unknown, selectValue: Options<unknown>) => boolean) | undefined;
+    isMulti?: boolean | undefined;
+    isRtl?: boolean | undefined;
+    isSearchable?: boolean | undefined;
+    loadingMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    minMenuHeight?: number | undefined;
+    maxMenuHeight?: number | undefined;
+    menuIsOpen?: boolean | undefined;
+    menuPlacement?: MenuPlacement | undefined;
+    menuPosition?: MenuPosition | undefined;
+    menuShouldBlockScroll?: boolean | undefined;
+    menuShouldScrollIntoView?: boolean | undefined;
+    noOptionsMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    openMenuOnFocus?: boolean | undefined;
+    openMenuOnClick?: boolean | undefined;
+    options?: OptionsOrGroups<unknown, GroupBase<unknown>> | undefined;
+    pageSize?: number | undefined;
+    placeholder?: React$1.ReactNode;
+    screenReaderStatus?: ((obj: {
+        count: number;
+    }) => string) | undefined;
+    styles?: StylesConfig<unknown, boolean, GroupBase<unknown>> | undefined;
+    tabIndex?: number | undefined;
+    tabSelectsValue?: boolean | undefined;
+} & {}> & StateManagerAdditionalProps<unknown> & React$1.RefAttributes<SelectInstance<unknown, boolean, GroupBase<unknown>>>>;
+declare const LabeledSelect: React$1.ForwardRefExoticComponent<AdditionalSKUSelectProps & Omit<Pick<Props<unknown, boolean, GroupBase<unknown>>, "aria-errormessage" | "aria-invalid" | "aria-label" | "aria-labelledby" | "ariaLiveMessages" | "autoFocus" | "className" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "id" | "inputValue" | "inputId" | "instanceId" | "isClearable" | "isOptionSelected" | "menuPortalTarget" | "name" | "onBlur" | "onChange" | "onFocus" | "onInputChange" | "onKeyDown" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom" | "theme" | "value" | "form"> & {
+    'aria-live'?: "off" | "assertive" | "polite" | undefined;
+    backspaceRemovesValue?: boolean | undefined;
+    blurInputOnSelect?: boolean | undefined;
+    captureMenuScroll?: boolean | undefined;
+    closeMenuOnSelect?: boolean | undefined;
+    closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
+    components?: Partial<SelectComponents<unknown, boolean, GroupBase<unknown>>> | undefined;
+    controlShouldRenderValue?: boolean | undefined;
+    escapeClearsValue?: boolean | undefined;
+    filterOption?: ((option: FilterOptionOption<unknown>, inputValue: string) => boolean) | null | undefined;
+    formatGroupLabel?: ((group: GroupBase<unknown>) => React$1.ReactNode) | undefined;
+    getOptionLabel?: GetOptionLabel<unknown> | undefined;
+    getOptionValue?: GetOptionValue<unknown> | undefined;
+    isDisabled?: boolean | undefined;
+    isLoading?: boolean | undefined;
+    isOptionDisabled?: ((option: unknown, selectValue: Options<unknown>) => boolean) | undefined;
+    isMulti?: boolean | undefined;
+    isRtl?: boolean | undefined;
+    isSearchable?: boolean | undefined;
+    loadingMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    minMenuHeight?: number | undefined;
+    maxMenuHeight?: number | undefined;
+    menuIsOpen?: boolean | undefined;
+    menuPlacement?: MenuPlacement | undefined;
+    menuPosition?: MenuPosition | undefined;
+    menuShouldBlockScroll?: boolean | undefined;
+    menuShouldScrollIntoView?: boolean | undefined;
+    noOptionsMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    openMenuOnFocus?: boolean | undefined;
+    openMenuOnClick?: boolean | undefined;
+    options?: OptionsOrGroups<unknown, GroupBase<unknown>> | undefined;
+    pageSize?: number | undefined;
+    placeholder?: React$1.ReactNode;
+    screenReaderStatus?: ((obj: {
+        count: number;
+    }) => string) | undefined;
+    styles?: StylesConfig<unknown, boolean, GroupBase<unknown>> | undefined;
+    tabIndex?: number | undefined;
+    tabSelectsValue?: boolean | undefined;
+} & {}, "inputValue" | "menuIsOpen" | "onChange" | "onInputChange" | "onMenuOpen" | "onMenuClose" | "value"> & Partial<Pick<Props<unknown, boolean, GroupBase<unknown>>, "aria-errormessage" | "aria-invalid" | "aria-label" | "aria-labelledby" | "ariaLiveMessages" | "autoFocus" | "className" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "id" | "inputValue" | "inputId" | "instanceId" | "isClearable" | "isOptionSelected" | "menuPortalTarget" | "name" | "onBlur" | "onChange" | "onFocus" | "onInputChange" | "onKeyDown" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom" | "theme" | "value" | "form"> & {
+    'aria-live'?: "off" | "assertive" | "polite" | undefined;
+    backspaceRemovesValue?: boolean | undefined;
+    blurInputOnSelect?: boolean | undefined;
+    captureMenuScroll?: boolean | undefined;
+    closeMenuOnSelect?: boolean | undefined;
+    closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
+    components?: Partial<SelectComponents<unknown, boolean, GroupBase<unknown>>> | undefined;
+    controlShouldRenderValue?: boolean | undefined;
+    escapeClearsValue?: boolean | undefined;
+    filterOption?: ((option: FilterOptionOption<unknown>, inputValue: string) => boolean) | null | undefined;
+    formatGroupLabel?: ((group: GroupBase<unknown>) => React$1.ReactNode) | undefined;
+    getOptionLabel?: GetOptionLabel<unknown> | undefined;
+    getOptionValue?: GetOptionValue<unknown> | undefined;
+    isDisabled?: boolean | undefined;
+    isLoading?: boolean | undefined;
+    isOptionDisabled?: ((option: unknown, selectValue: Options<unknown>) => boolean) | undefined;
+    isMulti?: boolean | undefined;
+    isRtl?: boolean | undefined;
+    isSearchable?: boolean | undefined;
+    loadingMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    minMenuHeight?: number | undefined;
+    maxMenuHeight?: number | undefined;
+    menuIsOpen?: boolean | undefined;
+    menuPlacement?: MenuPlacement | undefined;
+    menuPosition?: MenuPosition | undefined;
+    menuShouldBlockScroll?: boolean | undefined;
+    menuShouldScrollIntoView?: boolean | undefined;
+    noOptionsMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    openMenuOnFocus?: boolean | undefined;
+    openMenuOnClick?: boolean | undefined;
+    options?: OptionsOrGroups<unknown, GroupBase<unknown>> | undefined;
+    pageSize?: number | undefined;
+    placeholder?: React$1.ReactNode;
+    screenReaderStatus?: ((obj: {
+        count: number;
+    }) => string) | undefined;
+    styles?: StylesConfig<unknown, boolean, GroupBase<unknown>> | undefined;
+    tabIndex?: number | undefined;
+    tabSelectsValue?: boolean | undefined;
+} & {}> & StateManagerAdditionalProps<unknown> & {
+    parentStyle?: React$1.CSSProperties | undefined;
+    label?: string | undefined;
+    required?: boolean | undefined;
+} & React$1.RefAttributes<SelectInstance<unknown, boolean, GroupBase<unknown>>>>;
+declare const SKUCreatableSelect: React$1.ForwardRefExoticComponent<AdditionalSKUSelectProps & Omit<Pick<Props<unknown, false, GroupBase<unknown>>, "aria-errormessage" | "aria-invalid" | "aria-label" | "aria-labelledby" | "ariaLiveMessages" | "autoFocus" | "className" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "id" | "inputValue" | "inputId" | "instanceId" | "isClearable" | "isOptionSelected" | "menuPortalTarget" | "name" | "onBlur" | "onChange" | "onFocus" | "onInputChange" | "onKeyDown" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom" | "theme" | "value" | "form"> & {
+    'aria-live'?: "off" | "assertive" | "polite" | undefined;
+    backspaceRemovesValue?: boolean | undefined;
+    blurInputOnSelect?: boolean | undefined;
+    captureMenuScroll?: boolean | undefined;
+    closeMenuOnSelect?: boolean | undefined;
+    closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
+    components?: Partial<SelectComponents<unknown, false, GroupBase<unknown>>> | undefined;
+    controlShouldRenderValue?: boolean | undefined;
+    escapeClearsValue?: boolean | undefined;
+    filterOption?: ((option: FilterOptionOption<unknown>, inputValue: string) => boolean) | null | undefined;
+    formatGroupLabel?: ((group: GroupBase<unknown>) => React$1.ReactNode) | undefined;
+    getOptionLabel?: GetOptionLabel<unknown> | undefined;
+    getOptionValue?: GetOptionValue<unknown> | undefined;
+    isDisabled?: boolean | undefined;
+    isLoading?: boolean | undefined;
+    isOptionDisabled?: ((option: unknown, selectValue: Options<unknown>) => boolean) | undefined;
+    isMulti?: false | undefined;
+    isRtl?: boolean | undefined;
+    isSearchable?: boolean | undefined;
+    loadingMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    minMenuHeight?: number | undefined;
+    maxMenuHeight?: number | undefined;
+    menuIsOpen?: boolean | undefined;
+    menuPlacement?: MenuPlacement | undefined;
+    menuPosition?: MenuPosition | undefined;
+    menuShouldBlockScroll?: boolean | undefined;
+    menuShouldScrollIntoView?: boolean | undefined;
+    noOptionsMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    openMenuOnFocus?: boolean | undefined;
+    openMenuOnClick?: boolean | undefined;
+    options?: OptionsOrGroups<unknown, GroupBase<unknown>> | undefined;
+    pageSize?: number | undefined;
+    placeholder?: React$1.ReactNode;
+    screenReaderStatus?: ((obj: {
+        count: number;
+    }) => string) | undefined;
+    styles?: StylesConfig<unknown, false, GroupBase<unknown>> | undefined;
+    tabIndex?: number | undefined;
+    tabSelectsValue?: boolean | undefined;
+} & {}, "inputValue" | "menuIsOpen" | "onChange" | "onInputChange" | "onMenuOpen" | "onMenuClose" | "value"> & Partial<Pick<Props<unknown, false, GroupBase<unknown>>, "aria-errormessage" | "aria-invalid" | "aria-label" | "aria-labelledby" | "ariaLiveMessages" | "autoFocus" | "className" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "id" | "inputValue" | "inputId" | "instanceId" | "isClearable" | "isOptionSelected" | "menuPortalTarget" | "name" | "onBlur" | "onChange" | "onFocus" | "onInputChange" | "onKeyDown" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom" | "theme" | "value" | "form"> & {
+    'aria-live'?: "off" | "assertive" | "polite" | undefined;
+    backspaceRemovesValue?: boolean | undefined;
+    blurInputOnSelect?: boolean | undefined;
+    captureMenuScroll?: boolean | undefined;
+    closeMenuOnSelect?: boolean | undefined;
+    closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
+    components?: Partial<SelectComponents<unknown, false, GroupBase<unknown>>> | undefined;
+    controlShouldRenderValue?: boolean | undefined;
+    escapeClearsValue?: boolean | undefined;
+    filterOption?: ((option: FilterOptionOption<unknown>, inputValue: string) => boolean) | null | undefined;
+    formatGroupLabel?: ((group: GroupBase<unknown>) => React$1.ReactNode) | undefined;
+    getOptionLabel?: GetOptionLabel<unknown> | undefined;
+    getOptionValue?: GetOptionValue<unknown> | undefined;
+    isDisabled?: boolean | undefined;
+    isLoading?: boolean | undefined;
+    isOptionDisabled?: ((option: unknown, selectValue: Options<unknown>) => boolean) | undefined;
+    isMulti?: false | undefined;
+    isRtl?: boolean | undefined;
+    isSearchable?: boolean | undefined;
+    loadingMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    minMenuHeight?: number | undefined;
+    maxMenuHeight?: number | undefined;
+    menuIsOpen?: boolean | undefined;
+    menuPlacement?: MenuPlacement | undefined;
+    menuPosition?: MenuPosition | undefined;
+    menuShouldBlockScroll?: boolean | undefined;
+    menuShouldScrollIntoView?: boolean | undefined;
+    noOptionsMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    openMenuOnFocus?: boolean | undefined;
+    openMenuOnClick?: boolean | undefined;
+    options?: OptionsOrGroups<unknown, GroupBase<unknown>> | undefined;
+    pageSize?: number | undefined;
+    placeholder?: React$1.ReactNode;
+    screenReaderStatus?: ((obj: {
+        count: number;
+    }) => string) | undefined;
+    styles?: StylesConfig<unknown, false, GroupBase<unknown>> | undefined;
+    tabIndex?: number | undefined;
+    tabSelectsValue?: boolean | undefined;
+} & {}> & StateManagerAdditionalProps<unknown> & CreatableAdditionalProps<unknown, GroupBase<unknown>> & React$1.RefAttributes<SelectInstance<unknown, false, GroupBase<unknown>>>>;
+declare const LabeledCreatableSelect: React$1.ForwardRefExoticComponent<AdditionalSKUSelectProps & Omit<Pick<Props<unknown, false, GroupBase<unknown>>, "aria-errormessage" | "aria-invalid" | "aria-label" | "aria-labelledby" | "ariaLiveMessages" | "autoFocus" | "className" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "id" | "inputValue" | "inputId" | "instanceId" | "isClearable" | "isOptionSelected" | "menuPortalTarget" | "name" | "onBlur" | "onChange" | "onFocus" | "onInputChange" | "onKeyDown" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom" | "theme" | "value" | "form"> & {
+    'aria-live'?: "off" | "assertive" | "polite" | undefined;
+    backspaceRemovesValue?: boolean | undefined;
+    blurInputOnSelect?: boolean | undefined;
+    captureMenuScroll?: boolean | undefined;
+    closeMenuOnSelect?: boolean | undefined;
+    closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
+    components?: Partial<SelectComponents<unknown, false, GroupBase<unknown>>> | undefined;
+    controlShouldRenderValue?: boolean | undefined;
+    escapeClearsValue?: boolean | undefined;
+    filterOption?: ((option: FilterOptionOption<unknown>, inputValue: string) => boolean) | null | undefined;
+    formatGroupLabel?: ((group: GroupBase<unknown>) => React$1.ReactNode) | undefined;
+    getOptionLabel?: GetOptionLabel<unknown> | undefined;
+    getOptionValue?: GetOptionValue<unknown> | undefined;
+    isDisabled?: boolean | undefined;
+    isLoading?: boolean | undefined;
+    isOptionDisabled?: ((option: unknown, selectValue: Options<unknown>) => boolean) | undefined;
+    isMulti?: false | undefined;
+    isRtl?: boolean | undefined;
+    isSearchable?: boolean | undefined;
+    loadingMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    minMenuHeight?: number | undefined;
+    maxMenuHeight?: number | undefined;
+    menuIsOpen?: boolean | undefined;
+    menuPlacement?: MenuPlacement | undefined;
+    menuPosition?: MenuPosition | undefined;
+    menuShouldBlockScroll?: boolean | undefined;
+    menuShouldScrollIntoView?: boolean | undefined;
+    noOptionsMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    openMenuOnFocus?: boolean | undefined;
+    openMenuOnClick?: boolean | undefined;
+    options?: OptionsOrGroups<unknown, GroupBase<unknown>> | undefined;
+    pageSize?: number | undefined;
+    placeholder?: React$1.ReactNode;
+    screenReaderStatus?: ((obj: {
+        count: number;
+    }) => string) | undefined;
+    styles?: StylesConfig<unknown, false, GroupBase<unknown>> | undefined;
+    tabIndex?: number | undefined;
+    tabSelectsValue?: boolean | undefined;
+} & {}, "inputValue" | "menuIsOpen" | "onChange" | "onInputChange" | "onMenuOpen" | "onMenuClose" | "value"> & Partial<Pick<Props<unknown, false, GroupBase<unknown>>, "aria-errormessage" | "aria-invalid" | "aria-label" | "aria-labelledby" | "ariaLiveMessages" | "autoFocus" | "className" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "id" | "inputValue" | "inputId" | "instanceId" | "isClearable" | "isOptionSelected" | "menuPortalTarget" | "name" | "onBlur" | "onChange" | "onFocus" | "onInputChange" | "onKeyDown" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom" | "theme" | "value" | "form"> & {
+    'aria-live'?: "off" | "assertive" | "polite" | undefined;
+    backspaceRemovesValue?: boolean | undefined;
+    blurInputOnSelect?: boolean | undefined;
+    captureMenuScroll?: boolean | undefined;
+    closeMenuOnSelect?: boolean | undefined;
+    closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
+    components?: Partial<SelectComponents<unknown, false, GroupBase<unknown>>> | undefined;
+    controlShouldRenderValue?: boolean | undefined;
+    escapeClearsValue?: boolean | undefined;
+    filterOption?: ((option: FilterOptionOption<unknown>, inputValue: string) => boolean) | null | undefined;
+    formatGroupLabel?: ((group: GroupBase<unknown>) => React$1.ReactNode) | undefined;
+    getOptionLabel?: GetOptionLabel<unknown> | undefined;
+    getOptionValue?: GetOptionValue<unknown> | undefined;
+    isDisabled?: boolean | undefined;
+    isLoading?: boolean | undefined;
+    isOptionDisabled?: ((option: unknown, selectValue: Options<unknown>) => boolean) | undefined;
+    isMulti?: false | undefined;
+    isRtl?: boolean | undefined;
+    isSearchable?: boolean | undefined;
+    loadingMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    minMenuHeight?: number | undefined;
+    maxMenuHeight?: number | undefined;
+    menuIsOpen?: boolean | undefined;
+    menuPlacement?: MenuPlacement | undefined;
+    menuPosition?: MenuPosition | undefined;
+    menuShouldBlockScroll?: boolean | undefined;
+    menuShouldScrollIntoView?: boolean | undefined;
+    noOptionsMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    openMenuOnFocus?: boolean | undefined;
+    openMenuOnClick?: boolean | undefined;
+    options?: OptionsOrGroups<unknown, GroupBase<unknown>> | undefined;
+    pageSize?: number | undefined;
+    placeholder?: React$1.ReactNode;
+    screenReaderStatus?: ((obj: {
+        count: number;
+    }) => string) | undefined;
+    styles?: StylesConfig<unknown, false, GroupBase<unknown>> | undefined;
+    tabIndex?: number | undefined;
+    tabSelectsValue?: boolean | undefined;
+} & {}> & StateManagerAdditionalProps<unknown> & CreatableAdditionalProps<unknown, GroupBase<unknown>> & {
+    parentStyle?: React$1.CSSProperties | undefined;
+    label?: string | undefined;
+    required?: boolean | undefined;
+} & React$1.RefAttributes<SelectInstance<unknown, false, GroupBase<unknown>>>>;
+declare const SKUAsyncSelect: React$1.ForwardRefExoticComponent<AdditionalSKUSelectProps & Omit<Pick<Props<unknown, false, GroupBase<unknown>>, "aria-errormessage" | "aria-invalid" | "aria-label" | "aria-labelledby" | "ariaLiveMessages" | "autoFocus" | "className" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "id" | "inputValue" | "inputId" | "instanceId" | "isClearable" | "isOptionSelected" | "menuPortalTarget" | "name" | "onBlur" | "onChange" | "onFocus" | "onInputChange" | "onKeyDown" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom" | "theme" | "value" | "form"> & {
+    'aria-live'?: "off" | "assertive" | "polite" | undefined;
+    backspaceRemovesValue?: boolean | undefined;
+    blurInputOnSelect?: boolean | undefined;
+    captureMenuScroll?: boolean | undefined;
+    closeMenuOnSelect?: boolean | undefined;
+    closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
+    components?: Partial<SelectComponents<unknown, false, GroupBase<unknown>>> | undefined;
+    controlShouldRenderValue?: boolean | undefined;
+    escapeClearsValue?: boolean | undefined;
+    filterOption?: ((option: FilterOptionOption<unknown>, inputValue: string) => boolean) | null | undefined;
+    formatGroupLabel?: ((group: GroupBase<unknown>) => React$1.ReactNode) | undefined;
+    getOptionLabel?: GetOptionLabel<unknown> | undefined;
+    getOptionValue?: GetOptionValue<unknown> | undefined;
+    isDisabled?: boolean | undefined;
+    isLoading?: boolean | undefined;
+    isOptionDisabled?: ((option: unknown, selectValue: Options<unknown>) => boolean) | undefined;
+    isMulti?: false | undefined;
+    isRtl?: boolean | undefined;
+    isSearchable?: boolean | undefined;
+    loadingMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    minMenuHeight?: number | undefined;
+    maxMenuHeight?: number | undefined;
+    menuIsOpen?: boolean | undefined;
+    menuPlacement?: MenuPlacement | undefined;
+    menuPosition?: MenuPosition | undefined;
+    menuShouldBlockScroll?: boolean | undefined;
+    menuShouldScrollIntoView?: boolean | undefined;
+    noOptionsMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    openMenuOnFocus?: boolean | undefined;
+    openMenuOnClick?: boolean | undefined;
+    options?: OptionsOrGroups<unknown, GroupBase<unknown>> | undefined;
+    pageSize?: number | undefined;
+    placeholder?: React$1.ReactNode;
+    screenReaderStatus?: ((obj: {
+        count: number;
+    }) => string) | undefined;
+    styles?: StylesConfig<unknown, false, GroupBase<unknown>> | undefined;
+    tabIndex?: number | undefined;
+    tabSelectsValue?: boolean | undefined;
+} & {}, "inputValue" | "menuIsOpen" | "onChange" | "onInputChange" | "onMenuOpen" | "onMenuClose" | "value"> & Partial<Pick<Props<unknown, false, GroupBase<unknown>>, "aria-errormessage" | "aria-invalid" | "aria-label" | "aria-labelledby" | "ariaLiveMessages" | "autoFocus" | "className" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "id" | "inputValue" | "inputId" | "instanceId" | "isClearable" | "isOptionSelected" | "menuPortalTarget" | "name" | "onBlur" | "onChange" | "onFocus" | "onInputChange" | "onKeyDown" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom" | "theme" | "value" | "form"> & {
+    'aria-live'?: "off" | "assertive" | "polite" | undefined;
+    backspaceRemovesValue?: boolean | undefined;
+    blurInputOnSelect?: boolean | undefined;
+    captureMenuScroll?: boolean | undefined;
+    closeMenuOnSelect?: boolean | undefined;
+    closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
+    components?: Partial<SelectComponents<unknown, false, GroupBase<unknown>>> | undefined;
+    controlShouldRenderValue?: boolean | undefined;
+    escapeClearsValue?: boolean | undefined;
+    filterOption?: ((option: FilterOptionOption<unknown>, inputValue: string) => boolean) | null | undefined;
+    formatGroupLabel?: ((group: GroupBase<unknown>) => React$1.ReactNode) | undefined;
+    getOptionLabel?: GetOptionLabel<unknown> | undefined;
+    getOptionValue?: GetOptionValue<unknown> | undefined;
+    isDisabled?: boolean | undefined;
+    isLoading?: boolean | undefined;
+    isOptionDisabled?: ((option: unknown, selectValue: Options<unknown>) => boolean) | undefined;
+    isMulti?: false | undefined;
+    isRtl?: boolean | undefined;
+    isSearchable?: boolean | undefined;
+    loadingMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    minMenuHeight?: number | undefined;
+    maxMenuHeight?: number | undefined;
+    menuIsOpen?: boolean | undefined;
+    menuPlacement?: MenuPlacement | undefined;
+    menuPosition?: MenuPosition | undefined;
+    menuShouldBlockScroll?: boolean | undefined;
+    menuShouldScrollIntoView?: boolean | undefined;
+    noOptionsMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    openMenuOnFocus?: boolean | undefined;
+    openMenuOnClick?: boolean | undefined;
+    options?: OptionsOrGroups<unknown, GroupBase<unknown>> | undefined;
+    pageSize?: number | undefined;
+    placeholder?: React$1.ReactNode;
+    screenReaderStatus?: ((obj: {
+        count: number;
+    }) => string) | undefined;
+    styles?: StylesConfig<unknown, false, GroupBase<unknown>> | undefined;
+    tabIndex?: number | undefined;
+    tabSelectsValue?: boolean | undefined;
+} & {}> & StateManagerAdditionalProps<unknown> & AsyncAdditionalProps<unknown, GroupBase<unknown>> & React$1.RefAttributes<SelectInstance<unknown, false, GroupBase<unknown>>>>;
+declare const LabeledAsyncSelect: React$1.ForwardRefExoticComponent<AdditionalSKUSelectProps & Omit<Pick<Props<unknown, false, GroupBase<unknown>>, "aria-errormessage" | "aria-invalid" | "aria-label" | "aria-labelledby" | "ariaLiveMessages" | "autoFocus" | "className" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "id" | "inputValue" | "inputId" | "instanceId" | "isClearable" | "isOptionSelected" | "menuPortalTarget" | "name" | "onBlur" | "onChange" | "onFocus" | "onInputChange" | "onKeyDown" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom" | "theme" | "value" | "form"> & {
+    'aria-live'?: "off" | "assertive" | "polite" | undefined;
+    backspaceRemovesValue?: boolean | undefined;
+    blurInputOnSelect?: boolean | undefined;
+    captureMenuScroll?: boolean | undefined;
+    closeMenuOnSelect?: boolean | undefined;
+    closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
+    components?: Partial<SelectComponents<unknown, false, GroupBase<unknown>>> | undefined;
+    controlShouldRenderValue?: boolean | undefined;
+    escapeClearsValue?: boolean | undefined;
+    filterOption?: ((option: FilterOptionOption<unknown>, inputValue: string) => boolean) | null | undefined;
+    formatGroupLabel?: ((group: GroupBase<unknown>) => React$1.ReactNode) | undefined;
+    getOptionLabel?: GetOptionLabel<unknown> | undefined;
+    getOptionValue?: GetOptionValue<unknown> | undefined;
+    isDisabled?: boolean | undefined;
+    isLoading?: boolean | undefined;
+    isOptionDisabled?: ((option: unknown, selectValue: Options<unknown>) => boolean) | undefined;
+    isMulti?: false | undefined;
+    isRtl?: boolean | undefined;
+    isSearchable?: boolean | undefined;
+    loadingMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    minMenuHeight?: number | undefined;
+    maxMenuHeight?: number | undefined;
+    menuIsOpen?: boolean | undefined;
+    menuPlacement?: MenuPlacement | undefined;
+    menuPosition?: MenuPosition | undefined;
+    menuShouldBlockScroll?: boolean | undefined;
+    menuShouldScrollIntoView?: boolean | undefined;
+    noOptionsMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    openMenuOnFocus?: boolean | undefined;
+    openMenuOnClick?: boolean | undefined;
+    options?: OptionsOrGroups<unknown, GroupBase<unknown>> | undefined;
+    pageSize?: number | undefined;
+    placeholder?: React$1.ReactNode;
+    screenReaderStatus?: ((obj: {
+        count: number;
+    }) => string) | undefined;
+    styles?: StylesConfig<unknown, false, GroupBase<unknown>> | undefined;
+    tabIndex?: number | undefined;
+    tabSelectsValue?: boolean | undefined;
+} & {}, "inputValue" | "menuIsOpen" | "onChange" | "onInputChange" | "onMenuOpen" | "onMenuClose" | "value"> & Partial<Pick<Props<unknown, false, GroupBase<unknown>>, "aria-errormessage" | "aria-invalid" | "aria-label" | "aria-labelledby" | "ariaLiveMessages" | "autoFocus" | "className" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "id" | "inputValue" | "inputId" | "instanceId" | "isClearable" | "isOptionSelected" | "menuPortalTarget" | "name" | "onBlur" | "onChange" | "onFocus" | "onInputChange" | "onKeyDown" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom" | "theme" | "value" | "form"> & {
+    'aria-live'?: "off" | "assertive" | "polite" | undefined;
+    backspaceRemovesValue?: boolean | undefined;
+    blurInputOnSelect?: boolean | undefined;
+    captureMenuScroll?: boolean | undefined;
+    closeMenuOnSelect?: boolean | undefined;
+    closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
+    components?: Partial<SelectComponents<unknown, false, GroupBase<unknown>>> | undefined;
+    controlShouldRenderValue?: boolean | undefined;
+    escapeClearsValue?: boolean | undefined;
+    filterOption?: ((option: FilterOptionOption<unknown>, inputValue: string) => boolean) | null | undefined;
+    formatGroupLabel?: ((group: GroupBase<unknown>) => React$1.ReactNode) | undefined;
+    getOptionLabel?: GetOptionLabel<unknown> | undefined;
+    getOptionValue?: GetOptionValue<unknown> | undefined;
+    isDisabled?: boolean | undefined;
+    isLoading?: boolean | undefined;
+    isOptionDisabled?: ((option: unknown, selectValue: Options<unknown>) => boolean) | undefined;
+    isMulti?: false | undefined;
+    isRtl?: boolean | undefined;
+    isSearchable?: boolean | undefined;
+    loadingMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    minMenuHeight?: number | undefined;
+    maxMenuHeight?: number | undefined;
+    menuIsOpen?: boolean | undefined;
+    menuPlacement?: MenuPlacement | undefined;
+    menuPosition?: MenuPosition | undefined;
+    menuShouldBlockScroll?: boolean | undefined;
+    menuShouldScrollIntoView?: boolean | undefined;
+    noOptionsMessage?: ((obj: {
+        inputValue: string;
+    }) => React$1.ReactNode) | undefined;
+    openMenuOnFocus?: boolean | undefined;
+    openMenuOnClick?: boolean | undefined;
+    options?: OptionsOrGroups<unknown, GroupBase<unknown>> | undefined;
+    pageSize?: number | undefined;
+    placeholder?: React$1.ReactNode;
+    screenReaderStatus?: ((obj: {
+        count: number;
+    }) => string) | undefined;
+    styles?: StylesConfig<unknown, false, GroupBase<unknown>> | undefined;
+    tabIndex?: number | undefined;
+    tabSelectsValue?: boolean | undefined;
+} & {}> & StateManagerAdditionalProps<unknown> & AsyncAdditionalProps<unknown, GroupBase<unknown>> & {
+    parentStyle?: React$1.CSSProperties | undefined;
+    label?: string | undefined;
+    required?: boolean | undefined;
+} & React$1.RefAttributes<SelectInstance<unknown, false, GroupBase<unknown>>>>;
 //# sourceMappingURL=Select.d.ts.map
 
 declare type SidePanelType = {
@@ -785,6 +1310,7 @@ declare type ArtworkProps = {
     onEdit?: Function | VoidFunction;
     onDelete?: Function | VoidFunction;
     onSave?: Function | VoidFunction;
+    onError?: Function | VoidFunction;
     onDownload?: Function | VoidFunction;
     inputProps?: InputProps;
     inputEl?: React$1.ReactNode;
@@ -2104,7 +2630,7 @@ declare type ProgressBarsProps = React$1.PropsWithChildren<{
     error?: string;
     title?: string;
 } & SharedStyleTypes>;
-declare const MultiProgress: ({ labeled, error, values, max, ...props }: {
+declare const MultiProgress: ({ labeled, error, values, max: maxVal, ...props }: {
     values: ProgressBarValue[];
     max: number;
     color?: string | undefined;