npm - @lifesg/react-design-system - Versions diffs - 4.0.0-alpha.2 → 4.0.0-alpha.4 - Mend

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2426) hide show

package/cjs/progress-indicator/progress-indicator.styles_1c038s4.css ADDED Viewed

@@ -0,0 +1,8 @@
+.w103113g{position:relative;width:100%;margin:2rem 0;}:where(body.fds-breakpoint-xl-max) .w103113g{margin:1.5rem 0;}:where(body.fds-breakpoint-lg-max) .w103113g{margin:1rem 0;}
+.ck7dr6z{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-basis:0;-ms-flex-preferred-size:0;flex-basis:0;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;width:100%;}
+.i1k6bqsf{height:4px;margin-bottom:var(--fds-spacing-8);border-radius:var(--fds-radius-full);background-color:var(--fds-colour-bg-disabled);}
+.inywq69{background-color:var(--fds-colour-bg-primary-subtle);}
+.i1ubzlq2{overflow-wrap:anywhere;color:var(--fds-colour-text-disabled);}
+.i8ugwdc{color:var(--fds-colour-text-primary);}
+.i8128on{overflow-wrap:anywhere;color:var(--fds-colour-text);}
+.i1vcego5{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-flex:1;-ms-flex:1;flex:1;}.i1vcego5:not(:last-child){margin-right:0.5rem;}

package/cjs/schedule/const.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";exports.CELL_HEIGHT=48,exports.HEADER_HEIGHT=130,exports.MIN_COLUMN_WIDTH=280,exports.SLOT_INTERVAL=30,exports.TIME_INDICATOR_WIDTH=42;
+"use strict";exports.CELL_HEIGHT=48,exports.SLOT_INTERVAL=30;
 //# sourceMappingURL=const.js.map

package/cjs/schedule/const.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"const.js","sources":["../../../src/schedule/const.ts"],"sourcesContent":["export const CELL_HEIGHT = 48; //the height of each cell in the grid (unit: px)\nexport const TIME_INDICATOR_WIDTH = 42; //the width of the time indicator column (unit: px)\nexport const HEADER_HEIGHT = 130; //the height of the header (unit: px)\nexport const SLOT_INTERVAL = 30; // minutes per slot\nexport const MIN_COLUMN_WIDTH = 280; //the min width of the column (unit: px)\n\n// Constants for slot positioning in week view\nexport const SLOT_WIDTH = 30;\nexport const SLOT_GAP = 2;\nexport const MAX_VISIBLE_SLOTS = 3;\n"],"names":[],"mappings":"iCAA2B,~~yBAEE,6BAEG,0BADH,gCAFO~~"}
1	+ {"version":3,"file":"const.js","sources":["../../../src/schedule/const.ts"],"sourcesContent":["export const CELL_HEIGHT = 48; //the height of each cell in the grid (unit: px)\nexport const TIME_INDICATOR_WIDTH = 42; //the width of the time indicator column (unit: px)\nexport const HEADER_HEIGHT = 130; //the height of the header (unit: px)\nexport const SLOT_INTERVAL = 30; // minutes per slot\nexport const MIN_COLUMN_WIDTH = 280; //the min width of the column (unit: px)\n\n// Constants for slot positioning in week view\nexport const SLOT_WIDTH = 30;\nexport const SLOT_GAP = 2;\nexport const MAX_VISIBLE_SLOTS = 3;\n"],"names":[],"mappings":"iCAA2B,yBAGE"}

