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

package/shared/input-wrapper/input-wrapper.styles_je6maw.css

@@ -0,0 +1,14 @@
+.i156rlh{border:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);border-radius:var(--fds-radius-sm);background:var(--fds-colour-bg);}.i156rlh:focus-within,.i156rlh[data-focused="true"]{outline-offset:-1px;outline:var(--fds-border-width-020) var(--fds-border-style-solid) var(--fds-colour-border-focus);}
+.irl4gvd{border-color:transparent;padding:0;background:transparent!important;}.irl4gvd:focus-within,.irl4gvd[data-focused="true"]{outline-color:var(--fds-colour-border-focus);}
+.iwp8knk{background:var(--fds-colour-bg-disabled);cursor:not-allowed;}.iwp8knk:focus-within,.iwp8knk[data-focused="true"]{outline-color:var(--fds-colour-border-disabled);}
+.i1ec8vtj{border-color:var(--fds-colour-border-error);}.i1ec8vtj:focus-within,.i1ec8vtj[data-focused="true"]{outline-color:var(--fds-colour-border-error-focus);}
+.ijzjlan{border-color:transparent;background:transparent;}.ijzjlan:focus-within,.ijzjlan[data-focused="true"]{outline:none;}
+.i2dsxxh{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:relative;height:-webkit-max-content;height:-moz-max-content;height:max-content;width:100%;padding:0 var(--fds-spacing-16) 0 var(--fds-spacing-16);}
+.i1mziqol{padding-left:0;}
+.iyqh66s{-webkit-flex-direction:row-reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;}
+.b168rpxy{font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-baseline);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-baseline);letter-spacing:var(--fds-font-body-ls-baseline);color:var(--fds-colour-text);display:block;background:transparent;border:none;outline:none;box-shadow:none;padding:0;margin:0;--webkit-appearance:none;--moz-appearance:textfield;}.b168rpxy:disabled{color:var(--fds-colour-text-subtler);}.b168rpxy:disabled:hover{cursor:not-allowed;}.b168rpxy::-webkit-input-placeholder{color:var(--fds-colour-text-subtler);}.b168rpxy::-webkit-outer-spin-button,.b168rpxy::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}.b168rpxy::-webkit-input-placeholder{color:var(--fds-colour-text-subtler);}.b168rpxy::-moz-placeholder{color:var(--fds-colour-text-subtler);}.b168rpxy:-ms-input-placeholder{color:var(--fds-colour-text-subtler);}.b168rpxy::placeholder{color:var(--fds-colour-text-subtler);}
+.b1df0tus{font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-md);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-md);letter-spacing:var(--fds-font-body-ls-md);}
+.b191fi5o{background:transparent;border:none;outline:none;}.b191fi5o:focus,.b191fi5o:active{outline:none;}.b191fi5o:focus-visible{outline:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border-focus);border-radius:var(--fds-radius-sm);}
+.c179s2uy{background:transparent;border:none;outline:none;height:auto;padding:var(--fds-spacing-12) var(--fds-spacing-16);margin:calc(var(--fds-spacing-12) * -1) calc(var(--fds-spacing-16) * -1);cursor:pointer;color:var(--fds-colour-icon);}.c179s2uy:focus,.c179s2uy:active{outline:none;}.c179s2uy:focus-visible{outline:2px solid var(--fds-colour-border-focus);border-radius:var(--fds-radius-sm);}
+.c1buolhy{height:1.25rem;width:1.25rem;vertical-align:middle;}
+.ccmyj2w{position:absolute;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;right:var(--fds-spacing-16);}

package/shared/internal-calendar/calendar-dropdown.js

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import t,{useRef as r}from"react";import"../../theme/theme-provider/index.js";import"../../theme/theme-provider/context.js";import"../../theme/tokens/border.js";import"../../theme/tokens/colour.js";import"../../theme/tokens/font.js";import"../../theme/tokens/media-query.js";import{useApplyStyle as o}from"../../theme/utils/use-apply-styles.js";import"../../util/calendar-helper.js";import"../../external/dayjs/dayjs.min.js";import{mergeRefs as i}from"../../util/merge-refs.js";import"../../util/simple-id-generator.js";import"../../util/string-helper.js";import"@react-aria/live-announcer";import{useDropdownRender as s}from"../dropdown-wrapper/element-with-dropdown.js";import{tokens as m,calendarWrapper as n}from"./calendar-dropdown.styles.js";import{InternalCalendar as p}from"./internal-calendar.js";const a=t.forwardRef(((t,a)=>{const{elementWidth:l,setFloatingRef:d,getFloatingProps:j,styles:c}=s(),h=r(null);return o(h,Object.assign({[m.width]:`${l}px`},c)),e("div",Object.assign({className:n,"data-testid":"calendar-dropdown",ref:i(d,h)},j(),{children:e(p,Object.assign({ref:a},t))}))}));export{a as CalendarDropdown};
+import{jsx as e}from"react/jsx-runtime";import t,{useRef as r}from"react";import"../../theme/theme-provider/index.js";import"../../theme/theme-provider/context.js";import"../../theme/tokens/border.js";import"../../theme/tokens/colour.js";import"../../theme/tokens/font.js";import"../../theme/tokens/media-query.js";import{useApplyStyle as o}from"../../theme/utils/use-apply-styles.js";import"../../theme/utils/use-media-query.js";import"../../util/calendar-helper.js";import"../../external/dayjs/dayjs.min.js";import{mergeRefs as i}from"../../util/merge-refs.js";import"../../util/simple-id-generator.js";import"../../util/string-helper.js";import"@react-aria/live-announcer";import{useDropdownRender as s}from"../dropdown-wrapper/element-with-dropdown.js";import{tokens as m,calendarWrapper as n}from"./calendar-dropdown.styles.js";import{InternalCalendar as p}from"./internal-calendar.js";const a=t.forwardRef(((t,a)=>{const{elementWidth:l,setFloatingRef:d,getFloatingProps:j,styles:c}=s(),h=r(null);return o(h,Object.assign({[m.width]:`${l}px`},c)),e("div",Object.assign({className:n,"data-testid":"calendar-dropdown",ref:i(d,h)},j(),{children:e(p,Object.assign({ref:a},t))}))}));export{a as CalendarDropdown};
 //# sourceMappingURL=calendar-dropdown.js.map

package/shared/internal-calendar/calendar-dropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"calendar-dropdown.js","sources":["../../../src/shared/internal-calendar/calendar-dropdown.tsx"],"sourcesContent":["import React, { useRef } from \"react\";\n\nimport { useApplyStyle } from \"../../theme\";\nimport { mergeRefs } from \"../../util\";\nimport { useDropdownRender } from \"../dropdown-wrapper\";\nimport * as styles from \"./calendar-dropdown.styles\";\nimport { InternalCalendar } from \"./internal-calendar\";\nimport type { CalendarDropdownProps, InternalCalendarRef } from \"./types\";\n\nconst Component = (\n    props: CalendarDropdownProps,\n    ref: React.ForwardedRef<InternalCalendarRef>\n) => {\n    const {\n        elementWidth,\n        setFloatingRef,\n        getFloatingProps,\n        styles: positioningStyles,\n    } = useDropdownRender();\n\n    const wrapperRef = useRef<HTMLDivElement>(null);\n\n    useApplyStyle(wrapperRef, {\n        [styles.tokens.width]: `${elementWidth}px`,\n        ...positioningStyles,\n    });\n\n    return (\n        <div\n            className={styles.calendarWrapper}\n            data-testid=\"calendar-dropdown\"\n            ref={mergeRefs(setFloatingRef, wrapperRef)}\n            {...getFloatingProps()}\n        >\n            <InternalCalendar ref={ref} {...props} />\n        </div>\n    );\n};\n\nexport const CalendarDropdown = React.forwardRef(Component);\n"],"names":["CalendarDropdown","React","forwardRef","props","ref","elementWidth","setFloatingRef","getFloatingProps","styles","positioningStyles","useDropdownRender","wrapperRef","useRef","useApplyStyle","Object","assign","styles.tokens","width","_jsx","className","styles.calendarWrapper","mergeRefs","children","InternalCalendar"],"mappings":"80BASA,MA8BaA,EAAmBC,EAAMC,YA9BpB,CACdC,EACAC,KAEA,MAAMC,aACFA,EAAYC,eACZA,EAAcC,iBACdA,EACAC,OAAQC,GACRC,IAEEC,EAAaC,EAAuB,MAO1C,OALAC,EAAcF,EAAUG,OAAAC,OAAA,CACpB,CAACC,EAAcC,OAAQ,GAAGZ,OACvBI,IAIHS,EAAA,MAAAJ,OAAAC,OAAA,CACII,UAAWC,EAAsB,cACrB,oBACZhB,IAAKiB,EAAUf,EAAgBK,IAC3BJ,IAAkB,CAAAe,SAEtBJ,EAACK,EAAgBT,OAAAC,OAAA,CAACX,IAAKA,GAASD,MAC9B"}
+{"version":3,"file":"calendar-dropdown.js","sources":["../../../src/shared/internal-calendar/calendar-dropdown.tsx"],"sourcesContent":["import React, { useRef } from \"react\";\n\nimport { useApplyStyle } from \"../../theme\";\nimport { mergeRefs } from \"../../util\";\nimport { useDropdownRender } from \"../dropdown-wrapper\";\nimport * as styles from \"./calendar-dropdown.styles\";\nimport { InternalCalendar } from \"./internal-calendar\";\nimport type { CalendarDropdownProps, InternalCalendarRef } from \"./types\";\n\nconst Component = (\n    props: CalendarDropdownProps,\n    ref: React.ForwardedRef<InternalCalendarRef>\n) => {\n    const {\n        elementWidth,\n        setFloatingRef,\n        getFloatingProps,\n        styles: positioningStyles,\n    } = useDropdownRender();\n\n    const wrapperRef = useRef<HTMLDivElement>(null);\n\n    useApplyStyle(wrapperRef, {\n        [styles.tokens.width]: `${elementWidth}px`,\n        ...positioningStyles,\n    });\n\n    return (\n        <div\n            className={styles.calendarWrapper}\n            data-testid=\"calendar-dropdown\"\n            ref={mergeRefs(setFloatingRef, wrapperRef)}\n            {...getFloatingProps()}\n        >\n            <InternalCalendar ref={ref} {...props} />\n        </div>\n    );\n};\n\nexport const CalendarDropdown = React.forwardRef(Component);\n"],"names":["CalendarDropdown","React","forwardRef","props","ref","elementWidth","setFloatingRef","getFloatingProps","styles","positioningStyles","useDropdownRender","wrapperRef","useRef","useApplyStyle","Object","assign","styles.tokens","width","_jsx","className","styles.calendarWrapper","mergeRefs","children","InternalCalendar"],"mappings":"23BASA,MA8BaA,EAAmBC,EAAMC,YA9BpB,CACdC,EACAC,KAEA,MAAMC,aACFA,EAAYC,eACZA,EAAcC,iBACdA,EACAC,OAAQC,GACRC,IAEEC,EAAaC,EAAuB,MAO1C,OALAC,EAAcF,EAAUG,OAAAC,OAAA,CACpB,CAACC,EAAcC,OAAQ,GAAGZ,OACvBI,IAIHS,EAAA,MAAAJ,OAAAC,OAAA,CACII,UAAWC,EAAsB,cACrB,oBACZhB,IAAKiB,EAAUf,EAAgBK,IAC3BJ,IAAkB,CAAAe,SAEtBJ,EAACK,EAAgBT,OAAAC,OAAA,CAACX,IAAKA,GAASD,MAC9B"}

package/shared/internal-calendar/calendar-manager.styles.js

@@ -1,2 +1,2 @@
-import"./calendar-manager.styles_1q13ylk.css";const a="idyldum",d="islfrvo",e="i9mhzaa",h="c1pjct36",n="tnbj4wx",s="d1wdaxlf",c="o9us63x",l="h1vuzb9k",r="hwdoiu6",t="d11dpfam",i="d14qnn0y",m="h6pztie",o="h1g80qmc",p="h1eddcvs",q="ah8v88g",u="am01jhq";export{u as actionButton,q as actionButtonSection,h as container,s as defaultView,t as dropdownButton,i as dropdownText,l as header,o as headerArrowButton,m as headerArrows,r as headerInputDropdown,p as hidden,a as icon,d as iconChevronDown,e as iconChevronDownExpanded,c as optionsOverlay,n as toggleZone};
+import"./calendar-manager.styles_1iuq5zw.css";const a="idyldum",d="islfrvo",e="i9mhzaa",h="c1pjct36",n="tnbj4wx",s="d1wdaxlf",c="o9us63x",i="h1vuzb9k",r="hwdoiu6",t="d11dpfam",l="d14qnn0y",m="h6pztie",o="h1g80qmc",p="h1eddcvs",u="ah8v88g",q="am01jhq";export{q as actionButton,u as actionButtonSection,h as container,s as defaultView,t as dropdownButton,l as dropdownText,i as header,o as headerArrowButton,m as headerArrows,r as headerInputDropdown,p as hidden,a as icon,d as iconChevronDown,e as iconChevronDownExpanded,c as optionsOverlay,n as toggleZone};
 //# sourceMappingURL=calendar-manager.styles.js.map

package/shared/internal-calendar/calendar-manager.styles_1iuq5zw.css

@@ -0,0 +1,22 @@
+.idyldum{color:var(--fds-colour-icon);height:1rem;width:1rem;}
+.islfrvo{-webkit-transition:-webkit-transform 250ms ease-in-out;transition:transform 250ms ease-in-out;margin-left:0.5rem;}
+.i9mhzaa{-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg);}
+.c1pjct36{position:relative;width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;padding-top:var(--fds-internal-calendarDropdown-verticalInset);padding-bottom:var(--fds-internal-calendarDropdown-verticalInset);}
+.tnbj4wx{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex:1;-ms-flex:1;flex:1;position:relative;}
+.d1wdaxlf{isolation:isolate;width:100%;padding-left:var(--fds-internal-calendarDropdown-horizontalInset);padding-right:var(--fds-internal-calendarDropdown-horizontalInset);}
+.o9us63x{position:absolute;top:0;left:0;height:100%;width:100%;background:var(--fds-colour-bg);padding-left:var(--fds-internal-calendarDropdown-horizontalInset);padding-right:var(--fds-internal-calendarDropdown-horizontalInset);}
+.h1vuzb9k{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;padding-left:var(
+        --fds-internal-calendarDropdown-horizontalInset,
+        var(--fds-internal-calendarDropdown-horizontalInset)
+    );padding-right:var(
+        --fds-internal-calendarDropdown-horizontalInset,
+        var(--fds-internal-calendarDropdown-horizontalInset)
+    );padding-bottom:var(--fds-internal-calendarDropdown-headerBottomSpacing);}
+.hwdoiu6{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}
+.d11dpfam{border:none;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:0.5rem;background:transparent;cursor:pointer;}
+.d14qnn0y{font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-md);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-md);letter-spacing:var(--fds-font-body-ls-md);color:var(--fds-colour-text);}
+.h6pztie{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}
+.h1g80qmc{margin:auto 0;padding:0.75rem;}.h1g80qmc:disabled{cursor:not-allowed;}
+.h1eddcvs{display:none;}
+.ah8v88g{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:0.5rem;margin-top:1.5rem;padding-left:var(--fds-internal-calendarDropdown-horizontalInset);padding-right:var(--fds-internal-calendarDropdown-horizontalInset);}
+.am01jhq{-webkit-flex:1;-ms-flex:1;flex:1;}

package/shared/internal-calendar/day-cell/day-cell.styles.js

@@ -1,2 +1,2 @@
-import{Border as e}from"../../../theme/tokens/border.js";import{Colour as r}from"../../../theme/tokens/colour.js";import"../../../theme/tokens/font.js";import"../../../theme/tokens/media-query.js";import{Motion as o}from"../../../theme/tokens/motion.js";import{Radius as t}from"../../../theme/tokens/radius.js";import"./day-cell.styles_vazxvn.css";const s="cgev3fe";o["duration-150"],o["ease-default"],e["width-010"],e.solid,r["bg-hover"],r["bg-hover"],r["bg-hover"],r["bg-hover-strong"],r["bg-hover-strong"],r["bg-hover-strong"],r["bg-hover-subtle"],r["border-hover"],r["border-hover"],r["bg-selected"],r["border-selected"],r["border-selected"],r["bg-selected"],r["border-selected-subtle"],r["border-selected-subtle"],r["bg-selected-hover"],r["bg-selected-hover"],r["border-selected-hover"],r["border-selected-hover"];const d="l1vee93p",b="ri6o55u";o["duration-150"],o["ease-default"],e["width-010"],e.solid,t.md,r["bg-hover"],r["bg-hover"],r["bg-hover-strong"],r["bg-hover-strong"],r["bg-hover-subtle"],r["border-hover"],r["bg-selected"],r["border-selected"],r["bg-selected"],r["border-selected-subtle"],r["bg-selected-hover"],r["bg-selected-hover"],r["border-selected-hover"];const l="lyjz5wx",h="r1l3qdei",c="lxr1b4f",g="lm3qs71",v="i8ea7e7";export{s as cell,v as indicator,g as label,c as labelWrapper,l as leftCircle,d as leftHalf,h as rightCircle,b as rightHalf};
+import{Border as e}from"../../../theme/tokens/border.js";import{Colour as r}from"../../../theme/tokens/colour.js";import"../../../theme/tokens/font.js";import"../../../theme/tokens/media-query.js";import{Motion as o}from"../../../theme/tokens/motion.js";import{Radius as t}from"../../../theme/tokens/radius.js";import"./day-cell.styles_1t5oqc1.css";const s="cgev3fe";o["duration-150"],o["ease-default"],e["width-010"],e.solid,r["bg-hover"],r["bg-hover"],r["bg-hover"],r["bg-hover-strong"],r["bg-hover-strong"],r["bg-hover-strong"],r["bg-hover-subtle"],r["border-hover"],r["border-hover"],r["bg-selected"],r["border-selected"],r["border-selected"],r["bg-selected"],r["border-selected-subtle"],r["border-selected-subtle"],r["bg-selected-hover"],r["bg-selected-hover"],r["border-selected-hover"],r["border-selected-hover"];const d="l1vee93p",b="ri6o55u";o["duration-150"],o["ease-default"],e["width-010"],e.solid,t.md,r["bg-hover"],r["bg-hover"],r["bg-hover-strong"],r["bg-hover-strong"],r["bg-hover-subtle"],r["border-hover"],r["bg-selected"],r["border-selected"],r["bg-selected"],r["border-selected-subtle"],r["bg-selected-hover"],r["bg-selected-hover"],r["border-selected-hover"];const l="lyjz5wx",h="r1l3qdei",c="lxr1b4f",g="lm3qs71",v="i8ea7e7";export{s as cell,v as indicator,g as label,c as labelWrapper,l as leftCircle,d as leftHalf,h as rightCircle,b as rightHalf};
 //# sourceMappingURL=day-cell.styles.js.map

