@ringcentral/spring-ui 1.7.0

package/src/StepLabel/StepLabel.classes.d.ts

@@ -0,0 +1,10 @@
+import type { CamelCase } from 'type-fest';
+import type { StepperOrientation } from '../Stepper/Stepper.type';
+declare type StepLabelSlot = 'label' | 'icon-container' | 'label-container';
+export declare type BaseStepLabelClassesKey = 'root' | StepperOrientation | 'current' | 'error' | 'current-label' | 'error-label' | 'error-label-container' | StepLabelSlot | `${StepperOrientation}-${StepLabelSlot}`;
+export declare type StepLabelClassesKey = CamelCase<BaseStepLabelClassesKey>;
+export declare type StepLabelClasses = {
+    name: 'step-label';
+    classes: BaseStepLabelClassesKey;
+};
+export {};

package/src/StepLabel/StepLabel.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { StepLabelProps } from './StepLabel.type';
+import stepLabelStyle from './styles/StepLabel.css';
+declare const StepLabel: import("react").ForwardRefExoticComponent<Pick<StepLabelProps, "error" | "children" | "onKeyDown" | "onKeyUp" | "onClick" | "aria-hidden" | "dir" | "slot" | "style" | "title" | "aria-live" | "aria-atomic" | "role" | "classes" | "className" | "accessKey" | "draggable" | "hidden" | "lang" | "translate" | "id" | "prefix" | "contentEditable" | "inputMode" | "tabIndex" | "key" | "defaultChecked" | "defaultValue" | "placeholder" | "onFocus" | "onBlur" | "onMouseEnter" | "onMouseLeave" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "contextMenu" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "is" | "aria-activedescendant" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | `data-${string}` | "labelProps" | "icon" | "optional" | "StepIconComponent" | "StepIconProps"> & import("react").RefAttributes<HTMLSpanElement>>;
+export { StepLabel, stepLabelStyle };

package/src/StepLabel/StepLabel.type.d.ts

@@ -0,0 +1,36 @@
+/// <reference types="react" />
+import { StandardProps } from '@ringcentral/spring-base';
+import { StepIconProps } from '../StepIcon';
+import { StepLabelClassesKey } from './StepLabel.classes';
+export declare type StepLabelProps = StandardProps<{
+    /**
+     * In most cases will simply be a string containing a title for the label.
+     */
+    children?: React.ReactNode;
+    /**
+     * If `true`, the step is marked as failed.
+     * @default false
+     */
+    error?: boolean;
+    /**
+     * Override the default label of the step icon.
+     */
+    icon?: React.ReactNode;
+    /**
+     * The optional node to display.
+     */
+    optional?: React.ReactNode;
+    /**
+     * Props applied to the label element.
+     * @default {}
+     */
+    labelProps?: React.HTMLProps<HTMLSpanElement>;
+    /**
+     * The component to render in place of the `StepIcon`
+     */
+    StepIconComponent?: React.ElementType<StepIconProps>;
+    /**
+     * Props applied to the `StepIcon` element.
+     */
+    StepIconProps?: Partial<StepIconProps>;
+}, StepLabelClassesKey, 'span'>;

package/src/StepLabel/index.d.ts

@@ -0,0 +1,3 @@
+export * from './StepLabel.classes';
+export * from './StepLabel';
+export * from './StepLabel.type';

package/src/Stepper/Stepper.classes.d.ts

@@ -0,0 +1,7 @@
+import type { CamelCase } from 'type-fest';
+export declare type BaseStepperClassesKey = 'root' | 'horizontal' | 'vertical' | 'fixed-step-width';
+export declare type StepperClassesKey = CamelCase<BaseStepperClassesKey>;
+export declare type StepperClasses = {
+    name: 'stepper';
+    classes: BaseStepperClassesKey;
+};

package/src/Stepper/Stepper.d.ts

@@ -0,0 +1,4 @@
+import { StepperComponent } from './Stepper.type';
+import stepperStyle from './styles/Stepper.css';
+declare const Stepper: StepperComponent;
+export { Stepper, stepperStyle };

