overview-components 1.0.92 → 1.0.93

package/dist/shared/lit-button.js

@@ -0,0 +1,156 @@
+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 { LitElement, html, css } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+// styles
+import buttonStyles from './styles/button-shared-styles.js';
+// elements
+import './lit-icon.js';
+import './lit-pill.js';
+import './lit-loader.js';
+let LitButton = class LitButton extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.variant = 'contained';
+        this.size = 'medium';
+        this.label = 'Button';
+        this.fullWidth = false;
+        this.disabled = false;
+        this.count = undefined;
+        this.active = false;
+        this.isLoading = false;
+    }
+    render() {
+        const classes = `button--${this.size} button--${this.variant} ${this.fullWidth ? 'button--fullWidth' : ''} ${this.active ? 'active' : ''}`;
+        const hasCount = this.count !== undefined && this.count !== null && this.count >= 0;
+        return html `
+            <button ?disabled=${this.disabled} @click=${this.onClick} class=${classes}>
+                <div class="button--content">
+                    ${this.isLoading
+            ? html ` <lit-loader size="small" class="button--loader"></lit-loader> `
+            : null}
+
+                    <div
+                        class="button-inner"
+                        style="visibility: ${this.isLoading ? 'hidden' : 'visible'};
+                    "
+                    >
+                        <slot name="start-icon">
+                            ${this.icon
+            ? html `<lit-icon
+                                      class="start-icon"
+                                      size="1.25rem"
+                                      icon="${this.icon}"
+                                  ></lit-icon>`
+            : ''}
+                        </slot>
+                        ${this.label}
+                        ${hasCount ? html `<lit-pill count=${this.count}></lit-pill>` : ''}
+                    </div>
+                </div>
+            </button>
+        `;
+    }
+};
+LitButton.styles = [
+    // styles,
+    buttonStyles,
+    css `
+            /* Basic button styles */
+            button {
+                line-height: 1.5rem;
+                flex-direction: row;
+                justify-content: center;
+            }
+
+            /* Size Variants */
+            .button--small {
+                -webkit-padding: 0.375rem 1rem;
+                padding: 0.1875rem 0.375rem;
+                font-size: 11px;
+            }
+            .button--medium {
+                font-size: 0.75rem;
+                font-weight: 500;
+                -webkit-padding: 0.375rem 0.75rem;
+                padding: 0.375rem 0.75rem;
+            }
+            .button--large {
+                font-weight: 700;
+                -webkit-padding: 0.75rem 1.5rem;
+                padding: 0.75rem 1.5rem;
+                font-size: 0.875rem;
+            }
+
+            /* FullWidth style */
+            .button--fullWidth {
+                width: 100%;
+                display: block;
+            }
+            ::slotted([slot='start-icon']),
+            .start-icon {
+                //margin-right: 8px;
+                font-size: 1.25rem !important;
+            }
+
+            .button--content {
+                position: relative;
+                display: inline-flex;
+                align-items: center;
+                justify-content: center;
+            }
+
+            .button--loader {
+                position: absolute;
+                left: 50%;
+                top: 50%;
+                transform: translate(-50%, -50%);
+            }
+
+            .button-inner {
+                display: inline-flex;
+                align-items: center;
+                gap: 0.5rem;
+                visibility: visible;
+            }
+        `,
+];
+__decorate([
+    property({ type: String })
+], LitButton.prototype, "variant", void 0);
+__decorate([
+    property({ type: String })
+], LitButton.prototype, "size", void 0);
+__decorate([
+    property({ type: String })
+], LitButton.prototype, "label", void 0);
+__decorate([
+    property({ type: String })
+], LitButton.prototype, "icon", void 0);
+__decorate([
+    property({ type: Boolean })
+], LitButton.prototype, "fullWidth", void 0);
+__decorate([
+    property({ type: Boolean })
+], LitButton.prototype, "disabled", void 0);
+__decorate([
+    property({ type: Number })
+], LitButton.prototype, "count", void 0);
+__decorate([
+    property({ type: Function })
+], LitButton.prototype, "onClick", void 0);
+__decorate([
+    property({ type: Boolean })
+], LitButton.prototype, "active", void 0);
+__decorate([
+    property({ type: Boolean })
+], LitButton.prototype, "isLoading", void 0);
+LitButton = __decorate([
+    customElement('lit-button')
+], LitButton);
+export { LitButton };
+//# sourceMappingURL=lit-button.js.map