package/shared/internal-calendar/day-cell/day-cell.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"day-cell.styles.js","sources":["../../../../src/shared/internal-calendar/day-cell/day-cell.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, Colour, Font, Motion, Radius } from \"../../../theme/tokens\";\n\nexport const cell = css`\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    position: relative;\n    width: 100%;\n    height: 2.5rem;\n`;\n\nexport const half = `\n    position: absolute;\n    height: 2.5rem;\n    width: 50%;\n    transition: ${Motion[\"duration-150\"]} ${Motion[\"ease-default\"]};\n    border: ${Border[\"width-010\"]} ${Border[\"solid\"]} transparent;\n    border-left: none;\n    border-right: none;\n    background-clip: border-box;\n\n    &[data-day-cell-type=\"hover-subtle\"] {\n        background-color: ${Colour[\"bg-hover\"]};\n        border-top-color: ${Colour[\"bg-hover\"]};\n        border-bottom-color: ${Colour[\"bg-hover\"]};\n    }\n\n    &[data-day-cell-type=\"hover\"] {\n        background-color: ${Colour[\"bg-hover-strong\"]};\n        border-top-color: ${Colour[\"bg-hover-strong\"]};\n        border-bottom-color: ${Colour[\"bg-hover-strong\"]};\n    }\n\n    &[data-day-cell-type=\"hover-outline\"] {\n        background-color: ${Colour[\"bg-hover-subtle\"]};\n        border-top-color: ${Colour[\"border-hover\"]};\n        border-bottom-color: ${Colour[\"border-hover\"]};\n    }\n\n    &[data-day-cell-type=\"selected-outline\"] {\n        background-color: ${Colour[\"bg-selected\"]};\n        border-top-color: ${Colour[\"border-selected\"]};\n        border-bottom-color: ${Colour[\"border-selected\"]};\n    }\n\n    &[data-day-cell-type=\"selected-outline-subtle\"] {\n        background-color: ${Colour[\"bg-selected\"]};\n        border-top-color: ${Colour[\"border-selected-subtle\"]};\n        border-bottom-color: ${Colour[\"border-selected-subtle\"]};\n    }\n\n    &[data-day-cell-type=\"selected-hover\"] {\n        background-color: ${Colour[\"bg-selected-hover\"]};\n    }\n\n    &[data-day-cell-type=\"selected-hover-outline\"] {\n        background-color: ${Colour[\"bg-selected-hover\"]};\n        border-top-color: ${Colour[\"border-selected-hover\"]};\n        border-bottom-color: ${Colour[\"border-selected-hover\"]};\n    }\n`;\n\nexport const leftHalf = css`\n    ${half}\n    left: 0;\n`;\n\nexport const rightHalf = css`\n    ${half}\n    right: 0;\n`;\n\nexport const circle = `\n    position: absolute;\n    z-index: 1;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    height: 2.5rem;\n    width: 2.5rem;\n    transition: ${Motion[\"duration-150\"]} ${Motion[\"ease-default\"]};\n\n    border: ${Border[\"width-010\"]} ${Border[\"solid\"]} transparent;\n    border-radius: ${Radius[\"md\"]};\n    background-clip: content-box;\n\n    &[data-day-cell-type=\"hover-subtle\"] {\n        background-color: ${Colour[\"bg-hover\"]};\n        border-color: ${Colour[\"bg-hover\"]};\n    }\n\n    &[data-day-cell-type=\"hover\"] {\n        background-color: ${Colour[\"bg-hover-strong\"]};\n        border-color: ${Colour[\"bg-hover-strong\"]};\n    }\n\n    &[data-day-cell-type=\"hover-outline\"] {\n        background-color: ${Colour[\"bg-hover-subtle\"]};\n        border-color: ${Colour[\"border-hover\"]};\n    }\n\n    &[data-day-cell-type=\"selected-outline\"] {\n        background-color: ${Colour[\"bg-selected\"]};\n        border-color: ${Colour[\"border-selected\"]};\n    }\n\n    &[data-day-cell-type=\"selected-outline-subtle\"] {\n        background-color: ${Colour[\"bg-selected\"]};\n        border-color: ${Colour[\"border-selected-subtle\"]};\n    }\n\n    &[data-day-cell-type=\"selected-hover\"] {\n        background-color: ${Colour[\"bg-selected-hover\"]};\n    }\n\n    &[data-day-cell-type=\"selected-hover-outline\"] {\n        background-color: ${Colour[\"bg-selected-hover\"]};\n        border-color: ${Colour[\"border-selected-hover\"]};\n    }\n`;\n\nexport const leftCircle = css`\n    ${circle}\n    right: calc(50% - 1.25rem);\n    clip-path: inset(-3px 1.25rem -3px -3px);\n`;\n\nexport const rightCircle = css`\n    ${circle}\n    left: calc(50% - 1.25rem);\n    clip-path: inset(-3px -3px -3px 1.25rem);\n`;\n\nexport const labelWrapper = css`\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    z-index: 2;\n    cursor: default;\n\n    &[data-day-cell-state=\"interactive\"] {\n        cursor: pointer;\n    }\n\n    &[data-day-cell-state=\"disabled\"] {\n        cursor: not-allowed;\n    }\n`;\n\nexport const label = css`\n    all: unset;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    height: 2.5rem;\n    width: 2.5rem;\n    ${Font[\"body-md-regular\"]}\n    transition: ${Motion[\"duration-150\"]} ${Motion[\"ease-default\"]};\n    pointer-events: none;\n    color: ${Colour[\"text\"]};\n\n    &[data-day-cell-state=\"interactive\"] {\n        pointer-events: auto;\n    }\n\n    &[data-day-cell-label-type=\"selected\"] {\n        font-weight: ${Font.Spec[\"weight-semibold\"]};\n        color: ${Colour[\"text-selected\"]};\n    }\n\n    &[data-day-cell-label-type=\"selected-hover\"] {\n        font-weight: ${Font.Spec[\"weight-semibold\"]};\n        color: ${Colour[\"text-selected-hover\"]};\n    }\n\n    &[data-day-cell-label-type=\"current\"] {\n        font-weight: ${Font.Spec[\"weight-semibold\"]};\n        color: ${Colour[\"text-primary\"]};\n    }\n\n    &[data-day-cell-label-type=\"hover\"] {\n        font-weight: ${Font.Spec[\"weight-semibold\"]};\n        color: ${Colour[\"text-hover\"]};\n    }\n\n    &[data-day-cell-label-type=\"unavailable\"] {\n        color: ${Colour[\"text-disabled-subtlest\"]};\n    }\n\n    &[data-day-cell-label-type=\"hidden\"] {\n        visibility: hidden;\n    }\n\n    &[data-day-cell-disabled=\"true\"] {\n        color: ${Colour[\"text-disabled-subtlest\"]};\n    }\n\n    &:focus {\n        outline: none;\n    }\n`;\n\nexport const indicator = css`\n    position: absolute;\n    width: 4px;\n    height: 4px;\n    background-color: currentColor;\n    border-radius: 100%;\n    bottom: 4px;\n`;\n"],"names":["cell","Motion","Border","Colour","leftHalf","rightHalf","Radius","leftCircle","rightCircle","labelWrapper","label","indicator"],"mappings":"6YAIO,MAAMA,EAAI,UAaCC,EAAO,gBAAmBA,EAAO,gBACrCC,EAAO,aAAgBA,EAAc,MAMvBC,EAAO,YACPA,EAAO,YACJA,EAAO,YAIVA,EAAO,mBACPA,EAAO,mBACJA,EAAO,mBAIVA,EAAO,mBACPA,EAAO,gBACJA,EAAO,gBAIVA,EAAO,eACPA,EAAO,mBACJA,EAAO,mBAIVA,EAAO,eACPA,EAAO,0BACJA,EAAO,0BAIVA,EAAO,qBAIPA,EAAO,qBACPA,EAAO,yBACJA,EAAO,yBAI/B,MAAMC,EAAQ,WAKRC,EAAS,UAcJJ,EAAO,gBAAmBA,EAAO,gBAErCC,EAAO,aAAgBA,EAAc,MAC9BI,EAAW,GAIJH,EAAO,YACXA,EAAO,YAIHA,EAAO,mBACXA,EAAO,mBAIHA,EAAO,mBACXA,EAAO,gBAIHA,EAAO,eACXA,EAAO,mBAIHA,EAAO,eACXA,EAAO,0BAIHA,EAAO,qBAIPA,EAAO,qBACXA,EAAO,yBAIxB,MAAMI,EAAU,UAMVC,EAAW,WAMXC,EAAY,UAgBZC,EAAK,UAqDLC,EAAS"}
+{"version":3,"file":"day-cell.styles.js","sources":["../../../../src/shared/internal-calendar/day-cell/day-cell.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, Colour, Font, Motion, Radius } from \"../../../theme/tokens\";\n\nexport const cell = css`\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    position: relative;\n    width: 100%;\n    height: 2.5rem;\n`;\n\nexport const half = `\n    position: absolute;\n    height: 2.5rem;\n    width: 50%;\n    transition: ${Motion[\"duration-150\"]} ${Motion[\"ease-default\"]};\n    border: ${Border[\"width-010\"]} ${Border[\"solid\"]} transparent;\n    border-left: none;\n    border-right: none;\n    background-clip: border-box;\n\n    &[data-day-cell-type=\"hover-subtle\"] {\n        background-color: ${Colour[\"bg-hover\"]};\n        border-top-color: ${Colour[\"bg-hover\"]};\n        border-bottom-color: ${Colour[\"bg-hover\"]};\n    }\n\n    &[data-day-cell-type=\"hover\"] {\n        background-color: ${Colour[\"bg-hover-strong\"]};\n        border-top-color: ${Colour[\"bg-hover-strong\"]};\n        border-bottom-color: ${Colour[\"bg-hover-strong\"]};\n    }\n\n    &[data-day-cell-type=\"hover-outline\"] {\n        background-color: ${Colour[\"bg-hover-subtle\"]};\n        border-top-color: ${Colour[\"border-hover\"]};\n        border-bottom-color: ${Colour[\"border-hover\"]};\n    }\n\n    &[data-day-cell-type=\"selected-outline\"] {\n        background-color: ${Colour[\"bg-selected\"]};\n        border-top-color: ${Colour[\"border-selected\"]};\n        border-bottom-color: ${Colour[\"border-selected\"]};\n    }\n\n    &[data-day-cell-type=\"selected-outline-subtle\"] {\n        background-color: ${Colour[\"bg-selected\"]};\n        border-top-color: ${Colour[\"border-selected-subtle\"]};\n        border-bottom-color: ${Colour[\"border-selected-subtle\"]};\n    }\n\n    &[data-day-cell-type=\"selected-hover\"] {\n        background-color: ${Colour[\"bg-selected-hover\"]};\n    }\n\n    &[data-day-cell-type=\"selected-hover-outline\"] {\n        background-color: ${Colour[\"bg-selected-hover\"]};\n        border-top-color: ${Colour[\"border-selected-hover\"]};\n        border-bottom-color: ${Colour[\"border-selected-hover\"]};\n    }\n`;\n\nexport const leftHalf = css`\n    ${half}\n    left: 0;\n`;\n\nexport const rightHalf = css`\n    ${half}\n    right: 0;\n`;\n\nexport const circle = `\n    position: absolute;\n    z-index: 1;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    height: 2.5rem;\n    width: 2.5rem;\n    transition: ${Motion[\"duration-150\"]} ${Motion[\"ease-default\"]};\n\n    border: ${Border[\"width-010\"]} ${Border[\"solid\"]} transparent;\n    border-radius: ${Radius[\"md\"]};\n    background-clip: content-box;\n\n    &[data-day-cell-type=\"hover-subtle\"] {\n        background-color: ${Colour[\"bg-hover\"]};\n        border-color: ${Colour[\"bg-hover\"]};\n    }\n\n    &[data-day-cell-type=\"hover\"] {\n        background-color: ${Colour[\"bg-hover-strong\"]};\n        border-color: ${Colour[\"bg-hover-strong\"]};\n    }\n\n    &[data-day-cell-type=\"hover-outline\"] {\n        background-color: ${Colour[\"bg-hover-subtle\"]};\n        border-color: ${Colour[\"border-hover\"]};\n    }\n\n    &[data-day-cell-type=\"selected-outline\"] {\n        background-color: ${Colour[\"bg-selected\"]};\n        border-color: ${Colour[\"border-selected\"]};\n    }\n\n    &[data-day-cell-type=\"selected-outline-subtle\"] {\n        background-color: ${Colour[\"bg-selected\"]};\n        border-color: ${Colour[\"border-selected-subtle\"]};\n    }\n\n    &[data-day-cell-type=\"selected-hover\"] {\n        background-color: ${Colour[\"bg-selected-hover\"]};\n    }\n\n    &[data-day-cell-type=\"selected-hover-outline\"] {\n        background-color: ${Colour[\"bg-selected-hover\"]};\n        border-color: ${Colour[\"border-selected-hover\"]};\n    }\n`;\n\nexport const leftCircle = css`\n    ${circle}\n    right: calc(50% - 1.25rem);\n    clip-path: inset(-3px 1.25rem -3px -3px);\n`;\n\nexport const rightCircle = css`\n    ${circle}\n    left: calc(50% - 1.25rem);\n    clip-path: inset(-3px -3px -3px 1.25rem);\n`;\n\nexport const labelWrapper = css`\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    z-index: 2;\n    cursor: default;\n\n    &[data-day-cell-state=\"interactive\"] {\n        cursor: pointer;\n    }\n\n    &[data-day-cell-state=\"disabled\"] {\n        cursor: not-allowed;\n    }\n`;\n\nexport const label = css`\n    all: unset;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    height: 2.5rem;\n    width: 2.5rem;\n    ${Font[\"body-md-regular\"]}\n    transition: ${Motion[\"duration-150\"]} ${Motion[\"ease-default\"]};\n    pointer-events: none;\n    color: ${Colour[\"text\"]};\n\n    &[data-day-cell-state=\"interactive\"] {\n        pointer-events: auto;\n    }\n\n    &[data-day-cell-label-type=\"selected\"] {\n        font-weight: ${Font.Spec[\"weight-semibold\"]};\n        color: ${Colour[\"text-selected\"]};\n    }\n\n    &[data-day-cell-label-type=\"selected-hover\"] {\n        font-weight: ${Font.Spec[\"weight-semibold\"]};\n        color: ${Colour[\"text-selected-hover\"]};\n    }\n\n    &[data-day-cell-label-type=\"current\"] {\n        font-weight: ${Font.Spec[\"weight-semibold\"]};\n        color: ${Colour[\"text-primary\"]};\n    }\n\n    &[data-day-cell-label-type=\"hover\"] {\n        font-weight: ${Font.Spec[\"weight-semibold\"]};\n        color: ${Colour[\"text-hover\"]};\n    }\n\n    &[data-day-cell-label-type=\"unavailable\"] {\n        color: ${Colour[\"text-disabled-subtlest\"]};\n    }\n\n    &[data-day-cell-label-type=\"hidden\"] {\n        visibility: hidden;\n    }\n\n    &[data-day-cell-disabled=\"true\"] {\n        color: ${Colour[\"text-disabled-subtlest\"]};\n    }\n\n    &:focus {\n        outline: none;\n    }\n`;\n\nexport const indicator = css`\n    position: absolute;\n    width: 4px;\n    height: 4px;\n    background-color: currentColor;\n    border-radius: 100%;\n    bottom: 4px;\n`;\n"],"names":["cell","Motion","Border","Colour","leftHalf","rightHalf","Radius","leftCircle","rightCircle","labelWrapper","label","indicator"],"mappings":"8YAIO,MAAMA,EAAI,UAaCC,EAAO,gBAAmBA,EAAO,gBACrCC,EAAO,aAAgBA,EAAc,MAMvBC,EAAO,YACPA,EAAO,YACJA,EAAO,YAIVA,EAAO,mBACPA,EAAO,mBACJA,EAAO,mBAIVA,EAAO,mBACPA,EAAO,gBACJA,EAAO,gBAIVA,EAAO,eACPA,EAAO,mBACJA,EAAO,mBAIVA,EAAO,eACPA,EAAO,0BACJA,EAAO,0BAIVA,EAAO,qBAIPA,EAAO,qBACPA,EAAO,yBACJA,EAAO,yBAI/B,MAAMC,EAAQ,WAKRC,EAAS,UAcJJ,EAAO,gBAAmBA,EAAO,gBAErCC,EAAO,aAAgBA,EAAc,MAC9BI,EAAW,GAIJH,EAAO,YACXA,EAAO,YAIHA,EAAO,mBACXA,EAAO,mBAIHA,EAAO,mBACXA,EAAO,gBAIHA,EAAO,eACXA,EAAO,mBAIHA,EAAO,eACXA,EAAO,0BAIHA,EAAO,qBAIPA,EAAO,qBACXA,EAAO,yBAIxB,MAAMI,EAAU,UAMVC,EAAW,WAMXC,EAAY,UAgBZC,EAAK,UAqDLC,EAAS"}

package/shared/internal-calendar/day-cell/day-cell.styles_1t5oqc1.css

