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

package/time-slot-bar/time-slot-bar.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"time-slot-bar.styles.js","sources":["../../src/time-slot-bar/time-slot-bar.styles.tsx"],"sourcesContent":["import { ChevronLeftIcon } from \"@lifesg/react-icons/chevron-left\";\nimport { ChevronRightIcon } from \"@lifesg/react-icons/chevron-right\";\nimport styled, { css } from \"styled-components\";\n\nimport { ClickableIcon } from \"../shared/clickable-icon\";\nimport { Typography } from \"../typography\";\nimport { V3_Border, V3_Colour, V3_Shadow } from \"../v3_theme\";\nimport type { V3_ThemeStyleProps } from \"../v3_theme/types\";\nimport type { Direction, SlotStyle, TimeSlotBarVariant } from \"./types\";\n\nconst MAX_LINE_HEIGHT = 1.25; // NOTE in rem\n\n// =============================================================================\n// STYLING HELPERS\n// =============================================================================\n\n// Function to get the width of a cell in px\nexport const getCellWidth = (variant: TimeSlotBarVariant) => {\n    if (variant === \"minified\") {\n        return 12;\n    } else {\n        return 40;\n    }\n};\n\n// Function to get the height of a cell in px\nexport const getCellHeight = (variant: TimeSlotBarVariant) => {\n    if (variant === \"minified\") {\n        return 12;\n    } else {\n        return 40;\n    }\n};\n\n// =============================================================================\n// STYLE INTERFACE, transient props are denoted with $\n// See more https://styled-components.com/docs/api#transient-props\n// =============================================================================\n\ninterface ArrowStyleProps {\n    $direction?: Direction;\n    $variant: TimeSlotBarVariant;\n}\n\nexport interface TimeSlotStyleProps {\n    $type?: \"default\" | \"vertical\";\n    $variant: TimeSlotBarVariant;\n    $width?: number;\n    $left?: number;\n    $styleType: SlotStyle;\n    $bgColor: string | ((props: V3_ThemeStyleProps) => string);\n    $bgColor2?: string | ((props: V3_ThemeStyleProps) => string);\n    $clickable?: boolean;\n}\n\ninterface CellTextStyleProps {\n    $slotWidth: number;\n    $color?: string;\n}\n\ninterface TimeMarkerStyleProps {\n    $isLongMarker: boolean;\n    $variant: TimeSlotBarVariant;\n}\n\n// =============================================================================\n// STYLING\n// =============================================================================\nexport const Container = styled.div`\n    position: relative;\n    display: flex;\n    align-items: center;\n`;\n\nexport const ArrowButton = styled(ClickableIcon)<ArrowStyleProps>`\n    z-index: 2;\n    position: absolute;\n    bottom: ${({ $variant }) => ($variant === \"default\" ? \"0.25rem\" : \"0rem\")};\n    background-color: ${V3_Colour.bg};\n    box-shadow: ${V3_Shadow[\"md-strong\"]};\n    border-radius: 100%;\n    padding: 0.5rem;\n    width: 2rem;\n    height: 2rem;\n\n    ${(props) =>\n        props.$direction === \"right\"\n            ? css`\n                  right: 0;\n              `\n            : css`\n                  left: 0;\n              `}\n\n    > div {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n    &:focus {\n        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n    }\n`;\n\nexport const ArrowIconRight = styled(ChevronRightIcon)`\n    width: 1rem;\n    height: 1rem;\n    color: ${V3_Colour[\"icon-primary\"]};\n`;\n\nexport const ArrowIconLeft = styled(ChevronLeftIcon)`\n    font-size: 1rem;\n    color: ${V3_Colour[\"icon-primary\"]};\n`;\n\nexport const TimeSlotBarContainer = styled.div<{\n    $variant: TimeSlotBarVariant;\n}>`\n    overflow: hidden;\n    flex-grow: 1;\n    position: relative;\n    height: ${({ $variant }) =>\n        `${MAX_LINE_HEIGHT * 16 + getCellHeight($variant)}px`};\n`;\n\nexport const TimeMarkerWrapper = styled.div`\n    position: relative;\n    white-space: nowrap;\n    height: ${MAX_LINE_HEIGHT}rem;\n`;\n\nexport const TimeSlotWrapper = styled.div`\n    display: flex;\n    white-space: nowrap;\n`;\n\nexport const TimeMarker = styled.div<TimeMarkerStyleProps>`\n    display: inline-block;\n    width: ${({ $variant }) => `${getCellWidth($variant)}px`};\n    position: relative;\n    border-left: ${V3_Border[\"width-010\"]} ${V3_Border.solid}\n        ${V3_Colour[\"border-stronger\"]};\n    ${(props) => {\n        let markerHeight = 0;\n\n        switch (props.$variant) {\n            case \"default\":\n                markerHeight = props.$isLongMarker ? MAX_LINE_HEIGHT : 0.625;\n                break;\n            case \"minified\":\n                markerHeight = props.$isLongMarker ? MAX_LINE_HEIGHT : 0;\n                break;\n            default:\n                markerHeight = 0;\n                break;\n        }\n\n        return css`\n            height: ${markerHeight}rem;\n        `;\n    }}\n`;\n\nexport const TimeLabel = styled(Typography.BodyXS)`\n    color: ${V3_Colour[\"text-subtle\"]};\n    position: absolute;\n    bottom: 10%;\n    left: 10%;\n`;\n\nexport const TimeSlot = styled.div<TimeSlotStyleProps>`\n    ${(props) => {\n        if (props.$type === \"vertical\") {\n            return css`\n                display: flex;\n                flex-grow: 1;\n                align-items: center;\n                justify-content: center;\n                width: 100%;\n                margin: 1px 0px;\n            `;\n        } else {\n            return css`\n                position: absolute;\n                height: ${getCellHeight(props.$variant)}px;\n                width: ${props.$width}px;\n                left: ${props.$left}px;\n            `;\n        }\n    }}\n    background-color: ${({ $bgColor }) => $bgColor};\n    cursor: ${({ $clickable }) => ($clickable ? \"pointer\" : \"default\")};\n\n    ${(props) =>\n        props.$styleType === \"stripes\" &&\n        css`\n            background: repeating-linear-gradient(\n                135deg,\n                ${props.$bgColor2 || V3_Colour[\"bg-strongest\"]} 0px,\n                ${props.$bgColor2 || V3_Colour[\"bg-strongest\"]} 10px,\n                ${props.$bgColor || V3_Colour[\"bg-stronger\"]} 10px,\n                ${props.$bgColor || V3_Colour[\"bg-stronger\"]} 20px\n            );\n        `}\n`;\n\nexport const TimeSlotBorder = styled.div<{ $variant: TimeSlotBarVariant }>`\n    position: absolute;\n    top: ${MAX_LINE_HEIGHT}rem;\n    height: ${({ $variant }) => `${getCellHeight($variant)}px`};\n    z-index: 1;\n    border-right: ${V3_Border[\"width-010\"]} ${V3_Border.solid}\n        ${V3_Colour[\"border-stronger\"]};\n`;\n\nexport const CellText = styled(Typography.BodyXS)<CellTextStyleProps>`\n    color: ${(props) => props.$color || V3_Colour.text(props)};\n    position: absolute;\n    bottom: 0;\n    padding-left: 4px;\n    padding-bottom: 4px;\n    width: 100%;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n`;\n"],"names":["MAX_LINE_HEIGHT","getCellWidth","variant","getCellHeight","Container","styled","div","ArrowButton","ClickableIcon","$variant","V3_Colour","bg","V3_Shadow","props","$direction","css","ArrowIconRight","ChevronRightIcon","ArrowIconLeft","ChevronLeftIcon","TimeSlotBarContainer","TimeMarkerWrapper","TimeSlotWrapper","TimeMarker","V3_Border","solid","markerHeight","$isLongMarker","TimeLabel","Typography","BodyXS","TimeSlot","$type","$width","$left","$bgColor","$clickable","$styleType","$bgColor2","TimeSlotBorder","CellText","$color","text"],"mappings":"iYAUA,MAAMA,EAAkB,KAOXC,EAAgBC,GACT,aAAZA,EACO,GAEA,GAKFC,EAAiBD,GACV,aAAZA,EACO,GAEA,GAsCFE,EAAYC,EAAOC,GAAG;;;;EAMtBC,EAAcF,EAAOG,EAA+B;;;cAGnD,EAAGC,cAA6B,YAAbA,EAAyB,UAAY;wBAC9CC,EAAUC;kBAChBC,EAAU;;;;;;MAMrBC,GACsB,UAArBA,EAAMC,WACAC,CAAG;;gBAGHA,CAAG;;;;;;;;;;;;;EAeJC,EAAiBX,EAAOY,EAAiB;;;aAGzCP,EAAU;EAGVQ,EAAgBb,EAAOc,EAAgB;;aAEvCT,EAAU;EAGVU,EAAuBf,EAAOC,GAEzC;;;;cAIY,EAAGG,cACT,GAAGT,GAAuBG,EAAcM;EAGnCY,EAAoBhB,EAAOC,GAAG;;;cAG7BN;EAGDsB,EAAkBjB,EAAOC,GAAG;;;EAK5BiB,EAAalB,EAAOC,GAAyB;;aAE7C,EAAGG,cAAe,GAAGR,EAAaQ;;mBAE5Be,EAAU,gBAAgBA,EAAUC;UAC7Cf,EAAU;MACbG,IACC,IAAIa,EAAe,EAEnB,OAAQb,EAAMJ,UACV,IAAK,UACDiB,EAAeb,EAAMc,cAAgB3B,EAAkB,KACvD,MACJ,IAAK,WACD0B,EAAeb,EAAMc,cAAgB3B,EAAkB,EACvD,MACJ,QACI0B,EAAe,EAIvB,OAAOX,CAAG;sBACIW;SACb;EAIIE,EAAYvB,EAAOwB,EAAWC,OAAO;aACrCpB,EAAU;;;;EAMVqB,EAAW1B,EAAOC,GAAuB;MAC/CO,GACqB,aAAhBA,EAAMmB,MACCjB,CAAG;;;;;;;cASHA,CAAG;;0BAEIZ,EAAcU,EAAMJ;yBACrBI,EAAMoB;wBACPpB,EAAMqB;;wBAIN,EAAGC,cAAeA;cAC5B,EAAGC,gBAAkBA,EAAa,UAAY;;MAErDvB,GACsB,YAArBA,EAAMwB,YACNtB,CAAG;;;kBAGOF,EAAMyB,WAAa5B,EAAU;kBAC7BG,EAAMyB,WAAa5B,EAAU;kBAC7BG,EAAMsB,UAAYzB,EAAU;kBAC5BG,EAAMsB,UAAYzB,EAAU;;;EAKjC6B,EAAiBlC,EAAOC,GAAqC;;WAE/DN;cACG,EAAGS,cAAe,GAAGN,EAAcM;;oBAE7Be,EAAU,gBAAgBA,EAAUC;UAC9Cf,EAAU;EAGP8B,EAAWnC,EAAOwB,EAAWC,OAA2B;aACvDjB,GAAUA,EAAM4B,QAAU/B,EAAUgC,KAAK7B;;;;;;;;;"}
+{"version":3,"file":"time-slot-bar.styles.js","sources":["../../src/time-slot-bar/time-slot-bar.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, Colour, Shadow } from \"../theme\";\n\nconst MAX_LINE_HEIGHT = 1.25; // NOTE in rem\nexport const DEFAULT_CELL_SIZE = 40;\nexport const MINIFIED_CELL_SIZE = 12;\n\nexport const tokens = {\n    item: {\n        width: \"--fds-internal-timeSlotBar-item-width\",\n        left: \"--fds-internal-timeSlotBar-item-left\",\n        color: \"--fds-internal-timeSlotBar-item-color\",\n    },\n    border: {\n        left: \"--fds-internal-timeSlotBar-border-left\",\n    },\n} as const;\n\nexport const container = css`\n    position: relative;\n    display: flex;\n    align-items: center;\n`;\n\nexport const arrowButton = css`\n    z-index: 2;\n    position: absolute;\n    bottom: 0rem;\n    background-color: ${Colour.bg};\n    box-shadow: ${Shadow[\"md-strong\"]};\n    border-radius: 100%;\n    padding: 0.5rem;\n    width: 2rem;\n    height: 2rem;\n\n    > div {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n    &:focus {\n        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n    }\n`;\n\nexport const arrowButtonDefault = css`\n    bottom: 0.25rem;\n`;\n\nexport const arrowButtonMinified = css`\n    bottom: 0rem;\n`;\n\nexport const arrowButtonLeft = css`\n    left: 0;\n`;\n\nexport const arrowButtonRight = css`\n    right: 0;\n`;\n\nexport const arrowIcon = css`\n    width: 1rem;\n    height: 1rem;\n    color: ${Colour[\"icon-primary\"]};\n`;\n\nexport const timeSlotBarContainer = css`\n    overflow: hidden;\n    flex-grow: 1;\n    position: relative;\n`;\n\nexport const containerDefault = css`\n    height: ${MAX_LINE_HEIGHT * 16 + DEFAULT_CELL_SIZE}px;\n`;\n\nexport const containerMinified = css`\n    height: ${MAX_LINE_HEIGHT * 16 + MINIFIED_CELL_SIZE}px;\n`;\n\nexport const timeMarkerWrapper = css`\n    position: relative;\n    white-space: nowrap;\n    height: ${MAX_LINE_HEIGHT}rem;\n`;\n\nexport const timeSlotWrapper = css`\n    display: flex;\n    white-space: nowrap;\n`;\n\nexport const timeMarker = css`\n    display: inline-block;\n    position: relative;\n    border-left: ${Border[\"width-010\"]} ${Border.solid}\n        ${Colour[\"border-stronger\"]};\n`;\n\nexport const timeMarkerDefault = css`\n    width: ${DEFAULT_CELL_SIZE}px;\n    height: 0.625rem;\n`;\n\nexport const timeMarkerMinified = css`\n    width: ${MINIFIED_CELL_SIZE}px;\n    height: 0rem;\n`;\n\nexport const timeMarkerLong = css`\n    height: ${MAX_LINE_HEIGHT}rem;\n`;\n\nexport const timeLabel = css`\n    color: ${Colour[\"text-subtle\"]};\n    position: absolute;\n    bottom: 10%;\n    left: 10%;\n`;\n\nexport const timeSlotBorder = css`\n    /* reset variable to prevent leaking to child components */\n    ${tokens.border.left}: initial;\n\n    position: absolute;\n    top: ${MAX_LINE_HEIGHT}rem;\n    z-index: 1;\n    left: var(${tokens.border.left});\n    border-right: ${Border[\"width-010\"]} ${Border.solid}\n        ${Colour[\"border-stronger\"]};\n`;\n\nexport const timeSlotBorderDefault = css`\n    height: ${DEFAULT_CELL_SIZE}px;\n`;\n\nexport const timeSlotBorderMinified = css`\n    height: ${MINIFIED_CELL_SIZE}px;\n`;\n\nexport const cellText = css`\n    position: absolute;\n    bottom: 0;\n    padding-left: 4px;\n    padding-bottom: 4px;\n    width: 100%;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    color: inherit;\n`;\n\nexport const timeSlotItem = css`\n    /* reset variables to prevent leaking to child components */\n    ${tokens.item.left}: initial;\n    ${tokens.item.width}: initial;\n    ${tokens.item.color}: initial;\n\n    position: absolute;\n    color: var(${tokens.item.color});\n    left: var(${tokens.item.left});\n    width: var(${tokens.item.width});\n`;\n\nexport const timeSlotItemContent = css`\n    width: 100%;\n    height: 100%;\n`;\n\nexport const timeSlotItemDefault = css`\n    height: ${DEFAULT_CELL_SIZE}px;\n`;\n\nexport const timeSlotItemMinified = css`\n    height: ${MINIFIED_CELL_SIZE}px;\n`;\n"],"names":["DEFAULT_CELL_SIZE","MINIFIED_CELL_SIZE","tokens","item","width","left","color","border","container","arrowButton","arrowButtonDefault","arrowButtonMinified","arrowButtonLeft","arrowButtonRight","arrowIcon","timeSlotBarContainer","containerDefault","containerMinified","timeMarkerWrapper","timeSlotWrapper","timeMarker","timeMarkerDefault","timeMarkerMinified","timeMarkerLong","timeLabel","timeSlotBorder","timeSlotBorderDefault","timeSlotBorderMinified","cellText","timeSlotItem","timeSlotItemContent","timeSlotItemDefault","timeSlotItemMinified"],"mappings":"uEAKO,MAAMA,EAAoB,GACpBC,EAAqB,GAErBC,EAAS,CAClBC,KAAM,CACFC,MAAO,wCACPC,KAAM,uCACNC,MAAO,yCAEXC,OAAQ,CACJF,KAAM,2CAIDG,EAAS,SAMTC,EAAW,WAsBXC,EAAkB,UAIlBC,EAAmB,UAInBC,EAAe,UAIfC,EAAgB,UAIhBC,EAAS,WAMTC,EAAoB,WAMpBC,EAAgB,WAIhBC,EAAiB,UAIjBC,EAAiB,WAMjBC,EAAe,WAKfC,EAAU,WAOVC,EAAiB,UAKjBC,EAAkB,UAKlBC,EAAc,UAIdC,EAAS,UAOTC,EAAc,WAYdC,EAAqB,UAIrBC,EAAsB,UAItBC,EAAQ,WAYRC,EAAY,UAYZC,EAAmB,WAKnBC,EAAmB,WAInBC,EAAoB"}

