prime-ui-kit 0.7.2 → 0.7.4

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.
Files changed (36) hide show
  1. package/dist/components/drawer/Drawer.d.ts +11 -66
  2. package/dist/components/drawer/Drawer.d.ts.map +1 -1
  3. package/dist/components/drawer/examples/cart-preview.d.ts.map +1 -1
  4. package/dist/components/drawer/examples/explicit-panel.d.ts +1 -1
  5. package/dist/components/drawer/examples/explicit-panel.d.ts.map +1 -1
  6. package/dist/components/drawer/examples/filters-panel.d.ts.map +1 -1
  7. package/dist/components/drawer/examples/mobile-nav-sheet.d.ts +1 -1
  8. package/dist/components/drawer/examples/mobile-nav-sheet.d.ts.map +1 -1
  9. package/dist/components/drawer/examples/settings-side.d.ts +1 -1
  10. package/dist/components/drawer/examples/settings-side.d.ts.map +1 -1
  11. package/dist/components/index.css +77 -82
  12. package/dist/components/index.css.map +3 -3
  13. package/dist/components/index.js +665 -651
  14. package/dist/components/index.js.map +4 -4
  15. package/dist/hooks/useScrollLock.d.ts +1 -1
  16. package/dist/index.css +77 -82
  17. package/dist/index.css.map +3 -3
  18. package/dist/index.js +665 -651
  19. package/dist/index.js.map +4 -4
  20. package/dist/layout/index.d.ts +1 -0
  21. package/dist/layout/index.d.ts.map +1 -1
  22. package/dist/layout/sidebar/Sidebar.d.ts +2 -0
  23. package/dist/layout/sidebar/Sidebar.d.ts.map +1 -1
  24. package/dist/layout/sidebar/SidebarRoot.d.ts +10 -0
  25. package/dist/layout/sidebar/SidebarRoot.d.ts.map +1 -1
  26. package/dist/layout/sidebar/sidebarDesktopStorage.d.ts +5 -0
  27. package/dist/layout/sidebar/sidebarDesktopStorage.d.ts.map +1 -0
  28. package/dist/layout/sidebar/useSidebarNarrowViewport.d.ts +6 -0
  29. package/dist/layout/sidebar/useSidebarNarrowViewport.d.ts.map +1 -0
  30. package/package.json +1 -1
  31. package/src/components/drawer/COMPONENT.md +93 -153
  32. package/src/components/drawer/examples/cart-preview.tsx +43 -38
  33. package/src/components/drawer/examples/explicit-panel.tsx +29 -29
  34. package/src/components/drawer/examples/filters-panel.tsx +45 -40
  35. package/src/components/drawer/examples/mobile-nav-sheet.tsx +35 -30
  36. package/src/components/drawer/examples/settings-side.tsx +47 -42
