@teamturing/react-kit 2.12.0 → 2.14.0

package/dist/core/Overlay/index.d.ts

@@ -0,0 +1,18 @@
+import { HTMLAttributes, RefObject } from 'react';
+import { ResponsiveValue } from 'styled-system';
+type Props = {
+    isOpen?: boolean;
+    onDismiss?: () => void;
+    size?: ResponsiveValue<'m'>;
+    ignoreOutsideClickRefs?: RefObject<HTMLElement>[];
+} & HTMLAttributes<HTMLElement>;
+declare const _default: import("react").ForwardRefExoticComponent<{
+    isOpen?: boolean | undefined;
+    onDismiss?: (() => void) | undefined;
+    size?: ResponsiveValue<"m"> | undefined;
+    ignoreOutsideClickRefs?: RefObject<HTMLElement>[] | undefined;
+} & HTMLAttributes<HTMLElement> & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<HTMLDivElement>>;
+export default _default;
+export type { Props as OverlayProps };

package/dist/core/OverlayPopper/index.d.ts

@@ -0,0 +1,16 @@
+import { Placement } from '@floating-ui/react-dom';
+import { PropsWithChildren, ReactNode } from 'react';
+import { FocusTrapHookSettings } from '../../hook/useFocusTrap';
+import { FocusZoneHookSettings } from '../../hook/useFocusZone';
+type Props = {
+    renderOverlay: ({ isOpen, closeOverlay }: {
+        isOpen: boolean;
+        closeOverlay: () => void;
+    }) => ReactNode;
+    placement?: Placement;
+    focusZoneSettings?: Partial<FocusZoneHookSettings>;
+    focusTrapSettings?: Partial<FocusTrapHookSettings>;
+};
+declare const OverlayPopper: ({ children: propChildren, renderOverlay, placement, focusZoneSettings, focusTrapSettings, }: PropsWithChildren<Props>) => import("react/jsx-runtime").JSX.Element;
+export default OverlayPopper;
+export type { Props as OverlayPopperProps };

package/dist/core/Pagination/index.d.ts

