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

package/schedule/schedule-day-view/schedule-day-view.styles.js

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

package/schedule/schedule-day-view/schedule-day-view.styles.js.map

@@ -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 { IconButton } from \"../../icon-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(IconButton)`\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","IconButton","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":"8bAmDaA,EAAcC,EAAOC,EAAW;aAChCC,EAAgB;EAEhBC,EAAiBH,EAAOI,GAAG;;EAI3BC,EAAoBL,EAAOI,GAAG;;;;EAM9BE,EAAmBN,EAAOI,GAAG;;;;;;cAM5BG,EAAU,gBAAgBA,EAAUC,SAASN,EAAkB;qBACxDO,EAAc;kBACjBP,EAAc;EAGnBQ,EAAkBV,EAAOI,GAA8B;;kBAElDO;+BACaF,EAAc;8BACfA,EAAc;;cAE9BF,EAAU,gBAAgBA,EAAUC,SAASN,EAAkB;;;;MAItEU,GACCA,EAAMC,UACAC,CAAG;;;gBAIHA,CAAG;;2CAE0BC;;EAI9BC,EAAYhB,EAAOI,GAAG;iBAClBW;kBACCb,EAAU;;;EAIfe,EAAmBjB,EAAOI,GAA+B;;oCAEjCQ,GAAUA,EAAMM;EAGxCC,EAAgBnB,EAAOI,GAAG;;;;iBAItBgB;eACFC,EAAW,iBAAiBA,EAAW;kBACpCnB,EAAU;oBACRK,EAAU,gBAAgBA,EAAUC;UAC9CN,EAAkB;;;;EAMfoB,EAAyBtB,EAAOI,GAAG;;oBAE5BiB,EAAW;EAGlBE,EAAQvB,EAAOwB,EAAWC,OAAO;aACjCvB,EAAU;mBACJwB,EAAQC,KAAK;;MAE1BC,EAAa;;;EAKNC,EAAc7B,EAAOwB,EAAWM,OAAO;kBAClCT,EAAW;wBACLnB,EAAU;qBACbO,EAAgB;;eAEtBY,EAAW,gBAAgBA,EAAW;aACxCnB,EAAU;mBACJwB,EAAQC,KAAK;;uBAETD,EAAQC,KAAK;;EAIvBI,EAAgB/B,EAAOI,GAAG;;6BAEVW;;;;;;cAMfR,EAAU,gBAAgBA,EAAUC,SAASN,EAAkB;;kCAE3CO,EAAc;iCACfA,EAAc;EAGlCuB,EAAWhC,EAAOI,GAAuB;;oCAEjBQ,GAAUA,EAAMM;;;EAKxCe,EAAajC,EAAOI,GAAG;;;iBAGnBgB;;oBAEGb,EAAU,gBAAgBA,EAAUC;UAC9CN,EAAkB;;;;EAMfgC,EAAWlC,EAAOI,GAAuB;kBACpC+B;;qBAEG5B,EAAU,sBAAsBL,EAAkB;MAChEU,GACCA,EAAMwB,SACNtB,CAAG;;;;EAMEuB,EAAcrC,EAAOwB,EAAWc,OAA8B;;;;mBAIxDjB,EAAW;;WAElBT,GAAUA,EAAM2B,YAAc;MACpCb,EAAQ;qBACOjB,EAAc;;cAEpBG,GACPA,EAAM4B,UACI5B,EAAM4B,UAAY,GAAML,EAAc,EAA1C,KACGA,EAAc,EAAjB;;;kBAGKvB,IACX,OAAQA,EAAM6B,SACV,IAAK,UACD,OAAO3B,CAAG;;;0BAGAZ,EAAU;0BACVA,EAAU;0BACVA,EAAU;0BACVA,EAAU;;kBAGxB,IAAK,UACD,OAAOA,EAAU,qBACrB,IAAK,YACD,OAAOA,EAAU,oBACrB,IAAK,SACD,OAAOA,EAAU,sBACrB,QACI,OAAOA,EAAc;;aAIvBU,GACY,YAAlBA,EAAM6B,QACAvC,EAAU,gBACVA,EAAU;;mBAELK,EAAU;UAClBK,GACmB,cAAlBA,EAAM6B,QAA0BvC,EAAU,gBAAkB;EAG3DwC,EAAW1C,EAAO2C,IAAI;MAC7BjB,EAAQ;EAGDkB,EAAmB5C,EAAO2C,IAAI;MACrCjB,EAAQ;EAGDmB,EAAW7C,EAAOI,GAAuB;;;;kBAIpCF,EAAU;WAChBU,GAAUA,EAAMkC;;EAIfC,EAAY/C,EAAOI,GAAG;;cAErB+B,EAAc;"}
+{"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":["tokens","serviceContainer","columnCount","slotGrid","slotContent","offsetTop","height","timeline","top","arrowButton","arrowContainer","scheduleContainer","loadingContainer","headerContainer","headerContainerMobile","blankCell","serviceColumn","serviceHeaderContainer","title","description","bodyContainer","slotColumn","slotCell","slotCellDashed","slotContentBlocked","slotContentAvailable","slotTime","slotAvailability","emptySlot"],"mappings":"wFAcO,MAAMA,EAAS,CAClBC,iBAAkB,CACdC,YACI,+DAERC,SAAU,CACND,YAAa,uDAEjBE,YAAa,CACTC,UAAW,uDACXC,OAAQ,qDAEZC,SAAU,CACNC,IAAK,gDAIAC,EAAW,WAGXC,EAAc,UAIdC,EAAiB,UAMjBC,EAAgB,UAWhBC,EAAe,UAafC,EAAqB,WAKrBC,EAAS,UAMTd,EAAgB,WAShBe,EAAa,WAabC,EAAsB,UAKtBC,EAAK,WASLC,EAAW,WAaXC,EAAa,WAcbjB,EAAQ,UAQRkB,EAAU,WAWVC,EAAQ,WAWRC,EAAc,UAIdnB,EAAW,WAkBXoB,EAAkB,WAIlBC,EAAoB,UAIpBC,EAAQ,WAIRC,EAAgB,UAIhBpB,EAAQ,UAURqB,EAAS"}

