@codecademy/gamut 68.1.1-alpha.613ffe.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 (90) 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 +2 -5
  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/types/internal.d.ts +1 -1
  41. package/dist/Form/elements/Form.d.ts +17 -17
  42. package/dist/Form/elements/Form.js +1 -1
  43. package/dist/Form/elements/FormError.d.ts +2 -2
  44. package/dist/Form/elements/FormError.js +1 -1
  45. package/dist/Form/elements/FormGroup.d.ts +5 -3
  46. package/dist/GridForm/GridFormButtons/index.d.ts +17 -7
  47. package/dist/List/Header/ListHeaderCol.d.ts +3 -2
  48. package/dist/List/List.d.ts +2 -2
  49. package/dist/List/ListCol.d.ts +3 -2
  50. package/dist/List/ListProvider.d.ts +1 -1
  51. package/dist/List/ListRow.d.ts +2 -2
  52. package/dist/List/ListRow.js +3 -3
  53. package/dist/List/TableHeader.d.ts +3 -2
  54. package/dist/List/elements.d.ts +29 -932
  55. package/dist/List/elements.js +10 -8
  56. package/dist/Menu/elements.d.ts +2 -2
  57. package/dist/Modals/elements.d.ts +1 -1
  58. package/dist/Modals/types.d.ts +3 -2
  59. package/dist/Pagination/AnimatedPaginationButtons.d.ts +45 -36
  60. package/dist/Pagination/EllipsisButton.d.ts +18 -8
  61. package/dist/Pagination/PaginationButton.d.ts +25 -10
  62. package/dist/Pagination/utils.d.ts +36 -32
  63. package/dist/Pagination/utils.js +6 -10
  64. package/dist/Popover/elements.d.ts +8 -4
  65. package/dist/Popover/elements.js +6 -6
  66. package/dist/Popover/types.d.ts +2 -2
  67. package/dist/PopoverContainer/hooks.d.ts +2 -2
  68. package/dist/PopoverContainer/types.d.ts +1 -1
  69. package/dist/Tabs/TabButton.d.ts +8 -3
  70. package/dist/Tabs/TabNavLink.d.ts +9 -4
  71. package/dist/Tag/elements.d.ts +28 -20
  72. package/dist/Tip/InfoTip/InfoTipButton.d.ts +17 -7
  73. package/dist/Tip/InfoTip/styles.d.ts +4 -2
  74. package/dist/Tip/PreviewTip/elements.d.ts +12 -8
  75. package/dist/Tip/ToolTip/elements.d.ts +4 -2
  76. package/dist/Tip/__tests__/helpers.d.ts +1 -1
  77. package/dist/Tip/shared/FloatingTip.js +2 -2
  78. package/dist/Tip/shared/elements.d.ts +12 -6
  79. package/dist/Tip/shared/types.d.ts +2 -2
  80. package/dist/Toaster/index.js +1 -1
  81. package/dist/Toggle/elements.d.ts +4 -2
  82. package/dist/Typography/Text.d.ts +5 -7
  83. package/dist/Typography/Text.js +3 -1
  84. package/dist/utils/index.d.ts +1 -1
  85. package/dist/utils/index.js +1 -1
  86. package/dist/utils/react.d.ts +1 -0
  87. package/dist/utils/react.js +4 -1
  88. package/dist/utils/types.d.ts +51 -1
  89. package/dist/utils/types.js +48 -1
  90. package/package.json +12 -11
@@ -1,7 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  /// <reference types="react" />
3
3
  import { CardWrapperProps } from './types';
