@limetech/lime-crm-building-blocks 1.139.0 → 1.140.0

package/dist/collection/components/filter-condition-picker/filter-condition-picker.js

@@ -0,0 +1,256 @@
+import { Host, h } from "@stencil/core";
+import { PlatformServiceName, } from "@limetech/lime-web-components";
+import { getConditionsForPropertyType, getFilterConditionIcon, getFilterConditionLabelKey, } from "../filter-chip/filter-condition-icons";
+/**
+ * Accessible label for the control: set for screen readers but hidden visually
+ * (see the stylesheet). Reuses the shared, localized "Operator" label.
+ */
+const LABEL_KEY = 'webclient.operator';
+/**
+ * Filter condition picker
+ *
+ * A dropdown for choosing a single filter condition, such as Is / Is not /
+ * Greater than / Contains / Between / After / Empty / …
+ *
+ * It is presentational and speaks the shared filter vocabulary: give it a
+ * `propertyType` and it lists the right conditions for that data type, each with
+ * the correct icon and localized wording (e.g. `greater-than` reads "Greater
+ * than" for a number but "After" for a date, and `equals` reads "Is" for an
+ * option).
+ *
+ * A consumer that supports only a subset of conditions passes its own
+ * list via `conditions`; the consumer maps its domain operators to and from the
+ * `FilterCondition` values itself.
+ *
+ * @exampleComponent limebb-example-filter-condition-picker-basic
+ * @exampleComponent limebb-example-filter-condition-picker-property-types
+ * @exampleComponent limebb-example-filter-condition-picker-boolean
+ * @exampleComponent limebb-example-filter-condition-picker-custom
+ */
+export class FilterConditionPicker {
+    constructor() {
+        /**
+         * Whether the picker is disabled.
+         */
+        this.disabled = false;
+        this.handleChange = (event) => {
+            event.stopPropagation();
+            if (event.detail) {
+                this.change.emit(event.detail.value);
+            }
+        };
+    }
+    render() {
+        const items = this.buildItems();
+        const selected = this.selectedOption(items);
+        return (h(Host, { key: 'ca926963d368460db20fa8961f49825d19ae2c07' }, h("limel-select", { key: '5571b580b7da63d1a95fef6cb9b204ed3b32cf75', class: "condition", label: this.accessibleLabel, disabled: this.disabled, options: items, value: selected, onChange: this.handleChange })));
+    }
+    buildItems() {
+        var _a;
+        const conditions = (_a = this.conditions) !== null && _a !== void 0 ? _a : getConditionsForPropertyType(this.propertyType);
+        // Divider before the empty / not-empty group and before "matches".
+        const emptyGroupStart = conditions.findIndex((condition) => condition === 'empty' || condition === 'not-empty');
+        const matchesIndex = conditions.indexOf('matches');
+        const items = [];
+        for (const [index, condition] of conditions.entries()) {
+            if (index > 0 &&
+                (index === emptyGroupStart || index === matchesIndex)) {
+                items.push({ separator: true });
+            }
+            items.push({
+                value: condition,
+                text: this.conditionLabel(condition),
+                icon: getFilterConditionIcon(condition, this.propertyType),
+            });
+        }
+        return items;
+    }
+    selectedOption(items) {
+        const options = items.filter((item) => !('separator' in item));
+        return options.find((option) => option.value === this.value);
+    }
+    get accessibleLabel() {
+        var _a;
+        return (_a = this.translate(LABEL_KEY)) !== null && _a !== void 0 ? _a : 'Operator';
+    }
+    conditionLabel(condition) {
+        var _a;
+        const key = getFilterConditionLabelKey(condition, this.propertyType);
+        return (_a = (key ? this.translate(key) : undefined)) !== null && _a !== void 0 ? _a : condition;
+    }
+    translate(key) {
+        var _a;
+        const translated = (_a = this.translator) === null || _a === void 0 ? void 0 : _a.get(key);
+        return translated && translated !== key ? translated : undefined;
+    }
+    get translator() {
+        var _a;
+        try {
+            return (_a = this.platform) === null || _a === void 0 ? void 0 : _a.get(PlatformServiceName.Translate);
+        }
+        catch (_b) {
+            return;
+        }
+    }
+    static get is() { return "limebb-filter-condition-picker"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["filter-condition-picker.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["filter-condition-picker.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "platform": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "LimeWebComponentPlatform",
+                    "resolved": "LimeWebComponentPlatform | undefined",
+                    "references": {
+                        "LimeWebComponentPlatform": {
+                            "location": "import",
+                            "path": "@limetech/lime-web-components",
+                            "id": "node_modules::LimeWebComponentPlatform",
+                            "referenceLocation": "LimeWebComponentPlatform"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Platform service provider"
+                },
+                "getter": false,
+                "setter": false
+            },
+            "value": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "FilterCondition",
+                    "resolved": "\"begins-with\" | \"between\" | \"connected-to\" | \"contains\" | \"current\" | \"empty\" | \"ends-with\" | \"equals\" | \"greater-than\" | \"greater-than-or-equal\" | \"in-filter-set\" | \"less-than\" | \"less-than-or-equal\" | \"matches\" | \"next\" | \"not-begins-with\" | \"not-between\" | \"not-connected-to\" | \"not-contains\" | \"not-empty\" | \"not-ends-with\" | \"not-equals\" | \"not-in-filter-set\" | \"previous\" | undefined",
+                    "references": {
+                        "FilterCondition": {
+                            "location": "import",
+                            "path": "../filter-chip/filter-chip.types",
+                            "id": "src/components/filter-chip/filter-chip.types.ts::FilterCondition",
+                            "referenceLocation": "FilterCondition"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The currently selected condition."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "value"
+            },
+            "propertyType": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "PropertyType",
+                    "resolved": "\"belongsto\" | \"date\" | \"decimal\" | \"file\" | \"hasandbelongstomany\" | \"hasmany\" | \"hasone\" | \"integer\" | \"link\" | \"month\" | \"option\" | \"percent\" | \"phone\" | \"quarter\" | \"set\" | \"string\" | \"system\" | \"text\" | \"time\" | \"timeofday\" | \"user\" | \"xml\" | \"year\" | \"yesno\" | undefined",
+                    "references": {
+                        "PropertyType": {
+                            "location": "import",
+                            "path": "@limetech/lime-web-components",
+                            "id": "node_modules::PropertyType",
+                            "referenceLocation": "PropertyType"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Data type of the filtered property; selects which conditions are listed\nand their type-specific wording and icons."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "property-type"
+            },
+            "conditions": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "FilterCondition[]",
+                    "resolved": "FilterCondition[] | undefined",
+                    "references": {
+                        "FilterCondition": {
+                            "location": "import",
+                            "path": "../filter-chip/filter-chip.types",
+                            "id": "src/components/filter-chip/filter-chip.types.ts::FilterCondition",
+                            "referenceLocation": "FilterCondition"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Explicit conditions to offer, overriding the per-type catalog."
+                },
+                "getter": false,
+                "setter": false
+            },
+            "disabled": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Whether the picker is disabled."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "disabled",
+                "defaultValue": "false"
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "change",
+                "name": "change",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emitted when the user selects a condition."
+                },
+                "complexType": {
+                    "original": "FilterCondition",
+                    "resolved": "\"begins-with\" | \"between\" | \"connected-to\" | \"contains\" | \"current\" | \"empty\" | \"ends-with\" | \"equals\" | \"greater-than\" | \"greater-than-or-equal\" | \"in-filter-set\" | \"less-than\" | \"less-than-or-equal\" | \"matches\" | \"next\" | \"not-begins-with\" | \"not-between\" | \"not-connected-to\" | \"not-contains\" | \"not-empty\" | \"not-ends-with\" | \"not-equals\" | \"not-in-filter-set\" | \"previous\"",
+                    "references": {
+                        "FilterCondition": {
+                            "location": "import",
+                            "path": "../filter-chip/filter-chip.types",
+                            "id": "src/components/filter-chip/filter-chip.types.ts::FilterCondition",
+                            "referenceLocation": "FilterCondition"
+                        }
+                    }
+                }
+            }];
+    }
+}

