@brijbyte/agentic-ui 0.0.1-beta → 0.0.1

package/dist/checkbox/checkbox.d.ts

@@ -0,0 +1,29 @@
+import { ReactNode } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import styles from "./checkbox.module.css";
+
+//#region src/checkbox/checkbox.d.ts
+interface CheckboxProps {
+  checked?: boolean;
+  defaultChecked?: boolean;
+  indeterminate?: boolean;
+  disabled?: boolean;
+  required?: boolean;
+  name?: string;
+  value?: string;
+  /** Called when checked state changes. `eventDetails` is the base-ui event details object. */
+  onCheckedChange?: (checked: boolean, eventDetails: unknown) => void;
+  children?: ReactNode;
+  id?: string;
+  className?: string;
+}
+declare function Checkbox({
+  children,
+  id,
+  className,
+  onCheckedChange,
+  ...props
+}: CheckboxProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Checkbox, CheckboxProps, styles };
+//# sourceMappingURL=checkbox.d.ts.map

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

@@ -0,0 +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"}

package/dist/checkbox/checkbox.js

@@ -0,0 +1,40 @@
+import checkbox_module_default from "./checkbox.module.js";
+import { useId } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Checkbox } from "@base-ui/react/checkbox";
+//#region src/checkbox/checkbox.tsx
+function Checkbox$1({ children, id, className, onCheckedChange, ...props }) {
+	const checkboxId = id ?? useId();
+	return /* @__PURE__ */ jsxs("label", {
+		className: `${checkbox_module_default.root} ${className ?? ""}`,
+		htmlFor: checkboxId,
+		children: [/* @__PURE__ */ jsx(Checkbox.Root, {
+			id: checkboxId,
+			className: checkbox_module_default.indicator,
+			onCheckedChange,
+			...props,
+			children: /* @__PURE__ */ jsx(Checkbox.Indicator, {
+				className: checkbox_module_default.icon,
+				children: /* @__PURE__ */ jsx("svg", {
+					viewBox: "0 0 10 10",
+					fill: "none",
+					xmlns: "http://www.w3.org/2000/svg",
+					children: /* @__PURE__ */ jsx("path", {
+						d: "M1.5 5L3.5 7.5L8.5 2.5",
+						stroke: "currentColor",
+						strokeWidth: "1.5",
+						strokeLinecap: "round",
+						strokeLinejoin: "round"
+					})
+				})
+			})
+		}), children && /* @__PURE__ */ jsx("span", {
+			className: checkbox_module_default.label,
+			children
+		})]
+	});
+}
+//#endregion
+export { Checkbox$1 as Checkbox };
+
+//# sourceMappingURL=checkbox.js.map

package/dist/checkbox/checkbox.js.map

@@ -0,0 +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"}

package/dist/checkbox/checkbox.module.css.d.ts

@@ -0,0 +1,2 @@
+declare const styles: Record<string, string | undefined>;
+export default styles;

package/dist/checkbox/checkbox.module.js

@@ -0,0 +1,11 @@
+//#region src/checkbox/checkbox.module.css
+var checkbox_module_default = {
+	"icon": "icon_J4At5G",
+	"indicator": "indicator_J4At5G",
+	"label": "label_J4At5G",
+	"root": "root_J4At5G"
+};
+//#endregion
+export { checkbox_module_default as default };
+
+//# sourceMappingURL=checkbox.module.js.map

package/dist/checkbox/checkbox.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox.module.js","names":[],"sources":["../../src/checkbox/checkbox.module.css"],"sourcesContent":["@layer theme, base, components, utilities;\n\n@layer components {\n  .root {\n    display: flex;\n    align-items: center;\n    gap: var(--space-2);\n    cursor: pointer;\n    user-select: none;\n  }\n\n  .root[data-disabled] {\n    opacity: 0.44;\n    cursor: not-allowed;\n  }\n\n  .indicator {\n    flex-shrink: 0;\n    width: 16px;\n    height: 16px;\n    border-radius: var(--radius-sm);\n    border: var(--border-width-base) solid var(--color-border-strong);\n    background-color: var(--color-surface-1);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition:\n      background-color var(--duration-fast) var(--easing-standard),\n      border-color var(--duration-fast) var(--easing-standard),\n      box-shadow var(--duration-fast) var(--easing-standard);\n    outline: none;\n    position: relative;\n  }\n\n  .indicator:focus-visible {\n    box-shadow: var(--shadow-focus);\n    border-color: var(--color-accent);\n  }\n\n  .indicator:hover:not([data-disabled]) {\n    border-color: var(--color-accent);\n  }\n\n  .indicator[data-checked],\n  .indicator[data-indeterminate] {\n    background-color: var(--color-accent);\n    border-color: var(--color-accent);\n  }\n\n  .indicator[data-checked]:hover,\n  .indicator[data-indeterminate]:hover {\n    background-color: var(--color-accent-hover);\n    border-color: var(--color-accent-hover);\n  }\n\n  /* Checkmark SVG */\n  .icon {\n    width: 10px;\n    height: 10px;\n    color: var(--color-text-on-accent);\n    opacity: 0;\n    transform: scale(0.9);\n    transition:\n      opacity var(--duration-fast) var(--easing-standard),\n      transform var(--duration-fast) var(--easing-spring);\n  }\n\n  .indicator[data-checked] .icon,\n  .indicator[data-indeterminate] .icon {\n    opacity: 1;\n    transform: scale(1);\n  }\n\n  .label {\n    font-family: var(--font-mono);\n    font-size: var(--font-size-sm);\n    color: var(--color-text-primary);\n    line-height: var(--line-height-normal);\n  }\n}\n"],"mappings":";AAQA,IAAA,0BAAe;CAAC,QAAK;CAAA,aAAA;CAAA,SAAA;CAAA,QAAA;CAAA"}

