@cakejp/design-system 0.20.0 → 0.21.0

package/dist/components/foundations/data-table.js

@@ -1,18 +1,18 @@
 import { jsx as e, jsxs as s } from "react/jsx-runtime";
 import * as b from "react";
 import { cva as p } from "class-variance-authority";
-import x from "iconsax-reactjs/dist/esm/ArrowSwapVertical.js";
-import f from "iconsax-reactjs/dist/esm/ArrowUp.js";
+import f from "iconsax-reactjs/dist/esm/ArrowSwapVertical.js";
+import x from "iconsax-reactjs/dist/esm/ArrowUp.js";
 import v from "iconsax-reactjs/dist/esm/ArrowDown.js";
 import g from "iconsax-reactjs/dist/esm/ArrowDown2.js";
 import w from "iconsax-reactjs/dist/esm/More.js";
 import y from "iconsax-reactjs/dist/esm/Add.js";
 import N from "iconsax-reactjs/dist/esm/ExportSquare.js";
-import { cn as i } from "../../lib/utils.js";
+import { cn as n } from "../../lib/utils.js";
 import { FOCUS_RING as T } from "../../lib/focus-ring.js";
 import { Checkbox as C } from "./checkbox.js";
 import { Button as E } from "./button.js";
-import { Avatar as S, AvatarImage as D, AvatarFallback as k } from "./avatar.js";
+import { Avatar as S, AvatarImage as k, AvatarFallback as D } from "./avatar.js";
 import { Select as A, SelectTrigger as L, SelectValue as _, SelectContent as B, SelectItem as H } from "./select.js";
 import { DropdownMenu as z, DropdownMenuTrigger as M, DropdownMenuContent as P, DropdownMenuSeparator as I, DropdownMenuItem as R } from "./dropdown-menu.js";
 function te({ className: r, ...a }) {
@@ -20,7 +20,7 @@ function te({ className: r, ...a }) {
     "div",
     {
       "data-slot": "data-table",
-      className: i("relative w-full overflow-x-auto rounded-lg border border-[var(--Border-Low-Emphasis)]", r),
+      className: n("relative w-full overflow-x-auto rounded-lg border border-[var(--Border-Low-Emphasis)]", r),
       ...a
     }
   );
@@ -30,17 +30,17 @@ function le({ className: r, ...a }) {
     "table",
     {
       "data-slot": "data-table-table",
-      className: i("w-full caption-bottom typo-body-md border-collapse", r),
+      className: n("w-full caption-bottom typo-body-md border-collapse", r),
       ...a
     }
   );
 }
-function ne({ className: r, ...a }) {
+function oe({ className: r, ...a }) {
   return /* @__PURE__ */ e(
     "thead",
     {
       "data-slot": "data-table-header",
-      className: i("bg-[var(--Surface-Secondary)] [&_tr]:border-b [&_tr]:border-[var(--Border-Low-Emphasis)]", r),
+      className: n("bg-[var(--Surface-Secondary)] [&_tr]:border-b [&_tr]:border-[var(--Border-Low-Emphasis)]", r),
       ...a
     }
   );
@@ -50,7 +50,7 @@ function ie({ className: r, ...a }) {
     "tbody",
     {
       "data-slot": "data-table-body",
-      className: i("[&_tr:last-child]:border-b-0", r),
+      className: n("[&_tr:last-child]:border-b-0", r),
       ...a
     }
   );
@@ -69,7 +69,7 @@ const V = p(
     }
   }
 );