@@ -0,0 +1,8 @@
+.cgev3fe{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;position:relative;width:100%;height:2.5rem;}
+.l1vee93p{position:absolute;height:2.5rem;width:50%;-webkit-transition:var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);transition:var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);border:var(--fds-border-width-010) var(--fds-border-style-solid) transparent;border-left:none;border-right:none;-webkit-background-clip:border-box;background-clip:border-box;left:0;}.l1vee93p[data-day-cell-type="hover-subtle"]{background-color:var(--fds-colour-bg-hover);border-top-color:var(--fds-colour-bg-hover);border-bottom-color:var(--fds-colour-bg-hover);}.l1vee93p[data-day-cell-type="hover"]{background-color:var(--fds-colour-bg-hover-strong);border-top-color:var(--fds-colour-bg-hover-strong);border-bottom-color:var(--fds-colour-bg-hover-strong);}.l1vee93p[data-day-cell-type="hover-outline"]{background-color:var(--fds-colour-bg-hover-subtle);border-top-color:var(--fds-colour-border-hover);border-bottom-color:var(--fds-colour-border-hover);}.l1vee93p[data-day-cell-type="selected-outline"]{background-color:var(--fds-colour-bg-selected);border-top-color:var(--fds-colour-border-selected);border-bottom-color:var(--fds-colour-border-selected);}.l1vee93p[data-day-cell-type="selected-outline-subtle"]{background-color:var(--fds-colour-bg-selected);border-top-color:var(--fds-colour-border-selected-subtle);border-bottom-color:var(--fds-colour-border-selected-subtle);}.l1vee93p[data-day-cell-type="selected-hover"]{background-color:var(--fds-colour-bg-selected-hover);}.l1vee93p[data-day-cell-type="selected-hover-outline"]{background-color:var(--fds-colour-bg-selected-hover);border-top-color:var(--fds-colour-border-selected-hover);border-bottom-color:var(--fds-colour-border-selected-hover);}
+.ri6o55u{position:absolute;height:2.5rem;width:50%;-webkit-transition:var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);transition:var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);border:var(--fds-border-width-010) var(--fds-border-style-solid) transparent;border-left:none;border-right:none;-webkit-background-clip:border-box;background-clip:border-box;right:0;}.ri6o55u[data-day-cell-type="hover-subtle"]{background-color:var(--fds-colour-bg-hover);border-top-color:var(--fds-colour-bg-hover);border-bottom-color:var(--fds-colour-bg-hover);}.ri6o55u[data-day-cell-type="hover"]{background-color:var(--fds-colour-bg-hover-strong);border-top-color:var(--fds-colour-bg-hover-strong);border-bottom-color:var(--fds-colour-bg-hover-strong);}.ri6o55u[data-day-cell-type="hover-outline"]{background-color:var(--fds-colour-bg-hover-subtle);border-top-color:var(--fds-colour-border-hover);border-bottom-color:var(--fds-colour-border-hover);}.ri6o55u[data-day-cell-type="selected-outline"]{background-color:var(--fds-colour-bg-selected);border-top-color:var(--fds-colour-border-selected);border-bottom-color:var(--fds-colour-border-selected);}.ri6o55u[data-day-cell-type="selected-outline-subtle"]{background-color:var(--fds-colour-bg-selected);border-top-color:var(--fds-colour-border-selected-subtle);border-bottom-color:var(--fds-colour-border-selected-subtle);}.ri6o55u[data-day-cell-type="selected-hover"]{background-color:var(--fds-colour-bg-selected-hover);}.ri6o55u[data-day-cell-type="selected-hover-outline"]{background-color:var(--fds-colour-bg-selected-hover);border-top-color:var(--fds-colour-border-selected-hover);border-bottom-color:var(--fds-colour-border-selected-hover);}
+.lyjz5wx{position:absolute;z-index:1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;height:2.5rem;width:2.5rem;-webkit-transition:var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);transition:var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);border:var(--fds-border-width-010) var(--fds-border-style-solid) transparent;border-radius:var(--fds-radius-md);-webkit-background-clip:content-box;background-clip:content-box;right:calc(50% - 1.25rem);-webkit-clip-path:inset(-3px 1.25rem -3px -3px);clip-path:inset(-3px 1.25rem -3px -3px);}.lyjz5wx[data-day-cell-type="hover-subtle"]{background-color:var(--fds-colour-bg-hover);border-color:var(--fds-colour-bg-hover);}.lyjz5wx[data-day-cell-type="hover"]{background-color:var(--fds-colour-bg-hover-strong);border-color:var(--fds-colour-bg-hover-strong);}.lyjz5wx[data-day-cell-type="hover-outline"]{background-color:var(--fds-colour-bg-hover-subtle);border-color:var(--fds-colour-border-hover);}.lyjz5wx[data-day-cell-type="selected-outline"]{background-color:var(--fds-colour-bg-selected);border-color:var(--fds-colour-border-selected);}.lyjz5wx[data-day-cell-type="selected-outline-subtle"]{background-color:var(--fds-colour-bg-selected);border-color:var(--fds-colour-border-selected-subtle);}.lyjz5wx[data-day-cell-type="selected-hover"]{background-color:var(--fds-colour-bg-selected-hover);}.lyjz5wx[data-day-cell-type="selected-hover-outline"]{background-color:var(--fds-colour-bg-selected-hover);border-color:var(--fds-colour-border-selected-hover);}
+.r1l3qdei{position:absolute;z-index:1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;height:2.5rem;width:2.5rem;-webkit-transition:var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);transition:var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);border:var(--fds-border-width-010) var(--fds-border-style-solid) transparent;border-radius:var(--fds-radius-md);-webkit-background-clip:content-box;background-clip:content-box;left:calc(50% - 1.25rem);-webkit-clip-path:inset(-3px -3px -3px 1.25rem);clip-path:inset(-3px -3px -3px 1.25rem);}.r1l3qdei[data-day-cell-type="hover-subtle"]{background-color:var(--fds-colour-bg-hover);border-color:var(--fds-colour-bg-hover);}.r1l3qdei[data-day-cell-type="hover"]{background-color:var(--fds-colour-bg-hover-strong);border-color:var(--fds-colour-bg-hover-strong);}.r1l3qdei[data-day-cell-type="hover-outline"]{background-color:var(--fds-colour-bg-hover-subtle);border-color:var(--fds-colour-border-hover);}.r1l3qdei[data-day-cell-type="selected-outline"]{background-color:var(--fds-colour-bg-selected);border-color:var(--fds-colour-border-selected);}.r1l3qdei[data-day-cell-type="selected-outline-subtle"]{background-color:var(--fds-colour-bg-selected);border-color:var(--fds-colour-border-selected-subtle);}.r1l3qdei[data-day-cell-type="selected-hover"]{background-color:var(--fds-colour-bg-selected-hover);}.r1l3qdei[data-day-cell-type="selected-hover-outline"]{background-color:var(--fds-colour-bg-selected-hover);border-color:var(--fds-colour-border-selected-hover);}
+.lxr1b4f{position:absolute;top:0;bottom:0;z-index:2;cursor:default;}.lxr1b4f[data-day-cell-state="interactive"]{cursor:pointer;}.lxr1b4f[data-day-cell-state="disabled"]{cursor:not-allowed;}
+.lm3qs71{all:unset;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;height:2.5rem;width:2.5rem;font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-md);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-md);letter-spacing:var(--fds-font-body-ls-md);-webkit-transition:var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);transition:var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);pointer-events:none;color:var(--fds-colour-text);}.lm3qs71[data-day-cell-state="interactive"]{pointer-events:auto;}.lm3qs71[data-day-cell-label-type="selected"]{font-weight:var(--fds-font-weight-semibold);color:var(--fds-colour-text-selected);}.lm3qs71[data-day-cell-label-type="selected-hover"]{font-weight:var(--fds-font-weight-semibold);color:var(--fds-colour-text-selected-hover);}.lm3qs71[data-day-cell-label-type="current"]{font-weight:var(--fds-font-weight-semibold);color:var(--fds-colour-text-primary);}.lm3qs71[data-day-cell-label-type="hover"]{font-weight:var(--fds-font-weight-semibold);color:var(--fds-colour-text-hover);}.lm3qs71[data-day-cell-label-type="unavailable"]{color:var(--fds-colour-text-disabled-subtlest);}.lm3qs71[data-day-cell-label-type="hidden"]{visibility:hidden;}.lm3qs71[data-day-cell-disabled="true"]{color:var(--fds-colour-text-disabled-subtlest);}.lm3qs71:focus{outline:none;}
+.i8ea7e7{position:absolute;width:4px;height:4px;background-color:currentColor;border-radius:100%;bottom:4px;}

package/shared/internal-calendar/internal-calendar-month.styles.js

@@ -1,2 +1,2 @@
-import"./internal-calendar-month.styles_1pk3ynj.css";const n="w1tx88ym",m="m37bydr",t="m10033nc",r="mhzr9th",a="m1t53w7a",c="mznpfg",e="mgh0mxh",h="mhccb5n";export{m as monthCell,a as monthCellCurrentMonth,e as monthCellDefaultHover,t as monthCellDisabledDisplay,r as monthCellInteractive,h as monthCellSelectedHover,c as monthCellSelectedMonth,n as wrapper};
+import"./internal-calendar-month.styles_14oh57f.css";const m="w1tx88ym",n="m37bydr",t="m10033nc",r="mhzr9th",a="m1t53w7a",h="mznpfg",c="mgh0mxh",e="mhccb5n";export{n as monthCell,a as monthCellCurrentMonth,c as monthCellDefaultHover,t as monthCellDisabledDisplay,r as monthCellInteractive,e as monthCellSelectedHover,h as monthCellSelectedMonth,m as wrapper};
 //# sourceMappingURL=internal-calendar-month.styles.js.map

package/shared/internal-calendar/internal-calendar-month.styles_14oh57f.css

@@ -0,0 +1,8 @@
+.w1tx88ym{width:100%;height:100%;display:-ms-grid;display:grid;-ms-grid-columns:repeat(2, 1fr);grid-template-columns:repeat(2, 1fr);-ms-grid-rows:repeat(6, 2.5rem);grid-template-rows:repeat(6, 2.5rem);-webkit-align-content:center;-ms-flex-line-pack:center;align-content:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;gap:0.5rem 0;}
+.m37bydr{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;border-radius:var(--fds-radius-md);margin:0 0.5rem;-webkit-transition:var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);transition:var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-md);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-md);letter-spacing:var(--fds-font-body-ls-md);border:var(--fds-border-width-010) var(--fds-border-style-solid) transparent;-webkit-background-clip:border-box;background-clip:border-box;color:var(--fds-colour-text);cursor:default;}
+.m10033nc{cursor:not-allowed;color:var(--fds-colour-text-disabled-subtlest);}
+.mhzr9th{cursor:pointer;}
+.m1t53w7a{color:var(--fds-colour-text-primary);font-weight:var(--fds-font-weight-semibold);}
+.mznpfg{background:var(--fds-colour-bg-selected);border-color:var(--fds-colour-border-selected);color:var(--fds-colour-text-selected);font-weight:var(--fds-font-weight-semibold);}
+.mgh0mxh:hover{background:var(--fds-colour-bg-hover);color:var(--fds-colour-text-hover);font-weight:var(--fds-font-weight-semibold);}
+.mhccb5n:hover{background:var(--fds-colour-bg-selected-hover);border-color:var(--fds-colour-border-selected-hover);color:var(--fds-colour-text-selected-hover);font-weight:var(--fds-font-weight-semibold);}

package/shared/internal-calendar/internal-calendar-year.styles.js

@@ -1,2 +1,2 @@
-import"./internal-calendar-year.styles_1azy42u.css";const y="w3rwm60",r="y6pbhbr",a="y1iq0wsu",e="ylfpv0z",n="y9ky3r3",l="y1w3dlxt",s="ynkab5y",t="yivyhzm",c="y1pbdzuc";export{y as wrapper,r as yearCell,l as yearCellCurrentYear,t as yearCellDefaultHover,a as yearCellDisabledDisplay,e as yearCellInteractive,n as yearCellOtherDecade,c as yearCellSelectedHover,s as yearCellSelectedYear};
+import"./internal-calendar-year.styles_therlc.css";const y="w3rwm60",r="y6pbhbr",a="y1iq0wsu",e="ylfpv0z",l="y9ky3r3",n="y1w3dlxt",t="ynkab5y",s="yivyhzm",c="y1pbdzuc";export{y as wrapper,r as yearCell,n as yearCellCurrentYear,s as yearCellDefaultHover,a as yearCellDisabledDisplay,e as yearCellInteractive,l as yearCellOtherDecade,c as yearCellSelectedHover,t as yearCellSelectedYear};
 //# sourceMappingURL=internal-calendar-year.styles.js.map

package/shared/internal-calendar/internal-calendar-year.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"internal-calendar-year.styles.js","sources":["../../../src/shared/internal-calendar/internal-calendar-year.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, Colour, Font, Motion, Radius } from \"../../theme\";\n\n// =============================================================================\n// STYLING\n// =============================================================================\nexport const wrapper = css`\n    width: 100%;\n    height: 100%;\n    display: grid;\n    align-content: center;\n    align-items: center;\n    grid-template-columns: repeat(3, 1fr);\n`;\n\nexport const yearCell = css`\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    margin: 1rem 0.5rem;\n    transition: ${Motion[\"duration-150\"]} ${Motion[\"ease-default\"]};\n    padding: 0.5rem;\n\n    ${Font[\"body-md-regular\"]}\n    border-radius: ${Radius[\"md\"]};\n    border: ${Border[\"width-010\"]} ${Border[\"solid\"]} transparent;\n    background-clip: border-box;\n    color: ${Colour[\"text\"]};\n    cursor: default;\n`;\n\nexport const yearCellDisabledDisplay = css`\n    cursor: not-allowed;\n    color: ${Colour[\"text-disabled-subtlest\"]};\n`;\n\nexport const yearCellInteractive = css`\n    cursor: pointer;\n`;\n\nexport const yearCellOtherDecade = css`\n    color: ${Colour[\"text-disabled-subtlest\"]};\n`;\n\nexport const yearCellCurrentYear = css`\n    color: ${Colour[\"text-primary\"]};\n    font-weight: ${Font.Spec[\"weight-semibold\"]};\n`;\n\nexport const yearCellSelectedYear = css`\n    background: ${Colour[\"bg-selected\"]};\n    border-color: ${Colour[\"border-selected\"]};\n    color: ${Colour[\"text-selected\"]};\n    font-weight: ${Font.Spec[\"weight-semibold\"]};\n`;\n\nexport const yearCellDefaultHover = css`\n    &:hover {\n        background: ${Colour[\"bg-hover\"]};\n        color: ${Colour[\"text-hover\"]};\n        font-weight: ${Font.Spec[\"weight-semibold\"]};\n    }\n`;\n\nexport const yearCellSelectedHover = css`\n    &:hover {\n        background: ${Colour[\"bg-selected-hover\"]};\n        border-color: ${Colour[\"border-selected-hover\"]};\n        color: ${Colour[\"text-selected-hover\"]};\n        font-weight: ${Font.Spec[\"weight-semibold\"]};\n    }\n`;\n"],"names":["wrapper","yearCell","yearCellDisabledDisplay","yearCellInteractive","yearCellOtherDecade","yearCellCurrentYear","yearCellSelectedYear","yearCellDefaultHover","yearCellSelectedHover"],"mappings":"4FAOO,MAAMA,EAAO,UASPC,EAAQ,UAgBRC,EAAuB,WAKvBC,EAAmB,UAInBC,EAAmB,UAInBC,EAAmB,WAKnBC,EAAoB,UAOpBC,EAAoB,UAQpBC,EAAqB"}
+{"version":3,"file":"internal-calendar-year.styles.js","sources":["../../../src/shared/internal-calendar/internal-calendar-year.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, Colour, Font, Motion, Radius } from \"../../theme\";\n\n// =============================================================================\n// STYLING\n// =============================================================================\nexport const wrapper = css`\n    width: 100%;\n    height: 100%;\n    display: grid;\n    align-content: center;\n    align-items: center;\n    grid-template-columns: repeat(3, 1fr);\n`;\n\nexport const yearCell = css`\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    margin: 1rem 0.5rem;\n    transition: ${Motion[\"duration-150\"]} ${Motion[\"ease-default\"]};\n    padding: 0.5rem;\n\n    ${Font[\"body-md-regular\"]}\n    border-radius: ${Radius[\"md\"]};\n    border: ${Border[\"width-010\"]} ${Border[\"solid\"]} transparent;\n    background-clip: border-box;\n    color: ${Colour[\"text\"]};\n    cursor: default;\n`;\n\nexport const yearCellDisabledDisplay = css`\n    cursor: not-allowed;\n    color: ${Colour[\"text-disabled-subtlest\"]};\n`;\n\nexport const yearCellInteractive = css`\n    cursor: pointer;\n`;\n\nexport const yearCellOtherDecade = css`\n    color: ${Colour[\"text-disabled-subtlest\"]};\n`;\n\nexport const yearCellCurrentYear = css`\n    color: ${Colour[\"text-primary\"]};\n    font-weight: ${Font.Spec[\"weight-semibold\"]};\n`;\n\nexport const yearCellSelectedYear = css`\n    background: ${Colour[\"bg-selected\"]};\n    border-color: ${Colour[\"border-selected\"]};\n    color: ${Colour[\"text-selected\"]};\n    font-weight: ${Font.Spec[\"weight-semibold\"]};\n`;\n\nexport const yearCellDefaultHover = css`\n    &:hover {\n        background: ${Colour[\"bg-hover\"]};\n        color: ${Colour[\"text-hover\"]};\n        font-weight: ${Font.Spec[\"weight-semibold\"]};\n    }\n`;\n\nexport const yearCellSelectedHover = css`\n    &:hover {\n        background: ${Colour[\"bg-selected-hover\"]};\n        border-color: ${Colour[\"border-selected-hover\"]};\n        color: ${Colour[\"text-selected-hover\"]};\n        font-weight: ${Font.Spec[\"weight-semibold\"]};\n    }\n`;\n"],"names":["wrapper","yearCell","yearCellDisabledDisplay","yearCellInteractive","yearCellOtherDecade","yearCellCurrentYear","yearCellSelectedYear","yearCellDefaultHover","yearCellSelectedHover"],"mappings":"2FAOO,MAAMA,EAAO,UASPC,EAAQ,UAgBRC,EAAuB,WAKvBC,EAAmB,UAInBC,EAAmB,UAInBC,EAAmB,WAKnBC,EAAoB,UAOpBC,EAAoB,UAQpBC,EAAqB"}

package/shared/internal-calendar/internal-calendar-year.styles_therlc.css

