@useloops/design-system 1.4.613 → 1.4.615
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/WebCore/Select/Select.js +1 -1
- package/dist/esm/systems/WebCore/Select/SelectItem.js +1 -1
- package/dist/esm/theme/theme.js +1 -1
- package/dist/systems/WebCore/Select/Select.js +1 -1
- package/dist/systems/WebCore/Select/SelectItem.js +1 -1
- package/dist/theme/theme.js +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e}from"react/jsx-runtime";import{KeyboardArrowDown as
|
|
1
|
+
import{jsx as e}from"react/jsx-runtime";import{KeyboardArrowDown as t}from"@mui/icons-material";import{useTheme as o}from"@mui/material";import{useBreakpoint as r}from"../../../utils/breakpoint.hook.js";import l from"../Typography/Typography.js";import i from"./Autocomplete.js";import a from"./SelectItem.js";import n from"./StyledSelect.js";import{menuStyles as m}from"./StyledSelect.variant-helpers.js";const s=({selections:s,autoComplete:p=!1,disabled:c=!1,disablePortal:d=!1,grouped:u,inputRef:h,internalChange:g,multi:f=!0,onChange:v,placeholder:y="",selectOptionProps:b,sizing:j="lg",sx:x,value:C=[],renderListItem:I,renderSelectedItem:S,...z})=>{const P=o(),A=r();return p?e(i,{selections:s,placeholder:y,disabled:c,sizing:j,onChange:(e,t)=>{v&&v(t||""),g&&g()},value:Array.isArray(C)?C??[]:C??"",internalChange:g,renderListItem:I,multiple:f,grouped:u}):e(n,{sizing:j,inputRef:h,MenuProps:{disablePortal:d,sx:m,anchorOrigin:{vertical:"bottom",horizontal:"center"},MenuListProps:{autoFocusItem:!1}},displayEmpty:!0,IconComponent:t,renderValue:t=>y&&!t?e(l,{component:"p",variation:"sm"===A||"md"===A?"sm":"lg",sx:{color:P.custom.palette.text.placeholder},children:y}):S?S(t,s?.find(({value:e})=>e===t)?.label):e(l,{component:"p",variation:"sm"===A||"md"===A?"sm":"lg",children:s?.find(({value:e})=>e===t)?.label}),onChange:(e,t)=>{v&&v(e,t),g&&g()},sx:x,value:C,...z,children:s?.map(({value:t,label:o})=>e(a,{value:t,...b,sizing:j,children:I?I(t,o):o},t))})};export{s as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as t}from"react/jsx-runtime";import{styled as e,MenuItem as o}from"@mui/material";import{selectItemBaseStyles as r}from"./StyledSelect.variant-helpers.js";const i=e(o)(({theme:t,sizing:e})=>({...{...r(t,e)},"&.Mui-focusVisible":{backgroundColor:t.custom.palette.interaction.
|
|
1
|
+
import{jsx as t}from"react/jsx-runtime";import{styled as e,MenuItem as o}from"@mui/material";import{selectItemBaseStyles as r}from"./StyledSelect.variant-helpers.js";const i=e(o)(({theme:t,sizing:e})=>({...{...r(t,e)},"&.Mui-focusVisible":{backgroundColor:t.custom.palette.interaction.hover},"&:hover":{backgroundColor:t.custom.palette.interaction.hover},"&.Mui-selected":{backgroundColor:t.custom.palette.interaction.press,"&.Mui-focusVisible":{backgroundColor:t.custom.palette.interaction.press},"&:hover":{backgroundColor:t.custom.palette.interaction.press}},"&.MuiButtonBase-root.MuiMenuItem-root.Mui-disabled":{backgroundColor:t.custom.palette.input.default,color:t.custom.palette.text.disabled,"&:before":{backgroundColor:t.custom.palette.interaction.disabled}}})),a=({children:e,...o})=>t(i,{...o,children:e});export{a as default};
|
package/dist/esm/theme/theme.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{createTheme as t}from"@mui/material";import{greenRamp as e,blueRamp as o,yellowRamp as a,peachRamp as r,redRamp as n,purpleRamp as i,neutralRamp as s}from"../systems/BrandCore/colorRamps.js";import{purple as l,neutralAlpha as d,darkNeutralAlpha as p}from"../systems/BrandCore/primitiveColor.js";import{breakpoints as m,base as f,easing as u,boxShadow as c,elevationFilter as y,elevation as g,radius as h,padding as b,margin as w}from"../systems/BrandCore/primitiveVariables.js";import{semantic as $}from"../systems/BrandCore/semanticColor.js";import{fonts as v}from"../systems/BrandCore/typography.js";import{typographyVariants as k,typographyVariantMap as x}from"../systems/WebCore/utils/typography.util.js";const F="https://
|
|
1
|
+
import{createTheme as t}from"@mui/material";import{greenRamp as e,blueRamp as o,yellowRamp as a,peachRamp as r,redRamp as n,purpleRamp as i,neutralRamp as s}from"../systems/BrandCore/colorRamps.js";import{purple as l,neutralAlpha as d,darkNeutralAlpha as p}from"../systems/BrandCore/primitiveColor.js";import{breakpoints as m,base as f,easing as u,boxShadow as c,elevationFilter as y,elevation as g,radius as h,padding as b,margin as w}from"../systems/BrandCore/primitiveVariables.js";import{semantic as $}from"../systems/BrandCore/semanticColor.js";import{fonts as v}from"../systems/BrandCore/typography.js";import{typographyVariants as k,typographyVariantMap as x}from"../systems/WebCore/utils/typography.util.js";const F="https://static-pingu-production.useloops.com/fonts/",C=(t,e)=>Object.fromEntries(Object.entries(t).map(([t,o])=>[t,o*e+"px"])),R=(R,G,B)=>t({direction:B,p:C(b,f),m:C(w,f),r:C(h,f),custom:{palette:{black:"#000000",white:"#ffffff",neutral:s[R],neutralAlpha:"light"===R?d:p,purple:i[R],red:n[R],peach:r[R],yellow:a[R],blue:o[R],green:e[R],icon:$[R].icon,interaction:$[R].interaction,stroke:$[R].stroke,surface:$[R].surface,text:$[R].text,input:$[R].input,skeleton:$[R].skeleton,data:$[R].data,body:$[R].surface.default},margin:w,padding:b,radius:h,elevation:g,elevationFilter:y,boxShadow:c,easing:u,typography:x[G]},palette:{mode:R,primary:{main:l[500]}},spacing:f,shape:{borderRadius:f,hotspot:{default:12,active:24}},breakpoints:{values:m},typography:{fontFamily:`"${v.FoundersGrotesk.name}", "Helvetica", "sans-serif"`},components:{MuiTypography:{variants:k(G),styleOverrides:{root:{color:$[R].text.primary,letterSpacing:0,lineHeight:"140%"}}},MuiCssBaseline:{styleOverrides:t=>`\n\t\t\t\t\tbody {\n\t\t\t\t\t\tbackground: ${t.custom.palette.body};\n\t\t\t\t\t\tmin-width: 320px;\n\t\t\t\t\t}\n\t\t\t\t\ta {\n\t\t\t\t\t\tcolor: inherit;\n\t\t\t\t\t\tdisplay: flex;\n\t\t\t\t\t\ttext-decoration: none;\n\t\t\t\t\t}\n\t\t\t\t\tb {\n\t\t\t\t\t\tfont-weight: 500;\n\t\t\t\t\t}\n @font-face {\n font-family: '${v.Domaine.name}';\n font-style: normal;\n font-display: swap;\n font-weight: ${v.Domaine.default.weight};\n src: url(${F}${v.Domaine.default.fileName}) format('woff2');\n }\n @font-face {\n font-family: '${v.Domaine.name}';\n font-style: normal;\n font-display: swap;\n font-weight: ${v.Domaine.bold.weight};\n src: url(${F}${v.Domaine.bold.fileName}) format('woff2');\n }\n @font-face {\n font-family: '${v.FoundersGrotesk.name}';\n font-style: normal;\n font-display: swap;\n font-weight: ${v.FoundersGrotesk.default.weight};\n src: url(${F}${v.FoundersGrotesk.default.fileName}) format('woff2');\n }\n @font-face {\n font-family: '${v.FoundersGrotesk.name}';\n font-style: normal;\n font-display: swap;\n font-weight: ${v.FoundersGrotesk.bold.weight};\n src: url(${F}${v.FoundersGrotesk.bold.fileName}) format('woff2');\n }\n `},MuiContainer:{defaultProps:{maxWidth:"xl",disableGutters:!0},styleOverrides:{root:{paddingLeft:16,paddingRight:16,[`@media (min-width: ${m.md}px)`]:{paddingLeft:24,paddingRight:24},[`@media (min-width: ${m.lg}px)`]:{paddingLeft:48,paddingRight:48}}}},MuiButtonBase:{defaultProps:{disableTouchRipple:!0,disableRipple:!0}},MuiButton:{defaultProps:{disableTouchRipple:!0,disableRipple:!0}},MuiTooltip:{styleOverrides:{arrow:({theme:{custom:t}})=>({color:t.palette.surface.overlay}),tooltip:({theme:{custom:t}})=>({backgroundColor:t.palette.surface.overlay,borderRadius:t.radius.md,color:t.palette.text.primary,backdropFilter:"blur(0)",filter:t.elevationFilter.overlay,fontFamily:v.FoundersGrotesk.name,fontSize:t.typography.body.sm,fontWeight:400,padding:`${t.padding.sm*f}px ${t.padding.md*f}px`})}},MuiAvatarGroup:{styleOverrides:{root:{flexDirection:"row"},avatar:({theme:{custom:t}})=>({border:`1px solid ${t.palette.stroke.default}`,marginLeft:0,marginRight:-8,":last-child":{marginLeft:"auto"}})}},MuiPaper:{styleOverrides:{root:({theme:{custom:t}})=>({backgroundColor:t.palette.surface.default})}}}});export{R as customTheme};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var e=require("react/jsx-runtime"),r=require("@mui/icons-material"),
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),r=require("@mui/icons-material"),t=require("@mui/material"),i=require("../../../utils/breakpoint.hook.js"),l=require("../Typography/Typography.js"),n=require("./Autocomplete.js"),a=require("./SelectItem.js"),s=require("./StyledSelect.js"),o=require("./StyledSelect.variant-helpers.js");module.exports=({selections:u,autoComplete:p=!1,disabled:m=!1,disablePortal:d=!1,grouped:c,inputRef:h,internalChange:g,multi:j=!0,onChange:v,placeholder:x="",selectOptionProps:y,sizing:b="lg",sx:q,value:C=[],renderListItem:S,renderSelectedItem:I,...z})=>{const P=t.useTheme(),f=i.useBreakpoint();return p?e.jsx(n,{selections:u,placeholder:x,disabled:m,sizing:b,onChange:(e,r)=>{v&&v(r||""),g&&g()},value:Array.isArray(C)?C??[]:C??"",internalChange:g,renderListItem:S,multiple:j,grouped:c}):e.jsx(s,{sizing:b,inputRef:h,MenuProps:{disablePortal:d,sx:o.menuStyles,anchorOrigin:{vertical:"bottom",horizontal:"center"},MenuListProps:{autoFocusItem:!1}},displayEmpty:!0,IconComponent:r.KeyboardArrowDown,renderValue:r=>x&&!r?e.jsx(l,{component:"p",variation:"sm"===f||"md"===f?"sm":"lg",sx:{color:P.custom.palette.text.placeholder},children:x}):I?I(r,u?.find(({value:e})=>e===r)?.label):e.jsx(l,{component:"p",variation:"sm"===f||"md"===f?"sm":"lg",children:u?.find(({value:e})=>e===r)?.label}),onChange:(e,r)=>{v&&v(e,r),g&&g()},sx:q,value:C,...z,children:u?.map(({value:r,label:t})=>e.jsx(a,{value:r,...y,sizing:b,children:S?S(r,t):t},r))})};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var e=require("react/jsx-runtime"),t=require("@mui/material"),o=require("./StyledSelect.variant-helpers.js");const r=t.styled(t.MenuItem)(({theme:e,sizing:t})=>({...{...o.selectItemBaseStyles(e,t)},"&.Mui-focusVisible":{backgroundColor:e.custom.palette.interaction.
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),t=require("@mui/material"),o=require("./StyledSelect.variant-helpers.js");const r=t.styled(t.MenuItem)(({theme:e,sizing:t})=>({...{...o.selectItemBaseStyles(e,t)},"&.Mui-focusVisible":{backgroundColor:e.custom.palette.interaction.hover},"&:hover":{backgroundColor:e.custom.palette.interaction.hover},"&.Mui-selected":{backgroundColor:e.custom.palette.interaction.press,"&.Mui-focusVisible":{backgroundColor:e.custom.palette.interaction.press},"&:hover":{backgroundColor:e.custom.palette.interaction.press}},"&.MuiButtonBase-root.MuiMenuItem-root.Mui-disabled":{backgroundColor:e.custom.palette.input.default,color:e.custom.palette.text.disabled,"&:before":{backgroundColor:e.custom.palette.interaction.disabled}}}));module.exports=({children:t,...o})=>e.jsx(r,{...o,children:t});
|
package/dist/theme/theme.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var t=require("@mui/material"),e=require("../systems/BrandCore/colorRamps.js"),a=require("../systems/BrandCore/primitiveColor.js"),n=require("../systems/BrandCore/primitiveVariables.js"),o=require("../systems/BrandCore/semanticColor.js"),r=require("../systems/BrandCore/typography.js"),i=require("../systems/WebCore/utils/typography.util.js");const s="https://
|
|
1
|
+
"use strict";var t=require("@mui/material"),e=require("../systems/BrandCore/colorRamps.js"),a=require("../systems/BrandCore/primitiveColor.js"),n=require("../systems/BrandCore/primitiveVariables.js"),o=require("../systems/BrandCore/semanticColor.js"),r=require("../systems/BrandCore/typography.js"),i=require("../systems/WebCore/utils/typography.util.js");const s="https://static-pingu-production.useloops.com/fonts/",l=(t,e)=>Object.fromEntries(Object.entries(t).map(([t,a])=>[t,a*e+"px"]));exports.customTheme=(p,d,m)=>t.createTheme({direction:m,p:l(n.padding,n.base),m:l(n.margin,n.base),r:l(n.radius,n.base),custom:{palette:{black:"#000000",white:"#ffffff",neutral:e.neutralRamp[p],neutralAlpha:"light"===p?a.neutralAlpha:a.darkNeutralAlpha,purple:e.purpleRamp[p],red:e.redRamp[p],peach:e.peachRamp[p],yellow:e.yellowRamp[p],blue:e.blueRamp[p],green:e.greenRamp[p],icon:o.semantic[p].icon,interaction:o.semantic[p].interaction,stroke:o.semantic[p].stroke,surface:o.semantic[p].surface,text:o.semantic[p].text,input:o.semantic[p].input,skeleton:o.semantic[p].skeleton,data:o.semantic[p].data,body:o.semantic[p].surface.default},margin:n.margin,padding:n.padding,radius:n.radius,elevation:n.elevation,elevationFilter:n.elevationFilter,boxShadow:n.boxShadow,easing:n.easing,typography:i.typographyVariantMap[d]},palette:{mode:p,primary:{main:a.purple[500]}},spacing:n.base,shape:{borderRadius:n.base,hotspot:{default:12,active:24}},breakpoints:{values:n.breakpoints},typography:{fontFamily:`"${r.fonts.FoundersGrotesk.name}", "Helvetica", "sans-serif"`},components:{MuiTypography:{variants:i.typographyVariants(d),styleOverrides:{root:{color:o.semantic[p].text.primary,letterSpacing:0,lineHeight:"140%"}}},MuiCssBaseline:{styleOverrides:t=>`\n\t\t\t\t\tbody {\n\t\t\t\t\t\tbackground: ${t.custom.palette.body};\n\t\t\t\t\t\tmin-width: 320px;\n\t\t\t\t\t}\n\t\t\t\t\ta {\n\t\t\t\t\t\tcolor: inherit;\n\t\t\t\t\t\tdisplay: flex;\n\t\t\t\t\t\ttext-decoration: none;\n\t\t\t\t\t}\n\t\t\t\t\tb {\n\t\t\t\t\t\tfont-weight: 500;\n\t\t\t\t\t}\n @font-face {\n font-family: '${r.fonts.Domaine.name}';\n font-style: normal;\n font-display: swap;\n font-weight: ${r.fonts.Domaine.default.weight};\n src: url(${s}${r.fonts.Domaine.default.fileName}) format('woff2');\n }\n @font-face {\n font-family: '${r.fonts.Domaine.name}';\n font-style: normal;\n font-display: swap;\n font-weight: ${r.fonts.Domaine.bold.weight};\n src: url(${s}${r.fonts.Domaine.bold.fileName}) format('woff2');\n }\n @font-face {\n font-family: '${r.fonts.FoundersGrotesk.name}';\n font-style: normal;\n font-display: swap;\n font-weight: ${r.fonts.FoundersGrotesk.default.weight};\n src: url(${s}${r.fonts.FoundersGrotesk.default.fileName}) format('woff2');\n }\n @font-face {\n font-family: '${r.fonts.FoundersGrotesk.name}';\n font-style: normal;\n font-display: swap;\n font-weight: ${r.fonts.FoundersGrotesk.bold.weight};\n src: url(${s}${r.fonts.FoundersGrotesk.bold.fileName}) format('woff2');\n }\n `},MuiContainer:{defaultProps:{maxWidth:"xl",disableGutters:!0},styleOverrides:{root:{paddingLeft:16,paddingRight:16,[`@media (min-width: ${n.breakpoints.md}px)`]:{paddingLeft:24,paddingRight:24},[`@media (min-width: ${n.breakpoints.lg}px)`]:{paddingLeft:48,paddingRight:48}}}},MuiButtonBase:{defaultProps:{disableTouchRipple:!0,disableRipple:!0}},MuiButton:{defaultProps:{disableTouchRipple:!0,disableRipple:!0}},MuiTooltip:{styleOverrides:{arrow:({theme:{custom:t}})=>({color:t.palette.surface.overlay}),tooltip:({theme:{custom:t}})=>({backgroundColor:t.palette.surface.overlay,borderRadius:t.radius.md,color:t.palette.text.primary,backdropFilter:"blur(0)",filter:t.elevationFilter.overlay,fontFamily:r.fonts.FoundersGrotesk.name,fontSize:t.typography.body.sm,fontWeight:400,padding:`${t.padding.sm*n.base}px ${t.padding.md*n.base}px`})}},MuiAvatarGroup:{styleOverrides:{root:{flexDirection:"row"},avatar:({theme:{custom:t}})=>({border:`1px solid ${t.palette.stroke.default}`,marginLeft:0,marginRight:-8,":last-child":{marginLeft:"auto"}})}},MuiPaper:{styleOverrides:{root:({theme:{custom:t}})=>({backgroundColor:t.palette.surface.default})}}}});
|