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

package/schedule/schedule-week-view/time-cell.styles.js

@@ -1,35 +1,2 @@
-import e,{css as t}from"styled-components";import{V3_Border as o,V3_Colour as i,V3_Font as r,V3_Radius as n,V3_Shadow as s}from"../../v3_theme/index.js";import{CELL_HEIGHT as d}from"../const.js";const h=e.div`
-    min-height: ${d}px;
-    position: relative;
-    border-bottom: ${o["width-010"]} solid ${i.border};
-    ${e=>e.$dashed&&t`
-            border-bottom-style: dashed;
-        `}
-    cursor: pointer;
-`,$=e.div`
-    position: absolute;
-    top: 0;
-    left: ${e=>`calc((100% - 14px) * ${e.$leftPosition} / 100)`};
-    width: ${e=>`calc((100% - 14px) * ${e.$actualWidthPercentage} / 100)`};
-    height: 100%;
-    display: flex;
-    flex-direction: column;
-    overflow: visible;
-    z-index: 1;
-`,c=e.button`
-    background-color: unset;
-    border: none;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    cursor: pointer;
-    color: ${i["text-primary"]};
-    ${r["body-xs-semibold"]};
-    min-height: ${e=>e.$heightPercentage?`${e.$heightPercentage}%`:`${d}px`};
-    height: ${e=>e.$heightPercentage?`${e.$heightPercentage}%`:"auto"};
-    &:hover {
-        border-radius: ${n.sm};
-        box-shadow: ${s["sm-subtle"]};
-    }
-`;export{c as HiddenColumns,h as SlotCell,$ as SlotColumnOverlay};
+import"./time-cell.styles_1sorjz8.css";const e={slotContentContainer:{height:"--fds-internal-scheduleWeekView-slotContentContainer-height",offsetTop:"--fds-internal-scheduleWeekView-slotContentContainer-offsetTop"},slotColumnOverlay:{leftPosition:"--fds-internal-scheduleWeekView-slotColumnOverlay-leftPosition",actualWidthPercentage:"--fds-internal-scheduleWeekView-slotColumnOverlay-actualWidthPercentage"},hiddenColumns:{minHeight:"--fds-internal-scheduleWeekView-hiddenColumns-minHeight",height:"--fds-internal-scheduleWeekView-hiddenColumns-height"}},t="s1o4jdyi",n="s15inga4",s="s25hl9",i="s14imce",l="s1ndukd1",o="stpthki",h="s16rvke",d="s1dqpjs9",a="h1h4fvzf";export{a as hiddenColumns,l as slotAvailability,o as slotCell,h as slotCellDashed,d as slotColumnOverlay,t as slotContentContainer,n as slotContentContainerAvailable,s as slotContentContainerBlocked,i as slotServiceName,e as tokens};
 //# sourceMappingURL=time-cell.styles.js.map

package/schedule/schedule-week-view/time-cell.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"time-cell.styles.js","sources":["../../../src/schedule/schedule-week-view/time-cell.styles.tsx"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nimport {\n    V3_Border,\n    V3_Colour,\n    V3_Font,\n    V3_Radius,\n    V3_Shadow,\n} from \"../../v3_theme\";\nimport { CELL_HEIGHT } from \"../const\";\n\n// =============================================================================\n// STYLE INTERFACES\n// =============================================================================\ninterface SlotCellStyleProps {\n    $dashed?: boolean;\n}\n\ninterface SlotColumnOverlayStyleProps {\n    $actualWidthPercentage?: number;\n    $leftPosition?: number;\n}\n\ninterface HiddenColumnsStyleProps {\n    $heightPercentage?: number;\n}\n\n// =============================================================================\n// STYLING\n// =============================================================================\nexport const SlotCell = styled.div<SlotCellStyleProps>`\n    min-height: ${CELL_HEIGHT}px;\n    position: relative;\n    border-bottom: ${V3_Border[\"width-010\"]} solid ${V3_Colour[\"border\"]};\n    ${(props) =>\n        props.$dashed &&\n        css`\n            border-bottom-style: dashed;\n        `}\n    cursor: pointer;\n`;\n\nexport const SlotColumnOverlay = styled.div<SlotColumnOverlayStyleProps>`\n    position: absolute;\n    top: 0;\n    left: ${(props) => {\n        return `calc((100% - 14px) * ${props.$leftPosition} / 100)`;\n    }};\n    width: ${(props) => {\n        return `calc((100% - 14px) * ${props.$actualWidthPercentage} / 100)`;\n    }};\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n    overflow: visible;\n    z-index: 1;\n`;\n\nexport const HiddenColumns = styled.button<HiddenColumnsStyleProps>`\n    background-color: unset;\n    border: none;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    cursor: pointer;\n    color: ${V3_Colour[\"text-primary\"]};\n    ${V3_Font[\"body-xs-semibold\"]};\n    min-height: ${(props) =>\n        props.$heightPercentage\n            ? `${props.$heightPercentage}%`\n            : `${CELL_HEIGHT}px`};\n    height: ${(props) =>\n        props.$heightPercentage ? `${props.$heightPercentage}%` : \"auto\"};\n    &:hover {\n        border-radius: ${V3_Radius[\"sm\"]};\n        box-shadow: ${V3_Shadow[\"sm-subtle\"]};\n    }\n`;\n"],"names":["SlotCell","styled","div","CELL_HEIGHT","V3_Border","V3_Colour","props","$dashed","css","SlotColumnOverlay","$leftPosition","$actualWidthPercentage","HiddenColumns","button","V3_Font","$heightPercentage","V3_Radius","V3_Shadow"],"mappings":"mMA8BO,MAAMA,EAAWC,EAAOC,GAAuB;kBACpCC;;qBAEGC,EAAU,sBAAsBC,EAAkB;MAChEC,GACCA,EAAMC,SACNC,CAAG;;;;EAMEC,EAAoBR,EAAOC,GAAgC;;;YAG3DI,GACE,wBAAwBA,EAAMI;aAE/BJ,GACC,wBAAwBA,EAAMK;;;;;;EAShCC,EAAgBX,EAAOY,MAA+B;;;;;;;aAOtDR,EAAU;MACjBS,EAAQ;kBACKR,GACXA,EAAMS,kBACA,GAAGT,EAAMS,qBACT,GAAGZ;cACFG,GACPA,EAAMS,kBAAoB,GAAGT,EAAMS,qBAAuB;;yBAEzCC,EAAc;sBACjBC,EAAU;;"}
+{"version":3,"file":"time-cell.styles.js","sources":["../../../src/schedule/schedule-week-view/time-cell.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, Colour, Font, Radius, Shadow } from \"../../theme\";\nimport { CELL_HEIGHT } from \"../const\";\n\n// =============================================================================\n// STYLING\n// =============================================================================\nexport const tokens = {\n    slotContentContainer: {\n        height: \"--fds-internal-scheduleWeekView-slotContentContainer-height\",\n        offsetTop:\n            \"--fds-internal-scheduleWeekView-slotContentContainer-offsetTop\",\n    },\n    slotColumnOverlay: {\n        leftPosition:\n            \"--fds-internal-scheduleWeekView-slotColumnOverlay-leftPosition\",\n        actualWidthPercentage:\n            \"--fds-internal-scheduleWeekView-slotColumnOverlay-actualWidthPercentage\",\n    },\n    hiddenColumns: {\n        minHeight: \"--fds-internal-scheduleWeekView-hiddenColumns-minHeight\",\n        height: \"--fds-internal-scheduleWeekView-hiddenColumns-height\",\n    },\n};\n\nexport const slotContentContainer = css`\n    ${tokens.slotContentContainer.height}: ${CELL_HEIGHT - 1}px;\n    ${tokens.slotContentContainer.offsetTop}: 0px;\n\n    overflow: hidden;\n    width: calc(100% - 1px);\n    padding: 4px;\n    top: var(${tokens.slotContentContainer.offsetTop});\n    ${Font[\"body-xs-semibold\"]};\n    z-index: 1;\n    height: var(${tokens.slotContentContainer.height});\n    display: flex;\n    flex-direction: column;\n    position: absolute;\n    border-radius: ${Radius[\"sm\"]};\n    color: inherit;\n`;\n\nexport const slotContentContainerAvailable = css`\n    border-left: ${Border[\"width-040\"]} solid ${Colour[\"icon-success\"]};\n`;\n\nexport const slotContentContainerBlocked = css`\n    color: ${Colour[\"text-inverse\"]};\n`;\n\nexport const slotServiceName = css`\n    ${Font[\"body-xs-regular\"]};\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    width: 100%;\n`;\n\nexport const slotAvailability = css`\n    ${Font[\"body-xs-semibold\"]};\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    width: 100%;\n`;\n\nexport const slotCell = css`\n    min-height: ${CELL_HEIGHT}px;\n    position: relative;\n    border-bottom: ${Border[\"width-010\"]} solid ${Colour[\"border\"]};\n    cursor: pointer;\n`;\n\nexport const slotCellDashed = css`\n    border-bottom-style: dashed;\n`;\n\nexport const slotColumnOverlay = css`\n    ${tokens.slotColumnOverlay.leftPosition}: 0;\n    ${tokens.slotColumnOverlay.actualWidthPercentage}: 100;\n    position: absolute;\n    top: 0;\n    left: calc(\n        (100% - 14px) * var(${tokens.slotColumnOverlay.leftPosition}) / 100\n    );\n    width: calc(\n        (100% - 14px) * var(${tokens.slotColumnOverlay.actualWidthPercentage}) /\n            100\n    );\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n    overflow: visible;\n    z-index: 1;\n`;\n\nexport const hiddenColumns = css`\n    ${tokens.hiddenColumns.minHeight}: ${CELL_HEIGHT}px;\n    ${tokens.hiddenColumns.height}: auto;\n    background-color: unset;\n    border: none;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    cursor: pointer;\n    color: ${Colour[\"text-primary\"]};\n    ${Font[\"body-xs-semibold\"]};\n    min-height: var(${tokens.hiddenColumns.minHeight});\n    height: var(${tokens.hiddenColumns.height});\n    &:hover {\n        border-radius: ${Radius[\"sm\"]};\n        box-shadow: ${Shadow[\"sm-subtle\"]};\n    }\n`;\n"],"names":["tokens","slotContentContainer","height","offsetTop","slotColumnOverlay","leftPosition","actualWidthPercentage","hiddenColumns","minHeight","slotContentContainerAvailable","slotContentContainerBlocked","slotServiceName","slotAvailability","slotCell","slotCellDashed"],"mappings":"kFAQO,MAAMA,EAAS,CAClBC,qBAAsB,CAClBC,OAAQ,8DACRC,UACI,kEAERC,kBAAmB,CACfC,aACI,iEACJC,sBACI,2EAERC,cAAe,CACXC,UAAW,0DACXN,OAAQ,yDAIHD,EAAoB,WAkBpBQ,EAA6B,WAI7BC,EAA2B,SAI3BC,EAAe,UAQfC,EAAgB,WAQhBC,EAAQ,UAORC,EAAc,UAIdV,EAAiB,WAmBjBG,EAAa"}

package/schedule/schedule-week-view/time-cell.styles_1sorjz8.css

@@ -0,0 +1,14 @@
+.s1o4jdyi{--fds-internal-scheduleWeekView-slotContentContainer-height:47px;--fds-internal-scheduleWeekView-slotContentContainer-offsetTop:0px;overflow:hidden;width:calc(100% - 1px);padding:4px;top:var(--fds-internal-scheduleWeekView-slotContentContainer-offsetTop);font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-xs);font-weight:var(--fds-font-weight-semibold);line-height:var(--fds-font-body-lh-xs);letter-spacing:var(--fds-font-body-ls-xs);z-index:1;height:var(--fds-internal-scheduleWeekView-slotContentContainer-height);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;position:absolute;border-radius:var(--fds-radius-sm);color:inherit;}
+.s15inga4{border-left:var(--fds-border-width-040) solid var(--fds-colour-icon-success);}
+.s25hl9{color:var(--fds-colour-text-inverse);}
+.s14imce{font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-xs);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-xs);letter-spacing:var(--fds-font-body-ls-xs);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%;}
+.s1ndukd1{font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-xs);font-weight:var(--fds-font-weight-semibold);line-height:var(--fds-font-body-lh-xs);letter-spacing:var(--fds-font-body-ls-xs);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%;}
+.stpthki{min-height:48px;position:relative;border-bottom:var(--fds-border-width-010) solid var(--fds-colour-border);cursor:pointer;}
+.s16rvke{border-bottom-style:dashed;}
+.s1dqpjs9{--fds-internal-scheduleWeekView-slotColumnOverlay-leftPosition:0;--fds-internal-scheduleWeekView-slotColumnOverlay-actualWidthPercentage:100;position:absolute;top:0;left:calc(
+        (100% - 14px) * var(--fds-internal-scheduleWeekView-slotColumnOverlay-leftPosition) / 100
+    );width:calc(
+        (100% - 14px) * var(--fds-internal-scheduleWeekView-slotColumnOverlay-actualWidthPercentage) /
+            100
+    );height:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;overflow:visible;z-index:1;}
+.h1h4fvzf{--fds-internal-scheduleWeekView-hiddenColumns-minHeight:48px;--fds-internal-scheduleWeekView-hiddenColumns-height:auto;background-color:unset;border:none;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;cursor:pointer;color:var(--fds-colour-text-primary);font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-xs);font-weight:var(--fds-font-weight-semibold);line-height:var(--fds-font-body-lh-xs);letter-spacing:var(--fds-font-body-ls-xs);min-height:var(--fds-internal-scheduleWeekView-hiddenColumns-minHeight);height:var(--fds-internal-scheduleWeekView-hiddenColumns-height);}.h1h4fvzf:hover{border-radius:var(--fds-radius-sm);box-shadow:var(--fds-shadow-sm-subtle);}

package/schedule/schedule-week-view/types.d.ts