package/dist/checkbox/index.d.ts

@@ -0,0 +1,3 @@
+import { Checkbox, CheckboxProps, styles } from "./checkbox.js";
+import { CheckboxIndicator, CheckboxIndicatorProps, CheckboxRoot, CheckboxRootProps } from "./parts.js";
+export { Checkbox, CheckboxIndicator, type CheckboxIndicatorProps, type CheckboxProps, CheckboxRoot, type CheckboxRootProps, styles as CheckboxStyles };

package/dist/checkbox/index.js

@@ -0,0 +1,4 @@
+import checkbox_module_default from "./checkbox.module.js";
+import { Checkbox } from "./checkbox.js";
+import { CheckboxIndicator, CheckboxRoot } from "./parts.js";
+export { Checkbox, CheckboxIndicator, CheckboxRoot, checkbox_module_default as CheckboxStyles };

package/dist/checkbox/parts.d.ts

@@ -0,0 +1,20 @@
+import * as react from "react";
+import { ComponentPropsWithoutRef, ReactNode } from "react";
+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;
+  /** Custom icon rendered inside the indicator. Defaults to an SVG checkmark. */
+  children?: ReactNode;
+}
+declare const CheckboxRoot: react.ForwardRefExoticComponent<CheckboxRootProps & react.RefAttributes<HTMLElement>>;
+declare const CheckboxIndicator: react.ForwardRefExoticComponent<CheckboxIndicatorProps & react.RefAttributes<HTMLSpanElement>>;
+//#endregion
+export { CheckboxIndicator, CheckboxIndicatorProps, CheckboxRoot, CheckboxRootProps };
+//# sourceMappingURL=parts.d.ts.map

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

@@ -0,0 +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"}

package/dist/checkbox/parts.js

@@ -0,0 +1,51 @@
+import checkbox_module_default from "./checkbox.module.js";
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+import { Checkbox } from "@base-ui/react/checkbox";
+//#region src/checkbox/parts.tsx
+/**
+* Styled primitives for Checkbox.
+*
+* @example
+* ```tsx
+* import { Checkbox } from '@base-ui/react/checkbox';
+* import { CheckboxRoot, CheckboxIndicator } from '@brijbyte/agentic-ui/checkbox';
+*
+* <label htmlFor="cb">
+*   <CheckboxRoot id="cb" onCheckedChange={...}>
+*     <CheckboxIndicator />
+*   </CheckboxRoot>
+*   Enable notifications
+* </label>
+* ```
+*/
+const CheckboxRoot = forwardRef(function CheckboxRoot({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Checkbox.Root, {
+		ref,
+		className: `${checkbox_module_default.indicator} ${className ?? ""}`,
+		...props
+	});
+});
+const CheckboxIndicator = forwardRef(function CheckboxIndicator({ className, children, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Checkbox.Indicator, {
+		ref,
+		className: `${checkbox_module_default.icon} ${className ?? ""}`,
+		...props,
+		children: children ?? /* @__PURE__ */ jsx("svg", {
+			viewBox: "0 0 10 10",
+			fill: "none",
+			xmlns: "http://www.w3.org/2000/svg",
+			children: /* @__PURE__ */ jsx("path", {
+				d: "M1.5 5L3.5 7.5L8.5 2.5",
+				stroke: "currentColor",
+				strokeWidth: "1.5",
+				strokeLinecap: "round",
+				strokeLinejoin: "round"
+			})
+		})
+	});
+});
+//#endregion
+export { CheckboxIndicator, CheckboxRoot };
+
+//# sourceMappingURL=parts.js.map

