@useloops/design-system 1.4.708 → 1.4.710

package/dist/systems/Platform/VideoControls2/VideoControls2.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("../../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/SortableList/components/SortableItem/SortableItem.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/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"),require("../../WebCore/TintedSurface/TintedSurface.js");var n=require("./components/ActionButton/ActionButton.js"),l=require("./components/OverlayControl/OverlayControl.js"),s=require("./components/Timeline/Timeline.js");function u(e){return e&&e.__esModule?e:{default:e}}var d=u(i);const m=t.styled(o)(({theme:e})=>({display:"flex",flex:1,padding:"2px",gap:e.spacing(e.custom.padding.sm),flexDirection:"column",borderRadius:18})),c=t.styled(t.Stack)({alignItems:"center",justifyContent:"start",flexDirection:"row",flex:1}),b=r.forwardRef(({id:t,videoElement:i,initialEndTime:o=0,initialCurrentTime:u=0,initialMuted:b,initialVolume:C,markers:p,options:f,slots:q,events:{onEnd:j,onPlay:g,onSeekEnd:T,onSeeking:y,onSeekStart:W,onTimeUpdate:k,onPause:v,onVolumeChange:B,onVolumeMute:S,onRestart:h,onFirstPlay:F,onFirstEnded:E,onReset:I}={},videoSeekTime:x,slotProps:L},P)=>{const[A,w]=r.useState(!1),[M,R]=r.useState(!1),[G,V]=r.useState([]),_={rtl:!1,volumeControls:!0,normaliseTime:!1,markerIndicatorMode:"time",markerIndicator:!1,markerIndicatorSize:3,volumeControlsType:"mute",disableBufferingEvents:!1,fullscreenControls:!1,overlayControls:!0,hideStartTime:!1,hideEndTime:!1,...f},[{seeking:D,endTime:K,currentTime:N,playing:O,buffering:z,loaded:U,ended:H,volume:J,muted:Q,startTime:X,firstPlay:Y,firstEnded:Z},$]=r.useState({startTime:a.normaliseFloat(_.normaliseTime?u:0),endTime:a.normaliseFloat(_.normaliseTime?o:i.duration),currentTime:a.normaliseFloat(u??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=Q,i.volume=J,_.normaliseTime&&(void 0===o||void 0===u))throw new Error("Please supply an initial end time and initial currentTime for normalising time in VideoControls2.tsx");return()=>{ce()}},[]),r.useEffect(()=>{$(e=>({...e,startTime:a.normaliseFloat(_.normaliseTime?u:0),endTime:a.normaliseFloat(_.normaliseTime?o:i.duration),currentTime:a.normaliseFloat(u??0)})),i.currentTime=a.normaliseFloat(u??0)},[u,o]);const ee=r.useCallback(()=>{$(e=>({...e,playing:!1,ended:!0,...!Z&&{firstEnded:!0}})),j&&j(),!Z&&E&&E()},[Z]);r.useEffect(()=>{if(!i||null==x)return;(async()=>{const e=!i.paused,r=x===K;$(e=>({...e,playing:!1,currentTime:a.normaliseFloat(x)})),await new Promise(e=>{const r=()=>{i.removeEventListener("seeked",r),e()};i.addEventListener("seeked",r),setTimeout(e,500)}),$(e=>({...e,currentTime:a.normaliseFloat(x)})),await new Promise(e=>setTimeout(e,50)),$(t=>({...t,playing:e,currentTime:a.normaliseFloat(r?x-.001:x+.001)}))})().catch(e=>{console.error("Error seeking video:",e)})},[x,i]);const re=r.useCallback(e=>{$(r=>({...r,muted:e.target?.muted,volume:"number"==typeof e.target?.volume?e.target?.volume:1})),Q!==e.target?.muted&&S&&S(!Q),J!==e.target?.volume&&B&&B(J)},[Q,J]),te=r.useCallback(()=>{const e=a.normaliseFloat(i.currentTime)>=K&&K!==a.normaliseFloat(i.duration)&&!H,r=a.normaliseFloat(i.currentTime)>=K&&K===a.normaliseFloat(i.duration)&&!H&&!O;(e||r)&&(i.pause(),i.dispatchEvent(new Event("ended"))),$(e=>({...e,currentTime:a.normaliseFloat(i.currentTime)})),k&&k(a.normaliseFloat(i.currentTime))},[K,H,O]),ie=r.useCallback(()=>{$(e=>({...e,playing:!1})),v&&v()},[N]),ae=r.useCallback(()=>{$(e=>({...e,playing:!0,ended:!1,...!_?.disableBufferingEvents&&{buffering:!1},...!Y&&{firstPlay:!0}})),!Y&&F&&F(),g&&g()},[Y,_?.disableBufferingEvents]),oe=r.useCallback(()=>{_?.disableBufferingEvents||$(e=>({...e,buffering:!0}))},[_?.disableBufferingEvents]),ne=r.useCallback(()=>{_?.disableBufferingEvents||$(e=>({...e,buffering:!1}))},[z,_?.disableBufferingEvents]),le=r.useCallback(()=>{if(_?.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>=X&&t<=K){const r=Math.max(t,X),i=Math.min(a,K);e.push({start:r-X,end:i-X,startPercent:(r-X)/(K-X)*100,widthPercent:(i-r)/(K-X)*100})}}V(e)},[D,K,N,O,z,U,H,J,Q,X,G,_?.disableBufferingEvents]),se=r.useCallback(async e=>{O&&ce(),i.currentTime=X,e&&await me(),h&&h()},[O,N,X,K,H]),ue=r.useCallback(async()=>{O&&ce(),i.currentTime=X,$(e=>({...e,startTime:a.normaliseFloat(_.normaliseTime?u:0),endTime:a.normaliseFloat(_.normaliseTime?o:i.duration),currentTime:a.normaliseFloat(u??0),loaded:!0,ended:!1,firstPlay:!1,firstEnded:!1,seeking:!1,playing:!1})),I&&I()},[O,N,X,K,H,u,o]),de=async()=>{H?await se(!0):O?ce():await me()},me=async()=>{await i.play()},ce=()=>{i.pause()},be=r.useCallback(e=>{i.currentTime=a.normaliseFloat(e),$(r=>({...r,currentTime:a.normaliseFloat(e),ended:!1,seeking:!0,...!_?.disableBufferingEvents&&{buffering:!1},firstPlay:!Y||r.firstPlay,bufferProgress:e})),y&&y(e),!Y&&F&&F()},[z,Y,_?.disableBufferingEvents]),Ce=r.useCallback(async()=>{document.hidden?O&&!i.paused?(w(!0),ce()):w(!1):(A&&!O&&await me(),w(!1))},[O,A,ce,me,i]),pe=r.useCallback(e=>{e&&i.pause(),$(e=>({...e,seeking:!0})),W&&W()},[H]),fe=r.useCallback(async(e,r,t)=>{r&&(i.currentTime=r),e&&!H&&await i.play(),t&&O&&i.pause(),$(e=>({...e,...r?{currentTime:r}:{},ended:!t&&e.ended,seeking:!1})),T&&T(r)},[O,H,z,D]),qe=r.useCallback(()=>{document.fullscreenElement?document.exitFullscreen():i.requestFullscreen()},[i]);return d.default("fullscreenchange",()=>R(!!document.fullscreenElement),document),d.default("visibilitychange",Ce,document),d.default("pause",ie,i),d.default("playing",ae,i),d.default("timeupdate",te,i),d.default("ended",ee,i),d.default("volumechange",re,i),d.default("waiting",oe,i),d.default("canplay",ne,i),d.default("progress",le,i),r.useImperativeHandle(P,()=>({play:me,pause:ce,restart:se,reset:ue,seek:(e,r,t)=>fe(r,e,t),videoState:{seeking:D,endTime:K,currentTime:N,playing:O,buffering:z,loaded:U,ended:H,volume:J,firstPlay:Y,firstEnded:Z,muted:Q,startTime:X}})),e.jsxs(e.Fragment,{children:[_.overlayControls&&e.jsx(l,{videoElement:i,playing:O,firstPlay:Y,ended:H,handleAction:de}),e.jsxs(m,{variation:"raised",id:t,sx:L?.paperContainer?.sx,children:[e.jsxs(c,{..._?.rtl&&{dir:"rtl"},children:[e.jsx(n,{seeking:D,playing:O,ended:H,buffering:z,handleAction:de}),e.jsx(s,{handleSeeking:be,handleSeekEnd:fe,handleSeekStart:pe,ended:H,marker:q?.marker,markersContainerProps:L?.markersContainer,markers:p,markerIndicatorMode:_.markerIndicatorMode,markerIndicatorSize:_.markerIndicatorSize,markerIndicator:_.markerIndicator,startTime:_.normaliseTime?X:0,currentTime:N,endTime:K,playing:O,bufferRanges:G,buffering:z,volume:J,muted:Q,volumeControls:_.volumeControls,volumeControlsType:_.volumeControlsType,handleVolumeMute:()=>{i.muted=!Q},handleVolumeChange:e=>{i.volume=e,Q&&(i.muted=!1)},fullscreenControls:_.fullscreenControls,hideStartTime:_.hideStartTime,hideEndTime:_.hideEndTime,isFullScreen:M,handlefullscreenToggle:qe})]}),q?.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/SortableList/components/SortableItem/SortableItem.js"),require("../../WebCore/Select/StyledSelect.js"),require("../../WebCore/RankItem/_partials/RankItemContainer/RankItemContainer.js"),require("../../WebCore/RankItem/_partials/RankItemDragArea/RankItemDragArea.js"),require("../../WebCore/RankItem/_partials/RankItemLabel/RankItemLabel.js"),require("../../WebCore/SortableList/SortableList.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"),require("../../WebCore/TintedSurface/TintedSurface.js");var n=require("./components/ActionButton/ActionButton.js"),l=require("./components/OverlayControl/OverlayControl.js"),s=require("./components/Timeline/Timeline.js");function u(e){return e&&e.__esModule?e:{default:e}}var d=u(i);const m=t.styled(o)(({theme:e})=>({display:"flex",flex:1,padding:"2px",gap:e.spacing(e.custom.padding.sm),flexDirection:"column",borderRadius:18})),c=t.styled(t.Stack)({alignItems:"center",justifyContent:"start",flexDirection:"row",flex:1}),b=r.forwardRef(({id:t,videoElement:i,initialEndTime:o=0,initialCurrentTime:u=0,initialMuted:b,initialVolume:C,markers:p,options:f,slots:q,events:{onEnd:j,onPlay:g,onSeekEnd:T,onSeeking:y,onSeekStart:k,onTimeUpdate:W,onPause:v,onVolumeChange:B,onVolumeMute:S,onRestart:h,onFirstPlay:F,onFirstEnded:I,onReset:E}={},videoSeekTime:x,slotProps:L},P)=>{const[A,R]=r.useState(!1),[w,M]=r.useState(!1),[_,G]=r.useState([]),V={rtl:!1,volumeControls:!0,normaliseTime:!1,markerIndicatorMode:"time",markerIndicator:!1,markerIndicatorSize:3,volumeControlsType:"mute",disableBufferingEvents:!1,fullscreenControls:!1,overlayControls:!0,hideStartTime:!1,hideEndTime:!1,...f},[{seeking:D,endTime:K,currentTime:N,playing:O,buffering:z,loaded:U,ended:H,volume:J,muted:Q,startTime:X,firstPlay:Y,firstEnded:Z},$]=r.useState({startTime:a.normaliseFloat(V.normaliseTime?u:0),endTime:a.normaliseFloat(V.normaliseTime?o:i.duration),currentTime:a.normaliseFloat(u??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=Q,i.volume=J,V.normaliseTime&&(void 0===o||void 0===u))throw new Error("Please supply an initial end time and initial currentTime for normalising time in VideoControls2.tsx");return()=>{ce()}},[]),r.useEffect(()=>{$(e=>({...e,startTime:a.normaliseFloat(V.normaliseTime?u:0),endTime:a.normaliseFloat(V.normaliseTime?o:i.duration),currentTime:a.normaliseFloat(u??0)})),i.currentTime=a.normaliseFloat(u??0)},[u,o]);const ee=r.useCallback(()=>{$(e=>({...e,playing:!1,ended:!0,...!Z&&{firstEnded:!0}})),j&&j(),!Z&&I&&I()},[Z]);r.useEffect(()=>{if(!i||null==x)return;(async()=>{const e=!i.paused,r=x===K;$(e=>({...e,playing:!1,currentTime:a.normaliseFloat(x)})),await new Promise(e=>{const r=()=>{i.removeEventListener("seeked",r),e()};i.addEventListener("seeked",r),setTimeout(e,500)}),$(e=>({...e,currentTime:a.normaliseFloat(x)})),await new Promise(e=>setTimeout(e,50)),$(t=>({...t,playing:e,currentTime:a.normaliseFloat(r?x-.001:x+.001)}))})().catch(e=>{console.error("Error seeking video:",e)})},[x,i]);const re=r.useCallback(e=>{$(r=>({...r,muted:e.target?.muted,volume:"number"==typeof e.target?.volume?e.target?.volume:1})),Q!==e.target?.muted&&S&&S(!Q),J!==e.target?.volume&&B&&B(J)},[Q,J]),te=r.useCallback(()=>{const e=a.normaliseFloat(i.currentTime)>=K&&K!==a.normaliseFloat(i.duration)&&!H,r=a.normaliseFloat(i.currentTime)>=K&&K===a.normaliseFloat(i.duration)&&!H&&!O;(e||r)&&(i.pause(),i.dispatchEvent(new Event("ended"))),$(e=>({...e,currentTime:a.normaliseFloat(i.currentTime)})),W&&W(a.normaliseFloat(i.currentTime))},[K,H,O]),ie=r.useCallback(()=>{$(e=>({...e,playing:!1})),v&&v()},[N]),ae=r.useCallback(()=>{$(e=>({...e,playing:!0,ended:!1,...!V?.disableBufferingEvents&&{buffering:!1},...!Y&&{firstPlay:!0}})),!Y&&F&&F(),g&&g()},[Y,V?.disableBufferingEvents]),oe=r.useCallback(()=>{V?.disableBufferingEvents||$(e=>({...e,buffering:!0}))},[V?.disableBufferingEvents]),ne=r.useCallback(()=>{V?.disableBufferingEvents||$(e=>({...e,buffering:!1}))},[z,V?.disableBufferingEvents]),le=r.useCallback(()=>{if(V?.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>=X&&t<=K){const r=Math.max(t,X),i=Math.min(a,K);e.push({start:r-X,end:i-X,startPercent:(r-X)/(K-X)*100,widthPercent:(i-r)/(K-X)*100})}}G(e)},[D,K,N,O,z,U,H,J,Q,X,_,V?.disableBufferingEvents]),se=r.useCallback(async e=>{O&&ce(),i.currentTime=X,e&&await me(),h&&h()},[O,N,X,K,H]),ue=r.useCallback(async()=>{O&&ce(),i.currentTime=X,$(e=>({...e,startTime:a.normaliseFloat(V.normaliseTime?u:0),endTime:a.normaliseFloat(V.normaliseTime?o:i.duration),currentTime:a.normaliseFloat(u??0),loaded:!0,ended:!1,firstPlay:!1,firstEnded:!1,seeking:!1,playing:!1})),E&&E()},[O,N,X,K,H,u,o]),de=async()=>{H?await se(!0):O?ce():await me()},me=async()=>{await i.play()},ce=()=>{i.pause()},be=r.useCallback(e=>{i.currentTime=a.normaliseFloat(e),$(r=>({...r,currentTime:a.normaliseFloat(e),ended:!1,seeking:!0,...!V?.disableBufferingEvents&&{buffering:!1},firstPlay:!Y||r.firstPlay,bufferProgress:e})),y&&y(e),!Y&&F&&F()},[z,Y,V?.disableBufferingEvents]),Ce=r.useCallback(async()=>{document.hidden?O&&!i.paused?(R(!0),ce()):R(!1):(A&&!O&&await me(),R(!1))},[O,A,ce,me,i]),pe=r.useCallback(e=>{e&&i.pause(),$(e=>({...e,seeking:!0})),k&&k()},[H]),fe=r.useCallback(async(e,r,t)=>{r&&(i.currentTime=r),e&&!H&&await i.play(),t&&O&&i.pause(),$(e=>({...e,...r?{currentTime:r}:{},ended:!t&&e.ended,seeking:!1})),T&&T(r)},[O,H,z,D]),qe=r.useCallback(()=>{document.fullscreenElement?document.exitFullscreen():i.requestFullscreen()},[i]);return d.default("fullscreenchange",()=>M(!!document.fullscreenElement),document),d.default("visibilitychange",Ce,document),d.default("pause",ie,i),d.default("playing",ae,i),d.default("timeupdate",te,i),d.default("ended",ee,i),d.default("volumechange",re,i),d.default("waiting",oe,i),d.default("canplay",ne,i),d.default("progress",le,i),r.useImperativeHandle(P,()=>({play:me,pause:ce,restart:se,reset:ue,seek:(e,r,t)=>fe(r,e,t),videoState:{seeking:D,endTime:K,currentTime:N,playing:O,buffering:z,loaded:U,ended:H,volume:J,firstPlay:Y,firstEnded:Z,muted:Q,startTime:X}})),e.jsxs(e.Fragment,{children:[V.overlayControls&&e.jsx(l,{videoElement:i,playing:O,firstPlay:Y,ended:H,handleAction:de}),e.jsxs(m,{variation:"raised",id:t,sx:L?.paperContainer?.sx,children:[e.jsxs(c,{...V?.rtl&&{dir:"rtl"},children:[e.jsx(n,{seeking:D,playing:O,ended:H,buffering:z,handleAction:de}),e.jsx(s,{handleSeeking:be,handleSeekEnd:fe,handleSeekStart:pe,ended:H,marker:q?.marker,markersContainerProps:L?.markersContainer,markers:p,markerIndicatorMode:V.markerIndicatorMode,markerIndicatorSize:V.markerIndicatorSize,markerIndicator:V.markerIndicator,startTime:V.normaliseTime?X:0,currentTime:N,endTime:K,playing:O,bufferRanges:_,buffering:z,volume:J,muted:Q,volumeControls:V.volumeControls,volumeControlsType:V.volumeControlsType,handleVolumeMute:()=>{i.muted=!Q},handleVolumeChange:e=>{i.volume=e,Q&&(i.muted=!1)},fullscreenControls:V.fullscreenControls,hideStartTime:V.hideStartTime,hideEndTime:V.hideEndTime,isFullScreen:w,handlefullscreenToggle:qe})]}),q?.bottom]})]})});var C=r.memo(b);module.exports=C;

package/dist/systems/Platform/VideoControls2/components/Timeline/components/FullscreenControls/FullscreenControls.js

@@ -1 +1 @@
-"use strict";var e=require("react/jsx-runtime");require("@mui/material");var r=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"),require("../../../../../../WebCore/Text/Text.js"),require("@mui/icons-material"),require("react"),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");var o=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/SortableList/components/SortableItem/SortableItem.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/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"),require("../../../../../../WebCore/TintedSurface/TintedSurface.js");module.exports=({isFullScreen:i,handlefullscreenToggle:t})=>e.jsx(o,{icon:e.jsx(r.default,{name:i?"reduce-window":"expand-window"}),variation:"default",shape:"round",sizing:"xs",onClick:t});
+"use strict";var e=require("react/jsx-runtime");require("@mui/material");var r=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"),require("../../../../../../WebCore/Text/Text.js"),require("@mui/icons-material"),require("react"),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");var o=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/SortableList/components/SortableItem/SortableItem.js"),require("../../../../../../WebCore/Select/StyledSelect.js"),require("../../../../../../WebCore/RankItem/_partials/RankItemContainer/RankItemContainer.js"),require("../../../../../../WebCore/RankItem/_partials/RankItemDragArea/RankItemDragArea.js"),require("../../../../../../WebCore/RankItem/_partials/RankItemLabel/RankItemLabel.js"),require("../../../../../../WebCore/SortableList/SortableList.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"),require("../../../../../../WebCore/TintedSurface/TintedSurface.js");module.exports=({isFullScreen:t,handlefullscreenToggle:i})=>e.jsx(o,{icon:e.jsx(r.default,{name:t?"reduce-window":"expand-window"}),variation:"default",shape:"round",sizing:"xs",onClick:i});

package/dist/systems/WebCore/FormGenerator/types.d.ts

@@ -15,7 +15,7 @@ import { InputLabelHelpProps } from '../InputLabelHelp/InputLabelHelp.js';
 import { LikertProps } from '../Likert/Likert.js';
 import { NumberFieldProps } from '../NumberField/types.js';
 import { RadioGroupProps } from '../RadioGroup/RadioGroup.js';
-import { RankProps } from '../Rank/Rank.js';
+import { RankProps } from '../Rank/types.js';
 import { RichTextFieldProps } from '../RichTextField/RichTextField.js';
 import { SliderProps } from '../Slider/Slider.js';
 import { StarRatingProps } from '../StarRating/StarRating.js';

package/dist/systems/WebCore/Pill/Pill.js

@@ -1 +1 @@
-"use strict";var e=require("react/jsx-runtime"),s=require("@mui/material");require("../../BrandCore/colorRamps.js"),require("../../BrandCore/primitiveVariables.js"),require("../../BrandCore/semanticColor.js"),require("../../BrandCore/types.js"),require("../../BrandCore/typography.js");var r=require("../../BrandCore/Icon/Icon.js"),i=require("../IconButton/IconButton.js"),o=require("../Progress/Progress.js"),a=require("../Text/Text.js"),t=require("../Tooltip/Tooltip.js"),n=require("./StyledPill.js"),d=require("./useTextTruncation.js");module.exports=l=>{const c=s.useTheme(),{label:u,secondaryLabel:x,iconLeft:p,iconRight:j,onDelete:m,active:g,slots:b,loading:q,sizing:f,disabled:T,slotProps:h}=l,{textRef:y,isTruncated:B}=d([u]),C=e.jsxs(n,{className:"loops-pill",tabIndex:0,...l,sx:{...h?.root?.sx},children:[q&&e.jsx(o,{sizing:f||"xl",sx:{color:c.custom.palette.icon.disabled}}),!q&&e.jsxs(e.Fragment,{children:[p&&e.jsx(r.default,{disabled:T,size:16,name:p}),"string"==typeof u?e.jsx(a.Text,{size:"sm",noWrap:!0,ref:y,disabled:T,sx:{padding:`0 ${c.spacing(c.custom.padding.xs)}`},children:u}):u,"string"==typeof x?e.jsx(a.Text,{secondary:!0,size:"sm",monospaced:!0,noWrap:!0,ref:y,disabled:T,sx:{padding:`0 ${c.spacing(c.custom.padding.xs)}`},children:x}):x,j&&e.jsx(r.default,{disabled:T,size:16,name:j}),m&&e.jsx(i,{sizing:"xs",onClick:m,shape:"round",disabled:T,variation:"default",sx:{"&.MuiIconButton-root.Mui-disabled":{"&:before":{backgroundColor:"transparent"}}},icon:e.jsx(r.default,{name:"cancel",sx:{color:g?c.custom.palette.blue[1e3]:c.custom.palette.icon.secondary}})})]})]});return B?e.jsx(t,{message:u,...b?.tooltip,children:C}):C};
+"use strict";var e=require("react/jsx-runtime"),r=require("@mui/material"),s=require("merge-sx");require("../../BrandCore/colorRamps.js"),require("../../BrandCore/primitiveVariables.js"),require("../../BrandCore/semanticColor.js"),require("../../BrandCore/types.js"),require("../../BrandCore/typography.js");var i=require("../../BrandCore/Icon/Icon.js"),o=require("../IconButton/IconButton.js"),a=require("../Progress/Progress.js"),t=require("../Text/Text.js"),n=require("../Tooltip/Tooltip.js"),l=require("./StyledPill.js"),d=require("./pill.helpers.js"),c=require("./useTextTruncation.js");module.exports=u=>{const x=r.useTheme(),{label:p,secondaryLabel:j,iconLeft:m,iconRight:g,onDelete:q,active:b,slots:f,loading:h,sizing:C,disabled:T,variation:v,sx:y,slotProps:B}=u,{textRef:z,isTruncated:I}=c([p]),P=!T&&v?d.pillVariationIconColor(x,v):void 0,{sx:R,...k}=B?.root??{},L=e.jsxs(l,{className:"loops-pill",tabIndex:0,...u,...k,sx:s.mergeSx(y,R),children:[h&&e.jsx(a,{sizing:C||"xl",sx:{color:x.custom.palette.icon.disabled}}),!h&&e.jsxs(e.Fragment,{children:[m&&e.jsx(i.default,{disabled:T,size:16,name:m,sx:P?{color:P}:void 0}),p&&"string"==typeof p?e.jsx(t.Text,{size:"sm",noWrap:!0,ref:z,disabled:T,sx:{padding:`0 ${x.spacing(x.custom.padding.xs)}`},children:p}):p,"string"==typeof j?e.jsx(t.Text,{secondary:!0,size:"sm",monospaced:!0,noWrap:!0,ref:z,disabled:T,sx:{padding:`0 ${x.spacing(x.custom.padding.xs)}`},children:j}):j,g&&e.jsx(i.default,{disabled:T,size:16,name:g,sx:P?{color:P}:void 0}),q&&e.jsx(o,{sizing:"xs",onClick:q,shape:"round",disabled:T,variation:"default",sx:{"&.MuiIconButton-root.Mui-disabled":{"&:before":{backgroundColor:"transparent"}}},icon:e.jsx(i.default,{name:"cancel",sx:{color:b?x.custom.palette.blue[1e3]:x.custom.palette.icon.secondary}})})]})]});return I?e.jsx(n,{message:p,...f?.tooltip,children:L}):L};

package/dist/systems/WebCore/Pill/StyledPill.js

@@ -1 +1 @@
-"use strict";var e=require("@mui/material");require("react");var t=require("../../../utils/shouldForwardProp.js"),i=require("../ButtonBase/Button.variant-helpers.js"),a=require("../styleblocks/focusedStyle.js"),l=require("../styleblocks/selectedStyle.js"),s=require("./pill.helpers.js");const r=e.styled(e.Box,{shouldForwardProp:t.omitProps("active","disabled","sizing","onDelete","iconRight","iconLeft","freezeInteractions","loading","secondaryLabel","slots","slotProps")})(({theme:e,active:t,disabled:r,sizing:o,onDelete:d,freezeInteractions:n,loading:c})=>({display:"flex",justifyContent:"center",alignItems:"center",maxWidth:"fill-available",height:i.buttonHeightMap[o||"md"],paddingLeft:e.spacing(e.custom.padding.sm),paddingRight:d?e.spacing(e.custom.padding.xs):e.spacing(e.custom.padding.sm),borderRadius:e.spacing(e.custom.radius.md),transition:"all 180ms ease",cursor:n?"auto":"pointer",...s.pillDefaultState(e),...t&&l.selectedState(e),...(r||c)&&s.pillDisabledState(e),"&:hover":{...s.pillDefaultStateHover(e),...(r||c)&&s.pillDisabledState(e),...t&&l.selectedStateHover(e),...n&&s.pillDefaultState(e),...n&&t&&l.selectedState(e)},"&:active":{...s.pillDefaultStateActive(e),...(r||c)&&s.pillDisabledState(e),...t&&l.selectedStateActive(e),...n&&s.pillDefaultState(e),...n&&t&&l.selectedState(e)},"&:focus-visible":{...a.focusedInputState(e)}}));module.exports=r;
+"use strict";var e=require("@mui/material");require("react");var t=require("../../../utils/shouldForwardProp.js"),a=require("../ButtonBase/Button.variant-helpers.js"),i=require("../styleblocks/focusedStyle.js"),l=require("../styleblocks/selectedStyle.js"),s=require("./pill.helpers.js");const o=e.styled(e.Box,{shouldForwardProp:t.omitProps("active","disabled","sizing","onDelete","iconRight","iconLeft","freezeInteractions","loading","label","secondaryLabel","variation","slots","slotProps")})(({theme:e,active:t,disabled:o,sizing:r,onDelete:d,freezeInteractions:n,loading:c,variation:u,label:p,secondaryLabel:f,iconLeft:S,iconRight:g})=>{const v=!p&&!f&&!d&&Boolean(S||g),m=a.buttonHeightMap[r||"md"];return{display:"flex",justifyContent:"center",alignItems:"center",maxWidth:"fill-available",height:m,width:v?m:void 0,paddingLeft:v?0:e.spacing(e.custom.padding.sm),paddingRight:v?0:d?e.spacing(e.custom.padding.xs):e.spacing(e.custom.padding.sm),borderRadius:e.spacing(e.custom.radius.md),transition:"all 180ms ease",cursor:n?"auto":"pointer",...s.pillDefaultState(e),...u&&"default"!==u&&s.pillVariationState(e,u),...t&&l.selectedState(e),...(o||c)&&s.pillDisabledState(e),"&:hover":{...s.pillDefaultStateHover(e),...u&&"default"!==u&&s.pillVariationStateHover(e,u),...(o||c)&&s.pillDisabledState(e),...t&&l.selectedStateHover(e),...n&&s.pillDefaultState(e),...n&&u&&"default"!==u&&s.pillVariationState(e,u),...n&&t&&l.selectedState(e)},"&:active":{...s.pillDefaultStateActive(e),...u&&"default"!==u&&s.pillVariationStateActive(e,u),...(o||c)&&s.pillDisabledState(e),...t&&l.selectedStateActive(e),...n&&s.pillDefaultState(e),...n&&u&&"default"!==u&&s.pillVariationState(e,u),...n&&t&&l.selectedState(e)},"&:focus-visible":{...i.focusedInputState(e)}}});module.exports=o;

package/dist/systems/WebCore/Pill/pill.helpers.js

@@ -1 +1 @@
-"use strict";var t=require("../styleblocks/interactionStates.js");exports.pillDefaultState=t=>({backgroundColor:t.custom.palette.neutral[0],border:`1px solid ${t.custom.palette.stroke.default}`}),exports.pillDefaultStateActive=e=>({backgroundColor:t.getInteractionStateStyles(e,"active",e.custom.palette.neutral[0]),border:`1px solid ${e.custom.palette.stroke.default}`}),exports.pillDefaultStateHover=e=>({backgroundColor:t.getInteractionStateStyles(e,"hover",e.custom.palette.neutral[0]),border:`1px solid ${e.custom.palette.stroke.default}`}),exports.pillDisabledState=t=>({backgroundColor:t.custom.palette.interaction.disabled,borderColor:t.custom.palette.stroke.disabled,pointerEvents:"none"});
+"use strict";var t=require("../styleblocks/interactionStates.js");const e=(t,e)=>{switch(e){case"info":return t.custom.palette.blue;case"success":return t.custom.palette.green;case"warning":return t.custom.palette.yellow;case"danger":return t.custom.palette.red;default:return null}};exports.pillDefaultState=t=>({backgroundColor:t.custom.palette.neutral[0],border:`1px solid ${t.custom.palette.stroke.default}`}),exports.pillDefaultStateActive=e=>({backgroundColor:t.getInteractionStateStyles(e,"active",e.custom.palette.neutral[0]),border:`1px solid ${e.custom.palette.stroke.default}`}),exports.pillDefaultStateHover=e=>({backgroundColor:t.getInteractionStateStyles(e,"hover",e.custom.palette.neutral[0]),border:`1px solid ${e.custom.palette.stroke.default}`}),exports.pillDisabledState=t=>({backgroundColor:t.custom.palette.interaction.disabled,borderColor:t.custom.palette.stroke.disabled,pointerEvents:"none"}),exports.pillVariationIconColor=(t,o)=>e(t,o)?.[500],exports.pillVariationState=(t,o)=>{const r=e(t,o);return r?{backgroundColor:r[0],border:`1px solid ${r[500]}`}:{}},exports.pillVariationStateActive=(o,r)=>{const a=e(o,r);return a?{backgroundColor:t.getInteractionStateStyles(o,"active",a[0]),border:`1px solid ${a[500]}`}:{}},exports.pillVariationStateHover=(o,r)=>{const a=e(o,r);return a?{backgroundColor:t.getInteractionStateStyles(o,"hover",a[0]),border:`1px solid ${a[500]}`}:{}};

package/dist/systems/WebCore/Pill/types.d.ts

@@ -3,13 +3,15 @@ import { SxProps, Theme } from '@mui/material/styles';
 import { IconName } from '../../../BrandCore/Icon.js';
 import { TooltipProps } from '../Tooltip/Tooltip.js';
 
+type PillVariation = 'default' | 'info' | 'success' | 'warning' | 'danger';
 interface PillProps {
     id?: string;
-    label: string;
+    label?: string;
     secondaryLabel?: string;
     iconLeft?: IconName;
     freezeInteractions?: boolean;
     iconRight?: IconName;
+    variation?: PillVariation;
     sizing?: 'md' | 'sm' | 'xs';
     onDelete?: ((event: any) => void) | undefined;
     active?: boolean;
@@ -24,4 +26,4 @@ interface PillProps {
     };
 }
 
-export type { PillProps };
+export type { PillProps, PillVariation };

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

@@ -1,21 +1,6 @@
 import { FunctionComponent } from 'react';
-import { Option } from '../RankItem/RankItem.js';
-import { SortableListProps } from '../SortableList/SortableList.js';
+import { RankProps } from './types.js';
 
-interface RankProps extends Omit<SortableListProps<any>, 'renderItem' | 'items'> {
-    labelTop: string;
-    labelBottom: string;
-    fullWidth?: boolean;
-    options: (Option & {
-        id: string;
-    })[];
-    internalChange?: () => void;
-    value?: (Option & {
-        id: string;
-    })[];
-    sizing?: 'sm' | 'lg';
-}
 declare const Rank: FunctionComponent<RankProps>;
 
 export { Rank as default };
-export type { RankProps };

package/dist/systems/WebCore/Rank/types.d.ts

@@ -0,0 +1,21 @@
+import { SortableListProps } from '../SortableList/SortableList.js';
+
+interface RankOption {
+    label: string;
+    value: string;
+}
+interface RankProps extends Omit<SortableListProps<any>, 'renderItem' | 'items'> {
+    labelTop: string;
+    labelBottom: string;
+    fullWidth?: boolean;
+    options: (RankOption & {
+        id: string;
+    })[];
+    internalChange?: () => void;
+    value?: (RankOption & {
+        id: string;
+    })[];
+    sizing?: 'sm' | 'lg';
+}
+
+export type { RankOption, RankProps };

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

@@ -1,20 +1,6 @@
 import { FunctionComponent } from 'react';
-import { SelectProps } from '../Select/types.js';
+import { RankItemProps } from './types.js';
 
-interface Option {
-    label: string;
-    value: string;
-}
-interface RankItemProps {
-    label: string;
-    onChange: (options: Option[]) => void;
-    selections: SelectProps['selections'];
-    disabled?: boolean;
-    fullWidth?: boolean;
-    options: Option[];
-    sizing?: 'sm' | 'lg';
-}
 declare const RankItem: FunctionComponent<RankItemProps>;
 
 export { RankItem as default };
-export type { Option, RankItemProps };

package/dist/systems/WebCore/RankItem/RankItem.js

@@ -1 +1 @@
-"use strict";var e=require("react/jsx-runtime"),i=require("@mui/icons-material"),r=require("@mui/material"),t=require("../SortableList/components/SortableItem/SortableItem.js"),s=require("../../../utils/breakpoint.hook.js");require("react");var l=require("../../BrandCore/Icon/Icon.js"),a=require("../../BrandCore/primitiveVariables.js");require("../SelectItem/SelectItem.js");var n=require("../Select/Select.js"),o=require("./RankItemContainer.js"),c=require("./RankItemLabel.js");module.exports=({label:u="Placeholder",disabled:d,onChange:m,options:x,fullWidth:g,sizing:h="lg"})=>{const p=r.useTheme(),b=x.map(e=>e.label).indexOf(u),j=s.useBreakpoint(),{touchListeners:f,ref:v}=t.useSortableItemContext();return e.jsx(o,{disabled:d,fullWidth:g,sizing:h,children:e.jsxs(r.Stack,{sx:{display:"flex",justifyContent:"space-between",flexDirection:"row",alignItems:"center",position:"relative",zIndex:1},children:[e.jsxs(r.Box,{sx:{display:"flex",alignItems:"center","& svg":{fill:p.custom.palette.icon.secondary}},children:[e.jsx(r.Box,{ref:v,...f,sx:{display:"flex",alignItems:"center",cursor:"grab",touchAction:"none"},children:e.jsx(i.DragHandle,{"aria-label":"drag-handle",sx:{width:l.iconSizeMap.lg,height:l.iconSizeMap.lg,mr:p.custom.padding.sm}})}),e.jsx(c,{align:"left",disabled:d,children:u})]}),"lg"===h?e.jsx(n,{name:"rank",sizing:"sm"===j?"md":"xs",selections:x.map((e,i)=>({label:`${i+1}`,value:`${i}`})),disabled:d,value:`${b}`,onChange:function(e){const i=b,r=Number(e.target.value),t=x;let s=1;const l=t.splice(i,s)[0];s=0,t.splice(r,s,l),m(t)},MenuProps:{anchorOrigin:{vertical:a.space[400],horizontal:"center"}},sx:{[`&.${r.selectClasses.root}`]:{width:6*a.base,textAlign:"center"},[`& .${r.typographyClasses.root}`]:{width:"fit-content",overflow:"visible"}}}):void 0]})})};
+"use strict";var e=require("react/jsx-runtime"),r=require("@mui/icons-material"),i=require("@mui/material"),t=require("../SortableList/components/SortableItem/SortableItem.js"),a=require("../../../utils/breakpoint.hook.js");require("react");var s=require("../../BrandCore/Icon/Icon.js"),l=require("../../BrandCore/primitiveVariables.js");require("../SelectItem/SelectItem.js");var n=require("../Select/Select.js"),o=require("./_partials/RankItemContainer/RankItemContainer.js"),c=require("./_partials/RankItemDragArea/RankItemDragArea.js"),d=require("./_partials/RankItemLabel/RankItemLabel.js");module.exports=({label:m="Placeholder",disabled:u,onChange:p,options:x,fullWidth:g,sizing:h="lg"})=>{const b=i.useTheme(),j=x.map(e=>e.label).indexOf(m),I=a.useBreakpoint(),{touchListeners:f,ref:q}=t.useSortableItemContext();return e.jsx(o,{disabled:u,fullWidth:g,sizing:h,children:e.jsxs(i.Stack,{sx:{display:"flex",justifyContent:"space-between",flexDirection:"row",alignItems:"center",position:"relative",zIndex:1},children:[e.jsxs(i.Box,{sx:{display:"flex",alignItems:"center","& svg":{fill:b.custom.palette.icon.secondary}},children:[e.jsx(c,{size:h,ref:q,...f,children:e.jsx(r.DragHandle,{"aria-label":"drag-handle",sx:{width:s.iconSizeMap.lg,height:s.iconSizeMap.lg,mr:b.custom.padding.sm}})}),e.jsx(d,{sizing:h,align:"left",disabled:u,children:m})]}),"lg"===h?e.jsx(i.Box,{sx:{mr:b.m.md},children:e.jsx(n,{name:"rank",sizing:"sm"===I?"md":"xs",selections:x.map((e,r)=>({label:`${r+1}`,value:`${r}`})),disabled:u,value:`${j}`,onChange:function(e){const r=j,i=Number(e.target.value),t=x;let a=1;const s=t.splice(r,a)[0];a=0,t.splice(i,a,s),p(t)},MenuProps:{anchorOrigin:{vertical:l.space[400],horizontal:"center"}},sx:{[`&.${i.selectClasses.root}`]:{width:6*l.base,textAlign:"center"},[`& .${i.typographyClasses.root}`]:{width:"fit-content",overflow:"visible"}}})}):void 0]})})};

package/dist/systems/WebCore/RankItem/_partials/RankItemContainer/RankItemContainer.js

@@ -0,0 +1 @@
+"use strict";var t=require("@mui/material");require("react");var o=require("../../../../../utils/shouldForwardProp.js");const e=t.styled(t.Box,{shouldForwardProp:o.omitProps(["fullWidth","sizing"])})(({theme:t,disabled:o,fullWidth:e,sizing:r})=>({width:e?"100%":"auto",minWidth:240,backgroundColor:o?t.custom.palette.input.disabled:t.custom.palette.surface.raised,border:`1px solid ${o?t.custom.palette.stroke.disabled:t.custom.palette.stroke.default}`,borderRadius:t.spacing(t.custom.radius.lg),overflow:"hidden",position:"relative",zIndex:0,"&:after":{content:'""',backgroundColor:t.custom.palette.interaction.none,borderRadius:t.spacing(t.custom.radius.lg),position:"absolute",inset:0},"&:hover":{"&:after":{backgroundColor:t.custom.palette.interaction.hover}},"&:active":{"&:after":{backgroundColor:t.custom.palette.interaction.press}},"& svg":{fill:t.custom.palette.icon.primary},...o&&{background:t.custom.palette.input.disabled,borderColor:t.custom.palette.stroke.disabled,"&:after":{backgroundColor:t.custom.palette.interaction.none},"& .MuiBox-root > .MuiSvgIcon-root":{fill:"none"}}}));module.exports=e;

package/dist/systems/WebCore/RankItem/_partials/RankItemDragArea/RankItemDragArea.js

@@ -0,0 +1 @@
+"use strict";var t=require("@mui/material");const i=t.styled(t.Box)(({theme:t,size:i})=>({paddingLeft:"sm"===i?t.spacing(t.custom.padding.sm):t.spacing(t.custom.padding.md),alignSelf:"stretch",display:"flex",alignItems:"center",cursor:"grab",touchAction:"none",marginRight:0,[t.breakpoints.down("md")]:{borderRight:`1px solid ${t.custom.palette.stroke.light}`,marginRight:t.spacing(t.custom.padding.sm)}}));module.exports=i;

package/dist/systems/WebCore/RankItem/_partials/RankItemLabel/RankItemLabel.js

@@ -0,0 +1 @@
+"use strict";var t=require("@mui/material"),e=require("../../../InputLabel/InputLabel.js"),i=require("../../../utils/typography.util.js");const p=t.styled(e)(({theme:t,sizing:e})=>({fontSize:i.typographyVariantMap.button.md,color:t.custom.palette.text.primary,lineHeight:"120%",letterSpacing:"0.16px",padding:"sm"===e?`${t.p.sm} ${t.p.xs}`:`${t.p.md} ${t.p.xs}`}));module.exports=p;

package/dist/systems/WebCore/RankItem/types.d.ts

@@ -0,0 +1,14 @@
+import { RankOption } from '../Rank/types.js';
+import { SelectProps } from '../Select/types.js';
+
+interface RankItemProps {
+    label: string;
+    onChange: (options: RankOption[]) => void;
+    selections: SelectProps['selections'];
+    disabled?: boolean;
+    fullWidth?: boolean;
+    options: RankOption[];
+    sizing?: 'sm' | 'lg';
+}
+
+export type { RankItemProps };

package/package.json

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

package/dist/esm/systems/WebCore/RankItem/RankItemContainer.js

@@ -1 +0,0 @@
-import{styled as t,Box as o}from"@mui/material";import"react";import{omitProps as e}from"../../../utils/shouldForwardProp.js";const r=t(o,{shouldForwardProp:e(["fullWidth","sizing"])})(({theme:t,disabled:o,fullWidth:e,sizing:r})=>({width:e?"100%":"auto",minWidth:240,backgroundColor:o?t.custom.palette.input.disabled:t.custom.palette.surface.raised,border:`1px solid ${o?t.custom.palette.stroke.disabled:t.custom.palette.stroke.default}`,borderRadius:t.spacing(t.custom.radius.lg),padding:t.spacing(t.custom.padding.md),..."sm"===r&&{padding:`${t.p.sm} ${t.p.md}`},position:"relative",zIndex:0,"&:after":{content:'""',backgroundColor:t.custom.palette.interaction.none,borderRadius:t.spacing(t.custom.radius.lg),position:"absolute",inset:0},"&:hover":{"&:after":{backgroundColor:t.custom.palette.interaction.hover}},"&:active":{"&:after":{backgroundColor:t.custom.palette.interaction.press}},"& svg":{fill:t.custom.palette.icon.primary},...o&&{background:t.custom.palette.input.disabled,borderColor:t.custom.palette.stroke.disabled,"&:after":{backgroundColor:t.custom.palette.interaction.none},"& .MuiBox-root > .MuiSvgIcon-root":{fill:"none"}}}));export{r as default};

package/dist/esm/systems/WebCore/RankItem/RankItemLabel.js

@@ -1 +0,0 @@
-import{styled as t}from"@mui/material";import e from"../InputLabel/InputLabel.js";import{typographyVariantMap as o}from"../utils/typography.util.js";const p=t(e)(({theme:t})=>({fontSize:o.button.md,color:t.custom.palette.text.primary,lineHeight:"120%",letterSpacing:"0.16px",padding:`0 ${t.p.xs}`}));export{p as default};

package/dist/systems/WebCore/RankItem/RankItemContainer.js

@@ -1 +0,0 @@
-"use strict";var t=require("@mui/material");require("react");var o=require("../../../utils/shouldForwardProp.js");const e=t.styled(t.Box,{shouldForwardProp:o.omitProps(["fullWidth","sizing"])})(({theme:t,disabled:o,fullWidth:e,sizing:r})=>({width:e?"100%":"auto",minWidth:240,backgroundColor:o?t.custom.palette.input.disabled:t.custom.palette.surface.raised,border:`1px solid ${o?t.custom.palette.stroke.disabled:t.custom.palette.stroke.default}`,borderRadius:t.spacing(t.custom.radius.lg),padding:t.spacing(t.custom.padding.md),..."sm"===r&&{padding:`${t.p.sm} ${t.p.md}`},position:"relative",zIndex:0,"&:after":{content:'""',backgroundColor:t.custom.palette.interaction.none,borderRadius:t.spacing(t.custom.radius.lg),position:"absolute",inset:0},"&:hover":{"&:after":{backgroundColor:t.custom.palette.interaction.hover}},"&:active":{"&:after":{backgroundColor:t.custom.palette.interaction.press}},"& svg":{fill:t.custom.palette.icon.primary},...o&&{background:t.custom.palette.input.disabled,borderColor:t.custom.palette.stroke.disabled,"&:after":{backgroundColor:t.custom.palette.interaction.none},"& .MuiBox-root > .MuiSvgIcon-root":{fill:"none"}}}));module.exports=e;

package/dist/systems/WebCore/RankItem/RankItemLabel.js

@@ -1 +0,0 @@
-"use strict";var t=require("@mui/material"),e=require("../InputLabel/InputLabel.js"),r=require("../utils/typography.util.js");const i=t.styled(e)(({theme:t})=>({fontSize:r.typographyVariantMap.button.md,color:t.custom.palette.text.primary,lineHeight:"120%",letterSpacing:"0.16px",padding:`0 ${t.p.xs}`}));module.exports=i;