@@ -1,15 +1,7 @@
-import type { RefObject } from "react";
-import type { ScheduleEntityProps, ScheduleSlotProps } from "../types";
-export interface ScheduleWeekViewProps {
-    date: string;
+import type { CommonScheduleViewProps, ScheduleEntityProps, ScheduleSlotProps } from "../types";
+export interface ScheduleWeekViewProps extends CommonScheduleViewProps {
     serviceData: ScheduleEntityProps[];
-    loading: boolean;
-    minTime: string;
-    maxTime: string;
-    initialScrollTime?: string | undefined;
     onSlotClick?: (data: ScheduleSlotProps, e: React.MouseEvent) => void | undefined;
-    containerRef: RefObject<HTMLDivElement>;
-    blockedMessage?: string | undefined;
     onClickHiddenSlots?: (hiddenServices: string[]) => void | undefined;
 }
 /**
@@ -19,11 +11,6 @@ export interface ScheduleWeekViewProps {
 export interface SlotWithService extends ScheduleSlotProps {
     serviceName: string;
 }
-export interface PositionedSlot {
-    slot: SlotWithService;
-    column: number;
-    offsetTop: number;
-}
 interface SlotLayoutInfo {
     date: string;
     serviceName: string;

package/schedule/schedule-week-view/week-view-utils.js

@@ -1,2 +1,2 @@
-import{TimeHelper as e}from"../../util/time-helper.js";import"react";import{minutesToTime as t,findSlotsInTimeRange as s,findSlotsStartingInTimeRange as r}from"../shared/utils.js";const i=(e,t,s,i)=>{const n=[];return e.forEach((e=>{if(e.slots){r(e.slots,s,i,t).forEach((t=>{n.push(Object.assign(Object.assign({},t),{serviceName:e.name}))}))}})),n},n=(e,t,r,i)=>{const n=[];return e.forEach((e=>{if(e.slots){s(e.slots,r,i,t).forEach((t=>{n.push(Object.assign(Object.assign({},t),{serviceName:e.name}))}))}})),n},a=(s,r,i)=>{const a={};return r.forEach((r=>{const c=r.format("YYYY-MM-DD");i.forEach((r=>{const i=e.timeToMinutes(r),o=t(i+30),m=n(s,c,r,o);m.forEach((e=>{const t=e.id;a[t]||(a[t]={date:c,serviceName:e.serviceName,startTime:e.startTime,endTime:e.endTime,visible:!0,width:100})}));const h=Array.from(new Set(m.map((e=>e.serviceName)))).slice(0,3);m.forEach((e=>{const t=e.id;h.includes(e.serviceName)||(a[t].visible=!1)}));const l=m.filter((e=>{const t=e.id;return a[t].visible})),f=new Set(l.map((e=>e.serviceName))).size,v=m.length>l.length?4:f,d=v>0?100/v:100;m.forEach((e=>{const t=e.id;a[t].width=Math.min(a[t].width,d)}))}))})),a},c=(e,t)=>{let s=Number.MAX_SAFE_INTEGER;return e.forEach((e=>{const r=e.id,i=t[r];s=Math.min(s,i.width)})),s},o=(e,t)=>{const s=Array.from(new Set(e.map((e=>e.serviceName)))),r=Array.from(new Set(t.map((e=>e.serviceName))));return{allServices:[...s,...r],visibleServices:s,hiddenServices:r,totalServices:s.length+r.length,hasOverflow:r.length>0,totalColumns:r.length>0?4:s.length}};export{o as calculateCellServiceLayout,a as calculateSlotWidths,c as getMinimumWidthForCell,n as getSlotsInTimeCell,i as getSlotsStartingInTimeCell};
+import{TimeHelper as e}from"../../util/time-helper.js";import"react";import{minutesToTime as t,findSlotsInTimeRange as r,findSlotsStartingInTimeRange as i}from"../shared/utils.js";import"react/jsx-runtime";import"clsx";import"../../shared/time-slot/time-slot.js";import"../../theme/theme-provider/index.js";import"../../theme/theme-provider/context.js";import"../../theme/tokens/border.js";import"../../theme/tokens/colour.js";import"../../theme/tokens/font.js";import"../../theme/tokens/media-query.js";import"../../util/calendar-helper.js";import"../../external/dayjs/dayjs.min.js";import"../../util/simple-id-generator.js";import"../../util/string-helper.js";import"@react-aria/live-announcer";import"../../theme/utils/use-media-query.js";const s=(e,t,r,s)=>{const o=[];return e.forEach((e=>{if(e.slots){i(e.slots,r,s,t).forEach((t=>{o.push(Object.assign(Object.assign({},t),{serviceName:e.name}))}))}})),o},o=(e,t,i,s)=>{const o=[];return e.forEach((e=>{if(e.slots){r(e.slots,i,s,t).forEach((t=>{o.push(Object.assign(Object.assign({},t),{serviceName:e.name}))}))}})),o},m=(r,i,s)=>{const m={};return i.forEach((i=>{const n=i.format("YYYY-MM-DD");s.forEach((i=>{const s=e.timeToMinutes(i),a=t(s+30),c=o(r,n,i,a);c.forEach((e=>{const t=e.id;m[t]||(m[t]={date:n,serviceName:e.serviceName,startTime:e.startTime,endTime:e.endTime,visible:!0,width:100})}));const l=Array.from(new Set(c.map((e=>e.serviceName)))).slice(0,3);c.forEach((e=>{const t=e.id;l.includes(e.serviceName)||(m[t].visible=!1)}));const h=c.filter((e=>{const t=e.id;return m[t].visible})),p=new Set(h.map((e=>e.serviceName))).size,d=c.length>h.length?4:p,u=d>0?100/d:100;c.forEach((e=>{const t=e.id;m[t].width=Math.min(m[t].width,u)}))}))})),m},n=(e,t)=>{let r=Number.MAX_SAFE_INTEGER;return e.forEach((e=>{const i=e.id,s=t[i];r=Math.min(r,s.width)})),r},a=(e,t)=>{const r=Array.from(new Set(e.map((e=>e.serviceName)))),i=Array.from(new Set(t.map((e=>e.serviceName))));return{allServices:[...r,...i],visibleServices:r,hiddenServices:i,totalServices:r.length+i.length,hasOverflow:i.length>0,totalColumns:i.length>0?4:r.length}};export{a as calculateCellServiceLayout,m as calculateSlotWidths,n as getMinimumWidthForCell,o as getSlotsInTimeCell,s as getSlotsStartingInTimeCell};
 //# sourceMappingURL=week-view-utils.js.map

package/schedule/schedule-week-view/week-view-utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"week-view-utils.js","sources":["../../../src/schedule/schedule-week-view/week-view-utils.ts"],"sourcesContent":["import type dayjs from \"dayjs\";\n\nimport { TimeHelper } from \"../../util/time-helper\";\nimport {\n    findSlotsInTimeRange,\n    findSlotsStartingInTimeRange,\n    minutesToTime,\n} from \"../shared\";\nimport type { ScheduleEntityProps } from \"../types\";\nimport type { SlotLayoutMap, SlotWithService } from \"./types\";\n\n/**\n * Get all slots that START in a specific time cell\n */\nexport const getSlotsStartingInTimeCell = (\n    serviceData: ScheduleEntityProps[],\n    targetDate: string,\n    cellStartTime: string,\n    cellEndTime: string\n): SlotWithService[] => {\n    const allSlots: SlotWithService[] = [];\n\n    serviceData.forEach((service) => {\n        if (service.slots) {\n            const slotsInRange = findSlotsStartingInTimeRange(\n                service.slots,\n                cellStartTime,\n                cellEndTime,\n                targetDate\n            );\n\n            slotsInRange.forEach((slot) => {\n                allSlots.push({\n                    ...slot,\n                    serviceName: service.name,\n                });\n            });\n        }\n    });\n\n    return allSlots;\n};\n\n/**\n * Get all slots that OVERLAP with a specific time cell (for layout calculation)\n */\nexport const getSlotsInTimeCell = (\n    serviceData: ScheduleEntityProps[],\n    targetDate: string,\n    cellStartTime: string,\n    cellEndTime: string\n): SlotWithService[] => {\n    const allSlots: SlotWithService[] = [];\n\n    serviceData.forEach((service) => {\n        if (service.slots) {\n            const overlappingSlots = findSlotsInTimeRange(\n                service.slots,\n                cellStartTime,\n                cellEndTime,\n                targetDate\n            );\n\n            overlappingSlots.forEach((slot) => {\n                allSlots.push({\n                    ...slot,\n                    serviceName: service.name,\n                });\n            });\n        }\n    });\n\n    return allSlots;\n};\n\n/**\n * Calculate and update slot widths across all cells\n */\nexport const calculateSlotWidths = (\n    serviceData: ScheduleEntityProps[],\n    weekDays: dayjs.Dayjs[],\n    timeSlots: string[]\n): SlotLayoutMap => {\n    const slotLayoutMap: SlotLayoutMap = {};\n\n    weekDays.forEach((day) => {\n        const dayDate = day.format(\"YYYY-MM-DD\");\n        timeSlots.forEach((time) => {\n            const timeMinutes = TimeHelper.timeToMinutes(time);\n            const nextTime = minutesToTime(timeMinutes + 30);\n            const slotsInCell = getSlotsInTimeCell(\n                serviceData,\n                dayDate,\n                time,\n                nextTime\n            );\n\n            slotsInCell.forEach((slot) => {\n                const slotKey = slot.id;\n                if (!slotLayoutMap[slotKey]) {\n                    slotLayoutMap[slotKey] = {\n                        date: dayDate,\n                        serviceName: slot.serviceName,\n                        startTime: slot.startTime,\n                        endTime: slot.endTime,\n                        visible: true,\n                        width: 100,\n                    };\n                }\n            });\n\n            const uniqueServices = Array.from(\n                new Set(slotsInCell.map((slot) => slot.serviceName))\n            );\n\n            // Display at most 3 services, mark other slots as hidden\n            const firstThreeServices = uniqueServices.slice(0, 3);\n            slotsInCell.forEach((slot) => {\n                const slotKey = slot.id;\n                const isVisible = firstThreeServices.includes(slot.serviceName);\n                if (!isVisible) {\n                    slotLayoutMap[slotKey].visible = false;\n                }\n            });\n\n            // Calculate width based on visible services only\n            const visibleSlots = slotsInCell.filter((slot) => {\n                const slotKey = slot.id;\n                return slotLayoutMap[slotKey].visible;\n            });\n\n            const visibleServices = new Set(\n                visibleSlots.map((slot) => slot.serviceName)\n            );\n            const totalVisibleServices = visibleServices.size;\n            const hasHiddenServices = slotsInCell.length > visibleSlots.length;\n            const totalColumns = hasHiddenServices ? 4 : totalVisibleServices;\n            const widthPercentage = totalColumns > 0 ? 100 / totalColumns : 100;\n\n            // Update width for each slot in this cell (take minimum across all cells)\n            slotsInCell.forEach((slot) => {\n                const slotKey = slot.id;\n                slotLayoutMap[slotKey].width = Math.min(\n                    slotLayoutMap[slotKey].width,\n                    widthPercentage\n                );\n            });\n        });\n    });\n\n    return slotLayoutMap;\n};\n\n/**\n * Get minimum width for all slots overlapping a specific cell\n */\nexport const getMinimumWidthForCell = (\n    slotsInCell: SlotWithService[],\n    slotLayoutMap: SlotLayoutMap\n): number => {\n    let minWidth = Number.MAX_SAFE_INTEGER;\n\n    slotsInCell.forEach((slot) => {\n        const slotKey = slot.id;\n        const slotLayout = slotLayoutMap[slotKey];\n        minWidth = Math.min(minWidth, slotLayout.width);\n    });\n\n    return minWidth;\n};\n\n/**\n * Calculate cell service layout information\n */\nexport const calculateCellServiceLayout = (\n    visibleSlots: SlotWithService[],\n    hiddenSlots: SlotWithService[]\n) => {\n    const visibleServices = Array.from(\n        new Set(visibleSlots.map((slot) => slot.serviceName))\n    );\n    const hiddenServices = Array.from(\n        new Set(hiddenSlots.map((slot) => slot.serviceName))\n    );\n\n    return {\n        allServices: [...visibleServices, ...hiddenServices],\n        visibleServices,\n        hiddenServices,\n        totalServices: visibleServices.length + hiddenServices.length,\n        hasOverflow: hiddenServices.length > 0,\n        totalColumns: hiddenServices.length > 0 ? 4 : visibleServices.length,\n    };\n};\n"],"names":["getSlotsStartingInTimeCell","serviceData","targetDate","cellStartTime","cellEndTime","allSlots","forEach","service","slots","findSlotsStartingInTimeRange","slot","push","Object","assign","serviceName","name","getSlotsInTimeCell","findSlotsInTimeRange","calculateSlotWidths","weekDays","timeSlots","slotLayoutMap","day","dayDate","format","time","timeMinutes","TimeHelper","timeToMinutes","nextTime","minutesToTime","slotsInCell","slotKey","id","date","startTime","endTime","visible","width","firstThreeServices","Array","from","Set","map","slice","includes","visibleSlots","filter","totalVisibleServices","size","totalColumns","length","widthPercentage","Math","min","getMinimumWidthForCell","minWidth","Number","MAX_SAFE_INTEGER","slotLayout","calculateCellServiceLayout","hiddenSlots","visibleServices","hiddenServices","allServices","totalServices","hasOverflow"],"mappings":"oLAcO,MAAMA,EAA6B,CACtCC,EACAC,EACAC,EACAC,KAEA,MAAMC,EAA8B,GAoBpC,OAlBAJ,EAAYK,SAASC,IACjB,GAAIA,EAAQC,MAAO,CACMC,EACjBF,EAAQC,MACRL,EACAC,EACAF,GAGSI,SAASI,IAClBL,EAASM,KAAIC,OAAAC,OAAAD,OAAAC,OAAA,GACNH,GAAI,CACPI,YAAaP,EAAQQ,OACvB,GAEV,KAGGV,CAAQ,EAMNW,EAAqB,CAC9Bf,EACAC,EACAC,EACAC,KAEA,MAAMC,EAA8B,GAoBpC,OAlBAJ,EAAYK,SAASC,IACjB,GAAIA,EAAQC,MAAO,CACUS,EACrBV,EAAQC,MACRL,EACAC,EACAF,GAGaI,SAASI,IACtBL,EAASM,KAAIC,OAAAC,OAAAD,OAAAC,OAAA,GACNH,GAAI,CACPI,YAAaP,EAAQQ,OACvB,GAEV,KAGGV,CAAQ,EAMNa,EAAsB,CAC/BjB,EACAkB,EACAC,KAEA,MAAMC,EAA+B,CAAA,EAmErC,OAjEAF,EAASb,SAASgB,IACd,MAAMC,EAAUD,EAAIE,OAAO,cAC3BJ,EAAUd,SAASmB,IACf,MAAMC,EAAcC,EAAWC,cAAcH,GACvCI,EAAWC,EAAcJ,EAAc,IACvCK,EAAcf,EAChBf,EACAsB,EACAE,EACAI,GAGJE,EAAYzB,SAASI,IACjB,MAAMsB,EAAUtB,EAAKuB,GAChBZ,EAAcW,KACfX,EAAcW,GAAW,CACrBE,KAAMX,EACNT,YAAaJ,EAAKI,YAClBqB,UAAWzB,EAAKyB,UAChBC,QAAS1B,EAAK0B,QACdC,SAAS,EACTC,MAAO,KAEf,IAGJ,MAKMC,EALiBC,MAAMC,KACzB,IAAIC,IAAIX,EAAYY,KAAKjC,GAASA,EAAKI,gBAID8B,MAAM,EAAG,GACnDb,EAAYzB,SAASI,IACjB,MAAMsB,EAAUtB,EAAKuB,GACHM,EAAmBM,SAASnC,EAAKI,eAE/CO,EAAcW,GAASK,SAAU,EACrC,IAIJ,MAAMS,EAAef,EAAYgB,QAAQrC,IACrC,MAAMsB,EAAUtB,EAAKuB,GACrB,OAAOZ,EAAcW,GAASK,OAAO,IAMnCW,EAHkB,IAAIN,IACxBI,EAAaH,KAAKjC,GAASA,EAAKI,eAESmC,KAEvCC,EADoBnB,EAAYoB,OAASL,EAAaK,OACnB,EAAIH,EACvCI,EAAkBF,EAAe,EAAI,IAAMA,EAAe,IAGhEnB,EAAYzB,SAASI,IACjB,MAAMsB,EAAUtB,EAAKuB,GACrBZ,EAAcW,GAASM,MAAQe,KAAKC,IAChCjC,EAAcW,GAASM,MACvBc,EACH,GACH,GACJ,IAGC/B,CAAa,EAMXkC,EAAyB,CAClCxB,EACAV,KAEA,IAAImC,EAAWC,OAAOC,iBAQtB,OANA3B,EAAYzB,SAASI,IACjB,MAAMsB,EAAUtB,EAAKuB,GACf0B,EAAatC,EAAcW,GACjCwB,EAAWH,KAAKC,IAAIE,EAAUG,EAAWrB,MAAM,IAG5CkB,CAAQ,EAMNI,EAA6B,CACtCd,EACAe,KAEA,MAAMC,EAAkBtB,MAAMC,KAC1B,IAAIC,IAAII,EAAaH,KAAKjC,GAASA,EAAKI,gBAEtCiD,EAAiBvB,MAAMC,KACzB,IAAIC,IAAImB,EAAYlB,KAAKjC,GAASA,EAAKI,gBAG3C,MAAO,CACHkD,YAAa,IAAIF,KAAoBC,GACrCD,kBACAC,iBACAE,cAAeH,EAAgBX,OAASY,EAAeZ,OACvDe,YAAaH,EAAeZ,OAAS,EACrCD,aAAca,EAAeZ,OAAS,EAAI,EAAIW,EAAgBX,OACjE"}
+{"version":3,"file":"week-view-utils.js","sources":["../../../src/schedule/schedule-week-view/week-view-utils.ts"],"sourcesContent":["import type dayjs from \"dayjs\";\n\nimport { TimeHelper } from \"../../util/time-helper\";\nimport {\n    findSlotsInTimeRange,\n    findSlotsStartingInTimeRange,\n    minutesToTime,\n} from \"../schedule-slot-content\";\nimport type { ScheduleEntityProps } from \"../types\";\nimport type { SlotLayoutMap, SlotWithService } from \"./types\";\n\n/**\n * Get all slots that START in a specific time cell\n */\nexport const getSlotsStartingInTimeCell = (\n    serviceData: ScheduleEntityProps[],\n    targetDate: string,\n    cellStartTime: string,\n    cellEndTime: string\n): SlotWithService[] => {\n    const allSlots: SlotWithService[] = [];\n\n    serviceData.forEach((service) => {\n        if (service.slots) {\n            const slotsInRange = findSlotsStartingInTimeRange(\n                service.slots,\n                cellStartTime,\n                cellEndTime,\n                targetDate\n            );\n\n            slotsInRange.forEach((slot) => {\n                allSlots.push({\n                    ...slot,\n                    serviceName: service.name,\n                });\n            });\n        }\n    });\n\n    return allSlots;\n};\n\n/**\n * Get all slots that OVERLAP with a specific time cell (for layout calculation)\n */\nexport const getSlotsInTimeCell = (\n    serviceData: ScheduleEntityProps[],\n    targetDate: string,\n    cellStartTime: string,\n    cellEndTime: string\n): SlotWithService[] => {\n    const allSlots: SlotWithService[] = [];\n\n    serviceData.forEach((service) => {\n        if (service.slots) {\n            const overlappingSlots = findSlotsInTimeRange(\n                service.slots,\n                cellStartTime,\n                cellEndTime,\n                targetDate\n            );\n\n            overlappingSlots.forEach((slot) => {\n                allSlots.push({\n                    ...slot,\n                    serviceName: service.name,\n                });\n            });\n        }\n    });\n\n    return allSlots;\n};\n\n/**\n * Calculate and update slot widths across all cells\n */\nexport const calculateSlotWidths = (\n    serviceData: ScheduleEntityProps[],\n    weekDays: dayjs.Dayjs[],\n    timeSlots: string[]\n): SlotLayoutMap => {\n    const slotLayoutMap: SlotLayoutMap = {};\n\n    weekDays.forEach((day) => {\n        const dayDate = day.format(\"YYYY-MM-DD\");\n        timeSlots.forEach((time) => {\n            const timeMinutes = TimeHelper.timeToMinutes(time);\n            const nextTime = minutesToTime(timeMinutes + 30);\n            const slotsInCell = getSlotsInTimeCell(\n                serviceData,\n                dayDate,\n                time,\n                nextTime\n            );\n\n            slotsInCell.forEach((slot) => {\n                const slotKey = slot.id;\n                if (!slotLayoutMap[slotKey]) {\n                    slotLayoutMap[slotKey] = {\n                        date: dayDate,\n                        serviceName: slot.serviceName,\n                        startTime: slot.startTime,\n                        endTime: slot.endTime,\n                        visible: true,\n                        width: 100,\n                    };\n                }\n            });\n\n            const uniqueServices = Array.from(\n                new Set(slotsInCell.map((slot) => slot.serviceName))\n            );\n\n            // Display at most 3 services, mark other slots as hidden\n            const firstThreeServices = uniqueServices.slice(0, 3);\n            slotsInCell.forEach((slot) => {\n                const slotKey = slot.id;\n                const isVisible = firstThreeServices.includes(slot.serviceName);\n                if (!isVisible) {\n                    slotLayoutMap[slotKey].visible = false;\n                }\n            });\n\n            // Calculate width based on visible services only\n            const visibleSlots = slotsInCell.filter((slot) => {\n                const slotKey = slot.id;\n                return slotLayoutMap[slotKey].visible;\n            });\n\n            const visibleServices = new Set(\n                visibleSlots.map((slot) => slot.serviceName)\n            );\n            const totalVisibleServices = visibleServices.size;\n            const hasHiddenServices = slotsInCell.length > visibleSlots.length;\n            const totalColumns = hasHiddenServices ? 4 : totalVisibleServices;\n            const widthPercentage = totalColumns > 0 ? 100 / totalColumns : 100;\n\n            // Update width for each slot in this cell (take minimum across all cells)\n            slotsInCell.forEach((slot) => {\n                const slotKey = slot.id;\n                slotLayoutMap[slotKey].width = Math.min(\n                    slotLayoutMap[slotKey].width,\n                    widthPercentage\n                );\n            });\n        });\n    });\n\n    return slotLayoutMap;\n};\n\n/**\n * Get minimum width for all slots overlapping a specific cell\n */\nexport const getMinimumWidthForCell = (\n    slotsInCell: SlotWithService[],\n    slotLayoutMap: SlotLayoutMap\n): number => {\n    let minWidth = Number.MAX_SAFE_INTEGER;\n\n    slotsInCell.forEach((slot) => {\n        const slotKey = slot.id;\n        const slotLayout = slotLayoutMap[slotKey];\n        minWidth = Math.min(minWidth, slotLayout.width);\n    });\n\n    return minWidth;\n};\n\n/**\n * Calculate cell service layout information\n */\nexport const calculateCellServiceLayout = (\n    visibleSlots: SlotWithService[],\n    hiddenSlots: SlotWithService[]\n) => {\n    const visibleServices = Array.from(\n        new Set(visibleSlots.map((slot) => slot.serviceName))\n    );\n    const hiddenServices = Array.from(\n        new Set(hiddenSlots.map((slot) => slot.serviceName))\n    );\n\n    return {\n        allServices: [...visibleServices, ...hiddenServices],\n        visibleServices,\n        hiddenServices,\n        totalServices: visibleServices.length + hiddenServices.length,\n        hasOverflow: hiddenServices.length > 0,\n        totalColumns: hiddenServices.length > 0 ? 4 : visibleServices.length,\n    };\n};\n"],"names":["getSlotsStartingInTimeCell","serviceData","targetDate","cellStartTime","cellEndTime","allSlots","forEach","service","slots","findSlotsStartingInTimeRange","slot","push","Object","assign","serviceName","name","getSlotsInTimeCell","findSlotsInTimeRange","calculateSlotWidths","weekDays","timeSlots","slotLayoutMap","day","dayDate","format","time","timeMinutes","TimeHelper","timeToMinutes","nextTime","minutesToTime","slotsInCell","slotKey","id","date","startTime","endTime","visible","width","firstThreeServices","Array","from","Set","map","slice","includes","visibleSlots","filter","totalVisibleServices","size","totalColumns","length","widthPercentage","Math","min","getMinimumWidthForCell","minWidth","Number","MAX_SAFE_INTEGER","slotLayout","calculateCellServiceLayout","hiddenSlots","visibleServices","hiddenServices","allServices","totalServices","hasOverflow"],"mappings":"suBAcO,MAAMA,EAA6B,CACtCC,EACAC,EACAC,EACAC,KAEA,MAAMC,EAA8B,GAoBpC,OAlBAJ,EAAYK,SAASC,IACjB,GAAIA,EAAQC,MAAO,CACMC,EACjBF,EAAQC,MACRL,EACAC,EACAF,GAGSI,SAASI,IAClBL,EAASM,KAAIC,OAAAC,OAAAD,OAAAC,OAAA,GACNH,GAAI,CACPI,YAAaP,EAAQQ,OACvB,GAEV,KAGGV,CAAQ,EAMNW,EAAqB,CAC9Bf,EACAC,EACAC,EACAC,KAEA,MAAMC,EAA8B,GAoBpC,OAlBAJ,EAAYK,SAASC,IACjB,GAAIA,EAAQC,MAAO,CACUS,EACrBV,EAAQC,MACRL,EACAC,EACAF,GAGaI,SAASI,IACtBL,EAASM,KAAIC,OAAAC,OAAAD,OAAAC,OAAA,GACNH,GAAI,CACPI,YAAaP,EAAQQ,OACvB,GAEV,KAGGV,CAAQ,EAMNa,EAAsB,CAC/BjB,EACAkB,EACAC,KAEA,MAAMC,EAA+B,CAAA,EAmErC,OAjEAF,EAASb,SAASgB,IACd,MAAMC,EAAUD,EAAIE,OAAO,cAC3BJ,EAAUd,SAASmB,IACf,MAAMC,EAAcC,EAAWC,cAAcH,GACvCI,EAAWC,EAAcJ,EAAc,IACvCK,EAAcf,EAChBf,EACAsB,EACAE,EACAI,GAGJE,EAAYzB,SAASI,IACjB,MAAMsB,EAAUtB,EAAKuB,GAChBZ,EAAcW,KACfX,EAAcW,GAAW,CACrBE,KAAMX,EACNT,YAAaJ,EAAKI,YAClBqB,UAAWzB,EAAKyB,UAChBC,QAAS1B,EAAK0B,QACdC,SAAS,EACTC,MAAO,KAEf,IAGJ,MAKMC,EALiBC,MAAMC,KACzB,IAAIC,IAAIX,EAAYY,KAAKjC,GAASA,EAAKI,gBAID8B,MAAM,EAAG,GACnDb,EAAYzB,SAASI,IACjB,MAAMsB,EAAUtB,EAAKuB,GACHM,EAAmBM,SAASnC,EAAKI,eAE/CO,EAAcW,GAASK,SAAU,EACrC,IAIJ,MAAMS,EAAef,EAAYgB,QAAQrC,IACrC,MAAMsB,EAAUtB,EAAKuB,GACrB,OAAOZ,EAAcW,GAASK,OAAO,IAMnCW,EAHkB,IAAIN,IACxBI,EAAaH,KAAKjC,GAASA,EAAKI,eAESmC,KAEvCC,EADoBnB,EAAYoB,OAASL,EAAaK,OACnB,EAAIH,EACvCI,EAAkBF,EAAe,EAAI,IAAMA,EAAe,IAGhEnB,EAAYzB,SAASI,IACjB,MAAMsB,EAAUtB,EAAKuB,GACrBZ,EAAcW,GAASM,MAAQe,KAAKC,IAChCjC,EAAcW,GAASM,MACvBc,EACH,GACH,GACJ,IAGC/B,CAAa,EAMXkC,EAAyB,CAClCxB,EACAV,KAEA,IAAImC,EAAWC,OAAOC,iBAQtB,OANA3B,EAAYzB,SAASI,IACjB,MAAMsB,EAAUtB,EAAKuB,GACf0B,EAAatC,EAAcW,GACjCwB,EAAWH,KAAKC,IAAIE,EAAUG,EAAWrB,MAAM,IAG5CkB,CAAQ,EAMNI,EAA6B,CACtCd,EACAe,KAEA,MAAMC,EAAkBtB,MAAMC,KAC1B,IAAIC,IAAII,EAAaH,KAAKjC,GAASA,EAAKI,gBAEtCiD,EAAiBvB,MAAMC,KACzB,IAAIC,IAAImB,EAAYlB,KAAKjC,GAASA,EAAKI,gBAG3C,MAAO,CACHkD,YAAa,IAAIF,KAAoBC,GACrCD,kBACAC,iBACAE,cAAeH,EAAgBX,OAASY,EAAeZ,OACvDe,YAAaH,EAAeZ,OAAS,EACrCD,aAAca,EAAeZ,OAAS,EAAI,EAAIW,EAAgBX,OACjE"}

package/schedule/schedule.js

@@ -1,2 +1,2 @@
-import{__rest as e}from"../_virtual/_tslib.js";import{jsxs as a,jsx as i}from"react/jsx-runtime";import{l as t}from"../external/lodash/lodash.js";import{useState as o,useContext as l,useRef as n,useMemo as s,useEffect as d,useCallback as r}from"react";import{r as c}from"../external/react-responsive/dist/react-responsive.js";import{ThemeContext as m}from"styled-components";import{V3_Breakpoint as h}from"../v3_theme/index.js";import{Container as p,EmptyTableContainer as y,NoResultsFound as v,ScheduleBodyContainer as C}from"./schedule.styles.js";import{ScheduleDayView as k}from"./schedule-day-view/schedule-day-view.js";import{ScheduleHeader as D}from"./schedule-header/schedule-header.js";import{ScheduleWeekView as g}from"./schedule-week-view/schedule-week-view.js";const u=u=>{var{id:x,className:S,view:f="day",date:w,serviceData:T,loading:j=!1,minTime:b="00:00",maxTime:N="23:59",initialScrollTime:P=b,minDate:M,maxDate:E,emptyContentMessage:O,emptySlotPopover:H,onPreviousDayClick:_,onNextDayClick:A,onCalendarDateSelect:R,onTodayClick:V,onEmptySlotClick:$,blockedMessage:Q,onClickHiddenSlots:W,"data-testid":q="schedule"}=u,z=e(u,["id","className","view","date","serviceData","loading","minTime","maxTime","initialScrollTime","minDate","maxDate","emptyContentMessage","emptySlotPopover","onPreviousDayClick","onNextDayClick","onCalendarDateSelect","onTodayClick","onEmptySlotClick","blockedMessage","onClickHiddenSlots","data-testid"]);const[B,F]=o(f),G=l(m),I=h["lg-max"]({theme:G}),J=c.useMediaQuery({maxWidth:I}),K=J?"day":B,L=n(null),[U,X]=o(0),Y=0===T.length||t.isEmpty(T),Z=s((()=>T.map((e=>Object.assign(Object.assign({},e),{slots:e.slots.filter((e=>e.date===w))})))),[T,w]),ee=J?Z&&Z.length>0?[Z[U]]:[]:Z;d((()=>{X(0)}),[Z]);const ae=e=>{F(e)},ie=r((()=>{null==V||V()}),[V]),te=r((()=>{Z&&X((e=>e<Z.length-1?e+1:e))}),[Z]),oe=r((()=>{X((e=>e>0?e-1:e))}),[]);return a(p,Y?Object.assign({},z,{"data-testid":q,$loading:j,children:[i(D,{"data-id":"schedule-header",date:w,view:K,minDate:M,maxDate:E,onPreviousDayClick:_,onNextDayClick:A,onCalendarDateSelect:R,onViewChange:ae,onTodayClick:ie}),i(y,{className:"empty-container",children:i(v,{type:"no-item-found",description:O})})]}):Object.assign({id:x,className:S,$loading:j,"data-testid":q},z,{children:[i(D,{"data-id":"schedule-header",date:w,view:K,minDate:M,maxDate:E,onPreviousDayClick:_,onNextDayClick:A,onCalendarDateSelect:R,onViewChange:ae,onTodayClick:ie}),i(C,{ref:L,"data-id":"schedule-container",children:"day"===K?i(k,{date:w,serviceData:ee,loading:j,minTime:b,maxTime:N,initialScrollTime:P,emptySlotPopover:H,isMobile:J,onNextService:te,onPrevService:oe,containerRef:L,showPrevArrow:J&&U>0,showNextArrow:J&&U<Z.length-1,onEmptySlotClick:$,blockedMessage:Q}):i(g,{date:w,serviceData:T,loading:j,minTime:b,maxTime:N,initialScrollTime:P,containerRef:L,blockedMessage:Q,onClickHiddenSlots:W})})]}))};export{u as Schedule};
+import{__rest as e}from"../_virtual/_tslib.js";import{jsxs as t,jsx as i}from"react/jsx-runtime";import o from"clsx";import{l as a}from"../external/lodash/lodash.js";import{useState as s,useRef as r,useMemo as l,useEffect as n,useCallback as m}from"react";import{ErrorDisplay as d}from"../error-display/error-display.js";import"../theme/theme-provider/index.js";import"../theme/theme-provider/context.js";import"../theme/tokens/border.js";import"../theme/tokens/colour.js";import"../theme/tokens/font.js";import"../theme/tokens/media-query.js";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import"../util/simple-id-generator.js";import"../util/string-helper.js";import"@react-aria/live-announcer";import{useMaxWidthMediaQuery as c}from"../theme/utils/use-media-query.js";import{container as p,containerLoading as h,noResultsFound as y,emptyTableContainer as u,scheduleBodyContainer as v}from"./schedule.styles.js";import{ScheduleDayView as j}from"./schedule-day-view/schedule-day-view.js";import{ScheduleHeader as k}from"./schedule-header/schedule-header.js";import{ScheduleWeekView as g}from"./schedule-week-view/schedule-week-view.js";const C=C=>{var{id:D,className:x,view:S="day",date:f,serviceData:w,loading:T=!1,minTime:b="00:00",maxTime:N="23:59",initialScrollTime:P=b,minDate:M,maxDate:O,emptyContentMessage:E,emptySlotPopover:H,onPreviousDayClick:q,onNextDayClick:A,onCalendarDateSelect:_,onTodayClick:R,onEmptySlotClick:V,blockedMessage:z,onClickHiddenSlots:B,"data-testid":F="schedule"}=C,G=e(C,["id","className","view","date","serviceData","loading","minTime","maxTime","initialScrollTime","minDate","maxDate","emptyContentMessage","emptySlotPopover","onPreviousDayClick","onNextDayClick","onCalendarDateSelect","onTodayClick","onEmptySlotClick","blockedMessage","onClickHiddenSlots","data-testid"]);const[I,J]=s(S),K=c("lg"),L=K?"day":I,Q=r(null),[U,W]=s(0),X=0===w.length||a.isEmpty(w),Y=l((()=>w.map((e=>Object.assign(Object.assign({},e),{slots:e.slots.filter((e=>e.date===f))})))),[w,f]);let Z=Y;K&&(Z=Y.length>0?[Y[U]]:[]);const $=K&&U>0,ee=K&&U<Y.length-1;n((()=>{W(0)}),[Y]);const te=m((()=>{null==R||R()}),[R]),ie=m((()=>{Y&&W((e=>e<Y.length-1?e+1:e))}),[Y]),oe=m((()=>{W((e=>e>0?e-1:e))}),[]),ae={date:f,loading:T,minTime:b,maxTime:N,initialScrollTime:P,containerRef:Q,blockedMessage:z};return t("div",Object.assign({id:D,className:o(p,T&&h,x),"data-testid":F},G,{children:[i(k,{"data-id":"schedule-header",date:f,view:L,minDate:M,maxDate:O,onPreviousDayClick:q,onNextDayClick:A,onCalendarDateSelect:_,onViewChange:e=>{J(e)},onTodayClick:te}),i("div",X?{className:o(u,"empty-container"),children:i(d,{className:y,type:"no-item-found",description:E})}:{className:v,ref:Q,"data-id":"schedule-container",children:"day"===L?i(j,Object.assign({},ae,{serviceData:Z,emptySlotPopover:H,isMobile:K,onNextService:ie,onPrevService:oe,showPrevArrow:$,showNextArrow:ee,onEmptySlotClick:V})):i(g,Object.assign({},ae,{serviceData:w,onClickHiddenSlots:B}))})]}))};export{C as Schedule};
 //# sourceMappingURL=schedule.js.map

package/schedule/schedule.js.map

@@ -1 +1 @@
-{"version":3,"file":"schedule.js","sources":["../../src/schedule/schedule.tsx"],"sourcesContent":["import { isEmpty } from \"lodash\";\nimport {\n    useCallback,\n    useContext,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n} from \"react\";\nimport { useMediaQuery } from \"react-responsive\";\nimport { ThemeContext } from \"styled-components\";\n\nimport { V3_Breakpoint } from \"../v3_theme\";\nimport {\n    Container,\n    EmptyTableContainer,\n    NoResultsFound,\n    ScheduleBodyContainer,\n} from \"./schedule.styles\";\nimport { ScheduleDayView } from \"./schedule-day-view/schedule-day-view\";\nimport { ScheduleHeader } from \"./schedule-header/schedule-header\";\nimport { ScheduleWeekView } from \"./schedule-week-view/schedule-week-view\";\nimport type { ScheduleProps } from \"./types\";\n\nexport const Schedule = ({\n    id,\n    className,\n    view = \"day\",\n    date,\n    serviceData,\n    loading = false,\n    minTime = \"00:00\",\n    maxTime = \"23:59\",\n    initialScrollTime = minTime,\n    minDate,\n    maxDate,\n    emptyContentMessage,\n    emptySlotPopover,\n    onPreviousDayClick,\n    onNextDayClick,\n    onCalendarDateSelect,\n    onTodayClick,\n    onEmptySlotClick,\n    blockedMessage,\n    onClickHiddenSlots,\n    \"data-testid\": testId = \"schedule\",\n    ...otherProps\n}: ScheduleProps) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const [currentView, setCurrentView] = useState<\"day\" | \"week\">(view);\n    const theme = useContext(ThemeContext);\n    const tabletBreakpoint = V3_Breakpoint[\"lg-max\"]({ theme });\n    const isSmallScreen = useMediaQuery({\n        maxWidth: tabletBreakpoint,\n    });\n    const effectiveView = isSmallScreen ? \"day\" : currentView;\n    const contentContainerRef = useRef<HTMLDivElement>(null);\n    const [visibleServiceIdx, setVisibleServiceIdx] = useState(0);\n    const isEmptyContent = serviceData.length === 0 || isEmpty(serviceData);\n    const filteredServiceData = useMemo(\n        () =>\n            serviceData.map((service) => ({\n                ...service,\n                slots: service.slots.filter((slot) => slot.date === date),\n            })),\n        [serviceData, date]\n    );\n\n    const visibleServiceData = isSmallScreen\n        ? filteredServiceData && filteredServiceData.length > 0\n            ? [filteredServiceData[visibleServiceIdx]]\n            : []\n        : filteredServiceData;\n\n    useEffect(() => {\n        setVisibleServiceIdx(0);\n    }, [filteredServiceData]);\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleViewChange = (newView: \"day\" | \"week\") => {\n        setCurrentView(newView);\n    };\n\n    const handleTodayClick = useCallback(() => {\n        onTodayClick?.();\n    }, [onTodayClick]);\n\n    const handleNextService = useCallback(() => {\n        if (!filteredServiceData) return;\n        setVisibleServiceIdx((idx) =>\n            idx < filteredServiceData.length - 1 ? idx + 1 : idx\n        );\n    }, [filteredServiceData]);\n\n    const handlePrevService = useCallback(() => {\n        setVisibleServiceIdx((idx) => (idx > 0 ? idx - 1 : idx));\n    }, []);\n    // =============================================================================\n    // RENDER FUNCTION\n    // =============================================================================\n\n    if (isEmptyContent) {\n        return (\n            <Container {...otherProps} data-testid={testId} $loading={loading}>\n                <ScheduleHeader\n                    data-id=\"schedule-header\"\n                    date={date}\n                    view={effectiveView}\n                    minDate={minDate}\n                    maxDate={maxDate}\n                    onPreviousDayClick={onPreviousDayClick}\n                    onNextDayClick={onNextDayClick}\n                    onCalendarDateSelect={onCalendarDateSelect}\n                    onViewChange={handleViewChange}\n                    onTodayClick={handleTodayClick}\n                />\n                <EmptyTableContainer className=\"empty-container\">\n                    <NoResultsFound\n                        type=\"no-item-found\"\n                        description={emptyContentMessage}\n                    />\n                </EmptyTableContainer>\n            </Container>\n        );\n    }\n    return (\n        <Container\n            id={id}\n            className={className}\n            $loading={loading}\n            data-testid={testId}\n            {...otherProps}\n        >\n            <ScheduleHeader\n                data-id=\"schedule-header\"\n                date={date}\n                view={effectiveView}\n                minDate={minDate}\n                maxDate={maxDate}\n                onPreviousDayClick={onPreviousDayClick}\n                onNextDayClick={onNextDayClick}\n                onCalendarDateSelect={onCalendarDateSelect}\n                onViewChange={handleViewChange}\n                onTodayClick={handleTodayClick}\n            />\n\n            <ScheduleBodyContainer\n                ref={contentContainerRef}\n                data-id=\"schedule-container\"\n            >\n                {effectiveView === \"day\" ? (\n                    <ScheduleDayView\n                        date={date}\n                        serviceData={visibleServiceData}\n                        loading={loading}\n                        minTime={minTime}\n                        maxTime={maxTime}\n                        initialScrollTime={initialScrollTime}\n                        emptySlotPopover={emptySlotPopover}\n                        isMobile={isSmallScreen}\n                        onNextService={handleNextService}\n                        onPrevService={handlePrevService}\n                        containerRef={contentContainerRef}\n                        showPrevArrow={isSmallScreen && visibleServiceIdx > 0}\n                        showNextArrow={\n                            isSmallScreen &&\n                            visibleServiceIdx < filteredServiceData.length - 1\n                        }\n                        onEmptySlotClick={onEmptySlotClick}\n                        blockedMessage={blockedMessage}\n                    />\n                ) : (\n                    <ScheduleWeekView\n                        date={date}\n                        serviceData={serviceData}\n                        loading={loading}\n                        minTime={minTime}\n                        maxTime={maxTime}\n                        initialScrollTime={initialScrollTime}\n                        containerRef={contentContainerRef}\n                        blockedMessage={blockedMessage}\n                        onClickHiddenSlots={onClickHiddenSlots}\n                    />\n                )}\n            </ScheduleBodyContainer>\n        </Container>\n    );\n};\n"],"names":["Schedule","_a","id","className","view","date","serviceData","loading","minTime","maxTime","initialScrollTime","minDate","maxDate","emptyContentMessage","emptySlotPopover","onPreviousDayClick","onNextDayClick","onCalendarDateSelect","onTodayClick","onEmptySlotClick","blockedMessage","onClickHiddenSlots","testId","otherProps","__rest","currentView","setCurrentView","useState","theme","useContext","ThemeContext","tabletBreakpoint","V3_Breakpoint","isSmallScreen","useMediaQuery","maxWidth","effectiveView","contentContainerRef","useRef","visibleServiceIdx","setVisibleServiceIdx","isEmptyContent","length","isEmpty","filteredServiceData","useMemo","map","service","slots","filter","slot","visibleServiceData","useEffect","handleViewChange","newView","handleTodayClick","useCallback","handleNextService","idx","handlePrevService","_jsxs","Container","Object","assign","$loading","_jsx","ScheduleHeader","onViewChange","EmptyTableContainer","children","NoResultsFound","type","description","ScheduleBodyContainer","ref","ScheduleDayView","isMobile","onNextService","onPrevService","containerRef","showPrevArrow","showNextArrow","ScheduleWeekView"],"mappings":"owBAwBO,MAAMA,EAAYC,IAAA,IAAAC,GACrBA,EAAEC,UACFA,EAASC,KACTA,EAAO,MAAKC,KACZA,EAAIC,YACJA,EAAWC,QACXA,GAAU,EAAKC,QACfA,EAAU,QAAOC,QACjBA,EAAU,QAAOC,kBACjBA,EAAoBF,EAAOG,QAC3BA,EAAOC,QACPA,EAAOC,oBACPA,EAAmBC,iBACnBA,EAAgBC,mBAChBA,EAAkBC,eAClBA,EAAcC,qBACdA,EAAoBC,aACpBA,EAAYC,iBACZA,EAAgBC,eAChBA,EAAcC,mBACdA,EACA,cAAeC,EAAS,YAAUrB,EAC/BsB,EAAUC,EAAAvB,EAtBQ,CAAA,KAAA,YAAA,OAAA,OAAA,cAAA,UAAA,UAAA,UAAA,oBAAA,UAAA,UAAA,sBAAA,mBAAA,qBAAA,iBAAA,uBAAA,eAAA,mBAAA,iBAAA,qBAAA,gBA2BrB,MAAOwB,EAAaC,GAAkBC,EAAyBvB,GACzDwB,EAAQC,EAAWC,GACnBC,EAAmBC,EAAc,UAAU,CAAEJ,UAC7CK,EAAgBC,EAAAA,cAAc,CAChCC,SAAUJ,IAERK,EAAgBH,EAAgB,MAAQR,EACxCY,EAAsBC,EAAuB,OAC5CC,EAAmBC,GAAwBb,EAAS,GACrDc,EAAwC,IAAvBnC,EAAYoC,QAAgBC,EAAAA,QAAQrC,GACrDsC,EAAsBC,GACxB,IACIvC,EAAYwC,KAAKC,kCACVA,GAAO,CACVC,MAAOD,EAAQC,MAAMC,QAAQC,GAASA,EAAK7C,OAASA,SAE5D,CAACC,EAAaD,IAGZ8C,GAAqBlB,EACrBW,GAAuBA,EAAoBF,OAAS,EAChD,CAACE,EAAoBL,IACrB,GACJK,EAENQ,GAAU,KACNZ,EAAqB,EAAE,GACxB,CAACI,IAKJ,MAAMS,GAAoBC,IACtB5B,EAAe4B,EAAQ,EAGrBC,GAAmBC,GAAY,KACjCtC,SAAAA,GAAgB,GACjB,CAACA,IAEEuC,GAAoBD,GAAY,KAC7BZ,GACLJ,GAAsBkB,GAClBA,EAAMd,EAAoBF,OAAS,EAAIgB,EAAM,EAAIA,GACpD,GACF,CAACd,IAEEe,GAAoBH,GAAY,KAClChB,GAAsBkB,GAASA,EAAM,EAAIA,EAAM,EAAIA,GAAK,GACzD,IAKH,OAEQE,EAACC,EAFLpB,EAEcqB,OAAAC,OAAA,CAAA,EAAKxC,EAAU,CAAA,cAAeD,EAAM0C,SAAYzD,YACtD0D,EAACC,EAAc,CAAA,UACH,kBACR7D,KAAMA,EACND,KAAMgC,EACNzB,QAASA,EACTC,QAASA,EACTG,mBAAoBA,EACpBC,eAAgBA,EAChBC,qBAAsBA,EACtBkD,aAAcd,GACdnC,aAAcqC,KAElBU,EAACG,EAAmB,CAACjE,UAAU,kBAAiBkE,SAC5CJ,EAACK,EAAc,CACXC,KAAK,gBACLC,YAAa3D,SAOnBiD,OAAAC,OAAA,CACN7D,GAAIA,EACJC,UAAWA,EAAS6D,SACVzD,EAAO,cACJe,GACTC,EAAU,CAAA8C,SAAA,CAEdJ,EAACC,EAAc,CAAA,UACH,kBACR7D,KAAMA,EACND,KAAMgC,EACNzB,QAASA,EACTC,QAASA,EACTG,mBAAoBA,EACpBC,eAAgBA,EAChBC,qBAAsBA,EACtBkD,aAAcd,GACdnC,aAAcqC,KAGlBU,EAACQ,EAAqB,CAClBC,IAAKrC,EAAmB,UAChB,qBAAoBgC,SAET,QAAlBjC,EACG6B,EAACU,EAAe,CACZtE,KAAMA,EACNC,YAAa6C,GACb5C,QAASA,EACTC,QAASA,EACTC,QAASA,EACTC,kBAAmBA,EACnBI,iBAAkBA,EAClB8D,SAAU3C,EACV4C,cAAepB,GACfqB,cAAenB,GACfoB,aAAc1C,EACd2C,cAAe/C,GAAiBM,EAAoB,EACpD0C,cACIhD,GACAM,EAAoBK,EAAoBF,OAAS,EAErDvB,iBAAkBA,EAClBC,eAAgBA,IAGpB6C,EAACiB,EAAgB,CACb7E,KAAMA,EACNC,YAAaA,EACbC,QAASA,EACTC,QAASA,EACTC,QAASA,EACTC,kBAAmBA,EACnBqE,aAAc1C,EACdjB,eAAgBA,EAChBC,mBAAoBA,SAIxB"}
+{"version":3,"file":"schedule.js","sources":["../../src/schedule/schedule.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { isEmpty } from \"lodash\";\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\n\nimport { ErrorDisplay } from \"../error-display\";\nimport { useMaxWidthMediaQuery } from \"../theme\";\nimport * as styles from \"./schedule.styles\";\nimport { ScheduleDayView } from \"./schedule-day-view/schedule-day-view\";\nimport { ScheduleHeader } from \"./schedule-header/schedule-header\";\nimport { ScheduleWeekView } from \"./schedule-week-view/schedule-week-view\";\nimport type { CommonScheduleViewProps, ScheduleProps } from \"./types\";\n\nexport const Schedule = ({\n    id,\n    className,\n    view = \"day\",\n    date,\n    serviceData,\n    loading = false,\n    minTime = \"00:00\",\n    maxTime = \"23:59\",\n    initialScrollTime = minTime,\n    minDate,\n    maxDate,\n    emptyContentMessage,\n    emptySlotPopover,\n    onPreviousDayClick,\n    onNextDayClick,\n    onCalendarDateSelect,\n    onTodayClick,\n    onEmptySlotClick,\n    blockedMessage,\n    onClickHiddenSlots,\n    \"data-testid\": testId = \"schedule\",\n    ...otherProps\n}: ScheduleProps) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const [currentView, setCurrentView] = useState<\"day\" | \"week\">(view);\n    const isSmallScreen = useMaxWidthMediaQuery(\"lg\");\n    const effectiveView = isSmallScreen ? \"day\" : currentView;\n    const contentContainerRef = useRef<HTMLDivElement>(null);\n    const [visibleServiceIdx, setVisibleServiceIdx] = useState(0);\n    const isEmptyContent = serviceData.length === 0 || isEmpty(serviceData);\n    const filteredServiceData = useMemo(\n        () =>\n            serviceData.map((service) => ({\n                ...service,\n                slots: service.slots.filter((slot) => slot.date === date),\n            })),\n        [serviceData, date]\n    );\n    let visibleServiceData = filteredServiceData;\n    if (isSmallScreen) {\n        visibleServiceData =\n            filteredServiceData.length > 0\n                ? [filteredServiceData[visibleServiceIdx]]\n                : [];\n    }\n    const showPrevArrow = isSmallScreen && visibleServiceIdx > 0;\n    const showNextArrow =\n        isSmallScreen && visibleServiceIdx < filteredServiceData.length - 1;\n\n    useEffect(() => {\n        setVisibleServiceIdx(0);\n    }, [filteredServiceData]);\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleViewChange = (newView: \"day\" | \"week\") => {\n        setCurrentView(newView);\n    };\n\n    const handleTodayClick = useCallback(() => {\n        onTodayClick?.();\n    }, [onTodayClick]);\n\n    const handleNextService = useCallback(() => {\n        if (!filteredServiceData) return;\n        setVisibleServiceIdx((idx) =>\n            idx < filteredServiceData.length - 1 ? idx + 1 : idx\n        );\n    }, [filteredServiceData]);\n\n    const handlePrevService = useCallback(() => {\n        setVisibleServiceIdx((idx) => (idx > 0 ? idx - 1 : idx));\n    }, []);\n\n    // =============================================================================\n    // RENDER FUNCTION\n    // =============================================================================\n\n    const renderEmptyContent = () => (\n        <div className={clsx(styles.emptyTableContainer, \"empty-container\")}>\n            <ErrorDisplay\n                className={styles.noResultsFound}\n                type=\"no-item-found\"\n                description={emptyContentMessage}\n            />\n        </div>\n    );\n\n    const commonScheduleViewProps: CommonScheduleViewProps = {\n        date,\n        loading,\n        minTime,\n        maxTime,\n        initialScrollTime,\n        containerRef: contentContainerRef,\n        blockedMessage,\n    };\n\n    const renderScheduleView = () => (\n        <div\n            className={styles.scheduleBodyContainer}\n            ref={contentContainerRef}\n            data-id=\"schedule-container\"\n        >\n            {effectiveView === \"day\" ? (\n                <ScheduleDayView\n                    {...commonScheduleViewProps}\n                    serviceData={visibleServiceData}\n                    emptySlotPopover={emptySlotPopover}\n                    isMobile={isSmallScreen}\n                    onNextService={handleNextService}\n                    onPrevService={handlePrevService}\n                    showPrevArrow={showPrevArrow}\n                    showNextArrow={showNextArrow}\n                    onEmptySlotClick={onEmptySlotClick}\n                />\n            ) : (\n                <ScheduleWeekView\n                    {...commonScheduleViewProps}\n                    serviceData={serviceData}\n                    onClickHiddenSlots={onClickHiddenSlots}\n                />\n            )}\n        </div>\n    );\n\n    return (\n        <div\n            id={id}\n            className={clsx(\n                styles.container,\n                loading && styles.containerLoading,\n                className\n            )}\n            data-testid={testId}\n            {...otherProps}\n        >\n            <ScheduleHeader\n                data-id=\"schedule-header\"\n                date={date}\n                view={effectiveView}\n                minDate={minDate}\n                maxDate={maxDate}\n                onPreviousDayClick={onPreviousDayClick}\n                onNextDayClick={onNextDayClick}\n                onCalendarDateSelect={onCalendarDateSelect}\n                onViewChange={handleViewChange}\n                onTodayClick={handleTodayClick}\n            />\n\n            {isEmptyContent ? renderEmptyContent() : renderScheduleView()}\n        </div>\n    );\n};\n"],"names":["Schedule","_a","id","className","view","date","serviceData","loading","minTime","maxTime","initialScrollTime","minDate","maxDate","emptyContentMessage","emptySlotPopover","onPreviousDayClick","onNextDayClick","onCalendarDateSelect","onTodayClick","onEmptySlotClick","blockedMessage","onClickHiddenSlots","testId","otherProps","__rest","currentView","setCurrentView","useState","isSmallScreen","useMaxWidthMediaQuery","effectiveView","contentContainerRef","useRef","visibleServiceIdx","setVisibleServiceIdx","isEmptyContent","length","isEmpty","filteredServiceData","useMemo","map","service","slots","filter","slot","visibleServiceData","showPrevArrow","showNextArrow","useEffect","handleTodayClick","useCallback","handleNextService","idx","handlePrevService","commonScheduleViewProps","containerRef","_jsxs","Object","assign","clsx","styles.container","styles.containerLoading","children","_jsx","ScheduleHeader","onViewChange","newView","styles.emptyTableContainer","ErrorDisplay","styles.noResultsFound","type","description","styles.scheduleBodyContainer","ref","ScheduleDayView","isMobile","onNextService","onPrevService","ScheduleWeekView"],"mappings":"6oCAYO,MAAMA,EAAYC,IAAA,IAAAC,GACrBA,EAAEC,UACFA,EAASC,KACTA,EAAO,MAAKC,KACZA,EAAIC,YACJA,EAAWC,QACXA,GAAU,EAAKC,QACfA,EAAU,QAAOC,QACjBA,EAAU,QAAOC,kBACjBA,EAAoBF,EAAOG,QAC3BA,EAAOC,QACPA,EAAOC,oBACPA,EAAmBC,iBACnBA,EAAgBC,mBAChBA,EAAkBC,eAClBA,EAAcC,qBACdA,EAAoBC,aACpBA,EAAYC,iBACZA,EAAgBC,eAChBA,EAAcC,mBACdA,EACA,cAAeC,EAAS,YAAUrB,EAC/BsB,EAAUC,EAAAvB,EAtBQ,CAAA,KAAA,YAAA,OAAA,OAAA,cAAA,UAAA,UAAA,UAAA,oBAAA,UAAA,UAAA,sBAAA,mBAAA,qBAAA,iBAAA,uBAAA,eAAA,mBAAA,iBAAA,qBAAA,gBA2BrB,MAAOwB,EAAaC,GAAkBC,EAAyBvB,GACzDwB,EAAgBC,EAAsB,MACtCC,EAAgBF,EAAgB,MAAQH,EACxCM,EAAsBC,EAAuB,OAC5CC,EAAmBC,GAAwBP,EAAS,GACrDQ,EAAwC,IAAvB7B,EAAY8B,QAAgBC,EAAAA,QAAQ/B,GACrDgC,EAAsBC,GACxB,IACIjC,EAAYkC,KAAKC,kCACVA,GAAO,CACVC,MAAOD,EAAQC,MAAMC,QAAQC,GAASA,EAAKvC,OAASA,SAE5D,CAACC,EAAaD,IAElB,IAAIwC,EAAqBP,EACrBV,IACAiB,EACIP,EAAoBF,OAAS,EACvB,CAACE,EAAoBL,IACrB,IAEd,MAAMa,EAAgBlB,GAAiBK,EAAoB,EACrDc,GACFnB,GAAiBK,EAAoBK,EAAoBF,OAAS,EAEtEY,GAAU,KACNd,EAAqB,EAAE,GACxB,CAACI,IAKJ,MAIMW,GAAmBC,GAAY,KACjChC,SAAAA,GAAgB,GACjB,CAACA,IAEEiC,GAAoBD,GAAY,KAC7BZ,GACLJ,GAAsBkB,GAClBA,EAAMd,EAAoBF,OAAS,EAAIgB,EAAM,EAAIA,GACpD,GACF,CAACd,IAEEe,GAAoBH,GAAY,KAClChB,GAAsBkB,GAASA,EAAM,EAAIA,EAAM,EAAIA,GAAK,GACzD,IAgBGE,GAAmD,CACrDjD,OACAE,UACAC,UACAC,UACAC,oBACA6C,aAAcxB,EACdX,kBA+BJ,OACIoC,EAAA,MAAAC,OAAAC,OAAA,CACIxD,GAAIA,EACJC,UAAWwD,EACPC,EACArD,GAAWsD,EACX1D,GACH,cACYmB,GACTC,EAAU,CAAAuC,SAAA,CAEdC,EAACC,EAAc,CAAA,UACH,kBACR3D,KAAMA,EACND,KAAM0B,EACNnB,QAASA,EACTC,QAASA,EACTG,mBAAoBA,EACpBC,eAAgBA,EAChBC,qBAAsBA,EACtBgD,aA3FcC,IACtBxC,EAAewC,EAAQ,EA2FfhD,aAAc+B,KApEtBc,EAAA,MAuEK5B,EAvEL,CAAKhC,UAAWwD,EAAKQ,EAA4B,mBAAkBL,SAC/DC,EAACK,GACGjE,UAAWkE,EACXC,KAAK,gBACLC,YAAa1D,MAiBjBV,UAAWqE,EACXC,IAAK1C,EAAmB,UAChB,qBAAoB+B,SAET,QAAlBhC,EACGiC,EAACW,mBACOpB,GAAuB,CAC3BhD,YAAauC,EACb/B,iBAAkBA,EAClB6D,SAAU/C,EACVgD,cAAezB,GACf0B,cAAexB,GACfP,cAAeA,EACfC,cAAeA,GACf5B,iBAAkBA,KAGtB4C,EAACe,EAAgBrB,OAAAC,OAAA,CAAA,EACTJ,IACJhD,YAAaA,EACbe,mBAAoBA,UA+B1B"}

package/schedule/schedule.styles.d.ts

@@ -1,8 +1,5 @@
-interface ScheduleProps {
-    $loading: boolean | undefined;
-}
-export declare const Container: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$loading"> & ScheduleProps, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$loading"> & ScheduleProps, never>>> & string;
-export declare const ScheduleBodyContainer: 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 EmptyTableContainer: 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 NoResultsFound: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("..").ErrorDisplayProps, never> & Partial<Pick<import("..").ErrorDisplayProps, never>>> & string & Omit<({ type, img, title, description, actionButton, additionalProps, imageOnly, illustrationScheme, className, ...otherProps }: import("..").ErrorDisplayProps) => import("react/jsx-runtime").JSX.Element | null, keyof import("react").Component<any, {}, any>>;
-export {};
+export declare const container: import("@linaria/core").LinariaClassName;
+export declare const containerLoading: import("@linaria/core").LinariaClassName;
+export declare const scheduleBodyContainer: import("@linaria/core").LinariaClassName;
+export declare const emptyTableContainer: import("@linaria/core").LinariaClassName;
+export declare const noResultsFound: import("@linaria/core").LinariaClassName;

package/schedule/schedule.styles.js

@@ -1,27 +1,2 @@
-import o,{css as r}from"styled-components";import{ErrorDisplay as i}from"../error-display/error-display.js";import{V3_Border as d,V3_Colour as e,V3_Radius as t,V3_Spacing as n}from"../v3_theme/index.js";import{MIN_COLUMN_WIDTH as s}from"./const.js";const m=o.div`
-    min-width: 320px;
-    max-width: 90vw;
-    box-sizing: border-box;
-    ${o=>{if(o.$loading)return r`
-                &:hover {
-                    cursor: not-allowed;
-                }
-            `}}
-`,p=o.div`
-    height: 100%;
-    position: relative;
-    overflow: hidden;
-`,a=o.div`
-    display: grid;
-    overflow: auto;
-    position: relative;
-    grid-template-columns: ${s}px auto;
-    border: ${d["width-010"]} ${d.solid} ${e.border};
-    border-radius: ${t.md};
-    background: ${e.bg};
-`,l=o(i)`
-    grid-column: 1 / -1;
-    grid-row: 2;
-    padding: ${n["spacing-72"]} 0;
-`;export{m as Container,a as EmptyTableContainer,l as NoResultsFound,p as ScheduleBodyContainer};
+import"./schedule.styles_fdy5a1.css";const e="c1340rqu",s="c1hp3fsj",c="s1kpvet5",t="e1b7vyxh",h="niqne7l";export{e as container,s as containerLoading,t as emptyTableContainer,h as noResultsFound,c as scheduleBodyContainer};
 //# sourceMappingURL=schedule.styles.js.map

package/schedule/schedule.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"schedule.styles.js","sources":["../../src/schedule/schedule.styles.tsx"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nimport { ErrorDisplay } from \"../error-display\";\nimport { V3_Border, V3_Colour, V3_Radius, V3_Spacing } from \"../v3_theme\";\nimport { MIN_COLUMN_WIDTH } from \"./const\";\n\n// =============================================================================\n// STYLING\n// =============================================================================\ninterface ScheduleProps {\n    $loading: boolean | undefined;\n}\n\nexport const Container = styled.div<ScheduleProps>`\n    min-width: 320px;\n    max-width: 90vw;\n    box-sizing: border-box;\n    ${(props) => {\n        if (props.$loading) {\n            return css`\n                &:hover {\n                    cursor: not-allowed;\n                }\n            `;\n        }\n    }}\n`;\n\nexport const ScheduleBodyContainer = styled.div`\n    height: 100%;\n    position: relative;\n    overflow: hidden;\n`;\n\nexport const EmptyTableContainer = styled.div`\n    display: grid;\n    overflow: auto;\n    position: relative;\n    grid-template-columns: ${MIN_COLUMN_WIDTH}px auto;\n    border: ${V3_Border[\"width-010\"]} ${V3_Border.solid} ${V3_Colour[\"border\"]};\n    border-radius: ${V3_Radius[\"md\"]};\n    background: ${V3_Colour[\"bg\"]};\n`;\n\nexport const NoResultsFound = styled(ErrorDisplay)`\n    grid-column: 1 / -1;\n    grid-row: 2;\n    padding: ${V3_Spacing[\"spacing-72\"]} 0;\n`;\n"],"names":["Container","styled","div","props","$loading","css","ScheduleBodyContainer","EmptyTableContainer","MIN_COLUMN_WIDTH","V3_Border","solid","V3_Colour","V3_Radius","NoResultsFound","ErrorDisplay","V3_Spacing"],"mappings":"yPAaO,MAAMA,EAAYC,EAAOC,GAAkB;;;;MAI3CC,IACC,GAAIA,EAAMC,SACN,OAAOC,CAAG;;;;aAKd;EAIKC,EAAwBL,EAAOC,GAAG;;;;EAMlCK,EAAsBN,EAAOC,GAAG;;;;6BAIhBM;cACfC,EAAU,gBAAgBA,EAAUC,SAASC,EAAkB;qBACxDC,EAAc;kBACjBD,EAAc;EAGnBE,EAAiBZ,EAAOa,EAAa;;;eAGnCC,EAAW;"}
+{"version":3,"file":"schedule.styles.js","sources":["../../src/schedule/schedule.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, Colour, Radius, Spacing } from \"../theme\";\nimport { MIN_COLUMN_WIDTH } from \"./const\";\n\nexport const container = css`\n    min-width: 320px;\n    max-width: 90vw;\n    box-sizing: border-box;\n`;\n\nexport const containerLoading = css`\n    &:hover {\n        cursor: not-allowed;\n    }\n`;\n\nexport const scheduleBodyContainer = css`\n    height: 100%;\n    position: relative;\n    overflow: hidden;\n`;\n\nexport const emptyTableContainer = css`\n    display: grid;\n    overflow: auto;\n    position: relative;\n    grid-template-columns: ${MIN_COLUMN_WIDTH}px auto;\n    border: ${Border[\"width-010\"]} ${Border.solid} ${Colour[\"border\"]};\n    border-radius: ${Radius[\"md\"]};\n    background: ${Colour[\"bg\"]};\n`;\n\nexport const noResultsFound = css`\n    grid-column: 1 / -1;\n    grid-row: 2;\n    padding: ${Spacing[\"spacing-72\"]} 0;\n`;\n"],"names":["container","containerLoading","scheduleBodyContainer","emptyTableContainer","noResultsFound"],"mappings":"6DAKO,MAAMA,EAAS,WAMTC,EAAgB,WAMhBC,EAAqB,WAMrBC,EAAmB,WAUnBC,EAAc"}

package/schedule/schedule.styles_fdy5a1.css

@@ -0,0 +1,5 @@
+.c1340rqu{min-width:320px;max-width:90vw;box-sizing:border-box;}
+.c1hp3fsj:hover{cursor:not-allowed;}
+.s1kpvet5{height:100%;position:relative;overflow:hidden;}
+.e1b7vyxh{display:-ms-grid;display:grid;overflow:auto;position:relative;-ms-grid-columns:280px auto;grid-template-columns:280px auto;border:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);border-radius:var(--fds-radius-md);background:var(--fds-colour-bg);}
+.niqne7l{-ms-grid-column:1/-1;grid-column:1/-1;-ms-grid-row:2;grid-row:2;padding:var(--fds-spacing-72) 0;}

package/schedule/shared/with-optional-popover.d.ts

@@ -3,7 +3,7 @@ import type { SchedulePopoverProps } from "../types";
 interface ConditionalCellWrapperProps {
     containerRef: RefObject<HTMLDivElement>;
     children: JSX.Element;
-    customPopover?: SchedulePopoverProps | undefined;
+    customPopover?: SchedulePopoverProps;
 }
 export declare const WithOptionalPopover: ({ containerRef, children, customPopover, }: ConditionalCellWrapperProps) => JSX.Element;
 export {};

package/schedule/shared/with-optional-popover.js

@@ -1,6 +1,2 @@
-import{jsx as t}from"react/jsx-runtime";import e from"styled-components";import"../../_virtual/_tslib.js";import"clsx";import"react";import"../../theme/theme-provider/context.js";import"../../typography/typography.js";import"../../card/card.styles_1gh9gs3.css";import"../../markup/markup.js";import"../../modal-v2/index.js";import"../../theme/theme-provider/index.js";import"../../theme/tokens/border.js";import"../../theme/tokens/colour.js";import"../../theme/tokens/font.js";import"../../theme/tokens/media-query.js";import"../../util/calendar-helper.js";import"../../external/dayjs/dayjs.min.js";import"../../util/simple-id-generator.js";import"../../util/string-helper.js";import"@react-aria/live-announcer";import"../../popover-v2/popover.styles_lslc72.css";import{PopoverTrigger as o}from"../../popover-v2/popover-trigger.js";import"../../popover-v2/popover-inline/popover-inline.styles_ziag9c.css";const r=e(o)`
-    width: 100%;
-    display: flex;
-    flex-direction: column;
-`,i=({containerRef:e,children:o,customPopover:i})=>{if(!i)return o;const p={position:"bottom-start",rootNode:e,customOffset:i.offset,children:o,trigger:i.trigger,delay:i.delay,popoverContent:i.content};return t(r,Object.assign({zIndex:2},p))};export{i as WithOptionalPopover};
+import{jsx as t}from"react/jsx-runtime";import"../../_virtual/_tslib.js";import"clsx";import"react";import"../../theme/theme-provider/context.js";import"../../typography/typography.js";import"../../card/card.styles_1gh9gs3.css";import"../../markup/markup.js";import"../../modal-v2/index.js";import"../../theme/theme-provider/index.js";import"../../theme/tokens/border.js";import"../../theme/tokens/colour.js";import"../../theme/tokens/font.js";import"../../theme/tokens/media-query.js";import"../../util/calendar-helper.js";import"../../external/dayjs/dayjs.min.js";import"../../util/simple-id-generator.js";import"../../util/string-helper.js";import"@react-aria/live-announcer";import"../../theme/utils/use-media-query.js";import"../../popover/popover.styles_ujnf0h.css";import{PopoverTrigger as e}from"../../popover/popover-trigger.js";import"../../popover/popover-inline/popover-inline.styles_bkopnt.css";import{popoverTrigger as o}from"./with-optional-popover.styles.js";const r=({containerRef:r,children:i,customPopover:p})=>{if(!p)return i;const s={position:"bottom-start",rootNode:r,customOffset:p.offset,children:i,trigger:p.trigger,delay:p.delay,popoverContent:p.content};return t(e,Object.assign({className:o,zIndex:2},s))};export{r as WithOptionalPopover};
 //# sourceMappingURL=with-optional-popover.js.map

package/schedule/shared/with-optional-popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"with-optional-popover.js","sources":["../../../src/schedule/shared/with-optional-popover.tsx"],"sourcesContent":["import type { RefObject } from \"react\";\nimport styled from \"styled-components\";\n\nimport type { PopoverV2TriggerProps } from \"../../popover-v2\";\nimport { PopoverTrigger } from \"../../popover-v2\";\nimport type { SchedulePopoverProps } from \"../types\";\n\ninterface ConditionalCellWrapperProps {\n    containerRef: RefObject<HTMLDivElement>;\n    children: JSX.Element;\n    customPopover?: SchedulePopoverProps | undefined;\n}\n\nconst StyledPopoverTrigger = styled(PopoverTrigger)`\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n`;\n\nexport const WithOptionalPopover = ({\n    containerRef,\n    children,\n    customPopover,\n}: ConditionalCellWrapperProps) => {\n    if (!customPopover) {\n        return children;\n    }\n\n    const popoverTriggerProps: PopoverV2TriggerProps = {\n        position: \"bottom-start\",\n        rootNode: containerRef,\n        customOffset: customPopover.offset,\n        children: children,\n        trigger: customPopover.trigger,\n        delay: customPopover.delay,\n        popoverContent: customPopover.content,\n    };\n\n    return <StyledPopoverTrigger zIndex={2} {...popoverTriggerProps} />;\n};\n"],"names":["StyledPopoverTrigger","styled","PopoverTrigger","WithOptionalPopover","containerRef","children","customPopover","popoverTriggerProps","position","rootNode","customOffset","offset","trigger","delay","popoverContent","content","_jsx","Object","assign","zIndex"],"mappings":"06BAaA,MAAMA,EAAuBC,EAAOC,EAAe;;;;EAMtCC,EAAsB,EAC/BC,eACAC,WACAC,oBAEA,IAAKA,EACD,OAAOD,EAGX,MAAME,EAA6C,CAC/CC,SAAU,eACVC,SAAUL,EACVM,aAAcJ,EAAcK,OAC5BN,SAAUA,EACVO,QAASN,EAAcM,QACvBC,MAAOP,EAAcO,MACrBC,eAAgBR,EAAcS,SAGlC,OAAOC,EAAChB,EAAoBiB,OAAAC,OAAA,CAACC,OAAQ,GAAOZ,GAAuB"}
+{"version":3,"file":"with-optional-popover.js","sources":["../../../src/schedule/shared/with-optional-popover.tsx"],"sourcesContent":["import type { RefObject } from \"react\";\n\nimport type { PopoverTriggerProps } from \"../../popover\";\nimport { PopoverTrigger } from \"../../popover\";\nimport type { SchedulePopoverProps } from \"../types\";\nimport * as styles from \"./with-optional-popover.styles\";\n\ninterface ConditionalCellWrapperProps {\n    containerRef: RefObject<HTMLDivElement>;\n    children: JSX.Element;\n    customPopover?: SchedulePopoverProps;\n}\n\nexport const WithOptionalPopover = ({\n    containerRef,\n    children,\n    customPopover,\n}: ConditionalCellWrapperProps) => {\n    if (!customPopover) {\n        return children;\n    }\n\n    const popoverTriggerProps: PopoverTriggerProps = {\n        position: \"bottom-start\",\n        rootNode: containerRef,\n        customOffset: customPopover.offset,\n        children: children,\n        trigger: customPopover.trigger,\n        delay: customPopover.delay,\n        popoverContent: customPopover.content,\n    };\n\n    return (\n        <PopoverTrigger\n            className={styles.popoverTrigger}\n            zIndex={2}\n            {...popoverTriggerProps}\n        />\n    );\n};\n"],"names":["WithOptionalPopover","containerRef","children","customPopover","popoverTriggerProps","position","rootNode","customOffset","offset","trigger","delay","popoverContent","content","_jsx","PopoverTrigger","Object","assign","className","styles.popoverTrigger","zIndex"],"mappings":"g/BAaO,MAAMA,EAAsB,EAC/BC,eACAC,WACAC,oBAEA,IAAKA,EACD,OAAOD,EAGX,MAAME,EAA2C,CAC7CC,SAAU,eACVC,SAAUL,EACVM,aAAcJ,EAAcK,OAC5BN,SAAUA,EACVO,QAASN,EAAcM,QACvBC,MAAOP,EAAcO,MACrBC,eAAgBR,EAAcS,SAGlC,OACIC,EAACC,EAAcC,OAAAC,OAAA,CACXC,UAAWC,EACXC,OAAQ,GACJf,GACN"}

