npm - @lifesg/react-design-system - Versions diffs - 4.0.0-alpha.3 → 4.0.0-alpha.4 - Mend

@lifesg/react-design-system 4.0.0-alpha.3 → 4.0.0-alpha.4

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 (1304) hide show

package/cjs/language-switcher/dropdown-variant.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dropdown-variant.js","sources":["../../../src/language-switcher/dropdown-variant.tsx"],"sourcesContent":["import { LanguageIcon } from \"@lifesg/react-icons/language\";\nimport type React from \"react\";\nimport { useEffect, useRef, useState } from \"react\";\n\nimport { ExpandableElement } from \"../shared/dropdown-list\";\nimport { ElementWithDropdown } from \"../shared/dropdown-wrapper\";\nimport { useId } from \"../util\";\nimport { ARIA_LABEL, LANGUAGE_CODES, LANGUAGE_DISPLAY_MAP } from \"./data\";\nimport { DropdownPanel } from \"./dropdown-panel\";\nimport * as styles from \"./dropdown-variant.styles\";\nimport type { VariantInternalProps } from \"./internal-types\";\nimport type { LanguageSwitcherCode } from \"./types\";\n\nexport const DropdownVariant = ({\n selectedLanguage,\n onSelectLanguage,\n testId,\n ...otherProps\n}: VariantInternalProps): JSX.Element => {\n // =========================================================================\n // CONST, STATE, REF\n // =========================================================================\n const [isOpen, setIsOpen] = useState(false);\n const [focusedIndex, setFocusedIndex] = useState(-1);\n const triggerRef = useRef<HTMLButtonElement>(null);\n const itemRefs = useRef<(HTMLLIElement \| null)[]>([]);\n\n const id = useId();\n const listboxId = `listbox-${id}`;\n\n // =========================================================================\n // EFFECTS\n // =========================================================================\n useEffect(() => {\n if (isOpen) {\n const selectedIdx = LANGUAGE_CODES.indexOf(selectedLanguage);\n const idx = selectedIdx >= 0 ? selectedIdx : 0;\n setFocusedIndex(idx);\n setTimeout(() => {\n itemRefs.current[idx]?.focus();\n }, 0);\n } else {\n setFocusedIndex(-1);\n }\n }, [isOpen, selectedLanguage]);\n\n // =========================================================================\n // EVENT HANDLERS\n // =========================================================================\n const handleOpen = () => {\n setIsOpen(true);\n };\n\n const handleClose = () => {\n setIsOpen(false);\n };\n\n const handleDismiss = () => {\n setIsOpen(false);\n triggerRef.current?.focus();\n };\n\n const handleItemSelect = (code: LanguageSwitcherCode) => {\n onSelectLanguage(code);\n setIsOpen(false);\n triggerRef.current?.focus();\n };\n\n const handleListKeyDown = (event: React.KeyboardEvent) => {\n switch (event.key) {\n case \"ArrowDown\": {\n event.preventDefault();\n const next = Math.min(\n focusedIndex + 1,\n LANGUAGE_CODES.length - 1\n );\n setFocusedIndex(next);\n itemRefs.current[next]?.focus();\n break;\n }\n case \"ArrowUp\": {\n event.preventDefault();\n const prev = Math.max(focusedIndex - 1, 0);\n setFocusedIndex(prev);\n itemRefs.current[prev]?.focus();\n break;\n }\n case \"Home\": {\n event.preventDefault();\n setFocusedIndex(0);\n itemRefs.current[0]?.focus();\n break;\n }\n case \"End\": {\n event.preventDefault();\n const last = LANGUAGE_CODES.length - 1;\n setFocusedIndex(last);\n itemRefs.current[last]?.focus();\n break;\n }\n case \"Enter\":\n case \" \": {\n event.preventDefault();\n if (focusedIndex >= 0) {\n handleItemSelect(LANGUAGE_CODES[focusedIndex]);\n }\n break;\n }\n }\n };\n\n // =========================================================================\n // RENDER FUNCTIONS\n // =========================================================================\n const renderElement = () => (\n <ExpandableElement\n ref={triggerRef}\n className={styles.expandableElement}\n disabled={false}\n expanded={isOpen}\n listboxId={listboxId}\n popupRole=\"listbox\"\n readOnly={false}\n aria-label={`${ARIA_LABEL}, ${LANGUAGE_DISPLAY_MAP[selectedLanguage]}`}\n data-testid={`${testId}--trigger`}\n >\n <span className={styles.languageIconWrapper} aria-hidden>\n <LanguageIcon />\n </span>\n {LANGUAGE_DISPLAY_MAP[selectedLanguage]}\n </ExpandableElement>\n );\n\n const renderDropdown = () => (\n <DropdownPanel\n focusedIndex={focusedIndex}\n handleItemSelect={handleItemSelect}\n handleListKeyDown={handleListKeyDown}\n itemRefs={itemRefs}\n listboxId={listboxId}\n selectedLanguage={selectedLanguage}\n testId={testId}\n />\n );\n\n // =========================================================================\n // RENDER\n // =========================================================================\n return (\n <div data-testid={testId} {...otherProps}>\n <ElementWithDropdown\n enabled={true}\n isOpen={isOpen}\n renderElement={renderElement}\n renderDropdown={renderDropdown}\n onOpen={handleOpen}\n onClose={handleClose}\n onDismiss={handleDismiss}\n clickToToggle\n offset={8}\n />\n </div>\n );\n};\n"],"names":["_a","selectedLanguage","onSelectLanguage","testId","otherProps","__rest","isOpen","setIsOpen","useState","focusedIndex","setFocusedIndex","triggerRef","useRef","itemRefs","listboxId","useId","useEffect","selectedIdx","LANGUAGE_CODES","indexOf","idx","setTimeout","current","focus","handleItemSelect","code","handleListKeyDown","event","key","preventDefault","next","Math","min","length","prev","max","_b","_c","last","_d","_jsx","children","ElementWithDropdown","enabled","renderElement","_jsxs","ExpandableElement","ref","className","styles.expandableElement","disabled","expanded","popupRole","readOnly","ARIA_LABEL","LANGUAGE_DISPLAY_MAP","styles.languageIconWrapper","LanguageIcon","renderDropdown","DropdownPanel","onOpen","onClose","onDismiss","clickToToggle","offset"],"mappings":"~~qrEAagCA~~,QAAAC,iBAC5BA,EAAgBC,iBAChBA,EAAgBC,OAChBA,KACGC,EAAUC,EAAAA,OAAAL,EAJe,CAAA,mBAAA,mBAAA,WAS5B,MAAOM,EAAQC,GAAaC,EAAAA,UAAS,IAC9BC,EAAcC,GAAmBF,EAAAA,UAAS,GAC3CG,EAAaC,EAAAA,OAA0B,MACvCC,EAAWD,EAAAA,OAAiC,IAG5CE,EAAY,WADPC,EAAAA,UAMXC,EAAAA,WAAU,KACN,GAAIV,EAAQ,CACR,MAAMW,EAAcC,EAAAA,eAAeC,QAAQlB,GACrCmB,EAAMH,GAAe,EAAIA,EAAc,EAC7CP,EAAgBU,GAChBC,YAAW,WACc,QAArBrB,EAAAa,EAASS,QAAQF,UAAI,IAAApB,GAAAA,EAAEuB,OAAO,GAC/B,EACP,MACIb,GAAgB,EACpB,GACD,CAACJ,EAAQL,IAKZ,MAaMuB,EAAoBC,UACtBvB,EAAiBuB,GACjBlB,GAAU,GACQ,QAAlBP,EAAAW,EAAWW,eAAO,IAAAtB,GAAAA,EAAEuB,OAAO,EAGzBG,EAAqBC,gBACvB,OAAQA,EAAMC,KACV,IAAK,YAAa,CACdD,EAAME,iBACN,MAAMC,EAAOC,KAAKC,IACdvB,EAAe,EACfS,EAAAA,eAAee,OAAS,GAE5BvB,EAAgBoB,GACM,QAAtB9B,EAAAa,EAASS,QAAQQ,UAAK,IAAA9B,GAAAA,EAAEuB,QACxB,KACJ,CACA,IAAK,UAAW,CACZI,EAAME,iBACN,MAAMK,EAAOH,KAAKI,IAAI1B,EAAe,EAAG,GACxCC,EAAgBwB,GACM,QAAtBE,EAAAvB,EAASS,QAAQY,UAAK,IAAAE,GAAAA,EAAEb,QACxB,KACJ,CACA,IAAK,OACDI,EAAME,iBACNnB,EAAgB,GACG,QAAnB2B,EAAAxB,EAASS,QAAQ,UAAE,IAAAe,GAAAA,EAAEd,QACrB,MAEJ,IAAK,MAAO,CACRI,EAAME,iBACN,MAAMS,EAAOpB,iBAAee,OAAS,EACrCvB,EAAgB4B,GACM,QAAtBC,EAAA1B,EAASS,QAAQgB,UAAK,IAAAC,GAAAA,EAAEhB,QACxB,KACJ,CACA,IAAK,QACL,IAAK,IACDI,EAAME,iBACFpB,GAAgB,GAChBe,EAAiBN,EAAAA,eAAeT,MA4ChD,OACI+B,EAAAA,uCAAkBrC,GAAYC,EAAU,CAAAqC,SACpCD,EAAAA,IAACE,EAAAA,oBAAmB,CAChBC,SAAS,EACTrC,OAAQA,EACRsC,cAvCU,IAClBC,OAACC,EAAAA,kBAAiB,CACdC,IAAKpC,EACLqC,UAAWC,EAAAA,kBACXC,UAAU,EACVC,SAAU7C,EACVQ,UAAWA,EACXsC,UAAU,UACVC,UAAU,EAAK,aACH,GAAGC,EAAAA,eAAeC,EAAAA,qBAAqBtD,KAAmB,cACzD,GAAGE,aAAiBsC,SAAA,CAEjCD,EAAAA,IAAA,OAAA,CAAMQ,UAAWQ,EAAAA,oBAA0B,eAAA,EAAAf,SACvCD,EAAAA,IAACiB,eAAY,CAAA,KAEhBF,EAAAA,qBAAqBtD,MAyBlByD,eArBW,IACnBlB,EAAAA,IAACmB,EAAAA,cAAa,CACVlD,aAAcA,EACde,iBAAkBA,EAClBE,kBAAmBA,EACnBb,SAAUA,EACVC,UAAWA,EACXb,iBAAkBA,EAClBE,OAAQA,IAcJyD,OA1GO,KACfrD,GAAU,EAAK,EA0GPsD,QAvGQ,KAChBtD,GAAU,EAAM,EAuGRuD,UApGU,WAClBvD,GAAU,GACQ,QAAlBP,EAAAW,EAAWW,eAAO,IAAAtB,GAAAA,EAAEuB,OAAO,EAmGnBwC,eAAa,EACbC,OAAQ,MAEV"}
1	+ {"version":3,"file":"dropdown-variant.js","sources":["../../../src/language-switcher/dropdown-variant.tsx"],"sourcesContent":["import { LanguageIcon } from \"@lifesg/react-icons/language\";\nimport type React from \"react\";\nimport { useEffect, useRef, useState } from \"react\";\n\nimport { ExpandableElement } from \"../shared/dropdown-list\";\nimport { ElementWithDropdown } from \"../shared/dropdown-wrapper\";\nimport { useId } from \"../util\";\nimport { ARIA_LABEL, LANGUAGE_CODES, LANGUAGE_DISPLAY_MAP } from \"./data\";\nimport { DropdownPanel } from \"./dropdown-panel\";\nimport * as styles from \"./dropdown-variant.styles\";\nimport type { VariantInternalProps } from \"./internal-types\";\nimport type { LanguageSwitcherCode } from \"./types\";\n\nexport const DropdownVariant = ({\n selectedLanguage,\n onSelectLanguage,\n testId,\n ...otherProps\n}: VariantInternalProps): JSX.Element => {\n // =========================================================================\n // CONST, STATE, REF\n // =========================================================================\n const [isOpen, setIsOpen] = useState(false);\n const [focusedIndex, setFocusedIndex] = useState(-1);\n const triggerRef = useRef<HTMLButtonElement>(null);\n const itemRefs = useRef<(HTMLLIElement \| null)[]>([]);\n\n const id = useId();\n const listboxId = `listbox-${id}`;\n\n // =========================================================================\n // EFFECTS\n // =========================================================================\n useEffect(() => {\n if (isOpen) {\n const selectedIdx = LANGUAGE_CODES.indexOf(selectedLanguage);\n const idx = selectedIdx >= 0 ? selectedIdx : 0;\n setFocusedIndex(idx);\n setTimeout(() => {\n itemRefs.current[idx]?.focus();\n }, 0);\n } else {\n setFocusedIndex(-1);\n }\n }, [isOpen, selectedLanguage]);\n\n // =========================================================================\n // EVENT HANDLERS\n // =========================================================================\n const handleOpen = () => {\n setIsOpen(true);\n };\n\n const handleClose = () => {\n setIsOpen(false);\n };\n\n const handleDismiss = () => {\n setIsOpen(false);\n triggerRef.current?.focus();\n };\n\n const handleItemSelect = (code: LanguageSwitcherCode) => {\n onSelectLanguage(code);\n setIsOpen(false);\n triggerRef.current?.focus();\n };\n\n const handleListKeyDown = (event: React.KeyboardEvent) => {\n switch (event.key) {\n case \"ArrowDown\": {\n event.preventDefault();\n const next = Math.min(\n focusedIndex + 1,\n LANGUAGE_CODES.length - 1\n );\n setFocusedIndex(next);\n itemRefs.current[next]?.focus();\n break;\n }\n case \"ArrowUp\": {\n event.preventDefault();\n const prev = Math.max(focusedIndex - 1, 0);\n setFocusedIndex(prev);\n itemRefs.current[prev]?.focus();\n break;\n }\n case \"Home\": {\n event.preventDefault();\n setFocusedIndex(0);\n itemRefs.current[0]?.focus();\n break;\n }\n case \"End\": {\n event.preventDefault();\n const last = LANGUAGE_CODES.length - 1;\n setFocusedIndex(last);\n itemRefs.current[last]?.focus();\n break;\n }\n case \"Enter\":\n case \" \": {\n event.preventDefault();\n if (focusedIndex >= 0) {\n handleItemSelect(LANGUAGE_CODES[focusedIndex]);\n }\n break;\n }\n }\n };\n\n // =========================================================================\n // RENDER FUNCTIONS\n // =========================================================================\n const renderElement = () => (\n <ExpandableElement\n ref={triggerRef}\n className={styles.expandableElement}\n disabled={false}\n expanded={isOpen}\n listboxId={listboxId}\n popupRole=\"listbox\"\n readOnly={false}\n aria-label={`${ARIA_LABEL}, ${LANGUAGE_DISPLAY_MAP[selectedLanguage]}`}\n data-testid={`${testId}--trigger`}\n >\n <span className={styles.languageIconWrapper} aria-hidden>\n <LanguageIcon />\n </span>\n {LANGUAGE_DISPLAY_MAP[selectedLanguage]}\n </ExpandableElement>\n );\n\n const renderDropdown = () => (\n <DropdownPanel\n focusedIndex={focusedIndex}\n handleItemSelect={handleItemSelect}\n handleListKeyDown={handleListKeyDown}\n itemRefs={itemRefs}\n listboxId={listboxId}\n selectedLanguage={selectedLanguage}\n testId={testId}\n />\n );\n\n // =========================================================================\n // RENDER\n // =========================================================================\n return (\n <div data-testid={testId} {...otherProps}>\n <ElementWithDropdown\n enabled={true}\n isOpen={isOpen}\n renderElement={renderElement}\n renderDropdown={renderDropdown}\n onOpen={handleOpen}\n onClose={handleClose}\n onDismiss={handleDismiss}\n clickToToggle\n offset={8}\n />\n </div>\n );\n};\n"],"names":["_a","selectedLanguage","onSelectLanguage","testId","otherProps","__rest","isOpen","setIsOpen","useState","focusedIndex","setFocusedIndex","triggerRef","useRef","itemRefs","listboxId","useId","useEffect","selectedIdx","LANGUAGE_CODES","indexOf","idx","setTimeout","current","focus","handleItemSelect","code","handleListKeyDown","event","key","preventDefault","next","Math","min","length","prev","max","_b","_c","last","_d","_jsx","children","ElementWithDropdown","enabled","renderElement","_jsxs","ExpandableElement","ref","className","styles.expandableElement","disabled","expanded","popupRole","readOnly","ARIA_LABEL","LANGUAGE_DISPLAY_MAP","styles.languageIconWrapper","LanguageIcon","renderDropdown","DropdownPanel","onOpen","onClose","onDismiss","clickToToggle","offset"],"mappings":"krEAagCA,QAAAC,iBAC5BA,EAAgBC,iBAChBA,EAAgBC,OAChBA,KACGC,EAAUC,EAAAA,OAAAL,EAJe,CAAA,mBAAA,mBAAA,WAS5B,MAAOM,EAAQC,GAAaC,EAAAA,UAAS,IAC9BC,EAAcC,GAAmBF,EAAAA,UAAS,GAC3CG,EAAaC,EAAAA,OAA0B,MACvCC,EAAWD,EAAAA,OAAiC,IAG5CE,EAAY,WADPC,EAAAA,UAMXC,EAAAA,WAAU,KACN,GAAIV,EAAQ,CACR,MAAMW,EAAcC,EAAAA,eAAeC,QAAQlB,GACrCmB,EAAMH,GAAe,EAAIA,EAAc,EAC7CP,EAAgBU,GAChBC,YAAW,WACc,QAArBrB,EAAAa,EAASS,QAAQF,UAAI,IAAApB,GAAAA,EAAEuB,OAAO,GAC/B,EACP,MACIb,GAAgB,EACpB,GACD,CAACJ,EAAQL,IAKZ,MAaMuB,EAAoBC,UACtBvB,EAAiBuB,GACjBlB,GAAU,GACQ,QAAlBP,EAAAW,EAAWW,eAAO,IAAAtB,GAAAA,EAAEuB,OAAO,EAGzBG,EAAqBC,gBACvB,OAAQA,EAAMC,KACV,IAAK,YAAa,CACdD,EAAME,iBACN,MAAMC,EAAOC,KAAKC,IACdvB,EAAe,EACfS,EAAAA,eAAee,OAAS,GAE5BvB,EAAgBoB,GACM,QAAtB9B,EAAAa,EAASS,QAAQQ,UAAK,IAAA9B,GAAAA,EAAEuB,QACxB,KACJ,CACA,IAAK,UAAW,CACZI,EAAME,iBACN,MAAMK,EAAOH,KAAKI,IAAI1B,EAAe,EAAG,GACxCC,EAAgBwB,GACM,QAAtBE,EAAAvB,EAASS,QAAQY,UAAK,IAAAE,GAAAA,EAAEb,QACxB,KACJ,CACA,IAAK,OACDI,EAAME,iBACNnB,EAAgB,GACG,QAAnB2B,EAAAxB,EAASS,QAAQ,UAAE,IAAAe,GAAAA,EAAEd,QACrB,MAEJ,IAAK,MAAO,CACRI,EAAME,iBACN,MAAMS,EAAOpB,iBAAee,OAAS,EACrCvB,EAAgB4B,GACM,QAAtBC,EAAA1B,EAASS,QAAQgB,UAAK,IAAAC,GAAAA,EAAEhB,QACxB,KACJ,CACA,IAAK,QACL,IAAK,IACDI,EAAME,iBACFpB,GAAgB,GAChBe,EAAiBN,EAAAA,eAAeT,MA4ChD,OACI+B,EAAAA,uCAAkBrC,GAAYC,EAAU,CAAAqC,SACpCD,EAAAA,IAACE,EAAAA,oBAAmB,CAChBC,SAAS,EACTrC,OAAQA,EACRsC,cAvCU,IAClBC,OAACC,EAAAA,kBAAiB,CACdC,IAAKpC,EACLqC,UAAWC,EAAAA,kBACXC,UAAU,EACVC,SAAU7C,EACVQ,UAAWA,EACXsC,UAAU,UACVC,UAAU,EAAK,aACH,GAAGC,EAAAA,eAAeC,EAAAA,qBAAqBtD,KAAmB,cACzD,GAAGE,aAAiBsC,SAAA,CAEjCD,EAAAA,IAAA,OAAA,CAAMQ,UAAWQ,EAAAA,oBAA0B,eAAA,EAAAf,SACvCD,EAAAA,IAACiB,eAAY,CAAA,KAEhBF,EAAAA,qBAAqBtD,MAyBlByD,eArBW,IACnBlB,EAAAA,IAACmB,EAAAA,cAAa,CACVlD,aAAcA,EACde,iBAAkBA,EAClBE,kBAAmBA,EACnBb,SAAUA,EACVC,UAAWA,EACXb,iBAAkBA,EAClBE,OAAQA,IAcJyD,OA1GO,KACfrD,GAAU,EAAK,EA0GPsD,QAvGQ,KAChBtD,GAAU,EAAM,EAuGRuD,UApGU,WAClBvD,GAAU,GACQ,QAAlBP,EAAAW,EAAWW,eAAO,IAAAtB,GAAAA,EAAEuB,OAAO,EAmGnBwC,eAAa,EACbC,OAAQ,MAEV"}

