@okta/odyssey-react-mui 0.22.0 → 0.24.0

package/CHANGELOG.md

@@ -3,6 +3,50 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.24.0](https://github.com/okta/odyssey/compare/v0.23.0...v0.24.0) (2023-05-25)
+
+### Features
+
+- add odyssey token override support ([#1797](https://github.com/okta/odyssey/issues/1797)) ([52543cc](https://github.com/okta/odyssey/commit/52543cc5bc37ab5ad639434d80faa4683a1e8061))
+- make tranlationOverrides available via pass-through prop ([cb6fbe4](https://github.com/okta/odyssey/commit/cb6fbe45c14c05d639d147618f4279c538b034e2))
+- **odyssey-react-mui:** add Form and Fieldset components ([bc4cfe6](https://github.com/okta/odyssey/commit/bc4cfe690dd4d95cc60d6410b47800cfcc0f1bc2))
+- **odyssey-react-mui:** implement translation system via OdysseyTranslationProvider ([3c3fe2d](https://github.com/okta/odyssey/commit/3c3fe2dba78b21a8bc859ba33b5cd15e03c0c590))
+- wrap the Select ([26452d9](https://github.com/okta/odyssey/commit/26452d9712c69531d5e3637f84f6e4b8c187a526))
+
+### Bug Fixes
+
+- add href to Link ([93009b7](https://github.com/okta/odyssey/commit/93009b78e849476f99a56381f82771e3768e2e80))
+- correct type error ([0a2d09e](https://github.com/okta/odyssey/commit/0a2d09e676ee24c803516a953be6cd5033936480))
+- fix type errors ([30275bc](https://github.com/okta/odyssey/commit/30275bc70653f1ab2e07ee0e3f07faad2d8d7216))
+- **odyssey-react-mui:** add proper displayName for TextField ([cd0eff0](https://github.com/okta/odyssey/commit/cd0eff05b0c35ea158cf19e6e2585eb9c83038fa))
+- **odyssey-react-mui:** fix RTL placement of Select chevron ([9d99d9d](https://github.com/okta/odyssey/commit/9d99d9dcf5d166c46f1ea72d2bce2affe7ee0b6c))
+- remove unused forwardRef from Icon and Toast ([bdfd1b1](https://github.com/okta/odyssey/commit/bdfd1b1a523579c3c6699915957197f5dc67776a))
+- renderValue was missing a useCallback wrapper ([#1800](https://github.com/okta/odyssey/issues/1800)) ([40d9566](https://github.com/okta/odyssey/commit/40d95669bf9d1f394aeb163fc41d46823f312d7f))
+
+## [0.23.0](https://github.com/okta/odyssey/compare/v0.22.0...v0.23.0) (2023-05-08)
+
+### Features
+
+- add uniqueId to MenuButton button ([a06377b](https://github.com/okta/odyssey/commit/a06377b1c10c49b5e68722b0bb775b8277cac781))
+- wrap the Dialog ([1f8b331](https://github.com/okta/odyssey/commit/1f8b3314a135333369f44efc21de097cd0d42712))
+- wrapped Toast ([bf6d5c7](https://github.com/okta/odyssey/commit/bf6d5c779d0b57a0bd74f537ada7be763df1080e))
+
+### Bug Fixes
+
+- add Field wrapper to CheckboxGroup and RadioGroup ([#1762](https://github.com/okta/odyssey/issues/1762)) ([6f8c14d](https://github.com/okta/odyssey/commit/6f8c14d9d7ebcf0c5f9bbcb0e867820b5631b7a3))
+- add missing onInput to Autocomplete ([#1757](https://github.com/okta/odyssey/issues/1757)) ([9d6c628](https://github.com/okta/odyssey/commit/9d6c628e3cc8675a6752f5a617d55f580d475c04))
+- add name to fields ([a891438](https://github.com/okta/odyssey/commit/a89143845ddd72ecfa218233cdd3ab0c51e94aca))
+- Fix broken Toast stories ([b5651f6](https://github.com/okta/odyssey/commit/b5651f6eb8d6578305fecd3d92be7c9d18eea27d))
+- fix disabled selection radios ([50be355](https://github.com/okta/odyssey/commit/50be3557e46d23bc9e99bfdcbf668fe097b58fb4))
+- Icon generation now using newest version of SVGR and SVGO ([#1755](https://github.com/okta/odyssey/issues/1755)) ([89a30a3](https://github.com/okta/odyssey/commit/89a30a3685d1bd1600abf3876d910a19ff236f9b))
+- **odyssey-react-mui:** allow pointer-events on :disabled buttons but not :active:disabled ([30bb4bf](https://github.com/okta/odyssey/commit/30bb4bf93edeffe7558204c2cce46ffe7b2b85bf))
+- **odyssey-react-mui:** ensure pointer events are disabled when Button is ([bfd162f](https://github.com/okta/odyssey/commit/bfd162f2ec86d866f8e77b94d0f828440a4c78e2))
+- **odyssey-react-mui:** fix Icon sizing for Checkbox ([96c5acd](https://github.com/okta/odyssey/commit/96c5acdf9916c8db9edbf744f774eb17695b25ef))
+- **odyssey-react-mui:** fixed TextField always showing input adronment ([#1785](https://github.com/okta/odyssey/issues/1785)) ([9170df0](https://github.com/okta/odyssey/commit/9170df0f8c771fdad398e5460766da77f27c0b3e))
+- **odyssey-react-mui:** pass variant and target props to Link ([6594fcd](https://github.com/okta/odyssey/commit/6594fcd801689518da4ec7df13fd33c8726bd44b))
+- **odyssey-react-mui:** the Tooltip not working on Button ([7935b94](https://github.com/okta/odyssey/commit/7935b940dda9969aedaf16b7d9ef776352f7ec28))
+- updated Migration doc ([87c37ca](https://github.com/okta/odyssey/commit/87c37caa7ae39733ddd378a45f8a275af3ac670d))
+
 ## [0.22.0](https://github.com/okta/odyssey/compare/v0.21.4...v0.22.0) (2023-04-21)
 
 ### Features

package/README.md

@@ -44,12 +44,14 @@ Import named ESM exports:
 import { PasswordInput } from "@okta/odyssey-react-mui";
 ```
 
-Add the Odyssey `ThemeProvider` around your whole app:
+Add the Odyssey `OdysseyProvider` around your whole app:
 
 ```jsx
-import { ThemeProvider } from "@okta/odyssey-react-mui";
+import { OdysseyProvider } from "@okta/odyssey-react-mui";
 
-const YourAppRoot = ({ children }) => <ThemeProvider>{children}</ThemeProvider>;
+const YourAppRoot = ({ children }) => (
+  <OdysseyProvider>{children}</OdysseyProvider>
+);
 ```
 
 Add Material-UI components not exported from Odyssey with Odyssey styling or add your own theme to MUI:
@@ -72,16 +74,50 @@ const YourAppRoot = ({ children }) => (
 
 It’s possible to have 2 versions of Odyssey running at the same time, so when adding MUI, you can do it piecemeal.
 
-This is how you setup two `ThemeProvider`s like so:
+This is how you setup two `OdysseyProvider`s like so:
 
 ```jsx
-import { ThemeProvider as OdysseyMuiThemeProvider } from "@okta/odyssey-react-mui";
+import { OdysseyProvider } from "@okta/odyssey-react-mui";
 import { ThemeProvider as OdysseyLegacyThemeProvider } from "@okta/odyssey-react-theme";
 
 const YourAppRoot = ({ children }) => (
-  <OdysseyMuiThemeProvider>
+  <OdysseyProvider>
     <OdysseyLegacyThemeProvider>{children}</OdysseyLegacyThemeProvider>
-  </OdysseyMuiThemeProvider>
+  </OdysseyProvider>
+);
+```
+
+### Overrides
+
+It is possible to provide `nonce`, `themeOverride`, `languageCode` and `translationOverrides` to the underlying components via props:
+
+```jsx
+import { OdysseyProvider } from "@okta/odyssey-react-mui";
+import { theme } from "./themeOverride";
+
+const nonce =
+  "K6ybeaqlwaAKk0hQF?hE2qZ0Ar3M=G4Bpr-XFk1x4XbL3dH3T5=mk0aXeWX9ifn9";
+
+const languageCode = "en";
+
+const translationOverrides = {
+  en: {
+    "fieldlabel.optional.text": "Not Required",
+  },
+  fr: {
+    "fieldlabel.optional.text": "Non Requis",
+  },
+};
+
+const YourAppRoot = ({ children }) => (
+  <OdysseyProvider
+    nonce={nonce}
+    themeOverride={theme}
+    languageCode={languageCode}
+    translationOverrides={translationOverrides}
+  >
+    {children}
+  </OdysseyProvider>
 );
 ```
 

package/dist/@types/i18next.d.js

@@ -0,0 +1,14 @@
+/*!
+ * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.
+ * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
+ *
+ * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *
+ * See the License for the specific language governing permissions and limitations under the License.
+ */
+
+import "i18next";
+//# sourceMappingURL=i18next.d.js.map

package/dist/@types/i18next.d.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"i18next.d.js","names":[],"sources":["../../src/@types/i18next.d.ts"],"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 \"i18next\";\nimport { translation as en } from \"../properties/ts/odyssey-react-mui\";\n\ndeclare module \"i18next\" {\n  interface CustomTypeOptions {\n    resources: {\n      translations: typeof en;\n    };\n  }\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAO,SAAS"}

package/dist/Autocomplete.js

@@ -1,9 +1,19 @@
 import _Autocomplete from "@mui/material/Autocomplete";
 import _InputBase from "@mui/material/InputBase";
+/*!
+ * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.
+ * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
+ *
+ * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *
+ * See the License for the specific language governing permissions and limitations under the License.
+ */
 import { memo, useCallback } from "react";
 import { Field } from "./Field.js";
 import { jsx as _jsx } from "react/jsx-runtime";
-
 const Autocomplete = _ref => {
   let {
     isCustomValueAllowed,
@@ -14,6 +24,7 @@ const Autocomplete = _ref => {
     hint,
     label,
     onChange,
+    onInputChange,
     options,
     value
   } = _ref;
@@ -23,8 +34,10 @@ const Autocomplete = _ref => {
       InputProps,
       ...params
     } = _ref2;
-    return _jsx(Field, { ...InputLabelProps,
+    return _jsx(Field, {
+      fieldType: "single",
       hasVisibleLabel: true,
+      id: InputLabelProps.htmlFor,
       hint: hint,
       label: label,
       renderFieldComponent: _ref3 => {
@@ -32,7 +45,8 @@ const Autocomplete = _ref => {
           ariaDescribedBy,
           id
         } = _ref3;
-        return _jsx(_InputBase, { ...params,
+        return _jsx(_InputBase, {
+          ...params,
           ...InputProps,
           "aria-describedby": ariaDescribedBy,
           id: id
@@ -46,13 +60,13 @@ const Autocomplete = _ref => {
     loading: isLoading,
     multiple: hasMultipleChoices,
     onChange: onChange,
+    onInputChange: onInputChange,
     options: options,
     readOnly: isReadOnly,
     renderInput: renderInput,
     value: value
   });
 };
-
 const MemoizedAutocomplete = memo(Autocomplete);
 export { MemoizedAutocomplete as Autocomplete };
 //# sourceMappingURL=Autocomplete.js.map

package/dist/Autocomplete.js.map

@@ -1 +1 @@
-{"version":3,"file":"Autocomplete.js","names":["memo","useCallback","Field","Autocomplete","isCustomValueAllowed","hasMultipleChoices","isDisabled","isLoading","isReadOnly","hint","label","onChange","options","value","renderInput","InputLabelProps","InputProps","params","ariaDescribedBy","id","MemoizedAutocomplete"],"sources":["../src/Autocomplete.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  Autocomplete as MuiAutocomplete,\n  AutocompleteProps as MuiAutocompleteProps,\n  InputBase,\n} from \"@mui/material\";\nimport { memo, useCallback } from \"react\";\n\nimport { Field } from \"./Field\";\n\nexport type AutocompleteProps<\n  OptionType,\n  HasMultipleChoices extends boolean | undefined,\n  IsCustomValueAllowed extends boolean | undefined\n> = {\n  hasMultipleChoices?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"multiple\"];\n  hint?: string;\n  isCustomValueAllowed?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"freeSolo\"];\n  isDisabled?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"disabled\"];\n  isLoading?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"loading\"];\n  isReadOnly?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"readOnly\"];\n  label: string;\n  onChange?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"onChange\"];\n  options: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"options\"];\n  value?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"value\"];\n};\n\nconst Autocomplete = <\n  OptionType,\n  HasMultipleChoices extends boolean | undefined,\n  IsCustomValueAllowed extends boolean | undefined\n>({\n  isCustomValueAllowed,\n  hasMultipleChoices,\n  isDisabled,\n  isLoading,\n  isReadOnly,\n  hint,\n  label,\n  onChange,\n  options,\n  value,\n}: AutocompleteProps<OptionType, HasMultipleChoices, IsCustomValueAllowed>) => {\n  const renderInput = useCallback(\n    ({ InputLabelProps, InputProps, ...params }) => (\n      <Field\n        {...InputLabelProps}\n        hasVisibleLabel\n        hint={hint}\n        label={label}\n        renderFieldComponent={({ ariaDescribedBy, id }) => (\n          <InputBase\n            {...params}\n            {...InputProps}\n            aria-describedby={ariaDescribedBy}\n            id={id}\n          />\n        )}\n      />\n    ),\n    [hint, label]\n  );\n\n  return (\n    <MuiAutocomplete\n      disabled={isDisabled}\n      freeSolo={isCustomValueAllowed}\n      loading={isLoading}\n      multiple={hasMultipleChoices}\n      onChange={onChange}\n      options={options}\n      readOnly={isReadOnly}\n      renderInput={renderInput}\n      value={value}\n    />\n  );\n};\n\nconst MemoizedAutocomplete = memo(Autocomplete) as typeof Autocomplete;\n\nexport { MemoizedAutocomplete as Autocomplete };\n"],"mappings":";;AAiBA,SAASA,IAAT,EAAeC,WAAf,QAAkC,OAAlC;SAESC,K;;;AA2DT,MAAMC,YAAY,GAAG,QAe0D;EAAA,IAX7E;IACAC,oBADA;IAEAC,kBAFA;IAGAC,UAHA;IAIAC,SAJA;IAKAC,UALA;IAMAC,IANA;IAOAC,KAPA;IAQAC,QARA;IASAC,OATA;IAUAC;EAVA,CAW6E;EAC7E,MAAMC,WAAW,GAAGb,WAAW,CAC7B;IAAA,IAAC;MAAEc,eAAF;MAAmBC,UAAnB;MAA+B,GAAGC;IAAlC,CAAD;IAAA,OACE,KAAC,KAAD,OACMF,eADN;MAEE,eAAe,MAFjB;MAGE,IAAI,EAAEN,IAHR;MAIE,KAAK,EAAEC,KAJT;MAKE,oBAAoB,EAAE;QAAA,IAAC;UAAEQ,eAAF;UAAmBC;QAAnB,CAAD;QAAA,OACpB,sBACMF,MADN;UAAA,GAEMD,UAFN;UAGE,oBAAkBE,eAHpB;UAIE,EAAE,EAAEC;QAJN,EADoB;MAAA;IALxB,EADF;EAAA,CAD6B,EAiB7B,CAACV,IAAD,EAAOC,KAAP,CAjB6B,CAA/B;EAoBA,OACE;IACE,QAAQ,EAAEJ,UADZ;IAEE,QAAQ,EAAEF,oBAFZ;IAGE,OAAO,EAAEG,SAHX;IAIE,QAAQ,EAAEF,kBAJZ;IAKE,QAAQ,EAAEM,QALZ;IAME,OAAO,EAAEC,OANX;IAOE,QAAQ,EAAEJ,UAPZ;IAQE,WAAW,EAAEM,WARf;IASE,KAAK,EAAED;EATT,EADF;AAaD,CAjDD;;AAmDA,MAAMO,oBAAoB,GAAGpB,IAAI,CAACG,YAAD,CAAjC;AAEA,SAASiB,oBAAoB,IAAIjB,YAAjC"}
+{"version":3,"file":"Autocomplete.js","names":["memo","useCallback","Field","jsx","_jsx","Autocomplete","_ref","isCustomValueAllowed","hasMultipleChoices","isDisabled","isLoading","isReadOnly","hint","label","onChange","onInputChange","options","value","renderInput","_ref2","InputLabelProps","InputProps","params","fieldType","hasVisibleLabel","id","htmlFor","renderFieldComponent","_ref3","ariaDescribedBy","_InputBase","_Autocomplete","disabled","freeSolo","loading","multiple","readOnly","MemoizedAutocomplete"],"sources":["../src/Autocomplete.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  Autocomplete as MuiAutocomplete,\n  AutocompleteProps as MuiAutocompleteProps,\n  InputBase,\n} from \"@mui/material\";\nimport { memo, useCallback } from \"react\";\n\nimport { Field } from \"./Field\";\n\nexport type AutocompleteProps<\n  OptionType,\n  HasMultipleChoices extends boolean | undefined,\n  IsCustomValueAllowed extends boolean | undefined\n> = {\n  hasMultipleChoices?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"multiple\"];\n  hint?: string;\n  isCustomValueAllowed?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"freeSolo\"];\n  isDisabled?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"disabled\"];\n  isLoading?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"loading\"];\n  isReadOnly?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"readOnly\"];\n  label: string;\n  onChange?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"onChange\"];\n  onInputChange?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"onInputChange\"];\n  options: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"options\"];\n  value?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"value\"];\n};\n\nconst Autocomplete = <\n  OptionType,\n  HasMultipleChoices extends boolean | undefined,\n  IsCustomValueAllowed extends boolean | undefined\n>({\n  isCustomValueAllowed,\n  hasMultipleChoices,\n  isDisabled,\n  isLoading,\n  isReadOnly,\n  hint,\n  label,\n  onChange,\n  onInputChange,\n  options,\n  value,\n}: AutocompleteProps<OptionType, HasMultipleChoices, IsCustomValueAllowed>) => {\n  const renderInput = useCallback(\n    ({ InputLabelProps, InputProps, ...params }) => (\n      <Field\n        fieldType=\"single\"\n        hasVisibleLabel\n        id={InputLabelProps.htmlFor}\n        hint={hint}\n        label={label}\n        renderFieldComponent={({ ariaDescribedBy, id }) => (\n          <InputBase\n            {...params}\n            {...InputProps}\n            aria-describedby={ariaDescribedBy}\n            id={id}\n          />\n        )}\n      />\n    ),\n    [hint, label]\n  );\n\n  return (\n    <MuiAutocomplete\n      disabled={isDisabled}\n      freeSolo={isCustomValueAllowed}\n      loading={isLoading}\n      multiple={hasMultipleChoices}\n      onChange={onChange}\n      onInputChange={onInputChange}\n      options={options}\n      readOnly={isReadOnly}\n      renderInput={renderInput}\n      value={value}\n    />\n  );\n};\n\nconst MemoizedAutocomplete = memo(Autocomplete) as typeof Autocomplete;\n\nexport { MemoizedAutocomplete as Autocomplete };\n"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAOA,SAASA,IAAI,EAAEC,WAAW,QAAQ,OAAO;AAAC,SAEjCC,KAAK;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAiEd,MAAMC,YAAY,GAAGC,IAAA,IAgB0D;EAAA,IAZ7E;IACAC,oBAAoB;IACpBC,kBAAkB;IAClBC,UAAU;IACVC,SAAS;IACTC,UAAU;IACVC,IAAI;IACJC,KAAK;IACLC,QAAQ;IACRC,aAAa;IACbC,OAAO;IACPC;EACuE,CAAC,GAAAX,IAAA;EACxE,MAAMY,WAAW,GAAGjB,WAAW,CAC7BkB,KAAA;IAAA,IAAC;MAAEC,eAAe;MAAEC,UAAU;MAAE,GAAGC;IAAO,CAAC,GAAAH,KAAA;IAAA,OACzCf,IAAA,CAACF,KAAK;MACJqB,SAAS,EAAC,QAAQ;MAClBC,eAAe;MACfC,EAAE,EAAEL,eAAe,CAACM,OAAQ;MAC5Bd,IAAI,EAAEA,IAAK;MACXC,KAAK,EAAEA,KAAM;MACbc,oBAAoB,EAAEC,KAAA;QAAA,IAAC;UAAEC,eAAe;UAAEJ;QAAG,CAAC,GAAAG,KAAA;QAAA,OAC5CxB,IAAA,CAAA0B,UAAA;UAAA,GACMR,MAAM;UAAA,GACND,UAAU;UACd,oBAAkBQ,eAAgB;UAClCJ,EAAE,EAAEA;QAAG,CACR,CAAC;MAAA;IACF,CACH,CAAC;EAAA,CACH,EACD,CAACb,IAAI,EAAEC,KAAK,CACd,CAAC;EAED,OACET,IAAA,CAAA2B,aAAA;IACEC,QAAQ,EAAEvB,UAAW;IACrBwB,QAAQ,EAAE1B,oBAAqB;IAC/B2B,OAAO,EAAExB,SAAU;IACnByB,QAAQ,EAAE3B,kBAAmB;IAC7BM,QAAQ,EAAEA,QAAS;IACnBC,aAAa,EAAEA,aAAc;IAC7BC,OAAO,EAAEA,OAAQ;IACjBoB,QAAQ,EAAEzB,UAAW;IACrBO,WAAW,EAAEA,WAAY;IACzBD,KAAK,EAAEA;EAAM,CACd,CAAC;AAEN,CAAC;AAED,MAAMoB,oBAAoB,GAAGrC,IAAI,CAACK,YAAY,CAAwB;AAEtE,SAASgC,oBAAoB,IAAIhC,YAAY"}

package/dist/Banner.js

@@ -9,27 +9,31 @@
  *
  * See the License for the specific language governing permissions and limitations under the License.
  */
+
 import { memo } from "react";
 import { Alert, Link, ScreenReaderText } from "./index.js";
+import { useTranslation } from "react-i18next";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { jsx as _jsx } from "react/jsx-runtime";
-
 const Banner = _ref => {
   let {
-    onClose,
-    severity,
-    role,
     linkUrl,
     linkText,
+    onClose,
+    role,
+    severity,
     text
   } = _ref;
+  const {
+    t
+  } = useTranslation();
   return _jsxs(Alert, {
     onClose: onClose,
     role: role,
     severity: severity,
     variant: "banner",
     children: [_jsxs(ScreenReaderText, {
-      children: [severity, ":"]
+      children: [t(`severity.${severity}`), ":"]
     }), text, linkUrl && _jsx(Link, {
       href: linkUrl,
       variant: "monochrome",
@@ -37,7 +41,6 @@ const Banner = _ref => {
     })]
   });
 };
-
 const MemoizedBanner = memo(Banner);
 export { MemoizedBanner as Banner };
 //# sourceMappingURL=Banner.js.map

package/dist/Banner.js.map

@@ -1 +1 @@
-{"version":3,"file":"Banner.js","names":["memo","Alert","Link","ScreenReaderText","Banner","onClose","severity","role","linkUrl","linkText","text","MemoizedBanner"],"sources":["../src/Banner.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 { AlertColor, AlertProps } from \"@mui/material\";\nimport { memo } from \"react\";\nimport { Alert, Link, ScreenReaderText } from \"./\";\n\nexport interface BannerProps {\n  /**\n   * Determine the color and icon of the alert\n   */\n  severity: AlertColor;\n  /**\n   * Sets the ARIA role of the alert\n   * (\"status\" for something that dynamically updates, \"alert\" for errors, null for something\n   * unchanging)\n   */\n  role?: \"status\" | \"alert\";\n  /**\n   * The text content of the alert\n   */\n  text: string;\n  /**\n   * The function that's fired when the user clicks the close button. If undefined,\n   * the close button will not be shown.\n   */\n  onClose?: AlertProps[\"onClose\"];\n  /**\n   * If defined, the alert will include a link to the URL\n   */\n  linkUrl?: string;\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\nconst Banner = ({\n  onClose,\n  severity,\n  role,\n  linkUrl,\n  linkText,\n  text,\n}: BannerProps) => (\n  <Alert onClose={onClose} role={role} severity={severity} variant=\"banner\">\n    <ScreenReaderText>{severity}:</ScreenReaderText>\n    {text}\n    {linkUrl && (\n      <Link href={linkUrl} variant=\"monochrome\">\n        {linkText}\n      </Link>\n    )}\n  </Alert>\n);\n\nconst MemoizedBanner = memo(Banner);\n\nexport { MemoizedBanner as Banner };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,SAASA,IAAT,QAAqB,OAArB;SACSC,K,EAAOC,I,EAAMC,gB;;;;AAkCtB,MAAMC,MAAM,GAAG;EAAA,IAAC;IACdC,OADc;IAEdC,QAFc;IAGdC,IAHc;IAIdC,OAJc;IAKdC,QALc;IAMdC;EANc,CAAD;EAAA,OAQb,MAAC,KAAD;IAAO,OAAO,EAAEL,OAAhB;IAAyB,IAAI,EAAEE,IAA/B;IAAqC,QAAQ,EAAED,QAA/C;IAAyD,OAAO,EAAC,QAAjE;IAAA,WACE,MAAC,gBAAD;MAAA,WAAmBA,QAAnB;IAAA,EADF,EAEGI,IAFH,EAGGF,OAAO,IACN,KAAC,IAAD;MAAM,IAAI,EAAEA,OAAZ;MAAqB,OAAO,EAAC,YAA7B;MAAA,UACGC;IADH,EAJJ;EAAA,EARa;AAAA,CAAf;;AAmBA,MAAME,cAAc,GAAGX,IAAI,CAACI,MAAD,CAA3B;AAEA,SAASO,cAAc,IAAIP,MAA3B"}
+{"version":3,"file":"Banner.js","names":["memo","Alert","Link","ScreenReaderText","useTranslation","jsxs","_jsxs","jsx","_jsx","Banner","_ref","linkUrl","linkText","onClose","role","severity","text","t","variant","children","href","MemoizedBanner"],"sources":["../src/Banner.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 { AlertColor, AlertProps } from \"@mui/material\";\nimport { memo } from \"react\";\nimport { Alert, Link, ScreenReaderText } from \"./\";\nimport { useTranslation } from \"react-i18next\";\n\nexport type BannerProps = {\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 alert will include a link to the URL\n   */\n  linkUrl?: string;\n  /**\n   * The function that's fired when the user clicks the close button. If undefined,\n   * the close button will not be shown.\n   */\n  onClose?: AlertProps[\"onClose\"];\n  /**\n   * Sets the ARIA role of the alert\n   * (\"status\" for something that dynamically updates, \"alert\" for errors, null for something\n   * unchanging)\n   */\n  role?: \"status\" | \"alert\";\n  /**\n   * Determine the color and icon of the alert\n   */\n  severity: AlertColor;\n  /**\n   * The text content of the alert\n   */\n  text: string;\n};\n\nconst Banner = ({\n  linkUrl,\n  linkText,\n  onClose,\n  role,\n  severity,\n  text,\n}: BannerProps) => {\n  const { t } = useTranslation();\n\n  return (\n    <Alert onClose={onClose} role={role} severity={severity} variant=\"banner\">\n      <ScreenReaderText>{t(`severity.${severity}`)}:</ScreenReaderText>\n      {text}\n      {linkUrl && (\n        <Link href={linkUrl} variant=\"monochrome\">\n          {linkText}\n        </Link>\n      )}\n    </Alert>\n  );\n};\n\nconst MemoizedBanner = memo(Banner);\n\nexport { MemoizedBanner as Banner };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAGA,SAASA,IAAI,QAAQ,OAAO;AAAC,SACpBC,KAAK,EAAEC,IAAI,EAAEC,gBAAgB;AACtC,SAASC,cAAc,QAAQ,eAAe;AAAC,SAAAC,IAAA,IAAAC,KAAA;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAkC/C,MAAMC,MAAM,GAAGC,IAAA,IAOI;EAAA,IAPH;IACdC,OAAO;IACPC,QAAQ;IACRC,OAAO;IACPC,IAAI;IACJC,QAAQ;IACRC;EACW,CAAC,GAAAN,IAAA;EACZ,MAAM;IAAEO;EAAE,CAAC,GAAGb,cAAc,CAAC,CAAC;EAE9B,OACEE,KAAA,CAACL,KAAK;IAACY,OAAO,EAAEA,OAAQ;IAACC,IAAI,EAAEA,IAAK;IAACC,QAAQ,EAAEA,QAAS;IAACG,OAAO,EAAC,QAAQ;IAAAC,QAAA,GACvEb,KAAA,CAACH,gBAAgB;MAAAgB,QAAA,GAAEF,CAAC,CAAE,YAAWF,QAAS,EAAC,CAAC,EAAC,GAAC;IAAA,CAAkB,CAAC,EAChEC,IAAI,EACJL,OAAO,IACNH,IAAA,CAACN,IAAI;MAACkB,IAAI,EAAET,OAAQ;MAACO,OAAO,EAAC,YAAY;MAAAC,QAAA,EACtCP;IAAQ,CACL,CACP;EAAA,CACI,CAAC;AAEZ,CAAC;AAED,MAAMS,cAAc,GAAGrB,IAAI,CAACS,MAAM,CAAC;AAEnC,SAASY,cAAc,IAAIZ,MAAM"}

package/dist/Button.js

@@ -1,10 +1,21 @@
 import _Button from "@mui/material/Button";
-import { Tooltip } from "./index.js";
-import { memo } from "react";
+/*!
+ * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.
+ * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
+ *
+ * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *
+ * See the License for the specific language governing permissions and limitations under the License.
+ */
+import { memo, useContext, useMemo } from "react";
+import { MuiPropsContext } from "./MuiPropsContext.js";
+import { Tooltip } from "./Tooltip.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-
 const Button = _ref => {
   let {
     endIcon,
@@ -18,8 +29,9 @@ const Button = _ref => {
     tooltipText,
     variant
   } = _ref;
-
-  const button = _jsx(_Button, {
+  const muiProps = useContext(MuiPropsContext);
+  const button = useMemo(() => _jsx(_Button, {
+    ...muiProps,
     disabled: isDisabled,
     endIcon: endIcon,
     fullWidth: isFullWidth,
@@ -29,18 +41,16 @@ const Button = _ref => {
     startIcon: startIcon,
     variant: variant,
     children: text
-  });
-
+  }), [endIcon, id, isDisabled, isFullWidth, muiProps, onClick, size, startIcon, text, variant]);
   return _jsxs(_Fragment, {
     children: [tooltipText && _jsx(Tooltip, {
-      describeChild: true,
+      ariaType: "description",
       placement: "top",
-      title: tooltipText,
+      text: tooltipText,
       children: button
     }), !tooltipText && button]
   });
 };
-
 const MemoizedButton = memo(Button);
 export { MemoizedButton as Button };
 //# sourceMappingURL=Button.js.map

package/dist/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","names":["Tooltip","memo","Button","endIcon","id","isDisabled","isFullWidth","onClick","size","startIcon","text","tooltipText","variant","button","MemoizedButton"],"sources":["../src/Button.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 { Button as MuiButton } from \"@mui/material\";\nimport type { ButtonProps as MuiButtonProps } from \"@mui/material\";\nimport { Tooltip } from \"./\";\nimport { memo } from \"react\";\n\nexport type ButtonProps = {\n  endIcon?: React.ReactNode;\n  id?: string;\n  isDisabled?: boolean;\n  isFullWidth?: boolean;\n  onClick?: MuiButtonProps[\"onClick\"];\n  size?: MuiButtonProps[\"size\"];\n  startIcon?: React.ReactNode;\n  text?: string;\n  /**\n   * `tooltipText` determines the text of the tooltip that wraps the button if it's icon-only.\n   */\n  tooltipText?: string;\n  variant?: \"primary\" | \"secondary\" | \"danger\" | \"floating\";\n};\n\nconst Button = ({\n  endIcon,\n  id,\n  isDisabled,\n  isFullWidth,\n  onClick,\n  size = \"medium\",\n  startIcon,\n  text,\n  tooltipText,\n  variant,\n}: ButtonProps) => {\n  const button = (\n    <MuiButton\n      disabled={isDisabled}\n      endIcon={endIcon}\n      fullWidth={isFullWidth}\n      id={id}\n      onClick={onClick}\n      size={size}\n      startIcon={startIcon}\n      variant={variant}\n    >\n      {text}\n    </MuiButton>\n  );\n\n  return (\n    <>\n      {tooltipText && (\n        <Tooltip describeChild placement=\"top\" title={tooltipText}>\n          {button}\n        </Tooltip>\n      )}\n      {!tooltipText && button}\n    </>\n  );\n};\n\nconst MemoizedButton = memo(Button);\n\nexport { MemoizedButton as Button };\n"],"mappings":";SAcSA,O;AACT,SAASC,IAAT,QAAqB,OAArB;;;;;AAkBA,MAAMC,MAAM,GAAG,QAWI;EAAA,IAXH;IACdC,OADc;IAEdC,EAFc;IAGdC,UAHc;IAIdC,WAJc;IAKdC,OALc;IAMdC,IAAI,GAAG,QANO;IAOdC,SAPc;IAQdC,IARc;IASdC,WATc;IAUdC;EAVc,CAWG;;EACjB,MAAMC,MAAM,GACV;IACE,QAAQ,EAAER,UADZ;IAEE,OAAO,EAAEF,OAFX;IAGE,SAAS,EAAEG,WAHb;IAIE,EAAE,EAAEF,EAJN;IAKE,OAAO,EAAEG,OALX;IAME,IAAI,EAAEC,IANR;IAOE,SAAS,EAAEC,SAPb;IAQE,OAAO,EAAEG,OARX;IAAA,UAUGF;EAVH,EADF;;EAeA,OACE;IAAA,WACGC,WAAW,IACV,KAAC,OAAD;MAAS,aAAa,MAAtB;MAAuB,SAAS,EAAC,KAAjC;MAAuC,KAAK,EAAEA,WAA9C;MAAA,UACGE;IADH,EAFJ,EAMG,CAACF,WAAD,IAAgBE,MANnB;EAAA,EADF;AAUD,CArCD;;AAuCA,MAAMC,cAAc,GAAGb,IAAI,CAACC,MAAD,CAA3B;AAEA,SAASY,cAAc,IAAIZ,MAA3B"}
+{"version":3,"file":"Button.js","names":["memo","useContext","useMemo","MuiPropsContext","Tooltip","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","Button","_ref","endIcon","id","isDisabled","isFullWidth","onClick","size","startIcon","text","tooltipText","variant","muiProps","button","_Button","disabled","fullWidth","children","ariaType","placement","MemoizedButton"],"sources":["../src/Button.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 { Button as MuiButton } from \"@mui/material\";\nimport type { ButtonProps as MuiButtonProps } from \"@mui/material\";\nimport { memo, ReactElement, useContext, useMemo } from \"react\";\n\nimport { Icon } from \"./Icon\";\nimport { MuiPropsContext } from \"./MuiPropsContext\";\nimport { Tooltip } from \"./Tooltip\";\n\nexport type ButtonProps = {\n  endIcon?: ReactElement<typeof Icon>;\n  id?: string;\n  isDisabled?: boolean;\n  isFullWidth?: boolean;\n  onClick?: MuiButtonProps[\"onClick\"];\n  size?: MuiButtonProps[\"size\"];\n  startIcon?: ReactElement<typeof Icon>;\n  text?: string;\n  /**\n   * `tooltipText` determines the text of the tooltip that wraps the button if it's icon-only.\n   */\n  tooltipText?: string;\n  variant?: \"primary\" | \"secondary\" | \"danger\" | \"floating\";\n};\n\nconst Button = ({\n  endIcon,\n  id,\n  isDisabled,\n  isFullWidth,\n  onClick,\n  size = \"medium\",\n  startIcon,\n  text,\n  tooltipText,\n  variant,\n}: ButtonProps) => {\n  const muiProps = useContext(MuiPropsContext);\n\n  const button = useMemo(\n    () => (\n      <MuiButton\n        {...muiProps}\n        disabled={isDisabled}\n        endIcon={endIcon}\n        fullWidth={isFullWidth}\n        id={id}\n        onClick={onClick}\n        size={size}\n        startIcon={startIcon}\n        variant={variant}\n      >\n        {text}\n      </MuiButton>\n    ),\n    [\n      endIcon,\n      id,\n      isDisabled,\n      isFullWidth,\n      muiProps,\n      onClick,\n      size,\n      startIcon,\n      text,\n      variant,\n    ]\n  );\n\n  return (\n    <>\n      {tooltipText && (\n        <Tooltip ariaType=\"description\" placement=\"top\" text={tooltipText}>\n          {button}\n        </Tooltip>\n      )}\n      {!tooltipText && button}\n    </>\n  );\n};\n\nconst MemoizedButton = memo(Button);\n\nexport { MemoizedButton as Button };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA,SAASA,IAAI,EAAgBC,UAAU,EAAEC,OAAO,QAAQ,OAAO;AAAC,SAGvDC,eAAe;AAAA,SACfC,OAAO;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,QAAA,IAAAC,SAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAkBhB,MAAMC,MAAM,GAAGC,IAAA,IAWI;EAAA,IAXH;IACdC,OAAO;IACPC,EAAE;IACFC,UAAU;IACVC,WAAW;IACXC,OAAO;IACPC,IAAI,GAAG,QAAQ;IACfC,SAAS;IACTC,IAAI;IACJC,WAAW;IACXC;EACW,CAAC,GAAAV,IAAA;EACZ,MAAMW,QAAQ,GAAGtB,UAAU,CAACE,eAAe,CAAC;EAE5C,MAAMqB,MAAM,GAAGtB,OAAO,CACpB,MACEI,IAAA,CAAAmB,OAAA;IAAA,GACMF,QAAQ;IACZG,QAAQ,EAAEX,UAAW;IACrBF,OAAO,EAAEA,OAAQ;IACjBc,SAAS,EAAEX,WAAY;IACvBF,EAAE,EAAEA,EAAG;IACPG,OAAO,EAAEA,OAAQ;IACjBC,IAAI,EAAEA,IAAK;IACXC,SAAS,EAAEA,SAAU;IACrBG,OAAO,EAAEA,OAAQ;IAAAM,QAAA,EAEhBR;EAAI,CACI,CACZ,EACD,CACEP,OAAO,EACPC,EAAE,EACFC,UAAU,EACVC,WAAW,EACXO,QAAQ,EACRN,OAAO,EACPC,IAAI,EACJC,SAAS,EACTC,IAAI,EACJE,OAAO,CAEX,CAAC;EAED,OACEZ,KAAA,CAAAF,SAAA;IAAAoB,QAAA,GACGP,WAAW,IACVf,IAAA,CAACF,OAAO;MAACyB,QAAQ,EAAC,aAAa;MAACC,SAAS,EAAC,KAAK;MAACV,IAAI,EAAEC,WAAY;MAAAO,QAAA,EAC/DJ;IAAM,CACA,CACV,EACA,CAACH,WAAW,IAAIG,MAAM;EAAA,CACvB,CAAC;AAEP,CAAC;AAED,MAAMO,cAAc,GAAG/B,IAAI,CAACW,MAAM,CAAC;AAEnC,SAASoB,cAAc,IAAIpB,MAAM"}

package/dist/Checkbox.js

@@ -1,39 +1,73 @@
 import _Checkbox from "@mui/material/Checkbox";
-import { memo } from "react";
+import _Typography from "@mui/material/Typography";
+/*!
+ * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.
+ * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
+ *
+ * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *
+ * See the License for the specific language governing permissions and limitations under the License.
+ */
+import { memo, useMemo } from "react";
+import { useTranslation } from "react-i18next";
 import { FormControlLabel } from "./index.js";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsx as _jsx } from "react/jsx-runtime";
-
 const Checkbox = _ref => {
   let {
     ariaLabel,
     ariaLabelledBy,
+    isInvalid,
+    isValid,
     isChecked,
-    isDefaultChecked,
     isDisabled,
     isIndeterminate,
-    hasError,
-    label,
+    isRequired,
+    label: labelProp,
     name,
     onChange,
     value
   } = _ref;
+  const {
+    t
+  } = useTranslation();
+  const label = useMemo(() => {
+    if (isRequired) {
+      return _jsxs(_Fragment, {
+        children: [labelProp, " ", _jsxs(_Typography, {
+          component: "span",
+          color: "textSecondary",
+          children: ["(", t("fieldlabel.required.text"), ")"]
+        })]
+      });
+    } else {
+      return _jsx(_Fragment, {
+        children: labelProp
+      });
+    }
+  }, [isRequired, labelProp, t]);
   return _jsx(FormControlLabel, {
     "aria-label": ariaLabel,
     "aria-labelledby": ariaLabelledBy,
+    "aria-required": isRequired,
     checked: isChecked,
-    className: hasError ? "Mui-error" : "",
+    className: isInvalid ? "Mui-error" : isValid ? "Mui-valid" : "",
     control: _jsx(_Checkbox, {
-      indeterminate: isIndeterminate
+      indeterminate: isIndeterminate,
+      required: isRequired
     }),
-    defaultChecked: isDefaultChecked,
     disabled: isDisabled,
     label: label,
     name: name,
     onChange: onChange,
-    value: value
+    value: value,
+    required: isRequired
   });
 };
-
 const MemoizedCheckbox = memo(Checkbox);
 export { MemoizedCheckbox as Checkbox };
 //# sourceMappingURL=Checkbox.js.map

package/dist/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","names":["memo","FormControlLabel","Checkbox","ariaLabel","ariaLabelledBy","isChecked","isDefaultChecked","isDisabled","isIndeterminate","hasError","label","name","onChange","value","MemoizedCheckbox"],"sources":["../src/Checkbox.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 { Checkbox as MuiCheckbox } from \"@mui/material\";\nimport { ChangeEventHandler, memo } from \"react\";\n\nimport { FormControlLabel } from \".\";\n\nexport type CheckboxProps = {\n  ariaLabel?: string;\n  ariaLabelledBy?: string;\n  isChecked?: boolean;\n  isDefaultChecked?: boolean;\n  isDisabled?: boolean;\n  hasError?: boolean;\n  isIndeterminate?: boolean;\n  label?: string;\n  name?: string;\n  onChange?: ChangeEventHandler<EventTarget>;\n  value?: string;\n};\n\nconst Checkbox = ({\n  ariaLabel,\n  ariaLabelledBy,\n  isChecked,\n  isDefaultChecked,\n  isDisabled,\n  isIndeterminate,\n  hasError,\n  label,\n  name,\n  onChange,\n  value,\n}: CheckboxProps) => (\n  <FormControlLabel\n    aria-label={ariaLabel}\n    aria-labelledby={ariaLabelledBy}\n    checked={isChecked}\n    className={hasError ? \"Mui-error\" : \"\"}\n    control={<MuiCheckbox indeterminate={isIndeterminate} />}\n    defaultChecked={isDefaultChecked}\n    disabled={isDisabled}\n    label={label}\n    name={name}\n    onChange={onChange}\n    value={value}\n  />\n);\n\nconst MemoizedCheckbox = memo(Checkbox);\n\nexport { MemoizedCheckbox as Checkbox };\n"],"mappings":";AAaA,SAA6BA,IAA7B,QAAyC,OAAzC;SAESC,gB;;;AAgBT,MAAMC,QAAQ,GAAG;EAAA,IAAC;IAChBC,SADgB;IAEhBC,cAFgB;IAGhBC,SAHgB;IAIhBC,gBAJgB;IAKhBC,UALgB;IAMhBC,eANgB;IAOhBC,QAPgB;IAQhBC,KARgB;IAShBC,IATgB;IAUhBC,QAVgB;IAWhBC;EAXgB,CAAD;EAAA,OAaf,KAAC,gBAAD;IACE,cAAYV,SADd;IAEE,mBAAiBC,cAFnB;IAGE,OAAO,EAAEC,SAHX;IAIE,SAAS,EAAEI,QAAQ,GAAG,WAAH,GAAiB,EAJtC;IAKE,OAAO,EAAE;MAAa,aAAa,EAAED;IAA5B,EALX;IAME,cAAc,EAAEF,gBANlB;IAOE,QAAQ,EAAEC,UAPZ;IAQE,KAAK,EAAEG,KART;IASE,IAAI,EAAEC,IATR;IAUE,QAAQ,EAAEC,QAVZ;IAWE,KAAK,EAAEC;EAXT,EAbe;AAAA,CAAjB;;AA4BA,MAAMC,gBAAgB,GAAGd,IAAI,CAACE,QAAD,CAA7B;AAEA,SAASY,gBAAgB,IAAIZ,QAA7B"}
+{"version":3,"file":"Checkbox.js","names":["memo","useMemo","useTranslation","FormControlLabel","jsxs","_jsxs","Fragment","_Fragment","jsx","_jsx","Checkbox","_ref","ariaLabel","ariaLabelledBy","isInvalid","isValid","isChecked","isDisabled","isIndeterminate","isRequired","label","labelProp","name","onChange","value","t","children","_Typography","component","color","checked","className","control","_Checkbox","indeterminate","required","disabled","MemoizedCheckbox"],"sources":["../src/Checkbox.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 { Checkbox as MuiCheckbox, Typography } from \"@mui/material\";\nimport { ChangeEventHandler, memo, useMemo } from \"react\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { FormControlLabel } from \".\";\n\nexport type CheckboxProps = {\n  ariaLabel?: string;\n  ariaLabelledBy?: string;\n  isInvalid?: boolean;\n  isValid?: boolean;\n  isChecked?: boolean;\n  isDefaultChecked?: boolean;\n  isDisabled?: boolean;\n  isIndeterminate?: boolean;\n  isRequired?: boolean;\n  label?: string;\n  name?: string;\n  onChange?: ChangeEventHandler<EventTarget>;\n  value?: string;\n};\n\nconst Checkbox = ({\n  ariaLabel,\n  ariaLabelledBy,\n  isInvalid,\n  isValid,\n  isChecked,\n  isDisabled,\n  isIndeterminate,\n  isRequired,\n  label: labelProp,\n  name,\n  onChange,\n  value,\n}: CheckboxProps) => {\n  const { t } = useTranslation();\n\n  const label = useMemo(() => {\n    if (isRequired) {\n      return (\n        <>\n          {labelProp}{\" \"}\n          <Typography component=\"span\" color=\"textSecondary\">\n            ({t(\"fieldlabel.required.text\")})\n          </Typography>\n        </>\n      );\n    } else {\n      return <>{labelProp}</>;\n    }\n  }, [isRequired, labelProp, t]);\n\n  return (\n    <FormControlLabel\n      aria-label={ariaLabel}\n      aria-labelledby={ariaLabelledBy}\n      aria-required={isRequired}\n      checked={isChecked}\n      className={isInvalid ? \"Mui-error\" : isValid ? \"Mui-valid\" : \"\"}\n      control={\n        <MuiCheckbox indeterminate={isIndeterminate} required={isRequired} />\n      }\n      disabled={isDisabled}\n      label={label}\n      name={name}\n      onChange={onChange}\n      value={value}\n      required={isRequired}\n    />\n  );\n};\n\nconst MemoizedCheckbox = memo(Checkbox);\n\nexport { MemoizedCheckbox as Checkbox };\n"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,SAA6BA,IAAI,EAAEC,OAAO,QAAQ,OAAO;AACzD,SAASC,cAAc,QAAQ,eAAe;AAAC,SAEtCC,gBAAgB;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAAA,SAAAC,QAAA,IAAAC,SAAA;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAkBzB,MAAMC,QAAQ,GAAGC,IAAA,IAaI;EAAA,IAbH;IAChBC,SAAS;IACTC,cAAc;IACdC,SAAS;IACTC,OAAO;IACPC,SAAS;IACTC,UAAU;IACVC,eAAe;IACfC,UAAU;IACVC,KAAK,EAAEC,SAAS;IAChBC,IAAI;IACJC,QAAQ;IACRC;EACa,CAAC,GAAAb,IAAA;EACd,MAAM;IAAEc;EAAE,CAAC,GAAGvB,cAAc,CAAC,CAAC;EAE9B,MAAMkB,KAAK,GAAGnB,OAAO,CAAC,MAAM;IAC1B,IAAIkB,UAAU,EAAE;MACd,OACEd,KAAA,CAAAE,SAAA;QAAAmB,QAAA,GACGL,SAAS,EAAE,GAAG,EACfhB,KAAA,CAAAsB,WAAA;UAAYC,SAAS,EAAC,MAAM;UAACC,KAAK,EAAC,eAAe;UAAAH,QAAA,GAAC,GAChD,EAACD,CAAC,CAAC,0BAA0B,CAAC,EAAC,GAClC;QAAA,CAAY,CAAC;MAAA,CACb,CAAC;IAEP,CAAC,MAAM;MACL,OAAOhB,IAAA,CAAAF,SAAA;QAAAmB,QAAA,EAAGL;MAAS,CAAG,CAAC;IACzB;EACF,CAAC,EAAE,CAACF,UAAU,EAAEE,SAAS,EAAEI,CAAC,CAAC,CAAC;EAE9B,OACEhB,IAAA,CAACN,gBAAgB;IACf,cAAYS,SAAU;IACtB,mBAAiBC,cAAe;IAChC,iBAAeM,UAAW;IAC1BW,OAAO,EAAEd,SAAU;IACnBe,SAAS,EAAEjB,SAAS,GAAG,WAAW,GAAGC,OAAO,GAAG,WAAW,GAAG,EAAG;IAChEiB,OAAO,EACLvB,IAAA,CAAAwB,SAAA;MAAaC,aAAa,EAAEhB,eAAgB;MAACiB,QAAQ,EAAEhB;IAAW,CAAE,CACrE;IACDiB,QAAQ,EAAEnB,UAAW;IACrBG,KAAK,EAAEA,KAAM;IACbE,IAAI,EAAEA,IAAK;IACXC,QAAQ,EAAEA,QAAS;IACnBC,KAAK,EAAEA,KAAM;IACbW,QAAQ,EAAEhB;EAAW,CACtB,CAAC;AAEN,CAAC;AAED,MAAMkB,gBAAgB,GAAGrC,IAAI,CAACU,QAAQ,CAAC;AAEvC,SAAS2B,gBAAgB,IAAI3B,QAAQ"}

package/dist/CheckboxGroup.js

@@ -1,3 +1,4 @@
+import _FormGroup from "@mui/material/FormGroup";
 /*!
  * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.
  * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
@@ -9,44 +10,42 @@
  *
  * See the License for the specific language governing permissions and limitations under the License.
  */
-import { memo, useMemo } from "react";
-import { FormControl, FormGroup, FormHelperText, FormLabel, ScreenReaderText } from "./index.js";
+import { memo, useCallback } from "react";
+import { Field } from "./Field.js";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-
 const CheckboxGroup = _ref => {
   let {
     children,
     isDisabled,
     errorMessage,
     hint,
-    label,
-    name
+    id: idOverride,
+    isRequired = false,
+    label
   } = _ref;
-  const ariaDescribedBy = useMemo(() => errorMessage || hint ? [hint && `${name}-hint`, errorMessage && `${name}-error`].filter(Boolean).join(" ") : undefined, [errorMessage, hint, name]);
-  return _jsxs(FormControl, {
-    component: "fieldset",
-    disabled: isDisabled,
-    error: Boolean(errorMessage),
-    children: [label && _jsx(FormLabel, {
-      component: "legend",
-      children: label
-    }), hint && _jsx(FormHelperText, {
-      id: `${name}-hint`,
-      children: hint
-    }), _jsx(FormGroup, {
+  const renderFieldComponent = useCallback(_ref2 => {
+    let {
+      ariaDescribedBy,
+      id
+    } = _ref2;
+    return _jsx(_FormGroup, {
       "aria-describedby": ariaDescribedBy,
+      id: id,
       children: children
-    }), errorMessage && _jsxs(FormHelperText, {
-      id: `${name}-error`,
-      error: true,
-      children: [_jsx(ScreenReaderText, {
-        children: "Error:"
-      }), " ", errorMessage]
-    })]
+    });
+  }, [children]);
+  return _jsx(Field, {
+    errorMessage: errorMessage,
+    fieldType: "group",
+    hasVisibleLabel: true,
+    hint: hint,
+    id: idOverride,
+    isDisabled: isDisabled,
+    isOptional: !isRequired,
+    label: label,
+    renderFieldComponent: renderFieldComponent
   });
 };
-
 const MemoizedCheckboxGroup = memo(CheckboxGroup);
 export { MemoizedCheckboxGroup as CheckboxGroup };
 //# sourceMappingURL=CheckboxGroup.js.map

package/dist/CheckboxGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxGroup.js","names":["memo","useMemo","FormControl","FormGroup","FormHelperText","FormLabel","ScreenReaderText","CheckboxGroup","children","isDisabled","errorMessage","hint","label","name","ariaDescribedBy","filter","Boolean","join","undefined","MemoizedCheckboxGroup"],"sources":["../src/CheckboxGroup.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 { memo, ReactElement, useMemo } from \"react\";\n\nimport {\n  Checkbox,\n  FormControl,\n  FormGroup,\n  FormHelperText,\n  FormLabel,\n  ScreenReaderText,\n} from \".\";\n\nexport type CheckboxGroupProps = {\n  children:\n    | ReactElement<typeof Checkbox>\n    | Array<ReactElement<typeof Checkbox>>;\n  errorMessage?: string;\n  hint?: string;\n  isDisabled?: boolean;\n  label?: string;\n  name?: string;\n};\n\nconst CheckboxGroup = ({\n  children,\n  isDisabled,\n  errorMessage,\n  hint,\n  label,\n  name,\n}: CheckboxGroupProps) => {\n  const ariaDescribedBy = useMemo(\n    () =>\n      errorMessage || hint\n        ? [hint && `${name}-hint`, errorMessage && `${name}-error`]\n            .filter(Boolean)\n            .join(\" \")\n        : undefined,\n    [errorMessage, hint, name]\n  );\n\n  return (\n    <FormControl\n      component=\"fieldset\"\n      disabled={isDisabled}\n      error={Boolean(errorMessage)}\n    >\n      {label && <FormLabel component=\"legend\">{label}</FormLabel>}\n      {hint && <FormHelperText id={`${name}-hint`}>{hint}</FormHelperText>}\n      <FormGroup aria-describedby={ariaDescribedBy}>{children}</FormGroup>\n      {errorMessage && (\n        <FormHelperText id={`${name}-error`} error>\n          <ScreenReaderText>Error:</ScreenReaderText> {errorMessage}\n        </FormHelperText>\n      )}\n    </FormControl>\n  );\n};\n\nconst MemoizedCheckboxGroup = memo(CheckboxGroup);\n\nexport { MemoizedCheckboxGroup as CheckboxGroup };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA,SAASA,IAAT,EAA6BC,OAA7B,QAA4C,OAA5C;SAIEC,W,EACAC,S,EACAC,c,EACAC,S,EACAC,gB;;;;AAcF,MAAMC,aAAa,GAAG,QAOI;EAAA,IAPH;IACrBC,QADqB;IAErBC,UAFqB;IAGrBC,YAHqB;IAIrBC,IAJqB;IAKrBC,KALqB;IAMrBC;EANqB,CAOG;EACxB,MAAMC,eAAe,GAAGb,OAAO,CAC7B,MACES,YAAY,IAAIC,IAAhB,GACI,CAACA,IAAI,IAAK,GAAEE,IAAK,OAAjB,EAAyBH,YAAY,IAAK,GAAEG,IAAK,QAAjD,EACGE,MADH,CACUC,OADV,EAEGC,IAFH,CAEQ,GAFR,CADJ,GAIIC,SANuB,EAO7B,CAACR,YAAD,EAAeC,IAAf,EAAqBE,IAArB,CAP6B,CAA/B;EAUA,OACE,MAAC,WAAD;IACE,SAAS,EAAC,UADZ;IAEE,QAAQ,EAAEJ,UAFZ;IAGE,KAAK,EAAEO,OAAO,CAACN,YAAD,CAHhB;IAAA,WAKGE,KAAK,IAAI,KAAC,SAAD;MAAW,SAAS,EAAC,QAArB;MAAA,UAA+BA;IAA/B,EALZ,EAMGD,IAAI,IAAI,KAAC,cAAD;MAAgB,EAAE,EAAG,GAAEE,IAAK,OAA5B;MAAA,UAAqCF;IAArC,EANX,EAOE,KAAC,SAAD;MAAW,oBAAkBG,eAA7B;MAAA,UAA+CN;IAA/C,EAPF,EAQGE,YAAY,IACX,MAAC,cAAD;MAAgB,EAAE,EAAG,GAAEG,IAAK,QAA5B;MAAqC,KAAK,MAA1C;MAAA,WACE,KAAC,gBAAD;QAAA;MAAA,EADF,OAC+CH,YAD/C;IAAA,EATJ;EAAA,EADF;AAgBD,CAlCD;;AAoCA,MAAMS,qBAAqB,GAAGnB,IAAI,CAACO,aAAD,CAAlC;AAEA,SAASY,qBAAqB,IAAIZ,aAAlC"}
+{"version":3,"file":"CheckboxGroup.js","names":["memo","useCallback","Field","jsx","_jsx","CheckboxGroup","_ref","children","isDisabled","errorMessage","hint","id","idOverride","isRequired","label","renderFieldComponent","_ref2","ariaDescribedBy","_FormGroup","fieldType","hasVisibleLabel","isOptional","MemoizedCheckboxGroup"],"sources":["../src/CheckboxGroup.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 { FormGroup as MuiFormGroup } from \"@mui/material\";\nimport { memo, ReactElement, useCallback } from \"react\";\n\nimport { Checkbox } from \"./Checkbox\";\nimport { Field } from \"./Field\";\n\nexport type CheckboxGroupProps = {\n  children:\n    | ReactElement<typeof Checkbox>\n    | Array<ReactElement<typeof Checkbox>>;\n  errorMessage?: string;\n  hint?: string;\n  /**\n   * The id of the `input` element. This will also be the input's `name` field.\n   */\n  id?: string;\n  isDisabled?: boolean;\n  isRequired?: boolean;\n  label: string;\n};\n\nconst CheckboxGroup = ({\n  children,\n  isDisabled,\n  errorMessage,\n  hint,\n  id: idOverride,\n  isRequired = false,\n  label,\n}: CheckboxGroupProps) => {\n  const renderFieldComponent = useCallback(\n    ({ ariaDescribedBy, id }) => (\n      <MuiFormGroup aria-describedby={ariaDescribedBy} id={id}>\n        {children}\n      </MuiFormGroup>\n    ),\n    [children]\n  );\n\n  return (\n    <Field\n      errorMessage={errorMessage}\n      fieldType=\"group\"\n      hasVisibleLabel={true}\n      hint={hint}\n      id={idOverride}\n      isDisabled={isDisabled}\n      isOptional={!isRequired}\n      label={label}\n      renderFieldComponent={renderFieldComponent}\n    />\n  );\n};\n\nconst MemoizedCheckboxGroup = memo(CheckboxGroup);\n\nexport { MemoizedCheckboxGroup as CheckboxGroup };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,SAASA,IAAI,EAAgBC,WAAW,QAAQ,OAAO;AAAC,SAG/CC,KAAK;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAiBd,MAAMC,aAAa,GAAGC,IAAA,IAQI;EAAA,IARH;IACrBC,QAAQ;IACRC,UAAU;IACVC,YAAY;IACZC,IAAI;IACJC,EAAE,EAAEC,UAAU;IACdC,UAAU,GAAG,KAAK;IAClBC;EACkB,CAAC,GAAAR,IAAA;EACnB,MAAMS,oBAAoB,GAAGd,WAAW,CACtCe,KAAA;IAAA,IAAC;MAAEC,eAAe;MAAEN;IAAG,CAAC,GAAAK,KAAA;IAAA,OACtBZ,IAAA,CAAAc,UAAA;MAAc,oBAAkBD,eAAgB;MAACN,EAAE,EAAEA,EAAG;MAAAJ,QAAA,EACrDA;IAAQ,CACG,CAAC;EAAA,CAChB,EACD,CAACA,QAAQ,CACX,CAAC;EAED,OACEH,IAAA,CAACF,KAAK;IACJO,YAAY,EAAEA,YAAa;IAC3BU,SAAS,EAAC,OAAO;IACjBC,eAAe,EAAE,IAAK;IACtBV,IAAI,EAAEA,IAAK;IACXC,EAAE,EAAEC,UAAW;IACfJ,UAAU,EAAEA,UAAW;IACvBa,UAAU,EAAE,CAACR,UAAW;IACxBC,KAAK,EAAEA,KAAM;IACbC,oBAAoB,EAAEA;EAAqB,CAC5C,CAAC;AAEN,CAAC;AAED,MAAMO,qBAAqB,GAAGtB,IAAI,CAACK,aAAa,CAAC;AAEjD,SAASiB,qBAAqB,IAAIjB,aAAa"}

package/dist/CircularProgress.js

@@ -1,4 +1,15 @@
 import _CircularProgress from "@mui/material/CircularProgress";
+/*!
+ * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.
+ * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
+ *
+ * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *
+ * See the License for the specific language governing permissions and limitations under the License.
+ */
 import { jsx as _jsx } from "react/jsx-runtime";
 export const CircularProgress = _ref => {
   let {