package/time-slot-bar/time-slot-bar.styles_wigbyd.css

@@ -0,0 +1,25 @@
+.cleto2{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
+.a18tsztd{z-index:2;position:absolute;bottom:0rem;background-color:var(--fds-colour-bg);box-shadow:var(--fds-shadow-md-strong);border-radius:100%;padding:0.5rem;width:2rem;height:2rem;}.a18tsztd >div{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;}.a18tsztd:focus{-webkit-tap-highlight-color:rgba(0, 0, 0, 0);}
+.a9mraed{bottom:0.25rem;}
+.aljok3x{bottom:0rem;}
+.av3ykv8{left:0;}
+.as5dred{right:0;}
+.a195ar7o{width:1rem;height:1rem;color:var(--fds-colour-icon-primary);}
+.t1dmizys{overflow:hidden;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;position:relative;}
+.c1w55l7b{height:60px;}
+.cqcczbk{height:32px;}
+.t10z816e{position:relative;white-space:nowrap;height:1.25rem;}
+.t1ukhl9h{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;white-space:nowrap;}
+.t1iag8mt{display:inline-block;position:relative;border-left:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border-stronger);}
+.t1iopuc{width:40px;height:0.625rem;}
+.tbp961o{width:12px;height:0rem;}
+.t7d7vtm{height:1.25rem;}
+.te99x8g{color:var(--fds-colour-text-subtle);position:absolute;bottom:10%;left:10%;}
+.t1e383ch{--fds-internal-timeSlotBar-border-left:initial;position:absolute;top:1.25rem;z-index:1;left:var(--fds-internal-timeSlotBar-border-left);border-right:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border-stronger);}
+.tyac3mh{height:40px;}
+.twiecck{height:12px;}
+.c1yanpy9{position:absolute;bottom:0;padding-left:4px;padding-bottom:4px;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:inherit;}
+.tfycdxa{--fds-internal-timeSlotBar-item-left:initial;--fds-internal-timeSlotBar-item-width:initial;--fds-internal-timeSlotBar-item-color:initial;position:absolute;color:var(--fds-internal-timeSlotBar-item-color);left:var(--fds-internal-timeSlotBar-item-left);width:var(--fds-internal-timeSlotBar-item-width);}
+.t11y98ca{width:100%;height:100%;}
+.t1kzvg2s{height:40px;}
+.t4axcvt{height:12px;}

package/time-slot-bar/time-slot-divider.d.ts

@@ -0,0 +1,8 @@
+import type { TimeSlotBarVariant } from "./types";
+interface TimeSlotDividerProps {
+    variant: TimeSlotBarVariant;
+    left?: number;
+    dataTestId?: string;
+}
+declare const TimeSlotDivider: ({ variant, left, dataTestId, }: TimeSlotDividerProps) => import("react/jsx-runtime").JSX.Element;
+export default TimeSlotDivider;

package/time-slot-bar/time-slot-divider.js

@@ -0,0 +1,2 @@
+import{jsx as e}from"react/jsx-runtime";import t from"clsx";import{useRef as r}from"react";import"../theme/theme-provider/index.js";import{formatUnitValue as o}from"../theme/utils/css-variable.js";import"../theme/theme-provider/context.js";import"../theme/tokens/border.js";import"../theme/tokens/colour.js";import"../theme/tokens/font.js";import"../theme/tokens/media-query.js";import{useApplyStyle as m}from"../theme/utils/use-apply-styles.js";import"../theme/utils/use-media-query.js";import{tokens as s,timeSlotBorder as i,timeSlotBorderDefault as a,timeSlotBorderMinified as p}from"./time-slot-bar.styles.js";const l=({variant:l,left:d,dataTestId:n})=>{const u=r(null);return m(u,{[s.border.left]:void 0===d?void 0:o(d,"px")}),e("div",{ref:u,"data-testid":n,className:t(i,"default"===l?a:p)})};export{l as default};
+//# sourceMappingURL=time-slot-divider.js.map

package/time-slot-bar/time-slot-divider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"time-slot-divider.js","sources":["../../src/time-slot-bar/time-slot-divider.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useRef } from \"react\";\n\nimport { formatUnitValue, useApplyStyle } from \"../theme\";\nimport * as styles from \"./time-slot-bar.styles\";\nimport type { TimeSlotBarVariant } from \"./types\";\n\ninterface TimeSlotDividerProps {\n    variant: TimeSlotBarVariant;\n    left?: number;\n    dataTestId?: string;\n}\n\nconst TimeSlotDivider = ({\n    variant,\n    left,\n    dataTestId,\n}: TimeSlotDividerProps) => {\n    const dividerRef = useRef<HTMLDivElement>(null);\n\n    useApplyStyle(dividerRef, {\n        [styles.tokens.border.left]:\n            left === undefined ? undefined : formatUnitValue(left, \"px\"),\n    });\n\n    return (\n        <div\n            ref={dividerRef}\n            data-testid={dataTestId}\n            className={clsx(\n                styles.timeSlotBorder,\n                variant === \"default\"\n                    ? styles.timeSlotBorderDefault\n                    : styles.timeSlotBorderMinified\n            )}\n        />\n    );\n};\n\nexport default TimeSlotDivider;\n"],"names":["TimeSlotDivider","variant","left","dataTestId","dividerRef","useRef","useApplyStyle","styles.tokens","border","undefined","formatUnitValue","_jsx","ref","className","clsx","styles.timeSlotBorder","styles.timeSlotBorderDefault","styles.timeSlotBorderMinified"],"mappings":"smBAaA,MAAMA,EAAkB,EACpBC,UACAC,OACAC,iBAEA,MAAMC,EAAaC,EAAuB,MAO1C,OALAC,EAAcF,EAAY,CACtB,CAACG,EAAcC,OAAON,WACTO,IAATP,OAAqBO,EAAYC,EAAgBR,EAAM,QAI3DS,EAAA,MAAA,CACIC,IAAKR,EAAU,cACFD,EACbU,UAAWC,EACPC,EACY,YAAZd,EACMe,EACAC,IAEZ"}

package/time-slot-bar/time-slot-item.d.ts

@@ -0,0 +1,13 @@
+import { type MouseEvent } from "react";
+import type { TimeSlotBarVariant } from "./types";
+interface TimeSlotItemProps {
+    children: React.ReactNode;
+    color?: string;
+    dataTestId?: string;
+    onClick?: (() => void) | ((evt: MouseEvent<HTMLElement>) => void);
+    slotOffset: number;
+    slotWidth: number;
+    variant: TimeSlotBarVariant;
+}
+declare const TimeSlotItem: ({ children, color, dataTestId, onClick, slotOffset, slotWidth, variant, }: TimeSlotItemProps) => import("react/jsx-runtime").JSX.Element;
+export default TimeSlotItem;

package/time-slot-bar/time-slot-item.js

