@sustaina/shared-ui 1.22.0 → 1.23.1

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';
@@ -608,6 +608,7 @@ var ExpandCollapse = ({ title, children, portalId }) => {
           {
             onClick: () => setIsOpen(false),
             className: "absolute top-2 right-2 text-gray-500 hover:text-gray-700",
+            "data-testid": "advsearch-icon-close",
             children: /* @__PURE__ */ jsx(X, { className: "w-5 h-5" })
           }
         ),
@@ -621,6 +622,7 @@ var ExpandCollapse = ({ title, children, portalId }) => {
       {
         onClick: () => setIsOpen(!isOpen),
         className: "px-4 py-2 text-sm text-gray-700 hover:text-black",
+        "data-testid": "advsearch-icon-search",
         children: title
       }
     ),
@@ -974,7 +976,14 @@ function SelectScrollDownButton({
   );
 }
 var FieldSelect = ({ row, fieldOptions, onChangeField }) => /* @__PURE__ */ jsx("div", { className: "w-full", children: /* @__PURE__ */ jsxs(Select, { value: row.fieldName, onValueChange: (value) => onChangeField(value), children: [
-  /* @__PURE__ */ jsx(SelectTrigger, { className: "w-full justify-between rounded-md bg-white px-4 text-sm font-medium text-gray-700 shadow-none focus:ring-0", children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select field" }) }),
+  /* @__PURE__ */ jsx(
+    SelectTrigger,
+    {
+      className: "w-full justify-between rounded-md bg-white px-4 text-sm font-medium text-gray-700 shadow-none focus:ring-0",
+      "data-testid": "advsearch-dropdown-selectfield",
+      children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select field" })
+    }
+  ),
   /* @__PURE__ */ jsx(SelectContent, { className: "w-full min-w-[unset]", children: fieldOptions.map((f) => /* @__PURE__ */ jsx(SelectItem, { value: f.value, children: f.label }, f.value)) })
 ] }) });
 
@@ -1016,6 +1025,7 @@ var OperatorSelect = ({ row, operators, onChangeOperator, error }) => {
         {
           "aria-invalid": error ? "true" : "false",
           className: `w-full justify-between rounded-md bg-white px-4 text-sm font-medium text-gray-700 shadow-none focus:ring-0 ${error ? "border border-red-500" : ""}`,
+          "data-testid": "advsearch-dropdown-cond",
           children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select operator" })
         }
       ),
@@ -1386,7 +1396,8 @@ var ConditionTextInput = ({ row, control, onClear }) => /* @__PURE__ */ jsx(
             value: field.value ?? "",
             autoComplete: "off",
             inputMode: "text",
-            className: "w-full h-9  rounded-md bg-white pr-8 text-sm text-gray-700 shadow-none focus-visible:ring-0 focus-visible:ring-offset-0"
+            className: "w-full h-9  rounded-md bg-white pr-8 text-sm text-gray-700 shadow-none focus-visible:ring-0 focus-visible:ring-offset-0",
+            "data-testid": "advsearch-input-value"
           }
         ) }),
         /* @__PURE__ */ jsx("span", { className: "absolute inset-y-0 right-3 flex items-center", children: field.value && /* @__PURE__ */ jsx(ClearButton, { onClick: handleClear }) }),
@@ -1962,7 +1973,8 @@ var ConditionDateInput = ({
               clearAriaLabel: buildClearLabel(options?.isEnd),
               invalid: Boolean(fieldState.error),
               displayFormatter: (d) => formatISODate(d, shortDateFormat),
-              wrapperClassName: "min-w-0"
+              wrapperClassName: "min-w-0",
+              "data-testid": "advsearch-date-value"
             }
           ) }),
           /* @__PURE__ */ jsx(FormMessage, { className: "absolute left-0 top-full mt-1 text-xs text-red-600" })
