@salt-ds/lab 1.0.0-alpha.5 → 1.0.0-alpha.50

package/dist-types/tabs/drag-drop/drag-utils.d.ts

@@ -1,5 +1,5 @@
-import { orientationType } from "../../responsive";
-import { Direction } from "./dragDropTypes";
+import type { orientationType } from "../../responsive";
+import { type Direction } from "./dragDropTypes";
 export declare type MeasuredDropTarget = {
     currentIndex: number;
     dataIndex?: number;
@@ -20,25 +20,25 @@ export declare type targetType = {
 declare type Dimension = keyof Pick<DOMRect, "width" | "height">;
 export declare const measureElementSizeAndPosition: (element: HTMLElement, dimension?: Dimension, includeAutoMargin?: boolean) => number[];
 export declare const dimensions: (orientation: orientationType) => {
-    CLIENT_SIZE: "scrollWidth" | "scrollHeight" | "clientHeight" | "clientWidth" | "scrollTop" | "scrollLeft";
-    CONTRA: "x" | "y" | "top" | "right" | "bottom" | "left" | "height" | "width";
+    CLIENT_SIZE: "scrollTop" | "scrollWidth" | "scrollHeight" | "clientHeight" | "clientWidth" | "scrollLeft";
+    CONTRA: "x" | "y" | "height" | "width" | "left" | "right" | "top" | "bottom";
     CONTRA_POS: "clientX" | "clientY";
     DIMENSION: "height" | "width";
-    END: "x" | "y" | "top" | "right" | "bottom" | "left" | "height" | "width";
+    END: "x" | "y" | "height" | "width" | "left" | "right" | "top" | "bottom";
     POS: "clientX" | "clientY";
-    SCROLL_POS: "scrollWidth" | "scrollHeight" | "clientHeight" | "clientWidth" | "scrollTop" | "scrollLeft";
-    SCROLL_SIZE: "scrollWidth" | "scrollHeight" | "clientHeight" | "clientWidth" | "scrollTop" | "scrollLeft";
-    START: "x" | "y" | "top" | "right" | "bottom" | "left" | "height" | "width";
+    SCROLL_POS: "scrollTop" | "scrollWidth" | "scrollHeight" | "clientHeight" | "clientWidth" | "scrollLeft";
+    SCROLL_SIZE: "scrollTop" | "scrollWidth" | "scrollHeight" | "clientHeight" | "clientWidth" | "scrollLeft";
+    START: "x" | "y" | "height" | "width" | "left" | "right" | "top" | "bottom";
 } | {
-    CLIENT_SIZE: "scrollWidth" | "scrollHeight" | "clientHeight" | "clientWidth" | "scrollTop" | "scrollLeft";
-    CONTRA: "x" | "y" | "top" | "right" | "bottom" | "left" | "height" | "width";
+    CLIENT_SIZE: "scrollTop" | "scrollWidth" | "scrollHeight" | "clientHeight" | "clientWidth" | "scrollLeft";
+    CONTRA: "x" | "y" | "height" | "width" | "left" | "right" | "top" | "bottom";
     CONTRA_POS: "clientX" | "clientY";
     DIMENSION: "height" | "width";
-    END: "x" | "y" | "top" | "right" | "bottom" | "left" | "height" | "width";
+    END: "x" | "y" | "height" | "width" | "left" | "right" | "top" | "bottom";
     POS: "clientX" | "clientY";
-    SCROLL_POS: "scrollWidth" | "scrollHeight" | "clientHeight" | "clientWidth" | "scrollTop" | "scrollLeft";
-    SCROLL_SIZE: "scrollWidth" | "scrollHeight" | "clientHeight" | "clientWidth" | "scrollTop" | "scrollLeft";
-    START: "x" | "y" | "top" | "right" | "bottom" | "left" | "height" | "width";
+    SCROLL_POS: "scrollTop" | "scrollWidth" | "scrollHeight" | "clientHeight" | "clientWidth" | "scrollLeft";
+    SCROLL_SIZE: "scrollTop" | "scrollWidth" | "scrollHeight" | "clientHeight" | "clientWidth" | "scrollLeft";
+    START: "x" | "y" | "height" | "width" | "left" | "right" | "top" | "bottom";
 };
 export declare const getDraggedItem: (measuredItems: MeasuredDropTarget[]) => MeasuredDropTarget;
 export declare const moveDragItem: (measuredItems: MeasuredDropTarget[], dropTarget: MeasuredDropTarget) => MeasuredDropTarget[];

package/dist-types/tabs/drag-drop/dragDropTypes.d.ts

@@ -1,5 +1,5 @@
-import { MouseEventHandler, RefObject } from "react";
-import { orientationType } from "../../responsive";
+import type { MouseEventHandler, RefObject } from "react";
+import type { orientationType } from "../../responsive";
 export declare type dragStrategy = "drop-indicator" | "natural-movement";
 export declare type Direction = "fwd" | "bwd";
 export declare const FWD: Direction;

package/dist-types/tabs/drag-drop/useDragDrop.d.ts

@@ -1,2 +1,2 @@
-import { DragDropHook } from "./dragDropTypes";
+import type { DragDropHook } from "./dragDropTypes";
 export declare const useDragDrop: DragDropHook;

package/dist-types/tabs/drag-drop/useDragDropNaturalMovement.d.ts

@@ -1,2 +1,2 @@
-import { DragDropHook } from "./dragDropTypes";
+import type { DragDropHook } from "./dragDropTypes";
 export declare const useDragDropNaturalMovement: DragDropHook;

package/dist-types/tabs/drag-drop/useDragSpacers.d.ts

@@ -1,7 +1,7 @@
-import { MeasuredDropTarget } from "./drag-utils";
-import { Direction } from "./dragDropTypes";
+import type { MeasuredDropTarget } from "./drag-utils";
+import type { Direction } from "./dragDropTypes";
 export declare const useDragSpacers: () => {
-    displaceItem: (item: MeasuredDropTarget | null | undefined, size: number, useTransition?: boolean, direction?: Direction | undefined) => void;
+    displaceItem: (item: MeasuredDropTarget | null, size: number, useTransition?: boolean, direction?: Direction | undefined) => void;
     displaceLastItem: (item: MeasuredDropTarget, size: number, useTransition?: boolean) => void;
     clearSpacers: () => void;
 };

package/dist-types/tabs/useActivationIndicator.d.ts

@@ -1,5 +1,5 @@
-import { RefObject } from "react";
-import { orientationType } from "../responsive";
+import { type RefObject } from "react";
+import { type orientationType } from "../responsive";
 declare type activationIndicatorStyles = {
     height?: number;
     left?: number;
@@ -9,7 +9,7 @@ declare type activationIndicatorStyles = {
 };
 export declare function useActivationIndicator({ rootRef, tabId, orientation, }: {
     rootRef: RefObject<HTMLDivElement | null>;
-    tabId?: string;
+    tabId?: string | null;
     orientation: orientationType;
 }): activationIndicatorStyles;
 export {};

package/dist-types/tabs/useEditableItem.d.ts

@@ -1,5 +1,5 @@
-import { KeyboardEvent } from "react";
-import { OverflowItem } from "../responsive";
+import { type KeyboardEvent } from "react";
+import type { OverflowItem } from "../responsive";
 export declare type ExitEditModeHandler = (originalValue: string, editedValue: string, allowDeactivation: boolean, tabIndex: number) => void;
 export interface Editable {
     editing: boolean;

package/dist-types/tabs/useItemsWithIds.d.ts

@@ -1,3 +1,3 @@
-import { ReactNode } from "react";
-import { TabDescriptor } from "./TabsTypes";
+import { type ReactNode } from "react";
+import type { TabDescriptor } from "./TabsTypes";
 export declare const useItemsWithIds: (children: ReactNode, id?: string) => [TabDescriptor[], (id: string) => TabDescriptor];

package/dist-types/tabs/useKeyboardNavigation.d.ts

@@ -1,5 +1,5 @@
-import { FocusEvent, FocusEventHandler, KeyboardEvent, MouseEvent, MouseEventHandler } from "react";
-import { OverflowItem } from "../responsive";
+import { type FocusEvent, type FocusEventHandler, type KeyboardEvent, type MouseEvent, type MouseEventHandler } from "react";
+import type { OverflowItem } from "../responsive";
 declare type orientationType = "horizontal" | "vertical";
 export interface ContainerNavigationProps {
     onBlur: FocusEventHandler;
@@ -13,7 +13,7 @@ interface TabstripNavigationHookProps {
     indexPositions: OverflowItem[];
     keyBoardActivation?: "manual" | "automatic";
     orientation: orientationType;
-    selectedIndex: number;
+    selectedIndex: number | null;
 }
 interface TabstripNavigationHookResult {
     containerProps: ContainerNavigationProps;

package/dist-types/tabs/useSelection.d.ts

@@ -1,14 +1,14 @@
-import { KeyboardEvent, MouseEvent } from "react";
+import { type KeyboardEvent, type MouseEvent } from "react";
 export declare const isTabElement: (el: HTMLElement) => boolean;
 export declare const useSelection: ({ defaultSelected, highlightedIdx, onSelectionChange, selected: selectedProp, }: {
     defaultSelected?: number | undefined;
     highlightedIdx: number;
     onSelectionChange?: ((tabIndex: number) => void) | undefined;
-    selected?: number | undefined;
+    selected?: number | null | undefined;
 }) => {
     activateTab: (tabIndex: number) => void;
     isControlled: boolean;
     onClick: (evt: MouseEvent<Element>, tabIndex: number) => void;
     onKeyDown: (evt: KeyboardEvent) => void;
-    selected: number;
+    selected: number | null;
 };

package/dist-types/tabs/useTabs.d.ts

@@ -1,14 +1,14 @@
-import { ReactNode } from "react";
-import { TabDescriptor } from "./TabsTypes";
+import { type ReactNode } from "react";
+import type { TabDescriptor } from "./TabsTypes";
 export interface TabsHookProps {
-    activeTabIndex?: number;
+    activeTabIndex?: number | null;
     children: ReactNode;
     defaultActiveTabIndex?: number;
     id?: string;
     onActiveChange?: (tabIndex: number) => void;
 }
 export interface TabsHookResult {
-    activeTabIndex?: number;
+    activeTabIndex?: number | null;
     id: string;
     onActiveChange?: (tabIndex: number) => void;
     tabPanel?: ReactNode;

package/dist-types/tabs/useTabstrip.d.ts

@@ -1,11 +1,11 @@
-import { RefObject } from "react";
-import { ContainerNavigationProps } from "./useKeyboardNavigation";
-import { dragStrategy, DragHookResult } from "./drag-drop";
-import { ExitEditModeHandler, EditableItemHookResult } from "./useEditableItem";
-import { OverflowCollectionHookResult } from "../responsive";
-import { composableTabProps, navigationProps, TabDescriptor, TabElement } from "./TabsTypes";
+import { type RefObject } from "react";
+import type { OverflowCollectionHookResult } from "../responsive";
+import { type DragHookResult, type dragStrategy } from "./drag-drop";
+import { type EditableItemHookResult, type ExitEditModeHandler } from "./useEditableItem";
+import { type ContainerNavigationProps } from "./useKeyboardNavigation";
+import type { TabDescriptor, TabElement, composableTabProps, navigationProps } from "./TabsTypes";
 interface tabstripHookProps {
-    activeTabIndex?: number;
+    activeTabIndex?: number | null;
     allowDragDrop?: boolean | dragStrategy;
     collectionHook: OverflowCollectionHookResult;
     defaultActiveTabIndex?: number;
@@ -26,7 +26,7 @@ interface tabstripHookProps {
 }
 interface tabstripHookResult extends DragHookResult, Pick<EditableItemHookResult, "editing"> {
     activateTab: (tabIndex: number) => void;
-    activeTabIndex: number;
+    activeTabIndex: number | null;
     addTab: (indexPosition?: number) => void;
     closeTab: (indexPosition: number) => void;
     containerProps: ContainerNavigationProps;

package/dist-types/tabs-next/OverflowMenu.d.ts

@@ -0,0 +1,11 @@
+import { type ReactNode } from "react";
+import { type DropdownProps } from "../dropdown";
+declare type TabValue = {
+    value: string;
+    label: ReactNode;
+};
+export interface OverflowMenuProps extends DropdownProps<TabValue> {
+    tabs: TabValue[];
+}
+export declare const OverflowMenu: import("react").ForwardRefExoticComponent<OverflowMenuProps & import("react").RefAttributes<HTMLDivElement>>;
+export {};

package/dist-types/tabs-next/TabNext.d.ts

@@ -0,0 +1,5 @@
+import { type ComponentPropsWithoutRef } from "react";
+export interface TabNextProps extends ComponentPropsWithoutRef<"button"> {
+    value: string;
+}
+export declare const TabNext: import("react").ForwardRefExoticComponent<TabNextProps & import("react").RefAttributes<HTMLButtonElement>>;

package/dist-types/tabs-next/TabNextContext.d.ts

@@ -0,0 +1,19 @@
+import { type ReactNode, type SyntheticEvent } from "react";
+interface TabValue {
+    value: string;
+    label: ReactNode;
+}
+export interface TabsContextValue {
+    activeColor: "primary" | "secondary";
+    disabled?: boolean;
+    activate: (event: SyntheticEvent<HTMLButtonElement>) => void;
+    isActive: (id: string) => boolean;
+    setFocusable: (id: string) => void;
+    isFocusable: (id: string) => boolean;
+    registerTab: (tab: TabValue) => void;
+    unregisterTab: (id: string) => void;
+    variant: "main" | "inline";
+}
+export declare const TabsContext: import("react").Context<TabsContextValue>;
+export declare function useTabs(): TabsContextValue;
+export {};

package/dist-types/tabs-next/TabstripNext.d.ts

@@ -0,0 +1,12 @@
+import { type ComponentPropsWithoutRef, type SyntheticEvent } from "react";
+export interface TabstripNextProps extends Omit<ComponentPropsWithoutRef<"div">, "onChange"> {
+    activeColor?: "primary" | "secondary";
+    align?: "left" | "center" | "right";
+    value?: string;
+    onChange?: (e: SyntheticEvent, data: {
+        value: string;
+    }) => void;
+    defaultValue?: string;
+    variant?: "main" | "inline";
+}
+export declare const TabstripNext: import("react").ForwardRefExoticComponent<TabstripNextProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist-types/tabs-next/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./TabNext";
+export * from "./TabstripNext";

package/dist-types/toast-group/ToastGroup.d.ts

@@ -0,0 +1,5 @@
+import { type ComponentPropsWithoutRef } from "react";
+export interface ToastGroupProps extends ComponentPropsWithoutRef<"div"> {
+    placement?: "top-right" | "bottom-right";
+}
+export declare const ToastGroup: import("react").ForwardRefExoticComponent<ToastGroupProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist-types/toast-group/index.d.ts

@@ -0,0 +1 @@
+export * from "./ToastGroup";

package/dist-types/tokenized-input/TokenizedInput.d.ts

@@ -1,7 +1,6 @@
-import { UseTooltipProps } from "@salt-ds/core";
-import { ComponentType } from "react";
-import { TokenizedInputBaseProps } from "./TokenizedInputBase";
-import "./TokenizedInput.css";
+import { type UseTooltipProps } from "@salt-ds/core";
+import { type ComponentType } from "react";
+import { type TokenizedInputBaseProps } from "./TokenizedInputBase";
 export declare type StringToItem<Item> = (selectedItems: Array<Item>, value: string) => Item | null | undefined;
 export declare type ChangeHandler<Item> = (selectedItems: Item[] | undefined) => void;
 export interface TokenizedInputProps<Item> extends Omit<TokenizedInputBaseProps<Item>, "activeIndices" | "focused" | "highlightedIndex" | "helpers" | "onRemoveItem"> {

package/dist-types/tokenized-input/TokenizedInputBase.d.ts

@@ -1,7 +1,7 @@
-import { ChangeEventHandler, FocusEventHandler, ForwardedRef, HTMLAttributes, KeyboardEventHandler, ReactElement, ReactEventHandler, Ref, SyntheticEvent } from "react";
-import { ButtonProps } from "@salt-ds/core";
-import { TokenizedInputHelpers, TokenizedInputState } from "./useTokenizedInput";
-import { InputProps } from "../input";
+import { type ButtonProps } from "@salt-ds/core";
+import { type ChangeEventHandler, type FocusEventHandler, type ForwardedRef, type HTMLAttributes, type KeyboardEventHandler, type ReactElement, type ReactEventHandler, type Ref, type SyntheticEvent } from "react";
+import { type InputLegacyProps as InputProps } from "../input-legacy";
+import type { TokenizedInputHelpers, TokenizedInputState } from "./useTokenizedInput";
 export declare type RemoveItemHandler = (itemIndex: number) => void;
 export declare type ItemToString<Item> = (item: Item) => string;
 export declare type ExpandButtonProps = Pick<ButtonProps, "role" | "aria-roledescription" | "aria-describedby"> & {

package/dist-types/tokenized-input/internal/InputPill.d.ts

@@ -1,16 +1,18 @@
-import { MutableRefObject } from "react";
-import { PillProps } from "../../pill";
-export declare type InputPillProps = Omit<PillProps<"basic" | "closable">, "variant" | "onDelete" | "clickable"> & {
+import { type PillProps } from "@salt-ds/core";
+import { type MutableRefObject } from "react";
+export declare type InputPillProps = PillProps & {
     /**
      * An ref object holds pills index map to width.
      */
-    pillsRef: MutableRefObject<{
-        [index: number]: number | undefined;
-    }>;
+    pillsRef: MutableRefObject<Record<number, number | undefined>>;
     /**
      * Index of the pill within Input.
      */
     index: number;
+    /**
+     * Pill label.
+     */
+    label?: string;
     /**
      * Whether the pill is the last visible one within Input.
      */

package/dist-types/tokenized-input/internal/InputRuler.d.ts

@@ -1,5 +1,4 @@
-import { InputHTMLAttributes } from "react";
-import "./InputRuler.css";
+import { type InputHTMLAttributes } from "react";
 /**
  * This hidden component is used to wrap a copy of an input value
  * so that we can use it to determine the input width dynamically

package/dist-types/tokenized-input/internal/getCursorPosition.d.ts

@@ -1,2 +1,2 @@
-import { MutableRefObject } from "react";
+import type { MutableRefObject } from "react";
 export declare const getCursorPosition: (inputRef: MutableRefObject<HTMLInputElement | null>) => number;

package/dist-types/tokenized-input/internal/useResizeObserver.d.ts

@@ -1,4 +1,4 @@
-import { Ref } from "react";
+import { type Ref } from "react";
 /**
  * This monitors the size of a component and calls `onSizeChange` callback
  * every time when size changes.

package/dist-types/tokenized-input/internal/useWidth.d.ts

@@ -1,4 +1,4 @@
-import { Density } from "@salt-ds/core";
+import { type Density } from "@salt-ds/core";
 export declare const getWidth: (node: HTMLElement | null) => number;
 /**
  * This records the width of a component when it's rendered

package/dist-types/tokenized-input/useTokenizedInput.d.ts

@@ -1,6 +1,6 @@
-import { Ref } from "react";
-import { TokenizedInputProps } from "./TokenizedInput";
-import { TokenizedInputBaseProps } from "./TokenizedInputBase";
+import { type Ref } from "react";
+import type { TokenizedInputProps } from "./TokenizedInput";
+import type { TokenizedInputBaseProps } from "./TokenizedInputBase";
 export interface TokenizedInputState<Item> {
     activeIndices: Array<number>;
     expanded: boolean | undefined;

package/dist-types/tokenized-input-next/TokenizedInputNext.d.ts

@@ -0,0 +1,51 @@
+import { type ButtonProps, type NecessityType, type ValidationStatus } from "@salt-ds/core";
+import { type ChangeEventHandler, type FocusEventHandler, type HTMLAttributes, type KeyboardEventHandler, type ReactEventHandler, type Ref, type SyntheticEvent, type TextareaHTMLAttributes } from "react";
+import { type TokenizedInputNextState } from "./useTokenizedInputNext";
+declare type ChangeHandler<Item> = (event: SyntheticEvent, selectedItems: Item[] | undefined) => void;
+declare type ExpandButtonProps = Pick<ButtonProps, "role" | "aria-roledescription" | "aria-describedby"> & {
+    "aria-label"?: string;
+};
+export interface TokenizedInputNextProps<Item> extends Partial<TokenizedInputNextState<Item>>, Omit<HTMLAttributes<HTMLDivElement>, "onFocus" | "onBlur" | "onChange" | "onKeyUp" | "onKeyDown"> {
+    ExpandButtonProps?: ExpandButtonProps;
+    disabled?: boolean;
+    focused?: boolean;
+    expandButtonRef?: Ref<HTMLButtonElement>;
+    onBlur?: FocusEventHandler<HTMLTextAreaElement | HTMLButtonElement>;
+    onKeyUp?: KeyboardEventHandler<HTMLTextAreaElement | HTMLButtonElement>;
+    onKeyDown?: KeyboardEventHandler<HTMLTextAreaElement | HTMLButtonElement>;
+    onRemoveItem?: (event: SyntheticEvent, index: number) => void;
+    onInputBlur?: FocusEventHandler<HTMLTextAreaElement>;
+    onInputFocus?: FocusEventHandler<HTMLTextAreaElement>;
+    onInputChange?: ChangeEventHandler<HTMLTextAreaElement>;
+    onClick?: ReactEventHandler;
+    onClear?: ReactEventHandler;
+    delimiters?: string[];
+    disableAddOnBlur?: boolean;
+    defaultSelected?: Item[];
+    onChange?: ChangeHandler<Item>;
+    onCollapse?: ReactEventHandler;
+    onExpand?: ReactEventHandler;
+    /**
+     * Validation status.
+     */
+    validationStatus?: Omit<ValidationStatus, "info">;
+    /**
+     * If `true`, the component is read only.
+     */
+    readOnly?: boolean;
+    /**
+     * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#Attributes) applied to the `textarea` element.
+     */
+    textAreaProps?: TextareaHTMLAttributes<HTMLTextAreaElement>;
+    /**
+     * Optional ref for the textarea component
+     */
+    textAreaRef?: Ref<HTMLTextAreaElement>;
+    necessity?: NecessityType;
+    /**
+     * Styling variant. Defaults to "primary".
+     */
+    variant?: "primary" | "secondary";
+}
+export declare const TokenizedInputNext: import("react").ForwardRefExoticComponent<TokenizedInputNextProps<unknown> & import("react").RefAttributes<HTMLDivElement>>;
+export {};

package/dist-types/tokenized-input-next/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./TokenizedInputNext";
+export * from "./useTokenizedInputNext";

package/dist-types/tokenized-input-next/internal/InputPill.d.ts

@@ -0,0 +1,29 @@
+import { type PillProps } from "@salt-ds/core";
+import { type MutableRefObject, type SyntheticEvent } from "react";
+export declare type InputPillProps = PillProps & {
+    /**
+     * A ref object holds pills index map to width.
+     */
+    pillsRef: MutableRefObject<Record<number, number | undefined>>;
+    /**
+     * Index of the pill within Input.
+     */
+    index: number;
+    /**
+     * Whether the pill is the last visible one within Input.
+     */
+    lastVisible?: boolean;
+    /**
+     * Pill label.
+     */
+    label?: string;
+    /**
+     * Whether the pill is highlighted.
+     */
+    highlighted?: boolean;
+    /**
+     * Callback when pill is deleted.
+     */
+    onClose?: (event: SyntheticEvent, index: number) => void;
+};
+export declare const InputPill: import("react").NamedExoticComponent<InputPillProps>;

package/dist-types/tokenized-input-next/internal/calcFirstHiddenIndex.d.ts

@@ -0,0 +1,4 @@
+export declare function calcFirstHiddenIndex({ containerWidth, pillWidths, }?: {
+    containerWidth?: number;
+    pillWidths?: number[];
+}): number | null;

package/dist-types/tokenized-input-next/internal/useResizeObserver.d.ts

@@ -0,0 +1,6 @@
+import { type Ref } from "react";
+/**
+ * This monitors the size of a component and calls `onSizeChange` callback
+ * every time when size changes.
+ */
+export declare function useResizeObserver<Element extends HTMLElement>(onSizeChange: (entries: ResizeObserverEntry[], observer?: ResizeObserver) => void): Ref<Element>;

package/dist-types/tokenized-input-next/internal/useWidth.d.ts

@@ -0,0 +1,7 @@
+import { type Density } from "@salt-ds/core";
+export declare const getPadding: (node: HTMLElement | null) => number;
+export declare const getWidth: (node: HTMLElement | null) => number;
+/**
+ * This records the width of a component when it's rendered
+ */
+export declare const useWidth: (density: Density) => [(newNode: any) => void, number];

package/dist-types/tokenized-input-next/useTokenizedInputNext.d.ts

@@ -0,0 +1,47 @@
+import { type MutableRefObject, type Ref, type SyntheticEvent } from "react";
+import type { TokenizedInputNextProps } from "./TokenizedInputNext";
+export interface TokenizedInputNextState<Item> {
+    activeIndices: number[];
+    expanded: boolean | undefined;
+    highlightedIndex: number | undefined;
+    selectedItems: Item[];
+    value: string | undefined;
+}
+export interface TokenizedInputNextHelpers<Item> {
+    setHighlightedIndex: (value?: number) => void;
+    setValue: (value: string) => void;
+    setSelectedItems: (selectedItems: Item[]) => void;
+    updateExpanded: (event: SyntheticEvent, expanded: boolean) => void;
+}
+export interface TokenizedInputNextRefs {
+    textAreaRef: Ref<HTMLTextAreaElement>;
+    pillsRef: MutableRefObject<Record<number, number | undefined>>;
+    clearButtonRef: (newNode: HTMLButtonElement) => void;
+    expandButtonRef: Ref<HTMLButtonElement>;
+    statusAdornmentRef: Ref<SVGSVGElement>;
+    containerRef: Ref<HTMLDivElement>;
+}
+interface useTokenizedInputNextResult<Item> {
+    /**
+     * The tokenized input state
+     */
+    state: TokenizedInputNextState<Item>;
+    /**
+     * First hidden element when collapsed
+     */
+    firstHiddenIndex: number | null;
+    /**
+     * Utility functions for modifying tokenized input state
+     */
+    helpers: TokenizedInputNextHelpers<Item>;
+    /**
+     * Refs for tokenized input items.
+     */
+    refs: TokenizedInputNextRefs;
+    /**
+     * Properties applied to a basic tokenized input component
+     */
+    inputProps: Omit<TokenizedInputNextProps<Item>, "helpers" | "onChange">;
+}
+export declare function useTokenizedInputNext<Item>(props: TokenizedInputNextProps<Item>): useTokenizedInputNextResult<Item>;
+export {};

package/dist-types/toolbar/Toolbar.d.ts

@@ -1,6 +1,4 @@
-/// <reference types="react" />
-import { ToolbarProps } from "./ToolbarProps";
-import "./Toolbar.css";
+import type { ToolbarProps } from "./ToolbarProps";
 /**
  * The core Toolbar implementation, without the external wrapper provided by Toolbar.js
  */

package/dist-types/toolbar/ToolbarButton.d.ts

@@ -1,6 +1,4 @@
-/// <reference types="react" />
-import { ButtonProps } from "@salt-ds/core";
-import "./ToolbarButton.css";
+import { type ButtonProps } from "@salt-ds/core";
 export declare type ToolbarButtonProps = ButtonProps & {
     overflowLabel?: string;
     label?: string;

package/dist-types/toolbar/ToolbarProps.d.ts

@@ -1,5 +1,5 @@
-import { TooltipProps } from "@salt-ds/core";
-import { ComponentType, HTMLAttributes, ReactNode } from "react";
+import type { TooltipProps } from "@salt-ds/core";
+import type { ComponentType, HTMLAttributes, ReactNode } from "react";
 export declare type OrientationShape = "vertical" | "horizontal";
 export interface ToolbarAlignmentProps {
     alignCenter?: true | undefined;

package/dist-types/toolbar/Tooltray.d.ts

@@ -1,4 +1,2 @@
-/// <reference types="react" />
-import { TooltrayProps } from "./TooltrayProps";
-import "./Tooltray.css";
-export declare const Tooltray: (props: TooltrayProps) => JSX.Element;
+import type { TooltrayProps } from "./TooltrayProps";
+export declare const Tooltray: (props: TooltrayProps) => import("react/jsx-runtime").JSX.Element;

package/dist-types/toolbar/TooltrayProps.d.ts

@@ -1,5 +1,5 @@
-import { HTMLAttributes } from "react";
-import { OrientationShape, ToolbarAlignmentProps } from "./ToolbarProps";
+import type { HTMLAttributes } from "react";
+import type { OrientationShape, ToolbarAlignmentProps } from "./ToolbarProps";
 declare type collapsibleType = "dynamic" | "instant";
 declare type booleanAttribute = "true" | "false";
 export interface TooltrayProps extends ToolbarAlignmentProps, HTMLAttributes<HTMLDivElement> {

package/dist-types/toolbar/internal/ToolbarButtonRefsContext.d.ts

@@ -1,4 +1,4 @@
-import { RefObject } from "react";
+import { type RefObject } from "react";
 declare type refsMap<T> = {
     [key: string]: RefObject<T>;
 };

package/dist-types/toolbar/internal/ToolbarHiddenItemIdsContext.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 declare const _default: import("react").Context<{}>;
 export default _default;

package/dist-types/toolbar/internal/renderToolbarItems.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
-import { orientationType, OverflowCollectionHookResult, OverflowItem } from "../../responsive";
-export declare const renderToolbarItems: (collectionHook: OverflowCollectionHookResult, overflowedItems: OverflowItem<"child">[] | undefined, orientation: orientationType) => JSX.Element[];
+import { type OverflowCollectionHookResult, type OverflowItem, type orientationType } from "../../responsive";
+export declare const renderToolbarItems: (collectionHook: OverflowCollectionHookResult, overflowedItems: OverflowItem[], orientation: orientationType) => JSX.Element[];

package/dist-types/toolbar/internal/renderTrayTools.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from "react";
-import { OverflowCollectionHookResult, OverflowItem } from "../../responsive/overflowTypes";
-import { OrientationShape } from "../ToolbarProps";
+import { type ReactNode } from "react";
+import type { OverflowCollectionHookResult, OverflowItem } from "../../responsive/overflowTypes";
+import type { OrientationShape } from "../ToolbarProps";
 export declare const renderTrayTools: (collectionHook: OverflowCollectionHookResult, overflowedItems: OverflowItem[], orientation: OrientationShape, collapsed?: string | boolean | undefined) => ReactNode;

package/dist-types/toolbar/overflow-panel/OverflowPanel.d.ts

@@ -1,6 +1,4 @@
-import React from "react";
-import { DropdownBaseProps } from "../../dropdown";
-import "./OverflowPanel.css";
+import { type DropdownBaseProps } from "../../dropdown";
 export interface DropdownPanelProps extends DropdownBaseProps {
     /**
      * Trigger button icon
@@ -11,4 +9,4 @@ export interface DropdownPanelProps extends DropdownBaseProps {
      */
     triggerButtonLabel?: string;
 }
-export declare const OverflowPanel: React.ForwardRefExoticComponent<DropdownPanelProps & React.RefAttributes<HTMLDivElement>>;
+export declare const OverflowPanel: import("react").ForwardRefExoticComponent<DropdownPanelProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist-types/toolbar/overflow-panel/OverflowSeparator.d.ts

@@ -1,5 +1,4 @@
-import { HTMLAttributes, ReactElement } from "react";
-import "./OverflowSeparator.css";
+import type { HTMLAttributes, ReactElement } from "react";
 export interface OverflowSeparatorProps extends HTMLAttributes<HTMLDivElement> {
     children?: never;
     focusable?: boolean;