package/schedule/shared/with-optional-popover.styles.d.ts

@@ -0,0 +1 @@
+export declare const popoverTrigger: import("@linaria/core").LinariaClassName;

package/schedule/shared/with-optional-popover.styles.js

@@ -0,0 +1,2 @@
+import"./with-optional-popover.styles_7mv3p2.css";const e="p1gm2ee7";export{e as popoverTrigger};
+//# sourceMappingURL=with-optional-popover.styles.js.map

package/schedule/shared/with-optional-popover.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"with-optional-popover.styles.js","sources":["../../../src/schedule/shared/with-optional-popover.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nexport const popoverTrigger = css`\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n`;\n"],"names":["popoverTrigger"],"mappings":"iFAEO,MAAMA,EAAc"}

package/schedule/shared/with-optional-popover.styles_7mv3p2.css

@@ -0,0 +1 @@
+.p1gm2ee7{width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}

package/schedule/time-indicator/time-indicator.js

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as i,Fragment as r}from"react/jsx-runtime";import{TimeHelper as t}from"../../util/time-helper.js";import{TimeColumnWrapper as m,TimelineCircle as n,TimeColumn as l,TimeLabel as o,HourDisplay as s}from"./time-indicator.styles.js";const c=({minTime:c,maxTime:p,format:u="24hr",timelineOffset:a=null,isWeekView:h=!1})=>{const d=t.generateTimings(30,u,c,p).filter((e=>e.includes(":00")));return e(m,{children:[null!==a&&i(n,{$top:a,$isWeekView:h}),i(l,{children:d.map((t=>{const{hour:m,ampm:n}=function(e){const[i]=e.split(":").map(Number);return{hour:i%12==0?12:i%12,ampm:i<12?"am":"pm"}}(t);return i(o,{children:!(t===c)&&e(r,{children:[i(s,{children:m}),i("span",{children:n})]})},t)}))})]})};export{c as TimeIndicator};
+import{jsxs as e,jsx as t,Fragment as m}from"react/jsx-runtime";import r from"clsx";import{useRef as i}from"react";import"../../theme/theme-provider/index.js";import"../../theme/theme-provider/context.js";import"../../theme/tokens/border.js";import"../../theme/tokens/colour.js";import"../../theme/tokens/font.js";import"../../theme/tokens/media-query.js";import{useApplyStyle as s}from"../../theme/utils/use-apply-styles.js";import"../../theme/utils/use-media-query.js";import{Typography as o}from"../../typography/index.js";import{TimeHelper as n}from"../../util/time-helper.js";import{tokens as l,timeColumnWrapper as p,timelineCircle as a,timelineCircleWeekView as c,timeColumn as u,timeLabel as h,hourDisplay as d}from"./time-indicator.styles.js";const f=({minTime:f,maxTime:j,format:x="24hr",timelineOffset:y=null,isWeekView:N=!1})=>{const k=n.generateTimings(30,x,f,j).filter((e=>e.includes(":00"))),v=i(null);return s(v,{[l.timelineCircle.offset]:null===y?null:`${y}px`}),e("div",{className:p,children:[null!==y&&t("div",{className:r(a,N&&c),ref:v}),t("div",{className:u,children:k.map((r=>{const{hour:i,ampm:s}=function(e){const[t]=e.split(":").map(Number);return{hour:t%12==0?12:t%12,ampm:t<12?"am":"pm"}}(r),n=r===f;return t(o.BodySM,{className:h,children:!n&&e(m,{children:[t("span",{className:d,children:i}),t("span",{children:s})]})},r)}))})]})};export{f as TimeIndicator};
 //# sourceMappingURL=time-indicator.js.map