package/schedule/schedule-day-view/schedule-day-view.styles_8ti149.css

@@ -0,0 +1,30 @@
+@layer fds{.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/schedule/schedule-day-view/types.d.ts

@@ -1,19 +1,12 @@
-import type { RefObject } from "react";
+import type { CommonScheduleViewProps } from "../internal-types";
 import type { ScheduleEmptySlotProps, ScheduleEntityProps, SchedulePopoverProps } from "../types";
-export interface ScheduleDayViewProps {
-    date: string;
+export interface ScheduleDayViewProps extends CommonScheduleViewProps {
     serviceData: ScheduleEntityProps[];
-    loading: boolean;
-    minTime: string;
-    maxTime: string;
-    initialScrollTime?: string | undefined;
     isMobile: boolean;
-    containerRef: RefObject<HTMLDivElement>;
     onNextService?: () => void | undefined;
     onPrevService?: () => void | undefined;
     onEmptySlotClick?: (slot: ScheduleEmptySlotProps) => void | undefined;
     showPrevArrow: boolean;
     showNextArrow: boolean;
     emptySlotPopover?: ((slot: ScheduleEmptySlotProps) => SchedulePopoverProps) | undefined;
-    blockedMessage?: string | undefined;
 }

package/schedule/schedule-header/schedule-header.js

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

package/schedule/schedule-header/schedule-header.js.map

@@ -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":["ScheduleHeader","_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":"mhBA0BO,MAAMA,EAAkBC,QAAAC,KAC3BA,EAAIC,KACJA,EAAO,MAAKC,QACZA,EAAOC,QACPA,EAAOC,mBACPA,EAAkBC,eAClBA,EAAcC,qBACdA,EAAoBC,aACpBA,EAAYC,aACZA,KACGC,EAAUC,EAAAX,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,EAACC,EAAqBC,OAAAC,OAAA,CAAA,EAAKX,EAAU,CAAAY,SAAA,CACjCJ,EAACK,EAAW,CAAAD,SAAA,CACRE,EAACC,EAAY,CAACC,UAAU,QAAQC,QAASlB,EAAYa,SAAA,UAGrDE,EAACI,EAAmB,CAChBC,aAAc5B,EACdE,QAASA,EACTC,QAASA,EACTF,KAAMA,EACN4B,iBA/BcC,IAC1B,GAAa,SAAT7B,EAAiB,CACjB,MACM8B,EADiBC,EAAWC,QAAQH,GACNI,SAAS,EAAG,QAChD9B,EAAmB2B,EAAaI,OAAO,cAC3C,MACI/B,EAAmB0B,EACvB,EAyBYM,kBAtBeN,IAC3B,GAAa,SAAT7B,EAAiB,CACjB,MACMoC,EADiBL,EAAWC,QAAQH,GACVQ,IAAI,EAAG,QACvCjC,EAAegC,EAASF,OAAO,cACnC,MACI9B,EAAeyB,EACnB,EAgBYxB,qBAAsBA,OAI9BW,EAACsB,EAAY,CAAAlB,SAAA,CACTE,EAACiB,yBACDjB,EAACkB,EAAW,CACRC,QAAS/B,EACTgC,eAAgB7B,EAChB8B,eAAiB5B,GAAWT,aAAY,EAAZA,EAAeS,EAAOH,OAClDgC,cAAgB7B,GAAWA,EAAOJ,MAClCkC,sBAAwB9B,GAAWA,EAAOJ,MAC1CmC,cAAeC,UAGH"}
+{"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                    data-testid=\"view-selector\"\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":["ScheduleHeader","_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":"6vBAqBO,MAAMA,EAAkBC,QAAAC,KAC3BA,EAAIC,KACJA,EAAO,MAAKC,QACZA,EAAOC,QACPA,EAAOC,mBACPA,EAAkBC,eAClBA,EAAcC,qBACdA,EAAoBC,aACpBA,EAAYC,aACZA,KACGC,EAAUC,EAAAX,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,EAAA,MAAAC,OAAAC,OAAA,CAAKC,UAAWC,GAAkCZ,aAC9CQ,EAAA,MAAA,CAAKG,UAAWE,EAAkBC,SAAA,CAC9BC,EAACC,GACGL,UAAWM,EACXC,UAAU,QACVC,QAASpB,EAAYe,SAAA,UAIzBC,EAACK,EAAa,CACVT,UAAWU,EACXC,aAAc/B,EACdE,QAASA,EACTC,QAASA,EACTF,KAAMA,EACN+B,iBApCcC,IAC1B,GAAa,SAAThC,EAAiB,CACjB,MACMiC,EADiBC,EAAWC,QAAQH,GACNI,SAAS,EAAG,QAChDjC,EAAmB8B,EAAaI,OAAO,cAC3C,MACIlC,EAAmB6B,EACvB,EA8BYM,kBA3BeN,IAC3B,GAAa,SAAThC,EAAiB,CACjB,MACMuC,EADiBL,EAAWC,QAAQH,GACVQ,IAAI,EAAG,QACvCpC,EAAemC,EAASF,OAAO,cACnC,MACIjC,EAAe4B,EACnB,EAqBY3B,qBAAsBA,OAI9BW,SAAKG,UAAWsB,EAAmBnB,SAAA,CAC/BC,EAACmB,EAAWC,OAAM,CAACxB,UAAWyB,EAAWtB,SAAA,aAGzCC,EAACsB,EAAW,CAAA,cACI,gBACZC,QAASpC,EACTqC,eAAgBlC,EAChBmC,eAAiBjC,GAAWT,aAAY,EAAZA,EAAeS,EAAOH,OAClDqC,cAAgBlC,GAAWA,EAAOJ,MAClCuC,sBAAwBnC,GAAWA,EAAOJ,MAC1CwC,cAAeC,UAGrB"}

package/schedule/schedule-header/schedule-header.styles.d.ts

@@ -0,0 +1,7 @@
+export declare const scheduleHeaderWrapper: import("@linaria/core").LinariaClassName;
+export declare const leftSection: import("@linaria/core").LinariaClassName;
+export declare const rightSection: import("@linaria/core").LinariaClassName;
+export declare const dateNavigator: import("@linaria/core").LinariaClassName;
+export declare const text: import("@linaria/core").LinariaClassName;
+export declare const button: import("@linaria/core").LinariaClassName;
+export declare const DROPDOWN_WIDTH = "240px";

package/schedule/schedule-header/schedule-header.styles.js

@@ -0,0 +1,2 @@
+import"./schedule-header.styles_1n2u5vj.css";const e="smt7il1",s="lzjgzr2",t="r1xv7b6y",d="d19djkwt",l="t1cre13t",r="bzltxmo",c="240px";export{c as DROPDOWN_WIDTH,r as button,d as dateNavigator,s as leftSection,t as rightSection,e as scheduleHeaderWrapper,l as text};
+//# sourceMappingURL=schedule-header.styles.js.map

package/schedule/schedule-header/schedule-header.styles.js.map

@@ -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":["scheduleHeaderWrapper","leftSection","rightSection","dateNavigator","text","button","DROPDOWN_WIDTH"],"mappings":"qFAOO,MAAMA,EAAqB,UASrBC,EAAW,UAYXC,EAAY,WAUZC,EAAa,WAKbC,EAAI,WAIJC,EAAM,UAWNC,EAAiB"}

package/schedule/schedule-header/schedule-header.styles_1n2u5vj.css

@@ -0,0 +1,6 @@
+@layer fds{.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/schedule/schedule-slot-content/index.d.ts

@@ -0,0 +1,4 @@
+export * from "../shared/hooks";
+export * from "../shared/utils";
+export * from "./schedule-slot-content";
+export * from "./style-helper";

package/schedule/schedule-slot-content/schedule-slot-content.d.ts

@@ -0,0 +1,21 @@
+import type React from "react";
+import type { ScheduleSlotProps } from "../types";
+interface SlotContentClassNames {
+    container: string;
+    blocked: string;
+    available: string;
+}
+interface SlotContentTokens {
+    offsetTop: string;
+    height: string;
+}
+interface ScheduleSlotContentProps {
+    slot: ScheduleSlotProps;
+    offsetTop: number;
+    classNames: SlotContentClassNames;
+    tokens: SlotContentTokens;
+    clickable?: boolean;
+    children: React.ReactNode;
+}
+export declare const ScheduleSlotContent: ({ slot, offsetTop, classNames, tokens, clickable, children, }: ScheduleSlotContentProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/schedule/schedule-slot-content/schedule-slot-content.js

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

package/schedule/schedule-slot-content/schedule-slot-content.js.map

@@ -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":["ScheduleSlotContent","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":"ypBA+BO,MAAMA,EAAsB,EAC/BC,OACAC,YACAC,aACAC,SACAC,YACAC,eAEA,MAAMC,EAAWC,EAAWC,kBAAkBR,EAAKS,UAAWT,EAAKU,SAC7DC,EAAiBC,EAAuB,MAE9CC,EAAcF,EAAgB,CAC1B,CAACR,EAAOF,WAAY,GAAGA,MACvB,CAACE,EAAOW,QAAaR,EAAW,GAAMS,EAAc,EAAnC,OAGrB,MAAMC,EAAiBC,EAAsBjB,EAAKkB,QAElD,OACIC,EAACC,EAAQ,CACLC,IAAKV,EACLW,UAAWC,EACPrB,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/schedule/schedule-slot-content/style-helper.d.ts

@@ -0,0 +1,8 @@
+import type { SlotStyle } from "../../shared/time-slot";
+import type { ScheduleSlotProps } from "../types";
+export interface TimeSlotStyleProps {
+    styleType: SlotStyle;
+    bgColor: string;
+    bgColor2?: string;
+}
+export declare const getTimeSlotStyleProps: (status: ScheduleSlotProps["status"]) => TimeSlotStyleProps;

package/schedule/schedule-slot-content/style-helper.js

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

package/schedule/schedule-slot-content/style-helper.js.map

@@ -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":["getTimeSlotStyleProps","status","styleType","bgColor","Colour","bgColor2"],"mappings":"8fAUO,MAAMA,EACTC,IAEA,OAAQA,GACJ,IAAK,UACD,MAAO,CACHC,UAAW,UACXC,QAASC,EAAO,cAChBC,SAAUD,EAAO,qBAEzB,IAAK,UACD,MAAO,CACHF,UAAW,UACXC,QAASC,EAAO,sBAExB,IAAK,YACD,MAAO,CACHF,UAAW,UACXC,QAASC,EAAO,qBAExB,IAAK,SACD,MAAO,CACHF,UAAW,UACXC,QAASC,EAAO,uBAExB,QACI,MAAO,CACHF,UAAW,UACXC,QAASC,EAAW"}

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"schedule-week-view.js","sources":["../../../src/schedule/schedule-week-view/schedule-week-view.tsx"],"sourcesContent":["import dayjs from \"dayjs\";\nimport { useMemo } from \"react\";\n\nimport { ThemedLoadingSpinner } from \"../../animations/themed-loading-spinner/themed-loading-spinner\";\nimport type { CellStyleProps } from \"../../shared/internal-calendar/day-cell\";\nimport { DayCell } from \"../../shared/internal-calendar/day-cell\";\nimport { TimeHelper } from \"../../util/time-helper\";\nimport { ScheduleContainer } from \"../schedule-day-view/schedule-day-view.styles\";\nimport { useInitialScroll, useTimelineOffset } from \"../shared\";\nimport { TimeIndicator } from \"../time-indicator/time-indicator\";\nimport {\n    BlankCell,\n    BodyContainer,\n    Description,\n    HeaderContainer,\n    LoadingContainer,\n    ServiceContainer,\n    ServiceHeader,\n    SlotColumn,\n    SlotGrid,\n    Timeline,\n} from \"./schedule-week-view.styles\";\nimport { TimeCell } from \"./time-cell\";\nimport type { ScheduleWeekViewProps } from \"./types\";\nimport { calculateSlotWidths } from \"./week-view-utils\";\n\n// =============================================================================\n// MAIN COMPONENT\n// =============================================================================\n\nexport const ScheduleWeekView = ({\n    date,\n    serviceData,\n    loading,\n    minTime,\n    maxTime,\n    initialScrollTime,\n    containerRef,\n    blockedMessage,\n    onClickHiddenSlots,\n}: ScheduleWeekViewProps) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const timelineOffset = useTimelineOffset(minTime, maxTime);\n    const bodyRef = useInitialScroll(loading, minTime, initialScrollTime);\n\n    const weekDays = useMemo(() => {\n        const startOfWeek = dayjs(date).startOf(\"week\");\n        return Array.from({ length: 7 }, (_, i) => startOfWeek.add(i, \"day\"));\n    }, [date]);\n\n    const timeSlots = useMemo(() => {\n        return TimeHelper.generateTimings(30, \"24hr\", minTime, maxTime);\n    }, [minTime, maxTime]);\n\n    const slotLayoutMap = useMemo(() => {\n        return calculateSlotWidths(serviceData, weekDays, timeSlots);\n    }, [serviceData, weekDays, timeSlots]);\n\n    const today = dayjs();\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n    const generateStyleProps = (day: dayjs.Dayjs): CellStyleProps => {\n        const isToday = day.isSame(today, \"day\");\n\n        const dayCellStyleProps: CellStyleProps = {\n            labelType: isToday ? \"current\" : \"available\",\n            interactive: null,\n        };\n\n        if (isToday) {\n            dayCellStyleProps.circleLeft = \"selected-outline\";\n            dayCellStyleProps.circleRight = \"selected-outline\";\n        }\n\n        return dayCellStyleProps;\n    };\n\n    // =============================================================================\n    // RENDER FUNCTION\n    // =============================================================================\n    const renderHeader = () => {\n        return (\n            <HeaderContainer>\n                <BlankCell />\n                <ServiceContainer>\n                    {weekDays.map((day) => {\n                        const dayCellStyleProps = generateStyleProps(day);\n                        return (\n                            <ServiceHeader key={day.format(\"YYYY-MM-DD\")}>\n                                <DayCell\n                                    date={day}\n                                    calendarDate={dayjs(date)}\n                                    {...dayCellStyleProps}\n                                />\n                                <Description>{day.format(\"ddd\")}</Description>\n                            </ServiceHeader>\n                        );\n                    })}\n                </ServiceContainer>\n            </HeaderContainer>\n        );\n    };\n\n    const renderSlotGrid = () => (\n        <SlotGrid>\n            {weekDays.map((day) => {\n                const dayDate = day.format(\"YYYY-MM-DD\");\n                return (\n                    <SlotColumn key={dayDate}>\n                        {timelineOffset !== null &&\n                            day.isSame(today, \"day\") && (\n                                <Timeline $top={timelineOffset} />\n                            )}\n                        {timeSlots.map((time) => (\n                            <TimeCell\n                                key={time}\n                                dayDate={dayDate}\n                                time={time}\n                                serviceData={serviceData}\n                                slotLayoutMap={slotLayoutMap}\n                                containerRef={containerRef}\n                                blockedMessage={blockedMessage}\n                                onClickHiddenSlots={onClickHiddenSlots}\n                            />\n                        ))}\n                    </SlotColumn>\n                );\n            })}\n        </SlotGrid>\n    );\n\n    const renderBodyContainer = () => (\n        <BodyContainer ref={bodyRef}>\n            <TimeIndicator\n                minTime={minTime}\n                maxTime={maxTime}\n                format=\"24hr\"\n                timelineOffset={timelineOffset}\n                isWeekView={true}\n            />\n            {renderSlotGrid()}\n        </BodyContainer>\n    );\n\n    return (\n        <ScheduleContainer>\n            {loading ? (\n                <LoadingContainer>\n                    <ThemedLoadingSpinner />\n                </LoadingContainer>\n            ) : (\n                <>\n                    {renderHeader()}\n                    {renderBodyContainer()}\n                </>\n            )}\n        </ScheduleContainer>\n    );\n};\n"],"names":["ScheduleWeekView","date","serviceData","loading","minTime","maxTime","initialScrollTime","containerRef","blockedMessage","onClickHiddenSlots","timelineOffset","useTimelineOffset","bodyRef","useInitialScroll","weekDays","useMemo","startOfWeek","dayjs","startOf","Array","from","length","_","i","add","timeSlots","TimeHelper","generateTimings","slotLayoutMap","calculateSlotWidths","today","_jsx","ScheduleContainer","children","LoadingContainer","ThemedLoadingSpinner","_jsxs","HeaderContainer","BlankCell","ServiceContainer","map","day","dayCellStyleProps","isToday","isSame","labelType","interactive","circleLeft","circleRight","generateStyleProps","ServiceHeader","DayCell","calendarDate","Description","format","BodyContainer","ref","TimeIndicator","isWeekView","SlotGrid","dayDate","SlotColumn","Timeline","$top","time","TimeCell"],"mappings":"y6BA8BO,MAAMA,EAAmB,EAC5BC,OACAC,cACAC,UACAC,UACAC,UACAC,oBACAC,eACAC,iBACAC,yBAKA,MAAMC,EAAiBC,EAAkBP,EAASC,GAC5CO,EAAUC,EAAiBV,EAASC,EAASE,GAE7CQ,EAAWC,GAAQ,KACrB,MAAMC,EAAcC,EAAMhB,GAAMiB,QAAQ,QACxC,OAAOC,MAAMC,KAAK,CAAEC,OAAQ,IAAK,CAACC,EAAGC,IAAMP,EAAYQ,IAAID,EAAG,QAAO,GACtE,CAACtB,IAEEwB,EAAYV,GAAQ,IACfW,EAAWC,gBAAgB,GAAI,OAAQvB,EAASC,IACxD,CAACD,EAASC,IAEPuB,EAAgBb,GAAQ,IACnBc,EAAoB3B,EAAaY,EAAUW,IACnD,CAACvB,EAAaY,EAAUW,IAErBK,EAAQb,IAwFd,OACIc,EAACC,EAAiB,CAAAC,SACb9B,EACG4B,EAACG,EAAgB,CAAAD,SACbF,EAACI,EAAoB,CAAA,KAGzBC,eArEJA,EAACC,aACGN,EAACO,MACDP,EAACQ,EAAgB,CAAAN,SACZnB,EAAS0B,KAAKC,IACX,MAAMC,EAzBC,CAACD,IACxB,MAAME,EAAUF,EAAIG,OAAOd,EAAO,OAE5BY,EAAoC,CACtCG,UAAWF,EAAU,UAAY,YACjCG,YAAa,MAQjB,OALIH,IACAD,EAAkBK,WAAa,mBAC/BL,EAAkBM,YAAc,oBAG7BN,CAAiB,EAYkBO,CAAmBR,GAC7C,OACIL,EAACc,aACGnB,EAACoB,iBACGlD,KAAMwC,EACNW,aAAcnC,EAAMhB,IAChByC,IAERX,EAACsB,EAAW,CAAApB,SAAEQ,EAAIa,OAAO,WANTb,EAAIa,OAAO,cAOf,SAqCpClB,EAACmB,EAAa,CAACC,IAAK5C,EAAOqB,SAAA,CACvBF,EAAC0B,EAAa,CACVrD,QAASA,EACTC,QAASA,EACTiD,OAAO,OACP5C,eAAgBA,EAChBgD,YAAY,IAlCpB3B,EAAC4B,EAAQ,CAAA1B,SACJnB,EAAS0B,KAAKC,IACX,MAAMmB,EAAUnB,EAAIa,OAAO,cAC3B,OACIlB,EAACyB,EAAU,CAAA5B,SAAA,CACa,OAAnBvB,GACG+B,EAAIG,OAAOd,EAAO,QACdC,EAAC+B,EAAQ,CAAAC,KAAOrD,IAEvBe,EAAUe,KAAKwB,GACZjC,EAACkC,EAAQ,CAELL,QAASA,EACTI,KAAMA,EACN9D,YAAaA,EACb0B,cAAeA,EACfrB,aAAcA,EACdC,eAAgBA,EAChBC,mBAAoBA,GAPfuD,OAPAJ,EAiBJ,aA+BL"}
+{"version":3,"file":"schedule-week-view.js","sources":["../../../src/schedule/schedule-week-view/schedule-week-view.tsx"],"sourcesContent":["import dayjs from \"dayjs\";\nimport { useMemo, useRef } from \"react\";\n\nimport { ThemedLoadingSpinner } from \"../../animations/themed-loading-spinner/themed-loading-spinner\";\nimport type { CellStyleProps } from \"../../shared/internal-calendar/day-cell\";\nimport { DayCell } from \"../../shared/internal-calendar/day-cell\";\nimport { useApplyStyle } from \"../../theme\";\nimport { Typography } from \"../../typography\";\nimport { TimeHelper } from \"../../util/time-helper\";\nimport * as dayViewStyles from \"../schedule-day-view/schedule-day-view.styles\";\nimport { useInitialScroll, useTimelineOffset } from \"../schedule-slot-content\";\nimport { TimeIndicator } from \"../time-indicator/time-indicator\";\nimport * as styles from \"./schedule-week-view.styles\";\nimport { TimeCell } from \"./time-cell\";\nimport type { ScheduleWeekViewProps } from \"./types\";\nimport { calculateSlotWidths } from \"./week-view-utils\";\n\ninterface WeekTimelineProps {\n    top: number;\n}\n\nconst WeekTimeline = ({ top }: WeekTimelineProps) => {\n    const timelineRef = useRef<HTMLDivElement>(null);\n\n    useApplyStyle(timelineRef, {\n        [styles.tokens.timeline.top]: `${top}px`,\n    });\n\n    return <div ref={timelineRef} className={styles.timeline} />;\n};\n\n// =============================================================================\n// MAIN COMPONENT\n// =============================================================================\n\nexport const ScheduleWeekView = ({\n    date,\n    serviceData,\n    loading,\n    minTime,\n    maxTime,\n    initialScrollTime,\n    containerRef,\n    blockedMessage,\n    onClickHiddenSlots,\n}: ScheduleWeekViewProps) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const timelineOffset = useTimelineOffset(minTime, maxTime);\n    const bodyRef = useInitialScroll(loading, minTime, initialScrollTime);\n\n    const weekDays = useMemo(() => {\n        const startOfWeek = dayjs(date).startOf(\"week\");\n        return Array.from({ length: 7 }, (_, i) => startOfWeek.add(i, \"day\"));\n    }, [date]);\n\n    const timeSlots = useMemo(() => {\n        return TimeHelper.generateTimings(30, \"24hr\", minTime, maxTime);\n    }, [minTime, maxTime]);\n\n    const slotLayoutMap = useMemo(() => {\n        return calculateSlotWidths(serviceData, weekDays, timeSlots);\n    }, [serviceData, weekDays, timeSlots]);\n\n    const today = dayjs();\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n    const generateStyleProps = (day: dayjs.Dayjs): CellStyleProps => {\n        const isToday = day.isSame(today, \"day\");\n\n        const dayCellStyleProps: CellStyleProps = {\n            labelType: isToday ? \"current\" : \"available\",\n            interactive: undefined,\n        };\n\n        if (isToday) {\n            dayCellStyleProps.circleLeft = \"selected-outline\";\n            dayCellStyleProps.circleRight = \"selected-outline\";\n        }\n\n        return dayCellStyleProps;\n    };\n\n    // =============================================================================\n    // RENDER FUNCTION\n    // =============================================================================\n    const renderHeader = () => {\n        return (\n            <div className={styles.headerContainer}>\n                <div className={styles.blankCell} />\n                <div className={styles.serviceContainer}>\n                    {weekDays.map((day) => {\n                        const dayCellStyleProps = generateStyleProps(day);\n                        return (\n                            <div\n                                className={styles.serviceHeader}\n                                key={day.format(\"YYYY-MM-DD\")}\n                            >\n                                <DayCell\n                                    date={day}\n                                    calendarDate={dayjs(date)}\n                                    {...dayCellStyleProps}\n                                />\n                                <Typography.BodyMD\n                                    className={styles.description}\n                                >\n                                    {day.format(\"ddd\")}\n                                </Typography.BodyMD>\n                            </div>\n                        );\n                    })}\n                </div>\n            </div>\n        );\n    };\n\n    const renderSlotGrid = () => (\n        <div className={styles.slotGrid}>\n            {weekDays.map((day) => {\n                const dayDate = day.format(\"YYYY-MM-DD\");\n                return (\n                    <div className={styles.slotColumn} key={dayDate}>\n                        {timelineOffset !== null &&\n                            day.isSame(today, \"day\") && (\n                                <WeekTimeline top={timelineOffset} />\n                            )}\n                        {timeSlots.map((time) => (\n                            <TimeCell\n                                key={time}\n                                dayDate={dayDate}\n                                time={time}\n                                serviceData={serviceData}\n                                slotLayoutMap={slotLayoutMap}\n                                containerRef={containerRef}\n                                blockedMessage={blockedMessage}\n                                onClickHiddenSlots={onClickHiddenSlots}\n                            />\n                        ))}\n                    </div>\n                );\n            })}\n        </div>\n    );\n\n    const renderBodyContainer = () => (\n        <div className={styles.bodyContainer} ref={bodyRef}>\n            <TimeIndicator\n                minTime={minTime}\n                maxTime={maxTime}\n                format=\"24hr\"\n                timelineOffset={timelineOffset}\n                isWeekView={true}\n            />\n            {renderSlotGrid()}\n        </div>\n    );\n\n    return (\n        <div className={dayViewStyles.scheduleContainer}>\n            {loading ? (\n                <div className={styles.loadingContainer}>\n                    <ThemedLoadingSpinner data-testid=\"loading-spinner\" />\n                </div>\n            ) : (\n                <>\n                    {renderHeader()}\n                    {renderBodyContainer()}\n                </>\n            )}\n        </div>\n    );\n};\n"],"names":["WeekTimeline","top","timelineRef","useRef","useApplyStyle","styles.tokens","timeline","_jsx","ref","className","styles.timeline","ScheduleWeekView","date","serviceData","loading","minTime","maxTime","initialScrollTime","containerRef","blockedMessage","onClickHiddenSlots","timelineOffset","useTimelineOffset","bodyRef","useInitialScroll","weekDays","useMemo","startOfWeek","dayjs","startOf","Array","from","length","_","i","add","timeSlots","TimeHelper","generateTimings","slotLayoutMap","calculateSlotWidths","today","dayViewStyles.scheduleContainer","children","styles.loadingContainer","ThemedLoadingSpinner","_jsxs","styles.headerContainer","styles.blankCell","styles.serviceContainer","map","day","dayCellStyleProps","isToday","isSame","labelType","interactive","undefined","circleLeft","circleRight","generateStyleProps","styles.serviceHeader","DayCell","Object","assign","calendarDate","Typography","BodyMD","styles.description","format","styles.bodyContainer","TimeIndicator","isWeekView","styles.slotGrid","dayDate","styles.slotColumn","time","TimeCell"],"mappings":"q5CAqBA,MAAMA,EAAe,EAAGC,UACpB,MAAMC,EAAcC,EAAuB,MAM3C,OAJAC,EAAcF,EAAa,CACvB,CAACG,EAAcC,SAASL,KAAM,GAAGA,QAG9BM,EAAA,MAAA,CAAKC,IAAKN,EAAaO,UAAWC,GAAmB,EAOnDC,EAAmB,EAC5BC,OACAC,cACAC,UACAC,UACAC,UACAC,oBACAC,eACAC,iBACAC,yBAKA,MAAMC,EAAiBC,EAAkBP,EAASC,GAC5CO,EAAUC,EAAiBV,EAASC,EAASE,GAE7CQ,EAAWC,GAAQ,KACrB,MAAMC,EAAcC,EAAMhB,GAAMiB,QAAQ,QACxC,OAAOC,MAAMC,KAAK,CAAEC,OAAQ,IAAK,CAACC,EAAGC,IAAMP,EAAYQ,IAAID,EAAG,QAAO,GACtE,CAACtB,IAEEwB,EAAYV,GAAQ,IACfW,EAAWC,gBAAgB,GAAI,OAAQvB,EAASC,IACxD,CAACD,EAASC,IAEPuB,EAAgBb,GAAQ,IACnBc,EAAoB3B,EAAaY,EAAUW,IACnD,CAACvB,EAAaY,EAAUW,IAErBK,EAAQb,IA+Fd,OACIrB,EAAA,MAAA,CAAKE,UAAWiC,EAA+BC,SAC1C7B,EACGP,EAAA,MAAA,CAAKE,UAAWmC,EAAuBD,SACnCpC,EAACsC,iBAAiC,sBAGtCC,eA5EJA,EAAA,MAAA,CAAKrC,UAAWsC,EAAsBJ,SAAA,CAClCpC,EAAA,MAAA,CAAKE,UAAWuC,IAChBzC,EAAA,MAAA,CAAKE,UAAWwC,EAAuBN,SAClClB,EAASyB,KAAKC,IACX,MAAMC,EAzBC,CAACD,IACxB,MAAME,EAAUF,EAAIG,OAAOb,EAAO,OAE5BW,EAAoC,CACtCG,UAAWF,EAAU,UAAY,YACjCG,iBAAaC,GAQjB,OALIJ,IACAD,EAAkBM,WAAa,mBAC/BN,EAAkBO,YAAc,oBAG7BP,CAAiB,EAYkBQ,CAAmBT,GAC7C,OACIL,EAAA,MAAA,CACIrC,UAAWoD,EAAoBlB,SAAA,CAG/BpC,EAACuD,EAAOC,OAAAC,OAAA,CACJpD,KAAMuC,EACNc,aAAcrC,EAAMhB,IAChBwC,IAER7C,EAAC2D,EAAWC,OAAM,CACd1D,UAAW2D,EAAkBzB,SAE5BQ,EAAIkB,OAAO,WAVXlB,EAAIkB,OAAO,cAYd,SAqC1BvB,EAAA,MAAA,CAAKrC,UAAW6D,EAAsB9D,IAAKe,YACvChB,EAACgE,GACGxD,QAASA,EACTC,QAASA,EACTqD,OAAO,OACPhD,eAAgBA,EAChBmD,YAAY,IAlCpBjE,EAAA,MAAA,CAAKE,UAAWgE,EAAe9B,SAC1BlB,EAASyB,KAAKC,IACX,MAAMuB,EAAUvB,EAAIkB,OAAO,cAC3B,OACIvB,EAAA,MAAA,CAAKrC,UAAWkE,EAAiBhC,SAAA,CACT,OAAnBtB,GACG8B,EAAIG,OAAOb,EAAO,QACdlC,EAACP,EAAY,CAACC,IAAKoB,IAE1Be,EAAUc,KAAK0B,GACZrE,EAACsE,GAEGH,QAASA,EACTE,KAAMA,EACN/D,YAAaA,EACb0B,cAAeA,EACfrB,aAAcA,EACdC,eAAgBA,EAChBC,mBAAoBA,GAPfwD,OAPuBF,EAiBlC,aA+BZ"}

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

@@ -1,16 +1,15 @@
-interface TimelineStyleProps {
-    $top: number;
-}
-export declare const LoadingContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const HeaderContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const BlankCell: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const ServiceContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const ServiceHeader: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const Description: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("../..").TypographyProps & {
-    ref?: import("react").RefObject<HTMLParagraphElement> | undefined;
-}, never>> & string;
-export declare const BodyContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const SlotGrid: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const Timeline: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, TimelineStyleProps>> & string;
-export declare const SlotColumn: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export {};
+export declare const tokens: {
+    timeline: {
+        top: string;
+    };
+};
+export declare const loadingContainer: import("@linaria/core").LinariaClassName;
+export declare const headerContainer: import("@linaria/core").LinariaClassName;
+export declare const blankCell: import("@linaria/core").LinariaClassName;
+export declare const serviceContainer: import("@linaria/core").LinariaClassName;
+export declare const serviceHeader: import("@linaria/core").LinariaClassName;
+export declare const description: import("@linaria/core").LinariaClassName;
+export declare const bodyContainer: import("@linaria/core").LinariaClassName;
+export declare const slotGrid: import("@linaria/core").LinariaClassName;
+export declare const timeline: import("@linaria/core").LinariaClassName;
+export declare const slotColumn: import("@linaria/core").LinariaClassName;