@@ -0,0 +1,327 @@
+import { ReactNode } from 'react';
+import { ResponsiveValue } from 'styled-system';
+import { BetterSystemStyleObject, SxProp } from '../../utils/styled-system';
+import { UnstyledButtonProps } from '../_UnstyledButton';
+type PaginationTypeProps = {
+    type?: ResponsiveValue<'default' | 'simple'>;
+};
+type Props<T extends {
+    label: string;
+}> = {
+    pages: readonly T[];
+    currentPageIndex: number;
+    aroundPageCount?: number;
+    edgePageCount?: number;
+    renderPage?: (page: T, i: number) => ReactNode;
+    renderPageWrapper?: (children: ReactNode, page: T, i: number) => ReactNode;
+    renderPreviousPageDirection?: ({ previousPageDirectionProps, }: {
+        previousPageDirectionProps: PaginationPageDirectionProps;
+    }) => ReactNode;
+    renderNextPageDirection?: ({ nextPageDirectionProps, }: {
+        nextPageDirectionProps: PaginationPageDirectionProps;
+    }) => ReactNode;
+    renderTruncationIndicator?: () => ReactNode;
+    onPageClick?: (page: T, i: number) => void;
+    onPreviousClick?: (currentPageIndex: number) => void;
+    onNextClick?: (currentPageIndex: number) => void;
+} & PaginationTypeProps & SxProp;
+type PaginationPageProps = {
+    selected?: boolean;
+};
+type PaginationPageDirectionProps = Pick<UnstyledButtonProps, 'onClick' | 'disabled'>;
+declare const _default: (<T extends {
+    label: string;
+}>({ pages: propPages, currentPageIndex, aroundPageCount, edgePageCount, type, sx, onPageClick, onPreviousClick, onNextClick, renderPage, renderPageWrapper, renderPreviousPageDirection, renderNextPageDirection, renderTruncationIndicator, }: Props<T>) => import("react/jsx-runtime").JSX.Element) & {
+    Page: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<Omit<{
+        ref?: import("react").LegacyRef<HTMLButtonElement> | undefined;
+        key?: import("react").Key | null | undefined;
+    } & import("react").ButtonHTMLAttributes<HTMLButtonElement> & SxProp, "ref"> & {
+        ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
+    }, PaginationPageProps>>;
+    PageDirection: import("styled-components").IStyledComponent<"web", {
+        color?: string | undefined;
+        content?: string | undefined;
+        translate?: "yes" | "no" | undefined;
+        hidden?: boolean | undefined;
+        property?: string | undefined;
+        className?: string | undefined;
+        defaultChecked?: boolean | undefined;
+        defaultValue?: string | number | readonly string[] | undefined;
+        suppressContentEditableWarning?: boolean | undefined;
+        suppressHydrationWarning?: boolean | undefined;
+        accessKey?: string | undefined;
+        autoFocus?: boolean | undefined;
+        contentEditable?: "inherit" | (boolean | "false" | "true") | undefined;
+        contextMenu?: string | undefined;
+        dir?: string | undefined;
+        draggable?: (boolean | "false" | "true") | undefined;
+        id?: string | undefined;
+        lang?: string | undefined;
+        nonce?: string | undefined;
+        placeholder?: string | undefined;
+        slot?: string | undefined;
+        spellCheck?: (boolean | "false" | "true") | undefined;
+        style?: import("react").CSSProperties | undefined;
+        tabIndex?: number | undefined;
+        title?: string | undefined;
+        radioGroup?: string | undefined;
+        role?: import("react").AriaRole | undefined;
+        about?: string | undefined;
+        datatype?: string | undefined;
+        inlist?: any;
+        prefix?: string | undefined;
+        rel?: string | undefined;
+        resource?: string | undefined;
+        rev?: string | undefined;
+        typeof?: string | undefined;
+        vocab?: string | undefined;
+        autoCapitalize?: string | undefined;
+        autoCorrect?: string | undefined;
+        autoSave?: string | undefined;
+        itemProp?: string | undefined;
+        itemScope?: boolean | undefined;
+        itemType?: string | undefined;
+        itemID?: string | undefined;
+        itemRef?: string | undefined;
+        results?: number | undefined;
+        security?: string | undefined;
+        unselectable?: "on" | "off" | undefined;
+        inputMode?: "none" | "text" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
+        is?: string | undefined;
+        'aria-activedescendant'?: string | undefined;
+        'aria-atomic'?: (boolean | "false" | "true") | undefined;
+        'aria-autocomplete'?: "none" | "both" | "inline" | "list" | undefined;
+        'aria-braillelabel'?: string | undefined;
+        'aria-brailleroledescription'?: string | undefined;
+        'aria-busy'?: (boolean | "false" | "true") | undefined;
+        'aria-checked'?: boolean | "mixed" | "false" | "true" | undefined;
+        'aria-colcount'?: number | undefined;
+        'aria-colindex'?: number | undefined;
+        'aria-colindextext'?: string | undefined;
+        'aria-colspan'?: number | undefined;
+        'aria-controls'?: string | undefined;
+        'aria-current'?: boolean | "page" | "false" | "true" | "time" | "step" | "location" | "date" | undefined;
+        'aria-describedby'?: string | undefined;
+        'aria-description'?: string | undefined;
+        'aria-details'?: string | undefined;
+        'aria-disabled'?: (boolean | "false" | "true") | undefined;
+        'aria-dropeffect'?: "none" | "copy" | "move" | "link" | "execute" | "popup" | undefined;
+        'aria-errormessage'?: string | undefined;
+        'aria-expanded'?: (boolean | "false" | "true") | undefined;
+        'aria-flowto'?: string | undefined;
+        'aria-grabbed'?: (boolean | "false" | "true") | undefined;
+        'aria-haspopup'?: boolean | "grid" | "listbox" | "menu" | "false" | "true" | "dialog" | "tree" | undefined;
+        'aria-hidden'?: (boolean | "false" | "true") | undefined;
+        'aria-invalid'?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
+        'aria-keyshortcuts'?: string | undefined;
+        'aria-label'?: string | undefined;
+        'aria-labelledby'?: string | undefined;
+        'aria-level'?: number | undefined;
+        'aria-live'?: "off" | "assertive" | "polite" | undefined;
+        'aria-modal'?: (boolean | "false" | "true") | undefined;
+        'aria-multiline'?: (boolean | "false" | "true") | undefined;
+        'aria-multiselectable'?: (boolean | "false" | "true") | undefined;
+        'aria-orientation'?: "horizontal" | "vertical" | undefined;
+        'aria-owns'?: string | undefined;
+        'aria-placeholder'?: string | undefined;
+        'aria-posinset'?: number | undefined;
+        'aria-pressed'?: boolean | "mixed" | "false" | "true" | undefined;
+        'aria-readonly'?: (boolean | "false" | "true") | undefined;
+        'aria-relevant'?: "all" | "text" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
+        'aria-required'?: (boolean | "false" | "true") | undefined;
+        'aria-roledescription'?: string | undefined;
+        'aria-rowcount'?: number | undefined;
+        'aria-rowindex'?: number | undefined;
+        'aria-rowindextext'?: string | undefined;
+        'aria-rowspan'?: number | undefined;
+        'aria-selected'?: (boolean | "false" | "true") | undefined;
+        'aria-setsize'?: number | undefined;
+        'aria-sort'?: "none" | "ascending" | "descending" | "other" | undefined;
+        'aria-valuemax'?: number | undefined;
+        'aria-valuemin'?: number | undefined;
+        'aria-valuenow'?: number | undefined;
+        'aria-valuetext'?: string | undefined;
+        children?: ReactNode;
+        dangerouslySetInnerHTML?: {
+            __html: string | TrustedHTML;
+        } | undefined;
+        onCopy?: import("react").ClipboardEventHandler<HTMLButtonElement> | undefined;
+        onCopyCapture?: import("react").ClipboardEventHandler<HTMLButtonElement> | undefined;
+        onCut?: import("react").ClipboardEventHandler<HTMLButtonElement> | undefined;
+        onCutCapture?: import("react").ClipboardEventHandler<HTMLButtonElement> | undefined;
+        onPaste?: import("react").ClipboardEventHandler<HTMLButtonElement> | undefined;
+        onPasteCapture?: import("react").ClipboardEventHandler<HTMLButtonElement> | undefined;
+        onCompositionEnd?: import("react").CompositionEventHandler<HTMLButtonElement> | undefined;
+        onCompositionEndCapture?: import("react").CompositionEventHandler<HTMLButtonElement> | undefined;
+        onCompositionStart?: import("react").CompositionEventHandler<HTMLButtonElement> | undefined;
+        onCompositionStartCapture?: import("react").CompositionEventHandler<HTMLButtonElement> | undefined;
+        onCompositionUpdate?: import("react").CompositionEventHandler<HTMLButtonElement> | undefined;
+        onCompositionUpdateCapture?: import("react").CompositionEventHandler<HTMLButtonElement> | undefined;
+        onFocus?: import("react").FocusEventHandler<HTMLButtonElement> | undefined;
+        onFocusCapture?: import("react").FocusEventHandler<HTMLButtonElement> | undefined;
+        onBlur?: import("react").FocusEventHandler<HTMLButtonElement> | undefined;
+        onBlurCapture?: import("react").FocusEventHandler<HTMLButtonElement> | undefined;
+        onChange?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+        onChangeCapture?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+        onBeforeInput?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+        onBeforeInputCapture?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+        onInput?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+        onInputCapture?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+        onReset?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+        onResetCapture?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+        onSubmit?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+        onSubmitCapture?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+        onInvalid?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+        onInvalidCapture?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+        onLoad?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onLoadCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onError?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onErrorCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onKeyDown?: import("react").KeyboardEventHandler<HTMLButtonElement> | undefined;
+        onKeyDownCapture?: import("react").KeyboardEventHandler<HTMLButtonElement> | undefined;
+        onKeyPress?: import("react").KeyboardEventHandler<HTMLButtonElement> | undefined;
+        onKeyPressCapture?: import("react").KeyboardEventHandler<HTMLButtonElement> | undefined;
+        onKeyUp?: import("react").KeyboardEventHandler<HTMLButtonElement> | undefined;
+        onKeyUpCapture?: import("react").KeyboardEventHandler<HTMLButtonElement> | undefined;
+        onAbort?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onAbortCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onCanPlay?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onCanPlayCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onCanPlayThrough?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onCanPlayThroughCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onDurationChange?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onDurationChangeCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onEmptied?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onEmptiedCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onEncrypted?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onEncryptedCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onEnded?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onEndedCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onLoadedData?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onLoadedDataCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onLoadedMetadata?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onLoadedMetadataCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onLoadStart?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onLoadStartCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onPause?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onPauseCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onPlay?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onPlayCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onPlaying?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onPlayingCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onProgress?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onProgressCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onRateChange?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onRateChangeCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onResize?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onResizeCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onSeeked?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onSeekedCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onSeeking?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onSeekingCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onStalled?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onStalledCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onSuspend?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onSuspendCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onTimeUpdate?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onTimeUpdateCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onVolumeChange?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onVolumeChangeCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onWaiting?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onWaitingCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onAuxClick?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+        onAuxClickCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+        onClick?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+        onClickCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+        onContextMenu?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+        onContextMenuCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+        onDoubleClick?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+        onDoubleClickCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+        onDrag?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+        onDragCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+        onDragEnd?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+        onDragEndCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+        onDragEnter?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+        onDragEnterCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+        onDragExit?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+        onDragExitCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+        onDragLeave?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+        onDragLeaveCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+        onDragOver?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+        onDragOverCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+        onDragStart?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+        onDragStartCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+        onDrop?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+        onDropCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+        onMouseDown?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+        onMouseDownCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+        onMouseEnter?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+        onMouseLeave?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+        onMouseMove?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+        onMouseMoveCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+        onMouseOut?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+        onMouseOutCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+        onMouseOver?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+        onMouseOverCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+        onMouseUp?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+        onMouseUpCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+        onSelect?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onSelectCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+        onTouchCancel?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
+        onTouchCancelCapture?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
+        onTouchEnd?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
+        onTouchEndCapture?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
+        onTouchMove?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
+        onTouchMoveCapture?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
+        onTouchStart?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
+        onTouchStartCapture?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
+        onPointerDown?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+        onPointerDownCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+        onPointerMove?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+        onPointerMoveCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+        onPointerUp?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+        onPointerUpCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+        onPointerCancel?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+        onPointerCancelCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+        onPointerEnter?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+        onPointerEnterCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+        onPointerLeave?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+        onPointerLeaveCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+        onPointerOver?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+        onPointerOverCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+        onPointerOut?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+        onPointerOutCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+        onGotPointerCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+        onGotPointerCaptureCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+        onLostPointerCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+        onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+        onScroll?: import("react").UIEventHandler<HTMLButtonElement> | undefined;
+        onScrollCapture?: import("react").UIEventHandler<HTMLButtonElement> | undefined;
+        onWheel?: import("react").WheelEventHandler<HTMLButtonElement> | undefined;
+        onWheelCapture?: import("react").WheelEventHandler<HTMLButtonElement> | undefined;
+        onAnimationStart?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
+        onAnimationStartCapture?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
+        onAnimationEnd?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
+        onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
+        onAnimationIteration?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
+        onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
+        onTransitionEnd?: import("react").TransitionEventHandler<HTMLButtonElement> | undefined;
+        onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLButtonElement> | undefined;
+        sx?: BetterSystemStyleObject | undefined;
+        key?: import("react").Key | null | undefined;
+        form?: string | undefined;
+        name?: string | undefined;
+        type?: "button" | "reset" | "submit" | undefined;
+        disabled?: boolean | undefined;
+        formAction?: string | undefined;
+        formEncType?: string | undefined;
+        formMethod?: string | undefined;
+        formNoValidate?: boolean | undefined;
+        formTarget?: string | undefined;
+        value?: string | number | readonly string[] | undefined;
+        ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
+    }>;
+    TruncationIndicator: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, SxProp>>;
+};
+export default _default;
+export type { Props as PaginationProps, PaginationPageProps, PaginationPageDirectionProps };

