@atom-learning/components 6.0.0-beta.4 → 6.0.0-beta.6

package/dist/{components → src/components}/checkbox-tree/CheckboxTreeItemContent.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Flex } from '../../components/flex';
+import { Flex } from '../../../components/flex';
 type CheckboxTreeItemContentProps = React.ComponentProps<typeof Flex>;
 export declare const CheckboxTreeItemContent: ({ children, ...rest }: CheckboxTreeItemContentProps) => JSX.Element;
 export {};

package/dist/src/components/chip/Chip.d.ts

@@ -0,0 +1,39 @@
+import * as React from 'react';
+import { Icon } from '../../../components/icon';
+export declare const StyledChipContent: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
+    ref?: ((instance: HTMLSpanElement | null) => void) | React.RefObject<HTMLSpanElement> | null | undefined;
+} & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+export declare const ChipIcon: (props: React.ComponentProps<typeof Icon>) => React.JSX.Element;
+export declare const StyledRoot: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+} & {
+    size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
+} & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export type TChipRootContext = React.ComponentProps<typeof StyledRoot>;
+export type TChipRootProviderProps = TChipRootContext;
+export declare const ChipRootContext: React.Context<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+} & {
+    size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
+} & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const ChipRootProvider: ({ size, children }: TChipRootProviderProps) => React.JSX.Element;
+export type TChipRootProps = TChipRootProviderProps;
+export declare const Chip: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+} & {
+    size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
+} & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>> & {
+    Content: ({ children, ...rest }: {
+        [x: string]: any;
+        children: any;
+    }) => React.JSX.Element;
+    Icon: (props: React.ComponentProps<typeof Icon>) => React.JSX.Element;
+};