package/dist/collection/components/icon-picker/icon-picker.js

@@ -35,7 +35,7 @@ export class IconPicker {
                 icon: this.value,
             };
         }
-        return (h("limel-picker", { key: 'd71d9babaf189723ccb3ece1722826054e109f70', label: this.label, helperText: this.helperText, disabled: this.disabled, readonly: this.readonly, invalid: this.invalid, required: this.required, value: value, searcher: this.search, onChange: this.handleChange, badgeIcons: false, leadingIcon: "search", searchLabel: "Start typing to find the right icon" }));
+        return (h("limel-picker", { key: 'bf6b76bbcea838150261e9e0037b1d7ca1ee08d1', label: this.label, helperText: this.helperText, disabled: this.disabled, readonly: this.readonly, invalid: this.invalid, required: this.required, value: value, searcher: this.search, onChange: this.handleChange, badgeIcons: false, leadingIcon: "search", searchLabel: "Start typing to find the right icon" }));
     }
     static get is() { return "limebb-icon-picker"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/info-tile/format/config/info-tile-format.js

@@ -92,7 +92,7 @@ export class InfoTileAdminConfig {
             },
         ];
         return [
-            h("limel-button-group", { key: '5ec61e22f0049afba77310ef1162c361a71f3290', value: buttons.filter(this.isValidButton), onChange: this.handleChangeType }),
+            h("limel-button-group", { key: '68999f607fd66a5a451929d6720200734c6505ea', value: buttons.filter(this.isValidButton), onChange: this.handleChangeType }),
             this.renderFormatConfig(),
         ];
     }

