@ironsource/shared-ui 2.1.8 → 2.1.9-test.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/Chart.vue_vue_type_style_index_0_scoped_ea1e5c3e_lang.css +1 -0
- package/ChartHeader.vue_vue_type_style_index_0_scoped_4c37736e_lang.css +1 -0
- package/ChartLegend.vue_vue_type_style_index_0_scoped_c0f71a49_lang.css +1 -0
- package/DropdownV4.vue_vue_type_style_index_0_scoped_119e4bc3_lang.css +1 -0
- package/DropdownV4.vue_vue_type_style_index_1_lang.css +1 -1
- package/SettingsHeader.vue_vue_type_style_index_0_scoped_9b6cd9d9_lang.css +1 -0
- package/Typography.vue_vue_type_style_index_0_scoped_992962bc_lang.css +1 -0
- package/components/chart/Chart.vue.d.ts +5 -0
- package/components/chart/Chart.vue.js +4 -4
- package/components/chart/Chart.vue2.js +51 -49
- package/components/chart/ChartHeader.vue.d.ts +5 -0
- package/components/chart/ChartHeader.vue.js +2 -2
- package/components/chart/ChartHeader.vue2.js +35 -22
- package/components/chart/ChartLegend.vue.js +3 -3
- package/components/chart/ChartLegend.vue2.js +35 -28
- package/components/chart/SettingsHeader.vue.js +3 -3
- package/components/chart/SettingsHeader.vue2.js +33 -26
- package/components/chart/index.d.ts +20 -1
- package/components/dropdown/v4/DropdownV4.vue.d.ts +6 -0
- package/components/dropdown/v4/DropdownV4.vue.js +2 -2
- package/components/dropdown/v4/DropdownV4.vue2.js +118 -107
- package/components/dropdown/v4/index.d.ts +25 -1
- package/components/typography/v4/Typography.vue.js +2 -2
- package/components/typography/v4/Typography.vue2.js +1 -1
- package/index.d.ts +50 -2
- package/index.js +1 -1
- package/package.json +1 -1
- package/Chart.vue_vue_type_style_index_0_scoped_df85e0af_lang.css +0 -1
- package/ChartHeader.vue_vue_type_style_index_0_scoped_2e3de9c5_lang.css +0 -1
- package/ChartLegend.vue_vue_type_style_index_0_scoped_efc608f9_lang.css +0 -1
- package/DropdownV4.vue_vue_type_style_index_0_scoped_62a620ee_lang.css +0 -1
- package/SettingsHeader.vue_vue_type_style_index_0_scoped_1791e4fe_lang.css +0 -1
- package/Typography.vue_vue_type_style_index_0_scoped_b00956b7_lang.css +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.chart-container[data-v-ea1e5c3e]{border:1px solid var(--common-divider);background:var(--background-paper);display:flex;height:388px;border-radius:0 0 6px 6px}.header-wrapper[data-v-ea1e5c3e]{height:76px}.chart-content[data-v-ea1e5c3e]{flex:1}.chart-sidebar[data-v-ea1e5c3e]{border-left:1px solid var(--common-divider)}.chart[data-v-ea1e5c3e]{width:100%;height:312px;position:relative}.chart__canvas[data-v-ea1e5c3e]{width:100%;height:100%}.chart__tooltip[data-v-ea1e5c3e]{position:absolute;pointer-events:none;transition:all .1s ease;min-width:214px;max-width:270px}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.chart-header[data-v-4c37736e]{display:flex;align-items:center;justify-content:space-between;padding:24px 24px 0}.chart-header .subheader[data-v-4c37736e]{color:var(--text-secondary)}.header-texts[data-v-4c37736e]{display:flex;flex-direction:column;color:var(--text-primary);gap:4px}.type-switch[data-v-4c37736e]{display:flex;align-items:center;gap:4px}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.chart-legend[data-v-c0f71a49]{display:flex;flex-direction:column;width:220px;height:100%;padding-bottom:8px}.search-box[data-v-c0f71a49]{padding:12px 12px 4px}.legend[data-v-c0f71a49]{overflow-y:auto;color:var(--text-primary)}.legend__list[data-v-c0f71a49]{list-style:none;padding:0 12px 0 20px}.legend__list>li[data-v-c0f71a49]{display:flex;align-items:center;gap:8px;height:32px}.legend__list>li .legend-label[data-v-c0f71a49]{width:80%}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.v-enter-active[data-v-119e4bc3],.v-leave-active[data-v-119e4bc3]{transition:opacity .25s ease}ol[data-v-119e4bc3],ul[data-v-119e4bc3],menu[data-v-119e4bc3]{list-style:none;margin:0;padding:0}.dropdown.full-width[data-v-119e4bc3],.dropdown.full-width .button__container[data-v-119e4bc3]{width:100%}.dropdown-list-wrapper[data-v-119e4bc3]{display:flex;flex-direction:column;padding:.5rem .5rem .25rem}.dropdown-list-wrapper--multi[data-v-119e4bc3]{padding:.5rem}.list-container--multi[data-v-119e4bc3]{margin-bottom:0}.inline-search .inline-search-wrapper[data-v-119e4bc3]{padding-bottom:.25rem;display:flex;flex-direction:row;gap:.25rem}.inline-search .list-container[data-v-119e4bc3]{padding-top:0}.inline-search-wrapper[data-v-119e4bc3]{display:flex;flex-direction:row;gap:.25rem}.no-result-container[data-v-119e4bc3]{height:100%;display:flex;align-items:center;padding:.375rem .5rem;color:var(--text-disabled)}.no-result[data-v-119e4bc3]{color:var(--text-disabled);padding-left:.5rem}.list[data-v-119e4bc3]{outline:none;display:flex;flex-direction:column;width:100%;min-height:2rem}.list--multi[data-v-119e4bc3]{margin-bottom:.5rem;border-bottom-left-radius:0;border-bottom-right-radius:0}.image-slot[data-v-119e4bc3]{margin-right:.5rem}.actions-wrapper[data-v-119e4bc3]{display:flex;width:100%;padding:.5rem .5rem .5rem .125rem;padding-bottom:0;border-top:1px solid var(--common-divider);justify-content:space-between;margin-top:.25rem}.apply-button[data-v-119e4bc3]{margin-left:.5rem}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.resize-observer[data-v-b329ee4c]{position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;border:none;background-color:transparent;pointer-events:none;display:block;overflow:hidden;opacity:0}.resize-observer[data-v-b329ee4c] object{display:block;position:absolute;top:0;left:0;height:100%;width:100%;overflow:hidden;pointer-events:none;z-index:-1}.v-popper__popper{z-index:10000;top:0;left:0;outline:none}.v-popper__popper.v-popper__popper--hidden{visibility:hidden;opacity:0;transition:opacity .15s,visibility .15s;pointer-events:none}.v-popper__popper.v-popper__popper--shown{visibility:visible;opacity:1;transition:opacity .15s}.v-popper__popper.v-popper__popper--skip-transition,.v-popper__popper.v-popper__popper--skip-transition>.v-popper__wrapper{transition:none!important}.v-popper__backdrop{position:absolute;top:0;left:0;width:100%;height:100%;display:none}.v-popper__inner{position:relative;box-sizing:border-box;overflow-y:auto}.v-popper__inner>div{position:relative;z-index:1;max-width:inherit;max-height:inherit}.v-popper__arrow-container{position:absolute;width:10px;height:10px}.v-popper__popper--arrow-overflow .v-popper__arrow-container,.v-popper__popper--no-positioning .v-popper__arrow-container{display:none}.v-popper__arrow-inner,.v-popper__arrow-outer{border-style:solid;position:absolute;top:0;left:0;width:0;height:0}.v-popper__arrow-inner{visibility:hidden;border-width:7px}.v-popper__arrow-outer{border-width:6px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner{left:-2px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-outer,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{left:-1px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-outer{border-bottom-width:0;border-left-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner{top:-2px}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-container{top:0}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{border-top-width:0;border-left-color:transparent!important;border-right-color:transparent!important;border-top-color:transparent!important}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner{top:-4px}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{top:-6px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner{top:-2px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-outer,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{top:-1px}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{border-left-width:0;border-left-color:transparent!important;border-top-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner{left:-4px}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{left:-6px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-container{right:-10px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-outer{border-right-width:0;border-top-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner{left:-2px}.v-popper--theme-dropdown .v-popper__inner{background:#fff;color:#000;border-radius:6px;border:1px solid #ddd;box-shadow:0 6px 30px #0000001a}.v-popper--theme-dropdown .v-popper__arrow-inner{visibility:visible;border-color:#fff}.v-popper--theme-dropdown .v-popper__arrow-outer{border-color:#ddd}.v-popper--theme-tooltip .v-popper__inner{background:rgba(0,0,0,.8);color:#fff;border-radius:6px;padding:7px 12px 6px}.v-popper--theme-tooltip .v-popper__arrow-outer{border-color:#000c}.v-popper--theme-light-theme-v4.v4-dropdown{display:block}.v-popper--theme-light-theme-v4.v4-dropdown .v-popper__wrapper{background:var(--background-default);margin-top:.25rem;min-width:240px;box-shadow:var(--elevation-lg);border-radius:.5rem;border:1px solid var(--common-divider)}.v-popper--theme-light-theme-v4.v4-dropdown .v-popper__arrow-container{display:none}.v-popper--theme-light-theme-v4.v4-dropdown--auto-size .v-popper__wrapper{width:auto}.full-width .v-popper--theme-light-theme-v4{width:100%}.actions-clear-all .button-wrap .font-button{font-weight:400}.dropdown-field-help-text{margin-top:4px}
|
|
1
|
+
.resize-observer[data-v-b329ee4c]{position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;border:none;background-color:transparent;pointer-events:none;display:block;overflow:hidden;opacity:0}.resize-observer[data-v-b329ee4c] object{display:block;position:absolute;top:0;left:0;height:100%;width:100%;overflow:hidden;pointer-events:none;z-index:-1}.v-popper__popper{z-index:10000;top:0;left:0;outline:none}.v-popper__popper.v-popper__popper--hidden{visibility:hidden;opacity:0;transition:opacity .15s,visibility .15s;pointer-events:none}.v-popper__popper.v-popper__popper--shown{visibility:visible;opacity:1;transition:opacity .15s}.v-popper__popper.v-popper__popper--skip-transition,.v-popper__popper.v-popper__popper--skip-transition>.v-popper__wrapper{transition:none!important}.v-popper__backdrop{position:absolute;top:0;left:0;width:100%;height:100%;display:none}.v-popper__inner{position:relative;box-sizing:border-box;overflow-y:auto}.v-popper__inner>div{position:relative;z-index:1;max-width:inherit;max-height:inherit}.v-popper__arrow-container{position:absolute;width:10px;height:10px}.v-popper__popper--arrow-overflow .v-popper__arrow-container,.v-popper__popper--no-positioning .v-popper__arrow-container{display:none}.v-popper__arrow-inner,.v-popper__arrow-outer{border-style:solid;position:absolute;top:0;left:0;width:0;height:0}.v-popper__arrow-inner{visibility:hidden;border-width:7px}.v-popper__arrow-outer{border-width:6px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner{left:-2px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-outer,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{left:-1px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-outer{border-bottom-width:0;border-left-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner{top:-2px}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-container{top:0}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{border-top-width:0;border-left-color:transparent!important;border-right-color:transparent!important;border-top-color:transparent!important}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner{top:-4px}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{top:-6px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner{top:-2px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-outer,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{top:-1px}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{border-left-width:0;border-left-color:transparent!important;border-top-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner{left:-4px}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{left:-6px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-container{right:-10px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-outer{border-right-width:0;border-top-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner{left:-2px}.v-popper--theme-dropdown .v-popper__inner{background:#fff;color:#000;border-radius:6px;border:1px solid #ddd;box-shadow:0 6px 30px #0000001a}.v-popper--theme-dropdown .v-popper__arrow-inner{visibility:visible;border-color:#fff}.v-popper--theme-dropdown .v-popper__arrow-outer{border-color:#ddd}.v-popper--theme-tooltip .v-popper__inner{background:rgba(0,0,0,.8);color:#fff;border-radius:6px;padding:7px 12px 6px}.v-popper--theme-tooltip .v-popper__arrow-outer{border-color:#000c}.v-popper--theme-light-theme-v4.v4-dropdown{display:block}.v-popper--theme-light-theme-v4.v4-dropdown .v-popper__wrapper{background:var(--background-default);margin-top:.25rem;min-width:240px;box-shadow:var(--elevation-lg);border-radius:.5rem;border:1px solid var(--common-divider)}.v-popper--theme-light-theme-v4.v4-dropdown .v-popper__arrow-container{display:none}.v-popper--theme-light-theme-v4.v4-dropdown--auto-size .v-popper__wrapper{width:auto}.v-popper--theme-light-theme-v4.v4-dropdown--custom-width .v-popper__wrapper{min-width:none}.full-width .v-popper--theme-light-theme-v4{width:100%}.actions-clear-all .button-wrap .font-button{font-weight:400}.dropdown-field-help-text{margin-top:4px}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.settings-header-container[data-v-9b6cd9d9]{display:flex;border:.0625rem solid var(--common-divider);border-radius:.375rem .375rem 0 0;border-bottom:none;background-color:var(--background-paper-elevation-0, #f9f9f9);justify-content:space-between}.settings-header-container .settings[data-v-9b6cd9d9]{display:flex;flex-direction:row;justify-content:space-between;height:4rem;padding:.75rem 0 .75rem 1.5rem;align-items:center;gap:.75rem;flex:1}.settings-header-container .settings .chart-type-selection[data-v-9b6cd9d9]{display:flex;height:1.75rem;max-width:8.125rem}.settings-header-container .settings-spacer[data-v-9b6cd9d9]{padding:.75rem 1.5rem}.settings-header-container .breakdowns[data-v-9b6cd9d9]{display:flex;width:13.8125rem;height:4rem;padding:0 .75rem;flex-direction:column;justify-content:center;align-items:flex-start;gap:.75rem}.settings-header-container .breakdowns-border[data-v-9b6cd9d9]{border-left:.0625rem solid var(--common-divider)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";.font-tab-label2[data-v-992962bc],.font-chart-2[data-v-992962bc],.font-chart-1[data-v-992962bc]{font-family:Inter,sans-serif;font-weight:700}.font-chip-label[data-v-992962bc],.font-table-label[data-v-992962bc],.font-button[data-v-992962bc],.font-heading-6[data-v-992962bc],.font-heading-5[data-v-992962bc],.font-heading-4[data-v-992962bc],.font-heading-3[data-v-992962bc],.font-heading-2[data-v-992962bc],.font-heading-1[data-v-992962bc],.font-title[data-v-992962bc]{font-family:Inter,sans-serif;font-weight:600}.font-tab-label1[data-v-992962bc],.font-input-label[data-v-992962bc],.font-overline[data-v-992962bc],.font-subtitle-2[data-v-992962bc],.font-subtitle-1[data-v-992962bc]{font-family:Inter,sans-serif;font-weight:500}.font-caption[data-v-992962bc],.font-body-2[data-v-992962bc],.font-body-1[data-v-992962bc]{font-family:Inter,sans-serif;font-weight:400}.font-title[data-v-992962bc]{font-size:2.5rem;line-height:3rem;letter-spacing:-.055rem}.font-heading-1[data-v-992962bc]{font-size:1.5rem;line-height:1.75rem;letter-spacing:-.0285rem}.font-heading-2[data-v-992962bc]{font-size:1.125rem;line-height:1.75rem;letter-spacing:-.01575rem}.font-heading-3[data-v-992962bc]{font-size:1rem;line-height:1.5rem;letter-spacing:-.011rem}.font-heading-4[data-v-992962bc]{font-size:.875rem;line-height:1rem;letter-spacing:unset}.font-heading-5[data-v-992962bc]{font-size:.8125rem;line-height:16px;letter-spacing:unset}.font-heading-6[data-v-992962bc]{font-size:.75rem;line-height:.75rem;letter-spacing:0}.font-body-1[data-v-992962bc]{font-size:.875rem;line-height:1.25rem;letter-spacing:-.00525rem}.font-body-2[data-v-992962bc]{font-size:.8125rem;line-height:1.25rem;letter-spacing:-.00244rem}.font-subtitle-1[data-v-992962bc]{font-size:.875rem;line-height:1.25rem;letter-spacing:-.00525rem}.font-subtitle-2[data-v-992962bc]{font-size:.8125rem;line-height:1.25rem;letter-spacing:-.00244rem}.font-chart-1[data-v-992962bc]{font-size:1.5rem;line-height:1.5rem;letter-spacing:-.015rem}.font-chart-2[data-v-992962bc]{font-size:1.25rem;line-height:1.25rem;letter-spacing:-.0125rem}.font-button[data-v-992962bc]{font-size:.875rem;line-height:1.25rem;letter-spacing:.00875rem}.font-overline[data-v-992962bc]{font-size:.75rem;line-height:1rem;letter-spacing:.045rem;text-transform:uppercase}.font-caption[data-v-992962bc]{font-size:.75rem;line-height:1rem}.font-table-label[data-v-992962bc]{font-size:.8125rem;line-height:1.25rem;letter-spacing:.00813rem}.font-input-label[data-v-992962bc]{font-size:.8125rem;line-height:1rem;letter-spacing:.00813rem}.font-tab-label1[data-v-992962bc],.font-tab-label2[data-v-992962bc]{font-size:.875rem;line-height:1rem}.font-chip-label[data-v-992962bc]{font-size:.75rem;line-height:1rem}h1[data-v-992962bc],h2[data-v-992962bc],h3[data-v-992962bc],h4[data-v-992962bc],h5[data-v-992962bc],h6[data-v-992962bc]{margin:0}.antialiased[data-v-992962bc]{-webkit-font-smoothing:antialiased}.truncate[data-v-992962bc]{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:block}.typography-tooltip[data-v-992962bc]{display:block}.typography-tooltip[data-v-992962bc] .container{display:block;width:100%}
|
|
@@ -9,6 +9,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
|
|
|
9
9
|
tickCount?: number;
|
|
10
10
|
header?: string;
|
|
11
11
|
subheader?: string;
|
|
12
|
+
subheaderTooltip?: string;
|
|
12
13
|
hideLegend?: boolean;
|
|
13
14
|
minVisible?: number;
|
|
14
15
|
maxVisible?: number;
|
|
@@ -27,6 +28,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
|
|
|
27
28
|
tickCount: number;
|
|
28
29
|
header: string;
|
|
29
30
|
subheader: string;
|
|
31
|
+
subheaderTooltip: string;
|
|
30
32
|
hideLegend: boolean;
|
|
31
33
|
minVisible: number;
|
|
32
34
|
maxVisible: number;
|
|
@@ -48,6 +50,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
|
|
|
48
50
|
tickCount?: number;
|
|
49
51
|
header?: string;
|
|
50
52
|
subheader?: string;
|
|
53
|
+
subheaderTooltip?: string;
|
|
51
54
|
hideLegend?: boolean;
|
|
52
55
|
minVisible?: number;
|
|
53
56
|
maxVisible?: number;
|
|
@@ -66,6 +69,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
|
|
|
66
69
|
tickCount: number;
|
|
67
70
|
header: string;
|
|
68
71
|
subheader: string;
|
|
72
|
+
subheaderTooltip: string;
|
|
69
73
|
hideLegend: boolean;
|
|
70
74
|
minVisible: number;
|
|
71
75
|
maxVisible: number;
|
|
@@ -89,6 +93,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
|
|
|
89
93
|
chartType: ChartType;
|
|
90
94
|
withSettingsHeader: boolean;
|
|
91
95
|
subheader: string;
|
|
96
|
+
subheaderTooltip: string;
|
|
92
97
|
dataSets: ChartDataSet[];
|
|
93
98
|
hideLegend: boolean;
|
|
94
99
|
tickCount: number;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import
|
|
2
|
-
/* empty css */import
|
|
3
|
-
// import "../../Chart.
|
|
4
|
-
const a = /* @__PURE__ */ e
|
|
1
|
+
import e from "./Chart.vue2.js";
|
|
2
|
+
/* empty css */import o from "../../_virtual/_plugin-vue_export-helper.js";
|
|
3
|
+
// import "../../Chart.vue_vue_type_style_index_0_scoped_ea1e5c3e_lang.css"; //*');
|
|
4
|
+
const a = /* @__PURE__ */ o(e, [["__scopeId", "data-v-ea1e5c3e"]]);
|
|
5
5
|
export {
|
|
6
6
|
a as default
|
|
7
7
|
};
|
|
@@ -1,16 +1,16 @@
|
|
|
1
|
-
import "../../Chart.
|
|
1
|
+
import "../../Chart.vue_vue_type_style_index_0_scoped_ea1e5c3e_lang.css"; import { defineComponent as X, ref as g, computed as i, onMounted as j, watch as C, nextTick as q, openBlock as d, createElementBlock as k, Fragment as R, createBlock as m, unref as u, isRef as V, withCtx as O, renderSlot as D, createCommentVNode as v, createElementVNode as f, createVNode as F, normalizeStyle as J } from "vue";
|
|
2
2
|
import { useVModel as Q } from "@vueuse/core";
|
|
3
|
-
import { Chart as N, ArcElement as Y, LineElement as ee, BarElement as te, PointElement as ae, LineController as oe, BarController as re, PieController as ie, ScatterController as le, CategoryScale as ne, LinearScale as se, Filler as de, Tooltip as
|
|
4
|
-
import { HoverVerticalLine as
|
|
3
|
+
import { Chart as N, ArcElement as Y, LineElement as ee, BarElement as te, PointElement as ae, LineController as oe, BarController as re, PieController as ie, ScatterController as le, CategoryScale as ne, LinearScale as se, Filler as de, Tooltip as ue } from "chart.js";
|
|
4
|
+
import { HoverVerticalLine as ce } from "./plugins/HoverVerticalLine.js";
|
|
5
5
|
import { formatValue as H, calcStepSize as fe } from "./utils/utils.js";
|
|
6
|
-
import { DEFAULT_TICK_COUNT as pe, DEFAULT_MIN_VISIBLE as
|
|
6
|
+
import { DEFAULT_TICK_COUNT as pe, DEFAULT_MIN_VISIBLE as he, DEFAULT_MAX_VISIBLE as me, COLOR_PALETTE as ve, POINT_BORDER_COLOR as be, TICK_LABEL_COLOR as P, TICK_LABEL_FONT as U, GRID_LINE_COLOR as M } from "./consts.js";
|
|
7
7
|
import { ChartType as n } from "./types.js";
|
|
8
|
-
import { useTooltipPosition as
|
|
8
|
+
import { useTooltipPosition as ye } from "./composables/useTooltipPosition.js";
|
|
9
9
|
import ge from "./ChartTooltip.vue.js";
|
|
10
10
|
import Ce from "./ChartLegend.vue.js";
|
|
11
11
|
import ke from "./ChartHeader.vue.js";
|
|
12
|
-
import { hexColorToRgba as
|
|
13
|
-
import { useChartValues as
|
|
12
|
+
import { hexColorToRgba as Te } from "../../utils/color.js";
|
|
13
|
+
import { useChartValues as Se } from "./composables/useChartValues.js";
|
|
14
14
|
import Le from "./ChartLoader.vue.js";
|
|
15
15
|
import xe from "../emptyState/v4/EmptyStateV4.vue.js";
|
|
16
16
|
import Be from "./SettingsHeader.vue.js";
|
|
@@ -29,9 +29,10 @@ const Ie = { class: "chart-container" }, we = { class: "chart-content" }, Ae = {
|
|
|
29
29
|
tickCount: { default: pe },
|
|
30
30
|
header: { default: "" },
|
|
31
31
|
subheader: { default: "" },
|
|
32
|
+
subheaderTooltip: { default: "" },
|
|
32
33
|
hideLegend: { type: Boolean, default: !1 },
|
|
33
|
-
minVisible: { default:
|
|
34
|
-
maxVisible: { default:
|
|
34
|
+
minVisible: { default: he },
|
|
35
|
+
maxVisible: { default: me },
|
|
35
36
|
loading: { type: Boolean, default: !1 },
|
|
36
37
|
noDataIcon: { default: "file-x" },
|
|
37
38
|
noDataTitle: { default: "No data to display" },
|
|
@@ -39,7 +40,7 @@ const Ie = { class: "chart-container" }, we = { class: "chart-content" }, Ae = {
|
|
|
39
40
|
withSettingsHeader: { type: Boolean, default: !0 }
|
|
40
41
|
},
|
|
41
42
|
emits: ["update:chartType", "update:visibleIds"],
|
|
42
|
-
setup(a, { emit:
|
|
43
|
+
setup(a, { emit: T }) {
|
|
43
44
|
const t = a;
|
|
44
45
|
N.register(
|
|
45
46
|
Y,
|
|
@@ -53,31 +54,31 @@ const Ie = { class: "chart-container" }, we = { class: "chart-content" }, Ae = {
|
|
|
53
54
|
ne,
|
|
54
55
|
se,
|
|
55
56
|
de,
|
|
56
|
-
|
|
57
|
-
|
|
57
|
+
ue,
|
|
58
|
+
ce
|
|
58
59
|
);
|
|
59
|
-
const
|
|
60
|
+
const c = Q(t, "chartType", T), p = g(null);
|
|
60
61
|
let s = null;
|
|
61
|
-
const
|
|
62
|
+
const S = i(() => t.dataSets.length === 0), L = i(() => !t.loading && !S.value), b = () => {
|
|
62
63
|
p.value && (s && s.destroy(), s = new N(p.value, B.value));
|
|
63
64
|
}, z = () => {
|
|
64
|
-
s && (s.data.datasets =
|
|
65
|
+
s && (s.data.datasets = y.value, s.options = B.value.options, s.update());
|
|
65
66
|
};
|
|
66
|
-
j(
|
|
67
|
-
e && (await q(),
|
|
67
|
+
j(b), C(() => t.chartType, b), C(L, async (e) => {
|
|
68
|
+
e && (await q(), b());
|
|
68
69
|
}), C([() => t.visibleIds, () => t.dataSets], z);
|
|
69
|
-
const
|
|
70
|
+
const h = i(
|
|
70
71
|
() => t.chartType === n.StackedLine || t.chartType === n.StackedBar
|
|
71
|
-
),
|
|
72
|
+
), $ = i(
|
|
72
73
|
() => t.chartType === n.Line || t.chartType === n.StackedLine
|
|
73
74
|
), x = i(
|
|
74
75
|
() => t.dataSets.filter((e) => t.visibleIds.includes(e.id))
|
|
75
|
-
),
|
|
76
|
+
), y = i(() => x.value.map((e, o) => {
|
|
76
77
|
const r = e.color || ve[o] || "#000000";
|
|
77
78
|
return {
|
|
78
79
|
...e,
|
|
79
|
-
fill:
|
|
80
|
-
backgroundColor:
|
|
80
|
+
fill: h.value ? "start" : void 0,
|
|
81
|
+
backgroundColor: Te(
|
|
81
82
|
r,
|
|
82
83
|
t.chartType === n.StackedLine ? 10 : 70
|
|
83
84
|
),
|
|
@@ -93,7 +94,7 @@ const Ie = { class: "chart-container" }, we = { class: "chart-content" }, Ae = {
|
|
|
93
94
|
type: t.chartType == n.Bar || t.chartType === n.StackedBar ? "bar" : "line",
|
|
94
95
|
// Chart Data
|
|
95
96
|
data: {
|
|
96
|
-
datasets:
|
|
97
|
+
datasets: y.value
|
|
97
98
|
},
|
|
98
99
|
// Chart Options
|
|
99
100
|
options: {
|
|
@@ -107,7 +108,7 @@ const Ie = { class: "chart-container" }, we = { class: "chart-content" }, Ae = {
|
|
|
107
108
|
plugins: {
|
|
108
109
|
legend: { display: !1 },
|
|
109
110
|
title: { display: !1 },
|
|
110
|
-
hoverVerticalLine:
|
|
111
|
+
hoverVerticalLine: $.value,
|
|
111
112
|
// tooltip
|
|
112
113
|
tooltip: {
|
|
113
114
|
enabled: !1,
|
|
@@ -145,7 +146,7 @@ const Ie = { class: "chart-container" }, we = { class: "chart-content" }, Ae = {
|
|
|
145
146
|
borderWidth: 0,
|
|
146
147
|
hoverRadius: 4,
|
|
147
148
|
hoverBorderWidth: 2,
|
|
148
|
-
pointHoverBackgroundColor:
|
|
149
|
+
pointHoverBackgroundColor: be
|
|
149
150
|
},
|
|
150
151
|
bar: {
|
|
151
152
|
borderRadius: 4
|
|
@@ -156,7 +157,7 @@ const Ie = { class: "chart-container" }, we = { class: "chart-content" }, Ae = {
|
|
|
156
157
|
x: {
|
|
157
158
|
beginAtZero: !0,
|
|
158
159
|
border: { display: !1 },
|
|
159
|
-
stacked:
|
|
160
|
+
stacked: h.value,
|
|
160
161
|
// stack on top of each other
|
|
161
162
|
// ticks
|
|
162
163
|
ticks: {
|
|
@@ -184,7 +185,7 @@ const Ie = { class: "chart-container" }, we = { class: "chart-content" }, Ae = {
|
|
|
184
185
|
beginAtZero: !0,
|
|
185
186
|
border: { display: !1 },
|
|
186
187
|
// hide left borderline
|
|
187
|
-
stacked:
|
|
188
|
+
stacked: h.value,
|
|
188
189
|
// stack on top of each other
|
|
189
190
|
// ticks
|
|
190
191
|
ticks: {
|
|
@@ -206,32 +207,32 @@ const Ie = { class: "chart-container" }, we = { class: "chart-content" }, Ae = {
|
|
|
206
207
|
}
|
|
207
208
|
}
|
|
208
209
|
})
|
|
209
|
-
),
|
|
210
|
-
() =>
|
|
211
|
-
),
|
|
210
|
+
), K = i(
|
|
211
|
+
() => y.value.reduce((e, o) => (e[o.id] = o.borderColor, e), {})
|
|
212
|
+
), W = i(() => t.dataSets.map((e) => ({
|
|
212
213
|
id: e.id,
|
|
213
214
|
label: e.label,
|
|
214
|
-
color:
|
|
215
|
-
}))), I = g(null), l = g(null), { position: w } =
|
|
215
|
+
color: K.value[e.id] || null
|
|
216
|
+
}))), I = g(null), l = g(null), { position: w } = ye(
|
|
216
217
|
p,
|
|
217
218
|
I,
|
|
218
219
|
l
|
|
219
|
-
),
|
|
220
|
+
), Z = i(() => ({
|
|
220
221
|
left: `${w.value.left}px`,
|
|
221
222
|
top: `${w.value.top}px`,
|
|
222
223
|
opacity: l.value?.opacity || 0
|
|
223
|
-
})), { minValue: A, maxValue:
|
|
224
|
+
})), { minValue: A, maxValue: _ } = Se({
|
|
224
225
|
parsingConfig: t.parsing,
|
|
225
226
|
dataSets: x,
|
|
226
|
-
isStacked:
|
|
227
|
+
isStacked: h
|
|
227
228
|
}), E = i(
|
|
228
|
-
() => fe(A.value,
|
|
229
|
+
() => fe(A.value, _.value, t.tickCount)
|
|
229
230
|
);
|
|
230
231
|
return (e, o) => (d(), k(R, null, [
|
|
231
|
-
a.withSettingsHeader ? (d(),
|
|
232
|
+
a.withSettingsHeader ? (d(), m(Be, {
|
|
232
233
|
key: 0,
|
|
233
|
-
"chart-type": c
|
|
234
|
-
"onUpdate:chart-type": o[0] || (o[0] = (r) => V(
|
|
234
|
+
"chart-type": u(c),
|
|
235
|
+
"onUpdate:chart-type": o[0] || (o[0] = (r) => V(c) ? c.value = r : null),
|
|
235
236
|
"hide-legend": a.hideLegend
|
|
236
237
|
}, {
|
|
237
238
|
metric: O(() => [
|
|
@@ -243,16 +244,17 @@ const Ie = { class: "chart-container" }, we = { class: "chart-content" }, Ae = {
|
|
|
243
244
|
_: 3
|
|
244
245
|
}, 8, ["chart-type", "hide-legend"])) : v("", !0),
|
|
245
246
|
f("div", Ie, [
|
|
246
|
-
|
|
247
|
+
u(L) ? (d(), k(R, { key: 0 }, [
|
|
247
248
|
f("section", we, [
|
|
248
249
|
f("div", Ae, [
|
|
249
250
|
F(ke, {
|
|
250
|
-
"chart-type": c
|
|
251
|
-
"onUpdate:chart-type": o[1] || (o[1] = (r) => V(
|
|
251
|
+
"chart-type": u(c),
|
|
252
|
+
"onUpdate:chart-type": o[1] || (o[1] = (r) => V(c) ? c.value = r : null),
|
|
252
253
|
"with-settings-header": a.withSettingsHeader,
|
|
253
254
|
header: a.header,
|
|
254
|
-
subheader: a.subheader
|
|
255
|
-
|
|
255
|
+
subheader: a.subheader,
|
|
256
|
+
"subheader-tooltip": a.subheaderTooltip
|
|
257
|
+
}, null, 8, ["chart-type", "with-settings-header", "header", "subheader", "subheader-tooltip"])
|
|
256
258
|
]),
|
|
257
259
|
f("div", Ee, [
|
|
258
260
|
f("canvas", {
|
|
@@ -264,9 +266,9 @@ const Ie = { class: "chart-container" }, we = { class: "chart-content" }, Ae = {
|
|
|
264
266
|
ref_key: "tooltipRef",
|
|
265
267
|
ref: I,
|
|
266
268
|
class: "chart__tooltip",
|
|
267
|
-
style: J(
|
|
269
|
+
style: J(u(Z))
|
|
268
270
|
}, [
|
|
269
|
-
l.value ? (d(),
|
|
271
|
+
l.value ? (d(), m(ge, {
|
|
270
272
|
key: 0,
|
|
271
273
|
title: String(l.value.title),
|
|
272
274
|
"data-points": l.value.dataPoints,
|
|
@@ -280,12 +282,12 @@ const Ie = { class: "chart-container" }, we = { class: "chart-content" }, Ae = {
|
|
|
280
282
|
]),
|
|
281
283
|
a.hideLegend ? v("", !0) : (d(), k("section", Re, [
|
|
282
284
|
F(Ce, {
|
|
283
|
-
items:
|
|
285
|
+
items: u(W),
|
|
284
286
|
"visible-ids": a.visibleIds,
|
|
285
|
-
"onUpdate:visibleIds": o[2] || (o[2] = (r) =>
|
|
287
|
+
"onUpdate:visibleIds": o[2] || (o[2] = (r) => T("update:visibleIds", r))
|
|
286
288
|
}, null, 8, ["items", "visible-ids"])
|
|
287
289
|
]))
|
|
288
|
-
], 64)) : a.loading ? (d(),
|
|
290
|
+
], 64)) : a.loading ? (d(), m(Le, { key: 1 })) : u(S) ? (d(), m(u(xe), {
|
|
289
291
|
key: 2,
|
|
290
292
|
title: a.noDataTitle,
|
|
291
293
|
subtitle: a.noDataSubtitle,
|
|
@@ -4,11 +4,13 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
|
|
|
4
4
|
withSettingsHeader: boolean;
|
|
5
5
|
header?: string;
|
|
6
6
|
subheader?: string;
|
|
7
|
+
subheaderTooltip?: string;
|
|
7
8
|
}>, {
|
|
8
9
|
chartType: ChartType;
|
|
9
10
|
withSettingsHeader: boolean;
|
|
10
11
|
header: string;
|
|
11
12
|
subheader: string;
|
|
13
|
+
subheaderTooltip: string;
|
|
12
14
|
}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
13
15
|
"update:chartType": (type: ChartType) => void;
|
|
14
16
|
}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
|
|
@@ -16,11 +18,13 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
|
|
|
16
18
|
withSettingsHeader: boolean;
|
|
17
19
|
header?: string;
|
|
18
20
|
subheader?: string;
|
|
21
|
+
subheaderTooltip?: string;
|
|
19
22
|
}>, {
|
|
20
23
|
chartType: ChartType;
|
|
21
24
|
withSettingsHeader: boolean;
|
|
22
25
|
header: string;
|
|
23
26
|
subheader: string;
|
|
27
|
+
subheaderTooltip: string;
|
|
24
28
|
}>>> & {
|
|
25
29
|
"onUpdate:chartType"?: (type: ChartType) => any;
|
|
26
30
|
}, {
|
|
@@ -28,6 +32,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
|
|
|
28
32
|
chartType: ChartType;
|
|
29
33
|
withSettingsHeader: boolean;
|
|
30
34
|
subheader: string;
|
|
35
|
+
subheaderTooltip: string;
|
|
31
36
|
}>;
|
|
32
37
|
export default _default;
|
|
33
38
|
type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import e from "./ChartHeader.vue2.js";
|
|
2
2
|
/* empty css */import o from "../../_virtual/_plugin-vue_export-helper.js";
|
|
3
|
-
// import "../../ChartHeader.
|
|
4
|
-
const s = /* @__PURE__ */ o(e, [["__scopeId", "data-v-
|
|
3
|
+
// import "../../ChartHeader.vue_vue_type_style_index_0_scoped_4c37736e_lang.css"; //*');
|
|
4
|
+
const s = /* @__PURE__ */ o(e, [["__scopeId", "data-v-4c37736e"]]);
|
|
5
5
|
export {
|
|
6
6
|
s as default
|
|
7
7
|
};
|
|
@@ -1,53 +1,66 @@
|
|
|
1
|
-
import "../../ChartHeader.
|
|
2
|
-
import
|
|
3
|
-
import
|
|
1
|
+
import "../../ChartHeader.vue_vue_type_style_index_0_scoped_4c37736e_lang.css"; import { defineComponent as y, computed as T, openBlock as c, createElementBlock as x, createElementVNode as V, createVNode as d, unref as t, withCtx as i, createTextVNode as u, toDisplayString as s, createBlock as b, isRef as g, createCommentVNode as k } from "vue";
|
|
2
|
+
import h from "../typography/v4/Typography.vue.js";
|
|
3
|
+
import v from "../switch/v4/SwitchV4.vue.js";
|
|
4
4
|
import { ChartType as r } from "./types.js";
|
|
5
|
-
|
|
5
|
+
import B from "../tooltip/v4/TooltipV4.vue.js";
|
|
6
|
+
const C = { class: "chart-header" }, S = { class: "header-texts" }, E = /* @__PURE__ */ y({
|
|
6
7
|
__name: "ChartHeader",
|
|
7
8
|
props: {
|
|
8
9
|
chartType: { default: r.Line },
|
|
9
10
|
withSettingsHeader: { type: Boolean, default: !0 },
|
|
10
11
|
header: { default: "" },
|
|
11
|
-
subheader: { default: "" }
|
|
12
|
+
subheader: { default: "" },
|
|
13
|
+
subheaderTooltip: { default: "" }
|
|
12
14
|
},
|
|
13
15
|
emits: ["update:chartType"],
|
|
14
|
-
setup(e, { emit:
|
|
16
|
+
setup(e, { emit: p }) {
|
|
15
17
|
const m = e, n = [
|
|
16
18
|
{ id: r.Line, icon: "chart-line-up" },
|
|
17
19
|
{ id: r.Bar, icon: "chart-bar" },
|
|
18
20
|
{ id: r.StackedLine, icon: "chart-line" }
|
|
19
21
|
], o = T({
|
|
20
22
|
get() {
|
|
21
|
-
return n.find(({ id:
|
|
23
|
+
return n.find(({ id: a }) => a === m.chartType);
|
|
22
24
|
},
|
|
23
|
-
set(
|
|
24
|
-
|
|
25
|
+
set(a) {
|
|
26
|
+
p("update:chartType", a.id);
|
|
25
27
|
}
|
|
26
28
|
});
|
|
27
|
-
return (
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
29
|
+
return (a, l) => (c(), x("div", C, [
|
|
30
|
+
V("div", S, [
|
|
31
|
+
d(t(B), {
|
|
32
|
+
text: e.subheaderTooltip,
|
|
33
|
+
placement: "right"
|
|
34
|
+
}, {
|
|
35
|
+
default: i(() => [
|
|
36
|
+
d(t(h), {
|
|
37
|
+
class: "subheader",
|
|
38
|
+
variant: "h5"
|
|
39
|
+
}, {
|
|
40
|
+
default: i(() => [
|
|
41
|
+
u(s(e.subheader), 1)
|
|
42
|
+
]),
|
|
43
|
+
_: 1
|
|
44
|
+
})
|
|
32
45
|
]),
|
|
33
46
|
_: 1
|
|
34
|
-
}),
|
|
35
|
-
|
|
36
|
-
default:
|
|
37
|
-
s(
|
|
47
|
+
}, 8, ["text"]),
|
|
48
|
+
d(t(h), { variant: "chart2" }, {
|
|
49
|
+
default: i(() => [
|
|
50
|
+
u(s(e.header), 1)
|
|
38
51
|
]),
|
|
39
52
|
_: 1
|
|
40
53
|
})
|
|
41
54
|
]),
|
|
42
|
-
e.withSettingsHeader ?
|
|
55
|
+
e.withSettingsHeader ? k("", !0) : (c(), b(t(v), {
|
|
43
56
|
key: 0,
|
|
44
|
-
modelValue:
|
|
45
|
-
"onUpdate:modelValue":
|
|
57
|
+
modelValue: t(o),
|
|
58
|
+
"onUpdate:modelValue": l[0] || (l[0] = (f) => g(o) ? o.value = f : null),
|
|
46
59
|
options: n
|
|
47
60
|
}, null, 8, ["modelValue"]))
|
|
48
61
|
]));
|
|
49
62
|
}
|
|
50
63
|
});
|
|
51
64
|
export {
|
|
52
|
-
|
|
65
|
+
E as default
|
|
53
66
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import e from "./ChartLegend.vue2.js";
|
|
2
2
|
/* empty css */import o from "../../_virtual/_plugin-vue_export-helper.js";
|
|
3
|
-
// import "../../ChartLegend.
|
|
4
|
-
const
|
|
3
|
+
// import "../../ChartLegend.vue_vue_type_style_index_0_scoped_c0f71a49_lang.css"; //*');
|
|
4
|
+
const a = /* @__PURE__ */ o(e, [["__scopeId", "data-v-c0f71a49"]]);
|
|
5
5
|
export {
|
|
6
|
-
|
|
6
|
+
a as default
|
|
7
7
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import "../../ChartLegend.
|
|
1
|
+
import "../../ChartLegend.vue_vue_type_style_index_0_scoped_c0f71a49_lang.css"; import { defineComponent as E, ref as T, computed as r, openBlock as d, createElementBlock as n, createElementVNode as c, createVNode as u, unref as i, mergeProps as p, Fragment as y, renderList as w, withCtx as S, createTextVNode as U, toDisplayString as B } from "vue";
|
|
2
2
|
import { useVirtualList as D } from "@vueuse/core";
|
|
3
3
|
import N from "../typography/v4/Typography.vue.js";
|
|
4
4
|
import A from "../checkbox/v4/CheckboxV4.vue.js";
|
|
@@ -13,47 +13,54 @@ const P = { class: "chart-legend" }, R = { class: "search-box" }, K = /* @__PURE
|
|
|
13
13
|
maxVisible: { default: M }
|
|
14
14
|
},
|
|
15
15
|
emits: ["update:visibleIds"],
|
|
16
|
-
setup(
|
|
17
|
-
const
|
|
18
|
-
const
|
|
19
|
-
return
|
|
20
|
-
(
|
|
16
|
+
setup(m, { emit: b }) {
|
|
17
|
+
const s = m, h = 32, o = T(""), f = r(() => {
|
|
18
|
+
const t = o.value.toLowerCase();
|
|
19
|
+
return s.items.filter(
|
|
20
|
+
(l) => l.label.toLowerCase().includes(t)
|
|
21
21
|
);
|
|
22
|
-
}),
|
|
23
|
-
() =>
|
|
24
|
-
), I =
|
|
25
|
-
() =>
|
|
26
|
-
), _ = (
|
|
22
|
+
}), a = (t) => s.visibleIds.includes(t.id), v = r(
|
|
23
|
+
() => s.visibleIds.length >= s.maxVisible
|
|
24
|
+
), I = r(
|
|
25
|
+
() => s.visibleIds.length <= s.minVisible
|
|
26
|
+
), _ = (t) => I.value && a(t) || v.value && !a(t), V = (t, l) => {
|
|
27
27
|
b(
|
|
28
28
|
"update:visibleIds",
|
|
29
|
-
|
|
29
|
+
t ? [...s.visibleIds, l.id] : s.visibleIds.filter((e) => e !== l.id)
|
|
30
30
|
);
|
|
31
|
-
}, { list:
|
|
31
|
+
}, { list: g, containerProps: L, wrapperProps: x } = D(f, {
|
|
32
32
|
itemHeight: h,
|
|
33
33
|
overscan: 10
|
|
34
34
|
});
|
|
35
|
-
return (
|
|
35
|
+
return (t, l) => (d(), n("div", P, [
|
|
36
36
|
c("div", R, [
|
|
37
|
-
u(
|
|
37
|
+
u(i(F), {
|
|
38
38
|
modelValue: o.value,
|
|
39
|
-
"onUpdate:modelValue":
|
|
39
|
+
"onUpdate:modelValue": l[0] || (l[0] = (e) => o.value = e)
|
|
40
40
|
}, null, 8, ["modelValue"])
|
|
41
41
|
]),
|
|
42
|
-
c("div",
|
|
43
|
-
c("ul",
|
|
44
|
-
(d(!0), n(y, null,
|
|
45
|
-
u(
|
|
46
|
-
color:
|
|
47
|
-
"is-checked":
|
|
48
|
-
disabled: _(
|
|
49
|
-
"onUpdate:isChecked": (
|
|
42
|
+
c("div", p({ class: "legend" }, i(L)), [
|
|
43
|
+
c("ul", p({ class: "legend__list" }, i(x)), [
|
|
44
|
+
(d(!0), n(y, null, w(i(g), ({ data: e, index: k }) => (d(), n("li", { key: k }, [
|
|
45
|
+
u(i(A), {
|
|
46
|
+
color: e.color,
|
|
47
|
+
"is-checked": a(e),
|
|
48
|
+
disabled: _(e),
|
|
49
|
+
"onUpdate:isChecked": (C) => V(C, e)
|
|
50
50
|
}, null, 8, ["color", "is-checked", "disabled", "onUpdate:isChecked"]),
|
|
51
|
-
u(
|
|
52
|
-
|
|
53
|
-
|
|
51
|
+
u(i(N), {
|
|
52
|
+
variant: "body2",
|
|
53
|
+
"is-truncated": "",
|
|
54
|
+
class: "legend-label",
|
|
55
|
+
"with-tooltip": "",
|
|
56
|
+
"tooltip-text": e.label,
|
|
57
|
+
"tooltip-placement": "top"
|
|
58
|
+
}, {
|
|
59
|
+
default: S(() => [
|
|
60
|
+
U(B(e.label), 1)
|
|
54
61
|
]),
|
|
55
62
|
_: 2
|
|
56
|
-
},
|
|
63
|
+
}, 1032, ["tooltip-text"])
|
|
57
64
|
]))), 128))
|
|
58
65
|
], 16)
|
|
59
66
|
], 16)
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import e from "./SettingsHeader.vue2.js";
|
|
2
2
|
/* empty css */import o from "../../_virtual/_plugin-vue_export-helper.js";
|
|
3
|
-
// import "../../SettingsHeader.
|
|
4
|
-
const
|
|
3
|
+
// import "../../SettingsHeader.vue_vue_type_style_index_0_scoped_9b6cd9d9_lang.css"; //*');
|
|
4
|
+
const d = /* @__PURE__ */ o(e, [["__scopeId", "data-v-9b6cd9d9"]]);
|
|
5
5
|
export {
|
|
6
|
-
|
|
6
|
+
d as default
|
|
7
7
|
};
|