package/cjs/schedule/schedule-day-view/schedule-day-view.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("@lifesg/react-icons"),i=require("react"),t=require("../../animations/themed-loading-spinner/themed-loading-spinner.js"),n=require("../../util/date-helper.js"),l=require("../../util/time-helper.js"),s=require("../shared/hooks.js"),o=require("../shared/utils.js"),a=require("../shared/with-optional-popover.js"),c=require("../time-indicator/time-indicator.js"),d=require("./schedule-day-view.styles.js");const{ServiceContainer:u,ServiceColumn:m,ArrowContainer:h,ArrowButton:p,ServiceHeaderContainer:j,Title:T,Description:x,SlotContent:f,SlotTime:v,SlotAvailability:C,SlotCell:S,EmptySlot:g,SlotGrid:y,Timeline:$,SlotColumn:k,ScheduleContainer:b,LoadingContainer:q,HeaderContainer:P,BlankCell:w,BodyContainer:H}=d;exports.ScheduleDayView=({serviceData:d,isMobile:L,onNextService:I,onPrevService:M,onEmptySlotClick:D,showPrevArrow:R,showNextArrow:W,minTime:A,maxTime:O,initialScrollTime:B,containerRef:N,loading:z,emptySlotPopover:E,blockedMessage:F="Unavailable"})=>{const G=s.useTimelineOffset(A,O),U=s.useInitialScroll(z,A,B),V=i.useRef(null),J=i.useMemo((()=>l.TimeHelper.generateTimings(30,"24hr",A,O)),[A,O]),K=(e,r,i)=>{if(null==r?void 0:r.customPopover)return r.customPopover;if(!((e,r)=>!!e.slots&&o.isTimeCellCovered(e.slots,r))(e,i)&&E){const r={startTime:i,endTime:n.DateHelper.addMinutesToTime(i,30),name:e.name};return E(r)}},Q=(r,i)=>{const t=l.TimeHelper.calculateDuration(r.startTime,r.endTime),n=o.calculateSlotOffset(r.startTime,i);return e.jsx(f,{$status:r.status,$duration:t,$offsetTop:n,onClick:e=>r.onClick&&r.onClick(r,e),children:t>=15&&e.jsxs(e.Fragment,{children:[e.jsxs(v,{children:[l.TimeHelper.parseInput(r.startTime,"12hr"),"–"," ",l.TimeHelper.parseInput(r.endTime,"12hr")]}),e.jsx(C,{children:"blocked"===r.status?F:`${r.booked} / ${r.capacity}`})]})})},X=(r,i)=>{const t=((e,r)=>{if(!e.slots)return[];const i=l.TimeHelper.timeToMinutes(r),t=o.minutesToTime(i+30);return o.findSlotsStartingInTimeRange(e.slots,r,t)})(r,i);return t.length>0?e.jsx(S,{$dashed:i.endsWith(":00"),children:t.map(((t,n)=>{const l=K(r,t,i);return e.jsx(a.WithOptionalPopover,{containerRef:N,customPopover:l,children:Q(t,i)},`${t.id}-${n}`)}))},i):e.jsx(S,{$dashed:i.endsWith(":00"),onClick:()=>((e,r)=>{if(D){const i=n.DateHelper.addMinutesToTime(e,30);D({startTime:e,endTime:i,name:r})}})(i,r.name),children:e.jsx(a.WithOptionalPopover,{containerRef:N,customPopover:K(r,void 0,i),children:e.jsx(g,{})})},i)};return e.jsx(b,{children:z?e.jsx(q,{children:e.jsx(t.ThemedLoadingSpinner,{})}):e.jsxs(e.Fragment,{children:[e.jsxs(P,{ref:V,onScroll:e=>{V.current&&U.current&&(U.current.scrollLeft=V.current.scrollLeft)},$isMobile:L,children:[e.jsx(w,{}),e.jsx(u,{$columnCount:d.length,children:d.map((i=>e.jsxs(m,{children:[L&&e.jsx(h,{children:R&&M&&e.jsx(p,{styleType:"light",sizeType:"small",onClick:M,"aria-label":"Previous service",icon:e.jsx(r.ChevronLeftIcon,{"aria-hidden":!0})})}),e.jsxs(j,{children:[e.jsx(T,{children:i.name}),e.jsxs(x,{children:[e.jsx("span",{children:i.slots.filter((e=>"available"===e.status)).length})," ","available"]})]}),L&&W&&I&&e.jsx(p,{styleType:"light",sizeType:"small",onClick:I,"aria-label":"Next service",icon:e.jsx(r.ChevronRightIcon,{"aria-hidden":!0})})]},i.id)))})]}),e.jsxs(H,{ref:U,onScroll:e=>{if(V.current&&U.current){const e=17,r=U.current.scrollWidth-U.current.clientWidth-e,i=U.current.scrollLeft;i>r?(U.current.scrollLeft=r,V.current.scrollLeft=r):V.current.scrollLeft=i}},children:[e.jsx(c.TimeIndicator,{minTime:A,maxTime:O,format:"24hr",timelineOffset:G}),e.jsxs(y,{$columnCount:d.length,children:[null!==G&&e.jsx($,{$top:G}),d.map((r=>e.jsx(k,{children:J.map((e=>X(r,e)))},r.id)))]})]})]})})};
+"use strict";var e=require("react/jsx-runtime"),t=require("@lifesg/react-icons"),s=require("clsx"),r=require("react"),i=require("../../animations/themed-loading-spinner/themed-loading-spinner.js"),l=require("../../button/button.js");require("../../theme/theme-provider/index.js"),require("../../theme/theme-provider/context.js"),require("../../theme/tokens/border.js"),require("../../theme/tokens/colour.js"),require("../../theme/tokens/font.js"),require("../../theme/tokens/media-query.js");var n=require("../../theme/utils/use-apply-styles.js");require("../../theme/utils/use-media-query.js");var o=require("../../typography/index.js"),a=require("../../util/date-helper.js"),c=require("../../util/time-helper.js"),d=require("../shared/hooks.js"),u=require("../shared/utils.js"),m=require("../schedule-slot-content/schedule-slot-content.js"),h=require("../shared/with-optional-popover.js"),p=require("../time-indicator/time-indicator.js"),j=require("./schedule-day-view.styles.js");function v(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var x=v(s);const f=({slot:t,timeSlotStart:s,blockedMessage:r})=>{const i=u.calculateSlotOffset(t.startTime,s),l=c.TimeHelper.calculateDuration(t.startTime,t.endTime);return e.jsx(m.ScheduleSlotContent,{slot:t,offsetTop:i,tokens:j.tokens.slotContent,classNames:{container:j.slotContent,blocked:j.slotContentBlocked,available:j.slotContentAvailable},children:l>=15&&e.jsxs(e.Fragment,{children:[e.jsxs("span",{className:j.slotTime,children:[c.TimeHelper.parseInput(t.startTime,"12hr"),"–"," ",c.TimeHelper.parseInput(t.endTime,"12hr")]}),e.jsx("span",{className:j.slotAvailability,children:"blocked"===t.status?r:`${t.booked} / ${t.capacity}`})]})})};exports.ScheduleDayView=({serviceData:s,isMobile:m,onNextService:v,onPrevService:T,onEmptySlotClick:y,showPrevArrow:C,showNextArrow:g,minTime:q,maxTime:N,initialScrollTime:S,containerRef:b,loading:k,emptySlotPopover:M,blockedMessage:w="Unavailable"})=>{const P=d.useTimelineOffset(q,N),R=d.useInitialScroll(k,q,S),$=r.useRef(null),H=r.useRef(null),L=r.useRef(null),A=r.useRef(null),B=r.useMemo((()=>c.TimeHelper.generateTimings(30,"24hr",q,N)),[q,N]);n.useApplyStyle(H,{[j.tokens.serviceContainer.columnCount]:`${s.length}`}),n.useApplyStyle(L,{[j.tokens.slotGrid.columnCount]:`${s.length}`}),n.useApplyStyle(A,{[j.tokens.timeline.top]:null===P?null:`${P}px`});const D=(e,t,s)=>{if(null==t?void 0:t.customPopover)return t.customPopover;if(!((e,t)=>!!e.slots&&u.isTimeCellCovered(e.slots,t))(e,s)&&M){const t={startTime:s,endTime:a.DateHelper.addMinutesToTime(s,30),name:e.name};return M(t)}},I=(t,s)=>e.jsx(f,{slot:t,timeSlotStart:s,blockedMessage:w}),O=e=>x.default(j.slotCell,e.endsWith(":00")&&j.slotCellDashed),W=(t,s)=>e.jsx("div",{className:O(s),onClick:()=>((e,t)=>{if(y){const s=a.DateHelper.addMinutesToTime(e,30);y({startTime:e,endTime:s,name:t})}})(s,t.name),"data-testid":`empty-slot-${t.id}-${s}`,children:e.jsx(h.WithOptionalPopover,{containerRef:b,customPopover:D(t,void 0,s),children:e.jsx("div",{className:j.emptySlot})})},s),z=(t,s)=>{const r=((e,t)=>{if(!e.slots)return[];const s=c.TimeHelper.timeToMinutes(t),r=u.minutesToTime(s+30);return u.findSlotsStartingInTimeRange(e.slots,t,r)})(t,s);return r.length>0?((t,s,r)=>e.jsx("div",{className:O(s),children:r.map(((r,i)=>e.jsx(h.WithOptionalPopover,{containerRef:b,customPopover:D(t,r,s),children:I(r,s)},`${r.id}-${i}`)))},s))(t,s,r):W(t,s)};return e.jsx("div",{className:j.scheduleContainer,children:k?e.jsx("div",{className:j.loadingContainer,children:e.jsx(i.ThemedLoadingSpinner,{"data-testid":"loading-spinner"})}):e.jsxs(e.Fragment,{children:[e.jsxs("div",{ref:$,onScroll:e=>{$.current&&R.current&&(R.current.scrollLeft=$.current.scrollLeft)},className:x.default(j.headerContainer,m&&j.headerContainerMobile),children:[e.jsx("div",{className:j.blankCell}),e.jsx("div",{ref:H,className:j.serviceContainer,children:s.map((s=>e.jsxs("div",{className:j.serviceColumn,children:[m&&e.jsx("div",{className:j.arrowContainer,children:C&&T&&e.jsx(l.Button,{className:j.arrowButton,styleType:"light",sizeType:"small",onClick:T,"aria-label":"Previous service",icon:e.jsx(t.ChevronLeftIcon,{"aria-hidden":!0})})}),e.jsxs("div",{className:j.serviceHeaderContainer,children:[e.jsx(o.Typography.BodyMD,{className:j.title,children:s.name}),e.jsxs(o.Typography.BodySM,{className:j.description,children:[e.jsx("span",{children:s.slots.filter((e=>"available"===e.status)).length})," ","available"]})]}),m&&g&&v&&e.jsx(l.Button,{className:j.arrowButton,styleType:"light",sizeType:"small",onClick:v,"aria-label":"Next service",icon:e.jsx(t.ChevronRightIcon,{"aria-hidden":!0})})]},s.id)))})]}),e.jsxs("div",{className:j.bodyContainer,ref:R,onScroll:e=>{if($.current&&R.current){const e=17,t=R.current.scrollWidth-R.current.clientWidth-e,s=R.current.scrollLeft;s>t?(R.current.scrollLeft=t,$.current.scrollLeft=t):$.current.scrollLeft=s}},children:[e.jsx(p.TimeIndicator,{minTime:q,maxTime:N,format:"24hr",timelineOffset:P}),e.jsxs("div",{ref:L,className:j.slotGrid,children:[null!==P&&e.jsx("div",{ref:A,className:j.timeline}),s.map((t=>e.jsx("div",{className:j.slotColumn,children:B.map((e=>z(t,e)))},t.id)))]})]})]})})};
 //# sourceMappingURL=schedule-day-view.js.map

package/cjs/schedule/schedule-day-view/schedule-day-view.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"schedule-day-view.js","sources":["../../../../src/schedule/schedule-day-view/schedule-day-view.tsx"],"sourcesContent":["import { ChevronLeftIcon, ChevronRightIcon } from \"@lifesg/react-icons\";\nimport type { MouseEvent } from \"react\";\nimport { useMemo, useRef } from \"react\";\n\nimport { ThemedLoadingSpinner } from \"../../animations/themed-loading-spinner/themed-loading-spinner\";\nimport { DateHelper } from \"../../util/date-helper\";\nimport { TimeHelper } from \"../../util/time-helper\";\nimport {\n calculateSlotOffset,\n findSlotsStartingInTimeRange,\n isTimeCellCovered,\n minutesToTime,\n useInitialScroll,\n useTimelineOffset,\n} from \"../shared\";\nimport { WithOptionalPopover } from \"../shared/with-optional-popover\";\nimport { TimeIndicator } from \"../time-indicator/time-indicator\";\nimport type { ScheduleEntityProps, ScheduleSlotProps } from \"../types\";\nimport * as styles from \"./schedule-day-view.styles\";\nimport type { ScheduleDayViewProps } from \"./types\";\n\nconst {\n ServiceContainer,\n ServiceColumn,\n ArrowContainer,\n ArrowButton,\n ServiceHeaderContainer,\n Title,\n Description,\n SlotContent,\n SlotTime,\n SlotAvailability,\n SlotCell,\n EmptySlot,\n SlotGrid,\n Timeline,\n SlotColumn,\n ScheduleContainer,\n LoadingContainer,\n HeaderContainer,\n BlankCell,\n BodyContainer,\n} = styles;\n\nexport const ScheduleDayView = ({\n serviceData,\n isMobile,\n onNextService,\n onPrevService,\n onEmptySlotClick,\n showPrevArrow,\n showNextArrow,\n minTime,\n maxTime,\n initialScrollTime,\n containerRef,\n loading,\n emptySlotPopover,\n blockedMessage = \"Unavailable\",\n}: ScheduleDayViewProps) => {\n // =============================================================================\n // CONST, STATE, REF\n // =============================================================================\n const timelineOffset = useTimelineOffset(minTime, maxTime);\n const bodyRef = useInitialScroll(loading, minTime, initialScrollTime);\n const headerRef = useRef<HTMLDivElement>(null);\n const timeSlots = useMemo(\n () => TimeHelper.generateTimings(30, \"24hr\", minTime, maxTime),\n [minTime, maxTime]\n );\n\n // =============================================================================\n // EVENT HANDLERS\n // =============================================================================\n // Handle empty slot click with slot details\n const handleEmptySlotClick = (time: string, serviceName: string) => {\n if (onEmptySlotClick) {\n const endTimeString = DateHelper.addMinutesToTime(time, 30);\n onEmptySlotClick({\n startTime: time,\n endTime: endTimeString,\n name: serviceName,\n });\n }\n };\n\n // Synchronize horizontal scrolling between header and body\n const handleBodyScroll = (_e: React.UIEvent<HTMLDivElement>) => {\n if (headerRef.current && bodyRef.current) {\n // Set a fixed buffer (17px) to prevent over-scrolling and misalignment\n const SCROLL_BUFFER = 17;\n const maxScrollLeft =\n bodyRef.current.scrollWidth -\n bodyRef.current.clientWidth -\n SCROLL_BUFFER;\n const currentScrollLeft = bodyRef.current.scrollLeft;\n if (currentScrollLeft > maxScrollLeft) {\n bodyRef.current.scrollLeft = maxScrollLeft;\n headerRef.current.scrollLeft = maxScrollLeft;\n } else {\n headerRef.current.scrollLeft = currentScrollLeft;\n }\n }\n };\n const handleHeaderScroll = (_e: React.UIEvent<HTMLDivElement>) => {\n if (headerRef.current && bodyRef.current) {\n bodyRef.current.scrollLeft = headerRef.current.scrollLeft;\n }\n };\n\n // =============================================================================\n // HELPER FUNCTIONS\n // =============================================================================\n // Find all slots that should be displayed in a given time cell\n const findSlotsForTimeCell = (\n service: ScheduleEntityProps,\n timeSlot: string\n ): ScheduleSlotProps[] => {\n if (!service.slots) return [];\n const timeSlotMinutes = TimeHelper.timeToMinutes(timeSlot);\n const nextTime = minutesToTime(timeSlotMinutes + 30);\n\n const slots = findSlotsStartingInTimeRange(\n service.slots,\n timeSlot,\n nextTime\n );\n\n return slots;\n };\n\n // Check if a time slot is covered by any existing booking\n const isServiceTimeSlotCovered = (\n service: ScheduleEntityProps,\n timeSlot: string\n ): boolean => {\n return service.slots\n ? isTimeCellCovered(service.slots, timeSlot)\n : false;\n };\n\n const getPopoverConfig = (\n service: ScheduleEntityProps,\n slot: ScheduleSlotProps \| undefined,\n time: string\n ) => {\n if (slot?.customPopover) {\n return slot.customPopover;\n }\n if (!isServiceTimeSlotCovered(service, time) && emptySlotPopover) {\n const endTimeString = DateHelper.addMinutesToTime(time, 30);\n const emptySlotData = {\n startTime: time,\n endTime: endTimeString,\n name: service.name,\n };\n return emptySlotPopover(emptySlotData);\n }\n\n return undefined;\n };\n\n // =============================================================================\n // RENDER FUNCTION\n // =============================================================================\n\n const renderHeader = () => {\n return (\n <ServiceContainer $columnCount={serviceData.length}>\n {serviceData.map((service) => (\n <ServiceColumn key={service.id}>\n {isMobile && (\n <ArrowContainer>\n {showPrevArrow && onPrevService && (\n <ArrowButton\n styleType=\"light\"\n sizeType=\"small\"\n onClick={onPrevService}\n aria-label=\"Previous service\"\n icon={<ChevronLeftIcon aria-hidden />}\n />\n )}\n </ArrowContainer>\n )}\n <ServiceHeaderContainer>\n <Title>{service.name}</Title>\n <Description>\n <span>\n {\n service.slots.filter(\n (cell) =>\n cell.status === \"available\"\n ).length\n }\n </span>{\" \"}\n available\n </Description>\n </ServiceHeaderContainer>\n {isMobile && showNextArrow && onNextService && (\n <ArrowButton\n styleType=\"light\"\n sizeType=\"small\"\n onClick={onNextService}\n aria-label=\"Next service\"\n icon={<ChevronRightIcon aria-hidden />}\n />\n )}\n </ServiceColumn>\n ))}\n </ServiceContainer>\n );\n };\n\n const renderSlotContent = (\n slot: ScheduleSlotProps,\n timeSlotStart: string\n ) => {\n const duration = TimeHelper.calculateDuration(\n slot.startTime,\n slot.endTime\n );\n const offsetTop = calculateSlotOffset(slot.startTime, timeSlotStart);\n return (\n <SlotContent\n $status={slot.status}\n $duration={duration}\n $offsetTop={offsetTop}\n onClick={(e: MouseEvent) =>\n slot.onClick && slot.onClick(slot, e)\n }\n >\n {duration >= 15 && (\n <>\n <SlotTime>\n {TimeHelper.parseInput(slot.startTime, \"12hr\")}\n {\"\\u2013\"}{\" \"}\n {TimeHelper.parseInput(slot.endTime, \"12hr\")}\n </SlotTime>\n <SlotAvailability>\n {slot.status === \"blocked\"\n ? blockedMessage\n : `${slot.booked} / ${slot.capacity}`}\n </SlotAvailability>\n </>\n )}\n </SlotContent>\n );\n };\n\n const renderSlotCell = (service: ScheduleEntityProps, time: string) => {\n const slots = findSlotsForTimeCell(service, time);\n if (slots.length > 0) {\n return (\n <SlotCell key={time} $dashed={time.endsWith(\":00\")}>\n {slots.map((slot, index) => {\n const popoverConfig = getPopoverConfig(\n service,\n slot,\n time\n );\n return (\n <WithOptionalPopover\n key={`${slot.id}-${index}`}\n containerRef={containerRef}\n customPopover={popoverConfig}\n >\n {renderSlotContent(slot, time)}\n </WithOptionalPopover>\n );\n })}\n </SlotCell>\n );\n } else {\n return (\n <SlotCell\n key={time}\n $dashed={time.endsWith(\":00\")}\n onClick={() => handleEmptySlotClick(time, service.name)}\n >\n <WithOptionalPopover\n containerRef={containerRef}\n customPopover={getPopoverConfig(\n service,\n undefined,\n time\n )}\n >\n <EmptySlot />\n </WithOptionalPopover>\n </SlotCell>\n );\n }\n };\n\n const renderTimeSlotGrid = () => {\n return (\n <SlotGrid $columnCount={serviceData.length}>\n {timelineOffset !== null && <Timeline $top={timelineOffset} />}\n {serviceData.map((service) => (\n <SlotColumn key={service.id}>\n {timeSlots.map((time) => renderSlotCell(service, time))}\n </SlotColumn>\n ))}\n </SlotGrid>\n );\n };\n\n return (\n <ScheduleContainer>\n {loading ? (\n <LoadingContainer>\n <ThemedLoadingSpinner />\n </LoadingContainer>\n ) : (\n <>\n {/* Service Name Header Row /}\n <HeaderContainer\n ref={headerRef}\n onScroll={handleHeaderScroll}\n $isMobile={isMobile}\n >\n <BlankCell />\n {renderHeader()}\n </HeaderContainer>\n\n <BodyContainer ref={bodyRef} onScroll={handleBodyScroll}>\n {/ Time labels /}\n <TimeIndicator\n minTime={minTime}\n maxTime={maxTime}\n format=\"24hr\"\n timelineOffset={timelineOffset}\n />\n {/ Time slot grid */}\n {renderTimeSlotGrid()}\n </BodyContainer>\n </>\n )}\n </ScheduleContainer>\n );\n};\n"],"names":["ServiceContainer","ServiceColumn","ArrowContainer","ArrowButton","ServiceHeaderContainer","Title","Description","SlotContent","SlotTime","SlotAvailability","SlotCell","EmptySlot","SlotGrid","Timeline","SlotColumn","ScheduleContainer","LoadingContainer","HeaderContainer","BlankCell","BodyContainer","styles","serviceData","isMobile","onNextService","onPrevService","onEmptySlotClick","showPrevArrow","showNextArrow","minTime","maxTime","initialScrollTime","containerRef","loading","emptySlotPopover","blockedMessage","timelineOffset","useTimelineOffset","bodyRef","useInitialScroll","headerRef","useRef","timeSlots","useMemo","TimeHelper","generateTimings","getPopoverConfig","service","slot","time","customPopover","timeSlot","slots","isTimeCellCovered","isServiceTimeSlotCovered","emptySlotData","startTime","endTime","DateHelper","addMinutesToTime","name","renderSlotContent","timeSlotStart","duration","calculateDuration","offsetTop","calculateSlotOffset","_jsx","$status","status","$duration","onClick","e","children","_jsxs","_Fragment","parseInput","booked","capacity","renderSlotCell","timeSlotMinutes","timeToMinutes","nextTime","minutesToTime","findSlotsStartingInTimeRange","findSlotsForTimeCell","length","$dashed","endsWith","map","index","popoverConfig","WithOptionalPopover","id","serviceName","endTimeString","handleEmptySlotClick","undefined","ThemedLoadingSpinner","ref","onScroll","_e","current","scrollLeft","$isMobile","$columnCount","styleType","sizeType","icon","ChevronLeftIcon","filter","cell","ChevronRightIcon","SCROLL_BUFFER","maxScrollLeft","scrollWidth","clientWidth","currentScrollLeft","TimeIndicator","format","$top"],"mappings":"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"}
1	+ {"version":3,"file":"schedule-day-view.js","sources":["../../../../src/schedule/schedule-day-view/schedule-day-view.tsx"],"sourcesContent":["import { ChevronLeftIcon, ChevronRightIcon } from \"@lifesg/react-icons\";\nimport clsx from \"clsx\";\nimport { useMemo, useRef } from \"react\";\n\nimport { ThemedLoadingSpinner } from \"../../animations/themed-loading-spinner/themed-loading-spinner\";\nimport { Button } from \"../../button\";\nimport { useApplyStyle } from \"../../theme\";\nimport { Typography } from \"../../typography\";\nimport { DateHelper } from \"../../util/date-helper\";\nimport { TimeHelper } from \"../../util/time-helper\";\nimport {\n calculateSlotOffset,\n findSlotsStartingInTimeRange,\n isTimeCellCovered,\n minutesToTime,\n ScheduleSlotContent,\n useInitialScroll,\n useTimelineOffset,\n} from \"../schedule-slot-content\";\nimport { WithOptionalPopover } from \"../shared/with-optional-popover\";\nimport { TimeIndicator } from \"../time-indicator/time-indicator\";\nimport type { ScheduleEntityProps, ScheduleSlotProps } from \"../types\";\nimport * as styles from \"./schedule-day-view.styles\";\nimport type { ScheduleDayViewProps } from \"./types\";\n\ninterface SlotContentItemProps {\n slot: ScheduleSlotProps;\n timeSlotStart: string;\n blockedMessage: string;\n}\n\nconst SlotContentItem = ({\n slot,\n timeSlotStart,\n blockedMessage,\n}: SlotContentItemProps) => {\n const offsetTop = calculateSlotOffset(slot.startTime, timeSlotStart);\n const duration = TimeHelper.calculateDuration(slot.startTime, slot.endTime);\n\n return (\n <ScheduleSlotContent\n slot={slot}\n offsetTop={offsetTop}\n tokens={styles.tokens.slotContent}\n classNames={{\n container: styles.slotContent,\n blocked: styles.slotContentBlocked,\n available: styles.slotContentAvailable,\n }}\n >\n {duration >= 15 && (\n <>\n <span className={styles.slotTime}>\n {TimeHelper.parseInput(slot.startTime, \"12hr\")}\n {\"\\u2013\"} {TimeHelper.parseInput(slot.endTime, \"12hr\")}\n </span>\n <span className={styles.slotAvailability}>\n {slot.status === \"blocked\"\n ? blockedMessage\n : `${slot.booked} / ${slot.capacity}`}\n </span>\n </>\n )}\n </ScheduleSlotContent>\n );\n};\n\nexport const ScheduleDayView = ({\n serviceData,\n isMobile,\n onNextService,\n onPrevService,\n onEmptySlotClick,\n showPrevArrow,\n showNextArrow,\n minTime,\n maxTime,\n initialScrollTime,\n containerRef,\n loading,\n emptySlotPopover,\n blockedMessage = \"Unavailable\",\n}: ScheduleDayViewProps) => {\n // =============================================================================\n // CONST, STATE, REF\n // =============================================================================\n const timelineOffset = useTimelineOffset(minTime, maxTime);\n const bodyRef = useInitialScroll(loading, minTime, initialScrollTime);\n const headerRef = useRef<HTMLDivElement>(null);\n const serviceContainerRef = useRef<HTMLDivElement>(null);\n const slotGridRef = useRef<HTMLDivElement>(null);\n const timelineRef = useRef<HTMLDivElement>(null);\n const timeSlots = useMemo(\n () => TimeHelper.generateTimings(30, \"24hr\", minTime, maxTime),\n [minTime, maxTime]\n );\n\n useApplyStyle(serviceContainerRef, {\n [styles.tokens.serviceContainer.columnCount]: `${serviceData.length}`,\n });\n\n useApplyStyle(slotGridRef, {\n [styles.tokens.slotGrid.columnCount]: `${serviceData.length}`,\n });\n\n useApplyStyle(timelineRef, {\n [styles.tokens.timeline.top]:\n timelineOffset === null ? null : `${timelineOffset}px`,\n });\n\n // =============================================================================\n // EVENT HANDLERS\n // =============================================================================\n // Handle empty slot click with slot details\n const handleEmptySlotClick = (time: string, serviceName: string) => {\n if (onEmptySlotClick) {\n const endTimeString = DateHelper.addMinutesToTime(time, 30);\n onEmptySlotClick({\n startTime: time,\n endTime: endTimeString,\n name: serviceName,\n });\n }\n };\n\n // Synchronize horizontal scrolling between header and body\n const handleBodyScroll = (_e: React.UIEvent<HTMLDivElement>) => {\n if (headerRef.current && bodyRef.current) {\n // Set a fixed buffer (17px) to prevent over-scrolling and misalignment\n const SCROLL_BUFFER = 17;\n const maxScrollLeft =\n bodyRef.current.scrollWidth -\n bodyRef.current.clientWidth -\n SCROLL_BUFFER;\n const currentScrollLeft = bodyRef.current.scrollLeft;\n if (currentScrollLeft > maxScrollLeft) {\n bodyRef.current.scrollLeft = maxScrollLeft;\n headerRef.current.scrollLeft = maxScrollLeft;\n } else {\n headerRef.current.scrollLeft = currentScrollLeft;\n }\n }\n };\n const handleHeaderScroll = (_e: React.UIEvent<HTMLDivElement>) => {\n if (headerRef.current && bodyRef.current) {\n bodyRef.current.scrollLeft = headerRef.current.scrollLeft;\n }\n };\n\n // =============================================================================\n // HELPER FUNCTIONS\n // =============================================================================\n // Find all slots that should be displayed in a given time cell\n const findSlotsForTimeCell = (\n service: ScheduleEntityProps,\n timeSlot: string\n ): ScheduleSlotProps[] => {\n if (!service.slots) return [];\n const timeSlotMinutes = TimeHelper.timeToMinutes(timeSlot);\n const nextTime = minutesToTime(timeSlotMinutes + 30);\n\n const slots = findSlotsStartingInTimeRange(\n service.slots,\n timeSlot,\n nextTime\n );\n\n return slots;\n };\n\n // Check if a time slot is covered by any existing booking\n const isServiceTimeSlotCovered = (\n service: ScheduleEntityProps,\n timeSlot: string\n ): boolean => {\n return service.slots\n ? isTimeCellCovered(service.slots, timeSlot)\n : false;\n };\n\n const getPopoverConfig = (\n service: ScheduleEntityProps,\n slot: ScheduleSlotProps \| undefined,\n time: string\n ) => {\n if (slot?.customPopover) {\n return slot.customPopover;\n }\n if (!isServiceTimeSlotCovered(service, time) && emptySlotPopover) {\n const endTimeString = DateHelper.addMinutesToTime(time, 30);\n const emptySlotData = {\n startTime: time,\n endTime: endTimeString,\n name: service.name,\n };\n return emptySlotPopover(emptySlotData);\n }\n\n return undefined;\n };\n\n // =============================================================================\n // RENDER FUNCTION\n // =============================================================================\n\n const renderHeader = () => {\n return (\n <div ref={serviceContainerRef} className={styles.serviceContainer}>\n {serviceData.map((service) => (\n <div key={service.id} className={styles.serviceColumn}>\n {isMobile && (\n <div className={styles.arrowContainer}>\n {showPrevArrow && onPrevService && (\n <Button\n className={styles.arrowButton}\n styleType=\"light\"\n sizeType=\"small\"\n onClick={onPrevService}\n aria-label=\"Previous service\"\n icon={<ChevronLeftIcon aria-hidden />}\n />\n )}\n </div>\n )}\n <div className={styles.serviceHeaderContainer}>\n <Typography.BodyMD className={styles.title}>\n {service.name}\n </Typography.BodyMD>\n <Typography.BodySM className={styles.description}>\n <span>\n {\n service.slots.filter(\n (cell) =>\n cell.status === \"available\"\n ).length\n }\n </span>{\" \"}\n available\n </Typography.BodySM>\n </div>\n {isMobile && showNextArrow && onNextService && (\n <Button\n className={styles.arrowButton}\n styleType=\"light\"\n sizeType=\"small\"\n onClick={onNextService}\n aria-label=\"Next service\"\n icon={<ChevronRightIcon aria-hidden />}\n />\n )}\n </div>\n ))}\n </div>\n );\n };\n\n const renderSlotContent = (\n slot: ScheduleSlotProps,\n timeSlotStart: string\n ) => {\n return (\n <SlotContentItem\n slot={slot}\n timeSlotStart={timeSlotStart}\n blockedMessage={blockedMessage}\n />\n );\n };\n\n const getSlotCellClassName = (time: string) =>\n clsx(styles.slotCell, time.endsWith(\":00\") && styles.slotCellDashed);\n\n const renderFilledSlotCell = (\n service: ScheduleEntityProps,\n time: string,\n slots: ScheduleSlotProps[]\n ) => {\n return (\n <div key={time} className={getSlotCellClassName(time)}>\n {slots.map((slot, index) => (\n <WithOptionalPopover\n key={`${slot.id}-${index}`}\n containerRef={containerRef}\n customPopover={getPopoverConfig(service, slot, time)}\n >\n {renderSlotContent(slot, time)}\n </WithOptionalPopover>\n ))}\n </div>\n );\n };\n\n const renderEmptySlotCell = (\n service: ScheduleEntityProps,\n time: string\n ) => {\n return (\n <div\n key={time}\n className={getSlotCellClassName(time)}\n onClick={() => handleEmptySlotClick(time, service.name)}\n data-testid={`empty-slot-${service.id}-${time}`}\n >\n <WithOptionalPopover\n containerRef={containerRef}\n customPopover={getPopoverConfig(service, undefined, time)}\n >\n <div className={styles.emptySlot} />\n </WithOptionalPopover>\n </div>\n );\n };\n\n const renderSlotCell = (service: ScheduleEntityProps, time: string) => {\n const slots = findSlotsForTimeCell(service, time);\n\n return slots.length > 0\n ? renderFilledSlotCell(service, time, slots)\n : renderEmptySlotCell(service, time);\n };\n\n const renderTimeSlotGrid = () => {\n return (\n <div ref={slotGridRef} className={styles.slotGrid}>\n {timelineOffset !== null && (\n <div ref={timelineRef} className={styles.timeline} />\n )}\n {serviceData.map((service) => (\n <div key={service.id} className={styles.slotColumn}>\n {timeSlots.map((time) => renderSlotCell(service, time))}\n </div>\n ))}\n </div>\n );\n };\n\n return (\n <div className={styles.scheduleContainer}>\n {loading ? (\n <div className={styles.loadingContainer}>\n <ThemedLoadingSpinner data-testid=\"loading-spinner\" />\n </div>\n ) : (\n <>\n {/* Service Name Header Row /}\n <div\n ref={headerRef}\n onScroll={handleHeaderScroll}\n className={clsx(\n styles.headerContainer,\n isMobile && styles.headerContainerMobile\n )}\n >\n <div className={styles.blankCell} />\n {renderHeader()}\n </div>\n\n <div\n className={styles.bodyContainer}\n ref={bodyRef}\n onScroll={handleBodyScroll}\n >\n {/ Time labels /}\n <TimeIndicator\n minTime={minTime}\n maxTime={maxTime}\n format=\"24hr\"\n timelineOffset={timelineOffset}\n />\n {/ Time slot grid */}\n {renderTimeSlotGrid()}\n </div>\n </>\n )}\n </div>\n );\n};\n"],"names":["SlotContentItem","slot","timeSlotStart","blockedMessage","offsetTop","calculateSlotOffset","startTime","duration","TimeHelper","calculateDuration","endTime","_jsx","ScheduleSlotContent","tokens","styles.tokens","slotContent","classNames","container","styles.slotContent","blocked","styles.slotContentBlocked","available","styles.slotContentAvailable","children","_jsxs","_Fragment","className","styles.slotTime","parseInput","styles.slotAvailability","status","booked","capacity","serviceData","isMobile","onNextService","onPrevService","onEmptySlotClick","showPrevArrow","showNextArrow","minTime","maxTime","initialScrollTime","containerRef","loading","emptySlotPopover","timelineOffset","useTimelineOffset","bodyRef","useInitialScroll","headerRef","useRef","serviceContainerRef","slotGridRef","timelineRef","timeSlots","useMemo","generateTimings","useApplyStyle","serviceContainer","columnCount","length","slotGrid","timeline","top","getPopoverConfig","service","time","customPopover","timeSlot","slots","isTimeCellCovered","isServiceTimeSlotCovered","emptySlotData","DateHelper","addMinutesToTime","name","renderSlotContent","getSlotCellClassName","clsx","styles.slotCell","endsWith","styles.slotCellDashed","renderEmptySlotCell","onClick","serviceName","endTimeString","handleEmptySlotClick","id","WithOptionalPopover","undefined","styles.emptySlot","renderSlotCell","timeSlotMinutes","timeToMinutes","nextTime","minutesToTime","findSlotsStartingInTimeRange","findSlotsForTimeCell","map","index","renderFilledSlotCell","styles.scheduleContainer","styles.loadingContainer","ThemedLoadingSpinner","ref","onScroll","_e","current","scrollLeft","styles.headerContainer","styles.headerContainerMobile","styles.blankCell","styles.serviceContainer","styles.serviceColumn","styles.arrowContainer","Button","styles.arrowButton","styleType","sizeType","icon","ChevronLeftIcon","styles.serviceHeaderContainer","Typography","BodyMD","styles.title","BodySM","styles.description","filter","cell","ChevronRightIcon","styles.bodyContainer","SCROLL_BUFFER","maxScrollLeft","scrollWidth","clientWidth","currentScrollLeft","TimeIndicator","format","styles.slotGrid","styles.timeline","styles.slotColumn"],"mappings":"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"}

