@lifesg/react-design-system 3.5.0-canary.7 → 4.0.0-alpha.10

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

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import a from"../../../external/dayjs/dayjs.min.js";import{useRef as l,useEffect as r}from"react";import{Cell as n,LeftHalf as o,LeftCircle as i,RightHalf as d,RightCircle as c,LabelWrapper as s,Label as u,Indicator as b}from"./day-cell.style.js";const y=({bgLeft:y,bgRight:m,circleLeft:p,circleRight:v,labelType:$,disabled:f,interactive:h,currentDateIndicator:M,date:j,onSelect:x,onHover:D,onFocus:g,onHoverEnd:Y,onKeyDown:H,focusDate:I,label:L,ariaHidden:S,tabIndex:w=-1,role:E="button"})=>{const F=a().isSame(j,"day"),K=!!I&&I.isSame(j,"day"),R=`${j.format("D MMMM YYYY dddd")}, ${f?"Unavailable":"Available"}`,k=l(null);r((()=>{var e;K&&k.current&&(null===(e=k.current)||void 0===e||e.focus())}),[K]);return e(n,{"aria-hidden":S,children:[t(o,{$type:y}),t(i,{$type:p}),t(d,{$type:m}),t(c,{$type:v}),t(s,{$interactive:h,children:e(u,{ref:k,tabIndex:w,role:E,"aria-label":L||R,"aria-disabled":!h,"aria-selected":"selected"===$||"selected-hover"===$,$type:$,$disabled:f,$interactive:h,onClick:()=>{null==x||x(j)},onKeyDown:e=>{null==H||H(e)},onMouseEnter:()=>{null==D||D(j)},onMouseLeave:()=>{null==Y||Y(j)},onFocus:()=>{null==g||g(j)},children:[j.date(),M&&F&&t(b,{$disabled:f})]})})]})};export{y as DayCell};
+import{jsxs as e,jsx as a}from"react/jsx-runtime";import l from"../../../external/dayjs/dayjs.min.js";import{useMemo as d,useRef as t,useEffect as i}from"react";import{cell as o,leftHalf as n,leftCircle as c,rightHalf as s,rightCircle as r,labelWrapper as y,label as v,indicator as m}from"./day-cell.styles.js";const u=({bgLeft:u,bgRight:b,circleLeft:p,circleRight:f,labelType:h,disabled:N,interactive:M=!1,currentDateIndicator:g,date:j,onSelect:x,onHover:D,onFocus:Y,onHoverEnd:H,onKeyDown:I,focusDate:L,label:S,ariaHidden:w,tabIndex:E=-1,role:F="button"})=>{const K=!!L&&L.isSame(j,"day"),R=`${j.format("D MMMM YYYY dddd")}, ${N?"Unavailable":"Available"}`,$="gridcell"===F,k="selected"===h||"selected-hover"===h,A=S||R,C=N&&"hidden"!==h?void 0:h,T=d((()=>l().isSame(j,"day")),[j]);let U="default";M?U="interactive":N&&(U="disabled");const q=t(null);i((()=>{var e;K&&(null===(e=q.current)||void 0===e||e.focus())}),[K]);return e("div",{className:o,"aria-hidden":w,children:[a("div",{className:n,"data-day-cell-type":u}),a("div",{className:c,"data-day-cell-type":p}),a("div",{className:s,"data-day-cell-type":b}),a("div",{className:r,"data-day-cell-type":f}),a("span",{className:y,"data-day-cell-state":U,children:e("button",{type:"button",className:v,"data-day-cell-state":U,"data-day-cell-label-type":C,"data-day-cell-disabled":N,ref:q,tabIndex:E,role:F,"aria-label":A,"aria-disabled":!(!N||M)||void 0,"aria-selected":$?k:void 0,onClick:M?()=>{null==x||x(j)}:void 0,onKeyDown:e=>{null==I||I(e)},onMouseEnter:M?()=>{null==D||D(j)}:void 0,onMouseLeave:M?()=>{null==H||H(j)}:void 0,onFocus:()=>{null==Y||Y(j)},children:[j.date(),g&&T&&a("div",{className:m})]})})]})};export{u as DayCell};
 //# sourceMappingURL=day-cell.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"day-cell.js","sources":["../../../../src/shared/internal-calendar/day-cell/day-cell.tsx"],"sourcesContent":["import dayjs from \"dayjs\";\nimport { useEffect, useRef } from \"react\";\nimport {\n    Cell,\n    Indicator,\n    Label,\n    LabelWrapper,\n    LeftCircle,\n    LeftHalf,\n    RightCircle,\n    RightHalf,\n} from \"./day-cell.style\";\nimport { DayCellProps } from \"./types\";\n\nexport const DayCell = ({\n    bgLeft,\n    bgRight,\n    circleLeft,\n    circleRight,\n    labelType,\n    disabled,\n    interactive,\n    currentDateIndicator,\n    date,\n    onSelect,\n    onHover,\n    onFocus,\n    onHoverEnd,\n    onKeyDown,\n    focusDate,\n    label,\n    ariaHidden,\n    tabIndex = -1,\n    role = \"button\",\n}: DayCellProps) => {\n    // =========================================================================\n    // CONST\n    // =========================================================================\n    const today = dayjs().isSame(date, \"day\");\n    const isFocused = focusDate ? focusDate.isSame(date, \"day\") : false;\n    const defaultLabel = `${date.format(\"D MMMM YYYY dddd\")}, ${\n        disabled ? \"Unavailable\" : \"Available\"\n    }`; // e.g. 1 January 2025 Tuesday, Unavailable\n\n    // =============================================================================\n    // REFS, EFFECTS\n    // =============================================================================\n    const ref = useRef<HTMLDivElement>(null);\n\n    useEffect(() => {\n        if (isFocused && ref.current) {\n            ref.current?.focus();\n        }\n    }, [isFocused]);\n\n    // =========================================================================\n    // EVENT HANDLERS\n    // =========================================================================\n    const handleClick = () => {\n        onSelect?.(date);\n    };\n\n    const handleHover = () => {\n        onHover?.(date);\n    };\n\n    const handleFocus = () => {\n        onFocus?.(date);\n    };\n\n    const handleMouseout = () => {\n        onHoverEnd?.(date);\n    };\n\n    // =========================================================================\n    // RENDER FUNCTION\n    // =========================================================================\n    return (\n        <Cell aria-hidden={ariaHidden}>\n            <LeftHalf $type={bgLeft}></LeftHalf>\n            <LeftCircle $type={circleLeft} />\n            <RightHalf $type={bgRight}></RightHalf>\n            <RightCircle $type={circleRight} />\n            <LabelWrapper $interactive={interactive}>\n                <Label\n                    ref={ref}\n                    tabIndex={tabIndex}\n                    role={role}\n                    aria-label={label || defaultLabel}\n                    aria-disabled={!interactive}\n                    aria-selected={\n                        labelType === \"selected\" ||\n                        labelType === \"selected-hover\"\n                    }\n                    $type={labelType}\n                    $disabled={disabled}\n                    $interactive={interactive}\n                    onClick={handleClick}\n                    onKeyDown={(event) => {\n                        onKeyDown?.(event);\n                    }}\n                    onMouseEnter={handleHover}\n                    onMouseLeave={handleMouseout}\n                    onFocus={handleFocus}\n                >\n                    {date.date()}\n                    {currentDateIndicator && today && (\n                        <Indicator $disabled={disabled} />\n                    )}\n                </Label>\n            </LabelWrapper>\n        </Cell>\n    );\n};\n"],"names":["DayCell","bgLeft","bgRight","circleLeft","circleRight","labelType","disabled","interactive","currentDateIndicator","date","onSelect","onHover","onFocus","onHoverEnd","onKeyDown","focusDate","label","ariaHidden","tabIndex","role","today","dayjs","isSame","isFocused","defaultLabel","format","ref","useRef","useEffect","current","_a","focus","_jsxs","Cell","children","_jsx","LeftHalf","$type","LeftCircle","RightHalf","RightCircle","LabelWrapper","$interactive","Label","$disabled","onClick","event","onMouseEnter","onMouseLeave","Indicator"],"mappings":"+SAcaA,EAAU,EACnBC,SACAC,UACAC,aACAC,cACAC,YACAC,WACAC,cACAC,uBACAC,OACAC,WACAC,UACAC,UACAC,aACAC,YACAC,YACAC,QACAC,aACAC,YAAW,EACXC,OAAO,aAKP,MAAMC,EAAQC,IAAQC,OAAOb,EAAM,OAC7Bc,IAAYR,GAAYA,EAAUO,OAAOb,EAAM,OAC/Ce,EAAe,GAAGf,EAAKgB,OAAO,wBAChCnB,EAAW,cAAgB,cAMzBoB,EAAMC,EAAuB,MAEnCC,GAAU,WACFL,GAAaG,EAAIG,UACN,QAAXC,EAAAJ,EAAIG,eAAO,IAAAC,GAAAA,EAAEC,QACjB,GACD,CAACR,IAwBJ,OACIS,EAACC,EAAI,CAAA,cAAchB,EAAUiB,SAAA,CACzBC,EAACC,EAAQ,CAAAC,MAAQpC,IACjBkC,EAACG,EAAU,CAAAD,MAAQlC,IACnBgC,EAACI,EAAS,CAAAF,MAAQnC,IAClBiC,EAACK,EAAW,CAAAH,MAAQjC,IACpB+B,EAACM,EAAY,CAAAC,aAAenC,EAAW2B,SACnCF,EAACW,EAAK,CACFjB,IAAKA,EACLR,SAAUA,EACVC,KAAMA,EAAI,aACEH,GAASQ,EAAY,iBACjBjB,EAAW,gBAET,aAAdF,GACc,mBAAdA,EAA8BgC,MAE3BhC,EAASuC,UACLtC,eACGC,EACdsC,QAvCI,KAChBnC,SAAAA,EAAWD,EAAK,EAuCJK,UAAYgC,IACRhC,SAAAA,EAAYgC,EAAM,EAEtBC,aAvCI,KAChBpC,SAAAA,EAAUF,EAAK,EAuCHuC,aAhCO,KACnBnC,SAAAA,EAAaJ,EAAK,EAgCNG,QArCI,KAChBA,SAAAA,EAAUH,EAAK,EAoCiByB,SAAA,CAEnBzB,EAAKA,OACLD,GAAwBY,GACrBe,EAACc,EAAS,CAAAL,UAAYtC,WAI/B"}
+{"version":3,"file":"day-cell.js","sources":["../../../../src/shared/internal-calendar/day-cell/day-cell.tsx"],"sourcesContent":["import dayjs from \"dayjs\";\nimport { useEffect, useMemo, useRef } from \"react\";\n\nimport * as styles from \"./day-cell.styles\";\nimport type { DayCellProps } from \"./types\";\n\nexport const DayCell = ({\n    bgLeft,\n    bgRight,\n    circleLeft,\n    circleRight,\n    labelType,\n    disabled,\n    interactive = false,\n    currentDateIndicator,\n    date,\n    onSelect,\n    onHover,\n    onFocus,\n    onHoverEnd,\n    onKeyDown,\n    focusDate,\n    label,\n    ariaHidden,\n    tabIndex = -1,\n    role = \"button\",\n}: DayCellProps) => {\n    // =========================================================================\n    // CONST\n    // =========================================================================\n    const isFocused = focusDate ? focusDate.isSame(date, \"day\") : false;\n    const defaultLabel = `${date.format(\"D MMMM YYYY dddd\")}, ${\n        disabled ? \"Unavailable\" : \"Available\"\n    }`; // e.g. 1 January 2025 Tuesday, Unavailable\n    const isGridcellRole = role === \"gridcell\";\n    const isSelected =\n        labelType === \"selected\" || labelType === \"selected-hover\";\n    const labelText = label || defaultLabel;\n    const labelTypeAttr =\n        disabled && labelType !== \"hidden\" ? undefined : labelType;\n    const isToday = useMemo(() => dayjs().isSame(date, \"day\"), [date]);\n    let interactionState = \"default\";\n    if (interactive) {\n        interactionState = \"interactive\";\n    } else if (disabled) {\n        interactionState = \"disabled\";\n    }\n\n    // =============================================================================\n    // REFS, EFFECTS\n    // =============================================================================\n    const buttonRef = useRef<HTMLButtonElement>(null);\n\n    useEffect(() => {\n        if (isFocused) {\n            buttonRef.current?.focus();\n        }\n    }, [isFocused]);\n\n    // =========================================================================\n    // EVENT HANDLERS\n    // =========================================================================\n    const handleClick = () => {\n        onSelect?.(date);\n    };\n\n    const handleHover = () => {\n        onHover?.(date);\n    };\n\n    const handleFocus = () => {\n        onFocus?.(date);\n    };\n\n    const handleMouseLeave = () => {\n        onHoverEnd?.(date);\n    };\n\n    const handleLabelKeyDown = (event: React.KeyboardEvent) => {\n        onKeyDown?.(event);\n    };\n\n    // =========================================================================\n    // RENDER FUNCTION\n    // =========================================================================\n    return (\n        <div className={styles.cell} aria-hidden={ariaHidden}>\n            <div className={styles.leftHalf} data-day-cell-type={bgLeft} />\n            <div\n                className={styles.leftCircle}\n                data-day-cell-type={circleLeft}\n            />\n            <div className={styles.rightHalf} data-day-cell-type={bgRight} />\n            <div\n                className={styles.rightCircle}\n                data-day-cell-type={circleRight}\n            />\n            <span\n                className={styles.labelWrapper}\n                data-day-cell-state={interactionState}\n            >\n                <button\n                    type=\"button\"\n                    className={styles.label}\n                    data-day-cell-state={interactionState}\n                    data-day-cell-label-type={labelTypeAttr}\n                    data-day-cell-disabled={disabled}\n                    ref={buttonRef}\n                    tabIndex={tabIndex}\n                    role={role}\n                    aria-label={labelText}\n                    aria-disabled={disabled && !interactive ? true : undefined}\n                    aria-selected={isGridcellRole ? isSelected : undefined}\n                    onClick={interactive ? handleClick : undefined}\n                    onKeyDown={handleLabelKeyDown}\n                    onMouseEnter={interactive ? handleHover : undefined}\n                    onMouseLeave={interactive ? handleMouseLeave : undefined}\n                    onFocus={handleFocus}\n                >\n                    {date.date()}\n                    {currentDateIndicator && isToday && (\n                        <div className={styles.indicator} />\n                    )}\n                </button>\n            </span>\n        </div>\n    );\n};\n"],"names":["DayCell","bgLeft","bgRight","circleLeft","circleRight","labelType","disabled","interactive","currentDateIndicator","date","onSelect","onHover","onFocus","onHoverEnd","onKeyDown","focusDate","label","ariaHidden","tabIndex","role","isFocused","isSame","defaultLabel","format","isGridcellRole","isSelected","labelText","labelTypeAttr","undefined","isToday","useMemo","dayjs","interactionState","buttonRef","useRef","useEffect","_a","current","focus","_jsxs","className","styles.cell","children","_jsx","styles.leftHalf","styles.leftCircle","styles.rightHalf","styles.rightCircle","styles.labelWrapper","type","styles.label","ref","onClick","event","onMouseEnter","onMouseLeave","styles.indicator"],"mappings":"uTAMO,MAAMA,EAAU,EACnBC,SACAC,UACAC,aACAC,cACAC,YACAC,WACAC,eAAc,EACdC,uBACAC,OACAC,WACAC,UACAC,UACAC,aACAC,YACAC,YAASC,MACTA,EACAC,aACAC,YAAW,EACXC,OAAO,aAKP,MAAMC,IAAYL,GAAYA,EAAUM,OAAOZ,EAAM,OAC/Ca,EAAe,GAAGb,EAAKc,OAAO,wBAChCjB,EAAW,cAAgB,cAEzBkB,EAA0B,aAATL,EACjBM,EACY,aAAdpB,GAA0C,mBAAdA,EAC1BqB,EAAYV,GAASM,EACrBK,EACFrB,GAA0B,WAAdD,OAAyBuB,EAAYvB,EAC/CwB,EAAUC,GAAQ,IAAMC,IAAQV,OAAOZ,EAAM,QAAQ,CAACA,IAC5D,IAAIuB,EAAmB,UACnBzB,EACAyB,EAAmB,cACZ1B,IACP0B,EAAmB,YAMvB,MAAMC,EAAYC,EAA0B,MAE5CC,GAAU,WACFf,IACiB,QAAjBgB,EAAAH,EAAUI,eAAO,IAAAD,GAAAA,EAAEE,QACvB,GACD,CAAClB,IA4BJ,OACImB,EAAA,MAAA,CAAKC,UAAWC,EAAW,cAAexB,EAAUyB,SAAA,CAChDC,EAAA,MAAA,CAAKH,UAAWI,EAAe,qBAAsB3C,IACrD0C,EAAA,MAAA,CACIH,UAAWK,EAAiB,qBACR1C,IAExBwC,EAAA,MAAA,CAAKH,UAAWM,EAAgB,qBAAsB5C,IACtDyC,SACIH,UAAWO,EAAkB,qBACT3C,IAExBuC,EAAA,OAAA,CACIH,UAAWQ,EAAmB,sBACThB,EAAgBU,SAErCH,EAAA,SAAA,CACIU,KAAK,SACLT,UAAWU,EAAY,sBACFlB,6BACKL,EAAa,yBACfrB,EACxB6C,IAAKlB,EACLf,SAAUA,EACVC,KAAMA,EAAI,aACEO,EAAS,mBACNpB,GAAaC,SAAqBqB,EAAS,gBAC3CJ,EAAiBC,OAAaG,EAC7CwB,QAAS7C,EAnDL,KAChBG,SAAAA,EAAWD,EAAK,OAkDiCmB,EACrCd,UApCYuC,IACxBvC,SAAAA,EAAYuC,EAAM,EAoCNC,aAAc/C,EAjDV,KAChBI,SAAAA,EAAUF,EAAK,OAgDuCmB,EAC1C2B,aAAchD,EA1CL,KACrBM,SAAAA,EAAaJ,EAAK,OAyCyCmB,EAC/ChB,QA/CI,KAChBA,SAAAA,EAAUH,EAAK,EA8CiBiC,SAAA,CAEnBjC,EAAKA,OACLD,GAAwBqB,GACrBc,EAAA,MAAA,CAAKH,UAAWgB,WAI1B"}

