@okta/odyssey-react-mui 1.0.1 → 1.1.1

package/dist/Tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.js","names":["React","memo","useCallback","useState","TabList","MuiTabList","TabPanel","MuiTabPanel","TabContext","MuiTabContext","jsx","_jsx","jsxs","_jsxs","Tabs","_ref","ariaLabel","initialValue","tabs","tabState","setTabState","onChange","_event","newState","value","children","map","tab","index","_Tab","disabled","isDisabled","icon","startIcon","label","toString","MemoizedTabs","displayName"],"sources":["../src/Tabs.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 React, {\n  ReactElement,\n  ReactNode,\n  memo,\n  useCallback,\n  useState,\n} from \"react\";\nimport { Tab as MuiTab } from \"@mui/material\";\nimport {\n  TabList as MuiTabList,\n  TabPanel as MuiTabPanel,\n  TabContext as MuiTabContext,\n} from \"@mui/lab\";\n\nexport type TabItemProps = {\n  /**\n   * The content of the Tab itself\n   */\n  children: ReactNode;\n  /**\n   * If `true`, the TabItem is disabled\n   */\n  isDisabled?: boolean;\n  /**\n   * The label text for the TabItem\n   */\n  label: string;\n  /**\n   * An optional icon to display at the start of the TabItem\n   */\n  startIcon?: ReactElement;\n  /**\n   * The value associated with the TabItem\n   */\n  value?: string;\n};\n\nexport type TabsProps = {\n  /**\n   * The ARIA label for the full Tabs group\n   */\n  ariaLabel?: string;\n  /**\n   * The value of the Tab that should be selected by default\n   */\n  initialValue?: string;\n  /**\n   * The TabItems to be included in the Tabs group\n   */\n  tabs: TabItemProps[];\n};\n\nconst Tabs = ({ ariaLabel, initialValue = \"0\", tabs }: TabsProps) => {\n  const [tabState, setTabState] = useState(initialValue);\n\n  const onChange = useCallback(\n    (_event: React.SyntheticEvent, newState: string) => {\n      setTabState(newState);\n    },\n    []\n  );\n\n  return (\n    <MuiTabContext value={tabState}>\n      <MuiTabList onChange={onChange} aria-label={ariaLabel}>\n        {tabs.map((tab, index) => (\n          <MuiTab\n            disabled={tab.isDisabled}\n            icon={tab.startIcon}\n            label={tab.label}\n            value={tab.value ? tab.value : index.toString()}\n            key={tab.value ? tab.value : index.toString()}\n          />\n        ))}\n      </MuiTabList>\n      {tabs.map((tab, index) => (\n        <MuiTabPanel\n          value={tab.value ? tab.value : index.toString()}\n          key={tab.value ? tab.value : index.toString()}\n        >\n          {tab.children}\n        </MuiTabPanel>\n      ))}\n    </MuiTabContext>\n  );\n};\n\nconst MemoizedTabs = memo(Tabs);\nMemoizedTabs.displayName = \"Tabs\";\n\nexport { MemoizedTabs as Tabs };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAOA,KAAK,IAGVC,IAAI,EACJC,WAAW,EACXC,QAAQ,QACH,OAAO;AAEd,SACEC,OAAO,IAAIC,UAAU,EACrBC,QAAQ,IAAIC,WAAW,EACvBC,UAAU,IAAIC,aAAa,QACtB,UAAU;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAwClB,MAAMC,IAAI,GAAGC,IAAA,IAAwD;EAAA,IAAvD;IAAEC,SAAS;IAAEC,YAAY,GAAG,GAAG;IAAEC;EAAgB,CAAC,GAAAH,IAAA;EAC9D,MAAM,CAACI,QAAQ,EAAEC,WAAW,CAAC,GAAGjB,QAAQ,CAACc,YAAY,CAAC;EAEtD,MAAMI,QAAQ,GAAGnB,WAAW,CAC1B,CAACoB,MAA4B,EAAEC,QAAgB,KAAK;IAClDH,WAAW,CAACG,QAAQ,CAAC;EACvB,CAAC,EACD,EACF,CAAC;EAED,OACEV,KAAA,CAACJ,aAAa;IAACe,KAAK,EAAEL,QAAS;IAAAM,QAAA,GAC7Bd,IAAA,CAACN,UAAU;MAACgB,QAAQ,EAAEA,QAAS;MAAC,cAAYL,SAAU;MAAAS,QAAA,EACnDP,IAAI,CAACQ,GAAG,CAAC,CAACC,GAAG,EAAEC,KAAK,KACnBjB,IAAA,CAAAkB,IAAA;QACEC,QAAQ,EAAEH,GAAG,CAACI,UAAW;QACzBC,IAAI,EAAEL,GAAG,CAACM,SAAU;QACpBC,KAAK,EAAEP,GAAG,CAACO,KAAM;QACjBV,KAAK,EAAEG,GAAG,CAACH,KAAK,GAAGG,GAAG,CAACH,KAAK,GAAGI,KAAK,CAACO,QAAQ,CAAC;MAAE,GAC3CR,GAAG,CAACH,KAAK,GAAGG,GAAG,CAACH,KAAK,GAAGI,KAAK,CAACO,QAAQ,CAAC,CAC7C,CACF;IAAC,CACQ,CAAC,EACZjB,IAAI,CAACQ,GAAG,CAAC,CAACC,GAAG,EAAEC,KAAK,KACnBjB,IAAA,CAACJ,WAAW;MACViB,KAAK,EAAEG,GAAG,CAACH,KAAK,GAAGG,GAAG,CAACH,KAAK,GAAGI,KAAK,CAACO,QAAQ,CAAC,CAAE;MAAAV,QAAA,EAG/CE,GAAG,CAACF;IAAQ,GAFRE,GAAG,CAACH,KAAK,GAAGG,GAAG,CAACH,KAAK,GAAGI,KAAK,CAACO,QAAQ,CAAC,CAGjC,CACd,CAAC;EAAA,CACW,CAAC;AAEpB,CAAC;AAED,MAAMC,YAAY,GAAGnC,IAAI,CAACa,IAAI,CAAC;AAC/BsB,YAAY,CAACC,WAAW,GAAG,MAAM;AAEjC,SAASD,YAAY,IAAItB,IAAI"}
+{"version":3,"file":"Tabs.js","names":["React","memo","useCallback","useEffect","useState","TabList","MuiTabList","TabPanel","MuiTabPanel","TabContext","MuiTabContext","jsx","_jsx","jsxs","_jsxs","Tabs","_ref","ariaLabel","initialValue","tabs","value","tabState","setTabState","onChange","_event","newState","undefined","children","map","tab","index","_Tab","testId","disabled","isDisabled","icon","startIcon","label","toString","MemoizedTabs","displayName"],"sources":["../src/Tabs.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 React, {\n  ReactElement,\n  ReactNode,\n  memo,\n  useCallback,\n  useEffect,\n  useState,\n} from \"react\";\nimport { Tab as MuiTab } from \"@mui/material\";\nimport {\n  TabList as MuiTabList,\n  TabPanel as MuiTabPanel,\n  TabContext as MuiTabContext,\n} from \"@mui/lab\";\nimport { SeleniumProps } from \"./SeleniumProps\";\n\nexport type TabItemProps = {\n  /**\n   * The content of the Tab itself\n   */\n  children: ReactNode;\n  /**\n   * If `true`, the TabItem is disabled\n   */\n  isDisabled?: boolean;\n  /**\n   * The label text for the TabItem\n   */\n  label: string;\n  /**\n   * An optional icon to display at the start of the TabItem\n   */\n  startIcon?: ReactElement;\n  /**\n   * The value associated with the TabItem\n   */\n  value?: string;\n} & SeleniumProps;\n\nexport type TabsProps = {\n  /**\n   * The ARIA label for the full Tabs group\n   */\n  ariaLabel?: string;\n  /**\n   * @deprecated please use the `value` prop instead\n   * When `value` is provided, `initialValue` isn't used.\n   */\n  initialValue?: string;\n  /**\n   * The TabItems to be included in the Tabs group\n   */\n  tabs: TabItemProps[];\n  /**\n   * Identifier for the selected tab.\n   */\n  value?: string;\n};\n\nconst Tabs = ({ ariaLabel, initialValue, tabs, value }: TabsProps) => {\n  const [tabState, setTabState] = useState(initialValue ?? value ?? \"0\");\n\n  const onChange = useCallback(\n    (_event: React.SyntheticEvent, newState: string) => {\n      setTabState(newState);\n    },\n    []\n  );\n\n  useEffect(() => {\n    if (value !== undefined) {\n      setTabState(value);\n    }\n  }, [value]);\n\n  return (\n    <MuiTabContext value={tabState}>\n      <MuiTabList onChange={onChange} aria-label={ariaLabel}>\n        {tabs.map((tab, index) => (\n          <MuiTab\n            data-se={tab.testId}\n            disabled={tab.isDisabled}\n            icon={tab.startIcon}\n            label={tab.label}\n            value={tab.value ? tab.value : index.toString()}\n            key={tab.value ? tab.value : index.toString()}\n          />\n        ))}\n      </MuiTabList>\n      {tabs.map((tab, index) => (\n        <MuiTabPanel\n          value={tab.value ? tab.value : index.toString()}\n          key={tab.value ? tab.value : index.toString()}\n        >\n          {tab.children}\n        </MuiTabPanel>\n      ))}\n    </MuiTabContext>\n  );\n};\n\nconst MemoizedTabs = memo(Tabs);\nMemoizedTabs.displayName = \"Tabs\";\n\nexport { MemoizedTabs as Tabs };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAOA,KAAK,IAGVC,IAAI,EACJC,WAAW,EACXC,SAAS,EACTC,QAAQ,QACH,OAAO;AAEd,SACEC,OAAO,IAAIC,UAAU,EACrBC,QAAQ,IAAIC,WAAW,EACvBC,UAAU,IAAIC,aAAa,QACtB,UAAU;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AA8ClB,MAAMC,IAAI,GAAGC,IAAA,IAAyD;EAAA,IAAxD;IAAEC,SAAS;IAAEC,YAAY;IAAEC,IAAI;IAAEC;EAAiB,CAAC,GAAAJ,IAAA;EAC/D,MAAM,CAACK,QAAQ,EAAEC,WAAW,CAAC,GAAGlB,QAAQ,CAACc,YAAY,IAAIE,KAAK,IAAI,GAAG,CAAC;EAEtE,MAAMG,QAAQ,GAAGrB,WAAW,CAC1B,CAACsB,MAA4B,EAAEC,QAAgB,KAAK;IAClDH,WAAW,CAACG,QAAQ,CAAC;EACvB,CAAC,EACD,EACF,CAAC;EAEDtB,SAAS,CAAC,MAAM;IACd,IAAIiB,KAAK,KAAKM,SAAS,EAAE;MACvBJ,WAAW,CAACF,KAAK,CAAC;IACpB;EACF,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EAEX,OACEN,KAAA,CAACJ,aAAa;IAACU,KAAK,EAAEC,QAAS;IAAAM,QAAA,GAC7Bf,IAAA,CAACN,UAAU;MAACiB,QAAQ,EAAEA,QAAS;MAAC,cAAYN,SAAU;MAAAU,QAAA,EACnDR,IAAI,CAACS,GAAG,CAAC,CAACC,GAAG,EAAEC,KAAK,KACnBlB,IAAA,CAAAmB,IAAA;QACE,WAASF,GAAG,CAACG,MAAO;QACpBC,QAAQ,EAAEJ,GAAG,CAACK,UAAW;QACzBC,IAAI,EAAEN,GAAG,CAACO,SAAU;QACpBC,KAAK,EAAER,GAAG,CAACQ,KAAM;QACjBjB,KAAK,EAAES,GAAG,CAACT,KAAK,GAAGS,GAAG,CAACT,KAAK,GAAGU,KAAK,CAACQ,QAAQ,CAAC;MAAE,GAC3CT,GAAG,CAACT,KAAK,GAAGS,GAAG,CAACT,KAAK,GAAGU,KAAK,CAACQ,QAAQ,CAAC,CAC7C,CACF;IAAC,CACQ,CAAC,EACZnB,IAAI,CAACS,GAAG,CAAC,CAACC,GAAG,EAAEC,KAAK,KACnBlB,IAAA,CAACJ,WAAW;MACVY,KAAK,EAAES,GAAG,CAACT,KAAK,GAAGS,GAAG,CAACT,KAAK,GAAGU,KAAK,CAACQ,QAAQ,CAAC,CAAE;MAAAX,QAAA,EAG/CE,GAAG,CAACF;IAAQ,GAFRE,GAAG,CAACT,KAAK,GAAGS,GAAG,CAACT,KAAK,GAAGU,KAAK,CAACQ,QAAQ,CAAC,CAGjC,CACd,CAAC;EAAA,CACW,CAAC;AAEpB,CAAC;AAED,MAAMC,YAAY,GAAGtC,IAAI,CAACc,IAAI,CAAC;AAC/BwB,YAAY,CAACC,WAAW,GAAG,MAAM;AAEjC,SAASD,YAAY,IAAIxB,IAAI"}

package/dist/Tag.js

@@ -20,7 +20,8 @@ const Tag = _ref => {
     isDisabled,
     label,
     onClick,
-    onRemove
+    onRemove,
+    testId
   } = _ref;
   const {
     chipElementType
@@ -30,12 +31,13 @@ const Tag = _ref => {
     "aria-disabled": isDisabled,
     clickable: onClick ? true : false,
     component: chipElementType,
+    "data-se": testId,
     disabled: isDisabled,
     icon: icon,
     label: label,
     onClick: onClick,
     onDelete: onRemove
-  }), [chipElementType, icon, isDisabled, label, onClick, onRemove]);
+  }), [chipElementType, icon, isDisabled, label, onClick, onRemove, testId]);
   return _jsx(MuiPropsContext.Consumer, {
     children: renderTag
   });

