npm - q2-tecton-elements - Versions diffs - 1.66.1 → 1.67.0 - Mend

q2-tecton-elements 1.66.1 → 1.67.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.

Files changed (681) hide show

package/dist/collection/components/q2-chart-donut/q2-chart-donut.js CHANGED Viewed

@@ -262,9 +262,13 @@ export class Q2ChartDonut {
     // #endregion
     // #region Watchers
     propsUpdates() {
+        if (!this.chart)
+            return;
         this.updateChart(this.chart);
     }
     dataUpdated() {
+        if (!this.chart)
+            return;
         this.colors = this.getColors();
         this.updateChart(this.chart);
         this.setLegendData();
@@ -516,7 +520,7 @@ export class Q2ChartDonut {
             } })), !!name && h("div", { class: "name" }, name), !isNaN(value) && h("div", { class: "value" }, displayValue))));
     }
     render() {
-        return (h("click-elsewhere", { key: '3b86b1e2448ab6bf6659f80e0ee13d599ec6d9fd', onChange: this.onClickElsewhere }, h("figure", { key: '60b2a3aaf3b7330f9df2d3203f00c5c5a8e5a72b' }, h("div", { key: '480f4dcc8334e0d2be1a87eef0116c5e1c0a6e8e', class: "container" }, h("div", { key: '03d5e3362a964c848da2a8559f4a5ecb4849cc98', ref: el => (this.chartContainer = el), "aria-describedby": !this.isClickable ? 'center-card-description' : undefined, class: "chart-container", role: "img", "test-id": "chartContainer", onClick: this.onContainerClick, tabIndex: !this.isClickable ? 0 : undefined, onKeyDown: !this.isClickable ? this.onButtonKeyDown : undefined }), this.renderCenterBlock()), this.showLegend && (h("figcaption", { key: 'd6c1827fdae89c0f89446072704f02c0e9b7ac0d' }, h("q2-legend", { key: 'aa35957a67548b7d16b36f424c7cbd6228d12daa', class: "legend", data: this.legendData, format: this.format, hoveredItemId: this.legendHoveredId, onClick: this.onLegendClick, onMouseleave: this.onLegendMouseleave, onMouseenter: this.onLegendMouseenter, selectedItemId: this.selectedId }))))));
+        return (h("click-elsewhere", { key: '473d5d1b512e2d4d9ad9e215ebf597aaad0854d2', onChange: this.onClickElsewhere }, h("figure", { key: 'aa22d00635231662d6b446066b9fdc33c2f8748d' }, h("div", { key: '71f74bf9dbc69de99a88204ccc51d4d5864dfbf3', class: "container" }, h("div", { key: '9d2ff90b01d25ecd018a5e1a10dbac4726557ebb', ref: el => (this.chartContainer = el), "aria-describedby": !this.isClickable ? 'center-card-description' : undefined, class: "chart-container", role: "img", "test-id": "chartContainer", onClick: this.onContainerClick, tabIndex: !this.isClickable ? 0 : undefined, onKeyDown: !this.isClickable ? this.onButtonKeyDown : undefined }), this.renderCenterBlock()), this.showLegend && (h("figcaption", { key: '0795c3b57206c94c65ab1e81162dc9409426dbe9' }, h("q2-legend", { key: '58009cbd37d9ffaea2dd429b074f00b736eea866', class: "legend", data: this.legendData, format: this.format, hoveredItemId: this.legendHoveredId, onClick: this.onLegendClick, onMouseleave: this.onLegendMouseleave, onMouseenter: this.onLegendMouseenter, selectedItemId: this.selectedId }))))));
     }
     static get is() { return "q2-chart-donut"; }
     static get encapsulation() { return "shadow"; }
