@iress-oss/ids-components 5.20.2 → 6.0.0-alpha.1

package/dist/src/components/RichSelect/SelectMenu/SelectMenu.d.ts

@@ -0,0 +1,52 @@
+import { IressMenuItemProps, IressMenuProps } from '../../Menu';
+import { ReactNode } from 'react';
+import { ControlledValue } from '../../../hooks';
+import { FormattedLabelValueMeta, LabelValueMeta } from '../../../interfaces';
+import { FormControlValue } from '../../../types';
+export interface IressSelectMenuProps<TMultiple extends boolean = false> extends Omit<IressMenuProps<FormControlValue, TMultiple>, 'children' | 'onChange' | 'selected' | 'type'> {
+    /**
+     * Heading slot. Often used for a title or description.
+     * If a string, will automatically provide an id for aria-labelledby.
+     */
+    heading?: ReactNode;
+    /**
+     * Hide selected items from menu.
+     * Useful for autocomplete scenarios.
+     */
+    hideSelectedItems?: boolean;
+    /**
+     * Items to be displayed in the menu, array of FormattedLabelValueMeta.
+     */
+    items?: FormattedLabelValueMeta[];
+    /**
+     * Maximum number of results displayed on mobile screen sizes (< 768).
+     */
+    limitMobile?: number;
+    /**
+     * Maximum number of results displayed on larger screen sizes (>= 768).
+     */
+    limitDesktop?: number;
+    /**
+     * No results text to display when no items are found.
+     */
+    noResults?: ReactNode;
+    /**
+     * Emitted when the value changes when item is selected from the menu
+     */
+    onChange?: (selected?: ControlledValue<LabelValueMeta, TMultiple>) => void;
+    /**
+     * Selected items.
+     */
+    selected?: ControlledValue<LabelValueMeta, TMultiple>;
+    /**
+     * Set whether to display selected items first in the menu.
+     */
+    selectedFirst?: boolean;
+}
+export interface IressSelectMenuItemProps extends Omit<IressMenuItemProps<'button'>, 'value'>, FormattedLabelValueMeta {
+    /**
+     * Set whether this item is hidden on mobile
+     */
+    hiddenOnMobile?: boolean;
+}
+export declare const IressSelectMenu: <TMultiple extends boolean = false>({ heading, hideSelectedItems, items, limitDesktop, limitMobile, multiSelect, noResults, onChange, role, selected, selectedFirst, ...restProps }: IressSelectMenuProps<TMultiple>) => import("react/jsx-runtime").JSX.Element;

package/dist/src/components/RichSelect/SelectMenu/SelectMenu.styles.d.ts

@@ -0,0 +1 @@
+export declare const selectMenu: import('../../../styled-system/types').SlotRecipeRuntimeFn<"root", {}>;

package/dist/src/components/RichSelect/SelectMenu/SelectMenuItem.d.ts

@@ -0,0 +1,2 @@
+import { IressSelectMenuItemProps } from './SelectMenu';
+export declare const IressSelectMenuItem: ({ className, divider, formattedLabel, formattedMeta, hiddenOnMobile, label, meta, value, append, canToggle, onClick, onKeyDown, prepend, role, selected, "data-testid": dataTestId, "aria-describedby": ariaDescribedBy, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, id, }: IressSelectMenuItemProps) => import("react/jsx-runtime").JSX.Element;

package/dist/src/components/RichSelect/SelectSearch/SelectSearch.d.ts

@@ -0,0 +1,3 @@
+import { IressInputPopoverProps } from '../../Popover';
+export type IressSelectSearchProps = Omit<IressInputPopoverProps, 'disabledAutoToggle' | 'displayMode' | 'show' | 'width'>;
+export declare const IressSelectSearch: ({ className, contentClassName, contentStyle, onKeyDown, ...restProps }: IressSelectSearchProps) => import("react/jsx-runtime").JSX.Element;

