@limetech/lime-crm-building-blocks 1.116.0 → 1.116.2

package/dist/components/limebb-trend-indicator.js

@@ -1,175 +1 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { g as getPercentageClass } from './percentage-class.js';
-
-const trendIndicatorCss = "@charset \"UTF-8\";*{box-sizing:border-box}:host(limebb-trend-indicator){position:relative;display:block;height:100%;width:100%}limel-notched-outline:not([invalid]:not([invalid=false])) .limel-notched-outline--outlines{--limel-notched-outline-border-color:transparent}div[slot=content]{display:flex;align-items:center;gap:0.5rem;border-radius:inherit;background-color:transparent !important}div[slot=content]:focus{outline:none}div[slot=content]:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}:host(limebb-trend-indicator):has(label) div[slot=content]{min-height:2.5rem;padding:0 0.375rem 0 1rem}:host(limebb-trend-indicator[former-value]) div[slot=content]{cursor:help}div[slot=content] span{flex-shrink:0}.icon{flex-shrink:0;display:flex;transition-property:color, background-color, transform;transition-duration:0.4s;transition-timing-function:ease;width:1.25rem;height:1.25rem;border-radius:50%;padding:0.12rem;color:rgb(var(--color-white));background-color:rgb(var(--color-gray-default), 0.5)}:host(.has-value-40to30-negative) .icon{color:rgb(var(--color-gray-darker))}:host(.has-value-30to20-negative) .icon{color:rgb(var(--color-gray-darker))}:host(.has-value-20to10-negative) .icon{color:rgb(var(--color-gray-darker))}:host(.has-value-10to0-negative) .icon{color:rgb(var(--color-gray-darker))}:host(.has-value-0to10-positive) .icon{color:rgb(var(--color-gray-dark))}:host(.has-value-10to20-positive) .icon{color:rgb(var(--color-gray-dark))}:host(.has-value-20to30-positive) .icon{color:rgb(var(--color-gray-dark))}:host(.has-value-30to40-positive) .icon{color:rgb(var(--color-gray-dark))}:host(.has-value-200or-larger-negative) .icon{background-color:rgb(var(--color-red-darker));transform:rotate(90deg)}:host(.has-value-200to100-negative) .icon{background-color:rgb(var(--color-red-dark));transform:rotate(90deg)}:host(.has-value-100to90-negative) .icon{background-color:rgb(var(--color-red-dark));transform:rotate(90deg)}:host(.has-value-90to80-negative) .icon{background-color:rgb(var(--color-red-dark));transform:rotate(81deg)}:host(.has-value-80to70-negative) .icon{background-color:rgb(var(--color-red-default));transform:rotate(72deg)}:host(.has-value-70to60-negative) .icon{background-color:rgb(var(--color-red-default));transform:rotate(63deg)}:host(.has-value-60to50-negative) .icon{background-color:rgb(var(--color-coral-default));transform:rotate(54deg)}:host(.has-value-50to40-negative) .icon{background-color:rgb(var(--color-coral-default));transform:rotate(45deg)}:host(.has-value-40to30-negative) .icon{background-color:rgb(var(--color-orange-default));transform:rotate(36deg)}:host(.has-value-30to20-negative) .icon{background-color:rgb(var(--color-orange-default));transform:rotate(27deg)}:host(.has-value-20to10-negative) .icon{background-color:rgb(var(--color-amber-default));transform:rotate(18deg)}:host(.has-value-10to0-negative) .icon{background-color:rgb(var(--color-amber-default));transform:rotate(9deg)}:host(.has-value-0) .icon{background-color:rgb(var(--color-gray-default));transform:rotate(0deg)}:host(.has-value-0to10-positive) .icon{background-color:rgb(var(--color-yellow-default));transform:rotate(-9deg)}:host(.has-value-10to20-positive) .icon{background-color:rgb(var(--color-yellow-default));transform:rotate(-18deg)}:host(.has-value-20to30-positive) .icon{background-color:rgb(var(--color-grass-default));transform:rotate(-27deg)}:host(.has-value-30to40-positive) .icon{background-color:rgb(var(--color-grass-default));transform:rotate(-36deg)}:host(.has-value-40to50-positive) .icon{background-color:rgb(var(--color-lime-default));transform:rotate(-45deg)}:host(.has-value-50to60-positive) .icon{background-color:rgb(var(--color-lime-default));transform:rotate(-54deg)}:host(.has-value-60to70-positive) .icon{background-color:rgb(var(--color-teal-default));transform:rotate(-63deg)}:host(.has-value-70to80-positive) .icon{background-color:rgb(var(--color-teal-default));transform:rotate(-72deg)}:host(.has-value-80to90-positive) .icon{background-color:rgb(var(--color-teal-dark));transform:rotate(-81deg)}:host(.has-value-90to100-positive) .icon{background-color:rgb(var(--color-teal-dark));transform:rotate(-90deg)}:host(.has-value-100to200-positive) .icon{background-color:rgb(var(--color-teal-dark));transform:rotate(-90deg)}:host(.has-value-200or-larger-positive) .icon{background-color:rgb(var(--color-teal-darker));transform:rotate(-90deg)}:host(.has-value-0) .icon{background-color:rgb(var(--color-gray-default), 0.5);transform:rotate(0deg)}:host(.has-value-0) .icon polyline{color:transparent}:host(.has-value-200or-larger-negative) .icon:after,:host(.has-value-200or-larger-negative) .icon:before,:host(.has-value-200to100-negative) .icon:after,:host(.has-value-200to100-negative) .icon:before,:host(.has-value-100to200-positive) .icon:after,:host(.has-value-100to200-positive) .icon:before,:host(.has-value-200or-larger-positive) .icon:after,:host(.has-value-200or-larger-positive) .icon:before{transition:border-color 0.6s ease;content:\"\";position:absolute;inset:0;margin:auto;border:1px solid transparent;border-radius:50%}:host(.has-value-200or-larger-negative) .icon:before,:host(.has-value-200to100-negative) .icon:before,:host(.has-value-100to200-positive) .icon:before,:host(.has-value-200or-larger-positive) .icon:before{transform:scale(1.2)}:host(.has-value-200or-larger-negative) .icon:after,:host(.has-value-200to100-negative) .icon:after,:host(.has-value-100to200-positive) .icon:after,:host(.has-value-200or-larger-positive) .icon:after{transform:scale(1.4);opacity:0.4}:host(.has-value-200to100-negative) .icon:before,:host(.has-value-200or-larger-negative) .icon:before{border-color:rgb(var(--color-red-dark))}:host(.has-value-200or-larger-negative) .icon:after{border-color:rgb(var(--color-red-darker))}:host(.has-value-100to200-positive) .icon:before,:host(.has-value-200or-larger-positive) .icon:before{border-color:rgb(var(--color-teal-dark))}:host(.has-value-200or-larger-positive) .icon:after{border-color:rgb(var(--color-teal-darker))}.no-value{transform:translateY(0.5rem)}.growth-unit{padding-left:0.5rem;opacity:0.5}:host(limebb-trend-indicator:focus),:host(limebb-trend-indicator:focus-visible),:host(limebb-trend-indicator:focus-within){--limel-h-l-grid-template-rows-transition-speed:0.46s;--limel-h-l-grid-template-rows:1fr}:host(limebb-trend-indicator){--limel-h-l-grid-template-rows-transition-speed:0.3s;--limel-h-l-grid-template-rows:0fr}:host(limebb-trend-indicator:focus) limel-helper-line,:host(limebb-trend-indicator:focus-visible) limel-helper-line,:host(limebb-trend-indicator:focus-within) limel-helper-line,:host(limebb-trend-indicator:hover) limel-helper-line{will-change:grid-template-rows}";
-const LimebbTrendIndicatorStyle0 = trendIndicatorCss;
-
-const TrendIndicator = /*@__PURE__*/ proxyCustomElement(class TrendIndicator extends HTMLElement {
-    valueChanged(newValue) {
-        this.numValue = this.parseValue(newValue);
-    }
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        /**
-         * A short piece of text to display after the value.
-         */
-        this.suffix = '%';
-        /**
-         * When set to `false`, if the `value` equals `0` or there is no value
-         * (_undefined_, _null_ or empty string), the component will
-         * render the visualization. See the examples for more details.
-         */
-        this.reducePresence = true;
-        this.labelId = 'a' + crypto.randomUUID();
-        this.tooltipId = 'a' + crypto.randomUUID();
-        this.helperTextId = 'a' + crypto.randomUUID();
-        this.renderHelperLine = () => {
-            if (!this.hasHelperText()) {
-                return;
-            }
-            return (h("limel-helper-line", { helperTextId: this.helperTextId, helperText: this.helperText, invalid: this.invalid }));
-        };
-        this.hasHelperText = () => {
-            return this.helperText !== null && this.helperText !== undefined;
-        };
-        this.numValue = this.parseValue(this.value);
-    }
-    render() {
-        return (h(Host, { key: '8da003525170a6896bcbb95887f6a4cfc86ee54c', class: this.getContainerClassList() }, h("limel-notched-outline", { key: '948bea6e0624cd0c69d582ccba8d6f919486d726', id: this.tooltipId, label: this.label, labelId: this.labelId, invalid: this.invalid, required: this.required, hasValue: true, hasFloatingLabel: true, "aria-labelledby": this.labelId, "aria-describedby": this.helperTextId, "aria-controls": this.helperTextId }, h("div", { key: 'f71404b0e2a606ea57277d02ca7bf005274836da', slot: "content", tabIndex: 0 }, this.renderVisualization())), this.renderHelperLine(), this.renderTooltip()));
-    }
-    renderVisualization() {
-        if (this.reducePresence && (this.numValue === 0 || !this.hasValue())) {
-            return;
-        }
-        if (!this.hasValue()) {
-            return h("span", { class: "no-value" }, "\u2013");
-        }
-        return [
-            this.getArrowIcon(),
-            h("span", null, this.renderGrowthPercentage(), this.renderGrowthAmount()),
-        ];
-    }
-    renderTooltip() {
-        if (this.formerValue === undefined) {
-            return;
-        }
-        const tooltipValue = `${this.value}` +
-            ' - ' +
-            `${this.formerValue > 0 ? this.formerValue : '(' + this.formerValue + ')'}` +
-            ' = ' +
-            `${this.calculateGrowth()}` +
-            ` ${this.suffix} ` +
-            ' ';
-        const percentage = this.calculatePercentage();
-        return (h("limel-tooltip", { openDirection: "top-start", elementId: this.tooltipId, label: percentage + '%', helperLabel: tooltipValue }));
-    }
-    renderGrowthPercentage() {
-        if (this.formerValue === undefined) {
-            return this.formatValue(this.numValue, this.suffix);
-        }
-        const percentage = this.calculatePercentage();
-        if (percentage === null) {
-            return;
-        }
-        return this.formatValue(percentage, '%');
-    }
-    renderGrowthAmount() {
-        if (this.formerValue === undefined) {
-            return;
-        }
-        const value = this.calculateGrowth();
-        return (h("span", { class: "growth-unit" }, "( ", this.formatValue(value, this.suffix), " )"));
-    }
-    hasValue() {
-        return (this.value !== undefined && this.value !== null && this.value !== '');
-    }
-    getContainerClassList() {
-        if (!this.hasValue()) {
-            return;
-        }
-        const percentage = this.getPercentage();
-        const percentageClass = getPercentageClass(percentage);
-        return Object.assign({}, (percentageClass && { [percentageClass]: true }));
-    }
-    getPercentage() {
-        if (this.formerValue === undefined) {
-            return this.numValue;
-        }
-        return this.calculatePercentage();
-    }
-    calculateGrowth() {
-        return this.numValue - this.formerValue;
-    }
-    calculatePercentage() {
-        if (this.formerValue === 0) {
-            return null;
-        }
-        const PERCENT = 100;
-        const DECIMALS = 2;
-        const percentage = (((this.numValue - this.formerValue) /
-            Math.abs(this.formerValue)) *
-            PERCENT).toFixed(DECIMALS);
-        return Number.parseFloat(percentage);
-    }
-    unifyMinusSign(input) {
-        // Replace Unicode minus sign (−) with ASCII hyphen-minus (-)
-        return input.replaceAll('−', '-');
-    }
-    convertToUnicodeMinus(input) {
-        // Replace ASCII hyphen-minus (-) with Unicode minus sign (−)
-        return input.replaceAll('-', '−');
-    }
-    parseValue(value) {
-        if (typeof value === 'string') {
-            return Number.parseFloat(this.unifyMinusSign(value));
-        }
-        return value;
-    }
-    formatValue(value, suffix) {
-        const constructedValue = `${value} ${suffix}`;
-        if (value > 0) {
-            return '+' + constructedValue;
-        }
-        return this.convertToUnicodeMinus(constructedValue);
-    }
-    getArrowIcon() {
-        return (h("limel-icon", { class: "icon", name: "right", "aria-hidden": "true", role: "presentation" }));
-    }
-    static get watchers() { return {
-        "value": ["valueChanged"]
-    }; }
-    static get style() { return LimebbTrendIndicatorStyle0; }
-}, [1, "limebb-trend-indicator", {
-        "platform": [16],
-        "context": [16],
-        "value": [520],
-        "formerValue": [514, "former-value"],
-        "suffix": [513],
-        "label": [513],
-        "invalid": [516],
-        "required": [516],
-        "helperText": [513, "helper-text"],
-        "reducePresence": [516, "reduce-presence"]
-    }, undefined, {
-        "value": ["valueChanged"]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["limebb-trend-indicator"];
-    components.forEach(tagName => { switch (tagName) {
-        case "limebb-trend-indicator":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, TrendIndicator);
-            }
-            break;
-    } });
-}
-
-const LimebbTrendIndicator = TrendIndicator;
-const defineCustomElement = defineCustomElement$1;
-
-export { LimebbTrendIndicator, defineCustomElement };
+import{proxyCustomElement as o,HTMLElement as r,h as e,Host as t,transformTag as a}from"@stencil/core/internal/client";import{g as i}from"./percentage-class.js";const s=o(class extends r{valueChanged(o){this.numValue=this.parseValue(o)}constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.suffix="%",this.reducePresence=!0,this.labelId="a"+crypto.randomUUID(),this.tooltipId="a"+crypto.randomUUID(),this.helperTextId="a"+crypto.randomUUID(),this.renderHelperLine=()=>{if(this.hasHelperText())return e("limel-helper-line",{helperTextId:this.helperTextId,helperText:this.helperText,invalid:this.invalid})},this.hasHelperText=()=>null!=this.helperText,this.numValue=this.parseValue(this.value)}render(){return e(t,{key:"2a1afbc5e7368e2c033a9d89f2566489ea147840",class:this.getContainerClassList()},e("limel-notched-outline",{key:"198a49e64e1c879390a5c192613c1b0eaf9cd0b8",id:this.tooltipId,label:this.label,labelId:this.labelId,invalid:this.invalid,required:this.required,hasValue:!0,hasFloatingLabel:!0,"aria-labelledby":this.labelId,"aria-describedby":this.helperTextId,"aria-controls":this.helperTextId},e("div",{key:"a5978efcea8a73c1300460982c27af2e5e8e85c4",slot:"content",tabIndex:0},this.renderVisualization())),this.renderHelperLine(),this.renderTooltip())}renderVisualization(){if(!this.reducePresence||0!==this.numValue&&this.hasValue())return this.hasValue()?[this.getArrowIcon(),e("span",null,this.renderGrowthPercentage(),this.renderGrowthAmount())]:e("span",{class:"no-value"},"–")}renderTooltip(){if(void 0===this.formerValue)return;const o=this.value+" - "+(this.formerValue>0?this.formerValue:"("+this.formerValue+")")+" = "+this.calculateGrowth()+` ${this.suffix}  `,r=this.calculatePercentage();return e("limel-tooltip",{openDirection:"top-start",elementId:this.tooltipId,label:r+"%",helperLabel:o})}renderGrowthPercentage(){if(void 0===this.formerValue)return this.formatValue(this.numValue,this.suffix);const o=this.calculatePercentage();return null!==o?this.formatValue(o,"%"):void 0}renderGrowthAmount(){if(void 0===this.formerValue)return;const o=this.calculateGrowth();return e("span",{class:"growth-unit"},"( ",this.formatValue(o,this.suffix)," )")}hasValue(){return null!=this.value&&""!==this.value}getContainerClassList(){if(!this.hasValue())return;const o=this.getPercentage(),r=i(o);return Object.assign({},r&&{[r]:!0})}getPercentage(){return void 0===this.formerValue?this.numValue:this.calculatePercentage()}calculateGrowth(){return this.numValue-this.formerValue}calculatePercentage(){return 0===this.formerValue?null:Number.parseFloat(((this.numValue-this.formerValue)/Math.abs(this.formerValue)*100).toFixed(2))}unifyMinusSign(o){return o.replaceAll("−","-")}convertToUnicodeMinus(o){return o.replaceAll("-","−")}parseValue(o){return"string"==typeof o?Number.parseFloat(this.unifyMinusSign(o)):o}formatValue(o,r){const e=`${o} ${r}`;return o>0?"+"+e:this.convertToUnicodeMinus(e)}getArrowIcon(){return e("limel-icon",{class:"icon",name:"right","aria-hidden":"true",role:"presentation"})}static get watchers(){return{value:[{valueChanged:0}]}}static get style(){return'@charset "UTF-8";*{box-sizing:border-box}:host(limebb-trend-indicator){position:relative;display:block;height:100%;width:100%}limel-notched-outline:not([invalid]:not([invalid=false])) .limel-notched-outline--outlines{--limel-notched-outline-border-color:transparent}div[slot=content]{display:flex;align-items:center;gap:0.5rem;border-radius:inherit;background-color:transparent !important}div[slot=content]:focus{outline:none}div[slot=content]:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}:host(limebb-trend-indicator):has(label) div[slot=content]{min-height:2.5rem;padding:0 0.375rem 0 1rem}:host(limebb-trend-indicator[former-value]) div[slot=content]{cursor:help}div[slot=content] span{flex-shrink:0}.icon{flex-shrink:0;display:flex;transition-property:color, background-color, transform;transition-duration:0.4s;transition-timing-function:ease;width:1.25rem;height:1.25rem;border-radius:50%;padding:0.12rem;color:rgb(var(--color-white));background-color:rgb(var(--color-gray-default), 0.5)}:host(.has-value-40to30-negative) .icon{color:rgb(var(--color-gray-darker))}:host(.has-value-30to20-negative) .icon{color:rgb(var(--color-gray-darker))}:host(.has-value-20to10-negative) .icon{color:rgb(var(--color-gray-darker))}:host(.has-value-10to0-negative) .icon{color:rgb(var(--color-gray-darker))}:host(.has-value-0to10-positive) .icon{color:rgb(var(--color-gray-dark))}:host(.has-value-10to20-positive) .icon{color:rgb(var(--color-gray-dark))}:host(.has-value-20to30-positive) .icon{color:rgb(var(--color-gray-dark))}:host(.has-value-30to40-positive) .icon{color:rgb(var(--color-gray-dark))}:host(.has-value-200or-larger-negative) .icon{background-color:rgb(var(--color-red-darker));transform:rotate(90deg)}:host(.has-value-200to100-negative) .icon{background-color:rgb(var(--color-red-dark));transform:rotate(90deg)}:host(.has-value-100to90-negative) .icon{background-color:rgb(var(--color-red-dark));transform:rotate(90deg)}:host(.has-value-90to80-negative) .icon{background-color:rgb(var(--color-red-dark));transform:rotate(81deg)}:host(.has-value-80to70-negative) .icon{background-color:rgb(var(--color-red-default));transform:rotate(72deg)}:host(.has-value-70to60-negative) .icon{background-color:rgb(var(--color-red-default));transform:rotate(63deg)}:host(.has-value-60to50-negative) .icon{background-color:rgb(var(--color-coral-default));transform:rotate(54deg)}:host(.has-value-50to40-negative) .icon{background-color:rgb(var(--color-coral-default));transform:rotate(45deg)}:host(.has-value-40to30-negative) .icon{background-color:rgb(var(--color-orange-default));transform:rotate(36deg)}:host(.has-value-30to20-negative) .icon{background-color:rgb(var(--color-orange-default));transform:rotate(27deg)}:host(.has-value-20to10-negative) .icon{background-color:rgb(var(--color-amber-default));transform:rotate(18deg)}:host(.has-value-10to0-negative) .icon{background-color:rgb(var(--color-amber-default));transform:rotate(9deg)}:host(.has-value-0) .icon{background-color:rgb(var(--color-gray-default));transform:rotate(0deg)}:host(.has-value-0to10-positive) .icon{background-color:rgb(var(--color-yellow-default));transform:rotate(-9deg)}:host(.has-value-10to20-positive) .icon{background-color:rgb(var(--color-yellow-default));transform:rotate(-18deg)}:host(.has-value-20to30-positive) .icon{background-color:rgb(var(--color-grass-default));transform:rotate(-27deg)}:host(.has-value-30to40-positive) .icon{background-color:rgb(var(--color-grass-default));transform:rotate(-36deg)}:host(.has-value-40to50-positive) .icon{background-color:rgb(var(--color-lime-default));transform:rotate(-45deg)}:host(.has-value-50to60-positive) .icon{background-color:rgb(var(--color-lime-default));transform:rotate(-54deg)}:host(.has-value-60to70-positive) .icon{background-color:rgb(var(--color-teal-default));transform:rotate(-63deg)}:host(.has-value-70to80-positive) .icon{background-color:rgb(var(--color-teal-default));transform:rotate(-72deg)}:host(.has-value-80to90-positive) .icon{background-color:rgb(var(--color-teal-dark));transform:rotate(-81deg)}:host(.has-value-90to100-positive) .icon{background-color:rgb(var(--color-teal-dark));transform:rotate(-90deg)}:host(.has-value-100to200-positive) .icon{background-color:rgb(var(--color-teal-dark));transform:rotate(-90deg)}:host(.has-value-200or-larger-positive) .icon{background-color:rgb(var(--color-teal-darker));transform:rotate(-90deg)}:host(.has-value-0) .icon{background-color:rgb(var(--color-gray-default), 0.5);transform:rotate(0deg)}:host(.has-value-0) .icon polyline{color:transparent}:host(.has-value-200or-larger-negative) .icon:after,:host(.has-value-200or-larger-negative) .icon:before,:host(.has-value-200to100-negative) .icon:after,:host(.has-value-200to100-negative) .icon:before,:host(.has-value-100to200-positive) .icon:after,:host(.has-value-100to200-positive) .icon:before,:host(.has-value-200or-larger-positive) .icon:after,:host(.has-value-200or-larger-positive) .icon:before{transition:border-color 0.6s ease;content:"";position:absolute;inset:0;margin:auto;border:1px solid transparent;border-radius:50%}:host(.has-value-200or-larger-negative) .icon:before,:host(.has-value-200to100-negative) .icon:before,:host(.has-value-100to200-positive) .icon:before,:host(.has-value-200or-larger-positive) .icon:before{transform:scale(1.2)}:host(.has-value-200or-larger-negative) .icon:after,:host(.has-value-200to100-negative) .icon:after,:host(.has-value-100to200-positive) .icon:after,:host(.has-value-200or-larger-positive) .icon:after{transform:scale(1.4);opacity:0.4}:host(.has-value-200to100-negative) .icon:before,:host(.has-value-200or-larger-negative) .icon:before{border-color:rgb(var(--color-red-dark))}:host(.has-value-200or-larger-negative) .icon:after{border-color:rgb(var(--color-red-darker))}:host(.has-value-100to200-positive) .icon:before,:host(.has-value-200or-larger-positive) .icon:before{border-color:rgb(var(--color-teal-dark))}:host(.has-value-200or-larger-positive) .icon:after{border-color:rgb(var(--color-teal-darker))}.no-value{transform:translateY(0.5rem)}.growth-unit{padding-left:0.5rem;opacity:0.5}:host(limebb-trend-indicator:focus),:host(limebb-trend-indicator:focus-visible),:host(limebb-trend-indicator:focus-within){--limel-h-l-grid-template-rows-transition-speed:0.46s;--limel-h-l-grid-template-rows:1fr}:host(limebb-trend-indicator){--limel-h-l-grid-template-rows-transition-speed:0.3s;--limel-h-l-grid-template-rows:0fr}:host(limebb-trend-indicator:focus) limel-helper-line,:host(limebb-trend-indicator:focus-visible) limel-helper-line,:host(limebb-trend-indicator:focus-within) limel-helper-line,:host(limebb-trend-indicator:hover) limel-helper-line{will-change:grid-template-rows}'}},[1,"limebb-trend-indicator",{platform:[16],context:[16],value:[520],formerValue:[514,"former-value"],suffix:[513],label:[513],invalid:[516],required:[516],helperText:[513,"helper-text"],reducePresence:[516,"reduce-presence"]},void 0,{value:[{valueChanged:0}]}]),l=s,n=function(){"undefined"!=typeof customElements&&["limebb-trend-indicator"].forEach((o=>{"limebb-trend-indicator"===o&&(customElements.get(a(o))||customElements.define(a(o),s))}))};export{l as LimebbTrendIndicator,n as defineCustomElement}