package/cjs/schedule/schedule-day-view/schedule-day-view.styles.js CHANGED Viewed

@@ -1,153 +1,2 @@
-"use strict";var e=require("styled-components"),o=require("../../button/button.js"),r=require("../../shared/styles/index.js"),t=require("../../typography/index.js"),i=require("../../v3_theme/index.js"),d=require("../const.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=n(e);const s=l.default(o.Button)`
-    color: ${i.V3_Colour.icon};
-`,a=l.default.div`
-    width: 2rem;
-`,u=l.default.div`
-    display: flex;
-    flex-direction: column;
-    height: 100%;
-`,p=l.default.div`
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    min-height: 25rem;
-    height: 100%;
-    border: ${i.V3_Border["width-010"]} ${i.V3_Border.solid} ${i.V3_Colour.border};
-    border-radius: ${i.V3_Radius.md};
-    background: ${i.V3_Colour.bg};
-`,c=l.default.div`
-    z-index: 3;
-    max-height: ${d.HEADER_HEIGHT}px;
-    border-top-right-radius: ${i.V3_Radius.md};
-    border-top-left-radius: ${i.V3_Radius.md};
-    position: sticky;
-    border: ${i.V3_Border["width-010"]} ${i.V3_Border.solid} ${i.V3_Colour.border};
-    overflow-x: hidden;
-    overflow-y: hidden;
-    ${o=>o.$isMobile?e.css`
-                  display: block;
-                  overflow: hidden;
-              `:e.css`
-                  display: grid;
-                  grid-template-columns: ${d.TIME_INDICATOR_WIDTH}px 1fr;
-              `}
-`,g=l.default.div`
-    min-width: ${d.TIME_INDICATOR_WIDTH}px;
-    background: ${i.V3_Colour["bg-strong"]};
-    position: sticky;
-    left: 0;
-`,$=l.default.div`
-    display: grid;
-    grid-template-columns: repeat(${e=>e.$columnCount}, 1fr);
-`,_=l.default.div`
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    min-width: ${d.MIN_COLUMN_WIDTH}px;
-    padding: ${i.V3_Spacing["spacing-16"]} ${i.V3_Spacing["spacing-8"]};
-    background: ${i.V3_Colour["bg-strong"]};
-    border-right: ${i.V3_Border["width-010"]} ${i.V3_Border.solid}
-        ${i.V3_Colour.border};
-    &:last-child {
-        border-right: none;
-    }
-`,b=l.default.div`
-    width: 15rem;
-    padding-left: ${i.V3_Spacing["spacing-16"]};
-`,h=l.default(t.Typography.BodyMD)`
-    color: ${i.V3_Colour["text-primary"]};
-    font-weight: ${i.V3_Font.Spec["weight-semibold"]};
-    margin-top: 0;
-    ${r.lineClampCss(2)}
-    text-overflow: ellipsis;
-    word-wrap: break-word;
-`,x=l.default(t.Typography.BodySM)`
-    margin-top: ${i.V3_Spacing["spacing-8"]};
-    background-color: ${i.V3_Colour["bg-success-hover"]};
-    border-radius: ${i.V3_Radius.full};
-    width: fit-content;
-    padding: ${i.V3_Spacing["spacing-4"]} ${i.V3_Spacing["spacing-8"]};
-    color: ${i.V3_Colour["text-success"]};
-    font-weight: ${i.V3_Font.Spec["weight-regular"]};
-    span {
-        font-weight: ${i.V3_Font.Spec["weight-semibold"]};
-    }
-`,f=l.default.div`
-    display: grid;
-    grid-template-columns: ${d.TIME_INDICATOR_WIDTH}px 1fr;
-    width: 100%;
-    overflow-x: auto;
-    overflow-y: auto;
-    flex: 1;
-    height: 100%;
-    border: ${i.V3_Border["width-010"]} ${i.V3_Border.solid} ${i.V3_Colour.border};
-    border-top: none;
-    border-bottom-right-radius: ${i.V3_Radius.md};
-    border-bottom-left-radius: ${i.V3_Radius.md};
-`,V=l.default.div`
-    display: grid;
-    grid-template-columns: repeat(${e=>e.$columnCount}, 1fr);
-    min-width: max-content;
-    position: relative;
-`,m=l.default.div`
-    display: flex;
-    flex-direction: column;
-    min-width: ${d.MIN_COLUMN_WIDTH}px;
-    min-height: fit-content;
-    border-right: ${i.V3_Border["width-010"]} ${i.V3_Border.solid}
-        ${i.V3_Colour.border};
-    &:last-child {
-        border-right: none;
-    }
-`,C=l.default.div`
-    min-height: ${d.CELL_HEIGHT}px;
-    position: relative;
-    border-bottom: ${i.V3_Border["width-010"]} solid ${i.V3_Colour.border};
-    ${o=>o.$dashed&&e.css`
-            border-bottom-style: dashed;
-        `}
-    cursor: pointer;
-`,w=l.default(t.Typography.BodyXS)`
-    margin-top: 0;
-    overflow: hidden;
-    width: calc(100% - 27px);
-    padding: 2px ${i.V3_Spacing["spacing-8"]};
-    position: absolute;
-    top: ${e=>e.$offsetTop||0}px;
-    ${i.V3_Font["body-xs-semibold"]};
-    border-radius: ${i.V3_Radius.sm};
-    z-index: 1;
-    height: ${e=>e.$duration?e.$duration/30*d.CELL_HEIGHT-1+"px":d.CELL_HEIGHT-1+"px"};
-    display: flex;
-    justify-content: space-between;
-    background: ${o=>{switch(o.$status){case"pending":return e.css`
-                    repeating-linear-gradient(
-                        135deg,
-                        ${i.V3_Colour["bg-warning"]},
-                        ${i.V3_Colour["bg-warning"]} 5px,
-                        ${i.V3_Colour["bg-warning-hover"]} 5px,
-                        ${i.V3_Colour["bg-warning-hover"]} 10px
-                    )
-                `;case"blocked":return i.V3_Colour["bg-inverse-subtle"];case"available":return i.V3_Colour["bg-success-hover"];case"booked":return i.V3_Colour["bg-primary-subtler"];default:return i.V3_Colour.bg}}};
-    color: ${e=>"blocked"===e.$status?i.V3_Colour["text-inverse"]:i.V3_Colour["text-subtle"]};
-    border-left: ${i.V3_Border["width-040"]} solid
-        ${e=>"available"===e.$status?i.V3_Colour["icon-success"]:"none"};
-`,y=l.default.span`
-    ${i.V3_Font["body-xs-regular"]};
-`,v=l.default.span`
-    ${i.V3_Font["body-xs-semibold"]};
-`,S=l.default.div`
-    position: absolute;
-    width: 100%;
-    height: 2px;
-    background: ${i.V3_Colour["icon-primary"]};
-    top: ${e=>e.$top}px;
-    z-index: 2;
-`,T=l.default.div`
-    width: 100%;
-    height: ${d.CELL_HEIGHT-1}px;
-`;exports.ArrowButton=s,exports.ArrowContainer=a,exports.BlankCell=g,exports.BodyContainer=f,exports.Description=x,exports.EmptySlot=T,exports.HeaderContainer=c,exports.LoadingContainer=p,exports.ScheduleContainer=u,exports.ServiceColumn=_,exports.ServiceContainer=$,exports.ServiceHeaderContainer=b,exports.SlotAvailability=v,exports.SlotCell=C,exports.SlotColumn=m,exports.SlotContent=w,exports.SlotGrid=V,exports.SlotTime=y,exports.Timeline=S,exports.Title=h;
+"use strict";require("./schedule-day-view.styles_8ti149.css");exports.arrowButton="a1gk5ipc",exports.arrowContainer="ac6jj8s",exports.blankCell="bcdvy5w",exports.bodyContainer="b10f0jd9",exports.description="d1s1gqx7",exports.emptySlot="e1xn1uhc",exports.headerContainer="h7zv0mp",exports.headerContainerMobile="h189uqeu",exports.loadingContainer="lfazoz2",exports.scheduleContainer="syko8xg",exports.serviceColumn="s16mh3td",exports.serviceContainer="s1shiknn",exports.serviceHeaderContainer="surbskl",exports.slotAvailability="s2as1da",exports.slotCell="s1m5etm4",exports.slotCellDashed="s5nw100",exports.slotColumn="s1ftjtjk",exports.slotContent="s1kbe3yg",exports.slotContentAvailable="s4ebyxx",exports.slotContentBlocked="s1c4k21e",exports.slotGrid="ssw76ta",exports.slotTime="s1cpyxi3",exports.timeline="t42sdto",exports.title="t1vhhu8o",exports.tokens={serviceContainer:{columnCount:"--fds-internal-scheduleDayView-serviceContainer-columnCount"},slotGrid:{columnCount:"--fds-internal-scheduleDayView-slotGrid-columnCount"},slotContent:{offsetTop:"--fds-internal-scheduleDayView-slotContent-offsetTop",height:"--fds-internal-scheduleDayView-slotContent-height"},timeline:{top:"--fds-internal-scheduleDayView-timeline-top"}};
 //# sourceMappingURL=schedule-day-view.styles.js.map

package/cjs/schedule/schedule-day-view/schedule-day-view.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"schedule-day-view.styles.js","sources":["../../../../src/schedule/schedule-day-view/schedule-day-view.styles.tsx"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nimport { Button } from \"../../button\";\nimport { lineClampCss } from \"../../shared/styles\";\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 {\n CELL_HEIGHT,\n HEADER_HEIGHT,\n MIN_COLUMN_WIDTH,\n TIME_INDICATOR_WIDTH,\n} from \"../const\";\n\n// =============================================================================\n// STYLE INTERFACES\n// =============================================================================\ninterface HeaderContainerStyleProps {\n $isMobile: boolean;\n}\n\ninterface ServiceContainerStyleProps {\n $columnCount: number;\n}\n\ninterface SlotGridStyleProps {\n $columnCount: number;\n}\n\ninterface SlotCellStyleProps {\n $dashed?: boolean;\n}\n\ninterface SlotContentStyleProps {\n $status?: string;\n $duration?: number;\n $offsetTop?: number;\n}\n\ninterface TimelineStyleProps {\n $top: number;\n}\n\n// =============================================================================\n// STYLING\n// =============================================================================\nexport const ArrowButton = styled(Button)`\n color: ${V3_Colour[\"icon\"]};\n`;\nexport const ArrowContainer = styled.div`\n width: 2rem;\n`;\n\nexport const ScheduleContainer = styled.div`\n display: flex;\n flex-direction: column;\n height: 100%;\n`;\n\nexport const LoadingContainer = styled.div`\n display: flex;\n justify-content: center;\n align-items: center;\n min-height: 25rem;\n height: 100%;\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 HeaderContainer = styled.div<HeaderContainerStyleProps>`\n z-index: 3;\n max-height: ${HEADER_HEIGHT}px;\n border-top-right-radius: ${V3_Radius[\"md\"]};\n border-top-left-radius: ${V3_Radius[\"md\"]};\n position: sticky;\n border: ${V3_Border[\"width-010\"]} ${V3_Border.solid} ${V3_Colour[\"border\"]};\n overflow-x: hidden;\n overflow-y: hidden;\n\n ${(props) =>\n props.$isMobile\n ? css`\n display: block;\n overflow: hidden;\n `\n : css`\n display: grid;\n grid-template-columns: ${TIME_INDICATOR_WIDTH}px 1fr;\n `}\n`;\n\nexport const BlankCell = styled.div`\n min-width: ${TIME_INDICATOR_WIDTH}px;\n background: ${V3_Colour[\"bg-strong\"]};\n position: sticky;\n left: 0;\n`;\nexport const ServiceContainer = styled.div<ServiceContainerStyleProps>`\n display: grid;\n grid-template-columns: repeat(${(props) => props.$columnCount}, 1fr);\n`;\n\nexport const ServiceColumn = styled.div`\n display: flex;\n justify-content: space-between;\n align-items: center;\n min-width: ${MIN_COLUMN_WIDTH}px;\n padding: ${V3_Spacing[\"spacing-16\"]} ${V3_Spacing[\"spacing-8\"]};\n background: ${V3_Colour[\"bg-strong\"]};\n border-right: ${V3_Border[\"width-010\"]} ${V3_Border.solid}\n ${V3_Colour[\"border\"]};\n &:last-child {\n border-right: none;\n }\n`;\n\nexport const ServiceHeaderContainer = styled.div`\n width: 15rem;\n padding-left: ${V3_Spacing[\"spacing-16\"]};\n`;\n\nexport const Title = styled(Typography.BodyMD)`\n color: ${V3_Colour[\"text-primary\"]};\n font-weight: ${V3_Font.Spec[\"weight-semibold\"]};\n margin-top: 0;\n ${lineClampCss(2)}\n text-overflow: ellipsis;\n word-wrap: break-word;\n`;\n\nexport const Description = styled(Typography.BodySM)`\n margin-top: ${V3_Spacing[\"spacing-8\"]};\n background-color: ${V3_Colour[\"bg-success-hover\"]};\n border-radius: ${V3_Radius[\"full\"]};\n width: fit-content;\n padding: ${V3_Spacing[\"spacing-4\"]} ${V3_Spacing[\"spacing-8\"]};\n color: ${V3_Colour[\"text-success\"]};\n font-weight: ${V3_Font.Spec[\"weight-regular\"]};\n span {\n font-weight: ${V3_Font.Spec[\"weight-semibold\"]};\n }\n`;\n\nexport const BodyContainer = styled.div`\n display: grid;\n grid-template-columns: ${TIME_INDICATOR_WIDTH}px 1fr;\n width: 100%;\n overflow-x: auto;\n overflow-y: auto;\n flex: 1;\n height: 100%;\n border: ${V3_Border[\"width-010\"]} ${V3_Border.solid} ${V3_Colour[\"border\"]};\n border-top: none;\n border-bottom-right-radius: ${V3_Radius[\"md\"]};\n border-bottom-left-radius: ${V3_Radius[\"md\"]};\n`;\n\nexport const SlotGrid = styled.div<SlotGridStyleProps>`\n display: grid;\n grid-template-columns: repeat(${(props) => props.$columnCount}, 1fr);\n min-width: max-content;\n position: relative;\n`;\n\nexport const SlotColumn = styled.div`\n display: flex;\n flex-direction: column;\n min-width: ${MIN_COLUMN_WIDTH}px;\n min-height: fit-content;\n border-right: ${V3_Border[\"width-010\"]} ${V3_Border.solid}\n ${V3_Colour[\"border\"]};\n &:last-child {\n border-right: none;\n }\n`;\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 SlotContent = styled(Typography.BodyXS)<SlotContentStyleProps>`\n margin-top: 0;\n overflow: hidden;\n width: calc(100% - 27px);\n padding: 2px ${V3_Spacing[\"spacing-8\"]};\n position: absolute;\n top: ${(props) => props.$offsetTop \|\| 0}px;\n ${V3_Font[\"body-xs-semibold\"]};\n border-radius: ${V3_Radius[\"sm\"]};\n z-index: 1;\n height: ${(props) =>\n props.$duration\n ? `${(props.$duration / 30) * CELL_HEIGHT - 1}px`\n : `${CELL_HEIGHT - 1}px`};\n display: flex;\n justify-content: space-between;\n background: ${(props) => {\n switch (props.$status) {\n case \"pending\":\n return css`\n repeating-linear-gradient(\n 135deg,\n ${V3_Colour[\"bg-warning\"]},\n ${V3_Colour[\"bg-warning\"]} 5px,\n ${V3_Colour[\"bg-warning-hover\"]} 5px,\n ${V3_Colour[\"bg-warning-hover\"]} 10px\n )\n `;\n case \"blocked\":\n return V3_Colour[\"bg-inverse-subtle\"];\n case \"available\":\n return V3_Colour[\"bg-success-hover\"];\n case \"booked\":\n return V3_Colour[\"bg-primary-subtler\"];\n default:\n return V3_Colour[\"bg\"];\n }\n }};\n\n color: ${(props) =>\n props.$status === \"blocked\"\n ? V3_Colour[\"text-inverse\"]\n : V3_Colour[\"text-subtle\"]};\n\n border-left: ${V3_Border[\"width-040\"]} solid\n ${(props) =>\n props.$status === \"available\" ? V3_Colour[\"icon-success\"] : \"none\"};\n`;\n\nexport const SlotTime = styled.span`\n ${V3_Font[\"body-xs-regular\"]};\n`;\n\nexport const SlotAvailability = styled.span`\n ${V3_Font[\"body-xs-semibold\"]};\n`;\n\nexport const Timeline = styled.div<TimelineStyleProps>`\n position: absolute;\n width: 100%;\n height: 2px;\n background: ${V3_Colour[\"icon-primary\"]};\n top: ${(props) => props.$top}px;\n z-index: 2;\n`;\n\nexport const EmptySlot = styled.div`\n width: 100%;\n height: ${CELL_HEIGHT - 1}px;\n`;\n"],"names":["ArrowButton","styled","Button","V3_Colour","ArrowContainer","div","ScheduleContainer","LoadingContainer","V3_Border","solid","V3_Radius","HeaderContainer","HEADER_HEIGHT","props","$isMobile","css","TIME_INDICATOR_WIDTH","BlankCell","ServiceContainer","$columnCount","ServiceColumn","MIN_COLUMN_WIDTH","V3_Spacing","ServiceHeaderContainer","Title","Typography","BodyMD","V3_Font","Spec","lineClampCss","Description","BodySM","BodyContainer","SlotGrid","SlotColumn","SlotCell","CELL_HEIGHT","$dashed","SlotContent","BodyXS","$offsetTop","$duration","$status","SlotTime","span","SlotAvailability","Timeline","$top","EmptySlot"],"mappings":"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"}
1	+ {"version":3,"file":"schedule-day-view.styles.js","sources":["../../../../src/schedule/schedule-day-view/schedule-day-view.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { lineClampCss } from \"../../shared/styles\";\nimport { Border, Colour, Font, Radius, Spacing } from \"../../theme\";\nimport {\n CELL_HEIGHT,\n HEADER_HEIGHT,\n MIN_COLUMN_WIDTH,\n TIME_INDICATOR_WIDTH,\n} from \"../const\";\n\n// =============================================================================\n// STYLING\n// =============================================================================\nexport const tokens = {\n serviceContainer: {\n columnCount:\n \"--fds-internal-scheduleDayView-serviceContainer-columnCount\",\n },\n slotGrid: {\n columnCount: \"--fds-internal-scheduleDayView-slotGrid-columnCount\",\n },\n slotContent: {\n offsetTop: \"--fds-internal-scheduleDayView-slotContent-offsetTop\",\n height: \"--fds-internal-scheduleDayView-slotContent-height\",\n },\n timeline: {\n top: \"--fds-internal-scheduleDayView-timeline-top\",\n },\n};\n\nexport const arrowButton = css`\n color: ${Colour[\"icon\"]};\n`;\nexport const arrowContainer = css`\n width: 2rem;\n`;\n\nexport const scheduleContainer = css`\n display: flex;\n flex-direction: column;\n height: 100%;\n`;\n\nexport const loadingContainer = css`\n display: flex;\n justify-content: center;\n align-items: center;\n min-height: 25rem;\n height: 100%;\n border: ${Border[\"width-010\"]} ${Border.solid} ${Colour[\"border\"]};\n border-radius: ${Radius[\"md\"]};\n background: ${Colour[\"bg\"]};\n`;\n\nexport const headerContainer = css`\n z-index: 3;\n max-height: ${HEADER_HEIGHT}px;\n border-top-right-radius: ${Radius[\"md\"]};\n border-top-left-radius: ${Radius[\"md\"]};\n position: sticky;\n border: ${Border[\"width-010\"]} ${Border.solid} ${Colour[\"border\"]};\n overflow-x: hidden;\n overflow-y: hidden;\n display: grid;\n grid-template-columns: ${TIME_INDICATOR_WIDTH}px 1fr;\n`;\n\nexport const headerContainerMobile = css`\n display: block;\n overflow: hidden;\n`;\n\nexport const blankCell = css`\n min-width: ${TIME_INDICATOR_WIDTH}px;\n background: ${Colour[\"bg-strong\"]};\n position: sticky;\n left: 0;\n`;\nexport const serviceContainer = css`\n ${tokens.serviceContainer.columnCount}: 1;\n display: grid;\n grid-template-columns: repeat(\n var(${tokens.serviceContainer.columnCount}),\n 1fr\n );\n`;\n\nexport const serviceColumn = css`\n display: flex;\n justify-content: space-between;\n align-items: center;\n min-width: ${MIN_COLUMN_WIDTH}px;\n padding: ${Spacing[\"spacing-16\"]} ${Spacing[\"spacing-8\"]};\n background: ${Colour[\"bg-strong\"]};\n border-right: ${Border[\"width-010\"]} ${Border.solid} ${Colour[\"border\"]};\n &:last-child {\n border-right: none;\n }\n`;\n\nexport const serviceHeaderContainer = css`\n width: 15rem;\n padding-left: ${Spacing[\"spacing-16\"]};\n`;\n\nexport const title = css`\n color: ${Colour[\"text-primary\"]};\n font-weight: ${Font.Spec[\"weight-semibold\"]};\n margin-top: 0;\n ${lineClampCss(2)}\n text-overflow: ellipsis;\n word-wrap: break-word;\n`;\n\nexport const description = css`\n margin-top: ${Spacing[\"spacing-8\"]};\n background-color: ${Colour[\"bg-success-hover\"]};\n border-radius: ${Radius[\"full\"]};\n width: fit-content;\n padding: ${Spacing[\"spacing-4\"]} ${Spacing[\"spacing-8\"]};\n color: ${Colour[\"text-success\"]};\n font-weight: ${Font.Spec[\"weight-regular\"]};\n span {\n font-weight: ${Font.Spec[\"weight-semibold\"]};\n }\n`;\n\nexport const bodyContainer = css`\n display: grid;\n grid-template-columns: ${TIME_INDICATOR_WIDTH}px 1fr;\n width: 100%;\n overflow-x: auto;\n overflow-y: auto;\n flex: 1;\n height: 100%;\n border: ${Border[\"width-010\"]} ${Border.solid} ${Colour[\"border\"]};\n border-top: none;\n border-bottom-right-radius: ${Radius[\"md\"]};\n border-bottom-left-radius: ${Radius[\"md\"]};\n`;\n\nexport const slotGrid = css`\n ${tokens.slotGrid.columnCount}: 1;\n display: grid;\n grid-template-columns: repeat(var(${tokens.slotGrid.columnCount}), 1fr);\n min-width: max-content;\n position: relative;\n`;\n\nexport const slotColumn = css`\n display: flex;\n flex-direction: column;\n min-width: ${MIN_COLUMN_WIDTH}px;\n min-height: fit-content;\n border-right: ${Border[\"width-010\"]} ${Border.solid} ${Colour[\"border\"]};\n &:last-child {\n border-right: none;\n }\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 background: none;\n width: 100%;\n padding: 0;\n text-align: left;\n`;\n\nexport const slotCellDashed = css`\n border-bottom-style: dashed;\n`;\n\nexport const slotContent = css`\n ${tokens.slotContent.offsetTop}: 0px;\n ${tokens.slotContent.height}: ${CELL_HEIGHT - 1}px;\n margin-top: 0;\n overflow: hidden;\n width: calc(100% - 27px);\n padding: 2px ${Spacing[\"spacing-8\"]};\n position: absolute;\n top: var(${tokens.slotContent.offsetTop});\n ${Font[\"body-xs-semibold\"]};\n border-radius: ${Radius[\"sm\"]};\n z-index: 1;\n height: var(${tokens.slotContent.height});\n display: flex;\n justify-content: space-between;\n color: ${Colour[\"text-subtle\"]};\n`;\n\nexport const slotContentBlocked = css`\n color: ${Colour[\"text-inverse\"]};\n`;\n\nexport const slotContentAvailable = css`\n border-left: ${Border[\"width-040\"]} solid ${Colour[\"icon-success\"]};\n`;\n\nexport const slotTime = css`\n ${Font[\"body-xs-regular\"]};\n`;\n\nexport const slotAvailability = css`\n ${Font[\"body-xs-semibold\"]};\n`;\n\nexport const timeline = css`\n ${tokens.timeline.top}: 0px;\n position: absolute;\n width: 100%;\n height: 2px;\n background: ${Colour[\"icon-primary\"]};\n top: var(${tokens.timeline.top});\n z-index: 2;\n`;\n\nexport const emptySlot = css`\n width: 100%;\n height: ${CELL_HEIGHT - 1}px;\n`;\n"],"names":["serviceContainer","columnCount","slotGrid","slotContent","offsetTop","height","timeline","top"],"mappings":"4HA+BwB,kCAGG,4BAuCL,gCAuDI,+BAbF,6BAyGF,mCArKM,wCAaM,oCAxBL,oCANC,gCAkDJ,oCATG,0CAsBM,mCAyGN,2BA7CR,kCAWM,6BAtBJ,+BA0BC,wCAsBS,qCAJF,4BApDV,2BA4DA,4BAQA,wBAxGH,0BA5FI,CAClBA,iBAAkB,CACdC,YACI,+DAERC,SAAU,CACND,YAAa,uDAEjBE,YAAa,CACTC,UAAW,uDACXC,OAAQ,qDAEZC,SAAU,CACNC,IAAK"}

package/cjs/schedule/schedule-day-view/schedule-day-view.styles_8ti149.css ADDED Viewed

@@ -0,0 +1,30 @@
+.a1gk5ipc{color:var(--fds-colour-icon);}
+.ac6jj8s{width:2rem;}
+.syko8xg{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;height:100%;}
+.lfazoz2{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;min-height:25rem;height:100%;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);}
+.h7zv0mp{z-index:3;max-height:130px;border-top-right-radius:var(--fds-radius-md);border-top-left-radius:var(--fds-radius-md);position:-webkit-sticky;position:sticky;border:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);overflow-x:hidden;overflow-y:hidden;display:-ms-grid;display:grid;-ms-grid-columns:42px 1fr;grid-template-columns:42px 1fr;}
+.h189uqeu{display:block;overflow:hidden;}
+.bcdvy5w{min-width:42px;background:var(--fds-colour-bg-strong);position:-webkit-sticky;position:sticky;left:0;}
+.s1shiknn{--fds-internal-scheduleDayView-serviceContainer-columnCount:1;display:-ms-grid;display:grid;-ms-grid-columns:repeat(
+        var(--fds-internal-scheduleDayView-serviceContainer-columnCount),
+        1fr
+    );grid-template-columns:repeat(
+        var(--fds-internal-scheduleDayView-serviceContainer-columnCount),
+        1fr
+    );}
+.s16mh3td{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;min-width:280px;padding:var(--fds-spacing-16) var(--fds-spacing-8);background:var(--fds-colour-bg-strong);border-right:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);}.s16mh3td:last-child{border-right:none;}
+.surbskl{width:15rem;padding-left:var(--fds-spacing-16);}
+.t1vhhu8o{color:var(--fds-colour-text-primary);font-weight:var(--fds-font-weight-semibold);margin-top:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;word-wrap:break-word;}
+.d1s1gqx7{margin-top:var(--fds-spacing-8);background-color:var(--fds-colour-bg-success-hover);border-radius:var(--fds-radius-full);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;padding:var(--fds-spacing-4) var(--fds-spacing-8);color:var(--fds-colour-text-success);font-weight:var(--fds-font-weight-regular);}.d1s1gqx7 span{font-weight:var(--fds-font-weight-semibold);}
+.b10f0jd9{display:-ms-grid;display:grid;-ms-grid-columns:42px 1fr;grid-template-columns:42px 1fr;width:100%;overflow-x:auto;overflow-y:auto;-webkit-flex:1;-ms-flex:1;flex:1;height:100%;border:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);border-top:none;border-bottom-right-radius:var(--fds-radius-md);border-bottom-left-radius:var(--fds-radius-md);}
+.ssw76ta{--fds-internal-scheduleDayView-slotGrid-columnCount:1;display:-ms-grid;display:grid;-ms-grid-columns:repeat(var(--fds-internal-scheduleDayView-slotGrid-columnCount), 1fr);grid-template-columns:repeat(var(--fds-internal-scheduleDayView-slotGrid-columnCount), 1fr);min-width:-webkit-max-content;min-width:-moz-max-content;min-width:max-content;position:relative;}
+.s1ftjtjk{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;min-width:280px;min-height:-webkit-fit-content;min-height:-moz-fit-content;min-height:fit-content;border-right:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);}.s1ftjtjk:last-child{border-right:none;}
+.s1m5etm4{min-height:48px;position:relative;border-bottom:var(--fds-border-width-010) solid var(--fds-colour-border);cursor:pointer;background:none;width:100%;padding:0;text-align:left;}
+.s5nw100{border-bottom-style:dashed;}
+.s1kbe3yg{--fds-internal-scheduleDayView-slotContent-offsetTop:0px;--fds-internal-scheduleDayView-slotContent-height:47px;margin-top:0;overflow:hidden;width:calc(100% - 27px);padding:2px var(--fds-spacing-8);position:absolute;top:var(--fds-internal-scheduleDayView-slotContent-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);border-radius:var(--fds-radius-sm);z-index:1;height:var(--fds-internal-scheduleDayView-slotContent-height);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;color:var(--fds-colour-text-subtle);}
+.s1c4k21e{color:var(--fds-colour-text-inverse);}
+.s4ebyxx{border-left:var(--fds-border-width-040) solid var(--fds-colour-icon-success);}
+.s1cpyxi3{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);}
+.s2as1da{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);}
+.t42sdto{--fds-internal-scheduleDayView-timeline-top:0px;position:absolute;width:100%;height:2px;background:var(--fds-colour-icon-primary);top:var(--fds-internal-scheduleDayView-timeline-top);z-index:2;}
+.e1xn1uhc{width:100%;height:47px;}