package/dist/shared/lit-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"lit-button.js","sourceRoot":"","sources":["../../src/shared/lit-button.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAkC,MAAM,KAAK,CAAC;AAC5E,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,SAAS;AACT,OAAO,YAAY,MAAM,kCAAkC,CAAC;AAE5D,WAAW;AACX,OAAO,eAAe,CAAC;AACvB,OAAO,eAAe,CAAC;AACvB,OAAO,iBAAiB,CAAC;AAclB,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,UAAU;IAAlC;;QACyB,YAAO,GAAmB,WAAW,CAAC;QACtC,SAAI,GAAkC,QAAQ,CAAC;QAC/C,UAAK,GAAY,QAAQ,CAAC;QAEzB,cAAS,GAAa,KAAK,CAAC;QAC5B,aAAQ,GAAa,KAAK,CAAC;QAC5B,UAAK,GAAwB,SAAS,CAAC;QAEtC,WAAM,GAAa,KAAK,CAAC;QACzB,cAAS,GAAa,KAAK,CAAC;IAoG7D,CAAC;IAlCG,MAAM;QACF,MAAM,OAAO,GAAG,WAAW,IAAI,CAAC,IAAI,YAAY,IAAI,CAAC,OAAO,IACxD,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,EAC3C,IAAI,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;QAClC,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,KAAK,KAAK,IAAI,IAAI,IAAI,CAAC,KAAK,IAAI,CAAC,CAAC;QAEpF,OAAO,IAAI,CAAA;gCACa,IAAI,CAAC,QAAQ,WAAW,IAAI,CAAC,OAAO,UAAU,OAAO;;sBAE/D,IAAI,CAAC,SAAS;YACZ,CAAC,CAAC,IAAI,CAAA,iEAAiE;YACvE,CAAC,CAAC,IAAI;;;;6CAIe,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS;;;;8BAIpD,IAAI,CAAC,IAAI;YACP,CAAC,CAAC,IAAI,CAAA;;;8CAGQ,IAAI,CAAC,IAAI;+CACR;YACf,CAAC,CAAC,EAAE;;0BAEV,IAAI,CAAC,KAAK;0BACV,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAA,mBAAmB,IAAI,CAAC,KAAK,cAAc,CAAC,CAAC,CAAC,EAAE;;;;SAIhF,CAAC;IACN,CAAC;;AAjGM,gBAAM,GAAG;IACZ,UAAU;IACV,YAAY;IACZ,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;SA0DF;CACJ,AA9DY,CA8DX;AAzE0B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAuC;AACtC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uCAAgD;AAC/C;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCAA2B;AAC1B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uCAAa;AACX;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;4CAA6B;AAC5B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;2CAA4B;AAC5B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCAAwC;AACrC;IAA7B,QAAQ,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC;0CAAuC;AACvC;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;yCAA0B;AACzB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;4CAA6B;AAVhD,SAAS;IADrB,aAAa,CAAC,YAAY,CAAC;GACf,SAAS,CA8GrB"}

package/dist/shared/lit-case-variables-tab-cell.js

