@sustaina/shared-ui 1.21.1 → 1.23.0

package/dist/index.d.mts

@@ -730,7 +730,7 @@ declare const inputVariants: (props?: ({
     fullWidth?: boolean | null | undefined;
     appearance?: "filled" | "unfilled" | null | undefined;
 } & class_variance_authority_dist_types.ClassProp) | undefined) => string;
-type InputProps = Omit<InputPrimitiveProps, "size"> & VariantProps<typeof inputVariants> & {
+type InputProps = Omit<InputPrimitiveProps, "size" | "prefix"> & VariantProps<typeof inputVariants> & {
     prefix?: React$1.ReactNode;
     prefixProps?: React$1.HTMLAttributes<HTMLSpanElement>;
     prefixInteractive?: boolean;
@@ -746,7 +746,7 @@ type InputProps = Omit<InputPrimitiveProps, "size"> & VariantProps<typeof inputV
     validationMessageProps?: React$1.HTMLAttributes<HTMLParagraphElement>;
     onValueChange?: (value: string) => void;
 };
-declare const Input: React$1.ForwardRefExoticComponent<Omit<InputPrimitiveProps, "size"> & VariantProps<(props?: ({
+declare const Input: React$1.ForwardRefExoticComponent<Omit<InputPrimitiveProps, "prefix" | "size"> & VariantProps<(props?: ({
     controlSize?: "sm" | "lg" | "md" | null | undefined;
     fullWidth?: boolean | null | undefined;
     appearance?: "filled" | "unfilled" | null | undefined;

package/dist/index.d.ts

@@ -730,7 +730,7 @@ declare const inputVariants: (props?: ({
     fullWidth?: boolean | null | undefined;
     appearance?: "filled" | "unfilled" | null | undefined;
 } & class_variance_authority_dist_types.ClassProp) | undefined) => string;
-type InputProps = Omit<InputPrimitiveProps, "size"> & VariantProps<typeof inputVariants> & {
+type InputProps = Omit<InputPrimitiveProps, "size" | "prefix"> & VariantProps<typeof inputVariants> & {
     prefix?: React$1.ReactNode;
     prefixProps?: React$1.HTMLAttributes<HTMLSpanElement>;
     prefixInteractive?: boolean;
@@ -746,7 +746,7 @@ type InputProps = Omit<InputPrimitiveProps, "size"> & VariantProps<typeof inputV
     validationMessageProps?: React$1.HTMLAttributes<HTMLParagraphElement>;
     onValueChange?: (value: string) => void;
 };
-declare const Input: React$1.ForwardRefExoticComponent<Omit<InputPrimitiveProps, "size"> & VariantProps<(props?: ({
+declare const Input: React$1.ForwardRefExoticComponent<Omit<InputPrimitiveProps, "prefix" | "size"> & VariantProps<(props?: ({
     controlSize?: "sm" | "lg" | "md" | null | undefined;
     fullWidth?: boolean | null | undefined;
     appearance?: "filled" | "unfilled" | null | undefined;

package/dist/index.js

@@ -648,6 +648,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__ */ jsxRuntime.jsx(lucideReact.X, { className: "w-5 h-5" })
           }
         ),
@@ -661,6 +662,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
       }
     ),
@@ -1014,7 +1016,14 @@ function SelectScrollDownButton({
   );
 }
 var FieldSelect = ({ row, fieldOptions, onChangeField }) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full", children: /* @__PURE__ */ jsxRuntime.jsxs(Select, { value: row.fieldName, onValueChange: (value) => onChangeField(value), children: [
-  /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx(SelectValue, { placeholder: "Select field" }) }),
+  /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx(SelectValue, { placeholder: "Select field" })
+    }
+  ),
   /* @__PURE__ */ jsxRuntime.jsx(SelectContent, { className: "w-full min-w-[unset]", children: fieldOptions.map((f) => /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: f.value, children: f.label }, f.value)) })
 ] }) });
 
@@ -1056,6 +1065,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__ */ jsxRuntime.jsx(SelectValue, { placeholder: "Select operator" })
         }
       ),
@@ -1271,14 +1281,14 @@ var Input = React4__namespace.forwardRef(
     type = "text",
     ...rest
   }, ref) => {
+    const inputProps = rest;
     const hasPrefix = Boolean(prefix);
     const hasSuffix = Boolean(suffix) || loading;
     const isFullWidth = fullWidth ?? true;
     const {
       "aria-invalid": ariaInvalidProp,
       "aria-describedby": ariaDescribedByProp,
-      onChange: onChangeProp,
-      ...inputProps
+      onChange: onChangeProp
     } = rest;
     const ariaInvalid = invalid ?? ariaInvalidProp;
     const messageId = React4__namespace.useId();
@@ -1355,7 +1365,7 @@ var Input = React4__namespace.forwardRef(
       return inputWithAffixes;
     }
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-1", isFullWidth ? "w-full" : "w-fit", wrapperClassName), children: [
-      hasPrefix || hasSuffix ? inputWithAffixes : inputElement,
+      inputWithAffixes,
       /* @__PURE__ */ jsxRuntime.jsxs(
         "p",
         {
@@ -1426,7 +1436,8 @@ var ConditionTextInput = ({ row, control, onClear }) => /* @__PURE__ */ jsxRunti
             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__ */ jsxRuntime.jsx("span", { className: "absolute inset-y-0 right-3 flex items-center", children: field.value && /* @__PURE__ */ jsxRuntime.jsx(ClearButton, { onClick: handleClear }) }),
@@ -2002,7 +2013,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__ */ jsxRuntime.jsx(FormMessage, { className: "absolute left-0 top-full mt-1 text-xs text-red-600" })
@@ -2470,6 +2482,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__ */ jsxRuntime.jsx(SelectValue, { placeholder: "Select value" })
             }
           ) }),
@@ -2845,7 +2858,8 @@ var ConditionLookupInput = ({
             suggestionDebounce: fieldSchema?.suggestionDebounce,
             noOptionsMessage: fieldSchema?.noOptionsMessage,
             loadingMessage: fieldSchema?.loadingMessage,
-            dropdownPortalId
+            dropdownPortalId,
+            "data-testid": "advsearch-lookup-list"
           }
         ) }),
         /* @__PURE__ */ jsxRuntime.jsx(FormMessage, { className: "absolute left-0 top-full mt-1 text-xs text-red-600" })
@@ -2980,6 +2994,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__ */ jsxRuntime.jsx(lucideReact.Plus, { className: "h-3 w-3 stroke-[2]" })
   }
 ) : /* @__PURE__ */ jsxRuntime.jsx(
@@ -2991,6 +3006,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__ */ jsxRuntime.jsx(lucideReact.Minus, { className: "h-3 w-3 stroke-[2]" })
   }
 ) });
@@ -3625,6 +3641,7 @@ var AdvanceSearch = ({
                 Object.keys(getValues()).forEach((k) => resetField(k));
                 if (onClear) onClear();
               },
+              "data-testid": "advsearch-btn-clear",
               children: "Clear Search"
             }
           ),
@@ -3633,6 +3650,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"
             }
           )
@@ -3891,6 +3909,7 @@ var HeaderCell = ({
         rootClassName
       ),
       onClick: (event) => {
+        if (!showSorter) return;
         event.preventDefault();
         if (context?.column?.getCanSort()) {
           context?.column?.toggleSorting();
@@ -3918,8 +3937,8 @@ var HeaderCell = ({
                 lucideReact.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
@@ -3929,8 +3948,8 @@ var HeaderCell = ({
                 lucideReact.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