package/cjs/language-switcher/dropdown-variant.styles.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";require("./dropdown-variant.styles_16c4wc1.css");exports.expandableElement="efqyehf",exports.languageIconWrapper="ljv0l5v";
+"use strict";require("./dropdown-variant.styles_1vrdfky.css");exports.expandableElement="efqyehf",exports.languageIconWrapper="ljv0l5v";
 //# sourceMappingURL=dropdown-variant.styles.js.map

package/cjs/language-switcher/dropdown-variant.styles_1vrdfky.css ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ .efqyehf{min-width:9rem;width:auto;font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-md);font-weight:var(--fds-font-weight-semibold);line-height:var(--fds-font-body-lh-md);letter-spacing:var(--fds-font-body-ls-md);color:var(--fds-colour-text-primary);height:2.5rem;padding:0 var(--fds-spacing-16);border-radius:var(--fds-radius-sm);border:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);background:var(--fds-colour-bg);}.efqyehf .i11rk48k{margin-left:auto;}.efqyehf .i11rk48k svg{color:var(--fds-colour-text-selected);}.efqyehf:focus-visible{outline:2px solid var(--fds-colour-focus-ring);outline-offset:-2px;}
2	+ .ljv0l5v{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--fds-colour-icon-primary);}.ljv0l5v svg{height:1rem;width:1rem;}

package/cjs/language-switcher/link-container-variant.styles.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";require("./link-container-variant.styles_1blx9qm.css");exports.linkContainerWrapper="ldxubbp",exports.linkItem="lrbzpdb",exports.linkItemActive="l1retz23",exports.linkList="lqgsuoq",exports.linkListItem="l3egc8p";
+"use strict";require("./link-container-variant.styles_1iw6zux.css");exports.linkContainerWrapper="ldxubbp",exports.linkItem="lrbzpdb",exports.linkItemActive="l1retz23",exports.linkList="lqgsuoq",exports.linkListItem="l3egc8p";
 //# sourceMappingURL=link-container-variant.styles.js.map

package/cjs/language-switcher/{link-container-variant.styles_1blx9qm.css → link-container-variant.styles_1iw6zux.css} RENAMED Viewed

@@ -1,5 +1,5 @@
 .ldxubbp{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;padding:var(--fds-spacing-8) var(--fds-spacing-16);-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border-radius:var(--fds-radius-sm);border:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);background:var(--fds-colour-bg);}
 .lqgsuoq{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;list-style:none;margin:0;padding:0;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:0 var(--fds-spacing-8);-webkit-box-flex-wrap:wrap;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;}
 .l3egc8p{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
-.lrbzpdb{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;padding:0.25rem 0.5rem;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:0.625rem;border:none;border-radius:var(--fds-radius-md);font-family:var(--fds-font-family);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-md);font-weight:var(--fds-font-weight-semibold);line-height:var(--fds-font-body-lh-md);letter-spacing:var(--fds-font-body-ls-md);color:var(--fds-colour-text-subtler);text-align:center;-webkit-transition:color var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);transition:color var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);background:none;cursor:pointer;}.lrbzpdb:hover{color:var(--fds-colour-text-hover);-webkit-text-decoration:underline;text-decoration:underline;}.lrbzpdb:focus-visible{outline:2px solid var(--fds-colour-focus-ring);outline-offset:-2px;}
+.lrbzpdb{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;padding:0.25rem 0.5rem;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:0.625rem;border:none;border-radius:var(--fds-radius-md);font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-md);font-weight:var(--fds-font-weight-semibold);line-height:var(--fds-font-body-lh-md);letter-spacing:var(--fds-font-body-ls-md);color:var(--fds-colour-text-subtler);text-align:center;-webkit-transition:color var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);transition:color var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);background:none;cursor:pointer;}.lrbzpdb:hover{color:var(--fds-colour-text-hover);-webkit-text-decoration:underline;text-decoration:underline;}.lrbzpdb:focus-visible{outline:2px solid var(--fds-colour-focus-ring);outline-offset:-2px;}
 .l1retz23{background:var(--fds-colour-bg-primary-subtler);color:var(--fds-colour-text-selected);cursor:default;}.l1retz23:hover{color:var(--fds-colour-text-selected);-webkit-text-decoration:none;text-decoration:none;}

package/cjs/layout/col-div.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var e=require("../_virtual/_tslib.js"),s=require("react/jsx-runtime"),r=require("clsx"),t=require("react");require("../theme/theme-provider/index.js");var n=require("../theme/utils/css-variable.js");require("../theme/theme-provider/context.js"),require("../theme/tokens/border.js");var a=require("../theme/tokens/breakpoint.js");require("../theme/tokens/colour.js"),require("../theme/tokens/font.js"),require("../theme/tokens/media-query.js");var l=require("../theme/utils/use-apply-styles.js");require("../theme/utils/use-media-query.js"),require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js");var o=require("../util/merge-refs.js");require("../util/simple-id-generator.js"),require("../util/string-helper.js"),require("@react-aria/live-announcer");var i=require("./col-div.styles.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var x=u(r),d=u(t);const m={xxs:{start:i.tokens.xxsStart,span:i.tokens.xxsSpan,end:i.tokens.xxsEnd},xs:{start:i.tokens.xsStart,span:i.tokens.xsSpan,end:i.tokens.xsEnd},sm:{start:i.tokens.smStart,span:i.tokens.smSpan,end:i.tokens.smEnd},md:{start:i.tokens.mdStart,span:i.tokens.mdSpan,end:i.tokens.mdEnd},lg:{start:i.tokens.lgStart,span:i.tokens.lgSpan,end:i.tokens.lgEnd},xl:{start:i.tokens.xlStart,span:i.tokens.xlSpan,end:i.tokens.xlEnd},xxl:{start:i.tokens.xxlStart,span:i.tokens.xxlSpan,end:i.tokens.xxlEnd}},p=e=>{var s,r;const t=n.parseCSSVariableValue(e,null!==(r=null===(s=globalThis.document)||void 0===s?void 0:s.documentElement)&&void 0!==r?r:null),a=parseInt(t,10);return Number.isNaN(a)?1/0:a},c=d.default.forwardRef(((r,n)=>{const{xxlCols:u,xlCols:d,lgCols:c,mdCols:k,smCols:v,xsCols:f,xxsCols:j,className:q}=r,S=e.__rest(r,["xxlCols","xlCols","lgCols","mdCols","smCols","xsCols","xxsCols","className"]),g=t.useRef(null),h=o.mergeRefs(g,n),C=(e,s)=>{if(!e)return{start:void 0,span:void 0,end:void 0};if(Array.isArray(e)){const[r,t]=e;if(-1===t)return{start:r,span:void 0,end:-1};const n=p(s);return{start:r,span:Math.min(t-r,n),end:void 0}}const r=p(s);return{start:void 0,span:Math.min(e,r),end:void 0}};return l.useApplyStyle(g,Object.assign({},(()=>{const e=C(j,a.Breakpoint["xxs-column"]),s=C(f||j,a.Breakpoint["xs-column"]),r=C(v||f||j,a.Breakpoint["sm-column"]),t=C(k||v||f||j,a.Breakpoint["md-column"]),n=C(c||k||v||f||j,a.Breakpoint["lg-column"]),l=C(d||c||k||v||f||j,a.Breakpoint["xl-column"]),o=C(u||d||c||k||v||f||j,a.Breakpoint["xxl-column"]),i={};return[{result:e,prefix:"xxs"},{result:s,prefix:"xs"},{result:r,prefix:"sm"},{result:t,prefix:"md"},{result:n,prefix:"lg"},{result:l,prefix:"xl"},{result:o,prefix:"xxl"}].forEach((({result:e,prefix:s})=>{const r=m[s];e.start&&(i[r.start]=String(e.start)),e.span&&(i[r.span]=String(e.span)),e.end&&(i[r.end]=String(e.end))})),i})())),s.jsx("div",Object.assign({ref:h,className:x.default(i.colDiv,q)},S))}));exports.ColDiv=c;
+"use strict";var e=require("../_virtual/_tslib.js"),s=require("react/jsx-runtime"),r=require("clsx"),t=require("react");require("../theme/theme-provider/index.js");var n=require("../theme/utils/css-variable.js");require("../theme/theme-provider/context.js"),require("../theme/tokens/border.js");var a=require("../theme/tokens/breakpoint.js");require("../theme/tokens/colour.js"),require("../theme/tokens/font.js"),require("../theme/tokens/media-query.js");var l=require("../theme/utils/use-apply-styles.js");require("../theme/utils/use-media-query.js"),require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js");var o=require("../util/merge-refs.js");require("../util/simple-id-generator.js"),require("../util/string-helper.js"),require("@react-aria/live-announcer");var i=require("../util/use-mount.js"),u=require("./col-div.styles.js");function x(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=x(r),m=x(t);const p={xxs:{start:u.tokens.xxsStart,span:u.tokens.xxsSpan,end:u.tokens.xxsEnd},xs:{start:u.tokens.xsStart,span:u.tokens.xsSpan,end:u.tokens.xsEnd},sm:{start:u.tokens.smStart,span:u.tokens.smSpan,end:u.tokens.smEnd},md:{start:u.tokens.mdStart,span:u.tokens.mdSpan,end:u.tokens.mdEnd},lg:{start:u.tokens.lgStart,span:u.tokens.lgSpan,end:u.tokens.lgEnd},xl:{start:u.tokens.xlStart,span:u.tokens.xlSpan,end:u.tokens.xlEnd},xxl:{start:u.tokens.xxlStart,span:u.tokens.xxlSpan,end:u.tokens.xxlEnd}},c=e=>{var s,r;const t=n.parseCSSVariableValue(e,null!==(r=null===(s=globalThis.document)||void 0===s?void 0:s.documentElement)&&void 0!==r?r:null),a=parseInt(t,10);return Number.isNaN(a)?1/0:a},k=m.default.forwardRef(((r,n)=>{const{xxlCols:x,xlCols:m,lgCols:k,mdCols:v,smCols:f,xsCols:j,xxsCols:q,className:S}=r,h=e.__rest(r,["xxlCols","xlCols","lgCols","mdCols","smCols","xsCols","xxsCols","className"]),g=i.useIsMounted(),C=t.useRef(null),y=o.mergeRefs(C,n),b=(e,s)=>{if(!e)return{start:void 0,span:void 0,end:void 0};if(Array.isArray(e)){const[r,t]=e;if(-1===t)return{start:r,span:void 0,end:-1};const n=c(s);return{start:r,span:Math.min(t-r,n),end:void 0}}const r=c(s);return{start:void 0,span:Math.min(e,r),end:void 0}};return l.useApplyStyle(C,g?(()=>{const e=b(q,a.Breakpoint["xxs-column"]),s=b(j||q,a.Breakpoint["xs-column"]),r=b(f||j||q,a.Breakpoint["sm-column"]),t=b(v||f||j||q,a.Breakpoint["md-column"]),n=b(k||v||f||j||q,a.Breakpoint["lg-column"]),l=b(m||k||v||f||j||q,a.Breakpoint["xl-column"]),o=b(x||m||k||v||f||j||q,a.Breakpoint["xxl-column"]),i={};return[{result:e,prefix:"xxs"},{result:s,prefix:"xs"},{result:r,prefix:"sm"},{result:t,prefix:"md"},{result:n,prefix:"lg"},{result:l,prefix:"xl"},{result:o,prefix:"xxl"}].forEach((({result:e,prefix:s})=>{const r=p[s];e.start&&(i[r.start]=String(e.start)),e.span&&(i[r.span]=String(e.span)),e.end&&(i[r.end]=String(e.end))})),i})():{}),s.jsx("div",Object.assign({ref:y,className:d.default(u.colDiv,S)},h))}));exports.ColDiv=k;
 //# sourceMappingURL=col-div.js.map