@@ -0,0 +1,9 @@
+.w3rwm60{width:100%;height:100%;display:-ms-grid;display:grid;-webkit-align-content:center;-ms-flex-line-pack:center;align-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-grid-columns:repeat(3, 1fr);grid-template-columns:repeat(3, 1fr);}
+.y6pbhbr{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:1rem 0.5rem;-webkit-transition:var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);transition:var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);padding:0.5rem;font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-md);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-md);letter-spacing:var(--fds-font-body-ls-md);border-radius:var(--fds-radius-md);border:var(--fds-border-width-010) var(--fds-border-style-solid) transparent;-webkit-background-clip:border-box;background-clip:border-box;color:var(--fds-colour-text);cursor:default;}
+.y1iq0wsu{cursor:not-allowed;color:var(--fds-colour-text-disabled-subtlest);}
+.ylfpv0z{cursor:pointer;}
+.y9ky3r3{color:var(--fds-colour-text-disabled-subtlest);}
+.y1w3dlxt{color:var(--fds-colour-text-primary);font-weight:var(--fds-font-weight-semibold);}
+.ynkab5y{background:var(--fds-colour-bg-selected);border-color:var(--fds-colour-border-selected);color:var(--fds-colour-text-selected);font-weight:var(--fds-font-weight-semibold);}
+.yivyhzm:hover{background:var(--fds-colour-bg-hover);color:var(--fds-colour-text-hover);font-weight:var(--fds-font-weight-semibold);}
+.y1pbdzuc:hover{background:var(--fds-colour-bg-selected-hover);border-color:var(--fds-colour-border-selected-hover);color:var(--fds-colour-text-selected-hover);font-weight:var(--fds-font-weight-semibold);}

package/shared/internal-calendar/single/single-cell.js

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import t from"../../../external/dayjs/dayjs.min.js";import{CalendarHelper as a}from"../../../util/calendar-helper.js";import"react";import"../../../util/simple-id-generator.js";import"../../../util/string-helper.js";import"@react-aria/live-announcer";import{DayCell as r}from"../day-cell/day-cell.js";const o=({date:o,calendarDate:l,selectedDate:n,hoverDate:i,focusDate:c,minDate:s,maxDate:d,disabledDates:m,allowDisabledSelection:u,showActiveMonthDaysOnly:y,onSelect:D,onHover:h,onFocus:p,setFocusCell:f,tabIndex:b})=>{const v=a.isDisabledDay(o,m,s,d),Y=!v||u,w=()=>{D(o,!Y)},g={date:o,calendarDate:l,disabled:v,interactive:Y,currentDateIndicator:!0,onSelect:w,onHover:()=>{h(o.format("YYYY-MM-DD"),!Y)},onFocus:()=>{p(o.format("YYYY-MM-DD"))},onKeyDown:e=>{const t=e.key;if("Enter"===t||" "===t)return e.preventDefault(),void(Y&&w());(e=>{let t;const a={ArrowLeft:()=>o.subtract(1,"day"),ArrowRight:()=>o.add(1,"day"),ArrowUp:()=>o.subtract(7,"day"),ArrowDown:()=>o.add(7,"day"),Home:()=>o.startOf("week"),End:()=>o.endOf("week"),PageUp:()=>e.shiftKey?o.subtract(1,"year"):o.subtract(1,"month"),PageDown:()=>e.shiftKey?o.add(1,"year"):o.add(1,"month")}[e.key];a&&(e.preventDefault(),t=a(),f(t.format("YYYY-MM-DD")))})(e)},role:"gridcell",focusDate:t(c),tabIndex:b};return e(r,Object.assign({},g,(()=>{const e={};l.month()!==o.month()?e.labelType=y?"hidden":"unavailable":t().isSame(o,"day")&&!v&&(e.labelType="current");const a=o.isSame(n,"day"),r=o.isSame(i,"day");return a&&r?(e.labelType="selected-hover",e.circleLeft="selected-hover-outline",e.circleRight="selected-hover-outline"):a?(e.labelType="selected",e.circleLeft="selected-outline",e.circleRight="selected-outline"):r&&(e.labelType="hover",e.circleLeft="hover-subtle",e.circleRight="hover-subtle"),e})()))};export{o as SingleCell};
+import{jsx as e}from"react/jsx-runtime";import t from"../../../external/dayjs/dayjs.min.js";import{CalendarHelper as a}from"../../../util/calendar-helper.js";import"react";import"../../../util/simple-id-generator.js";import"../../../util/string-helper.js";import"@react-aria/live-announcer";import{DayCell as r}from"../day-cell/day-cell.js";const o=({date:o,calendarDate:l,selectedDate:n,hoverDate:i,focusDate:c,minDate:s,maxDate:d,disabledDates:m,allowDisabledSelection:u,showActiveMonthDaysOnly:y,onSelect:D,onHover:h,onFocus:p,setFocusCell:f,tabIndex:b})=>{const v=a.isDisabledDay(o,m,s,d),Y=!v||u,w=()=>{D(o,!Y)},g={date:o,calendarDate:l,disabled:v,interactive:Y,currentDateIndicator:!0,onSelect:w,onHover:()=>{h(o.format("YYYY-MM-DD"),!Y)},onFocus:()=>{p(o.format("YYYY-MM-DD"))},onKeyDown:e=>{const t=e.key;if("Enter"===t||" "===t)return e.preventDefault(),void(Y&&w());(e=>{let t;const a={ArrowLeft:()=>o.subtract(1,"day"),ArrowRight:()=>o.add(1,"day"),ArrowUp:()=>o.subtract(7,"day"),ArrowDown:()=>o.add(7,"day"),Home:()=>o.startOf("week"),End:()=>o.endOf("week"),PageUp:()=>e.shiftKey?o.subtract(1,"year"):o.subtract(1,"month"),PageDown:()=>e.shiftKey?o.add(1,"year"):o.add(1,"month")}[e.key];a&&(e.preventDefault(),t=a(),f(t.format("YYYY-MM-DD")))})(e)},role:"gridcell",focusDate:t(c),tabIndex:b};return e(r,Object.assign({},g,(()=>{const e={};l.month()!==o.month()?e.labelType=y?"hidden":"unavailable":t().isSame(o,"day")&&!v&&(e.labelType="current");const a=n&&o.isSame(n,"day"),r=o.isSame(i,"day");return a&&r?(e.labelType="selected-hover",e.circleLeft="selected-hover-outline",e.circleRight="selected-hover-outline"):a?(e.labelType="selected",e.circleLeft="selected-outline",e.circleRight="selected-outline"):r&&(e.labelType="hover",e.circleLeft="hover-subtle",e.circleRight="hover-subtle"),e})()))};export{o as SingleCell};
 //# sourceMappingURL=single-cell.js.map

package/shared/internal-calendar/single/single-cell.js.map

@@ -1 +1 @@
-{"version":3,"file":"single-cell.js","sources":["../../../../src/shared/internal-calendar/single/single-cell.tsx"],"sourcesContent":["import type { Dayjs } from \"dayjs\";\nimport dayjs from \"dayjs\";\n\nimport { CalendarHelper } from \"../../../util\";\nimport type { CellStyleProps, DayCellProps } from \"../day-cell\";\nimport { DayCell } from \"../day-cell\";\n\ninterface Props {\n    date: Dayjs;\n    calendarDate: Dayjs;\n    selectedDate: string | undefined;\n    hoverDate: string | undefined;\n    focusDate: string;\n    minDate?: string | undefined;\n    maxDate?: string | undefined;\n    disabledDates?: string[] | undefined;\n    allowDisabledSelection?: boolean | undefined;\n    showActiveMonthDaysOnly?: boolean | undefined;\n    onSelect: (value: Dayjs, disabled: boolean) => void;\n    onHover: (value: string, disabled: boolean) => void;\n    onFocus: (value: string) => void;\n    setFocusCell: (value: string) => void;\n    tabIndex: number;\n}\n\nexport const SingleCell = ({\n    date,\n    calendarDate,\n    selectedDate,\n    hoverDate,\n    focusDate,\n    minDate,\n    maxDate,\n    disabledDates,\n    allowDisabledSelection,\n    showActiveMonthDaysOnly,\n    onSelect,\n    onHover,\n    onFocus,\n    setFocusCell,\n    tabIndex,\n}: Props) => {\n    // =========================================================================\n    // CONSTS\n    // =========================================================================\n    const disabled = CalendarHelper.isDisabledDay(\n        date,\n        disabledDates,\n        minDate,\n        maxDate\n    );\n    const interactive = !disabled || allowDisabledSelection;\n\n    // =========================================================================\n    // EVENT HANDLERS\n    // =========================================================================\n    const handleSelect = () => {\n        onSelect(date, !interactive);\n    };\n\n    const handleHover = () => {\n        onHover(date.format(\"YYYY-MM-DD\"), !interactive);\n    };\n\n    const handleFocus = () => {\n        onFocus(date.format(\"YYYY-MM-DD\"));\n    };\n\n    const handleKeyNavigation = (event: React.KeyboardEvent) => {\n        let newFocusSelection: Dayjs | undefined;\n\n        const keyActions: Record<string, () => dayjs.Dayjs> = {\n            ArrowLeft: () => date.subtract(1, \"day\"),\n            ArrowRight: () => date.add(1, \"day\"),\n            ArrowUp: () => date.subtract(7, \"day\"),\n            ArrowDown: () => date.add(7, \"day\"),\n            Home: () => date.startOf(\"week\"),\n            End: () => date.endOf(\"week\"),\n            PageUp: () => {\n                return event.shiftKey\n                    ? date.subtract(1, \"year\")\n                    : date.subtract(1, \"month\");\n            },\n            PageDown: () => {\n                return event.shiftKey\n                    ? date.add(1, \"year\")\n                    : date.add(1, \"month\");\n            },\n        };\n\n        const action = keyActions[event.key];\n        if (action) {\n            event.preventDefault();\n            newFocusSelection = action();\n            setFocusCell(newFocusSelection.format(\"YYYY-MM-DD\"));\n        }\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent) => {\n        const keyboardEvent = event as React.KeyboardEvent<HTMLInputElement>;\n        const selectedKey = keyboardEvent.key;\n\n        if (selectedKey === \"Enter\" || selectedKey === \" \") {\n            event.preventDefault();\n            if (interactive) {\n                handleSelect();\n            }\n            return;\n        }\n\n        handleKeyNavigation(event);\n    };\n\n    // =========================================================================\n    // HELPERS\n    // =========================================================================\n    const getCellStyle = () => {\n        const props: CellStyleProps = {};\n\n        if (calendarDate.month() !== date.month()) {\n            props.labelType = showActiveMonthDaysOnly\n                ? \"hidden\"\n                : \"unavailable\";\n        } else if (dayjs().isSame(date, \"day\") && !disabled) {\n            props.labelType = \"current\";\n        }\n\n        const isSelected = date.isSame(selectedDate, \"day\");\n        const isHover = date.isSame(hoverDate, \"day\");\n\n        if (isSelected && isHover) {\n            props.labelType = \"selected-hover\";\n            props.circleLeft = \"selected-hover-outline\";\n            props.circleRight = \"selected-hover-outline\";\n        } else if (isSelected) {\n            props.labelType = \"selected\";\n            props.circleLeft = \"selected-outline\";\n            props.circleRight = \"selected-outline\";\n        } else if (isHover) {\n            props.labelType = \"hover\";\n            props.circleLeft = \"hover-subtle\";\n            props.circleRight = \"hover-subtle\";\n        }\n\n        return props;\n    };\n\n    // =============================================================================\n    // RENDER FUNCTION\n    // =============================================================================\n\n    const commonProps: DayCellProps = {\n        date,\n        calendarDate,\n        disabled,\n        interactive,\n        currentDateIndicator: true,\n        onSelect: handleSelect,\n        onHover: handleHover,\n        onFocus: handleFocus,\n        onKeyDown: handleKeyDown,\n        role: \"gridcell\",\n        focusDate: dayjs(focusDate),\n        tabIndex,\n    };\n\n    return <DayCell {...commonProps} {...getCellStyle()} />;\n};\n"],"names":["SingleCell","date","calendarDate","selectedDate","hoverDate","focusDate","minDate","maxDate","disabledDates","allowDisabledSelection","showActiveMonthDaysOnly","onSelect","onHover","onFocus","setFocusCell","tabIndex","disabled","CalendarHelper","isDisabledDay","interactive","handleSelect","commonProps","currentDateIndicator","format","onKeyDown","event","selectedKey","key","preventDefault","newFocusSelection","action","ArrowLeft","subtract","ArrowRight","add","ArrowUp","ArrowDown","Home","startOf","End","endOf","PageUp","shiftKey","PageDown","handleKeyNavigation","role","dayjs","_jsx","DayCell","Object","assign","props","month","labelType","isSame","isSelected","isHover","circleLeft","circleRight","getCellStyle"],"mappings":"qVAyBO,MAAMA,EAAa,EACtBC,OACAC,eACAC,eACAC,YACAC,YACAC,UACAC,UACAC,gBACAC,yBACAC,0BACAC,WACAC,UACAC,UACAC,eACAC,eAKA,MAAMC,EAAWC,EAAeC,cAC5BjB,EACAO,EACAF,EACAC,GAEEY,GAAeH,GAAYP,EAK3BW,EAAe,KACjBT,EAASV,GAAOkB,EAAY,EA8F1BE,EAA4B,CAC9BpB,OACAC,eACAc,WACAG,cACAG,sBAAsB,EACtBX,SAAUS,EACVR,QAlGgB,KAChBA,EAAQX,EAAKsB,OAAO,eAAgBJ,EAAY,EAkGhDN,QA/FgB,KAChBA,EAAQZ,EAAKsB,OAAO,cAAc,EA+FlCC,UA9DmBC,IACnB,MACMC,EADgBD,EACYE,IAElC,GAAoB,UAAhBD,GAA2C,MAAhBA,EAK3B,OAJAD,EAAMG,sBACFT,GACAC,KArCgB,CAACK,IACzB,IAAII,EAEJ,MAmBMC,EAnBgD,CAClDC,UAAW,IAAM9B,EAAK+B,SAAS,EAAG,OAClCC,WAAY,IAAMhC,EAAKiC,IAAI,EAAG,OAC9BC,QAAS,IAAMlC,EAAK+B,SAAS,EAAG,OAChCI,UAAW,IAAMnC,EAAKiC,IAAI,EAAG,OAC7BG,KAAM,IAAMpC,EAAKqC,QAAQ,QACzBC,IAAK,IAAMtC,EAAKuC,MAAM,QACtBC,OAAQ,IACGhB,EAAMiB,SACPzC,EAAK+B,SAAS,EAAG,QACjB/B,EAAK+B,SAAS,EAAG,SAE3BW,SAAU,IACClB,EAAMiB,SACPzC,EAAKiC,IAAI,EAAG,QACZjC,EAAKiC,IAAI,EAAG,UAIAT,EAAME,KAC5BG,IACAL,EAAMG,iBACNC,EAAoBC,IACpBhB,EAAae,EAAkBN,OAAO,eAC1C,EAeAqB,CAAoBnB,EAAM,EAmD1BoB,KAAM,WACNxC,UAAWyC,EAAMzC,GACjBU,YAGJ,OAAOgC,EAACC,EAAOC,OAAAC,OAAA,CAAA,EAAK7B,EAlDC,MACjB,MAAM8B,EAAwB,CAAA,EAE1BjD,EAAakD,UAAYnD,EAAKmD,QAC9BD,EAAME,UAAY3C,EACZ,SACA,cACCoC,IAAQQ,OAAOrD,EAAM,SAAWe,IACvCmC,EAAME,UAAY,WAGtB,MAAME,EAAatD,EAAKqD,OAAOnD,EAAc,OACvCqD,EAAUvD,EAAKqD,OAAOlD,EAAW,OAgBvC,OAdImD,GAAcC,GACdL,EAAME,UAAY,iBAClBF,EAAMM,WAAa,yBACnBN,EAAMO,YAAc,0BACbH,GACPJ,EAAME,UAAY,WAClBF,EAAMM,WAAa,mBACnBN,EAAMO,YAAc,oBACbF,IACPL,EAAME,UAAY,QAClBF,EAAMM,WAAa,eACnBN,EAAMO,YAAc,gBAGjBP,CAAK,EAsBqBQ,IAAkB"}
+{"version":3,"file":"single-cell.js","sources":["../../../../src/shared/internal-calendar/single/single-cell.tsx"],"sourcesContent":["import type { Dayjs } from \"dayjs\";\nimport dayjs from \"dayjs\";\n\nimport { CalendarHelper } from \"../../../util\";\nimport type { CellStyleProps, DayCellProps } from \"../day-cell\";\nimport { DayCell } from \"../day-cell\";\n\ninterface Props {\n    date: Dayjs;\n    calendarDate: Dayjs;\n    selectedDate: string | undefined;\n    hoverDate: string | undefined;\n    focusDate: string;\n    minDate?: string | undefined;\n    maxDate?: string | undefined;\n    disabledDates?: string[] | undefined;\n    allowDisabledSelection?: boolean | undefined;\n    showActiveMonthDaysOnly?: boolean | undefined;\n    onSelect: (value: Dayjs, disabled: boolean) => void;\n    onHover: (value: string, disabled: boolean) => void;\n    onFocus: (value: string) => void;\n    setFocusCell: (value: string) => void;\n    tabIndex: number;\n}\n\nexport const SingleCell = ({\n    date,\n    calendarDate,\n    selectedDate,\n    hoverDate,\n    focusDate,\n    minDate,\n    maxDate,\n    disabledDates,\n    allowDisabledSelection,\n    showActiveMonthDaysOnly,\n    onSelect,\n    onHover,\n    onFocus,\n    setFocusCell,\n    tabIndex,\n}: Props) => {\n    // =========================================================================\n    // CONSTS\n    // =========================================================================\n    const disabled = CalendarHelper.isDisabledDay(\n        date,\n        disabledDates,\n        minDate,\n        maxDate\n    );\n    const interactive = !disabled || allowDisabledSelection;\n\n    // =========================================================================\n    // EVENT HANDLERS\n    // =========================================================================\n    const handleSelect = () => {\n        onSelect(date, !interactive);\n    };\n\n    const handleHover = () => {\n        onHover(date.format(\"YYYY-MM-DD\"), !interactive);\n    };\n\n    const handleFocus = () => {\n        onFocus(date.format(\"YYYY-MM-DD\"));\n    };\n\n    const handleKeyNavigation = (event: React.KeyboardEvent) => {\n        let newFocusSelection: Dayjs | undefined;\n\n        const keyActions: Record<string, () => dayjs.Dayjs> = {\n            ArrowLeft: () => date.subtract(1, \"day\"),\n            ArrowRight: () => date.add(1, \"day\"),\n            ArrowUp: () => date.subtract(7, \"day\"),\n            ArrowDown: () => date.add(7, \"day\"),\n            Home: () => date.startOf(\"week\"),\n            End: () => date.endOf(\"week\"),\n            PageUp: () => {\n                return event.shiftKey\n                    ? date.subtract(1, \"year\")\n                    : date.subtract(1, \"month\");\n            },\n            PageDown: () => {\n                return event.shiftKey\n                    ? date.add(1, \"year\")\n                    : date.add(1, \"month\");\n            },\n        };\n\n        const action = keyActions[event.key];\n        if (action) {\n            event.preventDefault();\n            newFocusSelection = action();\n            setFocusCell(newFocusSelection.format(\"YYYY-MM-DD\"));\n        }\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent) => {\n        const keyboardEvent = event as React.KeyboardEvent<HTMLInputElement>;\n        const selectedKey = keyboardEvent.key;\n\n        if (selectedKey === \"Enter\" || selectedKey === \" \") {\n            event.preventDefault();\n            if (interactive) {\n                handleSelect();\n            }\n            return;\n        }\n\n        handleKeyNavigation(event);\n    };\n\n    // =========================================================================\n    // HELPERS\n    // =========================================================================\n    const getCellStyle = () => {\n        const props: CellStyleProps = {};\n\n        if (calendarDate.month() !== date.month()) {\n            props.labelType = showActiveMonthDaysOnly\n                ? \"hidden\"\n                : \"unavailable\";\n        } else if (dayjs().isSame(date, \"day\") && !disabled) {\n            props.labelType = \"current\";\n        }\n\n        const isSelected = selectedDate && date.isSame(selectedDate, \"day\");\n        const isHover = date.isSame(hoverDate, \"day\");\n\n        if (isSelected && isHover) {\n            props.labelType = \"selected-hover\";\n            props.circleLeft = \"selected-hover-outline\";\n            props.circleRight = \"selected-hover-outline\";\n        } else if (isSelected) {\n            props.labelType = \"selected\";\n            props.circleLeft = \"selected-outline\";\n            props.circleRight = \"selected-outline\";\n        } else if (isHover) {\n            props.labelType = \"hover\";\n            props.circleLeft = \"hover-subtle\";\n            props.circleRight = \"hover-subtle\";\n        }\n\n        return props;\n    };\n\n    // =============================================================================\n    // RENDER FUNCTION\n    // =============================================================================\n\n    const commonProps: DayCellProps = {\n        date,\n        calendarDate,\n        disabled,\n        interactive,\n        currentDateIndicator: true,\n        onSelect: handleSelect,\n        onHover: handleHover,\n        onFocus: handleFocus,\n        onKeyDown: handleKeyDown,\n        role: \"gridcell\",\n        focusDate: dayjs(focusDate),\n        tabIndex,\n    };\n\n    return <DayCell {...commonProps} {...getCellStyle()} />;\n};\n"],"names":["SingleCell","date","calendarDate","selectedDate","hoverDate","focusDate","minDate","maxDate","disabledDates","allowDisabledSelection","showActiveMonthDaysOnly","onSelect","onHover","onFocus","setFocusCell","tabIndex","disabled","CalendarHelper","isDisabledDay","interactive","handleSelect","commonProps","currentDateIndicator","format","onKeyDown","event","selectedKey","key","preventDefault","newFocusSelection","action","ArrowLeft","subtract","ArrowRight","add","ArrowUp","ArrowDown","Home","startOf","End","endOf","PageUp","shiftKey","PageDown","handleKeyNavigation","role","dayjs","_jsx","DayCell","Object","assign","props","month","labelType","isSame","isSelected","isHover","circleLeft","circleRight","getCellStyle"],"mappings":"qVAyBO,MAAMA,EAAa,EACtBC,OACAC,eACAC,eACAC,YACAC,YACAC,UACAC,UACAC,gBACAC,yBACAC,0BACAC,WACAC,UACAC,UACAC,eACAC,eAKA,MAAMC,EAAWC,EAAeC,cAC5BjB,EACAO,EACAF,EACAC,GAEEY,GAAeH,GAAYP,EAK3BW,EAAe,KACjBT,EAASV,GAAOkB,EAAY,EA8F1BE,EAA4B,CAC9BpB,OACAC,eACAc,WACAG,cACAG,sBAAsB,EACtBX,SAAUS,EACVR,QAlGgB,KAChBA,EAAQX,EAAKsB,OAAO,eAAgBJ,EAAY,EAkGhDN,QA/FgB,KAChBA,EAAQZ,EAAKsB,OAAO,cAAc,EA+FlCC,UA9DmBC,IACnB,MACMC,EADgBD,EACYE,IAElC,GAAoB,UAAhBD,GAA2C,MAAhBA,EAK3B,OAJAD,EAAMG,sBACFT,GACAC,KArCgB,CAACK,IACzB,IAAII,EAEJ,MAmBMC,EAnBgD,CAClDC,UAAW,IAAM9B,EAAK+B,SAAS,EAAG,OAClCC,WAAY,IAAMhC,EAAKiC,IAAI,EAAG,OAC9BC,QAAS,IAAMlC,EAAK+B,SAAS,EAAG,OAChCI,UAAW,IAAMnC,EAAKiC,IAAI,EAAG,OAC7BG,KAAM,IAAMpC,EAAKqC,QAAQ,QACzBC,IAAK,IAAMtC,EAAKuC,MAAM,QACtBC,OAAQ,IACGhB,EAAMiB,SACPzC,EAAK+B,SAAS,EAAG,QACjB/B,EAAK+B,SAAS,EAAG,SAE3BW,SAAU,IACClB,EAAMiB,SACPzC,EAAKiC,IAAI,EAAG,QACZjC,EAAKiC,IAAI,EAAG,UAIAT,EAAME,KAC5BG,IACAL,EAAMG,iBACNC,EAAoBC,IACpBhB,EAAae,EAAkBN,OAAO,eAC1C,EAeAqB,CAAoBnB,EAAM,EAmD1BoB,KAAM,WACNxC,UAAWyC,EAAMzC,GACjBU,YAGJ,OAAOgC,EAACC,EAAOC,OAAAC,OAAA,CAAA,EAAK7B,EAlDC,MACjB,MAAM8B,EAAwB,CAAA,EAE1BjD,EAAakD,UAAYnD,EAAKmD,QAC9BD,EAAME,UAAY3C,EACZ,SACA,cACCoC,IAAQQ,OAAOrD,EAAM,SAAWe,IACvCmC,EAAME,UAAY,WAGtB,MAAME,EAAapD,GAAgBF,EAAKqD,OAAOnD,EAAc,OACvDqD,EAAUvD,EAAKqD,OAAOlD,EAAW,OAgBvC,OAdImD,GAAcC,GACdL,EAAME,UAAY,iBAClBF,EAAMM,WAAa,yBACnBN,EAAMO,YAAc,0BACbH,GACPJ,EAAME,UAAY,WAClBF,EAAMM,WAAa,mBACnBN,EAAMO,YAAc,oBACbF,IACPL,EAAME,UAAY,QAClBF,EAAMM,WAAa,eACnBN,EAAMO,YAAc,gBAGjBP,CAAK,EAsBqBQ,IAAkB"}