package/dist/src/components/RichSelect/SelectSearch/SelectSearch.styles.d.ts

@@ -0,0 +1 @@
+export declare const selectSearch: import('../../../styled-system/types').SlotRecipeRuntimeFn<"content" | "root", import('../../../styled-system/types').SlotRecipeVariantRecord<"content" | "root">>;

package/dist/src/components/RichSelect/SelectSearchInput/SelectSearchInput.d.ts

@@ -0,0 +1,14 @@
+import { InputRef, IressInputProps } from '../../Input';
+export interface IressSelectSearchInputProps extends Omit<IressInputProps, 'rows' | 'width'> {
+    /**
+     * Content to place inside the input when it has no value.
+     * @default Search
+     **/
+    placeholder?: string;
+    /**
+     * Content to prepended to the input field, usually an icon.
+     * @default <IressIcon name="search" />
+     **/
+    prepend?: React.ReactNode;
+}
+export declare const IressSelectSearchInput: import('react').ForwardRefExoticComponent<IressSelectSearchInputProps & import('react').RefAttributes<InputRef>>;

package/dist/src/components/RichSelect/SelectSearchInput/SelectSearchInput.styles.d.ts

@@ -0,0 +1 @@
+export declare const selectSearchInput: import('../../../styled-system/types').SlotRecipeRuntimeFn<"root", {}>;

package/dist/src/components/RichSelect/SelectTags/SelectTags.d.ts

@@ -0,0 +1,32 @@
+import { ReactNode } from 'react';
+import { IressTextProps } from '../../Text';
+import { IressSelectActivatorProps } from '../components/SelectActivator';
+import { LabelValueMeta } from '../../../interfaces';
+export interface IressSelectTagsProps extends Omit<IressSelectActivatorProps, 'width'>, Omit<IressTextProps, 'element' | 'width'> {
+    /**
+     * Append content.
+     */
+    append?: ReactNode;
+    /**
+     * The id of the select element.
+     */
+    id?: string;
+    /**
+     * Emitted when a tag is deleted.
+     */
+    onDelete?: (item?: LabelValueMeta, e?: React.SyntheticEvent<HTMLButtonElement>) => void;
+    /**
+     * Emitted when the combined tag delete button is clicked.
+     */
+    onDeleteAll?: (e: React.SyntheticEvent<HTMLButtonElement>) => void;
+    /**
+     * Emitted when actions are toggled.
+     */
+    onToggleActions?: (open?: boolean) => void;
+    /**
+     * Limit of tags to display before shortening to `selectedOptionsText`
+     * @default 5
+     */
+    limit?: number;
+}
+export declare const IressSelectTags: ({ append, className, "data-testid": dataTestId, id, limit, onDelete, onDeleteAll, onToggleActions, placeholder, prepend, selected, selectedOptionsText, ...restProps }: IressSelectTagsProps) => import("react/jsx-runtime").JSX.Element;

package/dist/src/components/RichSelect/SelectTags/SelectTags.styles.d.ts

@@ -0,0 +1,16 @@
+export declare const selectTags: import('../../../styled-system/types').SlotRecipeRuntimeFn<"placeholder" | "tag" | "root" | "append" | "prepend" | "tagsList", {
+    showDefaultChevron: {
+        true: {
+            root: {
+                alignSelf: "center";
+                position: "relative";
+            };
+            append: {
+                selectChevron: true;
+            };
+        };
+        false: {
+            append: {};
+        };
+    };
+}>;

package/dist/src/components/RichSelect/components/SelectActivator.d.ts

