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

package/cjs/text-list/unordered-list.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../_virtual/_tslib.js"),r=require("react/jsx-runtime"),t=require("clsx"),s=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"),l=require("./text-list.styles.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=n(t),d=n(s);const o=e=>"disc"===e||"circle"===e||"square"===e||"none"===e,a=t=>{var{className:n,size:a,bulletType:c,bottomMargin:m,children:h}=t,j=e.__rest(t,["className","size","bulletType","bottomMargin","children"]);const p=s.useRef(null),q=void 0!==c&&!o(c);i.useApplyStyle(p,{[l.tokens.listBottomMargin]:`${null!=m?m:0}rem`,[l.tokens.unorderedListBulletType]:o(c)?c:null});return r.jsx("ul",Object.assign({ref:p,className:u.default(l.listBase,l.unorderedList,a&&l.listSize[a],q&&l.unorderedListCustomIcon,n)},j,{children:q?d.default.Children.map(h,(e=>d.default.isValidElement(e)?d.default.cloneElement(e,{children:r.jsxs(r.Fragment,{children:[r.jsx("div",{"aria-hidden":!0,children:c}),r.jsx("div",{children:e.props.children})]})}):e)):h}))};a.displayName="TextList.Ul",exports.UnorderedList=a;
+"use strict";var e=require("../_virtual/_tslib.js"),r=require("react/jsx-runtime"),t=require("clsx"),s=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 l=require("./text-list.styles.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=u(t),d=u(s);const a=e=>"disc"===e||"circle"===e||"square"===e||"none"===e,o=t=>{var{className:u,size:o,bulletType:c,bottomMargin:m,children:h}=t,j=e.__rest(t,["className","size","bulletType","bottomMargin","children"]);const q=s.useRef(null),p=void 0!==c&&!a(c);i.useApplyStyle(q,{[l.tokens.listBottomMargin]:`${null!=m?m:0}rem`,[l.tokens.unorderedListBulletType]:a(c)?c:null});return r.jsx("ul",Object.assign({ref:q,className:n.default(l.listBase,l.unorderedList,o&&l.listSize[o],p&&l.unorderedListCustomIcon,u)},j,{children:p?d.default.Children.map(h,(e=>d.default.isValidElement(e)?d.default.cloneElement(e,{children:r.jsxs(r.Fragment,{children:[r.jsx("div",{"aria-hidden":!0,children:c}),r.jsx("div",{children:e.props.children})]})}):e)):h}))};o.displayName="TextList.Ul",exports.UnorderedList=o;
 //# sourceMappingURL=unordered-list.js.map

package/cjs/text-list/unordered-list.js.map

@@ -1 +1 @@
-{"version":3,"file":"unordered-list.js","sources":["../../../src/text-list/unordered-list.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useRef } from \"react\";\n\nimport { useApplyStyle } from \"../theme\";\nimport * as styles from \"./text-list.styles\";\nimport type { BulletType, UnorderedListProps } from \"./types\";\n\nconst isBulletType = (value: unknown): value is BulletType =>\n    value === \"disc\" ||\n    value === \"circle\" ||\n    value === \"square\" ||\n    value === \"none\";\n\nexport const UnorderedList = ({\n    className,\n    size,\n    bulletType,\n    bottomMargin,\n    children,\n    ...otherProps\n}: UnorderedListProps) => {\n    const listRef = useRef<HTMLUListElement>(null);\n    const isCustomIcon = bulletType !== undefined && !isBulletType(bulletType);\n\n    useApplyStyle(listRef, {\n        [styles.tokens.listBottomMargin]: `${bottomMargin ?? 0}rem`,\n        [styles.tokens.unorderedListBulletType]: isBulletType(bulletType)\n            ? bulletType\n            : null,\n    });\n\n    const renderChildren = () => {\n        if (!isCustomIcon) {\n            return children;\n        }\n\n        return React.Children.map(children, (child) => {\n            if (React.isValidElement<{ children?: React.ReactNode }>(child)) {\n                return React.cloneElement(child, {\n                    children: (\n                        <>\n                            {/* Icon is decorative, hide from screen readers */}\n                            <div aria-hidden>{bulletType}</div>\n                            <div>{child.props.children}</div>\n                        </>\n                    ),\n                });\n            }\n            return child;\n        });\n    };\n\n    return (\n        <ul\n            ref={listRef}\n            className={clsx(\n                styles.listBase,\n                styles.unorderedList,\n                size && styles.listSize[size],\n                isCustomIcon && styles.unorderedListCustomIcon,\n                className\n            )}\n            {...otherProps}\n        >\n            {renderChildren()}\n        </ul>\n    );\n};\n\nUnorderedList.displayName = \"TextList.Ul\";\n"],"names":["isBulletType","value","UnorderedList","_a","className","size","bulletType","bottomMargin","children","otherProps","__rest","listRef","useRef","isCustomIcon","undefined","useApplyStyle","styles.tokens","listBottomMargin","unorderedListBulletType","_jsx","Object","assign","ref","clsx","styles.listBase","styles.unorderedList","styles.listSize","styles.unorderedListCustomIcon","React","Children","map","child","isValidElement","cloneElement","_jsxs","_Fragment","props","displayName"],"mappings":"0hBAOA,MAAMA,EAAgBC,GACR,SAAVA,GACU,WAAVA,GACU,WAAVA,GACU,SAAVA,EAESC,EAAiBC,IAAA,IAAAC,UAC1BA,EAASC,KACTA,EAAIC,WACJA,EAAUC,aACVA,EAAYC,SACZA,GAAQL,EACLM,EAAUC,EAAAA,OAAAP,EANa,6DAQ1B,MAAMQ,EAAUC,EAAAA,OAAyB,MACnCC,OAA8BC,IAAfR,IAA6BN,EAAaM,GAE/DS,EAAAA,cAAcJ,EAAS,CACnB,CAACK,SAAcC,kBAAmB,GAAGV,QAAAA,EAAgB,OACrD,CAACS,EAAAA,OAAcE,yBAA0BlB,EAAaM,GAChDA,EACA,OAwBV,OACIa,MAAA,KAAAC,OAAAC,OAAA,CACIC,IAAKX,EACLP,UAAWmB,UACPC,EAAAA,SACAC,EAAAA,cACApB,GAAQqB,EAAAA,SAAgBrB,GACxBQ,GAAgBc,EAAAA,wBAChBvB,IAEAK,EAAU,CAAAD,SA9BbK,EAIEe,EAAAA,QAAMC,SAASC,IAAItB,GAAWuB,GAC7BH,EAAAA,QAAMI,eAA+CD,GAC9CH,EAAAA,QAAMK,aAAaF,EAAO,CAC7BvB,SACI0B,EAAAA,KAAAC,EAAAA,SAAA,CAAA3B,SAAA,CAEIW,EAAAA,IAAA,MAAA,CAAA,eAAA,EAAAX,SAAkBF,IAClBa,EAAAA,IAAA,MAAA,CAAAX,SAAMuB,EAAMK,MAAM5B,gBAK3BuB,IAfAvB,IAgCN,EAIbN,EAAcmC,YAAc"}
+{"version":3,"file":"unordered-list.js","sources":["../../../src/text-list/unordered-list.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useRef } from \"react\";\n\nimport { useApplyStyle } from \"../theme\";\nimport * as styles from \"./text-list.styles\";\nimport type { BulletType, UnorderedListProps } from \"./types\";\n\nconst isBulletType = (value: unknown): value is BulletType =>\n    value === \"disc\" ||\n    value === \"circle\" ||\n    value === \"square\" ||\n    value === \"none\";\n\nexport const UnorderedList = ({\n    className,\n    size,\n    bulletType,\n    bottomMargin,\n    children,\n    ...otherProps\n}: UnorderedListProps) => {\n    const listRef = useRef<HTMLUListElement>(null);\n    const isCustomIcon = bulletType !== undefined && !isBulletType(bulletType);\n\n    useApplyStyle(listRef, {\n        [styles.tokens.listBottomMargin]: `${bottomMargin ?? 0}rem`,\n        [styles.tokens.unorderedListBulletType]: isBulletType(bulletType)\n            ? bulletType\n            : null,\n    });\n\n    const renderChildren = () => {\n        if (!isCustomIcon) {\n            return children;\n        }\n\n        return React.Children.map(children, (child) => {\n            if (React.isValidElement<{ children?: React.ReactNode }>(child)) {\n                return React.cloneElement(child, {\n                    children: (\n                        <>\n                            {/* Icon is decorative, hide from screen readers */}\n                            <div aria-hidden>{bulletType}</div>\n                            <div>{child.props.children}</div>\n                        </>\n                    ),\n                });\n            }\n            return child;\n        });\n    };\n\n    return (\n        <ul\n            ref={listRef}\n            className={clsx(\n                styles.listBase,\n                styles.unorderedList,\n                size && styles.listSize[size],\n                isCustomIcon && styles.unorderedListCustomIcon,\n                className\n            )}\n            {...otherProps}\n        >\n            {renderChildren()}\n        </ul>\n    );\n};\n\nUnorderedList.displayName = \"TextList.Ul\";\n"],"names":["isBulletType","value","UnorderedList","_a","className","size","bulletType","bottomMargin","children","otherProps","__rest","listRef","useRef","isCustomIcon","undefined","useApplyStyle","styles.tokens","listBottomMargin","unorderedListBulletType","_jsx","Object","assign","ref","clsx","styles.listBase","styles.unorderedList","styles.listSize","styles.unorderedListCustomIcon","React","Children","map","child","isValidElement","cloneElement","_jsxs","_Fragment","props","displayName"],"mappings":"2kBAOA,MAAMA,EAAgBC,GACR,SAAVA,GACU,WAAVA,GACU,WAAVA,GACU,SAAVA,EAESC,EAAiBC,IAAA,IAAAC,UAC1BA,EAASC,KACTA,EAAIC,WACJA,EAAUC,aACVA,EAAYC,SACZA,GAAQL,EACLM,EAAUC,EAAAA,OAAAP,EANa,6DAQ1B,MAAMQ,EAAUC,EAAAA,OAAyB,MACnCC,OAA8BC,IAAfR,IAA6BN,EAAaM,GAE/DS,EAAAA,cAAcJ,EAAS,CACnB,CAACK,SAAcC,kBAAmB,GAAGV,QAAAA,EAAgB,OACrD,CAACS,EAAAA,OAAcE,yBAA0BlB,EAAaM,GAChDA,EACA,OAwBV,OACIa,MAAA,KAAAC,OAAAC,OAAA,CACIC,IAAKX,EACLP,UAAWmB,UACPC,EAAAA,SACAC,EAAAA,cACApB,GAAQqB,EAAAA,SAAgBrB,GACxBQ,GAAgBc,EAAAA,wBAChBvB,IAEAK,EAAU,CAAAD,SA9BbK,EAIEe,EAAAA,QAAMC,SAASC,IAAItB,GAAWuB,GAC7BH,EAAAA,QAAMI,eAA+CD,GAC9CH,EAAAA,QAAMK,aAAaF,EAAO,CAC7BvB,SACI0B,EAAAA,KAAAC,EAAAA,SAAA,CAAA3B,SAAA,CAEIW,EAAAA,IAAA,MAAA,CAAA,eAAA,EAAAX,SAAkBF,IAClBa,EAAAA,IAAA,MAAA,CAAAX,SAAMuB,EAAMK,MAAM5B,gBAK3BuB,IAfAvB,IAgCN,EAIbN,EAAcmC,YAAc"}

package/cjs/theme/index.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("./theme-provider/index.js"),r=require("./theme-provider/hooks.js"),s=require("./tokens/border.js"),o=require("./tokens/breakpoint.js"),t=require("./tokens/colour.js"),i=require("./tokens/component.js"),n=require("./tokens/font.js"),u=require("./tokens/media-query.js"),p=require("./tokens/motion.js"),a=require("./tokens/radius.js"),l=require("./tokens/shadow.js"),x=require("./tokens/spacing.js"),d=require("./types.js"),k=require("./utils/css-variable.js"),T=require("./utils/font.js"),m=require("./utils/media-query.js"),S=require("./utils/token-resolver.js"),h=require("./utils/use-apply-styles.js"),q=require("./utils/use-design-token.js");exports.ThemeProvider=e.ThemeProvider,exports.useInheritedThemeScope=r.useInheritedThemeScope,exports.useTheme=r.useTheme,exports.Border=s.Border,exports.BorderStyle=s.BorderStyle,exports.BorderThickness=s.BorderThickness,exports.Breakpoint=o.Breakpoint,exports.Colour=t.Colour,exports.PrimitiveColours=t.PrimitiveColours,exports.SemanticColours=t.SemanticColours,exports.ComponentToken=i.ComponentToken,exports.Font=n.Font,exports.FontSpec=n.FontSpec,exports.MediaQuery=u.MediaQuery,exports.Motion=p.Motion,exports.Radius=a.Radius,exports.Shadow=l.Shadow,exports.Spacing=x.Spacing,exports.THEME_TYPES=d.THEME_TYPES,exports.getInheritedInlineCssVariables=k.getInheritedInlineCssVariables,exports.parseCSSVariableValue=k.parseCSSVariableValue,exports.parsePxOrRemValue=k.parsePxOrRemValue,exports.generateFont=T.generateFont,exports.generateFontProperties=T.generateFontProperties,exports.DEFAULT_MOBILE_MAX_WIDTH_BREAKPOINT=m.DEFAULT_MOBILE_MAX_WIDTH_BREAKPOINT,exports.useSafeMaxWidthMediaQuery=m.useSafeMaxWidthMediaQuery,exports.getEffectiveTokenOrCustom=S.getEffectiveTokenOrCustom,exports.getResolvedValue=S.getResolvedValue,exports.getTokenOrDefault=S.getTokenOrDefault,exports.isTokenFromSet=S.isTokenFromSet,exports.isTokenWithPrefix=S.isTokenWithPrefix,exports.toCssValue=S.toCssValue,exports.useApplyStyle=h.useApplyStyle,exports.useDesignToken=q.useDesignToken,exports.useResolvedTokenValue=q.useResolvedTokenValue;
+"use strict";var e=require("./theme-provider/index.js"),r=require("./theme-provider/hooks.js"),s=require("./tokens/border.js"),o=require("./tokens/breakpoint.js"),t=require("./tokens/colour.js"),i=require("./tokens/component.js"),u=require("./tokens/font.js"),n=require("./tokens/media-query.js"),a=require("./tokens/motion.js"),p=require("./tokens/radius.js"),l=require("./tokens/shadow.js"),x=require("./tokens/spacing.js"),d=require("./types.js"),k=require("./utils/css-variable.js"),T=require("./utils/font.js"),m=require("./utils/token-resolver.js"),h=require("./utils/use-apply-styles.js"),S=require("./utils/use-design-token.js"),q=require("./utils/use-media-query.js");exports.ThemeProvider=e.ThemeProvider,exports.useInheritedThemeScope=r.useInheritedThemeScope,exports.useTheme=r.useTheme,exports.Border=s.Border,exports.BorderStyle=s.BorderStyle,exports.BorderThickness=s.BorderThickness,exports.Breakpoint=o.Breakpoint,exports.Colour=t.Colour,exports.PrimitiveColours=t.PrimitiveColours,exports.SemanticColours=t.SemanticColours,exports.ComponentToken=i.ComponentToken,exports.Font=u.Font,exports.FontSpec=u.FontSpec,exports.MediaQuery=n.MediaQuery,exports.Motion=a.Motion,exports.Radius=p.Radius,exports.Shadow=l.Shadow,exports.Spacing=x.Spacing,exports.THEME_TYPES=d.THEME_TYPES,exports.extractFdsCssVariableName=k.extractFdsCssVariableName,exports.formatUnitValue=k.formatUnitValue,exports.getInheritedInlineCssVariables=k.getInheritedInlineCssVariables,exports.normalizeCssLengthValue=k.normalizeCssLengthValue,exports.parseCSSVariableValue=k.parseCSSVariableValue,exports.parsePxOrRemValue=k.parsePxOrRemValue,exports.generateFont=T.generateFont,exports.generateFontProperties=T.generateFontProperties,exports.getEffectiveTokenOrCustom=m.getEffectiveTokenOrCustom,exports.getResolvedValue=m.getResolvedValue,exports.getTokenOrDefault=m.getTokenOrDefault,exports.isTokenFromSet=m.isTokenFromSet,exports.isTokenWithPrefix=m.isTokenWithPrefix,exports.toCssValue=m.toCssValue,exports.useApplyStyle=h.useApplyStyle,exports.useDesignToken=S.useDesignToken,exports.useResolvedTokenValue=S.useResolvedTokenValue,exports.DEFAULT_MOBILE_MAX_WIDTH_BREAKPOINT=q.DEFAULT_MOBILE_MAX_WIDTH_BREAKPOINT,exports.useMaxWidthMediaQuery=q.useMaxWidthMediaQuery,exports.useMediaQuery=q.useMediaQuery,exports.useMinWidthMediaQuery=q.useMinWidthMediaQuery,exports.useResolvedBreakpointToken=q.useResolvedBreakpointToken;
 //# sourceMappingURL=index.js.map

package/cjs/theme/theme-provider/breakpoint.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../tokens/breakpoint.js"),i=require("../utils/css-variable.js");require("../../util/calendar-helper.js"),require("../../external/dayjs/dayjs.min.js"),require("react"),require("../../util/simple-id-generator.js"),require("../../util/string-helper.js"),require("@react-aria/live-announcer"),require("./context.js");const n="fds-breakpoint-";function r(r){const a=document.body,s=window.innerWidth;[...a.classList].forEach((e=>{e.startsWith(n)&&a.classList.remove(e)}));const t=function(n){const r=e=>{const r=i.parseCSSVariableValue(e,n);return r||(n!==document.documentElement?i.parseCSSVariableValue(e,document.documentElement):r)};return[{key:"xxs",min:r(e.Breakpoint["xxs-min"]),max:r(e.Breakpoint["xxs-max"])},{key:"xs",min:r(e.Breakpoint["xs-min"]),max:r(e.Breakpoint["xs-max"])},{key:"sm",min:r(e.Breakpoint["sm-min"]),max:r(e.Breakpoint["sm-max"])},{key:"md",min:r(e.Breakpoint["md-min"]),max:r(e.Breakpoint["md-max"])},{key:"lg",min:r(e.Breakpoint["lg-min"]),max:r(e.Breakpoint["lg-max"])},{key:"xl",min:r(e.Breakpoint["xl-min"]),max:r(e.Breakpoint["xl-max"])},{key:"xxl",min:r(e.Breakpoint["xxl-min"]),max:1/0}]}(r);t.forEach((e=>{const r=i.parsePxOrRemValue(e.min),t=e.max===1/0?1/0:i.parsePxOrRemValue(e.max),m=s>=r,o=t!==1/0&&s<=t;m&&(t===1/0||o)&&a.classList.add(`${n}${e.key}`),m&&a.classList.add(`${n}${e.key}-min`),o&&a.classList.add(`${n}${e.key}-max`)}))}exports.applyBreakpointClasses=r,exports.setupBreakpointListener=function(e){if(!globalThis.window)return;const i=()=>{r(e)};return i(),globalThis.window.addEventListener("resize",i),()=>{globalThis.window.removeEventListener("resize",i)}};
+"use strict";var e=require("../tokens/breakpoint.js"),i=require("../utils/css-variable.js");require("../../util/calendar-helper.js"),require("../../external/dayjs/dayjs.min.js"),require("react"),require("../../util/simple-id-generator.js"),require("../../util/string-helper.js"),require("@react-aria/live-announcer"),require("./context.js"),require("../utils/use-media-query.js");const r="fds-breakpoint-";function n(n){const a=document.body,s=window.innerWidth;[...a.classList].forEach((e=>{e.startsWith(r)&&a.classList.remove(e)}));const t=function(r){const n=e=>{const n=i.parseCSSVariableValue(e,r);return n||(r!==document.documentElement?i.parseCSSVariableValue(e,document.documentElement):n)};return[{key:"xxs",min:n(e.Breakpoint["xxs-min"]),max:n(e.Breakpoint["xxs-max"])},{key:"xs",min:n(e.Breakpoint["xs-min"]),max:n(e.Breakpoint["xs-max"])},{key:"sm",min:n(e.Breakpoint["sm-min"]),max:n(e.Breakpoint["sm-max"])},{key:"md",min:n(e.Breakpoint["md-min"]),max:n(e.Breakpoint["md-max"])},{key:"lg",min:n(e.Breakpoint["lg-min"]),max:n(e.Breakpoint["lg-max"])},{key:"xl",min:n(e.Breakpoint["xl-min"]),max:n(e.Breakpoint["xl-max"])},{key:"xxl",min:n(e.Breakpoint["xxl-min"]),max:1/0}]}(n);t.forEach((e=>{const n=i.parsePxOrRemValue(e.min),t=e.max===1/0?1/0:i.parsePxOrRemValue(e.max),m=s>=n,o=t!==1/0&&s<=t;m&&(t===1/0||o)&&a.classList.add(`${r}${e.key}`),m&&a.classList.add(`${r}${e.key}-min`),o&&a.classList.add(`${r}${e.key}-max`)}))}exports.applyBreakpointClasses=n,exports.setupBreakpointListener=function(e){if(!globalThis.window)return;const i=()=>{n(e)};return i(),globalThis.window.addEventListener("resize",i),()=>{globalThis.window.removeEventListener("resize",i)}};
 //# sourceMappingURL=breakpoint.js.map

package/cjs/theme/theme-provider/breakpoint.js.map

@@ -1 +1 @@
-{"version":3,"file":"breakpoint.js","sources":["../../../../src/theme/theme-provider/breakpoint.ts"],"sourcesContent":["import { Breakpoint } from \"../tokens/breakpoint\";\nimport type { CSSVariableString } from \"../types\";\nimport { parseCSSVariableValue, parsePxOrRemValue } from \"../utils\";\n\nfunction getBreakpointRanges(sourceElement: HTMLElement) {\n    const getBreakpointValue = (token: CSSVariableString) => {\n        const scopedValue = parseCSSVariableValue(token, sourceElement);\n        if (scopedValue) return scopedValue;\n\n        if (sourceElement !== document.documentElement) {\n            return parseCSSVariableValue(token, document.documentElement);\n        }\n\n        return scopedValue;\n    };\n\n    return [\n        {\n            key: \"xxs\",\n            min: getBreakpointValue(Breakpoint[\"xxs-min\"]),\n            max: getBreakpointValue(Breakpoint[\"xxs-max\"]),\n        },\n        {\n            key: \"xs\",\n            min: getBreakpointValue(Breakpoint[\"xs-min\"]),\n            max: getBreakpointValue(Breakpoint[\"xs-max\"]),\n        },\n        {\n            key: \"sm\",\n            min: getBreakpointValue(Breakpoint[\"sm-min\"]),\n            max: getBreakpointValue(Breakpoint[\"sm-max\"]),\n        },\n        {\n            key: \"md\",\n            min: getBreakpointValue(Breakpoint[\"md-min\"]),\n            max: getBreakpointValue(Breakpoint[\"md-max\"]),\n        },\n        {\n            key: \"lg\",\n            min: getBreakpointValue(Breakpoint[\"lg-min\"]),\n            max: getBreakpointValue(Breakpoint[\"lg-max\"]),\n        },\n        {\n            key: \"xl\",\n            min: getBreakpointValue(Breakpoint[\"xl-min\"]),\n            max: getBreakpointValue(Breakpoint[\"xl-max\"]),\n        },\n        {\n            key: \"xxl\",\n            min: getBreakpointValue(Breakpoint[\"xxl-min\"]),\n            max: Infinity,\n        },\n    ] as const;\n}\n\nconst BREAKPOINT_CLASS_PREFIX = \"fds-breakpoint-\";\n\nexport function applyBreakpointClasses(sourceElement: HTMLElement) {\n    const body = document.body;\n    const width = window.innerWidth;\n\n    [...body.classList].forEach((cls) => {\n        if (cls.startsWith(BREAKPOINT_CLASS_PREFIX)) {\n            body.classList.remove(cls);\n        }\n    });\n\n    const BREAKPOINT_RANGES = getBreakpointRanges(sourceElement);\n\n    BREAKPOINT_RANGES.forEach((range) => {\n        const minValue = parsePxOrRemValue(range.min);\n        const maxValue =\n            range.max === Infinity\n                ? Infinity\n                : parsePxOrRemValue(range.max as string);\n\n        const isMinMatched = width >= minValue;\n        const isMaxMatched = maxValue === Infinity ? false : width <= maxValue;\n        const isWithinRange =\n            isMinMatched && (maxValue === Infinity || isMaxMatched);\n\n        if (isWithinRange) {\n            body.classList.add(`${BREAKPOINT_CLASS_PREFIX}${range.key}`);\n        }\n\n        if (isMinMatched) {\n            body.classList.add(`${BREAKPOINT_CLASS_PREFIX}${range.key}-min`);\n        }\n\n        if (isMaxMatched) {\n            body.classList.add(`${BREAKPOINT_CLASS_PREFIX}${range.key}-max`);\n        }\n    });\n}\n\nexport function setupBreakpointListener(sourceElement: HTMLElement) {\n    if (!globalThis.window) return;\n\n    const handleBreakpointChange = () => {\n        applyBreakpointClasses(sourceElement);\n    };\n\n    handleBreakpointChange();\n    globalThis.window.addEventListener(\"resize\", handleBreakpointChange);\n\n    return () => {\n        globalThis.window.removeEventListener(\"resize\", handleBreakpointChange);\n    };\n}\n"],"names":["BREAKPOINT_CLASS_PREFIX","applyBreakpointClasses","sourceElement","body","document","width","window","innerWidth","classList","forEach","cls","startsWith","remove","BREAKPOINT_RANGES","getBreakpointValue","token","scopedValue","parseCSSVariableValue","documentElement","key","min","Breakpoint","max","Infinity","getBreakpointRanges","range","minValue","parsePxOrRemValue","maxValue","isMinMatched","isMaxMatched","add","globalThis","handleBreakpointChange","addEventListener","removeEventListener"],"mappings":"qVAuDA,MAAMA,EAA0B,kBAE1B,SAAUC,EAAuBC,GACnC,MAAMC,EAAOC,SAASD,KAChBE,EAAQC,OAAOC,WAErB,IAAIJ,EAAKK,WAAWC,SAASC,IACrBA,EAAIC,WAAWX,IACfG,EAAKK,UAAUI,OAAOF,EAC1B,IAGJ,MAAMG,EA/DV,SAA6BX,GACzB,MAAMY,EAAsBC,IACxB,MAAMC,EAAcC,EAAAA,sBAAsBF,EAAOb,GACjD,OAAIc,IAEAd,IAAkBE,SAASc,gBACpBD,wBAAsBF,EAAOX,SAASc,iBAG1CF,EAAW,EAGtB,MAAO,CACH,CACIG,IAAK,MACLC,IAAKN,EAAmBO,aAAW,YACnCC,IAAKR,EAAmBO,aAAW,aAEvC,CACIF,IAAK,KACLC,IAAKN,EAAmBO,aAAW,WACnCC,IAAKR,EAAmBO,aAAW,YAEvC,CACIF,IAAK,KACLC,IAAKN,EAAmBO,aAAW,WACnCC,IAAKR,EAAmBO,aAAW,YAEvC,CACIF,IAAK,KACLC,IAAKN,EAAmBO,aAAW,WACnCC,IAAKR,EAAmBO,aAAW,YAEvC,CACIF,IAAK,KACLC,IAAKN,EAAmBO,aAAW,WACnCC,IAAKR,EAAmBO,aAAW,YAEvC,CACIF,IAAK,KACLC,IAAKN,EAAmBO,aAAW,WACnCC,IAAKR,EAAmBO,aAAW,YAEvC,CACIF,IAAK,MACLC,IAAKN,EAAmBO,aAAW,YACnCC,IAAKC,KAGjB,CAc8BC,CAAoBtB,GAE9CW,EAAkBJ,SAASgB,IACvB,MAAMC,EAAWC,EAAAA,kBAAkBF,EAAML,KACnCQ,EACFH,EAAMH,MAAQC,IACRA,IACAI,EAAAA,kBAAkBF,EAAMH,KAE5BO,EAAexB,GAASqB,EACxBI,EAAeF,IAAaL,KAAmBlB,GAASuB,EAE1DC,IAAiBD,IAAaL,KAAYO,IAG1C3B,EAAKK,UAAUuB,IAAI,GAAG/B,IAA0ByB,EAAMN,OAGtDU,GACA1B,EAAKK,UAAUuB,IAAI,GAAG/B,IAA0ByB,EAAMN,WAGtDW,GACA3B,EAAKK,UAAUuB,IAAI,GAAG/B,IAA0ByB,EAAMN,UAC1D,GAER,kEAEM,SAAkCjB,GACpC,IAAK8B,WAAW1B,OAAQ,OAExB,MAAM2B,EAAyB,KAC3BhC,EAAuBC,EAAc,EAMzC,OAHA+B,IACAD,WAAW1B,OAAO4B,iBAAiB,SAAUD,GAEtC,KACHD,WAAW1B,OAAO6B,oBAAoB,SAAUF,EAAuB,CAE/E"}
+{"version":3,"file":"breakpoint.js","sources":["../../../../src/theme/theme-provider/breakpoint.ts"],"sourcesContent":["import { Breakpoint } from \"../tokens/breakpoint\";\nimport type { CSSVariableString } from \"../types\";\nimport { parseCSSVariableValue, parsePxOrRemValue } from \"../utils\";\n\nfunction getBreakpointRanges(sourceElement: HTMLElement) {\n    const getBreakpointValue = (token: CSSVariableString) => {\n        const scopedValue = parseCSSVariableValue(token, sourceElement);\n        if (scopedValue) return scopedValue;\n\n        if (sourceElement !== document.documentElement) {\n            return parseCSSVariableValue(token, document.documentElement);\n        }\n\n        return scopedValue;\n    };\n\n    return [\n        {\n            key: \"xxs\",\n            min: getBreakpointValue(Breakpoint[\"xxs-min\"]),\n            max: getBreakpointValue(Breakpoint[\"xxs-max\"]),\n        },\n        {\n            key: \"xs\",\n            min: getBreakpointValue(Breakpoint[\"xs-min\"]),\n            max: getBreakpointValue(Breakpoint[\"xs-max\"]),\n        },\n        {\n            key: \"sm\",\n            min: getBreakpointValue(Breakpoint[\"sm-min\"]),\n            max: getBreakpointValue(Breakpoint[\"sm-max\"]),\n        },\n        {\n            key: \"md\",\n            min: getBreakpointValue(Breakpoint[\"md-min\"]),\n            max: getBreakpointValue(Breakpoint[\"md-max\"]),\n        },\n        {\n            key: \"lg\",\n            min: getBreakpointValue(Breakpoint[\"lg-min\"]),\n            max: getBreakpointValue(Breakpoint[\"lg-max\"]),\n        },\n        {\n            key: \"xl\",\n            min: getBreakpointValue(Breakpoint[\"xl-min\"]),\n            max: getBreakpointValue(Breakpoint[\"xl-max\"]),\n        },\n        {\n            key: \"xxl\",\n            min: getBreakpointValue(Breakpoint[\"xxl-min\"]),\n            max: Infinity,\n        },\n    ] as const;\n}\n\nconst BREAKPOINT_CLASS_PREFIX = \"fds-breakpoint-\";\n\nexport function applyBreakpointClasses(sourceElement: HTMLElement) {\n    const body = document.body;\n    const width = window.innerWidth;\n\n    [...body.classList].forEach((cls) => {\n        if (cls.startsWith(BREAKPOINT_CLASS_PREFIX)) {\n            body.classList.remove(cls);\n        }\n    });\n\n    const BREAKPOINT_RANGES = getBreakpointRanges(sourceElement);\n\n    BREAKPOINT_RANGES.forEach((range) => {\n        const minValue = parsePxOrRemValue(range.min);\n        const maxValue =\n            range.max === Infinity\n                ? Infinity\n                : parsePxOrRemValue(range.max as string);\n\n        const isMinMatched = width >= minValue;\n        const isMaxMatched = maxValue === Infinity ? false : width <= maxValue;\n        const isWithinRange =\n            isMinMatched && (maxValue === Infinity || isMaxMatched);\n\n        if (isWithinRange) {\n            body.classList.add(`${BREAKPOINT_CLASS_PREFIX}${range.key}`);\n        }\n\n        if (isMinMatched) {\n            body.classList.add(`${BREAKPOINT_CLASS_PREFIX}${range.key}-min`);\n        }\n\n        if (isMaxMatched) {\n            body.classList.add(`${BREAKPOINT_CLASS_PREFIX}${range.key}-max`);\n        }\n    });\n}\n\nexport function setupBreakpointListener(sourceElement: HTMLElement) {\n    if (!globalThis.window) return;\n\n    const handleBreakpointChange = () => {\n        applyBreakpointClasses(sourceElement);\n    };\n\n    handleBreakpointChange();\n    globalThis.window.addEventListener(\"resize\", handleBreakpointChange);\n\n    return () => {\n        globalThis.window.removeEventListener(\"resize\", handleBreakpointChange);\n    };\n}\n"],"names":["BREAKPOINT_CLASS_PREFIX","applyBreakpointClasses","sourceElement","body","document","width","window","innerWidth","classList","forEach","cls","startsWith","remove","BREAKPOINT_RANGES","getBreakpointValue","token","scopedValue","parseCSSVariableValue","documentElement","key","min","Breakpoint","max","Infinity","getBreakpointRanges","range","minValue","parsePxOrRemValue","maxValue","isMinMatched","isMaxMatched","add","globalThis","handleBreakpointChange","addEventListener","removeEventListener"],"mappings":"4XAuDA,MAAMA,EAA0B,kBAE1B,SAAUC,EAAuBC,GACnC,MAAMC,EAAOC,SAASD,KAChBE,EAAQC,OAAOC,WAErB,IAAIJ,EAAKK,WAAWC,SAASC,IACrBA,EAAIC,WAAWX,IACfG,EAAKK,UAAUI,OAAOF,EAC1B,IAGJ,MAAMG,EA/DV,SAA6BX,GACzB,MAAMY,EAAsBC,IACxB,MAAMC,EAAcC,EAAAA,sBAAsBF,EAAOb,GACjD,OAAIc,IAEAd,IAAkBE,SAASc,gBACpBD,wBAAsBF,EAAOX,SAASc,iBAG1CF,EAAW,EAGtB,MAAO,CACH,CACIG,IAAK,MACLC,IAAKN,EAAmBO,aAAW,YACnCC,IAAKR,EAAmBO,aAAW,aAEvC,CACIF,IAAK,KACLC,IAAKN,EAAmBO,aAAW,WACnCC,IAAKR,EAAmBO,aAAW,YAEvC,CACIF,IAAK,KACLC,IAAKN,EAAmBO,aAAW,WACnCC,IAAKR,EAAmBO,aAAW,YAEvC,CACIF,IAAK,KACLC,IAAKN,EAAmBO,aAAW,WACnCC,IAAKR,EAAmBO,aAAW,YAEvC,CACIF,IAAK,KACLC,IAAKN,EAAmBO,aAAW,WACnCC,IAAKR,EAAmBO,aAAW,YAEvC,CACIF,IAAK,KACLC,IAAKN,EAAmBO,aAAW,WACnCC,IAAKR,EAAmBO,aAAW,YAEvC,CACIF,IAAK,MACLC,IAAKN,EAAmBO,aAAW,YACnCC,IAAKC,KAGjB,CAc8BC,CAAoBtB,GAE9CW,EAAkBJ,SAASgB,IACvB,MAAMC,EAAWC,EAAAA,kBAAkBF,EAAML,KACnCQ,EACFH,EAAMH,MAAQC,IACRA,IACAI,EAAAA,kBAAkBF,EAAMH,KAE5BO,EAAexB,GAASqB,EACxBI,EAAeF,IAAaL,KAAmBlB,GAASuB,EAE1DC,IAAiBD,IAAaL,KAAYO,IAG1C3B,EAAKK,UAAUuB,IAAI,GAAG/B,IAA0ByB,EAAMN,OAGtDU,GACA1B,EAAKK,UAAUuB,IAAI,GAAG/B,IAA0ByB,EAAMN,WAGtDW,GACA3B,EAAKK,UAAUuB,IAAI,GAAG/B,IAA0ByB,EAAMN,UAC1D,GAER,kEAEM,SAAkCjB,GACpC,IAAK8B,WAAW1B,OAAQ,OAExB,MAAM2B,EAAyB,KAC3BhC,EAAuBC,EAAc,EAMzC,OAHA+B,IACAD,WAAW1B,OAAO4B,iBAAiB,SAAUD,GAEtC,KACHD,WAAW1B,OAAO6B,oBAAoB,SAAUF,EAAuB,CAE/E"}

package/cjs/theme/tokens/font.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../utils/font.js");require("../../util/calendar-helper.js"),require("../../external/dayjs/dayjs.min.js"),require("react"),require("../../util/simple-id-generator.js"),require("../../util/string-helper.js"),require("@react-aria/live-announcer"),require("../theme-provider/context.js");const d={"font-family":"var(--fds-font-family)","font-variant":"var(--fds-font-variant)","weight-light":"var(--fds-font-weight-light)","weight-regular":"var(--fds-font-weight-regular)","weight-semibold":"var(--fds-font-weight-semibold)","weight-bold":"var(--fds-font-weight-bold)","heading-size-xxl":"var(--fds-font-heading-size-xxl)","heading-size-xl":"var(--fds-font-heading-size-xl)","heading-size-lg":"var(--fds-font-heading-size-lg)","heading-size-md":"var(--fds-font-heading-size-md)","heading-size-sm":"var(--fds-font-heading-size-sm)","heading-size-xs":"var(--fds-font-heading-size-xs)","heading-lh-xxl":"var(--fds-font-heading-lh-xxl)","heading-lh-xl":"var(--fds-font-heading-lh-xl)","heading-lh-lg":"var(--fds-font-heading-lh-lg)","heading-lh-md":"var(--fds-font-heading-lh-md)","heading-lh-sm":"var(--fds-font-heading-lh-sm)","heading-lh-xs":"var(--fds-font-heading-lh-xs)","heading-ls-xxl":"var(--fds-font-heading-ls-xxl)","heading-ls-xl":"var(--fds-font-heading-ls-xl)","heading-ls-lg":"var(--fds-font-heading-ls-lg)","heading-ls-md":"var(--fds-font-heading-ls-md)","heading-ls-sm":"var(--fds-font-heading-ls-sm)","heading-ls-xs":"var(--fds-font-heading-ls-xs)","body-size-baseline":"var(--fds-font-body-size-baseline)","body-size-md":"var(--fds-font-body-size-md)","body-size-sm":"var(--fds-font-body-size-sm)","body-size-xs":"var(--fds-font-body-size-xs)","body-lh-baseline":"var(--fds-font-body-lh-baseline)","body-lh-md":"var(--fds-font-body-lh-md)","body-lh-sm":"var(--fds-font-body-lh-sm)","body-lh-xs":"var(--fds-font-body-lh-xs)","body-ls-baseline":"var(--fds-font-body-ls-baseline)","body-ls-md":"var(--fds-font-body-ls-md)","body-ls-sm":"var(--fds-font-body-ls-sm)","body-ls-xs":"var(--fds-font-body-ls-xs)","form-label-size":"var(--fds-font-form-label-size)","form-label-lh":"var(--fds-font-form-label-lh)","form-label-ls":"var(--fds-font-form-label-ls)","form-description-size":"var(--fds-font-form-description-size)","form-description-lh":"var(--fds-font-form-description-lh)","form-description-ls":"var(--fds-font-form-description-ls)"},n={"heading-xxl-light":e.generateFont("heading-xxl","light"),"heading-xxl-regular":e.generateFont("heading-xxl","regular"),"heading-xxl-semibold":e.generateFont("heading-xxl","semibold"),"heading-xxl-bold":e.generateFont("heading-xxl","bold"),"heading-xl-light":e.generateFont("heading-xl","light"),"heading-xl-regular":e.generateFont("heading-xl","regular"),"heading-xl-semibold":e.generateFont("heading-xl","semibold"),"heading-xl-bold":e.generateFont("heading-xl","bold"),"heading-lg-light":e.generateFont("heading-lg","light"),"heading-lg-regular":e.generateFont("heading-lg","regular"),"heading-lg-semibold":e.generateFont("heading-lg","semibold"),"heading-lg-bold":e.generateFont("heading-lg","bold"),"heading-md-light":e.generateFont("heading-md","light"),"heading-md-regular":e.generateFont("heading-md","regular"),"heading-md-semibold":e.generateFont("heading-md","semibold"),"heading-md-bold":e.generateFont("heading-md","bold"),"heading-sm-light":e.generateFont("heading-sm","light"),"heading-sm-regular":e.generateFont("heading-sm","regular"),"heading-sm-semibold":e.generateFont("heading-sm","semibold"),"heading-sm-bold":e.generateFont("heading-sm","bold"),"heading-xs-light":e.generateFont("heading-xs","light"),"heading-xs-regular":e.generateFont("heading-xs","regular"),"heading-xs-semibold":e.generateFont("heading-xs","semibold"),"heading-xs-bold":e.generateFont("heading-xs","bold"),"body-baseline-light":e.generateFont("body-baseline","light"),"body-baseline-regular":e.generateFont("body-baseline","regular"),"body-baseline-semibold":e.generateFont("body-baseline","semibold"),"body-baseline-bold":e.generateFont("body-baseline","bold"),"body-md-light":e.generateFont("body-md","light"),"body-md-regular":e.generateFont("body-md","regular"),"body-md-semibold":e.generateFont("body-md","semibold"),"body-md-bold":e.generateFont("body-md","bold"),"body-sm-light":e.generateFont("body-sm","light"),"body-sm-regular":e.generateFont("body-sm","regular"),"body-sm-semibold":e.generateFont("body-sm","semibold"),"body-sm-bold":e.generateFont("body-sm","bold"),"body-xs-light":e.generateFont("body-xs","light"),"body-xs-regular":e.generateFont("body-xs","regular"),"body-xs-semibold":e.generateFont("body-xs","semibold"),"body-xs-bold":e.generateFont("body-xs","bold"),"form-label":e.generateFont("form-label","semibold"),"form-description":e.generateFont("form-description","regular"),Spec:d};exports.Font=n,exports.FontSpec=d;
+"use strict";var e=require("../utils/font.js");const d={"font-family":"var(--fds-font-family)","font-variant":"var(--fds-font-variant)","weight-light":"var(--fds-font-weight-light)","weight-regular":"var(--fds-font-weight-regular)","weight-semibold":"var(--fds-font-weight-semibold)","weight-bold":"var(--fds-font-weight-bold)","heading-size-xxl":"var(--fds-font-heading-size-xxl)","heading-size-xl":"var(--fds-font-heading-size-xl)","heading-size-lg":"var(--fds-font-heading-size-lg)","heading-size-md":"var(--fds-font-heading-size-md)","heading-size-sm":"var(--fds-font-heading-size-sm)","heading-size-xs":"var(--fds-font-heading-size-xs)","heading-lh-xxl":"var(--fds-font-heading-lh-xxl)","heading-lh-xl":"var(--fds-font-heading-lh-xl)","heading-lh-lg":"var(--fds-font-heading-lh-lg)","heading-lh-md":"var(--fds-font-heading-lh-md)","heading-lh-sm":"var(--fds-font-heading-lh-sm)","heading-lh-xs":"var(--fds-font-heading-lh-xs)","heading-ls-xxl":"var(--fds-font-heading-ls-xxl)","heading-ls-xl":"var(--fds-font-heading-ls-xl)","heading-ls-lg":"var(--fds-font-heading-ls-lg)","heading-ls-md":"var(--fds-font-heading-ls-md)","heading-ls-sm":"var(--fds-font-heading-ls-sm)","heading-ls-xs":"var(--fds-font-heading-ls-xs)","body-size-baseline":"var(--fds-font-body-size-baseline)","body-size-md":"var(--fds-font-body-size-md)","body-size-sm":"var(--fds-font-body-size-sm)","body-size-xs":"var(--fds-font-body-size-xs)","body-lh-baseline":"var(--fds-font-body-lh-baseline)","body-lh-md":"var(--fds-font-body-lh-md)","body-lh-sm":"var(--fds-font-body-lh-sm)","body-lh-xs":"var(--fds-font-body-lh-xs)","body-ls-baseline":"var(--fds-font-body-ls-baseline)","body-ls-md":"var(--fds-font-body-ls-md)","body-ls-sm":"var(--fds-font-body-ls-sm)","body-ls-xs":"var(--fds-font-body-ls-xs)","form-label-size":"var(--fds-font-form-label-size)","form-label-lh":"var(--fds-font-form-label-lh)","form-label-ls":"var(--fds-font-form-label-ls)","form-description-size":"var(--fds-font-form-description-size)","form-description-lh":"var(--fds-font-form-description-lh)","form-description-ls":"var(--fds-font-form-description-ls)"},n={"heading-xxl-light":e.generateFont("heading-xxl","light"),"heading-xxl-regular":e.generateFont("heading-xxl","regular"),"heading-xxl-semibold":e.generateFont("heading-xxl","semibold"),"heading-xxl-bold":e.generateFont("heading-xxl","bold"),"heading-xl-light":e.generateFont("heading-xl","light"),"heading-xl-regular":e.generateFont("heading-xl","regular"),"heading-xl-semibold":e.generateFont("heading-xl","semibold"),"heading-xl-bold":e.generateFont("heading-xl","bold"),"heading-lg-light":e.generateFont("heading-lg","light"),"heading-lg-regular":e.generateFont("heading-lg","regular"),"heading-lg-semibold":e.generateFont("heading-lg","semibold"),"heading-lg-bold":e.generateFont("heading-lg","bold"),"heading-md-light":e.generateFont("heading-md","light"),"heading-md-regular":e.generateFont("heading-md","regular"),"heading-md-semibold":e.generateFont("heading-md","semibold"),"heading-md-bold":e.generateFont("heading-md","bold"),"heading-sm-light":e.generateFont("heading-sm","light"),"heading-sm-regular":e.generateFont("heading-sm","regular"),"heading-sm-semibold":e.generateFont("heading-sm","semibold"),"heading-sm-bold":e.generateFont("heading-sm","bold"),"heading-xs-light":e.generateFont("heading-xs","light"),"heading-xs-regular":e.generateFont("heading-xs","regular"),"heading-xs-semibold":e.generateFont("heading-xs","semibold"),"heading-xs-bold":e.generateFont("heading-xs","bold"),"body-baseline-light":e.generateFont("body-baseline","light"),"body-baseline-regular":e.generateFont("body-baseline","regular"),"body-baseline-semibold":e.generateFont("body-baseline","semibold"),"body-baseline-bold":e.generateFont("body-baseline","bold"),"body-md-light":e.generateFont("body-md","light"),"body-md-regular":e.generateFont("body-md","regular"),"body-md-semibold":e.generateFont("body-md","semibold"),"body-md-bold":e.generateFont("body-md","bold"),"body-sm-light":e.generateFont("body-sm","light"),"body-sm-regular":e.generateFont("body-sm","regular"),"body-sm-semibold":e.generateFont("body-sm","semibold"),"body-sm-bold":e.generateFont("body-sm","bold"),"body-xs-light":e.generateFont("body-xs","light"),"body-xs-regular":e.generateFont("body-xs","regular"),"body-xs-semibold":e.generateFont("body-xs","semibold"),"body-xs-bold":e.generateFont("body-xs","bold"),"form-label":e.generateFont("form-label","semibold"),"form-description":e.generateFont("form-description","regular"),Spec:d};exports.Font=n,exports.FontSpec=d;
 //# sourceMappingURL=font.js.map

package/cjs/theme/tokens/font.js.map

@@ -1 +1 @@
-{"version":3,"file":"font.js","sources":["../../../../src/theme/tokens/font.ts"],"sourcesContent":["import { generateFont } from \"../utils\";\n\nexport const FontSpec = {\n    \"font-family\": \"var(--fds-font-family)\",\n    \"font-variant\": \"var(--fds-font-variant)\",\n\n    \"weight-light\": \"var(--fds-font-weight-light)\",\n    \"weight-regular\": \"var(--fds-font-weight-regular)\",\n    \"weight-semibold\": \"var(--fds-font-weight-semibold)\",\n    \"weight-bold\": \"var(--fds-font-weight-bold)\",\n\n    \"heading-size-xxl\": \"var(--fds-font-heading-size-xxl)\",\n    \"heading-size-xl\": \"var(--fds-font-heading-size-xl)\",\n    \"heading-size-lg\": \"var(--fds-font-heading-size-lg)\",\n    \"heading-size-md\": \"var(--fds-font-heading-size-md)\",\n    \"heading-size-sm\": \"var(--fds-font-heading-size-sm)\",\n    \"heading-size-xs\": \"var(--fds-font-heading-size-xs)\",\n\n    \"heading-lh-xxl\": \"var(--fds-font-heading-lh-xxl)\",\n    \"heading-lh-xl\": \"var(--fds-font-heading-lh-xl)\",\n    \"heading-lh-lg\": \"var(--fds-font-heading-lh-lg)\",\n    \"heading-lh-md\": \"var(--fds-font-heading-lh-md)\",\n    \"heading-lh-sm\": \"var(--fds-font-heading-lh-sm)\",\n    \"heading-lh-xs\": \"var(--fds-font-heading-lh-xs)\",\n\n    \"heading-ls-xxl\": \"var(--fds-font-heading-ls-xxl)\",\n    \"heading-ls-xl\": \"var(--fds-font-heading-ls-xl)\",\n    \"heading-ls-lg\": \"var(--fds-font-heading-ls-lg)\",\n    \"heading-ls-md\": \"var(--fds-font-heading-ls-md)\",\n    \"heading-ls-sm\": \"var(--fds-font-heading-ls-sm)\",\n    \"heading-ls-xs\": \"var(--fds-font-heading-ls-xs)\",\n\n    \"body-size-baseline\": \"var(--fds-font-body-size-baseline)\",\n    \"body-size-md\": \"var(--fds-font-body-size-md)\",\n    \"body-size-sm\": \"var(--fds-font-body-size-sm)\",\n    \"body-size-xs\": \"var(--fds-font-body-size-xs)\",\n\n    \"body-lh-baseline\": \"var(--fds-font-body-lh-baseline)\",\n    \"body-lh-md\": \"var(--fds-font-body-lh-md)\",\n    \"body-lh-sm\": \"var(--fds-font-body-lh-sm)\",\n    \"body-lh-xs\": \"var(--fds-font-body-lh-xs)\",\n\n    \"body-ls-baseline\": \"var(--fds-font-body-ls-baseline)\",\n    \"body-ls-md\": \"var(--fds-font-body-ls-md)\",\n    \"body-ls-sm\": \"var(--fds-font-body-ls-sm)\",\n    \"body-ls-xs\": \"var(--fds-font-body-ls-xs)\",\n\n    \"form-label-size\": \"var(--fds-font-form-label-size)\",\n    \"form-label-lh\": \"var(--fds-font-form-label-lh)\",\n    \"form-label-ls\": \"var(--fds-font-form-label-ls)\",\n\n    \"form-description-size\": \"var(--fds-font-form-description-size)\",\n    \"form-description-lh\": \"var(--fds-font-form-description-lh)\",\n    \"form-description-ls\": \"var(--fds-font-form-description-ls)\",\n} as const;\n\nexport const Font = {\n    \"heading-xxl-light\": generateFont(\"heading-xxl\", \"light\"),\n    \"heading-xxl-regular\": generateFont(\"heading-xxl\", \"regular\"),\n    \"heading-xxl-semibold\": generateFont(\"heading-xxl\", \"semibold\"),\n    \"heading-xxl-bold\": generateFont(\"heading-xxl\", \"bold\"),\n\n    \"heading-xl-light\": generateFont(\"heading-xl\", \"light\"),\n    \"heading-xl-regular\": generateFont(\"heading-xl\", \"regular\"),\n    \"heading-xl-semibold\": generateFont(\"heading-xl\", \"semibold\"),\n    \"heading-xl-bold\": generateFont(\"heading-xl\", \"bold\"),\n\n    \"heading-lg-light\": generateFont(\"heading-lg\", \"light\"),\n    \"heading-lg-regular\": generateFont(\"heading-lg\", \"regular\"),\n    \"heading-lg-semibold\": generateFont(\"heading-lg\", \"semibold\"),\n    \"heading-lg-bold\": generateFont(\"heading-lg\", \"bold\"),\n\n    \"heading-md-light\": generateFont(\"heading-md\", \"light\"),\n    \"heading-md-regular\": generateFont(\"heading-md\", \"regular\"),\n    \"heading-md-semibold\": generateFont(\"heading-md\", \"semibold\"),\n    \"heading-md-bold\": generateFont(\"heading-md\", \"bold\"),\n\n    \"heading-sm-light\": generateFont(\"heading-sm\", \"light\"),\n    \"heading-sm-regular\": generateFont(\"heading-sm\", \"regular\"),\n    \"heading-sm-semibold\": generateFont(\"heading-sm\", \"semibold\"),\n    \"heading-sm-bold\": generateFont(\"heading-sm\", \"bold\"),\n\n    \"heading-xs-light\": generateFont(\"heading-xs\", \"light\"),\n    \"heading-xs-regular\": generateFont(\"heading-xs\", \"regular\"),\n    \"heading-xs-semibold\": generateFont(\"heading-xs\", \"semibold\"),\n    \"heading-xs-bold\": generateFont(\"heading-xs\", \"bold\"),\n\n    \"body-baseline-light\": generateFont(\"body-baseline\", \"light\"),\n    \"body-baseline-regular\": generateFont(\"body-baseline\", \"regular\"),\n    \"body-baseline-semibold\": generateFont(\"body-baseline\", \"semibold\"),\n    \"body-baseline-bold\": generateFont(\"body-baseline\", \"bold\"),\n\n    \"body-md-light\": generateFont(\"body-md\", \"light\"),\n    \"body-md-regular\": generateFont(\"body-md\", \"regular\"),\n    \"body-md-semibold\": generateFont(\"body-md\", \"semibold\"),\n    \"body-md-bold\": generateFont(\"body-md\", \"bold\"),\n\n    \"body-sm-light\": generateFont(\"body-sm\", \"light\"),\n    \"body-sm-regular\": generateFont(\"body-sm\", \"regular\"),\n    \"body-sm-semibold\": generateFont(\"body-sm\", \"semibold\"),\n    \"body-sm-bold\": generateFont(\"body-sm\", \"bold\"),\n\n    \"body-xs-light\": generateFont(\"body-xs\", \"light\"),\n    \"body-xs-regular\": generateFont(\"body-xs\", \"regular\"),\n    \"body-xs-semibold\": generateFont(\"body-xs\", \"semibold\"),\n    \"body-xs-bold\": generateFont(\"body-xs\", \"bold\"),\n\n    \"form-label\": generateFont(\"form-label\", \"semibold\"),\n    \"form-description\": generateFont(\"form-description\", \"regular\"),\n\n    Spec: FontSpec,\n} as const;\n"],"names":["FontSpec","Font","generateFont","Spec"],"mappings":"wTAEO,MAAMA,EAAW,CACpB,cAAe,yBACf,eAAgB,0BAEhB,eAAgB,+BAChB,iBAAkB,iCAClB,kBAAmB,kCACnB,cAAe,8BAEf,mBAAoB,mCACpB,kBAAmB,kCACnB,kBAAmB,kCACnB,kBAAmB,kCACnB,kBAAmB,kCACnB,kBAAmB,kCAEnB,iBAAkB,iCAClB,gBAAiB,gCACjB,gBAAiB,gCACjB,gBAAiB,gCACjB,gBAAiB,gCACjB,gBAAiB,gCAEjB,iBAAkB,iCAClB,gBAAiB,gCACjB,gBAAiB,gCACjB,gBAAiB,gCACjB,gBAAiB,gCACjB,gBAAiB,gCAEjB,qBAAsB,qCACtB,eAAgB,+BAChB,eAAgB,+BAChB,eAAgB,+BAEhB,mBAAoB,mCACpB,aAAc,6BACd,aAAc,6BACd,aAAc,6BAEd,mBAAoB,mCACpB,aAAc,6BACd,aAAc,6BACd,aAAc,6BAEd,kBAAmB,kCACnB,gBAAiB,gCACjB,gBAAiB,gCAEjB,wBAAyB,wCACzB,sBAAuB,sCACvB,sBAAuB,uCAGdC,EAAO,CAChB,oBAAqBC,EAAAA,aAAa,cAAe,SACjD,sBAAuBA,EAAAA,aAAa,cAAe,WACnD,uBAAwBA,EAAAA,aAAa,cAAe,YACpD,mBAAoBA,EAAAA,aAAa,cAAe,QAEhD,mBAAoBA,EAAAA,aAAa,aAAc,SAC/C,qBAAsBA,EAAAA,aAAa,aAAc,WACjD,sBAAuBA,EAAAA,aAAa,aAAc,YAClD,kBAAmBA,EAAAA,aAAa,aAAc,QAE9C,mBAAoBA,EAAAA,aAAa,aAAc,SAC/C,qBAAsBA,EAAAA,aAAa,aAAc,WACjD,sBAAuBA,EAAAA,aAAa,aAAc,YAClD,kBAAmBA,EAAAA,aAAa,aAAc,QAE9C,mBAAoBA,EAAAA,aAAa,aAAc,SAC/C,qBAAsBA,EAAAA,aAAa,aAAc,WACjD,sBAAuBA,EAAAA,aAAa,aAAc,YAClD,kBAAmBA,EAAAA,aAAa,aAAc,QAE9C,mBAAoBA,EAAAA,aAAa,aAAc,SAC/C,qBAAsBA,EAAAA,aAAa,aAAc,WACjD,sBAAuBA,EAAAA,aAAa,aAAc,YAClD,kBAAmBA,EAAAA,aAAa,aAAc,QAE9C,mBAAoBA,EAAAA,aAAa,aAAc,SAC/C,qBAAsBA,EAAAA,aAAa,aAAc,WACjD,sBAAuBA,EAAAA,aAAa,aAAc,YAClD,kBAAmBA,EAAAA,aAAa,aAAc,QAE9C,sBAAuBA,EAAAA,aAAa,gBAAiB,SACrD,wBAAyBA,EAAAA,aAAa,gBAAiB,WACvD,yBAA0BA,EAAAA,aAAa,gBAAiB,YACxD,qBAAsBA,EAAAA,aAAa,gBAAiB,QAEpD,gBAAiBA,EAAAA,aAAa,UAAW,SACzC,kBAAmBA,EAAAA,aAAa,UAAW,WAC3C,mBAAoBA,EAAAA,aAAa,UAAW,YAC5C,eAAgBA,EAAAA,aAAa,UAAW,QAExC,gBAAiBA,EAAAA,aAAa,UAAW,SACzC,kBAAmBA,EAAAA,aAAa,UAAW,WAC3C,mBAAoBA,EAAAA,aAAa,UAAW,YAC5C,eAAgBA,EAAAA,aAAa,UAAW,QAExC,gBAAiBA,EAAAA,aAAa,UAAW,SACzC,kBAAmBA,EAAAA,aAAa,UAAW,WAC3C,mBAAoBA,EAAAA,aAAa,UAAW,YAC5C,eAAgBA,EAAAA,aAAa,UAAW,QAExC,aAAcA,EAAAA,aAAa,aAAc,YACzC,mBAAoBA,EAAAA,aAAa,mBAAoB,WAErDC,KAAMH"}
+{"version":3,"file":"font.js","sources":["../../../../src/theme/tokens/font.ts"],"sourcesContent":["import { generateFont } from \"../utils/font\";\n\nexport const FontSpec = {\n    \"font-family\": \"var(--fds-font-family)\",\n    \"font-variant\": \"var(--fds-font-variant)\",\n\n    \"weight-light\": \"var(--fds-font-weight-light)\",\n    \"weight-regular\": \"var(--fds-font-weight-regular)\",\n    \"weight-semibold\": \"var(--fds-font-weight-semibold)\",\n    \"weight-bold\": \"var(--fds-font-weight-bold)\",\n\n    \"heading-size-xxl\": \"var(--fds-font-heading-size-xxl)\",\n    \"heading-size-xl\": \"var(--fds-font-heading-size-xl)\",\n    \"heading-size-lg\": \"var(--fds-font-heading-size-lg)\",\n    \"heading-size-md\": \"var(--fds-font-heading-size-md)\",\n    \"heading-size-sm\": \"var(--fds-font-heading-size-sm)\",\n    \"heading-size-xs\": \"var(--fds-font-heading-size-xs)\",\n\n    \"heading-lh-xxl\": \"var(--fds-font-heading-lh-xxl)\",\n    \"heading-lh-xl\": \"var(--fds-font-heading-lh-xl)\",\n    \"heading-lh-lg\": \"var(--fds-font-heading-lh-lg)\",\n    \"heading-lh-md\": \"var(--fds-font-heading-lh-md)\",\n    \"heading-lh-sm\": \"var(--fds-font-heading-lh-sm)\",\n    \"heading-lh-xs\": \"var(--fds-font-heading-lh-xs)\",\n\n    \"heading-ls-xxl\": \"var(--fds-font-heading-ls-xxl)\",\n    \"heading-ls-xl\": \"var(--fds-font-heading-ls-xl)\",\n    \"heading-ls-lg\": \"var(--fds-font-heading-ls-lg)\",\n    \"heading-ls-md\": \"var(--fds-font-heading-ls-md)\",\n    \"heading-ls-sm\": \"var(--fds-font-heading-ls-sm)\",\n    \"heading-ls-xs\": \"var(--fds-font-heading-ls-xs)\",\n\n    \"body-size-baseline\": \"var(--fds-font-body-size-baseline)\",\n    \"body-size-md\": \"var(--fds-font-body-size-md)\",\n    \"body-size-sm\": \"var(--fds-font-body-size-sm)\",\n    \"body-size-xs\": \"var(--fds-font-body-size-xs)\",\n\n    \"body-lh-baseline\": \"var(--fds-font-body-lh-baseline)\",\n    \"body-lh-md\": \"var(--fds-font-body-lh-md)\",\n    \"body-lh-sm\": \"var(--fds-font-body-lh-sm)\",\n    \"body-lh-xs\": \"var(--fds-font-body-lh-xs)\",\n\n    \"body-ls-baseline\": \"var(--fds-font-body-ls-baseline)\",\n    \"body-ls-md\": \"var(--fds-font-body-ls-md)\",\n    \"body-ls-sm\": \"var(--fds-font-body-ls-sm)\",\n    \"body-ls-xs\": \"var(--fds-font-body-ls-xs)\",\n\n    \"form-label-size\": \"var(--fds-font-form-label-size)\",\n    \"form-label-lh\": \"var(--fds-font-form-label-lh)\",\n    \"form-label-ls\": \"var(--fds-font-form-label-ls)\",\n\n    \"form-description-size\": \"var(--fds-font-form-description-size)\",\n    \"form-description-lh\": \"var(--fds-font-form-description-lh)\",\n    \"form-description-ls\": \"var(--fds-font-form-description-ls)\",\n} as const;\n\nexport const Font = {\n    \"heading-xxl-light\": generateFont(\"heading-xxl\", \"light\"),\n    \"heading-xxl-regular\": generateFont(\"heading-xxl\", \"regular\"),\n    \"heading-xxl-semibold\": generateFont(\"heading-xxl\", \"semibold\"),\n    \"heading-xxl-bold\": generateFont(\"heading-xxl\", \"bold\"),\n\n    \"heading-xl-light\": generateFont(\"heading-xl\", \"light\"),\n    \"heading-xl-regular\": generateFont(\"heading-xl\", \"regular\"),\n    \"heading-xl-semibold\": generateFont(\"heading-xl\", \"semibold\"),\n    \"heading-xl-bold\": generateFont(\"heading-xl\", \"bold\"),\n\n    \"heading-lg-light\": generateFont(\"heading-lg\", \"light\"),\n    \"heading-lg-regular\": generateFont(\"heading-lg\", \"regular\"),\n    \"heading-lg-semibold\": generateFont(\"heading-lg\", \"semibold\"),\n    \"heading-lg-bold\": generateFont(\"heading-lg\", \"bold\"),\n\n    \"heading-md-light\": generateFont(\"heading-md\", \"light\"),\n    \"heading-md-regular\": generateFont(\"heading-md\", \"regular\"),\n    \"heading-md-semibold\": generateFont(\"heading-md\", \"semibold\"),\n    \"heading-md-bold\": generateFont(\"heading-md\", \"bold\"),\n\n    \"heading-sm-light\": generateFont(\"heading-sm\", \"light\"),\n    \"heading-sm-regular\": generateFont(\"heading-sm\", \"regular\"),\n    \"heading-sm-semibold\": generateFont(\"heading-sm\", \"semibold\"),\n    \"heading-sm-bold\": generateFont(\"heading-sm\", \"bold\"),\n\n    \"heading-xs-light\": generateFont(\"heading-xs\", \"light\"),\n    \"heading-xs-regular\": generateFont(\"heading-xs\", \"regular\"),\n    \"heading-xs-semibold\": generateFont(\"heading-xs\", \"semibold\"),\n    \"heading-xs-bold\": generateFont(\"heading-xs\", \"bold\"),\n\n    \"body-baseline-light\": generateFont(\"body-baseline\", \"light\"),\n    \"body-baseline-regular\": generateFont(\"body-baseline\", \"regular\"),\n    \"body-baseline-semibold\": generateFont(\"body-baseline\", \"semibold\"),\n    \"body-baseline-bold\": generateFont(\"body-baseline\", \"bold\"),\n\n    \"body-md-light\": generateFont(\"body-md\", \"light\"),\n    \"body-md-regular\": generateFont(\"body-md\", \"regular\"),\n    \"body-md-semibold\": generateFont(\"body-md\", \"semibold\"),\n    \"body-md-bold\": generateFont(\"body-md\", \"bold\"),\n\n    \"body-sm-light\": generateFont(\"body-sm\", \"light\"),\n    \"body-sm-regular\": generateFont(\"body-sm\", \"regular\"),\n    \"body-sm-semibold\": generateFont(\"body-sm\", \"semibold\"),\n    \"body-sm-bold\": generateFont(\"body-sm\", \"bold\"),\n\n    \"body-xs-light\": generateFont(\"body-xs\", \"light\"),\n    \"body-xs-regular\": generateFont(\"body-xs\", \"regular\"),\n    \"body-xs-semibold\": generateFont(\"body-xs\", \"semibold\"),\n    \"body-xs-bold\": generateFont(\"body-xs\", \"bold\"),\n\n    \"form-label\": generateFont(\"form-label\", \"semibold\"),\n    \"form-description\": generateFont(\"form-description\", \"regular\"),\n\n    Spec: FontSpec,\n} as const;\n"],"names":["FontSpec","Font","generateFont","Spec"],"mappings":"+CAEO,MAAMA,EAAW,CACpB,cAAe,yBACf,eAAgB,0BAEhB,eAAgB,+BAChB,iBAAkB,iCAClB,kBAAmB,kCACnB,cAAe,8BAEf,mBAAoB,mCACpB,kBAAmB,kCACnB,kBAAmB,kCACnB,kBAAmB,kCACnB,kBAAmB,kCACnB,kBAAmB,kCAEnB,iBAAkB,iCAClB,gBAAiB,gCACjB,gBAAiB,gCACjB,gBAAiB,gCACjB,gBAAiB,gCACjB,gBAAiB,gCAEjB,iBAAkB,iCAClB,gBAAiB,gCACjB,gBAAiB,gCACjB,gBAAiB,gCACjB,gBAAiB,gCACjB,gBAAiB,gCAEjB,qBAAsB,qCACtB,eAAgB,+BAChB,eAAgB,+BAChB,eAAgB,+BAEhB,mBAAoB,mCACpB,aAAc,6BACd,aAAc,6BACd,aAAc,6BAEd,mBAAoB,mCACpB,aAAc,6BACd,aAAc,6BACd,aAAc,6BAEd,kBAAmB,kCACnB,gBAAiB,gCACjB,gBAAiB,gCAEjB,wBAAyB,wCACzB,sBAAuB,sCACvB,sBAAuB,uCAGdC,EAAO,CAChB,oBAAqBC,EAAAA,aAAa,cAAe,SACjD,sBAAuBA,EAAAA,aAAa,cAAe,WACnD,uBAAwBA,EAAAA,aAAa,cAAe,YACpD,mBAAoBA,EAAAA,aAAa,cAAe,QAEhD,mBAAoBA,EAAAA,aAAa,aAAc,SAC/C,qBAAsBA,EAAAA,aAAa,aAAc,WACjD,sBAAuBA,EAAAA,aAAa,aAAc,YAClD,kBAAmBA,EAAAA,aAAa,aAAc,QAE9C,mBAAoBA,EAAAA,aAAa,aAAc,SAC/C,qBAAsBA,EAAAA,aAAa,aAAc,WACjD,sBAAuBA,EAAAA,aAAa,aAAc,YAClD,kBAAmBA,EAAAA,aAAa,aAAc,QAE9C,mBAAoBA,EAAAA,aAAa,aAAc,SAC/C,qBAAsBA,EAAAA,aAAa,aAAc,WACjD,sBAAuBA,EAAAA,aAAa,aAAc,YAClD,kBAAmBA,EAAAA,aAAa,aAAc,QAE9C,mBAAoBA,EAAAA,aAAa,aAAc,SAC/C,qBAAsBA,EAAAA,aAAa,aAAc,WACjD,sBAAuBA,EAAAA,aAAa,aAAc,YAClD,kBAAmBA,EAAAA,aAAa,aAAc,QAE9C,mBAAoBA,EAAAA,aAAa,aAAc,SAC/C,qBAAsBA,EAAAA,aAAa,aAAc,WACjD,sBAAuBA,EAAAA,aAAa,aAAc,YAClD,kBAAmBA,EAAAA,aAAa,aAAc,QAE9C,sBAAuBA,EAAAA,aAAa,gBAAiB,SACrD,wBAAyBA,EAAAA,aAAa,gBAAiB,WACvD,yBAA0BA,EAAAA,aAAa,gBAAiB,YACxD,qBAAsBA,EAAAA,aAAa,gBAAiB,QAEpD,gBAAiBA,EAAAA,aAAa,UAAW,SACzC,kBAAmBA,EAAAA,aAAa,UAAW,WAC3C,mBAAoBA,EAAAA,aAAa,UAAW,YAC5C,eAAgBA,EAAAA,aAAa,UAAW,QAExC,gBAAiBA,EAAAA,aAAa,UAAW,SACzC,kBAAmBA,EAAAA,aAAa,UAAW,WAC3C,mBAAoBA,EAAAA,aAAa,UAAW,YAC5C,eAAgBA,EAAAA,aAAa,UAAW,QAExC,gBAAiBA,EAAAA,aAAa,UAAW,SACzC,kBAAmBA,EAAAA,aAAa,UAAW,WAC3C,mBAAoBA,EAAAA,aAAa,UAAW,YAC5C,eAAgBA,EAAAA,aAAa,UAAW,QAExC,aAAcA,EAAAA,aAAa,aAAc,YACzC,mBAAoBA,EAAAA,aAAa,mBAAoB,WAErDC,KAAMH"}

package/cjs/theme/utils/css-variable.js

@@ -1,2 +1,2 @@
-"use strict";exports.getInheritedInlineCssVariables=e=>{if(!e||0===e.style.length)return{};const t={};return((e,t)=>{const{style:r}=e;for(let e=0;e<r.length;e++){const n=r.item(e);if(!(null==n?void 0:n.startsWith("--fds")))continue;const o=r.getPropertyValue(n).trim();o&&(t[n]=o)}})(e,t),t},exports.parseCSSVariableValue=function(e,t){var r;if(!e)return"";if(!globalThis.window||!t)return console.warn(`Cannot parse CSS variable value for "${e}" because window or sourceElement is not available.`),"";const n=null===(r=/--fds-[\w-]+/.exec(e))||void 0===r?void 0:r[0];return n?getComputedStyle(t).getPropertyValue(n).trim():(console.warn(`Invalid CSS variable string: ${e}. Expected format: var(--fds-token-name)`),"")},exports.parsePxOrRemValue=function(e){const t=e.trim(),r=/^(-?\d*\.?\d+)(px|rem)$/i.exec(t);if(!r)return 0;const n=Number.parseFloat(r[1]);if(Number.isNaN(n))return 0;if("px"===r[2].toLowerCase())return n;const o=globalThis.window?Number.parseFloat(getComputedStyle(document.documentElement).fontSize):16;return n*(Number.isNaN(o)?16:o)};
+"use strict";const e=/^(-?\d*\.?\d+)(px|rem)$/i,t=e=>{var t;if(!e)return;const r=null===(t=/--fds-[\w-]+/.exec(e))||void 0===t?void 0:t[0];return r||void 0};exports.extractFdsCssVariableName=t,exports.formatUnitValue=(e,t)=>"number"==typeof e?`${e}${t}`:null,exports.getInheritedInlineCssVariables=e=>{if(!e||0===e.style.length)return{};const t={};return((e,t)=>{const{style:r}=e;for(let e=0;e<r.length;e++){const n=r.item(e);if(!(null==n?void 0:n.startsWith("--fds")))continue;const o=r.getPropertyValue(n).trim();o&&(t[n]=o)}})(e,t),t},exports.normalizeCssLengthValue=t=>{if(!t)return;const r=t.trim();return"0"===r||e.test(r)?r:void 0},exports.parseCSSVariableValue=function(e,r){if(!e)return"";if(!globalThis.window||!r)return console.warn(`Cannot parse CSS variable value for "${e}" because window or sourceElement is not available.`),"";const n=t(e);return n?getComputedStyle(r).getPropertyValue(n).trim():(console.warn(`Invalid CSS variable string: ${e}. Expected format: var(--fds-token-name)`),"")},exports.parsePxOrRemValue=function(t){const r=t.trim(),n=e.exec(r);if(!n)return 0;const o=Number.parseFloat(n[1]);if(Number.isNaN(o))return 0;if("px"===n[2].toLowerCase())return o;const s=globalThis.window?Number.parseFloat(getComputedStyle(document.documentElement).fontSize):16;return o*(Number.isNaN(s)?16:s)};
 //# sourceMappingURL=css-variable.js.map

package/cjs/theme/utils/css-variable.js.map

@@ -1 +1 @@
-{"version":3,"file":"css-variable.js","sources":["../../../../src/theme/utils/css-variable.ts"],"sourcesContent":["import type { CSSProperties } from \"react\";\n\nimport type { CSSVariableString } from \"../types\";\n\ntype InlineCssVariables = Record<`--${string}`, string>;\n\nconst DEFAULT_FONT_SIZE_PX = 16;\n\n/**\n * Parse a CSS variable string and return its computed value.\n * @param cssVarString CSS variable string (e.g., \"var(--fds-breakpoint-xxs-min)\")\n * @param sourceElement Element to compute the CSS variable value from\n * @returns The CSS variable value, or an empty string if not found or invalid\n */\nexport function parseCSSVariableValue(\n    cssVarString: CSSVariableString | undefined,\n    sourceElement: HTMLElement | null\n): string {\n    if (!cssVarString) return \"\";\n\n    if (!globalThis.window || !sourceElement) {\n        console.warn(\n            `Cannot parse CSS variable value for \"${cssVarString}\" because window or sourceElement is not available.`\n        );\n        return \"\";\n    }\n\n    const variableName = /--fds-[\\w-]+/.exec(cssVarString as string)?.[0];\n    if (!variableName) {\n        console.warn(\n            `Invalid CSS variable string: ${cssVarString}. Expected format: var(--fds-token-name)`\n        );\n        return \"\";\n    }\n\n    return getComputedStyle(sourceElement)\n        .getPropertyValue(variableName)\n        .trim();\n}\n\n/**\n * Parse a pixel or rem value and return its numeric value.\n * @param cssValue CSS unit value (e.g., \"12px\", \"1.5rem\")\n * @returns Parsed numeric value, or 0 if the value is not px/rem or invalid\n */\nexport function parsePxOrRemValue(cssValue: string): number {\n    const value = cssValue.trim();\n    const match = /^(-?\\d*\\.?\\d+)(px|rem)$/i.exec(value);\n    if (!match) return 0;\n\n    const parsedValue = Number.parseFloat(match[1]);\n    if (Number.isNaN(parsedValue)) return 0;\n\n    const unit = match[2].toLowerCase();\n    if (unit === \"px\") return parsedValue;\n\n    const rootFontSize = globalThis.window\n        ? Number.parseFloat(getComputedStyle(document.documentElement).fontSize)\n        : DEFAULT_FONT_SIZE_PX;\n\n    const resolvedRootFontSize = Number.isNaN(rootFontSize)\n        ? DEFAULT_FONT_SIZE_PX\n        : rootFontSize;\n\n    return parsedValue * resolvedRootFontSize;\n}\n\nconst mergeInlineCssVariables = (\n    element: HTMLElement,\n    target: InlineCssVariables\n) => {\n    const { style } = element;\n\n    for (let i = 0; i < style.length; i++) {\n        const propertyName = style.item(i);\n        if (!propertyName?.startsWith(\"--fds\")) continue;\n\n        const value = style.getPropertyValue(propertyName).trim();\n        if (!value) continue;\n\n        target[propertyName as `--${string}`] = value;\n    }\n};\n\n/**\n * Extracts inline token CSS custom properties from the theme element.\n */\nexport const getInheritedInlineCssVariables = (\n    themeElement: HTMLElement | null\n): CSSProperties => {\n    if (!themeElement || themeElement.style.length === 0) return {};\n\n    const variables: InlineCssVariables = {};\n    mergeInlineCssVariables(themeElement, variables);\n\n    return variables;\n};\n"],"names":["themeElement","style","length","variables","element","target","i","propertyName","item","startsWith","value","getPropertyValue","trim","mergeInlineCssVariables","cssVarString","sourceElement","globalThis","window","console","warn","variableName","_a","exec","getComputedStyle","cssValue","match","parsedValue","Number","parseFloat","isNaN","toLowerCase","rootFontSize","document","documentElement","fontSize"],"mappings":"oDAwFIA,IAEA,IAAKA,GAA8C,IAA9BA,EAAaC,MAAMC,OAAc,MAAO,CAAA,EAE7D,MAAMC,EAAgC,CAAA,EAGtC,MA5B4B,EAC5BC,EACAC,KAEA,MAAMJ,MAAEA,GAAUG,EAElB,IAAK,IAAIE,EAAI,EAAGA,EAAIL,EAAMC,OAAQI,IAAK,CACnC,MAAMC,EAAeN,EAAMO,KAAKF,GAChC,KAAKC,aAAY,EAAZA,EAAcE,WAAW,UAAU,SAExC,MAAMC,EAAQT,EAAMU,iBAAiBJ,GAAcK,OAC9CF,IAELL,EAAOE,GAAiCG,EAC5C,GAYAG,CAAwBb,EAAcG,GAE/BA,CAAS,gCAjFd,SACFW,EACAC,SAEA,IAAKD,EAAc,MAAO,GAE1B,IAAKE,WAAWC,SAAWF,EAIvB,OAHAG,QAAQC,KACJ,wCAAwCL,wDAErC,GAGX,MAAMM,EAA0D,QAA3CC,EAAA,eAAeC,KAAKR,UAAuB,IAAAO,OAAA,EAAAA,EAAG,GACnE,OAAKD,EAOEG,iBAAiBR,GACnBJ,iBAAiBS,GACjBR,QARDM,QAAQC,KACJ,gCAAgCL,6CAE7B,GAMf,4BAOM,SAA4BU,GAC9B,MAAMd,EAAQc,EAASZ,OACjBa,EAAQ,2BAA2BH,KAAKZ,GAC9C,IAAKe,EAAO,OAAO,EAEnB,MAAMC,EAAcC,OAAOC,WAAWH,EAAM,IAC5C,GAAIE,OAAOE,MAAMH,GAAc,OAAO,EAGtC,GAAa,OADAD,EAAM,GAAGK,cACH,OAAOJ,EAE1B,MAAMK,EAAef,WAAWC,OAC1BU,OAAOC,WAAWL,iBAAiBS,SAASC,iBAAiBC,UAnD1C,GA0DzB,OAAOR,GAJsBC,OAAOE,MAAME,GAtDjB,GAwDnBA,EAGV"}
+{"version":3,"file":"css-variable.js","sources":["../../../../src/theme/utils/css-variable.ts"],"sourcesContent":["import type { CSSProperties } from \"react\";\n\nimport type { CSSVariableString } from \"../types\";\n\ntype InlineCssVariables = Record<`--${string}`, string>;\n\nconst DEFAULT_FONT_SIZE_PX = 16;\nconst CSS_PX_OR_REM_CAPTURE_PATTERN = /^(-?\\d*\\.?\\d+)(px|rem)$/i;\n\n/**\n * Extracts an fds CSS variable name from raw token input.\n * Supports values like \"var(--fds-breakpoint-sm-max)\" and \"--fds-breakpoint-sm-max\".\n */\nexport const extractFdsCssVariableName = (\n    value: string | undefined\n): `--fds-${string}` | undefined => {\n    if (!value) return undefined;\n\n    const variableName = /--fds-[\\w-]+/.exec(value)?.[0];\n\n    if (!variableName) {\n        return undefined;\n    }\n\n    return variableName as `--fds-${string}`;\n};\n\n/**\n * Parse a CSS variable string and return its computed value.\n * @param cssVarString CSS variable string (e.g., \"var(--fds-breakpoint-xxs-min)\")\n * @param sourceElement Element to compute the CSS variable value from\n * @returns The CSS variable value, or an empty string if not found or invalid\n */\nexport function parseCSSVariableValue(\n    cssVarString: CSSVariableString | undefined,\n    sourceElement: HTMLElement | null\n): string {\n    if (!cssVarString) return \"\";\n\n    if (!globalThis.window || !sourceElement) {\n        console.warn(\n            `Cannot parse CSS variable value for \"${cssVarString}\" because window or sourceElement is not available.`\n        );\n        return \"\";\n    }\n\n    const variableName = extractFdsCssVariableName(cssVarString);\n    if (!variableName) {\n        console.warn(\n            `Invalid CSS variable string: ${cssVarString}. Expected format: var(--fds-token-name)`\n        );\n        return \"\";\n    }\n\n    return getComputedStyle(sourceElement)\n        .getPropertyValue(variableName)\n        .trim();\n}\n\n/**\n * Parse a pixel or rem value and return its numeric value.\n * @param cssValue CSS unit value (e.g., \"12px\", \"1.5rem\")\n * @returns Parsed numeric value, or 0 if the value is not px/rem or invalid\n */\nexport function parsePxOrRemValue(cssValue: string): number {\n    const value = cssValue.trim();\n    const match = CSS_PX_OR_REM_CAPTURE_PATTERN.exec(value);\n    if (!match) return 0;\n\n    const parsedValue = Number.parseFloat(match[1]);\n    if (Number.isNaN(parsedValue)) return 0;\n\n    const unit = match[2].toLowerCase();\n    if (unit === \"px\") return parsedValue;\n\n    const rootFontSize = globalThis.window\n        ? Number.parseFloat(getComputedStyle(document.documentElement).fontSize)\n        : DEFAULT_FONT_SIZE_PX;\n\n    const resolvedRootFontSize = Number.isNaN(rootFontSize)\n        ? DEFAULT_FONT_SIZE_PX\n        : rootFontSize;\n\n    return parsedValue * resolvedRootFontSize;\n}\n\n/**\n * Normalizes a CSS length value and accepts px/rem or unitless zero.\n * Returns undefined for invalid inputs.\n */\nexport const normalizeCssLengthValue = (\n    value: string | undefined\n): string | undefined => {\n    if (!value) return undefined;\n\n    const trimmedValue = value.trim();\n\n    // CSS allows unitless zero in width-like properties.\n    if (trimmedValue === \"0\") {\n        return trimmedValue;\n    }\n\n    if (!CSS_PX_OR_REM_CAPTURE_PATTERN.test(trimmedValue)) {\n        return undefined;\n    }\n\n    return trimmedValue;\n};\n\nconst mergeInlineCssVariables = (\n    element: HTMLElement,\n    target: InlineCssVariables\n) => {\n    const { style } = element;\n\n    for (let i = 0; i < style.length; i++) {\n        const propertyName = style.item(i);\n        if (!propertyName?.startsWith(\"--fds\")) continue;\n\n        const value = style.getPropertyValue(propertyName).trim();\n        if (!value) continue;\n\n        target[propertyName as `--${string}`] = value;\n    }\n};\n\n/**\n * Extracts inline token CSS custom properties from the theme element.\n */\nexport const getInheritedInlineCssVariables = (\n    themeElement: HTMLElement | null\n): CSSProperties => {\n    if (!themeElement || themeElement.style.length === 0) return {};\n\n    const variables: InlineCssVariables = {};\n    mergeInlineCssVariables(themeElement, variables);\n\n    return variables;\n};\n\n/**\n * Convert a numeric value to a CSS unit string (e.g., 12 → \"12px\"). Returns null for non-numeric values.\n */\nexport const formatUnitValue = (\n    value: unknown,\n    unit: string\n): string | null => {\n    if (typeof value === \"number\") {\n        return `${value}${unit}`;\n    }\n    return null;\n};\n"],"names":["CSS_PX_OR_REM_CAPTURE_PATTERN","extractFdsCssVariableName","value","variableName","_a","exec","unit","themeElement","style","length","variables","element","target","i","propertyName","item","startsWith","getPropertyValue","trim","mergeInlineCssVariables","trimmedValue","test","cssVarString","sourceElement","globalThis","window","console","warn","getComputedStyle","cssValue","match","parsedValue","Number","parseFloat","isNaN","toLowerCase","rootFontSize","document","documentElement","fontSize"],"mappings":"aAMA,MACMA,EAAgC,2BAMzBC,EACTC,UAEA,IAAKA,EAAO,OAEZ,MAAMC,EAAyC,QAA1BC,EAAA,eAAeC,KAAKH,UAAM,IAAAE,OAAA,EAAAA,EAAG,GAElD,OAAKD,QAAL,CAIwC,8DAuHb,CAC3BD,EACAI,IAEqB,iBAAVJ,EACA,GAAGA,IAAQI,IAEf,4CApBPC,IAEA,IAAKA,GAA8C,IAA9BA,EAAaC,MAAMC,OAAc,MAAO,CAAA,EAE7D,MAAMC,EAAgC,CAAA,EAGtC,MA5B4B,EAC5BC,EACAC,KAEA,MAAMJ,MAAEA,GAAUG,EAElB,IAAK,IAAIE,EAAI,EAAGA,EAAIL,EAAMC,OAAQI,IAAK,CACnC,MAAMC,EAAeN,EAAMO,KAAKF,GAChC,KAAKC,aAAY,EAAZA,EAAcE,WAAW,UAAU,SAExC,MAAMd,EAAQM,EAAMS,iBAAiBH,GAAcI,OAC9ChB,IAELU,EAAOE,GAAiCZ,EAC5C,GAYAiB,CAAwBZ,EAAcG,GAE/BA,CAAS,kCA9ChBR,IAEA,IAAKA,EAAO,OAEZ,MAAMkB,EAAelB,EAAMgB,OAG3B,MAAqB,MAAjBE,GAICpB,EAA8BqB,KAAKD,GAH7BA,OAGX,CAImB,gCAzEjB,SACFE,EACAC,GAEA,IAAKD,EAAc,MAAO,GAE1B,IAAKE,WAAWC,SAAWF,EAIvB,OAHAG,QAAQC,KACJ,wCAAwCL,wDAErC,GAGX,MAAMnB,EAAeF,EAA0BqB,GAC/C,OAAKnB,EAOEyB,iBAAiBL,GACnBN,iBAAiBd,GACjBe,QARDQ,QAAQC,KACJ,gCAAgCL,6CAE7B,GAMf,4BAOM,SAA4BO,GAC9B,MAAM3B,EAAQ2B,EAASX,OACjBY,EAAQ9B,EAA8BK,KAAKH,GACjD,IAAK4B,EAAO,OAAO,EAEnB,MAAMC,EAAcC,OAAOC,WAAWH,EAAM,IAC5C,GAAIE,OAAOE,MAAMH,GAAc,OAAO,EAGtC,GAAa,OADAD,EAAM,GAAGK,cACH,OAAOJ,EAE1B,MAAMK,EAAeZ,WAAWC,OAC1BO,OAAOC,WAAWL,iBAAiBS,SAASC,iBAAiBC,UAtE1C,GA6EzB,OAAOR,GAJsBC,OAAOE,MAAME,GAzEjB,GA2EnBA,EAGV"}

package/cjs/theme/utils/use-media-query.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("react"),i=require("../tokens/breakpoint.js"),n=require("./css-variable.js"),r=require("./token-resolver.js"),t=require("./use-design-token.js");const a=new Set([i.Breakpoint["xxs-min"],i.Breakpoint["xs-min"],i.Breakpoint["sm-min"],i.Breakpoint["md-min"],i.Breakpoint["lg-min"],i.Breakpoint["xl-min"],i.Breakpoint["xxl-min"],i.Breakpoint["xxs-max"],i.Breakpoint["xs-max"],i.Breakpoint["sm-max"],i.Breakpoint["md-max"],i.Breakpoint["lg-max"],i.Breakpoint["xl-max"]]),o=e=>r.isTokenFromSet(e,a),s=e=>i.Breakpoint[`${e}-min`],u=e=>i.Breakpoint[`${e}-max`],l=(e,i)=>{if(i)return`(${e}: ${i})`},m=e=>{if(void 0===(null==e?void 0:e.value))return;if(!0===e.value)return`(${e.feature})`;if(!1===e.value)return;const i=`${e.value}`.trim();return i?`(${e.feature}: ${i})`:void 0},d=(e,i)=>{var r,a;const s=t.useResolvedTokenValue({value:e,fallback:null!==(r=null!=i?i:e)&&void 0!==r?r:"",isToken:o,normalizeCustom:e=>e});return null!==(a=n.normalizeCssLengthValue(s))&&void 0!==a?a:n.normalizeCssLengthValue(i)},x=(i,n)=>{const[r,t]=e.useState((()=>((e,i)=>{var n;return e&&(null===(n=globalThis.window)||void 0===n?void 0:n.matchMedia)?globalThis.window.matchMedia(e).matches:i})(i,n)));return e.useEffect((()=>{var e;if(!i||!(null===(e=globalThis.window)||void 0===e?void 0:e.matchMedia))return void t(n);const r=globalThis.window.matchMedia(i),a=e=>{t(e.matches)};return t(r.matches),r.addEventListener("change",a),()=>{r.removeEventListener("change",a)}}),[n,i]),r},v=e=>{const{minWidth:i,maxWidth:n,clauses:r=[]}=e,t=d(i),a=d(n),o=[...[l("min-width",t),l("max-width",a)].filter((e=>!!e)),...r.map(m).filter((e=>!!e))].join(" and "),s=((e,i)=>!i&&!!e)(!!t,!!a);return x(o,s)};exports.DEFAULT_MOBILE_MAX_WIDTH_BREAKPOINT="480px",exports.useMaxWidthMediaQuery=e=>v({maxWidth:u(e)}),exports.useMediaQuery=v,exports.useMinWidthMediaQuery=e=>v({minWidth:s(e)}),exports.useResolvedBreakpointToken=d;
+//# sourceMappingURL=use-media-query.js.map

package/cjs/theme/utils/use-media-query.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-media-query.js","sources":["../../../../src/theme/utils/use-media-query.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\n\nimport { Breakpoint } from \"../tokens/breakpoint\";\nimport { normalizeCssLengthValue } from \"./css-variable\";\nimport { isTokenFromSet } from \"./token-resolver\";\nimport { useResolvedTokenValue } from \"./use-design-token\";\n\nexport type BreakpointName = \"xxs\" | \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"xxl\";\nexport type MaxWidthBreakpointName = Exclude<BreakpointName, \"xxl\">;\ntype MinWidthBreakpointTokenKey = `${BreakpointName}-min`;\ntype MaxWidthBreakpointTokenKey = `${MaxWidthBreakpointName}-max`;\ntype WidthBreakpointTokenKey =\n    | MinWidthBreakpointTokenKey\n    | MaxWidthBreakpointTokenKey;\ntype WidthBreakpointCSSVariableString =\n    (typeof Breakpoint)[WidthBreakpointTokenKey];\n\ntype MediaQueryFeature =\n    | \"aspect-ratio\"\n    | \"color-index\"\n    | \"color\"\n    | \"device-aspect-ratio\"\n    | \"device-height\"\n    | \"device-width\"\n    | \"grid\"\n    | \"height\"\n    | \"max-height\"\n    | \"min-height\"\n    | \"hover\"\n    | \"monochrome\"\n    | \"orientation\"\n    | \"pointer\"\n    | \"prefers-color-scheme\"\n    | \"resolution\"\n    | \"scan\"\n    | \"width\";\n\nexport type MediaQueryClauseValue = string | number | boolean;\n\nexport interface MediaQueryClause {\n    feature: MediaQueryFeature;\n    value: MediaQueryClauseValue | undefined;\n}\n\nexport interface MediaQueryOptions {\n    minWidth?: WidthBreakpointCSSVariableString;\n    maxWidth?: WidthBreakpointCSSVariableString;\n    clauses?: MediaQueryClause[];\n}\n\nexport const DEFAULT_MOBILE_MAX_WIDTH_BREAKPOINT = \"480px\";\nconst WIDTH_BREAKPOINT_TOKEN_SET = new Set<WidthBreakpointCSSVariableString>([\n    Breakpoint[\"xxs-min\"],\n    Breakpoint[\"xs-min\"],\n    Breakpoint[\"sm-min\"],\n    Breakpoint[\"md-min\"],\n    Breakpoint[\"lg-min\"],\n    Breakpoint[\"xl-min\"],\n    Breakpoint[\"xxl-min\"],\n    Breakpoint[\"xxs-max\"],\n    Breakpoint[\"xs-max\"],\n    Breakpoint[\"sm-max\"],\n    Breakpoint[\"md-max\"],\n    Breakpoint[\"lg-max\"],\n    Breakpoint[\"xl-max\"],\n]);\n\nconst isBreakpointToken = (\n    value: unknown\n): value is WidthBreakpointCSSVariableString => {\n    return isTokenFromSet<WidthBreakpointCSSVariableString>(\n        value,\n        WIDTH_BREAKPOINT_TOKEN_SET\n    );\n};\n\nconst getMinWidthBreakpointToken = (breakpoint: BreakpointName) => {\n    return Breakpoint[`${breakpoint}-min`];\n};\n\nconst getMaxWidthBreakpointToken = (breakpoint: MaxWidthBreakpointName) => {\n    return Breakpoint[`${breakpoint}-max`];\n};\n\nexport const useMinWidthMediaQuery = (breakpoint: BreakpointName) =>\n    useMediaQuery({\n        minWidth: getMinWidthBreakpointToken(breakpoint),\n    });\n\nexport const useMaxWidthMediaQuery = (breakpoint: MaxWidthBreakpointName) =>\n    useMediaQuery({\n        maxWidth: getMaxWidthBreakpointToken(breakpoint),\n    });\n\nconst getMediaQueryClause = (\n    feature: \"min-width\" | \"max-width\",\n    value: string | undefined\n) => {\n    if (!value) {\n        return undefined;\n    }\n\n    return `(${feature}: ${value})`;\n};\n\nconst getCustomMediaQueryClause = (\n    clause: MediaQueryClause | null | undefined\n) => {\n    if (clause?.value === undefined) {\n        return undefined;\n    }\n\n    if (clause.value === true) {\n        return `(${clause.feature})`;\n    }\n\n    if (clause.value === false) {\n        return undefined;\n    }\n\n    const value = `${clause.value}`.trim();\n\n    if (!value) {\n        return undefined;\n    }\n\n    return `(${clause.feature}: ${value})`;\n};\n\nconst getDefaultMatch = (hasMinWidth: boolean, hasMaxWidth: boolean) => {\n    if (hasMaxWidth) {\n        return false;\n    }\n\n    if (hasMinWidth) {\n        return true;\n    }\n\n    return false;\n};\n\nconst getCurrentMatch = (queryString: string, defaultMatch: boolean) => {\n    if (!queryString) {\n        return defaultMatch;\n    }\n\n    if (!globalThis.window?.matchMedia) {\n        return defaultMatch;\n    }\n\n    return globalThis.window.matchMedia(queryString).matches;\n};\n\nexport const useResolvedBreakpointToken = (\n    breakpointToken: WidthBreakpointCSSVariableString | undefined,\n    fallbackLength?: string\n): string | undefined => {\n    const resolvedTokenValue = useResolvedTokenValue<\n        WidthBreakpointCSSVariableString,\n        string\n    >({\n        value: breakpointToken,\n        fallback: fallbackLength ?? breakpointToken ?? \"\",\n        isToken: isBreakpointToken,\n        normalizeCustom: (value) => value,\n    });\n\n    return (\n        normalizeCssLengthValue(resolvedTokenValue) ??\n        normalizeCssLengthValue(fallbackLength)\n    );\n};\n\nconst useMatchMediaQuery = (\n    queryString: string,\n    defaultMatch: boolean\n): boolean => {\n    const [matches, setMatches] = useState(() =>\n        getCurrentMatch(queryString, defaultMatch)\n    );\n\n    useEffect(() => {\n        if (!queryString || !globalThis.window?.matchMedia) {\n            setMatches(defaultMatch);\n            return;\n        }\n\n        const mediaQueryList = globalThis.window.matchMedia(queryString);\n        const handleChange = (event: MediaQueryListEvent) => {\n            setMatches(event.matches);\n        };\n\n        setMatches(mediaQueryList.matches);\n        mediaQueryList.addEventListener(\"change\", handleChange);\n\n        return () => {\n            mediaQueryList.removeEventListener(\"change\", handleChange);\n        };\n    }, [defaultMatch, queryString]);\n\n    return matches;\n};\n\nexport const useMediaQuery = (options: MediaQueryOptions): boolean => {\n    const { minWidth, maxWidth, clauses = [] } = options;\n    const normalizedMinWidth = useResolvedBreakpointToken(minWidth);\n    const normalizedMaxWidth = useResolvedBreakpointToken(maxWidth);\n    const widthClauses = [\n        getMediaQueryClause(\"min-width\", normalizedMinWidth),\n        getMediaQueryClause(\"max-width\", normalizedMaxWidth),\n    ].filter((value): value is string => !!value);\n    const customClauses = clauses\n        .map(getCustomMediaQueryClause)\n        .filter((value): value is string => !!value);\n    const queryString = [...widthClauses, ...customClauses].join(\" and \");\n    const hasMinWidth = !!normalizedMinWidth;\n    const hasMaxWidth = !!normalizedMaxWidth;\n    const defaultMatch = getDefaultMatch(hasMinWidth, hasMaxWidth);\n\n    return useMatchMediaQuery(queryString, defaultMatch);\n};\n"],"names":["WIDTH_BREAKPOINT_TOKEN_SET","Set","Breakpoint","isBreakpointToken","value","isTokenFromSet","getMinWidthBreakpointToken","breakpoint","getMaxWidthBreakpointToken","getMediaQueryClause","feature","getCustomMediaQueryClause","clause","undefined","trim","useResolvedBreakpointToken","breakpointToken","fallbackLength","resolvedTokenValue","useResolvedTokenValue","fallback","_a","isToken","normalizeCustom","_b","normalizeCssLengthValue","useMatchMediaQuery","queryString","defaultMatch","matches","setMatches","useState","globalThis","window","matchMedia","getCurrentMatch","useEffect","mediaQueryList","handleChange","event","addEventListener","removeEventListener","useMediaQuery","options","minWidth","maxWidth","clauses","normalizedMinWidth","normalizedMaxWidth","filter","map","join","hasMinWidth","hasMaxWidth","getDefaultMatch"],"mappings":"4KAkDO,MACDA,EAA6B,IAAIC,IAAsC,CACzEC,EAAAA,WAAW,WACXA,EAAAA,WAAW,UACXA,EAAAA,WAAW,UACXA,EAAAA,WAAW,UACXA,EAAAA,WAAW,UACXA,EAAAA,WAAW,UACXA,EAAAA,WAAW,WACXA,EAAAA,WAAW,WACXA,EAAAA,WAAW,UACXA,EAAAA,WAAW,UACXA,EAAAA,WAAW,UACXA,EAAAA,WAAW,UACXA,EAAAA,WAAW,YAGTC,EACFC,GAEOC,EAAAA,eACHD,EACAJ,GAIFM,EAA8BC,GACzBL,aAAW,GAAGK,SAGnBC,EAA8BD,GACzBL,aAAW,GAAGK,SAanBE,EAAsB,CACxBC,EACAN,KAEA,GAAKA,EAIL,MAAO,IAAIM,MAAYN,IAAQ,EAG7BO,EACFC,IAEA,QAAsBC,KAAlBD,aAAM,EAANA,EAAQR,OACR,OAGJ,IAAqB,IAAjBQ,EAAOR,MACP,MAAO,IAAIQ,EAAOF,WAGtB,IAAqB,IAAjBE,EAAOR,MACP,OAGJ,MAAMA,EAAQ,GAAGQ,EAAOR,QAAQU,OAEhC,OAAKV,EAIE,IAAIQ,EAAOF,YAAYN,UAJ9B,CAIsC,EA2B7BW,EAA6B,CACtCC,EACAC,aAEA,MAAMC,EAAqBC,EAAAA,sBAGzB,CACEf,MAAOY,EACPI,SAA2C,QAAjCC,EAAAJ,QAAAA,EAAkBD,SAAe,IAAAK,EAAAA,EAAI,GAC/CC,QAASnB,EACToB,gBAAkBnB,GAAUA,IAGhC,OAC+C,QAA3CoB,EAAAC,0BAAwBP,UAAmB,IAAAM,EAAAA,EAC3CC,EAAAA,wBAAwBR,EAAe,EAIzCS,EAAqB,CACvBC,EACAC,KAEA,MAAOC,EAASC,GAAcC,EAAAA,UAAS,IApCnB,EAACJ,EAAqBC,WAC1C,OAAKD,IAIiB,QAAjBN,EAAAW,WAAWC,cAAM,IAAAZ,OAAA,EAAAA,EAAEa,YAIjBF,WAAWC,OAAOC,WAAWP,GAAaE,QAPtCD,CAO6C,EA4BpDO,CAAgBR,EAAaC,KAsBjC,OAnBAQ,EAAAA,WAAU,WACN,IAAKT,KAAiC,QAAjBN,EAAAW,WAAWC,cAAM,IAAAZ,OAAA,EAAAA,EAAEa,YAEpC,YADAJ,EAAWF,GAIf,MAAMS,EAAiBL,WAAWC,OAAOC,WAAWP,GAC9CW,EAAgBC,IAClBT,EAAWS,EAAMV,QAAQ,EAM7B,OAHAC,EAAWO,EAAeR,SAC1BQ,EAAeG,iBAAiB,SAAUF,GAEnC,KACHD,EAAeI,oBAAoB,SAAUH,EAAa,CAC7D,GACF,CAACV,EAAcD,IAEXE,CAAO,EAGLa,EAAiBC,IAC1B,MAAMC,SAAEA,EAAQC,SAAEA,EAAQC,QAAEA,EAAU,IAAOH,EACvCI,EAAqBhC,EAA2B6B,GAChDI,EAAqBjC,EAA2B8B,GAQhDlB,EAAc,IAPC,CACjBlB,EAAoB,YAAasC,GACjCtC,EAAoB,YAAauC,IACnCC,QAAQ7C,KAA6BA,OACjB0C,EACjBI,IAAIvC,GACJsC,QAAQ7C,KAA6BA,KACc+C,KAAK,SAGvDvB,EAxFc,EAACwB,EAAsBC,KACvCA,KAIAD,EAmFiBE,GAFCP,IACAC,GAGtB,OAAOtB,EAAmBC,EAAaC,EAAa,8CAzKL,sCAuCbrB,GAClCmC,EAAc,CACVG,SAAUrC,EAA2BD,2DAPPA,GAClCmC,EAAc,CACVE,SAAUtC,EAA2BC"}

