@useloops/design-system 1.4.740 → 1.4.741
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/systems/Platform/ProjectItem/_partials/styledPartials.js +1 -1
- package/dist/esm/systems/WebCore/Image/Image.js +1 -1
- package/dist/systems/Platform/ProjectItem/_partials/styledPartials.js +1 -1
- package/dist/systems/WebCore/Image/Image.d.ts +0 -2
- package/dist/systems/WebCore/Image/Image.js +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e}from"react/jsx-runtime";import{styled as o,Box as t,cardActionAreaClasses as r,CardActionArea as i,CardContent as a,iconButtonClasses as s,Stack as p}from"@mui/material";import{MoreActionsContainerId as n,interactionOverlay as l}from"../../utils/cardInteraction.js";import"../../../../utils/formValidation/misc.js";import"../../../BrandCore/Icon/Icon.js";import"../../../BrandCore/primitiveVariables.js";import"../../../WebCore/utils/typography.util.js";import"../../../BrandCore/textures.js";import"../../../WebCore/AnnualController/AnnualController.js";import"../../../WebCore/SelectItem/SelectItem.js";import"../../../WebCore/Accordion/Accordion.js";import"../../../WebCore/Animations/FadeIn.js";import"../../../WebCore/Text/Text.js";import"@mui/icons-material";import"react";import"../../../WebCore/AutocompleteBaseField/_partials/AutocompleteListbox.js";import"../../../WebCore/AutocompleteBaseField/_partials/StyledPopper.js";import"../../../WebCore/AutocompleteBaseField/_partials/StyledAutocompleteField.js";import"../../../WebCore/AutocompleteBaseField/_partials/AutocompleteChip.js";import"../../../WebCore/AutocompleteBaseField/_partials/StyledAutocompleteInput.js";import"merge-sx";import"../../../WebCore/Badge/Badge.js";import"../../../WebCore/Breadcrumb/Breadcrumb.js";import"../../../WebCore/Button/Button.js";import"../../../WebCore/ButtonBase/ButtonBase.js";import"../../../WebCore/ButtonTabGroup/_partials/ActiveIndicator.js";import"../../../WebCore/ButtonTabGroup/_partials/ButtonTabsWrapper.js";import"../../../WebCore/ButtonTabGroup/_partials/TabButton.js";import"../../../WebCore/Checkbox/StyledCheckbox.js";import"../../../WebCore/InputFieldBase/InputFieldBase.js";import"../../../WebCore/CreatableAutocomplete/CreatableAutocomplete.js";import"../../../WebCore/InputLabelBase/StyledInputLabelBase.js";import"../../../WebCore/Differential/DifferentialContainer.js";import"../../../WebCore/Differential/DifferentialRadio.js";import"../../../WebCore/DropdownMenu/StyledMenu.js";import"../../../WebCore/ExpandableTypographyClamp/ExpandableTypographyClamp.js";import"../../../WebCore/FormBuilder/FormBuilder.js";import"../../../WebCore/FormGenerator/FormGenerator.js";import"../../../WebCore/GridOverlay/GridOverlay.js";import"html-react-parser";import"../../../WebCore/IconButton/IconButton.js";import"../../../WebCore/IconButtonBase/IconButtonBase.js";import"../../../WebCore/IconButtonGroup/IconButtonGroup.js";import d from"../../../WebCore/Image/Image.js";import"../../../WebCore/KbdGroup/Kbd.js";import"../../../WebCore/KbdGroup/KbdGroup.js";import"../../../WebCore/KeyValueLabel/KeyValueLabel.js";import"../../../WebCore/Label/Label.js";import"../../../WebCore/Likert/LikertContainer.js";import"../../../WebCore/Likert/LikertLabel.js";import"../../../WebCore/Likert/LikertRadio.js";import"../../../WebCore/Link/StyledLink.js";import"@lottiefiles/dotlottie-react";import"../../../WebCore/LoopsAiButton/LoopsAiButton.js";import"markdown-to-jsx";import"material-ui-popup-state/hooks";import"../../../WebCore/Surface/Surface.js";import"../../../WebCore/Menu/MenuItem.js";import"../../../WebCore/ModalLayout/_partials/ModalActionsWrapper.js";import"../../../WebCore/ModalLayout/_partials/ModalContentWrapper.js";import"../../../WebCore/NavigationButton/NavigationButton.js";import"../../../WebCore/Nudge/NudgeButton.js";import"../../../WebCore/NumberField/NumberField.js";import"../../../BrandCore/colorRamps.js";import"../../../BrandCore/semanticColor.js";import"../../../BrandCore/types.js";import"../../../BrandCore/typography.js";import"../../../BrandCore/Sticker/Sticker.js";import"../../../WebCore/Progress/Progress.js";import"../../../WebCore/Pill/StyledPill.js";import"../../../WebCore/ProgressBar/ProgressBar.js";import"../../../WebCore/Radio/StyledRadio.js";import"../../../WebCore/SortableList/components/SortableItem/SortableItem.js";import{omitProps as m}from"../../../../utils/shouldForwardProp.js";import"../../../WebCore/Select/StyledSelect.js";import"../../../WebCore/RankItem/_partials/LayoutComponents/LayoutComponents.js";import"../../../WebCore/RankItem/_partials/RankItemLabel/RankItemLabel.js";import"../../../WebCore/SortableList/SortableList.js";import"../../../WebCore/SortableList/components/SortableOverlay/SortableOverlay.js";import"@tiptap/extension-placeholder";import"@tiptap/starter-kit";import"mui-tiptap";import"../../../WebCore/RichTextField/StyledRichTextEditor.js";import"../../../WebCore/Skeleton/Skeleton.js";import"../../../WebCore/Slider/StyledSlider.js";import"../../../WebCore/StarRating/StarRating.js";import"../../../WebCore/Switch/StyledSwitch.js";import"../../../WebCore/Textarea/Textarea.js";import"../../../WebCore/TrialCard/TrialCardContainers.js";import"../../../WebCore/TrialCard/TrialPill.js";import"../../../WebCore/UserMenu/UserMenuButton.js";import"../../../WebCore/VideoModal/VideoModal.js";import"../../../WebCore/TintedSurface/TintedSurface.js";const c=72,u=108,b="image-container",C=o(t,{shouldForwardProp:m("viewType")})(({theme:e,viewType:o="grid"})=>{const{card:t}=e.custom.component;return{width:"100%",position:"relative",transition:"all 0.15s ease","&:hover .ProjectItem__Title":{textDecoration:"underline"},[`&:hover *[data-id="${n}"]`]:{opacity:1},"&::after":l(e,0),[`& > .${r.root}`]:{position:"relative",zIndex:1},..."grid"===o?{minWidth:280,maxWidth:400,background:t.surface.default,border:`1px solid ${t.stroke.default}`,borderRadius:e.spacing(t.radius),boxShadow:e.custom.elevation.raised,"&:hover":{borderColor:t.stroke.hover,boxShadow:e.custom.elevation.float,[`&::after, *[data-id="${b}"]::after`]:{backgroundColor:t.interaction.hover}},[`&:has(> .${r.root}:active)`]:{borderColor:t.stroke.default,[`&::after, *[data-id="${b}"]::after`]:{backgroundColor:t.interaction.press}}}:{border:"0 solid transparent",borderBottom:`1px solid ${e.custom.palette.stroke.light}`,"&:hover::after":{backgroundColor:t.interaction.hover},[`&:has(> .${r.root}:active):not(:has([data-id="${n}"] :active))::after`]:{backgroundColor:t.interaction.press}}}}),g=o(i,{shouldForwardProp:m("viewType")})(({theme:e,viewType:o="grid"})=>({cursor:"pointer",..."list"===o?{display:"flex",gap:e.spacing(e.custom.margin.sm),alignItems:"center",padding:e.spacing(e.custom.padding.xs)}:{height:"100%",display:"flex",flexDirection:"column",alignItems:"stretch"},[`& .${r.focusHighlight}`]:{display:"none"}})),j=o(t,{shouldForwardProp:m("viewType")})(({theme:e,viewType:o="grid"})=>({overflow:"hidden",position:"relative",..."grid"===o?{width:"100%",aspectRatio:1.5,borderTopLeftRadius:`calc(${e.spacing(e.custom.component.card.radius)} - 1px)`,borderTopRightRadius:`calc(${e.spacing(e.custom.component.card.radius)} - 1px)`,"&::after":l(e,1)}:{height:72,width:108,borderRadius:e.spacing(e.custom.radius.md)}})),h=({title:o,description:t,thumbnail:r,dominantColor:i})=>{const a=[o,t].filter(Boolean).join(" | ");return e(d,{src:r??void 0,dominantColor:i,alt:a,title:a,width:"100%",height:"100%"})},W=o(t,{shouldForwardProp:m("count")})(({count:e})=>({width:"100%",height:"100%",display:"grid",gridTemplateColumns:1===e?"1fr":"1fr 1fr",gridTemplateRows:e<=2?"1fr":"1fr 1fr",...3===e&&{"& > *:first-of-type":{gridRow:"span 2"}}})),f=o(t)({position:"relative",overflow:"hidden",minWidth:0,minHeight:0}),y=o(t)(({theme:e})=>({position:"absolute",inset:0,zIndex:1,display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:e.custom.palette.surface.scrim})),B=o(a,{shouldForwardProp:m("viewType")})(({theme:e,viewType:o="grid"})=>({display:"flex",flexDirection:"column",gap:e.spacing(e.custom.margin.sm),..."grid"===o?{padding:e.spacing(e.custom.padding.md),width:"100%",borderTop:`1px solid ${e.custom.palette.stroke.subtle}`,flexGrow:1,"& > *:last-child":{marginTop:"auto"}}:{paddingTop:e.spacing(e.custom.padding.xs),paddingBottom:e.spacing(e.custom.padding.xs),paddingLeft:e.spacing(e.custom.padding.sm),paddingRight:0,overflow:"hidden",minWidth:67,flex:1,"&:last-child":{paddingBottom:0}}})),x=o(t,{shouldForwardProp:m("viewType")})(({theme:e,viewType:o="grid"})=>({opacity:0,transition:"opacity 0.3s ease",..."grid"===o&&{position:"absolute",top:8,right:8,zIndex:2},"&:has(:focus-visible)":{opacity:1},[`&& .${s.root}`]:{backgroundColor:e.custom.palette.surface.default,border:`1px solid ${e.custom.palette.stroke.default}`}})),w=o(t)(({theme:e})=>({display:"flex",flexDirection:"row",justifyContent:"space-between",alignItems:"start",gap:e.spacing(e.custom.margin.xs),"& > p":{alignSelf:"center"}})),S=o(p)(({theme:e})=>({flexDirection:"row",alignItems:"center",flexWrap:"wrap",columnGap:e.spacing(e.custom.margin.sm),rowGap:e.spacing(e.custom.margin.xs),justifyContent:"space-between","& > *:last-child":{flexShrink:0}})),v=o(t,{shouldForwardProp:m("viewType")})(({theme:e,viewType:o="grid"})=>({width:"grid"===o?"100%":108,height:"grid"===o?"100%":72,backgroundColor:e.custom.palette.purple[0],display:"flex",justifyContent:"center",alignItems:"center",borderRadius:"grid"===o?0:e.spacing(e.custom.radius.md),"& svg":{height:"grid"===o?64:32,width:"grid"===o?64:32}}));export{g as CardActionArea,C as CardContainer,B as CardContent,W as Collage,f as CollageCell,y as CollageScrim,j as ImageContainer,b as ImageContainerId,h as LazyImage,c as ListImageHeight,u as ListImageWidth,S as ListInfoRow,x as MoreActionsContainer,v as Tile,w as TitleRow};
|
|
1
|
+
import{jsx as e}from"react/jsx-runtime";import{styled as o,Box as t,cardActionAreaClasses as r,CardActionArea as i,CardContent as a,iconButtonClasses as s,Stack as p}from"@mui/material";import{MoreActionsContainerId as n,interactionOverlay as l}from"../../utils/cardInteraction.js";import"../../../../utils/formValidation/misc.js";import"../../../BrandCore/Icon/Icon.js";import"../../../BrandCore/primitiveVariables.js";import"../../../WebCore/utils/typography.util.js";import"../../../BrandCore/textures.js";import"../../../WebCore/AnnualController/AnnualController.js";import"../../../WebCore/SelectItem/SelectItem.js";import"../../../WebCore/Accordion/Accordion.js";import"../../../WebCore/Animations/FadeIn.js";import"../../../WebCore/Text/Text.js";import"@mui/icons-material";import"react";import"../../../WebCore/AutocompleteBaseField/_partials/AutocompleteListbox.js";import"../../../WebCore/AutocompleteBaseField/_partials/StyledPopper.js";import"../../../WebCore/AutocompleteBaseField/_partials/StyledAutocompleteField.js";import"../../../WebCore/AutocompleteBaseField/_partials/AutocompleteChip.js";import"../../../WebCore/AutocompleteBaseField/_partials/StyledAutocompleteInput.js";import"merge-sx";import"../../../WebCore/Badge/Badge.js";import"../../../WebCore/Breadcrumb/Breadcrumb.js";import"../../../WebCore/Button/Button.js";import"../../../WebCore/ButtonBase/ButtonBase.js";import"../../../WebCore/ButtonTabGroup/_partials/ActiveIndicator.js";import"../../../WebCore/ButtonTabGroup/_partials/ButtonTabsWrapper.js";import"../../../WebCore/ButtonTabGroup/_partials/TabButton.js";import"../../../WebCore/Checkbox/StyledCheckbox.js";import"../../../WebCore/InputFieldBase/InputFieldBase.js";import"../../../WebCore/CreatableAutocomplete/CreatableAutocomplete.js";import"../../../WebCore/InputLabelBase/StyledInputLabelBase.js";import"../../../WebCore/Differential/DifferentialContainer.js";import"../../../WebCore/Differential/DifferentialRadio.js";import"../../../WebCore/DropdownMenu/StyledMenu.js";import"../../../WebCore/ExpandableTypographyClamp/ExpandableTypographyClamp.js";import"../../../WebCore/FormBuilder/FormBuilder.js";import"../../../WebCore/FormGenerator/FormGenerator.js";import"../../../WebCore/GridOverlay/GridOverlay.js";import"html-react-parser";import"../../../WebCore/IconButton/IconButton.js";import"../../../WebCore/IconButtonBase/IconButtonBase.js";import"../../../WebCore/IconButtonGroup/IconButtonGroup.js";import d from"../../../WebCore/Image/Image.js";import"../../../WebCore/KbdGroup/Kbd.js";import"../../../WebCore/KbdGroup/KbdGroup.js";import"../../../WebCore/KeyValueLabel/KeyValueLabel.js";import"../../../WebCore/Label/Label.js";import"../../../WebCore/Likert/LikertContainer.js";import"../../../WebCore/Likert/LikertLabel.js";import"../../../WebCore/Likert/LikertRadio.js";import"../../../WebCore/Link/StyledLink.js";import"@lottiefiles/dotlottie-react";import"../../../WebCore/LoopsAiButton/LoopsAiButton.js";import"markdown-to-jsx";import"material-ui-popup-state/hooks";import"../../../WebCore/Surface/Surface.js";import"../../../WebCore/Menu/MenuItem.js";import"../../../WebCore/ModalLayout/_partials/ModalActionsWrapper.js";import"../../../WebCore/ModalLayout/_partials/ModalContentWrapper.js";import"../../../WebCore/NavigationButton/NavigationButton.js";import"../../../WebCore/Nudge/NudgeButton.js";import"../../../WebCore/NumberField/NumberField.js";import"../../../BrandCore/colorRamps.js";import"../../../BrandCore/semanticColor.js";import"../../../BrandCore/types.js";import"../../../BrandCore/typography.js";import"../../../BrandCore/Sticker/Sticker.js";import"../../../WebCore/Progress/Progress.js";import"../../../WebCore/Pill/StyledPill.js";import"../../../WebCore/ProgressBar/ProgressBar.js";import"../../../WebCore/Radio/StyledRadio.js";import"../../../WebCore/SortableList/components/SortableItem/SortableItem.js";import{omitProps as m}from"../../../../utils/shouldForwardProp.js";import"../../../WebCore/Select/StyledSelect.js";import"../../../WebCore/RankItem/_partials/LayoutComponents/LayoutComponents.js";import"../../../WebCore/RankItem/_partials/RankItemLabel/RankItemLabel.js";import"../../../WebCore/SortableList/SortableList.js";import"../../../WebCore/SortableList/components/SortableOverlay/SortableOverlay.js";import"@tiptap/extension-placeholder";import"@tiptap/starter-kit";import"mui-tiptap";import"../../../WebCore/RichTextField/StyledRichTextEditor.js";import"../../../WebCore/Skeleton/Skeleton.js";import"../../../WebCore/Slider/StyledSlider.js";import"../../../WebCore/StarRating/StarRating.js";import"../../../WebCore/Switch/StyledSwitch.js";import"../../../WebCore/Textarea/Textarea.js";import"../../../WebCore/TrialCard/TrialCardContainers.js";import"../../../WebCore/TrialCard/TrialPill.js";import"../../../WebCore/UserMenu/UserMenuButton.js";import"../../../WebCore/VideoModal/VideoModal.js";import"../../../WebCore/TintedSurface/TintedSurface.js";const c=72,u=108,b="image-container",C=o(t,{shouldForwardProp:m("viewType")})(({theme:e,viewType:o="grid"})=>{const{card:t}=e.custom.component;return{width:"100%",position:"relative",transition:"all 0.15s ease","&:hover .ProjectItem__Title":{textDecoration:"underline"},[`&:hover *[data-id="${n}"]`]:{opacity:1},"&::after":l(e,0),[`& > .${r.root}`]:{position:"relative",zIndex:1},contentVisibility:"auto",containIntrinsicSize:"grid"===o?"auto 380px":"auto 90px",..."grid"===o?{minWidth:280,maxWidth:400,background:t.surface.default,border:`1px solid ${t.stroke.default}`,borderRadius:e.spacing(t.radius),boxShadow:e.custom.elevation.raised,"&:hover":{borderColor:t.stroke.hover,boxShadow:e.custom.elevation.float,[`&::after, *[data-id="${b}"]::after`]:{backgroundColor:t.interaction.hover}},[`&:has(> .${r.root}:active)`]:{borderColor:t.stroke.default,[`&::after, *[data-id="${b}"]::after`]:{backgroundColor:t.interaction.press}}}:{border:"0 solid transparent",borderBottom:`1px solid ${e.custom.palette.stroke.light}`,"&:hover::after":{backgroundColor:t.interaction.hover},[`&:has(> .${r.root}:active):not(:has([data-id="${n}"] :active))::after`]:{backgroundColor:t.interaction.press}}}}),g=o(i,{shouldForwardProp:m("viewType")})(({theme:e,viewType:o="grid"})=>({cursor:"pointer",..."list"===o?{display:"flex",gap:e.spacing(e.custom.margin.sm),alignItems:"center",padding:e.spacing(e.custom.padding.xs)}:{height:"100%",display:"flex",flexDirection:"column",alignItems:"stretch"},[`& .${r.focusHighlight}`]:{display:"none"}})),j=o(t,{shouldForwardProp:m("viewType")})(({theme:e,viewType:o="grid"})=>({overflow:"hidden",position:"relative",..."grid"===o?{width:"100%",aspectRatio:1.5,borderTopLeftRadius:`calc(${e.spacing(e.custom.component.card.radius)} - 1px)`,borderTopRightRadius:`calc(${e.spacing(e.custom.component.card.radius)} - 1px)`,"&::after":l(e,1)}:{height:72,width:108,borderRadius:e.spacing(e.custom.radius.md)}})),h=({title:o,description:t,thumbnail:r,dominantColor:i})=>{const a=[o,t].filter(Boolean).join(" | ");return e(d,{src:r??void 0,dominantColor:i,alt:a,title:a,width:"100%",height:"100%"})},W=o(t,{shouldForwardProp:m("count")})(({count:e})=>({width:"100%",height:"100%",display:"grid",gridTemplateColumns:1===e?"1fr":"1fr 1fr",gridTemplateRows:e<=2?"1fr":"1fr 1fr",...3===e&&{"& > *:first-of-type":{gridRow:"span 2"}}})),f=o(t)({position:"relative",overflow:"hidden",minWidth:0,minHeight:0}),y=o(t)(({theme:e})=>({position:"absolute",inset:0,zIndex:1,display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:e.custom.palette.surface.scrim})),B=o(a,{shouldForwardProp:m("viewType")})(({theme:e,viewType:o="grid"})=>({display:"flex",flexDirection:"column",gap:e.spacing(e.custom.margin.sm),..."grid"===o?{padding:e.spacing(e.custom.padding.md),width:"100%",borderTop:`1px solid ${e.custom.palette.stroke.subtle}`,flexGrow:1,"& > *:last-child":{marginTop:"auto"}}:{paddingTop:e.spacing(e.custom.padding.xs),paddingBottom:e.spacing(e.custom.padding.xs),paddingLeft:e.spacing(e.custom.padding.sm),paddingRight:0,overflow:"hidden",minWidth:67,flex:1,"&:last-child":{paddingBottom:0}}})),x=o(t,{shouldForwardProp:m("viewType")})(({theme:e,viewType:o="grid"})=>({opacity:0,transition:"opacity 0.3s ease",..."grid"===o&&{position:"absolute",top:8,right:8,zIndex:2},"&:has(:focus-visible)":{opacity:1},[`&& .${s.root}`]:{backgroundColor:e.custom.palette.surface.default,border:`1px solid ${e.custom.palette.stroke.default}`}})),w=o(t)(({theme:e})=>({display:"flex",flexDirection:"row",justifyContent:"space-between",alignItems:"start",gap:e.spacing(e.custom.margin.xs),"& > p":{alignSelf:"center"}})),S=o(p)(({theme:e})=>({flexDirection:"row",alignItems:"center",flexWrap:"wrap",columnGap:e.spacing(e.custom.margin.sm),rowGap:e.spacing(e.custom.margin.xs),justifyContent:"space-between","& > *:last-child":{flexShrink:0}})),v=o(t,{shouldForwardProp:m("viewType")})(({theme:e,viewType:o="grid"})=>({width:"grid"===o?"100%":108,height:"grid"===o?"100%":72,backgroundColor:e.custom.palette.purple[0],display:"flex",justifyContent:"center",alignItems:"center",borderRadius:"grid"===o?0:e.spacing(e.custom.radius.md),"& svg":{height:"grid"===o?64:32,width:"grid"===o?64:32}}));export{g as CardActionArea,C as CardContainer,B as CardContent,W as Collage,f as CollageCell,y as CollageScrim,j as ImageContainer,b as ImageContainerId,h as LazyImage,c as ListImageHeight,u as ListImageWidth,S as ListInfoRow,x as MoreActionsContainer,v as Tile,w as TitleRow};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as t,jsx as
|
|
1
|
+
import{jsxs as t,jsx as i}from"react/jsx-runtime";import{styled as o,Box as a,Fade as e,Skeleton as r}from"@mui/material";import{useState as n}from"react";import{omitProps as d}from"../../../utils/shouldForwardProp.js";const s=o("img",{shouldForwardProp:d("quickFade")})(({quickFade:t})=>({display:"block",width:"100%",objectFit:"cover",height:"100%",...t?{transition:"opacity 0.2s ease","&.loaded":{opacity:1},"&:not(.loaded)":{opacity:0}}:{transition:"opacity 0.5s ease-in-out, filter 0.5s ease-in-out, transform 0.5s ease-in-out",transitionDelay:"0.2s","&.loaded":{opacity:1,filter:"blur(0px)",transform:"scale(1)"},"&:not(.loaded)":{opacity:0,filter:"blur(15px)",transform:"scale(1.05)"}}})),l=({src:o,alt:d,width:l,height:c,containerSx:h,dominantColor:u,...m})=>{const[p,f]=n(!1);return t(a,{sx:{position:"relative",width:l,height:c,overflow:"hidden",...u&&{backgroundColor:u},...h},children:[!u&&i(e,{in:!p,unmountOnExit:!0,children:i(a,{sx:{width:l,height:c,position:"absolute",inset:0},children:i(r,{variant:"rectangular",width:"100%",height:"100%"})})}),i(s,{onLoad:()=>f(!0),className:p?"loaded":void 0,quickFade:!!u,loading:"lazy",decoding:"async",alt:d,src:o,width:l,height:c,...m})]})};export{l as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var e=require("react/jsx-runtime"),r=require("@mui/material"),o=require("../../utils/cardInteraction.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("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/FormBuilder/FormBuilder.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");var t=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("../../../BrandCore/Sticker/Sticker.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");var i=require("../../../../utils/shouldForwardProp.js");require("../../../WebCore/Select/StyledSelect.js"),require("../../../WebCore/RankItem/_partials/LayoutComponents/LayoutComponents.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");const a="image-container",s=r.styled(r.Box,{shouldForwardProp:i.omitProps("viewType")})(({theme:e,viewType:t="grid"})=>{const{card:i}=e.custom.component;return{width:"100%",position:"relative",transition:"all 0.15s ease","&:hover .ProjectItem__Title":{textDecoration:"underline"},[`&:hover *[data-id="${o.MoreActionsContainerId}"]`]:{opacity:1},"&::after":o.interactionOverlay(e,0),[`& > .${r.cardActionAreaClasses.root}`]:{position:"relative",zIndex:1},..."grid"===t?{minWidth:280,maxWidth:400,background:i.surface.default,border:`1px solid ${i.stroke.default}`,borderRadius:e.spacing(i.radius),boxShadow:e.custom.elevation.raised,"&:hover":{borderColor:i.stroke.hover,boxShadow:e.custom.elevation.float,[`&::after, *[data-id="${a}"]::after`]:{backgroundColor:i.interaction.hover}},[`&:has(> .${r.cardActionAreaClasses.root}:active)`]:{borderColor:i.stroke.default,[`&::after, *[data-id="${a}"]::after`]:{backgroundColor:i.interaction.press}}}:{border:"0 solid transparent",borderBottom:`1px solid ${e.custom.palette.stroke.light}`,"&:hover::after":{backgroundColor:i.interaction.hover},[`&:has(> .${r.cardActionAreaClasses.root}:active):not(:has([data-id="${o.MoreActionsContainerId}"] :active))::after`]:{backgroundColor:i.interaction.press}}}}),n=r.styled(r.CardActionArea,{shouldForwardProp:i.omitProps("viewType")})(({theme:e,viewType:o="grid"})=>({cursor:"pointer",..."list"===o?{display:"flex",gap:e.spacing(e.custom.margin.sm),alignItems:"center",padding:e.spacing(e.custom.padding.xs)}:{height:"100%",display:"flex",flexDirection:"column",alignItems:"stretch"},[`& .${r.cardActionAreaClasses.focusHighlight}`]:{display:"none"}})),l=r.styled(r.Box,{shouldForwardProp:i.omitProps("viewType")})(({theme:e,viewType:r="grid"})=>({overflow:"hidden",position:"relative",..."grid"===r?{width:"100%",aspectRatio:1.5,borderTopLeftRadius:`calc(${e.spacing(e.custom.component.card.radius)} - 1px)`,borderTopRightRadius:`calc(${e.spacing(e.custom.component.card.radius)} - 1px)`,"&::after":o.interactionOverlay(e,1)}:{height:72,width:108,borderRadius:e.spacing(e.custom.radius.md)}})),u=r.styled(r.Box,{shouldForwardProp:i.omitProps("count")})(({count:e})=>({width:"100%",height:"100%",display:"grid",gridTemplateColumns:1===e?"1fr":"1fr 1fr",gridTemplateRows:e<=2?"1fr":"1fr 1fr",...3===e&&{"& > *:first-of-type":{gridRow:"span 2"}}})),d=r.styled(r.Box)({position:"relative",overflow:"hidden",minWidth:0,minHeight:0}),p=r.styled(r.Box)(({theme:e})=>({position:"absolute",inset:0,zIndex:1,display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:e.custom.palette.surface.scrim})),c=r.styled(r.CardContent,{shouldForwardProp:i.omitProps("viewType")})(({theme:e,viewType:r="grid"})=>({display:"flex",flexDirection:"column",gap:e.spacing(e.custom.margin.sm),..."grid"===r?{padding:e.spacing(e.custom.padding.md),width:"100%",borderTop:`1px solid ${e.custom.palette.stroke.subtle}`,flexGrow:1,"& > *:last-child":{marginTop:"auto"}}:{paddingTop:e.spacing(e.custom.padding.xs),paddingBottom:e.spacing(e.custom.padding.xs),paddingLeft:e.spacing(e.custom.padding.sm),paddingRight:0,overflow:"hidden",minWidth:67,flex:1,"&:last-child":{paddingBottom:0}}})),m=r.styled(r.Box,{shouldForwardProp:i.omitProps("viewType")})(({theme:e,viewType:o="grid"})=>({opacity:0,transition:"opacity 0.3s ease",..."grid"===o&&{position:"absolute",top:8,right:8,zIndex:2},"&:has(:focus-visible)":{opacity:1},[`&& .${r.iconButtonClasses.root}`]:{backgroundColor:e.custom.palette.surface.default,border:`1px solid ${e.custom.palette.stroke.default}`}})),b=r.styled(r.Box)(({theme:e})=>({display:"flex",flexDirection:"row",justifyContent:"space-between",alignItems:"start",gap:e.spacing(e.custom.margin.xs),"& > p":{alignSelf:"center"}})),C=r.styled(r.Stack)(({theme:e})=>({flexDirection:"row",alignItems:"center",flexWrap:"wrap",columnGap:e.spacing(e.custom.margin.sm),rowGap:e.spacing(e.custom.margin.xs),justifyContent:"space-between","& > *:last-child":{flexShrink:0}})),g=r.styled(r.Box,{shouldForwardProp:i.omitProps("viewType")})(({theme:e,viewType:r="grid"})=>({width:"grid"===r?"100%":108,height:"grid"===r?"100%":72,backgroundColor:e.custom.palette.purple[0],display:"flex",justifyContent:"center",alignItems:"center",borderRadius:"grid"===r?0:e.spacing(e.custom.radius.md),"& svg":{height:"grid"===r?64:32,width:"grid"===r?64:32}}));exports.CardActionArea=n,exports.CardContainer=s,exports.CardContent=c,exports.Collage=u,exports.CollageCell=d,exports.CollageScrim=p,exports.ImageContainer=l,exports.ImageContainerId=a,exports.LazyImage=({title:r,description:o,thumbnail:i,dominantColor:a})=>{const s=[r,o].filter(Boolean).join(" | ");return e.jsx(t,{src:i??void 0,dominantColor:a,alt:s,title:s,width:"100%",height:"100%"})},exports.ListImageHeight=72,exports.ListImageWidth=108,exports.ListInfoRow=C,exports.MoreActionsContainer=m,exports.Tile=g,exports.TitleRow=b;
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),r=require("@mui/material"),o=require("../../utils/cardInteraction.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("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/FormBuilder/FormBuilder.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");var t=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("../../../BrandCore/Sticker/Sticker.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");var i=require("../../../../utils/shouldForwardProp.js");require("../../../WebCore/Select/StyledSelect.js"),require("../../../WebCore/RankItem/_partials/LayoutComponents/LayoutComponents.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");const a="image-container",s=r.styled(r.Box,{shouldForwardProp:i.omitProps("viewType")})(({theme:e,viewType:t="grid"})=>{const{card:i}=e.custom.component;return{width:"100%",position:"relative",transition:"all 0.15s ease","&:hover .ProjectItem__Title":{textDecoration:"underline"},[`&:hover *[data-id="${o.MoreActionsContainerId}"]`]:{opacity:1},"&::after":o.interactionOverlay(e,0),[`& > .${r.cardActionAreaClasses.root}`]:{position:"relative",zIndex:1},contentVisibility:"auto",containIntrinsicSize:"grid"===t?"auto 380px":"auto 90px",..."grid"===t?{minWidth:280,maxWidth:400,background:i.surface.default,border:`1px solid ${i.stroke.default}`,borderRadius:e.spacing(i.radius),boxShadow:e.custom.elevation.raised,"&:hover":{borderColor:i.stroke.hover,boxShadow:e.custom.elevation.float,[`&::after, *[data-id="${a}"]::after`]:{backgroundColor:i.interaction.hover}},[`&:has(> .${r.cardActionAreaClasses.root}:active)`]:{borderColor:i.stroke.default,[`&::after, *[data-id="${a}"]::after`]:{backgroundColor:i.interaction.press}}}:{border:"0 solid transparent",borderBottom:`1px solid ${e.custom.palette.stroke.light}`,"&:hover::after":{backgroundColor:i.interaction.hover},[`&:has(> .${r.cardActionAreaClasses.root}:active):not(:has([data-id="${o.MoreActionsContainerId}"] :active))::after`]:{backgroundColor:i.interaction.press}}}}),n=r.styled(r.CardActionArea,{shouldForwardProp:i.omitProps("viewType")})(({theme:e,viewType:o="grid"})=>({cursor:"pointer",..."list"===o?{display:"flex",gap:e.spacing(e.custom.margin.sm),alignItems:"center",padding:e.spacing(e.custom.padding.xs)}:{height:"100%",display:"flex",flexDirection:"column",alignItems:"stretch"},[`& .${r.cardActionAreaClasses.focusHighlight}`]:{display:"none"}})),l=r.styled(r.Box,{shouldForwardProp:i.omitProps("viewType")})(({theme:e,viewType:r="grid"})=>({overflow:"hidden",position:"relative",..."grid"===r?{width:"100%",aspectRatio:1.5,borderTopLeftRadius:`calc(${e.spacing(e.custom.component.card.radius)} - 1px)`,borderTopRightRadius:`calc(${e.spacing(e.custom.component.card.radius)} - 1px)`,"&::after":o.interactionOverlay(e,1)}:{height:72,width:108,borderRadius:e.spacing(e.custom.radius.md)}})),u=r.styled(r.Box,{shouldForwardProp:i.omitProps("count")})(({count:e})=>({width:"100%",height:"100%",display:"grid",gridTemplateColumns:1===e?"1fr":"1fr 1fr",gridTemplateRows:e<=2?"1fr":"1fr 1fr",...3===e&&{"& > *:first-of-type":{gridRow:"span 2"}}})),d=r.styled(r.Box)({position:"relative",overflow:"hidden",minWidth:0,minHeight:0}),p=r.styled(r.Box)(({theme:e})=>({position:"absolute",inset:0,zIndex:1,display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:e.custom.palette.surface.scrim})),c=r.styled(r.CardContent,{shouldForwardProp:i.omitProps("viewType")})(({theme:e,viewType:r="grid"})=>({display:"flex",flexDirection:"column",gap:e.spacing(e.custom.margin.sm),..."grid"===r?{padding:e.spacing(e.custom.padding.md),width:"100%",borderTop:`1px solid ${e.custom.palette.stroke.subtle}`,flexGrow:1,"& > *:last-child":{marginTop:"auto"}}:{paddingTop:e.spacing(e.custom.padding.xs),paddingBottom:e.spacing(e.custom.padding.xs),paddingLeft:e.spacing(e.custom.padding.sm),paddingRight:0,overflow:"hidden",minWidth:67,flex:1,"&:last-child":{paddingBottom:0}}})),m=r.styled(r.Box,{shouldForwardProp:i.omitProps("viewType")})(({theme:e,viewType:o="grid"})=>({opacity:0,transition:"opacity 0.3s ease",..."grid"===o&&{position:"absolute",top:8,right:8,zIndex:2},"&:has(:focus-visible)":{opacity:1},[`&& .${r.iconButtonClasses.root}`]:{backgroundColor:e.custom.palette.surface.default,border:`1px solid ${e.custom.palette.stroke.default}`}})),b=r.styled(r.Box)(({theme:e})=>({display:"flex",flexDirection:"row",justifyContent:"space-between",alignItems:"start",gap:e.spacing(e.custom.margin.xs),"& > p":{alignSelf:"center"}})),C=r.styled(r.Stack)(({theme:e})=>({flexDirection:"row",alignItems:"center",flexWrap:"wrap",columnGap:e.spacing(e.custom.margin.sm),rowGap:e.spacing(e.custom.margin.xs),justifyContent:"space-between","& > *:last-child":{flexShrink:0}})),g=r.styled(r.Box,{shouldForwardProp:i.omitProps("viewType")})(({theme:e,viewType:r="grid"})=>({width:"grid"===r?"100%":108,height:"grid"===r?"100%":72,backgroundColor:e.custom.palette.purple[0],display:"flex",justifyContent:"center",alignItems:"center",borderRadius:"grid"===r?0:e.spacing(e.custom.radius.md),"& svg":{height:"grid"===r?64:32,width:"grid"===r?64:32}}));exports.CardActionArea=n,exports.CardContainer=s,exports.CardContent=c,exports.Collage=u,exports.CollageCell=d,exports.CollageScrim=p,exports.ImageContainer=l,exports.ImageContainerId=a,exports.LazyImage=({title:r,description:o,thumbnail:i,dominantColor:a})=>{const s=[r,o].filter(Boolean).join(" | ");return e.jsx(t,{src:i??void 0,dominantColor:a,alt:s,title:s,width:"100%",height:"100%"})},exports.ListImageHeight=72,exports.ListImageWidth=108,exports.ListInfoRow=C,exports.MoreActionsContainer=m,exports.Tile=g,exports.TitleRow=b;
|
|
@@ -6,8 +6,6 @@ interface ImageProps extends Omit<ImgHTMLAttributes<HTMLImageElement>, 'width' |
|
|
|
6
6
|
src?: string;
|
|
7
7
|
width?: string | number;
|
|
8
8
|
height?: string | number;
|
|
9
|
-
threshold?: number;
|
|
10
|
-
rootMargin?: string;
|
|
11
9
|
dominantColor?: string | null;
|
|
12
10
|
}
|
|
13
11
|
declare const Image: FunctionComponent<ImageProps>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var t=require("react/jsx-runtime"),e=require("@mui/material"),i=require("react"),o=require("../../../utils/shouldForwardProp.js");const a=e.styled("img",{shouldForwardProp:o.omitProps("quickFade")})(({quickFade:t})=>({display:"block",width:"100%",objectFit:"cover",height:"100%",...t?{transition:"opacity 0.2s ease","&.loaded":{opacity:1},"&:not(.loaded)":{opacity:0}}:{transition:"opacity 0.5s ease-in-out, filter 0.5s ease-in-out, transform 0.5s ease-in-out",transitionDelay:"0.2s","&.loaded":{opacity:1,filter:"blur(0px)",transform:"scale(1)"},"&:not(.loaded)":{opacity:0,filter:"blur(15px)",transform:"scale(1.05)"}}}));module.exports=({src:o,alt:r,width:s,height:n,containerSx:d,dominantColor:l,...c})=>{const[u,h]=i.useState(!1);return t.jsxs(e.Box,{sx:{position:"relative",width:s,height:n,overflow:"hidden",...l&&{backgroundColor:l},...d},children:[!l&&t.jsx(e.Fade,{in:!u,unmountOnExit:!0,children:t.jsx(e.Box,{sx:{width:s,height:n,position:"absolute",inset:0},children:t.jsx(e.Skeleton,{variant:"rectangular",width:"100%",height:"100%"})})}),t.jsx(a,{onLoad:()=>h(!0),className:u?"loaded":void 0,quickFade:!!l,loading:"lazy",decoding:"async",alt:r,src:o,width:s,height:n,...c})]})};
|