@@ -0,0 +1,38 @@
+import { IressRichSelectProps, SelectLabelRenderProps } from '../RichSelect';
+import { LabelValueMeta } from '../../../interfaces';
+import { ReactNode } from 'react';
+import { IressInputProps } from '../../Input';
+export interface IressSelectActivatorProps {
+    /**
+     * Append content.
+     * @default <IressIcon name="chevron-down" size="xs" />
+     */
+    append?: ReactNode;
+    /**
+     * Placeholder, shown when there is nothing selected.
+     */
+    placeholder?: ReactNode;
+    /**
+     * Prepend content.
+     */
+    prepend?: ReactNode;
+    /**
+     * Selected items.
+     */
+    selected?: LabelValueMeta | LabelValueMeta[];
+    /**
+     * Text displayed next to label when two or more options are selected.
+     * @default {{numOptions}} selected
+     */
+    selectedOptionsText?: string;
+    /**
+     * The width of the select.
+     */
+    width?: IressInputProps['width'];
+}
+interface SelectActivatorProps<TMultiple extends boolean = false> extends Pick<IressRichSelectProps<TMultiple>, 'id' | 'multiSelect' | 'onChange' | 'placeholder' | 'renderLabel' | 'value' | 'append' | 'prepend' | 'selectedOptionsText'>, Omit<SelectLabelRenderProps<TMultiple>, 'close'> {
+    async?: boolean;
+    setShow: (show: boolean) => void;
+}
+export declare const SelectActivator: <TMultiple extends boolean = false>({ append, async, id, error, loading, multiSelect, onChange, placeholder, prepend, renderLabel, selectedOptionsText, setShow, setValue, show, value, }: SelectActivatorProps<TMultiple>) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/src/components/RichSelect/components/SelectHiddenInput.d.ts

@@ -0,0 +1,27 @@
+import { IressRichSelectProps } from '../RichSelect';
+import { ControlledValue } from '../../../hooks/useControlledState';
+import { LabelValueMeta } from '../../../interfaces';
+import { ForwardedRef, ReactElement } from 'react';
+export interface SelectHiddenInputRenderProps<TMultiple extends boolean = false> {
+    /**
+     * Gets the current value as a string, separated by comma. Use this if you are using an uncontrolled select.
+     */
+    getValuesString: () => string;
+    /**
+     * Selected items.
+     */
+    value?: ControlledValue<LabelValueMeta, TMultiple>;
+    /**
+     * Set the reference of the hidden input. Required to be set if needed to work with React Hook Forms.
+     */
+    ref?: ForwardedRef<HTMLInputElement>;
+    /**
+     * Whether its required.
+     */
+    required?: boolean;
+}
+type SelectHiddenInputProps<TMultiple extends boolean = false> = Pick<IressRichSelectProps<TMultiple>, 'data-testid' | 'name' | 'renderHiddenInput' | 'value' | 'required'> & SelectHiddenInputRenderProps<TMultiple>;
+export declare const SelectHiddenInput: <TMultiple extends boolean>(props: SelectHiddenInputProps<TMultiple> & {
+    ref?: ForwardedRef<HTMLInputElement>;
+}) => ReactElement;
+export {};

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

@@ -0,0 +1,8 @@
+import { IressRichSelectProps, SelectOptionsRenderProps } from '../RichSelect';
+interface SelectOptionsProps<TMultiple extends boolean = false> extends Pick<IressRichSelectProps<TMultiple>, 'autoHighlight' | 'minSearchLength' | 'multiSelect' | 'onChange' | 'options' | 'renderOptions' | 'value' | 'initialOptions'>, Omit<SelectOptionsRenderProps<TMultiple>, 'close'> {
+    setShow: (show: boolean) => void;
+    shouldShowInstructions?: boolean;
+    shouldShowNoResults?: boolean;
+}
+export declare const SelectOptions: <TMultiple extends boolean = false>({ autoHighlight, debouncedQuery, error, initialOptions: initialOptionsProp, loading, minSearchLength, multiSelect, onChange, options, query, renderOptions, results, setQuery, setShow, setValue, show, shouldShowInstructions, shouldShowNoResults, value, }: SelectOptionsProps<TMultiple>) => string | number | bigint | boolean | Iterable<import('react').ReactNode> | Promise<string | number | bigint | boolean | import('react').ReactPortal | import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | Iterable<import('react').ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element | null | undefined;
+export {};

