@sustaina/shared-ui 1.23.0 → 1.24.0

package/dist/index.mjs

@@ -18,7 +18,7 @@ import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
 import { reSplitAlphaNumeric, useReactTable, getCoreRowModel, getGroupedRowModel, getExpandedRowModel, getSortedRowModel, getFilteredRowModel, flexRender } from '@tanstack/react-table';
 import * as SheetPrimitive from '@radix-ui/react-dialog';
 import i18n from 'i18next';
-import { initReactI18next, useTranslation } from 'react-i18next';
+import { initReactI18next } from 'react-i18next';
 import { create } from 'zustand';
 import StarterKit from '@tiptap/starter-kit';
 import { ReactNodeViewRenderer, NodeViewWrapper, useEditor, EditorContent } from '@tiptap/react';
@@ -57,6 +57,7 @@ import { $setBlocksType } from '@lexical/selection';
 import * as SeparatorPrimitive from '@radix-ui/react-separator';
 import * as SwitchPrimitive from '@radix-ui/react-switch';
 import Cropper from 'react-easy-crop';
+import { NumericFormat } from 'react-number-format';
 
 var __defProp = Object.defineProperty;
 var __export = (target, all) => {
@@ -5070,17 +5071,17 @@ var defaultResource = {
 };
 
 // src/components/dialog-alert/locale/i18n.ts
-i18n.use(initReactI18next).init({
+var instance = i18n.createInstance({
   resources: defaultResource,
   lng: "sharedui",
   fallbackLng: "sharedui",
   defaultNS: "translation",
   interpolation: {
     escapeValue: false
-    // react already safes from xss
   }
-});
-var i18n_default = i18n;
+}).use(initReactI18next);
+instance.init();
+var i18n_default = instance;
 var titleColorVariant = {
   default: "",
   success: "text-green-600",
@@ -5096,7 +5097,7 @@ function DialogAlert({
   description,
   variant = "default",
   confirmText,
-  cancelText = "cancel",
+  cancelText = i18nPrefix + "cancel",
   onConfirm,
   onCancel,
   showCancel = true,
@@ -5105,7 +5106,6 @@ function DialogAlert({
   persistent = false
 }) {
   const alignClass = align === "start" ? "justify-start" : align === "end" ? "justify-end" : "justify-center";
-  const { t } = useTranslation();
   const handleCancel = useCallback(() => {
     onCancel?.();
     onOpenChange(false);
@@ -5117,13 +5117,13 @@ function DialogAlert({
   return /* @__PURE__ */ jsx(Dialog2, { open, onOpenChange: persistent ? () => {
   } : onOpenChange, children: /* @__PURE__ */ jsxs(DialogContent2, { className: "max-w-md", showCloseButton: !persistent, children: [
     /* @__PURE__ */ jsxs(DialogHeader2, { children: [
-      title && /* @__PURE__ */ jsx(DialogTitle2, { className: titleColorVariant[variant], children: t(title) }),
-      description && /* @__PURE__ */ jsx(DialogDescription2, { children: t(description) })
+      title && /* @__PURE__ */ jsx(DialogTitle2, { className: titleColorVariant[variant], children: i18n_default.t(title) }),
+      description && /* @__PURE__ */ jsx(DialogDescription2, { children: i18n_default.t(description) })
     ] }),
     outlet && outlet,
     /* @__PURE__ */ jsxs("div", { className: `flex gap-3 mt-3 ${alignClass}`, children: [
-      showCancel && /* @__PURE__ */ jsx(Button2, { variant: "cancel", onClick: handleCancel, children: t(cancelText) }),
-      confirmText && /* @__PURE__ */ jsx(Button2, { variant, onClick: handleConfirm, children: t(confirmText) })
+      showCancel && /* @__PURE__ */ jsx(Button2, { variant: "cancel", onClick: handleCancel, children: i18n_default.t(cancelText) }),
+      confirmText && /* @__PURE__ */ jsx(Button2, { variant, onClick: handleConfirm, children: i18n_default.t(confirmText) })
     ] })
   ] }) });
 }
@@ -9738,7 +9738,174 @@ var Truncated = ({ children, className, ellipsis = true, as = "p", style }) => {
   );
 };
 var truncated_default = Truncated;
+var InputPrimitive2 = React4.forwardRef(
+  ({ className, type = "text", ...props }, ref) => {
+    return /* @__PURE__ */ jsx(
+      "input",
+      {
+        ref,
+        type,
+        className: cn(
+          "placeholder:text-neutral-400 text-neutral-900 flex h-10 w-full min-w-0 items-center rounded-lg border bg-white px-4 text-sm transition-colors outline-none file:inline-flex file:h-7 file:rounded-md file:border-0 file:bg-transparent file:px-2 file:text-sm file:font-medium hover:border-neutral-500 focus-visible:border-neutral-900 focus-visible:ring-0 disabled:cursor-not-allowed disabled:bg-neutral-100 disabled:text-neutral-400 disabled:border-neutral-200 aria-invalid:border-destructive",
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+InputPrimitive2.displayName = "InputPrimitive";
+var inputVariants2 = cva("", {
+  variants: {
+    controlSize: {
+      sm: "h-9 rounded-md px-3 text-sm",
+      md: "h-10 rounded-lg px-4 text-sm",
+      lg: "h-12 rounded-xl px-5 text-base"
+    },
+    fullWidth: {
+      true: "w-full",
+      false: "w-auto"
+    },
+    appearance: {
+      filled: "border-neutral-200 hover:border-neutral-500 focus-visible:border-neutral-900",
+      unfilled: "bg-white border-neutral-300 hover:border-neutral-500 focus-visible:border-neutral-900"
+    }
+  },
+  defaultVariants: {
+    controlSize: "sm",
+    fullWidth: true,
+    appearance: "filled"
+  }
+});
+var Input2 = React4.forwardRef(
+  ({
+    className,
+    wrapperClassName,
+    controlSize,
+    fullWidth,
+    appearance,
+    addonPrefix,
+    addonPrefixProps,
+    prefixInteractive,
+    addonSuffix,
+    addonSuffixProps,
+    suffixInteractive,
+    invalid,
+    loading,
+    loadingIcon,
+    validationMessage,
+    validationIcon,
+    validationMessageProps,
+    onValueChange,
+    type = "text",
+    ...rest
+  }, ref) => {
+    const inputProps = rest;
+    const hasPrefix = Boolean(addonPrefix);
+    const hasSuffix = Boolean(addonSuffix) || loading;
+    const isFullWidth = fullWidth ?? true;
+    const {
+      "aria-invalid": ariaInvalidProp,
+      "aria-describedby": ariaDescribedByProp,
+      onChange: onChangeProp
+    } = rest;
+    const ariaInvalid = invalid ?? ariaInvalidProp;
+    const messageId = React4.useId();
+    const handleChange = React4.useCallback(
+      (event) => {
+        onChangeProp?.(event);
+        onValueChange?.(event.target.value);
+      },
+      [onChangeProp, onValueChange]
+    );
+    const resolvedAriaInvalid = typeof ariaInvalid === "string" ? ariaInvalid : ariaInvalid ? true : void 0;
+    const describedBy = validationMessage ? [ariaDescribedByProp, messageId].filter(Boolean).join(" ") : ariaDescribedByProp;
+    const controlWrapperClassName = cn(
+      "relative inline-flex items-center",
+      isFullWidth ? "w-full" : "w-fit",
+      !validationMessage && wrapperClassName
+    );
+    const inputElement = /* @__PURE__ */ jsx(
+      InputPrimitive2,
+      {
+        ref,
+        type,
+        "data-slot": "input",
+        className: cn(
+          inputVariants2({ controlSize, fullWidth: isFullWidth, appearance }),
+          hasPrefix && "pl-10",
+          hasSuffix && "pr-10",
+          className
+        ),
+        "aria-invalid": resolvedAriaInvalid,
+        "aria-describedby": describedBy || void 0,
+        onChange: handleChange,
+        ...inputProps
+      }
+    );
+    if (!hasPrefix && !hasSuffix && !validationMessage) {
+      return inputElement;
+    }
+    const { className: prefixClassName, ...prefixRest } = addonPrefixProps ?? {};
+    const { className: suffixClassName, ...suffixRest } = addonSuffixProps ?? {};
+    const { className: validationMessageClassName, ...validationMessageRest } = validationMessageProps ?? {};
+    const suffixContent = /* @__PURE__ */ jsxs(Fragment, { children: [
+      addonSuffix,
+      loading && (loadingIcon ?? /* @__PURE__ */ jsx(Spinner, { size: 16, variant: "muted" }))
+    ] });
+    const inputWithAffixes = /* @__PURE__ */ jsxs("div", { "data-slot": "input-wrapper", className: controlWrapperClassName, children: [
+      hasPrefix && /* @__PURE__ */ jsx(
+        "span",
+        {
+          ...prefixRest,
+          className: cn(
+            "absolute left-3 top-1/2 -translate-y-1/2 inline-flex items-center text-muted-foreground",
+            !prefixInteractive && "pointer-events-none",
+            prefixClassName
+          ),
+          children: addonPrefix
+        }
+      ),
+      inputElement,
+      hasSuffix && /* @__PURE__ */ jsx(
+        "span",
+        {
+          ...suffixRest,
+          className: cn(
+            "absolute right-3 top-1/2 -translate-y-1/2 inline-flex items-center gap-2 text-muted-foreground",
+            !suffixInteractive && "pointer-events-none",
+            suffixClassName
+          ),
+          children: suffixContent
+        }
+      )
+    ] });
+    if (!validationMessage) {
+      return inputWithAffixes;
+    }
+    return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-1", isFullWidth ? "w-full" : "w-fit", wrapperClassName), children: [
+      inputWithAffixes,
+      /* @__PURE__ */ jsxs(
+        "p",
+        {
+          id: messageId,
+          ...validationMessageRest,
+          className: cn("flex items-center gap-2 text-sm text-destructive", validationMessageClassName),
+          children: [
+            validationIcon ?? /* @__PURE__ */ jsx(CircleX, { className: "size-4" }),
+            /* @__PURE__ */ jsx("span", { children: validationMessage })
+          ]
+        }
+      )
+    ] });
+  }
+);
+Input2.displayName = "Input";
+var InputNumber = ({ customInputProps, ...props }) => {
+  return /* @__PURE__ */ jsx(NumericFormat, { customInput: Input2, ...props, ...customInputProps });
+};
+var InputNumber_default = InputNumber;
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, AdvanceSearch_default as AdvanceSearch, arrow_default as ArrowIcon, Button, Checkbox, Collapsible, CollapsibleContent2 as CollapsibleContent, CollapsibleTrigger2 as CollapsibleTrigger, CropperModal, CropperModalError, DIALOG_ALERT_I18N_SUBNAMESPACE, DataTable_default as DataTable, DatePicker2 as DatePicker, Dialog, DialogAlert, DialogAlertProvider, DialogContent, DialogDescription, DialogFooter, DialogTitle, DialogTrigger, ErrorCompression, ErrorCreateCanvas, ErrorGeneratingBlob, ErrorInvalidSVG, ErrorSVGExceedSize, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, FormulaEditor, GridSettingsModal_default as GridSettingsModal, HeaderCell_default as HeaderCell, Image2 as Image, Input, Label2 as Label, List_default as List, container_default as ListContainer, header_default as ListHeader, table_default as ListTable, LookupSelect, MonthPicker2 as MonthPicker, navbar_default as Navbar, not_found_default as NotFoundIcon, Popover, PopoverAnchor, PopoverArrow, PopoverContent, PopoverTrigger, PreventPageLeave_default as PreventPageLeave, RadioGroupItem, RadioGroupRoot, RadioLabel, RichText, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator2 as Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarLayout, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Spinner, calendar_default as SuiCalendarIcon, check_default as SuiCheckIcon, dots_vertical_default as SuiDotsVerticalIcon, empty_data_default as SuiEmptyDataIcon, expand_default as SuiExpandIcon, filter_default as SuiFilterIcon, setting_default as SuiSettingIcon, triangle_down_default as SuiTriangleDownIcon, warning_default as SuiWarningIcon, Switch, Textarea, Tooltip, TooltipArrow, TooltipContent, TooltipProvider, TooltipTrigger, truncated_default as Truncated, ui_exports as UI, booleanToSelectValue, buildPrefixMap, buttonVariants, cn, compareAlphanumeric, debounce, defaultOperatorShortcuts, defaultOperators, formatISODate, getDialogAlertControls, getDialogTemplates, inputVariants, isDefined, isEmptyObject, isValidParentheses, mapTokensToOutput, parseFormula, parseFormulaToToken, selectValueToBoolean, spinnerVariants, splitOperators, stripNullishObject, throttle, tokenizeFormulaString, useFormField, useGridSettingsStore_default as useGridSettingsStore, useHover_default as useHover, useIntersectionObserver_default as useIntersectionObserver, useMediaQuery_default as useMediaQuery, usePreventPageLeave_default as usePreventPageLeave, usePreventPageLeaveStore_default as usePreventPageLeaveStore, useScreenSize_default as useScreenSize, useSidebar, useTruncated_default as useTruncated, validateTokenPrefixes };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, AdvanceSearch_default as AdvanceSearch, arrow_default as ArrowIcon, Button, Checkbox, Collapsible, CollapsibleContent2 as CollapsibleContent, CollapsibleTrigger2 as CollapsibleTrigger, CropperModal, CropperModalError, DIALOG_ALERT_I18N_SUBNAMESPACE, DataTable_default as DataTable, DatePicker2 as DatePicker, Dialog, DialogAlert, DialogAlertProvider, DialogContent, DialogDescription, DialogFooter, DialogTitle, DialogTrigger, ErrorCompression, ErrorCreateCanvas, ErrorGeneratingBlob, ErrorInvalidSVG, ErrorSVGExceedSize, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, FormulaEditor, GridSettingsModal_default as GridSettingsModal, HeaderCell_default as HeaderCell, Image2 as Image, Input, InputNumber_default as InputNumber, Label2 as Label, List_default as List, container_default as ListContainer, header_default as ListHeader, table_default as ListTable, LookupSelect, MonthPicker2 as MonthPicker, navbar_default as Navbar, not_found_default as NotFoundIcon, Popover, PopoverAnchor, PopoverArrow, PopoverContent, PopoverTrigger, PreventPageLeave_default as PreventPageLeave, RadioGroupItem, RadioGroupRoot, RadioLabel, RichText, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator2 as Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarLayout, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Spinner, calendar_default as SuiCalendarIcon, check_default as SuiCheckIcon, dots_vertical_default as SuiDotsVerticalIcon, empty_data_default as SuiEmptyDataIcon, expand_default as SuiExpandIcon, filter_default as SuiFilterIcon, setting_default as SuiSettingIcon, triangle_down_default as SuiTriangleDownIcon, warning_default as SuiWarningIcon, Switch, Textarea, Tooltip, TooltipArrow, TooltipContent, TooltipProvider, TooltipTrigger, truncated_default as Truncated, ui_exports as UI, booleanToSelectValue, buildPrefixMap, buttonVariants, cn, compareAlphanumeric, debounce, defaultOperatorShortcuts, defaultOperators, formatISODate, getDialogAlertControls, getDialogTemplates, inputVariants, isDefined, isEmptyObject, isValidParentheses, mapTokensToOutput, parseFormula, parseFormulaToToken, selectValueToBoolean, spinnerVariants, splitOperators, stripNullishObject, throttle, tokenizeFormulaString, useFormField, useGridSettingsStore_default as useGridSettingsStore, useHover_default as useHover, useIntersectionObserver_default as useIntersectionObserver, useMediaQuery_default as useMediaQuery, usePreventPageLeave_default as usePreventPageLeave, usePreventPageLeaveStore_default as usePreventPageLeaveStore, useScreenSize_default as useScreenSize, useSidebar, useTruncated_default as useTruncated, validateTokenPrefixes };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map