package/shared/internal-calendar/standard/standard-calendar-day-view.styles.js

@@ -1,2 +1,2 @@
-import"./standard-calendar-day-view.styles_1dbvup3.css";const a="w1fb9dn4",d="hd5h60i",r="r7m17b5";export{d as headerCell,r as rowDayCell,a as wrapper};
+import"./standard-calendar-day-view.styles_1bw26au.css";const a="w1fb9dn4",d="hd5h60i",r="r7m17b5";export{d as headerCell,r as rowDayCell,a as wrapper};
 //# sourceMappingURL=standard-calendar-day-view.styles.js.map

package/shared/internal-calendar/standard/standard-calendar-day-view.styles_1bw26au.css

@@ -0,0 +1,3 @@
+.w1fb9dn4{width:100%;display:-ms-grid;display:grid;-ms-grid-columns:repeat(7, 1fr);grid-template-columns:repeat(7, 1fr);row-gap:0.25rem;}
+.hd5h60i{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;height:2.5rem;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-sm);font-weight:var(--fds-font-weight-semibold);line-height:var(--fds-font-body-lh-sm);letter-spacing:var(--fds-font-body-ls-sm);color:var(--fds-colour-text);}
+.r7m17b5{-ms-grid-column:1/-1;grid-column:1/-1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}

package/shared/progress-bar/progress-bar.js

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import r from"clsx";import{useRef as t}from"react";import"../../theme/theme-provider/index.js";import"../../theme/theme-provider/context.js";import"../../theme/tokens/border.js";import{Colour as o}from"../../theme/tokens/colour.js";import"../../theme/tokens/font.js";import"../../theme/tokens/media-query.js";import{useApplyStyle as s}from"../../theme/utils/use-apply-styles.js";import{tokens as m,bar as i}from"./progress-bar.styles.js";const p=({className:p,progress:a,colour:l,"data-testid":n})=>{const c=null!=l?l:o["icon-primary-subtle"],d=t(null);return s(d,{[m.barColour]:c,[m.barWidth]:100*a+"%"}),e("div",{className:r(i,p),"data-testid":n,ref:d,children:e("progress",{value:100*a,max:100})})};export{p as ProgressBar};
+import{jsx as e}from"react/jsx-runtime";import r from"clsx";import{useRef as t}from"react";import"../../theme/theme-provider/index.js";import"../../theme/theme-provider/context.js";import"../../theme/tokens/border.js";import{Colour as o}from"../../theme/tokens/colour.js";import"../../theme/tokens/font.js";import"../../theme/tokens/media-query.js";import{useApplyStyle as s}from"../../theme/utils/use-apply-styles.js";import"../../theme/utils/use-media-query.js";import{tokens as m,bar as i}from"./progress-bar.styles.js";const p=({className:p,progress:a,colour:l,"data-testid":n})=>{const u=null!=l?l:o["icon-primary-subtle"],d=t(null);return s(d,{[m.barColour]:u,[m.barWidth]:100*a+"%"}),e("div",{className:r(i,p),"data-testid":n,ref:d,children:e("progress",{value:100*a,max:100})})};export{p as ProgressBar};
 //# sourceMappingURL=progress-bar.js.map

package/shared/progress-bar/progress-bar.js.map

@@ -1 +1 @@
-{"version":3,"file":"progress-bar.js","sources":["../../../src/shared/progress-bar/progress-bar.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useRef } from \"react\";\n\nimport type { ColourCSSVariableString } from \"../../theme\";\nimport { Colour, useApplyStyle } from \"../../theme\";\nimport * as styles from \"./progress-bar.styles\";\n\ninterface Props {\n    className?: string | undefined;\n    /** Progress from 0 to 1 */\n    progress: number;\n    colour?: string | ColourCSSVariableString | undefined;\n    \"data-testid\"?: string | undefined;\n}\n\nexport const ProgressBar = ({\n    className,\n    progress,\n    colour,\n    \"data-testid\": testId,\n}: Props) => {\n    const colourToUse = colour ?? Colour[\"icon-primary-subtle\"];\n\n    const barRef = useRef<HTMLDivElement>(null);\n\n    useApplyStyle(barRef, {\n        [styles.tokens.barColour]: colourToUse,\n        [styles.tokens.barWidth]: `${progress * 100}%`,\n    });\n\n    return (\n        <div\n            className={clsx(styles.bar, className)}\n            data-testid={testId}\n            ref={barRef}\n        >\n            <progress value={progress * 100} max={100} />\n        </div>\n    );\n};\n"],"names":["ProgressBar","className","progress","colour","testId","colourToUse","Colour","barRef","useRef","useApplyStyle","styles.tokens","barColour","barWidth","_jsx","clsx","styles.bar","ref","children","value","max"],"mappings":"8dAeO,MAAMA,EAAc,EACvBC,YACAC,WACAC,SACA,cAAeC,MAEf,MAAMC,EAAcF,QAAAA,EAAUG,EAAO,uBAE/BC,EAASC,EAAuB,MAOtC,OALAC,EAAcF,EAAQ,CAClB,CAACG,EAAcC,WAAYN,EAC3B,CAACK,EAAcE,UAAyB,IAAXV,EAAH,MAI1BW,EAAA,MAAA,CACIZ,UAAWa,EAAKC,EAAYd,GAAU,cACzBG,EACbY,IAAKT,EAAMU,SAEXJ,EAAA,WAAA,CAAUK,MAAkB,IAAXhB,EAAgBiB,IAAK,OACpC"}
+{"version":3,"file":"progress-bar.js","sources":["../../../src/shared/progress-bar/progress-bar.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useRef } from \"react\";\n\nimport type { ColourCSSVariableString } from \"../../theme\";\nimport { Colour, useApplyStyle } from \"../../theme\";\nimport * as styles from \"./progress-bar.styles\";\n\ninterface Props {\n    className?: string | undefined;\n    /** Progress from 0 to 1 */\n    progress: number;\n    colour?: string | ColourCSSVariableString | undefined;\n    \"data-testid\"?: string | undefined;\n}\n\nexport const ProgressBar = ({\n    className,\n    progress,\n    colour,\n    \"data-testid\": testId,\n}: Props) => {\n    const colourToUse = colour ?? Colour[\"icon-primary-subtle\"];\n\n    const barRef = useRef<HTMLDivElement>(null);\n\n    useApplyStyle(barRef, {\n        [styles.tokens.barColour]: colourToUse,\n        [styles.tokens.barWidth]: `${progress * 100}%`,\n    });\n\n    return (\n        <div\n            className={clsx(styles.bar, className)}\n            data-testid={testId}\n            ref={barRef}\n        >\n            <progress value={progress * 100} max={100} />\n        </div>\n    );\n};\n"],"names":["ProgressBar","className","progress","colour","testId","colourToUse","Colour","barRef","useRef","useApplyStyle","styles.tokens","barColour","barWidth","_jsx","clsx","styles.bar","ref","children","value","max"],"mappings":"2gBAeO,MAAMA,EAAc,EACvBC,YACAC,WACAC,SACA,cAAeC,MAEf,MAAMC,EAAcF,QAAAA,EAAUG,EAAO,uBAE/BC,EAASC,EAAuB,MAOtC,OALAC,EAAcF,EAAQ,CAClB,CAACG,EAAcC,WAAYN,EAC3B,CAACK,EAAcE,UAAyB,IAAXV,EAAH,MAI1BW,EAAA,MAAA,CACIZ,UAAWa,EAAKC,EAAYd,GAAU,cACzBG,EACbY,IAAKT,EAAMU,SAEXJ,EAAA,WAAA,CAAUK,MAAkB,IAAXhB,EAAgBiB,IAAK,OACpC"}

