@useloops/design-system 1.4.680 → 1.4.682

package/dist/systems/Platform/TestItem/TestItem.js

@@ -1 +1 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("@mui/material"),t=require("@number-flow/react"),a=require("merge-sx"),o=require("react"),i=require("react-truncate-list"),s=require("../../BrandCore/Icon/Icon.js");require("../../../utils/formValidation/misc.js"),require("../../BrandCore/primitiveVariables.js"),require("../../WebCore/utils/typography.util.js"),require("../../WebCore/AnnualController/AnnualController.js"),require("../../WebCore/SelectItem/SelectItem.js"),require("../../WebCore/Accordion/Accordion.js"),require("../../WebCore/Animations/FadeIn.js");var n=require("../../WebCore/Text/Text.js");require("@mui/icons-material"),require("../../WebCore/AutocompleteBaseField/_partials/AutocompleteListbox.js"),require("../../WebCore/AutocompleteBaseField/_partials/StyledPopper.js"),require("../../WebCore/AutocompleteBaseField/_partials/StyledAutocompleteField.js"),require("../../WebCore/AutocompleteBaseField/_partials/AutocompleteChip.js"),require("../../WebCore/AutocompleteBaseField/_partials/StyledAutocompleteInput.js"),require("../../WebCore/Badge/Badge.js"),require("../../WebCore/Breadcrumb/Breadcrumb.js"),require("../../WebCore/Button/Button.js"),require("../../WebCore/ButtonBase/ButtonBase.js"),require("../../WebCore/ButtonTabGroup/_partials/ActiveIndicator.js"),require("../../WebCore/ButtonTabGroup/_partials/ButtonTabsWrapper.js"),require("../../WebCore/ButtonTabGroup/_partials/TabButton.js"),require("../../WebCore/Checkbox/StyledCheckbox.js"),require("../../WebCore/InputFieldBase/InputFieldBase.js"),require("../../WebCore/CreatableAutocomplete/CreatableAutocomplete.js"),require("../../WebCore/InputLabelBase/StyledInputLabelBase.js"),require("../../WebCore/Differential/DifferentialContainer.js"),require("../../WebCore/Differential/DifferentialRadio.js"),require("../../WebCore/DropdownMenu/StyledMenu.js"),require("../../WebCore/ExpandableTypographyClamp/ExpandableTypographyClamp.js"),require("../../WebCore/FormGenerator/FormGenerator.js"),require("../../WebCore/GridOverlay/GridOverlay.js"),require("html-react-parser");var l=require("../../WebCore/IconButton/IconButton.js");require("../../WebCore/IconButtonBase/IconButtonBase.js"),require("../../WebCore/IconButtonGroup/IconButtonGroup.js"),require("../../WebCore/Image/Image.js"),require("../../WebCore/KbdGroup/Kbd.js"),require("../../WebCore/KbdGroup/KbdGroup.js");var u=require("../../WebCore/KeyValueLabel/KeyValueLabel.js"),d=require("../../WebCore/Label/Label.js");require("../../WebCore/Likert/LikertContainer.js"),require("../../WebCore/Likert/LikertLabel.js"),require("../../WebCore/Likert/LikertRadio.js"),require("../../WebCore/Link/StyledLink.js"),require("@lottiefiles/dotlottie-react"),require("../../WebCore/LoopsAiButton/LoopsAiButton.js"),require("markdown-to-jsx");var p=require("../../WebCore/Menu/Menu.js");require("../../WebCore/ModalLayout/_partials/ModalActionsWrapper.js"),require("../../WebCore/ModalLayout/_partials/ModalContentWrapper.js");var c=require("../../WebCore/Surface/Surface.js");require("../../WebCore/NavigationButton/NavigationButton.js"),require("material-ui-popup-state/hooks"),require("../../WebCore/Nudge/NudgeButton.js"),require("../../WebCore/NumberField/NumberField.js"),require("../../BrandCore/colorRamps.js"),require("../../BrandCore/semanticColor.js"),require("../../BrandCore/types.js"),require("../../BrandCore/typography.js"),require("../../WebCore/Progress/Progress.js"),require("../../WebCore/Pill/StyledPill.js");var m=require("../../WebCore/ProgressBar/ProgressBar.js");require("../../WebCore/Radio/StyledRadio.js"),require("../../WebCore/Select/StyledSelect.js"),require("../../WebCore/RankItem/RankItemContainer.js"),require("../../WebCore/RankItem/RankItemLabel.js"),require("../../WebCore/SortableList/SortableList.js"),require("../../WebCore/SortableList/components/SortableItem/SortableItem.js"),require("../../WebCore/SortableList/components/SortableOverlay/SortableOverlay.js"),require("@tiptap/extension-placeholder"),require("@tiptap/starter-kit"),require("mui-tiptap"),require("../../WebCore/RichTextField/StyledRichTextEditor.js");var x=require("../../WebCore/Skeleton/Skeleton.js");require("../../WebCore/Slider/StyledSlider.js"),require("../../WebCore/StarRating/StarRating.js"),require("../../WebCore/Switch/StyledSwitch.js"),require("../../WebCore/Textarea/Textarea.js"),require("../../WebCore/TrialCard/TrialCardContainers.js"),require("../../WebCore/TrialCard/TrialPill.js"),require("../../WebCore/UserMenu/UserMenuButton.js"),require("../../WebCore/VideoModal/VideoModal.js");var b=require("../TestStatus/TestStatus.js");function j(e){return e&&e.__esModule?e:{default:e}}var g=j(t);const C=({animated:t,label:a,primaryText:o,secondaryText:i})=>{const s=o.match(/\d{1,2}:\d{2}/),l=o.split(":"),u=!isNaN(Number(o)),d=i.includes("%")&&!isNaN(Number(i.replace("%","")));return e.jsxs(r.Stack,{direction:{sm:"row",md:"row",lg:"column"},sx:{alignItems:"center",gap:{sm:1,md:1,lg:0},background:e=>e.custom.palette.surface.default,minWidth:"92px",border:e=>`1px solid ${e.custom.palette.neutral[100]}`,borderRadius:1,padding:e=>`${e.spacing(e.custom.padding.sm)} ${e.spacing(e.custom.padding.md)}`,color:e=>e.custom.palette.text.primary,flexShrink:0,height:"100%"},children:[e.jsx(n.Text,{size:"sm",sx:{width:"100%",textAlign:{md:"left",lg:"center"}},children:a}),e.jsx(n.Text,{bold:!0,sx:{fontSize:e=>({sm:e.custom.typography.body.sm,md:e.custom.typography.body.md,lg:e.custom.typography.body.xxl}),flexShrink:0},monospaced:!0,children:e.jsx(e.Fragment,{children:s||u?e.jsx(e.Fragment,{children:s?e.jsxs(e.Fragment,{children:[e.jsx(g.default,{value:Number(l[0]),format:{minimumIntegerDigits:2,useGrouping:!1},animated:t}),":",e.jsx(g.default,{value:Number(l[1]),format:{minimumIntegerDigits:2,useGrouping:!1},animated:t})]}):e.jsx(g.default,{value:Number(o),animated:t})}):e.jsx(e.Fragment,{children:o})})}),e.jsx(n.Text,{size:"sm",secondary:!0,sx:{flexShrink:0},monospaced:!0,children:d?e.jsxs(e.Fragment,{children:[e.jsx(g.default,{value:Number(i.replace("%","")),animated:t}),"%"]}):i})]})},q=({animated:t,iconName:o,label:i,value:l,slotProps:u})=>e.jsxs(r.Box,{sx:{display:"flex",alignItems:"center",gap:.5},children:[e.jsx(s.default,{name:o,...u?.icon,sx:a.mergeSx({color:e=>e.custom.palette.icon.secondary},u?.icon?.sx)}),e.jsxs(n.Text,{monospaced:!0,component:"p",size:"xs",sx:e=>({color:e=>e.custom.palette.text.primary,"& > span":{color:e=>e.custom.palette.text.secondary,[e.breakpoints.up("lg")]:{display:"inline"},[e.breakpoints.down("lg")]:{display:"none"},[e.containerQueries.up("lg")]:{display:"inline"},[e.containerQueries.down("lg")]:{display:"none"}}}),children:[e.jsx(g.default,{value:l,animated:t})," ",e.jsx("span",{children:i})]})]});module.exports=({animated:t=!0,status:j,menuItems:g,title:h,tags:y,stats:W,user:f,slotProps:B,loading:S=!1,...T})=>{const k=r.useTheme(),[I,v]=o.useState(!1);return e.jsx(c,{variation:"raised",borderradius:"lg",...T,sx:a.mergeSx({padding:e=>e.spacing(e.custom.padding.md),border:e=>`1px solid ${e.custom.palette.stroke.light}`,width:"100%",cursor:"pointer","&:hover .TestItem__Menu":{opacity:1}},T.sx),children:e.jsxs(r.Stack,{component:"article",sx:{gap:2},children:[e.jsxs(r.Stack,{component:"header",sx:{gap:1,justifyContent:"space-between"},children:[e.jsxs(r.Stack,{direction:"row",sx:{justifyContent:"space-between",alignItems:"center",gap:1},children:[S?e.jsx(x,{sx:{width:90,height:32}}):e.jsx(b,{status:j,...B?.status}),!S&&Boolean(g?.length)&&e.jsx(p.default,{trigger:e.jsx(l,{icon:e.jsx(s.default,{name:"more-horizontal",size:16}),variation:"outlined",className:"TestItem__Menu",sx:{width:28,aspectRatio:1,borderRadius:"100% !important",transition:"opacity 0.3s ease",opacity:0,"&:focus":{background:e=>`${e.custom.palette.interaction.press} !important`,opacity:1}}}),bindOn:["toggle"],menuItems:g,width:128,offset:[0,8],placement:"bottom-end",...B?.menu})]}),S?e.jsx(x,{}):e.jsx(n.Text,{size:"xl",bold:!0,...B?.title,sx:B?.title?.sx,children:h})]}),e.jsx(r.Box,{children:S?e.jsx(r.Box,{sx:{display:"flex",flexDirection:"row",gap:.5},children:[...new Array(3).fill(void 0)].map((r,t)=>e.jsx(x,{sx:{maxWidth:50}},`test-item-skeleton-${t}`))}):Boolean(y?.length)&&e.jsx(i.TruncatedList,{style:{display:"flex",flexWrap:"wrap",alignItems:"center",maxHeight:56,gap:k.m.xs,listStyleType:"none",paddingInlineStart:0,margin:0,...I&&{maxHeight:"none"}},alwaysShowTruncator:I,renderTruncator:({hiddenItemsCount:r})=>r>0?e.jsx(d,{body:`+${r}`,weight:"light",onClick:e=>{e.stopPropagation(),v(!0)},...B?.tagsExpand,sx:a.mergeSx({background:e=>e.custom.palette.neutral[50]},B?.tagsExpand?.sx)}):e.jsx(l,{sizing:"sm",icon:e.jsx(s.default,{name:"chevron-up",size:16}),onClick:e=>{e.stopPropagation(),v(!1)},...B?.tagsCollapse,sx:a.mergeSx({color:e=>e.custom.palette.icon.primary},B?.tagsCollapse?.sx)}),children:y.map(({category:r,selection:t})=>e.jsx(u,{keyString:r,valueString:t},r))})}),!S&&W?.progress&&e.jsx(c,{variation:"sunken",borderradius:"md",sx:{border:e=>`1px solid ${e.custom.palette.neutral[100]}`,padding:e=>e.spacing(e.custom.padding.md)},children:e.jsxs(r.Stack,{sx:{gap:2},children:[e.jsx(m,{variation:"determinate",value:W.progress.percentage}),e.jsxs(r.Box,{sx:[{gap:{sm:.5,md:1},justifyContent:"stretch"},e=>({display:"grid",[e.breakpoints.up("lg")]:{gridTemplateColumns:"repeat(3, 1fr)"},[e.breakpoints.down("lg")]:{gridTemplateColumns:"auto"},[e.containerQueries.up("lg")]:{gridTemplateColumns:"repeat(3, 1fr)"},[e.containerQueries.down("lg")]:{gridTemplateColumns:"auto"}})],children:[e.jsx(r.Box,{sx:{flexBasis:0,flexGrow:1},children:e.jsx(C,{animated:t,label:"Completed",primaryText:W.progress.completed.toString(),secondaryText:`of ${W.progress.total}`})}),e.jsx(r.Box,{sx:{flexBasis:0,flexGrow:1},children:e.jsx(C,{animated:t,label:"Incomplete",primaryText:W.progress.incomplete.toString(),secondaryText:`${W.progress.incompletePercentage}%`})}),e.jsx(r.Box,{sx:{flexBasis:0,flexGrow:1},children:e.jsx(C,{animated:t,label:"Duration",primaryText:W.progress.averageDuration,secondaryText:"average"})})]})]})}),e.jsxs(r.Box,{component:"footer",sx:{display:"flex",flexDirection:"row",justifyContent:f?"space-between":"end",gap:1},children:[f&&e.jsx(r.Box,{sx:{display:"flex",alignItems:"center",gap:1},children:S?e.jsxs(e.Fragment,{children:[e.jsx(x,{sx:{borderRadius:"50%",width:24,aspectRatio:1,flexShrink:0}}),e.jsx(x,{sx:{width:100}})]}):e.jsx(e.Fragment,{children:e.jsx(n.Text,{clamp:1,size:"xs",secondary:!0,children:f.activityDescription})})}),!S&&"draft"!==j&&e.jsxs(r.Box,{sx:{display:"flex",alignItems:"center",gap:2,flexShrink:0},children:[e.jsx(q,{animated:t,iconName:"data-bar",label:"answers",value:W?.count?.answers??0}),e.jsx(q,{animated:t,iconName:"comment-filled",label:"comments",value:W?.count?.comments??0,slotProps:{icon:{size:20}}})]})]})]})})};
+"use strict";var e=require("react/jsx-runtime"),r=require("@mui/material"),t=require("@number-flow/react"),a=require("merge-sx"),o=require("react"),i=require("react-truncate-list"),s=require("../../BrandCore/Icon/Icon.js");require("../../../utils/formValidation/misc.js"),require("../../BrandCore/primitiveVariables.js"),require("../../WebCore/utils/typography.util.js"),require("../../BrandCore/textures.js"),require("../../WebCore/AnnualController/AnnualController.js"),require("../../WebCore/SelectItem/SelectItem.js"),require("../../WebCore/Accordion/Accordion.js"),require("../../WebCore/Animations/FadeIn.js");var n=require("../../WebCore/Text/Text.js");require("@mui/icons-material"),require("../../WebCore/AutocompleteBaseField/_partials/AutocompleteListbox.js"),require("../../WebCore/AutocompleteBaseField/_partials/StyledPopper.js"),require("../../WebCore/AutocompleteBaseField/_partials/StyledAutocompleteField.js"),require("../../WebCore/AutocompleteBaseField/_partials/AutocompleteChip.js"),require("../../WebCore/AutocompleteBaseField/_partials/StyledAutocompleteInput.js"),require("../../WebCore/Badge/Badge.js"),require("../../WebCore/Breadcrumb/Breadcrumb.js"),require("../../WebCore/Button/Button.js"),require("../../WebCore/ButtonBase/ButtonBase.js"),require("../../WebCore/ButtonTabGroup/_partials/ActiveIndicator.js"),require("../../WebCore/ButtonTabGroup/_partials/ButtonTabsWrapper.js"),require("../../WebCore/ButtonTabGroup/_partials/TabButton.js"),require("../../WebCore/Checkbox/StyledCheckbox.js"),require("../../WebCore/InputFieldBase/InputFieldBase.js"),require("../../WebCore/CreatableAutocomplete/CreatableAutocomplete.js"),require("../../WebCore/InputLabelBase/StyledInputLabelBase.js"),require("../../WebCore/Differential/DifferentialContainer.js"),require("../../WebCore/Differential/DifferentialRadio.js"),require("../../WebCore/DropdownMenu/StyledMenu.js"),require("../../WebCore/ExpandableTypographyClamp/ExpandableTypographyClamp.js"),require("../../WebCore/FormGenerator/FormGenerator.js"),require("../../WebCore/GridOverlay/GridOverlay.js"),require("html-react-parser");var l=require("../../WebCore/IconButton/IconButton.js");require("../../WebCore/IconButtonBase/IconButtonBase.js"),require("../../WebCore/IconButtonGroup/IconButtonGroup.js"),require("../../WebCore/Image/Image.js"),require("../../WebCore/KbdGroup/Kbd.js"),require("../../WebCore/KbdGroup/KbdGroup.js");var u=require("../../WebCore/KeyValueLabel/KeyValueLabel.js"),d=require("../../WebCore/Label/Label.js");require("../../WebCore/Likert/LikertContainer.js"),require("../../WebCore/Likert/LikertLabel.js"),require("../../WebCore/Likert/LikertRadio.js"),require("../../WebCore/Link/StyledLink.js"),require("@lottiefiles/dotlottie-react"),require("../../WebCore/LoopsAiButton/LoopsAiButton.js"),require("markdown-to-jsx");var p=require("../../WebCore/Menu/Menu.js");require("../../WebCore/ModalLayout/_partials/ModalActionsWrapper.js"),require("../../WebCore/ModalLayout/_partials/ModalContentWrapper.js");var c=require("../../WebCore/Surface/Surface.js");require("../../WebCore/NavigationButton/NavigationButton.js"),require("material-ui-popup-state/hooks"),require("../../WebCore/Nudge/NudgeButton.js"),require("../../WebCore/NumberField/NumberField.js"),require("../../BrandCore/colorRamps.js"),require("../../BrandCore/semanticColor.js"),require("../../BrandCore/types.js"),require("../../BrandCore/typography.js"),require("../../WebCore/Progress/Progress.js"),require("../../WebCore/Pill/StyledPill.js");var m=require("../../WebCore/ProgressBar/ProgressBar.js");require("../../WebCore/Radio/StyledRadio.js"),require("../../WebCore/Select/StyledSelect.js"),require("../../WebCore/RankItem/RankItemContainer.js"),require("../../WebCore/RankItem/RankItemLabel.js"),require("../../WebCore/SortableList/SortableList.js"),require("../../WebCore/SortableList/components/SortableItem/SortableItem.js"),require("../../WebCore/SortableList/components/SortableOverlay/SortableOverlay.js"),require("@tiptap/extension-placeholder"),require("@tiptap/starter-kit"),require("mui-tiptap"),require("../../WebCore/RichTextField/StyledRichTextEditor.js");var x=require("../../WebCore/Skeleton/Skeleton.js");require("../../WebCore/Slider/StyledSlider.js"),require("../../WebCore/StarRating/StarRating.js"),require("../../WebCore/Switch/StyledSwitch.js"),require("../../WebCore/Textarea/Textarea.js"),require("../../WebCore/TrialCard/TrialCardContainers.js"),require("../../WebCore/TrialCard/TrialPill.js"),require("../../WebCore/UserMenu/UserMenuButton.js"),require("../../WebCore/VideoModal/VideoModal.js");var b=require("../TestStatus/TestStatus.js");function j(e){return e&&e.__esModule?e:{default:e}}var g=j(t);const C=({animated:t,label:a,primaryText:o,secondaryText:i})=>{const s=o.match(/\d{1,2}:\d{2}/),l=o.split(":"),u=!isNaN(Number(o)),d=i.includes("%")&&!isNaN(Number(i.replace("%","")));return e.jsxs(r.Stack,{direction:{sm:"row",md:"row",lg:"column"},sx:{alignItems:"center",gap:{sm:1,md:1,lg:0},background:e=>e.custom.palette.surface.default,minWidth:"92px",border:e=>`1px solid ${e.custom.palette.neutral[100]}`,borderRadius:1,padding:e=>`${e.spacing(e.custom.padding.sm)} ${e.spacing(e.custom.padding.md)}`,color:e=>e.custom.palette.text.primary,flexShrink:0,height:"100%"},children:[e.jsx(n.Text,{size:"sm",sx:{width:"100%",textAlign:{md:"left",lg:"center"}},children:a}),e.jsx(n.Text,{bold:!0,sx:{fontSize:e=>({sm:e.custom.typography.body.sm,md:e.custom.typography.body.md,lg:e.custom.typography.body.xxl}),flexShrink:0},monospaced:!0,children:e.jsx(e.Fragment,{children:s||u?e.jsx(e.Fragment,{children:s?e.jsxs(e.Fragment,{children:[e.jsx(g.default,{value:Number(l[0]),format:{minimumIntegerDigits:2,useGrouping:!1},animated:t}),":",e.jsx(g.default,{value:Number(l[1]),format:{minimumIntegerDigits:2,useGrouping:!1},animated:t})]}):e.jsx(g.default,{value:Number(o),animated:t})}):e.jsx(e.Fragment,{children:o})})}),e.jsx(n.Text,{size:"sm",secondary:!0,sx:{flexShrink:0},monospaced:!0,children:d?e.jsxs(e.Fragment,{children:[e.jsx(g.default,{value:Number(i.replace("%","")),animated:t}),"%"]}):i})]})},q=({animated:t,iconName:o,label:i,value:l,slotProps:u})=>e.jsxs(r.Box,{sx:{display:"flex",alignItems:"center",gap:.5},children:[e.jsx(s.default,{name:o,...u?.icon,sx:a.mergeSx({color:e=>e.custom.palette.icon.secondary},u?.icon?.sx)}),e.jsxs(n.Text,{monospaced:!0,component:"p",size:"xs",sx:e=>({color:e=>e.custom.palette.text.primary,"& > span":{color:e=>e.custom.palette.text.secondary,[e.breakpoints.up("lg")]:{display:"inline"},[e.breakpoints.down("lg")]:{display:"none"},[e.containerQueries.up("lg")]:{display:"inline"},[e.containerQueries.down("lg")]:{display:"none"}}}),children:[e.jsx(g.default,{value:l,animated:t})," ",e.jsx("span",{children:i})]})]});module.exports=({animated:t=!0,status:j,menuItems:g,title:h,tags:y,stats:W,user:f,slotProps:B,loading:S=!1,...T})=>{const k=r.useTheme(),[I,v]=o.useState(!1);return e.jsx(c,{variation:"raised",borderradius:"lg",...T,sx:a.mergeSx({padding:e=>e.spacing(e.custom.padding.md),border:e=>`1px solid ${e.custom.palette.stroke.light}`,width:"100%",cursor:"pointer","&:hover .TestItem__Menu":{opacity:1}},T.sx),children:e.jsxs(r.Stack,{component:"article",sx:{gap:2},children:[e.jsxs(r.Stack,{component:"header",sx:{gap:1,justifyContent:"space-between"},children:[e.jsxs(r.Stack,{direction:"row",sx:{justifyContent:"space-between",alignItems:"center",gap:1},children:[S?e.jsx(x,{sx:{width:90,height:32}}):e.jsx(b,{status:j,...B?.status}),!S&&Boolean(g?.length)&&e.jsx(p.default,{trigger:e.jsx(l,{icon:e.jsx(s.default,{name:"more-horizontal",size:16}),variation:"outlined",className:"TestItem__Menu",sx:{width:28,aspectRatio:1,borderRadius:"100% !important",transition:"opacity 0.3s ease",opacity:0,"&:focus":{background:e=>`${e.custom.palette.interaction.press} !important`,opacity:1}}}),bindOn:["toggle"],menuItems:g,width:128,offset:[0,8],placement:"bottom-end",...B?.menu})]}),S?e.jsx(x,{}):e.jsx(n.Text,{size:"xl",bold:!0,...B?.title,sx:B?.title?.sx,children:h})]}),e.jsx(r.Box,{children:S?e.jsx(r.Box,{sx:{display:"flex",flexDirection:"row",gap:.5},children:[...new Array(3).fill(void 0)].map((r,t)=>e.jsx(x,{sx:{maxWidth:50}},`test-item-skeleton-${t}`))}):Boolean(y?.length)&&e.jsx(i.TruncatedList,{style:{display:"flex",flexWrap:"wrap",alignItems:"center",maxHeight:56,gap:k.m.xs,listStyleType:"none",paddingInlineStart:0,margin:0,...I&&{maxHeight:"none"}},alwaysShowTruncator:I,renderTruncator:({hiddenItemsCount:r})=>r>0?e.jsx(d,{body:`+${r}`,weight:"light",onClick:e=>{e.stopPropagation(),v(!0)},...B?.tagsExpand,sx:a.mergeSx({background:e=>e.custom.palette.neutral[50]},B?.tagsExpand?.sx)}):e.jsx(l,{sizing:"sm",icon:e.jsx(s.default,{name:"chevron-up",size:16}),onClick:e=>{e.stopPropagation(),v(!1)},...B?.tagsCollapse,sx:a.mergeSx({color:e=>e.custom.palette.icon.primary},B?.tagsCollapse?.sx)}),children:y.map(({category:r,selection:t})=>e.jsx(u,{keyString:r,valueString:t},r))})}),!S&&W?.progress&&e.jsx(c,{variation:"sunken",borderradius:"md",sx:{border:e=>`1px solid ${e.custom.palette.neutral[100]}`,padding:e=>e.spacing(e.custom.padding.md)},children:e.jsxs(r.Stack,{sx:{gap:2},children:[e.jsx(m,{variation:"determinate",value:W.progress.percentage}),e.jsxs(r.Box,{sx:[{gap:{sm:.5,md:1},justifyContent:"stretch"},e=>({display:"grid",[e.breakpoints.up("lg")]:{gridTemplateColumns:"repeat(3, 1fr)"},[e.breakpoints.down("lg")]:{gridTemplateColumns:"auto"},[e.containerQueries.up("lg")]:{gridTemplateColumns:"repeat(3, 1fr)"},[e.containerQueries.down("lg")]:{gridTemplateColumns:"auto"}})],children:[e.jsx(r.Box,{sx:{flexBasis:0,flexGrow:1},children:e.jsx(C,{animated:t,label:"Completed",primaryText:W.progress.completed.toString(),secondaryText:`of ${W.progress.total}`})}),e.jsx(r.Box,{sx:{flexBasis:0,flexGrow:1},children:e.jsx(C,{animated:t,label:"Incomplete",primaryText:W.progress.incomplete.toString(),secondaryText:`${W.progress.incompletePercentage}%`})}),e.jsx(r.Box,{sx:{flexBasis:0,flexGrow:1},children:e.jsx(C,{animated:t,label:"Duration",primaryText:W.progress.averageDuration,secondaryText:"average"})})]})]})}),e.jsxs(r.Box,{component:"footer",sx:{display:"flex",flexDirection:"row",justifyContent:f?"space-between":"end",gap:1},children:[f&&e.jsx(r.Box,{sx:{display:"flex",alignItems:"center",gap:1},children:S?e.jsxs(e.Fragment,{children:[e.jsx(x,{sx:{borderRadius:"50%",width:24,aspectRatio:1,flexShrink:0}}),e.jsx(x,{sx:{width:100}})]}):e.jsx(e.Fragment,{children:e.jsx(n.Text,{clamp:1,size:"xs",secondary:!0,children:f.activityDescription})})}),!S&&"draft"!==j&&e.jsxs(r.Box,{sx:{display:"flex",alignItems:"center",gap:2,flexShrink:0},children:[e.jsx(q,{animated:t,iconName:"data-bar",label:"answers",value:W?.count?.answers??0}),e.jsx(q,{animated:t,iconName:"comment-filled",label:"comments",value:W?.count?.comments??0,slotProps:{icon:{size:20}}})]})]})]})})};