@@ -0,0 +1,2 @@
+import{jsx as t}from"react/jsx-runtime";import e from"clsx";import{useRef as o}from"react";import"../theme/theme-provider/index.js";import{formatUnitValue as r}from"../theme/utils/css-variable.js";import"../theme/theme-provider/context.js";import"../theme/tokens/border.js";import{Colour as m}from"../theme/tokens/colour.js";import"../theme/tokens/font.js";import"../theme/tokens/media-query.js";import{useApplyStyle as s}from"../theme/utils/use-apply-styles.js";import"../theme/utils/use-media-query.js";import{tokens as i,timeSlotItem as l,timeSlotItemDefault as p,timeSlotItemMinified as a}from"./time-slot-bar.styles.js";const d=({children:d,color:n,dataTestId:c,onClick:h,slotOffset:f,slotWidth:u,variant:j})=>{const x=o(null);return s(x,{[i.item.width]:r(u,"px"),[i.item.left]:r(f,"px"),[i.item.color]:n||m.text}),t("div",{ref:x,"data-testid":c,className:e(l,"default"===j?p:a),onClick:h,children:d})};export{d as default};
+//# sourceMappingURL=time-slot-item.js.map

package/time-slot-bar/time-slot-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"time-slot-item.js","sources":["../../src/time-slot-bar/time-slot-item.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { type MouseEvent, useRef } from \"react\";\n\nimport { Colour, formatUnitValue, useApplyStyle } from \"../theme\";\nimport * as styles from \"./time-slot-bar.styles\";\nimport type { TimeSlotBarVariant } from \"./types\";\n\ninterface TimeSlotItemProps {\n    children: React.ReactNode;\n    color?: string;\n    dataTestId?: string;\n    onClick?: (() => void) | ((evt: MouseEvent<HTMLElement>) => void);\n    slotOffset: number;\n    slotWidth: number;\n    variant: TimeSlotBarVariant;\n}\n\nconst TimeSlotItem = ({\n    children,\n    color,\n    dataTestId,\n    onClick,\n    slotOffset,\n    slotWidth,\n    variant,\n}: TimeSlotItemProps) => {\n    const itemRef = useRef<HTMLDivElement>(null);\n\n    useApplyStyle(itemRef, {\n        [styles.tokens.item.width]: formatUnitValue(slotWidth, \"px\"),\n        [styles.tokens.item.left]: formatUnitValue(slotOffset, \"px\"),\n        [styles.tokens.item.color]: color || Colour.text,\n    });\n\n    return (\n        <div\n            ref={itemRef}\n            data-testid={dataTestId}\n            className={clsx(\n                styles.timeSlotItem,\n                variant === \"default\"\n                    ? styles.timeSlotItemDefault\n                    : styles.timeSlotItemMinified\n            )}\n            onClick={onClick}\n        >\n            {children}\n        </div>\n    );\n};\n\nexport default TimeSlotItem;\n"],"names":["TimeSlotItem","children","color","dataTestId","onClick","slotOffset","slotWidth","variant","itemRef","useRef","useApplyStyle","styles.tokens","item","width","formatUnitValue","left","Colour","text","_jsx","ref","className","clsx","styles.timeSlotItem","styles.timeSlotItemDefault","styles.timeSlotItemMinified"],"mappings":"inBAiBA,MAAMA,EAAe,EACjBC,WACAC,QACAC,aACAC,UACAC,aACAC,YACAC,cAEA,MAAMC,EAAUC,EAAuB,MAQvC,OANAC,EAAcF,EAAS,CACnB,CAACG,EAAcC,KAAKC,OAAQC,EAAgBR,EAAW,MACvD,CAACK,EAAcC,KAAKG,MAAOD,EAAgBT,EAAY,MACvD,CAACM,EAAcC,KAAKV,OAAQA,GAASc,EAAOC,OAI5CC,EAAA,MAAA,CACIC,IAAKX,EAAO,cACCL,EACbiB,UAAWC,EACPC,EACY,YAAZf,EACMgB,EACAC,GAEVpB,QAASA,EAAOH,SAEfA,GACC"}

package/time-slot-bar/types.d.ts

@@ -1,7 +1,7 @@
-import type { V3_ThemeStyleProps } from "../v3_theme/types";
-export type SlotStyle = "default" | "stripes";
-export type Direction = "right" | "left";
+import type { SlotStyle } from "../shared/time-slot/types";
 export type TimeSlotBarVariant = "minified" | "default";
