laif-ds/dist/components/ui/dropdown-menu.js

Design System di Laif con componenti React basati su principi di Atomic Design

"use client";
import { jsxs as i, jsx as a } from "react/jsx-runtime";
import { Root as v, Group as h, Portal as c, RadioGroup as N, Sub as y, Trigger as R, CheckboxItem as l, ItemIndicator as m, Content as p, Item as u, Label as f, RadioItem as b, Separator as g, SubContent as w, SubTrigger as x } from "../../node_modules/@radix-ui/react-dropdown-menu/dist/index.js";
import * as n from "react";
import { cn as r } from "../../lib/utils.js";
import D from "../../node_modules/lucide-react/dist/esm/icons/check.js";
import M from "../../node_modules/lucide-react/dist/esm/icons/circle.js";
import S from "../../node_modules/lucide-react/dist/esm/icons/chevron-right.js";
const H = v, J = R, K = h, O = c, Q = y, U = N, I = n.forwardRef(({ className: e, inset: t, children: o, ...d }, s) => /* @__PURE__ */ i(
  x,
  {
    ref: s,
    className: r(
      "focus:bg-d-accent data-[state=open]:bg-d-accent flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none select-none [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
      t && "pl-8",
      e
    ),
    ...d,
    children: [
      o,
      /* @__PURE__ */ a(S, { className: "ml-auto" })
    ]
  }
));
I.displayName = x.displayName;
const C = n.forwardRef(({ className: e, ...t }, o) => /* @__PURE__ */ a(
  w,
  {
    ref: o,
    className: r(
      "bg-d-popover text-d-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 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 border-d-border z-50 min-w-[8rem] origin-[--radix-dropdown-menu-content-transform-origin] overflow-hidden rounded-md border p-1 shadow-lg",
      e
    ),
    ...t
  }
));
C.displayName = w.displayName;
const z = n.forwardRef(({ className: e, sideOffset: t = 4, ...o }, d) => /* @__PURE__ */ a(c, { children: /* @__PURE__ */ a(
  p,
  {
    ref: d,
    sideOffset: t,
    className: r(
      "bg-d-popover text-d-popover-foreground border-d-border z-50 max-h-[var(--radix-dropdown-menu-content-available-height)] min-w-[8rem] overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md",
      "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 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 origin-[--radix-dropdown-menu-content-transform-origin]",
      e
    ),
    ...o
  }
) }));
z.displayName = p.displayName;
const k = n.forwardRef(({ className: e, inset: t, variant: o = "default", ...d }, s) => /* @__PURE__ */ a(
  u,
  {
    ref: s,
    "data-variant": o,
    className: r(
      "focus:bg-d-accent focus:text-d-accent-foreground data-[variant=destructive]:text-d-destructive data-[variant=destructive]:focus:bg-d-destructive/10 data-[variant=destructive]:focus:text-d-destructive data-[variant=destructive]:*:[svg]:!text-d-destructive relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&>svg]:size-4 [&>svg]:shrink-0",
      t && "pl-8",
      e
    ),
    ...d
  }
));
k.displayName = u.displayName;
const G = n.forwardRef(({ className: e, children: t, checked: o, ...d }, s) => /* @__PURE__ */ i(
  l,
  {
    ref: s,
    className: r(
      "focus:bg-d-accent focus:text-d-accent-foreground relative flex cursor-default items-center rounded-sm py-1.5 pr-2 pl-8 text-sm transition-colors outline-none select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
      e
    ),
    checked: o,
    ...d,
    children: [
      /* @__PURE__ */ a("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ a(m, { children: /* @__PURE__ */ a(D, { className: "h-4 w-4" }) }) }),
      t
    ]
  }
));
G.displayName = l.displayName;
const T = n.forwardRef(({ className: e, children: t, ...o }, d) => /* @__PURE__ */ i(
  b,
  {
    ref: d,
    className: r(
      "focus:bg-d-accent focus:text-d-accent-foreground relative flex cursor-default items-center rounded-sm py-1.5 pr-2 pl-8 text-sm transition-colors outline-none select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
      e
    ),
    ...o,
    children: [
      /* @__PURE__ */ a("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ a(m, { children: /* @__PURE__ */ a(M, { className: "h-2 w-2 fill-current" }) }) }),
      t
    ]
  }
));
T.displayName = b.displayName;
const j = n.forwardRef(({ className: e, inset: t, ...o }, d) => /* @__PURE__ */ a(
  f,
  {
    ref: d,
    className: r(
      "px-2 py-1.5 text-sm font-semibold",
      t && "pl-8",
      e
    ),
    ...o
  }
));
j.displayName = f.displayName;
const L = n.forwardRef(({ className: e, ...t }, o) => /* @__PURE__ */ a(
  g,
  {
    ref: o,
    className: r("bg-d-border -mx-1 my-1 h-px", e),
    ...t
  }
));
L.displayName = g.displayName;
const P = ({
  className: e,
  ...t
}) => /* @__PURE__ */ a(
  "span",
  {
    className: r("ml-auto text-xs tracking-widest opacity-60", e),
    ...t
  }
);
P.displayName = "DropdownMenuShortcut";
export {
  H as DropdownMenu,
  G as DropdownMenuCheckboxItem,
  z as DropdownMenuContent,
  K as DropdownMenuGroup,
  k as DropdownMenuItem,
  j as DropdownMenuLabel,
  O as DropdownMenuPortal,
  U as DropdownMenuRadioGroup,
  T as DropdownMenuRadioItem,
  L as DropdownMenuSeparator,
  P as DropdownMenuShortcut,
  Q as DropdownMenuSub,
  C as DropdownMenuSubContent,
  I as DropdownMenuSubTrigger,
  J as DropdownMenuTrigger
};