package/cjs/schedule/schedule-header/schedule-header.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),a=require("../../input-select/input-select.js");require("../../util/calendar-helper.js");var r=require("../../util/date-helper.js");require("../../external/dayjs/dayjs.min.js"),require("react"),require("../../util/simple-id-generator.js"),require("../../util/string-helper.js"),require("@react-aria/live-announcer");var i=require("./schedule-header.style.js");exports.ScheduleHeader=l=>{var{date:n,view:s="day",minDate:o,maxDate:c,onPreviousDayClick:d,onNextDayClick:u,onCalendarDateSelect:D,onViewChange:y,onTodayClick:j}=l,h=e.__rest(l,["date","view","minDate","maxDate","onPreviousDayClick","onNextDayClick","onCalendarDateSelect","onViewChange","onTodayClick"]);const p=[{label:"Day",value:"day"},{label:"Week",value:"week"}],x=p.find((e=>e.value===s));return t.jsxs(i.ScheduleHeaderWrapper,Object.assign({},h,{children:[t.jsxs(i.LeftSection,{children:[t.jsx(i.StyledButton,{styleType:"light",onClick:j,children:"Today"}),t.jsx(i.StyledDateNavigator,{selectedDate:n,minDate:o,maxDate:c,view:s,onLeftArrowClick:e=>{if("week"===s){const t=r.DateHelper.toDayjs(e).subtract(1,"week");d(t.format("YYYY-MM-DD"))}else d(e)},onRightArrowClick:e=>{if("week"===s){const t=r.DateHelper.toDayjs(e).add(1,"week");u(t.format("YYYY-MM-DD"))}else u(e)},onCalendarDateSelect:D})]}),t.jsxs(i.RightSection,{children:[t.jsx(i.StyledText,{children:"View by:"}),t.jsx(a.InputSelect,{options:p,selectedOption:x,onSelectOption:e=>null==y?void 0:y(e.value),listExtractor:e=>e.label,displayValueExtractor:e=>e.label,dropdownWidth:i.DROPDOWN_WIDTH})]})]}))};
+"use strict";var e=require("../../_virtual/_tslib.js"),a=require("react/jsx-runtime"),t=require("../../button/button.js"),r=require("../../date-navigator/date-navigator.js"),i=require("../../input-select/input-select.js"),l=require("../../typography/index.js");require("../../util/calendar-helper.js");var s=require("../../util/date-helper.js");require("../../external/dayjs/dayjs.min.js"),require("react"),require("../../util/simple-id-generator.js"),require("../../util/string-helper.js"),require("@react-aria/live-announcer");var n=require("./schedule-header.styles.js");exports.ScheduleHeader=o=>{var{date:c,view:d="day",minDate:u,maxDate:D,onPreviousDayClick:j,onNextDayClick:y,onCalendarDateSelect:v,onViewChange:p,onTodayClick:h}=o,x=e.__rest(o,["date","view","minDate","maxDate","onPreviousDayClick","onNextDayClick","onCalendarDateSelect","onViewChange","onTodayClick"]);const m=[{label:"Day",value:"day"},{label:"Week",value:"week"}],k=m.find((e=>e.value===d));return a.jsxs("div",Object.assign({className:n.scheduleHeaderWrapper},x,{children:[a.jsxs("div",{className:n.leftSection,children:[a.jsx(t.Button,{className:n.button,styleType:"light",onClick:h,children:"Today"}),a.jsx(r.DateNavigator,{className:n.dateNavigator,selectedDate:c,minDate:u,maxDate:D,view:d,onLeftArrowClick:e=>{if("week"===d){const a=s.DateHelper.toDayjs(e).subtract(1,"week");j(a.format("YYYY-MM-DD"))}else j(e)},onRightArrowClick:e=>{if("week"===d){const a=s.DateHelper.toDayjs(e).add(1,"week");y(a.format("YYYY-MM-DD"))}else y(e)},onCalendarDateSelect:v})]}),a.jsxs("div",{className:n.rightSection,children:[a.jsx(l.Typography.BodyMD,{className:n.text,children:"View by:"}),a.jsx(i.InputSelect,{options:m,selectedOption:k,onSelectOption:e=>null==p?void 0:p(e.value),listExtractor:e=>e.label,displayValueExtractor:e=>e.label,dropdownWidth:n.DROPDOWN_WIDTH})]})]}))};
 //# sourceMappingURL=schedule-header.js.map

