@dssp/dkpi 1.0.0-y.0 → 1.0.0

package/dist-client/components/kpi-single-boxplot-chart.js

@@ -1,317 +0,0 @@
-import { __decorate, __metadata } from "tslib";
-import { LitElement, html, css } from 'lit';
-import { customElement, property } from 'lit/decorators.js';
-import * as d3 from 'd3';
-let KpiSingleBoxplotChart = class KpiSingleBoxplotChart extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.data = {};
-        this.minKey = 'min';
-        this.maxKey = 'max';
-        this.meanKey = 'mean';
-        this.medianKey = 'median';
-        this.q1Key = 'q1';
-        this.q3Key = 'q3';
-        this.valueKey = 'value';
-        this.color = '#2196f3';
-        this.vertical = true; // true: 세로형, false: 가로형
-        this.chartWidth = 0;
-        this.chartHeight = 0;
-    }
-    render() {
-        return html `
-      <svg
-        id="single-boxplot"
-        width=${this.chartWidth}
-        height=${this.chartHeight}
-        viewBox="0 0 ${this.chartWidth} ${this.chartHeight}"
-        preserveAspectRatio="xMidYMid meet"
-      ></svg>
-    `;
-    }
-    connectedCallback() {
-        super.connectedCallback();
-        this.resizeObserver = new ResizeObserver(entries => {
-            for (const entry of entries) {
-                const rect = entry.contentRect;
-                this.chartWidth = rect.width;
-                this.chartHeight = rect.height;
-                this.requestUpdate();
-            }
-        });
-        this.resizeObserver.observe(this);
-    }
-    disconnectedCallback() {
-        var _a;
-        (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
-        super.disconnectedCallback();
-    }
-    updated() {
-        this.drawSingleBoxplot();
-    }
-    drawSingleBoxplot() {
-        const svg = d3.select(this.renderRoot.querySelector('#single-boxplot'));
-        svg.selectAll('*').remove();
-        // 데이터 검증
-        if (!this.data || Object.keys(this.data).length === 0) {
-            return;
-        }
-        const w = this.chartWidth || 200;
-        const h = this.chartHeight || 200;
-        const margin = 20;
-        const plotW = w - margin * 2;
-        const plotH = h - margin * 2;
-        // 필수 필드 검증
-        const requiredFields = [this.minKey, this.maxKey, this.q1Key, this.q3Key, this.medianKey, this.meanKey];
-        const missingFields = requiredFields.filter(field => this.data[field] == null);
-        if (missingFields.length > 0) {
-            console.warn('Missing required fields:', missingFields);
-            return;
-        }
-        const values = [
-            this.data[this.minKey],
-            this.data[this.maxKey],
-            this.data[this.q1Key],
-            this.data[this.q3Key],
-            this.data[this.medianKey],
-            this.data[this.meanKey]
-        ];
-        if (this.data[this.valueKey] != null) {
-            values.push(this.data[this.valueKey]);
-        }
-        const g = svg
-            .attr('width', w)
-            .attr('height', h)
-            .append('g')
-            .attr('transform', `translate(${margin}, ${margin})`);
-        if (this.vertical) {
-            // 세로형 boxplot (기본)
-            this.drawVerticalBoxplot(g, plotW, plotH, values);
-        }
-        else {
-            // 가로형 boxplot
-            this.drawHorizontalBoxplot(g, plotW, plotH, values);
-        }
-    }
-    drawVerticalBoxplot(g, plotW, plotH, values) {
-        var _a, _b;
-        const y = d3
-            .scaleLinear()
-            .domain([(_a = d3.min(values)) !== null && _a !== void 0 ? _a : 0, (_b = d3.max(values)) !== null && _b !== void 0 ? _b : 1])
-            .nice()
-            .range([plotH, 0]);
-        const boxWidth = Math.min(plotW * 0.6, 60); // 박스 너비 제한
-        const boxX = (plotW - boxWidth) / 2; // 중앙 정렬
-        // Outlier 계산
-        const iqr = this.data[this.q3Key] - this.data[this.q1Key];
-        const lowerFence = this.data[this.q1Key] - 1.5 * iqr;
-        const upperFence = this.data[this.q3Key] + 1.5 * iqr;
-        const actualMin = Math.max(this.data[this.minKey], lowerFence);
-        const actualMax = Math.min(this.data[this.maxKey], upperFence);
-        // 박스
-        g.append('rect')
-            .attr('x', boxX)
-            .attr('y', y(Math.max(this.data[this.q1Key], this.data[this.q3Key])))
-            .attr('width', boxWidth)
-            .attr('height', Math.abs(y(this.data[this.q1Key]) - y(this.data[this.q3Key])))
-            .attr('fill', this.color)
-            .attr('opacity', 0.6)
-            .attr('stroke', '#333')
-            .attr('stroke-width', 1);
-        // 중앙선(중앙값)
-        g.append('line')
-            .attr('x1', boxX)
-            .attr('x2', boxX + boxWidth)
-            .attr('y1', y(this.data[this.medianKey]))
-            .attr('y2', y(this.data[this.medianKey]))
-            .attr('stroke', '#333')
-            .attr('stroke-width', 2);
-        // 수염
-        const centerX = boxX + boxWidth / 2;
-        g.append('line')
-            .attr('x1', centerX)
-            .attr('x2', centerX)
-            .attr('y1', y(actualMin))
-            .attr('y2', y(actualMax))
-            .attr('stroke', '#333')
-            .attr('stroke-width', 1);
-        // min/max 선
-        const capWidth = boxWidth / 3;
-        g.append('line')
-            .attr('x1', centerX - capWidth / 2)
-            .attr('x2', centerX + capWidth / 2)
-            .attr('y1', y(actualMin))
-            .attr('y2', y(actualMin))
-            .attr('stroke', '#333')
-            .attr('stroke-width', 1);
-        g.append('line')
-            .attr('x1', centerX - capWidth / 2)
-            .attr('x2', centerX + capWidth / 2)
-            .attr('y1', y(actualMax))
-            .attr('y2', y(actualMax))
-            .attr('stroke', '#333')
-            .attr('stroke-width', 1);
-        // Outliers
-        if (this.data[this.minKey] < lowerFence) {
-            g.append('circle')
-                .attr('cx', centerX)
-                .attr('cy', y(this.data[this.minKey]))
-                .attr('r', 4.5)
-                .attr('fill', '#ff4444');
-        }
-        if (this.data[this.maxKey] > upperFence) {
-            g.append('circle')
-                .attr('cx', centerX)
-                .attr('cy', y(this.data[this.maxKey]))
-                .attr('r', 4.5)
-                .attr('fill', '#ff4444');
-        }
-        // 현재값 (있는 경우)
-        if (this.data[this.valueKey] != null) {
-            g.append('circle')
-                .attr('cx', centerX)
-                .attr('cy', y(this.data[this.valueKey]))
-                .attr('r', 3)
-                .attr('fill', '#ff4444');
-        }
-    }
-    drawHorizontalBoxplot(g, plotW, plotH, values) {
-        var _a, _b;
-        const x = d3
-            .scaleLinear()
-            .domain([(_a = d3.min(values)) !== null && _a !== void 0 ? _a : 0, (_b = d3.max(values)) !== null && _b !== void 0 ? _b : 1])
-            .nice()
-            .range([0, plotW]);
-        const boxHeight = Math.min(plotH * 0.6, 60);
-        const boxY = (plotH - boxHeight) / 2;
-        // Outlier 계산
-        const iqr = this.data[this.q3Key] - this.data[this.q1Key];
-        const lowerFence = this.data[this.q1Key] - 1.5 * iqr;
-        const upperFence = this.data[this.q3Key] + 1.5 * iqr;
-        const actualMin = Math.max(this.data[this.minKey], lowerFence);
-        const actualMax = Math.min(this.data[this.maxKey], upperFence);
-        // 박스 (가로)
-        g.append('rect')
-            .attr('x', x(Math.min(this.data[this.q1Key], this.data[this.q3Key])))
-            .attr('y', boxY)
-            .attr('width', Math.abs(x(this.data[this.q3Key]) - x(this.data[this.q1Key])))
-            .attr('height', boxHeight)
-            .attr('fill', this.color)
-            .attr('opacity', 0.6)
-            .attr('stroke', '#333')
-            .attr('stroke-width', 1);
-        // 중앙선 (가로)
-        g.append('line')
-            .attr('x1', x(this.data[this.medianKey]))
-            .attr('x2', x(this.data[this.medianKey]))
-            .attr('y1', boxY)
-            .attr('y2', boxY + boxHeight)
-            .attr('stroke', '#333')
-            .attr('stroke-width', 2);
-        // 수염 (가로)
-        const centerY = boxY + boxHeight / 2;
-        g.append('line')
-            .attr('x1', x(actualMin))
-            .attr('x2', x(actualMax))
-            .attr('y1', centerY)
-            .attr('y2', centerY)
-            .attr('stroke', '#333')
-            .attr('stroke-width', 1);
-        // min/max 선 (가로)
-        const capHeight = boxHeight / 3;
-        g.append('line')
-            .attr('x1', x(actualMin))
-            .attr('x2', x(actualMin))
-            .attr('y1', centerY - capHeight / 2)
-            .attr('y2', centerY + capHeight / 2)
-            .attr('stroke', '#333')
-            .attr('stroke-width', 1);
-        g.append('line')
-            .attr('x1', x(actualMax))
-            .attr('x2', x(actualMax))
-            .attr('y1', centerY - capHeight / 2)
-            .attr('y2', centerY + capHeight / 2)
-            .attr('stroke', '#333')
-            .attr('stroke-width', 1);
-        // Outliers (가로)
-        if (this.data[this.minKey] < lowerFence) {
-            g.append('circle')
-                .attr('cx', x(this.data[this.minKey]))
-                .attr('cy', centerY)
-                .attr('r', 4.5)
-                .attr('fill', '#ff4444');
-        }
-        if (this.data[this.maxKey] > upperFence) {
-            g.append('circle')
-                .attr('cx', x(this.data[this.maxKey]))
-                .attr('cy', centerY)
-                .attr('r', 4.5)
-                .attr('fill', '#ff4444');
-        }
-        // 현재값 (가로)
-        if (this.data[this.valueKey] != null) {
-            g.append('circle')
-                .attr('cx', x(this.data[this.valueKey]))
-                .attr('cy', centerY)
-                .attr('r', 3)
-                .attr('fill', '#ff4444');
-        }
-    }
-};
-KpiSingleBoxplotChart.styles = css `
-    :host {
-      display: block;
-      width: 100%;
-      height: 100%;
-    }
-    svg {
-      width: 100%;
-      height: 100%;
-      display: block;
-    }
-  `;
-__decorate([
-    property({ type: Object }),
-    __metadata("design:type", Object)
-], KpiSingleBoxplotChart.prototype, "data", void 0);
-__decorate([
-    property({ type: String }),
-    __metadata("design:type", String)
-], KpiSingleBoxplotChart.prototype, "minKey", void 0);
-__decorate([
-    property({ type: String }),
-    __metadata("design:type", String)
-], KpiSingleBoxplotChart.prototype, "maxKey", void 0);
-__decorate([
-    property({ type: String }),
-    __metadata("design:type", String)
-], KpiSingleBoxplotChart.prototype, "meanKey", void 0);
-__decorate([
-    property({ type: String }),
-    __metadata("design:type", String)
-], KpiSingleBoxplotChart.prototype, "medianKey", void 0);
-__decorate([
-    property({ type: String }),
-    __metadata("design:type", String)
-], KpiSingleBoxplotChart.prototype, "q1Key", void 0);
-__decorate([
-    property({ type: String }),
-    __metadata("design:type", String)
-], KpiSingleBoxplotChart.prototype, "q3Key", void 0);
-__decorate([
-    property({ type: String }),
-    __metadata("design:type", String)
-], KpiSingleBoxplotChart.prototype, "valueKey", void 0);
-__decorate([
-    property({ type: String }),
-    __metadata("design:type", String)
-], KpiSingleBoxplotChart.prototype, "color", void 0);
-__decorate([
-    property({ type: Boolean }),
-    __metadata("design:type", Boolean)
-], KpiSingleBoxplotChart.prototype, "vertical", void 0);
-KpiSingleBoxplotChart = __decorate([
-    customElement('kpi-single-boxplot-chart')
-], KpiSingleBoxplotChart);
-export { KpiSingleBoxplotChart };
-//# sourceMappingURL=kpi-single-boxplot-chart.js.map