-function oe({
+function ne({
   className: r,
   state: a,
   ...t
@@ -78,7 +78,7 @@ function oe({
     "tr",
     {
       "data-slot": "data-table-row",
-      className: i(V({ state: a }), r),
+      className: n(V({ state: a }), r),
       ...t
     }
   );
@@ -87,18 +87,18 @@ function se({
   className: r,
   sortable: a,
   sortDirection: t,
-  onSort: n,
+  onSort: o,
   width: l,
-  srLabel: o,
+  srLabel: i,
   children: c,
   ...d
 }) {
-  const h = t === "asc" ? f : t === "desc" ? v : x, u = t === "asc" ? "ascending" : t === "desc" ? "descending" : "none";
+  const h = t === "asc" ? x : t === "desc" ? v : f, u = t === "asc" ? "ascending" : t === "desc" ? "descending" : "none";
   return /* @__PURE__ */ s(
     "th",
     {
       "data-slot": "data-table-head",
-      className: i(
+      className: n(
         "h-16 px-4 text-left align-middle typo-label-sm whitespace-nowrap text-[var(--Text-Medium-Emphasis)]",
         "[&:has([role=checkbox])]:w-12 [&:has([role=checkbox])]:pr-0",
         a && "hover:bg-[var(--Surface-Tertiary)]",
@@ -116,8 +116,8 @@ function se({
             "button",
             {
               type: "button",
-              onClick: n,
-              className: i(
+              onClick: o,
+              className: n(
                 "inline-flex items-center gap-1 rounded-sm outline-none",
                 "cursor-pointer select-none",
                 T,
@@ -130,14 +130,14 @@ function se({
                   {
                     size: 14,
                     "aria-hidden": "true",
-                    className: i(t ? "text-[var(--Text-High-Emphasis)]" : "text-[var(--Text-Low-Emphasis)]")
+                    className: n(t ? "text-[var(--Text-High-Emphasis)]" : "text-[var(--Text-Low-Emphasis)]")
                   }
                 )
               ]
             }
           )
         ) : c,
-        o && /* @__PURE__ */ e("span", { className: "sr-only", children: o })
+        i && /* @__PURE__ */ e("span", { className: "sr-only", children: i })
       ]
     }
   );
@@ -167,14 +167,14 @@ function m({
   className: r,
   width: a,
   align: t,
-  ...n
+  ...o
 }) {
   return /* @__PURE__ */ e(
     "td",
     {
       "data-slot": "data-table-cell",
-      className: i(j({ width: a, align: t }), r),
-      ...n
+      className: n(j({ width: a, align: t }), r),
+      ...o
     }
   );
 }
@@ -182,17 +182,17 @@ function ce({
   className: r,
   src: a,
   fallback: t,
-  title: n,
+  title: o,
   caption: l,
-  ...o
+  ...i
 }) {
-  return /* @__PURE__ */ e(m, { className: i("min-w-[200px]", r), ...o, children: /* @__PURE__ */ s("div", { className: "flex items-center gap-3", children: [
+  return /* @__PURE__ */ e(m, { className: n("min-w-[200px]", r), ...i, children: /* @__PURE__ */ s("div", { className: "flex items-center gap-3", children: [
     /* @__PURE__ */ s(S, { children: [
-      a && /* @__PURE__ */ e(D, { src: a, alt: n }),
-      /* @__PURE__ */ e(k, { children: t || n.charAt(0) })
+      a && /* @__PURE__ */ e(k, { src: a, alt: o }),
+      /* @__PURE__ */ e(D, { children: t || o.charAt(0) })
     ] }),
     /* @__PURE__ */ s("div", { className: "min-w-0", children: [
-      /* @__PURE__ */ e("p", { className: "typo-label-sm text-[var(--Text-High-Emphasis)] truncate", children: n }),
+      /* @__PURE__ */ e("p", { className: "typo-label-sm text-[var(--Text-High-Emphasis)] truncate", children: o }),
       l && /* @__PURE__ */ e("p", { className: "typo-body-xs text-[var(--Text-Low-Emphasis)] truncate", children: l })
     ] })
   ] }) });
@@ -201,24 +201,25 @@ function de({
   className: r,
   checked: a,
   onCheckedChange: t,
-  indeterminate: n,
+  indeterminate: o,
   "aria-label": l,
-  ...o
+  ...i
 }) {
   return /* @__PURE__ */ e(
     "td",
     {
       "data-slot": "data-table-checkbox-cell",
-      className: i("w-16 px-4 py-4 align-middle cursor-pointer", r),
+      className: n("w-16 px-4 py-4 align-middle cursor-pointer", r),
       onClick: (c) => {
-        c.stopPropagation(), t?.(!(!n && a));
+        c.stopPropagation(), t?.(!(!o && a));
       },
-      ...o,
+      ...i,
       children: /* @__PURE__ */ e(
         C,
         {
-          checked: n ? "indeterminate" : a,
+          checked: o ? "indeterminate" : a,
           onCheckedChange: (c) => t?.(c === !0),
+          onClick: (c) => c.stopPropagation(),
           "aria-label": l || "行を選択",
           className: "pointer-events-none"
         }
@@ -230,19 +231,19 @@ function me({
   className: r,
   actions: a,
   onClick: t,
-  ...n
+  ...o
 }) {
   return /* @__PURE__ */ e(
     m,
     {
-      className: i("w-10", r),
+      className: n("w-10", r),
       onClick: (l) => {
         l.stopPropagation(), t?.(l);
       },
-      ...n,
+      ...o,
       children: /* @__PURE__ */ s(z, { children: [
         /* @__PURE__ */ e(M, { asChild: !0, children: /* @__PURE__ */ e(E, { variant: "ghost", size: "sm", className: "size-8 p-0", "aria-label": "アクションメニュー", children: /* @__PURE__ */ e(w, { size: 16 }) }) }),
-        /* @__PURE__ */ e(P, { align: "end", children: a.map((l, o) => /* @__PURE__ */ s(b.Fragment, { children: [
+        /* @__PURE__ */ e(P, { align: "end", children: a.map((l, i) => /* @__PURE__ */ s(b.Fragment, { children: [
           l.separator && /* @__PURE__ */ e(I, {}),
           /* @__PURE__ */ e(
             R,
@@ -252,7 +253,7 @@ function me({
               children: l.label
             }
           )
-        ] }, o)) })
+        ] }, i)) })
       ] })
     }
   );
@@ -261,17 +262,17 @@ function pe({
   className: r,
   selectedCount: a,
   children: t,
-  ...n
+  ...o
 }) {
   return a === 0 ? null : /* @__PURE__ */ s(
     "div",
     {
       "data-slot": "data-table-bulk-actions",
-      className: i(
+      className: n(
         "flex items-center gap-3 px-4 py-3 bg-[var(--Surface-Accent-Primary-Light)] border-b border-[var(--Border-Low-Emphasis)]",
         r
       ),
-      ...n,
+      ...o,
       children: [
         /* @__PURE__ */ s("span", { className: "typo-label-sm text-[var(--Text-High-Emphasis)]", children: [
           a,
@@ -286,16 +287,16 @@ function he({
   className: r,
   title: a,
   colSpan: t,
-  expanded: n,
+  expanded: o,
   onToggle: l,
-  actions: o,
+  actions: i,
   ...c
 }) {
   return /* @__PURE__ */ e(
     "tr",
     {
       "data-slot": "data-table-section-row",
-      className: i("border-b border-[var(--Border-Low-Emphasis)] bg-[var(--Surface-Secondary)]", r),
+      className: n("border-b border-[var(--Border-Low-Emphasis)] bg-[var(--Surface-Secondary)]", r),
       ...c,
       children: /* @__PURE__ */ e("td", { colSpan: t, className: "px-4 py-3", children: /* @__PURE__ */ s("div", { className: "flex items-center justify-between", children: [
         /* @__PURE__ */ s(
@@ -304,14 +305,14 @@ function he({
             type: "button",
             className: "flex items-center gap-1.5 typo-label-md text-[var(--Text-High-Emphasis)] cursor-pointer",
             onClick: l,
-            "aria-expanded": n,
+            "aria-expanded": o,
             children: [
-              /* @__PURE__ */ e(g, { size: 16, className: i("transition-transform", n ? "" : "-rotate-90") }),
+              /* @__PURE__ */ e(g, { size: 16, className: n("transition-transform", o ? "" : "-rotate-90") }),
               a
             ]
           }
         ),
-        o && /* @__PURE__ */ e("div", { className: "flex items-center gap-2", children: o })
+        i && /* @__PURE__ */ e("div", { className: "flex items-center gap-2", children: i })
       ] }) })
     }
   );
@@ -320,15 +321,15 @@ function ue({
   className: r,
   colSpan: a,
   label: t = "新しく追加",
-  onClick: n,
+  onClick: o,
   ...l
 }) {
   return /* @__PURE__ */ e(
     "tr",
     {
       "data-slot": "data-table-add-row",
-      className: i("border-b border-[var(--Border-Low-Emphasis)] hover:bg-[var(--Surface-Tertiary)] cursor-pointer transition-colors", r),
-      onClick: n,
+      className: n("border-b border-[var(--Border-Low-Emphasis)] hover:bg-[var(--Surface-Tertiary)] cursor-pointer transition-colors", r),
+      onClick: o,
       ...l,
       children: /* @__PURE__ */ e("td", { colSpan: a, className: "px-4 py-4", children: /* @__PURE__ */ s("span", { className: "inline-flex items-center gap-2 typo-body-md text-[var(--Text-Medium-Emphasis)]", children: [
         /* @__PURE__ */ e(y, { size: 16 }),
@@ -341,51 +342,51 @@ function be({
   className: r,
   colSpan: a,
   message: t = "対象のデータはありません",
-  icon: n,
+  icon: o,
   description: l,
-  action: o,
+  action: i,
   ...c
 }) {
   return /* @__PURE__ */ e(
     "tr",
     {
       "data-slot": "data-table-empty-state",
-      className: i("", r),
+      className: n("", r),
       ...c,
-      children: /* @__PURE__ */ e("td", { colSpan: a, children: n ? /* @__PURE__ */ s("div", { className: "flex flex-col items-center justify-center px-4 py-16", children: [
-        /* @__PURE__ */ e("div", { className: "text-[var(--Border-Medium-Emphasis)]", children: n }),
+      children: /* @__PURE__ */ e("td", { colSpan: a, children: o ? /* @__PURE__ */ s("div", { className: "flex flex-col items-center justify-center px-4 py-16", children: [
+        /* @__PURE__ */ e("div", { className: "text-[var(--Border-Medium-Emphasis)]", children: o }),
         /* @__PURE__ */ e("p", { className: "mt-4 typo-heading-md text-[var(--Text-High-Emphasis)]", children: t }),
         l && /* @__PURE__ */ e("div", { className: "mt-1 text-center typo-body-md text-[var(--Text-Medium-Emphasis)]", children: l }),
-        o && /* @__PURE__ */ e("div", { className: "mt-6", children: o })
+        i && /* @__PURE__ */ e("div", { className: "mt-6", children: i })
       ] }) : /* @__PURE__ */ e("p", { className: "py-12 text-center typo-body-md text-[var(--Text-Low-Emphasis)]", children: t }) })
     }
   );
 }
-function xe({
+function fe({
   className: r,
   src: a,
   alt: t,
-  title: n,
+  title: o,
   caption: l,
-  ...o
+  ...i
 }) {
-  return /* @__PURE__ */ e(m, { className: i("min-w-[200px]", r), ...o, children: /* @__PURE__ */ s("div", { className: "flex items-center gap-3", children: [
+  return /* @__PURE__ */ e(m, { className: n("min-w-[200px]", r), ...i, children: /* @__PURE__ */ s("div", { className: "flex items-center gap-3", children: [
     /* @__PURE__ */ e("div", { className: "size-10 rounded-lg bg-[var(--Surface-Tertiary)] overflow-hidden shrink-0", children: a && /* @__PURE__ */ e(
       "img",
       {
         src: a,
-        alt: t || n,
+        alt: t || o,
         className: "size-full object-cover",
         loading: "lazy"
       }
     ) }),
     /* @__PURE__ */ s("div", { className: "min-w-0", children: [
-      /* @__PURE__ */ e("p", { className: "typo-body-md text-[var(--Text-High-Emphasis)] line-clamp-2", children: n }),
+      /* @__PURE__ */ e("p", { className: "typo-body-md text-[var(--Text-High-Emphasis)] line-clamp-2", children: o }),
       l && /* @__PURE__ */ e("p", { className: "typo-body-xs text-[var(--Text-Low-Emphasis)] truncate", children: l })
     ] })
   ] }) });
 }
-function fe({
+function xe({
   className: r,
   ...a
 }) {
@@ -393,7 +394,7 @@ function fe({
     "td",
     {
       "data-slot": "data-table-drag-handle-cell",
-      className: i("w-10 px-2 py-4 align-middle cursor-grab active:cursor-grabbing", r),
+      className: n("w-10 px-2 py-4 align-middle cursor-grab active:cursor-grabbing", r),
       ...a,
       children: /* @__PURE__ */ s(
         "svg",
@@ -422,17 +423,18 @@ function ve({
   className: r,
   href: a = "#",
   external: t,
-  children: n,
-  ...l
+  linkComponent: o,
+  children: l,
+  ...i
 }) {
-  return /* @__PURE__ */ e(m, { className: r, ...l, children: /* @__PURE__ */ s(
-    "a",
+  return /* @__PURE__ */ e(m, { className: r, ...i, children: /* @__PURE__ */ s(
+    t ? "a" : o ?? "a",
     {
       href: a,
       className: "inline-flex items-center gap-1 typo-body-md text-[var(--Text-Accent-Primary)] hover:underline",
       ...t ? { target: "_blank", rel: "noopener noreferrer" } : {},
       children: [
-        n,
+        l,
         t && /* @__PURE__ */ e(N, { size: 14 })
       ]
     }
@@ -442,19 +444,21 @@ function ge({
   className: r,
   value: a,
   onChange: t,
-  placeholder: n,
+  placeholder: o,
   type: l = "text",
-  name: o,
+  name: i,
   ...c
 }) {
   return /* @__PURE__ */ e(
     "td",
     {
       "data-slot": "data-table-input-cell",
-      className: i(
+      className: n(
         "px-4 py-4 align-middle whitespace-nowrap",
         "hover:shadow-[inset_0_0_0_2px_var(--Border-Accent-Primary)] hover:rounded",
         "has-[input:focus]:shadow-[inset_0_0_0_2px_var(--Border-Accent-Primary)] has-[input:focus]:rounded",
+        // forced-colors では影が描かれず、input は outline-none なので、セル全体に内側の輪郭線を出す
+        "forced-colors:has-[input:focus]:outline-solid forced-colors:has-[input:focus]:outline-2 forced-colors:has-[input:focus]:-outline-offset-2 forced-colors:has-[input:focus]:outline-[Highlight]",
         r
       ),
       ...c,
@@ -462,10 +466,10 @@ function ge({
         "input",
         {
           type: l,
-          name: o,
+          name: i,
           value: a,
           onChange: (d) => t?.(d.target.value),
-          placeholder: n,
+          placeholder: o,
           className: "w-full bg-transparent outline-none typo-body-md text-[var(--Text-High-Emphasis)] placeholder:text-[var(--Text-Low-Emphasis)]"
         }
       )
@@ -476,27 +480,27 @@ function we({
   className: r,
   value: a,
   onValueChange: t,
-  options: n,
+  options: o,
   placeholder: l = "選択してください",
-  "aria-label": o,
+  "aria-label": i,
   ...c
 }) {
   return /* @__PURE__ */ e(
     m,
     {
-      className: i("hover:bg-[var(--Surface-Tertiary)] cursor-pointer p-0", r),
+      className: n("hover:bg-[var(--Surface-Tertiary)] cursor-pointer p-0", r),
       ...c,
       children: /* @__PURE__ */ s(A, { value: a, onValueChange: t, children: [
         /* @__PURE__ */ e(
           L,
           {
             size: "sm",
-            "aria-label": o ?? l,
+            "aria-label": i ?? l,
             className: "w-full min-w-[160px] border-0 bg-transparent rounded-none px-4 py-4 h-auto hover:bg-transparent focus-visible:ring-0 focus-visible:border-0",
             children: /* @__PURE__ */ e(_, { placeholder: l })
           }
         ),
-        /* @__PURE__ */ e(B, { children: n.map((d) => /* @__PURE__ */ e(H, { value: d.value, children: d.label }, d.value)) })
+        /* @__PURE__ */ e(B, { children: o.map((d) => /* @__PURE__ */ e(H, { value: d.value, children: d.label }, d.value)) })
       ] })
     }
   );
@@ -517,15 +521,15 @@ export {
   pe as DataTableBulkActions,
   m as DataTableCell,
   de as DataTableCheckboxCell,
-  fe as DataTableDragHandleCell,
+  xe as DataTableDragHandleCell,
   be as DataTableEmptyState,
   se as DataTableHead,
-  ne as DataTableHeader,
-  xe as DataTableImageCell,
+  oe as DataTableHeader,
+  fe as DataTableImageCell,
   ge as DataTableInputCell,
   ve as DataTableLinkCell,
   ye as DataTableNumberCell,
-  oe as DataTableRow,
+  ne as DataTableRow,
   he as DataTableSectionRow,
   we as DataTableSelectCell,
   le as DataTableTable

package/dist/components/foundations/dialog.js

@@ -1,30 +1,30 @@
 import { jsx as t, jsxs as l } from "react/jsx-runtime";
 import "react";
-import { XIcon as d } from "lucide-react";
+import { XIcon as c } from "lucide-react";
 import { Dialog as o } from "radix-ui";
 import { cn as i } from "../../lib/utils.js";
-import { Button as c } from "./button.js";
-function D({
+import { Button as g } from "./button.js";
+function w({
   ...a
 }) {
   return /* @__PURE__ */ t(o.Root, { "data-slot": "dialog", ...a });
 }
-function y({
+function C({
   ...a
 }) {
   return /* @__PURE__ */ t(o.Trigger, { "data-slot": "dialog-trigger", ...a });
 }
-function g({
+function u({
   ...a
 }) {
   return /* @__PURE__ */ t(o.Portal, { "data-slot": "dialog-portal", ...a });
 }
-function b({
+function N({
   ...a
 }) {
   return /* @__PURE__ */ t(o.Close, { "data-slot": "dialog-close", ...a });
 }
-function u({
+function m({
   className: a,
   ...e
 }) {
@@ -40,33 +40,42 @@ function u({
     }
   );
 }
-function N({
+const f = {
+  sm: "sm:max-w-[400px]",
+  md: "sm:max-w-[512px]",
+  lg: "sm:max-w-[640px]",
+  xl: "sm:max-w-[800px]"
+}, p = "sm:max-w-lg";
+function T({
   className: a,
   children: e,
-  showCloseButton: s = !0,
-  ...r
+  showCloseButton: r = !0,
+  size: s,
+  ...n
 }) {
-  return /* @__PURE__ */ l(g, { "data-slot": "dialog-portal", children: [
-    /* @__PURE__ */ t(u, {}),
+  return /* @__PURE__ */ l(u, { "data-slot": "dialog-portal", children: [
+    /* @__PURE__ */ t(m, {}),
     /* @__PURE__ */ l(
       o.Content,
       {
         "data-slot": "dialog-content",
-        onOpenAutoFocus: (n) => n.preventDefault(),
+        onOpenAutoFocus: (d) => d.preventDefault(),
         className: i(
-          "fixed top-[50%] left-[50%] z-[var(--Z-Modal)] grid w-[calc(100%_-_32px)] max-w-[calc(100%_-_32px)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-2xl bg-[var(--Surface-Elevated)] p-6 shadow-lg duration-[var(--Motion-Duration-Base)] outline-none focus-visible:ring-2 focus-visible:ring-[var(--Focus-High-Emphasis)] data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 sm:max-w-lg",
+          "fixed top-[50%] left-[50%] z-[var(--Z-Modal)] grid w-[calc(100%_-_32px)] max-w-[calc(100%_-_32px)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-2xl bg-[var(--Surface-Elevated)] p-6 shadow-lg duration-[var(--Motion-Duration-Base)] outline-none focus-visible:ring-2 focus-visible:ring-[var(--Focus-High-Emphasis)] data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
+          // 型に無い size（AlertDialog の "default" と取り違えた JSX など）でも幅の上限を消さず、未指定と同じにする
+          s && f[s] || p,
           a
         ),
-        ...r,
+        ...n,
         children: [
           e,
-          s && /* @__PURE__ */ l(
+          r && /* @__PURE__ */ l(
             o.Close,
             {
               "data-slot": "dialog-close",
               className: "absolute top-2 right-2 flex size-10 items-center justify-center rounded-full text-[var(--Text-Low-Emphasis)] transition-colors hover:bg-[var(--Surface-Tertiary)] hover:text-[var(--Text-High-Emphasis)] focus-visible:ring-2 focus-visible:ring-[var(--Focus-High-Emphasis)] focus-visible:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0",
               children: [
-                /* @__PURE__ */ t(d, { className: "size-5" }),
+                /* @__PURE__ */ t(c, { className: "size-5" }),
                 /* @__PURE__ */ t("span", { className: "sr-only", children: "閉じる" })
               ]
             }
@@ -76,7 +85,7 @@ function N({
     )
   ] });
 }
-function T({ className: a, ...e }) {
+function E({ className: a, ...e }) {
   return /* @__PURE__ */ t(
     "div",
     {
@@ -86,11 +95,11 @@ function T({ className: a, ...e }) {
     }
   );
 }
-function C({
+function z({
   className: a,
   showCloseButton: e = !1,
-  children: s,
-  ...r
+  children: r,
+  ...s
 }) {
   return /* @__PURE__ */ l(
     "div",
@@ -100,15 +109,15 @@ function C({
         "flex flex-col gap-2 sm:flex-row sm:justify-end",
         a
       ),
-      ...r,
+      ...s,
       children: [
-        s,
-        e && /* @__PURE__ */ t(o.Close, { asChild: !0, children: /* @__PURE__ */ t(c, { variant: "tertiary", children: "Close" }) })
+        r,
+        e && /* @__PURE__ */ t(o.Close, { asChild: !0, children: /* @__PURE__ */ t(g, { variant: "tertiary", children: "Close" }) })
       ]
     }
   );
 }
-function E({
+function _({
   className: a,
   ...e
 }) {
@@ -121,7 +130,7 @@ function E({
     }
   );
 }
-function w({
+function H({
   className: a,
   ...e
 }) {
@@ -135,14 +144,14 @@ function w({
   );
 }
 export {
-  D as Dialog,
-  b as DialogClose,
-  N as DialogContent,
-  w as DialogDescription,
-  C as DialogFooter,
-  T as DialogHeader,
-  u as DialogOverlay,
-  g as DialogPortal,
-  E as DialogTitle,
-  y as DialogTrigger
+  w as Dialog,
+  N as DialogClose,
+  T as DialogContent,
+  H as DialogDescription,
+  z as DialogFooter,
+  E as DialogHeader,
+  m as DialogOverlay,
+  u as DialogPortal,
+  _ as DialogTitle,
+  C as DialogTrigger
 };