@devalok/shilp-sutra 0.53.0 → 0.55.0

package/dist/composed/bulk-action-bar.js

@@ -8,152 +8,123 @@ import * as a from "react";
 import { jsx as o, jsxs as s } from "react/jsx-runtime";
 import { createPortal as c } from "react-dom";
 import { IconX as l } from "@tabler/icons-react";
-import { AnimatePresence as u, motion as d } from "framer-motion";
+import { AnimatePresence as u, motion as d, useReducedMotion as f } from "framer-motion";
 //#region src/composed/bulk-action-bar.tsx
-var f = a.forwardRef(function({ action: t, tabIndex: n }, r) {
-	let [c, l] = a.useState(!1);
-	return c ? /* @__PURE__ */ s(d.div, {
-		ref: r,
-		initial: {
-			opacity: 0,
-			scale: .95
-		},
-		animate: {
-			opacity: 1,
-			scale: 1
-		},
-		exit: {
-			opacity: 0,
-			scale: .95
-		},
-		transition: e.snappy,
-		className: "flex items-center gap-ds-02",
-		tabIndex: n,
-		children: [
-			/* @__PURE__ */ o("span", {
-				className: "text-body-sm text-surface-fg-muted whitespace-nowrap",
-				children: t.confirmMessage ?? "Are you sure?"
-			}),
-			/* @__PURE__ */ o(i, {
-				variant: "solid",
-				size: "sm",
-				color: "error",
-				onClick: () => {
-					l(!1), t.onClick();
-				},
-				children: "Confirm"
-			}),
-			/* @__PURE__ */ o(i, {
-				variant: "ghost",
-				size: "sm",
-				onClick: () => l(!1),
-				children: "Cancel"
-			})
-		]
-	}) : /* @__PURE__ */ o(d.div, {
-		ref: r,
-		initial: {
-			opacity: 0,
-			scale: .95
-		},
-		animate: {
-			opacity: 1,
-			scale: 1
-		},
-		exit: {
-			opacity: 0,
-			scale: .95
-		},
-		transition: e.snappy,
-		tabIndex: n,
-		children: /* @__PURE__ */ o(i, {
-			variant: "ghost",
-			size: "sm",
-			color: t.color === "error" ? "error" : "accent",
-			disabled: t.disabled,
-			onClick: t.requiresConfirmation ? () => l(!0) : t.onClick,
-			startIcon: t.icon ?? void 0,
-			tabIndex: -1,
-			children: t.label
-		})
-	});
-});
-function p({ show: p, count: m, onClearSelection: h, actions: g, totalCount: _, onSelectAll: v, className: y }) {
-	let [b, x] = a.useState(!1), [S, C] = a.useState(0), w = a.useRef([]);
+var p = a.forwardRef(function({ show: p, count: m, onClearSelection: h, actions: g, totalCount: _, onSelectAll: v, className: y, ...b }, x) {
+	let S = f(), [C, w] = a.useState(!1), [T, E] = a.useState(0), [D, O] = a.useState(null), k = a.useRef([]), A = a.useRef(null), j = _ != null && _ > m && !!v, M = +!!j, N = M + g.length + 1;
 	a.useEffect(() => {
-		C(0);
+		w(!0);
+	}, []), a.useEffect(() => {
+		E(0), O(null);
 	}, [g.length]), a.useEffect(() => {
-		x(!0);
-	}, []);
-	function T(e) {
+		D != null && A.current?.focus();
+	}, [D]);
+	let P = (e) => {
+		let t = (e + N) % N;
+		E(t), k.current[t]?.focus();
+	};
+	function F(e) {
 		if (e.key === "Escape") {
-			e.preventDefault(), h();
+			e.preventDefault(), D == null ? h() : (O(null), P(T));
 			return;
 		}
-		let t = g.length;
-		if (t !== 0) {
-			if (e.key === "ArrowRight") {
-				e.preventDefault();
-				let n = (S + 1) % t;
-				C(n), w.current[n]?.focus();
-			} else if (e.key === "ArrowLeft") {
-				e.preventDefault();
-				let n = (S - 1 + t) % t;
-				C(n), w.current[n]?.focus();
-			} else if (e.key === "Home") e.preventDefault(), C(0), w.current[0]?.focus();
-			else if (e.key === "End") {
-				e.preventDefault();
-				let n = t - 1;
-				C(n), w.current[n]?.focus();
-			}
-		}
+		if (D != null) return;
+		let t = e.currentTarget.dir === "rtl" || document.dir === "rtl", n = t ? "ArrowLeft" : "ArrowRight", r = t ? "ArrowRight" : "ArrowLeft";
+		e.key === n ? (e.preventDefault(), P(T + 1)) : e.key === r ? (e.preventDefault(), P(T - 1)) : e.key === "Home" ? (e.preventDefault(), P(0)) : e.key === "End" && (e.preventDefault(), P(N - 1));
 	}
-	return b ? c(/* @__PURE__ */ o(u, { children: p && /* @__PURE__ */ s(d.div, {
-		initial: {
+	if (!C) return null;
+	let I = S ? { duration: 0 } : e.smooth;
+	return c(/* @__PURE__ */ o(u, { children: p && /* @__PURE__ */ s(d.div, {
+		ref: x,
+		initial: S ? { opacity: 0 } : {
 			y: 100,
 			opacity: 0
 		},
-		animate: {
+		animate: S ? { opacity: 1 } : {
 			y: 0,
 			opacity: 1
 		},
-		exit: {
+		exit: S ? { opacity: 0 } : {
 			y: 100,
 			opacity: 0
 		},
-		transition: e.snappy,
-		className: t("fixed bottom-ds-06 left-1/2 z-sticky -translate-x-1/2", "flex items-center gap-ds-04 rounded-surface bg-surface-overlay px-ds-05 py-ds-03 shadow-floating", y),
+		transition: I,
+		className: t("fixed bottom-ds-06 start-1/2 z-sticky -translate-x-1/2", "flex items-center gap-ds-04 rounded-surface bg-surface-overlay px-ds-05 py-ds-03 shadow-floating", y),
 		role: "toolbar",
 		"aria-label": `${m} items selected`,
-		onKeyDown: T,
+		onKeyDown: F,
+		...b,
 		children: [
 			/* @__PURE__ */ s(r, {
 				variant: "solid",
 				size: "sm",
 				children: [m, " selected"]
 			}),
-			_ != null && _ > m && v && /* @__PURE__ */ s(i, {
+			j && /* @__PURE__ */ s(i, {
+				ref: (e) => {
+					k.current[0] = e;
+				},
 				variant: "link",
 				size: "xs",
+				tabIndex: T === 0 ? 0 : -1,
 				onClick: v,
 				children: ["Select all ", _]
 			}),
 			/* @__PURE__ */ o("div", {
 				className: "flex items-center gap-ds-02",
-				children: /* @__PURE__ */ o(u, {
-					mode: "popLayout",
-					children: g.map((e, t) => /* @__PURE__ */ o(f, {
+				children: g.map((e, t) => {
+					let n = M + t;
+					return D === t ? /* @__PURE__ */ s("div", {
+						role: "group",
+						"aria-live": "assertive",
+						className: "flex items-center gap-ds-02",
+						children: [
+							/* @__PURE__ */ o("span", {
+								className: "whitespace-nowrap text-body-sm text-surface-fg-muted",
+								children: e.confirmMessage ?? "Are you sure?"
+							}),
+							/* @__PURE__ */ o(i, {
+								ref: A,
+								variant: "solid",
+								size: "sm",
+								color: e.color === "error" ? "error" : e.color ?? "accent",
+								onClick: () => {
+									O(null), e.onClick();
+								},
+								children: "Confirm"
+							}),
+							/* @__PURE__ */ o(i, {
+								variant: "ghost",
+								size: "sm",
+								onClick: () => {
+									O(null), P(n);
+								},
+								children: "Cancel"
+							})
+						]
+					}, e.label) : /* @__PURE__ */ o(i, {
 						ref: (e) => {
-							w.current[t] = e;
+							k.current[n] = e;
 						},
-						action: e,
-						tabIndex: t === S ? 0 : -1
-					}, e.label))
+						variant: "ghost",
+						size: "sm",
+						color: e.color ?? "accent",
+						disabled: e.disabled,
+						loading: e.loading,
+						startIcon: e.icon ?? void 0,
+						tabIndex: T === n ? 0 : -1,
+						onClick: e.requiresConfirmation ? () => O(t) : e.onClick,
+						children: e.label
+					}, e.label);
 				})
 			}),
 			/* @__PURE__ */ o(i, {
+				ref: (e) => {
+					k.current[N - 1] = e;
+				},
 				variant: "ghost",
 				size: "icon-sm",
+				tabIndex: T === N - 1 ? 0 : -1,
 				onClick: h,
 				"aria-label": "Clear selection",
 				children: /* @__PURE__ */ o(n, {
@@ -162,8 +133,8 @@ function p({ show: p, count: m, onClearSelection: h, actions: g, totalCount: _,
 				})
 			})
 		]
-	}) }), document.body) : null;
-}
+	}) }), document.body);
+});
 p.displayName = "BulkActionBar";
 //#endregion
 export { p as BulkActionBar };

package/dist/composed/bulk-action-bar.js.map

@@ -1 +1 @@
-{"version":3,"file":"bulk-action-bar.js","names":[],"sources":["../../src/composed/bulk-action-bar.tsx"],"sourcesContent":["'use client'\n\nimport { IconX } from '@tabler/icons-react'\nimport { AnimatePresence, motion } from 'framer-motion'\nimport * as React from 'react'\nimport { createPortal } from 'react-dom'\n\nimport { Badge } from '../ui/badge'\nimport { Button } from '../ui/button'\nimport { Icon } from '../ui/icon'\nimport type { IconInput } from '../ui/lib/icon-input'\nimport { springs } from '../ui/lib/motion'\nimport { cn } from '../ui/lib/utils'\n\n// ============================================================\n// Types\n// ============================================================\n\nexport interface BulkActionBarAction {\n  label: string\n  icon?: IconInput\n  onClick: () => void\n  color?: 'accent' | 'error'\n  disabled?: boolean\n  /** Show inline confirmation before executing the action */\n  requiresConfirmation?: boolean\n  /** Custom confirmation message @default 'Are you sure?' */\n  confirmMessage?: string\n}\n\nexport interface BulkActionBarProps {\n  show: boolean\n  count: number\n  onClearSelection: () => void\n  actions: BulkActionBarAction[]\n  /** Total number of items available for selection */\n  totalCount?: number\n  /** Called when user clicks \"Select all\" */\n  onSelectAll?: () => void\n  className?: string\n}\n\n// ============================================================\n// ActionButton — handles inline confirmation\n// ============================================================\n\nconst ActionButton = React.forwardRef<HTMLDivElement, { action: BulkActionBarAction; tabIndex?: number }>(function ActionButton({ action, tabIndex }, ref) {\n  const [confirming, setConfirming] = React.useState(false)\n\n  if (confirming) {\n    return (\n      <motion.div\n        ref={ref}\n        initial={{ opacity: 0, scale: 0.95 }}\n        animate={{ opacity: 1, scale: 1 }}\n        exit={{ opacity: 0, scale: 0.95 }}\n        transition={springs.snappy}\n        className=\"flex items-center gap-ds-02\"\n        tabIndex={tabIndex}\n      >\n        <span className=\"text-body-sm text-surface-fg-muted whitespace-nowrap\">\n          {action.confirmMessage ?? 'Are you sure?'}\n        </span>\n        <Button\n          variant=\"solid\"\n          size=\"sm\"\n          color=\"error\"\n          onClick={() => {\n            setConfirming(false)\n            action.onClick()\n          }}\n        >\n          Confirm\n        </Button>\n        <Button\n          variant=\"ghost\"\n          size=\"sm\"\n          onClick={() => setConfirming(false)}\n        >\n          Cancel\n        </Button>\n      </motion.div>\n    )\n  }\n\n  return (\n    <motion.div\n      ref={ref}\n      initial={{ opacity: 0, scale: 0.95 }}\n      animate={{ opacity: 1, scale: 1 }}\n      exit={{ opacity: 0, scale: 0.95 }}\n      transition={springs.snappy}\n      tabIndex={tabIndex}\n    >\n      <Button\n        variant=\"ghost\"\n        size=\"sm\"\n        color={action.color === 'error' ? 'error' : 'accent'}\n        disabled={action.disabled}\n        onClick={action.requiresConfirmation ? () => setConfirming(true) : action.onClick}\n        startIcon={action.icon ?? undefined}\n        tabIndex={-1}\n      >\n        {action.label}\n      </Button>\n    </motion.div>\n  )\n})\n\n// ============================================================\n// BulkActionBar\n// ============================================================\n\nfunction BulkActionBar({\n  show,\n  count,\n  onClearSelection,\n  actions,\n  totalCount,\n  onSelectAll,\n  className,\n}: BulkActionBarProps) {\n  const [mounted, setMounted] = React.useState(false)\n  const [focusedIndex, setFocusedIndex] = React.useState(0)\n  const actionRefs = React.useRef<(HTMLDivElement | null)[]>([])\n\n  // Reset focused index when actions change\n  React.useEffect(() => {\n    setFocusedIndex(0)\n  }, [actions.length])\n\n  React.useEffect(() => {\n    setMounted(true)\n  }, [])\n\n  function handleKeyDown(e: React.KeyboardEvent) {\n    if (e.key === 'Escape') {\n      e.preventDefault()\n      onClearSelection()\n      return\n    }\n\n    const count = actions.length\n    if (count === 0) return\n\n    if (e.key === 'ArrowRight') {\n      e.preventDefault()\n      const next = (focusedIndex + 1) % count\n      setFocusedIndex(next)\n      actionRefs.current[next]?.focus()\n    } else if (e.key === 'ArrowLeft') {\n      e.preventDefault()\n      const prev = (focusedIndex - 1 + count) % count\n      setFocusedIndex(prev)\n      actionRefs.current[prev]?.focus()\n    } else if (e.key === 'Home') {\n      e.preventDefault()\n      setFocusedIndex(0)\n      actionRefs.current[0]?.focus()\n    } else if (e.key === 'End') {\n      e.preventDefault()\n      const last = count - 1\n      setFocusedIndex(last)\n      actionRefs.current[last]?.focus()\n    }\n  }\n\n  if (!mounted) return null\n\n  return createPortal(\n    <AnimatePresence>\n      {show && (\n        <motion.div\n          initial={{ y: 100, opacity: 0 }}\n          animate={{ y: 0, opacity: 1 }}\n          exit={{ y: 100, opacity: 0 }}\n          transition={springs.snappy}\n          className={cn(\n            'fixed bottom-ds-06 left-1/2 z-sticky -translate-x-1/2',\n            'flex items-center gap-ds-04 rounded-surface bg-surface-overlay px-ds-05 py-ds-03 shadow-floating',\n            className,\n          )}\n          role=\"toolbar\"\n          aria-label={`${count} items selected`}\n          onKeyDown={handleKeyDown}\n        >\n          <Badge variant=\"solid\" size=\"sm\">\n            {count} selected\n          </Badge>\n\n          {totalCount != null && totalCount > count && onSelectAll && (\n            <Button variant=\"link\" size=\"xs\" onClick={onSelectAll}>\n              Select all {totalCount}\n            </Button>\n          )}\n\n          <div className=\"flex items-center gap-ds-02\">\n            <AnimatePresence mode=\"popLayout\">\n              {actions.map((action, i) => (\n                <ActionButton\n                  key={action.label}\n                  ref={(el: HTMLDivElement | null) => { actionRefs.current[i] = el }}\n                  action={action}\n                  tabIndex={i === focusedIndex ? 0 : -1}\n                />\n              ))}\n            </AnimatePresence>\n          </div>\n\n          <Button\n            variant=\"ghost\"\n            size=\"icon-sm\"\n            onClick={onClearSelection}\n            aria-label=\"Clear selection\"\n          >\n            <Icon icon={IconX} size=\"sm\" />\n          </Button>\n        </motion.div>\n      )}\n    </AnimatePresence>,\n    document.body,\n  )\n}\n\nBulkActionBar.displayName = 'BulkActionBar'\n\nexport { BulkActionBar }\n"],"mappings":"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"}
+{"version":3,"file":"bulk-action-bar.js","names":[],"sources":["../../src/composed/bulk-action-bar.tsx"],"sourcesContent":["'use client'\n\nimport { IconX } from '@tabler/icons-react'\nimport { AnimatePresence, motion, useReducedMotion } from 'framer-motion'\nimport * as React from 'react'\nimport { createPortal } from 'react-dom'\n\nimport { Badge } from '../ui/badge'\nimport { Button } from '../ui/button'\nimport { Icon } from '../ui/icon'\nimport type { IconInput } from '../ui/lib/icon-input'\nimport { springs } from '../ui/lib/motion'\nimport { cn } from '../ui/lib/utils'\n\ntype ButtonColor = React.ComponentProps<typeof Button>['color']\n\nexport interface BulkActionBarAction {\n  label: string\n  icon?: IconInput\n  onClick: () => void\n  /** Any Button color. @default 'accent' (or 'error' for destructive). */\n  color?: ButtonColor\n  disabled?: boolean\n  /** Show a pending spinner on the action (e.g. slow bulk op in flight). */\n  loading?: boolean\n  /** Show inline confirmation before executing the action. */\n  requiresConfirmation?: boolean\n  /** Custom confirmation message. @default 'Are you sure?' */\n  confirmMessage?: string\n}\n\nexport interface BulkActionBarProps\n  extends Omit<\n    React.HTMLAttributes<HTMLDivElement>,\n    // Keys whose types collide with framer-motion's HTMLMotionProps.\n    'children' | 'color' | 'onDrag' | 'onDragStart' | 'onDragEnd' | 'onAnimationStart' | 'onAnimationEnd' | 'onAnimationIteration' | 'style'\n  > {\n  show: boolean\n  count: number\n  onClearSelection: () => void\n  actions: BulkActionBarAction[]\n  /** Total items available for selection (enables \"Select all\"). */\n  totalCount?: number\n  /** Called when the user clicks \"Select all\". */\n  onSelectAll?: () => void\n}\n\n/**\n * BulkActionBar — floating selection toolbar. Follows the ARIA toolbar model:\n * a single tab stop with roving focus (Arrow keys / Home / End) across ALL\n * controls (Select-all, actions, Clear), focus landing on the real buttons so\n * Enter/Space activate them. Arrow direction mirrors under `dir=\"rtl\"`. Escape\n * clears the selection (or cancels a pending confirmation).\n */\nconst BulkActionBar = React.forwardRef<HTMLDivElement, BulkActionBarProps>(\n  function BulkActionBar(\n    { show, count, onClearSelection, actions, totalCount, onSelectAll, className, ...props },\n    forwardedRef,\n  ) {\n    const reduced = useReducedMotion()\n    const [mounted, setMounted] = React.useState(false)\n    const [focusedIndex, setFocusedIndex] = React.useState(0)\n    const [confirming, setConfirming] = React.useState<number | null>(null)\n    const controlRefs = React.useRef<Array<HTMLButtonElement | null>>([])\n    const confirmRef = React.useRef<HTMLButtonElement | null>(null)\n\n    const hasSelectAll = totalCount != null && totalCount > count && !!onSelectAll\n    const selectAllOffset = hasSelectAll ? 1 : 0\n    const total = selectAllOffset + actions.length + 1 // + Clear\n\n    React.useEffect(() => { setMounted(true) }, [])\n    React.useEffect(() => { setFocusedIndex(0); setConfirming(null) }, [actions.length])\n    // Move focus to Confirm when a confirmation opens.\n    React.useEffect(() => {\n      if (confirming != null) confirmRef.current?.focus()\n    }, [confirming])\n\n    const focusAt = (i: number) => {\n      const clamped = (i + total) % total\n      setFocusedIndex(clamped)\n      controlRefs.current[clamped]?.focus()\n    }\n\n    function handleKeyDown(e: React.KeyboardEvent<HTMLDivElement>) {\n      if (e.key === 'Escape') {\n        e.preventDefault()\n        if (confirming != null) { setConfirming(null); focusAt(focusedIndex) }\n        else onClearSelection()\n        return\n      }\n      if (confirming != null) return // roving suspended during confirm\n      const rtl = e.currentTarget.dir === 'rtl' || document.dir === 'rtl'\n      const fwd = rtl ? 'ArrowLeft' : 'ArrowRight'\n      const back = rtl ? 'ArrowRight' : 'ArrowLeft'\n      if (e.key === fwd) { e.preventDefault(); focusAt(focusedIndex + 1) }\n      else if (e.key === back) { e.preventDefault(); focusAt(focusedIndex - 1) }\n      else if (e.key === 'Home') { e.preventDefault(); focusAt(0) }\n      else if (e.key === 'End') { e.preventDefault(); focusAt(total - 1) }\n    }\n\n    if (!mounted) return null\n\n    const slideTransition = reduced ? { duration: 0 } : springs.smooth\n\n    return createPortal(\n      <AnimatePresence>\n        {show && (\n          <motion.div\n            ref={forwardedRef}\n            initial={reduced ? { opacity: 0 } : { y: 100, opacity: 0 }}\n            animate={reduced ? { opacity: 1 } : { y: 0, opacity: 1 }}\n            exit={reduced ? { opacity: 0 } : { y: 100, opacity: 0 }}\n            transition={slideTransition}\n            className={cn(\n              'fixed bottom-ds-06 start-1/2 z-sticky -translate-x-1/2',\n              'flex items-center gap-ds-04 rounded-surface bg-surface-overlay px-ds-05 py-ds-03 shadow-floating',\n              className,\n            )}\n            role=\"toolbar\"\n            aria-label={`${count} items selected`}\n            onKeyDown={handleKeyDown}\n            {...props}\n          >\n            <Badge variant=\"solid\" size=\"sm\">{count} selected</Badge>\n\n            {hasSelectAll && (\n              <Button\n                ref={(el) => { controlRefs.current[0] = el }}\n                variant=\"link\"\n                size=\"xs\"\n                tabIndex={focusedIndex === 0 ? 0 : -1}\n                onClick={onSelectAll}\n              >\n                Select all {totalCount}\n              </Button>\n            )}\n\n            <div className=\"flex items-center gap-ds-02\">\n              {actions.map((action, i) => {\n                const controlIndex = selectAllOffset + i\n                const isConfirming = confirming === i\n                if (isConfirming) {\n                  return (\n                    <div\n                      key={action.label}\n                      role=\"group\"\n                      aria-live=\"assertive\"\n                      className=\"flex items-center gap-ds-02\"\n                    >\n                      <span className=\"whitespace-nowrap text-body-sm text-surface-fg-muted\">\n                        {action.confirmMessage ?? 'Are you sure?'}\n                      </span>\n                      <Button\n                        ref={confirmRef}\n                        variant=\"solid\"\n                        size=\"sm\"\n                        color={action.color === 'error' ? 'error' : (action.color ?? 'accent')}\n                        onClick={() => { setConfirming(null); action.onClick() }}\n                      >\n                        Confirm\n                      </Button>\n                      <Button\n                        variant=\"ghost\"\n                        size=\"sm\"\n                        onClick={() => { setConfirming(null); focusAt(controlIndex) }}\n                      >\n                        Cancel\n                      </Button>\n                    </div>\n                  )\n                }\n                return (\n                  <Button\n                    key={action.label}\n                    ref={(el) => { controlRefs.current[controlIndex] = el }}\n                    variant=\"ghost\"\n                    size=\"sm\"\n                    color={action.color ?? 'accent'}\n                    disabled={action.disabled}\n                    loading={action.loading}\n                    startIcon={action.icon ?? undefined}\n                    tabIndex={focusedIndex === controlIndex ? 0 : -1}\n                    onClick={action.requiresConfirmation ? () => setConfirming(i) : action.onClick}\n                  >\n                    {action.label}\n                  </Button>\n                )\n              })}\n            </div>\n\n            <Button\n              ref={(el) => { controlRefs.current[total - 1] = el }}\n              variant=\"ghost\"\n              size=\"icon-sm\"\n              tabIndex={focusedIndex === total - 1 ? 0 : -1}\n              onClick={onClearSelection}\n              aria-label=\"Clear selection\"\n            >\n              <Icon icon={IconX} size=\"sm\" />\n            </Button>\n          </motion.div>\n        )}\n      </AnimatePresence>,\n      document.body,\n    )\n  },\n)\nBulkActionBar.displayName = 'BulkActionBar'\n\nexport { BulkActionBar }\n"],"mappings":"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"}

package/dist/composed/command-palette.d.ts

@@ -1,5 +1,4 @@
-"use client";
-import { IconInput } from '../ui/lib/icon-input';
+import { IconInput } from '../ui/lib/icon-input.js';
 import * as React from 'react';
 export interface CommandItem {
     id: string;

package/dist/composed/confirm-dialog.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 export interface ConfirmDialogProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'color'> {
     /** Whether the dialog is open */

package/dist/composed/date-picker/calendar-grid.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 export interface CalendarEvent {
     date: Date;

package/dist/composed/date-picker/date-picker.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 /**
  * A popover-based date picker with day/month/year drill-down views.

package/dist/composed/date-picker/date-range-picker.d.ts

@@ -1,5 +1,4 @@
-"use client";
-import { PresetKey } from './presets';
+import { PresetKey } from './presets.js';
 import * as React from 'react';
 export interface DateRangePickerProps extends Omit<React.ComponentPropsWithoutRef<'button'>, 'onChange'> {
     startDate?: Date | null;

package/dist/composed/date-picker/date-time-picker.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 export interface DateTimePickerProps extends Omit<React.ComponentPropsWithoutRef<'button'>, 'onChange' | 'value'> {
     /** The currently selected date and time. */

package/dist/composed/date-picker/index.d.ts

@@ -1,19 +1,18 @@
-"use client";
-export type { CalendarEvent, CalendarGridProps } from './calendar-grid';
-export { CalendarGrid } from './calendar-grid';
-export type { DatePickerProps } from './date-picker';
-export { DatePicker } from './date-picker';
-export type { DateRangePickerProps } from './date-range-picker';
-export { DateRangePicker } from './date-range-picker';
-export type { DateTimePickerProps } from './date-time-picker';
-export { DateTimePicker } from './date-time-picker';
-export type { MonthPickerProps } from './month-picker';
-export { MonthPicker } from './month-picker';
-export type { PresetKey, PresetsProps } from './presets';
-export { Presets } from './presets';
-export type { TimePickerProps } from './time-picker';
-export { TimePicker } from './time-picker';
-export { useCalendar } from './use-calendar';
-export type { YearPickerProps } from './year-picker';
-export { YearPicker } from './year-picker';
+export type { CalendarEvent, CalendarGridProps } from './calendar-grid.js';
+export { CalendarGrid } from './calendar-grid.js';
+export type { DatePickerProps } from './date-picker.js';
+export { DatePicker } from './date-picker.js';
+export type { DateRangePickerProps } from './date-range-picker.js';
+export { DateRangePicker } from './date-range-picker.js';
+export type { DateTimePickerProps } from './date-time-picker.js';
+export { DateTimePicker } from './date-time-picker.js';
+export type { MonthPickerProps } from './month-picker.js';
+export { MonthPicker } from './month-picker.js';
+export type { PresetKey, PresetsProps } from './presets.js';
+export { Presets } from './presets.js';
+export type { TimePickerProps } from './time-picker.js';
+export { TimePicker } from './time-picker.js';
+export { useCalendar } from './use-calendar.js';
+export type { YearPickerProps } from './year-picker.js';
+export { YearPicker } from './year-picker.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/composed/date-picker/month-picker.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 export interface MonthPickerProps extends React.ComponentPropsWithoutRef<'div'> {
     currentYear: number;

package/dist/composed/date-picker/presets.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 export type PresetKey = 'today' | 'yesterday' | 'last7days' | 'last30days' | 'thisMonth' | 'lastMonth' | 'thisYear';
 export interface PresetsProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'onSelect'> {

package/dist/composed/date-picker/time-picker.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 export interface TimePickerProps extends Omit<React.ComponentPropsWithoutRef<'button'>, 'onChange' | 'value'> {
     /** The currently selected time (as a Date object). */

package/dist/composed/date-picker/use-calendar.d.ts

@@ -1,4 +1,3 @@
-"use client";
 export declare function useCalendar(initialMonth?: Date): {
     currentMonth: Date;
     setCurrentMonth: import('react').Dispatch<import('react').SetStateAction<Date>>;

package/dist/composed/date-picker/year-picker.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 export interface YearPickerProps extends React.ComponentPropsWithoutRef<'div'> {
     currentYear: number;

package/dist/composed/deadline-indicator.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 export interface DeadlineIndicatorProps extends React.HTMLAttributes<HTMLSpanElement> {
     deadline: Date | string;

package/dist/composed/diff.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 export type DiffMode = 'inline' | 'split' | 'fields';
 export type DiffGranularity = 'line' | 'word';

package/dist/composed/emoji-picker.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 export interface EmojiData {
     id: string;

package/dist/composed/empty-state.d.ts

@@ -1,5 +1,4 @@
-"use client";
-import { IconInput } from '../ui/lib/icon-input';
+import { IconInput } from '../ui/lib/icon-input.js';
 import * as React from 'react';
 export interface EmptyStateProps extends React.HTMLAttributes<HTMLDivElement> {
     /** Icon. Accepts any `IconInput`. Falls back to the Devalok chakra glyph. */

package/dist/composed/error-boundary.d.ts

@@ -1,18 +1,27 @@
-"use client";
 import * as React from 'react';
 export interface ErrorDisplayProps extends React.ComponentPropsWithoutRef<'div'> {
     error: unknown;
     onReset?: () => void;
+    /** Custom recovery actions. When set, replaces the default "Try Again" button. */
+    actions?: React.ReactNode;
+    /** Center in a full-viewport-height region (error page). @default true */
+    fullPage?: boolean;
+    /** Move focus to the recovery button on mount (set by ErrorBoundary on swap). @default false */
+    autoFocusReset?: boolean;
 }
 declare const ErrorDisplay: React.ForwardRefExoticComponent<ErrorDisplayProps & React.RefAttributes<HTMLDivElement>>;
 interface ErrorBoundaryProps {
     children: React.ReactNode;
-    /** Optional callback when the user clicks "Try Again" */
+    /** Called when the user clicks "Try Again" (after the boundary resets). */
     onReset?: () => void;
-    /** Optional custom fallback — receives the caught error. Defaults to ErrorDisplay. */
+    /** Called when an error is caught — wire your logger/Sentry here. */
+    onError?: (error: unknown, info: React.ErrorInfo) => void;
+    /** Auto-reset when any value in this array changes (react-error-boundary parity). */
+    resetKeys?: unknown[];
+    /** Custom fallback — receives the caught error + a reset callback. Defaults to ErrorDisplay. */
     fallback?: (props: {
         error: unknown;
-        onReset?: () => void;
+        onReset: () => void;
     }) => React.ReactNode;
 }
 interface ErrorBoundaryState {
@@ -21,6 +30,8 @@ interface ErrorBoundaryState {
 declare class ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {
     constructor(props: ErrorBoundaryProps);
     static getDerivedStateFromError(error: unknown): ErrorBoundaryState;
+    componentDidCatch(error: unknown, info: React.ErrorInfo): void;
+    componentDidUpdate(prev: ErrorBoundaryProps): void;
     private handleReset;
     render(): string | number | bigint | boolean | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | React.JSX.Element | null | undefined;
 }

package/dist/composed/error-boundary.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"error-boundary.d.ts","sourceRoot":"","sources":["../../src/composed/error-boundary.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAQ9B,MAAM,WAAW,iBAAkB,SAAQ,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC;IAC9E,KAAK,EAAE,OAAO,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAmFD,QAAA,MAAM,YAAY,0FA2EjB,CAAA;AAID,UAAU,kBAAkB;IAC1B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,yDAAyD;IACzD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,sFAAsF;IACtF,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,KAAK,EAAE,OAAO,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,KAAK,CAAC,SAAS,CAAA;CAChF;AAED,UAAU,kBAAkB;IAC1B,KAAK,EAAE,OAAO,GAAG,IAAI,CAAA;CACtB;AAED,cAAM,aAAc,SAAQ,KAAK,CAAC,SAAS,CAAC,kBAAkB,EAAE,kBAAkB,CAAC;gBACrE,KAAK,EAAE,kBAAkB;IAKrC,MAAM,CAAC,wBAAwB,CAAC,KAAK,EAAE,OAAO,GAAG,kBAAkB;IAInE,OAAO,CAAC,WAAW,CAGlB;IAED,MAAM;CASP;AAED,OAAO,EAAE,aAAa,EAAC,YAAY,EAAE,CAAA;AACrC,YAAY,EAAE,kBAAkB,EAAE,CAAA"}
+{"version":3,"file":"error-boundary.d.ts","sourceRoot":"","sources":["../../src/composed/error-boundary.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAQ9B,MAAM,WAAW,iBAAkB,SAAQ,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC;IAC9E,KAAK,EAAE,OAAO,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,kFAAkF;IAClF,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,0EAA0E;IAC1E,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,gGAAgG;IAChG,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB;AAgDD,QAAA,MAAM,YAAY,0FAuDjB,CAAA;AAGD,UAAU,kBAAkB;IAC1B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,2EAA2E;IAC3E,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,qEAAqE;IACrE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,CAAC,SAAS,KAAK,IAAI,CAAA;IACzD,qFAAqF;IACrF,SAAS,CAAC,EAAE,OAAO,EAAE,CAAA;IACrB,gGAAgG;IAChG,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,KAAK,EAAE,OAAO,CAAC;QAAC,OAAO,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,KAAK,CAAC,SAAS,CAAA;CAC/E;AAED,UAAU,kBAAkB;IAC1B,KAAK,EAAE,OAAO,GAAG,IAAI,CAAA;CACtB;AAQD,cAAM,aAAc,SAAQ,KAAK,CAAC,SAAS,CAAC,kBAAkB,EAAE,kBAAkB,CAAC;gBACrE,KAAK,EAAE,kBAAkB;IAKrC,MAAM,CAAC,wBAAwB,CAAC,KAAK,EAAE,OAAO,GAAG,kBAAkB;IAInE,iBAAiB,CAAC,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,CAAC,SAAS;IAIvD,kBAAkB,CAAC,IAAI,EAAE,kBAAkB;IAO3C,OAAO,CAAC,WAAW,CAGlB;IAED,MAAM;CASP;AAED,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,CAAA;AACtC,YAAY,EAAE,kBAAkB,EAAE,CAAA"}

package/dist/composed/error-boundary.js

@@ -19,9 +19,12 @@ function d(e) {
 	if (typeof e == "string") return e;
 }
 function f(e) {
-	if (e instanceof Error) return e.stack;
+	return e instanceof Error ? e.stack : void 0;
 }
-function p(e) {
+function p() {
+	return typeof process < "u" && !!process.env && process.env.NODE_ENV === "development";
+}
+function m(e) {
 	switch (e) {
 		case 404: return {
 			icon: c,
@@ -53,71 +56,84 @@ function p(e) {
 		};
 	}
 }
-var m = r.forwardRef(function({ error: r, onReset: o, className: s, ...c }, l) {
-	let m = u(r), h = d(r), g = f(r), _ = typeof process < "u" && process.env && process.env.NODE_ENV === "development", v = p(m), y = v.icon;
-	return /* @__PURE__ */ i("div", {
-		ref: l,
-		...c,
-		className: e("flex min-h-[60vh] items-center justify-center p-ds-05", s),
+var h = r.forwardRef(function({ error: o, onReset: s, actions: c, fullPage: l = !0, autoFocusReset: h = !1, className: g, ..._ }, v) {
+	let y = u(o), b = d(o), x = f(o), S = p(), C = m(y), w = C.icon, T = r.useRef(null), E = S && b || C.message;
+	return r.useEffect(() => {
+		h && T.current?.focus();
+	}, [h]), /* @__PURE__ */ i("div", {
+		ref: v,
+		..._,
+		className: e("flex items-center justify-center p-ds-05", l && "min-h-[60vh]", g),
 		children: /* @__PURE__ */ a("div", {
+			role: "alert",
 			className: "flex w-full max-w-lg flex-col items-center gap-ds-06 rounded-overlay-lg bg-surface-raised p-ds-07 text-center shadow-raised",
 			children: [
 				/* @__PURE__ */ i("div", {
-					className: e("flex h-ds-lg w-ds-lg items-center justify-center rounded-bubble", v.bgClass),
+					className: e("flex h-ds-lg w-ds-lg items-center justify-center rounded-bubble", C.bgClass),
 					children: /* @__PURE__ */ i(t, {
-						icon: y,
+						icon: w,
 						size: "2xl",
-						className: v.iconClass
+						className: C.iconClass
 					})
 				}),
 				/* @__PURE__ */ a("div", {
 					className: "flex flex-col gap-ds-03",
 					children: [
-						m && /* @__PURE__ */ a("span", {
+						y && /* @__PURE__ */ a("span", {
 							className: "text-body-sm text-surface-fg-subtle",
-							children: ["Error ", m]
+							children: ["Error ", y]
 						}),
 						/* @__PURE__ */ i("h2", {
 							className: "text-heading-md font-semibold text-surface-fg",
-							children: v.title
+							children: C.title
 						}),
 						/* @__PURE__ */ i("p", {
 							className: "text-body-lg text-surface-fg-subtle",
-							children: h || v.message
+							children: E
 						})
 					]
 				}),
-				o && /* @__PURE__ */ i("div", {
+				(c || s) && /* @__PURE__ */ i("div", {
 					className: "flex items-center gap-ds-04",
-					children: /* @__PURE__ */ i(n, {
+					children: c ?? /* @__PURE__ */ i(n, {
+						ref: T,
 						variant: "soft",
 						size: "md",
-						onClick: o,
+						onClick: s,
 						children: "Try Again"
 					})
 				}),
-				_ && g && /* @__PURE__ */ a("div", {
-					className: "w-full overflow-auto rounded-surface border border-card-strong bg-surface-raised p-ds-05 text-left",
+				S && x && /* @__PURE__ */ a("div", {
+					className: "w-full overflow-auto rounded-surface border border-card bg-surface-raised p-ds-05 text-left",
 					children: [/* @__PURE__ */ i("p", {
 						className: "text-body-sm mb-ds-03 font-semibold text-surface-fg",
 						children: "Stack Trace (development only)"
 					}), /* @__PURE__ */ i("pre", {
 						className: "whitespace-pre-wrap text-body-sm text-surface-fg-subtle",
-						children: g
+						children: x
 					})]
 				})
 			]
 		})
 	});
 });
-m.displayName = "ErrorDisplay";
-var h = class extends r.Component {
+h.displayName = "ErrorDisplay";
+function g(e, t) {
+	return !e || !t ? !1 : e.length !== t.length || e.some((e, n) => !Object.is(e, t[n]));
+}
+var _ = class extends r.Component {
 	constructor(e) {
 		super(e), this.state = { error: null };
 	}
 	static getDerivedStateFromError(e) {
 		return { error: e };
 	}
+	componentDidCatch(e, t) {
+		this.props.onError?.(e, t);
+	}
+	componentDidUpdate(e) {
+		this.state.error !== null && g(e.resetKeys, this.props.resetKeys) && this.setState({ error: null });
+	}
 	handleReset = () => {
 		this.setState({ error: null }), this.props.onReset?.();
 	};
@@ -125,11 +141,12 @@ var h = class extends r.Component {
 		return this.state.error === null ? this.props.children : this.props.fallback ? this.props.fallback({
 			error: this.state.error,
 			onReset: this.handleReset
-		}) : /* @__PURE__ */ i(m, {
+		}) : /* @__PURE__ */ i(h, {
 			error: this.state.error,
-			onReset: this.handleReset
+			onReset: this.handleReset,
+			autoFocusReset: !0
 		});
 	}
 };
 //#endregion
-export { h as ErrorBoundary, m as ErrorDisplay };
+export { _ as ErrorBoundary, h as ErrorDisplay };