@ai-matrx/design-system 0.15.2 → 0.17.0

package/dist/index.js

@@ -1396,55 +1396,29 @@ function ConfirmDialog({
 }
 
 // src/confirm-host.tsx
-import {
-  _registerHost,
-  _unregisterHost
-} from "@ai-matrx/kit/confirm-opener";
+import { confirmOpener } from "@ai-matrx/kit/confirm-opener";
+import { useOpenerHost } from "@ai-matrx/kit/opener-react";
 import * as React14 from "react";
 import { jsx as jsx17 } from "react/jsx-runtime";
 function ConfirmDialogHost() {
-  const [active, setActive] = React14.useState(null);
-  const [tick, setTick] = React14.useState(0);
-  const queueRef = React14.useRef([]);
-  React14.useEffect(() => {
-    const controller = {
-      show: (opts, resolve) => {
-        queueRef.current.push({ opts, resolve });
-        setTick((n) => n + 1);
-      }
-    };
-    _registerHost(controller);
-    return () => _unregisterHost(controller);
-  }, []);
-  React14.useEffect(() => {
-    if (active === null && queueRef.current.length > 0) {
-      setActive(queueRef.current.shift());
-    }
-  }, [active, tick]);
-  const handleConfirm = React14.useCallback(() => {
-    if (!active) return;
-    active.resolve(true);
-    setActive(null);
-  }, [active]);
+  const { request, open, settle } = useOpenerHost(confirmOpener);
+  const handleConfirm = React14.useCallback(() => settle(true), [settle]);
   const handleOpenChange = React14.useCallback(
-    (open) => {
-      if (!open && active) {
-        active.resolve(false);
-        setActive(null);
-      }
+    (next) => {
+      if (!next) settle(false);
     },
-    [active]
+    [settle]
   );
   return /* @__PURE__ */ jsx17(
     ConfirmDialog,
     {
-      open: !!active,
+      open,
       onOpenChange: handleOpenChange,
-      title: active?.opts.title ?? "",
-      description: active?.opts.description,
-      confirmLabel: active?.opts.confirmLabel,
-      cancelLabel: active?.opts.cancelLabel,
-      variant: active?.opts.variant,
+      title: request?.title ?? "",
+      description: request?.description,
+      confirmLabel: request?.confirmLabel,
+      cancelLabel: request?.cancelLabel,
+      variant: request?.variant,
       onConfirm: handleConfirm
     }
   );
@@ -1586,8 +1560,8 @@ ContextMenuShortcut.displayName = "ContextMenuShortcut";
 
 // src/creatable-picker.tsx
 import {
-  useRef as useRef2,
-  useState as useState3
+  useRef,
+  useState as useState2
 } from "react";
 
 // src/popover.tsx
@@ -1659,11 +1633,11 @@ function CreatablePicker({
   renderSelected,
   size = "sm"
 }) {
-  const [open, setOpen] = useState3(false);
-  const [query, setQuery] = useState3("");
-  const [busy, setBusy] = useState3(false);
-  const inputRef = useRef2(null);
-  const [needsName, setNeedsName] = useState3(false);
+  const [open, setOpen] = useState2(false);
+  const [query, setQuery] = useState2("");
+  const [busy, setBusy] = useState2(false);
+  const inputRef = useRef(null);
+  const [needsName, setNeedsName] = useState2(false);
   const selected = options.find((option) => option.value === value) ?? null;
   const groups = [];
   for (const option of options) {
@@ -2208,7 +2182,7 @@ var DropdownMenuShortcut = ({
 DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
 
 // src/editable-label.tsx
-import { useCallback as useCallback3, useEffect as useEffect3, useRef as useRef3, useState as useState5 } from "react";
+import { useCallback as useCallback3, useEffect as useEffect2, useRef as useRef2, useState as useState4 } from "react";
 import { jsx as jsx23, jsxs as jsxs12 } from "react/jsx-runtime";
 function EditableLabel({
   value,
@@ -2229,16 +2203,16 @@ function EditableLabel({
   inputClassName
 }) {
   const controlled = activation === "controlled";
-  const [internalEditing, setInternalEditing] = useState5(false);
+  const [internalEditing, setInternalEditing] = useState4(false);
   const editing = controlled ? !!editingProp : internalEditing;
-  const [draft, setDraft] = useState5(value);
-  const [error, setError] = useState5(null);
-  const [busy, setBusy] = useState5(false);
-  const inputRef = useRef3(null);
-  useEffect3(() => {
+  const [draft, setDraft] = useState4(value);
+  const [error, setError] = useState4(null);
+  const [busy, setBusy] = useState4(false);
+  const inputRef = useRef2(null);
+  useEffect2(() => {
     if (!editing) setDraft(value);
   }, [value, editing]);
-  useEffect3(() => {
+  useEffect2(() => {
     if (editing && inputRef.current) {
       inputRef.current.focus();
       if (selectOnEdit) inputRef.current.select();
@@ -2515,7 +2489,7 @@ var Label3 = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ *
 Label3.displayName = LabelPrimitive.Root.displayName;
 
 // src/overflow-toolbar.tsx
-import { useLayoutEffect, useMemo, useRef as useRef4, useState as useState6 } from "react";
+import { useLayoutEffect, useMemo, useRef as useRef3, useState as useState5 } from "react";
 import { Fragment, jsx as jsx26, jsxs as jsxs14 } from "react/jsx-runtime";
 var GAP_PX = 6;
 var TONE = {
@@ -2601,10 +2575,10 @@ function OverflowToolbar({
     () => actions.filter((a) => !a.hidden),
     [actions]
   );
-  const containerRef = useRef4(null);
-  const ghostRef = useRef4(null);
-  const leadingRef = useRef4(null);
-  const [visibleCount, setVisibleCount] = useState6(visibleActions.length);
+  const containerRef = useRef3(null);
+  const ghostRef = useRef3(null);
+  const leadingRef = useRef3(null);
+  const [visibleCount, setVisibleCount] = useState5(visibleActions.length);
   const signature = visibleActions.map(
     (a) => `${a.id}:${a.hideLabel ? 1 : 0}:${a.running ? 1 : 0}:${a.runningLabel ?? ""}:${a.label}`
   ).join("|");
@@ -3518,7 +3492,7 @@ function DefaultOrganizationSwitch({
 }
 
 // src/tabbed-bottom-sheet.tsx
-import { useState as useState7 } from "react";
+import { useState as useState6 } from "react";
 import { jsx as jsx39, jsxs as jsxs22 } from "react/jsx-runtime";
 function TabbedBottomSheet({
   open,
@@ -3526,8 +3500,8 @@ function TabbedBottomSheet({
   title,
   tabs
 }) {
-  const [selectedTabId, setSelectedTabId] = useState7(null);
-  const [wasOpen, setWasOpen] = useState7(open);
+  const [selectedTabId, setSelectedTabId] = useState6(null);
+  const [wasOpen, setWasOpen] = useState6(open);
   if (open !== wasOpen) {
     setWasOpen(open);
     if (open) setSelectedTabId(null);
@@ -3897,15 +3871,15 @@ var TextareaWithPrefix = React31.forwardRef(
 TextareaWithPrefix.displayName = "TextareaWithPrefix";
 
 // src/use-scroll-fade.ts
-import { useCallback as useCallback5, useEffect as useEffect5, useRef as useRef6, useState as useState8 } from "react";
+import { useCallback as useCallback5, useEffect as useEffect4, useRef as useRef5, useState as useState7 } from "react";
 var EPSILON = 2;
 function useScrollFade() {
-  const [state, setState] = useState8({
+  const [state, setState] = useState7({
     top: false,
     bottom: false
   });
-  const nodeRef = useRef6(null);
-  const cleanupRef = useRef6(null);
+  const nodeRef = useRef5(null);
+  const cleanupRef = useRef5(null);
   const measure = useCallback5(() => {
     const el = nodeRef.current;
     if (!el) return;
@@ -3938,7 +3912,7 @@ function useScrollFade() {
     },
     [measure]
   );
-  useEffect5(() => () => cleanupRef.current?.(), []);
+  useEffect4(() => () => cleanupRef.current?.(), []);
   return {
     ref,
     state,