package/dist-client/components/kpi-single-boxplot-chart.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"kpi-single-boxplot-chart.js","sourceRoot":"","sources":["../../client/components/kpi-single-boxplot-chart.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, css } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport * as d3 from 'd3'\n\n@customElement('kpi-single-boxplot-chart')\nexport class KpiSingleBoxplotChart extends LitElement {\n  @property({ type: Object }) data: any = {}\n  @property({ type: String }) minKey: string = 'min'\n  @property({ type: String }) maxKey: string = 'max'\n  @property({ type: String }) meanKey: string = 'mean'\n  @property({ type: String }) medianKey: string = 'median'\n  @property({ type: String }) q1Key: string = 'q1'\n  @property({ type: String }) q3Key: string = 'q3'\n  @property({ type: String }) valueKey: string = 'value'\n  @property({ type: String }) color: string = '#2196f3'\n  @property({ type: Boolean }) vertical: boolean = true // true: 세로형, false: 가로형\n\n  static styles = css`\n    :host {\n      display: block;\n      width: 100%;\n      height: 100%;\n    }\n    svg {\n      width: 100%;\n      height: 100%;\n      display: block;\n    }\n  `\n\n  private chartWidth = 0\n  private chartHeight = 0\n  private resizeObserver?: ResizeObserver\n\n  render() {\n    return html`\n      <svg\n        id=\"single-boxplot\"\n        width=${this.chartWidth}\n        height=${this.chartHeight}\n        viewBox=\"0 0 ${this.chartWidth} ${this.chartHeight}\"\n        preserveAspectRatio=\"xMidYMid meet\"\n      ></svg>\n    `\n  }\n\n  connectedCallback() {\n    super.connectedCallback()\n    this.resizeObserver = new ResizeObserver(entries => {\n      for (const entry of entries) {\n        const rect = entry.contentRect\n        this.chartWidth = rect.width\n        this.chartHeight = rect.height\n        this.requestUpdate()\n      }\n    })\n    this.resizeObserver.observe(this)\n  }\n\n  disconnectedCallback() {\n    this.resizeObserver?.disconnect()\n    super.disconnectedCallback()\n  }\n\n  updated() {\n    this.drawSingleBoxplot()\n  }\n\n  private drawSingleBoxplot() {\n    const svg = d3.select(this.renderRoot.querySelector('#single-boxplot'))\n    svg.selectAll('*').remove()\n\n    // 데이터 검증\n    if (!this.data || Object.keys(this.data).length === 0) {\n      return\n    }\n\n    const w = this.chartWidth || 200\n    const h = this.chartHeight || 200\n    const margin = 20\n    const plotW = w - margin * 2\n    const plotH = h - margin * 2\n\n    // 필수 필드 검증\n    const requiredFields = [this.minKey, this.maxKey, this.q1Key, this.q3Key, this.medianKey, this.meanKey]\n    const missingFields = requiredFields.filter(field => this.data[field] == null)\n    if (missingFields.length > 0) {\n      console.warn('Missing required fields:', missingFields)\n      return\n    }\n\n    const values = [\n      this.data[this.minKey],\n      this.data[this.maxKey],\n      this.data[this.q1Key],\n      this.data[this.q3Key],\n      this.data[this.medianKey],\n      this.data[this.meanKey]\n    ]\n\n    if (this.data[this.valueKey] != null) {\n      values.push(this.data[this.valueKey])\n    }\n\n    const g = svg\n      .attr('width', w)\n      .attr('height', h)\n      .append('g')\n      .attr('transform', `translate(${margin}, ${margin})`)\n\n    if (this.vertical) {\n      // 세로형 boxplot (기본)\n      this.drawVerticalBoxplot(g, plotW, plotH, values)\n    } else {\n      // 가로형 boxplot\n      this.drawHorizontalBoxplot(g, plotW, plotH, values)\n    }\n  }\n\n  private drawVerticalBoxplot(g: any, plotW: number, plotH: number, values: number[]) {\n    const y = d3\n      .scaleLinear()\n      .domain([d3.min(values) ?? 0, d3.max(values) ?? 1])\n      .nice()\n      .range([plotH, 0])\n\n    const boxWidth = Math.min(plotW * 0.6, 60) // 박스 너비 제한\n    const boxX = (plotW - boxWidth) / 2 // 중앙 정렬\n\n    // Outlier 계산\n    const iqr = this.data[this.q3Key] - this.data[this.q1Key]\n    const lowerFence = this.data[this.q1Key] - 1.5 * iqr\n    const upperFence = this.data[this.q3Key] + 1.5 * iqr\n\n    const actualMin = Math.max(this.data[this.minKey], lowerFence)\n    const actualMax = Math.min(this.data[this.maxKey], upperFence)\n\n    // 박스\n    g.append('rect')\n      .attr('x', boxX)\n      .attr('y', y(Math.max(this.data[this.q1Key], this.data[this.q3Key])))\n      .attr('width', boxWidth)\n      .attr('height', Math.abs(y(this.data[this.q1Key]) - y(this.data[this.q3Key])))\n      .attr('fill', this.color)\n      .attr('opacity', 0.6)\n      .attr('stroke', '#333')\n      .attr('stroke-width', 1)\n\n    // 중앙선(중앙값)\n    g.append('line')\n      .attr('x1', boxX)\n      .attr('x2', boxX + boxWidth)\n      .attr('y1', y(this.data[this.medianKey]))\n      .attr('y2', y(this.data[this.medianKey]))\n      .attr('stroke', '#333')\n      .attr('stroke-width', 2)\n\n    // 수염\n    const centerX = boxX + boxWidth / 2\n    g.append('line')\n      .attr('x1', centerX)\n      .attr('x2', centerX)\n      .attr('y1', y(actualMin))\n      .attr('y2', y(actualMax))\n      .attr('stroke', '#333')\n      .attr('stroke-width', 1)\n\n    // min/max 선\n    const capWidth = boxWidth / 3\n    g.append('line')\n      .attr('x1', centerX - capWidth / 2)\n      .attr('x2', centerX + capWidth / 2)\n      .attr('y1', y(actualMin))\n      .attr('y2', y(actualMin))\n      .attr('stroke', '#333')\n      .attr('stroke-width', 1)\n\n    g.append('line')\n      .attr('x1', centerX - capWidth / 2)\n      .attr('x2', centerX + capWidth / 2)\n      .attr('y1', y(actualMax))\n      .attr('y2', y(actualMax))\n      .attr('stroke', '#333')\n      .attr('stroke-width', 1)\n\n    // Outliers\n    if (this.data[this.minKey] < lowerFence) {\n      g.append('circle')\n        .attr('cx', centerX)\n        .attr('cy', y(this.data[this.minKey]))\n        .attr('r', 4.5)\n        .attr('fill', '#ff4444')\n    }\n\n    if (this.data[this.maxKey] > upperFence) {\n      g.append('circle')\n        .attr('cx', centerX)\n        .attr('cy', y(this.data[this.maxKey]))\n        .attr('r', 4.5)\n        .attr('fill', '#ff4444')\n    }\n\n\n    // 현재값 (있는 경우)\n    if (this.data[this.valueKey] != null) {\n      g.append('circle')\n        .attr('cx', centerX)\n        .attr('cy', y(this.data[this.valueKey]))\n        .attr('r', 3)\n        .attr('fill', '#ff4444')\n    }\n  }\n\n  private drawHorizontalBoxplot(g: any, plotW: number, plotH: number, values: number[]) {\n    const x = d3\n      .scaleLinear()\n      .domain([d3.min(values) ?? 0, d3.max(values) ?? 1])\n      .nice()\n      .range([0, plotW])\n\n    const boxHeight = Math.min(plotH * 0.6, 60)\n    const boxY = (plotH - boxHeight) / 2\n\n    // Outlier 계산\n    const iqr = this.data[this.q3Key] - this.data[this.q1Key]\n    const lowerFence = this.data[this.q1Key] - 1.5 * iqr\n    const upperFence = this.data[this.q3Key] + 1.5 * iqr\n\n    const actualMin = Math.max(this.data[this.minKey], lowerFence)\n    const actualMax = Math.min(this.data[this.maxKey], upperFence)\n\n    // 박스 (가로)\n    g.append('rect')\n      .attr('x', x(Math.min(this.data[this.q1Key], this.data[this.q3Key])))\n      .attr('y', boxY)\n      .attr('width', Math.abs(x(this.data[this.q3Key]) - x(this.data[this.q1Key])))\n      .attr('height', boxHeight)\n      .attr('fill', this.color)\n      .attr('opacity', 0.6)\n      .attr('stroke', '#333')\n      .attr('stroke-width', 1)\n\n    // 중앙선 (가로)\n    g.append('line')\n      .attr('x1', x(this.data[this.medianKey]))\n      .attr('x2', x(this.data[this.medianKey]))\n      .attr('y1', boxY)\n      .attr('y2', boxY + boxHeight)\n      .attr('stroke', '#333')\n      .attr('stroke-width', 2)\n\n    // 수염 (가로)\n    const centerY = boxY + boxHeight / 2\n    g.append('line')\n      .attr('x1', x(actualMin))\n      .attr('x2', x(actualMax))\n      .attr('y1', centerY)\n      .attr('y2', centerY)\n      .attr('stroke', '#333')\n      .attr('stroke-width', 1)\n\n    // min/max 선 (가로)\n    const capHeight = boxHeight / 3\n    g.append('line')\n      .attr('x1', x(actualMin))\n      .attr('x2', x(actualMin))\n      .attr('y1', centerY - capHeight / 2)\n      .attr('y2', centerY + capHeight / 2)\n      .attr('stroke', '#333')\n      .attr('stroke-width', 1)\n\n    g.append('line')\n      .attr('x1', x(actualMax))\n      .attr('x2', x(actualMax))\n      .attr('y1', centerY - capHeight / 2)\n      .attr('y2', centerY + capHeight / 2)\n      .attr('stroke', '#333')\n      .attr('stroke-width', 1)\n\n    // Outliers (가로)\n    if (this.data[this.minKey] < lowerFence) {\n      g.append('circle')\n        .attr('cx', x(this.data[this.minKey]))\n        .attr('cy', centerY)\n        .attr('r', 4.5)\n        .attr('fill', '#ff4444')\n    }\n\n    if (this.data[this.maxKey] > upperFence) {\n      g.append('circle')\n        .attr('cx', x(this.data[this.maxKey]))\n        .attr('cy', centerY)\n        .attr('r', 4.5)\n        .attr('fill', '#ff4444')\n    }\n\n\n    // 현재값 (가로)\n    if (this.data[this.valueKey] != null) {\n      g.append('circle')\n        .attr('cx', x(this.data[this.valueKey]))\n        .attr('cy', centerY)\n        .attr('r', 3)\n        .attr('fill', '#ff4444')\n    }\n  }\n}"]}