package/dist/src/components/RichSelect/hooks/useRichSelectState.d.ts

@@ -0,0 +1,17 @@
+import { ControlledStateHook, ControlledStateProps } from '../../../hooks/useControlledState';
+import { LabelValueMeta } from '../../../interfaces';
+export interface RichSelectStateHookReturn<T extends LabelValueMeta = LabelValueMeta, TMultiple extends boolean = false> extends ControlledStateHook<T, TMultiple> {
+    getLabelsArray: () => string[];
+    getLabelsString: (separator?: string) => string;
+    getValuesArray: () => string[];
+    getValuesString: () => string;
+}
+/**
+ * This is a wrapper around useControlledState that provides additional helper functions for working with rich select state.
+ * - getLabelsArray: Returns an array of the labels of the selected items, used to create tags.
+ * - getLabelsString: Returns a string of the labels of the selected items, separated by the provided separator. Used for displaying in inputs.
+ * - getValuesArray: Returns an array of the values of the selected items. Used to compare current and previous values.
+ * - getValuesString: Returns a string of the values of the selected items, separated by commas. Used for submitting form data.
+ *
+ */
+export declare const useRichSelectState: <T extends LabelValueMeta = LabelValueMeta, TMultiple extends boolean = false>(props: ControlledStateProps<T, TMultiple>) => RichSelectStateHookReturn<T, TMultiple>;

package/dist/src/components/RichSelect/index.d.ts

@@ -0,0 +1,10 @@
+export * from './hooks/useRichSelectState';
+export * from './RichSelect';
+export * from './SelectBody/SelectBody';
+export * from './SelectCreate/SelectCreate';
+export * from './SelectHeading/SelectHeading';
+export * from './SelectLabel/SelectLabel';
+export * from './SelectMenu/SelectMenu';
+export * from './SelectSearch/SelectSearch';
+export * from './SelectSearchInput/SelectSearchInput';
+export * from './SelectTags/SelectTags';

package/dist/src/components/RichSelect/meta/Thumbnail.d.ts

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

package/dist/src/components/RichSelect/meta/index.d.ts

@@ -0,0 +1,7 @@
+declare const _default: {
+    heading: string;
+    href: string;
+    tags: string[];
+    Thumbnail: import('react').LazyExoticComponent<() => import("react/jsx-runtime").JSX.Element>;
+};
+export default _default;

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

@@ -0,0 +1,29 @@
+import { HorizontalAligns, IressStyledProps, ResponsiveProp, VerticalAligns } from '../../types';
+import { ReactNode } from 'react';
+import { PositiveSpacingToken } from '../../../theme-preset/tokens/spacing';
+export interface IressRowProps extends IressStyledProps {
+    /**
+     * Any content you would like to be contained. Best used with `IressCol`.
+     */
+    children?: ReactNode;
+    /**
+     * Sets the gap between the children `<IressCol />` components.
+     */
+    gutter?: ResponsiveProp<PositiveSpacingToken>;
+    /**
+     * Horizontal alignment, follows flexbox justify-content
+     * @default left
+     */
+    horizontalAlign?: HorizontalAligns;
+    /**
+     * Sets the size of the top and bottom gap between direct children when they begin to wrap.
+     * @see https://developer.mozilla.org/docs/Web/CSS/row-gap
+     */
+    rowGap?: ResponsiveProp<PositiveSpacingToken>;
+    /**
+     * Vertical alignment, follows flexbox align-items
+     * @default top
+     */
+    verticalAlign?: VerticalAligns;
+}
+export declare const IressRow: ({ className, ...restProps }: IressRowProps) => import("react/jsx-runtime").JSX.Element;

package/dist/src/components/Row/Row.styles.d.ts

