@popgrids/ui 0.0.23 → 0.0.24

package/dist/checkbox.cjs

@@ -0,0 +1,37 @@
+'use strict';
+
+var checkbox = require('@base-ui/react/checkbox');
+var icons = require('@untitledui/icons');
+var clsx = require('clsx');
+var tailwindMerge = require('tailwind-merge');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/components/checkbox/checkbox.tsx
+function cn(...inputs) {
+  return tailwindMerge.twMerge(clsx.clsx(inputs));
+}
+function Checkbox({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    checkbox.Checkbox.Root,
+    {
+      "data-slot": "checkbox",
+      className: cn(
+        "border-foreground dark:bg-input/30 dark:data-checked:bg-primary aria-invalid:aria-checked:border-primary aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 peer relative flex size-4 shrink-0 items-center justify-center rounded-[4px] border shadow-xs transition-shadow outline-none group-has-disabled/field:opacity-50 after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:ring-3 data-disabled:cursor-not-allowed data-disabled:opacity-50 aria-invalid:ring-3 data-checked:border-foreground data-checked:bg-foreground data-checked:text-background",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        checkbox.Checkbox.Indicator,
+        {
+          "data-slot": "checkbox-indicator",
+          className: "grid place-content-center text-current transition-none [&>svg]:size-3.5",
+          children: /* @__PURE__ */ jsxRuntime.jsx(icons.Check, {})
+        }
+      )
+    }
+  );
+}
+
+exports.Checkbox = Checkbox;
+//# sourceMappingURL=checkbox.cjs.map
+//# sourceMappingURL=checkbox.cjs.map

package/dist/checkbox.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/utils.ts","../src/components/checkbox/checkbox.tsx"],"names":["twMerge","clsx","jsx","CheckboxPrimitive","Check"],"mappings":";;;;;;;;;AAGO,SAAS,MAAM,MAAA,EAAsB;AAC1C,EAAA,OAAOA,qBAAA,CAAQC,SAAA,CAAK,MAAM,CAAC,CAAA;AAC7B;ACGA,SAAS,QAAA,CAAS,EAAE,SAAA,EAAW,GAAG,OAAM,EAAkB;AACxD,EAAA,uBACEC,cAAA;AAAA,IAACC,iBAAA,CAAkB,IAAA;AAAA,IAAlB;AAAA,MACC,WAAA,EAAU,UAAA;AAAA,MACV,SAAA,EAAW,EAAA;AAAA,QACT,0rBAAA;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG,KAAA;AAAA,MAEJ,QAAA,kBAAAD,cAAA;AAAA,QAACC,iBAAA,CAAkB,SAAA;AAAA,QAAlB;AAAA,UACC,WAAA,EAAU,oBAAA;AAAA,UACV,SAAA,EAAU,yEAAA;AAAA,UAEV,yCAACC,WAAA,EAAA,EAAM;AAAA;AAAA;AACT;AAAA,GACF;AAEJ","file":"checkbox.cjs","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n","\"use client\";\n\nimport { Checkbox as CheckboxPrimitive } from \"@base-ui/react/checkbox\";\nimport { Check } from \"@untitledui/icons\";\n\nimport { cn } from \"../../lib/utils\";\nimport { CheckboxProps } from \"./types\";\n\nfunction Checkbox({ className, ...props }: CheckboxProps) {\n  return (\n    <CheckboxPrimitive.Root\n      data-slot=\"checkbox\"\n      className={cn(\n        \"border-foreground dark:bg-input/30 dark:data-checked:bg-primary aria-invalid:aria-checked:border-primary aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 peer relative flex size-4 shrink-0 items-center justify-center rounded-[4px] border shadow-xs transition-shadow outline-none group-has-disabled/field:opacity-50 after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:ring-3 data-disabled:cursor-not-allowed data-disabled:opacity-50 aria-invalid:ring-3 data-checked:border-foreground data-checked:bg-foreground data-checked:text-background\",\n        className,\n      )}\n      {...props}\n    >\n      <CheckboxPrimitive.Indicator\n        data-slot=\"checkbox-indicator\"\n        className=\"grid place-content-center text-current transition-none [&>svg]:size-3.5\"\n      >\n        <Check />\n      </CheckboxPrimitive.Indicator>\n    </CheckboxPrimitive.Root>\n  );\n}\n\nexport { Checkbox };\n"]}

package/dist/checkbox.d.cts

@@ -0,0 +1,8 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { CheckboxRoot } from '@base-ui/react/checkbox';
+
+interface CheckboxProps extends CheckboxRoot.Props {}
+
+declare function Checkbox({ className, ...props }: CheckboxProps): react_jsx_runtime.JSX.Element;
+
+export { Checkbox, type CheckboxProps };

package/dist/checkbox.d.ts

@@ -0,0 +1,8 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { CheckboxRoot } from '@base-ui/react/checkbox';
+
+interface CheckboxProps extends CheckboxRoot.Props {}
+
+declare function Checkbox({ className, ...props }: CheckboxProps): react_jsx_runtime.JSX.Element;
+
+export { Checkbox, type CheckboxProps };

package/dist/checkbox.js

