@kopexa/filter 0.0.3 → 0.0.5

package/dist/{chunk-7QP7FRID.mjs → chunk-PHESMHTT.mjs}

@@ -17,7 +17,7 @@ var DEFAULT_OPERATORS = {
   multiselect: ["equals", "not_equals", "is_empty", "is_not_empty"],
   date: ["equals", "not_equals", "gt", "lt", "gte", "lte", "between"],
   daterange: ["between"],
-  boolean: ["equals"]
+  boolean: ["equals", "not_equals", "is_empty", "is_not_empty"]
 };
 function getDefaultOperator(type) {
   switch (type) {

package/dist/{chunk-PTJ7HZPA.mjs → chunk-SH7DBK54.mjs}

@@ -7,7 +7,7 @@ import {
 } from "./chunk-I3Z2T4N2.mjs";
 import {
   getDefaultOperator
-} from "./chunk-7QP7FRID.mjs";
+} from "./chunk-PHESMHTT.mjs";
 
 // src/filter.tsx
 import { DropdownMenu } from "@kopexa/dropdown-menu";

package/dist/{chunk-7KY2PDNL.mjs → chunk-WCKTCW7Y.mjs}

@@ -1,7 +1,7 @@
 "use client";
 import {
   FilterValueEditor
-} from "./chunk-63P4ITVP.mjs";
+} from "./chunk-WUUOSJHW.mjs";
 import {
   messages
 } from "./chunk-URDCG5NI.mjs";
@@ -14,6 +14,7 @@ import { useSafeIntl } from "@kopexa/i18n";
 import { CloseIcon } from "@kopexa/icons";
 import { Popover } from "@kopexa/popover";
 import { cn } from "@kopexa/shared-utils";