@@ -2430,6 +2442,7 @@ var ConditionDropdownInput = ({ row, control, fieldSchema, onClear }) => /* @__P
                 "w-full justify-between rounded-md bg-white px-4 text-sm font-medium text-gray-700 shadow-none focus:ring-0",
                 hasValue ? "pr-8" : "pr-4"
               ),
+              "data-testid": "advsearch-dropdown-value",
               children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select value" })
             }
           ) }),
@@ -2805,7 +2818,8 @@ var ConditionLookupInput = ({
             suggestionDebounce: fieldSchema?.suggestionDebounce,
             noOptionsMessage: fieldSchema?.noOptionsMessage,
             loadingMessage: fieldSchema?.loadingMessage,
-            dropdownPortalId
+            dropdownPortalId,
+            "data-testid": "advsearch-lookup-list"
           }
         ) }),
         /* @__PURE__ */ jsx(FormMessage, { className: "absolute left-0 top-full mt-1 text-xs text-red-600" })
@@ -2940,6 +2954,7 @@ var AddRemoveButtons = ({ isFirst, onAdd, onRemove, disableAdd }) => /* @__PURE_
     className: `circle-btn border transition-colors ${disableAdd ? "cursor-not-allowed border-[#5a5a5a] bg-[#5a5a5a] text-[#e1e1e1]" : "border-[#379a2a] bg-[#379a2a] text-white"}`,
     "aria-label": "Add row",
     title: disableAdd ? "Cannot add more rows" : "Add condition",
+    "data-testid": "advsearch-btn-add",
     children: /* @__PURE__ */ jsx(Plus, { className: "h-3 w-3 stroke-[2]" })
   }
 ) : /* @__PURE__ */ jsx(
@@ -2951,6 +2966,7 @@ var AddRemoveButtons = ({ isFirst, onAdd, onRemove, disableAdd }) => /* @__PURE_
     className: "circle-btn border border-[#379a2a] bg-white text-[#379a2a]",
     "aria-label": "Remove row",
     title: "Remove condition",
+    "data-testid": "advsearch-btn-remove",
     children: /* @__PURE__ */ jsx(Minus, { className: "h-3 w-3 stroke-[2]" })
   }
 ) });
@@ -3585,6 +3601,7 @@ var AdvanceSearch = ({
                 Object.keys(getValues()).forEach((k) => resetField(k));
                 if (onClear) onClear();
               },
+              "data-testid": "advsearch-btn-clear",
               children: "Clear Search"
             }
           ),
@@ -3593,6 +3610,7 @@ var AdvanceSearch = ({
             {
               type: "submit",
               className: "w-full bg-[#379a2a] text-white hover:bg-[#2f7c21] md:w-auto md:min-w-[120px]",
+              "data-testid": "advsearch-btn-search",
               children: "Search"
             }
           )
@@ -3851,6 +3869,7 @@ var HeaderCell = ({
         rootClassName
       ),
       onClick: (event) => {
+        if (!showSorter) return;
         event.preventDefault();
         if (context?.column?.getCanSort()) {
           context?.column?.toggleSorting();
@@ -3878,8 +3897,8 @@ var HeaderCell = ({
                 ChevronUp,
                 {
                   className: cn("stroke-[#BBBBBB]", {
-                    "stroke-[#41875c]": context?.column?.getIsSorted() === "asc",
-                    "stroke-[#41875c]/45": context?.column?.getNextSortingOrder() === "asc" && hovering
+                    "stroke-sus-gray-5": context?.column?.getIsSorted() === "asc",
+                    "stroke-sus-gray-5/45": context?.column?.getNextSortingOrder() === "asc" && hovering
                   }),
                   size: 16,
                   strokeWidth: 3
@@ -3889,8 +3908,8 @@ var HeaderCell = ({
                 ChevronDown,
                 {
                   className: cn("stroke-[#BBBBBB]", {
-                    "stroke-[#41875c]": context?.column?.getIsSorted() === "desc",
-                    "stroke-[#41875c]/45": context?.column?.getNextSortingOrder() === "desc" && hovering
+                    "stroke-sus-gray-5": context?.column?.getIsSorted() === "desc",
+                    "stroke-sus-gray-5/45": context?.column?.getNextSortingOrder() === "desc" && hovering
                   }),
                   size: 16,
                   strokeWidth: 3
@@ -5051,17 +5070,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",
@@ -5077,7 +5096,7 @@ function DialogAlert({
   description,
   variant = "default",
   confirmText,
-  cancelText = "cancel",
+  cancelText = i18nPrefix + "cancel",
   onConfirm,
   onCancel,
   showCancel = true,
@@ -5086,7 +5105,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);
@@ -5098,13 +5116,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) })
     ] })
   ] }) });
 }