package/dist/core/Pill/index.d.ts

@@ -0,0 +1,47 @@
+import { ElementType, ReactNode } from 'react';
+import { ResponsiveValue } from 'styled-system';
+import { SxProp } from '../../utils/styled-system';
+type Props = {
+    text?: string;
+    /**
+     * 크기를 정의합니다.
+     * 반응형 디자인이 적용됩니다.
+     */
+    size?: ResponsiveValue<'l' | 'm' | 's'>;
+    /**
+     * 색을 정의합니다.
+     * hover, active, focused, disabled, loading 등의 모든 상황에 관여합니다.
+     */
+    variant?: ResponsiveValue<'secondary'>;
+    /**
+     * text 앞에 보여질 시각적 요소를 정의합니다. Icon, Image 등이 될 수 있습니다.
+     */
+    leadingVisual?: ElementType | ReactNode;
+    /**
+     * 없앨 수 있을 때 onRemove를 넘기면 X 버튼이 trailingVisual 자리에 생깁니다.
+     */
+    onRemove?: () => void;
+} & SxProp;
+declare const _default: import("react").ForwardRefExoticComponent<{
+    text?: string | undefined;
+    /**
+     * 크기를 정의합니다.
+     * 반응형 디자인이 적용됩니다.
+     */
+    size?: ResponsiveValue<"m" | "s" | "l"> | undefined;
+    /**
+     * 색을 정의합니다.
+     * hover, active, focused, disabled, loading 등의 모든 상황에 관여합니다.
+     */
+    variant?: ResponsiveValue<"secondary"> | undefined;
+    /**
+     * text 앞에 보여질 시각적 요소를 정의합니다. Icon, Image 등이 될 수 있습니다.
+     */
+    leadingVisual?: string | number | boolean | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | Iterable<ReactNode> | import("react").ReactPortal | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | null | undefined;
+    /**
+     * 없앨 수 있을 때 onRemove를 넘기면 X 버튼이 trailingVisual 자리에 생깁니다.
+     */
+    onRemove?: (() => void) | undefined;
+} & SxProp & import("react").RefAttributes<HTMLSpanElement>>;
+export default _default;
+export type { Props as PillProps };