package/cjs/layout/col-div.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"col-div.js","sources":["../../../src/layout/col-div.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useRef } from \"react\";\n\nimport { type BreakpointCSSVariableString, useApplyStyle } from \"../theme\";\nimport { Breakpoint } from \"../theme/tokens/breakpoint\";\nimport { parseCSSVariableValue } from \"../theme/utils/css-variable\";\nimport { mergeRefs } from \"../util\";\nimport * as styles from \"./col-div.styles\";\nimport type { ColDivProps } from \"./types\";\n\nconst TOKEN_MAP: Record<string, Record<string, string>> = {\n xxs: {\n start: styles.tokens.xxsStart,\n span: styles.tokens.xxsSpan,\n end: styles.tokens.xxsEnd,\n },\n xs: {\n start: styles.tokens.xsStart,\n span: styles.tokens.xsSpan,\n end: styles.tokens.xsEnd,\n },\n sm: {\n start: styles.tokens.smStart,\n span: styles.tokens.smSpan,\n end: styles.tokens.smEnd,\n },\n md: {\n start: styles.tokens.mdStart,\n span: styles.tokens.mdSpan,\n end: styles.tokens.mdEnd,\n },\n lg: {\n start: styles.tokens.lgStart,\n span: styles.tokens.lgSpan,\n end: styles.tokens.lgEnd,\n },\n xl: {\n start: styles.tokens.xlStart,\n span: styles.tokens.xlSpan,\n end: styles.tokens.xlEnd,\n },\n xxl: {\n start: styles.tokens.xxlStart,\n span: styles.tokens.xxlSpan,\n end: styles.tokens.xxlEnd,\n },\n};\n\nconst getColCount = (token: BreakpointCSSVariableString): number => {\n const value = parseCSSVariableValue(\n token,\n globalThis.document?.documentElement ?? null\n );\n const parsed = parseInt(value, 10);\n return Number.isNaN(parsed) ? Infinity : parsed;\n};\n\nconst Component = (\n props: ColDivProps,\n ref: React.Ref<HTMLDivElement>\n): JSX.Element => {\n const {\n xxlCols,\n xlCols,\n lgCols,\n mdCols,\n smCols,\n xsCols,\n xxsCols,\n className,\n ...otherProps\n } = props;\n\n const rootRef = useRef<HTMLDivElement>(null);\n const mergedRef = mergeRefs(rootRef, ref);\n\n const getColSpan = (\n cols: number \| [number, number] \| undefined,\n colToken: (typeof Breakpoint)[keyof typeof Breakpoint]\n ) => {\n if (!cols) return { start: undefined, span: undefined, end: undefined };\n\n if (Array.isArray(cols)) {\n const [start, end] = cols;\n if (end === -1) {\n return { start, span: undefined, end: -1 };\n }\n const maxCols = getColCount(colToken);\n return {\n start,\n span: Math.min(end - start, maxCols),\n end: undefined,\n };\n }\n\n const maxCols = getColCount(colToken);\n return {\n start: undefined,\n span: Math.min(cols, maxCols),\n end: undefined,\n };\n };\n\n const getCssVars = () => {\n const xxsResult = getColSpan(xxsCols, Breakpoint[\"xxs-column\"]);\n const xsResult = getColSpan(xsCols \|\| xxsCols, Breakpoint[\"xs-column\"]);\n const smResult = getColSpan(\n smCols \|\| xsCols \|\| xxsCols,\n Breakpoint[\"sm-column\"]\n );\n const mdResult = getColSpan(\n mdCols \|\| smCols \|\| xsCols \|\| xxsCols,\n Breakpoint[\"md-column\"]\n );\n const lgResult = getColSpan(\n lgCols \|\| mdCols \|\| smCols \|\| xsCols \|\| xxsCols,\n Breakpoint[\"lg-column\"]\n );\n const xlResult = getColSpan(\n xlCols \|\| lgCols \|\| mdCols \|\| smCols \|\| xsCols \|\| xxsCols,\n Breakpoint[\"xl-column\"]\n );\n const xxlResult = getColSpan(\n xxlCols \|\|\n xlCols \|\|\n lgCols \|\|\n mdCols \|\|\n smCols \|\|\n xsCols \|\|\n xxsCols,\n Breakpoint[\"xxl-column\"]\n );\n\n const cssVars: Record<string, string> = {};\n\n const results = [\n { result: xxsResult, prefix: \"xxs\" },\n { result: xsResult, prefix: \"xs\" },\n { result: smResult, prefix: \"sm\" },\n { result: mdResult, prefix: \"md\" },\n { result: lgResult, prefix: \"lg\" },\n { result: xlResult, prefix: \"xl\" },\n { result: xxlResult, prefix: \"xxl\" },\n ];\n\n results.forEach(({ result, prefix }) => {\n const tokens = TOKEN_MAP[prefix];\n if (result.start) cssVars[tokens.start] = String(result.start);\n if (result.span) cssVars[tokens.span] = String(result.span);\n if (result.end) cssVars[tokens.end] = String(result.end);\n });\n\n return cssVars;\n };\n\n useApplyStyle(rootRef, ~~{\n ...~~getCssVars()~~,\n~~ });\n\n return (\n <div\n ref={mergedRef}\n className={clsx(styles.colDiv, className)}\n {...otherProps}\n />\n );\n};\n\nexport const ColDiv = React.forwardRef(Component);\n"],"names":["TOKEN_MAP","xxs","start","styles.tokens","xxsStart","span","xxsSpan","end","xxsEnd","xs","xsStart","xsSpan","xsEnd","sm","smStart","smSpan","smEnd","md","mdStart","mdSpan","mdEnd","lg","lgStart","lgSpan","lgEnd","xl","xlStart","xlSpan","xlEnd","xxl","xxlStart","xxlSpan","xxlEnd","getColCount","token","value","parseCSSVariableValue","_b","_a","globalThis","document","documentElement","parsed","parseInt","Number","isNaN","Infinity","ColDiv","React","forwardRef","props","ref","xxlCols","xlCols","lgCols","mdCols","smCols","xsCols","xxsCols","className","otherProps","__rest","rootRef","useRef","mergedRef","mergeRefs","getColSpan","cols","colToken","undefined","Array","isArray","maxCols","Math","min","useApplyStyle","~~Object","assign","~~xxsResult","Breakpoint","xsResult","smResult","mdResult","lgResult","xlResult","xxlResult","cssVars","result","prefix","forEach","tokens","String","getCssVars","_jsx","clsx","styles.colDiv"],"mappings":"~~m5BAUA~~,MAAMA,EAAoD,CACtDC,IAAK,CACDC,MAAOC,EAAAA,OAAcC,SACrBC,KAAMF,EAAAA,OAAcG,QACpBC,IAAKJ,EAAAA,OAAcK,QAEvBC,GAAI,CACAP,MAAOC,EAAAA,OAAcO,QACrBL,KAAMF,EAAAA,OAAcQ,OACpBJ,IAAKJ,EAAAA,OAAcS,OAEvBC,GAAI,CACAX,MAAOC,EAAAA,OAAcW,QACrBT,KAAMF,EAAAA,OAAcY,OACpBR,IAAKJ,EAAAA,OAAca,OAEvBC,GAAI,CACAf,MAAOC,EAAAA,OAAce,QACrBb,KAAMF,EAAAA,OAAcgB,OACpBZ,IAAKJ,EAAAA,OAAciB,OAEvBC,GAAI,CACAnB,MAAOC,EAAAA,OAAcmB,QACrBjB,KAAMF,EAAAA,OAAcoB,OACpBhB,IAAKJ,EAAAA,OAAcqB,OAEvBC,GAAI,CACAvB,MAAOC,EAAAA,OAAcuB,QACrBrB,KAAMF,EAAAA,OAAcwB,OACpBpB,IAAKJ,EAAAA,OAAcyB,OAEvBC,IAAK,CACD3B,MAAOC,EAAAA,OAAc2B,SACrBzB,KAAMF,EAAAA,OAAc4B,QACpBxB,IAAKJ,EAAAA,OAAc6B,SAIrBC,EAAeC,YACjB,MAAMC,EAAQC,EAAAA,sBACVF,EACoC,QAApCG,EAAmB,QAAnBC,EAAAC,WAAWC,gBAAQ,IAAAF,OAAA,EAAAA,EAAEG,uBAAe,IAAAJ,EAAAA,EAAI,MAEtCK,EAASC,SAASR,EAAO,IAC/B,OAAOS,OAAOC,MAAMH,GAAUI,IAAWJ,CAAM,~~EAkHtCK~~,EAASC,EAAAA,QAAMC,~~YA/GV~~,CACdC,EACAC,KAEA,MAAMC,QACFA,EAAOC,OACPA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,QACNA,EAAOC,UACPA,GAEAT,EADGU,EAAUC,EAAAA,OACbX,EAVE,CAAA,UAAA,SAAA,SAAA,SAAA,SAAA,SAAA,UAAA,cAYAY,EAAUC,EAAAA,OAAuB,MACjCC,EAAYC,EAAAA,UAAUH,~~EAASX~~,GAE/Be,EAAa,CACfC,EACAC,KAEA,IAAKD,EAAM,MAAO,~~CAAEjE~~,~~WAAOmE~~,~~EAAWhE~~,~~UAAMgE~~,~~EAAW9D~~,~~SAAK8D~~,GAE5D,GAAIC,MAAMC,QAAQJ,GAAO,CACrB,~~MAAOjE~~,EAAOK,~~GAAO4D~~,EACrB,IAAY,~~IAAR5D~~,EACA,MAAO,CAAEL,QAAOG,~~UAAMgE~~,~~EAAW9D~~,KAAK,GAE1C,~~MAAMiE~~,~~EAAUvC~~,~~EAAYmC~~,GAC5B,MAAO,~~CACHlE~~,QACAG,~~KAAMoE~~,KAAKC,~~IAAInE~~,EAAML,~~EAAOsE~~,~~GAC5BjE~~,~~SAAK8D~~,EAEb,CAEA,MAAMG,~~EAAUvC~~,~~EAAYmC~~,GAC5B,MAAO,~~CACHlE~~,~~WAAOmE~~,~~EACPhE~~,~~KAAMoE~~,KAAKC,IAAIP,EAAMK,~~GACrBjE~~,~~SAAK8D~~,EACR,~~EA2DL~~,~~OAJAM~~,EAAAA,cAAcb,~~EAAOc~~,~~OAAAC~~,~~OAAA,CAAA,EApDF,~~MACf,~~MAAMC~~,~~EAAYZ~~,~~EAAWR~~,EAASqB,EAAAA,WAAW,eAC3CC,~~EAAWd~~,~~EAAWT~~,GAAUC,EAASqB,EAAAA,WAAW,cACpDE,~~EAAWf~~,~~EACbV~~,GAAUC,GAAUC,EACpBqB,EAAAA,WAAW,cAETG,~~EAAWhB~~,~~EACbX~~,GAAUC,GAAUC,GAAUC,EAC9BqB,aAAW,cAETI,~~EAAWjB~~,~~EACbZ~~,GAAUC,GAAUC,GAAUC,GAAUC,EACxCqB,aAAW,cAETK,~~EAAWlB~~,~~EACbb~~,GAAUC,GAAUC,GAAUC,GAAUC,GAAUC,EAClDqB,EAAAA,WAAW,cAETM,~~EAAYnB~~,~~EACdd~~,GACIC,GACAC,GACAC,GACAC,GACAC,GACAC,EACJqB,EAAAA,WAAW,eAGTO,EAAkC,CAAA,EAmBxC,MAjBgB,CACZ,CAAEC,OAAQT,EAAWU,OAAQ,OAC7B,CAAED,OAAQP,EAAUQ,OAAQ,MAC5B,CAAED,OAAQN,EAAUO,OAAQ,MAC5B,CAAED,OAAQL,EAAUM,OAAQ,MAC5B,CAAED,OAAQJ,EAAUK,OAAQ,MAC5B,CAAED,OAAQH,EAAUI,OAAQ,MAC5B,CAAED,OAAQF,EAAWG,OAAQ,QAGzBC,SAAQ,EAAGF,SAAQC,aACvB,MAAME,EAAS1F,EAAUwF,GACrBD,EAAOrF,QAAOoF,EAAQI,EAAOxF,OAASyF,OAAOJ,EAAOrF,QACpDqF,EAAOlF,OAAMiF,EAAQI,EAAOrF,MAAQsF,OAAOJ,EAAOlF,OAClDkF,EAAOhF,MAAK+E,EAAQI,EAAOnF,KAAOoF,OAAOJ,EAAOhF,KAAI,IAGrD+E,CAAO,~~EAIXM~~,~~KAIHC~~,EAAAA,yBACI1C,~~IAAKa~~,~~EACLL~~,UAAWmC,EAAAA,QAAKC,EAAAA,OAAepC,IAC3BC,GACN"}
1	+ {"version":3,"file":"col-div.js","sources":["../../../src/layout/col-div.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useRef } from \"react\";\n\nimport { type BreakpointCSSVariableString, useApplyStyle } from \"../theme\";\nimport { Breakpoint } from \"../theme/tokens/breakpoint\";\nimport { parseCSSVariableValue } from \"../theme/utils/css-variable\";\nimport { mergeRefs, useIsMounted } from \"../util\";\nimport * as styles from \"./col-div.styles\";\nimport type { ColDivProps } from \"./types\";\n\nconst TOKEN_MAP: Record<string, Record<string, string>> = {\n xxs: {\n start: styles.tokens.xxsStart,\n span: styles.tokens.xxsSpan,\n end: styles.tokens.xxsEnd,\n },\n xs: {\n start: styles.tokens.xsStart,\n span: styles.tokens.xsSpan,\n end: styles.tokens.xsEnd,\n },\n sm: {\n start: styles.tokens.smStart,\n span: styles.tokens.smSpan,\n end: styles.tokens.smEnd,\n },\n md: {\n start: styles.tokens.mdStart,\n span: styles.tokens.mdSpan,\n end: styles.tokens.mdEnd,\n },\n lg: {\n start: styles.tokens.lgStart,\n span: styles.tokens.lgSpan,\n end: styles.tokens.lgEnd,\n },\n xl: {\n start: styles.tokens.xlStart,\n span: styles.tokens.xlSpan,\n end: styles.tokens.xlEnd,\n },\n xxl: {\n start: styles.tokens.xxlStart,\n span: styles.tokens.xxlSpan,\n end: styles.tokens.xxlEnd,\n },\n};\n\nconst getColCount = (token: BreakpointCSSVariableString): number => {\n const value = parseCSSVariableValue(\n token,\n globalThis.document?.documentElement ?? null\n );\n const parsed = parseInt(value, 10);\n return Number.isNaN(parsed) ? Infinity : parsed;\n};\n\nconst Component = (\n props: ColDivProps,\n ref: React.Ref<HTMLDivElement>\n): JSX.Element => {\n const {\n xxlCols,\n xlCols,\n lgCols,\n mdCols,\n smCols,\n xsCols,\n xxsCols,\n className,\n ...otherProps\n } = props;\n\n const isMounted = useIsMounted();\n const rootRef = useRef<HTMLDivElement>(null);\n const mergedRef = mergeRefs(rootRef, ref);\n\n const getColSpan = (\n cols: number \| [number, number] \| undefined,\n colToken: (typeof Breakpoint)[keyof typeof Breakpoint]\n ) => {\n if (!cols) return { start: undefined, span: undefined, end: undefined };\n\n if (Array.isArray(cols)) {\n const [start, end] = cols;\n if (end === -1) {\n return { start, span: undefined, end: -1 };\n }\n const maxCols = getColCount(colToken);\n return {\n start,\n span: Math.min(end - start, maxCols),\n end: undefined,\n };\n }\n\n const maxCols = getColCount(colToken);\n return {\n start: undefined,\n span: Math.min(cols, maxCols),\n end: undefined,\n };\n };\n\n const getCssVars = () => {\n const xxsResult = getColSpan(xxsCols, Breakpoint[\"xxs-column\"]);\n const xsResult = getColSpan(xsCols \|\| xxsCols, Breakpoint[\"xs-column\"]);\n const smResult = getColSpan(\n smCols \|\| xsCols \|\| xxsCols,\n Breakpoint[\"sm-column\"]\n );\n const mdResult = getColSpan(\n mdCols \|\| smCols \|\| xsCols \|\| xxsCols,\n Breakpoint[\"md-column\"]\n );\n const lgResult = getColSpan(\n lgCols \|\| mdCols \|\| smCols \|\| xsCols \|\| xxsCols,\n Breakpoint[\"lg-column\"]\n );\n const xlResult = getColSpan(\n xlCols \|\| lgCols \|\| mdCols \|\| smCols \|\| xsCols \|\| xxsCols,\n Breakpoint[\"xl-column\"]\n );\n const xxlResult = getColSpan(\n xxlCols \|\|\n xlCols \|\|\n lgCols \|\|\n mdCols \|\|\n smCols \|\|\n xsCols \|\|\n xxsCols,\n Breakpoint[\"xxl-column\"]\n );\n\n const cssVars: Record<string, string> = {};\n\n const results = [\n { result: xxsResult, prefix: \"xxs\" },\n { result: xsResult, prefix: \"xs\" },\n { result: smResult, prefix: \"sm\" },\n { result: mdResult, prefix: \"md\" },\n { result: lgResult, prefix: \"lg\" },\n { result: xlResult, prefix: \"xl\" },\n { result: xxlResult, prefix: \"xxl\" },\n ];\n\n results.forEach(({ result, prefix }) => {\n const tokens = TOKEN_MAP[prefix];\n if (result.start) cssVars[tokens.start] = String(result.start);\n if (result.span) cssVars[tokens.span] = String(result.span);\n if (result.end) cssVars[tokens.end] = String(result.end);\n });\n\n return cssVars;\n };\n\n useApplyStyle(rootRef, isMounted ? getCssVars() : {});\n\n return (\n <div\n ref={mergedRef}\n className={clsx(styles.colDiv, className)}\n {...otherProps}\n />\n );\n};\n\nexport const ColDiv = React.forwardRef(Component);\n"],"names":["TOKEN_MAP","xxs","start","styles.tokens","xxsStart","span","xxsSpan","end","xxsEnd","xs","xsStart","xsSpan","xsEnd","sm","smStart","smSpan","smEnd","md","mdStart","mdSpan","mdEnd","lg","lgStart","lgSpan","lgEnd","xl","xlStart","xlSpan","xlEnd","xxl","xxlStart","xxlSpan","xxlEnd","getColCount","token","value","parseCSSVariableValue","_b","_a","globalThis","document","documentElement","parsed","parseInt","Number","isNaN","Infinity","ColDiv","React","forwardRef","props","ref","xxlCols","xlCols","lgCols","mdCols","smCols","xsCols","xxsCols","className","otherProps","__rest","isMounted","useIsMounted","rootRef","useRef","mergedRef","mergeRefs","getColSpan","cols","colToken","undefined","Array","isArray","maxCols","Math","min","useApplyStyle","xxsResult","Breakpoint","xsResult","smResult","mdResult","lgResult","xlResult","xxlResult","cssVars","result","prefix","forEach","tokens","String","getCssVars","_jsx","clsx","styles.colDiv"],"mappings":"q7BAUA,MAAMA,EAAoD,CACtDC,IAAK,CACDC,MAAOC,EAAAA,OAAcC,SACrBC,KAAMF,EAAAA,OAAcG,QACpBC,IAAKJ,EAAAA,OAAcK,QAEvBC,GAAI,CACAP,MAAOC,EAAAA,OAAcO,QACrBL,KAAMF,EAAAA,OAAcQ,OACpBJ,IAAKJ,EAAAA,OAAcS,OAEvBC,GAAI,CACAX,MAAOC,EAAAA,OAAcW,QACrBT,KAAMF,EAAAA,OAAcY,OACpBR,IAAKJ,EAAAA,OAAca,OAEvBC,GAAI,CACAf,MAAOC,EAAAA,OAAce,QACrBb,KAAMF,EAAAA,OAAcgB,OACpBZ,IAAKJ,EAAAA,OAAciB,OAEvBC,GAAI,CACAnB,MAAOC,EAAAA,OAAcmB,QACrBjB,KAAMF,EAAAA,OAAcoB,OACpBhB,IAAKJ,EAAAA,OAAcqB,OAEvBC,GAAI,CACAvB,MAAOC,EAAAA,OAAcuB,QACrBrB,KAAMF,EAAAA,OAAcwB,OACpBpB,IAAKJ,EAAAA,OAAcyB,OAEvBC,IAAK,CACD3B,MAAOC,EAAAA,OAAc2B,SACrBzB,KAAMF,EAAAA,OAAc4B,QACpBxB,IAAKJ,EAAAA,OAAc6B,SAIrBC,EAAeC,YACjB,MAAMC,EAAQC,EAAAA,sBACVF,EACoC,QAApCG,EAAmB,QAAnBC,EAAAC,WAAWC,gBAAQ,IAAAF,OAAA,EAAAA,EAAEG,uBAAe,IAAAJ,EAAAA,EAAI,MAEtCK,EAASC,SAASR,EAAO,IAC/B,OAAOS,OAAOC,MAAMH,GAAUI,IAAWJ,CAAM,EAiHtCK,EAASC,EAAAA,QAAMC,YA9GV,CACdC,EACAC,KAEA,MAAMC,QACFA,EAAOC,OACPA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,QACNA,EAAOC,UACPA,GAEAT,EADGU,EAAUC,EAAAA,OACbX,EAVE,CAAA,UAAA,SAAA,SAAA,SAAA,SAAA,SAAA,UAAA,cAYAY,EAAYC,EAAAA,eACZC,EAAUC,EAAAA,OAAuB,MACjCC,EAAYC,EAAAA,UAAUH,EAASb,GAE/BiB,EAAa,CACfC,EACAC,KAEA,IAAKD,EAAM,MAAO,CAAEnE,WAAOqE,EAAWlE,UAAMkE,EAAWhE,SAAKgE,GAE5D,GAAIC,MAAMC,QAAQJ,GAAO,CACrB,MAAOnE,EAAOK,GAAO8D,EACrB,IAAY,IAAR9D,EACA,MAAO,CAAEL,QAAOG,UAAMkE,EAAWhE,KAAK,GAE1C,MAAMmE,EAAUzC,EAAYqC,GAC5B,MAAO,CACHpE,QACAG,KAAMsE,KAAKC,IAAIrE,EAAML,EAAOwE,GAC5BnE,SAAKgE,EAEb,CAEA,MAAMG,EAAUzC,EAAYqC,GAC5B,MAAO,CACHpE,WAAOqE,EACPlE,KAAMsE,KAAKC,IAAIP,EAAMK,GACrBnE,SAAKgE,EACR,EAyDL,OAFAM,EAAAA,cAAcb,EAASF,EApDJ,MACf,MAAMgB,EAAYV,EAAWV,EAASqB,EAAAA,WAAW,eAC3CC,EAAWZ,EAAWX,GAAUC,EAASqB,EAAAA,WAAW,cACpDE,EAAWb,EACbZ,GAAUC,GAAUC,EACpBqB,EAAAA,WAAW,cAETG,EAAWd,EACbb,GAAUC,GAAUC,GAAUC,EAC9BqB,aAAW,cAETI,EAAWf,EACbd,GAAUC,GAAUC,GAAUC,GAAUC,EACxCqB,aAAW,cAETK,EAAWhB,EACbf,GAAUC,GAAUC,GAAUC,GAAUC,GAAUC,EAClDqB,EAAAA,WAAW,cAETM,EAAYjB,EACdhB,GACIC,GACAC,GACAC,GACAC,GACAC,GACAC,EACJqB,EAAAA,WAAW,eAGTO,EAAkC,CAAA,EAmBxC,MAjBgB,CACZ,CAAEC,OAAQT,EAAWU,OAAQ,OAC7B,CAAED,OAAQP,EAAUQ,OAAQ,MAC5B,CAAED,OAAQN,EAAUO,OAAQ,MAC5B,CAAED,OAAQL,EAAUM,OAAQ,MAC5B,CAAED,OAAQJ,EAAUK,OAAQ,MAC5B,CAAED,OAAQH,EAAUI,OAAQ,MAC5B,CAAED,OAAQF,EAAWG,OAAQ,QAGzBC,SAAQ,EAAGF,SAAQC,aACvB,MAAME,EAAS1F,EAAUwF,GACrBD,EAAOrF,QAAOoF,EAAQI,EAAOxF,OAASyF,OAAOJ,EAAOrF,QACpDqF,EAAOlF,OAAMiF,EAAQI,EAAOrF,MAAQsF,OAAOJ,EAAOlF,OAClDkF,EAAOhF,MAAK+E,EAAQI,EAAOnF,KAAOoF,OAAOJ,EAAOhF,KAAI,IAGrD+E,CAAO,EAGiBM,GAAe,CAAA,GAG9CC,EAAAA,yBACI1C,IAAKe,EACLP,UAAWmC,EAAAA,QAAKC,EAAAA,OAAepC,IAC3BC,GACN"}

package/cjs/link-list/link-list.styles.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";require("./link-list.styles_1g33nb4.css");exports.container="cfblyzz",exports.expandable="e1p9oc1w",exports.expandableList="e1hdpk7s",exports.itemContainer="i191w9a9",exports.itemContentContainer="i1ek9mgx",exports.itemDescription="i6tq5i6",exports.itemIcon="iejabo3",exports.itemTitleDefault="ixxi28v",exports.itemTitleSmall="ia0puf0",exports.toggleButton="t1l68ils",exports.toggleButtonIcon="t1quebcu",exports.toggleButtonLabel="tjt90m3",exports.toggleButtonLoading="t5821wq";
+"use strict";require("./link-list.styles_m57vks.css");exports.container="cfblyzz",exports.expandable="e1p9oc1w",exports.expandableList="e1hdpk7s",exports.itemContainer="i191w9a9",exports.itemContentContainer="i1ek9mgx",exports.itemDescription="i6tq5i6",exports.itemIcon="iejabo3",exports.itemTitleDefault="ixxi28v",exports.itemTitleSmall="ia0puf0",exports.toggleButton="t1l68ils",exports.toggleButtonIcon="t1quebcu",exports.toggleButtonLabel="tjt90m3",exports.toggleButtonLoading="t5821wq";
 //# sourceMappingURL=link-list.styles.js.map