package/dist/components/limebb-typing-indicator.js

@@ -1,6 +1 @@
-import { T as TypingIndicator, d as defineCustomElement$1 } from './typing-indicator.js';
-
-const LimebbTypingIndicator = TypingIndicator;
-const defineCustomElement = defineCustomElement$1;
-
-export { LimebbTypingIndicator, defineCustomElement };
+import{T as o,d as t}from"./typing-indicator.js";const i=o,r=t;export{i as LimebbTypingIndicator,r as defineCustomElement}

package/dist/components/limetype-field.js

@@ -1,216 +1 @@
-import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
-import { c } from './index.esm.js';
-import { g as getIcon } from './limetype.js';
-import { i as isNonNull } from './non-null.js';
-import { b as baseIsEqual } from './_baseIsEqual.js';
-import { i as isArray, a as isObjectLike, b as baseGetTag } from './_Map.js';
-
-/** `Object#toString` result references. */
-var stringTag = '[object String]';
-
-/**
- * Checks if `value` is classified as a `String` primitive or object.
- *
- * @static
- * @since 0.1.0
- * @memberOf _
- * @category Lang
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is a string, else `false`.
- * @example
- *
- * _.isString('abc');
- * // => true
- *
- * _.isString(1);
- * // => false
- */
-function isString(value) {
-  return typeof value == 'string' ||
-    (!isArray(value) && isObjectLike(value) && baseGetTag(value) == stringTag);
-}
-
-/**
- * Performs a deep comparison between two values to determine if they are
- * equivalent.
- *
- * **Note:** This method supports comparing arrays, array buffers, booleans,
- * date objects, error objects, maps, numbers, `Object` objects, regexes,
- * sets, strings, symbols, and typed arrays. `Object` objects are compared
- * by their own, not inherited, enumerable properties. Functions and DOM
- * nodes are compared by strict equality, i.e. `===`.
- *
- * @static
- * @memberOf _
- * @since 0.1.0
- * @category Lang
- * @param {*} value The value to compare.
- * @param {*} other The other value to compare.
- * @returns {boolean} Returns `true` if the values are equivalent, else `false`.
- * @example
- *
- * var object = { 'a': 1 };
- * var other = { 'a': 1 };
- *
- * _.isEqual(object, other);
- * // => true
- *
- * object === other;
- * // => false
- */
-function isEqual(value, other) {
-  return baseIsEqual(value, other);
-}
-
-const RELATION_PROPERTY_TYPES = [
-    'belongsto',
-    'hasone',
-    'hasmany',
-    'hasandbelongstomany',
-];
-const DEFAULT_ALLOWED_PROPERTY_TYPES = [
-    'string',
-    'text',
-    'phone',
-    'integer',
-    'decimal',
-    'percent',
-    'time',
-    'date',
-    'year',
-    'quarter',
-    'month',
-    'yesno',
-    'link',
-    'user',
-    'xml',
-    'option',
-    'set',
-    'file',
-    'system',
-];
-
-const allNonSystemPropertyTypes = DEFAULT_ALLOWED_PROPERTY_TYPES.filter((propertyType) => propertyType !== 'system');
-allNonSystemPropertyTypes.push(...RELATION_PROPERTY_TYPES);
-const LimetypeField = /*@__PURE__*/ proxyCustomElement(class LimetypeField extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.change = createEvent(this, "change", 7);
-        /**
-         * A list of property fields that should be updated when the selected limetype changes.
-         */
-        this.propertyFields = [];
-        /**
-         * The name of this field. May be used as reference when a property mapping
-         * depends on the selected limetype.
-         */
-        this.fieldName = 'limetype';
-        this.handleChange = (event) => {
-            event.stopPropagation();
-            let selectedLimetype = '';
-            if (event.detail && 'value' in event.detail) {
-                selectedLimetype = event.detail.value;
-            }
-            this.change.emit(selectedLimetype || undefined);
-        };
-    }
-    componentWillLoad() {
-        const language = this.platform
-            .get(c.Application)
-            .getLanguage();
-        this.collator = new Intl.Collator(language, {
-            numeric: true,
-            sensitivity: 'base',
-        });
-    }
-    componentShouldUpdate(newValue, oldValue, property) {
-        var _a, _b;
-        return (property !== 'formInfo' ||
-            !isEqual((_a = newValue === null || newValue === void 0 ? void 0 : newValue.schema) === null || _a === void 0 ? void 0 : _a.oneOf, (_b = oldValue === null || oldValue === void 0 ? void 0 : oldValue.schema) === null || _b === void 0 ? void 0 : _b.oneOf));
-    }
-    render() {
-        var _a;
-        const options = this.getLimeTypes().map(limeTypeToOption);
-        options.sort((a, b) => this.collator.compare(a.text, b.text));
-        let selectedOption = options.find((option) => option.value === this.value);
-        let invalid = this.invalid;
-        if (this.value && !selectedOption) {
-            invalid = true;
-            options.unshift({
-                text: ((_a = this.limeTypeRepository.getLimeType(this.value)) === null || _a === void 0 ? void 0 : _a.localname.singular) || this.value,
-                value: this.value,
-            });
-            selectedOption = options[0];
-        }
-        const emptyOption = {
-            text: '',
-            value: '',
-        };
-        options.unshift(emptyOption);
-        return (h("limel-select", { key: '6afce0cc51d4c8175599d36c6035316b0dcaf165', label: this.label, options: options, value: selectedOption, required: this.required, helperText: this.helperText, invalid: invalid, disabled: this.disabled || this.readonly, onChange: this.handleChange }));
-    }
-    componentWillRender() {
-        this.updatePropertyFields(this.value || '');
-    }
-    getLimeTypes() {
-        var _a, _b;
-        let limetypes = this.limetypes;
-        if ((_b = (_a = this.formInfo) === null || _a === void 0 ? void 0 : _a.schema) === null || _b === void 0 ? void 0 : _b.oneOf) {
-            limetypes = this.formInfo.schema.oneOf
-                .map((choice) => choice.const)
-                .filter(isString);
-        }
-        if (!limetypes) {
-            return this.limeTypeRepository.getLimeTypes();
-        }
-        return limetypes
-            .map((limetype) => this.limeTypeRepository.getLimeType(limetype))
-            .filter(isNonNull);
-    }
-    updatePropertyFields(selectedLimetype) {
-        for (const field of this.propertyFields) {
-            field.limetype = selectedLimetype;
-            if (field.allowedPropertyTypes === DEFAULT_ALLOWED_PROPERTY_TYPES) {
-                field.allowedPropertyTypes = allNonSystemPropertyTypes;
-            }
-        }
-    }
-    get limeTypeRepository() {
-        return this.platform.get(c.LimeTypeRepository);
-    }
-}, [0, "limebb-limetype-field", {
-        "platform": [16],
-        "context": [16],
-        "label": [513],
-        "required": [516],
-        "readonly": [516],
-        "disabled": [516],
-        "value": [513],
-        "helperText": [513, "helper-text"],
-        "invalid": [4],
-        "limetypes": [16],
-        "propertyFields": [16],
-        "fieldName": [1, "field-name"],
-        "formInfo": [16]
-    }]);
-const limeTypeToOption = (limetype) => ({
-    text: limetype.localname.singular,
-    value: limetype.name,
-    icon: getIcon(limetype),
-});
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["limebb-limetype-field"];
-    components.forEach(tagName => { switch (tagName) {
-        case "limebb-limetype-field":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, LimetypeField);
-            }
-            break;
-    } });
-}
-
-export { LimetypeField as L, defineCustomElement as d };
+import{proxyCustomElement as e,HTMLElement as t,createEvent as i,h as s,transformTag as l}from"@stencil/core/internal/client";import{n as o}from"./index.esm.js";import{g as n}from"./limetype.js";import{i as r}from"./non-null.js";import{b as a}from"./_baseIsEqual.js";import{i as m,a as d,b as h}from"./_Map.js";function p(e){return"string"==typeof e||!d(e)&&m(e)&&"[object String]"==h(e)}const u=["string","text","phone","integer","decimal","percent","time","date","year","quarter","month","yesno","link","user","xml","option","set","file","system"],c=u.filter((e=>"system"!==e));c.push("belongsto","hasone","hasmany","hasandbelongstomany");const f=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.change=i(this,"change",7),this.propertyFields=[],this.fieldName="limetype",this.handleChange=e=>{e.stopPropagation();let t="";e.detail&&"value"in e.detail&&(t=e.detail.value),this.change.emit(t||void 0)}}componentWillLoad(){const e=this.platform.get(o.Application).getLanguage();this.collator=new Intl.Collator(e,{numeric:!0,sensitivity:"base"})}componentShouldUpdate(e,t,i){var s,l,o,n;return"formInfo"!==i||(o=null===(s=null==e?void 0:e.schema)||void 0===s?void 0:s.oneOf,n=null===(l=null==t?void 0:t.schema)||void 0===l?void 0:l.oneOf,!a(o,n))}render(){var e;const t=this.getLimeTypes().map(v);t.sort(((e,t)=>this.collator.compare(e.text,t.text)));let i=t.find((e=>e.value===this.value)),l=this.invalid;return this.value&&!i&&(l=!0,t.unshift({text:(null===(e=this.limeTypeRepository.getLimeType(this.value))||void 0===e?void 0:e.localname.singular)||this.value,value:this.value}),i=t[0]),t.unshift({text:"",value:""}),s("limel-select",{key:"787fa8e4d631882d235eaa64823f74879324d467",label:this.label,options:t,value:i,required:this.required,helperText:this.helperText,invalid:l,disabled:this.disabled||this.readonly,onChange:this.handleChange})}componentWillRender(){this.updatePropertyFields(this.value||"")}getLimeTypes(){var e,t;let i=this.limetypes;return(null===(t=null===(e=this.formInfo)||void 0===e?void 0:e.schema)||void 0===t?void 0:t.oneOf)&&(i=this.formInfo.schema.oneOf.map((e=>e.const)).filter(p)),i?i.map((e=>this.limeTypeRepository.getLimeType(e))).filter(r):this.limeTypeRepository.getLimeTypes()}updatePropertyFields(e){for(const t of this.propertyFields)t.limetype=e,t.allowedPropertyTypes===u&&(t.allowedPropertyTypes=c)}get limeTypeRepository(){return this.platform.get(o.LimeTypeRepository)}},[0,"limebb-limetype-field",{platform:[16],context:[16],label:[513],required:[516],readonly:[516],disabled:[516],value:[513],helperText:[513,"helper-text"],invalid:[4],limetypes:[16],propertyFields:[16],fieldName:[1,"field-name"],formInfo:[16]}]),v=e=>({text:e.localname.singular,value:e.name,icon:n(e)});function y(){"undefined"!=typeof customElements&&["limebb-limetype-field"].forEach((e=>{"limebb-limetype-field"===e&&(customElements.get(l(e))||customElements.define(l(e),f))}))}export{f as L,y as d}