package/src/Stepper/Stepper.type.d.ts

@@ -0,0 +1,47 @@
+import { WithClassesProps, OverridableComponent, OverridableProps } from '@ringcentral/spring-base';
+import { ElementType } from 'react';
+import { StepperClassesKey } from './Stepper.classes';
+export declare type StepperOrientation = 'horizontal' | 'vertical';
+declare type DefaultElementType = 'ol';
+declare type ExtendElementType = ElementType;
+declare type BaseStepperProps = WithClassesProps<{
+    /**
+     * Set the active step (zero based index).
+     * Set to -1 to disable all the steps.
+     * @default 0
+     */
+    activeStep?: number;
+    /**
+     * Two or more `<Step />` components.
+     */
+    children?: React.ReactNode;
+    /**
+     * An element to be placed between each step.
+     * @default <StepConnector />
+     */
+    connector?: React.ReactElement<any, any> | null;
+    /**
+     * If set the `Stepper` will not assist in controlling steps for linear flow.
+     * Root component will be a `ul` element if set to `true` and `ol` if `false`.
+     * @default false
+     */
+    nonLinear?: boolean;
+    /**
+     * The component orientation (layout flow direction).
+     * @default 'horizontal'
+     */
+    orientation?: StepperOrientation;
+    /**
+     * If set to true, each Step will have the same width, collectively taking up the full width of the container.
+     * If set to false, each Step will have its own width based on its content, with even gaps between each Step.
+     * Only works when `orientation` is 'horizontal'.
+     * @default true
+     */
+    fixedStepWidth?: boolean;
+}, StepperClassesKey>;
+export declare type StepperProps<T extends ExtendElementType = DefaultElementType> = OverridableProps<BaseStepperProps, T>;
+export declare type StepperComponent = OverridableComponent<{
+    props: BaseStepperProps;
+    defaultComponent: DefaultElementType;
+}>;
+export {};

package/src/Stepper/StepperContext.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { StepperOrientation } from './Stepper.type';
+export declare type StepperContextValue = {
+    activeStep?: number;
+    connector?: React.ReactNode;
+    nonLinear?: boolean;
+    orientation?: StepperOrientation;
+    fixedStepWidth?: boolean;
+};
+export declare const StepperContext: import("react").Context<StepperContextValue>;
+export declare const useStepperContext: () => StepperContextValue;

package/src/Stepper/index.d.ts

@@ -0,0 +1,4 @@
+export * from './Stepper.classes';
+export * from './Stepper';
+export * from './Stepper.type';
+export * from './StepperContext';

package/src/SubMenu/PopperMenu.classes.d.ts

@@ -0,0 +1,7 @@
+import type { CamelCase } from 'type-fest';
+export declare type BasePopperMenuClassesKey = 'root' | 'paper';
+export declare type PopperMenuClassesKey = CamelCase<BasePopperMenuClassesKey>;
+export declare type PopperMenuClasses = {
+    name: 'popper-menu';
+    classes: BasePopperMenuClassesKey;
+};

package/src/SubMenu/PopperMenu.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { PopperMenuProps } from './PopperMenu.type';
+import popperMenuStyle from './styles/PopperMenu.css';
+declare const PopperMenu: import("react").ForwardRefExoticComponent<Pick<PopperMenuProps, "children" | "onKeyDown" | "onKeyUp" | "onClick" | "aria-hidden" | "dir" | "slot" | "style" | "title" | "aria-live" | "aria-atomic" | "role" | "classes" | "className" | "accessKey" | "draggable" | "hidden" | "lang" | "translate" | "id" | "prefix" | "contentEditable" | "inputMode" | "tabIndex" | "key" | "defaultChecked" | "defaultValue" | "placeholder" | "container" | "transform" | "padding" | "onFocus" | "onBlur" | "onMouseEnter" | "onMouseLeave" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "contextMenu" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "is" | "aria-activedescendant" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | `data-${string}` | "placement" | "open" | "offset" | "disablePortal" | "platform" | "whileElementsMounted" | "elements" | "anchorEl" | "middlewares" | "arrowHeight" | "arrowPadding" | "actions" | "autoUpdate" | "matchAnchorWidth"> & import("react").RefAttributes<HTMLDivElement>>;
+export { PopperMenu, popperMenuStyle };