+export type Direction = "right" | "left";
+export type { SlotStyle } from "../shared/time-slot/types";
 export interface TimeSlotBarRef {
     /** Resets the scroll position to the initialScrollTime if provided */
     resetScroll: () => void;
@@ -12,9 +12,13 @@ interface TimeSlotBarStyleAttributes {
     /** The label color */
     color?: string | undefined;
     /** The background color */
-    backgroundColor: string | ((props: V3_ThemeStyleProps) => string);
+    backgroundColor: string;
     /** The secondary background color. Used in conjunction if styleType is "stripes" */
-    backgroundColor2?: string | ((props: V3_ThemeStyleProps) => string) | undefined;
+    backgroundColor2?: string | undefined;
+    /** The background color on hover */
+    hoverBackgroundColor?: string | undefined;
+    /** The secondary background color on hover. Used in conjunction if styleType is "stripes" */
+    hoverBackgroundColor2?: string | undefined;
 }
 export interface TimeSlotBarProps {
     "data-testid"?: string | undefined;
@@ -49,4 +53,3 @@ export interface TimeSlot {
     clickable?: boolean | undefined;
     styleAttributes: TimeSlotBarStyleAttributes;
 }
-export {};

package/time-slot-bar-week/time-slot-bar-week-days.d.ts

@@ -2,7 +2,6 @@ import type { Dayjs } from "dayjs";
 import type { InternalCalendarProps } from "../shared/internal-calendar";
 import type { TimeSlot } from "../time-slot-bar/types";
 import type { TimeSlotCellsVariant } from "./types";
-export type DayVariant = "default" | "other-month" | "today";
 interface TimeSlotWeekDaysProps extends Pick<InternalCalendarProps, "disabledDates" | "minDate" | "maxDate"> {
     selectedDate: string | undefined;
     calendarDate: Dayjs;

package/time-slot-bar-week/time-slot-bar-week-days.js

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useSpring as l}from"@react-spring/web";import i from"../external/dayjs/dayjs.min.js";import r from"../external/lodash/isEmpty.js";import n from"../external/lodash/maxBy.js";import o from"../external/lodash/minBy.js";import{useState as a,useMemo as s}from"react";import{useResizeDetector as c}from"../external/react-resize-detector/build/index.esm.js";import{DayCell as d}from"../shared/internal-calendar/day-cell/day-cell.js";import{CalendarHelper as m}from"../util/calendar-helper.js";import{DateHelper as h}from"../util/date-helper.js";import"../util/string-helper.js";import{V3_Colour as f}from"../v3_theme/index.js";import{Wrapper as u,HeaderCellWeekColumn as g,HeaderCellWeek as b,CellWeekText as v,TimeColumn as p,TimeColumnWrapper as T,TimeColumnText as y,Expandable as $,ColumnWeekCell as j,TimeSlotWrapper as x,TimeSlotComponent as M,CollapseExpandAllWrapper as k,CollapseExpandAllButton as D,ChevronIcon as w}from"./time-slot-bar-week-days.style.js";const C=({calendarDate:C,disabledDates:L,selectedDate:O,onSelect:S,minDate:H,maxDate:A,startTime:E,endTime:F,maxVisibleCellHeight:I,slots:R,interval:Y=30,variant:B="flexible",enableSelection:W=!0,onSlotClick:z})=>{var V,_,q,G;const J="YYYY-MM-DD",[K,N]=a(!1),[P,Q]=a(),U=s((()=>m.generateDaysForCurrentWeek(C)),[C]),X=Object.values(null!=R?R:{}).flat(),Z=null!==(_=null!=E?E:null===(V=o(X,"startTime"))||void 0===V?void 0:V.startTime)&&void 0!==_?_:"00:00",ee=null!==(G=null!=F?F:null===(q=n(X,"endTime"))||void 0===q?void 0:q.endTime)&&void 0!==G?G:"24:00",te=Math.ceil(h.getTimeDiffInMinutes(Z,ee)/Y),{height:le=0,ref:ie}=c(),re=I?le<I||K?le:I:le,ne=l({height:re}),oe=s((()=>{if(R){const e={};return Object.entries(R).forEach((([t,l])=>{const i=function(e){const t=Array(te).fill({});return e.forEach((e=>{const l=Math.max(0,h.getTimeDiffInMinutes(Z,e.startTime)/Y),i=Math.min(te,h.getTimeDiffInMinutes(Z,e.endTime)/Y),n=Math.ceil(i)-Math.floor(l);switch(B){case"fixed":t[Math.floor(l)]=Object.assign(Object.assign({},e),{cellLength:i-l});break;case"flexible":for(let o=0;o<n;o++){const a=h.addMinutesToTime(Z,Math.floor(l+o)*Y),s=h.addMinutesToTime(a,Y);let c;r(t[Math.floor(l+o)])?0===o&&l%1!=0?c="top":o===n-1&&i%1!=0&&(c="bottom"):c=void 0,t[Math.floor(l+o)]=Object.assign(Object.assign({},e),{id:`${e.id}-${o}`,startTime:a,endTime:s,cellLength:1,halfFill:c})}}})),t}(l);e[t]=function(e){var t,l,i,n;let o=0;switch(B){case"fixed":for(e=e.reduce(((e,t)=>{const l=e.length>0?e[e.length-1]:e[0];return r(t)&&r(l)?e:[...e,t]}),[{}]);o<e.length;){if(r(e[o])){const r=null!==(l=null===(t=e[o-1])||void 0===t?void 0:t.endTime)&&void 0!==l?l:Z,a=null!==(n=null===(i=e[o+1])||void 0===i?void 0:i.startTime)&&void 0!==n?n:ee;if(r!==a){const t=h.getTimeDiffInMinutes(r,a)/Y;e[o]=Object.assign(Object.assign({},me(o)),{startTime:r,endTime:a,cellLength:t})}}o++}break;case"flexible":for(;o<e.length;)r(e[o])?(e[o]=me(o),o++):o+=e[o].cellLength}return e.filter((e=>!r(e)&&e.cellLength>0))}(i)})),e}return{}}),[R]),ae=e=>{Q(e)},se=()=>{Q(void 0)},ce=e=>{e.preventDefault(),N((e=>!e))},de=e=>{var t;const l=m.isWithinRange(e,H?i(H):void 0,A?i(A):void 0),r=null!==(t=L&&L.includes(e.format(J)))&&void 0!==t&&t;return!l||r};function me(e,t=1){return{id:`${e.toString()}-${(new Date).getTime()}`,startTime:"",endTime:"",clickable:!1,styleAttributes:{backgroundColor:f["bg-stronger"]},cellLength:t}}return e(u,{children:[t(g,{children:U.map(((e,l)=>{const r=(e=>{const t=e.format(J),l=de(e),i={},r=W&&!l;l&&(i.disabled=!0),i.interactive=W?r:null;const n=r&&P&&e.isSame(P,"day"),o=[O].includes(t);return o&&n?(i.labelType="selected-hover",i.circleLeft="selected-hover-outline",i.circleRight="selected-hover-outline"):o?(i.labelType="selected",i.circleLeft="selected-outline",i.circleRight="selected-outline"):n&&(i.labelType="hover",i.circleLeft="hover-subtle",i.circleRight="hover-subtle"),i})(e);return t(d,Object.assign({date:e,calendarDate:i(O),onSelect:()=>{((e,t)=>{!t&&W&&S(e)})(e,!r.interactive)},onHover:ae,onHoverEnd:se},r),`day-${l}`)}))}),t(g,{children:U.map(((e,l)=>t(b,{children:t(v,{weight:"semibold",$disabled:de(e),children:i(e).format("ddd")})},`week-day-${l}`)))}),(()=>{let e=!1;const l=t=>{const l=i(Z,"HH:mm").add(4*t*Y,"minutes"),r=l.format("h"),n=l.format("mm"),o=l.format("a");let a=`${r}${"00"!==n?` ${n}`:""}`;return e||"pm"!==o||"00"!==n||(a+=` ${o}`,e=!0),a};return t(p,{$height:re,children:Array(Math.ceil(te/4)).fill(void 0).map(((e,i)=>t(T,{children:t(y,{children:l(i)})},`time-${i}`)))})})(),t($,{style:ne,children:t(j,{ref:ie,children:U.map(((e,l)=>{var i;const r=e.format(J),n=null!==(i=oe[r])&&void 0!==i?i:Array("flexible"===B?te:1).fill(void 0).map(((e,t)=>me(t,"fixed"===B?te:void 0)));return t(x,{children:n.map((e=>{const{id:l,clickable:i=!0,styleAttributes:n,cellLength:o,halfFill:a}=e,{styleType:s="default",backgroundColor:c,backgroundColor2:d}=n;return t(M,{$type:"vertical",$variant:"default",$styleType:s,$bgColor:c,$bgColor2:d,$halfFill:a,$clickable:i,$height:"fixed"===B?12*o+4*(o-1):12,onClick:()=>i&&((e,t)=>{null==z||z(e,t)})(r,e)},l)}))},`wrapper-${l}`)}))},`week-cell-${C.format(J)}`)}),(()=>{if(I&&ie.current&&!(le&&le<I))return t(k,{children:e(D,{"data-testid":"time-bar-expand-collapse-button",styleType:"light",onClick:ce,children:[t(w,{$isExpanded:K}),(K?"Hide":"Show")+" later times"]})})})()]})};export{C as TimeSlotBarWeekDays};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useSpring as r}from"@react-spring/web";import i from"../external/dayjs/dayjs.min.js";import l from"../external/lodash/isEmpty.js";import o from"../external/lodash/maxBy.js";import n from"../external/lodash/minBy.js";import{useState as a,useRef as d,useMemo as s}from"react";import{useResizeDetector as c}from"../external/react-resize-detector/build/index.esm.js";import{VisuallyHidden as m,inertValue as u}from"../shared/accessibility/index.js";import{DayCell as h}from"../shared/internal-calendar/day-cell/day-cell.js";import"../theme/theme-provider/index.js";import"../theme/theme-provider/context.js";import"../theme/tokens/border.js";import{Colour as f}from"../theme/tokens/colour.js";import"../theme/tokens/font.js";import"../theme/tokens/media-query.js";import{CalendarHelper as p}from"../util/calendar-helper.js";import{DateHelper as v}from"../util/date-helper.js";import"../util/simple-id-generator.js";import{StringHelper as b}from"../util/string-helper.js";import"@react-aria/live-announcer";import"../theme/utils/use-media-query.js";import{TimeHelper as g}from"../util/time-helper.js";import{Wrapper as y,GridWrapper as x,HeaderCellWeekColumn as k,HeaderCellWeek as T,CellWeekText as j,TimeColumn as w,TimeColumnWrapper as M,TimeColumnText as D,Expandable as $,ColumnWeekCell as I,TimeSlotWrapper as A,CollapseExpandAllWrapper as S,CollapseExpandAllButton as C,ChevronIcon as L,TimeSlotComponent as O}from"./time-slot-bar-week-days.style.js";const Y=({calendarDate:Y,disabledDates:E,selectedDate:H,onSelect:R,minDate:F,maxDate:B,startTime:P,endTime:U,maxVisibleCellHeight:q,slots:W,interval:z=30,variant:K="flexible",enableSelection:N=!0,onSlotClick:V})=>{var G,J,Q,X;const Z="YYYY-MM-DD",[_,ee]=a(!1),[te,re]=a(),ie=d({}),le=s((()=>p.generateDaysForCurrentWeek(Y)),[Y]),oe=Object.values(null!=W?W:{}).flat(),ne=null!==(J=null!=P?P:null===(G=n(oe,"startTime"))||void 0===G?void 0:G.startTime)&&void 0!==J?J:"00:00",ae=null!==(X=null!=U?U:null===(Q=o(oe,"endTime"))||void 0===Q?void 0:Q.endTime)&&void 0!==X?X:"24:00",de=Math.ceil(v.getTimeDiffInMinutes(ne,ae)/z),{height:se=0,ref:ce}=c(),me=!!q&&se>q,ue=void 0!==q?Math.max(1,Math.floor((q+4)/16)):0,he=q?!me||_?se:ue>0?16*ue-4:q:se,fe=r({height:he}),pe=s((()=>{if(W){const e={};return Object.entries(W).forEach((([t,r])=>{const i=function(e){const t=Array(de).fill({});return e.forEach((e=>{const r=Math.max(0,v.getTimeDiffInMinutes(ne,e.startTime)/z),i=Math.min(de,v.getTimeDiffInMinutes(ne,e.endTime)/z),o=Math.ceil(i)-Math.floor(r);switch(K){case"fixed":t[Math.floor(r)]=Object.assign(Object.assign({},e),{isActualSlot:!0,rowIndex:Math.floor(r),cellLength:i-r});break;case"flexible":for(let n=0;n<o;n++){const a=v.addMinutesToTime(ne,Math.floor(r+n)*z),d=v.addMinutesToTime(a,z);let s;l(t[Math.floor(r+n)])?0===n&&r%1!=0?s="top":n===o-1&&i%1!=0&&(s="bottom"):s=void 0,t[Math.floor(r+n)]=Object.assign(Object.assign({},e),{id:`${e.id}-${n}`,startTime:a,endTime:d,isActualSlot:!0,rowIndex:Math.floor(r+n),cellLength:1,halfFill:s})}}})),t}(r);e[t]=function(e){var t,r,i,o;let n=0;switch(K){case"fixed":for(e=e.reduce(((e,t)=>{const r=e.length>0?e[e.length-1]:e[0];return l(t)&&l(r)?e:[...e,t]}),[{}]);n<e.length;){if(l(e[n])){const l=null!==(r=null===(t=e[n-1])||void 0===t?void 0:t.endTime)&&void 0!==r?r:ne,a=null!==(o=null===(i=e[n+1])||void 0===i?void 0:i.startTime)&&void 0!==o?o:ae;if(l!==a){const t=v.getTimeDiffInMinutes(l,a)/z;e[n]=Object.assign(Object.assign({},je(n)),{startTime:l,endTime:a,cellLength:t})}}n++}break;case"flexible":for(;n<e.length;)l(e[n])?(e[n]=je(n),n++):n+=e[n].cellLength}return e.filter((e=>!l(e)&&e.cellLength>0))}(i)})),e}return{}}),[W]),ve=s((()=>le.reduce(((e,t)=>{const r=t.format(Z);return e[r]=Me(r).filter((e=>!!e.isActualSlot&&void 0!==e.rowIndex)).map((e=>({key:`${r}-${e.id}`,date:r,rowIndex:e.rowIndex}))).sort(((e,t)=>e.rowIndex-t.rowIndex)),e}),{})),[le,pe]),be=e=>{re(e)},ge=()=>{re(void 0)},ye=(e,t)=>{null==V||V(e,t)},xe=(e,t)=>r=>{r.stopPropagation(),ye(e,t)},ke=e=>{e.preventDefault(),ee((e=>!e))},Te=e=>{var t;const r=p.isWithinRange(e,F?i(F):void 0,B?i(B):void 0),l=null!==(t=E&&E.includes(e.format(Z)))&&void 0!==t&&t;return!r||l};function je(e,t=1){return{id:`${e.toString()}-${(new Date).getTime()}`,startTime:"",endTime:"",clickable:!1,isActualSlot:!1,styleAttributes:{backgroundColor:f["bg-stronger"]},cellLength:t}}function we(e,t){var r;const{startTime:l,endTime:o}=t;return b.joinNonEmptyStrings([i(e).format("D MMMM YYYY dddd"),l&&o?g.formatTimeRange(l,o):void 0,t.label,null===(r=t.clickable)||void 0===r||r?"Available":"Unavailable"])}function Me(e){var t;return null!==(t=pe[e])&&void 0!==t?t:Array("flexible"===K?de:1).fill(void 0).map(((e,t)=>je(t,"fixed"===K?de:void 0)))}const De=(e,r)=>{var i;const{id:l,clickable:o=!0,isActualSlot:n,styleAttributes:a,cellLength:d,halfFill:s}=r,{styleType:c="default",backgroundColor:h,backgroundColor2:f}=a,p=`${e}-${l}`,v=me&&!_&&(null!==(i=r.rowIndex)&&void 0!==i?i:0)>=ue;return t(O,{styleType:c,bgColor:h,bgColor2:f,clickable:o,$halfFill:s,$height:"fixed"===K?12*d+4*(d-1):12,onClick:()=>o&&ye(e,r),children:n&&t(m,{inert:u(v),children:t("button",{type:"button",ref:e=>{ie.current[p]=e},"aria-disabled":!o,"aria-label":we(e,r),onKeyDown:t=>{var i;return((e,t)=>{var r;const i=null!==(r=ve[t.date])&&void 0!==r?r:[],l=e=>{var t;e&&(null===(t=ie.current[e.key])||void 0===t||t.focus())};switch(e.key){case"ArrowRight":case"ArrowDown":{e.preventDefault();const r=i.findIndex((e=>e.key===t.key));l(i[r+1]);break}case"ArrowLeft":case"ArrowUp":{e.preventDefault();const r=i.findIndex((e=>e.key===t.key));l(i[r-1]);break}case"Home":case"PageUp":e.preventDefault(),l(i[0]);break;case"End":e.preventDefault(),l(i[i.length-1]);break;case"PageDown":if(e.preventDefault(),me&&!_){ee(!0);const e=[...i].reverse().find((e=>e.rowIndex<ue));l(null!=e?e:i[0]);break}l(i[i.length-1])}})(t,{key:p,date:e,rowIndex:null!==(i=r.rowIndex)&&void 0!==i?i:0})},onClick:o?xe(e,r):void 0})})},l)};return e(y,{children:[e(x,{role:"grid",children:[t(k,{role:"row",onBlur:ge,children:le.map(((e,r)=>{const l=(e=>{const t=e.format(Z),r=Te(e),i={},l=N&&!r;r&&(i.disabled=!0),i.interactive=!!N&&l;const o=l&&te&&e.isSame(te,"day"),n=[H].includes(t);return n&&o?(i.labelType="selected-hover",i.circleLeft="selected-hover-outline",i.circleRight="selected-hover-outline"):n?(i.labelType="selected",i.circleLeft="selected-outline",i.circleRight="selected-outline"):o&&(i.labelType="hover",i.circleLeft="hover-subtle",i.circleRight="hover-subtle"),i})(e);return t(h,Object.assign({date:e,calendarDate:i(H),role:"columnheader",tabIndex:l.interactive?0:-1,onSelect:()=>{((e,t)=>{!t&&N&&R(e)})(e,!l.interactive)},onHover:be,onHoverEnd:ge,onFocus:be},l),`day-${r}`)}))}),t(k,{role:"row",children:le.map(((e,r)=>t(T,{role:"gridcell",children:t(j,{weight:"semibold",$disabled:Te(e),children:i(e).format("ddd")})},`week-day-${r}`)))}),(()=>{let e=!1;const r=t=>{const r=i(ne,"HH:mm").add(4*t*z,"minutes"),l=r.format("h"),o=r.format("mm"),n=r.format("a");let a=`${l}${"00"!==o?` ${o}`:""}`;return e||"pm"!==n||"00"!==o||(a+=` ${n}`,e=!0),a};return t(w,{$height:he,"aria-hidden":!0,children:Array(Math.ceil(de/4)).fill(void 0).map(((e,i)=>t(M,{children:t(D,{children:r(i)})},`time-${i}`)))})})(),t($,{style:fe,role:"row",children:t(I,{ref:ce,children:le.map(((e,r)=>{const i=e.format(Z),l=Me(i);return t(A,{role:"gridcell",children:l.map((e=>De(i,e)))},`wrapper-${r}`)}))},`week-cell-${Y.format(Z)}`)})]}),(()=>{if(q&&ce.current)return t(S,{children:e(C,{"data-testid":"time-bar-expand-collapse-button",styleType:"light","aria-expanded":_,onClick:ke,children:[t(L,{$isExpanded:_}),(_?"Hide":"Show")+" later times"]})})})()]})};export{Y as TimeSlotBarWeekDays};
 //# sourceMappingURL=time-slot-bar-week-days.js.map

package/time-slot-bar-week/time-slot-bar-week-days.js.map

@@ -1 +1 @@
-{"version":3,"file":"time-slot-bar-week-days.js","sources":["../../src/time-slot-bar-week/time-slot-bar-week-days.tsx"],"sourcesContent":["import { useSpring } from \"@react-spring/web\";\nimport type { Dayjs } from \"dayjs\";\nimport dayjs from \"dayjs\";\nimport isEmpty from \"lodash/isEmpty\";\nimport maxBy from \"lodash/maxBy\";\nimport minBy from \"lodash/minBy\";\nimport type React from \"react\";\nimport { useMemo, useState } from \"react\";\nimport { useResizeDetector } from \"react-resize-detector\";\n\nimport type { InternalCalendarProps } from \"../shared/internal-calendar\";\nimport type { CellStyleProps } from \"../shared/internal-calendar/day-cell\";\nimport { DayCell } from \"../shared/internal-calendar/day-cell\";\nimport type { TimeSlot } from \"../time-slot-bar/types\";\nimport { DateHelper } from \"../util\";\nimport { CalendarHelper } from \"../util/calendar-helper\";\nimport { V3_Colour } from \"../v3_theme\";\nimport {\n    CellWeekText,\n    ChevronIcon,\n    CollapseExpandAllButton,\n    CollapseExpandAllWrapper,\n    ColumnWeekCell,\n    Expandable,\n    HeaderCellWeek,\n    HeaderCellWeekColumn,\n    TimeColumn,\n    TimeColumnText,\n    TimeColumnWrapper,\n    TimeSlotComponent,\n    TimeSlotWrapper,\n    Wrapper,\n} from \"./time-slot-bar-week-days.style\";\nimport type { TimeSlotCellsVariant } from \"./types\";\n\nexport type DayVariant = \"default\" | \"other-month\" | \"today\";\ninterface TimeSlotWeekDaysProps\n    extends Pick<\n        InternalCalendarProps,\n        \"disabledDates\" | \"minDate\" | \"maxDate\"\n    > {\n    selectedDate: string | undefined;\n    calendarDate: Dayjs;\n    onSelect: (value: Dayjs) => void;\n    slots: { [date: string]: TimeSlot[] };\n    startTime?: string | undefined;\n    endTime?: string | undefined;\n    maxVisibleCellHeight?: number | undefined;\n    interval?: number | undefined;\n    variant?: TimeSlotCellsVariant | undefined;\n    enableSelection?: boolean | undefined;\n    onSlotClick?: ((date: string, timeSlot: TimeSlot) => void) | undefined;\n}\n\ninterface TimeSlotCell extends TimeSlot {\n    cellLength: number;\n    halfFill?: \"top\" | \"bottom\" | undefined;\n}\n\nexport const TimeSlotBarWeekDays = ({\n    calendarDate,\n    disabledDates,\n    selectedDate,\n    onSelect,\n    minDate,\n    maxDate,\n    startTime,\n    endTime,\n    maxVisibleCellHeight,\n    slots: daySlots,\n    interval = 30,\n    variant = \"flexible\",\n    enableSelection = true,\n    onSlotClick,\n}: TimeSlotWeekDaysProps) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const dateFormat = \"YYYY-MM-DD\";\n    const [expandAll, setExpandAll] = useState<boolean>(false);\n    const [hoverDay, setHoverDay] = useState<Dayjs>();\n    const currentCalendarWeek = useMemo((): Dayjs[] => {\n        return CalendarHelper.generateDaysForCurrentWeek(calendarDate);\n    }, [calendarDate]);\n\n    const flattenedSlots = Object.values(daySlots ?? {}).flat();\n    const minStartTime =\n        startTime ?? minBy(flattenedSlots, \"startTime\")?.startTime ?? \"00:00\";\n    const maxEndTime =\n        endTime ?? maxBy(flattenedSlots, \"endTime\")?.endTime ?? \"24:00\";\n    const numberOfCells = Math.ceil(\n        DateHelper.getTimeDiffInMinutes(minStartTime, maxEndTime) / interval\n    );\n\n    // React spring animation configuration\n    const { height: actualHeight = 0, ref: cellsRef } = useResizeDetector();\n    const height = maxVisibleCellHeight\n        ? actualHeight < maxVisibleCellHeight || expandAll\n            ? actualHeight\n            : maxVisibleCellHeight\n        : actualHeight;\n    const expandableStyles = useSpring({ height });\n\n    const generatedDaySlots = useMemo((): {\n        [date: string]: TimeSlotCell[];\n    } => {\n        if (daySlots) {\n            const transformedDaySlots: Record<string, TimeSlotCell[]> = {};\n            Object.entries(daySlots).forEach(([key, slots]) => {\n                const cellsArray = initializeAndFillSlots(slots);\n                transformedDaySlots[key] = populateEmptyCells(cellsArray);\n            });\n            return transformedDaySlots;\n        }\n        return {};\n    }, [daySlots]);\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleDayClick = (value: Dayjs, isDisabled: boolean) => {\n        if (isDisabled || !enableSelection) return;\n\n        onSelect(value);\n    };\n\n    const handleDayHover = (value: Dayjs) => {\n        setHoverDay(value);\n    };\n\n    const handleDayMouseout = () => {\n        setHoverDay(undefined);\n    };\n\n    const handleSlotClick = (date: string, slot: TimeSlot) => {\n        onSlotClick?.(date, slot);\n    };\n\n    const handleExpandCollapseClick = (event: React.MouseEvent) => {\n        event.preventDefault();\n        setExpandAll((prevExpandValue) => !prevExpandValue);\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        );\n\n        const isDisabledDate =\n            (disabledDates && disabledDates.includes(day.format(dateFormat))) ??\n            false;\n\n        return !isWithinRange || isDisabledDate;\n    };\n\n    const generateStyleProps = (day: Dayjs) => {\n        const dateStartWithYear = day.format(dateFormat);\n        const disabled = isDisabled(day);\n        const dayCellStyleProps: CellStyleProps = {};\n        const isHoverEnabled = enableSelection && !disabled;\n\n        if (disabled) {\n            dayCellStyleProps.disabled = true;\n        }\n\n        dayCellStyleProps.interactive = !enableSelection\n            ? null\n            : isHoverEnabled;\n\n        const isHover =\n            isHoverEnabled && hoverDay && day.isSame(hoverDay, \"day\");\n        const isSelected = [selectedDate].includes(dateStartWithYear);\n\n        if (isSelected && isHover) {\n            dayCellStyleProps.labelType = \"selected-hover\";\n            dayCellStyleProps.circleLeft = \"selected-hover-outline\";\n            dayCellStyleProps.circleRight = \"selected-hover-outline\";\n        } else if (isSelected) {\n            dayCellStyleProps.labelType = \"selected\";\n            dayCellStyleProps.circleLeft = \"selected-outline\";\n            dayCellStyleProps.circleRight = \"selected-outline\";\n        } else if (isHover) {\n            dayCellStyleProps.labelType = \"hover\";\n            dayCellStyleProps.circleLeft = \"hover-subtle\";\n            dayCellStyleProps.circleRight = \"hover-subtle\";\n        }\n\n        return dayCellStyleProps;\n    };\n\n    function generateFallbackCell(\n        prefix: string | number,\n        cellLength = 1\n    ): TimeSlotCell {\n        return {\n            id: `${prefix.toString()}-${new Date().getTime()}`,\n            startTime: \"\",\n            endTime: \"\",\n            clickable: false,\n            styleAttributes: {\n                backgroundColor: V3_Colour[\"bg-stronger\"],\n            },\n            cellLength,\n        };\n    }\n\n    function initializeAndFillSlots(slots: TimeSlot[]): TimeSlotCell[] {\n        const cellsArray = Array(numberOfCells).fill({});\n\n        slots.forEach((slot) => {\n            const startIndex = Math.max(\n                0,\n                DateHelper.getTimeDiffInMinutes(minStartTime, slot.startTime) /\n                    interval\n            );\n            const endIndex = Math.min(\n                numberOfCells,\n                DateHelper.getTimeDiffInMinutes(minStartTime, slot.endTime) /\n                    interval\n            );\n            const cellLength = Math.ceil(endIndex) - Math.floor(startIndex);\n\n            switch (variant) {\n                case \"fixed\":\n                    // Keep fixed slots as 1 long cell\n                    cellsArray[Math.floor(startIndex)] = {\n                        ...slot,\n                        cellLength: endIndex - startIndex,\n                    };\n                    break;\n                case \"flexible\":\n                    // Split long slot into multiple cells of length 1\n                    for (let i = 0; i < cellLength; i++) {\n                        const startTime = DateHelper.addMinutesToTime(\n                            minStartTime,\n                            Math.floor(startIndex + i) * interval\n                        );\n                        const endTime = DateHelper.addMinutesToTime(\n                            startTime,\n                            interval\n                        );\n\n                        let halfFill: string | undefined;\n\n                        if (!isEmpty(cellsArray[Math.floor(startIndex + i)])) {\n                            // Previous cell extends into current cell, fill entire cell\n                            halfFill = undefined;\n                        } else if (i === 0 && startIndex % 1 !== 0) {\n                            halfFill = \"top\";\n                        } else if (i === cellLength - 1 && endIndex % 1 !== 0) {\n                            halfFill = \"bottom\";\n                        }\n\n                        cellsArray[Math.floor(startIndex + i)] = {\n                            ...slot,\n                            id: `${slot.id}-${i}`,\n                            startTime,\n                            endTime,\n                            cellLength: 1,\n                            halfFill,\n                        };\n                    }\n                    break;\n            }\n        });\n        return cellsArray;\n    }\n\n    function populateEmptyCells(cellsArray: any[]): TimeSlotCell[] {\n        let i = 0;\n        switch (variant) {\n            case \"fixed\":\n                // Truncate consecutive empty cells into 1 [{},{},{...},{},{}] -> [{},{...},{}]\n                cellsArray = cellsArray.reduce(\n                    (result, obj) => {\n                        const lastObj =\n                            result.length > 0\n                                ? result[result.length - 1]\n                                : result[0];\n                        if (isEmpty(obj) && isEmpty(lastObj)) {\n                            return result;\n                        }\n                        return [...result, obj];\n                    },\n                    [{}]\n                );\n\n                // Fill in empty cells with timings & corresponding cell lengths\n                while (i < cellsArray.length) {\n                    if (isEmpty(cellsArray[i])) {\n                        const startTime =\n                            cellsArray[i - 1]?.endTime ?? minStartTime;\n                        const endTime =\n                            cellsArray[i + 1]?.startTime ?? maxEndTime;\n                        if (startTime !== endTime) {\n                            const cellLength =\n                                DateHelper.getTimeDiffInMinutes(\n                                    startTime,\n                                    endTime\n                                ) / interval;\n                            cellsArray[i] = {\n                                ...generateFallbackCell(i),\n                                startTime,\n                                endTime,\n                                cellLength,\n                            };\n                        }\n                    }\n                    i++;\n                }\n                break;\n            case \"flexible\":\n                // Fill in individual empty cell with interval timings\n                while (i < cellsArray.length) {\n                    if (isEmpty(cellsArray[i])) {\n                        cellsArray[i] = generateFallbackCell(i);\n                        i++;\n                    } else {\n                        i += cellsArray[i].cellLength;\n                    }\n                }\n                break;\n        }\n        return cellsArray.filter(\n            (slot) => !isEmpty(slot) && slot.cellLength > 0\n        );\n    }\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderWeek = () => {\n        return (\n            <HeaderCellWeekColumn>\n                {currentCalendarWeek.map((day, index) => (\n                    <HeaderCellWeek key={`week-day-${index}`}>\n                        <CellWeekText\n                            weight={\"semibold\"}\n                            $disabled={isDisabled(day)}\n                        >\n                            {dayjs(day).format(\"ddd\")}\n                        </CellWeekText>\n                    </HeaderCellWeek>\n                ))}\n            </HeaderCellWeekColumn>\n        );\n    };\n\n    const renderHeader = () => {\n        return (\n            <HeaderCellWeekColumn>\n                {currentCalendarWeek.map((day, dayIndex) => {\n                    const dayCellStyleProps = generateStyleProps(day);\n\n                    return (\n                        <DayCell\n                            key={`day-${dayIndex}`}\n                            date={day}\n                            calendarDate={dayjs(selectedDate)}\n                            onSelect={() => {\n                                handleDayClick(\n                                    day,\n                                    !dayCellStyleProps.interactive\n                                );\n                            }}\n                            onHover={handleDayHover}\n                            onHoverEnd={handleDayMouseout}\n                            {...dayCellStyleProps}\n                        ></DayCell>\n                    );\n                })}\n            </HeaderCellWeekColumn>\n        );\n    };\n\n    const renderTimeColumn = () => {\n        let hasSetFirstAfternoonHour = false;\n\n        const formatTime = (index: number) => {\n            const parsedTime = dayjs(minStartTime, \"HH:mm\").add(\n                index * 4 * interval,\n                \"minutes\"\n            );\n            const hour = parsedTime.format(\"h\");\n            const minutes = parsedTime.format(\"mm\");\n            const amPm = parsedTime.format(\"a\");\n\n            let formattedTime = `${hour}${\n                minutes !== \"00\" ? ` ${minutes}` : \"\"\n            }`;\n\n            if (\n                !hasSetFirstAfternoonHour &&\n                amPm === \"pm\" &&\n                minutes === \"00\"\n            ) {\n                formattedTime += ` ${amPm}`;\n                hasSetFirstAfternoonHour = true;\n            }\n\n            return formattedTime;\n        };\n\n        return (\n            <TimeColumn $height={height}>\n                {Array(Math.ceil(numberOfCells / 4))\n                    .fill(undefined)\n                    .map((_, index) => (\n                        <TimeColumnWrapper key={`time-${index}`}>\n                            <TimeColumnText>{formatTime(index)}</TimeColumnText>\n                        </TimeColumnWrapper>\n                    ))}\n            </TimeColumn>\n        );\n    };\n\n    const renderTimeSlotBarCells = () => {\n        return (\n            <Expandable style={expandableStyles}>\n                <ColumnWeekCell\n                    ref={cellsRef}\n                    key={`week-cell-${calendarDate.format(dateFormat)}`}\n                >\n                    {currentCalendarWeek.map((day, dayIndex) => {\n                        const formattedDate = day.format(dateFormat);\n                        const cellsArray =\n                            generatedDaySlots[formattedDate] ??\n                            Array(variant === \"flexible\" ? numberOfCells : 1)\n                                .fill(undefined)\n                                .map((_, index) =>\n                                    generateFallbackCell(\n                                        index,\n                                        variant === \"fixed\"\n                                            ? numberOfCells\n                                            : undefined\n                                    )\n                                );\n                        return (\n                            <TimeSlotWrapper key={`wrapper-${dayIndex}`}>\n                                {cellsArray.map((slot) => {\n                                    const {\n                                        id,\n                                        clickable = true,\n                                        styleAttributes,\n                                        cellLength,\n                                        halfFill,\n                                    } = slot;\n                                    const {\n                                        styleType = \"default\",\n                                        backgroundColor,\n                                        backgroundColor2,\n                                    } = styleAttributes;\n                                    return (\n                                        <TimeSlotComponent\n                                            $type=\"vertical\"\n                                            $variant=\"default\"\n                                            key={id}\n                                            $styleType={styleType}\n                                            $bgColor={backgroundColor}\n                                            $bgColor2={backgroundColor2}\n                                            $halfFill={halfFill}\n                                            $clickable={clickable}\n                                            $height={\n                                                variant === \"fixed\"\n                                                    ? cellLength * 12 +\n                                                      (cellLength - 1) * 4\n                                                    : 12\n                                            }\n                                            onClick={() =>\n                                                clickable &&\n                                                handleSlotClick(\n                                                    formattedDate,\n                                                    slot\n                                                )\n                                            }\n                                        ></TimeSlotComponent>\n                                    );\n                                })}\n                            </TimeSlotWrapper>\n                        );\n                    })}\n                </ColumnWeekCell>\n            </Expandable>\n        );\n    };\n\n    const renderCollapseExpandAll = () => {\n        if (\n            !maxVisibleCellHeight ||\n            !cellsRef.current ||\n            (actualHeight && actualHeight < maxVisibleCellHeight)\n        )\n            return;\n        return (\n            <CollapseExpandAllWrapper>\n                <CollapseExpandAllButton\n                    data-testid=\"time-bar-expand-collapse-button\"\n                    styleType=\"light\"\n                    onClick={handleExpandCollapseClick}\n                >\n                    <ChevronIcon $isExpanded={expandAll} />\n                    {`${expandAll ? \"Hide\" : \"Show\"} later times`}\n                </CollapseExpandAllButton>\n            </CollapseExpandAllWrapper>\n        );\n    };\n\n    return (\n        <Wrapper>\n            {renderHeader()}\n            {renderWeek()}\n            {renderTimeColumn()}\n            {renderTimeSlotBarCells()}\n            {renderCollapseExpandAll()}\n        </Wrapper>\n    );\n};\n"],"names":["TimeSlotBarWeekDays","calendarDate","disabledDates","selectedDate","onSelect","minDate","maxDate","startTime","endTime","maxVisibleCellHeight","slots","daySlots","interval","variant","enableSelection","onSlotClick","dateFormat","expandAll","setExpandAll","useState","hoverDay","setHoverDay","currentCalendarWeek","useMemo","CalendarHelper","generateDaysForCurrentWeek","flattenedSlots","Object","values","flat","minStartTime","_b","_a","minBy","maxEndTime","_d","_c","maxBy","numberOfCells","Math","ceil","DateHelper","getTimeDiffInMinutes","height","actualHeight","ref","cellsRef","useResizeDetector","expandableStyles","useSpring","generatedDaySlots","transformedDaySlots","entries","forEach","key","cellsArray","Array","fill","slot","startIndex","max","endIndex","min","cellLength","floor","assign","i","addMinutesToTime","halfFill","isEmpty","undefined","id","initializeAndFillSlots","reduce","result","obj","lastObj","length","generateFallbackCell","filter","populateEmptyCells","handleDayHover","value","handleDayMouseout","handleExpandCollapseClick","event","preventDefault","prevExpandValue","isDisabled","day","isWithinRange","dayjs","isDisabledDate","includes","format","prefix","toString","Date","getTime","clickable","styleAttributes","backgroundColor","V3_Colour","_jsxs","Wrapper","children","_jsx","HeaderCellWeekColumn","map","dayIndex","dayCellStyleProps","dateStartWithYear","disabled","isHoverEnabled","interactive","isHover","isSame","isSelected","labelType","circleLeft","circleRight","generateStyleProps","DayCell","date","handleDayClick","onHover","onHoverEnd","index","HeaderCellWeek","CellWeekText","weight","hasSetFirstAfternoonHour","formatTime","parsedTime","add","hour","minutes","amPm","formattedTime","TimeColumn","$height","_","TimeColumnWrapper","TimeColumnText","renderTimeColumn","Expandable","style","ColumnWeekCell","formattedDate","TimeSlotWrapper","styleType","backgroundColor2","TimeSlotComponent","$type","$variant","$bgColor","$bgColor2","$clickable","onClick","handleSlotClick","current","CollapseExpandAllWrapper","CollapseExpandAllButton","ChevronIcon","$isExpanded","renderCollapseExpandAll"],"mappings":"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"}
+{"version":3,"file":"time-slot-bar-week-days.js","sources":["../../src/time-slot-bar-week/time-slot-bar-week-days.tsx"],"sourcesContent":["import { useSpring } from \"@react-spring/web\";\nimport type { Dayjs } from \"dayjs\";\nimport dayjs from \"dayjs\";\nimport isEmpty from \"lodash/isEmpty\";\nimport maxBy from \"lodash/maxBy\";\nimport minBy from \"lodash/minBy\";\nimport type React from \"react\";\nimport { useMemo, useRef, useState } from \"react\";\nimport { useResizeDetector } from \"react-resize-detector\";\n\nimport { inertValue, VisuallyHidden } from \"../shared/accessibility\";\nimport type { InternalCalendarProps } from \"../shared/internal-calendar\";\nimport type { CellStyleProps } from \"../shared/internal-calendar/day-cell\";\nimport { DayCell } from \"../shared/internal-calendar/day-cell\";\nimport { Colour } from \"../theme\";\nimport type { TimeSlot } from \"../time-slot-bar/types\";\nimport { DateHelper } from \"../util\";\nimport { CalendarHelper } from \"../util/calendar-helper\";\nimport { StringHelper } from \"../util/string-helper\";\nimport { TimeHelper } from \"../util/time-helper\";\nimport {\n    CellWeekText,\n    ChevronIcon,\n    CollapseExpandAllButton,\n    CollapseExpandAllWrapper,\n    ColumnWeekCell,\n    Expandable,\n    GridWrapper,\n    HeaderCellWeek,\n    HeaderCellWeekColumn,\n    TimeColumn,\n    TimeColumnText,\n    TimeColumnWrapper,\n    TimeSlotComponent,\n    TimeSlotWrapper,\n    Wrapper,\n} from \"./time-slot-bar-week-days.style\";\nimport type { TimeSlotCellsVariant } from \"./types\";\n\ninterface TimeSlotWeekDaysProps\n    extends Pick<\n        InternalCalendarProps,\n        \"disabledDates\" | \"minDate\" | \"maxDate\"\n    > {\n    selectedDate: string | undefined;\n    calendarDate: Dayjs;\n    onSelect: (value: Dayjs) => void;\n    slots: { [date: string]: TimeSlot[] };\n    startTime?: string | undefined;\n    endTime?: string | undefined;\n    maxVisibleCellHeight?: number | undefined;\n    interval?: number | undefined;\n    variant?: TimeSlotCellsVariant | undefined;\n    enableSelection?: boolean | undefined;\n    onSlotClick?: ((date: string, timeSlot: TimeSlot) => void) | undefined;\n}\n\ninterface TimeSlotCell extends TimeSlot {\n    cellLength: number;\n    halfFill?: \"top\" | \"bottom\" | undefined;\n    isActualSlot?: boolean | undefined;\n    rowIndex?: number | undefined;\n}\n\ninterface FocusableSlotMeta {\n    key: string;\n    date: string;\n    rowIndex: number;\n}\n\nconst SLOT_HEIGHT = 12; // px\nconst SLOT_GAP = 4; // px\nconst ROW_HEIGHT = SLOT_HEIGHT + SLOT_GAP;\n\nexport const TimeSlotBarWeekDays = ({\n    calendarDate,\n    disabledDates,\n    selectedDate,\n    onSelect,\n    minDate,\n    maxDate,\n    startTime,\n    endTime,\n    maxVisibleCellHeight,\n    slots: daySlots,\n    interval = 30,\n    variant = \"flexible\",\n    enableSelection = true,\n    onSlotClick,\n}: TimeSlotWeekDaysProps) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const dateFormat = \"YYYY-MM-DD\";\n    const [expandAll, setExpandAll] = useState<boolean>(false);\n    const [hoverDay, setHoverDay] = useState<Dayjs>();\n    const slotButtonRefs = useRef<Record<string, HTMLButtonElement | null>>({});\n    const currentCalendarWeek = useMemo((): Dayjs[] => {\n        return CalendarHelper.generateDaysForCurrentWeek(calendarDate);\n    }, [calendarDate]);\n\n    const flattenedSlots = Object.values(daySlots ?? {}).flat();\n    const minStartTime =\n        startTime ?? minBy(flattenedSlots, \"startTime\")?.startTime ?? \"00:00\";\n    const maxEndTime =\n        endTime ?? maxBy(flattenedSlots, \"endTime\")?.endTime ?? \"24:00\";\n    const numberOfCells = Math.ceil(\n        DateHelper.getTimeDiffInMinutes(minStartTime, maxEndTime) / interval\n    );\n\n    // React spring animation configuration\n    const { height: actualHeight = 0, ref: cellsRef } = useResizeDetector();\n    const hasCollapsedContent =\n        !!maxVisibleCellHeight && actualHeight > maxVisibleCellHeight;\n    const visibleRowCount =\n        maxVisibleCellHeight !== undefined\n            ? Math.max(\n                  1,\n                  Math.floor((maxVisibleCellHeight + SLOT_GAP) / ROW_HEIGHT)\n              )\n            : 0;\n    const collapsedHeight =\n        visibleRowCount > 0\n            ? visibleRowCount * ROW_HEIGHT - SLOT_GAP\n            : maxVisibleCellHeight;\n    const height = maxVisibleCellHeight\n        ? !hasCollapsedContent || expandAll\n            ? actualHeight\n            : collapsedHeight\n        : actualHeight;\n    const expandableStyles = useSpring({ height });\n\n    const generatedDaySlots = useMemo((): {\n        [date: string]: TimeSlotCell[];\n    } => {\n        if (daySlots) {\n            const transformedDaySlots: Record<string, TimeSlotCell[]> = {};\n            Object.entries(daySlots).forEach(([key, slots]) => {\n                const cellsArray = initializeAndFillSlots(slots);\n                transformedDaySlots[key] = populateEmptyCells(cellsArray);\n            });\n            return transformedDaySlots;\n        }\n        return {};\n    }, [daySlots]);\n\n    const focusableSlotsByDate = useMemo(() => {\n        return currentCalendarWeek.reduce<Record<string, FocusableSlotMeta[]>>(\n            (result, day) => {\n                const formattedDate = day.format(dateFormat);\n\n                result[formattedDate] = getCellsForDate(formattedDate)\n                    .filter(\n                        (\n                            slot\n                        ): slot is TimeSlotCell & {\n                            isActualSlot: true;\n                            rowIndex: number;\n                        } => !!slot.isActualSlot && slot.rowIndex !== undefined\n                    )\n                    .map((slot) => ({\n                        key: `${formattedDate}-${slot.id}`,\n                        date: formattedDate,\n                        rowIndex: slot.rowIndex,\n                    }))\n                    .sort((a, b) => a.rowIndex - b.rowIndex);\n\n                return result;\n            },\n            {}\n        );\n    }, [currentCalendarWeek, generatedDaySlots]);\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleDayClick = (value: Dayjs, isDisabled: boolean) => {\n        if (isDisabled || !enableSelection) return;\n\n        onSelect(value);\n    };\n\n    const handleDayHover = (value: Dayjs) => {\n        setHoverDay(value);\n    };\n\n    const handleDayHoverClear = () => {\n        setHoverDay(undefined);\n    };\n\n    const handleSlotClick = (date: string, slot: TimeSlot) => {\n        onSlotClick?.(date, slot);\n    };\n\n    const handleSlotButtonClick =\n        (date: string, slot: TimeSlot) =>\n        (event: React.MouseEvent<HTMLButtonElement>) => {\n            event.stopPropagation();\n\n            handleSlotClick(date, slot);\n        };\n\n    const handleExpandCollapseClick = (event: React.MouseEvent) => {\n        event.preventDefault();\n        setExpandAll((prevExpandValue) => !prevExpandValue);\n    };\n\n    const handleSlotKeyDown = (\n        event: React.KeyboardEvent<HTMLButtonElement>,\n        currentSlot: FocusableSlotMeta\n    ) => {\n        const sameColumnSlots = focusableSlotsByDate[currentSlot.date] ?? [];\n\n        const focusSlot = (slot?: FocusableSlotMeta) => {\n            if (!slot) return;\n            slotButtonRefs.current[slot.key]?.focus();\n        };\n\n        switch (event.key) {\n            case \"ArrowRight\":\n            case \"ArrowDown\": {\n                event.preventDefault();\n                const currentIndex = sameColumnSlots.findIndex(\n                    (slot) => slot.key === currentSlot.key\n                );\n                focusSlot(sameColumnSlots[currentIndex + 1]);\n                break;\n            }\n            case \"ArrowLeft\":\n            case \"ArrowUp\": {\n                event.preventDefault();\n                const currentIndex = sameColumnSlots.findIndex(\n                    (slot) => slot.key === currentSlot.key\n                );\n                focusSlot(sameColumnSlots[currentIndex - 1]);\n                break;\n            }\n            case \"Home\":\n                event.preventDefault();\n                focusSlot(sameColumnSlots[0]);\n                break;\n            case \"End\":\n                event.preventDefault();\n                focusSlot(sameColumnSlots[sameColumnSlots.length - 1]);\n                break;\n            case \"PageUp\":\n                event.preventDefault();\n                focusSlot(sameColumnSlots[0]);\n                break;\n            case \"PageDown\": {\n                event.preventDefault();\n                if (hasCollapsedContent && !expandAll) {\n                    setExpandAll(true);\n                    const lastVisibleSlot = [...sameColumnSlots]\n                        .reverse()\n                        .find((slot) => slot.rowIndex < visibleRowCount);\n                    focusSlot(lastVisibleSlot ?? sameColumnSlots[0]);\n                    break;\n                }\n\n                focusSlot(sameColumnSlots[sameColumnSlots.length - 1]);\n                break;\n            }\n            default:\n                break;\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        );\n\n        const isDisabledDate =\n            (disabledDates && disabledDates.includes(day.format(dateFormat))) ??\n            false;\n\n        return !isWithinRange || isDisabledDate;\n    };\n\n    const generateStyleProps = (day: Dayjs) => {\n        const dateStartWithYear = day.format(dateFormat);\n        const disabled = isDisabled(day);\n        const dayCellStyleProps: CellStyleProps = {};\n        const isHoverEnabled = enableSelection && !disabled;\n\n        if (disabled) {\n            dayCellStyleProps.disabled = true;\n        }\n\n        dayCellStyleProps.interactive = enableSelection\n            ? isHoverEnabled\n            : false;\n\n        const isHover =\n            isHoverEnabled && hoverDay && day.isSame(hoverDay, \"day\");\n        const isSelected = [selectedDate].includes(dateStartWithYear);\n\n        if (isSelected && isHover) {\n            dayCellStyleProps.labelType = \"selected-hover\";\n            dayCellStyleProps.circleLeft = \"selected-hover-outline\";\n            dayCellStyleProps.circleRight = \"selected-hover-outline\";\n        } else if (isSelected) {\n            dayCellStyleProps.labelType = \"selected\";\n            dayCellStyleProps.circleLeft = \"selected-outline\";\n            dayCellStyleProps.circleRight = \"selected-outline\";\n        } else if (isHover) {\n            dayCellStyleProps.labelType = \"hover\";\n            dayCellStyleProps.circleLeft = \"hover-subtle\";\n            dayCellStyleProps.circleRight = \"hover-subtle\";\n        }\n\n        return dayCellStyleProps;\n    };\n\n    function generateFallbackCell(\n        prefix: string | number,\n        cellLength = 1\n    ): TimeSlotCell {\n        return {\n            id: `${prefix.toString()}-${new Date().getTime()}`,\n            startTime: \"\",\n            endTime: \"\",\n            clickable: false,\n            isActualSlot: false,\n            styleAttributes: {\n                backgroundColor: Colour[\"bg-stronger\"],\n            },\n            cellLength,\n        };\n    }\n\n    function getSlotAriaLabel(date: string, slot: TimeSlot) {\n        const { startTime: slotStartTime, endTime: slotEndTime } = slot;\n\n        return StringHelper.joinNonEmptyStrings([\n            dayjs(date).format(\"D MMMM YYYY dddd\"),\n            slotStartTime && slotEndTime\n                ? TimeHelper.formatTimeRange(slotStartTime, slotEndTime)\n                : undefined,\n            slot.label,\n            slot.clickable ?? true ? \"Available\" : \"Unavailable\",\n        ]);\n    }\n\n    function initializeAndFillSlots(slots: TimeSlot[]): TimeSlotCell[] {\n        const cellsArray = Array(numberOfCells).fill({});\n\n        slots.forEach((slot) => {\n            const startIndex = Math.max(\n                0,\n                DateHelper.getTimeDiffInMinutes(minStartTime, slot.startTime) /\n                    interval\n            );\n            const endIndex = Math.min(\n                numberOfCells,\n                DateHelper.getTimeDiffInMinutes(minStartTime, slot.endTime) /\n                    interval\n            );\n            const cellLength = Math.ceil(endIndex) - Math.floor(startIndex);\n\n            switch (variant) {\n                case \"fixed\":\n                    // Keep fixed slots as 1 long cell\n                    cellsArray[Math.floor(startIndex)] = {\n                        ...slot,\n                        isActualSlot: true,\n                        rowIndex: Math.floor(startIndex),\n                        cellLength: endIndex - startIndex,\n                    };\n                    break;\n                case \"flexible\":\n                    // Split long slot into multiple cells of length 1\n                    for (let i = 0; i < cellLength; i++) {\n                        const startTime = DateHelper.addMinutesToTime(\n                            minStartTime,\n                            Math.floor(startIndex + i) * interval\n                        );\n                        const endTime = DateHelper.addMinutesToTime(\n                            startTime,\n                            interval\n                        );\n\n                        let halfFill: string | undefined;\n\n                        if (!isEmpty(cellsArray[Math.floor(startIndex + i)])) {\n                            // Previous cell extends into current cell, fill entire cell\n                            halfFill = undefined;\n                        } else if (i === 0 && startIndex % 1 !== 0) {\n                            halfFill = \"top\";\n                        } else if (i === cellLength - 1 && endIndex % 1 !== 0) {\n                            halfFill = \"bottom\";\n                        }\n\n                        cellsArray[Math.floor(startIndex + i)] = {\n                            ...slot,\n                            id: `${slot.id}-${i}`,\n                            startTime,\n                            endTime,\n                            isActualSlot: true,\n                            rowIndex: Math.floor(startIndex + i),\n                            cellLength: 1,\n                            halfFill,\n                        };\n                    }\n                    break;\n            }\n        });\n        return cellsArray;\n    }\n\n    function populateEmptyCells(cellsArray: any[]): TimeSlotCell[] {\n        let i = 0;\n        switch (variant) {\n            case \"fixed\":\n                // Truncate consecutive empty cells into 1 [{},{},{...},{},{}] -> [{},{...},{}]\n                cellsArray = cellsArray.reduce(\n                    (result, obj) => {\n                        const lastObj =\n                            result.length > 0\n                                ? result[result.length - 1]\n                                : result[0];\n                        if (isEmpty(obj) && isEmpty(lastObj)) {\n                            return result;\n                        }\n                        return [...result, obj];\n                    },\n                    [{}]\n                );\n\n                // Fill in empty cells with timings & corresponding cell lengths\n                while (i < cellsArray.length) {\n                    if (isEmpty(cellsArray[i])) {\n                        const startTime =\n                            cellsArray[i - 1]?.endTime ?? minStartTime;\n                        const endTime =\n                            cellsArray[i + 1]?.startTime ?? maxEndTime;\n                        if (startTime !== endTime) {\n                            const cellLength =\n                                DateHelper.getTimeDiffInMinutes(\n                                    startTime,\n                                    endTime\n                                ) / interval;\n                            cellsArray[i] = {\n                                ...generateFallbackCell(i),\n                                startTime,\n                                endTime,\n                                cellLength,\n                            };\n                        }\n                    }\n                    i++;\n                }\n                break;\n            case \"flexible\":\n                // Fill in individual empty cell with interval timings\n                while (i < cellsArray.length) {\n                    if (isEmpty(cellsArray[i])) {\n                        cellsArray[i] = generateFallbackCell(i);\n                        i++;\n                    } else {\n                        i += cellsArray[i].cellLength;\n                    }\n                }\n                break;\n        }\n        return cellsArray.filter(\n            (slot) => !isEmpty(slot) && slot.cellLength > 0\n        );\n    }\n\n    function getCellsForDate(formattedDate: string) {\n        return (\n            generatedDaySlots[formattedDate] ??\n            Array(variant === \"flexible\" ? numberOfCells : 1)\n                .fill(undefined)\n                .map((_, index) =>\n                    generateFallbackCell(\n                        index,\n                        variant === \"fixed\" ? numberOfCells : undefined\n                    )\n                )\n        );\n    }\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderWeek = () => {\n        return (\n            <HeaderCellWeekColumn role=\"row\">\n                {currentCalendarWeek.map((day, index) => (\n                    <HeaderCellWeek key={`week-day-${index}`} role=\"gridcell\">\n                        <CellWeekText\n                            weight={\"semibold\"}\n                            $disabled={isDisabled(day)}\n                        >\n                            {dayjs(day).format(\"ddd\")}\n                        </CellWeekText>\n                    </HeaderCellWeek>\n                ))}\n            </HeaderCellWeekColumn>\n        );\n    };\n\n    const renderHeader = () => {\n        return (\n            <HeaderCellWeekColumn role=\"row\" onBlur={handleDayHoverClear}>\n                {currentCalendarWeek.map((day, dayIndex) => {\n                    const dayCellStyleProps = generateStyleProps(day);\n\n                    return (\n                        <DayCell\n                            key={`day-${dayIndex}`}\n                            date={day}\n                            calendarDate={dayjs(selectedDate)}\n                            role=\"columnheader\"\n                            tabIndex={dayCellStyleProps.interactive ? 0 : -1}\n                            onSelect={() => {\n                                handleDayClick(\n                                    day,\n                                    !dayCellStyleProps.interactive\n                                );\n                            }}\n                            onHover={handleDayHover}\n                            onHoverEnd={handleDayHoverClear}\n                            onFocus={handleDayHover}\n                            {...dayCellStyleProps}\n                        ></DayCell>\n                    );\n                })}\n            </HeaderCellWeekColumn>\n        );\n    };\n\n    const renderTimeColumn = () => {\n        let hasSetFirstAfternoonHour = false;\n\n        const formatTime = (index: number) => {\n            const parsedTime = dayjs(minStartTime, \"HH:mm\").add(\n                index * 4 * interval,\n                \"minutes\"\n            );\n            const hour = parsedTime.format(\"h\");\n            const minutes = parsedTime.format(\"mm\");\n            const amPm = parsedTime.format(\"a\");\n\n            let formattedTime = `${hour}${\n                minutes !== \"00\" ? ` ${minutes}` : \"\"\n            }`;\n\n            if (\n                !hasSetFirstAfternoonHour &&\n                amPm === \"pm\" &&\n                minutes === \"00\"\n            ) {\n                formattedTime += ` ${amPm}`;\n                hasSetFirstAfternoonHour = true;\n            }\n\n            return formattedTime;\n        };\n\n        return (\n            <TimeColumn $height={height} aria-hidden>\n                {Array(Math.ceil(numberOfCells / 4))\n                    .fill(undefined)\n                    .map((_, index) => (\n                        <TimeColumnWrapper key={`time-${index}`}>\n                            <TimeColumnText>{formatTime(index)}</TimeColumnText>\n                        </TimeColumnWrapper>\n                    ))}\n            </TimeColumn>\n        );\n    };\n    const renderSlotCell = (formattedDate: string, slot: TimeSlotCell) => {\n        const {\n            id,\n            clickable = true,\n            isActualSlot,\n            styleAttributes,\n            cellLength,\n            halfFill,\n        } = slot;\n        const {\n            styleType = \"default\",\n            backgroundColor,\n            backgroundColor2,\n        } = styleAttributes;\n        const slotId = `${formattedDate}-${id}`;\n        const isCollapsedSlot =\n            hasCollapsedContent &&\n            !expandAll &&\n            (slot.rowIndex ?? 0) >= visibleRowCount;\n\n        return (\n            <TimeSlotComponent\n                key={id}\n                styleType={styleType}\n                bgColor={backgroundColor}\n                bgColor2={backgroundColor2}\n                clickable={clickable}\n                $halfFill={halfFill}\n                $height={\n                    variant === \"fixed\"\n                        ? cellLength * SLOT_HEIGHT + (cellLength - 1) * SLOT_GAP\n                        : SLOT_HEIGHT\n                }\n                onClick={() =>\n                    clickable && handleSlotClick(formattedDate, slot)\n                }\n            >\n                {isActualSlot && (\n                    <VisuallyHidden inert={inertValue(isCollapsedSlot)}>\n                        <button\n                            type=\"button\"\n                            ref={(element) => {\n                                slotButtonRefs.current[slotId] = element;\n                            }}\n                            aria-disabled={!clickable}\n                            aria-label={getSlotAriaLabel(formattedDate, slot)}\n                            onKeyDown={(event) =>\n                                handleSlotKeyDown(event, {\n                                    key: slotId,\n                                    date: formattedDate,\n                                    rowIndex: slot.rowIndex ?? 0,\n                                })\n                            }\n                            onClick={\n                                clickable\n                                    ? handleSlotButtonClick(formattedDate, slot)\n                                    : undefined\n                            }\n                        />\n                    </VisuallyHidden>\n                )}\n            </TimeSlotComponent>\n        );\n    };\n\n    const renderTimeSlotBarCells = () => {\n        return (\n            <Expandable style={expandableStyles} role=\"row\">\n                <ColumnWeekCell\n                    ref={cellsRef}\n                    key={`week-cell-${calendarDate.format(dateFormat)}`}\n                >\n                    {currentCalendarWeek.map((day, dayIndex) => {\n                        const formattedDate = day.format(dateFormat);\n                        const cellsArray = getCellsForDate(formattedDate);\n                        return (\n                            <TimeSlotWrapper\n                                key={`wrapper-${dayIndex}`}\n                                role=\"gridcell\"\n                            >\n                                {cellsArray.map((slot) =>\n                                    renderSlotCell(formattedDate, slot)\n                                )}\n                            </TimeSlotWrapper>\n                        );\n                    })}\n                </ColumnWeekCell>\n            </Expandable>\n        );\n    };\n\n    const renderCollapseExpandAll = () => {\n        if (!maxVisibleCellHeight || !cellsRef.current) return;\n        return (\n            <CollapseExpandAllWrapper>\n                <CollapseExpandAllButton\n                    data-testid=\"time-bar-expand-collapse-button\"\n                    styleType=\"light\"\n                    aria-expanded={expandAll}\n                    onClick={handleExpandCollapseClick}\n                >\n                    <ChevronIcon $isExpanded={expandAll} />\n                    {`${expandAll ? \"Hide\" : \"Show\"} later times`}\n                </CollapseExpandAllButton>\n            </CollapseExpandAllWrapper>\n        );\n    };\n\n    return (\n        <Wrapper>\n            <GridWrapper role=\"grid\">\n                {renderHeader()}\n                {renderWeek()}\n                {renderTimeColumn()}\n                {renderTimeSlotBarCells()}\n            </GridWrapper>\n            {renderCollapseExpandAll()}\n        </Wrapper>\n    );\n};\n"],"names":["TimeSlotBarWeekDays","calendarDate","disabledDates","selectedDate","onSelect","minDate","maxDate","startTime","endTime","maxVisibleCellHeight","slots","daySlots","interval","variant","enableSelection","onSlotClick","dateFormat","expandAll","setExpandAll","useState","hoverDay","setHoverDay","slotButtonRefs","useRef","currentCalendarWeek","useMemo","CalendarHelper","generateDaysForCurrentWeek","flattenedSlots","Object","values","flat","minStartTime","_b","_a","minBy","maxEndTime","_d","_c","maxBy","numberOfCells","Math","ceil","DateHelper","getTimeDiffInMinutes","height","actualHeight","ref","cellsRef","useResizeDetector","hasCollapsedContent","visibleRowCount","undefined","max","floor","SLOT_HEIGHT","expandableStyles","useSpring","generatedDaySlots","transformedDaySlots","entries","forEach","key","cellsArray","Array","fill","slot","startIndex","endIndex","min","cellLength","assign","isActualSlot","rowIndex","i","addMinutesToTime","halfFill","isEmpty","id","initializeAndFillSlots","reduce","result","obj","lastObj","length","generateFallbackCell","filter","populateEmptyCells","focusableSlotsByDate","day","formattedDate","format","getCellsForDate","map","date","sort","a","b","handleDayHover","value","handleDayHoverClear","handleSlotClick","handleSlotButtonClick","event","stopPropagation","handleExpandCollapseClick","preventDefault","prevExpandValue","isDisabled","isWithinRange","dayjs","isDisabledDate","includes","prefix","toString","Date","getTime","clickable","styleAttributes","backgroundColor","Colour","getSlotAriaLabel","slotStartTime","slotEndTime","StringHelper","joinNonEmptyStrings","TimeHelper","formatTimeRange","label","_","index","renderSlotCell","styleType","backgroundColor2","slotId","isCollapsedSlot","_jsx","TimeSlotComponent","bgColor","bgColor2","$height","onClick","children","VisuallyHidden","inert","inertValue","type","element","current","onKeyDown","currentSlot","sameColumnSlots","focusSlot","focus","currentIndex","findIndex","lastVisibleSlot","reverse","find","handleSlotKeyDown","_jsxs","Wrapper","GridWrapper","role","HeaderCellWeekColumn","onBlur","dayIndex","dayCellStyleProps","dateStartWithYear","disabled","isHoverEnabled","interactive","isHover","isSame","isSelected","labelType","circleLeft","circleRight","generateStyleProps","DayCell","tabIndex","handleDayClick","onHover","onHoverEnd","onFocus","HeaderCellWeek","CellWeekText","weight","$disabled","hasSetFirstAfternoonHour","formatTime","parsedTime","add","hour","minutes","amPm","formattedTime","TimeColumn","TimeColumnWrapper","TimeColumnText","renderTimeColumn","Expandable","style","ColumnWeekCell","TimeSlotWrapper","CollapseExpandAllWrapper","CollapseExpandAllButton","ChevronIcon","renderCollapseExpandAll"],"mappings":"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"}

package/time-slot-bar-week/time-slot-bar-week-days.style.d.ts

@@ -1,5 +1,4 @@
-import type { TimeSlotStyleProps } from "../time-slot-bar/time-slot-bar.styles";
-interface TimeSlotCellProps extends TimeSlotStyleProps {
+interface TimeSlotCellProps {
     $height: number;
     $halfFill?: "top" | "bottom";
 }
@@ -12,27 +11,44 @@ interface CellWeekTextStyleProps {
 interface ChevronIconStyleProps {
     $isExpanded?: boolean;
 }
-export declare const HeaderCellWeek: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const CellWeekText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("..").TypographyProps & {
-    ref?: import("react").RefObject<HTMLParagraphElement> | undefined;
-}, CellWeekTextStyleProps>> & string;
-export declare const HeaderCellWeekColumn: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const Wrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const Expandable: import("@react-spring/web").AnimatedComponent<import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string>;
-export declare const ColumnWeekCell: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const TimeColumn: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, TimeColumnStyleProps>> & string;
-export declare const TimeColumnWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const TimeColumnText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const TimeSlotWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const CollapseExpandAllWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const CollapseExpandAllButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("..").ButtonProps & import("react").RefAttributes<HTMLButtonElement>, never>> & string & Omit<(props: import("..").ButtonProps & import("react").RefAttributes<HTMLButtonElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
-export declare const ChevronIcon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<import("react").SVGProps<SVGSVGElement>, "ref"> & {
+export declare const HeaderCellWeek: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const CellWeekText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<Omit<any, "ref"> & {
+    weight?: import("..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, "$disabled"> & CellWeekTextStyleProps, never> & Partial<Pick<import("styled-components").FastOmit<Omit<any, "ref"> & {
+    weight?: import("..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, "$disabled"> & CellWeekTextStyleProps, never>>> & string & Omit<(props: Omit<any, "ref"> & {
+    weight?: import("..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
+export declare const HeaderCellWeekColumn: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const Wrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const GridWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const Expandable: import("@react-spring/web").AnimatedComponent<import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string>;
+export declare const ColumnWeekCell: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const TimeColumn: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$height"> & TimeColumnStyleProps, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$height"> & TimeColumnStyleProps, never>>> & string;
+export declare const TimeColumnWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const TimeColumnText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const TimeSlotWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const CollapseExpandAllWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const CollapseExpandAllButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("..").ButtonProps & import("react").RefAttributes<HTMLButtonElement>, never> & Partial<Pick<import("..").ButtonProps & import("react").RefAttributes<HTMLButtonElement>, never>>> & string & Omit<(props: import("..").ButtonProps & import("react").RefAttributes<HTMLButtonElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
+export declare const ChevronIcon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<Omit<import("react").SVGProps<SVGSVGElement>, "ref"> & {
     ref?: ((instance: SVGSVGElement | null) => void) | import("react").RefObject<SVGSVGElement> | null | undefined;
-}, ChevronIconStyleProps>> & string & Omit<{
+}, "$isExpanded"> & ChevronIconStyleProps, never> & Partial<Pick<import("styled-components").FastOmit<Omit<import("react").SVGProps<SVGSVGElement>, "ref"> & {
+    ref?: ((instance: SVGSVGElement | null) => void) | import("react").RefObject<SVGSVGElement> | null | undefined;
+}, "$isExpanded"> & ChevronIconStyleProps, never>>> & string & Omit<{
     (props: import("react").SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 }, keyof import("react").Component<any, {}, any>>;
-export declare const TimeSlotComponent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof TimeSlotStyleProps> & TimeSlotStyleProps, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, TimeSlotCellProps>> & string;
+export declare const TimeSlotComponent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("../shared/time-slot").TimeSlotProps & import("react").RefAttributes<HTMLDivElement>, keyof TimeSlotCellProps> & TimeSlotCellProps, never> & Partial<Pick<import("styled-components").FastOmit<import("../shared/time-slot").TimeSlotProps & import("react").RefAttributes<HTMLDivElement>, keyof TimeSlotCellProps> & TimeSlotCellProps, never>>> & string & Omit<(props: import("../shared/time-slot").TimeSlotProps & import("react").RefAttributes<HTMLDivElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
 export {};