@@ -0,0 +1,36 @@
+export declare const row: import('../../styled-system/types').RecipeRuntimeFn<{
+    horizontalAlign: {
+        left: {
+            justifyContent: "flex-start";
+        };
+        center: {
+            justifyContent: "center";
+        };
+        right: {
+            justifyContent: "flex-end";
+        };
+        around: {
+            justifyContent: "space-around";
+        };
+        between: {
+            justifyContent: "space-between";
+        };
+        evenly: {
+            justifyContent: "space-evenly";
+        };
+    };
+    verticalAlign: {
+        top: {
+            alignItems: "flex-start";
+        };
+        middle: {
+            alignItems: "center";
+        };
+        bottom: {
+            alignItems: "flex-end";
+        };
+        stretch: {
+            alignItems: "stretch";
+        };
+    };
+}>;

package/dist/src/components/Row/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Row.styles';
+export * from './Row';

package/dist/src/components/Row/meta/Thumbnail.d.ts

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

package/dist/src/components/Row/meta/index.d.ts

@@ -0,0 +1,7 @@
+declare const _default: {
+    heading: string;
+    href: string;
+    tags: string[];
+    Thumbnail: import('react').LazyExoticComponent<() => import("react/jsx-runtime").JSX.Element>;
+};
+export default _default;

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

@@ -0,0 +1,47 @@
+import { ChangeEvent, ForwardedRef, ReactElement, ReactNode } from 'react';
+import { FormControlValue, IressStyledProps } from '../../types';
+import { IressInputProps } from '../Input';
+type SelectElement<TReadonly extends boolean | undefined = undefined> = TReadonly extends true ? 'div' : 'select';
+export type IressSelectProps<T extends FormControlValue = FormControlValue, TReadonly extends boolean | undefined = undefined> = Omit<IressStyledProps<SelectElement<TReadonly>>, 'defaultValue' | 'value' | 'onChange' | 'width'> & {
+    /**
+     * The `option` and `optgroup` elements to render within the select.
+     */
+    children?: ReactNode | string;
+    /**
+     * Value of selected option for uncontrolled select.
+     */
+    defaultValue?: T;
+    /**
+     * Identifier for select.
+     */
+    name?: string;
+    /**
+     * Handles the onChange event of the select input.
+     * If you pass in a non-string value, you can access it using the second parameter of the function.
+     */
+    onChange?: (e: ChangeEvent<HTMLSelectElement>, value?: T) => void;
+    /**
+     * If `true`, the user cannot modify the value.
+     */
+    readOnly?: TReadonly;
+    /**
+     * Mark the select as a required field.
+     */
+    required?: boolean;
+    /**
+     * Value of selected option for controlled select.
+     */
+    value?: T;
+    /**
+     * Adds an `option` as the first element with the placeholder text and no value.
+     */
+    placeholder?: string;
+    /**
+     * The width of the select.
+     */
+    width?: IressInputProps['width'];
+};
+export declare const IressSelect: <T extends FormControlValue = FormControlValue, TReadonly extends boolean | undefined = undefined>(props: IressSelectProps<T, TReadonly> & {
+    ref?: ForwardedRef<HTMLElementTagNameMap[SelectElement<TReadonly>]>;
+}) => ReactElement;
+export {};

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