package/dist/components/limetype.js

@@ -1,85 +1 @@
-import { Y as Ye, q as qe } from './index.esm.js';
-
-/**
- * Get the color for a limetype from its UI configuration
- *
- * @param limetype the limetype
- * @returns the color string (CSS variable or RGB)
- */
-function getColor(limetype) {
-    var _a;
-    const limetypeWithUI = limetype;
-    const color = ((_a = limetypeWithUI === null || limetypeWithUI === void 0 ? void 0 : limetypeWithUI.ui) === null || _a === void 0 ? void 0 : _a.color) || 'rgb(var(--color-gray-default))';
-    return getLimeColor(color);
-}
-/**
- * Convert lime color references to CSS variables
- *
- * @param color the color string
- * @returns CSS-ready color string
- */
-function getLimeColor(color) {
-    if (color.startsWith('lime-')) {
-        return `var(--${color})`;
-    }
-    return color;
-}
-/**
- * Get the icon configuration for a limetype
- *
- * @param limetype the limetype
- * @returns Icon object with name and color
- */
-function getIcon(limetype) {
-    var _a;
-    const limetypeWithUI = limetype;
-    return {
-        name: ((_a = limetypeWithUI === null || limetypeWithUI === void 0 ? void 0 : limetypeWithUI.ui) === null || _a === void 0 ? void 0 : _a.icon) || 'decision',
-        color: getColor(limetype),
-    };
-}
-/**
- * Whether the given object has the given label or not.
- *
- * @param object the object to check label for
- * @param label the label to check for
- * @returns true if the object has the label
- */
-function hasLabel(object, label) {
-    return object.label === label;
-}
-/**
- * Whether the given property is a hasmany relation or not.
- *
- * @param property the property to check
- * @returns true if the property is a hasmany relation
- */
-function isManyRelation(property) {
-    return Ye(property) && !qe(property);
-}
-/**
- * Finds a relation property on the given limetype that is related to a
- * limetype with the given label.
- *
- * @param limetype the limetype to search for the relation property
- * @param label the label of the target limetype to match
- * @returns the relation property or undefined
- */
-function getRelationProperty(limetype, label) {
-    return Object.values(limetype.properties).find((property) => property &&
-        property.relation &&
-        hasLabel(property.relation.getLimetype(), label));
-}
-/**
- * Whether the limetype has a hasmany relation of a limetype with the given label
- *
- * @param limetype the limetype
- * @param relatedLabel the label of the related limetype
- * @returns true if the limetype has the hasmany relation
- */
-function hasHasManyRelation(limetype, relatedLabel) {
-    const property = getRelationProperty(limetype, relatedLabel);
-    return !!property && isManyRelation(property);
-}
-
-export { hasHasManyRelation as a, getRelationProperty as b, getIcon as g, hasLabel as h };
+import{i as n,a as r}from"./index.esm.js";function o(n){var r;return(o=(null===(r=null==n?void 0:n.ui)||void 0===r?void 0:r.color)||"rgb(var(--color-gray-default))").startsWith("lime-")?`var(--${o})`:o;var o}function i(n){var r;return{name:(null===(r=null==n?void 0:n.ui)||void 0===r?void 0:r.icon)||"decision",color:o(n)}}function t(n,r){return n.label===r}function u(n,r){return Object.values(n.properties).find((n=>n&&n.relation&&t(n.relation.getLimetype(),r)))}function e(o,i){const t=u(o,i);return!!t&&function(o){return n(o)&&!r(o)}(t)}export{t as a,u as b,i as g,e as h}

