@watermarkinsights/ripple 0.0.0 → 0.1.0-alpha.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/LICENSE +21 -0
- package/README.md +1 -1
- package/dist/cjs/app-globals-f836e216.js +103 -0
- package/dist/cjs/chartFunctions-608adb05.js +908 -0
- package/dist/cjs/{functions-f2333f02.js → functions-b188d5b3.js} +6137 -1590
- package/dist/cjs/index-786066a1.js +1880 -0
- package/dist/cjs/interfaces-8419be91.js +59 -0
- package/dist/cjs/intl-01531391.js +283 -0
- package/dist/cjs/loader.cjs.js +7 -14
- package/dist/cjs/priv-calendar.cjs.entry.js +608 -0
- package/dist/cjs/priv-chart-popover-old.cjs.entry.js +146 -0
- package/dist/cjs/priv-chart-popover_2.cjs.entry.js +194 -0
- package/dist/cjs/priv-navigator-button.cjs.entry.js +19 -19
- package/dist/cjs/priv-navigator-item.cjs.entry.js +24 -23
- package/dist/cjs/priv-option-list.cjs.entry.js +391 -0
- package/dist/cjs/ripple.cjs.js +25 -0
- package/dist/cjs/wm-action-menu_2.cjs.entry.js +471 -302
- package/dist/cjs/wm-button.cjs.entry.js +263 -142
- package/dist/cjs/wm-chart-bar.cjs.entry.js +441 -0
- package/dist/cjs/wm-chart-column.cjs.entry.js +544 -0
- package/dist/cjs/wm-chart-slice.cjs.entry.js +17 -12
- package/dist/cjs/wm-chart.cjs.entry.js +133 -478
- package/dist/cjs/wm-date-range.cjs.entry.js +526 -0
- package/dist/cjs/wm-datepicker.cjs.entry.js +285 -224
- package/dist/cjs/wm-file-list.cjs.entry.js +23 -0
- package/dist/cjs/wm-file.cjs.entry.js +210 -0
- package/dist/cjs/wm-flyout.cjs.entry.js +181 -0
- package/dist/cjs/wm-input.cjs.entry.js +121 -100
- package/dist/cjs/wm-line-chart.cjs.entry.js +541 -0
- package/dist/cjs/wm-modal-pss_3.cjs.entry.js +220 -0
- package/dist/cjs/wm-modal_3.cjs.entry.js +223 -0
- package/dist/cjs/wm-navigation_3.cjs.entry.js +188 -0
- package/dist/cjs/wm-navigator.cjs.entry.js +305 -250
- package/dist/cjs/wm-nested-select.cjs.entry.js +320 -0
- package/dist/cjs/wm-optgroup.cjs.entry.js +74 -0
- package/dist/cjs/wm-option_2.cjs.entry.js +517 -465
- package/dist/cjs/wm-pagination.cjs.entry.js +218 -165
- package/dist/cjs/wm-progress-indicator_3.cjs.entry.js +204 -0
- package/dist/cjs/wm-search.cjs.entry.js +182 -217
- package/dist/cjs/wm-snackbar.cjs.entry.js +158 -142
- package/dist/cjs/wm-tab-item_3.cjs.entry.js +317 -276
- package/dist/cjs/wm-tag-input.cjs.entry.js +940 -500
- package/dist/cjs/wm-tag-option.cjs.entry.js +43 -0
- package/dist/cjs/wm-textarea.cjs.entry.js +94 -0
- package/dist/cjs/wm-timepicker.cjs.entry.js +276 -349
- package/dist/cjs/wm-toggletip.cjs.entry.js +238 -114
- package/dist/cjs/wm-uploader.cjs.entry.js +322 -323
- package/dist/cjs/wm-wrapper.cjs.entry.js +12 -12
- package/dist/collection/collection-manifest.json +104 -34
- package/dist/collection/components/charts/chartFunctions.js +833 -0
- package/dist/collection/components/charts/priv-chart-popover/priv-chart-popover.css +995 -0
- package/dist/collection/components/charts/priv-chart-popover/priv-chart-popover.js +340 -0
- package/dist/collection/components/charts/priv-chart-popover-old/priv-chart-popover-old.css +990 -0
- package/dist/collection/components/charts/priv-chart-popover-old/priv-chart-popover-old.js +263 -0
- package/dist/collection/components/charts/wm-chart/wm-chart-slice.js +125 -0
- package/dist/collection/components/charts/wm-chart/wm-chart.css +1326 -0
- package/dist/collection/components/charts/wm-chart/wm-chart.js +422 -0
- package/dist/collection/components/charts/wm-chart-bar/wm-chart-bar.css +1116 -0
- package/dist/collection/components/charts/wm-chart-bar/wm-chart-bar.js +579 -0
- package/dist/collection/components/charts/wm-chart-column/wm-chart-column.css +1169 -0
- package/dist/collection/components/charts/wm-chart-column/wm-chart-column.js +688 -0
- package/dist/collection/components/charts/wm-chart-legend/wm-chart-legend.css +932 -0
- package/dist/collection/components/charts/wm-chart-legend/wm-chart-legend.js +194 -0
- package/dist/collection/components/charts/wm-line-chart/wm-line-chart.css +1208 -0
- package/dist/collection/components/charts/wm-line-chart/wm-line-chart.js +862 -0
- package/dist/collection/components/charts/wm-progress-monitor/wm-progress-indicator.css +1326 -0
- package/dist/collection/components/charts/wm-progress-monitor/wm-progress-indicator.js +264 -0
- package/dist/collection/components/charts/wm-progress-monitor/wm-progress-monitor.css +967 -0
- package/dist/collection/components/charts/wm-progress-monitor/wm-progress-monitor.js +151 -0
- package/dist/collection/components/charts/wm-progress-monitor/wm-progress-slice.js +121 -0
- package/dist/collection/components/datepickers/datepicker.css +1137 -0
- package/dist/collection/components/datepickers/priv-calendar/priv-calendar.css +1403 -0
- package/dist/collection/components/datepickers/priv-calendar/priv-calendar.js +881 -0
- package/dist/collection/components/datepickers/wm-date-range.js +870 -0
- package/dist/collection/components/datepickers/wm-datepicker.js +579 -0
- package/dist/collection/components/selects/priv-option-list/priv-option-list.css +999 -0
- package/dist/collection/components/selects/priv-option-list/priv-option-list.js +778 -0
- package/dist/collection/components/selects/wm-nested-select/wm-nested-select.css +1259 -0
- package/dist/collection/components/selects/wm-nested-select/wm-nested-select.js +626 -0
- package/dist/collection/components/selects/wm-optgroup/wm-optgroup.css +909 -0
- package/dist/collection/components/selects/wm-optgroup/wm-optgroup.js +258 -0
- package/dist/collection/components/selects/wm-option/wm-option.css +1033 -0
- package/dist/collection/components/selects/wm-option/wm-option.js +530 -0
- package/dist/collection/components/selects/wm-select/wm-select.css +1187 -0
- package/dist/collection/components/selects/wm-select/wm-select.js +705 -0
- package/dist/collection/components/wm-action-menu/wm-action-menu.css +1614 -50
- package/dist/collection/components/wm-action-menu/wm-action-menu.js +605 -387
- package/dist/collection/components/wm-button/wm-button.css +1440 -385
- package/dist/collection/components/wm-button/wm-button.js +538 -348
- package/dist/collection/components/wm-file/wm-file.css +1086 -0
- package/dist/collection/components/wm-file/wm-file.js +428 -0
- package/dist/collection/components/wm-file-list/wm-file-list.css +899 -0
- package/dist/collection/components/wm-file-list/wm-file-list.js +45 -0
- package/dist/collection/components/wm-flyout/wm-flyout.css +1117 -0
- package/dist/collection/components/wm-flyout/wm-flyout.js +449 -0
- package/dist/collection/components/wm-input/wm-input.css +965 -96
- package/dist/collection/components/wm-input/wm-input.js +466 -291
- package/dist/collection/components/wm-menuitem/wm-menuitem.css +919 -55
- package/dist/collection/components/wm-menuitem/wm-menuitem.js +402 -397
- package/dist/collection/components/wm-modal/wm-modal-footer.css +871 -28
- package/dist/collection/components/wm-modal/wm-modal-footer.js +139 -156
- package/dist/collection/components/wm-modal/wm-modal-header.css +864 -16
- package/dist/collection/components/wm-modal/wm-modal-header.js +76 -106
- package/dist/collection/components/wm-modal/wm-modal.css +921 -93
- package/dist/collection/components/wm-modal/wm-modal.js +337 -337
- package/dist/collection/components/wm-modal-pss/wm-modal-pss-footer.css +931 -0
- package/dist/collection/components/wm-modal-pss/wm-modal-pss-footer.js +138 -0
- package/dist/collection/components/wm-modal-pss/wm-modal-pss-header.css +925 -0
- package/dist/collection/components/wm-modal-pss/wm-modal-pss-header.js +82 -0
- package/dist/collection/components/wm-modal-pss/wm-modal-pss.css +1007 -0
- package/dist/collection/components/wm-modal-pss/wm-modal-pss.js +365 -0
- package/dist/collection/components/wm-navigation/wm-navigation-hamburger.css +926 -0
- package/dist/collection/components/wm-navigation/wm-navigation-hamburger.js +119 -0
- package/dist/collection/components/wm-navigation/wm-navigation-item.css +935 -0
- package/dist/collection/components/wm-navigation/wm-navigation-item.js +98 -0
- package/dist/collection/components/wm-navigation/wm-navigation.css +977 -0
- package/dist/collection/components/wm-navigation/wm-navigation.js +190 -0
- package/dist/collection/components/wm-navigator/priv-navigator-button/priv-navigator-button.css +868 -33
- package/dist/collection/components/wm-navigator/priv-navigator-button/priv-navigator-button.js +83 -94
- package/dist/collection/components/wm-navigator/priv-navigator-item/priv-navigator-item.css +876 -25
- package/dist/collection/components/wm-navigator/priv-navigator-item/priv-navigator-item.js +120 -110
- package/dist/collection/components/wm-navigator/wm-navigator.css +891 -38
- package/dist/collection/components/wm-navigator/wm-navigator.js +491 -456
- package/dist/collection/components/wm-pagination/wm-pagination.css +895 -68
- package/dist/collection/components/wm-pagination/wm-pagination.js +374 -340
- package/dist/collection/components/wm-search/wm-search.css +895 -73
- package/dist/collection/components/wm-search/wm-search.js +411 -421
- package/dist/collection/components/wm-snackbar/wm-snackbar.css +979 -160
- package/dist/collection/components/wm-snackbar/wm-snackbar.js +258 -235
- package/dist/collection/components/wm-tabs/wm-tab-item/wm-tab-item.css +904 -50
- package/dist/collection/components/wm-tabs/wm-tab-item/wm-tab-item.js +162 -198
- package/dist/collection/components/wm-tabs/wm-tab-list/wm-tab-list.css +922 -29
- package/dist/collection/components/wm-tabs/wm-tab-list/wm-tab-list.js +334 -292
- package/dist/collection/components/wm-tabs/wm-tab-panel/wm-tab-panel.css +862 -13
- package/dist/collection/components/wm-tabs/wm-tab-panel/wm-tab-panel.js +83 -100
- package/dist/collection/components/wm-tag-input/wm-tag-input.css +1212 -200
- package/dist/collection/components/wm-tag-input/wm-tag-input.js +1283 -702
- package/dist/collection/components/wm-tag-input/wm-tag-option/wm-tag-option.js +243 -0
- package/dist/collection/components/wm-textarea/wm-textarea.css +1065 -0
- package/dist/collection/components/wm-textarea/wm-textarea.js +319 -0
- package/dist/collection/components/wm-timepicker/wm-timepicker.css +962 -168
- package/dist/collection/components/wm-timepicker/wm-timepicker.js +539 -553
- package/dist/collection/components/wm-toggletip/wm-toggletip.css +1094 -148
- package/dist/collection/components/wm-toggletip/wm-toggletip.js +370 -211
- package/dist/collection/components/wm-uploader/wm-uploader.css +1756 -438
- package/dist/collection/components/wm-uploader/wm-uploader.js +607 -661
- package/dist/collection/components/wm-wrapper/wm-wrapper.js +26 -25
- package/dist/collection/dev/action-menu.js +18 -0
- package/dist/collection/dev/chart-bar.js +423 -0
- package/dist/collection/dev/chart-column.js +437 -0
- package/dist/collection/dev/chart-small.js +56 -0
- package/dist/collection/dev/chart.js +18 -0
- package/dist/collection/dev/date-range.js +6 -0
- package/dist/collection/dev/datepicker.js +46 -0
- package/dist/collection/dev/file-list.js +16 -0
- package/dist/collection/dev/file.js +0 -0
- package/dist/collection/dev/flyout.js +194 -0
- package/dist/collection/dev/input.js +6 -0
- package/dist/collection/dev/line-chart.js +45 -0
- package/dist/collection/dev/modal.js +48 -0
- package/dist/collection/dev/navigation.js +13 -0
- package/dist/collection/dev/navigator.js +34 -0
- package/dist/collection/dev/nested-select.js +36 -0
- package/dist/collection/dev/pagination.js +7 -0
- package/dist/collection/dev/progress-monitor.js +0 -0
- package/dist/collection/dev/pss-modal.js +8 -0
- package/dist/collection/dev/scripts.js +43 -14
- package/dist/collection/dev/search.js +72 -0
- package/dist/collection/dev/select.js +57 -0
- package/dist/collection/dev/snackbar.js +68 -0
- package/dist/collection/dev/tabs.js +44 -0
- package/dist/collection/dev/tag-input.js +32 -0
- package/dist/collection/dev/textarea.js +28 -0
- package/dist/collection/dev/timepicker.js +32 -0
- package/dist/collection/dev/toggletip.js +9 -0
- package/dist/collection/dev/uploader.js +139 -0
- package/dist/collection/global/__mocks__/functions.js +2 -1
- package/dist/collection/global/functions.js +853 -371
- package/dist/collection/global/global.js +88 -28
- package/dist/collection/global/interfaces.js +62 -39
- package/dist/collection/global/intl.js +274 -0
- package/dist/collection/global/services/__mocks__/http-service.js +112 -112
- package/dist/collection/global/services/http-service.js +41 -41
- package/dist/collection/lang/missing.js +43 -0
- package/dist/collection/lang/piglatin.js +11 -3
- package/dist/esm/app-globals-d0ca31a6.js +101 -0
- package/dist/esm/chartFunctions-4bc77b76.js +883 -0
- package/dist/esm/{functions-60034bf7.js → functions-de887809.js} +6110 -1584
- package/dist/esm/index-ef50bc01.js +1849 -0
- package/dist/esm/interfaces-7e50d034.js +55 -0
- package/dist/esm/intl-56b47a7b.js +277 -0
- package/dist/esm/loader.js +7 -14
- package/dist/esm/priv-calendar.entry.js +604 -0
- package/dist/esm/priv-chart-popover-old.entry.js +142 -0
- package/dist/esm/priv-chart-popover_2.entry.js +189 -0
- package/dist/esm/priv-navigator-button.entry.js +19 -19
- package/dist/esm/priv-navigator-item.entry.js +24 -23
- package/dist/esm/priv-option-list.entry.js +387 -0
- package/dist/esm/ripple.js +20 -0
- package/dist/esm/wm-action-menu_2.entry.js +471 -302
- package/dist/esm/wm-button.entry.js +263 -142
- package/dist/esm/wm-chart-bar.entry.js +437 -0
- package/dist/esm/wm-chart-column.entry.js +540 -0
- package/dist/esm/wm-chart-slice.entry.js +17 -12
- package/dist/esm/wm-chart.entry.js +133 -478
- package/dist/esm/wm-date-range.entry.js +522 -0
- package/dist/esm/wm-datepicker.entry.js +285 -224
- package/dist/esm/wm-file-list.entry.js +19 -0
- package/dist/esm/wm-file.entry.js +206 -0
- package/dist/esm/wm-flyout.entry.js +177 -0
- package/dist/esm/wm-input.entry.js +121 -100
- package/dist/esm/wm-line-chart.entry.js +537 -0
- package/dist/esm/wm-modal-pss_3.entry.js +214 -0
- package/dist/esm/wm-modal_3.entry.js +217 -0
- package/dist/esm/wm-navigation_3.entry.js +182 -0
- package/dist/esm/wm-navigator.entry.js +305 -250
- package/dist/esm/wm-nested-select.entry.js +316 -0
- package/dist/esm/wm-optgroup.entry.js +70 -0
- package/dist/esm/wm-option_2.entry.js +517 -465
- package/dist/esm/wm-pagination.entry.js +218 -165
- package/dist/esm/wm-progress-indicator_3.entry.js +198 -0
- package/dist/esm/wm-search.entry.js +182 -217
- package/dist/esm/wm-snackbar.entry.js +158 -142
- package/dist/esm/wm-tab-item_3.entry.js +317 -276
- package/dist/esm/wm-tag-input.entry.js +940 -500
- package/dist/esm/wm-tag-option.entry.js +39 -0
- package/dist/esm/wm-textarea.entry.js +90 -0
- package/dist/esm/wm-timepicker.entry.js +276 -349
- package/dist/esm/wm-toggletip.entry.js +238 -114
- package/dist/esm/wm-uploader.entry.js +322 -323
- package/dist/esm/wm-wrapper.entry.js +12 -12
- package/dist/esm-es5/app-globals-d0ca31a6.js +1 -0
- package/dist/esm-es5/chartFunctions-4bc77b76.js +1 -0
- package/dist/esm-es5/functions-de887809.js +1 -0
- package/dist/esm-es5/index-ef50bc01.js +1 -0
- package/dist/esm-es5/index.js +0 -0
- package/dist/esm-es5/interfaces-7e50d034.js +1 -0
- package/dist/esm-es5/intl-56b47a7b.js +1 -0
- package/dist/esm-es5/loader.js +1 -0
- package/dist/esm-es5/priv-calendar.entry.js +1 -0
- package/dist/esm-es5/priv-chart-popover-old.entry.js +1 -0
- package/dist/esm-es5/priv-chart-popover_2.entry.js +1 -0
- package/dist/esm-es5/priv-navigator-button.entry.js +1 -0
- package/dist/esm-es5/priv-navigator-item.entry.js +1 -0
- package/dist/esm-es5/priv-option-list.entry.js +1 -0
- package/dist/esm-es5/ripple.js +1 -0
- package/dist/esm-es5/wm-action-menu_2.entry.js +1 -0
- package/dist/esm-es5/wm-button.entry.js +1 -0
- package/dist/esm-es5/wm-chart-bar.entry.js +1 -0
- package/dist/esm-es5/wm-chart-column.entry.js +1 -0
- package/dist/esm-es5/wm-chart-slice.entry.js +1 -0
- package/dist/esm-es5/wm-chart.entry.js +1 -0
- package/dist/esm-es5/wm-date-range.entry.js +1 -0
- package/dist/esm-es5/wm-datepicker.entry.js +1 -0
- package/dist/esm-es5/wm-file-list.entry.js +1 -0
- package/dist/esm-es5/wm-file.entry.js +1 -0
- package/dist/esm-es5/wm-flyout.entry.js +1 -0
- package/dist/esm-es5/wm-input.entry.js +1 -0
- package/dist/esm-es5/wm-line-chart.entry.js +1 -0
- package/dist/esm-es5/wm-modal-pss_3.entry.js +1 -0
- package/dist/esm-es5/wm-modal_3.entry.js +1 -0
- package/dist/esm-es5/wm-navigation_3.entry.js +1 -0
- package/dist/esm-es5/wm-navigator.entry.js +1 -0
- package/dist/esm-es5/wm-nested-select.entry.js +1 -0
- package/dist/esm-es5/wm-optgroup.entry.js +1 -0
- package/dist/esm-es5/wm-option_2.entry.js +1 -0
- package/dist/esm-es5/wm-pagination.entry.js +1 -0
- package/dist/esm-es5/wm-progress-indicator_3.entry.js +1 -0
- package/dist/esm-es5/wm-search.entry.js +1 -0
- package/dist/esm-es5/wm-snackbar.entry.js +1 -0
- package/dist/esm-es5/wm-tab-item_3.entry.js +1 -0
- package/dist/esm-es5/wm-tag-input.entry.js +1 -0
- package/dist/esm-es5/wm-tag-option.entry.js +1 -0
- package/dist/esm-es5/wm-textarea.entry.js +1 -0
- package/dist/esm-es5/wm-timepicker.entry.js +1 -0
- package/dist/esm-es5/wm-toggletip.entry.js +1 -0
- package/dist/esm-es5/wm-uploader.entry.js +1 -0
- package/dist/esm-es5/wm-wrapper.entry.js +1 -0
- package/dist/index.js +1 -1
- package/dist/loader/cdn.js +1 -2
- package/dist/loader/index.cjs.js +1 -2
- package/dist/loader/index.d.ts +13 -2
- package/dist/loader/index.es2017.js +1 -2
- package/dist/loader/index.js +1 -2
- package/dist/loader/package.json +2 -1
- package/dist/ripple/index.esm.js +0 -0
- package/dist/ripple/p-03a6850a.entry.js +1 -0
- package/dist/ripple/p-0c3162d5.system.entry.js +1 -0
- package/dist/ripple/p-0ec71f08.system.entry.js +1 -0
- package/dist/ripple/p-1032c0db.system.entry.js +1 -0
- package/dist/ripple/p-117c3d78.system.js +2 -0
- package/dist/ripple/p-12024d3b.system.entry.js +1 -0
- package/dist/ripple/p-13152ac1.system.entry.js +1 -0
- package/dist/ripple/p-1318ae67.entry.js +1 -0
- package/dist/ripple/p-137bf0c0.system.entry.js +1 -0
- package/dist/ripple/p-13bb6faf.entry.js +1 -0
- package/dist/ripple/p-16ff8110.entry.js +1 -0
- package/dist/ripple/p-1825d519.system.entry.js +1 -0
- package/dist/ripple/p-18417851.entry.js +1 -0
- package/dist/ripple/p-1c655f6b.entry.js +1 -0
- package/dist/ripple/p-1ce77857.system.entry.js +1 -0
- package/dist/ripple/p-1d76061a.entry.js +1 -0
- package/dist/ripple/p-22b57f73.system.entry.js +1 -0
- package/dist/ripple/p-24dfbf1d.system.entry.js +1 -0
- package/dist/ripple/p-28996d67.system.entry.js +1 -0
- package/dist/ripple/p-30118d12.system.entry.js +1 -0
- package/dist/ripple/p-32f3581a.entry.js +1 -0
- package/dist/ripple/p-334d8711.system.js +1 -0
- package/dist/ripple/p-3c8c5933.js +1 -0
- package/dist/ripple/p-436bf381.system.entry.js +1 -0
- package/dist/ripple/p-43843597.system.entry.js +1 -0
- package/dist/ripple/p-45999149.system.js +1 -0
- package/dist/ripple/p-48b596ae.entry.js +1 -0
- package/dist/ripple/p-4bab5360.system.js +1 -0
- package/dist/ripple/p-4ff0db4d.entry.js +1 -0
- package/dist/ripple/p-50ea2036.system.js +1 -0
- package/dist/ripple/p-57f1bafd.system.entry.js +1 -0
- package/dist/ripple/p-5b0e9165.entry.js +1 -0
- package/dist/ripple/p-6266fcbf.system.entry.js +1 -0
- package/dist/ripple/p-646e22d3.system.entry.js +1 -0
- package/dist/ripple/p-6950e8ed.system.js +1 -0
- package/dist/ripple/p-6c6da5db.entry.js +1 -0
- package/dist/ripple/p-6d2af8d9.system.entry.js +1 -0
- package/dist/ripple/p-6d46f775.system.entry.js +1 -0
- package/dist/ripple/p-6de0efee.entry.js +1 -0
- package/dist/ripple/p-7833db63.entry.js +1 -0
- package/dist/ripple/p-7b7c32af.entry.js +1 -0
- package/dist/ripple/p-817aa29c.entry.js +1 -0
- package/dist/ripple/p-82c9bd47.entry.js +1 -0
- package/dist/ripple/p-8480138d.entry.js +1 -0
- package/dist/ripple/p-85ef702d.entry.js +1 -0
- package/dist/ripple/p-86bcd942.system.entry.js +1 -0
- package/dist/ripple/p-8799bce9.entry.js +1 -0
- package/dist/ripple/p-8ac14bb1.system.js +1 -0
- package/dist/ripple/p-8dcc8c0c.entry.js +1 -0
- package/dist/ripple/p-8fa572a8.entry.js +1 -0
- package/dist/ripple/p-904545cc.js +1 -0
- package/dist/ripple/p-90cb5d27.system.entry.js +1 -0
- package/dist/ripple/p-9202ef69.system.entry.js +1 -0
- package/dist/ripple/p-9f971522.system.entry.js +1 -0
- package/dist/ripple/p-a5dc49c1.system.entry.js +1 -0
- package/dist/ripple/p-a73fb160.system.entry.js +1 -0
- package/dist/ripple/p-a9580e7a.system.entry.js +1 -0
- package/dist/ripple/p-b04a6351.entry.js +1 -0
- package/dist/ripple/p-b09998e1.entry.js +1 -0
- package/dist/ripple/p-b3a86ec4.system.entry.js +1 -0
- package/dist/ripple/p-b501f06c.entry.js +1 -0
- package/dist/ripple/p-b957033b.entry.js +1 -0
- package/dist/ripple/p-c2258438.entry.js +1 -0
- package/dist/ripple/p-ca3abcc0.system.entry.js +1 -0
- package/dist/ripple/p-cc455a6c.system.entry.js +1 -0
- package/dist/ripple/p-cda66d45.js +1 -0
- package/dist/ripple/p-cde2ca4d.system.entry.js +1 -0
- package/dist/ripple/p-cdf9c0e9.entry.js +1 -0
- package/dist/ripple/p-d0858afa.js +2 -0
- package/dist/ripple/p-d37f8f66.js +1 -0
- package/dist/ripple/p-d4ae193e.js +1 -0
- package/dist/ripple/p-d4d769a7.system.js +1 -0
- package/dist/ripple/p-d6a9000f.system.entry.js +1 -0
- package/dist/ripple/p-d6cd9f79.entry.js +1 -0
- package/dist/ripple/p-d9e4335e.entry.js +1 -0
- package/dist/ripple/p-dadf3ed3.entry.js +1 -0
- package/dist/ripple/p-dc3684b5.entry.js +1 -0
- package/dist/ripple/p-dca94e24.entry.js +1 -0
- package/dist/ripple/p-dcd6acc5.system.entry.js +1 -0
- package/dist/ripple/p-dd81e308.entry.js +1 -0
- package/dist/ripple/p-e11d9b06.system.entry.js +1 -0
- package/dist/ripple/p-e36e71dc.system.entry.js +1 -0
- package/dist/ripple/p-e6a81600.entry.js +1 -0
- package/dist/ripple/p-ef7d84da.system.entry.js +1 -0
- package/dist/ripple/p-f1de3153.entry.js +1 -0
- package/dist/ripple/p-f3e84476.system.entry.js +1 -0
- package/dist/ripple/p-f4d27fea.system.entry.js +1 -0
- package/dist/ripple/p-fcf4bd61.system.entry.js +1 -0
- package/dist/ripple/p-fd02c124.entry.js +1 -0
- package/dist/ripple/p-ffa20853.entry.js +1 -0
- package/dist/ripple/ripple.esm.js +1 -0
- package/dist/ripple/ripple.js +127 -0
- package/dist/types/components/charts/chartFunctions.d.ts +54 -0
- package/dist/types/components/charts/priv-chart-popover/priv-chart-popover.d.ts +35 -0
- package/dist/types/components/charts/priv-chart-popover-old/priv-chart-popover-old.d.ts +26 -0
- package/dist/types/components/charts/wm-chart/wm-chart-slice.d.ts +11 -0
- package/dist/types/components/charts/wm-chart/wm-chart.d.ts +44 -0
- package/dist/types/components/charts/wm-chart-bar/wm-chart-bar.d.ts +62 -0
- package/dist/types/components/charts/wm-chart-column/wm-chart-column.d.ts +73 -0
- package/dist/types/components/charts/wm-chart-legend/wm-chart-legend.d.ts +26 -0
- package/dist/types/components/charts/wm-line-chart/wm-line-chart.d.ts +87 -0
- package/dist/types/components/charts/wm-progress-monitor/wm-progress-indicator.d.ts +34 -0
- package/dist/types/components/charts/wm-progress-monitor/wm-progress-monitor.d.ts +22 -0
- package/dist/types/components/charts/wm-progress-monitor/wm-progress-slice.d.ts +10 -0
- package/dist/types/components/datepickers/priv-calendar/priv-calendar.d.ts +89 -0
- package/dist/types/components/datepickers/wm-date-range.d.ts +73 -0
- package/dist/types/components/datepickers/wm-datepicker.d.ts +54 -0
- package/dist/types/components/selects/priv-option-list/priv-option-list.d.ts +71 -0
- package/dist/types/components/selects/wm-nested-select/wm-nested-select.d.ts +62 -0
- package/dist/types/components/selects/wm-optgroup/wm-optgroup.d.ts +21 -0
- package/dist/types/components/selects/wm-option/wm-option.d.ts +40 -0
- package/dist/types/components/selects/wm-select/wm-select.d.ts +66 -0
- package/dist/types/components/wm-action-menu/wm-action-menu.d.ts +54 -40
- package/dist/types/components/wm-button/wm-button.d.ts +43 -34
- package/dist/types/components/wm-file/wm-file.d.ts +48 -0
- package/dist/types/components/wm-file-list/wm-file-list.d.ts +5 -0
- package/dist/types/components/wm-flyout/wm-flyout.d.ts +48 -0
- package/dist/types/components/wm-input/wm-input.d.ts +50 -28
- package/dist/types/components/wm-menuitem/wm-menuitem.d.ts +26 -27
- package/dist/types/components/wm-modal/wm-modal-footer.d.ts +12 -13
- package/dist/types/components/wm-modal/wm-modal-header.d.ts +8 -10
- package/dist/types/components/wm-modal/wm-modal.d.ts +28 -31
- package/dist/types/components/wm-modal-pss/wm-modal-pss-footer.d.ts +14 -0
- package/dist/types/components/wm-modal-pss/wm-modal-pss-header.d.ts +10 -0
- package/dist/types/components/wm-modal-pss/wm-modal-pss.d.ts +35 -0
- package/dist/types/components/wm-navigation/wm-navigation-hamburger.d.ts +16 -0
- package/dist/types/components/wm-navigation/wm-navigation-item.d.ts +9 -0
- package/dist/types/components/wm-navigation/wm-navigation.d.ts +24 -0
- package/dist/types/components/wm-navigator/priv-navigator-button/priv-navigator-button.d.ts +6 -7
- package/dist/types/components/wm-navigator/priv-navigator-item/priv-navigator-item.d.ts +10 -10
- package/dist/types/components/wm-navigator/wm-navigator.d.ts +55 -57
- package/dist/types/components/wm-pagination/wm-pagination.d.ts +31 -28
- package/dist/types/components/wm-search/wm-search.d.ts +71 -75
- package/dist/types/components/wm-snackbar/wm-snackbar.d.ts +27 -28
- package/dist/types/components/wm-tabs/wm-tab-item/wm-tab-item.d.ts +30 -31
- package/dist/types/components/wm-tabs/wm-tab-list/wm-tab-list.d.ts +32 -48
- package/dist/types/components/wm-tabs/wm-tab-panel/wm-tab-panel.d.ts +14 -16
- package/dist/types/components/wm-tag-input/wm-tag-input.d.ts +121 -80
- package/dist/types/components/wm-tag-input/wm-tag-option/wm-tag-option.d.ts +18 -0
- package/dist/types/components/wm-textarea/wm-textarea.d.ts +31 -0
- package/dist/types/components/wm-timepicker/wm-timepicker.d.ts +49 -55
- package/dist/types/components/wm-toggletip/wm-toggletip.d.ts +36 -23
- package/dist/types/components/wm-uploader/wm-uploader.d.ts +64 -72
- package/dist/types/components/wm-wrapper/wm-wrapper.d.ts +4 -4
- package/dist/types/components.d.ts +1516 -211
- package/dist/types/global/__mocks__/functions.d.ts +2 -1
- package/dist/types/global/functions.d.ts +67 -11
- package/dist/types/global/interfaces.d.ts +152 -23
- package/dist/types/global/intl.d.ts +62 -0
- package/dist/types/global/services/__mocks__/http-service.d.ts +1 -1
- package/dist/types/stencil-public-runtime.d.ts +338 -219
- package/package.json +16 -22
- package/dist/cjs/app-globals-6b0c6e80.js +0 -110
- package/dist/cjs/app-globals-f1dd8fda.js +0 -47
- package/dist/cjs/componentlibrary.cjs.js +0 -20
- package/dist/cjs/css-shim-a7379e2b.js +0 -6
- package/dist/cjs/dom-3e7d9c3b.js +0 -75
- package/dist/cjs/functions-65513c61.js +0 -8360
- package/dist/cjs/global-6849642d.js +0 -38
- package/dist/cjs/http-service-494d81de.js +0 -57
- package/dist/cjs/http-service-9e8c4dd5.js +0 -57
- package/dist/cjs/index-298ebef1.js +0 -2976
- package/dist/cjs/interfaces-a3338581.js +0 -35
- package/dist/cjs/interfaces-b2beb752.js +0 -54
- package/dist/cjs/priv-chart-popover.cjs.entry.js +0 -89
- package/dist/cjs/priv-datepicker.cjs.entry.js +0 -672
- package/dist/cjs/shadow-css-09555044.js +0 -391
- package/dist/cjs/wm-action-menu.cjs.entry.js +0 -206
- package/dist/cjs/wm-menuitem.cjs.entry.js +0 -118
- package/dist/cjs/wm-modal-footer.cjs.entry.js +0 -43
- package/dist/cjs/wm-modal-header.cjs.entry.js +0 -45
- package/dist/cjs/wm-modal.cjs.entry.js +0 -149
- package/dist/cjs/wm-network-uploader.cjs.entry.js +0 -431
- package/dist/cjs/wm-option.cjs.entry.js +0 -123
- package/dist/cjs/wm-select.cjs.entry.js +0 -366
- package/dist/cjs/wm-tab-item.cjs.entry.js +0 -82
- package/dist/cjs/wm-tab-list.cjs.entry.js +0 -205
- package/dist/cjs/wm-tab-panel.cjs.entry.js +0 -42
- package/dist/collection/components/wm-chart/priv-chart-popover/priv-chart-popover.css +0 -132
- package/dist/collection/components/wm-chart/priv-chart-popover/priv-chart-popover.js +0 -232
- package/dist/collection/components/wm-chart/wm-chart-slice.js +0 -64
- package/dist/collection/components/wm-chart/wm-chart.css +0 -337
- package/dist/collection/components/wm-chart/wm-chart.js +0 -710
- package/dist/collection/components/wm-datepicker/priv-datepicker/priv-datepicker.css +0 -365
- package/dist/collection/components/wm-datepicker/priv-datepicker/priv-datepicker.js +0 -1003
- package/dist/collection/components/wm-datepicker/wm-datepicker.css +0 -211
- package/dist/collection/components/wm-datepicker/wm-datepicker.js +0 -445
- package/dist/collection/components/wm-option/wm-option.css +0 -162
- package/dist/collection/components/wm-option/wm-option.js +0 -394
- package/dist/collection/components/wm-select/wm-select.css +0 -315
- package/dist/collection/components/wm-select/wm-select.js +0 -676
- package/dist/collection/components/wm-uploader/wm-network-uploader/wm-network-uploader.css +0 -642
- package/dist/collection/components/wm-uploader/wm-network-uploader/wm-network-uploader.js +0 -753
- package/dist/componentlibrary/app-globals-18876ad3.js +0 -45
- package/dist/componentlibrary/app-globals-307a1083.js +0 -108
- package/dist/componentlibrary/componentlibrary.css +0 -84
- package/dist/componentlibrary/componentlibrary.esm.js +0 -1
- package/dist/componentlibrary/css-shim-bbdf0cc6.js +0 -4
- package/dist/componentlibrary/dom-1f98a75f.js +0 -73
- package/dist/componentlibrary/functions-316c1b23.js +0 -8340
- package/dist/componentlibrary/http-service-5d037e16.js +0 -52
- package/dist/componentlibrary/index-d5997567.js +0 -2938
- package/dist/componentlibrary/interfaces-50753346.js +0 -51
- package/dist/componentlibrary/p-01bdfed8.js +0 -16
- package/dist/componentlibrary/p-0ca70ed4.entry.js +0 -1
- package/dist/componentlibrary/p-126bde92.entry.js +0 -1
- package/dist/componentlibrary/p-12a67d93.entry.js +0 -1
- package/dist/componentlibrary/p-188deaf5.entry.js +0 -1
- package/dist/componentlibrary/p-2514df6f.entry.js +0 -1
- package/dist/componentlibrary/p-269b8a5f.entry.js +0 -1
- package/dist/componentlibrary/p-35e57079.entry.js +0 -1
- package/dist/componentlibrary/p-414e20f7.entry.js +0 -1
- package/dist/componentlibrary/p-43f1298b.js +0 -1
- package/dist/componentlibrary/p-4d387ec6.entry.js +0 -1
- package/dist/componentlibrary/p-59ba81d6.entry.js +0 -1
- package/dist/componentlibrary/p-5e3cbec8.entry.js +0 -1
- package/dist/componentlibrary/p-5e81e830.entry.js +0 -1
- package/dist/componentlibrary/p-64ff5040.js +0 -1
- package/dist/componentlibrary/p-68a871d3.entry.js +0 -1
- package/dist/componentlibrary/p-996a7395.entry.js +0 -1
- package/dist/componentlibrary/p-9b460452.entry.js +0 -1
- package/dist/componentlibrary/p-a416e410.entry.js +0 -1
- package/dist/componentlibrary/p-d550a94f.entry.js +0 -1
- package/dist/componentlibrary/p-e4735c23.entry.js +0 -1
- package/dist/componentlibrary/p-e725f388.entry.js +0 -1
- package/dist/componentlibrary/p-e9532ae5.entry.js +0 -1
- package/dist/componentlibrary/p-edf6f848.entry.js +0 -1
- package/dist/componentlibrary/p-fd8070fb.js +0 -1
- package/dist/componentlibrary/priv-chart-popover.entry.js +0 -85
- package/dist/componentlibrary/priv-datepicker.entry.js +0 -668
- package/dist/componentlibrary/priv-navigator-button.entry.js +0 -25
- package/dist/componentlibrary/priv-navigator-item.entry.js +0 -30
- package/dist/componentlibrary/shadow-css-67b66845.js +0 -389
- package/dist/componentlibrary/wm-action-menu.entry.js +0 -202
- package/dist/componentlibrary/wm-button.entry.js +0 -148
- package/dist/componentlibrary/wm-chart-slice.entry.js +0 -18
- package/dist/componentlibrary/wm-chart.entry.js +0 -504
- package/dist/componentlibrary/wm-datepicker.entry.js +0 -258
- package/dist/componentlibrary/wm-input.entry.js +0 -106
- package/dist/componentlibrary/wm-menuitem.entry.js +0 -114
- package/dist/componentlibrary/wm-modal-footer.entry.js +0 -39
- package/dist/componentlibrary/wm-modal-header.entry.js +0 -41
- package/dist/componentlibrary/wm-modal.entry.js +0 -145
- package/dist/componentlibrary/wm-navigator.entry.js +0 -275
- package/dist/componentlibrary/wm-network-uploader.entry.js +0 -427
- package/dist/componentlibrary/wm-option.entry.js +0 -119
- package/dist/componentlibrary/wm-pagination.entry.js +0 -172
- package/dist/componentlibrary/wm-search.entry.js +0 -227
- package/dist/componentlibrary/wm-select.entry.js +0 -362
- package/dist/componentlibrary/wm-snackbar.entry.js +0 -156
- package/dist/componentlibrary/wm-tab-item.entry.js +0 -78
- package/dist/componentlibrary/wm-tab-list.entry.js +0 -201
- package/dist/componentlibrary/wm-tab-panel.entry.js +0 -38
- package/dist/componentlibrary/wm-tag-input.entry.js +0 -509
- package/dist/componentlibrary/wm-timepicker.entry.js +0 -382
- package/dist/componentlibrary/wm-toggletip.entry.js +0 -124
- package/dist/componentlibrary/wm-uploader.entry.js +0 -338
- package/dist/componentlibrary/wm-wrapper.entry.js +0 -17
- package/dist/esm/app-globals-18876ad3.js +0 -45
- package/dist/esm/app-globals-307a1083.js +0 -108
- package/dist/esm/componentlibrary.js +0 -18
- package/dist/esm/css-shim-bbdf0cc6.js +0 -4
- package/dist/esm/dom-1f98a75f.js +0 -73
- package/dist/esm/functions-316c1b23.js +0 -8340
- package/dist/esm/global-430cb201.js +0 -36
- package/dist/esm/http-service-3dc3b3e7.js +0 -52
- package/dist/esm/http-service-5d037e16.js +0 -52
- package/dist/esm/index-d5997567.js +0 -2938
- package/dist/esm/interfaces-2b97fab2.js +0 -32
- package/dist/esm/interfaces-50753346.js +0 -51
- package/dist/esm/polyfills/css-shim.js +0 -1
- package/dist/esm/priv-chart-popover.entry.js +0 -85
- package/dist/esm/priv-datepicker.entry.js +0 -668
- package/dist/esm/shadow-css-67b66845.js +0 -389
- package/dist/esm/wm-action-menu.entry.js +0 -202
- package/dist/esm/wm-menuitem.entry.js +0 -114
- package/dist/esm/wm-modal-footer.entry.js +0 -39
- package/dist/esm/wm-modal-header.entry.js +0 -41
- package/dist/esm/wm-modal.entry.js +0 -145
- package/dist/esm/wm-network-uploader.entry.js +0 -427
- package/dist/esm/wm-option.entry.js +0 -119
- package/dist/esm/wm-select.entry.js +0 -362
- package/dist/esm/wm-tab-item.entry.js +0 -78
- package/dist/esm/wm-tab-list.entry.js +0 -201
- package/dist/esm/wm-tab-panel.entry.js +0 -38
- package/dist/types/components/wm-chart/priv-chart-popover/priv-chart-popover.d.ts +0 -23
- package/dist/types/components/wm-chart/wm-chart-slice.d.ts +0 -8
- package/dist/types/components/wm-chart/wm-chart.d.ts +0 -77
- package/dist/types/components/wm-datepicker/priv-datepicker/priv-datepicker.d.ts +0 -75
- package/dist/types/components/wm-datepicker/wm-datepicker.d.ts +0 -39
- package/dist/types/components/wm-option/wm-option.d.ts +0 -28
- package/dist/types/components/wm-select/wm-select.d.ts +0 -63
- package/dist/types/components/wm-uploader/wm-network-uploader/wm-network-uploader.d.ts +0 -85
- /package/dist/{componentlibrary/index.esm.js → collection/dev/button.js} +0 -0
|
@@ -0,0 +1,441 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
const index = require('./index-786066a1.js');
|
|
6
|
+
const interfaces = require('./interfaces-8419be91.js');
|
|
7
|
+
const chartFunctions = require('./chartFunctions-608adb05.js');
|
|
8
|
+
const intl = require('./intl-01531391.js');
|
|
9
|
+
const functions = require('./functions-b188d5b3.js');
|
|
10
|
+
|
|
11
|
+
const wmChartBarCss = "/* --------------------------------------\n 1. Box-shadow\n -------------------------------------- */\n/* --------------------------------------\n 2. Border-radius\n -------------------------------------- */\n/* --------------------------------------\n 3. Transforms\n -------------------------------------- */\n/* --------------------------------------\n 4. Button Focus\n -------------------------------------- */\n/* --------------------------------------\n 5. Flex\n -------------------------------------- */\n/* --------------------------------------\n 7. Screen Reader Only\n -------------------------------------- */\n/* --------------------------------------\n 8. Label styles\n this mixin includes all the styles for the label\n + flex rules on the parent container to switch between top and left position\n + srOnly when label is hidden\n Assumes the following markup:\n div.wrapper[.label-left.invalid] > div.label-wrapper > label.label > span.required\n .wrapper is for the flex rules\n .label-wrapper is to set the height of the label when positioned left so it's the same height as\n the input. It can't be done directly on .label because of possible line wrapping.\n When the label is on top there's no line wrapping at all to ensure proper alignment of inlined elements\n (they can't be aligned on the baseline because of possible description text and error message)\n -------------------------------------- */\n:host .component-wrapper {\n position: relative;\n display: -ms-flexbox;\n display: flex;\n -ms-flex-direction: column;\n flex-direction: column;\n height: 100%;\n gap: 1.5rem;\n}\n:host .component-wrapper:focus-visible {\n outline: none;\n outline: 3px solid var(--wmcolor-interactive-focus);\n outline-offset: 3px;\n}\n:host .label {\n display: -ms-flexbox;\n display: flex;\n -ms-flex-direction: column;\n flex-direction: column;\n gap: 0.25rem;\n}\n:host .label .label-text {\n display: block;\n font-weight: 600;\n font-size: 1.125rem;\n}\n:host .label .subinfo {\n display: block;\n font-weight: normal;\n font-style: italic;\n inset-block-end: 0.25rem;\n width: 100%;\n color: var(--wmcolor-chart-subinfo-text);\n}\n:host .legend.--vertical {\n max-width: 12.5rem;\n}\n:host .value {\n font-size: 0.875rem;\n white-space: nowrap;\n font-weight: 600;\n}\n:host .axis-label-text {\n text-align: center;\n font-size: 0.875rem;\n font-weight: 600;\n}\n:host .group-legend,\n:host .bar-legend {\n font-size: 1rem;\n font-weight: 500;\n word-break: break-word;\n}\n:host .tick {\n font-size: 0.875rem;\n font-weight: 400;\n}\n:host .chart-left-side {\n display: -ms-flexbox;\n display: flex;\n -ms-flex: 0 1 0%;\n flex: 0 1 0%;\n gap: 0.75rem;\n}\n:host .chart-right-side:empty {\n display: none;\n}\n:host .left-axis-label {\n max-width: 9.375rem;\n -ms-flex-preferred-size: min-content;\n flex-basis: min-content;\n display: -ms-flexbox;\n display: flex;\n -ms-flex-align: center;\n align-items: center;\n -ms-flex-pack: center;\n justify-content: center;\n}\n@container chart-measure (max-width: 414px) {\n :host .left-axis-label {\n display: none;\n }\n}\n:host .bottom-axis-label {\n display: -ms-flexbox;\n display: flex;\n -ms-flex-align: center;\n align-items: center;\n -ms-flex-pack: center;\n justify-content: center;\n}\n:host .bar-area.user-is-keying:not(.hide-focus-ring) .bar:focus {\n outline: none;\n outline: 3px solid var(--wmcolor-interactive-focus);\n outline-offset: 3px;\n}\n:host .bar-wrapper.faded {\n opacity: 0.3;\n}\n:host .bar-wrapper .bar:hover {\n -webkit-box-shadow: 0px 4px 15px 0px rgba(92, 59, 59, 0.2), 0px 3px 14px 0px rgba(0, 0, 0, 0.12);\n -moz-box-shadow: 0px 4px 15px 0px rgba(92, 59, 59, 0.2), 0px 3px 14px 0px rgba(0, 0, 0, 0.12);\n box-shadow: 0px 4px 15px 0px rgba(92, 59, 59, 0.2), 0px 3px 14px 0px rgba(0, 0, 0, 0.12);\n}\n\n.svg-icon {\n display: block;\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n}\n.svg-icon.horizontal {\n -webkit-transform: scaleX(-1);\n transform: scaleX(-1);\n}\n.svg-icon.vertical {\n -webkit-transform: scaleY(-1);\n transform: scaleY(-1);\n}\n.svg-icon.svg-add:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-add:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-archive:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-archive:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M20.54 5.23L19.15 3.55C18.88 3.21 18.47 3 18 3H6C5.53 3 5.12 3.21 4.84 3.55L3.46 5.23C3.17 5.57 3 6.02 3 6.5V19C3 20.1 3.9 21 5 21H19C20.1 21 21 20.1 21 19V6.5C21 6.02 20.83 5.57 20.54 5.23ZM12 17.5L6.5 12H10V10H14V12H17.5L12 17.5ZM5.12 5L5.93 4H17.93L18.87 5H5.12Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M20.54 5.23L19.15 3.55C18.88 3.21 18.47 3 18 3H6C5.53 3 5.12 3.21 4.84 3.55L3.46 5.23C3.17 5.57 3 6.02 3 6.5V19C3 20.1 3.9 21 5 21H19C20.1 21 21 20.1 21 19V6.5C21 6.02 20.83 5.57 20.54 5.23ZM12 17.5L6.5 12H10V10H14V12H17.5L12 17.5ZM5.12 5L5.93 4H17.93L18.87 5H5.12Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-add-person:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-add-person:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M15,14C12.33,14 7,15.33 7,18V20H23V18C23,15.33 17.67,14 15,14M6,10V7H4V10H1V12H4V15H6V12H9V10M15,12A4,4 0 0,0 19,8A4,4 0 0,0 15,4A4,4 0 0,0 11,8A4,4 0 0,0 15,12Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M15,14C12.33,14 7,15.33 7,18V20H23V18C23,15.33 17.67,14 15,14M6,10V7H4V10H1V12H4V15H6V12H9V10M15,12A4,4 0 0,0 19,8A4,4 0 0,0 15,4A4,4 0 0,0 11,8A4,4 0 0,0 15,12Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-add-outline:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-add-outline:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M13,7H11V11H7V13H11V17H13V13H17V11H13V7Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M13,7H11V11H7V13H11V17H13V13H17V11H13V7Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-ai:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-ai:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12,1L9,9L1,12L9,15L12,23L15,15L23,12L15,9L12,1Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12,1L9,9L1,12L9,15L12,23L15,15L23,12L15,9L12,1Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-ai-sparkles:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-ai-sparkles:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 14 14' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M11.0834 0.583328L10.3484 2.18749L8.75004 2.91666L10.3484 3.65166L11.0834 5.25L11.8125 3.65166L13.4167 2.91666L11.8125 2.18749M5.25004 2.33333L3.79171 5.54166L0.583374 7L3.79171 8.45833L5.25004 11.6667L6.70837 8.45833L9.91671 7L6.70837 5.54166M11.0834 8.75L10.3484 10.3483L8.75004 11.0833L10.3484 11.8125L11.0834 13.4167L11.8125 11.8125L13.4167 11.0833L11.8125 10.3483'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 14 14' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M11.0834 0.583328L10.3484 2.18749L8.75004 2.91666L10.3484 3.65166L11.0834 5.25L11.8125 3.65166L13.4167 2.91666L11.8125 2.18749M5.25004 2.33333L3.79171 5.54166L0.583374 7L3.79171 8.45833L5.25004 11.6667L6.70837 8.45833L9.91671 7L6.70837 5.54166M11.0834 8.75L10.3484 10.3483L8.75004 11.0833L10.3484 11.8125L11.0834 13.4167L11.8125 11.8125L13.4167 11.0833L11.8125 10.3483'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-ai-chat:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-ai-chat:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M19 1.5H5C3.9 1.5 3 2.4 3 3.5V17.5C3 18.6 3.9 19.5 5 19.5H9L12 22.5L15 19.5H19C20.1 19.5 21 18.6 21 17.5V3.5C21 2.4 20.1 1.5 19 1.5ZM19 17.5H14.17L12 19.67L9.83 17.5H5V3.5H19V17.5ZM12 16.5L13.88 12.38L18 10.5L13.88 8.62L12 4.5L10.12 8.62L6 10.5L10.12 12.38L12 16.5Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M19 1.5H5C3.9 1.5 3 2.4 3 3.5V17.5C3 18.6 3.9 19.5 5 19.5H9L12 22.5L15 19.5H19C20.1 19.5 21 18.6 21 17.5V3.5C21 2.4 20.1 1.5 19 1.5ZM19 17.5H14.17L12 19.67L9.83 17.5H5V3.5H19V17.5ZM12 16.5L13.88 12.38L18 10.5L13.88 8.62L12 4.5L10.12 8.62L6 10.5L10.12 12.38L12 16.5Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-api-connected:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-api-connected:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M6.5 20Q4.22 20 2.61 18.43 1 16.85 1 14.58 1 12.63 2.17 11.1 3.35 9.57 5.25 9.15 5.88 6.85 7.75 5.43 9.63 4 12 4 14.93 4 16.96 6.04 19 8.07 19 11 20.73 11.2 21.86 12.5 23 13.78 23 15.5 23 17.38 21.69 18.69 20.38 20 18.5 20M6.5 18H18.5Q19.55 18 20.27 17.27 21 16.55 21 15.5 21 14.45 20.27 13.73 19.55 13 18.5 13H17V11Q17 8.93 15.54 7.46 14.08 6 12 6 9.93 6 8.46 7.46 7 8.93 7 11H6.5Q5.05 11 4.03 12.03 3 13.05 3 14.5 3 15.95 4.03 17 5.05 18 6.5 18M12 12Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M6.5 20Q4.22 20 2.61 18.43 1 16.85 1 14.58 1 12.63 2.17 11.1 3.35 9.57 5.25 9.15 5.88 6.85 7.75 5.43 9.63 4 12 4 14.93 4 16.96 6.04 19 8.07 19 11 20.73 11.2 21.86 12.5 23 13.78 23 15.5 23 17.38 21.69 18.69 20.38 20 18.5 20M6.5 18H18.5Q19.55 18 20.27 17.27 21 16.55 21 15.5 21 14.45 20.27 13.73 19.55 13 18.5 13H17V11Q17 8.93 15.54 7.46 14.08 6 12 6 9.93 6 8.46 7.46 7 8.93 7 11H6.5Q5.05 11 4.03 12.03 3 13.05 3 14.5 3 15.95 4.03 17 5.05 18 6.5 18M12 12Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-api-disconnected:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-api-disconnected:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M19.8 22.6L17.15 20H6.5Q4.2 20 2.6 18.4T1 14.5Q1 12.58 2.19 11.08 3.38 9.57 5.25 9.15 5.33 8.95 5.4 8.76 5.5 8.57 5.55 8.35L1.4 4.2L2.8 2.8L21.2 21.2M6.5 18H15.15L7.1 9.95Q7.05 10.23 7.03 10.5 7 10.73 7 11H6.5Q5.05 11 4.03 12.03 3 13.05 3 14.5 3 15.95 4.03 17 5.05 18 6.5 18M11.13 14M21.6 18.75L20.15 17.35Q20.58 17 20.79 16.54 21 16.08 21 15.5 21 14.45 20.27 13.73 19.55 13 18.5 13H17V11Q17 8.93 15.54 7.46 14.08 6 12 6 11.33 6 10.7 6.16 10.07 6.33 9.5 6.68L8.05 5.23Q8.93 4.63 9.91 4.31 10.9 4 12 4 14.93 4 16.96 6.04 19 8.07 19 11 20.73 11.2 21.86 12.5 23 13.78 23 15.5 23 16.5 22.63 17.31 22.25 18.15 21.6 18.75M14.83 12.03Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M19.8 22.6L17.15 20H6.5Q4.2 20 2.6 18.4T1 14.5Q1 12.58 2.19 11.08 3.38 9.57 5.25 9.15 5.33 8.95 5.4 8.76 5.5 8.57 5.55 8.35L1.4 4.2L2.8 2.8L21.2 21.2M6.5 18H15.15L7.1 9.95Q7.05 10.23 7.03 10.5 7 10.73 7 11H6.5Q5.05 11 4.03 12.03 3 13.05 3 14.5 3 15.95 4.03 17 5.05 18 6.5 18M11.13 14M21.6 18.75L20.15 17.35Q20.58 17 20.79 16.54 21 16.08 21 15.5 21 14.45 20.27 13.73 19.55 13 18.5 13H17V11Q17 8.93 15.54 7.46 14.08 6 12 6 11.33 6 10.7 6.16 10.07 6.33 9.5 6.68L8.05 5.23Q8.93 4.63 9.91 4.31 10.9 4 12 4 14.93 4 16.96 6.04 19 8.07 19 11 20.73 11.2 21.86 12.5 23 13.78 23 15.5 23 16.5 22.63 17.31 22.25 18.15 21.6 18.75M14.83 12.03Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-attach:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-attach:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M16.5,6V17.5A4,4 0 0,1 12.5,21.5A4,4 0 0,1 8.5,17.5V5A2.5,2.5 0 0,1 11,2.5A2.5,2.5 0 0,1 13.5,5V15.5A1,1 0 0,1 12.5,16.5A1,1 0 0,1 11.5,15.5V6H10V15.5A2.5,2.5 0 0,0 12.5,18A2.5,2.5 0 0,0 15,15.5V5A4,4 0 0,0 11,1A4,4 0 0,0 7,5V17.5A5.5,5.5 0 0,0 12.5,23A5.5,5.5 0 0,0 18,17.5V6H16.5Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M16.5,6V17.5A4,4 0 0,1 12.5,21.5A4,4 0 0,1 8.5,17.5V5A2.5,2.5 0 0,1 11,2.5A2.5,2.5 0 0,1 13.5,5V15.5A1,1 0 0,1 12.5,16.5A1,1 0 0,1 11.5,15.5V6H10V15.5A2.5,2.5 0 0,0 12.5,18A2.5,2.5 0 0,0 15,15.5V5A4,4 0 0,0 11,1A4,4 0 0,0 7,5V17.5A5.5,5.5 0 0,0 12.5,23A5.5,5.5 0 0,0 18,17.5V6H16.5Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-back:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-back:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M20,11V13H8L13.5,18.5L12.08,19.92L4.16,12L12.08,4.08L13.5,5.5L8,11H20Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M20,11V13H8L13.5,18.5L12.08,19.92L4.16,12L12.08,4.08L13.5,5.5L8,11H20Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-close:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-close:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-copy:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-copy:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-checkbox-selected:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-checkbox-selected:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M10,17L5,12L6.41,10.58L10,14.17L17.59,6.58L19,8M19,3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M10,17L5,12L6.41,10.58L10,14.17L17.59,6.58L19,8M19,3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-checkbox-blank:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-checkbox-blank:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M19,3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3M19,5V19H5V5H19Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M19,3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3M19,5V19H5V5H19Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-collapsed:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-collapsed:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M10,17L15,12L10,7V17Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M10,17L15,12L10,7V17Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-date:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-date:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M19,19H5V8H19M16,1V3H8V1H6V3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3H18V1M17,12H12V17H17V12Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M19,19H5V8H19M16,1V3H8V1H6V3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3H18V1M17,12H12V17H17V12Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-delete:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-delete:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M19,4H15.5L14.5,3H9.5L8.5,4H5V6H19M6,19A2,2 0 0,0 8,21H16A2,2 0 0,0 18,19V7H6V19Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M19,4H15.5L14.5,3H9.5L8.5,4H5V6H19M6,19A2,2 0 0,0 8,21H16A2,2 0 0,0 18,19V7H6V19Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-download:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-download:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M5,20H19V18H5M19,9H15V3H9V9H5L12,16L19,9Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M5,20H19V18H5M19,9H15V3H9V9H5L12,16L19,9Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-drilldown:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-drilldown:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M2,3h14v4H2V3 M2,10h20v4H2V10 M2,17h8v4H2V17z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M2,3h14v4H2V3 M2,10h20v4H2V10 M2,17h8v4H2V17z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-edit:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-edit:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M20.71,7.04C21.1,6.65 21.1,6 20.71,5.63L18.37,3.29C18,2.9 17.35,2.9 16.96,3.29L15.12,5.12L18.87,8.87M3,17.25V21H6.75L17.81,9.93L14.06,6.18L3,17.25Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M20.71,7.04C21.1,6.65 21.1,6 20.71,5.63L18.37,3.29C18,2.9 17.35,2.9 16.96,3.29L15.12,5.12L18.87,8.87M3,17.25V21H6.75L17.81,9.93L14.06,6.18L3,17.25Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-error:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-error:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M13 14H11V9H13M13 18H11V16H13M1 21H23L12 2L1 21Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M13 14H11V9H13M13 18H11V16H13M1 21H23L12 2L1 21Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-expand-less:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-expand-less:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M7.41,15.41L12,10.83L16.59,15.41L18,14L12,8L6,14L7.41,15.41Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M7.41,15.41L12,10.83L16.59,15.41L18,14L12,8L6,14L7.41,15.41Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-expand-more:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-expand-more:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-expanded:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-expanded:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M7,10L12,15L17,10H7Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M7,10L12,15L17,10H7Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-filter:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-filter:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M14,12V19.88C14.04,20.18 13.94,20.5 13.71,20.71C13.32,21.1 12.69,21.1 12.3,20.71L10.29,18.7C10.06,18.47 9.96,18.16 10,17.87V12H9.97L4.21,4.62C3.87,4.19 3.95,3.56 4.38,3.22C4.57,3.08 4.78,3 5,3V3H19V3C19.22,3 19.43,3.08 19.62,3.22C20.05,3.56 20.13,4.19 19.79,4.62L14.03,12H14Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M14,12V19.88C14.04,20.18 13.94,20.5 13.71,20.71C13.32,21.1 12.69,21.1 12.3,20.71L10.29,18.7C10.06,18.47 9.96,18.16 10,17.87V12H9.97L4.21,4.62C3.87,4.19 3.95,3.56 4.38,3.22C4.57,3.08 4.78,3 5,3V3H19V3C19.22,3 19.43,3.08 19.62,3.22C20.05,3.56 20.13,4.19 19.79,4.62L14.03,12H14Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-forward:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-forward:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M4,11V13H16L10.5,18.5L11.92,19.92L19.84,12L11.92,4.08L10.5,5.5L16,11H4Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M4,11V13H16L10.5,18.5L11.92,19.92L19.84,12L11.92,4.08L10.5,5.5L16,11H4Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-help-center:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-help-center:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M15.07,11.25L14.17,12.17C13.45,12.89 13,13.5 13,15H11V14.5C11,13.39 11.45,12.39 12.17,11.67L13.41,10.41C13.78,10.05 14,9.55 14,9C14,7.89 13.1,7 12,7A2,2 0 0,0 10,9H8A4,4 0 0,1 12,5A4,4 0 0,1 16,9C16,9.88 15.64,10.67 15.07,11.25M13,19H11V17H13M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12C22,6.47 17.5,2 12,2Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M15.07,11.25L14.17,12.17C13.45,12.89 13,13.5 13,15H11V14.5C11,13.39 11.45,12.39 12.17,11.67L13.41,10.41C13.78,10.05 14,9.55 14,9C14,7.89 13.1,7 12,7A2,2 0 0,0 10,9H8A4,4 0 0,1 12,5A4,4 0 0,1 16,9C16,9.88 15.64,10.67 15.07,11.25M13,19H11V17H13M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12C22,6.47 17.5,2 12,2Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-hide:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-hide:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M11.83,9L15,12.16C15,12.11 15,12.05 15,12A3,3 0 0,0 12,9C11.94,9 11.89,9 11.83,9M7.53,9.8L9.08,11.35C9.03,11.56 9,11.77 9,12A3,3 0 0,0 12,15C12.22,15 12.44,14.97 12.65,14.92L14.2,16.47C13.53,16.8 12.79,17 12,17A5,5 0 0,1 7,12C7,11.21 7.2,10.47 7.53,9.8M2,4.27L4.28,6.55L4.73,7C3.08,8.3 1.78,10 1,12C2.73,16.39 7,19.5 12,19.5C13.55,19.5 15.03,19.2 16.38,18.66L16.81,19.08L19.73,22L21,20.73L3.27,3M12,7A5,5 0 0,1 17,12C17,12.64 16.87,13.26 16.64,13.82L19.57,16.75C21.07,15.5 22.27,13.86 23,12C21.27,7.61 17,4.5 12,4.5C10.6,4.5 9.26,4.75 8,5.2L10.17,7.35C10.74,7.13 11.35,7 12,7Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M11.83,9L15,12.16C15,12.11 15,12.05 15,12A3,3 0 0,0 12,9C11.94,9 11.89,9 11.83,9M7.53,9.8L9.08,11.35C9.03,11.56 9,11.77 9,12A3,3 0 0,0 12,15C12.22,15 12.44,14.97 12.65,14.92L14.2,16.47C13.53,16.8 12.79,17 12,17A5,5 0 0,1 7,12C7,11.21 7.2,10.47 7.53,9.8M2,4.27L4.28,6.55L4.73,7C3.08,8.3 1.78,10 1,12C2.73,16.39 7,19.5 12,19.5C13.55,19.5 15.03,19.2 16.38,18.66L16.81,19.08L19.73,22L21,20.73L3.27,3M12,7A5,5 0 0,1 17,12C17,12.64 16.87,13.26 16.64,13.82L19.57,16.75C21.07,15.5 22.27,13.86 23,12C21.27,7.61 17,4.5 12,4.5C10.6,4.5 9.26,4.75 8,5.2L10.17,7.35C10.74,7.13 11.35,7 12,7Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-info:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-info:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M13,9H11V7H13M13,17H11V11H13M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M13,9H11V7H13M13,17H11V11H13M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-locked:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-locked:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12,17A2,2 0 0,0 14,15C14,13.89 13.1,13 12,13A2,2 0 0,0 10,15A2,2 0 0,0 12,17M18,8A2,2 0 0,1 20,10V20A2,2 0 0,1 18,22H6A2,2 0 0,1 4,20V10C4,8.89 4.9,8 6,8H7V6A5,5 0 0,1 12,1A5,5 0 0,1 17,6V8H18M12,3A3,3 0 0,0 9,6V8H15V6A3,3 0 0,0 12,3Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12,17A2,2 0 0,0 14,15C14,13.89 13.1,13 12,13A2,2 0 0,0 10,15A2,2 0 0,0 12,17M18,8A2,2 0 0,1 20,10V20A2,2 0 0,1 18,22H6A2,2 0 0,1 4,20V10C4,8.89 4.9,8 6,8H7V6A5,5 0 0,1 12,1A5,5 0 0,1 17,6V8H18M12,3A3,3 0 0,0 9,6V8H15V6A3,3 0 0,0 12,3Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-menu:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-menu:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-more-options:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-more-options:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12,16A2,2 0 0,1 14,18A2,2 0 0,1 12,20A2,2 0 0,1 10,18A2,2 0 0,1 12,16M12,10A2,2 0 0,1 14,12A2,2 0 0,1 12,14A2,2 0 0,1 10,12A2,2 0 0,1 12,10M12,4A2,2 0 0,1 14,6A2,2 0 0,1 12,8A2,2 0 0,1 10,6A2,2 0 0,1 12,4Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12,16A2,2 0 0,1 14,18A2,2 0 0,1 12,20A2,2 0 0,1 10,18A2,2 0 0,1 12,16M12,10A2,2 0 0,1 14,12A2,2 0 0,1 12,14A2,2 0 0,1 10,12A2,2 0 0,1 12,10M12,4A2,2 0 0,1 14,6A2,2 0 0,1 12,8A2,2 0 0,1 10,6A2,2 0 0,1 12,4Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-move-down:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-move-down:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M11,4H13V16L18.5,10.5L19.92,11.92L12,19.84L4.08,11.92L5.5,10.5L11,16V4Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M11,4H13V16L18.5,10.5L19.92,11.92L12,19.84L4.08,11.92L5.5,10.5L11,16V4Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-move-up:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-move-up:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M13,20H11V8L5.5,13.5L4.08,12.08L12,4.16L19.92,12.08L18.5,13.5L13,8V20Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M13,20H11V8L5.5,13.5L4.08,12.08L12,4.16L19.92,12.08L18.5,13.5L13,8V20Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-navigator-icon:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-navigator-icon:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' fill-rule='evenodd' clip-rule='evenodd' d='M21.9,11.5c0,5.5-4.4,9.9-9.9,9.9c-5.5,0-9.9-4.4-9.9-9.9C2.1,6,6.5,1.6,12,1.6 C17.5,1.6,21.9,6,21.9,11.5z M22.5,11.5C22.5,17.3,17.8,22,12,22C6.2,22,1.5,17.3,1.5,11.5C1.5,5.7,6.2,1,12,1 C17.8,1,22.5,5.7,22.5,11.5z M7.7,15.8c0.2,0.2,0.5,0.3,0.8,0.3s0.6-0.1,0.8-0.3s0.3-0.5,0.3-0.8s-0.1-0.6-0.3-0.8 c-0.2-0.2-0.5-0.3-0.8-0.3s-0.6,0.1-0.8,0.3c-0.2,0.2-0.3,0.5-0.3,0.8S7.4,15.6,7.7,15.8z M11.2,15.8c0.2,0.2,0.5,0.3,0.8,0.3 s0.6-0.1,0.8-0.3c0.2-0.2,0.3-0.5,0.3-0.8s-0.1-0.6-0.3-0.8c-0.2-0.2-0.5-0.3-0.8-0.3s-0.6,0.1-0.8,0.3c-0.2,0.2-0.3,0.5-0.3,0.8 S10.9,15.6,11.2,15.8z M14.7,15.8c0.2,0.2,0.5,0.3,0.8,0.3s0.6-0.1,0.8-0.3c0.2-0.2,0.3-0.5,0.3-0.8s-0.1-0.6-0.3-0.8 c-0.2-0.2-0.5-0.3-0.8-0.3s-0.6,0.1-0.8,0.3c-0.2,0.2-0.3,0.5-0.3,0.8S14.4,15.6,14.7,15.8z M7.7,12.3c0.2,0.2,0.5,0.3,0.8,0.3 s0.6-0.1,0.8-0.3c0.2-0.2,0.3-0.5,0.3-0.8s-0.1-0.6-0.3-0.8c-0.2-0.2-0.5-0.3-0.8-0.3s-0.6,0.1-0.8,0.3c-0.2,0.2-0.3,0.5-0.3,0.8 S7.4,12.1,7.7,12.3z M11.2,12.3c0.2,0.2,0.5,0.3,0.8,0.3s0.6-0.1,0.8-0.3c0.2-0.2,0.3-0.5,0.3-0.8s-0.1-0.6-0.3-0.8 c-0.2-0.2-0.5-0.3-0.8-0.3s-0.6,0.1-0.8,0.3c-0.2,0.2-0.3,0.5-0.3,0.8S10.9,12.1,11.2,12.3z M14.7,12.3c0.2,0.2,0.5,0.3,0.8,0.3 s0.6-0.1,0.8-0.3c0.2-0.2,0.3-0.5,0.3-0.8s-0.1-0.6-0.3-0.8c-0.2-0.2-0.5-0.3-0.8-0.3s-0.6,0.1-0.8,0.3c-0.2,0.2-0.3,0.5-0.3,0.8 S14.4,12.1,14.7,12.3z M7.7,8.8c0.2,0.2,0.5,0.3,0.8,0.3s0.6-0.1,0.8-0.3S9.7,8.3,9.7,8S9.6,7.4,9.3,7.2S8.8,6.8,8.5,6.8 S7.9,6.9,7.7,7.2S7.3,7.7,7.3,8S7.4,8.6,7.7,8.8z M11.2,8.8c0.2,0.2,0.5,0.3,0.8,0.3s0.6-0.1,0.8-0.3c0.2-0.2,0.3-0.5,0.3-0.8 s-0.1-0.6-0.3-0.8c-0.2-0.2-0.5-0.3-0.8-0.3s-0.6,0.1-0.8,0.3c-0.2,0.2-0.3,0.5-0.3,0.8S10.9,8.6,11.2,8.8z M14.7,8.8 c0.2,0.2,0.5,0.3,0.8,0.3s0.6-0.1,0.8-0.3c0.2-0.2,0.3-0.5,0.3-0.8s-0.1-0.6-0.3-0.8c-0.2-0.2-0.5-0.3-0.8-0.3s-0.6,0.1-0.8,0.3 c-0.2,0.2-0.3,0.5-0.3,0.8S14.4,8.6,14.7,8.8z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' fill-rule='evenodd' clip-rule='evenodd' d='M21.9,11.5c0,5.5-4.4,9.9-9.9,9.9c-5.5,0-9.9-4.4-9.9-9.9C2.1,6,6.5,1.6,12,1.6 C17.5,1.6,21.9,6,21.9,11.5z M22.5,11.5C22.5,17.3,17.8,22,12,22C6.2,22,1.5,17.3,1.5,11.5C1.5,5.7,6.2,1,12,1 C17.8,1,22.5,5.7,22.5,11.5z M7.7,15.8c0.2,0.2,0.5,0.3,0.8,0.3s0.6-0.1,0.8-0.3s0.3-0.5,0.3-0.8s-0.1-0.6-0.3-0.8 c-0.2-0.2-0.5-0.3-0.8-0.3s-0.6,0.1-0.8,0.3c-0.2,0.2-0.3,0.5-0.3,0.8S7.4,15.6,7.7,15.8z M11.2,15.8c0.2,0.2,0.5,0.3,0.8,0.3 s0.6-0.1,0.8-0.3c0.2-0.2,0.3-0.5,0.3-0.8s-0.1-0.6-0.3-0.8c-0.2-0.2-0.5-0.3-0.8-0.3s-0.6,0.1-0.8,0.3c-0.2,0.2-0.3,0.5-0.3,0.8 S10.9,15.6,11.2,15.8z M14.7,15.8c0.2,0.2,0.5,0.3,0.8,0.3s0.6-0.1,0.8-0.3c0.2-0.2,0.3-0.5,0.3-0.8s-0.1-0.6-0.3-0.8 c-0.2-0.2-0.5-0.3-0.8-0.3s-0.6,0.1-0.8,0.3c-0.2,0.2-0.3,0.5-0.3,0.8S14.4,15.6,14.7,15.8z M7.7,12.3c0.2,0.2,0.5,0.3,0.8,0.3 s0.6-0.1,0.8-0.3c0.2-0.2,0.3-0.5,0.3-0.8s-0.1-0.6-0.3-0.8c-0.2-0.2-0.5-0.3-0.8-0.3s-0.6,0.1-0.8,0.3c-0.2,0.2-0.3,0.5-0.3,0.8 S7.4,12.1,7.7,12.3z M11.2,12.3c0.2,0.2,0.5,0.3,0.8,0.3s0.6-0.1,0.8-0.3c0.2-0.2,0.3-0.5,0.3-0.8s-0.1-0.6-0.3-0.8 c-0.2-0.2-0.5-0.3-0.8-0.3s-0.6,0.1-0.8,0.3c-0.2,0.2-0.3,0.5-0.3,0.8S10.9,12.1,11.2,12.3z M14.7,12.3c0.2,0.2,0.5,0.3,0.8,0.3 s0.6-0.1,0.8-0.3c0.2-0.2,0.3-0.5,0.3-0.8s-0.1-0.6-0.3-0.8c-0.2-0.2-0.5-0.3-0.8-0.3s-0.6,0.1-0.8,0.3c-0.2,0.2-0.3,0.5-0.3,0.8 S14.4,12.1,14.7,12.3z M7.7,8.8c0.2,0.2,0.5,0.3,0.8,0.3s0.6-0.1,0.8-0.3S9.7,8.3,9.7,8S9.6,7.4,9.3,7.2S8.8,6.8,8.5,6.8 S7.9,6.9,7.7,7.2S7.3,7.7,7.3,8S7.4,8.6,7.7,8.8z M11.2,8.8c0.2,0.2,0.5,0.3,0.8,0.3s0.6-0.1,0.8-0.3c0.2-0.2,0.3-0.5,0.3-0.8 s-0.1-0.6-0.3-0.8c-0.2-0.2-0.5-0.3-0.8-0.3s-0.6,0.1-0.8,0.3c-0.2,0.2-0.3,0.5-0.3,0.8S10.9,8.6,11.2,8.8z M14.7,8.8 c0.2,0.2,0.5,0.3,0.8,0.3s0.6-0.1,0.8-0.3c0.2-0.2,0.3-0.5,0.3-0.8s-0.1-0.6-0.3-0.8c-0.2-0.2-0.5-0.3-0.8-0.3s-0.6,0.1-0.8,0.3 c-0.2,0.2-0.3,0.5-0.3,0.8S14.4,8.6,14.7,8.8z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-next:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-next:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-notifications:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-notifications:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M21,19V20H3V19L5,17V11C5,7.9 7.03,5.17 10,4.29C10,4.19 10,4.1 10,4A2,2 0 0,1 12,2A2,2 0 0,1 14,4C14,4.1 14,4.19 14,4.29C16.97,5.17 19,7.9 19,11V17L21,19M14,21A2,2 0 0,1 12,23A2,2 0 0,1 10,21'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M21,19V20H3V19L5,17V11C5,7.9 7.03,5.17 10,4.29C10,4.19 10,4.1 10,4A2,2 0 0,1 12,2A2,2 0 0,1 14,4C14,4.1 14,4.19 14,4.29C16.97,5.17 19,7.9 19,11V17L21,19M14,21A2,2 0 0,1 12,23A2,2 0 0,1 10,21'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-open-in-new:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-open-in-new:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M14,3V5H17.59L7.76,14.83L9.17,16.24L19,6.41V10H21V3M19,19H5V5H12V3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V12H19V19Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M14,3V5H17.59L7.76,14.83L9.17,16.24L19,6.41V10H21V3M19,19H5V5H12V3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V12H19V19Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-pending:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-pending:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M15.3,19.3l1.1,1.8c-1,0.5-2.1,0.8-3.3,0.9v-2.1C13.8,19.8,14.6,19.6,15.3,19.3z M3.6,12.6H1.5 c0.1,1.2,0.4,2.3,0.9,3.3l1.8-1.1C3.9,14.1,3.7,13.3,3.6,12.6z M15.3,3.7l1.1-1.8c-1-0.5-2.1-0.8-3.3-0.9v2.1 C13.8,3.2,14.6,3.4,15.3,3.7z M20.4,10.4h2.1c-0.1-1.2-0.4-2.3-0.9-3.3l-1.8,1.1C20.1,8.9,20.3,9.7,20.4,10.4z M8.7,19.3l-1.1,1.8 c1,0.5,2.1,0.8,3.3,0.9v-2.1C10.2,19.8,9.4,19.6,8.7,19.3z M10.9,3.1V1C9.8,1.1,8.7,1.4,7.7,1.9l1.1,1.8C9.4,3.4,10.2,3.2,10.9,3.1 z M18.7,6.4l1.8-1.1c-0.7-0.9-1.5-1.7-2.4-2.4l-1.1,1.8C17.7,5.3,18.2,5.8,18.7,6.4z M4.2,8.2L2.4,7.2c-0.5,1-0.8,2.1-0.9,3.3h2.1 C3.7,9.7,3.9,8.9,4.2,8.2z M20.4,12.6c-0.1,0.8-0.3,1.5-0.6,2.2l1.8,1.1c0.5-1,0.8-2.1,0.9-3.3H20.4z M17.1,18.2l1.1,1.8 c0.9-0.7,1.7-1.5,2.4-2.4l-1.8-1.1C18.2,17.2,17.7,17.7,17.1,18.2z M6.9,4.8L5.8,2.9C4.9,3.6,4.1,4.4,3.5,5.3l1.8,1.1 C5.8,5.8,6.3,5.3,6.9,4.8z M5.3,16.6l-1.8,1.1c0.7,0.9,1.5,1.7,2.4,2.4l1.1-1.8C6.3,17.7,5.8,17.2,5.3,16.6z M13.1,6.2h-2.1v5.7 l4.5,4.5L17,15l-3.9-3.9V6.2z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M15.3,19.3l1.1,1.8c-1,0.5-2.1,0.8-3.3,0.9v-2.1C13.8,19.8,14.6,19.6,15.3,19.3z M3.6,12.6H1.5 c0.1,1.2,0.4,2.3,0.9,3.3l1.8-1.1C3.9,14.1,3.7,13.3,3.6,12.6z M15.3,3.7l1.1-1.8c-1-0.5-2.1-0.8-3.3-0.9v2.1 C13.8,3.2,14.6,3.4,15.3,3.7z M20.4,10.4h2.1c-0.1-1.2-0.4-2.3-0.9-3.3l-1.8,1.1C20.1,8.9,20.3,9.7,20.4,10.4z M8.7,19.3l-1.1,1.8 c1,0.5,2.1,0.8,3.3,0.9v-2.1C10.2,19.8,9.4,19.6,8.7,19.3z M10.9,3.1V1C9.8,1.1,8.7,1.4,7.7,1.9l1.1,1.8C9.4,3.4,10.2,3.2,10.9,3.1 z M18.7,6.4l1.8-1.1c-0.7-0.9-1.5-1.7-2.4-2.4l-1.1,1.8C17.7,5.3,18.2,5.8,18.7,6.4z M4.2,8.2L2.4,7.2c-0.5,1-0.8,2.1-0.9,3.3h2.1 C3.7,9.7,3.9,8.9,4.2,8.2z M20.4,12.6c-0.1,0.8-0.3,1.5-0.6,2.2l1.8,1.1c0.5-1,0.8-2.1,0.9-3.3H20.4z M17.1,18.2l1.1,1.8 c0.9-0.7,1.7-1.5,2.4-2.4l-1.8-1.1C18.2,17.2,17.7,17.7,17.1,18.2z M6.9,4.8L5.8,2.9C4.9,3.6,4.1,4.4,3.5,5.3l1.8,1.1 C5.8,5.8,6.3,5.3,6.9,4.8z M5.3,16.6l-1.8,1.1c0.7,0.9,1.5,1.7,2.4,2.4l1.1-1.8C6.3,17.7,5.8,17.2,5.3,16.6z M13.1,6.2h-2.1v5.7 l4.5,4.5L17,15l-3.9-3.9V6.2z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-previous:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-previous:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M15.41,16.58L10.83,12L15.41,7.41L14,6L8,12L14,18L15.41,16.58Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M15.41,16.58L10.83,12L15.41,7.41L14,6L8,12L14,18L15.41,16.58Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-remove:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-remove:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12 2C17.5 2 22 6.5 22 12S17.5 22 12 22 2 17.5 2 12 6.5 2 12 2M12 4C10.1 4 8.4 4.6 7.1 5.7L18.3 16.9C19.3 15.5 20 13.8 20 12C20 7.6 16.4 4 12 4M16.9 18.3L5.7 7.1C4.6 8.4 4 10.1 4 12C4 16.4 7.6 20 12 20C13.9 20 15.6 19.4 16.9 18.3Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12 2C17.5 2 22 6.5 22 12S17.5 22 12 22 2 17.5 2 12 6.5 2 12 2M12 4C10.1 4 8.4 4.6 7.1 5.7L18.3 16.9C19.3 15.5 20 13.8 20 12C20 7.6 16.4 4 12 4M16.9 18.3L5.7 7.1C4.6 8.4 4 10.1 4 12C4 16.4 7.6 20 12 20C13.9 20 15.6 19.4 16.9 18.3Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-remove-tag:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-remove-tag:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,2C6.47,2 2,6.47 2,12C2,17.53 6.47,22 12,22C17.53,22 22,17.53 22,12C22,6.47 17.53,2 12,2M14.59,8L12,10.59L9.41,8L8,9.41L10.59,12L8,14.59L9.41,16L12,13.41L14.59,16L16,14.59L13.41,12L16,9.41L14.59,8Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,2C6.47,2 2,6.47 2,12C2,17.53 6.47,22 12,22C17.53,22 22,17.53 22,12C22,6.47 17.53,2 12,2M14.59,8L12,10.59L9.41,8L8,9.41L10.59,12L8,14.59L9.41,16L12,13.41L14.59,16L16,14.59L13.41,12L16,9.41L14.59,8Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-reset:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-reset:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12,5V1L7,6L12,11V7A6,6 0 0,1 18,13A6,6 0 0,1 12,19A6,6 0 0,1 6,13H4A8,8 0 0,0 12,21A8,8 0 0,0 20,13A8,8 0 0,0 12,5Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12,5V1L7,6L12,11V7A6,6 0 0,1 18,13A6,6 0 0,1 12,19A6,6 0 0,1 6,13H4A8,8 0 0,0 12,21A8,8 0 0,0 20,13A8,8 0 0,0 12,5Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-restore:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-restore:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M13.5,8H12V13L16.28,15.54L17,14.33L13.5,12.25V8M13,3A9,9 0 0,0 4,12H1L4.96,16.03L9,12H6A7,7 0 0,1 13,5A7,7 0 0,1 20,12A7,7 0 0,1 13,19C11.07,19 9.32,18.21 8.06,16.94L6.64,18.36C8.27,20 10.5,21 13,21A9,9 0 0,0 22,12A9,9 0 0,0 13,3'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M13.5,8H12V13L16.28,15.54L17,14.33L13.5,12.25V8M13,3A9,9 0 0,0 4,12H1L4.96,16.03L9,12H6A7,7 0 0,1 13,5A7,7 0 0,1 20,12A7,7 0 0,1 13,19C11.07,19 9.32,18.21 8.06,16.94L6.64,18.36C8.27,20 10.5,21 13,21A9,9 0 0,0 22,12A9,9 0 0,0 13,3'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-rotate-right:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-rotate-right:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M16.89,15.5L18.31,16.89C19.21,15.73 19.76,14.39 19.93,13H17.91C17.77,13.87 17.43,14.72 16.89,15.5M13,17.9V19.92C14.39,19.75 15.74,19.21 16.9,18.31L15.46,16.87C14.71,17.41 13.87,17.76 13,17.9M19.93,11C19.76,9.61 19.21,8.27 18.31,7.11L16.89,8.53C17.43,9.28 17.77,10.13 17.91,11M15.55,5.55L11,1V4.07C7.06,4.56 4,7.92 4,12C4,16.08 7.05,19.44 11,19.93V17.91C8.16,17.43 6,14.97 6,12C6,9.03 8.16,6.57 11,6.09V10L15.55,5.55Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M16.89,15.5L18.31,16.89C19.21,15.73 19.76,14.39 19.93,13H17.91C17.77,13.87 17.43,14.72 16.89,15.5M13,17.9V19.92C14.39,19.75 15.74,19.21 16.9,18.31L15.46,16.87C14.71,17.41 13.87,17.76 13,17.9M19.93,11C19.76,9.61 19.21,8.27 18.31,7.11L16.89,8.53C17.43,9.28 17.77,10.13 17.91,11M15.55,5.55L11,1V4.07C7.06,4.56 4,7.92 4,12C4,16.08 7.05,19.44 11,19.93V17.91C8.16,17.43 6,14.97 6,12C6,9.03 8.16,6.57 11,6.09V10L15.55,5.55Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-save:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-save:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-search:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-search:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M9.5,3A6.5,6.5 0 0,1 16,9.5C16,11.11 15.41,12.59 14.44,13.73L14.71,14H15.5L20.5,19L19,20.5L14,15.5V14.71L13.73,14.44C12.59,15.41 11.11,16 9.5,16A6.5,6.5 0 0,1 3,9.5A6.5,6.5 0 0,1 9.5,3M9.5,5C7,5 5,7 5,9.5C5,12 7,14 9.5,14C12,14 14,12 14,9.5C14,7 12,5 9.5,5Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M9.5,3A6.5,6.5 0 0,1 16,9.5C16,11.11 15.41,12.59 14.44,13.73L14.71,14H15.5L20.5,19L19,20.5L14,15.5V14.71L13.73,14.44C12.59,15.41 11.11,16 9.5,16A6.5,6.5 0 0,1 3,9.5A6.5,6.5 0 0,1 9.5,3M9.5,5C7,5 5,7 5,9.5C5,12 7,14 9.5,14C12,14 14,12 14,9.5C14,7 12,5 9.5,5Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-shape-circle:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-shape-circle:before {\n -webkit-mask-image: url(\"data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path style='fill: var(--icon-fill, currentColor)' d='M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z '/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path style='fill: var(--icon-fill, currentColor)' d='M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z '/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-shape-pentagon:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-shape-pentagon:before {\n -webkit-mask-image: url(\"data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path style='fill: var(--icon-fill, currentColor)' d='M12,2.5L2,9.8L5.8,21.5H18.2L22,9.8L12,2.5Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path style='fill: var(--icon-fill, currentColor)' d='M12,2.5L2,9.8L5.8,21.5H18.2L22,9.8L12,2.5Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-shape-rhombus:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-shape-rhombus:before {\n -webkit-mask-image: url(\"data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path style='fill: var(--icon-fill, currentColor)' d='M12 2C11.5 2 11 2.19 10.59 2.59L2.59 10.59C1.8 11.37 1.8 12.63 2.59 13.41L10.59 21.41C11.37 22.2 12.63 22.2 13.41 21.41L21.41 13.41C22.2 12.63 22.2 11.37 21.41 10.59L13.41 2.59C13 2.19 12.5 2 12 2Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path style='fill: var(--icon-fill, currentColor)' d='M12 2C11.5 2 11 2.19 10.59 2.59L2.59 10.59C1.8 11.37 1.8 12.63 2.59 13.41L10.59 21.41C11.37 22.2 12.63 22.2 13.41 21.41L21.41 13.41C22.2 12.63 22.2 11.37 21.41 10.59L13.41 2.59C13 2.19 12.5 2 12 2Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-shape-star:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-shape-star:before {\n -webkit-mask-image: url(\"data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path style='fill: var(--icon-fill, currentColor)' d='M12,17.27L18.18,21L16.54,13.97L22,9.24L14.81,8.62L12,2L9.19,8.62L2,9.24L7.45,13.97L5.82,21L12,17.27Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path style='fill: var(--icon-fill, currentColor)' d='M12,17.27L18.18,21L16.54,13.97L22,9.24L14.81,8.62L12,2L9.19,8.62L2,9.24L7.45,13.97L5.82,21L12,17.27Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-shape-square:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-shape-square:before {\n -webkit-mask-image: url(\"data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path style='fill: var(--icon-fill, currentColor)' d='M3,3V21H21V3'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path style='fill: var(--icon-fill, currentColor)' d='M3,3V21H21V3'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-shape-triangle:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-shape-triangle:before {\n -webkit-mask-image: url(\"data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path style='fill: var(--icon-fill, currentColor)' d='M1,21H23L12,2'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path style='fill: var(--icon-fill, currentColor)' d='M1,21H23L12,2'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-shape-triangle-inverted:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-shape-triangle-inverted:before {\n -webkit-mask-image: url(\"data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path style='fill: var(--icon-fill, currentColor)' d='M1 3H23L12 22'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path style='fill: var(--icon-fill, currentColor)' d='M1 3H23L12 22'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-show:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-show:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12,9A3,3 0 0,0 9,12A3,3 0 0,0 12,15A3,3 0 0,0 15,12A3,3 0 0,0 12,9M12,17A5,5 0 0,1 7,12A5,5 0 0,1 12,7A5,5 0 0,1 17,12A5,5 0 0,1 12,17M12,4.5C7,4.5 2.73,7.61 1,12C2.73,16.39 7,19.5 12,19.5C17,19.5 21.27,16.39 23,12C21.27,7.61 17,4.5 12,4.5Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12,9A3,3 0 0,0 9,12A3,3 0 0,0 12,15A3,3 0 0,0 15,12A3,3 0 0,0 12,9M12,17A5,5 0 0,1 7,12A5,5 0 0,1 12,7A5,5 0 0,1 17,12A5,5 0 0,1 12,17M12,4.5C7,4.5 2.73,7.61 1,12C2.73,16.39 7,19.5 12,19.5C17,19.5 21.27,16.39 23,12C21.27,7.61 17,4.5 12,4.5Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-sort-a-to-z:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-sort-a-to-z:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M5 9L6.41 10.41L11 5.83V22H13V5.83L17.59 10.42L19 9L12 2L5 9Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M5 9L6.41 10.41L11 5.83V22H13V5.83L17.59 10.42L19 9L12 2L5 9Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-sort-column:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-sort-column:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M9,3L5,7H8V14H10V7H13M16,17V10H14V17H11L15,21L19,17H16Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M9,3L5,7H8V14H10V7H13M16,17V10H14V17H11L15,21L19,17H16Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-sort-z-to-a:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-sort-z-to-a:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M19 15L17.59 13.59L13 18.17V2H11V18.17L6.41 13.58L5 15L12 22L19 15Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M19 15L17.59 13.59L13 18.17V2H11V18.17L6.41 13.58L5 15L12 22L19 15Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-spotlight:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-spotlight:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='22' height='22' viewBox='0 0 22 22' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' d='M10.9902 0.5C16.7959 0.500127 21.5 5.20361 21.5 11C21.5 16.7964 16.7959 21.4999 10.9902 21.5C5.19344 21.5 0.5 16.7955 0.5 11C0.5 5.20451 5.19344 0.5 10.9902 0.5ZM15.23 17L11 14.45L6.76997 17L7.88997 12.19L4.15997 8.96L9.07997 8.54L11 4L12.92 8.53L17.84 8.95L14.11 12.18L15.23 17Z'/%3E%3C/svg%3E\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='22' height='22' viewBox='0 0 22 22' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' d='M10.9902 0.5C16.7959 0.500127 21.5 5.20361 21.5 11C21.5 16.7964 16.7959 21.4999 10.9902 21.5C5.19344 21.5 0.5 16.7955 0.5 11C0.5 5.20451 5.19344 0.5 10.9902 0.5ZM15.23 17L11 14.45L6.76997 17L7.88997 12.19L4.15997 8.96L9.07997 8.54L11 4L12.92 8.53L17.84 8.95L14.11 12.18L15.23 17Z'/%3E%3C/svg%3E\");\n}\n.svg-icon.svg-success:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-success:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12 2C6.5 2 2 6.5 2 12S6.5 22 12 22 22 17.5 22 12 17.5 2 12 2M10 17L5 12L6.41 10.59L10 14.17L17.59 6.58L19 8L10 17Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12 2C6.5 2 2 6.5 2 12S6.5 22 12 22 22 17.5 22 12 17.5 2 12 2M10 17L5 12L6.41 10.59L10 14.17L17.59 6.58L19 8L10 17Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-time:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-time:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12 20C16.4 20 20 16.4 20 12S16.4 4 12 4 4 7.6 4 12 7.6 20 12 20M12 2C17.5 2 22 6.5 22 12S17.5 22 12 22C6.5 22 2 17.5 2 12C2 6.5 6.5 2 12 2M17 13.9L16.3 15.2L11 12.3V7H12.5V11.4L17 13.9Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12 20C16.4 20 20 16.4 20 12S16.4 4 12 4 4 7.6 4 12 7.6 20 12 20M12 2C17.5 2 22 6.5 22 12S17.5 22 12 22C6.5 22 2 17.5 2 12C2 6.5 6.5 2 12 2M17 13.9L16.3 15.2L11 12.3V7H12.5V11.4L17 13.9Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-undo:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-undo:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12.5,8C9.85,8 7.45,9 5.6,10.6L2,7V16H11L7.38,12.38C8.77,11.22 10.54,10.5 12.5,10.5C16.04,10.5 19.05,12.81 20.1,16L22.47,15.22C21.08,11.03 17.15,8 12.5,8Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12.5,8C9.85,8 7.45,9 5.6,10.6L2,7V16H11L7.38,12.38C8.77,11.22 10.54,10.5 12.5,10.5C16.04,10.5 19.05,12.81 20.1,16L22.47,15.22C21.08,11.03 17.15,8 12.5,8Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-upload:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-upload:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M9,16V10H5L12,3L19,10H15V16H9M5,20V18H19V20H5Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M9,16V10H5L12,3L19,10H15V16H9M5,20V18H19V20H5Z'/%3E%3C/svg%3E%0A\");\n}\n.svg-icon.svg-wrong:before {\n content: \"\";\n display: block;\n background-color: var(--icon-fill, currentColor);\n width: var(--icon-size, 0.875rem);\n height: var(--icon-size, 0.875rem);\n -webkit-mask-size: 100%;\n mask-size: 100%;\n}\n.svg-icon.svg-wrong:before {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12,2C17.53,2 22,6.47 22,12C22,17.53 17.53,22 12,22C6.47,22 2,17.53 2,12C2,6.47 6.47,2 12,2M15.59,7L12,10.59L8.41,7L7,8.41L10.59,12L7,15.59L8.41,17L12,13.41L15.59,17L17,15.59L13.41,12L17,8.41L15.59,7Z'/%3E%3C/svg%3E%0A\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M12,2C17.53,2 22,6.47 22,12C22,17.53 17.53,22 12,22C6.47,22 2,17.53 2,12C2,6.47 6.47,2 12,2M15.59,7L12,10.59L8.41,7L7,8.41L10.59,12L7,15.59L8.41,17L12,13.41L15.59,17L17,15.59L13.41,12L17,8.41L15.59,7Z'/%3E%3C/svg%3E%0A\");\n}\n\n:host {\n display: block;\n}\n\n.chart-wrapper {\n display: -ms-flexbox;\n display: flex;\n container: chart-measure/inline-size;\n gap: 0.75rem;\n}\n\n.chart-center {\n display: grid;\n -ms-flex-positive: 1;\n flex-grow: 1;\n grid-template-columns: minmax(0, -webkit-max-content) auto 1fr;\n grid-template-columns: minmax(0, max-content) auto 1fr;\n grid-template-rows: 1fr;\n margin-right: 3rem;\n row-gap: 0.75rem;\n}\n\n.bottom-axis-label {\n grid-column: 3;\n grid-row: 3/3;\n max-width: 100%;\n}\n\n.chart-area {\n display: grid;\n grid-template-columns: subgrid;\n grid-column: 2/-1;\n row-gap: 0.75rem;\n -ms-flex-align: center;\n align-items: center;\n grid-template-rows: repeat(var(--row-count), minmax(1.5rem, 1fr)) 0;\n}\n\n.bar-legend,\n.group-legend {\n grid-column: 1;\n text-align: end;\n max-width: 12.5rem;\n -webkit-margin-end: 0.75rem;\n margin-inline-end: 0.75rem;\n}\n\n.bar-area {\n position: relative;\n grid-column: 2;\n grid-row: 1/-1;\n display: grid;\n grid-template-rows: subgrid;\n -ms-flex-align: center;\n align-items: center;\n}\n.bar-area.grouped {\n gap: 2rem;\n}\n\n.group-bars {\n display: -ms-flexbox;\n display: flex;\n -ms-flex-direction: column;\n flex-direction: column;\n gap: 0.75rem;\n}\n\n.grid-lines {\n print-color-adjust: exact;\n -webkit-print-color-adjust: exact;\n container-name: grid-lines;\n container-type: inline-size;\n position: absolute;\n block-size: 100%;\n inline-size: 100%;\n background-image: linear-gradient(90deg, var(--wmcolor-chart-gridline, #e0e0e0) 1px, transparent 1px);\n background-position: -1px;\n -webkit-border-start: 1px solid var(--wmcolor-chart-gridline, #e0e0e0);\n border-inline-start: 1px solid var(--wmcolor-chart-gridline, #e0e0e0);\n -webkit-border-after: 1px solid var(--wmcolor-chart-gridline, #e0e0e0);\n border-block-end: 1px solid var(--wmcolor-chart-gridline, #e0e0e0);\n background-size: var(--background-size);\n}\n@container chart-measure (max-width: 414px) {\n .grid-lines {\n background-size: 100%;\n }\n}\n\n.bar-wrapper {\n position: relative;\n display: -ms-flexbox;\n display: flex;\n -ms-flex-align: center;\n align-items: center;\n}\n\n.bar {\n block-size: 1.5rem;\n position: relative;\n display: -ms-flexbox;\n display: flex;\n -ms-flex-align: center;\n align-items: center;\n cursor: pointer;\n outline: none;\n print-color-adjust: exact;\n -webkit-print-color-adjust: exact;\n}\n\n.value {\n position: absolute;\n inset-inline-start: 0;\n -webkit-padding-start: 0.5rem;\n padding-inline-start: 0.5rem;\n}\n\n.x-axis {\n grid-column: 3;\n display: -ms-flexbox;\n display: flex;\n -ms-flex-pack: justify;\n justify-content: space-between;\n font-size: 0.75rem;\n}\n@container chart-measure (max-width: 414px) {\n .x-axis .tick:not(:first-of-type):not(:last-of-type) {\n visibility: hidden;\n }\n}\n.x-axis .tick {\n text-align: center;\n}\n.x-axis .tick.zero {\n text-align: start;\n}\n.x-axis .tick:last-child {\n text-align: end;\n}\n\n#chart-instructions {\n position: absolute !important;\n width: 1px !important;\n height: 1px !important;\n padding: 0 !important;\n border: 0 !important;\n overflow: hidden !important;\n clip: rect(0, 0, 0, 0) !important;\n -webkit-clip-path: inset(50%) !important;\n clip-path: inset(50%) !important;\n white-space: nowrap !important;\n margin: -1px !important;\n}";
|
|
12
|
+
const WmChartBarStyle0 = wmChartBarCss;
|
|
13
|
+
|
|
14
|
+
const ChartBar = class {
|
|
15
|
+
constructor(hostRef) {
|
|
16
|
+
index.registerInstance(this, hostRef);
|
|
17
|
+
this.wmChartBarHighlighted = index.createEvent(this, "wmChartBarHighlighted", 7);
|
|
18
|
+
this.gridMax = 0;
|
|
19
|
+
this.isGrouped = false;
|
|
20
|
+
this.legendData = [];
|
|
21
|
+
this.ungroupedDataName = "_ungrouped";
|
|
22
|
+
this.config = undefined;
|
|
23
|
+
this.data = undefined;
|
|
24
|
+
this.printMode = undefined;
|
|
25
|
+
this.subinfo = undefined;
|
|
26
|
+
this.processedData = new Map();
|
|
27
|
+
this.gridInfo = undefined;
|
|
28
|
+
this.isKeying = false;
|
|
29
|
+
}
|
|
30
|
+
////////////////////////////////////////////////////////////
|
|
31
|
+
// #region Getters
|
|
32
|
+
////////////////////////////////////////////////////////////
|
|
33
|
+
get colorPalette() {
|
|
34
|
+
var _a, _b, _c, _d;
|
|
35
|
+
// Default to discrete palette for grouped charts, single color for ungrouped
|
|
36
|
+
let palette = this.isGrouped ? interfaces.chartPalettes.discrete : ["wmcolor-dataviz-discrete-01"];
|
|
37
|
+
if (((_a = this.config) === null || _a === void 0 ? void 0 : _a.colors) === "semantic") {
|
|
38
|
+
palette = interfaces.chartPalettes.semantic;
|
|
39
|
+
}
|
|
40
|
+
else if (((_b = this.config) === null || _b === void 0 ? void 0 : _b.colors) == "discrete") {
|
|
41
|
+
palette = interfaces.chartPalettes.discrete;
|
|
42
|
+
}
|
|
43
|
+
else if ((_d = (_c = this.config) === null || _c === void 0 ? void 0 : _c.colors) === null || _d === void 0 ? void 0 : _d.startsWith("wmcolor-")) {
|
|
44
|
+
palette = [this.config.colors];
|
|
45
|
+
}
|
|
46
|
+
return palette;
|
|
47
|
+
}
|
|
48
|
+
get sort() {
|
|
49
|
+
var _a;
|
|
50
|
+
return ((_a = this.config) === null || _a === void 0 ? void 0 : _a.sort) || "none"; // default to none
|
|
51
|
+
}
|
|
52
|
+
get showLegend() {
|
|
53
|
+
var _a;
|
|
54
|
+
return ((_a = this.config) === null || _a === void 0 ? void 0 : _a.showLegend) || "none"; // default to none
|
|
55
|
+
}
|
|
56
|
+
get subinfoText() {
|
|
57
|
+
var _a;
|
|
58
|
+
return this.subinfo || ((_a = this.config) === null || _a === void 0 ? void 0 : _a.subinfo) || "";
|
|
59
|
+
}
|
|
60
|
+
get gridVisible() {
|
|
61
|
+
var _a, _b, _c;
|
|
62
|
+
return !!this.gridInfo && ((_a = this.config) === null || _a === void 0 ? void 0 : _a.gridMax) != undefined && ((_c = (_b = this.config) === null || _b === void 0 ? void 0 : _b.showGrid) !== null && _c !== void 0 ? _c : true);
|
|
63
|
+
}
|
|
64
|
+
get flattenedData() {
|
|
65
|
+
return [...this.processedData.values()].flat();
|
|
66
|
+
}
|
|
67
|
+
// #endregion getters
|
|
68
|
+
////////////////////////////////////////////////////////////
|
|
69
|
+
// #region Component lifecycle
|
|
70
|
+
////////////////////////////////////////////////////////////
|
|
71
|
+
componentDidLoad() {
|
|
72
|
+
const resizeObserver = new ResizeObserver(() => {
|
|
73
|
+
if (this.processedData) {
|
|
74
|
+
this.gridInfo = this.calculateGridInfo();
|
|
75
|
+
}
|
|
76
|
+
});
|
|
77
|
+
resizeObserver.observe(this.barAreaEl);
|
|
78
|
+
if (this.config && this.data) {
|
|
79
|
+
this.handleConfigDataChange();
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
// #endregion component lifecycle
|
|
83
|
+
////////////////////////////////////////////////////////////
|
|
84
|
+
// #region Data processing
|
|
85
|
+
////////////////////////////////////////////////////////////
|
|
86
|
+
handleConfigDataChange() {
|
|
87
|
+
if (this.config && this.data) {
|
|
88
|
+
const largest = Math.max(...this.data.map((item) => item.amount));
|
|
89
|
+
if (this.config.gridMax == "auto") {
|
|
90
|
+
this.gridMax = chartFunctions.findNiceRoundNumber(largest);
|
|
91
|
+
}
|
|
92
|
+
else if (!!this.config.gridMax) {
|
|
93
|
+
this.gridMax = this.config.gridMax;
|
|
94
|
+
}
|
|
95
|
+
else {
|
|
96
|
+
// fallback to 1 and chart should not render
|
|
97
|
+
this.gridMax = 1;
|
|
98
|
+
}
|
|
99
|
+
this.isGrouped = this.data.some((item) => item.groupName);
|
|
100
|
+
let processedItems = this.processChartData();
|
|
101
|
+
if (this.isGrouped) {
|
|
102
|
+
processedItems = chartFunctions.sortGroupedData(processedItems);
|
|
103
|
+
}
|
|
104
|
+
else if (this.sort === "ascending") {
|
|
105
|
+
processedItems.sort((a, b) => a.amount - b.amount);
|
|
106
|
+
}
|
|
107
|
+
else if (this.sort === "descending") {
|
|
108
|
+
processedItems.sort((a, b) => b.amount - a.amount);
|
|
109
|
+
}
|
|
110
|
+
this.processedData = chartFunctions.groupProcessedData(processedItems, this.ungroupedDataName);
|
|
111
|
+
// Temporary fix to remove print values for grouped charts
|
|
112
|
+
this.legendData = this.isGrouped
|
|
113
|
+
? chartFunctions.computeLegendData(this.processedData).map((item) => (Object.assign(Object.assign({}, item), { printValue: "" })))
|
|
114
|
+
: chartFunctions.computeLegendData(this.processedData);
|
|
115
|
+
this.gridInfo = this.calculateGridInfo();
|
|
116
|
+
}
|
|
117
|
+
}
|
|
118
|
+
processChartData() {
|
|
119
|
+
var _a, _b, _c, _d;
|
|
120
|
+
if (!this.data) {
|
|
121
|
+
return [];
|
|
122
|
+
}
|
|
123
|
+
const defaultValueFormat = "amount";
|
|
124
|
+
const defaultPrintModeFormat = "amount";
|
|
125
|
+
const defaultColor = "wmcolor-dataviz-discrete-01";
|
|
126
|
+
const itemTotal = this.data.reduce((acc, item) => acc + item.amount, 0);
|
|
127
|
+
const valueFormat = ((_a = this.config) === null || _a === void 0 ? void 0 : _a.valueFormat) || defaultValueFormat;
|
|
128
|
+
const printModeFormat = ((_b = this.config) === null || _b === void 0 ? void 0 : _b.printModeFormat) || defaultPrintModeFormat;
|
|
129
|
+
const isUniformConfigColor = this.colorPalette.length === 1;
|
|
130
|
+
const decimalPlaces = (_d = (_c = this.config) === null || _c === void 0 ? void 0 : _c.decimalPlaces) !== null && _d !== void 0 ? _d : 0;
|
|
131
|
+
// For grouped data, matching barLegends share color indices
|
|
132
|
+
const barLegendColorMap = new Map();
|
|
133
|
+
if (this.isGrouped) {
|
|
134
|
+
let incrementingIndex = 0;
|
|
135
|
+
this.data.forEach((item) => {
|
|
136
|
+
if (!barLegendColorMap.has(item.barLegend)) {
|
|
137
|
+
barLegendColorMap.set(item.barLegend, incrementingIndex);
|
|
138
|
+
incrementingIndex++;
|
|
139
|
+
}
|
|
140
|
+
});
|
|
141
|
+
}
|
|
142
|
+
return this.data.map((item, index) => {
|
|
143
|
+
const colorIndex = this.isGrouped ? barLegendColorMap.get(item.barLegend) || 0 : index;
|
|
144
|
+
const barColor = item.color
|
|
145
|
+
? item.color
|
|
146
|
+
: isUniformConfigColor
|
|
147
|
+
? this.colorPalette[0]
|
|
148
|
+
: this.colorPalette[colorIndex] || defaultColor;
|
|
149
|
+
const amount = decimalPlaces > 0 ? parseFloat(item.amount.toFixed(decimalPlaces)) : item.amount;
|
|
150
|
+
return {
|
|
151
|
+
barLegend: item.barLegend,
|
|
152
|
+
amount: amount,
|
|
153
|
+
gridPercent: (amount / this.gridMax) * 100,
|
|
154
|
+
displayValue: chartFunctions.formatDisplayValue(amount, itemTotal, valueFormat, decimalPlaces),
|
|
155
|
+
printValue: chartFunctions.formatDisplayValue(amount, itemTotal, printModeFormat, decimalPlaces),
|
|
156
|
+
color: barColor,
|
|
157
|
+
popoverTitle: item.popoverTitle,
|
|
158
|
+
popoverText: item.popoverText,
|
|
159
|
+
popoverButtonText: item.popoverButtonText,
|
|
160
|
+
groupName: item.groupName,
|
|
161
|
+
};
|
|
162
|
+
});
|
|
163
|
+
}
|
|
164
|
+
propagateExternalLegendData() {
|
|
165
|
+
document.querySelectorAll("wm-chart-legend").forEach((legend) => {
|
|
166
|
+
if (legend.chartIds.split(" ").includes(this.el.id)) {
|
|
167
|
+
legend.processedData = this.legendData;
|
|
168
|
+
}
|
|
169
|
+
});
|
|
170
|
+
}
|
|
171
|
+
calculateGridInfo() {
|
|
172
|
+
var _a, _b;
|
|
173
|
+
const barAreaWidth = this.barAreaEl.getBoundingClientRect().width;
|
|
174
|
+
const maxTicks = barAreaWidth > 0 ? chartFunctions.getMaxTicks(barAreaWidth) : 1;
|
|
175
|
+
const { numIntervals, interval } = chartFunctions.findLargestNiceInterval(maxTicks, this.gridMax);
|
|
176
|
+
const tickLabels = [];
|
|
177
|
+
for (let i = 1; i <= numIntervals; i++) {
|
|
178
|
+
const tickValue = i * interval;
|
|
179
|
+
const decimalPlaces = (_b = (_a = this.config) === null || _a === void 0 ? void 0 : _a.decimalPlaces) !== null && _b !== void 0 ? _b : chartFunctions.inferDecimalPlacesForUnitValue(tickValue);
|
|
180
|
+
tickLabels.push(chartFunctions.suffixNumber(tickValue, decimalPlaces));
|
|
181
|
+
}
|
|
182
|
+
return {
|
|
183
|
+
numTicks: numIntervals,
|
|
184
|
+
interval: interval,
|
|
185
|
+
backgroundSize: `${100 / numIntervals}%`,
|
|
186
|
+
tickLabels: tickLabels,
|
|
187
|
+
};
|
|
188
|
+
}
|
|
189
|
+
// #endregion data processing
|
|
190
|
+
////////////////////////////////////////////////////////////
|
|
191
|
+
// #region Keyboard interaction and Event handling
|
|
192
|
+
////////////////////////////////////////////////////////////
|
|
193
|
+
handleChartKeyDown(ev) {
|
|
194
|
+
switch (ev.key) {
|
|
195
|
+
case "ArrowDown":
|
|
196
|
+
case "ArrowRight":
|
|
197
|
+
ev.preventDefault();
|
|
198
|
+
if (this.el.shadowRoot.activeElement === this.componentWrapperEl) {
|
|
199
|
+
this.focusBar(0);
|
|
200
|
+
}
|
|
201
|
+
break;
|
|
202
|
+
case "Tab":
|
|
203
|
+
this.clearFocus();
|
|
204
|
+
break;
|
|
205
|
+
case "Escape":
|
|
206
|
+
ev.preventDefault();
|
|
207
|
+
ev.stopPropagation();
|
|
208
|
+
if (this.popoverEl.open) {
|
|
209
|
+
this.popoverEl.open = false;
|
|
210
|
+
}
|
|
211
|
+
break;
|
|
212
|
+
}
|
|
213
|
+
}
|
|
214
|
+
handleBarKeyDown(ev, item) {
|
|
215
|
+
const barIdx = this.flattenedData.indexOf(item);
|
|
216
|
+
switch (ev.key) {
|
|
217
|
+
case "ArrowUp":
|
|
218
|
+
case "ArrowLeft":
|
|
219
|
+
ev.preventDefault();
|
|
220
|
+
this.focusBar(barIdx - 1);
|
|
221
|
+
break;
|
|
222
|
+
case "ArrowDown":
|
|
223
|
+
case "ArrowRight":
|
|
224
|
+
ev.preventDefault();
|
|
225
|
+
this.focusBar(barIdx + 1);
|
|
226
|
+
break;
|
|
227
|
+
case "Enter":
|
|
228
|
+
if (this.popoverEl.open) {
|
|
229
|
+
const popoverBtn = this.popoverEl.querySelector("button");
|
|
230
|
+
popoverBtn && popoverBtn.click();
|
|
231
|
+
}
|
|
232
|
+
break;
|
|
233
|
+
}
|
|
234
|
+
}
|
|
235
|
+
handleBarClick(ev, item) {
|
|
236
|
+
this.openPopover(item, { x: ev.clientX, y: ev.clientY });
|
|
237
|
+
this.highlightBar(item);
|
|
238
|
+
}
|
|
239
|
+
handleLegendItemClick(ev) {
|
|
240
|
+
var _a;
|
|
241
|
+
if (ev.target.nodeName === "WM-CHART-LEGEND") {
|
|
242
|
+
// If event from an internal legend bubbles up to the chart, ignore it
|
|
243
|
+
const legendEl = ev.target;
|
|
244
|
+
if (legendEl.chartIds.includes(this.el.id)) {
|
|
245
|
+
if (ev.detail.idx == -1) {
|
|
246
|
+
this.clearHighlights();
|
|
247
|
+
}
|
|
248
|
+
else {
|
|
249
|
+
const barLegend = (_a = this.legendData[ev.detail.idx]) === null || _a === void 0 ? void 0 : _a.barLegend;
|
|
250
|
+
if (barLegend) {
|
|
251
|
+
this.highlightBarsByLegend(barLegend);
|
|
252
|
+
}
|
|
253
|
+
}
|
|
254
|
+
}
|
|
255
|
+
}
|
|
256
|
+
}
|
|
257
|
+
handleDocumentClick(_ev) {
|
|
258
|
+
// Clear highlights when highlight is set from an external legend (not opening a popover)
|
|
259
|
+
if (!this.popoverEl.open) {
|
|
260
|
+
this.clearHighlights();
|
|
261
|
+
}
|
|
262
|
+
}
|
|
263
|
+
// #endregion keyboard interaction and event handling
|
|
264
|
+
////////////////////////////////////////////////////////////
|
|
265
|
+
// #region Focus and Highlighting
|
|
266
|
+
////////////////////////////////////////////////////////////
|
|
267
|
+
handleUserIsKeying() {
|
|
268
|
+
this.isKeying = true;
|
|
269
|
+
}
|
|
270
|
+
handleUserIsNotKeying() {
|
|
271
|
+
this.isKeying = false;
|
|
272
|
+
}
|
|
273
|
+
handleComponentBlur(ev) {
|
|
274
|
+
if (!functions.isElOrChild(this.el, ev.relatedTarget)) {
|
|
275
|
+
this.clearFocus();
|
|
276
|
+
}
|
|
277
|
+
}
|
|
278
|
+
focusBar(barIdx) {
|
|
279
|
+
const bars = this.el.shadowRoot.querySelectorAll(".bar");
|
|
280
|
+
const wrappedIdx = ((barIdx % bars.length) + bars.length) % bars.length;
|
|
281
|
+
const barToFocus = bars[wrappedIdx];
|
|
282
|
+
barToFocus.focus();
|
|
283
|
+
const item = this.flattenedData[wrappedIdx];
|
|
284
|
+
if (item) {
|
|
285
|
+
this.highlightBar(item);
|
|
286
|
+
const cornerOffset = 12;
|
|
287
|
+
this.openPopover(item, {
|
|
288
|
+
x: barToFocus.getBoundingClientRect().left + cornerOffset,
|
|
289
|
+
y: barToFocus.getBoundingClientRect().top + cornerOffset,
|
|
290
|
+
});
|
|
291
|
+
}
|
|
292
|
+
}
|
|
293
|
+
handlePopoverToggled(_ev) {
|
|
294
|
+
setTimeout(() => {
|
|
295
|
+
// allow time for the popover to reopen if the click that closed it was on a bar, to prevent flash
|
|
296
|
+
if (this.popoverEl.open) {
|
|
297
|
+
const chartData = this.popoverEl.chartData;
|
|
298
|
+
const item = this.flattenedData.find((item) => item.barLegend === (chartData === null || chartData === void 0 ? void 0 : chartData.barLegend) && item.groupName === (chartData === null || chartData === void 0 ? void 0 : chartData.groupName));
|
|
299
|
+
item && this.highlightBar(item);
|
|
300
|
+
}
|
|
301
|
+
else {
|
|
302
|
+
this.clearHighlights();
|
|
303
|
+
}
|
|
304
|
+
}, 30);
|
|
305
|
+
}
|
|
306
|
+
openPopover(clickedProcessedData, coords) {
|
|
307
|
+
if (!this.data || !this.config) {
|
|
308
|
+
return;
|
|
309
|
+
}
|
|
310
|
+
let matchingChartData = this.data.find((item) => item.barLegend === clickedProcessedData.barLegend && item.groupName === clickedProcessedData.groupName);
|
|
311
|
+
if (matchingChartData) {
|
|
312
|
+
const popoverButtonText = matchingChartData.popoverButtonText || this.config.popoverButtonText || "";
|
|
313
|
+
this.barAreaEl.classList.toggle("hide-focus-ring", !!popoverButtonText);
|
|
314
|
+
this.popoverEl.chartData = matchingChartData;
|
|
315
|
+
this.popoverEl.header = matchingChartData.popoverTitle || this.config.popoverTitle || "";
|
|
316
|
+
this.popoverEl.text = matchingChartData.popoverText || this.config.popoverText || "";
|
|
317
|
+
this.popoverEl.buttonText = popoverButtonText;
|
|
318
|
+
this.popoverEl.coords = coords;
|
|
319
|
+
window.setTimeout(() => {
|
|
320
|
+
this.popoverEl.open = true;
|
|
321
|
+
this.popoverEl.announceContents();
|
|
322
|
+
}, 30);
|
|
323
|
+
}
|
|
324
|
+
}
|
|
325
|
+
clearHighlights() {
|
|
326
|
+
const barItems = this.el.shadowRoot.querySelectorAll(".bar-wrapper");
|
|
327
|
+
barItems.forEach((barItem) => {
|
|
328
|
+
barItem.classList.remove("faded");
|
|
329
|
+
});
|
|
330
|
+
this.wmChartBarHighlighted.emit({ idx: -1 });
|
|
331
|
+
}
|
|
332
|
+
highlightBar(item) {
|
|
333
|
+
const idx = this.flattenedData.indexOf(item);
|
|
334
|
+
const barItems = this.el.shadowRoot.querySelectorAll(".bar-wrapper");
|
|
335
|
+
barItems.forEach((barItem) => {
|
|
336
|
+
barItem.classList.add("faded");
|
|
337
|
+
});
|
|
338
|
+
barItems[idx].classList.remove("faded");
|
|
339
|
+
const legendIdx = this.legendData.findIndex((legendItem) => legendItem.barLegend === item.barLegend);
|
|
340
|
+
this.wmChartBarHighlighted.emit({ idx: legendIdx });
|
|
341
|
+
}
|
|
342
|
+
highlightBarsByLegend(barLegend) {
|
|
343
|
+
const barItems = this.el.shadowRoot.querySelectorAll(".bar-wrapper");
|
|
344
|
+
barItems.forEach((barItem, idx) => {
|
|
345
|
+
var _a;
|
|
346
|
+
if (((_a = this.flattenedData[idx]) === null || _a === void 0 ? void 0 : _a.barLegend) === barLegend) {
|
|
347
|
+
barItem.classList.remove("faded");
|
|
348
|
+
}
|
|
349
|
+
else {
|
|
350
|
+
barItem.classList.add("faded");
|
|
351
|
+
}
|
|
352
|
+
});
|
|
353
|
+
}
|
|
354
|
+
clearFocus() {
|
|
355
|
+
if (this.popoverEl.open) {
|
|
356
|
+
this.popoverEl.open = false;
|
|
357
|
+
}
|
|
358
|
+
this.clearHighlights();
|
|
359
|
+
}
|
|
360
|
+
// #endregion focus and highlighting
|
|
361
|
+
////////////////////////////////////////////////////////////
|
|
362
|
+
// #region Rendering
|
|
363
|
+
////////////////////////////////////////////////////////////
|
|
364
|
+
renderBarLegends() {
|
|
365
|
+
const legends = [];
|
|
366
|
+
this.processedData.forEach((items) => {
|
|
367
|
+
items.forEach((item) => {
|
|
368
|
+
legends.push(index.h("div", { key: `legend-${item.barLegend}`, class: "bar-legend" }, item.barLegend));
|
|
369
|
+
});
|
|
370
|
+
});
|
|
371
|
+
return legends;
|
|
372
|
+
}
|
|
373
|
+
renderBar(item, effectiveGridMax) {
|
|
374
|
+
var _a;
|
|
375
|
+
const barPercent = effectiveGridMax > 0 ? (item.amount / effectiveGridMax) * 100 : 0;
|
|
376
|
+
return (index.h("div", { key: `bar-${item.groupName}-${item.barLegend}`, class: "bar-wrapper" }, index.h("div", { class: "bar", style: { flexBasis: `${barPercent}%`, backgroundColor: `var(--${item.color})` }, onClick: (ev) => this.handleBarClick(ev, item), onKeyDown: (ev) => this.handleBarKeyDown(ev, item), tabindex: "-1", "aria-label": `${(_a = this.config) === null || _a === void 0 ? void 0 : _a.categoryAxisLabel}, ${item.groupName ? `${item.groupName},` : ""} ${item.barLegend} ${item.displayValue}` }), index.h("span", { class: "value", style: { insetInlineStart: `${barPercent}%` } }, item.displayValue)));
|
|
377
|
+
}
|
|
378
|
+
renderBars() {
|
|
379
|
+
if (!this.gridInfo || !this.processedData) {
|
|
380
|
+
return;
|
|
381
|
+
}
|
|
382
|
+
const effectiveGridMax = this.gridInfo.numTicks * this.gridInfo.interval;
|
|
383
|
+
const bars = [];
|
|
384
|
+
this.processedData.forEach((items) => {
|
|
385
|
+
items.forEach((item) => {
|
|
386
|
+
bars.push(this.renderBar(item, effectiveGridMax));
|
|
387
|
+
});
|
|
388
|
+
});
|
|
389
|
+
return bars;
|
|
390
|
+
}
|
|
391
|
+
renderGroupLegends() {
|
|
392
|
+
const legends = [];
|
|
393
|
+
this.processedData.forEach((_, groupName) => {
|
|
394
|
+
legends.push(index.h("div", { key: `legend-${groupName}`, class: "group-legend" }, groupName));
|
|
395
|
+
});
|
|
396
|
+
return legends;
|
|
397
|
+
}
|
|
398
|
+
renderGroupedBars() {
|
|
399
|
+
if (!this.gridInfo || !this.processedData) {
|
|
400
|
+
return;
|
|
401
|
+
}
|
|
402
|
+
const effectiveGridMax = this.gridInfo.numTicks * this.gridInfo.interval;
|
|
403
|
+
const groupedBars = [];
|
|
404
|
+
this.processedData.forEach((items, groupName) => {
|
|
405
|
+
groupedBars.push(index.h("div", { key: `group-${groupName}`, class: "group-bars" }, items.map((item) => this.renderBar(item, effectiveGridMax))));
|
|
406
|
+
});
|
|
407
|
+
return groupedBars;
|
|
408
|
+
}
|
|
409
|
+
renderXAxis() {
|
|
410
|
+
var _a;
|
|
411
|
+
return (index.h("div", { class: "x-axis", "aria-hidden": "true" }, index.h("div", { class: "tick zero" }, index.h("span", null, "0")), (_a = this.gridInfo) === null || _a === void 0 ? void 0 :
|
|
412
|
+
_a.tickLabels.map((label) => (index.h("div", { class: "tick", key: label }, index.h("span", null, label))))));
|
|
413
|
+
}
|
|
414
|
+
renderGrid() {
|
|
415
|
+
var _a;
|
|
416
|
+
const backgroundSize = (_a = this.gridInfo) === null || _a === void 0 ? void 0 : _a.backgroundSize;
|
|
417
|
+
return index.h("div", { class: "grid-lines", style: { "--background-size": backgroundSize } });
|
|
418
|
+
}
|
|
419
|
+
renderLegend(orientation) {
|
|
420
|
+
var _a, _b, _c;
|
|
421
|
+
return (index.h("div", { class: `legend --${orientation} --${this.showLegend}` }, index.h("wm-chart-legend", { orientation: orientation, chartIds: this.el.id, processedData: this.legendData, printMode: (_c = (_a = this.printMode) !== null && _a !== void 0 ? _a : (_b = this.config) === null || _b === void 0 ? void 0 : _b.printMode) !== null && _c !== void 0 ? _c : false, onWmLegendItemClick: (ev) => this.handleLegendItemClick(ev), onWmLegendItemHover: (ev) => this.handleLegendItemClick(ev) })));
|
|
422
|
+
}
|
|
423
|
+
// #endregion rendering
|
|
424
|
+
render() {
|
|
425
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
426
|
+
const rowCount = this.isGrouped
|
|
427
|
+
? this.processedData.size || 1
|
|
428
|
+
: ((_a = this.processedData.get(this.ungroupedDataName)) === null || _a === void 0 ? void 0 : _a.length) || 1;
|
|
429
|
+
return (index.h(index.Host, { key: '3b74260fc064e4cf1df031ba5bb466c70f64aae7' }, index.h("div", { key: 'f307a461551ab86718daa7be15a9aa01df964f8e', class: "popover-wrapper" }, index.h("priv-chart-popover", { key: '125785411ad749ebff08956a7bb9f845079b6fe9', ref: (el) => (this.popoverEl = el), onIntChartPopoverToggled: (ev) => this.handlePopoverToggled(ev) })), index.h("div", { key: 'b7ea3733062adae46a95f29c62bd8fcbde267f85', ref: (el) => (this.componentWrapperEl = el), class: "component-wrapper", tabindex: "0", role: "application", onKeyDown: (ev) => this.handleChartKeyDown(ev), onBlur: (ev) => this.handleComponentBlur(ev), "aria-roledescription": intl.chartMessages.interactiveChart, "aria-describedby": "chart-instructions", "aria-label": (_b = this.config) === null || _b === void 0 ? void 0 : _b.label }, ((_d = (_c = this.config) === null || _c === void 0 ? void 0 : _c.showLabel) !== null && _d !== void 0 ? _d : true) && (index.h("label", { key: 'fa3d8d0273babe8b59f0c0f47e6e01ce9ddcb1d0', id: "label", class: "label" }, index.h("span", { key: '2606d06a14473407cf124df7110c422629d86441', class: "label-text" }, (_e = this.config) === null || _e === void 0 ? void 0 : _e.label), this.subinfoText ? index.h("span", { class: "subinfo" }, this.subinfoText) : "")), this.showLegend === "top" && this.renderLegend("horizontal"), index.h("div", { key: 'f9c6279644985f9ee68033bb453bc58ba6e6f5e5', class: "chart-wrapper" }, index.h("div", { key: '6ba5a2264bb8a09eda99857618fd2ad9417867a9', class: "chart-left-side" }, this.showLegend === "left" && this.renderLegend("vertical"), index.h("div", { key: '4191034bfb04251c0929908bfbf0d0d0f12b1158', class: "left-axis-label" }, index.h("span", { key: '9f65ae5e36e6fb81e8836945e38361e5e763478d', class: "axis-label-text" }, (_f = this.config) === null || _f === void 0 ? void 0 : _f.categoryAxisLabel))), index.h("div", { key: 'cd8471f1dc5cbfd11f8140bca98bcf7712827a1a', class: "chart-center" }, index.h("div", { key: '452b0300834def5692c02995f512f367d9eb56cf', class: "chart-area", style: { "--row-count": rowCount.toString() } }, this.processedData && (this.isGrouped ? this.renderGroupLegends() : this.renderBarLegends()), index.h("div", { key: '28d76d67ec101ed82596368eb9b0a191664b63aa', class: `bar-area ${this.isKeying ? "user-is-keying" : ""} ${this.isGrouped ? "grouped" : ""}`, ref: (el) => (this.barAreaEl = el) }, this.gridVisible && this.renderGrid(), ((_g = this.config) === null || _g === void 0 ? void 0 : _g.gridMax) != undefined && (this.isGrouped ? this.renderGroupedBars() : this.renderBars()))), index.h("div", { key: '3eec1c1d4c36dee63755591865d502164e9e25b6', class: "bottom-axis-label" }, index.h("span", { key: '990f98d2f988aa9912e74c71cf3f1d795b9c2a8a', class: "axis-label-text" }, (_h = this.config) === null || _h === void 0 ? void 0 : _h.valueAxisLabel)), this.gridVisible && this.renderXAxis()), index.h("div", { key: '80d1dd23754497644483aa058f998ff3b830542b', class: "chart-right-side" }, this.showLegend === "right" && this.renderLegend("vertical"))), this.showLegend === "bottom" && this.renderLegend("horizontal"), chartFunctions.renderInstructionsText())));
|
|
430
|
+
}
|
|
431
|
+
static get delegatesFocus() { return true; }
|
|
432
|
+
get el() { return index.getElement(this); }
|
|
433
|
+
static get watchers() { return {
|
|
434
|
+
"config": ["handleConfigDataChange"],
|
|
435
|
+
"data": ["handleConfigDataChange"],
|
|
436
|
+
"processedData": ["propagateExternalLegendData"]
|
|
437
|
+
}; }
|
|
438
|
+
};
|
|
439
|
+
ChartBar.style = WmChartBarStyle0;
|
|
440
|
+
|
|
441
|
+
exports.wm_chart_bar = ChartBar;
|