prime-ui-kit 0.7.1 → 0.7.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/button/examples/destructive-confirm.d.ts.map +1 -1
- package/dist/components/drawer/Drawer.d.ts +11 -66
- package/dist/components/drawer/Drawer.d.ts.map +1 -1
- package/dist/components/drawer/examples/cart-preview.d.ts.map +1 -1
- package/dist/components/drawer/examples/explicit-panel.d.ts +1 -1
- package/dist/components/drawer/examples/explicit-panel.d.ts.map +1 -1
- package/dist/components/drawer/examples/filters-panel.d.ts.map +1 -1
- package/dist/components/drawer/examples/mobile-nav-sheet.d.ts +1 -1
- package/dist/components/drawer/examples/mobile-nav-sheet.d.ts.map +1 -1
- package/dist/components/drawer/examples/settings-side.d.ts +1 -1
- package/dist/components/drawer/examples/settings-side.d.ts.map +1 -1
- package/dist/components/index.css +82 -84
- package/dist/components/index.css.map +3 -3
- package/dist/components/index.d.ts +1 -1
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/index.js +509 -443
- package/dist/components/index.js.map +4 -4
- package/dist/components/modal/Modal.d.ts +28 -7
- package/dist/components/modal/Modal.d.ts.map +1 -1
- package/dist/components/modal/examples/canonical-maximal.d.ts.map +1 -1
- package/dist/components/modal/examples/pattern-close-behavior.d.ts.map +1 -1
- package/dist/components/modal/examples/pattern-controlled.d.ts.map +1 -1
- package/dist/components/modal/examples/pattern-portal-and-scroll.d.ts.map +1 -1
- package/dist/components/modal/examples/scenario-confirm-delete.d.ts.map +1 -1
- package/dist/components/modal/examples/scenario-edit-entity.d.ts.map +1 -1
- package/dist/components/modal/examples/scenario-legal-consent.d.ts.map +1 -1
- package/dist/components/modal/examples/scenario-multi-field-form.d.ts.map +1 -1
- package/dist/components/select/Select.d.ts.map +1 -1
- package/dist/hooks/useModalKeyboard.d.ts +14 -0
- package/dist/hooks/useModalKeyboard.d.ts.map +1 -0
- package/dist/hooks/useScrollLock.d.ts +1 -1
- package/dist/index.css +82 -84
- package/dist/index.css.map +3 -3
- package/dist/index.js +509 -443
- package/dist/index.js.map +4 -4
- package/package.json +1 -1
- package/src/components/button/examples/destructive-confirm.tsx +13 -9
- package/src/components/drawer/COMPONENT.md +93 -153
- package/src/components/drawer/examples/cart-preview.tsx +43 -38
- package/src/components/drawer/examples/explicit-panel.tsx +29 -29
- package/src/components/drawer/examples/filters-panel.tsx +45 -40
- package/src/components/drawer/examples/mobile-nav-sheet.tsx +35 -30
- package/src/components/drawer/examples/settings-side.tsx +47 -42
- package/src/components/modal/COMPONENT.md +35 -17
- package/src/components/modal/examples/canonical-maximal.tsx +13 -9
- package/src/components/modal/examples/pattern-close-behavior.tsx +9 -5
- package/src/components/modal/examples/pattern-controlled.tsx +7 -3
- package/src/components/modal/examples/pattern-portal-and-scroll.tsx +7 -3
- package/src/components/modal/examples/scenario-confirm-delete.tsx +13 -9
- package/src/components/modal/examples/scenario-edit-entity.tsx +16 -12
- package/src/components/modal/examples/scenario-legal-consent.tsx +9 -5
- package/src/components/modal/examples/scenario-multi-field-form.tsx +13 -9
|
@@ -6,9 +6,18 @@ export type ModalRootProps = {
|
|
|
6
6
|
onOpenChange?: (open: boolean) => void;
|
|
7
7
|
closeOnEscape?: boolean;
|
|
8
8
|
closeOnOverlayClick?: boolean;
|
|
9
|
+
/**
|
|
10
|
+
* Если `true`, Enter вызывает `click()` по кнопке из `Modal.Footer` **`primary`** (или **`onEnterConfirm`**).
|
|
11
|
+
*/
|
|
12
|
+
confirmOnEnter?: boolean;
|
|
13
|
+
/**
|
|
14
|
+
* Заменяет стандартное подтверждение по Enter: вызывается вместо программного `click()` по **`primary`**.
|
|
15
|
+
* При необходимости подавить нативное поведение элемента под фокусом вызовите `event.preventDefault()`.
|
|
16
|
+
*/
|
|
17
|
+
onEnterConfirm?: (event: KeyboardEvent) => void;
|
|
9
18
|
children?: React.ReactNode;
|
|
10
19
|
};
|
|
11
|
-
declare function ModalRoot({ open, defaultOpen, onOpenChange, closeOnEscape, closeOnOverlayClick, children, }: ModalRootProps): import("react/jsx-runtime").JSX.Element;
|
|
20
|
+
declare function ModalRoot({ open, defaultOpen, onOpenChange, closeOnEscape, closeOnOverlayClick, confirmOnEnter, onEnterConfirm, children, }: ModalRootProps): import("react/jsx-runtime").JSX.Element;
|
|
12
21
|
export type ModalTriggerProps = {
|
|
13
22
|
children: React.ReactElement<{
|
|
14
23
|
onClick?: React.MouseEventHandler;
|
|
@@ -22,13 +31,23 @@ export type ModalCloseProps = {
|
|
|
22
31
|
onClick?: React.MouseEventHandler;
|
|
23
32
|
className?: string;
|
|
24
33
|
size?: ButtonSize;
|
|
34
|
+
ref?: React.Ref<HTMLElement>;
|
|
25
35
|
}>;
|
|
26
36
|
};
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
37
|
+
export type ModalFooterProps = Omit<React.HTMLAttributes<HTMLElement>, "children"> & {
|
|
38
|
+
/** Основное действие (Enter при `confirmOnEnter`); один элемент, например `Button.Root`. */
|
|
39
|
+
primary?: React.ReactElement<{
|
|
40
|
+
ref?: React.Ref<HTMLElement>;
|
|
41
|
+
onClick?: React.MouseEventHandler;
|
|
42
|
+
className?: string;
|
|
43
|
+
size?: ButtonSize;
|
|
44
|
+
}>;
|
|
45
|
+
/** Обычно отмена / закрытие (`Modal.Close` + кнопка). */
|
|
46
|
+
secondary?: React.ReactNode;
|
|
47
|
+
/** Дополнительные кнопки между `secondary` и `primary` (несколько кнопок — фрагмент). */
|
|
48
|
+
extra?: React.ReactNode;
|
|
49
|
+
};
|
|
50
|
+
declare function ModalFooter({ primary, secondary, extra, className, ...rest }: ModalFooterProps): import("react/jsx-runtime").JSX.Element;
|
|
32
51
|
export type ModalPanelProps = Omit<React.HTMLAttributes<HTMLDivElement>, "title"> & {
|
|
33
52
|
/** Узел для `createPortal` (по умолчанию `document.body`). */
|
|
34
53
|
container?: HTMLElement | null;
|
|
@@ -42,6 +61,7 @@ export type ModalPanelProps = Omit<React.HTMLAttributes<HTMLDivElement>, "title"
|
|
|
42
61
|
closeAriaLabel?: string;
|
|
43
62
|
/** При `title` оборачивается в зону тела; без `title` — рендерится сразу в панели (например headless-диалог). */
|
|
44
63
|
children?: React.ReactNode;
|
|
64
|
+
/** Предпочтительно `Modal.Footer` со слотами `secondary` / `extra` / `primary` для явного действия по Enter. */
|
|
45
65
|
footer?: React.ReactNode;
|
|
46
66
|
footerClassName?: string;
|
|
47
67
|
bodyClassName?: string;
|
|
@@ -51,7 +71,8 @@ declare function ModalPanel({ container, overlayClassName, className, style, tit
|
|
|
51
71
|
export declare const Modal: {
|
|
52
72
|
Root: typeof ModalRoot;
|
|
53
73
|
Trigger: typeof ModalTrigger;
|
|
54
|
-
Close:
|
|
74
|
+
Close: React.ForwardRefExoticComponent<ModalCloseProps & React.RefAttributes<HTMLElement>>;
|
|
75
|
+
Footer: typeof ModalFooter;
|
|
55
76
|
Panel: typeof ModalPanel;
|
|
56
77
|
};
|
|
57
78
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../../src/components/modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../../src/components/modal/Modal.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"canonical-maximal.d.ts","sourceRoot":"","sources":["../../../../../src/components/modal/examples/canonical-maximal.tsx"],"names":[],"mappings":"AAKA;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,4BAA4B,
|
|
1
|
+
{"version":3,"file":"canonical-maximal.d.ts","sourceRoot":"","sources":["../../../../../src/components/modal/examples/canonical-maximal.tsx"],"names":[],"mappings":"AAKA;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,4BAA4B,4CAqCnD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pattern-close-behavior.d.ts","sourceRoot":"","sources":["../../../../../src/components/modal/examples/pattern-close-behavior.tsx"],"names":[],"mappings":"AAIA,2HAA2H;AAC3H,MAAM,CAAC,OAAO,UAAU,gCAAgC,
|
|
1
|
+
{"version":3,"file":"pattern-close-behavior.d.ts","sourceRoot":"","sources":["../../../../../src/components/modal/examples/pattern-close-behavior.tsx"],"names":[],"mappings":"AAIA,2HAA2H;AAC3H,MAAM,CAAC,OAAO,UAAU,gCAAgC,4CAkDvD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pattern-controlled.d.ts","sourceRoot":"","sources":["../../../../../src/components/modal/examples/pattern-controlled.tsx"],"names":[],"mappings":"AAMA,sHAAsH;AACtH,MAAM,CAAC,OAAO,UAAU,6BAA6B,
|
|
1
|
+
{"version":3,"file":"pattern-controlled.d.ts","sourceRoot":"","sources":["../../../../../src/components/modal/examples/pattern-controlled.tsx"],"names":[],"mappings":"AAMA,sHAAsH;AACtH,MAAM,CAAC,OAAO,UAAU,6BAA6B,4CAiCpD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pattern-portal-and-scroll.d.ts","sourceRoot":"","sources":["../../../../../src/components/modal/examples/pattern-portal-and-scroll.tsx"],"names":[],"mappings":"AAMA,8HAA8H;AAC9H,MAAM,CAAC,OAAO,UAAU,kCAAkC,
|
|
1
|
+
{"version":3,"file":"pattern-portal-and-scroll.d.ts","sourceRoot":"","sources":["../../../../../src/components/modal/examples/pattern-portal-and-scroll.tsx"],"names":[],"mappings":"AAMA,8HAA8H;AAC9H,MAAM,CAAC,OAAO,UAAU,kCAAkC,4CA4EzD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scenario-confirm-delete.d.ts","sourceRoot":"","sources":["../../../../../src/components/modal/examples/scenario-confirm-delete.tsx"],"names":[],"mappings":"AAKA,uGAAuG;AACvG,MAAM,CAAC,OAAO,UAAU,yBAAyB,
|
|
1
|
+
{"version":3,"file":"scenario-confirm-delete.d.ts","sourceRoot":"","sources":["../../../../../src/components/modal/examples/scenario-confirm-delete.tsx"],"names":[],"mappings":"AAKA,uGAAuG;AACvG,MAAM,CAAC,OAAO,UAAU,yBAAyB,4CAmChD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scenario-edit-entity.d.ts","sourceRoot":"","sources":["../../../../../src/components/modal/examples/scenario-edit-entity.tsx"],"names":[],"mappings":"AAOA,0HAA0H;AAC1H,MAAM,CAAC,OAAO,UAAU,sBAAsB,
|
|
1
|
+
{"version":3,"file":"scenario-edit-entity.d.ts","sourceRoot":"","sources":["../../../../../src/components/modal/examples/scenario-edit-entity.tsx"],"names":[],"mappings":"AAOA,0HAA0H;AAC1H,MAAM,CAAC,OAAO,UAAU,sBAAsB,4CA6C7C"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scenario-legal-consent.d.ts","sourceRoot":"","sources":["../../../../../src/components/modal/examples/scenario-legal-consent.tsx"],"names":[],"mappings":"AAKA,kHAAkH;AAClH,MAAM,CAAC,OAAO,UAAU,wBAAwB,
|
|
1
|
+
{"version":3,"file":"scenario-legal-consent.d.ts","sourceRoot":"","sources":["../../../../../src/components/modal/examples/scenario-legal-consent.tsx"],"names":[],"mappings":"AAKA,kHAAkH;AAClH,MAAM,CAAC,OAAO,UAAU,wBAAwB,4CAiC/C"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scenario-multi-field-form.d.ts","sourceRoot":"","sources":["../../../../../src/components/modal/examples/scenario-multi-field-form.tsx"],"names":[],"mappings":"AAYA,gGAAgG;AAChG,MAAM,CAAC,OAAO,UAAU,0BAA0B,
|
|
1
|
+
{"version":3,"file":"scenario-multi-field-form.d.ts","sourceRoot":"","sources":["../../../../../src/components/modal/examples/scenario-multi-field-form.tsx"],"names":[],"mappings":"AAYA,gGAAgG;AAChG,MAAM,CAAC,OAAO,UAAU,0BAA0B,4CA2DjD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../src/components/select/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAY/B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../src/components/select/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAY/B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAiCpD,MAAM,MAAM,eAAe,GAAG;IAC5B,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,iBAAS,UAAU,CAAC,KAAK,EAAE,eAAe,2CAMzC;kBANQ,UAAU;;;AA8FnB,MAAM,MAAM,kBAAkB,GAAG,IAAI,CACnC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAC7C,IAAI,GAAG,MAAM,GAAG,MAAM,CACvB,CAAC;AA+DF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,EAAE,gBAAgB,2CAenD;kBAfQ,WAAW;;;AAoBpB,MAAM,MAAM,sBAAsB,GAAG,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,CAAC;AAE3E,iBAAS,iBAAiB,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,sBAAsB,2CAMlF;kBANQ,iBAAiB;;;AAW1B,MAAM,MAAM,kBAAkB,GAAG;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,kBAAkB,2CAkGjE;kBAlGQ,aAAa;;;AAuGtB,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,CAAC;AAExE,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,mBAAmB,2CAM5E;kBANQ,cAAc;;;AAqCvB,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,uFAAuF;IACvF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AA4EF,MAAM,MAAM,gBAAgB,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC;AAEpE,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,gBAAgB,2CAG5D;kBAHQ,WAAW;;;AAQpB,MAAM,MAAM,qBAAqB,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC;AAEzE,iBAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,qBAAqB,2CAEtE;kBAFQ,gBAAgB;;;AAOzB,MAAM,MAAM,oBAAoB,GAAG,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;AAEvE,iBAAS,eAAe,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,oBAAoB,2CAEpE;kBAFQ,eAAe;;;AA0KxB,eAAO,MAAM,MAAM;;;;;;;;;;;CAWlB,CAAC"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
export type UseModalKeyboardOptions = {
|
|
3
|
+
open: boolean;
|
|
4
|
+
trapRef: React.RefObject<HTMLElement | null>;
|
|
5
|
+
closeOnEscape: boolean;
|
|
6
|
+
onClose: () => void;
|
|
7
|
+
confirmOnEnter: boolean;
|
|
8
|
+
onEnterConfirm?: (event: KeyboardEvent) => void;
|
|
9
|
+
/** Целевой элемент подтверждения (кнопка из `Modal.Footer` `primary`). */
|
|
10
|
+
primaryRef: React.RefObject<HTMLElement | null>;
|
|
11
|
+
};
|
|
12
|
+
/** Escape + Enter для `role="dialog"`: Escape закрывает; Enter имитирует `click()` по `primaryRef`. */
|
|
13
|
+
export declare function useModalKeyboard({ open, trapRef, closeOnEscape, onClose, confirmOnEnter, onEnterConfirm, primaryRef, }: UseModalKeyboardOptions): void;
|
|
14
|
+
//# sourceMappingURL=useModalKeyboard.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useModalKeyboard.d.ts","sourceRoot":"","sources":["../../../src/hooks/useModalKeyboard.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAoC/B,MAAM,MAAM,uBAAuB,GAAG;IACpC,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAC7C,aAAa,EAAE,OAAO,CAAC;IACvB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,cAAc,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IAChD,0EAA0E;IAC1E,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CACjD,CAAC;AAEF,uGAAuG;AACvG,wBAAgB,gBAAgB,CAAC,EAC/B,IAAI,EACJ,OAAO,EACP,aAAa,EACb,OAAO,EACP,cAAc,EACd,cAAc,EACd,UAAU,GACX,EAAE,uBAAuB,QAqDzB"}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
* Locks body scroll when enabled. Supports multiple concurrent callers via
|
|
3
3
|
* a reference-counted lock — the last caller to unmount restores scroll.
|
|
4
4
|
* Compensates for scrollbar width to prevent layout shift.
|
|
5
|
-
* Shared by
|
|
5
|
+
* Shared by modal/drawer overlays.
|
|
6
6
|
*/
|
|
7
7
|
export declare function useScrollLock(enabled: boolean): void;
|
|
8
8
|
//# sourceMappingURL=useScrollLock.d.ts.map
|
package/dist/index.css
CHANGED
|
@@ -6715,130 +6715,117 @@ textarea::-moz-focus-inner {
|
|
|
6715
6715
|
z-index: var(--prime-sys-elevation-zIndex-drawer);
|
|
6716
6716
|
background: var(--prime-sys-color-surface-overlay);
|
|
6717
6717
|
backdrop-filter: blur(var(--prime-sys-unit-8px));
|
|
6718
|
-
animation: Drawer_drawerFadeIn var(--prime-sys-motion-medium) var(--prime-sys-motion-standard);
|
|
6719
6718
|
}
|
|
6720
6719
|
.Drawer_overlay[data-nested-in-modal=true] {
|
|
6721
6720
|
z-index: var(--prime-sys-elevation-zIndex-drawerNestedShell);
|
|
6722
6721
|
}
|
|
6722
|
+
.Drawer_overlay[data-state=open] {
|
|
6723
|
+
animation: Drawer_drawerFadeIn var(--prime-sys-motion-medium) var(--prime-sys-motion-standard);
|
|
6724
|
+
}
|
|
6725
|
+
.Drawer_overlay[data-state=closing] {
|
|
6726
|
+
animation: Drawer_drawerFadeOut var(--prime-sys-motion-medium) var(--prime-sys-motion-standard);
|
|
6727
|
+
}
|
|
6723
6728
|
.Drawer_panel {
|
|
6724
6729
|
position: fixed;
|
|
6725
|
-
|
|
6730
|
+
top: 0;
|
|
6731
|
+
bottom: 0;
|
|
6732
|
+
width: min(28rem, 90vw);
|
|
6726
6733
|
display: flex;
|
|
6727
6734
|
flex-direction: column;
|
|
6728
6735
|
min-height: 0;
|
|
6729
6736
|
overflow: hidden;
|
|
6737
|
+
z-index: var(--prime-sys-elevation-zIndex-drawer);
|
|
6730
6738
|
background: color-mix(in srgb, var(--prime-sys-color-surface-elevated) 94%, transparent);
|
|
6731
6739
|
color: var(--prime-sys-color-content-primary);
|
|
6732
6740
|
border: var(--prime-sys-unit-1px) solid var(--prime-sys-color-border-subtle);
|
|
6733
6741
|
box-shadow: var(--prime-sys-elevation-shadow-modal);
|
|
6734
6742
|
outline: none;
|
|
6735
|
-
--drawer-padding-x: var(--prime-sys-size-drawer-m-paddingX);
|
|
6736
|
-
--drawer-padding-y: var(--prime-sys-size-drawer-m-paddingY);
|
|
6737
|
-
--drawer-title-gap: var(--prime-sys-size-drawer-m-titleGap);
|
|
6738
|
-
--drawer-header-gap: var(--prime-sys-size-drawer-m-headerGap);
|
|
6739
|
-
--drawer-footer-gap: var(--prime-sys-size-drawer-m-footerGap);
|
|
6740
|
-
--drawer-title-text: var(--prime-sys-size-drawer-m-titleText);
|
|
6741
|
-
--drawer-panel-width: min(22rem, 92vw);
|
|
6742
6743
|
}
|
|
6743
6744
|
.Drawer_panel[data-nested-in-modal=true] {
|
|
6744
6745
|
z-index: var(--prime-sys-elevation-zIndex-drawerNestedShell);
|
|
6745
6746
|
}
|
|
6746
|
-
.Drawer_panel[data-size=s] {
|
|
6747
|
-
--drawer-padding-x: var(--prime-sys-size-drawer-s-paddingX);
|
|
6748
|
-
--drawer-padding-y: var(--prime-sys-size-drawer-s-paddingY);
|
|
6749
|
-
--drawer-title-gap: var(--prime-sys-size-drawer-s-titleGap);
|
|
6750
|
-
--drawer-header-gap: var(--prime-sys-size-drawer-s-headerGap);
|
|
6751
|
-
--drawer-footer-gap: var(--prime-sys-size-drawer-s-footerGap);
|
|
6752
|
-
--drawer-title-text: var(--prime-sys-size-drawer-s-titleText);
|
|
6753
|
-
}
|
|
6754
|
-
.Drawer_panel[data-size=l] {
|
|
6755
|
-
--drawer-padding-x: var(--prime-sys-size-drawer-l-paddingX);
|
|
6756
|
-
--drawer-padding-y: var(--prime-sys-size-drawer-l-paddingY);
|
|
6757
|
-
--drawer-title-gap: var(--prime-sys-size-drawer-l-titleGap);
|
|
6758
|
-
--drawer-header-gap: var(--prime-sys-size-drawer-l-headerGap);
|
|
6759
|
-
--drawer-footer-gap: var(--prime-sys-size-drawer-l-footerGap);
|
|
6760
|
-
--drawer-title-text: var(--prime-sys-size-drawer-l-titleText);
|
|
6761
|
-
}
|
|
6762
|
-
.Drawer_panel[data-size=xl] {
|
|
6763
|
-
--drawer-padding-x: var(--prime-sys-size-drawer-xl-paddingX);
|
|
6764
|
-
--drawer-padding-y: var(--prime-sys-size-drawer-xl-paddingY);
|
|
6765
|
-
--drawer-title-gap: var(--prime-sys-size-drawer-xl-titleGap);
|
|
6766
|
-
--drawer-header-gap: var(--prime-sys-size-drawer-xl-headerGap);
|
|
6767
|
-
--drawer-footer-gap: var(--prime-sys-size-drawer-xl-footerGap);
|
|
6768
|
-
--drawer-title-text: var(--prime-sys-size-drawer-xl-titleText);
|
|
6769
|
-
}
|
|
6770
6747
|
.Drawer_panel[data-side=right] {
|
|
6771
|
-
top: 0;
|
|
6772
6748
|
right: 0;
|
|
6773
|
-
bottom: 0;
|
|
6774
|
-
width: var(--drawer-panel-width);
|
|
6775
6749
|
border-radius: var(--prime-sys-shape-radius-l) 0 0 var(--prime-sys-shape-radius-l);
|
|
6776
|
-
animation: Drawer_drawerSlideRight var(--prime-sys-motion-medium) var(--prime-sys-motion-standard);
|
|
6777
6750
|
}
|
|
6778
6751
|
.Drawer_panel[data-side=left] {
|
|
6779
|
-
top: 0;
|
|
6780
6752
|
left: 0;
|
|
6781
|
-
bottom: 0;
|
|
6782
|
-
width: var(--drawer-panel-width);
|
|
6783
6753
|
border-radius: 0 var(--prime-sys-shape-radius-l) var(--prime-sys-shape-radius-l) 0;
|
|
6784
|
-
animation: Drawer_drawerSlideLeft var(--prime-sys-motion-medium) var(--prime-sys-motion-standard);
|
|
6785
6754
|
}
|
|
6786
|
-
.Drawer_panel[data-side=
|
|
6787
|
-
|
|
6788
|
-
right: 0;
|
|
6789
|
-
bottom: 0;
|
|
6790
|
-
max-height: 82vh;
|
|
6791
|
-
border-radius: var(--prime-sys-shape-radius-l) var(--prime-sys-shape-radius-l) 0 0;
|
|
6792
|
-
animation: Drawer_drawerSlideBottom var(--prime-sys-motion-medium) var(--prime-sys-motion-standard);
|
|
6755
|
+
.Drawer_panel[data-state=open][data-side=right] {
|
|
6756
|
+
animation: Drawer_drawerSlideInFromRight var(--prime-sys-motion-medium) var(--prime-sys-motion-standard);
|
|
6793
6757
|
}
|
|
6794
|
-
.Drawer_panel[data-side=
|
|
6795
|
-
|
|
6796
|
-
|
|
6797
|
-
|
|
6798
|
-
|
|
6799
|
-
|
|
6800
|
-
|
|
6758
|
+
.Drawer_panel[data-state=closing][data-side=right] {
|
|
6759
|
+
animation: Drawer_drawerSlideOutToRight var(--prime-sys-motion-medium) var(--prime-sys-motion-standard);
|
|
6760
|
+
}
|
|
6761
|
+
.Drawer_panel[data-state=open][data-side=left] {
|
|
6762
|
+
animation: Drawer_drawerSlideInFromLeft var(--prime-sys-motion-medium) var(--prime-sys-motion-standard);
|
|
6763
|
+
}
|
|
6764
|
+
.Drawer_panel[data-state=closing][data-side=left] {
|
|
6765
|
+
animation: Drawer_drawerSlideOutToLeft var(--prime-sys-motion-medium) var(--prime-sys-motion-standard);
|
|
6801
6766
|
}
|
|
6802
6767
|
.Drawer_header {
|
|
6803
6768
|
display: flex;
|
|
6804
|
-
align-items:
|
|
6769
|
+
align-items: flex-start;
|
|
6805
6770
|
justify-content: space-between;
|
|
6806
|
-
gap: var(--
|
|
6807
|
-
padding-inline: var(--
|
|
6808
|
-
padding-block: var(--
|
|
6771
|
+
gap: var(--prime-sys-spacing-x3);
|
|
6772
|
+
padding-inline: var(--prime-sys-spacing-x5);
|
|
6773
|
+
padding-block: var(--prime-sys-spacing-x5);
|
|
6809
6774
|
border-bottom: var(--prime-sys-unit-1px) solid var(--prime-sys-color-border-subtle);
|
|
6810
6775
|
flex-shrink: 0;
|
|
6811
6776
|
}
|
|
6812
|
-
.
|
|
6777
|
+
.Drawer_headerMain {
|
|
6813
6778
|
display: flex;
|
|
6814
|
-
|
|
6815
|
-
gap: var(--
|
|
6816
|
-
flex: 1;
|
|
6779
|
+
align-items: flex-start;
|
|
6780
|
+
gap: var(--prime-sys-spacing-x3);
|
|
6817
6781
|
min-width: 0;
|
|
6818
6782
|
}
|
|
6819
|
-
.
|
|
6783
|
+
.Drawer_icon {
|
|
6784
|
+
display: inline-flex;
|
|
6785
|
+
align-items: center;
|
|
6786
|
+
justify-content: center;
|
|
6787
|
+
width: var(--prime-sys-size-control-m-height);
|
|
6788
|
+
height: var(--prime-sys-size-control-m-height);
|
|
6789
|
+
border-radius: var(--prime-sys-shape-radius-m);
|
|
6790
|
+
background: var(--prime-sys-color-surface-raised);
|
|
6791
|
+
color: var(--prime-sys-color-content-secondary);
|
|
6820
6792
|
flex-shrink: 0;
|
|
6821
6793
|
}
|
|
6794
|
+
.Drawer_titleBlock {
|
|
6795
|
+
display: flex;
|
|
6796
|
+
flex-direction: column;
|
|
6797
|
+
gap: var(--prime-sys-spacing-x1);
|
|
6798
|
+
min-width: 0;
|
|
6799
|
+
}
|
|
6822
6800
|
.Drawer_title {
|
|
6823
6801
|
margin: 0;
|
|
6824
|
-
font-size: var(--
|
|
6802
|
+
font-size: var(--prime-sys-size-control-m-text);
|
|
6825
6803
|
font-weight: var(--prime-sys-typography-title-weight);
|
|
6826
6804
|
line-height: 1.2;
|
|
6827
6805
|
color: var(--prime-sys-color-content-primary);
|
|
6828
6806
|
}
|
|
6829
|
-
.
|
|
6807
|
+
.Drawer_description {
|
|
6808
|
+
margin: 0;
|
|
6809
|
+
color: var(--prime-sys-color-content-secondary);
|
|
6810
|
+
font-size: var(--prime-sys-size-control-s-text);
|
|
6811
|
+
line-height: 1.4;
|
|
6812
|
+
}
|
|
6813
|
+
.Drawer_closeButton {
|
|
6814
|
+
flex-shrink: 0;
|
|
6815
|
+
}
|
|
6816
|
+
.Drawer_body {
|
|
6830
6817
|
flex: 1;
|
|
6831
6818
|
min-height: 0;
|
|
6832
|
-
padding-inline: var(--
|
|
6833
|
-
padding-block: var(--
|
|
6819
|
+
padding-inline: var(--prime-sys-spacing-x5);
|
|
6820
|
+
padding-block: var(--prime-sys-spacing-x5);
|
|
6834
6821
|
}
|
|
6835
6822
|
.Drawer_footer {
|
|
6836
6823
|
display: flex;
|
|
6837
6824
|
align-items: center;
|
|
6838
6825
|
justify-content: flex-end;
|
|
6839
|
-
gap: var(--
|
|
6840
|
-
padding-inline: var(--
|
|
6841
|
-
padding-block: var(--
|
|
6826
|
+
gap: var(--prime-sys-spacing-x3);
|
|
6827
|
+
padding-inline: var(--prime-sys-spacing-x5);
|
|
6828
|
+
padding-block: var(--prime-sys-spacing-x4);
|
|
6842
6829
|
border-top: var(--prime-sys-unit-1px) solid var(--prime-sys-color-border-subtle);
|
|
6843
6830
|
flex-shrink: 0;
|
|
6844
6831
|
}
|
|
@@ -6850,7 +6837,15 @@ textarea::-moz-focus-inner {
|
|
|
6850
6837
|
opacity: 1;
|
|
6851
6838
|
}
|
|
6852
6839
|
}
|
|
6853
|
-
@keyframes
|
|
6840
|
+
@keyframes Drawer_drawerFadeOut {
|
|
6841
|
+
from {
|
|
6842
|
+
opacity: 1;
|
|
6843
|
+
}
|
|
6844
|
+
to {
|
|
6845
|
+
opacity: 0;
|
|
6846
|
+
}
|
|
6847
|
+
}
|
|
6848
|
+
@keyframes Drawer_drawerSlideInFromRight {
|
|
6854
6849
|
from {
|
|
6855
6850
|
transform: translateX(100%);
|
|
6856
6851
|
}
|
|
@@ -6858,28 +6853,28 @@ textarea::-moz-focus-inner {
|
|
|
6858
6853
|
transform: translateX(0);
|
|
6859
6854
|
}
|
|
6860
6855
|
}
|
|
6861
|
-
@keyframes
|
|
6856
|
+
@keyframes Drawer_drawerSlideOutToRight {
|
|
6862
6857
|
from {
|
|
6863
|
-
transform: translateX(
|
|
6858
|
+
transform: translateX(0);
|
|
6864
6859
|
}
|
|
6865
6860
|
to {
|
|
6866
|
-
transform: translateX(
|
|
6861
|
+
transform: translateX(100%);
|
|
6867
6862
|
}
|
|
6868
6863
|
}
|
|
6869
|
-
@keyframes
|
|
6864
|
+
@keyframes Drawer_drawerSlideInFromLeft {
|
|
6870
6865
|
from {
|
|
6871
|
-
transform:
|
|
6866
|
+
transform: translateX(-100%);
|
|
6872
6867
|
}
|
|
6873
6868
|
to {
|
|
6874
|
-
transform:
|
|
6869
|
+
transform: translateX(0);
|
|
6875
6870
|
}
|
|
6876
6871
|
}
|
|
6877
|
-
@keyframes
|
|
6872
|
+
@keyframes Drawer_drawerSlideOutToLeft {
|
|
6878
6873
|
from {
|
|
6879
|
-
transform:
|
|
6874
|
+
transform: translateX(0);
|
|
6880
6875
|
}
|
|
6881
6876
|
to {
|
|
6882
|
-
transform:
|
|
6877
|
+
transform: translateX(-100%);
|
|
6883
6878
|
}
|
|
6884
6879
|
}
|
|
6885
6880
|
@media (prefers-reduced-motion: reduce) {
|
|
@@ -6909,17 +6904,20 @@ textarea::-moz-focus-inner {
|
|
|
6909
6904
|
--dd-header-pad-block: var(--prime-sys-spacing-x3);
|
|
6910
6905
|
--dd-header-desc-font: var(--prime-sys-size-control-s-supportText);
|
|
6911
6906
|
--dd-separator-stack-pad: var(--prime-sys-spacing-x2);
|
|
6907
|
+
--po-inset-extra: 0px;
|
|
6908
|
+
box-sizing: border-box;
|
|
6912
6909
|
display: flex;
|
|
6913
6910
|
flex-direction: column;
|
|
6914
6911
|
align-items: stretch;
|
|
6915
6912
|
position: fixed;
|
|
6916
6913
|
width: max-content;
|
|
6917
6914
|
max-width: min(var(--prime-sys-unit-20rem), 100vw);
|
|
6915
|
+
margin: 0;
|
|
6918
6916
|
background: var(--prime-sys-color-surface-elevated);
|
|
6919
6917
|
border: none;
|
|
6920
6918
|
border-radius: var(--prime-sys-shape-radius-l);
|
|
6921
6919
|
box-shadow: var(--prime-sys-elevation-shadow-surface), var(--prime-sys-elevation-shadow-modal);
|
|
6922
|
-
padding: var(--dd-pad);
|
|
6920
|
+
padding: calc(var(--dd-pad) + var(--po-inset-extra));
|
|
6923
6921
|
min-width: var(--dd-min-w);
|
|
6924
6922
|
transform-origin: top center;
|
|
6925
6923
|
}
|
|
@@ -7162,7 +7160,7 @@ textarea::-moz-focus-inner {
|
|
|
7162
7160
|
background-color: color-mix(in srgb, var(--prime-sys-color-border-subtle) var(--dropdown-separator-mix), var(--prime-sys-color-surface-elevated));
|
|
7163
7161
|
}
|
|
7164
7162
|
.Dropdown_content > * + * {
|
|
7165
|
-
margin-top: var(--
|
|
7163
|
+
margin-top: var(--dd-pad);
|
|
7166
7164
|
}
|
|
7167
7165
|
.Dropdown_content > .Dropdown_item + .Dropdown_item {
|
|
7168
7166
|
margin-top: 0;
|
|
@@ -7176,7 +7174,7 @@ textarea::-moz-focus-inner {
|
|
|
7176
7174
|
margin-bottom: var(--dd-separator-stack-pad);
|
|
7177
7175
|
}
|
|
7178
7176
|
.Dropdown_content > .Dropdown_block + .Dropdown_block {
|
|
7179
|
-
margin-top: var(--
|
|
7177
|
+
margin-top: var(--dd-pad);
|
|
7180
7178
|
}
|
|
7181
7179
|
.Dropdown_content > .Dropdown_block + .Dropdown_separator {
|
|
7182
7180
|
margin-top: var(--dd-separator-stack-pad);
|