@reapit/elements 4.0.4 → 4.1.0

package/dist/cjs/components/placeholder-image/images/placeholder-images/placeholderSmall.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
-declare const _default: React.MemoExoticComponent<() => React.JSX.Element>;
+declare const _default: React.MemoExoticComponent<() => import("react/jsx-runtime").JSX.Element>;
 export default _default;

package/dist/cjs/components/placeholder-image/placeholder-image.stories.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: import("react").FC<import("./placeholder-image").PlacholderImageProps>;
+};
+export default _default;
+export declare const BasicUsage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const FillAvailableSpace: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};

package/dist/cjs/components/progress-bar/progress-bar.stories.d.ts

@@ -0,0 +1,22 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: import("react").FC<import("./progress-bar").ProgressBarStepProps>;
+};
+export default _default;
+export declare const BasicExampleProgressBarPercentage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const BasicExampleProgressBarSteps: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const ReactExampleProgressBarPercentage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const ReactExampleProgressBarSteps: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};

package/dist/cjs/components/searchable-dropdown/searchable-dropdown.d.ts

@@ -25,11 +25,11 @@ export interface ControlledSearchableDropdownProps<T> extends React.InputHTMLAtt
     icon?: IconNames;
     label?: string;
 }
-export declare const SearchableDropdownControlledInner: <T extends unknown>({ isResultsListVisible, icon, loading, resultsList, onResultClick, onClear, isClearVisible, value, selectedValue, id, label, ...inputProps }: ControlledSearchableDropdownProps<T>, ref: React.ForwardedRef<HTMLInputElement>) => React.JSX.Element;
+export declare const SearchableDropdownControlledInner: <T extends unknown>({ isResultsListVisible, icon, loading, resultsList, onResultClick, onClear, isClearVisible, value, selectedValue, id, label, ...inputProps }: ControlledSearchableDropdownProps<T>, ref: React.ForwardedRef<HTMLInputElement>) => import("react/jsx-runtime").JSX.Element;
 export declare const ControlledSearchableDropdown: <T>(props: ControlledSearchableDropdownProps<T> & {
     ref?: React.ForwardedRef<HTMLInputElement> | undefined;
 }) => ReturnType<typeof SearchableDropdownControlledInner>;
-export declare const SearchableDropdownInner: <T extends unknown>({ getResults, icon, getResultValue, getResultLabel, onChange, defaultVal, id, ...inputProps }: SearchableDropdownProps<T>, ref: React.ForwardedRef<HTMLInputElement>) => React.JSX.Element;
+export declare const SearchableDropdownInner: <T extends unknown>({ getResults, icon, getResultValue, getResultLabel, onChange, defaultVal, id, ...inputProps }: SearchableDropdownProps<T>, ref: React.ForwardedRef<HTMLInputElement>) => import("react/jsx-runtime").JSX.Element;
 export declare const SearchableDropdown: <T>(props: SearchableDropdownProps<T> & {
     ref?: React.ForwardedRef<HTMLInputElement> | undefined;
 }) => ReturnType<typeof SearchableDropdownInner>;

package/dist/cjs/components/searchable-dropdown/searchable-dropdown.stories.d.ts

@@ -0,0 +1,25 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: <T>(props: import("./searchable-dropdown").SearchableDropdownProps<T> & {
+        ref?: import("react").ForwardedRef<HTMLInputElement> | undefined;
+    }) => import("react/jsx-runtime").JSX.Element;
+};
+export default _default;
+export declare const BasicUsage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const UseWithALabel: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const UseWithAnIcon: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const ControlledUsage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const DefaultValue: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};

package/dist/cjs/components/secondary-nav/secondary-nav.stories.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: import("react").FC<import("./secondary-nav").SecondaryNavProps>;
+};
+export default _default;
+export declare const BasicUsage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const ReactExample: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};

package/dist/cjs/components/select/select.stories.d.ts

@@ -0,0 +1,12 @@
+declare const _default: {
+    title: string;
+    component: import("./select").SelectWrapped;
+};
+export default _default;
+export declare const BasicUsage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const UseWithALabel: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};

package/dist/cjs/components/snack/snack.stories.d.ts

@@ -0,0 +1,45 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: import("react").FC<import("./snack").SnackProps>;
+};
+export default _default;
+export declare const BasicUsage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const WithAnIcon: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const IntentPrimary: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const IntentNeutral: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const IntentSuccess: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const IntentPending: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const IntentWarning: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const IntentDanger: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const IntentDefault: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const UseSnackHookExample: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};

package/dist/cjs/components/snack/use-snack-hook.story-component.d.ts

@@ -0,0 +1 @@
+export declare const UseSnackHookStory: () => import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/status-indicator/status-indicator.stories.d.ts

@@ -0,0 +1,38 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: import("react").FC<import("./status-indicator").StatusIndicatorProps>;
+};
+export default _default;
+export declare const BasicUsage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const IntentPrimary: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const IntentNeutral: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const IntentSuccess: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const IntentPending: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const IntentWarning: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const IntentDanger: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const IntentDefault: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};