package/cjs/time-range-picker/combobox-picker/combobox-picker.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../../_virtual/_tslib.js"),r=require("react/jsx-runtime"),t=require("@lifesg/react-icons/cross"),i=require("react"),a=require("../../form/form-label.js"),s=require("../../input/input.styles.js"),l=require("../../input-range-select/input-range-select.style.js"),n=require("../../shared/accessibility/index.js");require("clsx"),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"),require("../../util/calendar-helper.js"),require("../../external/dayjs/dayjs.min.js");var o=require("../../util/simple-id-generator.js");require("../../util/string-helper.js"),require("@react-aria/live-announcer"),require("../../shared/dropdown-list/dropdown-label.styles_1dwmd8f.css");var d=require("../../shared/dropdown-list/dropdown-list.js"),u=require("../../shared/dropdown-list/dropdown-list-state.js");require("../../shared/dropdown-list/expandable-element.js"),require("@lifesg/react-icons/caret-right"),require("@lifesg/react-icons/exclamation-circle-fill"),require("@lifesg/react-icons/minus-square-fill"),require("@lifesg/react-icons/square"),require("@lifesg/react-icons/square-tick-fill"),require("@lifesg/react-icons/tick"),require("react-virtuoso"),require("../../markup/markup.js"),require("../../shared/component-loading-spinner/component-loading-spinner.styles_15eq02i.css");var c=require("../../shared/dropdown-wrapper/element-with-dropdown.js");require("../../shared/input-wrapper/input-wrapper.js"),require("../../shared/dropdown-list/dropdown-list.styles_1qveyb9.css"),require("../../shared/dropdown-list/dropdown-search.js"),require("../../shared/dropdown-list/nested-dropdown-list.styles_wdhxoe.css"),require("immer"),require("../../external/lodash/_getTag.js"),require("../../external/lodash/isArguments.js"),require("../../external/lodash/_baseGetTag.js"),require("../../external/lodash/isBuffer.js"),require("../../external/lodash/isTypedArray.js"),require("../../external/lodash/_Stack.js"),require("../../external/lodash/_SetCache.js"),require("../../external/lodash/_equalByTag.js"),require("../../shared/dropdown-list/virtuoso-components.js");var m=require("../../shared/range-input-inner-container/range-input-inner-container.js"),p=require("../../util/time-helper.js"),h=require("../common.styles.js"),v=require("./combobox-picker.styles.js");exports.ComboboxPicker=g=>{var{id:q,disabled:b=!1,error:f,value:j,format:x="12hr",readOnly:y,onChange:I,onFocus:w,onBlur:T,alignment:C="left",dropdownZIndex:S,startLimit:_,endLimit:k,initialScrollStartTime:H,initialScrollEndTime:E,interval:A=15,dropdownRootNode:F,"aria-labelledby":O,"aria-describedby":B,"aria-invalid":L}=g,M=e.__rest(g,["id","disabled","error","value","format","readOnly","onChange","onFocus","onBlur","alignment","dropdownZIndex","startLimit","endLimit","initialScrollStartTime","initialScrollEndTime","interval","dropdownRootNode","aria-labelledby","aria-describedby","aria-invalid"]);const D=o.useId(),[$,N]=i.useState(null),[P,R]=i.useState(!1),[G,W]=i.useState(""),[Z,K]=i.useState(""),[V,z]=i.useState(""),[J,Q]=i.useState(""),[U,X]=i.useState(""),Y=i.useRef(null),ee=i.useRef(null),re=i.useRef(null),te=`${D}-listbox`,ie=`${D}-start-label`,ae=`${D}-end-label`,se=`${D}-error-message`,le=i.useMemo((()=>p.TimeHelper.generateTimings(A,x,_,k)),[A,x,_,k]),ne=i.useMemo((()=>{if(""===J)return le;const e=p.TimeHelper.findClosestFlooredTime(J,le);return e?le.slice(le.indexOf(e)):[]}),[le,J]),oe=i.useCallback((e=>p.TimeHelper.parseInput(e,x)),[x]),de=i.useMemo((()=>{var e;return null!==(e=oe(H))&&void 0!==e?e:""}),[H,oe]),ue=i.useMemo((()=>{var e;return null!==(e=oe(E))&&void 0!==e?e:""}),[E,oe]);i.useEffect((()=>{var e,r;if(j){const t=null!==(e=oe(j.start))&&void 0!==e?e:"",i=null!==(r=oe(j.end))&&void 0!==r?r:"";K(t),z(i),Q(t),X(i)}}),[j,oe]),i.useEffect((()=>{if(f)return void R(!1);const e=oe(Z),r=oe(V);if(void 0===e)W("Invalid start time");else if(void 0===r)W("Invalid end time");else{if(!(""!==e&&""!==r&&p.TimeHelper.to24Hour(r)<p.TimeHelper.to24Hour(e)))return W(""),void(document.activeElement!==ee.current&&document.activeElement!==re.current||R(!0));W("End time must be after start time")}R(!1)}),[Z,V,oe,f]);const ce=()=>"start"===$?"Selecting for: Start time":"end"===$?"Selecting for: End time":void 0,me=e=>n.concatIds(O,"start"===e?ie:ae),pe=()=>n.concatIds(B,!f&&G?se:void 0),he=e=>{b||y||($||P||null==w||w(),N(e),R(!0))},ve=e=>{var r;b||y||(N(e),R(!0),null===(r=("start"===e?ee:re).current)||void 0===r||r.select())};function ge(e){var r;switch(e.code){case"Enter":"start"===$?qe(Z):"end"===$&&(P&&be(V),null===(r=re.current)||void 0===r||r.blur());break;case"Tab":fe(Z,V,{})}}const qe=e=>{fe(e,V,{goToNextInput:!0})},be=e=>{fe(Z,e,{triggerOnBlur:!0})},fe=(e,r,{goToNextInput:t,triggerOnBlur:i})=>{var a,s,l;const n=null!==(a=oe(e))&&void 0!==a?a:J,o=null!==(s=oe(r))&&void 0!==s?s:U;K(n),z(o);n===J&&o===U||null==I||I({start:n,end:o}),t&&void 0!==oe(e)&&(N("end"),null===(l=re.current)||void 0===l||l.select()),i&&(N(null),R(!1),null==T||T()),Q(n),X(o)},je=e=>{e.stopPropagation(),K(""),z(""),Q(""),X("");null==I||I({start:"",end:""}),N(null),R(!1)},xe=e=>{var r,t;const i=e.relatedTarget,a=(null===(r=null==i?void 0:i.matches)||void 0===r?void 0:r.call(i,"[data-floating-ui-focusable]"))||(null===(t=null==i?void 0:i.matches)||void 0===t?void 0:t.call(i,"[data-floating-ui-focus-guard]")),s=Y.current&&Y.current.contains(i);$&&!P&&!s&&!a&&fe(Z,V,{triggerOnBlur:!0})},ye=()=>{if(!y&&!b&&((null==Z?void 0:Z.length)>0||(null==V?void 0:V.length)>0))return r.jsx(l.ClearIconContainer,{onClick:je,type:"button","aria-label":"Clear",children:r.jsx(t.CrossIcon,{className:s.clearIcon,"aria-hidden":!0})})};return r.jsxs(h.Wrapper,Object.assign({id:q},M,{children:[r.jsx(u.DropdownListState,{children:r.jsx(c.ElementWithDropdown,{enabled:!y&&!b,isOpen:P,renderElement:()=>r.jsxs(v.TimeFieldContainer,{ref:Y,disabled:b,error:f||!!G,readOnly:y,onBlur:xe,role:"group",children:[r.jsx(n.VisuallyHidden,{id:ie,children:"Start time"}),r.jsx(n.VisuallyHidden,{id:ae,children:"End time"}),r.jsxs(m.RangeInputInnerContainer,{error:f||!!G,currentActive:null===$?"none":$,children:[r.jsx(h.SelectorInput,{ref:ee,onFocus:()=>he("start"),placeholder:"start"===$?"hh:mm":"From",onChange:e=>K(e.target.value),value:Z,readOnly:y,"data-testid":M["data-testid"]?`${M["data-testid"]}-timepicker-selector-start`:"timepicker-selector-start",onClick:()=>ve("start"),onKeyDown:ge,autoComplete:"off",type:"text",role:"combobox","aria-labelledby":me("start"),"aria-describedby":pe(),"aria-expanded":P&&"start"===$,"aria-controls":te,"aria-autocomplete":"list","aria-invalid":f||L||!!G,"aria-disabled":b,"aria-readonly":y}),r.jsx(h.SelectorInput,{ref:re,onFocus:()=>he("end"),placeholder:"end"===$?"hh:mm":"To",onChange:e=>z(e.target.value),value:V,readOnly:y,"data-testid":M["data-testid"]?`${M["data-testid"]}-timepicker-selector-end`:"timepicker-selector-end",onClick:()=>ve("end"),onKeyDown:ge,autoComplete:"off",type:"text",role:"combobox","aria-labelledby":me("end"),"aria-describedby":pe(),"aria-expanded":P&&"end"===$,"aria-controls":te,"aria-autocomplete":"list","aria-invalid":f||L||!!G||void 0,"aria-disabled":b||void 0,"aria-readonly":y||void 0})]}),ye()]}),renderDropdown:()=>{if("start"===$){const e=oe(Z)||de;return r.jsx(d.DropdownList,{listItems:le,onSelectItem:qe,selectedItems:[Z],topScrollItem:p.TimeHelper.findClosestFlooredTime(e,le),listboxId:te,ariaLabel:ce(),disableItemFocus:!0,matchElementWidth:!0})}{const e=oe(V)||ue;return r.jsx(d.DropdownList,{listItems:ne,onSelectItem:be,selectedItems:[V],topScrollItem:p.TimeHelper.findClosestFlooredTime(e,ne),listboxId:te,ariaLabel:ce(),disableItemFocus:!0,matchElementWidth:!0})}},onClose:e=>{"outside-press"===e?(N(null),R(!1),null==T||T()):fe(Z,V,{triggerOnBlur:!0})},onDismiss:()=>{var e;null===(e=("start"===$?ee:re).current)||void 0===e||e.focus(),R(!1)},offset:8,alignment:C,fitAvailableHeight:!0,customZIndex:S,rootNode:F})}),!f&&G&&r.jsx(a.FormErrorMessage,{id:se,tabIndex:0,"data-testid":q?`${q}-error-message`:"error-message",children:G})]}))};
+"use strict";var e=require("../../_virtual/_tslib.js"),r=require("react/jsx-runtime"),t=require("clsx"),i=require("react"),a=require("../../form/form-label.js"),s=require("../../shared/accessibility/index.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"),require("../../util/calendar-helper.js"),require("../../external/dayjs/dayjs.min.js");var l=require("../../util/simple-id-generator.js");require("../../util/string-helper.js"),require("@react-aria/live-announcer"),require("../../theme/utils/use-media-query.js"),require("../../shared/dropdown-list/dropdown-label.styles_1dwmd8f.css");var n=require("../../shared/dropdown-list/dropdown-list.js"),o=require("../../shared/dropdown-list/dropdown-list-state.js");require("../../shared/dropdown-list/expandable-element.js"),require("@lifesg/react-icons/caret-right"),require("@lifesg/react-icons/exclamation-circle-fill"),require("@lifesg/react-icons/minus-square-fill"),require("@lifesg/react-icons/square"),require("@lifesg/react-icons/square-tick-fill"),require("@lifesg/react-icons/tick"),require("react-virtuoso"),require("../../markup/markup.js"),require("../../shared/component-loading-spinner/component-loading-spinner.styles_15eq02i.css");var d=require("../../shared/dropdown-wrapper/element-with-dropdown.js"),u=require("../../shared/input-wrapper/input-wrapper.js");require("../../shared/dropdown-list/dropdown-list.styles_1kt4zhf.css"),require("../../shared/dropdown-list/dropdown-search.js"),require("../../shared/dropdown-list/nested-dropdown-list.styles_wdhxoe.css"),require("immer"),require("../../external/lodash/_getTag.js"),require("../../external/lodash/isArguments.js"),require("../../external/lodash/_baseGetTag.js"),require("../../external/lodash/isBuffer.js"),require("../../external/lodash/isTypedArray.js"),require("../../external/lodash/_Stack.js"),require("../../external/lodash/_SetCache.js"),require("../../external/lodash/_equalByTag.js"),require("../../shared/dropdown-list/virtuoso-components.js");var c=require("../../shared/input-wrapper/input-wrapper.styles.js"),m=require("../../shared/range-input-inner-container/range-input-inner-container.js"),p=require("../../util/time-helper.js"),h=require("../common.styles.js"),v=require("./combobox-picker.styles.js");function f(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var b=f(t);exports.ComboboxPicker=t=>{var{id:f,disabled:q=!1,error:g,value:j,format:x="12hr",readOnly:y,onChange:w,onFocus:I,onBlur:T,alignment:C="left",dropdownZIndex:_,startLimit:S,endLimit:k,initialScrollStartTime:H,initialScrollEndTime:E,interval:B=15,dropdownRootNode:A,"aria-labelledby":F,"aria-describedby":O,"aria-invalid":N}=t,L=e.__rest(t,["id","disabled","error","value","format","readOnly","onChange","onFocus","onBlur","alignment","dropdownZIndex","startLimit","endLimit","initialScrollStartTime","initialScrollEndTime","interval","dropdownRootNode","aria-labelledby","aria-describedby","aria-invalid"]);const M=l.useId(),[D,$]=i.useState(null),[P,R]=i.useState(!1),[G,W]=i.useState(""),[Z,K]=i.useState(""),[V,z]=i.useState(""),[J,Q]=i.useState(""),[U,X]=i.useState(""),Y=i.useRef(null),ee=i.useRef(null),re=i.useRef(null),te=`${M}-listbox`,ie=`${M}-start-label`,ae=`${M}-end-label`,se=`${M}-error-message`,le=i.useMemo((()=>p.TimeHelper.generateTimings(B,x,S,k)),[B,x,S,k]),ne=i.useMemo((()=>{if(""===J)return le;const e=p.TimeHelper.findClosestFlooredTime(J,le);return e?le.slice(le.indexOf(e)):[]}),[le,J]),oe=i.useCallback((e=>p.TimeHelper.parseInput(e,x)),[x]),de=i.useMemo((()=>{var e;return null!==(e=oe(H))&&void 0!==e?e:""}),[H,oe]),ue=i.useMemo((()=>{var e;return null!==(e=oe(E))&&void 0!==e?e:""}),[E,oe]);i.useEffect((()=>{var e,r;if(j){const t=null!==(e=oe(j.start))&&void 0!==e?e:"",i=null!==(r=oe(j.end))&&void 0!==r?r:"";K(t),z(i),Q(t),X(i)}}),[j,oe]),i.useEffect((()=>{if(g)return void R(!1);const e=oe(Z),r=oe(V);if(void 0===e)W("Invalid start time");else if(void 0===r)W("Invalid end time");else{if(!(""!==e&&""!==r&&p.TimeHelper.to24Hour(r)<p.TimeHelper.to24Hour(e)))return W(""),void(document.activeElement!==ee.current&&document.activeElement!==re.current||R(!0));W("End time must be after start time")}R(!1)}),[Z,V,oe,g]);const ce=()=>"start"===D?"Selecting for: Start time":"end"===D?"Selecting for: End time":void 0,me=e=>s.concatIds(F,"start"===e?ie:ae),pe=()=>s.concatIds(O,!g&&G?se:void 0),he=e=>{q||y||(D||P||null==I||I(),$(e),R(!0))},ve=e=>{var r;q||y||($(e),R(!0),null===(r=("start"===e?ee:re).current)||void 0===r||r.select())};function fe(e){var r;switch(e.code){case"Enter":"start"===D?be(Z):"end"===D&&(P&&qe(V),null===(r=re.current)||void 0===r||r.blur());break;case"Tab":ge(Z,V,{})}}const be=e=>{ge(e,V,{goToNextInput:!0})},qe=e=>{ge(Z,e,{triggerOnBlur:!0})},ge=(e,r,{goToNextInput:t,triggerOnBlur:i})=>{var a,s,l;const n=null!==(a=oe(e))&&void 0!==a?a:J,o=null!==(s=oe(r))&&void 0!==s?s:U;K(n),z(o);n===J&&o===U||null==w||w({start:n,end:o}),t&&void 0!==oe(e)&&($("end"),null===(l=re.current)||void 0===l||l.select()),i&&($(null),R(!1),null==T||T()),Q(n),X(o)},je=e=>{e.stopPropagation(),K(""),z(""),Q(""),X("");null==w||w({start:"",end:""}),$(null),R(!1)},xe=e=>{var r,t;const i=e.relatedTarget,a=(null===(r=null==i?void 0:i.matches)||void 0===r?void 0:r.call(i,"[data-floating-ui-focusable]"))||(null===(t=null==i?void 0:i.matches)||void 0===t?void 0:t.call(i,"[data-floating-ui-focus-guard]")),s=Y.current&&Y.current.contains(i);D&&!P&&!s&&!a&&ge(Z,V,{triggerOnBlur:!0})},ye=()=>{if(!y&&!q&&((null==Z?void 0:Z.length)>0||(null==V?void 0:V.length)>0))return r.jsx("div",{className:c.clearButtonContainer,children:r.jsx(u.ClearButton,{onClick:je,type:"button","aria-label":"Clear"})})};return r.jsxs("div",Object.assign({id:f},L,{className:b.default(h.wrapper,L.className),children:[r.jsx(o.DropdownListState,{children:r.jsx(d.ElementWithDropdown,{enabled:!y&&!q,isOpen:P,renderElement:()=>r.jsxs(u.InputWrapper,{ref:Y,disabled:q,error:g||!!G,readOnly:y,onBlur:xe,role:"group","data-testid":"timepicker-container",className:v.timeFieldContainer,children:[r.jsx(s.VisuallyHidden,{id:ie,children:"Start time"}),r.jsx(s.VisuallyHidden,{id:ae,children:"End time"}),r.jsxs(m.RangeInputInnerContainer,{error:g||!!G,currentActive:null===D?"none":D,children:[r.jsx(u.BasicInput,{ref:ee,onFocus:()=>he("start"),placeholder:"start"===D?"hh:mm":"From",onChange:e=>K(e.target.value),value:Z,readOnly:y,"data-testid":L["data-testid"]?`${L["data-testid"]}-timepicker-selector-start`:"timepicker-selector-start",onClick:()=>ve("start"),onKeyDown:fe,autoComplete:"off",type:"text",role:"combobox","aria-labelledby":me("start"),"aria-describedby":pe(),"aria-expanded":P&&"start"===D,"aria-controls":te,"aria-autocomplete":"list","aria-invalid":g||N||!!G,"aria-disabled":q,"aria-readonly":y,className:h.selectorInput}),r.jsx(u.BasicInput,{ref:re,onFocus:()=>he("end"),placeholder:"end"===D?"hh:mm":"To",onChange:e=>z(e.target.value),value:V,readOnly:y,"data-testid":L["data-testid"]?`${L["data-testid"]}-timepicker-selector-end`:"timepicker-selector-end",onClick:()=>ve("end"),onKeyDown:fe,autoComplete:"off",type:"text",role:"combobox","aria-labelledby":me("end"),"aria-describedby":pe(),"aria-expanded":P&&"end"===D,"aria-controls":te,"aria-autocomplete":"list","aria-invalid":g||N||!!G||void 0,"aria-disabled":q||void 0,"aria-readonly":y||void 0,className:h.selectorInput})]}),ye()]}),renderDropdown:()=>{if("start"===D){const e=oe(Z)||de;return r.jsx(n.DropdownList,{listItems:le,onSelectItem:be,selectedItems:[Z],topScrollItem:p.TimeHelper.findClosestFlooredTime(e,le),listboxId:te,ariaLabel:ce(),disableItemFocus:!0,matchElementWidth:!0})}{const e=oe(V)||ue;return r.jsx(n.DropdownList,{listItems:ne,onSelectItem:qe,selectedItems:[V],topScrollItem:p.TimeHelper.findClosestFlooredTime(e,ne),listboxId:te,ariaLabel:ce(),disableItemFocus:!0,matchElementWidth:!0})}},onClose:e=>{"outside-press"===e?($(null),R(!1),null==T||T()):ge(Z,V,{triggerOnBlur:!0})},onDismiss:()=>{var e;null===(e=("start"===D?ee:re).current)||void 0===e||e.focus(),R(!1)},offset:8,alignment:C,fitAvailableHeight:!0,customZIndex:_,rootNode:A})}),!g&&G&&r.jsx(a.FormErrorMessage,{id:se,tabIndex:0,"data-testid":f?`${f}-error-message`:"error-message",children:G})]}))};
 //# sourceMappingURL=combobox-picker.js.map

package/cjs/time-range-picker/combobox-picker/combobox-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"combobox-picker.js","sources":["../../../../src/time-range-picker/combobox-picker/combobox-picker.tsx"],"sourcesContent":["import type { OpenChangeReason } from \"@floating-ui/react\";\nimport { CrossIcon } from \"@lifesg/react-icons/cross\";\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\n\nimport { FormErrorMessage } from \"../../form/form-label\";\nimport { clearIcon } from \"../../input/input.styles\";\nimport { ClearIconContainer } from \"../../input-range-select/input-range-select.style\";\nimport { concatIds, VisuallyHidden } from \"../../shared/accessibility\";\nimport { DropdownListState } from \"../../shared/dropdown-list\";\nimport { DropdownList } from \"../../shared/dropdown-list/dropdown-list\";\nimport { ElementWithDropdown } from \"../../shared/dropdown-wrapper\";\nimport { RangeInputInnerContainer } from \"../../shared/range-input-inner-container\";\nimport { useId } from \"../../util\";\nimport { TimeHelper } from \"../../util/time-helper\";\nimport { SelectorInput, Wrapper } from \"../common.styles\";\nimport type { TimeRangePickerProps, TimeRangePickerValue } from \"../types\";\nimport * as styles from \"./combobox-picker.styles\";\n\ntype TimeRangeInputType = \"start\" | \"end\";\ninterface TimeChangeOptions {\n    goToNextInput?: boolean | undefined;\n    triggerOnBlur?: boolean | undefined;\n}\n\nexport const ComboboxPicker = ({\n    id,\n    disabled = false,\n    error,\n    value,\n    format = \"12hr\",\n    readOnly,\n    onChange,\n    onFocus,\n    onBlur,\n    alignment = \"left\",\n    dropdownZIndex,\n    startLimit,\n    endLimit,\n    initialScrollStartTime,\n    initialScrollEndTime,\n    interval = 15,\n    dropdownRootNode,\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-describedby\": ariaDescribedBy,\n    \"aria-invalid\": ariaInvalid,\n    ...otherProps\n}: TimeRangePickerProps) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const internalId = useId();\n    const [activeTimeSelector, setActiveTimeSelector] =\n        useState<TimeRangeInputType | null>(null);\n    const [dropdownOpen, setDropdownOpen] = useState<boolean>(false);\n    const [validationError, setValidationError] = useState<string>(\"\");\n\n    const [startTimeVal, setStartTimeVal] = useState<string>(\"\");\n    const [endTimeVal, setEndTimeVal] = useState<string>(\"\");\n    const [initialStartTimeVal, setInitialStartTimeVal] = useState<string>(\"\");\n    const [initialEndTimeVal, setInitialEndTimeVal] = useState<string>(\"\");\n\n    const nodeRef = useRef<HTMLDivElement>(null);\n    const startInputRef = useRef<HTMLInputElement>(null);\n    const endInputRef = useRef<HTMLInputElement>(null);\n\n    const listboxId = `${internalId}-listbox`;\n    const startLabelId = `${internalId}-start-label`;\n    const endLabelId = `${internalId}-end-label`;\n    const errorId = `${internalId}-error-message`;\n\n    const startOptions = useMemo(\n        () =>\n            TimeHelper.generateTimings(interval, format, startLimit, endLimit),\n        [interval, format, startLimit, endLimit]\n    );\n    const endOptions = useMemo(() => {\n        if (initialStartTimeVal === \"\") return startOptions;\n\n        const flooredStartVal = TimeHelper.findClosestFlooredTime(\n            initialStartTimeVal,\n            startOptions\n        );\n        return flooredStartVal\n            ? startOptions.slice(startOptions.indexOf(flooredStartVal))\n            : [];\n    }, [startOptions, initialStartTimeVal]);\n\n    // =========================================================================\n    // EFFECTS\n    // =========================================================================\n    const parseInput = useCallback(\n        (input: string | undefined): string | undefined => {\n            return TimeHelper.parseInput(input, format);\n        },\n        [format]\n    );\n\n    const parsedInitialStartScrollTime = useMemo(\n        () => parseInput(initialScrollStartTime) ?? \"\",\n        [initialScrollStartTime, parseInput]\n    );\n\n    const parsedInitialEndScrollTime = useMemo(\n        () => parseInput(initialScrollEndTime) ?? \"\",\n        [initialScrollEndTime, parseInput]\n    );\n\n    useEffect(() => {\n        if (value) {\n            const start = parseInput(value.start) ?? \"\";\n            const end = parseInput(value.end) ?? \"\";\n\n            setStartTimeVal(start);\n            setEndTimeVal(end);\n            setInitialStartTimeVal(start);\n            setInitialEndTimeVal(end);\n        }\n    }, [value, parseInput]);\n\n    // Validation for keyboard input\n    useEffect(() => {\n        if (error) {\n            setDropdownOpen(false);\n            return;\n        }\n\n        const start = parseInput(startTimeVal);\n        const end = parseInput(endTimeVal);\n\n        if (start === undefined) {\n            setValidationError(\"Invalid start time\");\n        } else if (end === undefined) {\n            setValidationError(\"Invalid end time\");\n        } else if (\n            start !== \"\" &&\n            end !== \"\" &&\n            TimeHelper.to24Hour(end) < TimeHelper.to24Hour(start)\n        ) {\n            setValidationError(\"End time must be after start time\");\n        } else {\n            setValidationError(\"\");\n            // Re-open dropdown if error was corrected\n            if (\n                document.activeElement === startInputRef.current ||\n                document.activeElement === endInputRef.current\n            ) {\n                setDropdownOpen(true);\n            }\n            return;\n        }\n\n        // Hide dropdown so error message is visible\n        setDropdownOpen(false);\n    }, [startTimeVal, endTimeVal, parseInput, error]);\n\n    // =============================================================================\n    // HELPERS\n    // =============================================================================\n    const getDropdownAriaLabel = () => {\n        if (activeTimeSelector === \"start\") {\n            return \"Selecting for: Start time\";\n        }\n\n        if (activeTimeSelector === \"end\") {\n            return \"Selecting for: End time\";\n        }\n\n        return undefined;\n    };\n\n    const getInputLabelledBy = (type: TimeRangeInputType) => {\n        return concatIds(\n            ariaLabelledBy,\n            type === \"start\" ? startLabelId : endLabelId\n        );\n    };\n\n    const getInputDescribedBy = () => {\n        return concatIds(\n            ariaDescribedBy,\n            !error && validationError ? errorId : undefined\n        );\n    };\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleInputFocus = (selector: TimeRangeInputType) => {\n        if (disabled || readOnly) return;\n\n        // Only run onFocus if not already focused\n        if (!activeTimeSelector && !dropdownOpen) onFocus?.();\n\n        setActiveTimeSelector(selector);\n        setDropdownOpen(true);\n    };\n\n    const handleInputClick = (selector: TimeRangeInputType) => {\n        if (disabled || readOnly) return;\n\n        setActiveTimeSelector(selector);\n        setDropdownOpen(true);\n        (selector === \"start\" ? startInputRef : endInputRef).current?.select();\n    };\n\n    function handleKeyDownEvent(event: React.KeyboardEvent<HTMLInputElement>) {\n        switch (event.code) {\n            case \"Enter\":\n                if (activeTimeSelector === \"start\") {\n                    handleStartTime(startTimeVal);\n                } else if (activeTimeSelector === \"end\") {\n                    // Let handleBlur call handleTimeChange instead\n                    if (dropdownOpen) handleEndTime(endTimeVal);\n                    endInputRef.current?.blur();\n                }\n                break;\n            case \"Tab\":\n                handleTimeChange(startTimeVal, endTimeVal, {});\n                break;\n            default:\n                break;\n        }\n    }\n\n    const handleStartTime = (input: string) => {\n        handleTimeChange(input, endTimeVal, { goToNextInput: true });\n    };\n\n    const handleEndTime = (input: string) => {\n        handleTimeChange(startTimeVal, input, { triggerOnBlur: true });\n    };\n\n    const handleTimeChange = (\n        startInput: string,\n        endInput: string,\n        {\n            goToNextInput, // Used by handleStart to move to end input automatically\n            triggerOnBlur, // Used by handleEnd/handleClear to trigger onBlur\n        }: TimeChangeOptions\n    ) => {\n        const start = parseInput(startInput) ?? initialStartTimeVal;\n        const end = parseInput(endInput) ?? initialEndTimeVal;\n\n        setStartTimeVal(start);\n        setEndTimeVal(end);\n\n        const timeValue: TimeRangePickerValue = { start, end };\n\n        // Trigger onChange if values have changed\n        if (start !== initialStartTimeVal || end !== initialEndTimeVal) {\n            onChange?.(timeValue);\n        }\n\n        // Go to end input only if start is a valid time\n        if (goToNextInput && parseInput(startInput) !== undefined) {\n            setActiveTimeSelector(\"end\");\n            endInputRef.current?.select();\n        }\n\n        if (triggerOnBlur) {\n            setActiveTimeSelector(null);\n            setDropdownOpen(false);\n            onBlur?.();\n        }\n\n        setInitialStartTimeVal(start);\n        setInitialEndTimeVal(end);\n    };\n\n    const handleClear = (event: React.MouseEvent) => {\n        event.stopPropagation();\n        setStartTimeVal(\"\");\n        setEndTimeVal(\"\");\n        setInitialStartTimeVal(\"\");\n        setInitialEndTimeVal(\"\");\n\n        const timeValue: TimeRangePickerValue = {\n            start: \"\",\n            end: \"\",\n        };\n\n        onChange?.(timeValue);\n        setActiveTimeSelector(null);\n        setDropdownOpen(false);\n    };\n\n    const handleDismiss = () => {\n        (activeTimeSelector === \"start\"\n            ? startInputRef\n            : endInputRef\n        ).current?.focus();\n        setDropdownOpen(false);\n    };\n\n    const handleBlur = (event: React.FocusEvent<HTMLDivElement, Element>) => {\n        const target = event.relatedTarget as HTMLElement;\n\n        const isFloatingElement =\n            target?.matches?.(\"[data-floating-ui-focusable]\") ||\n            target?.matches?.(\"[data-floating-ui-focus-guard]\");\n        const isInsideNode =\n            nodeRef.current && nodeRef.current.contains(target);\n\n        // Condition when the calendar is closed and focus moved outside the component\n        const shouldBlurWhenClosed =\n            activeTimeSelector &&\n            !dropdownOpen &&\n            !isInsideNode &&\n            !isFloatingElement;\n\n        if (shouldBlurWhenClosed) {\n            handleTimeChange(startTimeVal, endTimeVal, { triggerOnBlur: true });\n        }\n    };\n\n    // NOTE: Dropdown dismissal (esc) does not trigger onClose\n    const handleClose = (reason: OpenChangeReason | undefined) => {\n        if (reason === \"outside-press\") {\n            // No handleTimeChange to avoid duplicate call from handleBlur\n            setActiveTimeSelector(null);\n            setDropdownOpen(false);\n            onBlur?.();\n        } else {\n            // Dropdown closed via exiting component (eg. tab)\n            handleTimeChange(startTimeVal, endTimeVal, { triggerOnBlur: true });\n        }\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderClearButton = () => {\n        if (\n            !readOnly &&\n            !disabled &&\n            (startTimeVal?.length > 0 || endTimeVal?.length > 0)\n        ) {\n            return (\n                <ClearIconContainer\n                    onClick={handleClear}\n                    type=\"button\"\n                    aria-label=\"Clear\"\n                >\n                    <CrossIcon className={clearIcon} aria-hidden />\n                </ClearIconContainer>\n            );\n        }\n    };\n\n    const renderDropdown = () => {\n        if (activeTimeSelector === \"start\") {\n            // Prioritise start time value. If non existent, use initial scroll time\n            // If both are non existent, DropdownList will default to first option\n            const startScrollTime =\n                parseInput(startTimeVal) || parsedInitialStartScrollTime;\n\n            return (\n                <DropdownList\n                    listItems={startOptions}\n                    onSelectItem={handleStartTime}\n                    selectedItems={[startTimeVal]}\n                    topScrollItem={TimeHelper.findClosestFlooredTime(\n                        startScrollTime,\n                        startOptions\n                    )}\n                    listboxId={listboxId}\n                    ariaLabel={getDropdownAriaLabel()}\n                    disableItemFocus\n                    matchElementWidth\n                />\n            );\n        } else {\n            const endScrollTime =\n                parseInput(endTimeVal) || parsedInitialEndScrollTime;\n\n            return (\n                <DropdownList\n                    listItems={endOptions}\n                    onSelectItem={handleEndTime}\n                    selectedItems={[endTimeVal]}\n                    topScrollItem={TimeHelper.findClosestFlooredTime(\n                        endScrollTime,\n                        endOptions\n                    )}\n                    listboxId={listboxId}\n                    ariaLabel={getDropdownAriaLabel()}\n                    disableItemFocus\n                    matchElementWidth\n                />\n            );\n        }\n    };\n\n    const renderElement = () => (\n        <styles.TimeFieldContainer\n            ref={nodeRef}\n            disabled={disabled}\n            error={error || !!validationError}\n            readOnly={readOnly}\n            onBlur={handleBlur}\n            role=\"group\"\n        >\n            <VisuallyHidden id={startLabelId}>Start time</VisuallyHidden>\n            <VisuallyHidden id={endLabelId}>End time</VisuallyHidden>\n\n            <RangeInputInnerContainer\n                error={error || !!validationError}\n                currentActive={\n                    activeTimeSelector === null ? \"none\" : activeTimeSelector\n                }\n            >\n                {/* From */}\n                <SelectorInput\n                    ref={startInputRef}\n                    onFocus={() => handleInputFocus(\"start\")}\n                    placeholder={\n                        activeTimeSelector === \"start\" ? \"hh:mm\" : \"From\"\n                    }\n                    onChange={(e) => setStartTimeVal(e.target.value)}\n                    value={startTimeVal}\n                    readOnly={readOnly}\n                    data-testid={\n                        otherProps[\"data-testid\"]\n                            ? `${otherProps[\"data-testid\"]}-timepicker-selector-start`\n                            : \"timepicker-selector-start\"\n                    }\n                    onClick={() => handleInputClick(\"start\")}\n                    onKeyDown={handleKeyDownEvent}\n                    autoComplete=\"off\"\n                    type=\"text\"\n                    role=\"combobox\"\n                    aria-labelledby={getInputLabelledBy(\"start\")}\n                    aria-describedby={getInputDescribedBy()}\n                    aria-expanded={\n                        dropdownOpen && activeTimeSelector === \"start\"\n                    }\n                    aria-controls={listboxId}\n                    aria-autocomplete=\"list\"\n                    aria-invalid={error || ariaInvalid || !!validationError}\n                    aria-disabled={disabled}\n                    aria-readonly={readOnly}\n                />\n                {/* To */}\n                <SelectorInput\n                    ref={endInputRef}\n                    onFocus={() => handleInputFocus(\"end\")}\n                    placeholder={activeTimeSelector === \"end\" ? \"hh:mm\" : \"To\"}\n                    onChange={(e) => setEndTimeVal(e.target.value)}\n                    value={endTimeVal}\n                    readOnly={readOnly}\n                    data-testid={\n                        otherProps[\"data-testid\"]\n                            ? `${otherProps[\"data-testid\"]}-timepicker-selector-end`\n                            : \"timepicker-selector-end\"\n                    }\n                    onClick={() => handleInputClick(\"end\")}\n                    onKeyDown={handleKeyDownEvent}\n                    autoComplete=\"off\"\n                    type=\"text\"\n                    role=\"combobox\"\n                    aria-labelledby={getInputLabelledBy(\"end\")}\n                    aria-describedby={getInputDescribedBy()}\n                    aria-expanded={dropdownOpen && activeTimeSelector === \"end\"}\n                    aria-controls={listboxId}\n                    aria-autocomplete=\"list\"\n                    aria-invalid={\n                        error || ariaInvalid || !!validationError || undefined\n                    }\n                    aria-disabled={disabled || undefined}\n                    aria-readonly={readOnly || undefined}\n                />\n            </RangeInputInnerContainer>\n            {renderClearButton()}\n        </styles.TimeFieldContainer>\n    );\n\n    const renderError = () =>\n        // Only display internal error message if user does not provide one\n        !error &&\n        validationError && (\n            <FormErrorMessage\n                id={errorId}\n                tabIndex={0}\n                data-testid={id ? `${id}-error-message` : \"error-message\"}\n            >\n                {validationError}\n            </FormErrorMessage>\n        );\n\n    return (\n        <Wrapper id={id} {...otherProps}>\n            <DropdownListState>\n                <ElementWithDropdown\n                    enabled={!readOnly && !disabled}\n                    isOpen={dropdownOpen}\n                    renderElement={renderElement}\n                    renderDropdown={renderDropdown}\n                    onClose={handleClose}\n                    onDismiss={handleDismiss}\n                    offset={8}\n                    alignment={alignment}\n                    fitAvailableHeight\n                    customZIndex={dropdownZIndex}\n                    rootNode={dropdownRootNode}\n                />\n            </DropdownListState>\n            {renderError()}\n        </Wrapper>\n    );\n};\n"],"names":["_a","id","disabled","error","value","format","readOnly","onChange","onFocus","onBlur","alignment","dropdownZIndex","startLimit","endLimit","initialScrollStartTime","initialScrollEndTime","interval","dropdownRootNode","ariaLabelledBy","ariaDescribedBy","ariaInvalid","otherProps","__rest","internalId","useId","activeTimeSelector","setActiveTimeSelector","useState","dropdownOpen","setDropdownOpen","validationError","setValidationError","startTimeVal","setStartTimeVal","endTimeVal","setEndTimeVal","initialStartTimeVal","setInitialStartTimeVal","initialEndTimeVal","setInitialEndTimeVal","nodeRef","useRef","startInputRef","endInputRef","listboxId","startLabelId","endLabelId","errorId","startOptions","useMemo","TimeHelper","generateTimings","endOptions","flooredStartVal","findClosestFlooredTime","slice","indexOf","parseInput","useCallback","input","parsedInitialStartScrollTime","parsedInitialEndScrollTime","useEffect","start","end","_b","undefined","to24Hour","document","activeElement","current","getDropdownAriaLabel","getInputLabelledBy","type","concatIds","getInputDescribedBy","handleInputFocus","selector","handleInputClick","select","handleKeyDownEvent","event","code","handleStartTime","handleEndTime","blur","handleTimeChange","goToNextInput","triggerOnBlur","startInput","endInput","_c","handleClear","stopPropagation","handleBlur","target","relatedTarget","isFloatingElement","matches","call","isInsideNode","contains","renderClearButton","length","_jsx","ClearIconContainer","onClick","children","CrossIcon","className","clearIcon","_jsxs","Wrapper","Object","assign","DropdownListState","ElementWithDropdown","enabled","isOpen","renderElement","styles.TimeFieldContainer","ref","role","VisuallyHidden","RangeInputInnerContainer","currentActive","SelectorInput","placeholder","e","onKeyDown","autoComplete","renderDropdown","startScrollTime","DropdownList","listItems","onSelectItem","selectedItems","topScrollItem","ariaLabel","disableItemFocus","matchElementWidth","endScrollTime","onClose","reason","onDismiss","focus","offset","fitAvailableHeight","customZIndex","rootNode","FormErrorMessage","tabIndex"],"mappings":"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"}
+{"version":3,"file":"combobox-picker.js","sources":["../../../../src/time-range-picker/combobox-picker/combobox-picker.tsx"],"sourcesContent":["import type { OpenChangeReason } from \"@floating-ui/react\";\nimport clsx from \"clsx\";\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\n\nimport { FormErrorMessage } from \"../../form/form-label\";\nimport { concatIds, VisuallyHidden } from \"../../shared/accessibility\";\nimport { DropdownListState } from \"../../shared/dropdown-list\";\nimport { DropdownList } from \"../../shared/dropdown-list/dropdown-list\";\nimport { ElementWithDropdown } from \"../../shared/dropdown-wrapper\";\nimport {\n    BasicInput,\n    ClearButton,\n    InputWrapper,\n} from \"../../shared/input-wrapper\";\nimport * as inputWrapperStyles from \"../../shared/input-wrapper/input-wrapper.styles\";\nimport { RangeInputInnerContainer } from \"../../shared/range-input-inner-container\";\nimport { useId } from \"../../util\";\nimport { TimeHelper } from \"../../util/time-helper\";\nimport * as commonStyles from \"../common.styles\";\nimport type { TimeRangePickerProps, TimeRangePickerValue } from \"../types\";\nimport * as styles from \"./combobox-picker.styles\";\n\ntype TimeRangeInputType = \"start\" | \"end\";\ninterface TimeChangeOptions {\n    goToNextInput?: boolean | undefined;\n    triggerOnBlur?: boolean | undefined;\n}\n\nexport const ComboboxPicker = ({\n    id,\n    disabled = false,\n    error,\n    value,\n    format = \"12hr\",\n    readOnly,\n    onChange,\n    onFocus,\n    onBlur,\n    alignment = \"left\",\n    dropdownZIndex,\n    startLimit,\n    endLimit,\n    initialScrollStartTime,\n    initialScrollEndTime,\n    interval = 15,\n    dropdownRootNode,\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-describedby\": ariaDescribedBy,\n    \"aria-invalid\": ariaInvalid,\n    ...otherProps\n}: TimeRangePickerProps) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const internalId = useId();\n    const [activeTimeSelector, setActiveTimeSelector] =\n        useState<TimeRangeInputType | null>(null);\n    const [dropdownOpen, setDropdownOpen] = useState<boolean>(false);\n    const [validationError, setValidationError] = useState<string>(\"\");\n\n    const [startTimeVal, setStartTimeVal] = useState<string>(\"\");\n    const [endTimeVal, setEndTimeVal] = useState<string>(\"\");\n    const [initialStartTimeVal, setInitialStartTimeVal] = useState<string>(\"\");\n    const [initialEndTimeVal, setInitialEndTimeVal] = useState<string>(\"\");\n\n    const nodeRef = useRef<HTMLDivElement>(null);\n    const startInputRef = useRef<HTMLInputElement>(null);\n    const endInputRef = useRef<HTMLInputElement>(null);\n\n    const listboxId = `${internalId}-listbox`;\n    const startLabelId = `${internalId}-start-label`;\n    const endLabelId = `${internalId}-end-label`;\n    const errorId = `${internalId}-error-message`;\n\n    const startOptions = useMemo(\n        () =>\n            TimeHelper.generateTimings(interval, format, startLimit, endLimit),\n        [interval, format, startLimit, endLimit]\n    );\n    const endOptions = useMemo(() => {\n        if (initialStartTimeVal === \"\") return startOptions;\n\n        const flooredStartVal = TimeHelper.findClosestFlooredTime(\n            initialStartTimeVal,\n            startOptions\n        );\n        return flooredStartVal\n            ? startOptions.slice(startOptions.indexOf(flooredStartVal))\n            : [];\n    }, [startOptions, initialStartTimeVal]);\n\n    // =========================================================================\n    // EFFECTS\n    // =========================================================================\n    const parseInput = useCallback(\n        (input: string | undefined): string | undefined => {\n            return TimeHelper.parseInput(input, format);\n        },\n        [format]\n    );\n\n    const parsedInitialStartScrollTime = useMemo(\n        () => parseInput(initialScrollStartTime) ?? \"\",\n        [initialScrollStartTime, parseInput]\n    );\n\n    const parsedInitialEndScrollTime = useMemo(\n        () => parseInput(initialScrollEndTime) ?? \"\",\n        [initialScrollEndTime, parseInput]\n    );\n\n    useEffect(() => {\n        if (value) {\n            const start = parseInput(value.start) ?? \"\";\n            const end = parseInput(value.end) ?? \"\";\n\n            setStartTimeVal(start);\n            setEndTimeVal(end);\n            setInitialStartTimeVal(start);\n            setInitialEndTimeVal(end);\n        }\n    }, [value, parseInput]);\n\n    // Validation for keyboard input\n    useEffect(() => {\n        if (error) {\n            setDropdownOpen(false);\n            return;\n        }\n\n        const start = parseInput(startTimeVal);\n        const end = parseInput(endTimeVal);\n\n        if (start === undefined) {\n            setValidationError(\"Invalid start time\");\n        } else if (end === undefined) {\n            setValidationError(\"Invalid end time\");\n        } else if (\n            start !== \"\" &&\n            end !== \"\" &&\n            TimeHelper.to24Hour(end) < TimeHelper.to24Hour(start)\n        ) {\n            setValidationError(\"End time must be after start time\");\n        } else {\n            setValidationError(\"\");\n            // Re-open dropdown if error was corrected\n            if (\n                document.activeElement === startInputRef.current ||\n                document.activeElement === endInputRef.current\n            ) {\n                setDropdownOpen(true);\n            }\n            return;\n        }\n\n        // Hide dropdown so error message is visible\n        setDropdownOpen(false);\n    }, [startTimeVal, endTimeVal, parseInput, error]);\n\n    // =============================================================================\n    // HELPERS\n    // =============================================================================\n    const getDropdownAriaLabel = () => {\n        if (activeTimeSelector === \"start\") {\n            return \"Selecting for: Start time\";\n        }\n\n        if (activeTimeSelector === \"end\") {\n            return \"Selecting for: End time\";\n        }\n\n        return undefined;\n    };\n\n    const getInputLabelledBy = (type: TimeRangeInputType) => {\n        return concatIds(\n            ariaLabelledBy,\n            type === \"start\" ? startLabelId : endLabelId\n        );\n    };\n\n    const getInputDescribedBy = () => {\n        return concatIds(\n            ariaDescribedBy,\n            !error && validationError ? errorId : undefined\n        );\n    };\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleInputFocus = (selector: TimeRangeInputType) => {\n        if (disabled || readOnly) return;\n\n        // Only run onFocus if not already focused\n        if (!activeTimeSelector && !dropdownOpen) onFocus?.();\n\n        setActiveTimeSelector(selector);\n        setDropdownOpen(true);\n    };\n\n    const handleInputClick = (selector: TimeRangeInputType) => {\n        if (disabled || readOnly) return;\n\n        setActiveTimeSelector(selector);\n        setDropdownOpen(true);\n        (selector === \"start\" ? startInputRef : endInputRef).current?.select();\n    };\n\n    function handleKeyDownEvent(event: React.KeyboardEvent<HTMLInputElement>) {\n        switch (event.code) {\n            case \"Enter\":\n                if (activeTimeSelector === \"start\") {\n                    handleStartTime(startTimeVal);\n                } else if (activeTimeSelector === \"end\") {\n                    // Let handleBlur call handleTimeChange instead\n                    if (dropdownOpen) handleEndTime(endTimeVal);\n                    endInputRef.current?.blur();\n                }\n                break;\n            case \"Tab\":\n                handleTimeChange(startTimeVal, endTimeVal, {});\n                break;\n            default:\n                break;\n        }\n    }\n\n    const handleStartTime = (input: string) => {\n        handleTimeChange(input, endTimeVal, { goToNextInput: true });\n    };\n\n    const handleEndTime = (input: string) => {\n        handleTimeChange(startTimeVal, input, { triggerOnBlur: true });\n    };\n\n    const handleTimeChange = (\n        startInput: string,\n        endInput: string,\n        {\n            goToNextInput, // Used by handleStart to move to end input automatically\n            triggerOnBlur, // Used by handleEnd/handleClear to trigger onBlur\n        }: TimeChangeOptions\n    ) => {\n        const start = parseInput(startInput) ?? initialStartTimeVal;\n        const end = parseInput(endInput) ?? initialEndTimeVal;\n\n        setStartTimeVal(start);\n        setEndTimeVal(end);\n\n        const timeValue: TimeRangePickerValue = { start, end };\n\n        // Trigger onChange if values have changed\n        if (start !== initialStartTimeVal || end !== initialEndTimeVal) {\n            onChange?.(timeValue);\n        }\n\n        // Go to end input only if start is a valid time\n        if (goToNextInput && parseInput(startInput) !== undefined) {\n            setActiveTimeSelector(\"end\");\n            endInputRef.current?.select();\n        }\n\n        if (triggerOnBlur) {\n            setActiveTimeSelector(null);\n            setDropdownOpen(false);\n            onBlur?.();\n        }\n\n        setInitialStartTimeVal(start);\n        setInitialEndTimeVal(end);\n    };\n\n    const handleClear = (event: React.MouseEvent) => {\n        event.stopPropagation();\n        setStartTimeVal(\"\");\n        setEndTimeVal(\"\");\n        setInitialStartTimeVal(\"\");\n        setInitialEndTimeVal(\"\");\n\n        const timeValue: TimeRangePickerValue = {\n            start: \"\",\n            end: \"\",\n        };\n\n        onChange?.(timeValue);\n        setActiveTimeSelector(null);\n        setDropdownOpen(false);\n    };\n\n    const handleDismiss = () => {\n        (activeTimeSelector === \"start\"\n            ? startInputRef\n            : endInputRef\n        ).current?.focus();\n        setDropdownOpen(false);\n    };\n\n    const handleBlur = (event: React.FocusEvent<HTMLDivElement, Element>) => {\n        const target = event.relatedTarget as HTMLElement;\n\n        const isFloatingElement =\n            target?.matches?.(\"[data-floating-ui-focusable]\") ||\n            target?.matches?.(\"[data-floating-ui-focus-guard]\");\n        const isInsideNode =\n            nodeRef.current && nodeRef.current.contains(target);\n\n        // Condition when the calendar is closed and focus moved outside the component\n        const shouldBlurWhenClosed =\n            activeTimeSelector &&\n            !dropdownOpen &&\n            !isInsideNode &&\n            !isFloatingElement;\n\n        if (shouldBlurWhenClosed) {\n            handleTimeChange(startTimeVal, endTimeVal, { triggerOnBlur: true });\n        }\n    };\n\n    // NOTE: Dropdown dismissal (esc) does not trigger onClose\n    const handleClose = (reason: OpenChangeReason | undefined) => {\n        if (reason === \"outside-press\") {\n            // No handleTimeChange to avoid duplicate call from handleBlur\n            setActiveTimeSelector(null);\n            setDropdownOpen(false);\n            onBlur?.();\n        } else {\n            // Dropdown closed via exiting component (eg. tab)\n            handleTimeChange(startTimeVal, endTimeVal, { triggerOnBlur: true });\n        }\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderClearButton = () => {\n        if (\n            !readOnly &&\n            !disabled &&\n            (startTimeVal?.length > 0 || endTimeVal?.length > 0)\n        ) {\n            return (\n                <div className={inputWrapperStyles.clearButtonContainer}>\n                    <ClearButton\n                        onClick={handleClear}\n                        type=\"button\"\n                        aria-label=\"Clear\"\n                    />\n                </div>\n            );\n        }\n    };\n\n    const renderDropdown = () => {\n        if (activeTimeSelector === \"start\") {\n            // Prioritise start time value. If non existent, use initial scroll time\n            // If both are non existent, DropdownList will default to first option\n            const startScrollTime =\n                parseInput(startTimeVal) || parsedInitialStartScrollTime;\n\n            return (\n                <DropdownList\n                    listItems={startOptions}\n                    onSelectItem={handleStartTime}\n                    selectedItems={[startTimeVal]}\n                    topScrollItem={TimeHelper.findClosestFlooredTime(\n                        startScrollTime,\n                        startOptions\n                    )}\n                    listboxId={listboxId}\n                    ariaLabel={getDropdownAriaLabel()}\n                    disableItemFocus\n                    matchElementWidth\n                />\n            );\n        } else {\n            const endScrollTime =\n                parseInput(endTimeVal) || parsedInitialEndScrollTime;\n\n            return (\n                <DropdownList\n                    listItems={endOptions}\n                    onSelectItem={handleEndTime}\n                    selectedItems={[endTimeVal]}\n                    topScrollItem={TimeHelper.findClosestFlooredTime(\n                        endScrollTime,\n                        endOptions\n                    )}\n                    listboxId={listboxId}\n                    ariaLabel={getDropdownAriaLabel()}\n                    disableItemFocus\n                    matchElementWidth\n                />\n            );\n        }\n    };\n\n    const renderElement = () => (\n        <InputWrapper\n            ref={nodeRef}\n            disabled={disabled}\n            error={error || !!validationError}\n            readOnly={readOnly}\n            onBlur={handleBlur}\n            role=\"group\"\n            data-testid=\"timepicker-container\"\n            className={styles.timeFieldContainer}\n        >\n            <VisuallyHidden id={startLabelId}>Start time</VisuallyHidden>\n            <VisuallyHidden id={endLabelId}>End time</VisuallyHidden>\n\n            <RangeInputInnerContainer\n                error={error || !!validationError}\n                currentActive={\n                    activeTimeSelector === null ? \"none\" : activeTimeSelector\n                }\n            >\n                {/* From */}\n                <BasicInput\n                    ref={startInputRef}\n                    onFocus={() => handleInputFocus(\"start\")}\n                    placeholder={\n                        activeTimeSelector === \"start\" ? \"hh:mm\" : \"From\"\n                    }\n                    onChange={(e) => setStartTimeVal(e.target.value)}\n                    value={startTimeVal}\n                    readOnly={readOnly}\n                    data-testid={\n                        otherProps[\"data-testid\"]\n                            ? `${otherProps[\"data-testid\"]}-timepicker-selector-start`\n                            : \"timepicker-selector-start\"\n                    }\n                    onClick={() => handleInputClick(\"start\")}\n                    onKeyDown={handleKeyDownEvent}\n                    autoComplete=\"off\"\n                    type=\"text\"\n                    role=\"combobox\"\n                    aria-labelledby={getInputLabelledBy(\"start\")}\n                    aria-describedby={getInputDescribedBy()}\n                    aria-expanded={\n                        dropdownOpen && activeTimeSelector === \"start\"\n                    }\n                    aria-controls={listboxId}\n                    aria-autocomplete=\"list\"\n                    aria-invalid={error || ariaInvalid || !!validationError}\n                    aria-disabled={disabled}\n                    aria-readonly={readOnly}\n                    className={commonStyles.selectorInput}\n                />\n                {/* To */}\n                <BasicInput\n                    ref={endInputRef}\n                    onFocus={() => handleInputFocus(\"end\")}\n                    placeholder={activeTimeSelector === \"end\" ? \"hh:mm\" : \"To\"}\n                    onChange={(e) => setEndTimeVal(e.target.value)}\n                    value={endTimeVal}\n                    readOnly={readOnly}\n                    data-testid={\n                        otherProps[\"data-testid\"]\n                            ? `${otherProps[\"data-testid\"]}-timepicker-selector-end`\n                            : \"timepicker-selector-end\"\n                    }\n                    onClick={() => handleInputClick(\"end\")}\n                    onKeyDown={handleKeyDownEvent}\n                    autoComplete=\"off\"\n                    type=\"text\"\n                    role=\"combobox\"\n                    aria-labelledby={getInputLabelledBy(\"end\")}\n                    aria-describedby={getInputDescribedBy()}\n                    aria-expanded={dropdownOpen && activeTimeSelector === \"end\"}\n                    aria-controls={listboxId}\n                    aria-autocomplete=\"list\"\n                    aria-invalid={\n                        error || ariaInvalid || !!validationError || undefined\n                    }\n                    aria-disabled={disabled || undefined}\n                    aria-readonly={readOnly || undefined}\n                    className={commonStyles.selectorInput}\n                />\n            </RangeInputInnerContainer>\n            {renderClearButton()}\n        </InputWrapper>\n    );\n\n    const renderError = () =>\n        // Only display internal error message if user does not provide one\n        !error &&\n        validationError && (\n            <FormErrorMessage\n                id={errorId}\n                tabIndex={0}\n                data-testid={id ? `${id}-error-message` : \"error-message\"}\n            >\n                {validationError}\n            </FormErrorMessage>\n        );\n\n    return (\n        <div\n            id={id}\n            {...otherProps}\n            className={clsx(commonStyles.wrapper, otherProps.className)}\n        >\n            <DropdownListState>\n                <ElementWithDropdown\n                    enabled={!readOnly && !disabled}\n                    isOpen={dropdownOpen}\n                    renderElement={renderElement}\n                    renderDropdown={renderDropdown}\n                    onClose={handleClose}\n                    onDismiss={handleDismiss}\n                    offset={8}\n                    alignment={alignment}\n                    fitAvailableHeight\n                    customZIndex={dropdownZIndex}\n                    rootNode={dropdownRootNode}\n                />\n            </DropdownListState>\n            {renderError()}\n        </div>\n    );\n};\n"],"names":["_a","id","disabled","error","value","format","readOnly","onChange","onFocus","onBlur","alignment","dropdownZIndex","startLimit","endLimit","initialScrollStartTime","initialScrollEndTime","interval","dropdownRootNode","ariaLabelledBy","ariaDescribedBy","ariaInvalid","otherProps","__rest","internalId","useId","activeTimeSelector","setActiveTimeSelector","useState","dropdownOpen","setDropdownOpen","validationError","setValidationError","startTimeVal","setStartTimeVal","endTimeVal","setEndTimeVal","initialStartTimeVal","setInitialStartTimeVal","initialEndTimeVal","setInitialEndTimeVal","nodeRef","useRef","startInputRef","endInputRef","listboxId","startLabelId","endLabelId","errorId","startOptions","useMemo","TimeHelper","generateTimings","endOptions","flooredStartVal","findClosestFlooredTime","slice","indexOf","parseInput","useCallback","input","parsedInitialStartScrollTime","parsedInitialEndScrollTime","useEffect","start","end","_b","undefined","to24Hour","document","activeElement","current","getDropdownAriaLabel","getInputLabelledBy","type","concatIds","getInputDescribedBy","handleInputFocus","selector","handleInputClick","select","handleKeyDownEvent","event","code","handleStartTime","handleEndTime","blur","handleTimeChange","goToNextInput","triggerOnBlur","startInput","endInput","_c","handleClear","stopPropagation","handleBlur","target","relatedTarget","isFloatingElement","matches","call","isInsideNode","contains","renderClearButton","length","_jsx","className","inputWrapperStyles.clearButtonContainer","children","ClearButton","onClick","_jsxs","Object","assign","clsx","commonStyles.wrapper","DropdownListState","ElementWithDropdown","enabled","isOpen","renderElement","InputWrapper","ref","role","styles.timeFieldContainer","VisuallyHidden","RangeInputInnerContainer","currentActive","BasicInput","placeholder","e","onKeyDown","autoComplete","commonStyles.selectorInput","renderDropdown","startScrollTime","DropdownList","listItems","onSelectItem","selectedItems","topScrollItem","ariaLabel","disableItemFocus","matchElementWidth","endScrollTime","onClose","reason","onDismiss","focus","offset","fitAvailableHeight","customZIndex","rootNode","FormErrorMessage","tabIndex"],"mappings":"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"}

