@sikka/hawa/dist/checkbox/index.mjs

Modern UI Kit made with Tailwind

"use client";

// elements/checkbox/Checkbox.tsx
import * as React from "react";
import * as CheckboxPrimitive from "@radix-ui/react-checkbox";

// util/index.ts
import { clsx } from "clsx";
import { twMerge } from "tailwind-merge";
function cn(...inputs) {
  return twMerge(clsx(inputs));
}

// elements/checkbox/Checkbox.tsx
var Checkbox = ({
  id,
  label,
  sublabel,
  helperText,
  disabled,
  size = "default",
  radius = "inherit",
  ...props
}) => {
  let labelLineHeightStyles = {
    xs: sublabel || helperText ? 0.5 : 0.1,
    sm: 0.6,
    default: 1,
    md: 0.8,
    lg: 0.9,
    xl: 1
  };
  return /* @__PURE__ */ React.createElement(
    "div",
    {
      className: cn(
        "hawa-flex hawa-gap-2",
        size === "default" ? "hawa-items-top" : "hawa-items-center"
      )
    },
    /* @__PURE__ */ React.createElement(
      CheckboxElement,
      {
        ...props,
        size,
        radius,
        disabled,
        id
      }
    ),
    (label || helperText) && /* @__PURE__ */ React.createElement("div", { className: "hawa-grid hawa-gap-1.5" }, label && /* @__PURE__ */ React.createElement(
      "label",
      {
        htmlFor: id,
        className: cn(
          "hawa-w-fit hawa-select-none hawa-pt-0.5 hawa-text-sm hawa-font-medium",
          disabled ? "hawa-cursor-not-allowed hawa-text-muted-foreground hawa-opacity-70" : "hawa-cursor-pointer"
        ),
        style: {
          // lineHeight: labelLineHeightStyles[size]
          lineHeight: 1
        }
      },
      label
    ), sublabel && /* @__PURE__ */ React.createElement(
      "label",
      {
        htmlFor: id,
        className: cn(
          "hawa-w-fit hawa-select-none hawa-text-sm hawa-text-muted-foreground",
          disabled ? "hawa-cursor-not-allowed hawa-text-muted-foreground hawa-opacity-70" : "hawa-cursor-pointer"
        )
      },
      sublabel
    ), helperText && !disabled && /* @__PURE__ */ React.createElement(
      "label",
      {
        htmlFor: id,
        className: cn(
          "hawa-w-fit hawa-select-none hawa-text-xs hawa-text-helper-color",
          disabled && "hawa-cursor-not-allowed hawa-opacity-70"
        )
      },
      helperText
    ))
  );
};
var CheckboxElement = React.forwardRef(({ radius = "inherit", size = "default", className, ...props }, ref) => {
  let checkboxRadius = {
    none: "hawa-rounded-none",
    inherit: "hawa-rounded-sm",
    full: "hawa-rounded-full"
  };
  let checkboxSizes = {
    xs: "hawa-w-3 hawa-h-3",
    sm: "hawa-w-6 hawa-h-6",
    default: "hawa-icon",
    md: "hawa-w-8 hawa-h-8",
    lg: "hawa-w-10 hawa-h-10",
    xl: "hawa-w-12 hawa-h-12"
  };
  let checkboxIndicatorSizes = {
    xs: "0.5em",
    default: "0.60em",
    sm: "0.75em",
    md: "0.875em",
    lg: "1em",
    xl: "1.25em"
  };
  return /* @__PURE__ */ React.createElement(
    CheckboxPrimitive.Root,
    {
      ref,
      className: cn(
        "hawa-peer hawa-shrink-0 hawa-border hawa-border-primary hawa-ring-offset-background focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2 disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50 data-[state=checked]:hawa-bg-primary data-[state=checked]:hawa-text-primary-foreground",
        checkboxSizes[size],
        checkboxRadius[radius],
        className
      ),
      ...props
    },
    /* @__PURE__ */ React.createElement(
      CheckboxPrimitive.Indicator,
      {
        className: cn(
          "hawa-flex hawa-items-center hawa-justify-center hawa-text-current"
        )
      },
      /* @__PURE__ */ React.createElement(
        "svg",
        {
          "aria-label": "Check Mark",
          stroke: "currentColor",
          fill: "currentColor",
          strokeWidth: "0",
          viewBox: "0 0 512 512",
          height: checkboxIndicatorSizes[size],
          width: checkboxIndicatorSizes[size]
        },
        /* @__PURE__ */ React.createElement("path", { d: "M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z" })
      ),
      " "
    )
  );
});
CheckboxElement.displayName = CheckboxPrimitive.Root.displayName;
export {
  Checkbox
};
//# sourceMappingURL=index.mjs.map