@moda/om 17.14.2 → 18.0.0

package/dist/src/components/AspectRatioBox/AspectRatioBox.d.ts

@@ -3,7 +3,7 @@ import './AspectRatioBox.scss';
 export declare const DEFAULT_PRODUCT_ASPECT_WIDTH = 128;
 export declare const DEFAULT_PRODUCT_ASPECT_HEIGHT = 205;
 export declare const DEFAULT_PRODUCT_ASPECT_RATIO: number;
-export declare type AspectRatioBoxProps = React.HTMLAttributes<HTMLDivElement> & {
+export type AspectRatioBoxProps = React.HTMLAttributes<HTMLDivElement> & {
     aspectWidth?: number;
     aspectHeight?: number;
     maxWidth: number;

package/dist/src/components/Badge/Badge.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import './Badge.scss';
-export declare type BadgeTheme = 'forest-green' | 'klein-blue' | 'brick' | 'dark-fuchsia' | 'noise';
-export declare type BadgeProps = React.AnchorHTMLAttributes<HTMLAnchorElement> & {
+export type BadgeTheme = 'forest-green' | 'klein-blue' | 'brick' | 'dark-fuchsia' | 'noise';
+export type BadgeProps = React.AnchorHTMLAttributes<HTMLAnchorElement> & {
     theme?: BadgeTheme;
 };
 export declare const Badge: React.FC<BadgeProps>;

package/dist/src/components/Breadcrumbs/Breadcrumb/Breadcrumb.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { ControlLinkProps } from '../../ControlLink';
 import './Breadcrumb.scss';
-export declare type BreadcrumbProps = ControlLinkProps & {
+export type BreadcrumbProps = ControlLinkProps & {
     position?: number;
     to?: string;
     href?: string;

package/dist/src/components/Breadcrumbs/Breadcrumbs.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import './Breadcrumbs.scss';
-export declare type BreadcrumbsProps = React.OlHTMLAttributes<HTMLOListElement>;
+export type BreadcrumbsProps = React.OlHTMLAttributes<HTMLOListElement>;
 export declare const Breadcrumbs: React.FC<BreadcrumbsProps>;

package/dist/src/components/Breakpoint/Breakpoint.d.ts

@@ -1,14 +1,14 @@
 import React, { HTMLAttributes } from 'react';
 import './Breakpoint.scss';
-declare type At = {
+type At = {
     at: string;
 };
-declare type GreaterThan = {
+type GreaterThan = {
     gt: string;
 };
-declare type LessThan = {
+type LessThan = {
     lt: string;
 };
-export declare type BreakpointProps = (At | GreaterThan | LessThan) & HTMLAttributes<HTMLDivElement>;
+export type BreakpointProps = (At | GreaterThan | LessThan) & HTMLAttributes<HTMLDivElement>;
 export declare const Breakpoint: React.FC<BreakpointProps>;
 export {};

package/dist/src/components/Breakpoint/BreakpointProvider.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-export declare type BreakpointProviderProps = {
+export type BreakpointProviderProps = {
     /**
      * `defaultWidth` controls the behavior of `useBreakpoint` and `Breakpoint` on the initial render
      * possible values are:

package/dist/src/components/Breakpoint/generateMediaQuery.d.ts

@@ -1,6 +1,6 @@
 import { breakpoints } from '@moda/tokens';
-export declare type Mode = 'at' | 'gt' | 'lt';
-export declare type Breakpoint = keyof typeof breakpoints;
+export type Mode = 'at' | 'gt' | 'lt';
+export type Breakpoint = keyof typeof breakpoints;
 export interface GenerateMediaQuery {
     mode: Mode;
     breakpoint: Breakpoint;

package/dist/src/components/Button/Button.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { ClickableProps } from '../Clickable';
 import './Button.scss';
-export declare type ButtonProps = {
+export type ButtonProps = {
     secondary?: boolean;
     tertiary?: boolean;
     elevated?: boolean;

package/dist/src/components/Checkbox/Checkbox.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import './Checkbox.scss';
-export declare type ShowCheckedUsing = 'checkmark' | 'circle';
-export declare type CheckboxProps = React.InputHTMLAttributes<HTMLInputElement> & {
+export type ShowCheckedUsing = 'checkmark' | 'circle';
+export type CheckboxProps = React.InputHTMLAttributes<HTMLInputElement> & {
     children?: JSX.Element | string;
     checkIcon?: ShowCheckedUsing;
     dataTestId?: string;

package/dist/src/components/Clickable/Clickable.d.ts

@@ -1,9 +1,9 @@
 import React from 'react';
 import { LinkProps } from 'react-router-dom';
 import './Clickable.scss';
-declare type ButtonElProps = React.ButtonHTMLAttributes<HTMLButtonElement>;
-declare type AnchorElProps = React.AnchorHTMLAttributes<HTMLAnchorElement>;
-export declare type ClickableProps = {
+type ButtonElProps = React.ButtonHTMLAttributes<HTMLButtonElement>;
+type AnchorElProps = React.AnchorHTMLAttributes<HTMLAnchorElement>;
+export type ClickableProps = {
     disabled?: boolean;
     styleless?: boolean;
 } & (ButtonElProps | AnchorElProps | LinkProps);

package/dist/src/components/ColorSwatch/ColorSwatch.d.ts

@@ -1,8 +1,8 @@
 import React from 'react';
 import { SkuColor } from './skuColors';
 import './ColorSwatch.scss';
-export declare type ColorSwatchSize = 'default' | 'small';
-export declare type ColorSwatchProps = Omit<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'onClick'>, 'onMouseEnter'> & {
+export type ColorSwatchSize = 'default' | 'small';
+export type ColorSwatchProps = Omit<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'onClick'>, 'onMouseEnter'> & {
     size?: ColorSwatchSize;
     color: SkuColor | string;
     backgroundUrl?: string;

package/dist/src/components/ColorSwatch/skuColors.d.ts

@@ -50,4 +50,4 @@ export declare const SKU_COLORS: {
     white: string;
     yellow: string;
 };
-export declare type SkuColor = keyof typeof SKU_COLORS;
+export type SkuColor = keyof typeof SKU_COLORS;

package/dist/src/components/Constrain/Constrain.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import './Constrain.scss';
-export declare type ConstrainProps = React.HTMLAttributes<HTMLDivElement>;
+export type ConstrainProps = React.HTMLAttributes<HTMLDivElement>;
 export declare const Constrain: React.FC<ConstrainProps>;

package/dist/src/components/Constrain/ExceedConstrain.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import './ExceedConstrain.scss';
-export declare type ExceedConstrainProps = React.HTMLAttributes<HTMLDivElement>;
+export type ExceedConstrainProps = React.HTMLAttributes<HTMLDivElement>;
 export declare const ExceedConstrain: React.FC<ExceedConstrainProps>;

package/dist/src/components/ControlLink/ControlLink.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { ClickableProps } from '../Clickable';
 import './ControlLink.scss';
-export declare type ControlLinkProps = ClickableProps & {
+export type ControlLinkProps = ClickableProps & {
     disabled?: boolean;
     underlined?: boolean;
 };

package/dist/src/components/CreditCardNumberInput/CreditCardNumberInput.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Props as InputMaskProps } from 'react-input-mask';
 import { FieldProps } from '../Field';
-export declare type CreditCardNumberInputProps = Omit<InputMaskProps & FieldProps, 'mask' | 'value' | 'defaultValue'> & {
+export type CreditCardNumberInputProps = Omit<InputMaskProps & FieldProps, 'mask' | 'value' | 'defaultValue'> & {
     value?: string;
     defaultValue?: string;
 };

package/dist/src/components/CreditCardNumberInput/CreditCardNumberInputField.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { FieldProps } from '../Field';
-export declare type CreditCardNumberInputFieldProps = Omit<FieldProps, 'onChange'> & {
+export type CreditCardNumberInputFieldProps = Omit<FieldProps, 'onChange'> & {
     onChange?: React.ChangeEventHandler<HTMLInputElement>;
 };
 export declare const CreditCardNumberInputField: React.FC<CreditCardNumberInputFieldProps>;

package/dist/src/components/DefinitionList/DefinitionList.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import './DefinitionList.scss';
-export declare type DefinitionListProps = React.HTMLAttributes<HTMLDListElement> & {
+export type DefinitionListProps = React.HTMLAttributes<HTMLDListElement> & {
     term: string;
     children: React.ReactNode;
 };

package/dist/src/components/Divider/Divider.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { TextTreatment, TextColor, TextFontFamily } from '../Text';
 import './Divider.scss';
-export declare type DividerProps = React.HTMLAttributes<HTMLDivElement> & {
+export type DividerProps = React.HTMLAttributes<HTMLDivElement> & {
     text?: string;
     treatment?: TextTreatment;
     color?: TextColor;

package/dist/src/components/Expandable/Expandable.d.ts

@@ -1,6 +1,6 @@
 import React, { ReactNode } from 'react';
 import './Expandable.scss';
-export declare type ExpandableProps = React.HTMLAttributes<HTMLDivElement> & {
+export type ExpandableProps = React.HTMLAttributes<HTMLDivElement> & {
     name: string | ReactNode;
     defaultExpanded?: boolean;
     expanded?: boolean;

package/dist/src/components/Field/Field.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { TextInputProps } from '../TextInput';
 import './Field.scss';
-export declare type FieldProps = TextInputProps & {
+export type FieldProps = TextInputProps & {
     children?: JSX.Element;
 };
 export declare const Field: React.ForwardRefExoticComponent<import("../TextInput").InputProps & Omit<React.InputHTMLAttributes<HTMLInputElement>, "onChange"> & {

package/dist/src/components/Label/Label.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import './Label.scss';
-export declare type LabelProps = React.LabelHTMLAttributes<HTMLLabelElement> & {
+export type LabelProps = React.LabelHTMLAttributes<HTMLLabelElement> & {
     hidden?: boolean;
 };
 export declare const Label: React.FC<LabelProps>;

package/dist/src/components/Loading/Loading.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import './Loading.scss';
-export declare type LoadingProps = React.HTMLAttributes<HTMLDivElement>;
+export type LoadingProps = React.HTMLAttributes<HTMLDivElement>;
 export declare const Loading: React.FC<LoadingProps>;

package/dist/src/components/Modal/Modal.d.ts

@@ -1,7 +1,7 @@
 import React, { ComponentProps } from 'react';
 import { FocusOn } from 'react-focus-on';
 import './Modal.scss';
-export declare type ModalProps = React.HTMLAttributes<HTMLDivElement> & {
+export type ModalProps = React.HTMLAttributes<HTMLDivElement> & {
     onClose(): void;
     shards?: ComponentProps<typeof FocusOn>['shards'];
     autoFocus?: boolean;

package/dist/src/components/ModalOverlay/ModalOverlay.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { ModalProps } from '../Modal';
 import { OverlayProps } from '../Overlay';
 import './ModalOverlay.scss';
-export declare type ModalOverlayProps = ModalProps & OverlayProps & {
+export type ModalOverlayProps = ModalProps & OverlayProps & {
     overlayClassName?: string;
     contentClassName?: string;
 };

package/dist/src/components/Overlay/Overlay.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import './Overlay.scss';
 export declare const UNMOUNT_DELAY_MS = 500;
-export declare type OverlayProps = React.HTMLAttributes<HTMLDivElement> & {
+export type OverlayProps = React.HTMLAttributes<HTMLDivElement> & {
     show?: boolean;
 };
 export declare const Overlay: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {

package/dist/src/components/PasswordInput/PasswordInput.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { FieldProps } from '../Field';
 import './PasswordInput.scss';
-export declare type PasswordInputProps = FieldProps;
+export type PasswordInputProps = FieldProps;
 export declare const PasswordInput: React.ForwardRefExoticComponent<import("..").InputProps & Omit<React.InputHTMLAttributes<HTMLInputElement>, "onChange"> & {
     children?: JSX.Element | undefined;
 } & React.RefAttributes<HTMLInputElement>>;

package/dist/src/components/Popover/Popover.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import './Popover.scss';
-export declare type PopoverProps = React.HTMLAttributes<HTMLDivElement> & {
+export type PopoverProps = React.HTMLAttributes<HTMLDivElement> & {
     content: JSX.Element;
     children: JSX.Element;
     open?: boolean;

package/dist/src/components/PromoBanner/PromoBanner.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import './PromoBanner.scss';
-export declare type PromoBannerProps = React.HTMLAttributes<HTMLDivElement> & {
+export type PromoBannerProps = React.HTMLAttributes<HTMLDivElement> & {
     children: JSX.Element | [JSX.Element, JSX.Element] | [JSX.Element, JSX.Element, JSX.Element];
 };
 export declare const PromoBanner: React.FC<PromoBannerProps>;

package/dist/src/components/RadioButton/RadioButton.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import './RadioButton.scss';
-export declare type RadioButtonProps = React.InputHTMLAttributes<HTMLInputElement> & {
+export type RadioButtonProps = React.InputHTMLAttributes<HTMLInputElement> & {
     children?: JSX.Element | string;
 };
 export declare const RadioButton: React.FC<RadioButtonProps>;

package/dist/src/components/SearchInput/SearchInput.d.ts

@@ -1,9 +1,8 @@
 import React from 'react';
 import { TextInputProps } from '../TextInput';
 import './SearchInput.scss';
-export declare type SearchInputProps = TextInputProps & {
+export type SearchInputProps = TextInputProps & {
     value?: string;
     onClear?(): void;
-    onChangeValue?(value: string): void;
 };
 export declare const SearchInput: React.FC<SearchInputProps>;

package/dist/src/components/Select/MultiSelect.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { SelectableOption } from '.';
 import './MultiSelect.scss';
-declare type Props = Omit<React.HTMLAttributes<HTMLDivElement>, 'defaultValue' | 'value' | 'onChange'> & {
+type Props = Omit<React.HTMLAttributes<HTMLDivElement>, 'defaultValue' | 'value' | 'onChange'> & {
     defaultValue?: string[] | undefined;
     disabled?: boolean;
     dropDirection?: 'down' | 'up';

package/dist/src/components/Select/Select.d.ts

@@ -1,11 +1,11 @@
 import React from 'react';
 import './Select.scss';
-export declare type SelectableOption = {
+export type SelectableOption = {
     value: string;
     label: string;
     disabled?: boolean;
 };
-export declare type SelectProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'defaultValue' | 'value' | 'onChange'> & {
+export type SelectProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'defaultValue' | 'value' | 'onChange'> & {
     allowAutoFill?: boolean;
     autoSelect?: boolean;
     defaultValue?: string | undefined;

package/dist/src/components/Select/SelectLabel.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-export declare type SelectLabelProps = React.LabelHTMLAttributes<HTMLLabelElement> & {
+export type SelectLabelProps = React.LabelHTMLAttributes<HTMLLabelElement> & {
     idRef?: string;
     label?: string;
     hasValue: boolean;

package/dist/src/components/Select/SelectOption.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { SelectableOption } from './Select';
 import './SelectOption.scss';
-export declare type SelectOptionProps = Omit<React.HTMLAttributes<HTMLLIElement>, 'onClick'> & {
+export type SelectOptionProps = Omit<React.HTMLAttributes<HTMLLIElement>, 'onClick'> & {
     active: boolean;
     selected: boolean;
     option: SelectableOption;

package/dist/src/components/Select/SelectOptions.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { SelectableOption } from './Select';
 import './SelectOptions.scss';
-export declare type SelectOptionsProps = Omit<React.HTMLAttributes<HTMLUListElement>, 'onSelect' | 'onFocus'> & {
+export type SelectOptionsProps = Omit<React.HTMLAttributes<HTMLUListElement>, 'onSelect' | 'onFocus'> & {
     idRef: string;
     searchable?: boolean;
     autoFocus?: boolean;

package/dist/src/components/Select/useSelect.d.ts

@@ -3,7 +3,7 @@ declare enum Mode {
     Resting = 0,
     Open = 1
 }
-declare type Action = {
+type Action = {
     type: 'OPEN';
 } | {
     type: 'CLOSE';

package/dist/src/components/SelectableButton/SelectableButton.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { ClickableProps } from '../Clickable';
 import './SelectableButton.scss';
-export declare type SelectableButtonProps = ClickableProps & {
+export type SelectableButtonProps = ClickableProps & {
     hover?: boolean;
     selected?: boolean;
     unavailable?: boolean;

package/dist/src/components/Shape/Shape.d.ts

@@ -1,2 +1,2 @@
 import React from 'react';
-export declare type ShapeProps = React.HTMLAttributes<HTMLOrSVGElement>;
+export type ShapeProps = React.HTMLAttributes<HTMLOrSVGElement>;

package/dist/src/components/SlidingPane/SlidingPane.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import './SlidingPane.scss';
-export declare type SlidingPaneProps = React.HTMLAttributes<HTMLDivElement> & {
+export type SlidingPaneProps = React.HTMLAttributes<HTMLDivElement> & {
     children: React.ReactNode;
     title: string;
     visible: boolean;

package/dist/src/components/Stack/Stack.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import './Stack.scss';
 import * as CSS from 'csstype';
-export declare type StackProps = React.HTMLAttributes<HTMLDivElement> & {
+export type StackProps = React.HTMLAttributes<HTMLDivElement> & {
     space: number;
     direction?: 'vertical' | 'horizontal';
     alignItems?: CSS.Properties['alignItems'];

package/dist/src/components/Tabs/Tab.d.ts

@@ -1,11 +1,11 @@
 import React from 'react';
 import './Tab.scss';
-export declare type Tab = {
+export type Tab = {
     name: string;
     title: string;
     panel: JSX.Element;
 };
-export declare type TabProps = {
+export type TabProps = {
     tab: Tab;
     activeTab: string;
     onTabChosen(tabName: string): void;

package/dist/src/components/Tabs/TabList.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Tab } from '.';
 import './TabList.scss';
-export declare type TabListProps = {
+export type TabListProps = {
     tabs: Tab[];
     onTabSelected(tabName: string): void;
     activePanel: string;

package/dist/src/components/Tabs/TabPanel.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import './TabPanel.scss';
-export declare type TabPanelProps = {
+export type TabPanelProps = {
     children: React.ReactNode;
 };
 export declare const TabPanel: React.FC<TabPanelProps>;

package/dist/src/components/Tabs/TabPanels.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Tab } from '.';
 import './TabPanels.scss';
-export declare type TabPanelsProps = {
+export type TabPanelsProps = {
     panels: Tab[];
     activePanel: string;
 };

package/dist/src/components/Tabs/Tabs.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Tab } from '.';
 import './Tabs.scss';
-export declare type TabsProps = React.HTMLAttributes<HTMLDivElement> & {
+export type TabsProps = React.HTMLAttributes<HTMLDivElement> & {
     tabs: Tab[];
     onTabClicked?: (tabName: string) => void;
     activeTab?: string;

package/dist/src/components/Tag/Tag.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import './Tag.scss';
-export declare type TagProps = {
+export type TagProps = {
     disabled?: boolean;
     onRemove?: () => void;
 } & React.HTMLAttributes<HTMLDivElement>;

package/dist/src/components/Text/Text.d.ts

@@ -1,10 +1,10 @@
 import React from 'react';
 import { typography, colors } from '@moda/tokens';
 import './Text.scss';
-export declare type TextTreatment = keyof typeof typography['text-treatments'];
-export declare type TextColor = keyof typeof colors.all;
-export declare type TextFontFamily = keyof typeof typography.fonts;
-export declare type TextProps = React.HTMLAttributes<HTMLSpanElement> & {
+export type TextTreatment = keyof typeof typography['text-treatments'];
+export type TextColor = keyof typeof colors.all;
+export type TextFontFamily = keyof typeof typography.fonts;
+export type TextProps = React.HTMLAttributes<HTMLSpanElement> & {
     treatment?: TextTreatment;
     color?: TextColor;
     family?: TextFontFamily;

package/dist/src/components/TextInput/TextInput.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import './TextInput.scss';
-export declare type InputProps = {
+export type InputProps = {
     disabled?: boolean;
     error?: boolean | string;
     focus?: boolean;
@@ -8,5 +8,5 @@ export declare type InputProps = {
     onChange?: (value: string) => void;
     onChangeEvent?: (event: React.ChangeEvent<HTMLInputElement>) => void;
 };
-export declare type TextInputProps = InputProps & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'onChange'>;
+export type TextInputProps = InputProps & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'onChange'>;
 export declare const TextInput: React.ForwardRefExoticComponent<InputProps & Omit<React.InputHTMLAttributes<HTMLInputElement>, "onChange"> & React.RefAttributes<HTMLInputElement>>;

package/dist/src/components/Textarea/Textarea.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 import { InputProps } from '../TextInput';
 import './Textarea.scss';
-export declare type TextareaProps = InputProps & Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'onChange'>;
+export type TextareaProps = InputProps & Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'onChange'>;
 export declare const Textarea: React.ForwardRefExoticComponent<InputProps & Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "onChange"> & React.RefAttributes<HTMLTextAreaElement>>;

package/dist/src/components/Toast/Toast.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { StackProps } from '../Stack';
 import './Toast.scss';
-export declare type ToastProps = {
+export type ToastProps = {
     theme: 'success' | 'warning' | 'error';
     onRemove?: () => void;
 } & Omit<StackProps, 'direction' | 'space'>;

package/dist/src/components/VerticalDivider/VerticalDivider.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import './VerticalDivider.scss';
-export declare type VerticalDividerProps = {
+export type VerticalDividerProps = {
     double?: boolean;
 } & React.HTMLAttributes<HTMLDivElement>;
 export declare const VerticalDivider: React.FC<VerticalDividerProps>;

package/dist/src/hooks/useBreakpoint.d.ts

@@ -1,11 +1,11 @@
 import { Mode as ModeType, Breakpoint as BreakpointType } from '../components/Breakpoint/generateMediaQuery';
-declare type At = {
+type At = {
     at: string;
 };
-declare type GreaterThan = {
+type GreaterThan = {
     gt: string;
 };
-declare type LessThan = {
+type LessThan = {
     lt: string;
 };
 export declare const discriminate: (props: At | GreaterThan | LessThan) => {

package/dist/src/hooks/useKeyboardListNavigation.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export declare type UseKeyboardListNavigationAction = {
+export type UseKeyboardListNavigationAction = {
     type: 'RESET';
     payload: {
         defaultCursor: number;
@@ -20,12 +20,12 @@ export declare type UseKeyboardListNavigationAction = {
         cursor: number;
     };
 };
-export declare type UseKeyboardListNavigationState = {
+export type UseKeyboardListNavigationState = {
     cursor: number;
     length: number;
     interactive: boolean;
 };
-export declare type UseKeyboardListNavigationProps<T> = {
+export type UseKeyboardListNavigationProps<T> = {
     list: T[];
     defaultSelected?: T;
     waitForInteractive?: boolean;

package/dist/src/utilities/States/isRenderProps.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export declare type RenderProps = {
+export type RenderProps = {
     (props: any): JSX.Element;
 };
 export declare const isRenderProps: (children: JSX.Element | RenderProps) => children is RenderProps;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@moda/om",
-  "version": "17.14.2",
+  "version": "18.0.0",
   "description": "Moda Operandi design system",
   "main": "dist/index.cjs.js",
   "module": "dist/index.esm.js",
@@ -141,7 +141,7 @@
     "typescript": "^4.0.2",
     "waait": "^1.0.5",
     "webpack": "^5.72.1",
-    "webpack-cli": "^4.0.0"
+    "webpack-cli": "^5.0.0"
   },
   "config": {
     "commitizen": {

package/src/components/SearchInput/SearchInput.stories.tsx

@@ -8,11 +8,7 @@ export default { title: 'Components/SearchInput' };
 
 export const Default = () => (
   <States<SearchInputProps> states={[{}, { value: 'prada' }, { autoFocus: true }]}>
-    <SearchInput
-      placeholder='Search'
-      onChange={action('onChange')}
-      onChangeValue={action('onChangeValue')}
-    />
+    <SearchInput placeholder='Search' onChange={action('onChange')} />
   </States>
 );
 
@@ -34,7 +30,7 @@ export const DropdownExample = () => {
 
   return (
     <div style={{ display: 'flex', flexDirection: 'column' }}>
-      <SearchInput placeholder='Search' onChangeValue={setQuery} value={query} autoFocus />
+      <SearchInput placeholder='Search' onChange={setQuery} value={query} autoFocus />
 
       {query && (
         <Text style={{ border: '1px solid gray', marginTop: '-1px', padding: '1rem' }}>