@carbon/charts-svelte 1.22.0 → 1.22.3
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/CHANGELOG.md +35 -0
- package/README.md +3 -2
- package/dist/AlluvialChart.svelte +12 -8
- package/dist/AlluvialChart.svelte.d.ts +29 -27
- package/dist/AreaChart.svelte +12 -8
- package/dist/AreaChart.svelte.d.ts +29 -27
- package/dist/BarChartGrouped.svelte +12 -8
- package/dist/BarChartGrouped.svelte.d.ts +29 -27
- package/dist/BarChartSimple.svelte +12 -8
- package/dist/BarChartSimple.svelte.d.ts +29 -27
- package/dist/BarChartStacked.svelte +11 -8
- package/dist/BarChartStacked.svelte.d.ts +29 -27
- package/dist/BaseChart.svelte +54 -37
- package/dist/BaseChart.svelte.d.ts +14 -7
- package/dist/BoxplotChart.svelte +12 -8
- package/dist/BoxplotChart.svelte.d.ts +29 -27
- package/dist/BubbleChart.svelte +12 -8
- package/dist/BubbleChart.svelte.d.ts +29 -27
- package/dist/BulletChart.svelte +12 -8
- package/dist/BulletChart.svelte.d.ts +29 -27
- package/dist/ChoroplethChart.svelte +12 -8
- package/dist/ChoroplethChart.svelte.d.ts +29 -27
- package/dist/CirclePackChart.svelte +12 -8
- package/dist/CirclePackChart.svelte.d.ts +29 -27
- package/dist/ComboChart.svelte +12 -8
- package/dist/ComboChart.svelte.d.ts +29 -27
- package/dist/DonutChart.svelte +12 -8
- package/dist/DonutChart.svelte.d.ts +29 -27
- package/dist/GaugeChart.svelte +12 -8
- package/dist/GaugeChart.svelte.d.ts +29 -27
- package/dist/HeatmapChart.svelte +12 -8
- package/dist/HeatmapChart.svelte.d.ts +29 -27
- package/dist/HistogramChart.svelte +12 -8
- package/dist/HistogramChart.svelte.d.ts +29 -27
- package/dist/LineChart.svelte +12 -8
- package/dist/LineChart.svelte.d.ts +29 -27
- package/dist/LollipopChart.svelte +12 -8
- package/dist/LollipopChart.svelte.d.ts +29 -27
- package/dist/MeterChart.svelte +12 -8
- package/dist/MeterChart.svelte.d.ts +29 -27
- package/dist/PieChart.svelte +12 -8
- package/dist/PieChart.svelte.d.ts +29 -27
- package/dist/RadarChart.svelte +12 -8
- package/dist/RadarChart.svelte.d.ts +29 -27
- package/dist/ScatterChart.svelte +12 -8
- package/dist/ScatterChart.svelte.d.ts +29 -27
- package/dist/StackedAreaChart.svelte +12 -8
- package/dist/StackedAreaChart.svelte.d.ts +29 -27
- package/dist/TreeChart.svelte +12 -8
- package/dist/TreeChart.svelte.d.ts +29 -27
- package/dist/TreemapChart.svelte +12 -8
- package/dist/TreemapChart.svelte.d.ts +29 -27
- package/dist/WordCloudChart.svelte +13 -8
- package/dist/WordCloudChart.svelte.d.ts +29 -27
- package/dist/styles.css +294 -288
- package/dist/styles.css.map +1 -1
- package/dist/styles.min.css +1 -1
- package/dist/styles.min.css.map +1 -1
- package/package.json +17 -17
- package/telemetry.yml +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,41 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file. See
|
|
4
4
|
[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## 1.22.3 (2024-11-18)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @carbon/charts-svelte
|
|
9
|
+
|
|
10
|
+
# Change Log
|
|
11
|
+
|
|
12
|
+
All notable changes to this project will be documented in this file. See
|
|
13
|
+
[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
14
|
+
|
|
15
|
+
## 1.22.2 (2024-11-07)
|
|
16
|
+
|
|
17
|
+
### Bug Fixes
|
|
18
|
+
|
|
19
|
+
- **yarn:** bundle because CI lacks corepack
|
|
20
|
+
([#1911](https://github.com/carbon-design-system/carbon-charts/issues/1911))
|
|
21
|
+
([513e779](https://github.com/carbon-design-system/carbon-charts/commit/513e7798007f807d1463a25efe7d140d5b038b8e))
|
|
22
|
+
|
|
23
|
+
# Change Log
|
|
24
|
+
|
|
25
|
+
All notable changes to this project will be documented in this file. See
|
|
26
|
+
[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
27
|
+
|
|
28
|
+
## 1.22.1 (2024-09-27)
|
|
29
|
+
|
|
30
|
+
### Bug Fixes
|
|
31
|
+
|
|
32
|
+
- **docs:** switch fonts to s81c cdn
|
|
33
|
+
([#1898](https://github.com/carbon-design-system/carbon-charts/issues/1898))
|
|
34
|
+
([cdfc980](https://github.com/carbon-design-system/carbon-charts/commit/cdfc980596365c90f08e35e91e49cbc2f491fd09))
|
|
35
|
+
|
|
36
|
+
# Change Log
|
|
37
|
+
|
|
38
|
+
All notable changes to this project will be documented in this file. See
|
|
39
|
+
[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
40
|
+
|
|
6
41
|
# 1.22.0 (2024-09-16)
|
|
7
42
|
|
|
8
43
|
### Features
|
package/README.md
CHANGED
|
@@ -262,8 +262,9 @@ let chart: ChartProps['chart'] = null
|
|
|
262
262
|
|
|
263
263
|
## <picture><source height="20" width="20" media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/ibm-telemetry/telemetry-js/main/docs/images/ibm-telemetry-dark.svg"><source height="20" width="20" media="(prefers-color-scheme: light)" srcset="https://raw.githubusercontent.com/ibm-telemetry/telemetry-js/main/docs/images/ibm-telemetry-light.svg"><img height="20" width="20" alt="IBM Telemetry" src="https://raw.githubusercontent.com/ibm-telemetry/telemetry-js/main/docs/images/ibm-telemetry-light.svg"></picture> IBM Telemetry
|
|
264
264
|
|
|
265
|
-
This package uses IBM Telemetry to collect
|
|
266
|
-
you are agreeing to telemetry
|
|
265
|
+
This package uses IBM Telemetry to collect de-identified and anonymized metrics
|
|
266
|
+
data. By installing this package as a dependency you are agreeing to telemetry
|
|
267
|
+
collection. To opt out, see
|
|
267
268
|
[Opting out of IBM Telemetry data collection](https://github.com/ibm-telemetry/telemetry-js/tree/main#opting-out-of-ibm-telemetry-data-collection).
|
|
268
269
|
For more information on the data being collected, please see the
|
|
269
270
|
[IBM Telemetry documentation](https://github.com/ibm-telemetry/telemetry-js/tree/main#ibm-telemetry-collection-basics).
|
|
@@ -1,11 +1,15 @@
|
|
|
1
|
-
<script>
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import {
|
|
3
|
+
AlluvialChart as AlluvialChartCore,
|
|
4
|
+
type AlluvialChartOptions,
|
|
5
|
+
type ChartTabularData
|
|
6
|
+
} from '@carbon/charts'
|
|
7
|
+
import BaseChart from './BaseChart.svelte'
|
|
8
|
+
|
|
9
|
+
export let options: AlluvialChartOptions
|
|
10
|
+
export let data: ChartTabularData
|
|
11
|
+
export let chart: AlluvialChartCore | undefined = undefined
|
|
12
|
+
export let ref: HTMLDivElement | undefined = undefined
|
|
9
13
|
</script>
|
|
10
14
|
|
|
11
15
|
<BaseChart
|
|
@@ -1,30 +1,32 @@
|
|
|
1
|
-
import { SvelteComponent } from "svelte";
|
|
2
1
|
import { AlluvialChart as AlluvialChartCore, type AlluvialChartOptions, type ChartTabularData } from '@carbon/charts';
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
update: CustomEvent<{
|
|
14
|
-
data: ChartTabularData;
|
|
15
|
-
options: import("@carbon/charts").BaseChartOptions;
|
|
16
|
-
}>;
|
|
17
|
-
destroy: CustomEvent<null>;
|
|
18
|
-
} & {
|
|
19
|
-
[evt: string]: CustomEvent<any>;
|
|
2
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
|
3
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
|
4
|
+
$$bindings?: Bindings;
|
|
5
|
+
} & Exports;
|
|
6
|
+
(internal: unknown, props: Props & {
|
|
7
|
+
$$events?: Events;
|
|
8
|
+
$$slots?: Slots;
|
|
9
|
+
}): Exports & {
|
|
10
|
+
$set?: any;
|
|
11
|
+
$on?: any;
|
|
20
12
|
};
|
|
21
|
-
|
|
22
|
-
exports?: undefined;
|
|
23
|
-
bindings?: undefined;
|
|
24
|
-
};
|
|
25
|
-
export type AlluvialChartProps = typeof __propDef.props;
|
|
26
|
-
export type AlluvialChartEvents = typeof __propDef.events;
|
|
27
|
-
export type AlluvialChartSlots = typeof __propDef.slots;
|
|
28
|
-
export default class AlluvialChart extends SvelteComponent<AlluvialChartProps, AlluvialChartEvents, AlluvialChartSlots> {
|
|
13
|
+
z_$$bindings?: Bindings;
|
|
29
14
|
}
|
|
30
|
-
|
|
15
|
+
declare const AlluvialChart: $$__sveltets_2_IsomorphicComponent<{
|
|
16
|
+
[x: string]: any;
|
|
17
|
+
options: AlluvialChartOptions;
|
|
18
|
+
data: ChartTabularData;
|
|
19
|
+
chart?: AlluvialChartCore | undefined;
|
|
20
|
+
ref?: HTMLDivElement | undefined;
|
|
21
|
+
}, {
|
|
22
|
+
load: CustomEvent<null>;
|
|
23
|
+
update: CustomEvent<{
|
|
24
|
+
data: ChartTabularData;
|
|
25
|
+
options: import("@carbon/charts").BaseChartOptions;
|
|
26
|
+
}>;
|
|
27
|
+
destroy: CustomEvent<null>;
|
|
28
|
+
} & {
|
|
29
|
+
[evt: string]: CustomEvent<any>;
|
|
30
|
+
}, {}, {}, string>;
|
|
31
|
+
type AlluvialChart = InstanceType<typeof AlluvialChart>;
|
|
32
|
+
export default AlluvialChart;
|
package/dist/AreaChart.svelte
CHANGED
|
@@ -1,11 +1,15 @@
|
|
|
1
|
-
<script>
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import {
|
|
3
|
+
AreaChart as AreaChartCore,
|
|
4
|
+
type AreaChartOptions,
|
|
5
|
+
type ChartTabularData
|
|
6
|
+
} from '@carbon/charts'
|
|
7
|
+
import BaseChart from './BaseChart.svelte'
|
|
8
|
+
|
|
9
|
+
export let options: AreaChartOptions
|
|
10
|
+
export let data: ChartTabularData
|
|
11
|
+
export let chart: AreaChartCore | undefined = undefined
|
|
12
|
+
export let ref: HTMLDivElement | undefined = undefined
|
|
9
13
|
</script>
|
|
10
14
|
|
|
11
15
|
<BaseChart
|
|
@@ -1,30 +1,32 @@
|
|
|
1
|
-
import { SvelteComponent } from "svelte";
|
|
2
1
|
import { AreaChart as AreaChartCore, type AreaChartOptions, type ChartTabularData } from '@carbon/charts';
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
update: CustomEvent<{
|
|
14
|
-
data: ChartTabularData;
|
|
15
|
-
options: import("@carbon/charts").BaseChartOptions;
|
|
16
|
-
}>;
|
|
17
|
-
destroy: CustomEvent<null>;
|
|
18
|
-
} & {
|
|
19
|
-
[evt: string]: CustomEvent<any>;
|
|
2
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
|
3
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
|
4
|
+
$$bindings?: Bindings;
|
|
5
|
+
} & Exports;
|
|
6
|
+
(internal: unknown, props: Props & {
|
|
7
|
+
$$events?: Events;
|
|
8
|
+
$$slots?: Slots;
|
|
9
|
+
}): Exports & {
|
|
10
|
+
$set?: any;
|
|
11
|
+
$on?: any;
|
|
20
12
|
};
|
|
21
|
-
|
|
22
|
-
exports?: undefined;
|
|
23
|
-
bindings?: undefined;
|
|
24
|
-
};
|
|
25
|
-
export type AreaChartProps = typeof __propDef.props;
|
|
26
|
-
export type AreaChartEvents = typeof __propDef.events;
|
|
27
|
-
export type AreaChartSlots = typeof __propDef.slots;
|
|
28
|
-
export default class AreaChart extends SvelteComponent<AreaChartProps, AreaChartEvents, AreaChartSlots> {
|
|
13
|
+
z_$$bindings?: Bindings;
|
|
29
14
|
}
|
|
30
|
-
|
|
15
|
+
declare const AreaChart: $$__sveltets_2_IsomorphicComponent<{
|
|
16
|
+
[x: string]: any;
|
|
17
|
+
options: AreaChartOptions;
|
|
18
|
+
data: ChartTabularData;
|
|
19
|
+
chart?: AreaChartCore | undefined;
|
|
20
|
+
ref?: HTMLDivElement | undefined;
|
|
21
|
+
}, {
|
|
22
|
+
load: CustomEvent<null>;
|
|
23
|
+
update: CustomEvent<{
|
|
24
|
+
data: ChartTabularData;
|
|
25
|
+
options: import("@carbon/charts").BaseChartOptions;
|
|
26
|
+
}>;
|
|
27
|
+
destroy: CustomEvent<null>;
|
|
28
|
+
} & {
|
|
29
|
+
[evt: string]: CustomEvent<any>;
|
|
30
|
+
}, {}, {}, string>;
|
|
31
|
+
type AreaChart = InstanceType<typeof AreaChart>;
|
|
32
|
+
export default AreaChart;
|
|
@@ -1,11 +1,15 @@
|
|
|
1
|
-
<script>
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import {
|
|
3
|
+
GroupedBarChart as GroupedBarChartCore,
|
|
4
|
+
type BarChartOptions,
|
|
5
|
+
type ChartTabularData
|
|
6
|
+
} from '@carbon/charts'
|
|
7
|
+
import BaseChart from './BaseChart.svelte'
|
|
8
|
+
|
|
9
|
+
export let options: BarChartOptions
|
|
10
|
+
export let data: ChartTabularData
|
|
11
|
+
export let chart: GroupedBarChartCore | undefined = undefined
|
|
12
|
+
export let ref: HTMLDivElement | undefined = undefined
|
|
9
13
|
</script>
|
|
10
14
|
|
|
11
15
|
<BaseChart
|
|
@@ -1,30 +1,32 @@
|
|
|
1
|
-
import { SvelteComponent } from "svelte";
|
|
2
1
|
import { GroupedBarChart as GroupedBarChartCore, type BarChartOptions, type ChartTabularData } from '@carbon/charts';
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
update: CustomEvent<{
|
|
14
|
-
data: ChartTabularData;
|
|
15
|
-
options: import("@carbon/charts").BaseChartOptions;
|
|
16
|
-
}>;
|
|
17
|
-
destroy: CustomEvent<null>;
|
|
18
|
-
} & {
|
|
19
|
-
[evt: string]: CustomEvent<any>;
|
|
2
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
|
3
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
|
4
|
+
$$bindings?: Bindings;
|
|
5
|
+
} & Exports;
|
|
6
|
+
(internal: unknown, props: Props & {
|
|
7
|
+
$$events?: Events;
|
|
8
|
+
$$slots?: Slots;
|
|
9
|
+
}): Exports & {
|
|
10
|
+
$set?: any;
|
|
11
|
+
$on?: any;
|
|
20
12
|
};
|
|
21
|
-
|
|
22
|
-
exports?: undefined;
|
|
23
|
-
bindings?: undefined;
|
|
24
|
-
};
|
|
25
|
-
export type BarChartGroupedProps = typeof __propDef.props;
|
|
26
|
-
export type BarChartGroupedEvents = typeof __propDef.events;
|
|
27
|
-
export type BarChartGroupedSlots = typeof __propDef.slots;
|
|
28
|
-
export default class BarChartGrouped extends SvelteComponent<BarChartGroupedProps, BarChartGroupedEvents, BarChartGroupedSlots> {
|
|
13
|
+
z_$$bindings?: Bindings;
|
|
29
14
|
}
|
|
30
|
-
|
|
15
|
+
declare const BarChartGrouped: $$__sveltets_2_IsomorphicComponent<{
|
|
16
|
+
[x: string]: any;
|
|
17
|
+
options: BarChartOptions;
|
|
18
|
+
data: ChartTabularData;
|
|
19
|
+
chart?: GroupedBarChartCore | undefined;
|
|
20
|
+
ref?: HTMLDivElement | undefined;
|
|
21
|
+
}, {
|
|
22
|
+
load: CustomEvent<null>;
|
|
23
|
+
update: CustomEvent<{
|
|
24
|
+
data: ChartTabularData;
|
|
25
|
+
options: import("@carbon/charts").BaseChartOptions;
|
|
26
|
+
}>;
|
|
27
|
+
destroy: CustomEvent<null>;
|
|
28
|
+
} & {
|
|
29
|
+
[evt: string]: CustomEvent<any>;
|
|
30
|
+
}, {}, {}, string>;
|
|
31
|
+
type BarChartGrouped = InstanceType<typeof BarChartGrouped>;
|
|
32
|
+
export default BarChartGrouped;
|
|
@@ -1,11 +1,15 @@
|
|
|
1
|
-
<script>
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import {
|
|
3
|
+
SimpleBarChart as SimpleBarChartCore,
|
|
4
|
+
type BarChartOptions,
|
|
5
|
+
type ChartTabularData
|
|
6
|
+
} from '@carbon/charts'
|
|
7
|
+
import BaseChart from './BaseChart.svelte'
|
|
8
|
+
|
|
9
|
+
export let options: BarChartOptions
|
|
10
|
+
export let data: ChartTabularData
|
|
11
|
+
export let chart: SimpleBarChartCore | undefined = undefined
|
|
12
|
+
export let ref: HTMLDivElement | undefined = undefined
|
|
9
13
|
</script>
|
|
10
14
|
|
|
11
15
|
<BaseChart
|
|
@@ -1,30 +1,32 @@
|
|
|
1
|
-
import { SvelteComponent } from "svelte";
|
|
2
1
|
import { SimpleBarChart as SimpleBarChartCore, type BarChartOptions, type ChartTabularData } from '@carbon/charts';
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
update: CustomEvent<{
|
|
14
|
-
data: ChartTabularData;
|
|
15
|
-
options: import("@carbon/charts").BaseChartOptions;
|
|
16
|
-
}>;
|
|
17
|
-
destroy: CustomEvent<null>;
|
|
18
|
-
} & {
|
|
19
|
-
[evt: string]: CustomEvent<any>;
|
|
2
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
|
3
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
|
4
|
+
$$bindings?: Bindings;
|
|
5
|
+
} & Exports;
|
|
6
|
+
(internal: unknown, props: Props & {
|
|
7
|
+
$$events?: Events;
|
|
8
|
+
$$slots?: Slots;
|
|
9
|
+
}): Exports & {
|
|
10
|
+
$set?: any;
|
|
11
|
+
$on?: any;
|
|
20
12
|
};
|
|
21
|
-
|
|
22
|
-
exports?: undefined;
|
|
23
|
-
bindings?: undefined;
|
|
24
|
-
};
|
|
25
|
-
export type BarChartSimpleProps = typeof __propDef.props;
|
|
26
|
-
export type BarChartSimpleEvents = typeof __propDef.events;
|
|
27
|
-
export type BarChartSimpleSlots = typeof __propDef.slots;
|
|
28
|
-
export default class BarChartSimple extends SvelteComponent<BarChartSimpleProps, BarChartSimpleEvents, BarChartSimpleSlots> {
|
|
13
|
+
z_$$bindings?: Bindings;
|
|
29
14
|
}
|
|
30
|
-
|
|
15
|
+
declare const BarChartSimple: $$__sveltets_2_IsomorphicComponent<{
|
|
16
|
+
[x: string]: any;
|
|
17
|
+
options: BarChartOptions;
|
|
18
|
+
data: ChartTabularData;
|
|
19
|
+
chart?: SimpleBarChartCore | undefined;
|
|
20
|
+
ref?: HTMLDivElement | undefined;
|
|
21
|
+
}, {
|
|
22
|
+
load: CustomEvent<null>;
|
|
23
|
+
update: CustomEvent<{
|
|
24
|
+
data: ChartTabularData;
|
|
25
|
+
options: import("@carbon/charts").BaseChartOptions;
|
|
26
|
+
}>;
|
|
27
|
+
destroy: CustomEvent<null>;
|
|
28
|
+
} & {
|
|
29
|
+
[evt: string]: CustomEvent<any>;
|
|
30
|
+
}, {}, {}, string>;
|
|
31
|
+
type BarChartSimple = InstanceType<typeof BarChartSimple>;
|
|
32
|
+
export default BarChartSimple;
|
|
@@ -1,11 +1,14 @@
|
|
|
1
|
-
<script>
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
export let
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import {
|
|
3
|
+
StackedBarChart as StackedBarChartCore,
|
|
4
|
+
type BarChartOptions,
|
|
5
|
+
type ChartTabularData
|
|
6
|
+
} from '@carbon/charts'
|
|
7
|
+
import BaseChart from './BaseChart.svelte'
|
|
8
|
+
export let options: BarChartOptions
|
|
9
|
+
export let data: ChartTabularData
|
|
10
|
+
export let chart: StackedBarChartCore | undefined = undefined
|
|
11
|
+
export let ref: HTMLDivElement | undefined = undefined
|
|
9
12
|
</script>
|
|
10
13
|
|
|
11
14
|
<BaseChart
|
|
@@ -1,30 +1,32 @@
|
|
|
1
|
-
import { SvelteComponent } from "svelte";
|
|
2
1
|
import { StackedBarChart as StackedBarChartCore, type BarChartOptions, type ChartTabularData } from '@carbon/charts';
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
update: CustomEvent<{
|
|
14
|
-
data: ChartTabularData;
|
|
15
|
-
options: import("@carbon/charts").BaseChartOptions;
|
|
16
|
-
}>;
|
|
17
|
-
destroy: CustomEvent<null>;
|
|
18
|
-
} & {
|
|
19
|
-
[evt: string]: CustomEvent<any>;
|
|
2
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
|
3
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
|
4
|
+
$$bindings?: Bindings;
|
|
5
|
+
} & Exports;
|
|
6
|
+
(internal: unknown, props: Props & {
|
|
7
|
+
$$events?: Events;
|
|
8
|
+
$$slots?: Slots;
|
|
9
|
+
}): Exports & {
|
|
10
|
+
$set?: any;
|
|
11
|
+
$on?: any;
|
|
20
12
|
};
|
|
21
|
-
|
|
22
|
-
exports?: undefined;
|
|
23
|
-
bindings?: undefined;
|
|
24
|
-
};
|
|
25
|
-
export type BarChartStackedProps = typeof __propDef.props;
|
|
26
|
-
export type BarChartStackedEvents = typeof __propDef.events;
|
|
27
|
-
export type BarChartStackedSlots = typeof __propDef.slots;
|
|
28
|
-
export default class BarChartStacked extends SvelteComponent<BarChartStackedProps, BarChartStackedEvents, BarChartStackedSlots> {
|
|
13
|
+
z_$$bindings?: Bindings;
|
|
29
14
|
}
|
|
30
|
-
|
|
15
|
+
declare const BarChartStacked: $$__sveltets_2_IsomorphicComponent<{
|
|
16
|
+
[x: string]: any;
|
|
17
|
+
options: BarChartOptions;
|
|
18
|
+
data: ChartTabularData;
|
|
19
|
+
chart?: StackedBarChartCore | undefined;
|
|
20
|
+
ref?: HTMLDivElement | undefined;
|
|
21
|
+
}, {
|
|
22
|
+
load: CustomEvent<null>;
|
|
23
|
+
update: CustomEvent<{
|
|
24
|
+
data: ChartTabularData;
|
|
25
|
+
options: import("@carbon/charts").BaseChartOptions;
|
|
26
|
+
}>;
|
|
27
|
+
destroy: CustomEvent<null>;
|
|
28
|
+
} & {
|
|
29
|
+
[evt: string]: CustomEvent<any>;
|
|
30
|
+
}, {}, {}, string>;
|
|
31
|
+
type BarChartStacked = InstanceType<typeof BarChartStacked>;
|
|
32
|
+
export default BarChartStacked;
|
package/dist/BaseChart.svelte
CHANGED
|
@@ -1,39 +1,56 @@
|
|
|
1
|
-
<script generics="T extends BaseChartOptions">
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
})
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
1
|
+
<script lang="ts" generics="T extends BaseChartOptions">
|
|
2
|
+
/* eslint-disable @typescript-eslint/no-unused-vars */
|
|
3
|
+
import { onMount, afterUpdate, onDestroy, createEventDispatcher } from 'svelte'
|
|
4
|
+
import type { Charts, ChartConfig, BaseChartOptions, ChartTabularData } from '@carbon/charts'
|
|
5
|
+
|
|
6
|
+
interface DispatchedEvents {
|
|
7
|
+
load: null
|
|
8
|
+
update: { data: ChartTabularData; options: T }
|
|
9
|
+
destroy: null
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
type CoreChartClass = new (holder: HTMLDivElement, chartConfigs: ChartConfig<T>) => Charts
|
|
13
|
+
|
|
14
|
+
const chartHolderCssClass = 'cds--chart-holder' // Used by Carbon Charts CSS
|
|
15
|
+
export let data: ChartTabularData = [] // Chart data, default is empty
|
|
16
|
+
export let options: T = {} as T // Specific chart option type, default is empty
|
|
17
|
+
export let Chart: CoreChartClass // Used to instantiate next property
|
|
18
|
+
export let chart: Charts | undefined // Instance of the chart class
|
|
19
|
+
export let ref: HTMLDivElement | undefined // Binding to chart 'holder' in template below
|
|
20
|
+
export let id = `chart-${Math.random().toString(36)}` // id for chart holder element
|
|
21
|
+
|
|
22
|
+
const dispatch = createEventDispatcher<DispatchedEvents>()
|
|
23
|
+
|
|
24
|
+
onMount(() => {
|
|
25
|
+
try {
|
|
26
|
+
chart = new Chart(ref as HTMLDivElement, { data, options })
|
|
27
|
+
dispatch('load')
|
|
28
|
+
} catch (error) {
|
|
29
|
+
console.error('Failed to initialize chart:', error)
|
|
30
|
+
}
|
|
31
|
+
})
|
|
32
|
+
|
|
33
|
+
afterUpdate(() => {
|
|
34
|
+
if (chart) {
|
|
35
|
+
try {
|
|
36
|
+
chart.model.setData(data)
|
|
37
|
+
chart.model.setOptions(options)
|
|
38
|
+
dispatch('update', { data, options })
|
|
39
|
+
} catch (error) {
|
|
40
|
+
console.error('Failed to update chart:', error)
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
})
|
|
44
|
+
|
|
45
|
+
onDestroy(() => {
|
|
46
|
+
if (chart) {
|
|
47
|
+
dispatch('destroy')
|
|
48
|
+
// Like core's Chart.destroy() but keeps div chart holder bound to ref as it's part of the template below
|
|
49
|
+
chart.components.forEach(component => component.destroy())
|
|
50
|
+
chart.model.set({ destroyed: true }, { skipUpdate: true })
|
|
51
|
+
chart = undefined
|
|
52
|
+
}
|
|
53
|
+
})
|
|
37
54
|
</script>
|
|
38
55
|
|
|
39
|
-
<div {id} bind:this={ref} class={chartHolderCssClass} {...$$restProps}
|
|
56
|
+
<div {id} bind:this={ref} class={chartHolderCssClass} {...$$restProps}></div>
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { SvelteComponent } from "svelte";
|
|
2
1
|
import type { Charts, ChartConfig, BaseChartOptions, ChartTabularData } from '@carbon/charts';
|
|
3
2
|
declare class __sveltets_Render<T extends BaseChartOptions> {
|
|
4
3
|
props(): {
|
|
@@ -7,7 +6,7 @@ declare class __sveltets_Render<T extends BaseChartOptions> {
|
|
|
7
6
|
options?: T | undefined;
|
|
8
7
|
Chart: new (holder: HTMLDivElement, chartConfigs: ChartConfig<T>) => Charts;
|
|
9
8
|
chart: Charts | undefined;
|
|
10
|
-
ref: HTMLDivElement;
|
|
9
|
+
ref: HTMLDivElement | undefined;
|
|
11
10
|
id?: string | undefined;
|
|
12
11
|
};
|
|
13
12
|
events(): {
|
|
@@ -21,10 +20,18 @@ declare class __sveltets_Render<T extends BaseChartOptions> {
|
|
|
21
20
|
[evt: string]: CustomEvent<any>;
|
|
22
21
|
};
|
|
23
22
|
slots(): {};
|
|
23
|
+
bindings(): string;
|
|
24
|
+
exports(): {};
|
|
24
25
|
}
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
26
|
+
interface $$IsomorphicComponent {
|
|
27
|
+
new <T extends BaseChartOptions>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<T>['props']>, ReturnType<__sveltets_Render<T>['events']>, ReturnType<__sveltets_Render<T>['slots']>> & {
|
|
28
|
+
$$bindings?: ReturnType<__sveltets_Render<T>['bindings']>;
|
|
29
|
+
} & ReturnType<__sveltets_Render<T>['exports']>;
|
|
30
|
+
<T extends BaseChartOptions>(internal: unknown, props: ReturnType<__sveltets_Render<T>['props']> & {
|
|
31
|
+
$$events?: ReturnType<__sveltets_Render<T>['events']>;
|
|
32
|
+
}): ReturnType<__sveltets_Render<T>['exports']>;
|
|
33
|
+
z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
|
|
29
34
|
}
|
|
30
|
-
|
|
35
|
+
declare const BaseChart: $$IsomorphicComponent;
|
|
36
|
+
type BaseChart<T extends BaseChartOptions> = InstanceType<typeof BaseChart<T>>;
|
|
37
|
+
export default BaseChart;
|
package/dist/BoxplotChart.svelte
CHANGED
|
@@ -1,11 +1,15 @@
|
|
|
1
|
-
<script>
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import {
|
|
3
|
+
BoxplotChart as BoxplotChartCore,
|
|
4
|
+
type BoxplotChartOptions,
|
|
5
|
+
type ChartTabularData
|
|
6
|
+
} from '@carbon/charts'
|
|
7
|
+
import BaseChart from './BaseChart.svelte'
|
|
8
|
+
|
|
9
|
+
export let options: BoxplotChartOptions
|
|
10
|
+
export let data: ChartTabularData
|
|
11
|
+
export let chart: BoxplotChartCore | undefined = undefined
|
|
12
|
+
export let ref: HTMLDivElement | undefined = undefined
|
|
9
13
|
</script>
|
|
10
14
|
|
|
11
15
|
<BaseChart
|