package/dist-client/components/sv-pagenation-control.d.ts

@@ -1,18 +0,0 @@
-import '@material/web/button/outlined-button.js';
-import '@material/web/icon/icon.js';
-import { LitElement } from 'lit';
-export declare class SvPagenationControl extends LitElement {
-    static styles: import("lit").CSSResult[];
-    currentPage: number;
-    totalItems: number;
-    pageLimit: number;
-    private get totalPages();
-    private get pageBlock();
-    render(): import("lit-html").TemplateResult<1>;
-    private _emitPageChange;
-    private _numberButtons;
-    private _onFirst;
-    private _onPrev;
-    private _onNext;
-    private _onLast;
-}

package/dist-client/components/sv-pagenation-control.js

@@ -1,142 +0,0 @@
-import { __decorate, __metadata } from "tslib";
-import '@material/web/button/outlined-button.js';
-import '@material/web/icon/icon.js';
-import { css, html, LitElement } from 'lit';
-import { customElement, property } from 'lit/decorators.js';
-let SvPagenationControl = class SvPagenationControl extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.currentPage = 1;
-        this.totalItems = 0;
-        this.pageLimit = 20;
-    }
-    get totalPages() {
-        const totalPages = Math.ceil((this.totalItems || 0) / (this.pageLimit || 1));
-        return Math.max(1, totalPages);
-    }
-    get pageBlock() {
-        const blockSize = 10;
-        const blockIndex = Math.floor((this.currentPage - 1) / blockSize);
-        const start = blockIndex * blockSize + 1;
-        const end = Math.min(start + blockSize - 1, this.totalPages);
-        return { start, end };
-    }
-    render() {
-        return html `
-      <div pagination>
-        <md-outlined-button icon ?disabled=${this.currentPage <= 1} @click=${this._onFirst}>
-          <md-icon>first_page</md-icon>
-        </md-outlined-button>
-        <md-outlined-button icon ?disabled=${this.currentPage <= 1} @click=${this._onPrev}>
-          <md-icon>chevron_left</md-icon>
-        </md-outlined-button>
-
-        <div numbers>${this._numberButtons()}</div>
-
-        <md-outlined-button icon ?disabled=${this.currentPage >= this.totalPages} @click=${this._onNext}>
-          <md-icon>chevron_right</md-icon>
-        </md-outlined-button>
-        <md-outlined-button icon ?disabled=${this.currentPage >= this.totalPages} @click=${this._onLast}>
-          <md-icon>last_page</md-icon>
-        </md-outlined-button>
-      </div>
-    `;
-    }
-    _emitPageChange(nextPage) {
-        const bounded = Math.min(Math.max(1, nextPage), this.totalPages);
-        if (bounded !== this.currentPage) {
-            this.dispatchEvent(new CustomEvent('page-change', {
-                detail: { page: bounded },
-                bubbles: true,
-                composed: true
-            }));
-        }
-    }
-    _numberButtons() {
-        const { start, end } = this.pageBlock;
-        const buttons = [];
-        for (let page = start; page <= end; page++) {
-            const selected = page === this.currentPage;
-            buttons.push(html `<md-outlined-button data-page ?selected=${selected} @click=${() => this._emitPageChange(page)}
-          >${page}</md-outlined-button
-        >`);
-        }
-        return buttons;
-    }
-    _onFirst() {
-        this._emitPageChange(1);
-    }
-    _onPrev() {
-        this._emitPageChange(this.currentPage - 1);
-    }
-    _onNext() {
-        this._emitPageChange(this.currentPage + 1);
-    }
-    _onLast() {
-        this._emitPageChange(this.totalPages);
-    }
-};
-SvPagenationControl.styles = [
-    css `
-      div[pagination] {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        gap: var(--spacing-medium, 8px);
-        margin: var(--spacing-large, 12px);
-
-        div[numbers] {
-          display: inline-flex;
-          gap: var(--spacing-tiny, 2px);
-        }
-
-        md-icon {
-          --md-icon-size: 18px;
-        }
-
-        md-outlined-button {
-          --md-outlined-button-container-height: 30px;
-          --md-outlined-button-label-text-size: 13px;
-          padding: 0 10px;
-        }
-
-        md-outlined-button[selected] {
-          --md-outlined-button-label-text-color: #ffffff;
-          --md-sys-color-outline: #0595e5;
-          background-color: #0595e5;
-        }
-
-        md-outlined-button[icon] {
-          min-width: 30px;
-          width: 30px;
-          padding: 0;
-        }
-
-        md-outlined-button[icon] md-icon {
-          margin-top: 5px;
-        }
-
-        md-outlined-button[data-page] {
-          min-width: 34px;
-          padding: 0 8px;
-        }
-      }
-    `
-];
-__decorate([
-    property({ type: Number }),
-    __metadata("design:type", Number)
-], SvPagenationControl.prototype, "currentPage", void 0);
-__decorate([
-    property({ type: Number }),
-    __metadata("design:type", Number)
-], SvPagenationControl.prototype, "totalItems", void 0);
-__decorate([
-    property({ type: Number }),
-    __metadata("design:type", Number)
-], SvPagenationControl.prototype, "pageLimit", void 0);
-SvPagenationControl = __decorate([
-    customElement('sv-pagenation-control')
-], SvPagenationControl);
-export { SvPagenationControl };
-//# sourceMappingURL=sv-pagenation-control.js.map

