@okta/odyssey-react-mui 1.5.0 → 1.6.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +19 -0
- package/dist/OdysseyCacheProvider.js +7 -1
- package/dist/OdysseyCacheProvider.js.map +1 -1
- package/dist/OdysseyProvider.js +3 -4
- package/dist/OdysseyProvider.js.map +1 -1
- package/dist/OdysseyThemeProvider.js +3 -3
- package/dist/OdysseyThemeProvider.js.map +1 -1
- package/dist/PasswordField.js +1 -1
- package/dist/PasswordField.js.map +1 -1
- package/dist/Select.js +23 -25
- package/dist/Select.js.map +1 -1
- package/dist/Tooltip.js +5 -1
- package/dist/Tooltip.js.map +1 -1
- package/dist/{createShadowDom.js → createShadowRootElement.js} +6 -11
- package/dist/createShadowRootElement.js.map +1 -0
- package/dist/index.js +1 -0
- package/dist/index.js.map +1 -1
- package/dist/src/OdysseyCacheProvider.d.ts +2 -2
- package/dist/src/OdysseyCacheProvider.d.ts.map +1 -1
- package/dist/src/OdysseyProvider.d.ts +1 -1
- package/dist/src/OdysseyProvider.d.ts.map +1 -1
- package/dist/src/OdysseyThemeProvider.d.ts +2 -2
- package/dist/src/OdysseyThemeProvider.d.ts.map +1 -1
- package/dist/src/Select.d.ts +14 -8
- package/dist/src/Select.d.ts.map +1 -1
- package/dist/src/Tooltip.d.ts +2 -1
- package/dist/src/Tooltip.d.ts.map +1 -1
- package/dist/src/{createShadowDom.d.ts → createShadowRootElement.d.ts} +2 -5
- package/dist/src/createShadowRootElement.d.ts.map +1 -0
- package/dist/src/index.d.ts +1 -0
- package/dist/src/index.d.ts.map +1 -1
- package/dist/src/theme/components.d.ts +2 -2
- package/dist/src/theme/components.d.ts.map +1 -1
- package/dist/src/theme/createOdysseyMuiTheme.d.ts +2 -2
- package/dist/theme/components.js +18 -15
- package/dist/theme/components.js.map +1 -1
- package/dist/theme/createOdysseyMuiTheme.js +2 -2
- package/dist/theme/createOdysseyMuiTheme.js.map +1 -1
- package/dist/tsconfig.production.tsbuildinfo +1 -1
- package/package.json +3 -3
- package/src/OdysseyCacheProvider.tsx +12 -2
- package/src/OdysseyProvider.tsx +3 -4
- package/src/OdysseyThemeProvider.tsx +4 -4
- package/src/PasswordField.tsx +1 -1
- package/src/Select.tsx +64 -45
- package/src/Tooltip.tsx +7 -2
- package/src/createShadowRootElement.ts +21 -0
- package/src/index.ts +1 -0
- package/src/theme/components.tsx +19 -16
- package/src/theme/createOdysseyMuiTheme.ts +3 -3
- package/dist/createShadowDom.js.map +0 -1
- package/dist/src/createShadowDom.d.ts.map +0 -1
- package/src/createShadowDom.ts +0 -46
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,25 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [1.6.1](https://github.com/okta/odyssey/compare/v1.6.0...v1.6.1) (2023-11-08)
|
|
7
|
+
|
|
8
|
+
### Bug Fixes
|
|
9
|
+
|
|
10
|
+
- issue with Odyssey rendering <style> tags in a <style> tag in Shadow DOM ([#2037](https://github.com/okta/odyssey/issues/2037)) ([9279c0b](https://github.com/okta/odyssey/commit/9279c0bf7a6139b1497e09a7ea58a08c3411727c))
|
|
11
|
+
- **odyssey-react-mui:** add padding to Tabs label ([78a5e80](https://github.com/okta/odyssey/commit/78a5e806bbfb97aac6babb61ecb2d94918c406e0))
|
|
12
|
+
- **odyssey-react-mui:** remove color logic from Tabs label ([b05c0cc](https://github.com/okta/odyssey/commit/b05c0ccaefc62bd0545d2ebaa676cb7df76b700f))
|
|
13
|
+
- **odyssey-react-mui:** update default Tabs label color ([f79272e](https://github.com/okta/odyssey/commit/f79272ea5e7abc8ec878a6b8d8a7789339a932ea))
|
|
14
|
+
|
|
15
|
+
## [1.6.0](https://github.com/okta/odyssey/compare/v1.5.0...v1.6.0) (2023-11-02)
|
|
16
|
+
|
|
17
|
+
### Features
|
|
18
|
+
|
|
19
|
+
- **odyssey-react-mui:** wrapped typography component with context ([#2013](https://github.com/okta/odyssey/issues/2013)) ([4ae50de](https://github.com/okta/odyssey/commit/4ae50debc051299774847804509aa1dae0dad831))
|
|
20
|
+
|
|
21
|
+
### Bug Fixes
|
|
22
|
+
|
|
23
|
+
- revert [#2013](https://github.com/okta/odyssey/issues/2013) ([#2029](https://github.com/okta/odyssey/issues/2029)) ([9f75603](https://github.com/okta/odyssey/commit/9f7560336221ea00014b21627488932ade2d6e16))
|
|
24
|
+
|
|
6
25
|
## [1.5.0](https://github.com/okta/odyssey/compare/v1.4.0...v1.5.0) (2023-10-27)
|
|
7
26
|
|
|
8
27
|
### Features
|
|
@@ -18,11 +18,17 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
18
18
|
const OdysseyCacheProvider = _ref => {
|
|
19
19
|
let {
|
|
20
20
|
children,
|
|
21
|
-
emotionRootElement,
|
|
22
21
|
nonce,
|
|
22
|
+
shadowDomElement,
|
|
23
23
|
stylisPlugins
|
|
24
24
|
} = _ref;
|
|
25
25
|
const uniqueAlphabeticalId = useUniqueAlphabeticalId();
|
|
26
|
+
const emotionRootElement = useMemo(() => {
|
|
27
|
+
const emotionRootElement = document.createElement("div");
|
|
28
|
+
emotionRootElement.setAttribute("data-emotion-root", "data-emotion-root");
|
|
29
|
+
shadowDomElement?.prepend?.(emotionRootElement);
|
|
30
|
+
return emotionRootElement;
|
|
31
|
+
}, [shadowDomElement]);
|
|
26
32
|
const emotionCache = useMemo(() => createCache({
|
|
27
33
|
container: emotionRootElement,
|
|
28
34
|
key: uniqueAlphabeticalId,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OdysseyCacheProvider.js","names":["createCache","CacheProvider","memo","useMemo","useUniqueAlphabeticalId","jsx","_jsx","OdysseyCacheProvider","_ref","children","
|
|
1
|
+
{"version":3,"file":"OdysseyCacheProvider.js","names":["createCache","CacheProvider","memo","useMemo","useUniqueAlphabeticalId","jsx","_jsx","OdysseyCacheProvider","_ref","children","nonce","shadowDomElement","stylisPlugins","uniqueAlphabeticalId","emotionRootElement","document","createElement","setAttribute","prepend","emotionCache","container","key","window","cspNonce","Boolean","value","MemoizedOdysseyCacheProvider","displayName"],"sources":["../src/OdysseyCacheProvider.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\ndeclare global {\n interface Window {\n cspNonce: string;\n }\n}\n\nimport createCache, { StylisPlugin } from \"@emotion/cache\";\nimport { CacheProvider } from \"@emotion/react\";\nimport { memo, ReactNode, useMemo } from \"react\";\n\nimport { useUniqueAlphabeticalId } from \"./useUniqueAlphabeticalId\";\n\nexport type OdysseyCacheProviderProps = {\n children: ReactNode;\n /**\n * Emotion renders into this HTML element.\n * When enabling this prop, Emotion renders at the top of this component rather than the bottom like it does in the HTML `<head>`.\n */\n nonce?: string;\n shadowDomElement?: HTMLDivElement;\n stylisPlugins?: StylisPlugin[];\n};\n\nconst OdysseyCacheProvider = ({\n children,\n nonce,\n shadowDomElement,\n stylisPlugins,\n}: OdysseyCacheProviderProps) => {\n const uniqueAlphabeticalId = useUniqueAlphabeticalId();\n\n const emotionRootElement = useMemo(() => {\n const emotionRootElement = document.createElement(\"div\");\n\n emotionRootElement.setAttribute(\"data-emotion-root\", \"data-emotion-root\");\n\n shadowDomElement?.prepend?.(emotionRootElement);\n\n return emotionRootElement;\n }, [shadowDomElement]);\n\n const emotionCache = useMemo(\n () =>\n createCache({\n container: emotionRootElement,\n key: uniqueAlphabeticalId,\n nonce: nonce || window.cspNonce,\n prepend: Boolean(emotionRootElement),\n stylisPlugins,\n }),\n [emotionRootElement, nonce, stylisPlugins, uniqueAlphabeticalId]\n );\n\n return <CacheProvider value={emotionCache}>{children}</CacheProvider>;\n};\n\nconst MemoizedOdysseyCacheProvider = memo(OdysseyCacheProvider);\nMemoizedOdysseyCacheProvider.displayName = \"OdysseyCacheProvider\";\n\nexport { MemoizedOdysseyCacheProvider as OdysseyCacheProvider };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAQA,OAAOA,WAAW,MAAwB,gBAAgB;AAC1D,SAASC,aAAa,QAAQ,gBAAgB;AAC9C,SAASC,IAAI,EAAaC,OAAO,QAAQ,OAAO;AAAC,SAExCC,uBAAuB;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAahC,MAAMC,oBAAoB,GAAGC,IAAA,IAKI;EAAA,IALH;IAC5BC,QAAQ;IACRC,KAAK;IACLC,gBAAgB;IAChBC;EACyB,CAAC,GAAAJ,IAAA;EAC1B,MAAMK,oBAAoB,GAAGT,uBAAuB,CAAC,CAAC;EAEtD,MAAMU,kBAAkB,GAAGX,OAAO,CAAC,MAAM;IACvC,MAAMW,kBAAkB,GAAGC,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;IAExDF,kBAAkB,CAACG,YAAY,CAAC,mBAAmB,EAAE,mBAAmB,CAAC;IAEzEN,gBAAgB,EAAEO,OAAO,GAAGJ,kBAAkB,CAAC;IAE/C,OAAOA,kBAAkB;EAC3B,CAAC,EAAE,CAACH,gBAAgB,CAAC,CAAC;EAEtB,MAAMQ,YAAY,GAAGhB,OAAO,CAC1B,MACEH,WAAW,CAAC;IACVoB,SAAS,EAAEN,kBAAkB;IAC7BO,GAAG,EAAER,oBAAoB;IACzBH,KAAK,EAAEA,KAAK,IAAIY,MAAM,CAACC,QAAQ;IAC/BL,OAAO,EAAEM,OAAO,CAACV,kBAAkB,CAAC;IACpCF;EACF,CAAC,CAAC,EACJ,CAACE,kBAAkB,EAAEJ,KAAK,EAAEE,aAAa,EAAEC,oBAAoB,CACjE,CAAC;EAED,OAAOP,IAAA,CAACL,aAAa;IAACwB,KAAK,EAAEN,YAAa;IAAAV,QAAA,EAAEA;EAAQ,CAAgB,CAAC;AACvE,CAAC;AAED,MAAMiB,4BAA4B,GAAGxB,IAAI,CAACK,oBAAoB,CAAC;AAC/DmB,4BAA4B,CAACC,WAAW,GAAG,sBAAsB;AAEjE,SAASD,4BAA4B,IAAInB,oBAAoB"}
|
package/dist/OdysseyProvider.js
CHANGED
|
@@ -20,8 +20,7 @@ const OdysseyProvider = _ref => {
|
|
|
20
20
|
let {
|
|
21
21
|
children,
|
|
22
22
|
designTokensOverride,
|
|
23
|
-
|
|
24
|
-
shadowRootElement,
|
|
23
|
+
shadowDomElement,
|
|
25
24
|
languageCode,
|
|
26
25
|
nonce,
|
|
27
26
|
stylisPlugins,
|
|
@@ -29,12 +28,12 @@ const OdysseyProvider = _ref => {
|
|
|
29
28
|
translationOverrides
|
|
30
29
|
} = _ref;
|
|
31
30
|
return _jsx(OdysseyCacheProvider, {
|
|
32
|
-
emotionRootElement: emotionRootElement,
|
|
33
31
|
nonce: nonce,
|
|
32
|
+
shadowDomElement: shadowDomElement,
|
|
34
33
|
stylisPlugins: stylisPlugins,
|
|
35
34
|
children: _jsx(OdysseyThemeProvider, {
|
|
36
35
|
designTokensOverride: designTokensOverride,
|
|
37
|
-
|
|
36
|
+
shadowDomElement: shadowDomElement,
|
|
38
37
|
themeOverride: themeOverride,
|
|
39
38
|
children: _jsx(_ScopedCssBaseline, {
|
|
40
39
|
children: _jsx(OdysseyTranslationProvider, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OdysseyProvider.js","names":["memo","OdysseyCacheProvider","OdysseyThemeProvider","OdysseyTranslationProvider","jsx","_jsx","OdysseyProvider","_ref","children","designTokensOverride","
|
|
1
|
+
{"version":3,"file":"OdysseyProvider.js","names":["memo","OdysseyCacheProvider","OdysseyThemeProvider","OdysseyTranslationProvider","jsx","_jsx","OdysseyProvider","_ref","children","designTokensOverride","shadowDomElement","languageCode","nonce","stylisPlugins","themeOverride","translationOverrides","_ScopedCssBaseline","MemoizedThemeProvider"],"sources":["../src/OdysseyProvider.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, ReactNode } from \"react\";\nimport { ScopedCssBaseline } from \"@mui/material\";\n\nimport {\n OdysseyCacheProvider,\n OdysseyCacheProviderProps,\n} from \"./OdysseyCacheProvider\";\nimport {\n OdysseyThemeProvider,\n OdysseyThemeProviderProps,\n} from \"./OdysseyThemeProvider\";\nimport {\n OdysseyTranslationProvider,\n OdysseyTranslationProviderProps,\n} from \"./OdysseyTranslationProvider\";\n\nexport type OdysseyProviderProps = OdysseyCacheProviderProps &\n OdysseyThemeProviderProps &\n OdysseyTranslationProviderProps & {\n children: ReactNode;\n };\n\nconst OdysseyProvider = ({\n children,\n designTokensOverride,\n shadowDomElement,\n languageCode,\n nonce,\n stylisPlugins,\n themeOverride,\n translationOverrides,\n}: OdysseyProviderProps) => (\n <OdysseyCacheProvider\n nonce={nonce}\n shadowDomElement={shadowDomElement}\n stylisPlugins={stylisPlugins}\n >\n <OdysseyThemeProvider\n designTokensOverride={designTokensOverride}\n shadowDomElement={shadowDomElement}\n themeOverride={themeOverride}\n >\n <ScopedCssBaseline>\n <OdysseyTranslationProvider\n languageCode={languageCode}\n translationOverrides={translationOverrides}\n >\n {children}\n </OdysseyTranslationProvider>\n </ScopedCssBaseline>\n </OdysseyThemeProvider>\n </OdysseyCacheProvider>\n);\n\nconst MemoizedThemeProvider = memo(OdysseyProvider);\n\nexport { MemoizedThemeProvider as OdysseyProvider };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,IAAI,QAAmB,OAAO;AAAC,SAItCC,oBAAoB;AAAA,SAIpBC,oBAAoB;AAAA,SAIpBC,0BAA0B;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAU5B,MAAMC,eAAe,GAAGC,IAAA;EAAA,IAAC;IACvBC,QAAQ;IACRC,oBAAoB;IACpBC,gBAAgB;IAChBC,YAAY;IACZC,KAAK;IACLC,aAAa;IACbC,aAAa;IACbC;EACoB,CAAC,GAAAR,IAAA;EAAA,OACrBF,IAAA,CAACJ,oBAAoB;IACnBW,KAAK,EAAEA,KAAM;IACbF,gBAAgB,EAAEA,gBAAiB;IACnCG,aAAa,EAAEA,aAAc;IAAAL,QAAA,EAE7BH,IAAA,CAACH,oBAAoB;MACnBO,oBAAoB,EAAEA,oBAAqB;MAC3CC,gBAAgB,EAAEA,gBAAiB;MACnCI,aAAa,EAAEA,aAAc;MAAAN,QAAA,EAE7BH,IAAA,CAAAW,kBAAA;QAAAR,QAAA,EACEH,IAAA,CAACF,0BAA0B;UACzBQ,YAAY,EAAEA,YAAa;UAC3BI,oBAAoB,EAAEA,oBAAqB;UAAAP,QAAA,EAE1CA;QAAQ,CACiB;MAAC,CACZ;IAAC,CACA;EAAC,CACH,CAAC;AAAA,CACxB;AAED,MAAMS,qBAAqB,GAAGjB,IAAI,CAACM,eAAe,CAAC;AAEnD,SAASW,qBAAqB,IAAIX,eAAe"}
|
|
@@ -21,7 +21,7 @@ const OdysseyThemeProvider = _ref => {
|
|
|
21
21
|
let {
|
|
22
22
|
children,
|
|
23
23
|
designTokensOverride,
|
|
24
|
-
|
|
24
|
+
shadowDomElement,
|
|
25
25
|
themeOverride
|
|
26
26
|
} = _ref;
|
|
27
27
|
const odysseyTokens = useMemo(() => ({
|
|
@@ -30,8 +30,8 @@ const OdysseyThemeProvider = _ref => {
|
|
|
30
30
|
}), [designTokensOverride]);
|
|
31
31
|
const odysseyTheme = useMemo(() => createOdysseyMuiTheme({
|
|
32
32
|
odysseyTokens,
|
|
33
|
-
|
|
34
|
-
}), [odysseyTokens,
|
|
33
|
+
shadowDomElement
|
|
34
|
+
}), [odysseyTokens, shadowDomElement]);
|
|
35
35
|
const customOdysseyTheme = useMemo(() => themeOverride && createTheme(deepmerge(odysseyTheme, themeOverride)), [odysseyTheme, themeOverride]);
|
|
36
36
|
return _jsx(MuiThemeProvider, {
|
|
37
37
|
theme: customOdysseyTheme ?? odysseyTheme,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OdysseyThemeProvider.js","names":["createTheme","ThemeProvider","MuiThemeProvider","memo","useMemo","deepmerge","createOdysseyMuiTheme","Tokens","OdysseyDesignTokensContext","jsx","_jsx","OdysseyThemeProvider","_ref","children","designTokensOverride","
|
|
1
|
+
{"version":3,"file":"OdysseyThemeProvider.js","names":["createTheme","ThemeProvider","MuiThemeProvider","memo","useMemo","deepmerge","createOdysseyMuiTheme","Tokens","OdysseyDesignTokensContext","jsx","_jsx","OdysseyThemeProvider","_ref","children","designTokensOverride","shadowDomElement","themeOverride","odysseyTokens","odysseyTheme","customOdysseyTheme","theme","Provider","value","MemoizedOdysseyThemeProvider"],"sources":["../src/OdysseyThemeProvider.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n createTheme,\n ThemeProvider as MuiThemeProvider,\n} from \"@mui/material/styles\";\nimport { memo, ReactNode, useMemo } from \"react\";\n\nimport { ThemeOptions } from \"@mui/material\";\nimport { deepmerge } from \"@mui/utils\";\nimport { createOdysseyMuiTheme, DesignTokensOverride } from \"./theme\";\nimport * as Tokens from \"@okta/odyssey-design-tokens\";\nimport { OdysseyDesignTokensContext } from \"./OdysseyDesignTokensContext\";\n\nexport type OdysseyThemeProviderProps = {\n children: ReactNode;\n designTokensOverride?: DesignTokensOverride;\n shadowDomElement?: HTMLDivElement;\n themeOverride?: ThemeOptions;\n};\n\nconst OdysseyThemeProvider = ({\n children,\n designTokensOverride,\n shadowDomElement,\n themeOverride,\n}: OdysseyThemeProviderProps) => {\n const odysseyTokens = useMemo(\n () => ({ ...Tokens, ...designTokensOverride }),\n [designTokensOverride]\n );\n const odysseyTheme = useMemo(\n () =>\n createOdysseyMuiTheme({\n odysseyTokens,\n shadowDomElement,\n }),\n [odysseyTokens, shadowDomElement]\n );\n\n const customOdysseyTheme = useMemo(\n () => themeOverride && createTheme(deepmerge(odysseyTheme, themeOverride)),\n [odysseyTheme, themeOverride]\n );\n\n return (\n <MuiThemeProvider theme={customOdysseyTheme ?? odysseyTheme}>\n <OdysseyDesignTokensContext.Provider value={odysseyTokens}>\n {children}\n </OdysseyDesignTokensContext.Provider>\n </MuiThemeProvider>\n );\n};\n\nconst MemoizedOdysseyThemeProvider = memo(OdysseyThemeProvider);\n\nexport { MemoizedOdysseyThemeProvider as OdysseyThemeProvider };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SACEA,WAAW,EACXC,aAAa,IAAIC,gBAAgB,QAC5B,sBAAsB;AAC7B,SAASC,IAAI,EAAaC,OAAO,QAAQ,OAAO;AAGhD,SAASC,SAAS,QAAQ,YAAY;AAAC,SAC9BC,qBAAqB;AAC9B,OAAO,KAAKC,MAAM,MAAM,6BAA6B;AAAC,SAC7CC,0BAA0B;AAAA,SAAAC,GAAA,IAAAC,IAAA;AASnC,MAAMC,oBAAoB,GAAGC,IAAA,IAKI;EAAA,IALH;IAC5BC,QAAQ;IACRC,oBAAoB;IACpBC,gBAAgB;IAChBC;EACyB,CAAC,GAAAJ,IAAA;EAC1B,MAAMK,aAAa,GAAGb,OAAO,CAC3B,OAAO;IAAE,GAAGG,MAAM;IAAE,GAAGO;EAAqB,CAAC,CAAC,EAC9C,CAACA,oBAAoB,CACvB,CAAC;EACD,MAAMI,YAAY,GAAGd,OAAO,CAC1B,MACEE,qBAAqB,CAAC;IACpBW,aAAa;IACbF;EACF,CAAC,CAAC,EACJ,CAACE,aAAa,EAAEF,gBAAgB,CAClC,CAAC;EAED,MAAMI,kBAAkB,GAAGf,OAAO,CAChC,MAAMY,aAAa,IAAIhB,WAAW,CAACK,SAAS,CAACa,YAAY,EAAEF,aAAa,CAAC,CAAC,EAC1E,CAACE,YAAY,EAAEF,aAAa,CAC9B,CAAC;EAED,OACEN,IAAA,CAACR,gBAAgB;IAACkB,KAAK,EAAED,kBAAkB,IAAID,YAAa;IAAAL,QAAA,EAC1DH,IAAA,CAACF,0BAA0B,CAACa,QAAQ;MAACC,KAAK,EAAEL,aAAc;MAAAJ,QAAA,EACvDA;IAAQ,CAC0B;EAAC,CACtB,CAAC;AAEvB,CAAC;AAED,MAAMU,4BAA4B,GAAGpB,IAAI,CAACQ,oBAAoB,CAAC;AAE/D,SAASY,4BAA4B,IAAIZ,oBAAoB"}
|
package/dist/PasswordField.js
CHANGED
|
@@ -53,7 +53,7 @@ const PasswordField = forwardRef((_ref, ref) => {
|
|
|
53
53
|
} = _ref2;
|
|
54
54
|
return _jsx(_InputBase, {
|
|
55
55
|
"aria-describedby": ariaDescribedBy,
|
|
56
|
-
autoComplete: autoCompleteType,
|
|
56
|
+
autoComplete: inputType === "password" ? autoCompleteType : "off",
|
|
57
57
|
autoFocus: hasInitialFocus,
|
|
58
58
|
"data-se": testId,
|
|
59
59
|
endAdornment: hasShowPassword && _jsx(_InputAdornment, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PasswordField.js","names":["forwardRef","memo","useCallback","useState","ShowIcon","HideIcon","Field","useTranslation","jsx","_jsx","PasswordField","_ref","ref","autoCompleteType","errorMessage","hasInitialFocus","hint","id","idOverride","isDisabled","isOptional","hasShowPassword","isReadOnly","label","name","nameOverride","onChange","onFocus","onBlur","placeholder","testId","value","t","inputType","setInputType","togglePasswordVisibility","renderFieldComponent","_ref2","ariaDescribedBy","errorMessageElementId","labelElementId","_InputBase","autoComplete","autoFocus","endAdornment","_InputAdornment","position","children","_IconButton","onClick","inputProps","role","readOnly","required","type","fieldType","hasVisibleLabel","MemoizedPasswordField","displayName"],"sources":["../src/PasswordField.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, IconButton } from \"@mui/material\";\nimport {\n ChangeEventHandler,\n FocusEventHandler,\n forwardRef,\n memo,\n useCallback,\n useState,\n} from \"react\";\n\nimport { ShowIcon, HideIcon } from \"./icons.generated\";\nimport { Field } from \"./Field\";\nimport type { SeleniumProps } from \"./SeleniumProps\";\nimport { useTranslation } from \"react-i18next\";\n\nexport type PasswordFieldProps = {\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?: \"current-password\" | \"new-password\";\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 * If `true`, the show/hide icon is not shown to the user\n */\n hasShowPassword?: 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`, 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 * The value of the `input` element, required for a controlled component.\n */\n value?: string;\n} & SeleniumProps;\n\nconst PasswordField = forwardRef<HTMLInputElement, PasswordFieldProps>(\n (\n {\n autoCompleteType,\n errorMessage,\n hasInitialFocus,\n hint,\n id: idOverride,\n isDisabled = false,\n isOptional = false,\n hasShowPassword = true,\n isReadOnly,\n label,\n name: nameOverride,\n onChange,\n onFocus,\n onBlur,\n placeholder,\n testId,\n value,\n },\n ref\n ) => {\n const { t } = useTranslation();\n const [inputType, setInputType] = useState(\"password\");\n\n const togglePasswordVisibility = useCallback(() => {\n setInputType((inputType) =>\n inputType === \"password\" ? \"text\" : \"password\"\n );\n }, []);\n\n const renderFieldComponent = useCallback(\n ({ ariaDescribedBy, errorMessageElementId, id, labelElementId }) => (\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 hasShowPassword && (\n <InputAdornment position=\"end\">\n <IconButton\n aria-label={\n inputType === \"password\"\n ? t(\"passwordfield.icon.label.show\")\n : t(\"passwordfield.icon.label.hide\")\n }\n onClick={togglePasswordVisibility}\n >\n {inputType === \"password\" ? <ShowIcon /> : <HideIcon />}\n </IconButton>\n </InputAdornment>\n )\n }\n id={id}\n inputProps={{\n \"aria-errormessage\": errorMessageElementId,\n \"aria-labelledby\": labelElementId,\n // role: \"textbox\" Added because password inputs don't have an implicit role assigned. This causes problems with element selection.\n role: \"textbox\",\n }}\n name={nameOverride ?? id}\n onChange={onChange}\n onFocus={onFocus}\n onBlur={onBlur}\n placeholder={placeholder}\n readOnly={isReadOnly}\n ref={ref}\n required={!isOptional}\n type={inputType}\n value={value}\n />\n ),\n [\n autoCompleteType,\n hasInitialFocus,\n t,\n togglePasswordVisibility,\n inputType,\n nameOverride,\n onChange,\n onFocus,\n onBlur,\n placeholder,\n isOptional,\n isReadOnly,\n hasShowPassword,\n ref,\n testId,\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 MemoizedPasswordField = memo(PasswordField);\nMemoizedPasswordField.displayName = \"PasswordField\";\n\nexport { MemoizedPasswordField as PasswordField };\n"],"mappings":";;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,SAGEA,UAAU,EACVC,IAAI,EACJC,WAAW,EACXC,QAAQ,QACH,OAAO;AAAC,SAENC,QAAQ,EAAEC,QAAQ;AAAA,SAClBC,KAAK;AAEd,SAASC,cAAc,QAAQ,eAAe;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAuE/C,MAAMC,aAAa,GAAGV,UAAU,CAC9B,CAAAW,IAAA,EAoBEC,GAAG,KACA;EAAA,IApBH;IACEC,gBAAgB;IAChBC,YAAY;IACZC,eAAe;IACfC,IAAI;IACJC,EAAE,EAAEC,UAAU;IACdC,UAAU,GAAG,KAAK;IAClBC,UAAU,GAAG,KAAK;IAClBC,eAAe,GAAG,IAAI;IACtBC,UAAU;IACVC,KAAK;IACLC,IAAI,EAAEC,YAAY;IAClBC,QAAQ;IACRC,OAAO;IACPC,MAAM;IACNC,WAAW;IACXC,MAAM;IACNC;EACF,CAAC,GAAApB,IAAA;EAGD,MAAM;IAAEqB;EAAE,CAAC,GAAGzB,cAAc,CAAC,CAAC;EAC9B,MAAM,CAAC0B,SAAS,EAAEC,YAAY,CAAC,GAAG/B,QAAQ,CAAC,UAAU,CAAC;EAEtD,MAAMgC,wBAAwB,GAAGjC,WAAW,CAAC,MAAM;IACjDgC,YAAY,CAAED,SAAS,IACrBA,SAAS,KAAK,UAAU,GAAG,MAAM,GAAG,UACtC,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMG,oBAAoB,GAAGlC,WAAW,CACtCmC,KAAA;IAAA,IAAC;MAAEC,eAAe;MAAEC,qBAAqB;MAAEtB,EAAE;MAAEuB;IAAe,CAAC,GAAAH,KAAA;IAAA,OAC7D5B,IAAA,CAAAgC,UAAA;MACE,oBAAkBH,eAAgB;MAClCI,YAAY,
|
|
1
|
+
{"version":3,"file":"PasswordField.js","names":["forwardRef","memo","useCallback","useState","ShowIcon","HideIcon","Field","useTranslation","jsx","_jsx","PasswordField","_ref","ref","autoCompleteType","errorMessage","hasInitialFocus","hint","id","idOverride","isDisabled","isOptional","hasShowPassword","isReadOnly","label","name","nameOverride","onChange","onFocus","onBlur","placeholder","testId","value","t","inputType","setInputType","togglePasswordVisibility","renderFieldComponent","_ref2","ariaDescribedBy","errorMessageElementId","labelElementId","_InputBase","autoComplete","autoFocus","endAdornment","_InputAdornment","position","children","_IconButton","onClick","inputProps","role","readOnly","required","type","fieldType","hasVisibleLabel","MemoizedPasswordField","displayName"],"sources":["../src/PasswordField.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, IconButton } from \"@mui/material\";\nimport {\n ChangeEventHandler,\n FocusEventHandler,\n forwardRef,\n memo,\n useCallback,\n useState,\n} from \"react\";\n\nimport { ShowIcon, HideIcon } from \"./icons.generated\";\nimport { Field } from \"./Field\";\nimport type { SeleniumProps } from \"./SeleniumProps\";\nimport { useTranslation } from \"react-i18next\";\n\nexport type PasswordFieldProps = {\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?: \"current-password\" | \"new-password\";\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 * If `true`, the show/hide icon is not shown to the user\n */\n hasShowPassword?: 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`, 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 * The value of the `input` element, required for a controlled component.\n */\n value?: string;\n} & SeleniumProps;\n\nconst PasswordField = forwardRef<HTMLInputElement, PasswordFieldProps>(\n (\n {\n autoCompleteType,\n errorMessage,\n hasInitialFocus,\n hint,\n id: idOverride,\n isDisabled = false,\n isOptional = false,\n hasShowPassword = true,\n isReadOnly,\n label,\n name: nameOverride,\n onChange,\n onFocus,\n onBlur,\n placeholder,\n testId,\n value,\n },\n ref\n ) => {\n const { t } = useTranslation();\n const [inputType, setInputType] = useState(\"password\");\n\n const togglePasswordVisibility = useCallback(() => {\n setInputType((inputType) =>\n inputType === \"password\" ? \"text\" : \"password\"\n );\n }, []);\n\n const renderFieldComponent = useCallback(\n ({ ariaDescribedBy, errorMessageElementId, id, labelElementId }) => (\n <InputBase\n aria-describedby={ariaDescribedBy}\n autoComplete={inputType === \"password\" ? autoCompleteType : \"off\"}\n /* eslint-disable-next-line jsx-a11y/no-autofocus */\n autoFocus={hasInitialFocus}\n data-se={testId}\n endAdornment={\n hasShowPassword && (\n <InputAdornment position=\"end\">\n <IconButton\n aria-label={\n inputType === \"password\"\n ? t(\"passwordfield.icon.label.show\")\n : t(\"passwordfield.icon.label.hide\")\n }\n onClick={togglePasswordVisibility}\n >\n {inputType === \"password\" ? <ShowIcon /> : <HideIcon />}\n </IconButton>\n </InputAdornment>\n )\n }\n id={id}\n inputProps={{\n \"aria-errormessage\": errorMessageElementId,\n \"aria-labelledby\": labelElementId,\n // role: \"textbox\" Added because password inputs don't have an implicit role assigned. This causes problems with element selection.\n role: \"textbox\",\n }}\n name={nameOverride ?? id}\n onChange={onChange}\n onFocus={onFocus}\n onBlur={onBlur}\n placeholder={placeholder}\n readOnly={isReadOnly}\n ref={ref}\n required={!isOptional}\n type={inputType}\n value={value}\n />\n ),\n [\n autoCompleteType,\n hasInitialFocus,\n t,\n togglePasswordVisibility,\n inputType,\n nameOverride,\n onChange,\n onFocus,\n onBlur,\n placeholder,\n isOptional,\n isReadOnly,\n hasShowPassword,\n ref,\n testId,\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 MemoizedPasswordField = memo(PasswordField);\nMemoizedPasswordField.displayName = \"PasswordField\";\n\nexport { MemoizedPasswordField as PasswordField };\n"],"mappings":"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"}
|
package/dist/Select.js
CHANGED
|
@@ -25,39 +25,37 @@ import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
25
25
|
const Select = _ref => {
|
|
26
26
|
let {
|
|
27
27
|
errorMessage,
|
|
28
|
+
hasMultipleChoices: hasMultipleChoicesProp,
|
|
28
29
|
hint,
|
|
29
30
|
id: idOverride,
|
|
30
31
|
isDisabled = false,
|
|
31
|
-
isMultiSelect
|
|
32
|
+
isMultiSelect,
|
|
32
33
|
isOptional = false,
|
|
33
34
|
label,
|
|
34
35
|
name: nameOverride,
|
|
35
36
|
onBlur,
|
|
36
37
|
onChange: onChangeProp,
|
|
37
38
|
onFocus,
|
|
38
|
-
|
|
39
|
+
options,
|
|
39
40
|
testId,
|
|
40
|
-
|
|
41
|
+
value
|
|
41
42
|
} = _ref;
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
const [selectedValue, setSelectedValue] = useState(value);
|
|
43
|
+
const hasMultipleChoices = useMemo(() => hasMultipleChoicesProp === undefined ? isMultiSelect : hasMultipleChoicesProp, [hasMultipleChoicesProp, isMultiSelect]);
|
|
44
|
+
const formattedValueForMultiSelect = isMultiSelect ? [] : "";
|
|
45
|
+
const [selectedValue, setSelectedValue] = useState(value === undefined ? formattedValueForMultiSelect : value);
|
|
46
46
|
const onChange = useCallback((event, child) => {
|
|
47
|
-
const
|
|
48
|
-
|
|
49
|
-
|
|
47
|
+
const valueFromEvent = event.target.value;
|
|
48
|
+
if (typeof valueFromEvent === "string") {
|
|
49
|
+
if (hasMultipleChoices) {
|
|
50
|
+
setSelectedValue(valueFromEvent.split(","));
|
|
51
|
+
} else {
|
|
52
|
+
setSelectedValue(valueFromEvent);
|
|
50
53
|
}
|
|
51
|
-
} = event;
|
|
52
|
-
if (isMultiSelect) {
|
|
53
|
-
setSelectedValue(typeof value === "string" ? value.split(",") : value);
|
|
54
54
|
} else {
|
|
55
|
-
setSelectedValue(
|
|
55
|
+
setSelectedValue(valueFromEvent);
|
|
56
56
|
}
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
}
|
|
60
|
-
}, [isMultiSelect, onChangeProp, setSelectedValue]);
|
|
57
|
+
onChangeProp?.(event, child);
|
|
58
|
+
}, [hasMultipleChoices, onChangeProp, setSelectedValue]);
|
|
61
59
|
const normalizedOptions = useMemo(() => options.map(option => typeof option === "object" ? {
|
|
62
60
|
text: option.text,
|
|
63
61
|
value: option.value || option.text,
|
|
@@ -95,13 +93,13 @@ const Select = _ref => {
|
|
|
95
93
|
}
|
|
96
94
|
return _jsxs(_MenuItem, {
|
|
97
95
|
value: option.value,
|
|
98
|
-
children: [
|
|
96
|
+
children: [hasMultipleChoices && _jsx(_Checkbox, {
|
|
99
97
|
checked: selectedValue.includes(option.value)
|
|
100
98
|
}), option.text, selectedValue == option.value && _jsx(_ListItemSecondaryAction, {
|
|
101
99
|
children: _jsx(CheckIcon, {})
|
|
102
100
|
})]
|
|
103
101
|
}, option.value);
|
|
104
|
-
}), [
|
|
102
|
+
}), [hasMultipleChoices, normalizedOptions, selectedValue]);
|
|
105
103
|
const renderFieldComponent = useCallback(_ref2 => {
|
|
106
104
|
let {
|
|
107
105
|
ariaDescribedBy,
|
|
@@ -110,21 +108,21 @@ const Select = _ref => {
|
|
|
110
108
|
labelElementId
|
|
111
109
|
} = _ref2;
|
|
112
110
|
return _jsx(_Select, {
|
|
111
|
+
"aria-describedby": ariaDescribedBy,
|
|
112
|
+
"aria-errormessage": errorMessageElementId,
|
|
113
113
|
children: children,
|
|
114
114
|
"data-se": testId,
|
|
115
115
|
id: id,
|
|
116
|
-
"aria-errormessage": errorMessageElementId,
|
|
117
|
-
"aria-describedby": ariaDescribedBy,
|
|
118
116
|
labelId: labelElementId,
|
|
119
|
-
multiple:
|
|
117
|
+
multiple: hasMultipleChoices,
|
|
120
118
|
name: nameOverride ?? id,
|
|
121
119
|
onBlur: onBlur,
|
|
122
120
|
onChange: onChange,
|
|
123
121
|
onFocus: onFocus,
|
|
124
|
-
renderValue:
|
|
122
|
+
renderValue: hasMultipleChoices ? renderValue : undefined,
|
|
125
123
|
value: selectedValue
|
|
126
124
|
});
|
|
127
|
-
}, [children,
|
|
125
|
+
}, [children, hasMultipleChoices, nameOverride, onBlur, onChange, onFocus, renderValue, selectedValue, testId]);
|
|
128
126
|
return _jsx(Field, {
|
|
129
127
|
errorMessage: errorMessage,
|
|
130
128
|
fieldType: "single",
|
package/dist/Select.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.js","names":["memo","useCallback","useMemo","useState","Field","CheckIcon","jsx","_jsx","jsxs","_jsxs","Select","_ref","errorMessage","hint","id","idOverride","isDisabled","isMultiSelect","isOptional","label","name","nameOverride","onBlur","onChange","onChangeProp","onFocus","value","testId","options","selectedValue","setSelectedValue","event","child","target","split","normalizedOptions","map","option","text","type","renderValue","selected","undefined","renderedChips","item","selectedOption","find","_Chip","filter","Boolean","length","_Box","children","_ListSubheader","_MenuItem","_Checkbox","checked","includes","_ListItemSecondaryAction","renderFieldComponent","_ref2","ariaDescribedBy","errorMessageElementId","labelElementId","_Select","labelId","multiple","fieldType","hasVisibleLabel","MemoizedSelect","displayName"],"sources":["../src/Select.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 { ReactNode, memo, useCallback, useMemo, useState } from \"react\";\nimport {\n Box,\n Chip,\n Checkbox as MuiCheckbox,\n ListSubheader,\n MenuItem,\n Select as MuiSelect,\n SelectChangeEvent,\n ListItemSecondaryAction,\n} from \"@mui/material\";\nimport { SelectProps as MuiSelectProps } from \"@mui/material\";\nimport { Field } from \"./Field\";\nimport type { SeleniumProps } from \"./SeleniumProps\";\nimport { CheckIcon } from \"./icons.generated\";\n\nexport type SelectOption = {\n text: string;\n type?: \"heading\" | \"option\";\n value?: string;\n};\n\nexport type SelectProps = {\n /**\n * The error message for the Select\n */\n errorMessage?: string;\n /**\n * The hint text for the Select\n */\n hint?: string;\n /**\n * The id attribute of the Select\n */\n id?: string;\n /**\n * If `true`, the Select is disabled\n */\n isDisabled?: boolean;\n /**\n * If `true`, the Select allows multiple selections\n */\n isMultiSelect?: boolean;\n /**\n * If `true`, the Select is optional\n */\n isOptional?: boolean;\n /**\n * The label text for the Select\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 Select loses focus\n */\n onBlur?: MuiSelectProps[\"onBlur\"];\n /**\n * Callback fired when the value of the Select changes\n */\n onChange?: MuiSelectProps[\"onChange\"];\n /**\n * Callback fired when the Select gains focus\n */\n onFocus?: MuiSelectProps[\"onFocus\"];\n /**\n * The options for the Select\n */\n options: (string | SelectOption)[];\n /**\n * The value or values selected in the Select\n */\n value?: string | string[];\n} & SeleniumProps;\n\n/**\n * Options in Odyssey <Select> are passed as an array, which can contain any combination\n * of the following:\n * - string — A simple string. The string will be both the text and the value of the resulting option.\n * <option value=\"string\">string</option>\n *\n * - { text: string } — Same as above, but the string is contained within an object.\n * <option value=\"text\">text</option>\n *\n * - { text: string, value: string } — The option text will be text, and the option value will be value.\n * <option value=\"value\">text</option>\n *\n * - { text: string, type: \"heading\" } — Used to display a group heading with the text\n */\n\nconst Select = ({\n errorMessage,\n hint,\n id: idOverride,\n isDisabled = false,\n isMultiSelect = false,\n isOptional = false,\n label,\n name: nameOverride,\n onBlur,\n onChange: onChangeProp,\n onFocus,\n value,\n testId,\n options,\n}: SelectProps) => {\n // If there's no value set, we set it to a blank string (if it's a single-select)\n // or an empty array (if it's a multi-select)\n if (typeof value === \"undefined\") {\n value = isMultiSelect ? [] : \"\";\n }\n\n const [selectedValue, setSelectedValue] = useState<string | string[]>(value);\n\n const onChange = useCallback(\n (event: SelectChangeEvent<string | string[]>, child: ReactNode) => {\n const {\n target: { value },\n } = event;\n\n // Set the field value, with some additional logic to handle array values\n // for multi-selects\n if (isMultiSelect) {\n setSelectedValue(typeof value === \"string\" ? value.split(\",\") : value);\n } else {\n setSelectedValue(value);\n }\n\n // Trigger the onChange event, if one has been passed\n if (onChangeProp) {\n onChangeProp(event, child);\n }\n },\n [isMultiSelect, onChangeProp, setSelectedValue]\n );\n\n // Normalize the options array to accommodate the various\n // data types that might be passed\n const normalizedOptions = useMemo(\n () =>\n options.map((option) =>\n typeof option === \"object\"\n ? {\n text: option.text,\n value: option.value || option.text,\n type: option.type === \"heading\" ? \"heading\" : \"option\",\n }\n : { text: option, value: option, type: \"option\" }\n ),\n [options]\n );\n\n const renderValue = useCallback(\n (selected: string | string[]) => {\n // If the selected value isn't an array, then we don't need to display\n // chips and should fall back to the default render behavior\n if (typeof selected === \"string\") {\n return undefined;\n }\n\n // Convert the selected options array into <Chip>s\n const renderedChips = selected\n .map((item: string) => {\n const selectedOption = normalizedOptions.find(\n (option) => option.value === item\n );\n\n if (!selectedOption) {\n return null;\n }\n\n return <Chip key={item} label={selectedOption.text} />;\n })\n .filter(Boolean);\n\n if (renderedChips.length === 0) {\n return null;\n }\n\n // We need the <Box> to surround the <Chip>s for\n // proper styling\n return <Box>{renderedChips}</Box>;\n },\n [normalizedOptions]\n );\n\n // Convert the options into the ReactNode children\n // that will populate the <Select>\n const children = useMemo(\n () =>\n normalizedOptions.map((option) => {\n if (option.type === \"heading\") {\n return <ListSubheader key={option.text}>{option.text}</ListSubheader>;\n }\n\n return (\n <MenuItem key={option.value} value={option.value}>\n {isMultiSelect && (\n <MuiCheckbox checked={selectedValue.includes(option.value)} />\n )}\n {option.text}\n {selectedValue == option.value && (\n <ListItemSecondaryAction>\n <CheckIcon />\n </ListItemSecondaryAction>\n )}\n </MenuItem>\n );\n }),\n [isMultiSelect, normalizedOptions, selectedValue]\n );\n\n const renderFieldComponent = useCallback(\n ({ ariaDescribedBy, errorMessageElementId, id, labelElementId }) => (\n <MuiSelect\n children={children}\n data-se={testId}\n id={id}\n aria-errormessage={errorMessageElementId}\n aria-describedby={ariaDescribedBy}\n labelId={labelElementId}\n multiple={isMultiSelect}\n name={nameOverride ?? id}\n onBlur={onBlur}\n onChange={onChange}\n onFocus={onFocus}\n renderValue={isMultiSelect ? renderValue : undefined}\n value={selectedValue}\n />\n ),\n [\n children,\n isMultiSelect,\n nameOverride,\n onBlur,\n onChange,\n onFocus,\n renderValue,\n selectedValue,\n testId,\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\nconst MemoizedSelect = memo(Select);\nMemoizedSelect.displayName = \"Select\";\n\nexport { MemoizedSelect as Select };\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Select.js","names":["memo","useCallback","useMemo","useState","Field","CheckIcon","jsx","_jsx","jsxs","_jsxs","Select","_ref","errorMessage","hasMultipleChoices","hasMultipleChoicesProp","hint","id","idOverride","isDisabled","isMultiSelect","isOptional","label","name","nameOverride","onBlur","onChange","onChangeProp","onFocus","options","testId","value","undefined","formattedValueForMultiSelect","selectedValue","setSelectedValue","event","child","valueFromEvent","target","split","normalizedOptions","map","option","text","type","renderValue","selected","renderedChips","item","selectedOption","find","_Chip","filter","Boolean","length","_Box","children","_ListSubheader","_MenuItem","_Checkbox","checked","includes","_ListItemSecondaryAction","renderFieldComponent","_ref2","ariaDescribedBy","errorMessageElementId","labelElementId","_Select","labelId","multiple","fieldType","hasVisibleLabel","MemoizedSelect","displayName"],"sources":["../src/Select.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, useCallback, useMemo, useState } from \"react\";\nimport {\n Box,\n Checkbox as MuiCheckbox,\n Chip,\n ListItemSecondaryAction,\n ListSubheader,\n MenuItem,\n Select as MuiSelect,\n} from \"@mui/material\";\nimport { SelectProps as MuiSelectProps } from \"@mui/material\";\nimport { Field } from \"./Field\";\nimport type { SeleniumProps } from \"./SeleniumProps\";\nimport { CheckIcon } from \"./icons.generated\";\n\nexport type SelectOption = {\n text: string;\n type?: \"heading\" | \"option\";\n value?: string;\n};\n\nexport type SelectValueType<HasMultipleChoices> =\n HasMultipleChoices extends true ? string[] : string;\n\nexport type SelectProps<\n Value extends SelectValueType<HasMultipleChoices>,\n HasMultipleChoices extends boolean\n> = {\n /**\n * The error message for the Select\n */\n errorMessage?: string;\n /**\n * If `true`, the Select allows multiple selections\n */\n hasMultipleChoices?: HasMultipleChoices;\n /**\n * The hint text for the Select\n */\n hint?: string;\n /**\n * The id attribute of the Select\n */\n id?: string;\n /**\n * If `true`, the Select is disabled\n */\n isDisabled?: boolean;\n /**\n * @deprecated Use `hasMultipleChoices` instead.\n */\n /** **Deprecated:** use `hasMultipleChoices` */\n isMultiSelect?: HasMultipleChoices;\n /**\n * If `true`, the Select is optional\n */\n isOptional?: boolean;\n /**\n * The label text for the Select\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 Select loses focus\n */\n onBlur?: MuiSelectProps<Value>[\"onBlur\"];\n /**\n * Callback fired when the value of the Select changes\n */\n onChange?: MuiSelectProps<Value>[\"onChange\"];\n /**\n * Callback fired when the Select gains focus\n */\n onFocus?: MuiSelectProps<Value>[\"onFocus\"];\n /**\n * The options for the Select\n */\n options: (string | SelectOption)[];\n /**\n * The value or values selected in the Select\n */\n value?: Value;\n} & SeleniumProps;\n\n/**\n * Options in Odyssey <Select> are passed as an array, which can contain any combination\n * of the following:\n * - string — A simple string. The string will be both the text and the value of the resulting option.\n * <option value=\"string\">string</option>\n *\n * - { text: string } — Same as above, but the string is contained within an object.\n * <option value=\"text\">text</option>\n *\n * - { text: string, value: string } — The option text will be text, and the option value will be value.\n * <option value=\"value\">text</option>\n *\n * - { text: string, type: \"heading\" } — Used to display a group heading with the text\n */\n\nconst Select = <\n Value extends SelectValueType<HasMultipleChoices>,\n HasMultipleChoices extends boolean\n>({\n errorMessage,\n hasMultipleChoices: hasMultipleChoicesProp,\n hint,\n id: idOverride,\n isDisabled = false,\n isMultiSelect,\n isOptional = false,\n label,\n name: nameOverride,\n onBlur,\n onChange: onChangeProp,\n onFocus,\n options,\n testId,\n value,\n}: SelectProps<Value, HasMultipleChoices>) => {\n const hasMultipleChoices = useMemo(\n () =>\n hasMultipleChoicesProp === undefined\n ? isMultiSelect\n : hasMultipleChoicesProp,\n [hasMultipleChoicesProp, isMultiSelect]\n );\n\n const formattedValueForMultiSelect = isMultiSelect\n ? ([] as string[] as Value)\n : (\"\" as string as Value);\n\n const [selectedValue, setSelectedValue] = useState(\n value === undefined ? formattedValueForMultiSelect : value\n );\n\n const onChange = useCallback<NonNullable<MuiSelectProps<Value>[\"onChange\"]>>(\n (event, child) => {\n const valueFromEvent = event.target.value;\n\n if (typeof valueFromEvent === \"string\") {\n if (hasMultipleChoices) {\n setSelectedValue(valueFromEvent.split(\",\") as Value);\n } else {\n setSelectedValue(valueFromEvent as Value);\n }\n } else {\n setSelectedValue(valueFromEvent);\n }\n\n onChangeProp?.(event, child);\n },\n [hasMultipleChoices, onChangeProp, setSelectedValue]\n );\n\n // Normalize the options array to accommodate the various\n // data types that might be passed\n const normalizedOptions = useMemo(\n () =>\n options.map((option) =>\n typeof option === \"object\"\n ? {\n text: option.text,\n value: option.value || option.text,\n type: option.type === \"heading\" ? \"heading\" : \"option\",\n }\n : { text: option, value: option, type: \"option\" }\n ),\n [options]\n );\n\n const renderValue = useCallback(\n (selected: Value) => {\n // If the selected value isn't an array, then we don't need to display\n // chips and should fall back to the default render behavior\n if (typeof selected === \"string\") {\n return undefined;\n }\n\n // Convert the selected options array into <Chip>s\n const renderedChips = selected\n .map((item: string) => {\n const selectedOption = normalizedOptions.find(\n (option) => option.value === item\n );\n\n if (!selectedOption) {\n return null;\n }\n\n return <Chip key={item} label={selectedOption.text} />;\n })\n .filter(Boolean);\n\n if (renderedChips.length === 0) {\n return null;\n }\n\n // We need the <Box> to surround the <Chip>s for\n // proper styling\n return <Box>{renderedChips}</Box>;\n },\n [normalizedOptions]\n );\n\n // Convert the options into the ReactNode children\n // that will populate the <Select>\n const children = useMemo(\n () =>\n normalizedOptions.map((option) => {\n if (option.type === \"heading\") {\n return <ListSubheader key={option.text}>{option.text}</ListSubheader>;\n }\n\n return (\n <MenuItem key={option.value} value={option.value}>\n {hasMultipleChoices && (\n <MuiCheckbox checked={selectedValue.includes(option.value)} />\n )}\n {option.text}\n {selectedValue == option.value && (\n <ListItemSecondaryAction>\n <CheckIcon />\n </ListItemSecondaryAction>\n )}\n </MenuItem>\n );\n }),\n [hasMultipleChoices, normalizedOptions, selectedValue]\n );\n\n const renderFieldComponent = useCallback(\n ({ ariaDescribedBy, errorMessageElementId, id, labelElementId }) => (\n <MuiSelect\n aria-describedby={ariaDescribedBy}\n aria-errormessage={errorMessageElementId}\n children={children}\n data-se={testId}\n id={id}\n labelId={labelElementId}\n multiple={hasMultipleChoices}\n name={nameOverride ?? id}\n onBlur={onBlur}\n onChange={onChange}\n onFocus={onFocus}\n renderValue={hasMultipleChoices ? renderValue : undefined}\n value={selectedValue}\n />\n ),\n [\n children,\n hasMultipleChoices,\n nameOverride,\n onBlur,\n onChange,\n onFocus,\n renderValue,\n selectedValue,\n testId,\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\nconst MemoizedSelect = memo(Select);\nMemoizedSelect.displayName = \"Select\";\n\nexport { MemoizedSelect as Select };\n"],"mappings":"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"}
|
package/dist/Tooltip.js
CHANGED
|
@@ -11,8 +11,9 @@ import _Tooltip from "@mui/material/Tooltip";
|
|
|
11
11
|
* See the License for the specific language governing permissions and limitations under the License.
|
|
12
12
|
*/
|
|
13
13
|
import { MuiPropsChild } from "./MuiPropsChild.js";
|
|
14
|
+
import { memo } from "react";
|
|
14
15
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
15
|
-
|
|
16
|
+
const Tooltip = _ref => {
|
|
16
17
|
let {
|
|
17
18
|
ariaType,
|
|
18
19
|
children,
|
|
@@ -30,4 +31,7 @@ export const Tooltip = _ref => {
|
|
|
30
31
|
})
|
|
31
32
|
});
|
|
32
33
|
};
|
|
34
|
+
const MemoizedTooltip = memo(Tooltip);
|
|
35
|
+
MemoizedTooltip.displayName = "Tooltip";
|
|
36
|
+
export { MemoizedTooltip as Tooltip };
|
|
33
37
|
//# sourceMappingURL=Tooltip.js.map
|
package/dist/Tooltip.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"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\
|
|
1
|
+
{"version":3,"file":"Tooltip.js","names":["MuiPropsChild","memo","jsx","_jsx","Tooltip","_ref","ariaType","children","placement","testId","text","_Tooltip","describeChild","title","MemoizedTooltip","displayName"],"sources":["../src/Tooltip.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { Tooltip as MuiTooltip } from \"@mui/material\";\nimport type { TooltipProps as MuiTooltipProps } from \"@mui/material\";\n\nimport { MuiPropsChild } from \"./MuiPropsChild\";\nimport { ReactElement, memo } from \"react\";\nimport { SeleniumProps } from \"./SeleniumProps\";\n\nexport type TooltipProps = {\n /**\n * The type of ARIA attribute to use\n */\n ariaType: \"description\" | \"label\";\n /**\n * The content that triggers the Tooltip when hovered\n */\n children: ReactElement;\n /**\n * The placement of the Tooltip\n */\n placement?: MuiTooltipProps[\"placement\"];\n /**\n * The text to display in the Tooltip\n */\n text: string;\n} & SeleniumProps;\n\nconst Tooltip = ({\n ariaType,\n children,\n placement = \"top\",\n testId,\n text,\n}: TooltipProps) => (\n <MuiTooltip\n data-se={testId}\n describeChild={ariaType === \"description\"}\n placement={placement}\n title={text}\n >\n <MuiPropsChild>{children}</MuiPropsChild>\n </MuiTooltip>\n);\n\nconst MemoizedTooltip = memo(Tooltip);\nMemoizedTooltip.displayName = \"Tooltip\";\n\nexport { MemoizedTooltip as Tooltip };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA,SAeSA,aAAa;AACtB,SAAuBC,IAAI,QAAQ,OAAO;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAsB3C,MAAMC,OAAO,GAAGC,IAAA;EAAA,IAAC;IACfC,QAAQ;IACRC,QAAQ;IACRC,SAAS,GAAG,KAAK;IACjBC,MAAM;IACNC;EACY,CAAC,GAAAL,IAAA;EAAA,OACbF,IAAA,CAAAQ,QAAA;IACE,WAASF,MAAO;IAChBG,aAAa,EAAEN,QAAQ,KAAK,aAAc;IAC1CE,SAAS,EAAEA,SAAU;IACrBK,KAAK,EAAEH,IAAK;IAAAH,QAAA,EAEZJ,IAAA,CAACH,aAAa;MAAAO,QAAA,EAAEA;IAAQ,CAAgB;EAAC,CAC/B,CAAC;AAAA,CACd;AAED,MAAMO,eAAe,GAAGb,IAAI,CAACG,OAAO,CAAC;AACrCU,eAAe,CAACC,WAAW,GAAG,SAAS;AAEvC,SAASD,eAAe,IAAIV,OAAO"}
|
|
@@ -10,17 +10,12 @@
|
|
|
10
10
|
* See the License for the specific language governing permissions and limitations under the License.
|
|
11
11
|
*/
|
|
12
12
|
|
|
13
|
-
export const
|
|
14
|
-
const
|
|
13
|
+
export const createShadowRootElement = containerElement => {
|
|
14
|
+
const shadowRoot = containerElement.attachShadow({
|
|
15
15
|
mode: "open"
|
|
16
16
|
});
|
|
17
|
-
const
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
shadowContainer.appendChild(shadowRootElement);
|
|
21
|
-
return {
|
|
22
|
-
emotionRootElement,
|
|
23
|
-
shadowRootElement
|
|
24
|
-
};
|
|
17
|
+
const ShadowRootElement = document.createElement("div");
|
|
18
|
+
shadowRoot.append(ShadowRootElement);
|
|
19
|
+
return createShadowRootElement;
|
|
25
20
|
};
|
|
26
|
-
//# sourceMappingURL=
|
|
21
|
+
//# sourceMappingURL=createShadowRootElement.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"createShadowRootElement.js","names":["createShadowRootElement","containerElement","shadowRoot","attachShadow","mode","ShadowRootElement","document","createElement","append"],"sources":["../src/createShadowRootElement.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\nexport const createShadowRootElement = (containerElement: HTMLElement) => {\n const shadowRoot = containerElement.attachShadow({ mode: \"open\" });\n\n const ShadowRootElement = document.createElement(\"div\");\n\n shadowRoot.append(ShadowRootElement);\n\n return createShadowRootElement;\n};\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAO,MAAMA,uBAAuB,GAAIC,gBAA6B,IAAK;EACxE,MAAMC,UAAU,GAAGD,gBAAgB,CAACE,YAAY,CAAC;IAAEC,IAAI,EAAE;EAAO,CAAC,CAAC;EAElE,MAAMC,iBAAiB,GAAGC,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;EAEvDL,UAAU,CAACM,MAAM,CAACH,iBAAiB,CAAC;EAEpC,OAAOL,uBAAuB;AAChC,CAAC"}
|
package/dist/index.js
CHANGED
|
@@ -23,6 +23,7 @@ export * from "./Callout.js";
|
|
|
23
23
|
export * from "./Checkbox.js";
|
|
24
24
|
export * from "./CheckboxGroup.js";
|
|
25
25
|
export * from "./CircularProgress.js";
|
|
26
|
+
export * from "./createShadowRootElement.js";
|
|
26
27
|
export * from "./createUniqueId.js";
|
|
27
28
|
export * from "./Dialog.js";
|
|
28
29
|
export * from "./Fieldset.js";
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["deepmerge","visuallyHidden","createTheme","CssBaseline","DialogContentText","Divider","InputAdornment","InputBase","ListItemIcon","ListItemText","ListSubheader","MenuList","Paper","ScopedCssBaseline","ThemeProvider","useOdysseyDesignTokens","odysseyTranslate"],"sources":["../src/index.ts"],"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\nexport { deepmerge, visuallyHidden } from \"@mui/utils\";\n\nexport {\n createTheme,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n CssBaseline,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n DialogContentText,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n Divider,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n InputAdornment,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n InputBase,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n ListItemIcon,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n ListItemText,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n ListSubheader,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n MenuList,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n Paper,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n ScopedCssBaseline,\n ThemeProvider,\n} from \"@mui/material\";\n\nexport type {\n CssBaselineProps,\n DialogContentTextProps,\n DividerProps,\n InputAdornmentProps,\n InputBaseProps,\n ListItemIconProps,\n ListItemTextProps,\n ListSubheaderProps,\n MenuListProps,\n PaperProps,\n ScopedCssBaselineProps,\n ThemeOptions,\n} from \"@mui/material\";\n\nexport { useOdysseyDesignTokens } from \"./OdysseyDesignTokensContext\";\n\nexport * from \"./Accordion\";\nexport * from \"./Autocomplete\";\nexport * from \"./Banner\";\nexport * from \"./Box\";\nexport * from \"./Breadcrumbs\";\nexport * from \"./Button\";\nexport * from \"./Callout\";\nexport * from \"./Checkbox\";\nexport * from \"./CheckboxGroup\";\nexport * from \"./CircularProgress\";\nexport * from \"./createUniqueId\";\nexport * from \"./Dialog\";\nexport * from \"./Fieldset\";\nexport * from \"./Form\";\nexport * from \"./Link\";\nexport * from \"./MenuButton\";\nexport * from \"./MenuItem\";\nexport * from \"./NativeSelect\";\nexport * from \"./NullElement\";\nexport * from \"./OdysseyCacheProvider\";\nexport { odysseyTranslate } from \"./i18n\";\nexport * from \"./OdysseyProvider\";\nexport * from \"./OdysseyThemeProvider\";\nexport * from \"./OdysseyTranslationProvider\";\nexport * from \"./PasswordField\";\nexport * from \"./Radio\";\nexport * from \"./RadioGroup\";\nexport * from \"./ScreenReaderText\";\nexport * from \"./SearchField\";\nexport * from \"./Select\";\nexport * from \"./Status\";\nexport * from \"./Tabs\";\nexport * from \"./Tag\";\nexport * from \"./TagList\";\nexport * from \"./TextField\";\nexport * from \"./theme\";\nexport * from \"./Toast\";\nexport * from \"./ToastStack\";\nexport * from \"./Tooltip\";\nexport * from \"./Typography\";\nexport * from \"./useUniqueId\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,SAAS,EAAEC,cAAc,QAAQ,YAAY;AAEtD,SACEC,WAAW,EAEXC,WAAW,EAEXC,iBAAiB,EAEjBC,OAAO,EAEPC,cAAc,EAEdC,SAAS,EAETC,YAAY,EAEZC,YAAY,EAEZC,aAAa,EAEbC,QAAQ,EAERC,KAAK,EAELC,iBAAiB,EACjBC,aAAa,QACR,eAAe;AAAC,SAiBdC,sBAAsB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,
|
|
1
|
+
{"version":3,"file":"index.js","names":["deepmerge","visuallyHidden","createTheme","CssBaseline","DialogContentText","Divider","InputAdornment","InputBase","ListItemIcon","ListItemText","ListSubheader","MenuList","Paper","ScopedCssBaseline","ThemeProvider","useOdysseyDesignTokens","odysseyTranslate"],"sources":["../src/index.ts"],"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\nexport { deepmerge, visuallyHidden } from \"@mui/utils\";\n\nexport {\n createTheme,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n CssBaseline,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n DialogContentText,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n Divider,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n InputAdornment,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n InputBase,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n ListItemIcon,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n ListItemText,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n ListSubheader,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n MenuList,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n Paper,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n ScopedCssBaseline,\n ThemeProvider,\n} from \"@mui/material\";\n\nexport type {\n CssBaselineProps,\n DialogContentTextProps,\n DividerProps,\n InputAdornmentProps,\n InputBaseProps,\n ListItemIconProps,\n ListItemTextProps,\n ListSubheaderProps,\n MenuListProps,\n PaperProps,\n ScopedCssBaselineProps,\n ThemeOptions,\n} from \"@mui/material\";\n\nexport { useOdysseyDesignTokens } from \"./OdysseyDesignTokensContext\";\n\nexport * from \"./Accordion\";\nexport * from \"./Autocomplete\";\nexport * from \"./Banner\";\nexport * from \"./Box\";\nexport * from \"./Breadcrumbs\";\nexport * from \"./Button\";\nexport * from \"./Callout\";\nexport * from \"./Checkbox\";\nexport * from \"./CheckboxGroup\";\nexport * from \"./CircularProgress\";\nexport * from \"./createShadowRootElement\";\nexport * from \"./createUniqueId\";\nexport * from \"./Dialog\";\nexport * from \"./Fieldset\";\nexport * from \"./Form\";\nexport * from \"./Link\";\nexport * from \"./MenuButton\";\nexport * from \"./MenuItem\";\nexport * from \"./NativeSelect\";\nexport * from \"./NullElement\";\nexport * from \"./OdysseyCacheProvider\";\nexport { odysseyTranslate } from \"./i18n\";\nexport * from \"./OdysseyProvider\";\nexport * from \"./OdysseyThemeProvider\";\nexport * from \"./OdysseyTranslationProvider\";\nexport * from \"./PasswordField\";\nexport * from \"./Radio\";\nexport * from \"./RadioGroup\";\nexport * from \"./ScreenReaderText\";\nexport * from \"./SearchField\";\nexport * from \"./Select\";\nexport * from \"./Status\";\nexport * from \"./Tabs\";\nexport * from \"./Tag\";\nexport * from \"./TagList\";\nexport * from \"./TextField\";\nexport * from \"./theme\";\nexport * from \"./Toast\";\nexport * from \"./ToastStack\";\nexport * from \"./Tooltip\";\nexport * from \"./Typography\";\nexport * from \"./useUniqueId\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,SAAS,EAAEC,cAAc,QAAQ,YAAY;AAEtD,SACEC,WAAW,EAEXC,WAAW,EAEXC,iBAAiB,EAEjBC,OAAO,EAEPC,cAAc,EAEdC,SAAS,EAETC,YAAY,EAEZC,YAAY,EAEZC,aAAa,EAEbC,QAAQ,EAERC,KAAK,EAELC,iBAAiB,EACjBC,aAAa,QACR,eAAe;AAAC,SAiBdC,sBAAsB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SAuBtBC,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA"}
|
|
@@ -22,10 +22,10 @@ export type OdysseyCacheProviderProps = {
|
|
|
22
22
|
* Emotion renders into this HTML element.
|
|
23
23
|
* When enabling this prop, Emotion renders at the top of this component rather than the bottom like it does in the HTML `<head>`.
|
|
24
24
|
*/
|
|
25
|
-
emotionRootElement?: HTMLStyleElement;
|
|
26
25
|
nonce?: string;
|
|
26
|
+
shadowDomElement?: HTMLDivElement;
|
|
27
27
|
stylisPlugins?: StylisPlugin[];
|
|
28
28
|
};
|
|
29
|
-
declare const MemoizedOdysseyCacheProvider: import("react").MemoExoticComponent<({ children,
|
|
29
|
+
declare const MemoizedOdysseyCacheProvider: import("react").MemoExoticComponent<({ children, nonce, shadowDomElement, stylisPlugins, }: OdysseyCacheProviderProps) => JSX.Element>;
|
|
30
30
|
export { MemoizedOdysseyCacheProvider as OdysseyCacheProvider };
|
|
31
31
|
//# sourceMappingURL=OdysseyCacheProvider.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OdysseyCacheProvider.d.ts","sourceRoot":"","sources":["../../src/OdysseyCacheProvider.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,MAAM;QACd,QAAQ,EAAE,MAAM,CAAC;KAClB;CACF;AAED,OAAoB,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE3D,OAAO,EAAQ,SAAS,EAAW,MAAM,OAAO,CAAC;AAIjD,MAAM,MAAM,yBAAyB,GAAG;IACtC,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,
|
|
1
|
+
{"version":3,"file":"OdysseyCacheProvider.d.ts","sourceRoot":"","sources":["../../src/OdysseyCacheProvider.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,MAAM;QACd,QAAQ,EAAE,MAAM,CAAC;KAClB;CACF;AAED,OAAoB,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE3D,OAAO,EAAQ,SAAS,EAAW,MAAM,OAAO,CAAC;AAIjD,MAAM,MAAM,yBAAyB,GAAG;IACtC,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gBAAgB,CAAC,EAAE,cAAc,CAAC;IAClC,aAAa,CAAC,EAAE,YAAY,EAAE,CAAC;CAChC,CAAC;AAmCF,QAAA,MAAM,4BAA4B,8FA5B/B,yBAAyB,iBA4BmC,CAAC;AAGhE,OAAO,EAAE,4BAA4B,IAAI,oBAAoB,EAAE,CAAC"}
|
|
@@ -16,6 +16,6 @@ import { OdysseyTranslationProviderProps } from "./OdysseyTranslationProvider";
|
|
|
16
16
|
export type OdysseyProviderProps = OdysseyCacheProviderProps & OdysseyThemeProviderProps & OdysseyTranslationProviderProps & {
|
|
17
17
|
children: ReactNode;
|
|
18
18
|
};
|
|
19
|
-
declare const MemoizedThemeProvider: import("react").MemoExoticComponent<({ children, designTokensOverride,
|
|
19
|
+
declare const MemoizedThemeProvider: import("react").MemoExoticComponent<({ children, designTokensOverride, shadowDomElement, languageCode, nonce, stylisPlugins, themeOverride, translationOverrides, }: OdysseyProviderProps) => JSX.Element>;
|
|
20
20
|
export { MemoizedThemeProvider as OdysseyProvider };
|
|
21
21
|
//# sourceMappingURL=OdysseyProvider.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OdysseyProvider.d.ts","sourceRoot":"","sources":["../../src/OdysseyProvider.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAQ,SAAS,EAAE,MAAM,OAAO,CAAC;AAGxC,OAAO,EAEL,yBAAyB,EAC1B,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAEL,yBAAyB,EAC1B,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAEL,+BAA+B,EAChC,MAAM,8BAA8B,CAAC;AAEtC,MAAM,MAAM,oBAAoB,GAAG,yBAAyB,GAC1D,yBAAyB,GACzB,+BAA+B,GAAG;IAChC,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;
|
|
1
|
+
{"version":3,"file":"OdysseyProvider.d.ts","sourceRoot":"","sources":["../../src/OdysseyProvider.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAQ,SAAS,EAAE,MAAM,OAAO,CAAC;AAGxC,OAAO,EAEL,yBAAyB,EAC1B,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAEL,yBAAyB,EAC1B,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAEL,+BAA+B,EAChC,MAAM,8BAA8B,CAAC;AAEtC,MAAM,MAAM,oBAAoB,GAAG,yBAAyB,GAC1D,yBAAyB,GACzB,+BAA+B,GAAG;IAChC,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAkCJ,QAAA,MAAM,qBAAqB,uKAvBxB,oBAAoB,iBAuB4B,CAAC;AAEpD,OAAO,EAAE,qBAAqB,IAAI,eAAe,EAAE,CAAC"}
|
|
@@ -15,9 +15,9 @@ import { DesignTokensOverride } from "./theme";
|
|
|
15
15
|
export type OdysseyThemeProviderProps = {
|
|
16
16
|
children: ReactNode;
|
|
17
17
|
designTokensOverride?: DesignTokensOverride;
|
|
18
|
-
|
|
18
|
+
shadowDomElement?: HTMLDivElement;
|
|
19
19
|
themeOverride?: ThemeOptions;
|
|
20
20
|
};
|
|
21
|
-
declare const MemoizedOdysseyThemeProvider: import("react").MemoExoticComponent<({ children, designTokensOverride,
|
|
21
|
+
declare const MemoizedOdysseyThemeProvider: import("react").MemoExoticComponent<({ children, designTokensOverride, shadowDomElement, themeOverride, }: OdysseyThemeProviderProps) => JSX.Element>;
|
|
22
22
|
export { MemoizedOdysseyThemeProvider as OdysseyThemeProvider };
|
|
23
23
|
//# sourceMappingURL=OdysseyThemeProvider.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OdysseyThemeProvider.d.ts","sourceRoot":"","sources":["../../src/OdysseyThemeProvider.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAMH,OAAO,EAAQ,SAAS,EAAW,MAAM,OAAO,CAAC;AAEjD,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,OAAO,EAAyB,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAItE,MAAM,MAAM,yBAAyB,GAAG;IACtC,QAAQ,EAAE,SAAS,CAAC;IACpB,oBAAoB,CAAC,EAAE,oBAAoB,CAAC;IAC5C,
|
|
1
|
+
{"version":3,"file":"OdysseyThemeProvider.d.ts","sourceRoot":"","sources":["../../src/OdysseyThemeProvider.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAMH,OAAO,EAAQ,SAAS,EAAW,MAAM,OAAO,CAAC;AAEjD,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,OAAO,EAAyB,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAItE,MAAM,MAAM,yBAAyB,GAAG;IACtC,QAAQ,EAAE,SAAS,CAAC;IACpB,oBAAoB,CAAC,EAAE,oBAAoB,CAAC;IAC5C,gBAAgB,CAAC,EAAE,cAAc,CAAC;IAClC,aAAa,CAAC,EAAE,YAAY,CAAC;CAC9B,CAAC;AAmCF,QAAA,MAAM,4BAA4B,6GA5B/B,yBAAyB,iBA4BmC,CAAC;AAEhE,OAAO,EAAE,4BAA4B,IAAI,oBAAoB,EAAE,CAAC"}
|