@wallarm-org/design-system 0.20.0 → 0.21.0

package/dist/components/FilterInput/hooks/useFilterInputSelection/useSelectionClipboard.js

@@ -0,0 +1,77 @@
+import { useCallback } from "react";
+import { isFilterParseError, parseExpression } from "../../lib/index.js";
+import { serializeSelectedOrAll } from "./lib/index.js";
+const formatPasteError = (err)=>{
+    if (!isFilterParseError(err)) return 'Could not parse the pasted filter text';
+    const msg = err.message;
+    if (msg.startsWith('Unknown field:')) {
+        const field = msg.replace('Unknown field: ', '');
+        return `Unknown filter field "${field}". Check the field name and try again.`;
+    }
+    if (msg.includes('not allowed for field')) return `${msg}. Check the operator and try again.`;
+    if (msg.startsWith('Invalid value')) return `${msg}. Check the allowed values and try again.`;
+    if (msg.startsWith('Expected')) return `Invalid filter format: ${msg.toLowerCase()}. Expected format: (field operator value) AND (field operator value)`;
+    if ('Empty filter text' === msg) return 'The pasted text is empty';
+    return `Could not parse filter: ${msg}`;
+};
+const useSelectionClipboard = ({ conditions, connectors, fields, chipRegistryRef, clearSelection, setPasteError, setInputText, closeMenu, onChange })=>{
+    const handleCopy = useCallback((e)=>{
+        if (0 === conditions.length) return;
+        e.preventDefault();
+        const text = serializeSelectedOrAll(conditions, connectors, chipRegistryRef.current);
+        e.clipboardData.setData('text/plain', text);
+    }, [
+        conditions,
+        connectors,
+        chipRegistryRef
+    ]);
+    const handlePaste = useCallback((e)=>{
+        const text = e.clipboardData.getData('text/plain').trim();
+        if (!text) return;
+        if (!text.includes('(') && !text.includes('=') && !text.includes(' in ')) return;
+        e.preventDefault();
+        try {
+            const expr = parseExpression(text, fields);
+            onChange?.(expr);
+            clearSelection();
+            setPasteError(null);
+        } catch (err) {
+            setInputText(text);
+            closeMenu();
+            setPasteError(formatPasteError(err));
+        }
+    }, [
+        fields,
+        onChange,
+        clearSelection,
+        setPasteError,
+        setInputText,
+        closeMenu
+    ]);
+    const retryParse = useCallback((text)=>{
+        const trimmed = text.trim();
+        if (!trimmed) return void setPasteError(null);
+        if (!trimmed.includes('(') && !trimmed.includes('=') && !trimmed.includes(' in ')) return;
+        try {
+            const expr = parseExpression(trimmed, fields);
+            onChange?.(expr);
+            setInputText('');
+            closeMenu();
+            setPasteError(null);
+        } catch (err) {
+            setPasteError(formatPasteError(err));
+        }
+    }, [
+        fields,
+        onChange,
+        setPasteError,
+        setInputText,
+        closeMenu
+    ]);
+    return {
+        handleCopy,
+        handlePaste,
+        retryParse
+    };
+};
+export { useSelectionClipboard };

package/dist/components/FilterInput/hooks/useFilterInputSelection/useSelectionKeyboard.d.ts

@@ -0,0 +1,14 @@
+import type { KeyboardEvent, RefObject } from 'react';
+interface UseSelectionKeyboardOptions {
+    allSelected: boolean;
+    conditionsCount: number;
+    chipRegistryRef: RefObject<Map<string, HTMLElement>>;
+    inputRef: RefObject<HTMLInputElement | null>;
+    clearAll: () => void;
+    clearSelection: () => void;
+    onSelectAll: () => void;
+}
+export declare const useSelectionKeyboard: ({ allSelected, conditionsCount, chipRegistryRef, inputRef, clearAll, clearSelection, onSelectAll, }: UseSelectionKeyboardOptions) => {
+    handleKeyDown: (e: KeyboardEvent<HTMLDivElement>) => void;
+};
+export {};

package/dist/components/FilterInput/hooks/useFilterInputSelection/useSelectionKeyboard.js