@@ -0,0 +1,226 @@
+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 { LitElement, html, css } from 'lit';
+import { styleMap } from 'lit/directives/style-map.js';
+import { customElement, property } from 'lit/decorators.js';
+// components
+import '../shared/lit-icon.js';
+import '../shared/lit-icon.js';
+import '../shared/lit-button.js';
+import '../shared/simple-tooltip.js';
+// utils
+import { formatDate } from '../utils/date.js';
+let LitCaseVariablesTabCell = class LitCaseVariablesTabCell extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.type = 'string';
+        this.buttonVariant = 'contained';
+        this.buttonFullWidth = true;
+        this.userLang = 'cs';
+        this.BREAKPOINTS = ['xs', 'sm', 'md', 'lg', 'xl'];
+    }
+    getHeader() {
+        return html `
+            <div
+                style="${this.headerStyle ? styleMap(this.headerStyle) : ''}"
+                class="process-data-heading"
+            >
+                ${this.headerName ? this.headerName : ''}
+                ${this.tooltip
+            ? html `
+                          <lit-icon size="12px" icon="informative"></lit-icon>
+                          <simple-tooltip placement="right"
+                              >${this.tooltip ? this.tooltip : ''}</simple-tooltip
+                          >
+                      `
+            : ''}
+            </div>
+        `;
+    }
+    getCellButton() {
+        return html `
+            <lit-button
+                .fullWidth="${this.buttonFullWidth}"
+                variant="${this.buttonVariant}"
+                label="${this.headerName ? this.headerName : ''}"
+                @click=${this.buttonFn}
+            ></lit-button>
+        `;
+    }
+    getCellLink() {
+        return html `
+            <div>${this.getHeader()}</div>
+            <a class="link" href=${this.value ? this.value : ''} target="_blank">
+                ${this.value ? this.value : ''}
+            </a>
+        `;
+    }
+    getCellValue() {
+        return html `
+            <div>${this.getHeader()}</div>
+            <div
+                style="${this.valueStyle ? styleMap(this.valueStyle) : ''}"
+                class="process-data-value"
+            >
+                ${this.value ? this.value : ''}
+            </div>
+        `;
+    }
+    getCellDate() {
+        return html `
+            <div>${this.getHeader()}</div>
+            <div
+                style="${this.valueStyle ? styleMap(this.valueStyle) : ''}"
+                class="process-data-value"
+            >
+                ${this.value
+            ? formatDate(this.value, this.userLang || 'cs', !!this.dateFormat)
+            : ''}
+            </div>
+        `;
+    }
+    render() {
+        const breakpointIndex = this.BREAKPOINTS.indexOf(this.currentBreakpoint);
+        const spanSize = this.BREAKPOINTS.slice(0, breakpointIndex + 1)
+            .reverse()
+            .map((bp) => this.size?.[bp])
+            .find((size) => size !== undefined) ?? 2;
+        const classes = `cell--span${spanSize} cell`;
+        return html `
+            <div
+                class="${classes}"
+                style="${styleMap((this.cellStyle || {}))}"
+            >
+                ${this.type === 'button'
+            ? this.getCellButton()
+            : this.type === 'link'
+                ? this.getCellLink()
+                : this.type === 'date'
+                    ? this.getCellDate()
+                    : this.getCellValue()}
+            </div>
+        `;
+    }
+};
+LitCaseVariablesTabCell.styles = css `
+        :host {
+            font-family: 'Inter', sans-serif;
+        }
+
+        .grid-container {
+            display: grid;
+            justify-content: start;
+            align-items: start;
+            gap: 0.5rem;
+        }
+
+        .process-data-heading {
+            font-size: 0.75rem;
+            color: var(--text-secondary, #5d6371);
+            font-weight: 400 !important;
+            display: flex;
+            gap: 5px;
+            align-items: center;
+        }
+
+        .process-data-value {
+            font-size: 0.8125rem;
+            color: var(--text-primary, #111827);
+            margin: 0;
+            padding-top: 0.3125rem;
+            font-weight: 500 !important;
+        }
+
+        .status {
+            color: var(--color-primary-main, #76b703);
+        }
+
+        .link {
+            font-size: 0.8125rem;
+            text-decoration: none;
+            color: inherit;
+            border-bottom: 0.0625rem solid var(--color-primary-main, #76b703);
+        }
+
+        .cell {
+            padding: 5px;
+            border-radius: 8px;
+        }
+
+        .link:hover {
+            color: var(--color-primary-main, #76b703);
+        }
+
+        .cell--span1 {
+            grid-column: span 1 / span 1;
+        }
+
+        .cell--span2 {
+            grid-column: span 2 / span 2;
+        }
+
+        .cell--span3 {
+            grid-column: span 3 / span 3;
+        }
+
+        .cell--span4 {
+            grid-column: span 4 / span 4;
+        }
+    `;
+__decorate([
+    property({ type: String })
+], LitCaseVariablesTabCell.prototype, "field", void 0);
+__decorate([
+    property({ type: String })
+], LitCaseVariablesTabCell.prototype, "type", void 0);
+__decorate([
+    property({ type: Function })
+], LitCaseVariablesTabCell.prototype, "headerName", void 0);
+__decorate([
+    property({ type: Function })
+], LitCaseVariablesTabCell.prototype, "value", void 0);
+__decorate([
+    property({ type: Object })
+], LitCaseVariablesTabCell.prototype, "size", void 0);
+__decorate([
+    property({ type: String })
+], LitCaseVariablesTabCell.prototype, "buttonVariant", void 0);
+__decorate([
+    property({ type: Boolean })
+], LitCaseVariablesTabCell.prototype, "buttonFullWidth", void 0);
+__decorate([
+    property({ type: Function })
+], LitCaseVariablesTabCell.prototype, "buttonFn", void 0);
+__decorate([
+    property({ type: String })
+], LitCaseVariablesTabCell.prototype, "href", void 0);
+__decorate([
+    property({ type: Object })
+], LitCaseVariablesTabCell.prototype, "headerStyle", void 0);
+__decorate([
+    property({ type: Object })
+], LitCaseVariablesTabCell.prototype, "valueStyle", void 0);
+__decorate([
+    property({ type: Object })
+], LitCaseVariablesTabCell.prototype, "cellStyle", void 0);
+__decorate([
+    property({ type: Function })
+], LitCaseVariablesTabCell.prototype, "tooltip", void 0);
+__decorate([
+    property({ type: String })
+], LitCaseVariablesTabCell.prototype, "dateFormat", void 0);
+__decorate([
+    property({ type: String })
+], LitCaseVariablesTabCell.prototype, "userLang", void 0);
+__decorate([
+    property({ type: String })
+], LitCaseVariablesTabCell.prototype, "currentBreakpoint", void 0);
+LitCaseVariablesTabCell = __decorate([
+    customElement('lit-case-variables-tab-cell')
+], LitCaseVariablesTabCell);
+export { LitCaseVariablesTabCell };
+//# sourceMappingURL=lit-case-variables-tab-cell.js.map