package/cjs/schedule/schedule-header/schedule-header.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"schedule-header.js","sources":["../../../../src/schedule/schedule-header/schedule-header.tsx"],"sourcesContent":["import { InputSelect } from \"../../input-select\";\nimport { DateHelper } from \"../../util\";\nimport type { ScheduleView } from \"../types\";\nimport ~~{\n DROPDOWN_WIDTH,\n LeftSection,\n RightSection,\n ScheduleHeaderWrapper,\n StyledButton,\n StyledDateNavigator,\n StyledText,\n}~~ from \"./schedule-header.~~style~~\";\n\nexport interface ScheduleHeaderProps {\n id?: string \| undefined;\n date: string;\n view: ScheduleView;\n minDate?: string \| undefined;\n maxDate?: string \| undefined;\n onPreviousDayClick: (currentDate: string) => void;\n onNextDayClick: (currentDate: string) => void;\n onCalendarDateSelect?: (currentDate: string) => void;\n onViewChange?: (view: ScheduleView) => void;\n onTodayClick?: () => void;\n}\n\nexport const ScheduleHeader = ({\n date,\n view = \"day\",\n minDate,\n maxDate,\n onPreviousDayClick,\n onNextDayClick,\n onCalendarDateSelect,\n onViewChange,\n onTodayClick,\n ...otherProps\n}: ScheduleHeaderProps) => {\n const viewOptions: Array<{ label: string; value: ScheduleView }> = [\n { label: \"Day\", value: \"day\" },\n { label: \"Week\", value: \"week\" },\n ];\n const selectedViewOption = viewOptions.find(\n (option) => option.value === view\n );\n\n // Handle navigation based on view type\n const handleLeftArrowClick = (currentDate: string) => {\n if (view === \"week\") {\n const currentDateObj = DateHelper.toDayjs(currentDate);\n const previousWeek = currentDateObj.subtract(1, \"week\");\n onPreviousDayClick(previousWeek.format(\"YYYY-MM-DD\"));\n } else {\n onPreviousDayClick(currentDate);\n }\n };\n\n const handleRightArrowClick = (currentDate: string) => {\n if (view === \"week\") {\n const currentDateObj = DateHelper.toDayjs(currentDate);\n const nextWeek = currentDateObj.add(1, \"week\");\n onNextDayClick(nextWeek.format(\"YYYY-MM-DD\"));\n } else {\n onNextDayClick(currentDate);\n }\n };\n\n return (\n <~~ScheduleHeaderWrapper~~ {...otherProps}>\n <~~LeftSection~~>\n <~~StyledButton~~ styleType=\"light\" onClick={onTodayClick}>\n Today\n </~~StyledButton~~>\n <~~StyledDateNavigator~~\n selectedDate={date}\n minDate={minDate}\n maxDate={maxDate}\n view={view}\n onLeftArrowClick={handleLeftArrowClick}\n onRightArrowClick={handleRightArrowClick}\n onCalendarDateSelect={onCalendarDateSelect}\n />\n </~~LeftSection~~>\n\n <~~RightSection~~>\n <~~StyledText>~~View by~~:</StyledText~~>\n <InputSelect\n options={viewOptions}\n selectedOption={selectedViewOption}\n onSelectOption={(option) => onViewChange?.(option.value)}\n listExtractor={(option) => option.label}\n displayValueExtractor={(option) => option.label}\n dropdownWidth={DROPDOWN_WIDTH}\n />\n </~~RightSection~~>\n </~~ScheduleHeaderWrapper~~>\n );\n};\n"],"names":["_a","date","view","minDate","maxDate","onPreviousDayClick","onNextDayClick","onCalendarDateSelect","onViewChange","onTodayClick","otherProps","__rest","viewOptions","label","value","selectedViewOption","find","option","_jsxs","~~ScheduleHeaderWrapper~~","~~Object~~","~~assign~~","~~children~~","~~LeftSection~~","_jsx","~~StyledButton~~","styleType","onClick","~~StyledDateNavigator~~","selectedDate","onLeftArrowClick","currentDate","previousWeek","DateHelper","toDayjs","subtract","format","onRightArrowClick","nextWeek","add","~~RightSection~~","~~StyledText~~","InputSelect","options","selectedOption","onSelectOption","listExtractor","displayValueExtractor","dropdownWidth","DROPDOWN_WIDTH"],"mappings":"~~qdA0B~~+BA,QAAAC,KAC3BA,EAAIC,KACJA,EAAO,MAAKC,QACZA,EAAOC,QACPA,EAAOC,mBACPA,EAAkBC,eAClBA,EAAcC,qBACdA,EAAoBC,aACpBA,EAAYC,aACZA,KACGC,EAAUC,EAAAA,OAAAX,EAVc,CAAA,OAAA,OAAA,UAAA,UAAA,qBAAA,iBAAA,uBAAA,eAAA,iBAY3B,MAAMY,EAA6D,CAC/D,CAAEC,MAAO,MAAOC,MAAO,OACvB,CAAED,MAAO,OAAQC,MAAO,SAEtBC,EAAqBH,EAAYI,MAClCC,GAAWA,EAAOH,QAAUZ,IAwBjC,OACIgB,~~EAAAA~~,~~KAACC~~,~~EAAAA,sBAAqBC,~~OAAAC,OAAA,~~CAAA~~,~~EAAKX~~,~~EAAU~~,~~CAAAY~~,~~SAAA~~,~~CACjCJ,~~EAAAA,~~KAACK~~,~~EAAAA~~,~~YAAW~~,~~CAAAD~~,SAAA,~~CACRE~~,EAAAA,IAACC,EAAAA,~~aAAY~~,~~CAACC~~,UAAU,~~QAAQC~~,~~QAASlB~~,~~EAAYa~~,SAAA,~~UAGrDE~~,EAAAA,~~IAACI~~,EAAAA,~~oBAAmB~~,~~CAChBC~~,~~aAAc5B,~~EACdE,QAASA,EACTC,QAASA,EACTF,KAAMA,~~EACN4B~~,~~iBA/BcC~~,IAC1B,GAAa,~~SAAT7B~~,EAAiB,CACjB,~~MACM8B~~,EADiBC,EAAAA,WAAWC,QAAQH,GACNI,SAAS,EAAG,~~QAChD9B~~,~~EAAmB2B~~,EAAaI,OAAO,cAC3C,~~MACI/B~~,~~EAAmB0B~~,EACvB,~~EAyBYM~~,~~kBAtBeN~~,IAC3B,GAAa,~~SAAT7B~~,EAAiB,CACjB,~~MACMoC~~,EADiBL,EAAAA,WAAWC,QAAQH,GACVQ,IAAI,EAAG,~~QACvCjC~~,~~EAAegC~~,EAASF,OAAO,cACnC,~~MACI9B~~,~~EAAeyB~~,EACnB,~~EAgBYxB~~,qBAAsBA,OAI9BW,~~EAAAA~~,~~KAACsB~~,~~eAAY~~,~~CAAAlB~~,SAAA,~~CACTE~~,EAAAA,~~IAACiB~~,~~EAAAA~~,~~kCACDjB~~,EAAAA,~~IAACkB~~,EAAAA,YAAW,CACRC,~~QAAS/B~~,~~EACTgC~~,~~eAAgB7B~~,~~EAChB8B~~,~~eAAiB5B~~,GAAWT,aAAY,EAAZA,EAAeS,EAAOH,~~OAClDgC~~,~~cAAgB7B~~,GAAWA,EAAOJ,~~MAClCkC~~,~~sBAAwB9B~~,GAAWA,EAAOJ,~~MAC1CmC~~,cAAeC,EAAAA,~~uBAGH~~"}
1	+ {"version":3,"file":"schedule-header.js","sources":["../../../../src/schedule/schedule-header/schedule-header.tsx"],"sourcesContent":["import { Button } from \"../../button\";\nimport { DateNavigator } from \"../../date-navigator\";\nimport { InputSelect } from \"../../input-select\";\nimport { Typography } from \"../../typography\";\nimport { DateHelper } from \"../../util\";\nimport type { ScheduleView } from \"../types\";\nimport * as styles from \"./schedule-header.styles\";\n\nexport interface ScheduleHeaderProps {\n id?: string \| undefined;\n date: string;\n view: ScheduleView;\n minDate?: string \| undefined;\n maxDate?: string \| undefined;\n onPreviousDayClick: (currentDate: string) => void;\n onNextDayClick: (currentDate: string) => void;\n onCalendarDateSelect?: (currentDate: string) => void;\n onViewChange?: (view: ScheduleView) => void;\n onTodayClick?: () => void;\n}\n\nexport const ScheduleHeader = ({\n date,\n view = \"day\",\n minDate,\n maxDate,\n onPreviousDayClick,\n onNextDayClick,\n onCalendarDateSelect,\n onViewChange,\n onTodayClick,\n ...otherProps\n}: ScheduleHeaderProps) => {\n const viewOptions: Array<{ label: string; value: ScheduleView }> = [\n { label: \"Day\", value: \"day\" },\n { label: \"Week\", value: \"week\" },\n ];\n const selectedViewOption = viewOptions.find(\n (option) => option.value === view\n );\n\n // Handle navigation based on view type\n const handleLeftArrowClick = (currentDate: string) => {\n if (view === \"week\") {\n const currentDateObj = DateHelper.toDayjs(currentDate);\n const previousWeek = currentDateObj.subtract(1, \"week\");\n onPreviousDayClick(previousWeek.format(\"YYYY-MM-DD\"));\n } else {\n onPreviousDayClick(currentDate);\n }\n };\n\n const handleRightArrowClick = (currentDate: string) => {\n if (view === \"week\") {\n const currentDateObj = DateHelper.toDayjs(currentDate);\n const nextWeek = currentDateObj.add(1, \"week\");\n onNextDayClick(nextWeek.format(\"YYYY-MM-DD\"));\n } else {\n onNextDayClick(currentDate);\n }\n };\n\n return (\n <div className={styles.scheduleHeaderWrapper} {...otherProps}>\n <div className={styles.leftSection}>\n <Button\n className={styles.button}\n styleType=\"light\"\n onClick={onTodayClick}\n >\n Today\n </Button>\n <DateNavigator\n className={styles.dateNavigator}\n selectedDate={date}\n minDate={minDate}\n maxDate={maxDate}\n view={view}\n onLeftArrowClick={handleLeftArrowClick}\n onRightArrowClick={handleRightArrowClick}\n onCalendarDateSelect={onCalendarDateSelect}\n />\n </div>\n\n <div className={styles.rightSection}>\n <Typography.BodyMD className={styles.text}>\n View by:\n </Typography.BodyMD>\n <InputSelect\n options={viewOptions}\n selectedOption={selectedViewOption}\n onSelectOption={(option) => onViewChange?.(option.value)}\n listExtractor={(option) => option.label}\n displayValueExtractor={(option) => option.label}\n dropdownWidth={styles.DROPDOWN_WIDTH}\n />\n </div>\n </div>\n );\n};\n"],"names":["_a","date","view","minDate","maxDate","onPreviousDayClick","onNextDayClick","onCalendarDateSelect","onViewChange","onTodayClick","otherProps","__rest","viewOptions","label","value","selectedViewOption","find","option","_jsxs","Object","assign","className","styles.scheduleHeaderWrapper","styles.leftSection","children","_jsx","Button","styles.button","styleType","onClick","DateNavigator","styles.dateNavigator","selectedDate","onLeftArrowClick","currentDate","previousWeek","DateHelper","toDayjs","subtract","format","onRightArrowClick","nextWeek","add","styles.rightSection","Typography","BodyMD","styles.text","InputSelect","options","selectedOption","onSelectOption","listExtractor","displayValueExtractor","dropdownWidth","styles.DROPDOWN_WIDTH"],"mappings":"qlBAqB+BA,QAAAC,KAC3BA,EAAIC,KACJA,EAAO,MAAKC,QACZA,EAAOC,QACPA,EAAOC,mBACPA,EAAkBC,eAClBA,EAAcC,qBACdA,EAAoBC,aACpBA,EAAYC,aACZA,KACGC,EAAUC,EAAAA,OAAAX,EAVc,CAAA,OAAA,OAAA,UAAA,UAAA,qBAAA,iBAAA,uBAAA,eAAA,iBAY3B,MAAMY,EAA6D,CAC/D,CAAEC,MAAO,MAAOC,MAAO,OACvB,CAAED,MAAO,OAAQC,MAAO,SAEtBC,EAAqBH,EAAYI,MAClCC,GAAWA,EAAOH,QAAUZ,IAwBjC,OACIgB,OAAA,MAAAC,OAAAC,OAAA,CAAKC,UAAWC,EAAAA,uBAAkCZ,aAC9CQ,EAAAA,KAAA,MAAA,CAAKG,UAAWE,cAAkBC,SAAA,CAC9BC,EAAAA,IAACC,EAAAA,QACGL,UAAWM,SACXC,UAAU,QACVC,QAASpB,EAAYe,SAAA,UAIzBC,EAAAA,IAACK,gBAAa,CACVT,UAAWU,EAAAA,cACXC,aAAc/B,EACdE,QAASA,EACTC,QAASA,EACTF,KAAMA,EACN+B,iBApCcC,IAC1B,GAAa,SAAThC,EAAiB,CACjB,MACMiC,EADiBC,EAAAA,WAAWC,QAAQH,GACNI,SAAS,EAAG,QAChDjC,EAAmB8B,EAAaI,OAAO,cAC3C,MACIlC,EAAmB6B,EACvB,EA8BYM,kBA3BeN,IAC3B,GAAa,SAAThC,EAAiB,CACjB,MACMuC,EADiBL,EAAAA,WAAWC,QAAQH,GACVQ,IAAI,EAAG,QACvCpC,EAAemC,EAASF,OAAO,cACnC,MACIjC,EAAe4B,EACnB,EAqBY3B,qBAAsBA,OAI9BW,OAAA,MAAA,CAAKG,UAAWsB,EAAAA,aAAmBnB,SAAA,CAC/BC,MAACmB,EAAAA,WAAWC,OAAM,CAACxB,UAAWyB,OAAWtB,SAAA,aAGzCC,EAAAA,IAACsB,EAAAA,YAAW,CACRC,QAASpC,EACTqC,eAAgBlC,EAChBmC,eAAiBjC,GAAWT,aAAY,EAAZA,EAAeS,EAAOH,OAClDqC,cAAgBlC,GAAWA,EAAOJ,MAClCuC,sBAAwBnC,GAAWA,EAAOJ,MAC1CwC,cAAeC,EAAAA,uBAGrB"}