package/dist/systems/Platform/TestStatus/TestStatus.js

@@ -1 +1 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("react");require("@mui/material");var o=require("../../BrandCore/Icon/Icon.js");require("../../../utils/formValidation/misc.js"),require("../../BrandCore/primitiveVariables.js"),require("../../WebCore/utils/typography.util.js"),require("../../WebCore/AnnualController/AnnualController.js"),require("../../WebCore/SelectItem/SelectItem.js"),require("../../WebCore/Accordion/Accordion.js"),require("../../WebCore/Animations/FadeIn.js");var t=require("../../WebCore/Text/Text.js");require("@mui/icons-material"),require("../../WebCore/AutocompleteBaseField/_partials/AutocompleteListbox.js"),require("../../WebCore/AutocompleteBaseField/_partials/StyledPopper.js"),require("../../WebCore/AutocompleteBaseField/_partials/StyledAutocompleteField.js"),require("../../WebCore/AutocompleteBaseField/_partials/AutocompleteChip.js"),require("../../WebCore/AutocompleteBaseField/_partials/StyledAutocompleteInput.js"),require("merge-sx"),require("../../WebCore/Badge/Badge.js"),require("../../WebCore/Breadcrumb/Breadcrumb.js"),require("../../WebCore/Button/Button.js"),require("../../WebCore/ButtonBase/ButtonBase.js"),require("../../WebCore/ButtonTabGroup/_partials/ActiveIndicator.js"),require("../../WebCore/ButtonTabGroup/_partials/ButtonTabsWrapper.js"),require("../../WebCore/ButtonTabGroup/_partials/TabButton.js"),require("../../WebCore/Checkbox/StyledCheckbox.js"),require("../../WebCore/InputFieldBase/InputFieldBase.js"),require("../../WebCore/CreatableAutocomplete/CreatableAutocomplete.js"),require("../../WebCore/InputLabelBase/StyledInputLabelBase.js"),require("../../WebCore/Differential/DifferentialContainer.js"),require("../../WebCore/Differential/DifferentialRadio.js"),require("../../WebCore/DropdownMenu/StyledMenu.js"),require("../../WebCore/ExpandableTypographyClamp/ExpandableTypographyClamp.js"),require("../../WebCore/FormGenerator/FormGenerator.js"),require("../../WebCore/GridOverlay/GridOverlay.js"),require("html-react-parser"),require("../../WebCore/IconButton/IconButton.js"),require("../../WebCore/IconButtonBase/IconButtonBase.js"),require("../../WebCore/IconButtonGroup/IconButtonGroup.js"),require("../../WebCore/Image/Image.js"),require("../../WebCore/KbdGroup/Kbd.js"),require("../../WebCore/KbdGroup/KbdGroup.js"),require("../../WebCore/KeyValueLabel/KeyValueLabel.js"),require("../../WebCore/Label/Label.js"),require("../../WebCore/Likert/LikertContainer.js"),require("../../WebCore/Likert/LikertLabel.js"),require("../../WebCore/Likert/LikertRadio.js"),require("../../WebCore/Link/StyledLink.js"),require("@lottiefiles/dotlottie-react"),require("../../WebCore/LoopsAiButton/LoopsAiButton.js"),require("markdown-to-jsx"),require("material-ui-popup-state/hooks"),require("../../WebCore/Surface/Surface.js"),require("../../WebCore/Menu/MenuItem.js"),require("../../WebCore/ModalLayout/_partials/ModalActionsWrapper.js"),require("../../WebCore/ModalLayout/_partials/ModalContentWrapper.js"),require("../../WebCore/NavigationButton/NavigationButton.js"),require("../../WebCore/Nudge/NudgeButton.js"),require("../../WebCore/NumberField/NumberField.js"),require("../../BrandCore/colorRamps.js"),require("../../BrandCore/semanticColor.js"),require("../../BrandCore/types.js"),require("../../BrandCore/typography.js"),require("../../WebCore/Progress/Progress.js"),require("../../WebCore/Pill/StyledPill.js"),require("../../WebCore/ProgressBar/ProgressBar.js"),require("../../WebCore/Radio/StyledRadio.js"),require("../../WebCore/Select/StyledSelect.js"),require("../../WebCore/RankItem/RankItemContainer.js"),require("../../WebCore/RankItem/RankItemLabel.js"),require("../../WebCore/SortableList/SortableList.js"),require("../../WebCore/SortableList/components/SortableItem/SortableItem.js"),require("../../WebCore/SortableList/components/SortableOverlay/SortableOverlay.js"),require("@tiptap/extension-placeholder"),require("@tiptap/starter-kit"),require("mui-tiptap"),require("../../WebCore/RichTextField/StyledRichTextEditor.js"),require("../../WebCore/Skeleton/Skeleton.js"),require("../../WebCore/Slider/StyledSlider.js"),require("../../WebCore/StarRating/StarRating.js"),require("../../WebCore/Switch/StyledSwitch.js"),require("../../WebCore/Textarea/Textarea.js"),require("../../WebCore/TrialCard/TrialCardContainers.js"),require("../../WebCore/TrialCard/TrialPill.js"),require("../../WebCore/UserMenu/UserMenuButton.js"),require("../../WebCore/VideoModal/VideoModal.js");var i=require("./_partials/StyledBox/StyledBox.js"),a=require("./helpers/index.js");const u=r.forwardRef(({status:r,sizing:u,...s},l)=>e.jsxs(i.StyledTestStatus,{ref:l,sizing:u,status:r,...s,children:[e.jsx(o.default,{name:a.getStatusIconName(r)}),e.jsx(t.Text,{size:"sm",children:a.getStatusText(r)})]}));module.exports=u;
+"use strict";var e=require("react/jsx-runtime"),r=require("react");require("@mui/material");var o=require("../../BrandCore/Icon/Icon.js");require("../../../utils/formValidation/misc.js"),require("../../BrandCore/primitiveVariables.js"),require("../../WebCore/utils/typography.util.js"),require("../../BrandCore/textures.js"),require("../../WebCore/AnnualController/AnnualController.js"),require("../../WebCore/SelectItem/SelectItem.js"),require("../../WebCore/Accordion/Accordion.js"),require("../../WebCore/Animations/FadeIn.js");var t=require("../../WebCore/Text/Text.js");require("@mui/icons-material"),require("../../WebCore/AutocompleteBaseField/_partials/AutocompleteListbox.js"),require("../../WebCore/AutocompleteBaseField/_partials/StyledPopper.js"),require("../../WebCore/AutocompleteBaseField/_partials/StyledAutocompleteField.js"),require("../../WebCore/AutocompleteBaseField/_partials/AutocompleteChip.js"),require("../../WebCore/AutocompleteBaseField/_partials/StyledAutocompleteInput.js"),require("merge-sx"),require("../../WebCore/Badge/Badge.js"),require("../../WebCore/Breadcrumb/Breadcrumb.js"),require("../../WebCore/Button/Button.js"),require("../../WebCore/ButtonBase/ButtonBase.js"),require("../../WebCore/ButtonTabGroup/_partials/ActiveIndicator.js"),require("../../WebCore/ButtonTabGroup/_partials/ButtonTabsWrapper.js"),require("../../WebCore/ButtonTabGroup/_partials/TabButton.js"),require("../../WebCore/Checkbox/StyledCheckbox.js"),require("../../WebCore/InputFieldBase/InputFieldBase.js"),require("../../WebCore/CreatableAutocomplete/CreatableAutocomplete.js"),require("../../WebCore/InputLabelBase/StyledInputLabelBase.js"),require("../../WebCore/Differential/DifferentialContainer.js"),require("../../WebCore/Differential/DifferentialRadio.js"),require("../../WebCore/DropdownMenu/StyledMenu.js"),require("../../WebCore/ExpandableTypographyClamp/ExpandableTypographyClamp.js"),require("../../WebCore/FormGenerator/FormGenerator.js"),require("../../WebCore/GridOverlay/GridOverlay.js"),require("html-react-parser"),require("../../WebCore/IconButton/IconButton.js"),require("../../WebCore/IconButtonBase/IconButtonBase.js"),require("../../WebCore/IconButtonGroup/IconButtonGroup.js"),require("../../WebCore/Image/Image.js"),require("../../WebCore/KbdGroup/Kbd.js"),require("../../WebCore/KbdGroup/KbdGroup.js"),require("../../WebCore/KeyValueLabel/KeyValueLabel.js"),require("../../WebCore/Label/Label.js"),require("../../WebCore/Likert/LikertContainer.js"),require("../../WebCore/Likert/LikertLabel.js"),require("../../WebCore/Likert/LikertRadio.js"),require("../../WebCore/Link/StyledLink.js"),require("@lottiefiles/dotlottie-react"),require("../../WebCore/LoopsAiButton/LoopsAiButton.js"),require("markdown-to-jsx"),require("material-ui-popup-state/hooks"),require("../../WebCore/Surface/Surface.js"),require("../../WebCore/Menu/MenuItem.js"),require("../../WebCore/ModalLayout/_partials/ModalActionsWrapper.js"),require("../../WebCore/ModalLayout/_partials/ModalContentWrapper.js"),require("../../WebCore/NavigationButton/NavigationButton.js"),require("../../WebCore/Nudge/NudgeButton.js"),require("../../WebCore/NumberField/NumberField.js"),require("../../BrandCore/colorRamps.js"),require("../../BrandCore/semanticColor.js"),require("../../BrandCore/types.js"),require("../../BrandCore/typography.js"),require("../../WebCore/Progress/Progress.js"),require("../../WebCore/Pill/StyledPill.js"),require("../../WebCore/ProgressBar/ProgressBar.js"),require("../../WebCore/Radio/StyledRadio.js"),require("../../WebCore/Select/StyledSelect.js"),require("../../WebCore/RankItem/RankItemContainer.js"),require("../../WebCore/RankItem/RankItemLabel.js"),require("../../WebCore/SortableList/SortableList.js"),require("../../WebCore/SortableList/components/SortableItem/SortableItem.js"),require("../../WebCore/SortableList/components/SortableOverlay/SortableOverlay.js"),require("@tiptap/extension-placeholder"),require("@tiptap/starter-kit"),require("mui-tiptap"),require("../../WebCore/RichTextField/StyledRichTextEditor.js"),require("../../WebCore/Skeleton/Skeleton.js"),require("../../WebCore/Slider/StyledSlider.js"),require("../../WebCore/StarRating/StarRating.js"),require("../../WebCore/Switch/StyledSwitch.js"),require("../../WebCore/Textarea/Textarea.js"),require("../../WebCore/TrialCard/TrialCardContainers.js"),require("../../WebCore/TrialCard/TrialPill.js"),require("../../WebCore/UserMenu/UserMenuButton.js"),require("../../WebCore/VideoModal/VideoModal.js");var i=require("./_partials/StyledBox/StyledBox.js"),a=require("./helpers/index.js");const u=r.forwardRef(({status:r,sizing:u,...s},l)=>e.jsxs(i.StyledTestStatus,{ref:l,sizing:u,status:r,...s,children:[e.jsx(o.default,{name:a.getStatusIconName(r)}),e.jsx(t.Text,{size:"sm",children:a.getStatusText(r)})]}));module.exports=u;