package/cjs/link-list/link-list.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"link-list.styles.js","sources":["../../../src/link-list/link-list.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, Colour } from \"../theme\";\n\nexport const container = css`\n border-top: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n border-bottom: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n`;\n\n// =============================================================================\n// ITEM STYLES\n// =============================================================================\nexport const itemIcon = css`\n height: 1.~~125rem~~;\n width: 1.~~125rem~~;\n color: ${Colour[\"icon-primary\"]};\n`;\n\nexport const itemTitleDefault = css`\n color: ${Colour[\"text-primary\"]};\n ~~margin-bottom: 0.5rem;\n~~`;\n\nexport const itemTitleSmall = css`\n color: ${Colour[\"text-primary\"]};\n`;\n\nexport const itemContainer = css`\n padding: 1rem 0;\n display: flex;\n justify-content: space-between;\n align-items: center;\n min-height: 4rem;\n\n &:not(:last-of-type) {\n border-bottom: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n }\n\n &:hover {\n .${itemTitleDefault}, .${itemTitleSmall}, .${itemIcon} {\n color: ${Colour[\"text-hover\"]};\n }\n }\n`;\n\nexport const itemContentContainer = css`\n display: flex;\n flex-direction: column;\n flex: 1;\n margin-right: 1rem;\n`;\n\nexport const itemDescription = css`\n margin-top: 0.25rem;\n`;\n\n// =============================================================================\n// TOGGLE STYLES\n// =============================================================================\nexport const expandable = css`\n overflow: hidden;\n`;\n\nexport const expandableList = css`\n border-top: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n`;\n\nexport const toggleButtonLabel = css`\n color: ${Colour[\"text-primary\"]};\n`;\n\nexport const toggleButtonIcon = css`\n height: 1.125rem;\n width: 1.125rem;\n color: ${Colour[\"icon-primary\"]};\n`;\n\nexport const toggleButton = css`\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n padding: 1rem 0;\n border: none;\n background: none;\n cursor: pointer;\n border-top: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n gap: 1rem;\n\n &:hover {\n .${toggleButtonLabel}, .${toggleButtonIcon} {\n color: ${Colour[\"text-hover\"]};\n text-decoration: underline;\n }\n }\n`;\n\nexport const toggleButtonLoading = css`\n cursor: default;\n flex-direction: row-reverse;\n\n .${toggleButtonLabel}, .${toggleButtonIcon} {\n color: ${Colour[\"text-disabled\"]};\n text-decoration: none;\n }\n\n &:hover {\n .${toggleButtonLabel}, .${toggleButtonIcon} {\n color: ${Colour[\"text-disabled\"]};\n text-decoration: none;\n }\n }\n`;\n"],"names":[],"mappings":"~~kGAIsB~~,~~6BAuDC~~,kCAII,iCApCD,wCAkBO,mCAOL,~~2BAxCP~~,mCAMQ,~~iCAKF~~,+BAsDF,oCANI,qCAJC,sCA8BE"}
1	+ {"version":3,"file":"link-list.styles.js","sources":["../../../src/link-list/link-list.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, Colour } from \"../theme\";\n\nexport const container = css`\n border-top: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n border-bottom: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n`;\n\n// =============================================================================\n// ITEM STYLES\n// =============================================================================\nexport const itemIcon = css`\n height: 1.375rem;\n width: 1.375rem;\n color: ${Colour[\"icon-primary\"]};\n`;\n\nexport const itemTitleDefault = css`\n color: ${Colour[\"text-primary\"]};\n`;\n\nexport const itemTitleSmall = css`\n color: ${Colour[\"text-primary\"]};\n`;\n\nexport const itemContainer = css`\n padding: 1rem 0;\n display: flex;\n justify-content: space-between;\n align-items: center;\n min-height: 4rem;\n\n &:not(:last-of-type) {\n border-bottom: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n }\n\n &:hover {\n .${itemTitleDefault}, .${itemTitleSmall}, .${itemIcon} {\n color: ${Colour[\"text-hover\"]};\n }\n }\n`;\n\nexport const itemContentContainer = css`\n display: flex;\n flex-direction: column;\n flex: 1;\n margin-right: 1rem;\n`;\n\nexport const itemDescription = css`\n margin-top: 0.25rem;\n`;\n\n// =============================================================================\n// TOGGLE STYLES\n// =============================================================================\nexport const expandable = css`\n overflow: hidden;\n`;\n\nexport const expandableList = css`\n border-top: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n`;\n\nexport const toggleButtonLabel = css`\n color: ${Colour[\"text-primary\"]};\n`;\n\nexport const toggleButtonIcon = css`\n height: 1.125rem;\n width: 1.125rem;\n color: ${Colour[\"icon-primary\"]};\n`;\n\nexport const toggleButton = css`\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n padding: 1rem 0;\n border: none;\n background: none;\n cursor: pointer;\n border-top: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n gap: 1rem;\n\n &:hover {\n .${toggleButtonLabel}, .${toggleButtonIcon} {\n color: ${Colour[\"text-hover\"]};\n text-decoration: underline;\n }\n }\n`;\n\nexport const toggleButtonLoading = css`\n cursor: default;\n flex-direction: row-reverse;\n\n .${toggleButtonLabel}, .${toggleButtonIcon} {\n color: ${Colour[\"text-disabled\"]};\n text-decoration: none;\n }\n\n &:hover {\n .${toggleButtonLabel}, .${toggleButtonIcon} {\n color: ${Colour[\"text-disabled\"]};\n text-decoration: none;\n }\n }\n`;\n"],"names":[],"mappings":"iGAIsB,6BAsDC,kCAII,iCApCD,wCAkBO,mCAOL,2BAvCP,mCAMQ,iCAIF,+BAsDF,oCANI,qCAJC,sCA8BE"}

package/{link-list/link-list.styles_1g33nb4.css → cjs/link-list/link-list.styles_m57vks.css} RENAMED Viewed

@@ -1,6 +1,6 @@
 .cfblyzz{border-top:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);border-bottom:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);}
-.iejabo3{height:1.125rem;width:1.125rem;color:var(--fds-colour-icon-primary);}
-.ixxi28v{color:var(--fds-colour-text-primary);margin-bottom:0.5rem;}
+.iejabo3{height:1.375rem;width:1.375rem;color:var(--fds-colour-icon-primary);}
+.ixxi28v{color:var(--fds-colour-text-primary);}
 .ia0puf0{color:var(--fds-colour-text-primary);}
 .i191w9a9{padding:1rem 0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;min-height:4rem;}.i191w9a9:not(:last-of-type){border-bottom:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);}.i191w9a9:hover .ixxi28v,.i191w9a9:hover .ia0puf0,.i191w9a9:hover .iejabo3{color:var(--fds-colour-text-hover);}
 .i1ek9mgx{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-flex:1;-ms-flex:1;flex:1;margin-right:1rem;}

package/cjs/local-nav/local-nav-dropdown/local-nav-dropdown.styles.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";require("./local-nav-dropdown.styles_ftv36t.css");exports.backdrop="beqsxqe",exports.navItem="n1rgfmu8",exports.navItemLabel="n1lmzf88",exports.navItemLabelSelected="nc4nyiy",exports.navItemList="ny6lx9v",exports.navItemSelected="n122w1r6",exports.navSelect="n1fsscye",exports.navSelectExpanded="n10li8ea",exports.navSelectIcon="nczumix",exports.navSelectIconExpanded="n1mayi9n",exports.navWrapper="ns92rya",exports.navWrapperStickied="np844yu",exports.tickIcon="thuuy8a",exports.tokens={navWrapper:{stickyOffset:"--fds-internal-localNavDropdown-navWrapper-stickyOffset",sideMargin:"--fds-internal-localNavDropdown-navWrapper-sideMargin"},navItemList:{viewportHeight:"--fds-internal-localNavDropdown-navItemList-viewportHeight"}};
+"use strict";require("./local-nav-dropdown.styles_uhd4xl.css");exports.backdrop="beqsxqe",exports.navItem="n1rgfmu8",exports.navItemLabel="n1lmzf88",exports.navItemLabelSelected="nc4nyiy",exports.navItemList="ny6lx9v",exports.navItemSelected="n122w1r6",exports.navSelect="n1fsscye",exports.navSelectExpanded="n10li8ea",exports.navSelectIcon="nczumix",exports.navSelectIconExpanded="n1mayi9n",exports.navWrapper="ns92rya",exports.navWrapperStickied="np844yu",exports.tickIcon="thuuy8a",exports.tokens={navWrapper:{stickyOffset:"--fds-internal-localNavDropdown-navWrapper-stickyOffset",sideMargin:"--fds-internal-localNavDropdown-navWrapper-sideMargin"},navItemList:{viewportHeight:"--fds-internal-localNavDropdown-navItemList-viewportHeight"}};
 //# sourceMappingURL=local-nav-dropdown.styles.js.map

package/{local-nav/local-nav-dropdown/local-nav-dropdown.styles_ftv36t.css → cjs/local-nav/local-nav-dropdown/local-nav-dropdown.styles_uhd4xl.css} RENAMED Viewed

@@ -5,7 +5,7 @@
 .n1rgfmu8{padding:var(--fds-spacing-12) var(--fds-spacing-8) var(--fds-spacing-12) var(--fds-spacing-32);background:var(--fds-colour-bg);position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}.n1rgfmu8:focus-visible{outline:2px solid var(--fds-colour-focus-ring);outline-offset:0px;border-radius:var(--fds-radius-sm);}
 .n122w1r6{padding:var(--fds-spacing-12) var(--fds-spacing-8) var(--fds-spacing-12) 0;background:var(--fds-colour-bg-primary-subtlest);}
 .ny6lx9v{--fds-internal-localNavDropdown-navItemList-viewportHeight:initial;-webkit-transition:all var(--fds-motion-duration-250) var(--fds-motion-timing-ease-default);transition:all var(--fds-motion-duration-250) var(--fds-motion-timing-ease-default);transform-origin:top;list-style-type:none;padding:0 var(--fds-spacing-8);margin:0;background:var(--fds-colour-bg);cursor:pointer;box-shadow:0 0 var(--fds-border-width-010) var(--fds-border-width-010) var(--fds-colour-border);border-bottom-right-radius:var(--fds-radius-sm);border-bottom-left-radius:var(--fds-radius-sm);overflow-y:auto;max-height:var(--fds-internal-localNavDropdown-navItemList-viewportHeight);}
-.n1lmzf88{font-family:var(--fds-font-family);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-baseline);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-baseline);letter-spacing:var(--fds-font-body-ls-baseline);color:var(--fds-colour-text);}
+.n1lmzf88{font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-baseline);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-baseline);letter-spacing:var(--fds-font-body-ls-baseline);color:var(--fds-colour-text);}
 .nc4nyiy{color:var(--fds-colour-text-selected);}
 .thuuy8a{color:var(--fds-colour-icon-selected);margin:0 var(--fds-spacing-8);}
 .beqsxqe{position:fixed;top:0;right:0;left:0;bottom:0;background-color:var(--fds-colour-overlay-strong);z-index:-1;}

package/cjs/markup/markup.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var e=require("../_virtual/_tslib.js"),r=require("react/jsx-runtime"),s=require("clsx"),t=require("react");require("../theme/theme-provider/index.js"),require("../theme/theme-provider/context.js"),require("../theme/tokens/border.js"),require("../theme/tokens/colour.js"),require("../theme/tokens/font.js"),require("../theme/tokens/media-query.js");var u=require("../theme/utils/font.js"),i=require("../theme/utils/use-apply-styles.js");require("../theme/utils/use-media-query.js"),require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js");var a=require("../util/merge-refs.js");require("../util/simple-id-generator.js"),require("../util/string-helper.js"),require("@react-aria/live-announcer");var l=require("./markup.style.js"),n=require("./markup.utils.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var m=o(s);const j=t.forwardRef(((s,o)=>{const{baseTextColor:j,baseTextSize:q,inline:c,className:p}=s,d=e.__rest(s,["baseTextColor","baseTextSize","inline","className"]),f=t.useRef(null),h=t.useMemo((()=>a.mergeRefs(f,o)),[o]),x=t.useMemo((()=>{if(q)return u.generateFontProperties(q,"regular")}),[q]),y=t.useMemo((()=>Object.assign({color:j||null},n.createMarkupFontStyles(x))),[j,x]);i.useApplyStyle(f,y);const b=m.default(l.baseMarkup,q&&l.sizedMarkup,p),k=c?"span":"div";return r.jsx(k,Object.assign({ref:h,className:b},d))}));exports.Markup=j;
+"use strict";var e=require("../_virtual/_tslib.js"),r=require("react/jsx-runtime"),s=require("clsx"),t=require("react");require("../theme/theme-provider/index.js"),require("../theme/theme-provider/context.js"),require("../theme/tokens/border.js"),require("../theme/tokens/colour.js"),require("../theme/tokens/font.js"),require("../theme/tokens/media-query.js");var i=require("../theme/utils/use-apply-styles.js");require("../theme/utils/use-media-query.js");var u=require("../theme/utils/font.js");require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js");var a=require("../util/merge-refs.js");require("../util/simple-id-generator.js"),require("../util/string-helper.js"),require("@react-aria/live-announcer");var l=require("./markup.style.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=n(s);const m=t.forwardRef(((s,n)=>{const{baseTextColor:m,baseTextSize:j,inline:q,className:c}=s,p=e.__rest(s,["baseTextColor","baseTextSize","inline","className"]),d=t.useRef(null),f=t.useMemo((()=>a.mergeRefs(d,n)),[n]),h=t.useMemo((()=>{if(j)return u.generateFontProperties(j,"regular")}),[j]),v=t.useMemo((()=>Object.assign({color:m||null},h)),[m,h]);i.useApplyStyle(d,v);const x=o.default(l.baseMarkup,j&&l.sizedMarkup,c),b=q?"span":"div";return r.jsx(b,Object.assign({ref:f,className:x},p))}));exports.Markup=m;
 //# sourceMappingURL=markup.js.map

package/cjs/markup/markup.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"markup.js","sources":["../../../src/markup/markup.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport type React from \"react\";\nimport { forwardRef, useMemo, useRef } from \"react\";\n\nimport { ~~generateFontProperties,~~ useApplyStyle } from \"../theme\";\nimport { ~~mergeRefs~~ } from \"../~~util~~\";\nimport * as ~~styles~~ from \"~~./markup.style~~\";\nimport { ~~createMarkupFontStyles~~ } from \"./markup.~~utils~~\";\nimport type { MarkupProps } from \"./types\";\n\nconst Component = (props: MarkupProps, ref: React.Ref<HTMLDivElement>) => {\n // =========================================================================\n // CONST, STATE, REF\n // =========================================================================\n const { baseTextColor, baseTextSize, inline, className, ...otherProps } =\n props;\n\n const containerRef = useRef<HTMLDivElement \| HTMLSpanElement>(null);\n const mergedRef = useMemo(() => mergeRefs(containerRef, ref), [ref]);\n\n const fontDeclarations = useMemo(() => {\n if (!baseTextSize) {\n return undefined;\n }\n\n return generateFontProperties(baseTextSize, \"regular\");\n }, [baseTextSize]);\n\n const appliedStyles = useMemo(\n () => ({\n color: baseTextColor \|\| null,\n ...~~createMarkupFontStyles(~~fontDeclarations),\n }),\n [baseTextColor, fontDeclarations]\n );\n\n useApplyStyle(containerRef, appliedStyles);\n\n const mergedClassName = clsx(\n styles.baseMarkup,\n baseTextSize && styles.sizedMarkup,\n className\n );\n\n const ElementTag = inline ? \"span\" : \"div\";\n\n return (\n <ElementTag\n ref={mergedRef as React.Ref<HTMLDivElement & HTMLSpanElement>}\n className={mergedClassName}\n {...otherProps}\n />\n );\n};\n\nexport const Markup = forwardRef(Component);\n"],"names":["Markup","forwardRef","props","ref","baseTextColor","baseTextSize","inline","className","otherProps","__rest","containerRef","useRef","mergedRef","useMemo","mergeRefs","fontDeclarations","generateFontProperties","appliedStyles","Object","assign","color","~~createMarkupFontStyles","~~useApplyStyle","mergedClassName","clsx","styles.baseMarkup","styles.sizedMarkup","ElementTag","_jsx"],"mappings":"~~82BAUA~~,MA6CaA,EAASC,EAAAA,YA7CJ,CAACC,EAAoBC,KAInC,MAAMC,cAAEA,EAAaC,aAAEA,EAAYC,OAAEA,EAAMC,UAAEA,GACzCL,EADuDM,EAAUC,EAAAA,OACjEP,EADE,CAAA,gBAAA,eAAA,SAAA,cAGAQ,EAAeC,EAAAA,OAAyC,MACxDC,EAAYC,EAAAA,SAAQ,IAAMC,EAAAA,UAAUJ,EAAcP,IAAM,CAACA,IAEzDY,EAAmBF,EAAAA,SAAQ,KAC7B,GAAKR,EAIL,OAAOW,EAAAA,uBAAuBX,EAAc,UAAU,GACvD,CAACA,IAEEY,EAAgBJ,EAAAA,SAClB,IAAMK,OAAAC,OAAA,CACFC,MAAOhB,GAAiB,~~MACrBiB~~,~~EAAAA~~,~~uBAAuBN,KAE9B,~~CAACX,EAAeW,~~IAGpBO~~,EAAAA,~~cAAcZ~~,EAAcO,GAE5B,~~MAAMM~~,EAAkBC,EAAAA,QACpBC,EAAAA,~~WACApB~~,~~GAAgBqB~~,EAAAA,~~YAChBnB~~,~~GAGEoB~~,~~EAAarB~~,EAAS,OAAS,MAErC,~~OACIsB~~,MAACD,~~EAAUT~~,OAAAC,OAAA,CACPhB,IAAKS,EACLL,~~UAAWgB~~,~~GACPf~~,GACN"}
1	+ {"version":3,"file":"markup.js","sources":["../../../src/markup/markup.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport type React from \"react\";\nimport { forwardRef, useMemo, useRef } from \"react\";\n\nimport { useApplyStyle } from \"../theme\";\nimport { generateFontProperties } from \"../theme/utils\";\nimport { mergeRefs } from \"../util\";\nimport * as styles from \"./markup.style\";\nimport type { MarkupProps } from \"./types\";\n\nconst Component = (props: MarkupProps, ref: React.Ref<HTMLDivElement>) => {\n // =========================================================================\n // CONST, STATE, REF\n // =========================================================================\n const { baseTextColor, baseTextSize, inline, className, ...otherProps } =\n props;\n\n const containerRef = useRef<HTMLDivElement \| HTMLSpanElement>(null);\n const mergedRef = useMemo(() => mergeRefs(containerRef, ref), [ref]);\n\n const fontDeclarations = useMemo(() => {\n if (!baseTextSize) {\n return undefined;\n }\n\n return generateFontProperties(baseTextSize, \"regular\");\n }, [baseTextSize]);\n\n const appliedStyles = useMemo(\n () => ({\n color: baseTextColor \|\| null,\n ...fontDeclarations,\n }),\n [baseTextColor, fontDeclarations]\n );\n\n useApplyStyle(containerRef, appliedStyles);\n\n const mergedClassName = clsx(\n styles.baseMarkup,\n baseTextSize && styles.sizedMarkup,\n className\n );\n\n const ElementTag = inline ? \"span\" : \"div\";\n\n return (\n <ElementTag\n ref={mergedRef as React.Ref<HTMLDivElement & HTMLSpanElement>}\n className={mergedClassName}\n {...otherProps}\n />\n );\n};\n\nexport const Markup = forwardRef(Component);\n"],"names":["Markup","forwardRef","props","ref","baseTextColor","baseTextSize","inline","className","otherProps","__rest","containerRef","useRef","mergedRef","useMemo","mergeRefs","fontDeclarations","generateFontProperties","appliedStyles","Object","assign","color","useApplyStyle","mergedClassName","clsx","styles.baseMarkup","styles.sizedMarkup","ElementTag","_jsx"],"mappings":"m1BAUA,MA6CaA,EAASC,EAAAA,YA7CJ,CAACC,EAAoBC,KAInC,MAAMC,cAAEA,EAAaC,aAAEA,EAAYC,OAAEA,EAAMC,UAAEA,GACzCL,EADuDM,EAAUC,EAAAA,OACjEP,EADE,CAAA,gBAAA,eAAA,SAAA,cAGAQ,EAAeC,EAAAA,OAAyC,MACxDC,EAAYC,EAAAA,SAAQ,IAAMC,EAAAA,UAAUJ,EAAcP,IAAM,CAACA,IAEzDY,EAAmBF,EAAAA,SAAQ,KAC7B,GAAKR,EAIL,OAAOW,EAAAA,uBAAuBX,EAAc,UAAU,GACvD,CAACA,IAEEY,EAAgBJ,EAAAA,SAClB,IAAMK,OAAAC,OAAA,CACFC,MAAOhB,GAAiB,MACrBW,IAEP,CAACX,EAAeW,IAGpBM,EAAAA,cAAcX,EAAcO,GAE5B,MAAMK,EAAkBC,EAAAA,QACpBC,EAAAA,WACAnB,GAAgBoB,EAAAA,YAChBlB,GAGEmB,EAAapB,EAAS,OAAS,MAErC,OACIqB,MAACD,EAAUR,OAAAC,OAAA,CACPhB,IAAKS,EACLL,UAAWe,GACPd,GACN"}

package/cjs/markup/markup.style.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";require("./markup.style_1iu40x9.css");exports.baseMarkup="b2c8sfe",exports.sizedMarkup="stfuo83",exports.tokens={rootFontFamily:"--fds-internal-markup-root-fontFamily",rootFontVariant:"--fds-internal-markup-root-fontVariant",rootFontSize:"--fds-internal-markup-root-fontSize",rootFontWeight:"--fds-internal-markup-root-fontWeight",rootLineHeight:"--fds-internal-markup-root-lineHeight",rootLetterSpacing:"--fds-internal-markup-root-letterSpacing"};
+"use strict";require("./markup.style_1iu40x9.css");exports.baseMarkup="b2c8sfe",exports.sizedMarkup="stfuo83";
 //# sourceMappingURL=markup.style.js.map