package/dist/components/live-docs-info.js

@@ -1,34 +1 @@
-import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-
-const liveDocsInfoCss = ":host(limebb-live-docs-info){padding:1rem 2rem;display:flex;flex-direction:column;gap:0.5rem;border-style:dashed;border-color:rgb(var(--contrast-700));border-radius:0 0 0.5rem 0.5rem;border-width:0 1px 1px 1px}.header{display:flex;align-items:center;gap:0.5rem}h2,p{margin:0;color:rgb(var(--contrast-1100))}h2{font-size:large;font-weight:300}limel-icon{color:rgb(var(--color-orange-default));width:2rem}a{all:unset;cursor:pointer;transition:color 0.2s ease;color:rgb(var(--color-sky-default));margin-left:0.5rem}a:hover{color:rgb(var(--color-sky-dark));text-decoration:underline}";
-const LimebbLiveDocsInfoStyle0 = liveDocsInfoCss;
-
-const LiveDocsInfo = /*@__PURE__*/ proxyCustomElement(class LiveDocsInfo extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-    }
-    render() {
-        return [
-            h("div", { key: 'b1c708e240f019acae3db9080b1f290f05b8881d', class: "header" }, h("limel-icon", { key: 'b4ad9a1d4930440c56dda2921a8ad53014a358c7', name: "not_showing_video_frames" }), h("h2", { key: 'c9f7e21b877108dcf1d0b437d1d9bf91f530dc1f' }, "Viewing this file type requires ", h("em", { key: '693989ef194e41dd8d21d2735579ad3881ee67fa' }, "Live Docs"))),
-            h("p", { key: '8e7c3c6f99af14853bf468227a8d17e5fcc51ea9' }, h("em", { key: '2517714215e61815a86e3aa3b6e92d39c7a3a427' }, "Live Docs"), " not only enables you to view many file formats such as Microsoft Office documents, but it also empowers you to edit them right in the CRM. No need to download anything on your device!", h("a", { key: '0bb7bb2aa1d8ea61300077e25d75f2811729ddcb', target: "_blank", href: "https://www.lime-technologies.com/en/lime-crm/live-docs/" }, "Learn more")),
-        ];
-    }
-    static get style() { return LimebbLiveDocsInfoStyle0; }
-}, [1, "limebb-live-docs-info"]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["limebb-live-docs-info"];
-    components.forEach(tagName => { switch (tagName) {
-        case "limebb-live-docs-info":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, LiveDocsInfo);
-            }
-            break;
-    } });
-}
-
-export { LiveDocsInfo as L, defineCustomElement as d };
+import{proxyCustomElement as e,HTMLElement as o,h as r,transformTag as t}from"@stencil/core/internal/client";const i=e(class extends o{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow()}render(){return[r("div",{key:"5f9144749ff7b224d295d6506a32aaf54e1c4542",class:"header"},r("limel-icon",{key:"80e16ca4da86fdd97da0535c456fceab8ecb0182",name:"not_showing_video_frames"}),r("h2",{key:"1731b18ef15e6f54049e46d47bc6ca512d016cce"},"Viewing this file type requires ",r("em",{key:"36b1e19d984f1b41460297c53188827d2823b0a5"},"Live Docs"))),r("p",{key:"5f32a3c94a1aa5b51c11227e4916cb73223f61f4"},r("em",{key:"e40cf97f43695825a4695b285b3ff601db25d375"},"Live Docs")," not only enables you to view many file formats such as Microsoft Office documents, but it also empowers you to edit them right in the CRM. No need to download anything on your device!",r("a",{key:"22ccc31b5e3178f0d93ff5be59cfb8cb7bcba137",target:"_blank",href:"https://www.lime-technologies.com/en/lime-crm/live-docs/"},"Learn more"))]}static get style(){return":host(limebb-live-docs-info){padding:1rem 2rem;display:flex;flex-direction:column;gap:0.5rem;border-style:dashed;border-color:rgb(var(--contrast-700));border-radius:0 0 0.5rem 0.5rem;border-width:0 1px 1px 1px}.header{display:flex;align-items:center;gap:0.5rem}h2,p{margin:0;color:rgb(var(--contrast-1100))}h2{font-size:large;font-weight:300}limel-icon{color:rgb(var(--color-orange-default));width:2rem}a{all:unset;cursor:pointer;transition:color 0.2s ease;color:rgb(var(--color-sky-default));margin-left:0.5rem}a:hover{color:rgb(var(--color-sky-dark));text-decoration:underline}"}},[1,"limebb-live-docs-info"]);function c(){"undefined"!=typeof customElements&&["limebb-live-docs-info"].forEach((e=>{"limebb-live-docs-info"===e&&(customElements.get(t(e))||customElements.define(t(e),i))}))}export{i as L,c as d}