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

package/dist-types/progress/LinearProgress/LinearProgress.d.ts

@@ -1,59 +1,26 @@
-import { HTMLAttributes, ReactElement } from "react";
-import "./LinearProgress.css";
-export interface InfoRendererProps<T, U> {
-    unit: string;
-    value: number;
-    getUnitProps?: (props: T) => {
-        className: string;
-    } & T;
-    getValueProps: (props: U) => {
-        className: string;
-    } & U;
-}
+import { HTMLAttributes } from "react";
 export interface LinearProgressProps extends HTMLAttributes<HTMLDivElement> {
     /**
      * The className(s) of the component.
      */
     className?: string;
     /**
-     * Disabled flag, true when the component is disabled.
-     */
-    disabled?: boolean;
-    /**
-     * render props callback to render info panel.
-     */
-    renderInfo?: (props: Pick<InfoRendererProps<any, any>, "value" | "unit" | "getValueProps" | "getUnitProps">) => ReactElement<InfoRendererProps<any, any>>;
-    /**
-     * If `true`, the info panel will be displayed.
+     * The value of the max progress indicator.
+     * Default value is 100.
      */
-    showInfo?: boolean;
+    max?: number;
     /**
-     * The size of the line, default is 'small'.
-     */
-    size?: "small" | "medium" | "large";
-    /**
-     * Default unit is`%`.
+     * The unit shown on the progress indicator.
+     * Default unit is `%`.
      */
     unit?: string;
     /**
-     * The value of the progress indicator for the determinate and static variants.
-     * Value between 0 and 100.
+     * The value of the progress indicator.
+     * Value between 0 and max.
      */
     value?: number;
-    /**
-     * The variant to use.
-     * Use indeterminate or query when there is no progress value.
-     */
-    variant?: "determinate" | "indeterminate" | "query";
 }
 /**
- * Linear progress bar with an optional Info element, showing the current value
- * The default Info element can be rendered by setting `unit` and `value` props.
- * A custom Info element can be rendered using the `renderInfo` callback.
- * The render props callback is of the form
- * @param {string} unit the unit of the progress info
- * @param {number} value the value of the progress info
- * @param {function} getUnitProps function callback that returns the unit props
- * @param {function} getValueProps function callback that returns the value props
+ * Linear progress bar with an Info element showing the current value
  */
 export declare const LinearProgress: import("react").ForwardRefExoticComponent<LinearProgressProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist-types/query-input/QueryInput.d.ts

@@ -1,7 +1,6 @@
 import { HTMLAttributes } from "react";
 import { QueryInputCategory, QueryInputItem } from "./queryInputTypes";
 import { BooleanOperator } from "./useQueryInput";
-import "./QueryInput.css";
 export interface QueryInputProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange"> {
     disabled?: boolean;
     categories: QueryInputCategory[];

package/dist-types/query-input/internal/CategoryListContext.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export interface CategoryListContext {
     width: number;
 }

package/dist-types/query-input/internal/SearchList.d.ts

@@ -1,6 +1,5 @@
 import { Dispatch, SetStateAction } from "react";
 import { QueryInputCategory, QueryInputItem } from "../queryInputTypes";
-import "../QueryInput.css";
 export interface SearchListProps {
     inputValue?: string;
     selectedItems?: QueryInputItem[];

package/dist-types/responsive/overflowUtils.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ElementRef, OverflowItem, orientationType } from "./overflowTypes";
 export declare const DropdownPlaceholder: () => null;
 export declare const getDropdownPlaceholder: () => JSX.Element;

package/dist-types/search-input/SearchInput.d.ts

@@ -1,6 +1,5 @@
 import { ComponentType, SyntheticEvent } from "react";