package/schedule/time-indicator/time-indicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"time-indicator.js","sources":["../../../src/schedule/time-indicator/time-indicator.tsx"],"sourcesContent":["import { TimeHelper } from \"../../util/time-helper\";\nimport {\n    HourDisplay,\n    TimeColumn,\n    TimeColumnWrapper,\n    TimeLabel,\n    TimelineCircle,\n} from \"./time-indicator.styles\";\n\ninterface TimeSlotTimeIndicatorProps {\n    minTime: string;\n    maxTime: string;\n    format: \"12hr\" | \"24hr\";\n    timelineOffset?: number | null;\n    isWeekView?: boolean;\n}\nfunction formatHourLabel(time: string) {\n    const [h] = time.split(\":\").map(Number);\n    const ampm = h < 12 ? \"am\" : \"pm\";\n    const hour = h % 12 === 0 ? 12 : h % 12;\n    return { hour, ampm };\n}\n\nexport const TimeIndicator = ({\n    minTime,\n    maxTime,\n    format = \"24hr\",\n    timelineOffset = null,\n    isWeekView = false,\n}: TimeSlotTimeIndicatorProps) => {\n    const timeSlots = TimeHelper.generateTimings(30, format, minTime, maxTime);\n    const hourLabels = timeSlots.filter((t) => t.includes(\":00\"));\n    return (\n        <TimeColumnWrapper>\n            {timelineOffset !== null && (\n                <TimelineCircle\n                    $top={timelineOffset}\n                    $isWeekView={isWeekView}\n                />\n            )}\n            <TimeColumn>\n                {hourLabels.map((time) => {\n                    const { hour, ampm } = formatHourLabel(time);\n                    const isFirstSlot = time === minTime;\n                    return (\n                        <TimeLabel key={time}>\n                            {!isFirstSlot && (\n                                <>\n                                    <HourDisplay>{hour}</HourDisplay>\n                                    <span>{ampm}</span>\n                                </>\n                            )}\n                        </TimeLabel>\n                    );\n                })}\n            </TimeColumn>\n        </TimeColumnWrapper>\n    );\n};\n"],"names":["TimeIndicator","minTime","maxTime","format","timelineOffset","isWeekView","hourLabels","TimeHelper","generateTimings","filter","t","includes","_jsxs","TimeColumnWrapper","children","_jsx","TimelineCircle","$top","$isWeekView","TimeColumn","map","time","hour","ampm","h","split","Number","formatHourLabel","TimeLabel","_Fragment","HourDisplay"],"mappings":"gQAuBaA,EAAgB,EACzBC,UACAC,UACAC,SAAS,OACTC,iBAAiB,KACjBC,cAAa,MAEb,MACMC,EADYC,EAAWC,gBAAgB,GAAIL,EAAQF,EAASC,GACrCO,QAAQC,GAAMA,EAAEC,SAAS,SACtD,OACIC,EAACC,EAAiB,CAAAC,SAAA,CACM,OAAnBV,GACGW,EAACC,EAAc,CAAAC,KACLb,EAAcc,YACPb,IAGrBU,EAACI,EAAU,CAAAL,SACNR,EAAWc,KAAKC,IACb,MAAMC,KAAEA,EAAIC,KAAEA,GA1BlC,SAAyBF,GACrB,MAAOG,GAAKH,EAAKI,MAAM,KAAKL,IAAIM,QAGhC,MAAO,CAAEJ,KADIE,EAAI,IAAO,EAAI,GAAKA,EAAI,GACtBD,KAFFC,EAAI,GAAK,KAAO,KAGjC,CAqB2CG,CAAgBN,GAEvC,OACIN,EAACa,EAAS,CAAAd,WAFMO,IAASpB,IAIjBW,EAAAiB,EAAA,CAAAf,SAAA,CACIC,EAACe,EAAW,CAAAhB,SAAEQ,IACdP,EAAA,OAAA,CAAAD,SAAOS,QAJHF,EAOJ,QAIR"}
+{"version":3,"file":"time-indicator.js","sources":["../../../src/schedule/time-indicator/time-indicator.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useRef } from \"react\";\n\nimport { useApplyStyle } from \"../../theme\";\nimport { Typography } from \"../../typography\";\nimport { TimeHelper } from \"../../util/time-helper\";\nimport * as styles from \"./time-indicator.styles\";\n\ninterface TimeSlotTimeIndicatorProps {\n    minTime: string;\n    maxTime: string;\n    format: \"12hr\" | \"24hr\";\n    timelineOffset?: number | null;\n    isWeekView?: boolean;\n}\nfunction formatHourLabel(time: string) {\n    const [h] = time.split(\":\").map(Number);\n    const ampm = h < 12 ? \"am\" : \"pm\";\n    const hour = h % 12 === 0 ? 12 : h % 12;\n    return { hour, ampm };\n}\n\nexport const TimeIndicator = ({\n    minTime,\n    maxTime,\n    format = \"24hr\",\n    timelineOffset = null,\n    isWeekView = false,\n}: TimeSlotTimeIndicatorProps) => {\n    const timeSlots = TimeHelper.generateTimings(30, format, minTime, maxTime);\n    const hourLabels = timeSlots.filter((t) => t.includes(\":00\"));\n    const timelineCircleRef = useRef<HTMLDivElement>(null);\n\n    useApplyStyle(timelineCircleRef, {\n        [styles.tokens.timelineCircle.offset]:\n            timelineOffset === null ? null : `${timelineOffset}px`,\n    });\n\n    return (\n        <div className={styles.timeColumnWrapper}>\n            {timelineOffset !== null && (\n                <div\n                    className={clsx(\n                        styles.timelineCircle,\n                        isWeekView && styles.timelineCircleWeekView\n                    )}\n                    ref={timelineCircleRef}\n                />\n            )}\n            <div className={styles.timeColumn}>\n                {hourLabels.map((time) => {\n                    const { hour, ampm } = formatHourLabel(time);\n                    const isFirstSlot = time === minTime;\n                    return (\n                        <Typography.BodySM\n                            className={styles.timeLabel}\n                            key={time}\n                        >\n                            {!isFirstSlot && (\n                                <>\n                                    <span className={styles.hourDisplay}>\n                                        {hour}\n                                    </span>\n                                    <span>{ampm}</span>\n                                </>\n                            )}\n                        </Typography.BodySM>\n                    );\n                })}\n            </div>\n        </div>\n    );\n};\n"],"names":["TimeIndicator","minTime","maxTime","format","timelineOffset","isWeekView","hourLabels","TimeHelper","generateTimings","filter","t","includes","timelineCircleRef","useRef","useApplyStyle","styles.tokens","timelineCircle","offset","_jsxs","className","styles.timeColumnWrapper","children","_jsx","clsx","styles.timelineCircle","styles.timelineCircleWeekView","ref","styles.timeColumn","map","time","hour","ampm","h","split","Number","formatHourLabel","isFirstSlot","Typography","BodySM","styles.timeLabel","_Fragment","styles.hourDisplay"],"mappings":"svBAsBaA,EAAgB,EACzBC,UACAC,UACAC,SAAS,OACTC,iBAAiB,KACjBC,cAAa,MAEb,MACMC,EADYC,EAAWC,gBAAgB,GAAIL,EAAQF,EAASC,GACrCO,QAAQC,GAAMA,EAAEC,SAAS,SAChDC,EAAoBC,EAAuB,MAOjD,OALAC,EAAcF,EAAmB,CAC7B,CAACG,EAAcC,eAAeC,QACP,OAAnBb,EAA0B,KAAO,GAAGA,QAIxCc,SAAKC,UAAWC,EAAwBC,SAAA,CAChB,OAAnBjB,GACGkB,EAAA,MAAA,CACIH,UAAWI,EACPC,EACAnB,GAAcoB,GAElBC,IAAKd,IAGbU,EAAA,MAAA,CAAKH,UAAWQ,EAAiBN,SAC5Bf,EAAWsB,KAAKC,IACb,MAAMC,KAAEA,EAAIC,KAAEA,GApClC,SAAyBF,GACrB,MAAOG,GAAKH,EAAKI,MAAM,KAAKL,IAAIM,QAGhC,MAAO,CAAEJ,KADIE,EAAI,IAAO,EAAI,GAAKA,EAAI,GACtBD,KAFFC,EAAI,GAAK,KAAO,KAGjC,CA+B2CG,CAAgBN,GACjCO,EAAcP,IAAS5B,EAC7B,OACIqB,EAACe,EAAWC,QACRnB,UAAWoB,EAAgBlB,UAGzBe,GACElB,EAAAsB,EAAA,CAAAnB,SAAA,CACIC,EAAA,OAAA,CAAMH,UAAWsB,EAAkBpB,SAC9BS,IAELR,EAAA,OAAA,CAAAD,SAAOU,QAPVF,EAUW,QAI9B"}

