@useloops/design-system
Version:
The official React based Loops design system
2 lines (1 loc) • 6.47 kB
JavaScript
"use strict";var e=require("react/jsx-runtime"),r=require("@mui/material"),t=require("merge-sx"),i=require("react");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/Accordion/Accordion.js");var o=require("../../../../WebCore/Typography/Typography.js");require("../../../../WebCore/Badge/Badge.js"),require("../../../../WebCore/Breadcrumb/Breadcrumb.js"),require("../../../../WebCore/Button/Button.js"),require("../../../../WebCore/ButtonBase/ButtonBase.js");var a=require("../../../../WebCore/Checkbox/Checkbox.js");require("../../../../WebCore/Checkbox/StyledCheckbox.js"),require("../../../../WebCore/InputFieldBase/InputFieldBase.js"),require("../../../../WebCore/CreatableAutocomplete/CreatableAutocomplete.js"),require("@mui/icons-material"),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/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");var s=require("../../../../WebCore/Tooltip/Tooltip.js");require("../../../../WebCore/Pill/StyledPill.js"),require("../../../../WebCore/ProgressBar/ProgressBar.js"),require("../../../../WebCore/Radio/StyledRadio.js"),require("../../../../WebCore/utils/autocomplete.styles.js"),require("../../../../WebCore/Select/AutocompleteListbox.js"),require("../../../../WebCore/Select/StyledAutocomplete.js"),require("../../../../WebCore/Select/SelectItem.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 l=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 u=require("../../utils/heightBasedOnPercentage.js"),n=require("../StyledComponents.js");module.exports=({percentage:b,label:d,checked:c,toolTipContent:C,hideValue:p,hideLabel:j,hideCheckbox:q,disableTooltip:h,animateBar:m,slotProps:W,tickInterval:x,onChange:B,maxDataValue:g,disabled:S,loading:y,value:k,id:v,className:L,graphMaxHeight:f,responsive:I})=>{r.useTheme();const[w,T]=i.useState(0),A=i.useRef(null);i.useEffect(()=>{const e=u.heightBasedOnPercentage(b,x,g,f,{hideLabel:j,hideCheckbox:q,hideValue:p}),r=m?w:e,t=performance.now(),i=o=>{const a=o-t,s=Math.min(a/250,1);T(r+(e-r)*(s*(2-s))),s<1&&requestAnimationFrame(i)},o=requestAnimationFrame(i);return()=>cancelAnimationFrame(o)},[k]);const R=i.useCallback(()=>{!S&&B&&B(v,!c)},[S,B,c]);return e.jsx(s,{message:C||null,disableHoverListener:h||!C,followCursor:!0,placement:"bottom-start",slotProps:{wrapper:{sx:{height:"fill-available",width:1,minWidth:0,...W?.tooltip?.slotProps?.wrapper?.sx}}},children:e.jsxs(n.VeticalBarWrapper,{maxHeight:f,disabled:S,...W?.barWrapper,id:v,className:L,onClick:R,responsive:I,children:[!p&&e.jsx(n.VerticalBarValue,{...W?.value,children:y?e.jsx(l,{width:20,height:18}):e.jsx(o,{variation:"xxs",component:"p",monospaced:!0,sx:{fontSize:"10px",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",width:"100%",textAlign:"center",minWidth:0,color:e=>S||!c?e.custom.palette.text.disabled:e.custom.palette.text.secondary},children:`${Math.round(b)}%`})}),y?e.jsx(l,{width:"fill-available",height:w}):e.jsx(n.VerticalBar,{checked:c,value:w,maxHeight:f,disabled:S,...W?.bar}),e.jsxs(n.VerticalBarActions,{children:[!j&&e.jsx(n.VerticalBarLabel,{...W?.label,children:y?e.jsx(l,{width:20,height:20}):e.jsx(o,{variation:"xs",component:"p",weight:"bold",sx:{color:e=>S||!c?e.custom.palette.text.disabled:e.custom.palette.text.primary},children:d})}),!q&&e.jsx(e.Fragment,{children:y?e.jsx(l,{width:24,height:24,sx:{borderRadius:.5}}):e.jsx(a,{id:`${v}-checkbox`,variant:"secondary",checked:!S&&c,disabled:S,checkboxLabel:void 0,inputRef:A,onChange:R,...W?.checkbox,sx:t.mergeSx({mr:0,mt:1},W?.checkbox?.sx)})})]})]})})};