package/dist/shared/lit-case-variables-tab-cell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"lit-case-variables-tab-cell.js","sourceRoot":"","sources":["../../src/shared/lit-case-variables-tab-cell.ts"],"names":[],"mappings":"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"}

package/dist/shared/lit-checkbox.js

@@ -0,0 +1,171 @@
+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 { LitElement, html, css } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { classMap } from 'lit/directives/class-map.js';
+import './lit-label.js';
+let LitCheckbox = class LitCheckbox extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.disabled = false;
+        this.checked = false;
+        this.indeterminate = false;
+        this.onChange = () => { };
+        this.value = '';
+        this.label = '';
+    }
+    // 1) Manually sync the indeterminate property on the <input>
+    updated(changed) {
+        super.updated(changed);
+        const input = this.renderRoot.querySelector('input[type="checkbox"]');
+        if (input) {
+            input.indeterminate = this.indeterminate;
+        }
+    }
+    // 2) Intercept clicks when we're indeterminate
+    _onClick(e) {
+        if (this.indeterminate) {
+            // prevent the browser from toggling .checked for us
+            e.preventDefault();
+            // clear the “?” state
+            this.indeterminate = false;
+            // and leave this.checked as it was (false)
+            // now fire your change callback
+            this._notifyChange(e);
+        }
+        // otherwise let the native click toggle .checked, and @change will fire
+    }
+    // 3) Handle the native change event when not indeterminate
+    _onChange(e) {
+        // update our controlled prop
+        this.checked = e.target.checked;
+        this._notifyChange(e);
+    }
+    _notifyChange(e) {
+        this.dispatchEvent(new CustomEvent('change', {
+            bubbles: true,
+            composed: true,
+            detail: e.target.checked,
+        }));
+        if (typeof this.onChange === 'function') {
+            this.onChange(e);
+        }
+    }
+    render() {
+        return html `
+            <div class="container">
+                ${this.label
+            ? html `
+                          <lit-label label="${this.label}" ?disabled=${this.disabled}> </lit-label>
+                      `
+            : ''}
+                <input
+                    class=${classMap({
+            indeterminate: this.indeterminate,
+            marginLeft: this.label !== '',
+        })}
+                    type="checkbox"
+                    .checked=${this.checked}
+                    ?disabled=${this.disabled}
+                    @click=${this._onClick}
+                    @change=${this._onChange}
+                    .value=${this.value}
+                    aria-label="${this.label || 'checkbox'}"
+                    aria-checked="${this.indeterminate ? 'mixed' : this.checked ? 'true' : 'false'}"
+                    aria-disabled="${this.disabled ? 'true' : 'false'}"
+                />
+            </div>
+        `;
+    }
+};
+LitCheckbox.styles = css `
+        :host {
+            display: inline-block;
+            font-family: Inter, sans-serif;
+        }
+        .container {
+            display: flex;
+            flex-direction: column;
+        }
+        /* Hide the default checkbox */
+        .marginLeft {
+            margin-left: 0.75rem;
+        }
+        input[type='checkbox'] {
+            position: relative;
+            appearance: none;
+            width: 20px;
+            height: 20px;
+            border: 1px solid var(--text-primary, #111827);
+            border-radius: 6px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            background-color: var(--background-paper, #fff);
+            transition: all 0.1s ease-in-out;
+            cursor: pointer;
+        }
+
+        input[type='checkbox'].indeterminate {
+            background-color: var(--color-primary-main, #76b703);
+            border-color: var(--color-primary-main, #76b703);
+        }
+
+        input[type='checkbox'].indeterminate::after {
+            content: '−';
+            color: var(--background-default, #111827);
+            font-size: 16px;
+        }
+
+        /* Custom checkmark */
+        input[type='checkbox']::after {
+            content: '✓';
+            color: var(--background-paper, #111827);
+            font-size: 16px;
+            visible: none;
+        }
+
+        /* Checked state */
+        input[type='checkbox']:checked {
+            background-color: var(--color-primary-main, #76b703);
+            border-color: var(--color-primary-main, #76b703);
+        }
+
+        input[type='checkbox']:checked::after {
+            visible: visibility;
+        }
+
+        /* Disabled state */
+        input[type='checkbox']:disabled {
+            background-color: var(--background-paper, #fff);
+            border-color: var(--color-primary-disabled, #d0d3db);
+            cursor: not-allowed;
+        }
+    `;
+__decorate([
+    property({ type: Boolean })
+], LitCheckbox.prototype, "disabled", void 0);
+__decorate([
+    property({ type: Boolean })
+], LitCheckbox.prototype, "checked", void 0);
+__decorate([
+    property({ type: Boolean })
+], LitCheckbox.prototype, "indeterminate", void 0);
+__decorate([
+    property({ type: Function })
+], LitCheckbox.prototype, "onChange", void 0);
+__decorate([
+    property({ type: String })
+], LitCheckbox.prototype, "value", void 0);
+__decorate([
+    property({ type: String })
+], LitCheckbox.prototype, "label", void 0);
+LitCheckbox = __decorate([
+    customElement('lit-checkbox')
+], LitCheckbox);
+export { LitCheckbox };
+//# sourceMappingURL=lit-checkbox.js.map

package/dist/shared/lit-checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"lit-checkbox.js","sourceRoot":"","sources":["../../src/shared/lit-checkbox.ts"],"names":[],"mappings":"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"}