package/shared/standalone-date-input/standalone-date-input.js

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as n}from"react/jsx-runtime";import t from"clsx";import a from"../../external/dayjs/dayjs.min.js";import r from"../../external/dayjs/plugin/customParseFormat.js";import o,{useState as l,useRef as u,useEffect as c,useImperativeHandle as s}from"react";import"../../util/calendar-helper.js";import{DateInputHelper as i}from"../../util/date-input-helper.js";import"../../util/simple-id-generator.js";import{StringHelper as d}from"../../util/string-helper.js";import"@react-aria/live-announcer";import{useStateRef as m}from"../../util/use-state-ref.js";import{inputSection as p,inputContainer as f,baseInput as h,baseInputHover as v,inputSizerBase as g,dayInputSizer as y,divider as Y,dividerInactive as b,dividerHover as x,monthInputSizer as D,yearInputSizer as M,placeholder as j,placeholderDisabled as N,placeholderHide as $}from"./standalone-date-input.styles.js";a.extend(r);const C=({disabled:r,readOnly:o,names:C,value:k,focused:w,hoverValue:B,placeholder:F,label:I,onChange:V,onFocus:L,onBlur:O,hideInputKeyboard:E,inputLabels:K=["Date","Month","Year"]},S)=>{const P=E?"none":"numeric",[R,z,T]=m(""),[q,A,G]=m(""),[H,J,Q]=m(""),[U,W]=l("none"),[X,Z]=l(!1),_=u(null),ee=u(null),ne=u(null),te=u(null),[ae,re,oe]=de(B);c((()=>{var e;const[n="",t="",a=""]=de(k);z(n),A(t),J(a),n||t||a||!_.current||!_.current.contains(document.activeElement)||null===(e=ee.current)||void 0===e||e.focus()}),[k]),c((()=>{var e;w||W("none"),w&&(Z(!0),_.current&&!_.current.contains(document.activeElement)&&(null===(e=ee.current)||void 0===e||e.focus()))}),[w]),s(S,(()=>({ref:_,resetPlaceholder(){Z(!1)},resetInput(){const[e="",n="",t=""]=de(k);z(e),A(n),J(t)},focusYearRef(){var e;null===(e=te.current)||void 0===e||e.focus()}})),[z,A,J,k]);const le=e=>{var n;e.preventDefault(),null===(n=ee.current)||void 0===n||n.focus()},ue=e=>{e.target.select();const n=e.target.name;W(n)},ce=e=>{const[n,t,r]=C,o={[n]:T.current,[t]:G.current,[r]:Q.current},l=e.target.name,u=o[l],c=l!==r?d.padValue(u,!0):u;switch(l){case n:o[n]=c,z(c);break;case t:o[t]=c,A(c)}const s=`${o[r]}-${o[t]}-${o[n]}`,i=a(s,"YYYY-MM-DD",!0).isValid(),m=!o[n]&&!o[t]&&!o[r];i&&u!==c&&V(s),_.current&&!_.current.contains(e.relatedTarget)&&(W("none"),null==O||O(m||i))},se=e=>{var n,t;if(B)return;const r=e.target.name,o=e.target.value.replace(/[^0-9]/g,""),l={day:R,month:q,year:H};switch(r){case C[0]:l.day=o,z(o),2===o.length&&(null===(n=ne.current)||void 0===n||n.focus());break;case C[1]:l.month=o,A(o),2===o.length&&(null===(t=te.current)||void 0===t||t.focus());break;case C[2]:l.year=o,J(o)}if(!l.day&&!l.month&&!l.year)return void V("");const u=`${l.year}-${l.month}-${l.day}`;a(u,"YYYY-MM-DD",!0).isValid()&&V(u)},ie=e=>{var n,t;"Backspace"!==e.code&&"Backspace"!==e.key||(U===C[1]&&0===q.length&&(null===(n=ee.current)||void 0===n||n.focus()),U===C[2]&&0===H.length&&(null===(t=ne.current)||void 0===t||t.focus()))};function de(e){if(e){const n=i.sanitizeInput(e);if(!n)return[void 0,void 0,void 0];const t=a(n,"YYYY-MM-DD",!0);return[d.padValue(t.date().toString()),d.padValue((t.month()+1).toString()),t.year().toString()]}return[void 0,void 0,void 0]}return e("div",{role:"group","aria-label":I,className:p,onClick:()=>{var e;r||o||(Z(!0),_.current&&!_.current.contains(document.activeElement)&&(null===(e=ee.current)||void 0===e||e.focus()))},onFocus:e=>{r||(Z(!0),w||null==L||L(e))},children:[e("div",{ref:_,className:f,children:[n("span",{className:t(g,y),children:n("input",{ref:ee,name:C[0],maxLength:2,value:null!=ae?ae:R,onFocus:ue,onBlur:ce,onChange:se,type:"text",inputMode:P,pattern:"[0-9]{2}","data-testid":`${C[0]}-input`,"aria-label":K[0],disabled:r,readOnly:o,tabIndex:o?-1:0,autoComplete:"off",placeholder:U!==C[0]||o?"DD":"",className:t(h,!!B&&v)})}),n("span",{className:t(Y,0===R.length&&b,!!B&&x),children:"/"}),n("span",{className:t(g,D),children:n("input",{ref:ne,name:C[1],maxLength:2,value:null!=re?re:q,onFocus:ue,onBlur:ce,onChange:se,onKeyDown:ie,type:"text",inputMode:P,pattern:"[0-9]{2}","data-testid":`${C[1]}-input`,"aria-label":K[1],disabled:r,readOnly:o,tabIndex:o?-1:0,autoComplete:"off",placeholder:U!==C[1]||o?"MM":"",className:t(h,!!B&&v)})}),n("span",{className:t(Y,0===q.length&&b,!!B&&x),children:"/"}),n("span",{className:t(g,M),children:n("input",{ref:te,name:C[2],maxLength:4,value:null!=oe?oe:H,onFocus:ue,onBlur:ce,onChange:se,onKeyDown:ie,type:"text",inputMode:P,pattern:"[0-9]{4}","data-testid":`${C[2]}-input`,"aria-label":K[2],disabled:r,readOnly:o,tabIndex:o?-1:0,autoComplete:"off",placeholder:U!==C[2]||o?"YYYY":"",className:t(h,!!B&&v)})})]}),(()=>{if(!k&&!o&&F)return n("div",{className:t(j,r&&N,X&&$),onMouseDown:le,children:F})})()]})},k=o.forwardRef(C);export{C as Component,k as StandaloneDateInput};
+import{jsxs as e,jsx as n}from"react/jsx-runtime";import t from"clsx";import a from"../../external/dayjs/dayjs.min.js";import r from"../../external/dayjs/plugin/customParseFormat.js";import o,{useState as l,useRef as u,useEffect as c,useImperativeHandle as s}from"react";import"../../util/calendar-helper.js";import{DateInputHelper as i}from"../../util/date-input-helper.js";import"../../util/simple-id-generator.js";import{StringHelper as d}from"../../util/string-helper.js";import"@react-aria/live-announcer";import{useStateRef as m}from"../../util/use-state-ref.js";import{inputSection as p,inputContainer as f,baseInput as h,baseInputHover as v,inputSizerBase as g,dayInputSizer as y,divider as Y,dividerHover as b,dividerDisabled as x,dividerInactive as D,monthInputSizer as M,yearInputSizer as j,placeholder as N,placeholderDisabled as $,placeholderHide as C}from"./standalone-date-input.styles.js";a.extend(r);const k=({disabled:r,readOnly:o,names:k,value:w,focused:B,hoverValue:F,placeholder:I,label:V,onChange:L,onFocus:O,onBlur:E,hideInputKeyboard:K,inputLabels:S=["Date","Month","Year"]},P)=>{const R=K?"none":"numeric",[z,T,q]=m(""),[A,G,H]=m(""),[J,Q,U]=m(""),[W,X]=l("none"),[Z,_]=l(!1),ee=u(null),ne=u(null),te=u(null),ae=u(null),[re,oe,le]=me(F);c((()=>{var e;const[n="",t="",a=""]=me(w);T(n),G(t),Q(a),n||t||a||!ee.current||!ee.current.contains(document.activeElement)||null===(e=ne.current)||void 0===e||e.focus()}),[w]),c((()=>{var e;B||X("none"),B&&(_(!0),ee.current&&!ee.current.contains(document.activeElement)&&(null===(e=ne.current)||void 0===e||e.focus()))}),[B]),s(P,(()=>({ref:ee,resetPlaceholder(){_(!1)},resetInput(){const[e="",n="",t=""]=me(w);T(e),G(n),Q(t)},focusYearRef(){var e;null===(e=ae.current)||void 0===e||e.focus()}})),[T,G,Q,w]);const ue=e=>{var n;e.preventDefault(),null===(n=ne.current)||void 0===n||n.focus()},ce=e=>{e.target.select();const n=e.target.name;X(n)},se=e=>{const[n,t,r]=k,o={[n]:q.current,[t]:H.current,[r]:U.current},l=e.target.name,u=o[l],c=l!==r?d.padValue(u,!0):u;switch(l){case n:o[n]=c,T(c);break;case t:o[t]=c,G(c)}const s=`${o[r]}-${o[t]}-${o[n]}`,i=a(s,"YYYY-MM-DD",!0).isValid(),m=!o[n]&&!o[t]&&!o[r];i&&u!==c&&L(s),ee.current&&!ee.current.contains(e.relatedTarget)&&(X("none"),null==E||E(m||i))},ie=e=>{var n,t;if(F)return;const r=e.target.name,o=e.target.value.replace(/[^0-9]/g,""),l={day:z,month:A,year:J};switch(r){case k[0]:l.day=o,T(o),2===o.length&&(null===(n=te.current)||void 0===n||n.focus());break;case k[1]:l.month=o,G(o),2===o.length&&(null===(t=ae.current)||void 0===t||t.focus());break;case k[2]:l.year=o,Q(o)}if(!l.day&&!l.month&&!l.year)return void L("");const u=`${l.year}-${l.month}-${l.day}`;a(u,"YYYY-MM-DD",!0).isValid()&&L(u)},de=e=>{var n,t;"Backspace"!==e.code&&"Backspace"!==e.key||(W===k[1]&&0===A.length&&(null===(n=ne.current)||void 0===n||n.focus()),W===k[2]&&0===J.length&&(null===(t=te.current)||void 0===t||t.focus()))};function me(e){if(e){const n=i.sanitizeInput(e);if(!n)return[void 0,void 0,void 0];const t=a(n,"YYYY-MM-DD",!0);return[d.padValue(t.date().toString()),d.padValue((t.month()+1).toString()),t.year().toString()]}return[void 0,void 0,void 0]}return e("div",{role:"group","aria-label":V,className:p,onClick:()=>{var e;r||o||(_(!0),ee.current&&!ee.current.contains(document.activeElement)&&(null===(e=ne.current)||void 0===e||e.focus()))},onFocus:e=>{r||(_(!0),B||null==O||O(e))},children:[e("div",{ref:ee,className:f,children:[n("span",{className:t(g,y),children:n("input",{ref:ne,name:k[0],maxLength:2,value:null!=re?re:z,onFocus:ce,onBlur:se,onChange:ie,type:"text",inputMode:R,pattern:"[0-9]{2}","data-testid":`${k[0]}-input`,"aria-label":S[0],disabled:r,readOnly:o,tabIndex:o?-1:0,autoComplete:"off",placeholder:W!==k[0]||o?"DD":"",className:t(h,!!F&&v)})}),n("span",{className:t(Y,!!F&&b,r&&x,!r&&0===z.length&&D),children:"/"}),n("span",{className:t(g,M),children:n("input",{ref:te,name:k[1],maxLength:2,value:null!=oe?oe:A,onFocus:ce,onBlur:se,onChange:ie,onKeyDown:de,type:"text",inputMode:R,pattern:"[0-9]{2}","data-testid":`${k[1]}-input`,"aria-label":S[1],disabled:r,readOnly:o,tabIndex:o?-1:0,autoComplete:"off",placeholder:W!==k[1]||o?"MM":"",className:t(h,!!F&&v)})}),n("span",{className:t(Y,!!F&&b,r&&x,!r&&0===A.length&&D),children:"/"}),n("span",{className:t(g,j),children:n("input",{ref:ae,name:k[2],maxLength:4,value:null!=le?le:J,onFocus:ce,onBlur:se,onChange:ie,onKeyDown:de,type:"text",inputMode:R,pattern:"[0-9]{4}","data-testid":`${k[2]}-input`,"aria-label":S[2],disabled:r,readOnly:o,tabIndex:o?-1:0,autoComplete:"off",placeholder:W!==k[2]||o?"YYYY":"",className:t(h,!!F&&v)})})]}),(()=>{if(!w&&!o&&I)return n("div",{className:t(N,r&&$,Z&&C),onMouseDown:ue,children:I})})()]})},w=o.forwardRef(k);export{k as Component,w as StandaloneDateInput};
 //# sourceMappingURL=standalone-date-input.js.map