@@ -0,0 +1,40 @@
+import { useCallback } from "react";
+import { hasDragSelection } from "./lib/index.js";
+const useSelectionKeyboard = ({ allSelected, conditionsCount, chipRegistryRef, inputRef, clearAll, clearSelection, onSelectAll })=>{
+    const handleKeyDown = useCallback((e)=>{
+        const isMod = e.metaKey || e.ctrlKey;
+        const hasSelection = allSelected || hasDragSelection(chipRegistryRef.current);
+        if (isMod && 'a' === e.key && conditionsCount > 0) {
+            e.preventDefault();
+            clearSelection();
+            onSelectAll();
+            inputRef.current?.blur();
+            return;
+        }
+        if (hasSelection && ('Delete' === e.key || 'Backspace' === e.key)) {
+            e.preventDefault();
+            clearAll();
+            clearSelection();
+            return;
+        }
+        if (hasSelection && 'Escape' === e.key) {
+            e.preventDefault();
+            clearSelection();
+            inputRef.current?.focus();
+            return;
+        }
+        if (hasSelection && !isMod) clearSelection();
+    }, [
+        allSelected,
+        conditionsCount,
+        chipRegistryRef,
+        inputRef,
+        clearAll,
+        clearSelection,
+        onSelectAll
+    ]);
+    return {
+        handleKeyDown
+    };
+};
+export { useSelectionKeyboard };

package/dist/components/FilterInput/index.d.ts

@@ -1,4 +1,5 @@
 export { FilterInput, type FilterInputProps } from './FilterInput';
 export { FilterInputChip, type FilterInputChipProps } from './FilterInputField';
 export { FilterInputFieldMenu, type FilterInputFieldMenuProps, FilterInputOperatorMenu, type FilterInputOperatorMenuProps, FilterInputValueMenu, type FilterInputValueMenuProps, type ValueOption, } from './FilterInputMenu';
+export { type FilterParseError, isFilterParseError, parseExpression, serializeExpression, } from './lib';
 export type { Condition, ExprNode, FieldMetadata, FieldType, FieldValueOption, FilterInputChipData, FilterInputChipVariant, FilterOperator, Group, } from './types';

package/dist/components/FilterInput/index.js

@@ -1,4 +1,5 @@
 import { FilterInput } from "./FilterInput.js";
 import { FilterInputChip } from "./FilterInputField/index.js";
 import { FilterInputFieldMenu, FilterInputOperatorMenu, FilterInputValueMenu } from "./FilterInputMenu/index.js";
-export { FilterInput, FilterInputChip, FilterInputFieldMenu, FilterInputOperatorMenu, FilterInputValueMenu };
+import { isFilterParseError, parseExpression, serializeExpression } from "./lib/index.js";
+export { FilterInput, FilterInputChip, FilterInputFieldMenu, FilterInputOperatorMenu, FilterInputValueMenu, isFilterParseError, parseExpression, serializeExpression };

package/dist/components/FilterInput/lib/index.d.ts

@@ -7,3 +7,5 @@ export { getFieldValues, hasFieldValues } from './fields';
 export { filterAndSort } from './filterSort';
 export { getValueFilterText } from './menuFilterText';
 export { getOperatorFromLabel, getOperatorLabel, isBetweenOperator, isMultiSelectOperator, isNoValueOperator, } from './operators';
+export { type FilterParseError, isFilterParseError, parseExpression } from './parseExpression';
+export { serializeExpression } from './serializeExpression';

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

@@ -6,4 +6,6 @@ import { getFieldValues, hasFieldValues } from "./fields.js";
 import { filterAndSort } from "./filterSort.js";
 import { getValueFilterText } from "./menuFilterText.js";
 import { getOperatorFromLabel, getOperatorLabel, isBetweenOperator, isMultiSelectOperator, isNoValueOperator } from "./operators.js";