package/cjs/markup/markup.style.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"markup.style.js","sources":["../../../src/markup/markup.style.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Colour } from \"../theme/tokens/colour\";\nimport { Font } from \"../theme/tokens/font\";\n\nexport const tokens = {\n rootFontFamily: \"--fds-internal-markup-root-fontFamily\",\n rootFontVariant: \"--fds-internal-markup-root-fontVariant\",\n rootFontSize: \"--fds-internal-markup-root-fontSize\",\n rootFontWeight: \"--fds-internal-markup-root-fontWeight\",\n rootLineHeight: \"--fds-internal-markup-root-lineHeight\",\n rootLetterSpacing: \"--fds-internal-markup-root-letterSpacing\",\n} as const;\n\nexport const baseMarkup = css`\n strong {\n font-weight: ${Font.Spec[\"weight-semibold\"]};\n }\n\n p {\n margin: 0;\n }\n\n a {\n font-weight: ${Font.Spec[\"weight-semibold\"]};\n color: ${Colour.hyperlink};\n text-decoration: underline;\n\n svg {\n color: ${Colour[\"icon-primary\"]};\n height: 1lh;\n width: 1em;\n margin-left: 0.4rem;\n vertical-align: middle;\n }\n\n &:hover,\n &:active,\n &:visited,\n &:focus {\n color: ${Colour[\"hyperlink-hover\"]};\n\n svg {\n color: ${Colour[\"icon-hover\"]};\n }\n }\n }\n\n ul,\n ol {\n margin: 0;\n padding: 0;\n margin-left: 2.5rem;\n }\n\n ol {\n list-style: decimal;\n }\n\n ul {\n list-style: disc;\n }\n`;\n\nexport const sizedMarkup = css`\n font-family: var(${tokens.rootFontFamily}, inherit);\n font-variant: var(${tokens.rootFontVariant}, inherit);\n font-size: var(${tokens.rootFontSize}, inherit);\n font-weight: var(${tokens.rootFontWeight}, inherit);\n line-height: var(${tokens.rootLineHeight}, inherit);\n letter-spacing: var(${tokens.rootLetterSpacing}, inherit);\n`;\n"],"names":[~~"rootFontFamily","rootFontVariant","rootFontSize","rootFontWeight","rootLineHeight","rootLetterSpacing"~~],"mappings":"4FAcuB,8BAkDC~~,yBA3DF,CAClBA,eAAgB,wCAChBC,gBAAiB,yCACjBC,aAAc,sCACdC,eAAgB,wCAChBC,eAAgB,wCAChBC,kBAAmB~~"}
1	+ {"version":3,"file":"markup.style.js","sources":["../../../src/markup/markup.style.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Colour } from \"../theme/tokens/colour\";\nimport { Font } from \"../theme/tokens/font\";\n\nexport const tokens = {\n rootFontFamily: \"--fds-internal-markup-root-fontFamily\",\n rootFontVariant: \"--fds-internal-markup-root-fontVariant\",\n rootFontSize: \"--fds-internal-markup-root-fontSize\",\n rootFontWeight: \"--fds-internal-markup-root-fontWeight\",\n rootLineHeight: \"--fds-internal-markup-root-lineHeight\",\n rootLetterSpacing: \"--fds-internal-markup-root-letterSpacing\",\n} as const;\n\nexport const baseMarkup = css`\n strong {\n font-weight: ${Font.Spec[\"weight-semibold\"]};\n }\n\n p {\n margin: 0;\n }\n\n a {\n font-weight: ${Font.Spec[\"weight-semibold\"]};\n color: ${Colour.hyperlink};\n text-decoration: underline;\n\n svg {\n color: ${Colour[\"icon-primary\"]};\n height: 1lh;\n width: 1em;\n margin-left: 0.4rem;\n vertical-align: middle;\n }\n\n &:hover,\n &:active,\n &:visited,\n &:focus {\n color: ${Colour[\"hyperlink-hover\"]};\n\n svg {\n color: ${Colour[\"icon-hover\"]};\n }\n }\n }\n\n ul,\n ol {\n margin: 0;\n padding: 0;\n margin-left: 2.5rem;\n }\n\n ol {\n list-style: decimal;\n }\n\n ul {\n list-style: disc;\n }\n`;\n\nexport const sizedMarkup = css`\n font-family: var(${tokens.rootFontFamily}, inherit);\n font-variant: var(${tokens.rootFontVariant}, inherit);\n font-size: var(${tokens.rootFontSize}, inherit);\n font-weight: var(${tokens.rootFontWeight}, inherit);\n line-height: var(${tokens.rootLineHeight}, inherit);\n letter-spacing: var(${tokens.rootLetterSpacing}, inherit);\n`;\n"],"names":[],"mappings":"4FAcuB,8BAkDC"}

package/cjs/masked-input/masked-input.styles.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";require("./masked-input.styles_4i1qsy.css");exports.clickableErrorWrapper="c1jw7yzb",exports.errorIcon="e1roice1",exports.errorLabel="e1tg5b5m",exports.errorTextContainer="eimq00u",exports.iconContainer="ij8rwek",exports.iconContainerDisabled="i1q5e8sd",exports.inputGroupWrapper="ilvnzaw",exports.loadingLabel="l1o6dphh",exports.loadingWrapper="lsb4klr",exports.readOnlyClickable="r1svptpi",exports.readOnlyIconContainer="r1mk0cgh",exports.readOnlyValueText="r1dgmaf",exports.spinner="s1lksd2c",exports.tokens={iconContainer:{inactiveColor:"--fds-internal-maskedInput-iconContainer-inactiveColor",activeColor:"--fds-internal-maskedInput-iconContainer-activeColor"}},exports.tryAgainLabel="t12y77bq";
+"use strict";require("./masked-input.styles_1cm388a.css");exports.clickableErrorWrapper="c1jw7yzb",exports.errorIcon="e1roice1",exports.errorLabel="e1tg5b5m",exports.errorTextContainer="eimq00u",exports.iconContainer="ij8rwek",exports.iconContainerDisabled="i1q5e8sd",exports.inputGroupWrapper="ilvnzaw",exports.loadingLabel="l1o6dphh",exports.loadingWrapper="lsb4klr",exports.readOnlyClickable="r1svptpi",exports.readOnlyIconContainer="r1mk0cgh",exports.readOnlyValueText="r1dgmaf",exports.spinner="s1lksd2c",exports.tokens={iconContainer:{inactiveColor:"--fds-internal-maskedInput-iconContainer-inactiveColor",activeColor:"--fds-internal-maskedInput-iconContainer-activeColor"}},exports.tryAgainLabel="t12y77bq";
 //# sourceMappingURL=masked-input.styles.js.map

package/cjs/masked-input/masked-input.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"masked-input.styles.js","sources":["../../../src/masked-input/masked-input.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Colour, Font, Spacing } from \"../theme\";\n\nexport const tokens = {\n iconContainer: {\n inactiveColor: \"--fds-internal-maskedInput-iconContainer-inactiveColor\",\n activeColor: \"--fds-internal-maskedInput-iconContainer-activeColor\",\n },\n};\n\nexport const inputGroupWrapper = css`\n padding: 0 0 0 ${Spacing[\"spacing-16\"]};\n\n input {\n cursor: initial;\n }\n`;\n\nexport const inputGroupWrapperReadOnly = css`\n padding: 0;\n`;\n\nexport const inputGroupWrapperInputPointer = css`\n input {\n cursor: pointer;\n }\n`;\n\nexport const iconContainer = css`\n ${tokens.iconContainer.inactiveColor}: initial;\n ${tokens.iconContainer.activeColor}: initial;\n\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n color: var(${tokens.iconContainer.activeColor}, ${Colour[\"icon-primary\"]});\n padding: ${Spacing[\"spacing-12\"]} ${Spacing[\"spacing-16\"]};\n\n svg {\n height: 1em;\n width: 1em;\n }\n`;\n\nexport const iconContainerDisabled = css`\n cursor: initial;\n color: var(${tokens.iconContainer.inactiveColor}, ${Colour.icon});\n`;\n\n// -----------------------------------------------------------------------------\n// LOADING DISPLAY\n// -----------------------------------------------------------------------------\nexport const loadingWrapper = css`\n display: flex;\n align-items: center;\n height: 3rem;\n`;\n\nexport const loadingLabel = css`\n color: ${Colour[\"text-subtler\"]};\n`;\n\nexport const spinner = css`\n margin-right: ${Spacing[\"spacing-8\"]};\n color: ${Colour[\"icon\"]};\n`;\n\n// -----------------------------------------------------------------------------\n// ERROR DISPLAY\n// -----------------------------------------------------------------------------\nexport const tryAgainLabel = css`\n color: ${Colour[\"text-primary\"]};\n text-decoration: underline;\n font-weight: ${Font.Spec[\"weight-semibold\"]};\n`;\n\nexport const errorTextContainer = css`\n display: flex;\n align-items: center;\n margin-right: ${Spacing[\"spacing-8\"]};\n`;\n\nexport const errorIcon = css`\n color: ${Colour[\"icon-warning\"]};\n margin-right: ${Spacing[\"spacing-8\"]};\n height: 1em;\n width: 1em;\n`;\n\nexport const errorLabel = css`\n color: ${Colour[\"text-warning\"]};\n`;\n\nexport const clickableErrorWrapper = css`\n width: 100%;\n height: 3rem;\n display: flex;\n justify-content: space-between;\n align-items: center;\n border: none;\n background: transparent;\n cursor: pointer;\n\n ${Font[\"body-baseline-regular\"]}\n\n &:hover,\n &:active,\n &:focus {\n .${tryAgainLabel} {\n color: ${Colour[\"text-hover\"]};\n }\n }\n`;\n\n// -----------------------------------------------------------------------------\n// READONLY MASKED DISPLAY\n// -----------------------------------------------------------------------------\nexport const readOnlyClickable = css`\n ${Font[\"body-baseline-regular\"]}\n color: ${Colour[\"text\"]};\n border: none;\n background: transparent;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-align: left;\n width: 100%;\n justify-content: space-between;\n min-height: 3rem;\n`;\n\nexport const readOnlyValueText = css`\n overflow-wrap: anywhere;\n`;\n\nexport const readOnlyIconContainer = css`\n display: flex;\n align-items: center;\n justify-content: center;\n color: ${Colour[\"icon-primary\"]};\n padding: 0 1rem;\n flex-shrink: 0;\n\n svg {\n width: ${Font.Spec[\"body-size-baseline\"]};\n height: ${Font.Spec[\"body-size-baseline\"]};\n }\n`;\n"],"names":["iconContainer","inactiveColor","activeColor"],"mappings":"~~mHA~~+FkC,6BAXZ,8BAOC,sCAbQ,gCAjDL,wCAiBQ,qCAnCJ,+BAiDL,kCANE,oCAiEG,yCAkBI,qCAJJ,0BArEV,0BA5DE,CAClBA,cAAe,CACXC,cAAe,yDACfC,YAAa,+EAiEK"}
1	+ {"version":3,"file":"masked-input.styles.js","sources":["../../../src/masked-input/masked-input.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Colour, Font, Spacing } from \"../theme\";\n\nexport const tokens = {\n iconContainer: {\n inactiveColor: \"--fds-internal-maskedInput-iconContainer-inactiveColor\",\n activeColor: \"--fds-internal-maskedInput-iconContainer-activeColor\",\n },\n};\n\nexport const inputGroupWrapper = css`\n padding: 0 0 0 ${Spacing[\"spacing-16\"]};\n\n input {\n cursor: initial;\n }\n`;\n\nexport const inputGroupWrapperReadOnly = css`\n padding: 0;\n`;\n\nexport const inputGroupWrapperInputPointer = css`\n input {\n cursor: pointer;\n }\n`;\n\nexport const iconContainer = css`\n ${tokens.iconContainer.inactiveColor}: initial;\n ${tokens.iconContainer.activeColor}: initial;\n\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n color: var(${tokens.iconContainer.activeColor}, ${Colour[\"icon-primary\"]});\n padding: ${Spacing[\"spacing-12\"]} ${Spacing[\"spacing-16\"]};\n\n svg {\n height: 1em;\n width: 1em;\n }\n`;\n\nexport const iconContainerDisabled = css`\n cursor: initial;\n color: var(${tokens.iconContainer.inactiveColor}, ${Colour.icon});\n`;\n\n// -----------------------------------------------------------------------------\n// LOADING DISPLAY\n// -----------------------------------------------------------------------------\nexport const loadingWrapper = css`\n display: flex;\n align-items: center;\n height: 3rem;\n`;\n\nexport const loadingLabel = css`\n color: ${Colour[\"text-subtler\"]};\n`;\n\nexport const spinner = css`\n margin-right: ${Spacing[\"spacing-8\"]};\n color: ${Colour[\"icon\"]};\n`;\n\n// -----------------------------------------------------------------------------\n// ERROR DISPLAY\n// -----------------------------------------------------------------------------\nexport const tryAgainLabel = css`\n color: ${Colour[\"text-primary\"]};\n text-decoration: underline;\n font-weight: ${Font.Spec[\"weight-semibold\"]};\n`;\n\nexport const errorTextContainer = css`\n display: flex;\n align-items: center;\n margin-right: ${Spacing[\"spacing-8\"]};\n`;\n\nexport const errorIcon = css`\n color: ${Colour[\"icon-warning\"]};\n margin-right: ${Spacing[\"spacing-8\"]};\n height: 1em;\n width: 1em;\n`;\n\nexport const errorLabel = css`\n color: ${Colour[\"text-warning\"]};\n`;\n\nexport const clickableErrorWrapper = css`\n width: 100%;\n height: 3rem;\n display: flex;\n justify-content: space-between;\n align-items: center;\n border: none;\n background: transparent;\n cursor: pointer;\n\n ${Font[\"body-baseline-regular\"]}\n\n &:hover,\n &:active,\n &:focus {\n .${tryAgainLabel} {\n color: ${Colour[\"text-hover\"]};\n }\n }\n`;\n\n// -----------------------------------------------------------------------------\n// READONLY MASKED DISPLAY\n// -----------------------------------------------------------------------------\nexport const readOnlyClickable = css`\n ${Font[\"body-baseline-regular\"]}\n color: ${Colour[\"text\"]};\n border: none;\n background: transparent;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-align: left;\n width: 100%;\n justify-content: space-between;\n min-height: 3rem;\n`;\n\nexport const readOnlyValueText = css`\n overflow-wrap: anywhere;\n`;\n\nexport const readOnlyIconContainer = css`\n display: flex;\n align-items: center;\n justify-content: center;\n color: ${Colour[\"icon-primary\"]};\n padding: 0 1rem;\n flex-shrink: 0;\n\n svg {\n width: ${Font.Spec[\"body-size-baseline\"]};\n height: ${Font.Spec[\"body-size-baseline\"]};\n }\n`;\n"],"names":["iconContainer","inactiveColor","activeColor"],"mappings":"oHA+FkC,6BAXZ,8BAOC,sCAbQ,gCAjDL,wCAiBQ,qCAnCJ,+BAiDL,kCANE,oCAiEG,yCAkBI,qCAJJ,0BArEV,0BA5DE,CAClBA,cAAe,CACXC,cAAe,yDACfC,YAAa,+EAiEK"}

package/{masked-input/masked-input.styles_4i1qsy.css → cjs/masked-input/masked-input.styles_1cm388a.css} RENAMED Viewed

@@ -10,7 +10,7 @@
 .eimq00u{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-right:var(--fds-spacing-8);}
 .e1roice1{color:var(--fds-colour-icon-warning);margin-right:var(--fds-spacing-8);height:1em;width:1em;}
 .e1tg5b5m{color:var(--fds-colour-text-warning);}
-.c1jw7yzb{width:100%;height:3rem;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:none;background:transparent;cursor:pointer;font-family:var(--fds-font-family);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-baseline);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-baseline);letter-spacing:var(--fds-font-body-ls-baseline);}.c1jw7yzb:hover .t12y77bq,.c1jw7yzb:active .t12y77bq,.c1jw7yzb:focus .t12y77bq{color:var(--fds-colour-text-hover);}
-.r1svptpi{font-family:var(--fds-font-family);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-baseline);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-baseline);letter-spacing:var(--fds-font-body-ls-baseline);color:var(--fds-colour-text);border:none;background:transparent;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;cursor:pointer;text-align:left;width:100%;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;min-height:3rem;}
+.c1jw7yzb{width:100%;height:3rem;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:none;background:transparent;cursor:pointer;font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-baseline);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-baseline);letter-spacing:var(--fds-font-body-ls-baseline);}.c1jw7yzb:hover .t12y77bq,.c1jw7yzb:active .t12y77bq,.c1jw7yzb:focus .t12y77bq{color:var(--fds-colour-text-hover);}
+.r1svptpi{font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-baseline);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-baseline);letter-spacing:var(--fds-font-body-ls-baseline);color:var(--fds-colour-text);border:none;background:transparent;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;cursor:pointer;text-align:left;width:100%;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;min-height:3rem;}
 .r1dgmaf{overflow-wrap:anywhere;}
 .r1mk0cgh{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;color:var(--fds-colour-icon-primary);padding:0 1rem;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}.r1mk0cgh svg{width:var(--fds-font-body-size-baseline);height:var(--fds-font-body-size-baseline);}

package/cjs/masthead/masthead.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime");require("./sgds-day.css"),require("./sgds-night.css");var t=require("clsx"),s=require("react"),d=require("styled-components"),n=require("./masthead.styles.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=r(t);const a=s.memo((({stretch:t=!1})=>{const r=s.useContext(d.ThemeContext),a="dark"===(null==r?void 0:r.colourMode);s.useEffect((()=>{i()||l()}),[]),s.useEffect((()=>{a?document.documentElement.classList.add(u):document.documentElement.classList.remove(u)}),[a]);const i=()=>document.getElementById(o),l=()=>{if(!document.getElementById(o)){const e=document.createElement("script");e.id=o,e.type="module",e.src=m,document.head.appendChild(e)}};return e.jsx("div",{className:c.default(n.wrapper,t&&n.wrapperStretch),dangerouslySetInnerHTML:{__html:"<sgds-masthead></sgds-masthead>"}})})),o="lifesg-ds-masthead-script",m="https://cdn.jsdelivr.net/npm/@govtechsg/sgds-web-component@3/components/Masthead/index.umd.js",u="sgds-night-theme";exports.Masthead=a;
+"use strict";var e=require("react/jsx-runtime");require("./sgds-day.css"),require("./sgds-night.css");var t=require("clsx"),r=require("react");require("../theme/theme-provider/index.js");var s=require("../theme/theme-provider/hooks.js");require("../theme/tokens/border.js"),require("../theme/tokens/colour.js"),require("../theme/tokens/font.js"),require("../theme/tokens/media-query.js"),require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js"),require("../util/simple-id-generator.js"),require("../util/string-helper.js"),require("@react-aria/live-announcer"),require("../theme/utils/use-media-query.js");var d=require("./masthead.styles.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=n(t);const u=r.memo((({stretch:t=!1})=>{const{mode:n}=s.useTheme(),u="dark"===n;r.useEffect((()=>{c()||l()}),[]),r.useEffect((()=>{u?document.documentElement.classList.add(o):document.documentElement.classList.remove(o)}),[u]);const c=()=>document.getElementById(a),l=()=>{if(!document.getElementById(a)){const e=document.createElement("script");e.id=a,e.type="module",e.src=m,document.head.appendChild(e)}};return e.jsx("div",{className:i.default(d.wrapper,t&&d.wrapperStretch),dangerouslySetInnerHTML:{__html:"<sgds-masthead></sgds-masthead>"}})})),a="lifesg-ds-masthead-script",m="https://cdn.jsdelivr.net/npm/@govtechsg/sgds-web-component@3/components/Masthead/index.umd.js",o="sgds-night-theme";exports.Masthead=u;
 //# sourceMappingURL=masthead.js.map

