@cakejp/design-system 0.20.1 → 0.21.0

package/dist/components/foundations/context-menu.js

@@ -1,35 +1,36 @@
 "use client";
 import { jsx as e, jsxs as d } from "react/jsx-runtime";
 import "react";
-import { CheckIcon as i, CircleIcon as u, ChevronRightIcon as c } from "lucide-react";
+import { CheckIcon as u, CircleIcon as c, ChevronRightIcon as l } from "lucide-react";
 import { ContextMenu as o } from "radix-ui";
 import { cn as r } from "../../lib/utils.js";
-function g({
+import { FORCED_COLORS_MENU_ITEM as i } from "../../lib/focus-ring.js";
+function b({
   ...t
 }) {
   return /* @__PURE__ */ e(o.Root, { "data-slot": "context-menu", ...t });
 }
-function v({
+function h({
   ...t
 }) {
   return /* @__PURE__ */ e(o.Trigger, { "data-slot": "context-menu-trigger", ...t });
 }
-function b({
+function C({
   ...t
 }) {
   return /* @__PURE__ */ e(o.Group, { "data-slot": "context-menu-group", ...t });
 }
-function h({
+function y({
   ...t
 }) {
   return /* @__PURE__ */ e(o.Portal, { "data-slot": "context-menu-portal", ...t });
 }
-function C({
+function M({
   ...t
 }) {
   return /* @__PURE__ */ e(o.Sub, { "data-slot": "context-menu-sub", ...t });
 }
-function y({
+function z({
   ...t
 }) {
   return /* @__PURE__ */ e(
@@ -40,7 +41,7 @@ function y({
     }
   );
 }
-function M({
+function _({
   className: t,
   inset: n,
   children: a,
@@ -52,18 +53,19 @@ function M({
       "data-slot": "context-menu-sub-trigger",
       "data-inset": n,
       className: r(
-        "flex cursor-default items-center rounded-sm px-2 py-1.5 typo-body-md outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[inset]:pl-8 data-[state=open]:bg-accent data-[state=open]:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground",
+        "flex cursor-default items-center rounded-sm px-2 py-1.5 typo-body-md outline-none select-none focus:bg-accent focus:text-accent-foreground data-[inset]:pl-8 data-[state=open]:bg-accent data-[state=open]:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground",
+        i,
         t
       ),
       ...s,
       children: [
         a,
-        /* @__PURE__ */ e(c, { className: "ml-auto" })
+        /* @__PURE__ */ e(l, { className: "ml-auto" })
       ]
     }
   );
 }
-function z({
+function N({
   className: t,
   ...n
 }) {
@@ -72,14 +74,14 @@ function z({
     {
       "data-slot": "context-menu-sub-content",
       className: r(
-        "z-[var(--Z-Popover)] min-w-[8rem] origin-(--radix-context-menu-content-transform-origin) overflow-hidden rounded-md border border-[var(--Border-Medium-Emphasis)] bg-popover p-1 text-popover-foreground shadow-lg data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 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",
+        "z-[var(--Z-Popover)] min-w-[8rem] max-w-(--radix-context-menu-content-available-width) origin-(--radix-context-menu-content-transform-origin) overflow-hidden rounded-md border border-[var(--Border-Medium-Emphasis)] bg-popover p-1 text-popover-foreground shadow-lg data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 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",
         t
       ),
       ...n
     }
   );
 }
-function N({
+function I({
   className: t,
   ...n
 }) {
@@ -89,14 +91,14 @@ function N({
       "data-slot": "context-menu-content",
       collisionPadding: 8,
       className: r(
-        "fixed z-[var(--Z-Popover)] max-h-(--radix-context-menu-content-available-height) min-w-[8rem] origin-(--radix-context-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border border-[var(--Border-Medium-Emphasis)] bg-popover p-1 text-popover-foreground shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 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",
+        "z-[var(--Z-Popover)] max-h-(--radix-context-menu-content-available-height) min-w-[8rem] max-w-(--radix-context-menu-content-available-width) origin-(--radix-context-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border border-[var(--Border-Medium-Emphasis)] bg-popover p-1 text-popover-foreground shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 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",
         t
       ),
       ...n
     }
   ) });
 }
-function _({
+function w({
   className: t,
   inset: n,
   variant: a = "default",
@@ -109,14 +111,15 @@ function _({
       "data-inset": n,
       "data-variant": a,
       className: r(
-        "relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 typo-body-md outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/20 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground data-[variant=destructive]:*:[svg]:text-destructive!",
+        "relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 typo-body-md outline-none select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/20 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground data-[variant=destructive]:*:[svg]:text-destructive!",
+        i,
         t
       ),
       ...s
     }
   );
 }
-function I({
+function S({
   className: t,
   children: n,
   checked: a,
@@ -127,13 +130,14 @@ function I({
     {
       "data-slot": "context-menu-checkbox-item",
       className: r(
-        "relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 typo-body-md outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 typo-body-md outline-none select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        i,
         t
       ),
       checked: a,
       ...s,
       children: [
-        /* @__PURE__ */ e("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ e(o.ItemIndicator, { children: /* @__PURE__ */ e(i, { className: "size-4" }) }) }),
+        /* @__PURE__ */ e("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ e(o.ItemIndicator, { children: /* @__PURE__ */ e(u, { className: "size-4" }) }) }),
         n
       ]
     }
@@ -149,18 +153,19 @@ function k({
     {
       "data-slot": "context-menu-radio-item",
       className: r(
-        "relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 typo-body-md outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 typo-body-md outline-none select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        i,
         t
       ),
       ...a,
       children: [
-        /* @__PURE__ */ e("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ e(o.ItemIndicator, { children: /* @__PURE__ */ e(u, { className: "size-2 fill-current" }) }) }),
+        /* @__PURE__ */ e("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ e(o.ItemIndicator, { children: /* @__PURE__ */ e(c, { className: "size-2 fill-current" }) }) }),
         n
       ]
     }
   );
 }
-function S({
+function R({
   className: t,
   inset: n,
   ...a
@@ -178,7 +183,7 @@ function S({
     }
   );
 }
-function w({
+function P({
   className: t,
   ...n
 }) {
@@ -191,7 +196,7 @@ function w({
     }
   );
 }
-function P({
+function E({
   className: t,
   ...n
 }) {
@@ -208,19 +213,19 @@ function P({
   );
 }
 export {
-  g as ContextMenu,
-  I as ContextMenuCheckboxItem,
-  N as ContextMenuContent,
-  b as ContextMenuGroup,
-  _ as ContextMenuItem,
-  S as ContextMenuLabel,
-  h as ContextMenuPortal,
-  y as ContextMenuRadioGroup,
+  b as ContextMenu,
+  S as ContextMenuCheckboxItem,
+  I as ContextMenuContent,
+  C as ContextMenuGroup,
+  w as ContextMenuItem,
+  R as ContextMenuLabel,
+  y as ContextMenuPortal,
+  z as ContextMenuRadioGroup,
   k as ContextMenuRadioItem,
-  w as ContextMenuSeparator,
-  P as ContextMenuShortcut,
-  C as ContextMenuSub,
-  z as ContextMenuSubContent,
-  M as ContextMenuSubTrigger,
-  v as ContextMenuTrigger
+  P as ContextMenuSeparator,
+  E as ContextMenuShortcut,
+  M as ContextMenuSub,
+  N as ContextMenuSubContent,
+  _ as ContextMenuSubTrigger,
+  h as ContextMenuTrigger
 };