package/dist-client/components/sv-pagenation-control.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"sv-pagenation-control.js","sourceRoot":"","sources":["../../client/components/sv-pagenation-control.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/button/outlined-button.js'\nimport '@material/web/icon/icon.js'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\n@customElement('sv-pagenation-control')\nexport class SvPagenationControl extends LitElement {\n  static styles = [\n    css`\n      div[pagination] {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        gap: var(--spacing-medium, 8px);\n        margin: var(--spacing-large, 12px);\n\n        div[numbers] {\n          display: inline-flex;\n          gap: var(--spacing-tiny, 2px);\n        }\n\n        md-icon {\n          --md-icon-size: 18px;\n        }\n\n        md-outlined-button {\n          --md-outlined-button-container-height: 30px;\n          --md-outlined-button-label-text-size: 13px;\n          padding: 0 10px;\n        }\n\n        md-outlined-button[selected] {\n          --md-outlined-button-label-text-color: #ffffff;\n          --md-sys-color-outline: #0595e5;\n          background-color: #0595e5;\n        }\n\n        md-outlined-button[icon] {\n          min-width: 30px;\n          width: 30px;\n          padding: 0;\n        }\n\n        md-outlined-button[icon] md-icon {\n          margin-top: 5px;\n        }\n\n        md-outlined-button[data-page] {\n          min-width: 34px;\n          padding: 0 8px;\n        }\n      }\n    `\n  ]\n\n  @property({ type: Number }) currentPage: number = 1\n  @property({ type: Number }) totalItems: number = 0\n  @property({ type: Number }) pageLimit: number = 20\n\n  private get totalPages(): number {\n    const totalPages = Math.ceil((this.totalItems || 0) / (this.pageLimit || 1))\n    return Math.max(1, totalPages)\n  }\n\n  private get pageBlock(): { start: number; end: number } {\n    const blockSize = 10\n    const blockIndex = Math.floor((this.currentPage - 1) / blockSize)\n    const start = blockIndex * blockSize + 1\n    const end = Math.min(start + blockSize - 1, this.totalPages)\n    return { start, end }\n  }\n\n  render() {\n    return html`\n      <div pagination>\n        <md-outlined-button icon ?disabled=${this.currentPage <= 1} @click=${this._onFirst}>\n          <md-icon>first_page</md-icon>\n        </md-outlined-button>\n        <md-outlined-button icon ?disabled=${this.currentPage <= 1} @click=${this._onPrev}>\n          <md-icon>chevron_left</md-icon>\n        </md-outlined-button>\n\n        <div numbers>${this._numberButtons()}</div>\n\n        <md-outlined-button icon ?disabled=${this.currentPage >= this.totalPages} @click=${this._onNext}>\n          <md-icon>chevron_right</md-icon>\n        </md-outlined-button>\n        <md-outlined-button icon ?disabled=${this.currentPage >= this.totalPages} @click=${this._onLast}>\n          <md-icon>last_page</md-icon>\n        </md-outlined-button>\n      </div>\n    `\n  }\n\n  private _emitPageChange(nextPage: number) {\n    const bounded = Math.min(Math.max(1, nextPage), this.totalPages)\n    if (bounded !== this.currentPage) {\n      this.dispatchEvent(\n        new CustomEvent('page-change', {\n          detail: { page: bounded },\n          bubbles: true,\n          composed: true\n        })\n      )\n    }\n  }\n\n  private _numberButtons() {\n    const { start, end } = this.pageBlock\n    const buttons = [] as any[]\n    for (let page = start; page <= end; page++) {\n      const selected = page === this.currentPage\n      buttons.push(\n        html`<md-outlined-button data-page ?selected=${selected} @click=${() => this._emitPageChange(page)}\n          >${page}</md-outlined-button\n        >`\n      )\n    }\n    return buttons\n  }\n\n  private _onFirst() {\n    this._emitPageChange(1)\n  }\n\n  private _onPrev() {\n    this._emitPageChange(this.currentPage - 1)\n  }\n\n  private _onNext() {\n    this._emitPageChange(this.currentPage + 1)\n  }\n\n  private _onLast() {\n    this._emitPageChange(this.totalPages)\n  }\n}\n"]}