-import { InputProps } from "../input";
-import "./SearchInput.css";
+import { InputLegacyProps as InputProps } from "../input-legacy";
 export interface SearchInputProps extends Omit<InputProps, "onSubmit"> {
     /**
      * Override "search" icon.

package/dist-types/skip-link/SkipLink.d.ts

@@ -1,6 +1,5 @@
 import { RefObject } from "react";
 import { LinkProps } from "@salt-ds/core";
-import "./SkipLink.css";
 interface SkipLinkProps extends LinkProps {
     /**
      * This is a ref that has access to the target element.

package/dist-types/skip-link/SkipLinks.d.ts

@@ -1,3 +1,2 @@
 import { HTMLAttributes } from "react";
-import "./SkipLinks.css";
 export declare const SkipLinks: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLUListElement> & import("react").RefAttributes<HTMLUListElement>>;

package/dist-types/skip-link/internal/useManageFocusOnTarget.d.ts

@@ -1,5 +1,5 @@
+/// <reference types="cypress" />
 /// <reference types="node" />
-/// <reference types="webpack-env" />
 import { RefObject } from "react";
 export declare const useManageFocusOnTarget: ({ targetRef, targetClass, }: {
     targetRef: RefObject<HTMLElement> | undefined;

package/dist-types/slider/Slider.d.ts

@@ -1,7 +1,6 @@
 import { HTMLAttributes } from "react";
 import { SliderMark } from "./internal/SliderRailMarks";
 import { SliderChangeHandler, SliderValue } from "./types";
-import "./Slider.css";
 export interface SliderProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange" | "defaultValue"> {
     label?: string;
     min?: number;

package/dist-types/slider/internal/SliderHandle.d.ts

@@ -1,5 +1,4 @@
 import { CSSProperties } from "react";
-import "../Slider.css";
 export interface SliderHandleProps {
     min: number;
     max: number;

package/dist-types/slider/internal/SliderMarkLabels.d.ts

@@ -1,6 +1,4 @@
-/// <reference types="react" />
 import { SliderMark } from "./SliderRailMarks";
-import "../Slider.css";
 export interface SliderMarkLabelsProps {
     min: number;
     max: number;

package/dist-types/slider/internal/SliderRail.d.ts

@@ -1,5 +1,3 @@
-/// <reference types="react" />
-import "../Slider.css";
 export interface SliderRailProps {
 }
 export declare function SliderRail(props: SliderRailProps): JSX.Element;

package/dist-types/slider/internal/SliderRailMarks.d.ts

@@ -1,5 +1,4 @@
 import { ReactNode } from "react";
-import "../Slider.css";
 export interface LabeledMark {
     value: number;
     label: ReactNode;

package/dist-types/slider/internal/SliderSelection.d.ts

@@ -1,5 +1,3 @@
-/// <reference types="react" />
-import "../Slider.css";
 export interface SliderSelectionProps {
     valueLength: number;
 }

package/dist-types/stepped-tracker/StepLabel/StepLabel.d.ts

@@ -0,0 +1,8 @@
+import { ComponentPropsWithoutRef, ReactNode } from "react";
+export interface StepLabelProps extends ComponentPropsWithoutRef<"label"> {
+    /**
+     * The content of Step Label
+     */
+    children?: ReactNode;
+}
+export declare const StepLabel: import("react").ForwardRefExoticComponent<StepLabelProps & import("react").RefAttributes<HTMLLabelElement>>;

package/dist-types/stepped-tracker/StepLabel/index.d.ts

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

package/dist-types/stepped-tracker/SteppedTracker.d.ts

@@ -0,0 +1,16 @@
+import { ComponentPropsWithoutRef, ReactNode } from "react";
+export interface SteppedTrackerProps extends ComponentPropsWithoutRef<"ul"> {
+    /**
+     * The index of the current activeStep
+     */
+    activeStep: number;
+    /**
+     * Should be one or more TrackerStep components
+     */
+    children: ReactNode;
+    /**
+     * The orientation of the SteppedTracker. Defaults to `horizontal`
+     */
+    orientation?: "horizontal" | "vertical";
+}
+export declare const SteppedTracker: import("react").ForwardRefExoticComponent<SteppedTrackerProps & import("react").RefAttributes<HTMLUListElement>>;

package/dist-types/stepped-tracker/SteppedTrackerContext.d.ts

@@ -0,0 +1,18 @@
+import { ReactNode } from "react";
+export interface SteppedTrackerContextType {
+    activeStep: number;
+    totalSteps: number;
+    isWithinSteppedTracker: boolean;
+}
+declare type SteppedTrackerProviderProps = Omit<SteppedTrackerContextType, "isWithinSteppedTracker"> & {
+    children: ReactNode;
+};
+export declare const SteppedTrackerProvider: ({ activeStep, totalSteps, children, }: SteppedTrackerProviderProps) => JSX.Element;
+export declare const useSteppedTrackerContext: () => SteppedTrackerContextType;
+export declare const useTrackerStepContext: () => number;
+interface TrackerStepProviderProps {
+    stepNumber: number;
+    children: ReactNode;
+}
+export declare const TrackerStepProvider: ({ children, stepNumber, }: TrackerStepProviderProps) => JSX.Element;
+export {};

