@devslab/dds-react 0.20.0 → 0.21.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.ko.md CHANGED
@@ -26,3 +26,24 @@ Tooltip은 하나의 포커스 가능한 요소 또는 trigger props를 받는 r
26
26
  ConsoleShell은 brand/nav/header/labels/foot을 받으며 인스턴스별 고유 ID를 사용합니다. 브라우저 전역 없이 import와 SSR이 가능하고, React useId로 hydration 연결을 유지합니다. Solid accessor/ref/render 방식 대신 React JSX/ref와 Ark asChild 요소 구성을 사용합니다. AG Grid는 별도 패키지 `@devslab/dds-table-react`입니다.
27
27
 
28
28
  ESM, 타입 선언 및 명시적 CSS export를 제공합니다. React/React DOM/Ark를 번들에 복제하지 않습니다. 라이선스는 저장소와 동일한 포함 LICENSE를 확인하세요. 상세 API는 영문 README를 참고하세요.
29
+
30
+ ## DatePicker
31
+
32
+ ```tsx
33
+ import { DatePicker } from "@devslab/dds-react";
34
+ <DatePicker label="시작 날짜" value={date} onChange={setDate} />
35
+ ```
36
+
37
+ Controlled `value` uses `YYYY-MM-DD` or an empty string. `locale` defaults to `ko-KR`, `timeZone` to `Asia/Seoul`. Optional `min`, `max` and `disabled` constrain selection. Import the package stylesheet. Time selection is a separate field. Ark owns calendar focus, keyboard navigation and popup dismissal.
38
+
39
+ ## createStatusPill
40
+
41
+ ```tsx
42
+ const StatusPill = createStatusPill({
43
+ tones: { job: { ready: "success" } },
44
+ label: (domain, value, locale) => value === "ready" ? "준비됨" : undefined,
45
+ });
46
+ <StatusPill domain="job" value="ready" locale="ko" />
47
+ ```
48
+
49
+ Unknown closed-domain status values throw to expose incomplete catalogs. Domains listed in `openDomains` instead show the unknown value as escaped text.
package/README.md CHANGED
@@ -32,3 +32,24 @@ Advanced compositional parts are exported as `ArkDialog`, `ArkTabs`, `ArkTooltip
32
32
  ConsoleShell accepts caller brand/navigation/header/labels/foot slots and unique per-instance landmark IDs. Its rail uses caller route state; no router or business store is included. Imports and server rendering require no browser globals; client-only effects start after mounting. React `useId` keeps label associations stable through hydration. React JSX, React refs and Ark `asChild` element composition differ from Solid render callbacks/accessors. The grid is a separate dependency: use `@devslab/dds-table-react` for AG Grid.
33
33
 
34
34
  ESM and declarations are shipped; React, React DOM and Ark remain external to the DDS bundle. This package is source-available under the included LICENSE, matching the DDS repository.
35
+
36
+ ## DatePicker
37
+
38
+ ```tsx
39
+ import { DatePicker } from "@devslab/dds-react";
40
+ <DatePicker label="시작 날짜" value={date} onChange={setDate} />
41
+ ```
42
+
43
+ Controlled `value` uses `YYYY-MM-DD` or an empty string. `locale` defaults to `ko-KR`, `timeZone` to `Asia/Seoul`. Optional `min`, `max` and `disabled` constrain selection. Import the package stylesheet. Time selection is a separate field. Ark owns calendar focus, keyboard navigation and popup dismissal.
44
+
45
+ ## createStatusPill
46
+
47
+ ```tsx
48
+ const StatusPill = createStatusPill({
49
+ tones: { job: { ready: "success" } },
50
+ label: (domain, value, locale) => value === "ready" ? "준비됨" : undefined,
51
+ });
52
+ <StatusPill domain="job" value="ready" locale="ko" />
53
+ ```
54
+
55
+ Unknown closed-domain status values throw to expose incomplete catalogs. Domains listed in `openDomains` instead show the unknown value as escaped text.
@@ -0,0 +1,13 @@
1
+ export interface DatePickerProps {
2
+ label: string;
3
+ /** ISO calendar date (YYYY-MM-DD), or an empty string. */
4
+ value: string;
5
+ onChange: (value: string) => void;
6
+ locale?: string;
7
+ timeZone?: string;
8
+ disabled?: boolean;
9
+ min?: string;
10
+ max?: string;
11
+ }
12
+ export declare function DatePicker({ label, value, onChange, locale, timeZone, disabled, min, max }: DatePickerProps): import("react").JSX.Element;
13
+ //# sourceMappingURL=date-picker.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"date-picker.d.ts","sourceRoot":"","sources":["../src/date-picker.tsx"],"names":[],"mappings":"AAIA,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAC,MAAM,CAAC;IACb,0DAA0D;IAC1D,KAAK,EAAC,MAAM,CAAC;IACb,QAAQ,EAAC,CAAC,KAAK,EAAC,MAAM,KAAG,IAAI,CAAC;IAC9B,MAAM,CAAC,EAAC,MAAM,CAAC;IACf,QAAQ,CAAC,EAAC,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAC,OAAO,CAAC;IAClB,GAAG,CAAC,EAAC,MAAM,CAAC;IACZ,GAAG,CAAC,EAAC,MAAM,CAAC;CACb;AAKD,wBAAgB,UAAU,CAAC,EAAC,KAAK,EAAC,KAAK,EAAC,QAAQ,EAAC,MAAc,EAAC,QAAqB,EAAC,QAAc,EAAC,GAAG,EAAC,GAAG,EAAC,EAAC,eAAe,+BA2B5H"}
package/dist/index.d.ts CHANGED
@@ -12,4 +12,7 @@ export { Checkbox as ArkCheckbox } from "@ark-ui/react/checkbox";
12
12
  export { Switch as ArkSwitch } from "@ark-ui/react/switch";
13
13
  export { Field as ArkField } from "@ark-ui/react/field";
14
14
  export { Toast as ArkToast } from "@ark-ui/react/toast";
15
+ export * from "./date-picker";
16
+ export { DatePicker as ArkDatePicker } from "@ark-ui/react/date-picker";
17
+ export * from "./status-pill";
15
18
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,iBAAiB,CAAC;AAChC,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAC3D,OAAO,EAAE,IAAI,IAAI,OAAO,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAC9D,OAAO,EAAE,UAAU,IAAI,aAAa,EAAE,MAAM,2BAA2B,CAAC;AACxE,OAAO,EAAE,QAAQ,IAAI,WAAW,EAAE,MAAM,wBAAwB,CAAC;AACjE,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAC3D,OAAO,EAAE,KAAK,IAAI,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,KAAK,IAAI,QAAQ,EAAE,MAAM,qBAAqB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,iBAAiB,CAAC;AAChC,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAC3D,OAAO,EAAE,IAAI,IAAI,OAAO,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAC9D,OAAO,EAAE,UAAU,IAAI,aAAa,EAAE,MAAM,2BAA2B,CAAC;AACxE,OAAO,EAAE,QAAQ,IAAI,WAAW,EAAE,MAAM,wBAAwB,CAAC;AACjE,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAC3D,OAAO,EAAE,KAAK,IAAI,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,KAAK,IAAI,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAExD,cAAc,eAAe,CAAC;AAC9B,OAAO,EAAE,UAAU,IAAI,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAExE,cAAc,eAAe,CAAC"}
package/dist/index.js CHANGED
@@ -6,10 +6,11 @@ import { Fragment as m, jsx as h, jsxs as g } from "react/jsx-runtime";
6
6
  import { Tabs as _, Tabs as v, useTabsContext as y } from "@ark-ui/react/tabs";
7
7
  import { RadioGroup as b, RadioGroup as x, useRadioGroupContext as S } from "@ark-ui/react/radio-group";
8
8
  import { Dialog as C, Dialog as w } from "@ark-ui/react/dialog";
9
- import { Tooltip as T, Tooltip as E } from "@ark-ui/react/tooltip";
10
- import { Portal as D } from "@ark-ui/react/portal";
11
- import { directionPolicy as O, icons as k } from "@devslab/dds-icons";
12
- import { Toast as A, Toast as j, Toaster as M, createToaster as N } from "@ark-ui/react/toast";
9
+ import { Tooltip as ee, Tooltip as T } from "@ark-ui/react/tooltip";
10
+ import { Portal as E } from "@ark-ui/react/portal";
11
+ import { directionPolicy as D, icons as te } from "@devslab/dds-icons";
12
+ import { Toast as O, Toast as ne, Toaster as k, createToaster as A } from "@ark-ui/react/toast";
13
+ import { DatePicker as j, DatePicker as M, parseDate as N } from "@ark-ui/react/date-picker";
13
14
  //#region src/controls.tsx
14
15
  var P = (...e) => e.filter(Boolean).join(" "), F = t(function({ tone: e = "primary", size: t = "md", loading: n, disabled: r, type: i = "button", className: a, children: o, ...s }, c) {
15
16
  return /* @__PURE__ */ g("button", {
@@ -240,21 +241,21 @@ var J = t(function({ options: e, label: t, onValueChange: n, className: r, child
240
241
  finalFocusEl: d ? () => d() ?? null : _.finalFocusEl,
241
242
  lazyMount: !0,
242
243
  unmountOnExit: !0,
243
- children: o ? /* @__PURE__ */ h(D, { children: b }) : b
244
+ children: o ? /* @__PURE__ */ h(E, { children: b }) : b
244
245
  });
245
246
  });
246
247
  function X({ content: e, children: t, onOpenChange: n, className: r, contentProps: i, ...a }) {
247
- return /* @__PURE__ */ h(E.Root, {
248
+ return /* @__PURE__ */ h(T.Root, {
248
249
  openDelay: 0,
249
250
  closeDelay: 0,
250
251
  ...a,
251
252
  onOpenChange: (e) => n?.(e.open),
252
253
  children: /* @__PURE__ */ g("span", {
253
254
  className: P("dds-tooltip", r),
254
- children: [typeof t == "function" ? /* @__PURE__ */ h(E.Context, { children: (e) => t(e.getTriggerProps()) }) : /* @__PURE__ */ h(E.Trigger, {
255
+ children: [typeof t == "function" ? /* @__PURE__ */ h(T.Context, { children: (e) => t(e.getTriggerProps()) }) : /* @__PURE__ */ h(T.Trigger, {
255
256
  asChild: !0,
256
257
  children: t
257
- }), /* @__PURE__ */ h(D, { children: /* @__PURE__ */ h(E.Positioner, { children: /* @__PURE__ */ h(E.Content, {
258
+ }), /* @__PURE__ */ h(E, { children: /* @__PURE__ */ h(T.Positioner, { children: /* @__PURE__ */ h(T.Content, {
258
259
  ...i,
259
260
  className: P("dds-tooltip__bubble", i?.className),
260
261
  children: e
@@ -264,8 +265,8 @@ function X({ content: e, children: t, onOpenChange: n, className: r, contentProp
264
265
  }
265
266
  //#endregion
266
267
  //#region src/icon.tsx
267
- var Z = t(function({ name: e, label: t, size: n = 24, directional: r, className: i, ...a }, o) {
268
- let s = k[e];
268
+ var re = t(function({ name: e, label: t, size: n = 24, directional: r, className: i, ...a }, o) {
269
+ let s = te[e];
269
270
  return /* @__PURE__ */ g("svg", {
270
271
  ...a,
271
272
  ref: o,
@@ -280,12 +281,12 @@ var Z = t(function({ name: e, label: t, size: n = 24, directional: r, className:
280
281
  role: t ? "img" : void 0,
281
282
  "aria-label": t,
282
283
  "aria-hidden": !t || void 0,
283
- className: P((r ?? O.mirrorInRtl.includes(e)) && O.cssClass, i),
284
+ className: P((r ?? D.mirrorInRtl.includes(e)) && D.cssClass, i),
284
285
  children: [t && /* @__PURE__ */ h("title", { children: t }), /* @__PURE__ */ h("g", { dangerouslySetInnerHTML: { __html: s.body } })]
285
286
  });
286
- }), Q = e(null);
287
- function $({ children: e, defaultDuration: t = 5e3, dismissLabel: n, regionLabel: s, className: c }) {
288
- let l = i(), u = o(0), d = a(() => N({
287
+ }), Z = e(null);
288
+ function ie({ children: e, defaultDuration: t = 5e3, dismissLabel: n, regionLabel: s, className: c }) {
289
+ let l = i(), u = o(0), d = a(() => A({
289
290
  placement: "bottom-end",
290
291
  overlap: !1,
291
292
  gap: 8,
@@ -313,9 +314,9 @@ function $({ children: e, defaultDuration: t = 5e3, dismissLabel: n, regionLabel
313
314
  l,
314
315
  t
315
316
  ]);
316
- return r(() => () => d.remove(), [d]), /* @__PURE__ */ g(Q.Provider, {
317
+ return r(() => () => d.remove(), [d]), /* @__PURE__ */ g(Z.Provider, {
317
318
  value: f,
318
- children: [e, /* @__PURE__ */ h(M, {
319
+ children: [e, /* @__PURE__ */ h(k, {
319
320
  toaster: d,
320
321
  label: s ?? "",
321
322
  "aria-label": s ?? "",
@@ -323,10 +324,10 @@ function $({ children: e, defaultDuration: t = 5e3, dismissLabel: n, regionLabel
323
324
  className: P("dds-toast-region", c),
324
325
  children: (e) => {
325
326
  let t = e.meta?.dds;
326
- return /* @__PURE__ */ g(A.Root, {
327
+ return /* @__PURE__ */ g(O.Root, {
327
328
  className: P("dds-toast", `dds-toast--${t.tone ?? "info"}`),
328
329
  role: t.tone === "danger" ? "alert" : "status",
329
- children: [/* @__PURE__ */ h(A.Description, { children: e.description }), n && /* @__PURE__ */ h(A.CloseTrigger, {
330
+ children: [/* @__PURE__ */ h(O.Description, { children: e.description }), n && /* @__PURE__ */ h(O.CloseTrigger, {
330
331
  className: "dds-iconbtn dds-iconbtn--sm",
331
332
  "aria-label": typeof n == "function" ? n(t) : n,
332
333
  children: "×"
@@ -336,17 +337,17 @@ function $({ children: e, defaultDuration: t = 5e3, dismissLabel: n, regionLabel
336
337
  })]
337
338
  });
338
339
  }
339
- function ee() {
340
- let e = n(Q);
340
+ function ae() {
341
+ let e = n(Z);
341
342
  if (!e) throw Error("useToast must be called inside <ToastProvider>");
342
343
  return e;
343
344
  }
344
345
  //#endregion
345
346
  //#region src/console-shell.tsx
346
- function te(e, t) {
347
+ function oe(e, t) {
347
348
  return t.active ?? (t.href.split("/").filter(Boolean).length <= 1 ? e === t.href : e === t.href || e.startsWith(`${t.href}/`));
348
349
  }
349
- var ne = t(function({ surface: e, activePath: t, brand: n, context: a, nav: o, labels: c, header: l, foot: u, children: d, className: f, ...p }, m) {
350
+ var se = t(function({ surface: e, activePath: t, brand: n, context: a, nav: o, labels: c, header: l, foot: u, children: d, className: f, ...p }, m) {
350
351
  let [_, v] = s(!1), [y, b] = s(!1), x = i(), S = `dds-console-rail-${x}`, C = `dds-console-main-${x}`;
351
352
  return r(() => {
352
353
  b(!0);
@@ -416,7 +417,7 @@ var ne = t(function({ surface: e, activePath: t, brand: n, context: a, nav: o, l
416
417
  className: "dds-console-rail__item",
417
418
  "data-nav": `${e}.${n.id}`,
418
419
  href: n.href,
419
- "aria-current": te(t, n) ? "page" : void 0,
420
+ "aria-current": oe(t, n) ? "page" : void 0,
420
421
  onClick: () => v(!1),
421
422
  children: [/* @__PURE__ */ h("span", { children: n.label }), n.badge !== void 0 && n.badge > 0 && /* @__PURE__ */ h("span", {
422
423
  className: "dds-console-rail__badge",
@@ -454,6 +455,160 @@ var ne = t(function({ surface: e, activePath: t, brand: n, context: a, nav: o, l
454
455
  });
455
456
  });
456
457
  //#endregion
457
- export { u as ArkCheckbox, C as ArkDialog, c as ArkField, b as ArkRadioGroup, f as ArkSwitch, _ as ArkTabs, j as ArkToast, T as ArkTooltip, F as Button, B as Checkbox, ne as ConsoleShell, Y as Dialog, L as Field, Z as Icon, I as IconButton, H as Radio, J as RadioGroup, R as Select, V as Switch, G as Tab, W as TabList, K as TabPanel, U as Tabs, $ as ToastProvider, X as Tooltip, P as classes, ee as useToast };
458
+ //#region src/date-picker.tsx
459
+ function Q() {
460
+ return /* @__PURE__ */ g("svg", {
461
+ width: "20",
462
+ height: "20",
463
+ viewBox: "0 0 24 24",
464
+ fill: "none",
465
+ stroke: "currentColor",
466
+ strokeWidth: "1.5",
467
+ "aria-hidden": "true",
468
+ children: [/* @__PURE__ */ h("rect", {
469
+ x: "3.5",
470
+ y: "5.5",
471
+ width: "17",
472
+ height: "15",
473
+ rx: "2"
474
+ }), /* @__PURE__ */ h("path", { d: "M7.5 3v5M16.5 3v5M3.5 10.5h17" })]
475
+ });
476
+ }
477
+ function $({ next: e = !1 }) {
478
+ return /* @__PURE__ */ h("svg", {
479
+ width: "18",
480
+ height: "18",
481
+ viewBox: "0 0 24 24",
482
+ fill: "none",
483
+ stroke: "currentColor",
484
+ strokeWidth: "1.5",
485
+ "aria-hidden": "true",
486
+ children: /* @__PURE__ */ h("path", { d: e ? "m9 5 7 7-7 7" : "m15 5-7 7 7 7" })
487
+ });
488
+ }
489
+ function ce({ label: e, value: t, onChange: n, locale: r = "ko-KR", timeZone: i = "Asia/Seoul", disabled: a = !1, min: o, max: s }) {
490
+ return /* @__PURE__ */ h(L, {
491
+ label: e,
492
+ children: (c) => /* @__PURE__ */ g(M.Root, {
493
+ locale: r,
494
+ timeZone: i,
495
+ disabled: a,
496
+ min: o ? N(o) : void 0,
497
+ max: s ? N(s) : void 0,
498
+ startOfWeek: 0,
499
+ minView: "day",
500
+ maxView: "day",
501
+ fixedWeeks: !0,
502
+ translations: {
503
+ dayCell: (e) => `${e.valueText} 선택`,
504
+ clearTrigger: "선택 날짜 지우기"
505
+ },
506
+ value: t ? [N(t)] : [],
507
+ format: (e) => e.toString(),
508
+ onValueChange: (e) => n(e.valueAsString[0] || ""),
509
+ positioning: {
510
+ placement: "bottom-start",
511
+ gutter: 8
512
+ },
513
+ children: [/* @__PURE__ */ g(M.Control, {
514
+ className: "dds-date-picker-control",
515
+ children: [/* @__PURE__ */ h(M.Input, {
516
+ ...c,
517
+ placeholder: "YYYY-MM-DD",
518
+ autoComplete: "off"
519
+ }), /* @__PURE__ */ h(M.Trigger, {
520
+ asChild: !0,
521
+ children: /* @__PURE__ */ h(F, {
522
+ type: "button",
523
+ tone: "secondary",
524
+ "aria-label": `${e} 달력 열기`,
525
+ children: /* @__PURE__ */ h(Q, {})
526
+ })
527
+ })]
528
+ }), /* @__PURE__ */ h(E, { children: /* @__PURE__ */ h(M.Positioner, {
529
+ className: "dds-date-picker-positioner",
530
+ children: /* @__PURE__ */ h(M.Content, {
531
+ className: "dds-date-picker-content",
532
+ "aria-label": `${e} 날짜 선택`,
533
+ children: /* @__PURE__ */ h(M.View, {
534
+ view: "day",
535
+ children: /* @__PURE__ */ h(M.Context, { children: (e) => /* @__PURE__ */ g(m, { children: [
536
+ /* @__PURE__ */ g(M.ViewControl, {
537
+ className: "dds-date-picker-header",
538
+ children: [
539
+ /* @__PURE__ */ h(M.PrevTrigger, {
540
+ asChild: !0,
541
+ children: /* @__PURE__ */ h(F, {
542
+ type: "button",
543
+ tone: "secondary",
544
+ "aria-label": "이전 달",
545
+ children: /* @__PURE__ */ h($, {})
546
+ })
547
+ }),
548
+ /* @__PURE__ */ h(M.RangeText, {}),
549
+ /* @__PURE__ */ h(M.NextTrigger, {
550
+ asChild: !0,
551
+ children: /* @__PURE__ */ h(F, {
552
+ type: "button",
553
+ tone: "secondary",
554
+ "aria-label": "다음 달",
555
+ children: /* @__PURE__ */ h($, { next: !0 })
556
+ })
557
+ })
558
+ ]
559
+ }),
560
+ /* @__PURE__ */ g(M.Table, {
561
+ className: "dds-date-picker-table",
562
+ children: [/* @__PURE__ */ h(M.TableHead, { children: /* @__PURE__ */ h(M.TableRow, { children: e.weekDays.map((e, t) => /* @__PURE__ */ h(M.TableHeader, { children: e.short }, t)) }) }), /* @__PURE__ */ h(M.TableBody, { children: e.weeks.map((e, t) => /* @__PURE__ */ h(M.TableRow, { children: e.map((e) => /* @__PURE__ */ h(M.TableCell, {
563
+ value: e,
564
+ children: /* @__PURE__ */ h(M.TableCellTrigger, { children: e.day })
565
+ }, e.toString())) }, t)) })]
566
+ }),
567
+ /* @__PURE__ */ g("div", {
568
+ className: "dds-date-picker-footer",
569
+ children: [/* @__PURE__ */ h(F, {
570
+ type: "button",
571
+ tone: "secondary",
572
+ onClick: () => e.selectToday(),
573
+ children: "오늘"
574
+ }), /* @__PURE__ */ h(M.ClearTrigger, {
575
+ asChild: !0,
576
+ children: /* @__PURE__ */ h(F, {
577
+ type: "button",
578
+ tone: "secondary",
579
+ children: "지우기"
580
+ })
581
+ })]
582
+ })
583
+ ] }) })
584
+ })
585
+ })
586
+ }) })]
587
+ })
588
+ });
589
+ }
590
+ //#endregion
591
+ //#region src/status-pill.tsx
592
+ function le(e) {
593
+ let t = new Set(e.openDomains ?? []);
594
+ return function(n) {
595
+ let r = e.tones[n.domain]?.[n.value], i = e.label(n.domain, n.value, n.locale);
596
+ if (!r || !i) {
597
+ if (t.has(n.domain)) return /* @__PURE__ */ h("code", {
598
+ "data-status": `${n.domain}.${n.value}`,
599
+ children: n.value
600
+ });
601
+ throw Error(r ? `StatusPill: no label for ${n.domain}.${n.value}` : `StatusPill: no tone for ${n.domain}.${n.value}`);
602
+ }
603
+ return /* @__PURE__ */ h("span", {
604
+ className: r === "neutral" ? "dds-badge" : `dds-badge dds-badge--${r}`,
605
+ "data-status": `${n.domain}.${n.value}`,
606
+ "data-tone": r,
607
+ children: i
608
+ });
609
+ };
610
+ }
611
+ //#endregion
612
+ export { u as ArkCheckbox, j as ArkDatePicker, C as ArkDialog, c as ArkField, b as ArkRadioGroup, f as ArkSwitch, _ as ArkTabs, ne as ArkToast, ee as ArkTooltip, F as Button, B as Checkbox, se as ConsoleShell, ce as DatePicker, Y as Dialog, L as Field, re as Icon, I as IconButton, H as Radio, J as RadioGroup, R as Select, V as Switch, G as Tab, W as TabList, K as TabPanel, U as Tabs, ie as ToastProvider, X as Tooltip, P as classes, le as createStatusPill, ae as useToast };
458
613
 
459
614
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../src/controls.tsx","../src/selection.tsx","../src/overlays.tsx","../src/icon.tsx","../src/toast.tsx","../src/console-shell.tsx"],"sourcesContent":["import {\n forwardRef,\n useId,\n type ButtonHTMLAttributes,\n type InputHTMLAttributes,\n type SelectHTMLAttributes,\n type HTMLAttributes,\n type ReactNode,\n} from \"react\";\nimport { Field as ArkField } from \"@ark-ui/react/field\";\nimport { Checkbox as ArkCheckbox } from \"@ark-ui/react/checkbox\";\nimport { Switch as ArkSwitch } from \"@ark-ui/react/switch\";\nexport const classes = (...values: (string | false | undefined)[]) =>\n values.filter(Boolean).join(\" \");\nexport type ButtonTone = \"primary\" | \"secondary\" | \"ghost\" | \"danger\";\nexport type ControlSize = \"sm\" | \"md\" | \"lg\";\nexport interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n tone?: ButtonTone;\n size?: ControlSize;\n loading?: boolean;\n}\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n function Button(\n {\n tone = \"primary\",\n size = \"md\",\n loading,\n disabled,\n type = \"button\",\n className,\n children,\n ...rest\n },\n ref\n ) {\n return (\n <button\n {...rest}\n ref={ref}\n type={type}\n disabled={disabled || loading}\n aria-busy={loading || undefined}\n className={classes(\n \"dds-btn\",\n `dds-btn--${tone}`,\n size !== \"md\" && `dds-btn--${size}`,\n className\n )}\n >\n {loading && <span className=\"dds-spinner\" aria-hidden />}\n {children}\n </button>\n );\n }\n);\nexport interface IconButtonProps extends Omit<ButtonProps, \"tone\"> {\n \"aria-label\": string;\n tone?: \"ghost\" | \"secondary\" | \"danger\";\n}\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n function IconButton(\n {\n tone = \"ghost\",\n size = \"md\",\n loading,\n disabled,\n type = \"button\",\n className,\n children,\n ...rest\n },\n ref\n ) {\n return (\n <button\n {...rest}\n ref={ref}\n type={type}\n disabled={disabled || loading}\n aria-busy={loading || undefined}\n className={classes(\n \"dds-iconbtn\",\n tone !== \"ghost\" && `dds-iconbtn--${tone}`,\n size !== \"md\" && `dds-iconbtn--${size}`,\n className\n )}\n >\n {loading ? <span className=\"dds-spinner\" aria-hidden /> : children}\n </button>\n );\n }\n);\nexport interface FieldControlProps {\n id: string;\n \"aria-describedby\"?: string;\n \"aria-invalid\"?: true;\n \"aria-required\"?: true;\n}\nexport interface FieldProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n label: ReactNode;\n helpText?: ReactNode;\n error?: ReactNode;\n required?: boolean;\n children: ReactNode | ((props: FieldControlProps) => ReactNode);\n}\nexport const Field = forwardRef<HTMLDivElement, FieldProps>(function Field(\n {\n id: requested,\n label,\n helpText,\n error,\n required,\n className,\n children,\n ...rest\n },\n ref\n) {\n const generated = useId();\n const id = requested ?? `dds-field-${generated}`;\n const control: FieldControlProps = {\n id,\n \"aria-describedby\":\n [helpText && `${id}-help`, error && `${id}-error`]\n .filter(Boolean)\n .join(\" \") || undefined,\n \"aria-invalid\": error ? true : undefined,\n \"aria-required\": required ? true : undefined,\n };\n return (\n <ArkField.Root\n {...rest}\n ref={ref}\n invalid={Boolean(error)}\n required={required}\n id={id}\n ids={{\n control: `${id}-root`,\n helperText: `${id}-help`,\n errorText: `${id}-error`,\n }}\n className={classes(\n \"dds-field\",\n Boolean(error) && \"dds-field--error\",\n className\n )}\n >\n <ArkField.Label htmlFor={id} className=\"dds-field__label\">\n {label}\n {required && <span aria-hidden> *</span>}\n </ArkField.Label>\n {typeof children === \"function\" ? children(control) : children}\n {helpText && (\n <ArkField.HelperText className=\"dds-field__help\">\n {helpText}\n </ArkField.HelperText>\n )}\n {error && (\n <ArkField.ErrorText className=\"dds-field__error\" role=\"alert\">\n {error}\n </ArkField.ErrorText>\n )}\n </ArkField.Root>\n );\n});\nexport interface SelectProps extends SelectHTMLAttributes<HTMLSelectElement> {\n invalid?: boolean;\n wrapperClassName?: string;\n}\nexport const Select = forwardRef<HTMLSelectElement, SelectProps>(\n function Select(\n { invalid, wrapperClassName, className, children, ...rest },\n ref\n ) {\n return (\n <span className={classes(\"dds-select\", wrapperClassName)}>\n <select\n {...rest}\n ref={ref}\n className={classes(\"dds-select__input\", className)}\n aria-invalid={invalid || rest[\"aria-invalid\"]}\n >\n {children}\n </select>\n </span>\n );\n }\n);\nexport interface CheckboxProps\n extends Omit<InputHTMLAttributes<HTMLInputElement>, \"type\" | \"children\"> {\n label: ReactNode;\n onCheckedChange?: (checked: boolean) => void;\n inputClassName?: string;\n}\nexport type RadioProps = CheckboxProps;\nexport type SwitchProps = CheckboxProps;\nconst Checkable = forwardRef<\n HTMLInputElement,\n CheckboxProps & { kind: \"checkbox\" | \"switch\" }\n>(function Checkable(\n {\n kind,\n label,\n checked,\n defaultChecked,\n onCheckedChange,\n id,\n name,\n value,\n disabled,\n required,\n readOnly,\n form,\n className,\n inputClassName,\n onChange,\n ...rest\n },\n ref\n) {\n const Root = kind === \"switch\" ? ArkSwitch.Root : ArkCheckbox.Root;\n const Label = kind === \"switch\" ? ArkSwitch.Label : ArkCheckbox.Label;\n const Context = kind === \"switch\" ? ArkSwitch.Context : ArkCheckbox.Context;\n const base = kind === \"switch\" ? \"dds-switch\" : \"dds-check\";\n return (\n <Root\n checked={checked}\n defaultChecked={defaultChecked}\n onCheckedChange={(details) => onCheckedChange?.(details.checked === true)}\n ids={id ? { hiddenInput: id } : undefined}\n name={name}\n value={String(value ?? \"on\")}\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n form={form}\n className={classes(base, className)}\n >\n <Context>\n {(api) => {\n // DDS styles the actual input. Keep Ark's events and state, but omit\n // its visually hidden style and use React's controlled checked prop\n // so a caller-declined change also restores the native DOM value.\n const {\n style: _,\n defaultChecked: __,\n ...inputProps\n } = api.getHiddenInputProps();\n return (\n <input\n {...inputProps}\n {...rest}\n ref={ref}\n checked={api.checked}\n role={kind === \"switch\" ? \"switch\" : undefined}\n onChange={onChange ?? (() => {})}\n onClick={(event) => {\n rest.onClick?.(event);\n if (!event.defaultPrevented) inputProps.onClick?.(event);\n }}\n className={classes(`${base}__input`, inputClassName)}\n />\n );\n }}\n </Context>\n <Label>{label}</Label>\n </Root>\n );\n});\nexport const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(\n (props, ref) => <Checkable {...props} kind=\"checkbox\" ref={ref} />\n);\nexport const Switch = forwardRef<HTMLInputElement, SwitchProps>(\n (props, ref) => <Checkable {...props} kind=\"switch\" ref={ref} />\n);\nexport const Radio = forwardRef<HTMLInputElement, RadioProps>(function Radio(\n { label, className, inputClassName, onCheckedChange, onChange, ...rest },\n ref\n) {\n return (\n <label className={classes(\"dds-check\", className)}>\n <input\n {...rest}\n ref={ref}\n type=\"radio\"\n className={classes(\"dds-check__input\", inputClassName)}\n onChange={(event) => {\n onChange?.(event);\n if (!event.defaultPrevented)\n onCheckedChange?.(event.currentTarget.checked);\n }}\n />\n <span>{label}</span>\n </label>\n );\n});\n","import { forwardRef, type ComponentProps, type ReactNode } from \"react\";\nimport { Tabs as ArkTabs, useTabsContext } from \"@ark-ui/react/tabs\";\nimport {\n RadioGroup as ArkRadioGroup,\n useRadioGroupContext,\n} from \"@ark-ui/react/radio-group\";\nimport { classes } from \"./controls\";\nexport interface TabsProps\n extends Omit<ComponentProps<typeof ArkTabs.Root>, \"onValueChange\"> {\n onValueChange?: (value: string) => void;\n unstyled?: boolean;\n}\nexport const Tabs = forwardRef<HTMLDivElement, TabsProps>(function Tabs(\n { onValueChange, unstyled, className, ...rest },\n ref\n) {\n return (\n <ArkTabs.Root\n {...rest}\n ref={ref}\n onValueChange={(details) => onValueChange?.(details.value)}\n className={classes(!unstyled && \"dds-tabs-root\", className)}\n />\n );\n});\nexport type TabProps = ComponentProps<typeof ArkTabs.Trigger> & {\n unstyled?: boolean;\n};\nexport type TabPanelProps = ComponentProps<typeof ArkTabs.Content>;\nexport const TabList = forwardRef<\n HTMLDivElement,\n ComponentProps<typeof ArkTabs.List> & { unstyled?: boolean }\n>(function TabList({ unstyled, className, ...rest }, ref) {\n return (\n <ArkTabs.List\n {...rest}\n ref={ref}\n className={classes(!unstyled && \"dds-tabs\", className)}\n />\n );\n});\nexport const Tab = forwardRef<HTMLButtonElement, TabProps>(function Tab(\n { unstyled, className, ...rest },\n ref\n) {\n return (\n <ArkTabs.Trigger\n {...rest}\n ref={ref}\n className={classes(!unstyled && \"dds-tab\", className)}\n />\n );\n});\nexport const TabPanel = forwardRef<HTMLDivElement, TabPanelProps>(\n function TabPanel({ value, style, ...rest }, ref) {\n const tabs = useTabsContext();\n const inactive = tabs.value !== value;\n return (\n <ArkTabs.Content\n {...rest}\n value={value}\n ref={ref}\n hidden={inactive}\n style={inactive ? { ...style, display: \"none\" } : style}\n />\n );\n }\n);\nfunction VisibleRadioInput({ option }: { option: RadioOption }) {\n const group = useRadioGroupContext();\n // Ark owns selection and roving focus; DDS displays the native radio.\n const {\n style: _,\n defaultChecked: __,\n ...inputProps\n } = group.getItemHiddenInputProps(option);\n return (\n <input\n {...inputProps}\n checked={group.value === option.value}\n onChange={() => {}}\n className=\"dds-check__input\"\n />\n );\n}\nexport interface RadioOption {\n value: string;\n label: ReactNode;\n disabled?: boolean;\n}\nexport interface RadioGroupProps\n extends Omit<\n ComponentProps<typeof ArkRadioGroup.Root>,\n \"onValueChange\" | \"children\"\n > {\n options: readonly RadioOption[];\n label: ReactNode;\n onValueChange?: (value: string) => void;\n children?: ReactNode;\n}\nexport const RadioGroup = forwardRef<HTMLDivElement, RadioGroupProps>(\n function RadioGroup(\n { options, label, onValueChange, className, children, ...rest },\n ref\n ) {\n return (\n <ArkRadioGroup.Root\n {...rest}\n ref={ref}\n onValueChange={(details) => {\n if (details.value !== null) onValueChange?.(details.value);\n }}\n className={classes(\"dds-radio-group\", className)}\n >\n <ArkRadioGroup.Label className=\"dds-field__label\">\n {label}\n </ArkRadioGroup.Label>\n {options.map((option) => (\n <ArkRadioGroup.Item\n key={option.value}\n value={option.value}\n disabled={option.disabled}\n className=\"dds-check\"\n >\n <VisibleRadioInput option={option} />\n <ArkRadioGroup.ItemText>{option.label}</ArkRadioGroup.ItemText>\n </ArkRadioGroup.Item>\n ))}\n {children}\n </ArkRadioGroup.Root>\n );\n }\n);\n","import {\n forwardRef,\n type ComponentProps,\n type ButtonHTMLAttributes,\n type ReactNode,\n} from \"react\";\nimport { Dialog as ArkDialog } from \"@ark-ui/react/dialog\";\nimport { Tooltip as ArkTooltip } from \"@ark-ui/react/tooltip\";\nimport { Portal } from \"@ark-ui/react/portal\";\nimport { classes } from \"./controls\";\nexport interface DialogFrameParts {\n title: ReactNode;\n description: ReactNode;\n children: ReactNode;\n actions: ReactNode;\n}\nexport interface DialogProps\n extends Omit<\n ComponentProps<typeof ArkDialog.Root>,\n \"children\" | \"onOpenChange\"\n > {\n title: ReactNode;\n description?: ReactNode;\n children: ReactNode;\n actions?: ReactNode;\n onOpenChange?: (open: boolean) => void;\n closeOnOutside?: boolean;\n portal?: boolean;\n className?: string;\n overlayClassName?: string;\n contentProps?: ComponentProps<typeof ArkDialog.Content>;\n initialFocus?: () => HTMLElement | null | undefined;\n finalFocus?: () => HTMLElement | null | undefined;\n frame?: (parts: DialogFrameParts) => ReactNode;\n unstyled?: boolean;\n}\nexport const Dialog = forwardRef<HTMLDivElement, DialogProps>(function Dialog(\n {\n title,\n description,\n children,\n actions,\n onOpenChange,\n closeOnOutside,\n portal = true,\n className,\n overlayClassName,\n contentProps,\n initialFocus,\n finalFocus,\n frame,\n unstyled,\n ...rest\n },\n ref\n) {\n const parts: DialogFrameParts = {\n title: (\n <ArkDialog.Title className={unstyled ? undefined : \"dds-dialog__title\"}>\n {title}\n </ArkDialog.Title>\n ),\n description: description && (\n <ArkDialog.Description\n className={unstyled ? undefined : \"dds-dialog__body\"}\n >\n {description}\n </ArkDialog.Description>\n ),\n children,\n actions: actions && (\n <div className={unstyled ? undefined : \"dds-dialog__actions\"}>\n {actions}\n </div>\n ),\n };\n const content = (\n <ArkDialog.Positioner\n className={classes(!unstyled && \"dds-dialog-overlay\", overlayClassName)}\n >\n <ArkDialog.Content\n {...contentProps}\n ref={ref}\n aria-describedby={\n description ? contentProps?.[\"aria-describedby\"] : undefined\n }\n className={classes(\n !unstyled && \"dds-dialog\",\n className,\n contentProps?.className\n )}\n >\n {frame ? (\n frame(parts)\n ) : (\n <>\n {parts.title}\n {parts.description}\n {children}\n {parts.actions}\n </>\n )}\n </ArkDialog.Content>\n </ArkDialog.Positioner>\n );\n return (\n <ArkDialog.Root\n {...rest}\n onOpenChange={(details) => onOpenChange?.(details.open)}\n closeOnInteractOutside={closeOnOutside ?? rest.closeOnInteractOutside}\n initialFocusEl={\n initialFocus ? () => initialFocus() ?? null : rest.initialFocusEl\n }\n finalFocusEl={finalFocus ? () => finalFocus() ?? null : rest.finalFocusEl}\n lazyMount\n unmountOnExit\n >\n {portal ? <Portal>{content}</Portal> : content}\n </ArkDialog.Root>\n );\n});\nexport type TooltipTriggerProps = ButtonHTMLAttributes<HTMLButtonElement>;\nexport interface TooltipProps\n extends Omit<\n ComponentProps<typeof ArkTooltip.Root>,\n \"children\" | \"onOpenChange\"\n > {\n content: ReactNode;\n children: ReactNode | ((props: TooltipTriggerProps) => ReactNode);\n onOpenChange?: (open: boolean) => void;\n className?: string;\n contentProps?: ComponentProps<typeof ArkTooltip.Content>;\n}\nexport function Tooltip({\n content,\n children,\n onOpenChange,\n className,\n contentProps,\n ...rest\n}: TooltipProps) {\n return (\n <ArkTooltip.Root\n openDelay={0}\n closeDelay={0}\n {...rest}\n onOpenChange={(details) => onOpenChange?.(details.open)}\n >\n <span className={classes(\"dds-tooltip\", className)}>\n {typeof children === \"function\" ? (\n <ArkTooltip.Context>\n {(api) => children(api.getTriggerProps())}\n </ArkTooltip.Context>\n ) : (\n <ArkTooltip.Trigger asChild>{children}</ArkTooltip.Trigger>\n )}\n <Portal>\n <ArkTooltip.Positioner>\n <ArkTooltip.Content\n {...contentProps}\n className={classes(\n \"dds-tooltip__bubble\",\n contentProps?.className\n )}\n >\n {content}\n </ArkTooltip.Content>\n </ArkTooltip.Positioner>\n </Portal>\n </span>\n </ArkTooltip.Root>\n );\n}\n","import { forwardRef, type SVGProps } from \"react\";\nimport { icons, directionPolicy, type DdsIconName } from \"@devslab/dds-icons\";\nimport { classes } from \"./controls\";\nexport interface IconProps\n extends Omit<SVGProps<SVGSVGElement>, \"name\" | \"children\"> {\n name: DdsIconName;\n label?: string;\n size?: number | string;\n directional?: boolean;\n}\nexport const Icon = forwardRef<SVGSVGElement, IconProps>(function Icon(\n { name, label, size = 24, directional, className, ...rest },\n ref\n) {\n const icon = icons[name];\n return (\n <svg\n {...rest}\n ref={ref}\n viewBox={icon.viewBox}\n width={size}\n height={size}\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth={icon.strokeWidth}\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n role={label ? \"img\" : undefined}\n aria-label={label}\n aria-hidden={label ? undefined : true}\n className={classes(\n (directional ?? directionPolicy.mirrorInRtl.includes(name)) &&\n directionPolicy.cssClass,\n className\n )}\n >\n {label && <title>{label}</title>}\n <g dangerouslySetInnerHTML={{ __html: icon.body }} />\n </svg>\n );\n});\n","import {\n createContext,\n useContext,\n useEffect,\n useId,\n useMemo,\n useRef,\n type ReactNode,\n} from \"react\";\nimport { Toast as ArkToast, Toaster, createToaster } from \"@ark-ui/react/toast\";\nimport { classes } from \"./controls\";\nexport type ToastTone = \"success\" | \"warning\" | \"danger\" | \"info\";\nexport interface ToastInput {\n message: ReactNode;\n tone?: ToastTone;\n duration?: number;\n}\nexport interface ToastRecord extends ToastInput {\n id: string;\n}\nexport interface ToastApi {\n show: (toast: ToastInput) => string;\n dismiss: (id: string) => void;\n clear: () => void;\n}\nexport interface ToastProviderProps {\n children: ReactNode;\n defaultDuration?: number;\n dismissLabel?: string | ((toast: ToastRecord) => string);\n regionLabel?: string;\n className?: string;\n}\nconst ToastContext = createContext<ToastApi | null>(null);\nexport function ToastProvider({\n children,\n defaultDuration = 5000,\n dismissLabel,\n regionLabel,\n className,\n}: ToastProviderProps) {\n const prefix = useId();\n const sequence = useRef(0);\n const toaster = useMemo(\n () =>\n createToaster({\n placement: \"bottom-end\",\n overlap: false,\n gap: 8,\n offsets: \"var(--dds-space-16)\",\n removeDelay: 0,\n hotkey: [\"DDS_NO_HOTKEY\"],\n }),\n []\n );\n const api = useMemo<ToastApi>(() => {\n return {\n show(input) {\n const id = `dds-toast-${prefix}-${++sequence.current}`;\n const duration = input.duration ?? defaultDuration;\n toaster.create({\n id,\n description: input.message,\n type: input.tone === \"danger\" ? \"error\" : input.tone ?? \"info\",\n duration: duration > 0 ? duration : Infinity,\n meta: { dds: { ...input, id } },\n });\n return id;\n },\n dismiss: (id) => toaster.remove(id),\n clear: () => toaster.remove(),\n };\n }, [toaster, prefix, defaultDuration]);\n useEffect(() => () => toaster.remove(), [toaster]);\n return (\n <ToastContext.Provider value={api}>\n {children}\n <Toaster\n toaster={toaster}\n label={regionLabel ?? \"\"}\n aria-label={regionLabel ?? \"\"}\n role={regionLabel ? \"region\" : \"presentation\"}\n className={classes(\"dds-toast-region\", className)}\n >\n {(toast) => {\n const record = toast.meta?.dds as ToastRecord;\n return (\n <ArkToast.Root\n className={classes(\n \"dds-toast\",\n `dds-toast--${record.tone ?? \"info\"}`\n )}\n role={record.tone === \"danger\" ? \"alert\" : \"status\"}\n >\n <ArkToast.Description>{toast.description}</ArkToast.Description>\n {dismissLabel && (\n <ArkToast.CloseTrigger\n className=\"dds-iconbtn dds-iconbtn--sm\"\n aria-label={\n typeof dismissLabel === \"function\"\n ? dismissLabel(record)\n : dismissLabel\n }\n >\n ×\n </ArkToast.CloseTrigger>\n )}\n </ArkToast.Root>\n );\n }}\n </Toaster>\n </ToastContext.Provider>\n );\n}\nexport function useToast(): ToastApi {\n const api = useContext(ToastContext);\n if (!api) throw new Error(\"useToast must be called inside <ToastProvider>\");\n return api;\n}\n","import {\n forwardRef,\n useEffect,\n useId,\n useState,\n type HTMLAttributes,\n type ReactNode,\n} from \"react\";\nimport { classes } from \"./controls\";\nexport interface ConsoleNavItem {\n id: string;\n href: string;\n label: string;\n badge?: number;\n active?: boolean;\n}\nexport interface ConsoleNavGroup {\n label: string;\n items: readonly ConsoleNavItem[];\n}\nexport interface ConsoleShellLabels {\n skip: string;\n menuOpen: string;\n menuClose: string;\n nav: string;\n badge: string;\n}\nexport interface ConsoleHeader {\n eyebrow?: string;\n title: string;\n actions?: ReactNode;\n}\nexport interface ConsoleShellProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"children\" | \"context\"> {\n surface: string;\n activePath: string;\n brand: { href: string; name: string; mark: string };\n context?: readonly { label: string; value: string }[];\n nav: readonly ConsoleNavGroup[];\n labels: ConsoleShellLabels;\n header: ConsoleHeader;\n foot?: ReactNode;\n children: ReactNode;\n}\nfunction isActive(path: string, item: ConsoleNavItem) {\n return (\n item.active ??\n (item.href.split(\"/\").filter(Boolean).length <= 1\n ? path === item.href\n : path === item.href || path.startsWith(`${item.href}/`))\n );\n}\nexport const ConsoleShell = forwardRef<HTMLDivElement, ConsoleShellProps>(\n function ConsoleShell(\n {\n surface,\n activePath,\n brand,\n context,\n nav,\n labels,\n header,\n foot,\n children,\n className,\n ...rest\n },\n ref\n ) {\n const [open, setOpen] = useState(false);\n const [hydrated, setHydrated] = useState(false);\n const id = useId();\n const railId = `dds-console-rail-${id}`;\n const mainId = `dds-console-main-${id}`;\n useEffect(() => {\n setHydrated(true);\n const onKey = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") setOpen(false);\n };\n document.addEventListener(\"keydown\", onKey);\n return () => document.removeEventListener(\"keydown\", onKey);\n }, []);\n return (\n <div\n {...rest}\n ref={ref}\n className={classes(\"dds-console-shell\", className)}\n data-surface={surface}\n data-hydrated={hydrated ? \"true\" : undefined}\n >\n <a className=\"dds-console-skip dds-visually-hidden\" href={`#${mainId}`}>\n {labels.skip}\n </a>\n <button\n className=\"dds-console-rail__toggle\"\n type=\"button\"\n data-action=\"toggle-rail\"\n aria-controls={railId}\n aria-expanded={open}\n onClick={() => setOpen(!open)}\n >\n <span aria-hidden />\n <span className=\"dds-visually-hidden\">\n {open ? labels.menuClose : labels.menuOpen}\n </span>\n </button>\n <div\n className=\"dds-console-rail__scrim\"\n data-open={String(open)}\n onClick={() => setOpen(false)}\n />\n <aside\n id={railId}\n className=\"dds-console-rail\"\n data-open={String(open)}\n >\n <a className=\"dds-console-rail__brand\" href={brand.href}>\n <img src={brand.mark} alt=\"\" width={20} height={20} />\n <strong>{brand.name}</strong>\n </a>\n {context && context.length > 0 && (\n <dl className=\"dds-console-rail__context\">\n {context.map((row, index) => (\n <div key={index}>\n <dt>{row.label}</dt>\n <dd>{row.value}</dd>\n </div>\n ))}\n </dl>\n )}\n <nav className=\"dds-console-rail__nav\" aria-label={labels.nav}>\n {nav.map((group, index) => (\n <section\n key={index}\n className=\"dds-console-rail__group\"\n aria-labelledby={`${id}-group-${index}`}\n >\n <h2\n id={`${id}-group-${index}`}\n className=\"dds-console-rail__group-label\"\n >\n {group.label}\n </h2>\n <ul>\n {group.items.map((item) => (\n <li key={item.id}>\n <a\n className=\"dds-console-rail__item\"\n data-nav={`${surface}.${item.id}`}\n href={item.href}\n aria-current={\n isActive(activePath, item) ? \"page\" : undefined\n }\n onClick={() => setOpen(false)}\n >\n <span>{item.label}</span>\n {item.badge !== undefined && item.badge > 0 && (\n <span\n className=\"dds-console-rail__badge\"\n aria-label={labels.badge.replace(\"{count}\", () =>\n String(item.badge)\n )}\n >\n {item.badge}\n </span>\n )}\n </a>\n </li>\n ))}\n </ul>\n </section>\n ))}\n </nav>\n {foot && <div className=\"dds-console-rail__foot\">{foot}</div>}\n </aside>\n <main id={mainId} className=\"dds-console-main\" tabIndex={-1}>\n <header className=\"dds-console-page-header\">\n <div className=\"dds-console-page-header__text\">\n {header.eyebrow && (\n <p className=\"dds-console-page-eyebrow\">{header.eyebrow}</p>\n )}\n <h1>{header.title}</h1>\n </div>\n {header.actions && (\n <div className=\"dds-console-page-header__actions\">\n {header.actions}\n </div>\n )}\n </header>\n {children}\n </main>\n </div>\n );\n }\n);\n"],"mappings":";;;;;;;;;;;;;AAYA,IAAa,KAAW,GAAG,MACzB,EAAO,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,GAQpB,IAAS,EACpB,SACE,EACE,UAAO,WACP,UAAO,MACP,YACA,aACA,UAAO,UACP,cACA,aACA,GAAG,KAEL,GACA;CACA,OACE,kBAAC,UAAD;EACE,GAAI;EACC;EACC;EACN,UAAU,KAAY;EACtB,aAAW,KAAW,KAAA;EACtB,WAAW,EACT,WACA,YAAY,KACZ,MAAS,QAAQ,YAAY,KAC7B,CACF;EAXF,UAAA,CAaG,KAAW,kBAAC,QAAD;GAAM,WAAU;GAAc,eAAA;EAAa,CAAA,GACtD,CACK;;AAEZ,CACF,GAKa,IAAa,EACxB,SACE,EACE,UAAO,SACP,UAAO,MACP,YACA,aACA,UAAO,UACP,cACA,aACA,GAAG,KAEL,GACA;CACA,OACE,kBAAC,UAAD;EACE,GAAI;EACC;EACC;EACN,UAAU,KAAY;EACtB,aAAW,KAAW,KAAA;EACtB,WAAW,EACT,eACA,MAAS,WAAW,gBAAgB,KACpC,MAAS,QAAQ,gBAAgB,KACjC,CACF;EAEC,UAAA,IAAU,kBAAC,QAAD;GAAM,WAAU;GAAc,eAAA;EAAa,CAAA,IAAI;CACpD,CAAA;AAEZ,CACF,GAea,IAAQ,EAAuC,SAC1D,EACE,IAAI,GACJ,UACA,aACA,UACA,aACA,cACA,aACA,GAAG,KAEL,GACA;CACA,IAAM,IAAY,EAAM,GAClB,IAAK,KAAa,aAAa,KAC/B,IAA6B;EACjC;EACA,oBACE,CAAC,KAAY,GAAG,EAAG,QAAQ,KAAS,GAAG,EAAG,OAAO,CAAC,CAC/C,OAAO,OAAO,CAAC,CACf,KAAK,GAAG,KAAK,KAAA;EAClB,gBAAgB,IAAQ,KAAO,KAAA;EAC/B,iBAAiB,IAAW,KAAO,KAAA;CACrC;CACA,OACE,kBAAC,EAAS,MAAV;EACE,GAAI;EACC;EACL,SAAS,EAAQ;EACP;EACN;EACJ,KAAK;GACH,SAAS,GAAG,EAAG;GACf,YAAY,GAAG,EAAG;GAClB,WAAW,GAAG,EAAG;EACnB;EACA,WAAW,EACT,aACA,EAAQ,KAAU,oBAClB,CACF;EAfF,UAAA;GAiBE,kBAAC,EAAS,OAAV;IAAgB,SAAS;IAAI,WAAU;IAAvC,UAAA,CACG,GACA,KAAY,kBAAC,QAAD;KAAM,eAAA;KAAY,UAAA;IAAQ,CAAA,CACzB;;GACf,OAAO,KAAa,aAAa,EAAS,CAAO,IAAI;GACrD,KACC,kBAAC,EAAS,YAAV;IAAqB,WAAU;IAC5B,UAAA;GACkB,CAAA;GAEtB,KACC,kBAAC,EAAS,WAAV;IAAoB,WAAU;IAAmB,MAAK;IACnD,UAAA;GACiB,CAAA;EAET;;AAEnB,CAAC,GAKY,IAAS,EACpB,SACE,EAAE,YAAS,qBAAkB,cAAW,aAAU,GAAG,KACrD,GACA;CACA,OACE,kBAAC,QAAD;EAAM,WAAW,EAAQ,cAAc,CAAgB;EACrD,UAAA,kBAAC,UAAD;GACE,GAAI;GACC;GACL,WAAW,EAAQ,qBAAqB,CAAS;GACjD,gBAAc,KAAW,EAAK;GAE7B;EACK,CAAA;CACJ,CAAA;AAEV,CACF,GASM,IAAY,EAGhB,SACA,EACE,SACA,UACA,YACA,mBACA,oBACA,OACA,SACA,UACA,aACA,aACA,aACA,SACA,cACA,mBACA,aACA,GAAG,KAEL,GACA;CACA,IAAM,IAAO,MAAS,WAAW,EAAU,OAAO,EAAY,MACxD,IAAQ,MAAS,WAAW,EAAU,QAAQ,EAAY,OAC1D,IAAU,MAAS,WAAW,EAAU,UAAU,EAAY,SAC9D,IAAO,MAAS,WAAW,eAAe;CAChD,OACE,kBAAC,GAAD;EACW;EACO;EAChB,kBAAkB,MAAY,IAAkB,EAAQ,YAAY,EAAI;EACxE,KAAK,IAAK,EAAE,aAAa,EAAG,IAAI,KAAA;EAC1B;EACN,OAAO,OAAO,KAAS,IAAI;EACjB;EACA;EACA;EACJ;EACN,WAAW,EAAQ,GAAM,CAAS;EAXpC,UAAA,CAaE,kBAAC,GAAD,EAAA,WACI,MAAQ;GAIR,IAAM,EACJ,OAAO,GACP,gBAAgB,GAChB,GAAG,MACD,EAAI,oBAAoB;GAC5B,OACE,kBAAC,SAAD;IACE,GAAI;IACJ,GAAI;IACC;IACL,SAAS,EAAI;IACb,MAAM,MAAS,WAAW,WAAW,KAAA;IACrC,UAAU,YAAmB,CAAC;IAC9B,UAAU,MAAU;KAElB,AADA,EAAK,UAAU,CAAK,GACf,EAAM,oBAAkB,EAAW,UAAU,CAAK;IACzD;IACA,WAAW,EAAQ,GAAG,EAAK,UAAU,CAAc;GACpD,CAAA;EAEL,EACO,CAAA,GACT,kBAAC,GAAD,EAAA,UAAQ,EAAa,CAAA,CACjB;;AAEV,CAAC,GACY,IAAW,GACrB,GAAO,MAAQ,kBAAC,GAAD;CAAW,GAAI;CAAO,MAAK;CAAgB;AAAM,CAAA,CACnE,GACa,IAAS,GACnB,GAAO,MAAQ,kBAAC,GAAD;CAAW,GAAI;CAAO,MAAK;CAAc;AAAM,CAAA,CACjE,GACa,IAAQ,EAAyC,SAC5D,EAAE,UAAO,cAAW,mBAAgB,oBAAiB,aAAU,GAAG,KAClE,GACA;CACA,OACE,kBAAC,SAAD;EAAO,WAAW,EAAQ,aAAa,CAAS;EAAhD,UAAA,CACE,kBAAC,SAAD;GACE,GAAI;GACC;GACL,MAAK;GACL,WAAW,EAAQ,oBAAoB,CAAc;GACrD,WAAW,MAAU;IAEnB,AADA,IAAW,CAAK,GACX,EAAM,oBACT,IAAkB,EAAM,cAAc,OAAO;GACjD;EACD,CAAA,GACD,kBAAC,QAAD,EAAA,UAAO,EAAY,CAAA,CACd;;AAEX,CAAC,GC5RY,IAAO,EAAsC,SACxD,EAAE,kBAAe,aAAU,cAAW,GAAG,KACzC,GACA;CACA,OACE,kBAAC,EAAQ,MAAT;EACE,GAAI;EACC;EACL,gBAAgB,MAAY,IAAgB,EAAQ,KAAK;EACzD,WAAW,EAAQ,CAAC,KAAY,iBAAiB,CAAS;CAC3D,CAAA;AAEL,CAAC,GAKY,IAAU,EAGrB,SAAiB,EAAE,aAAU,cAAW,GAAG,KAAQ,GAAK;CACxD,OACE,kBAAC,EAAQ,MAAT;EACE,GAAI;EACC;EACL,WAAW,EAAQ,CAAC,KAAY,YAAY,CAAS;CACtD,CAAA;AAEL,CAAC,GACY,IAAM,EAAwC,SACzD,EAAE,aAAU,cAAW,GAAG,KAC1B,GACA;CACA,OACE,kBAAC,EAAQ,SAAT;EACE,GAAI;EACC;EACL,WAAW,EAAQ,CAAC,KAAY,WAAW,CAAS;CACrD,CAAA;AAEL,CAAC,GACY,IAAW,EACtB,SAAkB,EAAE,UAAO,UAAO,GAAG,KAAQ,GAAK;CAEhD,IAAM,IADO,EACI,CAAA,CAAK,UAAU;CAChC,OACE,kBAAC,EAAQ,SAAT;EACE,GAAI;EACG;EACF;EACL,QAAQ;EACR,OAAO,IAAW;GAAE,GAAG;GAAO,SAAS;EAAO,IAAI;CACnD,CAAA;AAEL,CACF;AACA,SAAS,EAAkB,EAAE,aAAmC;CAC9D,IAAM,IAAQ,EAAqB,GAE7B,EACJ,OAAO,GACP,gBAAgB,GAChB,GAAG,MACD,EAAM,wBAAwB,CAAM;CACxC,OACE,kBAAC,SAAD;EACE,GAAI;EACJ,SAAS,EAAM,UAAU,EAAO;EAChC,gBAAgB,CAAC;EACjB,WAAU;CACX,CAAA;AAEL;AAgBA,IAAa,IAAa,EACxB,SACE,EAAE,YAAS,UAAO,kBAAe,cAAW,aAAU,GAAG,KACzD,GACA;CACA,OACE,kBAAC,EAAc,MAAf;EACE,GAAI;EACC;EACL,gBAAgB,MAAY;GAC1B,AAAI,EAAQ,UAAU,QAAM,IAAgB,EAAQ,KAAK;EAC3D;EACA,WAAW,EAAQ,mBAAmB,CAAS;EANjD,UAAA;GAQE,kBAAC,EAAc,OAAf;IAAqB,WAAU;IAC5B,UAAA;GACkB,CAAA;GACpB,EAAQ,KAAK,MACZ,kBAAC,EAAc,MAAf;IAEE,OAAO,EAAO;IACd,UAAU,EAAO;IACjB,WAAU;IAJZ,UAAA,CAME,kBAAC,GAAD,EAA2B,UAAS,CAAA,GACpC,kBAAC,EAAc,UAAf,EAAA,UAAyB,EAAO,MAA8B,CAAA,CAC5C;GAPb,GAAA,EAAO,KAOM,CACrB;GACA;EACiB;;AAExB,CACF,GChGa,IAAS,EAAwC,SAC5D,EACE,UACA,gBACA,aACA,YACA,iBACA,mBACA,YAAS,IACT,cACA,qBACA,iBACA,iBACA,eACA,UACA,aACA,GAAG,KAEL,GACA;CACA,IAAM,IAA0B;EAC9B,OACE,kBAAC,EAAU,OAAX;GAAiB,WAAW,IAAW,KAAA,IAAY;GAChD,UAAA;EACc,CAAA;EAEnB,aAAa,KACX,kBAAC,EAAU,aAAX;GACE,WAAW,IAAW,KAAA,IAAY;GAEjC,UAAA;EACoB,CAAA;EAEzB;EACA,SAAS,KACP,kBAAC,OAAD;GAAK,WAAW,IAAW,KAAA,IAAY;GACpC,UAAA;EACE,CAAA;CAET,GACM,IACJ,kBAAC,EAAU,YAAX;EACE,WAAW,EAAQ,CAAC,KAAY,sBAAsB,CAAgB;EAEtE,UAAA,kBAAC,EAAU,SAAX;GACE,GAAI;GACC;GACL,oBACE,IAAc,IAAe,sBAAsB,KAAA;GAErD,WAAW,EACT,CAAC,KAAY,cACb,GACA,GAAc,SAChB;GAEC,UAAA,IACC,EAAM,CAAK,IAEX,kBAAA,GAAA,EAAA,UAAA;IACG,EAAM;IACN,EAAM;IACN;IACA,EAAM;GACP,EAAA,CAAA;EAEa,CAAA;CACC,CAAA;CAExB,OACE,kBAAC,EAAU,MAAX;EACE,GAAI;EACJ,eAAe,MAAY,IAAe,EAAQ,IAAI;EACtD,wBAAwB,KAAkB,EAAK;EAC/C,gBACE,UAAqB,EAAa,KAAK,OAAO,EAAK;EAErD,cAAc,UAAmB,EAAW,KAAK,OAAO,EAAK;EAC7D,WAAA;EACA,eAAA;EAEC,UAAA,IAAS,kBAAC,GAAD,EAAA,UAAS,EAAgB,CAAA,IAAI;CACzB,CAAA;AAEpB,CAAC;AAaD,SAAgB,EAAQ,EACtB,YACA,aACA,iBACA,cACA,iBACA,GAAG,KACY;CACf,OACE,kBAAC,EAAW,MAAZ;EACE,WAAW;EACX,YAAY;EACZ,GAAI;EACJ,eAAe,MAAY,IAAe,EAAQ,IAAI;EAEtD,UAAA,kBAAC,QAAD;GAAM,WAAW,EAAQ,eAAe,CAAS;GAAjD,UAAA,CACG,OAAO,KAAa,aACnB,kBAAC,EAAW,SAAZ,EAAA,WACI,MAAQ,EAAS,EAAI,gBAAgB,CAAC,EACtB,CAAA,IAEpB,kBAAC,EAAW,SAAZ;IAAoB,SAAA;IAAS;GAA6B,CAAA,GAE5D,kBAAC,GAAD,EAAA,UACE,kBAAC,EAAW,YAAZ,EAAA,UACE,kBAAC,EAAW,SAAZ;IACE,GAAI;IACJ,WAAW,EACT,uBACA,GAAc,SAChB;IAEC,UAAA;GACiB,CAAA,EACC,CAAA,EACjB,CAAA,CACJ;;CACS,CAAA;AAErB;;;AClKA,IAAa,IAAO,EAAqC,SACvD,EAAE,SAAM,UAAO,UAAO,IAAI,gBAAa,cAAW,GAAG,KACrD,GACA;CACA,IAAM,IAAO,EAAM;CACnB,OACE,kBAAC,OAAD;EACE,GAAI;EACC;EACL,SAAS,EAAK;EACd,OAAO;EACP,QAAQ;EACR,MAAK;EACL,QAAO;EACP,aAAa,EAAK;EAClB,eAAc;EACd,gBAAe;EACf,MAAM,IAAQ,QAAQ,KAAA;EACtB,cAAY;EACZ,eAAa,MAAQ,KAAA;EACrB,WAAW,GACR,KAAe,EAAgB,YAAY,SAAS,CAAI,MACvD,EAAgB,UAClB,CACF;EAlBF,UAAA,CAoBG,KAAS,kBAAC,SAAD,EAAA,UAAQ,EAAa,CAAA,GAC/B,kBAAC,KAAD,EAAG,yBAAyB,EAAE,QAAQ,EAAK,KAAK,EAAI,CAAA,CACjD;;AAET,CAAC,GCRK,IAAe,EAA+B,IAAI;AACxD,SAAgB,EAAc,EAC5B,aACA,qBAAkB,KAClB,iBACA,gBACA,gBACqB;CACrB,IAAM,IAAS,EAAM,GACf,IAAW,EAAO,CAAC,GACnB,IAAU,QAEZ,EAAc;EACZ,WAAW;EACX,SAAS;EACT,KAAK;EACL,SAAS;EACT,aAAa;EACb,QAAQ,CAAC,eAAe;CAC1B,CAAC,GACH,CAAC,CACH,GACM,IAAM,SACH;EACL,KAAK,GAAO;GACV,IAAM,IAAK,aAAa,EAAO,GAAG,EAAE,EAAS,WACvC,IAAW,EAAM,YAAY;GAQnC,OAPA,EAAQ,OAAO;IACb;IACA,aAAa,EAAM;IACnB,MAAM,EAAM,SAAS,WAAW,UAAU,EAAM,QAAQ;IACxD,UAAU,IAAW,IAAI,IAAW;IACpC,MAAM,EAAE,KAAK;KAAE,GAAG;KAAO;IAAG,EAAE;GAChC,CAAC,GACM;EACT;EACA,UAAU,MAAO,EAAQ,OAAO,CAAE;EAClC,aAAa,EAAQ,OAAO;CAC9B,IACC;EAAC;EAAS;EAAQ;CAAe,CAAC;CAErC,OADA,cAAsB,EAAQ,OAAO,GAAG,CAAC,CAAO,CAAC,GAE/C,kBAAC,EAAa,UAAd;EAAuB,OAAO;EAA9B,UAAA,CACG,GACD,kBAAC,GAAD;GACW;GACT,OAAO,KAAe;GACtB,cAAY,KAAe;GAC3B,MAAM,IAAc,WAAW;GAC/B,WAAW,EAAQ,oBAAoB,CAAS;GAE9C,WAAA,MAAU;IACV,IAAM,IAAS,EAAM,MAAM;IAC3B,OACE,kBAAC,EAAS,MAAV;KACE,WAAW,EACT,aACA,cAAc,EAAO,QAAQ,QAC/B;KACA,MAAM,EAAO,SAAS,WAAW,UAAU;KAL7C,UAAA,CAOE,kBAAC,EAAS,aAAV,EAAA,UAAuB,EAAM,YAAkC,CAAA,GAC9D,KACC,kBAAC,EAAS,cAAV;MACE,WAAU;MACV,cACE,OAAO,KAAiB,aACpB,EAAa,CAAM,IACnB;MAEP,UAAA;KAEsB,CAAA,CAEZ;;GAEnB;EACO,CAAA,CACY;;AAE3B;AACA,SAAgB,KAAqB;CACnC,IAAM,IAAM,EAAW,CAAY;CACnC,IAAI,CAAC,GAAK,MAAU,MAAM,gDAAgD;CAC1E,OAAO;AACT;;;ACzEA,SAAS,GAAS,GAAc,GAAsB;CACpD,OACE,EAAK,WACJ,EAAK,KAAK,MAAM,GAAG,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,UAAU,IAC5C,MAAS,EAAK,OACd,MAAS,EAAK,QAAQ,EAAK,WAAW,GAAG,EAAK,KAAK,EAAE;AAE7D;AACA,IAAa,KAAe,EAC1B,SACE,EACE,YACA,eACA,UACA,YACA,QACA,WACA,WACA,SACA,aACA,cACA,GAAG,KAEL,GACA;CACA,IAAM,CAAC,GAAM,KAAW,EAAS,EAAK,GAChC,CAAC,GAAU,KAAe,EAAS,EAAK,GACxC,IAAK,EAAM,GACX,IAAS,oBAAoB,KAC7B,IAAS,oBAAoB;CASnC,OARA,QAAgB;EACd,EAAY,EAAI;EAChB,IAAM,KAAS,MAAyB;GACtC,AAAI,EAAM,QAAQ,YAAU,EAAQ,EAAK;EAC3C;EAEA,OADA,SAAS,iBAAiB,WAAW,CAAK,SAC7B,SAAS,oBAAoB,WAAW,CAAK;CAC5D,GAAG,CAAC,CAAC,GAEH,kBAAC,OAAD;EACE,GAAI;EACC;EACL,WAAW,EAAQ,qBAAqB,CAAS;EACjD,gBAAc;EACd,iBAAe,IAAW,SAAS,KAAA;EALrC,UAAA;GAOE,kBAAC,KAAD;IAAG,WAAU;IAAuC,MAAM,IAAI;IAC3D,UAAA,EAAO;GACP,CAAA;GACH,kBAAC,UAAD;IACE,WAAU;IACV,MAAK;IACL,eAAY;IACZ,iBAAe;IACf,iBAAe;IACf,eAAe,EAAQ,CAAC,CAAI;IAN9B,UAAA,CAQE,kBAAC,QAAD,EAAM,eAAA,GAAa,CAAA,GACnB,kBAAC,QAAD;KAAM,WAAU;KACb,UAAA,IAAO,EAAO,YAAY,EAAO;IAC9B,CAAA,CACA;;GACR,kBAAC,OAAD;IACE,WAAU;IACV,aAAW,OAAO,CAAI;IACtB,eAAe,EAAQ,EAAK;GAC7B,CAAA;GACD,kBAAC,SAAD;IACE,IAAI;IACJ,WAAU;IACV,aAAW,OAAO,CAAI;IAHxB,UAAA;KAKE,kBAAC,KAAD;MAAG,WAAU;MAA0B,MAAM,EAAM;MAAnD,UAAA,CACE,kBAAC,OAAD;OAAK,KAAK,EAAM;OAAM,KAAI;OAAG,OAAO;OAAI,QAAQ;MAAK,CAAA,GACrD,kBAAC,UAAD,EAAA,UAAS,EAAM,KAAa,CAAA,CAC3B;;KACF,KAAW,EAAQ,SAAS,KAC3B,kBAAC,MAAD;MAAI,WAAU;MACX,UAAA,EAAQ,KAAK,GAAK,MACjB,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,MAAD,EAAA,UAAK,EAAI,MAAU,CAAA,GACnB,kBAAC,MAAD,EAAA,UAAK,EAAI,MAAU,CAAA,CAChB,EAAA,GAHK,CAGL,CACN;KACC,CAAA;KAEN,kBAAC,OAAD;MAAK,WAAU;MAAwB,cAAY,EAAO;MACvD,UAAA,EAAI,KAAK,GAAO,MACf,kBAAC,WAAD;OAEE,WAAU;OACV,mBAAiB,GAAG,EAAG,SAAS;OAHlC,UAAA,CAKE,kBAAC,MAAD;QACE,IAAI,GAAG,EAAG,SAAS;QACnB,WAAU;QAET,UAAA,EAAM;OACL,CAAA,GACJ,kBAAC,MAAD,EAAA,UACG,EAAM,MAAM,KAAK,MAChB,kBAAC,MAAD,EAAA,UACE,kBAAC,KAAD;QACE,WAAU;QACV,YAAU,GAAG,EAAQ,GAAG,EAAK;QAC7B,MAAM,EAAK;QACX,gBACE,GAAS,GAAY,CAAI,IAAI,SAAS,KAAA;QAExC,eAAe,EAAQ,EAAK;QAP9B,UAAA,CASE,kBAAC,QAAD,EAAA,UAAO,EAAK,MAAY,CAAA,GACvB,EAAK,UAAU,KAAA,KAAa,EAAK,QAAQ,KACxC,kBAAC,QAAD;SACE,WAAU;SACV,cAAY,EAAO,MAAM,QAAQ,iBAC/B,OAAO,EAAK,KAAK,CACnB;SAEC,UAAA,EAAK;QACF,CAAA,CAEP;OACD,CAAA,EAAA,GAtBK,EAAK,EAsBV,CACL,EACC,CAAA,CACG;MArCF,GAAA,CAqCE,CACV;KACE,CAAA;KACJ,KAAQ,kBAAC,OAAD;MAAK,WAAU;MAA0B,UAAA;KAAU,CAAA;IACvD;;GACP,kBAAC,QAAD;IAAM,IAAI;IAAQ,WAAU;IAAmB,UAAU;IAAzD,UAAA,CACE,kBAAC,UAAD;KAAQ,WAAU;KAAlB,UAAA,CACE,kBAAC,OAAD;MAAK,WAAU;MAAf,UAAA,CACG,EAAO,WACN,kBAAC,KAAD;OAAG,WAAU;OAA4B,UAAA,EAAO;MAAW,CAAA,GAE7D,kBAAC,MAAD,EAAA,UAAK,EAAO,MAAU,CAAA,CACnB;KACJ,CAAA,GAAA,EAAO,WACN,kBAAC,OAAD;MAAK,WAAU;MACZ,UAAA,EAAO;KACL,CAAA,CAED;IACP,CAAA,GAAA,CACG;;EACH;;AAET,CACF"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../src/controls.tsx","../src/selection.tsx","../src/overlays.tsx","../src/icon.tsx","../src/toast.tsx","../src/console-shell.tsx","../src/date-picker.tsx","../src/status-pill.tsx"],"sourcesContent":["import {\n forwardRef,\n useId,\n type ButtonHTMLAttributes,\n type InputHTMLAttributes,\n type SelectHTMLAttributes,\n type HTMLAttributes,\n type ReactNode,\n} from \"react\";\nimport { Field as ArkField } from \"@ark-ui/react/field\";\nimport { Checkbox as ArkCheckbox } from \"@ark-ui/react/checkbox\";\nimport { Switch as ArkSwitch } from \"@ark-ui/react/switch\";\nexport const classes = (...values: (string | false | undefined)[]) =>\n values.filter(Boolean).join(\" \");\nexport type ButtonTone = \"primary\" | \"secondary\" | \"ghost\" | \"danger\";\nexport type ControlSize = \"sm\" | \"md\" | \"lg\";\nexport interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n tone?: ButtonTone;\n size?: ControlSize;\n loading?: boolean;\n}\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n function Button(\n {\n tone = \"primary\",\n size = \"md\",\n loading,\n disabled,\n type = \"button\",\n className,\n children,\n ...rest\n },\n ref\n ) {\n return (\n <button\n {...rest}\n ref={ref}\n type={type}\n disabled={disabled || loading}\n aria-busy={loading || undefined}\n className={classes(\n \"dds-btn\",\n `dds-btn--${tone}`,\n size !== \"md\" && `dds-btn--${size}`,\n className\n )}\n >\n {loading && <span className=\"dds-spinner\" aria-hidden />}\n {children}\n </button>\n );\n }\n);\nexport interface IconButtonProps extends Omit<ButtonProps, \"tone\"> {\n \"aria-label\": string;\n tone?: \"ghost\" | \"secondary\" | \"danger\";\n}\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n function IconButton(\n {\n tone = \"ghost\",\n size = \"md\",\n loading,\n disabled,\n type = \"button\",\n className,\n children,\n ...rest\n },\n ref\n ) {\n return (\n <button\n {...rest}\n ref={ref}\n type={type}\n disabled={disabled || loading}\n aria-busy={loading || undefined}\n className={classes(\n \"dds-iconbtn\",\n tone !== \"ghost\" && `dds-iconbtn--${tone}`,\n size !== \"md\" && `dds-iconbtn--${size}`,\n className\n )}\n >\n {loading ? <span className=\"dds-spinner\" aria-hidden /> : children}\n </button>\n );\n }\n);\nexport interface FieldControlProps {\n id: string;\n \"aria-describedby\"?: string;\n \"aria-invalid\"?: true;\n \"aria-required\"?: true;\n}\nexport interface FieldProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n label: ReactNode;\n helpText?: ReactNode;\n error?: ReactNode;\n required?: boolean;\n children: ReactNode | ((props: FieldControlProps) => ReactNode);\n}\nexport const Field = forwardRef<HTMLDivElement, FieldProps>(function Field(\n {\n id: requested,\n label,\n helpText,\n error,\n required,\n className,\n children,\n ...rest\n },\n ref\n) {\n const generated = useId();\n const id = requested ?? `dds-field-${generated}`;\n const control: FieldControlProps = {\n id,\n \"aria-describedby\":\n [helpText && `${id}-help`, error && `${id}-error`]\n .filter(Boolean)\n .join(\" \") || undefined,\n \"aria-invalid\": error ? true : undefined,\n \"aria-required\": required ? true : undefined,\n };\n return (\n <ArkField.Root\n {...rest}\n ref={ref}\n invalid={Boolean(error)}\n required={required}\n id={id}\n ids={{\n control: `${id}-root`,\n helperText: `${id}-help`,\n errorText: `${id}-error`,\n }}\n className={classes(\n \"dds-field\",\n Boolean(error) && \"dds-field--error\",\n className\n )}\n >\n <ArkField.Label htmlFor={id} className=\"dds-field__label\">\n {label}\n {required && <span aria-hidden> *</span>}\n </ArkField.Label>\n {typeof children === \"function\" ? children(control) : children}\n {helpText && (\n <ArkField.HelperText className=\"dds-field__help\">\n {helpText}\n </ArkField.HelperText>\n )}\n {error && (\n <ArkField.ErrorText className=\"dds-field__error\" role=\"alert\">\n {error}\n </ArkField.ErrorText>\n )}\n </ArkField.Root>\n );\n});\nexport interface SelectProps extends SelectHTMLAttributes<HTMLSelectElement> {\n invalid?: boolean;\n wrapperClassName?: string;\n}\nexport const Select = forwardRef<HTMLSelectElement, SelectProps>(\n function Select(\n { invalid, wrapperClassName, className, children, ...rest },\n ref\n ) {\n return (\n <span className={classes(\"dds-select\", wrapperClassName)}>\n <select\n {...rest}\n ref={ref}\n className={classes(\"dds-select__input\", className)}\n aria-invalid={invalid || rest[\"aria-invalid\"]}\n >\n {children}\n </select>\n </span>\n );\n }\n);\nexport interface CheckboxProps\n extends Omit<InputHTMLAttributes<HTMLInputElement>, \"type\" | \"children\"> {\n label: ReactNode;\n onCheckedChange?: (checked: boolean) => void;\n inputClassName?: string;\n}\nexport type RadioProps = CheckboxProps;\nexport type SwitchProps = CheckboxProps;\nconst Checkable = forwardRef<\n HTMLInputElement,\n CheckboxProps & { kind: \"checkbox\" | \"switch\" }\n>(function Checkable(\n {\n kind,\n label,\n checked,\n defaultChecked,\n onCheckedChange,\n id,\n name,\n value,\n disabled,\n required,\n readOnly,\n form,\n className,\n inputClassName,\n onChange,\n ...rest\n },\n ref\n) {\n const Root = kind === \"switch\" ? ArkSwitch.Root : ArkCheckbox.Root;\n const Label = kind === \"switch\" ? ArkSwitch.Label : ArkCheckbox.Label;\n const Context = kind === \"switch\" ? ArkSwitch.Context : ArkCheckbox.Context;\n const base = kind === \"switch\" ? \"dds-switch\" : \"dds-check\";\n return (\n <Root\n checked={checked}\n defaultChecked={defaultChecked}\n onCheckedChange={(details) => onCheckedChange?.(details.checked === true)}\n ids={id ? { hiddenInput: id } : undefined}\n name={name}\n value={String(value ?? \"on\")}\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n form={form}\n className={classes(base, className)}\n >\n <Context>\n {(api) => {\n // DDS styles the actual input. Keep Ark's events and state, but omit\n // its visually hidden style and use React's controlled checked prop\n // so a caller-declined change also restores the native DOM value.\n const {\n style: _,\n defaultChecked: __,\n ...inputProps\n } = api.getHiddenInputProps();\n return (\n <input\n {...inputProps}\n {...rest}\n ref={ref}\n checked={api.checked}\n role={kind === \"switch\" ? \"switch\" : undefined}\n onChange={onChange ?? (() => {})}\n onClick={(event) => {\n rest.onClick?.(event);\n if (!event.defaultPrevented) inputProps.onClick?.(event);\n }}\n className={classes(`${base}__input`, inputClassName)}\n />\n );\n }}\n </Context>\n <Label>{label}</Label>\n </Root>\n );\n});\nexport const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(\n (props, ref) => <Checkable {...props} kind=\"checkbox\" ref={ref} />\n);\nexport const Switch = forwardRef<HTMLInputElement, SwitchProps>(\n (props, ref) => <Checkable {...props} kind=\"switch\" ref={ref} />\n);\nexport const Radio = forwardRef<HTMLInputElement, RadioProps>(function Radio(\n { label, className, inputClassName, onCheckedChange, onChange, ...rest },\n ref\n) {\n return (\n <label className={classes(\"dds-check\", className)}>\n <input\n {...rest}\n ref={ref}\n type=\"radio\"\n className={classes(\"dds-check__input\", inputClassName)}\n onChange={(event) => {\n onChange?.(event);\n if (!event.defaultPrevented)\n onCheckedChange?.(event.currentTarget.checked);\n }}\n />\n <span>{label}</span>\n </label>\n );\n});\n","import { forwardRef, type ComponentProps, type ReactNode } from \"react\";\nimport { Tabs as ArkTabs, useTabsContext } from \"@ark-ui/react/tabs\";\nimport {\n RadioGroup as ArkRadioGroup,\n useRadioGroupContext,\n} from \"@ark-ui/react/radio-group\";\nimport { classes } from \"./controls\";\nexport interface TabsProps\n extends Omit<ComponentProps<typeof ArkTabs.Root>, \"onValueChange\"> {\n onValueChange?: (value: string) => void;\n unstyled?: boolean;\n}\nexport const Tabs = forwardRef<HTMLDivElement, TabsProps>(function Tabs(\n { onValueChange, unstyled, className, ...rest },\n ref\n) {\n return (\n <ArkTabs.Root\n {...rest}\n ref={ref}\n onValueChange={(details) => onValueChange?.(details.value)}\n className={classes(!unstyled && \"dds-tabs-root\", className)}\n />\n );\n});\nexport type TabProps = ComponentProps<typeof ArkTabs.Trigger> & {\n unstyled?: boolean;\n};\nexport type TabPanelProps = ComponentProps<typeof ArkTabs.Content>;\nexport const TabList = forwardRef<\n HTMLDivElement,\n ComponentProps<typeof ArkTabs.List> & { unstyled?: boolean }\n>(function TabList({ unstyled, className, ...rest }, ref) {\n return (\n <ArkTabs.List\n {...rest}\n ref={ref}\n className={classes(!unstyled && \"dds-tabs\", className)}\n />\n );\n});\nexport const Tab = forwardRef<HTMLButtonElement, TabProps>(function Tab(\n { unstyled, className, ...rest },\n ref\n) {\n return (\n <ArkTabs.Trigger\n {...rest}\n ref={ref}\n className={classes(!unstyled && \"dds-tab\", className)}\n />\n );\n});\nexport const TabPanel = forwardRef<HTMLDivElement, TabPanelProps>(\n function TabPanel({ value, style, ...rest }, ref) {\n const tabs = useTabsContext();\n const inactive = tabs.value !== value;\n return (\n <ArkTabs.Content\n {...rest}\n value={value}\n ref={ref}\n hidden={inactive}\n style={inactive ? { ...style, display: \"none\" } : style}\n />\n );\n }\n);\nfunction VisibleRadioInput({ option }: { option: RadioOption }) {\n const group = useRadioGroupContext();\n // Ark owns selection and roving focus; DDS displays the native radio.\n const {\n style: _,\n defaultChecked: __,\n ...inputProps\n } = group.getItemHiddenInputProps(option);\n return (\n <input\n {...inputProps}\n checked={group.value === option.value}\n onChange={() => {}}\n className=\"dds-check__input\"\n />\n );\n}\nexport interface RadioOption {\n value: string;\n label: ReactNode;\n disabled?: boolean;\n}\nexport interface RadioGroupProps\n extends Omit<\n ComponentProps<typeof ArkRadioGroup.Root>,\n \"onValueChange\" | \"children\"\n > {\n options: readonly RadioOption[];\n label: ReactNode;\n onValueChange?: (value: string) => void;\n children?: ReactNode;\n}\nexport const RadioGroup = forwardRef<HTMLDivElement, RadioGroupProps>(\n function RadioGroup(\n { options, label, onValueChange, className, children, ...rest },\n ref\n ) {\n return (\n <ArkRadioGroup.Root\n {...rest}\n ref={ref}\n onValueChange={(details) => {\n if (details.value !== null) onValueChange?.(details.value);\n }}\n className={classes(\"dds-radio-group\", className)}\n >\n <ArkRadioGroup.Label className=\"dds-field__label\">\n {label}\n </ArkRadioGroup.Label>\n {options.map((option) => (\n <ArkRadioGroup.Item\n key={option.value}\n value={option.value}\n disabled={option.disabled}\n className=\"dds-check\"\n >\n <VisibleRadioInput option={option} />\n <ArkRadioGroup.ItemText>{option.label}</ArkRadioGroup.ItemText>\n </ArkRadioGroup.Item>\n ))}\n {children}\n </ArkRadioGroup.Root>\n );\n }\n);\n","import {\n forwardRef,\n type ComponentProps,\n type ButtonHTMLAttributes,\n type ReactNode,\n} from \"react\";\nimport { Dialog as ArkDialog } from \"@ark-ui/react/dialog\";\nimport { Tooltip as ArkTooltip } from \"@ark-ui/react/tooltip\";\nimport { Portal } from \"@ark-ui/react/portal\";\nimport { classes } from \"./controls\";\nexport interface DialogFrameParts {\n title: ReactNode;\n description: ReactNode;\n children: ReactNode;\n actions: ReactNode;\n}\nexport interface DialogProps\n extends Omit<\n ComponentProps<typeof ArkDialog.Root>,\n \"children\" | \"onOpenChange\"\n > {\n title: ReactNode;\n description?: ReactNode;\n children: ReactNode;\n actions?: ReactNode;\n onOpenChange?: (open: boolean) => void;\n closeOnOutside?: boolean;\n portal?: boolean;\n className?: string;\n overlayClassName?: string;\n contentProps?: ComponentProps<typeof ArkDialog.Content>;\n initialFocus?: () => HTMLElement | null | undefined;\n finalFocus?: () => HTMLElement | null | undefined;\n frame?: (parts: DialogFrameParts) => ReactNode;\n unstyled?: boolean;\n}\nexport const Dialog = forwardRef<HTMLDivElement, DialogProps>(function Dialog(\n {\n title,\n description,\n children,\n actions,\n onOpenChange,\n closeOnOutside,\n portal = true,\n className,\n overlayClassName,\n contentProps,\n initialFocus,\n finalFocus,\n frame,\n unstyled,\n ...rest\n },\n ref\n) {\n const parts: DialogFrameParts = {\n title: (\n <ArkDialog.Title className={unstyled ? undefined : \"dds-dialog__title\"}>\n {title}\n </ArkDialog.Title>\n ),\n description: description && (\n <ArkDialog.Description\n className={unstyled ? undefined : \"dds-dialog__body\"}\n >\n {description}\n </ArkDialog.Description>\n ),\n children,\n actions: actions && (\n <div className={unstyled ? undefined : \"dds-dialog__actions\"}>\n {actions}\n </div>\n ),\n };\n const content = (\n <ArkDialog.Positioner\n className={classes(!unstyled && \"dds-dialog-overlay\", overlayClassName)}\n >\n <ArkDialog.Content\n {...contentProps}\n ref={ref}\n aria-describedby={\n description ? contentProps?.[\"aria-describedby\"] : undefined\n }\n className={classes(\n !unstyled && \"dds-dialog\",\n className,\n contentProps?.className\n )}\n >\n {frame ? (\n frame(parts)\n ) : (\n <>\n {parts.title}\n {parts.description}\n {children}\n {parts.actions}\n </>\n )}\n </ArkDialog.Content>\n </ArkDialog.Positioner>\n );\n return (\n <ArkDialog.Root\n {...rest}\n onOpenChange={(details) => onOpenChange?.(details.open)}\n closeOnInteractOutside={closeOnOutside ?? rest.closeOnInteractOutside}\n initialFocusEl={\n initialFocus ? () => initialFocus() ?? null : rest.initialFocusEl\n }\n finalFocusEl={finalFocus ? () => finalFocus() ?? null : rest.finalFocusEl}\n lazyMount\n unmountOnExit\n >\n {portal ? <Portal>{content}</Portal> : content}\n </ArkDialog.Root>\n );\n});\nexport type TooltipTriggerProps = ButtonHTMLAttributes<HTMLButtonElement>;\nexport interface TooltipProps\n extends Omit<\n ComponentProps<typeof ArkTooltip.Root>,\n \"children\" | \"onOpenChange\"\n > {\n content: ReactNode;\n children: ReactNode | ((props: TooltipTriggerProps) => ReactNode);\n onOpenChange?: (open: boolean) => void;\n className?: string;\n contentProps?: ComponentProps<typeof ArkTooltip.Content>;\n}\nexport function Tooltip({\n content,\n children,\n onOpenChange,\n className,\n contentProps,\n ...rest\n}: TooltipProps) {\n return (\n <ArkTooltip.Root\n openDelay={0}\n closeDelay={0}\n {...rest}\n onOpenChange={(details) => onOpenChange?.(details.open)}\n >\n <span className={classes(\"dds-tooltip\", className)}>\n {typeof children === \"function\" ? (\n <ArkTooltip.Context>\n {(api) => children(api.getTriggerProps())}\n </ArkTooltip.Context>\n ) : (\n <ArkTooltip.Trigger asChild>{children}</ArkTooltip.Trigger>\n )}\n <Portal>\n <ArkTooltip.Positioner>\n <ArkTooltip.Content\n {...contentProps}\n className={classes(\n \"dds-tooltip__bubble\",\n contentProps?.className\n )}\n >\n {content}\n </ArkTooltip.Content>\n </ArkTooltip.Positioner>\n </Portal>\n </span>\n </ArkTooltip.Root>\n );\n}\n","import { forwardRef, type SVGProps } from \"react\";\nimport { icons, directionPolicy, type DdsIconName } from \"@devslab/dds-icons\";\nimport { classes } from \"./controls\";\nexport interface IconProps\n extends Omit<SVGProps<SVGSVGElement>, \"name\" | \"children\"> {\n name: DdsIconName;\n label?: string;\n size?: number | string;\n directional?: boolean;\n}\nexport const Icon = forwardRef<SVGSVGElement, IconProps>(function Icon(\n { name, label, size = 24, directional, className, ...rest },\n ref\n) {\n const icon = icons[name];\n return (\n <svg\n {...rest}\n ref={ref}\n viewBox={icon.viewBox}\n width={size}\n height={size}\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth={icon.strokeWidth}\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n role={label ? \"img\" : undefined}\n aria-label={label}\n aria-hidden={label ? undefined : true}\n className={classes(\n (directional ?? directionPolicy.mirrorInRtl.includes(name)) &&\n directionPolicy.cssClass,\n className\n )}\n >\n {label && <title>{label}</title>}\n <g dangerouslySetInnerHTML={{ __html: icon.body }} />\n </svg>\n );\n});\n","import {\n createContext,\n useContext,\n useEffect,\n useId,\n useMemo,\n useRef,\n type ReactNode,\n} from \"react\";\nimport { Toast as ArkToast, Toaster, createToaster } from \"@ark-ui/react/toast\";\nimport { classes } from \"./controls\";\nexport type ToastTone = \"success\" | \"warning\" | \"danger\" | \"info\";\nexport interface ToastInput {\n message: ReactNode;\n tone?: ToastTone;\n duration?: number;\n}\nexport interface ToastRecord extends ToastInput {\n id: string;\n}\nexport interface ToastApi {\n show: (toast: ToastInput) => string;\n dismiss: (id: string) => void;\n clear: () => void;\n}\nexport interface ToastProviderProps {\n children: ReactNode;\n defaultDuration?: number;\n dismissLabel?: string | ((toast: ToastRecord) => string);\n regionLabel?: string;\n className?: string;\n}\nconst ToastContext = createContext<ToastApi | null>(null);\nexport function ToastProvider({\n children,\n defaultDuration = 5000,\n dismissLabel,\n regionLabel,\n className,\n}: ToastProviderProps) {\n const prefix = useId();\n const sequence = useRef(0);\n const toaster = useMemo(\n () =>\n createToaster({\n placement: \"bottom-end\",\n overlap: false,\n gap: 8,\n offsets: \"var(--dds-space-16)\",\n removeDelay: 0,\n hotkey: [\"DDS_NO_HOTKEY\"],\n }),\n []\n );\n const api = useMemo<ToastApi>(() => {\n return {\n show(input) {\n const id = `dds-toast-${prefix}-${++sequence.current}`;\n const duration = input.duration ?? defaultDuration;\n toaster.create({\n id,\n description: input.message,\n type: input.tone === \"danger\" ? \"error\" : input.tone ?? \"info\",\n duration: duration > 0 ? duration : Infinity,\n meta: { dds: { ...input, id } },\n });\n return id;\n },\n dismiss: (id) => toaster.remove(id),\n clear: () => toaster.remove(),\n };\n }, [toaster, prefix, defaultDuration]);\n useEffect(() => () => toaster.remove(), [toaster]);\n return (\n <ToastContext.Provider value={api}>\n {children}\n <Toaster\n toaster={toaster}\n label={regionLabel ?? \"\"}\n aria-label={regionLabel ?? \"\"}\n role={regionLabel ? \"region\" : \"presentation\"}\n className={classes(\"dds-toast-region\", className)}\n >\n {(toast) => {\n const record = toast.meta?.dds as ToastRecord;\n return (\n <ArkToast.Root\n className={classes(\n \"dds-toast\",\n `dds-toast--${record.tone ?? \"info\"}`\n )}\n role={record.tone === \"danger\" ? \"alert\" : \"status\"}\n >\n <ArkToast.Description>{toast.description}</ArkToast.Description>\n {dismissLabel && (\n <ArkToast.CloseTrigger\n className=\"dds-iconbtn dds-iconbtn--sm\"\n aria-label={\n typeof dismissLabel === \"function\"\n ? dismissLabel(record)\n : dismissLabel\n }\n >\n ×\n </ArkToast.CloseTrigger>\n )}\n </ArkToast.Root>\n );\n }}\n </Toaster>\n </ToastContext.Provider>\n );\n}\nexport function useToast(): ToastApi {\n const api = useContext(ToastContext);\n if (!api) throw new Error(\"useToast must be called inside <ToastProvider>\");\n return api;\n}\n","import {\n forwardRef,\n useEffect,\n useId,\n useState,\n type HTMLAttributes,\n type ReactNode,\n} from \"react\";\nimport { classes } from \"./controls\";\nexport interface ConsoleNavItem {\n id: string;\n href: string;\n label: string;\n badge?: number;\n active?: boolean;\n}\nexport interface ConsoleNavGroup {\n label: string;\n items: readonly ConsoleNavItem[];\n}\nexport interface ConsoleShellLabels {\n skip: string;\n menuOpen: string;\n menuClose: string;\n nav: string;\n badge: string;\n}\nexport interface ConsoleHeader {\n eyebrow?: string;\n title: string;\n actions?: ReactNode;\n}\nexport interface ConsoleShellProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"children\" | \"context\"> {\n surface: string;\n activePath: string;\n brand: { href: string; name: string; mark: string };\n context?: readonly { label: string; value: string }[];\n nav: readonly ConsoleNavGroup[];\n labels: ConsoleShellLabels;\n header: ConsoleHeader;\n foot?: ReactNode;\n children: ReactNode;\n}\nfunction isActive(path: string, item: ConsoleNavItem) {\n return (\n item.active ??\n (item.href.split(\"/\").filter(Boolean).length <= 1\n ? path === item.href\n : path === item.href || path.startsWith(`${item.href}/`))\n );\n}\nexport const ConsoleShell = forwardRef<HTMLDivElement, ConsoleShellProps>(\n function ConsoleShell(\n {\n surface,\n activePath,\n brand,\n context,\n nav,\n labels,\n header,\n foot,\n children,\n className,\n ...rest\n },\n ref\n ) {\n const [open, setOpen] = useState(false);\n const [hydrated, setHydrated] = useState(false);\n const id = useId();\n const railId = `dds-console-rail-${id}`;\n const mainId = `dds-console-main-${id}`;\n useEffect(() => {\n setHydrated(true);\n const onKey = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") setOpen(false);\n };\n document.addEventListener(\"keydown\", onKey);\n return () => document.removeEventListener(\"keydown\", onKey);\n }, []);\n return (\n <div\n {...rest}\n ref={ref}\n className={classes(\"dds-console-shell\", className)}\n data-surface={surface}\n data-hydrated={hydrated ? \"true\" : undefined}\n >\n <a className=\"dds-console-skip dds-visually-hidden\" href={`#${mainId}`}>\n {labels.skip}\n </a>\n <button\n className=\"dds-console-rail__toggle\"\n type=\"button\"\n data-action=\"toggle-rail\"\n aria-controls={railId}\n aria-expanded={open}\n onClick={() => setOpen(!open)}\n >\n <span aria-hidden />\n <span className=\"dds-visually-hidden\">\n {open ? labels.menuClose : labels.menuOpen}\n </span>\n </button>\n <div\n className=\"dds-console-rail__scrim\"\n data-open={String(open)}\n onClick={() => setOpen(false)}\n />\n <aside\n id={railId}\n className=\"dds-console-rail\"\n data-open={String(open)}\n >\n <a className=\"dds-console-rail__brand\" href={brand.href}>\n <img src={brand.mark} alt=\"\" width={20} height={20} />\n <strong>{brand.name}</strong>\n </a>\n {context && context.length > 0 && (\n <dl className=\"dds-console-rail__context\">\n {context.map((row, index) => (\n <div key={index}>\n <dt>{row.label}</dt>\n <dd>{row.value}</dd>\n </div>\n ))}\n </dl>\n )}\n <nav className=\"dds-console-rail__nav\" aria-label={labels.nav}>\n {nav.map((group, index) => (\n <section\n key={index}\n className=\"dds-console-rail__group\"\n aria-labelledby={`${id}-group-${index}`}\n >\n <h2\n id={`${id}-group-${index}`}\n className=\"dds-console-rail__group-label\"\n >\n {group.label}\n </h2>\n <ul>\n {group.items.map((item) => (\n <li key={item.id}>\n <a\n className=\"dds-console-rail__item\"\n data-nav={`${surface}.${item.id}`}\n href={item.href}\n aria-current={\n isActive(activePath, item) ? \"page\" : undefined\n }\n onClick={() => setOpen(false)}\n >\n <span>{item.label}</span>\n {item.badge !== undefined && item.badge > 0 && (\n <span\n className=\"dds-console-rail__badge\"\n aria-label={labels.badge.replace(\"{count}\", () =>\n String(item.badge)\n )}\n >\n {item.badge}\n </span>\n )}\n </a>\n </li>\n ))}\n </ul>\n </section>\n ))}\n </nav>\n {foot && <div className=\"dds-console-rail__foot\">{foot}</div>}\n </aside>\n <main id={mainId} className=\"dds-console-main\" tabIndex={-1}>\n <header className=\"dds-console-page-header\">\n <div className=\"dds-console-page-header__text\">\n {header.eyebrow && (\n <p className=\"dds-console-page-eyebrow\">{header.eyebrow}</p>\n )}\n <h1>{header.title}</h1>\n </div>\n {header.actions && (\n <div className=\"dds-console-page-header__actions\">\n {header.actions}\n </div>\n )}\n </header>\n {children}\n </main>\n </div>\n );\n }\n);\n","import {DatePicker as ArkDatePicker,parseDate} from '@ark-ui/react/date-picker';\nimport {Portal} from '@ark-ui/react/portal';\nimport {Button,Field} from './controls';\n\nexport interface DatePickerProps {\n label:string;\n /** ISO calendar date (YYYY-MM-DD), or an empty string. */\n value:string;\n onChange:(value:string)=>void;\n locale?:string;\n timeZone?:string;\n disabled?:boolean;\n min?:string;\n max?:string;\n}\nfunction CalendarIcon(){return <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.5\" aria-hidden=\"true\"><rect x=\"3.5\" y=\"5.5\" width=\"17\" height=\"15\" rx=\"2\"/><path d=\"M7.5 3v5M16.5 3v5M3.5 10.5h17\"/></svg>;}\nfunction Chevron({next=false}:{next?:boolean}){return <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.5\" aria-hidden=\"true\"><path d={next?'m9 5 7 7-7 7':'m15 5-7 7 7 7'}/></svg>;}\n\n\nexport function DatePicker({label,value,onChange,locale='ko-KR',timeZone='Asia/Seoul',disabled=false,min,max}:DatePickerProps){\n return (\n <Field label={label}>\n {control=><ArkDatePicker.Root locale={locale} timeZone={timeZone} disabled={disabled} min={min?parseDate(min):undefined} max={max?parseDate(max):undefined} startOfWeek={0} minView=\"day\" maxView=\"day\" fixedWeeks translations={{dayCell:state=>`${state.valueText} 선택`,clearTrigger:'선택 날짜 지우기'}} value={value?[parseDate(value)]:[]} format={v=>v.toString()} onValueChange={details=>onChange(details.valueAsString[0]||'')} positioning={{placement:'bottom-start',gutter:8}}>\n <ArkDatePicker.Control className=\"dds-date-picker-control\">\n <ArkDatePicker.Input {...control} placeholder=\"YYYY-MM-DD\" autoComplete=\"off\"/>\n <ArkDatePicker.Trigger asChild><Button type=\"button\" tone=\"secondary\" aria-label={`${label} 달력 열기`}><CalendarIcon/></Button></ArkDatePicker.Trigger>\n </ArkDatePicker.Control>\n <Portal><ArkDatePicker.Positioner className=\"dds-date-picker-positioner\"><ArkDatePicker.Content className=\"dds-date-picker-content\" aria-label={`${label} 날짜 선택`}>\n <ArkDatePicker.View view=\"day\">\n <ArkDatePicker.Context>{picker=><>\n <ArkDatePicker.ViewControl className=\"dds-date-picker-header\">\n <ArkDatePicker.PrevTrigger asChild><Button type=\"button\" tone=\"secondary\" aria-label=\"이전 달\"><Chevron/></Button></ArkDatePicker.PrevTrigger>\n <ArkDatePicker.RangeText/>\n <ArkDatePicker.NextTrigger asChild><Button type=\"button\" tone=\"secondary\" aria-label=\"다음 달\"><Chevron next/></Button></ArkDatePicker.NextTrigger>\n </ArkDatePicker.ViewControl>\n <ArkDatePicker.Table className=\"dds-date-picker-table\">\n <ArkDatePicker.TableHead><ArkDatePicker.TableRow>{picker.weekDays.map((day,index)=><ArkDatePicker.TableHeader key={index}>{day.short}</ArkDatePicker.TableHeader>)}</ArkDatePicker.TableRow></ArkDatePicker.TableHead>\n <ArkDatePicker.TableBody>{picker.weeks.map((week,index)=><ArkDatePicker.TableRow key={index}>{week.map(day=><ArkDatePicker.TableCell key={day.toString()} value={day}><ArkDatePicker.TableCellTrigger>{day.day}</ArkDatePicker.TableCellTrigger></ArkDatePicker.TableCell>)}</ArkDatePicker.TableRow>)}</ArkDatePicker.TableBody>\n </ArkDatePicker.Table>\n <div className=\"dds-date-picker-footer\"><Button type=\"button\" tone=\"secondary\" onClick={()=>picker.selectToday()}>오늘</Button><ArkDatePicker.ClearTrigger asChild><Button type=\"button\" tone=\"secondary\">지우기</Button></ArkDatePicker.ClearTrigger></div>\n </>}</ArkDatePicker.Context>\n </ArkDatePicker.View>\n </ArkDatePicker.Content></ArkDatePicker.Positioner></Portal>\n </ArkDatePicker.Root>}\n </Field>\n );\n}\n","export type StatusTone = \"success\" | \"warning\" | \"danger\" | \"info\" | \"brand\" | \"neutral\";\nexport function createStatusPill<D extends string>(config:{\n tones:Record<D,Record<string,StatusTone>>;\n label:(domain:D,value:string,locale:string)=>string|undefined;\n openDomains?:readonly NoInfer<D>[];\n}){\n const open=new Set<string>(config.openDomains??[]);\n return function StatusPill(props:{domain:D;value:string;locale:string}){\n const tone=config.tones[props.domain]?.[props.value];\n const label=config.label(props.domain,props.value,props.locale);\n if(!tone||!label){\n if(open.has(props.domain))return <code data-status={`${props.domain}.${props.value}`}>{props.value}</code>;\n throw new Error(!tone?`StatusPill: no tone for ${props.domain}.${props.value}`:`StatusPill: no label for ${props.domain}.${props.value}`);\n }\n return <span className={tone==='neutral'?'dds-badge':`dds-badge dds-badge--${tone}`} data-status={`${props.domain}.${props.value}`} data-tone={tone}>{label}</span>;\n };\n}\n"],"mappings":"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"}
@@ -0,0 +1,11 @@
1
+ export type StatusTone = "success" | "warning" | "danger" | "info" | "brand" | "neutral";
2
+ export declare function createStatusPill<D extends string>(config: {
3
+ tones: Record<D, Record<string, StatusTone>>;
4
+ label: (domain: D, value: string, locale: string) => string | undefined;
5
+ openDomains?: readonly NoInfer<D>[];
6
+ }): (props: {
7
+ domain: D;
8
+ value: string;
9
+ locale: string;
10
+ }) => import("react").JSX.Element;
11
+ //# sourceMappingURL=status-pill.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"status-pill.d.ts","sourceRoot":"","sources":["../src/status-pill.tsx"],"names":[],"mappings":"AAAA,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC;AACzF,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,MAAM,EAAE,MAAM,EAAC;IACzD,KAAK,EAAC,MAAM,CAAC,CAAC,EAAC,MAAM,CAAC,MAAM,EAAC,UAAU,CAAC,CAAC,CAAC;IAC1C,KAAK,EAAC,CAAC,MAAM,EAAC,CAAC,EAAC,KAAK,EAAC,MAAM,EAAC,MAAM,EAAC,MAAM,KAAG,MAAM,GAAC,SAAS,CAAC;IAC9D,WAAW,CAAC,EAAC,SAAS,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC;CACnC,WAEiC;IAAC,MAAM,EAAC,CAAC,CAAC;IAAA,KAAK,EAAC,MAAM,CAAC;IAAA,MAAM,EAAC,MAAM,CAAA;CAAC,iCAStE"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@devslab/dds-react",
3
- "version": "0.20.0",
3
+ "version": "0.21.1",
4
4
  "description": "Accessible React primitives for the DevsLab Design System",