-export { CONNECTOR_ID_PATTERN, DATE_PRESETS, NO_VALUE_OPERATORS, OPERATORS_BY_TYPE, OPERATOR_LABELS, OPERATOR_LABELS_BY_TYPE, OPERATOR_SYMBOLS, QUERY_BAR_SELECTOR, VARIANT_LABELS, buildContainerAnchoredRect, chipIdToConditionIndex, filterAndSort, findChipSplitIndex, formatDateForChip, getDateDisplayLabel, getFieldValues, getOperatorFromLabel, getOperatorLabel, getValueFilterText, hasFieldValues, isBetweenOperator, isDatePreset, isMenuRelated, isMultiSelectOperator, isNoValueOperator };
+import { isFilterParseError, parseExpression } from "./parseExpression/index.js";
+import { serializeExpression } from "./serializeExpression.js";
+export { CONNECTOR_ID_PATTERN, DATE_PRESETS, NO_VALUE_OPERATORS, OPERATORS_BY_TYPE, OPERATOR_LABELS, OPERATOR_LABELS_BY_TYPE, OPERATOR_SYMBOLS, QUERY_BAR_SELECTOR, VARIANT_LABELS, buildContainerAnchoredRect, chipIdToConditionIndex, filterAndSort, findChipSplitIndex, formatDateForChip, getDateDisplayLabel, getFieldValues, getOperatorFromLabel, getOperatorLabel, getValueFilterText, hasFieldValues, isBetweenOperator, isDatePreset, isFilterParseError, isMenuRelated, isMultiSelectOperator, isNoValueOperator, parseExpression, serializeExpression };

package/dist/components/FilterInput/lib/parseExpression/error.d.ts

@@ -0,0 +1,6 @@
+export interface FilterParseError {
+    readonly _tag: 'FilterParseError';
+    readonly message: string;
+}
+export declare const FilterParseError: (message: string) => FilterParseError;
+export declare const isFilterParseError: (value: unknown) => value is FilterParseError;

package/dist/components/FilterInput/lib/parseExpression/error.js

@@ -0,0 +1,6 @@
+const FilterParseError = (message)=>({
+        _tag: 'FilterParseError',
+        message
+    });
+const isFilterParseError = (value)=>'object' == typeof value && null !== value && '_tag' in value && 'FilterParseError' === value._tag;
+export { FilterParseError, isFilterParseError };

package/dist/components/FilterInput/lib/parseExpression/index.d.ts

@@ -0,0 +1,2 @@
+export { type FilterParseError, isFilterParseError } from './error';
+export { parseExpression } from './parseExpression';

package/dist/components/FilterInput/lib/parseExpression/index.js

@@ -0,0 +1,3 @@
+import { isFilterParseError } from "./error.js";
+import { parseExpression } from "./parseExpression.js";
+export { isFilterParseError, parseExpression };

package/dist/components/FilterInput/lib/parseExpression/parseExpression.d.ts

@@ -0,0 +1,8 @@
+import type { ExprNode, FieldMetadata } from '../../types';
+/**
+ * Parse a filter text string into an expression tree.
+ * Validates field names, operators, and values against the provided field metadata.
+ *
+ * @throws {FilterParseError} on invalid input
+ */
+export declare const parseExpression: (text: string, fields: FieldMetadata[]) => ExprNode;

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

@@ -0,0 +1,21 @@
+import { FilterParseError } from "./error.js";
+import { parseExpr } from "./parser.js";
+import { tokenize } from "./tokenizer.js";
+const parseExpression = (text, fields)=>{
+    const trimmed = text.trim();
+    if (!trimmed) throw FilterParseError('Empty filter text');
+    const tokens = tokenize(trimmed);
+    if (0 === tokens.length) throw FilterParseError('Empty filter text');
+    const state = {
+        tokens,
+        pos: 0,
+        fields
+    };
+    const expr = parseExpr(state);
+    if (state.pos < tokens.length) {
+        const remaining = tokens[state.pos];
+        throw FilterParseError(`Unexpected token '${remaining.value}' at position ${remaining.pos}`);
+    }
+    return expr;
+};
+export { parseExpression };

package/dist/components/FilterInput/lib/parseExpression/parser.d.ts

@@ -0,0 +1,4 @@
+import type { ExprNode } from '../../types';
+import type { ParserState } from './types';
+/** expression → term ( OR term )* */
+export declare const parseExpr: (s: ParserState) => ExprNode;

package/dist/components/FilterInput/lib/parseExpression/parser.js