package/dist/checkbox/parts.js.map

@@ -0,0 +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"}

package/dist/collapsible/collapsible.css

@@ -0,0 +1,92 @@
+@layer theme, base;
+
+@layer components {
+  .root_rWN60G {
+    flex-direction: column;
+    gap: 0;
+    display: flex;
+  }
+
+  .trigger_rWN60G {
+    align-items: center;
+    gap: var(--space-2);
+    padding: var(--space-2) var(--space-3);
+    font-family: var(--font-mono);
+    font-size: var(--font-size-sm);
+    font-weight: var(--font-weight-medium);
+    color: var(--color-text-primary);
+    background: var(--color-surface-1);
+    border: var(--border-width-base) solid var(--color-border-base);
+    border-radius: var(--radius-md);
+    cursor: pointer;
+    text-align: left;
+    user-select: none;
+    transition: background-color var(--duration-fast) var(--easing-standard),
+      border-bottom-left-radius var(--duration-normal) var(--easing-standard) var(--duration-normal),
+      border-bottom-right-radius var(--duration-normal) var(--easing-standard) var(--duration-normal),
+      border-bottom-color var(--duration-normal) var(--easing-standard) var(--duration-normal);
+    outline: none;
+    display: flex;
+  }
+
+  .trigger_rWN60G[data-panel-open] {
+    transition: background-color var(--duration-fast) var(--easing-standard),
+      border-bottom-left-radius var(--duration-normal) var(--easing-standard),
+      border-bottom-right-radius var(--duration-normal) var(--easing-standard),
+      border-bottom-color var(--duration-normal) var(--easing-standard);
+    border-bottom-color: #0000;
+    border-bottom-right-radius: 0;
+    border-bottom-left-radius: 0;
+  }
+
+  .trigger_rWN60G:hover {
+    background-color: var(--color-surface-hover);
+  }
+
+  .trigger_rWN60G:focus-visible {
+    box-shadow: var(--shadow-focus);
+  }
+
+  .trigger_rWN60G[data-disabled] {
+    opacity: .44;
+    cursor: not-allowed;
+  }
+
+  .trigger-icon_rWN60G {
+    color: var(--color-text-tertiary);
+    transition: transform var(--duration-normal) var(--easing-standard);
+    flex-shrink: 0;
+  }
+
+  .trigger_rWN60G[data-panel-open] .trigger-icon_rWN60G {
+    transform: rotate(90deg);
+  }
+
+  .panel_rWN60G {
+    height: var(--collapsible-panel-height);
+    transition: height var(--duration-normal) var(--easing-standard);
+    overflow: hidden;
+  }
+
+  .panel_rWN60G[hidden]:not([hidden="until-found"]) {
+    display: none;
+  }
+
+  .panel_rWN60G[data-starting-style], .panel_rWN60G[data-ending-style] {
+    height: 0;
+  }
+
+  .panel-content_rWN60G {
+    padding: var(--space-3) var(--space-3) var(--space-3) var(--space-3);
+    font-family: var(--font-mono);
+    font-size: var(--font-size-sm);
+    color: var(--color-text-secondary);
+    line-height: var(--line-height-relaxed);
+    border: var(--border-width-base) solid var(--color-border-base);
+    border-radius: 0 0 var(--radius-md) var(--radius-md);
+    background: var(--color-bg-elevated);
+    border-top: none;
+  }
+}
+
+@layer utilities;

package/dist/collapsible/collapsible.d.ts

@@ -0,0 +1,24 @@
+import { ReactNode } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import styles from "./collapsible.module.css";
+
+//#region src/collapsible/collapsible.d.ts
+interface CollapsibleProps {
+  trigger: ReactNode;
+  children: ReactNode;
+  defaultOpen?: boolean;
+  open?: boolean;
+  onOpenChange?: (open: boolean) => void;
+  disabled?: boolean;
+  className?: string;
+}
+declare function Collapsible({
+  trigger,
+  children,
+  className,
+  onOpenChange,
+  ...props
+}: CollapsibleProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Collapsible, CollapsibleProps, styles };
+//# sourceMappingURL=collapsible.d.ts.map

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

@@ -0,0 +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"}

package/dist/collapsible/collapsible.js

