@strapi/design-system 1.11.0 → 1.12.0-typescript.1

package/dist/ProgressBar/ProgressBar.d.ts

@@ -0,0 +1,11 @@
+import { BoxProps } from '../Box';
+type Enumerate<N extends number, Acc extends number[] = []> = Acc['length'] extends N ? Acc[number] : Enumerate<N, [...Acc, Acc['length']]>;
+type IntRange<F extends number, T extends number> = Exclude<Enumerate<T>, Enumerate<F>>;
+export interface ProgressBarProps extends Omit<BoxProps, 'background' | 'hasRadius' | 'height' | 'position' | 'width'> {
+    max?: IntRange<0, 101>;
+    min?: IntRange<0, 101>;
+    size?: 'S' | 'M';
+    value?: IntRange<0, 101>;
+}
+export declare const ProgressBar: ({ min, max, value, children, size, ...props }: ProgressBarProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/ProgressBar/index.d.ts

@@ -0,0 +1 @@
+export * from './ProgressBar';

package/dist/Radio/Radio.d.ts

@@ -0,0 +1,5 @@
+import { BaseRadioProps } from '../BaseRadio/BaseRadio';
+export interface RadioProps extends BaseRadioProps {
+    children: React.ReactNode;
+}
+export declare const Radio: ({ children, ...props }: RadioProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Radio/__tests__/Radio.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/Radio/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Radio';
+export { RadioGroup } from '../BaseRadio/RadioGroup';

package/dist/RawTable/RawCell.d.ts

@@ -0,0 +1,14 @@
+import { ReactNode } from 'react';
+import { BoxProps } from '../Box';
+export interface RawTdProps extends BoxProps<'td'> {
+    'aria-colindex'?: number;
+    as?: 'td' | 'th';
+    children?: ReactNode;
+    coords?: {
+        col: number;
+        row: number;
+    };
+}
+export type RawThProps = Omit<RawTdProps, 'as'>;
+export declare const RawTh: (props: RawThProps) => import("react/jsx-runtime").JSX.Element;
+export declare const RawTd: ({ coords, as, ...props }: RawTdProps) => import("react/jsx-runtime").JSX.Element;

package/dist/RawTable/RawTable.d.ts

@@ -0,0 +1,16 @@
+import { TableHTMLAttributes } from 'react';
+export interface RawTableProps extends TableHTMLAttributes<HTMLTableElement> {
+    colCount: number;
+    initialCol?: number;
+    initialRow?: number;
+    jumpStep?: number;
+    rowCount: number;
+}
+export declare const RawTable: ({ colCount, rowCount, jumpStep, initialCol, initialRow, ...props }: {
+    [x: string]: any;
+    colCount: any;
+    rowCount: any;
+    jumpStep?: number | undefined;
+    initialCol?: number | undefined;
+    initialRow?: number | undefined;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/RawTable/RawTableContext.d.ts

@@ -0,0 +1,10 @@
+export interface RawTableContextValue {
+    rowIndex: number;
+    colIndex: number;
+    setTableValues: ({ rowIndex, colIndex }: {
+        rowIndex: number;
+        colIndex: number;
+    }) => void;
+}
+export declare const RawTableContext: import("react").Context<RawTableContextValue>;
+export declare const useTable: () => RawTableContextValue;

package/dist/RawTable/RawTbody.d.ts

@@ -0,0 +1,5 @@
+import { TableHTMLAttributes, ReactNode } from 'react';
+export interface RawTbodyProps extends TableHTMLAttributes<HTMLTableSectionElement> {
+    children: ReactNode;
+}
+export declare const RawTbody: ({ children, ...props }: RawTbodyProps) => import("react/jsx-runtime").JSX.Element;

package/dist/RawTable/RawThead.d.ts

@@ -0,0 +1,5 @@
+import { TableHTMLAttributes, ReactNode } from 'react';
+export interface RawTheadProps extends TableHTMLAttributes<HTMLTableSectionElement> {
+    children: ReactNode;
+}
+export declare const RawThead: ({ children, ...props }: RawTheadProps) => import("react/jsx-runtime").JSX.Element;

package/dist/RawTable/RawTr.d.ts

@@ -0,0 +1,5 @@
+import { BoxProps } from '../Box';
+export interface RawTrProps extends BoxProps<'tr'> {
+    'aria-rowindex'?: number;
+}
+export declare const RawTr: ({ children, ...props }: RawTrProps) => import("react/jsx-runtime").JSX.Element;

package/dist/RawTable/focusFocusable.d.ts

@@ -0,0 +1 @@
+export declare const focusFocusable: (node: any) => void;

package/dist/RawTable/index.d.ts

@@ -0,0 +1,5 @@
+export * from './RawTable';
+export * from './RawCell';
+export * from './RawThead';
+export * from './RawTbody';
+export * from './RawTr';

package/dist/Searchbar/SearchForm.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+export type SearchFormProps = Omit<React.FormHTMLAttributes<HTMLFormElement>, 'role'>;
+export declare const SearchForm: (props: SearchFormProps) => JSX.Element;

package/dist/Searchbar/Searchbar.d.ts

@@ -0,0 +1,9 @@
+import React, { MouseEventHandler } from 'react';
+import { FieldInputProps, FieldProps } from '../Field';
+export interface SearchbarProps extends Omit<FieldInputProps, 'id' | 'name'>, Pick<FieldProps, 'id' | 'name'> {
+    name: string;
+    value?: string;
+    onClear: MouseEventHandler<any>;
+    clearLabel: string;
+}
+export declare const Searchbar: React.ForwardRefExoticComponent<SearchbarProps & React.RefAttributes<HTMLInputElement>>;

package/dist/Searchbar/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Searchbar';
+export * from './SearchForm';

package/dist/Select/MultiSelect.d.ts

@@ -0,0 +1,40 @@
+import * as React from 'react';
+import * as SelectParts from './SelectParts';
+import { FieldLabelProps, FieldProps } from '../Field';
+type MultiSelectPropsWithoutLabel = Omit<SelectParts.MultiSelectProps, 'value' | 'multi'> & Pick<SelectParts.ContentProps, 'onCloseAutoFocus'> & Pick<SelectParts.TriggerProps, 'clearLabel' | 'onClear' | 'size' | 'startIcon' | 'placeholder'> & Pick<FieldProps, 'hint' | 'id' | 'error'> & {
+    /**
+     * @default (value) => value.join(',')
+     */
+    customizeContent?(value?: string[]): string;
+    labelAction?: FieldLabelProps['action'];
+    onChange?: (value: string[]) => void;
+    onReachEnd?: (entry: IntersectionObserverEntry) => void;
+    /**
+     * @preserve
+     * @deprecated This prop is no longer required and will be removed in v2 of the DS.
+     * It has no effect on the component.
+     */
+    selectButtonTitle?: string;
+    value?: string[] | null;
+    withTags?: boolean;
+};
+export type MultiSelectProps = (MultiSelectPropsWithoutLabel & {
+    label: string;
+    'aria-label'?: never;
+}) | (MultiSelectPropsWithoutLabel & {
+    'aria-label': string;
+    label?: never;
+});
+export declare const MultiSelect: React.ForwardRefExoticComponent<MultiSelectProps & React.RefAttributes<HTMLDivElement>>;
+export interface MultiSelectOptionProps extends Omit<SelectParts.ItemProps, 'value'> {
+    startIcon?: React.ReactNode;
+    value: string | number;
+}
+export declare const MultiSelectOption: React.ForwardRefExoticComponent<MultiSelectOptionProps & React.RefAttributes<HTMLDivElement>>;
+export interface MultiSelectGroupProps extends Pick<MultiSelectOptionProps, 'startIcon'> {
+    children: React.ReactNode;
+    label: string;
+    values?: string[];
+}
+export declare const MultiSelectGroup: React.ForwardRefExoticComponent<MultiSelectGroupProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/dist/Select/MultiSelect.js

@@ -44,7 +44,7 @@ function _interopNamespace(e) {
 const React__namespace = /*#__PURE__*/_interopNamespace(React);
 const styled__default = /*#__PURE__*/_interopDefault(styled);
 
-const MultiSelect = React__namespace.forwardRef(({ 'aria-label': ariaLabel, children, clearLabel = 'Clear', customizeContent, disabled, error, hint, id, label, labelAction, onChange, onClear, onReachEnd, placeholder, required, selectButtonTitle: _deprecatedSelectButtonTitle, startIcon, size = 'M', value: passedValue, withTags, ...restProps }, forwardedRef) => {
+const MultiSelect = React__namespace.forwardRef(({ 'aria-label': ariaLabel, children, clearLabel = 'Clear', customizeContent, disabled, error, hint, id, label, labelAction, onChange, onClear, onCloseAutoFocus, onReachEnd, placeholder, required, selectButtonTitle: _deprecatedSelectButtonTitle, startIcon, size = 'M', value: passedValue, withTags, ...restProps }, forwardedRef) => {
     /**
      * Used for the intersection observer
      */
@@ -121,7 +121,7 @@ const MultiSelect = React__namespace.forwardRef(({ 'aria-label': ariaLabel, chil
                                         : customizeContent
                                             ? customizeContent(value)
                                             : undefined
-                                    : undefined }) }), jsxRuntime.jsx(SelectParts.Portal, { children: jsxRuntime.jsx(SelectParts.Content, { position: "popper", sideOffset: 4, children: jsxRuntime.jsxs(SelectParts.Viewport, { ref: viewportRef, children: [children, jsxRuntime.jsx(Box.Box, { id: intersectionId, width: "100%", height: "1px" })] }) }) })] }), jsxRuntime.jsx(FieldHint.FieldHint, {}), jsxRuntime.jsx(FieldError.FieldError, {})] }) }));
+                                    : undefined }) }), jsxRuntime.jsx(SelectParts.Portal, { children: jsxRuntime.jsx(SelectParts.Content, { position: "popper", sideOffset: 4, onCloseAutoFocus: onCloseAutoFocus, children: jsxRuntime.jsxs(SelectParts.Viewport, { ref: viewportRef, children: [children, jsxRuntime.jsx(Box.Box, { id: intersectionId, width: "100%", height: "1px" })] }) }) })] }), jsxRuntime.jsx(FieldHint.FieldHint, {}), jsxRuntime.jsx(FieldError.FieldError, {})] }) }));
 });
 const MultiSelectOption = React__namespace.forwardRef(({ value, children, startIcon, ...restProps }, ref) => {
     return (jsxRuntime.jsxs(SelectParts.Item, { ref: ref, value: value.toString(), ...restProps, children: [startIcon && (jsxRuntime.jsx(Box.Box, { as: "span", "aria-hidden": true, children: startIcon })), jsxRuntime.jsx(SelectParts.ItemIndicator, { children: ({ isSelected, isIntermediate }) => (jsxRuntime.jsx(CheckMark, { hasRadius: true, overflow: "hidden", position: "relative", "$indeterminate": isIntermediate, "$selected": isSelected, zIndex: 1, height: "18px", width: "18px" })) }), jsxRuntime.jsx(Typography.Typography, { textColor: "neutral800", children: jsxRuntime.jsx(SelectParts.ItemText, { children: children }) })] }));

package/dist/Select/MultiSelect.mjs

@@ -17,7 +17,7 @@ import { FieldHint } from '../Field/FieldHint.mjs';
 import { FieldError } from '../Field/FieldError.mjs';
 import { Typography } from '../Typography/Typography.mjs';
 
-const MultiSelect = React.forwardRef(({ 'aria-label': ariaLabel, children, clearLabel = 'Clear', customizeContent, disabled, error, hint, id, label, labelAction, onChange, onClear, onReachEnd, placeholder, required, selectButtonTitle: _deprecatedSelectButtonTitle, startIcon, size = 'M', value: passedValue, withTags, ...restProps }, forwardedRef) => {
+const MultiSelect = React.forwardRef(({ 'aria-label': ariaLabel, children, clearLabel = 'Clear', customizeContent, disabled, error, hint, id, label, labelAction, onChange, onClear, onCloseAutoFocus, onReachEnd, placeholder, required, selectButtonTitle: _deprecatedSelectButtonTitle, startIcon, size = 'M', value: passedValue, withTags, ...restProps }, forwardedRef) => {
     /**
      * Used for the intersection observer
      */
@@ -94,7 +94,7 @@ const MultiSelect = React.forwardRef(({ 'aria-label': ariaLabel, children, clear
                                         : customizeContent
                                             ? customizeContent(value)
                                             : undefined
-                                    : undefined }) }), jsx(Portal, { children: jsx(Content, { position: "popper", sideOffset: 4, children: jsxs(Viewport, { ref: viewportRef, children: [children, jsx(Box, { id: intersectionId, width: "100%", height: "1px" })] }) }) })] }), jsx(FieldHint, {}), jsx(FieldError, {})] }) }));
+                                    : undefined }) }), jsx(Portal, { children: jsx(Content, { position: "popper", sideOffset: 4, onCloseAutoFocus: onCloseAutoFocus, children: jsxs(Viewport, { ref: viewportRef, children: [children, jsx(Box, { id: intersectionId, width: "100%", height: "1px" })] }) }) })] }), jsx(FieldHint, {}), jsx(FieldError, {})] }) }));
 });
 const MultiSelectOption = React.forwardRef(({ value, children, startIcon, ...restProps }, ref) => {
     return (jsxs(Item, { ref: ref, value: value.toString(), ...restProps, children: [startIcon && (jsx(Box, { as: "span", "aria-hidden": true, children: startIcon })), jsx(ItemIndicator, { children: ({ isSelected, isIntermediate }) => (jsx(CheckMark, { hasRadius: true, overflow: "hidden", position: "relative", "$indeterminate": isIntermediate, "$selected": isSelected, zIndex: 1, height: "18px", width: "18px" })) }), jsx(Typography, { textColor: "neutral800", children: jsx(ItemText, { children: children }) })] }));

package/dist/Select/MultiSelectNested.d.ts

@@ -0,0 +1,13 @@
+import { MultiSelectGroupProps, MultiSelectOptionProps, MultiSelectProps } from './MultiSelect';
+interface MulitSelectNestedOption extends Omit<MultiSelectOptionProps, 'children' | 'value'> {
+    value: string | number;
+    label: string;
+}
+interface MulitSelectNestedGroup extends Omit<MultiSelectGroupProps, 'children'> {
+    children: Array<MulitSelectNestedOption>;
+}
+export type MultiSelectNestedProps = MultiSelectProps & {
+    options: Array<MulitSelectNestedOption | MulitSelectNestedGroup>;
+};
+export declare const MultiSelectNested: ({ options, ...props }: MultiSelectNestedProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Select/OptGroup.d.ts

@@ -0,0 +1,9 @@
+import { MultiSelectGroupProps } from './MultiSelect';
+/**
+ * @preserve
+ * @deprecated This component is only fit for the MultiSelect component.
+ * Therefore, you should import the MultiSelectGroup component instead.
+ */
+declare const OptGroup: import("react").ForwardRefExoticComponent<MultiSelectGroupProps & import("react").RefAttributes<HTMLDivElement>>;
+export { OptGroup };
+export type { MultiSelectGroupProps as OptGroupProps };

package/dist/Select/Option.d.ts

@@ -0,0 +1,13 @@
+import { MultiSelectOptionProps } from './MultiSelect';
+import { SingleSelectOptionProps } from './SingleSelect';
+export type OptionProps = (SingleSelectOptionProps & {
+    multi?: never;
+}) | (MultiSelectOptionProps & {
+    multi: true;
+});
+/**
+ * @preserve
+ * @deprecated You should import the specific type of option you want to render,
+ * e.g. `import { MultiSelectOption } from '@strapi/design-system';`
+ */
+export declare const Option: ({ multi, ...restProps }: OptionProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Select/Select.d.ts

@@ -0,0 +1,18 @@
+import { MultiSelectProps } from './MultiSelect';
+import { SingleSelectProps } from './SingleSelect';
+export type SelectProps = (SingleSelectProps & {
+    multi?: never;
+    withTags?: never;
+}) | (MultiSelectProps & {
+    multi: true;
+});
+export declare const useSelectContext: () => {
+    multi: boolean;
+};
+/**
+ * @preserve
+ * @deprecated You should import the specific type of select you want to render
+ *
+ * e.g. `import { MultiSelect } from '@strapi/design-system';`
+ */
+export declare const Select: (props: SelectProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Select/SelectList.d.ts

@@ -0,0 +1,25 @@
+import * as React from 'react';
+declare const DownState: {
+    readonly Keyboard: "down:keyboard";
+    readonly Mouse: "down:mouse";
+};
+declare const UpState: {
+    readonly Keyboard: "up:keyboard";
+    readonly Mouse: "up:mouse";
+};
+type AllStates = (typeof DownState)[keyof typeof DownState] | (typeof UpState)[keyof typeof UpState];
+export interface SelectListProps {
+    labelledBy?: string;
+    multi?: boolean;
+    expanded: AllStates;
+    onEscape: () => void;
+    onSelectItem: (value: string | string[], group?: string) => void;
+    children: React.ReactNode;
+}
+/**
+ * @preserve
+ * @deprecated This component will be removed in the next major release.
+ * If you need a custom listbox I would recommend opening a new issue.
+ */
+export declare const SelectList: ({ labelledBy, onSelectItem, children, multi, onEscape, expanded, }: SelectListProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Select/SelectParts.d.ts

@@ -0,0 +1,67 @@
+import * as React from 'react';
+import { Select } from '@strapi/ui-primitives';
+import { BoxProps } from '../Box';
+import { TypographyProps } from '../Typography';
+interface TriggerProps extends BoxProps<'div'> {
+    /**
+     * @default "Clear"
+     */
+    clearLabel?: string;
+    disabled?: boolean;
+    hasError?: boolean;
+    onClear?: (e: React.MouseEvent<HTMLButtonElement | HTMLDivElement>) => void;
+    startIcon?: React.ReactElement;
+    /**
+     * @default "M"
+     */
+    size?: 'S' | 'M';
+}
+interface ValueProps extends Omit<TypographyProps, 'children' | 'placeholder'>, Pick<Select.SelectValueProps, 'placeholder' | 'children'> {
+    asChild?: boolean;
+}
+interface ItemProps extends Select.SelectItemProps {
+}
+declare const Root: {
+    (props: Select.SelectProps & {
+        __scopeSelect?: import("@radix-ui/react-context").Scope;
+    }): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const Trigger: React.ForwardRefExoticComponent<TriggerProps & React.RefAttributes<HTMLDivElement>>;
+declare const Value: React.ForwardRefExoticComponent<ValueProps & React.RefAttributes<HTMLSpanElement>>;
+declare const Portal: {
+    (props: Select.SelectPortalProps & {
+        __scopeSelect?: import("@radix-ui/react-context").Scope;
+    }): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const Content: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<Select.SelectContentImplProps & React.RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
+declare const Viewport: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<Pick<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "asChild"> & React.RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
+declare const Item: React.ForwardRefExoticComponent<ItemProps & React.RefAttributes<HTMLDivElement>>;
+declare const ItemIndicator: React.ForwardRefExoticComponent<Select.SelectItemIndicatorProps & React.RefAttributes<HTMLSpanElement>>;
+declare const ItemText: React.ForwardRefExoticComponent<Pick<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
+    ref?: React.RefObject<HTMLSpanElement> | ((instance: HTMLSpanElement | null) => void) | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "key" | keyof React.HTMLAttributes<HTMLSpanElement> | "asChild"> & React.RefAttributes<HTMLSpanElement>>;
+declare const Group: React.ForwardRefExoticComponent<Pick<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "asChild"> & React.RefAttributes<HTMLDivElement>>;
+type SelectProps = Select.SelectProps;
+type SingleSelectProps = Select.SingleSelectProps;
+type MultiSelectProps = Select.MultiSelectProps;
+type PortalProps = Select.SelectPortalProps;
+type ContentProps = Select.SelectContentProps;
+type ViewportProps = Select.SelectViewportProps;
+type ItemIndicatorProps = Select.SelectItemIndicatorProps;
+type ItemTextProps = Select.SelectItemTextProps;
+type GroupProps = Select.SelectGroupProps;
+type ValueRenderFn = Select.SelectValueRenderFn;
+export { Root, Trigger, Value, Portal, Content, Viewport, Item, ItemIndicator, ItemText, Group };
+export type { SingleSelectProps, MultiSelectProps, SelectProps, TriggerProps, ValueProps, ValueRenderFn, PortalProps, ContentProps, ViewportProps, ItemProps, ItemIndicatorProps, ItemTextProps, GroupProps, };

package/dist/Select/SingleSelect.d.ts

@@ -0,0 +1,41 @@
+import * as React from 'react';
+import * as SelectParts from './SelectParts';
+import { FieldLabelProps, FieldProps } from '../Field';
+type SingleSelectPropsWithoutLabel = Omit<SelectParts.SingleSelectProps, 'value'> & Pick<SelectParts.ContentProps, 'onCloseAutoFocus'> & Pick<SelectParts.TriggerProps, 'clearLabel' | 'onClear' | 'size' | 'startIcon' | 'placeholder'> & Pick<FieldProps, 'error' | 'hint' | 'id'> & {
+    /**
+     * @default (value) => value.toString()
+     */
+    customizeContent?(value?: string | number): string;
+    labelAction?: FieldLabelProps['action'];
+    onChange?: (value: string | number) => void;
+    onReachEnd?: (entry: IntersectionObserverEntry) => void;
+    /**
+     * @preserve
+     * @deprecated This prop is no longer required and will be removed in v2 of the DS.
+     * It has no effect on the component.
+     */
+    selectButtonTitle?: string;
+    value?: string | number | null;
+};
+export type SingleSelectProps = (SingleSelectPropsWithoutLabel & {
+    label: string;
+    'aria-label'?: never;
+}) | (SingleSelectPropsWithoutLabel & {
+    'aria-label': string;
+    label?: never;
+});
+export type SingleSelectElement = SingleSelectInputElement;
+export declare const SingleSelect: React.ForwardRefExoticComponent<SingleSelectProps & React.RefAttributes<HTMLDivElement>>;
+export interface SingleSelectInputProps extends Omit<SingleSelectPropsWithoutLabel, 'labelAction' | 'hint' | 'id'> {
+    'aria-label'?: string;
+    id?: string;
+    label?: string;
+}
+export type SingleSelectInputElement = HTMLDivElement;
+export declare const SingleSelectInput: React.ForwardRefExoticComponent<SingleSelectInputProps & React.RefAttributes<HTMLDivElement>>;
+export interface SingleSelectOptionProps extends Omit<SelectParts.ItemProps, 'value'> {
+    startIcon?: React.ReactNode;
+    value: string | number;
+}
+export declare const SingleSelectOption: React.ForwardRefExoticComponent<SingleSelectOptionProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/dist/Select/SingleSelect.js

@@ -50,7 +50,7 @@ const SingleSelect = React__namespace.forwardRef(({ error, hint, id, label, labe
     const composedTriggerRefs = useComposeRefs.useComposedRefs(forwardedRef, triggerRef);
     return (jsxRuntime.jsx(Field.Field, { hint: hint, error: error, id: generatedId, required: required, children: jsxRuntime.jsxs(Flex.Flex, { direction: "column", alignItems: "stretch", gap: 1, children: [label ? (jsxRuntime.jsx(FieldLabel.FieldLabel, { onClick: handleFieldLabelClick, action: labelAction, children: label })) : null, jsxRuntime.jsx(SingleSelectInput, { label: label, id: generatedId, ref: composedTriggerRefs, required: required, ...restProps }), jsxRuntime.jsx(FieldHint.FieldHint, {}), jsxRuntime.jsx(FieldError.FieldError, {})] }) }));
 });
-const SingleSelectInput = React__namespace.forwardRef(({ 'aria-label': ariaLabel, id, children, clearLabel = 'Clear', customizeContent, disabled, error, label, onChange, onClear, onReachEnd, placeholder, required, selectButtonTitle: _deprecatedSelectButtonTitle, startIcon, size = 'M', value: passedValue, ...restProps }, forwardedRef) => {
+const SingleSelectInput = React__namespace.forwardRef(({ 'aria-label': ariaLabel, id, children, clearLabel = 'Clear', customizeContent, disabled, error, label, onChange, onClear, onCloseAutoFocus, onReachEnd, placeholder, required, selectButtonTitle: _deprecatedSelectButtonTitle, startIcon, size = 'M', value: passedValue, ...restProps }, forwardedRef) => {
     /**
      * These values are drawn out from the internals of the Radix component
      * We can then use them to react to visual changes for the component
@@ -100,7 +100,7 @@ const SingleSelectInput = React__namespace.forwardRef(({ 'aria-label': ariaLabel
         skipWhen: !internalIsOpen,
     });
     const value = (typeof passedValue !== 'undefined' && passedValue !== null ? passedValue.toString() : internalValue) ?? '';
-    return (jsxRuntime.jsxs(SelectParts.Root, { onOpenChange: handleOpenChange, disabled: disabled, required: required, onValueChange: handleValueChange, value: value, ...restProps, children: [jsxRuntime.jsx(SelectParts.Trigger, { ref: forwardedRef, "aria-label": label ?? ariaLabel, "aria-describedby": id ? `${hintId} ${errorId}` : undefined, id: id, startIcon: startIcon, size: size, hasError: Boolean(error), disabled: disabled, clearLabel: clearLabel, onClear: value && onClear ? handleOnClear : undefined, children: jsxRuntime.jsx(SelectParts.Value, { placeholder: placeholder, textColor: value ? 'neutral800' : 'neutral600', children: value && customizeContent ? customizeContent(value) : undefined }) }), jsxRuntime.jsx(SelectParts.Portal, { children: jsxRuntime.jsx(SelectParts.Content, { position: "popper", sideOffset: 4, children: jsxRuntime.jsxs(SelectParts.Viewport, { ref: viewportRef, children: [children, jsxRuntime.jsx(Box.Box, { id: intersectionId, width: "100%", height: "1px" })] }) }) })] }));
+    return (jsxRuntime.jsxs(SelectParts.Root, { onOpenChange: handleOpenChange, disabled: disabled, required: required, onValueChange: handleValueChange, value: value, ...restProps, children: [jsxRuntime.jsx(SelectParts.Trigger, { ref: forwardedRef, "aria-label": label ?? ariaLabel, "aria-describedby": id ? `${hintId} ${errorId}` : undefined, id: id, startIcon: startIcon, size: size, hasError: Boolean(error), disabled: disabled, clearLabel: clearLabel, onClear: value && onClear ? handleOnClear : undefined, children: jsxRuntime.jsx(SelectParts.Value, { placeholder: placeholder, textColor: value ? 'neutral800' : 'neutral600', children: value && customizeContent ? customizeContent(value) : undefined }) }), jsxRuntime.jsx(SelectParts.Portal, { children: jsxRuntime.jsx(SelectParts.Content, { position: "popper", sideOffset: 4, onCloseAutoFocus: onCloseAutoFocus, children: jsxRuntime.jsxs(SelectParts.Viewport, { ref: viewportRef, children: [children, jsxRuntime.jsx(Box.Box, { id: intersectionId, width: "100%", height: "1px" })] }) }) })] }));
 });
 const SingleSelectOption = React__namespace.forwardRef(({ value, startIcon, children, ...restProps }, ref) => {
     return (jsxRuntime.jsxs(SelectParts.Item, { ref: ref, value: value.toString(), ...restProps, children: [startIcon && (jsxRuntime.jsx(Box.Box, { as: "span", "aria-hidden": true, children: startIcon })), jsxRuntime.jsx(Typography.Typography, { textColor: "neutral800", children: jsxRuntime.jsx(SelectParts.ItemText, { children: children }) })] }));

package/dist/Select/SingleSelect.mjs

@@ -26,7 +26,7 @@ const SingleSelect = React.forwardRef(({ error, hint, id, label, labelAction, re
     const composedTriggerRefs = useComposedRefs(forwardedRef, triggerRef);
     return (jsx(Field, { hint: hint, error: error, id: generatedId, required: required, children: jsxs(Flex, { direction: "column", alignItems: "stretch", gap: 1, children: [label ? (jsx(FieldLabel, { onClick: handleFieldLabelClick, action: labelAction, children: label })) : null, jsx(SingleSelectInput, { label: label, id: generatedId, ref: composedTriggerRefs, required: required, ...restProps }), jsx(FieldHint, {}), jsx(FieldError, {})] }) }));
 });
-const SingleSelectInput = React.forwardRef(({ 'aria-label': ariaLabel, id, children, clearLabel = 'Clear', customizeContent, disabled, error, label, onChange, onClear, onReachEnd, placeholder, required, selectButtonTitle: _deprecatedSelectButtonTitle, startIcon, size = 'M', value: passedValue, ...restProps }, forwardedRef) => {
+const SingleSelectInput = React.forwardRef(({ 'aria-label': ariaLabel, id, children, clearLabel = 'Clear', customizeContent, disabled, error, label, onChange, onClear, onCloseAutoFocus, onReachEnd, placeholder, required, selectButtonTitle: _deprecatedSelectButtonTitle, startIcon, size = 'M', value: passedValue, ...restProps }, forwardedRef) => {
     /**
      * These values are drawn out from the internals of the Radix component
      * We can then use them to react to visual changes for the component
@@ -76,7 +76,7 @@ const SingleSelectInput = React.forwardRef(({ 'aria-label': ariaLabel, id, child
         skipWhen: !internalIsOpen,
     });
     const value = (typeof passedValue !== 'undefined' && passedValue !== null ? passedValue.toString() : internalValue) ?? '';
-    return (jsxs(Root, { onOpenChange: handleOpenChange, disabled: disabled, required: required, onValueChange: handleValueChange, value: value, ...restProps, children: [jsx(Trigger, { ref: forwardedRef, "aria-label": label ?? ariaLabel, "aria-describedby": id ? `${hintId} ${errorId}` : undefined, id: id, startIcon: startIcon, size: size, hasError: Boolean(error), disabled: disabled, clearLabel: clearLabel, onClear: value && onClear ? handleOnClear : undefined, children: jsx(Value, { placeholder: placeholder, textColor: value ? 'neutral800' : 'neutral600', children: value && customizeContent ? customizeContent(value) : undefined }) }), jsx(Portal, { children: jsx(Content, { position: "popper", sideOffset: 4, children: jsxs(Viewport, { ref: viewportRef, children: [children, jsx(Box, { id: intersectionId, width: "100%", height: "1px" })] }) }) })] }));
+    return (jsxs(Root, { onOpenChange: handleOpenChange, disabled: disabled, required: required, onValueChange: handleValueChange, value: value, ...restProps, children: [jsx(Trigger, { ref: forwardedRef, "aria-label": label ?? ariaLabel, "aria-describedby": id ? `${hintId} ${errorId}` : undefined, id: id, startIcon: startIcon, size: size, hasError: Boolean(error), disabled: disabled, clearLabel: clearLabel, onClear: value && onClear ? handleOnClear : undefined, children: jsx(Value, { placeholder: placeholder, textColor: value ? 'neutral800' : 'neutral600', children: value && customizeContent ? customizeContent(value) : undefined }) }), jsx(Portal, { children: jsx(Content, { position: "popper", sideOffset: 4, onCloseAutoFocus: onCloseAutoFocus, children: jsxs(Viewport, { ref: viewportRef, children: [children, jsx(Box, { id: intersectionId, width: "100%", height: "1px" })] }) }) })] }));
 });
 const SingleSelectOption = React.forwardRef(({ value, startIcon, children, ...restProps }, ref) => {
     return (jsxs(Item, { ref: ref, value: value.toString(), ...restProps, children: [startIcon && (jsx(Box, { as: "span", "aria-hidden": true, children: startIcon })), jsx(Typography, { textColor: "neutral800", children: jsx(ItemText, { children: children }) })] }));

package/dist/Select/__tests__/MultiSelect.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/Select/__tests__/MultiSelectNested.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/Select/__tests__/Select.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/Select/__tests__/SingleSelect.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/Select/index.d.ts

@@ -0,0 +1,17 @@
+export { MultiSelectNested } from './MultiSelectNested';
+export type { MultiSelectNestedProps } from './MultiSelectNested';
+export { MultiSelect, MultiSelectGroup, MultiSelectOption } from './MultiSelect';
+export type { MultiSelectProps, MultiSelectGroupProps, MultiSelectOptionProps } from './MultiSelect';
+export { SingleSelect, SingleSelectOption } from './SingleSelect';
+export type { SingleSelectProps, SingleSelectOptionProps } from './SingleSelect';
+/**
+ * These are deprecated
+ */
+export { Select } from './Select';
+export type { SelectProps } from './Select';
+export { Option } from './Option';
+export type { OptionProps } from './Option';
+export { OptGroup } from './OptGroup';
+export type { OptGroupProps } from './OptGroup';
+export { SelectList } from './SelectList';
+export type { SelectListProps } from './SelectList';

package/dist/SimpleMenu/SimpleMenu.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { Placement } from '@floating-ui/react-dom';
+import { NavLinkProps } from 'react-router-dom';
+export interface MenuItemProps extends Omit<NavLinkProps, 'to'> {
+    as?: React.ElementType;
+    children: React.ReactNode;
+    href?: string;
+    isFocused?: boolean;
+    onClick?: () => void;
+    to?: string;
+    isExternal?: boolean;
+}
+export declare const MenuItem: ({ children, onClick, to, isFocused, href, ...props }: MenuItemProps) => import("react/jsx-runtime").JSX.Element;
+export type SimpleMenuProps<As extends React.ElementType = React.ElementType> = Omit<React.ComponentPropsWithoutRef<As>, 'as' | 'children' | 'id' | 'label' | 'onClose' | 'onOpen' | 'onReachEnd' | 'popoverPlacement' | 'size'> & {
+    as?: As;
+    children: React.ReactNode;
+    id?: string;
+    label: React.ReactElement | string | number;
+    onClose?: () => void;
+    onOpen?: () => void;
+    /**
+     * Callback function to be called when the popover reaches the end of the scrollable content
+     */
+    onReachEnd?: () => void;
+    popoverPlacement?: Placement;
+    /**
+     * Size of the trigger button.
+     * Note: in case a custom component is passed through the "as"
+     * prop, the size prop is passed along too, but needs to be handled there
+     */
+    size?: 'S' | 'M';
+};
+export declare const SimpleMenu: <As extends React.ElementType<any> = React.ForwardRefExoticComponent<import("../Button").ButtonProps & React.RefAttributes<HTMLButtonElement>>>({ label, children, id, as: asComp, onOpen, onClose, size, popoverPlacement, onReachEnd, ...props }: SimpleMenuProps<As>) => import("react/jsx-runtime").JSX.Element;

package/dist/SimpleMenu/__tests__/SimpleMenu.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/SimpleMenu/index.d.ts

@@ -0,0 +1 @@
+export * from './SimpleMenu';

package/dist/SimpleMenu/utils.d.ts

@@ -0,0 +1,3 @@
+export declare const getOptionStyle: ({ theme }: {
+    theme: any;
+}) => string;

package/dist/Stack/Stack.d.ts

@@ -0,0 +1,20 @@
+import { DefaultTheme } from 'styled-components';
+import { FlexProps } from '../Flex';
+export interface StackProps extends FlexProps {
+    /**
+     * If `true`, align the `Stack` item horizontally.
+     */
+    horizontal?: boolean;
+    /**
+     * @preserve
+     * @deprecated use `spacing` instead
+     * The space between stack item.
+     */
+    size?: keyof DefaultTheme['spaces'];
+    /**
+     * The space between stack item.
+     * See [theme.spaces](https://design-system-git-main-strapijs.vercel.app/?path=/story/design-system-components-theme--spaces)
+     */
+    spacing?: keyof DefaultTheme['spaces'];
+}
+export declare const Stack: import("react").ForwardRefExoticComponent<StackProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/Stack/index.d.ts

@@ -0,0 +1 @@
+export * from './Stack';

package/dist/Status/Status.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { BoxProps } from '../Box';
+export type StatusVariant = 'alternative' | 'danger' | 'neutral' | 'primary' | 'secondary' | 'success' | 'warning';
+export type StatusSize = 'S' | 'M';
+export interface StatusProps extends BoxProps {
+    variant?: StatusVariant;
+    /**
+     * If `false`, the preceeding bullet of the status won't be displayed.
+     * This prop and the bullet will be removed in the next major version.
+     */
+    showBullet?: boolean;
+    size?: StatusSize;
+    children: React.ReactNode;
+}
+export declare const Status: ({ variant, showBullet, size, children, ...props }: StatusProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Status/__tests__/Status.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/Status/index.d.ts

@@ -0,0 +1 @@
+export * from './Status';

package/dist/SubNav/SubNav.d.ts

@@ -0,0 +1,6 @@
+import { GridProps } from '../Grid';
+export interface SubNavProps extends GridProps {
+    ariaLabel: string;
+}
+export declare const subNavWidth = "14.5rem";
+export declare const SubNav: ({ ariaLabel, ...props }: SubNavProps) => import("react/jsx-runtime").JSX.Element;

package/dist/SubNav/SubNavHeader.d.ts

@@ -0,0 +1,13 @@
+import React, { ChangeEventHandler } from 'react';
+export interface SubNavHeaderProps {
+    as?: string | React.ComponentType<any>;
+    id: string;
+    label: string;
+    onChange?: ChangeEventHandler<HTMLInputElement>;
+    onClear?: (event: Event) => void;
+    onSubmit?: React.FormEventHandler;
+    searchable: boolean;
+    searchLabel?: string;
+    value?: string;
+}
+export declare const SubNavHeader: ({ as, label, searchLabel, searchable, onChange, value, onClear, onSubmit, id, }: SubNavHeaderProps) => import("react/jsx-runtime").JSX.Element;

package/dist/SubNav/SubNavLink.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { BoxProps } from '../Box';
+export interface SubNavLinkProps extends BoxProps {
+    icon: React.ReactNode;
+    isSubSectionChild?: boolean;
+    withBullet?: boolean;
+}
+export declare const SubNavLink: ({ children, icon, withBullet, isSubSectionChild, ...props }: SubNavLinkProps) => import("react/jsx-runtime").JSX.Element;

package/dist/SubNav/SubNavLinkSection.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+export interface SubNavLinkSectionProps {
+    children: React.ReactNode;
+    id: string;
+    label: string;
+}
+export declare const SubNavLinkSection: ({ label, children, id }: SubNavLinkSectionProps) => import("react/jsx-runtime").JSX.Element;