package/dist/Tag.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.js","names":["memo","useCallback","useContext","TagListContext","MuiPropsContext","jsx","_jsx","Tag","_ref","icon","isDisabled","label","onClick","onRemove","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\";\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};\n\nconst Tag = ({ icon, isDisabled, label, onClick, onRemove }: 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        disabled={isDisabled}\n        icon={icon}\n        label={label}\n        onClick={onClick}\n        onDelete={onRemove}\n      />\n    ),\n    [chipElementType, icon, isDisabled, label, onClick, onRemove]\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;AAmBxB,MAAMC,GAAG,GAAGC,IAAA,IAA8D;EAAA,IAA7D;IAAEC,IAAI;IAAEC,UAAU;IAAEC,KAAK;IAAEC,OAAO;IAAEC;EAAmB,CAAC,GAAAL,IAAA;EACnE,MAAM;IAAEM;EAAgB,CAAC,GAAGZ,UAAU,CAACC,cAAc,CAAC;EAEtD,MAAMY,SAAS,GAAGd,WAAW,CAC1Be,QAAQ,IACPV,IAAA,CAAAW,KAAA;IAAA,GACMD,QAAQ;IACZ,iBAAeN,UAAW;IAC1BQ,SAAS,EAAEN,OAAO,GAAG,IAAI,GAAG,KAAM;IAClCO,SAAS,EAAEL,eAAgB;IAC3BM,QAAQ,EAAEV,UAAW;IACrBD,IAAI,EAAEA,IAAK;IACXE,KAAK,EAAEA,KAAM;IACbC,OAAO,EAAEA,OAAQ;IACjBS,QAAQ,EAAER;EAAS,CACpB,CACF,EACD,CAACC,eAAe,EAAEL,IAAI,EAAEC,UAAU,EAAEC,KAAK,EAAEC,OAAO,EAAEC,QAAQ,CAC9D,CAAC;EAED,OAAOP,IAAA,CAACF,eAAe,CAACkB,QAAQ;IAAAC,QAAA,EAAER;EAAS,CAA2B,CAAC;AACzE,CAAC;AAED,MAAMS,WAAW,GAAGxB,IAAI,CAACO,GAAG,CAAC;AAC7BiB,WAAW,CAACC,WAAW,GAAG,KAAK;AAE/B,SAASD,WAAW,IAAIjB,GAAG"}
+{"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"}