package/dist/src/components/chip/ChipGroup.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+type TChipGroupProps = {
+    gap: 1 | 2 | 3;
+};
+export declare const ChipGroup: React.ForwardRefExoticComponent<Omit<TChipGroupProps & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+} & {
+    direction?: ("row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset">>) | undefined;
+    wrap?: ("wrap" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "nowrap" | "wrap-reverse" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "wrap" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "nowrap" | "wrap-reverse">>) | undefined;
+    justify?: ("end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "left" | "right" | "space-between" | "space-around" | "space-evenly" | "stretch" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "left" | "right" | "space-between" | "space-around" | "space-evenly" | "stretch">>) | undefined;
+    align?: ("end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "stretch" | "self-start" | "self-end" | "baseline" | "first baseline" | "last baseline" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "stretch" | "self-start" | "self-end" | "baseline" | "first baseline" | "last baseline">>) | undefined;
+    gap?: (0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24 | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", 0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24>>) | undefined;
+} & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLDivElement> & {
+    as?: any;
+}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export {};

package/dist/src/components/chip-dismissible-group/ChipDismissibleGroupItem.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import { DismissibleGroup } from '../../../components/dismissible-group';
+declare const StyledChipDismissibleGroupItem: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+} & {
+    size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
+} & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement> & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export type TChipDismissibleGroupItem = React.ComponentProps<typeof DismissibleGroup.Item> & React.ComponentProps<typeof StyledChipDismissibleGroupItem> & {
+    dismissActionLabel: string;
+};
+export declare const ChipDismissibleGroupItem: ({ size, children, dismissActionLabel, ...rest }: TChipDismissibleGroupItem) => React.JSX.Element;
+export {};

package/dist/{components → src/components}/chip-dismissible-group/ChipDismissibleGroupRoot.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { ChipGroup } from '../../components/chip';
-import { DismissibleGroup } from '../../components/dismissible-group';
+import { ChipGroup } from '../../../components/chip';
+import { DismissibleGroup } from '../../../components/dismissible-group';
 type TChipDismissibleGroupRootProps = React.ComponentProps<typeof ChipGroup> & React.ComponentProps<typeof DismissibleGroup>;
-export declare const ChipDismissibleGroupRoot: React.ForwardRefExoticComponent<TChipDismissibleGroupRootProps>;
+export declare const ChipDismissibleGroupRoot: React.ForwardRefExoticComponent<Omit<TChipDismissibleGroupRootProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export {};

package/dist/src/components/chip-toggle-group/ChipToggleGroupItem.d.ts

@@ -0,0 +1,14 @@
+import * as ToggleGroup from '@radix-ui/react-toggle-group';
+import * as React from 'react';
+declare const StyledChipToggleGroupItem: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+} & {
+    size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
+} & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement> & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+type TChipToggleGroupItem = React.ComponentProps<typeof ToggleGroup.Item> & React.ComponentProps<typeof StyledChipToggleGroupItem>;
+export declare const ChipToggleGroupItem: ({ size, children, ...rest }: TChipToggleGroupItem) => React.JSX.Element;
+export {};

package/dist/src/components/chip-toggle-group/ChipToggleGroupRoot.d.ts

@@ -0,0 +1,34 @@
+import * as React from 'react';
+export declare const ChipToggleGroupRoot: React.ForwardRefExoticComponent<(Omit<Omit<{
+    gap: 1 | 2 | 3;
+} & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+} & {
+    direction?: ("row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset">>) | undefined;
+    wrap?: ("wrap" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "nowrap" | "wrap-reverse" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "wrap" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "nowrap" | "wrap-reverse">>) | undefined;
+    justify?: ("end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "left" | "right" | "space-between" | "space-around" | "space-evenly" | "stretch" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "left" | "right" | "space-between" | "space-around" | "space-evenly" | "stretch">>) | undefined;
+    align?: ("end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "stretch" | "self-start" | "self-end" | "baseline" | "first baseline" | "last baseline" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "stretch" | "self-start" | "self-end" | "baseline" | "first baseline" | "last baseline">>) | undefined;
+    gap?: (0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24 | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", 0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24>>) | undefined;
+} & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLDivElement> & {
+    as?: any;
+}, "ref"> & React.RefAttributes<HTMLDivElement> & Omit<import("@radix-ui/react-toggle-group").ToggleGroupSingleProps & React.RefAttributes<HTMLDivElement> & {
+    disableDeselect?: boolean;
+}, "ref">, "ref"> | Omit<Omit<{
+    gap: 1 | 2 | 3;
+} & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+} & {
+    direction?: ("row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset">>) | undefined;
+    wrap?: ("wrap" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "nowrap" | "wrap-reverse" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "wrap" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "nowrap" | "wrap-reverse">>) | undefined;
+    justify?: ("end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "left" | "right" | "space-between" | "space-around" | "space-evenly" | "stretch" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "left" | "right" | "space-between" | "space-around" | "space-evenly" | "stretch">>) | undefined;
+    align?: ("end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "stretch" | "self-start" | "self-end" | "baseline" | "first baseline" | "last baseline" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "stretch" | "self-start" | "self-end" | "baseline" | "first baseline" | "last baseline">>) | undefined;
+    gap?: (0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24 | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", 0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24>>) | undefined;
+} & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLDivElement> & {
+    as?: any;
+}, "ref"> & React.RefAttributes<HTMLDivElement> & Omit<import("@radix-ui/react-toggle-group").ToggleGroupMultipleProps & React.RefAttributes<HTMLDivElement> & {
+    disableDeselect?: boolean;
+}, "ref">, "ref">) & React.RefAttributes<HTMLDivElement>>;

package/dist/src/components/combobox/Combobox.d.ts

@@ -0,0 +1,36 @@
+import { ComboboxOptionText } from '@reach/combobox';
+export declare const Combobox: import("@reach/utils/polymorphic").ForwardRefComponent<"div", import("@reach/combobox").ComboboxProps> & {
+    displayName: string;
+    Option: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & {
+        ref?: ((instance: HTMLLIElement | null) => void) | import("react").RefObject<HTMLLIElement> | null | undefined;
+    }, "as" | keyof import("@reach/combobox").ComboboxOptionProps> & import("@reach/combobox").ComboboxOptionProps & {
+        as?: "li" | undefined;
+    } & {
+        as?: import("react").ElementType;
+    }, "ref"> & import("react").RefAttributes<HTMLLIElement>>;
+    Input: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & {
+        ref?: ((instance: HTMLInputElement | null) => void) | import("react").RefObject<HTMLInputElement> | null | undefined;
+    }, "as" | keyof import("@reach/combobox").ComboboxInputProps> & import("@reach/combobox").ComboboxInputProps & {
+        as?: "input" | undefined;
+    } & {
+        size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
+        state?: ("error" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "error">>) | undefined;
+    } & {
+        as?: import("react").ElementType;
+    }, "ref"> & import("react").RefAttributes<HTMLInputElement>, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+    Popover: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+    }, "as" | keyof import("@reach/popover").PopoverProps | "portal"> & import("@reach/combobox").ComboboxPopoverProps & Partial<import("@reach/popover").PopoverProps> & {
+        as?: "div" | undefined;
+    } & {
+        as?: import("react").ElementType;
+    }, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    List: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref"> & {
+        ref?: ((instance: HTMLUListElement | null) => void) | import("react").RefObject<HTMLUListElement> | null | undefined;
+    }, "as" | "persistSelection"> & import("@reach/combobox").ComboboxListProps & {
+        as?: "ul" | undefined;
+    } & {
+        as?: import("react").ElementType;
+    }, "ref"> & import("react").RefAttributes<HTMLUListElement>>;
+    OptionText: typeof ComboboxOptionText;
+};

package/dist/src/components/combobox/ComboboxInput.d.ts

@@ -0,0 +1,22 @@
+import * as React from 'react';
+export declare const StyledComboboxInput: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & {
+    ref?: ((instance: HTMLInputElement | null) => void) | React.RefObject<HTMLInputElement> | null | undefined;
+}, "as" | keyof import("@reach/combobox").ComboboxInputProps> & import("@reach/combobox").ComboboxInputProps & {
+    as?: "input" | undefined;
+} & {
+    size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
+    state?: ("error" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "error">>) | undefined;
+} & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLInputElement>>;
+export type ComboboxInputProps = React.ComponentProps<typeof StyledComboboxInput>;
+export declare const ComboboxInput: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & {
+    ref?: ((instance: HTMLInputElement | null) => void) | React.RefObject<HTMLInputElement> | null | undefined;
+}, "as" | keyof import("@reach/combobox").ComboboxInputProps> & import("@reach/combobox").ComboboxInputProps & {
+    as?: "input" | undefined;
+} & {
+    size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
+    state?: ("error" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "error">>) | undefined;
+} & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;

package/dist/src/components/combobox/ComboboxList.d.ts

@@ -0,0 +1,7 @@
+export declare const ComboboxList: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref"> & {
+    ref?: ((instance: HTMLUListElement | null) => void) | import("react").RefObject<HTMLUListElement> | null | undefined;
+}, "as" | "persistSelection"> & import("@reach/combobox").ComboboxListProps & {
+    as?: "ul" | undefined;
+} & {
+    as?: import("react").ElementType;
+}, "ref"> & import("react").RefAttributes<HTMLUListElement>>;

package/dist/src/components/combobox/ComboboxOption.d.ts

@@ -0,0 +1,7 @@
+export declare const ComboboxOption: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & {
+    ref?: ((instance: HTMLLIElement | null) => void) | import("react").RefObject<HTMLLIElement> | null | undefined;
+}, "as" | keyof import("@reach/combobox").ComboboxOptionProps> & import("@reach/combobox").ComboboxOptionProps & {
+    as?: "li" | undefined;
+} & {
+    as?: import("react").ElementType;
+}, "ref"> & import("react").RefAttributes<HTMLLIElement>>;

package/dist/src/components/combobox/ComboboxPopover.d.ts

@@ -0,0 +1,7 @@
+export declare const ComboboxPopover: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, "as" | keyof import("@reach/popover").PopoverProps | "portal"> & import("@reach/combobox").ComboboxPopoverProps & Partial<import("@reach/popover").PopoverProps> & {
+    as?: "div" | undefined;
+} & {
+    as?: import("react").ElementType;
+}, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/{components → src/components}/create-password-field/CreatePasswordField.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
-import type { CSS } from '../../stitches';
-import { Override } from '../../utilities';
+import { Override } from '../../../utilities';
 import { FieldElementWrapperProps } from '../field-wrapper';
 import { PasswordInput } from '../password-input';
 type ValidationResult = Record<string, boolean>;
@@ -9,10 +8,10 @@ type CreatePasswordFieldProps = Override<React.ComponentProps<typeof PasswordInp
     name?: string;
     validate: (password: string) => Promise<ValidationResult | undefined> | ValidationResult;
     defaultValidation: ValidationResult;
-    messageDirection?: CSS['flexDirection'];
+    messageDirection?: 'row' | 'column';
 }>;
 export declare const CreatePasswordField: {
-    ({ validate, defaultValidation, messageDirection, label, name, css, validation, appearance, ...remainingProps }: CreatePasswordFieldProps): React.JSX.Element;
+    ({ validate, defaultValidation, messageDirection, label, name, className, validation, appearance, ...remainingProps }: CreatePasswordFieldProps): React.JSX.Element;
     displayName: string;
 };
 export {};

package/dist/src/components/data-table/DataTable.d.ts

@@ -0,0 +1,285 @@
+/** Context provider for DataTable state and logic.
+ *
+ * Children can call `useDataTable` to access everything provided by `@tanstack/react-table` plus
+ * the functionality we've built on top.
+ */
+export declare const DataTable: (({ columns, data: dataProp, getAsyncData, defaultSort, initialState, disabledRows, enableRowSelection, onRowSelectionChange, children }: {
+    columns: any;
+    defaultSort?: import("./DataTable.types").TDefaultSort;
+    children: React.ReactNode;
+    initialState?: import("./DataTable.types").InitialState;
+    disabledRows?: Record<string, boolean>;
+    enableRowSelection?: boolean | ((row: import("@tanstack/table-core").Row<unknown>) => boolean);
+    onRowSelectionChange?: import("@tanstack/table-core").OnChangeFn<import("@tanstack/table-core").RowSelectionState>;
+} & ({
+    data: import("./DataTable.types").TableData;
+    getAsyncData?: never;
+} | {
+    data?: never;
+    getAsyncData: import("./DataTable.types").TGetAsyncData;
+})) => JSX.Element) & {
+    /** Default table body implementation for `DataTable`.
+     *
+     * Can be configured with alternating colours of rows. If you need more customisation options,
+     * you can build your own implementation with `useDataTable()` and the UI-only `Table` components.
+     */
+    Body: ({ striped, rowAction, ...props }: Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & {
+        ref?: ((instance: HTMLTableSectionElement | null) => void) | import("react").RefObject<HTMLTableSectionElement> | null | undefined;
+    } & {
+        striped?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
+    } & {
+        as?: import("react").ElementType;
+    }, "ref"> & import("react").RefAttributes<HTMLTableSectionElement>, "children"> & {
+        rowAction?: (row: Record<string, unknown>, event: React.MouseEvent) => void;
+    }) => import("react").JSX.Element;
+    /** Default table data cell implementation for `DataTable`
+     *
+     *
+     */
+    DataCell: ({ cell }: {
+        cell: import("@tanstack/table-core").Cell<Record<string, unknown>, unknown>;
+    }) => import("react").JSX.Element;
+    /**
+     * Used in place of `DataTable.Table` to render a table with rows that the user can sort by drag-and-drop
+     */
+    DragAndDropTable: ({ idColumn, onDragAndDrop, sortable, striped, theme, className, ...props }: Omit<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").TableHTMLAttributes<HTMLTableElement>, HTMLTableElement>, "ref"> & {
+        ref?: ((instance: HTMLTableElement | null) => void) | import("react").RefObject<HTMLTableElement> | null | undefined;
+    } & {
+        size?: ("md" | "lg" | "xl" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "md" | "lg" | "xl">>) | undefined;
+        corners?: ("round" | "square" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "round" | "square">>) | undefined;
+    } & {
+        as?: import("react").ElementType;
+    }, "ref"> & import("react").RefAttributes<HTMLTableElement> & {
+        numberOfStickyColumns?: number;
+        scrollContainerCss?: string;
+        scrollContainerkey?: string;
+        maxRowDepth?: number;
+    }, "ref"> & import("react").RefAttributes<HTMLTableElement>, "children" | "numberOfStickyColumns"> & Partial<Pick<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & {
+        ref?: ((instance: HTMLTableSectionElement | null) => void) | import("react").RefObject<HTMLTableSectionElement> | null | undefined;
+    } & {
+        theme?: ("primary" | "white" | "primaryDark" | "primaryLight" | "light" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "primary" | "white" | "primaryDark" | "primaryLight" | "light">>) | undefined;
+        isSticky?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
+    } & {
+        as?: import("react").ElementType;
+    }, "ref"> & import("react").RefAttributes<HTMLTableSectionElement>, "children"> & {
+        sortable?: boolean;
+        isSticky?: boolean;
+        stickyOffset?: number;
+        showTotalInFirstColumn?: boolean;
+        totalSuffix?: string;
+    }, "theme" | "sortable">> & Partial<Pick<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & {
+        ref?: ((instance: HTMLTableSectionElement | null) => void) | import("react").RefObject<HTMLTableSectionElement> | null | undefined;
+    } & {
+        striped?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
+    } & {
+        as?: import("react").ElementType;
+    }, "ref"> & import("react").RefAttributes<HTMLTableSectionElement>, "striped">> & {
+        scrollOptions?: {
+            hasStickyHeader?: boolean;
+            stickyHeaderOffset?: number;
+            headerCss?: string;
+            numberOfStickyColumns?: number;
+            scrollContainerCss?: string;
+            showTotalInFirstColumn?: boolean;
+            totalSuffix?: string;
+        };
+        rowAction?: (row: Record<string, unknown>, event: React.MouseEvent) => void;
+        withContainer?: boolean;
+    } & {
+        className?: string;
+        idColumn?: string;
+        onDragAndDrop?: (onDragAndDropData: {
+            oldIndex: number;
+            newIndex: number;
+            newData: import("./DataTable.types").TAsyncDataResult;
+        }) => void;
+    }) => import("react").JSX.Element;
+    /** Default global search implementation for `DataTable`
+     *
+     * If you need more customisation options, you can compose your own implementation with our UI-only input components and `useDataTable`.
+     */
+    GlobalFilter: ({ onChange, label, hideLabel, ...props }: Omit<import("../search-input").SearchInputProps, "ref"> & import("react").RefAttributes<HTMLInputElement> & {
+        label: string;
+        hideLabel?: boolean;
+    }) => import("react").JSX.Element | null;
+    /** Default table head implementation
+     *
+     * Can be configured to be sortable and with different visual themes.
+     * If you need more customisation options, you can build your own implementation
+     * with `useDataTable` and the UI-only `Table` components.
+     */
+    Head: ({ sortable, theme, isSticky, stickyOffset, showTotalInFirstColumn, totalSuffix, style, className, ...props }: Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & {
+        ref?: ((instance: HTMLTableSectionElement | null) => void) | import("react").RefObject<HTMLTableSectionElement> | null | undefined;
+    } & {
+        theme?: ("primary" | "white" | "primaryDark" | "primaryLight" | "light" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "primary" | "white" | "primaryDark" | "primaryLight" | "light">>) | undefined;
+        isSticky?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
+    } & {
+        as?: import("react").ElementType;
+    }, "ref"> & import("react").RefAttributes<HTMLTableSectionElement>, "children"> & {
+        sortable?: boolean;
+        isSticky?: boolean;
+        stickyOffset?: number;
+        showTotalInFirstColumn?: boolean;
+        totalSuffix?: string;
+    }) => React.ReactElement;
+    /** Default header implementation for `DataTable`
+     *
+     * Can be configured to make the column sortable. If you need more customisation options,
+     * you can build your own implementation with the UI-only `Table` components.
+     */
+    HeaderCell: ({ header, includeTotal, totalSuffix, children, className, ...props }: Omit<Omit<import("react").DetailedHTMLProps<import("react").ThHTMLAttributes<HTMLTableHeaderCellElement>, HTMLTableHeaderCellElement>, "ref"> & {
+        ref?: ((instance: HTMLTableHeaderCellElement | null) => void) | import("react").RefObject<HTMLTableHeaderCellElement> | null | undefined;
+    } & {
+        as?: import("react").ElementType;
+    }, "ref"> & import("react").RefAttributes<HTMLTableHeaderCellElement> & {
+        header: import("@tanstack/table-core").Header<Record<string, unknown>, unknown>;
+        includeTotal?: boolean;
+        totalSuffix?: string;
+    }) => import("react").JSX.Element;
+    /** Default pagination implementation for `DataTable`
+     *
+     * Can navigate forward, backward, or to any specific page. If you need more customisation options,
+     * you can build your own implementation with `useDataTable` and other UI components.
+     *
+     */
+    MetaData: ({ copy, ...rest }: {
+        copy?: {
+            sorted_by?: string;
+            ascending?: string;
+            descending?: string;
+            separator?: string;
+        };
+        sortLabel?: string;
+    }) => import("react").JSX.Element;
+    /** Default display of amount of items and current sorting status for 'DataTable'
+     *
+     */
+    Pagination: {
+        ({ colorScheme, ...props }: Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & {
+            ref?: ((instance: HTMLElement | null) => void) | import("react").RefObject<HTMLElement> | null | undefined;
+        } & {
+            as?: import("react").ElementType;
+        }, "ref"> & import("react").RefAttributes<HTMLElement> & {
+            colorScheme?: import("../..").TcolorScheme;
+        }): import("react").JSX.Element | null;
+        displayName: string;
+    };
+    /** Default row implementation for `DataTable`
+     *
+     * Renders all visible cells as `Table.Cell`. If you need more customisation options,
+     * you can build your own implementation with the UI-only `Table` components.
+     */
+    Row: ({ row, rowAction }: import("./DataTableRow").DataTableRowProps) => import("react").JSX.Element;
+    /** Default table implementation for `DataTable`.
+     *
+     * Can be configured with sortable columns and different visual themes.
+     *
+     * If you need more customisation options, you can compose your own implementation with
+     * lower-level `DataTable` components or build the whole thing from
+     * scratch with `useDataTable` and the UI-only `Table` components.
+     *
+     */
+    Table: ({ sortable, striped, theme, className, scrollOptions, rowAction, withContainer, ...props }: import("./DataTableTable").DataTableTableProps) => JSX.Element | null;
+    /** Default loading implementation for remote data
+     *
+     * Renders a loading component while fetching the paginated data using `getAsyncData`.
+     *
+     * If you need more customisation, you can compose your own implentation, `asyncDataState`
+     * can be retrieved from `useDataTable`
+     */
+    Loading: (props: React.ComponentProps<import("react").ForwardRefExoticComponent<{
+        message?: string;
+        size?: "sm" | "md" | "lg";
+        className?: string;
+    } & {
+        as?: import("react").ElementType;
+    } & import("react").RefAttributes<never>>>) => import("react").JSX.Element | null;
+    /** Default error implementation for remote data
+     *
+     * Renders an error component when `getAsyncData` promise rejects.
+     * Children are rendered as a function, it exposes a `runAsyncData` function to the children component.
+     * `runAsyncData()` can be used to retry fetching the paginated data with the current pageIndex, pageSize
+     * and sorting parameters or your own custom paginated options.
+     *
+     * If you need more customisation, you can compose your own implentation, `asyncDataState` and `runAsyncData()`
+     * can be retrieved from `useDataTable`
+     *
+     */
+    Error: ({ children }: {
+        children: (retry?: import("./DataTable.types").DataTableContextType["runAsyncData"]) => React.ReactElement;
+    }) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
+    /** Empty state implementation for `DataTable`.
+     *
+     * Extends the EmptyState component
+     */
+    EmptyState: ({ children, ...rest }: Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        direction?: ("row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset">>) | undefined;
+        wrap?: ("wrap" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "nowrap" | "wrap-reverse" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "wrap" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "nowrap" | "wrap-reverse">>) | undefined;
+        justify?: ("end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "left" | "right" | "space-between" | "space-around" | "space-evenly" | "stretch" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "left" | "right" | "space-between" | "space-around" | "space-evenly" | "stretch">>) | undefined;
+        align?: ("end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "stretch" | "self-start" | "self-end" | "baseline" | "first baseline" | "last baseline" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "stretch" | "self-start" | "self-end" | "baseline" | "first baseline" | "last baseline">>) | undefined;
+        gap?: (0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24 | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", 0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24>>) | undefined;
+    } & {
+        as?: import("react").ElementType;
+    }, "ref"> & import("react").RefAttributes<HTMLDivElement> & {
+        size?: ("sm" | "md" | "lg" | "xs" | "xl" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs" | "xl">>) | undefined;
+    } & {
+        as?: import("react").ElementType;
+    }, "ref"> & import("react").RefAttributes<HTMLDivElement>) => import("react").JSX.Element | null;
+    /** Select all rows checkbox.
+     *
+     * Renders a checkbox on the header, allowing for bulk selection/deselection of all selectable rows
+     */
+    SelectAllRowsCheckbox: ({ label }: {
+        label?: string;
+    }) => import("react").JSX.Element;
+    /** Individual row selection checkbox.
+     *
+     * Renders a checkbox on each row, allowing for individual selection/deselection of any selectable row
+     */
+    RowSelectionCheckbox: ({ row, checked, onCheckedChange, label }: {
+        row: import("@tanstack/table-core").Row<Record<string, unknown>>;
+        checked: boolean | "indeterminate";
+        onCheckedChange: (value: boolean) => void;
+        label?: string;
+    }) => React.ReactElement;
+    /** Bulk actions for selected rows.
+     *
+     * Renders a toolbar with actions that can be applied to all selected rows
+     */
+    BulkActions: (({ children, ...rest }: {
+        children: React.ReactElement<React.ComponentProps<({ children }: {
+            children: React.ReactElement;
+        }) => React.ReactElement | null>> | React.ReactElement<React.ComponentProps<({ cancelLabel, children }: {
+            cancelLabel?: string;
+            children: React.ReactNode;
+        }) => import("react").JSX.Element | null>> | [React.ReactElement<React.ComponentProps<({ children }: {
+            children: React.ReactElement;
+        }) => React.ReactElement | null>>, React.ReactElement<React.ComponentProps<({ cancelLabel, children }: {
+            cancelLabel?: string;
+            children: React.ReactNode;
+        }) => import("react").JSX.Element | null>>];
+    }) => import("react").JSX.Element) & {
+        DefaultActions: ({ children }: {
+            children: React.ReactElement;
+        }) => React.ReactElement | null;
+        SelectedRowActions: ({ cancelLabel, children }: {
+            cancelLabel?: string;
+            children: React.ReactNode;
+        }) => import("react").JSX.Element | null;
+    };
+    /** Bulk actions for selected rows.
+     *
+     * Renders a toolbar with actions that can be applied to all selected rows
+     */
+    BulkActionsFloating: (({ children, ...rest }: {
+        children: React.ReactNode;
+    }) => import("react").JSX.Element | null) & {
+        SelectedRowActions: ({ cancelLabel, showDividers, children }: {
+            cancelLabel?: string;
+            showDividers?: boolean;
+            children: React.ReactNode;
+        }) => import("react").JSX.Element | null;
+    };
+};

package/dist/{components → src/components}/data-table/DataTableBulkActions.d.ts

@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { CSS } from '../../stitches';
 declare const BulkActionsDefaultActions: ({ children }: {
     children: React.ReactElement;
 }) => React.ReactElement | null;
@@ -8,7 +7,6 @@ declare const BulkActionsSelectedRowActions: ({ cancelLabel, children }: {
     children: React.ReactNode;
 }) => React.JSX.Element | null;
 export declare const DataTableBulkActions: (({ children, ...rest }: {
-    css?: CSS;
     children: React.ReactElement<React.ComponentProps<typeof BulkActionsDefaultActions>> | React.ReactElement<React.ComponentProps<typeof BulkActionsSelectedRowActions>> | [React.ReactElement<React.ComponentProps<typeof BulkActionsDefaultActions>>, React.ReactElement<React.ComponentProps<typeof BulkActionsSelectedRowActions>>];
 }) => React.JSX.Element) & {
     DefaultActions: ({ children }: {

package/dist/{components → src/components}/data-table/DataTableBulkActionsFloating.d.ts

@@ -1,7 +1,5 @@
 import * as React from 'react';
-import { CSS } from '../../stitches';
-export declare const DataTableBulkActionsFloating: (({ css, children, ...rest }: {
-    css?: CSS;
+export declare const DataTableBulkActionsFloating: (({ children, ...rest }: {
     children: React.ReactNode;
 }) => React.JSX.Element | null) & {
     SelectedRowActions: ({ cancelLabel, showDividers, children }: {

package/dist/{components → src/components}/data-table/DataTableHead.d.ts

@@ -1,11 +1,11 @@
 import * as React from 'react';
-import { CSS } from '../../stitches';
 import { Table } from '../table';
 type DataTableHeadProps = Omit<React.ComponentProps<typeof Table.Header>, 'children'> & {
     sortable?: boolean;
     isSticky?: boolean;
     stickyOffset?: number;
-    headerCss?: CSS;
+    showTotalInFirstColumn?: boolean;
+    totalSuffix?: string;
 };
-export declare const DataTableHead: ({ sortable, theme, isSticky, stickyOffset, css, ...props }: DataTableHeadProps) => React.ReactElement;
+export declare const DataTableHead: ({ sortable, theme, isSticky, stickyOffset, showTotalInFirstColumn, totalSuffix, style, className, ...props }: DataTableHeadProps) => React.ReactElement;
 export {};

package/dist/{components → src/components}/data-table/DataTableHeaderCell.d.ts

@@ -3,6 +3,8 @@ import * as React from 'react';
 import { Table } from '../table';
 type DataTableHeaderProps = React.ComponentProps<typeof Table.HeaderCell> & {
     header: Header<Record<string, unknown>, unknown>;
+    includeTotal?: boolean;
+    totalSuffix?: string;
 };
-export declare const DataTableHeaderCell: ({ header, children, css, ...props }: DataTableHeaderProps) => React.JSX.Element;
+export declare const DataTableHeaderCell: ({ header, includeTotal, totalSuffix, children, className, ...props }: DataTableHeaderProps) => React.JSX.Element;
 export {};