package/src/SubMenu/PopperMenu.type.d.ts

@@ -0,0 +1,4 @@
+import { StandardProps } from '@ringcentral/spring-base';
+import { Popper } from '../Popper';
+import { PopperMenuClassesKey } from './PopperMenu.classes';
+export declare type PopperMenuProps = StandardProps<{}, PopperMenuClassesKey, typeof Popper>;

package/src/SubMenu/SubMenu.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { SubMenuProps } from './SubMenu.type';
+declare const SubMenu: import("react").ForwardRefExoticComponent<Pick<SubMenuProps, "children" | "onKeyDown" | "onKeyUp" | "onClick" | "disabled" | "aria-hidden" | "dir" | "slot" | "style" | "title" | "aria-live" | "aria-atomic" | "role" | "classes" | "focused" | "selected" | "className" | "accessKey" | "draggable" | "hidden" | "lang" | "translate" | "id" | "prefix" | "contentEditable" | "inputMode" | "tabIndex" | "key" | "defaultChecked" | "defaultValue" | "placeholder" | "onFocus" | "onBlur" | "onMouseEnter" | "onMouseLeave" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "contextMenu" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "is" | "aria-activedescendant" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | `data-${string}` | "autoFocus" | "highlighted" | "itemContent" | "disableFocusOnHover" | "autoClose"> & import("react").RefAttributes<HTMLDivElement>>;
+export { SubMenu };

package/src/SubMenu/SubMenu.type.d.ts

@@ -0,0 +1,6 @@
+import { ReactNode } from 'react';
+import { MenuItemProps } from '../MenuItem';
+export declare type SubMenuProps = {
+    itemContent?: MenuItemProps['children'];
+    children?: ReactNode;
+} & Omit<MenuItemProps, 'children'>;

package/src/SubMenu/index.d.ts

@@ -0,0 +1,5 @@
+export * from './PopperMenu.classes';
+export * from './PopperMenu';
+export * from './PopperMenu.type';
+export * from './SubMenu';
+export * from './SubMenu.type';

package/src/SwipeableDrawer/SwipeableDrawer.classes.d.ts

@@ -0,0 +1,7 @@
+import type { CamelCase } from 'type-fest';
+export declare type BaseSwipeableDrawerClassesKey = 'header-drag' | 'header-with-content';
+export declare type SwipeableDrawerClassesKey = CamelCase<BaseSwipeableDrawerClassesKey>;
+export declare type SwipeableDrawerClasses = {
+    name: 'swipeable-drawer';
+    classes: BaseSwipeableDrawerClassesKey;
+};

package/src/SwipeableDrawer/SwipeableDrawer.d.ts