package/dist-types/stepped-tracker/TrackerConnector/TrackerConnector.d.ts

@@ -0,0 +1,9 @@
+declare type ConnectorState = "default" | "active";
+interface TrackerConnectorProps {
+    /**
+     * The state of the connector, which acts as an indicator of whether the active step is ahead/behind
+     */
+    state: ConnectorState;
+}
+export declare const TrackerConnector: ({ state }: TrackerConnectorProps) => JSX.Element;
+export {};

package/dist-types/stepped-tracker/TrackerConnector/index.d.ts

@@ -0,0 +1 @@
+export { TrackerConnector } from "./TrackerConnector";

package/dist-types/stepped-tracker/TrackerStep/TrackerStep.d.ts

@@ -0,0 +1,10 @@
+import { ComponentPropsWithoutRef } from "react";
+declare type State = "default" | "completed";
+export interface TrackerStepProps extends ComponentPropsWithoutRef<"li"> {
+    /**
+     * The state of the TrackerStep
+     */
+    state?: State;
+}
+export declare const TrackerStep: import("react").ForwardRefExoticComponent<TrackerStepProps & import("react").RefAttributes<HTMLLIElement>>;
+export {};

package/dist-types/stepped-tracker/TrackerStep/index.d.ts

@@ -0,0 +1,2 @@
+export { TrackerStep } from "./TrackerStep";
+export type { TrackerStepProps } from "./TrackerStep";

package/dist-types/stepped-tracker/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./SteppedTracker";
+export * from "./TrackerStep";
+export * from "./StepLabel";

package/dist-types/stepper-input/StepperInput.d.ts

@@ -1,7 +1,6 @@
 import React from "react";
 import { ButtonProps } from "@salt-ds/core";