@@ -0,0 +1,94 @@
+/**
+ * The atomic recipe is a function that takes a variant and returns a class name object. It can be used to create a component without JSX (eg. as a utility class).
+ *
+ * [Learn more](https://panda-css.com/docs/concepts/recipes#atomic-recipe-or-cva)
+ */
+export declare const select: import('../../styled-system/types').SlotRecipeRuntimeFn<"element" | "wrapper" | "control", {
+    width: {
+        '2': {
+            wrapper: {
+                width: "[calc({spacing.spacing.200} + calc({sizes.chevron.select} * 2) + {sizes.input.2})]";
+            };
+            element: {
+                width: "auto";
+            };
+        };
+        '4': {
+            wrapper: {
+                width: "[calc({spacing.spacing.200} + calc({sizes.chevron.select} * 2) + {sizes.input.4})]";
+            };
+            element: {
+                width: "auto";
+            };
+        };
+        '6': {
+            wrapper: {
+                width: "[calc({spacing.spacing.200} + calc({sizes.chevron.select} * 2) + {sizes.input.6})]";
+            };
+            element: {
+                width: "auto";
+            };
+        };
+        '8': {
+            wrapper: {
+                width: "[calc({spacing.spacing.200} + calc({sizes.chevron.select} * 2) + {sizes.input.8})]";
+            };
+            element: {
+                width: "auto";
+            };
+        };
+        '10': {
+            wrapper: {
+                width: "[calc({spacing.spacing.200} + calc({sizes.chevron.select} * 2) + {sizes.input.10})]";
+            };
+            element: {
+                width: "auto";
+            };
+        };
+        '12': {
+            wrapper: {
+                width: "[calc({spacing.spacing.200} + calc({sizes.chevron.select} * 2) + {sizes.input.12})]";
+            };
+        };
+        '16': {
+            wrapper: {
+                width: "[calc({spacing.spacing.200} + calc({sizes.chevron.select} * 2) + {sizes.input.16})]";
+            };
+            element: {
+                width: "auto";
+            };
+        };
+        '25perc': {
+            wrapper: {
+                width: "input.25perc";
+            };
+            element: {
+                width: "auto";
+            };
+        };
+        '50perc': {
+            wrapper: {
+                width: "input.50perc";
+            };
+            element: {
+                width: "auto";
+            };
+        };
+        '75perc': {
+            wrapper: {
+                width: "input.75perc";
+            };
+            element: {
+                width: "auto";
+            };
+        };
+        '100perc': {
+            wrapper: {
+                width: "input.100perc";
+            };
+            element: {
+                width: "auto";
+            };
+        };
+    };
+}>;

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

