@limetech/lime-crm-building-blocks 1.139.1 → 2.0.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
@@ -443,7 +443,7 @@ export class InfoTile {
                 "mutable": false,
                 "complexType": {
                     "original": "AggregateOperator",
-                    "resolved": "\"AVG\" | \"COUNT\" | \"MAX\" | \"MIN\" | \"SUM\"",
+                    "resolved": "\"AVG\" | \"COUNT\" | \"GROUP\" | \"MAX\" | \"MIN\" | \"SUM\"",
                     "references": {
                         "AggregateOperator": {
                             "location": "import",

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

@@ -15,6 +15,7 @@ export class InfoTileLoader {
         return value;
     }
     async loadBasicInfoTile(aggregator) {
+        var _a;
         const filter = this.getFilter(aggregator.filter);
         if (!filter) {
             throw new Error(`Filter "${aggregator.filter}" not found`);
@@ -33,7 +34,7 @@ export class InfoTileLoader {
             },
             filter: filter.filter,
         });
-        return result.aggregates.infotiles[0].value;
+        return (_a = result.aggregates.infotiles[0].value) !== null && _a !== void 0 ? _a : 0;
     }
     async loadLimeObjectInfoTile(aggregator, identifier) {
         await this.objectRepository.loadObject(identifier.limetype, identifier.id, {

package/dist/collection/components/inline-image/inline-image.css

@@ -0,0 +1,12 @@
+:host {
+  display: inline-block;
+  max-width: 100%;
+}
+
+img {
+  display: inline-block;
+  max-width: 100%;
+  height: auto;
+  border-radius: 0.25rem;
+  vertical-align: bottom;
+}

package/dist/collection/components/inline-image/inline-image.js

@@ -0,0 +1,146 @@
+import { getElement, h } from "@stencil/core";
+import { PlatformServiceName, } from "@limetech/lime-web-components";
+import { findParentElement } from "../../util/dom";
+import { getFileContentsUrl } from "../../util/file-contents-url";
+/**
+ * An inline image, referenced only by its file id so stored content stays
+ * portable. The contents URL is resolved at render time. Used for read-only
+ * rendering via `limel-markdown`; inside the editor the same tag is handled by
+ * `limel-text-editor`.
+ *
+ * @private
+ */
+export class InlineImage {
+    constructor() {
+        /**
+         * Alternative text for the image.
+         */
+        this.alt = '';
+        this.appName = '';
+    }
+    connectedCallback() {
+        var _a;
+        const host = findParentElement(getElement(this), this.hasPlatform);
+        this.appName =
+            (_a = host === null || host === void 0 ? void 0 : host.platform.get(PlatformServiceName.Application).getApplicationName()) !== null && _a !== void 0 ? _a : '';
+    }
+    render() {
+        if (!this.imageId || !this.appName) {
+            return;
+        }
+        return (h("img", { src: getFileContentsUrl(this.appName, this.imageId), alt: this.alt, style: {
+                width: this.toCssSize(this.width),
+                height: this.toCssSize(this.height),
+                maxWidth: '100%',
+            } }));
+    }
+    hasPlatform(element) {
+        return ('platform' in element &&
+            !!element.platform &&
+            typeof element.platform === 'object');
+    }
+    toCssSize(value) {
+        if (!value) {
+            return undefined;
+        }
+        return /^\d+$/.test(value) ? `${value}px` : value;
+    }
+    static get is() { return "limebb-inline-image"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["inline-image.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["inline-image.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "imageId": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Id of the file backing this image. Maps to the `image-id` attribute."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "image-id"
+            },
+            "alt": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Alternative text for the image."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "alt",
+                "defaultValue": "''"
+            },
+            "width": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Rendered width (e.g. `400` or `400px`)."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "width"
+            },
+            "height": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Rendered height (e.g. `300` or `300px`)."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "height"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "appName": {}
+        };
+    }
+}

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.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(' › ');