package/cjs/schedule/schedule-header/schedule-header.styles.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";require("./schedule-header.styles_1n2u5vj.css");exports.DROPDOWN_WIDTH="240px",exports.button="bzltxmo",exports.dateNavigator="d19djkwt",exports.leftSection="lzjgzr2",exports.rightSection="r1xv7b6y",exports.scheduleHeaderWrapper="smt7il1",exports.text="t1cre13t";
2	+ //# sourceMappingURL=schedule-header.styles.js.map

package/cjs/schedule/schedule-header/schedule-header.styles.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"schedule-header.styles.js","sources":["../../../../src/schedule/schedule-header/schedule-header.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Colour, MediaQuery, Spacing } from \"../../theme\";\n\n// =============================================================================\n// STYLING\n// =============================================================================\nexport const scheduleHeaderWrapper = css`\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding-bottom: ${Spacing[\"spacing-16\"]};\n color: ${Colour[\"text-primary\"]};\n gap: ${Spacing[\"spacing-16\"]};\n`;\n\nexport const leftSection = css`\n display: flex;\n align-items: center;\n gap: ${Spacing[\"spacing-16\"]};\n\n ${MediaQuery.MaxWidth.md} {\n flex-direction: column;\n align-items: stretch;\n width: 100%;\n }\n`;\n\nexport const rightSection = css`\n display: flex;\n align-items: center;\n gap: ${Spacing[\"spacing-16\"]};\n\n ${MediaQuery.MaxWidth.lg} {\n display: none;\n }\n`;\n\nexport const dateNavigator = css`\n width: 100%;\n max-width: 400px;\n`;\n\nexport const text = css`\n color: ${Colour[\"text-subtler\"]};\n`;\n\nexport const button = css`\n min-width: 5rem;\n\n ${MediaQuery.MaxWidth.lg} {\n display: none;\n }\n`;\n\n// =============================================================================\n// CONSTANTS\n// =============================================================================\nexport const DROPDOWN_WIDTH = \"240px\";\n"],"names":[],"mappings":"4HA0D8B,uBAXX,gCATO,+BAtBF,+BAYC,yCArBS,uBAoCjB"}