package/dist-client/entries/public/home.d.ts

@@ -1,8 +0,0 @@
-import '@material/web/icon/icon.js';
-import { LitElement } from 'lit';
-export declare class HomePage extends LitElement {
-    static styles: import("lit").CSSResult[];
-    private _applicationMeta;
-    render(): import("lit-html").TemplateResult<1>;
-    get applicationMeta(): any;
-}

package/dist-client/entries/public/home.js

@@ -1,97 +0,0 @@
-import { __decorate } from "tslib";
-import '@material/web/icon/icon.js';
-import { css, html, LitElement } from 'lit';
-import { customElement } from 'lit/decorators.js';
-let HomePage = class HomePage extends LitElement {
-    render() {
-        var { title, description } = this.applicationMeta;
-        return html `
-      <div message>
-        <strong>${title}</strong>
-        ${description}
-        <video autoplay muted playsinline loop>
-          <source src="/assets/videos/intro.mp4" type="video/mp4" />
-        </video>
-      </div>
-
-      <md-icon signin @click=${e => (window.location.href = '/auth/signin')}>login</md-icon>
-    `;
-    }
-    get applicationMeta() {
-        if (!this._applicationMeta) {
-            var iconLink = document.querySelector('link[rel="application-icon"]');
-            var titleMeta = document.querySelector('meta[name="application-name"]');
-            var descriptionMeta = document.querySelector('meta[name="application-description"]');
-            this._applicationMeta = {
-                icon: iconLink === null || iconLink === void 0 ? void 0 : iconLink.href,
-                title: (titleMeta === null || titleMeta === void 0 ? void 0 : titleMeta.content) || 'Things Factory',
-                description: (descriptionMeta === null || descriptionMeta === void 0 ? void 0 : descriptionMeta.content) || 'Reimagining Software'
-            };
-        }
-        return this._applicationMeta;
-    }
-};
-HomePage.styles = [
-    css `
-      :host {
-        background-color: var(--md-sys-color-background);
-
-        display: block;
-        position: relative;
-
-        max-width: 100vw;
-        width: 100vw;
-        height: 100vh;
-        height: 100dvh;
-      }
-
-      [signin] {
-        position: absolute;
-        right: 20px;
-        top: 20px;
-        font-size: 2em;
-        color: white;
-      }
-
-      [message] {
-        background-color: rgba(50, 66, 97, 0.8);
-        padding: 60px 50px 0 50px;
-        color: #fff;
-        text-align: center;
-        font-size: 20px;
-      }
-
-      [message] strong {
-        display: block;
-        font-size: 2.5rem;
-      }
-
-      video {
-        position: absolute;
-        top: 50%;
-        left: 50%;
-        width: 100vw;
-        height: 100vh;
-        object-fit: cover;
-        transform: translate(-50%, -50%);
-      }
-
-      @media screen and (max-width: 480px) {
-        [message] {
-          padding: 60px 30px 0 30px;
-          color: #fff;
-          text-align: center;
-          font-size: 15px;
-        }
-
-        [message] strong {
-          font-size: 1.6rem;
-        }
-      }
-    `
-];
-HomePage = __decorate([
-    customElement('home-page')
-], HomePage);
-export { HomePage };
-//# sourceMappingURL=home.js.map