package/dist/hook/useFocusTrap.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+interface FocusTrapHookSettings {
+    containerRef?: React.RefObject<HTMLElement>;
+    initialFocusRef?: React.RefObject<HTMLElement>;
+    disabled?: boolean;
+    restoreFocusOnCleanUp?: boolean;
+}
+declare const useFocusTrap: (settings?: FocusTrapHookSettings, dependencies?: React.DependencyList) => {
+    containerRef: React.RefObject<HTMLElement>;
+    initialFocusRef: React.RefObject<HTMLElement>;
+};
+export default useFocusTrap;
+export type { FocusTrapHookSettings };

package/dist/hook/useFocusZone.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+import type { FocusZoneSettings } from '@primer/behaviors';
+export { FocusKeys } from '@primer/behaviors';
+export type { Direction } from '@primer/behaviors';
+interface FocusZoneHookSettings extends Omit<FocusZoneSettings, 'activeDescendantControl'> {
+    containerRef?: React.RefObject<HTMLElement>;
+    activeDescendantFocus?: boolean | React.RefObject<HTMLElement>;
+    disabled?: boolean;
+}
+declare const useFocusZone: (settings?: FocusZoneHookSettings, dependencies?: import("react").DependencyList) => {
+    containerRef: React.RefObject<HTMLElement>;
+    activeDescendantControlRef: React.RefObject<HTMLElement>;
+};
+export default useFocusZone;
+export type { FocusZoneHookSettings };

