@fayz-ai/ui 0.19.0 → 0.22.0

package/dist/{chunk-5WSKZU7M.js → chunk-ZSOT7KTE.js}

@@ -1,4 +1,4 @@
-import { useSaveBarVisible, useCrossModuleBack, useBackHandler, PageHeaderActions } from './chunk-6YFPPK7X.js';
+import { useSaveBarVisible, useCrossModuleBack, useBackHandler, PageHeaderActions, SegmentedControl } from './chunk-PQUS22JE.js';
 import { useIsWide, Dropdown, DropdownTrigger, DropdownContent, DropdownSeparator, DropdownItem, Card, DataTable, Checkbox } from './chunk-E44WOPCR.js';
 import { cn, Button } from './chunk-OKZ6WQB3.js';
 import * as React18 from 'react';
@@ -483,6 +483,13 @@ var TooltipContent = React18.forwardRef(({ className, sideOffset = 4, ...props }
   }
 ));
 TooltipContent.displayName = TooltipPrimitive.Content.displayName;
+var Hint = React18.forwardRef(function Hint2({ label, children, side = "top", delayDuration = 0, ...rest }, ref) {
+  if (!label) return React18.cloneElement(children, { ...rest, ref });
+  return /* @__PURE__ */ jsx(TooltipPrimitive.Provider, { delayDuration, children: /* @__PURE__ */ jsxs(Tooltip, { children: [
+    /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, ...rest, ref, children }),
+    /* @__PURE__ */ jsx(TooltipContent, { side, className: "px-2 py-1 text-xs font-medium", children: label })
+  ] }) });
+});
 function iconOf(action, className) {
   const Icon2 = action.icon;
   return Icon2 ? /* @__PURE__ */ jsx(Icon2, { className }) : null;
@@ -520,20 +527,24 @@ function PageActionBar({ actions, className }) {
   const head = primary[0];
   const menu = [...secondary, ...danger];
   return /* @__PURE__ */ jsxs("div", { className: cn("flex shrink-0 items-center gap-2", className), children: [
-    utility.map((a) => /* @__PURE__ */ jsx(
-      Button,
-      {
-        variant: "outline",
-        size: "icon",
-        onClick: () => void a.onSelect(),
-        disabled: a.disabled,
-        "aria-label": a.label,
-        title: a.label,
-        "data-testid": a.testId,
-        "data-tour": `action.${a.id}`,
-        children: iconOf(a, "h-4 w-4")
-      },
-      a.id
+    utility.map((a) => (
+      // Um botão só de ícone não diz o que faz. `title=` parecia resolver e
+      // não resolve: espera ~1s que ninguém controla, sai na pintura do
+      // sistema operacional, nunca aparece no toque e vários leitores de tela
+      // pulam. Hint é o tooltip do design system, e o texto é ANUNCIADO.
+      /* @__PURE__ */ jsx(Hint, { label: a.label, children: /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "outline",
+          size: "icon",
+          onClick: () => void a.onSelect(),
+          disabled: a.disabled,
+          "aria-label": a.label,
+          "data-testid": a.testId,
+          "data-tour": `action.${a.id}`,
+          children: iconOf(a, "h-4 w-4")
+        }
+      ) }, a.id)
     )),
     head && menu.length === 0 && /* @__PURE__ */ jsxs(Button, { onClick: () => void head.onSelect(), disabled: head.disabled, "data-testid": head.testId, "data-tour": `action.${head.id}`, children: [
       iconOf(head, "mr-1.5 h-4 w-4"),
@@ -545,7 +556,7 @@ function PageActionBar({ actions, className }) {
         head.label
       ] }),
       /* @__PURE__ */ jsxs(Dropdown, { children: [
-        /* @__PURE__ */ jsx(DropdownTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx(DropdownTrigger, { asChild: true, children: /* @__PURE__ */ jsx(Hint, { label: `${head.label}\u2026`, children: /* @__PURE__ */ jsx(
           Button,
           {
             className: "-ml-px rounded-l-none px-2",
@@ -553,12 +564,12 @@ function PageActionBar({ actions, className }) {
             "data-tour": menu.map((a) => `action.${a.id}`).join(" "),
             children: /* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4" })
           }
-        ) }),
+        ) }) }),
         /* @__PURE__ */ jsx(DropdownContent, { align: "end", className: "w-56", children: /* @__PURE__ */ jsx(ActionItems, { actions: menu }) })
       ] })
     ] }),
     !head && menu.length > 0 && /* @__PURE__ */ jsxs(Dropdown, { children: [
-      /* @__PURE__ */ jsx(DropdownTrigger, { asChild: true, children: /* @__PURE__ */ jsx(Button, { variant: "outline", size: "icon", "aria-label": "A\xE7\xF5es", children: /* @__PURE__ */ jsx(MoreHorizontal, { className: "h-4 w-4" }) }) }),
+      /* @__PURE__ */ jsx(DropdownTrigger, { asChild: true, children: /* @__PURE__ */ jsx(Hint, { label: "A\xE7\xF5es", children: /* @__PURE__ */ jsx(Button, { variant: "outline", size: "icon", "aria-label": "A\xE7\xF5es", children: /* @__PURE__ */ jsx(MoreHorizontal, { className: "h-4 w-4" }) }) }) }),
       /* @__PURE__ */ jsx(DropdownContent, { align: "end", className: "w-56", children: /* @__PURE__ */ jsx(ActionItems, { actions: menu }) })
     ] })
   ] });
@@ -701,24 +712,25 @@ function RowActions({
   return /* @__PURE__ */ jsxs("div", { className: cn("flex shrink-0 items-center justify-end gap-0.5", className), onClick: stop, children: [
     inline.map((a) => {
       const Icon2 = a.icon;
-      return /* @__PURE__ */ jsx(
-        Button,
-        {
-          variant: "ghost",
-          size: "icon",
-          className: "fz-tap text-muted-foreground",
-          onClick: () => void a.onSelect(),
-          disabled: a.disabled,
-          "aria-label": a.label,
-          title: a.label,
-          "data-testid": a.testId,
-          children: Icon2 ? /* @__PURE__ */ jsx(Icon2, { className: "h-4 w-4" }) : null
-        },
-        a.id
+      return (
+        // Uma linha de tabela com três ícones cinza é três adivinhações.
+        /* @__PURE__ */ jsx(Hint, { label: a.label, children: /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "ghost",
+            size: "icon",
+            className: "fz-tap text-muted-foreground",
+            onClick: () => void a.onSelect(),
+            disabled: a.disabled,
+            "aria-label": a.label,
+            "data-testid": a.testId,
+            children: Icon2 ? /* @__PURE__ */ jsx(Icon2, { className: "h-4 w-4" }) : null
+          }
+        ) }, a.id)
       );
     }),
     overflow.length > 0 && /* @__PURE__ */ jsxs(Dropdown, { children: [
-      /* @__PURE__ */ jsx(DropdownTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsx(DropdownTrigger, { asChild: true, children: /* @__PURE__ */ jsx(Hint, { label: rowActionsLabel, children: /* @__PURE__ */ jsx(
         Button,
         {
           variant: "ghost",
@@ -727,7 +739,7 @@ function RowActions({
           "aria-label": rowActionsLabel,
           children: /* @__PURE__ */ jsx(MoreHorizontal, { className: "h-4 w-4" })
         }
-      ) }),
+      ) }) }),
       /* @__PURE__ */ jsx(DropdownContent, { align: "end", className: "w-52", children: overflow.map((a, i) => {
         const Icon2 = a.icon;
         const isDanger = a.intent === "danger";
@@ -998,28 +1010,31 @@ function RefreshButton({ onRefresh, fromCache, label, labelCached, className, ..
       if (alive.current) setPhase((p) => p === "done" ? "idle" : p);
     }, 1400);
   }
-  return /* @__PURE__ */ jsx(
-    Button,
-    {
-      type: "button",
-      variant: "ghost",
-      size: "icon",
-      title,
-      "aria-label": title,
-      onClick: () => {
-        void run();
-      },
-      className: cn(
-        // The state colours are the point of this control, so they stay; what
-        // it was missing is the shared button underneath them.
-        "transition",
-        fromCache && phase !== "done" && "text-amber-600 hover:text-amber-700 dark:text-amber-500 dark:hover:text-amber-400",
-        phase === "done" && "text-emerald-600 dark:text-emerald-500",
-        className
-      ),
-      ...rest,
-      children: phase === "done" ? /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx(RefreshCw, { className: cn("h-4 w-4", phase === "busy" && "animate-spin") })
-    }
+  return (
+    // Só o ícone: sem o tooltip do design system, o que este botão faz depende
+    // de o usuário arriscar um clique. `title=` não conta — ver Hint.
+    /* @__PURE__ */ jsx(Hint, { label: title, children: /* @__PURE__ */ jsx(
+      Button,
+      {
+        type: "button",
+        variant: "ghost",
+        size: "icon",
+        "aria-label": title,
+        onClick: () => {
+          void run();
+        },
+        className: cn(
+          // The state colours are the point of this control, so they stay; what
+          // it was missing is the shared button underneath them.
+          "transition",
+          fromCache && phase !== "done" && "text-amber-600 hover:text-amber-700 dark:text-amber-500 dark:hover:text-amber-400",
+          phase === "done" && "text-emerald-600 dark:text-emerald-500",
+          className
+        ),
+        ...rest,
+        children: phase === "done" ? /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx(RefreshCw, { className: cn("h-4 w-4", phase === "busy" && "animate-spin") })
+      }
+    ) })
   );
 }
 RefreshButton.displayName = "RefreshButton";
@@ -1075,13 +1090,6 @@ function StatTiles({ tiles, loading, className }) {
     ] }, tile.id);
   }) });
 }
-var Hint = React18.forwardRef(function Hint2({ label, children, side = "top", delayDuration = 0, ...rest }, ref) {
-  if (!label) return React18.cloneElement(children, { ...rest, ref });
-  return /* @__PURE__ */ jsx(TooltipPrimitive.Provider, { delayDuration, children: /* @__PURE__ */ jsxs(Tooltip, { children: [
-    /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, ...rest, ref, children }),
-    /* @__PURE__ */ jsx(TooltipContent, { side, className: "px-2 py-1 text-xs font-medium", children: label })
-  ] }) });
-});
 function formatTime12(h, m) {
   const period = h >= 12 ? "pm" : "am";
   const h12 = h % 12 || 12;
@@ -1399,8 +1407,8 @@ function ListView({
         (tagFilter || filters || onRefresh || onExport) && /* @__PURE__ */ jsxs("div", { className: "ml-auto flex flex-wrap items-center justify-end gap-2", children: [
           tagFilter,
           filters,
-          onRefresh && /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", size: "icon", "aria-label": refreshLabel, title: refreshLabel, onClick: onRefresh, className: ICON_BTN, children: /* @__PURE__ */ jsx(RefreshCw, { className: "h-4 w-4" }) }),
-          onExport && /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", size: "icon", "aria-label": exportLabel, title: exportLabel, onClick: onExport, className: ICON_BTN, children: /* @__PURE__ */ jsx(Download, { className: "h-4 w-4" }) })
+          onRefresh && /* @__PURE__ */ jsx(Hint, { label: refreshLabel, children: /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", size: "icon", "aria-label": refreshLabel, onClick: onRefresh, className: ICON_BTN, children: /* @__PURE__ */ jsx(RefreshCw, { className: "h-4 w-4" }) }) }),
+          onExport && /* @__PURE__ */ jsx(Hint, { label: exportLabel, children: /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", size: "icon", "aria-label": exportLabel, onClick: onExport, className: ICON_BTN, children: /* @__PURE__ */ jsx(Download, { className: "h-4 w-4" }) }) })
         ] })
       ] }) }),
       /* @__PURE__ */ jsx(
@@ -1831,7 +1839,8 @@ function SearchSelect({
   renderOption,
   loadOnOpen = true,
   className,
-  disabled
+  disabled,
+  "data-tour": dataTour
 }) {
   const canCreate = !!onCreate && allowCreate !== false;
   const [open, setOpen] = React18.useState(false);
@@ -1948,7 +1957,7 @@ function SearchSelect({
       window.removeEventListener("resize", measure);
     };
   }, [showDropdown]);
-  return /* @__PURE__ */ jsxs("div", { ref: containerRef, className: cn("relative", className), children: [
+  return /* @__PURE__ */ jsxs("div", { ref: containerRef, "data-tour": dataTour, className: cn("relative", className), children: [
     label && /* @__PURE__ */ jsxs("label", { className: "text-xs font-medium text-muted-foreground", children: [
       label,
       required && " *"
@@ -2163,51 +2172,6 @@ var PopoverContent = React18.forwardRef(({ className, align = "start", sideOffse
   }
 ) }));
 PopoverContent.displayName = PopoverPrimitive.Content.displayName;
-var SIZE = {
-  sm: { container: "h-[26px]", segment: "px-2.5 text-xs" },
-  md: { container: "h-[30px]", segment: "px-3 text-sm" }
-};
-function SegmentedControl({
-  options,
-  value,
-  onChange,
-  size = "sm",
-  className,
-  ...rest
-}) {
-  const items = options.map((o) => typeof o === "string" ? { value: o, label: o } : o);
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      role: "tablist",
-      "aria-label": rest["aria-label"],
-      className: cn(
-        "inline-flex items-center rounded-button border border-border bg-card p-0.5 shadow-button",
-        SIZE[size].container,
-        className
-      ),
-      children: items.map((item) => {
-        const active = item.value === value;
-        return /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            role: "tab",
-            "aria-selected": active,
-            onClick: () => onChange(item.value),
-            className: cn(
-              "flex h-full items-center rounded-button font-semibold transition-colors",
-              SIZE[size].segment,
-              active ? "bg-foreground text-background" : "text-muted-foreground hover:bg-muted/60"
-            ),
-            children: item.label
-          },
-          item.value
-        );
-      })
-    }
-  );
-}
 function MultiSelect({
   options,
   value,
@@ -2709,6 +2673,8 @@ function StockEntryForm({
   reasons = [],
   available,
   saving = false,
+  readOnly = false,
+  notice,
   onSubmit,
   labels: overrides
 }) {
@@ -2738,13 +2704,14 @@ function StockEntryForm({
     void onSubmit({ verb, quantity: amount, reasonCode, occurredOn, note });
   };
   return /* @__PURE__ */ jsx(Modal, { open: verb !== null, onOpenChange: (open) => {
-    if (!open) onClose();
+    if (!open && !saving && !readOnly) onClose();
   }, children: /* @__PURE__ */ jsxs(ModalContent, { className: "sm:max-w-lg", children: [
     /* @__PURE__ */ jsxs(ModalHeader, { children: [
       /* @__PURE__ */ jsx(ModalTitle, { children: labels.title }),
       /* @__PURE__ */ jsx(ModalDescription, { children: labels.description })
     ] }),
-    /* @__PURE__ */ jsxs("div", { className: "p-1", children: [
+    notice && /* @__PURE__ */ jsx("p", { role: "status", className: "text-sm text-warning", children: notice }),
+    /* @__PURE__ */ jsxs("fieldset", { disabled: saving || readOnly, className: "p-1", children: [
       /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-1", children: verbs.map((v) => /* @__PURE__ */ jsx(
         "button",
         {
@@ -2838,12 +2805,12 @@ function StockEntryForm({
     /* @__PURE__ */ jsxs(ModalFooter, { children: [
       amount === 0 && // Why the button is dim, next to the button.
       /* @__PURE__ */ jsx("span", { className: "mr-auto text-xs text-muted-foreground", children: labels.sayHowMany }),
-      /* @__PURE__ */ jsx(Button, { variant: "ghost", onClick: onClose, disabled: saving, children: labels.cancel }),
+      /* @__PURE__ */ jsx(Button, { variant: "ghost", onClick: onClose, disabled: saving || readOnly, children: labels.cancel }),
       /* @__PURE__ */ jsx(Button, { onClick: submit, disabled: saving || amount === 0, children: saving ? labels.submitting : labels.submit })
     ] })
   ] }) });
 }
 
-export { Badge, Breadcrumb, BulkActionBar, ChevronPager, CurrencyInput, DatePicker, DotBadge, DraftCommitBar, FilterCheckBox, FilterCheckList, FilterCheckRow, FilterChip, FilterSection, Hint, Input, ListView, Markdown, MarkdownEditor, MiniCalendar, Modal, ModalBody, ModalClose, ModalContent, ModalDescription, ModalFooter, ModalHeader, ModalOverlay, ModalPortal, ModalTitle, ModalTrigger, MultiSelect, PageActionBar, PhoneField, PhoneLink, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, RefreshButton, RowActions, SearchCombobox, SearchField, SearchSelect, SegmentedControl, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator2 as Separator, StatTiles, StockEntryForm, Tabs, TabsContent, TabsList, TabsTrigger, Thumbnail, TimePicker, ToastProvider, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, WHATSAPP_BRAND_COLOR, WhatsAppIcon, badgeVariants, formatPhone2 as formatPhone, normalizePhone, renderMarkdown, setActionsMenuLabel, setRowActionsLabel, toLocalISODate, useRowSelection };
-//# sourceMappingURL=chunk-5WSKZU7M.js.map
-//# sourceMappingURL=chunk-5WSKZU7M.js.map
+export { Badge, Breadcrumb, BulkActionBar, ChevronPager, CurrencyInput, DatePicker, DotBadge, DraftCommitBar, FilterCheckBox, FilterCheckList, FilterCheckRow, FilterChip, FilterSection, Hint, Input, ListView, Markdown, MarkdownEditor, MiniCalendar, Modal, ModalBody, ModalClose, ModalContent, ModalDescription, ModalFooter, ModalHeader, ModalOverlay, ModalPortal, ModalTitle, ModalTrigger, MultiSelect, PageActionBar, PhoneField, PhoneLink, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, RefreshButton, RowActions, SearchCombobox, SearchField, SearchSelect, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator2 as Separator, StatTiles, StockEntryForm, Tabs, TabsContent, TabsList, TabsTrigger, Thumbnail, TimePicker, ToastProvider, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, WHATSAPP_BRAND_COLOR, WhatsAppIcon, badgeVariants, formatPhone2 as formatPhone, normalizePhone, renderMarkdown, setActionsMenuLabel, setRowActionsLabel, toLocalISODate, useRowSelection };
+//# sourceMappingURL=chunk-ZSOT7KTE.js.map
+//# sourceMappingURL=chunk-ZSOT7KTE.js.map