@croquiscom/pds 0.45.0 → 0.45.2

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # @croquiscom/pds
 
+## 0.45.2
+
+### Patch Changes
+
+- db1cbff: Modal Dismiss 이벤트 중첩 제어 추가, floating-ui 디펜던시 업데이트
+
+  ## BreakPoint
+
+  Notice Modal Event 방식이 다음과 같이 변경되었습니다.
+
+  - onClose 이벤트가 제거되었습니다.
+  - onCancel 이벤트가 추가되었습니다.
+    - 닫기 버튼 클릭시
+    - overlay 클릭시
+    - esc keyboard 이벤트 발생시
+
+## 0.45.1
+
+### Patch Changes
+
+- aec1e60: fix: FileUpload fileList prop이 undefined인 경우 대응
+- fc9c93c: Popover 컴포넌트 title, description, closeButton 내부 제공 추가, trigger click 이벤트 stopPropagation 추가
+
 ## 0.45.0
 
 ### Minor Changes

package/dist/components/bottom-sheet/BottomSheet.d.ts

@@ -14,10 +14,15 @@ export interface BottomSheetProps {
     subTitle?: ReactNode;
     content?: ReactNode | BottomSheetContentWithCloseAction;
     /**
-     * 오버레이 클릭 닫힘 사용 여부
+     * outside 영역 클릭시 닫힘 사용 여부
      * @default true
      */
     canClickOutside?: boolean;
+    /**
+     * escapeKey 키이벤트 닫힘 사용 여부
+     * @default true
+     */
+    canCloseEscapeKey?: boolean;
     /**
      * 드래그 닫힘 사용 여부
      * @default true
@@ -25,5 +30,5 @@ export interface BottomSheetProps {
     canDragClose?: boolean;
     onClose?: () => void;
 }
-export declare const BottomSheet: ({ className, zIndex, opened: openProp, canClickOutside, canDragClose, title, subTitle, content, onClose, }: BottomSheetProps) => JSX.Element;
+export declare const BottomSheet: ({ className, zIndex, opened: openProp, canClickOutside, canCloseEscapeKey, canDragClose, title, subTitle, content, onClose, }: BottomSheetProps) => JSX.Element;
 export {};

package/dist/components/bottom-sheet/BottomSheet.stories.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { ComponentStory, ComponentMeta } from '@storybook/react';
 import { BottomSheet } from './BottomSheet';
-declare const _default: ComponentMeta<({ className, zIndex, opened: openProp, canClickOutside, canDragClose, title, subTitle, content, onClose, }: import("./BottomSheet").BottomSheetProps) => JSX.Element>;
+declare const _default: ComponentMeta<({ className, zIndex, opened: openProp, canClickOutside, canCloseEscapeKey, canDragClose, title, subTitle, content, onClose, }: import("./BottomSheet").BottomSheetProps) => JSX.Element>;
 export default _default;
 export declare const Base: any;
 export declare const MaxHeight: ComponentStory<typeof BottomSheet>;

package/dist/components/context/FloatingTree.d.ts

@@ -0,0 +1,2 @@
+import React, { ComponentType } from 'react';
+export declare const FloatingTreeContext: <T>(Component: React.ComponentType<T>) => React.ComponentType<T>;

package/dist/components/context/index.d.ts

@@ -0,0 +1 @@
+export * from './FloatingTree';

package/dist/components/date-picker/DatePicker.d.ts

@@ -24,11 +24,6 @@ export interface DatePickerBaseProps {
     opened?: boolean;
     onOpen?: () => void;
     onClose?: () => void;
-    /**
-     * Overlay 영역 클릭시 닫힘 사용 여부
-     * @default true
-     */
-    canClickOutside?: boolean;
     /**
      * 기본값으로 [ZIndexOrder](https://github.com/croquiscom/pds/blob/main/src/styles/zIndex.ts) 규칙을 적용합니다.
      * @default 1035
@@ -70,4 +65,4 @@ export interface DatePickerProps extends DatePickerBaseProps {
     showFooter?: boolean;
     onChange?: (value: Date | null) => void;
 }
-export declare const DatePicker: ({ width, error, disabled, className, placeholder, displayTimeFormat, value, disabledDays, canClickOutside, showRemoveButton, showTodayButton, showTimePicker, showFooter, zIndex, onChange, opened: openProp, onOpen, onClose, }: DatePickerProps) => JSX.Element;
+export declare const DatePicker: ({ width, error, disabled, className, placeholder, displayTimeFormat, value, disabledDays, showRemoveButton, showTodayButton, showTimePicker, showFooter, zIndex, onChange, opened: openProp, onOpen, onClose, }: DatePickerProps) => JSX.Element;

package/dist/components/date-picker/DatePicker.stories.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { ComponentMeta } from '@storybook/react';
-declare const _default: ComponentMeta<({ width, error, disabled, className, placeholder, displayTimeFormat, value, disabledDays, canClickOutside, showRemoveButton, showTodayButton, showTimePicker, showFooter, zIndex, onChange, opened: openProp, onOpen, onClose, }: import("./DatePicker").DatePickerProps) => JSX.Element>;
+declare const _default: ComponentMeta<({ width, error, disabled, className, placeholder, displayTimeFormat, value, disabledDays, showRemoveButton, showTodayButton, showTimePicker, showFooter, zIndex, onChange, opened: openProp, onOpen, onClose, }: import("./DatePicker").DatePickerProps) => JSX.Element>;
 export default _default;
 export declare const Base: any;
 export declare const Disabled: any;

package/dist/components/date-picker/DateRangePicker.d.ts

@@ -36,4 +36,4 @@ export interface DateRangePickerProps extends DatePickerBaseProps {
     numberOfMonths?: number;
     onChange?: (start: Dates['from'], end: Dates['to']) => void;
 }
-export declare const DateRangePicker: ({ width, error, disabled, className, showDatePreset, dates, maxDate, minDate, maxRange, numberOfMonths, canClickOutside, showRemoveButton, opened: openProp, customDatePreset, onOpen, onClose, onChange, }: DateRangePickerProps) => JSX.Element;
+export declare const DateRangePicker: ({ width, error, disabled, className, showDatePreset, dates, maxDate, minDate, maxRange, numberOfMonths, showRemoveButton, opened: openProp, customDatePreset, onOpen, onClose, onChange, }: DateRangePickerProps) => JSX.Element;

package/dist/components/date-picker/DateRangePicker.stories.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { ComponentMeta } from '@storybook/react';
-declare const _default: ComponentMeta<({ width, error, disabled, className, showDatePreset, dates, maxDate, minDate, maxRange, numberOfMonths, canClickOutside, showRemoveButton, opened: openProp, customDatePreset, onOpen, onClose, onChange, }: import("./DateRangePicker").DateRangePickerProps) => JSX.Element>;
+declare const _default: ComponentMeta<({ width, error, disabled, className, showDatePreset, dates, maxDate, minDate, maxRange, numberOfMonths, showRemoveButton, opened: openProp, customDatePreset, onOpen, onClose, onChange, }: import("./DateRangePicker").DateRangePickerProps) => JSX.Element>;
 export default _default;
 export declare const Base: any;
 export declare const Disabled: any;

package/dist/components/date-picker/DayPickerOverlay.d.ts

@@ -7,8 +7,6 @@ export interface DayPickerOverlayProps {
     children: React.ReactNode;
     className?: string;
     content?: ReactNode | ContentWithCloseAction;
-    /** @default true */
-    canClickOutside?: boolean;
     /** @default 1035 */
     zIndex?: number;
     opened?: boolean;
@@ -18,5 +16,5 @@ export interface DayPickerOverlayProps {
     onCloseOutsidePress?: () => void;
     setOpened: Dispatch<SetStateAction<boolean>>;
 }
-export declare const DayPickerOverlay: ({ children, className, content, canClickOutside, zIndex, opened: openProp, disabled, onClose, onOpen, onCloseOutsidePress, setOpened, }: DayPickerOverlayProps) => JSX.Element;
+export declare const DayPickerOverlay: ({ children, className, content, zIndex, opened: openProp, disabled, onClose, onOpen, onCloseOutsidePress, setOpened, }: DayPickerOverlayProps) => JSX.Element;
 export {};

package/dist/components/date-picker/styles.d.ts

@@ -6,7 +6,11 @@ export declare const range_input_default_style: {
     backgroundColor: string;
     padding: number;
     transition: string;
-    '&:hover, &:focus, &:focus-within': {
+    '&:hover': {
         borderColor: string;
     };
+    '&:focus, &:focus-within': {
+        outline: string;
+        border: string;
+    };
 };

package/dist/components/dropdown/styles.d.ts

@@ -18,3 +18,10 @@ export declare const dropdown_item_selected_style: {
 export declare const dropdown_item_focused_style: {
     backgroundColor: string;
 };
+export declare const dropdown_item_group_focus_style: {
+    outline: string;
+    zIndex: number;
+    '&:focus': {
+        outline: string;
+    };
+};

package/dist/components/modal/Modal.d.ts

@@ -1,4 +1,4 @@
-import React, { PropsWithChildren, ReactNode } from 'react';
+import React, { ReactNode } from 'react';
 import { ButtonProps } from '../button';
 import { CSSValueWithLength, SpaceProps } from '../../styles';
 import { ModalOverlayBaseProps, ModalBaseCancelReason } from './ModalOverlay';
@@ -18,10 +18,10 @@ export interface ModalProps extends Omit<ModalOverlayBaseProps, 'onClose'> {
      * [ButtonProps](https://storybook.kakaostyle.in/master/pds/?path=/docs/component-button--primary)를 confirmButton에 적용할 수 있습니다.
      */
     confirmButtonProps?: ModalButtonProps;
+    cancelText?: string;
     /**
      * [ButtonProps](https://storybook.kakaostyle.in/master/pds/?path=/docs/component-button--primary)를 cancelButton에 적용할 수 있습니다.
      */
-    cancelText?: string;
     cancelButtonProps?: ModalButtonProps;
     /**
      * 헤더 영역 타이틀 좌측 backButton 사용 유무
@@ -60,14 +60,14 @@ export interface ModalProps extends Omit<ModalOverlayBaseProps, 'onClose'> {
      * reason을 포함한 cancel 이벤트를 전달합니다.
      *  - 'cancelClick' | 'escapeKeyPress' | 'overlayClick'
      */
-    onCancel?: (reason: ModalBaseCancelReason) => void;
+    onCancel?: (reason: ModalCancelReason) => void;
     /**
      * Modal Header backButton 클릭 이벤트
      */
     onClickBackButton?: () => void;
 }
 export declare const MIN_WIDTH = 480;
-export declare const Modal: ({ opened: openProp, children, title, width, zIndex, confirmText, cancelText, closeButton, backButton, dense, fill, fullScreen, footer, confirmButtonProps, cancelButtonProps, contentProps, onConfirm, onCancel, onExited, onClickBackButton, ...props }: PropsWithChildren<ModalProps>) => JSX.Element;
+export declare const Modal: React.ComponentType<React.PropsWithChildren<ModalProps>>;
 export declare const ModalContent: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType<any>;

package/dist/components/modal/Modal.stories.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { ComponentStory, ComponentMeta } from '@storybook/react';
 import { Modal } from './Modal';
-declare const _default: ComponentMeta<({ opened: openProp, children, title, width, zIndex, confirmText, cancelText, closeButton, backButton, dense, fill, fullScreen, footer, confirmButtonProps, cancelButtonProps, contentProps, onConfirm, onCancel, onExited, onClickBackButton, ...props }: React.PropsWithChildren<import("./Modal").ModalProps>) => JSX.Element>;
+declare const _default: ComponentMeta<React.ComponentType<React.PropsWithChildren<import("./Modal").ModalProps>>>;
 export default _default;
 export declare const Base: any;
 export declare const Dense: any;

package/dist/components/modal/ModalOverlay.d.ts

@@ -24,12 +24,12 @@ export interface ModalOverlayBaseProps {
      */
     zIndex?: number;
     /**
-     * Overlay 영역 클릭시 모달 닫힘 사용 여부
+     * outside 영역 클릭시 닫힘 사용 여부
      * @default true
      */
     canClickOutside?: boolean;
     /**
-     * escapeKey 모달 닫힘 사용 여부, 현재 모달에 focus된 경우 동작합니다.
+     * escapeKey 키이벤트 닫힘 사용 여부
      * @default true
      */
     canCloseEscapeKey?: boolean;
@@ -55,11 +55,11 @@ export interface ModalOverlayProps extends ModalOverlayBaseProps {
      */
     borderRadiusSize?: CornerRadiusSize;
     setOpened?: Dispatch<SetStateAction<boolean>>;
-    onCancelEventCallback?: (event: ModalCloseEventCallback) => void;
+    onCancelEventCallback?: (event: ModalCloseEventCallback, floatingContainerId?: string) => void;
     /**
-     * @desc esc, overlay 클릭으로 인한 모달 닫힘 상태 내부 제어 여부, Confirm/Alert 모달과 같이 함수 호출형 컴포넌트에 해당합니다.
+     * @desc esc, overlay 클릭으로 인한 모달 닫힘 상태 외부 제어 여부
      * @default false
      */
-    uncontrolledOpen?: boolean;
+    controlledOpen?: boolean;
 }
-export declare const ModalOverlay: ({ floatingPortalId, width, borderRadiusSize, fill, fullScreen, className, children, opened: openProp, zIndex, canClickOutside, canCloseEscapeKey, uncontrolledOpen, onExited, onClose, onCancelEventCallback, setOpened, }: PropsWithChildren<ModalOverlayProps>) => JSX.Element;
+export declare const ModalOverlay: ({ floatingPortalId, width, borderRadiusSize, fill, fullScreen, className, children, opened: openProp, zIndex, canClickOutside, canCloseEscapeKey, controlledOpen, onExited, onClose, onCancelEventCallback, setOpened, }: PropsWithChildren<ModalOverlayProps>) => JSX.Element;

package/dist/components/modal/ModalStoryArgTypes.d.ts

@@ -0,0 +1,240 @@
+export declare const ModalStoryArgTypes: {
+    title: {
+        table: {
+            type: {
+                summary: string;
+            };
+        };
+    };
+    confirmText: {
+        table: {
+            type: {
+                summary: string;
+            };
+        };
+    };
+    cancelText: {
+        table: {
+            type: {
+                summary: string;
+            };
+        };
+    };
+    backButton: {
+        description: string;
+        table: {
+            type: {
+                summary: string;
+            };
+            defaultValue: {
+                summary: string;
+            };
+        };
+        control: {
+            type: string;
+        };
+    };
+    confirmButtonProps: {
+        description: string;
+        table: {
+            type: {
+                summary: string;
+                detail: string;
+            };
+        };
+    };
+    cancelButtonProps: {
+        description: string;
+        table: {
+            type: {
+                summary: string;
+                detail: string;
+            };
+        };
+    };
+    closeButton: {
+        table: {
+            type: {
+                summary: string;
+            };
+            defaultValue: {
+                summary: string;
+            };
+        };
+        control: {
+            type: string;
+        };
+    };
+    dense: {
+        description: string;
+        table: {
+            type: {
+                summary: string;
+            };
+            defaultValue: {
+                summary: string;
+            };
+        };
+        control: {
+            type: string;
+        };
+    };
+    contentProps: {
+        description: string;
+        table: {
+            type: {
+                summary: string;
+                detail: string;
+            };
+        };
+        control: {
+            type: string;
+        };
+    };
+    footer: {
+        description: string;
+        control: {
+            type: string;
+        };
+        table: {
+            type: {
+                summary: string;
+            };
+        };
+    };
+    fullScreen: {
+        description: string;
+        table: {
+            type: {
+                summary: string;
+            };
+            defaultValue: {
+                summary: string;
+            };
+        };
+        control: {
+            type: string;
+        };
+    };
+    onConfirm: {
+        table: {
+            type: {
+                summary: string;
+            };
+        };
+    };
+    onCancel: {
+        description: string;
+        table: {
+            type: {
+                summary: string;
+                detail: string;
+            };
+        };
+    };
+    onClickBackButton: {
+        description: string;
+        table: {
+            type: {
+                summary: string;
+            };
+        };
+    };
+    className: {
+        table: {
+            type: {
+                summary: string;
+            };
+        };
+        control: {
+            type: string;
+        };
+    };
+    fill: {
+        description: string;
+        table: {
+            type: {
+                summary: string;
+            };
+            defaultValue: {
+                summary: string;
+            };
+        };
+        control: {
+            type: string;
+        };
+    };
+    zIndex: {
+        table: {
+            type: {
+                summary: string;
+            };
+            defaultValue: {
+                summary: string;
+            };
+        };
+        control: {
+            type: string;
+        };
+    };
+    opened: {
+        table: {
+            type: {
+                summary: string;
+            };
+        };
+        control: {
+            type: string;
+        };
+    };
+    canClickOutside: {
+        description: string;
+        table: {
+            type: {
+                summary: string;
+            };
+            defaultValue: {
+                summary: string;
+            };
+        };
+        control: {
+            type: string;
+        };
+    };
+    canCloseEscapeKey: {
+        description: string;
+        table: {
+            type: {
+                summary: string;
+            };
+            defaultValue: {
+                summary: string;
+            };
+        };
+        control: {
+            type: string;
+        };
+    };
+    width: {
+        description: string;
+        table: {
+            type: {
+                summary: string;
+            };
+            defaultValue: {
+                summary: string;
+            };
+        };
+        control: {
+            type: string;
+        };
+    };
+    onExited: {
+        description: string;
+        table: {
+            type: {
+                summary: string;
+            };
+        };
+    };
+};

package/dist/components/modal/NoticeModal.d.ts

@@ -1,7 +1,8 @@
-import React, { PropsWithChildren, ReactNode } from 'react';
+import React, { ReactNode } from 'react';
+import { ModalCancelReason } from './Modal';
 import { ModalOverlayBaseProps } from './ModalOverlay';
 import { CSSValueWithLength } from '../../styles';
-export interface NoticeModalProps extends Omit<ModalOverlayBaseProps, 'fill' | 'width'> {
+export interface NoticeModalProps extends Omit<ModalOverlayBaseProps, 'fill' | 'width' | 'onClose'> {
     /**
      * 헤더 영역 상단 라벨 노출 요소
      */
@@ -23,9 +24,14 @@ export interface NoticeModalProps extends Omit<ModalOverlayBaseProps, 'fill' | '
      * @default '오늘 하루동안 이 창을 열지 않음'
      */
     checkReplayText?: string;
+    /**
+     * reason을 포함한 cancel 이벤트를 전달합니다.
+     *  - 'cancelClick' | 'escapeKeyPress' | 'overlayClick'
+     */
+    onCancel?: (reason: ModalCancelReason) => void;
     /**
      * 푸터 영역 좌측 체크박스 change 이벤트를 전달합니다.
      */
     onChangeCheckReplay?: (e: React.ChangeEvent<HTMLInputElement>) => void;
 }
-export declare const NoticeModal: ({ opened: openProp, children, width, zIndex, label, title, text, checkReplay, checkReplayText, onClose, onExited, onChangeCheckReplay, ...props }: PropsWithChildren<NoticeModalProps>) => JSX.Element;
+export declare const NoticeModal: React.ComponentType<React.PropsWithChildren<NoticeModalProps>>;

package/dist/components/modal/NoticeModal.stories.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 import { ComponentMeta } from '@storybook/react';
-declare const _default: ComponentMeta<({ opened: openProp, children, width, zIndex, label, title, text, checkReplay, checkReplayText, onClose, onExited, onChangeCheckReplay, ...props }: React.PropsWithChildren<import("./NoticeModal").NoticeModalProps>) => JSX.Element>;
+declare const _default: ComponentMeta<React.ComponentType<React.PropsWithChildren<import("./NoticeModal").NoticeModalProps>>>;
 export default _default;
 export declare const Base: any;

package/dist/components/modal/useManualDismiss.d.ts

@@ -0,0 +1,26 @@
+import { FloatingTreeType, FloatingContext } from '@floating-ui/react';
+export interface DismissPayload {
+    type: 'outsidePress' | 'referencePress' | 'escapeKey' | 'mouseLeave';
+    data: {
+        returnFocus: boolean | {
+            preventScroll: boolean;
+        };
+    };
+}
+export interface UseManualDismissProps {
+    controlled?: boolean;
+    rootId: string;
+    tree: FloatingTreeType;
+    context: FloatingContext;
+    dismissEventType?: Array<Partial<DismissPayload['type']>>;
+    callbackTypeWithFn?: (type: DismissPayload['type']) => void;
+}
+/**
+ * @desc Modal dismiss event share
+ *  - [Dismiss](https://floating-ui.com/docs/useDismiss)실행시 context 이벤트를 구독하여 중첩 요소간 이벤트 순차 핸들링을 지원합니다.
+ *  - 제어 조건
+ *    - FloatingTreeContext를 통해 생성된 요소로 useFloatingNodeId를 통한 context 주입이 되어야합니다.
+ *    - 노드 구조가 자식 요소로써 중첩 호출된 케이스인 경우 자동으로 순차 호출된 dismiss 이벤트를 전달합니다.(https://github.com/floating-ui/floating-ui/pull/2114)
+ *    - 노드 구조가 형제 요소로써 중첩 호출된 케이스인 경우 현재 활성된 요소부터 dismiss 이벤트를 전달합니다.
+ */
+export declare function useManualDismiss({ controlled, rootId, tree, context, dismissEventType, callbackTypeWithFn, }: UseManualDismissProps): void;

package/dist/components/popover/Popover.d.ts

@@ -9,7 +9,22 @@ type PopoverWithCloseAction = (action: {
 export interface PopoverProps {
     className?: string;
     children: ReactNode;
-    content: PopoverContent | PopoverWithCloseAction;
+    /**
+     * Popover 내부에 렌더될 자유 콘텐츠 요소
+     *  - HelpText 컴포넌트 규격 또는 자유롭게 콘텐츠를 구성할 경우 사용합니다.
+     *  - PopoverContent
+     *   - [HelpText](https://storybook.kakaostyle.in/master/pds/?path=/story/component-text-helptext--base) 또는 ReactNode 타입을 가집니다.
+     *  - PopoverWithCloseAction
+     *   - PopoverContent function 타입으로 가집니다.
+     */
+    content?: PopoverContent | PopoverWithCloseAction;
+    title?: string;
+    description?: ReactNode;
+    /**
+     * 닫힘버튼 사용 유무
+     * @default false
+     */
+    closeButton?: boolean;
     /**
      * main app node 바깥영역으로 생성할지 여부
      * @default false
@@ -24,6 +39,11 @@ export interface PopoverProps {
     placement?: Placement;
     /** @default hover */
     openerTriggerEvent?: OpenerTriggerEvent;
+    /**
+     * outside 영역 클릭시 닫힘 사용 여부
+     * @default true
+     */
+    canClickOutside?: boolean;
 }
 export declare const Popover: React.FC<PopoverProps>;
 export {};

package/dist/components/popover/Popover.stories.d.ts

@@ -6,5 +6,15 @@ export default _default;
 export declare const Base: any;
 export declare const HoverIcon: () => JSX.Element;
 export declare const Placement: ComponentStory<typeof Popover>;
-export declare const ContentWithCloseAction: () => JSX.Element;
+export declare const Trigger: () => JSX.Element;
+export declare const TemplateWithCloseButton: {
+    (): JSX.Element;
+    parameters: {
+        docs: {
+            description: {
+                story: string;
+            };
+        };
+    };
+};
 export declare const HidingFullyClippedReferenceElements: () => JSX.Element;

package/dist/components/time-picker/styles.d.ts

@@ -5,7 +5,11 @@ export declare const range_input_default_style: {
     backgroundColor: string;
     padding: number;
     transition: string;
-    '&:hover, &:focus, &:focus-within': {
+    '&:hover': {
         borderColor: string;
     };
+    '&:focus, &:focus-within': {
+        outline: string;
+        border: string;
+    };
 };

package/dist/components/tooltip/Tooltip.d.ts

@@ -11,7 +11,7 @@ export interface TooltipProps extends TooltipBaseProps {
     className?: string;
     content?: ReactNode | TooltipContentWithCloseAction;
     /**
-     * Overlay 영역 클릭시 닫힘 사용 여부
+     * outside 영역 클릭시 닫힘 사용 여부
      * @default true
      */
     canClickOutside?: boolean;

package/dist/constants/floating.d.ts

@@ -1,3 +1,4 @@
 export declare const FLOATING_ROOT_ID = "pds-floating-root";
 export declare const FLOATING_ALERT_ROOT_ID = "pds-alert-root";
 export declare const FLOATING_CONFIRM_ROOT_ID = "pds-confirm-root";
+export declare const FLOATING_ORDER: Array<'reference' | 'floating' | 'content'>;