@shmidko61/lc-ui-kit 0.16.1 → 0.17.1

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/README.md CHANGED
@@ -7,24 +7,41 @@
7
7
  Из каталога `apps`:
8
8
 
9
9
  ```bash
10
- corepack pnpm --filter @shmidko61/lc-ui-kit verify:package
10
+ corepack pnpm release:check:ui-kit
11
11
  ```
12
12
 
13
- Команда последовательно проверяет типы исходников, ESLint (включая Storybook),
14
- форматирование, production-сборку, публичные типы с `skipLibCheck: false`,
15
- саму защиту релиза на негативных примерах, ESM/CJS exports, все `.d.ts`,
16
- production safelist, hover, состав npm tarball и сборку Storybook.
17
-
18
- `prepublishOnly` запускает тот же `verify:package`. Если любая стадия падает,
19
- проверка завершается с ненулевым кодом и публикация не продолжается.
20
- `pack:check` использует локальный `npm pack --dry-run --ignore-scripts`:
21
- авторизация в registry не требуется, lifecycle не запускается повторно.
22
-
23
- Отдельные проверки доступны как `typecheck`, `lint`, `format:check`,
24
- `typecheck:package`, `test:checks`, `test:package`, `test:hover`, `pack:check`
25
- `test:states` и `storybook:build`. Проверки собранного пакета запускаются после `build`.
26
- ESLint использует отдельный `tsconfig.eslint.json`; конфигурация source
27
- typecheck и публичные props компонентов не меняются.
13
+ Команда устанавливает зависимости по frozen lockfile, удаляет старый `dist`,
14
+ запускает lint, typecheck, тесты, сборку и Storybook. Затем `npm pack` создаёт
15
+ реальный tarball в `.release/ui-kit`; пакет устанавливается в отдельный временный
16
+ consumer без workspace-ссылок. Зависимости consumer фиксирует собственный
17
+ `package-lock.json`.
18
+
19
+ Проверяются все exports (ESM/CJS/types), декларации, файлы stylesheet, safelist,
20
+ каждый CSS-файл через Lightning CSS с минификацией и запрет `${…}` в декларациях
21
+ CSS. Consumer компилирует `contentInnerProps`, padding заголовка, md/lg/xl и
22
+ собирается на Vite 7.3.6 и 8.3.5 с `cssMinify: 'lightningcss'`. Chromium проверяет
23
+ реальный padding, нулевые значения, responsive/reset/style, клавиатуру, ARIA,
24
+ динамическую высоту и анимации на всех breakpoint. Негативные регрессии проверяют
25
+ невалидный CSS и исчезновение публичного prop.
26
+
27
+ Для браузерных проверок Chromium устанавливается автоматически. Можно задать
28
+ `CHROME_BIN` на существующий Chrome. На Linux нужны системные зависимости
29
+ Playwright/Chromium (в CI используется Chrome из ubuntu-latest).
30
+ При ошибке лог содержит этап `[release:…]` и путь consumer для диагностики.
31
+
32
+ `corepack pnpm publish:ui-kit` проверяет npm-пользователя, выполняет весь pipeline
33
+ и публикует **тот же tarball**, сверяя SHA-256 с `verified.json`. Повторной сборки
34
+ между проверкой и публикацией нет. Ввода PUBLISH нет; npm может запросить 2FA.
35
+ Прямая публикация из каталога пакета блокируется `prepublishOnly`.
36
+
37
+ CI workflow **UI-kit artifact gate** выполняет обязательный verify job;
38
+ публикация при ручном запуске с `publish=true` зависит от него и скачивает
39
+ проверенный tarball. Для npm нужен секрет `NPM_TOKEN`. Чтобы запретить merge при
40
+ ошибке, назначьте job `verify` обязательным в branch protection репозитория.
41
+ Никакие проверки не используют `allow_failure`/`continue-on-error`.
42
+
43
+ `verify:package` остаётся быстрым набором локальных проверок исходников и dist;
44
+ он не заменяет обязательную проверку релизного tarball.
28
45
 
29
46
  ## Установка
30
47
 
@@ -219,3 +236,33 @@ Box/Flex поддерживают типизированный `scrollbar` в ba
219
236
  CSS-размеры, частичное наследование и сброс через `null`. Оформление не включает
220
237
  overflow. [API и ограничения](./src/box/README.md). Storybook: **UI Kit / Scrollbar**