package/shared/standalone-date-input/standalone-date-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"standalone-date-input.js","sources":["../../../src/shared/standalone-date-input/standalone-date-input.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport dayjs from \"dayjs\";\nimport customParseFormat from \"dayjs/plugin/customParseFormat\";\nimport React, { useEffect, useImperativeHandle, useRef, useState } from \"react\";\n\nimport { DateInputHelper, StringHelper, useStateRef } from \"../../util\";\nimport * as styles from \"./standalone-date-input.styles\";\n\ndayjs.extend(customParseFormat);\n\ntype StartInputNames = [\"start-day\", \"start-month\", \"start-year\"];\ntype EndInputNames = [\"end-day\", \"end-month\", \"end-year\"];\n\nexport type FieldType =\n    | StartInputNames[number]\n    | EndInputNames[number]\n    | \"none\";\n\ninterface Props {\n    disabled?: boolean | undefined;\n    readOnly?: boolean | undefined;\n    hideInputKeyboard?: boolean | undefined;\n    names: StartInputNames | EndInputNames;\n    value: string | undefined;\n    hoverValue?: string | undefined;\n    focused: boolean;\n    placeholder?: string | undefined;\n    label?: string | undefined;\n    inputLabels?: string[] | undefined;\n    onChange: (value: string) => void;\n    onFocus?: ((event: React.FocusEvent) => void) | undefined;\n    onBlur?: ((valid: boolean) => void) | undefined;\n}\n\nexport interface StandaloneDateInputRef {\n    ref: React.RefObject<HTMLDivElement>;\n    resetPlaceholder: () => void;\n    resetInput: () => void;\n    focusYearRef: () => void;\n}\n\nexport const Component = (\n    {\n        disabled,\n        readOnly,\n        names,\n        value,\n        focused,\n        hoverValue,\n        placeholder,\n        label,\n        onChange,\n        onFocus,\n        onBlur,\n        hideInputKeyboard,\n        inputLabels = [\"Date\", \"Month\", \"Year\"],\n    }: Props,\n    ref: React.ForwardedRef<StandaloneDateInputRef>\n) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const inputMode = hideInputKeyboard ? \"none\" : \"numeric\";\n\n    const [dayValue, setDayValue, dayValueRef] = useStateRef<string>(\"\");\n    const [monthValue, setMonthValue, monthValueRef] = useStateRef<string>(\"\");\n    const [yearValue, setYearValue, yearValueRef] = useStateRef<string>(\"\");\n    const [currentFocus, setCurrentFocus] = useState<FieldType>(\"none\");\n    const [hidePlaceholder, setHidePlaceholder] = useState<boolean>(false);\n\n    const nodeRef = useRef<HTMLDivElement>(null);\n    const dayInputRef = useRef<HTMLInputElement>(null);\n    const monthInputRef = useRef<HTMLInputElement>(null);\n    const yearInputRef = useRef<HTMLInputElement>(null);\n\n    const [hoverDayValue, hoverMonthValue, hoverYearValue] =\n        parseToInputValues(hoverValue);\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEffect(() => {\n        const [day = \"\", month = \"\", year = \"\"] = parseToInputValues(value);\n        setDayValue(day);\n        setMonthValue(month);\n        setYearValue(year);\n\n        // re-focus on day input if all 3 inputs get cleared while typing\n        if (\n            !day &&\n            !month &&\n            !year &&\n            nodeRef.current &&\n            nodeRef.current.contains(document.activeElement)\n        )\n            dayInputRef.current?.focus();\n    }, [value]);\n\n    useEffect(() => {\n        // clear internal focus state\n        if (!focused) {\n            setCurrentFocus(\"none\");\n        }\n\n        // ensure at least one input is focused\n        if (focused) {\n            setHidePlaceholder(true);\n\n            if (\n                nodeRef.current &&\n                !nodeRef.current.contains(document.activeElement)\n            ) {\n                dayInputRef.current?.focus();\n            }\n        }\n    }, [focused]);\n\n    useImperativeHandle(\n        ref,\n        () => ({\n            ref: nodeRef,\n            resetPlaceholder() {\n                setHidePlaceholder(false);\n            },\n            resetInput() {\n                const [day = \"\", month = \"\", year = \"\"] =\n                    parseToInputValues(value);\n                setDayValue(day);\n                setMonthValue(month);\n                setYearValue(year);\n            },\n            focusYearRef() {\n                yearInputRef.current?.focus();\n            },\n        }),\n        [setDayValue, setMonthValue, setYearValue, value]\n    );\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleSectionClick = () => {\n        if (disabled || readOnly) {\n            return;\n        }\n\n        setHidePlaceholder(true);\n\n        if (\n            nodeRef.current &&\n            !nodeRef.current.contains(document.activeElement)\n        ) {\n            dayInputRef.current?.focus();\n        }\n    };\n\n    const handleSectionFocus = (event: React.FocusEvent) => {\n        if (disabled) {\n            return;\n        }\n\n        setHidePlaceholder(true);\n\n        if (!focused) {\n            onFocus?.(event);\n        }\n    };\n\n    const handlePlaceholderClick = (event: React.MouseEvent) => {\n        event.preventDefault();\n        dayInputRef.current?.focus();\n    };\n\n    const handleInputFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n        event.target.select();\n        const targetName = event.target.name as FieldType;\n        setCurrentFocus(targetName);\n    };\n\n    const handleInputBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n        const [dayName, monthName, yearName] = names;\n        const date = {\n            [dayName]: dayValueRef.current,\n            [monthName]: monthValueRef.current,\n            [yearName]: yearValueRef.current,\n        };\n\n        const targetName = event.target.name as FieldType;\n        const targetValue = date[targetName];\n\n        // pad single digits for day and month inputs\n\n        const paddedValue =\n            targetName !== yearName\n                ? StringHelper.padValue(targetValue, true)\n                : targetValue;\n\n        switch (targetName) {\n            case dayName:\n                date[dayName] = paddedValue;\n                setDayValue(paddedValue);\n                break;\n            case monthName:\n                date[monthName] = paddedValue;\n                setMonthValue(paddedValue);\n                break;\n            case yearName:\n            default:\n                break;\n        }\n\n        const value = `${date[yearName]}-${date[monthName]}-${date[dayName]}`;\n        const isValid = dayjs(value, \"YYYY-MM-DD\", true).isValid();\n        const isEmpty = !date[dayName] && !date[monthName] && !date[yearName];\n        const isPadded = targetValue !== paddedValue;\n\n        if (isValid && isPadded) {\n            onChange(value);\n        }\n\n        if (nodeRef.current && !nodeRef.current.contains(event.relatedTarget)) {\n            // entire field was blurred\n            setCurrentFocus(\"none\");\n            onBlur?.(isEmpty || isValid);\n        }\n    };\n\n    const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n        if (hoverValue) {\n            // do not modify inputs when selecting date from another source\n            return;\n        }\n\n        const targetName = event.target.name as FieldType;\n        const targetValue = event.target.value.replace(/[^0-9]/g, \"\");\n\n        const date = {\n            day: dayValue,\n            month: monthValue,\n            year: yearValue,\n        };\n\n        switch (targetName) {\n            case names[0]:\n                date.day = targetValue;\n                setDayValue(targetValue);\n                // auto focus the next input once filled in\n                if (targetValue.length === 2) {\n                    monthInputRef.current?.focus();\n                }\n                break;\n            case names[1]:\n                date.month = targetValue;\n                setMonthValue(targetValue);\n                // auto focus the next input once filled in\n                if (targetValue.length === 2) {\n                    yearInputRef.current?.focus();\n                }\n                break;\n            case names[2]:\n                date.year = targetValue;\n                setYearValue(targetValue);\n                break;\n            default:\n                break;\n        }\n\n        if (!date.day && !date.month && !date.year) {\n            onChange(\"\");\n            return;\n        }\n\n        const value = `${date.year}-${date.month}-${date.day}`;\n        const isValid = dayjs(value, \"YYYY-MM-DD\", true).isValid();\n\n        if (isValid) {\n            onChange(value);\n        }\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n        /**\n         * Allow going to the field before if user presses Backspace\n         * on an empty field\n         */\n        if (event.code === \"Backspace\" || event.key === \"Backspace\") {\n            if (currentFocus === names[1] && monthValue.length === 0) {\n                dayInputRef.current?.focus();\n            }\n\n            if (currentFocus === names[2] && yearValue.length === 0) {\n                monthInputRef.current?.focus();\n            }\n        }\n    };\n\n    // =============================================================================\n    // HELPERS\n    // =============================================================================\n    function parseToInputValues(stringVal: string | undefined) {\n        if (!stringVal) {\n            return [undefined, undefined, undefined];\n        } else {\n            const sanitized = DateInputHelper.sanitizeInput(stringVal);\n\n            if (!sanitized) {\n                return [undefined, undefined, undefined];\n            }\n\n            const day = dayjs(sanitized, \"YYYY-MM-DD\", true);\n\n            return [\n                StringHelper.padValue(day.date().toString()),\n                StringHelper.padValue((day.month() + 1).toString()),\n                day.year().toString(),\n            ];\n        }\n    }\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderPlaceholder = () => {\n        if (value || readOnly || !placeholder) {\n            return;\n        }\n\n        return (\n            <div\n                className={clsx(\n                    styles.placeholder,\n                    disabled && styles.placeholderDisabled,\n                    hidePlaceholder && styles.placeholderHide\n                )}\n                onMouseDown={handlePlaceholderClick}\n            >\n                {placeholder}\n            </div>\n        );\n    };\n\n    return (\n        <div\n            role=\"group\"\n            aria-label={label}\n            className={styles.inputSection}\n            onClick={handleSectionClick}\n            onFocus={handleSectionFocus}\n        >\n            <div ref={nodeRef} className={styles.inputContainer}>\n                <span\n                    className={clsx(\n                        styles.inputSizerBase,\n                        styles.dayInputSizer\n                    )}\n                >\n                    <input\n                        ref={dayInputRef}\n                        name={names[0]}\n                        maxLength={2}\n                        value={hoverDayValue ?? dayValue}\n                        onFocus={handleInputFocus}\n                        onBlur={handleInputBlur}\n                        onChange={handleInputChange}\n                        type=\"text\"\n                        inputMode={inputMode}\n                        pattern=\"[0-9]{2}\"\n                        data-testid={`${names[0]}-input`}\n                        aria-label={inputLabels[0]}\n                        disabled={disabled}\n                        readOnly={readOnly}\n                        tabIndex={readOnly ? -1 : 0}\n                        autoComplete=\"off\"\n                        placeholder={\n                            currentFocus === names[0] && !readOnly ? \"\" : \"DD\"\n                        }\n                        className={clsx(\n                            styles.baseInput,\n                            !!hoverValue && styles.baseInputHover\n                        )}\n                    />\n                </span>\n                <span\n                    className={clsx(\n                        styles.divider,\n                        dayValue.length === 0 && styles.dividerInactive,\n                        !!hoverValue && styles.dividerHover\n                    )}\n                >\n                    /\n                </span>\n                <span\n                    className={clsx(\n                        styles.inputSizerBase,\n                        styles.monthInputSizer\n                    )}\n                >\n                    <input\n                        ref={monthInputRef}\n                        name={names[1]}\n                        maxLength={2}\n                        value={hoverMonthValue ?? monthValue}\n                        onFocus={handleInputFocus}\n                        onBlur={handleInputBlur}\n                        onChange={handleInputChange}\n                        onKeyDown={handleKeyDown}\n                        type=\"text\"\n                        inputMode={inputMode}\n                        pattern=\"[0-9]{2}\"\n                        data-testid={`${names[1]}-input`}\n                        aria-label={inputLabels[1]}\n                        disabled={disabled}\n                        readOnly={readOnly}\n                        tabIndex={readOnly ? -1 : 0}\n                        autoComplete=\"off\"\n                        placeholder={\n                            currentFocus === names[1] && !readOnly ? \"\" : \"MM\"\n                        }\n                        className={clsx(\n                            styles.baseInput,\n                            !!hoverValue && styles.baseInputHover\n                        )}\n                    />\n                </span>\n                <span\n                    className={clsx(\n                        styles.divider,\n                        monthValue.length === 0 && styles.dividerInactive,\n                        !!hoverValue && styles.dividerHover\n                    )}\n                >\n                    /\n                </span>\n                <span\n                    className={clsx(\n                        styles.inputSizerBase,\n                        styles.yearInputSizer\n                    )}\n                >\n                    <input\n                        ref={yearInputRef}\n                        name={names[2]}\n                        maxLength={4}\n                        value={hoverYearValue ?? yearValue}\n                        onFocus={handleInputFocus}\n                        onBlur={handleInputBlur}\n                        onChange={handleInputChange}\n                        onKeyDown={handleKeyDown}\n                        type=\"text\"\n                        inputMode={inputMode}\n                        pattern=\"[0-9]{4}\"\n                        data-testid={`${names[2]}-input`}\n                        aria-label={inputLabels[2]}\n                        disabled={disabled}\n                        readOnly={readOnly}\n                        tabIndex={readOnly ? -1 : 0}\n                        autoComplete=\"off\"\n                        placeholder={\n                            currentFocus === names[2] && !readOnly ? \"\" : \"YYYY\"\n                        }\n                        className={clsx(\n                            styles.baseInput,\n                            !!hoverValue && styles.baseInputHover\n                        )}\n                    />\n                </span>\n            </div>\n            {renderPlaceholder()}\n        </div>\n    );\n};\n\nexport const StandaloneDateInput = React.forwardRef(Component);\n"],"names":["dayjs","extend","customParseFormat","Component","disabled","readOnly","names","value","focused","hoverValue","placeholder","label","onChange","onFocus","onBlur","hideInputKeyboard","inputLabels","ref","inputMode","dayValue","setDayValue","dayValueRef","useStateRef","monthValue","setMonthValue","monthValueRef","yearValue","setYearValue","yearValueRef","currentFocus","setCurrentFocus","useState","hidePlaceholder","setHidePlaceholder","nodeRef","useRef","dayInputRef","monthInputRef","yearInputRef","hoverDayValue","hoverMonthValue","hoverYearValue","parseToInputValues","useEffect","day","month","year","current","contains","document","activeElement","_a","focus","useImperativeHandle","resetPlaceholder","resetInput","focusYearRef","handlePlaceholderClick","event","preventDefault","handleInputFocus","target","select","targetName","name","handleInputBlur","dayName","monthName","yearName","date","targetValue","paddedValue","StringHelper","padValue","isValid","isEmpty","relatedTarget","handleInputChange","replace","length","_b","handleKeyDown","code","key","stringVal","sanitized","DateInputHelper","sanitizeInput","undefined","toString","_jsxs","role","className","styles.inputSection","onClick","children","styles.inputContainer","_jsx","clsx","styles.inputSizerBase","styles.dayInputSizer","maxLength","type","pattern","tabIndex","autoComplete","styles.baseInput","styles.baseInputHover","styles.divider","styles.dividerInactive","styles.dividerHover","styles.monthInputSizer","onKeyDown","styles.yearInputSizer","styles.placeholder","styles.placeholderDisabled","styles.placeholderHide","onMouseDown","renderPlaceholder","StandaloneDateInput","React","forwardRef"],"mappings":"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"}
+{"version":3,"file":"standalone-date-input.js","sources":["../../../src/shared/standalone-date-input/standalone-date-input.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport dayjs from \"dayjs\";\nimport customParseFormat from \"dayjs/plugin/customParseFormat\";\nimport React, { useEffect, useImperativeHandle, useRef, useState } from \"react\";\n\nimport { DateInputHelper, StringHelper, useStateRef } from \"../../util\";\nimport * as styles from \"./standalone-date-input.styles\";\n\ndayjs.extend(customParseFormat);\n\ntype StartInputNames = [\"start-day\", \"start-month\", \"start-year\"];\ntype EndInputNames = [\"end-day\", \"end-month\", \"end-year\"];\n\nexport type FieldType =\n    | StartInputNames[number]\n    | EndInputNames[number]\n    | \"none\";\n\ninterface Props {\n    disabled?: boolean | undefined;\n    readOnly?: boolean | undefined;\n    hideInputKeyboard?: boolean | undefined;\n    names: StartInputNames | EndInputNames;\n    value: string | undefined;\n    hoverValue?: string | undefined;\n    focused: boolean;\n    placeholder?: string | undefined;\n    label?: string | undefined;\n    inputLabels?: string[] | undefined;\n    onChange: (value: string) => void;\n    onFocus?: ((event: React.FocusEvent) => void) | undefined;\n    onBlur?: ((valid: boolean) => void) | undefined;\n}\n\nexport interface StandaloneDateInputRef {\n    ref: React.RefObject<HTMLDivElement>;\n    resetPlaceholder: () => void;\n    resetInput: () => void;\n    focusYearRef: () => void;\n}\n\nexport const Component = (\n    {\n        disabled,\n        readOnly,\n        names,\n        value,\n        focused,\n        hoverValue,\n        placeholder,\n        label,\n        onChange,\n        onFocus,\n        onBlur,\n        hideInputKeyboard,\n        inputLabels = [\"Date\", \"Month\", \"Year\"],\n    }: Props,\n    ref: React.ForwardedRef<StandaloneDateInputRef>\n) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const inputMode = hideInputKeyboard ? \"none\" : \"numeric\";\n\n    const [dayValue, setDayValue, dayValueRef] = useStateRef<string>(\"\");\n    const [monthValue, setMonthValue, monthValueRef] = useStateRef<string>(\"\");\n    const [yearValue, setYearValue, yearValueRef] = useStateRef<string>(\"\");\n    const [currentFocus, setCurrentFocus] = useState<FieldType>(\"none\");\n    const [hidePlaceholder, setHidePlaceholder] = useState<boolean>(false);\n\n    const nodeRef = useRef<HTMLDivElement>(null);\n    const dayInputRef = useRef<HTMLInputElement>(null);\n    const monthInputRef = useRef<HTMLInputElement>(null);\n    const yearInputRef = useRef<HTMLInputElement>(null);\n\n    const [hoverDayValue, hoverMonthValue, hoverYearValue] =\n        parseToInputValues(hoverValue);\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEffect(() => {\n        const [day = \"\", month = \"\", year = \"\"] = parseToInputValues(value);\n        setDayValue(day);\n        setMonthValue(month);\n        setYearValue(year);\n\n        // re-focus on day input if all 3 inputs get cleared while typing\n        if (\n            !day &&\n            !month &&\n            !year &&\n            nodeRef.current &&\n            nodeRef.current.contains(document.activeElement)\n        )\n            dayInputRef.current?.focus();\n    }, [value]);\n\n    useEffect(() => {\n        // clear internal focus state\n        if (!focused) {\n            setCurrentFocus(\"none\");\n        }\n\n        // ensure at least one input is focused\n        if (focused) {\n            setHidePlaceholder(true);\n\n            if (\n                nodeRef.current &&\n                !nodeRef.current.contains(document.activeElement)\n            ) {\n                dayInputRef.current?.focus();\n            }\n        }\n    }, [focused]);\n\n    useImperativeHandle(\n        ref,\n        () => ({\n            ref: nodeRef,\n            resetPlaceholder() {\n                setHidePlaceholder(false);\n            },\n            resetInput() {\n                const [day = \"\", month = \"\", year = \"\"] =\n                    parseToInputValues(value);\n                setDayValue(day);\n                setMonthValue(month);\n                setYearValue(year);\n            },\n            focusYearRef() {\n                yearInputRef.current?.focus();\n            },\n        }),\n        [setDayValue, setMonthValue, setYearValue, value]\n    );\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleSectionClick = () => {\n        if (disabled || readOnly) {\n            return;\n        }\n\n        setHidePlaceholder(true);\n\n        if (\n            nodeRef.current &&\n            !nodeRef.current.contains(document.activeElement)\n        ) {\n            dayInputRef.current?.focus();\n        }\n    };\n\n    const handleSectionFocus = (event: React.FocusEvent) => {\n        if (disabled) {\n            return;\n        }\n\n        setHidePlaceholder(true);\n\n        if (!focused) {\n            onFocus?.(event);\n        }\n    };\n\n    const handlePlaceholderClick = (event: React.MouseEvent) => {\n        event.preventDefault();\n        dayInputRef.current?.focus();\n    };\n\n    const handleInputFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n        event.target.select();\n        const targetName = event.target.name as FieldType;\n        setCurrentFocus(targetName);\n    };\n\n    const handleInputBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n        const [dayName, monthName, yearName] = names;\n        const date = {\n            [dayName]: dayValueRef.current,\n            [monthName]: monthValueRef.current,\n            [yearName]: yearValueRef.current,\n        };\n\n        const targetName = event.target.name as FieldType;\n        const targetValue = date[targetName];\n\n        // pad single digits for day and month inputs\n\n        const paddedValue =\n            targetName !== yearName\n                ? StringHelper.padValue(targetValue, true)\n                : targetValue;\n\n        switch (targetName) {\n            case dayName:\n                date[dayName] = paddedValue;\n                setDayValue(paddedValue);\n                break;\n            case monthName:\n                date[monthName] = paddedValue;\n                setMonthValue(paddedValue);\n                break;\n            case yearName:\n            default:\n                break;\n        }\n\n        const value = `${date[yearName]}-${date[monthName]}-${date[dayName]}`;\n        const isValid = dayjs(value, \"YYYY-MM-DD\", true).isValid();\n        const isEmpty = !date[dayName] && !date[monthName] && !date[yearName];\n        const isPadded = targetValue !== paddedValue;\n\n        if (isValid && isPadded) {\n            onChange(value);\n        }\n\n        if (nodeRef.current && !nodeRef.current.contains(event.relatedTarget)) {\n            // entire field was blurred\n            setCurrentFocus(\"none\");\n            onBlur?.(isEmpty || isValid);\n        }\n    };\n\n    const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n        if (hoverValue) {\n            // do not modify inputs when selecting date from another source\n            return;\n        }\n\n        const targetName = event.target.name as FieldType;\n        const targetValue = event.target.value.replace(/[^0-9]/g, \"\");\n\n        const date = {\n            day: dayValue,\n            month: monthValue,\n            year: yearValue,\n        };\n\n        switch (targetName) {\n            case names[0]:\n                date.day = targetValue;\n                setDayValue(targetValue);\n                // auto focus the next input once filled in\n                if (targetValue.length === 2) {\n                    monthInputRef.current?.focus();\n                }\n                break;\n            case names[1]:\n                date.month = targetValue;\n                setMonthValue(targetValue);\n                // auto focus the next input once filled in\n                if (targetValue.length === 2) {\n                    yearInputRef.current?.focus();\n                }\n                break;\n            case names[2]:\n                date.year = targetValue;\n                setYearValue(targetValue);\n                break;\n            default:\n                break;\n        }\n\n        if (!date.day && !date.month && !date.year) {\n            onChange(\"\");\n            return;\n        }\n\n        const value = `${date.year}-${date.month}-${date.day}`;\n        const isValid = dayjs(value, \"YYYY-MM-DD\", true).isValid();\n\n        if (isValid) {\n            onChange(value);\n        }\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n        /**\n         * Allow going to the field before if user presses Backspace\n         * on an empty field\n         */\n        if (event.code === \"Backspace\" || event.key === \"Backspace\") {\n            if (currentFocus === names[1] && monthValue.length === 0) {\n                dayInputRef.current?.focus();\n            }\n\n            if (currentFocus === names[2] && yearValue.length === 0) {\n                monthInputRef.current?.focus();\n            }\n        }\n    };\n\n    // =============================================================================\n    // HELPERS\n    // =============================================================================\n    function parseToInputValues(stringVal: string | undefined) {\n        if (!stringVal) {\n            return [undefined, undefined, undefined];\n        } else {\n            const sanitized = DateInputHelper.sanitizeInput(stringVal);\n\n            if (!sanitized) {\n                return [undefined, undefined, undefined];\n            }\n\n            const day = dayjs(sanitized, \"YYYY-MM-DD\", true);\n\n            return [\n                StringHelper.padValue(day.date().toString()),\n                StringHelper.padValue((day.month() + 1).toString()),\n                day.year().toString(),\n            ];\n        }\n    }\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderPlaceholder = () => {\n        if (value || readOnly || !placeholder) {\n            return;\n        }\n\n        return (\n            <div\n                className={clsx(\n                    styles.placeholder,\n                    disabled && styles.placeholderDisabled,\n                    hidePlaceholder && styles.placeholderHide\n                )}\n                onMouseDown={handlePlaceholderClick}\n            >\n                {placeholder}\n            </div>\n        );\n    };\n\n    return (\n        <div\n            role=\"group\"\n            aria-label={label}\n            className={styles.inputSection}\n            onClick={handleSectionClick}\n            onFocus={handleSectionFocus}\n        >\n            <div ref={nodeRef} className={styles.inputContainer}>\n                <span\n                    className={clsx(\n                        styles.inputSizerBase,\n                        styles.dayInputSizer\n                    )}\n                >\n                    <input\n                        ref={dayInputRef}\n                        name={names[0]}\n                        maxLength={2}\n                        value={hoverDayValue ?? dayValue}\n                        onFocus={handleInputFocus}\n                        onBlur={handleInputBlur}\n                        onChange={handleInputChange}\n                        type=\"text\"\n                        inputMode={inputMode}\n                        pattern=\"[0-9]{2}\"\n                        data-testid={`${names[0]}-input`}\n                        aria-label={inputLabels[0]}\n                        disabled={disabled}\n                        readOnly={readOnly}\n                        tabIndex={readOnly ? -1 : 0}\n                        autoComplete=\"off\"\n                        placeholder={\n                            currentFocus === names[0] && !readOnly ? \"\" : \"DD\"\n                        }\n                        className={clsx(\n                            styles.baseInput,\n                            !!hoverValue && styles.baseInputHover\n                        )}\n                    />\n                </span>\n                <span\n                    className={clsx(\n                        styles.divider,\n                        !!hoverValue && styles.dividerHover,\n                        disabled && styles.dividerDisabled,\n                        !disabled &&\n                            dayValue.length === 0 &&\n                            styles.dividerInactive\n                    )}\n                >\n                    /\n                </span>\n                <span\n                    className={clsx(\n                        styles.inputSizerBase,\n                        styles.monthInputSizer\n                    )}\n                >\n                    <input\n                        ref={monthInputRef}\n                        name={names[1]}\n                        maxLength={2}\n                        value={hoverMonthValue ?? monthValue}\n                        onFocus={handleInputFocus}\n                        onBlur={handleInputBlur}\n                        onChange={handleInputChange}\n                        onKeyDown={handleKeyDown}\n                        type=\"text\"\n                        inputMode={inputMode}\n                        pattern=\"[0-9]{2}\"\n                        data-testid={`${names[1]}-input`}\n                        aria-label={inputLabels[1]}\n                        disabled={disabled}\n                        readOnly={readOnly}\n                        tabIndex={readOnly ? -1 : 0}\n                        autoComplete=\"off\"\n                        placeholder={\n                            currentFocus === names[1] && !readOnly ? \"\" : \"MM\"\n                        }\n                        className={clsx(\n                            styles.baseInput,\n                            !!hoverValue && styles.baseInputHover\n                        )}\n                    />\n                </span>\n                <span\n                    className={clsx(\n                        styles.divider,\n                        !!hoverValue && styles.dividerHover,\n                        disabled && styles.dividerDisabled,\n                        !disabled &&\n                            monthValue.length === 0 &&\n                            styles.dividerInactive\n                    )}\n                >\n                    /\n                </span>\n                <span\n                    className={clsx(\n                        styles.inputSizerBase,\n                        styles.yearInputSizer\n                    )}\n                >\n                    <input\n                        ref={yearInputRef}\n                        name={names[2]}\n                        maxLength={4}\n                        value={hoverYearValue ?? yearValue}\n                        onFocus={handleInputFocus}\n                        onBlur={handleInputBlur}\n                        onChange={handleInputChange}\n                        onKeyDown={handleKeyDown}\n                        type=\"text\"\n                        inputMode={inputMode}\n                        pattern=\"[0-9]{4}\"\n                        data-testid={`${names[2]}-input`}\n                        aria-label={inputLabels[2]}\n                        disabled={disabled}\n                        readOnly={readOnly}\n                        tabIndex={readOnly ? -1 : 0}\n                        autoComplete=\"off\"\n                        placeholder={\n                            currentFocus === names[2] && !readOnly ? \"\" : \"YYYY\"\n                        }\n                        className={clsx(\n                            styles.baseInput,\n                            !!hoverValue && styles.baseInputHover\n                        )}\n                    />\n                </span>\n            </div>\n            {renderPlaceholder()}\n        </div>\n    );\n};\n\nexport const StandaloneDateInput = React.forwardRef(Component);\n"],"names":["dayjs","extend","customParseFormat","Component","disabled","readOnly","names","value","focused","hoverValue","placeholder","label","onChange","onFocus","onBlur","hideInputKeyboard","inputLabels","ref","inputMode","dayValue","setDayValue","dayValueRef","useStateRef","monthValue","setMonthValue","monthValueRef","yearValue","setYearValue","yearValueRef","currentFocus","setCurrentFocus","useState","hidePlaceholder","setHidePlaceholder","nodeRef","useRef","dayInputRef","monthInputRef","yearInputRef","hoverDayValue","hoverMonthValue","hoverYearValue","parseToInputValues","useEffect","day","month","year","current","contains","document","activeElement","_a","focus","useImperativeHandle","resetPlaceholder","resetInput","focusYearRef","handlePlaceholderClick","event","preventDefault","handleInputFocus","target","select","targetName","name","handleInputBlur","dayName","monthName","yearName","date","targetValue","paddedValue","StringHelper","padValue","isValid","isEmpty","relatedTarget","handleInputChange","replace","length","_b","handleKeyDown","code","key","stringVal","sanitized","DateInputHelper","sanitizeInput","undefined","toString","_jsxs","role","className","styles.inputSection","onClick","children","styles.inputContainer","_jsx","clsx","styles.inputSizerBase","styles.dayInputSizer","maxLength","type","pattern","tabIndex","autoComplete","styles.baseInput","styles.baseInputHover","styles.divider","styles.dividerHover","styles.dividerDisabled","styles.dividerInactive","styles.monthInputSizer","onKeyDown","styles.yearInputSizer","styles.placeholder","styles.placeholderDisabled","styles.placeholderHide","onMouseDown","renderPlaceholder","StandaloneDateInput","React","forwardRef"],"mappings":"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"}