package/cjs/time-range-picker/combobox-picker/combobox-picker.styles.js

@@ -1,7 +1,2 @@
-"use strict";var e=require("styled-components"),r=require("../../shared/input-wrapper/input-wrapper.js"),i=require("../../v3_theme/index.js");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const n=t(e).default(r.InputWrapper)`
-    height: 3rem;
-    gap: ${i.V3_Spacing["spacing-8"]};
-    // space for clear icon
-    padding-right: calc(1.25rem + ${i.V3_Spacing["spacing-20"]});
-`;exports.TimeFieldContainer=n;
+"use strict";require("./combobox-picker.styles_7i9vso.css");exports.timeFieldContainer="t1wpl53s";
 //# sourceMappingURL=combobox-picker.styles.js.map

package/cjs/time-range-picker/combobox-picker/combobox-picker.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"combobox-picker.styles.js","sources":["../../../../src/time-range-picker/combobox-picker/combobox-picker.styles.tsx"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { InputWrapper } from \"../../shared/input-wrapper\";\nimport { V3_Spacing } from \"../../v3_theme\";\n\n// =============================================================================\n// STYLING\n// =============================================================================\nexport const TimeFieldContainer = styled(InputWrapper)`\n    height: 3rem;\n    gap: ${V3_Spacing[\"spacing-8\"]};\n    // space for clear icon\n    padding-right: calc(1.25rem + ${V3_Spacing[\"spacing-20\"]});\n`;\n"],"names":["TimeFieldContainer","styled","InputWrapper","V3_Spacing"],"mappings":"4NAQaA,OAAqBC,QAAOC,EAAAA,aAAa;;WAE3CC,EAAAA,WAAW;;oCAEcA,EAAAA,WAAW;"}
+{"version":3,"file":"combobox-picker.styles.js","sources":["../../../../src/time-range-picker/combobox-picker/combobox-picker.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Spacing } from \"../../theme\";\n\n// =============================================================================\n// STYLING\n// =============================================================================\nexport const timeFieldContainer = css`\n    height: 3rem;\n    gap: ${Spacing[\"spacing-8\"]};\n    /* space for clear icon */\n    padding-right: calc(1.25rem + ${Spacing[\"spacing-20\"]});\n`;\n"],"names":[],"mappings":"wIAO+B"}

