@worldcoin/mini-apps-ui-kit-react 1.0.0-canary.15 → 1.0.0-canary.17

package/dist/_virtual/_commonjsHelpers.js

@@ -1,6 +1,6 @@
-function e(t) {
-  return t && t.__esModule && Object.prototype.hasOwnProperty.call(t, "default") ? t.default : t;
+function getDefaultExportFromCjs(x) {
+  return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x["default"] : x;
 }
 export {
-  e as getDefaultExportFromCjs
+  getDefaultExportFromCjs
 };

package/dist/_virtual/create-plugin.js

@@ -1,4 +1,4 @@
-var e = {};
+var createPlugin = {};
 export {
-  e as __exports
+  createPlugin as __exports
 };

package/dist/_virtual/createPlugin.js

@@ -1,4 +1,4 @@
-var e = {};
+var createPlugin = {};
 export {
-  e as __exports
+  createPlugin as __exports
 };

package/dist/_virtual/plugin.js

@@ -1,7 +1,7 @@
-import { getDefaultExportFromCjs as r } from "./_commonjsHelpers.js";
-import { __require as o } from "../node_modules/.pnpm/tailwindcss@3.4.17/node_modules/tailwindcss/plugin.js";
-var t = o();
-const p = /* @__PURE__ */ r(t);
+import { getDefaultExportFromCjs } from "./_commonjsHelpers.js";
+import { __require as requirePlugin } from "../node_modules/.pnpm/tailwindcss@3.4.17/node_modules/tailwindcss/plugin.js";
+var pluginExports = requirePlugin();
+const plugin = /* @__PURE__ */ getDefaultExportFromCjs(pluginExports);
 export {
-  p as default
+  plugin as default
 };

package/dist/components/AlertDialog/AlertDialog.js

@@ -1,84 +1,90 @@
 "use client";
-import { jsx as e, jsxs as n } from "react/jsx-runtime";
-import { cn as i } from "../../lib/utils.js";
-import * as s from "react";
-import { Drawer as o } from "../../node_modules/.pnpm/vaul@1.1.2_@types_react-dom@18.3.5_@types_react@18.3.18__@types_react@18.3.18_react-dom@18.3._7iqkcrcg5qjc3n2ixm6rnrnx3e/node_modules/vaul/dist/index.js";
-import { BottomBar as f } from "../BottomBar/BottomBar.js";
-import { Button as p } from "../Button/Button.js";
-import { XMark as D } from "../Icons/XMark.js";
-import { Typography as d } from "../Typography/Typography.js";
-import { AlertDialogContext as h, useAlertDialog as A } from "./use-alert-dialog.js";
-const u = ({ dismissible: l = !0, modal: r = !0, ...a }) => /* @__PURE__ */ e(h.Provider, { value: { dismissible: l }, children: /* @__PURE__ */ e(
-  o.Root,
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "../../lib/utils.js";
+import * as React from "react";
+import { Drawer } from "../../node_modules/.pnpm/vaul@1.1.2_@types_react-dom@18.3.5_@types_react@18.3.18__@types_react@18.3.18_react-dom@18.3._7iqkcrcg5qjc3n2ixm6rnrnx3e/node_modules/vaul/dist/index.js";
+import { XMark } from "../Icons/XMark.js";
+import { AlertDialogContext, useAlertDialog } from "./use-alert-dialog.js";
+import { BottomBar } from "../BottomBar/BottomBar.js";
+import { Typography } from "../Typography/Typography.js";
+import { Button } from "../Button/Button.js";
+const AlertDialog = ({ dismissible = true, modal = true, ...props }) => /* @__PURE__ */ jsx(AlertDialogContext.Provider, { value: { dismissible }, children: /* @__PURE__ */ jsx(
+  Drawer.Root,
   {
-    shouldScaleBackground: !1,
-    dismissible: l,
-    modal: r,
-    ...a
+    shouldScaleBackground: false,
+    dismissible,
+    modal,
+    ...props
   }
 ) });
-u.displayName = "AlertDialog";
-const N = s.forwardRef((l, r) => /* @__PURE__ */ e(o.Trigger, { ref: r, ...l }));
-N.displayName = "AlertDialogTrigger";
-const x = o.Portal, g = s.forwardRef((l, r) => /* @__PURE__ */ e(o.Close, { ref: r, ...l }));
-g.displayName = "AlertDialogClose";
-const y = s.forwardRef(({ className: l, children: r, ...a }, t) => /* @__PURE__ */ n(x, { children: [
-  /* @__PURE__ */ e(
-    o.Overlay,
+AlertDialog.displayName = "AlertDialog";
+const AlertDialogTrigger = React.forwardRef((props, ref) => /* @__PURE__ */ jsx(Drawer.Trigger, { ref, ...props }));
+AlertDialogTrigger.displayName = "AlertDialogTrigger";
+const AlertDialogPortal = Drawer.Portal;
+const AlertDialogClose = React.forwardRef((props, ref) => /* @__PURE__ */ jsx(Drawer.Close, { ref, ...props }));
+AlertDialogClose.displayName = "AlertDialogClose";
+const AlertDialogContent = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(AlertDialogPortal, { children: [
+  /* @__PURE__ */ jsx(
+    Drawer.Overlay,
     {
-      ref: t,
-      className: i("fixed inset-0 z-50 bg-gray-900/40", l),
-      ...a
+      ref,
+      className: cn("fixed inset-0 z-50 bg-gray-900/40", className),
+      ...props
     }
   ),
-  /* @__PURE__ */ e(
-    o.Content,
+  /* @__PURE__ */ jsx(
+    Drawer.Content,
     {
-      ref: t,
-      className: i("fixed inset-x-0 bottom-0 z-50 mt-24 h-auto", l),
-      ...a,
-      children: /* @__PURE__ */ e("div", { className: "flex flex-col rounded-[1.75rem] bg-gray-0 m-3 p-8", children: r })
+      ref,
+      className: cn("fixed inset-x-0 bottom-0 z-50 mt-24 h-auto", className),
+      ...props,
+      children: /* @__PURE__ */ jsx("div", { className: "flex flex-col rounded-[1.75rem] bg-gray-0 m-3 p-8", children })
     }
   )
 ] }));
-y.displayName = "AlertDialogContent";
-const v = ({ icon: l, children: r, ...a }) => {
-  const { dismissible: t } = A(), c = t && /* @__PURE__ */ e("div", { className: "shrink-0", children: /* @__PURE__ */ e(g, { asChild: !0, children: /* @__PURE__ */ e(p, { variant: "tertiary", size: "icon", children: /* @__PURE__ */ e(D, {}) }) }) }), m = "flex justify-between w-full";
-  return l ? /* @__PURE__ */ n("div", { className: "mb-4 flex flex-col gap-6", children: [
-    /* @__PURE__ */ n("div", { className: i(m), ...a, children: [
-      /* @__PURE__ */ e("div", { className: "flex flex-col", children: l }),
-      c
-    ] }),
-    r
-  ] }) : /* @__PURE__ */ n("div", { className: i(m, "gap-4 mb-4 items-center"), ...a, children: [
-    /* @__PURE__ */ e("div", { className: "flex flex-col gap-6", children: r }),
-    c
+AlertDialogContent.displayName = "AlertDialogContent";
+const AlertDialogHeader = ({ icon, children, ...props }) => {
+  const { dismissible } = useAlertDialog();
+  const closeButton = dismissible && /* @__PURE__ */ jsx("div", { className: "shrink-0", children: /* @__PURE__ */ jsx(AlertDialogClose, { asChild: true, children: /* @__PURE__ */ jsx(Button, { variant: "tertiary", size: "icon", children: /* @__PURE__ */ jsx(XMark, {}) }) }) });
+  const baseClasses = "flex justify-between w-full";
+  if (icon) {
+    return /* @__PURE__ */ jsxs("div", { className: "mb-4 flex flex-col gap-6", children: [
+      /* @__PURE__ */ jsxs("div", { className: cn(baseClasses), ...props, children: [
+        /* @__PURE__ */ jsx("div", { className: "flex flex-col", children: icon }),
+        closeButton
+      ] }),
+      children
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: cn(baseClasses, "gap-4 mb-4 items-center"), ...props, children: [
+    /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-6", children }),
+    closeButton
   ] });
 };
-v.displayName = "AlertDialogHeader";
-const C = (l) => /* @__PURE__ */ e(f, { ...l });
-C.displayName = "AlertDialogFooter";
-const b = s.forwardRef(({ className: l, children: r, ...a }, t) => /* @__PURE__ */ e(o.Title, { ref: t, ...a, asChild: !0, children: /* @__PURE__ */ e(d, { variant: "heading", level: 2, children: r }) }));
-b.displayName = "AlertDialogTitle";
-const w = s.forwardRef(({ className: l, children: r, ...a }, t) => /* @__PURE__ */ e(
-  o.Description,
+AlertDialogHeader.displayName = "AlertDialogHeader";
+const AlertDialogFooter = (props) => /* @__PURE__ */ jsx(BottomBar, { ...props });
+AlertDialogFooter.displayName = "AlertDialogFooter";
+const AlertDialogTitle = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(Drawer.Title, { ref, ...props, asChild: true, children: /* @__PURE__ */ jsx(Typography, { variant: "heading", level: 2, children }) }));
+AlertDialogTitle.displayName = "AlertDialogTitle";
+const AlertDialogDescription = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
+  Drawer.Description,
   {
-    ref: t,
-    className: i("text-gray-500 mb-8", l),
-    ...a,
-    asChild: !0,
-    children: /* @__PURE__ */ e(d, { children: r })
+    ref,
+    className: cn("text-gray-500 mb-8", className),
+    ...props,
+    asChild: true,
+    children: /* @__PURE__ */ jsx(Typography, { children })
   }
 ));
-w.displayName = "AlertDialogDescription";
+AlertDialogDescription.displayName = "AlertDialogDescription";
 export {
-  u as AlertDialog,
-  g as AlertDialogClose,
-  y as AlertDialogContent,
-  w as AlertDialogDescription,
-  C as AlertDialogFooter,
-  v as AlertDialogHeader,
-  x as AlertDialogPortal,
-  b as AlertDialogTitle,
-  N as AlertDialogTrigger
+  AlertDialog,
+  AlertDialogClose,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogPortal,
+  AlertDialogTitle,
+  AlertDialogTrigger
 };

package/dist/components/AlertDialog/index.d.ts

@@ -1 +1,2 @@
-export * from './AlertDialog';
+export { AlertDialog, AlertDialogPortal, AlertDialogTrigger, AlertDialogClose, AlertDialogContent, AlertDialogHeader, AlertDialogFooter, AlertDialogTitle, AlertDialogDescription, } from './AlertDialog';
+export type { AlertDialogProps, AlertDialogContentProps, AlertDialogHeaderProps, AlertDialogTitleProps, AlertDialogDescriptionProps, AlertDialogTriggerProps, AlertDialogCloseProps, WithFadeFromProps, WithoutFadeFromProps, } from './types';

package/dist/components/AlertDialog/use-alert-dialog.js

@@ -1,11 +1,13 @@
-import { createContext as e, useContext as o } from "react";
-const r = e(void 0), i = () => {
-  const t = o(r);
-  if (t === void 0)
+import { createContext, useContext } from "react";
+const AlertDialogContext = createContext(void 0);
+const useAlertDialog = () => {
+  const context = useContext(AlertDialogContext);
+  if (context === void 0) {
     throw new Error("useAlertDialog must be used within an AlertDialog");
-  return t;
+  }
+  return context;
 };
 export {
-  r as AlertDialogContext,
-  i as useAlertDialog
+  AlertDialogContext,
+  useAlertDialog
 };

package/dist/components/BottomBar/BottomBar.d.ts

@@ -2,12 +2,13 @@ import { VariantProps } from 'class-variance-authority';
 declare const bottomBarVariants: (props?: ({
     direction?: "horizontal" | "vertical" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
-export interface BottomBarProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "className">, VariantProps<typeof bottomBarVariants> {
+interface BottomBarProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "className">, VariantProps<typeof bottomBarVariants> {
     /**
      * The direction of the bottom bar
      * @default "horizontal"
      */
     direction?: "horizontal" | "vertical";
 }
-export declare const BottomBar: import('react').ForwardRefExoticComponent<BottomBarProps & import('react').RefAttributes<HTMLDivElement>>;
-export {};
+declare const BottomBar: import('react').ForwardRefExoticComponent<BottomBarProps & import('react').RefAttributes<HTMLDivElement>>;
+export { BottomBar };
+export type { BottomBarProps };

package/dist/components/BottomBar/BottomBar.js

@@ -1,8 +1,8 @@
 "use client";
-import { jsx as i } from "react/jsx-runtime";
-import { cva as e } from "../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
-import { forwardRef as l } from "react";
-const s = e("w-full gap-4", {
+import { jsx } from "react/jsx-runtime";
+import { cva } from "../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
+import { forwardRef } from "react";
+const bottomBarVariants = cva("w-full gap-4", {
   variants: {
     direction: {
       horizontal: "grid grid-cols-1 [&>*]:col-span-1 [&:has(>*:nth-child(2))]:grid-cols-2",
@@ -12,10 +12,13 @@ const s = e("w-full gap-4", {
   defaultVariants: {
     direction: "horizontal"
   }
-}), c = l(
-  ({ children: r, direction: o, ...t }, a) => /* @__PURE__ */ i("div", { ref: a, className: s({ direction: o }), ...t, children: r })
+});
+const BottomBar = forwardRef(
+  ({ children, direction, ...props }, ref) => {
+    return /* @__PURE__ */ jsx("div", { ref, className: bottomBarVariants({ direction }), ...props, children });
+  }
 );
-c.displayName = "BottomBar";
+BottomBar.displayName = "BottomBar";
 export {
-  c as BottomBar
+  BottomBar
 };

package/dist/components/BottomBar/index.d.ts

@@ -1 +1 @@
-export * from './BottomBar';
+export { BottomBar, type BottomBarProps } from './BottomBar';

package/dist/components/BulletList/BulletList.d.ts

@@ -1,10 +1,15 @@
-import { ComponentProps, ReactElement } from 'react';
-import { BulletListItemProps } from '../BulletListItem/BulletListItem';
-export interface BulletListProps extends ComponentProps<"div"> {
+import { ComponentProps, ReactElement, ReactNode } from 'react';
+interface BulletListProps extends ComponentProps<"div"> {
     /**
      * Children should be BulletListItem components, but any ReactNode is accepted for compatibility
      */
     children: ReactElement<BulletListItemProps>[] | ReactElement<BulletListItemProps>;
 }
-export declare const BulletList: import('react').ForwardRefExoticComponent<Omit<BulletListProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
-export default BulletList;
+declare const BulletList: import('react').ForwardRefExoticComponent<Omit<BulletListProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+interface BulletListItemProps extends ComponentProps<"div"> {
+    children?: ReactNode;
+    bulletPoint: ReactNode;
+}
+declare const BulletListItem: import('react').ForwardRefExoticComponent<Omit<BulletListItemProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+export { BulletList, BulletListItem };
+export type { BulletListProps, BulletListItemProps };

package/dist/components/BulletList/BulletList.js

@@ -1,11 +1,31 @@
-import { jsx as e } from "react/jsx-runtime";
-import { cn as s } from "../../lib/utils.js";
-import { forwardRef as i } from "react";
-const m = i(
-  ({ children: t, className: r, ...o }, a) => /* @__PURE__ */ e("div", { ref: a, className: s("grid gap-y-5 content-start", r), ...o, children: t })
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "../../lib/utils.js";
+import { forwardRef } from "react";
+import { Typography } from "../Typography/Typography.js";
+const BulletList = forwardRef(
+  ({ children, className, ...props }, ref) => {
+    return /* @__PURE__ */ jsx("div", { ref, className: cn("grid gap-y-5 content-start", className), ...props, children });
+  }
 );
-m.displayName = "BulletList";
+BulletList.displayName = "BulletList";
+const BulletListItem = forwardRef(
+  ({ children, className, bulletPoint, ...props }, ref) => {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn("grid grid-cols-[auto_1fr] gap-x-3 items-center", className),
+        ...props,
+        children: [
+          bulletPoint,
+          /* @__PURE__ */ jsx(Typography, { className: "text-gray-500", children })
+        ]
+      }
+    );
+  }
+);
+BulletListItem.displayName = "BulletListItem";
 export {
-  m as BulletList,
-  m as default
+  BulletList,
+  BulletListItem
 };

package/dist/components/BulletList/index.d.ts

@@ -1 +1 @@
-export * from './BulletList';
+export { BulletList, BulletListItem, type BulletListProps, type BulletListItemProps, } from './BulletList';

package/dist/components/Button/Button.d.ts

@@ -5,7 +5,7 @@ declare const buttonVariants: (props?: ({
     size?: "sm" | "lg" | "icon" | null | undefined;
     fullWidth?: boolean | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
-export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
     /**
      * The variant style to use
      * @default "primary"
@@ -27,5 +27,6 @@ export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement>, Va
      */
     asChild?: boolean;
 }
-export declare const Button: import('react').ForwardRefExoticComponent<ButtonProps & import('react').RefAttributes<HTMLButtonElement>>;
-export default Button;
+declare const Button: import('react').ForwardRefExoticComponent<ButtonProps & import('react').RefAttributes<HTMLButtonElement>>;
+export { Button };
+export type { ButtonProps };

package/dist/components/Button/Button.js

@@ -1,11 +1,11 @@
 "use client";
-import { jsx as l } from "react/jsx-runtime";
-import { cn as n } from "../../lib/utils.js";
-import { Slot as s } from "../../node_modules/.pnpm/@radix-ui_react-slot@1.1.1_@types_react@18.3.18_react@18.3.1/node_modules/@radix-ui/react-slot/dist/index.js";
-import { cva as y } from "../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
-import { forwardRef as d } from "react";
-import { typographyVariants as m } from "../Typography/Typography.js";
-const b = y(
+import { jsx } from "react/jsx-runtime";
+import { cn } from "../../lib/utils.js";
+import { Slot } from "../../node_modules/.pnpm/@radix-ui_react-slot@1.1.1_@types_react@18.3.18_react@18.3.1/node_modules/@radix-ui/react-slot/dist/index.js";
+import { cva } from "../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
+import { forwardRef } from "react";
+import { typographyVariants } from "../Typography/Typography.js";
+const buttonVariants = cva(
   "flex items-center justify-center rounded-full gap-2 font-sans leading-[1.2] tracking-normal transition-colors",
   {
     variants: {
@@ -27,33 +27,36 @@ const b = y(
     defaultVariants: {
       variant: "primary",
       size: "lg",
-      fullWidth: !1
+      fullWidth: false
     }
   }
-), f = d(
-  ({ variant: t = "primary", size: r = "lg", fullWidth: e, asChild: i, children: o, ...a }, g) => /* @__PURE__ */ l(
-    i ? s : "button",
-    {
-      ref: g,
-      ...a,
-      className: n(
-        b({
-          variant: t,
-          size: r,
-          fullWidth: e
-        }),
-        m({
-          variant: "label",
-          level: r === "lg" ? 1 : 2
-        }),
-        a.className
-      ),
-      children: o
-    }
-  )
 );
-f.displayName = "Button";
+const Button = forwardRef(
+  ({ variant = "primary", size = "lg", fullWidth, asChild, children, ...props }, ref) => {
+    const Comp = asChild ? Slot : "button";
+    return /* @__PURE__ */ jsx(
+      Comp,
+      {
+        ref,
+        ...props,
+        className: cn(
+          buttonVariants({
+            variant,
+            size,
+            fullWidth
+          }),
+          typographyVariants({
+            variant: "label",
+            level: size === "lg" ? 1 : 2
+          }),
+          props.className
+        ),
+        children
+      }
+    );
+  }
+);
+Button.displayName = "Button";
 export {
-  f as Button,
-  f as default
+  Button
 };

package/dist/components/Button/index.d.ts

@@ -1 +1 @@
-export * from './Button';
+export { Button, type ButtonProps } from './Button';

package/dist/components/Checkbox/Checkbox.d.ts

@@ -1,5 +1,5 @@
 import { CheckboxProps as RadixCheckboxProps } from '@radix-ui/react-checkbox';
-export interface CheckboxProps extends Omit<RadixCheckboxProps, "onCheckedChange" | "onChange" | "className"> {
+interface CheckboxProps extends Omit<RadixCheckboxProps, "onCheckedChange" | "onChange" | "className"> {
     /**
      * Whether to forward the root element
      * @default false
@@ -35,5 +35,6 @@ export interface CheckboxProps extends Omit<RadixCheckboxProps, "onCheckedChange
      */
     value?: string;
 }
-export declare const Checkbox: import('react').ForwardRefExoticComponent<CheckboxProps & import('react').RefAttributes<HTMLButtonElement>>;
-export default Checkbox;
+declare const Checkbox: import('react').ForwardRefExoticComponent<CheckboxProps & import('react').RefAttributes<HTMLButtonElement>>;
+export { Checkbox };
+export type { CheckboxProps };

package/dist/components/Checkbox/Checkbox.js

@@ -1,23 +1,24 @@
-import { jsx as e } from "react/jsx-runtime";
-import { Root as c, Indicator as s } from "../../node_modules/.pnpm/@radix-ui_react-checkbox@1.1.3_@types_react-dom@18.3.5_@types_react@18.3.18__@types_react@18._5vtvszwgvdmnkk62ia2dob365m/node_modules/@radix-ui/react-checkbox/dist/index.js";
-import { forwardRef as i } from "react";
-import { Tick as n } from "../Icons/Tick.js";
-const l = i(
-  ({ checked: a, onChange: r, disabled: t = !1, ...o }, d) => /* @__PURE__ */ e(
-    c,
-    {
-      ref: d,
-      checked: a,
-      onCheckedChange: r,
-      disabled: t,
-      className: "flex size-6 items-center justify-center rounded-md border-[0.09375rem] transition-all data-[state=checked]:border-gray-900 data-[state=checked]:bg-gray-900 data-[state=unchecked]:border-gray-200 data-[state=unchecked]:bg-transparent disabled:cursor-not-allowed disabled:opacity-20",
-      ...o,
-      children: /* @__PURE__ */ e(s, { children: /* @__PURE__ */ e(n, { className: "text-gray-0" }) })
-    }
-  )
+import { jsx } from "react/jsx-runtime";
+import { Root, Indicator } from "../../node_modules/.pnpm/@radix-ui_react-checkbox@1.1.3_@types_react-dom@18.3.5_@types_react@18.3.18__@types_react@18._5vtvszwgvdmnkk62ia2dob365m/node_modules/@radix-ui/react-checkbox/dist/index.js";
+import { forwardRef } from "react";
+import { Tick } from "../Icons/Tick.js";
+const Checkbox = forwardRef(
+  ({ checked, onChange: onCheckedChange, disabled = false, ...props }, ref) => {
+    return /* @__PURE__ */ jsx(
+      Root,
+      {
+        ref,
+        checked,
+        onCheckedChange,
+        disabled,
+        className: "flex size-6 items-center justify-center rounded-md border-[0.09375rem] transition-all data-[state=checked]:border-gray-900 data-[state=checked]:bg-gray-900 data-[state=unchecked]:border-gray-200 data-[state=unchecked]:bg-transparent disabled:cursor-not-allowed disabled:opacity-20",
+        ...props,
+        children: /* @__PURE__ */ jsx(Indicator, { children: /* @__PURE__ */ jsx(Tick, { className: "text-gray-0" }) })
+      }
+    );
+  }
 );
-l.displayName = "Checkbox";
+Checkbox.displayName = "Checkbox";
 export {
-  l as Checkbox,
-  l as default
+  Checkbox
 };

package/dist/components/Checkbox/index.d.ts

@@ -1 +1 @@
-export * from './Checkbox';
+export { Checkbox, type CheckboxProps } from './Checkbox';

package/dist/components/Chip/Chip.d.ts

@@ -1,7 +1,7 @@
 import { VariantProps } from 'class-variance-authority';
 import { HTMLAttributes, ReactNode } from 'react';
 type ChipVariant = "default" | "success" | "warning" | "error" | "important";
-export interface ChipProps extends HTMLAttributes<HTMLDivElement> {
+interface ChipProps extends HTMLAttributes<HTMLDivElement> {
     /**
      * The variant of the chip. Default value is "default".
      */
@@ -19,8 +19,9 @@ export interface ChipProps extends HTMLAttributes<HTMLDivElement> {
      */
     className?: string;
 }
-export declare const Chip: import('react').ForwardRefExoticComponent<ChipProps & VariantProps<(props?: ({
+declare const Chip: import('react').ForwardRefExoticComponent<ChipProps & VariantProps<(props?: ({
     variant?: "error" | "default" | "success" | "warning" | "important" | null | undefined;
     isIcon?: boolean | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string> & import('react').RefAttributes<HTMLDivElement>>;
-export default Chip;
+export { Chip };
+export type { ChipProps };

package/dist/components/Chip/Chip.js

@@ -1,9 +1,9 @@
-import { jsxs as o, jsx as t } from "react/jsx-runtime";
-import { Slot as l } from "../../node_modules/.pnpm/@radix-ui_react-slot@1.1.1_@types_react@18.3.18_react@18.3.1/node_modules/@radix-ui/react-slot/dist/index.js";
-import { cva as f } from "../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
-import { forwardRef as m } from "react";
-import { Typography as c } from "../Typography/Typography.js";
-const d = f(
+import { jsxs, jsx } from "react/jsx-runtime";
+import { Slot } from "../../node_modules/.pnpm/@radix-ui_react-slot@1.1.1_@types_react@18.3.18_react@18.3.1/node_modules/@radix-ui/react-slot/dist/index.js";
+import { cva } from "../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
+import { forwardRef } from "react";
+import { Typography } from "../Typography/Typography.js";
+const chipVariants = cva(
   "inline-flex h-7 items-center gap-2 rounded-full px-4 font-sans text-sm font-medium leading-none",
   {
     variants: {
@@ -21,25 +21,27 @@ const d = f(
     },
     defaultVariants: {
       variant: "default",
-      isIcon: !1
+      isIcon: false
     }
   }
-), p = m(
-  ({ icon: r, label: e, variant: a = "default", className: i, ...n }, s) => /* @__PURE__ */ o(
-    "div",
-    {
-      ref: s,
-      className: d({ variant: a, className: i, isIcon: !!r }),
-      ...n,
-      children: [
-        r && /* @__PURE__ */ t(l, { style: { width: "1rem", height: "1rem" }, children: r }),
-        /* @__PURE__ */ t(c, { variant: "subtitle", level: 4, children: e })
-      ]
-    }
-  )
 );
-p.displayName = "Chip";
+const Chip = forwardRef(
+  ({ icon, label, variant = "default", className, ...props }, ref) => {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: chipVariants({ variant, className, isIcon: !!icon }),
+        ...props,
+        children: [
+          icon && /* @__PURE__ */ jsx(Slot, { style: { width: "1rem", height: "1rem" }, children: icon }),
+          /* @__PURE__ */ jsx(Typography, { variant: "subtitle", level: 4, children: label })
+        ]
+      }
+    );
+  }
+);
+Chip.displayName = "Chip";
 export {
-  p as Chip,
-  p as default
+  Chip
 };

package/dist/components/Chip/index.d.ts

@@ -1 +1 @@
-export * from './Chip';
+export { Chip, type ChipProps } from './Chip';

package/dist/components/CircularIcon/CircularIcon.d.ts

@@ -1,8 +1,10 @@
 import { ReactNode } from 'react';
-export type CircularIconSize = "xs" | "sm" | "md" | "lg" | "xl";
-export interface CircularIconProps extends React.HTMLAttributes<HTMLDivElement> {
+type CircularIconSize = "xs" | "sm" | "md" | "lg" | "xl";
+interface CircularIconProps extends React.HTMLAttributes<HTMLDivElement> {
     children?: ReactNode;
     className?: string;
     size?: CircularIconSize;
 }
-export declare function CircularIcon({ children, className, size, ...props }: CircularIconProps): import("react/jsx-runtime").JSX.Element;
+declare function CircularIcon({ children, className, size, ...props }: CircularIconProps): import("react/jsx-runtime").JSX.Element;
+export { CircularIcon };
+export type { CircularIconProps };

package/dist/components/CircularIcon/index.d.ts

@@ -1 +1 @@
-export * from './CircularIcon';
+export { CircularIcon, type CircularIconProps } from './CircularIcon';