@@ -0,0 +1,146 @@
+import { FilterParseError } from "./error.js";
+import { validateField, validateOperator, validateValues } from "./validators.js";
+const peek = (s)=>s.tokens[s.pos];
+const advance = (s)=>{
+    const token = s.tokens[s.pos];
+    if (!token) throw FilterParseError('Unexpected end of input');
+    s.pos++;
+    return token;
+};
+const expect = (s, type)=>{
+    const token = peek(s);
+    if (!token || token.type !== type) {
+        const found = token ? `'${token.value}' at position ${token.pos}` : 'end of input';
+        throw FilterParseError(`Expected ${type}, found ${found}`);
+    }
+    return advance(s);
+};
+const parseValueList = (s)=>{
+    expect(s, 'LBRACKET');
+    const values = [];
+    if (peek(s)?.type !== 'RBRACKET') {
+        values.push(expect(s, 'IDENT').value);
+        while(peek(s)?.type === 'COMMA'){
+            advance(s);
+            values.push(expect(s, 'IDENT').value);
+        }
+    }
+    expect(s, 'RBRACKET');
+    return values;
+};
+const parseCondition = (s)=>{
+    const fieldToken = expect(s, 'IDENT');
+    validateField(s, fieldToken.value);
+    const opToken = peek(s);
+    if (!opToken || 'OPERATOR' !== opToken.type) throw FilterParseError(`Expected operator after field '${fieldToken.value}'`);
+    advance(s);
+    const operator = validateOperator(s, opToken.value, fieldToken.value);
+    if ('is_null' === operator || 'is_not_null' === operator) return {
+        type: 'condition',
+        field: fieldToken.value,
+        operator,
+        value: null
+    };
+    if (peek(s)?.type === 'LBRACKET') {
+        const values = parseValueList(s);
+        validateValues(s, fieldToken.value, values);
+        return {
+            type: 'condition',
+            field: fieldToken.value,
+            operator,
+            value: values
+        };
+    }
+    const valueToken = expect(s, 'IDENT');
+    validateValues(s, fieldToken.value, [
+        valueToken.value
+    ]);
+    return {
+        type: 'condition',
+        field: fieldToken.value,
+        operator,
+        value: valueToken.value
+    };
+};
+const parseFactor = (s)=>{
+    if (peek(s)?.type === 'LPAREN') {
+        advance(s);
+        if (peek(s)?.type === 'LPAREN') {
+            const expr = parseExpr(s);
+            expect(s, 'RPAREN');
+            return expr;
+        }
+        const condition = parseCondition(s);
+        const next = peek(s);
+        if (next?.type === 'RPAREN') {
+            advance(s);
+            return condition;
+        }
+        if (next?.type === 'AND' || next?.type === 'OR') {
+            const children = [
+                condition
+            ];
+            const groupOp = 'AND' === next.type ? 'and' : 'or';
+            while(peek(s)?.type === 'AND' || peek(s)?.type === 'OR'){
+                advance(s);
+                children.push(parseFactor(s));
+            }
+            expect(s, 'RPAREN');
+            return {
+                type: 'group',
+                operator: groupOp,
+                children
+            };
+        }
+        const found = next ? `'${next.value}' at position ${next.pos}` : 'end of input';
+        throw FilterParseError(`Expected ')' or connector after condition, found ${found}`);
+    }
+    if (peek(s)?.type === 'IDENT') return parseCondition(s);
+    const token = peek(s);
+    throw FilterParseError(token ? `Unexpected token '${token.value}' at position ${token.pos}` : 'Unexpected end of input');
+};
+const parseTerm = (s)=>{
+    let left = parseFactor(s);
+    while(peek(s)?.type === 'AND'){
+        advance(s);
+        const right = parseFactor(s);
+        left = 'group' === left.type && 'and' === left.operator ? {
+            ...left,
+            children: [
+                ...left.children,
+                right
+            ]
+        } : {
+            type: 'group',
+            operator: 'and',
+            children: [
+                left,
+                right
+            ]
+        };
+    }
+    return left;
+};
+const parseExpr = (s)=>{
+    let left = parseTerm(s);
+    while(peek(s)?.type === 'OR'){
+        advance(s);
+        const right = parseTerm(s);
+        left = 'group' === left.type && 'or' === left.operator ? {
+            ...left,
+            children: [
+                ...left.children,
+                right
+            ]
+        } : {
+            type: 'group',
+            operator: 'or',
+            children: [
+                left,
+                right
+            ]
+        };
+    }
+    return left;
+};
+export { parseExpr };

package/dist/components/FilterInput/lib/parseExpression/tokenizer.d.ts

@@ -0,0 +1,8 @@
+export type TokenType = 'LPAREN' | 'RPAREN' | 'LBRACKET' | 'RBRACKET' | 'COMMA' | 'AND' | 'OR' | 'OPERATOR' | 'IDENT';
+export interface Token {
+    type: TokenType;
+    value: string;
+    pos: number;
+}
+export declare const OPERATORS: ReadonlySet<string>;
+export declare const tokenize: (input: string) => Token[];