5
5
  "type": "module",
6
6
  "license": "SEE LICENSE IN LICENSE",
@@ -39,9 +39,9 @@
39
39
  },
40
40
  "dependencies": {
41
41
  "@ark-ui/react": "5.39.3",
42
- "@devslab/dds-css": "0.20.0",
43
- "@devslab/dds-icons": "0.20.0",
44
- "@devslab/dds-tokens": "0.20.0"
42
+ "@devslab/dds-css": "0.21.1",
43
+ "@devslab/dds-icons": "0.21.1",
44
+ "@devslab/dds-tokens": "0.21.1"
45
45
  },
46
46
  "peerDependencies": {
47
47
  "react": "^18.3.0 || ^19.0.0",
package/styles.css CHANGED
@@ -18,3 +18,21 @@
18
18
  transform: translate(var(--x), var(--y));
19
19
  opacity: var(--opacity);
20
20
  }
21
+
22
+ /* Ark DatePicker interaction with DDS visual tokens. */
23
+ .dds-date-picker-control {display:flex;align-items:stretch;gap:8px;}
24
+ .dds-date-picker-control input {min-width:0;}
25
+ .dds-date-picker-control .dds-btn {flex-shrink:0;min-width:44px;padding-inline:10px;}
26
+ .dds-date-picker-positioner {z-index:100;}
27
+ .dds-date-picker-content {width:320px;max-width:calc(100vw - 32px);max-height:min(calc(100dvh - 32px),var(--available-height,100dvh));overflow:auto;box-sizing:border-box;padding:16px;background:var(--dds-color-bg-default);color:var(--dds-color-text-primary);border:1px solid var(--dds-color-border-default);border-radius:var(--dds-radius-md);font-family:var(--dds-font-family-sans);font-size:var(--dds-typo-body-2-font-size);}
28
+ .dds-date-picker-header {display:flex;align-items:center;justify-content:space-between;gap:12px;font-weight:600;margin-bottom:12px;}
29
+ .dds-date-picker-table {width:100%;border-collapse:collapse;table-layout:fixed;}
30
+ .dds-date-picker-table th {font-size:12px;font-weight:500;color:var(--dds-color-text-secondary);height:32px;}
31
+ .dds-date-picker-table td {padding:0;text-align:center;}
32
+ .dds-date-picker-table [data-part="table-cell-trigger"] {display:flex;align-items:center;justify-content:center;width:100%;height:40px;border:0;border-radius:var(--dds-radius-sm);font:inherit;color:inherit;background:transparent;cursor:pointer;}
33
+ .dds-date-picker-table [data-part="table-cell-trigger"]:hover {background:var(--dds-color-bg-brand-subtle);}
34
+ .dds-date-picker-table [data-outside-range] {color:var(--dds-color-text-secondary);}
35
+ .dds-date-picker-table [data-part="table-cell-trigger"][data-selected] {background:var(--dds-color-bg-brand);color:var(--dds-color-text-on-brand);}
36
+ .dds-date-picker-table [data-today]:not([data-selected]) {text-decoration:underline;text-underline-offset:4px;}
37
+ .dds-date-picker-content :focus-visible {outline:2px solid var(--dds-color-text-brand);outline-offset:2px;}
38
+ .dds-date-picker-footer {display:flex;justify-content:space-between;gap:12px;margin-top:12px;padding-top:12px;border-top:1px solid var(--dds-color-border-default);}