package/dist/systems/Platform/VideoControls/VideoControls.js

@@ -1 +1 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("@mui/material"),i=require("@use-it/event-listener"),a=require("../../../utils/normaliseFloat.js");require("../../../utils/formValidation/misc.js"),require("../../BrandCore/Icon/Icon.js"),require("../../BrandCore/primitiveVariables.js"),require("../../WebCore/utils/typography.util.js"),require("../../WebCore/AnnualController/AnnualController.js"),require("../../WebCore/SelectItem/SelectItem.js"),require("../../WebCore/Accordion/Accordion.js"),require("../../WebCore/Animations/FadeIn.js"),require("../../WebCore/Text/Text.js"),require("@mui/icons-material"),require("../../WebCore/AutocompleteBaseField/_partials/AutocompleteListbox.js"),require("../../WebCore/AutocompleteBaseField/_partials/StyledPopper.js"),require("../../WebCore/AutocompleteBaseField/_partials/StyledAutocompleteField.js"),require("../../WebCore/AutocompleteBaseField/_partials/AutocompleteChip.js"),require("../../WebCore/AutocompleteBaseField/_partials/StyledAutocompleteInput.js"),require("merge-sx"),require("../../WebCore/Badge/Badge.js"),require("../../WebCore/Breadcrumb/Breadcrumb.js"),require("../../WebCore/Button/Button.js"),require("../../WebCore/ButtonBase/ButtonBase.js"),require("../../WebCore/ButtonTabGroup/_partials/ActiveIndicator.js"),require("../../WebCore/ButtonTabGroup/_partials/ButtonTabsWrapper.js"),require("../../WebCore/ButtonTabGroup/_partials/TabButton.js"),require("../../WebCore/Checkbox/StyledCheckbox.js"),require("../../WebCore/InputFieldBase/InputFieldBase.js"),require("../../WebCore/CreatableAutocomplete/CreatableAutocomplete.js"),require("../../WebCore/InputLabelBase/StyledInputLabelBase.js"),require("../../WebCore/Differential/DifferentialContainer.js"),require("../../WebCore/Differential/DifferentialRadio.js"),require("../../WebCore/DropdownMenu/StyledMenu.js"),require("../../WebCore/ExpandableTypographyClamp/ExpandableTypographyClamp.js"),require("../../WebCore/FormGenerator/FormGenerator.js"),require("../../WebCore/GridOverlay/GridOverlay.js"),require("html-react-parser"),require("../../WebCore/IconButton/IconButton.js"),require("../../WebCore/IconButtonBase/IconButtonBase.js"),require("../../WebCore/IconButtonGroup/IconButtonGroup.js"),require("../../WebCore/Image/Image.js"),require("../../WebCore/KbdGroup/Kbd.js"),require("../../WebCore/KbdGroup/KbdGroup.js"),require("../../WebCore/KeyValueLabel/KeyValueLabel.js"),require("../../WebCore/Label/Label.js"),require("../../WebCore/Likert/LikertContainer.js"),require("../../WebCore/Likert/LikertLabel.js"),require("../../WebCore/Likert/LikertRadio.js"),require("../../WebCore/Link/StyledLink.js"),require("@lottiefiles/dotlottie-react"),require("../../WebCore/LoopsAiButton/LoopsAiButton.js"),require("markdown-to-jsx"),require("material-ui-popup-state/hooks");var o=require("../../WebCore/Surface/Surface.js");require("../../WebCore/Menu/MenuItem.js"),require("../../WebCore/ModalLayout/_partials/ModalActionsWrapper.js"),require("../../WebCore/ModalLayout/_partials/ModalContentWrapper.js"),require("../../WebCore/NavigationButton/NavigationButton.js"),require("../../WebCore/Nudge/NudgeButton.js"),require("../../WebCore/NumberField/NumberField.js"),require("../../BrandCore/colorRamps.js"),require("../../BrandCore/semanticColor.js"),require("../../BrandCore/types.js"),require("../../BrandCore/typography.js"),require("../../WebCore/Progress/Progress.js"),require("../../WebCore/Pill/StyledPill.js"),require("../../WebCore/ProgressBar/ProgressBar.js"),require("../../WebCore/Radio/StyledRadio.js"),require("../../WebCore/Select/StyledSelect.js"),require("../../WebCore/RankItem/RankItemContainer.js"),require("../../WebCore/RankItem/RankItemLabel.js"),require("../../WebCore/SortableList/SortableList.js"),require("../../WebCore/SortableList/components/SortableItem/SortableItem.js"),require("../../WebCore/SortableList/components/SortableOverlay/SortableOverlay.js"),require("@tiptap/extension-placeholder"),require("@tiptap/starter-kit"),require("mui-tiptap"),require("../../WebCore/RichTextField/StyledRichTextEditor.js"),require("../../WebCore/Skeleton/Skeleton.js"),require("../../WebCore/Slider/StyledSlider.js"),require("../../WebCore/StarRating/StarRating.js"),require("../../WebCore/Switch/StyledSwitch.js"),require("../../WebCore/Textarea/Textarea.js"),require("../../WebCore/TrialCard/TrialCardContainers.js"),require("../../WebCore/TrialCard/TrialPill.js"),require("../../WebCore/UserMenu/UserMenuButton.js"),require("../../WebCore/VideoModal/VideoModal.js");var n=require("./components/ActionButton/ActionButton.js"),s=require("./components/Timeline/Timeline.js");function l(e){return e&&e.__esModule?e:{default:e}}var u=l(i);const d=t.styled(o)(({theme:e})=>({display:"flex",flex:1,padding:e.spacing(e.custom.padding.md),borderColor:e.custom.palette.stroke.light,borderWidth:1,gap:e.spacing(e.custom.padding.sm),borderStyle:"solid",flexDirection:"column"})),m=t.styled(t.Stack)(({theme:e})=>({alignItems:"center",gap:e.spacing(e.custom.padding.md),justifyContent:"space-between",flexDirection:"row",flex:1})),b=r.forwardRef(({id:t,videoElement:i,initialEndTime:o=0,initialCurrentTime:l=0,initialMuted:b,initialVolume:c,markers:p,options:C,slots:f,events:{onEnd:q,onPlay:g,onSeekEnd:j,onSeeking:y,onSeekStart:W,onTimeUpdate:T,onPause:k,onVolumeChange:B,onVolumeMute:v,onRestart:S,onFirstPlay:h,onFirstEnded:F,onReset:I}={},videoSeekTime:E,slotProps:x},L)=>{const[P,A]=r.useState(!1),[w,M]=r.useState([]),R={rtl:!1,volumeControls:!0,normaliseTime:!1,markerIndicatorMode:"time",markerIndicator:!1,markerIndicatorSize:3,volumeControlsType:"mute",disableBufferingEvents:!1,...C},[{seeking:G,endTime:V,currentTime:_,playing:D,buffering:K,loaded:N,ended:O,volume:z,muted:U,startTime:H,firstPlay:J,firstEnded:Q},X]=r.useState({startTime:a.normaliseFloat(R.normaliseTime?l:0),endTime:a.normaliseFloat(R.normaliseTime?o:i.duration),currentTime:a.normaliseFloat(l??0),loaded:!0,ended:!1,firstPlay:!1,firstEnded:!1,seeking:!1,playing:!1,volume:c||1,muted:b||!1,buffering:!1});r.useEffect(()=>{if(i.muted=U,i.volume=z,R.normaliseTime&&(void 0===o||void 0===l))throw new Error("Please supply an initial end time and initial currentTime for normalising time in VideoControls.tsx");return()=>{le()}},[]),r.useEffect(()=>{X(e=>({...e,startTime:a.normaliseFloat(R.normaliseTime?l:0),endTime:a.normaliseFloat(R.normaliseTime?o:i.duration),currentTime:a.normaliseFloat(l??0)})),i.currentTime=a.normaliseFloat(l??0)},[l,o]);const Y=r.useCallback(()=>{X(e=>({...e,playing:!1,ended:!0,...!Q&&{firstEnded:!0}})),q&&q(),!Q&&F&&F()},[Q]);r.useEffect(()=>{if(!i||null==E)return;(async()=>{const e=!i.paused,r=E===V;X(e=>({...e,playing:!1,currentTime:a.normaliseFloat(E)})),await new Promise(e=>{const r=()=>{i.removeEventListener("seeked",r),e()};i.addEventListener("seeked",r),setTimeout(e,500)}),X(e=>({...e,currentTime:a.normaliseFloat(E)})),await new Promise(e=>setTimeout(e,50)),X(t=>({...t,playing:e,currentTime:a.normaliseFloat(r?E-.001:E+.001)}))})().catch(e=>{console.error("Error seeking video:",e)})},[E,i]);const Z=r.useCallback(e=>{X(r=>({...r,muted:e.target?.muted,volume:"number"==typeof e.target?.volume?e.target?.volume:1})),U!==e.target?.muted&&v&&v(!U),z!==e.target?.volume&&B&&B(z)},[U,z]),$=r.useCallback(()=>{const e=a.normaliseFloat(i.currentTime)>=V&&V!==a.normaliseFloat(i.duration)&&!O,r=a.normaliseFloat(i.currentTime)>=V&&V===a.normaliseFloat(i.duration)&&!O&&!D;(e||r)&&(i.pause(),i.dispatchEvent(new Event("ended"))),X(e=>({...e,currentTime:a.normaliseFloat(i.currentTime)})),T&&T(a.normaliseFloat(i.currentTime))},[V,O,D]),ee=r.useCallback(()=>{X(e=>({...e,playing:!1})),k&&k()},[_]),re=r.useCallback(()=>{X(e=>({...e,playing:!0,ended:!1,...!R?.disableBufferingEvents&&{buffering:!1},...!J&&{firstPlay:!0}})),!J&&h&&h(),g&&g()},[J,R?.disableBufferingEvents]),te=r.useCallback(()=>{R?.disableBufferingEvents||X(e=>({...e,buffering:!0}))},[R?.disableBufferingEvents]),ie=r.useCallback(()=>{R?.disableBufferingEvents||X(e=>({...e,buffering:!1}))},[K,R?.disableBufferingEvents]),ae=r.useCallback(()=>{if(R?.disableBufferingEvents)return;const e=[];for(let r=0;r<i.buffered.length;r++){const t=i.buffered.start(r),a=i.buffered.end(r);if(a>=H&&t<=V){const r=Math.max(t,H),i=Math.min(a,V);e.push({start:r-H,end:i-H,startPercent:(r-H)/(V-H)*100,widthPercent:(i-r)/(V-H)*100})}}M(e)},[G,V,_,D,K,N,O,z,U,H,w,R?.disableBufferingEvents]),oe=r.useCallback(async e=>{D&&le(),i.currentTime=H,e&&await se(),S&&S()},[D,_,H,V,O]),ne=r.useCallback(async()=>{D&&le(),i.currentTime=H,X(e=>({...e,startTime:a.normaliseFloat(R.normaliseTime?l:0),endTime:a.normaliseFloat(R.normaliseTime?o:i.duration),currentTime:a.normaliseFloat(l??0),loaded:!0,ended:!1,firstPlay:!1,firstEnded:!1,seeking:!1,playing:!1})),I&&I()},[D,_,H,V,O,l,o]),se=async()=>{await i.play()},le=()=>{i.pause()},ue=r.useCallback(e=>{i.currentTime=a.normaliseFloat(e),X(r=>({...r,currentTime:a.normaliseFloat(e),ended:!1,seeking:!0,...!R?.disableBufferingEvents&&{buffering:!1},firstPlay:!J||r.firstPlay,bufferProgress:e})),y&&y(e),!J&&h&&h()},[K,J,R?.disableBufferingEvents]),de=r.useCallback(async()=>{document.hidden?D&&!i.paused?(A(!0),le()):A(!1):(P&&!D&&await se(),A(!1))},[D,P,le,se,i]),me=r.useCallback(e=>{e&&i.pause(),X(e=>({...e,seeking:!0})),W&&W()},[O]),be=r.useCallback(async(e,r,t)=>{r&&(i.currentTime=r),e&&!O&&await i.play(),t&&D&&i.pause(),X(e=>({...e,...r?{currentTime:r}:{},ended:!t&&e.ended,seeking:!1})),j&&j(r)},[D,O,K,G]);return u.default("visibilitychange",de,document),u.default("pause",ee,i),u.default("playing",re,i),u.default("timeupdate",$,i),u.default("ended",Y,i),u.default("volumechange",Z,i),u.default("waiting",te,i),u.default("canplay",ie,i),u.default("progress",ae,i),r.useImperativeHandle(L,()=>({play:se,pause:le,restart:oe,reset:ne,seek:(e,r,t)=>be(r,e,t),videoState:{seeking:G,endTime:V,currentTime:_,playing:D,buffering:K,loaded:N,ended:O,volume:z,firstPlay:J,firstEnded:Q,muted:U,startTime:H}})),e.jsxs(d,{variation:"raised",borderradius:"xl",id:t,sx:x?.paperContainer?.sx,children:[e.jsxs(m,{...R?.rtl&&{dir:"rtl"},children:[e.jsx(n,{seeking:G,playing:D,ended:O,buffering:K,handleAction:async()=>{O?await oe(!0):D?le():await se()}}),e.jsx(s,{handleSeeking:ue,handleSeekEnd:be,handleSeekStart:me,ended:O,marker:f?.marker,markers:p,markerIndicatorMode:R.markerIndicatorMode,markerIndicatorSize:R.markerIndicatorSize,markerIndicator:R.markerIndicator,startTime:R.normaliseTime?H:0,currentTime:_,endTime:V,playing:D,bufferRanges:w,buffering:K,volume:z,muted:U,volumeControls:R.volumeControls,volumeControlsType:R.volumeControlsType,handleVolumeMute:()=>{i.muted=!U},handleVolumeChange:e=>{i.volume=e,U&&(i.muted=!1)}})]}),f?.bottom]})});var c=r.memo(b);module.exports=c;
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("@mui/material"),i=require("@use-it/event-listener"),a=require("../../../utils/normaliseFloat.js");require("../../../utils/formValidation/misc.js"),require("../../BrandCore/Icon/Icon.js"),require("../../BrandCore/primitiveVariables.js"),require("../../WebCore/utils/typography.util.js"),require("../../BrandCore/textures.js"),require("../../WebCore/AnnualController/AnnualController.js"),require("../../WebCore/SelectItem/SelectItem.js"),require("../../WebCore/Accordion/Accordion.js"),require("../../WebCore/Animations/FadeIn.js"),require("../../WebCore/Text/Text.js"),require("@mui/icons-material"),require("../../WebCore/AutocompleteBaseField/_partials/AutocompleteListbox.js"),require("../../WebCore/AutocompleteBaseField/_partials/StyledPopper.js"),require("../../WebCore/AutocompleteBaseField/_partials/StyledAutocompleteField.js"),require("../../WebCore/AutocompleteBaseField/_partials/AutocompleteChip.js"),require("../../WebCore/AutocompleteBaseField/_partials/StyledAutocompleteInput.js"),require("merge-sx"),require("../../WebCore/Badge/Badge.js"),require("../../WebCore/Breadcrumb/Breadcrumb.js"),require("../../WebCore/Button/Button.js"),require("../../WebCore/ButtonBase/ButtonBase.js"),require("../../WebCore/ButtonTabGroup/_partials/ActiveIndicator.js"),require("../../WebCore/ButtonTabGroup/_partials/ButtonTabsWrapper.js"),require("../../WebCore/ButtonTabGroup/_partials/TabButton.js"),require("../../WebCore/Checkbox/StyledCheckbox.js"),require("../../WebCore/InputFieldBase/InputFieldBase.js"),require("../../WebCore/CreatableAutocomplete/CreatableAutocomplete.js"),require("../../WebCore/InputLabelBase/StyledInputLabelBase.js"),require("../../WebCore/Differential/DifferentialContainer.js"),require("../../WebCore/Differential/DifferentialRadio.js"),require("../../WebCore/DropdownMenu/StyledMenu.js"),require("../../WebCore/ExpandableTypographyClamp/ExpandableTypographyClamp.js"),require("../../WebCore/FormGenerator/FormGenerator.js"),require("../../WebCore/GridOverlay/GridOverlay.js"),require("html-react-parser"),require("../../WebCore/IconButton/IconButton.js"),require("../../WebCore/IconButtonBase/IconButtonBase.js"),require("../../WebCore/IconButtonGroup/IconButtonGroup.js"),require("../../WebCore/Image/Image.js"),require("../../WebCore/KbdGroup/Kbd.js"),require("../../WebCore/KbdGroup/KbdGroup.js"),require("../../WebCore/KeyValueLabel/KeyValueLabel.js"),require("../../WebCore/Label/Label.js"),require("../../WebCore/Likert/LikertContainer.js"),require("../../WebCore/Likert/LikertLabel.js"),require("../../WebCore/Likert/LikertRadio.js"),require("../../WebCore/Link/StyledLink.js"),require("@lottiefiles/dotlottie-react"),require("../../WebCore/LoopsAiButton/LoopsAiButton.js"),require("markdown-to-jsx"),require("material-ui-popup-state/hooks");var o=require("../../WebCore/Surface/Surface.js");require("../../WebCore/Menu/MenuItem.js"),require("../../WebCore/ModalLayout/_partials/ModalActionsWrapper.js"),require("../../WebCore/ModalLayout/_partials/ModalContentWrapper.js"),require("../../WebCore/NavigationButton/NavigationButton.js"),require("../../WebCore/Nudge/NudgeButton.js"),require("../../WebCore/NumberField/NumberField.js"),require("../../BrandCore/colorRamps.js"),require("../../BrandCore/semanticColor.js"),require("../../BrandCore/types.js"),require("../../BrandCore/typography.js"),require("../../WebCore/Progress/Progress.js"),require("../../WebCore/Pill/StyledPill.js"),require("../../WebCore/ProgressBar/ProgressBar.js"),require("../../WebCore/Radio/StyledRadio.js"),require("../../WebCore/Select/StyledSelect.js"),require("../../WebCore/RankItem/RankItemContainer.js"),require("../../WebCore/RankItem/RankItemLabel.js"),require("../../WebCore/SortableList/SortableList.js"),require("../../WebCore/SortableList/components/SortableItem/SortableItem.js"),require("../../WebCore/SortableList/components/SortableOverlay/SortableOverlay.js"),require("@tiptap/extension-placeholder"),require("@tiptap/starter-kit"),require("mui-tiptap"),require("../../WebCore/RichTextField/StyledRichTextEditor.js"),require("../../WebCore/Skeleton/Skeleton.js"),require("../../WebCore/Slider/StyledSlider.js"),require("../../WebCore/StarRating/StarRating.js"),require("../../WebCore/Switch/StyledSwitch.js"),require("../../WebCore/Textarea/Textarea.js"),require("../../WebCore/TrialCard/TrialCardContainers.js"),require("../../WebCore/TrialCard/TrialPill.js"),require("../../WebCore/UserMenu/UserMenuButton.js"),require("../../WebCore/VideoModal/VideoModal.js");var n=require("./components/ActionButton/ActionButton.js"),s=require("./components/Timeline/Timeline.js");function l(e){return e&&e.__esModule?e:{default:e}}var u=l(i);const d=t.styled(o)(({theme:e})=>({display:"flex",flex:1,padding:e.spacing(e.custom.padding.md),borderColor:e.custom.palette.stroke.light,borderWidth:1,gap:e.spacing(e.custom.padding.sm),borderStyle:"solid",flexDirection:"column"})),m=t.styled(t.Stack)(({theme:e})=>({alignItems:"center",gap:e.spacing(e.custom.padding.md),justifyContent:"space-between",flexDirection:"row",flex:1})),b=r.forwardRef(({id:t,videoElement:i,initialEndTime:o=0,initialCurrentTime:l=0,initialMuted:b,initialVolume:c,markers:p,options:C,slots:f,events:{onEnd:q,onPlay:g,onSeekEnd:j,onSeeking:y,onSeekStart:W,onTimeUpdate:T,onPause:k,onVolumeChange:B,onVolumeMute:v,onRestart:S,onFirstPlay:h,onFirstEnded:F,onReset:I}={},videoSeekTime:E,slotProps:x},L)=>{const[P,A]=r.useState(!1),[w,M]=r.useState([]),R={rtl:!1,volumeControls:!0,normaliseTime:!1,markerIndicatorMode:"time",markerIndicator:!1,markerIndicatorSize:3,volumeControlsType:"mute",disableBufferingEvents:!1,...C},[{seeking:G,endTime:V,currentTime:_,playing:D,buffering:K,loaded:N,ended:O,volume:z,muted:U,startTime:H,firstPlay:J,firstEnded:Q},X]=r.useState({startTime:a.normaliseFloat(R.normaliseTime?l:0),endTime:a.normaliseFloat(R.normaliseTime?o:i.duration),currentTime:a.normaliseFloat(l??0),loaded:!0,ended:!1,firstPlay:!1,firstEnded:!1,seeking:!1,playing:!1,volume:c||1,muted:b||!1,buffering:!1});r.useEffect(()=>{if(i.muted=U,i.volume=z,R.normaliseTime&&(void 0===o||void 0===l))throw new Error("Please supply an initial end time and initial currentTime for normalising time in VideoControls.tsx");return()=>{le()}},[]),r.useEffect(()=>{X(e=>({...e,startTime:a.normaliseFloat(R.normaliseTime?l:0),endTime:a.normaliseFloat(R.normaliseTime?o:i.duration),currentTime:a.normaliseFloat(l??0)})),i.currentTime=a.normaliseFloat(l??0)},[l,o]);const Y=r.useCallback(()=>{X(e=>({...e,playing:!1,ended:!0,...!Q&&{firstEnded:!0}})),q&&q(),!Q&&F&&F()},[Q]);r.useEffect(()=>{if(!i||null==E)return;(async()=>{const e=!i.paused,r=E===V;X(e=>({...e,playing:!1,currentTime:a.normaliseFloat(E)})),await new Promise(e=>{const r=()=>{i.removeEventListener("seeked",r),e()};i.addEventListener("seeked",r),setTimeout(e,500)}),X(e=>({...e,currentTime:a.normaliseFloat(E)})),await new Promise(e=>setTimeout(e,50)),X(t=>({...t,playing:e,currentTime:a.normaliseFloat(r?E-.001:E+.001)}))})().catch(e=>{console.error("Error seeking video:",e)})},[E,i]);const Z=r.useCallback(e=>{X(r=>({...r,muted:e.target?.muted,volume:"number"==typeof e.target?.volume?e.target?.volume:1})),U!==e.target?.muted&&v&&v(!U),z!==e.target?.volume&&B&&B(z)},[U,z]),$=r.useCallback(()=>{const e=a.normaliseFloat(i.currentTime)>=V&&V!==a.normaliseFloat(i.duration)&&!O,r=a.normaliseFloat(i.currentTime)>=V&&V===a.normaliseFloat(i.duration)&&!O&&!D;(e||r)&&(i.pause(),i.dispatchEvent(new Event("ended"))),X(e=>({...e,currentTime:a.normaliseFloat(i.currentTime)})),T&&T(a.normaliseFloat(i.currentTime))},[V,O,D]),ee=r.useCallback(()=>{X(e=>({...e,playing:!1})),k&&k()},[_]),re=r.useCallback(()=>{X(e=>({...e,playing:!0,ended:!1,...!R?.disableBufferingEvents&&{buffering:!1},...!J&&{firstPlay:!0}})),!J&&h&&h(),g&&g()},[J,R?.disableBufferingEvents]),te=r.useCallback(()=>{R?.disableBufferingEvents||X(e=>({...e,buffering:!0}))},[R?.disableBufferingEvents]),ie=r.useCallback(()=>{R?.disableBufferingEvents||X(e=>({...e,buffering:!1}))},[K,R?.disableBufferingEvents]),ae=r.useCallback(()=>{if(R?.disableBufferingEvents)return;const e=[];for(let r=0;r<i.buffered.length;r++){const t=i.buffered.start(r),a=i.buffered.end(r);if(a>=H&&t<=V){const r=Math.max(t,H),i=Math.min(a,V);e.push({start:r-H,end:i-H,startPercent:(r-H)/(V-H)*100,widthPercent:(i-r)/(V-H)*100})}}M(e)},[G,V,_,D,K,N,O,z,U,H,w,R?.disableBufferingEvents]),oe=r.useCallback(async e=>{D&&le(),i.currentTime=H,e&&await se(),S&&S()},[D,_,H,V,O]),ne=r.useCallback(async()=>{D&&le(),i.currentTime=H,X(e=>({...e,startTime:a.normaliseFloat(R.normaliseTime?l:0),endTime:a.normaliseFloat(R.normaliseTime?o:i.duration),currentTime:a.normaliseFloat(l??0),loaded:!0,ended:!1,firstPlay:!1,firstEnded:!1,seeking:!1,playing:!1})),I&&I()},[D,_,H,V,O,l,o]),se=async()=>{await i.play()},le=()=>{i.pause()},ue=r.useCallback(e=>{i.currentTime=a.normaliseFloat(e),X(r=>({...r,currentTime:a.normaliseFloat(e),ended:!1,seeking:!0,...!R?.disableBufferingEvents&&{buffering:!1},firstPlay:!J||r.firstPlay,bufferProgress:e})),y&&y(e),!J&&h&&h()},[K,J,R?.disableBufferingEvents]),de=r.useCallback(async()=>{document.hidden?D&&!i.paused?(A(!0),le()):A(!1):(P&&!D&&await se(),A(!1))},[D,P,le,se,i]),me=r.useCallback(e=>{e&&i.pause(),X(e=>({...e,seeking:!0})),W&&W()},[O]),be=r.useCallback(async(e,r,t)=>{r&&(i.currentTime=r),e&&!O&&await i.play(),t&&D&&i.pause(),X(e=>({...e,...r?{currentTime:r}:{},ended:!t&&e.ended,seeking:!1})),j&&j(r)},[D,O,K,G]);return u.default("visibilitychange",de,document),u.default("pause",ee,i),u.default("playing",re,i),u.default("timeupdate",$,i),u.default("ended",Y,i),u.default("volumechange",Z,i),u.default("waiting",te,i),u.default("canplay",ie,i),u.default("progress",ae,i),r.useImperativeHandle(L,()=>({play:se,pause:le,restart:oe,reset:ne,seek:(e,r,t)=>be(r,e,t),videoState:{seeking:G,endTime:V,currentTime:_,playing:D,buffering:K,loaded:N,ended:O,volume:z,firstPlay:J,firstEnded:Q,muted:U,startTime:H}})),e.jsxs(d,{variation:"raised",borderradius:"xl",id:t,sx:x?.paperContainer?.sx,children:[e.jsxs(m,{...R?.rtl&&{dir:"rtl"},children:[e.jsx(n,{seeking:G,playing:D,ended:O,buffering:K,handleAction:async()=>{O?await oe(!0):D?le():await se()}}),e.jsx(s,{handleSeeking:ue,handleSeekEnd:be,handleSeekStart:me,ended:O,marker:f?.marker,markers:p,markerIndicatorMode:R.markerIndicatorMode,markerIndicatorSize:R.markerIndicatorSize,markerIndicator:R.markerIndicator,startTime:R.normaliseTime?H:0,currentTime:_,endTime:V,playing:D,bufferRanges:w,buffering:K,volume:z,muted:U,volumeControls:R.volumeControls,volumeControlsType:R.volumeControlsType,handleVolumeMute:()=>{i.muted=!U},handleVolumeChange:e=>{i.volume=e,U&&(i.muted=!1)}})]}),f?.bottom]})});var c=r.memo(b);module.exports=c;