package/dist/index.d.ts

@@ -27,6 +27,14 @@ export type { ImageProps } from './core/Image';
 export { default as ItemList } from './core/ItemList';
 export type { ItemListProps } from './core/ItemList';
 export { default as MotionView } from './core/MotionView';
+export { default as Overlay } from './core/Overlay';
+export type { OverlayProps } from './core/Overlay';
+export { default as OverlayPopper } from './core/OverlayPopper';
+export type { OverlayPopperProps } from './core/OverlayPopper';
+export { default as Pagination } from './core/Pagination';
+export type { PaginationProps, PaginationPageProps, PaginationPageDirectionProps } from './core/Pagination';
+export { default as Pill } from './core/Pill';
+export type { PillProps } from './core/Pill';
 export { default as Space } from './core/Space';
 export type { SpaceProps } from './core/Space';
 export { default as Spinner } from './core/Spinner';
@@ -60,6 +68,10 @@ export { default as EnigmaUI } from './enigma/EnigmaUI';
  * hooks
  */
 export { default as useDevice } from './hook/useDevice';
+export { default as useDialogHandler } from './hook/useDialogHandler';
+export { default as useFocusTrap } from './hook/useFocusTrap';
+export { default as useFocusZone } from './hook/useFocusZone';
+export { default as useMediaQuery } from './hook/useMediaQuery';
 export { default as useOutsideClick } from './hook/useOutsideClick';
 export { default as useProvidedOrCreatedRef } from './hook/useProvidedOrCreatedRef';
 export { default as useResize } from './hook/useResize';