package/shared/internal-calendar/day-cell/day-cell.styles.d.ts

@@ -0,0 +1,10 @@
+export declare const cell: import("@linaria/core").LinariaClassName;
+export declare const half: string;
+export declare const leftHalf: import("@linaria/core").LinariaClassName;
+export declare const rightHalf: import("@linaria/core").LinariaClassName;
+export declare const circle: string;
+export declare const leftCircle: import("@linaria/core").LinariaClassName;
+export declare const rightCircle: import("@linaria/core").LinariaClassName;
+export declare const labelWrapper: import("@linaria/core").LinariaClassName;
+export declare const label: import("@linaria/core").LinariaClassName;
+export declare const indicator: import("@linaria/core").LinariaClassName;

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

@@ -0,0 +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_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

@@ -0,0 +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":"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 @@
+@layer fds{.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/day-cell/types.d.ts

@@ -1,4 +1,4 @@
-import { Dayjs } from "dayjs";
+import type { Dayjs } from "dayjs";
 export type CellType = "hover-subtle" | "hover" | "hover-outline" | "selected-outline" | "selected-outline-subtle" | "selected-hover" | "selected-hover-outline";
 export type LabelType = "available" | "unavailable" | "current" | "hover" | "selected" | "selected-hover" | "hidden";
 export interface CellStyleProps {
@@ -8,7 +8,7 @@ export interface CellStyleProps {
     circleRight?: CellType | undefined;
     labelType?: LabelType | undefined;
     disabled?: boolean | undefined;
-    interactive?: boolean | null | undefined;
+    interactive?: boolean | undefined;
     currentDateIndicator?: boolean | undefined;
 }
 export interface DayCellProps extends CellStyleProps {

package/shared/internal-calendar/fixed-range/fixed-range-calendar-day-view.d.ts

@@ -1,5 +1,5 @@
-import { Dayjs } from "dayjs";
-import { CommonCalendarProps } from "../types";
+import type { Dayjs } from "dayjs";
+import type { CommonCalendarProps } from "../types";
 interface FixedRangeCalendarDayViewProps extends CommonCalendarProps {
     selectedStartDate: string | undefined;
     numberOfDays: number | undefined;

package/shared/internal-calendar/fixed-range/fixed-range-calendar-day-view.js

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as a}from"react/jsx-runtime";import t from"../../../external/dayjs/dayjs.min.js";import{useRef as r,useEffect as n,useCallback as o,useMemo as d,useState as i}from"react";import{CalendarHelper as s}from"../../../util/calendar-helper.js";import"../standard/standard-calendar-day-view.js";import{Wrapper as l,HeaderCell as m,RowDayCell as c}from"../standard/standard-calendar-day-view.style.js";import{FixedRangeDayCell as u}from"./fixed-range-cell.js";const D=({calendarDate:D,disabledDates:f,selectedStartDate:h,onSelect:p,onHover:y,minDate:S,maxDate:v,allowDisabledSelection:b,numberOfDays:j,setCalendarDate:g})=>{const x=r(null);n((()=>{if(x.current){const e=x.current;x.current=null,T(e)}}),[D]);const w=o((()=>h&&t(h).isSame(D,"month")?t(h):t().isSame(D,"month")?t():S&&D.isSame(t(S),"month")?t(S):t(D).startOf("month")),[h,D,S]),O=e=>{const a=t(e);if(s.isWithinRange(a,S?t(S):void 0,v?t(v):void 0)){if(!a.isSame(D,"month"))return null==g||g(e),void(x.current=e);T(e)}},C=d((()=>s.generateDays(D)),[D]),F=d((()=>w()),[w]),[H,T]=i(""),[$,k]=i(""),B=(e,a)=>{a&&!b||(p(e),e&&!t(e).isSame(e,"month")&&k(""))},I=(e,a)=>{a&&!b||(k(e),y(e))},L=e=>{k(e),y(e)},M=()=>{k(""),y("")};return e(l,{role:"grid",onBlur:e=>{e.currentTarget.contains(e.relatedTarget)||(T(""),k(""),y(""))},"data-testid":"calendar-content","aria-label":"Date grid",children:[C[0].map(((e,r)=>a(m,{"aria-hidden":!0,children:t(e).format("ddd")},`week-day-${r}`))),C.map(((e,r)=>a(c,{role:"row",onMouseLeave:M,children:e.map(((e,r)=>a(u,{date:e,calendarDate:D,selectedDate:h,hoverDate:$,focusDate:H,minDate:S,maxDate:v,disabledDates:f,allowDisabledSelection:b,onSelect:B,onHover:I,numberOfDays:j,onFocus:L,setFocusCell:O,tabIndex:t(e).isSame(F,"day")?0:-1},`day-${r}`)))},r)))]})};export{D as FixedRangeCalendarDayView};
+import{jsxs as e,jsx as a}from"react/jsx-runtime";import t from"../../../external/dayjs/dayjs.min.js";import{useRef as r,useEffect as n,useCallback as o,useMemo as s,useState as i}from"react";import{CalendarHelper as d}from"../../../util/calendar-helper.js";import{wrapper as l,headerCell as m,rowDayCell as c}from"../standard/standard-calendar-day-view.styles.js";import{FixedRangeDayCell as u}from"./fixed-range-cell.js";const D=({calendarDate:D,disabledDates:f,selectedStartDate:h,onSelect:p,onHover:v,minDate:S,maxDate:y,allowDisabledSelection:b,numberOfDays:g,setCalendarDate:j})=>{const x=r(null);n((()=>{if(x.current){const e=x.current;x.current=null,H(e)}}),[D]);const w=o((()=>h&&t(h).isSame(D,"month")?t(h):t().isSame(D,"month")?t():S&&D.isSame(t(S),"month")?t(S):t(D).startOf("month")),[h,D,S]),N=e=>{const a=t(e);if(d.isWithinRange(a,S?t(S):void 0,y?t(y):void 0)){if(!a.isSame(D,"month"))return null==j||j(e),void(x.current=e);H(e)}},O=s((()=>d.generateDays(D)),[D]),C=s((()=>w()),[w]),[F,H]=i(""),[T,$]=i(""),k=(e,a)=>{a&&!b||(p(e),e&&!t(e).isSame(e,"month")&&$(""))},B=(e,a)=>{a&&!b||($(e),v(e))},I=e=>{$(e),v(e)},L=()=>{$(""),v("")};return e("div",{role:"grid",onBlur:e=>{e.currentTarget.contains(e.relatedTarget)||(H(""),$(""),v(""))},"data-testid":"calendar-content","aria-label":"Date grid",className:l,children:[O[0].map(((e,r)=>a("div",{className:m,"aria-hidden":!0,children:t(e).format("ddd")},`week-day-${r}`))),O.map(((e,r)=>a("div",{role:"row",onMouseLeave:L,className:c,children:e.map(((e,r)=>a(u,{date:e,calendarDate:D,selectedDate:h,hoverDate:T,focusDate:F,minDate:S,maxDate:y,disabledDates:f,allowDisabledSelection:b,onSelect:k,onHover:B,numberOfDays:g,onFocus:I,setFocusCell:N,tabIndex:t(e).isSame(C,"day")?0:-1},`day-${r}`)))},r)))]})};export{D as FixedRangeCalendarDayView};
 //# sourceMappingURL=fixed-range-calendar-day-view.js.map

package/shared/internal-calendar/fixed-range/fixed-range-calendar-day-view.js.map

@@ -1 +1 @@
-{"version":3,"file":"fixed-range-calendar-day-view.js","sources":["../../../../src/shared/internal-calendar/fixed-range/fixed-range-calendar-day-view.tsx"],"sourcesContent":["import dayjs, { Dayjs } from \"dayjs\";\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { CalendarHelper } from \"../../../util/calendar-helper\";\nimport { HeaderCell, RowDayCell, Wrapper } from \"../standard\";\nimport { CommonCalendarProps } from \"../types\";\nimport { FixedRangeDayCell } from \"./fixed-range-cell\";\n\ninterface FixedRangeCalendarDayViewProps extends CommonCalendarProps {\n    selectedStartDate: string | undefined;\n    numberOfDays: number | undefined;\n    calendarDate: Dayjs;\n    onSelect: (value: Dayjs) => void;\n    onHover: (value: string) => void;\n    setCalendarDate?: ((date: string | undefined) => void) | undefined;\n}\n\nexport const FixedRangeCalendarDayView = ({\n    calendarDate,\n    disabledDates,\n    selectedStartDate,\n    onSelect,\n    onHover,\n    minDate,\n    maxDate,\n    allowDisabledSelection,\n    numberOfDays,\n    setCalendarDate,\n}: FixedRangeCalendarDayViewProps) => {\n    // =============================================================================\n    // REFS, EFFECTS\n    // =============================================================================\n    const pendingFocusRef = useRef<string | null>(null);\n\n    useEffect(() => {\n        if (pendingFocusRef.current) {\n            const next = pendingFocusRef.current;\n            pendingFocusRef.current = null;\n            setFocusValue(next);\n        }\n    }, [calendarDate]);\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n    const getDateToFocus = useCallback(() => {\n        // As specified in the Grid Pattern, only one element in the calendar grid is in the Tab sequence.\n        // This function determines which date should be focused based on the state of the calendar.\n\n        // Selected date is in the current month\n        if (\n            selectedStartDate &&\n            dayjs(selectedStartDate).isSame(calendarDate, \"month\")\n        ) {\n            return dayjs(selectedStartDate);\n        }\n\n        // Today is in the current month\n        if (dayjs().isSame(calendarDate, \"month\")) {\n            return dayjs();\n        }\n\n        // Choose min date if it is in the current month\n        if (minDate && calendarDate.isSame(dayjs(minDate), \"month\")) {\n            return dayjs(minDate);\n        }\n\n        // Otherwise, return the first day of the month\n        return dayjs(calendarDate).startOf(\"month\");\n    }, [selectedStartDate, calendarDate, minDate]);\n\n    const setFocusCell = (value: string) => {\n        const valueDayjs = dayjs(value);\n\n        if (\n            CalendarHelper.isWithinRange(\n                valueDayjs,\n                minDate ? dayjs(minDate) : undefined,\n                maxDate ? dayjs(maxDate) : undefined\n            )\n        ) {\n            if (!valueDayjs.isSame(calendarDate, \"month\")) {\n                setCalendarDate?.(value);\n                pendingFocusRef.current = value;\n                return;\n            }\n            setFocusValue(value);\n        }\n    };\n\n    // =============================================================================\n    // CONST, STATE\n    // =============================================================================\n    const weeksOfTheMonth = useMemo(\n        (): Dayjs[][] => CalendarHelper.generateDays(calendarDate),\n        [calendarDate]\n    );\n    const dateToFocus = useMemo(\n        (): Dayjs => getDateToFocus(),\n        [getDateToFocus]\n    );\n\n    const [focusValue, setFocusValue] = useState<string>(\"\");\n    const [hoverValue, setHoverValue] = useState<string>(\"\");\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleDayClick = (value: Dayjs, isDisabled: boolean) => {\n        if (isDisabled && !allowDisabledSelection) return;\n\n        onSelect(value);\n\n        if (!!value && !dayjs(value).isSame(value, \"month\")) {\n            setHoverValue(\"\");\n        }\n    };\n\n    const handleHoverCell = (value: string, isDisabled: boolean) => {\n        if (isDisabled && !allowDisabledSelection) return;\n        setHoverValue(value);\n        onHover(value);\n    };\n\n    const handleFocusCell = (value: string) => {\n        // Always hover the cell when it is focused\n        setHoverValue(value);\n        onHover(value);\n    };\n\n    const handleMouseLeaveCell = () => {\n        setHoverValue(\"\");\n        onHover(\"\");\n    };\n\n    const handleOnBlur = (e: React.FocusEvent<HTMLDivElement>) => {\n        if (e.currentTarget.contains(e.relatedTarget as Node)) {\n            return;\n        }\n\n        // Reset focus date when the component loses focus\n        setFocusValue(\"\");\n        setHoverValue(\"\");\n        onHover(\"\");\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderHeader = () => {\n        return weeksOfTheMonth[0].map((day, index) => (\n            <HeaderCell key={`week-day-${index}`} aria-hidden>\n                {dayjs(day).format(\"ddd\")}\n            </HeaderCell>\n        ));\n    };\n\n    const renderDayCells = () => {\n        return weeksOfTheMonth.map((week, weekIndex) => {\n            return (\n                <RowDayCell\n                    role=\"row\"\n                    key={weekIndex}\n                    onMouseLeave={handleMouseLeaveCell}\n                >\n                    {week.map((day, dayIndex) => {\n                        return (\n                            <FixedRangeDayCell\n                                key={`day-${dayIndex}`}\n                                date={day}\n                                calendarDate={calendarDate}\n                                selectedDate={selectedStartDate}\n                                hoverDate={hoverValue}\n                                focusDate={focusValue}\n                                minDate={minDate}\n                                maxDate={maxDate}\n                                disabledDates={disabledDates}\n                                allowDisabledSelection={allowDisabledSelection}\n                                onSelect={handleDayClick}\n                                onHover={handleHoverCell}\n                                numberOfDays={numberOfDays}\n                                onFocus={handleFocusCell}\n                                setFocusCell={setFocusCell}\n                                tabIndex={\n                                    dayjs(day).isSame(dateToFocus, \"day\")\n                                        ? 0\n                                        : -1\n                                }\n                            />\n                        );\n                    })}\n                </RowDayCell>\n            );\n        });\n    };\n\n    return (\n        <Wrapper\n            role=\"grid\"\n            onBlur={handleOnBlur}\n            data-testid=\"calendar-content\"\n            aria-label=\"Date grid\"\n        >\n            {renderHeader()}\n            {renderDayCells()}\n        </Wrapper>\n    );\n};\n"],"names":["FixedRangeCalendarDayView","calendarDate","disabledDates","selectedStartDate","onSelect","onHover","minDate","maxDate","allowDisabledSelection","numberOfDays","setCalendarDate","pendingFocusRef","useRef","useEffect","current","next","setFocusValue","getDateToFocus","useCallback","dayjs","isSame","startOf","setFocusCell","value","valueDayjs","CalendarHelper","isWithinRange","undefined","weeksOfTheMonth","useMemo","generateDays","dateToFocus","focusValue","useState","hoverValue","setHoverValue","handleDayClick","isDisabled","handleHoverCell","handleFocusCell","handleMouseLeaveCell","_jsxs","Wrapper","role","onBlur","e","currentTarget","contains","relatedTarget","children","map","day","index","_jsx","HeaderCell","format","week","weekIndex","RowDayCell","onMouseLeave","dayIndex","FixedRangeDayCell","date","selectedDate","hoverDate","focusDate","onFocus","tabIndex"],"mappings":"wdAgBO,MAAMA,EAA4B,EACrCC,eACAC,gBACAC,oBACAC,WACAC,UACAC,UACAC,UACAC,yBACAC,eACAC,sBAKA,MAAMC,EAAkBC,EAAsB,MAE9CC,GAAU,KACN,GAAIF,EAAgBG,QAAS,CACzB,MAAMC,EAAOJ,EAAgBG,QAC7BH,EAAgBG,QAAU,KAC1BE,EAAcD,EAClB,IACD,CAACd,IAKJ,MAAMgB,EAAiBC,GAAY,IAM3Bf,GACAgB,EAAMhB,GAAmBiB,OAAOnB,EAAc,SAEvCkB,EAAMhB,GAIbgB,IAAQC,OAAOnB,EAAc,SACtBkB,IAIPb,GAAWL,EAAamB,OAAOD,EAAMb,GAAU,SACxCa,EAAMb,GAIVa,EAAMlB,GAAcoB,QAAQ,UACpC,CAAClB,EAAmBF,EAAcK,IAE/BgB,EAAgBC,IAClB,MAAMC,EAAaL,EAAMI,GAEzB,GACIE,EAAeC,cACXF,EACAlB,EAAUa,EAAMb,QAAWqB,EAC3BpB,EAAUY,EAAMZ,QAAWoB,GAEjC,CACE,IAAKH,EAAWJ,OAAOnB,EAAc,SAGjC,OAFAS,SAAAA,EAAkBa,QAClBZ,EAAgBG,QAAUS,GAG9BP,EAAcO,EAClB,GAMEK,EAAkBC,GACpB,IAAiBJ,EAAeK,aAAa7B,IAC7C,CAACA,IAEC8B,EAAcF,GAChB,IAAaZ,KACb,CAACA,KAGEe,EAAYhB,GAAiBiB,EAAiB,KAC9CC,EAAYC,GAAiBF,EAAiB,IAK/CG,EAAiB,CAACb,EAAcc,KAC9BA,IAAe7B,IAEnBJ,EAASmB,GAEHA,IAAUJ,EAAMI,GAAOH,OAAOG,EAAO,UACvCY,EAAc,IAClB,EAGEG,EAAkB,CAACf,EAAec,KAChCA,IAAe7B,IACnB2B,EAAcZ,GACdlB,EAAQkB,GAAM,EAGZgB,EAAmBhB,IAErBY,EAAcZ,GACdlB,EAAQkB,EAAM,EAGZiB,EAAuB,KACzBL,EAAc,IACd9B,EAAQ,GAAG,EAgEf,OACIoC,EAACC,EAAO,CACJC,KAAK,OACLC,OAhEcC,IACdA,EAAEC,cAAcC,SAASF,EAAEG,iBAK/BhC,EAAc,IACdmB,EAAc,IACd9B,EAAQ,IAAG,gBAyDK,mBAAkB,aACnB,YAAW4C,SAAA,CAnDnBrB,EAAgB,GAAGsB,KAAI,CAACC,EAAKC,IAChCC,EAACC,EAAU,CAAA,eAAA,EAAAL,SACN9B,EAAMgC,GAAKI,OAAO,QADN,YAAYH,OAO1BxB,EAAgBsB,KAAI,CAACM,EAAMC,IAE1BJ,EAACK,EAAU,CACPf,KAAK,MAELgB,aAAcnB,EAAoBS,SAEjCO,EAAKN,KAAI,CAACC,EAAKS,IAERP,EAACQ,EAAiB,CAEdC,KAAMX,EACNlD,aAAcA,EACd8D,aAAc5D,EACd6D,UAAW9B,EACX+B,UAAWjC,EACX1B,QAASA,EACTC,QAASA,EACTL,cAAeA,EACfM,uBAAwBA,EACxBJ,SAAUgC,EACV/B,QAASiC,EACT7B,aAAcA,EACdyD,QAAS3B,EACTjB,aAAcA,EACd6C,SACIhD,EAAMgC,GAAK/B,OAAOW,EAAa,OACzB,GACA,GAlBL,OAAO6B,QANnBH,OA2CP"}
+{"version":3,"file":"fixed-range-calendar-day-view.js","sources":["../../../../src/shared/internal-calendar/fixed-range/fixed-range-calendar-day-view.tsx"],"sourcesContent":["import type { Dayjs } from \"dayjs\";\nimport dayjs from \"dayjs\";\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\n\nimport { CalendarHelper } from \"../../../util/calendar-helper\";\nimport * as styles from \"../standard/standard-calendar-day-view.styles\";\nimport type { CommonCalendarProps } from \"../types\";\nimport { FixedRangeDayCell } from \"./fixed-range-cell\";\n\ninterface FixedRangeCalendarDayViewProps extends CommonCalendarProps {\n    selectedStartDate: string | undefined;\n    numberOfDays: number | undefined;\n    calendarDate: Dayjs;\n    onSelect: (value: Dayjs) => void;\n    onHover: (value: string) => void;\n    setCalendarDate?: ((date: string | undefined) => void) | undefined;\n}\n\nexport const FixedRangeCalendarDayView = ({\n    calendarDate,\n    disabledDates,\n    selectedStartDate,\n    onSelect,\n    onHover,\n    minDate,\n    maxDate,\n    allowDisabledSelection,\n    numberOfDays,\n    setCalendarDate,\n}: FixedRangeCalendarDayViewProps) => {\n    // =============================================================================\n    // REFS, EFFECTS\n    // =============================================================================\n    const pendingFocusRef = useRef<string | null>(null);\n\n    useEffect(() => {\n        if (pendingFocusRef.current) {\n            const next = pendingFocusRef.current;\n            pendingFocusRef.current = null;\n            setFocusValue(next);\n        }\n    }, [calendarDate]);\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n    const getDateToFocus = useCallback(() => {\n        // As specified in the Grid Pattern, only one element in the calendar grid is in the Tab sequence.\n        // This function determines which date should be focused based on the state of the calendar.\n\n        // Selected date is in the current month\n        if (\n            selectedStartDate &&\n            dayjs(selectedStartDate).isSame(calendarDate, \"month\")\n        ) {\n            return dayjs(selectedStartDate);\n        }\n\n        // Today is in the current month\n        if (dayjs().isSame(calendarDate, \"month\")) {\n            return dayjs();\n        }\n\n        // Choose min date if it is in the current month\n        if (minDate && calendarDate.isSame(dayjs(minDate), \"month\")) {\n            return dayjs(minDate);\n        }\n\n        // Otherwise, return the first day of the month\n        return dayjs(calendarDate).startOf(\"month\");\n    }, [selectedStartDate, calendarDate, minDate]);\n\n    const setFocusCell = (value: string) => {\n        const valueDayjs = dayjs(value);\n\n        if (\n            CalendarHelper.isWithinRange(\n                valueDayjs,\n                minDate ? dayjs(minDate) : undefined,\n                maxDate ? dayjs(maxDate) : undefined\n            )\n        ) {\n            if (!valueDayjs.isSame(calendarDate, \"month\")) {\n                setCalendarDate?.(value);\n                pendingFocusRef.current = value;\n                return;\n            }\n            setFocusValue(value);\n        }\n    };\n\n    // =============================================================================\n    // CONST, STATE\n    // =============================================================================\n    const weeksOfTheMonth = useMemo(\n        (): Dayjs[][] => CalendarHelper.generateDays(calendarDate),\n        [calendarDate]\n    );\n    const dateToFocus = useMemo(\n        (): Dayjs => getDateToFocus(),\n        [getDateToFocus]\n    );\n\n    const [focusValue, setFocusValue] = useState<string>(\"\");\n    const [hoverValue, setHoverValue] = useState<string>(\"\");\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleDayClick = (value: Dayjs, isDisabled: boolean) => {\n        if (isDisabled && !allowDisabledSelection) return;\n\n        onSelect(value);\n\n        if (!!value && !dayjs(value).isSame(value, \"month\")) {\n            setHoverValue(\"\");\n        }\n    };\n\n    const handleHoverCell = (value: string, isDisabled: boolean) => {\n        if (isDisabled && !allowDisabledSelection) return;\n        setHoverValue(value);\n        onHover(value);\n    };\n\n    const handleFocusCell = (value: string) => {\n        // Always hover the cell when it is focused\n        setHoverValue(value);\n        onHover(value);\n    };\n\n    const handleMouseLeaveCell = () => {\n        setHoverValue(\"\");\n        onHover(\"\");\n    };\n\n    const handleOnBlur = (e: React.FocusEvent<HTMLDivElement>) => {\n        if (e.currentTarget.contains(e.relatedTarget as Node)) {\n            return;\n        }\n\n        // Reset focus date when the component loses focus\n        setFocusValue(\"\");\n        setHoverValue(\"\");\n        onHover(\"\");\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderHeader = () => {\n        return weeksOfTheMonth[0].map((day, index) => (\n            <div\n                key={`week-day-${index}`}\n                className={styles.headerCell}\n                aria-hidden\n            >\n                {dayjs(day).format(\"ddd\")}\n            </div>\n        ));\n    };\n\n    const renderDayCells = () => {\n        return weeksOfTheMonth.map((week, weekIndex) => {\n            return (\n                <div\n                    role=\"row\"\n                    key={weekIndex}\n                    onMouseLeave={handleMouseLeaveCell}\n                    className={styles.rowDayCell}\n                >\n                    {week.map((day, dayIndex) => {\n                        return (\n                            <FixedRangeDayCell\n                                key={`day-${dayIndex}`}\n                                date={day}\n                                calendarDate={calendarDate}\n                                selectedDate={selectedStartDate}\n                                hoverDate={hoverValue}\n                                focusDate={focusValue}\n                                minDate={minDate}\n                                maxDate={maxDate}\n                                disabledDates={disabledDates}\n                                allowDisabledSelection={allowDisabledSelection}\n                                onSelect={handleDayClick}\n                                onHover={handleHoverCell}\n                                numberOfDays={numberOfDays}\n                                onFocus={handleFocusCell}\n                                setFocusCell={setFocusCell}\n                                tabIndex={\n                                    dayjs(day).isSame(dateToFocus, \"day\")\n                                        ? 0\n                                        : -1\n                                }\n                            />\n                        );\n                    })}\n                </div>\n            );\n        });\n    };\n\n    return (\n        <div\n            role=\"grid\"\n            onBlur={handleOnBlur}\n            data-testid=\"calendar-content\"\n            aria-label=\"Date grid\"\n            className={styles.wrapper}\n        >\n            {renderHeader()}\n            {renderDayCells()}\n        </div>\n    );\n};\n"],"names":["FixedRangeCalendarDayView","calendarDate","disabledDates","selectedStartDate","onSelect","onHover","minDate","maxDate","allowDisabledSelection","numberOfDays","setCalendarDate","pendingFocusRef","useRef","useEffect","current","next","setFocusValue","getDateToFocus","useCallback","dayjs","isSame","startOf","setFocusCell","value","valueDayjs","CalendarHelper","isWithinRange","undefined","weeksOfTheMonth","useMemo","generateDays","dateToFocus","focusValue","useState","hoverValue","setHoverValue","handleDayClick","isDisabled","handleHoverCell","handleFocusCell","handleMouseLeaveCell","_jsxs","role","onBlur","e","currentTarget","contains","relatedTarget","className","styles.wrapper","children","map","day","index","_jsx","styles.headerCell","format","week","weekIndex","onMouseLeave","styles.rowDayCell","dayIndex","FixedRangeDayCell","date","selectedDate","hoverDate","focusDate","onFocus","tabIndex"],"mappings":"uaAkBO,MAAMA,EAA4B,EACrCC,eACAC,gBACAC,oBACAC,WACAC,UACAC,UACAC,UACAC,yBACAC,eACAC,sBAKA,MAAMC,EAAkBC,EAAsB,MAE9CC,GAAU,KACN,GAAIF,EAAgBG,QAAS,CACzB,MAAMC,EAAOJ,EAAgBG,QAC7BH,EAAgBG,QAAU,KAC1BE,EAAcD,EAClB,IACD,CAACd,IAKJ,MAAMgB,EAAiBC,GAAY,IAM3Bf,GACAgB,EAAMhB,GAAmBiB,OAAOnB,EAAc,SAEvCkB,EAAMhB,GAIbgB,IAAQC,OAAOnB,EAAc,SACtBkB,IAIPb,GAAWL,EAAamB,OAAOD,EAAMb,GAAU,SACxCa,EAAMb,GAIVa,EAAMlB,GAAcoB,QAAQ,UACpC,CAAClB,EAAmBF,EAAcK,IAE/BgB,EAAgBC,IAClB,MAAMC,EAAaL,EAAMI,GAEzB,GACIE,EAAeC,cACXF,EACAlB,EAAUa,EAAMb,QAAWqB,EAC3BpB,EAAUY,EAAMZ,QAAWoB,GAEjC,CACE,IAAKH,EAAWJ,OAAOnB,EAAc,SAGjC,OAFAS,SAAAA,EAAkBa,QAClBZ,EAAgBG,QAAUS,GAG9BP,EAAcO,EAClB,GAMEK,EAAkBC,GACpB,IAAiBJ,EAAeK,aAAa7B,IAC7C,CAACA,IAEC8B,EAAcF,GAChB,IAAaZ,KACb,CAACA,KAGEe,EAAYhB,GAAiBiB,EAAiB,KAC9CC,EAAYC,GAAiBF,EAAiB,IAK/CG,EAAiB,CAACb,EAAcc,KAC9BA,IAAe7B,IAEnBJ,EAASmB,GAEHA,IAAUJ,EAAMI,GAAOH,OAAOG,EAAO,UACvCY,EAAc,IAClB,EAGEG,EAAkB,CAACf,EAAec,KAChCA,IAAe7B,IACnB2B,EAAcZ,GACdlB,EAAQkB,GAAM,EAGZgB,EAAmBhB,IAErBY,EAAcZ,GACdlB,EAAQkB,EAAM,EAGZiB,EAAuB,KACzBL,EAAc,IACd9B,EAAQ,GAAG,EAqEf,OACIoC,EAAA,MAAA,CACIC,KAAK,OACLC,OArEcC,IACdA,EAAEC,cAAcC,SAASF,EAAEG,iBAK/B/B,EAAc,IACdmB,EAAc,IACd9B,EAAQ,IAAG,EA6Da,cACR,mBAAkB,aACnB,YACX2C,UAAWC,EAAcC,SAAA,CAzDtBtB,EAAgB,GAAGuB,KAAI,CAACC,EAAKC,IAChCC,EAAA,MAAA,CAEIN,UAAWO,4BAGVpC,EAAMiC,GAAKI,OAAO,QAJd,YAAYH,OAUlBzB,EAAgBuB,KAAI,CAACM,EAAMC,IAE1BJ,EAAA,MAAA,CACIZ,KAAK,MAELiB,aAAcnB,EACdQ,UAAWY,EAAiBV,SAE3BO,EAAKN,KAAI,CAACC,EAAKS,IAERP,EAACQ,EAAiB,CAEdC,KAAMX,EACNnD,aAAcA,EACd+D,aAAc7D,EACd8D,UAAW/B,EACXgC,UAAWlC,EACX1B,QAASA,EACTC,QAASA,EACTL,cAAeA,EACfM,uBAAwBA,EACxBJ,SAAUgC,EACV/B,QAASiC,EACT7B,aAAcA,EACd0D,QAAS5B,EACTjB,aAAcA,EACd8C,SACIjD,EAAMiC,GAAKhC,OAAOW,EAAa,OACzB,GACA,GAlBL,OAAO8B,QAPnBH,OA6CX"}

package/shared/internal-calendar/fixed-range/fixed-range-cell.d.ts

@@ -1,4 +1,4 @@
-import { Dayjs } from "dayjs";
+import type { Dayjs } from "dayjs";
 interface Props {
     date: Dayjs;
     calendarDate: Dayjs;

package/shared/internal-calendar/fixed-range/fixed-range-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{DateHelper as r}from"../../../util/date-helper.js";import"../../../util/date-input-helper.js";import"react";import"../../../util/simple-id-generator.js";import"../../../util/string-helper.js";import"@react-aria/live-announcer";import{DayCell as o}from"../day-cell/day-cell.js";const n=({date:n,calendarDate:i,selectedDate:d,hoverDate:l,focusDate:s,minDate:c,maxDate:m,disabledDates:D,allowDisabledSelection:u,numberOfDays:y=1,onSelect:f,onHover:p,onFocus:b,setFocusCell:v,tabIndex:h})=>{const M=a.isDisabledDay(n,D,c,m),Y=!M||u,{start:g,end:j}=d?a.getFixedRangeStartEnd(r.toDayjs(d),y):{start:void 0,end:void 0},{start:w,end:S}=l?a.getFixedRangeStartEnd(r.toDayjs(l),y):{start:void 0,end:void 0},x=!!d&&n.isBetween(g,j,"day","[]"),F=!!l&&n.isBetween(w,S,"day","[]"),A=x&&n.isSame(g,"day")||F&&n.isSame(w,"day"),R=x&&n.isSame(j,"day")||F&&n.isSame(S,"day"),k=`From ${t(w).format("D MMMM")} to ${t(S).format("D MMMM")}, ${M?"Unavailable":"Available"}`,E=()=>{f(n,!Y)},L=(e,t,a,r)=>{a?e.circleLeft=t:e.bgLeft=t,r?e.circleRight=t:e.bgRight=t},O={date:n,calendarDate:i,disabled:M,interactive:Y,currentDateIndicator:!0,onSelect:E,onHover:()=>{p(n.format("YYYY-MM-DD"),!Y)},onFocus:()=>{b(n.format("YYYY-MM-DD"))},onKeyDown:e=>{const t=e.key;if("Enter"===t||" "===t)return e.preventDefault(),void(Y&&E());(e=>{let t;const a={ArrowLeft:()=>n.subtract(1,"day"),ArrowRight:()=>n.add(1,"day"),ArrowUp:()=>n.subtract(7,"day"),ArrowDown:()=>n.add(7,"day"),Home:()=>n.startOf("week"),End:()=>n.endOf("week"),PageUp:()=>e.shiftKey?n.subtract(1,"year"):n.subtract(1,"month"),PageDown:()=>e.shiftKey?n.add(1,"year"):n.add(1,"month")}[e.key];a&&(e.preventDefault(),t=a(),v(t.format("YYYY-MM-DD")))})(e)},focusDate:t(s),role:"gridcell",tabIndex:h,label:k};return e(o,Object.assign({},O,(()=>{const e={};return x||F?e.labelType="selected":i.month()!==n.month()?e.labelType="unavailable":t().isSame(n,"day")&&!M&&(e.labelType="current"),e})(),(()=>{const e={},t=n.format("YYYY-MM-DD");return F&&L(e,"hover",t===w,t===S),x&&L(e,"selected-outline",t===g,t===j),x&&F&&(L(e,"selected-hover-outline",A,R),t===w&&t!==g&&(e.circleLeft="selected-hover")),e})()))};export{n as FixedRangeDayCell};
+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{DateHelper as r}from"../../../util/date-helper.js";import"react";import"../../../util/simple-id-generator.js";import"../../../util/string-helper.js";import"@react-aria/live-announcer";import{DayCell as o}from"../day-cell/day-cell.js";const n=({date:n,calendarDate:d,selectedDate:i,hoverDate:l,focusDate:s,minDate:c,maxDate:m,disabledDates:D,allowDisabledSelection:y,numberOfDays:u=1,onSelect:f,onHover:b,onFocus:p,setFocusCell:v,tabIndex:h})=>{const M=a.isDisabledDay(n,D,c,m),Y=!M||y,{start:g,end:j}=i?a.getFixedRangeStartEnd(r.toDayjs(i),u):{start:void 0,end:void 0},{start:w,end:S}=l?a.getFixedRangeStartEnd(r.toDayjs(l),u):{start:void 0,end:void 0},x=!!i&&n.isBetween(g,j,"day","[]"),F=!!l&&n.isBetween(w,S,"day","[]"),A=x&&n.isSame(g,"day")||F&&n.isSame(w,"day"),R=x&&n.isSame(j,"day")||F&&n.isSame(S,"day"),k=`From ${t(w).format("D MMMM")} to ${t(S).format("D MMMM")}, ${M?"Unavailable":"Available"}`,E=()=>{f(n,!Y)},L=(e,t,a,r)=>{a?e.circleLeft=t:e.bgLeft=t,r?e.circleRight=t:e.bgRight=t},O={date:n,calendarDate:d,disabled:M,interactive:Y,currentDateIndicator:!0,onSelect:E,onHover:()=>{b(n.format("YYYY-MM-DD"),!Y)},onFocus:()=>{p(n.format("YYYY-MM-DD"))},onKeyDown:e=>{const t=e.key;if("Enter"===t||" "===t)return e.preventDefault(),void(Y&&E());(e=>{let t;const a={ArrowLeft:()=>n.subtract(1,"day"),ArrowRight:()=>n.add(1,"day"),ArrowUp:()=>n.subtract(7,"day"),ArrowDown:()=>n.add(7,"day"),Home:()=>n.startOf("week"),End:()=>n.endOf("week"),PageUp:()=>e.shiftKey?n.subtract(1,"year"):n.subtract(1,"month"),PageDown:()=>e.shiftKey?n.add(1,"year"):n.add(1,"month")}[e.key];a&&(e.preventDefault(),t=a(),v(t.format("YYYY-MM-DD")))})(e)},focusDate:t(s),role:"gridcell",tabIndex:h,label:k};return e(o,Object.assign({},O,(()=>{const e={};return x||F?e.labelType="selected":d.month()!==n.month()?e.labelType="unavailable":t().isSame(n,"day")&&!M&&(e.labelType="current"),e})(),(()=>{const e={},t=n.format("YYYY-MM-DD");return F&&L(e,"hover",t===w,t===S),x&&L(e,"selected-outline",t===g,t===j),x&&F&&(L(e,"selected-hover-outline",A,R),t===w&&t!==g&&(e.circleLeft="selected-hover")),e})()))};export{n as FixedRangeDayCell};
 //# sourceMappingURL=fixed-range-cell.js.map

package/shared/internal-calendar/fixed-range/fixed-range-cell.js.map

@@ -1 +1 @@
-{"version":3,"file":"fixed-range-cell.js","sources":["../../../../src/shared/internal-calendar/fixed-range/fixed-range-cell.tsx"],"sourcesContent":["import dayjs, { Dayjs } from \"dayjs\";\nimport { CalendarHelper, DateHelper } from \"../../../util\";\nimport { CellStyleProps, CellType, DayCell, DayCellProps } from \"../day-cell\";\n\ninterface Props {\n    date: Dayjs;\n    calendarDate: Dayjs;\n    selectedDate: string | undefined;\n    focusDate: string;\n    hoverDate: string | undefined;\n    minDate?: string | undefined;\n    maxDate?: string | undefined;\n    disabledDates?: string[] | undefined;\n    allowDisabledSelection?: boolean | undefined;\n    numberOfDays?: number | 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 FixedRangeDayCell = ({\n    date,\n    calendarDate,\n    selectedDate,\n    hoverDate,\n    focusDate,\n    minDate,\n    maxDate,\n    disabledDates,\n    allowDisabledSelection,\n    numberOfDays = 1,\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    const { start: rangeStart, end: rangeEnd } = selectedDate\n        ? CalendarHelper.getFixedRangeStartEnd(\n              DateHelper.toDayjs(selectedDate),\n              numberOfDays\n          )\n        : { start: undefined, end: undefined };\n    const { start: hoverStart, end: hoverEnd } = hoverDate\n        ? CalendarHelper.getFixedRangeStartEnd(\n              DateHelper.toDayjs(hoverDate),\n              numberOfDays\n          )\n        : { start: undefined, end: undefined };\n\n    const isSelected =\n        !!selectedDate && date.isBetween(rangeStart, rangeEnd, \"day\", \"[]\");\n    const isHover =\n        !!hoverDate && date.isBetween(hoverStart, hoverEnd, \"day\", \"[]\");\n    const isStart =\n        (isSelected && date.isSame(rangeStart, \"day\")) ||\n        (isHover && date.isSame(hoverStart, \"day\"));\n    const isEnd =\n        (isSelected && date.isSame(rangeEnd, \"day\")) ||\n        (isHover && date.isSame(hoverEnd, \"day\"));\n\n    // For accessible label\n    const label = `From ${dayjs(hoverStart).format(\"D MMMM\")} to ${dayjs(\n        hoverEnd\n    ).format(\"D MMMM\")}, ${disabled ? \"Unavailable\" : \"Available\"}`;\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 applyRange = (\n        props: CellStyleProps,\n        type: CellType,\n        start: boolean,\n        end: boolean\n    ) => {\n        if (start) {\n            props.circleLeft = type;\n        } else {\n            props.bgLeft = type;\n        }\n\n        if (end) {\n            props.circleRight = type;\n        } else {\n            props.bgRight = type;\n        }\n    };\n\n    const getRangeStyle = (): CellStyleProps => {\n        const props: CellStyleProps = {};\n\n        const formattedDate = date.format(\"YYYY-MM-DD\");\n\n        if (isHover) {\n            applyRange(\n                props,\n                \"hover\",\n                formattedDate === hoverStart,\n                formattedDate === hoverEnd\n            );\n        }\n        if (isSelected) {\n            applyRange(\n                props,\n                \"selected-outline\",\n                formattedDate === rangeStart,\n                formattedDate === rangeEnd\n            );\n        }\n        if (isSelected && isHover) {\n            applyRange(props, \"selected-hover-outline\", isStart, isEnd);\n\n            if (formattedDate === hoverStart && formattedDate !== rangeStart) {\n                props.circleLeft = \"selected-hover\";\n            }\n        }\n\n        return props;\n    };\n\n    const getCellStyle = () => {\n        const props: CellStyleProps = {};\n\n        if (isSelected || isHover) {\n            props.labelType = \"selected\";\n        } else if (calendarDate.month() !== date.month()) {\n            props.labelType = \"unavailable\";\n        } else if (dayjs().isSame(date, \"day\") && !disabled) {\n            props.labelType = \"current\";\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        focusDate: dayjs(focusDate),\n        role: \"gridcell\",\n        tabIndex,\n        label,\n    };\n\n    return (\n        <DayCell {...commonProps} {...getCellStyle()} {...getRangeStyle()} />\n    );\n};\n"],"names":["FixedRangeDayCell","date","calendarDate","selectedDate","hoverDate","focusDate","minDate","maxDate","disabledDates","allowDisabledSelection","numberOfDays","onSelect","onHover","onFocus","setFocusCell","tabIndex","disabled","CalendarHelper","isDisabledDay","interactive","start","rangeStart","end","rangeEnd","getFixedRangeStartEnd","DateHelper","toDayjs","undefined","hoverStart","hoverEnd","isSelected","isBetween","isHover","isStart","isSame","isEnd","label","dayjs","format","handleSelect","applyRange","props","type","circleLeft","bgLeft","circleRight","bgRight","commonProps","currentDateIndicator","onKeyDown","event","selectedKey","key","preventDefault","newFocusSelection","action","ArrowLeft","subtract","ArrowRight","add","ArrowUp","ArrowDown","Home","startOf","End","endOf","PageUp","shiftKey","PageDown","handleKeyNavigation","role","_jsx","DayCell","Object","assign","labelType","month","getCellStyle","formattedDate","getRangeStyle"],"mappings":"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"}
+{"version":3,"file":"fixed-range-cell.js","sources":["../../../../src/shared/internal-calendar/fixed-range/fixed-range-cell.tsx"],"sourcesContent":["import type { Dayjs } from \"dayjs\";\nimport dayjs from \"dayjs\";\n\nimport { CalendarHelper, DateHelper } from \"../../../util\";\nimport type { CellStyleProps, CellType, DayCellProps } from \"../day-cell\";\nimport { DayCell } from \"../day-cell\";\n\ninterface Props {\n    date: Dayjs;\n    calendarDate: Dayjs;\n    selectedDate: string | undefined;\n    focusDate: string;\n    hoverDate: string | undefined;\n    minDate?: string | undefined;\n    maxDate?: string | undefined;\n    disabledDates?: string[] | undefined;\n    allowDisabledSelection?: boolean | undefined;\n    numberOfDays?: number | 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 FixedRangeDayCell = ({\n    date,\n    calendarDate,\n    selectedDate,\n    hoverDate,\n    focusDate,\n    minDate,\n    maxDate,\n    disabledDates,\n    allowDisabledSelection,\n    numberOfDays = 1,\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    const { start: rangeStart, end: rangeEnd } = selectedDate\n        ? CalendarHelper.getFixedRangeStartEnd(\n              DateHelper.toDayjs(selectedDate),\n              numberOfDays\n          )\n        : { start: undefined, end: undefined };\n    const { start: hoverStart, end: hoverEnd } = hoverDate\n        ? CalendarHelper.getFixedRangeStartEnd(\n              DateHelper.toDayjs(hoverDate),\n              numberOfDays\n          )\n        : { start: undefined, end: undefined };\n\n    const isSelected =\n        !!selectedDate && date.isBetween(rangeStart, rangeEnd, \"day\", \"[]\");\n    const isHover =\n        !!hoverDate && date.isBetween(hoverStart, hoverEnd, \"day\", \"[]\");\n    const isStart =\n        (isSelected && date.isSame(rangeStart, \"day\")) ||\n        (isHover && date.isSame(hoverStart, \"day\"));\n    const isEnd =\n        (isSelected && date.isSame(rangeEnd, \"day\")) ||\n        (isHover && date.isSame(hoverEnd, \"day\"));\n\n    // For accessible label\n    const label = `From ${dayjs(hoverStart).format(\"D MMMM\")} to ${dayjs(\n        hoverEnd\n    ).format(\"D MMMM\")}, ${disabled ? \"Unavailable\" : \"Available\"}`;\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 applyRange = (\n        props: CellStyleProps,\n        type: CellType,\n        start: boolean,\n        end: boolean\n    ) => {\n        if (start) {\n            props.circleLeft = type;\n        } else {\n            props.bgLeft = type;\n        }\n\n        if (end) {\n            props.circleRight = type;\n        } else {\n            props.bgRight = type;\n        }\n    };\n\n    const getRangeStyle = (): CellStyleProps => {\n        const props: CellStyleProps = {};\n\n        const formattedDate = date.format(\"YYYY-MM-DD\");\n\n        if (isHover) {\n            applyRange(\n                props,\n                \"hover\",\n                formattedDate === hoverStart,\n                formattedDate === hoverEnd\n            );\n        }\n        if (isSelected) {\n            applyRange(\n                props,\n                \"selected-outline\",\n                formattedDate === rangeStart,\n                formattedDate === rangeEnd\n            );\n        }\n        if (isSelected && isHover) {\n            applyRange(props, \"selected-hover-outline\", isStart, isEnd);\n\n            if (formattedDate === hoverStart && formattedDate !== rangeStart) {\n                props.circleLeft = \"selected-hover\";\n            }\n        }\n\n        return props;\n    };\n\n    const getCellStyle = () => {\n        const props: CellStyleProps = {};\n\n        if (isSelected || isHover) {\n            props.labelType = \"selected\";\n        } else if (calendarDate.month() !== date.month()) {\n            props.labelType = \"unavailable\";\n        } else if (dayjs().isSame(date, \"day\") && !disabled) {\n            props.labelType = \"current\";\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        focusDate: dayjs(focusDate),\n        role: \"gridcell\",\n        tabIndex,\n        label,\n    };\n\n    return (\n        <DayCell {...commonProps} {...getCellStyle()} {...getRangeStyle()} />\n    );\n};\n"],"names":["FixedRangeDayCell","date","calendarDate","selectedDate","hoverDate","focusDate","minDate","maxDate","disabledDates","allowDisabledSelection","numberOfDays","onSelect","onHover","onFocus","setFocusCell","tabIndex","disabled","CalendarHelper","isDisabledDay","interactive","start","rangeStart","end","rangeEnd","getFixedRangeStartEnd","DateHelper","toDayjs","undefined","hoverStart","hoverEnd","isSelected","isBetween","isHover","isStart","isSame","isEnd","label","dayjs","format","handleSelect","applyRange","props","type","circleLeft","bgLeft","circleRight","bgRight","commonProps","currentDateIndicator","onKeyDown","event","selectedKey","key","preventDefault","newFocusSelection","action","ArrowLeft","subtract","ArrowRight","add","ArrowUp","ArrowDown","Home","startOf","End","endOf","PageUp","shiftKey","PageDown","handleKeyNavigation","role","_jsx","DayCell","Object","assign","labelType","month","getCellStyle","formattedDate","getRangeStyle"],"mappings":"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"}

package/shared/internal-calendar/internal-calendar-month.d.ts

@@ -1,5 +1,5 @@
-import { Dayjs } from "dayjs";
-import { FocusType, InternalCalendarProps } from "./types";
+import type { Dayjs } from "dayjs";
+import type { FocusType, InternalCalendarProps } from "./types";
 export type MonthVariant = "default" | "current-month" | "selected-month";
 interface Props extends Pick<InternalCalendarProps, "minDate" | "maxDate" | "allowDisabledSelection"> {
     calendarDate: Dayjs;

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

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import t from"../../external/dayjs/dayjs.min.js";import{useMemo as n,useRef as r,useState as a,useEffect as o}from"react";import{CalendarHelper as i}from"../../util/calendar-helper.js";import{Wrapper as l,MonthCell as s}from"./internal-calendar-month.style.js";const c=({calendarDate:c,currentFocus:d,selectedStartDate:m,selectedEndDate:h,viewCalendarDate:u,isNewSelection:f,minDate:v,maxDate:p,allowDisabledSelection:D,onMonthSelect:b})=>{const w=n((()=>i.generateMonths(t(c))),[c]),y=r(new Array(w.length).fill(null)),[x,S]=a(w.findIndex((e=>e.isSame(u,"month"))));o((()=>{var e;null!==x&&(null===(e=y.current[x])||void 0===e||e.focus())}),[x,w]);const g=(e,t)=>{t||b(e)},j=e=>{const t="start"===d&&h&&e.isAfter(h,"month")&&f,n="end"===d&&m&&e.isBefore(m,"month")&&f;return!(!t&&!n)},k=e=>{const n=e.format("MMMM"),r=(a=e,!i.isWithinRange(a,v?t(v):void 0,p?t(p):void 0,"month"));var a;const o=u.isSame(e,"month"),l=o?"selected-month":t().isSame(e,"month")?"current-month":"default",s=u.isSame(e,"year")?o?0:-1:0===e.month()?0:-1;return{disabledDisplay:r||j(e),interactive:!r||D,month:n,variant:l,tabIndex:s}};return w.length?e(l,{onBlur:()=>{S(null)},children:w.map(((t,n)=>{const{disabledDisplay:r,interactive:a,variant:o,month:i,tabIndex:l}=k(t);return e(s,{ref:e=>y.current[n]=e,tabIndex:l,role:"button","aria-disabled":!a,"aria-selected":"selected-month"===o,$variant:o,$disabledDisplay:r,$interactive:a,onClick:()=>g(t,!a),onKeyDown:e=>{((e,t,n)=>{const r=e.key;let a;const o=w.indexOf(t);switch(r){case"Enter":case" ":e.preventDefault(),g(t,n);break;case"ArrowLeft":a=o-1;break;case"ArrowRight":a=o+1;break;case"ArrowUp":a=o-2;break;case"ArrowDown":a=o+2}void 0!==a&&a>=0&&a<w.length&&(e.preventDefault(),S(a))})(e,t,!a)},children:i},i)}))}):null};export{c as InternalCalendarMonth};
+import{jsx as e}from"react/jsx-runtime";import t from"clsx";import n from"../../external/dayjs/dayjs.min.js";import{useMemo as r,useRef as a,useState as o,useEffect as l}from"react";import{CalendarHelper as s}from"../../util/calendar-helper.js";import{wrapper as i,monthCell as c,monthCellDisabledDisplay as m,monthCellInteractive as d,monthCellCurrentMonth as h,monthCellSelectedMonth as u,monthCellDefaultHover as f,monthCellSelectedHover as v}from"./internal-calendar-month.styles.js";const p=({calendarDate:p,currentFocus:D,selectedStartDate:b,selectedEndDate:w,viewCalendarDate:x,isNewSelection:y,minDate:S,maxDate:g,allowDisabledSelection:j,onMonthSelect:k})=>{const A=r((()=>s.generateMonths(n(p))),[p]),M=a(new Array(A.length).fill(null)),[I,N]=o(A.findIndex((e=>e.isSame(x,"month"))));l((()=>{var e;null!==I&&(null===(e=M.current[I])||void 0===e||e.focus())}),[I,A]);const B=(e,t)=>{t||k(e)},C=e=>{const t="start"===D&&w&&e.isAfter(w,"month")&&y,n="end"===D&&b&&e.isBefore(b,"month")&&y;return!(!t&&!n)},E=e=>{const t=e.format("MMMM"),r=(a=e,!s.isWithinRange(a,S?n(S):void 0,g?n(g):void 0,"month"));var a;const o=x.isSame(e,"month"),l=o?"selected-month":n().isSame(e,"month")?"current-month":"default",i=x.isSame(e,"year")?o?0:-1:0===e.month()?0:-1;return{disabledDisplay:r||C(e),interactive:!r||j,month:t,variant:l,tabIndex:i}};return A.length?e("div",{className:i,onBlur:()=>{N(null)},children:A.map(((n,r)=>{const{disabledDisplay:a,interactive:o,variant:l,month:s,tabIndex:i}=E(n);return e("div",{ref:e=>M.current[r]=e,tabIndex:i,role:"button","aria-disabled":!o,"aria-selected":"selected-month"===l,className:t(c,a&&m,o&&d,"current-month"===l&&h,"selected-month"===l&&u,o&&"selected-month"!==l&&f,o&&"selected-month"===l&&v),onClick:()=>B(n,!o),onKeyDown:e=>{((e,t,n)=>{const r=e.key;let a;const o=A.indexOf(t);switch(r){case"Enter":case" ":e.preventDefault(),B(t,n);break;case"ArrowLeft":a=o-1;break;case"ArrowRight":a=o+1;break;case"ArrowUp":a=o-2;break;case"ArrowDown":a=o+2}void 0!==a&&a>=0&&a<A.length&&(e.preventDefault(),N(a))})(e,n,!o)},children:s},s)}))}):null};export{p as InternalCalendarMonth};
 //# sourceMappingURL=internal-calendar-month.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"internal-calendar-month.js","sources":["../../../src/shared/internal-calendar/internal-calendar-month.tsx"],"sourcesContent":["import dayjs, { Dayjs } from \"dayjs\";\nimport { useEffect, useMemo, useRef, useState } from \"react\";\nimport { CalendarHelper } from \"../../util/calendar-helper\";\nimport { MonthCell, Wrapper } from \"./internal-calendar-month.style\";\nimport { FocusType, InternalCalendarProps } from \"./types\";\n\nexport type MonthVariant = \"default\" | \"current-month\" | \"selected-month\";\n\ninterface Props\n    extends Pick<\n        InternalCalendarProps,\n        \"minDate\" | \"maxDate\" | \"allowDisabledSelection\"\n    > {\n    calendarDate: Dayjs;\n    currentFocus?: FocusType | undefined;\n    selectedStartDate: string | undefined;\n    selectedEndDate?: string | undefined;\n    viewCalendarDate: Dayjs;\n    isNewSelection: boolean;\n    onMonthSelect: (value: Dayjs) => void;\n}\n\nexport const InternalCalendarMonth = ({\n    calendarDate,\n    currentFocus,\n    selectedStartDate,\n    selectedEndDate,\n    viewCalendarDate,\n    isNewSelection,\n    minDate,\n    maxDate,\n    allowDisabledSelection,\n    onMonthSelect,\n}: Props) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const months = useMemo<Dayjs[]>(\n        () => CalendarHelper.generateMonths(dayjs(calendarDate)),\n        [calendarDate]\n    );\n    const monthRefs = useRef<Array<HTMLDivElement | null>>(\n        new Array(months.length).fill(null)\n    );\n\n    const [focusedMonthIndex, setFocusedMonthIndex] = useState<number | null>(\n        months.findIndex((month) => month.isSame(viewCalendarDate, \"month\"))\n    );\n    useEffect(() => {\n        // Focus the month cell that corresponds to the focused month\n        if (focusedMonthIndex === null) return;\n\n        monthRefs.current[focusedMonthIndex]?.focus();\n    }, [focusedMonthIndex, months]);\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleOnBlur = () => {\n        // Reset focused year when the component loses focus\n        setFocusedMonthIndex(null);\n    };\n\n    const handleMonthClick = (value: Dayjs, isDisabled: boolean) => {\n        if (isDisabled) return;\n\n        onMonthSelect(value);\n    };\n\n    const handleKeyDown = (\n        event: React.KeyboardEvent<HTMLDivElement>,\n        value: Dayjs,\n        isDisabled: boolean\n    ) => {\n        const keyboardEvent = event as React.KeyboardEvent<HTMLInputElement>;\n        const selectedKey = keyboardEvent.key;\n\n        let newMonthSelection: number | undefined;\n        const currentIndex = months.indexOf(value);\n        switch (selectedKey) {\n            case \"Enter\":\n            case \" \":\n                event.preventDefault();\n                handleMonthClick(value, isDisabled);\n                break;\n            case \"ArrowLeft\":\n                newMonthSelection = currentIndex - 1;\n                break;\n            case \"ArrowRight\":\n                newMonthSelection = currentIndex + 1;\n                break;\n            case \"ArrowUp\":\n                newMonthSelection = currentIndex - 2;\n                break;\n            case \"ArrowDown\":\n                newMonthSelection = currentIndex + 2;\n                break;\n            default:\n                break;\n        }\n\n        if (\n            newMonthSelection !== undefined &&\n            newMonthSelection >= 0 &&\n            newMonthSelection < months.length\n        ) {\n            event.preventDefault();\n            setFocusedMonthIndex(newMonthSelection);\n        }\n    };\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n    const isDisabled = (day: Dayjs): boolean => {\n        const isWithinRange = CalendarHelper.isWithinRange(\n            day,\n            minDate ? dayjs(minDate) : undefined,\n            maxDate ? dayjs(maxDate) : undefined,\n            \"month\"\n        );\n\n        return !isWithinRange;\n    };\n\n    const isOutsideSelectedRange = (day: Dayjs): boolean => {\n        const isStartAfterEnd =\n            currentFocus === \"start\" &&\n            selectedEndDate &&\n            day.isAfter(selectedEndDate, \"month\") &&\n            isNewSelection;\n\n        const isEndBeforeStart =\n            currentFocus === \"end\" &&\n            selectedStartDate &&\n            day.isBefore(selectedStartDate, \"month\") &&\n            isNewSelection;\n\n        return !!(isStartAfterEnd || isEndBeforeStart);\n    };\n\n    const generateMonthStatus = (date: Dayjs) => {\n        const month = date.format(\"MMMM\");\n        const disabled = isDisabled(date);\n        const isSelectedMonth = viewCalendarDate.isSame(date, \"month\");\n\n        const variant: MonthVariant = isSelectedMonth\n            ? \"selected-month\"\n            : dayjs().isSame(date, \"month\")\n            ? \"current-month\"\n            : \"default\";\n\n        // Only selected month in tab order\n        const tabIndex = viewCalendarDate.isSame(date, \"year\")\n            ? isSelectedMonth\n                ? 0\n                : -1\n            : date.month() === 0\n            ? 0\n            : -1;\n\n        return {\n            disabledDisplay: disabled || isOutsideSelectedRange(date),\n            interactive: !disabled || allowDisabledSelection,\n            month,\n            variant,\n            tabIndex,\n        };\n    };\n\n    // =============================================================================\n    // RENDER FUNCTION\n    // =============================================================================\n    if (!months.length) return null;\n\n    return (\n        <Wrapper onBlur={handleOnBlur}>\n            {months.map((date, index) => {\n                const {\n                    disabledDisplay,\n                    interactive,\n                    variant,\n                    month,\n                    tabIndex,\n                } = generateMonthStatus(date);\n\n                return (\n                    <MonthCell\n                        ref={(el) => (monthRefs.current[index] = el)}\n                        tabIndex={tabIndex}\n                        role=\"button\"\n                        aria-disabled={!interactive}\n                        aria-selected={variant === \"selected-month\"}\n                        key={month}\n                        $variant={variant}\n                        $disabledDisplay={disabledDisplay}\n                        $interactive={interactive}\n                        onClick={() => handleMonthClick(date, !interactive)}\n                        onKeyDown={(event) => {\n                            handleKeyDown(event, date, !interactive);\n                        }}\n                    >\n                        {month}\n                    </MonthCell>\n                );\n            })}\n        </Wrapper>\n    );\n};\n"],"names":["InternalCalendarMonth","calendarDate","currentFocus","selectedStartDate","selectedEndDate","viewCalendarDate","isNewSelection","minDate","maxDate","allowDisabledSelection","onMonthSelect","months","useMemo","CalendarHelper","generateMonths","dayjs","monthRefs","useRef","Array","length","fill","focusedMonthIndex","setFocusedMonthIndex","useState","findIndex","month","isSame","useEffect","_a","current","focus","handleMonthClick","value","isDisabled","isOutsideSelectedRange","day","isStartAfterEnd","isAfter","isEndBeforeStart","isBefore","generateMonthStatus","date","format","disabled","isWithinRange","undefined","isSelectedMonth","variant","tabIndex","disabledDisplay","interactive","_jsx","Wrapper","onBlur","children","map","index","MonthCell","ref","el","role","$variant","$disabledDisplay","$interactive","onClick","onKeyDown","event","selectedKey","key","newMonthSelection","currentIndex","indexOf","preventDefault","handleKeyDown"],"mappings":"6SAsBO,MAAMA,EAAwB,EACjCC,eACAC,eACAC,oBACAC,kBACAC,mBACAC,iBACAC,UACAC,UACAC,yBACAC,oBAKA,MAAMC,EAASC,GACX,IAAMC,EAAeC,eAAeC,EAAMd,KAC1C,CAACA,IAECe,EAAYC,EACd,IAAIC,MAAMP,EAAOQ,QAAQC,KAAK,QAG3BC,EAAmBC,GAAwBC,EAC9CZ,EAAOa,WAAWC,GAAUA,EAAMC,OAAOrB,EAAkB,YAE/DsB,GAAU,WAEoB,OAAtBN,IAEgC,QAApCO,EAAAZ,EAAUa,QAAQR,UAAkB,IAAAO,GAAAA,EAAEE,QAAO,GAC9C,CAACT,EAAmBV,IAKvB,MAKMoB,EAAmB,CAACC,EAAcC,KAChCA,GAEJvB,EAAcsB,EAAM,EA2DlBE,EAA0BC,IAC5B,MAAMC,EACe,UAAjBlC,GACAE,GACA+B,EAAIE,QAAQjC,EAAiB,UAC7BE,EAEEgC,EACe,QAAjBpC,GACAC,GACAgC,EAAII,SAASpC,EAAmB,UAChCG,EAEJ,SAAU8B,IAAmBE,EAAiB,EAG5CE,EAAuBC,IACzB,MAAMhB,EAAQgB,EAAKC,OAAO,QACpBC,GA7BUR,EA6BYM,GA5BN5B,EAAe+B,cACjCT,EACA5B,EAAUQ,EAAMR,QAAWsC,EAC3BrC,EAAUO,EAAMP,QAAWqC,EAC3B,UALW,IAACV,EA8BhB,MAAMW,EAAkBzC,EAAiBqB,OAAOe,EAAM,SAEhDM,EAAwBD,EACxB,iBACA/B,IAAQW,OAAOe,EAAM,SACrB,gBACA,UAGAO,EAAW3C,EAAiBqB,OAAOe,EAAM,QACzCK,EACI,GACA,EACa,IAAjBL,EAAKhB,QACL,GACA,EAEN,MAAO,CACHwB,gBAAiBN,GAAYT,EAAuBO,GACpDS,aAAcP,GAAYlC,EAC1BgB,QACAsB,UACAC,WACH,EAML,OAAKrC,EAAOQ,OAGRgC,EAACC,EAAO,CAACC,OAtHQ,KAEjB/B,EAAqB,KAAK,EAoHGgC,SACxB3C,EAAO4C,KAAI,CAACd,EAAMe,KACf,MAAMP,gBACFA,EAAeC,YACfA,EAAWH,QACXA,EAAOtB,MACPA,EAAKuB,SACLA,GACAR,EAAoBC,GAExB,OACIU,EAACM,EAAS,CACNC,IAAMC,GAAQ3C,EAAUa,QAAQ2B,GAASG,EACzCX,SAAUA,EACVY,KAAK,SAAQ,iBACGV,EAAW,gBACA,mBAAZH,EAA4Bc,SAEjCd,EAAOe,iBACCb,EAAec,aACnBb,EACdc,QAAS,IAAMjC,EAAiBU,GAAOS,GACvCe,UAAYC,IAjIV,EAClBA,EACAlC,EACAC,KAEA,MACMkC,EADgBD,EACYE,IAElC,IAAIC,EACJ,MAAMC,EAAe3D,EAAO4D,QAAQvC,GACpC,OAAQmC,GACJ,IAAK,QACL,IAAK,IACDD,EAAMM,iBACNzC,EAAiBC,EAAOC,GACxB,MACJ,IAAK,YACDoC,EAAoBC,EAAe,EACnC,MACJ,IAAK,aACDD,EAAoBC,EAAe,EACnC,MACJ,IAAK,UACDD,EAAoBC,EAAe,EACnC,MACJ,IAAK,YACDD,EAAoBC,EAAe,OAOjBzB,IAAtBwB,GACAA,GAAqB,GACrBA,EAAoB1D,EAAOQ,SAE3B+C,EAAMM,iBACNlD,EAAqB+C,GACzB,EA2FoBI,CAAcP,EAAOzB,GAAOS,EAAY,WAG3CzB,GATIA,EAUG,MA9BD,IAiCb"}
+{"version":3,"file":"internal-calendar-month.js","sources":["../../../src/shared/internal-calendar/internal-calendar-month.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport type { Dayjs } from \"dayjs\";\nimport dayjs from \"dayjs\";\nimport { useEffect, useMemo, useRef, useState } from \"react\";\n\nimport { CalendarHelper } from \"../../util/calendar-helper\";\nimport * as styles from \"./internal-calendar-month.styles\";\nimport type { FocusType, InternalCalendarProps } from \"./types\";\n\nexport type MonthVariant = \"default\" | \"current-month\" | \"selected-month\";\n\ninterface Props\n    extends Pick<\n        InternalCalendarProps,\n        \"minDate\" | \"maxDate\" | \"allowDisabledSelection\"\n    > {\n    calendarDate: Dayjs;\n    currentFocus?: FocusType | undefined;\n    selectedStartDate: string | undefined;\n    selectedEndDate?: string | undefined;\n    viewCalendarDate: Dayjs;\n    isNewSelection: boolean;\n    onMonthSelect: (value: Dayjs) => void;\n}\n\nexport const InternalCalendarMonth = ({\n    calendarDate,\n    currentFocus,\n    selectedStartDate,\n    selectedEndDate,\n    viewCalendarDate,\n    isNewSelection,\n    minDate,\n    maxDate,\n    allowDisabledSelection,\n    onMonthSelect,\n}: Props) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const months = useMemo<Dayjs[]>(\n        () => CalendarHelper.generateMonths(dayjs(calendarDate)),\n        [calendarDate]\n    );\n    const monthRefs = useRef<Array<HTMLDivElement | null>>(\n        new Array(months.length).fill(null)\n    );\n\n    const [focusedMonthIndex, setFocusedMonthIndex] = useState<number | null>(\n        months.findIndex((month) => month.isSame(viewCalendarDate, \"month\"))\n    );\n    useEffect(() => {\n        // Focus the month cell that corresponds to the focused month\n        if (focusedMonthIndex === null) return;\n\n        monthRefs.current[focusedMonthIndex]?.focus();\n    }, [focusedMonthIndex, months]);\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleOnBlur = () => {\n        // Reset focused year when the component loses focus\n        setFocusedMonthIndex(null);\n    };\n\n    const handleMonthClick = (value: Dayjs, isDisabled: boolean) => {\n        if (isDisabled) return;\n\n        onMonthSelect(value);\n    };\n\n    const handleKeyDown = (\n        event: React.KeyboardEvent<HTMLDivElement>,\n        value: Dayjs,\n        isDisabled: boolean\n    ) => {\n        const keyboardEvent = event as React.KeyboardEvent<HTMLInputElement>;\n        const selectedKey = keyboardEvent.key;\n\n        let newMonthSelection: number | undefined;\n        const currentIndex = months.indexOf(value);\n        switch (selectedKey) {\n            case \"Enter\":\n            case \" \":\n                event.preventDefault();\n                handleMonthClick(value, isDisabled);\n                break;\n            case \"ArrowLeft\":\n                newMonthSelection = currentIndex - 1;\n                break;\n            case \"ArrowRight\":\n                newMonthSelection = currentIndex + 1;\n                break;\n            case \"ArrowUp\":\n                newMonthSelection = currentIndex - 2;\n                break;\n            case \"ArrowDown\":\n                newMonthSelection = currentIndex + 2;\n                break;\n            default:\n                break;\n        }\n\n        if (\n            newMonthSelection !== undefined &&\n            newMonthSelection >= 0 &&\n            newMonthSelection < months.length\n        ) {\n            event.preventDefault();\n            setFocusedMonthIndex(newMonthSelection);\n        }\n    };\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n    const isDisabled = (day: Dayjs): boolean => {\n        const isWithinRange = CalendarHelper.isWithinRange(\n            day,\n            minDate ? dayjs(minDate) : undefined,\n            maxDate ? dayjs(maxDate) : undefined,\n            \"month\"\n        );\n\n        return !isWithinRange;\n    };\n\n    const isOutsideSelectedRange = (day: Dayjs): boolean => {\n        const isStartAfterEnd =\n            currentFocus === \"start\" &&\n            selectedEndDate &&\n            day.isAfter(selectedEndDate, \"month\") &&\n            isNewSelection;\n\n        const isEndBeforeStart =\n            currentFocus === \"end\" &&\n            selectedStartDate &&\n            day.isBefore(selectedStartDate, \"month\") &&\n            isNewSelection;\n\n        return !!(isStartAfterEnd || isEndBeforeStart);\n    };\n\n    const generateMonthStatus = (date: Dayjs) => {\n        const month = date.format(\"MMMM\");\n        const disabled = isDisabled(date);\n        const isSelectedMonth = viewCalendarDate.isSame(date, \"month\");\n\n        const variant: MonthVariant = isSelectedMonth\n            ? \"selected-month\"\n            : dayjs().isSame(date, \"month\")\n            ? \"current-month\"\n            : \"default\";\n\n        // Only selected month in tab order\n        const tabIndex = viewCalendarDate.isSame(date, \"year\")\n            ? isSelectedMonth\n                ? 0\n                : -1\n            : date.month() === 0\n            ? 0\n            : -1;\n\n        return {\n            disabledDisplay: disabled || isOutsideSelectedRange(date),\n            interactive: !disabled || allowDisabledSelection,\n            month,\n            variant,\n            tabIndex,\n        };\n    };\n\n    // =============================================================================\n    // RENDER FUNCTION\n    // =============================================================================\n    if (!months.length) return null;\n\n    return (\n        <div className={styles.wrapper} onBlur={handleOnBlur}>\n            {months.map((date, index) => {\n                const {\n                    disabledDisplay,\n                    interactive,\n                    variant,\n                    month,\n                    tabIndex,\n                } = generateMonthStatus(date);\n\n                return (\n                    <div\n                        ref={(el) => (monthRefs.current[index] = el)}\n                        tabIndex={tabIndex}\n                        role=\"button\"\n                        aria-disabled={!interactive}\n                        aria-selected={variant === \"selected-month\"}\n                        key={month}\n                        className={clsx(\n                            styles.monthCell,\n                            disabledDisplay && styles.monthCellDisabledDisplay,\n                            interactive && styles.monthCellInteractive,\n                            variant === \"current-month\" &&\n                                styles.monthCellCurrentMonth,\n                            variant === \"selected-month\" &&\n                                styles.monthCellSelectedMonth,\n                            interactive &&\n                                variant !== \"selected-month\" &&\n                                styles.monthCellDefaultHover,\n                            interactive &&\n                                variant === \"selected-month\" &&\n                                styles.monthCellSelectedHover\n                        )}\n                        onClick={() => handleMonthClick(date, !interactive)}\n                        onKeyDown={(event) => {\n                            handleKeyDown(event, date, !interactive);\n                        }}\n                    >\n                        {month}\n                    </div>\n                );\n            })}\n        </div>\n    );\n};\n"],"names":["InternalCalendarMonth","calendarDate","currentFocus","selectedStartDate","selectedEndDate","viewCalendarDate","isNewSelection","minDate","maxDate","allowDisabledSelection","onMonthSelect","months","useMemo","CalendarHelper","generateMonths","dayjs","monthRefs","useRef","Array","length","fill","focusedMonthIndex","setFocusedMonthIndex","useState","findIndex","month","isSame","useEffect","_a","current","focus","handleMonthClick","value","isDisabled","isOutsideSelectedRange","day","isStartAfterEnd","isAfter","isEndBeforeStart","isBefore","generateMonthStatus","date","format","disabled","isWithinRange","undefined","isSelectedMonth","variant","tabIndex","disabledDisplay","interactive","_jsx","className","styles.wrapper","onBlur","children","map","index","ref","el","role","clsx","styles.monthCell","styles.monthCellDisabledDisplay","styles.monthCellInteractive","styles.monthCellCurrentMonth","styles.monthCellSelectedMonth","styles.monthCellDefaultHover","styles.monthCellSelectedHover","onClick","onKeyDown","event","selectedKey","key","newMonthSelection","currentIndex","indexOf","preventDefault","handleKeyDown"],"mappings":"weAyBO,MAAMA,EAAwB,EACjCC,eACAC,eACAC,oBACAC,kBACAC,mBACAC,iBACAC,UACAC,UACAC,yBACAC,oBAKA,MAAMC,EAASC,GACX,IAAMC,EAAeC,eAAeC,EAAMd,KAC1C,CAACA,IAECe,EAAYC,EACd,IAAIC,MAAMP,EAAOQ,QAAQC,KAAK,QAG3BC,EAAmBC,GAAwBC,EAC9CZ,EAAOa,WAAWC,GAAUA,EAAMC,OAAOrB,EAAkB,YAE/DsB,GAAU,WAEoB,OAAtBN,IAEgC,QAApCO,EAAAZ,EAAUa,QAAQR,UAAkB,IAAAO,GAAAA,EAAEE,QAAO,GAC9C,CAACT,EAAmBV,IAKvB,MAKMoB,EAAmB,CAACC,EAAcC,KAChCA,GAEJvB,EAAcsB,EAAM,EA2DlBE,EAA0BC,IAC5B,MAAMC,EACe,UAAjBlC,GACAE,GACA+B,EAAIE,QAAQjC,EAAiB,UAC7BE,EAEEgC,EACe,QAAjBpC,GACAC,GACAgC,EAAII,SAASpC,EAAmB,UAChCG,EAEJ,SAAU8B,IAAmBE,EAAiB,EAG5CE,EAAuBC,IACzB,MAAMhB,EAAQgB,EAAKC,OAAO,QACpBC,GA7BUR,EA6BYM,GA5BN5B,EAAe+B,cACjCT,EACA5B,EAAUQ,EAAMR,QAAWsC,EAC3BrC,EAAUO,EAAMP,QAAWqC,EAC3B,UALW,IAACV,EA8BhB,MAAMW,EAAkBzC,EAAiBqB,OAAOe,EAAM,SAEhDM,EAAwBD,EACxB,iBACA/B,IAAQW,OAAOe,EAAM,SACrB,gBACA,UAGAO,EAAW3C,EAAiBqB,OAAOe,EAAM,QACzCK,EACI,GACA,EACa,IAAjBL,EAAKhB,QACL,GACA,EAEN,MAAO,CACHwB,gBAAiBN,GAAYT,EAAuBO,GACpDS,aAAcP,GAAYlC,EAC1BgB,QACAsB,UACAC,WACH,EAML,OAAKrC,EAAOQ,OAGRgC,SAAKC,UAAWC,EAAgBC,OAtHf,KAEjBhC,EAAqB,KAAK,EAoH0BiC,SAC/C5C,EAAO6C,KAAI,CAACf,EAAMgB,KACf,MAAMR,gBACFA,EAAeC,YACfA,EAAWH,QACXA,EAAOtB,MACPA,EAAKuB,SACLA,GACAR,EAAoBC,GAExB,OACIU,EAAA,MAAA,CACIO,IAAMC,GAAQ3C,EAAUa,QAAQ4B,GAASE,EACzCX,SAAUA,EACVY,KAAK,SAAQ,iBACGV,EAAW,gBACA,mBAAZH,EAEfK,UAAWS,EACPC,EACAb,GAAmBc,EACnBb,GAAec,EACH,kBAAZjB,GACIkB,EACQ,mBAAZlB,GACImB,EACJhB,GACgB,mBAAZH,GACAoB,EACJjB,GACgB,mBAAZH,GACAqB,GAERC,QAAS,IAAMtC,EAAiBU,GAAOS,GACvCoB,UAAYC,IA7IV,EAClBA,EACAvC,EACAC,KAEA,MACMuC,EADgBD,EACYE,IAElC,IAAIC,EACJ,MAAMC,EAAehE,EAAOiE,QAAQ5C,GACpC,OAAQwC,GACJ,IAAK,QACL,IAAK,IACDD,EAAMM,iBACN9C,EAAiBC,EAAOC,GACxB,MACJ,IAAK,YACDyC,EAAoBC,EAAe,EACnC,MACJ,IAAK,aACDD,EAAoBC,EAAe,EACnC,MACJ,IAAK,UACDD,EAAoBC,EAAe,EACnC,MACJ,IAAK,YACDD,EAAoBC,EAAe,OAOjB9B,IAAtB6B,GACAA,GAAqB,GACrBA,EAAoB/D,EAAOQ,SAE3BoD,EAAMM,iBACNvD,EAAqBoD,GACzB,EAuGoBI,CAAcP,EAAO9B,GAAOS,EAAY,WAG3CzB,GArBIA,EAsBH,MA1CK,IA6CjB"}

package/shared/internal-calendar/internal-calendar-month.styles.d.ts

@@ -0,0 +1,8 @@
+export declare const wrapper: import("@linaria/core").LinariaClassName;
+export declare const monthCell: import("@linaria/core").LinariaClassName;
+export declare const monthCellDisabledDisplay: import("@linaria/core").LinariaClassName;
+export declare const monthCellInteractive: import("@linaria/core").LinariaClassName;
+export declare const monthCellCurrentMonth: import("@linaria/core").LinariaClassName;
+export declare const monthCellSelectedMonth: import("@linaria/core").LinariaClassName;
+export declare const monthCellDefaultHover: import("@linaria/core").LinariaClassName;
+export declare const monthCellSelectedHover: import("@linaria/core").LinariaClassName;

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

@@ -0,0 +1,2 @@
+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.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"internal-calendar-month.styles.js","sources":["../../../src/shared/internal-calendar/internal-calendar-month.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    grid-template-columns: repeat(2, 1fr);\n    grid-template-rows: repeat(6, 2.5rem);\n    align-content: center;\n    justify-content: center;\n\n    gap: 0.5rem 0;\n`;\n\nexport const monthCell = css`\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: ${Radius[\"md\"]};\n    margin: 0 0.5rem;\n    transition: ${Motion[\"duration-150\"]} ${Motion[\"ease-default\"]};\n\n    ${Font[\"body-md-regular\"]}\n    border: ${Border[\"width-010\"]} ${Border[\"solid\"]} transparent;\n    background-clip: border-box;\n    color: ${Colour[\"text\"]};\n    cursor: default;\n`;\n\nexport const monthCellDisabledDisplay = css`\n    cursor: not-allowed;\n    color: ${Colour[\"text-disabled-subtlest\"]};\n`;\n\nexport const monthCellInteractive = css`\n    cursor: pointer;\n`;\n\nexport const monthCellCurrentMonth = css`\n    color: ${Colour[\"text-primary\"]};\n    font-weight: ${Font.Spec[\"weight-semibold\"]};\n`;\n\nexport const monthCellSelectedMonth = 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 monthCellDefaultHover = 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 monthCellSelectedHover = 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","monthCell","monthCellDisabledDisplay","monthCellInteractive","monthCellCurrentMonth","monthCellSelectedMonth","monthCellDefaultHover","monthCellSelectedHover"],"mappings":"6FAOO,MAAMA,EAAO,WAYPC,EAAS,UAeTC,EAAwB,WAKxBC,EAAoB,UAIpBC,EAAqB,WAKrBC,EAAsB,SAOtBC,EAAqB,UAQrBC,EAAsB"}

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

@@ -0,0 +1,8 @@
+@layer fds{.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.d.ts

@@ -1,5 +1,6 @@
-import dayjs, { Dayjs } from "dayjs";
-import { FocusType, InternalCalendarProps } from "./types";
+import type { Dayjs } from "dayjs";
+import dayjs from "dayjs";
+import type { FocusType, InternalCalendarProps } from "./types";
 export type YearVariant = "default" | "current-year" | "other-decade" | "selected-year";
 interface Props extends Pick<InternalCalendarProps, "minDate" | "maxDate" | "allowDisabledSelection"> {
     calendarDate: Dayjs;

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

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import a from"../../external/dayjs/dayjs.min.js";import{useMemo as r,useRef as t,useState as n,useEffect as i}from"react";import{CalendarHelper as l}from"../../util/calendar-helper.js";import{Wrapper as s,YearCell as c}from"./internal-calendar-year.style.js";const d=({calendarDate:d,currentFocus:o,selectedStartDate:y,selectedEndDate:u,viewCalendarDate:f,isNewSelection:m,minDate:b,maxDate:D,allowDisabledSelection:v,onYearSelect:p,setCalendarDate:w})=>{const h=r((()=>l.generateDecadeOfYears(a(d))),[d]),x=t(new Array(h.length).fill(null)),[S,g]=n(d);i((()=>{var e;if(null===S)return;const a=h.findIndex((e=>e.isSame(S,"year")));a>=0&&(null===(e=x.current[a])||void 0===e||e.focus())}),[S,h]);const j=(e,a)=>{a||p(e)},k=e=>{const a="start"===o&&u&&e.isAfter(u,"year")&&m,r="end"===o&&y&&e.isBefore(y,"year")&&m;return!(!a&&!r)},A=e=>{const r=h.indexOf(e),t=[0,11].includes(r),n=e.year(),i=(s=e,!l.isWithinRange(s,b?a(b):void 0,D?a(D):void 0,"year"));var s;const c=t?"other-decade":f.isSame(e,"year")?"selected-year":a().isSame(e,"year")?"current-year":"default",d=f.year()>=h[0].year()&&f.year()<=h[h.length-1].year()?"selected-year"===c?0:-1:1===r?0:-1;return{disabledDisplay:i||k(e),interactive:!i||v,year:n,variant:c,tabIndex:d}};return h.length?e(s,{onBlur:()=>{g(null)},children:h.map(((a,r)=>{const{disabledDisplay:t,interactive:n,variant:i,year:l,tabIndex:s}=A(a);return e(c,{ref:e=>{x.current[r]=e},tabIndex:s,role:"button","aria-label":`${l}`,"aria-disabled":!n,"aria-selected":"selected-year"===i,$variant:i,$disabledDisplay:t,$interactive:!!n,onClick:()=>j(a,!n),onKeyDown:e=>{((e,a,r)=>{let t;switch(e.key){case"Enter":case" ":e.preventDefault(),j(a,r);break;case"ArrowLeft":t=a.subtract(1,"year");break;case"ArrowRight":t=a.add(1,"year");break;case"ArrowUp":t=a.subtract(3,"year");break;case"ArrowDown":t=a.add(3,"year")}void 0!==t&&(e.preventDefault(),w(t),g(t))})(e,a,!n)},children:l},l)}))}):null};export{d as InternalCalendarYear};
+import{jsx as e}from"react/jsx-runtime";import r from"clsx";import a from"../../external/dayjs/dayjs.min.js";import{useMemo as t,useRef as n,useState as l,useEffect as s}from"react";import{CalendarHelper as i}from"../../util/calendar-helper.js";import{wrapper as c,yearCell as d,yearCellDisabledDisplay as o,yearCellInteractive as y,yearCellOtherDecade as u,yearCellCurrentYear as m,yearCellSelectedYear as f,yearCellDefaultHover as b,yearCellSelectedHover as v}from"./internal-calendar-year.styles.js";const D=({calendarDate:D,currentFocus:p,selectedStartDate:h,selectedEndDate:w,viewCalendarDate:x,isNewSelection:S,minDate:g,maxDate:j,allowDisabledSelection:k,onYearSelect:A,setCalendarDate:I})=>{const C=t((()=>i.generateDecadeOfYears(a(D))),[D]),N=n(new Array(C.length).fill(null)),[B,E]=l(D);s((()=>{var e;if(null===B)return;const r=C.findIndex((e=>e.isSame(B,"year")));r>=0&&(null===(e=N.current[r])||void 0===e||e.focus())}),[B,C]);const O=(e,r)=>{r||A(e)},R=e=>{const r="start"===p&&w&&e.isAfter(w,"year")&&S,a="end"===p&&h&&e.isBefore(h,"year")&&S;return!(!r&&!a)},Y=e=>{const r=C.indexOf(e),t=[0,11].includes(r),n=e.year(),l=(s=e,!i.isWithinRange(s,g?a(g):void 0,j?a(j):void 0,"year"));var s;const c=t?"other-decade":x.isSame(e,"year")?"selected-year":a().isSame(e,"year")?"current-year":"default",d=x.year()>=C[0].year()&&x.year()<=C[C.length-1].year()?"selected-year"===c?0:-1:1===r?0:-1;return{disabledDisplay:l||R(e),interactive:!l||k,year:n,variant:c,tabIndex:d}};return C.length?e("div",{className:c,onBlur:()=>{E(null)},children:C.map(((a,t)=>{const{disabledDisplay:n,interactive:l,variant:s,year:i,tabIndex:c}=Y(a);return e("div",{ref:e=>{N.current[t]=e},tabIndex:c,role:"button","aria-label":`${i}`,"aria-disabled":!l,"aria-selected":"selected-year"===s,className:r(d,n&&o,l&&y,"other-decade"===s&&u,"current-year"===s&&m,"selected-year"===s&&f,l&&"selected-year"!==s&&b,l&&"selected-year"===s&&v),onClick:()=>O(a,!l),onKeyDown:e=>{((e,r,a)=>{let t;switch(e.key){case"Enter":case" ":e.preventDefault(),O(r,a);break;case"ArrowLeft":t=r.subtract(1,"year");break;case"ArrowRight":t=r.add(1,"year");break;case"ArrowUp":t=r.subtract(3,"year");break;case"ArrowDown":t=r.add(3,"year")}void 0!==t&&(e.preventDefault(),I(t),E(t))})(e,a,!l)},children:i},i)}))}):null};export{D as InternalCalendarYear};
 //# sourceMappingURL=internal-calendar-year.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"internal-calendar-year.js","sources":["../../../src/shared/internal-calendar/internal-calendar-year.tsx"],"sourcesContent":["import dayjs, { Dayjs } from \"dayjs\";\nimport { useEffect, useMemo, useRef, useState } from \"react\";\nimport { CalendarHelper } from \"../../util/calendar-helper\";\nimport { Wrapper, YearCell } from \"./internal-calendar-year.style\";\nimport { FocusType, InternalCalendarProps } from \"./types\";\n\nexport type YearVariant =\n    | \"default\"\n    | \"current-year\"\n    | \"other-decade\"\n    | \"selected-year\";\n\ninterface Props\n    extends Pick<\n        InternalCalendarProps,\n        \"minDate\" | \"maxDate\" | \"allowDisabledSelection\"\n    > {\n    calendarDate: Dayjs;\n    currentFocus?: FocusType | undefined;\n    selectedStartDate: string | undefined;\n    selectedEndDate?: string | undefined;\n    viewCalendarDate: Dayjs;\n    isNewSelection: boolean;\n    onYearSelect: (value: Dayjs) => void;\n    setCalendarDate: React.Dispatch<React.SetStateAction<dayjs.Dayjs>>;\n}\n\nexport const InternalCalendarYear = ({\n    calendarDate,\n    currentFocus,\n    selectedStartDate,\n    selectedEndDate,\n    viewCalendarDate,\n    isNewSelection,\n    minDate,\n    maxDate,\n    allowDisabledSelection,\n    onYearSelect,\n    setCalendarDate,\n}: Props) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const years = useMemo<Dayjs[]>(\n        () => CalendarHelper.generateDecadeOfYears(dayjs(calendarDate)),\n        [calendarDate]\n    );\n    const yearRefs = useRef<Array<HTMLDivElement | null>>(\n        new Array(years.length).fill(null)\n    );\n    const [focusedYear, setFocusedYear] = useState<Dayjs | null>(calendarDate);\n\n    useEffect(() => {\n        if (focusedYear === null) return;\n        // Focus the year cell that corresponds to the focused year\n        const focusedYearIndex = years.findIndex((year) =>\n            year.isSame(focusedYear, \"year\")\n        );\n        if (focusedYearIndex >= 0) {\n            yearRefs.current[focusedYearIndex]?.focus();\n        }\n    }, [focusedYear, years]);\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleOnBlur = () => {\n        // Reset focused year when the component loses focus\n        setFocusedYear(null);\n    };\n\n    const handleYearClick = (value: Dayjs, isDisabled: boolean) => {\n        if (isDisabled) return;\n\n        onYearSelect(value);\n    };\n\n    const handleKeyDownPress = (\n        event: React.KeyboardEvent<HTMLDivElement>,\n        value: Dayjs,\n        isDisabled: boolean\n    ) => {\n        const keyboardEvent = event as React.KeyboardEvent<HTMLInputElement>;\n        const selectedKey = keyboardEvent.key;\n\n        let newYearSelection: Dayjs | undefined;\n        switch (selectedKey) {\n            case \"Enter\":\n            case \" \":\n                event.preventDefault();\n                handleYearClick(value, isDisabled);\n                break;\n            case \"ArrowLeft\":\n                newYearSelection = value.subtract(1, \"year\");\n                break;\n            case \"ArrowRight\":\n                newYearSelection = value.add(1, \"year\");\n                break;\n            case \"ArrowUp\":\n                newYearSelection = value.subtract(3, \"year\");\n                break;\n            case \"ArrowDown\":\n                newYearSelection = value.add(3, \"year\");\n                break;\n            default:\n                break;\n        }\n\n        if (newYearSelection === undefined) return;\n\n        event.preventDefault();\n\n        setCalendarDate(newYearSelection);\n        setFocusedYear(newYearSelection);\n    };\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n    const isDisabled = (day: Dayjs): boolean => {\n        const isWithinRange = CalendarHelper.isWithinRange(\n            day,\n            minDate ? dayjs(minDate) : undefined,\n            maxDate ? dayjs(maxDate) : undefined,\n            \"year\"\n        );\n\n        return !isWithinRange;\n    };\n\n    const isOutsideSelectedRange = (day: Dayjs): boolean => {\n        const isStartAfterEnd =\n            currentFocus === \"start\" &&\n            selectedEndDate &&\n            day.isAfter(selectedEndDate, \"year\") &&\n            isNewSelection;\n\n        const isEndBeforeStart =\n            currentFocus === \"end\" &&\n            selectedStartDate &&\n            day.isBefore(selectedStartDate, \"year\") &&\n            isNewSelection;\n\n        return !!(isStartAfterEnd || isEndBeforeStart);\n    };\n\n    const generateYearStatus = (date: Dayjs) => {\n        const otherDecadeIndexes = [0, 11];\n        const yearIndex = years.indexOf(date);\n\n        const isOtherDecade = otherDecadeIndexes.includes(yearIndex);\n        const year = date.year();\n        const disabled = isDisabled(date);\n\n        const variant: YearVariant = isOtherDecade\n            ? \"other-decade\"\n            : viewCalendarDate.isSame(date, \"year\")\n            ? \"selected-year\"\n            : dayjs().isSame(date, \"year\")\n            ? \"current-year\"\n            : \"default\";\n\n        const isSelectedYearInDecade =\n            viewCalendarDate.year() >= years[0].year() &&\n            viewCalendarDate.year() <= years[years.length - 1].year();\n\n        const tabIndex = isSelectedYearInDecade\n            ? variant === \"selected-year\"\n                ? 0\n                : -1\n            : yearIndex === 1\n            ? 0\n            : -1;\n\n        return {\n            disabledDisplay: disabled || isOutsideSelectedRange(date),\n            interactive: !disabled || allowDisabledSelection,\n            year,\n            variant,\n            tabIndex,\n        };\n    };\n\n    // =============================================================================\n    // RENDER FUNCTION\n    // =============================================================================\n    if (!years.length) return null;\n\n    return (\n        <Wrapper onBlur={handleOnBlur}>\n            {years.map((date, index) => {\n                const {\n                    disabledDisplay,\n                    interactive,\n                    variant,\n                    year,\n                    tabIndex,\n                } = generateYearStatus(date);\n\n                return (\n                    <YearCell\n                        ref={(el) => {\n                            yearRefs.current[index] = el;\n                        }}\n                        tabIndex={tabIndex}\n                        role=\"button\"\n                        aria-label={`${year}`}\n                        aria-disabled={!interactive}\n                        aria-selected={variant === \"selected-year\"}\n                        key={year}\n                        $variant={variant}\n                        $disabledDisplay={disabledDisplay}\n                        $interactive={!!interactive}\n                        onClick={() => handleYearClick(date, !interactive)}\n                        onKeyDown={(event) => {\n                            handleKeyDownPress(event, date, !interactive);\n                        }}\n                    >\n                        {year}\n                    </YearCell>\n                );\n            })}\n        </Wrapper>\n    );\n};\n"],"names":["InternalCalendarYear","calendarDate","currentFocus","selectedStartDate","selectedEndDate","viewCalendarDate","isNewSelection","minDate","maxDate","allowDisabledSelection","onYearSelect","setCalendarDate","years","useMemo","CalendarHelper","generateDecadeOfYears","dayjs","yearRefs","useRef","Array","length","fill","focusedYear","setFocusedYear","useState","useEffect","focusedYearIndex","findIndex","year","isSame","_a","current","focus","handleYearClick","value","isDisabled","isOutsideSelectedRange","day","isStartAfterEnd","isAfter","isEndBeforeStart","isBefore","generateYearStatus","date","yearIndex","indexOf","isOtherDecade","includes","disabled","isWithinRange","undefined","variant","tabIndex","disabledDisplay","interactive","_jsx","Wrapper","onBlur","children","map","index","YearCell","ref","el","role","$variant","$disabledDisplay","onClick","onKeyDown","event","newYearSelection","key","preventDefault","subtract","add","handleKeyDownPress"],"mappings":"2SA2BO,MAAMA,EAAuB,EAChCC,eACAC,eACAC,oBACAC,kBACAC,mBACAC,iBACAC,UACAC,UACAC,yBACAC,eACAC,sBAKA,MAAMC,EAAQC,GACV,IAAMC,EAAeC,sBAAsBC,EAAMf,KACjD,CAACA,IAECgB,EAAWC,EACb,IAAIC,MAAMP,EAAMQ,QAAQC,KAAK,QAE1BC,EAAaC,GAAkBC,EAAuBvB,GAE7DwB,GAAU,WACN,GAAoB,OAAhBH,EAAsB,OAE1B,MAAMI,EAAmBd,EAAMe,WAAWC,GACtCA,EAAKC,OAAOP,EAAa,UAEzBI,GAAoB,IACc,QAAlCI,EAAAb,EAASc,QAAQL,UAAiB,IAAAI,GAAAA,EAAEE,QACxC,GACD,CAACV,EAAaV,IAKjB,MAKMqB,EAAkB,CAACC,EAAcC,KAC/BA,GAEJzB,EAAawB,EAAM,EAwDjBE,EAA0BC,IAC5B,MAAMC,EACe,UAAjBpC,GACAE,GACAiC,EAAIE,QAAQnC,EAAiB,SAC7BE,EAEEkC,EACe,QAAjBtC,GACAC,GACAkC,EAAII,SAAStC,EAAmB,SAChCG,EAEJ,SAAUgC,IAAmBE,EAAiB,EAG5CE,EAAsBC,IACxB,MACMC,EAAYhC,EAAMiC,QAAQF,GAE1BG,EAHqB,CAAC,EAAG,IAGUC,SAASH,GAC5ChB,EAAOe,EAAKf,OACZoB,GAjCUX,EAiCYM,GAhCN7B,EAAemC,cACjCZ,EACA9B,EAAUS,EAAMT,QAAW2C,EAC3B1C,EAAUQ,EAAMR,QAAW0C,EAC3B,SALW,IAACb,EAmChB,MAAMc,EAAuBL,EACvB,eACAzC,EAAiBwB,OAAOc,EAAM,QAC9B,gBACA3B,IAAQa,OAAOc,EAAM,QACrB,eACA,UAMAS,EAHF/C,EAAiBuB,QAAUhB,EAAM,GAAGgB,QACpCvB,EAAiBuB,QAAUhB,EAAMA,EAAMQ,OAAS,GAAGQ,OAGrC,kBAAZuB,EACI,GACA,EACU,IAAdP,EACA,GACA,EAEN,MAAO,CACHS,gBAAiBL,GAAYZ,EAAuBO,GACpDW,aAAcN,GAAYvC,EAC1BmB,OACAuB,UACAC,WACH,EAML,OAAKxC,EAAMQ,OAGPmC,EAACC,EAAO,CAACC,OA3HQ,KAEjBlC,EAAe,KAAK,EAyHSmC,SACxB9C,EAAM+C,KAAI,CAAChB,EAAMiB,KACd,MAAMP,gBACFA,EAAeC,YACfA,EAAWH,QACXA,EAAOvB,KACPA,EAAIwB,SACJA,GACAV,EAAmBC,GAEvB,OACIY,EAACM,EAAQ,CACLC,IAAMC,IACF9C,EAASc,QAAQ6B,GAASG,CAAE,EAEhCX,SAAUA,EACVY,KAAK,SAAQ,aACD,GAAGpC,IAAM,iBACL0B,EAAW,gBACA,kBAAZH,EAA2Bc,SAEhCd,EAAOe,iBACCb,iBACFC,EAChBa,QAAS,IAAMlC,EAAgBU,GAAOW,GACtCc,UAAYC,IAzIL,EACvBA,EACAnC,EACAC,KAKA,IAAImC,EACJ,OAJsBD,EACYE,KAI9B,IAAK,QACL,IAAK,IACDF,EAAMG,iBACNvC,EAAgBC,EAAOC,GACvB,MACJ,IAAK,YACDmC,EAAmBpC,EAAMuC,SAAS,EAAG,QACrC,MACJ,IAAK,aACDH,EAAmBpC,EAAMwC,IAAI,EAAG,QAChC,MACJ,IAAK,UACDJ,EAAmBpC,EAAMuC,SAAS,EAAG,QACrC,MACJ,IAAK,YACDH,EAAmBpC,EAAMwC,IAAI,EAAG,aAMfxB,IAArBoB,IAEJD,EAAMG,iBAEN7D,EAAgB2D,GAChB/C,EAAe+C,GAAiB,EAsGZK,CAAmBN,EAAO1B,GAAOW,EAAY,WAGhD1B,GATIA,EAUE,MAjCD,IAoCZ"}
+{"version":3,"file":"internal-calendar-year.js","sources":["../../../src/shared/internal-calendar/internal-calendar-year.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport type { Dayjs } from \"dayjs\";\nimport dayjs from \"dayjs\";\nimport { useEffect, useMemo, useRef, useState } from \"react\";\n\nimport { CalendarHelper } from \"../../util/calendar-helper\";\nimport * as styles from \"./internal-calendar-year.styles\";\nimport type { FocusType, InternalCalendarProps } from \"./types\";\n\nexport type YearVariant =\n    | \"default\"\n    | \"current-year\"\n    | \"other-decade\"\n    | \"selected-year\";\n\ninterface Props\n    extends Pick<\n        InternalCalendarProps,\n        \"minDate\" | \"maxDate\" | \"allowDisabledSelection\"\n    > {\n    calendarDate: Dayjs;\n    currentFocus?: FocusType | undefined;\n    selectedStartDate: string | undefined;\n    selectedEndDate?: string | undefined;\n    viewCalendarDate: Dayjs;\n    isNewSelection: boolean;\n    onYearSelect: (value: Dayjs) => void;\n    setCalendarDate: React.Dispatch<React.SetStateAction<dayjs.Dayjs>>;\n}\n\nexport const InternalCalendarYear = ({\n    calendarDate,\n    currentFocus,\n    selectedStartDate,\n    selectedEndDate,\n    viewCalendarDate,\n    isNewSelection,\n    minDate,\n    maxDate,\n    allowDisabledSelection,\n    onYearSelect,\n    setCalendarDate,\n}: Props) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const years = useMemo<Dayjs[]>(\n        () => CalendarHelper.generateDecadeOfYears(dayjs(calendarDate)),\n        [calendarDate]\n    );\n    const yearRefs = useRef<Array<HTMLDivElement | null>>(\n        new Array(years.length).fill(null)\n    );\n    const [focusedYear, setFocusedYear] = useState<Dayjs | null>(calendarDate);\n\n    useEffect(() => {\n        if (focusedYear === null) return;\n        // Focus the year cell that corresponds to the focused year\n        const focusedYearIndex = years.findIndex((year) =>\n            year.isSame(focusedYear, \"year\")\n        );\n        if (focusedYearIndex >= 0) {\n            yearRefs.current[focusedYearIndex]?.focus();\n        }\n    }, [focusedYear, years]);\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleOnBlur = () => {\n        // Reset focused year when the component loses focus\n        setFocusedYear(null);\n    };\n\n    const handleYearClick = (value: Dayjs, isDisabled: boolean) => {\n        if (isDisabled) return;\n\n        onYearSelect(value);\n    };\n\n    const handleKeyDownPress = (\n        event: React.KeyboardEvent<HTMLDivElement>,\n        value: Dayjs,\n        isDisabled: boolean\n    ) => {\n        const keyboardEvent = event as React.KeyboardEvent<HTMLInputElement>;\n        const selectedKey = keyboardEvent.key;\n\n        let newYearSelection: Dayjs | undefined;\n        switch (selectedKey) {\n            case \"Enter\":\n            case \" \":\n                event.preventDefault();\n                handleYearClick(value, isDisabled);\n                break;\n            case \"ArrowLeft\":\n                newYearSelection = value.subtract(1, \"year\");\n                break;\n            case \"ArrowRight\":\n                newYearSelection = value.add(1, \"year\");\n                break;\n            case \"ArrowUp\":\n                newYearSelection = value.subtract(3, \"year\");\n                break;\n            case \"ArrowDown\":\n                newYearSelection = value.add(3, \"year\");\n                break;\n            default:\n                break;\n        }\n\n        if (newYearSelection === undefined) return;\n\n        event.preventDefault();\n\n        setCalendarDate(newYearSelection);\n        setFocusedYear(newYearSelection);\n    };\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n    const isDisabled = (day: Dayjs): boolean => {\n        const isWithinRange = CalendarHelper.isWithinRange(\n            day,\n            minDate ? dayjs(minDate) : undefined,\n            maxDate ? dayjs(maxDate) : undefined,\n            \"year\"\n        );\n\n        return !isWithinRange;\n    };\n\n    const isOutsideSelectedRange = (day: Dayjs): boolean => {\n        const isStartAfterEnd =\n            currentFocus === \"start\" &&\n            selectedEndDate &&\n            day.isAfter(selectedEndDate, \"year\") &&\n            isNewSelection;\n\n        const isEndBeforeStart =\n            currentFocus === \"end\" &&\n            selectedStartDate &&\n            day.isBefore(selectedStartDate, \"year\") &&\n            isNewSelection;\n\n        return !!(isStartAfterEnd || isEndBeforeStart);\n    };\n\n    const generateYearStatus = (date: Dayjs) => {\n        const otherDecadeIndexes = [0, 11];\n        const yearIndex = years.indexOf(date);\n\n        const isOtherDecade = otherDecadeIndexes.includes(yearIndex);\n        const year = date.year();\n        const disabled = isDisabled(date);\n\n        const variant: YearVariant = isOtherDecade\n            ? \"other-decade\"\n            : viewCalendarDate.isSame(date, \"year\")\n            ? \"selected-year\"\n            : dayjs().isSame(date, \"year\")\n            ? \"current-year\"\n            : \"default\";\n\n        const isSelectedYearInDecade =\n            viewCalendarDate.year() >= years[0].year() &&\n            viewCalendarDate.year() <= years[years.length - 1].year();\n\n        const tabIndex = isSelectedYearInDecade\n            ? variant === \"selected-year\"\n                ? 0\n                : -1\n            : yearIndex === 1\n            ? 0\n            : -1;\n\n        return {\n            disabledDisplay: disabled || isOutsideSelectedRange(date),\n            interactive: !disabled || allowDisabledSelection,\n            year,\n            variant,\n            tabIndex,\n        };\n    };\n\n    // =============================================================================\n    // RENDER FUNCTION\n    // =============================================================================\n    if (!years.length) return null;\n\n    return (\n        <div className={styles.wrapper} onBlur={handleOnBlur}>\n            {years.map((date, index) => {\n                const {\n                    disabledDisplay,\n                    interactive,\n                    variant,\n                    year,\n                    tabIndex,\n                } = generateYearStatus(date);\n\n                return (\n                    <div\n                        ref={(el) => {\n                            yearRefs.current[index] = el;\n                        }}\n                        tabIndex={tabIndex}\n                        role=\"button\"\n                        aria-label={`${year}`}\n                        aria-disabled={!interactive}\n                        aria-selected={variant === \"selected-year\"}\n                        key={year}\n                        className={clsx(\n                            styles.yearCell,\n                            disabledDisplay && styles.yearCellDisabledDisplay,\n                            interactive && styles.yearCellInteractive,\n                            variant === \"other-decade\" &&\n                                styles.yearCellOtherDecade,\n                            variant === \"current-year\" &&\n                                styles.yearCellCurrentYear,\n                            variant === \"selected-year\" &&\n                                styles.yearCellSelectedYear,\n                            interactive &&\n                                variant !== \"selected-year\" &&\n                                styles.yearCellDefaultHover,\n                            interactive &&\n                                variant === \"selected-year\" &&\n                                styles.yearCellSelectedHover\n                        )}\n                        onClick={() => handleYearClick(date, !interactive)}\n                        onKeyDown={(event) => {\n                            handleKeyDownPress(event, date, !interactive);\n                        }}\n                    >\n                        {year}\n                    </div>\n                );\n            })}\n        </div>\n    );\n};\n"],"names":["InternalCalendarYear","calendarDate","currentFocus","selectedStartDate","selectedEndDate","viewCalendarDate","isNewSelection","minDate","maxDate","allowDisabledSelection","onYearSelect","setCalendarDate","years","useMemo","CalendarHelper","generateDecadeOfYears","dayjs","yearRefs","useRef","Array","length","fill","focusedYear","setFocusedYear","useState","useEffect","focusedYearIndex","findIndex","year","isSame","_a","current","focus","handleYearClick","value","isDisabled","isOutsideSelectedRange","day","isStartAfterEnd","isAfter","isEndBeforeStart","isBefore","generateYearStatus","date","yearIndex","indexOf","isOtherDecade","includes","disabled","isWithinRange","undefined","variant","tabIndex","disabledDisplay","interactive","_jsx","className","styles.wrapper","onBlur","children","map","index","ref","el","role","clsx","styles.yearCell","styles.yearCellDisabledDisplay","styles.yearCellInteractive","styles.yearCellOtherDecade","styles.yearCellCurrentYear","styles.yearCellSelectedYear","styles.yearCellDefaultHover","styles.yearCellSelectedHover","onClick","onKeyDown","event","newYearSelection","key","preventDefault","subtract","add","handleKeyDownPress"],"mappings":"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"}

package/shared/internal-calendar/internal-calendar-year.styles.d.ts

@@ -0,0 +1,9 @@
+export declare const wrapper: import("@linaria/core").LinariaClassName;
+export declare const yearCell: import("@linaria/core").LinariaClassName;
+export declare const yearCellDisabledDisplay: import("@linaria/core").LinariaClassName;
+export declare const yearCellInteractive: import("@linaria/core").LinariaClassName;
+export declare const yearCellOtherDecade: import("@linaria/core").LinariaClassName;
+export declare const yearCellCurrentYear: import("@linaria/core").LinariaClassName;
+export declare const yearCellSelectedYear: import("@linaria/core").LinariaClassName;
+export declare const yearCellDefaultHover: import("@linaria/core").LinariaClassName;
+export declare const yearCellSelectedHover: import("@linaria/core").LinariaClassName;

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

@@ -0,0 +1,2 @@
+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

@@ -0,0 +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":"2FAOO,MAAMA,EAAO,UASPC,EAAQ,UAgBRC,EAAuB,WAKvBC,EAAmB,UAInBC,EAAmB,UAInBC,EAAmB,WAKnBC,EAAoB,UAOpBC,EAAoB,UAQpBC,EAAqB"}