@@ -0,0 +1,44 @@
+import collapsible_module_default from "./collapsible.module.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Collapsible } from "@base-ui/react/collapsible";
+//#region src/collapsible/collapsible.tsx
+function ChevronIcon() {
+	return /* @__PURE__ */ jsx("svg", {
+		width: "10",
+		height: "10",
+		viewBox: "0 0 10 10",
+		fill: "none",
+		"aria-hidden": true,
+		children: /* @__PURE__ */ jsx("path", {
+			d: "M3.5 9L7.5 5L3.5 1",
+			stroke: "currentColor",
+			strokeWidth: "1.5",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	});
+}
+function Collapsible$1({ trigger, children, className, onOpenChange, ...props }) {
+	return /* @__PURE__ */ jsxs(Collapsible.Root, {
+		className: `${collapsible_module_default.root} ${className ?? ""}`,
+		onOpenChange,
+		...props,
+		children: [/* @__PURE__ */ jsxs(Collapsible.Trigger, {
+			className: collapsible_module_default.trigger,
+			children: [/* @__PURE__ */ jsx("span", {
+				className: collapsible_module_default["trigger-icon"],
+				children: /* @__PURE__ */ jsx(ChevronIcon, {})
+			}), trigger]
+		}), /* @__PURE__ */ jsx(Collapsible.Panel, {
+			className: collapsible_module_default.panel,
+			children: /* @__PURE__ */ jsx("div", {
+				className: collapsible_module_default["panel-content"],
+				children
+			})
+		})]
+	});
+}
+//#endregion
+export { Collapsible$1 as Collapsible };
+
+//# sourceMappingURL=collapsible.js.map

package/dist/collapsible/collapsible.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"collapsible.js","names":["Collapsible","BaseCollapsible","styles"],"sources":["../../src/collapsible/collapsible.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { Collapsible as BaseCollapsible } from \"@base-ui/react/collapsible\";\nimport styles from \"./collapsible.module.css\";\n\nexport interface CollapsibleProps {\n  trigger: ReactNode;\n  children: ReactNode;\n  defaultOpen?: boolean;\n  open?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  disabled?: boolean;\n  className?: string;\n}\n\nfunction ChevronIcon() {\n  return (\n    <svg width=\"10\" height=\"10\" viewBox=\"0 0 10 10\" fill=\"none\" aria-hidden>\n      <path d=\"M3.5 9L7.5 5L3.5 1\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n    </svg>\n  );\n}\n\nexport function Collapsible({ trigger, children, className, onOpenChange, ...props }: CollapsibleProps) {\n  return (\n    <BaseCollapsible.Root className={`${styles.root} ${className ?? \"\"}`} onOpenChange={onOpenChange as never} {...props}>\n      <BaseCollapsible.Trigger className={styles.trigger}>\n        <span className={styles[\"trigger-icon\"]}>\n          <ChevronIcon />\n        </span>\n        {trigger}\n      </BaseCollapsible.Trigger>\n      <BaseCollapsible.Panel className={styles.panel}>\n        <div className={styles[\"panel-content\"]}>{children}</div>\n      </BaseCollapsible.Panel>\n    </BaseCollapsible.Root>\n  );\n}\nexport { styles as CollapsibleStyles };\n"],"mappings":";;;;AAcA,SAAS,cAAc;AACrB,QACE,oBAAC,OAAD;EAAK,OAAM;EAAK,QAAO;EAAK,SAAQ;EAAY,MAAK;EAAO,eAAA;YAC1D,oBAAC,QAAD;GAAM,GAAE;GAAqB,QAAO;GAAe,aAAY;GAAM,eAAc;GAAQ,gBAAe;GAAU,CAAA;EAChH,CAAA;;AAIV,SAAgBA,cAAY,EAAE,SAAS,UAAU,WAAW,cAAc,GAAG,SAA2B;AACtG,QACE,qBAACC,YAAgB,MAAjB;EAAsB,WAAW,GAAGC,2BAAO,KAAK,GAAG,aAAa;EAAoB;EAAuB,GAAI;YAA/G,CACE,qBAACD,YAAgB,SAAjB;GAAyB,WAAWC,2BAAO;aAA3C,CACE,oBAAC,QAAD;IAAM,WAAWA,2BAAO;cACtB,oBAAC,aAAD,EAAe,CAAA;IACV,CAAA,EACN,QACuB;MAC1B,oBAACD,YAAgB,OAAjB;GAAuB,WAAWC,2BAAO;aACvC,oBAAC,OAAD;IAAK,WAAWA,2BAAO;IAAmB;IAAe,CAAA;GACnC,CAAA,CACH"}

package/dist/collapsible/collapsible.module.css.d.ts

@@ -0,0 +1,2 @@
+declare const styles: Record<string, string | undefined>;
+export default styles;

package/dist/collapsible/collapsible.module.js

@@ -0,0 +1,12 @@
+//#region src/collapsible/collapsible.module.css
+var collapsible_module_default = {
+	"panel": "panel_rWN60G",
+	"panel-content": "panel-content_rWN60G",
+	"root": "root_rWN60G",
+	"trigger": "trigger_rWN60G",
+	"trigger-icon": "trigger-icon_rWN60G"
+};
+//#endregion
+export { collapsible_module_default as default };
+
+//# sourceMappingURL=collapsible.module.js.map

package/dist/collapsible/collapsible.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"collapsible.module.js","names":[],"sources":["../../src/collapsible/collapsible.module.css"],"sourcesContent":["@layer theme, base, components, utilities;\n\n@layer components {\n  .root {\n    display: flex;\n    flex-direction: column;\n    gap: 0;\n  }\n\n  .trigger {\n    display: flex;\n    align-items: center;\n    gap: var(--space-2);\n    padding: var(--space-2) var(--space-3);\n    font-family: var(--font-mono);\n    font-size: var(--font-size-sm);\n    font-weight: var(--font-weight-medium);\n    color: var(--color-text-primary);\n    background: var(--color-surface-1);\n    border: var(--border-width-base) solid var(--color-border-base);\n    border-radius: var(--radius-md);\n    cursor: pointer;\n    outline: none;\n    text-align: left;\n    user-select: none;\n    transition:\n      background-color var(--duration-fast) var(--easing-standard),\n      border-bottom-left-radius var(--duration-normal) var(--easing-standard) var(--duration-normal),\n      border-bottom-right-radius var(--duration-normal) var(--easing-standard) var(--duration-normal),\n      border-bottom-color var(--duration-normal) var(--easing-standard) var(--duration-normal);\n  }\n\n  .trigger[data-panel-open] {\n    border-bottom-left-radius: 0;\n    border-bottom-right-radius: 0;\n    border-bottom-color: transparent;\n    transition:\n      background-color var(--duration-fast) var(--easing-standard),\n      border-bottom-left-radius var(--duration-normal) var(--easing-standard),\n      border-bottom-right-radius var(--duration-normal) var(--easing-standard),\n      border-bottom-color var(--duration-normal) var(--easing-standard);\n  }\n\n  .trigger:hover {\n    background-color: var(--color-surface-hover);\n  }\n\n  .trigger:focus-visible {\n    box-shadow: var(--shadow-focus);\n  }\n\n  .trigger[data-disabled] {\n    opacity: 0.44;\n    cursor: not-allowed;\n  }\n\n  .trigger-icon {\n    color: var(--color-text-tertiary);\n    flex-shrink: 0;\n    transition: transform var(--duration-normal) var(--easing-standard);\n  }\n\n  .trigger[data-panel-open] .trigger-icon {\n    transform: rotate(90deg);\n  }\n\n  .panel {\n    height: var(--collapsible-panel-height);\n    overflow: hidden;\n    transition: height var(--duration-normal) var(--easing-standard);\n  }\n\n  /* hide when not using hidden=\"until-found\" */\n  .panel[hidden]:not([hidden=\"until-found\"]) {\n    display: none;\n  }\n\n  .panel[data-starting-style],\n  .panel[data-ending-style] {\n    height: 0;\n  }\n\n  .panel-content {\n    padding: var(--space-3) var(--space-3) var(--space-3) var(--space-3);\n    font-family: var(--font-mono);\n    font-size: var(--font-size-sm);\n    color: var(--color-text-secondary);\n    line-height: var(--line-height-relaxed);\n    border: var(--border-width-base) solid var(--color-border-base);\n    border-top: none;\n    border-radius: 0 0 var(--radius-md) var(--radius-md);\n    background: var(--color-bg-elevated);\n  }\n}\n"],"mappings":";AAUA,IAAA,6BAAa;CAAA,SAAI;CAAA,iBAAA;CAAA,QAAA;CAAA,WAAA;CAAA,gBAAA;CAAA"}