package/shared/standalone-date-input/standalone-date-input.styles.d.ts

@@ -2,8 +2,9 @@ export declare const inputSection: import("@linaria/core").LinariaClassName;
 export declare const baseInput: import("@linaria/core").LinariaClassName;
 export declare const baseInputHover: import("@linaria/core").LinariaClassName;
 export declare const divider: import("@linaria/core").LinariaClassName;
-export declare const dividerInactive: import("@linaria/core").LinariaClassName;
 export declare const dividerHover: import("@linaria/core").LinariaClassName;
+export declare const dividerInactive: import("@linaria/core").LinariaClassName;
+export declare const dividerDisabled: import("@linaria/core").LinariaClassName;
 export declare const inputContainer: import("@linaria/core").LinariaClassName;
 export declare const inputSizerBase: import("@linaria/core").LinariaClassName;
 export declare const dayInputSizer: import("@linaria/core").LinariaClassName;

package/shared/standalone-date-input/standalone-date-input.styles.js

@@ -1,2 +1,2 @@
-import"./standalone-date-input.styles_1mqophx.css";const t="i48x656",d="b11lxf0g",n="b1owk99f",p="d1hrb2q6",o="d1ednuur",s="d12gn07d",a="iay8f6w",e="i1tizbfo",i="d8v7mt3",b="m1nfq8ts",f="y1kizbwh",r="pzrktuq",u="p1jcopfd",c="p10ypbkc";export{d as baseInput,n as baseInputHover,i as dayInputSizer,p as divider,s as dividerHover,o as dividerInactive,a as inputContainer,t as inputSection,e as inputSizerBase,b as monthInputSizer,r as placeholder,u as placeholderDisabled,c as placeholderHide,f as yearInputSizer};
+import"./standalone-date-input.styles_157qo89.css";const t="i48x656",d="b11lxf0g",n="b1owk99f",o="d1hrb2q6",p="d1ednuur",s="d12gn07d",a="day8f6w",e="i1tizbfo",i="i8v7mt3",b="d1nfq8ts",f="m1kizbwh",r="yzrktuq",u="p1jcopfd",c="p10ypbkc",q="p1yc7tqu";export{d as baseInput,n as baseInputHover,b as dayInputSizer,o as divider,a as dividerDisabled,p as dividerHover,s as dividerInactive,e as inputContainer,t as inputSection,i as inputSizerBase,f as monthInputSizer,u as placeholder,c as placeholderDisabled,q as placeholderHide,r as yearInputSizer};
 //# sourceMappingURL=standalone-date-input.styles.js.map

package/shared/standalone-date-input/standalone-date-input.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"standalone-date-input.styles.js","sources":["../../../src/shared/standalone-date-input/standalone-date-input.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Colour, Font, Spacing } from \"../../theme\";\n\n// =============================================================================\n// STYLING\n// =============================================================================\nexport const inputSection = css`\n    display: flex;\n    align-items: center;\n    position: relative;\n\n    flex: 1;\n`;\n\nexport const baseInput = css`\n    ${Font[\"body-baseline-regular\"]}\n    color: ${Colour[\"text\"]};\n    display: block;\n    background: transparent;\n    border: none;\n    outline: none;\n    box-shadow: none;\n    padding: 0;\n    margin: 0;\n    text-align: center;\n    position: absolute;\n    inset: 0;\n\n    &:disabled {\n        color: ${Colour[\"text-subtler\"]};\n\n        &:hover {\n            cursor: not-allowed;\n        }\n    }\n\n    &::placeholder,\n    &::-webkit-input-placeholder {\n        color: ${Colour[\"text-subtler\"]};\n    }\n\n    // Chrome, Safari, Edge, Opera\n    &::-webkit-outer-spin-button,\n    &::-webkit-inner-spin-button {\n        -webkit-appearance: none;\n        margin: 0;\n    }\n\n    // Safari (remove top shadow)\n    --webkit-appearance: none;\n\n    // Firefox\n    --moz-appearance: textfield;\n`;\n\nexport const baseInputHover = css`\n    color: ${Colour[\"text-subtler\"]};\n`;\n\nexport const divider = css`\n    ${Font[\"body-baseline-regular\"]}\n`;\n\nexport const dividerInactive = css`\n    color: ${Colour[\"text\"]};\n`;\n\nexport const dividerHover = css`\n    color: ${Colour[\"text-subtler\"]};\n`;\n\nexport const inputContainer = css`\n    display: flex;\n    align-items: center;\n    gap: ${Spacing[\"spacing-4\"]};\n`;\n\nexport const inputSizerBase = css`\n    display: inline-block;\n    position: relative;\n\n    &::after {\n        ${Font[\"body-baseline-regular\"]}\n        visibility: hidden;\n        pointer-events: none;\n        white-space: pre;\n    }\n`;\n\nexport const dayInputSizer = css`\n    &::after {\n        content: \"DD\";\n    }\n`;\n\nexport const monthInputSizer = css`\n    &::after {\n        content: \"MM\";\n    }\n`;\n\nexport const yearInputSizer = css`\n    &::after {\n        content: \"YYYY\";\n    }\n`;\n\nexport const placeholder = css`\n    ${Font[\"body-baseline-regular\"]}\n    background-color: ${Colour[\"bg\"]};\n    color: ${Colour[\"text-subtler\"]};\n    position: absolute;\n    display: flex;\n    align-items: center;\n    width: 100%;\n    height: 100%;\n`;\n\nexport const placeholderDisabled = css`\n    background-color: ${Colour[\"bg-disabled\"]};\n    cursor: not-allowed;\n`;\n\nexport const placeholderHide = css`\n    display: none;\n`;\n"],"names":["inputSection","baseInput","baseInputHover","divider","dividerInactive","dividerHover","inputContainer","inputSizerBase","dayInputSizer","monthInputSizer","yearInputSizer","placeholder","placeholderDisabled","placeholderHide"],"mappings":"+FAOO,MAAMA,EAAY,UAQZC,EAAS,WAyCTC,EAAc,WAIdC,EAAO,WAIPC,EAAe,WAIfC,EAAY,WAIZC,EAAc,UAMdC,EAAc,WAYdC,EAAa,UAMbC,EAAe,WAMfC,EAAc,WAMdC,EAAW,UAWXC,EAAmB,WAKnBC,EAAe"}
+{"version":3,"file":"standalone-date-input.styles.js","sources":["../../../src/shared/standalone-date-input/standalone-date-input.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Colour, Font, Spacing } from \"../../theme\";\n\n// =============================================================================\n// STYLING\n// =============================================================================\nexport const inputSection = css`\n    display: flex;\n    align-items: center;\n    position: relative;\n\n    flex: 1;\n`;\n\nexport const baseInput = css`\n    ${Font[\"body-baseline-regular\"]}\n    color: ${Colour[\"text\"]};\n    display: block;\n    background: transparent;\n    border: none;\n    outline: none;\n    box-shadow: none;\n    padding: 0;\n    margin: 0;\n    text-align: center;\n    position: absolute;\n    inset: 0;\n\n    &:disabled {\n        color: ${Colour[\"text-subtler\"]};\n\n        &:hover {\n            cursor: not-allowed;\n        }\n    }\n\n    &::placeholder,\n    &::-webkit-input-placeholder {\n        color: ${Colour[\"text-subtler\"]};\n    }\n\n    // Chrome, Safari, Edge, Opera\n    &::-webkit-outer-spin-button,\n    &::-webkit-inner-spin-button {\n        -webkit-appearance: none;\n        margin: 0;\n    }\n\n    // Safari (remove top shadow)\n    --webkit-appearance: none;\n\n    // Firefox\n    --moz-appearance: textfield;\n`;\n\nexport const baseInputHover = css`\n    color: ${Colour[\"text-subtler\"]};\n`;\n\nexport const divider = css`\n    ${Font[\"body-baseline-regular\"]}\n    color: ${Colour[\"text\"]};\n`;\n\nexport const dividerHover = css`\n    color: ${Colour[\"text-subtler\"]};\n`;\n\nexport const dividerInactive = css`\n    color: ${Colour[\"text-subtler\"]};\n`;\n\nexport const dividerDisabled = css`\n    color: ${Colour[\"text-disabled\"]};\n`;\n\nexport const inputContainer = css`\n    display: flex;\n    align-items: center;\n    gap: ${Spacing[\"spacing-4\"]};\n`;\n\nexport const inputSizerBase = css`\n    display: inline-block;\n    position: relative;\n\n    &::after {\n        ${Font[\"body-baseline-regular\"]}\n        visibility: hidden;\n        pointer-events: none;\n        white-space: pre;\n    }\n`;\n\nexport const dayInputSizer = css`\n    &::after {\n        content: \"DD\";\n    }\n`;\n\nexport const monthInputSizer = css`\n    &::after {\n        content: \"MM\";\n    }\n`;\n\nexport const yearInputSizer = css`\n    &::after {\n        content: \"YYYY\";\n    }\n`;\n\nexport const placeholder = css`\n    ${Font[\"body-baseline-regular\"]}\n    background-color: ${Colour[\"bg\"]};\n    color: ${Colour[\"text-subtler\"]};\n    position: absolute;\n    display: flex;\n    align-items: center;\n    width: 100%;\n    height: 100%;\n`;\n\nexport const placeholderDisabled = css`\n    background-color: ${Colour[\"bg-disabled\"]};\n    cursor: not-allowed;\n`;\n\nexport const placeholderHide = css`\n    display: none;\n`;\n"],"names":["inputSection","baseInput","baseInputHover","divider","dividerHover","dividerInactive","dividerDisabled","inputContainer","inputSizerBase","dayInputSizer","monthInputSizer","yearInputSizer","placeholder","placeholderDisabled","placeholderHide"],"mappings":"+FAOO,MAAMA,EAAY,UAQZC,EAAS,WAyCTC,EAAc,WAIdC,EAAO,WAKPC,EAAY,WAIZC,EAAe,WAIfC,EAAe,UAIfC,EAAc,WAMdC,EAAc,UAYdC,EAAa,WAMbC,EAAe,WAMfC,EAAc,UAMdC,EAAW,WAWXC,EAAmB,WAKnBC,EAAe"}

package/shared/standalone-date-input/standalone-date-input.styles_157qo89.css

@@ -0,0 +1,15 @@
+.i48x656{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:relative;-webkit-flex:1;-ms-flex:1;flex:1;}
+.b11lxf0g{font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-baseline);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-baseline);letter-spacing:var(--fds-font-body-ls-baseline);color:var(--fds-colour-text);display:block;background:transparent;border:none;outline:none;box-shadow:none;padding:0;margin:0;text-align:center;position:absolute;inset:0;--webkit-appearance:none;--moz-appearance:textfield;}.b11lxf0g:disabled{color:var(--fds-colour-text-subtler);}.b11lxf0g:disabled:hover{cursor:not-allowed;}.b11lxf0g::-webkit-input-placeholder{color:var(--fds-colour-text-subtler);}.b11lxf0g::-webkit-outer-spin-button,.b11lxf0g::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}.b11lxf0g::-webkit-input-placeholder{color:var(--fds-colour-text-subtler);}.b11lxf0g::-moz-placeholder{color:var(--fds-colour-text-subtler);}.b11lxf0g:-ms-input-placeholder{color:var(--fds-colour-text-subtler);}.b11lxf0g::placeholder{color:var(--fds-colour-text-subtler);}
+.b1owk99f{color:var(--fds-colour-text-subtler);}
+.d1hrb2q6{font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-baseline);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-baseline);letter-spacing:var(--fds-font-body-ls-baseline);color:var(--fds-colour-text);}
+.d1ednuur{color:var(--fds-colour-text-subtler);}
+.d12gn07d{color:var(--fds-colour-text-subtler);}
+.day8f6w{color:var(--fds-colour-text-disabled);}
+.i1tizbfo{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:var(--fds-spacing-4);}
+.i8v7mt3{display:inline-block;position:relative;}.i8v7mt3::after{font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-baseline);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-baseline);letter-spacing:var(--fds-font-body-ls-baseline);visibility:hidden;pointer-events:none;white-space:pre;}
+.d1nfq8ts::after{content:"DD";}
+.m1kizbwh::after{content:"MM";}
+.yzrktuq::after{content:"YYYY";}
+.p1jcopfd{font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-baseline);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-baseline);letter-spacing:var(--fds-font-body-ls-baseline);background-color:var(--fds-colour-bg);color:var(--fds-colour-text-subtler);position:absolute;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;height:100%;}
+.p10ypbkc{background-color:var(--fds-colour-bg-disabled);cursor:not-allowed;}
+.p1yc7tqu{display:none;}

package/shared/time-slot/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./time-slot";
+export * from "./types";

package/shared/time-slot/time-slot.d.ts

@@ -0,0 +1,18 @@
+import type { ReactNode } from "react";
+import type { SlotStyle } from "./types";
+export interface TimeSlotProps {
+    "data-testid"?: string | undefined;
+    bgColor: string;
+    bgColor2?: string | undefined;
+    children?: ReactNode;
+    className?: string | undefined;
+    clickable?: boolean | undefined;
+    fill?: "default" | "top" | "bottom" | undefined;
+    hoverBgColor?: string | undefined;
+    hoverBgColor2?: string | undefined;
+    nonClickableCursor?: "default" | "not-allowed" | undefined;
+    onClick?: React.MouseEventHandler<HTMLDivElement> | undefined;
+    styleType: SlotStyle;
+    tabIndex?: number | undefined;
+}
+export declare const TimeSlot: (props: TimeSlotProps & import("react").RefAttributes<HTMLDivElement>) => React.ReactElement | null;

package/shared/time-slot/time-slot.js

@@ -0,0 +1,2 @@
+import{jsx as e}from"react/jsx-runtime";import t from"clsx";import{forwardRef as o,useRef as r}from"react";import"../../theme/theme-provider/index.js";import"../../theme/theme-provider/context.js";import"../../theme/tokens/border.js";import"../../theme/tokens/colour.js";import"../../theme/tokens/font.js";import"../../theme/tokens/media-query.js";import{useApplyStyle as s}from"../../theme/utils/use-apply-styles.js";import"../../theme/utils/use-media-query.js";import"../../util/calendar-helper.js";import"../../external/dayjs/dayjs.min.js";import{mergeRefs as l}from"../../util/merge-refs.js";import"../../util/simple-id-generator.js";import"../../util/string-helper.js";import"@react-aria/live-announcer";import{tokens as i,timeSlot as m,timeSlotHalfFillBottom as a,timeSlotHalfFillTop as p}from"./time-slot.styles.js";const n=o((({className:o,"data-testid":n,bgColor:d,bgColor2:c,children:h,clickable:u,fill:j="default",hoverBgColor:b,hoverBgColor2:C,nonClickableCursor:f,onClick:g,styleType:y,tabIndex:k},v)=>{const x=r(null);s(x,{[i.slot.bgColor]:d,[i.slot.bgColor2]:c,[i.slot.hoverBgColor]:b,[i.slot.hoverBgColor2]:C,[i.slot.cursor]:f});return e("div",{ref:l(x,v),className:t(m,{[p]:"top"===j,[a]:"bottom"===j},o),"data-style-type":y,"data-clickable":!!u,"data-hoverable":!!(u&&("stripes"===y?b||C:b)),onClick:g,"data-testid":n,tabIndex:k,children:h})}));export{n as TimeSlot};
+//# sourceMappingURL=time-slot.js.map