package/schedule/time-indicator/time-indicator.styles.d.ts

@@ -1,28 +1,11 @@
-interface TimelineCircleStyleProps {
-    $top: number;
-    $isWeekView: boolean;
-}
-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 TimeColumn: 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 TimeLabel: import("styled-components/dist/types").IStyledComponentBase<"web", 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>, never> & Partial<Pick<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>, 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 HourDisplay: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>>> & string;
-export declare const TimelineCircle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof TimelineCircleStyleProps> & TimelineCircleStyleProps, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof TimelineCircleStyleProps> & TimelineCircleStyleProps, never>>> & string;
-export {};
+export declare const tokens: {
+    timelineCircle: {
+        offset: string;
+    };
+};
+export declare const timeColumnWrapper: import("@linaria/core").LinariaClassName;
+export declare const timeColumn: import("@linaria/core").LinariaClassName;
+export declare const timeLabel: import("@linaria/core").LinariaClassName;
+export declare const hourDisplay: import("@linaria/core").LinariaClassName;
+export declare const timelineCircle: import("@linaria/core").LinariaClassName;
+export declare const timelineCircleWeekView: import("@linaria/core").LinariaClassName;

package/schedule/time-indicator/time-indicator.styles.js

@@ -1,34 +1,2 @@
-import i from"styled-components";import{Typography as o}from"../../typography/index.js";import{V3_Colour as t,V3_Border as e,V3_Spacing as n,V3_Font as p,V3_Radius as r}from"../../v3_theme/index.js";import{TIME_INDICATOR_WIDTH as d,CELL_HEIGHT as s}from"../const.js";const l=i.div`
-    position: sticky;
-    z-index: 3;
-`,a=i.div`
-    display: flex;
-    flex-direction: column;
-    min-width: ${d}px;
-    background: ${t.bg};
-    border-right: ${e["width-010"]} ${e.solid}
-        ${t.border};
-`,c=i(o.BodySM)`
-    min-height: ${2*s}px; /* 2 slots */
-    display: flex;
-    flex-direction: column;
-    align-items: flex-end;
-    color: ${t["text-subtler"]};
-    padding-right: ${n["spacing-8"]};
-    font-weight: ${p.Spec["weight-bold"]};
-    position: relative;
-`,$=i.span`
-    position: absolute;
-    top: -18px;
-`,g=i.div`
-    position: absolute;
-    right: -6px;
-    top: ${i=>i.$top-6}px;
-    width: ${n["spacing-12"]};
-    height: ${n["spacing-12"]};
-    border-radius: ${r.full};
-    background: ${t["icon-primary"]};
-    z-index: 4;
-    display: ${i=>i.$isWeekView?"none":"block"};
-`;export{$ as HourDisplay,a as TimeColumn,l as TimeColumnWrapper,c as TimeLabel,g as TimelineCircle};
+import"./time-indicator.styles_1eaxyes.css";const t={timelineCircle:{offset:"--fds-internal-schedule-timeIndicator-timelineCircle-top"}},e="t1by6gzt",i="twl5iae",s="t1eau6os",l="h1y5vs3p",c="t1juq8yz",o="t1wl3tbi";export{l as hourDisplay,i as timeColumn,e as timeColumnWrapper,s as timeLabel,c as timelineCircle,o as timelineCircleWeekView,t as tokens};
 //# sourceMappingURL=time-indicator.styles.js.map

