@l3mpire/ui 2.21.1 → 2.23.0

package/dist/index.js

@@ -5217,7 +5217,7 @@ var FilterChipSegment = React36.forwardRef(
         ),
         ...props,
         children: [
-          adornment && segmentType === "value" && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "shrink-0 size-5", children: adornment }),
+          adornment && segmentType === "value" && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "shrink-0 inline-flex items-center justify-center leading-none", children: adornment }),
           icon && segmentType === "property" && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
             import_icons23.Icon,
             {
@@ -5322,6 +5322,23 @@ var FilterChip = React37.forwardRef(
 FilterChip.displayName = "FilterChip";
 
 // src/components/ui/filter/utils.ts
+function resolveEnumOption(opt) {
+  if (typeof opt === "string") return { value: opt, label: opt };
+  return {
+    value: opt.value,
+    label: opt.label ?? opt.value,
+    icon: opt.icon,
+    intent: opt.intent
+  };
+}
+function findEnumOption(value, options) {
+  if (!options) return void 0;
+  for (const opt of options) {
+    const r = resolveEnumOption(opt);
+    if (r.value === value) return r;
+  }
+  return void 0;
+}
 var OPERATORS_BY_TYPE = {
   text: [
     "contains",
@@ -5397,7 +5414,7 @@ function getValueInputType(type, operator) {
     return ["is any of", "is none of"].includes(operator) ? "MultiRelationPicker" : "RelationPicker";
   return null;
 }
-function formatFilterValue(value, dynamicOptions, full) {
+function formatFilterValue(value, dynamicOptions, full, options) {
   if (value == null) return void 0;
   if (typeof value === "boolean") return value ? "Yes" : "No";
   if (value instanceof Date) {
@@ -5417,18 +5434,19 @@ function formatFilterValue(value, dynamicOptions, full) {
       return `${fmt(value[0])} \u2013 ${value[1] instanceof Date ? fmt(value[1]) : "\u2026"}`;
     }
     if (full) {
-      return value.map((v) => resolveDynamic(String(v), dynamicOptions)).join(", ");
+      return value.map((v) => resolveLabel(String(v), dynamicOptions, options)).join(", ");
     }
-    const resolved = resolveDynamic(String(value[0]), dynamicOptions);
-    return resolved;
+    return resolveLabel(String(value[0]), dynamicOptions, options);
   }
-  return resolveDynamic(String(value), dynamicOptions);
+  return resolveLabel(String(value), dynamicOptions, options);
 }
-function resolveDynamic(raw, dynamicOptions) {
+function resolveLabel(raw, dynamicOptions, options) {
   if (dynamicOptions) {
-    const match = dynamicOptions.find((o) => o.value === raw);
-    if (match) return match.label;
+    const dyn = dynamicOptions.find((o) => o.value === raw);
+    if (dyn) return dyn.label;
   }
+  const enumOpt = findEnumOption(raw, options);
+  if (enumOpt) return enumOpt.label;
   return raw;
 }
 function getBadgeCount(value) {
@@ -6672,7 +6690,41 @@ var PresetTagsValueInput = ({
 PresetTagsValueInput.displayName = "PresetTagsValueInput";
 
 // src/components/ui/filter/value-inputs/select-value-input.tsx
+var import_icons29 = require("@l3mpire/icons");
 var import_jsx_runtime47 = require("react/jsx-runtime");
+var intentDotClass = {
+  primary: "bg-primary",
+  success: "bg-success",
+  warning: "bg-warning",
+  critical: "bg-destructive",
+  neutral: "bg-muted-foreground"
+};
+var IntentDot = ({ intent }) => /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+  "span",
+  {
+    className: cn(
+      "shrink-0 size-2 rounded-full",
+      intentDotClass[intent]
+    ),
+    "aria-hidden": true
+  }
+);
+var OptionLeading = ({ option }) => {
+  if (option.icon) {
+    return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+      import_icons29.Icon,
+      {
+        icon: option.icon,
+        size: "sm",
+        className: "shrink-0 text-dropdown-item-icon"
+      }
+    );
+  }
+  if (option.intent) {
+    return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(IntentDot, { intent: option.intent });
+  }
+  return null;
+};
 var DynamicOptionRow = ({
   option,
   selected,
@@ -6745,20 +6797,26 @@ var SingleSelectValueInput = ({
           },
           opt.value
         )),
-        options.map((opt) => /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
-          "button",
-          {
-            type: "button",
-            onClick: () => pick(opt),
-            className: cn(
-              "flex items-center gap-base p-base rounded-base cursor-pointer transition-colors text-left",
-              "hover:bg-dropdown-item-hover",
-              value === opt && "bg-dropdown-item-hover"
-            ),
-            children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { className: "text-sm font-regular leading-sm text-foreground", children: opt })
-          },
-          opt
-        ))
+        options.map((rawOpt) => {
+          const opt = resolveEnumOption(rawOpt);
+          return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
+            "button",
+            {
+              type: "button",
+              onClick: () => pick(opt.value),
+              className: cn(
+                "flex items-center gap-base p-base rounded-base cursor-pointer transition-colors text-left",
+                "hover:bg-dropdown-item-hover",
+                value === opt.value && "bg-dropdown-item-hover"
+              ),
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(OptionLeading, { option: opt }),
+                /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { className: "text-sm font-regular leading-sm text-foreground truncate", children: opt.label })
+              ]
+            },
+            opt.value
+          );
+        })
       ]
     }
   );