package/cjs/time-range-picker/combobox-picker/combobox-picker.styles_7i9vso.css

@@ -0,0 +1 @@
+.t1wpl53s{height:3rem;gap:var(--fds-spacing-8);padding-right:calc(1.25rem + var(--fds-spacing-20));}

package/cjs/time-range-picker/common.styles.js

@@ -1,11 +1,2 @@
-"use strict";var e=require("styled-components"),t=require("../shared/input-wrapper/input-wrapper.js"),r=require("../v3_theme/index.js");function p(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=p(e);const a=i.default.div`
-    position: relative;
-`,n=i.default(t.InputWrapper)`
-    height: 3rem;
-    gap: ${r.V3_Spacing["spacing-8"]};
-`,u=i.default(t.BasicInput)`
-    display: block;
-    width: 100%;
-    flex: 1;
-`;exports.SelectorInput=u,exports.TimeContainer=n,exports.Wrapper=a;
+"use strict";require("./common.styles_1qwp4xa.css");exports.selectorInput="svbkfs2",exports.timeContainer="t102z5ub",exports.wrapper="wfddsjt";
 //# sourceMappingURL=common.styles.js.map

package/cjs/time-range-picker/common.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"common.styles.js","sources":["../../../src/time-range-picker/common.styles.tsx"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { BasicInput, InputWrapper } from \"../shared/input-wrapper\";\nimport { V3_Spacing } from \"../v3_theme\";\n\n// =============================================================================\n// STYLING\n// =============================================================================\nexport const Wrapper = styled.div`\n    position: relative;\n`;\n\nexport const TimeContainer = styled(InputWrapper)`\n    height: 3rem;\n    gap: ${V3_Spacing[\"spacing-8\"]};\n`;\n\nexport const SelectorInput = styled(BasicInput)`\n    display: block;\n    width: 100%;\n    flex: 1;\n`;\n"],"names":["Wrapper","styled","div","TimeContainer","InputWrapper","V3_Spacing","SelectorInput","BasicInput"],"mappings":"2NAQO,MAAMA,EAAUC,EAAAA,QAAOC,GAAG;;EAIpBC,EAAgBF,EAAAA,QAAOG,EAAAA,aAAa;;WAEtCC,EAAAA,WAAW;EAGTC,EAAgBL,EAAAA,QAAOM,EAAAA,WAAW;;;;"}
+{"version":3,"file":"common.styles.js","sources":["../../../src/time-range-picker/common.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Spacing } from \"../theme\";\n\n// =============================================================================\n// STYLING\n// =============================================================================\nexport const wrapper = css`\n    position: relative;\n`;\n\nexport const timeContainer = css`\n    height: 3rem;\n    gap: ${Spacing[\"spacing-8\"]};\n`;\n\nexport const selectorInput = css`\n    display: block;\n    width: 100%;\n    flex: 1;\n`;\n"],"names":[],"mappings":"2GAgB0B,gCALA,2BAJN"}

