@okta/odyssey-react-mui 1.9.10 → 1.9.12

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 (193) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/@types/react-augment.d.js.map +1 -1
  3. package/dist/Accordion.js +3 -1
  4. package/dist/Accordion.js.map +1 -1
  5. package/dist/AllowedProps.js +2 -0
  6. package/dist/AllowedProps.js.map +1 -0
  7. package/dist/Autocomplete.js +4 -2
  8. package/dist/Autocomplete.js.map +1 -1
  9. package/dist/Badge.js +4 -0
  10. package/dist/Badge.js.map +1 -1
  11. package/dist/Banner.js +5 -1
  12. package/dist/Banner.js.map +1 -1
  13. package/dist/Box.js +4 -2
  14. package/dist/Box.js.map +1 -1
  15. package/dist/Breadcrumbs.js +5 -1
  16. package/dist/Breadcrumbs.js.map +1 -1
  17. package/dist/Button.js +15 -2
  18. package/dist/Button.js.map +1 -1
  19. package/dist/Callout.js +4 -1
  20. package/dist/Callout.js.map +1 -1
  21. package/dist/Checkbox.js +17 -3
  22. package/dist/Checkbox.js.map +1 -1
  23. package/dist/CheckboxGroup.js +4 -2
  24. package/dist/CheckboxGroup.js.map +1 -1
  25. package/dist/CircularProgress.js.map +1 -1
  26. package/dist/Dialog.js +2 -0
  27. package/dist/Dialog.js.map +1 -1
  28. package/dist/FieldError.js +4 -1
  29. package/dist/FieldError.js.map +1 -1
  30. package/dist/FieldHint.js +3 -1
  31. package/dist/FieldHint.js.map +1 -1
  32. package/dist/FieldLabel.js +4 -1
  33. package/dist/FieldLabel.js.map +1 -1
  34. package/dist/Fieldset.js +4 -1
  35. package/dist/Fieldset.js.map +1 -1
  36. package/dist/Form.js +4 -1
  37. package/dist/Form.js.map +1 -1
  38. package/dist/Link.js +14 -1
  39. package/dist/Link.js.map +1 -1
  40. package/dist/MenuButton.js +3 -1
  41. package/dist/MenuButton.js.map +1 -1
  42. package/dist/MenuItem.js.map +1 -1
  43. package/dist/NativeSelect.js +4 -2
  44. package/dist/NativeSelect.js.map +1 -1
  45. package/dist/PasswordField.js +15 -2
  46. package/dist/PasswordField.js.map +1 -1
  47. package/dist/Radio.js +14 -1
  48. package/dist/Radio.js.map +1 -1
  49. package/dist/RadioGroup.js +3 -1
  50. package/dist/RadioGroup.js.map +1 -1
  51. package/dist/ScreenReaderText.js +3 -1
  52. package/dist/ScreenReaderText.js.map +1 -1
  53. package/dist/SearchField.js +3 -1
  54. package/dist/SearchField.js.map +1 -1
  55. package/dist/Select.js +16 -3
  56. package/dist/Select.js.map +1 -1
  57. package/dist/Status.js +2 -0
  58. package/dist/Status.js.map +1 -1
  59. package/dist/Tabs.js.map +1 -1
  60. package/dist/Tag.js +5 -3
  61. package/dist/Tag.js.map +1 -1
  62. package/dist/TagList.js.map +1 -1
  63. package/dist/TextField.js +18 -3
  64. package/dist/TextField.js.map +1 -1
  65. package/dist/Toast.js +4 -1
  66. package/dist/Toast.js.map +1 -1
  67. package/dist/Tooltip.js +3 -1
  68. package/dist/Tooltip.js.map +1 -1
  69. package/dist/Typography.js +45 -11
  70. package/dist/Typography.js.map +1 -1
  71. package/dist/labs/Switch.js.map +1 -1
  72. package/dist/labs/VirtualizedAutocomplete.js +4 -2
  73. package/dist/labs/VirtualizedAutocomplete.js.map +1 -1
  74. package/dist/src/Accordion.d.ts +3 -3
  75. package/dist/src/Accordion.d.ts.map +1 -1
  76. package/dist/src/{SeleniumProps.d.ts → AllowedProps.d.ts} +6 -2
  77. package/dist/src/AllowedProps.d.ts.map +1 -0
  78. package/dist/src/Autocomplete.d.ts +3 -3
  79. package/dist/src/Autocomplete.d.ts.map +1 -1
  80. package/dist/src/Badge.d.ts +3 -3
  81. package/dist/src/Badge.d.ts.map +1 -1
  82. package/dist/src/Banner.d.ts +3 -3
  83. package/dist/src/Banner.d.ts.map +1 -1
  84. package/dist/src/Box.d.ts +3 -3
  85. package/dist/src/Box.d.ts.map +1 -1
  86. package/dist/src/Breadcrumbs.d.ts +3 -2
  87. package/dist/src/Breadcrumbs.d.ts.map +1 -1
  88. package/dist/src/Button.d.ts +8 -3
  89. package/dist/src/Button.d.ts.map +1 -1
  90. package/dist/src/Callout.d.ts +3 -3
  91. package/dist/src/Callout.d.ts.map +1 -1
  92. package/dist/src/Checkbox.d.ts +8 -3
  93. package/dist/src/Checkbox.d.ts.map +1 -1
  94. package/dist/src/CheckboxGroup.d.ts +3 -3
  95. package/dist/src/CheckboxGroup.d.ts.map +1 -1
  96. package/dist/src/CircularProgress.d.ts +2 -2
  97. package/dist/src/CircularProgress.d.ts.map +1 -1
  98. package/dist/src/Dialog.d.ts +3 -3
  99. package/dist/src/Dialog.d.ts.map +1 -1
  100. package/dist/src/FieldError.d.ts +3 -3
  101. package/dist/src/FieldError.d.ts.map +1 -1
  102. package/dist/src/FieldHint.d.ts +3 -3
  103. package/dist/src/FieldHint.d.ts.map +1 -1
  104. package/dist/src/FieldLabel.d.ts +3 -3
  105. package/dist/src/FieldLabel.d.ts.map +1 -1
  106. package/dist/src/Fieldset.d.ts +3 -3
  107. package/dist/src/Fieldset.d.ts.map +1 -1
  108. package/dist/src/Form.d.ts +3 -3
  109. package/dist/src/Form.d.ts.map +1 -1
  110. package/dist/src/Link.d.ts +8 -3
  111. package/dist/src/Link.d.ts.map +1 -1
  112. package/dist/src/MenuButton.d.ts +3 -3
  113. package/dist/src/MenuButton.d.ts.map +1 -1
  114. package/dist/src/MenuItem.d.ts +2 -2
  115. package/dist/src/MenuItem.d.ts.map +1 -1
  116. package/dist/src/NativeSelect.d.ts +2 -2
  117. package/dist/src/NativeSelect.d.ts.map +1 -1
  118. package/dist/src/PasswordField.d.ts +12 -3
  119. package/dist/src/PasswordField.d.ts.map +1 -1
  120. package/dist/src/Radio.d.ts +8 -3
  121. package/dist/src/Radio.d.ts.map +1 -1
  122. package/dist/src/RadioGroup.d.ts +3 -3
  123. package/dist/src/RadioGroup.d.ts.map +1 -1
  124. package/dist/src/ScreenReaderText.d.ts +3 -2
  125. package/dist/src/ScreenReaderText.d.ts.map +1 -1
  126. package/dist/src/SearchField.d.ts +3 -3
  127. package/dist/src/SearchField.d.ts.map +1 -1
  128. package/dist/src/Select.d.ts +8 -3
  129. package/dist/src/Select.d.ts.map +1 -1
  130. package/dist/src/Status.d.ts +3 -3
  131. package/dist/src/Status.d.ts.map +1 -1
  132. package/dist/src/Tabs.d.ts +2 -2
  133. package/dist/src/Tabs.d.ts.map +1 -1
  134. package/dist/src/Tag.d.ts +3 -3
  135. package/dist/src/Tag.d.ts.map +1 -1
  136. package/dist/src/TagList.d.ts +2 -2
  137. package/dist/src/TagList.d.ts.map +1 -1
  138. package/dist/src/TextField.d.ts +12 -3
  139. package/dist/src/TextField.d.ts.map +1 -1
  140. package/dist/src/Toast.d.ts +3 -3
  141. package/dist/src/Toast.d.ts.map +1 -1
  142. package/dist/src/Tooltip.d.ts +3 -3
  143. package/dist/src/Tooltip.d.ts.map +1 -1
  144. package/dist/src/Typography.d.ts +18 -13
  145. package/dist/src/Typography.d.ts.map +1 -1
  146. package/dist/src/labs/Switch.d.ts +2 -2
  147. package/dist/src/labs/Switch.d.ts.map +1 -1
  148. package/dist/src/labs/VirtualizedAutocomplete.d.ts +3 -3
  149. package/dist/src/labs/VirtualizedAutocomplete.d.ts.map +1 -1
  150. package/dist/tsconfig.production.tsbuildinfo +1 -1
  151. package/package.json +3 -3
  152. package/src/@types/react-augment.d.ts +4 -0
  153. package/src/Accordion.tsx +6 -3
  154. package/src/{SeleniumProps.ts → AllowedProps.ts} +5 -1
  155. package/src/Autocomplete.tsx +4 -2
  156. package/src/Badge.tsx +9 -3
  157. package/src/Banner.tsx +8 -5
  158. package/src/Box.tsx +4 -3
  159. package/src/Breadcrumbs.tsx +6 -1
  160. package/src/Button.tsx +33 -3
  161. package/src/Callout.tsx +14 -5
  162. package/src/Checkbox.tsx +28 -5
  163. package/src/CheckboxGroup.tsx +5 -3
  164. package/src/CircularProgress.tsx +2 -2
  165. package/src/Dialog.tsx +4 -3
  166. package/src/FieldError.tsx +5 -5
  167. package/src/FieldHint.tsx +10 -4
  168. package/src/FieldLabel.tsx +11 -5
  169. package/src/Fieldset.tsx +5 -4
  170. package/src/Form.tsx +9 -4
  171. package/src/Link.tsx +46 -21
  172. package/src/MenuButton.tsx +4 -2
  173. package/src/MenuItem.tsx +2 -2
  174. package/src/NativeSelect.tsx +5 -2
  175. package/src/PasswordField.tsx +27 -2
  176. package/src/Radio.tsx +26 -4
  177. package/src/RadioGroup.tsx +5 -3
  178. package/src/ScreenReaderText.tsx +4 -3
  179. package/src/SearchField.tsx +5 -2
  180. package/src/Select.tsx +35 -3
  181. package/src/Status.tsx +4 -2
  182. package/src/Tabs.tsx +2 -2
  183. package/src/Tag.tsx +14 -3
  184. package/src/TagList.tsx +2 -2
  185. package/src/TextField.tsx +33 -4
  186. package/src/Toast.tsx +5 -4
  187. package/src/Tooltip.tsx +4 -2
  188. package/src/Typography.tsx +54 -3
  189. package/src/labs/Switch.tsx +2 -2
  190. package/src/labs/VirtualizedAutocomplete.tsx +4 -2
  191. package/dist/SeleniumProps.js +0 -2
  192. package/dist/SeleniumProps.js.map +0 -1
  193. package/dist/src/SeleniumProps.d.ts.map +0 -1