package/dist/systems/WebCore/InputFieldBase/InputFieldBase.d.ts

@@ -6,7 +6,7 @@ import { TextFieldProps } from '@mui/material';
 type InputFieldBaseProps = TextFieldProps;
 declare const InputFieldBase: _emotion_styled.StyledComponent<{
     variant?: _mui_material.TextFieldVariants | undefined;
-} & Omit<_mui_material.FilledTextFieldProps | _mui_material.OutlinedTextFieldProps | _mui_material.StandardTextFieldProps, "variant"> & (_mui_system.MUIStyledCommonProps<_mui_material.Theme> & InputFieldBaseProps), {}, {}>;
+} & Omit<_mui_material.OutlinedTextFieldProps | _mui_material.FilledTextFieldProps | _mui_material.StandardTextFieldProps, "variant"> & (_mui_system.MUIStyledCommonProps<_mui_material.Theme> & InputFieldBaseProps), {}, {}>;
 
 export { InputFieldBase as default };
 export type { InputFieldBaseProps };

package/dist/systems/WebCore/Loader/Loader.js

@@ -1 +1 @@
-"use strict";var t=require("react/jsx-runtime"),e=require("@lottiefiles/dotlottie-react"),o=require("@mui/material");const i=()=>t.jsx(e.DotLottieReact,{src:"https://useloops-public.s3.eu-west-2.amazonaws.com/public/logo/loops-logo-animation.lottie",loop:!0,autoplay:!0,width:1920,height:1080});module.exports=({fullscreen:e})=>e?t.jsx(o.Box,{sx:{display:"flex",justifyContent:"center",alignItems:"center",width:"100dvw",height:"calc(100dvh - 80px)",background:t=>t.custom.palette.white},children:t.jsx(o.Box,{sx:{width:200},children:t.jsx(i,{})})}):t.jsx(i,{});
+"use strict";var e=require("react/jsx-runtime"),t=require("@lottiefiles/dotlottie-react"),i=require("@mui/material"),o=require("../../../utils/cdn.js");const s=()=>e.jsx(t.DotLottieReact,{src:o.cdnAsset("logo/loops-logo-animation.lottie"),loop:!0,autoplay:!0,width:1920,height:1080});module.exports=({fullscreen:t})=>t?e.jsx(i.Box,{sx:{display:"flex",justifyContent:"center",alignItems:"center",width:"100dvw",height:"calc(100dvh - 80px)",background:e=>e.custom.palette.white},children:e.jsx(i.Box,{sx:{width:200},children:e.jsx(s,{})})}):e.jsx(s,{});