221
238
  (16 примеров, включая вложенность, сбросы и style escape hatch).
239
+
240
+ ## Accordion: внутренняя обёртка
241
+
242
+ `Accordion.Item.contentInnerProps` настраивает внутренний Box через BoxProps,
243
+ включая `p: 0`, размеры, оформление и `md`/`lg`/`xl`. По умолчанию остаётся
244
+ `p={{ px: 24, pb: 24 }}`; `style` имеет приоритет. `contentProps` управляет
245
+ внешней анимированной панелью. Объектные responsive overrides наследуют
246
+ незаданные стороны от предыдущего breakpoint; `p: 0` сбрасывает все стороны.
247
+
248
+ ```tsx
249
+ import { Accordion } from '@shmidko61/lc-ui-kit/accordion';
250
+ import { Typography } from '@shmidko61/lc-ui-kit/typography';
251
+ import '@shmidko61/lc-ui-kit/styles.css';
252
+
253
+ export function Question() {
254
+ return (
255
+ <Accordion defaultExpandedKeys={['question']}>
256
+ <Accordion.Item
257
+ id="question"
258
+ title="Вопрос"
259
+ contentInnerProps={{ p: 0, lg: { p: { pt: 16, pb: 8 } }, xl: { p: 0 } }}
260
+ >
261
+ <Typography>Ответ</Typography>
262
+ </Accordion.Item>
263
+ </Accordion>
264
+ );
265
+ }
266
+ ```
267
+
268
+ Storybook: **UI Kit / Accordion / ContentInner**.
@@ -41,8 +41,15 @@ export type AccordionItemProps = PropsWithChildren<AccordionItemHeaderProps & {
41
41
  headingWrapper?: ComponentType<AccordionItemRenderProps>;
42
42
  /** Props внешнего контейнера item. */
43
43
  itemProps?: AccordionItemBoxProps;
44
- /** Props panel с раскрываемым контентом. */
44
+ /** Props внешней анимированной panel; не задают отступы внутренней обёртки. */
45
45
  contentProps?: AccordionItemContentProps;
46
+ /**
47
+ * Props внутреннего Box: отступы, размеры, оформление и md/lg/xl по контракту BoxProps.
48
+ * По умолчанию p={ px: 24, pb: 24 }; переданный p заменяет его целиком, включая 0.
49
+ * Responsive overrides наследуются как в Box; p: 0 сбрасывает отступы.
50
+ * className и HTML props передаются напрямую; явный style имеет приоритет над style props.
51
+ */
52
+ contentInnerProps?: AccordionItemBoxProps;
46
53
  }>;