package/cjs/masthead/masthead.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"masthead.js","sources":["../../../src/masthead/masthead.tsx"],"sourcesContent":["import \"@govtechsg/sgds-web-component/themes/day.css\";\nimport \"@govtechsg/sgds-web-component/themes/night.css\";\n\nimport clsx from \"clsx\";\nimport { memo, ~~useContext,~~ useEffect } from \"react\";\nimport { ~~ThemeContext~~ } from \"~~styled-components~~\";\n\nimport * as styles from \"./masthead.styles\";\nimport type { MastheadProps } from \"./types\";\n\nconst MastheadComponent = ({ stretch = false }: MastheadProps): JSX.Element => {\n const ~~theme~~ = ~~useContext~~(~~ThemeContext~~);\n const isDarkMode = ~~theme?.colourMode~~ === \"dark\";\n\n // =============================================================================\n // EFFECTS\n // =============================================================================\n useEffect(() => {\n if (!doAssetsExist()) {\n addAssets();\n }\n }, []);\n\n useEffect(() => {\n // SGDS dark mode only takes effect when this class is set on the :root element\n if (isDarkMode) {\n document.documentElement.classList.add(SGDS_THEME_NIGHT_CLASSNAME);\n } else {\n document.documentElement.classList.remove(\n SGDS_THEME_NIGHT_CLASSNAME\n );\n }\n }, [isDarkMode]);\n\n // =============================================================================\n // HELPER FUNCTIONS\n // =============================================================================\n const doAssetsExist = () => {\n return document.getElementById(SCRIPT_ID);\n };\n\n const addAssets = () => {\n if (!document.getElementById(SCRIPT_ID)) {\n const script = document.createElement(\"script\");\n script.id = SCRIPT_ID;\n script.type = \"module\";\n script.src = SCRIPT_SRC;\n\n document.head.appendChild(script);\n }\n };\n\n const createContent = () => {\n /*\n Note: Had to use this method because we had to create a\n * custom type to handle Web Components (refer to this guide\n * https://blog.devgenius.io/how-to-use-web-components-in-react-54c951399bfd)\n * But we are having troubles exporting the custom type definition\n * via rollup\n */\n return { __html: \"<sgds-masthead></sgds-masthead>\" };\n };\n\n // =============================================================================\n // RENDER FUNCTIONS\n // =============================================================================\n\n return (\n <div\n className={clsx(styles.wrapper, stretch && styles.wrapperStretch)}\n dangerouslySetInnerHTML={createContent()}\n />\n );\n};\n\nexport const Masthead = memo(MastheadComponent);\n\n// =============================================================================\n// CONSTANTS\n// =============================================================================\nconst SCRIPT_ID = \"lifesg-ds-masthead-script\";\nconst SCRIPT_SRC =\n \"https://cdn.jsdelivr.net/npm/@govtechsg/sgds-web-component@3/components/Masthead/index.umd.js\";\nconst SGDS_THEME_NIGHT_CLASSNAME = \"sgds-night-theme\";\n"],"names":["Masthead","memo","stretch","~~theme~~","~~useContext~~","~~ThemeContext","~~isDarkMode","~~colourMode","~~useEffect","doAssetsExist","addAssets","document","documentElement","classList","add","SGDS_THEME_NIGHT_CLASSNAME","remove","getElementById","SCRIPT_ID","script","createElement","id","type","src","SCRIPT_SRC","head","appendChild","_jsx","className","clsx","styles.wrapper","styles.wrapperStretch","dangerouslySetInnerHTML","__html"],"mappings":"~~iUAUA~~,MAiEaA,EAAWC,EAAAA,MAjEE,EAAGC,WAAU,MACnC,MAAMC,~~EAAQC~~,~~EAAAA~~,~~WAAWC~~,~~gBACnBC~~,~~EAAmC~~,~~UAAtBH~~,~~aAAK,EAALA,EAAOI,YAK1BC,~~EAAAA,WAAU,KACDC,KACDC,GACJ,GACD,IAEHF,EAAAA,WAAU,~~KAEFF~~,~~EACAK~~,SAASC,gBAAgBC,UAAUC,IAAIC,GAEvCJ,SAASC,gBAAgBC,UAAUG,OAC/BD,EAER,GACD,~~CAACT~~,IAKJ,~~MAAMG~~,EAAgB,IACXE,SAASM,eAAeC,GAG7BR,EAAY,KACd,IAAKC,SAASM,eAAeC,GAAY,CACrC,MAAMC,EAASR,SAASS,cAAc,UACtCD,EAAOE,GAAKH,EACZC,EAAOG,KAAO,SACdH,EAAOI,IAAMC,EAEbb,SAASc,KAAKC,YAAYP,EAC9B,GAkBJ,OACIQ,aACIC,UAAWC,EAAAA,QAAKC,EAAAA,~~QAAgB5B~~,~~GAAW6B~~,kBAC3CC,wBAVG,CAAEC,OAAQ,oCAWf,IASJf,EAAY,4BACZM,EACF,gGACET,EAA6B"}
1	+ {"version":3,"file":"masthead.js","sources":["../../../src/masthead/masthead.tsx"],"sourcesContent":["import \"@govtechsg/sgds-web-component/themes/day.css\";\nimport \"@govtechsg/sgds-web-component/themes/night.css\";\n\nimport clsx from \"clsx\";\nimport { memo, useEffect } from \"react\";\n\nimport { useTheme } from \"../theme\";\n\nimport * as styles from \"./masthead.styles\";\nimport type { MastheadProps } from \"./types\";\n\nconst MastheadComponent = ({ stretch = false }: MastheadProps): JSX.Element => {\n const { mode } = useTheme();\n const isDarkMode = mode === \"dark\";\n\n // =============================================================================\n // EFFECTS\n // =============================================================================\n useEffect(() => {\n if (!doAssetsExist()) {\n addAssets();\n }\n }, []);\n\n useEffect(() => {\n // SGDS dark mode only takes effect when this class is set on the :root element\n if (isDarkMode) {\n document.documentElement.classList.add(SGDS_THEME_NIGHT_CLASSNAME);\n } else {\n document.documentElement.classList.remove(\n SGDS_THEME_NIGHT_CLASSNAME\n );\n }\n }, [isDarkMode]);\n\n // =============================================================================\n // HELPER FUNCTIONS\n // =============================================================================\n const doAssetsExist = () => {\n return document.getElementById(SCRIPT_ID);\n };\n\n const addAssets = () => {\n if (!document.getElementById(SCRIPT_ID)) {\n const script = document.createElement(\"script\");\n script.id = SCRIPT_ID;\n script.type = \"module\";\n script.src = SCRIPT_SRC;\n\n document.head.appendChild(script);\n }\n };\n\n const createContent = () => {\n /*\n Note: Had to use this method because we had to create a\n * custom type to handle Web Components (refer to this guide\n * https://blog.devgenius.io/how-to-use-web-components-in-react-54c951399bfd)\n * But we are having troubles exporting the custom type definition\n * via rollup\n */\n return { __html: \"<sgds-masthead></sgds-masthead>\" };\n };\n\n // =============================================================================\n // RENDER FUNCTIONS\n // =============================================================================\n\n return (\n <div\n className={clsx(styles.wrapper, stretch && styles.wrapperStretch)}\n dangerouslySetInnerHTML={createContent()}\n />\n );\n};\n\nexport const Masthead = memo(MastheadComponent);\n\n// =============================================================================\n// CONSTANTS\n// =============================================================================\nconst SCRIPT_ID = \"lifesg-ds-masthead-script\";\nconst SCRIPT_SRC =\n \"https://cdn.jsdelivr.net/npm/@govtechsg/sgds-web-component@3/components/Masthead/index.umd.js\";\nconst SGDS_THEME_NIGHT_CLASSNAME = \"sgds-night-theme\";\n"],"names":["Masthead","memo","stretch","mode","useTheme","isDarkMode","useEffect","doAssetsExist","addAssets","document","documentElement","classList","add","SGDS_THEME_NIGHT_CLASSNAME","remove","getElementById","SCRIPT_ID","script","createElement","id","type","src","SCRIPT_SRC","head","appendChild","_jsx","className","clsx","styles.wrapper","styles.wrapperStretch","dangerouslySetInnerHTML","__html"],"mappings":"4wBAWA,MAiEaA,EAAWC,EAAAA,MAjEE,EAAGC,WAAU,MACnC,MAAMC,KAAEA,GAASC,aACXC,EAAsB,SAATF,EAKnBG,EAAAA,WAAU,KACDC,KACDC,GACJ,GACD,IAEHF,EAAAA,WAAU,KAEFD,EACAI,SAASC,gBAAgBC,UAAUC,IAAIC,GAEvCJ,SAASC,gBAAgBC,UAAUG,OAC/BD,EAER,GACD,CAACR,IAKJ,MAAME,EAAgB,IACXE,SAASM,eAAeC,GAG7BR,EAAY,KACd,IAAKC,SAASM,eAAeC,GAAY,CACrC,MAAMC,EAASR,SAASS,cAAc,UACtCD,EAAOE,GAAKH,EACZC,EAAOG,KAAO,SACdH,EAAOI,IAAMC,EAEbb,SAASc,KAAKC,YAAYP,EAC9B,GAkBJ,OACIQ,aACIC,UAAWC,EAAAA,QAAKC,EAAAA,QAAgB1B,GAAW2B,kBAC3CC,wBAVG,CAAEC,OAAQ,oCAWf,IASJf,EAAY,4BACZM,EACF,gGACET,EAA6B"}

package/cjs/modal/modal-box.styles.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";require("./modal-box.styles_1xrlxhd.css");exports.box="b14nv3ev",exports.closeButton="ccgs01o";
+"use strict";require("./modal-box.styles_y52cts.css");exports.box="b14nv3ev",exports.closeButton="ccgs01o";
 //# sourceMappingURL=modal-box.styles.js.map

package/cjs/modal/modal-box.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"modal-box.styles.js","sources":["../../../src/modal/modal-box.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Colour, MediaQuery, Radius, Shadow, Spacing } from \"../theme\";\n\nexport const box = css`\n position: relative;\n display: flex;\n flex-direction: column;\n width: 40rem;\n max-height: 70%;\n background: ${Colour.bg};\n box-shadow: ${Shadow[\"lg-strong\"]};\n border-radius: ${Radius[\"lg\"]};\n overflow: hidden;\n\n ${MediaQuery.MaxWidth.md} {\n width: 90%;\n max-height: 70%;\n }\n`;\n\nexport const closeButton = css`\n position: absolute;\n top: var(~~--close-button-top-inset,~~ ${Spacing[\"spacing-16\"]});\n right: var(~~--close-button-right-inset,~~ ${Spacing[\"spacing-16\"]});\n padding: 0;\n color: ${Colour.icon};\n\n svg {\n height: 2rem;\n width: 2rem;\n }\n\n ${MediaQuery.MaxWidth.sm} {\n right: var(~~--close-button-right-inset,~~ ${Spacing[\"spacing-20\"]});\n }\n`;\n"],"names":[],"mappings":"~~wFAIgB~~,+BAiBQ"}
1	+ {"version":3,"file":"modal-box.styles.js","sources":["../../../src/modal/modal-box.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Colour, MediaQuery, Radius, Shadow, Spacing } from \"../theme\";\nimport * as modalStyles from \"./modal.styles\";\n\nexport const box = css`\n position: relative;\n display: flex;\n flex-direction: column;\n width: 40rem;\n max-height: 70%;\n background: ${Colour.bg};\n box-shadow: ${Shadow[\"lg-strong\"]};\n border-radius: ${Radius[\"lg\"]};\n overflow: hidden;\n\n ${MediaQuery.MaxWidth.md} {\n width: 90%;\n max-height: 70%;\n }\n`;\n\nexport const closeButton = css`\n position: absolute;\n top: var(\n ${modalStyles.tokens.closeButton.topInset},\n ${Spacing[\"spacing-16\"]}\n );\n right: var(\n ${modalStyles.tokens.closeButton.rightInset},\n ${Spacing[\"spacing-16\"]}\n );\n padding: 0;\n color: ${Colour.icon};\n\n svg {\n height: 2rem;\n width: 2rem;\n }\n\n ${MediaQuery.MaxWidth.sm} {\n right: var(\n ${modalStyles.tokens.closeButton.rightInset},\n ${Spacing[\"spacing-20\"]}\n );\n }\n`;\n"],"names":[],"mappings":"uFAKgB,+BAiBQ"}

package/cjs/modal/modal-box.styles_y52cts.css ADDED Viewed

@@ -0,0 +1,11 @@
+.b14nv3ev{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;width:40rem;max-height:70%;background:var(--fds-colour-bg);box-shadow:var(--fds-shadow-lg-strong);border-radius:var(--fds-radius-lg);overflow:hidden;}:where(body.fds-breakpoint-md-max) .b14nv3ev{width:90%;max-height:70%;}
+.ccgs01o{position:absolute;top:var(
+        --fds-internal-modal-closeButton-topInset,
+        var(--fds-spacing-16)
+    );right:var(
+        --fds-internal-modal-closeButton-rightInset,
+        var(--fds-spacing-16)
+    );padding:0;color:var(--fds-colour-icon);}.ccgs01o svg{height:2rem;width:2rem;}:where(body.fds-breakpoint-sm-max) .ccgs01o{right:var(
+            --fds-internal-modal-closeButton-rightInset,
+            var(--fds-spacing-20)
+        );}

package/cjs/modal/modal.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var e=require("../_virtual/_tslib.js"),r=require("react/jsx-runtime"),t=require("clsx"),o=require("react"),i=require("../overlay/overlay.js"),n=require("../shared/hooks/useViewport.js");require("../theme/theme-provider/index.js"),require("../theme/theme-provider/context.js"),require("../theme/tokens/border.js"),require("../theme/tokens/colour.js"),require("../theme/tokens/font.js"),require("../theme/tokens/media-query.js");var l=require("../theme/utils/use-apply-styles.js");require("../theme/utils/use-media-query.js"),require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js"),require("../util/simple-id-generator.js"),require("../util/string-helper.js"),require("@react-aria/live-announcer");var a=require("../util/use-event.js"),s=require("./modal.styles.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=u(t),d=u(o);const m={top:s.containerFromTop,bottom:s.containerFromBottom,left:s.containerFromLeft,right:s.containerFromRight},h={top:s.containerFromTopShow,bottom:s.containerFromBottomShow,left:s.containerFromLeftShow,right:s.containerFromRightShow};exports.Modal=t=>{var{id:u="modal",show:v,animationFrom:j="bottom",children:p,enableOverlayClick:q=!0,rootComponentId:f,zIndex:y,onOverlayClick:b,dismissKeyboardOnShow:k=!0,className:x}=t,w=e.__rest(t,["id","show","animationFrom","children","enableOverlayClick","rootComponentId","zIndex","onOverlayClick","dismissKeyboardOnShow","className"]);const{verticalHeight:F,offsetTop:O}=n.useViewport(),g=o.useRef(null),C=o.useRef(null),S=p&&d.default.cloneElement(p,{ref:g});l.useApplyStyle(C,{[s.tokens.container.verticalHeight]:null==F?null:`${F}px`,[s.tokens.container.offsetTop]:null==O?null:`${O}px`});const I=a.useEvent((()=>{var e,r;k&&(null===(r=null===(e=document.activeElement)||void 0===e?void 0:e.blur)||void 0===r||r.call(e))}));return o.useEffect((()=>{v&&I()}),[v,I]),r.jsx(i.Overlay,{"data-testid":`${u}-overlay`,show:v,enableOverlayClick:q,onOverlayClick:b,id:u,rootId:f,containerRef:g,zIndex:y,children:r.jsx("div",Object.assign({ref:C,"data-testid":u},w,{className:c.default(s.container,m[j],v&&h[j],v?s.containerShow:s.containerHide,x),children:S}))})};
+"use strict";var e=require("../_virtual/_tslib.js"),r=require("react/jsx-runtime"),t=require("clsx"),o=require("react"),i=require("../overlay/overlay.js"),n=require("../shared/hooks/useViewport.js");require("../theme/theme-provider/index.js"),require("../theme/theme-provider/context.js"),require("../theme/tokens/border.js"),require("../theme/tokens/colour.js"),require("../theme/tokens/font.js"),require("../theme/tokens/media-query.js");var a=require("../theme/utils/use-apply-styles.js");require("../theme/utils/use-media-query.js"),require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js"),require("../util/simple-id-generator.js"),require("../util/string-helper.js"),require("@react-aria/live-announcer");var l=require("../util/use-event.js"),s=require("./modal.styles.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=u(t),c=u(o);const m={top:s.containerFromTop,bottom:s.containerFromBottom,left:s.containerFromLeft,right:s.containerFromRight},h={top:s.containerFromTopShow,bottom:s.containerFromBottomShow,left:s.containerFromLeftShow,right:s.containerFromRightShow};exports.Modal=t=>{var{id:u="modal",show:v,animationFrom:j="bottom",children:q,enableOverlayClick:y=!0,rootComponentId:p,zIndex:f,onOverlayClick:b,dismissKeyboardOnShow:k=!0,className:w}=t,x=e.__rest(t,["id","show","animationFrom","children","enableOverlayClick","rootComponentId","zIndex","onOverlayClick","dismissKeyboardOnShow","className"]);const F=l.useEvent((()=>{var e,r;k&&(null===(r=null===(e=document.activeElement)||void 0===e?void 0:e.blur)||void 0===r||r.call(e))})),{verticalHeight:O,ready:g}=n.useViewport({enabled:v,onBeforeStart:F}),S=o.useRef(null),C=o.useRef(null),I=q&&c.default.cloneElement(q,{ref:S});return a.useApplyStyle(C,{[s.tokens.container.verticalHeight]:null==O?null:`${O}px`}),r.jsx(i.Overlay,{"data-testid":`${u}-overlay`,show:v,enableOverlayClick:y,onOverlayClick:b,id:u,rootId:p,containerRef:S,zIndex:f,children:r.jsx("div",Object.assign({ref:C,"data-testid":u},x,{className:d.default(s.container,m[j],v&&g?[h[j],s.containerShow]:s.containerHide,w),children:I}))})};
 //# sourceMappingURL=modal.js.map