package/dist/collection/components/info-tile/info-tile.js

@@ -116,7 +116,7 @@ export class InfoTile {
         const errorProps = Object.assign(Object.assign({}, baseProps), { icon: 'error', prefix: 'ERROR', loading: true, label: this.getLabel(filter) });
         const normalProps = Object.assign(Object.assign({}, baseProps), { label: this.getLabel(filter), link: this.getLink(filter), loading: this.loading, value: value === null || value === void 0 ? void 0 : value.value.trim() });
         const props = !filter || this.error ? errorProps : normalProps;
-        return (h("limel-info-tile", Object.assign({ key: '8ce57413673c0feddc8cff70c66845ddacee5f74', class: { error: !filter || this.error } }, props)));
+        return (h("limel-info-tile", Object.assign({ key: '802c93fade2b3aff10e53c1a970798b994bff2d2', class: { error: !filter || this.error } }, props)));
     }
     /**
      * Effective `reducedPresence` for this render. The boolean prop

package/dist/collection/components/kanban/kanban-group/kanban-group.css

@@ -179,18 +179,6 @@ button#show-more-button {
   color: var(--limel-theme-on-surface-color);
   background-color: var(--lime-elevated-surface-background-color);
   box-shadow: var(--button-shadow-normal);
-  z-index: 1;
-  position: absolute;
-  right: 0;
-  bottom: -0.6rem;
-  left: 0;
-  margin: 0 auto;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: 3rem;
-  width: 2rem;
-  height: 1rem;
 }
 button#show-more-button:hover, button#show-more-button:focus, button#show-more-button:focus-visible {
   will-change: color, background-color, box-shadow, transform;
@@ -222,6 +210,20 @@ button#show-more-button:focus-visible {
   outline: none;
   box-shadow: var(--shadow-depth-8-focused);
 }
+button#show-more-button {
+  z-index: 1;
+  position: absolute;
+  right: 0;
+  bottom: -0.6rem;
+  left: 0;
+  margin: 0 auto;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 3rem;
+  width: 2rem;
+  height: 1rem;
+}
 button#show-more-button limel-icon {
   transition: rotate 0.2s ease 0.5s;
   color: var(--mdc-theme-primary);

package/dist/collection/components/kanban/kanban-group/kanban-group.js

@@ -27,7 +27,7 @@ export class KanbanGroup {
         };
     }
     render() {
-        return (h(Host, { key: '074640215f29d21e8d3f38b81850823e8a93ce3c' }, this.renderHelp(), this.renderGroupHeading(), this.renderGroupSummary(), this.renderItems()));
+        return (h(Host, { key: '5c0675c4edff236ac8b4d90c93d418e3b0c18a9c' }, this.renderHelp(), this.renderGroupHeading(), this.renderGroupSummary(), this.renderItems()));
     }
     renderGroupSummary() {
         if (!this.summary || !this.totalCount) {

package/dist/collection/components/kanban/kanban-item/kanban-item.css

@@ -161,7 +161,6 @@
   cursor: pointer;
   transition: color 0.2s ease;
   color: var(--mdc-theme-primary);
-  text-decoration: none;
 }
 .header a:before {
   transition: opacity 0.2s ease, transform 0.3s ease-out;
@@ -183,6 +182,9 @@
   opacity: 0.3;
   transform: scale(1);
 }
+.header a {
+  text-decoration: none;
+}
 
 .heading {
   --markdown-hyperlink-color: var(--mdc-theme-primary);
@@ -312,12 +314,6 @@ limel-chip-set {
   cursor: pointer;
   color: var(--limel-theme-on-surface-color);
   background-color: transparent;
-  display: flex;
-  align-items: center;
-  text-decoration: none;
-  gap: 0.25rem;
-  margin-left: 0;
-  border-radius: 1rem;
 }
 .assignee:hover, .assignee:focus, .assignee:focus-visible {
   will-change: color, background-color, box-shadow, transform;
@@ -351,6 +347,14 @@ limel-chip-set {
   outline: none;
   box-shadow: var(--shadow-depth-8-focused);
 }
+.assignee {
+  display: flex;
+  align-items: center;
+  text-decoration: none;
+  gap: 0.25rem;
+  margin-left: 0;
+  border-radius: 1rem;
+}
 .assignee limel-icon,
 .assignee img {
   transition: margin 0.2s ease, opacity 0.2s ease, filter 0.2s ease;

package/dist/collection/components/kanban/kanban-item/kanban-item.js

@@ -55,7 +55,7 @@ export class KanbanItemComponent {
     }
     render() {
         var _a, _b;
-        return (h(Host, { key: '6eb7fa30141a62e40588a59f17d27392dac78b90', id: this.item.id.toString(), class: {
+        return (h(Host, { key: '282342e6a11234154e4cbcc8df113aafd5cd9cd2', id: this.item.id.toString(), class: {
                 'has-unpromoted-actions': !!((_a = this.item.unpromotedActions) === null || _a === void 0 ? void 0 : _a.length),
                 'is-selected': !!((_b = this.item) === null || _b === void 0 ? void 0 : _b.selected),
             }, style: {

package/dist/collection/components/lime-query-builder/expressions/compound-leaf.js

@@ -1,10 +1,10 @@
 import { Operator, } from "@limetech/lime-web-components";
-// Intentionally diverges from the same-named map in
-// `lime-query-filter-comparison.tsx` (the comparison-editor's operator
-// vocabulary): that map has no `NOT` entry and maps `IN` to `'in-filter-set'`,
-// whereas here a keyed bare `NOT` reads as `not-equals` and a bare `IN` set
-// reads as `equals` (see `describeKeyed`). They are deliberately not the same
-// table — do not reconcile them into one.
+// Intentionally diverges from the write-side map in `filter-operators.ts` (the
+// operator vocabulary the query builder and rule editor author with): that map
+// has no `NOT` entry and maps `IN` to `'in-filter-set'`, whereas here a keyed
+// bare `NOT` reads as `not-equals` and a bare `IN` set reads as `equals` (see
+// `describeKeyed`). They are deliberately not the same table — do not reconcile
+// them into one.
 // Prototype-free (`Object.create(null)`): a junk `op` such as `'__proto__'` or
 // `'constructor'` resolves to `undefined` rather than an inherited
 // `Object.prototype` member, so a malformed expression falls through to "stays

package/dist/collection/components/lime-query-builder/expressions/lime-query-filter-comparison-editor.js

@@ -1,6 +1,7 @@
-import { Operator, PlatformServiceName, } from "@limetech/lime-web-components";
+import { Operator, } from "@limetech/lime-web-components";
 import { Host, h } from "@stencil/core";
-import { LIME_QUERY_OPERATORS, } from "./lime-query-operators";
+import { conditionToOperator, operatorToCondition, } from "../../filter-chip/filter-operators";
+import { LIME_QUERY_CONDITIONS, } from "./lime-query-operators";
 /**
  * Inline editor for a single comparison expression. `shadow: true` so
  * its stylesheet travels with the host when `limel-popover` portals it
@@ -14,9 +15,12 @@ export class LimeQueryFilterComparisonEditorComponent {
             event.stopPropagation();
             this.expressionChange.emit(Object.assign(Object.assign({}, this.expression), { key: event.detail }));
         };
-        this.handleOperatorChange = (event) => {
+        this.handleConditionChange = (event) => {
             event.stopPropagation();
-            const newOperator = event.detail.value;
+            const newOperator = conditionToOperator(event.detail);
+            if (!newOperator) {
+                return;
+            }
             const oldOperator = this.expression.op;
             let convertedValue = this.expression.exp;
             // IN expects an array; other operators expect a single value.
@@ -48,23 +52,14 @@ export class LimeQueryFilterComparisonEditorComponent {
         (_a = this.propertySelectorEl) === null || _a === void 0 ? void 0 : _a.focus();
     }
     render() {
-        return (h(Host, { key: '05ca2dc867f8c42e2ca1299cd33c0f3faae0ed31' }, this.renderPropertySelector(), this.renderOperator(), this.renderValueInput()));
+        return (h(Host, { key: '528f313843bb6e8e779fc3a5603c10769cbd183b' }, this.renderPropertySelector(), this.renderConditionPicker(), this.renderValueInput()));
     }
     renderPropertySelector() {
         return (h("limebb-property-selector", { ref: (el) => (this.propertySelectorEl = el), class: "property", label: "Property", platform: this.platform, context: this.context, limetype: this.limetype, value: this.expression.key, required: true, onChange: this.handlePropertyChange }));
     }
-    renderOperator() {
+    renderConditionPicker() {
         const operatorHasBeenSet = !!this.expression.op;
-        const options = LIME_QUERY_OPERATORS.map((op) => {
-            var _a, _b;
-            return ({
-                text: (_b = (_a = this.translator) === null || _a === void 0 ? void 0 : _a.get(op.label)) !== null && _b !== void 0 ? _b : op.label,
-                value: op.value,
-                icon: op.icon ? { name: op.icon } : undefined,
-            });
-        });
-        const selectedOption = options.find((o) => o.value === this.expression.op);
-        return (h("limel-select", { class: "operator", label: "Operator", value: selectedOption, options: options, disabled: !operatorHasBeenSet && !this.expression.key, onChange: this.handleOperatorChange }));
+        return (h("limebb-filter-condition-picker", { class: "operator", platform: this.platform, propertyType: this.propertyType, conditions: LIME_QUERY_CONDITIONS, value: operatorToCondition(this.expression.op), disabled: !operatorHasBeenSet && !this.expression.key, onChange: this.handleConditionChange }));
     }
     renderValueInput() {
         if (!this.expression.op) {
@@ -72,10 +67,6 @@ export class LimeQueryFilterComparisonEditorComponent {
         }
         return (h("limebb-lime-query-value-input", { class: "value", label: "Value", platform: this.platform, context: this.context, limetype: this.limetype, activeLimetype: this.activeLimetype, propertyPath: this.expression.key, operator: this.expression.op, value: this.expression.exp, onChange: this.handleValueChange }));
     }
-    get translator() {
-        var _a;
-        return (_a = this.platform) === null || _a === void 0 ? void 0 : _a.get(PlatformServiceName.Translate);
-    }
     static get is() { return "limebb-lime-query-filter-comparison-editor"; }
     static get encapsulation() { return "shadow"; }
     static get delegatesFocus() { return true; }
@@ -200,6 +191,32 @@ export class LimeQueryFilterComparisonEditorComponent {
                 },
                 "getter": false,
                 "setter": false
+            },
+            "propertyType": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "PropertyType",
+                    "resolved": "\"belongsto\" | \"date\" | \"decimal\" | \"file\" | \"hasandbelongstomany\" | \"hasmany\" | \"hasone\" | \"integer\" | \"link\" | \"month\" | \"option\" | \"percent\" | \"phone\" | \"quarter\" | \"set\" | \"string\" | \"system\" | \"text\" | \"time\" | \"timeofday\" | \"user\" | \"xml\" | \"year\" | \"yesno\" | undefined",
+                    "references": {
+                        "PropertyType": {
+                            "location": "import",
+                            "path": "@limetech/lime-web-components",
+                            "id": "node_modules::PropertyType",
+                            "referenceLocation": "PropertyType"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Data type of the selected property; lets the picker pick type-specific\nwording and icons."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "property-type"
             }
         };
     }

package/dist/collection/components/lime-query-builder/expressions/lime-query-filter-comparison.js

@@ -1,26 +1,8 @@
-import { Operator, PlatformServiceName, } from "@limetech/lime-web-components";
+import { PlatformServiceName, } from "@limetech/lime-web-components";
 import { Host, h, } from "@stencil/core";
+import { operatorToCondition } from "../../filter-chip/filter-operators";
 import { getNormalizedProperties } from "../property-resolution";
 import { getActualPropertyType } from "../type-resolution";
-/**
- * Maps each query-builder comparison operator onto the shared, UI-agnostic
- * `FilterCondition` vocabulary. The shared `limebb-filter-chip` resolves the
- * icon and the wording from the condition (refined by the property type), so
- * the query builder shows the same glyphs and operator names as every other
- * filter UI.
- */
-const OPERATOR_TO_CONDITION = {
-    [Operator.EQUALS]: 'equals',
-    [Operator.NOT_EQUALS]: 'not-equals',
-    [Operator.GREATER]: 'greater-than',
-    [Operator.GREATER_OR_EQUAL]: 'greater-than-or-equal',
-    [Operator.LESS]: 'less-than',
-    [Operator.LESS_OR_EQUAL]: 'less-than-or-equal',
-    [Operator.IN]: 'in-filter-set',
-    [Operator.LIKE]: 'contains',
-    [Operator.BEGINS]: 'begins-with',
-    [Operator.ENDS]: 'ends-with',
-};
 /**
  * Lime Query Filter Comparison Component
  *
@@ -70,13 +52,14 @@ export class LimeQueryFilterComparisonComponent {
         var _a, _b;
         const hasKey = !!((_a = this.expression) === null || _a === void 0 ? void 0 : _a.key);
         const isList = Array.isArray((_b = this.expression) === null || _b === void 0 ? void 0 : _b.exp);
-        return (h(Host, { key: '92e4a7debccbe2123c8fffe7b964ea51c5c1d586' }, this.renderHeader(), h("limel-popover", { key: '494afe14c58684826256ad275b16febd81d47d7a', open: this.isOpen, openDirection: "bottom-start", onClose: this.handleClose }, h("limebb-filter-chip", { key: '99c495cf63fc9ccc8067f7f0feb6d0d7884d3ca8', slot: "trigger", platform: this.platform, label: hasKey
+        const propertyType = hasKey
+            ? this.getPropertyType(this.expression.key)
+            : undefined;
+        return (h(Host, { key: '3e312a0124577ab70c6ab46074f7a34e0b87decc' }, this.renderHeader(), h("limel-popover", { key: '37b5e3b58ef4a20950b1f6fc24075388b4bdc932', open: this.isOpen, openDirection: "bottom-start", onClose: this.handleClose }, h("limebb-filter-chip", { key: 'd34fc11734714a8b83ef7c014fd9468522e8ffbf', slot: "trigger", platform: this.platform, label: hasKey
                 ? this.getPropertyLabel(this.expression.key)
                 : undefined, condition: hasKey
-                ? OPERATOR_TO_CONDITION[this.expression.op]
-                : undefined, propertyType: hasKey
-                ? this.getPropertyType(this.expression.key)
-                : undefined, value: hasKey ? this.chipValue() : 'New condition', conjunction: isList ? 'or' : undefined, selected: this.isOpen, removable: true, onClick: this.handleOpen, onRemove: this.removeExpression }), h("limebb-lime-query-filter-comparison-editor", { key: '0d56cccd56078eac4d988d757cae85897b8a48c7', platform: this.platform, context: this.context, limetype: this.limetype, activeLimetype: this.activeLimetype, expression: this.expression, onExpressionChange: this.handleEditorChange }))));
+                ? operatorToCondition(this.expression.op)
+                : undefined, propertyType: propertyType, value: hasKey ? this.chipValue() : 'New condition', conjunction: isList ? 'or' : undefined, selected: this.isOpen, removable: true, onClick: this.handleOpen, onRemove: this.removeExpression }), h("limebb-lime-query-filter-comparison-editor", { key: 'abaa2fbbdf8ab350f1da21412b82405d02f1546f', platform: this.platform, context: this.context, limetype: this.limetype, activeLimetype: this.activeLimetype, expression: this.expression, propertyType: propertyType, onExpressionChange: this.handleEditorChange }))));
     }
     getPropertyLabel(key) {
         return this.resolveProperty(key).labels.join(' › ');

package/dist/collection/components/lime-query-builder/expressions/lime-query-filter-group.css

@@ -12,19 +12,19 @@
 }
 
 :host([data-op=AND]) {
-  --combinator-symbol: "&";
+  --combinator-symbol: '&';
 }
 
 :host([data-op=NOT_AND]) {
-  --combinator-symbol: "- &";
+  --combinator-symbol: '- &';
 }
 
 :host([data-op=OR]) {
-  --combinator-symbol: "or";
+  --combinator-symbol: 'or';
 }
 
 :host([data-op=NOT_OR]) {
-  --combinator-symbol: "- or";
+  --combinator-symbol: '- or';
 }
 
 .group {

package/dist/collection/components/lime-query-builder/expressions/lime-query-filter-group.js

@@ -90,9 +90,9 @@ export class LimeQueryFilterGroupComponent {
         const combinator = getCombinator(this.expression);
         const inner = getInnerAndOr(this.expression);
         const selected = COMBINATOR_OPTIONS.find((o) => o.value === combinator);
-        return (h(Host, { key: 'c94790ff047e47ada5e9142af88bff0c8250e34f', "data-op": combinator, style: {
+        return (h(Host, { key: '6b7013b523d0313f053f5a057db99d23e5c35041', "data-op": combinator, style: {
                 '--limebb-query-filter-group-color-code': OP_STYLE[combinator].color,
-            } }, h("div", { key: '6bc8daa9b292993e2740dbc0a2f1b0a7f2df4722', class: "group" }, h("div", { key: '8a171940ef57d657c3638943108e997bb84bde21', class: "group-header" }, h("limel-select", { key: '179abcc11b79527f7b8d0863b2e8d81de5bd3267', class: "combinator", label: "Match", value: selected, options: COMBINATOR_OPTIONS, onChange: this.handleCombinatorChange }), h("limel-icon-button", { key: '3a604b24ccff02ac257d3440c82dbc33dc9f4f16', class: "delete-group", icon: "trash", label: "Delete this group", onClick: this.handleDeleteGroup })), h("ul", { key: 'f65734f8d7cc66886065a511a90108c9316d4d7b', class: "rows" }, inner.exp.map(this.renderChildExpression), h("limel-chip", { key: '252726aea61aefead90fc6ce421de9eb74288253', role: "listitem", class: "add-condition", text: "Condition", icon: { name: 'plus_math', title: 'Add' }, onClick: this.handleAddChildExpression })), h("limel-chip", { key: '2a5839a10a8b9ebb85f53d867c8870ad92ab0984', class: "add-group", size: "small", text: "Group", icon: {
+            } }, h("div", { key: '03bea15e4967f91d1e46a961aba64c04b1aff530', class: "group" }, h("div", { key: '26ca358c38a27e2fc24ac1b176ce338f885f2a31', class: "group-header" }, h("limel-select", { key: '46403ec7c67766ac4eb08b03eaac1eafeb92c0ff', class: "combinator", label: "Match", value: selected, options: COMBINATOR_OPTIONS, onChange: this.handleCombinatorChange }), h("limel-icon-button", { key: 'cfdb09d1656dc4a87a40c6d1cf5e5a4e0c2aeba0', class: "delete-group", icon: "trash", label: "Delete this group", onClick: this.handleDeleteGroup })), h("ul", { key: '55bb718c9ece64898a41bf95ff301bbeade8a4cd', class: "rows" }, inner.exp.map(this.renderChildExpression), h("limel-chip", { key: '34c653a547ce2406938eece661c5d468c84871f3', role: "listitem", class: "add-condition", text: "Condition", icon: { name: 'plus_math', title: 'Add' }, onClick: this.handleAddChildExpression })), h("limel-chip", { key: 'b27939aced4774b9b738e81d07a7ed4b040f3b77', class: "add-group", size: "small", text: "Group", icon: {
                 name: 'plus_math',
                 title: 'Add',
                 color: 'var(--group-rail-color)',

package/dist/collection/components/lime-query-builder/expressions/lime-query-filter-not.js

@@ -35,7 +35,7 @@ export class LimeQueryFilterNotComponent {
         };
     }
     render() {
-        return (h("div", { key: '73fa671599ac9f124797567f49af67941dd30e36', class: "expression" }, this.label && h("limel-header", { key: '959feb78614f0088b9946ccb492f32900a410ff8', heading: this.label }), h("limebb-lime-query-filter-expression", { key: '78ce884774a3831c18ad329fb1eacc4e54cd3623', platform: this.platform, context: this.context, label: "Not", limetype: this.limetype, activeLimetype: this.activeLimetype, expression: this.expression.exp, onExpressionChange: this.handleExpressionChange })));
+        return (h("div", { key: '38ddcfda3b05cd9bc0c510f55d2712472ee2886f', class: "expression" }, this.label && h("limel-header", { key: '5b05cbb7bbd7fb1940c0d7c27b4578f6551833a8', heading: this.label }), h("limebb-lime-query-filter-expression", { key: '4057437167e652f31aa02148e511cfe9a9b26ccb', platform: this.platform, context: this.context, label: "Not", limetype: this.limetype, activeLimetype: this.activeLimetype, expression: this.expression.exp, onExpressionChange: this.handleExpressionChange })));
     }
     static get is() { return "limebb-lime-query-filter-not"; }
     static get encapsulation() { return "shadow"; }