@redvars/peacock 3.5.0 → 3.6.0

package/dist/chart-bar.js.map

@@ -1 +1 @@
-{"version":3,"file":"chart-bar.js","sources":["../../src/chart-bar/chart-bar.ts"],"sourcesContent":["import { html, LitElement, PropertyValues } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport * as d3 from 'd3';\nimport styles from './chart-bar.scss';\n\nexport type ChartBarItem = {\n  name: string;\n  value: number;\n  label?: string;\n  color?: string;\n};\n\nconst chartColors: string[] = [];\n['purple', 'blue', 'red', 'green', 'yellow', 'orange'].forEach(colorName => {\n  chartColors.push(`var(--color-${colorName})`);\n});\n\nconst DEFAULT_WIDTH = 480;\nconst DEFAULT_HEIGHT = 320;\nconst BAR_RADIUS = 10;\nconst DURATION = 450;\n\nfunction debounce<T extends (...args: any[]) => void>(fn: T, wait: number): T {\n  let timer: ReturnType<typeof setTimeout>;\n  return ((...args: any[]) => {\n    clearTimeout(timer);\n    timer = setTimeout(() => fn(...args), wait);\n  }) as T;\n}\n\n/**\n * @label Chart Bar\n * @tag wc-chart-bar\n * @rawTag chart-bar\n * @summary A vertical bar chart that follows Material Design 3 color and spacing tokens.\n * @tags charts\n *\n * @example\n * ```html\n * <wc-chart-bar width=\"520\" height=\"320\"></wc-chart-bar>\n * <script>\n *   document.querySelector('wc-chart-bar').data = [\n *     { name: 'apples', label: 'Apples', value: 20 },\n *     { name: 'bananas', label: 'Bananas', value: 35 },\n *     { name: 'cherries', label: 'Cherries', value: 15 },\n *   ];\n * </script>\n * ```\n */\n@IndividualComponent\nexport class ChartBar extends LitElement {\n  static styles = [styles];\n\n  @query('svg')\n  private svgElement?: SVGElement;\n\n  /** Width of the chart in pixels. */\n  @property({ type: Number, reflect: true }) width: number = 0;\n\n  /** Height of the chart in pixels. */\n  @property({ type: Number, reflect: true }) height: number = DEFAULT_HEIGHT;\n\n  /** Margin around the chart drawing area. */\n  @property({ type: Number }) margin: number = 24;\n\n  /** Chart data array. Each item should have name, value, and optional label and color. */\n  @property({ type: Array }) data: ChartBarItem[] = [];\n\n  /** Whether to render value labels above bars. */\n  @property({ type: Boolean, attribute: 'show-values' }) showValues: boolean = true;\n\n  private _initialized = false;\n\n  private _debouncedRenderChart = debounce(() => {\n    this._renderChart(true);\n  }, 200);\n\n  firstUpdated() {\n    this._renderChart(false);\n  }\n\n  updated(changedProperties: PropertyValues) {\n    if (!this._initialized) {\n      this._initialized = true;\n      return;\n    }\n    const watchedProps = ['width', 'height', 'margin', 'data', 'showValues'];\n    const hasChanged = watchedProps.some(prop => changedProperties.has(prop));\n    if (hasChanged) {\n      this._debouncedRenderChart();\n    }\n  }\n\n  private _getPaletteScale() {\n    return d3\n      .scaleOrdinal<string, string>()\n      .domain(this.data.map(d => d.name))\n      .range(chartColors);\n  }\n\n  private _resolveColor(\n    name: string,\n    override: string | undefined,\n    scale: d3.ScaleOrdinal<string, string>,\n  ) {\n    return override || scale(name);\n  }\n\n  private _renderChart(animate: boolean) {\n    if (!this.svgElement) return;\n\n    const width = this.width > 0 ? this.width : DEFAULT_WIDTH;\n    const height = this.height > 0 ? this.height : DEFAULT_HEIGHT;\n    const margin = Math.max(this.margin, 12);\n    const data = this.data ?? [];\n\n    const svg = d3.select(this.svgElement);\n    svg.attr('width', width).attr('height', height);\n\n    const innerWidth = Math.max(width - margin * 2, 0);\n    const innerHeight = Math.max(height - margin * 2, 0);\n    const colorScale = this._getPaletteScale();\n\n    const container = svg.select<SVGGElement>('.chart-container');\n    container.attr('transform', `translate(${margin},${margin})`);\n\n    if (!data.length || innerWidth === 0 || innerHeight === 0) {\n      container.select('.bars').selectAll('*').remove();\n      container.select('.x-axis').selectAll('*').remove();\n      container.select('.y-grid').selectAll('*').remove();\n      container.select('.value-labels').selectAll('*').remove();\n      return;\n    }\n\n    const xScale = d3\n      .scaleBand<string>()\n      .domain(data.map(d => d.name))\n      .range([0, innerWidth])\n      .padding(0.28);\n\n    const maxValue = d3.max(data, d => d.value) ?? 0;\n    const yScale = d3\n      .scaleLinear()\n      .domain([0, maxValue || 1])\n      .nice()\n      .range([innerHeight, 0]);\n\n    const yGrid = container.select<SVGGElement>('.y-grid');\n    yGrid\n      .call(\n        d3\n          .axisLeft(yScale)\n          .ticks(5)\n          .tickSize(-innerWidth)\n          .tickFormat(() => ''),\n      )\n      .selectAll('.tick text')\n      .remove();\n    yGrid.select('.domain').remove();\n    yGrid.selectAll('.tick line').attr('class', 'gridline');\n\n    const xAxis = container.select<SVGGElement>('.x-axis');\n    xAxis\n      .attr('transform', `translate(0,${innerHeight})`)\n      .call(\n        d3\n          .axisBottom(xScale)\n          .tickSizeOuter(0)\n          .tickFormat(name => {\n            const entry = data.find(d => d.name === name);\n            return entry?.label ?? name;\n          }),\n      );\n    xAxis.select('.domain').attr('stroke', 'var(--color-outline-variant)');\n    xAxis.selectAll('.tick line').remove();\n    xAxis\n      .selectAll('.tick text')\n      .attr('class', 'axis-label')\n      .attr('dy', '1.1em');\n\n    const bars = container\n      .select('.bars')\n      .selectAll<SVGRectElement, ChartBarItem>('rect')\n      .data(data, d => d.name)\n      .join(\n        enter =>\n          enter\n            .append('rect')\n            .attr('class', 'bar')\n            .attr('x', d => xScale(d.name) ?? 0)\n            .attr('width', xScale.bandwidth())\n            .attr('y', innerHeight)\n            .attr('height', 0)\n            .attr('rx', BAR_RADIUS)\n            .attr('ry', BAR_RADIUS)\n            .style('fill', d =>\n              this._resolveColor(d.name, d.color, colorScale),\n            ),\n        update => update,\n        exit =>\n          exit\n            .transition()\n            .duration(DURATION)\n            .attr('height', 0)\n            .attr('y', innerHeight)\n            .remove(),\n      );\n\n    bars\n      .attr('x', d => xScale(d.name) ?? 0)\n      .attr('width', xScale.bandwidth())\n      .attr('rx', BAR_RADIUS)\n      .attr('ry', BAR_RADIUS)\n      .style('fill', d => this._resolveColor(d.name, d.color, colorScale));\n\n    if (animate) {\n      bars\n        .transition()\n        .duration(DURATION)\n        .attr('y', d => yScale(d.value))\n        .attr('height', d => innerHeight - yScale(d.value));\n    } else {\n      bars\n        .attr('y', d => yScale(d.value))\n        .attr('height', d => innerHeight - yScale(d.value));\n    }\n\n    const valueLabels = container\n      .select('.value-labels')\n      .selectAll<SVGTextElement, ChartBarItem>('text')\n      .data(this.showValues ? data : [], d => d.name)\n      .join(\n        enter =>\n          enter\n            .append('text')\n            .attr('class', 'value-label')\n            .attr('text-anchor', 'middle')\n            .attr('x', d => (xScale(d.name) ?? 0) + xScale.bandwidth() / 2)\n            .attr('y', innerHeight - 6)\n            .text(d => d.value.toLocaleString()),\n        update => update,\n        exit => exit.remove(),\n      );\n\n    const resolveLabelY = (value: number) => {\n      const offset = yScale(value) - 8;\n      return Math.min(offset, innerHeight - 8);\n    };\n\n    if (animate) {\n      valueLabels\n        .transition()\n        .duration(DURATION)\n        .attr('x', d => (xScale(d.name) ?? 0) + xScale.bandwidth() / 2)\n        .attr('y', d => resolveLabelY(d.value))\n        .text(d => d.value.toLocaleString());\n    } else {\n      valueLabels\n        .attr('x', d => (xScale(d.name) ?? 0) + xScale.bandwidth() / 2)\n        .attr('y', d => resolveLabelY(d.value))\n        .text(d => d.value.toLocaleString());\n    }\n  }\n\n  render() {\n    const paletteScale = this._getPaletteScale();\n    const legendItems = this.data.map(item => ({\n      name: item.label ?? item.name,\n      color: this._resolveColor(item.name, item.color, paletteScale),\n    }));\n\n    return html`\n      <div class=\"chart-frame\">\n        <svg role=\"img\" aria-label=\"Bar chart\">\n          <g class=\"chart-container\">\n            <g class=\"y-grid\"></g>\n            <g class=\"bars\"></g>\n            <g class=\"x-axis\"></g>\n            <g class=\"value-labels\"></g>\n          </g>\n        </svg>\n        ${legendItems.length\n          ? html`<div class=\"legend\" role=\"list\">\n              ${legendItems.map(\n                item => html`<span class=\"legend-item\" role=\"listitem\">\n                  <span\n                    class=\"swatch\"\n                    style=${styleMap({ background: item.color })}\n                  ></span>\n                  <span>${item.name}</span>\n                </span>`,\n              )}\n            </div>`\n          : null}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'wc-chart-bar': ChartBar;\n  }\n}\n"],"names":["LitElement","d3\n            .scaleOrdinal","d3.select","d3\n            .scaleBand","d3.max","d3\n            .scaleLinear","d3\n            .axisLeft","d3\n            .axisBottom","html","styleMap","styles","query","property"],"mappings":"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"}
+{"version":3,"file":"chart-bar.js","sources":["../../src/chart-bar/chart-bar.ts"],"sourcesContent":["import { html, LitElement, PropertyValues } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { select, max, scaleBand, scaleLinear, scaleOrdinal, axisLeft, axisBottom, ScaleOrdinal } from 'd3';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './chart-bar.scss';\n\nexport type ChartBarItem = {\n  name: string;\n  value: number;\n  label?: string;\n  color?: string;\n};\n\nconst chartColors: string[] = [];\n['purple', 'blue', 'red', 'green', 'yellow', 'orange'].forEach(colorName => {\n  chartColors.push(`var(--color-${colorName})`);\n});\n\nconst DEFAULT_WIDTH = 480;\nconst DEFAULT_HEIGHT = 320;\nconst BAR_RADIUS = 10;\nconst DURATION = 450;\n\nfunction debounce<T extends (...args: any[]) => void>(fn: T, wait: number): T {\n  let timer: ReturnType<typeof setTimeout>;\n  return ((...args: any[]) => {\n    clearTimeout(timer);\n    timer = setTimeout(() => fn(...args), wait);\n  }) as T;\n}\n\n/**\n * @label Chart Bar\n * @tag wc-chart-bar\n * @rawTag chart-bar\n * @summary A vertical bar chart that follows Material Design 3 color and spacing tokens.\n * @tags charts\n *\n * @example\n * ```html\n * <wc-chart-bar width=\"520\" height=\"320\"></wc-chart-bar>\n * <script>\n *   document.querySelector('wc-chart-bar').data = [\n *     { name: 'apples', label: 'Apples', value: 20 },\n *     { name: 'bananas', label: 'Bananas', value: 35 },\n *     { name: 'cherries', label: 'Cherries', value: 15 },\n *   ];\n * </script>\n * ```\n */\n@IndividualComponent\nexport class ChartBar extends LitElement {\n  static styles = [styles];\n\n  @query('svg')\n  private svgElement?: SVGElement;\n\n  /** Width of the chart in pixels. */\n  @property({ type: Number, reflect: true }) width: number = 0;\n\n  /** Height of the chart in pixels. */\n  @property({ type: Number, reflect: true }) height: number = DEFAULT_HEIGHT;\n\n  /** Margin around the chart drawing area. */\n  @property({ type: Number }) margin: number = 24;\n\n  /** Chart data array. Each item should have name, value, and optional label and color. */\n  @property({ type: Array }) data: ChartBarItem[] = [];\n\n  /** Whether to render value labels above bars. */\n  @property({ type: Boolean, attribute: 'show-values' }) showValues: boolean = true;\n\n  private _initialized = false;\n\n  private _debouncedRenderChart = debounce(() => {\n    this._renderChart(true);\n  }, 200);\n\n  firstUpdated() {\n    this._renderChart(false);\n  }\n\n  updated(changedProperties: PropertyValues) {\n    if (!this._initialized) {\n      this._initialized = true;\n      return;\n    }\n    const watchedProps = ['width', 'height', 'margin', 'data', 'showValues'];\n    const hasChanged = watchedProps.some(prop => changedProperties.has(prop));\n    if (hasChanged) {\n      this._debouncedRenderChart();\n    }\n  }\n\n  private _getPaletteScale() {\n    return scaleOrdinal<string, string>()\n      .domain(this.data.map(d => d.name))\n      .range(chartColors);\n  }\n\n  private _resolveColor(\n    name: string,\n    override: string | undefined,\n    scale: ScaleOrdinal<string, string>,\n  ) {\n    return override || scale(name);\n  }\n\n  private _renderChart(animate: boolean) {\n    if (!this.svgElement) return;\n\n    const width = this.width > 0 ? this.width : DEFAULT_WIDTH;\n    const height = this.height > 0 ? this.height : DEFAULT_HEIGHT;\n    const margin = Math.max(this.margin, 12);\n    const data = this.data ?? [];\n\n    const svg = select(this.svgElement);\n    svg.attr('width', width).attr('height', height);\n\n    const innerWidth = Math.max(width - margin * 2, 0);\n    const innerHeight = Math.max(height - margin * 2, 0);\n    const colorScale = this._getPaletteScale();\n\n    const container = svg.select<SVGGElement>('.chart-container');\n    container.attr('transform', `translate(${margin},${margin})`);\n\n    if (!data.length || innerWidth === 0 || innerHeight === 0) {\n      container.select('.bars').selectAll('*').remove();\n      container.select('.x-axis').selectAll('*').remove();\n      container.select('.y-grid').selectAll('*').remove();\n      container.select('.value-labels').selectAll('*').remove();\n      return;\n    }\n\n    const xScale = scaleBand<string>()\n      .domain(data.map(d => d.name))\n      .range([0, innerWidth])\n      .padding(0.28);\n\n    const maxValue = max(data, d => d.value) ?? 0;\n    const yScale = scaleLinear()\n      .domain([0, maxValue || 1])\n      .nice()\n      .range([innerHeight, 0]);\n\n    const yGrid = container.select<SVGGElement>('.y-grid');\n    yGrid\n      .call(\n        axisLeft(yScale)\n          .ticks(5)\n          .tickSize(-innerWidth)\n          .tickFormat(() => ''),\n      )\n      .selectAll('.tick text')\n      .remove();\n    yGrid.select('.domain').remove();\n    yGrid.selectAll('.tick line').attr('class', 'gridline');\n\n    const xAxis = container.select<SVGGElement>('.x-axis');\n    xAxis\n      .attr('transform', `translate(0,${innerHeight})`)\n      .call(\n        axisBottom(xScale)\n          .tickSizeOuter(0)\n          .tickFormat(name => {\n            const entry = data.find(d => d.name === name);\n            return entry?.label ?? name;\n          }),\n      );\n    xAxis.select('.domain').attr('stroke', 'var(--color-outline-variant)');\n    xAxis.selectAll('.tick line').remove();\n    xAxis\n      .selectAll('.tick text')\n      .attr('class', 'axis-label')\n      .attr('dy', '1.1em');\n\n    const bars = container\n      .select('.bars')\n      .selectAll<SVGRectElement, ChartBarItem>('rect')\n      .data(data, d => d.name)\n      .join(\n        enter =>\n          enter\n            .append('rect')\n            .attr('class', 'bar')\n            .attr('x', d => xScale(d.name) ?? 0)\n            .attr('width', xScale.bandwidth())\n            .attr('y', innerHeight)\n            .attr('height', 0)\n            .attr('rx', BAR_RADIUS)\n            .attr('ry', BAR_RADIUS)\n            .style('fill', d =>\n              this._resolveColor(d.name, d.color, colorScale),\n            ),\n        update => update,\n        exit =>\n          exit\n            .transition()\n            .duration(DURATION)\n            .attr('height', 0)\n            .attr('y', innerHeight)\n            .remove(),\n      );\n\n    bars\n      .attr('x', d => xScale(d.name) ?? 0)\n      .attr('width', xScale.bandwidth())\n      .attr('rx', BAR_RADIUS)\n      .attr('ry', BAR_RADIUS)\n      .style('fill', d => this._resolveColor(d.name, d.color, colorScale));\n\n    if (animate) {\n      bars\n        .transition()\n        .duration(DURATION)\n        .attr('y', d => yScale(d.value))\n        .attr('height', d => innerHeight - yScale(d.value));\n    } else {\n      bars\n        .attr('y', d => yScale(d.value))\n        .attr('height', d => innerHeight - yScale(d.value));\n    }\n\n    const valueLabels = container\n      .select('.value-labels')\n      .selectAll<SVGTextElement, ChartBarItem>('text')\n      .data(this.showValues ? data : [], d => d.name)\n      .join(\n        enter =>\n          enter\n            .append('text')\n            .attr('class', 'value-label')\n            .attr('text-anchor', 'middle')\n            .attr('x', d => (xScale(d.name) ?? 0) + xScale.bandwidth() / 2)\n            .attr('y', innerHeight - 6)\n            .text(d => d.value.toLocaleString()),\n        update => update,\n        exit => exit.remove(),\n      );\n\n    const resolveLabelY = (value: number) => {\n      const offset = yScale(value) - 8;\n      return Math.min(offset, innerHeight - 8);\n    };\n\n    if (animate) {\n      valueLabels\n        .transition()\n        .duration(DURATION)\n        .attr('x', d => (xScale(d.name) ?? 0) + xScale.bandwidth() / 2)\n        .attr('y', d => resolveLabelY(d.value))\n        .text(d => d.value.toLocaleString());\n    } else {\n      valueLabels\n        .attr('x', d => (xScale(d.name) ?? 0) + xScale.bandwidth() / 2)\n        .attr('y', d => resolveLabelY(d.value))\n        .text(d => d.value.toLocaleString());\n    }\n  }\n\n  render() {\n    const paletteScale = this._getPaletteScale();\n    const legendItems = this.data.map(item => ({\n      name: item.label ?? item.name,\n      color: this._resolveColor(item.name, item.color, paletteScale),\n    }));\n\n    return html`\n      <div class=\"chart-frame\">\n        <svg role=\"img\" aria-label=\"Bar chart\">\n          <g class=\"chart-container\">\n            <g class=\"y-grid\"></g>\n            <g class=\"bars\"></g>\n            <g class=\"x-axis\"></g>\n            <g class=\"value-labels\"></g>\n          </g>\n        </svg>\n        ${legendItems.length\n          ? html`<div class=\"legend\" role=\"list\">\n              ${legendItems.map(\n                item => html`<span class=\"legend-item\" role=\"listitem\">\n                  <span\n                    class=\"swatch\"\n                    style=${styleMap({ background: item.color })}\n                  ></span>\n                  <span>${item.name}</span>\n                </span>`,\n              )}\n            </div>`\n          : null}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'wc-chart-bar': ChartBar;\n  }\n}\n"],"names":["LitElement","scaleOrdinal","scaleBand","scaleLinear","html","styleMap","styles","query","property"],"mappings":"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"}