package/dist/collapsible/index.d.ts

@@ -0,0 +1,3 @@
+import { Collapsible, CollapsibleProps, styles } from "./collapsible.js";
+import { CollapsiblePanel, CollapsiblePanelProps, CollapsibleRoot, CollapsibleRootProps, CollapsibleTrigger, CollapsibleTriggerProps } from "./parts.js";
+export { Collapsible, CollapsiblePanel, type CollapsiblePanelProps, type CollapsibleProps, CollapsibleRoot, type CollapsibleRootProps, styles as CollapsibleStyles, CollapsibleTrigger, type CollapsibleTriggerProps };

package/dist/collapsible/index.js

@@ -0,0 +1,4 @@
+import collapsible_module_default from "./collapsible.module.js";
+import { Collapsible } from "./collapsible.js";
+import { CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger } from "./parts.js";
+export { Collapsible, CollapsiblePanel, CollapsibleRoot, collapsible_module_default as CollapsibleStyles, CollapsibleTrigger };

package/dist/collapsible/parts.d.ts

@@ -0,0 +1,23 @@
+import * as react from "react";
+import { ComponentPropsWithoutRef } from "react";
+import { Collapsible } from "@base-ui/react/collapsible";
+
+//#region src/collapsible/parts.d.ts
+type BaseRootProps = ComponentPropsWithoutRef<typeof Collapsible.Root>;
+type BaseTriggerProps = ComponentPropsWithoutRef<typeof Collapsible.Trigger>;
+type BasePanelProps = ComponentPropsWithoutRef<typeof Collapsible.Panel>;
+interface CollapsibleRootProps extends Omit<BaseRootProps, "className"> {
+  className?: string;
+}
+interface CollapsibleTriggerProps extends Omit<BaseTriggerProps, "className"> {
+  className?: string;
+}
+interface CollapsiblePanelProps extends Omit<BasePanelProps, "className"> {
+  className?: string;
+}
+declare const CollapsibleRoot: react.ForwardRefExoticComponent<CollapsibleRootProps & react.RefAttributes<HTMLDivElement>>;
+declare const CollapsibleTrigger: react.ForwardRefExoticComponent<CollapsibleTriggerProps & react.RefAttributes<HTMLButtonElement>>;
+declare const CollapsiblePanel: react.ForwardRefExoticComponent<CollapsiblePanelProps & react.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { CollapsiblePanel, CollapsiblePanelProps, CollapsibleRoot, CollapsibleRootProps, CollapsibleTrigger, CollapsibleTriggerProps };
+//# sourceMappingURL=parts.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"parts.d.ts","names":[],"sources":["../../src/collapsible/parts.tsx"],"mappings":";;;;;KAmBK,aAAA,GAAgB,wBAAA,QAAgC,WAAA,CAAgB,IAAA;AAAA,KAChE,gBAAA,GAAmB,wBAAA,QAAgC,WAAA,CAAgB,OAAA;AAAA,KACnE,cAAA,GAAiB,wBAAA,QAAgC,WAAA,CAAgB,KAAA;AAAA,UAErD,oBAAA,SAA6B,IAAA,CAAK,aAAA;EACjD,SAAA;AAAA;AAAA,UAEe,uBAAA,SAAgC,IAAA,CAAK,gBAAA;EACpD,SAAA;AAAA;AAAA,UAEe,qBAAA,SAA8B,IAAA,CAAK,cAAA;EAClD,SAAA;AAAA;AAAA,cAGW,eAAA,EAAe,KAAA,CAAA,yBAAA,CAAA,oBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,cAAA;AAAA,cAOf,kBAAA,EAAkB,KAAA,CAAA,yBAAA,CAAA,uBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,iBAAA;AAAA,cAMlB,gBAAA,EAAgB,KAAA,CAAA,yBAAA,CAAA,qBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,cAAA"}