47
- export declare function AccordionItem({ children, className, contentProps, duration, headingWrapper: HeadingWrapper, hideIndicator, id, indicator, indicatorProps, isDisabled, isExpanded, itemProps, leading, onToggle, subtitle, surface, title, trailing, variant, ...headerProps }: AccordionItemProps): JSX.Element;
54
+ export declare function AccordionItem({ children, className, contentProps, contentInnerProps, duration, headingWrapper: HeadingWrapper, hideIndicator, id, indicator, indicatorProps, isDisabled, isExpanded, itemProps, leading, onToggle, subtitle, surface, title, trailing, variant, ...headerProps }: AccordionItemProps): JSX.Element;
48
55
  export {};
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("react"),v=require("react-aria"),P=require("react-stately/useDisclosureState"),n=require("./box.cjs"),l=require("./flex.cjs"),ee=require("./icons.cjs"),x=require("./responsive-style.config-B2m9jVlX.cjs"),E=require("./typography.cjs"),te=require("react-stately/useDisclosureGroupState"),R=i.createContext(null);function ne(){const t=i.useContext(R);if(!t)throw new Error("Accordion.Item должен использоваться внутри Accordion.");return t}function se({children:t}){return e.jsx(l.Flex,{align:"center",gap:16,justify:"space-between",width:"100%",children:t})}function k({children:t,className:p,contentProps:a,duration:d=200,headingWrapper:g=se,hideIndicator:f=!1,id:y,indicator:m,indicatorProps:s,isDisabled:I=!1,isExpanded:_,itemProps:o,leading:w,onToggle:F,subtitle:S,surface:b="card",title:W,trailing:D,variant:N="primary",...u}){const G=i.useId(),h=y??G,j=ne(),K=String(h),T=j.expandedKeys.has(h),O=_??T,c=j.isDisabled||I,A=i.useRef(null),B=i.useRef(null),r=P.useDisclosureState({isExpanded:O,onExpandedChange:Z=>{c||(j.toggleKey(h),F?.(Z))}}),{buttonProps:Y,panelProps:q}=v.useDisclosure({isDisabled:c},r,A),{buttonProps:$}=v.useButton(Y,B),z=a?.className,H=a?.style,M=q.style,J=o?.bg??(b==="card"?"--color-background-default":void 0),L=b==="card"?{radius:"16px",style:"none",width:"0",...o?.border}:o?.border,Q=o?.className,U=o?.style,V=u.style,X={...M,height:"var(--disclosure-panel-height)",opacity:r.isExpanded?1:0,transitionDuration:`${d}ms`,...H};return e.jsxs(n.Box,{"data-disabled":c||void 0,"data-state":r.isExpanded?"open":"closed","data-value":K,...o,bg:J,border:L,className:x.cn("grid min-w-0",b==="card"?"gap-0 overflow-hidden":"gap-[24px]",c&&"opacity-50",Q),style:U,children:[e.jsx(n.Box,{...v.mergeProps($,u),as:"button",border:{radius:"16px",style:"none",width:"0",...u.border},className:x.cn("group/accordion-trigger w-full text-left outline-none transition-colors disabled:cursor-not-allowed","focus-visible:ring-2 focus-visible:ring-[color-mix(in_srgb,var(--color-primary-accent)_35%,transparent)] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--color-background-default)]",N==="primary"&&"bg-[var(--color-background-default)]",N==="secondary"&&"bg-transparent",p),cursor:c?"not-allowed":"pointer","data-state":r.isExpanded?"open":"closed",p:u.p??24,ref:B,style:V,type:"button",children:e.jsxs(g,{children:[e.jsxs(l.Flex,{align:"center",gap:16,minWidth:0,children:[w?e.jsx(n.Box,{as:"span",className:"flex shrink-0 items-center justify-center text-[var(--color-text-primary)] [&_svg]:size-[20px]",children:w}):null,e.jsxs(l.Flex,{flexDirection:"column",gap:8,minWidth:0,children:[e.jsx(E.Typography,{as:"span",className:"truncate",variant:"h4",children:W}),S?e.jsx(E.Typography,{as:"span",className:"truncate",color:"--color-text-secondary",variant:"b2",children:S}):null]})]}),e.jsxs(l.Flex,{align:"center",gap:12,shrink:0,children:[D?e.jsx(n.Box,{as:"span",children:D}):null,f?null:e.jsx(n.Box,{...s,as:"span",bg:s?.bg??"--color-background-default",border:s?.border??{radius:"8px"},style:s?.style,className:x.cn(s?"flex items-center justify-center":"flex min-h-[41px] min-w-[41px] items-center justify-center text-[var(--color-text-primary)] transition-colors group-hover/accordion-trigger:bg-[color-mix(in_srgb,var(--color-background-default)_90%,#000)]",s?.className),children:m??e.jsx(ee.DropDown,{"aria-hidden":"true",className:"h-[12px] w-[12px] transition-transform",style:{transform:r.isExpanded?"translateY(-2px) rotate(180deg)":"translateY(2px) rotate(0deg)",transitionDuration:`${d}ms`}})})]})]})}),e.jsx(n.Box,{...q,...a,className:x.cn("overflow-hidden text-[var(--color-text-secondary)] transition-[height,opacity]",z),"data-state":r.isExpanded?"open":"closed",ref:A,style:X,children:e.jsx(n.Box,{p:{px:24,pb:24},children:t})})]})}function C({allowsMultipleExpanded:t=!1,children:p,defaultExpandedKeys:a,expandedKeys:d,isDisabled:g=!1,onExpandedChange:f,...y}){const m=te.useDisclosureGroupState({allowsMultipleExpanded:t,defaultExpandedKeys:a,expandedKeys:d,isDisabled:g,onExpandedChange:f});return e.jsx(R.Provider,{value:m,children:e.jsx(l.Flex,{flexDirection:"column",gap:24,width:"100%",...y,children:p})})}const oe=Object.assign(C,{Item:k});exports.Accordion=oe;exports.AccordionItem=k;exports.AccordionRoot=C;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("react"),v=require("react-aria"),ee=require("react-stately/useDisclosureState"),s=require("./box.cjs"),l=require("./flex.cjs"),te=require("./icons.cjs"),p=require("./responsive-style.config-B2m9jVlX.cjs"),E=require("./typography.cjs"),se=require("react-stately/useDisclosureGroupState"),R=i.createContext(null);function ne(){const t=i.useContext(R);if(!t)throw new Error("Accordion.Item должен использоваться внутри Accordion.");return t}function oe({children:t}){return e.jsx(l.Flex,{align:"center",gap:16,justify:"space-between",width:"100%",children:t})}function k({children:t,className:g,contentProps:a,contentInnerProps:d,duration:u=200,headingWrapper:f=oe,hideIndicator:y=!1,id:m,indicator:I,indicatorProps:n,isDisabled:_=!1,isExpanded:F,itemProps:o,leading:w,onToggle:W,subtitle:S,surface:b="card",title:G,trailing:D,variant:N="primary",...x}){const K=i.useId(),h=m??K,j=ne(),T=String(h),O=j.expandedKeys.has(h),Y=F??O,c=j.isDisabled||_,A=i.useRef(null),B=i.useRef(null),r=ee.useDisclosureState({isExpanded:Y,onExpandedChange:P=>{c||(j.toggleKey(h),W?.(P))}}),{buttonProps:$,panelProps:q}=v.useDisclosure({isDisabled:c},r,A),{buttonProps:z}=v.useButton($,B),H=a?.className,M=a?.style,J=q.style,L=o?.bg??(b==="card"?"--color-background-default":void 0),Q=b==="card"?{radius:"16px",style:"none",width:"0",...o?.border}:o?.border,U=o?.className,V=o?.style,X=x.style,Z={...J,height:"var(--disclosure-panel-height)",opacity:r.isExpanded?1:0,transitionDuration:`${u}ms`,...M};return e.jsxs(s.Box,{"data-disabled":c||void 0,"data-state":r.isExpanded?"open":"closed","data-value":T,...o,bg:L,border:Q,className:p.cn("grid min-w-0",b==="card"?"gap-0 overflow-hidden":"gap-[24px]",c&&"opacity-50",U),style:V,children:[e.jsx(s.Box,{...v.mergeProps(z,x),as:"button",border:{radius:"16px",style:"none",width:"0",...x.border},className:p.cn("group/accordion-trigger w-full text-left outline-none transition-colors disabled:cursor-not-allowed","focus-visible:ring-2 focus-visible:ring-[color-mix(in_srgb,var(--color-primary-accent)_35%,transparent)] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--color-background-default)]",N==="primary"&&"bg-[var(--color-background-default)]",N==="secondary"&&"bg-transparent",g),cursor:c?"not-allowed":"pointer","data-state":r.isExpanded?"open":"closed",p:x.p??24,ref:B,style:X,type:"button",children:e.jsxs(f,{children:[e.jsxs(l.Flex,{align:"center",gap:16,minWidth:0,children:[w?e.jsx(s.Box,{as:"span",className:"flex shrink-0 items-center justify-center text-[var(--color-text-primary)] [&_svg]:size-[20px]",children:w}):null,e.jsxs(l.Flex,{flexDirection:"column",gap:8,minWidth:0,children:[e.jsx(E.Typography,{as:"span",className:"truncate",variant:"h4",children:G}),S?e.jsx(E.Typography,{as:"span",className:"truncate",color:"--color-text-secondary",variant:"b2",children:S}):null]})]}),e.jsxs(l.Flex,{align:"center",gap:12,shrink:0,children:[D?e.jsx(s.Box,{as:"span",children:D}):null,y?null:e.jsx(s.Box,{...n,as:"span",bg:n?.bg??"--color-background-default",border:n?.border??{radius:"8px"},style:n?.style,className:p.cn(n?"flex items-center justify-center":"flex min-h-[41px] min-w-[41px] items-center justify-center text-[var(--color-text-primary)] transition-colors group-hover/accordion-trigger:bg-[color-mix(in_srgb,var(--color-background-default)_90%,#000)]",n?.className),children:I??e.jsx(te.DropDown,{"aria-hidden":"true",className:"h-[12px] w-[12px] transition-transform",style:{transform:r.isExpanded?"translateY(-2px) rotate(180deg)":"translateY(2px) rotate(0deg)",transitionDuration:`${u}ms`}})})]})]})}),e.jsx(s.Box,{...q,...a,className:p.cn("overflow-hidden text-[var(--color-text-secondary)] transition-[height,opacity]",H),"data-state":r.isExpanded?"open":"closed",ref:A,style:Z,children:e.jsx(s.Box,{...d,p:d?.p??{px:24,pb:24},children:t})})]})}function C({allowsMultipleExpanded:t=!1,children:g,defaultExpandedKeys:a,expandedKeys:d,isDisabled:u=!1,onExpandedChange:f,...y}){const m=se.useDisclosureGroupState({allowsMultipleExpanded:t,defaultExpandedKeys:a,expandedKeys:d,isDisabled:u,onExpandedChange:f});return e.jsx(R.Provider,{value:m,children:e.jsx(l.Flex,{flexDirection:"column",gap:24,width:"100%",...y,children:g})})}const re=Object.assign(C,{Item:k});exports.Accordion=re;exports.AccordionItem=k;exports.AccordionRoot=C;
package/dist/accordion.js CHANGED
@@ -1,108 +1,109 @@
1
1
  import { jsxs as c, jsx as e } from "react/jsx-runtime";