package/cjs/schedule/schedule-header/schedule-header.styles_1n2u5vj.css ADDED Viewed

@@ -0,0 +1,6 @@
+.smt7il1{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding-bottom:var(--fds-spacing-16);color:var(--fds-colour-text-primary);gap:var(--fds-spacing-16);}
+.lzjgzr2{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:var(--fds-spacing-16);}:where(body.fds-breakpoint-md-max) .lzjgzr2{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:stretch;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;width:100%;}
+.r1xv7b6y{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:var(--fds-spacing-16);}:where(body.fds-breakpoint-lg-max) .r1xv7b6y{display:none;}
+.d19djkwt{width:100%;max-width:400px;}
+.t1cre13t{color:var(--fds-colour-text-subtler);}
+.bzltxmo{min-width:5rem;}:where(body.fds-breakpoint-lg-max) .bzltxmo{display:none;}

package/cjs/schedule/schedule-slot-content/schedule-slot-content.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";var e=require("react/jsx-runtime"),t=require("clsx"),r=require("react"),s=require("../../shared/time-slot/time-slot.js");require("../../theme/theme-provider/index.js"),require("../../theme/theme-provider/context.js"),require("../../theme/tokens/border.js"),require("../../theme/tokens/colour.js"),require("../../theme/tokens/font.js"),require("../../theme/tokens/media-query.js");var l=require("../../theme/utils/use-apply-styles.js");require("../../theme/utils/use-media-query.js");var i=require("../../util/time-helper.js"),o=require("../const.js"),u=require("./style-helper.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=a(t);exports.ScheduleSlotContent=({slot:t,offsetTop:a,classNames:c,tokens:m,clickable:d,children:h})=>{const p=i.TimeHelper.calculateDuration(t.startTime,t.endTime),q=r.useRef(null);l.useApplyStyle(q,{[m.offsetTop]:`${a}px`,[m.height]:p/30*o.CELL_HEIGHT-1+"px"});const j=u.getTimeSlotStyleProps(t.status);return e.jsx(s.TimeSlot,{ref:q,className:n.default(c.container,"blocked"===t.status&&c.blocked,"available"===t.status&&c.available),styleType:j.styleType,bgColor:j.bgColor,bgColor2:j.bgColor2,clickable:d,onClick:e=>{var r;return null===(r=t.onClick)\|\|void 0===r?void 0:r.call(t,t,e)},children:h})};
2	+ //# sourceMappingURL=schedule-slot-content.js.map

