@brijbyte/agentic-ui 0.0.3 → 0.0.5

package/dist/alert-dialog/alert-dialog.d.ts

@@ -13,13 +13,19 @@ interface AlertAction {
   destructive?: boolean;
 }
 interface AlertDialogProps {
+  /** Controlled open state. */
   open?: boolean;
+  /** Whether the dialog is initially open (uncontrolled). */
   defaultOpen?: boolean;
+  /** Called when the dialog opens or closes. */
   onOpenChange?: (open: boolean, eventDetails: unknown) => void;
+  /** Element that opens the dialog when clicked. */
   trigger?: ReactElement;
   /** Optional icon shown above the title. */
   icon?: ReactNode;
+  /** Dialog heading text. */
   title: ReactNode;
+  /** Supplementary text below the title. */
   description?: ReactNode;
   /**
    * Action buttons rendered right-aligned.
@@ -29,6 +35,11 @@ interface AlertDialogProps {
   actions: AlertAction[];
   className?: string;
 }
+/**
+ * A modal that requires a user response before continuing. Blocks interaction
+ * with the rest of the page until dismissed. Two actions render side-by-side;
+ * three or more stack vertically.
+ */
 declare function AlertDialog({
   trigger,
   icon,

package/dist/alert-dialog/alert-dialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"alert-dialog.d.ts","names":[],"sources":["../../src/alert-dialog/alert-dialog.tsx"],"mappings":";;;;;UAKiB,WAAA;EACf,KAAA,EAAO,SAAA;;EAEP,QAAA;EAH0B;EAK1B,OAAA;EAJgB;EAMhB,WAAA;AAAA;AAAA,UAGe,gBAAA;EACf,IAAA;EACA,WAAA;EACA,YAAA,IAAgB,IAAA,WAAe,YAAA;EAC/B,OAAA,GAAU,YAAA;EAJK;EAMf,IAAA,GAAO,SAAA;EACP,KAAA,EAAO,SAAA;EACP,WAAA,GAAc,SAAA;EAFP;;;;;EAQP,OAAA,EAAS,WAAA;EACT,SAAA;AAAA;AAAA,iBAGc,WAAA,CAAA;EAAc,OAAA;EAAS,IAAA;EAAM,KAAA;EAAO,WAAA;EAAa,OAAA;EAAS,SAAA;EAAW,YAAA;EAAA,GAAiB;AAAA,GAAS,gBAAA,GAAgB,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"alert-dialog.d.ts","names":[],"sources":["../../src/alert-dialog/alert-dialog.tsx"],"mappings":";;;;;UAKiB,WAAA;EACf,KAAA,EAAO,SAAA;;EAEP,QAAA;EAH0B;EAK1B,OAAA;EAJgB;EAMhB,WAAA;AAAA;AAAA,UAGe,gBAAA;EALf;EAOA,IAAA;EALW;EAOX,WAAA;EAJe;EAMf,YAAA,IAAgB,IAAA,WAAe,YAAA;;EAE/B,OAAA,GAAU,YAAA;EAEH;EAAP,IAAA,GAAO,SAAA;EAIO;EAFd,KAAA,EAAO,SAAA;EAQa;EANpB,WAAA,GAAc,SAAA;EAZd;;;;;EAkBA,OAAA,EAAS,WAAA;EACT,SAAA;AAAA;;;;;;iBAQc,WAAA,CAAA;EAAc,OAAA;EAAS,IAAA;EAAM,KAAA;EAAO,WAAA;EAAa,OAAA;EAAS,SAAA;EAAW,YAAA;EAAA,GAAiB;AAAA,GAAS,gBAAA,GAAgB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/alert-dialog/alert-dialog.js

@@ -3,6 +3,11 @@ import alert_dialog_module_default from "./alert-dialog.module.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { AlertDialog } from "@base-ui/react/alert-dialog";
 //#region src/alert-dialog/alert-dialog.tsx
+/**
+* A modal that requires a user response before continuing. Blocks interaction
+* with the rest of the page until dismissed. Two actions render side-by-side;
+* three or more stack vertically.
+*/
 function AlertDialog$1({ trigger, icon, title, description, actions, className, onOpenChange, ...props }) {
 	return /* @__PURE__ */ jsxs(AlertDialog.Root, {
 		onOpenChange,

package/dist/alert-dialog/alert-dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert-dialog.js","names":["AlertDialog","BaseAlertDialog","styles"],"sources":["../../src/alert-dialog/alert-dialog.tsx"],"sourcesContent":["import type { ReactNode, ReactElement } from \"react\";\nimport { AlertDialog as BaseAlertDialog } from \"@base-ui/react/alert-dialog\";\nimport { Button } from \"../button/button\";\nimport styles from \"./alert-dialog.module.css\";\n\nexport interface AlertAction {\n  label: ReactNode;\n  /** Called when the action button is clicked. The dialog closes automatically. */\n  onAction?: () => void;\n  /** Renders as a filled accent button — use for the primary confirm action. */\n  primary?: boolean;\n  /** Renders as a soft destructive button. Sits on the left when combined with other actions. */\n  destructive?: boolean;\n}\n\nexport interface AlertDialogProps {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean, eventDetails: unknown) => void;\n  trigger?: ReactElement;\n  /** Optional icon shown above the title. */\n  icon?: ReactNode;\n  title: ReactNode;\n  description?: ReactNode;\n  /**\n   * Action buttons rendered right-aligned.\n   * Use `primary: true` for the confirm action (solid), leave unset for cancel (outline).\n   * Use `destructive: true` to apply destructive tone to the confirm action.\n   */\n  actions: AlertAction[];\n  className?: string;\n}\n\nexport function AlertDialog({ trigger, icon, title, description, actions, className, onOpenChange, ...props }: AlertDialogProps) {\n  return (\n    <BaseAlertDialog.Root onOpenChange={onOpenChange as never} {...props}>\n      {trigger && <BaseAlertDialog.Trigger render={trigger} />}\n      <BaseAlertDialog.Portal>\n        <BaseAlertDialog.Backdrop className={styles.backdrop} />\n        <BaseAlertDialog.Popup className={`${styles.popup} ${className ?? \"\"}`}>\n          <div className={styles.header}>\n            {icon && <div className={styles.icon}>{icon}</div>}\n            <BaseAlertDialog.Title className={styles.title}>{title}</BaseAlertDialog.Title>\n            {description && <BaseAlertDialog.Description className={styles.description}>{description}</BaseAlertDialog.Description>}\n          </div>\n          <div className={styles.actions}>\n            {actions.map((action, i) => (\n              <BaseAlertDialog.Close\n                key={i}\n                render={\n                  <Button\n                    variant={action.primary ? \"solid\" : \"outline\"}\n                    tone={action.destructive ? \"destructive\" : \"primary\"}\n                    size=\"sm\"\n                    onClick={action.onAction}\n                  />\n                }\n              >\n                {action.label}\n              </BaseAlertDialog.Close>\n            ))}\n          </div>\n        </BaseAlertDialog.Popup>\n      </BaseAlertDialog.Portal>\n    </BaseAlertDialog.Root>\n  );\n}\n\nexport { styles as AlertDialogStyles };\n"],"mappings":";;;;;AAiCA,SAAgBA,cAAY,EAAE,SAAS,MAAM,OAAO,aAAa,SAAS,WAAW,cAAc,GAAG,SAA2B;AAC/H,QACE,qBAACC,YAAgB,MAAjB;EAAoC;EAAuB,GAAI;YAA/D,CACG,WAAW,oBAACA,YAAgB,SAAjB,EAAyB,QAAQ,SAAW,CAAA,EACxD,qBAACA,YAAgB,QAAjB,EAAA,UAAA,CACE,oBAACA,YAAgB,UAAjB,EAA0B,WAAWC,4BAAO,UAAY,CAAA,EACxD,qBAACD,YAAgB,OAAjB;GAAuB,WAAW,GAAGC,4BAAO,MAAM,GAAG,aAAa;aAAlE,CACE,qBAAC,OAAD;IAAK,WAAWA,4BAAO;cAAvB;KACG,QAAQ,oBAAC,OAAD;MAAK,WAAWA,4BAAO;gBAAO;MAAW,CAAA;KAClD,oBAACD,YAAgB,OAAjB;MAAuB,WAAWC,4BAAO;gBAAQ;MAA8B,CAAA;KAC9E,eAAe,oBAACD,YAAgB,aAAjB;MAA6B,WAAWC,4BAAO;gBAAc;MAA0C,CAAA;KACnH;OACN,oBAAC,OAAD;IAAK,WAAWA,4BAAO;cACpB,QAAQ,KAAK,QAAQ,MACpB,oBAACD,YAAgB,OAAjB;KAEE,QACE,oBAAC,QAAD;MACE,SAAS,OAAO,UAAU,UAAU;MACpC,MAAM,OAAO,cAAc,gBAAgB;MAC3C,MAAK;MACL,SAAS,OAAO;MAChB,CAAA;eAGH,OAAO;KACc,EAXjB,EAWiB,CACxB;IACE,CAAA,CACgB;KACD,EAAA,CAAA,CACJ"}
+{"version":3,"file":"alert-dialog.js","names":["AlertDialog","BaseAlertDialog","styles"],"sources":["../../src/alert-dialog/alert-dialog.tsx"],"sourcesContent":["import type { ReactNode, ReactElement } from \"react\";\nimport { AlertDialog as BaseAlertDialog } from \"@base-ui/react/alert-dialog\";\nimport { Button } from \"../button/button\";\nimport styles from \"./alert-dialog.module.css\";\n\nexport interface AlertAction {\n  label: ReactNode;\n  /** Called when the action button is clicked. The dialog closes automatically. */\n  onAction?: () => void;\n  /** Renders as a filled accent button — use for the primary confirm action. */\n  primary?: boolean;\n  /** Renders as a soft destructive button. Sits on the left when combined with other actions. */\n  destructive?: boolean;\n}\n\nexport interface AlertDialogProps {\n  /** Controlled open state. */\n  open?: boolean;\n  /** Whether the dialog is initially open (uncontrolled). */\n  defaultOpen?: boolean;\n  /** Called when the dialog opens or closes. */\n  onOpenChange?: (open: boolean, eventDetails: unknown) => void;\n  /** Element that opens the dialog when clicked. */\n  trigger?: ReactElement;\n  /** Optional icon shown above the title. */\n  icon?: ReactNode;\n  /** Dialog heading text. */\n  title: ReactNode;\n  /** Supplementary text below the title. */\n  description?: ReactNode;\n  /**\n   * Action buttons rendered right-aligned.\n   * Use `primary: true` for the confirm action (solid), leave unset for cancel (outline).\n   * Use `destructive: true` to apply destructive tone to the confirm action.\n   */\n  actions: AlertAction[];\n  className?: string;\n}\n\n/**\n * A modal that requires a user response before continuing. Blocks interaction\n * with the rest of the page until dismissed. Two actions render side-by-side;\n * three or more stack vertically.\n */\nexport function AlertDialog({ trigger, icon, title, description, actions, className, onOpenChange, ...props }: AlertDialogProps) {\n  return (\n    <BaseAlertDialog.Root onOpenChange={onOpenChange as never} {...props}>\n      {trigger && <BaseAlertDialog.Trigger render={trigger} />}\n      <BaseAlertDialog.Portal>\n        <BaseAlertDialog.Backdrop className={styles.backdrop} />\n        <BaseAlertDialog.Popup className={`${styles.popup} ${className ?? \"\"}`}>\n          <div className={styles.header}>\n            {icon && <div className={styles.icon}>{icon}</div>}\n            <BaseAlertDialog.Title className={styles.title}>{title}</BaseAlertDialog.Title>\n            {description && <BaseAlertDialog.Description className={styles.description}>{description}</BaseAlertDialog.Description>}\n          </div>\n          <div className={styles.actions}>\n            {actions.map((action, i) => (\n              <BaseAlertDialog.Close\n                key={i}\n                render={\n                  <Button\n                    variant={action.primary ? \"solid\" : \"outline\"}\n                    tone={action.destructive ? \"destructive\" : \"primary\"}\n                    size=\"sm\"\n                    onClick={action.onAction}\n                  />\n                }\n              >\n                {action.label}\n              </BaseAlertDialog.Close>\n            ))}\n          </div>\n        </BaseAlertDialog.Popup>\n      </BaseAlertDialog.Portal>\n    </BaseAlertDialog.Root>\n  );\n}\n\nexport { styles as AlertDialogStyles };\n"],"mappings":";;;;;;;;;;AA4CA,SAAgBA,cAAY,EAAE,SAAS,MAAM,OAAO,aAAa,SAAS,WAAW,cAAc,GAAG,SAA2B;AAC/H,QACE,qBAACC,YAAgB,MAAjB;EAAoC;EAAuB,GAAI;YAA/D,CACG,WAAW,oBAACA,YAAgB,SAAjB,EAAyB,QAAQ,SAAW,CAAA,EACxD,qBAACA,YAAgB,QAAjB,EAAA,UAAA,CACE,oBAACA,YAAgB,UAAjB,EAA0B,WAAWC,4BAAO,UAAY,CAAA,EACxD,qBAACD,YAAgB,OAAjB;GAAuB,WAAW,GAAGC,4BAAO,MAAM,GAAG,aAAa;aAAlE,CACE,qBAAC,OAAD;IAAK,WAAWA,4BAAO;cAAvB;KACG,QAAQ,oBAAC,OAAD;MAAK,WAAWA,4BAAO;gBAAO;MAAW,CAAA;KAClD,oBAACD,YAAgB,OAAjB;MAAuB,WAAWC,4BAAO;gBAAQ;MAA8B,CAAA;KAC9E,eAAe,oBAACD,YAAgB,aAAjB;MAA6B,WAAWC,4BAAO;gBAAc;MAA0C,CAAA;KACnH;OACN,oBAAC,OAAD;IAAK,WAAWA,4BAAO;cACpB,QAAQ,KAAK,QAAQ,MACpB,oBAACD,YAAgB,OAAjB;KAEE,QACE,oBAAC,QAAD;MACE,SAAS,OAAO,UAAU,UAAU;MACpC,MAAM,OAAO,cAAc,gBAAgB;MAC3C,MAAK;MACL,SAAS,OAAO;MAChB,CAAA;eAGH,OAAO;KACc,EAXjB,EAWiB,CACxB;IACE,CAAA,CACgB;KACD,EAAA,CAAA,CACJ"}

package/dist/alert-dialog/parts.d.ts

@@ -7,18 +7,10 @@ type BaseBackdropProps = ComponentPropsWithoutRef<typeof AlertDialog.Backdrop>;
 type BasePopupProps = ComponentPropsWithoutRef<typeof AlertDialog.Popup>;
 type BaseTitleProps = ComponentPropsWithoutRef<typeof AlertDialog.Title>;
 type BaseDescriptionProps = ComponentPropsWithoutRef<typeof AlertDialog.Description>;
-interface AlertDialogBackdropProps extends Omit<BaseBackdropProps, "className"> {
-  className?: string;
-}
-interface AlertDialogPopupProps extends Omit<BasePopupProps, "className"> {
-  className?: string;
-}
-interface AlertDialogTitleProps extends Omit<BaseTitleProps, "className"> {
-  className?: string;
-}
-interface AlertDialogDescriptionProps extends Omit<BaseDescriptionProps, "className"> {
-  className?: string;
-}
+interface AlertDialogBackdropProps extends BaseBackdropProps {}
+interface AlertDialogPopupProps extends BasePopupProps {}
+interface AlertDialogTitleProps extends BaseTitleProps {}
+interface AlertDialogDescriptionProps extends BaseDescriptionProps {}
 declare const AlertDialogBackdrop: react.ForwardRefExoticComponent<AlertDialogBackdropProps & react.RefAttributes<HTMLDivElement>>;
 declare const AlertDialogPopup: react.ForwardRefExoticComponent<AlertDialogPopupProps & react.RefAttributes<HTMLDivElement>>;
 declare const AlertDialogTitle: react.ForwardRefExoticComponent<AlertDialogTitleProps & react.RefAttributes<HTMLHeadingElement>>;

package/dist/alert-dialog/parts.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"parts.d.ts","names":[],"sources":["../../src/alert-dialog/parts.tsx"],"mappings":";;;;;KA8BK,iBAAA,GAAoB,wBAAA,QAAgC,WAAA,CAAgB,QAAA;AAAA,KACpE,cAAA,GAAiB,wBAAA,QAAgC,WAAA,CAAgB,KAAA;AAAA,KACjE,cAAA,GAAiB,wBAAA,QAAgC,WAAA,CAAgB,KAAA;AAAA,KACjE,oBAAA,GAAuB,wBAAA,QAAgC,WAAA,CAAgB,WAAA;AAAA,UAE3D,wBAAA,SAAiC,IAAA,CAAK,iBAAA;EACrD,SAAA;AAAA;AAAA,UAEe,qBAAA,SAA8B,IAAA,CAAK,cAAA;EAClD,SAAA;AAAA;AAAA,UAEe,qBAAA,SAA8B,IAAA,CAAK,cAAA;EAClD,SAAA;AAAA;AAAA,UAEe,2BAAA,SAAoC,IAAA,CAAK,oBAAA;EACxD,SAAA;AAAA;AAAA,cAGW,mBAAA,EAAmB,KAAA,CAAA,yBAAA,CAAA,wBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,cAAA;AAAA,cAMnB,gBAAA,EAAgB,KAAA,CAAA,yBAAA,CAAA,qBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,cAAA;AAAA,cAOhB,gBAAA,EAAgB,KAAA,CAAA,yBAAA,CAAA,qBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,kBAAA;AAAA,cAOhB,sBAAA,EAAsB,KAAA,CAAA,yBAAA,CAAA,2BAAA,GAAA,KAAA,CAAA,aAAA,CAAA,oBAAA"}
+{"version":3,"file":"parts.d.ts","names":[],"sources":["../../src/alert-dialog/parts.tsx"],"mappings":";;;;;KA4BK,iBAAA,GAAoB,wBAAA,QAAgC,WAAA,CAAgB,QAAA;AAAA,KACpE,cAAA,GAAiB,wBAAA,QAAgC,WAAA,CAAgB,KAAA;AAAA,KACjE,cAAA,GAAiB,wBAAA,QAAgC,WAAA,CAAgB,KAAA;AAAA,KACjE,oBAAA,GAAuB,wBAAA,QAAgC,WAAA,CAAgB,WAAA;AAAA,UAE3D,wBAAA,SAAiC,iBAAA;AAAA,UACjC,qBAAA,SAA8B,cAAA;AAAA,UAC9B,qBAAA,SAA8B,cAAA;AAAA,UAC9B,2BAAA,SAAoC,oBAAA;AAAA,cAExC,mBAAA,EAAmB,KAAA,CAAA,yBAAA,CAAA,wBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,cAAA;AAAA,cAMnB,gBAAA,EAAgB,KAAA,CAAA,yBAAA,CAAA,qBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,cAAA;AAAA,cAOhB,gBAAA,EAAgB,KAAA,CAAA,yBAAA,CAAA,qBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,kBAAA;AAAA,cAOhB,sBAAA,EAAsB,KAAA,CAAA,yBAAA,CAAA,2BAAA,GAAA,KAAA,CAAA,aAAA,CAAA,oBAAA"}

package/dist/alert-dialog/parts.js

@@ -1,3 +1,4 @@
+import { cx, resolveClassName } from "../utils/resolveClassName.js";
 import alert_dialog_module_default from "./alert-dialog.module.js";
 import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
@@ -8,51 +9,48 @@ import { AlertDialog } from "@base-ui/react/alert-dialog";
 *
 * @example
 * ```tsx
-* import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog';
-* import { Button } from '@brijbyte/agentic-ui/button';
+* import { AlertDialog } from '@base-ui/react/alert-dialog';
 * import { AlertDialogBackdrop, AlertDialogPopup, AlertDialogTitle, AlertDialogDescription } from '@brijbyte/agentic-ui/alert-dialog';
 *
-* <BaseAlertDialog.Root>
-*   <BaseAlertDialog.Trigger render={<button>Open</button>} />
-*   <BaseAlertDialog.Portal>
+* <AlertDialog.Root>
+*   <AlertDialog.Trigger render={<button>Open</button>} />
+*   <AlertDialog.Portal>
 *     <AlertDialogBackdrop />
-*     <AlertDialogPopup>
-*       <AlertDialogTitle>Delete account?</AlertDialogTitle>
-*       <AlertDialogDescription>This cannot be undone.</AlertDialogDescription>
-*       <div>
-*         <BaseAlertDialog.Close render={<Button variant="soft" tone="destructive" size="sm" />}>Delete</BaseAlertDialog.Close>
-*         <BaseAlertDialog.Close render={<Button variant="outline" size="sm" />}>Cancel</BaseAlertDialog.Close>
-*       </div>
-*     </AlertDialogPopup>
-*   </BaseAlertDialog.Portal>
-* </BaseAlertDialog.Root>
+*     <AlertDialog.Viewport>
+*       <AlertDialogPopup>
+*         <AlertDialogTitle>Confirm</AlertDialogTitle>
+*         <AlertDialogDescription>Are you sure?</AlertDialogDescription>
+*       </AlertDialogPopup>
+*     </AlertDialog.Viewport>
+*   </AlertDialog.Portal>
+* </AlertDialog.Root>
 * ```
 */
 const AlertDialogBackdrop = forwardRef(function AlertDialogBackdrop({ className, ...props }, ref) {
 	return /* @__PURE__ */ jsx(AlertDialog.Backdrop, {
 		ref,
-		className: `${alert_dialog_module_default.backdrop} ${className ?? ""}`,
+		className: (state) => cx(alert_dialog_module_default.backdrop, resolveClassName(className, state)),
 		...props
 	});
 });
 const AlertDialogPopup = forwardRef(function AlertDialogPopup({ className, ...props }, ref) {
 	return /* @__PURE__ */ jsx(AlertDialog.Popup, {
 		ref,
-		className: `${alert_dialog_module_default.popup} ${className ?? ""}`,
+		className: (state) => cx(alert_dialog_module_default.popup, resolveClassName(className, state)),
 		...props
 	});
 });
 const AlertDialogTitle = forwardRef(function AlertDialogTitle({ className, ...props }, ref) {
 	return /* @__PURE__ */ jsx(AlertDialog.Title, {
 		ref,
-		className: `${alert_dialog_module_default.title} ${className ?? ""}`,
+		className: (state) => cx(alert_dialog_module_default.title, resolveClassName(className, state)),
 		...props
 	});
 });
 const AlertDialogDescription = forwardRef(function AlertDialogDescription({ className, ...props }, ref) {
 	return /* @__PURE__ */ jsx(AlertDialog.Description, {
 		ref,
-		className: `${alert_dialog_module_default.description} ${className ?? ""}`,
+		className: (state) => cx(alert_dialog_module_default.description, resolveClassName(className, state)),
 		...props
 	});
 });

package/dist/alert-dialog/parts.js.map

@@ -1 +1 @@
-{"version":3,"file":"parts.js","names":["BaseAlertDialog","styles"],"sources":["../../src/alert-dialog/parts.tsx"],"sourcesContent":["/**\n * Styled primitives for AlertDialog.\n *\n * @example\n * ```tsx\n * import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog';\n * import { Button } from '@brijbyte/agentic-ui/button';\n * import { AlertDialogBackdrop, AlertDialogPopup, AlertDialogTitle, AlertDialogDescription } from '@brijbyte/agentic-ui/alert-dialog';\n *\n * <BaseAlertDialog.Root>\n *   <BaseAlertDialog.Trigger render={<button>Open</button>} />\n *   <BaseAlertDialog.Portal>\n *     <AlertDialogBackdrop />\n *     <AlertDialogPopup>\n *       <AlertDialogTitle>Delete account?</AlertDialogTitle>\n *       <AlertDialogDescription>This cannot be undone.</AlertDialogDescription>\n *       <div>\n *         <BaseAlertDialog.Close render={<Button variant=\"soft\" tone=\"destructive\" size=\"sm\" />}>Delete</BaseAlertDialog.Close>\n *         <BaseAlertDialog.Close render={<Button variant=\"outline\" size=\"sm\" />}>Cancel</BaseAlertDialog.Close>\n *       </div>\n *     </AlertDialogPopup>\n *   </BaseAlertDialog.Portal>\n * </BaseAlertDialog.Root>\n * ```\n */\nimport { forwardRef } from \"react\";\nimport type { ComponentRef, ComponentPropsWithoutRef } from \"react\";\nimport { AlertDialog as BaseAlertDialog } from \"@base-ui/react/alert-dialog\";\nimport styles from \"./alert-dialog.module.css\";\n\ntype BaseBackdropProps = ComponentPropsWithoutRef<typeof BaseAlertDialog.Backdrop>;\ntype BasePopupProps = ComponentPropsWithoutRef<typeof BaseAlertDialog.Popup>;\ntype BaseTitleProps = ComponentPropsWithoutRef<typeof BaseAlertDialog.Title>;\ntype BaseDescriptionProps = ComponentPropsWithoutRef<typeof BaseAlertDialog.Description>;\n\nexport interface AlertDialogBackdropProps extends Omit<BaseBackdropProps, \"className\"> {\n  className?: string;\n}\nexport interface AlertDialogPopupProps extends Omit<BasePopupProps, \"className\"> {\n  className?: string;\n}\nexport interface AlertDialogTitleProps extends Omit<BaseTitleProps, \"className\"> {\n  className?: string;\n}\nexport interface AlertDialogDescriptionProps extends Omit<BaseDescriptionProps, \"className\"> {\n  className?: string;\n}\n\nexport const AlertDialogBackdrop = forwardRef<ComponentRef<typeof BaseAlertDialog.Backdrop>, AlertDialogBackdropProps>(\n  function AlertDialogBackdrop({ className, ...props }, ref) {\n    return <BaseAlertDialog.Backdrop ref={ref} className={`${styles.backdrop} ${className ?? \"\"}`} {...props} />;\n  },\n);\n\nexport const AlertDialogPopup = forwardRef<ComponentRef<typeof BaseAlertDialog.Popup>, AlertDialogPopupProps>(function AlertDialogPopup(\n  { className, ...props },\n  ref,\n) {\n  return <BaseAlertDialog.Popup ref={ref} className={`${styles.popup} ${className ?? \"\"}`} {...props} />;\n});\n\nexport const AlertDialogTitle = forwardRef<ComponentRef<typeof BaseAlertDialog.Title>, AlertDialogTitleProps>(function AlertDialogTitle(\n  { className, ...props },\n  ref,\n) {\n  return <BaseAlertDialog.Title ref={ref} className={`${styles.title} ${className ?? \"\"}`} {...props} />;\n});\n\nexport const AlertDialogDescription = forwardRef<ComponentRef<typeof BaseAlertDialog.Description>, AlertDialogDescriptionProps>(\n  function AlertDialogDescription({ className, ...props }, ref) {\n    return <BaseAlertDialog.Description ref={ref} className={`${styles.description} ${className ?? \"\"}`} {...props} />;\n  },\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgDA,MAAa,sBAAsB,WACjC,SAAS,oBAAoB,EAAE,WAAW,GAAG,SAAS,KAAK;AACzD,QAAO,oBAACA,YAAgB,UAAjB;EAA+B;EAAK,WAAW,GAAGC,4BAAO,SAAS,GAAG,aAAa;EAAM,GAAI;EAAS,CAAA;EAE/G;AAED,MAAa,mBAAmB,WAA8E,SAAS,iBACrH,EAAE,WAAW,GAAG,SAChB,KACA;AACA,QAAO,oBAACD,YAAgB,OAAjB;EAA4B;EAAK,WAAW,GAAGC,4BAAO,MAAM,GAAG,aAAa;EAAM,GAAI;EAAS,CAAA;EACtG;AAEF,MAAa,mBAAmB,WAA8E,SAAS,iBACrH,EAAE,WAAW,GAAG,SAChB,KACA;AACA,QAAO,oBAACD,YAAgB,OAAjB;EAA4B;EAAK,WAAW,GAAGC,4BAAO,MAAM,GAAG,aAAa;EAAM,GAAI;EAAS,CAAA;EACtG;AAEF,MAAa,yBAAyB,WACpC,SAAS,uBAAuB,EAAE,WAAW,GAAG,SAAS,KAAK;AAC5D,QAAO,oBAACD,YAAgB,aAAjB;EAAkC;EAAK,WAAW,GAAGC,4BAAO,YAAY,GAAG,aAAa;EAAM,GAAI;EAAS,CAAA;EAErH"}
+{"version":3,"file":"parts.js","names":["BaseAlertDialog","styles"],"sources":["../../src/alert-dialog/parts.tsx"],"sourcesContent":["/**\n * Styled primitives for AlertDialog.\n *\n * @example\n * ```tsx\n * import { AlertDialog } from '@base-ui/react/alert-dialog';\n * import { AlertDialogBackdrop, AlertDialogPopup, AlertDialogTitle, AlertDialogDescription } from '@brijbyte/agentic-ui/alert-dialog';\n *\n * <AlertDialog.Root>\n *   <AlertDialog.Trigger render={<button>Open</button>} />\n *   <AlertDialog.Portal>\n *     <AlertDialogBackdrop />\n *     <AlertDialog.Viewport>\n *       <AlertDialogPopup>\n *         <AlertDialogTitle>Confirm</AlertDialogTitle>\n *         <AlertDialogDescription>Are you sure?</AlertDialogDescription>\n *       </AlertDialogPopup>\n *     </AlertDialog.Viewport>\n *   </AlertDialog.Portal>\n * </AlertDialog.Root>\n * ```\n */\nimport { forwardRef } from \"react\";\nimport type { ComponentRef, ComponentPropsWithoutRef } from \"react\";\nimport { AlertDialog as BaseAlertDialog } from \"@base-ui/react/alert-dialog\";\nimport styles from \"./alert-dialog.module.css\";\nimport { resolveClassName, cx } from \"../utils/resolveClassName\";\n\ntype BaseBackdropProps = ComponentPropsWithoutRef<typeof BaseAlertDialog.Backdrop>;\ntype BasePopupProps = ComponentPropsWithoutRef<typeof BaseAlertDialog.Popup>;\ntype BaseTitleProps = ComponentPropsWithoutRef<typeof BaseAlertDialog.Title>;\ntype BaseDescriptionProps = ComponentPropsWithoutRef<typeof BaseAlertDialog.Description>;\n\nexport interface AlertDialogBackdropProps extends BaseBackdropProps {}\nexport interface AlertDialogPopupProps extends BasePopupProps {}\nexport interface AlertDialogTitleProps extends BaseTitleProps {}\nexport interface AlertDialogDescriptionProps extends BaseDescriptionProps {}\n\nexport const AlertDialogBackdrop = forwardRef<ComponentRef<typeof BaseAlertDialog.Backdrop>, AlertDialogBackdropProps>(\n  function AlertDialogBackdrop({ className, ...props }, ref) {\n    return <BaseAlertDialog.Backdrop ref={ref} className={(state) => cx(styles.backdrop, resolveClassName(className, state))} {...props} />;\n  },\n);\n\nexport const AlertDialogPopup = forwardRef<ComponentRef<typeof BaseAlertDialog.Popup>, AlertDialogPopupProps>(function AlertDialogPopup(\n  { className, ...props },\n  ref,\n) {\n  return <BaseAlertDialog.Popup ref={ref} className={(state) => cx(styles.popup, resolveClassName(className, state))} {...props} />;\n});\n\nexport const AlertDialogTitle = forwardRef<ComponentRef<typeof BaseAlertDialog.Title>, AlertDialogTitleProps>(function AlertDialogTitle(\n  { className, ...props },\n  ref,\n) {\n  return <BaseAlertDialog.Title ref={ref} className={(state) => cx(styles.title, resolveClassName(className, state))} {...props} />;\n});\n\nexport const AlertDialogDescription = forwardRef<ComponentRef<typeof BaseAlertDialog.Description>, AlertDialogDescriptionProps>(\n  function AlertDialogDescription({ className, ...props }, ref) {\n    return (\n      <BaseAlertDialog.Description ref={ref} className={(state) => cx(styles.description, resolveClassName(className, state))} {...props} />\n    );\n  },\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsCA,MAAa,sBAAsB,WACjC,SAAS,oBAAoB,EAAE,WAAW,GAAG,SAAS,KAAK;AACzD,QAAO,oBAACA,YAAgB,UAAjB;EAA+B;EAAK,YAAY,UAAU,GAAGC,4BAAO,UAAU,iBAAiB,WAAW,MAAM,CAAC;EAAE,GAAI;EAAS,CAAA;EAE1I;AAED,MAAa,mBAAmB,WAA8E,SAAS,iBACrH,EAAE,WAAW,GAAG,SAChB,KACA;AACA,QAAO,oBAACD,YAAgB,OAAjB;EAA4B;EAAK,YAAY,UAAU,GAAGC,4BAAO,OAAO,iBAAiB,WAAW,MAAM,CAAC;EAAE,GAAI;EAAS,CAAA;EACjI;AAEF,MAAa,mBAAmB,WAA8E,SAAS,iBACrH,EAAE,WAAW,GAAG,SAChB,KACA;AACA,QAAO,oBAACD,YAAgB,OAAjB;EAA4B;EAAK,YAAY,UAAU,GAAGC,4BAAO,OAAO,iBAAiB,WAAW,MAAM,CAAC;EAAE,GAAI;EAAS,CAAA;EACjI;AAEF,MAAa,yBAAyB,WACpC,SAAS,uBAAuB,EAAE,WAAW,GAAG,SAAS,KAAK;AAC5D,QACE,oBAACD,YAAgB,aAAjB;EAAkC;EAAK,YAAY,UAAU,GAAGC,4BAAO,aAAa,iBAAiB,WAAW,MAAM,CAAC;EAAE,GAAI;EAAS,CAAA;EAG3I"}

package/dist/badge/badge.d.ts

@@ -5,9 +5,15 @@ import styles from "./badge.module.css";
 //#region src/badge/badge.d.ts
 type BadgeVariant = "default" | "solid" | "soft" | "success" | "warning" | "error" | "info";
 interface BadgeProps extends ComponentPropsWithoutRef<"span"> {
+  /** Visual style and semantic colour. @default "default" */
   variant?: BadgeVariant;
+  /** Show a small coloured dot indicator before the label. */
   dot?: boolean;
 }
+/**
+ * Compact label for status, counts, and categories. A plain styled `<span>` —
+ * no base-ui dependency.
+ */
 declare function Badge({
   variant,
   dot,

package/dist/badge/badge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"badge.d.ts","names":[],"sources":["../../src/badge/badge.tsx"],"mappings":";;;;;KAGY,YAAA;AAAA,UAEK,UAAA,SAAmB,wBAAA;EAClC,OAAA,GAAU,YAAA;EACV,GAAA;AAAA;AAAA,iBAGc,KAAA,CAAA;EAAQ,OAAA;EAAqB,GAAA;EAAa,SAAA;EAAW,QAAA;EAAA,GAAa;AAAA,GAAS,UAAA,GAAU,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"badge.d.ts","names":[],"sources":["../../src/badge/badge.tsx"],"mappings":";;;;;KAGY,YAAA;AAAA,UAEK,UAAA,SAAmB,wBAAA;;EAElC,OAAA,GAAU,YAAA;EAJY;EAMtB,GAAA;AAAA;;AAJF;;;iBAWgB,KAAA,CAAA;EAAQ,OAAA;EAAqB,GAAA;EAAa,SAAA;EAAW,QAAA;EAAA,GAAa;AAAA,GAAS,UAAA,GAAU,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/badge/badge.js

@@ -1,6 +1,10 @@
 import badge_module_default from "./badge.module.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/badge/badge.tsx
+/**
+* Compact label for status, counts, and categories. A plain styled `<span>` —
+* no base-ui dependency.
+*/
 function Badge({ variant = "default", dot = false, className, children, ...props }) {
 	return /* @__PURE__ */ jsxs("span", {
 		className: [

package/dist/badge/badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"badge.js","names":["styles"],"sources":["../../src/badge/badge.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef } from \"react\";\nimport styles from \"./badge.module.css\";\n\nexport type BadgeVariant = \"default\" | \"solid\" | \"soft\" | \"success\" | \"warning\" | \"error\" | \"info\";\n\nexport interface BadgeProps extends ComponentPropsWithoutRef<\"span\"> {\n  variant?: BadgeVariant;\n  dot?: boolean;\n}\n\nexport function Badge({ variant = \"default\", dot = false, className, children, ...props }: BadgeProps) {\n  return (\n    <span className={[styles.root, styles[`variant-${variant}`], className ?? \"\"].filter(Boolean).join(\" \")} {...props}>\n      {dot && <span className={styles.dot} aria-hidden=\"true\" />}\n      {children}\n    </span>\n  );\n}\nexport { styles as BadgeStyles };\n"],"mappings":";;;AAUA,SAAgB,MAAM,EAAE,UAAU,WAAW,MAAM,OAAO,WAAW,UAAU,GAAG,SAAqB;AACrG,QACE,qBAAC,QAAD;EAAM,WAAW;GAACA,qBAAO;GAAMA,qBAAO,WAAW;GAAY,aAAa;GAAG,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;EAAE,GAAI;YAA7G,CACG,OAAO,oBAAC,QAAD;GAAM,WAAWA,qBAAO;GAAK,eAAY;GAAS,CAAA,EACzD,SACI"}
+{"version":3,"file":"badge.js","names":["styles"],"sources":["../../src/badge/badge.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef } from \"react\";\nimport styles from \"./badge.module.css\";\n\nexport type BadgeVariant = \"default\" | \"solid\" | \"soft\" | \"success\" | \"warning\" | \"error\" | \"info\";\n\nexport interface BadgeProps extends ComponentPropsWithoutRef<\"span\"> {\n  /** Visual style and semantic colour. @default \"default\" */\n  variant?: BadgeVariant;\n  /** Show a small coloured dot indicator before the label. */\n  dot?: boolean;\n}\n\n/**\n * Compact label for status, counts, and categories. A plain styled `<span>` —\n * no base-ui dependency.\n */\nexport function Badge({ variant = \"default\", dot = false, className, children, ...props }: BadgeProps) {\n  return (\n    <span className={[styles.root, styles[`variant-${variant}`], className ?? \"\"].filter(Boolean).join(\" \")} {...props}>\n      {dot && <span className={styles.dot} aria-hidden=\"true\" />}\n      {children}\n    </span>\n  );\n}\nexport { styles as BadgeStyles };\n"],"mappings":";;;;;;;AAgBA,SAAgB,MAAM,EAAE,UAAU,WAAW,MAAM,OAAO,WAAW,UAAU,GAAG,SAAqB;AACrG,QACE,qBAAC,QAAD;EAAM,WAAW;GAACA,qBAAO;GAAMA,qBAAO,WAAW;GAAY,aAAa;GAAG,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;EAAE,GAAI;YAA7G,CACG,OAAO,oBAAC,QAAD;GAAM,WAAWA,qBAAO;GAAK,eAAY;GAAS,CAAA,EACzD,SACI"}

package/dist/button/button.d.ts

@@ -7,10 +7,13 @@ type ButtonVariant = "solid" | "soft" | "outline" | "ghost";
 type ButtonTone = "primary" | "secondary" | "destructive" | "success" | "warning";
 type ButtonSize = "xs" | "sm" | "md" | "lg";
 interface ButtonProps extends ComponentPropsWithoutRef<"button"> {
+  /** Visual shape — filled, tinted, outlined, or borderless. @default "solid" */
   variant?: ButtonVariant;
-  /** Semantic color. Defaults to "primary". */
+  /** Semantic colour. @default "primary" */
   tone?: ButtonTone | undefined;
+  /** Controls padding and font size. @default "md" */
   size?: ButtonSize | undefined;
+  /** Shows a spinner overlay and disables interaction. */
   loading?: boolean | undefined;
   /**
    * Text shown in place of children while loading.
@@ -18,10 +21,18 @@ interface ButtonProps extends ComponentPropsWithoutRef<"button"> {
    * When omitted, children stay rendered invisibly — width stays stable.
    */
   loadingText?: string | undefined;
+  /** Renders as a square button with equal padding on all sides. */
   iconOnly?: boolean | undefined;
+  /** Custom render element forwarded to base-ui Button. */
   render?: ReactElement | undefined;
+  /** Use a native `<button>` element. @default true */
   nativeButton?: boolean | undefined;
 }
+/**
+ * Pressable button with multiple variants, tones, and sizes. Composes
+ * `@base-ui/react` Button with focus management and disabled-while-loading.
+ * Supports a spinner overlay that preserves button width.
+ */
 declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLButtonElement>>;
 //#endregion
 export { Button, ButtonProps, ButtonSize, ButtonTone, ButtonVariant, styles };

package/dist/button/button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","names":[],"sources":["../../src/button/button.tsx"],"mappings":";;;;;KAKY,aAAA;AAAA,KACA,UAAA;AAAA,KACA,UAAA;AAAA,UAEK,WAAA,SAAoB,wBAAA;EACnC,OAAA,GAAU,aAAA;;EAEV,IAAA,GAAO,UAAA;EACP,IAAA,GAAO,UAAA;EACP,OAAA;EARoB;;;;AACtB;EAaE,WAAA;EACA,QAAA;EACA,MAAA,GAAS,YAAA;EACT,YAAA;AAAA;AAAA,cAGW,MAAA,EAAM,KAAA,CAAA,yBAAA,CAAA,WAAA,GAAA,KAAA,CAAA,aAAA,CAAA,iBAAA"}
+{"version":3,"file":"button.d.ts","names":[],"sources":["../../src/button/button.tsx"],"mappings":";;;;;KAKY,aAAA;AAAA,KACA,UAAA;AAAA,KACA,UAAA;AAAA,UAEK,WAAA,SAAoB,wBAAA;EAJZ;EAMvB,OAAA,GAAU,aAAA;EANa;EAQvB,IAAA,GAAO,UAAA;EAPG;EASV,IAAA,GAAO,UAAA;;EAEP,OAAA;EAXoB;AACtB;;;;EAgBE,WAAA;EAde;EAgBf,QAAA;;EAEA,MAAA,GAAS,YAAA;EAdF;EAgBP,YAAA;AAAA;;;;;;cAQW,MAAA,EAAM,KAAA,CAAA,yBAAA,CAAA,WAAA,GAAA,KAAA,CAAA,aAAA,CAAA,iBAAA"}

package/dist/button/button.js

@@ -3,6 +3,11 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { Button } from "@base-ui/react/button";
 //#region src/button/button.tsx
+/**
+* Pressable button with multiple variants, tones, and sizes. Composes
+* `@base-ui/react` Button with focus management and disabled-while-loading.
+* Supports a spinner overlay that preserves button width.
+*/
 const Button$1 = forwardRef(function Button$2({ variant = "solid", tone = "primary", size = "md", loading = false, loadingText, iconOnly = false, nativeButton = true, disabled, className, children, render, ...props }, ref) {
 	return /* @__PURE__ */ jsxs(Button, {
 		ref,

package/dist/button/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","names":["Button","BaseButton","styles"],"sources":["../../src/button/button.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ReactElement } from \"react\";\nimport { Button as BaseButton } from \"@base-ui/react/button\";\nimport styles from \"./button.module.css\";\n\nexport type ButtonVariant = \"solid\" | \"soft\" | \"outline\" | \"ghost\";\nexport type ButtonTone = \"primary\" | \"secondary\" | \"destructive\" | \"success\" | \"warning\";\nexport type ButtonSize = \"xs\" | \"sm\" | \"md\" | \"lg\";\n\nexport interface ButtonProps extends ComponentPropsWithoutRef<\"button\"> {\n  variant?: ButtonVariant;\n  /** Semantic color. Defaults to \"primary\". */\n  tone?: ButtonTone | undefined;\n  size?: ButtonSize | undefined;\n  loading?: boolean | undefined;\n  /**\n   * Text shown in place of children while loading.\n   * When provided the button width adapts to this text (variable width).\n   * When omitted, children stay rendered invisibly — width stays stable.\n   */\n  loadingText?: string | undefined;\n  iconOnly?: boolean | undefined;\n  render?: ReactElement | undefined;\n  nativeButton?: boolean | undefined;\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(function Button(\n  {\n    variant = \"solid\",\n    tone = \"primary\",\n    size = \"md\",\n    loading = false,\n    loadingText,\n    iconOnly = false,\n    nativeButton = true,\n    disabled,\n    className,\n    children,\n    render,\n    ...props\n  },\n  ref,\n) {\n  const classes = [\n    styles.root,\n    styles[`variant-${variant}`],\n    styles[`tone-${tone}`],\n    styles[`size-${size}`],\n    iconOnly ? styles[\"icon-only\"] : \"\",\n    className ?? \"\",\n  ]\n    .filter(Boolean)\n    .join(\" \");\n\n  return (\n    <BaseButton ref={ref} className={classes} disabled={disabled ?? loading} render={render} nativeButton={nativeButton} {...props}>\n      <span className={`${styles.loader} ${loading && !loadingText ? styles[\"loader-visible\"] : \"\"}`} aria-hidden=\"true\">\n        <span className={styles.spinner} />\n      </span>\n      <span className={loading && !loadingText ? styles[\"content-loading\"] : undefined}>\n        {loading && loadingText ? loadingText : children}\n      </span>\n    </BaseButton>\n  );\n});\n\nexport { styles as ButtonStyles };\n"],"mappings":";;;;;AA0BA,MAAaA,WAAS,WAA2C,SAASA,SACxE,EACE,UAAU,SACV,OAAO,WACP,OAAO,MACP,UAAU,OACV,aACA,WAAW,OACX,eAAe,MACf,UACA,WACA,UACA,QACA,GAAG,SAEL,KACA;AAYA,QACE,qBAACC,QAAD;EAAiB;EAAK,WAZR;GACdC,sBAAO;GACPA,sBAAO,WAAW;GAClBA,sBAAO,QAAQ;GACfA,sBAAO,QAAQ;GACf,WAAWA,sBAAO,eAAe;GACjC,aAAa;GACd,CACE,OAAO,QAAQ,CACf,KAAK,IAAI;EAGgC,UAAU,YAAY;EAAiB;EAAsB;EAAc,GAAI;YAAzH,CACE,oBAAC,QAAD;GAAM,WAAW,GAAGA,sBAAO,OAAO,GAAG,WAAW,CAAC,cAAcA,sBAAO,oBAAoB;GAAM,eAAY;aAC1G,oBAAC,QAAD,EAAM,WAAWA,sBAAO,SAAW,CAAA;GAC9B,CAAA,EACP,oBAAC,QAAD;GAAM,WAAW,WAAW,CAAC,cAAcA,sBAAO,qBAAqB,KAAA;aACpE,WAAW,cAAc,cAAc;GACnC,CAAA,CACI;;EAEf"}
+{"version":3,"file":"button.js","names":["Button","BaseButton","styles"],"sources":["../../src/button/button.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ReactElement } from \"react\";\nimport { Button as BaseButton } from \"@base-ui/react/button\";\nimport styles from \"./button.module.css\";\n\nexport type ButtonVariant = \"solid\" | \"soft\" | \"outline\" | \"ghost\";\nexport type ButtonTone = \"primary\" | \"secondary\" | \"destructive\" | \"success\" | \"warning\";\nexport type ButtonSize = \"xs\" | \"sm\" | \"md\" | \"lg\";\n\nexport interface ButtonProps extends ComponentPropsWithoutRef<\"button\"> {\n  /** Visual shape — filled, tinted, outlined, or borderless. @default \"solid\" */\n  variant?: ButtonVariant;\n  /** Semantic colour. @default \"primary\" */\n  tone?: ButtonTone | undefined;\n  /** Controls padding and font size. @default \"md\" */\n  size?: ButtonSize | undefined;\n  /** Shows a spinner overlay and disables interaction. */\n  loading?: boolean | undefined;\n  /**\n   * Text shown in place of children while loading.\n   * When provided the button width adapts to this text (variable width).\n   * When omitted, children stay rendered invisibly — width stays stable.\n   */\n  loadingText?: string | undefined;\n  /** Renders as a square button with equal padding on all sides. */\n  iconOnly?: boolean | undefined;\n  /** Custom render element forwarded to base-ui Button. */\n  render?: ReactElement | undefined;\n  /** Use a native `<button>` element. @default true */\n  nativeButton?: boolean | undefined;\n}\n\n/**\n * Pressable button with multiple variants, tones, and sizes. Composes\n * `@base-ui/react` Button with focus management and disabled-while-loading.\n * Supports a spinner overlay that preserves button width.\n */\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(function Button(\n  {\n    variant = \"solid\",\n    tone = \"primary\",\n    size = \"md\",\n    loading = false,\n    loadingText,\n    iconOnly = false,\n    nativeButton = true,\n    disabled,\n    className,\n    children,\n    render,\n    ...props\n  },\n  ref,\n) {\n  const classes = [\n    styles.root,\n    styles[`variant-${variant}`],\n    styles[`tone-${tone}`],\n    styles[`size-${size}`],\n    iconOnly ? styles[\"icon-only\"] : \"\",\n    className ?? \"\",\n  ]\n    .filter(Boolean)\n    .join(\" \");\n\n  return (\n    <BaseButton ref={ref} className={classes} disabled={disabled ?? loading} render={render} nativeButton={nativeButton} {...props}>\n      <span className={`${styles.loader} ${loading && !loadingText ? styles[\"loader-visible\"] : \"\"}`} aria-hidden=\"true\">\n        <span className={styles.spinner} />\n      </span>\n      <span className={loading && !loadingText ? styles[\"content-loading\"] : undefined}>\n        {loading && loadingText ? loadingText : children}\n      </span>\n    </BaseButton>\n  );\n});\n\nexport { styles as ButtonStyles };\n"],"mappings":";;;;;;;;;;AAqCA,MAAaA,WAAS,WAA2C,SAASA,SACxE,EACE,UAAU,SACV,OAAO,WACP,OAAO,MACP,UAAU,OACV,aACA,WAAW,OACX,eAAe,MACf,UACA,WACA,UACA,QACA,GAAG,SAEL,KACA;AAYA,QACE,qBAACC,QAAD;EAAiB;EAAK,WAZR;GACdC,sBAAO;GACPA,sBAAO,WAAW;GAClBA,sBAAO,QAAQ;GACfA,sBAAO,QAAQ;GACf,WAAWA,sBAAO,eAAe;GACjC,aAAa;GACd,CACE,OAAO,QAAQ,CACf,KAAK,IAAI;EAGgC,UAAU,YAAY;EAAiB;EAAsB;EAAc,GAAI;YAAzH,CACE,oBAAC,QAAD;GAAM,WAAW,GAAGA,sBAAO,OAAO,GAAG,WAAW,CAAC,cAAcA,sBAAO,oBAAoB;GAAM,eAAY;aAC1G,oBAAC,QAAD,EAAM,WAAWA,sBAAO,SAAW,CAAA;GAC9B,CAAA,EACP,oBAAC,QAAD;GAAM,WAAW,WAAW,CAAC,cAAcA,sBAAO,qBAAqB,KAAA;aACpE,WAAW,cAAc,cAAc;GACnC,CAAA,CACI;;EAEf"}

package/dist/card/card.d.ts

@@ -4,14 +4,21 @@ import styles from "./card.module.css";
 
 //#region src/card/card.d.ts
 interface CardProps extends ComponentPropsWithoutRef<"div"> {
+  /** Apply a raised shadow for layered surfaces. */
   elevated?: boolean;
+  /** Add hover/active states for clickable cards. */
   interactive?: boolean;
 }
 interface CardHeaderProps extends Omit<ComponentPropsWithoutRef<"div">, "title"> {
   /** Card heading rendered in the header area. */
   heading?: ReactNode;
+  /** Secondary text below the heading. */
   description?: ReactNode;
 }
+/**
+ * Surface container with optional header, body, and footer slots.
+ * Pure HTML — no base-ui dependency.
+ */
 declare function Card({
   elevated,
   interactive,
@@ -19,6 +26,7 @@ declare function Card({
   children,
   ...props
 }: CardProps): react_jsx_runtime0.JSX.Element;
+/** Header area with optional heading and description. */
 declare function CardHeader({
   heading,
   description,
@@ -26,11 +34,13 @@ declare function CardHeader({
   children,
   ...props
 }: CardHeaderProps): react_jsx_runtime0.JSX.Element;
+/** Padded body content area. */
 declare function CardBody({
   className,
   children,
   ...props
 }: ComponentPropsWithoutRef<"div">): react_jsx_runtime0.JSX.Element;
+/** Footer area, typically used for actions. */
 declare function CardFooter({
   className,
   children,

package/dist/card/card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"card.d.ts","names":[],"sources":["../../src/card/card.tsx"],"mappings":";;;;;UAGiB,SAAA,SAAkB,wBAAA;EACjC,QAAA;EACA,WAAA;AAAA;AAAA,UAIe,eAAA,SAAwB,IAAA,CAAK,wBAAA;;EAE5C,OAAA,GAAU,SAAA;EACV,WAAA,GAAc,SAAA;AAAA;AAAA,iBAGA,IAAA,CAAA;EAAO,QAAA;EAAU,WAAA;EAAa,SAAA;EAAW,QAAA;EAAA,GAAa;AAAA,GAAS,SAAA,GAAS,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAaxE,UAAA,CAAA;EAAa,OAAA;EAAS,WAAA;EAAa,SAAA;EAAW,QAAA;EAAA,GAAa;AAAA,GAAS,eAAA,GAAe,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAUnF,QAAA,CAAA;EAAW,SAAA;EAAW,QAAA;EAAA,GAAa;AAAA,GAAS,wBAAA,UAA+B,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAQ3E,UAAA,CAAA;EAAa,SAAA;EAAW,QAAA;EAAA,GAAa;AAAA,GAAS,wBAAA,UAA+B,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"card.d.ts","names":[],"sources":["../../src/card/card.tsx"],"mappings":";;;;;UAGiB,SAAA,SAAkB,wBAAA;;EAEjC,QAAA;EAFe;EAIf,WAAA;AAAA;AAAA,UAIe,eAAA,SAAwB,IAAA,CAAK,wBAAA;EARX;EAUjC,OAAA,GAAU,SAAA;EANV;EAQA,WAAA,GAAc,SAAA;AAAA;AAJhB;;;;AAAA,iBAWgB,IAAA,CAAA;EAAO,QAAA;EAAU,WAAA;EAAa,SAAA;EAAW,QAAA;EAAA,GAAa;AAAA,GAAS,SAAA,GAAS,kBAAA,CAAA,GAAA,CAAA,OAAA;;iBAcxE,UAAA,CAAA;EAAa,OAAA;EAAS,WAAA;EAAa,SAAA;EAAW,QAAA;EAAA,GAAa;AAAA,GAAS,eAAA,GAAe,kBAAA,CAAA,GAAA,CAAA,OAAA;;iBAWnF,QAAA,CAAA;EAAW,SAAA;EAAW,QAAA;EAAA,GAAa;AAAA,GAAS,wBAAA,UAA+B,kBAAA,CAAA,GAAA,CAAA,OAAA;;iBAS3E,UAAA,CAAA;EAAa,SAAA;EAAW,QAAA;EAAA,GAAa;AAAA,GAAS,wBAAA,UAA+B,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/card/card.js

@@ -1,6 +1,10 @@
 import card_module_default from "./card.module.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/card/card.tsx
+/**
+* Surface container with optional header, body, and footer slots.
+* Pure HTML — no base-ui dependency.
+*/
 function Card({ elevated, interactive, className, children, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		className: [
@@ -13,6 +17,7 @@ function Card({ elevated, interactive, className, children, ...props }) {
 		children
 	});
 }
+/** Header area with optional heading and description. */
 function CardHeader({ heading, description, className, children, ...props }) {
 	return /* @__PURE__ */ jsxs("div", {
 		className: `${card_module_default.header} ${className ?? ""}`,
@@ -30,6 +35,7 @@ function CardHeader({ heading, description, className, children, ...props }) {
 		]
 	});
 }
+/** Padded body content area. */
 function CardBody({ className, children, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		className: `${card_module_default.body} ${className ?? ""}`,
@@ -37,6 +43,7 @@ function CardBody({ className, children, ...props }) {
 		children
 	});
 }
+/** Footer area, typically used for actions. */
 function CardFooter({ className, children, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		className: `${card_module_default.footer} ${className ?? ""}`,

package/dist/card/card.js.map

@@ -1 +1 @@
-{"version":3,"file":"card.js","names":["styles"],"sources":["../../src/card/card.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, ReactNode } from \"react\";\nimport styles from \"./card.module.css\";\n\nexport interface CardProps extends ComponentPropsWithoutRef<\"div\"> {\n  elevated?: boolean;\n  interactive?: boolean;\n}\n\n// Omit `title` (HTML string attr) so we can accept ReactNode as `heading`\nexport interface CardHeaderProps extends Omit<ComponentPropsWithoutRef<\"div\">, \"title\"> {\n  /** Card heading rendered in the header area. */\n  heading?: ReactNode;\n  description?: ReactNode;\n}\n\nexport function Card({ elevated, interactive, className, children, ...props }: CardProps) {\n  return (\n    <div\n      className={[styles.root, elevated ? styles[\"root-elevated\"] : \"\", interactive ? styles[\"root-interactive\"] : \"\", className ?? \"\"]\n        .filter(Boolean)\n        .join(\" \")}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n\nexport function CardHeader({ heading, description, className, children, ...props }: CardHeaderProps) {\n  return (\n    <div className={`${styles.header} ${className ?? \"\"}`} {...props}>\n      {heading && <span className={styles.title}>{heading}</span>}\n      {description && <span className={styles.description}>{description}</span>}\n      {children}\n    </div>\n  );\n}\n\nexport function CardBody({ className, children, ...props }: ComponentPropsWithoutRef<\"div\">) {\n  return (\n    <div className={`${styles.body} ${className ?? \"\"}`} {...props}>\n      {children}\n    </div>\n  );\n}\n\nexport function CardFooter({ className, children, ...props }: ComponentPropsWithoutRef<\"div\">) {\n  return (\n    <div className={`${styles.footer} ${className ?? \"\"}`} {...props}>\n      {children}\n    </div>\n  );\n}\nexport { styles as CardStyles };\n"],"mappings":";;;AAeA,SAAgB,KAAK,EAAE,UAAU,aAAa,WAAW,UAAU,GAAG,SAAoB;AACxF,QACE,oBAAC,OAAD;EACE,WAAW;GAACA,oBAAO;GAAM,WAAWA,oBAAO,mBAAmB;GAAI,cAAcA,oBAAO,sBAAsB;GAAI,aAAa;GAAG,CAC9H,OAAO,QAAQ,CACf,KAAK,IAAI;EACZ,GAAI;EAEH;EACG,CAAA;;AAIV,SAAgB,WAAW,EAAE,SAAS,aAAa,WAAW,UAAU,GAAG,SAA0B;AACnG,QACE,qBAAC,OAAD;EAAK,WAAW,GAAGA,oBAAO,OAAO,GAAG,aAAa;EAAM,GAAI;YAA3D;GACG,WAAW,oBAAC,QAAD;IAAM,WAAWA,oBAAO;cAAQ;IAAe,CAAA;GAC1D,eAAe,oBAAC,QAAD;IAAM,WAAWA,oBAAO;cAAc;IAAmB,CAAA;GACxE;GACG;;;AAIV,SAAgB,SAAS,EAAE,WAAW,UAAU,GAAG,SAA0C;AAC3F,QACE,oBAAC,OAAD;EAAK,WAAW,GAAGA,oBAAO,KAAK,GAAG,aAAa;EAAM,GAAI;EACtD;EACG,CAAA;;AAIV,SAAgB,WAAW,EAAE,WAAW,UAAU,GAAG,SAA0C;AAC7F,QACE,oBAAC,OAAD;EAAK,WAAW,GAAGA,oBAAO,OAAO,GAAG,aAAa;EAAM,GAAI;EACxD;EACG,CAAA"}
+{"version":3,"file":"card.js","names":["styles"],"sources":["../../src/card/card.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, ReactNode } from \"react\";\nimport styles from \"./card.module.css\";\n\nexport interface CardProps extends ComponentPropsWithoutRef<\"div\"> {\n  /** Apply a raised shadow for layered surfaces. */\n  elevated?: boolean;\n  /** Add hover/active states for clickable cards. */\n  interactive?: boolean;\n}\n\n// Omit `title` (HTML string attr) so we can accept ReactNode as `heading`\nexport interface CardHeaderProps extends Omit<ComponentPropsWithoutRef<\"div\">, \"title\"> {\n  /** Card heading rendered in the header area. */\n  heading?: ReactNode;\n  /** Secondary text below the heading. */\n  description?: ReactNode;\n}\n\n/**\n * Surface container with optional header, body, and footer slots.\n * Pure HTML — no base-ui dependency.\n */\nexport function Card({ elevated, interactive, className, children, ...props }: CardProps) {\n  return (\n    <div\n      className={[styles.root, elevated ? styles[\"root-elevated\"] : \"\", interactive ? styles[\"root-interactive\"] : \"\", className ?? \"\"]\n        .filter(Boolean)\n        .join(\" \")}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n\n/** Header area with optional heading and description. */\nexport function CardHeader({ heading, description, className, children, ...props }: CardHeaderProps) {\n  return (\n    <div className={`${styles.header} ${className ?? \"\"}`} {...props}>\n      {heading && <span className={styles.title}>{heading}</span>}\n      {description && <span className={styles.description}>{description}</span>}\n      {children}\n    </div>\n  );\n}\n\n/** Padded body content area. */\nexport function CardBody({ className, children, ...props }: ComponentPropsWithoutRef<\"div\">) {\n  return (\n    <div className={`${styles.body} ${className ?? \"\"}`} {...props}>\n      {children}\n    </div>\n  );\n}\n\n/** Footer area, typically used for actions. */\nexport function CardFooter({ className, children, ...props }: ComponentPropsWithoutRef<\"div\">) {\n  return (\n    <div className={`${styles.footer} ${className ?? \"\"}`} {...props}>\n      {children}\n    </div>\n  );\n}\nexport { styles as CardStyles };\n"],"mappings":";;;;;;;AAsBA,SAAgB,KAAK,EAAE,UAAU,aAAa,WAAW,UAAU,GAAG,SAAoB;AACxF,QACE,oBAAC,OAAD;EACE,WAAW;GAACA,oBAAO;GAAM,WAAWA,oBAAO,mBAAmB;GAAI,cAAcA,oBAAO,sBAAsB;GAAI,aAAa;GAAG,CAC9H,OAAO,QAAQ,CACf,KAAK,IAAI;EACZ,GAAI;EAEH;EACG,CAAA;;;AAKV,SAAgB,WAAW,EAAE,SAAS,aAAa,WAAW,UAAU,GAAG,SAA0B;AACnG,QACE,qBAAC,OAAD;EAAK,WAAW,GAAGA,oBAAO,OAAO,GAAG,aAAa;EAAM,GAAI;YAA3D;GACG,WAAW,oBAAC,QAAD;IAAM,WAAWA,oBAAO;cAAQ;IAAe,CAAA;GAC1D,eAAe,oBAAC,QAAD;IAAM,WAAWA,oBAAO;cAAc;IAAmB,CAAA;GACxE;GACG;;;;AAKV,SAAgB,SAAS,EAAE,WAAW,UAAU,GAAG,SAA0C;AAC3F,QACE,oBAAC,OAAD;EAAK,WAAW,GAAGA,oBAAO,KAAK,GAAG,aAAa;EAAM,GAAI;EACtD;EACG,CAAA;;;AAKV,SAAgB,WAAW,EAAE,WAAW,UAAU,GAAG,SAA0C;AAC7F,QACE,oBAAC,OAAD;EAAK,WAAW,GAAGA,oBAAO,OAAO,GAAG,aAAa;EAAM,GAAI;EACxD;EACG,CAAA"}

package/dist/checkbox/checkbox.d.ts

@@ -4,19 +4,32 @@ import styles from "./checkbox.module.css";
 
 //#region src/checkbox/checkbox.d.ts
 interface CheckboxProps {
+  /** Controlled checked state. */
   checked?: boolean;
+  /** Initial checked state (uncontrolled). */
   defaultChecked?: boolean;
+  /** Display a horizontal dash instead of a checkmark. */
   indeterminate?: boolean;
+  /** Prevent interaction and dim the checkbox. */
   disabled?: boolean;
+  /** Mark the field as required for form validation. */
   required?: boolean;
+  /** HTML name attribute for form submission. */
   name?: string;
+  /** HTML value attribute for form submission. */
   value?: string;
   /** Called when checked state changes. `eventDetails` is the base-ui event details object. */
   onCheckedChange?: (checked: boolean, eventDetails: unknown) => void;
+  /** Label content rendered next to the checkbox. */
   children?: ReactNode;
+  /** Override the auto-generated element id. */
   id?: string;
   className?: string;
 }
+/**
+ * Boolean selection with an accessible label. Wraps `@base-ui/react` Checkbox
+ * with a styled indicator, check icon, and label layout.
+ */
 declare function Checkbox({
   children,
   id,

package/dist/checkbox/checkbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.d.ts","names":[],"sources":["../../src/checkbox/checkbox.tsx"],"mappings":";;;;;UAKiB,aAAA;EACf,OAAA;EACA,cAAA;EACA,aAAA;EACA,QAAA;EACA,QAAA;EACA,IAAA;EACA,KAAA;EALA;EAOA,eAAA,IAAmB,OAAA,WAAkB,YAAA;EACrC,QAAA,GAAW,SAAA;EACX,EAAA;EACA,SAAA;AAAA;AAAA,iBAGc,QAAA,CAAA;EAAW,QAAA;EAAU,EAAA;EAAI,SAAA;EAAW,eAAA;EAAA,GAAoB;AAAA,GAAS,aAAA,GAAa,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"checkbox.d.ts","names":[],"sources":["../../src/checkbox/checkbox.tsx"],"mappings":";;;;;UAKiB,aAAA;;EAEf,OAAA;EAFe;EAIf,cAAA;;EAEA,aAAA;EAJA;EAMA,QAAA;EAFA;EAIA,QAAA;EAAA;EAEA,IAAA;EAEA;EAAA,KAAA;EAEmB;EAAnB,eAAA,IAAmB,OAAA,WAAkB,YAAA;EAErC;EAAA,QAAA,GAAW,SAAA;EAEX;EAAA,EAAA;EACA,SAAA;AAAA;AAOF;;;;AAAA,iBAAgB,QAAA,CAAA;EAAW,QAAA;EAAU,EAAA;EAAI,SAAA;EAAW,eAAA;EAAA,GAAoB;AAAA,GAAS,aAAA,GAAa,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/checkbox/checkbox.js

@@ -3,6 +3,10 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useId } from "react";
 import { Checkbox } from "@base-ui/react/checkbox";
 //#region src/checkbox/checkbox.tsx
+/**
+* Boolean selection with an accessible label. Wraps `@base-ui/react` Checkbox
+* with a styled indicator, check icon, and label layout.
+*/
 function Checkbox$1({ children, id, className, onCheckedChange, ...props }) {
 	const checkboxId = id ?? useId();
 	return /* @__PURE__ */ jsxs("label", {

package/dist/checkbox/checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.js","names":["Checkbox","styles","BaseCheckbox"],"sources":["../../src/checkbox/checkbox.tsx"],"sourcesContent":["import { useId } from \"react\";\nimport type { ReactNode } from \"react\";\nimport { Checkbox as BaseCheckbox } from \"@base-ui/react/checkbox\";\nimport styles from \"./checkbox.module.css\";\n\nexport interface CheckboxProps {\n  checked?: boolean;\n  defaultChecked?: boolean;\n  indeterminate?: boolean;\n  disabled?: boolean;\n  required?: boolean;\n  name?: string;\n  value?: string;\n  /** Called when checked state changes. `eventDetails` is the base-ui event details object. */\n  onCheckedChange?: (checked: boolean, eventDetails: unknown) => void;\n  children?: ReactNode;\n  id?: string;\n  className?: string;\n}\n\nexport function Checkbox({ children, id, className, onCheckedChange, ...props }: CheckboxProps) {\n  // eslint-disable-next-line react-hooks/rules-of-hooks\n  const checkboxId = id ?? useId();\n\n  return (\n    <label className={`${styles.root} ${className ?? \"\"}`} htmlFor={checkboxId}>\n      <BaseCheckbox.Root id={checkboxId} className={styles.indicator} onCheckedChange={onCheckedChange as never} {...props}>\n        <BaseCheckbox.Indicator className={styles.icon}>\n          <svg viewBox=\"0 0 10 10\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n            <path d=\"M1.5 5L3.5 7.5L8.5 2.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n          </svg>\n        </BaseCheckbox.Indicator>\n      </BaseCheckbox.Root>\n      {children && <span className={styles.label}>{children}</span>}\n    </label>\n  );\n}\nexport { styles as CheckboxStyles };\n"],"mappings":";;;;;AAoBA,SAAgBA,WAAS,EAAE,UAAU,IAAI,WAAW,iBAAiB,GAAG,SAAwB;CAE9F,MAAM,aAAa,MAAM,OAAO;AAEhC,QACE,qBAAC,SAAD;EAAO,WAAW,GAAGC,wBAAO,KAAK,GAAG,aAAa;EAAM,SAAS;YAAhE,CACE,oBAACC,SAAa,MAAd;GAAmB,IAAI;GAAY,WAAWD,wBAAO;GAA4B;GAA0B,GAAI;aAC7G,oBAACC,SAAa,WAAd;IAAwB,WAAWD,wBAAO;cACxC,oBAAC,OAAD;KAAK,SAAQ;KAAY,MAAK;KAAO,OAAM;eACzC,oBAAC,QAAD;MAAM,GAAE;MAAyB,QAAO;MAAe,aAAY;MAAM,eAAc;MAAQ,gBAAe;MAAU,CAAA;KACpH,CAAA;IACiB,CAAA;GACP,CAAA,EACnB,YAAY,oBAAC,QAAD;GAAM,WAAWA,wBAAO;GAAQ;GAAgB,CAAA,CACvD"}
+{"version":3,"file":"checkbox.js","names":["Checkbox","styles","BaseCheckbox"],"sources":["../../src/checkbox/checkbox.tsx"],"sourcesContent":["import { useId } from \"react\";\nimport type { ReactNode } from \"react\";\nimport { Checkbox as BaseCheckbox } from \"@base-ui/react/checkbox\";\nimport styles from \"./checkbox.module.css\";\n\nexport interface CheckboxProps {\n  /** Controlled checked state. */\n  checked?: boolean;\n  /** Initial checked state (uncontrolled). */\n  defaultChecked?: boolean;\n  /** Display a horizontal dash instead of a checkmark. */\n  indeterminate?: boolean;\n  /** Prevent interaction and dim the checkbox. */\n  disabled?: boolean;\n  /** Mark the field as required for form validation. */\n  required?: boolean;\n  /** HTML name attribute for form submission. */\n  name?: string;\n  /** HTML value attribute for form submission. */\n  value?: string;\n  /** Called when checked state changes. `eventDetails` is the base-ui event details object. */\n  onCheckedChange?: (checked: boolean, eventDetails: unknown) => void;\n  /** Label content rendered next to the checkbox. */\n  children?: ReactNode;\n  /** Override the auto-generated element id. */\n  id?: string;\n  className?: string;\n}\n\n/**\n * Boolean selection with an accessible label. Wraps `@base-ui/react` Checkbox\n * with a styled indicator, check icon, and label layout.\n */\nexport function Checkbox({ children, id, className, onCheckedChange, ...props }: CheckboxProps) {\n  // eslint-disable-next-line react-hooks/rules-of-hooks\n  const checkboxId = id ?? useId();\n\n  return (\n    <label className={`${styles.root} ${className ?? \"\"}`} htmlFor={checkboxId}>\n      <BaseCheckbox.Root id={checkboxId} className={styles.indicator} onCheckedChange={onCheckedChange as never} {...props}>\n        <BaseCheckbox.Indicator className={styles.icon}>\n          <svg viewBox=\"0 0 10 10\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n            <path d=\"M1.5 5L3.5 7.5L8.5 2.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n          </svg>\n        </BaseCheckbox.Indicator>\n      </BaseCheckbox.Root>\n      {children && <span className={styles.label}>{children}</span>}\n    </label>\n  );\n}\nexport { styles as CheckboxStyles };\n"],"mappings":";;;;;;;;;AAiCA,SAAgBA,WAAS,EAAE,UAAU,IAAI,WAAW,iBAAiB,GAAG,SAAwB;CAE9F,MAAM,aAAa,MAAM,OAAO;AAEhC,QACE,qBAAC,SAAD;EAAO,WAAW,GAAGC,wBAAO,KAAK,GAAG,aAAa;EAAM,SAAS;YAAhE,CACE,oBAACC,SAAa,MAAd;GAAmB,IAAI;GAAY,WAAWD,wBAAO;GAA4B;GAA0B,GAAI;aAC7G,oBAACC,SAAa,WAAd;IAAwB,WAAWD,wBAAO;cACxC,oBAAC,OAAD;KAAK,SAAQ;KAAY,MAAK;KAAO,OAAM;eACzC,oBAAC,QAAD;MAAM,GAAE;MAAyB,QAAO;MAAe,aAAY;MAAM,eAAc;MAAQ,gBAAe;MAAU,CAAA;KACpH,CAAA;IACiB,CAAA;GACP,CAAA,EACnB,YAAY,oBAAC,QAAD;GAAM,WAAWA,wBAAO;GAAQ;GAAgB,CAAA,CACvD"}

package/dist/checkbox/parts.d.ts

@@ -5,11 +5,8 @@ import { Checkbox } from "@base-ui/react/checkbox";
 //#region src/checkbox/parts.d.ts
 type BaseRootProps = ComponentPropsWithoutRef<typeof Checkbox.Root>;
 type BaseIndicatorProps = ComponentPropsWithoutRef<typeof Checkbox.Indicator>;
-interface CheckboxRootProps extends Omit<BaseRootProps, "className"> {
-  className?: string;
-}
-interface CheckboxIndicatorProps extends Omit<BaseIndicatorProps, "className"> {
-  className?: string;
+interface CheckboxRootProps extends BaseRootProps {}
+interface CheckboxIndicatorProps extends BaseIndicatorProps {
   /** Custom icon rendered inside the indicator. Defaults to an SVG checkmark. */
   children?: ReactNode;
 }

package/dist/checkbox/parts.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"parts.d.ts","names":[],"sources":["../../src/checkbox/parts.tsx"],"mappings":";;;;;KAqBK,aAAA,GAAgB,wBAAA,QAAgC,QAAA,CAAa,IAAA;AAAA,KAC7D,kBAAA,GAAqB,wBAAA,QAAgC,QAAA,CAAa,SAAA;AAAA,UAEtD,iBAAA,SAA0B,IAAA,CAAK,aAAA;EAC9C,SAAA;AAAA;AAAA,UAEe,sBAAA,SAA+B,IAAA,CAAK,kBAAA;EACnD,SAAA;EAPmB;EASnB,QAAA,GAAW,SAAA;AAAA;AAAA,cAGA,YAAA,EAAY,KAAA,CAAA,yBAAA,CAAA,iBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,WAAA;AAAA,cAOZ,iBAAA,EAAiB,KAAA,CAAA,yBAAA,CAAA,sBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,eAAA"}
+{"version":3,"file":"parts.d.ts","names":[],"sources":["../../src/checkbox/parts.tsx"],"mappings":";;;;;KAsBK,aAAA,GAAgB,wBAAA,QAAgC,QAAA,CAAa,IAAA;AAAA,KAC7D,kBAAA,GAAqB,wBAAA,QAAgC,QAAA,CAAa,SAAA;AAAA,UAEtD,iBAAA,SAA0B,aAAA;AAAA,UAC1B,sBAAA,SAA+B,kBAAA;;EAE9C,QAAA,GAAW,SAAA;AAAA;AAAA,cAGA,YAAA,EAAY,KAAA,CAAA,yBAAA,CAAA,iBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,WAAA;AAAA,cAOZ,iBAAA,EAAiB,KAAA,CAAA,yBAAA,CAAA,sBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,eAAA"}

package/dist/checkbox/parts.js

@@ -1,3 +1,4 @@
+import { cx, resolveClassName } from "../utils/resolveClassName.js";
 import checkbox_module_default from "./checkbox.module.js";
 import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
@@ -22,14 +23,14 @@ import { Checkbox } from "@base-ui/react/checkbox";
 const CheckboxRoot = forwardRef(function CheckboxRoot({ className, ...props }, ref) {
 	return /* @__PURE__ */ jsx(Checkbox.Root, {
 		ref,
-		className: `${checkbox_module_default.indicator} ${className ?? ""}`,
+		className: (state) => cx(checkbox_module_default.indicator, resolveClassName(className, state)),
 		...props
 	});
 });
 const CheckboxIndicator = forwardRef(function CheckboxIndicator({ className, children, ...props }, ref) {
 	return /* @__PURE__ */ jsx(Checkbox.Indicator, {
 		ref,
-		className: `${checkbox_module_default.icon} ${className ?? ""}`,
+		className: (state) => cx(checkbox_module_default.icon, resolveClassName(className, state)),
 		...props,
 		children: children ?? /* @__PURE__ */ jsx("svg", {
 			viewBox: "0 0 10 10",

package/dist/checkbox/parts.js.map

@@ -1 +1 @@
-{"version":3,"file":"parts.js","names":["BaseCheckbox","styles"],"sources":["../../src/checkbox/parts.tsx"],"sourcesContent":["/**\n * Styled primitives for Checkbox.\n *\n * @example\n * ```tsx\n * import { Checkbox } from '@base-ui/react/checkbox';\n * import { CheckboxRoot, CheckboxIndicator } from '@brijbyte/agentic-ui/checkbox';\n *\n * <label htmlFor=\"cb\">\n *   <CheckboxRoot id=\"cb\" onCheckedChange={...}>\n *     <CheckboxIndicator />\n *   </CheckboxRoot>\n *   Enable notifications\n * </label>\n * ```\n */\nimport { forwardRef } from \"react\";\nimport type { ComponentRef, ComponentPropsWithoutRef, ReactNode } from \"react\";\nimport { Checkbox as BaseCheckbox } from \"@base-ui/react/checkbox\";\nimport styles from \"./checkbox.module.css\";\n\ntype BaseRootProps = ComponentPropsWithoutRef<typeof BaseCheckbox.Root>;\ntype BaseIndicatorProps = ComponentPropsWithoutRef<typeof BaseCheckbox.Indicator>;\n\nexport interface CheckboxRootProps extends Omit<BaseRootProps, \"className\"> {\n  className?: string;\n}\nexport interface CheckboxIndicatorProps extends Omit<BaseIndicatorProps, \"className\"> {\n  className?: string;\n  /** Custom icon rendered inside the indicator. Defaults to an SVG checkmark. */\n  children?: ReactNode;\n}\n\nexport const CheckboxRoot = forwardRef<ComponentRef<typeof BaseCheckbox.Root>, CheckboxRootProps>(function CheckboxRoot(\n  { className, ...props },\n  ref,\n) {\n  return <BaseCheckbox.Root ref={ref} className={`${styles.indicator} ${className ?? \"\"}`} {...props} />;\n});\n\nexport const CheckboxIndicator = forwardRef<ComponentRef<typeof BaseCheckbox.Indicator>, CheckboxIndicatorProps>(function CheckboxIndicator(\n  { className, children, ...props },\n  ref,\n) {\n  return (\n    <BaseCheckbox.Indicator ref={ref} className={`${styles.icon} ${className ?? \"\"}`} {...props}>\n      {children ?? (\n        <svg viewBox=\"0 0 10 10\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M1.5 5L3.5 7.5L8.5 2.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n        </svg>\n      )}\n    </BaseCheckbox.Indicator>\n  );\n});\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAiCA,MAAa,eAAe,WAAsE,SAAS,aACzG,EAAE,WAAW,GAAG,SAChB,KACA;AACA,QAAO,oBAACA,SAAa,MAAd;EAAwB;EAAK,WAAW,GAAGC,wBAAO,UAAU,GAAG,aAAa;EAAM,GAAI;EAAS,CAAA;EACtG;AAEF,MAAa,oBAAoB,WAAgF,SAAS,kBACxH,EAAE,WAAW,UAAU,GAAG,SAC1B,KACA;AACA,QACE,oBAACD,SAAa,WAAd;EAA6B;EAAK,WAAW,GAAGC,wBAAO,KAAK,GAAG,aAAa;EAAM,GAAI;YACnF,YACC,oBAAC,OAAD;GAAK,SAAQ;GAAY,MAAK;GAAO,OAAM;aACzC,oBAAC,QAAD;IAAM,GAAE;IAAyB,QAAO;IAAe,aAAY;IAAM,eAAc;IAAQ,gBAAe;IAAU,CAAA;GACpH,CAAA;EAEe,CAAA;EAE3B"}
+{"version":3,"file":"parts.js","names":["BaseCheckbox","styles"],"sources":["../../src/checkbox/parts.tsx"],"sourcesContent":["/**\n * Styled primitives for Checkbox.\n *\n * @example\n * ```tsx\n * import { Checkbox } from '@base-ui/react/checkbox';\n * import { CheckboxRoot, CheckboxIndicator } from '@brijbyte/agentic-ui/checkbox';\n *\n * <label htmlFor=\"cb\">\n *   <CheckboxRoot id=\"cb\" onCheckedChange={...}>\n *     <CheckboxIndicator />\n *   </CheckboxRoot>\n *   Enable notifications\n * </label>\n * ```\n */\nimport { forwardRef } from \"react\";\nimport type { ComponentRef, ComponentPropsWithoutRef, ReactNode } from \"react\";\nimport { Checkbox as BaseCheckbox } from \"@base-ui/react/checkbox\";\nimport styles from \"./checkbox.module.css\";\nimport { resolveClassName, cx } from \"../utils/resolveClassName\";\n\ntype BaseRootProps = ComponentPropsWithoutRef<typeof BaseCheckbox.Root>;\ntype BaseIndicatorProps = ComponentPropsWithoutRef<typeof BaseCheckbox.Indicator>;\n\nexport interface CheckboxRootProps extends BaseRootProps {}\nexport interface CheckboxIndicatorProps extends BaseIndicatorProps {\n  /** Custom icon rendered inside the indicator. Defaults to an SVG checkmark. */\n  children?: ReactNode;\n}\n\nexport const CheckboxRoot = forwardRef<ComponentRef<typeof BaseCheckbox.Root>, CheckboxRootProps>(function CheckboxRoot(\n  { className, ...props },\n  ref,\n) {\n  return <BaseCheckbox.Root ref={ref} className={(state) => cx(styles.indicator, resolveClassName(className, state))} {...props} />;\n});\n\nexport const CheckboxIndicator = forwardRef<ComponentRef<typeof BaseCheckbox.Indicator>, CheckboxIndicatorProps>(function CheckboxIndicator(\n  { className, children, ...props },\n  ref,\n) {\n  return (\n    <BaseCheckbox.Indicator ref={ref} className={(state) => cx(styles.icon, resolveClassName(className, state))} {...props}>\n      {children ?? (\n        <svg viewBox=\"0 0 10 10\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M1.5 5L3.5 7.5L8.5 2.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n        </svg>\n      )}\n    </BaseCheckbox.Indicator>\n  );\n});\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA+BA,MAAa,eAAe,WAAsE,SAAS,aACzG,EAAE,WAAW,GAAG,SAChB,KACA;AACA,QAAO,oBAACA,SAAa,MAAd;EAAwB;EAAK,YAAY,UAAU,GAAGC,wBAAO,WAAW,iBAAiB,WAAW,MAAM,CAAC;EAAE,GAAI;EAAS,CAAA;EACjI;AAEF,MAAa,oBAAoB,WAAgF,SAAS,kBACxH,EAAE,WAAW,UAAU,GAAG,SAC1B,KACA;AACA,QACE,oBAACD,SAAa,WAAd;EAA6B;EAAK,YAAY,UAAU,GAAGC,wBAAO,MAAM,iBAAiB,WAAW,MAAM,CAAC;EAAE,GAAI;YAC9G,YACC,oBAAC,OAAD;GAAK,SAAQ;GAAY,MAAK;GAAO,OAAM;aACzC,oBAAC,QAAD;IAAM,GAAE;IAAyB,QAAO;IAAe,aAAY;IAAM,eAAc;IAAQ,gBAAe;IAAU,CAAA;GACpH,CAAA;EAEe,CAAA;EAE3B"}

package/dist/collapsible/collapsible.d.ts

@@ -4,14 +4,25 @@ import styles from "./collapsible.module.css";
 
 //#region src/collapsible/collapsible.d.ts
 interface CollapsibleProps {
+  /** Content rendered inside the toggle button. */
   trigger: ReactNode;
+  /** Content revealed when expanded. */
   children: ReactNode;
+  /** Whether the panel is initially open (uncontrolled). */
   defaultOpen?: boolean;
+  /** Controlled open state. */
   open?: boolean;
+  /** Called when the panel opens or closes. */
   onOpenChange?: (open: boolean) => void;
+  /** Prevent the panel from being toggled. */
   disabled?: boolean;
   className?: string;
 }
+/**
+ * A single panel toggled by a button. Unlike Accordion it stands alone —
+ * ideal for inline FAQ entries, code blocks, or side panels.
+ * Animates via `--collapsible-panel-height`.
+ */
 declare function Collapsible({
   trigger,
   children,

package/dist/collapsible/collapsible.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"collapsible.d.ts","names":[],"sources":["../../src/collapsible/collapsible.tsx"],"mappings":";;;;;UAIiB,gBAAA;EACf,OAAA,EAAS,SAAA;EACT,QAAA,EAAU,SAAA;EACV,WAAA;EACA,IAAA;EACA,YAAA,IAAgB,IAAA;EAChB,QAAA;EACA,SAAA;AAAA;AAAA,iBAWc,WAAA,CAAA;EAAc,OAAA;EAAS,QAAA;EAAU,SAAA;EAAW,YAAA;EAAA,GAAiB;AAAA,GAAS,gBAAA,GAAgB,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"collapsible.d.ts","names":[],"sources":["../../src/collapsible/collapsible.tsx"],"mappings":";;;;;UAIiB,gBAAA;;EAEf,OAAA,EAAS,SAAA;EAFM;EAIf,QAAA,EAAU,SAAA;;EAEV,WAAA;EAJA;EAMA,IAAA;EAJA;EAMA,YAAA,IAAgB,IAAA;EAJhB;EAMA,QAAA;EACA,SAAA;AAAA;;;;;AAgBF;iBAAgB,WAAA,CAAA;EAAc,OAAA;EAAS,QAAA;EAAU,SAAA;EAAW,YAAA;EAAA,GAAiB;AAAA,GAAS,gBAAA,GAAgB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/collapsible/collapsible.js

@@ -18,6 +18,11 @@ function ChevronIcon() {
 		})
 	});
 }
+/**
+* A single panel toggled by a button. Unlike Accordion it stands alone —
+* ideal for inline FAQ entries, code blocks, or side panels.
+* Animates via `--collapsible-panel-height`.
+*/
 function Collapsible$1({ trigger, children, className, onOpenChange, ...props }) {
 	return /* @__PURE__ */ jsxs(Collapsible.Root, {
 		className: `${collapsible_module_default.root} ${className ?? ""}`,