-import { InputProps } from "../input";
-import "./StepperInput.css";
+import { InputLegacyProps as InputProps } from "../input-legacy";
 export interface StepperInputProps {
     ButtonProps?: Partial<ButtonProps>;
     InputProps?: Partial<InputProps>;

package/dist-types/stepper-input/internal/useDynamicAriaLabel.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export declare const useDynamicAriaLabel: (appendLabel: string, hasLiveValue: boolean, inputRef: React.MutableRefObject<HTMLInputElement | null>, value: number | string | undefined, valuesHaveDiverged: () => boolean) => {
     setHasAnnounced: import("react").Dispatch<import("react").SetStateAction<boolean>>;
 };

package/dist-types/stepper-input/useStepperInput.d.ts

@@ -1,6 +1,6 @@
 import { MutableRefObject } from "react";
 import { ButtonProps } from "@salt-ds/core";
-import { InputProps } from "../input";
+import { InputLegacyProps as InputProps } from "../input-legacy";
 import { StepperInputProps } from "./StepperInput";
 declare type Direction = "decrement" | "increment";
 export declare const useStepperInput: (props: StepperInputProps, inputRef: MutableRefObject<HTMLInputElement | null>) => {
@@ -26,7 +26,7 @@ export declare const useStepperInput: (props: StepperInputProps, inputRef: Mutab
         tabIndex: number;
         'aria-activedescendant'?: string | undefined;
         'aria-atomic'?: (boolean | "true" | "false") | undefined;
-        'aria-autocomplete'?: "list" | "none" | "inline" | "both" | undefined;
+        'aria-autocomplete'?: "list" | "none" | "both" | "inline" | undefined;
         'aria-busy'?: (boolean | "true" | "false") | undefined;
         'aria-checked'?: boolean | "true" | "false" | "mixed" | undefined;
         'aria-colcount'?: number | undefined;
@@ -37,7 +37,7 @@ export declare const useStepperInput: (props: StepperInputProps, inputRef: Mutab
         'aria-describedby'?: string | undefined;
         'aria-details'?: string | undefined;
         'aria-disabled'?: (boolean | "true" | "false") | undefined;
-        'aria-dropeffect'?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
+        'aria-dropeffect'?: "link" | "none" | "copy" | "move" | "execute" | "popup" | undefined;
         'aria-errormessage'?: string | undefined;
         'aria-expanded'?: (boolean | "true" | "false") | undefined;
         'aria-flowto'?: string | undefined;

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

@@ -1,5 +1,4 @@
 import { KeyboardEvent, MouseEvent } from "react";
-import "./Tab.css";
 export declare const Tab: import("react").ForwardRefExoticComponent<Omit<import("react").HTMLAttributes<HTMLElement>, "onKeyUp" | "onClick"> & {
     ariaControls?: string | undefined;
     closeable?: boolean | undefined;

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

@@ -1,10 +1,8 @@
-/// <reference types="react" />
-import "./TabActivationIndicator.css";
 interface TabActivationIndicatorProps {
     hideThumb?: boolean;
     orientation?: "horizontal" | "vertical";
     disableAnimation?: boolean;
-    tabId?: string;
+    tabId?: string | null;
 }
 export declare const TabActivationIndicator: ({ hideThumb, orientation, tabId, }: TabActivationIndicatorProps) => JSX.Element;
 export {};

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

@@ -1,5 +1,4 @@
 import { HTMLAttributes } from "react";
-import "./TabPanel.css";
 export interface TabPanelProps extends HTMLAttributes<HTMLDivElement> {
     enableClose?: boolean;
     label: string;

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

@@ -1,5 +1,3 @@
-/// <reference types="react" />
 import { FocusAPI, TabstripProps } from "./TabsTypes";
-import "./Tabs.css";
 export declare type TabsProps = Omit<TabstripProps, "defaultSource">;
 export declare const Tabs: import("react").ForwardRefExoticComponent<TabsProps & import("react").RefAttributes<FocusAPI>>;

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

@@ -56,9 +56,9 @@ export interface TabstripProps extends HTMLAttributes<HTMLDivElement> {
     showActivationIndicator?: boolean;
     source?: TabsSource;
     /**
-     *  index value of Active Tab, used in controlled mode
+     *  index value of Active Tab, used in controlled mode. Set to `null` for no active tab.
      */
-    activeTabIndex?: number;
+    activeTabIndex?: number | null;
     /**
      * Set variant - defaults 'primary'
      */

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

@@ -1,5 +1,3 @@
 import React from "react";
 import { FocusAPI, TabstripProps } from "./TabsTypes";
-import "./Tabstrip.css";
-import "./ThemeTabstrip.css";
 export declare const Tabstrip: React.ForwardRefExoticComponent<TabstripProps & React.RefAttributes<FocusAPI>>;

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

@@ -1,6 +1,5 @@
 import { MutableRefObject } from "react";
 import { Rect } from "./dragDropTypes";
-import "./Draggable.css";
 export declare const Draggable: import("react").ForwardRefExoticComponent<{
     wrapperClassName: string;
     element: HTMLElement;

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

@@ -1,6 +1,4 @@
-/// <reference types="react" />
 import { Rect } from "./dragDropTypes";
-import "./DropIndicator.css";
 export declare const DropIndicator: import("react").ForwardRefExoticComponent<{
     className?: string | undefined;
     rect: Rect;

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

@@ -21,24 +21,24 @@ 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";
+    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";
+    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";
+    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";
+    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/useActivationIndicator.d.ts

@@ -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/useKeyboardNavigation.d.ts

@@ -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

@@ -4,11 +4,11 @@ export declare const useSelection: ({ defaultSelected, highlightedIdx, onSelecti
     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";
 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

@@ -5,7 +5,7 @@ import { ExitEditModeHandler, EditableItemHookResult } from "./useEditableItem";
 import { OverflowCollectionHookResult } from "../responsive";
 import { composableTabProps, navigationProps, TabDescriptor, TabElement } 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 { ReactNode } from "react";
+import { 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 { 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 { ReactNode, SyntheticEvent } from "react";
+declare type 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 { ComponentPropsWithoutRef, 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 { 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";
 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 { InputLegacyProps as InputProps } from "../input-legacy";
 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 { PillProps } from "@salt-ds/core";
+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";
 /**
  * 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