@codecademy/gamut 68.0.1-alpha.4fa3a1.0 → 68.0.1-alpha.588625.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (57) hide show
  1. package/dist/Anchor/index.d.ts +93 -18
  2. package/dist/Badge/index.d.ts +93 -18
  3. package/dist/Box/props.d.ts +93 -18
  4. package/dist/Button/shared/styles.d.ts +93 -18
  5. package/dist/Card/elements.d.ts +279 -54
  6. package/dist/ConnectedForm/utils.d.ts +1 -1
  7. package/dist/Form/SelectDropdown/styles.d.ts +1 -1
  8. package/dist/Form/elements/Form.d.ts +94 -19
  9. package/dist/Form/elements/FormGroupLabel.js +2 -2
  10. package/dist/Form/inputs/Select.js +5 -6
  11. package/dist/GridForm/GridFormSections/GridFormSectionBreak.d.ts +33 -6
  12. package/dist/InternalFloatingCard/InternalFloatingCard.d.ts +63 -12
  13. package/dist/Layout/Column.d.ts +93 -18
  14. package/dist/Layout/LayoutGrid.d.ts +60 -12
  15. package/dist/List/elements.d.ts +187 -37
  16. package/dist/Menu/elements.d.ts +93 -18
  17. package/dist/Pagination/AnimatedPaginationButtons.d.ts +95 -20
  18. package/dist/Pagination/EllipsisButton.d.ts +5 -5
  19. package/dist/Pagination/EllipsisButton.js +2 -2
  20. package/dist/Pagination/index.js +4 -4
  21. package/dist/Pagination/utils.d.ts +93 -18
  22. package/dist/Pagination/utils.js +1 -1
  23. package/dist/Tabs/props.d.ts +93 -18
  24. package/dist/Tag/types.d.ts +93 -18
  25. package/dist/Toggle/elements.d.ts +120 -24
  26. package/dist/Typography/Text.d.ts +93 -18
  27. package/dist/index.d.ts +0 -1
  28. package/dist/index.js +0 -1
  29. package/package.json +7 -7
  30. package/dist/BarChart/BarChartProvider.d.ts +0 -20
  31. package/dist/BarChart/BarChartProvider.js +0 -31
  32. package/dist/BarChart/BarRow/elements.d.ts +0 -713
  33. package/dist/BarChart/BarRow/elements.js +0 -89
  34. package/dist/BarChart/BarRow/index.d.ts +0 -26
  35. package/dist/BarChart/BarRow/index.js +0 -254
  36. package/dist/BarChart/GENERIC_EXAMPLE.d.ts +0 -14
  37. package/dist/BarChart/GENERIC_EXAMPLE.js +0 -333
  38. package/dist/BarChart/index.d.ts +0 -4
  39. package/dist/BarChart/index.js +0 -158
  40. package/dist/BarChart/layout/GridLines.d.ts +0 -7
  41. package/dist/BarChart/layout/GridLines.js +0 -78
  42. package/dist/BarChart/layout/ScaleChartHeader.d.ts +0 -10
  43. package/dist/BarChart/layout/ScaleChartHeader.js +0 -89
  44. package/dist/BarChart/layout/VerticalSpacer.d.ts +0 -6
  45. package/dist/BarChart/layout/VerticalSpacer.js +0 -56
  46. package/dist/BarChart/shared/elements.d.ts +0 -7
  47. package/dist/BarChart/shared/elements.js +0 -12
  48. package/dist/BarChart/shared/styles.d.ts +0 -4
  49. package/dist/BarChart/shared/styles.js +0 -4
  50. package/dist/BarChart/shared/translations.d.ts +0 -17
  51. package/dist/BarChart/shared/translations.js +0 -16
  52. package/dist/BarChart/shared/types.d.ts +0 -88
  53. package/dist/BarChart/shared/types.js +0 -1
  54. package/dist/BarChart/utils/hooks.d.ts +0 -93
  55. package/dist/BarChart/utils/hooks.js +0 -293
  56. package/dist/BarChart/utils/index.d.ts +0 -86
  57. package/dist/BarChart/utils/index.js +0 -165