4
- export declare const MotionBox: import("react").ComponentType<{
4
+ export declare const MotionBox: import("react").ComponentType<Omit<{
5
5
  color?: import("@codecademy/variance/dist/types/config").Scale<{
6
6
  readonly property: "color";
7
7
  readonly scale: "colors";
@@ -37,6 +37,10 @@ export declare const MotionBox: import("react").ComponentType<{
37
37
  title?: string | undefined;
38
38
  dir?: string | undefined;
39
39
  className?: string | undefined;
40
+ onScrollEnd?: ((event: import("react").UIEvent<HTMLElement, UIEvent>) => void) | undefined;
41
+ onScrollEndCapture?: ((event: import("react").UIEvent<HTMLElement, UIEvent>) => void) | undefined;
42
+ ref?: import("react").LegacyRef<HTMLDivElement> | undefined;
43
+ key?: import("react").Key | null | undefined;
40
44
  height?: import("@codecademy/variance/dist/types/config").Scale<{
41
45
  readonly property: {
42
46
  readonly physical: "height";
@@ -53,9 +57,7 @@ export declare const MotionBox: import("react").ComponentType<{
53
57
  readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
54
58
  readonly transform: (value: string | number) => string | 0;
55
59
  }>;
56
- "aria-hidden"?: (boolean | "false" | "true") | undefined;
57
- ref?: import("react").LegacyRef<HTMLDivElement> | undefined;
58
- key?: import("react").Key | null | undefined;
60
+ "aria-hidden"?: (boolean | "true" | "false") | undefined;
59
61
  defaultChecked?: boolean | undefined;
60
62
  defaultValue?: string | number | readonly string[] | undefined;
61
63
  suppressContentEditableWarning?: boolean | undefined;
@@ -63,17 +65,17 @@ export declare const MotionBox: import("react").ComponentType<{
63
65
  accessKey?: string | undefined;
64
66
  autoCapitalize?: (string & {}) | "none" | "off" | "on" | "sentences" | "words" | "characters" | undefined;
65
67
  autoFocus?: boolean | undefined;
66
- contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
68
+ contentEditable?: "inherit" | (boolean | "true" | "false") | "plaintext-only" | undefined;
67
69
  contextMenu?: string | undefined;
68
- draggable?: (boolean | "false" | "true") | undefined;
69
- enterKeyHint?: "search" | "next" | "enter" | "done" | "go" | "previous" | "send" | undefined;
70
+ draggable?: (boolean | "true" | "false") | undefined;
71
+ enterKeyHint?: "search" | "enter" | "done" | "go" | "next" | "previous" | "send" | undefined;
70
72
  hidden?: boolean | undefined;
71
73
  id?: string | undefined;
72
74
  lang?: string | undefined;
73
75
  nonce?: string | undefined;
74
- spellCheck?: (boolean | "false" | "true") | undefined;
76
+ spellCheck?: (boolean | "true" | "false") | undefined;
75
77
  tabIndex?: number | undefined;
76
- translate?: "no" | "yes" | undefined;
78
+ translate?: "yes" | "no" | undefined;
77
79
  radioGroup?: string | undefined;
78
80
  role?: import("react").AriaRole | undefined;
79
81
  about?: string | undefined;
@@ -102,51 +104,51 @@ export declare const MotionBox: import("react").ComponentType<{
102
104
  exportparts?: string | undefined;
103
105
  part?: string | undefined;
104
106
  "aria-activedescendant"?: string | undefined;
105
- "aria-atomic"?: (boolean | "false" | "true") | undefined;
106
- "aria-autocomplete"?: "none" | "inline" | "both" | "list" | undefined;
107
+ "aria-atomic"?: (boolean | "true" | "false") | undefined;
108
+ "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined;
107
109
  "aria-braillelabel"?: string | undefined;
108
110
  "aria-brailleroledescription"?: string | undefined;
109
- "aria-busy"?: (boolean | "false" | "true") | undefined;
110
- "aria-checked"?: boolean | "mixed" | "false" | "true" | undefined;
111
+ "aria-busy"?: (boolean | "true" | "false") | undefined;
112
+ "aria-checked"?: boolean | "true" | "false" | "mixed" | undefined;
111
113
  "aria-colcount"?: number | undefined;
112
114
  "aria-colindex"?: number | undefined;
113
115
  "aria-colindextext"?: string | undefined;
114
116
  "aria-colspan"?: number | undefined;
115
117
  "aria-controls"?: string | undefined;
116
- "aria-current"?: boolean | "time" | "page" | "false" | "true" | "step" | "location" | "date" | undefined;
118
+ "aria-current"?: boolean | "time" | "page" | "true" | "false" | "step" | "location" | "date" | undefined;
117
119
  "aria-describedby"?: string | undefined;
118
120
  "aria-description"?: string | undefined;
119
121
  "aria-details"?: string | undefined;
120
- "aria-disabled"?: (boolean | "false" | "true") | undefined;
122
+ "aria-disabled"?: (boolean | "true" | "false") | undefined;
121
123
  "aria-dropeffect"?: "link" | "none" | "copy" | "move" | "execute" | "popup" | undefined;
122
124
  "aria-errormessage"?: string | undefined;
123
- "aria-expanded"?: (boolean | "false" | "true") | undefined;
125
+ "aria-expanded"?: (boolean | "true" | "false") | undefined;
124
126
  "aria-flowto"?: string | undefined;
125
- "aria-grabbed"?: (boolean | "false" | "true") | undefined;
126
- "aria-haspopup"?: boolean | "dialog" | "menu" | "grid" | "listbox" | "false" | "true" | "tree" | undefined;
127
- "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
127
+ "aria-grabbed"?: (boolean | "true" | "false") | undefined;
128
+ "aria-haspopup"?: boolean | "dialog" | "menu" | "grid" | "true" | "false" | "listbox" | "tree" | undefined;
129
+ "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
128
130
  "aria-keyshortcuts"?: string | undefined;
129
131
  "aria-label"?: string | undefined;
130
132
  "aria-labelledby"?: string | undefined;
131
133
  "aria-level"?: number | undefined;
132
134
  "aria-live"?: "off" | "assertive" | "polite" | undefined;
133
- "aria-modal"?: (boolean | "false" | "true") | undefined;
134
- "aria-multiline"?: (boolean | "false" | "true") | undefined;
135
- "aria-multiselectable"?: (boolean | "false" | "true") | undefined;
135
+ "aria-modal"?: (boolean | "true" | "false") | undefined;
136
+ "aria-multiline"?: (boolean | "true" | "false") | undefined;
137
+ "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
136
138
  "aria-orientation"?: "horizontal" | "vertical" | undefined;
137
139
  "aria-owns"?: string | undefined;
138
140
  "aria-placeholder"?: string | undefined;
139
141
  "aria-posinset"?: number | undefined;
140
- "aria-pressed"?: boolean | "mixed" | "false" | "true" | undefined;
141
- "aria-readonly"?: (boolean | "false" | "true") | undefined;
142
+ "aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
143
+ "aria-readonly"?: (boolean | "true" | "false") | undefined;
142
144
  "aria-relevant"?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
143
- "aria-required"?: (boolean | "false" | "true") | undefined;
145
+ "aria-required"?: (boolean | "true" | "false") | undefined;
144
146
  "aria-roledescription"?: string | undefined;
145
147
  "aria-rowcount"?: number | undefined;
146
148
  "aria-rowindex"?: number | undefined;
147
149
  "aria-rowindextext"?: string | undefined;
148
150
  "aria-rowspan"?: number | undefined;
149
- "aria-selected"?: (boolean | "false" | "true") | undefined;
151
+ "aria-selected"?: (boolean | "true" | "false") | undefined;
150
152
  "aria-setsize"?: number | undefined;
151
153
  "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
152
154
  "aria-valuemax"?: number | undefined;
@@ -310,9 +312,9 @@ export declare const MotionBox: import("react").ComponentType<{
310
312
  onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
311
313
  onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
312
314
  onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
313
- alignContent?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "baseline" | "end" | "start" | "flex-end" | "flex-start" | "stretch" | "space-around" | "space-between" | "space-evenly" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | undefined> | undefined;
314
- alignItems?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "baseline" | "end" | "start" | "flex-end" | "flex-start" | "self-end" | "self-start" | "anchor-center" | "stretch" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | undefined> | undefined;
315
- alignSelf?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "auto" | "baseline" | "end" | "start" | "flex-end" | "flex-start" | "self-end" | "self-start" | "anchor-center" | "stretch" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | undefined;
315
+ alignContent?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "end" | "flex-end" | "flex-start" | "start" | "baseline" | "stretch" | "space-around" | "space-between" | "space-evenly" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | undefined> | undefined;
316
+ alignItems?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "end" | "flex-end" | "flex-start" | "self-end" | "self-start" | "start" | "anchor-center" | "baseline" | "stretch" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | undefined> | undefined;
317
+ alignSelf?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "end" | "flex-end" | "flex-start" | "self-end" | "self-start" | "start" | "anchor-center" | "auto" | "baseline" | "stretch" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | undefined;
316
318
  backgroundImage?: import("@codecademy/variance/dist/types/config").Scale<{
317
319
  readonly property: "backgroundImage";
318
320
  }>;
@@ -346,7 +348,7 @@ export declare const MotionBox: import("react").ComponentType<{
346
348
  display?: import("@codecademy/variance/dist/types/config").Scale<{
347
349
  readonly property: "display";
348
350
  }>;
349
- flexBasis?: 0 | "initial" | "inherit" | "content" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "-moz-fit-content" | "-moz-max-content" | "-moz-min-content" | "auto" | "fit-content" | "max-content" | "min-content" | "-webkit-auto" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | undefined> | undefined;
351
+ flexBasis?: 0 | "initial" | "inherit" | "content" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "auto" | "-moz-fit-content" | "-moz-max-content" | "-moz-min-content" | "fit-content" | "max-content" | "min-content" | "-webkit-auto" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | undefined> | undefined;
350
352
  flexDirection?: import("@codecademy/variance/dist/types/config").Scale<{
351
353
  readonly property: "flexDirection";
352
354
  }>;
@@ -367,10 +369,10 @@ export declare const MotionBox: import("react").ComponentType<{
367
369
  gridAutoRows?: import("@codecademy/variance/dist/types/config").Scale<{
368
370
  readonly property: "gridAutoRows";
369
371
  }>;
370
- gridColumnEnd?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | (number & {}) | "auto" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumnEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumnEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumnEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumnEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | undefined> | undefined;
371
- gridColumnStart?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | (number & {}) | "auto" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumnStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumnStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumnStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumnStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | undefined> | undefined;
372
- gridRowEnd?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | (number & {}) | "auto" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRowEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRowEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRowEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRowEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | undefined> | undefined;
373
- gridRowStart?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | (number & {}) | "auto" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRowStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRowStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRowStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRowStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | undefined> | undefined;
372
+ gridColumnEnd?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "auto" | (number & {}) | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumnEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumnEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumnEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumnEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | undefined> | undefined;
373
+ gridColumnStart?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "auto" | (number & {}) | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumnStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumnStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumnStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumnStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | undefined> | undefined;
374
+ gridRowEnd?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "auto" | (number & {}) | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRowEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRowEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRowEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRowEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | undefined> | undefined;
375
+ gridRowStart?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "auto" | (number & {}) | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRowStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRowStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRowStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRowStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | undefined> | undefined;
374
376
  gridTemplateAreas?: import("@codecademy/variance/dist/types/config").Scale<{
375
377
  readonly property: "gridTemplateAreas";
376
378
  }>;
@@ -380,9 +382,9 @@ export declare const MotionBox: import("react").ComponentType<{
380
382
  gridTemplateRows?: import("@codecademy/variance/dist/types/config").Scale<{
381
383
  readonly property: "gridTemplateRows";
382
384
  }>;
383
- justifyContent?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "left" | "right" | "-moz-initial" | "revert" | "revert-layer" | "unset" | "end" | "start" | "flex-end" | "flex-start" | "stretch" | "space-around" | "space-between" | "space-evenly" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifyContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifyContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifyContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifyContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | undefined> | undefined;
384
- justifyItems?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "left" | "right" | "-moz-initial" | "revert" | "revert-layer" | "unset" | "baseline" | "end" | "start" | "flex-end" | "flex-start" | "self-end" | "self-start" | "anchor-center" | "stretch" | "legacy" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifyItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifyItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifyItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifyItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | undefined> | undefined;
385
- justifySelf?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "left" | "right" | "-moz-initial" | "revert" | "revert-layer" | "unset" | "auto" | "baseline" | "end" | "start" | "flex-end" | "flex-start" | "self-end" | "self-start" | "anchor-center" | "stretch" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | undefined;
385
+ justifyContent?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "left" | "right" | "-moz-initial" | "revert" | "revert-layer" | "unset" | "end" | "flex-end" | "flex-start" | "start" | "stretch" | "space-around" | "space-between" | "space-evenly" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifyContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifyContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifyContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifyContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | undefined> | undefined;
386
+ justifyItems?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "left" | "right" | "-moz-initial" | "revert" | "revert-layer" | "unset" | "end" | "flex-end" | "flex-start" | "self-end" | "self-start" | "start" | "anchor-center" | "baseline" | "stretch" | "legacy" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifyItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifyItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifyItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifyItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | undefined> | undefined;
387
+ justifySelf?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "left" | "right" | "-moz-initial" | "revert" | "revert-layer" | "unset" | "end" | "flex-end" | "flex-start" | "self-end" | "self-start" | "start" | "anchor-center" | "auto" | "baseline" | "stretch" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | undefined;
386
388
  left?: import("@codecademy/variance/dist/types/config").Scale<{
387
389
  readonly property: {
388
390
  readonly physical: "left";
@@ -550,9 +552,9 @@ export declare const MotionBox: import("react").ComponentType<{
550
552
  readonly property: "gap";
551
553
  readonly scale: "spacing";
552
554
  }>;
553
- gridArea?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | (number & {}) | "auto" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | undefined;
554
- gridColumn?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | (number & {}) | "auto" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumn | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumn | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumn | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumn | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | undefined> | undefined;
555
- gridRow?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | (number & {}) | "auto" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRow | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRow | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRow | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRow | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | undefined> | undefined;
555
+ gridArea?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "auto" | (number & {}) | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | undefined;
556
+ gridColumn?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "auto" | (number & {}) | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumn | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumn | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumn | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumn | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | undefined> | undefined;
557
+ gridRow?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "auto" | (number & {}) | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRow | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRow | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRow | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRow | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | undefined> | undefined;
556
558
  inset?: import("@codecademy/variance/dist/types/config").Scale<{
557
559
  readonly property: "inset";
558
560
  readonly properties: {
@@ -909,8 +911,10 @@ export declare const MotionBox: import("react").ComponentType<{
909
911
  context?: boolean | undefined;
910
912
  "no-select"?: boolean | undefined;
911
913
  as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
912
- } & import("framer-motion").MotionProps>;
913
- export declare const DynamicCardWrapper: import("@emotion/styled").StyledComponent<{
914
+ } & import("framer-motion/dist/types.d-CQ4vRM6h").M, "children"> & {
915
+ children?: string | number | boolean | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | import("react").ReactPortal | import("motion-dom").MotionValue<number> | import("motion-dom").MotionValue<string> | (string & import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) | (string & Iterable<import("react").ReactNode>) | (string & import("react").ReactPortal) | (number & import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) | (number & Iterable<import("react").ReactNode>) | (number & import("react").ReactPortal) | (false & import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) | (false & Iterable<import("react").ReactNode>) | (false & import("react").ReactPortal) | (true & import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) | (true & Iterable<import("react").ReactNode>) | (true & import("react").ReactPortal) | (import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> & string) | (import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> & number) | (import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> & false) | (import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> & true) | (import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> & Iterable<import("react").ReactNode>) | (import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> & import("react").ReactPortal) | (Iterable<import("react").ReactNode> & string) | (Iterable<import("react").ReactNode> & number) | (Iterable<import("react").ReactNode> & false) | (Iterable<import("react").ReactNode> & true) | (Iterable<import("react").ReactNode> & import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) | (Iterable<import("react").ReactNode> & import("react").ReactPortal) | (import("react").ReactPortal & string) | (import("react").ReactPortal & number) | (import("react").ReactPortal & false) | (import("react").ReactPortal & true) | (import("react").ReactPortal & import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) | (import("react").ReactPortal & Iterable<import("react").ReactNode>) | (import("react").ReactNode[] & string) | (import("react").ReactNode[] & number) | (import("react").ReactNode[] & false) | (import("react").ReactNode[] & true) | (import("react").ReactNode[] & import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) | (import("react").ReactNode[] & Iterable<import("react").ReactNode>) | (import("react").ReactNode[] & import("react").ReactPortal) | null | undefined;
916
+ }>;
917
+ export declare const DynamicCardWrapper: import("@emotion/styled").StyledComponent<Omit<{
914
918
  color?: import("@codecademy/variance/dist/types/config").Scale<{
915
919
  readonly property: "color";
916
920
  readonly scale: "colors";
@@ -946,6 +950,10 @@ export declare const DynamicCardWrapper: import("@emotion/styled").StyledCompone
946
950
  title?: string | undefined;
947
951
  dir?: string | undefined;
948
952
  className?: string | undefined;
953
+ onScrollEnd?: ((event: import("react").UIEvent<HTMLElement, UIEvent>) => void) | undefined;
954
+ onScrollEndCapture?: ((event: import("react").UIEvent<HTMLElement, UIEvent>) => void) | undefined;
955
+ ref?: import("react").LegacyRef<HTMLDivElement> | undefined;
956
+ key?: import("react").Key | null | undefined;
949
957
  height?: import("@codecademy/variance/dist/types/config").Scale<{
950
958
  readonly property: {
951
959
  readonly physical: "height";
@@ -962,9 +970,7 @@ export declare const DynamicCardWrapper: import("@emotion/styled").StyledCompone
962
970
  readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
963
971
  readonly transform: (value: string | number) => string | 0;
964
972
  }>;
965
- "aria-hidden"?: (boolean | "false" | "true") | undefined;
966
- ref?: import("react").LegacyRef<HTMLDivElement> | undefined;
967
- key?: import("react").Key | null | undefined;
973
+ "aria-hidden"?: (boolean | "true" | "false") | undefined;
968
974
  defaultChecked?: boolean | undefined;
969
975
  defaultValue?: string | number | readonly string[] | undefined;
970
976
  suppressContentEditableWarning?: boolean | undefined;
@@ -972,17 +978,17 @@ export declare const DynamicCardWrapper: import("@emotion/styled").StyledCompone
972
978
  accessKey?: string | undefined;
973
979
  autoCapitalize?: (string & {}) | "none" | "off" | "on" | "sentences" | "words" | "characters" | undefined;
974
980
  autoFocus?: boolean | undefined;
975
- contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
981
+ contentEditable?: "inherit" | (boolean | "true" | "false") | "plaintext-only" | undefined;
976
982
  contextMenu?: string | undefined;
977
- draggable?: (boolean | "false" | "true") | undefined;
978
- enterKeyHint?: "search" | "next" | "enter" | "done" | "go" | "previous" | "send" | undefined;
983
+ draggable?: (boolean | "true" | "false") | undefined;
984
+ enterKeyHint?: "search" | "enter" | "done" | "go" | "next" | "previous" | "send" | undefined;
979
985
  hidden?: boolean | undefined;
980
986
  id?: string | undefined;
981
987
  lang?: string | undefined;
982
988
  nonce?: string | undefined;
983
- spellCheck?: (boolean | "false" | "true") | undefined;
989
+ spellCheck?: (boolean | "true" | "false") | undefined;
984
990
  tabIndex?: number | undefined;
985
- translate?: "no" | "yes" | undefined;
991
+ translate?: "yes" | "no" | undefined;
986
992
  radioGroup?: string | undefined;
987
993
  role?: import("react").AriaRole | undefined;
988
994
  about?: string | undefined;
@@ -1011,51 +1017,51 @@ export declare const DynamicCardWrapper: import("@emotion/styled").StyledCompone
1011
1017
  exportparts?: string | undefined;
1012
1018
  part?: string | undefined;
1013
1019
  "aria-activedescendant"?: string | undefined;
1014
- "aria-atomic"?: (boolean | "false" | "true") | undefined;
1015
- "aria-autocomplete"?: "none" | "inline" | "both" | "list" | undefined;
1020
+ "aria-atomic"?: (boolean | "true" | "false") | undefined;
1021
+ "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined;
1016
1022
  "aria-braillelabel"?: string | undefined;
1017
1023
  "aria-brailleroledescription"?: string | undefined;
1018
- "aria-busy"?: (boolean | "false" | "true") | undefined;
1019
- "aria-checked"?: boolean | "mixed" | "false" | "true" | undefined;
1024
+ "aria-busy"?: (boolean | "true" | "false") | undefined;
1025
+ "aria-checked"?: boolean | "true" | "false" | "mixed" | undefined;
1020
1026
  "aria-colcount"?: number | undefined;
1021
1027
  "aria-colindex"?: number | undefined;
1022
1028
  "aria-colindextext"?: string | undefined;
1023
1029
  "aria-colspan"?: number | undefined;
1024
1030
  "aria-controls"?: string | undefined;
1025
- "aria-current"?: boolean | "time" | "page" | "false" | "true" | "step" | "location" | "date" | undefined;
1031
+ "aria-current"?: boolean | "time" | "page" | "true" | "false" | "step" | "location" | "date" | undefined;
1026
1032
  "aria-describedby"?: string | undefined;
1027
1033
  "aria-description"?: string | undefined;
1028
1034
  "aria-details"?: string | undefined;
1029
- "aria-disabled"?: (boolean | "false" | "true") | undefined;
1035
+ "aria-disabled"?: (boolean | "true" | "false") | undefined;
1030
1036
  "aria-dropeffect"?: "link" | "none" | "copy" | "move" | "execute" | "popup" | undefined;
1031
1037
  "aria-errormessage"?: string | undefined;
1032
- "aria-expanded"?: (boolean | "false" | "true") | undefined;
1038
+ "aria-expanded"?: (boolean | "true" | "false") | undefined;
1033
1039
  "aria-flowto"?: string | undefined;
1034
- "aria-grabbed"?: (boolean | "false" | "true") | undefined;
1035
- "aria-haspopup"?: boolean | "dialog" | "menu" | "grid" | "listbox" | "false" | "true" | "tree" | undefined;
1036
- "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
1040
+ "aria-grabbed"?: (boolean | "true" | "false") | undefined;
1041
+ "aria-haspopup"?: boolean | "dialog" | "menu" | "grid" | "true" | "false" | "listbox" | "tree" | undefined;
1042
+ "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
1037
1043
  "aria-keyshortcuts"?: string | undefined;
1038
1044
  "aria-label"?: string | undefined;
1039
1045
  "aria-labelledby"?: string | undefined;
1040
1046
  "aria-level"?: number | undefined;
1041
1047
  "aria-live"?: "off" | "assertive" | "polite" | undefined;
1042
- "aria-modal"?: (boolean | "false" | "true") | undefined;
1043
- "aria-multiline"?: (boolean | "false" | "true") | undefined;
1044
- "aria-multiselectable"?: (boolean | "false" | "true") | undefined;
1048
+ "aria-modal"?: (boolean | "true" | "false") | undefined;
1049
+ "aria-multiline"?: (boolean | "true" | "false") | undefined;
1050
+ "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
1045
1051
  "aria-orientation"?: "horizontal" | "vertical" | undefined;
1046
1052
  "aria-owns"?: string | undefined;
1047
1053
  "aria-placeholder"?: string | undefined;
1048
1054
  "aria-posinset"?: number | undefined;
1049
- "aria-pressed"?: boolean | "mixed" | "false" | "true" | undefined;
1050
- "aria-readonly"?: (boolean | "false" | "true") | undefined;
1055
+ "aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
1056
+ "aria-readonly"?: (boolean | "true" | "false") | undefined;
1051
1057
  "aria-relevant"?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
1052
- "aria-required"?: (boolean | "false" | "true") | undefined;
1058
+ "aria-required"?: (boolean | "true" | "false") | undefined;
1053
1059
  "aria-roledescription"?: string | undefined;
1054
1060
  "aria-rowcount"?: number | undefined;
1055
1061
  "aria-rowindex"?: number | undefined;
1056
1062
  "aria-rowindextext"?: string | undefined;
1057
1063
  "aria-rowspan"?: number | undefined;
1058
- "aria-selected"?: (boolean | "false" | "true") | undefined;
1064
+ "aria-selected"?: (boolean | "true" | "false") | undefined;
1059
1065
  "aria-setsize"?: number | undefined;
1060
1066
  "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
1061
1067
  "aria-valuemax"?: number | undefined;
@@ -1219,9 +1225,9 @@ export declare const DynamicCardWrapper: import("@emotion/styled").StyledCompone
1219
1225
  onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
1220
1226
  onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
1221
1227
  onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
1222
- alignContent?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "baseline" | "end" | "start" | "flex-end" | "flex-start" | "stretch" | "space-around" | "space-between" | "space-evenly" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | undefined> | undefined;
1223
- alignItems?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "baseline" | "end" | "start" | "flex-end" | "flex-start" | "self-end" | "self-start" | "anchor-center" | "stretch" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | undefined> | undefined;
1224
- alignSelf?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "auto" | "baseline" | "end" | "start" | "flex-end" | "flex-start" | "self-end" | "self-start" | "anchor-center" | "stretch" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | undefined;
1228
+ alignContent?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "end" | "flex-end" | "flex-start" | "start" | "baseline" | "stretch" | "space-around" | "space-between" | "space-evenly" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignContent | undefined) | undefined> | undefined;
1229
+ alignItems?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "end" | "flex-end" | "flex-start" | "self-end" | "self-start" | "start" | "anchor-center" | "baseline" | "stretch" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignItems | undefined) | undefined> | undefined;
1230
+ alignSelf?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "end" | "flex-end" | "flex-start" | "self-end" | "self-start" | "start" | "anchor-center" | "auto" | "baseline" | "stretch" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.AlignSelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.AlignSelf | undefined) | undefined> | undefined;
1225
1231
  backgroundImage?: import("@codecademy/variance/dist/types/config").Scale<{
1226
1232
  readonly property: "backgroundImage";
1227
1233
  }>;
@@ -1255,7 +1261,7 @@ export declare const DynamicCardWrapper: import("@emotion/styled").StyledCompone
1255
1261
  display?: import("@codecademy/variance/dist/types/config").Scale<{
1256
1262
  readonly property: "display";
1257
1263
  }>;
1258
- flexBasis?: 0 | "initial" | "inherit" | "content" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "-moz-fit-content" | "-moz-max-content" | "-moz-min-content" | "auto" | "fit-content" | "max-content" | "min-content" | "-webkit-auto" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | undefined> | undefined;
1264
+ flexBasis?: 0 | "initial" | "inherit" | "content" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "auto" | "-moz-fit-content" | "-moz-max-content" | "-moz-min-content" | "fit-content" | "max-content" | "min-content" | "-webkit-auto" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.FlexBasis<import("@codecademy/variance/dist/types/properties").DefaultCSSPropertyValue> | undefined) | undefined> | undefined;
1259
1265
  flexDirection?: import("@codecademy/variance/dist/types/config").Scale<{
1260
1266
  readonly property: "flexDirection";
1261
1267
  }>;
@@ -1276,10 +1282,10 @@ export declare const DynamicCardWrapper: import("@emotion/styled").StyledCompone
1276
1282
  gridAutoRows?: import("@codecademy/variance/dist/types/config").Scale<{
1277
1283
  readonly property: "gridAutoRows";
1278
1284
  }>;
1279
- gridColumnEnd?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | (number & {}) | "auto" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumnEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumnEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumnEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumnEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | undefined> | undefined;
1280
- gridColumnStart?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | (number & {}) | "auto" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumnStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumnStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumnStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumnStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | undefined> | undefined;
1281
- gridRowEnd?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | (number & {}) | "auto" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRowEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRowEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRowEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRowEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | undefined> | undefined;
1282
- gridRowStart?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | (number & {}) | "auto" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRowStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRowStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRowStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRowStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | undefined> | undefined;
1285
+ gridColumnEnd?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "auto" | (number & {}) | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumnEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumnEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumnEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumnEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnEnd | undefined) | undefined> | undefined;
1286
+ gridColumnStart?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "auto" | (number & {}) | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumnStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumnStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumnStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumnStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumnStart | undefined) | undefined> | undefined;
1287
+ gridRowEnd?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "auto" | (number & {}) | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRowEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRowEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRowEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRowEnd | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowEnd | undefined) | undefined> | undefined;
1288
+ gridRowStart?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "auto" | (number & {}) | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRowStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRowStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRowStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRowStart | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRowStart | undefined) | undefined> | undefined;
1283
1289
  gridTemplateAreas?: import("@codecademy/variance/dist/types/config").Scale<{
1284
1290
  readonly property: "gridTemplateAreas";
1285
1291
  }>;
@@ -1289,9 +1295,9 @@ export declare const DynamicCardWrapper: import("@emotion/styled").StyledCompone
1289
1295
  gridTemplateRows?: import("@codecademy/variance/dist/types/config").Scale<{
1290
1296
  readonly property: "gridTemplateRows";
1291
1297
  }>;
1292
- justifyContent?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "left" | "right" | "-moz-initial" | "revert" | "revert-layer" | "unset" | "end" | "start" | "flex-end" | "flex-start" | "stretch" | "space-around" | "space-between" | "space-evenly" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifyContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifyContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifyContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifyContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | undefined> | undefined;
1293
- justifyItems?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "left" | "right" | "-moz-initial" | "revert" | "revert-layer" | "unset" | "baseline" | "end" | "start" | "flex-end" | "flex-start" | "self-end" | "self-start" | "anchor-center" | "stretch" | "legacy" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifyItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifyItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifyItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifyItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | undefined> | undefined;
1294
- justifySelf?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "left" | "right" | "-moz-initial" | "revert" | "revert-layer" | "unset" | "auto" | "baseline" | "end" | "start" | "flex-end" | "flex-start" | "self-end" | "self-start" | "anchor-center" | "stretch" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | undefined;
1298
+ justifyContent?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "left" | "right" | "-moz-initial" | "revert" | "revert-layer" | "unset" | "end" | "flex-end" | "flex-start" | "start" | "stretch" | "space-around" | "space-between" | "space-evenly" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifyContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifyContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifyContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifyContent | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyContent | undefined) | undefined> | undefined;
1299
+ justifyItems?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "left" | "right" | "-moz-initial" | "revert" | "revert-layer" | "unset" | "end" | "flex-end" | "flex-start" | "self-end" | "self-start" | "start" | "anchor-center" | "baseline" | "stretch" | "legacy" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifyItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifyItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifyItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifyItems | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifyItems | undefined) | undefined> | undefined;
1300
+ justifySelf?: "center" | "initial" | "inherit" | "normal" | (string & {}) | "left" | "right" | "-moz-initial" | "revert" | "revert-layer" | "unset" | "end" | "flex-end" | "flex-start" | "self-end" | "self-start" | "start" | "anchor-center" | "auto" | "baseline" | "stretch" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.JustifySelf | ((theme: import("@emotion/react").Theme) => import("csstype").Property.JustifySelf | undefined) | undefined> | undefined;
1295
1301
  left?: import("@codecademy/variance/dist/types/config").Scale<{
1296
1302
  readonly property: {
1297
1303
  readonly physical: "left";
@@ -1459,9 +1465,9 @@ export declare const DynamicCardWrapper: import("@emotion/styled").StyledCompone
1459
1465
  readonly property: "gap";
1460
1466
  readonly scale: "spacing";
1461
1467
  }>;
1462
- gridArea?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | (number & {}) | "auto" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | undefined;
1463
- gridColumn?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | (number & {}) | "auto" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumn | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumn | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumn | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumn | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | undefined> | undefined;
1464
- gridRow?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | (number & {}) | "auto" | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRow | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRow | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRow | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRow | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | undefined> | undefined;
1468
+ gridArea?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "auto" | (number & {}) | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridArea | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridArea | undefined) | undefined> | undefined;
1469
+ gridColumn?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "auto" | (number & {}) | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumn | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumn | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridColumn | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridColumn | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridColumn | undefined) | undefined> | undefined;
1470
+ gridRow?: "initial" | "inherit" | (string & {}) | "-moz-initial" | "revert" | "revert-layer" | "unset" | "auto" | (number & {}) | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRow | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRow | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | undefined> | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | import("@codecademy/variance").BreakpointMap<import("csstype").Property.GridRow | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | undefined> | import("@codecademy/variance").BreakpointArray<import("csstype").Property.GridRow | ((theme: import("@emotion/react").Theme) => import("csstype").Property.GridRow | undefined) | undefined> | undefined;
1465
1471
  inset?: import("@codecademy/variance/dist/types/config").Scale<{
1466
1472
  readonly property: "inset";
1467
1473
  readonly properties: {
@@ -1818,10 +1824,12 @@ export declare const DynamicCardWrapper: import("@emotion/styled").StyledCompone
1818
1824
  context?: boolean | undefined;
1819
1825
  "no-select"?: boolean | undefined;
1820
1826
  as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
1821
- } & import("framer-motion").MotionProps & {
1827
+ } & import("framer-motion/dist/types.d-CQ4vRM6h").M, "children"> & {
1828
+ children?: string | number | boolean | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | import("react").ReactPortal | import("motion-dom").MotionValue<number> | import("motion-dom").MotionValue<string> | (string & import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) | (string & Iterable<import("react").ReactNode>) | (string & import("react").ReactPortal) | (number & import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) | (number & Iterable<import("react").ReactNode>) | (number & import("react").ReactPortal) | (false & import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) | (false & Iterable<import("react").ReactNode>) | (false & import("react").ReactPortal) | (true & import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) | (true & Iterable<import("react").ReactNode>) | (true & import("react").ReactPortal) | (import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> & string) | (import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> & number) | (import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> & false) | (import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> & true) | (import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> & Iterable<import("react").ReactNode>) | (import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> & import("react").ReactPortal) | (Iterable<import("react").ReactNode> & string) | (Iterable<import("react").ReactNode> & number) | (Iterable<import("react").ReactNode> & false) | (Iterable<import("react").ReactNode> & true) | (Iterable<import("react").ReactNode> & import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) | (Iterable<import("react").ReactNode> & import("react").ReactPortal) | (import("react").ReactPortal & string) | (import("react").ReactPortal & number) | (import("react").ReactPortal & false) | (import("react").ReactPortal & true) | (import("react").ReactPortal & import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) | (import("react").ReactPortal & Iterable<import("react").ReactNode>) | (import("react").ReactNode[] & string) | (import("react").ReactNode[] & number) | (import("react").ReactNode[] & false) | (import("react").ReactNode[] & true) | (import("react").ReactNode[] & import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) | (import("react").ReactNode[] & Iterable<import("react").ReactNode>) | (import("react").ReactNode[] & import("react").ReactPortal) | null | undefined;
1829
+ } & {
1822
1830
  theme?: import("@emotion/react").Theme | undefined;
1823
1831
  } & CardWrapperProps, {}, {}>;
1824
- export declare const StaticCardWrapper: import("@emotion/styled").StyledComponent<{
1832
+ export declare const StaticCardWrapper: import("@emotion/styled").StyledComponent<Omit<{
1825
1833
  color?: import("@codecademy/variance/dist/types/config").Scale<{
1826
1834
  readonly property: "color";
1827
1835
  readonly scale: "colors";
@@ -1841,6 +1849,8 @@ export declare const StaticCardWrapper: import("@emotion/styled").StyledComponen
1841
1849
  title?: string | undefined;
1842
1850
  dir?: string | undefined;
1843
1851
  className?: string | undefined;
1852
+ ref?: import("react").LegacyRef<HTMLDivElement> | undefined;
1853
+ key?: import("react").Key | null | undefined;
1844
1854
  height?: import("@codecademy/variance/dist/types/config").Scale<{
1845
1855
  readonly property: {
1846
1856
  readonly physical: "height";
@@ -1857,9 +1867,7 @@ export declare const StaticCardWrapper: import("@emotion/styled").StyledComponen
1857
1867
  readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
1858
1868
  readonly transform: (value: string | number) => string | 0;
1859
1869
  }>;
1860
- "aria-hidden"?: (boolean | "false" | "true") | undefined;
1861
- ref?: import("react").LegacyRef<HTMLDivElement> | undefined;
1862
- key?: import("react").Key | null | undefined;
1870
+ "aria-hidden"?: (boolean | "true" | "false") | undefined;
1863
1871
  defaultChecked?: boolean | undefined;
1864
1872
  defaultValue?: string | number | readonly string[] | undefined;
1865
1873
  suppressContentEditableWarning?: boolean | undefined;
@@ -1867,17 +1875,17 @@ export declare const StaticCardWrapper: import("@emotion/styled").StyledComponen
1867
1875
  accessKey?: string | undefined;
1868
1876
  autoCapitalize?: (string & {}) | "none" | "off" | "on" | "sentences" | "words" | "characters" | undefined;
1869
1877
  autoFocus?: boolean | undefined;
1870
- contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
1878
+ contentEditable?: "inherit" | (boolean | "true" | "false") | "plaintext-only" | undefined;
1871
1879
  contextMenu?: string | undefined;
1872
- draggable?: (boolean | "false" | "true") | undefined;
1873
- enterKeyHint?: "search" | "next" | "enter" | "done" | "go" | "previous" | "send" | undefined;
1880
+ draggable?: (boolean | "true" | "false") | undefined;
1881
+ enterKeyHint?: "search" | "enter" | "done" | "go" | "next" | "previous" | "send" | undefined;
1874
1882
  hidden?: boolean | undefined;
1875
1883
  id?: string | undefined;
1876
1884
  lang?: string | undefined;
1877
1885
  nonce?: string | undefined;
1878
- spellCheck?: (boolean | "false" | "true") | undefined;
1886
+ spellCheck?: (boolean | "true" | "false") | undefined;
1879
1887
  tabIndex?: number | undefined;
1880
- translate?: "no" | "yes" | undefined;
1888
+ translate?: "yes" | "no" | undefined;
1881
1889
  radioGroup?: string | undefined;
1882
1890
  role?: import("react").AriaRole | undefined;
1883
1891
  about?: string | undefined;
@@ -1906,51 +1914,51 @@ export declare const StaticCardWrapper: import("@emotion/styled").StyledComponen
1906
1914
  exportparts?: string | undefined;
1907
1915
  part?: string | undefined;
1908
1916
  "aria-activedescendant"?: string | undefined;
1909
- "aria-atomic"?: (boolean | "false" | "true") | undefined;
1910
- "aria-autocomplete"?: "none" | "inline" | "both" | "list" | undefined;
1917
+ "aria-atomic"?: (boolean | "true" | "false") | undefined;
1918
+ "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined;
1911
1919
  "aria-braillelabel"?: string | undefined;
1912
1920
  "aria-brailleroledescription"?: string | undefined;
1913
- "aria-busy"?: (boolean | "false" | "true") | undefined;
1914
- "aria-checked"?: boolean | "mixed" | "false" | "true" | undefined;
1921
+ "aria-busy"?: (boolean | "true" | "false") | undefined;
1922
+ "aria-checked"?: boolean | "true" | "false" | "mixed" | undefined;
1915
1923
  "aria-colcount"?: number | undefined;
1916
1924
  "aria-colindex"?: number | undefined;
1917
1925
  "aria-colindextext"?: string | undefined;
1918
1926
  "aria-colspan"?: number | undefined;
1919
1927
  "aria-controls"?: string | undefined;
1920
- "aria-current"?: boolean | "time" | "page" | "false" | "true" | "step" | "location" | "date" | undefined;
1928
+ "aria-current"?: boolean | "time" | "page" | "true" | "false" | "step" | "location" | "date" | undefined;
1921
1929
  "aria-describedby"?: string | undefined;
1922
1930
  "aria-description"?: string | undefined;
1923
1931
  "aria-details"?: string | undefined;
1924
- "aria-disabled"?: (boolean | "false" | "true") | undefined;
1932
+ "aria-disabled"?: (boolean | "true" | "false") | undefined;
1925
1933
  "aria-dropeffect"?: "link" | "none" | "copy" | "move" | "execute" | "popup" | undefined;
1926
1934
  "aria-errormessage"?: string | undefined;
1927
- "aria-expanded"?: (boolean | "false" | "true") | undefined;
1935
+ "aria-expanded"?: (boolean | "true" | "false") | undefined;
1928
1936
  "aria-flowto"?: string | undefined;
1929
- "aria-grabbed"?: (boolean | "false" | "true") | undefined;
1930
- "aria-haspopup"?: boolean | "dialog" | "menu" | "grid" | "listbox" | "false" | "true" | "tree" | undefined;
1931
- "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
1937
+ "aria-grabbed"?: (boolean | "true" | "false") | undefined;
1938
+ "aria-haspopup"?: boolean | "dialog" | "menu" | "grid" | "true" | "false" | "listbox" | "tree" | undefined;
1939
+ "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
1932
1940
  "aria-keyshortcuts"?: string | undefined;
1933
1941
  "aria-label"?: string | undefined;
1934
1942
  "aria-labelledby"?: string | undefined;
1935
1943
  "aria-level"?: number | undefined;
1936
1944
  "aria-live"?: "off" | "assertive" | "polite" | undefined;
1937
- "aria-modal"?: (boolean | "false" | "true") | undefined;
1938
- "aria-multiline"?: (boolean | "false" | "true") | undefined;
1939
- "aria-multiselectable"?: (boolean | "false" | "true") | undefined;
1945
+ "aria-modal"?: (boolean | "true" | "false") | undefined;
1946
+ "aria-multiline"?: (boolean | "true" | "false") | undefined;
1947
+ "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
1940
1948
  "aria-orientation"?: "horizontal" | "vertical" | undefined;
1941
1949
  "aria-owns"?: string | undefined;
1942
1950
  "aria-placeholder"?: string | undefined;
1943
1951
  "aria-posinset"?: number | undefined;
1944
- "aria-pressed"?: boolean | "mixed" | "false" | "true" | undefined;
1945
- "aria-readonly"?: (boolean | "false" | "true") | undefined;
1952
+ "aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
1953
+ "aria-readonly"?: (boolean | "true" | "false") | undefined;
1946
1954
  "aria-relevant"?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
1947
- "aria-required"?: (boolean | "false" | "true") | undefined;
1955
+ "aria-required"?: (boolean | "true" | "false") | undefined;
1948
1956
  "aria-roledescription"?: string | undefined;
1949
1957
  "aria-rowcount"?: number | undefined;
1950
1958
  "aria-rowindex"?: number | undefined;
1951
1959
  "aria-rowindextext"?: string | undefined;
1952
1960
  "aria-rowspan"?: number | undefined;
1953
- "aria-selected"?: (boolean | "false" | "true") | undefined;
1961
+ "aria-selected"?: (boolean | "true" | "false") | undefined;
1954
1962
  "aria-setsize"?: number | undefined;
1955
1963
  "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
1956
1964
  "aria-valuemax"?: number | undefined;
@@ -2706,6 +2714,8 @@ export declare const StaticCardWrapper: import("@emotion/styled").StyledComponen
2706
2714
  theme?: import("@emotion/react").Theme | undefined;
2707
2715
  as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
2708
2716
  variables?: import("@emotion/styled").CSSObject | undefined;
2709
- } & import("framer-motion").MotionProps & {
2717
+ } & import("framer-motion/dist/types.d-CQ4vRM6h").M, "children"> & {
2718
+ children?: import("react").ReactNode | import("motion-dom").MotionValue<number> | import("motion-dom").MotionValue<string>;
2719
+ } & {
2710
2720
  theme?: import("@emotion/react").Theme | undefined;
2711
2721
  } & CardWrapperProps, {}, {}>;