@@ -0,0 +1,35 @@
+import { Checkbox as Checkbox$1 } from '@base-ui/react/checkbox';
+import { Check } from '@untitledui/icons';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { jsx } from 'react/jsx-runtime';
+
+// src/components/checkbox/checkbox.tsx
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+function Checkbox({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    Checkbox$1.Root,
+    {
+      "data-slot": "checkbox",
+      className: cn(
+        "border-foreground dark:bg-input/30 dark:data-checked:bg-primary aria-invalid:aria-checked:border-primary aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 peer relative flex size-4 shrink-0 items-center justify-center rounded-[4px] border shadow-xs transition-shadow outline-none group-has-disabled/field:opacity-50 after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:ring-3 data-disabled:cursor-not-allowed data-disabled:opacity-50 aria-invalid:ring-3 data-checked:border-foreground data-checked:bg-foreground data-checked:text-background",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx(
+        Checkbox$1.Indicator,
+        {
+          "data-slot": "checkbox-indicator",
+          className: "grid place-content-center text-current transition-none [&>svg]:size-3.5",
+          children: /* @__PURE__ */ jsx(Check, {})
+        }
+      )
+    }
+  );
+}
+
+export { Checkbox };
+//# sourceMappingURL=checkbox.js.map
+//# sourceMappingURL=checkbox.js.map

package/dist/checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/utils.ts","../src/components/checkbox/checkbox.tsx"],"names":["CheckboxPrimitive"],"mappings":";;;;;;;AAGO,SAAS,MAAM,MAAA,EAAsB;AAC1C,EAAA,OAAO,OAAA,CAAQ,IAAA,CAAK,MAAM,CAAC,CAAA;AAC7B;ACGA,SAAS,QAAA,CAAS,EAAE,SAAA,EAAW,GAAG,OAAM,EAAkB;AACxD,EAAA,uBACE,GAAA;AAAA,IAACA,UAAA,CAAkB,IAAA;AAAA,IAAlB;AAAA,MACC,WAAA,EAAU,UAAA;AAAA,MACV,SAAA,EAAW,EAAA;AAAA,QACT,0rBAAA;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG,KAAA;AAAA,MAEJ,QAAA,kBAAA,GAAA;AAAA,QAACA,UAAA,CAAkB,SAAA;AAAA,QAAlB;AAAA,UACC,WAAA,EAAU,oBAAA;AAAA,UACV,SAAA,EAAU,yEAAA;AAAA,UAEV,8BAAC,KAAA,EAAA,EAAM;AAAA;AAAA;AACT;AAAA,GACF;AAEJ","file":"checkbox.js","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n","\"use client\";\n\nimport { Checkbox as CheckboxPrimitive } from \"@base-ui/react/checkbox\";\nimport { Check } from \"@untitledui/icons\";\n\nimport { cn } from \"../../lib/utils\";\nimport { CheckboxProps } from \"./types\";\n\nfunction Checkbox({ className, ...props }: CheckboxProps) {\n  return (\n    <CheckboxPrimitive.Root\n      data-slot=\"checkbox\"\n      className={cn(\n        \"border-foreground dark:bg-input/30 dark:data-checked:bg-primary aria-invalid:aria-checked:border-primary aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 peer relative flex size-4 shrink-0 items-center justify-center rounded-[4px] border shadow-xs transition-shadow outline-none group-has-disabled/field:opacity-50 after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:ring-3 data-disabled:cursor-not-allowed data-disabled:opacity-50 aria-invalid:ring-3 data-checked:border-foreground data-checked:bg-foreground data-checked:text-background\",\n        className,\n      )}\n      {...props}\n    >\n      <CheckboxPrimitive.Indicator\n        data-slot=\"checkbox-indicator\"\n        className=\"grid place-content-center text-current transition-none [&>svg]:size-3.5\"\n      >\n        <Check />\n      </CheckboxPrimitive.Indicator>\n    </CheckboxPrimitive.Root>\n  );\n}\n\nexport { Checkbox };\n"]}

package/dist/index.cjs

@@ -5,8 +5,9 @@ var clsx = require('clsx');
 var tailwindMerge = require('tailwind-merge');
 var jsxRuntime = require('react/jsx-runtime');
 var button = require('@base-ui/react/button');
-var dialog = require('@base-ui/react/dialog');
+var checkbox = require('@base-ui/react/checkbox');
 var icons = require('@untitledui/icons');
+var dialog = require('@base-ui/react/dialog');
 var menu = require('@base-ui/react/menu');
 var input = require('@base-ui/react/input');
 var mergeProps = require('@base-ui/react/merge-props');
@@ -527,6 +528,27 @@ function ContentBlock({ className, children, title, subhead, cta }) {
     children && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "prose prose-base max-w-(--width-xl) pb-3", children })
   ] });
 }
+function Checkbox({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    checkbox.Checkbox.Root,
+    {
+      "data-slot": "checkbox",
+      className: cn(
+        "border-foreground dark:bg-input/30 dark:data-checked:bg-primary aria-invalid:aria-checked:border-primary aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 peer relative flex size-4 shrink-0 items-center justify-center rounded-[4px] border shadow-xs transition-shadow outline-none group-has-disabled/field:opacity-50 after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:ring-3 data-disabled:cursor-not-allowed data-disabled:opacity-50 aria-invalid:ring-3 data-checked:border-foreground data-checked:bg-foreground data-checked:text-background",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        checkbox.Checkbox.Indicator,
+        {
+          "data-slot": "checkbox-indicator",
+          className: "grid place-content-center text-current transition-none [&>svg]:size-3.5",
+          children: /* @__PURE__ */ jsxRuntime.jsx(icons.Check, {})
+        }
+      )
+    }
+  );
+}
 function DialogRoot(props) {
   return /* @__PURE__ */ jsxRuntime.jsx(dialog.Dialog.Root, { "data-slot": "dialog", ...props });
 }
@@ -1459,6 +1481,7 @@ function Tag({
 exports.BannerNotification = BannerNotification;
 exports.Button = Button;
 exports.ButtonLink = ButtonLink;
+exports.Checkbox = Checkbox;
 exports.ContentBlock = ContentBlock;
 exports.Dialog = DialogRoot;
 exports.DialogBody = DialogBody;