@@ -1,333 +0,0 @@
1
- /**
2
- * Generic Type Example for BarChart with Custom Sorting
3
- *
4
- * This file demonstrates how the generic types work with custom properties.
5
- * TypeScript will automatically infer the bar type from barValues, and
6
- * sort functions will receive the correct type with custom properties.
7
- *
8
- * THIS WILL BE DELETED BEFORE SHIPPING
9
- */
10
-
11
- import { BarChart } from './index';
12
- import { jsx as _jsx } from "react/jsx-runtime";
13
- // ============================================================================
14
- // Example 1: Date-based sorting with automatic type inference
15
- // ============================================================================
16
-
17
- // Define bars with custom dateAdded property
18
- const barsWithDates = [{
19
- yLabel: 'Python',
20
- seriesOneValue: 1500,
21
- dateAdded: new Date('2023-01-15')
22
- }, {
23
- yLabel: 'JavaScript',
24
- seriesOneValue: 2000,
25
- dateAdded: new Date('2023-03-20')
26
- }, {
27
- yLabel: 'React',
28
- seriesOneValue: 450,
29
- dateAdded: new Date('2023-06-10')
30
- }, {
31
- yLabel: 'TypeScript',
32
- seriesOneValue: 300,
33
- dateAdded: new Date('2023-08-05')
34
- }, {
35
- yLabel: 'SQL',
36
- seriesOneValue: 600,
37
- dateAdded: new Date('2023-02-28')
38
- }];
39
-
40
- // TypeScript infers the type automatically - no need to specify it!
41
- export const DateSortingExample = () => {
42
- return /*#__PURE__*/_jsx(BarChart, {
43
- barValues: barsWithDates,
44
- description: "Sort by when each skill was added to your profile",
45
- maxRange: 2000,
46
- minRange: 0,
47
- sortFns: ['none', {
48
- label: 'Recently Added',
49
- value: 'recent',
50
- // bars parameter is automatically typed as:
51
- // (BarProps & { dateAdded: Date })[]
52
- // No type assertions needed!
53
- sortFn: bars => {
54
- return [...bars].sort((a, b) => {
55
- // TypeScript knows dateAdded exists and is a Date!
56
- const aDate = a.dateAdded;
57
- const bDate = b.dateAdded;
58
- if (!aDate && !bDate) return 0;
59
- if (!aDate) return 1;
60
- if (!bDate) return -1;
61
- return bDate.getTime() - aDate.getTime();
62
- });
63
- }
64
- }, {
65
- label: 'Oldest First',
66
- value: 'oldest',
67
- sortFn: bars => {
68
- return [...bars].sort((a, b) => {
69
- const aDate = a.dateAdded;
70
- const bDate = b.dateAdded;
71
- if (!aDate && !bDate) return 0;
72
- if (!aDate) return 1;
73
- if (!bDate) return -1;
74
- return aDate.getTime() - bDate.getTime();
75
- });
76
- }
77
- }],
78
- title: "Skills by Date Added",
79
- unit: "XP"
80
- });
81
- };
82
-
83
- // ============================================================================
84
- // Example 2: Category-based sorting with multiple custom properties
85
- // ============================================================================
86
-
87
- const barsWithCategory = [{
88
- yLabel: 'Python',
89
- seriesOneValue: 1500,
90
- category: 'backend',
91
- priority: 1
92
- }, {
93
- yLabel: 'JavaScript',
94
- seriesOneValue: 2000,
95
- category: 'frontend',
96
- priority: 2
97
- }, {
98
- yLabel: 'React',
99
- seriesOneValue: 450,
100
- category: 'frontend',
101
- priority: 3
102
- }, {
103
- yLabel: 'TypeScript',
104
- seriesOneValue: 300,
105
- category: 'frontend',
106
- priority: 4
107
- }, {
108
- yLabel: 'SQL',
109
- seriesOneValue: 600,
110
- category: 'backend',
111
- priority: 5
112
- }];
113
- export const CategorySortingExample = () => {
114
- return /*#__PURE__*/_jsx(BarChart, {
115
- barValues: barsWithCategory,
116
- description: "Sort by category or priority",
117
- maxRange: 2000,
118
- minRange: 0,
119
- sortFns: ['none', {
120
- label: 'By Category',
121
- value: 'category',
122
- // bars is typed with both category and priority properties
123
- sortFn: bars => {
124
- return [...bars].sort((a, b) => {
125
- // TypeScript knows category exists!
126
- if (a.category !== b.category) {
127
- return a.category.localeCompare(b.category);
128
- }
129
- // TypeScript knows priority exists!
130
- return a.priority - b.priority;
131
- });
132
- }
133
- }, {
134
- label: 'High Priority First',
135
- value: 'priority',
136
- sortFn: bars => {
137
- return [...bars].sort((a, b) => {
138
- // Direct access to priority - fully typed!
139
- return a.priority - b.priority;
140
- });
141
- }
142
- }],
143
- title: "Skills by Category",
144
- unit: "XP"
145
- });
146
- };
147
-
148
- // ============================================================================
149
- // Example 3: Complex sorting with nested properties
150
- // ============================================================================
151
-
152
- const barsWithMetadata = [{
153
- yLabel: 'Python',
154
- seriesOneValue: 1500,
155
- metadata: {
156
- addedDate: new Date('2023-01-15'),
157
- tags: ['backend', 'data-science'],
158
- rating: 4.5
159
- }
160
- }, {
161
- yLabel: 'JavaScript',
162
- seriesOneValue: 2000,
163
- metadata: {
164
- addedDate: new Date('2023-03-20'),
165
- tags: ['frontend', 'backend'],
166
- rating: 5.0
167
- }
168
- }, {
169
- yLabel: 'React',
170
- seriesOneValue: 450,
171
- metadata: {
172
- addedDate: new Date('2023-06-10'),
173
- tags: ['frontend'],
174
- rating: 4.8
175
- }
176
- }];
177
- export const ComplexSortingExample = () => {
178
- return /*#__PURE__*/_jsx(BarChart, {
179
- barValues: barsWithMetadata,
180
- description: "Sort by metadata properties",
181
- maxRange: 2000,
182
- minRange: 0,
183
- sortFns: ['none', {
184
- label: 'By Rating',
185
- value: 'rating',
186
- sortFn: bars => {
187
- return [...bars].sort((a, b) => {
188
- // TypeScript knows metadata.rating exists!
189
- return b.metadata.rating - a.metadata.rating;
190
- });
191
- }
192
- }, {
193
- label: 'By Date Added',
194
- value: 'date',
195
- sortFn: bars => {
196
- return [...bars].sort((a, b) => {
197
- // TypeScript knows metadata.addedDate exists!
198
- return b.metadata.addedDate.getTime() - a.metadata.addedDate.getTime();
199
- });
200
- }
201
- }, {
202
- label: 'Has Backend Tag',
203
- value: 'backend-tag',
204
- sortFn: bars => {
205
- return [...bars].sort((a, b) => {
206
- // TypeScript knows metadata.tags exists!
207
- const aHasBackend = a.metadata.tags.includes('backend');
208
- const bHasBackend = b.metadata.tags.includes('backend');
209
- if (aHasBackend && !bHasBackend) return -1;
210
- if (!aHasBackend && bHasBackend) return 1;
211
- return 0;
212
- });
213
- }
214
- }],
215
- title: "Skills with Metadata",
216
- unit: "XP"
217
- });
218
- };
219
-
220
- // ============================================================================
221
- // Example 4: Explicit type annotation (when needed)
222
- // ============================================================================
223
-
224
- // Sometimes you might want to be explicit about the type
225
- // The type is automatically inferred from barValues, but you can still
226
- // explicitly type the array if needed for clarity
227
-
228
- const barsWithScore = [{
229
- yLabel: 'Python',
230
- seriesOneValue: 1500,
231
- score: 85,
232
- lastUpdated: new Date('2024-01-01')
233
- }, {
234
- yLabel: 'JavaScript',
235
- seriesOneValue: 2000,
236
- score: 95,
237
- lastUpdated: new Date('2024-01-15')
238
- }];
239
- export const ExplicitTypeExample = () => {
240
- return /*#__PURE__*/_jsx(BarChart, {
241
- barValues: barsWithScore,
242
- description: "Explicitly typed bars with score and update date",
243
- maxRange: 2000,
244
- minRange: 0,
245
- sortFns: ['none', {
246
- label: 'By Score',
247
- value: 'score',
248
- // TypeScript automatically infers BarWithScore[] from barValues
249
- sortFn: bars => {
250
- return [...bars].sort((a, b) => {
251
- // Direct access to score - fully typed!
252
- return b.score - a.score;
253
- });
254
- }
255
- }, {
256
- label: 'Recently Updated',
257
- value: 'updated',
258
- sortFn: bars => {
259
- return [...bars].sort((a, b) => {
260
- // Direct access to lastUpdated - fully typed!
261
- return b.lastUpdated.getTime() - a.lastUpdated.getTime();
262
- });
263
- }
264
- }],
265
- title: "Skills with Scores",
266
- unit: "XP"
267
- });
268
- };
269
-
270
- // ============================================================================
271
- // Example 6: Purposefully wrong example to show type errors
272
- // ============================================================================
273
-
274
- const barsWithWrongCategory = [{
275
- yLabel: 'Python',
276
- seriesOneValue: 1500,
277
- category: 'backend',
278
- priority: 1
279
- }, {
280
- yLabel: 'JavaScript',
281
- seriesOneValue: 2000,
282
- category: 'frontend',
283
- priority: 2
284
- }, {
285
- yLabel: 'React',
286
- seriesOneValue: 450,
287
- category: 'frontend',
288
- priority: 3
289
- }, {
290
- yLabel: 'TypeScript',
291
- seriesOneValue: 300,
292
- category: 'frontend',
293
- priority: 4
294
- }, {
295
- yLabel: 'SQL',
296
- seriesOneValue: 600,
297
- catty: 'backend',
298
- purr: 5
299
- }];
300
- export const WrongCategorySortingExample = () => {
301
- return /*#__PURE__*/_jsx(BarChart, {
302
- barValues: barsWithWrongCategory,
303
- description: "Sort by category or priority",
304
- maxRange: 2000,
305
- minRange: 0,
306
- sortFns: ['none', {
307
- label: 'By Category',
308
- value: 'category',
309
- // bars is typed with both category and priority properties
310
- sortFn: bars => {
311
- return [...bars].sort((a, b) => {
312
- if (a.category !== b.category) {
313
- // @ts-expect-error - we know this is wrong
314
- return a.category.localeCompare(b.category);
315
- }
316
- // @ts-expect-error - we know priority might not exist
317
- return a.priority - b.priority;
318
- });
319
- }
320
- }, {
321
- label: 'High Priority First',
322
- value: 'priority',
323
- sortFn: bars => {
324
- return [...bars].sort((a, b) => {
325
- // @ts-expect-error - we know priority might not exist
326
- return a.priority - b.priority;
327
- });
328
- }
329
- }],
330
- title: "Skills by Category",
331
- unit: "XP"
332
- });
333
- };
@@ -1,4 +0,0 @@
1
- import { BarChartTranslations } from './shared/translations';
2
- import { BarChartProps, BarProps, InferBarType } from './shared/types';
3
- export type { BarProps, InferBarType, BarChartTranslations };
4
- export declare const BarChart: <TBarValues extends BarProps[] | readonly BarProps[] = BarProps[]>({ "aria-labelledby": ariaLabelledBy, animate, barValues, description, hideDescription, hideTitle, maxRange, minRange, sortFns, styleConfig, title, translations, unit, xScale, }: BarChartProps<TBarValues>) => import("react/jsx-runtime").JSX.Element;
@@ -1,158 +0,0 @@
1
- import _styled from "@emotion/styled/base";
2
- import { css } from '@codecademy/gamut-styles';
3
- import { useId, useMemo } from 'react';
4
- import { Box, FlexBox } from '../Box';
5
- import { FormGroupLabel } from '../Form';
6
- import { Select } from '../Form/inputs/Select';
7
- import { Text } from '../Typography/Text';
8
- import { BarChartProvider } from './BarChartProvider';
9
- import { BarRow } from './BarRow';
10
- import { GridLines } from './layout/GridLines';
11
- import { ScaleChartHeader } from './layout/ScaleChartHeader';
12
- import { BarsList } from './shared/elements';
13
- import { defaultBarChartTranslations } from './shared/translations';
14
- import { useBarChart, useBarChartSort } from './utils/hooks';
15
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
16
- const StyledFormGroupLabel = /*#__PURE__*/_styled(FormGroupLabel, {
17
- target: "ey39o7m1",
18
- label: "StyledFormGroupLabel"
19
- })(css({
20
- mr: 8,
21
- mt: 4
22
- }), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9CYXJDaGFydC9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBc0I2QiIsImZpbGUiOiIuLi8uLi9zcmMvQmFyQ2hhcnQvaW5kZXgudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtc3R5bGVzJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IHVzZUlkLCB1c2VNZW1vIH0gZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQgeyBCb3gsIEZsZXhCb3ggfSBmcm9tICcuLi9Cb3gnO1xuaW1wb3J0IHsgRm9ybUdyb3VwTGFiZWwgfSBmcm9tICcuLi9Gb3JtJztcbmltcG9ydCB7IFNlbGVjdCB9IGZyb20gJy4uL0Zvcm0vaW5wdXRzL1NlbGVjdCc7XG5pbXBvcnQgeyBUZXh0IH0gZnJvbSAnLi4vVHlwb2dyYXBoeS9UZXh0JztcbmltcG9ydCB7IEJhckNoYXJ0UHJvdmlkZXIgfSBmcm9tICcuL0JhckNoYXJ0UHJvdmlkZXInO1xuaW1wb3J0IHsgQmFyUm93IH0gZnJvbSAnLi9CYXJSb3cnO1xuaW1wb3J0IHsgR3JpZExpbmVzIH0gZnJvbSAnLi9sYXlvdXQvR3JpZExpbmVzJztcbmltcG9ydCB7IFNjYWxlQ2hhcnRIZWFkZXIgfSBmcm9tICcuL2xheW91dC9TY2FsZUNoYXJ0SGVhZGVyJztcbmltcG9ydCB7IEJhcnNMaXN0IH0gZnJvbSAnLi9zaGFyZWQvZWxlbWVudHMnO1xuaW1wb3J0IHtcbiAgQmFyQ2hhcnRUcmFuc2xhdGlvbnMsXG4gIGRlZmF1bHRCYXJDaGFydFRyYW5zbGF0aW9ucyxcbn0gZnJvbSAnLi9zaGFyZWQvdHJhbnNsYXRpb25zJztcbmltcG9ydCB7IEJhckNoYXJ0UHJvcHMsIEJhclByb3BzLCBJbmZlckJhclR5cGUgfSBmcm9tICcuL3NoYXJlZC90eXBlcyc7XG5pbXBvcnQgeyB1c2VCYXJDaGFydCwgdXNlQmFyQ2hhcnRTb3J0IH0gZnJvbSAnLi91dGlscy9ob29rcyc7XG5cbmV4cG9ydCB0eXBlIHsgQmFyUHJvcHMsIEluZmVyQmFyVHlwZSwgQmFyQ2hhcnRUcmFuc2xhdGlvbnMgfTtcblxuY29uc3QgU3R5bGVkRm9ybUdyb3VwTGFiZWwgPSBzdHlsZWQoRm9ybUdyb3VwTGFiZWwpKFxuICBjc3Moe1xuICAgIG1yOiA4LFxuICAgIG10OiA0LFxuICB9KVxuKTtcbmNvbnN0IFdpZHRoU2VsZWN0ID0gc3R5bGVkKFNlbGVjdCkoXG4gIGNzcyh7XG4gICAgd2lkdGg6ICdtYXgtY29udGVudCcsXG4gICAgcHI6IDEyLFxuICB9KVxuKTtcblxuZXhwb3J0IGNvbnN0IEJhckNoYXJ0ID0gPFxuICBUQmFyVmFsdWVzIGV4dGVuZHMgQmFyUHJvcHNbXSB8IHJlYWRvbmx5IEJhclByb3BzW10gPSBCYXJQcm9wc1tdXG4+KHtcbiAgJ2FyaWEtbGFiZWxsZWRieSc6IGFyaWFMYWJlbGxlZEJ5LFxuICBhbmltYXRlID0gZmFsc2UsXG4gIGJhclZhbHVlcyxcbiAgZGVzY3JpcHRpb24sXG4gIGhpZGVEZXNjcmlwdGlvbiA9IGZhbHNlLFxuICBoaWRlVGl0bGUgPSBmYWxzZSxcbiAgbWF4UmFuZ2UsXG4gIG1pblJhbmdlLFxuICBzb3J0Rm5zLFxuICBzdHlsZUNvbmZpZyxcbiAgdGl0bGUsXG4gIHRyYW5zbGF0aW9ucyxcbiAgdW5pdCA9ICcnLFxuICB4U2NhbGUsXG59OiBCYXJDaGFydFByb3BzPFRCYXJWYWx1ZXM+KSA9PiB7XG4gIGNvbnN0IG1lcmdlZFRyYW5zbGF0aW9ucyA9IHVzZU1lbW8oXG4gICAgKCkgPT4gKHtcbiAgICAgIC4uLmRlZmF1bHRCYXJDaGFydFRyYW5zbGF0aW9ucyxcbiAgICAgIC4uLnRyYW5zbGF0aW9ucyxcbiAgICAgIHNvcnRPcHRpb25zOiB7XG4gICAgICAgIC4uLmRlZmF1bHRCYXJDaGFydFRyYW5zbGF0aW9ucy5zb3J0T3B0aW9ucyxcbiAgICAgICAgLi4udHJhbnNsYXRpb25zPy5zb3J0T3B0aW9ucyxcbiAgICAgIH0sXG4gICAgICBhY2Nlc3NpYmlsaXR5OiB7XG4gICAgICAgIC4uLmRlZmF1bHRCYXJDaGFydFRyYW5zbGF0aW9ucy5hY2Nlc3NpYmlsaXR5LFxuICAgICAgICAuLi50cmFuc2xhdGlvbnM/LmFjY2Vzc2liaWxpdHksXG4gICAgICB9LFxuICAgIH0pLFxuICAgIFt0cmFuc2xhdGlvbnNdXG4gICk7XG5cbiAgY29uc3QgeyBzb3J0ZWRCYXJzLCBzZWxlY3RQcm9wcyB9ID0gdXNlQmFyQ2hhcnRTb3J0PFRCYXJWYWx1ZXM+KHtcbiAgICBiYXJzOiBiYXJWYWx1ZXMsXG4gICAgc29ydEZucyxcbiAgICB0cmFuc2xhdGlvbnM6IG1lcmdlZFRyYW5zbGF0aW9ucyxcbiAgfSk7XG5cbiAgY29uc3QgY29udGV4dFZhbHVlID0gdXNlQmFyQ2hhcnQoe1xuICAgIG1pblJhbmdlLFxuICAgIG1heFJhbmdlLFxuICAgIHhTY2FsZSxcbiAgICB1bml0LFxuICAgIHN0eWxlQ29uZmlnLFxuICAgIGFuaW1hdGUsXG4gICAgYmFyQ291bnQ6IHNvcnRlZEJhcnM/Lmxlbmd0aCxcbiAgICB0cmFuc2xhdGlvbnM6IG1lcmdlZFRyYW5zbGF0aW9ucyxcbiAgfSk7XG5cbiAgY29uc3QgdGlja0NvdW50ID0gTWF0aC5jZWlsKChtYXhSYW5nZSAtIG1pblJhbmdlKSAvIGNvbnRleHRWYWx1ZS54U2NhbGUpICsgMTtcblxuICBjb25zdCB0aXRsZUlkID0gdXNlSWQoKTtcbiAgY29uc3Qgc29ydFNlbGVjdElkID0gdXNlSWQoKTtcblxuICBjb25zdCB0aXRsZVByb3BzID1cbiAgICB0eXBlb2YgdGl0bGUgPT09ICdzdHJpbmcnXG4gICAgICA/IHtcbiAgICAgICAgICBhczogJ2gyJyBhcyBjb25zdCxcbiAgICAgICAgICBjaGlsZHJlbjogdGl0bGUsXG4gICAgICAgICAgaGlkZGVuOiBoaWRlVGl0bGUsXG4gICAgICAgICAgaWQ6IHRpdGxlSWQsXG4gICAgICAgICAgdmFyaWFudDogJ3RpdGxlLXhzJyBhcyBjb25zdCxcbiAgICAgICAgfVxuICAgICAgOiB0aXRsZVxuICAgICAgPyB7IC4uLnRpdGxlLCBjaGlsZHJlbjogdGl0bGUudGl0bGUsIGhpZGRlbjogaGlkZVRpdGxlLCBpZDogdGl0bGVJZCB9XG4gICAgICA6IG51bGw7XG5cbiAgY29uc3QgdGl0bGVDb250ZW50ID1cbiAgICAodGl0bGUgJiYgIWhpZGVUaXRsZSkgfHwgc2VsZWN0UHJvcHMgPyAoXG4gICAgICA8Qm94XG4gICAgICAgIGJvcmRlckJvdHRvbT17MX1cbiAgICAgICAgYm9yZGVyQ29sb3I9XCJiYWNrZ3JvdW5kLWRpc2FibGVkXCJcbiAgICAgICAgbWI9ezI0fVxuICAgICAgICBwYj17OH1cbiAgICAgICAgd2lkdGg9XCIxMDAlXCJcbiAgICAgID5cbiAgICAgICAgPEZsZXhCb3hcbiAgICAgICAgICBhbGlnbkl0ZW1zPVwiY2VudGVyXCJcbiAgICAgICAgICBqdXN0aWZ5Q29udGVudD1cInNwYWNlLWJldHdlZW5cIlxuICAgICAgICAgIHdpZHRoPVwiMTAwJVwiXG4gICAgICAgID5cbiAgICAgICAgICB7dGl0bGVQcm9wcyAmJiA8VGV4dCBtYj17NH0gey4uLnRpdGxlUHJvcHN9IC8+fVxuICAgICAgICAgIHtzZWxlY3RQcm9wcyAmJiAoXG4gICAgICAgICAgICA8RmxleEJveCBhbGlnbkl0ZW1zPVwiY2VudGVyXCI+XG4gICAgICAgICAgICAgIDxTdHlsZWRGb3JtR3JvdXBMYWJlbFxuICAgICAgICAgICAgICAgIGh0bWxGb3I9e3NvcnRTZWxlY3RJZH1cbiAgICAgICAgICAgICAgICBpc1NvbG9GaWVsZFxuICAgICAgICAgICAgICAgIHNpemU9XCJzbWFsbFwiXG4gICAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICB7bWVyZ2VkVHJhbnNsYXRpb25zLnNvcnRMYWJlbH1cbiAgICAgICAgICAgICAgPC9TdHlsZWRGb3JtR3JvdXBMYWJlbD5cbiAgICAgICAgICAgICAgPFdpZHRoU2VsZWN0XG4gICAgICAgICAgICAgICAgc2l6ZVZhcmlhbnQ9XCJzbWFsbFwiXG4gICAgICAgICAgICAgICAgey4uLnNlbGVjdFByb3BzfVxuICAgICAgICAgICAgICAgIGlkPXtzb3J0U2VsZWN0SWR9XG4gICAgICAgICAgICAgIC8+XG4gICAgICAgICAgICA8L0ZsZXhCb3g+XG4gICAgICAgICAgKX1cbiAgICAgICAgPC9GbGV4Qm94PlxuICAgICAgPC9Cb3g+XG4gICAgKSA6IChcbiAgICAgIDxUZXh0IHsuLi50aXRsZVByb3BzfSAvPlxuICAgICk7XG5cbiAgcmV0dXJuIChcbiAgICA8QmFyQ2hhcnRQcm92aWRlciB2YWx1ZT17Y29udGV4dFZhbHVlfT5cbiAgICAgIHt0aXRsZUNvbnRlbnR9XG4gICAgICA8Qm94IGFzPVwiZmlndXJlXCIgcG9zaXRpb249XCJyZWxhdGl2ZVwiIHdpZHRoPVwiMTAwJVwiPlxuICAgICAgICA8U2NhbGVDaGFydEhlYWRlclxuICAgICAgICAgIGxhYmVsQ291bnQ9e3RpY2tDb3VudH1cbiAgICAgICAgICBtYXg9e21heFJhbmdlfVxuICAgICAgICAgIG1pbj17bWluUmFuZ2V9XG4gICAgICAgIC8+XG4gICAgICAgIDxCb3ggcG9zaXRpb249XCJyZWxhdGl2ZVwiIHdpZHRoPVwiMTAwJVwiPlxuICAgICAgICAgIDxHcmlkTGluZXMgbWF4PXttYXhSYW5nZX0gbWluPXttaW5SYW5nZX0gdGlja0NvdW50PXt0aWNrQ291bnR9IC8+XG4gICAgICAgICAgPEJhcnNMaXN0IGFyaWEtbGFiZWxsZWRieT17YXJpYUxhYmVsbGVkQnkgPz8gdGl0bGVJZH0+XG4gICAgICAgICAgICB7c29ydGVkQmFycy5tYXAoKGJhciwgaW5kZXgpID0+IHtcbiAgICAgICAgICAgICAgY29uc3Qga2V5ID1cbiAgICAgICAgICAgICAgICBiYXIueUxhYmVsICYmIGJhci5zZXJpZXNPbmVWYWx1ZVxuICAgICAgICAgICAgICAgICAgPyBgJHtiYXIueUxhYmVsfS0ke2Jhci5zZXJpZXNPbmVWYWx1ZX0tJHtcbiAgICAgICAgICAgICAgICAgICAgICBiYXIuc2VyaWVzVHdvVmFsdWUgPz8gJydcbiAgICAgICAgICAgICAgICAgICAgfS0ke2luZGV4fWBcbiAgICAgICAgICAgICAgICAgIDogaW5kZXg7XG4gICAgICAgICAgICAgIHJldHVybiA8QmFyUm93IGluZGV4PXtpbmRleH0ga2V5PXtrZXl9IHsuLi5iYXJ9IC8+O1xuICAgICAgICAgICAgfSl9XG4gICAgICAgICAgPC9CYXJzTGlzdD5cbiAgICAgICAgPC9Cb3g+XG4gICAgICAgIDxUZXh0XG4gICAgICAgICAgYXM9XCJmaWdjYXB0aW9uXCJcbiAgICAgICAgICBjb2xvcj1cInRleHQtZGlzYWJsZWRcIlxuICAgICAgICAgIGhpZGRlbj17aGlkZURlc2NyaXB0aW9ufVxuICAgICAgICAgIG10PXs4fVxuICAgICAgICAgIHZhcmlhbnQ9XCJwLXNtYWxsXCJcbiAgICAgICAgPlxuICAgICAgICAgIHtkZXNjcmlwdGlvbn1cbiAgICAgICAgPC9UZXh0PlxuICAgICAgPC9Cb3g+XG4gICAgPC9CYXJDaGFydFByb3ZpZGVyPlxuICApO1xufTtcbiJdfQ== */");
23
- const WidthSelect = /*#__PURE__*/_styled(Select, {
24
- target: "ey39o7m0",
25
- label: "WidthSelect"
26
- })(css({
27
- width: 'max-content',
28
- pr: 12
29
- }), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9CYXJDaGFydC9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNEJvQiIsImZpbGUiOiIuLi8uLi9zcmMvQmFyQ2hhcnQvaW5kZXgudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtc3R5bGVzJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IHVzZUlkLCB1c2VNZW1vIH0gZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQgeyBCb3gsIEZsZXhCb3ggfSBmcm9tICcuLi9Cb3gnO1xuaW1wb3J0IHsgRm9ybUdyb3VwTGFiZWwgfSBmcm9tICcuLi9Gb3JtJztcbmltcG9ydCB7IFNlbGVjdCB9IGZyb20gJy4uL0Zvcm0vaW5wdXRzL1NlbGVjdCc7XG5pbXBvcnQgeyBUZXh0IH0gZnJvbSAnLi4vVHlwb2dyYXBoeS9UZXh0JztcbmltcG9ydCB7IEJhckNoYXJ0UHJvdmlkZXIgfSBmcm9tICcuL0JhckNoYXJ0UHJvdmlkZXInO1xuaW1wb3J0IHsgQmFyUm93IH0gZnJvbSAnLi9CYXJSb3cnO1xuaW1wb3J0IHsgR3JpZExpbmVzIH0gZnJvbSAnLi9sYXlvdXQvR3JpZExpbmVzJztcbmltcG9ydCB7IFNjYWxlQ2hhcnRIZWFkZXIgfSBmcm9tICcuL2xheW91dC9TY2FsZUNoYXJ0SGVhZGVyJztcbmltcG9ydCB7IEJhcnNMaXN0IH0gZnJvbSAnLi9zaGFyZWQvZWxlbWVudHMnO1xuaW1wb3J0IHtcbiAgQmFyQ2hhcnRUcmFuc2xhdGlvbnMsXG4gIGRlZmF1bHRCYXJDaGFydFRyYW5zbGF0aW9ucyxcbn0gZnJvbSAnLi9zaGFyZWQvdHJhbnNsYXRpb25zJztcbmltcG9ydCB7IEJhckNoYXJ0UHJvcHMsIEJhclByb3BzLCBJbmZlckJhclR5cGUgfSBmcm9tICcuL3NoYXJlZC90eXBlcyc7XG5pbXBvcnQgeyB1c2VCYXJDaGFydCwgdXNlQmFyQ2hhcnRTb3J0IH0gZnJvbSAnLi91dGlscy9ob29rcyc7XG5cbmV4cG9ydCB0eXBlIHsgQmFyUHJvcHMsIEluZmVyQmFyVHlwZSwgQmFyQ2hhcnRUcmFuc2xhdGlvbnMgfTtcblxuY29uc3QgU3R5bGVkRm9ybUdyb3VwTGFiZWwgPSBzdHlsZWQoRm9ybUdyb3VwTGFiZWwpKFxuICBjc3Moe1xuICAgIG1yOiA4LFxuICAgIG10OiA0LFxuICB9KVxuKTtcbmNvbnN0IFdpZHRoU2VsZWN0ID0gc3R5bGVkKFNlbGVjdCkoXG4gIGNzcyh7XG4gICAgd2lkdGg6ICdtYXgtY29udGVudCcsXG4gICAgcHI6IDEyLFxuICB9KVxuKTtcblxuZXhwb3J0IGNvbnN0IEJhckNoYXJ0ID0gPFxuICBUQmFyVmFsdWVzIGV4dGVuZHMgQmFyUHJvcHNbXSB8IHJlYWRvbmx5IEJhclByb3BzW10gPSBCYXJQcm9wc1tdXG4+KHtcbiAgJ2FyaWEtbGFiZWxsZWRieSc6IGFyaWFMYWJlbGxlZEJ5LFxuICBhbmltYXRlID0gZmFsc2UsXG4gIGJhclZhbHVlcyxcbiAgZGVzY3JpcHRpb24sXG4gIGhpZGVEZXNjcmlwdGlvbiA9IGZhbHNlLFxuICBoaWRlVGl0bGUgPSBmYWxzZSxcbiAgbWF4UmFuZ2UsXG4gIG1pblJhbmdlLFxuICBzb3J0Rm5zLFxuICBzdHlsZUNvbmZpZyxcbiAgdGl0bGUsXG4gIHRyYW5zbGF0aW9ucyxcbiAgdW5pdCA9ICcnLFxuICB4U2NhbGUsXG59OiBCYXJDaGFydFByb3BzPFRCYXJWYWx1ZXM+KSA9PiB7XG4gIGNvbnN0IG1lcmdlZFRyYW5zbGF0aW9ucyA9IHVzZU1lbW8oXG4gICAgKCkgPT4gKHtcbiAgICAgIC4uLmRlZmF1bHRCYXJDaGFydFRyYW5zbGF0aW9ucyxcbiAgICAgIC4uLnRyYW5zbGF0aW9ucyxcbiAgICAgIHNvcnRPcHRpb25zOiB7XG4gICAgICAgIC4uLmRlZmF1bHRCYXJDaGFydFRyYW5zbGF0aW9ucy5zb3J0T3B0aW9ucyxcbiAgICAgICAgLi4udHJhbnNsYXRpb25zPy5zb3J0T3B0aW9ucyxcbiAgICAgIH0sXG4gICAgICBhY2Nlc3NpYmlsaXR5OiB7XG4gICAgICAgIC4uLmRlZmF1bHRCYXJDaGFydFRyYW5zbGF0aW9ucy5hY2Nlc3NpYmlsaXR5LFxuICAgICAgICAuLi50cmFuc2xhdGlvbnM/LmFjY2Vzc2liaWxpdHksXG4gICAgICB9LFxuICAgIH0pLFxuICAgIFt0cmFuc2xhdGlvbnNdXG4gICk7XG5cbiAgY29uc3QgeyBzb3J0ZWRCYXJzLCBzZWxlY3RQcm9wcyB9ID0gdXNlQmFyQ2hhcnRTb3J0PFRCYXJWYWx1ZXM+KHtcbiAgICBiYXJzOiBiYXJWYWx1ZXMsXG4gICAgc29ydEZucyxcbiAgICB0cmFuc2xhdGlvbnM6IG1lcmdlZFRyYW5zbGF0aW9ucyxcbiAgfSk7XG5cbiAgY29uc3QgY29udGV4dFZhbHVlID0gdXNlQmFyQ2hhcnQoe1xuICAgIG1pblJhbmdlLFxuICAgIG1heFJhbmdlLFxuICAgIHhTY2FsZSxcbiAgICB1bml0LFxuICAgIHN0eWxlQ29uZmlnLFxuICAgIGFuaW1hdGUsXG4gICAgYmFyQ291bnQ6IHNvcnRlZEJhcnM/Lmxlbmd0aCxcbiAgICB0cmFuc2xhdGlvbnM6IG1lcmdlZFRyYW5zbGF0aW9ucyxcbiAgfSk7XG5cbiAgY29uc3QgdGlja0NvdW50ID0gTWF0aC5jZWlsKChtYXhSYW5nZSAtIG1pblJhbmdlKSAvIGNvbnRleHRWYWx1ZS54U2NhbGUpICsgMTtcblxuICBjb25zdCB0aXRsZUlkID0gdXNlSWQoKTtcbiAgY29uc3Qgc29ydFNlbGVjdElkID0gdXNlSWQoKTtcblxuICBjb25zdCB0aXRsZVByb3BzID1cbiAgICB0eXBlb2YgdGl0bGUgPT09ICdzdHJpbmcnXG4gICAgICA/IHtcbiAgICAgICAgICBhczogJ2gyJyBhcyBjb25zdCxcbiAgICAgICAgICBjaGlsZHJlbjogdGl0bGUsXG4gICAgICAgICAgaGlkZGVuOiBoaWRlVGl0bGUsXG4gICAgICAgICAgaWQ6IHRpdGxlSWQsXG4gICAgICAgICAgdmFyaWFudDogJ3RpdGxlLXhzJyBhcyBjb25zdCxcbiAgICAgICAgfVxuICAgICAgOiB0aXRsZVxuICAgICAgPyB7IC4uLnRpdGxlLCBjaGlsZHJlbjogdGl0bGUudGl0bGUsIGhpZGRlbjogaGlkZVRpdGxlLCBpZDogdGl0bGVJZCB9XG4gICAgICA6IG51bGw7XG5cbiAgY29uc3QgdGl0bGVDb250ZW50ID1cbiAgICAodGl0bGUgJiYgIWhpZGVUaXRsZSkgfHwgc2VsZWN0UHJvcHMgPyAoXG4gICAgICA8Qm94XG4gICAgICAgIGJvcmRlckJvdHRvbT17MX1cbiAgICAgICAgYm9yZGVyQ29sb3I9XCJiYWNrZ3JvdW5kLWRpc2FibGVkXCJcbiAgICAgICAgbWI9ezI0fVxuICAgICAgICBwYj17OH1cbiAgICAgICAgd2lkdGg9XCIxMDAlXCJcbiAgICAgID5cbiAgICAgICAgPEZsZXhCb3hcbiAgICAgICAgICBhbGlnbkl0ZW1zPVwiY2VudGVyXCJcbiAgICAgICAgICBqdXN0aWZ5Q29udGVudD1cInNwYWNlLWJldHdlZW5cIlxuICAgICAgICAgIHdpZHRoPVwiMTAwJVwiXG4gICAgICAgID5cbiAgICAgICAgICB7dGl0bGVQcm9wcyAmJiA8VGV4dCBtYj17NH0gey4uLnRpdGxlUHJvcHN9IC8+fVxuICAgICAgICAgIHtzZWxlY3RQcm9wcyAmJiAoXG4gICAgICAgICAgICA8RmxleEJveCBhbGlnbkl0ZW1zPVwiY2VudGVyXCI+XG4gICAgICAgICAgICAgIDxTdHlsZWRGb3JtR3JvdXBMYWJlbFxuICAgICAgICAgICAgICAgIGh0bWxGb3I9e3NvcnRTZWxlY3RJZH1cbiAgICAgICAgICAgICAgICBpc1NvbG9GaWVsZFxuICAgICAgICAgICAgICAgIHNpemU9XCJzbWFsbFwiXG4gICAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICB7bWVyZ2VkVHJhbnNsYXRpb25zLnNvcnRMYWJlbH1cbiAgICAgICAgICAgICAgPC9TdHlsZWRGb3JtR3JvdXBMYWJlbD5cbiAgICAgICAgICAgICAgPFdpZHRoU2VsZWN0XG4gICAgICAgICAgICAgICAgc2l6ZVZhcmlhbnQ9XCJzbWFsbFwiXG4gICAgICAgICAgICAgICAgey4uLnNlbGVjdFByb3BzfVxuICAgICAgICAgICAgICAgIGlkPXtzb3J0U2VsZWN0SWR9XG4gICAgICAgICAgICAgIC8+XG4gICAgICAgICAgICA8L0ZsZXhCb3g+XG4gICAgICAgICAgKX1cbiAgICAgICAgPC9GbGV4Qm94PlxuICAgICAgPC9Cb3g+XG4gICAgKSA6IChcbiAgICAgIDxUZXh0IHsuLi50aXRsZVByb3BzfSAvPlxuICAgICk7XG5cbiAgcmV0dXJuIChcbiAgICA8QmFyQ2hhcnRQcm92aWRlciB2YWx1ZT17Y29udGV4dFZhbHVlfT5cbiAgICAgIHt0aXRsZUNvbnRlbnR9XG4gICAgICA8Qm94IGFzPVwiZmlndXJlXCIgcG9zaXRpb249XCJyZWxhdGl2ZVwiIHdpZHRoPVwiMTAwJVwiPlxuICAgICAgICA8U2NhbGVDaGFydEhlYWRlclxuICAgICAgICAgIGxhYmVsQ291bnQ9e3RpY2tDb3VudH1cbiAgICAgICAgICBtYXg9e21heFJhbmdlfVxuICAgICAgICAgIG1pbj17bWluUmFuZ2V9XG4gICAgICAgIC8+XG4gICAgICAgIDxCb3ggcG9zaXRpb249XCJyZWxhdGl2ZVwiIHdpZHRoPVwiMTAwJVwiPlxuICAgICAgICAgIDxHcmlkTGluZXMgbWF4PXttYXhSYW5nZX0gbWluPXttaW5SYW5nZX0gdGlja0NvdW50PXt0aWNrQ291bnR9IC8+XG4gICAgICAgICAgPEJhcnNMaXN0IGFyaWEtbGFiZWxsZWRieT17YXJpYUxhYmVsbGVkQnkgPz8gdGl0bGVJZH0+XG4gICAgICAgICAgICB7c29ydGVkQmFycy5tYXAoKGJhciwgaW5kZXgpID0+IHtcbiAgICAgICAgICAgICAgY29uc3Qga2V5ID1cbiAgICAgICAgICAgICAgICBiYXIueUxhYmVsICYmIGJhci5zZXJpZXNPbmVWYWx1ZVxuICAgICAgICAgICAgICAgICAgPyBgJHtiYXIueUxhYmVsfS0ke2Jhci5zZXJpZXNPbmVWYWx1ZX0tJHtcbiAgICAgICAgICAgICAgICAgICAgICBiYXIuc2VyaWVzVHdvVmFsdWUgPz8gJydcbiAgICAgICAgICAgICAgICAgICAgfS0ke2luZGV4fWBcbiAgICAgICAgICAgICAgICAgIDogaW5kZXg7XG4gICAgICAgICAgICAgIHJldHVybiA8QmFyUm93IGluZGV4PXtpbmRleH0ga2V5PXtrZXl9IHsuLi5iYXJ9IC8+O1xuICAgICAgICAgICAgfSl9XG4gICAgICAgICAgPC9CYXJzTGlzdD5cbiAgICAgICAgPC9Cb3g+XG4gICAgICAgIDxUZXh0XG4gICAgICAgICAgYXM9XCJmaWdjYXB0aW9uXCJcbiAgICAgICAgICBjb2xvcj1cInRleHQtZGlzYWJsZWRcIlxuICAgICAgICAgIGhpZGRlbj17aGlkZURlc2NyaXB0aW9ufVxuICAgICAgICAgIG10PXs4fVxuICAgICAgICAgIHZhcmlhbnQ9XCJwLXNtYWxsXCJcbiAgICAgICAgPlxuICAgICAgICAgIHtkZXNjcmlwdGlvbn1cbiAgICAgICAgPC9UZXh0PlxuICAgICAgPC9Cb3g+XG4gICAgPC9CYXJDaGFydFByb3ZpZGVyPlxuICApO1xufTtcbiJdfQ== */");
30
- export const BarChart = ({
31
- 'aria-labelledby': ariaLabelledBy,
32
- animate = false,
33
- barValues,
34
- description,
35
- hideDescription = false,
36
- hideTitle = false,
37
- maxRange,
38
- minRange,
39
- sortFns,
40
- styleConfig,
41
- title,
42
- translations,
43
- unit = '',
44
- xScale
45
- }) => {
46
- const mergedTranslations = useMemo(() => ({
47
- ...defaultBarChartTranslations,
48
- ...translations,
49
- sortOptions: {
50
- ...defaultBarChartTranslations.sortOptions,
51
- ...translations?.sortOptions
52
- },
53
- accessibility: {
54
- ...defaultBarChartTranslations.accessibility,
55
- ...translations?.accessibility
56
- }
57
- }), [translations]);
58
- const {
59
- sortedBars,
60
- selectProps
61
- } = useBarChartSort({
62
- bars: barValues,
63
- sortFns,
64
- translations: mergedTranslations
65
- });
66
- const contextValue = useBarChart({
67
- minRange,
68
- maxRange,
69
- xScale,
70
- unit,
71
- styleConfig,
72
- animate,
73
- barCount: sortedBars?.length,
74
- translations: mergedTranslations
75
- });
76
- const tickCount = Math.ceil((maxRange - minRange) / contextValue.xScale) + 1;
77
- const titleId = useId();
78
- const sortSelectId = useId();
79
- const titleProps = typeof title === 'string' ? {
80
- as: 'h2',
81
- children: title,
82
- hidden: hideTitle,
83
- id: titleId,
84
- variant: 'title-xs'
85
- } : title ? {
86
- ...title,
87
- children: title.title,
88
- hidden: hideTitle,
89
- id: titleId
90
- } : null;
91
- const titleContent = title && !hideTitle || selectProps ? /*#__PURE__*/_jsx(Box, {
92
- borderBottom: 1,
93
- borderColor: "background-disabled",
94
- mb: 24,
95
- pb: 8,
96
- width: "100%",
97
- children: /*#__PURE__*/_jsxs(FlexBox, {
98
- alignItems: "center",
99
- justifyContent: "space-between",
100
- width: "100%",
101
- children: [titleProps && /*#__PURE__*/_jsx(Text, {
102
- mb: 4,
103
- ...titleProps
104
- }), selectProps && /*#__PURE__*/_jsxs(FlexBox, {
105
- alignItems: "center",
106
- children: [/*#__PURE__*/_jsx(StyledFormGroupLabel, {
107
- htmlFor: sortSelectId,
108
- isSoloField: true,
109
- size: "small",
110
- children: mergedTranslations.sortLabel
111
- }), /*#__PURE__*/_jsx(WidthSelect, {
112
- sizeVariant: "small",
113
- ...selectProps,
114
- id: sortSelectId
115
- })]
116
- })]
117
- })
118
- }) : /*#__PURE__*/_jsx(Text, {
119
- ...titleProps
120
- });
121
- return /*#__PURE__*/_jsxs(BarChartProvider, {
122
- value: contextValue,
123
- children: [titleContent, /*#__PURE__*/_jsxs(Box, {
124
- as: "figure",
125
- position: "relative",
126
- width: "100%",
127
- children: [/*#__PURE__*/_jsx(ScaleChartHeader, {
128
- labelCount: tickCount,
129
- max: maxRange,
130
- min: minRange
131
- }), /*#__PURE__*/_jsxs(Box, {
132
- position: "relative",
133
- width: "100%",
134
- children: [/*#__PURE__*/_jsx(GridLines, {
135
- max: maxRange,
136
- min: minRange,
137
- tickCount: tickCount
138
- }), /*#__PURE__*/_jsx(BarsList, {
139
- "aria-labelledby": ariaLabelledBy ?? titleId,
140
- children: sortedBars.map((bar, index) => {
141
- const key = bar.yLabel && bar.seriesOneValue ? `${bar.yLabel}-${bar.seriesOneValue}-${bar.seriesTwoValue ?? ''}-${index}` : index;
142
- return /*#__PURE__*/_jsx(BarRow, {
143
- index: index,
144
- ...bar
145
- }, key);
146
- })
147
- })]
148
- }), /*#__PURE__*/_jsx(Text, {
149
- as: "figcaption",
150
- color: "text-disabled",
151
- hidden: hideDescription,
152
- mt: 8,
153
- variant: "p-small",
154
- children: description
155
- })]
156
- })]
157
- });
158
- };
@@ -1,7 +0,0 @@
1
- import React from 'react';
2
- export interface GridLinesProps {
3
- tickCount: number;
4
- min: number;
5
- max: number;
6
- }
7
- export declare const GridLines: React.FC<GridLinesProps>;
@@ -1,78 +0,0 @@
1
- import _styled from "@emotion/styled/base";
2
- import { css } from '@codecademy/gamut-styles';
3
- import React, { useMemo } from 'react';
4
- import { Box } from '../../Box';
5
- import { useLabelPositions } from '../utils/hooks';
6
- import { VerticalSpacer } from './VerticalSpacer';
7
- import { jsx as _jsx } from "react/jsx-runtime";
8
- const GridLineWrapper = /*#__PURE__*/_styled(Box, {
9
- target: "ejng4zk2",
10
- label: "GridLineWrapper"
11
- })(css({
12
- bottom: 0,
13
- left: 0,
14
- pointerEvents: 'none',
15
- position: 'absolute',
16
- right: 0,
17
- top: 0,
18
- zIndex: 0
19
- }), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9CYXJDaGFydC9sYXlvdXQvR3JpZExpbmVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFRd0IiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL0JhckNoYXJ0L2xheW91dC9HcmlkTGluZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtc3R5bGVzJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCBSZWFjdCwgeyB1c2VNZW1vIH0gZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQgeyBCb3ggfSBmcm9tICcuLi8uLi9Cb3gnO1xuaW1wb3J0IHsgdXNlTGFiZWxQb3NpdGlvbnMgfSBmcm9tICcuLi91dGlscy9ob29rcyc7XG5pbXBvcnQgeyBWZXJ0aWNhbFNwYWNlciB9IGZyb20gJy4vVmVydGljYWxTcGFjZXInO1xuXG5jb25zdCBHcmlkTGluZVdyYXBwZXIgPSBzdHlsZWQoQm94KShcbiAgY3NzKHtcbiAgICBib3R0b206IDAsXG4gICAgbGVmdDogMCxcbiAgICBwb2ludGVyRXZlbnRzOiAnbm9uZScsXG4gICAgcG9zaXRpb246ICdhYnNvbHV0ZScsXG4gICAgcmlnaHQ6IDAsXG4gICAgdG9wOiAwLFxuICAgIHpJbmRleDogMCxcbiAgfSlcbik7XG5cbmNvbnN0IEdyaWRMaW5lQ29udGFpbmVyID0gc3R5bGVkKEJveCkoXG4gIGNzcyh7XG4gICAgYm9yZGVyQ29sb3I6ICdiYWNrZ3JvdW5kLWRpc2FibGVkJyxcbiAgICBib3JkZXJMZWZ0OiAxLFxuICAgIGJvcmRlclJpZ2h0OiAxLFxuICAgIGJvdHRvbTogMCxcbiAgICBkaXNwbGF5OiB7IF86ICdub25lJywgeHM6ICdibG9jaycgfSxcbiAgICBsZWZ0OiAwLFxuICAgIHBvc2l0aW9uOiAnYWJzb2x1dGUnLFxuICAgIHJpZ2h0OiAwLFxuICAgIHRvcDogMCxcbiAgfSlcbik7XG5cbmNvbnN0IEdyaWRMaW5lID0gc3R5bGVkKEJveCk8eyBwb3NpdGlvblBlcmNlbnQ6IG51bWJlciB9PihcbiAgY3NzKHtcbiAgICBib3JkZXJMZWZ0OiAxLFxuICAgIGJvcmRlckNvbG9yTGVmdDogJ2JhY2tncm91bmQtZGlzYWJsZWQnLFxuICAgIGhlaWdodDogJzEwMCUnLFxuICAgIHBvc2l0aW9uOiAnYWJzb2x1dGUnLFxuICAgIHRvcDogMCxcbiAgICB3aWR0aDogMCxcbiAgfSksXG4gICh7IHBvc2l0aW9uUGVyY2VudCB9KSA9PiAoe1xuICAgIGxlZnQ6IGAke3Bvc2l0aW9uUGVyY2VudH0lYCxcbiAgICB0cmFuc2Zvcm06ICd0cmFuc2xhdGVYKC01MCUpJyxcbiAgfSlcbik7XG5cbmV4cG9ydCBpbnRlcmZhY2UgR3JpZExpbmVzUHJvcHMge1xuICB0aWNrQ291bnQ6IG51bWJlcjtcbiAgbWluOiBudW1iZXI7XG4gIG1heDogbnVtYmVyO1xufVxuXG5leHBvcnQgY29uc3QgR3JpZExpbmVzOiBSZWFjdC5GQzxHcmlkTGluZXNQcm9wcz4gPSAoe1xuICB0aWNrQ291bnQsXG4gIG1pbixcbiAgbWF4LFxufSkgPT4ge1xuICBjb25zdCBsYWJlbFBvc2l0aW9ucyA9IHVzZUxhYmVsUG9zaXRpb25zKHsgbWluLCBtYXgsIGNvdW50OiB0aWNrQ291bnQgfSk7XG5cbiAgY29uc3QgbGluZXMgPSB1c2VNZW1vKFxuICAgICgpID0+XG4gICAgICBsYWJlbFBvc2l0aW9ucy5tYXAoKHsgcG9zaXRpb25QZXJjZW50LCB2YWx1ZSB9KSA9PiAoXG4gICAgICAgIDxHcmlkTGluZVxuICAgICAgICAgIGFyaWEtaGlkZGVuXG4gICAgICAgICAga2V5PXtgZ3JpZGxpbmUtJHt2YWx1ZX0tJHtwb3NpdGlvblBlcmNlbnR9YH1cbiAgICAgICAgICBwb3NpdGlvblBlcmNlbnQ9e3Bvc2l0aW9uUGVyY2VudH1cbiAgICAgICAgLz5cbiAgICAgICkpLFxuICAgIFtsYWJlbFBvc2l0aW9uc11cbiAgKTtcblxuICByZXR1cm4gKFxuICAgIDxHcmlkTGluZVdyYXBwZXIgYXJpYS1oaWRkZW4+XG4gICAgICA8VmVydGljYWxTcGFjZXI+XG4gICAgICAgIDxHcmlkTGluZUNvbnRhaW5lcj57bGluZXN9PC9HcmlkTGluZUNvbnRhaW5lcj5cbiAgICAgIDwvVmVydGljYWxTcGFjZXI+XG4gICAgPC9HcmlkTGluZVdyYXBwZXI+XG4gICk7XG59O1xuIl19 */");
20
- const GridLineContainer = /*#__PURE__*/_styled(Box, {
21
- target: "ejng4zk1",
22
- label: "GridLineContainer"
23
- })(css({
24
- borderColor: 'background-disabled',
25
- borderLeft: 1,
26
- borderRight: 1,
27
- bottom: 0,
28
- display: {
29
- _: 'none',
30
- xs: 'block'
31
- },
32
- left: 0,
33
- position: 'absolute',
34
- right: 0,
35
- top: 0
36
- }), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9CYXJDaGFydC9sYXlvdXQvR3JpZExpbmVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFvQjBCIiwiZmlsZSI6Ii4uLy4uLy4uL3NyYy9CYXJDaGFydC9sYXlvdXQvR3JpZExpbmVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgUmVhY3QsIHsgdXNlTWVtbyB9IGZyb20gJ3JlYWN0JztcblxuaW1wb3J0IHsgQm94IH0gZnJvbSAnLi4vLi4vQm94JztcbmltcG9ydCB7IHVzZUxhYmVsUG9zaXRpb25zIH0gZnJvbSAnLi4vdXRpbHMvaG9va3MnO1xuaW1wb3J0IHsgVmVydGljYWxTcGFjZXIgfSBmcm9tICcuL1ZlcnRpY2FsU3BhY2VyJztcblxuY29uc3QgR3JpZExpbmVXcmFwcGVyID0gc3R5bGVkKEJveCkoXG4gIGNzcyh7XG4gICAgYm90dG9tOiAwLFxuICAgIGxlZnQ6IDAsXG4gICAgcG9pbnRlckV2ZW50czogJ25vbmUnLFxuICAgIHBvc2l0aW9uOiAnYWJzb2x1dGUnLFxuICAgIHJpZ2h0OiAwLFxuICAgIHRvcDogMCxcbiAgICB6SW5kZXg6IDAsXG4gIH0pXG4pO1xuXG5jb25zdCBHcmlkTGluZUNvbnRhaW5lciA9IHN0eWxlZChCb3gpKFxuICBjc3Moe1xuICAgIGJvcmRlckNvbG9yOiAnYmFja2dyb3VuZC1kaXNhYmxlZCcsXG4gICAgYm9yZGVyTGVmdDogMSxcbiAgICBib3JkZXJSaWdodDogMSxcbiAgICBib3R0b206IDAsXG4gICAgZGlzcGxheTogeyBfOiAnbm9uZScsIHhzOiAnYmxvY2snIH0sXG4gICAgbGVmdDogMCxcbiAgICBwb3NpdGlvbjogJ2Fic29sdXRlJyxcbiAgICByaWdodDogMCxcbiAgICB0b3A6IDAsXG4gIH0pXG4pO1xuXG5jb25zdCBHcmlkTGluZSA9IHN0eWxlZChCb3gpPHsgcG9zaXRpb25QZXJjZW50OiBudW1iZXIgfT4oXG4gIGNzcyh7XG4gICAgYm9yZGVyTGVmdDogMSxcbiAgICBib3JkZXJDb2xvckxlZnQ6ICdiYWNrZ3JvdW5kLWRpc2FibGVkJyxcbiAgICBoZWlnaHQ6ICcxMDAlJyxcbiAgICBwb3NpdGlvbjogJ2Fic29sdXRlJyxcbiAgICB0b3A6IDAsXG4gICAgd2lkdGg6IDAsXG4gIH0pLFxuICAoeyBwb3NpdGlvblBlcmNlbnQgfSkgPT4gKHtcbiAgICBsZWZ0OiBgJHtwb3NpdGlvblBlcmNlbnR9JWAsXG4gICAgdHJhbnNmb3JtOiAndHJhbnNsYXRlWCgtNTAlKScsXG4gIH0pXG4pO1xuXG5leHBvcnQgaW50ZXJmYWNlIEdyaWRMaW5lc1Byb3BzIHtcbiAgdGlja0NvdW50OiBudW1iZXI7XG4gIG1pbjogbnVtYmVyO1xuICBtYXg6IG51bWJlcjtcbn1cblxuZXhwb3J0IGNvbnN0IEdyaWRMaW5lczogUmVhY3QuRkM8R3JpZExpbmVzUHJvcHM+ID0gKHtcbiAgdGlja0NvdW50LFxuICBtaW4sXG4gIG1heCxcbn0pID0+IHtcbiAgY29uc3QgbGFiZWxQb3NpdGlvbnMgPSB1c2VMYWJlbFBvc2l0aW9ucyh7IG1pbiwgbWF4LCBjb3VudDogdGlja0NvdW50IH0pO1xuXG4gIGNvbnN0IGxpbmVzID0gdXNlTWVtbyhcbiAgICAoKSA9PlxuICAgICAgbGFiZWxQb3NpdGlvbnMubWFwKCh7IHBvc2l0aW9uUGVyY2VudCwgdmFsdWUgfSkgPT4gKFxuICAgICAgICA8R3JpZExpbmVcbiAgICAgICAgICBhcmlhLWhpZGRlblxuICAgICAgICAgIGtleT17YGdyaWRsaW5lLSR7dmFsdWV9LSR7cG9zaXRpb25QZXJjZW50fWB9XG4gICAgICAgICAgcG9zaXRpb25QZXJjZW50PXtwb3NpdGlvblBlcmNlbnR9XG4gICAgICAgIC8+XG4gICAgICApKSxcbiAgICBbbGFiZWxQb3NpdGlvbnNdXG4gICk7XG5cbiAgcmV0dXJuIChcbiAgICA8R3JpZExpbmVXcmFwcGVyIGFyaWEtaGlkZGVuPlxuICAgICAgPFZlcnRpY2FsU3BhY2VyPlxuICAgICAgICA8R3JpZExpbmVDb250YWluZXI+e2xpbmVzfTwvR3JpZExpbmVDb250YWluZXI+XG4gICAgICA8L1ZlcnRpY2FsU3BhY2VyPlxuICAgIDwvR3JpZExpbmVXcmFwcGVyPlxuICApO1xufTtcbiJdfQ== */");
37
- const GridLine = /*#__PURE__*/_styled(Box, {
38
- target: "ejng4zk0",
39
- label: "GridLine"
40
- })(css({
41
- borderLeft: 1,
42
- borderColorLeft: 'background-disabled',
43
- height: '100%',
44
- position: 'absolute',
45
- top: 0,
46
- width: 0
47
- }), ({
48
- positionPercent
49
- }) => ({
50
- left: `${positionPercent}%`,
51
- transform: 'translateX(-50%)'
52
- }), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9CYXJDaGFydC9sYXlvdXQvR3JpZExpbmVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFrQ2lCIiwiZmlsZSI6Ii4uLy4uLy4uL3NyYy9CYXJDaGFydC9sYXlvdXQvR3JpZExpbmVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgUmVhY3QsIHsgdXNlTWVtbyB9IGZyb20gJ3JlYWN0JztcblxuaW1wb3J0IHsgQm94IH0gZnJvbSAnLi4vLi4vQm94JztcbmltcG9ydCB7IHVzZUxhYmVsUG9zaXRpb25zIH0gZnJvbSAnLi4vdXRpbHMvaG9va3MnO1xuaW1wb3J0IHsgVmVydGljYWxTcGFjZXIgfSBmcm9tICcuL1ZlcnRpY2FsU3BhY2VyJztcblxuY29uc3QgR3JpZExpbmVXcmFwcGVyID0gc3R5bGVkKEJveCkoXG4gIGNzcyh7XG4gICAgYm90dG9tOiAwLFxuICAgIGxlZnQ6IDAsXG4gICAgcG9pbnRlckV2ZW50czogJ25vbmUnLFxuICAgIHBvc2l0aW9uOiAnYWJzb2x1dGUnLFxuICAgIHJpZ2h0OiAwLFxuICAgIHRvcDogMCxcbiAgICB6SW5kZXg6IDAsXG4gIH0pXG4pO1xuXG5jb25zdCBHcmlkTGluZUNvbnRhaW5lciA9IHN0eWxlZChCb3gpKFxuICBjc3Moe1xuICAgIGJvcmRlckNvbG9yOiAnYmFja2dyb3VuZC1kaXNhYmxlZCcsXG4gICAgYm9yZGVyTGVmdDogMSxcbiAgICBib3JkZXJSaWdodDogMSxcbiAgICBib3R0b206IDAsXG4gICAgZGlzcGxheTogeyBfOiAnbm9uZScsIHhzOiAnYmxvY2snIH0sXG4gICAgbGVmdDogMCxcbiAgICBwb3NpdGlvbjogJ2Fic29sdXRlJyxcbiAgICByaWdodDogMCxcbiAgICB0b3A6IDAsXG4gIH0pXG4pO1xuXG5jb25zdCBHcmlkTGluZSA9IHN0eWxlZChCb3gpPHsgcG9zaXRpb25QZXJjZW50OiBudW1iZXIgfT4oXG4gIGNzcyh7XG4gICAgYm9yZGVyTGVmdDogMSxcbiAgICBib3JkZXJDb2xvckxlZnQ6ICdiYWNrZ3JvdW5kLWRpc2FibGVkJyxcbiAgICBoZWlnaHQ6ICcxMDAlJyxcbiAgICBwb3NpdGlvbjogJ2Fic29sdXRlJyxcbiAgICB0b3A6IDAsXG4gICAgd2lkdGg6IDAsXG4gIH0pLFxuICAoeyBwb3NpdGlvblBlcmNlbnQgfSkgPT4gKHtcbiAgICBsZWZ0OiBgJHtwb3NpdGlvblBlcmNlbnR9JWAsXG4gICAgdHJhbnNmb3JtOiAndHJhbnNsYXRlWCgtNTAlKScsXG4gIH0pXG4pO1xuXG5leHBvcnQgaW50ZXJmYWNlIEdyaWRMaW5lc1Byb3BzIHtcbiAgdGlja0NvdW50OiBudW1iZXI7XG4gIG1pbjogbnVtYmVyO1xuICBtYXg6IG51bWJlcjtcbn1cblxuZXhwb3J0IGNvbnN0IEdyaWRMaW5lczogUmVhY3QuRkM8R3JpZExpbmVzUHJvcHM+ID0gKHtcbiAgdGlja0NvdW50LFxuICBtaW4sXG4gIG1heCxcbn0pID0+IHtcbiAgY29uc3QgbGFiZWxQb3NpdGlvbnMgPSB1c2VMYWJlbFBvc2l0aW9ucyh7IG1pbiwgbWF4LCBjb3VudDogdGlja0NvdW50IH0pO1xuXG4gIGNvbnN0IGxpbmVzID0gdXNlTWVtbyhcbiAgICAoKSA9PlxuICAgICAgbGFiZWxQb3NpdGlvbnMubWFwKCh7IHBvc2l0aW9uUGVyY2VudCwgdmFsdWUgfSkgPT4gKFxuICAgICAgICA8R3JpZExpbmVcbiAgICAgICAgICBhcmlhLWhpZGRlblxuICAgICAgICAgIGtleT17YGdyaWRsaW5lLSR7dmFsdWV9LSR7cG9zaXRpb25QZXJjZW50fWB9XG4gICAgICAgICAgcG9zaXRpb25QZXJjZW50PXtwb3NpdGlvblBlcmNlbnR9XG4gICAgICAgIC8+XG4gICAgICApKSxcbiAgICBbbGFiZWxQb3NpdGlvbnNdXG4gICk7XG5cbiAgcmV0dXJuIChcbiAgICA8R3JpZExpbmVXcmFwcGVyIGFyaWEtaGlkZGVuPlxuICAgICAgPFZlcnRpY2FsU3BhY2VyPlxuICAgICAgICA8R3JpZExpbmVDb250YWluZXI+e2xpbmVzfTwvR3JpZExpbmVDb250YWluZXI+XG4gICAgICA8L1ZlcnRpY2FsU3BhY2VyPlxuICAgIDwvR3JpZExpbmVXcmFwcGVyPlxuICApO1xufTtcbiJdfQ== */");
53
- export const GridLines = ({
54
- tickCount,
55
- min,
56
- max
57
- }) => {
58
- const labelPositions = useLabelPositions({
59
- min,
60
- max,
61
- count: tickCount
62
- });
63
- const lines = useMemo(() => labelPositions.map(({
64
- positionPercent,
65
- value
66
- }) => /*#__PURE__*/_jsx(GridLine, {
67
- "aria-hidden": true,
68
- positionPercent: positionPercent
69
- }, `gridline-${value}-${positionPercent}`)), [labelPositions]);
70
- return /*#__PURE__*/_jsx(GridLineWrapper, {
71
- "aria-hidden": true,
72
- children: /*#__PURE__*/_jsx(VerticalSpacer, {
73
- children: /*#__PURE__*/_jsx(GridLineContainer, {
74
- children: lines
75
- })
76
- })
77
- });
78
- };
@@ -1,10 +0,0 @@
1
- import React from 'react';
2
- export interface ScaleChartHeaderProps {
3
- /** Minimum value on the scale */
4
- min: number;
5
- /** Maximum value on the scale */
6
- max: number;
7
- /** Number of labels to display */
8
- labelCount: number;
9
- }
10
- export declare const ScaleChartHeader: React.FC<ScaleChartHeaderProps>;