q2-tecton-elements 1.63.2 → 1.64.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/bundle-report.json +2382 -3464
- package/dist/cjs/action-sheet-D3n8vaeA.js.map +1 -1
- package/dist/cjs/index-CyqXtdz-.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/q2-action-group_2.cjs.entry.js +1 -1
- package/dist/cjs/q2-action-sheet.cjs.entry.js +1 -1
- package/dist/cjs/q2-action-sheet.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-action-sheet.entry.cjs.js.map +1 -1
- package/dist/cjs/q2-avatar.cjs.entry.js +4 -2
- package/dist/cjs/q2-avatar.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-avatar.entry.cjs.js.map +1 -1
- package/dist/cjs/q2-btn.q2-loading.entry.cjs.js.map +1 -1
- package/dist/cjs/q2-btn_2.cjs.entry.js +2 -2
- package/dist/cjs/q2-btn_2.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-card.cjs.entry.js +5 -5
- package/dist/cjs/q2-card.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-card.entry.cjs.js.map +1 -1
- package/dist/cjs/q2-chart-area.cjs.entry.js +1 -1
- package/dist/cjs/q2-chart-area.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-chart-area.entry.cjs.js.map +1 -1
- package/dist/cjs/q2-chart-bar.cjs.entry.js +1 -1
- package/dist/cjs/q2-chart-bar.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-chart-bar.entry.cjs.js.map +1 -1
- package/dist/cjs/q2-chart-donut.cjs.entry.js +5 -5
- package/dist/cjs/q2-chart-donut.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-chart-donut.entry.cjs.js.map +1 -1
- package/dist/cjs/q2-checkbox.cjs.entry.js +1 -1
- package/dist/cjs/q2-checkbox.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-checkbox.entry.cjs.js.map +1 -1
- package/dist/cjs/q2-data-table.cjs.entry.js +15 -10
- package/dist/cjs/q2-data-table.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-data-table.entry.cjs.js.map +1 -1
- package/dist/cjs/q2-dropdown-item.cjs.entry.js +3 -3
- package/dist/cjs/q2-dropdown-item.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-dropdown-item.entry.cjs.js.map +1 -1
- package/dist/cjs/q2-dropdown.cjs.entry.js +1 -1
- package/dist/cjs/q2-dropdown.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-dropdown.entry.cjs.js.map +1 -1
- package/dist/cjs/q2-file-picker.cjs.entry.js +24 -17
- package/dist/cjs/q2-file-picker.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-file-picker.entry.cjs.js.map +1 -1
- package/dist/cjs/q2-formatted-text.cjs.entry.js +7 -7
- package/dist/cjs/q2-formatted-text.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-formatted-text.entry.cjs.js.map +1 -1
- package/dist/cjs/q2-icon.cjs.entry.js +1 -0
- package/dist/cjs/q2-icon.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-icon.entry.cjs.js.map +1 -1
- package/dist/cjs/q2-input.cjs.entry.js +8 -8
- package/dist/cjs/q2-input.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-input.entry.cjs.js.map +1 -1
- package/dist/cjs/q2-legend.cjs.entry.js +1 -1
- package/dist/cjs/q2-legend.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-legend.entry.cjs.js.map +1 -1
- package/dist/cjs/q2-link.q2-list.entry.cjs.js.map +1 -1
- package/dist/cjs/q2-link_2.cjs.entry.js +1 -1
- package/dist/cjs/q2-link_2.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-modal.cjs.entry.js +1 -1
- package/dist/cjs/q2-modal.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-modal.entry.cjs.js.map +1 -1
- package/dist/cjs/q2-mutation-observer.cjs.entry.js +106 -0
- package/dist/cjs/q2-mutation-observer.cjs.entry.js.map +1 -0
- package/dist/cjs/q2-mutation-observer.entry.cjs.js.map +1 -0
- package/dist/cjs/q2-optgroup.cjs.entry.js +1 -1
- package/dist/cjs/q2-pagination.cjs.entry.js +25 -5
- package/dist/cjs/q2-pagination.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-pagination.entry.cjs.js.map +1 -1
- package/dist/cjs/q2-pill.cjs.entry.js +1 -1
- package/dist/cjs/q2-relative-time.cjs.entry.js +1 -1
- package/dist/cjs/q2-section-container.cjs.entry.js +102 -0
- package/dist/cjs/q2-section-container.cjs.entry.js.map +1 -0
- package/dist/cjs/q2-section-container.entry.cjs.js.map +1 -0
- package/dist/cjs/q2-section.cjs.entry.js +2 -2
- package/dist/cjs/q2-stepper-vertical.cjs.entry.js +1 -1
- package/dist/cjs/q2-stepper.cjs.entry.js +1 -1
- package/dist/cjs/q2-tab-container.cjs.entry.js +1 -1
- package/dist/cjs/q2-tab-pane.cjs.entry.js +1 -1
- package/dist/cjs/q2-tag.cjs.entry.js +1 -1
- package/dist/cjs/q2-tecton-elements.cjs.js +1 -1
- package/dist/cjs/q2-textarea.cjs.entry.js +1 -1
- package/dist/cjs/q2-textarea.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-textarea.entry.cjs.js.map +1 -1
- package/dist/cjs/tecton-tab-pane.cjs.entry.js +2 -2
- package/dist/collection/collection-manifest.json +2 -0
- package/dist/collection/components/q2-action-sheet/q2-action-sheet.js +7 -7
- package/dist/collection/components/q2-action-sheet/q2-action-sheet.js.map +1 -1
- package/dist/collection/components/q2-avatar/q2-avatar.css +69 -13
- package/dist/collection/components/q2-avatar/q2-avatar.js +23 -1
- package/dist/collection/components/q2-avatar/q2-avatar.js.map +1 -1
- package/dist/collection/components/q2-card/q2-card.js +5 -5
- package/dist/collection/components/q2-card/q2-card.js.map +1 -1
- package/dist/collection/components/q2-chart-area/q2-chart-area.js +1 -1
- package/dist/collection/components/q2-chart-area/q2-chart-area.js.map +1 -1
- package/dist/collection/components/q2-chart-bar/q2-chart-bar.js +1 -1
- package/dist/collection/components/q2-chart-bar/q2-chart-bar.js.map +1 -1
- package/dist/collection/components/q2-chart-donut/q2-chart-donut.css +17 -8
- package/dist/collection/components/q2-chart-donut/q2-chart-donut.js +4 -4
- package/dist/collection/components/q2-chart-donut/q2-chart-donut.js.map +1 -1
- package/dist/collection/components/q2-checkbox/q2-checkbox.css +14 -2
- package/dist/collection/components/q2-data-table/q2-data-table.css +8 -0
- package/dist/collection/components/q2-data-table/q2-data-table.js +67 -16
- package/dist/collection/components/q2-data-table/q2-data-table.js.map +1 -1
- package/dist/collection/components/q2-dropdown/q2-dropdown.js +1 -1
- package/dist/collection/components/q2-dropdown/q2-dropdown.js.map +1 -1
- package/dist/collection/components/q2-dropdown-item/q2-dropdown-item.css +22 -5
- package/dist/collection/components/q2-dropdown-item/q2-dropdown-item.js +2 -2
- package/dist/collection/components/q2-dropdown-item/q2-dropdown-item.js.map +1 -1
- package/dist/collection/components/q2-file-picker/q2-file-picker.js +30 -23
- package/dist/collection/components/q2-file-picker/q2-file-picker.js.map +1 -1
- package/dist/collection/components/q2-formatted-text/q2-formatted-text.js +27 -27
- package/dist/collection/components/q2-formatted-text/q2-formatted-text.js.map +1 -1
- package/dist/collection/components/q2-grid/q2-grid.js +30 -30
- package/dist/collection/components/q2-grid-area/q2-grid-area.js +42 -42
- package/dist/collection/components/q2-icon/assets/cards.symbol.svg +1 -2
- package/dist/collection/components/q2-icon/assets/icon-list.json +1 -1
- package/dist/collection/components/q2-icon/assets/icon-map.json +1 -1
- package/dist/collection/components/q2-icon/assets/standard.symbol.svg +1 -1
- package/dist/collection/components/q2-icon/q2-icon-types.js.map +1 -1
- package/dist/collection/components/q2-input/q2-input.js +11 -11
- package/dist/collection/components/q2-input/q2-input.js.map +1 -1
- package/dist/collection/components/q2-legend/q2-legend.js +1 -1
- package/dist/collection/components/q2-legend/q2-legend.js.map +1 -1
- package/dist/collection/components/q2-link/q2-link.js +1 -1
- package/dist/collection/components/q2-link/q2-link.js.map +1 -1
- package/dist/collection/components/q2-loading/q2-loading.css +32 -20
- package/dist/collection/components/q2-loading/q2-loading.js +1 -1
- package/dist/collection/components/q2-loading/q2-loading.js.map +1 -1
- package/dist/collection/components/q2-modal/q2-modal.js +5 -5
- package/dist/collection/components/q2-modal/q2-modal.js.map +1 -1
- package/dist/collection/components/q2-mutation-observer/q2-mutation-observer.js +233 -0
- package/dist/collection/components/q2-mutation-observer/q2-mutation-observer.js.map +1 -0
- package/dist/collection/components/q2-optgroup/q2-optgroup.js +1 -1
- package/dist/collection/components/q2-option-list/q2-option-list.js +4 -4
- package/dist/collection/components/q2-pagination/q2-pagination.js +45 -5
- package/dist/collection/components/q2-pagination/q2-pagination.js.map +1 -1
- package/dist/collection/components/q2-pill/q2-pill.js +1 -1
- package/dist/collection/components/q2-relative-time/q2-relative-time.js +1 -1
- package/dist/collection/components/q2-resize-observer/q2-resize-observer.js +1 -1
- package/dist/collection/components/q2-section/q2-section.js +2 -2
- package/dist/collection/components/q2-section-container/q2-section-container.js +198 -0
- package/dist/collection/components/q2-section-container/q2-section-container.js.map +1 -0
- package/dist/collection/components/q2-stepper/q2-stepper.js +1 -1
- package/dist/collection/components/q2-stepper-pane/q2-stepper-pane.js +2 -2
- package/dist/collection/components/q2-stepper-vertical/q2-stepper-vertical.js +1 -1
- package/dist/collection/components/q2-tab-container/q2-tab-container.js +1 -1
- package/dist/collection/components/q2-tab-pane/q2-tab-pane.js +1 -1
- package/dist/collection/components/q2-tag/q2-tag.js +1 -1
- package/dist/collection/components/q2-textarea/q2-textarea.js +1 -1
- package/dist/collection/components/q2-textarea/q2-textarea.js.map +1 -1
- package/dist/collection/components/tecton-tab-pane/tecton-tab-pane.js +2 -2
- package/dist/collection/utils/action-sheet.js.map +1 -1
- package/dist/collection/utils/helpers.js.map +1 -1
- package/dist/collection/utils/index.js.map +1 -1
- package/dist/components/action-sheet.js.map +1 -1
- package/dist/components/index.js +4 -0
- package/dist/components/index.js.map +1 -1
- package/dist/components/index2.js.map +1 -1
- package/dist/components/q2-action-sheet.js +1 -1
- package/dist/components/q2-action-sheet.js.map +1 -1
- package/dist/components/q2-avatar2.js +5 -2
- package/dist/components/q2-avatar2.js.map +1 -1
- package/dist/components/q2-card.js +5 -5
- package/dist/components/q2-card.js.map +1 -1
- package/dist/components/q2-chart-area.js +1 -1
- package/dist/components/q2-chart-area.js.map +1 -1
- package/dist/components/q2-chart-bar.js +1 -1
- package/dist/components/q2-chart-bar.js.map +1 -1
- package/dist/components/q2-chart-donut.js +5 -5
- package/dist/components/q2-chart-donut.js.map +1 -1
- package/dist/components/q2-checkbox2.js +1 -1
- package/dist/components/q2-checkbox2.js.map +1 -1
- package/dist/components/q2-data-table.js +17 -10
- package/dist/components/q2-data-table.js.map +1 -1
- package/dist/components/q2-dropdown-item2.js +3 -3
- package/dist/components/q2-dropdown-item2.js.map +1 -1
- package/dist/components/q2-dropdown.js +1 -1
- package/dist/components/q2-dropdown.js.map +1 -1
- package/dist/components/q2-file-picker.js +25 -18
- package/dist/components/q2-file-picker.js.map +1 -1
- package/dist/components/q2-formatted-text.js +9 -9
- package/dist/components/q2-formatted-text.js.map +1 -1
- package/dist/components/q2-icon2.js +1 -0
- package/dist/components/q2-icon2.js.map +1 -1
- package/dist/components/q2-input2.js +9 -9
- package/dist/components/q2-input2.js.map +1 -1
- package/dist/components/q2-legend2.js +1 -1
- package/dist/components/q2-legend2.js.map +1 -1
- package/dist/components/q2-link2.js +1 -1
- package/dist/components/q2-link2.js.map +1 -1
- package/dist/components/q2-loading2.js +2 -2
- package/dist/components/q2-loading2.js.map +1 -1
- package/dist/components/q2-modal.js +1 -1
- package/dist/components/q2-modal.js.map +1 -1
- package/dist/components/q2-mutation-observer.d.ts +11 -0
- package/dist/components/q2-mutation-observer.js +130 -0
- package/dist/components/q2-mutation-observer.js.map +1 -0
- package/dist/components/q2-optgroup2.js +1 -1
- package/dist/components/q2-pagination.js +26 -5
- package/dist/components/q2-pagination.js.map +1 -1
- package/dist/components/q2-pill.js +1 -1
- package/dist/components/q2-relative-time.js +1 -1
- package/dist/components/q2-resize-observer2.js +1 -1
- package/dist/components/q2-section-container.d.ts +11 -0
- package/dist/components/q2-section-container.js +128 -0
- package/dist/components/q2-section-container.js.map +1 -0
- package/dist/components/q2-section.js +2 -2
- package/dist/components/q2-stepper-vertical.js +1 -1
- package/dist/components/q2-stepper.js +1 -1
- package/dist/components/q2-tab-container.js +1 -1
- package/dist/components/q2-tab-pane.js +1 -1
- package/dist/components/q2-tag.js +1 -1
- package/dist/components/q2-textarea.js +1 -1
- package/dist/components/q2-textarea.js.map +1 -1
- package/dist/components/tecton-tab-pane.js +2 -2
- package/dist/esm/action-sheet-D3xPdhm8.js.map +1 -1
- package/dist/esm/index-YJ5sXwiE.js.map +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/q2-action-group_2.entry.js +1 -1
- package/dist/esm/q2-action-sheet.entry.js +1 -1
- package/dist/esm/q2-action-sheet.entry.js.map +1 -1
- package/dist/esm/q2-avatar.entry.js +4 -2
- package/dist/esm/q2-avatar.entry.js.map +1 -1
- package/dist/esm/q2-btn.q2-loading.entry.js.map +1 -1
- package/dist/esm/q2-btn_2.entry.js +2 -2
- package/dist/esm/q2-btn_2.entry.js.map +1 -1
- package/dist/esm/q2-card.entry.js +5 -5
- package/dist/esm/q2-card.entry.js.map +1 -1
- package/dist/esm/q2-chart-area.entry.js +1 -1
- package/dist/esm/q2-chart-area.entry.js.map +1 -1
- package/dist/esm/q2-chart-bar.entry.js +1 -1
- package/dist/esm/q2-chart-bar.entry.js.map +1 -1
- package/dist/esm/q2-chart-donut.entry.js +5 -5
- package/dist/esm/q2-chart-donut.entry.js.map +1 -1
- package/dist/esm/q2-checkbox.entry.js +1 -1
- package/dist/esm/q2-checkbox.entry.js.map +1 -1
- package/dist/esm/q2-data-table.entry.js +15 -10
- package/dist/esm/q2-data-table.entry.js.map +1 -1
- package/dist/esm/q2-dropdown-item.entry.js +3 -3
- package/dist/esm/q2-dropdown-item.entry.js.map +1 -1
- package/dist/esm/q2-dropdown.entry.js +1 -1
- package/dist/esm/q2-dropdown.entry.js.map +1 -1
- package/dist/esm/q2-file-picker.entry.js +24 -17
- package/dist/esm/q2-file-picker.entry.js.map +1 -1
- package/dist/esm/q2-formatted-text.entry.js +7 -7
- package/dist/esm/q2-formatted-text.entry.js.map +1 -1
- package/dist/esm/q2-icon.entry.js +1 -0
- package/dist/esm/q2-icon.entry.js.map +1 -1
- package/dist/esm/q2-input.entry.js +8 -8
- package/dist/esm/q2-input.entry.js.map +1 -1
- package/dist/esm/q2-legend.entry.js +1 -1
- package/dist/esm/q2-legend.entry.js.map +1 -1
- package/dist/esm/q2-link.q2-list.entry.js.map +1 -1
- package/dist/esm/q2-link_2.entry.js +1 -1
- package/dist/esm/q2-link_2.entry.js.map +1 -1
- package/dist/esm/q2-modal.entry.js +1 -1
- package/dist/esm/q2-modal.entry.js.map +1 -1
- package/dist/esm/q2-mutation-observer.entry.js +104 -0
- package/dist/esm/q2-mutation-observer.entry.js.map +1 -0
- package/dist/esm/q2-optgroup.entry.js +1 -1
- package/dist/esm/q2-pagination.entry.js +25 -5
- package/dist/esm/q2-pagination.entry.js.map +1 -1
- package/dist/esm/q2-pill.entry.js +1 -1
- package/dist/esm/q2-relative-time.entry.js +1 -1
- package/dist/esm/q2-section-container.entry.js +100 -0
- package/dist/esm/q2-section-container.entry.js.map +1 -0
- package/dist/esm/q2-section.entry.js +2 -2
- package/dist/esm/q2-stepper-vertical.entry.js +1 -1
- package/dist/esm/q2-stepper.entry.js +1 -1
- package/dist/esm/q2-tab-container.entry.js +1 -1
- package/dist/esm/q2-tab-pane.entry.js +1 -1
- package/dist/esm/q2-tag.entry.js +1 -1
- package/dist/esm/q2-tecton-elements.js +1 -1
- package/dist/esm/q2-textarea.entry.js +1 -1
- package/dist/esm/q2-textarea.entry.js.map +1 -1
- package/dist/esm/tecton-tab-pane.entry.js +2 -2
- package/dist/q2-tecton-elements/action-sheet-D3xPdhm8.js.map +1 -1
- package/dist/q2-tecton-elements/assets/cards.symbol.svg +1 -2
- package/dist/q2-tecton-elements/assets/icon-list.json +1 -1
- package/dist/q2-tecton-elements/assets/icon-map.json +1 -1
- package/dist/q2-tecton-elements/assets/standard.symbol.svg +1 -1
- package/dist/q2-tecton-elements/charting-Ckq0XMDu.js.map +1 -0
- package/dist/q2-tecton-elements/index-CvNuBFrq.js.map +1 -0
- package/dist/q2-tecton-elements/index-DIB7EjIC.js.map +1 -0
- package/dist/q2-tecton-elements/index-RUz6101x.js.map +1 -0
- package/dist/q2-tecton-elements/index-YJ5sXwiE.js.map +1 -1
- package/dist/q2-tecton-elements/q2-action-group_2.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-action-sheet.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-action-sheet.entry.js +62 -62
- package/dist/q2-tecton-elements/q2-action-sheet.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-avatar.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-avatar.entry.js +26 -25
- package/dist/q2-tecton-elements/q2-avatar.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-btn.q2-loading.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-btn_2.entry.js +11 -6
- package/dist/q2-tecton-elements/q2-btn_2.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-card.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-card.entry.js +5 -5
- package/dist/q2-tecton-elements/q2-card.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-chart-area.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-chart-area.entry.js +2 -2
- package/dist/q2-tecton-elements/q2-chart-area.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-chart-bar.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-chart-bar.entry.js +2 -2
- package/dist/q2-tecton-elements/q2-chart-bar.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-chart-donut.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-chart-donut.entry.js +48 -47
- package/dist/q2-tecton-elements/q2-chart-donut.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-checkbox.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-checkbox.entry.js +6 -6
- package/dist/q2-tecton-elements/q2-checkbox.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-data-table.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-data-table.entry.js +23 -19
- package/dist/q2-tecton-elements/q2-data-table.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-dropdown-item.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-dropdown-item.entry.js +23 -21
- package/dist/q2-tecton-elements/q2-dropdown-item.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-dropdown.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-dropdown.entry.js +4 -4
- package/dist/q2-tecton-elements/q2-dropdown.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-file-picker.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-file-picker.entry.js +42 -35
- package/dist/q2-tecton-elements/q2-file-picker.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-formatted-text.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-formatted-text.entry.js +7 -7
- package/dist/q2-tecton-elements/q2-formatted-text.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-icon.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-icon.entry.js +1 -0
- package/dist/q2-tecton-elements/q2-icon.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-input.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-input.entry.js +7 -7
- package/dist/q2-tecton-elements/q2-input.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-legend.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-legend.entry.js +2 -2
- package/dist/q2-tecton-elements/q2-legend.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-link.q2-list.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-link_2.entry.js +1 -0
- package/dist/q2-tecton-elements/q2-link_2.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-modal.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-modal.entry.js +23 -23
- package/dist/q2-tecton-elements/q2-modal.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-mutation-observer.entry.esm.js.map +1 -0
- package/dist/q2-tecton-elements/q2-mutation-observer.entry.js +107 -0
- package/dist/q2-tecton-elements/q2-mutation-observer.entry.js.map +1 -0
- package/dist/q2-tecton-elements/q2-optgroup.entry.js +4 -4
- package/dist/q2-tecton-elements/q2-pagination.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-pagination.entry.js +50 -38
- package/dist/q2-tecton-elements/q2-pagination.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-pill.entry.js +12 -12
- package/dist/q2-tecton-elements/q2-relative-time.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-section-container.entry.esm.js.map +1 -0
- package/dist/q2-tecton-elements/q2-section-container.entry.js +95 -0
- package/dist/q2-tecton-elements/q2-section-container.entry.js.map +1 -0
- package/dist/q2-tecton-elements/q2-section.entry.js +11 -11
- package/dist/q2-tecton-elements/q2-stepper-vertical.entry.js +37 -37
- package/dist/q2-tecton-elements/q2-stepper.entry.js +12 -12
- package/dist/q2-tecton-elements/q2-tab-container.entry.js +12 -12
- package/dist/q2-tecton-elements/q2-tab-pane.entry.js +2 -2
- package/dist/q2-tecton-elements/q2-tag.entry.js +15 -15
- package/dist/q2-tecton-elements/q2-tecton-elements.esm.js +1 -1
- package/dist/q2-tecton-elements/q2-tecton-elements.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-textarea.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-textarea.entry.js +2 -2
- package/dist/q2-tecton-elements/q2-textarea.entry.js.map +1 -1
- package/dist/q2-tecton-elements/sanitize-html-string-Csx7LCh3.js.map +1 -0
- package/dist/q2-tecton-elements/shapes-BJsBbYur.js.map +1 -0
- package/dist/q2-tecton-elements/tecton-tab-pane.entry.js +6 -6
- package/dist/types/components/q2-action-sheet/q2-action-sheet.d.ts +1 -1
- package/dist/types/components/q2-avatar/q2-avatar.d.ts +2 -0
- package/dist/types/components/q2-card/q2-card.d.ts +1 -1
- package/dist/types/components/q2-chart-area/q2-chart-area.d.ts +1 -1
- package/dist/types/components/q2-chart-bar/q2-chart-bar.d.ts +1 -1
- package/dist/types/components/q2-chart-donut/q2-chart-donut.d.ts +1 -1
- package/dist/types/components/q2-data-table/q2-data-table.d.ts +9 -3
- package/dist/types/components/q2-file-picker/q2-file-picker.d.ts +3 -1
- package/dist/types/components/q2-formatted-text/q2-formatted-text.d.ts +6 -6
- package/dist/types/components/q2-icon/q2-icon-types.d.ts +1 -2
- package/dist/types/components/q2-input/q2-input.d.ts +1 -1
- package/dist/types/components/q2-legend/q2-legend.d.ts +1 -1
- package/dist/types/components/q2-modal/q2-modal.d.ts +1 -1
- package/dist/types/components/q2-mutation-observer/q2-mutation-observer.d.ts +40 -0
- package/dist/types/components/q2-pagination/q2-pagination.d.ts +2 -0
- package/dist/types/components/q2-section-container/q2-section-container.d.ts +34 -0
- package/dist/types/components/q2-textarea/q2-textarea.d.ts +1 -2
- package/dist/types/components.d.ts +175 -4
- package/dist/types/global.d.ts +3 -3
- package/dist/types/util.d.ts +6 -6
- package/dist/types/utils/action-sheet.d.ts +1 -1
- package/dist/types/utils/helpers.d.ts +2 -3
- package/dist/types/utils/index.d.ts +2 -2
- package/package.json +5 -5
- /package/dist/types/{builds/q2e/development/tecton/tecton → Users/kvanhouten/Documents/Work/tecton_extra}/packages/q2-tecton-elements/.stencil/jest.setup.d.ts +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"q2-chart-area.entry.esm.js","sources":["../../node_modules/.pnpm/echarts@5.6.0/node_modules/echarts/lib/chart/line/install.js","src/components/q2-chart-area/q2-chart-area.scss?tag=q2-chart-area&encapsulation=shadow","src/components/q2-chart-area/q2-chart-area.tsx"],"sourcesContent":["\n/*\n* Licensed to the Apache Software Foundation (ASF) under one\n* or more contributor license agreements. See the NOTICE file\n* distributed with this work for additional information\n* regarding copyright ownership. The ASF licenses this file\n* to you under the Apache License, Version 2.0 (the\n* \"License\"); you may not use this file except in compliance\n* with the License. You may obtain a copy of the License at\n*\n* http://www.apache.org/licenses/LICENSE-2.0\n*\n* Unless required by applicable law or agreed to in writing,\n* software distributed under the License is distributed on an\n* \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n* KIND, either express or implied. See the License for the\n* specific language governing permissions and limitations\n* under the License.\n*/\n\n\n/**\n * AUTO-GENERATED FILE. DO NOT MODIFY.\n */\n\n/*\r\n* Licensed to the Apache Software Foundation (ASF) under one\r\n* or more contributor license agreements. See the NOTICE file\r\n* distributed with this work for additional information\r\n* regarding copyright ownership. The ASF licenses this file\r\n* to you under the Apache License, Version 2.0 (the\r\n* \"License\"); you may not use this file except in compliance\r\n* with the License. You may obtain a copy of the License at\r\n*\r\n* http://www.apache.org/licenses/LICENSE-2.0\r\n*\r\n* Unless required by applicable law or agreed to in writing,\r\n* software distributed under the License is distributed on an\r\n* \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\r\n* KIND, either express or implied. See the License for the\r\n* specific language governing permissions and limitations\r\n* under the License.\r\n*/\nimport LineSeries from './LineSeries.js';\nimport LineView from './LineView.js';\n// In case developer forget to include grid component\nimport layoutPoints from '../../layout/points.js';\nimport dataSample from '../../processor/dataSample.js';\nexport function install(registers) {\n registers.registerChartView(LineView);\n registers.registerSeriesModel(LineSeries);\n registers.registerLayout(layoutPoints('line', true));\n registers.registerVisual({\n seriesType: 'line',\n reset: function (seriesModel) {\n var data = seriesModel.getData();\n // Visual coding for legend\n var lineStyle = seriesModel.getModel('lineStyle').getLineStyle();\n if (lineStyle && !lineStyle.stroke) {\n // Fill in visual should be palette color if\n // has color callback\n lineStyle.stroke = data.getVisual('style').fill;\n }\n data.setVisual('legendLineStyle', lineStyle);\n }\n });\n // Down sample after filter\n registers.registerProcessor(registers.PRIORITY.PROCESSOR.STATISTIC, dataSample('line'));\n}","@import '../../styles/host.scss';\n\n:host {\n width: var(--tct-area-chart-width, 100%);\n height: var(--tct-area-chart-height, 100%);\n display: block;\n}\n\n.container {\n width: 100%;\n height: 100%;\n}\n\n.chart-container {\n width: 100%;\n height: 100%;\n}\n","import { Component, Prop, h, ComponentInterface, Element, Watch, EventEmitter, Event, Method } from '@stencil/core';\nimport * as echarts from 'echarts/core';\nimport {\n TitleComponent,\n TitleComponentOption,\n AriaComponent,\n AriaComponentOption,\n GridComponent,\n} from 'echarts/components';\nimport { LineChart, LineSeriesOption } from 'echarts/charts';\nimport { UniversalTransition } from 'echarts/features';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport { loc, overrideFocus } from 'src/utils';\nimport { getCSSProperty, isValidColor, formatValue } from 'src/utils/charting';\nimport { IChartData } from 'q2-tecton-common/lib/types/element-types';\n\necharts.use([AriaComponent, LineChart, CanvasRenderer, UniversalTransition, GridComponent, TitleComponent]);\n\ntype EChartsOption = echarts.ComposeOption<AriaComponentOption | LineSeriesOption | TitleComponentOption>;\n\n@Component({ tag: 'q2-chart-area', shadow: true, styleUrl: 'q2-chart-area.scss' })\nexport class Q2ChartArea implements ComponentInterface {\n // #region Own Properties\n\n chart: echarts.ECharts;\n chartContainer: HTMLDivElement;\n chartContainerStyles: CSSStyleDeclaration;\n hostElementStyles: CSSStyleDeclaration;\n resizeEventListener: EventListener;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region Public Property API\n\n /** Controls alignment of the chart name when its visible. */\n @Prop({ reflect: true })\n alignChartName: 'left' | 'right' | 'center';\n\n /**\n * Controls area fill color of chart. Accepts variables, hex codes, and CSS color names.\n *\n * **Examples:**\n * @snippet\n * element.areaColor = \"#ff0000\";\n * element.areaColor = \"papayawhip\";\n * element.areaColor = \"var(--t-accent-1)\";\n */\n @Prop({ reflect: true })\n areaColor: string;\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 /** A subtitile to the chart name. Often used to provide a brief description of what the data represents. */\n @Prop({ reflect: true })\n chartSubTitle: string;\n\n /** An array of objects that contain the data to be displayed. */\n @Prop()\n data: IChartData[] = [];\n\n /**\n * Allows control of how labels on the name axis will be handled if the text length is wider than the available space.\n * Values will ellipsize if the truncate option is used.\n */\n @Prop({ reflect: true })\n dataNamesOverflow: 'break' | 'truncate';\n\n /**\n * Sets width available for labels on the name axis.\n * It can be used in coordination with `dataNamesOverflow` to control where the label text breaks or truncates.\n */\n @Prop({ reflect: true })\n dataNamesWidth: number;\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 /**\n * Can be used in coordination with the currency format property to control decimal handling.\n * Accepts `Ndec` where N is a number. (e.g. `2dec`)\n */\n @Prop({ reflect: true })\n formatModifier: string;\n\n /** Controls the direction or viibility of grid lines on the chart. */\n @Prop({ reflect: true })\n gridLines: 'horizontal' | 'vertical' | 'off';\n\n /**\n * Sets chart padding around the grid.\n * Each value in the object will be interpreted as pixels.\n *\n * **Example:**\n * @snippet\n * chart.gridPadding = { left: 10, right: 10, top: 20, bottom: 20 };\n */\n @Prop()\n gridPadding: { left?: number; right?: number; top?: number; bottom?: number };\n\n /** Controls visibility of labels on the name axis. */\n @Prop({ reflect: true })\n hideNameAxisLabels: boolean = false;\n\n /** Controls visibility of labels on the value axis. */\n @Prop({ reflect: true })\n hideValueAxisLabels: boolean = false;\n\n /**\n * Controls color of the data line on the chart. Accepts variables, hex codes, and CSS color names.\n *\n * **Examples:**\n * @snippet\n * element.areaColor = \"#ff0000\";\n * element.areaColor = \"papayawhip\";\n * element.areaColor = \"var(--t-accent-1)\";\n */\n @Prop({ reflect: true })\n lineColor: string;\n\n /**\n * Controls the position of text on the names axis by centering the text to the bar at a 45° angle.\n * Can be used when space is limited or with longer name labels.\n */\n @Prop({ reflect: true })\n offsetDataNames: boolean = false;\n\n /**\n * Controls the position of text on the values axis by centering the text to the bar at a 45° angle.\n * Can be used when space is limited or with longer name labels.\n */\n @Prop({ reflect: true })\n offsetDataValues: boolean = false;\n\n /**\n * Controls color of vertical pointer on a line chart. Accepts variables, hex codes, and CSS color names.\n *\n * **Examples:**\n * @snippet\n * element.areaColor = \"#ff0000\";\n * element.areaColor = \"papayawhip\";\n * element.areaColor = \"var(--t-accent-1)\";\n */\n @Prop({ reflect: true })\n pointerLineColor: string;\n\n /** Controls the style of the vertical poiner line. */\n @Prop({ reflect: true })\n pointerLineStyle: 'solid' | 'dashed';\n\n /** Controls the visibility of the chart name at the top of the chart. */\n @Prop({ reflect: true })\n showChartName: boolean = false;\n\n /** Controls the visibility of a value label when a data point is shown on the chart. */\n @Prop({ reflect: true })\n showDatapointLabels: boolean = false;\n\n /**\n * Controls making the area fill color into a gradient.\n * The gradient starts at the top with the `areaColor` value, and fades to white.\n */\n @Prop({ reflect: true })\n showGradient: boolean = false;\n\n // #endregion\n // #region Events\n\n /**\n * Emitted when a data point is clicked.\n */\n @Event()\n change: EventEmitter<{\n index: number;\n data: IChartData;\n }>;\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, and animation frames\n if (this.chart) {\n this.chart.dispose();\n this.chart = null;\n }\n\n // Remove window resize listener\n window.removeEventListener('resize', this.resizeEventListener);\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 and event listener references\n this.chartContainer = null;\n this.resizeEventListener = null;\n }\n\n componentDidLoad() {\n const chart = echarts.init(this.chartContainer);\n\n this.chart = chart;\n\n this.resizeEventListener = () => this.resizeChart();\n window.addEventListener('resize', this.resizeEventListener);\n\n this.cacheComputedStyles();\n this.updateChart(chart);\n this.setupChartEvents(chart);\n\n overrideFocus(this.hostElement);\n }\n\n // #endregion\n // #region Public Methods API\n\n /**\n * A method to fire change event on hover on a point.\n *\n * @testOnly\n */\n @Method()\n async hoverDataPoint(index: number) {\n this.change.emit({\n index: index,\n data: this.data[index],\n });\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('data')\n @Watch('alignChartName')\n @Watch('chartName')\n @Watch('chartSubTitle')\n @Watch('lineColor')\n @Watch('pointerLineColor')\n @Watch('pointerLineStyle')\n @Watch('areaColor')\n @Watch('dataNamesOverflow')\n @Watch('dataNamesWidth')\n @Watch('format')\n @Watch('formatModifier')\n @Watch('hideNameAxisLabels')\n @Watch('hideValueAxisLabels')\n @Watch('offsetDataNames')\n @Watch('offsetDataValues')\n @Watch('showChartName')\n @Watch('showDatapointLabels')\n @Watch('showGradient')\n @Watch('gridLines')\n @Watch('gridPadding')\n propsUpdates() {\n this.updateChart(this.chart);\n }\n\n // #endregion\n // #region Local Methods\n\n cacheComputedStyles() {\n this.chartContainerStyles = getComputedStyle(this.chartContainer);\n this.hostElementStyles = getComputedStyle(this.hostElement);\n }\n\n getAreaFill() {\n if (this.showGradient) {\n return {\n type: 'linear',\n x: 0,\n y: 0,\n x2: 0,\n y2: 1,\n colorStops: [\n {\n offset: 0,\n color: this.getColor(this.areaColor),\n },\n {\n offset: 1,\n color: 'white',\n },\n ],\n global: false,\n };\n }\n return this.getColor(this.areaColor);\n }\n\n getColor(color: string) {\n const primaryColor = getCSSProperty('var(--t-primary)', this.chartContainerStyles, this.hostElementStyles);\n const cssColorProp = getCSSProperty(color, this.chartContainerStyles, this.hostElementStyles);\n if (cssColorProp) return cssColorProp;\n if (isValidColor(color)) return color;\n return primaryColor;\n }\n\n resizeChart() {\n this.chart.resize();\n }\n\n setupChartEvents(chart: echarts.ECharts) {\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 const decimals = this.formatModifier?.includes('dec') ? this.formatModifier.replace('dec', '') : 0;\n\n const valueAxis = {\n type: 'value',\n axisLabel: {\n formatter: (value: number) =>\n formatValue(value, {\n type: this.format,\n decimals,\n }),\n rotate: this.offsetDataValues ? 45 : 0,\n margin: this.offsetDataValues ? 15 : 8,\n show: !this.hideValueAxisLabels,\n },\n splitLine: {\n show: this.gridLines === 'horizontal' || !this.gridLines,\n },\n };\n\n const categoryAxis = {\n type: 'category',\n boundaryGap: false,\n data: this.data.map(datum => loc(datum.name) || ''),\n axisLabel: {\n rotate: this.offsetDataNames ? 45 : 0,\n margin: this.offsetDataNames ? 15 : 8,\n width: this.dataNamesWidth || 50,\n overflow: this.dataNamesOverflow || 'none',\n truncate: 'ellipsis',\n show: !this.hideNameAxisLabels,\n },\n axisLine: {\n show: !this.hideNameAxisLabels,\n },\n axisTick: {\n show: !this.hideNameAxisLabels,\n },\n axisPointer: {\n show: true,\n type: 'line',\n label: {\n show: false,\n formatter: (params: any) => {\n const dataIndex = params.seriesData[0].dataIndex;\n this.change.emit({\n index: dataIndex,\n data: this.data[dataIndex],\n });\n },\n },\n lineStyle: {\n color: this.getColor(this.pointerLineColor || 'var(--t-gray-10)'),\n type: this.pointerLineStyle || 'solid',\n width: 1.5,\n },\n z: 1,\n },\n splitLine: {\n show: this.gridLines === 'vertical',\n },\n };\n\n return chart.setOption<EChartsOption>({\n aria: {\n enabled: true,\n },\n title: {\n text: loc(this.chartName),\n show: this.showChartName,\n left: this.alignChartName,\n subtext: this.chartSubTitle,\n },\n grid: {\n containLabel: true,\n ...this.gridPadding,\n },\n xAxis: categoryAxis,\n yAxis: valueAxis,\n series: [\n {\n data: this.data.map(datum => datum.value || 0),\n id: 'area',\n type: 'line',\n lineStyle: {\n color: this.getColor(this.lineColor),\n },\n itemStyle: {\n color: this.getColor(this.lineColor),\n },\n areaStyle: {\n color: this.getAreaFill(),\n },\n symbolSize: 10,\n showSymbol: false,\n label: {\n show: this.showDatapointLabels,\n position: 'right',\n formatter: (params: any) => {\n return formatValue(params.value as number, {\n type: this.format,\n decimals,\n });\n },\n },\n },\n ],\n });\n }\n\n // #endregion\n // #region Render Methods\n\n render() {\n return (\n <div class=\"container\">\n <div\n ref={el => (this.chartContainer = el)}\n class=\"chart-container\"\n role=\"img\"\n test-id=\"areaChartContainer\"\n ></div>\n </div>\n );\n }\n\n // #endregion\n}\n"],"names":["LineSeries","layoutPoints","echarts.use","AriaComponent","LineChart","CanvasRenderer","UniversalTransition","GridComponent","TitleComponent","echarts.init"],"mappings":"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","x_google_ignoreList":[0]}
|
|
1
|
+
{"version":3,"file":"q2-chart-area.entry.esm.js","sources":["../../node_modules/.pnpm/echarts@5.6.0/node_modules/echarts/lib/chart/line/install.js","src/components/q2-chart-area/q2-chart-area.scss?tag=q2-chart-area&encapsulation=shadow","src/components/q2-chart-area/q2-chart-area.tsx"],"sourcesContent":["\n/*\n* Licensed to the Apache Software Foundation (ASF) under one\n* or more contributor license agreements. See the NOTICE file\n* distributed with this work for additional information\n* regarding copyright ownership. The ASF licenses this file\n* to you under the Apache License, Version 2.0 (the\n* \"License\"); you may not use this file except in compliance\n* with the License. You may obtain a copy of the License at\n*\n* http://www.apache.org/licenses/LICENSE-2.0\n*\n* Unless required by applicable law or agreed to in writing,\n* software distributed under the License is distributed on an\n* \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n* KIND, either express or implied. See the License for the\n* specific language governing permissions and limitations\n* under the License.\n*/\n\n\n/**\n * AUTO-GENERATED FILE. DO NOT MODIFY.\n */\n\n/*\r\n* Licensed to the Apache Software Foundation (ASF) under one\r\n* or more contributor license agreements. See the NOTICE file\r\n* distributed with this work for additional information\r\n* regarding copyright ownership. The ASF licenses this file\r\n* to you under the Apache License, Version 2.0 (the\r\n* \"License\"); you may not use this file except in compliance\r\n* with the License. You may obtain a copy of the License at\r\n*\r\n* http://www.apache.org/licenses/LICENSE-2.0\r\n*\r\n* Unless required by applicable law or agreed to in writing,\r\n* software distributed under the License is distributed on an\r\n* \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\r\n* KIND, either express or implied. See the License for the\r\n* specific language governing permissions and limitations\r\n* under the License.\r\n*/\nimport LineSeries from './LineSeries.js';\nimport LineView from './LineView.js';\n// In case developer forget to include grid component\nimport layoutPoints from '../../layout/points.js';\nimport dataSample from '../../processor/dataSample.js';\nexport function install(registers) {\n registers.registerChartView(LineView);\n registers.registerSeriesModel(LineSeries);\n registers.registerLayout(layoutPoints('line', true));\n registers.registerVisual({\n seriesType: 'line',\n reset: function (seriesModel) {\n var data = seriesModel.getData();\n // Visual coding for legend\n var lineStyle = seriesModel.getModel('lineStyle').getLineStyle();\n if (lineStyle && !lineStyle.stroke) {\n // Fill in visual should be palette color if\n // has color callback\n lineStyle.stroke = data.getVisual('style').fill;\n }\n data.setVisual('legendLineStyle', lineStyle);\n }\n });\n // Down sample after filter\n registers.registerProcessor(registers.PRIORITY.PROCESSOR.STATISTIC, dataSample('line'));\n}","@import '../../styles/host.scss';\n\n:host {\n width: var(--tct-area-chart-width, 100%);\n height: var(--tct-area-chart-height, 100%);\n display: block;\n}\n\n.container {\n width: 100%;\n height: 100%;\n}\n\n.chart-container {\n width: 100%;\n height: 100%;\n}\n","import { Component, Prop, h, ComponentInterface, Element, Watch, EventEmitter, Event, Method } from '@stencil/core';\nimport * as echarts from 'echarts/core';\nimport {\n TitleComponent,\n TitleComponentOption,\n AriaComponent,\n AriaComponentOption,\n GridComponent,\n} from 'echarts/components';\nimport { LineChart, LineSeriesOption } from 'echarts/charts';\nimport { UniversalTransition } from 'echarts/features';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport { loc, overrideFocus } from 'src/utils';\nimport { getCSSProperty, isValidColor, formatValue } from 'src/utils/charting';\n\nimport type { IChartData } from 'q2-tecton-common/lib/types/element-types';\n\necharts.use([AriaComponent, LineChart, CanvasRenderer, UniversalTransition, GridComponent, TitleComponent]);\n\ntype EChartsOption = echarts.ComposeOption<AriaComponentOption | LineSeriesOption | TitleComponentOption>;\n\n@Component({ tag: 'q2-chart-area', shadow: true, styleUrl: 'q2-chart-area.scss' })\nexport class Q2ChartArea implements ComponentInterface {\n // #region Own Properties\n\n chart: echarts.ECharts;\n chartContainer: HTMLDivElement;\n chartContainerStyles: CSSStyleDeclaration;\n hostElementStyles: CSSStyleDeclaration;\n resizeEventListener: EventListener;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region Public Property API\n\n /** Controls alignment of the chart name when its visible. */\n @Prop({ reflect: true })\n alignChartName: 'left' | 'right' | 'center';\n\n /**\n * Controls area fill color of chart. Accepts variables, hex codes, and CSS color names.\n *\n * **Examples:**\n * @snippet\n * element.areaColor = \"#ff0000\";\n * element.areaColor = \"papayawhip\";\n * element.areaColor = \"var(--t-accent-1)\";\n */\n @Prop({ reflect: true })\n areaColor: string;\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 /** A subtitile to the chart name. Often used to provide a brief description of what the data represents. */\n @Prop({ reflect: true })\n chartSubTitle: string;\n\n /** An array of objects that contain the data to be displayed. */\n @Prop()\n data: IChartData[] = [];\n\n /**\n * Allows control of how labels on the name axis will be handled if the text length is wider than the available space.\n * Values will ellipsize if the truncate option is used.\n */\n @Prop({ reflect: true })\n dataNamesOverflow: 'break' | 'truncate';\n\n /**\n * Sets width available for labels on the name axis.\n * It can be used in coordination with `dataNamesOverflow` to control where the label text breaks or truncates.\n */\n @Prop({ reflect: true })\n dataNamesWidth: number;\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 /**\n * Can be used in coordination with the currency format property to control decimal handling.\n * Accepts `Ndec` where N is a number. (e.g. `2dec`)\n */\n @Prop({ reflect: true })\n formatModifier: string;\n\n /** Controls the direction or viibility of grid lines on the chart. */\n @Prop({ reflect: true })\n gridLines: 'horizontal' | 'vertical' | 'off';\n\n /**\n * Sets chart padding around the grid.\n * Each value in the object will be interpreted as pixels.\n *\n * **Example:**\n * @snippet\n * chart.gridPadding = { left: 10, right: 10, top: 20, bottom: 20 };\n */\n @Prop()\n gridPadding: { left?: number; right?: number; top?: number; bottom?: number };\n\n /** Controls visibility of labels on the name axis. */\n @Prop({ reflect: true })\n hideNameAxisLabels: boolean = false;\n\n /** Controls visibility of labels on the value axis. */\n @Prop({ reflect: true })\n hideValueAxisLabels: boolean = false;\n\n /**\n * Controls color of the data line on the chart. Accepts variables, hex codes, and CSS color names.\n *\n * **Examples:**\n * @snippet\n * element.areaColor = \"#ff0000\";\n * element.areaColor = \"papayawhip\";\n * element.areaColor = \"var(--t-accent-1)\";\n */\n @Prop({ reflect: true })\n lineColor: string;\n\n /**\n * Controls the position of text on the names axis by centering the text to the bar at a 45° angle.\n * Can be used when space is limited or with longer name labels.\n */\n @Prop({ reflect: true })\n offsetDataNames: boolean = false;\n\n /**\n * Controls the position of text on the values axis by centering the text to the bar at a 45° angle.\n * Can be used when space is limited or with longer name labels.\n */\n @Prop({ reflect: true })\n offsetDataValues: boolean = false;\n\n /**\n * Controls color of vertical pointer on a line chart. Accepts variables, hex codes, and CSS color names.\n *\n * **Examples:**\n * @snippet\n * element.areaColor = \"#ff0000\";\n * element.areaColor = \"papayawhip\";\n * element.areaColor = \"var(--t-accent-1)\";\n */\n @Prop({ reflect: true })\n pointerLineColor: string;\n\n /** Controls the style of the vertical poiner line. */\n @Prop({ reflect: true })\n pointerLineStyle: 'solid' | 'dashed';\n\n /** Controls the visibility of the chart name at the top of the chart. */\n @Prop({ reflect: true })\n showChartName: boolean = false;\n\n /** Controls the visibility of a value label when a data point is shown on the chart. */\n @Prop({ reflect: true })\n showDatapointLabels: boolean = false;\n\n /**\n * Controls making the area fill color into a gradient.\n * The gradient starts at the top with the `areaColor` value, and fades to white.\n */\n @Prop({ reflect: true })\n showGradient: boolean = false;\n\n // #endregion\n // #region Events\n\n /**\n * Emitted when a data point is clicked.\n */\n @Event()\n change: EventEmitter<{\n index: number;\n data: IChartData;\n }>;\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, and animation frames\n if (this.chart) {\n this.chart.dispose();\n this.chart = null;\n }\n\n // Remove window resize listener\n window.removeEventListener('resize', this.resizeEventListener);\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 and event listener references\n this.chartContainer = null;\n this.resizeEventListener = null;\n }\n\n componentDidLoad() {\n const chart = echarts.init(this.chartContainer);\n\n this.chart = chart;\n\n this.resizeEventListener = () => this.resizeChart();\n window.addEventListener('resize', this.resizeEventListener);\n\n this.cacheComputedStyles();\n this.updateChart(chart);\n this.setupChartEvents(chart);\n\n overrideFocus(this.hostElement);\n }\n\n // #endregion\n // #region Public Methods API\n\n /**\n * A method to fire change event on hover on a point.\n *\n * @testOnly\n */\n @Method()\n async hoverDataPoint(index: number) {\n this.change.emit({\n index: index,\n data: this.data[index],\n });\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('data')\n @Watch('alignChartName')\n @Watch('chartName')\n @Watch('chartSubTitle')\n @Watch('lineColor')\n @Watch('pointerLineColor')\n @Watch('pointerLineStyle')\n @Watch('areaColor')\n @Watch('dataNamesOverflow')\n @Watch('dataNamesWidth')\n @Watch('format')\n @Watch('formatModifier')\n @Watch('hideNameAxisLabels')\n @Watch('hideValueAxisLabels')\n @Watch('offsetDataNames')\n @Watch('offsetDataValues')\n @Watch('showChartName')\n @Watch('showDatapointLabels')\n @Watch('showGradient')\n @Watch('gridLines')\n @Watch('gridPadding')\n propsUpdates() {\n this.updateChart(this.chart);\n }\n\n // #endregion\n // #region Local Methods\n\n cacheComputedStyles() {\n this.chartContainerStyles = getComputedStyle(this.chartContainer);\n this.hostElementStyles = getComputedStyle(this.hostElement);\n }\n\n getAreaFill() {\n if (this.showGradient) {\n return {\n type: 'linear',\n x: 0,\n y: 0,\n x2: 0,\n y2: 1,\n colorStops: [\n {\n offset: 0,\n color: this.getColor(this.areaColor),\n },\n {\n offset: 1,\n color: 'white',\n },\n ],\n global: false,\n };\n }\n return this.getColor(this.areaColor);\n }\n\n getColor(color: string) {\n const primaryColor = getCSSProperty('var(--t-primary)', this.chartContainerStyles, this.hostElementStyles);\n const cssColorProp = getCSSProperty(color, this.chartContainerStyles, this.hostElementStyles);\n if (cssColorProp) return cssColorProp;\n if (isValidColor(color)) return color;\n return primaryColor;\n }\n\n resizeChart() {\n this.chart.resize();\n }\n\n setupChartEvents(chart: echarts.ECharts) {\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 const decimals = this.formatModifier?.includes('dec') ? this.formatModifier.replace('dec', '') : 0;\n\n const valueAxis = {\n type: 'value',\n axisLabel: {\n formatter: (value: number) =>\n formatValue(value, {\n type: this.format,\n decimals,\n }),\n rotate: this.offsetDataValues ? 45 : 0,\n margin: this.offsetDataValues ? 15 : 8,\n show: !this.hideValueAxisLabels,\n },\n splitLine: {\n show: this.gridLines === 'horizontal' || !this.gridLines,\n },\n };\n\n const categoryAxis = {\n type: 'category',\n boundaryGap: false,\n data: this.data.map(datum => loc(datum.name) || ''),\n axisLabel: {\n rotate: this.offsetDataNames ? 45 : 0,\n margin: this.offsetDataNames ? 15 : 8,\n width: this.dataNamesWidth || 50,\n overflow: this.dataNamesOverflow || 'none',\n truncate: 'ellipsis',\n show: !this.hideNameAxisLabels,\n },\n axisLine: {\n show: !this.hideNameAxisLabels,\n },\n axisTick: {\n show: !this.hideNameAxisLabels,\n },\n axisPointer: {\n show: true,\n type: 'line',\n label: {\n show: false,\n formatter: (params: any) => {\n const dataIndex = params.seriesData[0].dataIndex;\n this.change.emit({\n index: dataIndex,\n data: this.data[dataIndex],\n });\n },\n },\n lineStyle: {\n color: this.getColor(this.pointerLineColor || 'var(--t-gray-10)'),\n type: this.pointerLineStyle || 'solid',\n width: 1.5,\n },\n z: 1,\n },\n splitLine: {\n show: this.gridLines === 'vertical',\n },\n };\n\n return chart.setOption<EChartsOption>({\n aria: {\n enabled: true,\n },\n title: {\n text: loc(this.chartName),\n show: this.showChartName,\n left: this.alignChartName,\n subtext: this.chartSubTitle,\n },\n grid: {\n containLabel: true,\n ...this.gridPadding,\n },\n xAxis: categoryAxis,\n yAxis: valueAxis,\n series: [\n {\n data: this.data.map(datum => datum.value || 0),\n id: 'area',\n type: 'line',\n lineStyle: {\n color: this.getColor(this.lineColor),\n },\n itemStyle: {\n color: this.getColor(this.lineColor),\n },\n areaStyle: {\n color: this.getAreaFill(),\n },\n symbolSize: 10,\n showSymbol: false,\n label: {\n show: this.showDatapointLabels,\n position: 'right',\n formatter: (params: any) => {\n return formatValue(params.value as number, {\n type: this.format,\n decimals,\n });\n },\n },\n },\n ],\n });\n }\n\n // #endregion\n // #region Render Methods\n\n render() {\n return (\n <div class=\"container\">\n <div\n ref={el => (this.chartContainer = el)}\n class=\"chart-container\"\n role=\"img\"\n test-id=\"areaChartContainer\"\n ></div>\n </div>\n );\n }\n\n // #endregion\n}\n"],"names":["LineSeries","layoutPoints","echarts.use","AriaComponent","LineChart","CanvasRenderer","UniversalTransition","GridComponent","TitleComponent","echarts.init"],"mappings":"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","x_google_ignoreList":[0]}
|
|
@@ -251,10 +251,10 @@ const v = class {
|
|
|
251
251
|
// #region Render Methods
|
|
252
252
|
render() {
|
|
253
253
|
return i("div", {
|
|
254
|
-
key: "
|
|
254
|
+
key: "7e0c56495c29ca880bb40a09c0f9029d2eab50c6",
|
|
255
255
|
class: "container"
|
|
256
256
|
}, i("div", {
|
|
257
|
-
key: "
|
|
257
|
+
key: "66ae46924390b1472b2e86c7ff782e89bfcaba1f",
|
|
258
258
|
ref: t => this.chartContainer = t,
|
|
259
259
|
class: "chart-container",
|
|
260
260
|
role: "img",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["install","registers","registerChartView","LineView","registerSeriesModel","LineSeries","registerLayout","layoutPoints","registerVisual","seriesType","reset","seriesModel","data","getData","lineStyle","getModel","getLineStyle","stroke","getVisual","fill","setVisual","registerProcessor","PRIORITY","PROCESSOR","STATISTIC","dataSample","q2ChartAreaCss","echarts.use","AriaComponent","LineChart","CanvasRenderer","UniversalTransition","GridComponent","TitleComponent","Q2ChartArea","constructor","hostRef","this","hideNameAxisLabels","hideValueAxisLabels","offsetDataNames","offsetDataValues","showChartName","showDatapointLabels","showGradient","disconnectedCallback","chart","dispose","window","removeEventListener","resizeEventListener","chartContainerStyles","hostElementStyles","chartContainer","componentDidLoad","echarts.init","resizeChart","addEventListener","cacheComputedStyles","updateChart","setupChartEvents","overrideFocus","hostElement","hoverDataPoint","index","change","emit","propsUpdates","getComputedStyle","getAreaFill","type","x","y","x2","y2","colorStops","offset","color","getColor","areaColor","global","primaryColor","getCSSProperty","cssColorProp","isValidColor","resize","on","canvas","getDom","querySelector","_a","hasAttribute","setAttribute","decimals","formatModifier","includes","replace","valueAxis","axisLabel","formatter","value","formatValue","format","rotate","margin","show","splitLine","gridLines","categoryAxis","boundaryGap","map","datum","loc","name","width","dataNamesWidth","overflow","dataNamesOverflow","truncate","axisLine","axisTick","axisPointer","label","params","dataIndex","seriesData","pointerLineColor","pointerLineStyle","z","setOption","aria","enabled","title","text","chartName","left","alignChartName","subtext","chartSubTitle","grid","Object","assign","containLabel","gridPadding","xAxis","yAxis","series","id","lineColor","itemStyle","areaStyle","symbolSize","showSymbol","position","render","h","key","class","ref","el","role"],"sources":["../../node_modules/.pnpm/echarts@5.6.0/node_modules/echarts/lib/chart/line/install.js","src/components/q2-chart-area/q2-chart-area.scss?tag=q2-chart-area&encapsulation=shadow","src/components/q2-chart-area/q2-chart-area.tsx"],"sourcesContent":["\n/*\n* Licensed to the Apache Software Foundation (ASF) under one\n* or more contributor license agreements. See the NOTICE file\n* distributed with this work for additional information\n* regarding copyright ownership. The ASF licenses this file\n* to you under the Apache License, Version 2.0 (the\n* \"License\"); you may not use this file except in compliance\n* with the License. You may obtain a copy of the License at\n*\n* http://www.apache.org/licenses/LICENSE-2.0\n*\n* Unless required by applicable law or agreed to in writing,\n* software distributed under the License is distributed on an\n* \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n* KIND, either express or implied. See the License for the\n* specific language governing permissions and limitations\n* under the License.\n*/\n\n\n/**\n * AUTO-GENERATED FILE. DO NOT MODIFY.\n */\n\n/*\r\n* Licensed to the Apache Software Foundation (ASF) under one\r\n* or more contributor license agreements. See the NOTICE file\r\n* distributed with this work for additional information\r\n* regarding copyright ownership. The ASF licenses this file\r\n* to you under the Apache License, Version 2.0 (the\r\n* \"License\"); you may not use this file except in compliance\r\n* with the License. You may obtain a copy of the License at\r\n*\r\n* http://www.apache.org/licenses/LICENSE-2.0\r\n*\r\n* Unless required by applicable law or agreed to in writing,\r\n* software distributed under the License is distributed on an\r\n* \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\r\n* KIND, either express or implied. See the License for the\r\n* specific language governing permissions and limitations\r\n* under the License.\r\n*/\nimport LineSeries from './LineSeries.js';\nimport LineView from './LineView.js';\n// In case developer forget to include grid component\nimport layoutPoints from '../../layout/points.js';\nimport dataSample from '../../processor/dataSample.js';\nexport function install(registers) {\n registers.registerChartView(LineView);\n registers.registerSeriesModel(LineSeries);\n registers.registerLayout(layoutPoints('line', true));\n registers.registerVisual({\n seriesType: 'line',\n reset: function (seriesModel) {\n var data = seriesModel.getData();\n // Visual coding for legend\n var lineStyle = seriesModel.getModel('lineStyle').getLineStyle();\n if (lineStyle && !lineStyle.stroke) {\n // Fill in visual should be palette color if\n // has color callback\n lineStyle.stroke = data.getVisual('style').fill;\n }\n data.setVisual('legendLineStyle', lineStyle);\n }\n });\n // Down sample after filter\n registers.registerProcessor(registers.PRIORITY.PROCESSOR.STATISTIC, dataSample('line'));\n}","@import '../../styles/host.scss';\n\n:host {\n width: var(--tct-area-chart-width, 100%);\n height: var(--tct-area-chart-height, 100%);\n display: block;\n}\n\n.container {\n width: 100%;\n height: 100%;\n}\n\n.chart-container {\n width: 100%;\n height: 100%;\n}\n","import { Component, Prop, h, ComponentInterface, Element, Watch, EventEmitter, Event, Method } from '@stencil/core';\nimport * as echarts from 'echarts/core';\nimport {\n TitleComponent,\n TitleComponentOption,\n AriaComponent,\n AriaComponentOption,\n GridComponent,\n} from 'echarts/components';\nimport { LineChart, LineSeriesOption } from 'echarts/charts';\nimport { UniversalTransition } from 'echarts/features';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport { loc, overrideFocus } from 'src/utils';\nimport { getCSSProperty, isValidColor, formatValue } from 'src/utils/charting';\nimport { IChartData } from 'q2-tecton-common/lib/types/element-types';\n\necharts.use([AriaComponent, LineChart, CanvasRenderer, UniversalTransition, GridComponent, TitleComponent]);\n\ntype EChartsOption = echarts.ComposeOption<AriaComponentOption | LineSeriesOption | TitleComponentOption>;\n\n@Component({ tag: 'q2-chart-area', shadow: true, styleUrl: 'q2-chart-area.scss' })\nexport class Q2ChartArea implements ComponentInterface {\n // #region Own Properties\n\n chart: echarts.ECharts;\n chartContainer: HTMLDivElement;\n chartContainerStyles: CSSStyleDeclaration;\n hostElementStyles: CSSStyleDeclaration;\n resizeEventListener: EventListener;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region Public Property API\n\n /** Controls alignment of the chart name when its visible. */\n @Prop({ reflect: true })\n alignChartName: 'left' | 'right' | 'center';\n\n /**\n * Controls area fill color of chart. Accepts variables, hex codes, and CSS color names.\n *\n * **Examples:**\n * @snippet\n * element.areaColor = \"#ff0000\";\n * element.areaColor = \"papayawhip\";\n * element.areaColor = \"var(--t-accent-1)\";\n */\n @Prop({ reflect: true })\n areaColor: string;\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 /** A subtitile to the chart name. Often used to provide a brief description of what the data represents. */\n @Prop({ reflect: true })\n chartSubTitle: string;\n\n /** An array of objects that contain the data to be displayed. */\n @Prop()\n data: IChartData[] = [];\n\n /**\n * Allows control of how labels on the name axis will be handled if the text length is wider than the available space.\n * Values will ellipsize if the truncate option is used.\n */\n @Prop({ reflect: true })\n dataNamesOverflow: 'break' | 'truncate';\n\n /**\n * Sets width available for labels on the name axis.\n * It can be used in coordination with `dataNamesOverflow` to control where the label text breaks or truncates.\n */\n @Prop({ reflect: true })\n dataNamesWidth: number;\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 /**\n * Can be used in coordination with the currency format property to control decimal handling.\n * Accepts `Ndec` where N is a number. (e.g. `2dec`)\n */\n @Prop({ reflect: true })\n formatModifier: string;\n\n /** Controls the direction or viibility of grid lines on the chart. */\n @Prop({ reflect: true })\n gridLines: 'horizontal' | 'vertical' | 'off';\n\n /**\n * Sets chart padding around the grid.\n * Each value in the object will be interpreted as pixels.\n *\n * **Example:**\n * @snippet\n * chart.gridPadding = { left: 10, right: 10, top: 20, bottom: 20 };\n */\n @Prop()\n gridPadding: { left?: number; right?: number; top?: number; bottom?: number };\n\n /** Controls visibility of labels on the name axis. */\n @Prop({ reflect: true })\n hideNameAxisLabels: boolean = false;\n\n /** Controls visibility of labels on the value axis. */\n @Prop({ reflect: true })\n hideValueAxisLabels: boolean = false;\n\n /**\n * Controls color of the data line on the chart. Accepts variables, hex codes, and CSS color names.\n *\n * **Examples:**\n * @snippet\n * element.areaColor = \"#ff0000\";\n * element.areaColor = \"papayawhip\";\n * element.areaColor = \"var(--t-accent-1)\";\n */\n @Prop({ reflect: true })\n lineColor: string;\n\n /**\n * Controls the position of text on the names axis by centering the text to the bar at a 45° angle.\n * Can be used when space is limited or with longer name labels.\n */\n @Prop({ reflect: true })\n offsetDataNames: boolean = false;\n\n /**\n * Controls the position of text on the values axis by centering the text to the bar at a 45° angle.\n * Can be used when space is limited or with longer name labels.\n */\n @Prop({ reflect: true })\n offsetDataValues: boolean = false;\n\n /**\n * Controls color of vertical pointer on a line chart. Accepts variables, hex codes, and CSS color names.\n *\n * **Examples:**\n * @snippet\n * element.areaColor = \"#ff0000\";\n * element.areaColor = \"papayawhip\";\n * element.areaColor = \"var(--t-accent-1)\";\n */\n @Prop({ reflect: true })\n pointerLineColor: string;\n\n /** Controls the style of the vertical poiner line. */\n @Prop({ reflect: true })\n pointerLineStyle: 'solid' | 'dashed';\n\n /** Controls the visibility of the chart name at the top of the chart. */\n @Prop({ reflect: true })\n showChartName: boolean = false;\n\n /** Controls the visibility of a value label when a data point is shown on the chart. */\n @Prop({ reflect: true })\n showDatapointLabels: boolean = false;\n\n /**\n * Controls making the area fill color into a gradient.\n * The gradient starts at the top with the `areaColor` value, and fades to white.\n */\n @Prop({ reflect: true })\n showGradient: boolean = false;\n\n // #endregion\n // #region Events\n\n /**\n * Emitted when a data point is clicked.\n */\n @Event()\n change: EventEmitter<{\n index: number;\n data: IChartData;\n }>;\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, and animation frames\n if (this.chart) {\n this.chart.dispose();\n this.chart = null;\n }\n\n // Remove window resize listener\n window.removeEventListener('resize', this.resizeEventListener);\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 and event listener references\n this.chartContainer = null;\n this.resizeEventListener = null;\n }\n\n componentDidLoad() {\n const chart = echarts.init(this.chartContainer);\n\n this.chart = chart;\n\n this.resizeEventListener = () => this.resizeChart();\n window.addEventListener('resize', this.resizeEventListener);\n\n this.cacheComputedStyles();\n this.updateChart(chart);\n this.setupChartEvents(chart);\n\n overrideFocus(this.hostElement);\n }\n\n // #endregion\n // #region Public Methods API\n\n /**\n * A method to fire change event on hover on a point.\n *\n * @testOnly\n */\n @Method()\n async hoverDataPoint(index: number) {\n this.change.emit({\n index: index,\n data: this.data[index],\n });\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('data')\n @Watch('alignChartName')\n @Watch('chartName')\n @Watch('chartSubTitle')\n @Watch('lineColor')\n @Watch('pointerLineColor')\n @Watch('pointerLineStyle')\n @Watch('areaColor')\n @Watch('dataNamesOverflow')\n @Watch('dataNamesWidth')\n @Watch('format')\n @Watch('formatModifier')\n @Watch('hideNameAxisLabels')\n @Watch('hideValueAxisLabels')\n @Watch('offsetDataNames')\n @Watch('offsetDataValues')\n @Watch('showChartName')\n @Watch('showDatapointLabels')\n @Watch('showGradient')\n @Watch('gridLines')\n @Watch('gridPadding')\n propsUpdates() {\n this.updateChart(this.chart);\n }\n\n // #endregion\n // #region Local Methods\n\n cacheComputedStyles() {\n this.chartContainerStyles = getComputedStyle(this.chartContainer);\n this.hostElementStyles = getComputedStyle(this.hostElement);\n }\n\n getAreaFill() {\n if (this.showGradient) {\n return {\n type: 'linear',\n x: 0,\n y: 0,\n x2: 0,\n y2: 1,\n colorStops: [\n {\n offset: 0,\n color: this.getColor(this.areaColor),\n },\n {\n offset: 1,\n color: 'white',\n },\n ],\n global: false,\n };\n }\n return this.getColor(this.areaColor);\n }\n\n getColor(color: string) {\n const primaryColor = getCSSProperty('var(--t-primary)', this.chartContainerStyles, this.hostElementStyles);\n const cssColorProp = getCSSProperty(color, this.chartContainerStyles, this.hostElementStyles);\n if (cssColorProp) return cssColorProp;\n if (isValidColor(color)) return color;\n return primaryColor;\n }\n\n resizeChart() {\n this.chart.resize();\n }\n\n setupChartEvents(chart: echarts.ECharts) {\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 const decimals = this.formatModifier?.includes('dec') ? this.formatModifier.replace('dec', '') : 0;\n\n const valueAxis = {\n type: 'value',\n axisLabel: {\n formatter: (value: number) =>\n formatValue(value, {\n type: this.format,\n decimals,\n }),\n rotate: this.offsetDataValues ? 45 : 0,\n margin: this.offsetDataValues ? 15 : 8,\n show: !this.hideValueAxisLabels,\n },\n splitLine: {\n show: this.gridLines === 'horizontal' || !this.gridLines,\n },\n };\n\n const categoryAxis = {\n type: 'category',\n boundaryGap: false,\n data: this.data.map(datum => loc(datum.name) || ''),\n axisLabel: {\n rotate: this.offsetDataNames ? 45 : 0,\n margin: this.offsetDataNames ? 15 : 8,\n width: this.dataNamesWidth || 50,\n overflow: this.dataNamesOverflow || 'none',\n truncate: 'ellipsis',\n show: !this.hideNameAxisLabels,\n },\n axisLine: {\n show: !this.hideNameAxisLabels,\n },\n axisTick: {\n show: !this.hideNameAxisLabels,\n },\n axisPointer: {\n show: true,\n type: 'line',\n label: {\n show: false,\n formatter: (params: any) => {\n const dataIndex = params.seriesData[0].dataIndex;\n this.change.emit({\n index: dataIndex,\n data: this.data[dataIndex],\n });\n },\n },\n lineStyle: {\n color: this.getColor(this.pointerLineColor || 'var(--t-gray-10)'),\n type: this.pointerLineStyle || 'solid',\n width: 1.5,\n },\n z: 1,\n },\n splitLine: {\n show: this.gridLines === 'vertical',\n },\n };\n\n return chart.setOption<EChartsOption>({\n aria: {\n enabled: true,\n },\n title: {\n text: loc(this.chartName),\n show: this.showChartName,\n left: this.alignChartName,\n subtext: this.chartSubTitle,\n },\n grid: {\n containLabel: true,\n ...this.gridPadding,\n },\n xAxis: categoryAxis,\n yAxis: valueAxis,\n series: [\n {\n data: this.data.map(datum => datum.value || 0),\n id: 'area',\n type: 'line',\n lineStyle: {\n color: this.getColor(this.lineColor),\n },\n itemStyle: {\n color: this.getColor(this.lineColor),\n },\n areaStyle: {\n color: this.getAreaFill(),\n },\n symbolSize: 10,\n showSymbol: false,\n label: {\n show: this.showDatapointLabels,\n position: 'right',\n formatter: (params: any) => {\n return formatValue(params.value as number, {\n type: this.format,\n decimals,\n });\n },\n },\n },\n ],\n });\n }\n\n // #endregion\n // #region Render Methods\n\n render() {\n return (\n <div class=\"container\">\n <div\n ref={el => (this.chartContainer = el)}\n class=\"chart-container\"\n role=\"img\"\n test-id=\"areaChartContainer\"\n ></div>\n </div>\n );\n }\n\n // #endregion\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["install","registers","registerChartView","LineView","registerSeriesModel","LineSeries","registerLayout","layoutPoints","registerVisual","seriesType","reset","seriesModel","data","getData","lineStyle","getModel","getLineStyle","stroke","getVisual","fill","setVisual","registerProcessor","PRIORITY","PROCESSOR","STATISTIC","dataSample","q2ChartAreaCss","echarts.use","AriaComponent","LineChart","CanvasRenderer","UniversalTransition","GridComponent","TitleComponent","Q2ChartArea","constructor","hostRef","this","hideNameAxisLabels","hideValueAxisLabels","offsetDataNames","offsetDataValues","showChartName","showDatapointLabels","showGradient","disconnectedCallback","chart","dispose","window","removeEventListener","resizeEventListener","chartContainerStyles","hostElementStyles","chartContainer","componentDidLoad","echarts.init","resizeChart","addEventListener","cacheComputedStyles","updateChart","setupChartEvents","overrideFocus","hostElement","hoverDataPoint","index","change","emit","propsUpdates","getComputedStyle","getAreaFill","type","x","y","x2","y2","colorStops","offset","color","getColor","areaColor","global","primaryColor","getCSSProperty","cssColorProp","isValidColor","resize","on","canvas","getDom","querySelector","_a","hasAttribute","setAttribute","decimals","formatModifier","includes","replace","valueAxis","axisLabel","formatter","value","formatValue","format","rotate","margin","show","splitLine","gridLines","categoryAxis","boundaryGap","map","datum","loc","name","width","dataNamesWidth","overflow","dataNamesOverflow","truncate","axisLine","axisTick","axisPointer","label","params","dataIndex","seriesData","pointerLineColor","pointerLineStyle","z","setOption","aria","enabled","title","text","chartName","left","alignChartName","subtext","chartSubTitle","grid","Object","assign","containLabel","gridPadding","xAxis","yAxis","series","id","lineColor","itemStyle","areaStyle","symbolSize","showSymbol","position","render","h","key","class","ref","el","role"],"sources":["../../node_modules/.pnpm/echarts@5.6.0/node_modules/echarts/lib/chart/line/install.js","src/components/q2-chart-area/q2-chart-area.scss?tag=q2-chart-area&encapsulation=shadow","src/components/q2-chart-area/q2-chart-area.tsx"],"sourcesContent":["\n/*\n* Licensed to the Apache Software Foundation (ASF) under one\n* or more contributor license agreements. See the NOTICE file\n* distributed with this work for additional information\n* regarding copyright ownership. The ASF licenses this file\n* to you under the Apache License, Version 2.0 (the\n* \"License\"); you may not use this file except in compliance\n* with the License. You may obtain a copy of the License at\n*\n* http://www.apache.org/licenses/LICENSE-2.0\n*\n* Unless required by applicable law or agreed to in writing,\n* software distributed under the License is distributed on an\n* \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n* KIND, either express or implied. See the License for the\n* specific language governing permissions and limitations\n* under the License.\n*/\n\n\n/**\n * AUTO-GENERATED FILE. DO NOT MODIFY.\n */\n\n/*\r\n* Licensed to the Apache Software Foundation (ASF) under one\r\n* or more contributor license agreements. See the NOTICE file\r\n* distributed with this work for additional information\r\n* regarding copyright ownership. The ASF licenses this file\r\n* to you under the Apache License, Version 2.0 (the\r\n* \"License\"); you may not use this file except in compliance\r\n* with the License. You may obtain a copy of the License at\r\n*\r\n* http://www.apache.org/licenses/LICENSE-2.0\r\n*\r\n* Unless required by applicable law or agreed to in writing,\r\n* software distributed under the License is distributed on an\r\n* \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\r\n* KIND, either express or implied. See the License for the\r\n* specific language governing permissions and limitations\r\n* under the License.\r\n*/\nimport LineSeries from './LineSeries.js';\nimport LineView from './LineView.js';\n// In case developer forget to include grid component\nimport layoutPoints from '../../layout/points.js';\nimport dataSample from '../../processor/dataSample.js';\nexport function install(registers) {\n registers.registerChartView(LineView);\n registers.registerSeriesModel(LineSeries);\n registers.registerLayout(layoutPoints('line', true));\n registers.registerVisual({\n seriesType: 'line',\n reset: function (seriesModel) {\n var data = seriesModel.getData();\n // Visual coding for legend\n var lineStyle = seriesModel.getModel('lineStyle').getLineStyle();\n if (lineStyle && !lineStyle.stroke) {\n // Fill in visual should be palette color if\n // has color callback\n lineStyle.stroke = data.getVisual('style').fill;\n }\n data.setVisual('legendLineStyle', lineStyle);\n }\n });\n // Down sample after filter\n registers.registerProcessor(registers.PRIORITY.PROCESSOR.STATISTIC, dataSample('line'));\n}","@import '../../styles/host.scss';\n\n:host {\n width: var(--tct-area-chart-width, 100%);\n height: var(--tct-area-chart-height, 100%);\n display: block;\n}\n\n.container {\n width: 100%;\n height: 100%;\n}\n\n.chart-container {\n width: 100%;\n height: 100%;\n}\n","import { Component, Prop, h, ComponentInterface, Element, Watch, EventEmitter, Event, Method } from '@stencil/core';\nimport * as echarts from 'echarts/core';\nimport {\n TitleComponent,\n TitleComponentOption,\n AriaComponent,\n AriaComponentOption,\n GridComponent,\n} from 'echarts/components';\nimport { LineChart, LineSeriesOption } from 'echarts/charts';\nimport { UniversalTransition } from 'echarts/features';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport { loc, overrideFocus } from 'src/utils';\nimport { getCSSProperty, isValidColor, formatValue } from 'src/utils/charting';\n\nimport type { IChartData } from 'q2-tecton-common/lib/types/element-types';\n\necharts.use([AriaComponent, LineChart, CanvasRenderer, UniversalTransition, GridComponent, TitleComponent]);\n\ntype EChartsOption = echarts.ComposeOption<AriaComponentOption | LineSeriesOption | TitleComponentOption>;\n\n@Component({ tag: 'q2-chart-area', shadow: true, styleUrl: 'q2-chart-area.scss' })\nexport class Q2ChartArea implements ComponentInterface {\n // #region Own Properties\n\n chart: echarts.ECharts;\n chartContainer: HTMLDivElement;\n chartContainerStyles: CSSStyleDeclaration;\n hostElementStyles: CSSStyleDeclaration;\n resizeEventListener: EventListener;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region Public Property API\n\n /** Controls alignment of the chart name when its visible. */\n @Prop({ reflect: true })\n alignChartName: 'left' | 'right' | 'center';\n\n /**\n * Controls area fill color of chart. Accepts variables, hex codes, and CSS color names.\n *\n * **Examples:**\n * @snippet\n * element.areaColor = \"#ff0000\";\n * element.areaColor = \"papayawhip\";\n * element.areaColor = \"var(--t-accent-1)\";\n */\n @Prop({ reflect: true })\n areaColor: string;\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 /** A subtitile to the chart name. Often used to provide a brief description of what the data represents. */\n @Prop({ reflect: true })\n chartSubTitle: string;\n\n /** An array of objects that contain the data to be displayed. */\n @Prop()\n data: IChartData[] = [];\n\n /**\n * Allows control of how labels on the name axis will be handled if the text length is wider than the available space.\n * Values will ellipsize if the truncate option is used.\n */\n @Prop({ reflect: true })\n dataNamesOverflow: 'break' | 'truncate';\n\n /**\n * Sets width available for labels on the name axis.\n * It can be used in coordination with `dataNamesOverflow` to control where the label text breaks or truncates.\n */\n @Prop({ reflect: true })\n dataNamesWidth: number;\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 /**\n * Can be used in coordination with the currency format property to control decimal handling.\n * Accepts `Ndec` where N is a number. (e.g. `2dec`)\n */\n @Prop({ reflect: true })\n formatModifier: string;\n\n /** Controls the direction or viibility of grid lines on the chart. */\n @Prop({ reflect: true })\n gridLines: 'horizontal' | 'vertical' | 'off';\n\n /**\n * Sets chart padding around the grid.\n * Each value in the object will be interpreted as pixels.\n *\n * **Example:**\n * @snippet\n * chart.gridPadding = { left: 10, right: 10, top: 20, bottom: 20 };\n */\n @Prop()\n gridPadding: { left?: number; right?: number; top?: number; bottom?: number };\n\n /** Controls visibility of labels on the name axis. */\n @Prop({ reflect: true })\n hideNameAxisLabels: boolean = false;\n\n /** Controls visibility of labels on the value axis. */\n @Prop({ reflect: true })\n hideValueAxisLabels: boolean = false;\n\n /**\n * Controls color of the data line on the chart. Accepts variables, hex codes, and CSS color names.\n *\n * **Examples:**\n * @snippet\n * element.areaColor = \"#ff0000\";\n * element.areaColor = \"papayawhip\";\n * element.areaColor = \"var(--t-accent-1)\";\n */\n @Prop({ reflect: true })\n lineColor: string;\n\n /**\n * Controls the position of text on the names axis by centering the text to the bar at a 45° angle.\n * Can be used when space is limited or with longer name labels.\n */\n @Prop({ reflect: true })\n offsetDataNames: boolean = false;\n\n /**\n * Controls the position of text on the values axis by centering the text to the bar at a 45° angle.\n * Can be used when space is limited or with longer name labels.\n */\n @Prop({ reflect: true })\n offsetDataValues: boolean = false;\n\n /**\n * Controls color of vertical pointer on a line chart. Accepts variables, hex codes, and CSS color names.\n *\n * **Examples:**\n * @snippet\n * element.areaColor = \"#ff0000\";\n * element.areaColor = \"papayawhip\";\n * element.areaColor = \"var(--t-accent-1)\";\n */\n @Prop({ reflect: true })\n pointerLineColor: string;\n\n /** Controls the style of the vertical poiner line. */\n @Prop({ reflect: true })\n pointerLineStyle: 'solid' | 'dashed';\n\n /** Controls the visibility of the chart name at the top of the chart. */\n @Prop({ reflect: true })\n showChartName: boolean = false;\n\n /** Controls the visibility of a value label when a data point is shown on the chart. */\n @Prop({ reflect: true })\n showDatapointLabels: boolean = false;\n\n /**\n * Controls making the area fill color into a gradient.\n * The gradient starts at the top with the `areaColor` value, and fades to white.\n */\n @Prop({ reflect: true })\n showGradient: boolean = false;\n\n // #endregion\n // #region Events\n\n /**\n * Emitted when a data point is clicked.\n */\n @Event()\n change: EventEmitter<{\n index: number;\n data: IChartData;\n }>;\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, and animation frames\n if (this.chart) {\n this.chart.dispose();\n this.chart = null;\n }\n\n // Remove window resize listener\n window.removeEventListener('resize', this.resizeEventListener);\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 and event listener references\n this.chartContainer = null;\n this.resizeEventListener = null;\n }\n\n componentDidLoad() {\n const chart = echarts.init(this.chartContainer);\n\n this.chart = chart;\n\n this.resizeEventListener = () => this.resizeChart();\n window.addEventListener('resize', this.resizeEventListener);\n\n this.cacheComputedStyles();\n this.updateChart(chart);\n this.setupChartEvents(chart);\n\n overrideFocus(this.hostElement);\n }\n\n // #endregion\n // #region Public Methods API\n\n /**\n * A method to fire change event on hover on a point.\n *\n * @testOnly\n */\n @Method()\n async hoverDataPoint(index: number) {\n this.change.emit({\n index: index,\n data: this.data[index],\n });\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('data')\n @Watch('alignChartName')\n @Watch('chartName')\n @Watch('chartSubTitle')\n @Watch('lineColor')\n @Watch('pointerLineColor')\n @Watch('pointerLineStyle')\n @Watch('areaColor')\n @Watch('dataNamesOverflow')\n @Watch('dataNamesWidth')\n @Watch('format')\n @Watch('formatModifier')\n @Watch('hideNameAxisLabels')\n @Watch('hideValueAxisLabels')\n @Watch('offsetDataNames')\n @Watch('offsetDataValues')\n @Watch('showChartName')\n @Watch('showDatapointLabels')\n @Watch('showGradient')\n @Watch('gridLines')\n @Watch('gridPadding')\n propsUpdates() {\n this.updateChart(this.chart);\n }\n\n // #endregion\n // #region Local Methods\n\n cacheComputedStyles() {\n this.chartContainerStyles = getComputedStyle(this.chartContainer);\n this.hostElementStyles = getComputedStyle(this.hostElement);\n }\n\n getAreaFill() {\n if (this.showGradient) {\n return {\n type: 'linear',\n x: 0,\n y: 0,\n x2: 0,\n y2: 1,\n colorStops: [\n {\n offset: 0,\n color: this.getColor(this.areaColor),\n },\n {\n offset: 1,\n color: 'white',\n },\n ],\n global: false,\n };\n }\n return this.getColor(this.areaColor);\n }\n\n getColor(color: string) {\n const primaryColor = getCSSProperty('var(--t-primary)', this.chartContainerStyles, this.hostElementStyles);\n const cssColorProp = getCSSProperty(color, this.chartContainerStyles, this.hostElementStyles);\n if (cssColorProp) return cssColorProp;\n if (isValidColor(color)) return color;\n return primaryColor;\n }\n\n resizeChart() {\n this.chart.resize();\n }\n\n setupChartEvents(chart: echarts.ECharts) {\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 const decimals = this.formatModifier?.includes('dec') ? this.formatModifier.replace('dec', '') : 0;\n\n const valueAxis = {\n type: 'value',\n axisLabel: {\n formatter: (value: number) =>\n formatValue(value, {\n type: this.format,\n decimals,\n }),\n rotate: this.offsetDataValues ? 45 : 0,\n margin: this.offsetDataValues ? 15 : 8,\n show: !this.hideValueAxisLabels,\n },\n splitLine: {\n show: this.gridLines === 'horizontal' || !this.gridLines,\n },\n };\n\n const categoryAxis = {\n type: 'category',\n boundaryGap: false,\n data: this.data.map(datum => loc(datum.name) || ''),\n axisLabel: {\n rotate: this.offsetDataNames ? 45 : 0,\n margin: this.offsetDataNames ? 15 : 8,\n width: this.dataNamesWidth || 50,\n overflow: this.dataNamesOverflow || 'none',\n truncate: 'ellipsis',\n show: !this.hideNameAxisLabels,\n },\n axisLine: {\n show: !this.hideNameAxisLabels,\n },\n axisTick: {\n show: !this.hideNameAxisLabels,\n },\n axisPointer: {\n show: true,\n type: 'line',\n label: {\n show: false,\n formatter: (params: any) => {\n const dataIndex = params.seriesData[0].dataIndex;\n this.change.emit({\n index: dataIndex,\n data: this.data[dataIndex],\n });\n },\n },\n lineStyle: {\n color: this.getColor(this.pointerLineColor || 'var(--t-gray-10)'),\n type: this.pointerLineStyle || 'solid',\n width: 1.5,\n },\n z: 1,\n },\n splitLine: {\n show: this.gridLines === 'vertical',\n },\n };\n\n return chart.setOption<EChartsOption>({\n aria: {\n enabled: true,\n },\n title: {\n text: loc(this.chartName),\n show: this.showChartName,\n left: this.alignChartName,\n subtext: this.chartSubTitle,\n },\n grid: {\n containLabel: true,\n ...this.gridPadding,\n },\n xAxis: categoryAxis,\n yAxis: valueAxis,\n series: [\n {\n data: this.data.map(datum => datum.value || 0),\n id: 'area',\n type: 'line',\n lineStyle: {\n color: this.getColor(this.lineColor),\n },\n itemStyle: {\n color: this.getColor(this.lineColor),\n },\n areaStyle: {\n color: this.getAreaFill(),\n },\n symbolSize: 10,\n showSymbol: false,\n label: {\n show: this.showDatapointLabels,\n position: 'right',\n formatter: (params: any) => {\n return formatValue(params.value as number, {\n type: this.format,\n decimals,\n });\n },\n },\n },\n ],\n });\n }\n\n // #endregion\n // #region Render Methods\n\n render() {\n return (\n <div class=\"container\">\n <div\n ref={el => (this.chartContainer = el)}\n class=\"chart-container\"\n role=\"img\"\n test-id=\"areaChartContainer\"\n ></div>\n </div>\n );\n }\n\n // #endregion\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"q2-chart-bar.entry.esm.js","sources":["../../node_modules/.pnpm/echarts@5.6.0/node_modules/echarts/lib/chart/bar/install.js","src/components/q2-chart-bar/q2-chart-bar.scss?tag=q2-chart-bar&encapsulation=shadow","src/components/q2-chart-bar/q2-chart-bar.tsx"],"sourcesContent":["\n/*\n* Licensed to the Apache Software Foundation (ASF) under one\n* or more contributor license agreements. See the NOTICE file\n* distributed with this work for additional information\n* regarding copyright ownership. The ASF licenses this file\n* to you under the Apache License, Version 2.0 (the\n* \"License\"); you may not use this file except in compliance\n* with the License. You may obtain a copy of the License at\n*\n* http://www.apache.org/licenses/LICENSE-2.0\n*\n* Unless required by applicable law or agreed to in writing,\n* software distributed under the License is distributed on an\n* \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n* KIND, either express or implied. See the License for the\n* specific language governing permissions and limitations\n* under the License.\n*/\n\n\n/**\n * AUTO-GENERATED FILE. DO NOT MODIFY.\n */\n\n/*\r\n* Licensed to the Apache Software Foundation (ASF) under one\r\n* or more contributor license agreements. See the NOTICE file\r\n* distributed with this work for additional information\r\n* regarding copyright ownership. The ASF licenses this file\r\n* to you under the Apache License, Version 2.0 (the\r\n* \"License\"); you may not use this file except in compliance\r\n* with the License. You may obtain a copy of the License at\r\n*\r\n* http://www.apache.org/licenses/LICENSE-2.0\r\n*\r\n* Unless required by applicable law or agreed to in writing,\r\n* software distributed under the License is distributed on an\r\n* \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\r\n* KIND, either express or implied. See the License for the\r\n* specific language governing permissions and limitations\r\n* under the License.\r\n*/\nimport * as zrUtil from 'zrender/lib/core/util.js';\nimport { layout, createProgressiveLayout } from '../../layout/barGrid.js';\nimport dataSample from '../../processor/dataSample.js';\nimport BarSeries from './BarSeries.js';\nimport BarView from './BarView.js';\nexport function install(registers) {\n registers.registerChartView(BarView);\n registers.registerSeriesModel(BarSeries);\n registers.registerLayout(registers.PRIORITY.VISUAL.LAYOUT, zrUtil.curry(layout, 'bar'));\n // Do layout after other overall layout, which can prepare some information.\n registers.registerLayout(registers.PRIORITY.VISUAL.PROGRESSIVE_LAYOUT, createProgressiveLayout('bar'));\n // Down sample after filter\n registers.registerProcessor(registers.PRIORITY.PROCESSOR.STATISTIC, dataSample('bar'));\n /**\r\n * @payload\r\n * @property {string} [componentType=series]\r\n * @property {number} [dx]\r\n * @property {number} [dy]\r\n * @property {number} [zoom]\r\n * @property {number} [originX]\r\n * @property {number} [originY]\r\n */\n registers.registerAction({\n type: 'changeAxisOrder',\n event: 'changeAxisOrder',\n update: 'update'\n }, function (payload, ecModel) {\n var componentType = payload.componentType || 'series';\n ecModel.eachComponent({\n mainType: componentType,\n query: payload\n }, function (componentModel) {\n if (payload.sortInfo) {\n componentModel.axis.setCategorySortInfo(payload.sortInfo);\n }\n });\n });\n}","@import '../../styles/host.scss';\n\n:host {\n width: var(--tct-bar-chart-width, 100%);\n height: var(--tct-bar-chart-height, 100%);\n display: block;\n}\n\n.container {\n width: 100%;\n height: 100%;\n}\n\n.chart-container {\n width: 100%;\n height: 100%;\n}\n","import { Component, Prop, h, ComponentInterface, Element, Watch } from '@stencil/core';\nimport * as echarts from 'echarts/core';\nimport {\n TitleComponent,\n TitleComponentOption,\n AriaComponent,\n AriaComponentOption,\n GridComponent,\n} from 'echarts/components';\nimport { BarChart, BarSeriesOption } from 'echarts/charts';\nimport { LabelLayout } from 'echarts/features';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport { loc, overrideFocus } from 'src/utils';\nimport { getCSSProperty, isValidColor, formatValue } from 'src/utils/charting';\nimport { CallbackDataParams } from 'echarts/types/dist/shared';\nimport { IChartData } from 'q2-tecton-common/lib/types/element-types';\n\necharts.use([AriaComponent, BarChart, CanvasRenderer, LabelLayout, GridComponent, TitleComponent]);\n\ntype EChartsOption = echarts.ComposeOption<AriaComponentOption | BarSeriesOption | TitleComponentOption>;\n\n@Component({ tag: 'q2-chart-bar', shadow: true, styleUrl: 'q2-chart-bar.scss' })\nexport class Q2ChartBar implements ComponentInterface {\n // #region Own Properties\n\n chart: echarts.ECharts;\n chartContainer: HTMLDivElement;\n chartContainerStyles: CSSStyleDeclaration;\n chartFinishedListener: () => void;\n hostElementStyles: CSSStyleDeclaration;\n resizeEventListener: EventListener;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region Public Property API\n\n /** Controls alignment of the chart name when its visible. */\n @Prop({ reflect: true })\n alignChartName: 'left' | 'right' | 'center';\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 /** A subtitile to the chart name. Often used to provide a brief description of what the data represents. */\n @Prop({ reflect: true })\n chartSubTitle: string;\n\n /**\n * Controls the color of all bars in the chart. Can be overridden at the individual data point level.\n * Accept variables, hex codes, an CSS color names.\n *\n * **Examples:**\n * @snippet\n * element.areaColor = \"#ff0000\";\n * element.areaColor = \"papayawhip\";\n * element.areaColor = \"var(--t-accent-1)\";\n */\n @Prop({ reflect: true })\n color: string;\n\n /** An array of objects that contain the data to be displayed. */\n @Prop()\n data: IChartData[] = [];\n\n /**\n * Allows control of how labels on the name axis will be handled if the text length is wider than the available space.\n * Values will ellipsize if the truncate option is used.\n */\n @Prop({ reflect: true })\n dataNamesOverflow: 'break' | 'truncate';\n\n /**\n * Sets width available for labels on the name axis.\n * It can be used in coordination with `dataNamesOverflow` to control where the label text breaks or truncates.\n */\n @Prop({ reflect: true })\n dataNamesWidth: number;\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 /**\n * Can be used in coordination with the currency format property to control decimal handling.\n * Accepts `Ndec` where N is a number. (e.g. `2dec`)\n */\n @Prop({ reflect: true })\n formatModifier: string;\n\n /**\n * Sets chart padding around the grid.\n * Each value in the object will be interpreted as pixels.\n *\n * **Example:**\n * @snippet\n * chart.gridPadding = { left: 10, right: 10, top: 20, bottom: 20 };\n */\n @Prop()\n gridPadding: { left?: number; right?: number; top?: number; bottom?: number };\n\n /** Controls visibility of labels on the name axis. */\n @Prop({ reflect: true })\n hideBarLabels: boolean = false;\n\n /** Controls visibility of labels on the value axis. */\n @Prop({ reflect: true })\n hideValueAxisLabels: boolean = false;\n\n /**\n * Controls the position of text on the names axis by centering the text to the bar at a 45° angle.\n * Can be used when space is limited or with longer name labels.\n */\n @Prop({ reflect: true })\n offsetDataNames: boolean = false;\n\n /**\n * Controls the position of text on the values axis by centering the text to the bar at a 45° angle.\n * Can be used when space is limited or with longer name labels.\n */\n @Prop({ reflect: true })\n offsetDataValues: boolean = false;\n\n /**\n * Controls which axes are the value and name axes.\n * When `vertical`, values are on the y-axis and names are on the x-axis, with bars shown vertically on the chart.\n * When `horizontal`, names are on the y-axis and values are on the x-axis, with bars shown horizontally on the chart.\n */\n @Prop({ reflect: true })\n orientation: 'vertical' | 'horizontal';\n\n /** Controls the visibility of the chart name at the top of the chart. */\n @Prop({ reflect: true })\n showChartName: boolean = false;\n\n /**\n * By default, the sorting of the bars on the chart is controlled by the order the values are in the data array.\n * When set to `true`, values on the bar will be re-sorted in descending order.\n */\n @Prop({ reflect: true })\n sort: boolean = false;\n\n // #endregion\n // #region Component Lifecycle Events\n\n disconnectedCallback() {\n // Remove event listeners\n window.removeEventListener('resize', this.resizeEventListener);\n\n // Clean up chart instance\n if (this.chart) {\n if (this.chartFinishedListener) {\n this.chart.off('finished', this.chartFinishedListener);\n }\n this.chart.dispose();\n this.chart = null;\n }\n\n // Null out cached computed styles to allow GC\n this.chartContainerStyles = null;\n this.hostElementStyles = null;\n\n // Null out DOM references\n this.chartContainer = null;\n this.resizeEventListener = null;\n this.chartFinishedListener = null;\n }\n\n componentDidLoad() {\n const chart = echarts.init(this.chartContainer);\n\n this.chart = chart;\n\n this.resizeEventListener = () => this.resizeChart();\n window.addEventListener('resize', this.resizeEventListener);\n\n this.cacheComputedStyles();\n this.updateChart(chart);\n this.setupChartEvents(chart);\n\n overrideFocus(this.hostElement);\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('chartName')\n @Watch('chartSubTitle')\n @Watch('color')\n @Watch('hideBarLabels')\n @Watch('showChartName')\n @Watch('alignChartName')\n @Watch('orientation')\n @Watch('format')\n @Watch('sort')\n @Watch('data')\n @Watch('offsetDataNames')\n @Watch('hideValueAxisLabels')\n @Watch('formatModifier')\n @Watch('dataNamesOverflow')\n @Watch('gridPadding')\n propsUpdates() {\n this.updateChart(this.chart);\n }\n\n // #endregion\n // #region Local Methods\n\n cacheComputedStyles() {\n this.chartContainerStyles = getComputedStyle(this.chartContainer);\n this.hostElementStyles = getComputedStyle(this.hostElement);\n }\n\n getColor(color: string) {\n const primaryColor = getCSSProperty('var(--t-primary)', this.chartContainerStyles, this.hostElementStyles);\n const seriesColor = getCSSProperty(this.color, this.chartContainerStyles, this.hostElementStyles);\n const cssColorProp = getCSSProperty(color, this.chartContainerStyles, this.hostElementStyles);\n if (cssColorProp) return cssColorProp;\n if (isValidColor(color)) return color;\n if (seriesColor) return seriesColor;\n if (isValidColor(this.color)) return this.color;\n return primaryColor;\n }\n\n processData(data: IChartData[]) {\n return data.map(datum => {\n return {\n value: datum.value || 0,\n itemStyle: {\n color: this.getColor(datum.color),\n },\n };\n });\n }\n\n resizeChart() {\n this.chart.resize();\n }\n\n setupChartEvents(chart: echarts.ECharts) {\n this.chartFinishedListener = () => {\n const canvas = chart.getDom().querySelector('canvas');\n if (canvas?.hasAttribute('aria-hidden') ?? false) return;\n canvas.setAttribute('aria-hidden', 'true');\n };\n chart.on('finished', this.chartFinishedListener);\n }\n\n updateChart(chart: echarts.ECharts) {\n const decimals = this.formatModifier?.includes('dec') ? this.formatModifier.replace('dec', '') : 0;\n\n const valueAxis = {\n type: 'value',\n axisLabel: {\n formatter: (value: number) =>\n formatValue(value, {\n type: this.format,\n decimals,\n }),\n rotate: this.offsetDataValues ? 45 : 0,\n margin: this.offsetDataValues ? 15 : 8,\n show: !this.hideValueAxisLabels,\n },\n };\n\n const categoryAxis = {\n type: 'category',\n data: this.data.map(datum => loc(datum.name) || ''),\n axisLabel: {\n rotate: this.offsetDataNames ? 45 : 0,\n margin: this.offsetDataNames ? 15 : 8,\n interval: 0,\n width: this.dataNamesWidth || 50,\n overflow: this.dataNamesOverflow || 'none',\n truncate: 'ellipsis',\n },\n axisTick: {\n alignWithLabel: this.offsetDataNames,\n },\n };\n\n return chart.setOption<EChartsOption>({\n aria: {\n enabled: true,\n },\n title: {\n text: loc(this.chartName),\n show: this.showChartName,\n left: this.alignChartName,\n subtext: this.chartSubTitle,\n },\n grid: {\n containLabel: true,\n ...this.gridPadding,\n },\n xAxis: this.orientation === 'horizontal' ? valueAxis : categoryAxis,\n yAxis: this.orientation === 'horizontal' ? categoryAxis : valueAxis,\n series: [\n {\n data: this.processData(this.data),\n id: 'bar',\n type: 'bar',\n label: {\n show: !this.hideBarLabels,\n position: 'top',\n fontWeight: 'bold',\n formatter: (params: CallbackDataParams) => {\n return formatValue(params.value as number, {\n type: this.format,\n decimals,\n });\n },\n },\n realtimeSort: this.sort,\n },\n ],\n });\n }\n\n // #endregion\n // #region Render Methods\n\n render() {\n return (\n <div class=\"container\">\n <div\n ref={el => (this.chartContainer = el)}\n class=\"chart-container\"\n role=\"img\"\n test-id=\"barChartContainer\"\n ></div>\n </div>\n );\n }\n\n // #endregion\n}\n"],"names":["BarSeries","zrUtil.curry","echarts.use","AriaComponent","BarChart","CanvasRenderer","LabelLayout","GridComponent","TitleComponent","echarts.init"],"mappings":"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","x_google_ignoreList":[0]}
|
|
1
|
+
{"version":3,"file":"q2-chart-bar.entry.esm.js","sources":["../../node_modules/.pnpm/echarts@5.6.0/node_modules/echarts/lib/chart/bar/install.js","src/components/q2-chart-bar/q2-chart-bar.scss?tag=q2-chart-bar&encapsulation=shadow","src/components/q2-chart-bar/q2-chart-bar.tsx"],"sourcesContent":["\n/*\n* Licensed to the Apache Software Foundation (ASF) under one\n* or more contributor license agreements. See the NOTICE file\n* distributed with this work for additional information\n* regarding copyright ownership. The ASF licenses this file\n* to you under the Apache License, Version 2.0 (the\n* \"License\"); you may not use this file except in compliance\n* with the License. You may obtain a copy of the License at\n*\n* http://www.apache.org/licenses/LICENSE-2.0\n*\n* Unless required by applicable law or agreed to in writing,\n* software distributed under the License is distributed on an\n* \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n* KIND, either express or implied. See the License for the\n* specific language governing permissions and limitations\n* under the License.\n*/\n\n\n/**\n * AUTO-GENERATED FILE. DO NOT MODIFY.\n */\n\n/*\r\n* Licensed to the Apache Software Foundation (ASF) under one\r\n* or more contributor license agreements. See the NOTICE file\r\n* distributed with this work for additional information\r\n* regarding copyright ownership. The ASF licenses this file\r\n* to you under the Apache License, Version 2.0 (the\r\n* \"License\"); you may not use this file except in compliance\r\n* with the License. You may obtain a copy of the License at\r\n*\r\n* http://www.apache.org/licenses/LICENSE-2.0\r\n*\r\n* Unless required by applicable law or agreed to in writing,\r\n* software distributed under the License is distributed on an\r\n* \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\r\n* KIND, either express or implied. See the License for the\r\n* specific language governing permissions and limitations\r\n* under the License.\r\n*/\nimport * as zrUtil from 'zrender/lib/core/util.js';\nimport { layout, createProgressiveLayout } from '../../layout/barGrid.js';\nimport dataSample from '../../processor/dataSample.js';\nimport BarSeries from './BarSeries.js';\nimport BarView from './BarView.js';\nexport function install(registers) {\n registers.registerChartView(BarView);\n registers.registerSeriesModel(BarSeries);\n registers.registerLayout(registers.PRIORITY.VISUAL.LAYOUT, zrUtil.curry(layout, 'bar'));\n // Do layout after other overall layout, which can prepare some information.\n registers.registerLayout(registers.PRIORITY.VISUAL.PROGRESSIVE_LAYOUT, createProgressiveLayout('bar'));\n // Down sample after filter\n registers.registerProcessor(registers.PRIORITY.PROCESSOR.STATISTIC, dataSample('bar'));\n /**\r\n * @payload\r\n * @property {string} [componentType=series]\r\n * @property {number} [dx]\r\n * @property {number} [dy]\r\n * @property {number} [zoom]\r\n * @property {number} [originX]\r\n * @property {number} [originY]\r\n */\n registers.registerAction({\n type: 'changeAxisOrder',\n event: 'changeAxisOrder',\n update: 'update'\n }, function (payload, ecModel) {\n var componentType = payload.componentType || 'series';\n ecModel.eachComponent({\n mainType: componentType,\n query: payload\n }, function (componentModel) {\n if (payload.sortInfo) {\n componentModel.axis.setCategorySortInfo(payload.sortInfo);\n }\n });\n });\n}","@import '../../styles/host.scss';\n\n:host {\n width: var(--tct-bar-chart-width, 100%);\n height: var(--tct-bar-chart-height, 100%);\n display: block;\n}\n\n.container {\n width: 100%;\n height: 100%;\n}\n\n.chart-container {\n width: 100%;\n height: 100%;\n}\n","import { Component, Prop, h, ComponentInterface, Element, Watch } from '@stencil/core';\nimport * as echarts from 'echarts/core';\nimport {\n TitleComponent,\n TitleComponentOption,\n AriaComponent,\n AriaComponentOption,\n GridComponent,\n} from 'echarts/components';\nimport { BarChart, BarSeriesOption } from 'echarts/charts';\nimport { LabelLayout } from 'echarts/features';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport { loc, overrideFocus } from 'src/utils';\nimport { getCSSProperty, isValidColor, formatValue } from 'src/utils/charting';\nimport type { CallbackDataParams } from 'echarts/types/dist/shared';\nimport type { IChartData } from 'q2-tecton-common/lib/types/element-types';\n\necharts.use([AriaComponent, BarChart, CanvasRenderer, LabelLayout, GridComponent, TitleComponent]);\n\ntype EChartsOption = echarts.ComposeOption<AriaComponentOption | BarSeriesOption | TitleComponentOption>;\n\n@Component({ tag: 'q2-chart-bar', shadow: true, styleUrl: 'q2-chart-bar.scss' })\nexport class Q2ChartBar implements ComponentInterface {\n // #region Own Properties\n\n chart: echarts.ECharts;\n chartContainer: HTMLDivElement;\n chartContainerStyles: CSSStyleDeclaration;\n chartFinishedListener: () => void;\n hostElementStyles: CSSStyleDeclaration;\n resizeEventListener: EventListener;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region Public Property API\n\n /** Controls alignment of the chart name when its visible. */\n @Prop({ reflect: true })\n alignChartName: 'left' | 'right' | 'center';\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 /** A subtitile to the chart name. Often used to provide a brief description of what the data represents. */\n @Prop({ reflect: true })\n chartSubTitle: string;\n\n /**\n * Controls the color of all bars in the chart. Can be overridden at the individual data point level.\n * Accept variables, hex codes, an CSS color names.\n *\n * **Examples:**\n * @snippet\n * element.areaColor = \"#ff0000\";\n * element.areaColor = \"papayawhip\";\n * element.areaColor = \"var(--t-accent-1)\";\n */\n @Prop({ reflect: true })\n color: string;\n\n /** An array of objects that contain the data to be displayed. */\n @Prop()\n data: IChartData[] = [];\n\n /**\n * Allows control of how labels on the name axis will be handled if the text length is wider than the available space.\n * Values will ellipsize if the truncate option is used.\n */\n @Prop({ reflect: true })\n dataNamesOverflow: 'break' | 'truncate';\n\n /**\n * Sets width available for labels on the name axis.\n * It can be used in coordination with `dataNamesOverflow` to control where the label text breaks or truncates.\n */\n @Prop({ reflect: true })\n dataNamesWidth: number;\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 /**\n * Can be used in coordination with the currency format property to control decimal handling.\n * Accepts `Ndec` where N is a number. (e.g. `2dec`)\n */\n @Prop({ reflect: true })\n formatModifier: string;\n\n /**\n * Sets chart padding around the grid.\n * Each value in the object will be interpreted as pixels.\n *\n * **Example:**\n * @snippet\n * chart.gridPadding = { left: 10, right: 10, top: 20, bottom: 20 };\n */\n @Prop()\n gridPadding: { left?: number; right?: number; top?: number; bottom?: number };\n\n /** Controls visibility of labels on the name axis. */\n @Prop({ reflect: true })\n hideBarLabels: boolean = false;\n\n /** Controls visibility of labels on the value axis. */\n @Prop({ reflect: true })\n hideValueAxisLabels: boolean = false;\n\n /**\n * Controls the position of text on the names axis by centering the text to the bar at a 45° angle.\n * Can be used when space is limited or with longer name labels.\n */\n @Prop({ reflect: true })\n offsetDataNames: boolean = false;\n\n /**\n * Controls the position of text on the values axis by centering the text to the bar at a 45° angle.\n * Can be used when space is limited or with longer name labels.\n */\n @Prop({ reflect: true })\n offsetDataValues: boolean = false;\n\n /**\n * Controls which axes are the value and name axes.\n * When `vertical`, values are on the y-axis and names are on the x-axis, with bars shown vertically on the chart.\n * When `horizontal`, names are on the y-axis and values are on the x-axis, with bars shown horizontally on the chart.\n */\n @Prop({ reflect: true })\n orientation: 'vertical' | 'horizontal';\n\n /** Controls the visibility of the chart name at the top of the chart. */\n @Prop({ reflect: true })\n showChartName: boolean = false;\n\n /**\n * By default, the sorting of the bars on the chart is controlled by the order the values are in the data array.\n * When set to `true`, values on the bar will be re-sorted in descending order.\n */\n @Prop({ reflect: true })\n sort: boolean = false;\n\n // #endregion\n // #region Component Lifecycle Events\n\n disconnectedCallback() {\n // Remove event listeners\n window.removeEventListener('resize', this.resizeEventListener);\n\n // Clean up chart instance\n if (this.chart) {\n if (this.chartFinishedListener) {\n this.chart.off('finished', this.chartFinishedListener);\n }\n this.chart.dispose();\n this.chart = null;\n }\n\n // Null out cached computed styles to allow GC\n this.chartContainerStyles = null;\n this.hostElementStyles = null;\n\n // Null out DOM references\n this.chartContainer = null;\n this.resizeEventListener = null;\n this.chartFinishedListener = null;\n }\n\n componentDidLoad() {\n const chart = echarts.init(this.chartContainer);\n\n this.chart = chart;\n\n this.resizeEventListener = () => this.resizeChart();\n window.addEventListener('resize', this.resizeEventListener);\n\n this.cacheComputedStyles();\n this.updateChart(chart);\n this.setupChartEvents(chart);\n\n overrideFocus(this.hostElement);\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('chartName')\n @Watch('chartSubTitle')\n @Watch('color')\n @Watch('hideBarLabels')\n @Watch('showChartName')\n @Watch('alignChartName')\n @Watch('orientation')\n @Watch('format')\n @Watch('sort')\n @Watch('data')\n @Watch('offsetDataNames')\n @Watch('hideValueAxisLabels')\n @Watch('formatModifier')\n @Watch('dataNamesOverflow')\n @Watch('gridPadding')\n propsUpdates() {\n this.updateChart(this.chart);\n }\n\n // #endregion\n // #region Local Methods\n\n cacheComputedStyles() {\n this.chartContainerStyles = getComputedStyle(this.chartContainer);\n this.hostElementStyles = getComputedStyle(this.hostElement);\n }\n\n getColor(color: string) {\n const primaryColor = getCSSProperty('var(--t-primary)', this.chartContainerStyles, this.hostElementStyles);\n const seriesColor = getCSSProperty(this.color, this.chartContainerStyles, this.hostElementStyles);\n const cssColorProp = getCSSProperty(color, this.chartContainerStyles, this.hostElementStyles);\n if (cssColorProp) return cssColorProp;\n if (isValidColor(color)) return color;\n if (seriesColor) return seriesColor;\n if (isValidColor(this.color)) return this.color;\n return primaryColor;\n }\n\n processData(data: IChartData[]) {\n return data.map(datum => {\n return {\n value: datum.value || 0,\n itemStyle: {\n color: this.getColor(datum.color),\n },\n };\n });\n }\n\n resizeChart() {\n this.chart.resize();\n }\n\n setupChartEvents(chart: echarts.ECharts) {\n this.chartFinishedListener = () => {\n const canvas = chart.getDom().querySelector('canvas');\n if (canvas?.hasAttribute('aria-hidden') ?? false) return;\n canvas.setAttribute('aria-hidden', 'true');\n };\n chart.on('finished', this.chartFinishedListener);\n }\n\n updateChart(chart: echarts.ECharts) {\n const decimals = this.formatModifier?.includes('dec') ? this.formatModifier.replace('dec', '') : 0;\n\n const valueAxis = {\n type: 'value',\n axisLabel: {\n formatter: (value: number) =>\n formatValue(value, {\n type: this.format,\n decimals,\n }),\n rotate: this.offsetDataValues ? 45 : 0,\n margin: this.offsetDataValues ? 15 : 8,\n show: !this.hideValueAxisLabels,\n },\n };\n\n const categoryAxis = {\n type: 'category',\n data: this.data.map(datum => loc(datum.name) || ''),\n axisLabel: {\n rotate: this.offsetDataNames ? 45 : 0,\n margin: this.offsetDataNames ? 15 : 8,\n interval: 0,\n width: this.dataNamesWidth || 50,\n overflow: this.dataNamesOverflow || 'none',\n truncate: 'ellipsis',\n },\n axisTick: {\n alignWithLabel: this.offsetDataNames,\n },\n };\n\n return chart.setOption<EChartsOption>({\n aria: {\n enabled: true,\n },\n title: {\n text: loc(this.chartName),\n show: this.showChartName,\n left: this.alignChartName,\n subtext: this.chartSubTitle,\n },\n grid: {\n containLabel: true,\n ...this.gridPadding,\n },\n xAxis: this.orientation === 'horizontal' ? valueAxis : categoryAxis,\n yAxis: this.orientation === 'horizontal' ? categoryAxis : valueAxis,\n series: [\n {\n data: this.processData(this.data),\n id: 'bar',\n type: 'bar',\n label: {\n show: !this.hideBarLabels,\n position: 'top',\n fontWeight: 'bold',\n formatter: (params: CallbackDataParams) => {\n return formatValue(params.value as number, {\n type: this.format,\n decimals,\n });\n },\n },\n realtimeSort: this.sort,\n },\n ],\n });\n }\n\n // #endregion\n // #region Render Methods\n\n render() {\n return (\n <div class=\"container\">\n <div\n ref={el => (this.chartContainer = el)}\n class=\"chart-container\"\n role=\"img\"\n test-id=\"barChartContainer\"\n ></div>\n </div>\n );\n }\n\n // #endregion\n}\n"],"names":["BarSeries","zrUtil.curry","echarts.use","AriaComponent","BarChart","CanvasRenderer","LabelLayout","GridComponent","TitleComponent","echarts.init"],"mappings":"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","x_google_ignoreList":[0]}
|
|
@@ -201,10 +201,10 @@ const U = class {
|
|
|
201
201
|
// #region Render Methods
|
|
202
202
|
render() {
|
|
203
203
|
return s("div", {
|
|
204
|
-
key: "
|
|
204
|
+
key: "7b6e9ef642df64d9fe4eabd7e830f682c55ba3ef",
|
|
205
205
|
class: "container"
|
|
206
206
|
}, s("div", {
|
|
207
|
-
key: "
|
|
207
|
+
key: "dba3992a647c06c6a64af2b381a734703b05790c",
|
|
208
208
|
ref: t => this.chartContainer = t,
|
|
209
209
|
class: "chart-container",
|
|
210
210
|
role: "img",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["install","registers","registerChartView","BarView","registerSeriesModel","BarSeries","registerLayout","PRIORITY","VISUAL","LAYOUT","zrUtil.curry","layout","PROGRESSIVE_LAYOUT","createProgressiveLayout","registerProcessor","PROCESSOR","STATISTIC","dataSample","registerAction","type","event","update","payload","ecModel","componentType","eachComponent","mainType","query","componentModel","sortInfo","axis","setCategorySortInfo","q2ChartBarCss","echarts.use","AriaComponent","BarChart","CanvasRenderer","LabelLayout","GridComponent","TitleComponent","Q2ChartBar","constructor","hostRef","this","data","hideBarLabels","hideValueAxisLabels","offsetDataNames","offsetDataValues","showChartName","sort","disconnectedCallback","window","removeEventListener","resizeEventListener","chart","chartFinishedListener","off","dispose","chartContainerStyles","hostElementStyles","chartContainer","componentDidLoad","echarts.init","resizeChart","addEventListener","cacheComputedStyles","updateChart","setupChartEvents","overrideFocus","hostElement","propsUpdates","getComputedStyle","getColor","color","primaryColor","getCSSProperty","seriesColor","cssColorProp","isValidColor","processData","map","datum","value","itemStyle","resize","canvas","getDom","querySelector","_a","hasAttribute","setAttribute","on","decimals","formatModifier","includes","replace","valueAxis","axisLabel","formatter","formatValue","format","rotate","margin","show","categoryAxis","loc","name","interval","width","dataNamesWidth","overflow","dataNamesOverflow","truncate","axisTick","alignWithLabel","setOption","aria","enabled","title","text","chartName","left","alignChartName","subtext","chartSubTitle","grid","Object","assign","containLabel","gridPadding","xAxis","orientation","yAxis","series","id","label","position","fontWeight","params","realtimeSort","render","h","key","class","ref","el","role"],"sources":["../../node_modules/.pnpm/echarts@5.6.0/node_modules/echarts/lib/chart/bar/install.js","src/components/q2-chart-bar/q2-chart-bar.scss?tag=q2-chart-bar&encapsulation=shadow","src/components/q2-chart-bar/q2-chart-bar.tsx"],"sourcesContent":["\n/*\n* Licensed to the Apache Software Foundation (ASF) under one\n* or more contributor license agreements. See the NOTICE file\n* distributed with this work for additional information\n* regarding copyright ownership. The ASF licenses this file\n* to you under the Apache License, Version 2.0 (the\n* \"License\"); you may not use this file except in compliance\n* with the License. You may obtain a copy of the License at\n*\n* http://www.apache.org/licenses/LICENSE-2.0\n*\n* Unless required by applicable law or agreed to in writing,\n* software distributed under the License is distributed on an\n* \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n* KIND, either express or implied. See the License for the\n* specific language governing permissions and limitations\n* under the License.\n*/\n\n\n/**\n * AUTO-GENERATED FILE. DO NOT MODIFY.\n */\n\n/*\r\n* Licensed to the Apache Software Foundation (ASF) under one\r\n* or more contributor license agreements. See the NOTICE file\r\n* distributed with this work for additional information\r\n* regarding copyright ownership. The ASF licenses this file\r\n* to you under the Apache License, Version 2.0 (the\r\n* \"License\"); you may not use this file except in compliance\r\n* with the License. You may obtain a copy of the License at\r\n*\r\n* http://www.apache.org/licenses/LICENSE-2.0\r\n*\r\n* Unless required by applicable law or agreed to in writing,\r\n* software distributed under the License is distributed on an\r\n* \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\r\n* KIND, either express or implied. See the License for the\r\n* specific language governing permissions and limitations\r\n* under the License.\r\n*/\nimport * as zrUtil from 'zrender/lib/core/util.js';\nimport { layout, createProgressiveLayout } from '../../layout/barGrid.js';\nimport dataSample from '../../processor/dataSample.js';\nimport BarSeries from './BarSeries.js';\nimport BarView from './BarView.js';\nexport function install(registers) {\n registers.registerChartView(BarView);\n registers.registerSeriesModel(BarSeries);\n registers.registerLayout(registers.PRIORITY.VISUAL.LAYOUT, zrUtil.curry(layout, 'bar'));\n // Do layout after other overall layout, which can prepare some information.\n registers.registerLayout(registers.PRIORITY.VISUAL.PROGRESSIVE_LAYOUT, createProgressiveLayout('bar'));\n // Down sample after filter\n registers.registerProcessor(registers.PRIORITY.PROCESSOR.STATISTIC, dataSample('bar'));\n /**\r\n * @payload\r\n * @property {string} [componentType=series]\r\n * @property {number} [dx]\r\n * @property {number} [dy]\r\n * @property {number} [zoom]\r\n * @property {number} [originX]\r\n * @property {number} [originY]\r\n */\n registers.registerAction({\n type: 'changeAxisOrder',\n event: 'changeAxisOrder',\n update: 'update'\n }, function (payload, ecModel) {\n var componentType = payload.componentType || 'series';\n ecModel.eachComponent({\n mainType: componentType,\n query: payload\n }, function (componentModel) {\n if (payload.sortInfo) {\n componentModel.axis.setCategorySortInfo(payload.sortInfo);\n }\n });\n });\n}","@import '../../styles/host.scss';\n\n:host {\n width: var(--tct-bar-chart-width, 100%);\n height: var(--tct-bar-chart-height, 100%);\n display: block;\n}\n\n.container {\n width: 100%;\n height: 100%;\n}\n\n.chart-container {\n width: 100%;\n height: 100%;\n}\n","import { Component, Prop, h, ComponentInterface, Element, Watch } from '@stencil/core';\nimport * as echarts from 'echarts/core';\nimport {\n TitleComponent,\n TitleComponentOption,\n AriaComponent,\n AriaComponentOption,\n GridComponent,\n} from 'echarts/components';\nimport { BarChart, BarSeriesOption } from 'echarts/charts';\nimport { LabelLayout } from 'echarts/features';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport { loc, overrideFocus } from 'src/utils';\nimport { getCSSProperty, isValidColor, formatValue } from 'src/utils/charting';\nimport { CallbackDataParams } from 'echarts/types/dist/shared';\nimport { IChartData } from 'q2-tecton-common/lib/types/element-types';\n\necharts.use([AriaComponent, BarChart, CanvasRenderer, LabelLayout, GridComponent, TitleComponent]);\n\ntype EChartsOption = echarts.ComposeOption<AriaComponentOption | BarSeriesOption | TitleComponentOption>;\n\n@Component({ tag: 'q2-chart-bar', shadow: true, styleUrl: 'q2-chart-bar.scss' })\nexport class Q2ChartBar implements ComponentInterface {\n // #region Own Properties\n\n chart: echarts.ECharts;\n chartContainer: HTMLDivElement;\n chartContainerStyles: CSSStyleDeclaration;\n chartFinishedListener: () => void;\n hostElementStyles: CSSStyleDeclaration;\n resizeEventListener: EventListener;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region Public Property API\n\n /** Controls alignment of the chart name when its visible. */\n @Prop({ reflect: true })\n alignChartName: 'left' | 'right' | 'center';\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 /** A subtitile to the chart name. Often used to provide a brief description of what the data represents. */\n @Prop({ reflect: true })\n chartSubTitle: string;\n\n /**\n * Controls the color of all bars in the chart. Can be overridden at the individual data point level.\n * Accept variables, hex codes, an CSS color names.\n *\n * **Examples:**\n * @snippet\n * element.areaColor = \"#ff0000\";\n * element.areaColor = \"papayawhip\";\n * element.areaColor = \"var(--t-accent-1)\";\n */\n @Prop({ reflect: true })\n color: string;\n\n /** An array of objects that contain the data to be displayed. */\n @Prop()\n data: IChartData[] = [];\n\n /**\n * Allows control of how labels on the name axis will be handled if the text length is wider than the available space.\n * Values will ellipsize if the truncate option is used.\n */\n @Prop({ reflect: true })\n dataNamesOverflow: 'break' | 'truncate';\n\n /**\n * Sets width available for labels on the name axis.\n * It can be used in coordination with `dataNamesOverflow` to control where the label text breaks or truncates.\n */\n @Prop({ reflect: true })\n dataNamesWidth: number;\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 /**\n * Can be used in coordination with the currency format property to control decimal handling.\n * Accepts `Ndec` where N is a number. (e.g. `2dec`)\n */\n @Prop({ reflect: true })\n formatModifier: string;\n\n /**\n * Sets chart padding around the grid.\n * Each value in the object will be interpreted as pixels.\n *\n * **Example:**\n * @snippet\n * chart.gridPadding = { left: 10, right: 10, top: 20, bottom: 20 };\n */\n @Prop()\n gridPadding: { left?: number; right?: number; top?: number; bottom?: number };\n\n /** Controls visibility of labels on the name axis. */\n @Prop({ reflect: true })\n hideBarLabels: boolean = false;\n\n /** Controls visibility of labels on the value axis. */\n @Prop({ reflect: true })\n hideValueAxisLabels: boolean = false;\n\n /**\n * Controls the position of text on the names axis by centering the text to the bar at a 45° angle.\n * Can be used when space is limited or with longer name labels.\n */\n @Prop({ reflect: true })\n offsetDataNames: boolean = false;\n\n /**\n * Controls the position of text on the values axis by centering the text to the bar at a 45° angle.\n * Can be used when space is limited or with longer name labels.\n */\n @Prop({ reflect: true })\n offsetDataValues: boolean = false;\n\n /**\n * Controls which axes are the value and name axes.\n * When `vertical`, values are on the y-axis and names are on the x-axis, with bars shown vertically on the chart.\n * When `horizontal`, names are on the y-axis and values are on the x-axis, with bars shown horizontally on the chart.\n */\n @Prop({ reflect: true })\n orientation: 'vertical' | 'horizontal';\n\n /** Controls the visibility of the chart name at the top of the chart. */\n @Prop({ reflect: true })\n showChartName: boolean = false;\n\n /**\n * By default, the sorting of the bars on the chart is controlled by the order the values are in the data array.\n * When set to `true`, values on the bar will be re-sorted in descending order.\n */\n @Prop({ reflect: true })\n sort: boolean = false;\n\n // #endregion\n // #region Component Lifecycle Events\n\n disconnectedCallback() {\n // Remove event listeners\n window.removeEventListener('resize', this.resizeEventListener);\n\n // Clean up chart instance\n if (this.chart) {\n if (this.chartFinishedListener) {\n this.chart.off('finished', this.chartFinishedListener);\n }\n this.chart.dispose();\n this.chart = null;\n }\n\n // Null out cached computed styles to allow GC\n this.chartContainerStyles = null;\n this.hostElementStyles = null;\n\n // Null out DOM references\n this.chartContainer = null;\n this.resizeEventListener = null;\n this.chartFinishedListener = null;\n }\n\n componentDidLoad() {\n const chart = echarts.init(this.chartContainer);\n\n this.chart = chart;\n\n this.resizeEventListener = () => this.resizeChart();\n window.addEventListener('resize', this.resizeEventListener);\n\n this.cacheComputedStyles();\n this.updateChart(chart);\n this.setupChartEvents(chart);\n\n overrideFocus(this.hostElement);\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('chartName')\n @Watch('chartSubTitle')\n @Watch('color')\n @Watch('hideBarLabels')\n @Watch('showChartName')\n @Watch('alignChartName')\n @Watch('orientation')\n @Watch('format')\n @Watch('sort')\n @Watch('data')\n @Watch('offsetDataNames')\n @Watch('hideValueAxisLabels')\n @Watch('formatModifier')\n @Watch('dataNamesOverflow')\n @Watch('gridPadding')\n propsUpdates() {\n this.updateChart(this.chart);\n }\n\n // #endregion\n // #region Local Methods\n\n cacheComputedStyles() {\n this.chartContainerStyles = getComputedStyle(this.chartContainer);\n this.hostElementStyles = getComputedStyle(this.hostElement);\n }\n\n getColor(color: string) {\n const primaryColor = getCSSProperty('var(--t-primary)', this.chartContainerStyles, this.hostElementStyles);\n const seriesColor = getCSSProperty(this.color, this.chartContainerStyles, this.hostElementStyles);\n const cssColorProp = getCSSProperty(color, this.chartContainerStyles, this.hostElementStyles);\n if (cssColorProp) return cssColorProp;\n if (isValidColor(color)) return color;\n if (seriesColor) return seriesColor;\n if (isValidColor(this.color)) return this.color;\n return primaryColor;\n }\n\n processData(data: IChartData[]) {\n return data.map(datum => {\n return {\n value: datum.value || 0,\n itemStyle: {\n color: this.getColor(datum.color),\n },\n };\n });\n }\n\n resizeChart() {\n this.chart.resize();\n }\n\n setupChartEvents(chart: echarts.ECharts) {\n this.chartFinishedListener = () => {\n const canvas = chart.getDom().querySelector('canvas');\n if (canvas?.hasAttribute('aria-hidden') ?? false) return;\n canvas.setAttribute('aria-hidden', 'true');\n };\n chart.on('finished', this.chartFinishedListener);\n }\n\n updateChart(chart: echarts.ECharts) {\n const decimals = this.formatModifier?.includes('dec') ? this.formatModifier.replace('dec', '') : 0;\n\n const valueAxis = {\n type: 'value',\n axisLabel: {\n formatter: (value: number) =>\n formatValue(value, {\n type: this.format,\n decimals,\n }),\n rotate: this.offsetDataValues ? 45 : 0,\n margin: this.offsetDataValues ? 15 : 8,\n show: !this.hideValueAxisLabels,\n },\n };\n\n const categoryAxis = {\n type: 'category',\n data: this.data.map(datum => loc(datum.name) || ''),\n axisLabel: {\n rotate: this.offsetDataNames ? 45 : 0,\n margin: this.offsetDataNames ? 15 : 8,\n interval: 0,\n width: this.dataNamesWidth || 50,\n overflow: this.dataNamesOverflow || 'none',\n truncate: 'ellipsis',\n },\n axisTick: {\n alignWithLabel: this.offsetDataNames,\n },\n };\n\n return chart.setOption<EChartsOption>({\n aria: {\n enabled: true,\n },\n title: {\n text: loc(this.chartName),\n show: this.showChartName,\n left: this.alignChartName,\n subtext: this.chartSubTitle,\n },\n grid: {\n containLabel: true,\n ...this.gridPadding,\n },\n xAxis: this.orientation === 'horizontal' ? valueAxis : categoryAxis,\n yAxis: this.orientation === 'horizontal' ? categoryAxis : valueAxis,\n series: [\n {\n data: this.processData(this.data),\n id: 'bar',\n type: 'bar',\n label: {\n show: !this.hideBarLabels,\n position: 'top',\n fontWeight: 'bold',\n formatter: (params: CallbackDataParams) => {\n return formatValue(params.value as number, {\n type: this.format,\n decimals,\n });\n },\n },\n realtimeSort: this.sort,\n },\n ],\n });\n }\n\n // #endregion\n // #region Render Methods\n\n render() {\n return (\n <div class=\"container\">\n <div\n ref={el => (this.chartContainer = el)}\n class=\"chart-container\"\n role=\"img\"\n test-id=\"barChartContainer\"\n ></div>\n </div>\n );\n }\n\n // #endregion\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["install","registers","registerChartView","BarView","registerSeriesModel","BarSeries","registerLayout","PRIORITY","VISUAL","LAYOUT","zrUtil.curry","layout","PROGRESSIVE_LAYOUT","createProgressiveLayout","registerProcessor","PROCESSOR","STATISTIC","dataSample","registerAction","type","event","update","payload","ecModel","componentType","eachComponent","mainType","query","componentModel","sortInfo","axis","setCategorySortInfo","q2ChartBarCss","echarts.use","AriaComponent","BarChart","CanvasRenderer","LabelLayout","GridComponent","TitleComponent","Q2ChartBar","constructor","hostRef","this","data","hideBarLabels","hideValueAxisLabels","offsetDataNames","offsetDataValues","showChartName","sort","disconnectedCallback","window","removeEventListener","resizeEventListener","chart","chartFinishedListener","off","dispose","chartContainerStyles","hostElementStyles","chartContainer","componentDidLoad","echarts.init","resizeChart","addEventListener","cacheComputedStyles","updateChart","setupChartEvents","overrideFocus","hostElement","propsUpdates","getComputedStyle","getColor","color","primaryColor","getCSSProperty","seriesColor","cssColorProp","isValidColor","processData","map","datum","value","itemStyle","resize","canvas","getDom","querySelector","_a","hasAttribute","setAttribute","on","decimals","formatModifier","includes","replace","valueAxis","axisLabel","formatter","formatValue","format","rotate","margin","show","categoryAxis","loc","name","interval","width","dataNamesWidth","overflow","dataNamesOverflow","truncate","axisTick","alignWithLabel","setOption","aria","enabled","title","text","chartName","left","alignChartName","subtext","chartSubTitle","grid","Object","assign","containLabel","gridPadding","xAxis","orientation","yAxis","series","id","label","position","fontWeight","params","realtimeSort","render","h","key","class","ref","el","role"],"sources":["../../node_modules/.pnpm/echarts@5.6.0/node_modules/echarts/lib/chart/bar/install.js","src/components/q2-chart-bar/q2-chart-bar.scss?tag=q2-chart-bar&encapsulation=shadow","src/components/q2-chart-bar/q2-chart-bar.tsx"],"sourcesContent":["\n/*\n* Licensed to the Apache Software Foundation (ASF) under one\n* or more contributor license agreements. See the NOTICE file\n* distributed with this work for additional information\n* regarding copyright ownership. The ASF licenses this file\n* to you under the Apache License, Version 2.0 (the\n* \"License\"); you may not use this file except in compliance\n* with the License. You may obtain a copy of the License at\n*\n* http://www.apache.org/licenses/LICENSE-2.0\n*\n* Unless required by applicable law or agreed to in writing,\n* software distributed under the License is distributed on an\n* \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n* KIND, either express or implied. See the License for the\n* specific language governing permissions and limitations\n* under the License.\n*/\n\n\n/**\n * AUTO-GENERATED FILE. DO NOT MODIFY.\n */\n\n/*\r\n* Licensed to the Apache Software Foundation (ASF) under one\r\n* or more contributor license agreements. See the NOTICE file\r\n* distributed with this work for additional information\r\n* regarding copyright ownership. The ASF licenses this file\r\n* to you under the Apache License, Version 2.0 (the\r\n* \"License\"); you may not use this file except in compliance\r\n* with the License. You may obtain a copy of the License at\r\n*\r\n* http://www.apache.org/licenses/LICENSE-2.0\r\n*\r\n* Unless required by applicable law or agreed to in writing,\r\n* software distributed under the License is distributed on an\r\n* \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\r\n* KIND, either express or implied. See the License for the\r\n* specific language governing permissions and limitations\r\n* under the License.\r\n*/\nimport * as zrUtil from 'zrender/lib/core/util.js';\nimport { layout, createProgressiveLayout } from '../../layout/barGrid.js';\nimport dataSample from '../../processor/dataSample.js';\nimport BarSeries from './BarSeries.js';\nimport BarView from './BarView.js';\nexport function install(registers) {\n registers.registerChartView(BarView);\n registers.registerSeriesModel(BarSeries);\n registers.registerLayout(registers.PRIORITY.VISUAL.LAYOUT, zrUtil.curry(layout, 'bar'));\n // Do layout after other overall layout, which can prepare some information.\n registers.registerLayout(registers.PRIORITY.VISUAL.PROGRESSIVE_LAYOUT, createProgressiveLayout('bar'));\n // Down sample after filter\n registers.registerProcessor(registers.PRIORITY.PROCESSOR.STATISTIC, dataSample('bar'));\n /**\r\n * @payload\r\n * @property {string} [componentType=series]\r\n * @property {number} [dx]\r\n * @property {number} [dy]\r\n * @property {number} [zoom]\r\n * @property {number} [originX]\r\n * @property {number} [originY]\r\n */\n registers.registerAction({\n type: 'changeAxisOrder',\n event: 'changeAxisOrder',\n update: 'update'\n }, function (payload, ecModel) {\n var componentType = payload.componentType || 'series';\n ecModel.eachComponent({\n mainType: componentType,\n query: payload\n }, function (componentModel) {\n if (payload.sortInfo) {\n componentModel.axis.setCategorySortInfo(payload.sortInfo);\n }\n });\n });\n}","@import '../../styles/host.scss';\n\n:host {\n width: var(--tct-bar-chart-width, 100%);\n height: var(--tct-bar-chart-height, 100%);\n display: block;\n}\n\n.container {\n width: 100%;\n height: 100%;\n}\n\n.chart-container {\n width: 100%;\n height: 100%;\n}\n","import { Component, Prop, h, ComponentInterface, Element, Watch } from '@stencil/core';\nimport * as echarts from 'echarts/core';\nimport {\n TitleComponent,\n TitleComponentOption,\n AriaComponent,\n AriaComponentOption,\n GridComponent,\n} from 'echarts/components';\nimport { BarChart, BarSeriesOption } from 'echarts/charts';\nimport { LabelLayout } from 'echarts/features';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport { loc, overrideFocus } from 'src/utils';\nimport { getCSSProperty, isValidColor, formatValue } from 'src/utils/charting';\nimport type { CallbackDataParams } from 'echarts/types/dist/shared';\nimport type { IChartData } from 'q2-tecton-common/lib/types/element-types';\n\necharts.use([AriaComponent, BarChart, CanvasRenderer, LabelLayout, GridComponent, TitleComponent]);\n\ntype EChartsOption = echarts.ComposeOption<AriaComponentOption | BarSeriesOption | TitleComponentOption>;\n\n@Component({ tag: 'q2-chart-bar', shadow: true, styleUrl: 'q2-chart-bar.scss' })\nexport class Q2ChartBar implements ComponentInterface {\n // #region Own Properties\n\n chart: echarts.ECharts;\n chartContainer: HTMLDivElement;\n chartContainerStyles: CSSStyleDeclaration;\n chartFinishedListener: () => void;\n hostElementStyles: CSSStyleDeclaration;\n resizeEventListener: EventListener;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region Public Property API\n\n /** Controls alignment of the chart name when its visible. */\n @Prop({ reflect: true })\n alignChartName: 'left' | 'right' | 'center';\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 /** A subtitile to the chart name. Often used to provide a brief description of what the data represents. */\n @Prop({ reflect: true })\n chartSubTitle: string;\n\n /**\n * Controls the color of all bars in the chart. Can be overridden at the individual data point level.\n * Accept variables, hex codes, an CSS color names.\n *\n * **Examples:**\n * @snippet\n * element.areaColor = \"#ff0000\";\n * element.areaColor = \"papayawhip\";\n * element.areaColor = \"var(--t-accent-1)\";\n */\n @Prop({ reflect: true })\n color: string;\n\n /** An array of objects that contain the data to be displayed. */\n @Prop()\n data: IChartData[] = [];\n\n /**\n * Allows control of how labels on the name axis will be handled if the text length is wider than the available space.\n * Values will ellipsize if the truncate option is used.\n */\n @Prop({ reflect: true })\n dataNamesOverflow: 'break' | 'truncate';\n\n /**\n * Sets width available for labels on the name axis.\n * It can be used in coordination with `dataNamesOverflow` to control where the label text breaks or truncates.\n */\n @Prop({ reflect: true })\n dataNamesWidth: number;\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 /**\n * Can be used in coordination with the currency format property to control decimal handling.\n * Accepts `Ndec` where N is a number. (e.g. `2dec`)\n */\n @Prop({ reflect: true })\n formatModifier: string;\n\n /**\n * Sets chart padding around the grid.\n * Each value in the object will be interpreted as pixels.\n *\n * **Example:**\n * @snippet\n * chart.gridPadding = { left: 10, right: 10, top: 20, bottom: 20 };\n */\n @Prop()\n gridPadding: { left?: number; right?: number; top?: number; bottom?: number };\n\n /** Controls visibility of labels on the name axis. */\n @Prop({ reflect: true })\n hideBarLabels: boolean = false;\n\n /** Controls visibility of labels on the value axis. */\n @Prop({ reflect: true })\n hideValueAxisLabels: boolean = false;\n\n /**\n * Controls the position of text on the names axis by centering the text to the bar at a 45° angle.\n * Can be used when space is limited or with longer name labels.\n */\n @Prop({ reflect: true })\n offsetDataNames: boolean = false;\n\n /**\n * Controls the position of text on the values axis by centering the text to the bar at a 45° angle.\n * Can be used when space is limited or with longer name labels.\n */\n @Prop({ reflect: true })\n offsetDataValues: boolean = false;\n\n /**\n * Controls which axes are the value and name axes.\n * When `vertical`, values are on the y-axis and names are on the x-axis, with bars shown vertically on the chart.\n * When `horizontal`, names are on the y-axis and values are on the x-axis, with bars shown horizontally on the chart.\n */\n @Prop({ reflect: true })\n orientation: 'vertical' | 'horizontal';\n\n /** Controls the visibility of the chart name at the top of the chart. */\n @Prop({ reflect: true })\n showChartName: boolean = false;\n\n /**\n * By default, the sorting of the bars on the chart is controlled by the order the values are in the data array.\n * When set to `true`, values on the bar will be re-sorted in descending order.\n */\n @Prop({ reflect: true })\n sort: boolean = false;\n\n // #endregion\n // #region Component Lifecycle Events\n\n disconnectedCallback() {\n // Remove event listeners\n window.removeEventListener('resize', this.resizeEventListener);\n\n // Clean up chart instance\n if (this.chart) {\n if (this.chartFinishedListener) {\n this.chart.off('finished', this.chartFinishedListener);\n }\n this.chart.dispose();\n this.chart = null;\n }\n\n // Null out cached computed styles to allow GC\n this.chartContainerStyles = null;\n this.hostElementStyles = null;\n\n // Null out DOM references\n this.chartContainer = null;\n this.resizeEventListener = null;\n this.chartFinishedListener = null;\n }\n\n componentDidLoad() {\n const chart = echarts.init(this.chartContainer);\n\n this.chart = chart;\n\n this.resizeEventListener = () => this.resizeChart();\n window.addEventListener('resize', this.resizeEventListener);\n\n this.cacheComputedStyles();\n this.updateChart(chart);\n this.setupChartEvents(chart);\n\n overrideFocus(this.hostElement);\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('chartName')\n @Watch('chartSubTitle')\n @Watch('color')\n @Watch('hideBarLabels')\n @Watch('showChartName')\n @Watch('alignChartName')\n @Watch('orientation')\n @Watch('format')\n @Watch('sort')\n @Watch('data')\n @Watch('offsetDataNames')\n @Watch('hideValueAxisLabels')\n @Watch('formatModifier')\n @Watch('dataNamesOverflow')\n @Watch('gridPadding')\n propsUpdates() {\n this.updateChart(this.chart);\n }\n\n // #endregion\n // #region Local Methods\n\n cacheComputedStyles() {\n this.chartContainerStyles = getComputedStyle(this.chartContainer);\n this.hostElementStyles = getComputedStyle(this.hostElement);\n }\n\n getColor(color: string) {\n const primaryColor = getCSSProperty('var(--t-primary)', this.chartContainerStyles, this.hostElementStyles);\n const seriesColor = getCSSProperty(this.color, this.chartContainerStyles, this.hostElementStyles);\n const cssColorProp = getCSSProperty(color, this.chartContainerStyles, this.hostElementStyles);\n if (cssColorProp) return cssColorProp;\n if (isValidColor(color)) return color;\n if (seriesColor) return seriesColor;\n if (isValidColor(this.color)) return this.color;\n return primaryColor;\n }\n\n processData(data: IChartData[]) {\n return data.map(datum => {\n return {\n value: datum.value || 0,\n itemStyle: {\n color: this.getColor(datum.color),\n },\n };\n });\n }\n\n resizeChart() {\n this.chart.resize();\n }\n\n setupChartEvents(chart: echarts.ECharts) {\n this.chartFinishedListener = () => {\n const canvas = chart.getDom().querySelector('canvas');\n if (canvas?.hasAttribute('aria-hidden') ?? false) return;\n canvas.setAttribute('aria-hidden', 'true');\n };\n chart.on('finished', this.chartFinishedListener);\n }\n\n updateChart(chart: echarts.ECharts) {\n const decimals = this.formatModifier?.includes('dec') ? this.formatModifier.replace('dec', '') : 0;\n\n const valueAxis = {\n type: 'value',\n axisLabel: {\n formatter: (value: number) =>\n formatValue(value, {\n type: this.format,\n decimals,\n }),\n rotate: this.offsetDataValues ? 45 : 0,\n margin: this.offsetDataValues ? 15 : 8,\n show: !this.hideValueAxisLabels,\n },\n };\n\n const categoryAxis = {\n type: 'category',\n data: this.data.map(datum => loc(datum.name) || ''),\n axisLabel: {\n rotate: this.offsetDataNames ? 45 : 0,\n margin: this.offsetDataNames ? 15 : 8,\n interval: 0,\n width: this.dataNamesWidth || 50,\n overflow: this.dataNamesOverflow || 'none',\n truncate: 'ellipsis',\n },\n axisTick: {\n alignWithLabel: this.offsetDataNames,\n },\n };\n\n return chart.setOption<EChartsOption>({\n aria: {\n enabled: true,\n },\n title: {\n text: loc(this.chartName),\n show: this.showChartName,\n left: this.alignChartName,\n subtext: this.chartSubTitle,\n },\n grid: {\n containLabel: true,\n ...this.gridPadding,\n },\n xAxis: this.orientation === 'horizontal' ? valueAxis : categoryAxis,\n yAxis: this.orientation === 'horizontal' ? categoryAxis : valueAxis,\n series: [\n {\n data: this.processData(this.data),\n id: 'bar',\n type: 'bar',\n label: {\n show: !this.hideBarLabels,\n position: 'top',\n fontWeight: 'bold',\n formatter: (params: CallbackDataParams) => {\n return formatValue(params.value as number, {\n type: this.format,\n decimals,\n });\n },\n },\n realtimeSort: this.sort,\n },\n ],\n });\n }\n\n // #endregion\n // #region Render Methods\n\n render() {\n return (\n <div class=\"container\">\n <div\n ref={el => (this.chartContainer = el)}\n class=\"chart-container\"\n role=\"img\"\n test-id=\"barChartContainer\"\n ></div>\n </div>\n );\n }\n\n // #endregion\n}\n"],"mappings":"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","ignoreList":[]}
|