@codecademy/gamut 68.1.1-alpha.762d22.0 → 68.1.1-alpha.796cf2.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/README.md +17 -0
- package/dist/AccordionAreaDeprecated/index.js +2 -2
- package/dist/Alert/elements.d.ts +14 -7
- package/dist/Alert/elements.js +5 -5
- package/dist/Anchor/index.d.ts +11 -7
- package/dist/Anchor/index.js +4 -3
- package/dist/Animation/ExpandInCollapseOut.js +1 -1
- package/dist/Animation/FadeInSlideOut.js +1 -1
- package/dist/Animation/Rotation.js +1 -1
- package/dist/Box/Box.d.ts +6 -2
- package/dist/Box/Box.js +5 -3
- package/dist/Box/FlexBox.d.ts +6 -2
- package/dist/Box/FlexBox.js +5 -3
- package/dist/Box/GridBox.d.ts +6 -2
- package/dist/Box/GridBox.js +5 -3
- package/dist/Box/props.d.ts +3 -3
- package/dist/Button/CTAButton.d.ts +8 -3
- package/dist/Button/FillButton.d.ts +17 -7
- package/dist/Button/IconButton.d.ts +17 -7
- package/dist/Button/StrokeButton.d.ts +17 -7
- package/dist/Button/TextButton.d.ts +17 -7
- package/dist/Button/shared/InlineIconButton.d.ts +9 -4
- package/dist/Button/shared/styles.d.ts +9 -4
- package/dist/Button/shared/types.d.ts +2 -1
- package/dist/ButtonBase/ButtonBase.d.ts +9 -3
- package/dist/ButtonBase/ButtonBase.js +2 -2
- package/dist/Card/elements.d.ts +119 -109
- package/dist/Card/styles.d.ts +8 -8
- package/dist/Card/types.d.ts +1 -1
- package/dist/Coachmark/index.d.ts +1 -1
- package/dist/ConnectedForm/ConnectedForm.d.ts +9 -1
- package/dist/ConnectedForm/ConnectedForm.js +9 -1
- package/dist/ConnectedForm/utils.d.ts +3 -6
- package/dist/ContentContainer/index.d.ts +4 -2
- package/dist/Disclosure/elements.d.ts +43 -22
- package/dist/Disclosure/index.js +1 -1
- package/dist/Drawer/index.js +2 -2
- package/dist/FeatureShimmer/index.js +2 -2
- package/dist/Form/SelectDropdown/SelectDropdown.js +1 -1
- package/dist/Form/SelectDropdown/styles.d.ts +1 -1
- package/dist/Form/SelectDropdown/types/internal.d.ts +1 -1
- package/dist/Form/elements/Form.d.ts +17 -17
- package/dist/Form/elements/Form.js +1 -1
- package/dist/Form/elements/FormError.d.ts +2 -2
- package/dist/Form/elements/FormError.js +1 -1
- package/dist/Form/elements/FormGroup.d.ts +5 -3
- package/dist/Form/elements/FormGroupLabel.js +2 -2
- package/dist/Form/inputs/Select.js +5 -6
- package/dist/GridForm/GridFormButtons/index.d.ts +17 -7
- package/dist/List/Header/ListHeaderCol.d.ts +3 -2
- package/dist/List/List.d.ts +2 -2
- package/dist/List/ListCol.d.ts +3 -2
- package/dist/List/ListProvider.d.ts +1 -1
- package/dist/List/ListRow.d.ts +2 -2
- package/dist/List/ListRow.js +3 -3
- package/dist/List/TableHeader.d.ts +3 -2
- package/dist/List/elements.d.ts +30 -933
- package/dist/List/elements.js +10 -8
- package/dist/Menu/elements.d.ts +2 -2
- package/dist/Modals/elements.d.ts +1 -1
- package/dist/Modals/types.d.ts +3 -2
- package/dist/Pagination/AnimatedPaginationButtons.d.ts +45 -36
- package/dist/Pagination/EllipsisButton.d.ts +18 -8
- package/dist/Pagination/PaginationButton.d.ts +25 -10
- package/dist/Pagination/utils.d.ts +36 -32
- package/dist/Pagination/utils.js +6 -10
- package/dist/Popover/elements.d.ts +8 -4
- package/dist/Popover/elements.js +6 -6
- package/dist/Popover/types.d.ts +2 -2
- package/dist/PopoverContainer/hooks.d.ts +2 -2
- package/dist/PopoverContainer/types.d.ts +1 -1
- package/dist/Tabs/TabButton.d.ts +8 -3
- package/dist/Tabs/TabNavLink.d.ts +9 -4
- package/dist/Tag/elements.d.ts +28 -20
- package/dist/Tip/InfoTip/InfoTipButton.d.ts +17 -7
- package/dist/Tip/InfoTip/styles.d.ts +4 -2
- package/dist/Tip/PreviewTip/elements.d.ts +12 -8
- package/dist/Tip/ToolTip/elements.d.ts +4 -2
- package/dist/Tip/__tests__/helpers.d.ts +1 -1
- package/dist/Tip/shared/FloatingTip.js +2 -2
- package/dist/Tip/shared/elements.d.ts +12 -6
- package/dist/Tip/shared/types.d.ts +2 -2
- package/dist/Toaster/index.js +1 -1
- package/dist/Toggle/elements.d.ts +4 -2
- package/dist/Typography/Text.d.ts +5 -7
- package/dist/Typography/Text.js +3 -1
- package/dist/index.d.ts +0 -1
- package/dist/index.js +0 -1
- package/dist/utils/index.d.ts +1 -1
- package/dist/utils/index.js +1 -1
- package/dist/utils/react.d.ts +1 -0
- package/dist/utils/react.js +4 -1
- package/dist/utils/types.d.ts +51 -1
- package/dist/utils/types.js +48 -1
- package/package.json +12 -11
- package/dist/BarChart/BarChartProvider.d.ts +0 -19
- package/dist/BarChart/BarChartProvider.js +0 -27
- package/dist/BarChart/BarRow/ValueLabelsContent.d.ts +0 -7
- package/dist/BarChart/BarRow/ValueLabelsContent.js +0 -34
- package/dist/BarChart/BarRow/elements.d.ts +0 -943
- package/dist/BarChart/BarRow/elements.js +0 -102
- package/dist/BarChart/BarRow/index.d.ts +0 -6
- package/dist/BarChart/BarRow/index.js +0 -234
- package/dist/BarChart/GENERIC_EXAMPLE.d.ts +0 -14
- package/dist/BarChart/GENERIC_EXAMPLE.js +0 -327
- package/dist/BarChart/SortSelect/index.d.ts +0 -15
- package/dist/BarChart/SortSelect/index.js +0 -18
- package/dist/BarChart/index.d.ts +0 -4
- package/dist/BarChart/index.js +0 -136
- package/dist/BarChart/layout/GridLines.d.ts +0 -3
- package/dist/BarChart/layout/GridLines.js +0 -69
- package/dist/BarChart/layout/LabelSpacer.d.ts +0 -6
- package/dist/BarChart/layout/LabelSpacer.js +0 -56
- package/dist/BarChart/layout/ScaleChartHeader.d.ts +0 -3
- package/dist/BarChart/layout/ScaleChartHeader.js +0 -87
- package/dist/BarChart/shared/elements.d.ts +0 -7
- package/dist/BarChart/shared/elements.js +0 -12
- package/dist/BarChart/shared/styles.d.ts +0 -4
- package/dist/BarChart/shared/styles.js +0 -4
- package/dist/BarChart/shared/translations.d.ts +0 -69
- package/dist/BarChart/shared/translations.js +0 -57
- package/dist/BarChart/shared/types.d.ts +0 -100
- package/dist/BarChart/shared/types.js +0 -1
- package/dist/BarChart/utils/hooks.d.ts +0 -89
- package/dist/BarChart/utils/hooks.js +0 -281
- package/dist/BarChart/utils/index.d.ts +0 -56
- package/dist/BarChart/utils/index.js +0 -122
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { StyleProps } from '@codecademy/variance';
|
|
3
|
+
import { OptionalScrollProps, WithOptionalScrollProps } from '../utils';
|
|
3
4
|
declare const displayVariants: (props: import("@codecademy/variance/dist/types/config").VariantProps<"variant", false | "title-xxl" | "title-xl" | "title-lg" | "title-md" | "title-sm" | "title-xs" | "p-base" | "p-small" | "p-large"> & {
|
|
4
5
|
theme?: import("@emotion/react").Theme | undefined;
|
|
5
6
|
}) => import("@codecademy/variance").CSSObject;
|
|
@@ -9,7 +10,7 @@ declare const elementVariants: (props: import("@codecademy/variance/dist/types/c
|
|
|
9
10
|
declare const truncateVariants: (props: import("@codecademy/variance/dist/types/config").VariantProps<"truncate", false | "ellipsis" | "fade"> & {
|
|
10
11
|
theme?: import("@emotion/react").Theme | undefined;
|
|
11
12
|
}) => import("@codecademy/variance").CSSObject;
|
|
12
|
-
declare const textStates: (props: Partial<Record<"center" | "block" | "
|
|
13
|
+
declare const textStates: (props: Partial<Record<"center" | "block" | "highlight" | "screenreader" | "smooth", boolean>> & {
|
|
13
14
|
theme?: import("@emotion/react").Theme | undefined;
|
|
14
15
|
}) => import("@codecademy/variance").CSSObject;
|
|
15
16
|
declare const textProps: import("@codecademy/variance/dist/types/config").Parser<import("@codecademy/variance/dist/types/config").Compose<[import("@codecademy/variance/dist/types/config").Parser<import("@codecademy/variance/dist/types/config").TransformerMap<{
|
|
@@ -366,7 +367,7 @@ declare const textProps: import("@codecademy/variance/dist/types/config").Parser
|
|
|
366
367
|
};
|
|
367
368
|
};
|
|
368
369
|
}>>]>>;
|
|
369
|
-
export interface BaseTextProps extends StyleProps<typeof textProps>, StyleProps<typeof textStates>, StyleProps<typeof elementVariants>, StyleProps<typeof truncateVariants>, StyleProps<typeof displayVariants
|
|
370
|
+
export interface BaseTextProps extends StyleProps<typeof textProps>, StyleProps<typeof textStates>, StyleProps<typeof elementVariants>, StyleProps<typeof truncateVariants>, StyleProps<typeof displayVariants>, OptionalScrollProps {
|
|
370
371
|
}
|
|
371
372
|
export interface TextTruncateProps extends BaseTextProps {
|
|
372
373
|
truncateLines: Exclude<BaseTextProps['truncateLines'], undefined>;
|
|
@@ -377,11 +378,8 @@ export interface TextNoTruncateProps extends BaseTextProps {
|
|
|
377
378
|
truncate?: never;
|
|
378
379
|
}
|
|
379
380
|
export type TextProps = TextTruncateProps | TextNoTruncateProps;
|
|
380
|
-
export declare const Text: import("react").ForwardRefExoticComponent<
|
|
381
|
+
export declare const Text: import("react").ForwardRefExoticComponent<Omit<WithOptionalScrollProps<({
|
|
381
382
|
theme?: import("@emotion/react").Theme | undefined;
|
|
382
383
|
as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
|
|
383
|
-
} &
|
|
384
|
-
theme?: import("@emotion/react").Theme | undefined;
|
|
385
|
-
as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
|
|
386
|
-
} & TextNoTruncateProps & Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "slot" | "style" | "title" | "dir" | "children" | "className" | "aria-hidden" | "onAnimationStart" | "onDragStart" | "onDragEnd" | "onDrag" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "contentEditable" | "contextMenu" | "draggable" | "enterKeyHint" | "hidden" | "id" | "lang" | "nonce" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "content" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "exportparts" | "part" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDragCapture" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | keyof import("react").ClassAttributes<HTMLSpanElement>>, "ref">) & import("react").RefAttributes<HTMLSpanElement>>;
|
|
384
|
+
} & TextProps) & Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "slot" | "style" | "title" | "dir" | "children" | "className" | "aria-hidden" | "onAnimationStart" | "onDragStart" | "onDragEnd" | "onDrag" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "contentEditable" | "contextMenu" | "draggable" | "enterKeyHint" | "hidden" | "id" | "lang" | "nonce" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "content" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "exportparts" | "part" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDragCapture" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | keyof import("react").ClassAttributes<HTMLSpanElement>>>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
|
|
387
385
|
export {};
|
package/dist/Typography/Text.js
CHANGED
|
@@ -105,12 +105,14 @@ const textStates = states({
|
|
|
105
105
|
});
|
|
106
106
|
const textProps = variance.compose(system.layout, system.typography, system.color, system.space, truncateLinesProps);
|
|
107
107
|
|
|
108
|
+
// CASSIE, come back to this
|
|
109
|
+
|
|
108
110
|
// if you're going to truncate, you need to provide both of these props or neither
|
|
109
111
|
|
|
110
112
|
const StyledText = /*#__PURE__*/_styled('span', _extends({}, {
|
|
111
113
|
target: "e8i0p5k0",
|
|
112
114
|
label: "StyledText"
|
|
113
|
-
}, styledOptions()))(elementVariants, truncateVariants, displayVariants, textStates, textProps, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
115
|
+
}, styledOptions()))(elementVariants, truncateVariants, displayVariants, textStates, textProps, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9UeXBvZ3JhcGh5L1RleHQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWdKbUIiLCJmaWxlIjoiLi4vLi4vc3JjL1R5cG9ncmFwaHkvVGV4dC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBzdGF0ZXMsXG4gIHN0eWxlZE9wdGlvbnMsXG4gIHN5c3RlbSxcbiAgdmFyaWFudCxcbn0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtc3R5bGVzJztcbmltcG9ydCB7IFN0eWxlUHJvcHMsIHZhcmlhbmNlIH0gZnJvbSAnQGNvZGVjYWRlbXkvdmFyaWFuY2UnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgQ29tcG9uZW50UHJvcHMsIGZvcndhcmRSZWYgfSBmcm9tICdyZWFjdCc7XG5cbmltcG9ydCB7IE9wdGlvbmFsU2Nyb2xsUHJvcHMsIFdpdGhPcHRpb25hbFNjcm9sbFByb3BzIH0gZnJvbSAnLi4vdXRpbHMnO1xuaW1wb3J0IHsgdHlwb2dyYXBoeUVsZW1lbnRWYXJpYW50cywgdHlwb2dyYXBoeVN0eWxlVmFyaWFudHMgfSBmcm9tICcuL3ZhcmlhbnRzJztcblxuY29uc3QgZGlzcGxheVZhcmlhbnRzID0gdmFyaWFudCh7XG4gIHZhcmlhbnRzOiB0eXBvZ3JhcGh5U3R5bGVWYXJpYW50cyxcbn0pO1xuXG5jb25zdCBlbGVtZW50VmFyaWFudHMgPSB2YXJpYW50KHtcbiAgcHJvcDogJ2FzJyxcbiAgdmFyaWFudHM6IHR5cG9ncmFwaHlFbGVtZW50VmFyaWFudHMsXG59KTtcblxuY29uc3QgdHJ1bmNhdGVWYXJpYW50cyA9IHZhcmlhbnQoe1xuICBwcm9wOiAndHJ1bmNhdGUnLFxuICB2YXJpYW50czoge1xuICAgIGVsbGlwc2lzOiB7XG4gICAgICB0ZXh0T3ZlcmZsb3c6ICdlbGxpcHNpcycsXG4gICAgfSxcbiAgICBmYWRlOiB7XG4gICAgICBwb3NpdGlvbjogJ3JlbGF0aXZlJyxcbiAgICAgIHRleHRPdmVyZmxvdzogJ2NsaXAnLFxuICAgICAgJyY6YWZ0ZXInOiB7XG4gICAgICAgIGNvbnRlbnQ6ICdcIlwiJyxcbiAgICAgICAgcG9zaXRpb246ICdhYnNvbHV0ZScsXG4gICAgICAgIHRleHRDb2xvcjogJ2JhY2tncm91bmQtY3VycmVudCcsXG4gICAgICAgIGluc2V0OiAwLFxuICAgICAgICBsZWZ0OiAwLjY1LFxuICAgICAgICBiYWNrZ3JvdW5kOlxuICAgICAgICAgICdsaW5lYXItZ3JhZGllbnQodG8gcmlnaHQsIHJnYmEoMCwgMCwgMCwgMCksIGN1cnJlbnRDb2xvciA3NSUpJyxcbiAgICAgIH0sXG4gICAgfSxcbiAgfSxcbn0pO1xuXG5jb25zdCB0cnVuY2F0ZUxpbmVzU2NhbGUgPSB7IDE6IDEsIDI6IDIsIDM6IDMsIDQ6IDQsIDU6IDUgfTtcblxuY29uc3QgdHJ1bmNhdGVMaW5lc1Byb3BzID0gdmFyaWFuY2UuY3JlYXRlKHtcbiAgdHJ1bmNhdGVMaW5lczoge1xuICAgIHNjYWxlOiB0cnVuY2F0ZUxpbmVzU2NhbGUsXG4gICAgcHJvcGVydHk6ICdhbGwnLFxuICAgIHRyYW5zZm9ybTogKHRydW5jYXRlTGluZXM6IG51bWJlcikgPT5cbiAgICAgIHRydW5jYXRlTGluZXMgPT09IDFcbiAgICAgICAgPyB7XG4gICAgICAgICAgICBvdmVyZmxvdzogJ2hpZGRlbicsXG4gICAgICAgICAgICB3aGl0ZVNwYWNlOiAnbm93cmFwJyxcbiAgICAgICAgICB9XG4gICAgICAgIDoge1xuICAgICAgICAgICAgb3ZlcmZsb3c6ICdoaWRkZW4nLFxuICAgICAgICAgICAgZGlzcGxheTogJy13ZWJraXQtYm94JyxcbiAgICAgICAgICAgIFdlYmtpdEJveE9yaWVudDogJ3ZlcnRpY2FsJyxcbiAgICAgICAgICAgIFdlYmtpdExpbmVDbGFtcDogdHJ1bmNhdGVMaW5lcyxcbiAgICAgICAgICAgICcmOmFmdGVyJzoge1xuICAgICAgICAgICAgICB0b3A6IGAkezEwMCAtIDEwMCAvIHRydW5jYXRlTGluZXN9JWAsXG4gICAgICAgICAgICB9LFxuICAgICAgICAgIH0sXG4gIH0sXG59KTtcblxuY29uc3QgdGV4dFN0YXRlcyA9IHN0YXRlcyh7XG4gIGNlbnRlcjoge1xuICAgIHRleHRBbGlnbjogJ2NlbnRlcicsXG4gIH0sXG4gIGJsb2NrOiB7XG4gICAgZGlzcGxheTogJ2Jsb2NrJyxcbiAgfSxcbiAgaGlnaGxpZ2h0OiB7XG4gICAgZm9udFdlaWdodDogJ2JvbGQnLFxuICAgIG1pbldpZHRoOiAnMC40cmVtJyxcbiAgICBwb3NpdGlvbjogJ3JlbGF0aXZlJyxcbiAgICB6SW5kZXg6IDEsXG4gICAgLy8gdGhlIHRleHQgaXMgbW9yZSBsZWdpYmxlIGFnYWluc3QgdGhlIGJhY2tncm91bmQgY29sb3Igd2l0aCB0ZXh0IHNtb290aGluZ1xuICAgIE1vek9zeEZvbnRTbW9vdGhpbmc6ICdncmF5c2NhbGUnLFxuICAgIFdlYmtpdEZvbnRTbW9vdGhpbmc6ICdhbnRpYWxpYXNlZCcsXG4gICAgJyY6YWZ0ZXInOiB7XG4gICAgICBiZzogJ3ByaW1hcnktaW52ZXJzZScsXG4gICAgICBjb250ZW50OiAnXCJcIicsXG4gICAgICBkaXNwbGF5OiAnYmxvY2snLFxuICAgICAgaGVpZ2h0OiAnMzIuNSUnLFxuICAgICAgbGVmdDogJzAnLFxuICAgICAgbWw6ICctMC4ycmVtJyBhcyBhbnksXG4gICAgICBwb3NpdGlvbjogJ2Fic29sdXRlJyxcbiAgICAgIHRvcDogJzUwJScsXG4gICAgICB3aWR0aDogJ2NhbGMoMTAwJSArIDAuNHJlbSknLFxuICAgICAgekluZGV4OiAtMSxcbiAgICB9LFxuICB9LFxuICBzY3JlZW5yZWFkZXI6IHtcbiAgICBkaXNwbGF5OiAnaW5saW5lLWJsb2NrJyxcbiAgICBoZWlnaHQ6ICcxcHgnLFxuICAgIHdpZHRoOiAnMXB4JyxcbiAgICB3aGl0ZVNwYWNlOiAnbm93cmFwJyxcbiAgICBvdmVyZmxvdzogJ2hpZGRlbicsXG4gICAgcG9zaXRpb246ICdhYnNvbHV0ZScsXG4gICAgY29sb3I6ICd0cmFuc3BhcmVudCcsXG4gICAgbGVmdDogLTk5OTksXG4gICAgcDogMCxcbiAgICBtOiAwLFxuICAgIGJvcmRlcjogJ25vbmUnLFxuICB9LFxuICBzbW9vdGg6IHtcbiAgICBXZWJraXRGb250U21vb3RoaW5nOiAnYW50aWFsaWFzZWQnLFxuICAgIE1vek9zeEZvbnRTbW9vdGhpbmc6ICdncmF5c2NhbGUnLFxuICB9LFxufSk7XG5cbmNvbnN0IHRleHRQcm9wcyA9IHZhcmlhbmNlLmNvbXBvc2UoXG4gIHN5c3RlbS5sYXlvdXQsXG4gIHN5c3RlbS50eXBvZ3JhcGh5LFxuICBzeXN0ZW0uY29sb3IsXG4gIHN5c3RlbS5zcGFjZSxcbiAgdHJ1bmNhdGVMaW5lc1Byb3BzXG4pO1xuXG4vLyBDQVNTSUUsIGNvbWUgYmFjayB0byB0aGlzXG5leHBvcnQgaW50ZXJmYWNlIEJhc2VUZXh0UHJvcHNcbiAgZXh0ZW5kcyBTdHlsZVByb3BzPHR5cGVvZiB0ZXh0UHJvcHM+LFxuICAgIFN0eWxlUHJvcHM8dHlwZW9mIHRleHRTdGF0ZXM+LFxuICAgIFN0eWxlUHJvcHM8dHlwZW9mIGVsZW1lbnRWYXJpYW50cz4sXG4gICAgU3R5bGVQcm9wczx0eXBlb2YgdHJ1bmNhdGVWYXJpYW50cz4sXG4gICAgU3R5bGVQcm9wczx0eXBlb2YgZGlzcGxheVZhcmlhbnRzPixcbiAgICBPcHRpb25hbFNjcm9sbFByb3BzIHt9XG5cbi8vIGlmIHlvdSdyZSBnb2luZyB0byB0cnVuY2F0ZSwgeW91IG5lZWQgdG8gcHJvdmlkZSBib3RoIG9mIHRoZXNlIHByb3BzIG9yIG5laXRoZXJcbmV4cG9ydCBpbnRlcmZhY2UgVGV4dFRydW5jYXRlUHJvcHMgZXh0ZW5kcyBCYXNlVGV4dFByb3BzIHtcbiAgdHJ1bmNhdGVMaW5lczogRXhjbHVkZTxCYXNlVGV4dFByb3BzWyd0cnVuY2F0ZUxpbmVzJ10sIHVuZGVmaW5lZD47XG4gIHRydW5jYXRlOiBFeGNsdWRlPEJhc2VUZXh0UHJvcHNbJ3RydW5jYXRlJ10sIGZhbHNlIHwgdW5kZWZpbmVkPjtcbn1cbmV4cG9ydCBpbnRlcmZhY2UgVGV4dE5vVHJ1bmNhdGVQcm9wcyBleHRlbmRzIEJhc2VUZXh0UHJvcHMge1xuICB0cnVuY2F0ZUxpbmVzPzogbmV2ZXI7XG4gIHRydW5jYXRlPzogbmV2ZXI7XG59XG5cbmV4cG9ydCB0eXBlIFRleHRQcm9wcyA9IFRleHRUcnVuY2F0ZVByb3BzIHwgVGV4dE5vVHJ1bmNhdGVQcm9wcztcblxuY29uc3QgU3R5bGVkVGV4dCA9IHN0eWxlZCgnc3BhbicsIHN0eWxlZE9wdGlvbnM8J3NwYW4nPigpKTxUZXh0UHJvcHM+KFxuICBlbGVtZW50VmFyaWFudHMsXG4gIHRydW5jYXRlVmFyaWFudHMsXG4gIGRpc3BsYXlWYXJpYW50cyxcbiAgdGV4dFN0YXRlcyxcbiAgdGV4dFByb3BzXG4pO1xuXG5leHBvcnQgY29uc3QgVGV4dCA9IGZvcndhcmRSZWY8XG4gIEhUTUxTcGFuRWxlbWVudCxcbiAgV2l0aE9wdGlvbmFsU2Nyb2xsUHJvcHM8Q29tcG9uZW50UHJvcHM8dHlwZW9mIFN0eWxlZFRleHQ+PlxuPigoeyBhcyA9ICdzcGFuJywgbSA9IDAsIC4uLnJlc3QgfSwgcmVmKSA9PiAoXG4gIDxTdHlsZWRUZXh0XG4gICAgYXM9e2FzfVxuICAgIG09e219XG4gICAgcmVmPXtyZWZ9XG4gICAgey4uLihyZXN0IGFzIENvbXBvbmVudFByb3BzPHR5cGVvZiBTdHlsZWRUZXh0Pil9XG4gIC8+XG4pKTtcbiJdfQ== */");
|
|
114
116
|
export const Text = /*#__PURE__*/forwardRef(({
|
|
115
117
|
as = 'span',
|
|
116
118
|
m = 0,
|
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
package/dist/utils/index.d.ts
CHANGED
|
@@ -3,4 +3,4 @@ export * from './focus';
|
|
|
3
3
|
export * from './generateResponsiveClassnames';
|
|
4
4
|
export * from './omitProps';
|
|
5
5
|
export * from './useIsMounted';
|
|
6
|
-
export
|
|
6
|
+
export { CompatibleComponentProps, IconComponentType, OptionalScrollProps, WithChildrenProp, WithOptionalScrollProps, } from './types';
|
package/dist/utils/index.js
CHANGED
|
@@ -3,4 +3,4 @@ export * from './focus';
|
|
|
3
3
|
export * from './generateResponsiveClassnames';
|
|
4
4
|
export * from './omitProps';
|
|
5
5
|
export * from './useIsMounted';
|
|
6
|
-
export
|
|
6
|
+
export { CompatibleComponentProps, IconComponentType, OptionalScrollProps, WithChildrenProp, WithOptionalScrollProps } from './types';
|
package/dist/utils/react.d.ts
CHANGED
package/dist/utils/react.js
CHANGED
|
@@ -33,7 +33,10 @@ export const extractTextContent = children => {
|
|
|
33
33
|
return '';
|
|
34
34
|
}
|
|
35
35
|
if (/*#__PURE__*/isValidElement(child)) {
|
|
36
|
-
const
|
|
36
|
+
const {
|
|
37
|
+
props
|
|
38
|
+
} = child;
|
|
39
|
+
const textContent = props.children ?? props.text ?? '';
|
|
37
40
|
return extractTextContent(textContent);
|
|
38
41
|
}
|
|
39
42
|
return '';
|
package/dist/utils/types.d.ts
CHANGED
|
@@ -1,8 +1,58 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { GamutIconProps } from '@codecademy/gamut-icons';
|
|
2
|
+
import type { ComponentProps, ElementType } from 'react';
|
|
3
3
|
export interface WithChildrenProp {
|
|
4
4
|
children?: React.ReactNode | React.ReactNode[];
|
|
5
5
|
}
|
|
6
6
|
export type IconComponentType = {
|
|
7
7
|
icon: React.ComponentType<GamutIconProps>;
|
|
8
8
|
};
|
|
9
|
+
/**
|
|
10
|
+
* Optional scroll event handlers (React 19+).
|
|
11
|
+
* Explicitly optional so consumers on React 18 don't get type errors
|
|
12
|
+
* when Gamut is built with React 19 types.
|
|
13
|
+
*/
|
|
14
|
+
export interface OptionalScrollProps {
|
|
15
|
+
onScrollEnd?: (event: React.UIEvent<HTMLElement>) => void;
|
|
16
|
+
onScrollEndCapture?: (event: React.UIEvent<HTMLElement>) => void;
|
|
17
|
+
}
|
|
18
|
+
/** Makes onScrollEnd/onScrollEndCapture optional when merging with React 19 DOM types. */
|
|
19
|
+
export type WithOptionalScrollProps<T> = Omit<T, 'onScrollEnd' | 'onScrollEndCapture'> & OptionalScrollProps;
|
|
20
|
+
/**
|
|
21
|
+
* Component props compatible with React 18 consumers when Gamut is built with React 19 types.
|
|
22
|
+
* Use instead of ComponentProps for DOM-based components so onScrollEnd/onScrollEndCapture
|
|
23
|
+
* stay optional. Downstream types that extend or reference these props get the same compatibility.
|
|
24
|
+
*/
|
|
25
|
+
export type CompatibleComponentProps<T extends ElementType> = WithOptionalScrollProps<ComponentProps<T>>;
|
|
26
|
+
/**
|
|
27
|
+
* Ref type for component ref props. Accepts React's LegacyRef so consumers can pass
|
|
28
|
+
* refs without type errors (useRef, callback refs, or legacy string refs). Use when
|
|
29
|
+
* declaring ref props (e.g. on Box).
|
|
30
|
+
*/
|
|
31
|
+
export type CompatibleRef<T> = React.LegacyRef<T> | null;
|
|
32
|
+
/**
|
|
33
|
+
* RefAttributes with ref typed as CompatibleRef so React 18 consumers can pass
|
|
34
|
+
* useRef<Element | null>(null) without type errors. Use with ForwardRefExoticComponent.
|
|
35
|
+
*/
|
|
36
|
+
export type CompatibleRefAttributes<R> = Omit<React.RefAttributes<R>, 'ref'> & {
|
|
37
|
+
ref?: CompatibleRef<R>;
|
|
38
|
+
};
|
|
39
|
+
/**
|
|
40
|
+
* Props type for a styled layout/DOM component with React 18–compatible scroll and ref.
|
|
41
|
+
* Use with asCompatibleForwardRefComponent so call sites don’t need casts.
|
|
42
|
+
*/
|
|
43
|
+
export type CompatibleStyledComponentProps<C extends React.ComponentType<unknown>, R extends HTMLElement> = WithOptionalScrollProps<React.ComponentProps<C>> & CompatibleRefAttributes<R>;
|
|
44
|
+
/**
|
|
45
|
+
* Treats a styled component (Emotion StyledComponent) as a ForwardRefExoticComponent
|
|
46
|
+
* with compatible props. Emotion’s type doesn’t extend React’s ForwardRefExoticComponent,
|
|
47
|
+
* so this centralizes the type assertion instead of repeating it in each file.
|
|
48
|
+
* Parameter accepts ComponentType<unknown> so Emotion's StyledComponent (ref: LegacyRef) is accepted.
|
|
49
|
+
*/
|
|
50
|
+
export declare function asCompatibleForwardRefComponent<P extends CompatibleRefAttributes<HTMLElement>>(component: React.ComponentType<P> | React.ComponentType<unknown>): React.ForwardRefExoticComponent<P>;
|
|
51
|
+
/**
|
|
52
|
+
* Like asCompatibleForwardRefComponent but also preserves the Emotion StyledComponent
|
|
53
|
+
* `withComponent` method on the return type so consumers can use Box.withComponent('span').
|
|
54
|
+
* C is inferred from the component argument so only P is passed at the call site.
|
|
55
|
+
*/
|
|
56
|
+
export declare function asCompatibleForwardRefComponentWithStyled<P extends CompatibleRefAttributes<HTMLElement>, C extends React.ComponentType<unknown> & {
|
|
57
|
+
withComponent?: unknown;
|
|
58
|
+
}>(component: C): React.ForwardRefExoticComponent<P> & Pick<C, 'withComponent'>;
|
package/dist/utils/types.js
CHANGED
|
@@ -1 +1,48 @@
|
|
|
1
|
-
|
|
1
|
+
/**
|
|
2
|
+
* Optional scroll event handlers (React 19+).
|
|
3
|
+
* Explicitly optional so consumers on React 18 don't get type errors
|
|
4
|
+
* when Gamut is built with React 19 types.
|
|
5
|
+
*/
|
|
6
|
+
|
|
7
|
+
/** Makes onScrollEnd/onScrollEndCapture optional when merging with React 19 DOM types. */
|
|
8
|
+
|
|
9
|
+
/**
|
|
10
|
+
* Component props compatible with React 18 consumers when Gamut is built with React 19 types.
|
|
11
|
+
* Use instead of ComponentProps for DOM-based components so onScrollEnd/onScrollEndCapture
|
|
12
|
+
* stay optional. Downstream types that extend or reference these props get the same compatibility.
|
|
13
|
+
*/
|
|
14
|
+
|
|
15
|
+
/**
|
|
16
|
+
* Ref type for component ref props. Accepts React's LegacyRef so consumers can pass
|
|
17
|
+
* refs without type errors (useRef, callback refs, or legacy string refs). Use when
|
|
18
|
+
* declaring ref props (e.g. on Box).
|
|
19
|
+
*/
|
|
20
|
+
|
|
21
|
+
/**
|
|
22
|
+
* RefAttributes with ref typed as CompatibleRef so React 18 consumers can pass
|
|
23
|
+
* useRef<Element | null>(null) without type errors. Use with ForwardRefExoticComponent.
|
|
24
|
+
*/
|
|
25
|
+
|
|
26
|
+
/**
|
|
27
|
+
* Props type for a styled layout/DOM component with React 18–compatible scroll and ref.
|
|
28
|
+
* Use with asCompatibleForwardRefComponent so call sites don’t need casts.
|
|
29
|
+
*/
|
|
30
|
+
|
|
31
|
+
/**
|
|
32
|
+
* Treats a styled component (Emotion StyledComponent) as a ForwardRefExoticComponent
|
|
33
|
+
* with compatible props. Emotion’s type doesn’t extend React’s ForwardRefExoticComponent,
|
|
34
|
+
* so this centralizes the type assertion instead of repeating it in each file.
|
|
35
|
+
* Parameter accepts ComponentType<unknown> so Emotion's StyledComponent (ref: LegacyRef) is accepted.
|
|
36
|
+
*/
|
|
37
|
+
export function asCompatibleForwardRefComponent(component) {
|
|
38
|
+
return component;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
/**
|
|
42
|
+
* Like asCompatibleForwardRefComponent but also preserves the Emotion StyledComponent
|
|
43
|
+
* `withComponent` method on the return type so consumers can use Box.withComponent('span').
|
|
44
|
+
* C is inferred from the component argument so only P is passed at the call site.
|
|
45
|
+
*/
|
|
46
|
+
export function asCompatibleForwardRefComponentWithStyled(component) {
|
|
47
|
+
return component;
|
|
48
|
+
}
|
package/package.json
CHANGED
|
@@ -1,23 +1,23 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@codecademy/gamut",
|
|
3
3
|
"description": "Styleguide & Component library for Codecademy",
|
|
4
|
-
"version": "68.1.1-alpha.
|
|
4
|
+
"version": "68.1.1-alpha.796cf2.0",
|
|
5
5
|
"author": "Codecademy Engineering <dev@codecademy.com>",
|
|
6
6
|
"dependencies": {
|
|
7
|
-
"@codecademy/gamut-icons": "9.56.4-alpha.
|
|
8
|
-
"@codecademy/gamut-illustrations": "0.58.7-alpha.
|
|
9
|
-
"@codecademy/gamut-patterns": "0.10.26-alpha.
|
|
10
|
-
"@codecademy/gamut-styles": "17.12.1-alpha.
|
|
11
|
-
"@codecademy/variance": "0.26.0",
|
|
7
|
+
"@codecademy/gamut-icons": "9.56.4-alpha.796cf2.0",
|
|
8
|
+
"@codecademy/gamut-illustrations": "0.58.7-alpha.796cf2.0",
|
|
9
|
+
"@codecademy/gamut-patterns": "0.10.26-alpha.796cf2.0",
|
|
10
|
+
"@codecademy/gamut-styles": "17.12.1-alpha.796cf2.0",
|
|
11
|
+
"@codecademy/variance": "0.26.1-alpha.796cf2.0",
|
|
12
12
|
"@react-aria/interactions": "3.25.0",
|
|
13
13
|
"@types/marked": "^4.0.8",
|
|
14
14
|
"@vidstack/react": "^1.12.12",
|
|
15
15
|
"classnames": "^2.2.5",
|
|
16
|
-
"framer-motion": "^11.18.0",
|
|
17
16
|
"html-to-react": "^1.6.0",
|
|
18
17
|
"invariant": "^2.2.4",
|
|
19
18
|
"lodash": "^4.17.23",
|
|
20
19
|
"marked": "^4.3.0",
|
|
20
|
+
"motion": "^12.0.0",
|
|
21
21
|
"polished": "^4.1.2",
|
|
22
22
|
"react-aria-components": "1.7.1",
|
|
23
23
|
"react-focus-on": "3.10.0",
|
|
@@ -40,8 +40,8 @@
|
|
|
40
40
|
"peerDependencies": {
|
|
41
41
|
"@emotion/react": "^11.4.0",
|
|
42
42
|
"@emotion/styled": "^11.3.0",
|
|
43
|
-
"react": "^
|
|
44
|
-
"react-dom": "^
|
|
43
|
+
"react": "^18.3.0 || ^19.0.0",
|
|
44
|
+
"react-dom": "^18.3.0 || ^19.0.0"
|
|
45
45
|
},
|
|
46
46
|
"publishConfig": {
|
|
47
47
|
"access": "public"
|
|
@@ -51,7 +51,8 @@
|
|
|
51
51
|
"build": "nx build @codecademy/gamut",
|
|
52
52
|
"build:watch": "yarn build && onchange ./src -- yarn build",
|
|
53
53
|
"compile": "babel ./src --out-dir ./dist --extensions \".ts,.tsx\"",
|
|
54
|
-
"verify": "tsc --noEmit"
|
|
54
|
+
"verify": "tsc --noEmit",
|
|
55
|
+
"verify:react19": "tsc --noEmit"
|
|
55
56
|
},
|
|
56
57
|
"sideEffects": [
|
|
57
58
|
"**/*.css",
|
|
@@ -59,5 +60,5 @@
|
|
|
59
60
|
"dist/**/[A-Z]**/[A-Z]*.js",
|
|
60
61
|
"dist/**/[A-Z]**/index.js"
|
|
61
62
|
],
|
|
62
|
-
"gitHead": "
|
|
63
|
+
"gitHead": "61bad8181990a6394c8afc5f7a92b745ee25b679"
|
|
63
64
|
}
|
|
@@ -1,19 +0,0 @@
|
|
|
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>;
|
|
@@ -1,27 +0,0 @@
|
|
|
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;
|
|
@@ -1,7 +0,0 @@
|
|
|
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;
|
|
@@ -1,34 +0,0 @@
|
|
|
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
|
-
});
|