laif-ds/dist/components/ui/checkbox.js

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

"use client";
import { jsx as e } from "react/jsx-runtime";
import { Checkbox as a, CheckboxIndicator as n } from "../../node_modules/@radix-ui/react-checkbox/dist/index.js";
import { designTokens as o } from "../design-tokens.js";
import { cn as s } from "../../lib/utils.js";
import c from "../../node_modules/lucide-react/dist/esm/icons/minus.js";
import m from "../../node_modules/lucide-react/dist/esm/icons/check.js";
function x({
  className: i,
  checked: t,
  ...d
}) {
  const r = t === "indeterminate";
  return /* @__PURE__ */ e(
    a,
    {
      "data-slot": "checkbox",
      className: s(
        "peer bg-d-input border-d-foreground size-4 shrink-0 cursor-pointer border shadow-xs transition-shadow outline-none",
        o.radius.sm,
        // Checkboxes usually have smaller radius
        o.focusRing,
        "aria-invalid:border-d-destructive aria-invalid:ring-d-destructive/20",
        "data-[state=checked]:bg-d-primary data-[state=checked]:border-d-primary data-[state=checked]:text-d-primary-foreground",
        o.interaction.disabled,
        r && "bg-d-primary border-d-primary text-d-primary-foreground disabled:border-d-muted-foreground",
        i
      ),
      checked: r ? !1 : t,
      ...d,
      children: /* @__PURE__ */ e(
        n,
        {
          "data-slot": "checkbox-indicator",
          className: "text-d-primary-foreground flex items-center justify-center transition-none",
          forceMount: r || void 0,
          children: r ? /* @__PURE__ */ e(c, { className: "text-d-primary-foreground size-3.5" }) : /* @__PURE__ */ e(m, { className: "text-d-primary-foreground size-3.5" })
        }
      )
    }
  );
}
export {
  x as Checkbox
};