@@ -6789,13 +6847,14 @@ var MultiSelectValueInput = ({
         },
         opt.value
       )),
-      options.map((opt) => {
-        const isSelected = selected.includes(opt);
+      options.map((rawOpt) => {
+        const opt = resolveEnumOption(rawOpt);
+        const isSelected = selected.includes(opt.value);
         return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
           "button",
           {
             type: "button",
-            onClick: () => toggle(opt),
+            onClick: () => toggle(opt.value),
             className: cn(
               "flex items-center gap-base p-base rounded-base cursor-pointer transition-colors text-left",
               "hover:bg-dropdown-item-hover"
@@ -6805,7 +6864,7 @@ var MultiSelectValueInput = ({
                 "span",
                 {
                   className: cn(
-                    "flex items-center justify-center size-4 rounded-xs border transition-colors",
+                    "flex items-center justify-center size-4 rounded-xs border transition-colors shrink-0",
                     isSelected ? "bg-primary border-primary" : "border-input bg-background"
                   ),
                   children: isSelected && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("svg", { width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
@@ -6820,10 +6879,11 @@ var MultiSelectValueInput = ({
                   ) })
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { className: "text-sm font-regular leading-sm text-foreground", children: opt })
+              /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(OptionLeading, { option: opt }),
+              /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { className: "text-sm font-regular leading-sm text-foreground truncate", children: opt.label })
             ]
           },
-          opt
+          opt.value
         );
       })
     ] }),
@@ -6930,9 +6990,9 @@ ValueInput.displayName = "ValueInput";
 // src/components/ui/filter/property-selector.tsx
 var React44 = __toESM(require("react"));
 var PopoverPrimitive6 = __toESM(require("@radix-ui/react-popover"));
-var import_icons29 = require("@l3mpire/icons");
+var import_icons30 = require("@l3mpire/icons");
 var import_jsx_runtime50 = require("react/jsx-runtime");