package/cjs/schedule/schedule-slot-content/schedule-slot-content.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"schedule-slot-content.js","sources":["../../../../src/schedule/schedule-slot-content/schedule-slot-content.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport type React from \"react\";\nimport { useRef } from \"react\";\n\nimport { TimeSlot } from \"../../shared/time-slot\";\nimport { useApplyStyle } from \"../../theme\";\nimport { TimeHelper } from \"../../util/time-helper\";\nimport { CELL_HEIGHT } from \"../const\";\nimport type { ScheduleSlotProps } from \"../types\";\nimport { getTimeSlotStyleProps } from \"./style-helper\";\n\ninterface SlotContentClassNames {\n container: string;\n blocked: string;\n available: string;\n}\n\ninterface SlotContentTokens {\n offsetTop: string;\n height: string;\n}\n\ninterface ScheduleSlotContentProps {\n slot: ScheduleSlotProps;\n offsetTop: number;\n classNames: SlotContentClassNames;\n tokens: SlotContentTokens;\n clickable?: boolean;\n children: React.ReactNode;\n}\n\nexport const ScheduleSlotContent = ({\n slot,\n offsetTop,\n classNames,\n tokens,\n clickable,\n children,\n}: ScheduleSlotContentProps) => {\n const duration = TimeHelper.calculateDuration(slot.startTime, slot.endTime);\n const slotContentRef = useRef<HTMLDivElement>(null);\n\n useApplyStyle(slotContentRef, {\n [tokens.offsetTop]: `${offsetTop}px`,\n [tokens.height]: `${(duration / 30) * CELL_HEIGHT - 1}px`,\n });\n\n const slotStyleProps = getTimeSlotStyleProps(slot.status);\n\n return (\n <TimeSlot\n ref={slotContentRef}\n className={clsx(\n classNames.container,\n slot.status === \"blocked\" && classNames.blocked,\n slot.status === \"available\" && classNames.available\n )}\n styleType={slotStyleProps.styleType}\n bgColor={slotStyleProps.bgColor}\n bgColor2={slotStyleProps.bgColor2}\n clickable={clickable}\n onClick={(e: React.MouseEvent) => slot.onClick?.(slot, e)}\n >\n {children}\n </TimeSlot>\n );\n};\n"],"names":["slot","offsetTop","classNames","tokens","clickable","children","duration","TimeHelper","calculateDuration","startTime","endTime","slotContentRef","useRef","useApplyStyle","height","CELL_HEIGHT","slotStyleProps","getTimeSlotStyleProps","status","_jsx","TimeSlot","ref","className","clsx","container","blocked","available","styleType","bgColor","bgColor2","onClick","e","_a","call"],"mappings":"ksBA+BmC,EAC/BA,OACAC,YACAC,aACAC,SACAC,YACAC,eAEA,MAAMC,EAAWC,EAAAA,WAAWC,kBAAkBR,EAAKS,UAAWT,EAAKU,SAC7DC,EAAiBC,EAAAA,OAAuB,MAE9CC,EAAAA,cAAcF,EAAgB,CAC1B,CAACR,EAAOF,WAAY,GAAGA,MACvB,CAACE,EAAOW,QAAaR,EAAW,GAAMS,EAAAA,YAAc,EAAnC,OAGrB,MAAMC,EAAiBC,EAAAA,sBAAsBjB,EAAKkB,QAElD,OACIC,MAACC,EAAAA,SAAQ,CACLC,IAAKV,EACLW,UAAWC,EAAAA,QACPrB,EAAWsB,UACK,YAAhBxB,EAAKkB,QAAwBhB,EAAWuB,QACxB,cAAhBzB,EAAKkB,QAA0BhB,EAAWwB,WAE9CC,UAAWX,EAAeW,UAC1BC,QAASZ,EAAeY,QACxBC,SAAUb,EAAea,SACzBzB,UAAWA,EACX0B,QAAUC,IAAuB,IAAAC,EAAC,OAAY,UAAZhC,EAAK8B,eAAO,IAAAE,OAAA,EAAAA,EAAAC,KAAAjC,EAAGA,EAAM+B,EAAE,WAExD1B,GACM"}

package/cjs/schedule/schedule-slot-content/style-helper.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";require("../../theme/theme-provider/index.js"),require("react"),require("../../theme/theme-provider/context.js"),require("../../theme/tokens/border.js");var e=require("../../theme/tokens/colour.js");require("../../theme/tokens/font.js"),require("../../theme/tokens/media-query.js"),require("../../util/calendar-helper.js"),require("../../external/dayjs/dayjs.min.js"),require("../../util/simple-id-generator.js"),require("../../util/string-helper.js"),require("@react-aria/live-announcer"),require("../../theme/utils/use-media-query.js");exports.getTimeSlotStyleProps=r=>{switch(r){case"pending":return{styleType:"stripes",bgColor:e.Colour["bg-warning"],bgColor2:e.Colour["bg-warning-hover"]};case"blocked":return{styleType:"default",bgColor:e.Colour["bg-inverse-subtle"]};case"available":return{styleType:"default",bgColor:e.Colour["bg-success-hover"]};case"booked":return{styleType:"default",bgColor:e.Colour["bg-primary-subtler"]};default:return{styleType:"default",bgColor:e.Colour.bg}}};
2	+ //# sourceMappingURL=style-helper.js.map

package/cjs/schedule/schedule-slot-content/style-helper.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"style-helper.js","sources":["../../../../src/schedule/schedule-slot-content/style-helper.ts"],"sourcesContent":["import type { SlotStyle } from \"../../shared/time-slot\";\nimport { Colour } from \"../../theme\";\nimport type { ScheduleSlotProps } from \"../types\";\n\nexport interface TimeSlotStyleProps {\n styleType: SlotStyle;\n bgColor: string;\n bgColor2?: string;\n}\n\nexport const getTimeSlotStyleProps = (\n status: ScheduleSlotProps[\"status\"]\n): TimeSlotStyleProps => {\n switch (status) {\n case \"pending\":\n return {\n styleType: \"stripes\",\n bgColor: Colour[\"bg-warning\"],\n bgColor2: Colour[\"bg-warning-hover\"],\n };\n case \"blocked\":\n return {\n styleType: \"default\",\n bgColor: Colour[\"bg-inverse-subtle\"],\n };\n case \"available\":\n return {\n styleType: \"default\",\n bgColor: Colour[\"bg-success-hover\"],\n };\n case \"booked\":\n return {\n styleType: \"default\",\n bgColor: Colour[\"bg-primary-subtler\"],\n };\n default:\n return {\n styleType: \"default\",\n bgColor: Colour[\"bg\"],\n };\n }\n};\n"],"names":["status","styleType","bgColor","Colour","bgColor2"],"mappings":"qkBAWIA,IAEA,OAAQA,GACJ,IAAK,UACD,MAAO,CACHC,UAAW,UACXC,QAASC,EAAAA,OAAO,cAChBC,SAAUD,EAAAA,OAAO,qBAEzB,IAAK,UACD,MAAO,CACHF,UAAW,UACXC,QAASC,EAAAA,OAAO,sBAExB,IAAK,YACD,MAAO,CACHF,UAAW,UACXC,QAASC,EAAAA,OAAO,qBAExB,IAAK,SACD,MAAO,CACHF,UAAW,UACXC,QAASC,EAAAA,OAAO,uBAExB,QACI,MAAO,CACHF,UAAW,UACXC,QAASC,EAAAA,OAAW"}

package/cjs/schedule/schedule-week-view/schedule-week-view.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),i=require("../../external/dayjs/dayjs.min.js"),r=require("react"),t=require("../../animations/themed-loading-spinner/themed-loading-spinner.js"),a=require("../../shared/internal-calendar/day-cell/day-cell.js"),s=require("../../util/time-helper.js"),n=require("../schedule-day-view/schedule-day-view.styles.js"),l=require("../shared/hooks.js"),d=require("../time-indicator/time-indicator.js"),c=require("./schedule-week-view.styles.js"),o=require("./time-cell.js"),m=require("./week-view-utils.js");exports.ScheduleWeekView=({date:u,serviceData:j,loading:h,minTime:x,maxTime:f,initialScrollTime:y,containerRef:S,blockedMessage:g,onClickHiddenSlots:p})=>{const T=l.useTimelineOffset(x,f),q=l.useInitialScroll(h,x,y),v=r.useMemo((()=>{const e=i.default(u).startOf("week");return Array.from({length:7},((i,r)=>e.add(r,"day")))}),[u]),k=r.useMemo((()=>s.TimeHelper.generateTimings(30,"24hr",x,f)),[x,f]),C=r.useMemo((()=>m.calculateSlotWidths(j,v,k)),[j,v,k]),D=i.default();return e.jsx(n.ScheduleContainer,{children:h?e.jsx(c.LoadingContainer,{children:e.jsx(t.ThemedLoadingSpinner,{})}):e.jsxs(e.Fragment,{children:[e.jsxs(c.HeaderContainer,{children:[e.jsx(c.BlankCell,{}),e.jsx(c.ServiceContainer,{children:v.map((r=>{const t=(e=>{const i=e.isSame(D,"day"),r={labelType:i?"current":"available",interactive:void 0};return i&&(r.circleLeft="selected-outline",r.circleRight="selected-outline"),r})(r);return e.jsxs(c.ServiceHeader,{children:[e.jsx(a.DayCell,Object.assign({date:r,calendarDate:i.default(u)},t)),e.jsx(c.Description,{children:r.format("ddd")})]},r.format("YYYY-MM-DD"))}))})]}),e.jsxs(c.BodyContainer,{ref:q,children:[e.jsx(d.TimeIndicator,{minTime:x,maxTime:f,format:"24hr",timelineOffset:T,isWeekView:!0}),e.jsx(c.SlotGrid,{children:v.map((i=>{const r=i.format("YYYY-MM-DD");return e.jsxs(c.SlotColumn,{children:[null!==T&&i.isSame(D,"day")&&e.jsx(c.Timeline,{$top:T}),k.map((i=>e.jsx(o.TimeCell,{dayDate:r,time:i,serviceData:j,slotLayoutMap:C,containerRef:S,blockedMessage:g,onClickHiddenSlots:p},i)))]},r)}))})]})]})})};
+"use strict";var e=require("react/jsx-runtime"),i=require("../../external/dayjs/dayjs.min.js"),s=require("react"),r=require("../../animations/themed-loading-spinner/themed-loading-spinner.js"),t=require("../../shared/internal-calendar/day-cell/day-cell.js");require("../../theme/theme-provider/index.js"),require("../../theme/theme-provider/context.js"),require("../../theme/tokens/border.js"),require("../../theme/tokens/colour.js"),require("../../theme/tokens/font.js"),require("../../theme/tokens/media-query.js");var a=require("../../theme/utils/use-apply-styles.js");require("../../theme/utils/use-media-query.js");var l=require("../../typography/index.js"),n=require("../../util/time-helper.js"),d=require("../schedule-day-view/schedule-day-view.styles.js"),o=require("../shared/hooks.js");require("clsx"),require("../../shared/time-slot/time-slot.js");var c=require("../time-indicator/time-indicator.js"),m=require("./schedule-week-view.styles.js"),u=require("./time-cell.js"),h=require("./week-view-utils.js");const j=({top:i})=>{const r=s.useRef(null);return a.useApplyStyle(r,{[m.tokens.timeline.top]:`${i}px`}),e.jsx("div",{ref:r,className:m.timeline})};exports.ScheduleWeekView=({date:a,serviceData:y,loading:p,minTime:v,maxTime:x,initialScrollTime:q,containerRef:f,blockedMessage:g,onClickHiddenSlots:k})=>{const T=o.useTimelineOffset(v,x),C=o.useInitialScroll(p,v,q),M=s.useMemo((()=>{const e=i.default(a).startOf("week");return Array.from({length:7},((i,s)=>e.add(s,"day")))}),[a]),N=s.useMemo((()=>n.TimeHelper.generateTimings(30,"24hr",v,x)),[v,x]),D=s.useMemo((()=>h.calculateSlotWidths(y,M,N)),[y,M,N]),S=i.default();return e.jsx("div",{className:d.scheduleContainer,children:p?e.jsx("div",{className:m.loadingContainer,children:e.jsx(r.ThemedLoadingSpinner,{"data-testid":"loading-spinner"})}):e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:m.headerContainer,children:[e.jsx("div",{className:m.blankCell}),e.jsx("div",{className:m.serviceContainer,children:M.map((s=>{const r=(e=>{const i=e.isSame(S,"day"),s={labelType:i?"current":"available",interactive:void 0};return i&&(s.circleLeft="selected-outline",s.circleRight="selected-outline"),s})(s);return e.jsxs("div",{className:m.serviceHeader,children:[e.jsx(t.DayCell,Object.assign({date:s,calendarDate:i.default(a)},r)),e.jsx(l.Typography.BodyMD,{className:m.description,children:s.format("ddd")})]},s.format("YYYY-MM-DD"))}))})]}),e.jsxs("div",{className:m.bodyContainer,ref:C,children:[e.jsx(c.TimeIndicator,{minTime:v,maxTime:x,format:"24hr",timelineOffset:T,isWeekView:!0}),e.jsx("div",{className:m.slotGrid,children:M.map((i=>{const s=i.format("YYYY-MM-DD");return e.jsxs("div",{className:m.slotColumn,children:[null!==T&&i.isSame(S,"day")&&e.jsx(j,{top:T}),N.map((i=>e.jsx(u.TimeCell,{dayDate:s,time:i,serviceData:y,slotLayoutMap:D,containerRef:f,blockedMessage:g,onClickHiddenSlots:k},i)))]},s)}))})]})]})})};
 //# sourceMappingURL=schedule-week-view.js.map