@codecademy/gamut 68.1.0-alpha.f9ca97.0 → 68.1.1-alpha.27bc7c.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Alert/elements.d.ts +3 -3
- package/dist/Anchor/index.d.ts +44 -13
- package/dist/Badge/index.d.ts +38 -7
- package/dist/BarChart/BarChartProvider.d.ts +19 -0
- package/dist/BarChart/BarChartProvider.js +27 -0
- package/dist/BarChart/BarRow/ValueLabelsContent.d.ts +7 -0
- package/dist/BarChart/BarRow/ValueLabelsContent.js +34 -0
- package/dist/BarChart/BarRow/elements.d.ts +943 -0
- package/dist/BarChart/BarRow/elements.js +102 -0
- package/dist/BarChart/BarRow/index.d.ts +6 -0
- package/dist/BarChart/BarRow/index.js +234 -0
- package/dist/BarChart/GENERIC_EXAMPLE.d.ts +14 -0
- package/dist/BarChart/GENERIC_EXAMPLE.js +327 -0
- package/dist/BarChart/SortSelect/index.d.ts +15 -0
- package/dist/BarChart/SortSelect/index.js +18 -0
- package/dist/BarChart/index.d.ts +4 -0
- package/dist/BarChart/index.js +136 -0
- package/dist/BarChart/layout/GridLines.d.ts +3 -0
- package/dist/BarChart/layout/GridLines.js +69 -0
- package/dist/BarChart/layout/LabelSpacer.d.ts +6 -0
- package/dist/BarChart/layout/LabelSpacer.js +56 -0
- package/dist/BarChart/layout/ScaleChartHeader.d.ts +3 -0
- package/dist/BarChart/layout/ScaleChartHeader.js +87 -0
- package/dist/BarChart/shared/elements.d.ts +7 -0
- package/dist/BarChart/shared/elements.js +12 -0
- package/dist/BarChart/shared/styles.d.ts +4 -0
- package/dist/BarChart/shared/styles.js +4 -0
- package/dist/BarChart/shared/translations.d.ts +69 -0
- package/dist/BarChart/shared/translations.js +57 -0
- package/dist/BarChart/shared/types.d.ts +100 -0
- package/dist/BarChart/shared/types.js +1 -0
- package/dist/BarChart/utils/hooks.d.ts +89 -0
- package/dist/BarChart/utils/hooks.js +281 -0
- package/dist/BarChart/utils/index.d.ts +56 -0
- package/dist/BarChart/utils/index.js +122 -0
- package/dist/Box/Box.d.ts +1 -1
- package/dist/Box/FlexBox.d.ts +1 -1
- package/dist/Box/GridBox.d.ts +1 -1
- package/dist/Box/props.d.ts +38 -7
- package/dist/Button/CTAButton.d.ts +2 -2
- package/dist/Button/FillButton.d.ts +4 -4
- package/dist/Button/IconButton.d.ts +4 -4
- package/dist/Button/StrokeButton.d.ts +4 -4
- package/dist/Button/TextButton.d.ts +4 -4
- package/dist/Button/shared/InlineIconButton.d.ts +2 -2
- package/dist/Button/shared/styles.d.ts +41 -10
- package/dist/ButtonBase/ButtonBase.d.ts +2 -2
- package/dist/Card/elements.d.ts +139 -43
- package/dist/ConnectedForm/ConnectedFormGroup.js +10 -4
- package/dist/ConnectedForm/utils.d.ts +3 -3
- package/dist/ContentContainer/index.d.ts +1 -1
- package/dist/Disclosure/elements.d.ts +13 -13
- package/dist/Form/SelectDropdown/styles.d.ts +1 -1
- package/dist/Form/elements/Form.d.ts +44 -13
- package/dist/Form/elements/FormGroup.d.ts +1 -1
- package/dist/Form/elements/FormGroupLabel.js +2 -2
- package/dist/Form/inputs/Select.js +6 -5
- package/dist/GridForm/GridFormButtons/index.d.ts +4 -4
- package/dist/GridForm/GridFormInputGroup/index.js +10 -4
- package/dist/GridForm/GridFormSections/GridFormSectionBreak.d.ts +38 -7
- package/dist/InternalFloatingCard/InternalFloatingCard.d.ts +39 -8
- package/dist/Layout/Column.d.ts +39 -8
- package/dist/Layout/LayoutGrid.d.ts +1 -1
- package/dist/List/elements.d.ts +92 -29
- package/dist/Markdown/index.js +7 -3
- package/dist/Markdown/libs/overrides/index.d.ts +8 -4
- package/dist/Markdown/libs/overrides/index.js +43 -24
- package/dist/Menu/Menu.d.ts +1 -1
- package/dist/Menu/elements.d.ts +42 -11
- package/dist/Pagination/AnimatedPaginationButtons.d.ts +47 -15
- package/dist/Pagination/EllipsisButton.d.ts +9 -9
- package/dist/Pagination/EllipsisButton.js +2 -2
- package/dist/Pagination/PaginationButton.d.ts +6 -6
- package/dist/Pagination/index.js +4 -4
- package/dist/Pagination/utils.d.ts +43 -11
- package/dist/Pagination/utils.js +1 -1
- package/dist/Popover/elements.d.ts +2 -2
- package/dist/PopoverContainer/PopoverContainer.js +31 -4
- package/dist/PopoverContainer/utils.d.ts +25 -1
- package/dist/PopoverContainer/utils.js +36 -5
- package/dist/Tabs/TabButton.d.ts +2 -2
- package/dist/Tabs/TabNav.d.ts +1 -1
- package/dist/Tabs/TabNavLink.d.ts +2 -2
- package/dist/Tabs/props.d.ts +38 -7
- package/dist/Tag/elements.d.ts +11 -11
- package/dist/Tag/types.d.ts +38 -7
- package/dist/Tip/InfoTip/InfoTipButton.d.ts +4 -4
- package/dist/Tip/InfoTip/styles.d.ts +1 -1
- package/dist/Tip/PreviewTip/elements.d.ts +6 -6
- package/dist/Tip/ToolTip/elements.d.ts +1 -1
- package/dist/Tip/shared/elements.d.ts +3 -3
- package/dist/Toggle/elements.d.ts +1 -1
- package/dist/Typography/Text.d.ts +40 -9
- package/dist/index.d.ts +1 -0
- package/dist/index.js +1 -0
- package/package.json +15 -12
- package/dist/typings/react-aria-tabpanel.d.ts +0 -7
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { BarChartTranslations } from './shared/translations';
|
|
3
|
+
import { BarChartStyles, MaxScaleValue } from './shared/types';
|
|
4
|
+
export interface BarChartContextProps {
|
|
5
|
+
maxScaleValue: MaxScaleValue;
|
|
6
|
+
scaleInterval: number;
|
|
7
|
+
unit: string;
|
|
8
|
+
styleConfig: Required<BarChartStyles>;
|
|
9
|
+
animate: boolean;
|
|
10
|
+
widestCategoryLabelWidth: number | null;
|
|
11
|
+
setWidestCategoryLabelWidth: (width: number) => void;
|
|
12
|
+
widestTotalValueLabelWidth: number | null;
|
|
13
|
+
setWidestTotalValueLabelWidth: (width: number) => void;
|
|
14
|
+
isMeasuring: boolean;
|
|
15
|
+
translations: BarChartTranslations;
|
|
16
|
+
}
|
|
17
|
+
export declare const defaultStyleConfig: Required<BarChartStyles>;
|
|
18
|
+
export declare const BarChartContext: import("react").Context<BarChartContextProps>;
|
|
19
|
+
export declare const BarChartProvider: import("react").Provider<BarChartContextProps>;
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { createContext } from 'react';
|
|
2
|
+
import { defaultBarChartTranslations } from './shared/translations';
|
|
3
|
+
export const defaultStyleConfig = {
|
|
4
|
+
textColor: 'text',
|
|
5
|
+
seriesOneBarColor: 'text',
|
|
6
|
+
seriesTwoBarColor: 'primary',
|
|
7
|
+
seriesOneLabel: 'text-secondary',
|
|
8
|
+
seriesTwoLabel: 'primary'
|
|
9
|
+
};
|
|
10
|
+
export const BarChartContext = /*#__PURE__*/createContext({
|
|
11
|
+
maxScaleValue: 100,
|
|
12
|
+
scaleInterval: 10,
|
|
13
|
+
unit: '',
|
|
14
|
+
styleConfig: defaultStyleConfig,
|
|
15
|
+
animate: false,
|
|
16
|
+
widestCategoryLabelWidth: null,
|
|
17
|
+
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
18
|
+
setWidestCategoryLabelWidth: () => {},
|
|
19
|
+
widestTotalValueLabelWidth: null,
|
|
20
|
+
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
21
|
+
setWidestTotalValueLabelWidth: () => {
|
|
22
|
+
// No-op: default context value
|
|
23
|
+
},
|
|
24
|
+
isMeasuring: true,
|
|
25
|
+
translations: defaultBarChartTranslations
|
|
26
|
+
});
|
|
27
|
+
export const BarChartProvider = BarChartContext.Provider;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { BarChartStyles } from '../shared/types';
|
|
2
|
+
export type ValueLabelsContentProps = {
|
|
3
|
+
seriesOneFormatted: string;
|
|
4
|
+
displayValueFormatted: string;
|
|
5
|
+
isStacked: boolean;
|
|
6
|
+
} & Pick<Required<BarChartStyles>, 'seriesOneLabel' | 'seriesTwoLabel'>;
|
|
7
|
+
export declare const ValueLabelsContent: ({ seriesOneFormatted, displayValueFormatted, isStacked, seriesOneLabel, seriesTwoLabel, }: ValueLabelsContentProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { MiniArrowRightIcon } from '@codecademy/gamut-icons';
|
|
2
|
+
import { Text } from '../../Typography';
|
|
3
|
+
import { iconPadding } from '../shared/styles';
|
|
4
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
5
|
+
const valueLabelProps = {
|
|
6
|
+
height: 'fit-content',
|
|
7
|
+
lineHeight: 'title',
|
|
8
|
+
variant: 'p-small',
|
|
9
|
+
whiteSpace: 'nowrap'
|
|
10
|
+
};
|
|
11
|
+
export const ValueLabelsContent = ({
|
|
12
|
+
seriesOneFormatted,
|
|
13
|
+
displayValueFormatted,
|
|
14
|
+
isStacked,
|
|
15
|
+
seriesOneLabel,
|
|
16
|
+
seriesTwoLabel
|
|
17
|
+
}) => /*#__PURE__*/_jsxs(_Fragment, {
|
|
18
|
+
children: [isStacked && /*#__PURE__*/_jsxs(_Fragment, {
|
|
19
|
+
children: [/*#__PURE__*/_jsx(Text, {
|
|
20
|
+
color: seriesOneLabel,
|
|
21
|
+
...valueLabelProps,
|
|
22
|
+
children: seriesOneFormatted
|
|
23
|
+
}), /*#__PURE__*/_jsx(MiniArrowRightIcon, {
|
|
24
|
+
color: seriesOneLabel,
|
|
25
|
+
mx: iconPadding,
|
|
26
|
+
size: 16
|
|
27
|
+
})]
|
|
28
|
+
}), /*#__PURE__*/_jsx(Text, {
|
|
29
|
+
color: isStacked ? seriesTwoLabel : seriesOneLabel,
|
|
30
|
+
fontWeight: isStacked ? 'bold' : 'normal',
|
|
31
|
+
...valueLabelProps,
|
|
32
|
+
children: displayValueFormatted
|
|
33
|
+
})]
|
|
34
|
+
});
|