package/dist/collapsible/parts.js

@@ -0,0 +1,44 @@
+import collapsible_module_default from "./collapsible.module.js";
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+import { Collapsible } from "@base-ui/react/collapsible";
+//#region src/collapsible/parts.tsx
+/**
+* Styled primitives for Collapsible.
+*
+* @example
+* ```tsx
+* import { Collapsible } from '@base-ui/react/collapsible';
+* import { CollapsibleTrigger, CollapsiblePanel } from '@brijbyte/agentic-ui/collapsible';
+*
+* <Collapsible.Root>
+*   <CollapsibleTrigger>Toggle</CollapsibleTrigger>
+*   <CollapsiblePanel>Content</CollapsiblePanel>
+* </Collapsible.Root>
+* ```
+*/
+const CollapsibleRoot = forwardRef(function CollapsibleRoot({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Collapsible.Root, {
+		ref,
+		className: `${collapsible_module_default.root} ${className ?? ""}`,
+		...props
+	});
+});
+const CollapsibleTrigger = forwardRef(function CollapsibleTrigger({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Collapsible.Trigger, {
+		ref,
+		className: `${collapsible_module_default.trigger} ${className ?? ""}`,
+		...props
+	});
+});
+const CollapsiblePanel = forwardRef(function CollapsiblePanel({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Collapsible.Panel, {
+		ref,
+		className: `${collapsible_module_default.panel} ${className ?? ""}`,
+		...props
+	});
+});
+//#endregion
+export { CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger };
+
+//# sourceMappingURL=parts.js.map