package/dist/cjs/components/steps/steps.stories.d.ts

@@ -0,0 +1,24 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: import("react").FC<import("./steps").StepsProps>;
+};
+export default _default;
+export declare const BasicStepsUsage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const MiddleItemSelected: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const LastItemSelected: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const ReactExample: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const StepsVerticalUsage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};

package/dist/cjs/components/table/table.stories.d.ts

@@ -0,0 +1,248 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: import("react").FC<import("./table").TableProps>;
+};
+export default _default;
+export declare const BasicUsage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const ColumnWidths: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const BasicCustomisationTableCells: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const ExpandingTableCellSpace: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const ExpandableContent: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const CallToActionContent: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const ReactShorthandUsage: {
+    render: ({ rows }: {
+        rows: any;
+    }) => import("react/jsx-runtime").JSX.Element;
+    args: {
+        rows: ({
+            cells: ({
+                label: string;
+                value: import("react/jsx-runtime").JSX.Element;
+                icon?: undefined;
+                cellHasDarkText?: undefined;
+                narrowTable?: undefined;
+                statusCircleIntent?: undefined;
+            } | {
+                label: string;
+                value: string;
+                icon: string;
+                cellHasDarkText: boolean;
+                narrowTable: {
+                    showLabel: boolean;
+                };
+                statusCircleIntent?: undefined;
+            } | {
+                label: string;
+                value: string;
+                icon: string;
+                narrowTable: {
+                    showLabel: boolean;
+                };
+                cellHasDarkText?: undefined;
+                statusCircleIntent?: undefined;
+            } | {
+                label: string;
+                value: string;
+                cellHasDarkText: boolean;
+                icon?: undefined;
+                narrowTable?: undefined;
+                statusCircleIntent?: undefined;
+            } | {
+                label: string;
+                value: string;
+                statusCircleIntent: string;
+                icon?: undefined;
+                cellHasDarkText?: undefined;
+                narrowTable?: undefined;
+            })[];
+            expandableContent: {
+                content: import("react/jsx-runtime").JSX.Element;
+            };
+        } | {
+            cells: ({
+                label: string;
+                value: import("react/jsx-runtime").JSX.Element;
+                icon?: undefined;
+                cellHasDarkText?: undefined;
+                narrowTable?: undefined;
+                children?: undefined;
+            } | {
+                label: string;
+                value: string;
+                icon: string;
+                cellHasDarkText: boolean;
+                narrowTable: {
+                    showLabel: boolean;
+                };
+                children?: undefined;
+            } | {
+                label: string;
+                value: string;
+                icon: string;
+                narrowTable: {
+                    showLabel: boolean;
+                };
+                cellHasDarkText?: undefined;
+                children?: undefined;
+            } | {
+                label: string;
+                value: string;
+                cellHasDarkText: boolean;
+                icon?: undefined;
+                narrowTable?: undefined;
+                children?: undefined;
+            } | {
+                label: string;
+                value: string;
+                children: import("react/jsx-runtime").JSX.Element;
+                icon?: undefined;
+                cellHasDarkText?: undefined;
+                narrowTable?: undefined;
+            })[];
+            expandableContent: {
+                content: import("react/jsx-runtime").JSX.Element;
+            };
+        })[];
+    };
+};
+export declare const AdvancedCustomisationReact: {
+    render: ({ rows }: {
+        rows: any;
+    }) => import("react/jsx-runtime").JSX.Element;
+    args: {
+        rows: ({
+            cells: ({
+                label: string;
+                value: import("react/jsx-runtime").JSX.Element;
+                className?: undefined;
+                icon?: undefined;
+                cellHasDarkText?: undefined;
+                narrowTable?: undefined;
+                statusCircleIntent?: undefined;
+            } | {
+                label: string;
+                value: string;
+                className: import("@linaria/core").LinariaClassName;
+                icon: string;
+                cellHasDarkText: boolean;
+                narrowTable: {
+                    showLabel: boolean;
+                };
+                statusCircleIntent?: undefined;
+            } | {
+                label: string;
+                value: string;
+                icon: string;
+                narrowTable: {
+                    showLabel: boolean;
+                };
+                className?: undefined;
+                cellHasDarkText?: undefined;
+                statusCircleIntent?: undefined;
+            } | {
+                label: string;
+                value: string;
+                narrowTable: {
+                    showLabel: boolean;
+                };
+                className?: undefined;
+                icon?: undefined;
+                cellHasDarkText?: undefined;
+                statusCircleIntent?: undefined;
+            } | {
+                label: string;
+                value: string;
+                cellHasDarkText: boolean;
+                className?: undefined;
+                icon?: undefined;
+                narrowTable?: undefined;
+                statusCircleIntent?: undefined;
+            } | {
+                label: string;
+                value: string;
+                statusCircleIntent: string;
+                className?: undefined;
+                icon?: undefined;
+                cellHasDarkText?: undefined;
+                narrowTable?: undefined;
+            })[];
+            expandableContent: {
+                content: import("react/jsx-runtime").JSX.Element;
+            };
+        } | {
+            cells: ({
+                label: string;
+                value: import("react/jsx-runtime").JSX.Element;
+                className?: undefined;
+                icon?: undefined;
+                cellHasDarkText?: undefined;
+                narrowTable?: undefined;
+                children?: undefined;
+            } | {
+                label: string;
+                value: string;
+                className: import("@linaria/core").LinariaClassName;
+                icon: string;
+                cellHasDarkText: boolean;
+                narrowTable: {
+                    showLabel: boolean;
+                };
+                children?: undefined;
+            } | {
+                label: string;
+                value: string;
+                icon: string;
+                narrowTable: {
+                    showLabel: boolean;
+                };
+                className?: undefined;
+                cellHasDarkText?: undefined;
+                children?: undefined;
+            } | {
+                label: string;
+                value: string;
+                narrowTable: {
+                    showLabel: boolean;
+                };
+                className?: undefined;
+                icon?: undefined;
+                cellHasDarkText?: undefined;
+                children?: undefined;
+            } | {
+                label: string;
+                value: string;
+                cellHasDarkText: boolean;
+                className?: undefined;
+                icon?: undefined;
+                narrowTable?: undefined;
+                children?: undefined;
+            } | {
+                label: string;
+                value: string;
+                children: import("react/jsx-runtime").JSX.Element;
+                className?: undefined;
+                icon?: undefined;
+                cellHasDarkText?: undefined;
+                narrowTable?: undefined;
+            })[];
+            expandableContent: {
+                content: import("react/jsx-runtime").JSX.Element;
+            };
+        })[];
+    };
+};