package/schedule/time-indicator/time-indicator.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"time-indicator.styles.js","sources":["../../../src/schedule/time-indicator/time-indicator.styles.tsx"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { Typography } from \"../../typography\";\nimport {\n    V3_Border,\n    V3_Colour,\n    V3_Font,\n    V3_Radius,\n    V3_Spacing,\n} from \"../../v3_theme\";\nimport { CELL_HEIGHT, TIME_INDICATOR_WIDTH } from \"../const\";\n\n// =============================================================================\n// STYLE INTERFACES\n// =============================================================================\ninterface TimelineCircleStyleProps {\n    $top: number;\n    $isWeekView: boolean;\n}\n\n// =============================================================================\n// STYLING\n// =============================================================================\nexport const TimeColumnWrapper = styled.div`\n    position: sticky;\n    z-index: 3;\n`;\n\nexport const TimeColumn = styled.div`\n    display: flex;\n    flex-direction: column;\n    min-width: ${TIME_INDICATOR_WIDTH}px;\n    background: ${V3_Colour[\"bg\"]};\n    border-right: ${V3_Border[\"width-010\"]} ${V3_Border.solid}\n        ${V3_Colour[\"border\"]};\n`;\n\nexport const TimeLabel = styled(Typography.BodySM)`\n    min-height: ${CELL_HEIGHT * 2}px; /* 2 slots */\n    display: flex;\n    flex-direction: column;\n    align-items: flex-end;\n    color: ${V3_Colour[\"text-subtler\"]};\n    padding-right: ${V3_Spacing[\"spacing-8\"]};\n    font-weight: ${V3_Font.Spec[\"weight-bold\"]};\n    position: relative;\n`;\nexport const HourDisplay = styled.span`\n    position: absolute;\n    top: -18px;\n`;\n\nexport const TimelineCircle = styled.div<TimelineCircleStyleProps>`\n    position: absolute;\n    right: -6px;\n    top: ${(props) => props.$top - 6}px;\n    width: ${V3_Spacing[\"spacing-12\"]};\n    height: ${V3_Spacing[\"spacing-12\"]};\n    border-radius: ${V3_Radius[\"full\"]};\n    background: ${V3_Colour[\"icon-primary\"]};\n    z-index: 4;\n    display: ${(props) => (props.$isWeekView ? \"none\" : \"block\")};\n`;\n"],"names":["TimeColumnWrapper","styled","div","TimeColumn","TIME_INDICATOR_WIDTH","V3_Colour","V3_Border","solid","TimeLabel","Typography","BodySM","CELL_HEIGHT","V3_Spacing","V3_Font","Spec","HourDisplay","span","TimelineCircle","props","$top","V3_Radius","$isWeekView"],"mappings":"2QAuBO,MAAMA,EAAoBC,EAAOC,GAAG;;;EAK9BC,EAAaF,EAAOC,GAAG;;;iBAGnBE;kBACCC,EAAc;oBACZC,EAAU,gBAAgBA,EAAUC;UAC9CF,EAAkB;EAGfG,EAAYP,EAAOQ,EAAWC,OAAO;kBAClB,EAAdC;;;;aAILN,EAAU;qBACFO,EAAW;mBACbC,EAAQC,KAAK;;EAGnBC,EAAcd,EAAOe,IAAI;;;EAKzBC,EAAiBhB,EAAOC,GAA6B;;;WAGtDgB,GAAUA,EAAMC,KAAO;aACtBP,EAAW;cACVA,EAAW;qBACJQ,EAAgB;kBACnBf,EAAU;;eAEZa,GAAWA,EAAMG,YAAc,OAAS;"}
+{"version":3,"file":"time-indicator.styles.js","sources":["../../../src/schedule/time-indicator/time-indicator.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, Colour, Font, Radius, Spacing } from \"../../theme\";\nimport { CELL_HEIGHT, TIME_INDICATOR_WIDTH } from \"../const\";\n\n// =============================================================================\n// STYLING\n// =============================================================================\nexport const tokens = {\n    timelineCircle: {\n        offset: \"--fds-internal-schedule-timeIndicator-timelineCircle-top\",\n    },\n};\n\nexport const timeColumnWrapper = css`\n    position: sticky;\n    z-index: 3;\n`;\n\nexport const timeColumn = css`\n    display: flex;\n    flex-direction: column;\n    min-width: ${TIME_INDICATOR_WIDTH}px;\n    background: ${Colour[\"bg\"]};\n    border-right: ${Border[\"width-010\"]} ${Border.solid} ${Colour[\"border\"]};\n`;\n\nexport const timeLabel = css`\n    min-height: ${CELL_HEIGHT * 2}px; /* 2 slots */\n    display: flex;\n    flex-direction: column;\n    align-items: flex-end;\n    color: ${Colour[\"text-subtler\"]};\n    padding-right: ${Spacing[\"spacing-8\"]};\n    font-weight: ${Font.Spec[\"weight-bold\"]};\n    position: relative;\n`;\nexport const hourDisplay = css`\n    position: absolute;\n    top: -18px;\n`;\n\nexport const timelineCircle = css`\n    ${tokens.timelineCircle.offset}: 0px;\n    position: absolute;\n    right: -6px;\n    top: calc(var(${tokens.timelineCircle.offset}) - 6px);\n    width: ${Spacing[\"spacing-12\"]};\n    height: ${Spacing[\"spacing-12\"]};\n    border-radius: ${Radius[\"full\"]};\n    background: ${Colour[\"icon-primary\"]};\n    z-index: 4;\n`;\n\nexport const timelineCircleWeekView = css`\n    display: none;\n`;\n"],"names":["tokens","timelineCircle","offset","timeColumnWrapper","timeColumn","timeLabel","hourDisplay","timelineCircleWeekView"],"mappings":"mFAQO,MAAMA,EAAS,CAClBC,eAAgB,CACZC,OAAQ,6DAIHC,EAAiB,WAKjBC,EAAU,UAQVC,EAAS,WAUTC,EAAW,WAKXL,EAAc,WAYdM,EAAsB"}