@@ -2,6 +2,7 @@ export type { AppShellMainProps, AppShellNavProps, AppShellRootProps, AppShellTe
2
2
  export { AppShell } from "./app-shell/AppShell";
3
3
  export type { SidebarContentProps, SidebarFooterProps, SidebarGroupLabelProps, SidebarGroupProps, SidebarHeaderMainProps, SidebarHeaderProps, SidebarHeaderRowProps, SidebarIdentityButtonProps, SidebarMenuActionProps, SidebarMenuButtonProps, SidebarMenuIconProps, SidebarMenuItemProps, SidebarMenuLabelProps, SidebarMenuLinkProps, SidebarMenuProps, SidebarMenuRouterLinkProps, SidebarMenuTrailingProps, SidebarNavCategoryCountProps, SidebarNavCategoryLabelProps, SidebarNavCategoryPanelProps, SidebarNavCategoryProps, SidebarNavCategoryTriggerProps, SidebarNavDocTreeProps, SidebarNavPanelBodyProps, SidebarNavPanelHeadingProps, SidebarNavPanelProps, SidebarResponsive, SidebarRootProps, SidebarSize, SidebarTextProps, SidebarToggleButtonProps, } from "./sidebar/Sidebar";
4
4
  export { Sidebar, useSidebarContext } from "./sidebar/Sidebar";
5
+ export type { StoredSidebarDesktopMode } from "./sidebar/sidebarDesktopStorage";
5
6
  export type { SidebarLayoutMode } from "./sidebar/sidebarLayout";
6
7
  export { SIDEBAR_LAYOUT_BREAKPOINT_MAX, SIDEBAR_MEDIA_QUERY_INLINE, SIDEBAR_MEDIA_QUERY_NARROW, SIDEBAR_MEDIA_QUERY_XS_HIDDEN, } from "./sidebar/sidebarLayout";
7
8
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/layout/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,iBAAiB,EACjB,gBAAgB,EAChB,iBAAiB,EACjB,qBAAqB,GACtB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAChD,YAAY,EACV,mBAAmB,EACnB,kBAAkB,EAClB,sBAAsB,EACtB,iBAAiB,EACjB,sBAAsB,EACtB,kBAAkB,EAClB,qBAAqB,EACrB,0BAA0B,EAC1B,sBAAsB,EACtB,sBAAsB,EACtB,oBAAoB,EACpB,oBAAoB,EACpB,qBAAqB,EACrB,oBAAoB,EACpB,gBAAgB,EAChB,0BAA0B,EAC1B,wBAAwB,EACxB,4BAA4B,EAC5B,4BAA4B,EAC5B,4BAA4B,EAC5B,uBAAuB,EACvB,8BAA8B,EAC9B,sBAAsB,EACtB,wBAAwB,EACxB,2BAA2B,EAC3B,oBAAoB,EACpB,iBAAiB,EACjB,gBAAgB,EAChB,WAAW,EACX,gBAAgB,EAChB,wBAAwB,GACzB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAC/D,YAAY,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AACjE,OAAO,EACL,6BAA6B,EAC7B,0BAA0B,EAC1B,0BAA0B,EAC1B,6BAA6B,GAC9B,MAAM,yBAAyB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/layout/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,iBAAiB,EACjB,gBAAgB,EAChB,iBAAiB,EACjB,qBAAqB,GACtB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAChD,YAAY,EACV,mBAAmB,EACnB,kBAAkB,EAClB,sBAAsB,EACtB,iBAAiB,EACjB,sBAAsB,EACtB,kBAAkB,EAClB,qBAAqB,EACrB,0BAA0B,EAC1B,sBAAsB,EACtB,sBAAsB,EACtB,oBAAoB,EACpB,oBAAoB,EACpB,qBAAqB,EACrB,oBAAoB,EACpB,gBAAgB,EAChB,0BAA0B,EAC1B,wBAAwB,EACxB,4BAA4B,EAC5B,4BAA4B,EAC5B,4BAA4B,EAC5B,uBAAuB,EACvB,8BAA8B,EAC9B,sBAAsB,EACtB,wBAAwB,EACxB,2BAA2B,EAC3B,oBAAoB,EACpB,iBAAiB,EACjB,gBAAgB,EAChB,WAAW,EACX,gBAAgB,EAChB,wBAAwB,GACzB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAC/D,YAAY,EAAE,wBAAwB,EAAE,MAAM,iCAAiC,CAAC;AAChF,YAAY,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AACjE,OAAO,EACL,6BAA6B,EAC7B,0BAA0B,EAC1B,0BAA0B,EAC1B,6BAA6B,GAC9B,MAAM,yBAAyB,CAAC"}
@@ -170,6 +170,7 @@ export declare const Sidebar: React.ForwardRefExoticComponent<Omit<Omit<React.De
170
170
  onOpenChange?: (open: boolean) => void;
171
171
  responsive?: boolean;
172
172
  sidebarSlot?: "page-nav";
173
+ persistStateKey?: string;
173
174
  } & React.RefAttributes<HTMLElement>> & {
174
175
  Root: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, "ref">, "children"> & {
175
176
  children: React.ReactNode;
@@ -186,6 +187,7 @@ export declare const Sidebar: React.ForwardRefExoticComponent<Omit<Omit<React.De
186
187
  onOpenChange?: (open: boolean) => void;
187
188
  responsive?: boolean;
188
189
  sidebarSlot?: "page-nav";
190
+ persistStateKey?: string;
189
191
  } & React.RefAttributes<HTMLElement>>;
190
192
  NavPanel: typeof SidebarNavPanel;
191
193
  NavPanelBody: typeof SidebarNavPanelBody;
@@ -1 +1 @@
1
- {"version":3,"file":"Sidebar.d.ts","sourceRoot":"","sources":["../../../../src/layout/sidebar/Sidebar.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Sidebar.d.ts","sourceRoot":"","sources":["../../../../src/layout/sidebar/Sidebar.tsx"],"names":[],"mappings":"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"}
@@ -24,6 +24,11 @@ export type SidebarRootProps = Omit<React.ComponentPropsWithoutRef<"aside">, "ch
24
24
  onOpenChange?: (open: boolean) => void;
25
25
  responsive?: boolean;
26
26
  sidebarSlot?: "page-nav";
27
+ /**
28
+ * Ключ `localStorage`: запоминаются только режимы рабочего стола `expanded` / `compact`.
29
+ * На узком вьюпорте drawer при загрузке всегда закрыт; при возврате на широкий экран подставляется сохранённый режим.
30
+ */
31
+ persistStateKey?: string;
27
32
  };
28
33
  declare const SidebarRoot: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, "ref">, "children"> & {
29
34
  children: React.ReactNode;
@@ -46,6 +51,11 @@ declare const SidebarRoot: React.ForwardRefExoticComponent<Omit<Omit<React.Detai
46
51
  onOpenChange?: (open: boolean) => void;
47
52
  responsive?: boolean;
48
53
  sidebarSlot?: "page-nav";
54
+ /**
55
+ * Ключ `localStorage`: запоминаются только режимы рабочего стола `expanded` / `compact`.
56
+ * На узком вьюпорте drawer при загрузке всегда закрыт; при возврате на широкий экран подставляется сохранённый режим.
57
+ */
58
+ persistStateKey?: string;
49
59
  } & React.RefAttributes<HTMLElement>>;
50
60
  export { SidebarRoot };
51
61
  //# sourceMappingURL=SidebarRoot.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"SidebarRoot.d.ts","sourceRoot":"","sources":["../../../../src/layout/sidebar/SidebarRoot.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAGrD,OAAO,EAAmB,KAAK,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACtE,OAAO,EACL,KAAK,uBAAuB,EAG5B,KAAK,iBAAiB,EACvB,MAAM,iBAAiB,CAAC;AAEzB,YAAY,EAAE,iBAAiB,EAAE,WAAW,EAAE,CAAC;AAE/C,MAAM,MAAM,gBAAgB,GAAG,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,OAAO,CAAC,EAAE,UAAU,CAAC,GAAG;IACzF,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,KAAK,CAAC,EAAE,iBAAiB,CAAC;IAC1B,YAAY,CAAC,EAAE,iBAAiB,CAAC;IACjC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACnD,kBAAkB;IAClB,IAAI,CAAC,EAAE,iBAAiB,GAAG,uBAAuB,CAAC;IACnD,kBAAkB;IAClB,WAAW,CAAC,EAAE,iBAAiB,GAAG,uBAAuB,CAAC;IAC1D,kBAAkB;IAClB,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAClD,kBAAkB;IAClB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,kBAAkB;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,kBAAkB;IAClB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,UAAU,CAAC;CAC1B,CAAC;AAiBF,QAAA,MAAM,WAAW;cArCL,KAAK,CAAC,SAAS;WAClB,WAAW;WACX,WAAW;YACV,iBAAiB;mBACV,iBAAiB;oBAChB,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI;IAClD,kBAAkB;WACX,iBAAiB,GAAG,uBAAuB;IAClD,kBAAkB;kBACJ,iBAAiB,GAAG,uBAAuB;IACzD,kBAAkB;mBACH,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI;IACjD,kBAAkB;WACX,OAAO;IACd,kBAAkB;kBACJ,OAAO;IACrB,kBAAkB;mBACH,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI;iBACzB,OAAO;kBACN,UAAU;qCAoOxB,CAAC;AAIH,OAAO,EAAE,WAAW,EAAE,CAAC"}
1
+ {"version":3,"file":"SidebarRoot.d.ts","sourceRoot":"","sources":["../../../../src/layout/sidebar/SidebarRoot.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAGrD,OAAO,EAAmB,KAAK,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAEtE,OAAO,EACL,KAAK,uBAAuB,EAG5B,KAAK,iBAAiB,EACvB,MAAM,iBAAiB,CAAC;AAGzB,YAAY,EAAE,iBAAiB,EAAE,WAAW,EAAE,CAAC;AAE/C,MAAM,MAAM,gBAAgB,GAAG,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,OAAO,CAAC,EAAE,UAAU,CAAC,GAAG;IACzF,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,KAAK,CAAC,EAAE,iBAAiB,CAAC;IAC1B,YAAY,CAAC,EAAE,iBAAiB,CAAC;IACjC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACnD,kBAAkB;IAClB,IAAI,CAAC,EAAE,iBAAiB,GAAG,uBAAuB,CAAC;IACnD,kBAAkB;IAClB,WAAW,CAAC,EAAE,iBAAiB,GAAG,uBAAuB,CAAC;IAC1D,kBAAkB;IAClB,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAClD,kBAAkB;IAClB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,kBAAkB;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,kBAAkB;IAClB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,UAAU,CAAC;IACzB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B,CAAC;AAiCF,QAAA,MAAM,WAAW;cA1DL,KAAK,CAAC,SAAS;WAClB,WAAW;WACX,WAAW;YACV,iBAAiB;mBACV,iBAAiB;oBAChB,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI;IAClD,kBAAkB;WACX,iBAAiB,GAAG,uBAAuB;IAClD,kBAAkB;kBACJ,iBAAiB,GAAG,uBAAuB;IACzD,kBAAkB;mBACH,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI;IACjD,kBAAkB;WACX,OAAO;IACd,kBAAkB;kBACJ,OAAO;IACrB,kBAAkB;mBACH,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI;iBACzB,OAAO;kBACN,UAAU;IACxB;;;OAGG;sBACe,MAAM;qCA8PxB,CAAC;AAIH,OAAO,EAAE,WAAW,EAAE,CAAC"}
@@ -0,0 +1,5 @@
1
+ import type { SidebarLayoutMode } from "./sidebarLayout";
2
+ export type StoredSidebarDesktopMode = Extract<SidebarLayoutMode, "expanded" | "compact">;
3
+ export declare function readStoredDesktopMode(key: string): StoredSidebarDesktopMode | null;
4
+ export declare function writeStoredDesktopMode(key: string, mode: StoredSidebarDesktopMode): void;
5
+ //# sourceMappingURL=sidebarDesktopStorage.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"sidebarDesktopStorage.d.ts","sourceRoot":"","sources":["../../../../src/layout/sidebar/sidebarDesktopStorage.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAIzD,MAAM,MAAM,wBAAwB,GAAG,OAAO,CAAC,iBAAiB,EAAE,UAAU,GAAG,SAAS,CAAC,CAAC;AAa1F,wBAAgB,qBAAqB,CAAC,GAAG,EAAE,MAAM,GAAG,wBAAwB,GAAG,IAAI,CAWlF;AAED,wBAAgB,sBAAsB,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,wBAAwB,GAAG,IAAI,CAQxF"}
@@ -0,0 +1,6 @@
1
+ /**
2
+ * Подписка на `(max-width: 47.999rem)` без рассинхрона с эффектом:
3
+ * первый клиентский кадр совпадает с `matchMedia` (в т.ч. после гидрации).
4
+ */
5
+ export declare function useSidebarNarrowViewport(enabled: boolean): boolean;
6
+ //# sourceMappingURL=useSidebarNarrowViewport.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useSidebarNarrowViewport.d.ts","sourceRoot":"","sources":["../../../../src/layout/sidebar/useSidebarNarrowViewport.ts"],"names":[],"mappings":"AAIA;;;GAGG;AACH,wBAAgB,wBAAwB,CAAC,OAAO,EAAE,OAAO,GAAG,OAAO,CAuBlE"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "prime-ui-kit",
3
- "version": "0.7.2",
3
+ "version": "0.7.4",
4
4
  "description": "React 19 UI kit: CSS Modules, semantic design tokens (--prime-sys-*), composable components — forms, modals, selects, tables, navigation, overlays. TypeScript, ESM, a11y-oriented.",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.js",
@@ -1,185 +1,125 @@
1
1
  # Drawer
2
2
 
3
- **Проектирование по умолчанию:** при проектировании экранов и примеров изначально выбирай **`m`** для `size` (где есть ось размера), если явно не оговорено иное.
4
-
5
3
  ## About
6
4
 
7
- A slide-over panel rendered in a portal with a backdrop: page scroll is locked, focus stays inside the dialog until it closes, and siblings of the portal root on `document.body` are marked inert and `aria-hidden` while open.
5
+ `Drawer` модальная боковая панель поверх страницы.
6
+
7
+ Что делает компонент при `open=true`:
8
+ - рендерится в `Portal`;
9
+ - блокирует скролл страницы;
10
+ - закрывается по `Escape`;
11
+ - закрывается по клику на overlay;
12
+ - показывает шапку (иконка, заголовок, подзаголовок), scroll-body и опциональный footer;
13
+ - воспроизводит анимации `slide-in` / `slide-out`.
14
+
15
+ Используйте `Drawer` для вторичных сценариев: фильтры, быстрые формы, детали сущности, action-панели.
16
+
17
+ ## Breaking Change
8
18
 
9
- - **Use** for secondary detail, filters, forms, or actions tied to a screen edge (left/right/top/bottom) without leaving the current view.
10
- - **Use** for bottom or top sheets when the main canvas (for example a map) should stay partly visible.
11
- - **Use** for the same modal-style contract as a dialog (focus trap, blocked background) but with an edge-attached panel instead of a centered box.
12
- - **Do not use** for short confirmations or compact prompts; prefer a centered [Modal](../modal/COMPONENT.md).
13
- - **Do not use** for inline expandable regions; use disclosure or a non-modal sidebar if you should not block the whole page.
14
- - **Do not use** for full page changes driven only by the URL; the kit does not wire routing—control `open` / `onOpenChange` from the app.
19
+ Старый compound API удалён полностью.
15
20
 
16
- ## Composition
21
+ Удалены:
22
+ - `Drawer.Root`
23
+ - `Drawer.Trigger`
24
+ - `Drawer.Portal`
25
+ - `Drawer.Overlay`
26
+ - `Drawer.Content`
27
+ - `Drawer.Body`
28
+ - `Drawer.Header`
29
+ - `Drawer.Title`
30
+ - `Drawer.Footer`
31
+ - `Drawer.Close`
17
32
 
18
- - **`Drawer.Root`** holds open state, `closeOnEscape`, and `closeOnOverlayClick`; wraps everything else.
19
- - **`Drawer.Trigger`** (optional) — exactly one child element; opens on click unless the child’s `onClick` calls `preventDefault`.
20
- - **`Drawer.Portal`** — renders nothing when closed; when open, portals children (default container `document.body` via the internal `Portal`).
21
- - **`Drawer.Overlay`** and the panel surface should be **siblings** inside **`Drawer.Portal`** (backdrop is not a wrapper around the panel). List **`Drawer.Overlay`** before the panel so it stacks under the dialog when `z-index` ties.
22
- - **Panel surface:** at the portal root, **`Drawer.Content`** renders the full dialog shell (`role="dialog"`, focus trap, scroll lock, inert siblings, chrome size for header/footer). For a split where only the middle scrolls, use **`Drawer.Panel`** as the shell and nest **`Drawer.Content`** for the body region — see **`examples/explicit-panel.tsx`**.
23
- - **`Drawer.Header`** → **`Drawer.Title`**, **`Drawer.Body`**, **`Drawer.Footer`** — all **must** be nested inside the panel surface (**`Drawer.Content`** at root or **`Drawer.Panel`**). **`Drawer.Close`** wraps a single control that should close the drawer (often a button in the footer or custom actions).
33
+ Новый API: один компонент `Drawer`.
24
34
 
25
- ### Minimal example
35
+ ## Minimal Example
26
36
 
27
37
  ```tsx
38
+ import * as React from "react";
28
39
  import { Button, Drawer } from "prime-ui-kit";
29
40
 
30
41
  export function DrawerMinimal() {
42
+ const [open, setOpen] = React.useState(false);
43
+
31
44
  return (
32
- <Drawer.Root>
33
- <Drawer.Trigger>
34
- <Button.Root type="button" variant="neutral" mode="stroke">
35
- Open
36
- </Button.Root>
37
- </Drawer.Trigger>
38
- <Drawer.Portal>
39
- <Drawer.Overlay />
40
- <Drawer.Content aria-labelledby="drawer-min-title">
41
- <Drawer.Header>
42
- <Drawer.Title id="drawer-min-title">Panel</Drawer.Title>
43
- </Drawer.Header>
44
- <Drawer.Body>
45
- <p>Content</p>
46
- </Drawer.Body>
47
- </Drawer.Content>
48
- </Drawer.Portal>
49
- </Drawer.Root>
45
+ <>
46
+ <Button.Root type="button" onClick={() => setOpen(true)}>
47
+ Open drawer
48
+ </Button.Root>
49
+
50
+ <Drawer
51
+ open={open}
52
+ onOpenChange={setOpen}
53
+ title="Edit workspace"
54
+ description="Update settings and save changes"
55
+ footer={
56
+ <>
57
+ <Button.Root variant="neutral" mode="stroke" onClick={() => setOpen(false)}>
58
+ Cancel
59
+ </Button.Root>
60
+ <Button.Root variant="primary" onClick={() => setOpen(false)}>
61
+ Save
62
+ </Button.Root>
63
+ </>
64
+ }
65
+ >
66
+ <p>Body content</p>
67
+ </Drawer>
68
+ </>
50
69
  );
51
70
  }
52
71
  ```
53
72
 
54
- ### Playground snippets (source of truth)
55
-
56
- Runnable demos and copy-paste references: `playground/snippets/drawer/*.tsx` (Russian copy in UI; workspace imports use `@/`).
57
-
58
- | File | Intent |
59
- |------|--------|
60
- | `sizes.tsx` | Ladder **`size`** `s`–`xl` on **`Drawer.Content`**; padding, title tier, header close button, and footer controls share one control tier. |
61
- | `variants-sides.tsx` | **`side`** `right` (default), `left`, `bottom`, `top`; top/bottom sheets use capped height (~**`80vh`** in styles) and scroll in **`Drawer.Body`**. |
62
- | `states.tsx` | **`closeOnEscape={false}`** and **`closeOnOverlayClick={false}`** for dismiss only via actions; **`showCloseButton={false}`** on **`Drawer.Header`**. |
63
- | `controlled.tsx` | **`open`** / **`onOpenChange`** on **`Drawer.Root`** without **`Drawer.Trigger`**. |
64
- | `composition.tsx` | Header, **`Input`** in **`Drawer.Body`**, footer with **`Drawer.Close`** on cancel. |
65
- | `full-width.tsx` | Vertical stack in **`Drawer.Footer`** with **`Button.Root`** **`fullWidth`**. |
66
- | `responsive.tsx` | Side width cap **`min(28rem, 90vw)`**; long copy scrolls in **`Drawer.Body`**. |
67
- | `trigger-link.tsx` | **`Drawer.Trigger`** with a single **`LinkButton`** child; opening merges with existing **`onClick`** (e.g. **`preventDefault`** on **`href`**). |
68
- | `features.tsx` | **`Drawer.Portal`** **`container`**, **`aria-label`** on **`Drawer.Content`** without a visible title row, long list scroll inside **`Drawer.Body`**. |
69
-
70
- ### Examples (`examples/`)
71
-
72
- English scenario starters next to this file (workspace **`@/`**; published **`prime-ui-kit`**):
73
-
74
- | File | Intent |
75
- |------|--------|
76
- | `examples/filters-panel.tsx` | Leading-edge filters; scroll criteria, **Apply** / **Reset** in footer. |
77
- | `examples/cart-preview.tsx` | Trailing-edge cart preview; line items scroll; checkout in footer. |
78
- | `examples/settings-side.tsx` | Trailing-edge settings; form fields share drawer **`size`** with chrome. |
79
- | `examples/mobile-nav-sheet.tsx` | Bottom sheet nav; rows wrapped in **`Drawer.Close`**. |
80
- | `examples/explicit-panel.tsx` | **`Drawer.Panel`** shell with inner **`Drawer.Content`** as scroll body only. |
81
-
82
- ## Rules
83
-
84
- - **Controlled vs uncontrolled:** pass `open` and `onOpenChange` for controlled mode; otherwise use `defaultOpen` on `Drawer.Root`. Omit `Drawer.Trigger` when you open/close from parent state only.
85
- - **Closing:** Escape and overlay click update open state by default (and invoke **`onOpenChange`** when controlled). Disable with `closeOnEscape={false}` and/or `closeOnOverlayClick={false}` on `Drawer.Root` for explicit-dismiss-only flows. Escape is handled while the panel is open (same layer as the dialog focus trap). Backdrop close runs only when the click target is the overlay element itself (not bubbled from children).
86
- - **`Drawer.Trigger` / `Drawer.Close`:** each expects **exactly one** React child that accepts an `onClick` handler; the kit merges its handler with yours and respects `preventDefault`.
87
- - **Accessible name:** set `aria-labelledby` on the panel to the `id` of `Drawer.Title`, or `aria-label` when there is no visible title.
88
- - **Header close control:** `showCloseButton={false}` on `Drawer.Header` removes the built-in ghost button (`aria-label` is `"Close drawer"` in code when shown).
89
- - **Sizing:** `size` on the panel (`Drawer.Content` at root or `Drawer.Panel`) is `s` | `m` | `l` | `xl` (default `m`); it drives padding, title scale, and control sizing in chrome via `ControlSizeProvider`. Side panels cap width in CSS (**`min(28rem, 90vw)`**); top/bottom sheets cap height (~**`80vh`**), not separate width/height props.
90
- - **Portal:** `Drawer.Portal` renders `null` while closed, so portal subtree is unmounted when not open.
91
-
92
73
  ## API
93
74
 
94
- ### Drawer.Root
95
-
96
- | Prop | Type | Default | Required | Description |
97
- |------|------|---------|----------|-------------|
98
- | `open` | `boolean` | — | No | Controlled open state. |
99
- | `defaultOpen` | `boolean` | `false` | No | Initial open state when uncontrolled. |
100
- | `onOpenChange` | `(open: boolean) => void` | — | No | Called when open state changes (trigger, dismiss, programmatic). |
101
- | `closeOnEscape` | `boolean` | `true` | No | Close on Escape while the panel is open. |
102
- | `closeOnOverlayClick` | `boolean` | `true` | No | Close when the overlay receives a direct click. |
103
- | `children` | `React.ReactNode` | — | Yes | Tree: trigger, portal, etc. |
104
-
105
- ### Drawer.Trigger
106
-
107
- | Prop | Type | Default | Required | Description |
108
- |------|------|---------|----------|-------------|
109
- | `children` | `React.ReactElement<{ onClick?: React.MouseEventHandler }>` | — | Yes | Single child; click opens unless default prevented. |
110
-
111
- ### Drawer.Close
112
-
113
- | Prop | Type | Default | Required | Description |
114
- |------|------|---------|----------|-------------|
115
- | `children` | `React.ReactElement<{ onClick?: React.MouseEventHandler; className?: string }>` | — | Yes | Single child; click runs your `onClick` then closes unless default prevented. |
116
-
117
- ### Drawer.Portal
118
-
119
- | Prop | Type | Default | Required | Description |
120
- |------|------|---------|----------|-------------|
121
- | `children` | `React.ReactNode` | — | No | Portaled subtree; not mounted when closed. |
122
- | `container` | `HTMLElement \| null` | `document.body` | No | DOM node for `createPortal` (falls back when `null`/omitted per `Portal` implementation). |
123
-
124
- ### Drawer.Overlay
125
-
126
- | Prop | Type | Default | Required | Description |
127
- |------|------|---------|----------|-------------|
128
- | `className` | `string` | — | No | Extra class on the backdrop. |
129
- | `onClick` | `React.MouseEventHandler<HTMLDivElement>` | — | No | Fires before overlay dismiss logic. |
130
- | … | `React.HTMLAttributes<HTMLDivElement>` | — | No | `role="presentation"`; remaining attributes on the backdrop `div`. |
131
-
132
- ### Drawer.Content
133
-
134
- When used as the **direct** child of **`Drawer.Portal`** (after **`Drawer.Overlay`**), renders the dialog panel. When nested **inside** an existing panel, renders the scrollable body region only (see **`examples/explicit-panel.tsx`**).
135
-
136
- | Prop | Type | Default | Required | Description |
137
- |------|------|---------|----------|-------------|
138
- | `side` | `"left" \| "right" \| "bottom" \| "top"` | `"right"` | No | Edge from which the panel enters. |
139
- | `size` | `"s" \| "m" \| "l" \| "xl"` | `"m"` | No | Chrome and spacing tier for header/footer controls (`ControlSizeProvider`). |
140
- | `aria-label` | `string` | — | No | Accessible name when no visible title. |
141
- | `aria-labelledby` | `string` | — | No | `id` of the visible title element. |
142
- | `aria-describedby` | `string` | — | No | `id` of auxiliary description content. |
143
- | `className` | `string` | — | No | Class on the panel or inner body root. |
144
- | `children` | `React.ReactNode` | — | No | Shell slots (header, body, footer) when panel root; scroll content when nested. |
145
- | … | `React.HTMLAttributes<HTMLDivElement>` | — | No | Panel: `role="dialog"`, `aria-modal`, `tabIndex={-1}`, focus trap, scroll lock, inert siblings. |
146
-
147
- ### Drawer.Panel
148
-
149
- Same props as **`Drawer.Content`** when **`Drawer.Content`** is the portal-root panel. Use **`Drawer.Panel`** for explicit shell + inner **`Drawer.Content`** body scrolling — **`examples/explicit-panel.tsx`**.
150
-
151
- ### Drawer.Header
75
+ ### Drawer
152
76
 
153
77
  | Prop | Type | Default | Required | Description |
154
78
  |------|------|---------|----------|-------------|
155
- | `showCloseButton` | `boolean` | `true` | No | Built-in ghost close control (neutral) on the right. |
156
- | `className` | `string` | — | No | Class on the `<header>`. |
157
- | `children` | `React.ReactNode` | — | No | Usually **`Drawer.Title`**; area left of the close control. |
158
- | | `React.HTMLAttributes<HTMLElement>` | — | No | Native `<header>` attributes. |
79
+ | `open` | `boolean` | | Yes | Контролируемое состояние открытия. |
80
+ | `onOpenChange` | `(open: boolean) => void` | — | Yes | Вызывается при закрытии/открытии (Esc, overlay, крестик, внешние действия). |
81
+ | `title` | `React.ReactNode` | — | Yes | Заголовок в шапке. |
82
+ | `description` | `React.ReactNode` | — | No | Подзаголовок в шапке. |
83
+ | `icon` | `React.ReactNode` | — | No | Иконка слева в шапке. |
84
+ | `children` | `React.ReactNode` | — | Yes | Контент body внутри `ScrollContainer`. |
85
+ | `footer` | `React.ReactNode` | — | No | Контент футера (обычно кнопки `Cancel` / `Save`). |
86
+ | `side` | `'left' \| 'right'` | `'right'` | No | Сторона выезда панели. |
87
+ | `className` | `string` | — | No | Дополнительный класс панели. |
88
+ | `overlayClassName` | `string` | — | No | Дополнительный класс overlay. |
159
89
 
160
- ### Drawer.Title
90
+ ## Rules
161
91
 
162
- | Prop | Type | Default | Required | Description |
163
- |------|------|---------|----------|-------------|
164
- | `className` | `string` | | No | Class on the `<h2>`. |
165
- | `children` | `React.ReactNode` | — | No | Title text; set `id` for `aria-labelledby` on the panel. |
166
- | | `React.HTMLAttributes<HTMLHeadingElement>` | | No | Renders `<h2>`. |
92
+ - Компонент только контролируемый: состояние хранится в родителе (`open`, `onOpenChange`).
93
+ - `side` поддерживает только `left` и `right`.
94
+ - Шапка всегда содержит кнопку закрытия (крестик) справа.
95
+ - Footer опционален: если `footer` не передан, нижняя зона не рендерится.
96
+ - Для доступности `aria-labelledby`/`aria-describedby` формируются автоматически из `title`/`description`.
167
97
 
168
- ### Drawer.Body
98
+ ## Playground snippets
169
99
 
170
- | Prop | Type | Default | Required | Description |
171
- |------|------|---------|----------|-------------|
172
- | `className` | `string` | — | No | Class on the scroll container root. |
173
- | `children` | `React.ReactNode` | — | No | Main content; vertical scroll when overflowing. |
174
- | … | `React.HTMLAttributes<HTMLDivElement>` | — | No | Scrollable body via `ScrollContainer`. |
100
+ Source of truth: `playground/snippets/drawer/*.tsx`.
175
101
 
176
- ### Drawer.Footer
102
+ | File | Intent |
103
+ |------|--------|
104
+ | `controlled.tsx` | Базовый контролируемый сценарий `open` / `onOpenChange`. |
105
+ | `composition.tsx` | Форма в body + действия в footer. |
106
+ | `variants-sides.tsx` | Сравнение `side='left'` и `side='right'`. |
107
+ | `states.tsx` | Варианты с footer и без footer. |
108
+ | `full-width.tsx` | Вертикальный стек `fullWidth` кнопок в footer. |
109
+ | `responsive.tsx` | Поведение ширины панели (`min(28rem, 90vw)`). |
110
+ | `trigger-link.tsx` | Открытие из `LinkButton` через внешний `setOpen(true)`. |
111
+ | `features.tsx` | Длинный scroll-body и шапка с иконкой/description. |
112
+ | `sizes.tsx` | Паттерны расположения и действий для левой/правой панели. |
113
+
114
+ ## Examples (`examples/`)
177
115
 
178
- | Prop | Type | Default | Required | Description |
179
- |------|------|---------|----------|-------------|
180
- | `className` | `string` | | No | Class on the `<footer>`. |
181
- | `children` | `React.ReactNode` | | No | Action row; controls use **`ControlSizeProvider`** from panel **`size`**. |
182
- | … | `React.HTMLAttributes<HTMLElement>` | | No | Renders `<footer>`. |
116
+ | File | Intent |
117
+ |------|--------|
118
+ | `examples/filters-panel.tsx` | Левая панель фильтров с действиями Apply/Reset. |
119
+ | `examples/cart-preview.tsx` | Правая панель корзины с checkout-действиями. |
120
+ | `examples/settings-side.tsx` | Правая панель настроек формы. |
121
+ | `examples/mobile-nav-sheet.tsx` | Навигационные действия с закрытием по клику на пункт. |
122
+ | `examples/explicit-panel.tsx` | Канонический сценарий новой шапки/body/footer. |
183
123
 
184
124
  ## Related
185
125
 
@@ -1,5 +1,8 @@
1
+ import * as React from "react";
2
+
1
3
  import { Button } from "@/components/button/Button";
2
4
  import { Drawer } from "@/components/drawer/Drawer";
5
+ import { Icon } from "@/icons";
3
6
 
4
7
  import styles from "./examples-scenarios.module.css";
5
8
 
@@ -12,44 +15,46 @@ const lines = [
12
15
  * Trailing-edge preview of the cart: scroll line items; primary checkout stays in the footer.
13
16
  */
14
17
  export default function DrawerExampleCartPreview() {
18
+ const [open, setOpen] = React.useState(false);
19
+
15
20
  return (
16
- <Drawer.Root>
17
- <Drawer.Trigger>
18
- <Button.Root type="button" variant="neutral" mode="stroke">
19
- Cart (3)
20
- </Button.Root>
21
- </Drawer.Trigger>
22
- <Drawer.Portal>
23
- <Drawer.Overlay />
24
- <Drawer.Content side="right" aria-labelledby="drawer-cart-title">
25
- <Drawer.Header>
26
- <Drawer.Title id="drawer-cart-title">Your cart</Drawer.Title>
27
- </Drawer.Header>
28
- <Drawer.Body>
29
- {lines.map((line) => (
30
- <div key={line.title} className={styles.cartLine}>
31
- <div className={styles.cartLineMain}>
32
- <p className={styles.cartTitle}>{line.title}</p>
33
- <p className={styles.cartPrice}>{line.price}</p>
34
- </div>
35
- <p className={styles.cartMeta}>{line.meta}</p>
36
- </div>
37
- ))}
38
- </Drawer.Body>
39
- <Drawer.Footer className={styles.footerActions}>
40
- <Drawer.Close>
41
- <Button.Root type="button" variant="neutral" mode="stroke">
42
- View cart
43
- </Button.Root>
44
- </Drawer.Close>
45
- <Drawer.Close>
46
- <Button.Root type="button" variant="primary">
47
- Checkout
48
- </Button.Root>
49
- </Drawer.Close>
50
- </Drawer.Footer>
51
- </Drawer.Content>
52
- </Drawer.Portal>
53
- </Drawer.Root>
21
+ <>
22
+ <Button.Root type="button" variant="neutral" mode="stroke" onClick={() => setOpen(true)}>
23
+ Cart (3)
24
+ </Button.Root>
25
+ <Drawer
26
+ open={open}
27
+ onOpenChange={setOpen}
28
+ side="right"
29
+ title="Your cart"
30
+ description="2 products ready for checkout"
31
+ icon={<Icon name="nav.itemDot" tone="subtle" />}
32
+ footer={
33
+ <div className={styles.footerActions}>
34
+ <Button.Root
35
+ type="button"
36
+ variant="neutral"
37
+ mode="stroke"
38
+ onClick={() => setOpen(false)}
39
+ >
40
+ View cart
41
+ </Button.Root>
42
+ <Button.Root type="button" variant="primary" onClick={() => setOpen(false)}>
43
+ Checkout
44
+ </Button.Root>
45
+ </div>
46
+ }
47
+ >
48
+ {lines.map((line) => (
49
+ <div key={line.title} className={styles.cartLine}>
50
+ <div className={styles.cartLineMain}>
51
+ <p className={styles.cartTitle}>{line.title}</p>
52
+ <p className={styles.cartPrice}>{line.price}</p>
53
+ </div>
54
+ <p className={styles.cartMeta}>{line.meta}</p>
55
+ </div>
56
+ ))}
57
+ </Drawer>
58
+ </>
54
59
  );
55
60
  }
@@ -1,40 +1,40 @@
1
+ import * as React from "react";
2
+
1
3
  import { Button } from "@/components/button/Button";
2
4
  import { Drawer } from "@/components/drawer/Drawer";
5
+ import { Icon } from "@/icons";
3
6
 
4
7
  import styles from "./examples-scenarios.module.css";
5
8
 
6
9
  /**
7
- * Extended composition: `Drawer.Panel` exposes the shell explicitly; inner `Drawer.Content` is only the scroll region.
10
+ * Canonical new API with icon + subtitle in header and actions in footer.
8
11
  */
9
12
  export default function DrawerExampleExplicitPanel() {
13
+ const [open, setOpen] = React.useState(false);
14
+
10
15
  return (
11
- <Drawer.Root>
12
- <Drawer.Trigger>
13
- <Button.Root type="button" variant="neutral" mode="stroke">
14
- Open explicit panel
15
- </Button.Root>
16
- </Drawer.Trigger>
17
- <Drawer.Portal>
18
- <Drawer.Overlay />
19
- <Drawer.Panel side="right" aria-labelledby="drawer-explicit-title">
20
- <Drawer.Header>
21
- <Drawer.Title id="drawer-explicit-title">Details</Drawer.Title>
22
- </Drawer.Header>
23
- <Drawer.Content>
24
- <p className={styles.intro}>
25
- This body uses <code>Drawer.Content</code> inside <code>Drawer.Panel</code> so only
26
- this region scrolls when content overflows.
27
- </p>
28
- </Drawer.Content>
29
- <Drawer.Footer>
30
- <Drawer.Close>
31
- <Button.Root type="button" variant="neutral" mode="stroke">
32
- Close
33
- </Button.Root>
34
- </Drawer.Close>
35
- </Drawer.Footer>
36
- </Drawer.Panel>
37
- </Drawer.Portal>
38
- </Drawer.Root>
16
+ <>
17
+ <Button.Root type="button" variant="neutral" mode="stroke" onClick={() => setOpen(true)}>
18
+ Open details
19
+ </Button.Root>
20
+ <Drawer
21
+ open={open}
22
+ onOpenChange={setOpen}
23
+ title="Details"
24
+ description="Only body scrolls when content overflows"
25
+ icon={<Icon name="nav.layoutGrid" tone="subtle" />}
26
+ side="right"
27
+ footer={
28
+ <Button.Root type="button" variant="neutral" mode="stroke" onClick={() => setOpen(false)}>
29
+ Close
30
+ </Button.Root>
31
+ }
32
+ >
33
+ <p className={styles.intro}>
34
+ This drawer uses the new single-component API: header with icon/title/description,
35
+ scrollable content area, and footer actions.
36
+ </p>
37
+ </Drawer>
38
+ </>
39
39
  );
40
40
  }