package/cjs/modal/modal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"modal.js","sources":["../../../src/modal/modal.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { ~~useEffect,~~ useRef } from \"react\";\n\nimport type { ModalAnimationDirection } from \"../modal-v2/types\";\nimport { Overlay } from \"../overlay/overlay\";\nimport { useViewport } from \"../shared/hooks\";\nimport { useApplyStyle } from \"../theme\";\nimport { useEvent } from \"../util\";\nimport * as styles from \"./modal.styles\";\nimport type { ModalProps } from \"./types\";\n\nconst ANIMATION_FROM_CLASS_MAP: Record<ModalAnimationDirection, string> = {\n top: styles.containerFromTop,\n bottom: styles.containerFromBottom,\n left: styles.containerFromLeft,\n right: styles.containerFromRight,\n};\n\nconst ANIMATION_FROM_SHOW_CLASS_MAP: Record<ModalAnimationDirection, string> = {\n top: styles.containerFromTopShow,\n bottom: styles.containerFromBottomShow,\n left: styles.containerFromLeftShow,\n right: styles.containerFromRightShow,\n};\n\nexport const Modal = ({\n id = \"modal\",\n show,\n animationFrom = \"bottom\",\n children,\n enableOverlayClick = true,\n rootComponentId,\n zIndex,\n onOverlayClick,\n dismissKeyboardOnShow = true,\n className,\n ...otherProps\n}: ModalProps): JSX.Element => {\n // =============================================================================\n // CONST, STATE, REF\n // =============================================================================\n const { verticalHeight, ~~offsetTop~~ } = useViewport();\n const childRef = useRef<HTMLDivElement>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n const childWithRef =\n children && React.cloneElement(children, { ref: childRef });\n\n useApplyStyle(containerRef, {\n [styles.tokens.container.verticalHeight]:\n verticalHeight == null ? null : `${verticalHeight}px`,\n ~~[styles.tokens.container.offsetTop]:\n offsetTop == null ? null : `${offsetTop}px`,\n~~ });\n\n // =============================================================================\n // EFFECTS\n // =============================================================================\n const dismissKeyboard = useEvent(() => {\n if (dismissKeyboardOnShow) {\n (document.activeElement as HTMLElement)?.blur?.();\n }\n });\n\n useEffect(() => {\n if (show) {\n dismissKeyboard();\n }\n }, [show, dismissKeyboard]);\n\n // =============================================================================\n // RENDER FUNCTIONS\n // =============================================================================\n return (\n <Overlay\n data-testid={`${id}-overlay`}\n show={show}\n enableOverlayClick={enableOverlayClick}\n onOverlayClick={onOverlayClick}\n id={id}\n rootId={rootComponentId}\n containerRef={childRef}\n zIndex={zIndex}\n >\n <div\n ref={containerRef}\n data-testid={id}\n {...otherProps}\n className={clsx(\n styles.container,\n ANIMATION_FROM_CLASS_MAP[animationFrom],\n show && ANIMATION_FROM_SHOW_CLASS_MAP[animationFrom],\n ~~show ?~~ styles.containerShow : styles.containerHide,\n className\n )}\n >\n {childWithRef}\n </div>\n </Overlay>\n );\n};\n"],"names":["ANIMATION_FROM_CLASS_MAP","top","styles.containerFromTop","bottom","styles.containerFromBottom","left","styles.containerFromLeft","right","styles.containerFromRight","ANIMATION_FROM_SHOW_CLASS_MAP","styles.containerFromTopShow","styles.containerFromBottomShow","styles.containerFromLeftShow","styles.containerFromRightShow","_a","id","show","animationFrom","children","enableOverlayClick","rootComponentId","zIndex","onOverlayClick","dismissKeyboardOnShow","className","otherProps","__rest","~~verticalHeight~~","~~offsetTop~~","~~useViewport~~","~~childRef~~","~~useRef~~","~~containerRef~~","~~childWithRef~~","~~React~~","~~cloneElement~~","~~ref~~","~~useApplyStyle~~","~~styles.tokens~~","~~container~~","~~dismissKeyboard~~","~~useEvent~~","_b","~~document~~","~~activeElement~~","~~blur~~","~~useEffect~~","_jsx","Overlay","rootId","Object","assign","clsx","styles.container","styles.containerShow","styles.containerHide"],"mappings":"43BAWA,MAAMA,EAAoE,CACtEC,IAAKC,EAAAA,iBACLC,OAAQC,EAAAA,oBACRC,KAAMC,EAAAA,kBACNC,MAAOC,EAAAA,oBAGLC,EAAyE,CAC3ER,IAAKS,EAAAA,qBACLP,OAAQQ,EAAAA,wBACRN,KAAMO,EAAAA,sBACNL,MAAOM,EAAAA,sCAGWC,IAAA,IAAAC,GAClBA,EAAK,QAAOC,KACZA,EAAIC,cACJA,EAAgB,SAAQC,SACxBA,EAAQC,mBACRA,GAAqB,EAAIC,gBACzBA,EAAeC,OACfA,EAAMC,eACNA,EAAcC,sBACdA,GAAwB,EAAIC,UAC5BA,GAASV,EACNW,EAAUC,EAAAA,OAAAZ,EAXK,+IAgBlB,MAAMa,eAAEA,EAAcC,~~UAAEA~~,~~GAAcC~~,~~gBAChCC~~,EAAWC,EAAAA,OAAuB,MAClCC,EAAeD,EAAAA,OAAuB,MACtCE,~~EACFf~~,~~GAAYgB~~,UAAMC,~~aAAajB~~,EAAU,~~CAAEkB~~,IAAKN,~~IAEpDO~~,EAAAA,cAAcL,EAAc,CACxB,CAACM,EAAAA,OAAcC,~~UAAUZ~~,gBACH,MAAlBA,EAAyB,KAAO,GAAGA,~~MACvC~~,~~CAACW,~~EAAAA,~~OAAcC~~,~~UAAUX,WACR,MAAbA,EAAoB,KAAO,GAAGA,QAMtC,MAAMY,EAAkBC,~~EAAAA,~~UAAS~~,~~aACzBlB~~,~~YACAmB~~,~~EAAuC~~,~~UAAtCC,SAASC,qBAA6B,IAAA9B,OAAA,EAAAA,EAAE+B,6BAC7C,IAYJ,OATAC,EAAAA,WAAU,KACF9B,GACAwB,GACJ,GACD,CAACxB,EAAMwB,IAMNO,MAACC,EAAAA,uBACgB,GAAGjC,~~YAChBC,KAAMA,EACNG,mBAAoBA,EACpBG,eAAgBA,EAChBP,GAAIA,~~EACJkC~~,~~OAAQ7B~~,~~EACRY~~,aAAcF,~~EACdT~~,OAAQA,EAAMH,~~SAEd6B~~,EAAAA,IAAA,MAAAG,OAAAC,OAAA,~~CACIf~~,IAAKJ,~~gBACQjB~~,GACTU,EAAU,CACdD,~~UAAW4B~~,EAAAA,QACPC,EAAAA,~~UACArD~~,EAAyBiB,GACzBD,~~GAAQP~~,EAA8BQ,~~GACtCD~~,~~EAAOsC,~~EAAAA,~~cAAuBC~~,EAAAA,~~cAC9B/B~~,GACHN,~~SAEAe~~,MAEC"}
1	+ {"version":3,"file":"modal.js","sources":["../../../src/modal/modal.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useRef } from \"react\";\n\nimport type { ModalAnimationDirection } from \"../modal-v2/types\";\nimport { Overlay } from \"../overlay/overlay\";\nimport { useViewport } from \"../shared/hooks\";\nimport { useApplyStyle } from \"../theme\";\nimport { useEvent } from \"../util\";\nimport * as styles from \"./modal.styles\";\nimport type { ModalProps } from \"./types\";\n\nconst ANIMATION_FROM_CLASS_MAP: Record<ModalAnimationDirection, string> = {\n top: styles.containerFromTop,\n bottom: styles.containerFromBottom,\n left: styles.containerFromLeft,\n right: styles.containerFromRight,\n};\n\nconst ANIMATION_FROM_SHOW_CLASS_MAP: Record<ModalAnimationDirection, string> = {\n top: styles.containerFromTopShow,\n bottom: styles.containerFromBottomShow,\n left: styles.containerFromLeftShow,\n right: styles.containerFromRightShow,\n};\n\nexport const Modal = ({\n id = \"modal\",\n show,\n animationFrom = \"bottom\",\n children,\n enableOverlayClick = true,\n rootComponentId,\n zIndex,\n onOverlayClick,\n dismissKeyboardOnShow = true,\n className,\n ...otherProps\n}: ModalProps): JSX.Element => {\n // =============================================================================\n // CONST, STATE, REF\n // =============================================================================\n const dismissKeyboard = useEvent(() => {\n if (dismissKeyboardOnShow) {\n (document.activeElement as HTMLElement)?.blur?.();\n }\n });\n const { verticalHeight, ready } = useViewport({\n enabled: show,\n onBeforeStart: dismissKeyboard,\n });\n const childRef = useRef<HTMLDivElement>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n const childWithRef =\n children && React.cloneElement(children, { ref: childRef });\n\n useApplyStyle(containerRef, {\n [styles.tokens.container.verticalHeight]:\n verticalHeight == null ? null : `${verticalHeight}px`,\n });\n\n // =============================================================================\n // RENDER FUNCTIONS\n // =============================================================================\n return (\n <Overlay\n data-testid={`${id}-overlay`}\n show={show}\n enableOverlayClick={enableOverlayClick}\n onOverlayClick={onOverlayClick}\n id={id}\n rootId={rootComponentId}\n containerRef={childRef}\n zIndex={zIndex}\n >\n <div\n ref={containerRef}\n data-testid={id}\n {...otherProps}\n className={clsx(\n styles.container,\n ANIMATION_FROM_CLASS_MAP[animationFrom],\n show && ready\n ? [\n ANIMATION_FROM_SHOW_CLASS_MAP[animationFrom],\n styles.containerShow,\n ]\n : styles.containerHide,\n className\n )}\n >\n {childWithRef}\n </div>\n </Overlay>\n );\n};\n"],"names":["ANIMATION_FROM_CLASS_MAP","top","styles.containerFromTop","bottom","styles.containerFromBottom","left","styles.containerFromLeft","right","styles.containerFromRight","ANIMATION_FROM_SHOW_CLASS_MAP","styles.containerFromTopShow","styles.containerFromBottomShow","styles.containerFromLeftShow","styles.containerFromRightShow","_a","id","show","animationFrom","children","enableOverlayClick","rootComponentId","zIndex","onOverlayClick","dismissKeyboardOnShow","className","otherProps","__rest","dismissKeyboard","useEvent","_b","document","activeElement","blur","verticalHeight","ready","useViewport","enabled","onBeforeStart","childRef","useRef","containerRef","childWithRef","React","cloneElement","ref","useApplyStyle","styles.tokens","container","_jsx","Overlay","rootId","Object","assign","clsx","styles.container","styles.containerShow","styles.containerHide"],"mappings":"43BAWA,MAAMA,EAAoE,CACtEC,IAAKC,EAAAA,iBACLC,OAAQC,EAAAA,oBACRC,KAAMC,EAAAA,kBACNC,MAAOC,EAAAA,oBAGLC,EAAyE,CAC3ER,IAAKS,EAAAA,qBACLP,OAAQQ,EAAAA,wBACRN,KAAMO,EAAAA,sBACNL,MAAOM,EAAAA,sCAGWC,IAAA,IAAAC,GAClBA,EAAK,QAAOC,KACZA,EAAIC,cACJA,EAAgB,SAAQC,SACxBA,EAAQC,mBACRA,GAAqB,EAAIC,gBACzBA,EAAeC,OACfA,EAAMC,eACNA,EAAcC,sBACdA,GAAwB,EAAIC,UAC5BA,GAASV,EACNW,EAAUC,EAAAA,OAAAZ,EAXK,+IAgBlB,MAAMa,EAAkBC,EAAAA,UAAS,aACzBL,YACAM,EAAuC,UAAtCC,SAASC,qBAA6B,IAAAjB,OAAA,EAAAA,EAAEkB,6BAC7C,KAEEC,eAAEA,EAAcC,MAAEA,GAAUC,cAAY,CAC1CC,QAASpB,EACTqB,cAAeV,IAEbW,EAAWC,EAAAA,OAAuB,MAClCC,EAAeD,EAAAA,OAAuB,MACtCE,EACFvB,GAAYwB,UAAMC,aAAazB,EAAU,CAAE0B,IAAKN,IAUpD,OARAO,EAAAA,cAAcL,EAAc,CACxB,CAACM,EAAAA,OAAcC,UAAUd,gBACH,MAAlBA,EAAyB,KAAO,GAAGA,QAOvCe,EAAAA,IAACC,EAAAA,QAAO,CAAA,cACS,GAAGlC,YAChBC,KAAMA,EACNG,mBAAoBA,EACpBG,eAAgBA,EAChBP,GAAIA,EACJmC,OAAQ9B,EACRoB,aAAcF,EACdjB,OAAQA,EAAMH,SAEd8B,EAAAA,IAAA,MAAAG,OAAAC,OAAA,CACIR,IAAKJ,EAAY,cACJzB,GACTU,EAAU,CACdD,UAAW6B,EAAAA,QACPC,EAAAA,UACAtD,EAAyBiB,GACzBD,GAAQkB,EACF,CACIzB,EAA8BQ,GAC9BsC,EAAAA,eAEJC,EAAAA,cACNhC,GACHN,SAEAuB,MAEC"}

package/cjs/modal/modal.styles.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";require("./modal.styles_1sav73f.css");exports.container="czahu6t",exports.containerFromBottom="c19r0uwy",exports.containerFromBottomShow="c16qcfjk",exports.containerFromLeft="c11f2a4r",exports.containerFromLeftShow="cgnow3g",exports.containerFromRight="ck9rog9",exports.containerFromRightShow="c14dyqe6",exports.containerFromTop="c16tlthj",exports.containerFromTopShow="c1jimj00",exports.containerHide="c1d9ucpb",exports.containerShow="c140nooo",exports.tokens={container:{verticalHeight:"--fds-internal-modal-container-verticalHeight",offsetTop:"--fds-internal-modal-container-offsetTop"}};
+"use strict";require("./modal.styles_1lbblx6.css");exports.container="czahu6t",exports.containerFromBottom="c19r0uwy",exports.containerFromBottomShow="c16qcfjk",exports.containerFromLeft="c11f2a4r",exports.containerFromLeftShow="cgnow3g",exports.containerFromRight="ck9rog9",exports.containerFromRightShow="c14dyqe6",exports.containerFromTop="c16tlthj",exports.containerFromTopShow="c1jimj00",exports.containerHide="c1d9ucpb",exports.containerShow="c140nooo",exports.tokens={container:{verticalHeight:"--fds-internal-modal-container-verticalHeight"}};
 //# sourceMappingURL=modal.styles.js.map

package/cjs/modal/modal.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"modal.styles.js","sources":["../../../src/modal/modal.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { MediaQuery } from \"../theme\";\n\nexport const tokens = {\n container: {\n verticalHeight: \"--fds-internal-modal-container-verticalHeight\",\n ~~offsetTop~~: \"--fds-internal-modal-~~container~~-~~offsetTop~~\",\n },\n} as const;\n\nexport const container = css`\n position: relative;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100%;\n width: 100%;\n overflow: hidden;\n\n ${tokens.container.verticalHeight}: initial;\n ${tokens.~~container~~.~~offsetTop~~}: initial;\n\n ${MediaQuery.MaxWidth.sm} {\n height: calc(var(${tokens.container.verticalHeight}, 1vh) * 100);\n ~~top: var(${tokens.container.offsetTop}, 0px);\n~~ }\n`;\n\nexport const containerFromTop = css`\n top: -3%;\n`;\n\nexport const containerFromBottom = css`\n bottom: -3%;\n`;\n\nexport const containerFromLeft = css`\n left: -3%;\n`;\n\nexport const containerFromRight = css`\n right: -3%;\n`;\n\nexport const containerShow = css`\n opacity: 1;\n transition: all 300ms cubic-bezier(0.21, 0.79, 0.53, 1);\n transition-delay: 200ms;\n`;\n\nexport const containerHide = css`\n opacity: 0;\n transition: all 300ms cubic-bezier(0.4, 0.34, 0.38, 1);\n`;\n\nexport const containerFromTopShow = css`\n top: 0;\n`;\n\nexport const containerFromBottomShow = css`\n bottom: 0;\n`;\n\nexport const containerFromLeftShow = css`\n left: 0;\n`;\n\nexport const containerFromRightShow = css`\n right: 0;\n`;\n"],"names":["container","verticalHeight"~~,"offsetTop"~~],"mappings":"~~0FAWsB~~,sCAsBU,2CA2BI,qCAvBN,yCA2BI,qCAvBH,yCA2BI,oCAvCN,wCA2BI,iCALP,iCANA,~~0BAzCJ~~,CAClBA,UAAW,CACPC,eAAgB~~,gDAChBC,UAAW~~"}
1	+ {"version":3,"file":"modal.styles.js","sources":["../../../src/modal/modal.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { MediaQuery } from \"../theme\";\n\nexport const tokens = {\n container: {\n verticalHeight: \"--fds-internal-modal-container-verticalHeight\",\n },\n closeButton: {\n topInset: \"--fds-internal-modal-closeButton-topInset\",\n rightInset: \"--fds-internal-modal-closeButton-rightInset\",\n },\n} as const;\n\nexport const container = css`\n position: relative;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100%;\n width: 100%;\n overflow: hidden;\n\n ${tokens.container.verticalHeight}: initial;\n ${tokens.closeButton.topInset}: initial;\n ${tokens.closeButton.rightInset}: initial;\n\n ${MediaQuery.MaxWidth.sm} {\n height: calc(var(${tokens.container.verticalHeight}, 1vh) * 100);\n }\n`;\n\nexport const containerFromTop = css`\n top: -3%;\n`;\n\nexport const containerFromBottom = css`\n bottom: -3%;\n`;\n\nexport const containerFromLeft = css`\n left: -3%;\n`;\n\nexport const containerFromRight = css`\n right: -3%;\n`;\n\nexport const containerShow = css`\n opacity: 1;\n transition: all 300ms cubic-bezier(0.21, 0.79, 0.53, 1);\n transition-delay: 200ms;\n`;\n\nexport const containerHide = css`\n opacity: 0;\n transition: all 300ms cubic-bezier(0.4, 0.34, 0.38, 1);\n`;\n\nexport const containerFromTopShow = css`\n top: 0;\n`;\n\nexport const containerFromBottomShow = css`\n bottom: 0;\n`;\n\nexport const containerFromLeftShow = css`\n left: 0;\n`;\n\nexport const containerFromRightShow = css`\n right: 0;\n`;\n"],"names":["container","verticalHeight"],"mappings":"0FAcsB,sCAsBU,2CA2BI,qCAvBN,yCA2BI,qCAvBH,yCA2BI,oCAvCN,wCA2BI,iCALP,iCANA,0BA5CJ,CAClBA,UAAW,CACPC,eAAgB"}

package/cjs/modal/{modal.styles_1sav73f.css → modal.styles_1lbblx6.css} RENAMED Viewed

@@ -1,4 +1,4 @@
-.czahu6t{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:100%;width:100%;overflow:hidden;--fds-internal-modal-container-verticalHeight:initial;--fds-internal-modal-container-offsetTop:initial;}:where(body.fds-breakpoint-sm-max) .czahu6t{height:calc(var(--fds-internal-modal-container-verticalHeight, 1vh) * 100);top:var(--fds-internal-modal-container-offsetTop, 0px);}
+.czahu6t{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:100%;width:100%;overflow:hidden;--fds-internal-modal-container-verticalHeight:initial;--fds-internal-modal-closeButton-topInset:initial;--fds-internal-modal-closeButton-rightInset:initial;}:where(body.fds-breakpoint-sm-max) .czahu6t{height:calc(var(--fds-internal-modal-container-verticalHeight, 1vh) * 100);}
 .c16tlthj{top:-3%;}
 .c19r0uwy{bottom:-3%;}
 .c11f2a4r{left:-3%;}

package/cjs/modal-v2/modal-v2.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var e=require("../_virtual/_tslib.js"),r=require("react/jsx-runtime"),a=require("@floating-ui/react"),i=require("clsx"),t=require("react"),l=require("../overlay/overlay.js"),s=require("../shared/hooks/useViewport.js");require("../theme/theme-provider/index.js"),require("../theme/theme-provider/context.js"),require("../theme/tokens/border.js"),require("../theme/tokens/colour.js"),require("../theme/tokens/font.js"),require("../theme/tokens/media-query.js");var n=require("../theme/utils/use-apply-styles.js");require("../theme/utils/use-media-query.js"),require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js"),require("../util/simple-id-generator.js"),require("../util/string-helper.js"),require("@react-aria/live-announcer");var o=require("../util/use-event.js"),u=require("./modal-context.js"),d=require("./modal-v2.styles.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var m=c(i),v=c(t);exports.ModalV2=i=>{var{id:c,show:b,onClose:h,animationFrom:j="bottom",children:y,enableOverlayClick:q=!0,rootComponentId:f,zIndex:p,onOverlayClick:x,dismissKeyboardOnShow:g=!0,"data-testid":C="modal","aria-label":k,"aria-labelledby":O,"aria-describedby":F,disableInitialFocus:I=!1,className:w}=i,N=e.__rest(i,["id","show","onClose","animationFrom","children","enableOverlayClick","rootComponentId","zIndex","onOverlayClick","dismissKeyboardOnShow","data-testid","aria-label","aria-labelledby","aria-describedby","disableInitialFocus","className"]);const{verticalHeight:E,offsetTop:M}=s.useViewport(),S=t.useRef(null),_=t.useRef(null),z=y&&v.default.cloneElement(y,{ref:S});n.useApplyStyle(_,{[d.tokens.container.verticalHeight]:null==E?null:`${E}px`,[d.tokens.container.offsetTop]:null==M?null:`${M}px`});const{refs:P,context:R}=a.useFloating({open:b,onOpenChange:e=>{e||null==h||h()}}),{isMounted:T,status:V}=a.useTransitionStatus(R,{duration:300}),$=a.useDismiss(R,{outsidePress:!1,enabled:!!h}),{getFloatingProps:H}=a.useInteractions([$]),K=o.useEvent((()=>{var e,r;g&&(null===(r=null===(e=document.activeElement)||void 0===e?void 0:e.blur)||void 0===r||r.call(e))}));return t.useEffect((()=>{b&&K()}),[b,K]),r.jsx(l.Overlay,{"data-testid":`${C}-overlay`,show:T,enableOverlayClick:q,onOverlayClick:x,id:c,rootId:f,containerRef:S,zIndex:p,children:r.jsx("div",Object.assign({ref:_,"data-testid":C,"data-status":V,"data-animation-from":j},N,{className:m.default(d.container,w),children:r.jsx(u.ModalContext.Provider,{value:{onClose:h},children:T&&r.jsx(a.FloatingFocusManager,{context:R,initialFocus:I?-1:P.floating,children:r.jsx("div",{className:d.scrollContainer,children:r.jsx("div",Object.assign({ref:P.setFloating},H(),{role:"dialog","aria-label":k,"aria-labelledby":O,"aria-describedby":F,className:d.modalContainer,children:z}))})})})}))})};
+"use strict";var e=require("../_virtual/_tslib.js"),r=require("react/jsx-runtime"),a=require("@floating-ui/react"),i=require("clsx"),t=require("react"),l=require("../overlay/overlay.js"),s=require("../shared/hooks/useViewport.js");require("../theme/theme-provider/index.js"),require("../theme/theme-provider/context.js"),require("../theme/tokens/border.js"),require("../theme/tokens/colour.js"),require("../theme/tokens/font.js"),require("../theme/tokens/media-query.js");var n=require("../theme/utils/use-apply-styles.js");require("../theme/utils/use-media-query.js"),require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js"),require("../util/simple-id-generator.js"),require("../util/string-helper.js"),require("@react-aria/live-announcer");var o=require("../util/use-event.js"),d=require("./modal-context.js"),u=require("./modal-v2.styles.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var m=c(i),v=c(t);exports.ModalV2=i=>{var{id:c,show:b,onClose:h,animationFrom:j="bottom",children:y,enableOverlayClick:q=!0,rootComponentId:x,zIndex:p,onOverlayClick:f,dismissKeyboardOnShow:g=!0,"data-testid":C="modal","aria-label":k,"aria-labelledby":O,"aria-describedby":F,disableInitialFocus:I=!1,className:w}=i,N=e.__rest(i,["id","show","onClose","animationFrom","children","enableOverlayClick","rootComponentId","zIndex","onOverlayClick","dismissKeyboardOnShow","data-testid","aria-label","aria-labelledby","aria-describedby","disableInitialFocus","className"]);const S=o.useEvent((()=>{var e,r;g&&(null===(r=null===(e=document.activeElement)||void 0===e?void 0:e.blur)||void 0===r||r.call(e))})),{verticalHeight:M}=s.useViewport({enabled:b,onBeforeStart:S}),_=t.useRef(null),z=t.useRef(null),E=y&&v.default.cloneElement(y,{ref:_});n.useApplyStyle(z,{[u.tokens.container.verticalHeight]:null==M?null:`${M}px`});const{refs:P,context:R}=a.useFloating({open:b,onOpenChange:e=>{e||null==h||h()}}),{isMounted:V,status:H}=a.useTransitionStatus(R,{duration:300}),K=a.useDismiss(R,{outsidePress:!1,enabled:!!h}),{getFloatingProps:$}=a.useInteractions([K]);return r.jsx(l.Overlay,{"data-testid":`${C}-overlay`,show:b,enableOverlayClick:q,onOverlayClick:f,id:c,rootId:x,containerRef:_,zIndex:p,children:r.jsx("div",Object.assign({ref:z,"data-testid":C,"data-status":H,"data-animation-from":j},N,{className:m.default(u.container,w),children:r.jsx(d.ModalContext.Provider,{value:{onClose:h},children:V&&r.jsx(a.FloatingFocusManager,{context:R,initialFocus:I?-1:P.floating,children:r.jsx("div",{className:u.scrollContainer,children:r.jsx("div",Object.assign({ref:P.setFloating},$(),{role:"dialog","aria-label":k,"aria-labelledby":O,"aria-describedby":F,className:u.modalContainer,children:E}))})})})}))})};
 //# sourceMappingURL=modal-v2.js.map