@@ -559,13 +563,13 @@ export class Q2ChartDonut {
                 "attribute": "data",
                 "mutable": false,
                 "complexType": {
-                    "original": "IDonutChartData[]",
-                    "resolved": "IDonutChartData[]",
+                    "original": "DonutChartData[]",
+                    "resolved": "DonutChartData[]",
                     "references": {
-                        "IDonutChartData": {
+                        "DonutChartData": {
                             "location": "import",
-                            "path": "q2-tecton-common/lib/types/element-types",
-                            "id": "../q2-tecton-common/lib/types/element-types.d.ts::IDonutChartData"
+                            "path": "q2-tecton-common/lib/types/elements",
+                            "id": "../q2-tecton-common/lib/types/elements.d.ts::DonutChartData"
                         }
                     }
                 },
@@ -832,13 +836,13 @@ export class Q2ChartDonut {
                     "text": "Emitted when a slice is selected."
                 },
                 "complexType": {
-                    "original": "IDonutChartData",
-                    "resolved": "IDonutChartData",
+                    "original": "DonutChartData",
+                    "resolved": "DonutChartData",
                     "references": {
-                        "IDonutChartData": {
+                        "DonutChartData": {
                             "location": "import",
-                            "path": "q2-tecton-common/lib/types/element-types",
-                            "id": "../q2-tecton-common/lib/types/element-types.d.ts::IDonutChartData"
+                            "path": "q2-tecton-common/lib/types/elements",
+                            "id": "../q2-tecton-common/lib/types/elements.d.ts::DonutChartData"
                         }
                     }
                 }
@@ -856,13 +860,13 @@ export class Q2ChartDonut {
                     "text": "Emitted when the center button is clicked.\n\nRequires the `isClickable` prop to be set to `true`."
                 },
                 "complexType": {
-                    "original": "IDonutChartData",
-                    "resolved": "IDonutChartData",
+                    "original": "DonutChartData",
+                    "resolved": "DonutChartData",
                     "references": {
-                        "IDonutChartData": {
+                        "DonutChartData": {
                             "location": "import",
-                            "path": "q2-tecton-common/lib/types/element-types",
-                            "id": "../q2-tecton-common/lib/types/element-types.d.ts::IDonutChartData"
+                            "path": "q2-tecton-common/lib/types/elements",
+                            "id": "../q2-tecton-common/lib/types/elements.d.ts::DonutChartData"
                         }
                     }
                 }
@@ -877,13 +881,13 @@ export class Q2ChartDonut {
                     "text": "Emitted when a slice is selected."
                 },
                 "complexType": {
-                    "original": "IDonutChartData",
-                    "resolved": "IDonutChartData",
+                    "original": "DonutChartData",
+                    "resolved": "DonutChartData",
                     "references": {
-                        "IDonutChartData": {
+                        "DonutChartData": {
                             "location": "import",
-                            "path": "q2-tecton-common/lib/types/element-types",
-                            "id": "../q2-tecton-common/lib/types/element-types.d.ts::IDonutChartData"
+                            "path": "q2-tecton-common/lib/types/elements",
+                            "id": "../q2-tecton-common/lib/types/elements.d.ts::DonutChartData"
                         }
                     }
                 }
@@ -898,13 +902,13 @@ export class Q2ChartDonut {
                     "text": "Emitted when the center button is clicked.\n\nRequires the `isClickable` prop to be set to `true`."
                 },
                 "complexType": {
-                    "original": "IDonutChartData",
-                    "resolved": "IDonutChartData",
+                    "original": "DonutChartData",
+                    "resolved": "DonutChartData",
                     "references": {
-                        "IDonutChartData": {
+                        "DonutChartData": {
                             "location": "import",
-                            "path": "q2-tecton-common/lib/types/element-types",
-                            "id": "../q2-tecton-common/lib/types/element-types.d.ts::IDonutChartData"
+                            "path": "q2-tecton-common/lib/types/elements",
+                            "id": "../q2-tecton-common/lib/types/elements.d.ts::DonutChartData"
                         }
                     }
                 }

package/dist/collection/components/q2-chart-donut/q2-chart-donut.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"q2-chart-donut.js","sourceRoot":"","sources":["../../../../src/components/q2-chart-donut/q2-chart-donut.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n State,\n Prop,\n h,\n ComponentInterface,\n Element,\n EventEmitter,\n Event,\n Method,\n Watch,\n Listen,\n} from '@stencil/core';\nimport * as echarts from 'echarts/core';\nimport {\n TooltipComponent,\n TooltipComponentOption,\n LegendComponent,\n AriaComponent,\n AriaComponentOption,\n LegendComponentOption,\n} from 'echarts/components';\nimport { PieChart, PieSeriesOption } from 'echarts/charts';\nimport { LabelLayout } from 'echarts/features';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport { isEventFromElement, isMobile, loc, overrideFocus } from 'src/utils';\nimport mirrorEmit from '@/utils/mirror-emit';\nimport { getCSSProperty } from 'src/utils/charting';\n\nimport type { IDonutChartData } from 'q2-tecton-common/lib/types/element-types';\n\necharts.use([TooltipComponent, LegendComponent, PieChart, CanvasRenderer, AriaComponent, LabelLayout]);\ntype EChartsOption = echarts.ComposeOption<\n TooltipComponentOption \| LegendComponentOption \| AriaComponentOption \| PieSeriesOption\n>;\n/*\n @name Donut Chart\n * @category Data Visualization\n * @summary Use for showing proportions of a whole as segments in a ring.\n /\n@Component({ tag: 'q2-chart-donut', shadow: true, styleUrl: 'q2-chart-donut.scss' })\nexport class Q2ChartDonut implements ComponentInterface {\n // #region Own Properties\n\n btnElement: HTMLDivElement;\n centerButtonElement: HTMLButtonElement;\n chart: echarts.ECharts;\n chartContainer: HTMLDivElement;\n chartContainerStyles: CSSStyleDeclaration;\n colors: string[];\n defaultRecord = { id: null, value: null, name: null };\n hostElementStyles: CSSStyleDeclaration;\n isInChangeEvent: boolean;\n resizeObserver: ResizeObserver;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n hoveredId: string;\n\n @State()\n legendData: IDonutChartData[];\n\n // #endregion\n // #region Public Property API\n\n /\n The title of the chart. We recommend always including this for accessibility purposes.\n \n It is hidden by default, but can be made visible with the `showChartName` variable.\n * @localizable\n /\n @Prop({ reflect: true })\n chartName: string;\n\n /* An array of objects that contain the data to be displayed. /\n @Prop()\n data: IDonutChartData[] = [];\n\n /* Controls whether values on the value axis are shown as numbers or as currency. /\n @Prop({ reflect: true })\n format: 'currency' \| 'default';\n\n /* The amount which the slice will scale when hovered. /\n @Prop()\n hoverScaleSize: number = 5;\n\n /\n The inner radius of the chart slices which is represeted by a percentage of the radius.\n \n @warning\n * If you update this property to be greater than or equal to the `outerRadius`,\n * we automatically set it to be 15% less than the current `outerRadius` to prevent display issues.\n /\n @Prop({ mutable: true })\n innerRadius: string = '70%';\n\n /\n Determine whether the data in the center renders inside a button element.\n \n @info\n * This also enables extra keyboard controls when the button is focused.\n /\n @Prop({ reflect: true })\n isClickable: boolean;\n\n /* The minimum size of the chart slizes which is represented as a percentage of the circumferences. /\n @Prop()\n minSliceSize: string = '2.5%';\n\n /\n The outer radius of the chart slices which is represented by a percentage of the radius.\n \n @warning\n * If you update this property to be less than or equal to the `innerRadius`,\n * we automatically set it to be 15% greater than the current `innerRadius` to prevent display issues.\n /\n @Prop({ mutable: true })\n outerRadius: string = '85%';\n\n /* The id of the data point that is currently selected in the chart. You may set this to pre-select a data point on render, or force a selection change. /\n @Prop({ mutable: true })\n selectedId: string;\n\n /* The amount which the slice will separate from the chart when selected. /\n @Prop()\n selectedOffset: number = 10;\n\n /\n Determines whether the legend is displayed.\n \n @info\n * The legend is a list of the data points in the chart and their colors.\n /\n @Prop({ reflect: true })\n showLegend: boolean = false;\n\n /* The icon that displays by default when no slices are selected. /\n @Prop({ reflect: true })\n summaryIcon: string;\n\n /\n The name that displays by default when no slices are selected.\n * @localizable\n /\n @Prop({ reflect: true })\n summaryName: string;\n\n // #endregion\n // #region Events\n\n /\n Emitted when a slice is selected.\n * @deprecated Use 'tctChange' instead\n /\n @Event()\n change: EventEmitter<IDonutChartData>;\n\n /\n Emitted when the center button is clicked.\n \n Requires the `isClickable` prop to be set to `true`.\n * @deprecated Use 'tctClick' instead\n /\n @Event()\n click: EventEmitter<IDonutChartData>;\n\n /\n Emitted when a slice is selected.\n /\n @Event()\n tctChange: EventEmitter<IDonutChartData>;\n\n /\n Emitted when the center button is clicked.\n \n Requires the `isClickable` prop to be set to `true`.\n /\n @Event()\n tctClick: EventEmitter<IDonutChartData>;\n\n // #endregion\n // #region Component Lifecycle Events\n\n disconnectedCallback() {\n // CRITICAL: Dispose eCharts instance to prevent memory leaks\n // eCharts holds references to canvas, event listeners (mouseover, mouseout, click, selectchanged, finished),\n // and animation frames. All chart event listeners are automatically cleaned up by dispose()\n if (this.chart) {\n this.chart.dispose();\n this.chart = null;\n }\n\n // Disconnect ResizeObserver\n this.resizeObserver?.disconnect();\n this.resizeObserver = null;\n\n // Clear cached style references that hold DOM references (Safari memory management)\n this.chartContainerStyles = null;\n this.hostElementStyles = null;\n\n // Clear DOM references\n this.chartContainer = null;\n this.centerButtonElement = null;\n this.btnElement = null;\n\n // Clear data references\n this.colors = null;\n this.legendData = null;\n\n // Clear state to prevent lingering references\n this.hoveredId = null;\n this.selectedId = null;\n }\n\n componentDidLoad(): void {\n const chart = echarts.init(this.chartContainer);\n\n this.cacheComputedStyles();\n this.colors = this.getColors();\n\n this.resizeObserver = new ResizeObserver(() => this.resizeChart());\n this.resizeObserver.observe(this.hostElement);\n\n this.updateChart(chart);\n this.setupChartEvents(chart);\n this.checkSelectedId();\n\n this.chart = chart;\n this.setLegendData();\n this.selectById(this.selectedId);\n overrideFocus(this.hostElement);\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n if (!isEventFromElement(event, this.hostElement)) return;\n if (!this.isClickable) return;\n this.centerButtonElement?.focus();\n }\n\n // #endregion\n // #region Public Methods API\n\n /\n Clears any selected slice.\n /\n @Method()\n async clearSelection() {\n const { selectedId } = this;\n if (!selectedId) return;\n\n this.chart.dispatchAction({\n type: 'unselect',\n seriesId: 'pie',\n dataIndex: this.getIndexById(selectedId),\n });\n }\n\n /\n Returns the chart instance for e2e testing.\n \n @testOnly\n /\n @Method()\n async getChartOptions(): Promise<any> {\n return this.chart.getOption();\n }\n\n /\n Selects a slice by its provided `id` in the provided `data`.\n /\n @Method()\n async selectById(id: string) {\n const dataIndex = this.getIndexById(id);\n if (dataIndex === -1) return;\n this.chart.dispatchAction({\n type: 'select',\n seriesId: 'pie',\n dataIndex,\n });\n }\n\n /\n Selects a slice by its index in the provided `data`.\n /\n @Method()\n async selectByIndex(index: number) {\n const dataIndex = this.data[index] ? index : null;\n if (!dataIndex) return;\n this.chart.dispatchAction({\n type: 'select',\n seriesId: 'pie',\n dataIndex,\n });\n }\n\n /\n A method to select a slice with index.\n \n @testOnly\n /\n @Method()\n async selectDataPoint(index: number) {\n this.chart.dispatchAction({\n type: 'select',\n seriesId: 'pie',\n dataIndex: index,\n });\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('chartName')\n @Watch('innerRadius')\n @Watch('outerRadius')\n @Watch('minSliceSize')\n @Watch('hoverScaleSize')\n @Watch('selectedOffset')\n propsUpdates() {\n this.updateChart(this.chart);\n }\n\n @Watch('data')\n dataUpdated() {\n this.colors = this.getColors();\n this.updateChart(this.chart);\n this.setLegendData();\n }\n\n @Watch('innerRadius')\n innerRadiusUpdated() {\n const { innerRadius, outerRadius } = this;\n const innerRadiusInt = parseFloat(innerRadius);\n const outerRadiusInt = parseFloat(outerRadius);\n if (innerRadiusInt >= outerRadiusInt) {\n this.innerRadius = `${outerRadiusInt - 15}%`;\n }\n }\n\n @Watch('outerRadius')\n outerRadiusUpdated() {\n const { innerRadius, outerRadius } = this;\n const innerRadiusInt = parseFloat(innerRadius);\n const outerRadiusInt = parseFloat(outerRadius);\n if (outerRadiusInt <= innerRadiusInt) {\n this.outerRadius = `${innerRadiusInt + 15}%`;\n }\n }\n\n /\n Function to detect and set a data range (category) as selected\n * Logic for when legends are present, and can set selectedId when ledgend category is clicked\n * Also can be used by dev to preset\n /\n @Watch('selectedId')\n checkSelectedId() {\n if (!!this.selectedId) {\n this.hoveredId = this.selectedId;\n // Dispatch action only to be fired when chart is rendered\n if (this.chart) {\n this.selectById(this.selectedId);\n }\n } else {\n // Dispatch action only to be fired when chart is rendered\n if (this.chart) {\n this.chart.dispatchAction({\n type: 'unselect',\n seriesId: 'pie',\n dataIndex: this.getIndexById(this.hoveredId),\n });\n }\n this.hoveredId = null;\n }\n }\n\n // #endregion\n // #region Local Methods\n\n get centerData() {\n const { hoveredId, data } = this;\n const idToDisplay = hoveredId;\n const index = this.getIndexById(idToDisplay);\n\n return idToDisplay\n ? { ...this.getDataById(idToDisplay), color: this.colors[index] }\n : {\n name: loc(this.summaryName \|\| 'tecton.element.chartDonut.button.summaryName'),\n icon: this.summaryIcon,\n value: data.reduce((acc, cur) => acc + cur.value, 0),\n color: null,\n };\n }\n\n get isMobile(): boolean {\n return isMobile();\n }\n\n get legendHoveredId() {\n return this.hoveredId === this.selectedId ? null : this.hoveredId;\n }\n\n cacheComputedStyles() {\n this.chartContainerStyles = getComputedStyle(this.chartContainer);\n this.hostElementStyles = getComputedStyle(this.hostElement);\n }\n\n displayValue(value: string \| number) {\n const valueAsFloat = parseFloat(value.toString());\n if (isNaN(valueAsFloat)) return;\n\n if (this.format === 'currency') {\n return Intl.NumberFormat('en-US', {\n style: 'currency',\n currency: 'USD',\n }).format(valueAsFloat);\n } else {\n return Intl.NumberFormat('en-US').format(valueAsFloat);\n }\n }\n\n getColors() {\n const defaultColors = [1, 3, 8, 4, 2, 10, 7, 11, 6, 9, 12, 5].map(e => `--comp-color-${e}`);\n return this.data.reduce((acc, cur, idx) => {\n let color = defaultColors[idx % defaultColors.length];\n if (cur.color) color = cur.color;\n\n acc.push(getCSSProperty(color, this.chartContainerStyles, this.hostElementStyles) \|\| color);\n return acc;\n }, []);\n }\n\n getCSSProperty(name: string) {\n let fallback;\n if (name.startsWith('var(') && name.endsWith(')')) {\n const regExp = /var\$(.)\$/g;\n const result = regExp.exec(name);\n const split = result.length >= 2 ? result[1].split(',') : [];\n name = split[0];\n fallback = split[1];\n }\n let result = this.chartContainerStyles.getPropertyValue(name).trim();\n if (!result) result = this.hostElementStyles.getPropertyValue(name).trim();\n return result \|\| fallback;\n }\n\n getDataById(id: string) {\n if (!id) return;\n return this.data.find(item => item.id === id);\n }\n\n getDataByIndex(index: number) {\n if (typeof index !== 'number') return;\n return this.data[index];\n }\n\n getDataIndexForId(id: string) {\n return this.data.findIndex(item => item.id === id);\n }\n\n getIndexById(id: string) {\n return this.data.findIndex(item => item.id === id);\n }\n\n getMinSliceSizeAsAngle() {\n return (parseFloat(this.minSliceSize) / 100) * 360;\n }\n\n onButtonClick = (event: MouseEvent) => {\n event.stopPropagation();\n\n const { selectedId } = this;\n const data = selectedId ? this.getDataById(selectedId) : { ...this.defaultRecord };\n mirrorEmit(this, ['click', 'tctClick'], data);\n };\n\n onButtonKeyDown = (event: KeyboardEvent) => {\n const { selectedId, data } = this;\n let selectedIndex = this.getIndexById(selectedId) \|\| 0;\n switch (event.key) {\n case 'ArrowUp':\n case 'ArrowDown':\n event.preventDefault();\n break;\n\n case 'ArrowLeft':\n event.preventDefault();\n selectedIndex--;\n if (selectedIndex < 0) selectedIndex = data.length - 1;\n this.chart.dispatchAction({\n type: 'select',\n seriesId: 'pie',\n dataIndex: selectedIndex,\n });\n break;\n\n case 'ArrowRight':\n event.preventDefault();\n selectedIndex++;\n if (selectedIndex > data.length - 1) selectedIndex = 0;\n this.chart.dispatchAction({\n type: 'select',\n seriesId: 'pie',\n dataIndex: selectedIndex,\n });\n break;\n\n case 'Escape':\n this.clearSelection();\n break;\n\n case ' ':\n event.preventDefault();\n break;\n\n default:\n return;\n }\n };\n\n onClickElsewhere = (event: Event) => {\n event.stopPropagation();\n this.clearSelection();\n };\n\n onContainerClick = (event: Event) => {\n if (this.isInChangeEvent) return;\n if (!(event.target instanceof HTMLElement)) return;\n this.clearSelection();\n event.stopPropagation();\n };\n\n onLegendClick = event => {\n event.stopPropagation();\n if (event.detail) {\n const dataIndex = this.getDataIndexForId(event.detail.id);\n this.selectedId = event.detail.id;\n this.chart.dispatchAction({\n type: 'select',\n seriesIndex: 0,\n dataIndex,\n });\n } else {\n const dataIndex = this.getDataIndexForId(this.selectedId);\n this.hoveredId = this.selectedId;\n this.selectedId = null;\n this.chart.dispatchAction({\n type: 'unselect',\n seriesIndex: 0,\n dataIndex,\n });\n }\n };\n\n onLegendMouseenter = event => {\n const dataIndex = this.getDataIndexForId(event.detail.id);\n this.hoveredId = event.detail.id;\n this.chart.dispatchAction({\n type: 'highlight',\n seriesIndex: 0,\n dataIndex,\n });\n };\n\n onLegendMouseleave = event => {\n const dataIndex = this.getDataIndexForId(event.detail.id);\n this.hoveredId = this.selectedId;\n this.chart.dispatchAction({\n type: 'downplay',\n seriesIndex: 0,\n dataIndex,\n });\n };\n\n resizeChart() {\n this.chart.resize();\n }\n\n setLegendData() {\n const chartColors = this.chart.getOption().series[0].color;\n this.legendData = this.data.map((item, index) => {\n const newItem = { ...item };\n if (!newItem.color) newItem.color = chartColors[index];\n\n return newItem;\n });\n }\n\n // Edit with caution. Echarts does not interpret events the same on mobile.\n setupChartEvents(chart: echarts.ECharts) {\n if (!this.isMobile) {\n chart.on('mouseover', (params: any) => {\n this.hoveredId = params.data.id;\n });\n chart.on('mouseout', () => {\n this.hoveredId = this.selectedId;\n });\n }\n chart.on('click', params => {\n params.event.stop();\n });\n chart.on('selectchanged', (params: any) => {\n const selectedIndex = params.selected?.[0]?.dataIndex?.[0] ?? null;\n const data =\n typeof selectedIndex === 'number' ? this.getDataByIndex(selectedIndex) : { ...this.defaultRecord };\n this.selectedId = data.id;\n this.isInChangeEvent = true;\n mirrorEmit(this, ['change', 'tctChange'], data);\n setTimeout(() => {\n this.isInChangeEvent = false;\n }, 0);\n });\n chart.on('finished', () => {\n const canvas = chart.getDom().querySelector('canvas');\n if (canvas?.hasAttribute('aria-hidden') ?? false) return;\n canvas.setAttribute('aria-hidden', 'true');\n });\n }\n\n updateChart(chart: echarts.ECharts) {\n this.validateColor();\n return chart.setOption<EChartsOption>({\n tooltip: {\n show: false,\n },\n legend: {\n show: false,\n },\n aria: {\n enabled: true,\n },\n series: [\n {\n name: this.chartName,\n animationType: 'scale',\n color: this.colors,\n id: 'pie',\n type: 'pie',\n selectedOffset: this.selectedOffset,\n selectedMode: 'single',\n radius: [this.innerRadius, this.outerRadius],\n label: {\n show: false,\n },\n labelLine: {\n show: false,\n },\n padAngle: 3,\n itemStyle: {\n borderRadius: 2,\n },\n emphasis: {\n disabled: this.isMobile,\n scaleSize: this.hoverScaleSize,\n itemStyle: {\n color: 'inherit',\n },\n },\n minAngle: this.getMinSliceSizeAsAngle(),\n data: this.data,\n },\n ],\n });\n }\n\n validateColor() {\n // check if there is name duplicated, then custom style using `itemStyle` object will be used.\n if (\n this.data.length >\n Object.keys(\n this.data.reduce((acc, cur) => {\n acc[cur.name] = cur.name;\n return acc;\n }, {})\n ).length\n ) {\n this.data.forEach((el, i) => {\n el.itemStyle = { ...el.itemStyle, color: el.color \|\| this.colors[i] };\n });\n }\n }\n\n // #endregion\n // #region Render Methods\n\n renderCenterBlock() {\n const { icon, name, value, color } = this.centerData;\n const { isClickable } = this;\n const TagName = isClickable ? 'button' : 'div';\n const displayValue = this.displayValue(value);\n\n const props = isClickable\n ? {\n onKeyDown: this.onButtonKeyDown,\n onClick: this.onButtonClick,\n ref: el => (this.centerButtonElement = el),\n 'aria-describedby': 'center-card-description',\n 'aria-roledescription': loc('tecton.element.chartDonut.button.roleDescription'),\n }\n : null;\n\n return (\n <div\n class=\"center-card-container\"\n style={{ width: `calc(${this.innerRadius})`, height: `calc(${this.innerRadius})` }}\n >\n <div\n id=\"center-card-description\"\n class=\"sr\"\n >\n {loc('tecton.element.chartDonut.button.description')}\n </div>\n <TagName\n class=\"center-card\"\n test-id=\"centerCard\"\n {...props}\n >\n {!!icon && (\n <q2-icon\n type={icon}\n style={\n color && {\n '--tct-icon-stroke-primary': color,\n '--tct-icon-stroke-secondary': color,\n color,\n }\n }\n ></q2-icon>\n )}\n {!!name && <div class=\"name\">{name}</div>}\n {!isNaN(value) && <div class=\"value\">{displayValue}</div>}\n </TagName>\n </div>\n );\n }\n\n render() {\n return (\n <click-elsewhere onChange={this.onClickElsewhere}>\n <figure>\n <div class=\"container\">\n <div\n ref={el => (this.chartContainer = el)}\n aria-describedby={!this.isClickable ? 'center-card-description' : undefined}\n class=\"chart-container\"\n role=\"img\"\n test-id=\"chartContainer\"\n onClick={this.onContainerClick}\n tabIndex={!this.isClickable ? 0 : undefined}\n onKeyDown={!this.isClickable ? this.onButtonKeyDown : undefined}\n ></div>\n {this.renderCenterBlock()}\n </div>\n {this.showLegend && (\n <figcaption>\n <q2-legend\n class=\"legend\"\n data={this.legendData}\n format={this.format}\n hoveredItemId={this.legendHoveredId}\n onClick={this.onLegendClick}\n onMouseleave={this.onLegendMouseleave}\n onMouseenter={this.onLegendMouseenter}\n selectedItemId={this.selectedId}\n />\n </figcaption>\n )}\n </figure>\n </click-elsewhere>\n );\n }\n\n // #endregion\n}\n"]}
1	+ {"version":3,"file":"q2-chart-donut.js","sourceRoot":"","sources":["../../../../src/components/q2-chart-donut/q2-chart-donut.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n State,\n Prop,\n h,\n ComponentInterface,\n Element,\n EventEmitter,\n Event,\n Method,\n Watch,\n Listen,\n} from '@stencil/core';\nimport * as echarts from 'echarts/core';\nimport {\n TooltipComponent,\n TooltipComponentOption,\n LegendComponent,\n AriaComponent,\n AriaComponentOption,\n LegendComponentOption,\n} from 'echarts/components';\nimport { PieChart, PieSeriesOption } from 'echarts/charts';\nimport { LabelLayout } from 'echarts/features';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport { isEventFromElement, isMobile, loc, overrideFocus } from 'src/utils';\nimport mirrorEmit from '@/utils/mirror-emit';\nimport { getCSSProperty } from 'src/utils/charting';\n\nimport type { DonutChartData } from 'q2-tecton-common/lib/types/elements';\n\necharts.use([TooltipComponent, LegendComponent, PieChart, CanvasRenderer, AriaComponent, LabelLayout]);\ntype EChartsOption = echarts.ComposeOption<\n TooltipComponentOption \| LegendComponentOption \| AriaComponentOption \| PieSeriesOption\n>;\n/*\n @name Donut Chart\n * @category Data Visualization\n * @summary Use for showing proportions of a whole as segments in a ring.\n /\n@Component({ tag: 'q2-chart-donut', shadow: true, styleUrl: 'q2-chart-donut.scss' })\nexport class Q2ChartDonut implements ComponentInterface {\n // #region Own Properties\n\n btnElement: HTMLDivElement;\n centerButtonElement: HTMLButtonElement;\n chart: echarts.ECharts;\n chartContainer: HTMLDivElement;\n chartContainerStyles: CSSStyleDeclaration;\n colors: string[];\n defaultRecord = { id: null, value: null, name: null };\n hostElementStyles: CSSStyleDeclaration;\n isInChangeEvent: boolean;\n resizeObserver: ResizeObserver;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n hoveredId: string;\n\n @State()\n legendData: DonutChartData[];\n\n // #endregion\n // #region Public Property API\n\n /\n The title of the chart. We recommend always including this for accessibility purposes.\n \n It is hidden by default, but can be made visible with the `showChartName` variable.\n * @localizable\n /\n @Prop({ reflect: true })\n chartName: string;\n\n /* An array of objects that contain the data to be displayed. /\n @Prop()\n data: DonutChartData[] = [];\n\n /* Controls whether values on the value axis are shown as numbers or as currency. /\n @Prop({ reflect: true })\n format: 'currency' \| 'default';\n\n /* The amount which the slice will scale when hovered. /\n @Prop()\n hoverScaleSize: number = 5;\n\n /\n The inner radius of the chart slices which is represeted by a percentage of the radius.\n \n @warning\n * If you update this property to be greater than or equal to the `outerRadius`,\n * we automatically set it to be 15% less than the current `outerRadius` to prevent display issues.\n /\n @Prop({ mutable: true })\n innerRadius: string = '70%';\n\n /\n Determine whether the data in the center renders inside a button element.\n \n @info\n * This also enables extra keyboard controls when the button is focused.\n /\n @Prop({ reflect: true })\n isClickable: boolean;\n\n /* The minimum size of the chart slizes which is represented as a percentage of the circumferences. /\n @Prop()\n minSliceSize: string = '2.5%';\n\n /\n The outer radius of the chart slices which is represented by a percentage of the radius.\n \n @warning\n * If you update this property to be less than or equal to the `innerRadius`,\n * we automatically set it to be 15% greater than the current `innerRadius` to prevent display issues.\n /\n @Prop({ mutable: true })\n outerRadius: string = '85%';\n\n /* The id of the data point that is currently selected in the chart. You may set this to pre-select a data point on render, or force a selection change. /\n @Prop({ mutable: true })\n selectedId: string;\n\n /* The amount which the slice will separate from the chart when selected. /\n @Prop()\n selectedOffset: number = 10;\n\n /\n Determines whether the legend is displayed.\n \n @info\n * The legend is a list of the data points in the chart and their colors.\n /\n @Prop({ reflect: true })\n showLegend: boolean = false;\n\n /* The icon that displays by default when no slices are selected. /\n @Prop({ reflect: true })\n summaryIcon: string;\n\n /\n The name that displays by default when no slices are selected.\n * @localizable\n /\n @Prop({ reflect: true })\n summaryName: string;\n\n // #endregion\n // #region Events\n\n /\n Emitted when a slice is selected.\n * @deprecated Use 'tctChange' instead\n /\n @Event()\n change: EventEmitter<DonutChartData>;\n\n /\n Emitted when the center button is clicked.\n \n Requires the `isClickable` prop to be set to `true`.\n * @deprecated Use 'tctClick' instead\n /\n @Event()\n click: EventEmitter<DonutChartData>;\n\n /\n Emitted when a slice is selected.\n /\n @Event()\n tctChange: EventEmitter<DonutChartData>;\n\n /\n Emitted when the center button is clicked.\n \n Requires the `isClickable` prop to be set to `true`.\n /\n @Event()\n tctClick: EventEmitter<DonutChartData>;\n\n // #endregion\n // #region Component Lifecycle Events\n\n disconnectedCallback() {\n // CRITICAL: Dispose eCharts instance to prevent memory leaks\n // eCharts holds references to canvas, event listeners (mouseover, mouseout, click, selectchanged, finished),\n // and animation frames. All chart event listeners are automatically cleaned up by dispose()\n if (this.chart) {\n this.chart.dispose();\n this.chart = null;\n }\n\n // Disconnect ResizeObserver\n this.resizeObserver?.disconnect();\n this.resizeObserver = null;\n\n // Clear cached style references that hold DOM references (Safari memory management)\n this.chartContainerStyles = null;\n this.hostElementStyles = null;\n\n // Clear DOM references\n this.chartContainer = null;\n this.centerButtonElement = null;\n this.btnElement = null;\n\n // Clear data references\n this.colors = null;\n this.legendData = null;\n\n // Clear state to prevent lingering references\n this.hoveredId = null;\n this.selectedId = null;\n }\n\n componentDidLoad(): void {\n const chart = echarts.init(this.chartContainer);\n\n this.cacheComputedStyles();\n this.colors = this.getColors();\n\n this.resizeObserver = new ResizeObserver(() => this.resizeChart());\n this.resizeObserver.observe(this.hostElement);\n\n this.updateChart(chart);\n this.setupChartEvents(chart);\n this.checkSelectedId();\n\n this.chart = chart;\n this.setLegendData();\n this.selectById(this.selectedId);\n overrideFocus(this.hostElement);\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n if (!isEventFromElement(event, this.hostElement)) return;\n if (!this.isClickable) return;\n this.centerButtonElement?.focus();\n }\n\n // #endregion\n // #region Public Methods API\n\n /\n Clears any selected slice.\n /\n @Method()\n async clearSelection() {\n const { selectedId } = this;\n if (!selectedId) return;\n\n this.chart.dispatchAction({\n type: 'unselect',\n seriesId: 'pie',\n dataIndex: this.getIndexById(selectedId),\n });\n }\n\n /\n Returns the chart instance for e2e testing.\n \n @testOnly\n /\n @Method()\n async getChartOptions(): Promise<any> {\n return this.chart.getOption();\n }\n\n /\n Selects a slice by its provided `id` in the provided `data`.\n /\n @Method()\n async selectById(id: string) {\n const dataIndex = this.getIndexById(id);\n if (dataIndex === -1) return;\n this.chart.dispatchAction({\n type: 'select',\n seriesId: 'pie',\n dataIndex,\n });\n }\n\n /\n Selects a slice by its index in the provided `data`.\n /\n @Method()\n async selectByIndex(index: number) {\n const dataIndex = this.data[index] ? index : null;\n if (!dataIndex) return;\n this.chart.dispatchAction({\n type: 'select',\n seriesId: 'pie',\n dataIndex,\n });\n }\n\n /\n A method to select a slice with index.\n \n @testOnly\n /\n @Method()\n async selectDataPoint(index: number) {\n this.chart.dispatchAction({\n type: 'select',\n seriesId: 'pie',\n dataIndex: index,\n });\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('chartName')\n @Watch('innerRadius')\n @Watch('outerRadius')\n @Watch('minSliceSize')\n @Watch('hoverScaleSize')\n @Watch('selectedOffset')\n propsUpdates() {\n if (!this.chart) return;\n this.updateChart(this.chart);\n }\n\n @Watch('data')\n dataUpdated() {\n if (!this.chart) return;\n this.colors = this.getColors();\n this.updateChart(this.chart);\n this.setLegendData();\n }\n\n @Watch('innerRadius')\n innerRadiusUpdated() {\n const { innerRadius, outerRadius } = this;\n const innerRadiusInt = parseFloat(innerRadius);\n const outerRadiusInt = parseFloat(outerRadius);\n if (innerRadiusInt >= outerRadiusInt) {\n this.innerRadius = `${outerRadiusInt - 15}%`;\n }\n }\n\n @Watch('outerRadius')\n outerRadiusUpdated() {\n const { innerRadius, outerRadius } = this;\n const innerRadiusInt = parseFloat(innerRadius);\n const outerRadiusInt = parseFloat(outerRadius);\n if (outerRadiusInt <= innerRadiusInt) {\n this.outerRadius = `${innerRadiusInt + 15}%`;\n }\n }\n\n /\n Function to detect and set a data range (category) as selected\n * Logic for when legends are present, and can set selectedId when ledgend category is clicked\n * Also can be used by dev to preset\n /\n @Watch('selectedId')\n checkSelectedId() {\n if (!!this.selectedId) {\n this.hoveredId = this.selectedId;\n // Dispatch action only to be fired when chart is rendered\n if (this.chart) {\n this.selectById(this.selectedId);\n }\n } else {\n // Dispatch action only to be fired when chart is rendered\n if (this.chart) {\n this.chart.dispatchAction({\n type: 'unselect',\n seriesId: 'pie',\n dataIndex: this.getIndexById(this.hoveredId),\n });\n }\n this.hoveredId = null;\n }\n }\n\n // #endregion\n // #region Local Methods\n\n get centerData() {\n const { hoveredId, data } = this;\n const idToDisplay = hoveredId;\n const index = this.getIndexById(idToDisplay);\n\n return idToDisplay\n ? { ...this.getDataById(idToDisplay), color: this.colors[index] }\n : {\n name: loc(this.summaryName \|\| 'tecton.element.chartDonut.button.summaryName'),\n icon: this.summaryIcon,\n value: data.reduce((acc, cur) => acc + cur.value, 0),\n color: null,\n };\n }\n\n get isMobile(): boolean {\n return isMobile();\n }\n\n get legendHoveredId() {\n return this.hoveredId === this.selectedId ? null : this.hoveredId;\n }\n\n cacheComputedStyles() {\n this.chartContainerStyles = getComputedStyle(this.chartContainer);\n this.hostElementStyles = getComputedStyle(this.hostElement);\n }\n\n displayValue(value: string \| number) {\n const valueAsFloat = parseFloat(value.toString());\n if (isNaN(valueAsFloat)) return;\n\n if (this.format === 'currency') {\n return Intl.NumberFormat('en-US', {\n style: 'currency',\n currency: 'USD',\n }).format(valueAsFloat);\n } else {\n return Intl.NumberFormat('en-US').format(valueAsFloat);\n }\n }\n\n getColors() {\n const defaultColors = [1, 3, 8, 4, 2, 10, 7, 11, 6, 9, 12, 5].map(e => `--comp-color-${e}`);\n return this.data.reduce((acc, cur, idx) => {\n let color = defaultColors[idx % defaultColors.length];\n if (cur.color) color = cur.color;\n\n acc.push(getCSSProperty(color, this.chartContainerStyles, this.hostElementStyles) \|\| color);\n return acc;\n }, []);\n }\n\n getCSSProperty(name: string) {\n let fallback;\n if (name.startsWith('var(') && name.endsWith(')')) {\n const regExp = /var\$(.)\$/g;\n const result = regExp.exec(name);\n const split = result.length >= 2 ? result[1].split(',') : [];\n name = split[0];\n fallback = split[1];\n }\n let result = this.chartContainerStyles.getPropertyValue(name).trim();\n if (!result) result = this.hostElementStyles.getPropertyValue(name).trim();\n return result \|\| fallback;\n }\n\n getDataById(id: string) {\n if (!id) return;\n return this.data.find(item => item.id === id);\n }\n\n getDataByIndex(index: number) {\n if (typeof index !== 'number') return;\n return this.data[index];\n }\n\n getDataIndexForId(id: string) {\n return this.data.findIndex(item => item.id === id);\n }\n\n getIndexById(id: string) {\n return this.data.findIndex(item => item.id === id);\n }\n\n getMinSliceSizeAsAngle() {\n return (parseFloat(this.minSliceSize) / 100) * 360;\n }\n\n onButtonClick = (event: MouseEvent) => {\n event.stopPropagation();\n\n const { selectedId } = this;\n const data = selectedId ? this.getDataById(selectedId) : { ...this.defaultRecord };\n mirrorEmit(this, ['click', 'tctClick'], data);\n };\n\n onButtonKeyDown = (event: KeyboardEvent) => {\n const { selectedId, data } = this;\n let selectedIndex = this.getIndexById(selectedId) \|\| 0;\n switch (event.key) {\n case 'ArrowUp':\n case 'ArrowDown':\n event.preventDefault();\n break;\n\n case 'ArrowLeft':\n event.preventDefault();\n selectedIndex--;\n if (selectedIndex < 0) selectedIndex = data.length - 1;\n this.chart.dispatchAction({\n type: 'select',\n seriesId: 'pie',\n dataIndex: selectedIndex,\n });\n break;\n\n case 'ArrowRight':\n event.preventDefault();\n selectedIndex++;\n if (selectedIndex > data.length - 1) selectedIndex = 0;\n this.chart.dispatchAction({\n type: 'select',\n seriesId: 'pie',\n dataIndex: selectedIndex,\n });\n break;\n\n case 'Escape':\n this.clearSelection();\n break;\n\n case ' ':\n event.preventDefault();\n break;\n\n default:\n return;\n }\n };\n\n onClickElsewhere = (event: Event) => {\n event.stopPropagation();\n this.clearSelection();\n };\n\n onContainerClick = (event: Event) => {\n if (this.isInChangeEvent) return;\n if (!(event.target instanceof HTMLElement)) return;\n this.clearSelection();\n event.stopPropagation();\n };\n\n onLegendClick = event => {\n event.stopPropagation();\n if (event.detail) {\n const dataIndex = this.getDataIndexForId(event.detail.id);\n this.selectedId = event.detail.id;\n this.chart.dispatchAction({\n type: 'select',\n seriesIndex: 0,\n dataIndex,\n });\n } else {\n const dataIndex = this.getDataIndexForId(this.selectedId);\n this.hoveredId = this.selectedId;\n this.selectedId = null;\n this.chart.dispatchAction({\n type: 'unselect',\n seriesIndex: 0,\n dataIndex,\n });\n }\n };\n\n onLegendMouseenter = event => {\n const dataIndex = this.getDataIndexForId(event.detail.id);\n this.hoveredId = event.detail.id;\n this.chart.dispatchAction({\n type: 'highlight',\n seriesIndex: 0,\n dataIndex,\n });\n };\n\n onLegendMouseleave = event => {\n const dataIndex = this.getDataIndexForId(event.detail.id);\n this.hoveredId = this.selectedId;\n this.chart.dispatchAction({\n type: 'downplay',\n seriesIndex: 0,\n dataIndex,\n });\n };\n\n resizeChart() {\n this.chart.resize();\n }\n\n setLegendData() {\n const chartColors = this.chart.getOption().series[0].color;\n this.legendData = this.data.map((item, index) => {\n const newItem = { ...item };\n if (!newItem.color) newItem.color = chartColors[index];\n\n return newItem;\n });\n }\n\n // Edit with caution. Echarts does not interpret events the same on mobile.\n setupChartEvents(chart: echarts.ECharts) {\n if (!this.isMobile) {\n chart.on('mouseover', (params: any) => {\n this.hoveredId = params.data.id;\n });\n chart.on('mouseout', () => {\n this.hoveredId = this.selectedId;\n });\n }\n chart.on('click', params => {\n params.event.stop();\n });\n chart.on('selectchanged', (params: any) => {\n const selectedIndex = params.selected?.[0]?.dataIndex?.[0] ?? null;\n const data =\n typeof selectedIndex === 'number' ? this.getDataByIndex(selectedIndex) : { ...this.defaultRecord };\n this.selectedId = data.id;\n this.isInChangeEvent = true;\n mirrorEmit(this, ['change', 'tctChange'], data);\n setTimeout(() => {\n this.isInChangeEvent = false;\n }, 0);\n });\n chart.on('finished', () => {\n const canvas = chart.getDom().querySelector('canvas');\n if (canvas?.hasAttribute('aria-hidden') ?? false) return;\n canvas.setAttribute('aria-hidden', 'true');\n });\n }\n\n updateChart(chart: echarts.ECharts) {\n this.validateColor();\n return chart.setOption<EChartsOption>({\n tooltip: {\n show: false,\n },\n legend: {\n show: false,\n },\n aria: {\n enabled: true,\n },\n series: [\n {\n name: this.chartName,\n animationType: 'scale',\n color: this.colors,\n id: 'pie',\n type: 'pie',\n selectedOffset: this.selectedOffset,\n selectedMode: 'single',\n radius: [this.innerRadius, this.outerRadius],\n label: {\n show: false,\n },\n labelLine: {\n show: false,\n },\n padAngle: 3,\n itemStyle: {\n borderRadius: 2,\n },\n emphasis: {\n disabled: this.isMobile,\n scaleSize: this.hoverScaleSize,\n itemStyle: {\n color: 'inherit',\n },\n },\n minAngle: this.getMinSliceSizeAsAngle(),\n data: this.data,\n },\n ],\n });\n }\n\n validateColor() {\n // check if there is name duplicated, then custom style using `itemStyle` object will be used.\n if (\n this.data.length >\n Object.keys(\n this.data.reduce((acc, cur) => {\n acc[cur.name] = cur.name;\n return acc;\n }, {})\n ).length\n ) {\n this.data.forEach((el, i) => {\n el.itemStyle = { ...el.itemStyle, color: el.color \|\| this.colors[i] };\n });\n }\n }\n\n // #endregion\n // #region Render Methods\n\n renderCenterBlock() {\n const { icon, name, value, color } = this.centerData;\n const { isClickable } = this;\n const TagName = isClickable ? 'button' : 'div';\n const displayValue = this.displayValue(value);\n\n const props = isClickable\n ? {\n onKeyDown: this.onButtonKeyDown,\n onClick: this.onButtonClick,\n ref: el => (this.centerButtonElement = el),\n 'aria-describedby': 'center-card-description',\n 'aria-roledescription': loc('tecton.element.chartDonut.button.roleDescription'),\n }\n : null;\n\n return (\n <div\n class=\"center-card-container\"\n style={{ width: `calc(${this.innerRadius})`, height: `calc(${this.innerRadius})` }}\n >\n <div\n id=\"center-card-description\"\n class=\"sr\"\n >\n {loc('tecton.element.chartDonut.button.description')}\n </div>\n <TagName\n class=\"center-card\"\n test-id=\"centerCard\"\n {...props}\n >\n {!!icon && (\n <q2-icon\n type={icon}\n style={\n color && {\n '--tct-icon-stroke-primary': color,\n '--tct-icon-stroke-secondary': color,\n color,\n }\n }\n ></q2-icon>\n )}\n {!!name && <div class=\"name\">{name}</div>}\n {!isNaN(value) && <div class=\"value\">{displayValue}</div>}\n </TagName>\n </div>\n );\n }\n\n render() {\n return (\n <click-elsewhere onChange={this.onClickElsewhere}>\n <figure>\n <div class=\"container\">\n <div\n ref={el => (this.chartContainer = el)}\n aria-describedby={!this.isClickable ? 'center-card-description' : undefined}\n class=\"chart-container\"\n role=\"img\"\n test-id=\"chartContainer\"\n onClick={this.onContainerClick}\n tabIndex={!this.isClickable ? 0 : undefined}\n onKeyDown={!this.isClickable ? this.onButtonKeyDown : undefined}\n ></div>\n {this.renderCenterBlock()}\n </div>\n {this.showLegend && (\n <figcaption>\n <q2-legend\n class=\"legend\"\n data={this.legendData}\n format={this.format}\n hoveredItemId={this.legendHoveredId}\n onClick={this.onLegendClick}\n onMouseleave={this.onLegendMouseleave}\n onMouseenter={this.onLegendMouseenter}\n selectedItemId={this.selectedId}\n />\n </figcaption>\n )}\n </figure>\n </click-elsewhere>\n );\n }\n\n // #endregion\n}\n"]}

package/dist/collection/components/q2-checkbox/q2-checkbox.css CHANGED Viewed

@@ -333,7 +333,10 @@ label {
 .checked-fill {
   stroke-dasharray: 16;
   stroke-dashoffset: 16;
-  animation: draw-checkmark 350ms ease-out forwards;
+  animation-name: draw-checkmark;
+  animation-duration: var(--tct-checkbox-animation-duration, var(--t-tween-time-in-4, 300ms));
+  animation-timing-function: var(--tct-checkbox-animation-timing-function, ease-out);
+  animation-fill-mode: var(--tct-checkbox-animation-fill-mode, forwards);
 }
 @keyframes draw-checkmark {

package/dist/collection/components/q2-checkbox/q2-checkbox.js CHANGED Viewed

@@ -1,6 +1,11 @@
 import { h } from "@stencil/core";
 import { createGuid, handleAriaLabel, isEventFromElement, loc, overrideFocus } from "../../utils/index";
 import mirrorEmit from "../../utils/mirror-emit";
+/**
+ * @name Checkbox
+ * @category Forms
+ * @summary Use as a single binary choice; nest within a Checkbox Group for grouped selection.
+ */
 export class Q2Checkbox {
     constructor() {
         // #region Own Properties
@@ -52,6 +57,16 @@ export class Q2Checkbox {
     }
     // #endregion
     // #region Local Methods
+    get composedAriaLabel() {
+        const baseText = loc(this.label) || undefined;
+        if (!this._tooltip && !baseText)
+            return undefined;
+        if (!this._tooltip)
+            return baseText;
+        if (!baseText)
+            return this._tooltip;
+        return `${baseText} - ${this._tooltip}`;
+    }
     handleChangeEvent(event) {
         if (this.readonly ||
             this.disabled ||
@@ -87,7 +102,7 @@ export class Q2Checkbox {
         const textLabelClasses = ['label-text'];
         if (this.hideLabel)
             textLabelClasses.push('sr');
-        return (h("div", { key: '04ba9035e03440f96bb35a8eda9bb57d46c07c62', class: "container" }, h("input", { key: 'a5c5db3372642e840e43f6b267cea089125773ae', ref: el => (this.inputElement = el), "aria-describedby": this.description ? 'description' : undefined, "aria-invalid": this.hasError === undefined ? undefined : `${this.hasError}`, checked: this.indeterminate || this.checked || false, class: "sr", disabled: !!this.disabled || !!this.groupDisabled, id: this._id, name: this.name || this._id, onClick: this.onInputClick, "test-id": "q2CheckboxInnerCheckBox", type: "checkbox", value: this.value }), h("label", { key: '4f6495d8d611d18b532b823b720b710a5982759e', htmlFor: this._id, class: "label-control", "test-id": "checkboxButton", "aria-label": loc(this.label) }, this.renderCheckboxSVG()), h("div", { key: '32b56050a1996f056e46f43af0b2cbfb4a0f4cde', class: textLabelClasses.join(' ') }, h("label", { key: 'c0cebbc6401cb0d1dd0942ce4be82e5123c0cb67', "test-id": "checkboxLabel", htmlFor: this._id, "aria-hidden": "true" }, h("div", { key: '9eee221501a92d08d25d32fa17ecc42271600eba', class: "label-content" }, loc(this.label), h("slot", { key: '52702ce552aaf01f117014288935f9d4e07a627b' })))), this.description && (h("div", { key: 'fdd50b72e7e48566ef034f288773fe7bc5cc0790', class: "description-text", "test-id": "checkboxDescription", id: "description" }, loc(this.description)))));
+        return (h("div", { key: 'ef32fc123a8e6205ae9821781d4a74391d68761e', class: "container" }, h("input", { key: '4d2e8c0e0a938a27a7252479ed462f14c286363e', ref: el => (this.inputElement = el), "aria-describedby": this.description ? 'description' : undefined, "aria-invalid": this.hasError === undefined ? undefined : `${this.hasError}`, checked: this.indeterminate || this.checked || false, class: "sr", disabled: !!this.disabled || !!this.groupDisabled, id: this._id, name: this.name || this._id, onClick: this.onInputClick, "test-id": "q2CheckboxInnerCheckBox", type: "checkbox", value: this.value }), h("label", { key: '79b3f172df48a414ee1d612d73f1c3cbb89c6cc6', htmlFor: this._id, class: "label-control", "test-id": "checkboxButton", "aria-label": this.composedAriaLabel }, this.renderCheckboxSVG()), h("div", { key: '16ed427817793e7660fc6912cef776c1e3428468', class: textLabelClasses.join(' ') }, h("label", { key: 'cc58ac3186fc7052f11dafd92dc50837ebdf729d', "test-id": "checkboxLabel", htmlFor: this._id, "aria-hidden": "true" }, h("div", { key: '62bf345f92850ea1e4e9f8dae1e88c739ef71a91', class: "label-content" }, loc(this.label), h("slot", { key: 'c334401be83f977cd1b53ddf5b64182d528c1106' })))), this.description && (h("div", { key: '2b71f3fb0ce8d4990319bc89a4b924ff4dd75018', class: "description-text", "test-id": "checkboxDescription", id: "description" }, loc(this.description)))));
     }
     static get is() { return "q2-checkbox"; }
     static get encapsulation() { return "shadow"; }
@@ -103,6 +118,28 @@ export class Q2Checkbox {
     }
     static get properties() {
         return {
+            "_tooltip": {
+                "type": "string",
+                "attribute": "_tooltip",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "private",
+                            "text": "Tooltip text set by a parent q2-tooltip component for accessibility."
+                        }],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
             "alignment": {
                 "type": "string",
                 "attribute": "alignment",

package/dist/collection/components/q2-checkbox/q2-checkbox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"q2-checkbox.js","sourceRoot":"","sources":["../../../../src/components/q2-checkbox/q2-checkbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, ComponentInterface, Prop, Element, Listen, Watch, Event, EventEmitter, h } from '@stencil/core';\nimport { createGuid, handleAriaLabel, isEventFromElement, loc, overrideFocus } from 'src/utils';\nimport mirrorEmit from '@/utils/mirror-emit';\n\n@Component({ tag: 'q2-checkbox', shadow: true, styleUrl: 'q2-checkbox.scss' })\nexport class Q2Checkbox implements ComponentInterface {\n // #region Own Properties\n\n _id: string = `checkbox-${createGuid()}`;\n inputElement: HTMLInputElement;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region Public Property API\n\n /** Determine which side of the label the checkbox will render on. /\n @Prop({ reflect: true })\n alignment: string;\n\n /* @deprecated /\n @Prop({ reflect: true, mutable: true })\n ariaLabel: string;\n\n /* The state of the checkbox. This modifies the visual appearance of the element. /\n @Prop({ reflect: true, mutable: true })\n checked: boolean = false;\n\n /\n Populates a description that is displayed beneath the label.\n * @localizable\n /\n @Prop({ reflect: true })\n description: string;\n\n /* Disables the checkbox and prevents interaction. /\n @Prop({ reflect: true })\n disabled: boolean;\n\n /\n Used by q2-checkbox-group to disable all checkboxes in the group\n * @private\n /\n @Prop({ reflect: true })\n groupDisabled: boolean;\n\n /* Determines if the component should display in an errant state. /\n @Prop({ reflect: true })\n hasError: boolean = false;\n\n /\n Hide's the field's `<label>` element from view.\n \n @warning\n * Only use when a visible label is impractical.\n /\n @Prop({ reflect: true, mutable: true })\n hideLabel: boolean;\n\n /\n Used on a parent checkbox in a checkbox group (e.g. \"Select All\") to indicate that some, but not all, checkboxes in a group are checked.\n \n When `true`, the \"indeterminate\" selection style is applied.\n * To apply the standard \"checked\" selection style, `checked` must be true, and `indeterminate` must be `false`.\n /\n @Prop({ reflect: true })\n indeterminate: boolean;\n\n /\n The visible label text for the checkbox. Appears to the right of the box for 'default' and 'favorite' checkboxes, and to the left for 'toggle' checkboxes.\n * Yielded content will be adjacent to this text.\n * @localizable\n /\n @Prop({ reflect: true, mutable: true })\n label: string;\n\n /* A static string used to establish a symbolic relationship between checkboxes. /\n @Prop({ reflect: true })\n name: string;\n\n /* The field is not interactive, but remains focusable. /\n @Prop({ reflect: true })\n readonly: boolean;\n\n /* The field is not interactive, but remains focusable. /\n @Prop({ reflect: true })\n slotReadonly: boolean;\n\n /* The visual style of the checkbox. This does not need to be defined for a standard checkbox. /\n @Prop({ reflect: true })\n type: 'favorite' \| 'toggle';\n\n /* A static reference value for the checkbox. /\n @Prop({ reflect: true })\n value: string;\n\n // #endregion\n // #region Events\n\n /\n Emitted when the checkbox is toggled.\n * @deprecated Use 'tctChange' instead\n * @legacyEvent\n /\n @Event()\n change: EventEmitter<{ value: string; checked: boolean }>;\n\n /\n Emitted when the checkbox is toggled.\n * @legacyEvent\n /\n @Event()\n tctChange: EventEmitter<{ value: string; checked: boolean }>;\n\n // #endregion\n // #region Component Lifecycle Events\n\n componentWillLoad() {\n handleAriaLabel(this);\n }\n\n componentDidLoad(): void {\n overrideFocus(this.hostElement);\n this.hostElement.click = () => this.inputElement.click();\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('change')\n defaultChangeHandler(event: CustomEvent) {\n // We use setTimeout to give an opportunity to call preventDefault\n setTimeout(() => this.handleChangeEvent(event), 0);\n }\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n if (!isEventFromElement(event, this.hostElement)) return;\n this.hostElement.shadowRoot.querySelector('input').focus();\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('ariaLabel')\n ariaLabelObserver() {\n handleAriaLabel(this);\n }\n\n // #endregion\n // #region Local Methods\n\n handleChangeEvent(event: CustomEvent<{ checked: boolean; value: string }>) {\n if (\n this.readonly \|\|\n this.disabled \|\|\n this.hostElement.onchange \|\|\n event.defaultPrevented \|\|\n event.target !== this.hostElement \|\|\n !event.detail\n ) {\n return;\n }\n this.checked = event.detail.checked;\n }\n\n onInputClick = (event: Event) => {\n event.stopPropagation();\n event.preventDefault();\n\n const isNotInteractive = this.disabled \|\| this.readonly \|\| this.slotReadonly;\n if (isNotInteractive) return;\n if (!(event.target instanceof HTMLInputElement)) return;\n const { value, checked } = event.target;\n\n mirrorEmit(this, ['change', 'tctChange'], {\n value,\n checked,\n });\n this.inputElement.focus();\n };\n\n // #endregion\n // #region Render Methods\n\n renderCheckboxSVG() {\n if (this.type === 'favorite') {\n return (\n <q2-icon\n type=\"star\"\n class=\"checkbox-icon\"\n />\n );\n }\n\n if (this.type === 'toggle') {\n return this.renderToggleSVG();\n }\n\n return (\n <svg\n aria-hidden=\"true\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n class=\"checkbox-icon\"\n focusable=\"false\"\n >\n <rect\n x=\"1\"\n y=\"1\"\n width=\"18\"\n height=\"18\"\n rx=\"3\"\n />\n {(this.checked \|\| this.indeterminate) && this.renderCheckBoxSVGFill()}\n </svg>\n );\n }\n\n renderCheckBoxSVGFill() {\n if (this.indeterminate) {\n return (\n <line\n class=\"checkbox-fill indeterminate-fill\"\n x1=\"4\"\n y1=\"10\"\n x2=\"16\"\n y2=\"10\"\n />\n );\n }\n return (\n <polyline\n class=\"checkbox-fill checked-fill\"\n points=\"5 11 8.5 14.5 15 6\"\n key={`checkmark-${this.checked}`}\n />\n );\n }\n\n renderToggleSVG() {\n return (\n <div class=\"toggle-svg-container\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n viewBox=\"0 0 38 24\"\n class=\"toggle-track\"\n test-id=\"toggleTrack\"\n >\n <rect\n width=\"38\"\n height=\"24\"\n rx=\"12\"\n ></rect>\n </svg>\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n viewBox=\"0 0 18 18\"\n class=\"toggle-indicator\"\n test-id=\"toggleIndicator\"\n >\n <defs>\n {/ Mask for the X icon /}\n <mask\n id=\"xMask\"\n maskUnits=\"userSpaceOnUse\"\n >\n <rect\n width=\"18\"\n height=\"18\"\n fill=\"white\"\n ></rect>\n <line\n class=\"toggle-icon\"\n x1=\"6.5\"\n y1=\"6.5\"\n x2=\"11.5\"\n y2=\"11.5\"\n stroke=\"black\"\n stroke-width=\"2\"\n ></line>\n <line\n class=\"toggle-icon\"\n x1=\"6.5\"\n y1=\"11.5\"\n x2=\"11.5\"\n y2=\"6.5\"\n stroke=\"black\"\n stroke-width=\"2\"\n ></line>\n </mask>\n {/ Mask for the checkmark icon */}\n <mask id=\"checkMask\">\n <rect\n width=\"18\"\n height=\"18\"\n fill=\"white\"\n />\n <polyline\n class=\"toggle-icon\"\n points=\"6,8.5 8.5,11 12.5,6.5\"\n fill=\"none\"\n />\n </mask>\n </defs>\n <circle\n class=\"toggle-circle\"\n cx=\"9\"\n cy=\"9\"\n r=\"9\"\n mask=\"url(#xMask)\"\n ></circle>\n </svg>\n </div>\n );\n }\n\n render() {\n const textLabelClasses = ['label-text'];\n if (this.hideLabel) textLabelClasses.push('sr');\n return (\n <div class=\"container\">\n <input\n ref={el => (this.inputElement = el)}\n aria-describedby={this.description ? 'description' : undefined}\n aria-invalid={this.hasError === undefined ? undefined : `${this.hasError}`}\n checked={this.indeterminate \|\| this.checked \|\| false}\n class=\"sr\"\n disabled={!!this.disabled \|\| !!this.groupDisabled}\n id={this._id}\n name={this.name \|\| this._id}\n onClick={this.onInputClick}\n test-id=\"q2CheckboxInnerCheckBox\"\n type=\"checkbox\"\n value={this.value}\n />\n <label\n htmlFor={this._id}\n class=\"label-control\"\n test-id=\"checkboxButton\"\n aria-label={loc(this.label)}\n >\n {this.renderCheckboxSVG()}\n </label>\n <div class={textLabelClasses.join(' ')}>\n <label\n test-id=\"checkboxLabel\"\n htmlFor={this._id}\n aria-hidden=\"true\"\n >\n <div class=\"label-content\">\n {loc(this.label)}\n <slot />\n </div>\n </label>\n </div>\n {this.description && (\n <div\n class=\"description-text\"\n test-id=\"checkboxDescription\"\n id=\"description\"\n >\n {loc(this.description)}\n </div>\n )}\n </div>\n );\n }\n\n // #endregion\n}\n"]}
1	+ {"version":3,"file":"q2-checkbox.js","sourceRoot":"","sources":["../../../../src/components/q2-checkbox/q2-checkbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, ComponentInterface, Prop, Element, Listen, Watch, Event, EventEmitter, h } from '@stencil/core';\nimport { createGuid, handleAriaLabel, isEventFromElement, loc, overrideFocus } from 'src/utils';\nimport mirrorEmit from '@/utils/mirror-emit';\n\n/*\n @name Checkbox\n * @category Forms\n * @summary Use as a single binary choice; nest within a Checkbox Group for grouped selection.\n /\n@Component({ tag: 'q2-checkbox', shadow: true, styleUrl: 'q2-checkbox.scss' })\nexport class Q2Checkbox implements ComponentInterface {\n // #region Own Properties\n\n _id: string = `checkbox-${createGuid()}`;\n inputElement: HTMLInputElement;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region Public Property API\n\n /\n @private\n * Tooltip text set by a parent q2-tooltip component for accessibility.\n /\n @Prop()\n _tooltip: string;\n\n /* Determine which side of the label the checkbox will render on. /\n @Prop({ reflect: true })\n alignment: string;\n\n /* @deprecated /\n @Prop({ reflect: true, mutable: true })\n ariaLabel: string;\n\n /* The state of the checkbox. This modifies the visual appearance of the element. /\n @Prop({ reflect: true, mutable: true })\n checked: boolean = false;\n\n /\n Populates a description that is displayed beneath the label.\n * @localizable\n /\n @Prop({ reflect: true })\n description: string;\n\n /* Disables the checkbox and prevents interaction. /\n @Prop({ reflect: true })\n disabled: boolean;\n\n /\n Used by q2-checkbox-group to disable all checkboxes in the group\n * @private\n /\n @Prop({ reflect: true })\n groupDisabled: boolean;\n\n /* Determines if the component should display in an errant state. /\n @Prop({ reflect: true })\n hasError: boolean = false;\n\n /\n Hide's the field's `<label>` element from view.\n \n @warning\n * Only use when a visible label is impractical.\n /\n @Prop({ reflect: true, mutable: true })\n hideLabel: boolean;\n\n /\n Used on a parent checkbox in a checkbox group (e.g. \"Select All\") to indicate that some, but not all, checkboxes in a group are checked.\n \n When `true`, the \"indeterminate\" selection style is applied.\n * To apply the standard \"checked\" selection style, `checked` must be true, and `indeterminate` must be `false`.\n /\n @Prop({ reflect: true })\n indeterminate: boolean;\n\n /\n The visible label text for the checkbox. Appears to the right of the box for 'default' and 'favorite' checkboxes, and to the left for 'toggle' checkboxes.\n * Yielded content will be adjacent to this text.\n * @localizable\n /\n @Prop({ reflect: true, mutable: true })\n label: string;\n\n /* A static string used to establish a symbolic relationship between checkboxes. /\n @Prop({ reflect: true })\n name: string;\n\n /* The field is not interactive, but remains focusable. /\n @Prop({ reflect: true })\n readonly: boolean;\n\n /* The field is not interactive, but remains focusable. /\n @Prop({ reflect: true })\n slotReadonly: boolean;\n\n /* The visual style of the checkbox. This does not need to be defined for a standard checkbox. /\n @Prop({ reflect: true })\n type: 'favorite' \| 'toggle';\n\n /* A static reference value for the checkbox. /\n @Prop({ reflect: true })\n value: string;\n\n // #endregion\n // #region Events\n\n /\n Emitted when the checkbox is toggled.\n * @deprecated Use 'tctChange' instead\n * @legacyEvent\n /\n @Event()\n change: EventEmitter<{ value: string; checked: boolean }>;\n\n /\n Emitted when the checkbox is toggled.\n * @legacyEvent\n /\n @Event()\n tctChange: EventEmitter<{ value: string; checked: boolean }>;\n\n // #endregion\n // #region Component Lifecycle Events\n\n componentWillLoad() {\n handleAriaLabel(this);\n }\n\n componentDidLoad(): void {\n overrideFocus(this.hostElement);\n this.hostElement.click = () => this.inputElement.click();\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('change')\n defaultChangeHandler(event: CustomEvent) {\n // We use setTimeout to give an opportunity to call preventDefault\n setTimeout(() => this.handleChangeEvent(event), 0);\n }\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n if (!isEventFromElement(event, this.hostElement)) return;\n this.hostElement.shadowRoot.querySelector('input').focus();\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('ariaLabel')\n ariaLabelObserver() {\n handleAriaLabel(this);\n }\n\n // #endregion\n // #region Local Methods\n\n get composedAriaLabel(): string \| undefined {\n const baseText = loc(this.label) \|\| undefined;\n if (!this._tooltip && !baseText) return undefined;\n if (!this._tooltip) return baseText;\n if (!baseText) return this._tooltip;\n return `${baseText} - ${this._tooltip}`;\n }\n\n handleChangeEvent(event: CustomEvent<{ checked: boolean; value: string }>) {\n if (\n this.readonly \|\|\n this.disabled \|\|\n this.hostElement.onchange \|\|\n event.defaultPrevented \|\|\n event.target !== this.hostElement \|\|\n !event.detail\n ) {\n return;\n }\n this.checked = event.detail.checked;\n }\n\n onInputClick = (event: Event) => {\n event.stopPropagation();\n event.preventDefault();\n\n const isNotInteractive = this.disabled \|\| this.readonly \|\| this.slotReadonly;\n if (isNotInteractive) return;\n if (!(event.target instanceof HTMLInputElement)) return;\n const { value, checked } = event.target;\n\n mirrorEmit(this, ['change', 'tctChange'], {\n value,\n checked,\n });\n this.inputElement.focus();\n };\n\n // #endregion\n // #region Render Methods\n\n renderCheckboxSVG() {\n if (this.type === 'favorite') {\n return (\n <q2-icon\n type=\"star\"\n class=\"checkbox-icon\"\n />\n );\n }\n\n if (this.type === 'toggle') {\n return this.renderToggleSVG();\n }\n\n return (\n <svg\n aria-hidden=\"true\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n class=\"checkbox-icon\"\n focusable=\"false\"\n >\n <rect\n x=\"1\"\n y=\"1\"\n width=\"18\"\n height=\"18\"\n rx=\"3\"\n />\n {(this.checked \|\| this.indeterminate) && this.renderCheckBoxSVGFill()}\n </svg>\n );\n }\n\n renderCheckBoxSVGFill() {\n if (this.indeterminate) {\n return (\n <line\n class=\"checkbox-fill indeterminate-fill\"\n x1=\"4\"\n y1=\"10\"\n x2=\"16\"\n y2=\"10\"\n />\n );\n }\n return (\n <polyline\n class=\"checkbox-fill checked-fill\"\n points=\"5 11 8.5 14.5 15 6\"\n key={`checkmark-${this.checked}`}\n />\n );\n }\n\n renderToggleSVG() {\n return (\n <div class=\"toggle-svg-container\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n viewBox=\"0 0 38 24\"\n class=\"toggle-track\"\n test-id=\"toggleTrack\"\n >\n <rect\n width=\"38\"\n height=\"24\"\n rx=\"12\"\n ></rect>\n </svg>\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n viewBox=\"0 0 18 18\"\n class=\"toggle-indicator\"\n test-id=\"toggleIndicator\"\n >\n <defs>\n {/ Mask for the X icon /}\n <mask\n id=\"xMask\"\n maskUnits=\"userSpaceOnUse\"\n >\n <rect\n width=\"18\"\n height=\"18\"\n fill=\"white\"\n ></rect>\n <line\n class=\"toggle-icon\"\n x1=\"6.5\"\n y1=\"6.5\"\n x2=\"11.5\"\n y2=\"11.5\"\n stroke=\"black\"\n stroke-width=\"2\"\n ></line>\n <line\n class=\"toggle-icon\"\n x1=\"6.5\"\n y1=\"11.5\"\n x2=\"11.5\"\n y2=\"6.5\"\n stroke=\"black\"\n stroke-width=\"2\"\n ></line>\n </mask>\n {/ Mask for the checkmark icon */}\n <mask id=\"checkMask\">\n <rect\n width=\"18\"\n height=\"18\"\n fill=\"white\"\n />\n <polyline\n class=\"toggle-icon\"\n points=\"6,8.5 8.5,11 12.5,6.5\"\n fill=\"none\"\n />\n </mask>\n </defs>\n <circle\n class=\"toggle-circle\"\n cx=\"9\"\n cy=\"9\"\n r=\"9\"\n mask=\"url(#xMask)\"\n ></circle>\n </svg>\n </div>\n );\n }\n\n render() {\n const textLabelClasses = ['label-text'];\n if (this.hideLabel) textLabelClasses.push('sr');\n return (\n <div class=\"container\">\n <input\n ref={el => (this.inputElement = el)}\n aria-describedby={this.description ? 'description' : undefined}\n aria-invalid={this.hasError === undefined ? undefined : `${this.hasError}`}\n checked={this.indeterminate \|\| this.checked \|\| false}\n class=\"sr\"\n disabled={!!this.disabled \|\| !!this.groupDisabled}\n id={this._id}\n name={this.name \|\| this._id}\n onClick={this.onInputClick}\n test-id=\"q2CheckboxInnerCheckBox\"\n type=\"checkbox\"\n value={this.value}\n />\n <label\n htmlFor={this._id}\n class=\"label-control\"\n test-id=\"checkboxButton\"\n aria-label={this.composedAriaLabel}\n >\n {this.renderCheckboxSVG()}\n </label>\n <div class={textLabelClasses.join(' ')}>\n <label\n test-id=\"checkboxLabel\"\n htmlFor={this._id}\n aria-hidden=\"true\"\n >\n <div class=\"label-content\">\n {loc(this.label)}\n <slot />\n </div>\n </label>\n </div>\n {this.description && (\n <div\n class=\"description-text\"\n test-id=\"checkboxDescription\"\n id=\"description\"\n >\n {loc(this.description)}\n </div>\n )}\n </div>\n );\n }\n\n // #endregion\n}\n"]}

package/dist/collection/components/q2-checkbox-group/q2-checkbox-group.css CHANGED Viewed

@@ -113,7 +113,7 @@ legend.sr-only {
   --comp-default-container-margin: var(--app-scale-1x, 5px) 0;
   margin: var(--tct-checkbox-group-container-margin, var(--comp-default-container-margin));
   padding: var(--tct-checkbox-group-container-padding, var(--app-scale-1x, 5px));
-  border-width: 1px;
+  border-width: var(--tct-checkbox-group-border-width, 1px);
   border-color: transparent;
   border-style: solid;
   border-radius: var(--tct-checkbox-group-border-radius, var(--app-border-radius-1, 4px));

package/dist/collection/components/q2-context/q2-context.js CHANGED Viewed

@@ -129,7 +129,7 @@ export class Q2Context {
     // #endregion
     // #region Render Methods
     render() {
-        return (h("div", { key: 'dcb214bdc4218eec7b88966744a27db99ce12ed4', class: "context-wrapper" }, h("q2-item", { key: 'e946e126d9d0e6680d8ace8d708738cbd6f96514', class: "context-item" }, this.hasDecoratorSlotContent && (h("slot", { key: '0b6b468dc64c7652800245881cfab110a126777f', name: "decorator", slot: "decorator" })), h("div", { key: '1ba33f0bca6ce07a6beb0eaaa2133b7dd37b89d4', class: "context-body", slot: "body" }, h("slot", { key: '611090b36432885c918f3a267a85e54e60526aea', name: "header" }), h("slot", { key: 'a98908f8ebce24c9faff28c5ac4bb8f2e00efb94', name: "description" })), this.hasAffordanceSlotContent && (h("slot", { key: '0fca02b51d6ccdd3129bd6800a77af4f137929be', name: "affordance", slot: "action" }))), this.separator && (h("div", { key: 'b794e4969420268c9017775b608a3471c777bd02', class: "separator", role: "separator" })), this.hasActionGroupSlotContent && (h("q2-action-group", { key: '3bc5c17a1abfa854bb8320f36106ae13fcf5af52', class: "action-group", orientation: "horizontal" }, h("slot", { key: 'f81004eb46ffec16a24fb35880c53e0c88354c0a', name: "action-group" }))), this.hasFooterSlotContent && h("slot", { key: '0f3440ef96c901203845b07e9774842c1341795e', name: "footer" })));
+        return (h("div", { key: 'a27dbbacf5ed1c7dc15b518dc3fee0335d97926b', class: "context-wrapper" }, h("q2-item", { key: 'bc9e829de88f274ec0532377b4bdd84032cef8b3', class: "context-item" }, this.hasDecoratorSlotContent && (h("slot", { key: '084d99e60dd4dec06cc1beb81efbbfc7fb2663a9', name: "decorator", slot: "decorator" })), h("div", { key: '53c7bd5e403b7442d10fc3bcad8cd7e491eb8fec', class: "context-body", slot: "body" }, h("slot", { key: '60767e189adb1c4140b56611f9bd933fcce0826a', name: "header" }), h("slot", { key: '2013b5f196bcc17fefda3b043055ad665c6d583f', name: "description" })), this.hasAffordanceSlotContent && (h("slot", { key: 'c3bd6b034484513b78a6c624fa475becf93db41c', name: "affordance", slot: "action" }))), this.separator && (h("div", { key: '6b701240841e7410c8073b4f4ec80f1de2d00233', class: "separator", role: "separator" })), this.hasActionGroupSlotContent && (h("q2-action-group", { key: '5a7bdc0302a884d05099b3085ef62f8bf261ea48', class: "action-group", orientation: "horizontal" }, h("slot", { key: '2c9a6533e01e2d54d4fb423098e03d38eb330787', name: "action-group" }))), this.hasFooterSlotContent && h("slot", { key: 'b1742a26d9b0ff89e9049af8d82872044d219352', name: "footer" })));
     }
     static get is() { return "q2-context"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/q2-currency/q2-currency.js CHANGED Viewed

@@ -141,7 +141,7 @@ export class Q2Currency {
     // #region Render Methods
     render() {
         const { hasPlusMinusSign, plusMinusSign, currencyIsFront, currencySymbol, shouldSuperscriptSymbol, amountCore, fraction, shouldSuperscriptFraction, readableCurrency, currencyClasses, signDisplay, isNegativeAmount, } = this;
-        return (h("div", { key: '494d9bb9173565657072ea28f85ac06b96af688c', "test-id": "q2CurrencyInner", class: currencyClasses, "aria-label": readableCurrency }, signDisplay === 'accounting' && isNegativeAmount && h("span", { key: 'e6e9e0022045d72b0d9bc769a6a4a7ae07c43b98' }, '('), hasPlusMinusSign && h("span", { key: '510068ff9c4a32d9654fdb4244daca8bd7112e9c' }, plusMinusSign), currencyIsFront && h("span", { key: '13a8d738c41ca025a8f9e2a870de09aef1557489', class: shouldSuperscriptSymbol ? 'superscript' : '' }, currencySymbol), h("span", { key: '19a55f61b827ac4c2c1d78a18fb38b151fe4ffde' }, amountCore), h("span", { key: '42ed5a37619f6da94c7064d5cd4fdb6a96b207cc', class: shouldSuperscriptFraction ? 'superscript' : '' }, fraction), !currencyIsFront && h("span", { key: '651626123c67240295e4305559200ffcff898b7c', class: shouldSuperscriptSymbol ? 'superscript' : '' }, currencySymbol), signDisplay === 'accounting' && isNegativeAmount && h("span", { key: '679b45cb9523de513fd332f4a9ee93c49508ff4a' }, ')')));
+        return (h("div", { key: 'e88c26d1d9cc2bbb390ca8d6957fdaa693df2b4f', "test-id": "q2CurrencyInner", class: currencyClasses, "aria-label": readableCurrency }, signDisplay === 'accounting' && isNegativeAmount && h("span", { key: '208cf499f136d6b865467e0de0583cc3fa171974' }, '('), hasPlusMinusSign && h("span", { key: 'be464d5fa79b176e2745170b99e551fcaafeea47' }, plusMinusSign), currencyIsFront && h("span", { key: '26c9df2005a3e007bdc89ae539e4afcd1f204e00', class: shouldSuperscriptSymbol ? 'superscript' : '' }, currencySymbol), h("span", { key: 'b2a2fe99142fdea724ea5e868d164df4fdf93f14' }, amountCore), h("span", { key: '62bd1da9c76dd2eedd3bd596d2d60224f9e5ee27', class: shouldSuperscriptFraction ? 'superscript' : '' }, fraction), !currencyIsFront && h("span", { key: '5c6962251aa47a06b19978b9328484fcf34ab944', class: shouldSuperscriptSymbol ? 'superscript' : '' }, currencySymbol), signDisplay === 'accounting' && isNegativeAmount && h("span", { key: '2b4742aede9c30f2657f7f447258b2574bc20668' }, ')')));
     }
     static get is() { return "q2-currency"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/q2-data-table/q2-data-table.css CHANGED Viewed

@@ -309,4 +309,18 @@ caption {
 q2-checkbox {
   padding: 0;
+}
+.tag-table {
+  display: flex;
+  justify-content: center;
+  flex-wrap: wrap;
+  row-gap: var(--app-scale-2x);
+  column-gap: var(--app-scale-2x);
+}
+.tag-table q2-tag {
+  --tct-tag-font-size: var(--app-font-size, 14px);
+  --tct-tag-padding-inline: var(--app-scale-2x, 10px);
+  --tct-tag-height: var(--app-scale-4x, 20px);
+  --tct-tag-margin: 0;
 }