package/dist/collapsible/parts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"parts.js","names":["BaseCollapsible","styles"],"sources":["../../src/collapsible/parts.tsx"],"sourcesContent":["/**\n * Styled primitives for Collapsible.\n *\n * @example\n * ```tsx\n * import { Collapsible } from '@base-ui/react/collapsible';\n * import { CollapsibleTrigger, CollapsiblePanel } from '@brijbyte/agentic-ui/collapsible';\n *\n * <Collapsible.Root>\n *   <CollapsibleTrigger>Toggle</CollapsibleTrigger>\n *   <CollapsiblePanel>Content</CollapsiblePanel>\n * </Collapsible.Root>\n * ```\n */\nimport { forwardRef } from \"react\";\nimport type { ComponentRef, ComponentPropsWithoutRef } from \"react\";\nimport { Collapsible as BaseCollapsible } from \"@base-ui/react/collapsible\";\nimport styles from \"./collapsible.module.css\";\n\ntype BaseRootProps = ComponentPropsWithoutRef<typeof BaseCollapsible.Root>;\ntype BaseTriggerProps = ComponentPropsWithoutRef<typeof BaseCollapsible.Trigger>;\ntype BasePanelProps = ComponentPropsWithoutRef<typeof BaseCollapsible.Panel>;\n\nexport interface CollapsibleRootProps extends Omit<BaseRootProps, \"className\"> {\n  className?: string;\n}\nexport interface CollapsibleTriggerProps extends Omit<BaseTriggerProps, \"className\"> {\n  className?: string;\n}\nexport interface CollapsiblePanelProps extends Omit<BasePanelProps, \"className\"> {\n  className?: string;\n}\n\nexport const CollapsibleRoot = forwardRef<ComponentRef<typeof BaseCollapsible.Root>, CollapsibleRootProps>(function CollapsibleRoot(\n  { className, ...props },\n  ref,\n) {\n  return <BaseCollapsible.Root ref={ref} className={`${styles.root} ${className ?? \"\"}`} {...props} />;\n});\n\nexport const CollapsibleTrigger = forwardRef<ComponentRef<typeof BaseCollapsible.Trigger>, CollapsibleTriggerProps>(\n  function CollapsibleTrigger({ className, ...props }, ref) {\n    return <BaseCollapsible.Trigger ref={ref} className={`${styles.trigger} ${className ?? \"\"}`} {...props} />;\n  },\n);\n\nexport const CollapsiblePanel = forwardRef<ComponentRef<typeof BaseCollapsible.Panel>, CollapsiblePanelProps>(function CollapsiblePanel(\n  { className, ...props },\n  ref,\n) {\n  return <BaseCollapsible.Panel ref={ref} className={`${styles.panel} ${className ?? \"\"}`} {...props} />;\n});\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAiCA,MAAa,kBAAkB,WAA4E,SAAS,gBAClH,EAAE,WAAW,GAAG,SAChB,KACA;AACA,QAAO,oBAACA,YAAgB,MAAjB;EAA2B;EAAK,WAAW,GAAGC,2BAAO,KAAK,GAAG,aAAa;EAAM,GAAI;EAAS,CAAA;EACpG;AAEF,MAAa,qBAAqB,WAChC,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAS,KAAK;AACxD,QAAO,oBAACD,YAAgB,SAAjB;EAA8B;EAAK,WAAW,GAAGC,2BAAO,QAAQ,GAAG,aAAa;EAAM,GAAI;EAAS,CAAA;EAE7G;AAED,MAAa,mBAAmB,WAA8E,SAAS,iBACrH,EAAE,WAAW,GAAG,SAChB,KACA;AACA,QAAO,oBAACD,YAAgB,OAAjB;EAA4B;EAAK,WAAW,GAAGC,2BAAO,MAAM,GAAG,aAAa;EAAM,GAAI;EAAS,CAAA;EACtG"}

package/dist/dialog/dialog.css