package/dist-client/entries/public/home.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"home.js","sourceRoot":"","sources":["../../../client/entries/public/home.ts"],"names":[],"mappings":";AAAA,OAAO,4BAA4B,CAAA;AAEnC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAA;AAG1C,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,UAAU;IA+DtC,MAAM;QACJ,IAAI,EAAE,KAAK,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,eAAe,CAAA;QAEjD,OAAO,IAAI,CAAA;;kBAEG,KAAK;UACb,WAAW;;;;;;+BAMU,CAAC,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,GAAG,cAAc,CAAC;KACtE,CAAA;IACH,CAAC;IAED,IAAI,eAAe;QACjB,IAAI,CAAC,IAAI,CAAC,gBAAgB,EAAE,CAAC;YAC3B,IAAI,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,8BAA8B,CAAoB,CAAA;YACxF,IAAI,SAAS,GAAG,QAAQ,CAAC,aAAa,CAAC,+BAA+B,CAAoB,CAAA;YAC1F,IAAI,eAAe,GAAG,QAAQ,CAAC,aAAa,CAAC,sCAAsC,CAAoB,CAAA;YAEvG,IAAI,CAAC,gBAAgB,GAAG;gBACtB,IAAI,EAAE,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,IAAI;gBACpB,KAAK,EAAE,CAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,OAAO,KAAI,gBAAgB;gBAC7C,WAAW,EAAE,CAAA,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,OAAO,KAAI,sBAAsB;aAChE,CAAA;QACH,CAAC;QAED,OAAO,IAAI,CAAC,gBAAgB,CAAA;IAC9B,CAAC;;AA5FM,eAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAwDF;CACF,AA1DY,CA0DZ;AA3DU,QAAQ;IADpB,aAAa,CAAC,WAAW,CAAC;GACd,QAAQ,CA8FpB","sourcesContent":["import '@material/web/icon/icon.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement } from 'lit/decorators.js'\n\n@customElement('home-page')\nexport class HomePage extends LitElement {\n  static styles = [\n    css`\n      :host {\n        background-color: var(--md-sys-color-background);\n\n        display: block;\n        position: relative;\n\n        max-width: 100vw;\n        width: 100vw;\n        height: 100vh;\n        height: 100dvh;\n      }\n\n      [signin] {\n        position: absolute;\n        right: 20px;\n        top: 20px;\n        font-size: 2em;\n        color: white;\n      }\n\n      [message] {\n        background-color: rgba(50, 66, 97, 0.8);\n        padding: 60px 50px 0 50px;\n        color: #fff;\n        text-align: center;\n        font-size: 20px;\n      }\n\n      [message] strong {\n        display: block;\n        font-size: 2.5rem;\n      }\n\n      video {\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        width: 100vw;\n        height: 100vh;\n        object-fit: cover;\n        transform: translate(-50%, -50%);\n      }\n\n      @media screen and (max-width: 480px) {\n        [message] {\n          padding: 60px 30px 0 30px;\n          color: #fff;\n          text-align: center;\n          font-size: 15px;\n        }\n\n        [message] strong {\n          font-size: 1.6rem;\n        }\n      }\n    `\n  ]\n\n  private _applicationMeta\n\n  render() {\n    var { title, description } = this.applicationMeta\n\n    return html`\n      <div message>\n        <strong>${title}</strong>\n        ${description}\n        <video autoplay muted playsinline loop>\n          <source src=\"/assets/videos/intro.mp4\" type=\"video/mp4\" />\n        </video>\n      </div>\n\n      <md-icon signin @click=${e => (window.location.href = '/auth/signin')}>login</md-icon>\n    `\n  }\n\n  get applicationMeta() {\n    if (!this._applicationMeta) {\n      var iconLink = document.querySelector('link[rel=\"application-icon\"]') as HTMLLinkElement\n      var titleMeta = document.querySelector('meta[name=\"application-name\"]') as HTMLMetaElement\n      var descriptionMeta = document.querySelector('meta[name=\"application-description\"]') as HTMLMetaElement\n\n      this._applicationMeta = {\n        icon: iconLink?.href,\n        title: titleMeta?.content || 'Things Factory',\n        description: descriptionMeta?.content || 'Reimagining Software'\n      }\n    }\n\n    return this._applicationMeta\n  }\n}\n"]}