+import { Switch } from "@kopexa/switch";
 import { jsx, jsxs } from "react/jsx-runtime";
 function FilterActive(props) {
   const { showClearAll = true, className, ...rest } = props;
@@ -45,39 +46,68 @@ function FilterActive(props) {
 }
 FilterActive.displayName = "FilterActive";
 function FilterField({ filter }) {
-  const { fields, styles, removeFilter, editingFilterId, setEditingFilterId } = useFilterContext();
+  const {
+    fields,
+    styles,
+    removeFilter,
+    editingFilterId,
+    setEditingFilterId,
+    updateFilter
+  } = useFilterContext();
   const t = useSafeIntl();
   const field = fields.get(filter.fieldId);
   if (!field) return null;
   const isEditing = editingFilterId === filter.id;
   const operatorKey = `op_${filter.operator}`;
   const operatorLabel = messages[operatorKey] ? t.formatMessage(messages[operatorKey]) : filter.operator;
-  const valueDisplay = getValueDisplay(filter, field);
+  const isBooleanWithValue = field.type === "boolean" && filter.operator !== "is_empty" && filter.operator !== "is_not_empty";
+  const valueDisplay = isBooleanWithValue ? null : getValueDisplay(filter, field);
   return /* @__PURE__ */ jsxs(
     Popover.Root,
     {
       open: isEditing,
       onOpenChange: (open) => setEditingFilterId(open ? filter.id : null),
       children: [
-        /* @__PURE__ */ jsxs(Popover.Trigger, { "data-slot": "filter-field", className: styles.field(), children: [
-          field.icon && /* @__PURE__ */ jsx("span", { className: styles.menuItemIcon(), children: field.icon }),
-          /* @__PURE__ */ jsx("span", { className: styles.fieldLabel(), children: field.label }),
-          /* @__PURE__ */ jsx("span", { className: styles.fieldOperator(), children: operatorLabel }),
-          valueDisplay && /* @__PURE__ */ jsx("span", { className: styles.fieldValue(), children: valueDisplay }),
-          /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              className: styles.fieldRemove(),
-              onClick: (e) => {
-                e.stopPropagation();
-                removeFilter(filter.id);
-              },
-              "aria-label": "Remove filter",
-              children: /* @__PURE__ */ jsx(CloseIcon, { className: "size-3" })
-            }
-          )
-        ] }),
+        /* @__PURE__ */ jsxs(
+          Popover.Trigger,
+          {
+            "data-slot": "filter-field",
+            className: styles.field(),
+            render: /* @__PURE__ */ jsx("div", {}),
+            nativeButton: false,
+            children: [
+              field.icon && /* @__PURE__ */ jsx("span", { className: styles.menuItemIcon(), children: field.icon }),
+              /* @__PURE__ */ jsx("span", { className: styles.fieldLabel(), children: field.label }),
+              /* @__PURE__ */ jsx("span", { className: styles.fieldOperator(), children: operatorLabel }),
+              isBooleanWithValue && /* @__PURE__ */ jsx(
+                Switch,
+                {
+                  size: "sm",
+                  checked: Boolean(filter.value),
+                  onCheckedChange: (checked) => {
+                    updateFilter(filter.id, { value: checked });
+                  },
+                  onClick: (e) => e.stopPropagation(),
+                  "aria-label": field.label
+                }
+              ),
+              valueDisplay && /* @__PURE__ */ jsx("span", { className: styles.fieldValue(), children: valueDisplay }),
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  className: styles.fieldRemove(),
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    removeFilter(filter.id);
+                  },
+                  "aria-label": "Remove filter",
+                  children: /* @__PURE__ */ jsx(CloseIcon, { className: "size-3" })
+                }
+              )
+            ]
+          }
+        ),
         /* @__PURE__ */ jsx(
           Popover.Content,
           {

package/dist/{chunk-63P4ITVP.mjs → chunk-WUUOSJHW.mjs}

@@ -7,7 +7,7 @@ import {
 } from "./chunk-I3Z2T4N2.mjs";
 import {
   DEFAULT_OPERATORS
-} from "./chunk-7QP7FRID.mjs";
+} from "./chunk-PHESMHTT.mjs";
 
 // src/filter-value-editor.tsx
 import { Checkbox } from "@kopexa/checkbox";

package/dist/filter-active.js

@@ -29,6 +29,7 @@ var import_i18n3 = require("@kopexa/i18n");
 var import_icons = require("@kopexa/icons");
 var import_popover = require("@kopexa/popover");
 var import_shared_utils = require("@kopexa/shared-utils");
+var import_switch = require("@kopexa/switch");
 
 // src/filter-context.tsx
 var import_react_utils = require("@kopexa/react-utils");
@@ -61,7 +62,7 @@ var DEFAULT_OPERATORS = {
   multiselect: ["equals", "not_equals", "is_empty", "is_not_empty"],
   date: ["equals", "not_equals", "gt", "lt", "gte", "lte", "between"],
   daterange: ["between"],
-  boolean: ["equals"]
+  boolean: ["equals", "not_equals", "is_empty", "is_not_empty"]
 };
 
 // src/messages.ts
@@ -447,39 +448,68 @@ function FilterActive(props) {
 }
 FilterActive.displayName = "FilterActive";
 function FilterField({ filter }) {
-  const { fields, styles, removeFilter, editingFilterId, setEditingFilterId } = useFilterContext();
+  const {
+    fields,
+    styles,
+    removeFilter,
+    editingFilterId,
+    setEditingFilterId,
+    updateFilter
+  } = useFilterContext();
   const t = (0, import_i18n3.useSafeIntl)();
   const field = fields.get(filter.fieldId);
   if (!field) return null;
   const isEditing = editingFilterId === filter.id;
   const operatorKey = `op_${filter.operator}`;
   const operatorLabel = messages[operatorKey] ? t.formatMessage(messages[operatorKey]) : filter.operator;
-  const valueDisplay = getValueDisplay(filter, field);
+  const isBooleanWithValue = field.type === "boolean" && filter.operator !== "is_empty" && filter.operator !== "is_not_empty";
+  const valueDisplay = isBooleanWithValue ? null : getValueDisplay(filter, field);
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
     import_popover.Popover.Root,
     {
       open: isEditing,
       onOpenChange: (open) => setEditingFilterId(open ? filter.id : null),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_popover.Popover.Trigger, { "data-slot": "filter-field", className: styles.field(), children: [
-          field.icon && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: styles.menuItemIcon(), children: field.icon }),
-          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: styles.fieldLabel(), children: field.label }),
-          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: styles.fieldOperator(), children: operatorLabel }),
-          valueDisplay && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: styles.fieldValue(), children: valueDisplay }),
-          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-            "button",
-            {
-              type: "button",
-              className: styles.fieldRemove(),
-              onClick: (e) => {
-                e.stopPropagation();
-                removeFilter(filter.id);
-              },
-              "aria-label": "Remove filter",
-              children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons.CloseIcon, { className: "size-3" })
-            }
-          )
-        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+          import_popover.Popover.Trigger,
+          {
+            "data-slot": "filter-field",
+            className: styles.field(),
+            render: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", {}),
+            nativeButton: false,
+            children: [
+              field.icon && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: styles.menuItemIcon(), children: field.icon }),
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: styles.fieldLabel(), children: field.label }),
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: styles.fieldOperator(), children: operatorLabel }),
+              isBooleanWithValue && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                import_switch.Switch,
+                {
+                  size: "sm",
+                  checked: Boolean(filter.value),
+                  onCheckedChange: (checked) => {
+                    updateFilter(filter.id, { value: checked });
+                  },
+                  onClick: (e) => e.stopPropagation(),
+                  "aria-label": field.label
+                }
+              ),
+              valueDisplay && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: styles.fieldValue(), children: valueDisplay }),
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                "button",
+                {
+                  type: "button",
+                  className: styles.fieldRemove(),
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    removeFilter(filter.id);
+                  },
+                  "aria-label": "Remove filter",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons.CloseIcon, { className: "size-3" })
+                }
+              )
+            ]
+          }
+        ),
         /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
           import_popover.Popover.Content,
           {

package/dist/filter-active.mjs

@@ -2,11 +2,11 @@
 "use client";
 import {
   FilterActive
-} from "./chunk-7KY2PDNL.mjs";
-import "./chunk-63P4ITVP.mjs";
+} from "./chunk-WCKTCW7Y.mjs";
+import "./chunk-WUUOSJHW.mjs";
 import "./chunk-URDCG5NI.mjs";
 import "./chunk-I3Z2T4N2.mjs";