package/dist/Tag.js CHANGED
@@ -21,7 +21,8 @@ const Tag = _ref => {
21
21
  label,
22
22
  onClick,
23
23
  onRemove,
24
- testId
24
+ testId,
25
+ translate
25
26
  } = _ref;
26
27
  const {
27
28
  chipElementType
@@ -36,8 +37,9 @@ const Tag = _ref => {
36
37
  icon: icon,
37
38
  label: label,
38
39
  onClick: onClick,
39
- onDelete: onRemove
40
- }), [chipElementType, icon, isDisabled, label, onClick, onRemove, testId]);
40
+ onDelete: onRemove,
41
+ translate: translate
42
+ }), [chipElementType, icon, isDisabled, label, onClick, onRemove, testId, translate]);
41
43
  return _jsx(MuiPropsContext.Consumer, {
42
44
  children: renderTag
43
45
  });
package/dist/Tag.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Tag.js","names":["memo","useCallback","useContext","TagListContext","MuiPropsContext","jsx","_jsx","Tag","_ref","icon","isDisabled","label","onClick","onRemove","testId","chipElementType","renderTag","muiProps","_Chip","clickable","component","disabled","onDelete","Consumer","children","MemoizedTag","displayName"],"sources":["../src/Tag.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { Chip as MuiChip, ChipProps as MuiChipProps } from \"@mui/material\";\nimport { memo, ReactElement, useCallback, useContext } from \"react\";\nimport { TagListContext } from \"./TagListContext\";\nimport { MuiPropsContext } from \"./MuiPropsContext\";\nimport { SeleniumProps } from \"./SeleniumProps\";\n\nexport type TagProps = {\n icon?: ReactElement;\n isDisabled?: boolean;\n /**\n * The label text for the Tag\n */\n label: string;\n /**\n * Callback fired when the Tag is clicked\n */\n onClick?: MuiChipProps[\"onClick\"];\n /**\n * Callback fired when the remove button of the Tag is clicked\n */\n onRemove?: MuiChipProps[\"onDelete\"];\n} & SeleniumProps;\n\nconst Tag = ({\n icon,\n isDisabled,\n label,\n onClick,\n onRemove,\n testId,\n}: TagProps) => {\n const { chipElementType } = useContext(TagListContext);\n\n const renderTag = useCallback(\n (muiProps) => (\n <MuiChip\n {...muiProps}\n aria-disabled={isDisabled}\n clickable={onClick ? true : false}\n component={chipElementType}\n data-se={testId}\n disabled={isDisabled}\n icon={icon}\n label={label}\n onClick={onClick}\n onDelete={onRemove}\n />\n ),\n [chipElementType, icon, isDisabled, label, onClick, onRemove, testId]\n );\n\n return <MuiPropsContext.Consumer>{renderTag}</MuiPropsContext.Consumer>;\n};\n\nconst MemoizedTag = memo(Tag);\nMemoizedTag.displayName = \"Tag\";\n\nexport { MemoizedTag as Tag };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,SAASA,IAAI,EAAgBC,WAAW,EAAEC,UAAU,QAAQ,OAAO;AAAC,SAC3DC,cAAc;AAAA,SACdC,eAAe;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAoBxB,MAAMC,GAAG,GAAGC,IAAA,IAOI;EAAA,IAPH;IACXC,IAAI;IACJC,UAAU;IACVC,KAAK;IACLC,OAAO;IACPC,QAAQ;IACRC;EACQ,CAAC,GAAAN,IAAA;EACT,MAAM;IAAEO;EAAgB,CAAC,GAAGb,UAAU,CAACC,cAAc,CAAC;EAEtD,MAAMa,SAAS,GAAGf,WAAW,CAC1BgB,QAAQ,IACPX,IAAA,CAAAY,KAAA;IAAA,GACMD,QAAQ;IACZ,iBAAeP,UAAW;IAC1BS,SAAS,EAAEP,OAAO,GAAG,IAAI,GAAG,KAAM;IAClCQ,SAAS,EAAEL,eAAgB;IAC3B,WAASD,MAAO;IAChBO,QAAQ,EAAEX,UAAW;IACrBD,IAAI,EAAEA,IAAK;IACXE,KAAK,EAAEA,KAAM;IACbC,OAAO,EAAEA,OAAQ;IACjBU,QAAQ,EAAET;EAAS,CACpB,CACF,EACD,CAACE,eAAe,EAAEN,IAAI,EAAEC,UAAU,EAAEC,KAAK,EAAEC,OAAO,EAAEC,QAAQ,EAAEC,MAAM,CACtE,CAAC;EAED,OAAOR,IAAA,CAACF,eAAe,CAACmB,QAAQ;IAAAC,QAAA,EAAER;EAAS,CAA2B,CAAC;AACzE,CAAC;AAED,MAAMS,WAAW,GAAGzB,IAAI,CAACO,GAAG,CAAC;AAC7BkB,WAAW,CAACC,WAAW,GAAG,KAAK;AAE/B,SAASD,WAAW,IAAIlB,GAAG"}
1
+ {"version":3,"file":"Tag.js","names":["memo","useCallback","useContext","TagListContext","MuiPropsContext","jsx","_jsx","Tag","_ref","icon","isDisabled","label","onClick","onRemove","testId","translate","chipElementType","renderTag","muiProps","_Chip","clickable","component","disabled","onDelete","Consumer","children","MemoizedTag","displayName"],"sources":["../src/Tag.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { Chip as MuiChip, ChipProps as MuiChipProps } from \"@mui/material\";\nimport { memo, ReactElement, useCallback, useContext } from \"react\";\nimport { TagListContext } from \"./TagListContext\";\nimport { MuiPropsContext } from \"./MuiPropsContext\";\nimport { AllowedProps } from \"./AllowedProps\";\n\nexport type TagProps = {\n icon?: ReactElement;\n isDisabled?: boolean;\n /**\n * The label text for the Tag\n */\n label: string;\n /**\n * Callback fired when the Tag is clicked\n */\n onClick?: MuiChipProps[\"onClick\"];\n /**\n * Callback fired when the remove button of the Tag is clicked\n */\n onRemove?: MuiChipProps[\"onDelete\"];\n} & AllowedProps;\n\nconst Tag = ({\n icon,\n isDisabled,\n label,\n onClick,\n onRemove,\n testId,\n translate,\n}: TagProps) => {\n const { chipElementType } = useContext(TagListContext);\n\n const renderTag = useCallback(\n (muiProps) => (\n <MuiChip\n {...muiProps}\n aria-disabled={isDisabled}\n clickable={onClick ? true : false}\n component={chipElementType}\n data-se={testId}\n disabled={isDisabled}\n icon={icon}\n label={label}\n onClick={onClick}\n onDelete={onRemove}\n translate={translate}\n />\n ),\n [\n chipElementType,\n icon,\n isDisabled,\n label,\n onClick,\n onRemove,\n testId,\n translate,\n ]\n );\n\n return <MuiPropsContext.Consumer>{renderTag}</MuiPropsContext.Consumer>;\n};\n\nconst MemoizedTag = memo(Tag);\nMemoizedTag.displayName = \"Tag\";\n\nexport { MemoizedTag as Tag };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,SAASA,IAAI,EAAgBC,WAAW,EAAEC,UAAU,QAAQ,OAAO;AAAC,SAC3DC,cAAc;AAAA,SACdC,eAAe;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAoBxB,MAAMC,GAAG,GAAGC,IAAA,IAQI;EAAA,IARH;IACXC,IAAI;IACJC,UAAU;IACVC,KAAK;IACLC,OAAO;IACPC,QAAQ;IACRC,MAAM;IACNC;EACQ,CAAC,GAAAP,IAAA;EACT,MAAM;IAAEQ;EAAgB,CAAC,GAAGd,UAAU,CAACC,cAAc,CAAC;EAEtD,MAAMc,SAAS,GAAGhB,WAAW,CAC1BiB,QAAQ,IACPZ,IAAA,CAAAa,KAAA;IAAA,GACMD,QAAQ;IACZ,iBAAeR,UAAW;IAC1BU,SAAS,EAAER,OAAO,GAAG,IAAI,GAAG,KAAM;IAClCS,SAAS,EAAEL,eAAgB;IAC3B,WAASF,MAAO;IAChBQ,QAAQ,EAAEZ,UAAW;IACrBD,IAAI,EAAEA,IAAK;IACXE,KAAK,EAAEA,KAAM;IACbC,OAAO,EAAEA,OAAQ;IACjBW,QAAQ,EAAEV,QAAS;IACnBE,SAAS,EAAEA;EAAU,CACtB,CACF,EACD,CACEC,eAAe,EACfP,IAAI,EACJC,UAAU,EACVC,KAAK,EACLC,OAAO,EACPC,QAAQ,EACRC,MAAM,EACNC,SAAS,CAEb,CAAC;EAED,OAAOT,IAAA,CAACF,eAAe,CAACoB,QAAQ;IAAAC,QAAA,EAAER;EAAS,CAA2B,CAAC;AACzE,CAAC;AAED,MAAMS,WAAW,GAAG1B,IAAI,CAACO,GAAG,CAAC;AAC7BmB,WAAW,CAACC,WAAW,GAAG,KAAK;AAE/B,SAASD,WAAW,IAAInB,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"file":"TagList.js","names":["memo","useMemo","TagListContext","jsx","_jsx","TagList","_ref","children","testId","providerValue","chipElementType","_Stack","component","direction","spacing","useFlexGap","flexWrap","Provider","value","MemoizedTagList","displayName"],"sources":["../src/TagList.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { Tag } from \"./Tag\";\nimport { Stack } from \"@mui/material\";\nimport { memo, ReactElement, useMemo } from \"react\";\nimport { ChipElementType, TagListContext } from \"./TagListContext\";\nimport { SeleniumProps } from \"./SeleniumProps\";\n\nexport type TagListProps = {\n /**\n * The Tag or array of Tags within the TagList\n */\n children: ReactElement<typeof Tag> | Array<ReactElement<typeof Tag>>;\n} & SeleniumProps;\n\nconst TagList = ({ children, testId }: TagListProps) => {\n const providerValue = useMemo<{\n chipElementType: ChipElementType;\n }>(\n () => ({\n chipElementType: \"li\",\n }),\n []\n );\n\n return (\n <Stack\n component=\"ul\"\n data-se={testId}\n direction=\"row\"\n spacing={2}\n useFlexGap\n flexWrap=\"wrap\"\n >\n <TagListContext.Provider value={providerValue}>\n {children}\n </TagListContext.Provider>\n </Stack>\n );\n};\n\nconst MemoizedTagList = memo(TagList);\nMemoizedTagList.displayName = \"TagList\";\n\nexport { MemoizedTagList as TagList };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA,SAASA,IAAI,EAAgBC,OAAO,QAAQ,OAAO;AAAC,SAC1BC,cAAc;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAUxC,MAAMC,OAAO,GAAGC,IAAA,IAAwC;EAAA,IAAvC;IAAEC,QAAQ;IAAEC;EAAqB,CAAC,GAAAF,IAAA;EACjD,MAAMG,aAAa,GAAGR,OAAO,CAG3B,OAAO;IACLS,eAAe,EAAE;EACnB,CAAC,CAAC,EACF,EACF,CAAC;EAED,OACEN,IAAA,CAAAO,MAAA;IACEC,SAAS,EAAC,IAAI;IACd,WAASJ,MAAO;IAChBK,SAAS,EAAC,KAAK;IACfC,OAAO,EAAE,CAAE;IACXC,UAAU;IACVC,QAAQ,EAAC,MAAM;IAAAT,QAAA,EAEfH,IAAA,CAACF,cAAc,CAACe,QAAQ;MAACC,KAAK,EAAET,aAAc;MAAAF,QAAA,EAC3CA;IAAQ,CACc;EAAC,CACrB,CAAC;AAEZ,CAAC;AAED,MAAMY,eAAe,GAAGnB,IAAI,CAACK,OAAO,CAAC;AACrCc,eAAe,CAACC,WAAW,GAAG,SAAS;AAEvC,SAASD,eAAe,IAAId,OAAO"}
1
+ {"version":3,"file":"TagList.js","names":["memo","useMemo","TagListContext","jsx","_jsx","TagList","_ref","children","testId","providerValue","chipElementType","_Stack","component","direction","spacing","useFlexGap","flexWrap","Provider","value","MemoizedTagList","displayName"],"sources":["../src/TagList.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { Tag } from \"./Tag\";\nimport { Stack } from \"@mui/material\";\nimport { memo, ReactElement, useMemo } from \"react\";\nimport { ChipElementType, TagListContext } from \"./TagListContext\";\nimport { AllowedProps } from \"./AllowedProps\";\n\nexport type TagListProps = {\n /**\n * The Tag or array of Tags within the TagList\n */\n children: ReactElement<typeof Tag> | Array<ReactElement<typeof Tag>>;\n} & AllowedProps;\n\nconst TagList = ({ children, testId }: TagListProps) => {\n const providerValue = useMemo<{\n chipElementType: ChipElementType;\n }>(\n () => ({\n chipElementType: \"li\",\n }),\n []\n );\n\n return (\n <Stack\n component=\"ul\"\n data-se={testId}\n direction=\"row\"\n spacing={2}\n useFlexGap\n flexWrap=\"wrap\"\n >\n <TagListContext.Provider value={providerValue}>\n {children}\n </TagListContext.Provider>\n </Stack>\n );\n};\n\nconst MemoizedTagList = memo(TagList);\nMemoizedTagList.displayName = \"TagList\";\n\nexport { MemoizedTagList as TagList };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA,SAASA,IAAI,EAAgBC,OAAO,QAAQ,OAAO;AAAC,SAC1BC,cAAc;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAUxC,MAAMC,OAAO,GAAGC,IAAA,IAAwC;EAAA,IAAvC;IAAEC,QAAQ;IAAEC;EAAqB,CAAC,GAAAF,IAAA;EACjD,MAAMG,aAAa,GAAGR,OAAO,CAG3B,OAAO;IACLS,eAAe,EAAE;EACnB,CAAC,CAAC,EACF,EACF,CAAC;EAED,OACEN,IAAA,CAAAO,MAAA;IACEC,SAAS,EAAC,IAAI;IACd,WAASJ,MAAO;IAChBK,SAAS,EAAC,KAAK;IACfC,OAAO,EAAE,CAAE;IACXC,UAAU;IACVC,QAAQ,EAAC,MAAM;IAAAT,QAAA,EAEfH,IAAA,CAACF,cAAc,CAACe,QAAQ;MAACC,KAAK,EAAET,aAAc;MAAAF,QAAA,EAC3CA;IAAQ,CACc;EAAC,CACrB,CAAC;AAEZ,CAAC;AAED,MAAMY,eAAe,GAAGnB,IAAI,CAACK,OAAO,CAAC;AACrCc,eAAe,CAACC,WAAW,GAAG,SAAS;AAEvC,SAASD,eAAe,IAAId,OAAO"}
package/dist/TextField.js CHANGED
@@ -12,7 +12,7 @@ import _InputAdornment from "@mui/material/InputAdornment";
12
12
  * See the License for the specific language governing permissions and limitations under the License.
13
13
  */
14
14
 
15
- import { forwardRef, memo, useCallback, useRef } from "react";
15
+ import { forwardRef, memo, useCallback, useImperativeHandle, useRef } from "react";
16
16
  import { Field } from "./Field.js";
17
17
  import { useInputValues, getControlState } from "./inputUtils.js";
18
18
  import { jsx as _jsx } from "react/jsx-runtime";
@@ -27,6 +27,7 @@ const TextField = forwardRef((_ref, ref) => {
27
27
  hint,
28
28
  HintLinkComponent,
29
29
  id: idOverride,
30
+ inputFocusRef,
30
31
  isDisabled = false,
31
32
  isFullWidth = false,
32
33
  isMultiline = false,
@@ -40,6 +41,7 @@ const TextField = forwardRef((_ref, ref) => {
40
41
  placeholder,
41
42
  startAdornment,
42
43
  testId,
44
+ translate,
43
45
  type = "text",
44
46
  value: value
45
47
  } = _ref;
@@ -52,6 +54,15 @@ const TextField = forwardRef((_ref, ref) => {
52
54
  value,
53
55
  controlState: controlledStateRef.current
54
56
  });
57
+ const inputRef = useRef(null);
58
+ useImperativeHandle(inputFocusRef, () => {
59
+ const element = inputRef.current;
60
+ return {
61
+ focus: () => {
62
+ element && element.focus();
63
+ }
64
+ };
65
+ }, []);
55
66
  const onChange = useCallback(event => {
56
67
  onChangeProp?.(event);
57
68
  }, [onChangeProp]);
@@ -74,9 +85,11 @@ const TextField = forwardRef((_ref, ref) => {
74
85
  "data-se": testId,
75
86
  endAdornment: endAdornment && _jsx(_InputAdornment, {
76
87
  position: "end",
88
+ translate: translate,
77
89
  children: endAdornment
78
90
  }),
79
91
  id: id,
92
+ inputRef: inputRef,
80
93
  multiline: isMultiline,
81
94
  name: nameOverride ?? id,
82
95
  onBlur: onBlur,
@@ -88,11 +101,13 @@ const TextField = forwardRef((_ref, ref) => {
88
101
  required: !isOptional,
89
102
  startAdornment: startAdornment && _jsx(_InputAdornment, {
90
103
  position: "start",
104
+ translate: translate,
91
105
  children: startAdornment
92
106
  }),
93
- type: type
107
+ type: type,
108
+ translate: translate
94
109
  });
95
- }, [autoCompleteType, inputValues, hasInitialFocus, endAdornment, isMultiline, nameOverride, onBlur, onChange, onFocus, placeholder, isOptional, isReadOnly, ref, startAdornment, testId, type]);
110
+ }, [autoCompleteType, inputValues, hasInitialFocus, endAdornment, isMultiline, nameOverride, onBlur, onChange, onFocus, placeholder, isOptional, isReadOnly, ref, startAdornment, testId, translate, type]);
96
111
  return _jsx(Field, {
97
112
  errorMessage: errorMessage,
98
113
  fieldType: "single",
@@ -1 +1 @@
1
- {"version":3,"file":"TextField.js","names":["forwardRef","memo","useCallback","useRef","Field","useInputValues","getControlState","jsx","_jsx","textFieldTypeValues","TextField","_ref","ref","autoCompleteType","defaultValue","hasInitialFocus","endAdornment","errorMessage","hint","HintLinkComponent","id","idOverride","isDisabled","isFullWidth","isMultiline","isOptional","isReadOnly","label","name","nameOverride","onBlur","onChange","onChangeProp","onFocus","placeholder","startAdornment","testId","type","value","controlledStateRef","controlledValue","uncontrolledValue","inputValues","controlState","current","event","renderFieldComponent","_ref2","ariaDescribedBy","errorMessageElementId","labelElementId","_InputBase","inputProps","autoComplete","autoFocus","_InputAdornment","position","children","multiline","readOnly","required","fieldType","hasVisibleLabel","MemoizedTextField","displayName"],"sources":["../src/TextField.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n ChangeEventHandler,\n FocusEventHandler,\n forwardRef,\n InputHTMLAttributes,\n memo,\n ReactElement,\n useCallback,\n useRef,\n} from \"react\";\nimport { InputAdornment, InputBase } from \"@mui/material\";\n\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport { Field } from \"./Field\";\nimport { SeleniumProps } from \"./SeleniumProps\";\nimport { useInputValues, getControlState } from \"./inputUtils\";\n\nexport const textFieldTypeValues = [\n \"email\",\n \"number\",\n \"tel\",\n \"text\",\n \"url\",\n] as const;\n\nexport type TextFieldProps = {\n /**\n * This prop helps users to fill forms faster, especially on mobile devices.\n * The name can be confusing, as it's more like an autofill.\n * You can learn more about it [following the specification](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill).\n */\n autoCompleteType?: InputHTMLAttributes<HTMLInputElement>[\"autoComplete\"];\n /**\n * The default value. Use when the component is not controlled.\n */\n defaultValue?: string;\n /**\n * End `InputAdornment` for this component.\n */\n endAdornment?: string | ReactElement;\n /**\n * If `true`, the component will receive focus automatically.\n */\n hasInitialFocus?: boolean;\n /**\n * If `true`, a [TextareaAutosize](/material-ui/react-textarea-autosize/) element is rendered.\n */\n isMultiline?: boolean;\n /**\n * The label for the `input` element.\n */\n label: string;\n /**\n * Callback fired when the `input` element loses focus.\n */\n onBlur?: FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;\n /**\n * Callback fired when the value is changed.\n */\n onChange?: ChangeEventHandler<HTMLTextAreaElement | HTMLInputElement>;\n /**\n * Callback fired when the `input` element get focus.\n */\n onFocus?: FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;\n /**\n * The short hint displayed in the `input` before the user enters a value.\n */\n placeholder?: string;\n /**\n * Start `InputAdornment` for this component.\n */\n startAdornment?: string | ReactElement;\n /**\n * Type of the `input` element. It should be [a valid HTML5 input type](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Form_%3Cinput%3E_types).\n */\n type?: (typeof textFieldTypeValues)[number];\n /**\n * The value of the `input` element, required for a controlled component.\n */\n value?: string;\n} & FieldComponentProps &\n SeleniumProps;\n\nconst TextField = forwardRef<HTMLInputElement, TextFieldProps>(\n (\n {\n autoCompleteType,\n defaultValue,\n hasInitialFocus,\n endAdornment,\n errorMessage,\n hint,\n HintLinkComponent,\n id: idOverride,\n isDisabled = false,\n isFullWidth = false,\n isMultiline = false,\n isOptional = false,\n isReadOnly,\n label,\n name: nameOverride,\n onBlur,\n onChange: onChangeProp,\n onFocus,\n placeholder,\n startAdornment,\n testId,\n type = \"text\",\n value: value,\n },\n ref\n ) => {\n const controlledStateRef = useRef(\n getControlState({\n controlledValue: value,\n uncontrolledValue: defaultValue,\n })\n );\n const inputValues = useInputValues({\n defaultValue,\n value,\n controlState: controlledStateRef.current,\n });\n\n const onChange = useCallback<\n NonNullable<ChangeEventHandler<HTMLTextAreaElement | HTMLInputElement>>\n >(\n (event) => {\n onChangeProp?.(event);\n },\n [onChangeProp]\n );\n\n const renderFieldComponent = useCallback(\n ({ ariaDescribedBy, errorMessageElementId, id, labelElementId }) => (\n <InputBase\n {...inputValues}\n inputProps={{\n \"aria-errormessage\": errorMessageElementId,\n \"aria-labelledby\": labelElementId,\n }}\n aria-describedby={ariaDescribedBy}\n autoComplete={autoCompleteType}\n /* eslint-disable-next-line jsx-a11y/no-autofocus */\n autoFocus={hasInitialFocus}\n data-se={testId}\n endAdornment={\n endAdornment && (\n <InputAdornment position=\"end\">{endAdornment}</InputAdornment>\n )\n }\n id={id}\n multiline={isMultiline}\n name={nameOverride ?? id}\n onBlur={onBlur}\n onChange={onChange}\n onFocus={onFocus}\n placeholder={placeholder}\n readOnly={isReadOnly}\n ref={ref}\n required={!isOptional}\n startAdornment={\n startAdornment && (\n <InputAdornment position=\"start\">{startAdornment}</InputAdornment>\n )\n }\n type={type}\n />\n ),\n [\n autoCompleteType,\n inputValues,\n hasInitialFocus,\n endAdornment,\n isMultiline,\n nameOverride,\n onBlur,\n onChange,\n onFocus,\n placeholder,\n isOptional,\n isReadOnly,\n ref,\n startAdornment,\n testId,\n type,\n ]\n );\n\n return (\n <Field\n errorMessage={errorMessage}\n fieldType=\"single\"\n hasVisibleLabel\n hint={hint}\n HintLinkComponent={HintLinkComponent}\n id={idOverride}\n isDisabled={isDisabled}\n isFullWidth={isFullWidth}\n isOptional={isOptional}\n label={label}\n renderFieldComponent={renderFieldComponent}\n />\n );\n }\n);\n\nconst MemoizedTextField = memo(TextField);\nMemoizedTextField.displayName = \"TextField\";\n\nexport { MemoizedTextField as TextField };\n"],"mappings":"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"}
1
+ {"version":3,"file":"TextField.js","names":["forwardRef","memo","useCallback","useImperativeHandle","useRef","Field","useInputValues","getControlState","jsx","_jsx","textFieldTypeValues","TextField","_ref","ref","autoCompleteType","defaultValue","hasInitialFocus","endAdornment","errorMessage","hint","HintLinkComponent","id","idOverride","inputFocusRef","isDisabled","isFullWidth","isMultiline","isOptional","isReadOnly","label","name","nameOverride","onBlur","onChange","onChangeProp","onFocus","placeholder","startAdornment","testId","translate","type","value","controlledStateRef","controlledValue","uncontrolledValue","inputValues","controlState","current","inputRef","element","focus","event","renderFieldComponent","_ref2","ariaDescribedBy","errorMessageElementId","labelElementId","_InputBase","inputProps","autoComplete","autoFocus","_InputAdornment","position","children","multiline","readOnly","required","fieldType","hasVisibleLabel","MemoizedTextField","displayName"],"sources":["../src/TextField.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n ChangeEventHandler,\n FocusEventHandler,\n forwardRef,\n InputHTMLAttributes,\n memo,\n ReactElement,\n useCallback,\n useImperativeHandle,\n useRef,\n} from \"react\";\nimport { InputAdornment, InputBase } from \"@mui/material\";\n\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport { Field } from \"./Field\";\nimport { AllowedProps } from \"./AllowedProps\";\nimport { useInputValues, getControlState } from \"./inputUtils\";\nimport { FocusHandle } from \"./@types/react-augment\";\n\nexport const textFieldTypeValues = [\n \"email\",\n \"number\",\n \"tel\",\n \"text\",\n \"url\",\n] as const;\n\nexport type TextFieldProps = {\n /**\n * This prop helps users to fill forms faster, especially on mobile devices.\n * The name can be confusing, as it's more like an autofill.\n * You can learn more about it [following the specification](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill).\n */\n autoCompleteType?: InputHTMLAttributes<HTMLInputElement>[\"autoComplete\"];\n /**\n * The default value. Use when the component is not controlled.\n */\n defaultValue?: string;\n /**\n * End `InputAdornment` for this component.\n */\n endAdornment?: string | ReactElement;\n /**\n * If `true`, the component will receive focus automatically.\n */\n hasInitialFocus?: boolean;\n /**\n * The ref forwarded to the TextField to expose focus()\n */\n inputFocusRef?: React.RefObject<FocusHandle>;\n /**\n * If `true`, a [TextareaAutosize](/material-ui/react-textarea-autosize/) element is rendered.\n */\n isMultiline?: boolean;\n /**\n * The label for the `input` element.\n */\n label: string;\n /**\n * Callback fired when the `input` element loses focus.\n */\n onBlur?: FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;\n /**\n * Callback fired when the value is changed.\n */\n onChange?: ChangeEventHandler<HTMLTextAreaElement | HTMLInputElement>;\n /**\n * Callback fired when the `input` element get focus.\n */\n onFocus?: FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;\n /**\n * The short hint displayed in the `input` before the user enters a value.\n */\n placeholder?: string;\n /**\n * Start `InputAdornment` for this component.\n */\n startAdornment?: string | ReactElement;\n /**\n * Type of the `input` element. It should be [a valid HTML5 input type](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Form_%3Cinput%3E_types).\n */\n type?: (typeof textFieldTypeValues)[number];\n /**\n * The value of the `input` element, required for a controlled component.\n */\n value?: string;\n} & FieldComponentProps &\n AllowedProps;\n\nconst TextField = forwardRef<HTMLInputElement, TextFieldProps>(\n (\n {\n autoCompleteType,\n defaultValue,\n hasInitialFocus,\n endAdornment,\n errorMessage,\n hint,\n HintLinkComponent,\n id: idOverride,\n inputFocusRef,\n isDisabled = false,\n isFullWidth = false,\n isMultiline = false,\n isOptional = false,\n isReadOnly,\n label,\n name: nameOverride,\n onBlur,\n onChange: onChangeProp,\n onFocus,\n placeholder,\n startAdornment,\n testId,\n translate,\n type = \"text\",\n value: value,\n },\n ref\n ) => {\n const controlledStateRef = useRef(\n getControlState({\n controlledValue: value,\n uncontrolledValue: defaultValue,\n })\n );\n const inputValues = useInputValues({\n defaultValue,\n value,\n controlState: controlledStateRef.current,\n });\n\n const inputRef = useRef<HTMLInputElement>(null);\n useImperativeHandle(\n inputFocusRef,\n () => {\n const element = inputRef.current;\n return {\n focus: () => {\n element && element.focus();\n },\n };\n },\n []\n );\n\n const onChange = useCallback<\n NonNullable<ChangeEventHandler<HTMLTextAreaElement | HTMLInputElement>>\n >(\n (event) => {\n onChangeProp?.(event);\n },\n [onChangeProp]\n );\n\n const renderFieldComponent = useCallback(\n ({ ariaDescribedBy, errorMessageElementId, id, labelElementId }) => (\n <InputBase\n {...inputValues}\n inputProps={{\n \"aria-errormessage\": errorMessageElementId,\n \"aria-labelledby\": labelElementId,\n }}\n aria-describedby={ariaDescribedBy}\n autoComplete={autoCompleteType}\n /* eslint-disable-next-line jsx-a11y/no-autofocus */\n autoFocus={hasInitialFocus}\n data-se={testId}\n endAdornment={\n endAdornment && (\n <InputAdornment position=\"end\" translate={translate}>\n {endAdornment}\n </InputAdornment>\n )\n }\n id={id}\n inputRef={inputRef}\n multiline={isMultiline}\n name={nameOverride ?? id}\n onBlur={onBlur}\n onChange={onChange}\n onFocus={onFocus}\n placeholder={placeholder}\n readOnly={isReadOnly}\n ref={ref}\n required={!isOptional}\n startAdornment={\n startAdornment && (\n <InputAdornment position=\"start\" translate={translate}>\n {startAdornment}\n </InputAdornment>\n )\n }\n type={type}\n translate={translate}\n />\n ),\n [\n autoCompleteType,\n inputValues,\n hasInitialFocus,\n endAdornment,\n isMultiline,\n nameOverride,\n onBlur,\n onChange,\n onFocus,\n placeholder,\n isOptional,\n isReadOnly,\n ref,\n startAdornment,\n testId,\n translate,\n type,\n ]\n );\n\n return (\n <Field\n errorMessage={errorMessage}\n fieldType=\"single\"\n hasVisibleLabel\n hint={hint}\n HintLinkComponent={HintLinkComponent}\n id={idOverride}\n isDisabled={isDisabled}\n isFullWidth={isFullWidth}\n isOptional={isOptional}\n label={label}\n renderFieldComponent={renderFieldComponent}\n />\n );\n }\n);\n\nconst MemoizedTextField = memo(TextField);\nMemoizedTextField.displayName = \"TextField\";\n\nexport { MemoizedTextField as TextField };\n"],"mappings":"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"}
package/dist/Toast.js CHANGED
@@ -37,7 +37,8 @@ const Toast = _ref => {
37
37
  role,
38
38
  severity,
39
39
  testId,
40
- text
40
+ text,
41
+ translate
41
42
  } = _ref;
42
43
  const {
43
44
  t
@@ -69,6 +70,7 @@ const Toast = _ref => {
69
70
  severity: severity,
70
71
  variant: "toast",
71
72
  children: [_jsxs(_AlertTitle, {
73
+ translate: translate,
72
74
  children: [_jsxs("span", {
73
75
  style: visuallyHidden,
74
76
  children: [severity, ":"]
@@ -76,6 +78,7 @@ const Toast = _ref => {
76
78
  }), linkUrl && _jsx(Link, {
77
79
  href: linkUrl,
78
80
  variant: "monochrome",
81
+ translate: translate,
79
82
  children: linkText
80
83
  })]
81
84
  })
package/dist/Toast.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.js","names":["useEffect","memo","useState","useCallback","visuallyHidden","Link","CloseIcon","Button","useTranslation","jsx","_jsx","jsxs","_jsxs","toastRoleValues","toastSeverityValues","ClickAwayListenerProps","onClickAway","Toast","_ref","autoHideDuration","isDismissable","linkText","linkUrl","isVisible","isVisibleProp","onHide","onHideProp","role","severity","testId","text","t","setIsVisible","_Snackbar","open","undefined","onClose","className","children","_Alert","action","ariaLabel","onClick","size","startIcon","variant","_AlertTitle","style","href","MemoizedToast","displayName"],"sources":["../src/Toast.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { useEffect, memo, useState, useCallback } from \"react\";\nimport { Alert, AlertTitle, Snackbar } from \"@mui/material\";\nimport { visuallyHidden } from \"@mui/utils\";\nimport { Link } from \"./Link\";\nimport { CloseIcon } from \"./icons.generated\";\nimport { Button } from \"./Button\";\nimport { useTranslation } from \"react-i18next\";\nimport { SeleniumProps } from \"./SeleniumProps\";\n\nexport const toastRoleValues = [\"status\", \"alert\"] as const;\nexport const toastSeverityValues = [\n \"success\",\n \"info\",\n \"warning\",\n \"error\",\n] as const;\n\nexport type ToastProps = {\n /**\n * If set, this determines how long the Toast should appear before automatically disappearing in milliseconds.\n * It will only take effect if the Toast is not dismissible.\n * If left blank, it defaults to 6000.\n */\n autoHideDuration?: number;\n /**\n * If `true`, the Toast will include a close button.\n */\n isDismissable?: boolean;\n /**\n * If true, the Toast is visible\n */\n isVisible?: boolean;\n /**\n * If linkUrl is not undefined, this is the text of the link.\n * If left blank, it defaults to \"Learn more\".\n * Note that linkText does nothing if linkUrl is not defined\n */\n linkText?: string;\n /**\n * If defined, the Toast will include a link to the URL\n */\n linkUrl?: string;\n /**\n * An optional function to run when the Toast is closed.\n */\n onHide?: () => void;\n /**\n * Sets the ARIA role of the Toast\n * (\"status\" for something that dynamically updates, \"alert\" for errors, null for something\n * unchanging)\n */\n role?: (typeof toastRoleValues)[number];\n /**\n * Determine the color and icon of the Toast\n */\n severity: (typeof toastSeverityValues)[number];\n /**\n * The text content of the Toast\n */\n text: string;\n} & SeleniumProps;\n\nconst ClickAwayListenerProps = { onClickAway: () => false };\n\nconst Toast = ({\n autoHideDuration = 6000,\n isDismissable,\n linkText,\n linkUrl,\n isVisible: isVisibleProp,\n onHide: onHideProp,\n role,\n severity,\n testId,\n text,\n}: ToastProps) => {\n const { t } = useTranslation();\n\n const [isVisible, setIsVisible] = useState(isVisibleProp);\n\n useEffect(() => {\n setIsVisible(isVisibleProp);\n }, [isVisibleProp]);\n\n const onHide = useCallback(() => {\n setIsVisible(false);\n onHideProp?.();\n }, [onHideProp]);\n\n return (\n <Snackbar\n open={isVisible}\n autoHideDuration={\n isDismissable || autoHideDuration <= 0 ? undefined : autoHideDuration\n }\n onClose={onHide}\n className=\"Toast\"\n ClickAwayListenerProps={ClickAwayListenerProps}\n >\n <Alert\n action={\n isDismissable === true && (\n <Button\n ariaLabel={t(\"toast.close.text\")}\n onClick={onHide}\n size=\"small\"\n startIcon={<CloseIcon />}\n variant=\"floating\"\n />\n )\n }\n data-se={testId}\n role={role}\n severity={severity}\n variant=\"toast\"\n >\n <AlertTitle>\n <span style={visuallyHidden}>{severity}:</span>\n {text}\n </AlertTitle>\n {linkUrl && (\n <Link href={linkUrl} variant=\"monochrome\">\n {linkText}\n </Link>\n )}\n </Alert>\n </Snackbar>\n );\n};\n\nconst MemoizedToast = memo(Toast);\nMemoizedToast.displayName = \"Toast\";\n\nexport { MemoizedToast as Toast };\n"],"mappings":";;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,SAAS,EAAEC,IAAI,EAAEC,QAAQ,EAAEC,WAAW,QAAQ,OAAO;AAE9D,SAASC,cAAc,QAAQ,YAAY;AAAC,SACnCC,IAAI;AAAA,SACJC,SAAS;AAAA,SACTC,MAAM;AACf,SAASC,cAAc,QAAQ,eAAe;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAG/C,OAAO,MAAMC,eAAe,GAAG,CAAC,QAAQ,EAAE,OAAO,CAAU;AAC3D,OAAO,MAAMC,mBAAmB,GAAG,CACjC,SAAS,EACT,MAAM,EACN,SAAS,EACT,OAAO,CACC;AA+CV,MAAMC,sBAAsB,GAAG;EAAEC,WAAW,EAAEA,CAAA,KAAM;AAAM,CAAC;AAE3D,MAAMC,KAAK,GAAGC,IAAA,IAWI;EAAA,IAXH;IACbC,gBAAgB,GAAG,IAAI;IACvBC,aAAa;IACbC,QAAQ;IACRC,OAAO;IACPC,SAAS,EAAEC,aAAa;IACxBC,MAAM,EAAEC,UAAU;IAClBC,IAAI;IACJC,QAAQ;IACRC,MAAM;IACNC;EACU,CAAC,GAAAZ,IAAA;EACX,MAAM;IAAEa;EAAE,CAAC,GAAGvB,cAAc,CAAC,CAAC;EAE9B,MAAM,CAACe,SAAS,EAAES,YAAY,CAAC,GAAG9B,QAAQ,CAACsB,aAAa,CAAC;EAEzDxB,SAAS,CAAC,MAAM;IACdgC,YAAY,CAACR,aAAa,CAAC;EAC7B,CAAC,EAAE,CAACA,aAAa,CAAC,CAAC;EAEnB,MAAMC,MAAM,GAAGtB,WAAW,CAAC,MAAM;IAC/B6B,YAAY,CAAC,KAAK,CAAC;IACnBN,UAAU,GAAG,CAAC;EAChB,CAAC,EAAE,CAACA,UAAU,CAAC,CAAC;EAEhB,OACEhB,IAAA,CAAAuB,SAAA;IACEC,IAAI,EAAEX,SAAU;IAChBJ,gBAAgB,EACdC,aAAa,IAAID,gBAAgB,IAAI,CAAC,GAAGgB,SAAS,GAAGhB,gBACtD;IACDiB,OAAO,EAAEX,MAAO;IAChBY,SAAS,EAAC,OAAO;IACjBtB,sBAAsB,EAAEA,sBAAuB;IAAAuB,QAAA,EAE/C1B,KAAA,CAAA2B,MAAA;MACEC,MAAM,EACJpB,aAAa,KAAK,IAAI,IACpBV,IAAA,CAACH,MAAM;QACLkC,SAAS,EAAEV,CAAC,CAAC,kBAAkB,CAAE;QACjCW,OAAO,EAAEjB,MAAO;QAChBkB,IAAI,EAAC,OAAO;QACZC,SAAS,EAAElC,IAAA,CAACJ,SAAS,IAAE,CAAE;QACzBuC,OAAO,EAAC;MAAU,CACnB,CAEJ;MACD,WAAShB,MAAO;MAChBF,IAAI,EAAEA,IAAK;MACXC,QAAQ,EAAEA,QAAS;MACnBiB,OAAO,EAAC,OAAO;MAAAP,QAAA,GAEf1B,KAAA,CAAAkC,WAAA;QAAAR,QAAA,GACE1B,KAAA;UAAMmC,KAAK,EAAE3C,cAAe;UAAAkC,QAAA,GAAEV,QAAQ,EAAC,GAAC;QAAA,CAAM,CAAC,EAC9CE,IAAI;MAAA,CACK,CAAC,EACZR,OAAO,IACNZ,IAAA,CAACL,IAAI;QAAC2C,IAAI,EAAE1B,OAAQ;QAACuB,OAAO,EAAC,YAAY;QAAAP,QAAA,EACtCjB;MAAQ,CACL,CACP;IAAA,CACI;EAAC,CACA,CAAC;AAEf,CAAC;AAED,MAAM4B,aAAa,GAAGhD,IAAI,CAACgB,KAAK,CAAC;AACjCgC,aAAa,CAACC,WAAW,GAAG,OAAO;AAEnC,SAASD,aAAa,IAAIhC,KAAK"}
1
+ {"version":3,"file":"Toast.js","names":["useEffect","memo","useState","useCallback","visuallyHidden","Link","CloseIcon","Button","useTranslation","jsx","_jsx","jsxs","_jsxs","toastRoleValues","toastSeverityValues","ClickAwayListenerProps","onClickAway","Toast","_ref","autoHideDuration","isDismissable","linkText","linkUrl","isVisible","isVisibleProp","onHide","onHideProp","role","severity","testId","text","translate","t","setIsVisible","_Snackbar","open","undefined","onClose","className","children","_Alert","action","ariaLabel","onClick","size","startIcon","variant","_AlertTitle","style","href","MemoizedToast","displayName"],"sources":["../src/Toast.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { useEffect, memo, useState, useCallback } from \"react\";\nimport { Alert, AlertTitle, Snackbar } from \"@mui/material\";\nimport { visuallyHidden } from \"@mui/utils\";\nimport { Link } from \"./Link\";\nimport { CloseIcon } from \"./icons.generated\";\nimport { Button } from \"./Button\";\nimport { useTranslation } from \"react-i18next\";\nimport { AllowedProps } from \"./AllowedProps\";\n\nexport const toastRoleValues = [\"status\", \"alert\"] as const;\nexport const toastSeverityValues = [\n \"success\",\n \"info\",\n \"warning\",\n \"error\",\n] as const;\n\nexport type ToastProps = {\n /**\n * If set, this determines how long the Toast should appear before automatically disappearing in milliseconds.\n * It will only take effect if the Toast is not dismissible.\n * If left blank, it defaults to 6000.\n */\n autoHideDuration?: number;\n /**\n * If `true`, the Toast will include a close button.\n */\n isDismissable?: boolean;\n /**\n * If true, the Toast is visible\n */\n isVisible?: boolean;\n /**\n * If linkUrl is not undefined, this is the text of the link.\n * If left blank, it defaults to \"Learn more\".\n * Note that linkText does nothing if linkUrl is not defined\n */\n linkText?: string;\n /**\n * If defined, the Toast will include a link to the URL\n */\n linkUrl?: string;\n /**\n * An optional function to run when the Toast is closed.\n */\n onHide?: () => void;\n /**\n * Sets the ARIA role of the Toast\n * (\"status\" for something that dynamically updates, \"alert\" for errors, null for something\n * unchanging)\n */\n role?: (typeof toastRoleValues)[number];\n /**\n * Determine the color and icon of the Toast\n */\n severity: (typeof toastSeverityValues)[number];\n /**\n * The text content of the Toast\n */\n text: string;\n} & AllowedProps;\n\nconst ClickAwayListenerProps = { onClickAway: () => false };\n\nconst Toast = ({\n autoHideDuration = 6000,\n isDismissable,\n linkText,\n linkUrl,\n isVisible: isVisibleProp,\n onHide: onHideProp,\n role,\n severity,\n testId,\n text,\n translate,\n}: ToastProps) => {\n const { t } = useTranslation();\n\n const [isVisible, setIsVisible] = useState(isVisibleProp);\n\n useEffect(() => {\n setIsVisible(isVisibleProp);\n }, [isVisibleProp]);\n\n const onHide = useCallback(() => {\n setIsVisible(false);\n onHideProp?.();\n }, [onHideProp]);\n\n return (\n <Snackbar\n open={isVisible}\n autoHideDuration={\n isDismissable || autoHideDuration <= 0 ? undefined : autoHideDuration\n }\n onClose={onHide}\n className=\"Toast\"\n ClickAwayListenerProps={ClickAwayListenerProps}\n >\n <Alert\n action={\n isDismissable === true && (\n <Button\n ariaLabel={t(\"toast.close.text\")}\n onClick={onHide}\n size=\"small\"\n startIcon={<CloseIcon />}\n variant=\"floating\"\n />\n )\n }\n data-se={testId}\n role={role}\n severity={severity}\n variant=\"toast\"\n >\n <AlertTitle translate={translate}>\n <span style={visuallyHidden}>{severity}:</span>\n {text}\n </AlertTitle>\n {linkUrl && (\n <Link href={linkUrl} variant=\"monochrome\" translate={translate}>\n {linkText}\n </Link>\n )}\n </Alert>\n </Snackbar>\n );\n};\n\nconst MemoizedToast = memo(Toast);\nMemoizedToast.displayName = \"Toast\";\n\nexport { MemoizedToast as Toast };\n"],"mappings":"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"}
package/dist/Tooltip.js CHANGED
@@ -19,13 +19,15 @@ const Tooltip = _ref => {
19
19
  children,
20
20
  placement = "top",
21
21
  testId,
22
- text
22
+ text,
23
+ translate
23
24
  } = _ref;
24
25
  return _jsx(_Tooltip, {
25
26
  "data-se": testId,
26
27
  describeChild: ariaType === "description",
27
28
  placement: placement,
28
29
  title: text,
30
+ translate: translate,
29
31
  children: _jsx(MuiPropsChild, {
30
32
  children: children
31
33
  })
@@ -1 +1 @@
1
- {"version":3,"file":"Tooltip.js","names":["MuiPropsChild","memo","jsx","_jsx","Tooltip","_ref","ariaType","children","placement","testId","text","_Tooltip","describeChild","title","MemoizedTooltip","displayName"],"sources":["../src/Tooltip.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { Tooltip as MuiTooltip } from \"@mui/material\";\nimport type { TooltipProps as MuiTooltipProps } from \"@mui/material\";\n\nimport { MuiPropsChild } from \"./MuiPropsChild\";\nimport { ReactElement, memo } from \"react\";\nimport { SeleniumProps } from \"./SeleniumProps\";\n\nexport type TooltipProps = {\n /**\n * The type of ARIA attribute to use\n */\n ariaType: \"description\" | \"label\";\n /**\n * The content that triggers the Tooltip when hovered\n */\n children: ReactElement;\n /**\n * The placement of the Tooltip\n */\n placement?: MuiTooltipProps[\"placement\"];\n /**\n * The text to display in the Tooltip\n */\n text: string;\n} & SeleniumProps;\n\nconst Tooltip = ({\n ariaType,\n children,\n placement = \"top\",\n testId,\n text,\n}: TooltipProps) => (\n <MuiTooltip\n data-se={testId}\n describeChild={ariaType === \"description\"}\n placement={placement}\n title={text}\n >\n <MuiPropsChild>{children}</MuiPropsChild>\n </MuiTooltip>\n);\n\nconst MemoizedTooltip = memo(Tooltip);\nMemoizedTooltip.displayName = \"Tooltip\";\n\nexport { MemoizedTooltip as Tooltip };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA,SAeSA,aAAa;AACtB,SAAuBC,IAAI,QAAQ,OAAO;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAsB3C,MAAMC,OAAO,GAAGC,IAAA;EAAA,IAAC;IACfC,QAAQ;IACRC,QAAQ;IACRC,SAAS,GAAG,KAAK;IACjBC,MAAM;IACNC;EACY,CAAC,GAAAL,IAAA;EAAA,OACbF,IAAA,CAAAQ,QAAA;IACE,WAASF,MAAO;IAChBG,aAAa,EAAEN,QAAQ,KAAK,aAAc;IAC1CE,SAAS,EAAEA,SAAU;IACrBK,KAAK,EAAEH,IAAK;IAAAH,QAAA,EAEZJ,IAAA,CAACH,aAAa;MAAAO,QAAA,EAAEA;IAAQ,CAAgB;EAAC,CAC/B,CAAC;AAAA,CACd;AAED,MAAMO,eAAe,GAAGb,IAAI,CAACG,OAAO,CAAC;AACrCU,eAAe,CAACC,WAAW,GAAG,SAAS;AAEvC,SAASD,eAAe,IAAIV,OAAO"}
1
+ {"version":3,"file":"Tooltip.js","names":["MuiPropsChild","memo","jsx","_jsx","Tooltip","_ref","ariaType","children","placement","testId","text","translate","_Tooltip","describeChild","title","MemoizedTooltip","displayName"],"sources":["../src/Tooltip.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { Tooltip as MuiTooltip } from \"@mui/material\";\nimport type { TooltipProps as MuiTooltipProps } from \"@mui/material\";\n\nimport { MuiPropsChild } from \"./MuiPropsChild\";\nimport { ReactElement, memo } from \"react\";\nimport { AllowedProps } from \"./AllowedProps\";\n\nexport type TooltipProps = {\n /**\n * The type of ARIA attribute to use\n */\n ariaType: \"description\" | \"label\";\n /**\n * The content that triggers the Tooltip when hovered\n */\n children: ReactElement;\n /**\n * The placement of the Tooltip\n */\n placement?: MuiTooltipProps[\"placement\"];\n /**\n * The text to display in the Tooltip\n */\n text: string;\n} & AllowedProps;\n\nconst Tooltip = ({\n ariaType,\n children,\n placement = \"top\",\n testId,\n text,\n translate,\n}: TooltipProps) => (\n <MuiTooltip\n data-se={testId}\n describeChild={ariaType === \"description\"}\n placement={placement}\n title={text}\n translate={translate}\n >\n <MuiPropsChild>{children}</MuiPropsChild>\n </MuiTooltip>\n);\n\nconst MemoizedTooltip = memo(Tooltip);\nMemoizedTooltip.displayName = \"Tooltip\";\n\nexport { MemoizedTooltip as Tooltip };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA,SAeSA,aAAa;AACtB,SAAuBC,IAAI,QAAQ,OAAO;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAsB3C,MAAMC,OAAO,GAAGC,IAAA;EAAA,IAAC;IACfC,QAAQ;IACRC,QAAQ;IACRC,SAAS,GAAG,KAAK;IACjBC,MAAM;IACNC,IAAI;IACJC;EACY,CAAC,GAAAN,IAAA;EAAA,OACbF,IAAA,CAAAS,QAAA;IACE,WAASH,MAAO;IAChBI,aAAa,EAAEP,QAAQ,KAAK,aAAc;IAC1CE,SAAS,EAAEA,SAAU;IACrBM,KAAK,EAAEJ,IAAK;IACZC,SAAS,EAAEA,SAAU;IAAAJ,QAAA,EAErBJ,IAAA,CAACH,aAAa;MAAAO,QAAA,EAAEA;IAAQ,CAAgB;EAAC,CAC/B,CAAC;AAAA,CACd;AAED,MAAMQ,eAAe,GAAGd,IAAI,CAACG,OAAO,CAAC;AACrCW,eAAe,CAACC,WAAW,GAAG,SAAS;AAEvC,SAASD,eAAe,IAAIX,OAAO"}
@@ -10,7 +10,7 @@ import _Typography from "@mui/material/Typography";
10
10
  *
11
11
  * See the License for the specific language governing permissions and limitations under the License.
12
12
  */
13
- import { memo, useMemo } from "react";
13
+ import { memo, useMemo, useRef, useImperativeHandle } from "react";
14
14
  import { jsx as _jsx } from "react/jsx-runtime";
15
15
  export const typographyVariantMapping = {
16
16
  h1: "h1",
@@ -34,6 +34,8 @@ const Typography = _ref => {
34
34
  color,
35
35
  component: componentProp,
36
36
  testId,
37
+ translate,
38
+ typographyFocusRef,
37
39
  variant = "body"
38
40
  } = _ref;
39
41
  const component = useMemo(() => {
@@ -48,6 +50,15 @@ const Typography = _ref => {
48
50
  }
49
51
  return componentProp;
50
52
  }, [componentProp, variant]);
53
+ const ref = useRef(null);
54
+ useImperativeHandle(typographyFocusRef, () => {
55
+ const element = ref.current;
56
+ return {
57
+ focus: () => {
58
+ element && element.focus();
59
+ }
60
+ };
61
+ }, []);
51
62
  return _jsx(_Typography, {
52
63
  "aria-describedby": ariaDescribedBy,
53
64
  "aria-label": ariaLabel,
@@ -56,6 +67,9 @@ const Typography = _ref => {
56
67
  color: color,
57
68
  component: component,
58
69
  "data-se": testId,
70
+ ref: ref,
71
+ tabIndex: -1,
72
+ translate: translate,
59
73
  variant: typographyVariantMapping[variant]
60
74
  });
61
75
  };
@@ -69,7 +83,8 @@ const Heading1 = _ref2 => {
69
83
  children,
70
84
  color,
71
85
  component,
72
- testId
86
+ testId,
87
+ translate
73
88
  } = _ref2;
74
89
  return _jsx(Typography, {
75
90
  ariaDescribedBy: ariaDescribedBy,
@@ -79,6 +94,7 @@ const Heading1 = _ref2 => {
79
94
  color: color,
80
95
  component: component,
81
96
  "data-se": testId,
97
+ translate: translate,
82
98
  variant: "h1"
83
99
  });
84
100
  };
@@ -92,7 +108,8 @@ const Heading2 = _ref3 => {
92
108
  children,
93
109
  color,
94
110
  component,
95
- testId
111
+ testId,
112
+ translate
96
113
  } = _ref3;
97
114
  return _jsx(Typography, {
98
115
  ariaDescribedBy: ariaDescribedBy,
@@ -102,6 +119,7 @@ const Heading2 = _ref3 => {
102
119
  color: color,
103
120
  component: component,
104
121
  "data-se": testId,
122
+ translate: translate,
105
123
  variant: "h2"
106
124
  });
107
125
  };
@@ -115,7 +133,8 @@ const Heading3 = _ref4 => {
115
133
  children,
116
134
  color,
117
135
  component,
118
- testId
136
+ testId,
137
+ translate
119
138
  } = _ref4;
120
139
  return _jsx(Typography, {
121
140
  ariaDescribedBy: ariaDescribedBy,
@@ -125,6 +144,7 @@ const Heading3 = _ref4 => {
125
144
  color: color,
126
145
  component: component,
127
146
  "data-se": testId,
147
+ translate: translate,
128
148
  variant: "h3"
129
149
  });
130
150
  };
@@ -138,7 +158,8 @@ const Heading4 = _ref5 => {
138
158
  children,
139
159
  color,
140
160
  component,
141
- testId
161
+ testId,
162
+ translate
142
163
  } = _ref5;
143
164
  return _jsx(Typography, {
144
165
  ariaDescribedBy: ariaDescribedBy,
@@ -148,6 +169,7 @@ const Heading4 = _ref5 => {
148
169
  color: color,
149
170
  component: component,
150
171
  "data-se": testId,
172
+ translate: translate,
151
173
  variant: "h4"
152
174
  });
153
175
  };
@@ -161,7 +183,8 @@ const Heading5 = _ref6 => {
161
183
  children,
162
184
  color,
163
185
  component,
164
- testId
186
+ testId,
187
+ translate
165
188
  } = _ref6;
166
189
  return _jsx(Typography, {
167
190
  ariaDescribedBy: ariaDescribedBy,
@@ -171,6 +194,7 @@ const Heading5 = _ref6 => {
171
194
  color: color,
172
195
  component: component,
173
196
  "data-se": testId,
197
+ translate: translate,
174
198
  variant: "h5"
175
199
  });
176
200
  };
@@ -184,7 +208,8 @@ const Heading6 = _ref7 => {
184
208
  children,
185
209
  color,
186
210
  component,
187
- testId
211
+ testId,
212
+ translate
188
213
  } = _ref7;
189
214
  return _jsx(Typography, {
190
215
  ariaDescribedBy: ariaDescribedBy,
@@ -194,6 +219,7 @@ const Heading6 = _ref7 => {
194
219
  color: color,
195
220
  component: component,
196
221
  "data-se": testId,
222
+ translate: translate,
197
223
  variant: "h6"
198
224
  });
199
225
  };
@@ -207,7 +233,8 @@ const Paragraph = _ref8 => {
207
233
  children,
208
234
  color,
209
235
  component,
210
- testId
236
+ testId,
237
+ translate
211
238
  } = _ref8;
212
239
  return _jsx(Typography, {
213
240
  ariaDescribedBy: ariaDescribedBy,
@@ -217,6 +244,7 @@ const Paragraph = _ref8 => {
217
244
  color: color,
218
245
  component: component,
219
246
  "data-se": testId,
247
+ translate: translate,
220
248
  variant: "body"
221
249
  });
222
250
  };
@@ -230,7 +258,8 @@ const Subordinate = _ref9 => {
230
258
  children,
231
259
  color,
232
260
  component,
233
- testId
261
+ testId,
262
+ translate
234
263
  } = _ref9;
235
264
  return _jsx(Typography, {
236
265
  ariaDescribedBy: ariaDescribedBy,
@@ -240,6 +269,7 @@ const Subordinate = _ref9 => {
240
269
  color: color,
241
270
  component: component,
242
271
  "data-se": testId,
272
+ translate: translate,
243
273
  variant: "subordinate"
244
274
  });
245
275
  };
@@ -253,7 +283,8 @@ const Support = _ref10 => {
253
283
  children,
254
284
  color,
255
285
  component,
256
- testId
286
+ testId,
287
+ translate
257
288
  } = _ref10;
258
289
  return _jsx(Typography, {
259
290
  ariaDescribedBy: ariaDescribedBy,
@@ -263,6 +294,7 @@ const Support = _ref10 => {
263
294
  color: color,
264
295
  component: component,
265
296
  "data-se": testId,
297
+ translate: translate,
266
298
  variant: "support"
267
299
  });
268
300
  };
@@ -276,7 +308,8 @@ const Legend = _ref11 => {
276
308
  children,
277
309
  color,
278
310
  component,
279
- testId
311
+ testId,
312
+ translate
280
313
  } = _ref11;
281
314
  return _jsx(Typography, {
282
315
  ariaDescribedBy: ariaDescribedBy,
@@ -286,6 +319,7 @@ const Legend = _ref11 => {
286
319
  color: color,
287
320
  component: component,
288
321
  "data-se": testId,
322
+ translate: translate,
289
323
  variant: "legend"
290
324
  });
291
325
  };
@@ -1 +1 @@
1
- {"version":3,"file":"Typography.js","names":["memo","useMemo","jsx","_jsx","typographyVariantMapping","h1","h2","h3","h4","h5","h6","body","subordinate","support","legend","typographyColorValues","Typography","_ref","ariaDescribedBy","ariaLabel","ariaLabelledBy","children","color","component","componentProp","testId","variant","_Typography","MemoizedTypography","displayName","Heading1","_ref2","MemoizedHeading1","Heading2","_ref3","MemoizedHeading2","Heading3","_ref4","MemoizedHeading3","Heading4","_ref5","MemoizedHeading4","Heading5","_ref6","MemoizedHeading5","Heading6","_ref7","MemoizedHeading6","Paragraph","_ref8","MemoizedParagraph","Subordinate","_ref9","MemoizedSubordinate","Support","_ref10","MemoizedSupport","Legend","_ref11","MemoizedLegend"],"sources":["../src/Typography.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n Typography as MuiTypography,\n TypographyProps as MuiTypographyProps,\n} from \"@mui/material\";\nimport { ElementType, ReactNode, memo, useMemo } from \"react\";\nimport { SeleniumProps } from \"./SeleniumProps\";\n\nexport type TypographyVariantValue =\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"h5\"\n | \"h6\"\n | \"body\"\n | \"subordinate\"\n | \"support\"\n | \"legend\";\n\nexport const typographyVariantMapping: Record<\n TypographyVariantValue,\n MuiTypographyProps[\"variant\"]\n> = {\n h1: \"h1\",\n h2: \"h2\",\n h3: \"h3\",\n h4: \"h4\",\n h5: \"h5\",\n h6: \"h6\",\n body: \"body1\",\n subordinate: \"subtitle1\",\n support: \"subtitle2\",\n legend: \"legend\",\n} as const;\n\nexport const typographyColorValues = [\n \"primary\",\n \"textPrimary\",\n \"secondary\",\n \"textSecondary\",\n \"error\",\n] as const;\n\nexport type TypographyProps = {\n /**\n * The ID of the element that describes the component.\n */\n ariaDescribedBy?: string;\n /**\n * The ARIA label for the component.\n */\n ariaLabel?: string;\n /**\n * The ID of the element that labels the component.\n */\n ariaLabelledBy?: string;\n /**\n * The text content of the component.\n */\n children: ReactNode;\n /**\n * The color of the text.\n */\n color?: (typeof typographyColorValues)[number];\n /**\n * The HTML element the component should render, if different from the default.\n */\n component?: ElementType;\n /**\n * The variant of Typography to render.\n */\n variant?: keyof typeof typographyVariantMapping;\n} & SeleniumProps;\n\nconst Typography = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component: componentProp,\n testId,\n variant = \"body\",\n}: TypographyProps) => {\n const component = useMemo(() => {\n if (!componentProp) {\n if (variant === \"body\") {\n return \"p\";\n } else if (variant === \"subordinate\" || variant === \"support\") {\n return \"p\";\n } else {\n return variant;\n }\n }\n return componentProp;\n }, [componentProp, variant]);\n\n return (\n <MuiTypography\n aria-describedby={ariaDescribedBy}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n variant={typographyVariantMapping[variant]}\n />\n );\n};\n\nconst MemoizedTypography = memo(Typography);\nMemoizedTypography.displayName = \"Typography\";\n\nconst Heading1 = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component,\n testId,\n}: TypographyProps) => (\n <Typography\n ariaDescribedBy={ariaDescribedBy}\n ariaLabel={ariaLabel}\n ariaLabelledBy={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n variant=\"h1\"\n />\n);\n\nconst MemoizedHeading1 = memo(Heading1);\nMemoizedHeading1.displayName = \"Heading1\";\n\nconst Heading2 = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component,\n testId,\n}: TypographyProps) => (\n <Typography\n ariaDescribedBy={ariaDescribedBy}\n ariaLabel={ariaLabel}\n ariaLabelledBy={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n variant=\"h2\"\n />\n);\n\nconst MemoizedHeading2 = memo(Heading2);\nMemoizedHeading2.displayName = \"Heading2\";\n\nconst Heading3 = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component,\n testId,\n}: TypographyProps) => (\n <Typography\n ariaDescribedBy={ariaDescribedBy}\n ariaLabel={ariaLabel}\n ariaLabelledBy={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n variant=\"h3\"\n />\n);\n\nconst MemoizedHeading3 = memo(Heading3);\nMemoizedHeading3.displayName = \"Heading3\";\n\nconst Heading4 = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component,\n testId,\n}: TypographyProps) => (\n <Typography\n ariaDescribedBy={ariaDescribedBy}\n ariaLabel={ariaLabel}\n ariaLabelledBy={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n variant=\"h4\"\n />\n);\n\nconst MemoizedHeading4 = memo(Heading4);\nMemoizedHeading4.displayName = \"Heading4\";\n\nconst Heading5 = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component,\n testId,\n}: TypographyProps) => (\n <Typography\n ariaDescribedBy={ariaDescribedBy}\n ariaLabel={ariaLabel}\n ariaLabelledBy={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n variant=\"h5\"\n />\n);\n\nconst MemoizedHeading5 = memo(Heading5);\nMemoizedHeading5.displayName = \"Heading5\";\n\nconst Heading6 = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component,\n testId,\n}: TypographyProps) => (\n <Typography\n ariaDescribedBy={ariaDescribedBy}\n ariaLabel={ariaLabel}\n ariaLabelledBy={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n variant=\"h6\"\n />\n);\n\nconst MemoizedHeading6 = memo(Heading6);\nMemoizedHeading6.displayName = \"Heading6\";\n\nconst Paragraph = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component,\n testId,\n}: TypographyProps) => (\n <Typography\n ariaDescribedBy={ariaDescribedBy}\n ariaLabel={ariaLabel}\n ariaLabelledBy={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n variant=\"body\"\n />\n);\n\nconst MemoizedParagraph = memo(Paragraph);\nMemoizedParagraph.displayName = \"Paragraph\";\n\nconst Subordinate = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component,\n testId,\n}: TypographyProps) => (\n <Typography\n ariaDescribedBy={ariaDescribedBy}\n ariaLabel={ariaLabel}\n ariaLabelledBy={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n variant=\"subordinate\"\n />\n);\n\nconst MemoizedSubordinate = memo(Subordinate);\nMemoizedSubordinate.displayName = \"Subordinate\";\n\nconst Support = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component,\n testId,\n}: TypographyProps) => (\n <Typography\n ariaDescribedBy={ariaDescribedBy}\n ariaLabel={ariaLabel}\n ariaLabelledBy={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n variant=\"support\"\n />\n);\n\nconst MemoizedSupport = memo(Support);\nMemoizedSupport.displayName = \"Support\";\n\nconst Legend = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component,\n testId,\n}: TypographyProps) => (\n <Typography\n ariaDescribedBy={ariaDescribedBy}\n ariaLabel={ariaLabel}\n ariaLabelledBy={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n variant=\"legend\"\n />\n);\n\nconst MemoizedLegend = memo(Legend);\nMemoizedLegend.displayName = \"Legend\";\n\nexport {\n MemoizedTypography as Typography,\n MemoizedHeading1 as Heading1,\n MemoizedHeading2 as Heading2,\n MemoizedHeading3 as Heading3,\n MemoizedHeading4 as Heading4,\n MemoizedHeading5 as Heading5,\n MemoizedHeading6 as Heading6,\n MemoizedLegend as Legend,\n MemoizedParagraph as Paragraph,\n MemoizedSubordinate as Subordinate,\n MemoizedSupport as Support,\n};\n"],"mappings":"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"}
1
+ {"version":3,"file":"Typography.js","names":["memo","useMemo","useRef","useImperativeHandle","jsx","_jsx","typographyVariantMapping","h1","h2","h3","h4","h5","h6","body","subordinate","support","legend","typographyColorValues","Typography","_ref","ariaDescribedBy","ariaLabel","ariaLabelledBy","children","color","component","componentProp","testId","translate","typographyFocusRef","variant","ref","element","current","focus","_Typography","tabIndex","MemoizedTypography","displayName","Heading1","_ref2","MemoizedHeading1","Heading2","_ref3","MemoizedHeading2","Heading3","_ref4","MemoizedHeading3","Heading4","_ref5","MemoizedHeading4","Heading5","_ref6","MemoizedHeading5","Heading6","_ref7","MemoizedHeading6","Paragraph","_ref8","MemoizedParagraph","Subordinate","_ref9","MemoizedSubordinate","Support","_ref10","MemoizedSupport","Legend","_ref11","MemoizedLegend"],"sources":["../src/Typography.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n Typography as MuiTypography,\n TypographyProps as MuiTypographyProps,\n} from \"@mui/material\";\nimport {\n ElementType,\n ReactNode,\n memo,\n useMemo,\n useRef,\n useImperativeHandle,\n} from \"react\";\nimport { AllowedProps } from \"./AllowedProps\";\nimport { FocusHandle } from \"./@types/react-augment\";\n\nexport type TypographyVariantValue =\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"h5\"\n | \"h6\"\n | \"body\"\n | \"subordinate\"\n | \"support\"\n | \"legend\";\n\nexport const typographyVariantMapping: Record<\n TypographyVariantValue,\n MuiTypographyProps[\"variant\"]\n> = {\n h1: \"h1\",\n h2: \"h2\",\n h3: \"h3\",\n h4: \"h4\",\n h5: \"h5\",\n h6: \"h6\",\n body: \"body1\",\n subordinate: \"subtitle1\",\n support: \"subtitle2\",\n legend: \"legend\",\n} as const;\n\nexport const typographyColorValues = [\n \"primary\",\n \"textPrimary\",\n \"secondary\",\n \"textSecondary\",\n \"error\",\n] as const;\n\nexport type TypographyProps = {\n /**\n * The ID of the element that describes the component.\n */\n ariaDescribedBy?: string;\n /**\n * The ARIA label for the component.\n */\n ariaLabel?: string;\n /**\n * The ID of the element that labels the component.\n */\n ariaLabelledBy?: string;\n /**\n * The text content of the component.\n */\n children: ReactNode;\n /**\n * The color of the text.\n */\n color?: (typeof typographyColorValues)[number];\n /**\n * The HTML element the component should render, if different from the default.\n */\n component?: ElementType;\n /**\n * The ref forwarded to the Typography to expose focus()\n */\n typographyFocusRef?: React.RefObject<FocusHandle>;\n /**\n * The variant of Typography to render.\n */\n variant?: keyof typeof typographyVariantMapping;\n} & AllowedProps;\n\nconst Typography = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component: componentProp,\n testId,\n translate,\n typographyFocusRef,\n variant = \"body\",\n}: TypographyProps) => {\n const component = useMemo(() => {\n if (!componentProp) {\n if (variant === \"body\") {\n return \"p\";\n } else if (variant === \"subordinate\" || variant === \"support\") {\n return \"p\";\n } else {\n return variant;\n }\n }\n return componentProp;\n }, [componentProp, variant]);\n\n const ref = useRef<HTMLElement>(null);\n useImperativeHandle(\n typographyFocusRef,\n () => {\n const element = ref.current;\n return {\n focus: () => {\n element && element.focus();\n },\n };\n },\n []\n );\n\n return (\n <MuiTypography\n aria-describedby={ariaDescribedBy}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n ref={ref}\n tabIndex={-1}\n translate={translate}\n variant={typographyVariantMapping[variant]}\n />\n );\n};\n\nconst MemoizedTypography = memo(Typography);\nMemoizedTypography.displayName = \"Typography\";\n\nconst Heading1 = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component,\n testId,\n translate,\n}: TypographyProps) => (\n <Typography\n ariaDescribedBy={ariaDescribedBy}\n ariaLabel={ariaLabel}\n ariaLabelledBy={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n translate={translate}\n variant=\"h1\"\n />\n);\n\nconst MemoizedHeading1 = memo(Heading1);\nMemoizedHeading1.displayName = \"Heading1\";\n\nconst Heading2 = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component,\n testId,\n translate,\n}: TypographyProps) => (\n <Typography\n ariaDescribedBy={ariaDescribedBy}\n ariaLabel={ariaLabel}\n ariaLabelledBy={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n translate={translate}\n variant=\"h2\"\n />\n);\n\nconst MemoizedHeading2 = memo(Heading2);\nMemoizedHeading2.displayName = \"Heading2\";\n\nconst Heading3 = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component,\n testId,\n translate,\n}: TypographyProps) => (\n <Typography\n ariaDescribedBy={ariaDescribedBy}\n ariaLabel={ariaLabel}\n ariaLabelledBy={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n translate={translate}\n variant=\"h3\"\n />\n);\n\nconst MemoizedHeading3 = memo(Heading3);\nMemoizedHeading3.displayName = \"Heading3\";\n\nconst Heading4 = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component,\n testId,\n translate,\n}: TypographyProps) => (\n <Typography\n ariaDescribedBy={ariaDescribedBy}\n ariaLabel={ariaLabel}\n ariaLabelledBy={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n translate={translate}\n variant=\"h4\"\n />\n);\n\nconst MemoizedHeading4 = memo(Heading4);\nMemoizedHeading4.displayName = \"Heading4\";\n\nconst Heading5 = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component,\n testId,\n translate,\n}: TypographyProps) => (\n <Typography\n ariaDescribedBy={ariaDescribedBy}\n ariaLabel={ariaLabel}\n ariaLabelledBy={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n translate={translate}\n variant=\"h5\"\n />\n);\n\nconst MemoizedHeading5 = memo(Heading5);\nMemoizedHeading5.displayName = \"Heading5\";\n\nconst Heading6 = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component,\n testId,\n translate,\n}: TypographyProps) => (\n <Typography\n ariaDescribedBy={ariaDescribedBy}\n ariaLabel={ariaLabel}\n ariaLabelledBy={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n translate={translate}\n variant=\"h6\"\n />\n);\n\nconst MemoizedHeading6 = memo(Heading6);\nMemoizedHeading6.displayName = \"Heading6\";\n\nconst Paragraph = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component,\n testId,\n translate,\n}: TypographyProps) => (\n <Typography\n ariaDescribedBy={ariaDescribedBy}\n ariaLabel={ariaLabel}\n ariaLabelledBy={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n translate={translate}\n variant=\"body\"\n />\n);\n\nconst MemoizedParagraph = memo(Paragraph);\nMemoizedParagraph.displayName = \"Paragraph\";\n\nconst Subordinate = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component,\n testId,\n translate,\n}: TypographyProps) => (\n <Typography\n ariaDescribedBy={ariaDescribedBy}\n ariaLabel={ariaLabel}\n ariaLabelledBy={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n translate={translate}\n variant=\"subordinate\"\n />\n);\n\nconst MemoizedSubordinate = memo(Subordinate);\nMemoizedSubordinate.displayName = \"Subordinate\";\n\nconst Support = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component,\n testId,\n translate,\n}: TypographyProps) => (\n <Typography\n ariaDescribedBy={ariaDescribedBy}\n ariaLabel={ariaLabel}\n ariaLabelledBy={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n translate={translate}\n variant=\"support\"\n />\n);\n\nconst MemoizedSupport = memo(Support);\nMemoizedSupport.displayName = \"Support\";\n\nconst Legend = ({\n ariaDescribedBy,\n ariaLabel,\n ariaLabelledBy,\n children,\n color,\n component,\n testId,\n translate,\n}: TypographyProps) => (\n <Typography\n ariaDescribedBy={ariaDescribedBy}\n ariaLabel={ariaLabel}\n ariaLabelledBy={ariaLabelledBy}\n children={children}\n color={color}\n component={component}\n data-se={testId}\n translate={translate}\n variant=\"legend\"\n />\n);\n\nconst MemoizedLegend = memo(Legend);\nMemoizedLegend.displayName = \"Legend\";\n\nexport {\n MemoizedTypography as Typography,\n MemoizedHeading1 as Heading1,\n MemoizedHeading2 as Heading2,\n MemoizedHeading3 as Heading3,\n MemoizedHeading4 as Heading4,\n MemoizedHeading5 as Heading5,\n MemoizedHeading6 as Heading6,\n MemoizedLegend as Legend,\n MemoizedParagraph as Paragraph,\n MemoizedSubordinate as Subordinate,\n MemoizedSupport as Support,\n};\n"],"mappings":"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"}