react-conditional-ui 1.2.0 → 1.2.1

package/dist/index.cjs

@@ -33,9 +33,14 @@ __export(index_exports, {
   ConditionDataProvider: () => ConditionDataProvider,
   ConditionParser: () => ConditionDataProvider,
   ConditionalUI: () => ConditionalUI,
+  ControlledInput: () => ControlledInput,
+  ControlledOutput: () => ControlledOutput,
   DEFAULT_OPERATORS: () => DEFAULT_OPERATORS,
   Input: () => Input,
+  ManagedInput: () => ManagedInput,
+  ManagedOutput: () => ManagedOutput,
   Output: () => Output,
+  ReadOnlyOutput: () => ReadOnlyOutput,
   useConditionDataProvider: () => useConditionDataProvider,
   useConditionalInput: () => useConditionalInput,
   useConditionalOutput: () => useConditionalOutput
@@ -45,8 +50,11 @@ module.exports = __toCommonJS(index_exports);
 // src/components/Input.tsx
 var import_react3 = require("react");
 var import_TextField = __toESM(require("@mui/material/TextField"), 1);
+var import_ClickAwayListener = __toESM(require("@mui/material/ClickAwayListener"), 1);
 var import_InputAdornment = __toESM(require("@mui/material/InputAdornment"), 1);
 var import_IconButton = __toESM(require("@mui/material/IconButton"), 1);
+var import_Stack = __toESM(require("@mui/material/Stack"), 1);
+var import_Add = __toESM(require("@mui/icons-material/Add"), 1);
 var import_KeyboardReturn = __toESM(require("@mui/icons-material/KeyboardReturn"), 1);
 var import_ErrorOutline = __toESM(require("@mui/icons-material/ErrorOutline"), 1);
 var import_Tooltip = __toESM(require("@mui/material/Tooltip"), 1);
@@ -203,74 +211,70 @@ var import_debug = __toESM(require("debug"), 1);
 var BASE = "react-conditional-ui";
 var createLogger = (namespace) => (0, import_debug.default)(`${BASE}:${namespace}`);
 
-// src/fuzzy/match-engine.ts
-var log = createLogger("match-engine");
-var valueLog = createLogger("value");
+// src/fuzzy/operator-policy.ts
 var TYPE_ALLOWED_OPS = {
   number: /* @__PURE__ */ new Set(["eq", "ne", "gt", "lt", "gte", "lte"]),
   enum: /* @__PURE__ */ new Set(["eq", "ne"]),
   text: /* @__PURE__ */ new Set(["eq", "ne", "contains", "starts_with"])
 };
+function allowedOperatorsForField(field, allOperators) {
+  if (field.operators) return field.operators;
+  if (field.type) {
+    const allowed = TYPE_ALLOWED_OPS[field.type];
+    return allOperators.filter((op) => allowed.has(op.value));
+  }
+  return allOperators;
+}
+
+// src/fuzzy/match-engine.ts
+var log = createLogger("match-engine");
+var valueLog = createLogger("value");
+var FUSE_THRESHOLD = 0.4;
+var OPERATOR_ALIAS_MIN_COVERAGE = 0.5;
 var MatchEngine = class _MatchEngine {
   constructor(fields, operators) {
     this.fields = fields;
     this.operators = operators;
     this.fieldFuse = new import_fuse.default(fields, {
       keys: ["label"],
-      threshold: 0.4,
-      includeScore: true
-    });
-    const flatAliases = operators.flatMap(
-      (op) => op.aliases.map((alias) => ({ alias: alias.toLowerCase(), operator: op }))
-    );
-    this.opFuse = new import_fuse.default(flatAliases, {
-      keys: ["alias"],
-      threshold: 0.4,
+      threshold: FUSE_THRESHOLD,
       includeScore: true
     });
+    this.opFuse = this.createOperatorAliasFuse(operators);
     this.perFieldOpFuse = /* @__PURE__ */ new Map();
     for (const field of fields) {
       const restricted = this.resolveOpsForField(field, operators);
       if (restricted !== operators) {
-        const aliases = restricted.flatMap(
-          (op) => op.aliases.map((alias) => ({ alias: alias.toLowerCase(), operator: op }))
-        );
-        this.perFieldOpFuse.set(
-          field.value,
-          new import_fuse.default(aliases, { keys: ["alias"], threshold: 0.4, includeScore: true })
-        );
+        this.perFieldOpFuse.set(field.value, this.createOperatorAliasFuse(restricted));
       }
     }
   }
   matchField(candidate) {
     const results = this.fieldFuse.search(candidate);
-    if (results.length > 0 && (results[0].score ?? 1) <= 0.4) {
-      log(
-        "field match: %s -> %s (score: %f)",
-        candidate,
-        results[0].item.value,
-        results[0].score
-      );
-      return { option: results[0].item, score: results[0].score ?? 1 };
+    const best = results[0];
+    if (best && _MatchEngine.isWithinThreshold(best.score)) {
+      log("field match: %s -> %s (score: %f)", candidate, best.item.value, best.score);
+      return { option: best.item, score: best.score ?? 1 };
     }
     return null;
   }
   matchOperator(candidate, field) {
     const fuse = (field && this.perFieldOpFuse.get(field.value)) ?? this.opFuse;
     const results = fuse.search(candidate);
-    if (results.length > 0 && (results[0].score ?? 1) <= 0.4) {
-      const alias = results[0].item.alias;
+    const best = results[0];
+    if (best && _MatchEngine.isWithinThreshold(best.score)) {
+      const alias = best.item.alias;
       const candidateWords = candidate.split(/\s+/).length;
       const aliasWords = alias.split(/\s+/).length;
       if (candidateWords !== aliasWords) return null;
-      if (candidate.length < alias.length * 0.5) return null;
+      if (candidate.length < alias.length * OPERATOR_ALIAS_MIN_COVERAGE) return null;
       log(
         "operator match: %s -> %s (score: %f)",
         candidate,
-        results[0].item.operator.value,
-        results[0].score
+        best.item.operator.value,
+        best.score
       );
-      return { option: results[0].item.operator, score: results[0].score ?? 1 };
+      return { option: best.item.operator, score: best.score ?? 1 };
     }
     return null;
   }
@@ -305,18 +309,14 @@ var MatchEngine = class _MatchEngine {
     if (raw.length === 0) return Value.invalid(raw, "Value not recognized");
     const fuse = new import_fuse.default(knownValues, {
       keys: ["label", "value"],
-      threshold: 0.4,
+      threshold: FUSE_THRESHOLD,
       includeScore: true
     });
     const results = fuse.search(raw);
-    if (results.length > 0 && (results[0].score ?? 1) <= 0.4) {
-      valueLog(
-        "fuzzy match: raw=%s -> %s (score: %f)",
-        raw,
-        results[0].item.value,
-        results[0].score
-      );
-      return _MatchEngine.applyValidator(raw, results[0].item, validateValue);
+    const best = results[0];
+    if (best && _MatchEngine.isWithinThreshold(best.score)) {
+      valueLog("fuzzy match: raw=%s -> %s (score: %f)", raw, best.item.value, best.score);
+      return _MatchEngine.applyValidator(raw, best.item, validateValue);
     }
     valueLog("no match: raw=%s", raw);
     return Value.invalid(raw, "Value not recognized");
@@ -329,51 +329,22 @@ var MatchEngine = class _MatchEngine {
     return Value.valid(raw, matched);
   }
   resolveOpsForField(field, allOps) {
-    if (field.operators) return field.operators;
-    if (field.type) {
-      const allowed = TYPE_ALLOWED_OPS[field.type];
-      return allOps.filter((op) => allowed.has(op.value));
-    }
-    return allOps;
+    return allowedOperatorsForField(field, allOps);
   }
-};
-
-// src/fuzzy/score.ts
-var AMBIGUOUS_OP_WORDS = /* @__PURE__ */ new Set(["is", "has"]);
-var AMBIGUITY_PENALTY = 0.35;
-var LINKING_VERB_PENALTY = 0.35;
-var LENGTH_BONUS_PER_WORD = 0.01;
-var GAP_PENALTY_PER_WORD = 0.3;
-var UNPARSED_PENALTY = 10;
-var FREETEXT_WORD_COST = 0.1;
-function adjustOperatorScore(baseScore, words, start, end) {
-  let score = baseScore;
-  const firstWord = words[start];
-  if (end - start === 1 && AMBIGUOUS_OP_WORDS.has(firstWord)) {
-    score += AMBIGUITY_PENALTY;
-  } else if (end - start > 1 && AMBIGUOUS_OP_WORDS.has(firstWord)) {
-    score += LINKING_VERB_PENALTY;
-  }
-  score -= (end - start) * LENGTH_BONUS_PER_WORD;
-  if (start > 0) {
-    score += start * GAP_PENALTY_PER_WORD;
+  createOperatorAliasFuse(operators) {
+    const aliases = operators.flatMap(
+      (op) => op.aliases.map((alias) => ({ alias: alias.toLowerCase(), operator: op }))
+    );
+    return new import_fuse.default(aliases, {
+      keys: ["alias"],
+      threshold: FUSE_THRESHOLD,
+      includeScore: true
+    });
   }
-  return score;
-}
-function scoreConditions(conditions, segmentCount) {
-  const unparsed = segmentCount - conditions.length;
-  let score = unparsed * UNPARSED_PENALTY;
-  for (const c of conditions) {
-    score += c.score;
-    if (!c.field.isValid) score += UNPARSED_PENALTY;
-    if (!c.operator.isValid) score += UNPARSED_PENALTY;
-    if (!c.value.isValid) score += UNPARSED_PENALTY;
-    if (c.value.isValid && c.value.matchedOption === null) {
-      score += c.value.raw.split(/\s+/).length * FREETEXT_WORD_COST;
-    }
+  static isWithinThreshold(score) {
+    return (score ?? 1) <= FUSE_THRESHOLD;
   }
-  return score;
-}
+};
 
 // src/fuzzy/word-utils.ts
 var NOISE_WORDS = /* @__PURE__ */ new Set([
@@ -443,18 +414,113 @@ function stripLeadingNoise(words) {
   return result;
 }
 
+// src/fuzzy/score.ts
+var AMBIGUOUS_OP_WORDS = /* @__PURE__ */ new Set(["is", "has"]);
+var AMBIGUITY_PENALTY = 0.35;
+var LINKING_VERB_PENALTY = 0.35;
+var LENGTH_BONUS_PER_WORD = 0.01;
+var GAP_PENALTY_PER_WORD = 0.3;
+var UNPARSED_PENALTY = 10;
+var FREETEXT_WORD_COST = 0.1;
+function adjustOperatorScore(baseScore, words, start, end) {
+  let score = baseScore;
+  const firstWord = words[start];
+  if (end - start === 1 && AMBIGUOUS_OP_WORDS.has(firstWord)) {
+    score += AMBIGUITY_PENALTY;
+  } else if (end - start > 1 && AMBIGUOUS_OP_WORDS.has(firstWord)) {
+    score += LINKING_VERB_PENALTY;
+  }
+  score -= (end - start) * LENGTH_BONUS_PER_WORD;
+  if (start > 0) {
+    score += start * GAP_PENALTY_PER_WORD;
+  }
+  return score;
+}
+function scoreConditions(conditions, segmentCount) {
+  const unparsed = segmentCount - conditions.length;
+  let score = unparsed * UNPARSED_PENALTY;
+  for (const c of conditions) {
+    score += c.score;
+    if (!c.field.isValid) score += UNPARSED_PENALTY;
+    if (!c.operator.isValid) score += UNPARSED_PENALTY;
+    if (!c.value.isValid) score += UNPARSED_PENALTY;
+    if (c.value.isValid && c.value.matchedOption === null) {
+      score += c.value.raw.split(/\s+/).length * FREETEXT_WORD_COST;
+    }
+  }
+  return score;
+}
+
+// src/conditions/query-helper.ts
+var ConditionQueryHelper = class {
+  constructor(engine, fields, operators) {
+    this.engine = engine;
+    this.fields = fields;
+    this.operators = operators;
+  }
+  getFields() {
+    return this.fields;
+  }
+  findFieldByValue(value) {
+    return this.fields.find((field) => field.value === value);
+  }
+  identifyField(words) {
+    let best = null;
+    for (let i = words.length; i >= 1; i--) {
+      const candidate = words.slice(0, i).join(" ");
+      const match = this.engine.matchField(candidate);
+      if (match && (!best || match.score < best.match.score)) {
+        best = { candidate, match, wordCount: i };
+      }
+    }
+    if (!best) return null;
+    return {
+      raw: best.candidate,
+      fieldOption: best.match.option,
+      fieldScore: best.match.score,
+      remaining: words.slice(best.wordCount)
+    };
+  }
+  getOperatorCandidates(words, fieldOption) {
+    const candidates = [];
+    for (let start = 0; start < words.length; start++) {
+      for (let end = start + 1; end <= words.length; end++) {
+        const opRaw = words.slice(start, end).join(" ");
+        const opMatch = this.engine.matchOperator(opRaw, fieldOption);
+        if (!opMatch) continue;
+        candidates.push({
+          match: opMatch,
+          raw: opRaw,
+          endIdx: end,
+          adjustedScore: adjustOperatorScore(opMatch.score, words, start, end)
+        });
+      }
+    }
+    candidates.sort((a, b) => a.adjustedScore - b.adjustedScore);
+    return candidates;
+  }
+  allowedOpsForField(field) {
+    return allowedOperatorsForField(field, this.operators);
+  }
+  prefixMatches(partial, candidates, limit = 6) {
+    const lower = partial.toLowerCase();
+    const results = [];
+    for (const candidate of candidates) {
+      const cl = candidate.toLowerCase();
+      if (cl.startsWith(lower) && cl !== lower) {
+        results.push({ completion: cl.slice(lower.length), display: candidate });
+        if (results.length >= limit) break;
+      }
+    }
+    return results;
+  }
+};
+
 // src/conditions/parser.ts
 var log2 = createLogger("parser");
-var TYPE_ALLOWED_OPS2 = {
-  number: /* @__PURE__ */ new Set(["eq", "ne", "gt", "lt", "gte", "lte"]),
-  enum: /* @__PURE__ */ new Set(["eq", "ne"]),
-  text: /* @__PURE__ */ new Set(["eq", "ne", "contains", "starts_with"])
-};
 var ConditionParser = class {
-  constructor(engine) {
-    this.fields = engine.fields;
-    this.operators = engine.operators;
-    this.engine = engine;
+  constructor(engine, queryHelper) {
+    this.query = queryHelper ?? new ConditionQueryHelper(engine, engine.fields, engine.operators);
   }
   parse(text) {
     const input = text.trim().toLowerCase();
@@ -462,11 +528,15 @@ var ConditionParser = class {
     const allWords = input.split(/\s+/);
     const words = stripLeadingNoise(allWords);
     if (words.length === 0) return null;
-    const fieldResult = this.identifyField(words);
+    const fieldResult = this.query.identifyField(words);
     if (!fieldResult) return null;
     if (fieldResult.remaining.length === 0) {
       return {
-        field: fieldResult.field,
+        field: new Field(
+          fieldResult.raw,
+          fieldResult.fieldOption.value,
+          fieldResult.fieldOption.label
+        ),
         operator: Operator.invalid(""),
         value: Value.empty(),
         score: fieldResult.fieldScore
@@ -477,7 +547,11 @@ var ConditionParser = class {
       fieldResult.fieldOption
     );
     const result = {
-      field: fieldResult.field,
+      field: new Field(
+        fieldResult.raw,
+        fieldResult.fieldOption.value,
+        fieldResult.fieldOption.label
+      ),
       operator,
       value,
       score: fieldResult.fieldScore + operatorScore
@@ -497,40 +571,8 @@ var ConditionParser = class {
     );
     return result;
   }
-  identifyField(words) {
-    let best = null;
-    for (let i = words.length; i >= 1; i--) {
-      const candidate = words.slice(0, i).join(" ");
-      const match = this.engine.matchField(candidate);
-      if (match && (!best || match.score < best.match.score)) {
-        best = { candidate, match, wordCount: i };
-      }
-    }
-    if (!best) return null;
-    return {
-      field: new Field(best.candidate, best.match.option.value, best.match.option.label),
-      fieldOption: best.match.option,
-      fieldScore: best.match.score,
-      remaining: words.slice(best.wordCount)
-    };
-  }
-  getOperatorCandidates(words, fieldOption) {
-    const candidates = [];
-    for (let start = 0; start < words.length; start++) {
-      for (let end = start + 1; end <= words.length; end++) {
-        const opRaw = words.slice(start, end).join(" ");
-        const opMatch = this.engine.matchOperator(opRaw, fieldOption);
-        if (!opMatch) continue;
-        const adjustedScore = adjustOperatorScore(opMatch.score, words, start, end);
-        candidates.push({
-          match: opMatch,
-          raw: opRaw,
-          endIdx: end,
-          adjustedScore
-        });
-      }
-    }
-    candidates.sort((a, b) => a.adjustedScore - b.adjustedScore);
+  resolveOperator(words, fieldOption) {
+    const candidates = this.query.getOperatorCandidates(words, fieldOption);
     if (candidates.length > 0) {
       log2(
         "operator candidates: %o",
@@ -539,10 +581,6 @@ var ConditionParser = class {
         )
       );
     }
-    return candidates;
-  }
-  resolveOperator(words, fieldOption) {
-    const candidates = this.getOperatorCandidates(words, fieldOption);
     if (candidates.length === 0) {
       return {
         operator: Operator.invalid(words.join(" ")),
@@ -577,33 +615,6 @@ var ConditionParser = class {
       operatorScore: best.adjustedScore
     };
   }
-  resolveOpsForField(field, allOps) {
-    if (field.operators) return field.operators;
-    if (field.type) {
-      const allowed = TYPE_ALLOWED_OPS2[field.type];
-      return allOps.filter((op) => allowed.has(op.value));
-    }
-    return allOps;
-  }
-  allowedOpsForField(field) {
-    return this.resolveOpsForField(field, this.operators);
-  }
-  prefixMatch(partial, candidates) {
-    const matches = this.prefixMatches(partial, candidates);
-    return matches.length > 0 ? matches[0] : null;
-  }
-  prefixMatches(partial, candidates, limit = 6) {
-    const lower = partial.toLowerCase();
-    const results = [];
-    for (const candidate of candidates) {
-      const cl = candidate.toLowerCase();
-      if (cl.startsWith(lower) && cl !== lower) {
-        results.push({ completion: cl.slice(lower.length), display: candidate });
-        if (results.length >= limit) break;
-      }
-    }
-    return results;
-  }
 };
 
 // src/consts.ts
@@ -612,8 +623,8 @@ var OR_CONJUNCTION = "or";
 
 // src/fuzzy/providers/suggestions.ts
 var SuggestionsProvider = class {
-  constructor(parser, segmentResolver) {
-    this.parser = parser;
+  constructor(query, segmentResolver) {
+    this.query = query;
     this.segmentResolver = segmentResolver;
   }
   getCompletions(text, limit = 6) {
@@ -639,40 +650,40 @@ var SuggestionsProvider = class {
   completionsForSegment(text, limit) {
     const input = text.trimStart().toLowerCase();
     if (!input) {
-      return this.parser.fields.slice(0, limit).map((f) => ({ completion: f.label, display: f.label }));
+      return this.query.getFields().slice(0, limit).map((f) => ({ completion: f.label, display: f.label }));
     }
     const endsWithSpace = /\s$/.test(input);
     const words = input.split(/\s+/).filter(Boolean);
     if (words.length === 0) return [];
-    const fieldResult = this.parser.identifyField(words);
+    const fieldResult = this.query.identifyField(words);
     if (!fieldResult) {
       if (endsWithSpace) return [];
-      return this.parser.prefixMatches(
+      return this.query.prefixMatches(
         words.join(" "),
-        this.parser.fields.map((f) => f.label),
+        this.query.getFields().map((f) => f.label),
         limit
       );
     }
     const fieldOption = fieldResult.fieldOption;
     if (fieldResult.remaining.length === 0) {
       if (endsWithSpace) {
-        const ops = this.parser.allowedOpsForField(fieldOption);
+        const ops = this.query.allowedOpsForField(fieldOption);
         return ops.slice(0, limit).map((op) => ({ completion: op.label, display: op.label }));
       }
-      return this.parser.prefixMatches(
+      return this.query.prefixMatches(
         words.join(" "),
-        this.parser.fields.map((f) => f.label),
+        this.query.getFields().map((f) => f.label),
         limit
       );
     }
-    const candidates = this.parser.getOperatorCandidates(fieldResult.remaining, fieldOption);
+    const candidates = this.query.getOperatorCandidates(fieldResult.remaining, fieldOption);
     const bestOp = candidates[0];
     if (!bestOp || bestOp.endIdx > fieldResult.remaining.length) {
       if (endsWithSpace) return [];
-      const ops = this.parser.allowedOpsForField(fieldOption);
+      const ops = this.query.allowedOpsForField(fieldOption);
       const aliases = ops.flatMap((op) => op.aliases);
       const opPartial = fieldResult.remaining.join(" ");
-      return this.parser.prefixMatches(opPartial, aliases, limit);
+      return this.query.prefixMatches(opPartial, aliases, limit);
     }
     const valueRaw = fieldResult.remaining.slice(bestOp.endIdx).join(" ");
     if (!valueRaw) {
@@ -681,15 +692,15 @@ var SuggestionsProvider = class {
         if (!fieldValues2?.length) return [];
         return fieldValues2.slice(0, limit).map((v) => ({ completion: v.label, display: v.label }));
       }
-      const ops = this.parser.allowedOpsForField(fieldOption);
+      const ops = this.query.allowedOpsForField(fieldOption);
       const aliases = ops.flatMap((op) => op.aliases);
       const opPartial = fieldResult.remaining.join(" ");
-      return this.parser.prefixMatches(opPartial, aliases, limit);
+      return this.query.prefixMatches(opPartial, aliases, limit);
     }
     if (endsWithSpace) return [];
     const fieldValues = fieldOption.fieldValues;
     if (!fieldValues?.length) return [];
-    return this.parser.prefixMatches(
+    return this.query.prefixMatches(
       valueRaw,
       fieldValues.map((v) => v.label),
       limit
@@ -714,8 +725,8 @@ var SuggestionsProvider = class {
 
 // src/fuzzy/providers/diagnostics.ts
 var DiagnosticsProvider = class {
-  constructor(parser, segmentResolver) {
-    this.parser = parser;
+  constructor(query, segmentResolver) {
+    this.query = query;
     this.segmentResolver = segmentResolver;
   }
   diagnose(text) {
@@ -742,9 +753,7 @@ var DiagnosticsProvider = class {
       }
       if (!condition.operator.isValid) {
         const fieldEnd = offset + condition.field.raw.length;
-        const fieldConfig = this.parser.fields.find(
-          (f) => f.value === condition.field.value
-        );
+        const fieldConfig = this.query.findFieldByValue(condition.field.value);
         const hasRestriction = fieldConfig?.operators || fieldConfig?.type;
         diagnostics.push({
           start: fieldEnd,
@@ -793,60 +802,26 @@ var SegmentResolver = class {
   resolve(text) {
     const originalWords = text.split(/\s+/);
     const lowerWords = originalWords.map((w) => w.toLowerCase());
-    const conjIndices = [];
-    for (let i = 0; i < lowerWords.length; i++) {
-      if (lowerWords[i] === AND_CONJUNCTION || lowerWords[i] === OR_CONJUNCTION) {
-        conjIndices.push({ index: i, conjunction: lowerWords[i] });
-      }
-    }
+    const conjIndices = this.findConjunctionIndices(lowerWords);
+    const fallback = this.createSingleCandidate(text);
     if (conjIndices.length === 0) {
-      const single = this.parser.parse(text);
-      return {
-        segments: [text],
-        conditions: single ? [single] : [],
-        connector: AND_CONJUNCTION
-      };
+      return fallback;
     }
-    const noSplit = this.parser.parse(text);
-    let best = {
-      segments: [text],
-      conditions: noSplit ? [noSplit] : [],
-      connector: AND_CONJUNCTION
-    };
+    let best = fallback;
     let bestScore = scoreConditions(best.conditions, 1);
     for (const subset of powerSet(conjIndices)) {
       const connector = subset[0].conjunction;
       if (subset.some((s) => s.conjunction !== connector)) continue;
-      const splitIndices = subset.map((s) => s.index);
-      const segments = splitAtIndices(originalWords, splitIndices);
-      if (segments.some((s) => !s)) continue;
-      const conditions = this.parseSegments(segments);
+      const next = this.buildSplitCandidate(originalWords, subset, connector);
+      if (!next) continue;
+      const { segments, conditions } = next;
       const score = scoreConditions(conditions, segments.length);
       if (score < bestScore) {
         bestScore = score;
         best = { segments, conditions, connector };
       }
     }
-    if (best.conditions.length === 1 && best.conditions[0].value.isValid && best.conditions[0].value.matchedOption === null) {
-      const valueWords = best.conditions[0].value.raw.split(/\s+/);
-      const conjInValue = valueWords.find(
-        (w) => w.toLowerCase() === AND_CONJUNCTION || w.toLowerCase() === OR_CONJUNCTION
-      );
-      if (conjInValue) {
-        const connector = conjInValue.toLowerCase();
-        const matching = conjIndices.filter((c) => c.conjunction === connector);
-        for (const subset of powerSet(matching).reverse()) {
-          const splitIndices = subset.map((s) => s.index);
-          const segments = splitAtIndices(originalWords, splitIndices);
-          if (segments.some((s) => !s)) continue;
-          const conditions = this.parseSegments(segments);
-          if (conditions.length === segments.length && conditions.every((c) => c.field.isValid && c.operator.isValid)) {
-            return { segments, conditions, connector };
-          }
-        }
-      }
-    }
-    return best;
+    return this.trySplitFromValueConjunction(best, originalWords, conjIndices) ?? best;
   }
   parseConditions(text) {
     const input = text.trim();
@@ -869,6 +844,54 @@ var SegmentResolver = class {
     }
     return conditions;
   }
+  createSingleCandidate(text) {
+    const parsed = this.parser.parse(text);
+    return {
+      segments: [text],
+      conditions: parsed ? [parsed] : [],
+      connector: AND_CONJUNCTION
+    };
+  }
+  findConjunctionIndices(words) {
+    const indices = [];
+    for (let i = 0; i < words.length; i++) {
+      if (words[i] === AND_CONJUNCTION || words[i] === OR_CONJUNCTION) {
+        indices.push({ index: i, conjunction: words[i] });
+      }
+    }
+    return indices;
+  }
+  buildSplitCandidate(originalWords, splitPoints, connector) {
+    const splitIndices = splitPoints.map((s) => s.index);
+    const segments = splitAtIndices(originalWords, splitIndices);
+    if (segments.some((s) => !s)) return null;
+    return {
+      segments,
+      conditions: this.parseSegments(segments),
+      connector
+    };
+  }
+  trySplitFromValueConjunction(best, originalWords, conjIndices) {
+    const onlyCondition = best.conditions[0];
+    if (best.conditions.length !== 1 || !onlyCondition?.value.isValid || onlyCondition.value.matchedOption !== null) {
+      return null;
+    }
+    const valueWords = onlyCondition.value.raw.split(/\s+/);
+    const conjInValue = valueWords.find(
+      (w) => w.toLowerCase() === AND_CONJUNCTION || w.toLowerCase() === OR_CONJUNCTION
+    );
+    if (!conjInValue) return null;
+    const connector = conjInValue.toLowerCase();
+    const matching = conjIndices.filter((c) => c.conjunction === connector);
+    for (const subset of powerSet(matching).reverse()) {
+      const candidate = this.buildSplitCandidate(originalWords, subset, connector);
+      if (!candidate) continue;
+      if (candidate.conditions.length === candidate.segments.length && candidate.conditions.every((c) => c.field.isValid && c.operator.isValid)) {
+        return candidate;
+      }
+    }
+    return null;
+  }
   getInherited(segment, previous) {
     if (!previous) return null;
     const direct = this.parser.parse(segment);
@@ -893,10 +916,11 @@ var SegmentResolver = class {
 var ConditionDataProvider = class {
   constructor(fields, operators) {
     const engine = new MatchEngine(fields, operators);
-    const parser = new ConditionParser(engine);
+    const query = new ConditionQueryHelper(engine, fields, operators);
+    const parser = new ConditionParser(engine, query);
     this.segments = new SegmentResolver(parser);
-    this.suggestions = new SuggestionsProvider(parser, this.segments);
-    this.diagnostics = new DiagnosticsProvider(parser, this.segments);
+    this.suggestions = new SuggestionsProvider(query, this.segments);
+    this.diagnostics = new DiagnosticsProvider(query, this.segments);
   }
   parseComplexCondition(text) {
     return this.segments.parseConditions(text);
@@ -979,9 +1003,12 @@ function useConditionalInput({
 // src/components/Input.tsx
 var import_jsx_runtime = require("react/jsx-runtime");
 function Input(props) {
-  if (isStandalone(props)) {
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StandaloneInput, { ...props });
+  if (isManaged(props)) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ManagedInput, { ...props });
   }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ControlledInput, { ...props });
+}
+function ControlledInput(props) {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     InputView,
     {
@@ -997,7 +1024,7 @@ function Input(props) {
     }
   );
 }
-function isStandalone(props) {
+function isManaged(props) {
   return props.fields !== void 0;
 }
 function buildOverlaySegments(value, diagnostics) {
@@ -1046,7 +1073,7 @@ var GhostInput = (0, import_react3.forwardRef)(function GhostInput2({ ghost, dia
     ) })
   ] });
 });
-function StandaloneInput({
+function ManagedInput({
   fields,
   operators,
   value: controlledValue,
@@ -1082,7 +1109,7 @@ function InputView({
   value,
   onChange,
   onSubmit,
-  placeholder = "e.g. age greater than 18, ctrl+space for suggestions",
+  placeholder = "e.g. age greater than 18 \u2014 Control(Option)+Space for suggestions",
   getSuggestion,
   getCompletions,
   diagnostics = [],
@@ -1093,11 +1120,17 @@ function InputView({
   const [activeIndex, setActiveIndex] = (0, import_react3.useState)(-1);
   const [cursorLeft, setCursorLeft] = (0, import_react3.useState)(0);
   const listRef = (0, import_react3.useRef)(null);
+  const inputRef = (0, import_react3.useRef)(null);
   const ghost = getSuggestion && value ? getSuggestion(value)?.completion ?? null : null;
   function closeCompletions() {
     setCompletions([]);
     setActiveIndex(-1);
   }
+  function handleCompletionsClickAway() {
+    if (completions.length === 0) return;
+    closeCompletions();
+    queueMicrotask(() => inputRef.current?.focus());
+  }
   function openCompletions() {
     if (!getCompletions) return;
     const items = getCompletions(value);
@@ -1116,7 +1149,9 @@ function InputView({
     if (ghost) onChange(value + ghost);
   }
   function handleKeyDown(e) {
-    if (e.key === " " && e.ctrlKey) {
+    const isSpace = e.key === " " || e.code === "Space";
+    const suggestChord = isSpace && !e.shiftKey && !e.metaKey && (e.ctrlKey || e.altKey);
+    if (suggestChord) {
       e.preventDefault();
       openCompletions();
       return;
@@ -1174,66 +1209,106 @@ function InputView({
     inputValue: value,
     onCursorOffset: setCursorLeft
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: ["rcui-input-wrapper", className].filter(Boolean).join(" "), style, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      import_TextField.default,
-      {
-        fullWidth: true,
-        variant: "outlined",
-        size: "small",
-        placeholder,
-        value,
-        onChange: handleChange,
-        onKeyDown: handleKeyDown,
-        onBlur: () => setTimeout(closeCompletions, 150),
-        className: "rcui-input",
-        slotProps: {
-          input: {
-            inputComponent: GhostInput,
-            inputProps: ghostInputProps,
-            endAdornment: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_InputAdornment.default, { position: "end", children: hasErrors ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Tooltip.default, { title: errorSummary, arrow: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_IconButton.default, { size: "small", onClick: onSubmit, edge: "end", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-              import_ErrorOutline.default,
-              {
-                fontSize: "small",
-                className: "rcui-adornment-error"
-              }
-            ) }) }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_IconButton.default, { size: "small", onClick: onSubmit, edge: "end", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-              import_KeyboardReturn.default,
-              {
-                fontSize: "small",
-                className: "rcui-adornment-enter"
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ClickAwayListener.default, { onClickAway: handleCompletionsClickAway, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "div",
+    {
+      className: ["rcui-input-wrapper", className].filter(Boolean).join(" "),
+      style,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_TextField.default,
+          {
+            fullWidth: true,
+            variant: "outlined",
+            size: "small",
+            placeholder,
+            value,
+            onChange: handleChange,
+            onKeyDown: handleKeyDown,
+            className: "rcui-input",
+            slotProps: {
+              input: {
+                inputRef,
+                inputComponent: GhostInput,
+                inputProps: ghostInputProps,
+                endAdornment: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_InputAdornment.default, { position: "end", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_Stack.default, { direction: "row", alignItems: "center", spacing: 0, children: [
+                  getCompletions ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Tooltip.default, { title: "Show suggestions", arrow: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                    import_IconButton.default,
+                    {
+                      size: "small",
+                      "aria-label": "Show suggestions",
+                      className: "rcui-adornment-suggestions",
+                      onMouseDown: (e) => {
+                        e.preventDefault();
+                        openCompletions();
+                      },
+                      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Add.default, { fontSize: "small" })
+                    }
+                  ) }) : null,
+                  hasErrors ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Tooltip.default, { title: errorSummary, arrow: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                    import_IconButton.default,
+                    {
+                      size: "small",
+                      onMouseDown: (e) => e.preventDefault(),
+                      onClick: onSubmit,
+                      edge: "end",
+                      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                        import_ErrorOutline.default,
+                        {
+                          fontSize: "small",
+                          className: "rcui-adornment-error"
+                        }
+                      )
+                    }
+                  ) }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                    import_IconButton.default,
+                    {
+                      size: "small",
+                      onMouseDown: (e) => e.preventDefault(),
+                      onClick: onSubmit,
+                      edge: "end",
+                      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                        import_KeyboardReturn.default,
+                        {
+                          fontSize: "small",
+                          className: "rcui-adornment-enter"
+                        }
+                      )
+                    }
+                  )
+                ] }) })
               }
-            ) }) })
+            }
           }
-        }
-      }
-    ),
-    completions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      "ul",
-      {
-        ref: listRef,
-        className: "rcui-completions",
-        role: "listbox",
-        style: { left: cursorLeft },
-        children: completions.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-          "li",
+        ),
+        completions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "ul",
           {
-            id: `rcui-completion-${i}`,
-            role: "option",
-            "aria-selected": i === activeIndex,
-            className: `rcui-completion-item${i === activeIndex ? " rcui-completion-item--active" : ""}`,
-            onMouseDown: (e) => {
-              e.preventDefault();
-              acceptCompletion(item);
-            },
-            onMouseEnter: () => setActiveIndex(i),
-            children: item.display
-          },
-          item.display
-        ))
-      }
-    )
-  ] });
+            ref: listRef,
+            className: "rcui-completions",
+            role: "listbox",
+            style: { left: cursorLeft },
+            children: completions.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              "li",
+              {
+                id: `rcui-completion-${i}`,
+                role: "option",
+                "aria-selected": i === activeIndex,
+                className: `rcui-completion-item${i === activeIndex ? " rcui-completion-item--active" : ""}`,
+                onMouseDown: (e) => {
+                  e.preventDefault();
+                  acceptCompletion(item);
+                },
+                onMouseEnter: () => setActiveIndex(i),
+                children: item.display
+              },
+              item.display
+            ))
+          }
+        )
+      ]
+    }
+  ) });
 }
 
 // src/components/Output.tsx
@@ -1424,7 +1499,7 @@ var import_react5 = require("react");
 var import_core = require("@dnd-kit/core");
 var import_sortable2 = require("@dnd-kit/sortable");
 
-// src/components/output-drag-end.ts
+// src/dnd/output-drag-end.ts
 var UNGROUP_ZONE_ID = "ungrouped-drop-zone";
 var GROUP_DROPPABLE_PREFIX = "group:";
 function findGroupByEntryId(groups, entryId) {
@@ -1679,20 +1754,91 @@ var DEFAULT_GROUP_CONFIG = {
   removable: true,
   variant: "outlined"
 };
-function Output({
+function Output(props) {
+  if (isManagedOutput(props)) return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ManagedOutput, { ...props });
+  if (isReadOnlyOutput(props)) return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ReadOnlyOutput, { ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ControlledOutput, { ...props });
+}
+function ManagedOutput({
   fields,
   operators,
-  groups: controlledGroups,
   onGroupsChange,
   defaultGroupConfig,
   className,
   style
 }) {
-  const { groups, mutations } = useConditionalOutput({
-    groups: controlledGroups,
-    onGroupsChange
-  });
-  const readOnly = controlledGroups !== void 0 && !onGroupsChange;
+  const { groups, mutations } = useConditionalOutput({ onGroupsChange });
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    OutputView,
+    {
+      groups,
+      mutations,
+      readOnly: false,
+      fields,
+      operators,
+      defaultGroupConfig,
+      className,
+      style
+    }
+  );
+}
+function ControlledOutput({
+  fields,
+  operators,
+  groups,
+  onGroupsChange,
+  defaultGroupConfig,
+  className,
+  style
+}) {
+  const { mutations } = useConditionalOutput({ groups, onGroupsChange });
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    OutputView,
+    {
+      groups,
+      mutations,
+      readOnly: false,
+      fields,
+      operators,
+      defaultGroupConfig,
+      className,
+      style
+    }
+  );
+}
+function ReadOnlyOutput({
+  fields,
+  operators,
+  groups,
+  defaultGroupConfig,
+  className,
+  style
+}) {
+  const { mutations } = useConditionalOutput({ groups });
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    OutputView,
+    {
+      groups,
+      mutations,
+      readOnly: true,
+      fields,
+      operators,
+      defaultGroupConfig,
+      className,
+      style
+    }
+  );
+}
+function OutputView({
+  groups,
+  mutations,
+  readOnly,
+  fields,
+  operators,
+  defaultGroupConfig,
+  className,
+  style
+}) {
   const effectiveDefault = readOnly ? { editable: false, removable: false, ...defaultGroupConfig } : defaultGroupConfig;
   const rootClass = ["rcui-output", className].filter(Boolean).join(" ");
   const renderOverlay = (entry) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "rcui-overlay", children: [
@@ -1726,6 +1872,12 @@ function Output({
     group.id
   )) }) });
 }
+function isManagedOutput(props) {
+  return props.groups === void 0;
+}
+function isReadOnlyOutput(props) {
+  return props.groups !== void 0 && props.onGroupsChange === void 0;
+}
 function resolveConfig(groupConfig, defaultConfig) {
   return { ...DEFAULT_GROUP_CONFIG, ...defaultConfig, ...groupConfig };
 }
@@ -1795,6 +1947,8 @@ function ConditionalUI({
   value,
   onChange,
   onConditionsChange,
+  InputComponent = ManagedInput,
+  OutputComponent = ControlledOutput,
   className,
   style
 }) {
@@ -1804,7 +1958,7 @@ function ConditionalUI({
   const rootClass = ["rcui-root", className].filter(Boolean).join(" ");
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: rootClass, style, children: [
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      Input,
+      InputComponent,
       {
         fields,
         operators,
@@ -1814,7 +1968,7 @@ function ConditionalUI({
       }
     ),
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      Output,
+      OutputComponent,
       {
         groups,
         fields,
@@ -1829,9 +1983,14 @@ function ConditionalUI({
   ConditionDataProvider,
   ConditionParser,
   ConditionalUI,
+  ControlledInput,
+  ControlledOutput,
   DEFAULT_OPERATORS,
   Input,
+  ManagedInput,
+  ManagedOutput,
   Output,
+  ReadOnlyOutput,
   useConditionDataProvider,
   useConditionalInput,
   useConditionalOutput