package/dist/chart-doughnut.js

@@ -127,10 +127,10 @@ let ChartDoughnut = class ChartDoughnut extends i$1 {
         return this.data.reduce((total, d) => total + d.value, 0);
     }
     _getPieData() {
-        const pie$1 = pie()
+        const pieGenerator = pie()
             .sort(null)
             .value(d => d.value);
-        return pie$1(this.data);
+        return pieGenerator(this.data);
     }
     _getColorScale() {
         return ordinal()

package/dist/chart-doughnut.js.map

@@ -1 +1 @@
-{"version":3,"file":"chart-doughnut.js","sources":["../../src/chart-doughnut/chart-doughnut.ts"],"sourcesContent":["import { html, LitElement, PropertyValues } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport * as d3 from 'd3';\nimport styles from './chart-donut.scss';\n\nexport type ChartDoughnutColor = {\n  color: string;\n};\n\nexport type ChartDoughnutItem = {\n  name: string;\n  value: number;\n  label?: string;\n  color?: string;\n};\n\nconst chartColors: ChartDoughnutColor[] = [];\n['purple', 'blue', 'red', 'green', 'yellow', 'orange'].forEach(colorName => {\n  chartColors.push({\n    color: `var(--color-${colorName})`,\n  });\n});\n\n/** SVGPathElement augmented with the last rendered arc datum for smooth tween interpolation. */\ninterface ArcPathElement extends SVGPathElement {\n  _prevDatum?: d3.PieArcDatum<ChartDoughnutItem>;\n}\n\nfunction debounce<T extends (...args: any[]) => void>(fn: T, wait: number): T {\n  let timer: ReturnType<typeof setTimeout>;\n  return ((...args: any[]) => {\n    clearTimeout(timer);\n    timer = setTimeout(() => fn(...args), wait);\n  }) as T;\n}\n\n/**\n * @label Chart Doughnut\n * @tag wc-chart-doughnut\n * @rawTag chart-doughnut\n * @summary A doughnut chart is a circular chart with a blank center. The area in the center can be used to display information.\n * @tags charts\n *\n * @example\n * ```html\n * <wc-chart-doughnut width=\"400\" label=\"Total\"></wc-chart-doughnut>\n * <script>\n *   document.querySelector('wc-chart-doughnut').data = [\n *     { name: 'A', value: 30, label: 'Category A' },\n *     { name: 'B', value: 50, label: 'Category B' },\n *     { name: 'C', value: 20, label: 'Category C' },\n *   ];\n * </script>\n * ```\n */\n@IndividualComponent\nexport class ChartDoughnut extends LitElement {\n  static styles = [styles];\n\n  @query('svg')\n  private svgElement?: SVGElement;\n\n  /** Width (and height) of the chart in pixels. */\n  @property({ type: Number, reflect: true }) width: number = 0;\n\n  /** Margin around the chart. */\n  @property({ type: Number, reflect: true }) margin: number = 10;\n\n  /** Whether to show labels outside the chart. */\n  @property({ type: Boolean, reflect: true, attribute: 'show-labels' })\n  showLabels: boolean = true;\n\n  /** Chart data array. Each item should have name, value, and optional label and color. */\n  @property({ type: Array }) data: ChartDoughnutItem[] = [];\n\n  /** Label displayed in the center of the doughnut. */\n  @property({ type: String }) label?: string;\n\n  private _initialized = false;\n\n  private _debouncedRenderChart = debounce(() => {\n    this._renderChart(true);\n  }, 300);\n\n  firstUpdated() {\n    this._renderChart(false);\n  }\n\n  updated(changedProperties: PropertyValues) {\n    if (!this._initialized) {\n      this._initialized = true;\n      return;\n    }\n    const watchedProps = ['width', 'margin', 'showLabels', 'data'];\n    const hasChanged = watchedProps.some(prop => changedProperties.has(prop));\n    if (hasChanged) {\n      this._debouncedRenderChart();\n    }\n  }\n\n  private _getRadius(): number {\n    return this.width / 2 - this.margin - 100;\n  }\n\n  private _getTotal(): number {\n    return this.data.reduce((total, d) => total + d.value, 0);\n  }\n\n  private _getPieData() {\n    const pie = d3\n      .pie<ChartDoughnutItem>()\n      .sort(null)\n      .value(d => d.value);\n    return pie(this.data);\n  }\n\n  private _getColorScale() {\n    return d3\n      .scaleOrdinal<string, ChartDoughnutColor>()\n      .domain(this.data.map(d => d.name))\n      .range(chartColors);\n  }\n\n  private _renderChart(animate: boolean) {\n    if (!this.svgElement) return;\n\n    const DURATION = 500;\n    const radius = this._getRadius();\n    const pieData = this._getPieData();\n    const colorScale = this._getColorScale();\n    const total = this._getTotal();\n\n    const svg = d3.select(this.svgElement);\n\n    const doughnutArc = d3\n      .arc<d3.PieArcDatum<ChartDoughnutItem>>()\n      .innerRadius(radius * 0.72)\n      .outerRadius(radius);\n\n    const labelsArc = d3\n      .arc<d3.PieArcDatum<ChartDoughnutItem>>()\n      .innerRadius(radius + 10)\n      .outerRadius(radius + 10);\n\n    // Update SVG dimensions and center transform\n    svg.attr('width', this.width).attr('height', this.width);\n    svg\n      .select('.chart-container')\n      .attr('transform', `translate(${this.width / 2},${this.width / 2})`);\n\n    // Arc paths — keyed by name so D3 matches elements across updates\n    const $paths = svg\n      .select('.arc-container')\n      .selectAll<SVGPathElement, d3.PieArcDatum<ChartDoughnutItem>>('.arc')\n      .data(pieData, d => d.data.name)\n      .join('path')\n      .attr('class', 'arc')\n      .style('fill', d => d.data.color || colorScale(d.data.name).color);\n\n    if (animate) {\n      $paths\n        .transition()\n        .duration(DURATION)\n        .ease(d3.easeCubicInOut)\n        .attrTween('d', function (this: SVGPathElement, d) {\n          const self = this as ArcPathElement;\n          // Interpolate from the last rendered angles to the new ones.\n          // New (entering) arcs start collapsed at their startAngle.\n          const prev: { startAngle: number; endAngle: number } =\n            self._prevDatum ?? {\n              startAngle: d.startAngle,\n              endAngle: d.startAngle,\n            };\n          self._prevDatum = d;\n          const iStart = d3.interpolateNumber(prev.startAngle, d.startAngle);\n          const iEnd = d3.interpolateNumber(prev.endAngle, d.endAngle);\n          return (t: number) =>\n            doughnutArc({ ...d, startAngle: iStart(t), endAngle: iEnd(t) }) ??\n            '';\n        });\n    } else {\n      // Initial render: draw immediately and seed previous-datum for later tweens\n      $paths\n        .each(function (this: SVGPathElement, d) {\n          (this as ArcPathElement)._prevDatum = d;\n        })\n        .attr('d', d => doughnutArc(d) ?? '');\n    }\n\n    // Animate the central total counter\n    const $title = svg.select('.title');\n    if (animate) {\n      $title\n        .transition()\n        .duration(DURATION)\n        .ease(d3.easeCubicInOut)\n        .tween('text', function (this: d3.BaseType) {\n          const sel = d3.select(this as SVGTextElement);\n          const start = parseFloat(sel.text()) || 0;\n          const interp = d3.interpolateNumber(start, total);\n          return function (t: number) {\n            sel.text(Math.round(interp(t)));\n          };\n        });\n    } else {\n      $title.text(total);\n    }\n\n    // Label polylines and text\n    const $chartContainer = svg.select('.chart-container');\n\n    if (this.showLabels) {\n      const pointsFn = (d: d3.PieArcDatum<ChartDoughnutItem>) => {\n        const posA = doughnutArc.centroid(d);\n        const posB = labelsArc.centroid(d);\n        const posC = posB.slice() as [number, number];\n        const midAngle = d.startAngle + (d.endAngle - d.startAngle) / 2;\n        posC[0] = radius * (midAngle < Math.PI ? 1 : -1);\n        return [posA, posB, posC].map(p => p.join(',')).join(' ');\n      };\n\n      const transformFn = (d: d3.PieArcDatum<ChartDoughnutItem>) => {\n        const pos = labelsArc.centroid(d);\n        const midAngle = d.startAngle + (d.endAngle - d.startAngle) / 2;\n        pos[0] = radius * (midAngle < Math.PI ? 1 : -1);\n        return `translate(${pos})`;\n      };\n\n      const anchorFn = (d: d3.PieArcDatum<ChartDoughnutItem>) => {\n        const midAngle = d.startAngle + (d.endAngle - d.startAngle) / 2;\n        return midAngle < Math.PI ? 'start' : 'end';\n      };\n\n      const $polylines = $chartContainer\n        .selectAll<SVGPolylineElement, d3.PieArcDatum<ChartDoughnutItem>>(\n          '.item-polyline',\n        )\n        .data(pieData, d => d.data.name)\n        .join('polyline')\n        .attr('class', 'item-polyline');\n\n      const $labels = $chartContainer\n        .selectAll<SVGTextElement, d3.PieArcDatum<ChartDoughnutItem>>('.item-label')\n        .data(pieData, d => d.data.name)\n        .join('text')\n        .attr('class', 'item-label')\n        .text(d => d.data.label ?? '');\n\n      if (animate) {\n        $polylines\n          .transition()\n          .duration(DURATION)\n          .ease(d3.easeCubicInOut)\n          .attr('points', pointsFn);\n        $labels\n          .transition()\n          .duration(DURATION)\n          .ease(d3.easeCubicInOut)\n          .attr('transform', transformFn)\n          .style('text-anchor', anchorFn);\n      } else {\n        $polylines.attr('points', pointsFn);\n        $labels.attr('transform', transformFn).style('text-anchor', anchorFn);\n      }\n    } else {\n      $chartContainer.selectAll('.item-polyline').remove();\n      $chartContainer.selectAll('.item-label').remove();\n    }\n  }\n\n  render() {\n    return html`\n      <div class=\"chart\">\n        <svg>\n          <g class=\"chart-container\">\n            <g class=\"arc-container\"></g>\n            <text class=\"title\" text-anchor=\"middle\"></text>\n            <text class=\"label\" text-anchor=\"middle\" y=\"16\">\n              ${this.label}\n            </text>\n          </g>\n        </svg>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","pie","d3\n            .pie","d3\n            .scaleOrdinal","d3.select","d3\n            .arc","d3.easeCubicInOut","d3.interpolateNumber","html","styles","query","property"],"mappings":"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"}
+{"version":3,"file":"chart-doughnut.js","sources":["../../src/chart-doughnut/chart-doughnut.ts"],"sourcesContent":["import { html, LitElement, PropertyValues } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { select, arc, pie, scaleOrdinal, easeCubicInOut, interpolateNumber, PieArcDatum, BaseType } from 'd3';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './chart-donut.scss';\n\nexport type ChartDoughnutColor = {\n  color: string;\n};\n\nexport type ChartDoughnutItem = {\n  name: string;\n  value: number;\n  label?: string;\n  color?: string;\n};\n\nconst chartColors: ChartDoughnutColor[] = [];\n['purple', 'blue', 'red', 'green', 'yellow', 'orange'].forEach(colorName => {\n  chartColors.push({\n    color: `var(--color-${colorName})`,\n  });\n});\n\n/** SVGPathElement augmented with the last rendered arc datum for smooth tween interpolation. */\ninterface ArcPathElement extends SVGPathElement {\n  _prevDatum?: PieArcDatum<ChartDoughnutItem>;\n}\n\nfunction debounce<T extends (...args: any[]) => void>(fn: T, wait: number): T {\n  let timer: ReturnType<typeof setTimeout>;\n  return ((...args: any[]) => {\n    clearTimeout(timer);\n    timer = setTimeout(() => fn(...args), wait);\n  }) as T;\n}\n\n/**\n * @label Chart Doughnut\n * @tag wc-chart-doughnut\n * @rawTag chart-doughnut\n * @summary A doughnut chart is a circular chart with a blank center. The area in the center can be used to display information.\n * @tags charts\n *\n * @example\n * ```html\n * <wc-chart-doughnut width=\"400\" label=\"Total\"></wc-chart-doughnut>\n * <script>\n *   document.querySelector('wc-chart-doughnut').data = [\n *     { name: 'A', value: 30, label: 'Category A' },\n *     { name: 'B', value: 50, label: 'Category B' },\n *     { name: 'C', value: 20, label: 'Category C' },\n *   ];\n * </script>\n * ```\n */\n@IndividualComponent\nexport class ChartDoughnut extends LitElement {\n  static styles = [styles];\n\n  @query('svg')\n  private svgElement?: SVGElement;\n\n  /** Width (and height) of the chart in pixels. */\n  @property({ type: Number, reflect: true }) width: number = 0;\n\n  /** Margin around the chart. */\n  @property({ type: Number, reflect: true }) margin: number = 10;\n\n  /** Whether to show labels outside the chart. */\n  @property({ type: Boolean, reflect: true, attribute: 'show-labels' })\n  showLabels: boolean = true;\n\n  /** Chart data array. Each item should have name, value, and optional label and color. */\n  @property({ type: Array }) data: ChartDoughnutItem[] = [];\n\n  /** Label displayed in the center of the doughnut. */\n  @property({ type: String }) label?: string;\n\n  private _initialized = false;\n\n  private _debouncedRenderChart = debounce(() => {\n    this._renderChart(true);\n  }, 300);\n\n  firstUpdated() {\n    this._renderChart(false);\n  }\n\n  updated(changedProperties: PropertyValues) {\n    if (!this._initialized) {\n      this._initialized = true;\n      return;\n    }\n    const watchedProps = ['width', 'margin', 'showLabels', 'data'];\n    const hasChanged = watchedProps.some(prop => changedProperties.has(prop));\n    if (hasChanged) {\n      this._debouncedRenderChart();\n    }\n  }\n\n  private _getRadius(): number {\n    return this.width / 2 - this.margin - 100;\n  }\n\n  private _getTotal(): number {\n    return this.data.reduce((total, d) => total + d.value, 0);\n  }\n\n  private _getPieData() {\n    const pieGenerator = pie<ChartDoughnutItem>()\n      .sort(null)\n      .value(d => d.value);\n    return pieGenerator(this.data);\n  }\n\n  private _getColorScale() {\n    return scaleOrdinal<string, ChartDoughnutColor>()\n      .domain(this.data.map(d => d.name))\n      .range(chartColors);\n  }\n\n  private _renderChart(animate: boolean) {\n    if (!this.svgElement) return;\n\n    const DURATION = 500;\n    const radius = this._getRadius();\n    const pieData = this._getPieData();\n    const colorScale = this._getColorScale();\n    const total = this._getTotal();\n\n    const svg = select(this.svgElement);\n\n    const doughnutArc = arc<PieArcDatum<ChartDoughnutItem>>()\n      .innerRadius(radius * 0.72)\n      .outerRadius(radius);\n\n    const labelsArc = arc<PieArcDatum<ChartDoughnutItem>>()\n      .innerRadius(radius + 10)\n      .outerRadius(radius + 10);\n\n    // Update SVG dimensions and center transform\n    svg.attr('width', this.width).attr('height', this.width);\n    svg\n      .select('.chart-container')\n      .attr('transform', `translate(${this.width / 2},${this.width / 2})`);\n\n    // Arc paths — keyed by name so D3 matches elements across updates\n    const $paths = svg\n      .select('.arc-container')\n      .selectAll<SVGPathElement, PieArcDatum<ChartDoughnutItem>>('.arc')\n      .data(pieData, d => d.data.name)\n      .join('path')\n      .attr('class', 'arc')\n      .style('fill', d => d.data.color || colorScale(d.data.name).color);\n\n    if (animate) {\n      $paths\n        .transition()\n        .duration(DURATION)\n        .ease(easeCubicInOut)\n        .attrTween('d', function (this: SVGPathElement, d) {\n          const self = this as ArcPathElement;\n          // Interpolate from the last rendered angles to the new ones.\n          // New (entering) arcs start collapsed at their startAngle.\n          const prev: { startAngle: number; endAngle: number } =\n            self._prevDatum ?? {\n              startAngle: d.startAngle,\n              endAngle: d.startAngle,\n            };\n          self._prevDatum = d;\n          const iStart = interpolateNumber(prev.startAngle, d.startAngle);\n          const iEnd = interpolateNumber(prev.endAngle, d.endAngle);\n          return (t: number) =>\n            doughnutArc({ ...d, startAngle: iStart(t), endAngle: iEnd(t) }) ??\n            '';\n        });\n    } else {\n      // Initial render: draw immediately and seed previous-datum for later tweens\n      $paths\n        .each(function (this: SVGPathElement, d) {\n          (this as ArcPathElement)._prevDatum = d;\n        })\n        .attr('d', d => doughnutArc(d) ?? '');\n    }\n\n    // Animate the central total counter\n    const $title = svg.select('.title');\n    if (animate) {\n      $title\n        .transition()\n        .duration(DURATION)\n        .ease(easeCubicInOut)\n        .tween('text', function (this: BaseType) {\n          const sel = select(this as SVGTextElement);\n          const start = parseFloat(sel.text()) || 0;\n          const interp = interpolateNumber(start, total);\n          return function (t: number) {\n            sel.text(Math.round(interp(t)));\n          };\n        });\n    } else {\n      $title.text(total);\n    }\n\n    // Label polylines and text\n    const $chartContainer = svg.select('.chart-container');\n\n    if (this.showLabels) {\n      const pointsFn = (d: PieArcDatum<ChartDoughnutItem>) => {\n        const posA = doughnutArc.centroid(d);\n        const posB = labelsArc.centroid(d);\n        const posC = posB.slice() as [number, number];\n        const midAngle = d.startAngle + (d.endAngle - d.startAngle) / 2;\n        posC[0] = radius * (midAngle < Math.PI ? 1 : -1);\n        return [posA, posB, posC].map(p => p.join(',')).join(' ');\n      };\n\n      const transformFn = (d: PieArcDatum<ChartDoughnutItem>) => {\n        const pos = labelsArc.centroid(d);\n        const midAngle = d.startAngle + (d.endAngle - d.startAngle) / 2;\n        pos[0] = radius * (midAngle < Math.PI ? 1 : -1);\n        return `translate(${pos})`;\n      };\n\n      const anchorFn = (d: PieArcDatum<ChartDoughnutItem>) => {\n        const midAngle = d.startAngle + (d.endAngle - d.startAngle) / 2;\n        return midAngle < Math.PI ? 'start' : 'end';\n      };\n\n      const $polylines = $chartContainer\n        .selectAll<SVGPolylineElement, PieArcDatum<ChartDoughnutItem>>(\n          '.item-polyline',\n        )\n        .data(pieData, d => d.data.name)\n        .join('polyline')\n        .attr('class', 'item-polyline');\n\n      const $labels = $chartContainer\n        .selectAll<SVGTextElement, PieArcDatum<ChartDoughnutItem>>('.item-label')\n        .data(pieData, d => d.data.name)\n        .join('text')\n        .attr('class', 'item-label')\n        .text(d => d.data.label ?? '');\n\n      if (animate) {\n        $polylines\n          .transition()\n          .duration(DURATION)\n          .ease(easeCubicInOut)\n          .attr('points', pointsFn);\n        $labels\n          .transition()\n          .duration(DURATION)\n          .ease(easeCubicInOut)\n          .attr('transform', transformFn)\n          .style('text-anchor', anchorFn);\n      } else {\n        $polylines.attr('points', pointsFn);\n        $labels.attr('transform', transformFn).style('text-anchor', anchorFn);\n      }\n    } else {\n      $chartContainer.selectAll('.item-polyline').remove();\n      $chartContainer.selectAll('.item-label').remove();\n    }\n  }\n\n  render() {\n    return html`\n      <div class=\"chart\">\n        <svg>\n          <g class=\"chart-container\">\n            <g class=\"arc-container\"></g>\n            <text class=\"title\" text-anchor=\"middle\"></text>\n            <text class=\"label\" text-anchor=\"middle\" y=\"16\">\n              ${this.label}\n            </text>\n          </g>\n        </svg>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","scaleOrdinal","easeCubicInOut","html","styles","query","property"],"mappings":"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"}

package/dist/chart-pie.js

@@ -107,10 +107,10 @@ let ChartPie = class ChartPie extends i$1 {
         return this.width / 2 - this.margin - 100;
     }
     _getPieData() {
-        const pie$1 = pie()
+        const pieGenerator = pie()
             .sort(null)
             .value(d => d.value);
-        return pie$1(this.data);
+        return pieGenerator(this.data);
     }
     _getColorScale() {
         return ordinal()

package/dist/chart-pie.js.map

@@ -1 +1 @@
-{"version":3,"file":"chart-pie.js","sources":["../../src/chart-pie/chart-pie.ts"],"sourcesContent":["import { html, LitElement, PropertyValues } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport * as d3 from 'd3';\nimport styles from './chart-pie.scss';\n\nexport type ChartPieColor = {\n  color: string;\n};\n\nexport type ChartPieItem = {\n  name: string;\n  value: number;\n  label?: string;\n  color?: string;\n};\n\nconst chartColors: ChartPieColor[] = [];\n['purple', 'blue', 'red', 'green', 'yellow', 'orange'].forEach(colorName => {\n  chartColors.push({\n    color: `var(--color-${colorName})`,\n  });\n});\n\n/** SVGPathElement augmented with the last rendered arc datum for smooth tween interpolation. */\ninterface ArcPathElement extends SVGPathElement {\n  _prevDatum?: d3.PieArcDatum<ChartPieItem>;\n}\n\nfunction debounce<T extends (...args: any[]) => void>(fn: T, wait: number): T {\n  let timer: ReturnType<typeof setTimeout>;\n  return ((...args: any[]) => {\n    clearTimeout(timer);\n    timer = setTimeout(() => fn(...args), wait);\n  }) as T;\n}\n\n/**\n * @label Chart Pie\n * @tag wc-chart-pie\n * @rawTag chart-pie\n * @summary A pie chart is a circular statistical graphic that visually represents numerical proportions.\n * @tags charts\n *\n * @example\n * ```html\n * <wc-chart-pie width=\"400\"></wc-chart-pie>\n * <script>\n *   document.querySelector('wc-chart-pie').data = [\n *     { name: 'A', value: 30, label: 'Category A' },\n *     { name: 'B', value: 50, label: 'Category B' },\n *     { name: 'C', value: 20, label: 'Category C' },\n *   ];\n * </script>\n * ```\n */\n@IndividualComponent\nexport class ChartPie extends LitElement {\n  static styles = [styles];\n\n  @query('svg')\n  private svgElement?: SVGElement;\n\n  /** Width (and height) of the chart in pixels. */\n  @property({ type: Number, reflect: true }) width: number = 0;\n\n  /** Margin around the chart. */\n  @property({ type: Number, reflect: true }) margin: number = 10;\n\n  /** Whether to show labels outside the chart. */\n  @property({ type: Boolean, reflect: true, attribute: 'show-labels' })\n  showLabels: boolean = true;\n\n  /** Chart data array. Each item should have name, value, and optional label and color. */\n  @property({ type: Array }) data: ChartPieItem[] = [];\n\n  private _initialized = false;\n\n  private _debouncedRenderChart = debounce(() => {\n    this._renderChart(true);\n  }, 300);\n\n  firstUpdated() {\n    this._renderChart(false);\n  }\n\n  updated(changedProperties: PropertyValues) {\n    if (!this._initialized) {\n      this._initialized = true;\n      return;\n    }\n    const watchedProps = ['width', 'margin', 'showLabels', 'data'];\n    const hasChanged = watchedProps.some(prop => changedProperties.has(prop));\n    if (hasChanged) {\n      this._debouncedRenderChart();\n    }\n  }\n\n  private _getRadius(): number {\n    // Reserve 100px on each side for labels and padding\n    return this.width / 2 - this.margin - 100;\n  }\n\n  private _getPieData() {\n    const pie = d3\n      .pie<ChartPieItem>()\n      .sort(null)\n      .value(d => d.value);\n    return pie(this.data);\n  }\n\n  private _getColorScale() {\n    return d3\n      .scaleOrdinal<string, ChartPieColor>()\n      .domain(this.data.map(d => d.name))\n      .range(chartColors);\n  }\n\n  private _renderChart(animate: boolean) {\n    if (!this.svgElement) return;\n\n    const DURATION = 500;\n    const radius = this._getRadius();\n    const pieData = this._getPieData();\n    const colorScale = this._getColorScale();\n\n    const svg = d3.select(this.svgElement);\n\n    const pieArc = d3\n      .arc<d3.PieArcDatum<ChartPieItem>>()\n      .innerRadius(0)\n      .outerRadius(radius);\n\n    const labelsArc = d3\n      .arc<d3.PieArcDatum<ChartPieItem>>()\n      .innerRadius(radius + 10)\n      .outerRadius(radius + 10);\n\n    // Update SVG dimensions and center transform\n    svg.attr('width', this.width).attr('height', this.width);\n    svg\n      .select('.chart-container')\n      .attr('transform', `translate(${this.width / 2},${this.width / 2})`);\n\n    // Arc paths — keyed by name so D3 matches elements across updates\n    const $paths = svg\n      .select('.arc-container')\n      .selectAll<SVGPathElement, d3.PieArcDatum<ChartPieItem>>('.arc')\n      .data(pieData, d => d.data.name)\n      .join('path')\n      .attr('class', 'arc')\n      .style('fill', d => d.data.color || colorScale(d.data.name).color);\n\n    if (animate) {\n      $paths\n        .transition()\n        .duration(DURATION)\n        .ease(d3.easeCubicInOut)\n        .attrTween('d', function (this: SVGPathElement, d) {\n          const self = this as ArcPathElement;\n          // Interpolate from the last rendered angles to the new ones.\n          // New (entering) arcs start collapsed at their startAngle.\n          const prev: { startAngle: number; endAngle: number } =\n            self._prevDatum ?? {\n              startAngle: d.startAngle,\n              endAngle: d.startAngle,\n            };\n          self._prevDatum = d;\n          const iStart = d3.interpolateNumber(prev.startAngle, d.startAngle);\n          const iEnd = d3.interpolateNumber(prev.endAngle, d.endAngle);\n          return (t: number) =>\n            pieArc({ ...d, startAngle: iStart(t), endAngle: iEnd(t) }) ?? '';\n        });\n    } else {\n      // Initial render: draw immediately and seed previous-datum for later tweens\n      $paths\n        .each(function (this: SVGPathElement, d) {\n          (this as ArcPathElement)._prevDatum = d;\n        })\n        .attr('d', d => pieArc(d) ?? '');\n    }\n\n    // Label polylines and text\n    const $chartContainer = svg.select('.chart-container');\n\n    if (this.showLabels) {\n      const pointsFn = (d: d3.PieArcDatum<ChartPieItem>) => {\n        const posA = pieArc.centroid(d);\n        const posB = labelsArc.centroid(d);\n        const posC = posB.slice() as [number, number];\n        const midAngle = d.startAngle + (d.endAngle - d.startAngle) / 2;\n        posC[0] = radius * (midAngle < Math.PI ? 1 : -1);\n        return [posA, posB, posC].map(p => p.join(',')).join(' ');\n      };\n\n      const transformFn = (d: d3.PieArcDatum<ChartPieItem>) => {\n        const pos = labelsArc.centroid(d);\n        const midAngle = d.startAngle + (d.endAngle - d.startAngle) / 2;\n        pos[0] = radius * (midAngle < Math.PI ? 1 : -1);\n        return `translate(${pos})`;\n      };\n\n      const anchorFn = (d: d3.PieArcDatum<ChartPieItem>) => {\n        const midAngle = d.startAngle + (d.endAngle - d.startAngle) / 2;\n        return midAngle < Math.PI ? 'start' : 'end';\n      };\n\n      const $polylines = $chartContainer\n        .selectAll<SVGPolylineElement, d3.PieArcDatum<ChartPieItem>>(\n          '.item-polyline',\n        )\n        .data(pieData, d => d.data.name)\n        .join('polyline')\n        .attr('class', 'item-polyline');\n\n      const $labels = $chartContainer\n        .selectAll<SVGTextElement, d3.PieArcDatum<ChartPieItem>>('.item-label')\n        .data(pieData, d => d.data.name)\n        .join('text')\n        .attr('class', 'item-label')\n        .text(d => d.data.label ?? '');\n\n      if (animate) {\n        $polylines\n          .transition()\n          .duration(DURATION)\n          .ease(d3.easeCubicInOut)\n          .attr('points', pointsFn);\n        $labels\n          .transition()\n          .duration(DURATION)\n          .ease(d3.easeCubicInOut)\n          .attr('transform', transformFn)\n          .style('text-anchor', anchorFn);\n      } else {\n        $polylines.attr('points', pointsFn);\n        $labels.attr('transform', transformFn).style('text-anchor', anchorFn);\n      }\n    } else {\n      $chartContainer.selectAll('.item-polyline').remove();\n      $chartContainer.selectAll('.item-label').remove();\n    }\n  }\n\n  render() {\n    return html`\n      <div class=\"chart\">\n        <svg>\n          <g class=\"chart-container\">\n            <g class=\"arc-container\"></g>\n          </g>\n        </svg>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","pie","d3\n            .pie","d3\n            .scaleOrdinal","d3.select","d3\n            .arc","d3.easeCubicInOut","d3.interpolateNumber","html","styles","query","property"],"mappings":"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"}
+{"version":3,"file":"chart-pie.js","sources":["../../src/chart-pie/chart-pie.ts"],"sourcesContent":["import { html, LitElement, PropertyValues } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { select, arc, pie, scaleOrdinal, PieArcDatum, easeCubicInOut, interpolateNumber } from 'd3';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './chart-pie.scss';\n\nexport type ChartPieColor = {\n  color: string;\n};\n\nexport type ChartPieItem = {\n  name: string;\n  value: number;\n  label?: string;\n  color?: string;\n};\n\nconst chartColors: ChartPieColor[] = [];\n['purple', 'blue', 'red', 'green', 'yellow', 'orange'].forEach(colorName => {\n  chartColors.push({\n    color: `var(--color-${colorName})`,\n  });\n});\n\n/** SVGPathElement augmented with the last rendered arc datum for smooth tween interpolation. */\ninterface ArcPathElement extends SVGPathElement {\n  _prevDatum?: PieArcDatum<ChartPieItem>;\n}\n\nfunction debounce<T extends (...args: any[]) => void>(fn: T, wait: number): T {\n  let timer: ReturnType<typeof setTimeout>;\n  return ((...args: any[]) => {\n    clearTimeout(timer);\n    timer = setTimeout(() => fn(...args), wait);\n  }) as T;\n}\n\n/**\n * @label Chart Pie\n * @tag wc-chart-pie\n * @rawTag chart-pie\n * @summary A pie chart is a circular statistical graphic that visually represents numerical proportions.\n * @tags charts\n *\n * @example\n * ```html\n * <wc-chart-pie width=\"400\"></wc-chart-pie>\n * <script>\n *   document.querySelector('wc-chart-pie').data = [\n *     { name: 'A', value: 30, label: 'Category A' },\n *     { name: 'B', value: 50, label: 'Category B' },\n *     { name: 'C', value: 20, label: 'Category C' },\n *   ];\n * </script>\n * ```\n */\n@IndividualComponent\nexport class ChartPie extends LitElement {\n  static styles = [styles];\n\n  @query('svg')\n  private svgElement?: SVGElement;\n\n  /** Width (and height) of the chart in pixels. */\n  @property({ type: Number, reflect: true }) width: number = 0;\n\n  /** Margin around the chart. */\n  @property({ type: Number, reflect: true }) margin: number = 10;\n\n  /** Whether to show labels outside the chart. */\n  @property({ type: Boolean, reflect: true, attribute: 'show-labels' })\n  showLabels: boolean = true;\n\n  /** Chart data array. Each item should have name, value, and optional label and color. */\n  @property({ type: Array }) data: ChartPieItem[] = [];\n\n  private _initialized = false;\n\n  private _debouncedRenderChart = debounce(() => {\n    this._renderChart(true);\n  }, 300);\n\n  firstUpdated() {\n    this._renderChart(false);\n  }\n\n  updated(changedProperties: PropertyValues) {\n    if (!this._initialized) {\n      this._initialized = true;\n      return;\n    }\n    const watchedProps = ['width', 'margin', 'showLabels', 'data'];\n    const hasChanged = watchedProps.some(prop => changedProperties.has(prop));\n    if (hasChanged) {\n      this._debouncedRenderChart();\n    }\n  }\n\n  private _getRadius(): number {\n    // Reserve 100px on each side for labels and padding\n    return this.width / 2 - this.margin - 100;\n  }\n\n  private _getPieData() {\n    const pieGenerator = pie<ChartPieItem>()\n      .sort(null)\n      .value(d => d.value);\n    return pieGenerator(this.data);\n  }\n\n  private _getColorScale() {\n    return scaleOrdinal<string, ChartPieColor>()\n      .domain(this.data.map(d => d.name))\n      .range(chartColors);\n  }\n\n  private _renderChart(animate: boolean) {\n    if (!this.svgElement) return;\n\n    const DURATION = 500;\n    const radius = this._getRadius();\n    const pieData = this._getPieData();\n    const colorScale = this._getColorScale();\n\n    const svg = select(this.svgElement);\n\n    const pieArc = arc<PieArcDatum<ChartPieItem>>()\n      .innerRadius(0)\n      .outerRadius(radius);\n\n    const labelsArc = arc<PieArcDatum<ChartPieItem>>()\n      .innerRadius(radius + 10)\n      .outerRadius(radius + 10);\n\n    // Update SVG dimensions and center transform\n    svg.attr('width', this.width).attr('height', this.width);\n    svg\n      .select('.chart-container')\n      .attr('transform', `translate(${this.width / 2},${this.width / 2})`);\n\n    // Arc paths — keyed by name so D3 matches elements across updates\n    const $paths = svg\n      .select('.arc-container')\n      .selectAll<SVGPathElement, PieArcDatum<ChartPieItem>>('.arc')\n      .data(pieData, d => d.data.name)\n      .join('path')\n      .attr('class', 'arc')\n      .style('fill', d => d.data.color || colorScale(d.data.name).color);\n\n    if (animate) {\n      $paths\n        .transition()\n        .duration(DURATION)\n        .ease(easeCubicInOut)\n        .attrTween('d', function (this: SVGPathElement, d) {\n          const self = this as ArcPathElement;\n          // Interpolate from the last rendered angles to the new ones.\n          // New (entering) arcs start collapsed at their startAngle.\n          const prev: { startAngle: number; endAngle: number } =\n            self._prevDatum ?? {\n              startAngle: d.startAngle,\n              endAngle: d.startAngle,\n            };\n          self._prevDatum = d;\n          const iStart = interpolateNumber(prev.startAngle, d.startAngle);\n          const iEnd = interpolateNumber(prev.endAngle, d.endAngle);\n          return (t: number) =>\n            pieArc({ ...d, startAngle: iStart(t), endAngle: iEnd(t) }) ?? '';\n        });\n    } else {\n      // Initial render: draw immediately and seed previous-datum for later tweens\n      $paths\n        .each(function (this: SVGPathElement, d) {\n          (this as ArcPathElement)._prevDatum = d;\n        })\n        .attr('d', d => pieArc(d) ?? '');\n    }\n\n    // Label polylines and text\n    const $chartContainer = svg.select('.chart-container');\n\n    if (this.showLabels) {\n      const pointsFn = (d: PieArcDatum<ChartPieItem>) => {\n        const posA = pieArc.centroid(d);\n        const posB = labelsArc.centroid(d);\n        const posC = posB.slice() as [number, number];\n        const midAngle = d.startAngle + (d.endAngle - d.startAngle) / 2;\n        posC[0] = radius * (midAngle < Math.PI ? 1 : -1);\n        return [posA, posB, posC].map(p => p.join(',')).join(' ');\n      };\n\n      const transformFn = (d: PieArcDatum<ChartPieItem>) => {\n        const pos = labelsArc.centroid(d);\n        const midAngle = d.startAngle + (d.endAngle - d.startAngle) / 2;\n        pos[0] = radius * (midAngle < Math.PI ? 1 : -1);\n        return `translate(${pos})`;\n      };\n\n      const anchorFn = (d: PieArcDatum<ChartPieItem>) => {\n        const midAngle = d.startAngle + (d.endAngle - d.startAngle) / 2;\n        return midAngle < Math.PI ? 'start' : 'end';\n      };\n\n      const $polylines = $chartContainer\n        .selectAll<SVGPolylineElement, PieArcDatum<ChartPieItem>>(\n          '.item-polyline',\n        )\n        .data(pieData, d => d.data.name)\n        .join('polyline')\n        .attr('class', 'item-polyline');\n\n      const $labels = $chartContainer\n        .selectAll<SVGTextElement, PieArcDatum<ChartPieItem>>('.item-label')\n        .data(pieData, d => d.data.name)\n        .join('text')\n        .attr('class', 'item-label')\n        .text(d => d.data.label ?? '');\n\n      if (animate) {\n        $polylines\n          .transition()\n          .duration(DURATION)\n          .ease(easeCubicInOut)\n          .attr('points', pointsFn);\n        $labels\n          .transition()\n          .duration(DURATION)\n          .ease(easeCubicInOut)\n          .attr('transform', transformFn)\n          .style('text-anchor', anchorFn);\n      } else {\n        $polylines.attr('points', pointsFn);\n        $labels.attr('transform', transformFn).style('text-anchor', anchorFn);\n      }\n    } else {\n      $chartContainer.selectAll('.item-polyline').remove();\n      $chartContainer.selectAll('.item-label').remove();\n    }\n  }\n\n  render() {\n    return html`\n      <div class=\"chart\">\n        <svg>\n          <g class=\"chart-container\">\n            <g class=\"arc-container\"></g>\n          </g>\n        </svg>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","scaleOrdinal","easeCubicInOut","html","styles","query","property"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBA,MAAM,WAAW,GAAoB,EAAE;AACvC,CAAC,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC,OAAO,CAAC,SAAS,IAAG;IACzE,WAAW,CAAC,IAAI,CAAC;QACf,KAAK,EAAE,CAAA,YAAA,EAAe,SAAS,CAAA,CAAA,CAAG;AACnC,KAAA,CAAC;AACJ,CAAC,CAAC;AAOF,SAAS,QAAQ,CAAqC,EAAK,EAAE,IAAY,EAAA;AACvE,IAAA,IAAI,KAAoC;AACxC,IAAA,QAAQ,CAAC,GAAG,IAAW,KAAI;QACzB,YAAY,CAAC,KAAK,CAAC;AACnB,QAAA,KAAK,GAAG,UAAU,CAAC,MAAM,EAAE,CAAC,GAAG,IAAI,CAAC,EAAE,IAAI,CAAC;AAC7C,IAAA,CAAC;AACH;AAEA;;;;;;;;;;;;;;;;;;AAkBG;AAEI,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQA,GAAU,CAAA;AAAjC,IAAA,WAAA,GAAA;;;QAOsC,IAAA,CAAA,KAAK,GAAW,CAAC;;QAGjB,IAAA,CAAA,MAAM,GAAW,EAAE;;QAI9D,IAAA,CAAA,UAAU,GAAY,IAAI;;QAGC,IAAA,CAAA,IAAI,GAAmB,EAAE;QAE5C,IAAA,CAAA,YAAY,GAAG,KAAK;AAEpB,QAAA,IAAA,CAAA,qBAAqB,GAAG,QAAQ,CAAC,MAAK;AAC5C,YAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;QACzB,CAAC,EAAE,GAAG,CAAC;IA2KT;IAzKE,YAAY,GAAA;AACV,QAAA,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC;IAC1B;AAEA,IAAA,OAAO,CAAC,iBAAiC,EAAA;AACvC,QAAA,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;AACtB,YAAA,IAAI,CAAC,YAAY,GAAG,IAAI;YACxB;QACF;QACA,MAAM,YAAY,GAAG,CAAC,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,CAAC;AAC9D,QAAA,MAAM,UAAU,GAAG,YAAY,CAAC,IAAI,CAAC,IAAI,IAAI,iBAAiB,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;QACzE,IAAI,UAAU,EAAE;YACd,IAAI,CAAC,qBAAqB,EAAE;QAC9B;IACF;IAEQ,UAAU,GAAA;;QAEhB,OAAO,IAAI,CAAC,KAAK,GAAG,CAAC,GAAG,IAAI,CAAC,MAAM,GAAG,GAAG;IAC3C;IAEQ,WAAW,GAAA;QACjB,MAAM,YAAY,GAAG,GAAG;aACrB,IAAI,CAAC,IAAI;aACT,KAAK,CAAC,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC;AACtB,QAAA,OAAO,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC;IAChC;IAEQ,cAAc,GAAA;AACpB,QAAA,OAAOC,OAAY;AAChB,aAAA,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC;aACjC,KAAK,CAAC,WAAW,CAAC;IACvB;AAEQ,IAAA,YAAY,CAAC,OAAgB,EAAA;QACnC,IAAI,CAAC,IAAI,CAAC,UAAU;YAAE;QAEtB,MAAM,QAAQ,GAAG,GAAG;AACpB,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,UAAU,EAAE;AAChC,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,WAAW,EAAE;AAClC,QAAA,MAAM,UAAU,GAAG,IAAI,CAAC,cAAc,EAAE;QAExC,MAAM,GAAG,GAAG,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC;QAEnC,MAAM,MAAM,GAAG,GAAG;aACf,WAAW,CAAC,CAAC;aACb,WAAW,CAAC,MAAM,CAAC;QAEtB,MAAM,SAAS,GAAG,GAAG;AAClB,aAAA,WAAW,CAAC,MAAM,GAAG,EAAE;AACvB,aAAA,WAAW,CAAC,MAAM,GAAG,EAAE,CAAC;;AAG3B,QAAA,GAAG,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC;QACxD;aACG,MAAM,CAAC,kBAAkB;AACzB,aAAA,IAAI,CAAC,WAAW,EAAE,CAAA,UAAA,EAAa,IAAI,CAAC,KAAK,GAAG,CAAC,CAAA,CAAA,EAAI,IAAI,CAAC,KAAK,GAAG,CAAC,CAAA,CAAA,CAAG,CAAC;;QAGtE,MAAM,MAAM,GAAG;aACZ,MAAM,CAAC,gBAAgB;aACvB,SAAS,CAA4C,MAAM;AAC3D,aAAA,IAAI,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI;aAC9B,IAAI,CAAC,MAAM;AACX,aAAA,IAAI,CAAC,OAAO,EAAE,KAAK;aACnB,KAAK,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC;QAEpE,IAAI,OAAO,EAAE;YACX;AACG,iBAAA,UAAU;iBACV,QAAQ,CAAC,QAAQ;iBACjB,IAAI,CAACC,UAAc;AACnB,iBAAA,SAAS,CAAC,GAAG,EAAE,UAAgC,CAAC,EAAA;gBAC/C,MAAM,IAAI,GAAG,IAAsB;;;AAGnC,gBAAA,MAAM,IAAI,GACR,IAAI,CAAC,UAAU,IAAI;oBACjB,UAAU,EAAE,CAAC,CAAC,UAAU;oBACxB,QAAQ,EAAE,CAAC,CAAC,UAAU;iBACvB;AACH,gBAAA,IAAI,CAAC,UAAU,GAAG,CAAC;AACnB,gBAAA,MAAM,MAAM,GAAG,iBAAiB,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC,UAAU,CAAC;AAC/D,gBAAA,MAAM,IAAI,GAAG,iBAAiB,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC,QAAQ,CAAC;AACzD,gBAAA,OAAO,CAAC,CAAS,KACf,MAAM,CAAC,EAAE,GAAG,CAAC,EAAE,UAAU,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,IAAI,EAAE;AACpE,YAAA,CAAC,CAAC;QACN;aAAO;;YAEL;iBACG,IAAI,CAAC,UAAgC,CAAC,EAAA;AACpC,gBAAA,IAAuB,CAAC,UAAU,GAAG,CAAC;AACzC,YAAA,CAAC;AACA,iBAAA,IAAI,CAAC,GAAG,EAAE,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;QACpC;;QAGA,MAAM,eAAe,GAAG,GAAG,CAAC,MAAM,CAAC,kBAAkB,CAAC;AAEtD,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE;AACnB,YAAA,MAAM,QAAQ,GAAG,CAAC,CAA4B,KAAI;gBAChD,MAAM,IAAI,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC;gBAC/B,MAAM,IAAI,GAAG,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC;AAClC,gBAAA,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,EAAsB;AAC7C,gBAAA,MAAM,QAAQ,GAAG,CAAC,CAAC,UAAU,GAAG,CAAC,CAAC,CAAC,QAAQ,GAAG,CAAC,CAAC,UAAU,IAAI,CAAC;gBAC/D,IAAI,CAAC,CAAC,CAAC,GAAG,MAAM,IAAI,QAAQ,GAAG,IAAI,CAAC,EAAE,GAAG,CAAC,GAAG,EAAE,CAAC;gBAChD,OAAO,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;AAC3D,YAAA,CAAC;AAED,YAAA,MAAM,WAAW,GAAG,CAAC,CAA4B,KAAI;gBACnD,MAAM,GAAG,GAAG,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC;AACjC,gBAAA,MAAM,QAAQ,GAAG,CAAC,CAAC,UAAU,GAAG,CAAC,CAAC,CAAC,QAAQ,GAAG,CAAC,CAAC,UAAU,IAAI,CAAC;gBAC/D,GAAG,CAAC,CAAC,CAAC,GAAG,MAAM,IAAI,QAAQ,GAAG,IAAI,CAAC,EAAE,GAAG,CAAC,GAAG,EAAE,CAAC;gBAC/C,OAAO,CAAA,UAAA,EAAa,GAAG,CAAA,CAAA,CAAG;AAC5B,YAAA,CAAC;AAED,YAAA,MAAM,QAAQ,GAAG,CAAC,CAA4B,KAAI;AAChD,gBAAA,MAAM,QAAQ,GAAG,CAAC,CAAC,UAAU,GAAG,CAAC,CAAC,CAAC,QAAQ,GAAG,CAAC,CAAC,UAAU,IAAI,CAAC;AAC/D,gBAAA,OAAO,QAAQ,GAAG,IAAI,CAAC,EAAE,GAAG,OAAO,GAAG,KAAK;AAC7C,YAAA,CAAC;YAED,MAAM,UAAU,GAAG;iBAChB,SAAS,CACR,gBAAgB;AAEjB,iBAAA,IAAI,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI;iBAC9B,IAAI,CAAC,UAAU;AACf,iBAAA,IAAI,CAAC,OAAO,EAAE,eAAe,CAAC;YAEjC,MAAM,OAAO,GAAG;iBACb,SAAS,CAA4C,aAAa;AAClE,iBAAA,IAAI,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI;iBAC9B,IAAI,CAAC,MAAM;AACX,iBAAA,IAAI,CAAC,OAAO,EAAE,YAAY;AAC1B,iBAAA,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,EAAE,CAAC;YAEhC,IAAI,OAAO,EAAE;gBACX;AACG,qBAAA,UAAU;qBACV,QAAQ,CAAC,QAAQ;qBACjB,IAAI,CAACA,UAAc;AACnB,qBAAA,IAAI,CAAC,QAAQ,EAAE,QAAQ,CAAC;gBAC3B;AACG,qBAAA,UAAU;qBACV,QAAQ,CAAC,QAAQ;qBACjB,IAAI,CAACA,UAAc;AACnB,qBAAA,IAAI,CAAC,WAAW,EAAE,WAAW;AAC7B,qBAAA,KAAK,CAAC,aAAa,EAAE,QAAQ,CAAC;YACnC;iBAAO;AACL,gBAAA,UAAU,CAAC,IAAI,CAAC,QAAQ,EAAE,QAAQ,CAAC;AACnC,gBAAA,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC,KAAK,CAAC,aAAa,EAAE,QAAQ,CAAC;YACvE;QACF;aAAO;YACL,eAAe,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAC,MAAM,EAAE;YACpD,eAAe,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC,MAAM,EAAE;QACnD;IACF;IAEA,MAAM,GAAA;AACJ,QAAA,OAAOC,CAAI,CAAA;;;;;;;;KAQV;IACH;;AAhMO,QAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AAGhB,UAAA,CAAA;IADPC,CAAK,CAAC,KAAK;AACoB,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,YAAA,EAAA,MAAA,CAAA;AAGW,UAAA,CAAA;IAA1CC,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;AAAoB,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,OAAA,EAAA,MAAA,CAAA;AAGlB,UAAA,CAAA;IAA1CA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;AAAsB,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,QAAA,EAAA,MAAA,CAAA;AAI/D,UAAA,CAAA;AADC,IAAAA,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,aAAa,EAAE;AACzC,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,YAAA,EAAA,MAAA,CAAA;AAGA,UAAA,CAAA;AAA1B,IAAAA,CAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE;AAA4B,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,MAAA,EAAA,MAAA,CAAA;AAjB1C,QAAQ,GAAA,UAAA,CAAA;IADpB;AACY,CAAA,EAAA,QAAQ,CAkMpB;;;;"}

package/dist/chart-stacked-bar.js.map

@@ -1 +1 @@
-{"version":3,"file":"chart-stacked-bar.js","sources":["../node_modules/d3-shape/src/offset/none.js","../node_modules/d3-shape/src/order/none.js","../node_modules/d3-shape/src/stack.js","../../src/chart-bar/chart-stacked-bar.ts"],"sourcesContent":["export default function(series, order) {\n  if (!((n = series.length) > 1)) return;\n  for (var i = 1, j, s0, s1 = series[order[0]], n, m = s1.length; i < n; ++i) {\n    s0 = s1, s1 = series[order[i]];\n    for (j = 0; j < m; ++j) {\n      s1[j][1] += s1[j][0] = isNaN(s0[j][1]) ? s0[j][0] : s0[j][1];\n    }\n  }\n}\n","export default function(series) {\n  var n = series.length, o = new Array(n);\n  while (--n >= 0) o[n] = n;\n  return o;\n}\n","import array from \"./array.js\";\nimport constant from \"./constant.js\";\nimport offsetNone from \"./offset/none.js\";\nimport orderNone from \"./order/none.js\";\n\nfunction stackValue(d, key) {\n  return d[key];\n}\n\nfunction stackSeries(key) {\n  const series = [];\n  series.key = key;\n  return series;\n}\n\nexport default function() {\n  var keys = constant([]),\n      order = orderNone,\n      offset = offsetNone,\n      value = stackValue;\n\n  function stack(data) {\n    var sz = Array.from(keys.apply(this, arguments), stackSeries),\n        i, n = sz.length, j = -1,\n        oz;\n\n    for (const d of data) {\n      for (i = 0, ++j; i < n; ++i) {\n        (sz[i][j] = [0, +value(d, sz[i].key, j, data)]).data = d;\n      }\n    }\n\n    for (i = 0, oz = array(order(sz)); i < n; ++i) {\n      sz[oz[i]].index = i;\n    }\n\n    offset(sz, oz);\n    return sz;\n  }\n\n  stack.keys = function(_) {\n    return arguments.length ? (keys = typeof _ === \"function\" ? _ : constant(Array.from(_)), stack) : keys;\n  };\n\n  stack.value = function(_) {\n    return arguments.length ? (value = typeof _ === \"function\" ? _ : constant(+_), stack) : value;\n  };\n\n  stack.order = function(_) {\n    return arguments.length ? (order = _ == null ? orderNone : typeof _ === \"function\" ? _ : constant(Array.from(_)), stack) : order;\n  };\n\n  stack.offset = function(_) {\n    return arguments.length ? (offset = _ == null ? offsetNone : _, stack) : offset;\n  };\n\n  return stack;\n}\n","import { html, LitElement, PropertyValues } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport * as d3 from 'd3';\n\nimport IndividualComponent from '@/IndividualComponent.js';\n\nimport styles from './chart-bar.scss';\n\nexport type ChartStackedSegment = {\n  name: string;\n  value: number;\n  label?: string;\n  color?: string;\n};\n\nexport type ChartStackedBarItem = {\n  name: string;\n  label?: string;\n  segments: ChartStackedSegment[];\n};\n\nconst chartColors: string[] = [];\n['purple', 'blue', 'red', 'green', 'yellow', 'orange'].forEach(colorName => {\n  chartColors.push(`var(--color-${colorName})`);\n});\n\nconst DEFAULT_WIDTH = 520;\nconst DEFAULT_HEIGHT = 360;\nconst BAR_RADIUS = 8;\nconst DURATION = 450;\n\nfunction debounce<T extends (...args: any[]) => void>(fn: T, wait: number): T {\n  let timer: ReturnType<typeof setTimeout>;\n  return ((...args: any[]) => {\n    clearTimeout(timer);\n    timer = setTimeout(() => fn(...args), wait);\n  }) as T;\n}\n\n/**\n * @label Chart Stacked Bar\n * @tag wc-chart-stacked-bar\n * @rawTag chart-stacked-bar\n * @summary A stacked bar chart that groups series by category using Material Design 3 tokens.\n * @tags charts\n *\n * @example\n * ```html\n * <wc-chart-stacked-bar width=\"560\" height=\"360\"></wc-chart-stacked-bar>\n * <script>\n *   document.querySelector('wc-chart-stacked-bar').data = [\n *     {\n *       name: 'q1',\n *       label: 'Q1',\n *       segments: [\n *         { name: 'mobile', label: 'Mobile', value: 40 },\n *         { name: 'web', label: 'Web', value: 25 },\n *         { name: 'store', label: 'Store', value: 15 },\n *       ],\n *     },\n *     {\n *       name: 'q2',\n *       label: 'Q2',\n *       segments: [\n *         { name: 'mobile', label: 'Mobile', value: 32 },\n *         { name: 'web', label: 'Web', value: 30 },\n *         { name: 'store', label: 'Store', value: 18 },\n *       ],\n *     },\n *   ];\n * </script>\n * ```\n */\n@IndividualComponent\nexport class ChartStackedBar extends LitElement {\n  static styles = [styles];\n\n  @query('svg')\n  private svgElement?: SVGElement;\n\n  /** Width of the chart in pixels. */\n  @property({ type: Number, reflect: true }) width: number = 0;\n\n  /** Height of the chart in pixels. */\n  @property({ type: Number, reflect: true }) height: number = DEFAULT_HEIGHT;\n\n  /** Margin around the chart drawing area. */\n  @property({ type: Number }) margin: number = 28;\n\n  /** Chart data array. Each item holds the stacked segments for a category. */\n  @property({ type: Array }) data: ChartStackedBarItem[] = [];\n\n  /** Whether to render total value labels above each stack. */\n  @property({ type: Boolean, attribute: 'show-values' }) showValues: boolean = true;\n\n  /** Whether to render the legend. */\n  @property({ type: Boolean, attribute: 'show-legend' }) showLegend: boolean = true;\n\n  private _initialized = false;\n\n  private _debouncedRenderChart = debounce(() => {\n    this._renderChart(true);\n  }, 200);\n\n  firstUpdated() {\n    this._renderChart(false);\n  }\n\n  updated(changedProperties: PropertyValues) {\n    if (!this._initialized) {\n      this._initialized = true;\n      return;\n    }\n    const watchedProps = [\n      'width',\n      'height',\n      'margin',\n      'data',\n      'showValues',\n      'showLegend',\n    ];\n    const hasChanged = watchedProps.some(prop => changedProperties.has(prop));\n    if (hasChanged) {\n      this._debouncedRenderChart();\n    }\n  }\n\n  private _getSegmentKeys() {\n    const keys = new Set<string>();\n    this.data?.forEach(item => {\n      item.segments?.forEach(segment => keys.add(segment.name));\n    });\n    return Array.from(keys);\n  }\n\n  private _getColorScale(keys: string[]) {\n    return d3\n      .scaleOrdinal<string, string>()\n      .domain(keys)\n      .range(chartColors);\n  }\n\n  private _getColorMap(\n    keys: string[],\n    scale: d3.ScaleOrdinal<string, string>,\n  ) {\n    const map = new Map<string, string>();\n    keys.forEach(key => {\n      const override = this.data\n        .map(item => item.segments.find(seg => seg.name === key)?.color)\n        .find(color => !!color);\n      map.set(key, override || scale(key));\n    });\n    return map;\n  }\n\n  private _getSegmentLabel(key: string) {\n    const segment = this.data\n      .map(item => item.segments.find(seg => seg.name === key))\n      .find(Boolean);\n    return segment?.label ?? key;\n  }\n\n  private _getTotals() {\n    return this.data.map(item =>\n      item.segments.reduce((sum, seg) => sum + seg.value, 0),\n    );\n  }\n\n  private _renderChart(animate: boolean) {\n    if (!this.svgElement) return;\n\n    const width = this.width > 0 ? this.width : DEFAULT_WIDTH;\n    const height = this.height > 0 ? this.height : DEFAULT_HEIGHT;\n    const margin = Math.max(this.margin, 16);\n    const data = this.data ?? [];\n\n    const svg = d3.select(this.svgElement);\n    svg.attr('width', width).attr('height', height);\n\n    const innerWidth = Math.max(width - margin * 2, 0);\n    const innerHeight = Math.max(height - margin * 2, 0);\n\n    const container = svg.select<SVGGElement>('.chart-container');\n    container.attr('transform', `translate(${margin},${margin})`);\n\n    if (!data.length || innerWidth === 0 || innerHeight === 0) {\n      container.select('.bars').selectAll('*').remove();\n      container.select('.x-axis').selectAll('*').remove();\n      container.select('.y-grid').selectAll('*').remove();\n      container.select('.value-labels').selectAll('*').remove();\n      return;\n    }\n\n    const keys = this._getSegmentKeys();\n    const colorScale = this._getColorScale(keys);\n    const colorMap = this._getColorMap(keys, colorScale);\n\n    const totals = this._getTotals();\n    const xScale = d3\n      .scaleBand<string>()\n      .domain(data.map(d => d.name))\n      .range([0, innerWidth])\n      .padding(0.3);\n    const maxValue = d3.max(totals) ?? 0;\n    const yScale = d3\n      .scaleLinear()\n      .domain([0, maxValue || 1])\n      .nice()\n      .range([innerHeight, 0]);\n\n    const stackedSeries = d3\n      .stack<ChartStackedBarItem, string>()\n      .keys(keys)\n      .value(\n        (d, key) => d.segments.find(segment => segment.name === key)?.value ?? 0,\n      )(data);\n\n    const yGrid = container.select<SVGGElement>('.y-grid');\n    yGrid\n      .call(\n        d3\n          .axisLeft(yScale)\n          .ticks(5)\n          .tickSize(-innerWidth)\n          .tickFormat(() => ''),\n      )\n      .selectAll('.tick text')\n      .remove();\n    yGrid.select('.domain').remove();\n    yGrid.selectAll('.tick line').attr('class', 'gridline');\n\n    const xAxis = container.select<SVGGElement>('.x-axis');\n    xAxis\n      .attr('transform', `translate(0,${innerHeight})`)\n      .call(\n        d3\n          .axisBottom(xScale)\n          .tickSizeOuter(0)\n          .tickFormat(name => {\n            const entry = data.find(d => d.name === name);\n            return entry?.label ?? name;\n          }),\n      );\n    xAxis.select('.domain').attr('stroke', 'var(--color-outline-variant)');\n    xAxis.selectAll('.tick line').remove();\n    xAxis\n      .selectAll('.tick text')\n      .attr('class', 'axis-label')\n      .attr('dy', '1.1em');\n\n    const barGroups = container\n      .select('.bars')\n      .selectAll<SVGGElement, d3.Series<ChartStackedBarItem, string>>(\n        '.bar-group',\n      )\n      .data(stackedSeries, series => series.key)\n      .join(\n        enter =>\n          enter\n            .append('g')\n            .attr('class', 'bar-group')\n            .style('fill', series => colorMap.get(series.key) ?? ''),\n        update => update,\n        exit => exit.remove(),\n      )\n      .style('fill', series => colorMap.get(series.key) ?? colorScale(series.key));\n\n    const segmentJoin = barGroups\n      .selectAll<SVGRectElement, d3.SeriesPoint<ChartStackedBarItem>>('rect')\n      .data(series => series, d => d.data.name)\n      .join(\n        enter =>\n          enter\n            .append('rect')\n            .attr('class', 'stacked-segment')\n            .attr('x', d => xScale(d.data.name) ?? 0)\n            .attr('width', xScale.bandwidth())\n            .attr('y', innerHeight)\n            .attr('height', 0)\n            .attr('rx', BAR_RADIUS)\n            .attr('ry', BAR_RADIUS),\n        update => update,\n        exit =>\n          exit\n            .transition()\n            .duration(DURATION)\n            .attr('y', innerHeight)\n            .attr('height', 0)\n            .remove(),\n      );\n\n    segmentJoin\n      .attr('x', d => xScale(d.data.name) ?? 0)\n      .attr('width', xScale.bandwidth())\n      .attr('rx', BAR_RADIUS)\n      .attr('ry', BAR_RADIUS);\n\n    if (animate) {\n      segmentJoin\n        .transition()\n        .duration(DURATION)\n        .attr('y', d => yScale(d[1]))\n        .attr('height', d => yScale(d[0]) - yScale(d[1]));\n    } else {\n      segmentJoin\n        .attr('y', d => yScale(d[1]))\n        .attr('height', d => yScale(d[0]) - yScale(d[1]));\n    }\n\n    const totalLabels = container\n      .select('.value-labels')\n      .selectAll<SVGTextElement, ChartStackedBarItem>('text')\n      .data(this.showValues ? data : [], d => d.name)\n      .join(\n        enter =>\n          enter\n            .append('text')\n            .attr('class', 'value-label')\n            .attr('text-anchor', 'middle')\n            .attr('x', d => (xScale(d.name) ?? 0) + xScale.bandwidth() / 2)\n            .attr('y', innerHeight - 6)\n            .text(d =>\n              d.segments\n                .reduce((sum, seg) => sum + seg.value, 0)\n                .toLocaleString(),\n            ),\n        update => update,\n        exit => exit.remove(),\n      );\n\n    const labelPosition = (item: ChartStackedBarItem) => {\n      const total = item.segments.reduce((sum, seg) => sum + seg.value, 0);\n      const offset = yScale(total) - 8;\n      return Math.min(offset, innerHeight - 8);\n    };\n\n    if (animate) {\n      totalLabels\n        .transition()\n        .duration(DURATION)\n        .attr('x', d => (xScale(d.name) ?? 0) + xScale.bandwidth() / 2)\n        .attr('y', d => labelPosition(d))\n        .text(d =>\n          d.segments\n            .reduce((sum, seg) => sum + seg.value, 0)\n            .toLocaleString(),\n        );\n    } else {\n      totalLabels\n        .attr('x', d => (xScale(d.name) ?? 0) + xScale.bandwidth() / 2)\n        .attr('y', d => labelPosition(d))\n        .text(d =>\n          d.segments\n            .reduce((sum, seg) => sum + seg.value, 0)\n            .toLocaleString(),\n        );\n    }\n  }\n\n  render() {\n    const keys = this._getSegmentKeys();\n    const colorScale = this._getColorScale(keys);\n    const colorMap = this._getColorMap(keys, colorScale);\n\n    const legendItems = keys.map(key => ({\n      name: this._getSegmentLabel(key),\n      color: colorMap.get(key) ?? colorScale(key),\n    }));\n\n    return html`\n      <div class=\"chart-frame\">\n        <svg role=\"img\" aria-label=\"Stacked bar chart\">\n          <g class=\"chart-container\">\n            <g class=\"y-grid\"></g>\n            <g class=\"bars\"></g>\n            <g class=\"x-axis\"></g>\n            <g class=\"value-labels\"></g>\n          </g>\n        </svg>\n        ${this.showLegend && legendItems.length\n          ? html`<div class=\"legend\" role=\"list\">\n              ${legendItems.map(\n                item => html`<span class=\"legend-item\" role=\"listitem\">\n                  <span\n                    class=\"swatch\"\n                    style=${styleMap({ background: item.color })}\n                  ></span>\n                  <span>${item.name}</span>\n                </span>`,\n              )}\n            </div>`\n          : null}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'wc-chart-stacked-bar': ChartStackedBar;\n  }\n}\n"],"names":["orderNone","offsetNone","LitElement","d3\n            .scaleOrdinal","d3.select","d3\n            .scaleBand","d3.max","d3\n            .scaleLinear","d3\n            .stack","d3\n            .axisLeft","d3\n            .axisBottom","html","styleMap","styles","query","property"],"mappings":"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","x_google_ignoreList":[0,1,2]}
+{"version":3,"file":"chart-stacked-bar.js","sources":["../node_modules/d3-shape/src/offset/none.js","../node_modules/d3-shape/src/order/none.js","../node_modules/d3-shape/src/stack.js","../../src/chart-bar/chart-stacked-bar.ts"],"sourcesContent":["export default function(series, order) {\n  if (!((n = series.length) > 1)) return;\n  for (var i = 1, j, s0, s1 = series[order[0]], n, m = s1.length; i < n; ++i) {\n    s0 = s1, s1 = series[order[i]];\n    for (j = 0; j < m; ++j) {\n      s1[j][1] += s1[j][0] = isNaN(s0[j][1]) ? s0[j][0] : s0[j][1];\n    }\n  }\n}\n","export default function(series) {\n  var n = series.length, o = new Array(n);\n  while (--n >= 0) o[n] = n;\n  return o;\n}\n","import array from \"./array.js\";\nimport constant from \"./constant.js\";\nimport offsetNone from \"./offset/none.js\";\nimport orderNone from \"./order/none.js\";\n\nfunction stackValue(d, key) {\n  return d[key];\n}\n\nfunction stackSeries(key) {\n  const series = [];\n  series.key = key;\n  return series;\n}\n\nexport default function() {\n  var keys = constant([]),\n      order = orderNone,\n      offset = offsetNone,\n      value = stackValue;\n\n  function stack(data) {\n    var sz = Array.from(keys.apply(this, arguments), stackSeries),\n        i, n = sz.length, j = -1,\n        oz;\n\n    for (const d of data) {\n      for (i = 0, ++j; i < n; ++i) {\n        (sz[i][j] = [0, +value(d, sz[i].key, j, data)]).data = d;\n      }\n    }\n\n    for (i = 0, oz = array(order(sz)); i < n; ++i) {\n      sz[oz[i]].index = i;\n    }\n\n    offset(sz, oz);\n    return sz;\n  }\n\n  stack.keys = function(_) {\n    return arguments.length ? (keys = typeof _ === \"function\" ? _ : constant(Array.from(_)), stack) : keys;\n  };\n\n  stack.value = function(_) {\n    return arguments.length ? (value = typeof _ === \"function\" ? _ : constant(+_), stack) : value;\n  };\n\n  stack.order = function(_) {\n    return arguments.length ? (order = _ == null ? orderNone : typeof _ === \"function\" ? _ : constant(Array.from(_)), stack) : order;\n  };\n\n  stack.offset = function(_) {\n    return arguments.length ? (offset = _ == null ? offsetNone : _, stack) : offset;\n  };\n\n  return stack;\n}\n","import { html, LitElement, PropertyValues } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { select, max, scaleBand, scaleLinear, scaleOrdinal, axisLeft, axisBottom, stack, Series, SeriesPoint, ScaleOrdinal } from 'd3';\n\nimport IndividualComponent from '@/IndividualComponent.js';\n\nimport styles from './chart-bar.scss';\n\nexport type ChartStackedSegment = {\n  name: string;\n  value: number;\n  label?: string;\n  color?: string;\n};\n\nexport type ChartStackedBarItem = {\n  name: string;\n  label?: string;\n  segments: ChartStackedSegment[];\n};\n\nconst chartColors: string[] = [];\n['purple', 'blue', 'red', 'green', 'yellow', 'orange'].forEach(colorName => {\n  chartColors.push(`var(--color-${colorName})`);\n});\n\nconst DEFAULT_WIDTH = 520;\nconst DEFAULT_HEIGHT = 360;\nconst BAR_RADIUS = 8;\nconst DURATION = 450;\n\nfunction debounce<T extends (...args: any[]) => void>(fn: T, wait: number): T {\n  let timer: ReturnType<typeof setTimeout>;\n  return ((...args: any[]) => {\n    clearTimeout(timer);\n    timer = setTimeout(() => fn(...args), wait);\n  }) as T;\n}\n\n/**\n * @label Chart Stacked Bar\n * @tag wc-chart-stacked-bar\n * @rawTag chart-stacked-bar\n * @summary A stacked bar chart that groups series by category using Material Design 3 tokens.\n * @tags charts\n *\n * @example\n * ```html\n * <wc-chart-stacked-bar width=\"560\" height=\"360\"></wc-chart-stacked-bar>\n * <script>\n *   document.querySelector('wc-chart-stacked-bar').data = [\n *     {\n *       name: 'q1',\n *       label: 'Q1',\n *       segments: [\n *         { name: 'mobile', label: 'Mobile', value: 40 },\n *         { name: 'web', label: 'Web', value: 25 },\n *         { name: 'store', label: 'Store', value: 15 },\n *       ],\n *     },\n *     {\n *       name: 'q2',\n *       label: 'Q2',\n *       segments: [\n *         { name: 'mobile', label: 'Mobile', value: 32 },\n *         { name: 'web', label: 'Web', value: 30 },\n *         { name: 'store', label: 'Store', value: 18 },\n *       ],\n *     },\n *   ];\n * </script>\n * ```\n */\n@IndividualComponent\nexport class ChartStackedBar extends LitElement {\n  static styles = [styles];\n\n  @query('svg')\n  private svgElement?: SVGElement;\n\n  /** Width of the chart in pixels. */\n  @property({ type: Number, reflect: true }) width: number = 0;\n\n  /** Height of the chart in pixels. */\n  @property({ type: Number, reflect: true }) height: number = DEFAULT_HEIGHT;\n\n  /** Margin around the chart drawing area. */\n  @property({ type: Number }) margin: number = 28;\n\n  /** Chart data array. Each item holds the stacked segments for a category. */\n  @property({ type: Array }) data: ChartStackedBarItem[] = [];\n\n  /** Whether to render total value labels above each stack. */\n  @property({ type: Boolean, attribute: 'show-values' }) showValues: boolean = true;\n\n  /** Whether to render the legend. */\n  @property({ type: Boolean, attribute: 'show-legend' }) showLegend: boolean = true;\n\n  private _initialized = false;\n\n  private _debouncedRenderChart = debounce(() => {\n    this._renderChart(true);\n  }, 200);\n\n  firstUpdated() {\n    this._renderChart(false);\n  }\n\n  updated(changedProperties: PropertyValues) {\n    if (!this._initialized) {\n      this._initialized = true;\n      return;\n    }\n    const watchedProps = [\n      'width',\n      'height',\n      'margin',\n      'data',\n      'showValues',\n      'showLegend',\n    ];\n    const hasChanged = watchedProps.some(prop => changedProperties.has(prop));\n    if (hasChanged) {\n      this._debouncedRenderChart();\n    }\n  }\n\n  private _getSegmentKeys() {\n    const keys = new Set<string>();\n    this.data?.forEach(item => {\n      item.segments?.forEach(segment => keys.add(segment.name));\n    });\n    return Array.from(keys);\n  }\n\n  private _getColorScale(keys: string[]) {\n    return scaleOrdinal<string, string>()\n      .domain(keys)\n      .range(chartColors);\n  }\n\n  private _getColorMap(\n    keys: string[],\n    scale: ScaleOrdinal<string, string>,\n  ) {\n    const map = new Map<string, string>();\n    keys.forEach(key => {\n      const override = this.data\n        .map(item => item.segments.find(seg => seg.name === key)?.color)\n        .find(color => !!color);\n      map.set(key, override || scale(key));\n    });\n    return map;\n  }\n\n  private _getSegmentLabel(key: string) {\n    const segment = this.data\n      .map(item => item.segments.find(seg => seg.name === key))\n      .find(Boolean);\n    return segment?.label ?? key;\n  }\n\n  private _getTotals() {\n    return this.data.map(item =>\n      item.segments.reduce((sum, seg) => sum + seg.value, 0),\n    );\n  }\n\n  private _renderChart(animate: boolean) {\n    if (!this.svgElement) return;\n\n    const width = this.width > 0 ? this.width : DEFAULT_WIDTH;\n    const height = this.height > 0 ? this.height : DEFAULT_HEIGHT;\n    const margin = Math.max(this.margin, 16);\n    const data = this.data ?? [];\n\n    const svg = select(this.svgElement);\n    svg.attr('width', width).attr('height', height);\n\n    const innerWidth = Math.max(width - margin * 2, 0);\n    const innerHeight = Math.max(height - margin * 2, 0);\n\n    const container = svg.select<SVGGElement>('.chart-container');\n    container.attr('transform', `translate(${margin},${margin})`);\n\n    if (!data.length || innerWidth === 0 || innerHeight === 0) {\n      container.select('.bars').selectAll('*').remove();\n      container.select('.x-axis').selectAll('*').remove();\n      container.select('.y-grid').selectAll('*').remove();\n      container.select('.value-labels').selectAll('*').remove();\n      return;\n    }\n\n    const keys = this._getSegmentKeys();\n    const colorScale = this._getColorScale(keys);\n    const colorMap = this._getColorMap(keys, colorScale);\n\n    const totals = this._getTotals();\n    const xScale = scaleBand<string>()\n      .domain(data.map(d => d.name))\n      .range([0, innerWidth])\n      .padding(0.3);\n    const maxValue = max(totals) ?? 0;\n    const yScale = scaleLinear()\n      .domain([0, maxValue || 1])\n      .nice()\n      .range([innerHeight, 0]);\n\n    const stackedSeries = stack<ChartStackedBarItem, string>()\n      .keys(keys)\n      .value(\n        (d, key) => d.segments.find(segment => segment.name === key)?.value ?? 0,\n      )(data);\n\n    const yGrid = container.select<SVGGElement>('.y-grid');\n    yGrid\n      .call(\n        axisLeft(yScale)\n          .ticks(5)\n          .tickSize(-innerWidth)\n          .tickFormat(() => ''),\n      )\n      .selectAll('.tick text')\n      .remove();\n    yGrid.select('.domain').remove();\n    yGrid.selectAll('.tick line').attr('class', 'gridline');\n\n    const xAxis = container.select<SVGGElement>('.x-axis');\n    xAxis\n      .attr('transform', `translate(0,${innerHeight})`)\n      .call(\n        axisBottom(xScale)\n          .tickSizeOuter(0)\n          .tickFormat(name => {\n            const entry = data.find(d => d.name === name);\n            return entry?.label ?? name;\n          }),\n      );\n    xAxis.select('.domain').attr('stroke', 'var(--color-outline-variant)');\n    xAxis.selectAll('.tick line').remove();\n    xAxis\n      .selectAll('.tick text')\n      .attr('class', 'axis-label')\n      .attr('dy', '1.1em');\n\n    const barGroups = container\n      .select('.bars')\n      .selectAll<SVGGElement, Series<ChartStackedBarItem, string>>(\n        '.bar-group',\n      )\n      .data(stackedSeries, series => series.key)\n      .join(\n        enter =>\n          enter\n            .append('g')\n            .attr('class', 'bar-group')\n            .style('fill', series => colorMap.get(series.key) ?? ''),\n        update => update,\n        exit => exit.remove(),\n      )\n      .style('fill', series => colorMap.get(series.key) ?? colorScale(series.key));\n\n    const segmentJoin = barGroups\n      .selectAll<SVGRectElement, SeriesPoint<ChartStackedBarItem>>('rect')\n      .data(series => series, d => d.data.name)\n      .join(\n        enter =>\n          enter\n            .append('rect')\n            .attr('class', 'stacked-segment')\n            .attr('x', d => xScale(d.data.name) ?? 0)\n            .attr('width', xScale.bandwidth())\n            .attr('y', innerHeight)\n            .attr('height', 0)\n            .attr('rx', BAR_RADIUS)\n            .attr('ry', BAR_RADIUS),\n        update => update,\n        exit =>\n          exit\n            .transition()\n            .duration(DURATION)\n            .attr('y', innerHeight)\n            .attr('height', 0)\n            .remove(),\n      );\n\n    segmentJoin\n      .attr('x', d => xScale(d.data.name) ?? 0)\n      .attr('width', xScale.bandwidth())\n      .attr('rx', BAR_RADIUS)\n      .attr('ry', BAR_RADIUS);\n\n    if (animate) {\n      segmentJoin\n        .transition()\n        .duration(DURATION)\n        .attr('y', d => yScale(d[1]))\n        .attr('height', d => yScale(d[0]) - yScale(d[1]));\n    } else {\n      segmentJoin\n        .attr('y', d => yScale(d[1]))\n        .attr('height', d => yScale(d[0]) - yScale(d[1]));\n    }\n\n    const totalLabels = container\n      .select('.value-labels')\n      .selectAll<SVGTextElement, ChartStackedBarItem>('text')\n      .data(this.showValues ? data : [], d => d.name)\n      .join(\n        enter =>\n          enter\n            .append('text')\n            .attr('class', 'value-label')\n            .attr('text-anchor', 'middle')\n            .attr('x', d => (xScale(d.name) ?? 0) + xScale.bandwidth() / 2)\n            .attr('y', innerHeight - 6)\n            .text(d =>\n              d.segments\n                .reduce((sum, seg) => sum + seg.value, 0)\n                .toLocaleString(),\n            ),\n        update => update,\n        exit => exit.remove(),\n      );\n\n    const labelPosition = (item: ChartStackedBarItem) => {\n      const total = item.segments.reduce((sum, seg) => sum + seg.value, 0);\n      const offset = yScale(total) - 8;\n      return Math.min(offset, innerHeight - 8);\n    };\n\n    if (animate) {\n      totalLabels\n        .transition()\n        .duration(DURATION)\n        .attr('x', d => (xScale(d.name) ?? 0) + xScale.bandwidth() / 2)\n        .attr('y', d => labelPosition(d))\n        .text(d =>\n          d.segments\n            .reduce((sum, seg) => sum + seg.value, 0)\n            .toLocaleString(),\n        );\n    } else {\n      totalLabels\n        .attr('x', d => (xScale(d.name) ?? 0) + xScale.bandwidth() / 2)\n        .attr('y', d => labelPosition(d))\n        .text(d =>\n          d.segments\n            .reduce((sum, seg) => sum + seg.value, 0)\n            .toLocaleString(),\n        );\n    }\n  }\n\n  render() {\n    const keys = this._getSegmentKeys();\n    const colorScale = this._getColorScale(keys);\n    const colorMap = this._getColorMap(keys, colorScale);\n\n    const legendItems = keys.map(key => ({\n      name: this._getSegmentLabel(key),\n      color: colorMap.get(key) ?? colorScale(key),\n    }));\n\n    return html`\n      <div class=\"chart-frame\">\n        <svg role=\"img\" aria-label=\"Stacked bar chart\">\n          <g class=\"chart-container\">\n            <g class=\"y-grid\"></g>\n            <g class=\"bars\"></g>\n            <g class=\"x-axis\"></g>\n            <g class=\"value-labels\"></g>\n          </g>\n        </svg>\n        ${this.showLegend && legendItems.length\n          ? html`<div class=\"legend\" role=\"list\">\n              ${legendItems.map(\n                item => html`<span class=\"legend-item\" role=\"listitem\">\n                  <span\n                    class=\"swatch\"\n                    style=${styleMap({ background: item.color })}\n                  ></span>\n                  <span>${item.name}</span>\n                </span>`,\n              )}\n            </div>`\n          : null}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'wc-chart-stacked-bar': ChartStackedBar;\n  }\n}\n"],"names":["orderNone","offsetNone","LitElement","scaleOrdinal","scaleBand","scaleLinear","html","styleMap","styles","query","property"],"mappings":"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","x_google_ignoreList":[0,1,2]}

package/dist/code-editor.js

@@ -3,7 +3,8 @@ import { n } from './property-1psGvXOq.js';
 import { r } from './state-DwbEjqVk.js';
 import { e } from './query-QBcUV-L_.js';
 import { e as e$1 } from './class-map-YU7g0o3B.js';
-import { B as BaseInput, i as isDarkMode, o as observeThemeChange } from './is-dark-mode-DicqGkCJ.js';
+import { B as BaseInput } from './BaseInput-14YmcfK7.js';
+import { i as isDarkMode, o as observeThemeChange } from './is-dark-mode-DOcaw4Yq.js';
 import { r as redispatchEvent } from './dispatch-event-utils-CuEqjlPT.js';
 import './directive-ZPhl09Yt.js';