package/schedule/time-indicator/time-indicator.styles_1eaxyes.css

@@ -0,0 +1,6 @@
+.t1by6gzt{position:-webkit-sticky;position:sticky;z-index:3;}
+.twl5iae{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;min-width:42px;background:var(--fds-colour-bg);border-right:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);}
+.t1eau6os{min-height:96px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:flex-end;-webkit-box-align:flex-end;-ms-flex-align:flex-end;align-items:flex-end;color:var(--fds-colour-text-subtler);padding-right:var(--fds-spacing-8);font-weight:var(--fds-font-weight-bold);position:relative;}
+.h1y5vs3p{position:absolute;top:-18px;}
+.t1juq8yz{--fds-internal-schedule-timeIndicator-timelineCircle-top:0px;position:absolute;right:-6px;top:calc(var(--fds-internal-schedule-timeIndicator-timelineCircle-top) - 6px);width:var(--fds-spacing-12);height:var(--fds-spacing-12);border-radius:var(--fds-radius-full);background:var(--fds-colour-icon-primary);z-index:4;}
+.t1wl3tbi{display:none;}

package/schedule/types.d.ts

@@ -1,4 +1,5 @@
-import type { PopoverV2TriggerType } from "../popover-v2";
+import type { RefObject } from "react";
+import type { PopoverTriggerType } from "../popover";
 export type ScheduleCellType = "booked" | "available" | "blocked" | "pending";
 export type ScheduleView = "day" | "week";
 export interface ScheduleEntityProps {
@@ -7,7 +8,7 @@ export interface ScheduleEntityProps {
     slots: ScheduleSlotProps[];
 }
 export interface SchedulePopoverProps {
-    trigger: PopoverV2TriggerType;
+    trigger: PopoverTriggerType;
     content: string | JSX.Element | (() => React.ReactNode);
     delay?: {
         open?: number;
@@ -38,6 +39,15 @@ export interface ScheduleProps {
     blockedMessage?: string | undefined;
     onClickHiddenSlots?: ((hiddenServices: string[]) => void) | undefined;
 }
+export interface CommonScheduleViewProps {
+    date: string;
+    loading: boolean;
+    minTime: string;
+    maxTime: string;
+    initialScrollTime?: string | undefined;
+    containerRef: RefObject<HTMLDivElement>;
+    blockedMessage?: string | undefined;
+}
 export interface ScheduleSlotProps {
     id: string;
     startTime: string;