package/dist/components/FilterInput/lib/parseExpression/tokenizer.js

@@ -0,0 +1,101 @@
+import { FilterParseError } from "./error.js";
+const OPERATORS = new Set([
+    '=',
+    '!=',
+    '>',
+    '<',
+    '>=',
+    '<=',
+    'in',
+    'not_in',
+    'like',
+    'not_like',
+    'is_null',
+    'is_not_null',
+    'between'
+]);
+const TWO_CHAR_OPS = new Set([
+    '!=',
+    '>=',
+    '<='
+]);
+const isWhitespace = (ch)=>' \t\n\r'.includes(ch);
+const isIdentChar = (ch)=>'' !== ch && !isWhitespace(ch) && !'()[],!><='.includes(ch);
+const tokenize = (input)=>{
+    const tokens = [];
+    let i = 0;
+    const push = (type, value, pos, len = 1)=>{
+        tokens.push({
+            type,
+            value,
+            pos
+        });
+        i += len;
+    };
+    while(i < input.length){
+        const ch = input[i];
+        if (isWhitespace(ch)) {
+            i++;
+            continue;
+        }
+        if ('(' === ch) {
+            push('LPAREN', '(', i);
+            continue;
+        }
+        if (')' === ch) {
+            push('RPAREN', ')', i);
+            continue;
+        }
+        if ('[' === ch) {
+            push('LBRACKET', '[', i);
+            continue;
+        }
+        if (']' === ch) {
+            push('RBRACKET', ']', i);
+            continue;
+        }
+        if (',' === ch) {
+            push('COMMA', ',', i);
+            continue;
+        }
+        const two = input.slice(i, i + 2);
+        if (TWO_CHAR_OPS.has(two)) {
+            push('OPERATOR', two, i, 2);
+            continue;
+        }
+        if ('=><'.includes(ch)) {
+            push('OPERATOR', ch, i);
+            continue;
+        }
+        if (isIdentChar(ch)) {
+            const start = i;
+            while(i < input.length && isIdentChar(input[i]))i++;
+            const word = input.slice(start, i);
+            const upper = word.toUpperCase();
+            if ('AND' === upper) tokens.push({
+                type: 'AND',
+                value: 'AND',
+                pos: start
+            });
+            else if ('OR' === upper) tokens.push({
+                type: 'OR',
+                value: 'OR',
+                pos: start
+            });
+            else if (OPERATORS.has(word)) tokens.push({
+                type: 'OPERATOR',
+                value: word,
+                pos: start
+            });
+            else tokens.push({
+                type: 'IDENT',
+                value: word,
+                pos: start
+            });
+            continue;
+        }
+        throw FilterParseError(`Unexpected character '${ch}' at position ${i}`);
+    }
+    return tokens;
+};
+export { OPERATORS, tokenize };

package/dist/components/FilterInput/lib/parseExpression/types.d.ts

@@ -0,0 +1,7 @@
+import type { FieldMetadata } from '../../types';
+import type { Token } from './tokenizer';
+export interface ParserState {
+    tokens: Token[];
+    pos: number;
+    fields: FieldMetadata[];
+}

package/dist/components/FilterInput/lib/parseExpression/validators.d.ts

@@ -0,0 +1,5 @@
+import type { FilterOperator } from '../../types';
+import type { ParserState } from './types';
+export declare const validateField: (s: ParserState, name: string) => void;
+export declare const validateOperator: (s: ParserState, op: string, fieldName: string) => FilterOperator;
+export declare const validateValues: (s: ParserState, fieldName: string, values: Array<string | number>) => void;

package/dist/components/FilterInput/lib/parseExpression/validators.js

