hazo_ui 6.12.0 → 6.12.3

package/dist/index.js

@@ -112,8 +112,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);
@@ -127,12 +127,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;
   }
@@ -715,7 +715,39 @@ 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);
 function FilterFieldItem({
@@ -1164,6 +1196,7 @@ function HazoUiMultiFilterDialog({
     ] })
   ] });
 }
+var t2 = createPackageT("hazo_ui", en_default);
 function SortableSortFieldItem({
   sortConfig,
   fieldLabel,
@@ -1274,8 +1307,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,
@@ -1393,7 +1426,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__ */ jsx(
               ArrowUpDown,
@@ -1466,7 +1499,7 @@ function HazoUiMultiSortDialog({
             }
           ) }),
           /* @__PURE__ */ jsx(PopoverContent, { className: "cls_combobox_popover w-[var(--radix-popover-trigger-width)] p-0", align: "start", children: /* @__PURE__ */ jsxs(Command, { children: [
-            /* @__PURE__ */ jsx(CommandInput, { placeholder: "Search fields...", className: "cls_command_input" }),
+            /* @__PURE__ */ jsx(CommandInput, { placeholder: t2("sort.search_fields"), className: "cls_command_input" }),
             /* @__PURE__ */ jsx(CommandList, { children: availableFieldsToAdd.length === 0 ? /* @__PURE__ */ jsx(CommandEmpty, { children: "No fields available." }) : /* @__PURE__ */ jsx(CommandGroup, { children: availableFieldsToAdd.map((field) => /* @__PURE__ */ jsx(
               CommandItem,
               {
@@ -1489,7 +1522,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__ */ jsxs("div", { className: "cls_footer_right flex items-center gap-2", children: [
@@ -1501,7 +1534,7 @@ function HazoUiMultiSortDialog({
               onClick: handleCancel,
               className: "cls_cancel_btn",
               style: cancelButtonStyles,
-              children: "Cancel"
+              children: t2("sort.cancel")
             }
           ),
           /* @__PURE__ */ jsx(
@@ -1511,7 +1544,7 @@ function HazoUiMultiSortDialog({
               onClick: handleApply,
               className: "cls_apply_btn",
               style: submitButtonStyles,
-              children: "Apply"
+              children: t2("sort.apply")
             }
           )
         ] })
@@ -1930,6 +1963,7 @@ var TabsContent = React27.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 TabsContent.displayName = TabsPrimitive.Content.displayName;
+var t3 = createPackageT("hazo_ui", en_default);
 function isLucideValue(value) {
   return value.startsWith("lucide:");
 }
@@ -2195,7 +2229,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",
@@ -3641,10 +3675,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])
   }));
 }
 
@@ -3691,7 +3725,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 = createPackageT("hazo_ui", en_default);
 var ALL_ON = {
   undo_redo: true,
   block_type: true,
@@ -3746,7 +3780,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;
@@ -3890,7 +3924,7 @@ var Toolbar = ({
         {
           onClick: () => editor.chain().focus().undo().run(),
           disabled: !editor.can().undo(),
-          tooltip: t2("rte.undo"),
+          tooltip: t4("rte.undo"),
           children: /* @__PURE__ */ jsx(LuUndo2, { className: "h-4 w-4" })
         },
         "undo"
@@ -3900,7 +3934,7 @@ var Toolbar = ({
         {
           onClick: () => editor.chain().focus().redo().run(),
           disabled: !editor.can().redo(),
-          tooltip: t2("rte.redo"),
+          tooltip: t4("rte.redo"),
           children: /* @__PURE__ */ jsx(LuRedo2, { className: "h-4 w-4" })
         },
         "redo"
@@ -3941,7 +3975,7 @@ var Toolbar = ({
             ToolbarButton,
             {
               onClick: () => handle_font_size_change(-2),
-              tooltip: t2("rte.decrease_font_size"),
+              tooltip: t4("rte.decrease_font_size"),
               children: /* @__PURE__ */ jsx(LuMinus, { className: "h-3 w-3" })
             }
           ),
@@ -3950,7 +3984,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__ */ jsx(LuPlus, { className: "h-3 w-3" })
             }
           )
@@ -3968,7 +4002,7 @@ var Toolbar = ({
           {
             onClick: () => editor.chain().focus().toggleBold().run(),
             is_active: editor.isActive("bold"),
-            tooltip: t2("rte.bold"),
+            tooltip: t4("rte.bold"),
             children: /* @__PURE__ */ jsx(LuBold, { className: "h-4 w-4" })
           },
           "bold"
@@ -3982,7 +4016,7 @@ var Toolbar = ({
           {
             onClick: () => editor.chain().focus().toggleItalic().run(),
             is_active: editor.isActive("italic"),
-            tooltip: t2("rte.italic"),
+            tooltip: t4("rte.italic"),
             children: /* @__PURE__ */ jsx(LuItalic, { className: "h-4 w-4" })
           },
           "italic"
@@ -3996,7 +4030,7 @@ var Toolbar = ({
           {
             onClick: () => editor.chain().focus().toggleUnderline().run(),
             is_active: editor.isActive("underline"),
-            tooltip: t2("rte.underline"),
+            tooltip: t4("rte.underline"),
             children: /* @__PURE__ */ jsx(LuUnderline, { className: "h-4 w-4" })
           },
           "underline"
@@ -4010,7 +4044,7 @@ var Toolbar = ({
           {
             onClick: () => editor.chain().focus().toggleStrike().run(),
             is_active: editor.isActive("strike"),
-            tooltip: t2("rte.strikethrough"),
+            tooltip: t4("rte.strikethrough"),
             children: /* @__PURE__ */ jsx(LuStrikethrough, { className: "h-4 w-4" })
           },
           "strike"
@@ -4024,7 +4058,7 @@ var Toolbar = ({
           {
             onClick: () => editor.chain().focus().toggleSubscript().run(),
             is_active: editor.isActive("subscript"),
-            tooltip: t2("rte.subscript"),
+            tooltip: t4("rte.subscript"),
             children: /* @__PURE__ */ jsx(LuSubscript, { className: "h-4 w-4" })
           },
           "sub"
@@ -4038,7 +4072,7 @@ var Toolbar = ({
           {
             onClick: () => editor.chain().focus().toggleSuperscript().run(),
             is_active: editor.isActive("superscript"),
-            tooltip: t2("rte.superscript"),
+            tooltip: t4("rte.superscript"),
             children: /* @__PURE__ */ jsx(LuSuperscript, { className: "h-4 w-4" })
           },
           "super"
@@ -4052,7 +4086,7 @@ var Toolbar = ({
     if (tb.link) {
       items.push(
         /* @__PURE__ */ jsxs(Popover, { open: link_popover_open, onOpenChange: set_link_popover_open, children: [
-          /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(ToolbarButton, { is_active: editor.isActive("link"), tooltip: t2("rte.link"), children: /* @__PURE__ */ jsx(LuLink, { className: "h-4 w-4" }) }) }),
+          /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(ToolbarButton, { is_active: editor.isActive("link"), tooltip: t4("rte.link"), children: /* @__PURE__ */ jsx(LuLink, { className: "h-4 w-4" }) }) }),
           /* @__PURE__ */ jsx(PopoverContent, { className: "w-80 p-3", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
             /* @__PURE__ */ jsx(
               Input,
@@ -4088,7 +4122,7 @@ var Toolbar = ({
           ToolbarButton,
           {
             onClick: () => editor.chain().focus().unsetAllMarks().clearNodes().run(),
-            tooltip: t2("rte.clear_formatting"),
+            tooltip: t4("rte.clear_formatting"),
             children: /* @__PURE__ */ jsx(LuRemoveFormatting, { className: "h-4 w-4" })
           },
           "clear"
@@ -4102,7 +4136,7 @@ var Toolbar = ({
     if (tb.text_color) {
       items.push(
         /* @__PURE__ */ jsxs(Popover, { open: text_color_open, onOpenChange: set_text_color_open, children: [
-          /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(ToolbarButton, { tooltip: t2("rte.text_color"), children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center", children: [
+          /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(ToolbarButton, { tooltip: t4("rte.text_color"), children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center", children: [
             /* @__PURE__ */ jsx(LuPalette, { className: "h-4 w-4" }),
             /* @__PURE__ */ jsx(
               "div",
@@ -4145,7 +4179,7 @@ var Toolbar = ({
     if (tb.highlight_color) {
       items.push(
         /* @__PURE__ */ jsxs(Popover, { open: highlight_color_open, onOpenChange: set_highlight_color_open, children: [
-          /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(ToolbarButton, { tooltip: t2("rte.highlight_color"), children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center", children: [
+          /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(ToolbarButton, { tooltip: t4("rte.highlight_color"), children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center", children: [
             /* @__PURE__ */ jsx(LuHighlighter, { className: "h-4 w-4" }),
             /* @__PURE__ */ jsx(
               "div",
@@ -4188,7 +4222,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__ */ jsx(LuAlignLeft, { className: "h-4 w-4" })
         },
         "align-left"
@@ -4198,7 +4232,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__ */ jsx(LuAlignCenter, { className: "h-4 w-4" })
         },
         "align-center"
@@ -4208,7 +4242,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__ */ jsx(LuAlignRight, { className: "h-4 w-4" })
         },
         "align-right"
@@ -4218,7 +4252,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__ */ jsx(LuAlignJustify, { className: "h-4 w-4" })
         },
         "align-justify"
@@ -4234,7 +4268,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__ */ jsx(LuList, { className: "h-4 w-4" })
           },
           "bullet"
@@ -4248,7 +4282,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__ */ jsx(LuListOrdered, { className: "h-4 w-4" })
           },
           "ordered"
@@ -4262,7 +4296,7 @@ var Toolbar = ({
           {
             onClick: () => editor.chain().focus().toggleTaskList().run(),
             is_active: editor.isActive("taskList"),
-            tooltip: t2("rte.checklist"),
+            tooltip: t4("rte.checklist"),
             children: /* @__PURE__ */ jsx(LuListChecks, { className: "h-4 w-4" })
           },
           "task"
@@ -4284,7 +4318,7 @@ var Toolbar = ({
             }
           },
           disabled: !editor.can().liftListItem("listItem") && !editor.can().liftListItem("taskItem"),
-          tooltip: t2("rte.decrease_indent"),
+          tooltip: t4("rte.decrease_indent"),
           children: /* @__PURE__ */ jsx(LuIndentDecrease, { className: "h-4 w-4" })
         },
         "indent-dec"
@@ -4300,7 +4334,7 @@ var Toolbar = ({
             }
           },
           disabled: !editor.can().sinkListItem("listItem") && !editor.can().sinkListItem("taskItem"),
-          tooltip: t2("rte.increase_indent"),
+          tooltip: t4("rte.increase_indent"),
           children: /* @__PURE__ */ jsx(LuIndentIncrease, { className: "h-4 w-4" })
         },
         "indent-inc"
@@ -4311,7 +4345,7 @@ var Toolbar = ({
     const items = [];
     if (tb.horizontal_rule) {
       items.push(
-        /* @__PURE__ */ jsx(ToolbarButton, { onClick: handle_hr_insert, tooltip: t2("rte.horizontal_rule"), children: /* @__PURE__ */ jsx(RxDividerHorizontal, { className: "h-4 w-4" }) }, "hr")
+        /* @__PURE__ */ jsx(ToolbarButton, { onClick: handle_hr_insert, tooltip: t4("rte.horizontal_rule"), children: /* @__PURE__ */ jsx(RxDividerHorizontal, { className: "h-4 w-4" }) }, "hr")
       );
     }
     if (tb.image) {
@@ -4320,7 +4354,7 @@ var Toolbar = ({
           ToolbarButton,
           {
             onClick: () => image_input_ref.current?.click(),
-            tooltip: t2("rte.insert_image"),
+            tooltip: t4("rte.insert_image"),
             children: /* @__PURE__ */ jsx(LuImage, { className: "h-4 w-4" })
           },
           "image"
@@ -4334,7 +4368,7 @@ var Toolbar = ({
             ToolbarButton,
             {
               is_active: editor.isActive("table"),
-              tooltip: t2("rte.table"),
+              tooltip: t4("rte.table"),
               children: /* @__PURE__ */ jsx(LuTable, { className: "h-4 w-4" })
             }
           ) }),
@@ -4506,7 +4540,7 @@ var Toolbar = ({
     if (tb.variables && variables.length > 0) {
       items.push(
         /* @__PURE__ */ jsxs(Popover, { open: variables_menu_open, onOpenChange: set_variables_menu_open, children: [
-          /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(ToolbarButton, { tooltip: t2("rte.insert_variable"), children: /* @__PURE__ */ jsx(LuVariable, { className: "h-4 w-4" }) }) }),
+          /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(ToolbarButton, { tooltip: t4("rte.insert_variable"), children: /* @__PURE__ */ jsx(LuVariable, { className: "h-4 w-4" }) }) }),
           /* @__PURE__ */ jsx(PopoverContent, { className: "w-64 p-0", align: "start", children: /* @__PURE__ */ jsxs(Command, { children: [
             /* @__PURE__ */ jsx(CommandInput, { placeholder: "Search variables...", className: "h-8 text-xs" }),
             /* @__PURE__ */ jsxs(CommandList, { children: [
@@ -4535,7 +4569,7 @@ var Toolbar = ({
           ToolbarButton,
           {
             onClick: () => file_input_ref.current?.click(),
-            tooltip: t2("rte.attach_file"),
+            tooltip: t4("rte.attach_file"),
             children: /* @__PURE__ */ jsx(LuPaperclip, { className: "h-4 w-4" })
           },
           "attach"
@@ -5056,6 +5090,7 @@ var HazoUiRte = ({
   );
 };
 HazoUiRte.displayName = "HazoUiRte";
+var t5 = createPackageT("hazo_ui", en_default);
 function CanvasTextToolbar({
   bold,
   italic,
@@ -5086,14 +5121,14 @@ function CanvasTextToolbar({
       ),
       style,
       children: [
-        /* @__PURE__ */ jsx(ToolbarButton, { is_active: bold, onClick: onBold, tooltip: "Bold", children: /* @__PURE__ */ jsx(LuBold, { className: "h-4 w-4" }) }),
-        /* @__PURE__ */ jsx(ToolbarButton, { is_active: italic, onClick: onItalic, tooltip: "Italic", children: /* @__PURE__ */ jsx(LuItalic, { className: "h-4 w-4" }) }),
+        /* @__PURE__ */ jsx(ToolbarButton, { is_active: bold, onClick: onBold, tooltip: t5("canvas_toolbar.bold"), children: /* @__PURE__ */ jsx(LuBold, { className: "h-4 w-4" }) }),
+        /* @__PURE__ */ jsx(ToolbarButton, { is_active: italic, onClick: onItalic, tooltip: t5("canvas_toolbar.italic"), children: /* @__PURE__ */ jsx(LuItalic, { className: "h-4 w-4" }) }),
         /* @__PURE__ */ jsx(
           ToolbarButton,
           {
             is_active: underline,
             onClick: onUnderline,
-            tooltip: "Underline",
+            tooltip: t5("canvas_toolbar.underline"),
             children: /* @__PURE__ */ jsx(LuUnderline, { className: "h-4 w-4" })
           }
         ),
@@ -5103,7 +5138,7 @@ function CanvasTextToolbar({
           {
             is_active: align === "left",
             onClick: () => onAlign?.("left"),
-            tooltip: "Align left",
+            tooltip: t5("canvas_toolbar.align_left"),
             children: /* @__PURE__ */ jsx(LuAlignLeft, { className: "h-4 w-4" })
           }
         ),
@@ -5112,7 +5147,7 @@ function CanvasTextToolbar({
           {
             is_active: align === "center",
             onClick: () => onAlign?.("center"),
-            tooltip: "Align center",
+            tooltip: t5("canvas_toolbar.align_center"),
             children: /* @__PURE__ */ jsx(LuAlignCenter, { className: "h-4 w-4" })
           }
         ),
@@ -5121,7 +5156,7 @@ function CanvasTextToolbar({
           {
             is_active: align === "right",
             onClick: () => onAlign?.("right"),
-            tooltip: "Align right",
+            tooltip: t5("canvas_toolbar.align_right"),
             children: /* @__PURE__ */ jsx(LuAlignRight, { className: "h-4 w-4" })
           }
         ),
@@ -5130,7 +5165,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__ */ jsxs("div", { className: "flex flex-col items-center", children: [
                 /* @__PURE__ */ jsx("span", { className: "text-xs font-bold text-muted-foreground", children: "A" }),
@@ -5160,7 +5195,7 @@ function CanvasTextToolbar({
           {
             is_active: verticalAlign === "top",
             onClick: () => onVerticalAlign?.("top"),
-            tooltip: "Align top",
+            tooltip: t5("canvas_toolbar.align_top"),
             children: /* @__PURE__ */ jsx(LuAlignVerticalJustifyStart, { className: "h-4 w-4" })
           }
         ),
@@ -5169,7 +5204,7 @@ function CanvasTextToolbar({
           {
             is_active: verticalAlign === "middle",
             onClick: () => onVerticalAlign?.("middle"),
-            tooltip: "Align middle",
+            tooltip: t5("canvas_toolbar.align_middle"),
             children: /* @__PURE__ */ jsx(LuAlignVerticalJustifyCenter, { className: "h-4 w-4" })
           }
         ),
@@ -5178,7 +5213,7 @@ function CanvasTextToolbar({
           {
             is_active: verticalAlign === "bottom",
             onClick: () => onVerticalAlign?.("bottom"),
-            tooltip: "Align bottom",
+            tooltip: t5("canvas_toolbar.align_bottom"),
             children: /* @__PURE__ */ jsx(LuAlignVerticalJustifyEnd, { className: "h-4 w-4" })
           }
         ),
@@ -5189,7 +5224,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__ */ jsx("option", { value: "sans-serif", children: "Sans" }),
               /* @__PURE__ */ jsx("option", { value: "serif", children: "Serif" }),
@@ -5201,7 +5236,7 @@ function CanvasTextToolbar({
           }
         ),
         /* @__PURE__ */ jsx("div", { className: "mx-1 h-6 w-px bg-border" }),
-        /* @__PURE__ */ jsx(ToolbarButton, { is_active: bullet, onClick: onBullet, tooltip: "Bullet list", children: /* @__PURE__ */ jsx(LuList, { className: "h-4 w-4" }) })
+        /* @__PURE__ */ jsx(ToolbarButton, { is_active: bullet, onClick: onBullet, tooltip: t5("canvas_toolbar.bullet_list"), children: /* @__PURE__ */ jsx(LuList, { className: "h-4 w-4" }) })
       ]
     }
   ) });
@@ -7579,6 +7614,7 @@ function HazoUiDialog({
     )
   ] }) });
 }
+var t6 = createPackageT("hazo_ui", en_default);
 function HazoUiConfirmDialog({
   open,
   onOpenChange,
@@ -7587,7 +7623,7 @@ function HazoUiConfirmDialog({
   children,
   variant = "default",
   confirmLabel,
-  cancelLabel = "Cancel",
+  cancelLabel = t6("confirm.cancel"),
   showCancelButton = true,
   onConfirm,
   onCancel,
@@ -8492,6 +8528,7 @@ function EmptyState({
     }
   );
 }
+var t7 = createPackageT("hazo_ui", en_default);
 function ErrorBanner({
   severity = "error",
   title,
@@ -8526,7 +8563,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__ */ jsx(X, { className: "h-4 w-4", "aria-hidden": "true" })
           }
@@ -8535,8 +8572,9 @@ function ErrorBanner({
     }
   );
 }
+var t8 = createPackageT("hazo_ui", en_default);
 function ErrorPage({
-  title = "Something went wrong",
+  title = t8("error.something_went_wrong"),
   description,
   errorCode,
   correlationId,
@@ -8567,6 +8605,7 @@ function ErrorPage({
     }
   );
 }
+var t9 = createPackageT("hazo_ui", en_default);
 function LoadingTimeout({
   active,
   children,
@@ -8576,7 +8615,7 @@ function LoadingTimeout({
   label = "content",
   className
 }) {
-  const t4 = {
+  const timeouts = {
     gentle: thresholds?.gentle ?? 5e3,
     firm: thresholds?.firm ?? 15e3,
     expired: thresholds?.expired ?? 3e4
@@ -8588,15 +8627,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__ */ jsx(Fragment$1, { children });
   }
@@ -8605,7 +8644,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__ */ jsx(
           "button",
@@ -8707,6 +8746,7 @@ function NotificationCountBadge({
     }
   );
 }
+var t10 = createPackageT("hazo_ui", en_default);
 function NotificationItem({
   isRead,
   timestamp,
@@ -8737,7 +8777,7 @@ function NotificationItem({
         /* @__PURE__ */ jsx("div", { className: "cls_notification_item_dot_col flex-shrink-0 pt-1.5", children: !isRead ? /* @__PURE__ */ 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__ */ jsx("span", { className: "block w-2 h-2", "aria-hidden": "true" }) }),
@@ -8761,12 +8801,13 @@ function NotificationItem({
     }
   );
 }
+var t11 = createPackageT("hazo_ui", en_default);
 function LoadingSkeletons() {
   return /* @__PURE__ */ 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__ */ jsxs(
         "div",
@@ -8825,6 +8866,7 @@ function NotificationPanel({
     }
   );
 }
+var t12 = createPackageT("hazo_ui", en_default);
 function HazoUiToaster({
   position = "bottom-right",
   closeButton = true,
@@ -8870,12 +8912,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
@@ -9070,41 +9112,55 @@ function useWakeLock() {
 }
 function useFullscreen(elementRef) {
   const [is_fullscreen, set_is_fullscreen] = useState(false);
+  const supported = typeof document !== "undefined" && typeof document.documentElement.requestFullscreen === "function";
   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 = useCallback(() => {
     return elementRef?.current ?? document.documentElement;
   }, [elementRef]);
   const enter = 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 = 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 = 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) {
@@ -10724,7 +10780,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 = createPackageT("hazo_ui", en_default);
 function HazoUiTable(props) {
   const state = useTableState(props);
   const { columns, rows, getRowKey, className, caption } = props;
@@ -10759,12 +10815,12 @@ function HazoUiTable(props) {
     ) }) : state.serverError != null ? /* @__PURE__ */ jsx("div", { className: "cls_hazo_ui_table_mobile_error py-6", children: renderErrorState(props.error, state.serverError) }) : state.displayed.length === 0 ? /* @__PURE__ */ 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__ */ 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__ */ 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__ */ jsx(
       TableMobileCards,
@@ -10787,7 +10843,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__ */ jsx("span", { children: c.label }),
@@ -10819,12 +10875,12 @@ function HazoUiTable(props) {
           children: noActiveFilters(state.filter) && rows.length === 0 ? /* @__PURE__ */ jsx("div", { className: "cls_hazo_ui_table_empty_wrap py-6", children: typeof props.empty === "string" || props.empty === void 0 ? /* @__PURE__ */ 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__ */ jsx("div", { className: "cls_hazo_ui_table_no_results_wrap py-6", children: typeof props.noResults === "string" || props.noResults === void 0 ? /* @__PURE__ */ 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 })
         }
@@ -10938,7 +10994,7 @@ function PaginationFooter({
   const end = Math.min((page + 1) * pageSize, total);
   const lastPage = Math.max(0, Math.ceil(total / pageSize) - 1);
   return /* @__PURE__ */ jsxs("div", { className: "cls_hazo_ui_table_pagination flex items-center justify-between gap-3 pt-2 text-sm", children: [
-    /* @__PURE__ */ jsx("span", { className: "cls_hazo_ui_table_page_counter text-muted-foreground", children: t3("table.showing", {
+    /* @__PURE__ */ 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)
@@ -10951,8 +11007,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__ */ jsx(
@@ -10962,8 +11018,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")
         }
       )
     ] })
@@ -11007,7 +11063,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__ */ jsx("div", {}),
@@ -11055,8 +11111,8 @@ function renderErrorState(error, serverError) {
   return /* @__PURE__ */ jsx(
     EmptyState,
     {
-      title: t3("table.error_title"),
-      description: msg || t3("table.error_description")
+      title: t13("table.error_title"),
+      description: msg || t13("table.error_description")
     }
   );
 }
@@ -11842,8 +11898,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,
@@ -11874,7 +11930,7 @@ function HazoUiProgressBar({
         children: /* @__PURE__ */ 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}%` }
           }
         )
@@ -11961,6 +12017,8 @@ function HazoUiEtaProgress({
   fallbackUnitMs = 5e3,
   level = "global",
   label,
+  showPercent,
+  size,
   endpoint,
   handleRef,
   className
@@ -11995,6 +12053,8 @@ function HazoUiEtaProgress({
     {
       value: handle.value,
       label,
+      showPercent,
+      size,
       className
     }
   );