-var AdvancedFilterFooter = ({ onClick, count }) => /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_jsx_runtime50.Fragment, { children: [
+var AdvancedFilterFooter = ({ onClick, count }) => /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "shrink-0 flex flex-col", children: [
   /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "h-px bg-dropdown-border mx-xs" }),
   /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
     "button",
@@ -6943,9 +7003,9 @@ var AdvancedFilterFooter = ({ onClick, count }) => /* @__PURE__ */ (0, import_js
       className: "flex items-center gap-base p-base rounded-base cursor-pointer transition-colors hover:bg-dropdown-item-hover",
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
-          import_icons29.Icon,
+          import_icons30.Icon,
           {
-            icon: import_icons29.faFilterOutline,
+            icon: import_icons30.faFilterOutline,
             size: "sm",
             className: "shrink-0 text-dropdown-item-icon"
           }
@@ -6983,9 +7043,21 @@ var PropertySelector = ({
       setSearch("");
     }
   }, [open]);
+  const pinnedGroupIds = React44.useMemo(() => {
+    const set = /* @__PURE__ */ new Set();
+    for (const p of properties) {
+      if (p.groupPinned) set.add(p.group);
+    }
+    return set;
+  }, [properties]);
+  const pinnedProperties = React44.useMemo(
+    () => properties.filter((p) => pinnedGroupIds.has(p.group)),
+    [properties, pinnedGroupIds]
+  );
   const groups = React44.useMemo(() => {
     const map = /* @__PURE__ */ new Map();
     for (const prop of properties) {
+      if (pinnedGroupIds.has(prop.group)) continue;
       const existing = map.get(prop.group);
       if (existing) {
         existing.count++;
@@ -6999,12 +7071,14 @@ var PropertySelector = ({
       }
     }
     return Array.from(map.values());
-  }, [properties]);
-  const globalSearchResults = React44.useMemo(() => {
-    if (!search || activeGroup) return [];
+  }, [properties, pinnedGroupIds]);
+  const filteredPinnedProperties = React44.useMemo(() => {
+    if (!search || activeGroup) return pinnedProperties;
     const lower = search.toLowerCase();
-    return properties.filter((p) => p.label.toLowerCase().includes(lower));
-  }, [properties, search, activeGroup]);
+    return pinnedProperties.filter(
+      (p) => p.label.toLowerCase().includes(lower)
+    );
+  }, [pinnedProperties, search, activeGroup]);
   const filteredGroups = React44.useMemo(() => {
     if (!search || activeGroup) return groups;
     const lower = search.toLowerCase();
@@ -7022,7 +7096,13 @@ var PropertySelector = ({
     return groupProps.filter((p) => p.label.toLowerCase().includes(lower));
   }, [properties, activeGroup, search]);
   const activeGroupInfo = groups.find((g) => g.group === activeGroup);
-  const showGlobalResults = search.length > 0 && !activeGroup && globalSearchResults.length > 0;
+  const nonPinnedSearchResults = React44.useMemo(() => {
+    if (!search || activeGroup) return [];
+    const lower = search.toLowerCase();
+    return properties.filter(
+      (p) => !pinnedGroupIds.has(p.group) && p.label.toLowerCase().includes(lower)
+    );
+  }, [properties, search, activeGroup, pinnedGroupIds]);
   return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(PopoverPrimitive6.Root, { open, onOpenChange, children: [
     /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(PopoverPrimitive6.Trigger, { asChild: true, children }),
     /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(PopoverPrimitive6.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
@@ -7032,22 +7112,22 @@ var PropertySelector = ({
         align: "start",
         onCloseAutoFocus: (e) => e.preventDefault(),
         className: cn(
-          "z-50 flex flex-col gap-xs overflow-clip p-xs",
+          "z-50 flex flex-col gap-xs overflow-hidden p-xs",
           "bg-dropdown-bg border border-dropdown-border rounded-md shadow-lg",
           "data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
           "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
           "data-[side=bottom]:slide-in-from-top-2",
-          "min-w-[230px]"
+          "min-w-[230px] max-h-[360px]"
         ),
         children: [
           activeGroup === null ? (
-            /* ── Level 1: Search + Categories ───────────────────────── */
-            /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex flex-col gap-xs", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex items-center gap-base px-md py-base border border-input rounded-md", children: [
+            /* ── Level 1: Search + (pinned props) + Categories ──────── */
+            /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex flex-col gap-xs flex-1 min-h-0", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "shrink-0 flex items-center gap-base px-md py-base border border-input rounded-md", children: [
                 /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
-                  import_icons29.Icon,
+                  import_icons30.Icon,
                   {
-                    icon: import_icons29.faMagnifyingGlassOutline,
+                    icon: import_icons30.faMagnifyingGlassOutline,
                     size: "sm",
                     className: "shrink-0 text-muted-foreground"
                   }
@@ -7064,9 +7144,8 @@ var PropertySelector = ({
                   }
                 )
               ] }),
-              showGlobalResults ? (
-                /* ── Global search results (flat property list) ─────── */
-                /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "flex flex-col max-h-[300px] overflow-y-auto", children: globalSearchResults.map((prop) => /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
+              /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex flex-col flex-1 min-h-0 overflow-y-auto", children: [
+                filteredPinnedProperties.map((prop) => /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
                   "button",
                   {
                     type: "button",
@@ -7077,22 +7156,46 @@ var PropertySelector = ({
                     className: "flex items-center gap-base p-base rounded-base cursor-pointer transition-colors hover:bg-dropdown-item-hover",
                     children: [
                       /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
-                        import_icons29.Icon,
+                        import_icons30.Icon,
                         {
                           icon: prop.icon,
                           size: "sm",
                           className: "shrink-0 text-dropdown-item-icon"
                         }
                       ),
-                      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "flex-1 text-sm font-regular leading-sm text-dropdown-item-text text-left truncate", children: prop.label }),
-                      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "text-xs font-regular leading-xs text-muted-foreground", children: prop.groupLabel })
+                      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "flex-1 text-sm font-regular leading-sm text-dropdown-item-text text-left truncate", children: prop.label })
                     ]
                   },
                   prop.id
-                )) })
-              ) : (
-                /* ── Group list ─────────────────────────────────────── */
-                /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex flex-col", children: [
+                )),
+                search ? (
+                  /* ── Flat matches across non-pinned groups ────────── */
+                  nonPinnedSearchResults.map((prop) => /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
+                    "button",
+                    {
+                      type: "button",
+                      onClick: () => {
+                        onSelect(prop);
+                        onOpenChange?.(false);
+                      },
+                      className: "flex items-center gap-base p-base rounded-base cursor-pointer transition-colors hover:bg-dropdown-item-hover",
+                      children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+                          import_icons30.Icon,
+                          {
+                            icon: prop.icon,
+                            size: "sm",
+                            className: "shrink-0 text-dropdown-item-icon"
+                          }
+                        ),
+                        /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "flex-1 text-sm font-regular leading-sm text-dropdown-item-text text-left truncate", children: prop.label }),
+                        /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "text-xs font-regular leading-xs text-muted-foreground", children: prop.groupLabel })
+                      ]
+                    },
+                    prop.id
+                  ))
+                ) : (
+                  /* ── Category list ────────────────────────────────── */
                   filteredGroups.map((g) => /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
                     "button",
                     {
@@ -7104,7 +7207,7 @@ var PropertySelector = ({
                       className: "flex items-center gap-base p-base rounded-base cursor-pointer transition-colors hover:bg-dropdown-item-hover",
                       children: [
                         /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
-                          import_icons29.Icon,
+                          import_icons30.Icon,
                           {
                             icon: g.groupIcon,
                             size: "sm",
@@ -7114,9 +7217,9 @@ var PropertySelector = ({
                         /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "flex-1 text-sm font-regular leading-sm text-dropdown-item-text text-left truncate", children: g.groupLabel }),
                         /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "text-xs font-medium leading-xs text-muted-foreground", children: g.count }),
                         /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
-                          import_icons29.Icon,
+                          import_icons30.Icon,
                           {
-                            icon: import_icons29.faChevronRightOutline,
+                            icon: import_icons30.faChevronRightOutline,
                             size: "xs",
                             className: "shrink-0 text-dropdown-item-icon"
                           }
@@ -7124,14 +7227,14 @@ var PropertySelector = ({
                       ]
                     },
                     g.group
-                  )),
-                  filteredGroups.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "p-base text-sm text-muted-foreground", children: "No results" })
-                ] })
-              )
+                  ))
+                ),
+                filteredPinnedProperties.length === 0 && (search ? nonPinnedSearchResults.length === 0 : filteredGroups.length === 0) && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "p-base text-sm text-muted-foreground", children: "No results" })
+              ] })
             ] })
           ) : (
             /* ── Level 2: Properties ─────────────────────────────────── */
-            /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex flex-col gap-xs", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex flex-col gap-xs flex-1 min-h-0", children: [
               /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
                 "button",
                 {
@@ -7140,12 +7243,12 @@ var PropertySelector = ({
                     setActiveGroup(null);
                     setSearch("");
                   },
-                  className: "flex items-center gap-base p-base rounded-base cursor-pointer transition-colors hover:bg-dropdown-item-hover",
+                  className: "shrink-0 flex items-center gap-base p-base rounded-base cursor-pointer transition-colors hover:bg-dropdown-item-hover",
                   children: [
                     /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
-                      import_icons29.Icon,
+                      import_icons30.Icon,
                       {
-                        icon: import_icons29.faChevronLeftOutline,
+                        icon: import_icons30.faChevronLeftOutline,
                         size: "sm",
                         className: "shrink-0 text-dropdown-item-icon"
                       }
@@ -7154,11 +7257,11 @@ var PropertySelector = ({
                   ]
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex items-center gap-base px-md py-base border border-input rounded-md", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "shrink-0 flex items-center gap-base px-md py-base border border-input rounded-md", children: [
                 /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
-                  import_icons29.Icon,
+                  import_icons30.Icon,
                   {
-                    icon: import_icons29.faMagnifyingGlassOutline,
+                    icon: import_icons30.faMagnifyingGlassOutline,
                     size: "sm",
                     className: "shrink-0 text-muted-foreground"
                   }
@@ -7175,7 +7278,7 @@ var PropertySelector = ({
                   }
                 )
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex flex-col max-h-[300px] overflow-y-auto", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex flex-col flex-1 min-h-0 overflow-y-auto", children: [
                 filteredProperties.map((prop) => /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
                   "button",
                   {
@@ -7187,7 +7290,7 @@ var PropertySelector = ({
                     className: "flex items-center gap-base p-base rounded-base cursor-pointer transition-colors hover:bg-dropdown-item-hover",
                     children: [
                       /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
-                        import_icons29.Icon,
+                        import_icons30.Icon,
                         {
                           icon: prop.icon,
                           size: "sm",
@@ -7219,7 +7322,7 @@ PropertySelector.displayName = "PropertySelector";
 
 // src/components/ui/filter/kebab-menu.tsx
 var PopoverPrimitive7 = __toESM(require("@radix-ui/react-popover"));
-var import_icons30 = require("@l3mpire/icons");
+var import_icons31 = require("@l3mpire/icons");
 var import_jsx_runtime51 = require("react/jsx-runtime");
 var KebabMenu = ({
   onConvertToAdvanced,
@@ -7255,9 +7358,9 @@ var KebabMenu = ({
             className: "flex items-center gap-base p-base rounded-base cursor-pointer transition-colors hover:bg-dropdown-item-hover",
             children: [
               /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
-                import_icons30.Icon,
+                import_icons31.Icon,
                 {
-                  icon: import_icons30.faArrowRightOutline,
+                  icon: import_icons31.faArrowRightOutline,
                   size: "sm",
                   className: "shrink-0 text-dropdown-item-icon"
                 }
@@ -7278,9 +7381,9 @@ var KebabMenu = ({
             className: "flex items-center gap-base p-base rounded-base cursor-pointer transition-colors hover:bg-dropdown-item-hover",
             children: [
               /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
-                import_icons30.Icon,
+                import_icons31.Icon,
                 {
-                  icon: import_icons30.faTrashOutline,
+                  icon: import_icons31.faTrashOutline,
                   size: "sm",
                   className: "shrink-0 text-destructive"
                 }
@@ -7298,7 +7401,7 @@ KebabMenu.displayName = "KebabMenu";
 // src/components/ui/filter/filter-editor.tsx
 var React45 = __toESM(require("react"));
 var PopoverPrimitive8 = __toESM(require("@radix-ui/react-popover"));
-var import_icons31 = require("@l3mpire/icons");
+var import_icons32 = require("@l3mpire/icons");
 var import_jsx_runtime52 = require("react/jsx-runtime");
 var FilterEditor = ({
   propertyDef,
@@ -7362,7 +7465,7 @@ var FilterEditor = ({
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "flex items-center gap-base px-base pt-base pb-xs border-b border-border", children: [
             /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
-              import_icons31.Icon,
+              import_icons32.Icon,
               {
                 icon: propertyDef.icon,
                 size: "sm",
@@ -7412,6 +7515,7 @@ FilterEditor.displayName = "FilterEditor";
 // src/components/ui/filter/interactive-filter-chip.tsx
 var React46 = __toESM(require("react"));
 var PopoverPrimitive9 = __toESM(require("@radix-ui/react-popover"));
+var import_icons33 = require("@l3mpire/icons");
 var import_jsx_runtime53 = require("react/jsx-runtime");
 var SegmentPopover = ({
   open,
@@ -7490,9 +7594,31 @@ var InteractiveFilterChip = ({
     setValueOpen(false);
   };
   const hasOperator = !!condition.operator;
-  const displayValue = formatFilterValue(condition.value, propertyDef.dynamicOptions);
+  const displayValue = formatFilterValue(
+    condition.value,
+    propertyDef.dynamicOptions,
+    false,
+    propertyDef.options
+  );
   const hasValue = hasOperator && displayValue != null;
   const badgeCount = getBadgeCount(condition.value);
+  const valueLeading = React46.useMemo(() => {
+    const v = condition.value;
+    const raw = typeof v === "string" ? v : Array.isArray(v) && typeof v[0] === "string" ? v[0] : null;
+    if (!raw) return null;
+    const opt = findEnumOption(raw, propertyDef.options);
+    if (opt?.icon) {
+      return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+        import_icons33.Icon,
+        {
+          icon: opt.icon,
+          size: "sm",
+          className: "shrink-0 text-filter-chip-segment-icon"
+        }
+      );
+    }
+    return null;
+  }, [condition.value, propertyDef.options]);
   return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
     "div",
     {
@@ -7573,6 +7699,7 @@ var InteractiveFilterChip = ({
                   hasBorder: true,
                   label: hasValue ? displayValue : "Enter value",
                   badgeCount,
+                  adornment: hasValue ? valueLeading : void 0,
                   onClick: () => setValueOpen(true)
                 }
               ) }),
@@ -7627,11 +7754,11 @@ InteractiveFilterChip.displayName = "InteractiveFilterChip";
 
 // src/components/ui/filter/filter-system.tsx
 var React54 = __toESM(require("react"));
-var import_icons38 = require("@l3mpire/icons");
+var import_icons40 = require("@l3mpire/icons");
 
 // src/components/ui/filter/advanced-chip.tsx
 var React47 = __toESM(require("react"));
-var import_icons32 = require("@l3mpire/icons");
+var import_icons34 = require("@l3mpire/icons");
 var import_jsx_runtime54 = require("react/jsx-runtime");
 var btnBase = [
   "flex items-center justify-center",
@@ -7657,9 +7784,9 @@ var AdvancedChip = React47.forwardRef(
         ...props,
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
-            import_icons32.Icon,
+            import_icons34.Icon,
             {
-              icon: import_icons32.faFilterOutline,
+              icon: import_icons34.faFilterOutline,
               size: "sm",
               className: "shrink-0 text-foreground"
             }
@@ -7683,7 +7810,7 @@ var AdvancedChip = React47.forwardRef(
           "rounded-r-md -ml-px"
         ),
         "aria-label": "Clear all advanced filters",
-        children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_icons32.Icon, { icon: import_icons32.faXmarkOutline, size: "sm", className: "text-foreground" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_icons34.Icon, { icon: import_icons34.faXmarkOutline, size: "sm", className: "text-foreground" })
       }
     )
   ] })
@@ -7693,18 +7820,18 @@ AdvancedChip.displayName = "AdvancedChip";
 // src/components/ui/filter/advanced-popover.tsx
 var React51 = __toESM(require("react"));
 var PopoverPrimitive12 = __toESM(require("@radix-ui/react-popover"));
-var import_icons36 = require("@l3mpire/icons");
+var import_icons38 = require("@l3mpire/icons");
 
 // src/components/ui/filter/advanced-row.tsx
 var React49 = __toESM(require("react"));
 var PopoverPrimitive11 = __toESM(require("@radix-ui/react-popover"));
 var TooltipPrimitive4 = __toESM(require("@radix-ui/react-tooltip"));
-var import_icons34 = require("@l3mpire/icons");
+var import_icons36 = require("@l3mpire/icons");
 
 // src/components/ui/filter/filter-node-actions.tsx
 var React48 = __toESM(require("react"));
 var PopoverPrimitive10 = __toESM(require("@radix-ui/react-popover"));
-var import_icons33 = require("@l3mpire/icons");
+var import_icons35 = require("@l3mpire/icons");
 var import_jsx_runtime55 = require("react/jsx-runtime");
 var FilterNodeActions = ({
   nodeType,
@@ -7716,17 +7843,17 @@ var FilterNodeActions = ({
   const items = [
     {
       label: "Duplicate",
-      icon: import_icons33.faCopyOutline,
+      icon: import_icons35.faCopyOutline,
       action: onDuplicate
     },
     {
       label: nodeType === "condition" ? "Turn into group" : "Turn into filter",
-      icon: nodeType === "condition" ? import_icons33.faFolderOutline : import_icons33.faFilterOutline,
+      icon: nodeType === "condition" ? import_icons35.faFolderOutline : import_icons35.faFilterOutline,
       action: onConvert
     },
     {
       label: "Delete",
-      icon: import_icons33.faTrashOutline,
+      icon: import_icons35.faTrashOutline,
       action: onDelete,
       destructive: true
     }
@@ -7739,9 +7866,9 @@ var FilterNodeActions = ({
         className: "shrink-0 flex items-center justify-center p-sm rounded-md cursor-pointer transition-colors hover:bg-accent",
         "aria-label": "More actions",
         children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
-          import_icons33.Icon,
+          import_icons35.Icon,
           {
-            icon: import_icons33.faEllipsisOutline,
+            icon: import_icons35.faEllipsisOutline,
             size: "sm",
             className: "text-foreground"
           }
@@ -7775,7 +7902,7 @@ var FilterNodeActions = ({
             ),
             children: [
               /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
-                import_icons33.Icon,
+                import_icons35.Icon,
                 {
                   icon: item.icon,
                   size: "sm",
@@ -7830,6 +7957,19 @@ var AdvancedRow = ({
   const [operatorOpen, setOperatorOpen] = React49.useState(false);
   const [propertyOpen, setPropertyOpen] = React49.useState(false);
   const [valueOpen, setValueOpen] = React49.useState(false);
+  const { pinnedProperties, unpinnedProperties } = React49.useMemo(() => {
+    const pinnedGroups = /* @__PURE__ */ new Set();
+    for (const p of properties) {
+      if (p.groupPinned) pinnedGroups.add(p.group);
+    }
+    const pinned = [];
+    const unpinned = [];
+    for (const p of properties) {
+      if (pinnedGroups.has(p.group)) pinned.push(p);
+      else unpinned.push(p);
+    }
+    return { pinnedProperties: pinned, unpinnedProperties: unpinned };
+  }, [properties]);
   const handleOperatorSelect = (op) => {
     if (isNoValueOperator(op)) {
       onUpdate({ ...condition, operator: op, value: null });
@@ -7842,7 +7982,18 @@ var AdvancedRow = ({
   const handleValueChange = (val) => {
     onUpdate({ ...condition, value: val });
   };
-  const displayValue = formatFilterValue(condition.value, propertyDef.dynamicOptions);
+  const displayValue = formatFilterValue(
+    condition.value,
+    propertyDef.dynamicOptions,
+    false,
+    propertyDef.options
+  );
+  const valueLeadingIcon = React49.useMemo(() => {
+    const v = condition.value;
+    const raw = typeof v === "string" ? v : Array.isArray(v) && typeof v[0] === "string" ? v[0] : null;
+    if (!raw) return null;
+    return findEnumOption(raw, propertyDef.options)?.icon ?? null;
+  }, [condition.value, propertyDef.options]);
   const badgeCount = getBadgeCount(condition.value);
   const hasValue = displayValue != null;
   return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "flex items-center gap-base w-full min-w-0", children: [
@@ -7862,11 +8013,11 @@ var AdvancedRow = ({
     ] }) }) }),
     /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(PopoverPrimitive11.Root, { open: propertyOpen, onOpenChange: setPropertyOpen, children: [
       /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(PopoverPrimitive11.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("button", { type: "button", className: cn(selectBtnStyle, "min-w-0"), children: [
-        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_icons34.Icon, { icon: propertyDef.icon, size: "sm", className: "shrink-0 text-muted-foreground" }),
+        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_icons36.Icon, { icon: propertyDef.icon, size: "sm", className: "shrink-0 text-muted-foreground" }),
         /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "text-sm font-regular leading-sm text-foreground whitespace-nowrap truncate", children: propertyDef.label }),
-        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_icons34.Icon, { icon: import_icons34.faChevronDownOutline, size: "xs", className: "shrink-0 text-foreground" })
+        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_icons36.Icon, { icon: import_icons36.faChevronDownOutline, size: "xs", className: "shrink-0 text-foreground" })
       ] }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(PopoverPrimitive11.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(PopoverPrimitive11.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
         PopoverPrimitive11.Content,
         {
           sideOffset: 4,
@@ -7878,33 +8029,56 @@ var AdvancedRow = ({
             "data-[state=closed]:animate-out data-[state=closed]:fade-out-0",
             "min-w-[200px]"
           ),
-          children: properties.map((p) => /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
-            "button",
-            {
-              type: "button",
-              onClick: () => {
-                onPropertyChange(p);
-                setPropertyOpen(false);
+          children: [
+            pinnedProperties.map((p) => /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
+              "button",
+              {
+                type: "button",
+                onClick: () => {
+                  onPropertyChange(p);
+                  setPropertyOpen(false);
+                },
+                className: cn(
+                  "flex items-center gap-base p-base rounded-base cursor-pointer transition-colors text-left",
+                  "hover:bg-dropdown-item-hover",
+                  p.id === condition.propertyId && "bg-dropdown-item-hover"
+                ),
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_icons36.Icon, { icon: p.icon, size: "sm", className: "shrink-0 text-dropdown-item-icon" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "text-sm font-regular leading-sm text-dropdown-item-text truncate", children: p.label })
+                ]
               },
-              className: cn(
-                "flex items-center gap-base p-base rounded-base cursor-pointer transition-colors text-left",
-                "hover:bg-dropdown-item-hover",
-                p.id === condition.propertyId && "bg-dropdown-item-hover"
-              ),
-              children: [
-                /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_icons34.Icon, { icon: p.icon, size: "sm", className: "shrink-0 text-dropdown-item-icon" }),
-                /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "text-sm font-regular leading-sm text-dropdown-item-text truncate", children: p.label })
-              ]
-            },
-            p.id
-          ))
+              p.id
+            )),
+            unpinnedProperties.map((p) => /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
+              "button",
+              {
+                type: "button",
+                onClick: () => {
+                  onPropertyChange(p);
+                  setPropertyOpen(false);
+                },
+                className: cn(
+                  "flex items-center gap-base p-base rounded-base cursor-pointer transition-colors text-left",
+                  "hover:bg-dropdown-item-hover",
+                  p.id === condition.propertyId && "bg-dropdown-item-hover"
+                ),
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_icons36.Icon, { icon: p.icon, size: "sm", className: "shrink-0 text-dropdown-item-icon" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "text-sm font-regular leading-sm text-dropdown-item-text truncate", children: p.label }),
+                  /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "ml-auto text-xs font-regular leading-xs text-muted-foreground", children: p.groupLabel })
+                ]
+              },
+              p.id
+            ))
+          ]
         }
       ) })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(PopoverPrimitive11.Root, { open: operatorOpen, onOpenChange: setOperatorOpen, children: [
       /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(PopoverPrimitive11.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("button", { type: "button", className: cn(selectBtnStyle, "min-w-0"), children: [
         /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "text-sm font-regular leading-sm text-foreground whitespace-nowrap truncate text-left", children: condition.operator ?? "Select" }),
-        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_icons34.Icon, { icon: import_icons34.faChevronDownOutline, size: "xs", className: "shrink-0 text-foreground" })
+        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_icons36.Icon, { icon: import_icons36.faChevronDownOutline, size: "xs", className: "shrink-0 text-foreground" })
       ] }) }),
       /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(PopoverPrimitive11.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
         PopoverPrimitive11.Content,
@@ -7965,21 +8139,31 @@ var AdvancedRow = ({
             type: "button",
             className: cn(selectBtnStyle, "flex-1 min-w-[80px] justify-between overflow-hidden"),
             children: [
-              multiTags && multiTags.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(ValueTagRow, { tags: multiTags }) : /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
-                "span",
-                {
-                  className: cn(
-                    "text-sm font-regular leading-sm whitespace-nowrap truncate text-left",
-                    hasValue ? "text-foreground" : "text-muted-foreground"
-                  ),
-                  title: hasValue ? displayValue : void 0,
-                  children: hasValue ? displayValue : "Select a value"
-                }
-              ),
+              multiTags && multiTags.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(ValueTagRow, { tags: multiTags }) : /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
+                valueLeadingIcon && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+                  import_icons36.Icon,
+                  {
+                    icon: valueLeadingIcon,
+                    size: "sm",
+                    className: "shrink-0 text-foreground"
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+                  "span",
+                  {
+                    className: cn(
+                      "text-sm font-regular leading-sm whitespace-nowrap truncate text-left",
+                      hasValue ? "text-foreground" : "text-muted-foreground"
+                    ),
+                    title: hasValue ? displayValue : void 0,
+                    children: hasValue ? displayValue : "Select a value"
+                  }
+                )
+              ] }),
               /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
-                import_icons34.Icon,
+                import_icons36.Icon,
                 {
-                  icon: import_icons34.faChevronDownOutline,
+                  icon: import_icons36.faChevronDownOutline,
                   size: "xs",
                   className: "shrink-0 text-foreground"
                 }
@@ -8108,7 +8292,7 @@ function ValueTagRow({ tags }) {
 // src/components/ui/filter/advanced-group.tsx
 var React50 = __toESM(require("react"));
 var TooltipPrimitive5 = __toESM(require("@radix-ui/react-tooltip"));
-var import_icons35 = require("@l3mpire/icons");
+var import_icons37 = require("@l3mpire/icons");
 var import_jsx_runtime57 = require("react/jsx-runtime");
 var AdvancedGroup = ({
   connector,
@@ -8154,7 +8338,7 @@ var AdvancedGroup = ({
               type: "button",
               className: "flex items-center gap-sm px-base py-sm text-sm font-medium leading-sm text-muted-foreground cursor-pointer transition-colors rounded-md hover:bg-accent hover:text-foreground w-fit",
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_icons35.Icon, { icon: import_icons35.faPlusOutline, size: "sm" }),
+                /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_icons37.Icon, { icon: import_icons37.faPlusOutline, size: "sm" }),
                 "Add filter"
               ]
             }
@@ -8371,7 +8555,7 @@ var AdvancedPopover = ({
                   open: addSelectorOpen,
                   onOpenChange: setAddSelectorOpen,
                   children: /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("button", { type: "button", className: cn(ghostBtn, "text-foreground"), children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_icons36.Icon, { icon: import_icons36.faPlusOutline, size: "sm", className: "text-foreground" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_icons38.Icon, { icon: import_icons38.faPlusOutline, size: "sm", className: "text-foreground" }),
                     "Add filter"
                   ] })
                 }
@@ -8383,7 +8567,7 @@ var AdvancedPopover = ({
                   onClick: handleAddGroup,
                   className: cn(ghostBtn, "text-foreground"),
                   children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_icons36.Icon, { icon: import_icons36.faPlusOutline, size: "sm", className: "text-foreground" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_icons38.Icon, { icon: import_icons38.faPlusOutline, size: "sm", className: "text-foreground" }),
                     "Add filters group"
                   ]
                 }
@@ -8396,7 +8580,7 @@ var AdvancedPopover = ({
                 onClick: handleClearAll,
                 className: cn(ghostBtn, "text-destructive"),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_icons36.Icon, { icon: import_icons36.faXmarkOutline, size: "sm", className: "text-destructive" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_icons38.Icon, { icon: import_icons38.faXmarkOutline, size: "sm", className: "text-destructive" }),
                   "Clear filters"
                 ]
               }
@@ -8447,9 +8631,9 @@ var DraftRow = ({
             children: [
               /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("span", { className: "text-sm font-regular leading-sm text-muted-foreground whitespace-nowrap", children: "Select property" }),
               /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
-                import_icons36.Icon,
+                import_icons38.Icon,
                 {
-                  icon: import_icons36.faChevronDownOutline,
+                  icon: import_icons38.faChevronDownOutline,
                   size: "xs",
                   className: "shrink-0 text-foreground"
                 }
@@ -8466,7 +8650,7 @@ var DraftRow = ({
 var React52 = __toESM(require("react"));
 var PopoverPrimitive13 = __toESM(require("@radix-ui/react-popover"));
 var TooltipPrimitive6 = __toESM(require("@radix-ui/react-tooltip"));
-var import_icons37 = require("@l3mpire/icons");
+var import_icons39 = require("@l3mpire/icons");
 var import_jsx_runtime59 = require("react/jsx-runtime");
 var ghostBtn2 = [
   "flex items-center gap-sm px-base py-sm",
@@ -8640,7 +8824,7 @@ var SummaryChip = ({
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_icons37.Icon, { icon: import_icons37.faFilterOutline, size: "sm", className: "shrink-0 text-foreground" }),
+        /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_icons39.Icon, { icon: import_icons39.faFilterOutline, size: "sm", className: "shrink-0 text-foreground" }),
         /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "text-sm font-medium leading-sm whitespace-nowrap text-foreground", children: "Filters" }),
         count > 0 && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "flex items-center p-2xs rounded-xs bg-filter-chip-badge-bg", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "text-[10px] font-medium leading-2xs text-filter-chip-badge-text", children: count }) })
       ]
@@ -8696,13 +8880,13 @@ var SummaryChip = ({
                   open: addSelectorOpen,
                   onOpenChange: setAddSelectorOpen,
                   children: /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("button", { type: "button", className: cn(ghostBtn2, "text-foreground"), children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_icons37.Icon, { icon: import_icons37.faPlusOutline, size: "sm", className: "text-foreground" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_icons39.Icon, { icon: import_icons39.faPlusOutline, size: "sm", className: "text-foreground" }),
                     "Add filter"
                   ] })
                 }
               ),
               /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("button", { type: "button", onClick: handleAddGroup, className: cn(ghostBtn2, "text-foreground"), children: [
-                /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_icons37.Icon, { icon: import_icons37.faPlusOutline, size: "sm", className: "text-foreground" }),
+                /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_icons39.Icon, { icon: import_icons39.faPlusOutline, size: "sm", className: "text-foreground" }),
                 "Add filters group"
               ] })
             ] }),
@@ -8716,7 +8900,7 @@ var SummaryChip = ({
                 },
                 className: cn(ghostBtn2, "text-destructive"),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_icons37.Icon, { icon: import_icons37.faXmarkOutline, size: "sm", className: "text-destructive" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_icons39.Icon, { icon: import_icons39.faXmarkOutline, size: "sm", className: "text-destructive" }),
                   "Clear filters"
                 ]
               }
@@ -8753,7 +8937,7 @@ var DraftRow2 = ({ properties, onSelect, open: openProp, onOpenChange }) => {
         ),
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "text-sm font-regular leading-sm text-muted-foreground whitespace-nowrap", children: "Select property" }),
-          /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_icons37.Icon, { icon: import_icons37.faChevronDownOutline, size: "xs", className: "shrink-0 text-foreground" })
+          /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_icons39.Icon, { icon: import_icons39.faChevronDownOutline, size: "xs", className: "shrink-0 text-foreground" })
         ]
       }
     ) })
@@ -8981,7 +9165,7 @@ var FilterSystem = ({
                 {
                   type: "button",
                   className: "shrink-0 inline-flex items-center justify-center size-8 rounded-md border border-btn-outlined-neutral-border-default bg-gradient-to-t from-btn-outlined-neutral-bg-default from-[10%] to-btn-outlined-neutral-bg-gradient-to-default shadow-sm cursor-pointer transition-colors hover:from-btn-outlined-neutral-bg-hover hover:to-btn-outlined-neutral-bg-gradient-to-hover",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_icons38.Icon, { icon: import_icons38.faPlusOutline, size: "sm", className: "text-foreground" })
+                  children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_icons40.Icon, { icon: import_icons40.faPlusOutline, size: "sm", className: "text-foreground" })
                 }
               ) : /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(FilterBarButton, {})
             }