@@ -0,0 +1,28 @@
+import { FilterParseError } from "./error.js";
+import { OPERATORS } from "./tokenizer.js";
+const validateField = (s, name)=>{
+    if (!s.fields.some((f)=>f.name === name)) throw FilterParseError(`Unknown field: ${name}`);
+};
+const validateOperator = (s, op, fieldName)=>{
+    if (!OPERATORS.has(op)) throw FilterParseError(`Unknown operator: ${op}`);
+    const field = s.fields.find((f)=>f.name === fieldName);
+    if (field?.operators && !field.operators.includes(op)) throw FilterParseError(`Operator '${op}' is not allowed for field '${fieldName}'`);
+    return op;
+};
+const getAllowedValues = (field)=>{
+    if (field.values && field.values.length > 0) return new Set(field.values.map((v)=>String(v.value)));
+    if (field.options && field.options.length > 0) return new Set(field.options);
+    return null;
+};
+const validateValues = (s, fieldName, values)=>{
+    const field = s.fields.find((f)=>f.name === fieldName);
+    if (!field) return;
+    const allowed = getAllowedValues(field);
+    if (!allowed) return;
+    const invalid = values.filter((v)=>!allowed.has(String(v)));
+    if (invalid.length > 0) {
+        const formatted = invalid.map((v)=>`"${v}"`).join(', ');
+        throw FilterParseError(`Invalid value ${formatted} for field '${fieldName}'`);
+    }
+};
+export { validateField, validateOperator, validateValues };

package/dist/components/FilterInput/lib/serializeExpression.d.ts

@@ -0,0 +1,6 @@
+import type { ExprNode } from '../types';
+/**
+ * Serialize an expression tree to a canonical text string.
+ * Top-level conditions are sorted alphabetically by field name.
+ */
+export declare const serializeExpression: (expr: ExprNode | null) => string;

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

@@ -0,0 +1,36 @@
+const serializeValue = (condition)=>{
+    if ('is_null' === condition.operator || 'is_not_null' === condition.operator) return '';
+    if (Array.isArray(condition.value)) {
+        const parts = condition.value.map(String);
+        return `[${parts.join(', ')}]`;
+    }
+    return String(condition.value ?? '');
+};
+const serializeCondition = (condition)=>{
+    const field = condition.field;
+    const operator = condition.operator ?? '=';
+    const value = serializeValue(condition);
+    if ('is_null' === operator || 'is_not_null' === operator) return `(${field} ${operator})`;
+    return `(${field} ${operator} ${value})`;
+};
+const sortConditions = (children)=>[
+        ...children
+    ].sort((a, b)=>{
+        const aField = 'condition' === a.type ? a.field : '';
+        const bField = 'condition' === b.type ? b.field : '';
+        return aField.localeCompare(bField);
+    });
+const serializeGroup = (group, isTopLevel)=>{
+    const children = isTopLevel ? sortConditions(group.children) : group.children;
+    const connector = 'or' === group.operator ? ' OR ' : ' AND ';
+    return children.map((child)=>serializeNode(child, false)).join(connector);
+};
+const serializeNode = (node, isTopLevel)=>{
+    if ('condition' === node.type) return serializeCondition(node);
+    return serializeGroup(node, isTopLevel);
+};
+const serializeExpression = (expr)=>{
+    if (!expr) return '';
+    return serializeNode(expr, true);
+};
+export { serializeExpression };

package/dist/metadata/components.json

@@ -1,6 +1,6 @@
 {
-  "version": "0.19.1",
-  "generatedAt": "2026-04-03T12:43:34.959Z",
+  "version": "0.20.0",
+  "generatedAt": "2026-04-07T08:00:47.141Z",
   "components": [
     {
       "name": "Alert",
@@ -12833,41 +12833,35 @@
     },
     {
       "name": "FilterInput",
-      "description": "FilterInput - Self-contained filter component.\nHandles autocomplete flow (field → operator → value), chip creation, and expression management.\nSupports multiple conditions joined by AND/OR connectors.\nJust pass `fields` config from backend API and it works.",
       "importPath": "@wallarm-org/design-system/FilterInput",
       "props": [
         {
           "name": "fields",
           "type": "FieldMetadata[] | undefined",
           "required": false,
-          "description": "Available fields from backend API config",
           "defaultValue": "[]"
         },
         {
           "name": "value",
           "type": "ExprNode | null | undefined",
-          "required": false,
-          "description": "Current filter expression value (controlled mode)"
+          "required": false
         },
         {
           "name": "placeholder",
           "type": "string | undefined",
           "required": false,
-          "description": "Placeholder text to display when field is empty",
           "defaultValue": "Type to filter..."
         },
         {
           "name": "error",
           "type": "boolean | undefined",
           "required": false,
-          "description": "Whether the field has a validation error",
           "defaultValue": "false"
         },
         {
           "name": "showKeyboardHint",
           "type": "boolean | undefined",
           "required": false,
-          "description": "Whether to show the keyboard hint (⌘K or Ctrl+K)",
           "defaultValue": "false"
         },
         {

package/package.json

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