@limetech/lime-crm-building-blocks 2.0.4 → 2.2.0

package/dist/collection/components/chat-list/typing-indicator/typing-indicator.js

@@ -7,7 +7,7 @@ import { h } from "@stencil/core";
  */
 export class TypingIndicator {
     render() {
-        return (h("div", { key: 'c48666cb784c0b43576bd3251d77cd3dae560ec8', class: "typing-ellipsis" }, h("div", { key: '2d68872de3715f87c8c24a26453970272641c723', class: "circle" }), h("div", { key: '698b2fcf02ba1fb85e4b80d17271e6b3d553a29f', class: "circle" }), h("div", { key: 'fd4c63321fd38c4d2c5ec9e0935f910597eb830d', class: "circle" })));
+        return (h("div", { key: 'afc891f3443bdecefb025e3564679bf83d654e9a', class: "typing-ellipsis" }, h("div", { key: 'd886ca24a5c075b2cedc9c2902fd9bfbc995e418', class: "circle" }), h("div", { key: '73133ec43983aa1cdf50e9b505cba45e0c8bde04', class: "circle" }), h("div", { key: '624b5cc3b21336642acf53e6d3b867a60ae34a80', class: "circle" })));
     }
     static get is() { return "limebb-typing-indicator"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/color-palette-picker/color-palette-picker.js

@@ -58,7 +58,7 @@ export class ColorPalettePicker {
         this.optionsById = new Map(this.options.map((option) => [option.value, option]));
     }
     render() {
-        return (h(Host, { key: '33572f264c1c4ce930b2d768303637ac002723a3' }, h("limel-select", { key: '14cecf503884e53a206ee3fdc57ffd0056cace75', label: this.label, helperText: this.helperText, disabled: this.disabled, readonly: this.readonly, invalid: this.invalid, required: this.required, options: this.options, value: this.getSelectedOption(), onChange: this.handleChange })));
+        return (h(Host, { key: 'a5f44d09a862e67f6216bcad7f46eec29ced722a' }, h("limel-select", { key: 'a5cf05f6592bdda711def6ec1a05b56aee2b73c9', label: this.label, helperText: this.helperText, disabled: this.disabled, readonly: this.readonly, invalid: this.invalid, required: this.required, options: this.options, value: this.getSelectedOption(), onChange: this.handleChange })));
     }
     /**
      * Resolve `this.value` against the cached options map. Returns

package/dist/collection/components/color-palette-picker/color-palette-swatches/color-palette-swatches.js

@@ -22,7 +22,7 @@ export class ColorPaletteSwatches {
         this.colors = [];
     }
     render() {
-        return (h(Host, { key: '37c886a976b9cd342aa1d12cfffad8b5639f6f39', "aria-hidden": "true" }, h("ol", { key: '41165c8cfb34050c17ae45d127e7d2326dee12fb' }, this.colors.map((color, index) => (h("li", { key: index, style: { backgroundColor: color } }))))));
+        return (h(Host, { key: '62b7189e13fb67c79e8da299a40b1ec621a2886f', "aria-hidden": "true" }, h("ol", { key: 'ae4bda8db0f631c0a8d7ea42f033c4bb1e37b1da' }, this.colors.map((color, index) => (h("li", { key: index, style: { backgroundColor: color } }))))));
     }
     static get is() { return "limebb-color-palette-swatches"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/composer-toolbar/composer-toolbar.js

@@ -83,8 +83,8 @@ export class ComposerToolbar {
     }
     render() {
         return [
-            h("div", { key: '475b730dee1ec915324640d2dc49e4e5c153b828', class: "actions" }, h("slot", { key: '199c6ffa29f8785d7ce9a25ceddc1d34194a24b7', name: "leading" }), this.renderFileInput(), this.renderTriggerActions(), h("slot", { key: 'f29ce72acf0ece6f92592ca27ade0f2048315ab7', name: "trailing" })),
-            h("slot", { key: 'afcf9f1fdd3b8fbce732eb5026331959290f4ee9', name: "primary-action" }),
+            h("div", { key: '95a495c2289ee07d42b9f2ffd5b9f69634f0c70b', class: "actions" }, h("slot", { key: '3729266b77e939e980734556dc1417e34921b9a9', name: "leading" }), this.renderFileInput(), this.renderTriggerActions(), h("slot", { key: '211edc189658f512049b9e9487007a9e5b580134', name: "trailing" })),
+            h("slot", { key: '5c7e90a4577224f004e45b4f8447b330b6878138', name: "primary-action" }),
         ];
     }
     get translator() {

package/dist/collection/components/condition-tree/condition-tree-combinators.js

@@ -0,0 +1,78 @@
+/**
+ * Every combinator a group can use, in the order they are offered.
+ *
+ * @public
+ */
+export const CONDITION_TREE_COMBINATORS = [
+    'all',
+    'any',
+    'not-all',
+    'none',
+];
+/**
+ * The combinator to give a group nested inside one joined by `combinator`.
+ *
+ * The opposite join is the useful default: a group joined the same way as the
+ * one holding it says nothing the outer group does not already say. The
+ * negation is dropped with it, since a nested group has nothing to negate yet.
+ * @param combinator
+ */
+export function oppositeCombinator(combinator) {
+    return OPPOSITE[combinator];
+}
+const OPPOSITE = {
+    all: 'any',
+    any: 'all',
+    'not-all': 'any',
+    none: 'all',
+};
+/**
+ * How each combinator looks and reads. The labels are fallbacks used when the
+ * platform has no translation for the key next to them.
+ */
+export const COMBINATOR_PRESENTATION = {
+    all: {
+        color: 'rgb(var(--contrast-900))',
+        iconName: 'dot_circle',
+        labelKey: 'webclient.combinator.all',
+        label: 'All of the following',
+        descriptionKey: 'webclient.combinator.all.description',
+        description: 'Every condition must be met.',
+        negated: false,
+        delimiterKey: 'webclient.delimiter.and',
+        delimiter: '&',
+    },
+    any: {
+        color: 'rgb(var(--color-sky-default))',
+        iconName: 'centre_point',
+        labelKey: 'webclient.combinator.any',
+        label: 'Any of the following',
+        descriptionKey: 'webclient.combinator.any.description',
+        description: 'At least one condition must be met.',
+        negated: false,
+        delimiterKey: 'webclient.delimiter.or',
+        delimiter: 'or',
+    },
+    'not-all': {
+        color: 'rgb(var(--color-orange-default))',
+        iconName: 'dot_circle',
+        labelKey: 'webclient.combinator.not-all',
+        label: 'Not all of the following',
+        descriptionKey: 'webclient.combinator.not-all.description',
+        description: 'At least one condition must not be met.',
+        negated: true,
+        delimiterKey: 'webclient.delimiter.and',
+        delimiter: '&',
+    },
+    none: {
+        color: 'rgb(var(--color-red-default))',
+        iconName: 'centre_point',
+        labelKey: 'webclient.combinator.none',
+        label: 'None of the following',
+        descriptionKey: 'webclient.combinator.none.description',
+        description: 'No conditions may be met.',
+        negated: true,
+        delimiterKey: 'webclient.delimiter.or',
+        delimiter: 'or',
+    },
+};

package/dist/collection/components/condition-tree/condition-tree-editor/condition-tree-editor.css

@@ -0,0 +1,17 @@
+:host {
+  display: contents;
+}
+
+limel-header.header {
+  --header-background-color: rgba(var(--contrast-300));
+  padding-right: 0.5rem;
+  gap: 1rem;
+}
+
+.header-actions {
+  display: grid;
+  grid-auto-flow: column;
+  grid-gap: 0.75rem;
+  padding: 0.25rem;
+  align-items: center;
+}

package/dist/collection/components/condition-tree/condition-tree-editor/condition-tree-editor.js

@@ -0,0 +1,333 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
+        r = Reflect.decorate(decorators, target, key, desc);
+    else
+        for (var i = decorators.length - 1; i >= 0; i--)
+            if (d = decorators[i])
+                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { h } from "@stencil/core";
+import { ProvideContext, } from "@limetech/lime-web-components";
+import { LimeWebComponentTemplate } from "../../../util/web-component-template";
+import { createTranslator } from "../condition-tree-translate";
+/**
+ * The body of a condition's editor popover: the consumer's editor, and — for a
+ * condition that cannot express its own negation — a switch that negates it.
+ *
+ * It is an element of its own rather than markup inside the tree because
+ * `limel-popover` portals its content out of the tree's shadow DOM, leaving it
+ * behind. Carrying its own shadow root means its styles travel with it.
+ *
+ * @private
+ */
+export class ConditionTreeEditor {
+    constructor() {
+        /**
+         * Whether the popover holding this element is open.
+         *
+         * The element itself stays in place while closed, because `limel-popover`
+         * moves its content into the popover surface once and for all when that
+         * surface first loads — anything not there by then is never moved. Drawing
+         * nothing until asked is what keeps the consumer's editor from being built
+         * for every condition in the tree.
+         */
+        this.open = false;
+        /**
+         * @inheritdoc
+         */
+        this.readonly = false;
+        /**
+         * @inheritdoc
+         */
+        this.disabled = false;
+        this.handleNegate = (event) => {
+            event.stopPropagation();
+            this.negateChange.emit(event.detail);
+        };
+        this.handleConditionChange = (event) => {
+            event.stopPropagation();
+            this.conditionChange.emit(event.detail);
+        };
+    }
+    render() {
+        if (!this.open) {
+            return null;
+        }
+        return [this.renderHeader(), this.renderBody()];
+    }
+    /**
+     * The header exists only to hold the negation switch, so a condition that
+     * owns its polarity gets no header at all — its editor is the whole
+     * popover, exactly as if this element weren't here.
+     */
+    renderHeader() {
+        if (this.negated === undefined || this.readonly) {
+            return null;
+        }
+        return (h("limel-header", { class: "header is-narrow", heading: this.heading }, h("div", { slot: "actions", class: "header-actions" }, h("limel-switch", { class: "negate", label: this.negateLabel, value: this.negated, disabled: this.disabled, onChange: this.handleNegate }))));
+    }
+    renderBody() {
+        if (!this.editor) {
+            return null;
+        }
+        return (h(LimeWebComponentTemplate, { class: "editor", platform: this.platform, context: this.context, name: this.editor.name, props: Object.assign(Object.assign({}, this.editor.props), {
+                // The condition itself, and the tree's own state, win over
+                // the descriptor: an editor that stayed open while the tree
+                // was locked must not be the one place the lock does not
+                // reach.
+                value: this.value, readonly: this.readonly, disabled: this.disabled, onConditionChange: this.handleConditionChange
+            }) }));
+    }
+    get negateLabel() {
+        return createTranslator(this.platform)('webclient.negate', 'Negate');
+    }
+    static get is() { return "limebb-condition-tree-editor"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["condition-tree-editor.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["condition-tree-editor.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "platform": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "LimeWebComponentPlatform",
+                    "resolved": "LimeWebComponentPlatform",
+                    "references": {
+                        "LimeWebComponentPlatform": {
+                            "location": "import",
+                            "path": "@limetech/lime-web-components",
+                            "id": "node_modules::LimeWebComponentPlatform",
+                            "referenceLocation": "LimeWebComponentPlatform"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Platform service provider"
+                },
+                "getter": false,
+                "setter": false
+            },
+            "context": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "LimeWebComponentContext",
+                    "resolved": "LimeWebComponentContext",
+                    "references": {
+                        "LimeWebComponentContext": {
+                            "location": "import",
+                            "path": "@limetech/lime-web-components",
+                            "id": "node_modules::LimeWebComponentContext",
+                            "referenceLocation": "LimeWebComponentContext"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Bridges the tree's context across the `limel-popover` portal."
+                },
+                "getter": false,
+                "setter": false
+            },
+            "open": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Whether the popover holding this element is open.\n\nThe element itself stays in place while closed, because `limel-popover`\nmoves its content into the popover surface once and for all when that\nsurface first loads \u2014 anything not there by then is never moved. Drawing\nnothing until asked is what keeps the consumer's editor from being built\nfor every condition in the tree."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "open",
+                "defaultValue": "false"
+            },
+            "editor": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "ComponentDescriptor",
+                    "resolved": "ComponentDescriptor<unknown> | undefined",
+                    "references": {
+                        "ComponentDescriptor": {
+                            "location": "import",
+                            "path": "@limetech/lime-web-components",
+                            "id": "node_modules::ComponentDescriptor",
+                            "referenceLocation": "ComponentDescriptor"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The editor to mount, as given on the condition."
+                },
+                "getter": false,
+                "setter": false
+            },
+            "value": {
+                "type": "any",
+                "mutable": false,
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The condition being edited, in the consumer's own model. Handed to the\nmounted editor as `value`."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "value"
+            },
+            "heading": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Title of the condition, shown above the editor when there is a header to\nshow at all."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "heading"
+            },
+            "negated": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Whether the condition is negated. `undefined` means the condition\nexpresses its own polarity and no switch is offered."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "negated"
+            },
+            "readonly": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "inheritdoc",
+                            "text": undefined
+                        }],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "readonly",
+                "defaultValue": "false"
+            },
+            "disabled": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "inheritdoc",
+                            "text": undefined
+                        }],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "disabled",
+                "defaultValue": "false"
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "negateChange",
+                "name": "negateChange",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emitted when the user toggles the negation switch."
+                },
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                }
+            }, {
+                "method": "conditionChange",
+                "name": "conditionChange",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emitted with the replacement condition when the mounted editor reports\none.\n\n`limel-popover` portals this element out of the tree's shadow DOM, so an\nevent from the editor never reaches the tree on its own. Catching it here\nand emitting it again is what carries it back across."
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }];
+    }
+}
+__decorate([
+    ProvideContext('context')
+], ConditionTreeEditor.prototype, "context", void 0);