overview-components 0.8.0 → 1.0.0

package/dist/components/lit-case-variables-tab.js

@@ -14,7 +14,7 @@ import '../shared/lit-button.js';
 import '../shared/lit-tooltip.js';
 // utils
 import { formatDate } from '../utils/date.js';
-import { setLocale } from '../utils/localization';
+import { setLocale } from '../utils/localization.js';
 let LitCaseVariablesTab = class LitCaseVariablesTab extends LitElement {
     constructor() {
         super(...arguments);
@@ -24,6 +24,7 @@ let LitCaseVariablesTab = class LitCaseVariablesTab extends LitElement {
             key: { key: 'string' },
         };
         this.dateFormat = null;
+        this.isLoading = false;
         this.currentBreakpoint = this.getBreakpoint();
         this._resizeListener = this.handleResize.bind(this);
         this.language = 'cs';
@@ -79,7 +80,7 @@ let LitCaseVariablesTab = class LitCaseVariablesTab extends LitElement {
                 class="process-data-value"
             >
                 ${cell?.value
-                ? formatDate(cell.value(this.data[cell.field], this.data), this.userLang || 'cs', this.dateFormat)
+                ? formatDate(cell.value(this.data[cell.field], this.data), this.userLang || 'cs', !!this.dateFormat)
                 : ''}
             </div> `;
         };
@@ -129,44 +130,36 @@ let LitCaseVariablesTab = class LitCaseVariablesTab extends LitElement {
         if (this.hideTabWhen)
             return null;
         return html `
-            ${this.titleLabel
-            ? html `
-                      <div class="section-header">
-                          ${this.titleIcon
-                ? html `<lit-icon size="16px" icon="${this.titleIcon}"></lit-icon>`
-                : ''}
-                          <div class="section-title">${this.titleLabel}</div>
-                      </div>
-                  `
-            : ''}
-            <div class="section-tab">
-                ${this.rows.map((row) => html `
-                        <div class="grid-container">
-                            ${row.map((cell) => {
-            const breakpointIndex = this.BREAKPOINTS.indexOf(this.currentBreakpoint);
-            const spanSize = this.BREAKPOINTS.slice(0, breakpointIndex + 1)
-                .reverse()
-                .map((bp) => cell?.size?.[bp])
-                .find((size) => size !== undefined) ?? 2;
-            const classes = `cell--span${spanSize} cell`;
-            return html `
-                                    <div
-                                        class="${classes}"
-                                        style="${styleMap((cell?.cellStyle || {}))}"
-                                    >
-                                        ${cell?.type === 'button'
-                ? this.getCellButton(cell)
-                : cell.type === 'link'
-                    ? this.getCellLink(cell)
-                    : cell.type === 'date'
-                        ? this.getCellDate(cell)
-                        : this.getCellValue(cell)}
-                                    </div>
-                                `;
-        })}
-                        </div>
-                    `)}
-            </div>
+            ${this.isLoading
+            ? html `<lit-loader></lit-loader>`
+            : html `
+                      ${this.rows.map((row) => html `
+                              <div class="grid-container">
+                                  ${row.map((cell) => {
+                const breakpointIndex = this.BREAKPOINTS.indexOf(this.currentBreakpoint);
+                const spanSize = this.BREAKPOINTS.slice(0, breakpointIndex + 1)
+                    .reverse()
+                    .map((bp) => cell?.size?.[bp])
+                    .find((size) => size !== undefined) ?? 2;
+                const classes = `cell--span${spanSize} cell`;
+                return html `
+                                          <div
+                                              class="${classes}"
+                                              style="${styleMap((cell?.cellStyle || {}))}"
+                                          >
+                                              ${cell?.type === 'button'
+                    ? this.getCellButton(cell)
+                    : cell.type === 'link'
+                        ? this.getCellLink(cell)
+                        : cell.type === 'date'
+                            ? this.getCellDate(cell)
+                            : this.getCellValue(cell)}
+                                          </div>
+                                      `;
+            })}
+                              </div>
+                          `)}
+                  `}
         `;
     }
 };
@@ -176,29 +169,6 @@ LitCaseVariablesTab.styles = [
             :host {
                 font-family: 'Inter', sans-serif;
             }
-            .section-tab {
-                background: var(--background-paper, #ffffff);
-                border-radius: 0.75rem;
-                padding: var(--section-padding, 0.75rem 1rem);
-                box-sizing: border-box;
-                display: grid;
-                gap: 0.5rem;
-                width: 100%;
-            }
-
-            .section-header {
-                display: flex;
-                align-items: center;
-                padding: 0.625rem 1rem 0.625rem 1rem;
-                text-transform: uppercase;
-            }
-
-            .section-title {
-                font-size: 0.6875rem;
-                color: var(--text-secondary, #5d6371);
-                font-weight: 600 !important;
-                margin-left: 0.5rem;
-            }
 
             .grid-container {
                 display: grid;
@@ -211,6 +181,9 @@ LitCaseVariablesTab.styles = [
                 font-size: 0.75rem;
                 color: var(--text-secondary, #5d6371);
                 font-weight: 400 !important;
+                display: flex;
+                gap: 5px;
+                align-items: center;
             }
 
             .process-data-value {
@@ -285,12 +258,6 @@ LitCaseVariablesTab.styles = [
             }
         `,
 ];
-__decorate([
-    property({ type: String })
-], LitCaseVariablesTab.prototype, "titleLabel", void 0);
-__decorate([
-    property({ type: String })
-], LitCaseVariablesTab.prototype, "titleIcon", void 0);
 __decorate([
     property({ type: Array })
 ], LitCaseVariablesTab.prototype, "rows", void 0);
@@ -306,6 +273,9 @@ __decorate([
 __decorate([
     property({ type: String })
 ], LitCaseVariablesTab.prototype, "dateFormat", void 0);
+__decorate([
+    property({ type: Boolean })
+], LitCaseVariablesTab.prototype, "isLoading", void 0);
 __decorate([
     state()
 ], LitCaseVariablesTab.prototype, "currentBreakpoint", void 0);

package/dist/components/lit-case-variables-tab.js.map

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

package/dist/components/lit-chart.d.ts

@@ -0,0 +1,46 @@
+import { LitElement, TemplateResult } from 'lit';
+import '../shared/lit-loader.js';
+export type ChartProps = {
+    type?: string;
+    data?: ChartData;
+    isLoading?: boolean;
+};
+export type ChartData = {
+    labels: string[];
+    datasets: {
+        label?: string;
+        data: number[] | {
+            x: number;
+            y: number;
+            r: number;
+        }[] | {
+            x: [string, string];
+            y: string;
+        }[];
+        backgroundColor?: string | string[];
+        borderColor?: string;
+        borderWidth?: number;
+    }[];
+    title: string;
+};
+export declare class LitChart extends LitElement {
+    type: string;
+    data: ChartData;
+    isLoading: boolean;
+    private chart;
+    static styles: import("lit").CSSResult[];
+    protected updated(changedProperties: Map<string | number | symbol, unknown>): void;
+    private generateColors;
+    private renderChart;
+    private renderGanttChart;
+    private renderPieAndDoughnutChart;
+    private renderBubbleChart;
+    private renderBarAndLineChart;
+    protected render(): TemplateResult | null;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'lit-chart': LitChart;
+    }
+}
+//# sourceMappingURL=lit-chart.d.ts.map

package/dist/components/lit-chart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"lit-chart.d.ts","sourceRoot":"","sources":["../../src/components/lit-chart.ts"],"names":[],"mappings":"AACA,OAAO,EAAa,UAAU,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAE5D,OAAO,yBAAyB,CAAC;AAIjC,MAAM,MAAM,UAAU,GAAG;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG;IACpB,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,QAAQ,EAAE;QACN,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,IAAI,EACE,MAAM,EAAE,GACR;YAAE,CAAC,EAAE,MAAM,CAAC;YAAC,CAAC,EAAE,MAAM,CAAC;YAAC,CAAC,EAAE,MAAM,CAAA;SAAE,EAAE,GACrC;YAAE,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;YAAC,CAAC,EAAE,MAAM,CAAA;SAAE,EAAE,CAAC;QAC3C,eAAe,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;QACpC,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,WAAW,CAAC,EAAE,MAAM,CAAC;KACxB,EAAE,CAAC;IACJ,KAAK,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,qBACa,QAAS,SAAQ,UAAU;IACR,IAAI,EAAE,MAAM,CAAS;IACtB,IAAI,EAAE,SAAS,CAA2C;IACxD,SAAS,EAAE,OAAO,CAAS;IAExD,OAAO,CAAC,KAAK,CAA8C;IAE3D,MAAM,CAAC,MAAM,4BASX;IAEF,SAAS,CAAC,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAMlF,OAAO,CAAC,cAAc;IAQtB,OAAO,CAAC,WAAW;IAenB,OAAO,CAAC,gBAAgB;IA4HxB,OAAO,CAAC,yBAAyB;IAmFjC,OAAO,CAAC,iBAAiB;IAiFzB,OAAO,CAAC,qBAAqB;IAoF7B,SAAS,CAAC,MAAM,IAAI,cAAc,GAAG,IAAI;CAG5C;AAED,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,WAAW,EAAE,QAAQ,CAAC;KACzB;CACJ"}

package/dist/components/lit-chart.js

@@ -0,0 +1,423 @@
+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 { customElement, property } from 'lit/decorators.js';
+import { html, css, LitElement } from 'lit';
+import { Chart, registerables } from 'chart.js';
+import '../shared/lit-loader.js';
+Chart.register(...registerables);
+let LitChart = class LitChart extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.type = 'bar';
+        this.data = { labels: [], datasets: [], title: '' };
+        this.isLoading = false;
+        this.chart = null;
+    }
+    updated(changedProperties) {
+        if (changedProperties.has('type') || changedProperties.has('data')) {
+            this.renderChart();
+        }
+    }
+    generateColors(numColors) {
+        return Array.from({ length: numColors }, () => `rgba(${Math.floor(Math.random() * 255)}, ${Math.floor(Math.random() * 255)}, ${Math.floor(Math.random() * 255)}, 0.6)`);
+    }
+    renderChart() {
+        const canvas = this.shadowRoot?.querySelector('canvas');
+        if (!canvas)
+            return;
+        if (this.type === 'bar' || this.type === 'line') {
+            this.renderBarAndLineChart(canvas);
+        }
+        else if (this.type === 'bubble') {
+            this.renderBubbleChart(canvas);
+        }
+        else if (this.type === 'pie' || this.type === 'doughnut') {
+            this.renderPieAndDoughnutChart(canvas);
+        }
+        else if (this.type === 'gantt') {
+            this.renderGanttChart(canvas);
+        }
+    }
+    renderGanttChart(canvas) {
+        if (this.chart)
+            this.chart.destroy();
+        const colors = this.generateColors(this.data.datasets[0]?.data.length || 0);
+        const datasetsWithColors = this.data.datasets.map((dataset, index) => ({
+            label: dataset.label || `Dataset ${index + 1}`,
+            data: dataset.data.map((entry) => {
+                const startDate = new Date(entry.x[0]);
+                const endDate = new Date(entry.x[1]);
+                return {
+                    x: [
+                        isNaN(startDate.getTime()) ? Date.now() : startDate.getTime(),
+                        isNaN(endDate.getTime()) ? Date.now() : endDate.getTime(),
+                    ],
+                    y: entry.y,
+                };
+            }),
+            backgroundColor: colors,
+            borderColor: colors,
+            borderWidth: 1,
+            barThickness: 16,
+            borderRadius: 4,
+            borderSkipped: false,
+        }));
+        const allDates = this.data.datasets.flatMap((dataset) => dataset.data.flatMap((entry) => [
+            new Date(entry?.x?.[0]).getTime(),
+            new Date(entry?.x?.[1]).getTime(),
+        ]));
+        const minDate = Math.min(...allDates);
+        const maxDate = Math.max(...allDates);
+        // Vypočítanie stepSize pre 20 hodnôt na osi X
+        const dateDifference = maxDate - minDate;
+        const desiredTicks = 20; // Počet požadovaných hodnôt na osi X
+        const stepSize = dateDifference / desiredTicks; // Vypočítanie stepSize
+        this.chart = new Chart(canvas, {
+            type: 'bar',
+            data: {
+                datasets: datasetsWithColors,
+            },
+            options: {
+                indexAxis: 'y',
+                responsive: true,
+                maintainAspectRatio: false,
+                scales: {
+                    x: {
+                        type: 'linear',
+                        ticks: {
+                            stepSize: stepSize, // 30 dní v milisekundách
+                            autoSkip: false,
+                            callback: (value) => {
+                                return new Date(value).toLocaleDateString('sk-SK', {
+                                    day: '2-digit',
+                                    month: '2-digit',
+                                    year: 'numeric',
+                                });
+                            },
+                        },
+                        min: minDate,
+                        max: maxDate,
+                    },
+                    y: {
+                        type: 'category',
+                    },
+                },
+                plugins: {
+                    tooltip: {
+                        callbacks: {
+                            label: function (context) {
+                                const start = new Date(context.raw.x[0]).toLocaleDateString('sk-SK', {
+                                    day: '2-digit',
+                                    month: '2-digit',
+                                    year: 'numeric',
+                                });
+                                const end = new Date(context.raw.x[1]).toLocaleDateString('sk-SK', {
+                                    day: '2-digit',
+                                    month: '2-digit',
+                                    year: 'numeric',
+                                });
+                                return `\u00A0\u00A0Začiatok: ${start}, Koniec: ${end}`;
+                            },
+                        },
+                        bodyFont: {
+                            size: 13,
+                            weight: 400,
+                        },
+                        displayColors: true,
+                        usePointStyle: true,
+                        backgroundColor: 'black',
+                        cornerRadius: 8,
+                    },
+                    legend: {
+                        display: false,
+                    },
+                    title: {
+                        display: true,
+                        text: this.data.title, // Text, ktorý sa zobrazí nad grafom
+                        font: {
+                            size: 17,
+                            weight: 500,
+                        },
+                        color: 'var(--text-primary, #111827)',
+                        padding: {
+                            top: 10,
+                            bottom: 20,
+                        },
+                    },
+                },
+                onHover: (event, chartElement) => {
+                    const target = event.native?.target;
+                    target.style.cursor = chartElement.length ? 'pointer' : 'default';
+                },
+            },
+        });
+    }
+    renderPieAndDoughnutChart(canvas) {
+        if (this.chart)
+            this.chart.destroy();
+        const colors = this.generateColors(this.data.datasets[0]?.data.length || 0);
+        const datasetsWithColors = this.data.datasets.map((dataset) => ({
+            ...dataset,
+            backgroundColor: colors,
+            borderColor: colors,
+            borderWidth: 2,
+            pointBorderWidth: 2,
+        }));
+        this.chart = new Chart(canvas, {
+            type: this.type,
+            data: {
+                labels: this.data.labels,
+                datasets: datasetsWithColors,
+            },
+            options: {
+                responsive: true,
+                maintainAspectRatio: false,
+                plugins: {
+                    legend: {
+                        position: 'top',
+                        labels: {
+                            usePointStyle: true,
+                            pointStyle: 'circle',
+                            font: {
+                                size: 13,
+                                weight: 500,
+                            },
+                        },
+                    },
+                    tooltip: {
+                        callbacks: {
+                            title: () => '',
+                            label: (tooltipItem) => {
+                                const value = tooltipItem.raw || 0;
+                                return `\u00A0\u00A0${tooltipItem.label}: ${tooltipItem.raw}`;
+                            },
+                        },
+                        bodyFont: {
+                            size: 13,
+                            weight: 400,
+                        },
+                        displayColors: true,
+                        usePointStyle: true, // Použitie kruhového symbolu
+                        xAlign: 'center',
+                        yAlign: 'bottom',
+                        padding: 16,
+                        backgroundColor: 'black',
+                        cornerRadius: 8,
+                    },
+                    title: {
+                        display: true,
+                        text: this.data.title, // Text, ktorý sa zobrazí nad grafom
+                        font: {
+                            size: 17,
+                            weight: 500,
+                        },
+                        color: 'var(--text-primary, #111827)',
+                        padding: {
+                            top: 10,
+                            bottom: 20,
+                        },
+                    },
+                },
+                ...(this.type === 'doughnut' && {
+                    cutout: '70%',
+                }),
+                onHover: (event, chartElement) => {
+                    const target = event.native?.target;
+                    if (chartElement.length) {
+                        target.style.cursor = 'pointer'; // Zmena kurzora na ruku
+                    }
+                    else {
+                        target.style.cursor = 'default';
+                    }
+                },
+            },
+        });
+    }
+    renderBubbleChart(canvas) {
+        if (this.chart)
+            this.chart.destroy();
+        const colors = this.generateColors(this.data.datasets.length);
+        const datasets = this.data.datasets.map((dataset, index) => ({
+            ...dataset,
+            backgroundColor: colors[index],
+            borderColor: colors[index],
+            borderWidth: 1,
+            hoverRadius: 10,
+            pointBorderWidth: 2,
+        }));
+        this.chart = new Chart(canvas, {
+            type: 'bubble',
+            data: { datasets },
+            options: {
+                responsive: true,
+                scales: {
+                    x: { beginAtZero: true },
+                    y: { beginAtZero: true },
+                },
+                plugins: {
+                    legend: {
+                        position: 'top',
+                        labels: {
+                            usePointStyle: true, // Použitie kruhového symbolu
+                            pointStyle: 'circle', // Špecifický tvar pre symbol v legende
+                        },
+                    },
+                    tooltip: {
+                        callbacks: {
+                            label: (tooltipItem) => {
+                                const dataPoint = tooltipItem.raw;
+                                return `\u00A0\u00A0x: ${dataPoint.x}, y: ${dataPoint.y}, r: ${dataPoint.r}`;
+                            },
+                        },
+                        bodyFont: {
+                            size: 13,
+                            weight: 400,
+                        },
+                        displayColors: true,
+                        usePointStyle: true, // Použitie kruhového symbolu
+                        xAlign: 'center',
+                        yAlign: 'bottom',
+                        padding: 16,
+                        backgroundColor: 'black',
+                        cornerRadius: 8,
+                    },
+                    title: {
+                        display: true,
+                        text: this.data.title, // Text, ktorý sa zobrazí nad grafom
+                        font: {
+                            size: 17,
+                            weight: 500,
+                        },
+                        color: 'var(--text-primary, #111827)',
+                        padding: {
+                            top: 10,
+                            bottom: 20,
+                        },
+                    },
+                },
+                onHover: (event, chartElement) => {
+                    const target = event.native?.target;
+                    if (chartElement.length) {
+                        target.style.cursor = 'pointer'; // Zmena kurzora na ruku
+                    }
+                    else {
+                        target.style.cursor = 'default';
+                    }
+                },
+            },
+        });
+    }
+    renderBarAndLineChart(canvas) {
+        if (this.chart)
+            this.chart.destroy();
+        const colors = this.generateColors(this.data.datasets.length);
+        const datasetsWithColors = this.data.datasets.map((dataset, index) => ({
+            ...dataset,
+            backgroundColor: colors[index],
+            borderColor: colors[index],
+            borderWidth: 2,
+            ...(this.type === 'bar' ? { borderRadius: 4 } : {}),
+            ...(this.type === 'line'
+                ? {
+                    pointStyle: 'circle',
+                    pointRadius: 3,
+                    pointBorderWidth: 2,
+                    pointBorderColor: colors[index],
+                }
+                : {}),
+        }));
+        this.chart = new Chart(canvas, {
+            type: this.type,
+            data: {
+                labels: this.data.labels,
+                datasets: datasetsWithColors,
+            },
+            options: {
+                responsive: true,
+                maintainAspectRatio: false,
+                plugins: {
+                    legend: {
+                        position: 'top',
+                        labels: {
+                            usePointStyle: true, // Použitie kruhového symbolu
+                            pointStyle: 'circle', // Špecifický tvar pre symbol v legende
+                        },
+                    },
+                    tooltip: {
+                        callbacks: {
+                            title: () => '',
+                            label: (tooltipItem) => {
+                                const value = tooltipItem.raw || 0;
+                                return `\u00A0\u00A0${tooltipItem.label}: ${tooltipItem.raw}`;
+                            },
+                        },
+                        bodyFont: {
+                            size: 13,
+                            weight: 400,
+                        },
+                        displayColors: true,
+                        usePointStyle: true, // Použitie kruhového symbolu
+                        xAlign: 'center',
+                        yAlign: 'bottom',
+                        padding: 16,
+                        backgroundColor: 'black',
+                        cornerRadius: 8,
+                    },
+                    title: {
+                        display: true,
+                        text: this.data.title, // Text, ktorý sa zobrazí nad grafom
+                        font: {
+                            size: 17,
+                            weight: 500,
+                        },
+                        color: 'var(--text-primary, #111827)',
+                        padding: {
+                            top: 10,
+                            bottom: 20,
+                        },
+                    },
+                },
+                onHover: (event, chartElement) => {
+                    const target = event.native?.target;
+                    if (chartElement.length) {
+                        target.style.cursor = 'pointer'; // Zmena kurzora na ruku
+                    }
+                    else {
+                        target.style.cursor = 'default';
+                    }
+                },
+            },
+        });
+    }
+    render() {
+        return html `${this.isLoading ? html `<lit-loader></lit-loader>` : html `<canvas></canvas>`}`;
+    }
+};
+LitChart.styles = [
+    css `
+            canvas {
+                width: 100%;
+                height: 100%;
+                font-family: 'Inter', sans-serif;
+                margin: 0 auto;
+            }
+        `,
+];
+__decorate([
+    property({ type: String })
+], LitChart.prototype, "type", void 0);
+__decorate([
+    property({ type: Array })
+], LitChart.prototype, "data", void 0);
+__decorate([
+    property({ type: Boolean })
+], LitChart.prototype, "isLoading", void 0);
+LitChart = __decorate([
+    customElement('lit-chart')
+], LitChart);
+export { LitChart };
+//# sourceMappingURL=lit-chart.js.map