@wallarm-org/design-system 0.67.0 → 0.67.2

package/dist/components/FilterInput/hooks/useFilterInputAutocomplete/useMenuFlow/useOperatorFlow.d.ts

@@ -5,7 +5,7 @@ import type { MenuFlowInternalDeps } from './types';
  * `handleCustomOperatorCommit` is the keyboard-typed path — it resolves the
  * typed text to a known operator (label / raw key / symbol) and delegates.
  */
-export declare const useOperatorFlow: ({ editing, selectedField, selectedOperator, insertIndex, upsertCondition, conditionsRef, resetState, setSelectedOperator, setMenuState, setBuildingMultiValue, setInputText, }: MenuFlowInternalDeps) => {
+export declare const useOperatorFlow: ({ editing, selectedField, selectedOperator, insertIndex, upsertCondition, conditionsRef, resetState, setSelectedOperator, setMenuState, setBuildingMultiValue, setInputText, buildingSide, buildingBase, setBuildingBase, setBuildingSide, }: MenuFlowInternalDeps) => {
     handleOperatorSelect: (operator: FilterOperator) => void;
     handleCustomOperatorCommit: (customText: string) => void;
 };

package/dist/components/FilterInput/hooks/useFilterInputAutocomplete/useMenuFlow/useOperatorFlow.js

@@ -1,7 +1,7 @@
 import { useCallback } from "react";
 import { SEGMENT_VARIANT } from "../../../FilterInputField/FilterInputChip/index.js";
 import { OPERATOR_SYMBOLS, chipIdToConditionIndex, getFieldOperators, getOperatorFromLabel, isNoValueOperator, isOperatorAllowedForField, isValueShapeCompatible } from "../../../lib/index.js";
-const useOperatorFlow = ({ editing, selectedField, selectedOperator, insertIndex, upsertCondition, conditionsRef, resetState, setSelectedOperator, setMenuState, setBuildingMultiValue, setInputText })=>{
+const useOperatorFlow = ({ editing, selectedField, selectedOperator, insertIndex, upsertCondition, conditionsRef, resetState, setSelectedOperator, setMenuState, setBuildingMultiValue, setInputText, buildingSide, buildingBase, setBuildingBase, setBuildingSide })=>{
     const { editingChipId, editingSegment, editingSide, isBuildingEdit, setEditingSegment, setSegmentFilterText, clearEditing } = editing;
     const handleOperatorSelect = useCallback((operator)=>{
         if (!selectedField) return;
@@ -19,6 +19,14 @@ const useOperatorFlow = ({ editing, selectedField, selectedOperator, insertIndex
             return;
         }
         if (isNoValueOperator(operator)) {
+            if (1 === buildingSide && buildingBase && !editingChipId) {
+                upsertCondition(buildingBase.field, buildingBase.operator, buildingBase.value, null, insertIndex);
+                upsertCondition(selectedField, operator, null, null, void 0, void 0, void 0, 1);
+                setBuildingBase(null);
+                setBuildingSide(0);
+                resetState(true);
+                return;
+            }
             const isEditing = !!editingChipId;
             upsertCondition(selectedField, operator, null, editingChipId, isEditing ? void 0 : insertIndex, void 0, void 0, editingSide);
             resetState(!isEditing);
@@ -61,7 +69,11 @@ const useOperatorFlow = ({ editing, selectedField, selectedOperator, insertIndex
         setSelectedOperator,
         setMenuState,
         setBuildingMultiValue,
-        setInputText
+        setInputText,
+        buildingSide,
+        buildingBase,
+        setBuildingBase,
+        setBuildingSide
     ]);
     const handleCustomOperatorCommit = useCallback((customText)=>{
         if (!selectedField || !customText.trim()) return;

package/dist/components/FilterInput/hooks/useFilterInputExpression/buildChips.js

@@ -86,10 +86,11 @@ const buildPairChip = (condition, field, fields)=>{
     if (!condition.pair || !field?.pairedField) return;
     const pf = field.pairedField;
     const { operator, value, error } = condition.pair;
+    const displayValue = operator && isNoValueOperator(operator) ? NO_VALUE_PLACEHOLDER : resolveValueLabel(value, pf, fields) ?? String(value ?? '');
     return {
         attribute: pf.label || pf.name,
         operator: operator ? getOperatorLabel(operator, pf.type || DEFAULT_FIELD_TYPE) : void 0,
-        value: resolveValueLabel(value, pf, fields) ?? String(value ?? ''),
+        value: displayValue,
         ...error && {
             error
         }

package/dist/components/FilterInput/hooks/useFilterInputExpression/useFilterInputExpression.js

@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useMemo, useState } from "react";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { SEGMENT_VARIANT } from "../../FilterInputField/FilterInputChip/index.js";
 import { CONNECTOR_ID_PATTERN, chipIdToConditionIndex, validateValueForField } from "../../lib/index.js";
 import { applyExternalErrors } from "./applyExternalErrors.js";
@@ -94,13 +94,24 @@ const addConnectorIfNeeded = (connectors, newConditionsLength, editingChipId, at
 };
 const useFilterInputExpression = ({ fields, value, onChange, error, externalErrors })=>{
     const [state, setState] = useState(EMPTY_STATE);
+    const stateRef = useRef(state);
+    const applyState = useCallback((next, emit)=>{
+        stateRef.current = next;
+        setState(next);
+        if (emit) onChange?.(buildExpression(next.conditions, next.connectors, fields));
+    }, [
+        onChange,
+        fields
+    ]);
     useEffect(()=>{
         if (void 0 !== value) {
             const result = expressionToConditions(value, fields);
-            setState({
+            const next = {
                 conditions: revalidateConditions(result.conditions, fields),
                 connectors: result.connectors
-            });
+            };
+            stateRef.current = next;
+            setState(next);
         }
     }, [
         value,
@@ -114,9 +125,10 @@ const useFilterInputExpression = ({ fields, value, onChange, error, externalErro
         externalErrors
     ]);
     const upsertCondition = useCallback((field, operator, val, editingChipId, atIndex, error, dateOrigin, side)=>{
-        if (1 === side) return void setState((prev)=>{
+        const prev = stateRef.current;
+        if (1 === side) {
             const idx = null != editingChipId ? chipIdToConditionIndex(editingChipId) : prev.conditions.length - 1;
-            if (null == idx || idx < 0 || idx >= prev.conditions.length) return prev;
+            if (null == idx || idx < 0 || idx >= prev.conditions.length) return;
             const base = prev.conditions[idx];
             const updated = [
                 ...prev.conditions
@@ -136,89 +148,74 @@ const useFilterInputExpression = ({ fields, value, onChange, error, externalErro
                     }
                 }
             };
-            const next = {
+            applyState({
                 conditions: updated,
                 connectors: prev.connectors
-            };
-            onChange?.(buildExpression(next.conditions, next.connectors, fields));
-            return next;
-        });
+            }, true);
+            return;
+        }
         const condition = buildCondition(field, operator, val, error, dateOrigin);
-        setState((prev)=>{
-            const newConditions = applyCondition(prev.conditions, condition, editingChipId, atIndex);
-            const newConnectors = addConnectorIfNeeded(prev.connectors, newConditions.length, editingChipId, atIndex, prev.conditions.length);
-            const next = {
-                conditions: newConditions,
-                connectors: newConnectors
-            };
-            onChange?.(buildExpression(next.conditions, next.connectors, fields));
-            return next;
-        });
+        const newConditions = applyCondition(prev.conditions, condition, editingChipId, atIndex);
+        const newConnectors = addConnectorIfNeeded(prev.connectors, newConditions.length, editingChipId, atIndex, prev.conditions.length);
+        applyState({
+            conditions: newConditions,
+            connectors: newConnectors
+        }, true);
     }, [
-        onChange,
-        fields
+        applyState
     ]);
     const removeCondition = useCallback((chipId)=>{
         const idx = chipIdToConditionIndex(chipId);
         if (null === idx) return;
-        setState((prev)=>{
-            if (prev.conditions[idx]?.disabled) return prev;
-            const newConditions = prev.conditions.filter((_, i)=>i !== idx);
-            const newConnectors = removeConnectorAtConditionIndex(prev.connectors, idx);
-            const next = {
-                conditions: newConditions,
-                connectors: newConnectors
-            };
-            onChange?.(buildExpression(next.conditions, next.connectors, fields));
-            return next;
-        });
+        const prev = stateRef.current;
+        if (prev.conditions[idx]?.disabled) return;
+        const newConditions = prev.conditions.filter((_, i)=>i !== idx);
+        const newConnectors = removeConnectorAtConditionIndex(prev.connectors, idx);
+        applyState({
+            conditions: newConditions,
+            connectors: newConnectors
+        }, true);
     }, [
-        onChange,
-        fields
+        applyState
     ]);
     const removeConditionAtIndex = useCallback((idx)=>{
-        setState((prev)=>{
-            if (idx < 0 || idx >= prev.conditions.length) return prev;
-            if (prev.conditions[idx]?.disabled) return prev;
-            const newConditions = prev.conditions.filter((_, i)=>i !== idx);
-            const newConnectors = removeConnectorAtConditionIndex(prev.connectors, idx);
-            const next = {
-                conditions: newConditions,
-                connectors: newConnectors
-            };
-            onChange?.(buildExpression(next.conditions, next.connectors, fields));
-            return next;
-        });
+        const prev = stateRef.current;
+        if (idx < 0 || idx >= prev.conditions.length) return;
+        if (prev.conditions[idx]?.disabled) return;
+        const newConditions = prev.conditions.filter((_, i)=>i !== idx);
+        const newConnectors = removeConnectorAtConditionIndex(prev.connectors, idx);
+        applyState({
+            conditions: newConditions,
+            connectors: newConnectors
+        }, true);
     }, [
-        onChange,
-        fields
+        applyState
     ]);
     const clearAll = useCallback(()=>{
-        setState((prev)=>{
-            const disabledConditions = prev.conditions.filter((c)=>c.disabled);
-            if (0 === disabledConditions.length) {
-                onChange?.(null);
-                return EMPTY_STATE;
-            }
-            const next = {
-                conditions: disabledConditions,
-                connectors: []
-            };
-            onChange?.(buildExpression(next.conditions, next.connectors, fields));
-            return next;
-        });
+        const prev = stateRef.current;
+        const disabledConditions = prev.conditions.filter((c)=>c.disabled);
+        if (0 === disabledConditions.length) {
+            applyState(EMPTY_STATE, false);
+            onChange?.(null);
+            return;
+        }
+        applyState({
+            conditions: disabledConditions,
+            connectors: []
+        }, true);
     }, [
-        onChange,
-        fields
+        applyState,
+        onChange
     ]);
     const replaceExpression = useCallback((expr)=>{
         const result = expressionToConditions(expr, fields);
-        setState({
+        applyState({
             conditions: result.conditions,
             connectors: result.connectors
-        });
+        }, false);
         onChange?.(expr);
     }, [
+        applyState,
         onChange,
         fields
     ]);
@@ -227,21 +224,17 @@ const useFilterInputExpression = ({ fields, value, onChange, error, externalErro
         if (!match) return;
         const condIdx = Number(match[1]);
         const connectorIdx = condIdx - 1;
-        setState((prev)=>{
-            const updated = [
-                ...prev.connectors
-            ];
-            if (connectorIdx >= 0 && connectorIdx < updated.length) updated[connectorIdx] = value;
-            const next = {
-                conditions: prev.conditions,
-                connectors: updated
-            };
-            onChange?.(buildExpression(next.conditions, next.connectors, fields));
-            return next;
-        });
+        const prev = stateRef.current;
+        const updated = [
+            ...prev.connectors
+        ];
+        if (connectorIdx >= 0 && connectorIdx < updated.length) updated[connectorIdx] = value;
+        applyState({
+            conditions: prev.conditions,
+            connectors: updated
+        }, true);
     }, [
-        onChange,
-        fields
+        applyState
     ]);
     return {
         conditions: state.conditions,

package/dist/components/FilterInput/lib/constants.js

@@ -28,8 +28,8 @@ const OPERATOR_SYMBOLS = {
     not_like: '!~',
     in: 'IN',
     not_in: 'NOT IN',
-    is_null: '= null',
-    is_not_null: '!= null',
+    is_null: '!= null',
+    is_not_null: '= null',
     between: '<>'
 };
 const OPERATOR_LABELS = {

package/dist/metadata/components.json

@@ -1,6 +1,6 @@
 {
-  "version": "0.66.3",
-  "generatedAt": "2026-06-24T13:26:24.868Z",
+  "version": "0.67.1",
+  "generatedAt": "2026-06-24T17:39:16.110Z",
   "components": [
     {
       "name": "Accordion",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wallarm-org/design-system",
-  "version": "0.67.0",
+  "version": "0.67.2",
   "description": "Core design system library with React components and Storybook documentation",
   "publishConfig": {
     "access": "public",