package/cjs/modal-v2/modal-v2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"modal-v2.js","sources":["../../../src/modal-v2/modal-v2.tsx"],"sourcesContent":["import {\n FloatingFocusManager,\n useDismiss,\n useFloating,\n useInteractions,\n useTransitionStatus,\n} from \"@floating-ui/react\";\nimport clsx from \"clsx\";\nimport React, { ~~useEffect,~~ useRef } from \"react\";\n\nimport { Overlay } from \"../overlay/overlay\";\nimport { useViewport } from \"../shared/hooks\";\nimport { useApplyStyle } from \"../theme\";\nimport { useEvent } from \"../util\";\nimport { ModalContext } from \"./modal-context\";\nimport * as styles from \"./modal-v2.styles\";\nimport type { ModalV2Props } from \"./types\";\n\nexport const ModalV2 = ({\n id,\n show,\n onClose,\n animationFrom = \"bottom\",\n children,\n enableOverlayClick = true,\n rootComponentId,\n zIndex,\n onOverlayClick,\n dismissKeyboardOnShow = true,\n \"data-testid\": testId = \"modal\",\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\": ariaDescribedBy,\n disableInitialFocus = false,\n className,\n ...otherProps\n}: ModalV2Props): JSX.Element => {\n // =========================================================================\n // CONST, STATE, REF\n // =========================================================================\n const { ~~verticalHeight,~~ ~~offsetTop~~ } = useViewport();\n const childRef = useRef<HTMLDivElement>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n const childWithRef =\n children && React.cloneElement(children, { ref: childRef });\n\n useApplyStyle(containerRef, {\n [styles.tokens.container.verticalHeight]:\n verticalHeight == null ? null : `${verticalHeight}px`,\n ~~[styles.tokens.container.offsetTop]:\n offsetTop == null ? null : `${offsetTop}px`,\n~~ });\n\n // =========================================================================\n // FLOATING UI CONFIG\n // =========================================================================\n const { refs, context } = useFloating({\n open: show,\n onOpenChange: (isOpen) => {\n if (!isOpen) {\n onClose?.();\n }\n },\n });\n const { isMounted, status } = useTransitionStatus(context, {\n duration: 300,\n });\n const dismiss = useDismiss(context, {\n /* handled by overlayclick */\n outsidePress: false,\n enabled: !!onClose,\n });\n const { getFloatingProps } = useInteractions([dismiss]);\n\n // =========================================================================\n // EFFECTS\n // =========================================================================\n const dismissKeyboard = useEvent(() => {\n if (dismissKeyboardOnShow) {\n (document.activeElement as HTMLElement)?.blur?.();\n }\n });\n\n useEffect(() => {\n if (show) {\n dismissKeyboard();\n }\n }, [show, dismissKeyboard]);\n\n // =========================================================================\n // RENDER FUNCTIONS\n // =========================================================================\n return (\n <Overlay\n data-testid={`${testId}-overlay`}\n show={~~isMounted~~}\n enableOverlayClick={enableOverlayClick}\n onOverlayClick={onOverlayClick}\n id={id}\n rootId={rootComponentId}\n containerRef={childRef}\n zIndex={zIndex}\n >\n <div\n ref={containerRef}\n data-testid={testId}\n data-status={status}\n data-animation-from={animationFrom}\n {...otherProps}\n className={clsx(styles.container, className)}\n >\n <ModalContext.Provider value={{ onClose }}>\n {isMounted && (\n <FloatingFocusManager\n context={context}\n initialFocus={\n disableInitialFocus ? -1 : refs.floating\n }\n >\n <div className={styles.scrollContainer}>\n <div\n ref={refs.setFloating}\n {...getFloatingProps()}\n role=\"dialog\"\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-describedby={ariaDescribedBy}\n className={styles.modalContainer}\n >\n {childWithRef}\n </div>\n </div>\n </FloatingFocusManager>\n )}\n </ModalContext.Provider>\n </div>\n </Overlay>\n );\n};\n"],"names":["_a","id","show","onClose","animationFrom","children","enableOverlayClick","rootComponentId","zIndex","onOverlayClick","dismissKeyboardOnShow","testId","ariaLabel","ariaLabelledBy","ariaDescribedBy","disableInitialFocus","className","otherProps","__rest","~~verticalHeight~~","~~offsetTop~~","useViewport","childRef","useRef","containerRef","childWithRef","React","cloneElement","ref","useApplyStyle","styles.tokens","container","refs","context","useFloating","open","onOpenChange","isOpen","isMounted","status","useTransitionStatus","duration","dismiss","useDismiss","outsidePress","~~enabled","~~getFloatingProps","useInteractions","~~dismissKeyboard","useEvent","_b","document","activeElement","blur","useEffect","~~_jsx","Overlay","rootId","Object","assign","clsx","styles.container","ModalContext","Provider","value","FloatingFocusManager","initialFocus","floating","styles.scrollContainer","setFloating","role","styles.modalContainer"],"mappings":"+8BAkBwBA,QAAAC,GACpBA,EAAEC,KACFA,EAAIC,QACJA,EAAOC,cACPA,EAAgB,SAAQC,SACxBA,EAAQC,mBACRA,GAAqB,EAAIC,gBACzBA,EAAeC,OACfA,EAAMC,eACNA,EAAcC,sBACdA,GAAwB,EACxB,cAAeC,EAAS,QACxB,aAAcC,EACd,kBAAmBC,EACnB,mBAAoBC,EAAeC,oBACnCA,GAAsB,EAAKC,UAC3BA,GAAShB,EACNiB,EAAUC,EAAAA,OAAAlB,EAjBO,CAAA,KAAA,OAAA,UAAA,gBAAA,WAAA,qBAAA,kBAAA,SAAA,iBAAA,wBAAA,cAAA,aAAA,kBAAA,mBAAA,sBAAA,cAsBpB,MAAMmB,eAAEA,~~EAAcC~~,~~UAAEA~~,~~GAAcC~~,~~gBAChCC~~,EAAWC,EAAAA,OAAuB,MAClCC,EAAeD,EAAAA,OAAuB,MACtCE,~~EACFpB~~,~~GAAYqB~~,UAAMC,~~aAAatB~~,EAAU,~~CAAEuB~~,IAAKN,IAEpDO,EAAAA,cAAcL,EAAc,CACxB,CAACM,EAAAA,OAAcC,~~UAAUZ~~,gBACH,MAAlBA,EAAyB,KAAO,GAAGA,~~MACvC~~,~~CAACW~~,~~EAAAA,OAAcC,UAAUX,WACR,MAAbA,EAAoB,KAAO,GAAGA,QAMtC,MAAMY,~~KAAEA,EAAIC,QAAEA,GAAYC,cAAY,CAClCC,~~KAAMjC~~,~~EACNkC~~,aAAeC,IACNA,~~GACDlC~~,SAAAA,GACJ,~~KAGFmC~~,UAAEA,EAASC,OAAEA,GAAWC,EAAAA,oBAAoBP,EAAS,CACvDQ,SAAU,MAERC,EAAUC,EAAAA,WAAWV,EAAS,CAEhCW,cAAc,~~EACdC~~,~~UAAW1C~~,~~KAET2C~~,iBAAEA,GAAqBC,kBAAgB,~~CAACL~~,~~IAKxCM~~,~~EAAkBC~~,~~EAAAA,UAAS,aACzBvC,YACAwC,EAAuC,UAAtCC,SAASC,qBAA6B,IAAApD,OAAA,EAAAA,EAAEqD,6BAC7C,IAYJ,OATAC,EAAAA,WAAU,KACFpD,GACA8C,GACJ,GACD,CAAC9C,EAAM8C,IAMNO,~~MAACC,EAAAA,QAAO,CAAA,cACS,~~GAAG7C~~,YAChBT,~~KAAMoC~~,~~EACNhC~~,mBAAoBA,EACpBG,eAAgBA,EAChBR,GAAIA,~~EACJwD~~,~~OAAQlD~~,~~EACRiB~~,aAAcF,~~EACdd~~,OAAQA,EAAMH,~~SAEdkD~~,EAAAA,IAAA,MAAAG,OAAAC,OAAA,~~CACI/B~~,IAAKJ,EAAY,~~cACJb~~,EAAM,~~cACN4B~~,EAAM,~~sBACEnC~~,GACjBa,GACJD,~~UAAW4C~~,UAAKC,EAAAA,~~UAAkB7C~~,GAAUX,~~SAE5CkD~~,MAACO,EAAAA,aAAaC,SAAQ,CAACC,MAAO,~~CAAE7D~~,WAASE,~~SACpCiC~~,~~GACGiB~~,EAAAA,IAACU,uBAAoB,~~CACjBhC~~,QAASA,~~EACTiC~~,~~aACInD~~,GAAsB,~~EAAKiB~~,~~EAAKmC~~,~~SAAQ9D~~,~~SAG5CkD~~,EAAAA,IAAA,MAAA,~~CAAKvC~~,~~UAAWoD~~,EAAAA,~~gBAAsB/D~~,~~SAClCkD~~,MAAA,MAAAG,OAAAC,OAAA,~~CACI/B~~,IAAKI,~~EAAKqC~~,~~aACNvB~~,IAAkB,~~CACtBwB~~,KAAK,SAAQ,~~aACD1D~~,EAAS,kBACJC,EAAc,mBACbC,EAClBE,~~UAAWuD~~,EAAAA,~~wBAEV9C~~,eAOnB"}
1	+ {"version":3,"file":"modal-v2.js","sources":["../../../src/modal-v2/modal-v2.tsx"],"sourcesContent":["import {\n FloatingFocusManager,\n useDismiss,\n useFloating,\n useInteractions,\n useTransitionStatus,\n} from \"@floating-ui/react\";\nimport clsx from \"clsx\";\nimport React, { useRef } from \"react\";\n\nimport { Overlay } from \"../overlay/overlay\";\nimport { useViewport } from \"../shared/hooks\";\nimport { useApplyStyle } from \"../theme\";\nimport { useEvent } from \"../util\";\nimport { ModalContext } from \"./modal-context\";\nimport * as styles from \"./modal-v2.styles\";\nimport type { ModalV2Props } from \"./types\";\n\nexport const ModalV2 = ({\n id,\n show,\n onClose,\n animationFrom = \"bottom\",\n children,\n enableOverlayClick = true,\n rootComponentId,\n zIndex,\n onOverlayClick,\n dismissKeyboardOnShow = true,\n \"data-testid\": testId = \"modal\",\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\": ariaDescribedBy,\n disableInitialFocus = false,\n className,\n ...otherProps\n}: ModalV2Props): JSX.Element => {\n // =========================================================================\n // CONST, STATE, REF\n // =========================================================================\n const dismissKeyboard = useEvent(() => {\n if (dismissKeyboardOnShow) {\n (document.activeElement as HTMLElement)?.blur?.();\n }\n });\n const { verticalHeight } = useViewport({\n enabled: show,\n onBeforeStart: dismissKeyboard,\n });\n const childRef = useRef<HTMLDivElement>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n const childWithRef =\n children && React.cloneElement(children, { ref: childRef });\n\n useApplyStyle(containerRef, {\n [styles.tokens.container.verticalHeight]:\n verticalHeight == null ? null : `${verticalHeight}px`,\n });\n\n // =========================================================================\n // FLOATING UI CONFIG\n // =========================================================================\n const { refs, context } = useFloating({\n open: show,\n onOpenChange: (isOpen) => {\n if (!isOpen) {\n onClose?.();\n }\n },\n });\n const { isMounted, status } = useTransitionStatus(context, {\n duration: 300,\n });\n const dismiss = useDismiss(context, {\n /* handled by overlayclick */\n outsidePress: false,\n enabled: !!onClose,\n });\n const { getFloatingProps } = useInteractions([dismiss]);\n\n // =========================================================================\n // RENDER FUNCTIONS\n // =========================================================================\n return (\n <Overlay\n data-testid={`${testId}-overlay`}\n show={show}\n enableOverlayClick={enableOverlayClick}\n onOverlayClick={onOverlayClick}\n id={id}\n rootId={rootComponentId}\n containerRef={childRef}\n zIndex={zIndex}\n >\n <div\n ref={containerRef}\n data-testid={testId}\n data-status={status}\n data-animation-from={animationFrom}\n {...otherProps}\n className={clsx(styles.container, className)}\n >\n <ModalContext.Provider value={{ onClose }}>\n {isMounted && (\n <FloatingFocusManager\n context={context}\n initialFocus={\n disableInitialFocus ? -1 : refs.floating\n }\n >\n <div className={styles.scrollContainer}>\n <div\n ref={refs.setFloating}\n {...getFloatingProps()}\n role=\"dialog\"\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-describedby={ariaDescribedBy}\n className={styles.modalContainer}\n >\n {childWithRef}\n </div>\n </div>\n </FloatingFocusManager>\n )}\n </ModalContext.Provider>\n </div>\n </Overlay>\n );\n};\n"],"names":["_a","id","show","onClose","animationFrom","children","enableOverlayClick","rootComponentId","zIndex","onOverlayClick","dismissKeyboardOnShow","testId","ariaLabel","ariaLabelledBy","ariaDescribedBy","disableInitialFocus","className","otherProps","__rest","dismissKeyboard","useEvent","_b","document","activeElement","blur","verticalHeight","useViewport","enabled","onBeforeStart","childRef","useRef","containerRef","childWithRef","React","cloneElement","ref","useApplyStyle","styles.tokens","container","refs","context","useFloating","open","onOpenChange","isOpen","isMounted","status","useTransitionStatus","duration","dismiss","useDismiss","outsidePress","getFloatingProps","useInteractions","_jsx","Overlay","rootId","Object","assign","clsx","styles.container","ModalContext","Provider","value","FloatingFocusManager","initialFocus","floating","styles.scrollContainer","setFloating","role","styles.modalContainer"],"mappings":"+8BAkBwBA,QAAAC,GACpBA,EAAEC,KACFA,EAAIC,QACJA,EAAOC,cACPA,EAAgB,SAAQC,SACxBA,EAAQC,mBACRA,GAAqB,EAAIC,gBACzBA,EAAeC,OACfA,EAAMC,eACNA,EAAcC,sBACdA,GAAwB,EACxB,cAAeC,EAAS,QACxB,aAAcC,EACd,kBAAmBC,EACnB,mBAAoBC,EAAeC,oBACnCA,GAAsB,EAAKC,UAC3BA,GAAShB,EACNiB,EAAUC,EAAAA,OAAAlB,EAjBO,CAAA,KAAA,OAAA,UAAA,gBAAA,WAAA,qBAAA,kBAAA,SAAA,iBAAA,wBAAA,cAAA,aAAA,kBAAA,mBAAA,sBAAA,cAsBpB,MAAMmB,EAAkBC,EAAAA,UAAS,aACzBV,YACAW,EAAuC,UAAtCC,SAASC,qBAA6B,IAAAvB,OAAA,EAAAA,EAAEwB,6BAC7C,KAEEC,eAAEA,GAAmBC,cAAY,CACnCC,QAASzB,EACT0B,cAAeT,IAEbU,EAAWC,EAAAA,OAAuB,MAClCC,EAAeD,EAAAA,OAAuB,MACtCE,EACF3B,GAAY4B,UAAMC,aAAa7B,EAAU,CAAE8B,IAAKN,IAEpDO,EAAAA,cAAcL,EAAc,CACxB,CAACM,EAAAA,OAAcC,UAAUb,gBACH,MAAlBA,EAAyB,KAAO,GAAGA,QAM3C,MAAMc,KAAEA,EAAIC,QAAEA,GAAYC,cAAY,CAClCC,KAAMxC,EACNyC,aAAeC,IACNA,GACDzC,SAAAA,GACJ,KAGF0C,UAAEA,EAASC,OAAEA,GAAWC,EAAAA,oBAAoBP,EAAS,CACvDQ,SAAU,MAERC,EAAUC,EAAAA,WAAWV,EAAS,CAEhCW,cAAc,EACdxB,UAAWxB,KAETiD,iBAAEA,GAAqBC,kBAAgB,CAACJ,IAK9C,OACIK,MAACC,EAAAA,QAAO,CAAA,cACS,GAAG5C,YAChBT,KAAMA,EACNI,mBAAoBA,EACpBG,eAAgBA,EAChBR,GAAIA,EACJuD,OAAQjD,EACRwB,aAAcF,EACdrB,OAAQA,EAAMH,SAEdiD,EAAAA,IAAA,MAAAG,OAAAC,OAAA,CACIvB,IAAKJ,EAAY,cACJpB,EAAM,cACNmC,EAAM,sBACE1C,GACjBa,GACJD,UAAW2C,UAAKC,EAAAA,UAAkB5C,GAAUX,SAE5CiD,MAACO,EAAAA,aAAaC,SAAQ,CAACC,MAAO,CAAE5D,WAASE,SACpCwC,GACGS,EAAAA,IAACU,uBAAoB,CACjBxB,QAASA,EACTyB,aACIlD,GAAsB,EAAKwB,EAAK2B,SAAQ7D,SAG5CiD,EAAAA,IAAA,MAAA,CAAKtC,UAAWmD,EAAAA,gBAAsB9D,SAClCiD,MAAA,MAAAG,OAAAC,OAAA,CACIvB,IAAKI,EAAK6B,aACNhB,IAAkB,CACtBiB,KAAK,SAAQ,aACDzD,EAAS,kBACJC,EAAc,mBACbC,EAClBE,UAAWsD,EAAAA,wBAEVtC,eAOnB"}

package/cjs/modal-v2/modal-v2.styles.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";require("./modal-v2.styles_1irpyi6.css");exports.container="c1jrmyjd",exports.modalContainer="mn5ir3",exports.scrollContainer="s1xsiaxz",exports.tokens={container:{verticalHeight:"--fds-internal-modalV2-container-verticalHeight",offsetTop:"--fds-internal-modalV2-container-offsetTop"}};
+"use strict";require("./modal-v2.styles_a8gv5i.css");exports.container="c1jrmyjd",exports.modalContainer="mn5ir3",exports.scrollContainer="s1xsiaxz",exports.tokens={container:{verticalHeight:"--fds-internal-modalV2-container-verticalHeight"}};
 //# sourceMappingURL=modal-v2.styles.js.map