@@ -0,0 +1,31 @@
+/// <reference types="react" />
+import swipeableDrawerStyles from './styles/SwipeableDrawer.css';
+import type { SwipeableDrawerProps } from './SwipeableDrawer.types';
+/**
+ * SwipeableDrawer Component - Gesture-enhanced drawer with swipe support
+ *
+ * Wraps the base Drawer component and adds touch/mouse gesture support for resizing and closing.
+ * Perfect for mobile bottom sheets and interactive panels.
+ *
+ * @example
+ * ```tsx
+ * bottom sheet with gestures
+ * <SwipeableDrawer
+ *   open={open}
+ *   onClose={onClose}
+ *   anchor="bottom"
+ *   gestureControlsProps={{
+ *     snapPoints: ({ minHeight, maxHeight }) => [
+ *       minHeight,        // Content height
+ *       maxHeight * 0.6,  // 60% of screen
+ *       maxHeight         // Full screen
+ *     ],
+ *     initialSnap: 0      // Start at content height
+ *   }}
+ * >
+ *   <Content />
+ * </SwipeableDrawer>
+ * ```
+ */
+declare const SwipeableDrawer: import("react").ForwardRefExoticComponent<Pick<SwipeableDrawerProps, "children" | "onKeyDown" | "onKeyUp" | "onClick" | "aria-hidden" | "dir" | "footer" | "header" | "slot" | "style" | "title" | "aria-live" | "aria-atomic" | "role" | "classes" | "anchor" | "className" | "accessKey" | "draggable" | "hidden" | "lang" | "translate" | "id" | "prefix" | "contentEditable" | "inputMode" | "tabIndex" | "key" | "defaultChecked" | "defaultValue" | "placeholder" | "container" | "isEnabled" | "onFocus" | "onBlur" | "onMouseEnter" | "onMouseLeave" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "contextMenu" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "is" | "aria-activedescendant" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | `data-${string}` | "variant" | "open" | "disableRestoreFocus" | "disableAutoFocus" | "disableEnforceFocus" | "hideBackdrop" | "disableBackdropClick" | "onBackdropClick" | "disableEscapeKeyDown" | "onEscapeKeyDown" | "onClose" | "backdropProps" | "blocking" | "motionProps" | "disablePortal" | "onExitComplete" | "disableBackdropAnimation" | "disableScrollLock" | "bodyProps" | "measurementRefs" | "headerProps" | "gestureControlsProps"> & import("react").RefAttributes<HTMLDivElement>>;
+export { SwipeableDrawer, swipeableDrawerStyles };

package/src/SwipeableDrawer/SwipeableDrawer.types.d.ts

@@ -0,0 +1,82 @@
+/// <reference types="react" />
+import { DrawerProps, DrawerCloseReason } from '../Drawer';
+import { UseDrawerGesturesOptions } from './hooks/useDrawerGestures';
+export declare type SwipeableDrawerAction = {
+    /**
+     * Programmatically snap the drawer to a specific height or snap point.
+     *
+     * **Important**: Pixel values must exist in the snap points array, otherwise
+     * the drawer will snap to the closest available snap point instead.
+     *
+     * @param numberOrCallback - Can be:
+     *   - **Index**: Small integer (0, 1, 2) to select snap point by index
+     *   - **Pixels**: Absolute pixel value (300, 500) - must be in snap points array
+     *   - **Function**: Dynamic calculation based on current drawer state
+     *
+     * @example
+     * ```tsx
+     * // Setup snap points first
+     * snapPoints: ({ minHeight, maxHeight }) => [
+     *   minHeight,  // 200px
+     *   500,        // 500px
+     *   maxHeight   // 800px
+     * ]
+     *
+     * // Snap to first snap point (index-based) ✅
+     * drawerRef.current?.snapTo(0);
+     *
+     * // Snap to exact pixel height (must be in array) ✅
+     * drawerRef.current?.snapTo(500); // Works because 500 is in snap points
+     *
+     * // This would snap to closest point (200px or 800px) ❌
+     * drawerRef.current?.snapTo(600); // 600 not in array!
+     *
+     * // Dynamic: Calculate and ensure it's valid ✅
+     * drawerRef.current?.snapTo(({ maxHeight }) => maxHeight * 0.5);
+     *
+     * // Safe: Use index to avoid pixel matching issues ✅
+     * drawerRef.current?.snapTo(({ snapPoints }) => snapPoints[1]);
+     * ```
+     */
+    snapTo: (numberOrCallback: number | ((params: {
+        snapPoints: number[];
+        minHeight: number;
+        maxHeight: number;
+    }) => number)) => void;
+};
+export declare type SwipeableDrawerCloseReason = DrawerCloseReason | 'gestureSwipe';
+export interface SwipeableDrawerProps extends DrawerProps {
+    /**
+     * Callback fired when the drawer is closed.
+     *
+     * @param event - The event source of the callback
+     * @param reason - The reason the drawer was closed
+     */
+    onClose?: (event: React.SyntheticEvent<HTMLElement>, reason: SwipeableDrawerCloseReason) => void;
+    /**
+     * Configuration for gesture controls.
+     *
+     * @example
+     * ```tsx
+     * <SwipeableDrawer
+     *   gestureControlsProps={{
+     *     // Define where drawer can snap to
+     *     snapPoints: ({ minHeight, maxHeight }) => [
+     *       minHeight,        // Content height (minimum)
+     *       maxHeight * 0.5,  // 50% of screen
+     *       maxHeight         // Full screen
+     *     ],
+     *
+     *     // Start at first snap point (content height)
+     *     initialSnap: 0,
+     *
+     *     // Get reference to drawer actions
+     *     action: (actions) => {
+     *       drawerActionsRef.current = actions;
+     *     }
+     *   }}
+     * >
+     * ```
+     */
+    gestureControlsProps?: Partial<Pick<UseDrawerGesturesOptions, 'snapPoints' | 'initialSnap' | 'action'>>;
+}