package/dist/TagList.js

@@ -15,13 +15,15 @@ import { TagListContext } from "./TagListContext.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const TagList = _ref => {
   let {
-    children
+    children,
+    testId
   } = _ref;
   const providerValue = useMemo(() => ({
     chipElementType: "li"
   }), []);
   return _jsx(_Stack, {
     component: "ul",
+    "data-se": testId,
     direction: "row",
     spacing: 2,
     useFlexGap: true,

package/dist/TagList.js.map

@@ -1 +1 @@
-{"version":3,"file":"TagList.js","names":["memo","useMemo","TagListContext","jsx","_jsx","TagList","_ref","children","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\";\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};\n\nconst TagList = ({ children }: 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      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;AASxC,MAAMC,OAAO,GAAGC,IAAA,IAAgC;EAAA,IAA/B;IAAEC;EAAuB,CAAC,GAAAD,IAAA;EACzC,MAAME,aAAa,GAAGP,OAAO,CAG3B,OAAO;IACLQ,eAAe,EAAE;EACnB,CAAC,CAAC,EACF,EACF,CAAC;EAED,OACEL,IAAA,CAAAM,MAAA;IACEC,SAAS,EAAC,IAAI;IACdC,SAAS,EAAC,KAAK;IACfC,OAAO,EAAE,CAAE;IACXC,UAAU;IACVC,QAAQ,EAAC,MAAM;IAAAR,QAAA,EAEfH,IAAA,CAACF,cAAc,CAACc,QAAQ;MAACC,KAAK,EAAET,aAAc;MAAAD,QAAA,EAC3CA;IAAQ,CACc;EAAC,CACrB,CAAC;AAEZ,CAAC;AAED,MAAMW,eAAe,GAAGlB,IAAI,CAACK,OAAO,CAAC;AACrCa,eAAe,CAACC,WAAW,GAAG,SAAS;AAEvC,SAASD,eAAe,IAAIb,OAAO"}
+{"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"}

package/dist/TextField.js

@@ -28,11 +28,13 @@ const TextField = forwardRef((_ref, ref) => {
     isOptional = false,
     isReadOnly,
     label,
+    name: nameOverride,
     onBlur,
     onChange,
     onFocus,
     placeholder,
     startAdornment,
+    testId,
     type = "text",
     value
   } = _ref;
@@ -45,19 +47,21 @@ const TextField = forwardRef((_ref, ref) => {
       "aria-describedby": ariaDescribedBy,
       autoComplete: autoCompleteType,
       autoFocus: hasInitialFocus,
+      "data-se": testId,
       endAdornment: endAdornment && _jsx(_InputAdornment, {
         position: "end",
         children: endAdornment
       }),
       id: id,
       multiline: isMultiline,
-      name: id,
+      name: nameOverride ?? id,
       onBlur: onBlur,
       onChange: onChange,
       onFocus: onFocus,
       placeholder: placeholder,
       readOnly: isReadOnly,
       ref: ref,
+      required: !isOptional,
       startAdornment: startAdornment && _jsx(_InputAdornment, {
         position: "start",
         children: startAdornment
@@ -65,7 +69,7 @@ const TextField = forwardRef((_ref, ref) => {
       type: type,
       value: value
     });
-  }, [autoCompleteType, hasInitialFocus, endAdornment, isMultiline, onChange, onFocus, onBlur, placeholder, isReadOnly, ref, startAdornment, type, value]);
+  }, [autoCompleteType, hasInitialFocus, endAdornment, isMultiline, nameOverride, onChange, onFocus, onBlur, placeholder, isOptional, isReadOnly, ref, startAdornment, testId, type, value]);
   return _jsx(Field, {
     errorMessage: errorMessage,
     fieldType: "single",

package/dist/TextField.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextField.js","names":["forwardRef","memo","useCallback","Field","jsx","_jsx","textFieldTypeValues","TextField","_ref","ref","autoCompleteType","hasInitialFocus","endAdornment","errorMessage","hint","id","idOverride","isDisabled","isMultiline","isOptional","isReadOnly","label","onBlur","onChange","onFocus","placeholder","startAdornment","type","value","renderFieldComponent","_ref2","ariaDescribedBy","_InputBase","autoComplete","autoFocus","_InputAdornment","position","children","multiline","name","readOnly","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 { InputAdornment, InputBase } from \"@mui/material\";\nimport {\n  ChangeEventHandler,\n  FocusEventHandler,\n  forwardRef,\n  InputHTMLAttributes,\n  memo,\n  ReactElement,\n  useCallback,\n} from \"react\";\n\nimport { Field } from \"./Field\";\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   * End `InputAdornment` for this component.\n   */\n  endAdornment?: string | ReactElement;\n  /**\n   * If `error` is not undefined, the `input` will indicate an error.\n   */\n  errorMessage?: string;\n  /**\n   * If `true`, the component will receive focus automatically.\n   */\n  hasInitialFocus?: boolean;\n  /**\n   * The helper text content.\n   */\n  hint?: string;\n  /**\n   * The id of the `input` element.\n   */\n  id?: string;\n  /**\n   * If `true`, the component is disabled.\n   */\n  isDisabled?: boolean;\n  /**\n   * If `true`, a [TextareaAutosize](/material-ui/react-textarea-autosize/) element is rendered.\n   */\n  isMultiline?: boolean;\n  /**\n   * If `true`, the `input` element is not required.\n   */\n  isOptional?: boolean;\n  /**\n   * It prevents the user from changing the value of the field\n   */\n  isReadOnly?: 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};\n\nconst TextField = forwardRef<HTMLInputElement, TextFieldProps>(\n  (\n    {\n      autoCompleteType,\n      hasInitialFocus,\n      endAdornment,\n      errorMessage,\n      hint,\n      id: idOverride,\n      isDisabled = false,\n      isMultiline = false,\n      isOptional = false,\n      isReadOnly,\n      label,\n      onBlur,\n      onChange,\n      onFocus,\n      placeholder,\n      startAdornment,\n      type = \"text\",\n      value,\n    },\n    ref\n  ) => {\n    const renderFieldComponent = useCallback(\n      ({ ariaDescribedBy, id }) => (\n        <InputBase\n          aria-describedby={ariaDescribedBy}\n          autoComplete={autoCompleteType}\n          /* eslint-disable-next-line jsx-a11y/no-autofocus */\n          autoFocus={hasInitialFocus}\n          endAdornment={\n            endAdornment && (\n              <InputAdornment position=\"end\">{endAdornment}</InputAdornment>\n            )\n          }\n          id={id}\n          multiline={isMultiline}\n          name={id}\n          onBlur={onBlur}\n          onChange={onChange}\n          onFocus={onFocus}\n          placeholder={placeholder}\n          readOnly={isReadOnly}\n          ref={ref}\n          startAdornment={\n            startAdornment && (\n              <InputAdornment position=\"start\">{startAdornment}</InputAdornment>\n            )\n          }\n          type={type}\n          value={value}\n        />\n      ),\n      [\n        autoCompleteType,\n        hasInitialFocus,\n        endAdornment,\n        isMultiline,\n        onChange,\n        onFocus,\n        onBlur,\n        placeholder,\n        isReadOnly,\n        ref,\n        startAdornment,\n        type,\n        value,\n      ]\n    );\n\n    return (\n      <Field\n        errorMessage={errorMessage}\n        fieldType=\"single\"\n        hasVisibleLabel\n        hint={hint}\n        id={idOverride}\n        isDisabled={isDisabled}\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":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,SAGEA,UAAU,EAEVC,IAAI,EAEJC,WAAW,QACN,OAAO;AAAC,SAENC,KAAK;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAEd,OAAO,MAAMC,mBAAmB,GAAG,CACjC,OAAO,EACP,QAAQ,EACR,KAAK,EACL,MAAM,EACN,KAAK,CACG;AA+EV,MAAMC,SAAS,GAAGP,UAAU,CAC1B,CAAAQ,IAAA,EAqBEC,GAAG,KACA;EAAA,IArBH;IACEC,gBAAgB;IAChBC,eAAe;IACfC,YAAY;IACZC,YAAY;IACZC,IAAI;IACJC,EAAE,EAAEC,UAAU;IACdC,UAAU,GAAG,KAAK;IAClBC,WAAW,GAAG,KAAK;IACnBC,UAAU,GAAG,KAAK;IAClBC,UAAU;IACVC,KAAK;IACLC,MAAM;IACNC,QAAQ;IACRC,OAAO;IACPC,WAAW;IACXC,cAAc;IACdC,IAAI,GAAG,MAAM;IACbC;EACF,CAAC,GAAApB,IAAA;EAGD,MAAMqB,oBAAoB,GAAG3B,WAAW,CACtC4B,KAAA;IAAA,IAAC;MAAEC,eAAe;MAAEhB;IAAG,CAAC,GAAAe,KAAA;IAAA,OACtBzB,IAAA,CAAA2B,UAAA;MACE,oBAAkBD,eAAgB;MAClCE,YAAY,EAAEvB,gBAAiB;MAE/BwB,SAAS,EAAEvB,eAAgB;MAC3BC,YAAY,EACVA,YAAY,IACVP,IAAA,CAAA8B,eAAA;QAAgBC,QAAQ,EAAC,KAAK;QAAAC,QAAA,EAAEzB;MAAY,CAAiB,CAEhE;MACDG,EAAE,EAAEA,EAAG;MACPuB,SAAS,EAAEpB,WAAY;MACvBqB,IAAI,EAAExB,EAAG;MACTO,MAAM,EAAEA,MAAO;MACfC,QAAQ,EAAEA,QAAS;MACnBC,OAAO,EAAEA,OAAQ;MACjBC,WAAW,EAAEA,WAAY;MACzBe,QAAQ,EAAEpB,UAAW;MACrBX,GAAG,EAAEA,GAAI;MACTiB,cAAc,EACZA,cAAc,IACZrB,IAAA,CAAA8B,eAAA;QAAgBC,QAAQ,EAAC,OAAO;QAAAC,QAAA,EAAEX;MAAc,CAAiB,CAEpE;MACDC,IAAI,EAAEA,IAAK;MACXC,KAAK,EAAEA;IAAM,CACd,CAAC;EAAA,CACH,EACD,CACElB,gBAAgB,EAChBC,eAAe,EACfC,YAAY,EACZM,WAAW,EACXK,QAAQ,EACRC,OAAO,EACPF,MAAM,EACNG,WAAW,EACXL,UAAU,EACVX,GAAG,EACHiB,cAAc,EACdC,IAAI,EACJC,KAAK,CAET,CAAC;EAED,OACEvB,IAAA,CAACF,KAAK;IACJU,YAAY,EAAEA,YAAa;IAC3B4B,SAAS,EAAC,QAAQ;IAClBC,eAAe;IACf5B,IAAI,EAAEA,IAAK;IACXC,EAAE,EAAEC,UAAW;IACfC,UAAU,EAAEA,UAAW;IACvBE,UAAU,EAAEA,UAAW;IACvBE,KAAK,EAAEA,KAAM;IACbQ,oBAAoB,EAAEA;EAAqB,CAC5C,CAAC;AAEN,CACF,CAAC;AAED,MAAMc,iBAAiB,GAAG1C,IAAI,CAACM,SAAS,CAAC;AACzCoC,iBAAiB,CAACC,WAAW,GAAG,WAAW;AAE3C,SAASD,iBAAiB,IAAIpC,SAAS"}
+{"version":3,"file":"TextField.js","names":["forwardRef","memo","useCallback","Field","jsx","_jsx","textFieldTypeValues","TextField","_ref","ref","autoCompleteType","hasInitialFocus","endAdornment","errorMessage","hint","id","idOverride","isDisabled","isMultiline","isOptional","isReadOnly","label","name","nameOverride","onBlur","onChange","onFocus","placeholder","startAdornment","testId","type","value","renderFieldComponent","_ref2","ariaDescribedBy","_InputBase","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 { InputAdornment, InputBase } from \"@mui/material\";\nimport {\n  ChangeEventHandler,\n  FocusEventHandler,\n  forwardRef,\n  InputHTMLAttributes,\n  memo,\n  ReactElement,\n  useCallback,\n} from \"react\";\n\nimport { Field } from \"./Field\";\nimport { SeleniumProps } from \"./SeleniumProps\";\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   * End `InputAdornment` for this component.\n   */\n  endAdornment?: string | ReactElement;\n  /**\n   * If `error` is not undefined, the `input` will indicate an error.\n   */\n  errorMessage?: string;\n  /**\n   * If `true`, the component will receive focus automatically.\n   */\n  hasInitialFocus?: boolean;\n  /**\n   * The helper text content.\n   */\n  hint?: string;\n  /**\n   * The id of the `input` element.\n   */\n  id?: string;\n  /**\n   * If `true`, the component is disabled.\n   */\n  isDisabled?: boolean;\n  /**\n   * If `true`, a [TextareaAutosize](/material-ui/react-textarea-autosize/) element is rendered.\n   */\n  isMultiline?: boolean;\n  /**\n   * If `true`, the `input` element is not required.\n   */\n  isOptional?: boolean;\n  /**\n   * It prevents the user from changing the value of the field\n   */\n  isReadOnly?: boolean;\n  /**\n   * The label for the `input` element.\n   */\n  label: string;\n  /**\n   * The name of the `input` element. Defaults to the `id` if not set.\n   */\n  name?: 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} & SeleniumProps;\n\nconst TextField = forwardRef<HTMLInputElement, TextFieldProps>(\n  (\n    {\n      autoCompleteType,\n      hasInitialFocus,\n      endAdornment,\n      errorMessage,\n      hint,\n      id: idOverride,\n      isDisabled = false,\n      isMultiline = false,\n      isOptional = false,\n      isReadOnly,\n      label,\n      name: nameOverride,\n      onBlur,\n      onChange,\n      onFocus,\n      placeholder,\n      startAdornment,\n      testId,\n      type = \"text\",\n      value,\n    },\n    ref\n  ) => {\n    const renderFieldComponent = useCallback(\n      ({ ariaDescribedBy, id }) => (\n        <InputBase\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          value={value}\n        />\n      ),\n      [\n        autoCompleteType,\n        hasInitialFocus,\n        endAdornment,\n        isMultiline,\n        nameOverride,\n        onChange,\n        onFocus,\n        onBlur,\n        placeholder,\n        isOptional,\n        isReadOnly,\n        ref,\n        startAdornment,\n        testId,\n        type,\n        value,\n      ]\n    );\n\n    return (\n      <Field\n        errorMessage={errorMessage}\n        fieldType=\"single\"\n        hasVisibleLabel\n        hint={hint}\n        id={idOverride}\n        isDisabled={isDisabled}\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":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,SAGEA,UAAU,EAEVC,IAAI,EAEJC,WAAW,QACN,OAAO;AAAC,SAENC,KAAK;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAGd,OAAO,MAAMC,mBAAmB,GAAG,CACjC,OAAO,EACP,QAAQ,EACR,KAAK,EACL,MAAM,EACN,KAAK,CACG;AAmFV,MAAMC,SAAS,GAAGP,UAAU,CAC1B,CAAAQ,IAAA,EAuBEC,GAAG,KACA;EAAA,IAvBH;IACEC,gBAAgB;IAChBC,eAAe;IACfC,YAAY;IACZC,YAAY;IACZC,IAAI;IACJC,EAAE,EAAEC,UAAU;IACdC,UAAU,GAAG,KAAK;IAClBC,WAAW,GAAG,KAAK;IACnBC,UAAU,GAAG,KAAK;IAClBC,UAAU;IACVC,KAAK;IACLC,IAAI,EAAEC,YAAY;IAClBC,MAAM;IACNC,QAAQ;IACRC,OAAO;IACPC,WAAW;IACXC,cAAc;IACdC,MAAM;IACNC,IAAI,GAAG,MAAM;IACbC;EACF,CAAC,GAAAvB,IAAA;EAGD,MAAMwB,oBAAoB,GAAG9B,WAAW,CACtC+B,KAAA;IAAA,IAAC;MAAEC,eAAe;MAAEnB;IAAG,CAAC,GAAAkB,KAAA;IAAA,OACtB5B,IAAA,CAAA8B,UAAA;MACE,oBAAkBD,eAAgB;MAClCE,YAAY,EAAE1B,gBAAiB;MAE/B2B,SAAS,EAAE1B,eAAgB;MAC3B,WAASkB,MAAO;MAChBjB,YAAY,EACVA,YAAY,IACVP,IAAA,CAAAiC,eAAA;QAAgBC,QAAQ,EAAC,KAAK;QAAAC,QAAA,EAAE5B;MAAY,CAAiB,CAEhE;MACDG,EAAE,EAAEA,EAAG;MACP0B,SAAS,EAAEvB,WAAY;MACvBI,IAAI,EAAEC,YAAY,IAAIR,EAAG;MACzBS,MAAM,EAAEA,MAAO;MACfC,QAAQ,EAAEA,QAAS;MACnBC,OAAO,EAAEA,OAAQ;MACjBC,WAAW,EAAEA,WAAY;MACzBe,QAAQ,EAAEtB,UAAW;MACrBX,GAAG,EAAEA,GAAI;MACTkC,QAAQ,EAAE,CAACxB,UAAW;MACtBS,cAAc,EACZA,cAAc,IACZvB,IAAA,CAAAiC,eAAA;QAAgBC,QAAQ,EAAC,OAAO;QAAAC,QAAA,EAAEZ;MAAc,CAAiB,CAEpE;MACDE,IAAI,EAAEA,IAAK;MACXC,KAAK,EAAEA;IAAM,CACd,CAAC;EAAA,CACH,EACD,CACErB,gBAAgB,EAChBC,eAAe,EACfC,YAAY,EACZM,WAAW,EACXK,YAAY,EACZE,QAAQ,EACRC,OAAO,EACPF,MAAM,EACNG,WAAW,EACXR,UAAU,EACVC,UAAU,EACVX,GAAG,EACHmB,cAAc,EACdC,MAAM,EACNC,IAAI,EACJC,KAAK,CAET,CAAC;EAED,OACE1B,IAAA,CAACF,KAAK;IACJU,YAAY,EAAEA,YAAa;IAC3B+B,SAAS,EAAC,QAAQ;IAClBC,eAAe;IACf/B,IAAI,EAAEA,IAAK;IACXC,EAAE,EAAEC,UAAW;IACfC,UAAU,EAAEA,UAAW;IACvBE,UAAU,EAAEA,UAAW;IACvBE,KAAK,EAAEA,KAAM;IACbW,oBAAoB,EAAEA;EAAqB,CAC5C,CAAC;AAEN,CACF,CAAC;AAED,MAAMc,iBAAiB,GAAG7C,IAAI,CAACM,SAAS,CAAC;AACzCuC,iBAAiB,CAACC,WAAW,GAAG,WAAW;AAE3C,SAASD,iBAAiB,IAAIvC,SAAS"}

package/dist/Toast.js

@@ -36,6 +36,7 @@ const Toast = _ref => {
     onHide: onHideProp,
     role,
     severity,
+    testId,
     text
   } = _ref;
   const {
@@ -63,6 +64,7 @@ const Toast = _ref => {
         startIcon: _jsx(CloseIcon, {}),
         variant: "floating"
       }),
+      "data-se": testId,
       role: role,
       severity: severity,
       variant: "toast",

package/dist/Toast.js.map

@@ -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","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\";\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};\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  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        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;AAE/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,IAUI;EAAA,IAVH;IACbC,gBAAgB,GAAG,IAAI;IACvBC,aAAa;IACbC,QAAQ;IACRC,OAAO;IACPC,SAAS,EAAEC,aAAa;IACxBC,MAAM,EAAEC,UAAU;IAClBC,IAAI;IACJC,QAAQ;IACRC;EACU,CAAC,GAAAX,IAAA;EACX,MAAM;IAAEY;EAAE,CAAC,GAAGtB,cAAc,CAAC,CAAC;EAE9B,MAAM,CAACe,SAAS,EAAEQ,YAAY,CAAC,GAAG7B,QAAQ,CAACsB,aAAa,CAAC;EAEzDxB,SAAS,CAAC,MAAM;IACd+B,YAAY,CAACP,aAAa,CAAC;EAC7B,CAAC,EAAE,CAACA,aAAa,CAAC,CAAC;EAEnB,MAAMC,MAAM,GAAGtB,WAAW,CAAC,MAAM;IAC/B4B,YAAY,CAAC,KAAK,CAAC;IACnBL,UAAU,GAAG,CAAC;EAChB,CAAC,EAAE,CAACA,UAAU,CAAC,CAAC;EAEhB,OACEhB,IAAA,CAAAsB,SAAA;IACEC,IAAI,EAAEV,SAAU;IAChBJ,gBAAgB,EACdC,aAAa,IAAID,gBAAgB,IAAI,CAAC,GAAGe,SAAS,GAAGf,gBACtD;IACDgB,OAAO,EAAEV,MAAO;IAChBW,SAAS,EAAC,OAAO;IACjBrB,sBAAsB,EAAEA,sBAAuB;IAAAsB,QAAA,EAE/CzB,KAAA,CAAA0B,MAAA;MACEC,MAAM,EACJnB,aAAa,KAAK,IAAI,IACpBV,IAAA,CAACH,MAAM;QACLiC,SAAS,EAAEV,CAAC,CAAC,kBAAkB,CAAE;QACjCW,OAAO,EAAEhB,MAAO;QAChBiB,IAAI,EAAC,OAAO;QACZC,SAAS,EAAEjC,IAAA,CAACJ,SAAS,IAAE,CAAE;QACzBsC,OAAO,EAAC;MAAU,CACnB,CAEJ;MACDjB,IAAI,EAAEA,IAAK;MACXC,QAAQ,EAAEA,QAAS;MACnBgB,OAAO,EAAC,OAAO;MAAAP,QAAA,GAEfzB,KAAA,CAAAiC,WAAA;QAAAR,QAAA,GACEzB,KAAA;UAAMkC,KAAK,EAAE1C,cAAe;UAAAiC,QAAA,GAAET,QAAQ,EAAC,GAAC;QAAA,CAAM,CAAC,EAC9CC,IAAI;MAAA,CACK,CAAC,EACZP,OAAO,IACNZ,IAAA,CAACL,IAAI;QAAC0C,IAAI,EAAEzB,OAAQ;QAACsB,OAAO,EAAC,YAAY;QAAAP,QAAA,EACtChB;MAAQ,CACL,CACP;IAAA,CACI;EAAC,CACA,CAAC;AAEf,CAAC;AAED,MAAM2B,aAAa,GAAG/C,IAAI,CAACgB,KAAK,CAAC;AACjC+B,aAAa,CAACC,WAAW,GAAG,OAAO;AAEnC,SAASD,aAAa,IAAI/B,KAAK"}
+{"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"}

package/dist/Tooltip.js

@@ -17,9 +17,11 @@ export const Tooltip = _ref => {
     ariaType,
     children,
     placement = "top",
+    testId,
     text
   } = _ref;
   return _jsx(_Tooltip, {
+    "data-se": testId,
     describeChild: ariaType === "description",
     placement: placement,
     title: text,

package/dist/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","names":["MuiPropsChild","jsx","_jsx","Tooltip","_ref","ariaType","children","placement","text","_Tooltip","describeChild","title"],"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 } from \"react\";\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};\n\nexport const Tooltip = ({\n  ariaType,\n  children,\n  placement = \"top\",\n  text,\n}: TooltipProps) => (\n  <MuiTooltip\n    describeChild={ariaType === \"description\"}\n    placement={placement}\n    title={text}\n  >\n    <MuiPropsChild>{children}</MuiPropsChild>\n  </MuiTooltip>\n);\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA,SAeSA,aAAa;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAsBtB,OAAO,MAAMC,OAAO,GAAGC,IAAA;EAAA,IAAC;IACtBC,QAAQ;IACRC,QAAQ;IACRC,SAAS,GAAG,KAAK;IACjBC;EACY,CAAC,GAAAJ,IAAA;EAAA,OACbF,IAAA,CAAAO,QAAA;IACEC,aAAa,EAAEL,QAAQ,KAAK,aAAc;IAC1CE,SAAS,EAAEA,SAAU;IACrBI,KAAK,EAAEH,IAAK;IAAAF,QAAA,EAEZJ,IAAA,CAACF,aAAa;MAAAM,QAAA,EAAEA;IAAQ,CAAgB;EAAC,CAC/B,CAAC;AAAA,CACd"}
+{"version":3,"file":"Tooltip.js","names":["MuiPropsChild","jsx","_jsx","Tooltip","_ref","ariaType","children","placement","testId","text","_Tooltip","describeChild","title"],"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 } 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\nexport const 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"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA,SAeSA,aAAa;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAuBtB,OAAO,MAAMC,OAAO,GAAGC,IAAA;EAAA,IAAC;IACtBC,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,CAACF,aAAa;MAAAM,QAAA,EAAEA;IAAQ,CAAgB;EAAC,CAC/B,CAAC;AAAA,CACd"}

package/dist/Typography.js

@@ -10,7 +10,7 @@ import _Typography from "@mui/material/Typography";
  *
  * See the License for the specific language governing permissions and limitations under the License.
  */
-import { useMemo } from "react";
+import { memo, useMemo } from "react";
 import { jsx as _jsx } from "react/jsx-runtime";
 export const typographyVariantMapping = {
   h1: "h1",
@@ -25,7 +25,7 @@ export const typographyVariantMapping = {
   legend: "legend"
 };
 export const typographyColorValues = ["primary", "textPrimary", "secondary", "textSecondary", "error"];
-export const Typography = _ref => {
+const Typography = _ref => {
   let {
     ariaDescribedBy,
     ariaLabel,
@@ -34,6 +34,7 @@ export const Typography = _ref => {
     classes,
     color,
     component: componentProp,
+    testId,
     variant = "body"
   } = _ref;
   const component = useMemo(() => {
@@ -41,7 +42,7 @@ export const Typography = _ref => {
       if (variant === "body") {
         return "p";
       } else if (variant === "subordinate" || variant === "support") {
-        return "h6";
+        return "p";
       } else {
         return variant;
       }
@@ -49,18 +50,20 @@ export const Typography = _ref => {
     return componentProp;
   }, [componentProp, variant]);
   return _jsx(_Typography, {
-    ariaDescribedBy: ariaDescribedBy,
-    ariaLabel: ariaLabel,
-    ariaLabelledBy: ariaLabelledBy,
+    "aria-describedby": ariaDescribedBy,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
     children: children,
     classes: classes,
     color: color,
     component: component,
+    "data-se": testId,
     variant: typographyVariantMapping[variant]
   });
 };
-Typography.displayName = "Typography";
-export const Heading1 = _ref2 => {
+const MemoizedTypography = memo(Typography);
+MemoizedTypography.displayName = "Typography";
+const Heading1 = _ref2 => {
   let {
     ariaDescribedBy,
     ariaLabel,
@@ -68,7 +71,8 @@ export const Heading1 = _ref2 => {
     children,
     classes,
     color,
-    component
+    component,
+    testId
   } = _ref2;
   return _jsx(Typography, {
     ariaDescribedBy: ariaDescribedBy,
@@ -78,11 +82,13 @@ export const Heading1 = _ref2 => {
     classes: classes,
     color: color,
     component: component,
+    "data-se": testId,
     variant: "h1"
   });
 };
-Heading1.displayName = "Heading1";
-export const Heading2 = _ref3 => {
+const MemoizedHeading1 = memo(Heading1);
+MemoizedHeading1.displayName = "Heading1";
+const Heading2 = _ref3 => {
   let {
     ariaDescribedBy,
     ariaLabel,
@@ -90,7 +96,8 @@ export const Heading2 = _ref3 => {
     children,
     classes,
     color,
-    component
+    component,
+    testId
   } = _ref3;
   return _jsx(Typography, {
     ariaDescribedBy: ariaDescribedBy,
@@ -100,11 +107,13 @@ export const Heading2 = _ref3 => {
     classes: classes,
     color: color,
     component: component,
+    "data-se": testId,
     variant: "h2"
   });
 };
-Heading2.displayName = "Heading2";
-export const Heading3 = _ref4 => {
+const MemoizedHeading2 = memo(Heading2);
+MemoizedHeading2.displayName = "Heading2";
+const Heading3 = _ref4 => {
   let {
     ariaDescribedBy,
     ariaLabel,
@@ -112,7 +121,8 @@ export const Heading3 = _ref4 => {
     children,
     classes,
     color,
-    component
+    component,
+    testId
   } = _ref4;
   return _jsx(Typography, {
     ariaDescribedBy: ariaDescribedBy,
@@ -122,11 +132,13 @@ export const Heading3 = _ref4 => {
     classes: classes,
     color: color,
     component: component,
+    "data-se": testId,
     variant: "h3"
   });
 };
-Heading3.displayName = "Heading3";
-export const Heading4 = _ref5 => {
+const MemoizedHeading3 = memo(Heading3);
+MemoizedHeading3.displayName = "Heading3";
+const Heading4 = _ref5 => {
   let {
     ariaDescribedBy,
     ariaLabel,
@@ -134,7 +146,8 @@ export const Heading4 = _ref5 => {
     children,
     classes,
     color,
-    component
+    component,
+    testId
   } = _ref5;
   return _jsx(Typography, {
     ariaDescribedBy: ariaDescribedBy,
@@ -144,11 +157,13 @@ export const Heading4 = _ref5 => {
     classes: classes,
     color: color,
     component: component,
+    "data-se": testId,
     variant: "h4"
   });
 };
-Heading4.displayName = "Heading4";
-export const Heading5 = _ref6 => {
+const MemoizedHeading4 = memo(Heading4);
+MemoizedHeading4.displayName = "Heading4";
+const Heading5 = _ref6 => {
   let {
     ariaDescribedBy,
     ariaLabel,
@@ -156,7 +171,8 @@ export const Heading5 = _ref6 => {
     children,
     classes,
     color,
-    component
+    component,
+    testId
   } = _ref6;
   return _jsx(Typography, {
     ariaDescribedBy: ariaDescribedBy,
@@ -166,11 +182,13 @@ export const Heading5 = _ref6 => {
     classes: classes,
     color: color,
     component: component,
+    "data-se": testId,
     variant: "h5"
   });
 };
-Heading5.displayName = "Heading5";
-export const Heading6 = _ref7 => {
+const MemoizedHeading5 = memo(Heading5);
+MemoizedHeading5.displayName = "Heading5";
+const Heading6 = _ref7 => {
   let {
     ariaDescribedBy,
     ariaLabel,
@@ -178,7 +196,8 @@ export const Heading6 = _ref7 => {
     children,
     classes,
     color,
-    component
+    component,
+    testId
   } = _ref7;
   return _jsx(Typography, {
     ariaDescribedBy: ariaDescribedBy,
@@ -188,11 +207,13 @@ export const Heading6 = _ref7 => {
     classes: classes,
     color: color,
     component: component,
+    "data-se": testId,
     variant: "h6"
   });
 };
-Heading6.displayName = "Heading6";
-export const Paragraph = _ref8 => {
+const MemoizedHeading6 = memo(Heading6);
+MemoizedHeading6.displayName = "Heading6";
+const Paragraph = _ref8 => {
   let {
     ariaDescribedBy,
     ariaLabel,
@@ -200,7 +221,8 @@ export const Paragraph = _ref8 => {
     children,
     classes,
     color,
-    component
+    component,
+    testId
   } = _ref8;
   return _jsx(Typography, {
     ariaDescribedBy: ariaDescribedBy,
@@ -210,11 +232,13 @@ export const Paragraph = _ref8 => {
     classes: classes,
     color: color,
     component: component,
+    "data-se": testId,
     variant: "body"
   });
 };
-Paragraph.displayName = "Paragraph";
-export const Subordinate = _ref9 => {
+const MemoizedParagraph = memo(Paragraph);
+MemoizedParagraph.displayName = "Paragraph";
+const Subordinate = _ref9 => {
   let {
     ariaDescribedBy,
     ariaLabel,
@@ -222,7 +246,8 @@ export const Subordinate = _ref9 => {
     children,
     classes,
     color,
-    component
+    component,
+    testId
   } = _ref9;
   return _jsx(Typography, {
     ariaDescribedBy: ariaDescribedBy,
@@ -232,11 +257,13 @@ export const Subordinate = _ref9 => {
     classes: classes,
     color: color,
     component: component,
+    "data-se": testId,
     variant: "subordinate"
   });
 };
-Subordinate.displayName = "Subordinate";
-export const Support = _ref10 => {
+const MemoizedSubordinate = memo(Subordinate);
+MemoizedSubordinate.displayName = "Subordinate";
+const Support = _ref10 => {
   let {
     ariaDescribedBy,
     ariaLabel,
@@ -244,7 +271,8 @@ export const Support = _ref10 => {
     children,
     classes,
     color,
-    component
+    component,
+    testId
   } = _ref10;
   return _jsx(Typography, {
     ariaDescribedBy: ariaDescribedBy,
@@ -254,11 +282,13 @@ export const Support = _ref10 => {
     classes: classes,
     color: color,
     component: component,
+    "data-se": testId,
     variant: "support"
   });
 };
-Support.displayName = "Support";
-export const Legend = _ref11 => {
+const MemoizedSupport = memo(Support);
+MemoizedSupport.displayName = "Support";
+const Legend = _ref11 => {
   let {
     ariaDescribedBy,
     ariaLabel,
@@ -266,7 +296,8 @@ export const Legend = _ref11 => {
     children,
     classes,
     color,
-    component
+    component,
+    testId
   } = _ref11;
   return _jsx(Typography, {
     ariaDescribedBy: ariaDescribedBy,
@@ -276,8 +307,11 @@ export const Legend = _ref11 => {
     classes: classes,
     color: color,
     component: component,
+    "data-se": testId,
     variant: "legend"
   });
 };
-Legend.displayName = "Legend";
+const MemoizedLegend = memo(Legend);
+MemoizedLegend.displayName = "Legend";
+export { MemoizedTypography as Typography, MemoizedHeading1 as Heading1, MemoizedHeading2 as Heading2, MemoizedHeading3 as Heading3, MemoizedHeading4 as Heading4, MemoizedHeading5 as Heading5, MemoizedHeading6 as Heading6, MemoizedLegend as Legend, MemoizedParagraph as Paragraph, MemoizedSubordinate as Subordinate, MemoizedSupport as Support };
 //# sourceMappingURL=Typography.js.map