hazo_ui 6.11.2 → 6.12.3

package/dist/index.cjs

@@ -16,6 +16,7 @@ var SelectPrimitive = require('@radix-ui/react-select');
 var TooltipPrimitive = require('@radix-ui/react-tooltip');
 var reactDayPicker = require('react-day-picker');
 var dateFns = require('date-fns');
+var i18n = require('hazo_core/i18n');
 var core$1 = require('@dnd-kit/core');
 var sortable = require('@dnd-kit/sortable');
 var utilities = require('@dnd-kit/utilities');
@@ -181,8 +182,8 @@ var require_extends = __commonJS({
     function _extends11() {
       return module.exports = _extends11 = Object.assign ? Object.assign.bind() : function(n) {
         for (var e = 1; e < arguments.length; e++) {
-          var t4 = arguments[e];
-          for (var r in t4) ({}).hasOwnProperty.call(t4, r) && (n[r] = t4[r]);
+          var t14 = arguments[e];
+          for (var r in t14) ({}).hasOwnProperty.call(t14, r) && (n[r] = t14[r]);
         }
         return n;
       }, module.exports.__esModule = true, module.exports["default"] = module.exports, _extends11.apply(null, arguments);
@@ -196,12 +197,12 @@ var require_objectWithoutPropertiesLoose = __commonJS({
   "../node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js"(exports, module) {
     function _objectWithoutPropertiesLoose10(r, e) {
       if (null == r) return {};
-      var t4 = {};
+      var t14 = {};
       for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
         if (-1 !== e.indexOf(n)) continue;
-        t4[n] = r[n];
+        t14[n] = r[n];
       }
-      return t4;
+      return t14;
     }
     module.exports = _objectWithoutPropertiesLoose10, module.exports.__esModule = true, module.exports["default"] = module.exports;
   }
@@ -712,47 +713,6 @@ function Calendar({
   );
 }
 Calendar.displayName = "Calendar";
-var hazo_i18n_module = null;
-void client$1.optional_import("hazo_i18n").then((mod) => {
-  hazo_i18n_module = mod;
-}).catch(() => {
-  hazo_i18n_module = null;
-});
-function interpolate(template, vars) {
-  if (!vars) return template;
-  return template.replace(
-    /\{\{\s*(\w+)\s*\}\}/g,
-    (whole, name) => Object.prototype.hasOwnProperty.call(vars, name) ? vars[name] : whole
-  );
-}
-function createPackageT(namespace, fallbackCatalog) {
-  return function t4(key, vars) {
-    const mod = hazo_i18n_module;
-    if (mod && typeof mod.t === "function") {
-      try {
-        const translated = mod.t(`${namespace}.${key}`, vars);
-        if (typeof translated === "string" && translated.length > 0) {
-          return translated;
-        }
-      } catch {
-      }
-    }
-    const template = fallbackCatalog[key];
-    if (template === void 0) return key;
-    return interpolate(template, vars);
-  };
-}
-function resolvePackageLocale(defaultLocale) {
-  const mod = hazo_i18n_module;
-  if (mod && typeof mod.getStaticLocale === "function") {
-    try {
-      const locale = mod.getStaticLocale();
-      if (typeof locale === "string" && locale.length > 0) return locale;
-    } catch {
-    }
-  }
-  return defaultLocale;
-}
 
 // src/locales/en.json
 var en_default = {
@@ -825,9 +785,41 @@ var en_default = {
   "filter.no_fields_available": "No fields available.",
   "filter.clear_all": "Clear all",
   "filter.cancel": "Cancel",
-  "filter.apply": "Apply"
+  "filter.apply": "Apply",
+  "sort.title": "Sort",
+  "sort.description": "Add fields to sort by, drag to reorder, toggle ascending or descending.",
+  "sort.search_fields": "Search fields...",
+  "sort.open_dialog_aria": "Open sort dialog",
+  "sort.clear_all": "Clear all",
+  "sort.cancel": "Cancel",
+  "sort.apply": "Apply",
+  "canvas_toolbar.bold": "Bold",
+  "canvas_toolbar.italic": "Italic",
+  "canvas_toolbar.underline": "Underline",
+  "canvas_toolbar.align_left": "Align left",
+  "canvas_toolbar.align_center": "Align center",
+  "canvas_toolbar.align_right": "Align right",
+  "canvas_toolbar.text_color": "Text color",
+  "canvas_toolbar.font_family": "Font family",
+  "canvas_toolbar.align_top": "Align top",
+  "canvas_toolbar.align_middle": "Align middle",
+  "canvas_toolbar.align_bottom": "Align bottom",
+  "canvas_toolbar.bullet_list": "Bullet list",
+  "toast.permission_required": "Permission required",
+  "toast.permission_denied_message": "You do not have permission to perform this action.",
+  "error.something_went_wrong": "Something went wrong",
+  "error.dismiss": "Dismiss",
+  "loading.taking_longer": "This is taking longer than expected",
+  "notification.loading": "Loading notifications",
+  "notification.mark_all_read": "Mark all as read",
+  "notification.unread": "Unread",
+  "confirm.cancel": "Cancel",
+  "icon_picker.search_placeholder": "Search icons...",
+  "common.loading": "Loading...",
+  "common.cancel": "Cancel",
+  "common.search": "Search..."
 };
-var t = createPackageT("hazo_ui", en_default);
+var t = i18n.createPackageT("hazo_ui", en_default);
 function FilterFieldItem({
   filterConfig,
   fieldConfig,
@@ -1274,6 +1266,7 @@ function HazoUiMultiFilterDialog({
     ] })
   ] });
 }
+var t2 = i18n.createPackageT("hazo_ui", en_default);
 function SortableSortFieldItem({
   sortConfig,
   fieldLabel,
@@ -1384,8 +1377,8 @@ function HazoUiMultiSortDialog({
   availableFields,
   onSortChange,
   initialSortFields = [],
-  title = "Sort",
-  description = "Add fields to sort by, drag to reorder, toggle ascending or descending.",
+  title = t2("sort.title"),
+  description = t2("sort.description"),
   headerBackgroundColor,
   headerTextColor,
   submitButtonBackgroundColor,
@@ -1503,7 +1496,7 @@ function HazoUiMultiSortDialog({
           variant: "outline",
           size: "sm",
           className: "cls_sort_button",
-          "aria-label": "Open sort dialog",
+          "aria-label": t2("sort.open_dialog_aria"),
           children: [
             /* @__PURE__ */ jsxRuntime.jsx(
               lucideReact.ArrowUpDown,
@@ -1576,7 +1569,7 @@ function HazoUiMultiSortDialog({
             }
           ) }),
           /* @__PURE__ */ jsxRuntime.jsx(PopoverContent, { className: "cls_combobox_popover w-[var(--radix-popover-trigger-width)] p-0", align: "start", children: /* @__PURE__ */ jsxRuntime.jsxs(Command, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(CommandInput, { placeholder: "Search fields...", className: "cls_command_input" }),
+            /* @__PURE__ */ jsxRuntime.jsx(CommandInput, { placeholder: t2("sort.search_fields"), className: "cls_command_input" }),
             /* @__PURE__ */ jsxRuntime.jsx(CommandList, { children: availableFieldsToAdd.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx(CommandEmpty, { children: "No fields available." }) : /* @__PURE__ */ jsxRuntime.jsx(CommandGroup, { children: availableFieldsToAdd.map((field) => /* @__PURE__ */ jsxRuntime.jsx(
               CommandItem,
               {
@@ -1599,7 +1592,7 @@ function HazoUiMultiSortDialog({
             onClick: handleClearAll,
             className: "cls_clear_all_btn text-muted-foreground hover:text-foreground",
             style: clearButtonStyles,
-            children: "Clear all"
+            children: t2("sort.clear_all")
           }
         ) }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cls_footer_right flex items-center gap-2", children: [
@@ -1611,7 +1604,7 @@ function HazoUiMultiSortDialog({
               onClick: handleCancel,
               className: "cls_cancel_btn",
               style: cancelButtonStyles,
-              children: "Cancel"
+              children: t2("sort.cancel")
             }
           ),
           /* @__PURE__ */ jsxRuntime.jsx(
@@ -1621,7 +1614,7 @@ function HazoUiMultiSortDialog({
               onClick: handleApply,
               className: "cls_apply_btn",
               style: submitButtonStyles,
-              children: "Apply"
+              children: t2("sort.apply")
             }
           )
         ] })
@@ -2040,6 +2033,7 @@ var TabsContent = React27__namespace.forwardRef(({ className, ...props }, ref) =
   }
 ));
 TabsContent.displayName = TabsPrimitive__namespace.Content.displayName;
+var t3 = i18n.createPackageT("hazo_ui", en_default);
 function isLucideValue(value) {
   return value.startsWith("lucide:");
 }
@@ -2305,7 +2299,7 @@ function HazoUiIconPicker({
               type: "text",
               value: search,
               onChange: (e) => set_search(e.target.value),
-              placeholder: "Search icons...",
+              placeholder: t3("icon_picker.search_placeholder"),
               className: cn(
                 "cls_hazo_ui_icon_picker_search",
                 "mb-2 flex h-9 w-full rounded-md border border-input bg-background px-3 py-1 text-sm",
@@ -3751,10 +3745,10 @@ var BLOCK_TYPE_LABEL_KEYS = {
   "code-block": "rte.block_type.code_block",
   blockquote: "rte.block_type.blockquote"
 };
-function get_translated_block_types(t4) {
+function get_translated_block_types(t14) {
   return BLOCK_TYPES.map((type) => ({
     ...type,
-    label: t4(BLOCK_TYPE_LABEL_KEYS[type.value])
+    label: t14(BLOCK_TYPE_LABEL_KEYS[type.value])
   }));
 }
 
@@ -3801,7 +3795,7 @@ function get_file_extension(filename) {
 function is_image_file(mime_type) {
   return mime_type.startsWith("image/");
 }
-var t2 = createPackageT("hazo_ui", en_default);
+var t4 = i18n.createPackageT("hazo_ui", en_default);
 var ALL_ON = {
   undo_redo: true,
   block_type: true,
@@ -3856,7 +3850,7 @@ var Toolbar = ({
   }
   const tb = { ...ALL_ON, ...toolbar };
   const font_family_options = font_families && font_families.length > 0 ? font_families : FONT_FAMILIES;
-  const block_type_options = get_translated_block_types(t2);
+  const block_type_options = get_translated_block_types(t4);
   const get_current_font_size = () => {
     const attrs = editor.getAttributes("textStyle");
     return attrs.fontSize || FONT_SIZE_CONFIG.default;
@@ -4000,7 +3994,7 @@ var Toolbar = ({
         {
           onClick: () => editor.chain().focus().undo().run(),
           disabled: !editor.can().undo(),
-          tooltip: t2("rte.undo"),
+          tooltip: t4("rte.undo"),
           children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuUndo2, { className: "h-4 w-4" })
         },
         "undo"
@@ -4010,7 +4004,7 @@ var Toolbar = ({
         {
           onClick: () => editor.chain().focus().redo().run(),
           disabled: !editor.can().redo(),
-          tooltip: t2("rte.redo"),
+          tooltip: t4("rte.redo"),
           children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuRedo2, { className: "h-4 w-4" })
         },
         "redo"
@@ -4051,7 +4045,7 @@ var Toolbar = ({
             ToolbarButton,
             {
               onClick: () => handle_font_size_change(-2),
-              tooltip: t2("rte.decrease_font_size"),
+              tooltip: t4("rte.decrease_font_size"),
               children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuMinus, { className: "h-3 w-3" })
             }
           ),
@@ -4060,7 +4054,7 @@ var Toolbar = ({
             ToolbarButton,
             {
               onClick: () => handle_font_size_change(FONT_SIZE_CONFIG.step),
-              tooltip: t2("rte.increase_font_size"),
+              tooltip: t4("rte.increase_font_size"),
               children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuPlus, { className: "h-3 w-3" })
             }
           )
@@ -4078,7 +4072,7 @@ var Toolbar = ({
           {
             onClick: () => editor.chain().focus().toggleBold().run(),
             is_active: editor.isActive("bold"),
-            tooltip: t2("rte.bold"),
+            tooltip: t4("rte.bold"),
             children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuBold, { className: "h-4 w-4" })
           },
           "bold"
@@ -4092,7 +4086,7 @@ var Toolbar = ({
           {
             onClick: () => editor.chain().focus().toggleItalic().run(),
             is_active: editor.isActive("italic"),
-            tooltip: t2("rte.italic"),
+            tooltip: t4("rte.italic"),
             children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuItalic, { className: "h-4 w-4" })
           },
           "italic"
@@ -4106,7 +4100,7 @@ var Toolbar = ({
           {
             onClick: () => editor.chain().focus().toggleUnderline().run(),
             is_active: editor.isActive("underline"),
-            tooltip: t2("rte.underline"),
+            tooltip: t4("rte.underline"),
             children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuUnderline, { className: "h-4 w-4" })
           },
           "underline"
@@ -4120,7 +4114,7 @@ var Toolbar = ({
           {
             onClick: () => editor.chain().focus().toggleStrike().run(),
             is_active: editor.isActive("strike"),
-            tooltip: t2("rte.strikethrough"),
+            tooltip: t4("rte.strikethrough"),
             children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuStrikethrough, { className: "h-4 w-4" })
           },
           "strike"
@@ -4134,7 +4128,7 @@ var Toolbar = ({
           {
             onClick: () => editor.chain().focus().toggleSubscript().run(),
             is_active: editor.isActive("subscript"),
-            tooltip: t2("rte.subscript"),
+            tooltip: t4("rte.subscript"),
             children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuSubscript, { className: "h-4 w-4" })
           },
           "sub"
@@ -4148,7 +4142,7 @@ var Toolbar = ({
           {
             onClick: () => editor.chain().focus().toggleSuperscript().run(),
             is_active: editor.isActive("superscript"),
-            tooltip: t2("rte.superscript"),
+            tooltip: t4("rte.superscript"),
             children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuSuperscript, { className: "h-4 w-4" })
           },
           "super"
@@ -4162,7 +4156,7 @@ var Toolbar = ({
     if (tb.link) {
       items.push(
         /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open: link_popover_open, onOpenChange: set_link_popover_open, children: [
-          /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ToolbarButton, { is_active: editor.isActive("link"), tooltip: t2("rte.link"), children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuLink, { className: "h-4 w-4" }) }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ToolbarButton, { is_active: editor.isActive("link"), tooltip: t4("rte.link"), children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuLink, { className: "h-4 w-4" }) }) }),
           /* @__PURE__ */ jsxRuntime.jsx(PopoverContent, { className: "w-80 p-3", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
             /* @__PURE__ */ jsxRuntime.jsx(
               Input,
@@ -4198,7 +4192,7 @@ var Toolbar = ({
           ToolbarButton,
           {
             onClick: () => editor.chain().focus().unsetAllMarks().clearNodes().run(),
-            tooltip: t2("rte.clear_formatting"),
+            tooltip: t4("rte.clear_formatting"),
             children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuRemoveFormatting, { className: "h-4 w-4" })
           },
           "clear"
@@ -4212,7 +4206,7 @@ var Toolbar = ({
     if (tb.text_color) {
       items.push(
         /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open: text_color_open, onOpenChange: set_text_color_open, children: [
-          /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ToolbarButton, { tooltip: t2("rte.text_color"), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ToolbarButton, { tooltip: t4("rte.text_color"), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center", children: [
             /* @__PURE__ */ jsxRuntime.jsx(lu.LuPalette, { className: "h-4 w-4" }),
             /* @__PURE__ */ jsxRuntime.jsx(
               "div",
@@ -4255,7 +4249,7 @@ var Toolbar = ({
     if (tb.highlight_color) {
       items.push(
         /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open: highlight_color_open, onOpenChange: set_highlight_color_open, children: [
-          /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ToolbarButton, { tooltip: t2("rte.highlight_color"), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ToolbarButton, { tooltip: t4("rte.highlight_color"), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center", children: [
             /* @__PURE__ */ jsxRuntime.jsx(lu.LuHighlighter, { className: "h-4 w-4" }),
             /* @__PURE__ */ jsxRuntime.jsx(
               "div",
@@ -4298,7 +4292,7 @@ var Toolbar = ({
         {
           onClick: () => editor.chain().focus().setTextAlign("left").run(),
           is_active: editor.isActive({ textAlign: "left" }),
-          tooltip: t2("rte.align_left"),
+          tooltip: t4("rte.align_left"),
           children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuAlignLeft, { className: "h-4 w-4" })
         },
         "align-left"
@@ -4308,7 +4302,7 @@ var Toolbar = ({
         {
           onClick: () => editor.chain().focus().setTextAlign("center").run(),
           is_active: editor.isActive({ textAlign: "center" }),
-          tooltip: t2("rte.align_center"),
+          tooltip: t4("rte.align_center"),
           children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuAlignCenter, { className: "h-4 w-4" })
         },
         "align-center"
@@ -4318,7 +4312,7 @@ var Toolbar = ({
         {
           onClick: () => editor.chain().focus().setTextAlign("right").run(),
           is_active: editor.isActive({ textAlign: "right" }),
-          tooltip: t2("rte.align_right"),
+          tooltip: t4("rte.align_right"),
           children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuAlignRight, { className: "h-4 w-4" })
         },
         "align-right"
@@ -4328,7 +4322,7 @@ var Toolbar = ({
         {
           onClick: () => editor.chain().focus().setTextAlign("justify").run(),
           is_active: editor.isActive({ textAlign: "justify" }),
-          tooltip: t2("rte.justify"),
+          tooltip: t4("rte.justify"),
           children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuAlignJustify, { className: "h-4 w-4" })
         },
         "align-justify"
@@ -4344,7 +4338,7 @@ var Toolbar = ({
           {
             onClick: () => editor.chain().focus().toggleBulletList().run(),
             is_active: editor.isActive("bulletList"),
-            tooltip: t2("rte.bullet_list"),
+            tooltip: t4("rte.bullet_list"),
             children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuList, { className: "h-4 w-4" })
           },
           "bullet"
@@ -4358,7 +4352,7 @@ var Toolbar = ({
           {
             onClick: () => editor.chain().focus().toggleOrderedList().run(),
             is_active: editor.isActive("orderedList"),
-            tooltip: t2("rte.ordered_list"),
+            tooltip: t4("rte.ordered_list"),
             children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuListOrdered, { className: "h-4 w-4" })
           },
           "ordered"
@@ -4372,7 +4366,7 @@ var Toolbar = ({
           {
             onClick: () => editor.chain().focus().toggleTaskList().run(),
             is_active: editor.isActive("taskList"),
-            tooltip: t2("rte.checklist"),
+            tooltip: t4("rte.checklist"),
             children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuListChecks, { className: "h-4 w-4" })
           },
           "task"
@@ -4394,7 +4388,7 @@ var Toolbar = ({
             }
           },
           disabled: !editor.can().liftListItem("listItem") && !editor.can().liftListItem("taskItem"),
-          tooltip: t2("rte.decrease_indent"),
+          tooltip: t4("rte.decrease_indent"),
           children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuIndentDecrease, { className: "h-4 w-4" })
         },
         "indent-dec"
@@ -4410,7 +4404,7 @@ var Toolbar = ({
             }
           },
           disabled: !editor.can().sinkListItem("listItem") && !editor.can().sinkListItem("taskItem"),
-          tooltip: t2("rte.increase_indent"),
+          tooltip: t4("rte.increase_indent"),
           children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuIndentIncrease, { className: "h-4 w-4" })
         },
         "indent-inc"
@@ -4421,7 +4415,7 @@ var Toolbar = ({
     const items = [];
     if (tb.horizontal_rule) {
       items.push(
-        /* @__PURE__ */ jsxRuntime.jsx(ToolbarButton, { onClick: handle_hr_insert, tooltip: t2("rte.horizontal_rule"), children: /* @__PURE__ */ jsxRuntime.jsx(rx.RxDividerHorizontal, { className: "h-4 w-4" }) }, "hr")
+        /* @__PURE__ */ jsxRuntime.jsx(ToolbarButton, { onClick: handle_hr_insert, tooltip: t4("rte.horizontal_rule"), children: /* @__PURE__ */ jsxRuntime.jsx(rx.RxDividerHorizontal, { className: "h-4 w-4" }) }, "hr")
       );
     }
     if (tb.image) {
@@ -4430,7 +4424,7 @@ var Toolbar = ({
           ToolbarButton,
           {
             onClick: () => image_input_ref.current?.click(),
-            tooltip: t2("rte.insert_image"),
+            tooltip: t4("rte.insert_image"),
             children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuImage, { className: "h-4 w-4" })
           },
           "image"
@@ -4444,7 +4438,7 @@ var Toolbar = ({
             ToolbarButton,
             {
               is_active: editor.isActive("table"),
-              tooltip: t2("rte.table"),
+              tooltip: t4("rte.table"),
               children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuTable, { className: "h-4 w-4" })
             }
           ) }),
@@ -4616,7 +4610,7 @@ var Toolbar = ({
     if (tb.variables && variables.length > 0) {
       items.push(
         /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open: variables_menu_open, onOpenChange: set_variables_menu_open, children: [
-          /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ToolbarButton, { tooltip: t2("rte.insert_variable"), children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuVariable, { className: "h-4 w-4" }) }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ToolbarButton, { tooltip: t4("rte.insert_variable"), children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuVariable, { className: "h-4 w-4" }) }) }),
           /* @__PURE__ */ jsxRuntime.jsx(PopoverContent, { className: "w-64 p-0", align: "start", children: /* @__PURE__ */ jsxRuntime.jsxs(Command, { children: [
             /* @__PURE__ */ jsxRuntime.jsx(CommandInput, { placeholder: "Search variables...", className: "h-8 text-xs" }),
             /* @__PURE__ */ jsxRuntime.jsxs(CommandList, { children: [
@@ -4645,7 +4639,7 @@ var Toolbar = ({
           ToolbarButton,
           {
             onClick: () => file_input_ref.current?.click(),
-            tooltip: t2("rte.attach_file"),
+            tooltip: t4("rte.attach_file"),
             children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuPaperclip, { className: "h-4 w-4" })
           },
           "attach"
@@ -5166,6 +5160,7 @@ var HazoUiRte = ({
   );
 };
 HazoUiRte.displayName = "HazoUiRte";
+var t5 = i18n.createPackageT("hazo_ui", en_default);
 function CanvasTextToolbar({
   bold,
   italic,
@@ -5196,14 +5191,14 @@ function CanvasTextToolbar({
       ),
       style,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ToolbarButton, { is_active: bold, onClick: onBold, tooltip: "Bold", children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuBold, { className: "h-4 w-4" }) }),
-        /* @__PURE__ */ jsxRuntime.jsx(ToolbarButton, { is_active: italic, onClick: onItalic, tooltip: "Italic", children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuItalic, { className: "h-4 w-4" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(ToolbarButton, { is_active: bold, onClick: onBold, tooltip: t5("canvas_toolbar.bold"), children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuBold, { className: "h-4 w-4" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(ToolbarButton, { is_active: italic, onClick: onItalic, tooltip: t5("canvas_toolbar.italic"), children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuItalic, { className: "h-4 w-4" }) }),
         /* @__PURE__ */ jsxRuntime.jsx(
           ToolbarButton,
           {
             is_active: underline,
             onClick: onUnderline,
-            tooltip: "Underline",
+            tooltip: t5("canvas_toolbar.underline"),
             children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuUnderline, { className: "h-4 w-4" })
           }
         ),
@@ -5213,7 +5208,7 @@ function CanvasTextToolbar({
           {
             is_active: align === "left",
             onClick: () => onAlign?.("left"),
-            tooltip: "Align left",
+            tooltip: t5("canvas_toolbar.align_left"),
             children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuAlignLeft, { className: "h-4 w-4" })
           }
         ),
@@ -5222,7 +5217,7 @@ function CanvasTextToolbar({
           {
             is_active: align === "center",
             onClick: () => onAlign?.("center"),
-            tooltip: "Align center",
+            tooltip: t5("canvas_toolbar.align_center"),
             children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuAlignCenter, { className: "h-4 w-4" })
           }
         ),
@@ -5231,7 +5226,7 @@ function CanvasTextToolbar({
           {
             is_active: align === "right",
             onClick: () => onAlign?.("right"),
-            tooltip: "Align right",
+            tooltip: t5("canvas_toolbar.align_right"),
             children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuAlignRight, { className: "h-4 w-4" })
           }
         ),
@@ -5240,7 +5235,7 @@ function CanvasTextToolbar({
           "label",
           {
             className: "relative flex h-8 w-8 cursor-pointer items-center justify-center rounded-md hover:bg-accent",
-            title: "Text color",
+            title: t5("canvas_toolbar.text_color"),
             children: [
               /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center", children: [
                 /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-bold text-muted-foreground", children: "A" }),
@@ -5270,7 +5265,7 @@ function CanvasTextToolbar({
           {
             is_active: verticalAlign === "top",
             onClick: () => onVerticalAlign?.("top"),
-            tooltip: "Align top",
+            tooltip: t5("canvas_toolbar.align_top"),
             children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuAlignVerticalJustifyStart, { className: "h-4 w-4" })
           }
         ),
@@ -5279,7 +5274,7 @@ function CanvasTextToolbar({
           {
             is_active: verticalAlign === "middle",
             onClick: () => onVerticalAlign?.("middle"),
-            tooltip: "Align middle",
+            tooltip: t5("canvas_toolbar.align_middle"),
             children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuAlignVerticalJustifyCenter, { className: "h-4 w-4" })
           }
         ),
@@ -5288,7 +5283,7 @@ function CanvasTextToolbar({
           {
             is_active: verticalAlign === "bottom",
             onClick: () => onVerticalAlign?.("bottom"),
-            tooltip: "Align bottom",
+            tooltip: t5("canvas_toolbar.align_bottom"),
             children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuAlignVerticalJustifyEnd, { className: "h-4 w-4" })
           }
         ),
@@ -5299,7 +5294,7 @@ function CanvasTextToolbar({
             value: font,
             onChange: (e) => onFont?.(e.target.value),
             className: "h-8 text-xs rounded-md border border-border bg-background px-1 text-foreground focus:outline-none",
-            title: "Font family",
+            title: t5("canvas_toolbar.font_family"),
             children: [
               /* @__PURE__ */ jsxRuntime.jsx("option", { value: "sans-serif", children: "Sans" }),
               /* @__PURE__ */ jsxRuntime.jsx("option", { value: "serif", children: "Serif" }),
@@ -5311,7 +5306,7 @@ function CanvasTextToolbar({
           }
         ),
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mx-1 h-6 w-px bg-border" }),
-        /* @__PURE__ */ jsxRuntime.jsx(ToolbarButton, { is_active: bullet, onClick: onBullet, tooltip: "Bullet list", children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuList, { className: "h-4 w-4" }) })
+        /* @__PURE__ */ jsxRuntime.jsx(ToolbarButton, { is_active: bullet, onClick: onBullet, tooltip: t5("canvas_toolbar.bullet_list"), children: /* @__PURE__ */ jsxRuntime.jsx(lu.LuList, { className: "h-4 w-4" }) })
       ]
     }
   ) });
@@ -7689,6 +7684,7 @@ function HazoUiDialog({
     )
   ] }) });
 }
+var t6 = i18n.createPackageT("hazo_ui", en_default);
 function HazoUiConfirmDialog({
   open,
   onOpenChange,
@@ -7697,7 +7693,7 @@ function HazoUiConfirmDialog({
   children,
   variant = "default",
   confirmLabel,
-  cancelLabel = "Cancel",
+  cancelLabel = t6("confirm.cancel"),
   showCancelButton = true,
   onConfirm,
   onCancel,
@@ -8602,6 +8598,7 @@ function EmptyState({
     }
   );
 }
+var t7 = i18n.createPackageT("hazo_ui", en_default);
 function ErrorBanner({
   severity = "error",
   title,
@@ -8636,7 +8633,7 @@ function ErrorBanner({
           {
             type: "button",
             onClick: onDismiss,
-            "aria-label": "Dismiss",
+            "aria-label": t7("error.dismiss"),
             className: "flex-shrink-0 rounded p-1 hover:bg-black/5 focus:outline-none focus:ring-2 focus:ring-offset-2 dark:hover:bg-white/5",
             children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4", "aria-hidden": "true" })
           }
@@ -8645,8 +8642,9 @@ function ErrorBanner({
     }
   );
 }
+var t8 = i18n.createPackageT("hazo_ui", en_default);
 function ErrorPage({
-  title = "Something went wrong",
+  title = t8("error.something_went_wrong"),
   description,
   errorCode,
   correlationId,
@@ -8677,6 +8675,7 @@ function ErrorPage({
     }
   );
 }
+var t9 = i18n.createPackageT("hazo_ui", en_default);
 function LoadingTimeout({
   active,
   children,
@@ -8686,7 +8685,7 @@ function LoadingTimeout({
   label = "content",
   className
 }) {
-  const t4 = {
+  const timeouts = {
     gentle: thresholds?.gentle ?? 5e3,
     firm: thresholds?.firm ?? 15e3,
     expired: thresholds?.expired ?? 3e4
@@ -8698,15 +8697,15 @@ function LoadingTimeout({
       return;
     }
     setPhase("silent");
-    const gentleTimer = window.setTimeout(() => setPhase("gentle"), t4.gentle);
-    const firmTimer = window.setTimeout(() => setPhase("firm"), t4.firm);
-    const expiredTimer = window.setTimeout(() => setPhase("expired"), t4.expired);
+    const gentleTimer = window.setTimeout(() => setPhase("gentle"), timeouts.gentle);
+    const firmTimer = window.setTimeout(() => setPhase("firm"), timeouts.firm);
+    const expiredTimer = window.setTimeout(() => setPhase("expired"), timeouts.expired);
     return () => {
       window.clearTimeout(gentleTimer);
       window.clearTimeout(firmTimer);
       window.clearTimeout(expiredTimer);
     };
-  }, [active, t4.gentle, t4.firm, t4.expired]);
+  }, [active, timeouts.gentle, timeouts.firm, timeouts.expired]);
   if (!active) {
     return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
   }
@@ -8715,7 +8714,7 @@ function LoadingTimeout({
       ErrorBanner,
       {
         severity: "error",
-        title: "This is taking longer than expected",
+        title: t9("loading.taking_longer"),
         message: `We're still trying to load the ${label}. The connection may be slow.`,
         action: onRetry ? /* @__PURE__ */ jsxRuntime.jsx(
           "button",
@@ -8817,6 +8816,7 @@ function NotificationCountBadge({
     }
   );
 }
+var t10 = i18n.createPackageT("hazo_ui", en_default);
 function NotificationItem({
   isRead,
   timestamp,
@@ -8847,7 +8847,7 @@ function NotificationItem({
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cls_notification_item_dot_col flex-shrink-0 pt-1.5", children: !isRead ? /* @__PURE__ */ jsxRuntime.jsx(
           "span",
           {
-            "aria-label": "Unread",
+            "aria-label": t10("notification.unread"),
             className: "cls_notification_item_dot block w-2 h-2 rounded-full bg-primary"
           }
         ) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block w-2 h-2", "aria-hidden": "true" }) }),
@@ -8871,12 +8871,13 @@ function NotificationItem({
     }
   );
 }
+var t11 = i18n.createPackageT("hazo_ui", en_default);
 function LoadingSkeletons() {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
       "aria-busy": "true",
-      "aria-label": "Loading notifications",
+      "aria-label": t11("notification.loading"),
       className: "cls_notification_panel_loading space-y-0",
       children: [0, 1, 2].map((i) => /* @__PURE__ */ jsxRuntime.jsxs(
         "div",
@@ -8935,6 +8936,7 @@ function NotificationPanel({
     }
   );
 }
+var t12 = i18n.createPackageT("hazo_ui", en_default);
 function HazoUiToaster({
   position = "bottom-right",
   closeButton = true,
@@ -8980,12 +8982,12 @@ function permissionToast({
   action,
   duration = 5e3
 }) {
-  const description = missingPermissions.length === 0 ? "You do not have permission to perform this action." : `Missing: ${missingPermissions.map((key) => {
+  const description = missingPermissions.length === 0 ? t12("toast.permission_denied_message") : `Missing: ${missingPermissions.map((key) => {
     const label = descriptions?.[key];
     return label ? `\`${key}\` \u2014 ${label}` : `\`${key}\``;
   }).join("; ")}`;
   return errorToast({
-    title: "Permission required",
+    title: t12("toast.permission_required"),
     description,
     action,
     duration
@@ -9180,41 +9182,55 @@ function useWakeLock() {
 }
 function useFullscreen(elementRef) {
   const [is_fullscreen, set_is_fullscreen] = React27.useState(false);
+  const supported = typeof document !== "undefined" && typeof document.documentElement.requestFullscreen === "function";
   React27.useEffect(() => {
-    if (typeof document === "undefined") return;
+    if (typeof document === "undefined" || !supported) return;
     const handle_change = () => {
       set_is_fullscreen(!!document.fullscreenElement);
     };
     document.addEventListener("fullscreenchange", handle_change);
     set_is_fullscreen(!!document.fullscreenElement);
     return () => document.removeEventListener("fullscreenchange", handle_change);
-  }, []);
+  }, [supported]);
   const get_target = React27.useCallback(() => {
     return elementRef?.current ?? document.documentElement;
   }, [elementRef]);
   const enter = React27.useCallback(async () => {
-    if (typeof document === "undefined" || !document.documentElement.requestFullscreen) return;
+    if (typeof document === "undefined") return;
+    if (!supported) {
+      set_is_fullscreen(true);
+      return;
+    }
     if (document.fullscreenElement) return;
     try {
       await get_target().requestFullscreen();
     } catch {
     }
-  }, [get_target]);
+  }, [supported, get_target]);
   const exit = React27.useCallback(async () => {
     if (typeof document === "undefined") return;
+    if (!supported) {
+      set_is_fullscreen(false);
+      return;
+    }
     if (!document.fullscreenElement) return;
     try {
       await document.exitFullscreen();
     } catch {
     }
-  }, []);
+  }, [supported]);
   const toggle = React27.useCallback(async () => {
+    if (!supported) {
+      if (is_fullscreen) await exit();
+      else await enter();
+      return;
+    }
     if (document.fullscreenElement) {
       await exit();
     } else {
       await enter();
     }
-  }, [enter, exit]);
+  }, [supported, is_fullscreen, enter, exit]);
   return { isFullscreen: is_fullscreen, enter, exit, toggle };
 }
 function use_wake_lock(active) {
@@ -10834,7 +10850,7 @@ function serializeFilter(filter) {
   const fields = (filter.fields ?? []).map((f) => `${f.field}:${f.operator ?? ""}:${String(f.value)}`).join(",");
   return `${filter.search ?? ""}|${fields}`;
 }
-var t3 = createPackageT("hazo_ui", en_default);
+var t13 = i18n.createPackageT("hazo_ui", en_default);
 function HazoUiTable(props) {
   const state = useTableState(props);
   const { columns, rows, getRowKey, className, caption } = props;
@@ -10869,12 +10885,12 @@ function HazoUiTable(props) {
     ) }) : state.serverError != null ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cls_hazo_ui_table_mobile_error py-6", children: renderErrorState(props.error, state.serverError) }) : state.displayed.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cls_hazo_ui_table_mobile_empty py-6", children: noActiveFilters(state.filter) && rows.length === 0 ? typeof props.empty === "string" || props.empty === void 0 ? /* @__PURE__ */ jsxRuntime.jsx(
       EmptyState,
       {
-        title: typeof props.empty === "string" && props.empty || t3("table.empty")
+        title: typeof props.empty === "string" && props.empty || t13("table.empty")
       }
     ) : props.empty : typeof props.noResults === "string" || props.noResults === void 0 ? /* @__PURE__ */ jsxRuntime.jsx(
       EmptyState,
       {
-        title: typeof props.noResults === "string" && props.noResults || t3("table.no_results")
+        title: typeof props.noResults === "string" && props.noResults || t13("table.no_results")
       }
     ) : props.noResults }) : /* @__PURE__ */ jsxRuntime.jsx(
       TableMobileCards,
@@ -10897,7 +10913,7 @@ function HazoUiTable(props) {
             {
               type: "button",
               onClick: (e) => state.cycleHeaderSort(c.key, e.shiftKey),
-              title: t3("table.sort_tooltip"),
+              title: t13("table.sort_tooltip"),
               className: "cls_hazo_ui_table_sort_btn inline-flex items-center gap-1 hover:text-foreground",
               children: [
                 /* @__PURE__ */ jsxRuntime.jsx("span", { children: c.label }),
@@ -10929,12 +10945,12 @@ function HazoUiTable(props) {
           children: noActiveFilters(state.filter) && rows.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cls_hazo_ui_table_empty_wrap py-6", children: typeof props.empty === "string" || props.empty === void 0 ? /* @__PURE__ */ jsxRuntime.jsx(
             EmptyState,
             {
-              title: typeof props.empty === "string" && props.empty || t3("table.empty")
+              title: typeof props.empty === "string" && props.empty || t13("table.empty")
             }
           ) : props.empty }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cls_hazo_ui_table_no_results_wrap py-6", children: typeof props.noResults === "string" || props.noResults === void 0 ? /* @__PURE__ */ jsxRuntime.jsx(
             EmptyState,
             {
-              title: typeof props.noResults === "string" && props.noResults || t3("table.no_results")
+              title: typeof props.noResults === "string" && props.noResults || t13("table.no_results")
             }
           ) : props.noResults })
         }
@@ -10973,7 +10989,7 @@ function renderCell(c, row, i) {
 var DEFAULT_NUMBER_LOCALE = "en-US";
 function formatValue(value, formatter, currency, locale) {
   if (value === null || value === void 0 || value === "") return "\u2014";
-  const lc = locale ?? resolvePackageLocale(DEFAULT_NUMBER_LOCALE);
+  const lc = locale ?? i18n.resolvePackageLocale(DEFAULT_NUMBER_LOCALE);
   switch (formatter) {
     case "date": {
       const d = value instanceof Date ? value : new Date(value);
@@ -11048,7 +11064,7 @@ function PaginationFooter({
   const end = Math.min((page + 1) * pageSize, total);
   const lastPage = Math.max(0, Math.ceil(total / pageSize) - 1);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cls_hazo_ui_table_pagination flex items-center justify-between gap-3 pt-2 text-sm", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cls_hazo_ui_table_page_counter text-muted-foreground", children: t3("table.showing", {
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cls_hazo_ui_table_page_counter text-muted-foreground", children: t13("table.showing", {
       start: String(start),
       end: String(end),
       total: String(total)
@@ -11061,8 +11077,8 @@ function PaginationFooter({
           size: "sm",
           onClick: () => onPageChange(Math.max(0, page - 1)),
           disabled: page === 0,
-          "aria-label": t3("table.prev_aria"),
-          children: t3("table.prev")
+          "aria-label": t13("table.prev_aria"),
+          children: t13("table.prev")
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsx(
@@ -11072,8 +11088,8 @@ function PaginationFooter({
           size: "sm",
           onClick: () => onPageChange(Math.min(lastPage, page + 1)),
           disabled: page >= lastPage,
-          "aria-label": t3("table.next_aria"),
-          children: t3("table.next")
+          "aria-label": t13("table.next_aria"),
+          children: t13("table.next")
         }
       )
     ] })
@@ -11117,7 +11133,7 @@ function Toolbar2(props) {
           setSearchValue(v);
           onSearchChange(v);
         },
-        placeholder: searchPlaceholder ?? t3("table.search_placeholder"),
+        placeholder: searchPlaceholder ?? t13("table.search_placeholder"),
         className: "cls_hazo_ui_table_search w-full sm:max-w-xs"
       }
     ) : /* @__PURE__ */ jsxRuntime.jsx("div", {}),
@@ -11165,8 +11181,8 @@ function renderErrorState(error, serverError) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     EmptyState,
     {
-      title: t3("table.error_title"),
-      description: msg || t3("table.error_description")
+      title: t13("table.error_title"),
+      description: msg || t13("table.error_description")
     }
   );
 }
@@ -11952,8 +11968,8 @@ function computeEta(durationWindow, unitCount, concurrency = 1, fallbackUnitMs =
 }
 function easeToward(elapsed, eta, maxCap = 0.95) {
   if (eta <= 0 || elapsed <= 0) return 0;
-  const t4 = elapsed / eta;
-  return maxCap * (1 - Math.exp(-1.5 * t4));
+  const t14 = elapsed / eta;
+  return maxCap * (1 - Math.exp(-1.5 * t14));
 }
 function HazoUiProgressBar({
   value,
@@ -11984,7 +12000,7 @@ function HazoUiProgressBar({
         children: /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {
-            className: "h-full rounded-full bg-accent transition-[width] duration-200 ease-out motion-reduce:transition-none",
+            className: "h-full rounded-full bg-primary transition-[width] duration-200 ease-out motion-reduce:transition-none",
             style: { width: `${pct}%` }
           }
         )
@@ -12071,6 +12087,8 @@ function HazoUiEtaProgress({
   fallbackUnitMs = 5e3,
   level = "global",
   label,
+  showPercent,
+  size,
   endpoint,
   handleRef,
   className
@@ -12105,6 +12123,8 @@ function HazoUiEtaProgress({
     {
       value: handle.value,
       label,
+      showPercent,
+      size,
       className
     }
   );