@@ -0,0 +1,120 @@
+@layer theme, base;
+
+@layer components {
+  .backdrop_VsZA5W {
+    z-index: var(--z-overlay);
+    transition: opacity var(--duration-slow) var(--easing-standard);
+    background-color: #0000007a;
+    position: fixed;
+    inset: 0;
+  }
+
+  .backdrop_VsZA5W[data-starting-style], .backdrop_VsZA5W[data-ending-style] {
+    opacity: 0;
+  }
+
+  .popup_VsZA5W {
+    z-index: var(--z-modal);
+    background-color: var(--color-bg-elevated);
+    border: var(--border-width-base) solid var(--color-border-base);
+    border-radius: var(--radius-2xl);
+    box-shadow: var(--shadow-xl);
+    padding: var(--space-6);
+    width: min(480px, calc(100vw - var(--space-8)));
+    max-height: min(640px, calc(100vh - var(--space-8)));
+    gap: var(--space-4);
+    transition: opacity .2s var(--easing-ease-out),
+      transform .2s var(--easing-spring);
+    outline: none;
+    flex-direction: column;
+    display: flex;
+    position: fixed;
+    top: 50%;
+    left: 50%;
+    overflow: hidden;
+    transform: translate(-50%, -50%);
+  }
+
+  .popup_VsZA5W[data-starting-style] {
+    opacity: 0;
+    transform: translate(-50%, -48%) scale(.96);
+  }
+
+  .popup_VsZA5W[data-ending-style] {
+    opacity: 0;
+    transition: opacity .15s var(--easing-ease-in),
+      transform .15s var(--easing-ease-in);
+    transform: translate(-50%, -50%) scale(.98);
+  }
+
+  .header_VsZA5W {
+    gap: var(--space-1);
+    flex-direction: column;
+    display: flex;
+  }
+
+  .title_VsZA5W {
+    font-family: var(--font-mono);
+    font-size: var(--font-size-lg);
+    font-weight: var(--font-weight-semibold);
+    color: var(--color-text-primary);
+    line-height: var(--line-height-tight);
+    letter-spacing: var(--letter-spacing-tight);
+    padding-right: var(--space-6);
+  }
+
+  .description_VsZA5W {
+    font-family: var(--font-mono);
+    font-size: var(--font-size-sm);
+    color: var(--color-text-secondary);
+    line-height: var(--line-height-relaxed);
+  }
+
+  .close_VsZA5W {
+    top: var(--space-4);
+    right: var(--space-4);
+    border-radius: var(--radius-sm);
+    width: 24px;
+    height: 24px;
+    color: var(--color-text-tertiary);
+    cursor: pointer;
+    transition: background-color var(--duration-fast) var(--easing-standard),
+      color var(--duration-fast) var(--easing-standard);
+    background: none;
+    border: none;
+    outline: none;
+    justify-content: center;
+    align-items: center;
+    display: flex;
+    position: absolute;
+  }
+
+  .close_VsZA5W:hover {
+    background-color: var(--color-surface-hover);
+    color: var(--color-text-primary);
+  }
+
+  .close_VsZA5W:focus-visible {
+    box-shadow: var(--shadow-focus);
+  }
+
+  .body_VsZA5W {
+    font-family: var(--font-mono);
+    font-size: var(--font-size-sm);
+    color: var(--color-text-secondary);
+    line-height: var(--line-height-relaxed);
+    flex: 1;
+    overflow-y: auto;
+  }
+
+  .footer_VsZA5W {
+    justify-content: flex-end;
+    align-items: center;
+    gap: var(--space-2);
+    padding-top: var(--space-2);
+    border-top: var(--border-width-base) solid var(--color-border-subtle);
+    display: flex;
+  }
+}
+
+@layer utilities;

package/dist/dialog/dialog.d.ts

@@ -0,0 +1,32 @@
+import { ReactElement, ReactNode } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import styles from "./dialog.module.css";
+
+//#region src/dialog/dialog.d.ts
+interface DialogProps {
+  open?: boolean;
+  defaultOpen?: boolean;
+  /** `eventDetails` is the base-ui event details object. */
+  onOpenChange?: (open: boolean, eventDetails: unknown) => void;
+  trigger?: ReactElement;
+  title?: ReactNode;
+  description?: ReactNode;
+  children?: ReactNode;
+  footer?: ReactNode;
+  className?: string;
+  dismissible?: boolean;
+}
+declare function Dialog({
+  trigger,
+  title,
+  description,
+  children,
+  footer,
+  className,
+  dismissible,
+  onOpenChange,
+  ...props
+}: DialogProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Dialog, DialogProps, styles };
+//# sourceMappingURL=dialog.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"dialog.d.ts","names":[],"sources":["../../src/dialog/dialog.tsx"],"mappings":";;;;;UAIiB,WAAA;EACf,IAAA;EACA,WAAA;EAFe;EAIf,YAAA,IAAgB,IAAA,WAAe,YAAA;EAC/B,OAAA,GAAU,YAAA;EACV,KAAA,GAAQ,SAAA;EACR,WAAA,GAAc,SAAA;EACd,QAAA,GAAW,SAAA;EACX,MAAA,GAAS,SAAA;EACT,SAAA;EACA,WAAA;AAAA;AAAA,iBAWc,MAAA,CAAA;EACd,OAAA;EACA,KAAA;EACA,WAAA;EACA,QAAA;EACA,MAAA;EACA,SAAA;EACA,WAAA;EACA,YAAA;EAAA,GACG;AAAA,GACF,WAAA,GAAW,kBAAA,CAAA,GAAA,CAAA,OAAA"}