-import "./chunk-7QP7FRID.mjs";
+import "./chunk-PHESMHTT.mjs";
 export {
   FilterActive
 };

package/dist/filter-types.js

@@ -42,7 +42,7 @@ var DEFAULT_OPERATORS = {
   multiselect: ["equals", "not_equals", "is_empty", "is_not_empty"],
   date: ["equals", "not_equals", "gt", "lt", "gte", "lte", "between"],
   daterange: ["between"],
-  boolean: ["equals"]
+  boolean: ["equals", "not_equals", "is_empty", "is_not_empty"]
 };
 function getDefaultOperator(type) {
   switch (type) {

package/dist/filter-types.mjs

@@ -3,7 +3,7 @@ import {
   DEFAULT_OPERATORS,
   generateFilterId,
   getDefaultOperator
-} from "./chunk-7QP7FRID.mjs";
+} from "./chunk-PHESMHTT.mjs";
 export {
   DEFAULT_OPERATORS,
   generateFilterId,

package/dist/filter-value-editor.js

@@ -55,7 +55,7 @@ var DEFAULT_OPERATORS = {
   multiselect: ["equals", "not_equals", "is_empty", "is_not_empty"],
   date: ["equals", "not_equals", "gt", "lt", "gte", "lte", "between"],
   daterange: ["between"],
-  boolean: ["equals"]
+  boolean: ["equals", "not_equals", "is_empty", "is_not_empty"]
 };
 
 // src/messages.ts

package/dist/filter-value-editor.mjs

@@ -2,10 +2,10 @@
 "use client";
 import {
   FilterValueEditor
-} from "./chunk-63P4ITVP.mjs";
+} from "./chunk-WUUOSJHW.mjs";
 import "./chunk-URDCG5NI.mjs";
 import "./chunk-I3Z2T4N2.mjs";
-import "./chunk-7QP7FRID.mjs";
+import "./chunk-PHESMHTT.mjs";
 export {
   FilterValueEditor
 };

package/dist/filter.mjs

@@ -2,10 +2,10 @@
 "use client";
 import {
   Filter
-} from "./chunk-PTJ7HZPA.mjs";
+} from "./chunk-SH7DBK54.mjs";
 import "./chunk-3WNAREG6.mjs";
 import "./chunk-I3Z2T4N2.mjs";
