npm - @okta/odyssey-react-mui - Versions diffs - 1.43.0 → 1.44.0 - Mend

@okta/odyssey-react-mui 1.43.0 → 1.44.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1311) hide show

package/dist/esm/Fieldset.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Fieldset.js","names":["memo","useMemo","~~styled~~","~~FieldsetContext~~","Legend","Support","~~useOdysseyDesignTokens","~~useUniqueId","jsx","_jsx","jsxs","_jsxs","StyledFieldset","fieldset","odysseyDesignTokens","border","margin","Spacing0","marginBlockEnd","Spacing6","maxWidth","TypographyLineLengthMax","padding","Fieldset","alert","children","description","id","idOverride","isDisabled","legend","name","testId","translate","fieldsetContextValue","disabled","Provider","value","MemoizedFieldset","displayName"],"sources":["../../src/Fieldset.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\";\nimport ~~styled~~ from \"~~@emotion/styled~~\";\n\nimport { Callout } from \"./Callout.js\";\nimport { FieldsetContext } from \"./FieldsetContext.js\";\nimport ~~type~~ { ~~HtmlProps~~ } from \"./~~HtmlProps~~.js\";\nimport { Legend, Support } from \"./Typography.js\";\nimport {~~\n useOdysseyDesignTokens,\n DesignTokens,\n}~~ ~~from \"./OdysseyDesignTokensContext.js\";\nimport {~~ useUniqueId } from \"./useUniqueId.js\";\n\nconst StyledFieldset = styled.fieldset<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n border: \"0\",\n margin: odysseyDesignTokens.Spacing0,\n marginBlockEnd: odysseyDesignTokens.Spacing6,\n maxWidth: odysseyDesignTokens.TypographyLineLengthMax,\n padding: odysseyDesignTokens.Spacing0,\n\n \"&:last-child\": {\n marginBlockEnd: odysseyDesignTokens.Spacing0,\n },\n}));\n\nexport type FieldsetProps = {\n /\n A Callout indicating a Fieldset-wide error or status update.\n /\n alert?: ReactElement<typeof Callout>;\n /\n The Field components within the Fieldset\n /\n children: ReactElement \| Array<ReactElement>;\n /\n A supplementary description\n /\n description?: string;\n /\n Defines a unique identifier (ID) which must be unique in the whole document.\n /\n id?: string;\n /\n Disables the component and any wrapped input fields.\n /\n isDisabled?: boolean;\n /\n The title of the Fieldset\n /\n legend: string;\n /\n The name associated with the group.\n */\n name?: string;\n} & Pick<HtmlProps, \"testId\" \| \"translate\">;\n\nconst Fieldset = ({\n alert,\n children,\n description,\n id: idOverride,\n isDisabled = false,\n legend,\n name,\n testId,\n translate,\n}: FieldsetProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const id = useUniqueId(idOverride);\n\n const fieldsetContextValue = useMemo(\n () => ({\n isDisabled,\n }),\n [isDisabled],\n );\n\n return (\n <StyledFieldset\n data-se={testId}\n disabled={isDisabled}\n id={id}\n name={name}\n odysseyDesignTokens={odysseyDesignTokens}\n >\n <Legend translate={translate}>{legend}</Legend>\n\n {description && <Support translate={translate}>{description}</Support>}\n\n {alert}\n\n <FieldsetContext.Provider value={fieldsetContextValue}>\n {children}\n </FieldsetContext.Provider>\n </StyledFieldset>\n );\n};\n\nconst MemoizedFieldset = memo(Fieldset);\nMemoizedFieldset.displayName = \"Fieldset\";\n\nexport { MemoizedFieldset as Fieldset };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,~~SAASA~~,IAAI,EAAgBC,OAAO,QAAQ,OAAO;~~AACnD~~,~~OAAOC~~,~~MAAM~~,~~MAAM~~,~~iBAAiB~~;~~AAGpC~~,~~SAASC~~,~~eAAe~~,~~QAAQ~~,~~sBAAsB~~;~~AAEtD~~,SAASC,MAAM,EAAEC,OAAO,QAAQ,iBAAiB;AACjD,~~SACEC,sBAAsB,QAEjB,iCAAiC;AACxC,~~SAASC,WAAW,QAAQ,kBAAkB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAE/C,MAAMC,cAAc,~~GAAGV~~,MAAM,~~CAACW~~,QAAQ,CAEnC,CAAC;EAAEC;AAAoB,CAAC,MAAM;EAC/BC,MAAM,EAAE,GAAG;EACXC,MAAM,EAAEF,mBAAmB,CAACG,QAAQ;EACpCC,cAAc,EAAEJ,mBAAmB,CAACK,QAAQ;EAC5CC,QAAQ,EAAEN,mBAAmB,CAACO,uBAAuB;EACrDC,OAAO,EAAER,mBAAmB,CAACG,QAAQ;EAErC,cAAc,EAAE;IACdC,cAAc,EAAEJ,mBAAmB,CAACG;EACtC;AACF,CAAC,CAAC,CAAC;AAiCH,MAAMM,QAAQ,GAAGA,CAAC;EAChBC,KAAK;EACLC,QAAQ;EACRC,WAAW;EACXC,EAAE,EAAEC,UAAU;EACdC,UAAU,GAAG,KAAK;EAClBC,MAAM;EACNC,IAAI;EACJC,MAAM;EACNC;AACa,CAAC,KAAK;EACnB,MAAMnB,mBAAmB,~~GAAGR~~,sBAAsB,CAAC,CAAC;EACpD,~~MAAMqB~~,EAAE,GAAGpB,WAAW,CAACqB,UAAU,CAAC;EAElC,MAAMM,oBAAoB,~~GAAGjC~~,OAAO,CAClC,OAAO;~~IACL4B~~;EACF,CAAC,CAAC,EACF,CAACA,UAAU,CACb,CAAC;EAED,OACElB,KAAA,CAACC,cAAc;IACb,WAASoB,MAAO;IAChBG,QAAQ,EAAEN,UAAW;IACrBF,EAAE,EAAEA,EAAG;IACPI,IAAI,EAAEA,IAAK;IACXjB,mBAAmB,EAAEA,mBAAoB;IAAAW,QAAA,GAEzChB,IAAA,~~CAACL~~,MAAM;~~MAAC6B~~,SAAS,EAAEA,SAAU;MAAAR,QAAA,EAAEK;IAAM,CAAS,CAAC,EAE9CJ,WAAW,IAAIjB,IAAA,~~CAACJ~~,OAAO;~~MAAC4B~~,SAAS,EAAEA,SAAU;MAAAR,QAAA,EAAEC;IAAW,CAAU,CAAC,EAErEF,KAAK,EAENf,IAAA,CAACN,eAAe,CAACiC,QAAQ;MAACC,KAAK,EAAEH,oBAAqB;MAAAT,QAAA,EACnDA;IAAQ,CACe,CAAC;EAAA,CACb,CAAC;AAErB,CAAC;AAED,MAAMa,gBAAgB,~~GAAGtC~~,IAAI,~~CAACuB~~,QAAQ,CAAC;AACvCe,gBAAgB,CAACC,WAAW,GAAG,UAAU;AAEzC,SAASD,gBAAgB,IAAIf,QAAQ","ignoreList":[]}
1	+ {"version":3,"file":"Fieldset.js","names":["styled","memo","useMemo","FieldsetContext","useOdysseyDesignTokens","Legend","Support","useUniqueId","jsx","_jsx","jsxs","_jsxs","StyledFieldset","fieldset","odysseyDesignTokens","border","margin","Spacing0","marginBlockEnd","Spacing6","maxWidth","TypographyLineLengthMax","padding","Fieldset","alert","children","description","id","idOverride","isDisabled","legend","name","testId","translate","fieldsetContextValue","disabled","Provider","value","MemoizedFieldset","displayName"],"sources":["../../src/Fieldset.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 styled from \"@emotion/styled\";\nimport { memo, ReactElement, useMemo } from \"react\";\n\nimport type { HtmlProps } from \"./HtmlProps.js\";\n\nimport { Callout } from \"./Callout.js\";\nimport { FieldsetContext } from \"./FieldsetContext.js\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"./OdysseyDesignTokensContext.js\";\nimport { Legend, Support } from \"./Typography.js\";\nimport { useUniqueId } from \"./useUniqueId.js\";\n\nconst StyledFieldset = styled.fieldset<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n border: \"0\",\n margin: odysseyDesignTokens.Spacing0,\n marginBlockEnd: odysseyDesignTokens.Spacing6,\n maxWidth: odysseyDesignTokens.TypographyLineLengthMax,\n padding: odysseyDesignTokens.Spacing0,\n\n \"&:last-child\": {\n marginBlockEnd: odysseyDesignTokens.Spacing0,\n },\n}));\n\nexport type FieldsetProps = {\n /\n A Callout indicating a Fieldset-wide error or status update.\n /\n alert?: ReactElement<typeof Callout>;\n /\n The Field components within the Fieldset\n /\n children: ReactElement \| Array<ReactElement>;\n /\n A supplementary description\n /\n description?: string;\n /\n Defines a unique identifier (ID) which must be unique in the whole document.\n /\n id?: string;\n /\n Disables the component and any wrapped input fields.\n /\n isDisabled?: boolean;\n /\n The title of the Fieldset\n /\n legend: string;\n /\n The name associated with the group.\n */\n name?: string;\n} & Pick<HtmlProps, \"testId\" \| \"translate\">;\n\nconst Fieldset = ({\n alert,\n children,\n description,\n id: idOverride,\n isDisabled = false,\n legend,\n name,\n testId,\n translate,\n}: FieldsetProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const id = useUniqueId(idOverride);\n\n const fieldsetContextValue = useMemo(\n () => ({\n isDisabled,\n }),\n [isDisabled],\n );\n\n return (\n <StyledFieldset\n data-se={testId}\n disabled={isDisabled}\n id={id}\n name={name}\n odysseyDesignTokens={odysseyDesignTokens}\n >\n <Legend translate={translate}>{legend}</Legend>\n\n {description && <Support translate={translate}>{description}</Support>}\n\n {alert}\n\n <FieldsetContext.Provider value={fieldsetContextValue}>\n {children}\n </FieldsetContext.Provider>\n </StyledFieldset>\n );\n};\n\nconst MemoizedFieldset = memo(Fieldset);\nMemoizedFieldset.displayName = \"Fieldset\";\n\nexport { MemoizedFieldset as Fieldset };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAOA,MAAM,MAAM,iBAAiB;AACpC,SAASC,IAAI,EAAgBC,OAAO,QAAQ,OAAO;AAKnD,SAASC,eAAe,QAAQ,sBAAsB;AACtD,SAEEC,sBAAsB,QACjB,iCAAiC;AACxC,SAASC,MAAM,EAAEC,OAAO,QAAQ,iBAAiB;AACjD,SAASC,WAAW,QAAQ,kBAAkB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAE/C,MAAMC,cAAc,GAAGZ,MAAM,CAACa,QAAQ,CAEnC,CAAC;EAAEC;AAAoB,CAAC,MAAM;EAC/BC,MAAM,EAAE,GAAG;EACXC,MAAM,EAAEF,mBAAmB,CAACG,QAAQ;EACpCC,cAAc,EAAEJ,mBAAmB,CAACK,QAAQ;EAC5CC,QAAQ,EAAEN,mBAAmB,CAACO,uBAAuB;EACrDC,OAAO,EAAER,mBAAmB,CAACG,QAAQ;EAErC,cAAc,EAAE;IACdC,cAAc,EAAEJ,mBAAmB,CAACG;EACtC;AACF,CAAC,CAAC,CAAC;AAiCH,MAAMM,QAAQ,GAAGA,CAAC;EAChBC,KAAK;EACLC,QAAQ;EACRC,WAAW;EACXC,EAAE,EAAEC,UAAU;EACdC,UAAU,GAAG,KAAK;EAClBC,MAAM;EACNC,IAAI;EACJC,MAAM;EACNC;AACa,CAAC,KAAK;EACnB,MAAMnB,mBAAmB,GAAGV,sBAAsB,CAAC,CAAC;EACpD,MAAMuB,EAAE,GAAGpB,WAAW,CAACqB,UAAU,CAAC;EAElC,MAAMM,oBAAoB,GAAGhC,OAAO,CAClC,OAAO;IACL2B;EACF,CAAC,CAAC,EACF,CAACA,UAAU,CACb,CAAC;EAED,OACElB,KAAA,CAACC,cAAc;IACb,WAASoB,MAAO;IAChBG,QAAQ,EAAEN,UAAW;IACrBF,EAAE,EAAEA,EAAG;IACPI,IAAI,EAAEA,IAAK;IACXjB,mBAAmB,EAAEA,mBAAoB;IAAAW,QAAA,GAEzChB,IAAA,CAACJ,MAAM;MAAC4B,SAAS,EAAEA,SAAU;MAAAR,QAAA,EAAEK;IAAM,CAAS,CAAC,EAE9CJ,WAAW,IAAIjB,IAAA,CAACH,OAAO;MAAC2B,SAAS,EAAEA,SAAU;MAAAR,QAAA,EAAEC;IAAW,CAAU,CAAC,EAErEF,KAAK,EAENf,IAAA,CAACN,eAAe,CAACiC,QAAQ;MAACC,KAAK,EAAEH,oBAAqB;MAAAT,QAAA,EACnDA;IAAQ,CACe,CAAC;EAAA,CACb,CAAC;AAErB,CAAC;AAED,MAAMa,gBAAgB,GAAGrC,IAAI,CAACsB,QAAQ,CAAC;AACvCe,gBAAgB,CAACC,WAAW,GAAG,UAAU;AAEzC,SAASD,gBAAgB,IAAIf,QAAQ","ignoreList":[]}

package/dist/esm/FileUploader/FileUploadIllustration.js CHANGED Viewed

@@ -10,8 +10,8 @@
  * See the License for the specific language governing permissions and limitations under the License.
  */
-import { memo } from "react";
 import styled from "@emotion/styled";
+import { memo } from "react";
 import { useOdysseyDesignTokens } from "../OdysseyDesignTokensContext.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const UploadIllustrationContainer = styled.div(({
@@ -34,8 +34,8 @@ const FileUploadIllustration = () => {
     odysseyDesignTokens: odysseyDesignTokens,
     children: _jsxs("svg", {
       "aria-hidden": "true",
-      viewBox: "0 0 44 45",
       fill: "none",
+      viewBox: "0 0 44 45",
       xmlns: "http://www.w3.org/2000/svg",
       children: [_jsx("path", {
         d: "M32.0763 11.001C29.3564 3.7855 21.6595 -0.565827 13.7765 0.726748C5.35441 2.10773 -0.676662 9.50714 0.0603005 17.8612C0.441865 22.1865 2.56458 25.9787 5.71703 28.614L8.28246 25.545C5.90122 23.5544 4.32811 20.7209 4.04483 17.5097C3.50262 11.3633 7.94433 5.73648 14.4238 4.67404C20.9164 3.60944 27.0806 7.52016 28.6895 13.5191C28.9239 14.3932 29.7162 15.001 30.6212 15.001H32.9114C36.8985 15.001 39.9997 18.0938 39.9997 21.7505C39.9997 24.3423 38.4576 26.6352 36.1259 27.7678L37.8736 31.3658C41.4737 29.6171 43.9997 25.9917 43.9997 21.7505C43.9997 15.7428 38.963 11.001 32.9114 11.001H32.0763Z",

package/dist/esm/FileUploader/FileUploadIllustration.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FileUploadIllustration.js","names":["~~memo~~","~~styled~~","useOdysseyDesignTokens","jsx","_jsx","jsxs","_jsxs","UploadIllustrationContainer","div","odysseyDesignTokens","marginBlockEnd","Spacing3","padding","backgroundColor","HueNeutral50","borderRadius","svg","display","width","Spacing8","height","FileUploadIllustration","children","~~viewBox~~","~~fill~~","xmlns","d","HueNeutral200","MemoizedFileUploadIllustration","displayName"],"sources":["../../../src/FileUploader/FileUploadIllustration.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 }~~ from \"~~react~~\";\nimport ~~styled~~ from \"~~@emotion/styled~~\";\n\nimport {\n ~~useOdysseyDesignTokens~~,\n ~~DesignTokens~~,\n} from \"../OdysseyDesignTokensContext.js\";\n\nconst UploadIllustrationContainer = styled.div<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n marginBlockEnd: odysseyDesignTokens.Spacing3,\n padding: odysseyDesignTokens.Spacing3,\n backgroundColor: odysseyDesignTokens.HueNeutral50,\n borderRadius: \"50%\",\n\n svg: {\n display: \"flex\",\n width: odysseyDesignTokens.Spacing8,\n height: odysseyDesignTokens.Spacing8,\n },\n}));\n\nconst FileUploadIllustration = () => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n return (\n <UploadIllustrationContainer\n aria-hidden=\"true\"\n odysseyDesignTokens={odysseyDesignTokens}\n >\n <svg\n aria-hidden=\"true\"\n viewBox=\"0 0 44 45\"\n ~~fill=\"none\"\n~~ xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M32.0763 11.001C29.3564 3.7855 21.6595 -0.565827 13.7765 0.726748C5.35441 2.10773 -0.676662 9.50714 0.0603005 17.8612C0.441865 22.1865 2.56458 25.9787 5.71703 28.614L8.28246 25.545C5.90122 23.5544 4.32811 20.7209 4.04483 17.5097C3.50262 11.3633 7.94433 5.73648 14.4238 4.67404C20.9164 3.60944 27.0806 7.52016 28.6895 13.5191C28.9239 14.3932 29.7162 15.001 30.6212 15.001H32.9114C36.8985 15.001 39.9997 18.0938 39.9997 21.7505C39.9997 24.3423 38.4576 26.6352 36.1259 27.7678L37.8736 31.3658C41.4737 29.6171 43.9997 25.9917 43.9997 21.7505C43.9997 15.7428 38.963 11.001 32.9114 11.001H32.0763Z\"\n fill={odysseyDesignTokens.HueNeutral200}\n />\n <path\n d=\"M23.9994 29.3277V44.5H19.9994V29.3289L14.4142 34.9141L11.5858 32.0857L19.7373 23.9342C20.9869 22.6845 23.0131 22.6845 24.2627 23.9342L32.4142 32.0857L29.5858 34.9141L23.9994 29.3277Z\"\n fill={odysseyDesignTokens.HueNeutral200}\n />\n </svg>\n </UploadIllustrationContainer>\n );\n};\n\nconst MemoizedFileUploadIllustration = memo(FileUploadIllustration);\nMemoizedFileUploadIllustration.displayName = \"FileUploadIllustration\";\n\nexport { MemoizedFileUploadIllustration as FileUploadIllustration };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,~~SAASA~~,~~IAAI~~,~~QAAQ~~,~~OAAO~~;~~AAC5B~~,~~OAAOC~~,~~MAAM~~,~~MAAM~~,~~iBAAiB~~;~~AAEpC~~,~~SACEC~~,sBAAsB,~~QAEjB~~,kCAAkC;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAE1C,MAAMC,2BAA2B,~~GAAGN~~,MAAM,~~CAACO~~,GAAG,CAE3C,CAAC;EAAEC;AAAoB,CAAC,MAAM;EAC/BC,cAAc,EAAED,mBAAmB,CAACE,QAAQ;EAC5CC,OAAO,EAAEH,mBAAmB,CAACE,QAAQ;EACrCE,eAAe,EAAEJ,mBAAmB,CAACK,YAAY;EACjDC,YAAY,EAAE,KAAK;EAEnBC,GAAG,EAAE;IACHC,OAAO,EAAE,MAAM;IACfC,KAAK,EAAET,mBAAmB,CAACU,QAAQ;IACnCC,MAAM,EAAEX,mBAAmB,CAACU;EAC9B;AACF,CAAC,CAAC,CAAC;AAEH,MAAME,sBAAsB,GAAGA,CAAA,KAAM;EACnC,MAAMZ,mBAAmB,GAAGP,sBAAsB,CAAC,CAAC;EAEpD,OACEE,IAAA,CAACG,2BAA2B;IAC1B,eAAY,MAAM;IAClBE,mBAAmB,EAAEA,mBAAoB;IAAAa,QAAA,EAEzChB,KAAA;MACE,eAAY,MAAM;MAClBiB,~~OAAO~~,EAAC,~~WAAW~~;~~MACnBC~~,~~IAAI~~,EAAC,~~MAAM~~;~~MACXC~~,KAAK,EAAC,4BAA4B;MAAAH,QAAA,GAElClB,IAAA;QACEsB,CAAC,EAAC,ilBAAilB;~~QACnlBF~~,IAAI,~~EAAEf~~,mBAAmB,CAACkB;MAAc,CACzC,CAAC,EACFvB,IAAA;QACEsB,CAAC,EAAC,wLAAwL;~~QAC1LF~~,IAAI,~~EAAEf~~,mBAAmB,CAACkB;MAAc,CACzC,CAAC;IAAA,CACC;EAAC,CACqB,CAAC;AAElC,CAAC;AAED,MAAMC,8BAA8B,~~GAAG5B~~,IAAI,~~CAACqB~~,sBAAsB,CAAC;AACnEO,8BAA8B,CAACC,WAAW,GAAG,wBAAwB;AAErE,SAASD,8BAA8B,IAAIP,sBAAsB","ignoreList":[]}
1	+ {"version":3,"file":"FileUploadIllustration.js","names":["styled","memo","useOdysseyDesignTokens","jsx","_jsx","jsxs","_jsxs","UploadIllustrationContainer","div","odysseyDesignTokens","marginBlockEnd","Spacing3","padding","backgroundColor","HueNeutral50","borderRadius","svg","display","width","Spacing8","height","FileUploadIllustration","children","fill","viewBox","xmlns","d","HueNeutral200","MemoizedFileUploadIllustration","displayName"],"sources":["../../../src/FileUploader/FileUploadIllustration.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 styled from \"@emotion/styled\";\nimport { memo } from \"react\";\n\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../OdysseyDesignTokensContext.js\";\n\nconst UploadIllustrationContainer = styled.div<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n marginBlockEnd: odysseyDesignTokens.Spacing3,\n padding: odysseyDesignTokens.Spacing3,\n backgroundColor: odysseyDesignTokens.HueNeutral50,\n borderRadius: \"50%\",\n\n svg: {\n display: \"flex\",\n width: odysseyDesignTokens.Spacing8,\n height: odysseyDesignTokens.Spacing8,\n },\n}));\n\nconst FileUploadIllustration = () => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n return (\n <UploadIllustrationContainer\n aria-hidden=\"true\"\n odysseyDesignTokens={odysseyDesignTokens}\n >\n <svg\n aria-hidden=\"true\"\n fill=\"none\"\n viewBox=\"0 0 44 45\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M32.0763 11.001C29.3564 3.7855 21.6595 -0.565827 13.7765 0.726748C5.35441 2.10773 -0.676662 9.50714 0.0603005 17.8612C0.441865 22.1865 2.56458 25.9787 5.71703 28.614L8.28246 25.545C5.90122 23.5544 4.32811 20.7209 4.04483 17.5097C3.50262 11.3633 7.94433 5.73648 14.4238 4.67404C20.9164 3.60944 27.0806 7.52016 28.6895 13.5191C28.9239 14.3932 29.7162 15.001 30.6212 15.001H32.9114C36.8985 15.001 39.9997 18.0938 39.9997 21.7505C39.9997 24.3423 38.4576 26.6352 36.1259 27.7678L37.8736 31.3658C41.4737 29.6171 43.9997 25.9917 43.9997 21.7505C43.9997 15.7428 38.963 11.001 32.9114 11.001H32.0763Z\"\n fill={odysseyDesignTokens.HueNeutral200}\n />\n <path\n d=\"M23.9994 29.3277V44.5H19.9994V29.3289L14.4142 34.9141L11.5858 32.0857L19.7373 23.9342C20.9869 22.6845 23.0131 22.6845 24.2627 23.9342L32.4142 32.0857L29.5858 34.9141L23.9994 29.3277Z\"\n fill={odysseyDesignTokens.HueNeutral200}\n />\n </svg>\n </UploadIllustrationContainer>\n );\n};\n\nconst MemoizedFileUploadIllustration = memo(FileUploadIllustration);\nMemoizedFileUploadIllustration.displayName = \"FileUploadIllustration\";\n\nexport { MemoizedFileUploadIllustration as FileUploadIllustration };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAOA,MAAM,MAAM,iBAAiB;AACpC,SAASC,IAAI,QAAQ,OAAO;AAE5B,SAEEC,sBAAsB,QACjB,kCAAkC;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAE1C,MAAMC,2BAA2B,GAAGP,MAAM,CAACQ,GAAG,CAE3C,CAAC;EAAEC;AAAoB,CAAC,MAAM;EAC/BC,cAAc,EAAED,mBAAmB,CAACE,QAAQ;EAC5CC,OAAO,EAAEH,mBAAmB,CAACE,QAAQ;EACrCE,eAAe,EAAEJ,mBAAmB,CAACK,YAAY;EACjDC,YAAY,EAAE,KAAK;EAEnBC,GAAG,EAAE;IACHC,OAAO,EAAE,MAAM;IACfC,KAAK,EAAET,mBAAmB,CAACU,QAAQ;IACnCC,MAAM,EAAEX,mBAAmB,CAACU;EAC9B;AACF,CAAC,CAAC,CAAC;AAEH,MAAME,sBAAsB,GAAGA,CAAA,KAAM;EACnC,MAAMZ,mBAAmB,GAAGP,sBAAsB,CAAC,CAAC;EAEpD,OACEE,IAAA,CAACG,2BAA2B;IAC1B,eAAY,MAAM;IAClBE,mBAAmB,EAAEA,mBAAoB;IAAAa,QAAA,EAEzChB,KAAA;MACE,eAAY,MAAM;MAClBiB,IAAI,EAAC,MAAM;MACXC,OAAO,EAAC,WAAW;MACnBC,KAAK,EAAC,4BAA4B;MAAAH,QAAA,GAElClB,IAAA;QACEsB,CAAC,EAAC,ilBAAilB;QACnlBH,IAAI,EAAEd,mBAAmB,CAACkB;MAAc,CACzC,CAAC,EACFvB,IAAA;QACEsB,CAAC,EAAC,wLAAwL;QAC1LH,IAAI,EAAEd,mBAAmB,CAACkB;MAAc,CACzC,CAAC;IAAA,CACC;EAAC,CACqB,CAAC;AAElC,CAAC;AAED,MAAMC,8BAA8B,GAAG3B,IAAI,CAACoB,sBAAsB,CAAC;AACnEO,8BAA8B,CAACC,WAAW,GAAG,wBAAwB;AAErE,SAASD,8BAA8B,IAAIP,sBAAsB","ignoreList":[]}

package/dist/esm/FileUploader/FileUploadPreview.js CHANGED Viewed

@@ -11,12 +11,12 @@ import _IconButton from "@mui/material/IconButton";
  * See the License for the specific language governing permissions and limitations under the License.
  */
-import { memo, useCallback } from "react";
 import styled from "@emotion/styled";
+import { memo, useCallback } from "react";
 import { useTranslation } from "react-i18next";
-import { useOdysseyDesignTokens } from "../OdysseyDesignTokensContext.js";
 import { DeleteIcon } from "../icons.generated/index.js";
 import { MuiPropsContext } from "../MuiPropsContext.js";
+import { useOdysseyDesignTokens } from "../OdysseyDesignTokensContext.js";
 import { Tooltip } from "../Tooltip.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const PreviewContainer = styled.div(({
@@ -75,8 +75,8 @@ const UploadedFile = ({
     });
   }, [deleteHandler, t]);
   return _jsxs(UploadedFileContainer, {
-    tabIndex: 0,
     odysseyDesignTokens: odysseyDesignTokens,
+    tabIndex: 0,
     children: [name, _jsx(Tooltip, {
       ariaType: "description",
       placement: "top",
@@ -98,8 +98,8 @@ const FileUploadPreview = ({
     isDisabled: isDisabled,
     odysseyDesignTokens: odysseyDesignTokens,
     children: fileNames?.map((name, index) => _jsx(UploadedFile, {
-      onFileRemove: onFileRemove,
-      name: name
+      name: name,
+      onFileRemove: onFileRemove
     }, `${index}-${name}`))
   });
 };

package/dist/esm/FileUploader/FileUploadPreview.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FileUploadPreview.js","names":["~~memo~~","~~useCallback~~","~~styled~~","useTranslation","~~useOdysseyDesignTokens~~","~~DeleteIcon~~","~~MuiPropsContext~~","Tooltip","jsx","_jsx","jsxs","_jsxs","PreviewContainer","div","isDisabled","odysseyDesignTokens","color","TypographyColorDisabled","marginBlockStart","Spacing2","pointerEvents","UploadedFileContainer","display","justifyContent","alignItems","button","transform","padding","Spacing1","borderRadius","BorderRadiusMain","transition","TransitionTimingMain","backgroundColor","HueNeutral100","borderColor","FocusOutlineColorPrimary","boxShadow","outline","FocusOutlineWidthMain","FocusOutlineStyle","UploadedFile","name","onFileRemove","t","deleteHandler","renderDeleteButton","muiProps","_IconButton","onClick","size","children","tabIndex","ariaType","placement","text","Consumer","FileUploadPreview","fileNames","map","index","MemoizedFileUploadPreview","displayName"],"sources":["../../../src/FileUploader/FileUploadPreview.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 }~~ from \"~~react~~\";\nimport ~~styled~~ from \"@~~emotion~~/~~styled~~\";\nimport { ~~IconButton~~ } from \"~~@mui/material~~\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { ~~FileUploaderProps~~ } from \"~~./FileUploader~~.js\";\nimport {~~\n useOdysseyDesignTokens,\n DesignTokens,\n~~} from \"../~~OdysseyDesignTokensContext~~.js\";\nimport { ~~DeleteIcon~~ } from \"../~~icons~~.~~generated/index.~~js\";\nimport { ~~MuiPropsContext,~~ ~~MuiPropsContextType~~ } from \"../~~MuiPropsContext~~.js\";\nimport { ~~Tooltip~~ } from \"~~../Tooltip~~.js\";\n\nconst PreviewContainer = styled.div<{\n isDisabled: FileUploaderProps[\"isDisabled\"];\n odysseyDesignTokens: DesignTokens;\n}>(({ isDisabled, odysseyDesignTokens }) => ({\n color: isDisabled ? odysseyDesignTokens.TypographyColorDisabled : \"inherit\",\n marginBlockStart: odysseyDesignTokens.Spacing2,\n pointerEvents: isDisabled ? \"none\" : \"auto\",\n}));\n\nconst UploadedFileContainer = styled.div<{ odysseyDesignTokens: DesignTokens }>(\n {\n display: \"flex\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n\n button: {\n transform: \"scale(0)\",\n },\n\n \"&:hover, &:focus-within, &:focus\": {\n button: {\n transform: \"scale(1)\",\n },\n },\n },\n ({ odysseyDesignTokens }) => ({\n padding: `${odysseyDesignTokens.Spacing1} ${odysseyDesignTokens.Spacing2}`,\n borderRadius: odysseyDesignTokens.BorderRadiusMain,\n transition: `background-color ${odysseyDesignTokens.TransitionTimingMain}`,\n\n \"&:hover, &:focus-within\": {\n backgroundColor: odysseyDesignTokens.HueNeutral100,\n },\n\n \"&:focus\": {\n borderColor: odysseyDesignTokens.FocusOutlineColorPrimary,\n boxShadow: `0 0 0 2px ${odysseyDesignTokens.FocusOutlineColorPrimary}`,\n outline: `${odysseyDesignTokens.FocusOutlineWidthMain} ${odysseyDesignTokens.FocusOutlineStyle} transparent`,\n },\n }),\n);\n\ntype UploadedFileProps = {\n name: string;\n onFileRemove?: (name: string) => void;\n};\n\nconst UploadedFile = ({ name, onFileRemove }: UploadedFileProps) => {\n const { t } = useTranslation();\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n const deleteHandler = useCallback(() => {\n onFileRemove?.(name);\n }, [onFileRemove, name]);\n\n const renderDeleteButton = useCallback(\n (muiProps: MuiPropsContextType) => {\n return (\n <IconButton\n {...muiProps}\n aria-label={t(\"fileupload.removefile.text\")}\n onClick={deleteHandler}\n size=\"small\"\n >\n <DeleteIcon />\n </IconButton>\n );\n },\n [deleteHandler, t],\n );\n\n return (\n <UploadedFileContainer\n // tabindex added to make this element focusable\n tabIndex={0}\n ~~odysseyDesignTokens={odysseyDesignTokens}\n~~ >\n {name}\n <Tooltip\n ariaType=\"description\"\n placement=\"top\"\n text={t(\"fileupload.removefile.text\")}\n >\n <MuiPropsContext.Consumer>\n {renderDeleteButton}\n </MuiPropsContext.Consumer>\n </Tooltip>\n </UploadedFileContainer>\n );\n};\n\ntype FileUploadPreviewProps = {\n fileNames: string[];\n isDisabled: FileUploaderProps[\"isDisabled\"];\n onFileRemove?: (name: string) => void;\n};\n\nconst FileUploadPreview = ({\n fileNames,\n isDisabled,\n onFileRemove,\n}: FileUploadPreviewProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n return (\n <PreviewContainer\n data-file-preview-container=\"true\"\n isDisabled={isDisabled}\n odysseyDesignTokens={odysseyDesignTokens}\n >\n {fileNames?.map((name, index) => (\n <UploadedFile\n key={`${index}-${name}`}\n ~~onFileRemove~~={~~onFileRemove~~}\n ~~name~~={~~name~~}\n />\n ))}\n </PreviewContainer>\n );\n};\n\nconst MemoizedFileUploadPreview = memo(FileUploadPreview);\nMemoizedFileUploadPreview.displayName = \"FileUploadPreview\";\n\nexport { MemoizedFileUploadPreview as FileUploadPreview };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,~~SAASA~~,IAAI,EAAEC,WAAW,QAAQ,OAAO;AACzC,~~OAAOC,MAAM,MAAM,iBAAiB;AAEpC,~~SAASC,cAAc,QAAQ,eAAe;~~AAG9C~~,~~SACEC,sBAAsB,QAEjB,kCAAkC;AACzC,~~SAASC,UAAU,QAAQ,6BAA6B;AACxD,SAASC,eAAe,QAA6B,uBAAuB;AAC5E,SAASC,OAAO,QAAQ,eAAe;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;~~AAExC~~,MAAMC,gBAAgB,~~GAAGV~~,MAAM,~~CAACW~~,GAAG,CAGhC,CAAC;EAAEC,UAAU;EAAEC;AAAoB,CAAC,MAAM;EAC3CC,KAAK,EAAEF,UAAU,GAAGC,mBAAmB,CAACE,uBAAuB,GAAG,SAAS;EAC3EC,gBAAgB,EAAEH,mBAAmB,CAACI,QAAQ;EAC9CC,aAAa,EAAEN,UAAU,GAAG,MAAM,GAAG;AACvC,CAAC,CAAC,CAAC;AAEH,MAAMO,qBAAqB,~~GAAGnB~~,MAAM,~~CAACW~~,GAAG,CACtC;EACES,OAAO,EAAE,MAAM;EACfC,cAAc,EAAE,eAAe;EAC/BC,UAAU,EAAE,QAAQ;EAEpBC,MAAM,EAAE;IACNC,SAAS,EAAE;EACb,CAAC;EAED,kCAAkC,EAAE;IAClCD,MAAM,EAAE;MACNC,SAAS,EAAE;IACb;EACF;AACF,CAAC,EACD,CAAC;EAAEX;AAAoB,CAAC,MAAM;EAC5BY,OAAO,EAAE,GAAGZ,mBAAmB,CAACa,QAAQ,IAAIb,mBAAmB,CAACI,QAAQ,EAAE;EAC1EU,YAAY,EAAEd,mBAAmB,CAACe,gBAAgB;EAClDC,UAAU,EAAE,oBAAoBhB,mBAAmB,CAACiB,oBAAoB,EAAE;EAE1E,yBAAyB,EAAE;IACzBC,eAAe,EAAElB,mBAAmB,CAACmB;EACvC,CAAC;EAED,SAAS,EAAE;IACTC,WAAW,EAAEpB,mBAAmB,CAACqB,wBAAwB;IACzDC,SAAS,EAAE,aAAatB,mBAAmB,CAACqB,wBAAwB,EAAE;IACtEE,OAAO,EAAE,GAAGvB,mBAAmB,CAACwB,qBAAqB,IAAIxB,mBAAmB,CAACyB,iBAAiB;EAChG;AACF,CAAC,CACH,CAAC;AAOD,MAAMC,YAAY,GAAGA,CAAC;EAAEC,IAAI;EAAEC;AAAgC,CAAC,KAAK;EAClE,MAAM;IAAEC;EAAE,CAAC,GAAGzC,cAAc,CAAC,CAAC;EAC9B,MAAMY,mBAAmB,~~GAAGX~~,sBAAsB,CAAC,CAAC;EAEpD,~~MAAMyC~~,aAAa,~~GAAG5C~~,WAAW,CAAC,MAAM;~~IACtC0C~~,YAAY,GAAGD,IAAI,CAAC;EACtB,CAAC,EAAE,CAACC,YAAY,EAAED,IAAI,CAAC,CAAC;EAExB,MAAMI,kBAAkB,~~GAAG7C~~,WAAW,~~CACnC8C~~,QAA6B,IAAK;IACjC,OACEtC,IAAA,CAAAuC,WAAA;MAAA,GACMD,QAAQ;MACZ,cAAYH,CAAC,CAAC,4BAA4B,CAAE;MAC5CK,OAAO,EAAEJ,aAAc;MACvBK,IAAI,EAAC,OAAO;MAAAC,QAAA,EAEZ1C,IAAA,~~CAACJ~~,UAAU,IAAE;IAAC,CACJ,CAAC;EAEjB,CAAC,EACD,~~CAACwC~~,aAAa,EAAED,CAAC,CACnB,CAAC;EAED,OACEjC,KAAA,CAACU,qBAAqB;~~IAEpB+B~~,~~QAAQ~~,~~EAAE~~,~~CAAE~~;~~IACZrC~~,~~mBAAmB~~,~~EAAEA~~,~~mBAAoB~~;~~IAAAoC~~,QAAA,~~GAExCT~~,IAAI,EACLjC,IAAA,CAACF,OAAO;MACN8C,QAAQ,EAAC,aAAa;MACtBC,SAAS,EAAC,KAAK;MACfC,IAAI,EAAEX,CAAC,CAAC,4BAA4B,CAAE;MAAAO,QAAA,EAEtC1C,IAAA,~~CAACH~~,eAAe,~~CAACkD~~,QAAQ;QAAAL,QAAA,EACtBL;MAAkB,CACK;IAAC,CACpB,CAAC;EAAA,CACW,CAAC;AAE5B,CAAC;AAQD,MAAMW,iBAAiB,GAAGA,CAAC;EACzBC,SAAS;EACT5C,UAAU;EACV6B;AACsB,CAAC,KAAK;EAC5B,MAAM5B,mBAAmB,~~GAAGX~~,sBAAsB,CAAC,CAAC;EAEpD,~~OACEK~~,IAAA,CAACG,gBAAgB;IACf,+BAA4B,MAAM;IAClCE,UAAU,EAAEA,UAAW;IACvBC,mBAAmB,EAAEA,mBAAoB;IAAAoC,QAAA,EAExCO,SAAS,EAAEC,GAAG,CAAC,CAACjB,IAAI,EAAEkB,KAAK,KAC1BnD,IAAA,CAACgC,YAAY;~~MAEXE~~,~~YAAY~~,EAAEA,~~YAAa~~;~~MAC3BD~~,~~IAAI~~,EAAEA;~~IAAK~~,~~GAFN~~,~~GAAGkB~~,KAAK,IAAIlB,IAAI,EAGtB,CACF;EAAC,CACc,CAAC;AAEvB,CAAC;AAED,MAAMmB,yBAAyB,~~GAAG7D~~,IAAI,~~CAACyD~~,iBAAiB,CAAC;AACzDI,yBAAyB,CAACC,WAAW,GAAG,mBAAmB;AAE3D,SAASD,yBAAyB,IAAIJ,iBAAiB","ignoreList":[]}
1	+ {"version":3,"file":"FileUploadPreview.js","names":["styled","memo","useCallback","useTranslation","DeleteIcon","MuiPropsContext","useOdysseyDesignTokens","Tooltip","jsx","_jsx","jsxs","_jsxs","PreviewContainer","div","isDisabled","odysseyDesignTokens","color","TypographyColorDisabled","marginBlockStart","Spacing2","pointerEvents","UploadedFileContainer","display","justifyContent","alignItems","button","transform","padding","Spacing1","borderRadius","BorderRadiusMain","transition","TransitionTimingMain","backgroundColor","HueNeutral100","borderColor","FocusOutlineColorPrimary","boxShadow","outline","FocusOutlineWidthMain","FocusOutlineStyle","UploadedFile","name","onFileRemove","t","deleteHandler","renderDeleteButton","muiProps","_IconButton","onClick","size","children","tabIndex","ariaType","placement","text","Consumer","FileUploadPreview","fileNames","map","index","MemoizedFileUploadPreview","displayName"],"sources":["../../../src/FileUploader/FileUploadPreview.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 styled from \"@emotion/styled\";\nimport { IconButton } from \"@mui/material\";\nimport { memo, useCallback } from \"react\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { DeleteIcon } from \"../icons.generated/index.js\";\nimport { MuiPropsContext, MuiPropsContextType } from \"../MuiPropsContext.js\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../OdysseyDesignTokensContext.js\";\nimport { Tooltip } from \"../Tooltip.js\";\nimport { FileUploaderProps } from \"./FileUploader.js\";\n\nconst PreviewContainer = styled.div<{\n isDisabled: FileUploaderProps[\"isDisabled\"];\n odysseyDesignTokens: DesignTokens;\n}>(({ isDisabled, odysseyDesignTokens }) => ({\n color: isDisabled ? odysseyDesignTokens.TypographyColorDisabled : \"inherit\",\n marginBlockStart: odysseyDesignTokens.Spacing2,\n pointerEvents: isDisabled ? \"none\" : \"auto\",\n}));\n\nconst UploadedFileContainer = styled.div<{ odysseyDesignTokens: DesignTokens }>(\n {\n display: \"flex\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n\n button: {\n transform: \"scale(0)\",\n },\n\n \"&:hover, &:focus-within, &:focus\": {\n button: {\n transform: \"scale(1)\",\n },\n },\n },\n ({ odysseyDesignTokens }) => ({\n padding: `${odysseyDesignTokens.Spacing1} ${odysseyDesignTokens.Spacing2}`,\n borderRadius: odysseyDesignTokens.BorderRadiusMain,\n transition: `background-color ${odysseyDesignTokens.TransitionTimingMain}`,\n\n \"&:hover, &:focus-within\": {\n backgroundColor: odysseyDesignTokens.HueNeutral100,\n },\n\n \"&:focus\": {\n borderColor: odysseyDesignTokens.FocusOutlineColorPrimary,\n boxShadow: `0 0 0 2px ${odysseyDesignTokens.FocusOutlineColorPrimary}`,\n outline: `${odysseyDesignTokens.FocusOutlineWidthMain} ${odysseyDesignTokens.FocusOutlineStyle} transparent`,\n },\n }),\n);\n\ntype UploadedFileProps = {\n name: string;\n onFileRemove?: (name: string) => void;\n};\n\nconst UploadedFile = ({ name, onFileRemove }: UploadedFileProps) => {\n const { t } = useTranslation();\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n const deleteHandler = useCallback(() => {\n onFileRemove?.(name);\n }, [onFileRemove, name]);\n\n const renderDeleteButton = useCallback(\n (muiProps: MuiPropsContextType) => {\n return (\n <IconButton\n {...muiProps}\n aria-label={t(\"fileupload.removefile.text\")}\n onClick={deleteHandler}\n size=\"small\"\n >\n <DeleteIcon />\n </IconButton>\n );\n },\n [deleteHandler, t],\n );\n\n return (\n <UploadedFileContainer\n odysseyDesignTokens={odysseyDesignTokens}\n // tabindex added to make this element focusable\n tabIndex={0}\n >\n {name}\n <Tooltip\n ariaType=\"description\"\n placement=\"top\"\n text={t(\"fileupload.removefile.text\")}\n >\n <MuiPropsContext.Consumer>\n {renderDeleteButton}\n </MuiPropsContext.Consumer>\n </Tooltip>\n </UploadedFileContainer>\n );\n};\n\ntype FileUploadPreviewProps = {\n fileNames: string[];\n isDisabled: FileUploaderProps[\"isDisabled\"];\n onFileRemove?: (name: string) => void;\n};\n\nconst FileUploadPreview = ({\n fileNames,\n isDisabled,\n onFileRemove,\n}: FileUploadPreviewProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n return (\n <PreviewContainer\n data-file-preview-container=\"true\"\n isDisabled={isDisabled}\n odysseyDesignTokens={odysseyDesignTokens}\n >\n {fileNames?.map((name, index) => (\n <UploadedFile\n key={`${index}-${name}`}\n name={name}\n onFileRemove={onFileRemove}\n />\n ))}\n </PreviewContainer>\n );\n};\n\nconst MemoizedFileUploadPreview = memo(FileUploadPreview);\nMemoizedFileUploadPreview.displayName = \"FileUploadPreview\";\n\nexport { MemoizedFileUploadPreview as FileUploadPreview };\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/FileUploader/FileUploader.js CHANGED Viewed

@@ -10,16 +10,16 @@
  * See the License for the specific language governing permissions and limitations under the License.
  */
-import { memo, useCallback, useEffect, useRef, useState } from "react";
 import styled from "@emotion/styled";
+import { memo, useCallback, useEffect, useRef, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { Button } from "../Buttons/index.js";
-import { UploadIcon } from "../icons.generated/index.js";
 import { Field } from "../Field.js";
-import { FileUploadPreview } from "./FileUploadPreview.js";
-import { FileUploadIllustration } from "./FileUploadIllustration.js";
+import { UploadIcon } from "../icons.generated/index.js";
 import { useOdysseyDesignTokens } from "../OdysseyDesignTokensContext.js";
 import { Support } from "../Typography.js";
+import { FileUploadIllustration } from "./FileUploadIllustration.js";
+import { FileUploadPreview } from "./FileUploadPreview.js";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 export const fileUploadTypes = ["single", "multiple"];
 export const fileUploadVariants = ["button", "dragAndDrop", "dragAndDropWithIcon"];
@@ -185,8 +185,8 @@ const FileUploader = ({
       renderFieldComponent: renderFileInput
     }), filesToUpload.length > 0 && _jsx(FileUploadPreview, {
       fileNames: filesToUpload.map(file => file.name),
-      onFileRemove: removeFileFromFilesToUploadList,
-      isDisabled: isDisabled
+      isDisabled: isDisabled,
+      onFileRemove: removeFileFromFilesToUploadList
     })]
   });
 };

package/dist/esm/FileUploader/FileUploader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FileUploader.js","names":["memo","useCallback","useEffect","useRef","useState","styled","useTranslation","Button","UploadIcon","Field","FileUploadPreview","FileUploadIllustration","useOdysseyDesignTokens","Support","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","fileUploadTypes","fileUploadVariants","BaseInputWrapper","div","position","alignSelf","input","width","height","opacity","InputContainer","display","alignItems","justifyContent","borderStyle","hasError","odysseyDesignTokens","padding","Spacing6","Spacing3","border","PaletteDangerMain","HueNeutral300","borderRadius","BorderRadiusMain","transition","TransitionTimingMain","borderColor","HueNeutral700","FocusOutlineColorPrimary","boxShadow","outline","FocusOutlineWidthMain","FocusOutlineStyle","outlineOffset","FocusOutlineOffsetTight","backgroundColor","HueNeutral50","BorderColorDisabled","color","TypographyColorDisabled","ButtonAndInfoContainer","flexDirection","CenterAlignedSupportText","textAlign","FileUploader","acceptedFileTypes","errorMessage","id","isDisabled","isFullWidth","isOptional","hint","HintLinkComponent","label","onChange","type","variant","t","inputRef","filesToUpload","setFilesToUpload","updateFilesToUpload","event","files","target","length","mergedFiles","concat","Array","from","slice","value","triggerFileInputClick","current","click","removeFileFromFilesToUploadList","name","deletedFileFilteredOut","filter","file","renderFileInput","ariaDescribedBy","errorMessageElementId","labelElementId","acceptedFileTypesAsString","join","Input","accept","disabled","multiple","ref","title","children","onClick","startIcon","Boolean","fieldType","hasVisibleLabel","renderFieldComponent","fileNames","map","onFileRemove","MemoizedFileUploader","displayName","FileUpload"],"sources":["../../../src/FileUploader/FileUploader.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 memo,\n ChangeEvent,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport styled from \"@emotion/styled\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { Button } from \"../Buttons/index.js\";\nimport { UploadIcon } from \"../icons.generated/index.js\";\nimport { Field, RenderFieldComponentProps } from \"../Field.js\";\nimport { FieldComponentProps } from \"../FieldComponentProps.js\";\nimport { FileUploadPreview } from \"./FileUploadPreview.js\";\nimport { FileUploadIllustration } from \"./FileUploadIllustration.js\";\nimport {\n useOdysseyDesignTokens,\n DesignTokens,\n} from \"../OdysseyDesignTokensContext.js\";\nimport { Support } from \"../Typography.js\";\n\nexport const fileUploadTypes = [\"single\", \"multiple\"] as const;\nexport const fileUploadVariants = [\n \"button\",\n \"dragAndDrop\",\n \"dragAndDropWithIcon\",\n] as const;\n\nconst BaseInputWrapper = styled.div({\n position: \"relative\",\n alignSelf: \"flex-start\",\n\n input: {\n position: \"absolute\",\n width: \"100%\",\n height: \"100%\",\n opacity: 0,\n },\n});\n\nconst InputContainer = styled(BaseInputWrapper)<{\n odysseyDesignTokens: DesignTokens;\n hasError: boolean;\n}>(\n {\n display: \"flex\",\n alignSelf: \"unset\",\n alignItems: \"center\",\n justifyContent: \"center\",\n\n \"&:has(input:focus)\": {\n borderStyle: \"solid\",\n },\n },\n ({ hasError, odysseyDesignTokens }) => ({\n padding: `${odysseyDesignTokens.Spacing6} ${odysseyDesignTokens.Spacing3}`,\n border: hasError\n ? `1px solid ${odysseyDesignTokens.PaletteDangerMain}`\n : `1px dashed ${odysseyDesignTokens.HueNeutral300}`,\n borderRadius: odysseyDesignTokens.BorderRadiusMain,\n transition: `border-color ${odysseyDesignTokens.TransitionTimingMain}, box-shadow ${odysseyDesignTokens.TransitionTimingMain}`,\n\n \"&:hover\": {\n borderColor: odysseyDesignTokens.HueNeutral700,\n },\n\n \"&:has(input:focus)\": {\n borderColor: odysseyDesignTokens.FocusOutlineColorPrimary,\n boxShadow: `0 0 0 1px ${odysseyDesignTokens.FocusOutlineColorPrimary}`,\n outline: `${odysseyDesignTokens.FocusOutlineWidthMain} ${odysseyDesignTokens.FocusOutlineStyle} transparent`,\n outlineOffset: odysseyDesignTokens.FocusOutlineOffsetTight,\n },\n\n \"&:has(input:disabled)\": {\n backgroundColor: odysseyDesignTokens.HueNeutral50,\n border: `1px solid ${odysseyDesignTokens.BorderColorDisabled}`,\n color: odysseyDesignTokens.TypographyColorDisabled,\n\n \"&:hover\": {\n borderColor: odysseyDesignTokens.BorderColorDisabled,\n },\n },\n }),\n);\n\nconst ButtonAndInfoContainer = styled.div({\n display: \"flex\",\n flexDirection: \"column\",\n alignItems: \"center\",\n justifyContent: \"center\",\n});\n\nconst CenterAlignedSupportText = styled.div({\n textAlign: \"center\",\n});\n\nexport type FileUploaderProps = {\n /\n an array of file types the user is able to upload. @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept#unique_file_type_specifiers for examples\n /\n acceptedFileTypes?: string[];\n /\n The label for the `input` element.\n /\n label: string;\n /\n Function that is called when the list of ifles to upload is changed\n /\n onChange: (files: File[]) => void;\n /\n Either `single` or `multiple`. If `multiple`, multiple files can be uploaded\n /\n type?: (typeof fileUploadTypes)[number];\n /\n Either `button`, `dragAndDrop` or `dragAndDropWithIcon`. Will determine how component appears visually\n */\n variant: (typeof fileUploadVariants)[number];\n} & Pick<\n FieldComponentProps,\n \| \"errorMessage\"\n \| \"hint\"\n \| \"HintLinkComponent\"\n \| \"id\"\n \| \"isDisabled\"\n \| \"isFullWidth\"\n \| \"isOptional\"\n>;\n\nconst FileUploader = ({\n acceptedFileTypes,\n errorMessage,\n id,\n isDisabled = false,\n isFullWidth,\n isOptional,\n hint,\n HintLinkComponent,\n label,\n onChange,\n type,\n variant,\n}: FileUploaderProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const { t } = useTranslation();\n const inputRef = useRef<HTMLInputElement>(null);\n const [filesToUpload, setFilesToUpload] = useState<File[]>([]);\n\n useEffect(() => {\n onChange(filesToUpload);\n }, [filesToUpload, onChange]);\n\n const updateFilesToUpload = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n const { files } = event.target;\n\n if (files && files.length > 0) {\n const mergedFiles =\n type === \"multiple\"\n ? filesToUpload.concat(Array.from(files))\n : Array.from(files).slice();\n\n setFilesToUpload(mergedFiles);\n }\n\n // reset input value to allow re-upload of a file with the same name\n event.target.value = \"\";\n },\n [type, filesToUpload],\n );\n\n const triggerFileInputClick = useCallback(() => {\n inputRef.current?.click();\n }, [inputRef]);\n\n const removeFileFromFilesToUploadList = useCallback<(name: string) => void>(\n (name) => {\n const deletedFileFilteredOut = filesToUpload.filter(\n (file) => file.name !== name,\n );\n setFilesToUpload(deletedFileFilteredOut);\n },\n [filesToUpload],\n );\n\n const renderFileInput = useCallback(\n ({\n ariaDescribedBy,\n errorMessageElementId,\n id,\n labelElementId,\n }: RenderFieldComponentProps) => {\n const acceptedFileTypesAsString = acceptedFileTypes?.join(\",\");\n\n const Input = () => (\n <input\n accept={acceptedFileTypesAsString}\n aria-describedby={ariaDescribedBy}\n aria-errormessage={errorMessageElementId}\n aria-labelledby={labelElementId}\n disabled={isDisabled}\n id={id}\n multiple={type === \"multiple\"}\n onChange={updateFilesToUpload}\n ref={inputRef}\n title=\"\"\n type=\"file\"\n />\n );\n\n if (variant === \"button\") {\n return (\n <>\n <BaseInputWrapper>\n <Input />\n <Button\n isDisabled={isDisabled}\n label={t(\"fileupload.button.text\")}\n onClick={triggerFileInputClick}\n startIcon={<UploadIcon />}\n variant=\"secondary\"\n />\n </BaseInputWrapper>\n </>\n );\n }\n\n return (\n <>\n <InputContainer\n hasError={Boolean(errorMessage)}\n odysseyDesignTokens={odysseyDesignTokens}\n >\n <Input />\n <ButtonAndInfoContainer>\n {variant === \"dragAndDropWithIcon\" && <FileUploadIllustration />}\n <CenterAlignedSupportText>\n <Support color=\"textSecondary\">\n {t(\"fileupload.prompt.text\")}\n </Support>\n </CenterAlignedSupportText>\n <Button\n isDisabled={isDisabled}\n label={t(\"fileupload.button.text\")}\n onClick={triggerFileInputClick}\n startIcon={<UploadIcon />}\n variant=\"secondary\"\n />\n </ButtonAndInfoContainer>\n </InputContainer>\n </>\n );\n },\n [\n acceptedFileTypes,\n errorMessage,\n isDisabled,\n inputRef,\n odysseyDesignTokens,\n triggerFileInputClick,\n t,\n type,\n updateFilesToUpload,\n variant,\n ],\n );\n\n return (\n <>\n <Field\n errorMessage={errorMessage}\n fieldType=\"single\"\n hasVisibleLabel\n hint={hint}\n HintLinkComponent={HintLinkComponent}\n id={id}\n isDisabled={isDisabled}\n isFullWidth={isFullWidth && variant !== \"button\"}\n isOptional={isOptional}\n label={label}\n renderFieldComponent={renderFileInput}\n />\n {filesToUpload.length > 0 && (\n <FileUploadPreview\n fileNames={filesToUpload.map((file) => file.name)}\n onFileRemove={removeFileFromFilesToUploadList}\n isDisabled={isDisabled}\n />\n )}\n </>\n );\n};\n\nconst MemoizedFileUploader = memo(FileUploader);\nMemoizedFileUploader.displayName = \"FileUploader\";\n\nexport { MemoizedFileUploader as FileUpload };\nexport { MemoizedFileUploader as FileUploader };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SACEA,IAAI,EAEJC,WAAW,EACXC,SAAS,EACTC,MAAM,EACNC,QAAQ,QACH,OAAO;AACd,OAAOC,MAAM,MAAM,iBAAiB;AACpC,SAASC,cAAc,QAAQ,eAAe;AAE9C,SAASC,MAAM,QAAQ,qBAAqB;AAC5C,SAASC,UAAU,QAAQ,6BAA6B;AACxD,SAASC,KAAK,QAAmC,aAAa;AAE9D,SAASC,iBAAiB,QAAQ,wBAAwB;AAC1D,SAASC,sBAAsB,QAAQ,6BAA6B;AACpE,SACEC,sBAAsB,QAEjB,kCAAkC;AACzC,SAASC,OAAO,QAAQ,kBAAkB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA,EAAAC,QAAA,IAAAC,SAAA;AAE3C,OAAO,MAAMC,eAAe,GAAG,CAAC,QAAQ,EAAE,UAAU,CAAU;AAC9D,OAAO,MAAMC,kBAAkB,GAAG,CAChC,QAAQ,EACR,aAAa,EACb,qBAAqB,CACb;AAEV,MAAMC,gBAAgB,GAAGjB,MAAM,CAACkB,GAAG,CAAC;EAClCC,QAAQ,EAAE,UAAU;EACpBC,SAAS,EAAE,YAAY;EAEvBC,KAAK,EAAE;IACLF,QAAQ,EAAE,UAAU;IACpBG,KAAK,EAAE,MAAM;IACbC,MAAM,EAAE,MAAM;IACdC,OAAO,EAAE;EACX;AACF,CAAC,CAAC;AAEF,MAAMC,cAAc,GAAGzB,MAAM,CAACiB,gBAAgB,CAAC,CAI7C;EACES,OAAO,EAAE,MAAM;EACfN,SAAS,EAAE,OAAO;EAClBO,UAAU,EAAE,QAAQ;EACpBC,cAAc,EAAE,QAAQ;EAExB,oBAAoB,EAAE;IACpBC,WAAW,EAAE;EACf;AACF,CAAC,EACD,CAAC;EAAEC,QAAQ;EAAEC;AAAoB,CAAC,MAAM;EACtCC,OAAO,EAAE,GAAGD,mBAAmB,CAACE,QAAQ,IAAIF,mBAAmB,CAACG,QAAQ,EAAE;EAC1EC,MAAM,EAAEL,QAAQ,GACZ,aAAaC,mBAAmB,CAACK,iBAAiB,EAAE,GACpD,cAAcL,mBAAmB,CAACM,aAAa,EAAE;EACrDC,YAAY,EAAEP,mBAAmB,CAACQ,gBAAgB;EAClDC,UAAU,EAAE,gBAAgBT,mBAAmB,CAACU,oBAAoB,gBAAgBV,mBAAmB,CAACU,oBAAoB,EAAE;EAE9H,SAAS,EAAE;IACTC,WAAW,EAAEX,mBAAmB,CAACY;EACnC,CAAC;EAED,oBAAoB,EAAE;IACpBD,WAAW,EAAEX,mBAAmB,CAACa,wBAAwB;IACzDC,SAAS,EAAE,aAAad,mBAAmB,CAACa,wBAAwB,EAAE;IACtEE,OAAO,EAAE,GAAGf,mBAAmB,CAACgB,qBAAqB,IAAIhB,mBAAmB,CAACiB,iBAAiB,cAAc;IAC5GC,aAAa,EAAElB,mBAAmB,CAACmB;EACrC,CAAC;EAED,uBAAuB,EAAE;IACvBC,eAAe,EAAEpB,mBAAmB,CAACqB,YAAY;IACjDjB,MAAM,EAAE,aAAaJ,mBAAmB,CAACsB,mBAAmB,EAAE;IAC9DC,KAAK,EAAEvB,mBAAmB,CAACwB,uBAAuB;IAElD,SAAS,EAAE;MACTb,WAAW,EAAEX,mBAAmB,CAACsB;IACnC;EACF;AACF,CAAC,CACH,CAAC;AAED,MAAMG,sBAAsB,GAAGxD,MAAM,CAACkB,GAAG,CAAC;EACxCQ,OAAO,EAAE,MAAM;EACf+B,aAAa,EAAE,QAAQ;EACvB9B,UAAU,EAAE,QAAQ;EACpBC,cAAc,EAAE;AAClB,CAAC,CAAC;AAEF,MAAM8B,wBAAwB,GAAG1D,MAAM,CAACkB,GAAG,CAAC;EAC1CyC,SAAS,EAAE;AACb,CAAC,CAAC;AAkCF,MAAMC,YAAY,GAAGA,CAAC;EACpBC,iBAAiB;EACjBC,YAAY;EACZC,EAAE;EACFC,UAAU,GAAG,KAAK;EAClBC,WAAW;EACXC,UAAU;EACVC,IAAI;EACJC,iBAAiB;EACjBC,KAAK;EACLC,QAAQ;EACRC,IAAI;EACJC;AACiB,CAAC,KAAK;EACvB,MAAMzC,mBAAmB,GAAGxB,sBAAsB,CAAC,CAAC;EACpD,MAAM;IAAEkE;EAAE,CAAC,GAAGxE,cAAc,CAAC,CAAC;EAC9B,MAAMyE,QAAQ,GAAG5E,MAAM,CAAmB,IAAI,CAAC;EAC/C,MAAM,CAAC6E,aAAa,EAAEC,gBAAgB,CAAC,GAAG7E,QAAQ,CAAS,EAAE,CAAC;EAE9DF,SAAS,CAAC,MAAM;IACdyE,QAAQ,CAACK,aAAa,CAAC;EACzB,CAAC,EAAE,CAACA,aAAa,EAAEL,QAAQ,CAAC,CAAC;EAE7B,MAAMO,mBAAmB,GAAGjF,WAAW,CACpCkF,KAAoC,IAAK;IACxC,MAAM;MAAEC;IAAM,CAAC,GAAGD,KAAK,CAACE,MAAM;IAE9B,IAAID,KAAK,IAAIA,KAAK,CAACE,MAAM,GAAG,CAAC,EAAE;MAC7B,MAAMC,WAAW,GACfX,IAAI,KAAK,UAAU,GACfI,aAAa,CAACQ,MAAM,CAACC,KAAK,CAACC,IAAI,CAACN,KAAK,CAAC,CAAC,GACvCK,KAAK,CAACC,IAAI,CAACN,KAAK,CAAC,CAACO,KAAK,CAAC,CAAC;MAE/BV,gBAAgB,CAACM,WAAW,CAAC;IAC/B;IAGAJ,KAAK,CAACE,MAAM,CAACO,KAAK,GAAG,EAAE;EACzB,CAAC,EACD,CAAChB,IAAI,EAAEI,aAAa,CACtB,CAAC;EAED,MAAMa,qBAAqB,GAAG5F,WAAW,CAAC,MAAM;IAC9C8E,QAAQ,CAACe,OAAO,EAAEC,KAAK,CAAC,CAAC;EAC3B,CAAC,EAAE,CAAChB,QAAQ,CAAC,CAAC;EAEd,MAAMiB,+BAA+B,GAAG/F,WAAW,CAChDgG,IAAI,IAAK;IACR,MAAMC,sBAAsB,GAAGlB,aAAa,CAACmB,MAAM,CAChDC,IAAI,IAAKA,IAAI,CAACH,IAAI,KAAKA,IAC1B,CAAC;IACDhB,gBAAgB,CAACiB,sBAAsB,CAAC;EAC1C,CAAC,EACD,CAAClB,aAAa,CAChB,CAAC;EAED,MAAMqB,eAAe,GAAGpG,WAAW,CACjC,CAAC;IACCqG,eAAe;IACfC,qBAAqB;IACrBnC,EAAE;IACFoC;EACyB,CAAC,KAAK;IAC/B,MAAMC,yBAAyB,GAAGvC,iBAAiB,EAAEwC,IAAI,CAAC,GAAG,CAAC;IAE9D,MAAMC,KAAK,GAAGA,CAAA,KACZ5F,IAAA;MACE6F,MAAM,EAAEH,yBAA0B;MAClC,oBAAkBH,eAAgB;MAClC,qBAAmBC,qBAAsB;MACzC,mBAAiBC,cAAe;MAChCK,QAAQ,EAAExC,UAAW;MACrBD,EAAE,EAAEA,EAAG;MACP0C,QAAQ,EAAElC,IAAI,KAAK,UAAW;MAC9BD,QAAQ,EAAEO,mBAAoB;MAC9B6B,GAAG,EAAEhC,QAAS;MACdiC,KAAK,EAAC,EAAE;MACRpC,IAAI,EAAC;IAAM,CACZ,CACF;IAED,IAAIC,OAAO,KAAK,QAAQ,EAAE;MACxB,OACE9D,IAAA,CAAAI,SAAA;QAAA8F,QAAA,EACEhG,KAAA,CAACK,gBAAgB;UAAA2F,QAAA,GACflG,IAAA,CAAC4F,KAAK,IAAE,CAAC,EACT5F,IAAA,CAACR,MAAM;YACL8D,UAAU,EAAEA,UAAW;YACvBK,KAAK,EAAEI,CAAC,CAAC,wBAAwB,CAAE;YACnCoC,OAAO,EAAErB,qBAAsB;YAC/BsB,SAAS,EAAEpG,IAAA,CAACP,UAAU,IAAE,CAAE;YAC1BqE,OAAO,EAAC;UAAW,CACpB,CAAC;QAAA,CACc;MAAC,CACnB,CAAC;IAEP;IAEA,OACE9D,IAAA,CAAAI,SAAA;MAAA8F,QAAA,EACEhG,KAAA,CAACa,cAAc;QACbK,QAAQ,EAAEiF,OAAO,CAACjD,YAAY,CAAE;QAChC/B,mBAAmB,EAAEA,mBAAoB;QAAA6E,QAAA,GAEzClG,IAAA,CAAC4F,KAAK,IAAE,CAAC,EACT1F,KAAA,CAAC4C,sBAAsB;UAAAoD,QAAA,GACpBpC,OAAO,KAAK,qBAAqB,IAAI9D,IAAA,CAACJ,sBAAsB,IAAE,CAAC,EAChEI,IAAA,CAACgD,wBAAwB;YAAAkD,QAAA,EACvBlG,IAAA,CAACF,OAAO;cAAC8C,KAAK,EAAC,eAAe;cAAAsD,QAAA,EAC3BnC,CAAC,CAAC,wBAAwB;YAAC,CACrB;UAAC,CACc,CAAC,EAC3B/D,IAAA,CAACR,MAAM;YACL8D,UAAU,EAAEA,UAAW;YACvBK,KAAK,EAAEI,CAAC,CAAC,wBAAwB,CAAE;YACnCoC,OAAO,EAAErB,qBAAsB;YAC/BsB,SAAS,EAAEpG,IAAA,CAACP,UAAU,IAAE,CAAE;YAC1BqE,OAAO,EAAC;UAAW,CACpB,CAAC;QAAA,CACoB,CAAC;MAAA,CACX;IAAC,CACjB,CAAC;EAEP,CAAC,EACD,CACEX,iBAAiB,EACjBC,YAAY,EACZE,UAAU,EACVU,QAAQ,EACR3C,mBAAmB,EACnByD,qBAAqB,EACrBf,CAAC,EACDF,IAAI,EACJM,mBAAmB,EACnBL,OAAO,CAEX,CAAC;EAED,OACE5D,KAAA,CAAAE,SAAA;IAAA8F,QAAA,GACElG,IAAA,CAACN,KAAK;MACJ0D,YAAY,EAAEA,YAAa;MAC3BkD,SAAS,EAAC,QAAQ;MAClBC,eAAe;MACf9C,IAAI,EAAEA,IAAK;MACXC,iBAAiB,EAAEA,iBAAkB;MACrCL,EAAE,EAAEA,EAAG;MACPC,UAAU,EAAEA,UAAW;MACvBC,WAAW,EAAEA,WAAW,IAAIO,OAAO,KAAK,QAAS;MACjDN,UAAU,EAAEA,UAAW;MACvBG,KAAK,EAAEA,KAAM;MACb6C,oBAAoB,EAAElB;IAAgB,CACvC,CAAC,EACDrB,aAAa,CAACM,MAAM,GAAG,CAAC,IACvBvE,IAAA,CAACL,iBAAiB;MAChB8G,SAAS,EAAExC,aAAa,CAACyC,GAAG,CAAErB,IAAI,IAAKA,IAAI,CAACH,IAAI,CAAE;MAClDyB,YAAY,EAAE1B,+BAAgC;MAC9C3B,UAAU,EAAEA;IAAW,CACxB,CACF;EAAA,CACD,CAAC;AAEP,CAAC;AAED,MAAMsD,oBAAoB,GAAG3H,IAAI,CAACiE,YAAY,CAAC;AAC/C0D,oBAAoB,CAACC,WAAW,GAAG,cAAc;AAEjD,SAASD,oBAAoB,IAAIE,UAAU;AAC3C,SAASF,oBAAoB,IAAI1D,YAAY","ignoreList":[]}
1	+ {"version":3,"file":"FileUploader.js","names":["styled","memo","useCallback","useEffect","useRef","useState","useTranslation","Button","Field","UploadIcon","useOdysseyDesignTokens","Support","FileUploadIllustration","FileUploadPreview","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","fileUploadTypes","fileUploadVariants","BaseInputWrapper","div","position","alignSelf","input","width","height","opacity","InputContainer","display","alignItems","justifyContent","borderStyle","hasError","odysseyDesignTokens","padding","Spacing6","Spacing3","border","PaletteDangerMain","HueNeutral300","borderRadius","BorderRadiusMain","transition","TransitionTimingMain","borderColor","HueNeutral700","FocusOutlineColorPrimary","boxShadow","outline","FocusOutlineWidthMain","FocusOutlineStyle","outlineOffset","FocusOutlineOffsetTight","backgroundColor","HueNeutral50","BorderColorDisabled","color","TypographyColorDisabled","ButtonAndInfoContainer","flexDirection","CenterAlignedSupportText","textAlign","FileUploader","acceptedFileTypes","errorMessage","id","isDisabled","isFullWidth","isOptional","hint","HintLinkComponent","label","onChange","type","variant","t","inputRef","filesToUpload","setFilesToUpload","updateFilesToUpload","event","files","target","length","mergedFiles","concat","Array","from","slice","value","triggerFileInputClick","current","click","removeFileFromFilesToUploadList","name","deletedFileFilteredOut","filter","file","renderFileInput","ariaDescribedBy","errorMessageElementId","labelElementId","acceptedFileTypesAsString","join","Input","accept","disabled","multiple","ref","title","children","onClick","startIcon","Boolean","fieldType","hasVisibleLabel","renderFieldComponent","fileNames","map","onFileRemove","MemoizedFileUploader","displayName","FileUpload"],"sources":["../../../src/FileUploader/FileUploader.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 styled from \"@emotion/styled\";\nimport {\n ChangeEvent,\n memo,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { Button } from \"../Buttons/index.js\";\nimport { Field, RenderFieldComponentProps } from \"../Field.js\";\nimport { FieldComponentProps } from \"../FieldComponentProps.js\";\nimport { UploadIcon } from \"../icons.generated/index.js\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../OdysseyDesignTokensContext.js\";\nimport { Support } from \"../Typography.js\";\nimport { FileUploadIllustration } from \"./FileUploadIllustration.js\";\nimport { FileUploadPreview } from \"./FileUploadPreview.js\";\n\nexport const fileUploadTypes = [\"single\", \"multiple\"] as const;\nexport const fileUploadVariants = [\n \"button\",\n \"dragAndDrop\",\n \"dragAndDropWithIcon\",\n] as const;\n\nconst BaseInputWrapper = styled.div({\n position: \"relative\",\n alignSelf: \"flex-start\",\n\n input: {\n position: \"absolute\",\n width: \"100%\",\n height: \"100%\",\n opacity: 0,\n },\n});\n\nconst InputContainer = styled(BaseInputWrapper)<{\n hasError: boolean;\n odysseyDesignTokens: DesignTokens;\n}>(\n {\n display: \"flex\",\n alignSelf: \"unset\",\n alignItems: \"center\",\n justifyContent: \"center\",\n\n \"&:has(input:focus)\": {\n borderStyle: \"solid\",\n },\n },\n ({ hasError, odysseyDesignTokens }) => ({\n padding: `${odysseyDesignTokens.Spacing6} ${odysseyDesignTokens.Spacing3}`,\n border: hasError\n ? `1px solid ${odysseyDesignTokens.PaletteDangerMain}`\n : `1px dashed ${odysseyDesignTokens.HueNeutral300}`,\n borderRadius: odysseyDesignTokens.BorderRadiusMain,\n transition: `border-color ${odysseyDesignTokens.TransitionTimingMain}, box-shadow ${odysseyDesignTokens.TransitionTimingMain}`,\n\n \"&:hover\": {\n borderColor: odysseyDesignTokens.HueNeutral700,\n },\n\n \"&:has(input:focus)\": {\n borderColor: odysseyDesignTokens.FocusOutlineColorPrimary,\n boxShadow: `0 0 0 1px ${odysseyDesignTokens.FocusOutlineColorPrimary}`,\n outline: `${odysseyDesignTokens.FocusOutlineWidthMain} ${odysseyDesignTokens.FocusOutlineStyle} transparent`,\n outlineOffset: odysseyDesignTokens.FocusOutlineOffsetTight,\n },\n\n \"&:has(input:disabled)\": {\n backgroundColor: odysseyDesignTokens.HueNeutral50,\n border: `1px solid ${odysseyDesignTokens.BorderColorDisabled}`,\n color: odysseyDesignTokens.TypographyColorDisabled,\n\n \"&:hover\": {\n borderColor: odysseyDesignTokens.BorderColorDisabled,\n },\n },\n }),\n);\n\nconst ButtonAndInfoContainer = styled.div({\n display: \"flex\",\n flexDirection: \"column\",\n alignItems: \"center\",\n justifyContent: \"center\",\n});\n\nconst CenterAlignedSupportText = styled.div({\n textAlign: \"center\",\n});\n\nexport type FileUploaderProps = {\n /\n an array of file types the user is able to upload. @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept#unique_file_type_specifiers for examples\n /\n acceptedFileTypes?: string[];\n /\n The label for the `input` element.\n /\n label: string;\n /\n Function that is called when the list of ifles to upload is changed\n /\n onChange: (files: File[]) => void;\n /\n Either `single` or `multiple`. If `multiple`, multiple files can be uploaded\n /\n type?: (typeof fileUploadTypes)[number];\n /\n Either `button`, `dragAndDrop` or `dragAndDropWithIcon`. Will determine how component appears visually\n */\n variant: (typeof fileUploadVariants)[number];\n} & Pick<\n FieldComponentProps,\n \| \"errorMessage\"\n \| \"hint\"\n \| \"HintLinkComponent\"\n \| \"id\"\n \| \"isDisabled\"\n \| \"isFullWidth\"\n \| \"isOptional\"\n>;\n\nconst FileUploader = ({\n acceptedFileTypes,\n errorMessage,\n id,\n isDisabled = false,\n isFullWidth,\n isOptional,\n hint,\n HintLinkComponent,\n label,\n onChange,\n type,\n variant,\n}: FileUploaderProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const { t } = useTranslation();\n const inputRef = useRef<HTMLInputElement>(null);\n const [filesToUpload, setFilesToUpload] = useState<File[]>([]);\n\n useEffect(() => {\n onChange(filesToUpload);\n }, [filesToUpload, onChange]);\n\n const updateFilesToUpload = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n const { files } = event.target;\n\n if (files && files.length > 0) {\n const mergedFiles =\n type === \"multiple\"\n ? filesToUpload.concat(Array.from(files))\n : Array.from(files).slice();\n\n setFilesToUpload(mergedFiles);\n }\n\n // reset input value to allow re-upload of a file with the same name\n event.target.value = \"\";\n },\n [type, filesToUpload],\n );\n\n const triggerFileInputClick = useCallback(() => {\n inputRef.current?.click();\n }, [inputRef]);\n\n const removeFileFromFilesToUploadList = useCallback<(name: string) => void>(\n (name) => {\n const deletedFileFilteredOut = filesToUpload.filter(\n (file) => file.name !== name,\n );\n setFilesToUpload(deletedFileFilteredOut);\n },\n [filesToUpload],\n );\n\n const renderFileInput = useCallback(\n ({\n ariaDescribedBy,\n errorMessageElementId,\n id,\n labelElementId,\n }: RenderFieldComponentProps) => {\n const acceptedFileTypesAsString = acceptedFileTypes?.join(\",\");\n\n const Input = () => (\n <input\n accept={acceptedFileTypesAsString}\n aria-describedby={ariaDescribedBy}\n aria-errormessage={errorMessageElementId}\n aria-labelledby={labelElementId}\n disabled={isDisabled}\n id={id}\n multiple={type === \"multiple\"}\n onChange={updateFilesToUpload}\n ref={inputRef}\n title=\"\"\n type=\"file\"\n />\n );\n\n if (variant === \"button\") {\n return (\n <>\n <BaseInputWrapper>\n <Input />\n <Button\n isDisabled={isDisabled}\n label={t(\"fileupload.button.text\")}\n onClick={triggerFileInputClick}\n startIcon={<UploadIcon />}\n variant=\"secondary\"\n />\n </BaseInputWrapper>\n </>\n );\n }\n\n return (\n <>\n <InputContainer\n hasError={Boolean(errorMessage)}\n odysseyDesignTokens={odysseyDesignTokens}\n >\n <Input />\n <ButtonAndInfoContainer>\n {variant === \"dragAndDropWithIcon\" && <FileUploadIllustration />}\n <CenterAlignedSupportText>\n <Support color=\"textSecondary\">\n {t(\"fileupload.prompt.text\")}\n </Support>\n </CenterAlignedSupportText>\n <Button\n isDisabled={isDisabled}\n label={t(\"fileupload.button.text\")}\n onClick={triggerFileInputClick}\n startIcon={<UploadIcon />}\n variant=\"secondary\"\n />\n </ButtonAndInfoContainer>\n </InputContainer>\n </>\n );\n },\n [\n acceptedFileTypes,\n errorMessage,\n isDisabled,\n inputRef,\n odysseyDesignTokens,\n triggerFileInputClick,\n t,\n type,\n updateFilesToUpload,\n variant,\n ],\n );\n\n return (\n <>\n <Field\n errorMessage={errorMessage}\n fieldType=\"single\"\n hasVisibleLabel\n hint={hint}\n HintLinkComponent={HintLinkComponent}\n id={id}\n isDisabled={isDisabled}\n isFullWidth={isFullWidth && variant !== \"button\"}\n isOptional={isOptional}\n label={label}\n renderFieldComponent={renderFileInput}\n />\n {filesToUpload.length > 0 && (\n <FileUploadPreview\n fileNames={filesToUpload.map((file) => file.name)}\n isDisabled={isDisabled}\n onFileRemove={removeFileFromFilesToUploadList}\n />\n )}\n </>\n );\n};\n\nconst MemoizedFileUploader = memo(FileUploader);\nMemoizedFileUploader.displayName = \"FileUploader\";\n\nexport { MemoizedFileUploader as FileUpload };\nexport { MemoizedFileUploader as FileUploader };\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/Form.js CHANGED Viewed

@@ -10,11 +10,11 @@
  * See the License for the specific language governing permissions and limitations under the License.
  */
-import { memo } from "react";
 import styled from "@emotion/styled";
+import { memo } from "react";
+import { useOdysseyDesignTokens } from "./OdysseyDesignTokensContext.js";
 import { Heading4, Support } from "./Typography.js";
 import { useUniqueId } from "./useUniqueId.js";
-import { useOdysseyDesignTokens } from "./OdysseyDesignTokensContext.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export const formEncodingTypeValues = ["application/x-www-form-urlencoded", "application/json", "multipart/form-data", "text/plain"];
 export const formAutoCompleteTypeValues = ["on", "off"];

package/dist/esm/Form.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Form.js","names":["memo","~~styled~~","Heading4","Support","useUniqueId","~~useOdysseyDesignTokens","~~jsx","_jsx","jsxs","_jsxs","formEncodingTypeValues","formAutoCompleteTypeValues","formMethodValues","StyledForm","form","isFullWidth","odysseyDesignTokens","maxWidth","TypographyLineLengthMax","margin","padding","TitleContainer","div","marginBlockEnd","Spacing4","FormActionContainer","display","justifyContent","gap","Spacing1","marginBlockStart","Spacing7","Form","alert","autoCompleteType","children","description","encodingType","formActions","id","idOverride","method","name","noValidate","onSubmit","target","testId","title","translate","autoComplete","encType","component","MemoizedForm","displayName"],"sources":["../../src/Form.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 { FormEventHandler, memo, ReactElement } from \"react\";\nimport ~~styled~~ from \"~~@emotion/styled~~\";\n\nimport { Button } from \"./Buttons/index.js\";\nimport { Callout } from \"./Callout.js\";\nimport { FieldComponentProps } from \"./FieldComponentProps.js\";\nimport ~~type~~ { ~~HtmlProps~~ } from \"./~~HtmlProps~~.js\";\nimport { Heading4, Support } from \"./Typography.js\";\nimport { useUniqueId } from \"./useUniqueId.js\";\~~nimport {\~~n ~~useOdysseyDesignTokens,\n DesignTokens,\n} from~~ \~~"./OdysseyDesignTokensContext.js\";\n\~~nexport const formEncodingTypeValues = [\n \"application/x-www-form-urlencoded\",\n \"application/json\",\n \"multipart/form-data\",\n \"text/plain\",\n] as const;\nexport const formAutoCompleteTypeValues = [\"on\", \"off\"] as const;\nexport const formMethodValues = [\"post\", \"get\", \"dialog\"] as const;\n\nconst StyledForm = styled.form<{\n isFullWidth?: boolean;\n odysseyDesignTokens: DesignTokens;\n}>(({ isFullWidth, odysseyDesignTokens }) => ({\n maxWidth: isFullWidth ? \"100%\" : odysseyDesignTokens.TypographyLineLengthMax,\n margin: 0,\n padding: 0,\n}));\n\nconst TitleContainer = styled.div<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n marginBlockEnd: odysseyDesignTokens.Spacing4,\n}));\n\nconst FormActionContainer = styled.div<{\n odysseyDesignTokens: DesignTokens;\n}>(\n {\n display: \"flex\",\n justifyContent: \"flex-end\",\n },\n ({ odysseyDesignTokens }) => ({\n gap: odysseyDesignTokens.Spacing1,\n marginBlockStart: odysseyDesignTokens.Spacing7,\n }),\n);\n\nexport type FormProps = {\n /\n A Callout indicating a Form-wide error or status update.\n /\n alert?: ReactElement<typeof Callout>;\n /\n Indicates whether input elements can by default have their values automatically completed by the browser.\n * `autocomplete` attributes on form elements override it on <form>\n /\n autoCompleteType?: (typeof formAutoCompleteTypeValues)[number];\n /\n The Field or FieldSet components within the Form\n /\n children: ReactElement \| Array<ReactElement>;\n /\n A supplementary description\n /\n description?: string;\n /\n If the value of the method attribute is post, enctype is the MIME type of the form submission.\n * This value can be overridden by formenctype attributes on <button>, <input type=\"submit\">, or <input type=\"image\"> elements.\n /\n encodingType?: (typeof formEncodingTypeValues)[number];\n /\n The Field or FieldGroup components within the Form\n /\n formActions?:\n \| ReactElement<typeof Button>\n \| Array<ReactElement<typeof Button>>;\n /\n Defines a unique identifier (ID) which must be unique in the whole document.\n /\n id?: string;\n /\n The HTTP method to submit the form with.\n * This value is overridden by formmethod attributes on <button>, <input type=\"submit\">, or <input type=\"image\"> elements.\n /\n method?: (typeof formMethodValues)[number];\n /\n The name of the form. The value must not be the empty string, and must be unique among the form elements in the forms collection that it is in, if any.\n /\n name: string;\n /\n This Boolean attribute indicates that the form shouldn't be validated when submitted.\n * If this attribute is not set (and therefore the form is validated),\n * it can be overridden by a formnovalidate attribute on a <button>, <input type=\"submit\">, or <input type=\"image\"> element belonging to the form.\n /\n noValidate?: boolean;\n /\n Callback that passes the submit event to the consumer\n /\n onSubmit?: FormEventHandler<HTMLFormElement>;\n /\n Indicates where to display the response after submitting the form. It is a name/keyword for a browsing context (for example, tab, window, or iframe).\n * This value can be overridden by a formtarget attribute on a <button>, <input type=\"submit\">, or <input type=\"image\"> element.\n /\n target?: string;\n /\n The title of the Form\n */\n title?: string;\n} & Pick<FieldComponentProps, \"isFullWidth\"> &\n Pick<HtmlProps, \"testId\" \| \"translate\">;\n\nconst Form = ({\n alert,\n autoCompleteType,\n children,\n description,\n encodingType,\n formActions,\n id: idOverride,\n isFullWidth,\n method,\n name,\n noValidate = false,\n onSubmit,\n target,\n testId,\n title,\n translate,\n}: FormProps) => {\n const id = useUniqueId(idOverride);\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n return (\n <StyledForm\n autoComplete={autoCompleteType}\n data-se={testId}\n encType={encodingType}\n id={id}\n isFullWidth={isFullWidth}\n method={method}\n name={name}\n noValidate={noValidate}\n odysseyDesignTokens={odysseyDesignTokens}\n onSubmit={onSubmit}\n target={target}\n >\n <TitleContainer odysseyDesignTokens={odysseyDesignTokens}>\n {title && (\n <Heading4 component=\"h1\" translate={translate}>\n {title}\n </Heading4>\n )}\n {description && <Support translate={translate}>{description}</Support>}\n {alert}\n </TitleContainer>\n <div>{children}</div>\n {formActions && (\n <FormActionContainer odysseyDesignTokens={odysseyDesignTokens}>\n {formActions}\n </FormActionContainer>\n )}\n </StyledForm>\n );\n};\n\nconst MemoizedForm = memo(Form);\nMemoizedForm.displayName = \"Form\";\n\nexport { MemoizedForm as Form };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,~~SAA2BA~~,IAAI,QAAsB,OAAO;~~AAC5D~~,~~OAAOC~~,~~MAAM~~,~~MAAM~~,~~iBAAiB~~;~~AAMpC~~,SAASC,QAAQ,EAAEC,OAAO,QAAQ,iBAAiB;AACnD,SAASC,WAAW,QAAQ,kBAAkB;~~AAC9C,SACEC,sBAAsB,QAEjB,iCAAiC;~~AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;~~AAEzC~~,OAAO,MAAMC,sBAAsB,GAAG,CACpC,mCAAmC,EACnC,kBAAkB,EAClB,qBAAqB,EACrB,YAAY,CACJ;AACV,OAAO,MAAMC,0BAA0B,GAAG,CAAC,IAAI,EAAE,KAAK,CAAU;AAChE,OAAO,MAAMC,gBAAgB,GAAG,CAAC,MAAM,EAAE,KAAK,EAAE,QAAQ,CAAU;AAElE,MAAMC,UAAU,~~GAAGZ~~,MAAM,~~CAACa~~,IAAI,CAG3B,CAAC;EAAEC,WAAW;EAAEC;AAAoB,CAAC,MAAM;EAC5CC,QAAQ,EAAEF,WAAW,GAAG,MAAM,GAAGC,mBAAmB,CAACE,uBAAuB;EAC5EC,MAAM,EAAE,CAAC;EACTC,OAAO,EAAE;AACX,CAAC,CAAC,CAAC;AAEH,MAAMC,cAAc,~~GAAGpB~~,MAAM,~~CAACqB~~,GAAG,CAE9B,CAAC;EAAEN;AAAoB,CAAC,MAAM;EAC/BO,cAAc,EAAEP,mBAAmB,CAACQ;AACtC,CAAC,CAAC,CAAC;AAEH,MAAMC,mBAAmB,~~GAAGxB~~,MAAM,~~CAACqB~~,GAAG,CAGpC;EACEI,OAAO,EAAE,MAAM;EACfC,cAAc,EAAE;AAClB,CAAC,EACD,CAAC;EAAEX;AAAoB,CAAC,MAAM;EAC5BY,GAAG,EAAEZ,mBAAmB,CAACa,QAAQ;EACjCC,gBAAgB,EAAEd,mBAAmB,CAACe;AACxC,CAAC,CACH,CAAC;AAkED,MAAMC,IAAI,GAAGA,CAAC;EACZC,KAAK;EACLC,gBAAgB;EAChBC,QAAQ;EACRC,WAAW;EACXC,YAAY;EACZC,WAAW;EACXC,EAAE,EAAEC,UAAU;EACdzB,WAAW;EACX0B,MAAM;EACNC,IAAI;EACJC,UAAU,GAAG,KAAK;EAClBC,QAAQ;EACRC,MAAM;EACNC,MAAM;EACNC,KAAK;EACLC;AACS,CAAC,KAAK;EACf,MAAMT,EAAE,~~GAAGnC~~,WAAW,~~CAACoC~~,UAAU,CAAC;EAClC,MAAMxB,mBAAmB,~~GAAGX~~,sBAAsB,CAAC,CAAC;EAEpD,~~OACEI~~,KAAA,CAACI,UAAU;IACToC,YAAY,EAAEf,gBAAiB;IAC/B,WAASY,MAAO;IAChBI,OAAO,EAAEb,YAAa;IACtBE,EAAE,EAAEA,EAAG;IACPxB,WAAW,EAAEA,WAAY;IACzB0B,MAAM,EAAEA,MAAO;IACfC,IAAI,EAAEA,IAAK;IACXC,UAAU,EAAEA,UAAW;IACvB3B,mBAAmB,EAAEA,mBAAoB;IACzC4B,QAAQ,EAAEA,QAAS;IACnBC,MAAM,EAAEA,MAAO;IAAAV,QAAA,GAEf1B,KAAA,CAACY,cAAc;MAACL,mBAAmB,EAAEA,mBAAoB;MAAAmB,QAAA,GACtDY,KAAK,IACJxC,IAAA,~~CAACL~~,QAAQ;~~QAACiD~~,SAAS,EAAC,IAAI;QAACH,SAAS,EAAEA,SAAU;QAAAb,QAAA,EAC3CY;MAAK,CACE,CACX,EACAX,WAAW,IAAI7B,IAAA,~~CAACJ~~,OAAO;~~QAAC6C~~,SAAS,EAAEA,SAAU;QAAAb,QAAA,EAAEC;MAAW,CAAU,CAAC,EACrEH,KAAK;IAAA,CACQ,CAAC,EACjB1B,IAAA;MAAA4B,QAAA,EAAMA;IAAQ,CAAM,CAAC,EACpBG,WAAW,IACV/B,IAAA,CAACkB,mBAAmB;MAACT,mBAAmB,EAAEA,mBAAoB;MAAAmB,QAAA,EAC3DG;IAAW,CACO,CACtB;EAAA,CACS,CAAC;AAEjB,CAAC;AAED,MAAMc,YAAY,~~GAAGpD~~,IAAI,~~CAACgC~~,IAAI,CAAC;AAC/BoB,YAAY,CAACC,WAAW,GAAG,MAAM;AAEjC,SAASD,YAAY,IAAIpB,IAAI","ignoreList":[]}
1	+ {"version":3,"file":"Form.js","names":["styled","memo","useOdysseyDesignTokens","Heading4","Support","useUniqueId","jsx","_jsx","jsxs","_jsxs","formEncodingTypeValues","formAutoCompleteTypeValues","formMethodValues","StyledForm","form","isFullWidth","odysseyDesignTokens","maxWidth","TypographyLineLengthMax","margin","padding","TitleContainer","div","marginBlockEnd","Spacing4","FormActionContainer","display","justifyContent","gap","Spacing1","marginBlockStart","Spacing7","Form","alert","autoCompleteType","children","description","encodingType","formActions","id","idOverride","method","name","noValidate","onSubmit","target","testId","title","translate","autoComplete","encType","component","MemoizedForm","displayName"],"sources":["../../src/Form.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 styled from \"@emotion/styled\";\nimport { FormEventHandler, memo, ReactElement } from \"react\";\n\nimport type { HtmlProps } from \"./HtmlProps.js\";\n\nimport { Button } from \"./Buttons/index.js\";\nimport { Callout } from \"./Callout.js\";\nimport { FieldComponentProps } from \"./FieldComponentProps.js\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"./OdysseyDesignTokensContext.js\";\nimport { Heading4, Support } from \"./Typography.js\";\nimport { useUniqueId } from \"./useUniqueId.js\";\n\nexport const formEncodingTypeValues = [\n \"application/x-www-form-urlencoded\",\n \"application/json\",\n \"multipart/form-data\",\n \"text/plain\",\n] as const;\nexport const formAutoCompleteTypeValues = [\"on\", \"off\"] as const;\nexport const formMethodValues = [\"post\", \"get\", \"dialog\"] as const;\n\nconst StyledForm = styled.form<{\n isFullWidth?: boolean;\n odysseyDesignTokens: DesignTokens;\n}>(({ isFullWidth, odysseyDesignTokens }) => ({\n maxWidth: isFullWidth ? \"100%\" : odysseyDesignTokens.TypographyLineLengthMax,\n margin: 0,\n padding: 0,\n}));\n\nconst TitleContainer = styled.div<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n marginBlockEnd: odysseyDesignTokens.Spacing4,\n}));\n\nconst FormActionContainer = styled.div<{\n odysseyDesignTokens: DesignTokens;\n}>(\n {\n display: \"flex\",\n justifyContent: \"flex-end\",\n },\n ({ odysseyDesignTokens }) => ({\n gap: odysseyDesignTokens.Spacing1,\n marginBlockStart: odysseyDesignTokens.Spacing7,\n }),\n);\n\nexport type FormProps = {\n /\n A Callout indicating a Form-wide error or status update.\n /\n alert?: ReactElement<typeof Callout>;\n /\n Indicates whether input elements can by default have their values automatically completed by the browser.\n * `autocomplete` attributes on form elements override it on <form>\n /\n autoCompleteType?: (typeof formAutoCompleteTypeValues)[number];\n /\n The Field or FieldSet components within the Form\n /\n children: ReactElement \| Array<ReactElement>;\n /\n A supplementary description\n /\n description?: string;\n /\n If the value of the method attribute is post, enctype is the MIME type of the form submission.\n * This value can be overridden by formenctype attributes on <button>, <input type=\"submit\">, or <input type=\"image\"> elements.\n /\n encodingType?: (typeof formEncodingTypeValues)[number];\n /\n The Field or FieldGroup components within the Form\n /\n formActions?:\n \| ReactElement<typeof Button>\n \| Array<ReactElement<typeof Button>>;\n /\n Defines a unique identifier (ID) which must be unique in the whole document.\n /\n id?: string;\n /\n The HTTP method to submit the form with.\n * This value is overridden by formmethod attributes on <button>, <input type=\"submit\">, or <input type=\"image\"> elements.\n /\n method?: (typeof formMethodValues)[number];\n /\n The name of the form. The value must not be the empty string, and must be unique among the form elements in the forms collection that it is in, if any.\n /\n name: string;\n /\n This Boolean attribute indicates that the form shouldn't be validated when submitted.\n * If this attribute is not set (and therefore the form is validated),\n * it can be overridden by a formnovalidate attribute on a <button>, <input type=\"submit\">, or <input type=\"image\"> element belonging to the form.\n /\n noValidate?: boolean;\n /\n Callback that passes the submit event to the consumer\n /\n onSubmit?: FormEventHandler<HTMLFormElement>;\n /\n Indicates where to display the response after submitting the form. It is a name/keyword for a browsing context (for example, tab, window, or iframe).\n * This value can be overridden by a formtarget attribute on a <button>, <input type=\"submit\">, or <input type=\"image\"> element.\n /\n target?: string;\n /\n The title of the Form\n */\n title?: string;\n} & Pick<FieldComponentProps, \"isFullWidth\"> &\n Pick<HtmlProps, \"testId\" \| \"translate\">;\n\nconst Form = ({\n alert,\n autoCompleteType,\n children,\n description,\n encodingType,\n formActions,\n id: idOverride,\n isFullWidth,\n method,\n name,\n noValidate = false,\n onSubmit,\n target,\n testId,\n title,\n translate,\n}: FormProps) => {\n const id = useUniqueId(idOverride);\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n return (\n <StyledForm\n autoComplete={autoCompleteType}\n data-se={testId}\n encType={encodingType}\n id={id}\n isFullWidth={isFullWidth}\n method={method}\n name={name}\n noValidate={noValidate}\n odysseyDesignTokens={odysseyDesignTokens}\n onSubmit={onSubmit}\n target={target}\n >\n <TitleContainer odysseyDesignTokens={odysseyDesignTokens}>\n {title && (\n <Heading4 component=\"h1\" translate={translate}>\n {title}\n </Heading4>\n )}\n {description && <Support translate={translate}>{description}</Support>}\n {alert}\n </TitleContainer>\n <div>{children}</div>\n {formActions && (\n <FormActionContainer odysseyDesignTokens={odysseyDesignTokens}>\n {formActions}\n </FormActionContainer>\n )}\n </StyledForm>\n );\n};\n\nconst MemoizedForm = memo(Form);\nMemoizedForm.displayName = \"Form\";\n\nexport { MemoizedForm as Form };\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/IconWithTooltip.js CHANGED Viewed

@@ -11,8 +11,8 @@ import _Tooltip from "@mui/material/Tooltip";
  * See the License for the specific language governing permissions and limitations under the License.
  */
-import { memo } from "react";
 import styled from "@emotion/styled";
+import { memo } from "react";
 import { InformationCircleIcon } from "./icons.generated/index.js";
 import { useMuiProps } from "./MuiPropsContext.js";
 import { useOdysseyDesignTokens } from "./OdysseyDesignTokensContext.js";

package/dist/esm/IconWithTooltip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"IconWithTooltip.js","names":["~~memo~~","~~styled~~","InformationCircleIcon","useMuiProps","useOdysseyDesignTokens","jsx","_jsx","IconContainer","span","odysseyDesignTokens","display","transitionProperty","transitionDuration","TransitionDurationMain","border","borderColor","FocusOutlineColorPrimary","boxShadow","outline","FocusOutlineWidthMain","FocusOutlineStyle","outlineOffset","FocusOutlineOffsetTight","svg","IconWithTooltip","IconComponent","placement","testId","tooltipText","translate","muiProps","_Tooltip","describeChild","tabIndex","title","children","MemoizedIconWithTooltip","displayName"],"sources":["../../src/IconWithTooltip.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 styled from \"@emotion/styled\";\nimport { Tooltip as MuiTooltip } from \"@mui/material\";\nimport ~~type~~ { ~~TooltipProps~~ as ~~MuiTooltipProps~~ } from \"~~@mui/material~~\";\n\nimport { HtmlProps } from \"./HtmlProps.js\";\nimport { InformationCircleIcon } from \"./icons.generated/index.js\";\nimport { useMuiProps } from \"./MuiPropsContext.js\";\nimport {\n ~~useOdysseyDesignTokens~~,\n ~~DesignTokens~~,\n} from \"./OdysseyDesignTokensContext.js\";\n\nconst IconContainer = styled.span<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n display: \"inline-flex\",\n transitionProperty: \"border-color, box-shadow, outline\",\n transitionDuration: odysseyDesignTokens.TransitionDurationMain,\n border: \"1px solid transparent\",\n\n \"&:focus, &:focus-visible\": {\n borderColor: odysseyDesignTokens.FocusOutlineColorPrimary,\n boxShadow: `0 0 0 1px ${odysseyDesignTokens.FocusOutlineColorPrimary}`,\n outline: `${odysseyDesignTokens.FocusOutlineWidthMain} ${odysseyDesignTokens.FocusOutlineStyle} transparent`,\n outlineOffset: odysseyDesignTokens.FocusOutlineOffsetTight,\n },\n\n svg: {\n display: \"flex\",\n },\n}));\n\nexport type IconWithTooltipProps = {\n /\n The icon to render. Defaults to `InformationCircleIcon`\n /\n IconComponent?: ReactNode;\n /\n The placement of the Tooltip\n /\n placement?: MuiTooltipProps[\"placement\"];\n /\n The text to display in the Tooltip\n */\n tooltipText: string;\n} & Pick<HtmlProps, \"testId\" \| \"translate\">;\n\nconst IconWithTooltip = ({\n IconComponent = <InformationCircleIcon />,\n placement = \"right\",\n testId,\n tooltipText,\n translate,\n}: IconWithTooltipProps) => {\n const muiProps = useMuiProps();\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n return (\n <MuiTooltip\n data-se={testId}\n describeChild\n placement={placement}\n tabIndex={0}\n title={tooltipText}\n translate={translate}\n >\n <IconContainer odysseyDesignTokens={odysseyDesignTokens} {...muiProps}>\n {IconComponent}\n </IconContainer>\n </MuiTooltip>\n );\n};\n\nconst MemoizedIconWithTooltip = memo(IconWithTooltip);\nMemoizedIconWithTooltip.displayName = \"IconWithTooltip\";\n\nexport { MemoizedIconWithTooltip as IconWithTooltip };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;~~AAEA~~,~~SAASA~~,~~IAAI~~,~~QAAmB~~,~~OAAO~~;~~AACvC~~,~~OAAOC~~,~~MAAM~~,~~MAAM~~,~~iBAAiB~~;~~AAKpC~~,SAASC,qBAAqB,QAAQ,4BAA4B;AAClE,SAASC,WAAW,QAAQ,sBAAsB;AAClD,~~SACEC~~,sBAAsB,~~QAEjB~~,iCAAiC;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAEzC,MAAMC,aAAa,~~GAAGN~~,MAAM,~~CAACO~~,IAAI,CAE9B,CAAC;EAAEC;AAAoB,CAAC,MAAM;EAC/BC,OAAO,EAAE,aAAa;EACtBC,kBAAkB,EAAE,mCAAmC;EACvDC,kBAAkB,EAAEH,mBAAmB,CAACI,sBAAsB;EAC9DC,MAAM,EAAE,uBAAuB;EAE/B,0BAA0B,EAAE;IAC1BC,WAAW,EAAEN,mBAAmB,CAACO,wBAAwB;IACzDC,SAAS,EAAE,aAAaR,mBAAmB,CAACO,wBAAwB,EAAE;IACtEE,OAAO,EAAE,GAAGT,mBAAmB,CAACU,qBAAqB,IAAIV,mBAAmB,CAACW,iBAAiB,cAAc;IAC5GC,aAAa,EAAEZ,mBAAmB,CAACa;EACrC,CAAC;EAEDC,GAAG,EAAE;IACHb,OAAO,EAAE;EACX;AACF,CAAC,CAAC,CAAC;AAiBH,MAAMc,eAAe,GAAGA,CAAC;EACvBC,aAAa,GAAGnB,IAAA,CAACJ,qBAAqB,IAAE,CAAC;EACzCwB,SAAS,GAAG,OAAO;EACnBC,MAAM;EACNC,WAAW;EACXC;AACoB,CAAC,KAAK;EAC1B,MAAMC,QAAQ,GAAG3B,WAAW,CAAC,CAAC;EAC9B,MAAMM,mBAAmB,GAAGL,sBAAsB,CAAC,CAAC;EAEpD,OACEE,IAAA,CAAAyB,QAAA;IACE,WAASJ,MAAO;IAChBK,aAAa;IACbN,SAAS,EAAEA,SAAU;IACrBO,QAAQ,EAAE,CAAE;IACZC,KAAK,EAAEN,WAAY;IACnBC,SAAS,EAAEA,SAAU;IAAAM,QAAA,EAErB7B,IAAA,CAACC,aAAa;MAACE,mBAAmB,EAAEA,mBAAoB;MAAA,GAAKqB,QAAQ;MAAAK,QAAA,EAClEV;IAAa,CACD;EAAC,CACN,CAAC;AAEjB,CAAC;AAED,MAAMW,uBAAuB,~~GAAGpC~~,IAAI,~~CAACwB~~,eAAe,CAAC;AACrDY,uBAAuB,CAACC,WAAW,GAAG,iBAAiB;AAEvD,SAASD,uBAAuB,IAAIZ,eAAe","ignoreList":[]}
1	+ {"version":3,"file":"IconWithTooltip.js","names":["styled","memo","InformationCircleIcon","useMuiProps","useOdysseyDesignTokens","jsx","_jsx","IconContainer","span","odysseyDesignTokens","display","transitionProperty","transitionDuration","TransitionDurationMain","border","borderColor","FocusOutlineColorPrimary","boxShadow","outline","FocusOutlineWidthMain","FocusOutlineStyle","outlineOffset","FocusOutlineOffsetTight","svg","IconWithTooltip","IconComponent","placement","testId","tooltipText","translate","muiProps","_Tooltip","describeChild","tabIndex","title","children","MemoizedIconWithTooltip","displayName"],"sources":["../../src/IconWithTooltip.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 type { TooltipProps as MuiTooltipProps } from \"@mui/material\";\n\nimport styled from \"@emotion/styled\";\nimport { Tooltip as MuiTooltip } from \"@mui/material\";\nimport { memo, ReactNode } from \"react\";\n\nimport { HtmlProps } from \"./HtmlProps.js\";\nimport { InformationCircleIcon } from \"./icons.generated/index.js\";\nimport { useMuiProps } from \"./MuiPropsContext.js\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"./OdysseyDesignTokensContext.js\";\n\nconst IconContainer = styled.span<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n display: \"inline-flex\",\n transitionProperty: \"border-color, box-shadow, outline\",\n transitionDuration: odysseyDesignTokens.TransitionDurationMain,\n border: \"1px solid transparent\",\n\n \"&:focus, &:focus-visible\": {\n borderColor: odysseyDesignTokens.FocusOutlineColorPrimary,\n boxShadow: `0 0 0 1px ${odysseyDesignTokens.FocusOutlineColorPrimary}`,\n outline: `${odysseyDesignTokens.FocusOutlineWidthMain} ${odysseyDesignTokens.FocusOutlineStyle} transparent`,\n outlineOffset: odysseyDesignTokens.FocusOutlineOffsetTight,\n },\n\n svg: {\n display: \"flex\",\n },\n}));\n\nexport type IconWithTooltipProps = {\n /\n The icon to render. Defaults to `InformationCircleIcon`\n /\n IconComponent?: ReactNode;\n /\n The placement of the Tooltip\n /\n placement?: MuiTooltipProps[\"placement\"];\n /\n The text to display in the Tooltip\n */\n tooltipText: string;\n} & Pick<HtmlProps, \"testId\" \| \"translate\">;\n\nconst IconWithTooltip = ({\n IconComponent = <InformationCircleIcon />,\n placement = \"right\",\n testId,\n tooltipText,\n translate,\n}: IconWithTooltipProps) => {\n const muiProps = useMuiProps();\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n return (\n <MuiTooltip\n data-se={testId}\n describeChild\n placement={placement}\n tabIndex={0}\n title={tooltipText}\n translate={translate}\n >\n <IconContainer odysseyDesignTokens={odysseyDesignTokens} {...muiProps}>\n {IconComponent}\n </IconContainer>\n </MuiTooltip>\n );\n};\n\nconst MemoizedIconWithTooltip = memo(IconWithTooltip);\nMemoizedIconWithTooltip.displayName = \"IconWithTooltip\";\n\nexport { MemoizedIconWithTooltip as IconWithTooltip };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAIA,OAAOA,MAAM,MAAM,iBAAiB;AAEpC,SAASC,IAAI,QAAmB,OAAO;AAGvC,SAASC,qBAAqB,QAAQ,4BAA4B;AAClE,SAASC,WAAW,QAAQ,sBAAsB;AAClD,SAEEC,sBAAsB,QACjB,iCAAiC;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAEzC,MAAMC,aAAa,GAAGP,MAAM,CAACQ,IAAI,CAE9B,CAAC;EAAEC;AAAoB,CAAC,MAAM;EAC/BC,OAAO,EAAE,aAAa;EACtBC,kBAAkB,EAAE,mCAAmC;EACvDC,kBAAkB,EAAEH,mBAAmB,CAACI,sBAAsB;EAC9DC,MAAM,EAAE,uBAAuB;EAE/B,0BAA0B,EAAE;IAC1BC,WAAW,EAAEN,mBAAmB,CAACO,wBAAwB;IACzDC,SAAS,EAAE,aAAaR,mBAAmB,CAACO,wBAAwB,EAAE;IACtEE,OAAO,EAAE,GAAGT,mBAAmB,CAACU,qBAAqB,IAAIV,mBAAmB,CAACW,iBAAiB,cAAc;IAC5GC,aAAa,EAAEZ,mBAAmB,CAACa;EACrC,CAAC;EAEDC,GAAG,EAAE;IACHb,OAAO,EAAE;EACX;AACF,CAAC,CAAC,CAAC;AAiBH,MAAMc,eAAe,GAAGA,CAAC;EACvBC,aAAa,GAAGnB,IAAA,CAACJ,qBAAqB,IAAE,CAAC;EACzCwB,SAAS,GAAG,OAAO;EACnBC,MAAM;EACNC,WAAW;EACXC;AACoB,CAAC,KAAK;EAC1B,MAAMC,QAAQ,GAAG3B,WAAW,CAAC,CAAC;EAC9B,MAAMM,mBAAmB,GAAGL,sBAAsB,CAAC,CAAC;EAEpD,OACEE,IAAA,CAAAyB,QAAA;IACE,WAASJ,MAAO;IAChBK,aAAa;IACbN,SAAS,EAAEA,SAAU;IACrBO,QAAQ,EAAE,CAAE;IACZC,KAAK,EAAEN,WAAY;IACnBC,SAAS,EAAEA,SAAU;IAAAM,QAAA,EAErB7B,IAAA,CAACC,aAAa;MAACE,mBAAmB,EAAEA,mBAAoB;MAAA,GAAKqB,QAAQ;MAAAK,QAAA,EAClEV;IAAa,CACD;EAAC,CACN,CAAC;AAEjB,CAAC;AAED,MAAMW,uBAAuB,GAAGnC,IAAI,CAACuB,eAAe,CAAC;AACrDY,uBAAuB,CAACC,WAAW,GAAG,iBAAiB;AAEvD,SAASD,uBAAuB,IAAIZ,eAAe","ignoreList":[]}

package/dist/esm/Link.js CHANGED Viewed

@@ -10,7 +10,6 @@ import _Link from "@mui/material/Link";
  *
  * See the License for the specific language governing permissions and limitations under the License.
  */
 import { memo, useImperativeHandle, useRef } from "react";
 import { ExternalLinkIcon } from "./icons.generated/index.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
@@ -40,12 +39,12 @@ const Link = ({
     "aria-label": ariaLabel,
     "data-se": testId,
     href: href,
+    onClick: onClick,
     ref: localLinkRef,
     rel: rel,
     target: target,
     translate: translate,
     variant: variant,
-    onClick: onClick,
     children: [icon && _jsx("span", {
       className: "Link-icon",
       children: icon

package/dist/esm/Link.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Link.js","names":["memo","useImperativeHandle","useRef","ExternalLinkIcon","jsx","_jsx","jsxs","_jsxs","linkVariantValues","Link","ariaLabel","children","href","icon","linkRef","rel","target","testId","translate","variant","onClick","localLinkRef","focus","current","_Link","ref","className","role","MemoizedLink","displayName"],"sources":["../../src/Link.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 memo,\n ReactElement,\n ReactNode,\n RefObject,\n useImperativeHandle,\n useRef,\n} from \"react\";\nimport { ~~ExternalLinkIcon~~ } from \"./~~icons~~.~~generated/index.~~js\";\nimport ~~type~~ { ~~HtmlProps~~ } from \"./~~HtmlProps~~.js\";\nimport { FocusHandle } from \"./inputUtils.js\";\n\~~nimport { Link as MuiLink, LinkProps as MuiLinkProps } from \"@mui/material\";\n\~~nexport const linkVariantValues = [\"default\", \"monochrome\"] as const;\n\nexport type LinkProps = {\n /\n The content within the Link\n /\n children: ReactNode;\n /\n The Link destination\n /\n href: string;\n /\n An optional Icon component at the start of the Link\n /\n icon?: ReactElement;\n /\n The ref forwarded to the TextField\n /\n linkRef?: RefObject<FocusHandle>;\n /\n The click event handler for the Link\n /\n onClick?: MuiLinkProps[\"onClick\"];\n /\n The rel attribute defines the relationship between a linked resource and the current document\n \n @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel\n /\n rel?: string;\n /\n The HTML `target` attribute for the Link\n /\n target?:\n \| \"_self\"\n \| \"_blank\"\n \| \"_parent\"\n \| \"_top\"\n \| (string & NonNullable<unknown>);\n /\n The visual presentation of the Link (default or monochrome)\n */\n variant?: (typeof linkVariantValues)[number];\n} & Pick<HtmlProps, \"ariaLabel\" \| \"testId\" \| \"translate\">;\n\nconst Link = ({\n ariaLabel,\n children,\n href,\n icon,\n linkRef,\n rel,\n target,\n testId,\n translate,\n variant,\n onClick,\n}: LinkProps) => {\n const localLinkRef = useRef<HTMLAnchorElement>(null);\n useImperativeHandle(linkRef, () => {\n return {\n focus: () => {\n localLinkRef.current?.focus();\n },\n };\n }, []);\n\n return (\n <MuiLink\n aria-label={ariaLabel}\n data-se={testId}\n href={href}\n ref={localLinkRef}\n rel={rel}\n target={target}\n translate={translate}\n variant={variant}\n ~~onClick={onClick}\n~~ >\n {icon && <span className=\"Link-icon\">{icon}</span>}\n\n {children}\n\n {target === \"_blank\" && (\n <span className=\"Link-indicator\" role=\"presentation\">\n <ExternalLinkIcon />\n </span>\n )}\n </MuiLink>\n );\n};\n\nconst MemoizedLink = memo(Link);\n\nMemoizedLink.displayName = \"Link\";\n\nexport { MemoizedLink as Link };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA~~;;AAEA~~,SACEA,IAAI,EAIJC,mBAAmB,EACnBC,MAAM,QACD,OAAO;~~AACd~~,SAASC,gBAAgB,QAAQ,4BAA4B;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;~~AAM9D~~,OAAO,MAAMC,iBAAiB,GAAG,CAAC,SAAS,EAAE,YAAY,CAAU;AA4CnE,MAAMC,IAAI,GAAGA,CAAC;EACZC,SAAS;EACTC,QAAQ;EACRC,IAAI;EACJC,IAAI;EACJC,OAAO;EACPC,GAAG;EACHC,MAAM;EACNC,MAAM;EACNC,SAAS;EACTC,OAAO;EACPC;AACS,CAAC,KAAK;EACf,MAAMC,YAAY,GAAGnB,MAAM,CAAoB,IAAI,CAAC;EACpDD,mBAAmB,CAACa,OAAO,EAAE,MAAM;IACjC,OAAO;MACLQ,KAAK,EAAEA,CAAA,KAAM;QACXD,YAAY,CAACE,OAAO,EAAED,KAAK,CAAC,CAAC;MAC/B;IACF,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAEN,OACEf,KAAA,CAAAiB,KAAA;IACE,cAAYd,SAAU;IACtB,WAASO,MAAO;IAChBL,IAAI,EAAEA,IAAK;~~IACXa~~,GAAG,EAAEJ,YAAa;IAClBN,GAAG,EAAEA,GAAI;IACTC,MAAM,EAAEA,MAAO;IACfE,SAAS,EAAEA,SAAU;IACrBC,OAAO,EAAEA,OAAQ;~~IACjBC~~,~~OAAO,EAAEA,OAAQ;IAAAT,~~QAAA,GAEhBE,IAAI,IAAIR,IAAA;MAAMqB,SAAS,EAAC,WAAW;MAAAf,QAAA,EAAEE;IAAI,CAAO,CAAC,EAEjDF,QAAQ,EAERK,MAAM,KAAK,QAAQ,IAClBX,IAAA;MAAMqB,SAAS,EAAC,gBAAgB;MAACC,IAAI,EAAC,cAAc;MAAAhB,QAAA,EAClDN,IAAA,CAACF,gBAAgB,IAAE;IAAC,CAChB,CACP;EAAA,CACM,CAAC;AAEd,CAAC;AAED,MAAMyB,YAAY,GAAG5B,IAAI,CAACS,IAAI,CAAC;AAE/BmB,YAAY,CAACC,WAAW,GAAG,MAAM;AAEjC,SAASD,YAAY,IAAInB,IAAI","ignoreList":[]}
1	+ {"version":3,"file":"Link.js","names":["memo","useImperativeHandle","useRef","ExternalLinkIcon","jsx","_jsx","jsxs","_jsxs","linkVariantValues","Link","ariaLabel","children","href","icon","linkRef","rel","target","testId","translate","variant","onClick","localLinkRef","focus","current","_Link","ref","className","role","MemoizedLink","displayName"],"sources":["../../src/Link.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 { Link as MuiLink, LinkProps as MuiLinkProps } from \"@mui/material\";\nimport {\n memo,\n ReactElement,\n ReactNode,\n RefObject,\n useImperativeHandle,\n useRef,\n} from \"react\";\n\nimport type { HtmlProps } from \"./HtmlProps.js\";\n\nimport { ExternalLinkIcon } from \"./icons.generated/index.js\";\nimport { FocusHandle } from \"./inputUtils.js\";\n\nexport const linkVariantValues = [\"default\", \"monochrome\"] as const;\n\nexport type LinkProps = {\n /\n The content within the Link\n /\n children: ReactNode;\n /\n The Link destination\n /\n href: string;\n /\n An optional Icon component at the start of the Link\n /\n icon?: ReactElement;\n /\n The ref forwarded to the TextField\n /\n linkRef?: RefObject<FocusHandle>;\n /\n The click event handler for the Link\n /\n onClick?: MuiLinkProps[\"onClick\"];\n /\n The rel attribute defines the relationship between a linked resource and the current document\n \n @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel\n /\n rel?: string;\n /\n The HTML `target` attribute for the Link\n /\n target?:\n \| \"_self\"\n \| \"_blank\"\n \| \"_parent\"\n \| \"_top\"\n \| (string & NonNullable<unknown>);\n /\n The visual presentation of the Link (default or monochrome)\n */\n variant?: (typeof linkVariantValues)[number];\n} & Pick<HtmlProps, \"ariaLabel\" \| \"testId\" \| \"translate\">;\n\nconst Link = ({\n ariaLabel,\n children,\n href,\n icon,\n linkRef,\n rel,\n target,\n testId,\n translate,\n variant,\n onClick,\n}: LinkProps) => {\n const localLinkRef = useRef<HTMLAnchorElement>(null);\n useImperativeHandle(linkRef, () => {\n return {\n focus: () => {\n localLinkRef.current?.focus();\n },\n };\n }, []);\n\n return (\n <MuiLink\n aria-label={ariaLabel}\n data-se={testId}\n href={href}\n onClick={onClick}\n ref={localLinkRef}\n rel={rel}\n target={target}\n translate={translate}\n variant={variant}\n >\n {icon && <span className=\"Link-icon\">{icon}</span>}\n\n {children}\n\n {target === \"_blank\" && (\n <span className=\"Link-indicator\" role=\"presentation\">\n <ExternalLinkIcon />\n </span>\n )}\n </MuiLink>\n );\n};\n\nconst MemoizedLink = memo(Link);\n\nMemoizedLink.displayName = \"Link\";\n\nexport { MemoizedLink as Link };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,SACEA,IAAI,EAIJC,mBAAmB,EACnBC,MAAM,QACD,OAAO;AAId,SAASC,gBAAgB,QAAQ,4BAA4B;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAG9D,OAAO,MAAMC,iBAAiB,GAAG,CAAC,SAAS,EAAE,YAAY,CAAU;AA4CnE,MAAMC,IAAI,GAAGA,CAAC;EACZC,SAAS;EACTC,QAAQ;EACRC,IAAI;EACJC,IAAI;EACJC,OAAO;EACPC,GAAG;EACHC,MAAM;EACNC,MAAM;EACNC,SAAS;EACTC,OAAO;EACPC;AACS,CAAC,KAAK;EACf,MAAMC,YAAY,GAAGnB,MAAM,CAAoB,IAAI,CAAC;EACpDD,mBAAmB,CAACa,OAAO,EAAE,MAAM;IACjC,OAAO;MACLQ,KAAK,EAAEA,CAAA,KAAM;QACXD,YAAY,CAACE,OAAO,EAAED,KAAK,CAAC,CAAC;MAC/B;IACF,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAEN,OACEf,KAAA,CAAAiB,KAAA;IACE,cAAYd,SAAU;IACtB,WAASO,MAAO;IAChBL,IAAI,EAAEA,IAAK;IACXQ,OAAO,EAAEA,OAAQ;IACjBK,GAAG,EAAEJ,YAAa;IAClBN,GAAG,EAAEA,GAAI;IACTC,MAAM,EAAEA,MAAO;IACfE,SAAS,EAAEA,SAAU;IACrBC,OAAO,EAAEA,OAAQ;IAAAR,QAAA,GAEhBE,IAAI,IAAIR,IAAA;MAAMqB,SAAS,EAAC,WAAW;MAAAf,QAAA,EAAEE;IAAI,CAAO,CAAC,EAEjDF,QAAQ,EAERK,MAAM,KAAK,QAAQ,IAClBX,IAAA;MAAMqB,SAAS,EAAC,gBAAgB;MAACC,IAAI,EAAC,cAAc;MAAAhB,QAAA,EAClDN,IAAA,CAACF,gBAAgB,IAAE;IAAC,CAChB,CACP;EAAA,CACM,CAAC;AAEd,CAAC;AAED,MAAMyB,YAAY,GAAG5B,IAAI,CAACS,IAAI,CAAC;AAE/BmB,YAAY,CAACC,WAAW,GAAG,MAAM;AAEjC,SAASD,YAAY,IAAInB,IAAI","ignoreList":[]}

package/dist/esm/NativeSelect.js CHANGED Viewed

@@ -10,7 +10,6 @@ import _Select from "@mui/material/Select";
  *
  * See the License for the specific language governing permissions and limitations under the License.
  */
 import React, { forwardRef, memo, useCallback, useImperativeHandle, useMemo, useRef } from "react";
 import { Field } from "./Field.js";
 import { getControlState, useInputValues } from "./inputUtils.js";
@@ -76,8 +75,8 @@ const NativeSelect = forwardRef(({
       "data-se": testId
     },
     inputRef: localInputRef,
-    name: idOverride,
     multiple: hasMultipleChoices,
+    name: idOverride,
     native: true,
     onBlur: onBlur,
     onChange: onChange,

package/dist/esm/NativeSelect.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NativeSelect.js","names":["React","forwardRef","memo","useCallback","useImperativeHandle","useMemo","useRef","Field","getControlState","useInputValues","jsx","_jsx","NativeSelect","ariaDescribedBy","autoCompleteType","defaultValue","errorMessage","errorMessageList","hasMultipleChoices","hasMultipleChoicesProp","hint","HintLinkComponent","id","idOverride","inputRef","isDisabled","isFullWidth","isMultiSelect","isOptional","label","onBlur","onChange","onChangeProp","onFocus","testId","translate","value","children","ref","controlledStateRef","controlledValue","uncontrolledValue","localInputRef","focus","current","inputValues","controlState","event","child","undefined","renderFieldComponent","errorMessageElementId","labelElementId","_Select","autoComplete","inputProps","name","multiple","native","fieldType","hasVisibleLabel","MemoizedNativeSelect","displayName"],"sources":["../../src/NativeSelect.tsx"],"sourcesContent":["/!\n Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n \n You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n \n See the License for the specific language governing permissions and limitations under the License.\n /\n\nimport React, {\n InputHTMLAttributes,\n ReactElement,\n forwardRef,\n memo,\n useCallback,\n useImperativeHandle,\n useMemo,\n useRef,\n} from \"react\";\nimport {\n Select as MuiSelect,\n SelectProps as MuiSelectProps,\n} from \"@mui/material\";\nimport { Field } from \"./Field.js\";\nimport {\n FieldComponentProps,\n FieldComponentRenderProps,\n} from \"./FieldComponentProps.js\";\nimport type { HtmlProps } from \"./HtmlProps.js\";\nimport { FocusHandle, getControlState, useInputValues } from \"./inputUtils.js\";\n\nexport type NativeSelectOption = {\n text: string;\n value?: string;\n type?: \"heading\" \| \"option\";\n};\n\nexport type NativeSelectValueType<HasMultipleChoices> =\n HasMultipleChoices extends true ? string[] : string;\n\nexport type NativeSelectProps<\n Value extends NativeSelectValueType<HasMultipleChoices>,\n HasMultipleChoices extends boolean,\n> = {\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 * @see https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill\n /\n autoCompleteType?: InputHTMLAttributes<HTMLInputElement>[\"autoComplete\"];\n /\n The options or optgroup elements within the NativeSelect\n /\n children?: ReactElement<\"option\"> \| ReactElement<\"optgroup\">;\n /\n The default value of the NativeSelect. Use when component is uncontrolled\n /\n defaultValue?: Value;\n /\n If `true`, the Select allows multiple selections\n /\n hasMultipleChoices?: HasMultipleChoices;\n /\n The ref forwarded to the NativeSelect\n /\n inputRef?: React.RefObject<FocusHandle>;\n /\n @deprecated Use `hasMultipleChoices` instead\n /\n /* Deprecated: use `hasMultipleChoices` /\n isMultiSelect?: HasMultipleChoices;\n /\n The label text for the NativeSelect\n /\n label: string;\n /\n Callback fired when the NativeSelect loses focus\n /\n onBlur?: MuiSelectProps<Value>[\"onBlur\"];\n /\n Callback fired when the value of the NativeSelect changes\n /\n onChange?: MuiSelectProps<Value>[\"onChange\"];\n /\n Callback fired when the NativeSelect gains focus\n /\n onFocus?: MuiSelectProps<Value>[\"onFocus\"];\n options: Value;\n /\n The value or values selected in the NativeSelect. Use when component is controlled\n */\n value?: Value;\n} & Pick<\n FieldComponentProps,\n \| \"errorMessage\"\n \| \"errorMessageList\"\n \| \"hint\"\n \| \"HintLinkComponent\"\n \| \"id\"\n \| \"isDisabled\"\n \| \"isFullWidth\"\n \| \"isOptional\"\n> &\n Pick<HtmlProps, \"ariaDescribedBy\" \| \"testId\" \| \"translate\">;\n\ntype NativeSelectRenderProps = Partial<\n Pick<FieldComponentRenderProps, \"ariaDescribedBy\" \| \"errorMessageElementId\">\n> &\n Pick<FieldComponentRenderProps, \"labelElementId\">;\n\nconst NativeSelect = forwardRef(\n <\n Value extends NativeSelectValueType<HasMultipleChoices>,\n HasMultipleChoices extends boolean,\n >(\n {\n ariaDescribedBy,\n autoCompleteType,\n defaultValue,\n errorMessage,\n errorMessageList,\n hasMultipleChoices: hasMultipleChoicesProp,\n hint,\n HintLinkComponent,\n id: idOverride,\n inputRef,\n isDisabled = false,\n isFullWidth = false,\n isMultiSelect,\n isOptional = false,\n label,\n onBlur,\n onChange: onChangeProp,\n onFocus,\n testId,\n translate,\n value,\n children,\n }: NativeSelectProps<Value, HasMultipleChoices>,\n ref?: React.Ref<ReactElement>,\n ) => {\n const controlledStateRef = useRef(\n getControlState({\n controlledValue: value,\n uncontrolledValue: defaultValue,\n }),\n );\n const localInputRef = useRef<HTMLSelectElement>(null);\n\n useImperativeHandle(inputRef, () => {\n return {\n focus: () => {\n localInputRef.current?.focus();\n },\n };\n }, []);\n\n const inputValues = useInputValues({\n defaultValue,\n value,\n controlState: controlledStateRef.current,\n });\n\n const onChange = useCallback<\n NonNullable<MuiSelectProps<Value>[\"onChange\"]>\n >(\n (event, child) => {\n onChangeProp?.(event, child);\n },\n [onChangeProp],\n );\n\n const hasMultipleChoices = useMemo(\n () =>\n hasMultipleChoicesProp === undefined\n ? isMultiSelect\n : hasMultipleChoicesProp,\n [hasMultipleChoicesProp, isMultiSelect],\n );\n const renderFieldComponent = useCallback(\n ({\n ariaDescribedBy,\n errorMessageElementId,\n labelElementId,\n }: NativeSelectRenderProps) => (\n <MuiSelect\n {...inputValues}\n aria-describedby={ariaDescribedBy}\n autoComplete={autoCompleteType}\n children={children}\n id={idOverride}\n inputProps={{\n \"aria-errormessage\": errorMessageElementId,\n \"aria-labelledby\": labelElementId,\n \"data-se\": testId,\n }}\n inputRef={localInputRef}\n name={idOverride}\n multiple={hasMultipleChoices}\n native={true}\n onBlur={onBlur}\n onChange={onChange}\n onFocus={onFocus}\n ref={ref}\n translate={translate}\n />\n ),\n [\n autoCompleteType,\n children,\n idOverride,\n inputValues,\n hasMultipleChoices,\n onBlur,\n onChange,\n onFocus,\n ref,\n testId,\n translate,\n ],\n );\n\n return (\n <Field\n ariaDescribedBy={ariaDescribedBy}\n errorMessage={errorMessage}\n errorMessageList={errorMessageList}\n fieldType=\"single\"\n hasVisibleLabel\n hint={hint}\n HintLinkComponent={HintLinkComponent}\n id={idOverride}\n isDisabled={isDisabled}\n isFullWidth={isFullWidth}\n isOptional={isOptional}\n label={label}\n renderFieldComponent={renderFieldComponent}\n />\n );\n },\n);\n\nconst MemoizedNativeSelect = memo(NativeSelect);\nMemoizedNativeSelect.displayName = \"NativeSelect\";\n\nexport { MemoizedNativeSelect as NativeSelect };\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"NativeSelect.js","names":["React","forwardRef","memo","useCallback","useImperativeHandle","useMemo","useRef","Field","getControlState","useInputValues","jsx","_jsx","NativeSelect","ariaDescribedBy","autoCompleteType","defaultValue","errorMessage","errorMessageList","hasMultipleChoices","hasMultipleChoicesProp","hint","HintLinkComponent","id","idOverride","inputRef","isDisabled","isFullWidth","isMultiSelect","isOptional","label","onBlur","onChange","onChangeProp","onFocus","testId","translate","value","children","ref","controlledStateRef","controlledValue","uncontrolledValue","localInputRef","focus","current","inputValues","controlState","event","child","undefined","renderFieldComponent","errorMessageElementId","labelElementId","_Select","autoComplete","inputProps","multiple","name","native","fieldType","hasVisibleLabel","MemoizedNativeSelect","displayName"],"sources":["../../src/NativeSelect.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 Select as MuiSelect,\n SelectProps as MuiSelectProps,\n} from \"@mui/material\";\nimport React, {\n forwardRef,\n InputHTMLAttributes,\n memo,\n ReactElement,\n useCallback,\n useImperativeHandle,\n useMemo,\n useRef,\n} from \"react\";\n\nimport type { HtmlProps } from \"./HtmlProps.js\";\n\nimport { Field } from \"./Field.js\";\nimport {\n FieldComponentProps,\n FieldComponentRenderProps,\n} from \"./FieldComponentProps.js\";\nimport { FocusHandle, getControlState, useInputValues } from \"./inputUtils.js\";\n\nexport type NativeSelectOption = {\n text: string;\n type?: \"heading\" \| \"option\";\n value?: string;\n};\n\nexport type NativeSelectValueType<HasMultipleChoices> =\n HasMultipleChoices extends true ? string[] : string;\n\nexport type NativeSelectProps<\n Value extends NativeSelectValueType<HasMultipleChoices>,\n HasMultipleChoices extends boolean,\n> = {\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 * @see https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill\n /\n autoCompleteType?: InputHTMLAttributes<HTMLInputElement>[\"autoComplete\"];\n /\n The options or optgroup elements within the NativeSelect\n /\n children?: ReactElement<\"option\"> \| ReactElement<\"optgroup\">;\n /\n The default value of the NativeSelect. Use when component is uncontrolled\n /\n defaultValue?: Value;\n /\n If `true`, the Select allows multiple selections\n /\n hasMultipleChoices?: HasMultipleChoices;\n /\n The ref forwarded to the NativeSelect\n /\n inputRef?: React.RefObject<FocusHandle>;\n /\n @deprecated Use `hasMultipleChoices` instead\n /\n /* Deprecated: use `hasMultipleChoices` /\n isMultiSelect?: HasMultipleChoices;\n /\n The label text for the NativeSelect\n /\n label: string;\n /\n Callback fired when the NativeSelect loses focus\n /\n onBlur?: MuiSelectProps<Value>[\"onBlur\"];\n /\n Callback fired when the value of the NativeSelect changes\n /\n onChange?: MuiSelectProps<Value>[\"onChange\"];\n /\n Callback fired when the NativeSelect gains focus\n /\n onFocus?: MuiSelectProps<Value>[\"onFocus\"];\n options: Value;\n /\n The value or values selected in the NativeSelect. Use when component is controlled\n */\n value?: Value;\n} & Pick<\n FieldComponentProps,\n \| \"errorMessage\"\n \| \"errorMessageList\"\n \| \"hint\"\n \| \"HintLinkComponent\"\n \| \"id\"\n \| \"isDisabled\"\n \| \"isFullWidth\"\n \| \"isOptional\"\n> &\n Pick<HtmlProps, \"ariaDescribedBy\" \| \"testId\" \| \"translate\">;\n\ntype NativeSelectRenderProps = Partial<\n Pick<FieldComponentRenderProps, \"ariaDescribedBy\" \| \"errorMessageElementId\">\n> &\n Pick<FieldComponentRenderProps, \"labelElementId\">;\n\nconst NativeSelect = forwardRef(\n <\n Value extends NativeSelectValueType<HasMultipleChoices>,\n HasMultipleChoices extends boolean,\n >(\n {\n ariaDescribedBy,\n autoCompleteType,\n defaultValue,\n errorMessage,\n errorMessageList,\n hasMultipleChoices: hasMultipleChoicesProp,\n hint,\n HintLinkComponent,\n id: idOverride,\n inputRef,\n isDisabled = false,\n isFullWidth = false,\n isMultiSelect,\n isOptional = false,\n label,\n onBlur,\n onChange: onChangeProp,\n onFocus,\n testId,\n translate,\n value,\n children,\n }: NativeSelectProps<Value, HasMultipleChoices>,\n ref?: React.Ref<ReactElement>,\n ) => {\n const controlledStateRef = useRef(\n getControlState({\n controlledValue: value,\n uncontrolledValue: defaultValue,\n }),\n );\n const localInputRef = useRef<HTMLSelectElement>(null);\n\n useImperativeHandle(inputRef, () => {\n return {\n focus: () => {\n localInputRef.current?.focus();\n },\n };\n }, []);\n\n const inputValues = useInputValues({\n defaultValue,\n value,\n controlState: controlledStateRef.current,\n });\n\n const onChange = useCallback<\n NonNullable<MuiSelectProps<Value>[\"onChange\"]>\n >(\n (event, child) => {\n onChangeProp?.(event, child);\n },\n [onChangeProp],\n );\n\n const hasMultipleChoices = useMemo(\n () =>\n hasMultipleChoicesProp === undefined\n ? isMultiSelect\n : hasMultipleChoicesProp,\n [hasMultipleChoicesProp, isMultiSelect],\n );\n const renderFieldComponent = useCallback(\n ({\n ariaDescribedBy,\n errorMessageElementId,\n labelElementId,\n }: NativeSelectRenderProps) => (\n <MuiSelect\n {...inputValues}\n aria-describedby={ariaDescribedBy}\n autoComplete={autoCompleteType}\n children={children}\n id={idOverride}\n inputProps={{\n \"aria-errormessage\": errorMessageElementId,\n \"aria-labelledby\": labelElementId,\n \"data-se\": testId,\n }}\n inputRef={localInputRef}\n multiple={hasMultipleChoices}\n name={idOverride}\n native={true}\n onBlur={onBlur}\n onChange={onChange}\n onFocus={onFocus}\n ref={ref}\n translate={translate}\n />\n ),\n [\n autoCompleteType,\n children,\n idOverride,\n inputValues,\n hasMultipleChoices,\n onBlur,\n onChange,\n onFocus,\n ref,\n testId,\n translate,\n ],\n );\n\n return (\n <Field\n ariaDescribedBy={ariaDescribedBy}\n errorMessage={errorMessage}\n errorMessageList={errorMessageList}\n fieldType=\"single\"\n hasVisibleLabel\n hint={hint}\n HintLinkComponent={HintLinkComponent}\n id={idOverride}\n isDisabled={isDisabled}\n isFullWidth={isFullWidth}\n isOptional={isOptional}\n label={label}\n renderFieldComponent={renderFieldComponent}\n />\n );\n },\n);\n\nconst MemoizedNativeSelect = memo(NativeSelect);\nMemoizedNativeSelect.displayName = \"NativeSelect\";\n\nexport { MemoizedNativeSelect as NativeSelect };\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/OdysseyCacheProvider.js CHANGED Viewed

@@ -11,9 +11,9 @@
  */
 import createCache from "@emotion/cache";
+import { CacheProvider } from "@emotion/react";
 import { memo, useMemo } from "react";
 import { useUniqueAlphabeticalId } from "./useUniqueAlphabeticalId.js";
-import { CacheProvider } from "@emotion/react";
 import { jsx as _jsx } from "react/jsx-runtime";
 const OdysseyCacheProvider = ({
   children,

package/dist/esm/OdysseyCacheProvider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"OdysseyCacheProvider.js","names":["createCache","memo","useMemo","useUniqueAlphabeticalId","~~CacheProvider","~~jsx","_jsx","OdysseyCacheProvider","children","emotionRoot","emotionRootElement","hasShadowDom","hasShadowDomProp","nonce","shadowDomElement","stylisPlugins","uniqueAlphabeticalId","emotionCache","container","key","globalThis","cspNonce","prepend","speedy","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 var cspNonce: string; // Adding types to `globalThis` requires we use `var`.\n}\n\nimport createCache, { StylisPlugin } from \"@emotion/cache\";\nimport { ~~memo,~~ ~~useMemo, ReactNode~~ } from \"react\";\nimport { ~~useUniqueAlphabeticalId~~ } from \"~~./useUniqueAlphabeticalId.js~~\";\nimport { ~~CacheProvider~~ } from \"~~@emotion/react~~\";\n\nexport type OdysseyCacheProviderProps = {\n children: ReactNode;\n /\n Emotion caches styles into the style element.\n * When enabling this prop, Emotion caches the styles at this element, rather than in <head>.\n * @deprecated Use `EmotionRootElement` instead. This was incorrectly configured as an `HTMLStyleElement`, but then we're rendering `<style>` inside `<style>`. We need this to be a `<div>` instead.\n /\n emotionRoot?: HTMLStyleElement;\n /\n Emotion adds `<style>` elements into this DOM node. Normally, Emotion puts these in `document.head`.\n * This is useful if you want to render into a Shadow DOM or iframe.\n /\n emotionRootElement?: HTMLElement;\n hasShadowDom?: boolean;\n nonce?: string;\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 * @deprecated Will be removed in a future Odyssey version. Use `hasShadowDomElement` instead.\n */\n shadowDomElement?: HTMLDivElement \| HTMLElement;\n stylisPlugins?: StylisPlugin[];\n};\n\nconst OdysseyCacheProvider = ({\n children,\n emotionRoot,\n emotionRootElement,\n hasShadowDom: hasShadowDomProp,\n nonce,\n shadowDomElement,\n stylisPlugins,\n}: OdysseyCacheProviderProps) => {\n const uniqueAlphabeticalId = useUniqueAlphabeticalId();\n\n const hasShadowDom = hasShadowDomProp \|\| shadowDomElement;\n\n const emotionCache = useMemo(() => {\n return createCache({\n ...((emotionRootElement \|\| emotionRoot) && {\n container: emotionRootElement \|\| emotionRoot,\n }),\n key: uniqueAlphabeticalId,\n nonce: nonce ?? globalThis.cspNonce,\n prepend: true,\n speedy: hasShadowDom ? false : true, // <-- Needs to be set to false when shadow-dom is used! https://github.com/emotion-js/emotion/issues/2053#issuecomment-713429122\n ...(stylisPlugins && { stylisPlugins }),\n });\n }, [\n emotionRoot,\n emotionRootElement,\n hasShadowDom,\n nonce,\n stylisPlugins,\n 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;;AAMA,OAAOA,WAAW,MAAwB,gBAAgB;AAC1D,SAASC,IAAI,~~EAAEC~~,OAAO,~~QAAmB~~,OAAO;~~AAChD~~,SAASC,uBAAuB,QAAQ,8BAA8B;~~AACtE,SAASC,aAAa,QAAQ,gBAAgB;~~AAAC,SAAAC,GAAA,IAAAC,IAAA;~~AA0B/C~~,MAAMC,oBAAoB,GAAGA,CAAC;EAC5BC,QAAQ;EACRC,WAAW;EACXC,kBAAkB;EAClBC,YAAY,EAAEC,gBAAgB;EAC9BC,KAAK;EACLC,gBAAgB;EAChBC;AACyB,CAAC,KAAK;EAC/B,MAAMC,oBAAoB,~~GAAGb~~,uBAAuB,CAAC,CAAC;EAEtD,~~MAAMQ~~,YAAY,GAAGC,gBAAgB,IAAIE,gBAAgB;EAEzD,MAAMG,YAAY,~~GAAGf~~,OAAO,CAAC,MAAM;IACjC,~~OAAOF~~,WAAW,CAAC;MACjB,IAAI,CAACU,kBAAkB,IAAID,WAAW,KAAK;QACzCS,SAAS,EAAER,kBAAkB,IAAID;MACnC,CAAC,CAAC;MACFU,GAAG,EAAEH,oBAAoB;MACzBH,KAAK,EAAEA,KAAK,IAAIO,UAAU,CAACC,QAAQ;MACnCC,OAAO,EAAE,IAAI;MACbC,MAAM,EAAEZ,YAAY,GAAG,KAAK,GAAG,IAAI;MACnC,IAAII,aAAa,IAAI;QAAEA;MAAc,CAAC;IACxC,CAAC,CAAC;EACJ,CAAC,EAAE,CACDN,WAAW,EACXC,kBAAkB,EAClBC,YAAY,EACZE,KAAK,EACLE,aAAa,EACbC,oBAAoB,CACrB,CAAC;EAEF,OAAOV,IAAA,~~CAACF~~,aAAa;~~IAACoB~~,KAAK,EAAEP,YAAa;IAAAT,QAAA,EAAEA;EAAQ,CAAgB,CAAC;AACvE,CAAC;AAED,MAAMiB,4BAA4B,~~GAAGxB~~,IAAI,~~CAACM~~,oBAAoB,CAAC;AAC/DkB,4BAA4B,CAACC,WAAW,GAAG,sBAAsB;AAEjE,SAASD,4BAA4B,IAAIlB,oBAAoB","ignoreList":[]}
1	+ {"version":3,"file":"OdysseyCacheProvider.js","names":["createCache","CacheProvider","memo","useMemo","useUniqueAlphabeticalId","jsx","_jsx","OdysseyCacheProvider","children","emotionRoot","emotionRootElement","hasShadowDom","hasShadowDomProp","nonce","shadowDomElement","stylisPlugins","uniqueAlphabeticalId","emotionCache","container","key","globalThis","cspNonce","prepend","speedy","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 var cspNonce: string; // Adding types to `globalThis` requires we use `var`.\n}\n\nimport createCache, { StylisPlugin } from \"@emotion/cache\";\nimport { CacheProvider } from \"@emotion/react\";\nimport { memo, ReactNode, useMemo } from \"react\";\n\nimport { useUniqueAlphabeticalId } from \"./useUniqueAlphabeticalId.js\";\n\nexport type OdysseyCacheProviderProps = {\n children: ReactNode;\n /\n Emotion caches styles into the style element.\n * When enabling this prop, Emotion caches the styles at this element, rather than in <head>.\n * @deprecated Use `EmotionRootElement` instead. This was incorrectly configured as an `HTMLStyleElement`, but then we're rendering `<style>` inside `<style>`. We need this to be a `<div>` instead.\n /\n emotionRoot?: HTMLStyleElement;\n /\n Emotion adds `<style>` elements into this DOM node. Normally, Emotion puts these in `document.head`.\n * This is useful if you want to render into a Shadow DOM or iframe.\n /\n emotionRootElement?: HTMLElement;\n hasShadowDom?: boolean;\n nonce?: string;\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 * @deprecated Will be removed in a future Odyssey version. Use `hasShadowDomElement` instead.\n */\n shadowDomElement?: HTMLDivElement \| HTMLElement;\n stylisPlugins?: StylisPlugin[];\n};\n\nconst OdysseyCacheProvider = ({\n children,\n emotionRoot,\n emotionRootElement,\n hasShadowDom: hasShadowDomProp,\n nonce,\n shadowDomElement,\n stylisPlugins,\n}: OdysseyCacheProviderProps) => {\n const uniqueAlphabeticalId = useUniqueAlphabeticalId();\n\n const hasShadowDom = hasShadowDomProp \|\| shadowDomElement;\n\n const emotionCache = useMemo(() => {\n return createCache({\n ...((emotionRootElement \|\| emotionRoot) && {\n container: emotionRootElement \|\| emotionRoot,\n }),\n key: uniqueAlphabeticalId,\n nonce: nonce ?? globalThis.cspNonce,\n prepend: true,\n speedy: hasShadowDom ? false : true, // <-- Needs to be set to false when shadow-dom is used! https://github.com/emotion-js/emotion/issues/2053#issuecomment-713429122\n ...(stylisPlugins && { stylisPlugins }),\n });\n }, [\n emotionRoot,\n emotionRootElement,\n hasShadowDom,\n nonce,\n stylisPlugins,\n 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;;AAMA,OAAOA,WAAW,MAAwB,gBAAgB;AAC1D,SAASC,aAAa,QAAQ,gBAAgB;AAC9C,SAASC,IAAI,EAAaC,OAAO,QAAQ,OAAO;AAEhD,SAASC,uBAAuB,QAAQ,8BAA8B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AA0BvE,MAAMC,oBAAoB,GAAGA,CAAC;EAC5BC,QAAQ;EACRC,WAAW;EACXC,kBAAkB;EAClBC,YAAY,EAAEC,gBAAgB;EAC9BC,KAAK;EACLC,gBAAgB;EAChBC;AACyB,CAAC,KAAK;EAC/B,MAAMC,oBAAoB,GAAGZ,uBAAuB,CAAC,CAAC;EAEtD,MAAMO,YAAY,GAAGC,gBAAgB,IAAIE,gBAAgB;EAEzD,MAAMG,YAAY,GAAGd,OAAO,CAAC,MAAM;IACjC,OAAOH,WAAW,CAAC;MACjB,IAAI,CAACU,kBAAkB,IAAID,WAAW,KAAK;QACzCS,SAAS,EAAER,kBAAkB,IAAID;MACnC,CAAC,CAAC;MACFU,GAAG,EAAEH,oBAAoB;MACzBH,KAAK,EAAEA,KAAK,IAAIO,UAAU,CAACC,QAAQ;MACnCC,OAAO,EAAE,IAAI;MACbC,MAAM,EAAEZ,YAAY,GAAG,KAAK,GAAG,IAAI;MACnC,IAAII,aAAa,IAAI;QAAEA;MAAc,CAAC;IACxC,CAAC,CAAC;EACJ,CAAC,EAAE,CACDN,WAAW,EACXC,kBAAkB,EAClBC,YAAY,EACZE,KAAK,EACLE,aAAa,EACbC,oBAAoB,CACrB,CAAC;EAEF,OAAOV,IAAA,CAACL,aAAa;IAACuB,KAAK,EAAEP,YAAa;IAAAT,QAAA,EAAEA;EAAQ,CAAgB,CAAC;AACvE,CAAC;AAED,MAAMiB,4BAA4B,GAAGvB,IAAI,CAACK,oBAAoB,CAAC;AAC/DkB,4BAA4B,CAACC,WAAW,GAAG,sBAAsB;AAEjE,SAASD,4BAA4B,IAAIlB,oBAAoB","ignoreList":[]}

package/dist/esm/OdysseyProvider.js CHANGED Viewed

@@ -10,7 +10,6 @@ import _ScopedCssBaseline from "@mui/material/ScopedCssBaseline";
  *
  * See the License for the specific language governing permissions and limitations under the License.
  */
 import { memo } from "react";
 import { OdysseyCacheProvider } from "./OdysseyCacheProvider.js";
 import { OdysseyThemeProvider } from "./OdysseyThemeProvider.js";