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

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

@@ -1,12 +1,12 @@
-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)`
+import e,{css as i}from"styled-components";import{Button as o}from"../../button/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=e(o)`
     color: ${d.icon};
-`,h=i.div`
+`,h=e.div`
     width: 2rem;
-`,m=i.div`
+`,m=e.div`
     display: flex;
     flex-direction: column;
     height: 100%;
-`,u=i.div`
+`,u=e.div`
     display: flex;
     justify-content: center;
     align-items: center;
@@ -15,7 +15,7 @@ import i,{css as e}from"styled-components";import{IconButton as o}from"../../ico
     border: ${n["width-010"]} ${n.solid} ${d.border};
     border-radius: ${s.md};
     background: ${d.bg};
-`,x=i.div`
+`,x=e.div`
     z-index: 3;
     max-height: ${p}px;
     border-top-right-radius: ${s.md};
@@ -25,22 +25,22 @@ import i,{css as e}from"styled-components";import{IconButton as o}from"../../ico
     overflow-x: hidden;
     overflow-y: hidden;
 
-    ${i=>i.$isMobile?e`
+    ${e=>e.$isMobile?i`
                   display: block;
                   overflow: hidden;
-              `:e`
+              `:i`
                   display: grid;
                   grid-template-columns: ${$}px 1fr;
               `}
-`,f=i.div`
+`,f=e.div`
     min-width: ${$}px;
     background: ${d["bg-strong"]};
     position: sticky;
     left: 0;
-`,w=i.div`
+`,w=e.div`
     display: grid;
-    grid-template-columns: repeat(${i=>i.$columnCount}, 1fr);
-`,v=i.div`
+    grid-template-columns: repeat(${e=>e.$columnCount}, 1fr);
+`,v=e.div`
     display: flex;
     justify-content: space-between;
     align-items: center;
@@ -52,17 +52,17 @@ import i,{css as e}from"styled-components";import{IconButton as o}from"../../ico
     &:last-child {
         border-right: none;
     }
-`,y=i.div`
+`,y=e.div`
     width: 15rem;
     padding-left: ${a["spacing-16"]};
-`,k=i(r.BodyMD)`
+`,k=e(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)`
+`,j=e(r.BodySM)`
     margin-top: ${a["spacing-8"]};
     background-color: ${d["bg-success-hover"]};
     border-radius: ${s.full};
@@ -73,7 +73,7 @@ import i,{css as e}from"styled-components";import{IconButton as o}from"../../ico
     span {
         font-weight: ${l.Spec["weight-semibold"]};
     }
-`,S=i.div`
+`,S=e.div`
     display: grid;
     grid-template-columns: ${$}px 1fr;
     width: 100%;
@@ -85,12 +85,12 @@ import i,{css as e}from"styled-components";import{IconButton as o}from"../../ico
     border-top: none;
     border-bottom-right-radius: ${s.md};
     border-bottom-left-radius: ${s.md};
-`,z=i.div`
+`,z=e.div`
     display: grid;
-    grid-template-columns: repeat(${i=>i.$columnCount}, 1fr);
+    grid-template-columns: repeat(${e=>e.$columnCount}, 1fr);
     min-width: max-content;
     position: relative;
-`,B=i.div`
+`,B=e.div`
     display: flex;
     flex-direction: column;
     min-width: ${g}px;
@@ -100,28 +100,28 @@ import i,{css as e}from"styled-components";import{IconButton as o}from"../../ico
     &:last-child {
         border-right: none;
     }
-`,M=i.div`
+`,M=e.div`
     min-height: ${c}px;
     position: relative;
     border-bottom: ${n["width-010"]} solid ${d.border};
-    ${i=>i.$dashed&&e`
+    ${e=>e.$dashed&&i`
             border-bottom-style: dashed;
         `}
     cursor: pointer;
-`,C=i(r.BodyXS)`
+`,C=e(r.BodyXS)`
     margin-top: 0;
     overflow: hidden;
     width: calc(100% - 27px);
     padding: 2px ${a["spacing-8"]};
     position: absolute;
-    top: ${i=>i.$offsetTop||0}px;
+    top: ${e=>e.$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"};
+    height: ${e=>e.$duration?e.$duration/30*c-1+"px":c-1+"px"};
     display: flex;
     justify-content: space-between;
-    background: ${i=>{switch(i.$status){case"pending":return e`
+    background: ${e=>{switch(e.$status){case"pending":return i`
                     repeating-linear-gradient(
                         135deg,
                         ${d["bg-warning"]},
@@ -131,22 +131,22 @@ import i,{css as e}from"styled-components";import{IconButton as o}from"../../ico
                     )
                 `;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"]};
+    color: ${e=>"blocked"===e.$status?d["text-inverse"]:d["text-subtle"]};
 
     border-left: ${n["width-040"]} solid
-        ${i=>"available"===i.$status?d["icon-success"]:"none"};
-`,D=i.span`
+        ${e=>"available"===e.$status?d["icon-success"]:"none"};
+`,D=e.span`
     ${l["body-xs-regular"]};
-`,T=i.span`
+`,T=e.span`
     ${l["body-xs-semibold"]};
-`,X=i.div`
+`,X=e.div`
     position: absolute;
     width: 100%;
     height: 2px;
     background: ${d["icon-primary"]};
-    top: ${i=>i.$top}px;
+    top: ${e=>e.$top}px;
     z-index: 2;
-`,_=i.div`
+`,_=e.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};

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.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":"gbAmDaA,EAAcC,EAAOC,EAAO;aAC5BC,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;"}

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{InputSelect as i}from"../../input-select/input-select.js";import"../../util/calendar-helper.js";import{DateHelper as l}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 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:u="day",minDate:y,maxDate:h,onPreviousDayClick:k,onNextDayClick:j,onCalendarDateSelect:w,onViewChange:C,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===u));return t(o,Object.assign({},f,{children:[t(r,{children:[a(n,{styleType:"light",onClick:v,children:"Today"}),a(s,{selectedDate:D,minDate:y,maxDate:h,view:u,onLeftArrowClick:e=>{if("week"===u){const t=l.toDayjs(e).subtract(1,"week");k(t.format("YYYY-MM-DD"))}else k(e)},onRightArrowClick:e=>{if("week"===u){const t=l.toDayjs(e).add(1,"week");j(t.format("YYYY-MM-DD"))}else j(e)},onCalendarDateSelect:w})]}),t(c,{children:[a(d,{children:"View by:"}),a(i,{options:x,selectedOption:b,onSelectOption:e=>null==C?void 0:C(e.value),listExtractor:e=>e.label,displayValueExtractor:e=>e.label,dropdownWidth:m})]})]}))};export{p 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 { 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":"gmBA0BO,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"}

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

@@ -1,9 +1,25 @@
-export declare const ScheduleHeaderWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const LeftSection: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const RightSection: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const StyledDateNavigator: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("../..").DateNavigatorProps, never>> & string & Omit<({ selectedDate, minDate, maxDate, loading, showDateAsShortForm, showCurrentDateAsToday, view, onLeftArrowClick, onRightArrowClick, onCalendarDateSelect, dropdownRootNode, ...otherProps }: import("../..").DateNavigatorProps) => import("react/jsx-runtime").JSX.Element, keyof import("react").Component<any, {}, any>>;
-export declare const StyledText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("../..").TypographyProps & {
-    ref?: import("react").RefObject<HTMLParagraphElement> | undefined;
-}, never>> & string;
-export declare const StyledButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("../..").ButtonProps & import("react").RefAttributes<HTMLButtonElement>, never>> & string & Omit<(props: import("../..").ButtonProps & import("react").RefAttributes<HTMLButtonElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
+export declare const ScheduleHeaderWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const LeftSection: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const RightSection: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const StyledDateNavigator: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("../..").DateNavigatorProps, never> & Partial<Pick<import("../..").DateNavigatorProps, never>>> & string & Omit<({ selectedDate, minDate, maxDate, loading, showDateAsShortForm, showCurrentDateAsToday, view, onLeftArrowClick, onRightArrowClick, onCalendarDateSelect, dropdownRootNode, className, ...otherProps }: import("../..").DateNavigatorProps) => import("react/jsx-runtime").JSX.Element, keyof import("react").Component<any, {}, any>>;
+export declare const StyledText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<any, "ref"> & {
+    weight?: import("../..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, never> & Partial<Pick<Omit<any, "ref"> & {
+    weight?: import("../..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, never>>> & string & Omit<(props: Omit<any, "ref"> & {
+    weight?: import("../..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
+export declare const StyledButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("../..").ButtonProps & import("react").RefAttributes<HTMLButtonElement>, never> & Partial<Pick<import("../..").ButtonProps & import("react").RefAttributes<HTMLButtonElement>, never>>> & string & Omit<(props: import("../..").ButtonProps & import("react").RefAttributes<HTMLButtonElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
 export declare const DROPDOWN_WIDTH = "240px";

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 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:void 0};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};
 //# 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 } 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: 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            <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","undefined","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,iBAAaC,GAQjB,OALIJ,IACAD,EAAkBM,WAAa,mBAC/BN,EAAkBO,YAAc,oBAG7BP,CAAiB,EAYkBQ,CAAmBT,GAC7C,OACIL,EAACe,aACGpB,EAACqB,iBACGnD,KAAMwC,EACNY,aAAcpC,EAAMhB,IAChByC,IAERX,EAACuB,EAAW,CAAArB,SAAEQ,EAAIc,OAAO,WANTd,EAAIc,OAAO,cAOf,SAqCpCnB,EAACoB,EAAa,CAACC,IAAK7C,EAAOqB,SAAA,CACvBF,EAAC2B,EAAa,CACVtD,QAASA,EACTC,QAASA,EACTkD,OAAO,OACP7C,eAAgBA,EAChBiD,YAAY,IAlCpB5B,EAAC6B,EAAQ,CAAA3B,SACJnB,EAAS0B,KAAKC,IACX,MAAMoB,EAAUpB,EAAIc,OAAO,cAC3B,OACInB,EAAC0B,EAAU,CAAA7B,SAAA,CACa,OAAnBvB,GACG+B,EAAIG,OAAOd,EAAO,QACdC,EAACgC,EAAQ,CAAAC,KAAOtD,IAEvBe,EAAUe,KAAKyB,GACZlC,EAACmC,EAAQ,CAELL,QAASA,EACTI,KAAMA,EACN/D,YAAaA,EACb0B,cAAeA,EACfrB,aAAcA,EACdC,eAAgBA,EAChBC,mBAAoBA,GAPfwD,OAPAJ,EAiBJ,aA+BL"}

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

@@ -1,16 +1,32 @@
 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 declare const LoadingContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const HeaderContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const BlankCell: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const ServiceContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const ServiceHeader: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const Description: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<any, "ref"> & {
+    weight?: import("../..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, never> & Partial<Pick<Omit<any, "ref"> & {
+    weight?: import("../..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, never>>> & string & Omit<(props: Omit<any, "ref"> & {
+    weight?: import("../..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
+export declare const BodyContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const SlotGrid: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const Timeline: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$top"> & TimelineStyleProps, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$top"> & TimelineStyleProps, never>>> & 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> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
 export {};

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

@@ -1 +1 @@
-{"version":3,"file":"slot-content.js","sources":["../../../src/schedule/schedule-week-view/slot-content.tsx"],"sourcesContent":["import type React from \"react\";\n\nimport { TimeHelper } from \"../../util/time-helper\";\nimport {\n    SlotAvailability,\n    SlotContentContainer,\n    SlotServiceName,\n} from \"./slot-content.styles\";\nimport type { PositionedSlot } from \"./types\";\n\ninterface SlotContentProps {\n    positionedSlot: PositionedSlot;\n    blockedMessage?: string;\n}\n\nexport const SlotContent: React.FC<SlotContentProps> = ({\n    positionedSlot,\n    blockedMessage = \"Unavailable\",\n}) => {\n    const { slot, offsetTop } = positionedSlot;\n    const duration = TimeHelper.calculateDuration(slot.startTime, slot.endTime);\n\n    return (\n        <SlotContentContainer\n            $status={slot.status}\n            $duration={duration}\n            $offsetTop={offsetTop}\n            onClick={(e) => slot.onClick && slot.onClick(slot, e)}\n        >\n            <SlotServiceName>{slot.serviceName}</SlotServiceName>\n            {duration >= 30 && (\n                <SlotAvailability>\n                    {slot.status === \"blocked\"\n                        ? blockedMessage\n                        : `${slot.booked} / ${slot.capacity}`}\n                </SlotAvailability>\n            )}\n        </SlotContentContainer>\n    );\n};\n"],"names":["SlotContent","positionedSlot","blockedMessage","slot","offsetTop","duration","TimeHelper","calculateDuration","startTime","endTime","_jsxs","SlotContentContainer","$status","status","$duration","$offsetTop","onClick","e","children","_jsx","SlotServiceName","serviceName","SlotAvailability","booked","capacity"],"mappings":"oNAeO,MAAMA,EAA0C,EACnDC,iBACAC,iBAAiB,kBAEjB,MAAMC,KAAEA,EAAIC,UAAEA,GAAcH,EACtBI,EAAWC,EAAWC,kBAAkBJ,EAAKK,UAAWL,EAAKM,SAEnE,OACIC,EAACC,EAAoB,CAAAC,QACRT,EAAKU,OAAMC,UACTT,EAAQU,WACPX,EACZY,QAAUC,GAAMd,EAAKa,SAAWb,EAAKa,QAAQb,EAAMc,GAAEC,SAAA,CAErDC,EAACC,EAAe,CAAAF,SAAEf,EAAKkB,cACtBhB,GAAY,IACTc,EAACG,YACoB,YAAhBnB,EAAKU,OACAX,EACA,GAAGC,EAAKoB,YAAYpB,EAAKqB,eAGpB"}
+{"version":3,"file":"slot-content.js","sources":["../../../src/schedule/schedule-week-view/slot-content.tsx"],"sourcesContent":["import type React from \"react\";\n\nimport { TimeHelper } from \"../../util/time-helper\";\nimport {\n    SlotAvailability,\n    SlotContentContainer,\n    SlotServiceName,\n} from \"./slot-content.styles\";\nimport type { PositionedSlot } from \"./types\";\n\ninterface SlotContentProps {\n    positionedSlot: PositionedSlot;\n    blockedMessage?: string;\n}\n\nexport const SlotContent: React.FC<SlotContentProps> = ({\n    positionedSlot,\n    blockedMessage = \"Unavailable\",\n}) => {\n    const { slot, offsetTop } = positionedSlot;\n    const duration = TimeHelper.calculateDuration(slot.startTime, slot.endTime);\n\n    return (\n        <SlotContentContainer\n            $status={slot.status}\n            $duration={duration}\n            $offsetTop={offsetTop}\n            onClick={(e: React.MouseEvent) =>\n                slot.onClick && slot.onClick(slot, e)\n            }\n        >\n            <SlotServiceName>{slot.serviceName}</SlotServiceName>\n            {duration >= 30 && (\n                <SlotAvailability>\n                    {slot.status === \"blocked\"\n                        ? blockedMessage\n                        : `${slot.booked} / ${slot.capacity}`}\n                </SlotAvailability>\n            )}\n        </SlotContentContainer>\n    );\n};\n"],"names":["SlotContent","positionedSlot","blockedMessage","slot","offsetTop","duration","TimeHelper","calculateDuration","startTime","endTime","_jsxs","SlotContentContainer","$status","status","$duration","$offsetTop","onClick","e","children","_jsx","SlotServiceName","serviceName","SlotAvailability","booked","capacity"],"mappings":"oNAeO,MAAMA,EAA0C,EACnDC,iBACAC,iBAAiB,kBAEjB,MAAMC,KAAEA,EAAIC,UAAEA,GAAcH,EACtBI,EAAWC,EAAWC,kBAAkBJ,EAAKK,UAAWL,EAAKM,SAEnE,OACIC,EAACC,EAAoB,CAAAC,QACRT,EAAKU,OAAMC,UACTT,EAAQU,WACPX,EACZY,QAAUC,GACNd,EAAKa,SAAWb,EAAKa,QAAQb,EAAMc,GAAEC,SAAA,CAGzCC,EAACC,EAAe,CAAAF,SAAEf,EAAKkB,cACtBhB,GAAY,IACTc,EAACG,YACoB,YAAhBnB,EAAKU,OACAX,EACA,GAAGC,EAAKoB,YAAYpB,EAAKqB,eAGpB"}

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

@@ -3,9 +3,25 @@ interface SlotContentContainerStyleProps {
     $duration: number;
     $offsetTop: number;
 }
-export declare const SlotContentContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("../..").TypographyProps & {
-    ref?: import("react").RefObject<HTMLParagraphElement> | undefined;
-}, SlotContentContainerStyleProps>> & string;
-export declare const SlotServiceName: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
-export declare const SlotAvailability: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+export declare const SlotContentContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<Omit<any, "ref"> & {
+    weight?: import("../..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, keyof SlotContentContainerStyleProps> & SlotContentContainerStyleProps, never> & Partial<Pick<import("styled-components").FastOmit<Omit<any, "ref"> & {
+    weight?: import("../..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, keyof SlotContentContainerStyleProps> & SlotContentContainerStyleProps, never>>> & string & Omit<(props: Omit<any, "ref"> & {
+    weight?: import("../..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
+export declare const SlotServiceName: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>>> & string;
+export declare const SlotAvailability: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>>> & string;
 export {};

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

@@ -8,7 +8,7 @@ interface SlotColumnOverlayStyleProps {
 interface HiddenColumnsStyleProps {
     $heightPercentage?: number;
 }
-export declare const SlotCell: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, SlotCellStyleProps>> & string;
-export declare const SlotColumnOverlay: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, SlotColumnOverlayStyleProps>> & string;
-export declare const HiddenColumns: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, HiddenColumnsStyleProps>> & string;
+export declare const SlotCell: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$dashed"> & SlotCellStyleProps, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$dashed"> & SlotCellStyleProps, never>>> & string;
+export declare const SlotColumnOverlay: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof SlotColumnOverlayStyleProps> & SlotColumnOverlayStyleProps, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof SlotColumnOverlayStyleProps> & SlotColumnOverlayStyleProps, never>>> & string;
+export declare const HiddenColumns: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "$heightPercentage"> & HiddenColumnsStyleProps, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "$heightPercentage"> & HiddenColumnsStyleProps, never>>> & string;
 export {};

package/schedule/schedule.styles.d.ts

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

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

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

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

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

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

@@ -2,11 +2,27 @@ interface TimelineCircleStyleProps {
     $top: number;
     $isWeekView: boolean;
 }
-export declare const TimeColumnWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const TimeColumn: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const TimeLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("../..").TypographyProps & {
-    ref?: import("react").RefObject<HTMLParagraphElement> | undefined;
-}, never>> & string;
-export declare const HourDisplay: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
-export declare const TimelineCircle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, TimelineCircleStyleProps>> & string;
+export declare const TimeColumnWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const TimeColumn: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const TimeLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<any, "ref"> & {
+    weight?: import("../..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, never> & Partial<Pick<Omit<any, "ref"> & {
+    weight?: import("../..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, never>>> & string & Omit<(props: Omit<any, "ref"> & {
+    weight?: import("../..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
+export declare const HourDisplay: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>>> & string;
+export declare const TimelineCircle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof TimelineCircleStyleProps> & TimelineCircleStyleProps, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof TimelineCircleStyleProps> & TimelineCircleStyleProps, never>>> & string;
 export {};