@salt-ds/lab 1.0.0-alpha.30 → 1.0.0-alpha.32

package/dist-types/combo-box-next/ComboBoxNext.d.ts

@@ -1,10 +1,20 @@
-import { ReactNode } from "react";
+import { ReactNode, Ref } from "react";
 import { InputProps } from "@salt-ds/core";
 import { ListControlProps } from "../list-control/ListControlState";
-export interface ComboBoxNextProps extends InputProps, Omit<ListControlProps, "value" | "defaultValue"> {
+export interface ComboBoxNextProps<Item = string> extends InputProps, Omit<ListControlProps<Item>, "value" | "defaultValue"> {
     /**
      * The options to display in the combo box.
      */
     children?: ReactNode;
+    /**
+     * The default value of the input.
+     */
+    defaultValue?: string | readonly string[] | number | undefined;
+    /**
+     * The value of the input. The component will be controlled if this prop is provided.
+     */
+    value?: string | readonly string[] | number | undefined;
 }
-export declare const ComboBoxNext: import("react").ForwardRefExoticComponent<ComboBoxNextProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare const ComboBoxNext: <Item = string>(props: ComboBoxNextProps<Item> & {
+    ref?: Ref<HTMLDivElement> | undefined;
+}) => JSX.Element;

package/dist-types/combo-box-next/useComboBoxNext.d.ts

@@ -1,19 +1,16 @@
 import { ListControlProps } from "../list-control/ListControlState";
 import { SyntheticEvent } from "react";
 import { OptionValue } from "../list-control/ListControlContext";
-export declare function useComboBoxNext(props: ListControlProps): {
-    select: (event: SyntheticEvent, option: OptionValue) => void;
+export declare function useComboBoxNext<Item>(props: ListControlProps<Item>): {
+    select: (event: SyntheticEvent, option: OptionValue<Item>) => void;
     multiselect: boolean;
     openState: boolean;
-    setOpen: (event: SyntheticEvent<Element, Event>, newOpen: boolean) => void;
-    openKey: import("react").MutableRefObject<{
-        key: string;
-        altKey: boolean;
-    }>;
-    activeState: OptionValue | undefined;
-    setActive: (option?: OptionValue | undefined) => void;
-    selectedState: string[];
-    setSelectedState: import("react").Dispatch<import("react").SetStateAction<string[]>>;
+    setOpen: (newOpen: boolean, reason?: import("../list-control/ListControlState").OpenChangeReason | undefined, key?: string | undefined) => void;
+    openKey: import("react").MutableRefObject<string | undefined>;
+    activeState: OptionValue<Item> | undefined;
+    setActive: (option?: OptionValue<Item> | undefined) => void;
+    selectedState: Item[];
+    setSelectedState: import("react").Dispatch<import("react").SetStateAction<Item[]>>;
     clear: (event: SyntheticEvent<Element, Event>) => void;
     valueState: string | number | readonly string[] | undefined;
     setValueState: import("react").Dispatch<import("react").SetStateAction<string | number | readonly string[] | undefined>>;
@@ -23,9 +20,9 @@ export declare function useComboBoxNext(props: ListControlProps): {
     setFocusedState: import("react").Dispatch<import("react").SetStateAction<boolean>>;
     listRef: import("react").RefObject<HTMLDivElement>;
     options: HTMLElement[];
-    register: (optionValue: OptionValue, element: HTMLElement) => () => void;
-    getOptionAtIndex: (index: number) => OptionValue;
-    getIndexOfOption: (option: OptionValue) => number;
-    getOptionsMatching: (predicate: (option: OptionValue) => boolean) => OptionValue[];
-    getOptionFromSearch: (search: string, startFrom?: OptionValue | undefined) => OptionValue | undefined;
+    register: (optionValue: OptionValue<Item>, element: HTMLElement) => () => void;
+    getOptionAtIndex: (index: number) => OptionValue<Item>;
+    getIndexOfOption: (option: OptionValue<Item>) => number;
+    getOptionsMatching: (predicate: (option: OptionValue<Item>) => boolean) => OptionValue<Item>[];
+    getOptionFromSearch: (search: string, startFrom?: OptionValue<Item> | undefined) => OptionValue<Item> | undefined;
 };

package/dist-types/content-status/internal/StatusIndicator.d.ts

@@ -1,6 +1,6 @@
 import { StatusIndicatorProps as BaseStatusIndicatorProps, SpinnerProps } from "@salt-ds/core";
 import { ReactElement } from "react";
-import { CircularProgressProps } from "../../progress";
+import { CircularProgressProps } from "@salt-ds/core";
 export interface StatusIndicatorProps extends Pick<SpinnerProps, "disableAnnouncer">, Pick<CircularProgressProps, "value"> {
     title?: string;
     message?: string;

package/dist-types/dialog/Dialog.d.ts

@@ -1,6 +1,11 @@
-import { HTMLAttributes, ComponentProps } from "react";
+import { HTMLAttributes, ComponentProps, ReactNode } from "react";
 import { FloatingFocusManager } from "@floating-ui/react";
 import { ValidationStatus } from "@salt-ds/core";
+interface ConditionalScrimWrapperProps {
+    children?: ReactNode;
+    condition: boolean;
+}
+export declare const ConditionalScrimWrapper: ({ condition, children, }: ConditionalScrimWrapperProps) => JSX.Element;
 export interface DialogProps extends HTMLAttributes<HTMLDivElement> {
     /**
      * Display or hide the component.
@@ -11,7 +16,7 @@ export interface DialogProps extends HTMLAttributes<HTMLDivElement> {
      */
     onOpenChange?: (open: boolean) => void;
     /**
-     * Status indicator
+     * The status of the Dialog
      * */
     status?: ValidationStatus;
     /**
@@ -19,5 +24,23 @@ export interface DialogProps extends HTMLAttributes<HTMLDivElement> {
      * Default value is 0 (first tabbable element).
      * */
     initialFocus?: ComponentProps<typeof FloatingFocusManager>["initialFocus"];
+    /**
+     * Size of the Dialog
+     * */
+    size?: "small" | "medium" | "large";
+    /**
+     * Prevent the dialog closing on click away
+     * */
+    disableDismiss?: boolean;
+    /**
+     * Prevent Scrim from rendering
+     * */
+    disableScrim?: boolean;
+    /**
+     * Optional id prop
+     * Used for accessibility purposes to announce the title and subtitle when using a screen reader
+     * */
+    idProp?: string;
 }
 export declare const Dialog: import("react").ForwardRefExoticComponent<DialogProps & import("react").RefAttributes<HTMLDivElement>>;
+export {};

package/dist-types/dialog/DialogContext.d.ts

@@ -1,8 +1,8 @@
 export declare const DialogContext: import("react").Context<{
-    dialogId?: string | undefined;
     status?: "error" | "warning" | "success" | "info" | undefined;
+    id: string | undefined;
 }>;
 export declare const useDialogContext: () => {
-    dialogId?: string | undefined;
     status?: "error" | "warning" | "success" | "info" | undefined;
+    id: string | undefined;
 };

package/dist-types/dialog/DialogTitle.d.ts

@@ -1,8 +1,22 @@
-import { ComponentPropsWithoutRef } from "react";
+import { ReactNode, ComponentPropsWithoutRef } from "react";
 import { ValidationStatus } from "@salt-ds/core";
-interface DialogTitleProps extends ComponentPropsWithoutRef<"h2"> {
-    status?: ValidationStatus;
-    accent?: boolean;
+interface DialogTitleProps extends Omit<ComponentPropsWithoutRef<"div">, "title"> {
+    /**
+     * The status of the Dialog
+     */
+    status?: ValidationStatus | undefined;
+    /**
+     * Displays the accent bar in the Dialog Title */
+    disableAccent?: boolean;
+    /**
+     * Displays the Dialog Title in a H2 component
+     */
+    title: ReactNode;
+    /**
+     * Displays the Dialog Subtitle in a Label component
+     **/
+    subtitle?: ReactNode;
+    className?: string;
 }
-export declare const DialogTitle: ({ children, className, accent, status: statusProp, ...rest }: DialogTitleProps) => JSX.Element;
+export declare const DialogTitle: ({ className, title, subtitle, disableAccent, status: statusProp, ...rest }: DialogTitleProps) => JSX.Element;
 export {};

package/dist-types/drawer/Drawer.d.ts

@@ -1,11 +1,9 @@
-import { HTMLAttributes } from "react";
-export declare const DRAWER_POSITIONS: readonly ["left", "top", "right", "bottom"];
-export declare type DrawerPositions = (typeof DRAWER_POSITIONS)[number];
-export interface DrawerProps extends HTMLAttributes<HTMLDivElement> {
+import { ComponentPropsWithoutRef } from "react";
+export interface DrawerProps extends ComponentPropsWithoutRef<"div"> {
     /**
-     * Defines the drawer position within the screen.
+     * Defines the drawer position within the screen. Defaults to `left`.
      */
-    position?: DrawerPositions;
+    position?: "left" | "top" | "right" | "bottom";
     /**
      * Display or hide the component.
      */
@@ -13,10 +11,18 @@ export interface DrawerProps extends HTMLAttributes<HTMLDivElement> {
     /**
      * Callback function triggered when open state changes.
      */
-    onOpenChange?: (open: boolean) => void;
+    onOpenChange?: (newOpen: boolean) => void;
     /**
      * Change background color palette
      */
     variant?: "primary" | "secondary";
+    /**
+     * Prevent the dialog closing on click away
+     * */
+    disableDismiss?: boolean;
+    /**
+     * Prevent Scrim from rendering
+     * */
+    disableScrim?: boolean;
 }
 export declare const Drawer: import("react").ForwardRefExoticComponent<DrawerProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist-types/drawer/DrawerCloseButton.d.ts

@@ -0,0 +1,2 @@
+import { ButtonProps } from "@salt-ds/core";
+export declare const DrawerCloseButton: import("react").ForwardRefExoticComponent<ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;

package/dist-types/drawer/index.d.ts

@@ -1,2 +1,2 @@
 export * from "./Drawer";
-export * from "./useDrawer";
+export * from "./DrawerCloseButton";

package/dist-types/dropdown-next/DropdownNext.d.ts

@@ -1,7 +1,7 @@
-import { ComponentPropsWithoutRef, ReactNode } from "react";
+import { ComponentPropsWithoutRef, ReactNode, Ref } from "react";
 import { ListControlProps } from "../list-control/ListControlState";
 import { ValidationStatus } from "@salt-ds/core";
-export interface DropdownNextProps extends Omit<ComponentPropsWithoutRef<"button">, "value" | "defaultValue">, ListControlProps {
+export interface DropdownNextProps<Item = string> extends Omit<ComponentPropsWithoutRef<"button">, "value" | "defaultValue">, ListControlProps<Item> {
     /**
      * If `true`, the dropdown will be disabled.
      */
@@ -39,9 +39,19 @@ export interface DropdownNextProps extends Omit<ComponentPropsWithoutRef<"button
      * Styling variant. Defaults to "primary".
      */
     variant?: "primary" | "secondary";
+    /**
+     * The default content of the dropdown shown in the button.
+     */
+    defaultValue?: string | readonly string[] | number | undefined;
+    /**
+     * The content of the dropdown shown in the button. The component will be controlled if this prop is provided.
+     */
+    value?: string | readonly string[] | number | undefined;
     /**
      * Validation status, one of "error" | "warning" | "success".
      */
     validationStatus?: Exclude<ValidationStatus, "info">;
 }
-export declare const DropdownNext: import("react").ForwardRefExoticComponent<DropdownNextProps & import("react").RefAttributes<HTMLButtonElement>>;
+export declare const DropdownNext: <Item = string>(props: DropdownNextProps<Item> & {
+    ref?: Ref<HTMLButtonElement> | undefined;
+}) => JSX.Element;

package/dist-types/index.d.ts

@@ -33,10 +33,8 @@ export * from "./menu-button";
 export * from "./metric";
 export * from "./option";
 export * from "./overlay";
-export * from "./parent-child-item";
 export * from "./parent-child-layout";
 export * from "./portal";
-export * from "./progress";
 export * from "./query-input";
 export * from "./responsive";
 export * from "./search-input";

package/dist-types/list-control/ListControlContext.d.ts

@@ -1,20 +1,21 @@
 import { SyntheticEvent } from "react";
-export interface OptionValue {
+export interface OptionValue<Item> {
     id: string;
     disabled: boolean;
-    value: string;
+    value: Item;
     text: string;
 }
-export interface ListControlContextValue {
+export declare type OpenChangeReason = "input" | "manual";
+export interface ListControlContextValue<Item> {
     openState: boolean;
-    setOpen: (event: SyntheticEvent, newOpen: boolean) => void;
-    register: (optionValue: OptionValue, element: HTMLElement) => () => void;
-    selectedState: string[];
-    select: (event: SyntheticEvent, option: OptionValue) => void;
-    activeState?: OptionValue;
-    setActive: (option: OptionValue) => void;
+    setOpen: (newOpen: boolean, openChangeReason?: OpenChangeReason) => void;
+    register: (optionValue: OptionValue<Item>, element: HTMLElement) => () => void;
+    selectedState: unknown[];
+    select: (event: SyntheticEvent, option: OptionValue<Item>) => void;
+    activeState?: OptionValue<Item>;
+    setActive: (option: OptionValue<Item>) => void;
     multiselect: boolean;
     focusVisibleState: boolean;
 }
-export declare const ListControlContext: import("react").Context<ListControlContextValue>;
-export declare function useListControlContext(): ListControlContextValue;
+export declare const ListControlContext: import("react").Context<ListControlContextValue<any>>;
+export declare function useListControlContext<Item>(): ListControlContextValue<Item>;

package/dist-types/list-control/ListControlState.d.ts

@@ -1,6 +1,9 @@
 import { SyntheticEvent } from "react";
 import { OptionValue } from "./ListControlContext";
-export interface ListControlProps {
+export declare type OpenChangeReason = "input" | "manual";
+export interface ListControlProps<Item> {
+    disabled?: boolean;
+    readOnly?: boolean;
     /**
      * If true, the list will be open by default.
      */
@@ -12,19 +15,19 @@ export interface ListControlProps {
     /**
      * Callback fired when the open state changes.
      */
-    onOpenChange?: (event: SyntheticEvent, newOpen: boolean) => void;
+    onOpenChange?: (newOpen: boolean, reason?: OpenChangeReason) => void;
     /**
      * The default selected options. If this is provided `defaultValue` should be provided as well.
      */
-    defaultSelected?: string[];
+    defaultSelected?: Item[];
     /**
      * The selected options. The component will be controlled if this prop is provided.
      */
-    selected?: string[];
+    selected?: Item[];
     /**
      * Callback fired when the selected options change.
      */
-    onSelectionChange?: (event: SyntheticEvent, newSelected: string[]) => void;
+    onSelectionChange?: (event: SyntheticEvent, newSelected: Item[]) => void;
     /**
      * The default value.
      */
@@ -38,19 +41,16 @@ export interface ListControlProps {
      */
     multiselect?: boolean;
 }
-export declare function useListControl(props: ListControlProps): {
+export declare function useListControl<Item>(props: ListControlProps<Item>): {
     multiselect: boolean;
     openState: boolean;
-    setOpen: (event: SyntheticEvent, newOpen: boolean) => void;
-    openKey: import("react").MutableRefObject<{
-        key: string;
-        altKey: boolean;
-    }>;
-    activeState: OptionValue | undefined;
-    setActive: (option?: OptionValue | undefined) => void;
-    selectedState: string[];
-    setSelectedState: import("react").Dispatch<import("react").SetStateAction<string[]>>;
-    select: (event: SyntheticEvent, option: OptionValue) => void;
+    setOpen: (newOpen: boolean, reason?: OpenChangeReason | undefined, key?: string | undefined) => void;
+    openKey: import("react").MutableRefObject<string | undefined>;
+    activeState: OptionValue<Item> | undefined;
+    setActive: (option?: OptionValue<Item> | undefined) => void;
+    selectedState: Item[];
+    setSelectedState: import("react").Dispatch<import("react").SetStateAction<Item[]>>;
+    select: (event: SyntheticEvent, option: OptionValue<Item>) => void;
     clear: (event: SyntheticEvent) => void;
     valueState: string | number | readonly string[] | undefined;
     setValueState: import("react").Dispatch<import("react").SetStateAction<string | number | readonly string[] | undefined>>;
@@ -60,9 +60,9 @@ export declare function useListControl(props: ListControlProps): {
     setFocusedState: import("react").Dispatch<import("react").SetStateAction<boolean>>;
     listRef: import("react").RefObject<HTMLDivElement>;
     options: HTMLElement[];
-    register: (optionValue: OptionValue, element: HTMLElement) => () => void;
-    getOptionAtIndex: (index: number) => OptionValue;
-    getIndexOfOption: (option: OptionValue) => number;
-    getOptionsMatching: (predicate: (option: OptionValue) => boolean) => OptionValue[];
-    getOptionFromSearch: (search: string, startFrom?: OptionValue | undefined) => OptionValue | undefined;
+    register: (optionValue: OptionValue<Item>, element: HTMLElement) => () => void;
+    getOptionAtIndex: (index: number) => OptionValue<Item>;
+    getIndexOfOption: (option: OptionValue<Item>) => number;
+    getOptionsMatching: (predicate: (option: OptionValue<Item>) => boolean) => OptionValue<Item>[];
+    getOptionFromSearch: (search: string, startFrom?: OptionValue<Item> | undefined) => OptionValue<Item> | undefined;
 };

package/dist-types/option/Option.d.ts

@@ -7,7 +7,7 @@ export interface OptionProps extends ComponentPropsWithoutRef<"div"> {
     /**
      * The value of the option.
      */
-    value: string;
+    value: unknown;
     /**
      * The text value of the option. If not provided, the text value will be inferred from the children.
      */

package/dist-types/parent-child-layout/ParentChildLayout.d.ts

@@ -1,28 +1,23 @@
 import { Breakpoints, FlexLayoutProps } from "@salt-ds/core";
-import { ElementType, HTMLAttributes, ReactNode } from "react";
+import { ReactNode } from "react";
 export declare type StackedViewElement = "parent" | "child";
-declare type Orientation = "horizontal" | "vertical";
-export interface ParentChildLayoutProps extends HTMLAttributes<HTMLDivElement> {
+export interface ParentChildLayoutProps extends FlexLayoutProps<"div"> {
     /**
      * Breakpoint at which the parent and child will stack.
      */
-    stackedAtBreakpoint?: keyof Breakpoints;
+    collapseAtBreakpoint?: keyof Breakpoints;
     /**
      * Change element that is displayed when in staked view.
      */
-    stackedViewElement?: StackedViewElement;
+    collapsedViewElement?: StackedViewElement;
     /**
      * Disable all animations.
      */
     disableAnimations?: boolean;
     /**
-     * Orientation for slide animations.
+     * Position of the parent component within the layout.
      */
-    orientation?: Orientation;
-    /**
-     * Controls the space between columns.
-     */
-    gap?: FlexLayoutProps<ElementType>["gap"];
+    parentPosition?: "left" | "right";
     /**
      * Parent component to be rendered
      */
@@ -31,6 +26,6 @@ export interface ParentChildLayoutProps extends HTMLAttributes<HTMLDivElement> {
      * Child component to be rendered
      */
     child: ReactNode;
+    onCollapseChange?: (isCollapsed: boolean) => void;
 }
-export declare const ParentChildLayout: import("react").ForwardRefExoticComponent<ParentChildLayoutProps & import("react").RefAttributes<HTMLDivElement>>;
-export {};
+export declare const ParentChildLayout: import("react").ForwardRefExoticComponent<Omit<ParentChildLayoutProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salt-ds/lab",
-  "version": "1.0.0-alpha.30",
+  "version": "1.0.0-alpha.32",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
@@ -26,7 +26,7 @@
     "react-window": "^1.8.6",
     "rifm": "^0.12.0",
     "tinycolor2": "^1.4.2",
-    "@salt-ds/core": "^1.16.1",
+    "@salt-ds/core": "^1.18.0",
     "@salt-ds/window": "^0.1.1",
     "@salt-ds/styles": "^0.2.1",
     "@salt-ds/icons": "^1.9.1"

package/dist-cjs/dialog/useDialog.js

@@ -1,31 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var react = require('@floating-ui/react');
-var core = require('@salt-ds/core');
-
-function useDialog(props) {
-  const { open, onOpenChange } = props;
-  const { context, floating } = core.useFloatingUI({
-    open,
-    onOpenChange
-  });
-  const click = react.useClick(context);
-  const role = react.useRole(context);
-  const dismiss = react.useDismiss(context);
-  const { getFloatingProps, getReferenceProps } = react.useInteractions([
-    role,
-    dismiss,
-    click
-  ]);
-  return {
-    getFloatingProps,
-    getReferenceProps,
-    floating,
-    context
-  };
-}
-
-exports.useDialog = useDialog;
-//# sourceMappingURL=useDialog.js.map

package/dist-cjs/dialog/useDialog.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useDialog.js","sources":["../src/dialog/useDialog.ts"],"sourcesContent":["import {\n  useClick,\n  useDismiss,\n  useInteractions,\n  useRole,\n} from \"@floating-ui/react\";\nimport { useFloatingUI, UseFloatingUIProps } from \"@salt-ds/core\";\n\nexport type UseDialogProps = Partial<\n  Pick<UseFloatingUIProps, \"onOpenChange\" | \"open\">\n>;\n\nexport function useDialog(props: UseDialogProps) {\n  const { open, onOpenChange } = props;\n\n  const { context, floating } = useFloatingUI({\n    open,\n    onOpenChange,\n  });\n\n  const click = useClick(context);\n  const role = useRole(context);\n  const dismiss = useDismiss(context);\n\n  const { getFloatingProps, getReferenceProps } = useInteractions([\n    role,\n    dismiss,\n    click,\n  ]);\n\n  return {\n    getFloatingProps,\n    getReferenceProps,\n    floating,\n    context,\n  };\n}\n"],"names":["useFloatingUI","useClick","useRole","useDismiss","useInteractions"],"mappings":";;;;;;;AAYO,SAAS,UAAU,KAAuB,EAAA;AAC/C,EAAM,MAAA,EAAE,IAAM,EAAA,YAAA,EAAiB,GAAA,KAAA,CAAA;AAE/B,EAAA,MAAM,EAAE,OAAA,EAAS,QAAS,EAAA,GAAIA,kBAAc,CAAA;AAAA,IAC1C,IAAA;AAAA,IACA,YAAA;AAAA,GACD,CAAA,CAAA;AAED,EAAM,MAAA,KAAA,GAAQC,eAAS,OAAO,CAAA,CAAA;AAC9B,EAAM,MAAA,IAAA,GAAOC,cAAQ,OAAO,CAAA,CAAA;AAC5B,EAAM,MAAA,OAAA,GAAUC,iBAAW,OAAO,CAAA,CAAA;AAElC,EAAA,MAAM,EAAE,gBAAA,EAAkB,iBAAkB,EAAA,GAAIC,qBAAgB,CAAA;AAAA,IAC9D,IAAA;AAAA,IACA,OAAA;AAAA,IACA,KAAA;AAAA,GACD,CAAA,CAAA;AAED,EAAO,OAAA;AAAA,IACL,gBAAA;AAAA,IACA,iBAAA;AAAA,IACA,QAAA;AAAA,IACA,OAAA;AAAA,GACF,CAAA;AACF;;;;"}

package/dist-cjs/drawer/useDrawer.js

@@ -1,31 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var react = require('@floating-ui/react');
-var core = require('@salt-ds/core');
-
-function useDrawer(props) {
-  const { open, onOpenChange } = props;
-  const { context, floating } = core.useFloatingUI({
-    open,
-    onOpenChange
-  });
-  const click = react.useClick(context);
-  const role = react.useRole(context);
-  const dismiss = react.useDismiss(context);
-  const { getFloatingProps, getReferenceProps } = react.useInteractions([
-    role,
-    dismiss,
-    click
-  ]);
-  return {
-    getFloatingProps,
-    getReferenceProps,
-    floating,
-    context
-  };
-}
-
-exports.useDrawer = useDrawer;
-//# sourceMappingURL=useDrawer.js.map

package/dist-cjs/drawer/useDrawer.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useDrawer.js","sources":["../src/drawer/useDrawer.ts"],"sourcesContent":["import {\n  useClick,\n  useDismiss,\n  useInteractions,\n  useRole,\n} from \"@floating-ui/react\";\nimport { useFloatingUI, UseFloatingUIProps } from \"@salt-ds/core\";\n\nexport type UseDrawerProps = Partial<\n  Pick<UseFloatingUIProps, \"onOpenChange\" | \"open\">\n>;\n\nexport function useDrawer(props: UseDrawerProps) {\n  const { open, onOpenChange } = props;\n\n  const { context, floating } = useFloatingUI({\n    open,\n    onOpenChange,\n  });\n\n  const click = useClick(context);\n  const role = useRole(context);\n  const dismiss = useDismiss(context);\n\n  const { getFloatingProps, getReferenceProps } = useInteractions([\n    role,\n    dismiss,\n    click,\n  ]);\n\n  return {\n    getFloatingProps,\n    getReferenceProps,\n    floating,\n    context,\n  };\n}\n"],"names":["useFloatingUI","useClick","useRole","useDismiss","useInteractions"],"mappings":";;;;;;;AAYO,SAAS,UAAU,KAAuB,EAAA;AAC/C,EAAM,MAAA,EAAE,IAAM,EAAA,YAAA,EAAiB,GAAA,KAAA,CAAA;AAE/B,EAAA,MAAM,EAAE,OAAA,EAAS,QAAS,EAAA,GAAIA,kBAAc,CAAA;AAAA,IAC1C,IAAA;AAAA,IACA,YAAA;AAAA,GACD,CAAA,CAAA;AAED,EAAM,MAAA,KAAA,GAAQC,eAAS,OAAO,CAAA,CAAA;AAC9B,EAAM,MAAA,IAAA,GAAOC,cAAQ,OAAO,CAAA,CAAA;AAC5B,EAAM,MAAA,OAAA,GAAUC,iBAAW,OAAO,CAAA,CAAA;AAElC,EAAA,MAAM,EAAE,gBAAA,EAAkB,iBAAkB,EAAA,GAAIC,qBAAgB,CAAA;AAAA,IAC9D,IAAA;AAAA,IACA,OAAA;AAAA,IACA,KAAA;AAAA,GACD,CAAA,CAAA;AAED,EAAO,OAAA;AAAA,IACL,gBAAA;AAAA,IACA,iBAAA;AAAA,IACA,QAAA;AAAA,IACA,OAAA;AAAA,GACF,CAAA;AACF;;;;"}

package/dist-cjs/parent-child-item/ParentChildItem.css.js

@@ -1,6 +0,0 @@
-'use strict';
-
-var css_248z = ".saltParentChildItem-slide-top {\n  animation: var(--salt-animation-slide-in-top);\n}\n.saltParentChildItem-slide-bottom {\n  animation: var(--salt-animation-slide-in-bottom);\n}\n.saltParentChildItem-slide-left {\n  animation: var(--salt-animation-slide-in-left);\n}\n.saltParentChildItem-slide-right {\n  animation: var(--salt-animation-slide-in-right);\n}\n";
-
-module.exports = css_248z;
-//# sourceMappingURL=ParentChildItem.css.js.map

package/dist-cjs/parent-child-item/ParentChildItem.css.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ParentChildItem.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist-cjs/parent-child-item/ParentChildItem.js

@@ -1,48 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
-var clsx = require('clsx');
-var core = require('@salt-ds/core');
-var window = require('@salt-ds/window');
-var styles = require('@salt-ds/styles');
-var ParentChildItem$1 = require('./ParentChildItem.css.js');
-
-const withBaseName = core.makePrefixer("saltParentChildItem");
-const ParentChildItem = React.forwardRef(
-  function ParentChildItem2({
-    disableAnimations = false,
-    direction,
-    isStacked,
-    children,
-    className,
-    ...rest
-  }, ref) {
-    const targetWindow = window.useWindow();
-    styles.useComponentCssInjection({
-      testId: "salt-parent-child-item",
-      css: ParentChildItem$1,
-      window: targetWindow
-    });
-    return /* @__PURE__ */ jsxRuntime.jsx(core.FlexItem, {
-      className: clsx.clsx(
-        withBaseName(),
-        {
-          ...direction && {
-            [withBaseName(`slide-${direction}`)]: !disableAnimations
-          },
-          "saltFlexItem-stacked": isStacked
-        },
-        className
-      ),
-      ref,
-      ...rest,
-      children
-    });
-  }
-);
-
-exports.ParentChildItem = ParentChildItem;
-//# sourceMappingURL=ParentChildItem.js.map

package/dist-cjs/parent-child-item/ParentChildItem.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ParentChildItem.js","sources":["../src/parent-child-item/ParentChildItem.tsx"],"sourcesContent":["import { forwardRef, HTMLAttributes } from \"react\";\nimport { clsx } from \"clsx\";\nimport {\n  FlexItem,\n  flexItemAlignment,\n  makePrefixer,\n  ResponsiveProp,\n} from \"@salt-ds/core\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport parentChildItemCss from \"./ParentChildItem.css\";\n\nexport type SlideDirection = \"top\" | \"bottom\" | \"left\" | \"right\";\n\nexport interface ParentChildItemProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Allows the alignment specified by parent to be overridden for individual items, default is \"start\".\n   */\n  align?: flexItemAlignment;\n  /**\n   * Disable all animations.\n   */\n  disableAnimations?: boolean;\n  /**\n   * Direction for slide animations.\n   */\n  direction?: SlideDirection;\n  /**\n   * Defines the ability for an item to grow x times more compared to it's siblings, default is 0.\n   */\n  grow?: ResponsiveProp<number>;\n  /**\n   * Determines whether the component is stacked\n   */\n  isStacked?: boolean;\n  /**\n   * Defines the ability for an item to shrink x times more compared to it's siblings, default is 1.\n\n   */\n  shrink?: ResponsiveProp<number>;\n}\n\nconst withBaseName = makePrefixer(\"saltParentChildItem\");\nexport const ParentChildItem = forwardRef<HTMLDivElement, ParentChildItemProps>(\n  function ParentChildItem(\n    {\n      disableAnimations = false,\n      direction,\n      isStacked,\n      children,\n      className,\n      ...rest\n    },\n    ref\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-parent-child-item\",\n      css: parentChildItemCss,\n      window: targetWindow,\n    });\n\n    return (\n      <FlexItem\n        className={clsx(\n          withBaseName(),\n          {\n            ...(direction && {\n              [withBaseName(`slide-${direction}`)]: !disableAnimations,\n            }),\n            \"saltFlexItem-stacked\": isStacked,\n          },\n          className\n        )}\n        ref={ref}\n        {...rest}\n      >\n        {children}\n      </FlexItem>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","ParentChildItem","useWindow","useComponentCssInjection","parentChildItemCss","jsx","FlexItem","clsx"],"mappings":";;;;;;;;;;;;AA4CA,MAAM,YAAA,GAAeA,kBAAa,qBAAqB,CAAA,CAAA;AAChD,MAAM,eAAkB,GAAAC,gBAAA;AAAA,EAC7B,SAASC,gBACP,CAAA;AAAA,IACE,iBAAoB,GAAA,KAAA;AAAA,IACpB,SAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,wBAAA;AAAA,MACR,GAAK,EAAAC,iBAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,uBACGC,cAAA,CAAAC,aAAA,EAAA;AAAA,MACC,SAAW,EAAAC,SAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,GAAI,SAAa,IAAA;AAAA,YACf,CAAC,YAAA,CAAa,CAAS,MAAA,EAAA,SAAA,CAAA,CAAW,IAAI,CAAC,iBAAA;AAAA,WACzC;AAAA,UACA,sBAAwB,EAAA,SAAA;AAAA,SAC1B;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACA,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-cjs/progress/CircularProgress/CircularProgress.css.js

@@ -1,6 +0,0 @@
-'use strict';
-
-var css_248z = ".saltCircularProgress {\n  color: var(--salt-content-primary-foreground);\n  display: inline-flex;\n  position: relative;\n}\n\n.saltCircularProgress-progressValue {\n  align-items: center;\n  color: var(--salt-content-primary-foreground);\n  display: flex;\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--salt-text-label-fontSize);\n  font-weight: var(--salt-text-label-fontWeight-strong);\n  height: 100%;\n  justify-content: center;\n  left: 0;\n  position: absolute;\n  width: 100%;\n}\n\n.saltCircularProgress-track {\n  inline-size: calc(var(--salt-size-base) * 3);\n  block-size: calc(var(--salt-size-base) * 3);\n  border-style: var(--salt-track-borderStyle);\n  border-width: var(--salt-size-bar-small);\n  border-radius: calc(var(--salt-size-base) * 3);\n  border-color: var(--salt-palette-neutral-secondary-border);\n}\n\n.saltCircularProgress-bar {\n  inline-size: calc(var(--salt-size-base) * 3);\n  block-size: calc(var(--salt-size-base) * 3);\n  border-style: var(--salt-track-borderStyle);\n  border-width: var(--salt-size-bar-strong);\n  border-radius: calc(var(--salt-size-base) * 3);\n  border-color: var(--salt-accent-background);\n}\n\n.saltCircularProgress-bars {\n  position: absolute;\n  inset-block-start: 0;\n  inset-inline-start: 0;\n  inline-size: 100%;\n  block-size: 100%;\n}\n\n.saltCircularProgress-barOverlayRight,\n.saltCircularProgress-barOverlayLeft {\n  inline-size: 50%;\n  block-size: 100%;\n  transform-origin: 100% center;\n  transform: rotate(180deg);\n  overflow: hidden;\n  position: absolute;\n}\n\n.saltCircularProgress-barSubOverlayRight,\n.saltCircularProgress-barSubOverlayLeft {\n  inline-size: 100%;\n  block-size: 100%;\n  transform-origin: 100% center;\n  overflow: hidden;\n  transform: rotate(-180deg);\n}\n\n.saltCircularProgress-barOverlayLeft {\n  transform: rotate(0deg);\n}\n";
-
-module.exports = css_248z;
-//# sourceMappingURL=CircularProgress.css.js.map

package/dist-cjs/progress/CircularProgress/CircularProgress.css.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CircularProgress.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}