package/dist/systems/WebCore/UserMenu/UserMenu.d.ts

@@ -1,9 +1,13 @@
 import { PopperProps } from '@mui/material';
 import { PropsWithChildren, FunctionComponent } from 'react';
+import { IconName } from '../../../BrandCore/Icon.js';
 import { MenuItemProps } from '../Menu/MenuItem.js';
+import { UserMenuAccent } from './UserMenuButton.js';
 
 interface UserMenuProps extends PropsWithChildren {
+    accent?: UserMenuAccent;
     avatar?: string;
+    avatarIcon?: IconName;
     email: string;
     menuItems?: MenuItemProps[];
     name: string;
@@ -14,5 +18,5 @@ interface UserMenuProps extends PropsWithChildren {
 }
 declare const UserMenu: FunctionComponent<UserMenuProps>;
 
-export { UserMenu as default };
+export { UserMenuAccent, UserMenu as default };
 export type { UserMenuProps };

package/dist/systems/WebCore/UserMenu/UserMenu.js

@@ -1 +1 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("material-ui-popup-state/hooks"),r=require("../Menu/Menu.js"),a=require("./UserMenuButton.js");module.exports=({avatar:n,email:u,menuItems:s,name:i,offset:m=[0,8],placement:p="right-end",rounded:o,width:d=192})=>{const l=t.usePopupState({variant:"popper"});return e.jsx(r.default,{placement:p,offset:m,menuItems:s,state:l,trigger:e.jsx(a,{active:l.isOpen,avatar:n,email:u,name:i,rounded:o,withMenu:!!s?.length}),width:d,children:e.jsx(e.Fragment,{children:s?.map((e,t)=>r.mapMenuItems(e,t,l))})})};
+"use strict";var e=require("react/jsx-runtime"),t=require("material-ui-popup-state/hooks"),a=require("../Menu/Menu.js"),r=require("./UserMenuButton.js");module.exports=({accent:n,avatar:u,avatarIcon:s,email:i,menuItems:m,name:o,offset:c=[0,8],placement:p="right-end",rounded:d,width:l=192})=>{const h=t.usePopupState({variant:"popper"});return e.jsx(a.default,{placement:p,offset:c,menuItems:m,state:h,trigger:e.jsx(r,{active:h.isOpen,accent:n,avatar:u,avatarIcon:s,email:i,name:o,rounded:d,withMenu:!!m?.length}),width:l,children:e.jsx(e.Fragment,{children:m?.map((e,t)=>a.mapMenuItems(e,t,h))})})};

package/dist/systems/WebCore/UserMenu/UserMenuButton.d.ts

@@ -0,0 +1,6 @@
+interface UserMenuAccent {
+    color: string;
+    surface: string;
+}
+
+export type { UserMenuAccent };

package/dist/systems/WebCore/UserMenu/UserMenuButton.js

@@ -1 +1 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("@mui/material"),r=require("react"),n=require("../../BrandCore/Icon/Icon.js"),s=require("../Avatar/Avatar.js"),i=require("../Text/Text.js");const a=t.styled(t.Box)(({theme:e})=>({alignItems:"center",display:"flex",gap:e.spacing(1),justifyContent:"space-between"})),o=t.styled(t.Stack,{shouldForwardProp:e=>!["withMenu"].includes(e)})(({withMenu:e})=>({textAlign:"left",width:e?118:152,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"})),d=t.styled(t.Stack)(({theme:e})=>({alignItems:"center",color:e.custom.palette.icon.secondary,display:"flex",justifyContent:"center"})),c=t.styled(t.Button,{shouldForwardProp:e=>!["active","rounded"].includes(e)})(({active:e,rounded:t,theme:r})=>({backgroundColor:e?r.custom.palette.interaction.press:"transparent",borderRadius:r.spacing(t?r.custom.radius.round:r.custom.radius.md),justifyContent:"flex-start",minWidth:0,overflow:"hidden",padding:r.spacing(.5),textTransform:"none",width:"100%","&:hover":{backgroundColor:r.custom.palette.interaction.hover}}));module.exports=({active:u,avatar:l,email:h,name:x,rounded:m,withMenu:p})=>{const j=t.useTheme(),v=r.useRef(null);return e.jsx(c,{active:u,rounded:m,children:e.jsxs(a,{ref:v,children:[e.jsx(s,{src:l,sizing:"sm"}),e.jsx(t.Fade,{in:!0,children:e.jsxs(a,{children:[e.jsxs(o,{withMenu:p,children:[e.jsx(i.Text,{size:"sm",variant:"button",noWrap:!0,children:x}),e.jsx(i.Text,{size:"xs",variant:"button",noWrap:!0,sx:{color:j.custom.palette.text.secondary},children:h})]}),p&&e.jsx(d,{children:e.jsx(n.default,{name:"chevron-right",size:24})})]})})]})})};
+"use strict";var e=require("react/jsx-runtime"),r=require("@mui/material"),t=require("react"),o=require("../../../utils/shouldForwardProp.js"),n=require("../../BrandCore/Icon/Icon.js"),a=require("../Avatar/Avatar.js"),s=require("../Text/Text.js");const c=r.styled(r.Box)(({theme:e})=>({alignItems:"center",display:"flex",gap:e.spacing(1),justifyContent:"space-between"})),i=r.styled(r.Stack,{shouldForwardProp:o.omitProps(["withMenu"])})(({withMenu:e})=>({textAlign:"left",width:e?118:152,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"})),l=r.styled(r.Stack)(({theme:e})=>({alignItems:"center",color:e.custom.palette.icon.secondary,display:"flex",justifyContent:"center"})),d=r.styled(r.Button,{shouldForwardProp:o.omitProps(["active","accentColor","accentSurface","rounded"])})(({active:e,accentColor:r,accentSurface:t,rounded:o,theme:n})=>({backgroundColor:t??(e?n.custom.palette.interaction.press:"transparent"),border:`1px solid ${r??"transparent"}`,borderRadius:n.spacing(o?n.custom.radius.round:n.custom.radius.md),justifyContent:"flex-start",minWidth:0,overflow:"hidden",padding:n.spacing(.5),textTransform:"none",width:"100%","&:hover":{backgroundColor:t??n.custom.palette.interaction.hover}}));module.exports=({active:o,accent:u,avatar:h,avatarIcon:x,email:m,name:p,rounded:v,withMenu:f})=>{const j=r.useTheme(),w=t.useRef(null);return e.jsx(d,{active:o,accentColor:u?.color,accentSurface:u?.surface,rounded:v,children:e.jsxs(c,{ref:w,children:[e.jsx(a,{src:x?void 0:h,sizing:"sm",sx:u?{backgroundColor:u.color,borderColor:u.color}:void 0,children:x&&e.jsx(n.default,{name:x,size:16,color:j.custom.palette.icon.lockedWhite})}),e.jsx(r.Fade,{in:!0,children:e.jsxs(c,{children:[e.jsxs(i,{withMenu:f,children:[e.jsx(s.Text,{size:"sm",variant:"button",noWrap:!0,bold:!!u,sx:u?{color:u.color}:void 0,children:p}),e.jsx(s.Text,{size:"xs",variant:"button",noWrap:!0,sx:{color:u?u.color:j.custom.palette.text.secondary},children:m})]}),f&&e.jsx(l,{children:e.jsx(n.default,{name:"chevron-right",size:24,color:u?.color})})]})})]})})};

package/dist/theme/theme.hooks.d.ts

@@ -4,7 +4,7 @@ import { PaletteMode, Direction } from '@mui/material';
 import { ScreenSize, CustomTheme } from './types.js';
 
 declare const useThemeBuilder: (initialMode?: PaletteMode, initialScreenSize?: ScreenSize, initialDirection?: Direction) => {
-    breakpoint: "" | "sm" | "md" | "lg" | "xl";
+    breakpoint: "" | "sm" | "lg" | "md" | "xl";
     custom: CustomTheme;
     gridOverlayVisible: boolean;
     mode: PaletteMode;

package/dist/theme/theme.js

@@ -1 +1 @@
-"use strict";var t=require("@mui/material"),e=require("../systems/BrandCore/colorRamps.js"),a=require("../systems/BrandCore/primitiveColor.js"),n=require("../systems/BrandCore/primitiveVariables.js"),o=require("../systems/BrandCore/semanticColor.js"),r=require("../systems/BrandCore/typography.js"),i=require("../systems/WebCore/utils/typography.util.js");const s="https://static-pingu-production.useloops.com/fonts/",l=(t,e)=>Object.fromEntries(Object.entries(t).map(([t,a])=>[t,a*e+"px"]));exports.customTheme=(p,d,m)=>t.createTheme({direction:m,p:l(n.padding,n.base),m:l(n.margin,n.base),r:l(n.radius,n.base),custom:{palette:{black:"#000000",white:"#ffffff",neutral:e.neutralRamp[p],neutralAlpha:"light"===p?a.neutralAlpha:a.darkNeutralAlpha,purple:e.purpleRamp[p],red:e.redRamp[p],peach:e.peachRamp[p],yellow:e.yellowRamp[p],blue:e.blueRamp[p],green:e.greenRamp[p],icon:o.semantic[p].icon,interaction:o.semantic[p].interaction,stroke:o.semantic[p].stroke,surface:o.semantic[p].surface,text:o.semantic[p].text,input:o.semantic[p].input,skeleton:o.semantic[p].skeleton,data:o.semantic[p].data,body:o.semantic[p].surface.default},margin:n.margin,padding:n.padding,radius:n.radius,elevation:n.elevation,elevationFilter:n.elevationFilter,boxShadow:n.boxShadow,easing:n.easing,typography:i.typographyVariantMap[d]},palette:{mode:p,primary:{main:a.purple[500]}},spacing:n.base,shape:{borderRadius:n.base,hotspot:{default:12,active:24}},breakpoints:{values:n.breakpoints},typography:{fontFamily:`"${r.fonts.FoundersGrotesk.name}", "Helvetica", "sans-serif"`},components:{MuiTypography:{variants:i.typographyVariants(d),styleOverrides:{root:{color:o.semantic[p].text.primary,letterSpacing:0,lineHeight:"140%"}}},MuiCssBaseline:{styleOverrides:t=>`\n\t\t\t\t\tbody {\n\t\t\t\t\t\tbackground: ${t.custom.palette.body};\n\t\t\t\t\t\tmin-width: 320px;\n\t\t\t\t\t}\n\t\t\t\t\ta {\n\t\t\t\t\t\tcolor: inherit;\n\t\t\t\t\t\tdisplay: flex;\n\t\t\t\t\t\ttext-decoration: none;\n\t\t\t\t\t}\n\t\t\t\t\tb {\n\t\t\t\t\t\tfont-weight: 500;\n\t\t\t\t\t}\n                    @font-face {\n                        font-family: '${r.fonts.Domaine.name}';\n                        font-style: normal;\n                        font-display: swap;\n                        font-weight: ${r.fonts.Domaine.default.weight};\n                        src: url(${s}${r.fonts.Domaine.default.fileName}) format('woff2');\n                    }\n                    @font-face {\n                        font-family: '${r.fonts.Domaine.name}';\n                        font-style: normal;\n                        font-display: swap;\n                        font-weight: ${r.fonts.Domaine.bold.weight};\n                        src: url(${s}${r.fonts.Domaine.bold.fileName}) format('woff2');\n                    }\n                    @font-face {\n                        font-family: '${r.fonts.FoundersGrotesk.name}';\n                        font-style: normal;\n                        font-display: swap;\n                        font-weight: ${r.fonts.FoundersGrotesk.default.weight};\n                        src: url(${s}${r.fonts.FoundersGrotesk.default.fileName}) format('woff2');\n                    }\n                    @font-face {\n                        font-family: '${r.fonts.FoundersGrotesk.name}';\n                        font-style: normal;\n                        font-display: swap;\n                        font-weight: ${r.fonts.FoundersGrotesk.bold.weight};\n                        src: url(${s}${r.fonts.FoundersGrotesk.bold.fileName}) format('woff2');\n                    }\n                `},MuiContainer:{defaultProps:{maxWidth:"xl",disableGutters:!0},styleOverrides:{root:{paddingLeft:16,paddingRight:16,[`@media (min-width: ${n.breakpoints.md}px)`]:{paddingLeft:24,paddingRight:24},[`@media (min-width: ${n.breakpoints.lg}px)`]:{paddingLeft:48,paddingRight:48}}}},MuiButtonBase:{defaultProps:{disableTouchRipple:!0,disableRipple:!0}},MuiButton:{defaultProps:{disableTouchRipple:!0,disableRipple:!0}},MuiTooltip:{styleOverrides:{arrow:({theme:{custom:t}})=>({color:t.palette.surface.overlay}),tooltip:({theme:{custom:t}})=>({backgroundColor:t.palette.surface.overlay,borderRadius:t.radius.md*n.base+"px",color:t.palette.text.primary,backdropFilter:"blur(0)",filter:t.elevationFilter.overlay,fontFamily:r.fonts.FoundersGrotesk.name,fontSize:t.typography.body.sm,fontWeight:400,padding:`${t.padding.sm*n.base}px ${t.padding.md*n.base}px`})}},MuiAvatarGroup:{styleOverrides:{root:{flexDirection:"row"},avatar:({theme:{custom:t}})=>({border:`1px solid ${t.palette.stroke.default}`,marginLeft:0,marginRight:-8,":last-child":{marginLeft:"auto"}})}},MuiPaper:{styleOverrides:{root:({theme:{custom:t}})=>({backgroundColor:t.palette.surface.default})}}}});
+"use strict";var t=require("@mui/material"),e=require("../systems/BrandCore/colorRamps.js"),a=require("../systems/BrandCore/primitiveColor.js"),n=require("../systems/BrandCore/primitiveVariables.js"),o=require("../systems/BrandCore/semanticColor.js"),r=require("../systems/BrandCore/typography.js"),i=require("../systems/WebCore/utils/typography.util.js");const s=require("../utils/cdn.js").cdnAsset("fonts/"),l=(t,e)=>Object.fromEntries(Object.entries(t).map(([t,a])=>[t,a*e+"px"]));exports.customTheme=(d,p,m)=>t.createTheme({direction:m,p:l(n.padding,n.base),m:l(n.margin,n.base),r:l(n.radius,n.base),custom:{palette:{black:"#000000",white:"#ffffff",neutral:e.neutralRamp[d],neutralAlpha:"light"===d?a.neutralAlpha:a.darkNeutralAlpha,purple:e.purpleRamp[d],red:e.redRamp[d],peach:e.peachRamp[d],yellow:e.yellowRamp[d],blue:e.blueRamp[d],green:e.greenRamp[d],icon:o.semantic[d].icon,interaction:o.semantic[d].interaction,stroke:o.semantic[d].stroke,surface:o.semantic[d].surface,text:o.semantic[d].text,input:o.semantic[d].input,skeleton:o.semantic[d].skeleton,data:o.semantic[d].data,body:o.semantic[d].surface.default},margin:n.margin,padding:n.padding,radius:n.radius,elevation:n.elevation,elevationFilter:n.elevationFilter,boxShadow:n.boxShadow,easing:n.easing,typography:i.typographyVariantMap[p]},palette:{mode:d,primary:{main:a.purple[500]}},spacing:n.base,shape:{borderRadius:n.base,hotspot:{default:12,active:24}},breakpoints:{values:n.breakpoints},typography:{fontFamily:`"${r.fonts.FoundersGrotesk.name}", "Helvetica", "sans-serif"`},components:{MuiTypography:{variants:i.typographyVariants(p),styleOverrides:{root:{color:o.semantic[d].text.primary,letterSpacing:0,lineHeight:"140%"}}},MuiCssBaseline:{styleOverrides:t=>`\n\t\t\t\t\tbody {\n\t\t\t\t\t\tbackground: ${t.custom.palette.body};\n\t\t\t\t\t\tmin-width: 320px;\n\t\t\t\t\t}\n\t\t\t\t\ta {\n\t\t\t\t\t\tcolor: inherit;\n\t\t\t\t\t\tdisplay: flex;\n\t\t\t\t\t\ttext-decoration: none;\n\t\t\t\t\t}\n\t\t\t\t\tb {\n\t\t\t\t\t\tfont-weight: 500;\n\t\t\t\t\t}\n                    @font-face {\n                        font-family: '${r.fonts.Domaine.name}';\n                        font-style: normal;\n                        font-display: swap;\n                        font-weight: ${r.fonts.Domaine.default.weight};\n                        src: url(${s}${r.fonts.Domaine.default.fileName}) format('woff2');\n                    }\n                    @font-face {\n                        font-family: '${r.fonts.Domaine.name}';\n                        font-style: normal;\n                        font-display: swap;\n                        font-weight: ${r.fonts.Domaine.bold.weight};\n                        src: url(${s}${r.fonts.Domaine.bold.fileName}) format('woff2');\n                    }\n                    @font-face {\n                        font-family: '${r.fonts.FoundersGrotesk.name}';\n                        font-style: normal;\n                        font-display: swap;\n                        font-weight: ${r.fonts.FoundersGrotesk.default.weight};\n                        src: url(${s}${r.fonts.FoundersGrotesk.default.fileName}) format('woff2');\n                    }\n                    @font-face {\n                        font-family: '${r.fonts.FoundersGrotesk.name}';\n                        font-style: normal;\n                        font-display: swap;\n                        font-weight: ${r.fonts.FoundersGrotesk.bold.weight};\n                        src: url(${s}${r.fonts.FoundersGrotesk.bold.fileName}) format('woff2');\n                    }\n                `},MuiContainer:{defaultProps:{maxWidth:"xl",disableGutters:!0},styleOverrides:{root:{paddingLeft:16,paddingRight:16,[`@media (min-width: ${n.breakpoints.md}px)`]:{paddingLeft:24,paddingRight:24},[`@media (min-width: ${n.breakpoints.lg}px)`]:{paddingLeft:48,paddingRight:48}}}},MuiButtonBase:{defaultProps:{disableTouchRipple:!0,disableRipple:!0}},MuiButton:{defaultProps:{disableTouchRipple:!0,disableRipple:!0}},MuiTooltip:{styleOverrides:{arrow:({theme:{custom:t}})=>({color:t.palette.surface.overlay}),tooltip:({theme:{custom:t}})=>({backgroundColor:t.palette.surface.overlay,borderRadius:t.radius.md*n.base+"px",color:t.palette.text.primary,backdropFilter:"blur(0)",filter:t.elevationFilter.overlay,fontFamily:r.fonts.FoundersGrotesk.name,fontSize:t.typography.body.sm,fontWeight:400,padding:`${t.padding.sm*n.base}px ${t.padding.md*n.base}px`})}},MuiAvatarGroup:{styleOverrides:{root:{flexDirection:"row"},avatar:({theme:{custom:t}})=>({border:`1px solid ${t.palette.stroke.default}`,marginLeft:0,marginRight:-8,":last-child":{marginLeft:"auto"}})}},MuiPaper:{styleOverrides:{root:({theme:{custom:t}})=>({backgroundColor:t.palette.surface.default})}}}});

package/dist/utils/cdn.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Public asset CDN base. Assets live in the `useloops-public` GCS bucket,
+ * served via Cloud CDN. Objects are stored WITHOUT a `public/` prefix.
+ */
+declare const CDN_BASE = "https://static.cdn.useloops.com";
+/** Build a public CDN asset URL from a bucket key (leading slash optional). */
+declare const cdnAsset: (key: string) => string;
+
+export { CDN_BASE, cdnAsset };

package/dist/utils/cdn.js

@@ -0,0 +1 @@
+"use strict";const s="https://static.cdn.useloops.com";exports.CDN_BASE=s,exports.cdnAsset=t=>`${s}/${t.replace(/^\//,"")}`;

package/dist/utils.d.ts

@@ -1,4 +1,5 @@
 export { BreakpointOrNull, useBreakpoint } from './utils/breakpoint.hook.js';
+export { CDN_BASE, cdnAsset } from './utils/cdn.js';
 export { compareArrayMembers } from './utils/compareArrayMembers.js';
 export { isButton } from './utils/isButton.js';
 export { pluralise } from './utils/pluralise.js';

package/dist/utils.js

@@ -1 +1 @@
-"use strict";var e=require("./utils/breakpoint.hook.js"),r=require("./utils/compareArrayMembers.js"),s=require("./utils/isButton.js"),o=require("./utils/pluralise.js"),u=require("./utils/screen.hook.js"),i=require("./utils/useKeyCombo.js"),t=require("./utils/usePrevious.js"),p=require("./utils/shouldForwardProp.js");exports.useBreakpoint=e.useBreakpoint,exports.compareArrayMembers=r.compareArrayMembers,exports.isButton=s.isButton,exports.pluralise=o.pluralise,exports.useScreenSize=u.useScreenSize,exports.useKeyCombo=i.useKeyCombo,exports.usePrevious=t.usePrevious,exports.omitProps=p.omitProps;
+"use strict";var e=require("./utils/breakpoint.hook.js"),s=require("./utils/cdn.js"),r=require("./utils/compareArrayMembers.js"),o=require("./utils/isButton.js"),u=require("./utils/pluralise.js"),i=require("./utils/screen.hook.js"),t=require("./utils/useKeyCombo.js"),p=require("./utils/usePrevious.js"),l=require("./utils/shouldForwardProp.js");exports.useBreakpoint=e.useBreakpoint,exports.CDN_BASE=s.CDN_BASE,exports.cdnAsset=s.cdnAsset,exports.compareArrayMembers=r.compareArrayMembers,exports.isButton=o.isButton,exports.pluralise=u.pluralise,exports.useScreenSize=i.useScreenSize,exports.useKeyCombo=t.useKeyCombo,exports.usePrevious=p.usePrevious,exports.omitProps=l.omitProps;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@useloops/design-system",
-    "version": "1.4.680",
+    "version": "1.4.682",
     "description": "The official React based Loops design system",
     "main": "dist/index.js",
     "module": "dist/esm/index.js",