@dssp/dkpi 1.0.0-alpha.8 → 1.0.0-alpha.81

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

@@ -0,0 +1,398 @@
+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: 가로형
+        /** 현재 host 크기 (ResizeObserver 가 채움). viewBox 를 이 값으로 동적 설정 → 여백 없이 풀 채움. */
+        this.vbW = 200;
+        this.vbH = 200;
+    }
+    render() {
+        // 초기 viewBox 는 200x200. ResizeObserver 가 컨테이너 크기로 갱신.
+        return html `
+      <svg id="single-boxplot" viewBox="0 0 200 200" preserveAspectRatio="xMidYMid meet"></svg>
+    `;
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        // host 크기 변경 시 viewBox 를 컨테이너 비율로 맞춰 D3 만 다시 그리기 (Lit requestUpdate X).
+        this.resizeObserver = new ResizeObserver(entries => {
+            const entry = entries[0];
+            if (!entry)
+                return;
+            const w = Math.max(1, entry.contentRect.width);
+            const h = Math.max(1, entry.contentRect.height);
+            if (w === this.vbW && h === this.vbH)
+                return;
+            this.vbW = w;
+            this.vbH = h;
+            this.drawSingleBoxplot();
+        });
+        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'));
+        if (svg.empty())
+            return;
+        svg.selectAll('*').remove();
+        // 데이터 검증
+        if (!this.data || Object.keys(this.data).length === 0) {
+            return;
+        }
+        // viewBox 를 host 실제 크기로 — preserveAspectRatio 와 무관하게 풀 채움.
+        const w = this.vbW;
+        const h = this.vbH;
+        svg.attr('viewBox', `0 0 ${w} ${h}`);
+        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.append('g').attr('transform', `translate(${margin}, ${margin})`);
+        // 툴팁
+        const tooltip = svg.append('g').attr('class', 'sb-tooltip').attr('visibility', 'hidden');
+        tooltip.append('rect').attr('rx', 4).attr('ry', 4).attr('fill', 'rgba(33,33,33,0.9)');
+        tooltip.append('text').attr('fill', '#fff').attr('font-size', '10px');
+        const showTip = (evt, lines) => {
+            const tipText = tooltip.select('text');
+            tipText.selectAll('tspan').remove();
+            lines.forEach((line, i) => {
+                tipText.append('tspan').attr('x', 8).attr('dy', i === 0 ? 14 : 13).text(line);
+            });
+            const tipW = Math.max(...lines.map(l => l.length)) * 8 + 24;
+            const tipH = lines.length * 13 + 10;
+            const [mx, my] = d3.pointer(evt, svg.node());
+            const tx = Math.min(mx + 10, w - tipW - 5);
+            const ty = Math.max(my - tipH - 5, 5);
+            tooltip.select('rect').attr('x', tx).attr('y', ty).attr('width', tipW).attr('height', tipH);
+            tipText.attr('transform', `translate(${tx},${ty})`);
+            tooltip.attr('visibility', 'visible').raise();
+        };
+        const hideTip = () => tooltip.attr('visibility', 'hidden');
+        if (this.vertical) {
+            this.drawVerticalBoxplot(g, plotW, plotH, showTip, hideTip);
+        }
+        else {
+            this.drawHorizontalBoxplot(g, plotW, plotH, showTip, hideTip);
+        }
+    }
+    drawVerticalBoxplot(g, plotW, plotH, showTip, hideTip) {
+        // 박스플롯 도메인은 min/max 통계 범위로 유지
+        const y = d3
+            .scaleLinear()
+            .domain([this.data[this.minKey], this.data[this.maxKey]])
+            .range([plotH, 0]);
+        // 현재값이 범위를 벗어나면 도메인 확장
+        if (this.data[this.valueKey] != null) {
+            const currentValue = this.data[this.valueKey];
+            if (currentValue < this.data[this.minKey] || currentValue > this.data[this.maxKey]) {
+                const allValues = [this.data[this.minKey], this.data[this.maxKey], currentValue];
+                y.domain([Math.min(...allValues), Math.max(...allValues)]);
+            }
+        }
+        const boxWidth = Math.min(plotW * 0.6, 80);
+        const centerX = plotW / 2;
+        // 박스 (Q1 ~ Q3)
+        const boxHeight = y(this.data[this.q1Key]) - y(this.data[this.q3Key]);
+        g.append('rect')
+            .attr('x', centerX - boxWidth / 2)
+            .attr('y', y(this.data[this.q3Key]))
+            .attr('width', boxWidth)
+            .attr('height', boxHeight)
+            .attr('fill', '#B3D4FC')
+            .attr('opacity', 0.8)
+            .attr('stroke', '#7BB3F0')
+            .attr('stroke-width', 1)
+            .style('cursor', 'pointer')
+            .on('mouseenter', (evt) => showTip(evt, [
+            `최대: ${Number(this.data[this.maxKey]).toFixed(2)}`,
+            `Q3: ${Number(this.data[this.q3Key]).toFixed(2)}`,
+            `중앙값: ${Number(this.data[this.medianKey]).toFixed(2)}`,
+            `Q1: ${Number(this.data[this.q1Key]).toFixed(2)}`,
+            `최소: ${Number(this.data[this.minKey]).toFixed(2)}`,
+            `평균: ${Number(this.data[this.meanKey]).toFixed(2)}`
+        ]))
+            .on('mouseleave', () => hideTip());
+        // 중앙선 (Median)
+        g.append('line')
+            .attr('x1', centerX - boxWidth / 2)
+            .attr('x2', centerX + boxWidth / 2)
+            .attr('y1', y(this.data[this.medianKey]))
+            .attr('y2', y(this.data[this.medianKey]))
+            .attr('stroke', '#7BB3F0')
+            .attr('stroke-width', 1.5);
+        // 위쪽 수염 (Q3 ~ Max)
+        g.append('line')
+            .attr('x1', centerX)
+            .attr('x2', centerX)
+            .attr('y1', y(this.data[this.q3Key]))
+            .attr('y2', y(this.data[this.maxKey]))
+            .attr('stroke', '#7BB3F0')
+            .attr('stroke-width', 1);
+        // 아래쪽 수염 (Min ~ Q1)
+        g.append('line')
+            .attr('x1', centerX)
+            .attr('x2', centerX)
+            .attr('y1', y(this.data[this.minKey]))
+            .attr('y2', y(this.data[this.q1Key]))
+            .attr('stroke', '#7BB3F0')
+            .attr('stroke-width', 1);
+        // Max 캡
+        const capWidth = boxWidth * 0.6;
+        g.append('line')
+            .attr('x1', centerX - capWidth / 2)
+            .attr('x2', centerX + capWidth / 2)
+            .attr('y1', y(this.data[this.maxKey]))
+            .attr('y2', y(this.data[this.maxKey]))
+            .attr('stroke', '#7BB3F0')
+            .attr('stroke-width', 1);
+        // Min 캡
+        g.append('line')
+            .attr('x1', centerX - capWidth / 2)
+            .attr('x2', centerX + capWidth / 2)
+            .attr('y1', y(this.data[this.minKey]))
+            .attr('y2', y(this.data[this.minKey]))
+            .attr('stroke', '#7BB3F0')
+            .attr('stroke-width', 1);
+        // 평균값 (초록색)
+        if (this.data[this.meanKey] != null) {
+            g.append('circle')
+                .attr('cx', centerX)
+                .attr('cy', y(this.data[this.meanKey]))
+                .attr('r', 3)
+                .attr('fill', '#4CAF50')
+                .attr('stroke', '#fff')
+                .attr('stroke-width', 1)
+                .style('cursor', 'pointer')
+                .on('mouseenter', (evt) => showTip(evt, [`평균: ${Number(this.data[this.meanKey]).toFixed(2)}`]))
+                .on('mouseleave', () => hideTip());
+        }
+        // 현재값 (오렌지색)
+        if (this.data[this.valueKey] != null) {
+            const currentValue = this.data[this.valueKey];
+            const isOutlier = currentValue < this.data[this.minKey] || currentValue > this.data[this.maxKey];
+            g.append('circle')
+                .attr('cx', centerX)
+                .attr('cy', y(currentValue))
+                .attr('r', 3)
+                .attr('fill', isOutlier ? '#ff4444' : '#ff9800')
+                .attr('stroke', '#fff')
+                .attr('stroke-width', 1)
+                .style('cursor', 'pointer')
+                .on('mouseenter', (evt) => showTip(evt, [
+                `현재 프로젝트: ${Number(currentValue).toFixed(2)}`,
+                isOutlier ? '⚠ 이상치' : '정상 범위'
+            ]))
+                .on('mouseleave', () => hideTip());
+        }
+    }
+    drawHorizontalBoxplot(g, plotW, plotH, showTip, hideTip) {
+        // 박스플롯 도메인은 min/max 통계 범위로 유지
+        const x = d3
+            .scaleLinear()
+            .domain([this.data[this.minKey], this.data[this.maxKey]])
+            .range([0, plotW]);
+        // 현재값이 범위를 벗어나면 도메인 확장
+        if (this.data[this.valueKey] != null) {
+            const currentValue = this.data[this.valueKey];
+            if (currentValue < this.data[this.minKey] || currentValue > this.data[this.maxKey]) {
+                const allValues = [this.data[this.minKey], this.data[this.maxKey], currentValue];
+                x.domain([Math.min(...allValues), Math.max(...allValues)]);
+            }
+        }
+        const boxHeight = Math.min(plotH * 0.6, 80);
+        const centerY = plotH / 2;
+        // 박스 (Q1 ~ Q3)
+        const boxWidth = x(this.data[this.q3Key]) - x(this.data[this.q1Key]);
+        g.append('rect')
+            .attr('x', x(this.data[this.q1Key]))
+            .attr('y', centerY - boxHeight / 2)
+            .attr('width', boxWidth)
+            .attr('height', boxHeight)
+            .attr('fill', '#B3D4FC')
+            .attr('opacity', 0.8)
+            .attr('stroke', '#7BB3F0')
+            .attr('stroke-width', 1)
+            .style('cursor', 'pointer')
+            .on('mouseenter', (evt) => showTip(evt, [
+            `최대: ${Number(this.data[this.maxKey]).toFixed(2)}`,
+            `Q3: ${Number(this.data[this.q3Key]).toFixed(2)}`,
+            `중앙값: ${Number(this.data[this.medianKey]).toFixed(2)}`,
+            `Q1: ${Number(this.data[this.q1Key]).toFixed(2)}`,
+            `최소: ${Number(this.data[this.minKey]).toFixed(2)}`,
+            `평균: ${Number(this.data[this.meanKey]).toFixed(2)}`
+        ]))
+            .on('mouseleave', () => hideTip());
+        // 중앙선 (Median)
+        g.append('line')
+            .attr('x1', x(this.data[this.medianKey]))
+            .attr('x2', x(this.data[this.medianKey]))
+            .attr('y1', centerY - boxHeight / 2)
+            .attr('y2', centerY + boxHeight / 2)
+            .attr('stroke', '#7BB3F0')
+            .attr('stroke-width', 1.5);
+        // 왼쪽 수염 (Min ~ Q1)
+        g.append('line')
+            .attr('x1', x(this.data[this.minKey]))
+            .attr('x2', x(this.data[this.q1Key]))
+            .attr('y1', centerY)
+            .attr('y2', centerY)
+            .attr('stroke', '#7BB3F0')
+            .attr('stroke-width', 1);
+        // 오른쪽 수염 (Q3 ~ Max)
+        g.append('line')
+            .attr('x1', x(this.data[this.q3Key]))
+            .attr('x2', x(this.data[this.maxKey]))
+            .attr('y1', centerY)
+            .attr('y2', centerY)
+            .attr('stroke', '#7BB3F0')
+            .attr('stroke-width', 1);
+        // Min 캡
+        const capHeight = boxHeight * 0.6;
+        g.append('line')
+            .attr('x1', x(this.data[this.minKey]))
+            .attr('x2', x(this.data[this.minKey]))
+            .attr('y1', centerY - capHeight / 2)
+            .attr('y2', centerY + capHeight / 2)
+            .attr('stroke', '#7BB3F0')
+            .attr('stroke-width', 1);
+        // Max 캡
+        g.append('line')
+            .attr('x1', x(this.data[this.maxKey]))
+            .attr('x2', x(this.data[this.maxKey]))
+            .attr('y1', centerY - capHeight / 2)
+            .attr('y2', centerY + capHeight / 2)
+            .attr('stroke', '#7BB3F0')
+            .attr('stroke-width', 1);
+        // 평균값 (초록색)
+        if (this.data[this.meanKey] != null) {
+            g.append('circle')
+                .attr('cx', x(this.data[this.meanKey]))
+                .attr('cy', centerY)
+                .attr('r', 3)
+                .attr('fill', '#4CAF50')
+                .attr('stroke', '#fff')
+                .attr('stroke-width', 1)
+                .style('cursor', 'pointer')
+                .on('mouseenter', (evt) => showTip(evt, [`평균: ${Number(this.data[this.meanKey]).toFixed(2)}`]))
+                .on('mouseleave', () => hideTip());
+        }
+        // 현재값 (오렌지색)
+        if (this.data[this.valueKey] != null) {
+            const currentValue = this.data[this.valueKey];
+            const isOutlier = currentValue < this.data[this.minKey] || currentValue > this.data[this.maxKey];
+            g.append('circle')
+                .attr('cx', x(currentValue))
+                .attr('cy', centerY)
+                .attr('r', 3)
+                .attr('fill', isOutlier ? '#ff4444' : '#ff9800')
+                .attr('stroke', '#fff')
+                .attr('stroke-width', 1)
+                .style('cursor', 'pointer')
+                .on('mouseenter', (evt) => showTip(evt, [
+                `현재 프로젝트: ${Number(currentValue).toFixed(2)}`,
+                isOutlier ? '⚠ 이상치' : '정상 범위'
+            ]))
+                .on('mouseleave', () => hideTip());
+        }
+    }
+};
+KpiSingleBoxplotChart.styles = css `
+    :host {
+      display: block;
+      width: 100%;
+      height: 100%;
+      /* flex/grid item 의 intrinsic min-content 가 부모를 밀어올리는 것 방지 */
+      min-width: 0;
+      min-height: 0;
+      overflow: hidden;
+      /* 절대 늘어나지 않도록 contain — layout/size 격리 */
+      contain: strict;
+    }
+    svg {
+      display: block;
+      width: 100%;
+      height: 100%;
+    }
+  `;
+__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