package/dist/cjs/components/tabs/tabs.stories.d.ts

@@ -0,0 +1,22 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: import("react").FC<import("./tabs").TabsProps>;
+};
+export default _default;
+export declare const TabsDefault: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const TabsFullWidth: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const TabsReactExampleUncontrolled: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const TabsReactExampleControlled: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};

package/dist/cjs/components/tag/tag.stories.d.ts

@@ -0,0 +1,40 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: import("react").FC<import("./tag").TagProps>;
+};
+export default _default;
+export declare const BasicUsage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const IntentPrimary: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const IntentNeutral: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const IntentSuccess: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const IntentPending: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const IntentWarning: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const IntentDanger: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const IntentDefault: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const TagGroupUsage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};

package/dist/cjs/components/textarea/textarea.stories.d.ts

@@ -0,0 +1,15 @@
+declare const _default: {
+    title: string;
+    component: import("./textarea").TextAreaWrapped;
+};
+export default _default;
+export declare const BasicUsage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const TextAreaPlaceholder: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const TextAreaError: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};

package/dist/cjs/components/tile/tile.stories.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: import("react").FC<import("./tile").TileProps>;
+};
+export default _default;
+export declare const BasicUsage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const PaddingVariants: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const TileLayouts: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};

package/dist/cjs/components/toggle/toggle.stories.d.ts

@@ -0,0 +1,28 @@
+declare const _default: {
+    title: string;
+    component: import("./toggle").ToggleWrapped;
+};
+export default _default;
+export declare const BasicUsage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const ToggleSwitch: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const ToggleGreyBg: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const ToggleRadioDefault: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const ToggleRadioSelectPropsGreyBg: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const ToggleRadioDisabled: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};

package/dist/cjs/components/tool-tip/tooltip.stories.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: import("react").FC<import("./tool-tip").ToolTipProps>;
+};
+export default _default;
+export declare const BasicUsage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const DefaultActive: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};

package/dist/cjs/components/typography/typography.stories.d.ts

@@ -0,0 +1,36 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: import("react").FC<import("./typography").TypographyProps>;
+};
+export default _default;
+export declare const BaseScale: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const TypographyModifiers: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const Intent: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const TitleUsage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const SubtitleUsage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const BodyTextUsage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const SmallTextUsage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const TitleAndSubtitle: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const SubtitleAndBodyText: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const BodyTextAndSmallText: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+};

package/dist/cjs/hooks/use-media-query/media.stories.d.ts

@@ -1,3 +1,16 @@
-import React from 'react';
-export declare const MediaMobileExample: () => React.JSX.Element;
-export declare const AllBreakPointExample: () => React.JSX.Element | undefined;
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: import("react").FC<{
+        children?: import("react").ReactNode;
+    }>;
+};
+export default _default;
+export declare const MediaStateProviderUsage: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};
+export declare const MediaStateProviderBreakpoints: {
+    render: ({}: {}) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+};

package/dist/cjs/hooks/use-media-query/media.story-component.d.ts

@@ -0,0 +1,2 @@
+export declare const MediaMobileExample: () => import("react/jsx-runtime").JSX.Element;
+export declare const AllBreakPointExample: () => import("react/jsx-runtime").JSX.Element | null;