2
- import { createContext as X, useContext as Z, useId as P, useRef as k } from "react";
3
- import { useDisclosure as ee, useButton as te, mergeProps as re } from "react-aria";
2
+ import { createContext as Z, useContext as P, useId as ee, useRef as k } from "react";
3
+ import { useDisclosure as te, useButton as re, mergeProps as oe } from "react-aria";
4
4
  import { useDisclosureState as ne } from "react-stately/useDisclosureState";
5
5
  import { Box as r } from "./box.js";
6
6
  import { Flex as l } from "./flex.js";
7
- import { DropDown as oe } from "./icons.js";
8
- import { c as p } from "./responsive-style.config-DFuATrIM.js";
7
+ import { DropDown as ae } from "./icons.js";
8
+ import { c as m } from "./responsive-style.config-DFuATrIM.js";
9
9
  import { Typography as C } from "./typography.js";
10
10
  import { useDisclosureGroupState as se } from "react-stately/useDisclosureGroupState";
11
- const B = X(null);
12
- function ae() {
13
- const t = Z(B);
11
+ const B = Z(null);
12
+ function ie() {
13
+ const t = P(B);
14
14
  if (!t)
15
15
  throw new Error("Accordion.Item должен использоваться внутри Accordion.");
16
16
  return t;
17
17
  }
18
- function ie({ children: t }) {
18
+ function ce({ children: t }) {
19
19
  return /* @__PURE__ */ e(l, { align: "center", gap: 16, justify: "space-between", width: "100%", children: t });
20
20
  }
21
- function ce({
21
+ function le({
22
22
  children: t,
23
- className: m,
24
- contentProps: a,
25
- duration: d = 200,
26
- headingWrapper: f = ie,
27
- hideIndicator: g = !1,
28
- id: x,
29
- indicator: y,
30
- indicatorProps: n,
31
- isDisabled: I = !1,
32
- isExpanded: _,
33
- itemProps: o,
23
+ className: f,
24
+ contentProps: s,
25
+ contentInnerProps: d,
26
+ duration: u = 200,
27
+ headingWrapper: g = ce,
28
+ hideIndicator: x = !1,
29
+ id: y,
30
+ indicator: I,
31
+ indicatorProps: o,
32
+ isDisabled: _ = !1,
33
+ isExpanded: R,
34
+ itemProps: n,
34
35
  leading: w,
35
- onToggle: R,
36
+ onToggle: W,
36
37
  subtitle: N,
37
38
  surface: b = "card",
38
- title: W,
39
+ title: K,
39
40
  trailing: D,
40
41
  variant: S = "primary",
41
- ...u
42
+ ...p
42
43
  }) {
43
- const K = P(), h = x ?? K, v = ae(), G = String(h), Y = v.expandedKeys.has(h), $ = _ ?? Y, i = v.isDisabled || I, A = k(null), E = k(null), s = ne({
44
- isExpanded: $,
45
- onExpandedChange: (V) => {
46
- i || (v.toggleKey(h), R?.(V));
44
+ const G = ee(), h = y ?? G, v = ie(), Y = String(h), $ = v.expandedKeys.has(h), z = R ?? $, i = v.isDisabled || _, A = k(null), E = k(null), a = ne({
45
+ isExpanded: z,
46
+ onExpandedChange: (X) => {
47
+ i || (v.toggleKey(h), W?.(X));
47
48
  }
48
- }), { buttonProps: z, panelProps: j } = ee(
49
+ }), { buttonProps: F, panelProps: j } = te(
49
50
  { isDisabled: i },
50
- s,
51
+ a,
51
52
  A
52
- ), { buttonProps: F } = te(z, E), H = a?.className, O = a?.style, T = j.style, q = o?.bg ?? (b === "card" ? "--color-background-default" : void 0), J = b === "card" ? {
53
+ ), { buttonProps: H } = re(F, E), O = s?.className, T = s?.style, q = j.style, J = n?.bg ?? (b === "card" ? "--color-background-default" : void 0), L = b === "card" ? {
53
54
  radius: "16px",
54
55
  style: "none",
55
56
  width: "0",
56
- ...o?.border
57
- } : o?.border, L = o?.className, M = o?.style, Q = u.style, U = {
58
- ...T,
57
+ ...n?.border
58
+ } : n?.border, M = n?.className, Q = n?.style, U = p.style, V = {
59
+ ...q,
59
60
  height: "var(--disclosure-panel-height)",
60
- opacity: s.isExpanded ? 1 : 0,
61
- transitionDuration: `${d}ms`,
62
- ...O
61
+ opacity: a.isExpanded ? 1 : 0,
62
+ transitionDuration: `${u}ms`,
63
+ ...T
63
64
  };
64
65
  return /* @__PURE__ */ c(
65
66
  r,
66
67
  {
67
68
  "data-disabled": i || void 0,
68
- "data-state": s.isExpanded ? "open" : "closed",
69
- "data-value": G,
70
- ...o,
71
- bg: q,
72
- border: J,
73
- className: p(
69
+ "data-state": a.isExpanded ? "open" : "closed",
70
+ "data-value": Y,
71
+ ...n,
72
+ bg: J,
73
+ border: L,
74
+ className: m(
74
75
  "grid min-w-0",
75
76
  b === "card" ? "gap-0 overflow-hidden" : "gap-[24px]",
76
77
  i && "opacity-50",
77
- L
78
+ M
78
79
  ),
79
- style: M,
80
+ style: Q,
80
81
  children: [
81
82
  /* @__PURE__ */ e(
82
83
  r,
83
84
  {
84
- ...re(F, u),
85
+ ...oe(H, p),
85
86
  as: "button",
86
87
  border: {
87
88
  radius: "16px",
88
89
  style: "none",
89
90
  width: "0",
90
- ...u.border
91
+ ...p.border
91
92
  },
92
- className: p(
93
+ className: m(
93
94
  "group/accordion-trigger w-full text-left outline-none transition-colors disabled:cursor-not-allowed",
94
95
  "focus-visible:ring-2 focus-visible:ring-[color-mix(in_srgb,var(--color-primary-accent)_35%,transparent)] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--color-background-default)]",
95
96
  S === "primary" && "bg-[var(--color-background-default)]",
96
97
  S === "secondary" && "bg-transparent",
97
- m
98
+ f
98
99
  ),
99
100
  cursor: i ? "not-allowed" : "pointer",
100
- "data-state": s.isExpanded ? "open" : "closed",
101
- p: u.p ?? 24,
101
+ "data-state": a.isExpanded ? "open" : "closed",
102
+ p: p.p ?? 24,
102
103
  ref: E,
103
- style: Q,
104
+ style: U,
104
105
  type: "button",
105
- children: /* @__PURE__ */ c(f, { children: [
106
+ children: /* @__PURE__ */ c(g, { children: [
106
107
  /* @__PURE__ */ c(l, { align: "center", gap: 16, minWidth: 0, children: [
107
108
  w ? /* @__PURE__ */ e(
108
109
  r,
@@ -113,7 +114,7 @@ function ce({
113
114
  }
114
115
  ) : null,
115
116
  /* @__PURE__ */ c(l, { flexDirection: "column", gap: 8, minWidth: 0, children: [
116
- /* @__PURE__ */ e(C, { as: "span", className: "truncate", variant: "h4", children: W }),
117
+ /* @__PURE__ */ e(C, { as: "span", className: "truncate", variant: "h4", children: K }),
117
118
  N ? /* @__PURE__ */ e(
118
119
  C,
119
120
  {
@@ -128,26 +129,26 @@ function ce({
128
129
  ] }),
129
130
  /* @__PURE__ */ c(l, { align: "center", gap: 12, shrink: 0, children: [
130
131
  D ? /* @__PURE__ */ e(r, { as: "span", children: D }) : null,
131
- g ? null : /* @__PURE__ */ e(
132
+ x ? null : /* @__PURE__ */ e(
132
133
  r,
133
134
  {
134
- ...n,
135
+ ...o,
135
136
  as: "span",
136
- bg: n?.bg ?? "--color-background-default",
137
- border: n?.border ?? { radius: "8px" },
138
- style: n?.style,
139
- className: p(
140
- n ? "flex items-center justify-center" : "flex min-h-[41px] min-w-[41px] items-center justify-center text-[var(--color-text-primary)] transition-colors group-hover/accordion-trigger:bg-[color-mix(in_srgb,var(--color-background-default)_90%,#000)]",
141
- n?.className
137
+ bg: o?.bg ?? "--color-background-default",
138
+ border: o?.border ?? { radius: "8px" },
139
+ style: o?.style,
140
+ className: m(
141
+ o ? "flex items-center justify-center" : "flex min-h-[41px] min-w-[41px] items-center justify-center text-[var(--color-text-primary)] transition-colors group-hover/accordion-trigger:bg-[color-mix(in_srgb,var(--color-background-default)_90%,#000)]",
142
+ o?.className
142
143
  ),
143
- children: y ?? /* @__PURE__ */ e(
144
- oe,
144
+ children: I ?? /* @__PURE__ */ e(
145
+ ae,
145
146
  {
146
147
  "aria-hidden": "true",
147
148
  className: "h-[12px] w-[12px] transition-transform",
148
149
  style: {
149
- transform: s.isExpanded ? "translateY(-2px) rotate(180deg)" : "translateY(2px) rotate(0deg)",
150
- transitionDuration: `${d}ms`
150
+ transform: a.isExpanded ? "translateY(-2px) rotate(180deg)" : "translateY(2px) rotate(0deg)",
151
+ transitionDuration: `${u}ms`
151
152
  }
152
153
  }
153
154
  )
@@ -161,44 +162,44 @@ function ce({
161
162
  r,
162
163
  {
163
164
  ...j,
164
- ...a,
165
- className: p(
165
+ ...s,
166
+ className: m(
166
167
  "overflow-hidden text-[var(--color-text-secondary)] transition-[height,opacity]",
167
- H
168
+ O
168
169
  ),
169
- "data-state": s.isExpanded ? "open" : "closed",
170
+ "data-state": a.isExpanded ? "open" : "closed",
170
171
  ref: A,
171
- style: U,
172
- children: /* @__PURE__ */ e(r, { p: { px: 24, pb: 24 }, children: t })
172
+ style: V,
173
+ children: /* @__PURE__ */ e(r, { ...d, p: d?.p ?? { px: 24, pb: 24 }, children: t })
173
174
  }
174
175
  )
175
176
  ]
176
177
  }
177
178
  );
178
179
  }
179
- function le({
180
+ function de({
180
181
  allowsMultipleExpanded: t = !1,
181
- children: m,
182
- defaultExpandedKeys: a,
182
+ children: f,
183
+ defaultExpandedKeys: s,
183
184
  expandedKeys: d,
184
- isDisabled: f = !1,
185
+ isDisabled: u = !1,
185
186
  onExpandedChange: g,
186
187
  ...x
187
188
  }) {
188
189
  const y = se({
189
190
  allowsMultipleExpanded: t,
190
- defaultExpandedKeys: a,
191
+ defaultExpandedKeys: s,
191
192
  expandedKeys: d,
192
- isDisabled: f,
193
+ isDisabled: u,
193
194
  onExpandedChange: g
194
195
  });
195
- return /* @__PURE__ */ e(B.Provider, { value: y, children: /* @__PURE__ */ e(l, { flexDirection: "column", gap: 24, width: "100%", ...x, children: m }) });
196
+ return /* @__PURE__ */ e(B.Provider, { value: y, children: /* @__PURE__ */ e(l, { flexDirection: "column", gap: 24, width: "100%", ...x, children: f }) });
196
197
  }
197
- const ve = Object.assign(le, {
198
- Item: ce
198
+ const we = Object.assign(de, {
199
+ Item: le
199
200
  });
200
201
  export {
201
- ve as Accordion,
202
- ce as AccordionItem,
203
- le as AccordionRoot
202
+ we as Accordion,
203
+ le as AccordionItem,
204
+ de as AccordionRoot
204
205
  };