@redvars/peacock 3.3.3 → 3.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/IndividualComponent-DUINtMGK.js +67 -0
- package/dist/IndividualComponent-DUINtMGK.js.map +1 -0
- package/dist/assets/images/empty-state/no-document.svg +11 -12
- package/dist/assets/images/empty-state/page.svg +15 -9
- package/dist/assets/styles.css +1 -1
- package/dist/assets/styles.css.map +1 -1
- package/dist/banner.js +202 -0
- package/dist/banner.js.map +1 -0
- package/dist/bottom-sheet.js +238 -0
- package/dist/bottom-sheet.js.map +1 -0
- package/dist/{button-ClzS8JLq.js → button-DMN1dPAg.js} +358 -218
- package/dist/button-DMN1dPAg.js.map +1 -0
- package/dist/button-group-CX9CUUXk.js +435 -0
- package/dist/button-group-CX9CUUXk.js.map +1 -0
- package/dist/button-group.js +11 -6
- package/dist/button-group.js.map +1 -1
- package/dist/button.js +10 -5
- package/dist/button.js.map +1 -1
- package/dist/card-content.js +29 -0
- package/dist/card-content.js.map +1 -0
- package/dist/card.js +428 -44
- package/dist/card.js.map +1 -1
- package/dist/{chart-bar-DbnXQgvS.js → chart-bar-cn6rrna-.js} +2 -2
- package/dist/{chart-bar-DbnXQgvS.js.map → chart-bar-cn6rrna-.js.map} +1 -1
- package/dist/chart-bar.js +5 -4
- package/dist/chart-bar.js.map +1 -1
- package/dist/chart-doughnut.js +2 -1
- package/dist/chart-doughnut.js.map +1 -1
- package/dist/chart-pie.js +2 -1
- package/dist/chart-pie.js.map +1 -1
- package/dist/chart-stacked-bar.js +5 -4
- package/dist/chart-stacked-bar.js.map +1 -1
- package/dist/{class-map-59YGWLnx.js → class-map-YU7g0o3B.js} +4 -10
- package/dist/class-map-YU7g0o3B.js.map +1 -0
- package/dist/clock.js +2 -1
- package/dist/clock.js.map +1 -1
- package/dist/code-editor.js +8 -6
- package/dist/code-editor.js.map +1 -1
- package/dist/code-highlighter.js +6 -4
- package/dist/code-highlighter.js.map +1 -1
- package/dist/custom-elements-jsdocs.json +6270 -5026
- package/dist/custom-elements.json +5763 -2049
- package/dist/directive-ZPhl09Yt.js +9 -0
- package/dist/directive-ZPhl09Yt.js.map +1 -0
- package/dist/dispatch-event-utils-CuEqjlPT.js +127 -0
- package/dist/dispatch-event-utils-CuEqjlPT.js.map +1 -0
- package/dist/fab-C5Nzxk0E.js +497 -0
- package/dist/fab-C5Nzxk0E.js.map +1 -0
- package/dist/fab.js +11 -0
- package/dist/fab.js.map +1 -0
- package/dist/index.js +24 -12
- package/dist/index.js.map +1 -1
- package/dist/{observe-theme-change-pALI5fmV.js → is-dark-mode-DicqGkCJ.js} +8 -3
- package/dist/is-dark-mode-DicqGkCJ.js.map +1 -0
- package/dist/notification.js +417 -0
- package/dist/notification.js.map +1 -0
- package/dist/number-counter.js +4 -3
- package/dist/number-counter.js.map +1 -1
- package/dist/observe-slot-change-BGJfgg2E.js +31 -0
- package/dist/observe-slot-change-BGJfgg2E.js.map +1 -0
- package/dist/peacock-loader.js +59 -10
- package/dist/peacock-loader.js.map +1 -1
- package/dist/property-1psGvXOq.js +10 -0
- package/dist/property-1psGvXOq.js.map +1 -0
- package/dist/search.js +452 -0
- package/dist/search.js.map +1 -0
- package/dist/{radio-b70_Ie9n.js → select-4pl4XBj7.js} +2439 -521
- package/dist/select-4pl4XBj7.js.map +1 -0
- package/dist/side-sheet.js +186 -0
- package/dist/side-sheet.js.map +1 -0
- package/dist/spread-B5cgadZl.js +32 -0
- package/dist/spread-B5cgadZl.js.map +1 -0
- package/dist/src/__base_element/BaseHyperlink.d.ts +20 -0
- package/dist/src/__utils/cache-fetch.d.ts +1 -0
- package/dist/src/__utils/is-dark-mode.d.ts +1 -0
- package/dist/src/__utils/is-in-viewport.d.ts +1 -0
- package/dist/src/__utils/observe-slot-change.d.ts +1 -0
- package/dist/src/__utils/sanitize-svg.d.ts +1 -0
- package/dist/src/__utils/throttle.d.ts +4 -0
- package/dist/src/accordion/accordion-item.d.ts +33 -9
- package/dist/src/accordion/accordion.d.ts +21 -5
- package/dist/src/banner/banner.d.ts +47 -0
- package/dist/src/banner/index.d.ts +1 -0
- package/dist/src/bottom-sheet/bottom-sheet.d.ts +42 -0
- package/dist/src/bottom-sheet/index.d.ts +1 -0
- package/dist/src/button/BaseButton.d.ts +7 -13
- package/dist/src/button/button/button.d.ts +4 -0
- package/dist/src/button/button-group/button-group.d.ts +32 -3
- package/dist/src/button/icon-button/icon-button.d.ts +4 -0
- package/dist/src/card/card-content.d.ts +15 -0
- package/dist/src/card/card.d.ts +37 -3
- package/dist/src/card/index.d.ts +1 -0
- package/dist/src/container/container.d.ts +1 -1
- package/dist/src/empty-state/empty-state.d.ts +1 -1
- package/dist/src/fab/fab.d.ts +111 -0
- package/dist/src/fab/index.d.ts +1 -0
- package/dist/src/focus-ring/focus-ring.d.ts +4 -1
- package/dist/src/index.d.ts +11 -1
- package/dist/src/link/link.d.ts +3 -10
- package/dist/src/menu/menu/menu.d.ts +4 -2
- package/dist/src/menu/menu-item/menu-item.d.ts +0 -1
- package/dist/src/menu/sub-menu/sub-menu.d.ts +1 -0
- package/dist/src/notification/index.d.ts +1 -0
- package/dist/src/notification/notification.d.ts +69 -0
- package/dist/src/pagination/pagination.d.ts +8 -1
- package/dist/src/ripple/ripple.d.ts +19 -3
- package/dist/src/search/index.d.ts +1 -0
- package/dist/src/search/search.d.ts +76 -0
- package/dist/src/segmented-button/index.d.ts +2 -0
- package/dist/src/segmented-button/segmented-button-group.d.ts +46 -0
- package/dist/src/segmented-button/segmented-button.d.ts +65 -0
- package/dist/src/select/index.d.ts +3 -0
- package/dist/src/select/option.d.ts +55 -0
- package/dist/src/select/select.d.ts +114 -0
- package/dist/src/side-sheet/index.d.ts +1 -0
- package/dist/src/side-sheet/side-sheet.d.ts +41 -0
- package/dist/src/slider/slider.d.ts +4 -0
- package/dist/src/snackbar/snackbar.d.ts +14 -1
- package/dist/src/tabs/tab-group.d.ts +0 -1
- package/dist/src/tabs/tab.d.ts +8 -2
- package/dist/src/tabs/tabs.d.ts +13 -1
- package/dist/src/toolbar/index.d.ts +1 -0
- package/dist/src/toolbar/toolbar.d.ts +86 -0
- package/dist/state-DwbEjqVk.js +10 -0
- package/dist/state-DwbEjqVk.js.map +1 -0
- package/dist/{style-map-DcB52w-l.js → style-map-DVmWOuYy.js} +3 -3
- package/dist/{style-map-DcB52w-l.js.map → style-map-DVmWOuYy.js.map} +1 -1
- package/dist/test/search.test.d.ts +1 -0
- package/dist/test/toolbar.test.d.ts +1 -0
- package/dist/throttle-C7ZAPqtu.js +24 -0
- package/dist/throttle-C7ZAPqtu.js.map +1 -0
- package/dist/toolbar.js +306 -0
- package/dist/toolbar.js.map +1 -0
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/dist/{unsafe-html-C2r3PyzF.js → unsafe-html-BsGUjx94.js} +3 -3
- package/dist/{unsafe-html-C2r3PyzF.js.map → unsafe-html-BsGUjx94.js.map} +1 -1
- package/package.json +1 -1
- package/readme.md +2 -2
- package/scss/styles.scss +4 -0
- package/src/__base_element/BaseHyperlink.ts +42 -0
- package/src/__base_element/README.md +19 -0
- package/src/__utils/cache-fetch.ts +65 -0
- package/src/{utils → __utils}/dispatch-event-utils.ts +1 -0
- package/src/__utils/is-dark-mode.ts +3 -0
- package/src/__utils/is-in-viewport.ts +6 -0
- package/src/__utils/observe-slot-change.ts +38 -0
- package/src/__utils/sanitize-svg.ts +27 -0
- package/src/__utils/throttle.ts +27 -0
- package/src/accordion/accordion-item.scss +136 -65
- package/src/accordion/accordion-item.ts +117 -44
- package/src/accordion/accordion.scss +24 -5
- package/src/accordion/accordion.ts +29 -23
- package/src/accordion/demo/index.html +74 -35
- package/src/banner/banner.scss +87 -0
- package/src/banner/banner.ts +107 -0
- package/src/banner/index.ts +1 -0
- package/src/bottom-sheet/bottom-sheet.scss +88 -0
- package/src/bottom-sheet/bottom-sheet.ts +135 -0
- package/src/bottom-sheet/index.ts +1 -0
- package/src/button/BaseButton.ts +26 -30
- package/src/button/button/button-colors.scss +90 -19
- package/src/button/button/button-sizes.scss +39 -19
- package/src/button/button/button.scss +117 -116
- package/src/button/button/button.ts +29 -6
- package/src/button/button-group/button-group.scss +25 -22
- package/src/button/button-group/button-group.ts +122 -5
- package/src/button/icon-button/icon-button-sizes.scss +35 -15
- package/src/button/icon-button/icon-button.ts +25 -12
- package/src/card/card-colors.scss +10 -0
- package/src/card/card-content.ts +26 -0
- package/src/card/card.scss +221 -41
- package/src/card/card.ts +251 -8
- package/src/card/index.ts +1 -0
- package/src/chart-bar/chart-bar.ts +1 -1
- package/src/chart-bar/chart-stacked-bar.ts +3 -1
- package/src/chart-doughnut/chart-doughnut.ts +1 -1
- package/src/chart-pie/chart-pie.ts +1 -1
- package/src/checkbox/checkbox.ts +1 -1
- package/src/clock/clock.ts +1 -1
- package/src/code-editor/code-editor.ts +5 -5
- package/src/code-highlighter/code-highlighter.ts +2 -2
- package/src/container/container.ts +1 -1
- package/src/date-picker/date-picker.ts +5 -2
- package/src/divider/divider.ts +3 -1
- package/src/empty-state/empty-state.scss +9 -3
- package/src/empty-state/empty-state.ts +2 -2
- package/src/fab/fab-colors.scss +49 -0
- package/src/fab/fab-sizes.scss +47 -0
- package/src/fab/fab.scss +137 -0
- package/src/fab/fab.ts +285 -0
- package/src/fab/index.ts +1 -0
- package/src/field/field.ts +3 -1
- package/src/focus-ring/focus-ring.ts +37 -19
- package/src/icon/datasource.ts +1 -1
- package/src/icon/icon.ts +3 -1
- package/src/image/image.ts +3 -2
- package/src/index.ts +12 -1
- package/src/input/input.ts +5 -2
- package/src/link/link.ts +2 -15
- package/src/menu/menu/menu.scss +31 -3
- package/src/menu/menu/menu.ts +30 -6
- package/src/menu/menu-item/menu-item.scss +1 -0
- package/src/menu/menu-item/menu-item.ts +1 -9
- package/src/menu/sub-menu/sub-menu.ts +1 -0
- package/src/notification/index.ts +1 -0
- package/src/notification/notification.scss +201 -0
- package/src/notification/notification.ts +206 -0
- package/src/number-counter/number-counter.ts +3 -1
- package/src/number-field/number-field.ts +4 -2
- package/src/pagination/pagination.scss +33 -24
- package/src/pagination/pagination.ts +113 -60
- package/src/peacock-loader.ts +48 -0
- package/src/radio/radio.ts +3 -1
- package/src/ripple/ripple.ts +19 -3
- package/src/search/index.ts +1 -0
- package/src/search/search-colors.scss +14 -0
- package/src/search/search.scss +204 -0
- package/src/search/search.ts +240 -0
- package/src/segmented-button/index.ts +2 -0
- package/src/segmented-button/segmented-button-group.scss +21 -0
- package/src/segmented-button/segmented-button-group.ts +110 -0
- package/src/segmented-button/segmented-button.scss +115 -0
- package/src/segmented-button/segmented-button.ts +175 -0
- package/src/select/index.ts +3 -0
- package/src/select/option.ts +109 -0
- package/src/select/select.scss +125 -0
- package/src/select/select.ts +520 -0
- package/src/side-sheet/index.ts +1 -0
- package/src/side-sheet/side-sheet.scss +79 -0
- package/src/side-sheet/side-sheet.ts +100 -0
- package/src/slider/slider.scss +19 -1
- package/src/slider/slider.ts +30 -19
- package/src/snackbar/snackbar.scss +62 -31
- package/src/snackbar/snackbar.ts +92 -12
- package/src/switch/switch.ts +3 -1
- package/src/table/table.ts +3 -1
- package/src/tabs/demo/index.html +90 -0
- package/src/tabs/tab-group.ts +0 -3
- package/src/tabs/tab.scss +237 -25
- package/src/tabs/tab.ts +91 -14
- package/src/tabs/tabs.scss +37 -3
- package/src/tabs/tabs.ts +118 -2
- package/src/textarea/textarea.ts +4 -2
- package/src/time-picker/time-picker.ts +4 -2
- package/src/toolbar/index.ts +1 -0
- package/src/toolbar/toolbar-colors.scss +16 -0
- package/src/toolbar/toolbar.scss +165 -0
- package/src/toolbar/toolbar.ts +137 -0
- package/dist/IndividualComponent-Dt5xirYG.js +0 -73
- package/dist/IndividualComponent-Dt5xirYG.js.map +0 -1
- package/dist/button-ClzS8JLq.js.map +0 -1
- package/dist/button-group-BMS5WvaF.js +0 -292
- package/dist/button-group-BMS5WvaF.js.map +0 -1
- package/dist/chart-donut.js +0 -309
- package/dist/chart-donut.js.map +0 -1
- package/dist/class-map-59YGWLnx.js.map +0 -1
- package/dist/directive-Cuw6h7YA.js +0 -9
- package/dist/directive-Cuw6h7YA.js.map +0 -1
- package/dist/dispatch-event-utils-B4odODQf.js +0 -277
- package/dist/dispatch-event-utils-B4odODQf.js.map +0 -1
- package/dist/observe-theme-change-pALI5fmV.js.map +0 -1
- package/dist/radio-b70_Ie9n.js.map +0 -1
- package/dist/src/chart-donut/chart-donut.d.ts +0 -53
- package/dist/src/chart-donut/index.d.ts +0 -1
- package/dist/src/styleMixins.css.d.ts +0 -9
- package/dist/src/utils.d.ts +0 -9
- package/src/chart-donut/chart-donut.scss +0 -37
- package/src/chart-donut/chart-donut.ts +0 -287
- package/src/chart-donut/demo/index.html +0 -51
- package/src/chart-donut/index.ts +0 -1
- package/src/styleMixins.css.ts +0 -55
- package/src/utils.ts +0 -193
- /package/dist/src/{spread.d.ts → __directive/spread.d.ts} +0 -0
- /package/dist/src/{utils → __utils}/copy-to-clipboard.d.ts +0 -0
- /package/dist/src/{utils → __utils}/dispatch-event-utils.d.ts +0 -0
- /package/dist/src/{utils → __utils}/observe-theme-change.d.ts +0 -0
- /package/dist/test/{card.test.d.ts → banner.test.d.ts} +0 -0
- /package/src/{spread.ts → __directive/spread.ts} +0 -0
- /package/src/{utils → __utils}/copy-to-clipboard.ts +0 -0
- /package/src/{utils → __utils}/observe-theme-change.ts +0 -0
|
@@ -1 +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 'src/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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"}
|
|
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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"}
|
package/dist/chart-pie.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import { a as i, _ as __decorate,
|
|
1
|
+
import { a as i, _ as __decorate, I as IndividualComponent, i as i$1, b } from './IndividualComponent-DUINtMGK.js';
|
|
2
|
+
import { n } from './property-1psGvXOq.js';
|
|
2
3
|
import { e } from './query-QBcUV-L_.js';
|
|
3
4
|
import { o as ordinal, s as select, c as cubicInOut, i as interpolateNumber } from './transform-DSwFSqzD.js';
|
|
4
5
|
import { p as pie, a as arc } from './pie-Dz0IDiPt.js';
|
package/dist/chart-pie.js.map
CHANGED
|
@@ -1 +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 'src/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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"}
|
|
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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"}
|
|
@@ -1,10 +1,11 @@
|
|
|
1
|
-
import { _ as __decorate,
|
|
1
|
+
import { _ as __decorate, I as IndividualComponent, i, b } from './IndividualComponent-DUINtMGK.js';
|
|
2
|
+
import { n } from './property-1psGvXOq.js';
|
|
2
3
|
import { e } from './query-QBcUV-L_.js';
|
|
3
|
-
import { o } from './style-map-
|
|
4
|
+
import { o } from './style-map-DVmWOuYy.js';
|
|
4
5
|
import { o as ordinal, s as select } from './transform-DSwFSqzD.js';
|
|
5
|
-
import { c as css_248z, b as band, m as max, l as linear, a as axisLeft, d as axisBottom } from './chart-bar-
|
|
6
|
+
import { c as css_248z, b as band, m as max, l as linear, a as axisLeft, d as axisBottom } from './chart-bar-cn6rrna-.js';
|
|
6
7
|
import { c as constant, a as array } from './array-D5vjT2Xm.js';
|
|
7
|
-
import './directive-
|
|
8
|
+
import './directive-ZPhl09Yt.js';
|
|
8
9
|
|
|
9
10
|
function none$1(series, order) {
|
|
10
11
|
if (!((n = series.length) > 1)) return;
|
|
@@ -1 +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 IndividualComponent from 'src/IndividualComponent.js';\nimport * as d3 from 'd3';\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":";;;;;;;;AAAe,eAAQ,CAAC,MAAM,EAAE,KAAK,EAAE;AACvC,EAAE,IAAI,EAAE,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,IAAI,CAAC,CAAC,EAAE;AAClC,EAAE,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,EAAE,CAAC,MAAM,EAAE,CAAC,GAAG,CAAC,EAAE,EAAE,CAAC,EAAE;AAC9E,IAAI,EAAE,GAAG,EAAE,EAAE,EAAE,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;AAClC,IAAI,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,EAAE,CAAC,EAAE;AAC5B,MAAM,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AAClE,IAAI;AACJ,EAAE;AACF;;ACRe,aAAQ,CAAC,MAAM,EAAE;AAChC,EAAE,IAAI,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC,GAAG,IAAI,KAAK,CAAC,CAAC,CAAC;AACzC,EAAE,OAAO,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;AAC3B,EAAE,OAAO,CAAC;AACV;;ACCA,SAAS,UAAU,CAAC,CAAC,EAAE,GAAG,EAAE;AAC5B,EAAE,OAAO,CAAC,CAAC,GAAG,CAAC;AACf;;AAEA,SAAS,WAAW,CAAC,GAAG,EAAE;AAC1B,EAAE,MAAM,MAAM,GAAG,EAAE;AACnB,EAAE,MAAM,CAAC,GAAG,GAAG,GAAG;AAClB,EAAE,OAAO,MAAM;AACf;;AAEe,cAAQ,GAAG;AAC1B,EAAE,IAAI,IAAI,GAAG,QAAQ,CAAC,EAAE,CAAC;AACzB,MAAM,KAAK,GAAGA,IAAS;AACvB,MAAM,MAAM,GAAGC,MAAU;AACzB,MAAM,KAAK,GAAG,UAAU;;AAExB,EAAE,SAAS,KAAK,CAAC,IAAI,EAAE;AACvB,IAAI,IAAI,EAAE,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,SAAS,CAAC,EAAE,WAAW,CAAC;AACjE,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,CAAC,MAAM,EAAE,CAAC,GAAG,EAAE;AAChC,QAAQ,EAAE;;AAEV,IAAI,KAAK,MAAM,CAAC,IAAI,IAAI,EAAE;AAC1B,MAAM,KAAK,CAAC,GAAG,CAAC,EAAE,EAAE,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,EAAE,CAAC,EAAE;AACnC,QAAQ,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,EAAE,IAAI,CAAC,CAAC,EAAE,IAAI,GAAG,CAAC;AAChE,MAAM;AACN,IAAI;;AAEJ,IAAI,KAAK,CAAC,GAAG,CAAC,EAAE,EAAE,GAAG,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,EAAE,CAAC,EAAE;AACnD,MAAM,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC;AACzB,IAAI;;AAEJ,IAAI,MAAM,CAAC,EAAE,EAAE,EAAE,CAAC;AAClB,IAAI,OAAO,EAAE;AACb,EAAE;;AAEF,EAAE,KAAK,CAAC,IAAI,GAAG,SAAS,CAAC,EAAE;AAC3B,IAAI,OAAO,SAAS,CAAC,MAAM,IAAI,IAAI,GAAG,OAAO,CAAC,KAAK,UAAU,GAAG,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,KAAK,IAAI,IAAI;AAC1G,EAAE,CAAC;;AAEH,EAAE,KAAK,CAAC,KAAK,GAAG,SAAS,CAAC,EAAE;AAC5B,IAAI,OAAO,SAAS,CAAC,MAAM,IAAI,KAAK,GAAG,OAAO,CAAC,KAAK,UAAU,GAAG,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,EAAE,KAAK,IAAI,KAAK;AACjG,EAAE,CAAC;;AAEH,EAAE,KAAK,CAAC,KAAK,GAAG,SAAS,CAAC,EAAE;AAC5B,IAAI,OAAO,SAAS,CAAC,MAAM,IAAI,KAAK,GAAG,CAAC,IAAI,IAAI,GAAGD,IAAS,GAAG,OAAO,CAAC,KAAK,UAAU,GAAG,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,KAAK,IAAI,KAAK;AACpI,EAAE,CAAC;;AAEH,EAAE,KAAK,CAAC,MAAM,GAAG,SAAS,CAAC,EAAE;AAC7B,IAAI,OAAO,SAAS,CAAC,MAAM,IAAI,MAAM,GAAG,CAAC,IAAI,IAAI,GAAGC,MAAU,GAAG,CAAC,EAAE,KAAK,IAAI,MAAM;AACnF,EAAE,CAAC;;AAEH,EAAE,OAAO,KAAK;AACd;;ACrCA,MAAM,WAAW,GAAa,EAAE;AAChC,CAAC,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC,OAAO,CAAC,SAAS,IAAG;AACzE,IAAA,WAAW,CAAC,IAAI,CAAC,eAAe,SAAS,CAAA,CAAA,CAAG,CAAC;AAC/C,CAAC,CAAC;AAEF,MAAM,aAAa,GAAG,GAAG;AACzB,MAAM,cAAc,GAAG,GAAG;AAC1B,MAAM,UAAU,GAAG,CAAC;AACpB,MAAM,QAAQ,GAAG,GAAG;AAEpB,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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCG;AAEI,IAAM,eAAe,GAArB,MAAM,eAAgB,SAAQC,CAAU,CAAA;AAAxC,IAAA,WAAA,GAAA;;;QAOsC,IAAA,CAAA,KAAK,GAAW,CAAC;;QAGjB,IAAA,CAAA,MAAM,GAAW,cAAc;;QAG9C,IAAA,CAAA,MAAM,GAAW,EAAE;;QAGpB,IAAA,CAAA,IAAI,GAA0B,EAAE;;QAGJ,IAAA,CAAA,UAAU,GAAY,IAAI;;QAG1B,IAAA,CAAA,UAAU,GAAY,IAAI;QAEzE,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;IAsST;IApSE,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;AACA,QAAA,MAAM,YAAY,GAAG;YACnB,OAAO;YACP,QAAQ;YACR,QAAQ;YACR,MAAM;YACN,YAAY;YACZ,YAAY;SACb;AACD,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,eAAe,GAAA;AACrB,QAAA,MAAM,IAAI,GAAG,IAAI,GAAG,EAAU;AAC9B,QAAA,IAAI,CAAC,IAAI,EAAE,OAAO,CAAC,IAAI,IAAG;AACxB,YAAA,IAAI,CAAC,QAAQ,EAAE,OAAO,CAAC,OAAO,IAAI,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;AAC3D,QAAA,CAAC,CAAC;AACF,QAAA,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC;IACzB;AAEQ,IAAA,cAAc,CAAC,IAAc,EAAA;AACnC,QAAA,OAAOC,OACQ;aACZ,MAAM,CAAC,IAAI;aACX,KAAK,CAAC,WAAW,CAAC;IACvB;IAEQ,YAAY,CAClB,IAAc,EACd,KAAsC,EAAA;AAEtC,QAAA,MAAM,GAAG,GAAG,IAAI,GAAG,EAAkB;AACrC,QAAA,IAAI,CAAC,OAAO,CAAC,GAAG,IAAG;AACjB,YAAA,MAAM,QAAQ,GAAG,IAAI,CAAC;iBACnB,GAAG,CAAC,IAAI,IAAI,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,IAAI,GAAG,CAAC,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK;iBAC9D,IAAI,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC;AACzB,YAAA,GAAG,CAAC,GAAG,CAAC,GAAG,EAAE,QAAQ,IAAI,KAAK,CAAC,GAAG,CAAC,CAAC;AACtC,QAAA,CAAC,CAAC;AACF,QAAA,OAAO,GAAG;IACZ;AAEQ,IAAA,gBAAgB,CAAC,GAAW,EAAA;AAClC,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC;aAClB,GAAG,CAAC,IAAI,IAAI,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,IAAI,GAAG,CAAC,IAAI,KAAK,GAAG,CAAC;aACvD,IAAI,CAAC,OAAO,CAAC;AAChB,QAAA,OAAO,OAAO,EAAE,KAAK,IAAI,GAAG;IAC9B;IAEQ,UAAU,GAAA;AAChB,QAAA,OAAO,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,IACvB,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,GAAG,KAAK,GAAG,GAAG,GAAG,CAAC,KAAK,EAAE,CAAC,CAAC,CACvD;IACH;AAEQ,IAAA,YAAY,CAAC,OAAgB,EAAA;QACnC,IAAI,CAAC,IAAI,CAAC,UAAU;YAAE;AAEtB,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,GAAG,aAAa;AACzD,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC,GAAG,IAAI,CAAC,MAAM,GAAG,cAAc;AAC7D,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,EAAE,EAAE,CAAC;AACxC,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,IAAI,EAAE;QAE5B,MAAM,GAAG,GAAGC,MAAS,CAAC,IAAI,CAAC,UAAU,CAAC;AACtC,QAAA,GAAG,CAAC,IAAI,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC,IAAI,CAAC,QAAQ,EAAE,MAAM,CAAC;AAE/C,QAAA,MAAM,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,GAAG,MAAM,GAAG,CAAC,EAAE,CAAC,CAAC;AAClD,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,MAAM,GAAG,MAAM,GAAG,CAAC,EAAE,CAAC,CAAC;QAEpD,MAAM,SAAS,GAAG,GAAG,CAAC,MAAM,CAAc,kBAAkB,CAAC;QAC7D,SAAS,CAAC,IAAI,CAAC,WAAW,EAAE,CAAA,UAAA,EAAa,MAAM,CAAA,CAAA,EAAI,MAAM,CAAA,CAAA,CAAG,CAAC;AAE7D,QAAA,IAAI,CAAC,IAAI,CAAC,MAAM,IAAI,UAAU,KAAK,CAAC,IAAI,WAAW,KAAK,CAAC,EAAE;AACzD,YAAA,SAAS,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE;AACjD,YAAA,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE;AACnD,YAAA,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE;AACnD,YAAA,SAAS,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE;YACzD;QACF;AAEA,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,eAAe,EAAE;QACnC,MAAM,UAAU,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;QAC5C,MAAM,QAAQ,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,UAAU,CAAC;AAEpD,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,UAAU,EAAE;QAChC,MAAM,MAAM,GAAGC,IACH;AACT,aAAA,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC;AAC5B,aAAA,KAAK,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC;aACrB,OAAO,CAAC,GAAG,CAAC;QACf,MAAM,QAAQ,GAAGC,GAAM,CAAC,MAAM,CAAC,IAAI,CAAC;QACpC,MAAM,MAAM,GAAGC,MACD;aACX,MAAM,CAAC,CAAC,CAAC,EAAE,QAAQ,IAAI,CAAC,CAAC;AACzB,aAAA,IAAI;AACJ,aAAA,KAAK,CAAC,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC;QAE1B,MAAM,aAAa,GAAGC,KACd;aACL,IAAI,CAAC,IAAI;AACT,aAAA,KAAK,CACJ,CAAC,CAAC,EAAE,GAAG,KAAK,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,IAAI,OAAO,CAAC,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,IAAI,CAAC,CACzE,CAAC,IAAI,CAAC;QAET,MAAM,KAAK,GAAG,SAAS,CAAC,MAAM,CAAc,SAAS,CAAC;QACtD;AACG,aAAA,IAAI,CACHC,QACW,CAAC,MAAM;aACf,KAAK,CAAC,CAAC;aACP,QAAQ,CAAC,CAAC,UAAU;AACpB,aAAA,UAAU,CAAC,MAAM,EAAE,CAAC;aAExB,SAAS,CAAC,YAAY;AACtB,aAAA,MAAM,EAAE;QACX,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,MAAM,EAAE;AAChC,QAAA,KAAK,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC,IAAI,CAAC,OAAO,EAAE,UAAU,CAAC;QAEvD,MAAM,KAAK,GAAG,SAAS,CAAC,MAAM,CAAc,SAAS,CAAC;QACtD;AACG,aAAA,IAAI,CAAC,WAAW,EAAE,CAAA,YAAA,EAAe,WAAW,GAAG;AAC/C,aAAA,IAAI,CACHC,UACa,CAAC,MAAM;aACjB,aAAa,CAAC,CAAC;aACf,UAAU,CAAC,IAAI,IAAG;AACjB,YAAA,MAAM,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC;AAC7C,YAAA,OAAO,KAAK,EAAE,KAAK,IAAI,IAAI;QAC7B,CAAC,CAAC,CACL;AACH,QAAA,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,QAAQ,EAAE,8BAA8B,CAAC;QACtE,KAAK,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC,MAAM,EAAE;QACtC;aACG,SAAS,CAAC,YAAY;AACtB,aAAA,IAAI,CAAC,OAAO,EAAE,YAAY;AAC1B,aAAA,IAAI,CAAC,IAAI,EAAE,OAAO,CAAC;QAEtB,MAAM,SAAS,GAAG;aACf,MAAM,CAAC,OAAO;aACd,SAAS,CACR,YAAY;aAEb,IAAI,CAAC,aAAa,EAAE,MAAM,IAAI,MAAM,CAAC,GAAG;AACxC,aAAA,IAAI,CACH,KAAK,IACH;aACG,MAAM,CAAC,GAAG;AACV,aAAA,IAAI,CAAC,OAAO,EAAE,WAAW;AACzB,aAAA,KAAK,CAAC,MAAM,EAAE,MAAM,IAAI,QAAQ,CAAC,GAAG,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,EAC5D,MAAM,IAAI,MAAM,EAChB,IAAI,IAAI,IAAI,CAAC,MAAM,EAAE;aAEtB,KAAK,CAAC,MAAM,EAAE,MAAM,IAAI,QAAQ,CAAC,GAAG,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,UAAU,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC;QAE9E,MAAM,WAAW,GAAG;aACjB,SAAS,CAAsD,MAAM;AACrE,aAAA,IAAI,CAAC,MAAM,IAAI,MAAM,EAAE,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI;AACvC,aAAA,IAAI,CACH,KAAK,IACH;aACG,MAAM,CAAC,MAAM;AACb,aAAA,IAAI,CAAC,OAAO,EAAE,iBAAiB;AAC/B,aAAA,IAAI,CAAC,GAAG,EAAE,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;AACvC,aAAA,IAAI,CAAC,OAAO,EAAE,MAAM,CAAC,SAAS,EAAE;AAChC,aAAA,IAAI,CAAC,GAAG,EAAE,WAAW;AACrB,aAAA,IAAI,CAAC,QAAQ,EAAE,CAAC;AAChB,aAAA,IAAI,CAAC,IAAI,EAAE,UAAU;AACrB,aAAA,IAAI,CAAC,IAAI,EAAE,UAAU,CAAC,EAC3B,MAAM,IAAI,MAAM,EAChB,IAAI,IACF;AACG,aAAA,UAAU;aACV,QAAQ,CAAC,QAAQ;AACjB,aAAA,IAAI,CAAC,GAAG,EAAE,WAAW;AACrB,aAAA,IAAI,CAAC,QAAQ,EAAE,CAAC;aAChB,MAAM,EAAE,CACd;QAEH;AACG,aAAA,IAAI,CAAC,GAAG,EAAE,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;AACvC,aAAA,IAAI,CAAC,OAAO,EAAE,MAAM,CAAC,SAAS,EAAE;AAChC,aAAA,IAAI,CAAC,IAAI,EAAE,UAAU;AACrB,aAAA,IAAI,CAAC,IAAI,EAAE,UAAU,CAAC;QAEzB,IAAI,OAAO,EAAE;YACX;AACG,iBAAA,UAAU;iBACV,QAAQ,CAAC,QAAQ;AACjB,iBAAA,IAAI,CAAC,GAAG,EAAE,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;iBAC3B,IAAI,CAAC,QAAQ,EAAE,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACrD;aAAO;YACL;AACG,iBAAA,IAAI,CAAC,GAAG,EAAE,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;iBAC3B,IAAI,CAAC,QAAQ,EAAE,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACrD;QAEA,MAAM,WAAW,GAAG;aACjB,MAAM,CAAC,eAAe;aACtB,SAAS,CAAsC,MAAM;aACrD,IAAI,CAAC,IAAI,CAAC,UAAU,GAAG,IAAI,GAAG,EAAE,EAAE,CAAC,IAAI,CAAC,CAAC,IAAI;AAC7C,aAAA,IAAI,CACH,KAAK,IACH;aACG,MAAM,CAAC,MAAM;AACb,aAAA,IAAI,CAAC,OAAO,EAAE,aAAa;AAC3B,aAAA,IAAI,CAAC,aAAa,EAAE,QAAQ;aAC5B,IAAI,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,MAAM,CAAC,SAAS,EAAE,GAAG,CAAC;AAC7D,aAAA,IAAI,CAAC,GAAG,EAAE,WAAW,GAAG,CAAC;AACzB,aAAA,IAAI,CAAC,CAAC,IACL,CAAC,CAAC;AACC,aAAA,MAAM,CAAC,CAAC,GAAG,EAAE,GAAG,KAAK,GAAG,GAAG,GAAG,CAAC,KAAK,EAAE,CAAC;AACvC,aAAA,cAAc,EAAE,CACpB,EACL,MAAM,IAAI,MAAM,EAChB,IAAI,IAAI,IAAI,CAAC,MAAM,EAAE,CACtB;AAEH,QAAA,MAAM,aAAa,GAAG,CAAC,IAAyB,KAAI;YAClD,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,GAAG,KAAK,GAAG,GAAG,GAAG,CAAC,KAAK,EAAE,CAAC,CAAC;YACpE,MAAM,MAAM,GAAG,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC;YAChC,OAAO,IAAI,CAAC,GAAG,CAAC,MAAM,EAAE,WAAW,GAAG,CAAC,CAAC;AAC1C,QAAA,CAAC;QAED,IAAI,OAAO,EAAE;YACX;AACG,iBAAA,UAAU;iBACV,QAAQ,CAAC,QAAQ;iBACjB,IAAI,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,MAAM,CAAC,SAAS,EAAE,GAAG,CAAC;iBAC7D,IAAI,CAAC,GAAG,EAAE,CAAC,IAAI,aAAa,CAAC,CAAC,CAAC;AAC/B,iBAAA,IAAI,CAAC,CAAC,IACL,CAAC,CAAC;AACC,iBAAA,MAAM,CAAC,CAAC,GAAG,EAAE,GAAG,KAAK,GAAG,GAAG,GAAG,CAAC,KAAK,EAAE,CAAC;iBACvC,cAAc,EAAE,CACpB;QACL;aAAO;YACL;iBACG,IAAI,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,MAAM,CAAC,SAAS,EAAE,GAAG,CAAC;iBAC7D,IAAI,CAAC,GAAG,EAAE,CAAC,IAAI,aAAa,CAAC,CAAC,CAAC;AAC/B,iBAAA,IAAI,CAAC,CAAC,IACL,CAAC,CAAC;AACC,iBAAA,MAAM,CAAC,CAAC,GAAG,EAAE,GAAG,KAAK,GAAG,GAAG,GAAG,CAAC,KAAK,EAAE,CAAC;iBACvC,cAAc,EAAE,CACpB;QACL;IACF;IAEA,MAAM,GAAA;AACJ,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,eAAe,EAAE;QACnC,MAAM,UAAU,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;QAC5C,MAAM,QAAQ,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,UAAU,CAAC;QAEpD,MAAM,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,KAAK;AACnC,YAAA,IAAI,EAAE,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC;YAChC,KAAK,EAAE,QAAQ,CAAC,GAAG,CAAC,GAAG,CAAC,IAAI,UAAU,CAAC,GAAG,CAAC;AAC5C,SAAA,CAAC,CAAC;AAEH,QAAA,OAAOC,CAAI,CAAA;;;;;;;;;;AAUL,QAAA,EAAA,IAAI,CAAC,UAAU,IAAI,WAAW,CAAC;cAC7BA,CAAI,CAAA,CAAA;gBACA,WAAW,CAAC,GAAG,CACf,IAAI,IAAIA,CAAI,CAAA,CAAA;;;4BAGAC,CAAQ,CAAC,EAAE,UAAU,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC;;AAEtC,wBAAA,EAAA,IAAI,CAAC,IAAI,CAAA;wBACX,CACT;AACI,kBAAA;AACT,cAAE,IAAI;;KAEX;IACH;;AAhUO,eAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AAGhB,UAAA,CAAA;IADPC,CAAK,CAAC,KAAK;AACoB,CAAA,EAAA,eAAA,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,eAAA,CAAA,SAAA,EAAA,OAAA,EAAA,MAAA,CAAA;AAGlB,UAAA,CAAA;IAA1CA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;AAAkC,CAAA,EAAA,eAAA,CAAA,SAAA,EAAA,QAAA,EAAA,MAAA,CAAA;AAG/C,UAAA,CAAA;AAA3B,IAAAA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE;AAAsB,CAAA,EAAA,eAAA,CAAA,SAAA,EAAA,QAAA,EAAA,MAAA,CAAA;AAGrB,UAAA,CAAA;AAA1B,IAAAA,CAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE;AAAmC,CAAA,EAAA,eAAA,CAAA,SAAA,EAAA,MAAA,EAAA,MAAA,CAAA;AAGL,UAAA,CAAA;IAAtDA,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE;AAA6B,CAAA,EAAA,eAAA,CAAA,SAAA,EAAA,YAAA,EAAA,MAAA,CAAA;AAG3B,UAAA,CAAA;IAAtDA,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE;AAA6B,CAAA,EAAA,eAAA,CAAA,SAAA,EAAA,YAAA,EAAA,MAAA,CAAA;AAtBvE,eAAe,GAAA,UAAA,CAAA;IAD3B;AACY,CAAA,EAAA,eAAe,CAkU3B;;;;","x_google_ignoreList":[0,1,2]}
|
|
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]}
|
|
@@ -1,11 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { e as e$1, i, t } from './directive-
|
|
3
|
-
|
|
4
|
-
/**
|
|
5
|
-
* @license
|
|
6
|
-
* Copyright 2017 Google LLC
|
|
7
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
8
|
-
*/function r(r){return n({...r,state:true,attribute:false})}
|
|
1
|
+
import { E } from './IndividualComponent-DUINtMGK.js';
|
|
2
|
+
import { e as e$1, i, t } from './directive-ZPhl09Yt.js';
|
|
9
3
|
|
|
10
4
|
/**
|
|
11
5
|
* @license
|
|
@@ -13,5 +7,5 @@ import { e as e$1, i, t } from './directive-Cuw6h7YA.js';
|
|
|
13
7
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
14
8
|
*/const e=e$1(class extends i{constructor(t$1){if(super(t$1),t$1.type!==t.ATTRIBUTE||"class"!==t$1.name||t$1.strings?.length>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return " "+Object.keys(t).filter(s=>t[s]).join(" ")+" "}update(s,[i]){if(void 0===this.st){this.st=new Set,void 0!==s.strings&&(this.nt=new Set(s.strings.join(" ").split(/\s/).filter(t=>""!==t)));for(const t in i)i[t]&&!this.nt?.has(t)&&this.st.add(t);return this.render(i)}const r=s.element.classList;for(const t of this.st)t in i||(r.remove(t),this.st.delete(t));for(const t in i){const s=!!i[t];s===this.st.has(t)||this.nt?.has(t)||(s?(r.add(t),this.st.add(t)):(r.remove(t),this.st.delete(t)));}return E}});
|
|
15
9
|
|
|
16
|
-
export { e
|
|
17
|
-
//# sourceMappingURL=class-map-
|
|
10
|
+
export { e };
|
|
11
|
+
//# sourceMappingURL=class-map-YU7g0o3B.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"class-map-YU7g0o3B.js","sources":["../node_modules/lit-html/directives/class-map.js"],"sourcesContent":["import{noChange as t}from\"../lit-html.js\";import{directive as s,Directive as i,PartType as r}from\"../directive.js\";\n/**\n * @license\n * Copyright 2018 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */const e=s(class extends i{constructor(t){if(super(t),t.type!==r.ATTRIBUTE||\"class\"!==t.name||t.strings?.length>2)throw Error(\"`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.\")}render(t){return\" \"+Object.keys(t).filter(s=>t[s]).join(\" \")+\" \"}update(s,[i]){if(void 0===this.st){this.st=new Set,void 0!==s.strings&&(this.nt=new Set(s.strings.join(\" \").split(/\\s/).filter(t=>\"\"!==t)));for(const t in i)i[t]&&!this.nt?.has(t)&&this.st.add(t);return this.render(i)}const r=s.element.classList;for(const t of this.st)t in i||(r.remove(t),this.st.delete(t));for(const t in i){const s=!!i[t];s===this.st.has(t)||this.nt?.has(t)||(s?(r.add(t),this.st.add(t)):(r.remove(t),this.st.delete(t)))}return t}});export{e as classMap};\n//# sourceMappingURL=class-map.js.map\n"],"names":["s","t","r"],"mappings":";;;AACA;AACA;AACA;AACA;AACA,GAAQ,MAAC,CAAC,CAACA,GAAC,CAAC,cAAc,CAAC,CAAC,WAAW,CAACC,GAAC,CAAC,CAAC,GAAG,KAAK,CAACA,GAAC,CAAC,CAACA,GAAC,CAAC,IAAI,GAAGC,CAAC,CAAC,SAAS,EAAE,OAAO,GAAGD,GAAC,CAAC,IAAI,EAAEA,GAAC,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,MAAM,KAAK,CAAC,oGAAoG,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,OAAM,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,GAAG,CAAC,MAAM,GAAG,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,EAAE,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,OAAO,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,SAAS,CAAC,IAAI,MAAM,CAAC,IAAI,IAAI,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,EAAE,EAAE,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,EAAC,CAAC,OAAOA,CAAC,CAAC,CAAC;;;;","x_google_ignoreList":[0]}
|
package/dist/clock.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import { a as i, _ as __decorate,
|
|
1
|
+
import { a as i, _ as __decorate, I as IndividualComponent, i as i$1, b } from './IndividualComponent-DUINtMGK.js';
|
|
2
|
+
import { n } from './property-1psGvXOq.js';
|
|
2
3
|
|
|
3
4
|
class ClockController {
|
|
4
5
|
constructor(host, timeout = 1000) {
|
package/dist/clock.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"clock.js","sources":["../../src/clock/ClockController.ts","../../src/clock/clock.ts"],"sourcesContent":["import { ReactiveController, ReactiveControllerHost } from 'lit';\n\nexport class ClockController implements ReactiveController {\n host: ReactiveControllerHost;\n\n value = new Date();\n\n timeout: number;\n\n private _timerID?: any;\n\n constructor(host: ReactiveControllerHost, timeout = 1000) {\n this.host = host;\n this.host.addController(this);\n this.timeout = timeout;\n }\n\n hostConnected() {\n // Start a timer when the host is connected\n this._timerID = setInterval(() => {\n this.value = new Date();\n // Update the host with new value\n this.host.requestUpdate();\n }, this.timeout);\n }\n\n hostDisconnected() {\n // Clear the timer when the host is disconnected\n clearInterval(this._timerID);\n this._timerID = undefined;\n }\n}\n","import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport IndividualComponent from '
|
|
1
|
+
{"version":3,"file":"clock.js","sources":["../../src/clock/ClockController.ts","../../src/clock/clock.ts"],"sourcesContent":["import { ReactiveController, ReactiveControllerHost } from 'lit';\n\nexport class ClockController implements ReactiveController {\n host: ReactiveControllerHost;\n\n value = new Date();\n\n timeout: number;\n\n private _timerID?: any;\n\n constructor(host: ReactiveControllerHost, timeout = 1000) {\n this.host = host;\n this.host.addController(this);\n this.timeout = timeout;\n }\n\n hostConnected() {\n // Start a timer when the host is connected\n this._timerID = setInterval(() => {\n this.value = new Date();\n // Update the host with new value\n this.host.requestUpdate();\n }, this.timeout);\n }\n\n hostDisconnected() {\n // Clear the timer when the host is disconnected\n clearInterval(this._timerID);\n this._timerID = undefined;\n }\n}\n","import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport { ClockController } from './ClockController.js';\n\nimport styles from './clock.scss';\n\n/**\n * @label Clock\n * @tag wc-clock\n * @rawTag clock\n * @summary Displays the current time in a given timezone.\n * @overview\n * - Clocks are used to display the current time in a specified timezone.\n * - They can be displayed in various formats, including 12-hour and 24-hour time.\n * @tags display\n *\n * @example\n * ```html\n * <wc-clock></wc-clock>\n * ```\n */\n@IndividualComponent\nexport class Clock extends LitElement {\n static styles = [styles];\n\n clockController = new ClockController(this, 100);\n\n @property() timezone?: string;\n\n __formatDate(date: Date) {\n return date.toLocaleTimeString('en-US', {\n timeZone: this.timezone,\n });\n }\n\n render() {\n const currentDate = this.__formatDate(this.clockController.value);\n return html`<div class=\"current-time\">${currentDate}</div>`;\n }\n}\n"],"names":["LitElement","html","styles","property"],"mappings":";;;MAEa,eAAe,CAAA;AAS1B,IAAA,WAAA,CAAY,IAA4B,EAAE,OAAO,GAAG,IAAI,EAAA;AANxD,QAAA,IAAA,CAAA,KAAK,GAAG,IAAI,IAAI,EAAE;AAOhB,QAAA,IAAI,CAAC,IAAI,GAAG,IAAI;AAChB,QAAA,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;AAC7B,QAAA,IAAI,CAAC,OAAO,GAAG,OAAO;IACxB;IAEA,aAAa,GAAA;;AAEX,QAAA,IAAI,CAAC,QAAQ,GAAG,WAAW,CAAC,MAAK;AAC/B,YAAA,IAAI,CAAC,KAAK,GAAG,IAAI,IAAI,EAAE;;AAEvB,YAAA,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;AAC3B,QAAA,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC;IAClB;IAEA,gBAAgB,GAAA;;AAEd,QAAA,aAAa,CAAC,IAAI,CAAC,QAAQ,CAAC;AAC5B,QAAA,IAAI,CAAC,QAAQ,GAAG,SAAS;IAC3B;AACD;;;;;;;;;;;;;;;;;;;;;;ACxBD;;;;;;;;;;;;;;AAcG;AAEI,IAAM,KAAK,GAAX,MAAM,KAAM,SAAQA,GAAU,CAAA;AAA9B,IAAA,WAAA,GAAA;;QAGL,IAAA,CAAA,eAAe,GAAG,IAAI,eAAe,CAAC,IAAI,EAAE,GAAG,CAAC;IAclD;AAVE,IAAA,YAAY,CAAC,IAAU,EAAA;AACrB,QAAA,OAAO,IAAI,CAAC,kBAAkB,CAAC,OAAO,EAAE;YACtC,QAAQ,EAAE,IAAI,CAAC,QAAQ;AACxB,SAAA,CAAC;IACJ;IAEA,MAAM,GAAA;AACJ,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC;AACjE,QAAA,OAAOC,CAAI,CAAA,CAAA,0BAAA,EAA6B,WAAW,QAAQ;IAC7D;;AAfO,KAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AAIZ,UAAA,CAAA;AAAX,IAAAC,CAAQ;AAAqB,CAAA,EAAA,KAAA,CAAA,SAAA,EAAA,UAAA,EAAA,MAAA,CAAA;AALnB,KAAK,GAAA,UAAA,CAAA;IADjB;AACY,CAAA,EAAA,KAAK,CAiBjB;;;;"}
|
package/dist/code-editor.js
CHANGED
|
@@ -1,9 +1,11 @@
|
|
|
1
|
-
import { a as i, _ as __decorate,
|
|
2
|
-
import {
|
|
1
|
+
import { a as i, _ as __decorate, I as IndividualComponent, A, b } from './IndividualComponent-DUINtMGK.js';
|
|
2
|
+
import { n } from './property-1psGvXOq.js';
|
|
3
|
+
import { r } from './state-DwbEjqVk.js';
|
|
3
4
|
import { e } from './query-QBcUV-L_.js';
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import './
|
|
5
|
+
import { e as e$1 } from './class-map-YU7g0o3B.js';
|
|
6
|
+
import { B as BaseInput, i as isDarkMode, o as observeThemeChange } from './is-dark-mode-DicqGkCJ.js';
|
|
7
|
+
import { r as redispatchEvent } from './dispatch-event-utils-CuEqjlPT.js';
|
|
8
|
+
import './directive-ZPhl09Yt.js';
|
|
7
9
|
|
|
8
10
|
// src/util.ts
|
|
9
11
|
function defineProperty(obj, prop, value) {
|
|
@@ -43695,7 +43697,7 @@ var css_248z = i`@charset "UTF-8";
|
|
|
43695
43697
|
*
|
|
43696
43698
|
* @example
|
|
43697
43699
|
* ```html
|
|
43698
|
-
* <wc-code-editor language="javascript"></wc-code-editor>
|
|
43700
|
+
* <wc-code-editor language="javascript" style="width: 80%;--code-editor-height: 9rem;height: 9rem;" ></wc-code-editor>
|
|
43699
43701
|
* ```
|
|
43700
43702
|
*/
|
|
43701
43703
|
// At module level, outside the class
|