@@ -0,0 +1 @@
+{"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      /* flex/grid item 의 intrinsic min-content 가 부모를 밀어올리는 것 방지 */\n      min-width: 0;\n      min-height: 0;\n      overflow: hidden;\n      /* 절대 늘어나지 않도록 contain — layout/size 격리 */\n      contain: strict;\n    }\n    svg {\n      display: block;\n      width: 100%;\n      height: 100%;\n    }\n  `\n\n  /** 현재 host 크기 (ResizeObserver 가 채움). viewBox 를 이 값으로 동적 설정 → 여백 없이 풀 채움. */\n  private vbW = 200\n  private vbH = 200\n\n  private resizeObserver?: ResizeObserver\n\n  render() {\n    // 초기 viewBox 는 200x200. ResizeObserver 가 컨테이너 크기로 갱신.\n    return html`\n      <svg id=\"single-boxplot\" viewBox=\"0 0 200 200\" preserveAspectRatio=\"xMidYMid meet\"></svg>\n    `\n  }\n\n  connectedCallback() {\n    super.connectedCallback()\n    // host 크기 변경 시 viewBox 를 컨테이너 비율로 맞춰 D3 만 다시 그리기 (Lit requestUpdate X).\n    this.resizeObserver = new ResizeObserver(entries => {\n      const entry = entries[0]\n      if (!entry) return\n      const w = Math.max(1, entry.contentRect.width)\n      const h = Math.max(1, entry.contentRect.height)\n      if (w === this.vbW && h === this.vbH) return\n      this.vbW = w\n      this.vbH = h\n      this.drawSingleBoxplot()\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    if (svg.empty()) return\n    svg.selectAll('*').remove()\n\n    // 데이터 검증\n    if (!this.data || Object.keys(this.data).length === 0) {\n      return\n    }\n\n    // viewBox 를 host 실제 크기로 — preserveAspectRatio 와 무관하게 풀 채움.\n    const w = this.vbW\n    const h = this.vbH\n    svg.attr('viewBox', `0 0 ${w} ${h}`)\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.append('g').attr('transform', `translate(${margin}, ${margin})`)\n\n    // 툴팁\n    const tooltip = svg.append('g').attr('class', 'sb-tooltip').attr('visibility', 'hidden')\n    tooltip.append('rect').attr('rx', 4).attr('ry', 4).attr('fill', 'rgba(33,33,33,0.9)')\n    tooltip.append('text').attr('fill', '#fff').attr('font-size', '10px')\n\n    const showTip = (evt: MouseEvent, lines: string[]) => {\n      const tipText = tooltip.select('text')\n      tipText.selectAll('tspan').remove()\n      lines.forEach((line, i) => {\n        tipText.append('tspan').attr('x', 8).attr('dy', i === 0 ? 14 : 13).text(line)\n      })\n      const tipW = Math.max(...lines.map(l => l.length)) * 8 + 24\n      const tipH = lines.length * 13 + 10\n      const [mx, my] = d3.pointer(evt, svg.node())\n      const tx = Math.min(mx + 10, w - tipW - 5)\n      const ty = Math.max(my - tipH - 5, 5)\n      tooltip.select('rect').attr('x', tx).attr('y', ty).attr('width', tipW).attr('height', tipH)\n      tipText.attr('transform', `translate(${tx},${ty})`)\n      tooltip.attr('visibility', 'visible').raise()\n    }\n    const hideTip = () => tooltip.attr('visibility', 'hidden')\n\n    if (this.vertical) {\n      this.drawVerticalBoxplot(g, plotW, plotH, showTip, hideTip)\n    } else {\n      this.drawHorizontalBoxplot(g, plotW, plotH, showTip, hideTip)\n    }\n  }\n\n  private drawVerticalBoxplot(g: any, plotW: number, plotH: number, showTip: Function, hideTip: Function) {\n    // 박스플롯 도메인은 min/max 통계 범위로 유지\n    const y = d3\n      .scaleLinear()\n      .domain([this.data[this.minKey], this.data[this.maxKey]])\n      .range([plotH, 0])\n\n    // 현재값이 범위를 벗어나면 도메인 확장\n    if (this.data[this.valueKey] != null) {\n      const currentValue = this.data[this.valueKey]\n      if (currentValue < this.data[this.minKey] || currentValue > this.data[this.maxKey]) {\n        const allValues = [this.data[this.minKey], this.data[this.maxKey], currentValue]\n        y.domain([Math.min(...allValues), Math.max(...allValues)])\n      }\n    }\n\n    const boxWidth = Math.min(plotW * 0.6, 80)\n    const centerX = plotW / 2\n\n    // 박스 (Q1 ~ Q3)\n    const boxHeight = y(this.data[this.q1Key]) - y(this.data[this.q3Key])\n    g.append('rect')\n      .attr('x', centerX - boxWidth / 2)\n      .attr('y', y(this.data[this.q3Key]))\n      .attr('width', boxWidth)\n      .attr('height', boxHeight)\n      .attr('fill', '#B3D4FC')\n      .attr('opacity', 0.8)\n      .attr('stroke', '#7BB3F0')\n      .attr('stroke-width', 1)\n      .style('cursor', 'pointer')\n      .on('mouseenter', (evt: MouseEvent) => showTip(evt, [\n        `최대: ${Number(this.data[this.maxKey]).toFixed(2)}`,\n        `Q3: ${Number(this.data[this.q3Key]).toFixed(2)}`,\n        `중앙값: ${Number(this.data[this.medianKey]).toFixed(2)}`,\n        `Q1: ${Number(this.data[this.q1Key]).toFixed(2)}`,\n        `최소: ${Number(this.data[this.minKey]).toFixed(2)}`,\n        `평균: ${Number(this.data[this.meanKey]).toFixed(2)}`\n      ]))\n      .on('mouseleave', () => hideTip())\n\n    // 중앙선 (Median)\n    g.append('line')\n      .attr('x1', centerX - boxWidth / 2)\n      .attr('x2', centerX + boxWidth / 2)\n      .attr('y1', y(this.data[this.medianKey]))\n      .attr('y2', y(this.data[this.medianKey]))\n      .attr('stroke', '#7BB3F0')\n      .attr('stroke-width', 1.5)\n\n    // 위쪽 수염 (Q3 ~ Max)\n    g.append('line')\n      .attr('x1', centerX)\n      .attr('x2', centerX)\n      .attr('y1', y(this.data[this.q3Key]))\n      .attr('y2', y(this.data[this.maxKey]))\n      .attr('stroke', '#7BB3F0')\n      .attr('stroke-width', 1)\n\n    // 아래쪽 수염 (Min ~ Q1)\n    g.append('line')\n      .attr('x1', centerX)\n      .attr('x2', centerX)\n      .attr('y1', y(this.data[this.minKey]))\n      .attr('y2', y(this.data[this.q1Key]))\n      .attr('stroke', '#7BB3F0')\n      .attr('stroke-width', 1)\n\n    // Max 캡\n    const capWidth = boxWidth * 0.6\n    g.append('line')\n      .attr('x1', centerX - capWidth / 2)\n      .attr('x2', centerX + capWidth / 2)\n      .attr('y1', y(this.data[this.maxKey]))\n      .attr('y2', y(this.data[this.maxKey]))\n      .attr('stroke', '#7BB3F0')\n      .attr('stroke-width', 1)\n\n    // Min 캡\n    g.append('line')\n      .attr('x1', centerX - capWidth / 2)\n      .attr('x2', centerX + capWidth / 2)\n      .attr('y1', y(this.data[this.minKey]))\n      .attr('y2', y(this.data[this.minKey]))\n      .attr('stroke', '#7BB3F0')\n      .attr('stroke-width', 1)\n\n    // 평균값 (초록색)\n    if (this.data[this.meanKey] != null) {\n      g.append('circle')\n        .attr('cx', centerX)\n        .attr('cy', y(this.data[this.meanKey]))\n        .attr('r', 3)\n        .attr('fill', '#4CAF50')\n        .attr('stroke', '#fff')\n        .attr('stroke-width', 1)\n        .style('cursor', 'pointer')\n        .on('mouseenter', (evt: MouseEvent) => showTip(evt, [`평균: ${Number(this.data[this.meanKey]).toFixed(2)}`]))\n        .on('mouseleave', () => hideTip())\n    }\n\n    // 현재값 (오렌지색)\n    if (this.data[this.valueKey] != null) {\n      const currentValue = this.data[this.valueKey]\n      const isOutlier = currentValue < this.data[this.minKey] || currentValue > this.data[this.maxKey]\n\n      g.append('circle')\n        .attr('cx', centerX)\n        .attr('cy', y(currentValue))\n        .attr('r', 3)\n        .attr('fill', isOutlier ? '#ff4444' : '#ff9800')\n        .attr('stroke', '#fff')\n        .attr('stroke-width', 1)\n        .style('cursor', 'pointer')\n        .on('mouseenter', (evt: MouseEvent) => showTip(evt, [\n          `현재 프로젝트: ${Number(currentValue).toFixed(2)}`,\n          isOutlier ? '⚠ 이상치' : '정상 범위'\n        ]))\n        .on('mouseleave', () => hideTip())\n    }\n  }\n\n  private drawHorizontalBoxplot(g: any, plotW: number, plotH: number, showTip: Function, hideTip: Function) {\n    // 박스플롯 도메인은 min/max 통계 범위로 유지\n    const x = d3\n      .scaleLinear()\n      .domain([this.data[this.minKey], this.data[this.maxKey]])\n      .range([0, plotW])\n\n    // 현재값이 범위를 벗어나면 도메인 확장\n    if (this.data[this.valueKey] != null) {\n      const currentValue = this.data[this.valueKey]\n      if (currentValue < this.data[this.minKey] || currentValue > this.data[this.maxKey]) {\n        const allValues = [this.data[this.minKey], this.data[this.maxKey], currentValue]\n        x.domain([Math.min(...allValues), Math.max(...allValues)])\n      }\n    }\n\n    const boxHeight = Math.min(plotH * 0.6, 80)\n    const centerY = plotH / 2\n\n    // 박스 (Q1 ~ Q3)\n    const boxWidth = x(this.data[this.q3Key]) - x(this.data[this.q1Key])\n    g.append('rect')\n      .attr('x', x(this.data[this.q1Key]))\n      .attr('y', centerY - boxHeight / 2)\n      .attr('width', boxWidth)\n      .attr('height', boxHeight)\n      .attr('fill', '#B3D4FC')\n      .attr('opacity', 0.8)\n      .attr('stroke', '#7BB3F0')\n      .attr('stroke-width', 1)\n      .style('cursor', 'pointer')\n      .on('mouseenter', (evt: MouseEvent) => showTip(evt, [\n        `최대: ${Number(this.data[this.maxKey]).toFixed(2)}`,\n        `Q3: ${Number(this.data[this.q3Key]).toFixed(2)}`,\n        `중앙값: ${Number(this.data[this.medianKey]).toFixed(2)}`,\n        `Q1: ${Number(this.data[this.q1Key]).toFixed(2)}`,\n        `최소: ${Number(this.data[this.minKey]).toFixed(2)}`,\n        `평균: ${Number(this.data[this.meanKey]).toFixed(2)}`\n      ]))\n      .on('mouseleave', () => hideTip())\n\n    // 중앙선 (Median)\n    g.append('line')\n      .attr('x1', x(this.data[this.medianKey]))\n      .attr('x2', x(this.data[this.medianKey]))\n      .attr('y1', centerY - boxHeight / 2)\n      .attr('y2', centerY + boxHeight / 2)\n      .attr('stroke', '#7BB3F0')\n      .attr('stroke-width', 1.5)\n\n    // 왼쪽 수염 (Min ~ Q1)\n    g.append('line')\n      .attr('x1', x(this.data[this.minKey]))\n      .attr('x2', x(this.data[this.q1Key]))\n      .attr('y1', centerY)\n      .attr('y2', centerY)\n      .attr('stroke', '#7BB3F0')\n      .attr('stroke-width', 1)\n\n    // 오른쪽 수염 (Q3 ~ Max)\n    g.append('line')\n      .attr('x1', x(this.data[this.q3Key]))\n      .attr('x2', x(this.data[this.maxKey]))\n      .attr('y1', centerY)\n      .attr('y2', centerY)\n      .attr('stroke', '#7BB3F0')\n      .attr('stroke-width', 1)\n\n    // Min 캡\n    const capHeight = boxHeight * 0.6\n    g.append('line')\n      .attr('x1', x(this.data[this.minKey]))\n      .attr('x2', x(this.data[this.minKey]))\n      .attr('y1', centerY - capHeight / 2)\n      .attr('y2', centerY + capHeight / 2)\n      .attr('stroke', '#7BB3F0')\n      .attr('stroke-width', 1)\n\n    // Max 캡\n    g.append('line')\n      .attr('x1', x(this.data[this.maxKey]))\n      .attr('x2', x(this.data[this.maxKey]))\n      .attr('y1', centerY - capHeight / 2)\n      .attr('y2', centerY + capHeight / 2)\n      .attr('stroke', '#7BB3F0')\n      .attr('stroke-width', 1)\n\n    // 평균값 (초록색)\n    if (this.data[this.meanKey] != null) {\n      g.append('circle')\n        .attr('cx', x(this.data[this.meanKey]))\n        .attr('cy', centerY)\n        .attr('r', 3)\n        .attr('fill', '#4CAF50')\n        .attr('stroke', '#fff')\n        .attr('stroke-width', 1)\n        .style('cursor', 'pointer')\n        .on('mouseenter', (evt: MouseEvent) => showTip(evt, [`평균: ${Number(this.data[this.meanKey]).toFixed(2)}`]))\n        .on('mouseleave', () => hideTip())\n    }\n\n    // 현재값 (오렌지색)\n    if (this.data[this.valueKey] != null) {\n      const currentValue = this.data[this.valueKey]\n      const isOutlier = currentValue < this.data[this.minKey] || currentValue > this.data[this.maxKey]\n\n      g.append('circle')\n        .attr('cx', x(currentValue))\n        .attr('cy', centerY)\n        .attr('r', 3)\n        .attr('fill', isOutlier ? '#ff4444' : '#ff9800')\n        .attr('stroke', '#fff')\n        .attr('stroke-width', 1)\n        .style('cursor', 'pointer')\n        .on('mouseenter', (evt: MouseEvent) => showTip(evt, [\n          `현재 프로젝트: ${Number(currentValue).toFixed(2)}`,\n          isOutlier ? '⚠ 이상치' : '정상 범위'\n        ]))\n        .on('mouseleave', () => hideTip())\n    }\n  }\n}"]}

package/dist-client/components/kpi-trend-chart.d.ts

@@ -0,0 +1,25 @@
+import { LitElement } from 'lit';
+export declare class SvKpiTrendChart extends LitElement {
+    data: {
+        date: string;
+        value: number;
+        color?: string;
+    }[];
+    valueKey: string;
+    dateKey: string;
+    width: number;
+    height: number;
+    lineColor: string;
+    strokeWidth: number;
+    showPoints: boolean;
+    pointRadius: number;
+    private chartWidth;
+    private chartHeight;
+    private resizeObserver?;
+    static styles: import("lit").CSSResult;
+    render(): import("lit-html").TemplateResult<1>;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    updated(): void;
+    drawTrendChart(): void;
+}