-import "./chunk-7QP7FRID.mjs";
+import "./chunk-PHESMHTT.mjs";
 export {
   Filter
 };

package/dist/index.js

@@ -99,7 +99,7 @@ var DEFAULT_OPERATORS = {
   multiselect: ["equals", "not_equals", "is_empty", "is_not_empty"],
   date: ["equals", "not_equals", "gt", "lt", "gte", "lte", "between"],
   daterange: ["between"],
-  boolean: ["equals"]
+  boolean: ["equals", "not_equals", "is_empty", "is_not_empty"]
 };
 function getDefaultOperator(type) {
   switch (type) {
@@ -270,6 +270,7 @@ var import_i18n3 = require("@kopexa/i18n");
 var import_icons = require("@kopexa/icons");
 var import_popover = require("@kopexa/popover");
 var import_shared_utils2 = require("@kopexa/shared-utils");
+var import_switch = require("@kopexa/switch");
 
 // src/filter-value-editor.tsx
 var import_checkbox = require("@kopexa/checkbox");
@@ -660,39 +661,68 @@ function FilterActive(props) {
 }
 FilterActive.displayName = "FilterActive";
 function FilterField({ filter }) {
-  const { fields, styles, removeFilter, editingFilterId, setEditingFilterId } = useFilterContext();
+  const {
+    fields,
+    styles,
+    removeFilter,
+    editingFilterId,
+    setEditingFilterId,
+    updateFilter
+  } = useFilterContext();
   const t = (0, import_i18n3.useSafeIntl)();
   const field = fields.get(filter.fieldId);
   if (!field) return null;
   const isEditing = editingFilterId === filter.id;
   const operatorKey = `op_${filter.operator}`;
   const operatorLabel = messages[operatorKey] ? t.formatMessage(messages[operatorKey]) : filter.operator;
-  const valueDisplay = getValueDisplay(filter, field);
+  const isBooleanWithValue = field.type === "boolean" && filter.operator !== "is_empty" && filter.operator !== "is_not_empty";
+  const valueDisplay = isBooleanWithValue ? null : getValueDisplay(filter, field);
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
     import_popover.Popover.Root,
     {
       open: isEditing,
       onOpenChange: (open) => setEditingFilterId(open ? filter.id : null),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_popover.Popover.Trigger, { "data-slot": "filter-field", className: styles.field(), children: [
-          field.icon && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: styles.menuItemIcon(), children: field.icon }),
-          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: styles.fieldLabel(), children: field.label }),
-          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: styles.fieldOperator(), children: operatorLabel }),
-          valueDisplay && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: styles.fieldValue(), children: valueDisplay }),
-          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-            "button",
-            {
-              type: "button",
-              className: styles.fieldRemove(),
-              onClick: (e) => {
-                e.stopPropagation();
-                removeFilter(filter.id);
-              },
-              "aria-label": "Remove filter",
-              children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons.CloseIcon, { className: "size-3" })
-            }
-          )
-        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+          import_popover.Popover.Trigger,
+          {
+            "data-slot": "filter-field",
+            className: styles.field(),
+            render: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", {}),
+            nativeButton: false,
+            children: [
+              field.icon && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: styles.menuItemIcon(), children: field.icon }),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: styles.fieldLabel(), children: field.label }),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: styles.fieldOperator(), children: operatorLabel }),
+              isBooleanWithValue && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                import_switch.Switch,
+                {
+                  size: "sm",
+                  checked: Boolean(filter.value),
+                  onCheckedChange: (checked) => {
+                    updateFilter(filter.id, { value: checked });
+                  },
+                  onClick: (e) => e.stopPropagation(),
+                  "aria-label": field.label
+                }
+              ),
+              valueDisplay && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: styles.fieldValue(), children: valueDisplay }),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                "button",
+                {
+                  type: "button",
+                  className: styles.fieldRemove(),
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    removeFilter(filter.id);
+                  },
+                  "aria-label": "Remove filter",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons.CloseIcon, { className: "size-3" })
+                }
+              )
+            ]
+          }
+        ),
         /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
           import_popover.Popover.Content,
           {

package/dist/index.mjs

@@ -1,7 +1,7 @@
 "use client";
 import {
   FilterActive
-} from "./chunk-7KY2PDNL.mjs";
+} from "./chunk-WCKTCW7Y.mjs";
 import {
   FilterGroup,
   FilterItem,
@@ -13,18 +13,18 @@ import {
 } from "./chunk-EF4VI36D.mjs";
 import {
   FilterValueEditor
-} from "./chunk-63P4ITVP.mjs";
+} from "./chunk-WUUOSJHW.mjs";
 import {
   messages
 } from "./chunk-URDCG5NI.mjs";
 import {
   Filter
-} from "./chunk-PTJ7HZPA.mjs";
+} from "./chunk-SH7DBK54.mjs";
 import "./chunk-3WNAREG6.mjs";
 import {
   useFilterContext
 } from "./chunk-I3Z2T4N2.mjs";