package/cjs/time-range-picker/common.styles_1qwp4xa.css

@@ -0,0 +1,3 @@
+.wfddsjt{position:relative;}
+.t102z5ub{height:3rem;gap:var(--fds-spacing-8);}
+.svbkfs2{display:block;width:100%;-webkit-flex:1;-ms-flex:1;flex:1;}

package/cjs/time-range-picker/dial-picker/dial-picker.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../../_virtual/_tslib.js"),r=require("react/jsx-runtime"),a=require("react"),i=require("../../shared/accessibility/index.js"),t=require("../../shared/dropdown-wrapper/element-with-dropdown.js"),n=require("../../shared/range-input-inner-container/range-input-inner-container.js"),o=require("../../shared/timepicker-dropdown/timepicker-dropdown.js");require("../../util/calendar-helper.js"),require("../../external/dayjs/dayjs.min.js");var l=require("../../util/simple-id-generator.js");require("../../util/string-helper.js"),require("@react-aria/live-announcer");var d=require("../../util/time-helper.js"),s=require("../common.styles.js");exports.DialPicker=u=>{var{id:c,disabled:p=!1,error:m,value:v,format:b="24hr",readOnly:g,onChange:f,onFocus:j,onBlur:h,alignment:y="left",dropdownZIndex:x,dropdownRootNode:k,"aria-labelledby":w,"aria-describedby":q,"aria-invalid":F}=u,C=e.__rest(u,["id","disabled","error","value","format","readOnly","onChange","onFocus","onBlur","alignment","dropdownZIndex","dropdownRootNode","aria-labelledby","aria-describedby","aria-invalid"]);const[I,S]=a.useState(!1),[T,D]=a.useState("none"),[O,$]=a.useState(""),[R,B]=a.useState(""),[E,_]=a.useState(!1),N=!g&&!p,Z=a.useRef(null),H=l.useId(),P=`${H}-start-label`,V=`${H}-end-label`,W=e=>i.concatIds(w,"start"===e?P:V),A=()=>i.concatIds(q);a.useEffect((()=>{v&&($(v.start),B(v.end))}),[v]);const z=e=>{N&&(E||I||null==j||j(),_(!0),D(e),S(!0))},G=e=>{var r,a;const i=!!(null==e?void 0:e.keepFocus),t=null!==(r=null==e?void 0:e.triggerBlur)&&void 0!==r?r:!i;S(!1),D("none"),_(i),t&&(null==h||h()),i&&(null===(a=Z.current)||void 0===a||a.focus())},J=e=>{var r,a,i;if(!E||I)return;const t=e.relatedTarget,n=(null===(r=null==t?void 0:t.matches)||void 0===r?void 0:r.call(t,"[data-floating-ui-focusable]"))||(null===(a=null==t?void 0:t.matches)||void 0===a?void 0:a.call(t,"[data-floating-ui-focus-guard]"));!(!t||!(null===(i=Z.current)||void 0===i?void 0:i.contains(t)))||n||(_(!1),null==h||h())},K=e=>{$(e),null==f||f({start:e,end:R}),D("end"),S(!0),_(!0)},L=e=>{B(e),null==f||f({start:O,end:e}),""===O?(D("start"),S(!0),_(!0)):G({keepFocus:!0})};return r.jsx(s.Wrapper,Object.assign({id:c},C,{children:r.jsx(t.ElementWithDropdown,{enabled:N,isOpen:I,renderElement:()=>r.jsx(s.TimeContainer,{ref:Z,tabIndex:-1,onBlur:J,"data-testid":"timepicker-container",role:"group",disabled:p,error:m,readOnly:g,focused:E,children:r.jsxs(n.RangeInputInnerContainer,{error:m,currentActive:T,children:[r.jsx(s.SelectorInput,{onFocus:()=>z("start"),onClick:()=>z("start"),readOnly:!0,placeholder:"From",value:d.TimeHelper.formatDisplayValue(O,b),"data-testid":C["data-testid"]?`${C["data-testid"]}-timepicker-selector-from`:"timepicker-selector-from",role:"combobox","aria-expanded":!p&&!g&&I,"aria-invalid":m||F,"aria-disabled":p,"aria-readonly":g,"aria-labelledby":W("start"),"aria-describedby":A()}),r.jsx(s.SelectorInput,{onClick:()=>z("end"),readOnly:!0,placeholder:"To",value:d.TimeHelper.formatDisplayValue(R,b),"data-testid":C["data-testid"]?`${C["data-testid"]}-timepicker-selector-to`:"timepicker-selector-to",role:"combobox","aria-expanded":!p&&!g&&I,"aria-invalid":m||F||void 0,"aria-disabled":p||void 0,"aria-readonly":g||void 0,"aria-labelledby":W("end"),"aria-describedby":A()})]})}),renderDropdown:({styles:e,setFloatingRef:a,getFloatingProps:i})=>I?r.jsxs("div",Object.assign({ref:a,style:e,role:"dialog","aria-label":"start"===T?"Selecting for: Start time":"end"===T?"Selecting for: End time":void 0},i(),{children:["start"===T&&r.jsx(o.TimepickerDropdown,{id:c?`${c}-start`:void 0,show:!0,value:O,format:b,onCancel:()=>G({keepFocus:!0}),onChange:K}),"end"===T&&r.jsx(o.TimepickerDropdown,{id:c?`${c}-end`:void 0,show:!0,value:R,format:b,onCancel:()=>G({keepFocus:!1}),onChange:L})]}),T):null,onClose:()=>G({keepFocus:!1}),onDismiss:()=>G({keepFocus:!0}),clickToToggle:!1,offset:8,alignment:y,customZIndex:x,rootNode:k})}))};
+"use strict";var e=require("../../_virtual/_tslib.js"),r=require("react/jsx-runtime"),a=require("clsx"),i=require("react"),t=require("../../shared/accessibility/index.js"),n=require("../../shared/dropdown-wrapper/element-with-dropdown.js"),l=require("../../shared/input-wrapper/input-wrapper.js"),o=require("../../shared/range-input-inner-container/range-input-inner-container.js"),d=require("../../shared/timepicker-dropdown/timepicker-dropdown.js");require("../../util/calendar-helper.js"),require("../../external/dayjs/dayjs.min.js");var s=require("../../util/simple-id-generator.js");require("../../util/string-helper.js"),require("@react-aria/live-announcer");var u=require("../../util/time-helper.js"),c=require("../common.styles.js");function p(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var m=p(a);exports.DialPicker=a=>{var{id:p,disabled:v=!1,error:b,value:f,format:g="24hr",readOnly:j,onChange:h,onFocus:y,onBlur:x,alignment:k="left",dropdownZIndex:w,dropdownRootNode:q,"aria-labelledby":I,"aria-describedby":F,"aria-invalid":C}=a,D=e.__rest(a,["id","disabled","error","value","format","readOnly","onChange","onFocus","onBlur","alignment","dropdownZIndex","dropdownRootNode","aria-labelledby","aria-describedby","aria-invalid"]);const[N,O]=i.useState(!1),[S,T]=i.useState("none"),[B,$]=i.useState(""),[R,E]=i.useState(""),[_,Z]=i.useState(!1),H=!j&&!v,P=i.useRef(null),V=s.useId(),W=`${V}-start-label`,A=`${V}-end-label`,z=e=>t.concatIds(I,"start"===e?W:A),G=()=>t.concatIds(F);i.useEffect((()=>{f&&($(f.start),E(f.end))}),[f]);const J=e=>{H&&(_||N||null==y||y(),Z(!0),T(e),O(!0))},K=e=>{var r,a;const i=!!(null==e?void 0:e.keepFocus),t=null!==(r=null==e?void 0:e.triggerBlur)&&void 0!==r?r:!i;O(!1),T("none"),Z(i),t&&(null==x||x()),i&&(null===(a=P.current)||void 0===a||a.focus())},L=e=>{var r,a,i;if(!_||N)return;const t=e.relatedTarget,n=(null===(r=null==t?void 0:t.matches)||void 0===r?void 0:r.call(t,"[data-floating-ui-focusable]"))||(null===(a=null==t?void 0:t.matches)||void 0===a?void 0:a.call(t,"[data-floating-ui-focus-guard]"));!(!t||!(null===(i=P.current)||void 0===i?void 0:i.contains(t)))||n||(Z(!1),null==x||x())},M=e=>{$(e),null==h||h({start:e,end:R}),T("end"),O(!0),Z(!0)},Q=e=>{E(e),null==h||h({start:B,end:e}),""===B?(T("start"),O(!0),Z(!0)):K({keepFocus:!0})};return r.jsx("div",Object.assign({id:p},D,{className:m.default(c.wrapper,D.className),children:r.jsx(n.ElementWithDropdown,{enabled:H,isOpen:N,renderElement:()=>r.jsx(l.InputWrapper,{ref:P,tabIndex:-1,onBlur:L,"data-testid":"timepicker-container",role:"group",disabled:v,error:b,readOnly:j,focused:_,className:c.timeContainer,children:r.jsxs(o.RangeInputInnerContainer,{error:b,currentActive:S,children:[r.jsx(l.BasicInput,{onFocus:()=>J("start"),onClick:()=>J("start"),readOnly:!0,placeholder:"From",value:u.TimeHelper.formatDisplayValue(B,g),"data-testid":D["data-testid"]?`${D["data-testid"]}-timepicker-selector-from`:"timepicker-selector-from",role:"combobox","aria-expanded":!v&&!j&&N,"aria-invalid":b||C,"aria-disabled":v,"aria-readonly":j,"aria-labelledby":z("start"),"aria-describedby":G(),className:c.selectorInput}),r.jsx(l.BasicInput,{onClick:()=>J("end"),readOnly:!0,placeholder:"To",value:u.TimeHelper.formatDisplayValue(R,g),"data-testid":D["data-testid"]?`${D["data-testid"]}-timepicker-selector-to`:"timepicker-selector-to",role:"combobox","aria-expanded":!v&&!j&&N,"aria-invalid":b||C||void 0,"aria-disabled":v||void 0,"aria-readonly":j||void 0,"aria-labelledby":z("end"),"aria-describedby":G(),className:c.selectorInput})]})}),renderDropdown:({styles:e,setFloatingRef:a,getFloatingProps:i})=>N?r.jsxs("div",Object.assign({ref:a,style:e,role:"dialog","aria-label":"start"===S?"Selecting for: Start time":"end"===S?"Selecting for: End time":void 0},i(),{children:["start"===S&&r.jsx(d.TimepickerDropdown,{id:p?`${p}-start`:void 0,show:!0,value:B,format:g,onCancel:()=>K({keepFocus:!0}),onChange:M}),"end"===S&&r.jsx(d.TimepickerDropdown,{id:p?`${p}-end`:void 0,show:!0,value:R,format:g,onCancel:()=>K({keepFocus:!1}),onChange:Q})]}),S):null,onClose:()=>K({keepFocus:!1}),onDismiss:()=>K({keepFocus:!0}),clickToToggle:!1,offset:8,alignment:k,customZIndex:w,rootNode:q})}))};
 //# sourceMappingURL=dial-picker.js.map