package/src/SwipeableDrawer/hooks/index.d.ts

@@ -0,0 +1,5 @@
+export { useDrawerGestures } from './useDrawerGestures';
+export { useReady } from './useReady';
+export { useElementSizeObserver } from './useElementSizeObserver';
+export { useDimensions } from './useDimensions';
+export { useSnapPoints } from './useSnapPoints';

package/src/SwipeableDrawer/hooks/useDimensions.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import { useReady } from './useReady';
+export declare function useDimensions({ contentRef, footerEnabled, footerRef, headerEnabled, headerRef, registerReady, resizeSourceRef, open, }: {
+    contentRef: React.RefObject<Element>;
+    footerEnabled: boolean;
+    footerRef: React.RefObject<Element>;
+    headerEnabled: boolean;
+    headerRef: React.RefObject<Element>;
+    registerReady: ReturnType<typeof useReady>['registerReady'];
+    resizeSourceRef?: React.MutableRefObject<'window' | 'element'>;
+    open: boolean;
+}): {
+    maxHeight: number;
+    minHeight: number;
+    headerHeight: number;
+    footerHeight: number;
+};

package/src/SwipeableDrawer/hooks/useDrawerGestures.d.ts

@@ -0,0 +1,151 @@
+/// <reference types="react" />
+import { useDrag } from '@use-gesture/react';
+import type { DrawerAnchor } from '../../Drawer/Drawer.type';
+import type { SwipeableDrawerAction } from '../SwipeableDrawer.types';
+import { type SnapPointsFunction } from './useSnapPoints';
+export interface UseDrawerGesturesOptions {
+    /**
+     * Optional ref to receive drawer action methods.
+     * Provides programmatic control over drawer state.
+     *
+     *
+     * @example
+     * ```tsx
+     * const drawerRef = useRef<DrawerAction>(null);
+     *
+     * <Drawer
+     *   gestureControlsProps={{ action: drawerRef }}
+     * >
+     *
+     * // Later: programmatically snap to position
+     * drawerRef.current?.snapTo(1); // Snap to second snap point
+     * ```
+     */
+    action?: React.RefObject<SwipeableDrawerAction>;
+    /**
+     * Function that returns snap points where the drawer can rest.
+     * Called with current drawer dimensions to calculate positions.
+     *
+     * **All snap points are in pixels.** Use the provided dimensions to calculate percentages:
+     * - `maxHeight * 0.5` = 50% of viewport (half available height)
+     * - `maxHeight * 0.9` = 90% of viewport
+     * - `400` = 400 pixels absolute
+     * - `minHeight` = content height (auto-calculated)
+     *
+     * @param props Current drawer dimensions and measurements
+     * @returns Array of snap points or single snap point
+     *
+     * @example
+     * ```tsx
+     * <Drawer
+     *   gestureControlsProps={{
+     *     snapPoints: ({ minHeight, maxHeight }) => [
+     *       minHeight,        // Content height (minimum)
+     *       maxHeight * 0.6,  // 60% of screen
+     *       maxHeight         // Full screen
+     *     ]
+     *   }}
+     * >
+     * ```
+     */
+    snapPoints?: SnapPointsFunction;
+    /**
+     * Initial snap point when drawer opens.
+     * **Options**:
+     * - **Number**: Index (0, 1, 2) or pixel value (300, 500)
+     * - **Function**: Dynamic calculation based on drawer state
+     *
+     * @example
+     * ```tsx
+     * <Drawer
+     *   gestureControlsProps={{
+     *     // Start at first snap point (index-based)
+     *     initialSnap: 0,
+     *
+     *     // Start at specific pixel height
+     *     initialSnap: 400,
+     *
+     *     // Dynamic: Start at 50% of viewport
+     *     initialSnap: ({ maxHeight }) => maxHeight * 0.5,
+     *
+     *     // Dynamic: Remember last position or use content height
+     *     initialSnap: ({ snapPoints, lastSnap, minHeight }) => {
+     *       return lastSnap ?? minHeight; // Remember or content height
+     *     }
+     *   }}
+     * >
+     * ```
+     */
+    initialSnap?: number | ((params: {
+        snapPoints: number[];
+        minHeight: number;
+        maxHeight: number;
+        headerHeight: number;
+        footerHeight: number;
+        lastSnap: number | null;
+    }) => number);
+    /**
+     * @internal
+     * Side from which the drawer appears.
+     * @default bottom
+     */
+    anchor: DrawerAnchor;
+    /**
+     * @internal
+     * Current open state of the drawer.
+     * Passed from `open` prop for gesture behavior.
+     */
+    open: boolean;
+    /**
+     * @internal
+     * Callback fired when drawer is closed via gesture.
+     * Connected to main `onClose` prop.
+     */
+    onClose: (event: React.SyntheticEvent<HTMLElement>, reason: 'gestureSwipe') => void;
+    /**
+     * @internal
+     * Ref to the main content element of the drawer.
+     * Used for measuring content height and scroll behavior.
+     */
+    contentRef: React.RefObject<HTMLElement>;
+    /**
+     * @internal
+     * Ref to the header element of the drawer.
+     * Used for measuring header height and as drag handle.
+     */
+    headerRef?: React.RefObject<HTMLElement>;
+    /**
+     * @internal
+     * Ref to the footer element of the drawer.
+     * Used for measuring footer height in calculations.
+     */
+    footerRef?: React.RefObject<HTMLElement>;
+    /**
+     * @internal
+     * Automatically derived from presence of header prop.
+     * Used internally to optimize measurements and gesture binding.
+     */
+    headerEnabled: boolean;
+    /**
+     * @internal
+     * Automatically derived from presence of footer prop.
+     * Used internally to optimize measurements and height calculations.
+     */
+    footerEnabled: boolean;
+}
+export interface UseDrawerGesturesReturn {
+    bind: ReturnType<typeof useDrag>;
+    motionProps: {
+        style?: Record<string, any>;
+    };
+    isGestureEnabled: boolean;
+    contentRef: React.RefObject<HTMLElement>;
+    headerRef?: React.RefObject<HTMLElement>;
+    footerRef?: React.RefObject<HTMLElement>;
+    snapTo: (numberOrCallback: number | ((params: {
+        snapPoints: number[];
+        minHeight: number;
+        maxHeight: number;
+    }) => number)) => void;
+}
+export declare function useDrawerGestures(options: UseDrawerGesturesOptions): UseDrawerGesturesReturn;

package/src/SwipeableDrawer/hooks/useElementSizeObserver.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+/**
+ * Hook for determining the size of an element using the Resize Observer API.
+ *
+ * @param ref - A React ref to an element
+ */
+export declare function useElementSizeObserver(ref: React.RefObject<Element>, { enabled, resizeSourceRef, }: {
+    enabled: boolean;
+    resizeSourceRef?: React.MutableRefObject<'window' | 'element'>;
+}): number;

package/src/SwipeableDrawer/hooks/useReady.d.ts

@@ -0,0 +1,4 @@
+export declare function useReady(): {
+    ready: boolean;
+    registerReady: (key: string) => () => void;
+};