@@ -0,0 +1,9 @@
+import { FormControlValue, IressStyledProps } from '../../../types';
+export interface IressSelectOptionProps extends Omit<IressStyledProps<'option'>, 'value'> {
+    /**
+     * Value of selected option.
+     * It will be converted to a string and used to match with the value of IressSelect during the onChange event.
+     */
+    value?: FormControlValue;
+}
+export declare const IressSelectOption: ({ value, ...restProps }: IressSelectOptionProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,24 @@
+import { ReactElement, Ref } from 'react';
+import { FormControlValue, IressUnstyledProps } from '../../../types';
+import { IressInputProps } from '../../Input';
+export interface SelectControlProps<T = FormControlValue> extends Omit<IressUnstyledProps<'select'>, 'defaultValue' | 'value' | 'width'> {
+    /**
+     * Value of selected option for uncontrolled select.
+     */
+    defaultValue?: T;
+    /**
+     * Adds an `option` as the first element with the placeholder text and no value.
+     */
+    placeholder?: string;
+    /**
+     * Value of the select.
+     */
+    value?: T;
+    /**
+     * The width of the select.
+     */
+    width?: IressInputProps['width'];
+}
+export declare const SelectControl: <T = FormControlValue>(props: SelectControlProps<T> & {
+    ref?: Ref<HTMLSelectElement>;
+}) => ReactElement;

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

@@ -0,0 +1,16 @@
+import { ReactElement, ReactNode, Ref } from 'react';
+import { FormControlValue } from '../../../types';
+import { IressReadonlyProps } from '../../Readonly';
+export interface SelectReadonlyProps<T extends FormControlValue = FormControlValue> extends Omit<IressReadonlyProps<T>, 'value'> {
+    /**
+     * The options of the select, used to locate the label of the selected value.
+     */
+    children?: ReactNode;
+    /**
+     * The value of the select.
+     */
+    value?: T;
+}
+export declare const SelectReadonly: <T extends FormControlValue = FormControlValue>(props: SelectReadonlyProps<T> & {
+    ref?: Ref<HTMLInputElement>;
+}) => ReactElement;

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

@@ -0,0 +1,16 @@
+import { FormControlValue } from '../../../types';
+import { IressSelectOptionProps, IressSelectOption } from '../SelectOption/SelectOption';
+import { ReactElement } from 'react';
+interface SelectOption<T = FormControlValue> {
+    children?: SelectOption<T>[];
+    label: string;
+    value?: T;
+}
+type NodeProps = IressSelectOptionProps & {
+    label: string;
+};
+type NodeType = typeof IressSelectOption | 'optgroup' | 'option';
+type Node = ReactElement<NodeProps, NodeType>;
+export declare const mapNodesToSelectOptions: <T = FormControlValue>(nodes: Node[] | Node) => SelectOption<T>[];
+export declare const findValueFromStringInSelectOptions: <T = FormControlValue>(value: string, options?: SelectOption<T>[]) => T | undefined;
+export {};

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

@@ -0,0 +1,3 @@
+export * from './Select.styles';
+export * from './Select';
+export * from './SelectOption/SelectOption';

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

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

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

@@ -0,0 +1,7 @@
+declare const _default: {
+    heading: string;
+    href: string;
+    tags: string[];
+    Thumbnail: import('react').LazyExoticComponent<() => import("react/jsx-runtime").JSX.Element>;
+};
+export default _default;

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

@@ -0,0 +1,25 @@
+import { IressStyledProps } from '../../types';
+import { IressCSSProps } from '../../interfaces';
+type SkeletonMode = 'rect' | 'circle' | 'text';
+export interface IressSkeletonProps<TMode extends SkeletonMode = 'text'> extends Omit<IressStyledProps, 'width' | 'height'> {
+    /**
+     * Sets the height of the skeleton bones. If no unit is specified it will default to pixels.
+     * Not allowed when in `text` mode.
+     */
+    height?: TMode extends 'text' ? never : string;
+    /**
+     * Mode of the skeleton. `rect` and `circle` must have `width` and `height` specified. `text` works with `textStyle`.
+     * @default text
+     */
+    mode?: TMode;
+    /**
+     * Use `textStyle` to specify what the Skeleton should emulate. If set to `h1` a non-break space with the same font-size and line-height of a h1 will be rendered.
+     */
+    textStyle?: IressCSSProps['textStyle'];
+    /**
+     * Sets the width of the skeleton bones. If no unit is specified it will default to pixels.
+     */
+    width?: string;
+}
+export declare const IressSkeleton: <TMode extends SkeletonMode = "text">({ className, height, width, mode: modeProp, style, "data-testid": dataTestId, ...restProps }: IressSkeletonProps<TMode>) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/src/components/Skeleton/Skeleton.styles.d.ts

@@ -0,0 +1,17 @@
+export declare const skeleton: import('../../styled-system/types').RecipeRuntimeFn<{
+    mode: {
+        rect: {
+            width: "[100%]";
+            height: "[100px]";
+        };
+        circle: {
+            borderRadius: "[50%]";
+            width: "[100px]";
+            height: "[100px]";
+        };
+        text: {
+            width: "[100%]";
+            height: "[spacing.600]";
+        };
+    };
+}>;

package/dist/src/components/Skeleton/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Skeleton';
+export * from './Skeleton.styles';

package/dist/src/components/Skeleton/meta/Thumbnail.d.ts

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

package/dist/src/components/Skeleton/meta/index.d.ts

@@ -0,0 +1,7 @@
+declare const _default: {
+    heading: string;
+    href: string;
+    tags: string[];
+    Thumbnail: import('react').LazyExoticComponent<() => import("react/jsx-runtime").JSX.Element>;
+};
+export default _default;