-import "./chunk-7QP7FRID.mjs";
+import "./chunk-PHESMHTT.mjs";
 export {
   Filter,
   FilterActive,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kopexa/filter",
-  "version": "0.0.3",
+  "version": "0.0.5",
   "description": "A filter component for building complex filtering interfaces",
   "keywords": [
     "filter",
@@ -30,22 +30,23 @@
   "peerDependencies": {
     "react": ">=19.0.0-rc.0",
     "react-dom": ">=19.0.0-rc.0",
-    "@kopexa/theme": "17.7.0"
+    "@kopexa/theme": "17.8.1"
   },
   "dependencies": {
-    "@kopexa/react-utils": "17.0.13",
-    "@kopexa/shared-utils": "17.0.13",
-    "@kopexa/use-controllable-state": "17.0.13",
-    "@kopexa/i18n": "17.2.0",
-    "@kopexa/icons": "17.2.1",
-    "@kopexa/input": "17.0.13",
-    "@kopexa/select": "17.0.13",
-    "@kopexa/calendar": "17.0.13",
-    "@kopexa/button": "17.0.13",
-    "@kopexa/popover": "17.0.13",
-    "@kopexa/dropdown-menu": "17.0.13",
-    "@kopexa/combobox": "17.1.2",
-    "@kopexa/checkbox": "17.0.13"
+    "@kopexa/shared-utils": "17.0.15",
+    "@kopexa/react-utils": "17.0.15",
+    "@kopexa/use-controllable-state": "17.0.15",
+    "@kopexa/icons": "17.2.3",
+    "@kopexa/i18n": "17.3.1",
+    "@kopexa/button": "17.0.15",
+    "@kopexa/select": "17.0.15",
+    "@kopexa/calendar": "17.0.15",
+    "@kopexa/input": "17.0.15",
+    "@kopexa/combobox": "17.1.4",
+    "@kopexa/switch": "17.0.15",
+    "@kopexa/popover": "17.0.15",
+    "@kopexa/checkbox": "17.0.15",
+    "@kopexa/dropdown-menu": "17.0.15"
   },
   "clean-package": "../../../clean-package.config.json",
   "module": "dist/index.mjs",