@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.
Files changed (127) hide show
  1. package/README.md +17 -0
  2. package/dist/AccordionAreaDeprecated/index.js +2 -2
  3. package/dist/Alert/elements.d.ts +14 -7
  4. package/dist/Alert/elements.js +5 -5
  5. package/dist/Anchor/index.d.ts +11 -7
  6. package/dist/Anchor/index.js +4 -3
  7. package/dist/Animation/ExpandInCollapseOut.js +1 -1
  8. package/dist/Animation/FadeInSlideOut.js +1 -1
  9. package/dist/Animation/Rotation.js +1 -1
  10. package/dist/Box/Box.d.ts +6 -2
  11. package/dist/Box/Box.js +5 -3
  12. package/dist/Box/FlexBox.d.ts +6 -2
  13. package/dist/Box/FlexBox.js +5 -3
  14. package/dist/Box/GridBox.d.ts +6 -2
  15. package/dist/Box/GridBox.js +5 -3
  16. package/dist/Box/props.d.ts +3 -3
  17. package/dist/Button/CTAButton.d.ts +8 -3
  18. package/dist/Button/FillButton.d.ts +17 -7
  19. package/dist/Button/IconButton.d.ts +17 -7
  20. package/dist/Button/StrokeButton.d.ts +17 -7
  21. package/dist/Button/TextButton.d.ts +17 -7
  22. package/dist/Button/shared/InlineIconButton.d.ts +9 -4
  23. package/dist/Button/shared/styles.d.ts +9 -4
  24. package/dist/Button/shared/types.d.ts +2 -1
  25. package/dist/ButtonBase/ButtonBase.d.ts +9 -3
  26. package/dist/ButtonBase/ButtonBase.js +2 -2
  27. package/dist/Card/elements.d.ts +119 -109
  28. package/dist/Card/styles.d.ts +8 -8
  29. package/dist/Card/types.d.ts +1 -1
  30. package/dist/Coachmark/index.d.ts +1 -1
  31. package/dist/ConnectedForm/ConnectedForm.d.ts +9 -1
  32. package/dist/ConnectedForm/ConnectedForm.js +9 -1
  33. package/dist/ConnectedForm/utils.d.ts +3 -6
  34. package/dist/ContentContainer/index.d.ts +4 -2
  35. package/dist/Disclosure/elements.d.ts +43 -22
  36. package/dist/Disclosure/index.js +1 -1
  37. package/dist/Drawer/index.js +2 -2
  38. package/dist/FeatureShimmer/index.js +2 -2
  39. package/dist/Form/SelectDropdown/SelectDropdown.js +1 -1
  40. package/dist/Form/SelectDropdown/styles.d.ts +1 -1
  41. package/dist/Form/SelectDropdown/types/internal.d.ts +1 -1
  42. package/dist/Form/elements/Form.d.ts +17 -17
  43. package/dist/Form/elements/Form.js +1 -1
  44. package/dist/Form/elements/FormError.d.ts +2 -2
  45. package/dist/Form/elements/FormError.js +1 -1
  46. package/dist/Form/elements/FormGroup.d.ts +5 -3
  47. package/dist/Form/elements/FormGroupLabel.js +2 -2
  48. package/dist/Form/inputs/Select.js +5 -6
  49. package/dist/GridForm/GridFormButtons/index.d.ts +17 -7
  50. package/dist/List/Header/ListHeaderCol.d.ts +3 -2
  51. package/dist/List/List.d.ts +2 -2
  52. package/dist/List/ListCol.d.ts +3 -2
  53. package/dist/List/ListProvider.d.ts +1 -1
  54. package/dist/List/ListRow.d.ts +2 -2
  55. package/dist/List/ListRow.js +3 -3
  56. package/dist/List/TableHeader.d.ts +3 -2
  57. package/dist/List/elements.d.ts +30 -933
  58. package/dist/List/elements.js +10 -8
  59. package/dist/Menu/elements.d.ts +2 -2
  60. package/dist/Modals/elements.d.ts +1 -1
  61. package/dist/Modals/types.d.ts +3 -2
  62. package/dist/Pagination/AnimatedPaginationButtons.d.ts +45 -36
  63. package/dist/Pagination/EllipsisButton.d.ts +18 -8
  64. package/dist/Pagination/PaginationButton.d.ts +25 -10
  65. package/dist/Pagination/utils.d.ts +36 -32
  66. package/dist/Pagination/utils.js +6 -10
  67. package/dist/Popover/elements.d.ts +8 -4
  68. package/dist/Popover/elements.js +6 -6
  69. package/dist/Popover/types.d.ts +2 -2
  70. package/dist/PopoverContainer/hooks.d.ts +2 -2
  71. package/dist/PopoverContainer/types.d.ts +1 -1
  72. package/dist/Tabs/TabButton.d.ts +8 -3
  73. package/dist/Tabs/TabNavLink.d.ts +9 -4
  74. package/dist/Tag/elements.d.ts +28 -20
  75. package/dist/Tip/InfoTip/InfoTipButton.d.ts +17 -7
  76. package/dist/Tip/InfoTip/styles.d.ts +4 -2
  77. package/dist/Tip/PreviewTip/elements.d.ts +12 -8
  78. package/dist/Tip/ToolTip/elements.d.ts +4 -2
  79. package/dist/Tip/__tests__/helpers.d.ts +1 -1
  80. package/dist/Tip/shared/FloatingTip.js +2 -2
  81. package/dist/Tip/shared/elements.d.ts +12 -6
  82. package/dist/Tip/shared/types.d.ts +2 -2
  83. package/dist/Toaster/index.js +1 -1
  84. package/dist/Toggle/elements.d.ts +4 -2
  85. package/dist/Typography/Text.d.ts +5 -7
  86. package/dist/Typography/Text.js +3 -1
  87. package/dist/index.d.ts +0 -1
  88. package/dist/index.js +0 -1
  89. package/dist/utils/index.d.ts +1 -1
  90. package/dist/utils/index.js +1 -1
  91. package/dist/utils/react.d.ts +1 -0
  92. package/dist/utils/react.js +4 -1
  93. package/dist/utils/types.d.ts +51 -1
  94. package/dist/utils/types.js +48 -1
  95. package/package.json +12 -11
  96. package/dist/BarChart/BarChartProvider.d.ts +0 -19
  97. package/dist/BarChart/BarChartProvider.js +0 -27
  98. package/dist/BarChart/BarRow/ValueLabelsContent.d.ts +0 -7
  99. package/dist/BarChart/BarRow/ValueLabelsContent.js +0 -34
  100. package/dist/BarChart/BarRow/elements.d.ts +0 -943
  101. package/dist/BarChart/BarRow/elements.js +0 -102
  102. package/dist/BarChart/BarRow/index.d.ts +0 -6
  103. package/dist/BarChart/BarRow/index.js +0 -234
  104. package/dist/BarChart/GENERIC_EXAMPLE.d.ts +0 -14
  105. package/dist/BarChart/GENERIC_EXAMPLE.js +0 -327
  106. package/dist/BarChart/SortSelect/index.d.ts +0 -15
  107. package/dist/BarChart/SortSelect/index.js +0 -18
  108. package/dist/BarChart/index.d.ts +0 -4
  109. package/dist/BarChart/index.js +0 -136
  110. package/dist/BarChart/layout/GridLines.d.ts +0 -3
  111. package/dist/BarChart/layout/GridLines.js +0 -69
  112. package/dist/BarChart/layout/LabelSpacer.d.ts +0 -6
  113. package/dist/BarChart/layout/LabelSpacer.js +0 -56
  114. package/dist/BarChart/layout/ScaleChartHeader.d.ts +0 -3
  115. package/dist/BarChart/layout/ScaleChartHeader.js +0 -87
  116. package/dist/BarChart/shared/elements.d.ts +0 -7
  117. package/dist/BarChart/shared/elements.js +0 -12
  118. package/dist/BarChart/shared/styles.d.ts +0 -4
  119. package/dist/BarChart/shared/styles.js +0 -4
  120. package/dist/BarChart/shared/translations.d.ts +0 -69
  121. package/dist/BarChart/shared/translations.js +0 -57
  122. package/dist/BarChart/shared/types.d.ts +0 -100
  123. package/dist/BarChart/shared/types.js +0 -1
  124. package/dist/BarChart/utils/hooks.d.ts +0 -89
  125. package/dist/BarChart/utils/hooks.js +0 -281
  126. package/dist/BarChart/utils/index.d.ts +0 -56
  127. 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" | "smooth" | "highlight" | "screenreader", boolean>> & {
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<(Omit<{
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
- } & TextTruncateProps & 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"> | Omit<{
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 {};
@@ -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,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9UeXBvZ3JhcGh5L1RleHQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTZJbUIiLCJmaWxlIjoiLi4vLi4vc3JjL1R5cG9ncmFwaHkvVGV4dC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBzdGF0ZXMsXG4gIHN0eWxlZE9wdGlvbnMsXG4gIHN5c3RlbSxcbiAgdmFyaWFudCxcbn0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtc3R5bGVzJztcbmltcG9ydCB7IFN0eWxlUHJvcHMsIHZhcmlhbmNlIH0gZnJvbSAnQGNvZGVjYWRlbXkvdmFyaWFuY2UnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgQ29tcG9uZW50UHJvcHMsIGZvcndhcmRSZWYgfSBmcm9tICdyZWFjdCc7XG5cbmltcG9ydCB7IHR5cG9ncmFwaHlFbGVtZW50VmFyaWFudHMsIHR5cG9ncmFwaHlTdHlsZVZhcmlhbnRzIH0gZnJvbSAnLi92YXJpYW50cyc7XG5cbmNvbnN0IGRpc3BsYXlWYXJpYW50cyA9IHZhcmlhbnQoe1xuICB2YXJpYW50czogdHlwb2dyYXBoeVN0eWxlVmFyaWFudHMsXG59KTtcblxuY29uc3QgZWxlbWVudFZhcmlhbnRzID0gdmFyaWFudCh7XG4gIHByb3A6ICdhcycsXG4gIHZhcmlhbnRzOiB0eXBvZ3JhcGh5RWxlbWVudFZhcmlhbnRzLFxufSk7XG5cbmNvbnN0IHRydW5jYXRlVmFyaWFudHMgPSB2YXJpYW50KHtcbiAgcHJvcDogJ3RydW5jYXRlJyxcbiAgdmFyaWFudHM6IHtcbiAgICBlbGxpcHNpczoge1xuICAgICAgdGV4dE92ZXJmbG93OiAnZWxsaXBzaXMnLFxuICAgIH0sXG4gICAgZmFkZToge1xuICAgICAgcG9zaXRpb246ICdyZWxhdGl2ZScsXG4gICAgICB0ZXh0T3ZlcmZsb3c6ICdjbGlwJyxcbiAgICAgICcmOmFmdGVyJzoge1xuICAgICAgICBjb250ZW50OiAnXCJcIicsXG4gICAgICAgIHBvc2l0aW9uOiAnYWJzb2x1dGUnLFxuICAgICAgICB0ZXh0Q29sb3I6ICdiYWNrZ3JvdW5kLWN1cnJlbnQnLFxuICAgICAgICBpbnNldDogMCxcbiAgICAgICAgbGVmdDogMC42NSxcbiAgICAgICAgYmFja2dyb3VuZDpcbiAgICAgICAgICAnbGluZWFyLWdyYWRpZW50KHRvIHJpZ2h0LCByZ2JhKDAsIDAsIDAsIDApLCBjdXJyZW50Q29sb3IgNzUlKScsXG4gICAgICB9LFxuICAgIH0sXG4gIH0sXG59KTtcblxuY29uc3QgdHJ1bmNhdGVMaW5lc1NjYWxlID0geyAxOiAxLCAyOiAyLCAzOiAzLCA0OiA0LCA1OiA1IH07XG5cbmNvbnN0IHRydW5jYXRlTGluZXNQcm9wcyA9IHZhcmlhbmNlLmNyZWF0ZSh7XG4gIHRydW5jYXRlTGluZXM6IHtcbiAgICBzY2FsZTogdHJ1bmNhdGVMaW5lc1NjYWxlLFxuICAgIHByb3BlcnR5OiAnYWxsJyxcbiAgICB0cmFuc2Zvcm06ICh0cnVuY2F0ZUxpbmVzOiBudW1iZXIpID0+XG4gICAgICB0cnVuY2F0ZUxpbmVzID09PSAxXG4gICAgICAgID8ge1xuICAgICAgICAgICAgb3ZlcmZsb3c6ICdoaWRkZW4nLFxuICAgICAgICAgICAgd2hpdGVTcGFjZTogJ25vd3JhcCcsXG4gICAgICAgICAgfVxuICAgICAgICA6IHtcbiAgICAgICAgICAgIG92ZXJmbG93OiAnaGlkZGVuJyxcbiAgICAgICAgICAgIGRpc3BsYXk6ICctd2Via2l0LWJveCcsXG4gICAgICAgICAgICBXZWJraXRCb3hPcmllbnQ6ICd2ZXJ0aWNhbCcsXG4gICAgICAgICAgICBXZWJraXRMaW5lQ2xhbXA6IHRydW5jYXRlTGluZXMsXG4gICAgICAgICAgICAnJjphZnRlcic6IHtcbiAgICAgICAgICAgICAgdG9wOiBgJHsxMDAgLSAxMDAgLyB0cnVuY2F0ZUxpbmVzfSVgLFxuICAgICAgICAgICAgfSxcbiAgICAgICAgICB9LFxuICB9LFxufSk7XG5cbmNvbnN0IHRleHRTdGF0ZXMgPSBzdGF0ZXMoe1xuICBjZW50ZXI6IHtcbiAgICB0ZXh0QWxpZ246ICdjZW50ZXInLFxuICB9LFxuICBibG9jazoge1xuICAgIGRpc3BsYXk6ICdibG9jaycsXG4gIH0sXG4gIGhpZ2hsaWdodDoge1xuICAgIGZvbnRXZWlnaHQ6ICdib2xkJyxcbiAgICBtaW5XaWR0aDogJzAuNHJlbScsXG4gICAgcG9zaXRpb246ICdyZWxhdGl2ZScsXG4gICAgekluZGV4OiAxLFxuICAgIC8vIHRoZSB0ZXh0IGlzIG1vcmUgbGVnaWJsZSBhZ2FpbnN0IHRoZSBiYWNrZ3JvdW5kIGNvbG9yIHdpdGggdGV4dCBzbW9vdGhpbmdcbiAgICBNb3pPc3hGb250U21vb3RoaW5nOiAnZ3JheXNjYWxlJyxcbiAgICBXZWJraXRGb250U21vb3RoaW5nOiAnYW50aWFsaWFzZWQnLFxuICAgICcmOmFmdGVyJzoge1xuICAgICAgYmc6ICdwcmltYXJ5LWludmVyc2UnLFxuICAgICAgY29udGVudDogJ1wiXCInLFxuICAgICAgZGlzcGxheTogJ2Jsb2NrJyxcbiAgICAgIGhlaWdodDogJzMyLjUlJyxcbiAgICAgIGxlZnQ6ICcwJyxcbiAgICAgIG1sOiAnLTAuMnJlbScgYXMgYW55LFxuICAgICAgcG9zaXRpb246ICdhYnNvbHV0ZScsXG4gICAgICB0b3A6ICc1MCUnLFxuICAgICAgd2lkdGg6ICdjYWxjKDEwMCUgKyAwLjRyZW0pJyxcbiAgICAgIHpJbmRleDogLTEsXG4gICAgfSxcbiAgfSxcbiAgc2NyZWVucmVhZGVyOiB7XG4gICAgZGlzcGxheTogJ2lubGluZS1ibG9jaycsXG4gICAgaGVpZ2h0OiAnMXB4JyxcbiAgICB3aWR0aDogJzFweCcsXG4gICAgd2hpdGVTcGFjZTogJ25vd3JhcCcsXG4gICAgb3ZlcmZsb3c6ICdoaWRkZW4nLFxuICAgIHBvc2l0aW9uOiAnYWJzb2x1dGUnLFxuICAgIGNvbG9yOiAndHJhbnNwYXJlbnQnLFxuICAgIGxlZnQ6IC05OTk5LFxuICAgIHA6IDAsXG4gICAgbTogMCxcbiAgICBib3JkZXI6ICdub25lJyxcbiAgfSxcbiAgc21vb3RoOiB7XG4gICAgV2Via2l0Rm9udFNtb290aGluZzogJ2FudGlhbGlhc2VkJyxcbiAgICBNb3pPc3hGb250U21vb3RoaW5nOiAnZ3JheXNjYWxlJyxcbiAgfSxcbn0pO1xuXG5jb25zdCB0ZXh0UHJvcHMgPSB2YXJpYW5jZS5jb21wb3NlKFxuICBzeXN0ZW0ubGF5b3V0LFxuICBzeXN0ZW0udHlwb2dyYXBoeSxcbiAgc3lzdGVtLmNvbG9yLFxuICBzeXN0ZW0uc3BhY2UsXG4gIHRydW5jYXRlTGluZXNQcm9wc1xuKTtcblxuZXhwb3J0IGludGVyZmFjZSBCYXNlVGV4dFByb3BzXG4gIGV4dGVuZHMgU3R5bGVQcm9wczx0eXBlb2YgdGV4dFByb3BzPixcbiAgICBTdHlsZVByb3BzPHR5cGVvZiB0ZXh0U3RhdGVzPixcbiAgICBTdHlsZVByb3BzPHR5cGVvZiBlbGVtZW50VmFyaWFudHM+LFxuICAgIFN0eWxlUHJvcHM8dHlwZW9mIHRydW5jYXRlVmFyaWFudHM+LFxuICAgIFN0eWxlUHJvcHM8dHlwZW9mIGRpc3BsYXlWYXJpYW50cz4ge31cblxuLy8gaWYgeW91J3JlIGdvaW5nIHRvIHRydW5jYXRlLCB5b3UgbmVlZCB0byBwcm92aWRlIGJvdGggb2YgdGhlc2UgcHJvcHMgb3IgbmVpdGhlclxuZXhwb3J0IGludGVyZmFjZSBUZXh0VHJ1bmNhdGVQcm9wcyBleHRlbmRzIEJhc2VUZXh0UHJvcHMge1xuICB0cnVuY2F0ZUxpbmVzOiBFeGNsdWRlPEJhc2VUZXh0UHJvcHNbJ3RydW5jYXRlTGluZXMnXSwgdW5kZWZpbmVkPjtcbiAgdHJ1bmNhdGU6IEV4Y2x1ZGU8QmFzZVRleHRQcm9wc1sndHJ1bmNhdGUnXSwgZmFsc2UgfCB1bmRlZmluZWQ+O1xufVxuZXhwb3J0IGludGVyZmFjZSBUZXh0Tm9UcnVuY2F0ZVByb3BzIGV4dGVuZHMgQmFzZVRleHRQcm9wcyB7XG4gIHRydW5jYXRlTGluZXM/OiBuZXZlcjtcbiAgdHJ1bmNhdGU/OiBuZXZlcjtcbn1cblxuZXhwb3J0IHR5cGUgVGV4dFByb3BzID0gVGV4dFRydW5jYXRlUHJvcHMgfCBUZXh0Tm9UcnVuY2F0ZVByb3BzO1xuXG5jb25zdCBTdHlsZWRUZXh0ID0gc3R5bGVkKCdzcGFuJywgc3R5bGVkT3B0aW9uczwnc3Bhbic+KCkpPFRleHRQcm9wcz4oXG4gIGVsZW1lbnRWYXJpYW50cyxcbiAgdHJ1bmNhdGVWYXJpYW50cyxcbiAgZGlzcGxheVZhcmlhbnRzLFxuICB0ZXh0U3RhdGVzLFxuICB0ZXh0UHJvcHNcbik7XG5cbmV4cG9ydCBjb25zdCBUZXh0ID0gZm9yd2FyZFJlZjxcbiAgSFRNTFNwYW5FbGVtZW50LFxuICBDb21wb25lbnRQcm9wczx0eXBlb2YgU3R5bGVkVGV4dD5cbj4oKHsgYXMgPSAnc3BhbicsIG0gPSAwLCAuLi5yZXN0IH0sIHJlZikgPT4gKFxuICA8U3R5bGVkVGV4dCBhcz17YXN9IG09e219IHJlZj17cmVmfSB7Li4ucmVzdH0gLz5cbikpO1xuIl19 */");
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
@@ -6,7 +6,6 @@ export * from './Anchor';
6
6
  export * from './Animation';
7
7
  export * from './AppWrapper';
8
8
  export * from './Badge';
9
- export * from './BarChart';
10
9
  export * from './BodyPortal';
11
10
  export * from './Box';
12
11
  export * from './Breadcrumbs';
package/dist/index.js CHANGED
@@ -6,7 +6,6 @@ export * from './Anchor';
6
6
  export * from './Animation';
7
7
  export * from './AppWrapper';
8
8
  export * from './Badge';
9
- export * from './BarChart';
10
9
  export * from './BodyPortal';
11
10
  export * from './Box';
12
11
  export * from './Breadcrumbs';
@@ -3,4 +3,4 @@ export * from './focus';
3
3
  export * from './generateResponsiveClassnames';
4
4
  export * from './omitProps';
5
5
  export * from './useIsMounted';
6
- export * from './types';
6
+ export { CompatibleComponentProps, IconComponentType, OptionalScrollProps, WithChildrenProp, WithOptionalScrollProps, } from './types';
@@ -3,4 +3,4 @@ export * from './focus';
3
3
  export * from './generateResponsiveClassnames';
4
4
  export * from './omitProps';
5
5
  export * from './useIsMounted';
6
- export * from './types';
6
+ export { CompatibleComponentProps, IconComponentType, OptionalScrollProps, WithChildrenProp, WithOptionalScrollProps } from './types';
@@ -1,3 +1,4 @@
1
+ import type React from 'react';
1
2
  /**
2
3
  * Recursively extracts plain text content from React children.
3
4
  *
@@ -33,7 +33,10 @@ export const extractTextContent = children => {
33
33
  return '';
34
34
  }
35
35
  if (/*#__PURE__*/isValidElement(child)) {
36
- const textContent = child.props.children ?? child.props.text ?? '';
36
+ const {
37
+ props
38
+ } = child;
39
+ const textContent = props.children ?? props.text ?? '';
37
40
  return extractTextContent(textContent);
38
41
  }
39
42
  return '';
@@ -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'>;
@@ -1 +1,48 @@
1
- export {};
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.762d22.0",
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.762d22.0",
8
- "@codecademy/gamut-illustrations": "0.58.7-alpha.762d22.0",
9
- "@codecademy/gamut-patterns": "0.10.26-alpha.762d22.0",
10
- "@codecademy/gamut-styles": "17.12.1-alpha.762d22.0",
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": "^17.0.2 || ^18.3.0",
44
- "react-dom": "^17.0.2 || ^18.3.0"
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": "7c04441f00bf4e76f712836bcdcd723644ec9d7d"
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
- });