@useloops/design-system 1.4.566 → 1.4.567

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.
@@ -1 +1 @@
1
- import{createTheme as t}from"@mui/material";import{greenRamp as e,blueRamp as o,yellowRamp as a,peachRamp as n,redRamp as r,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 f,base as m,easing as u,boxShadow as y,elevationFilter as c,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://useloops-public.s3.eu-west-2.amazonaws.com/public/fonts/",C=(C,R,G)=>t({direction:G,custom:{palette:{black:"#000000",white:"#ffffff",neutral:s[C],neutralAlpha:"light"===C?d:p,purple:i[C],red:r[C],peach:n[C],yellow:a[C],blue:o[C],green:e[C],icon:$[C].icon,interaction:$[C].interaction,stroke:$[C].stroke,surface:$[C].surface,text:$[C].text,input:$[C].input,skeleton:$[C].skeleton,data:$[C].data,body:$[C].surface.default},margin:w,padding:b,radius:h,elevation:g,elevationFilter:c,boxShadow:y,easing:u,typography:x[R]},palette:{mode:C,primary:{main:l[500]}},spacing:m,shape:{borderRadius:m,hotspot:{default:12,active:24}},breakpoints:{values:f},typography:{fontFamily:`"${v.FoundersGrotesk.name}", "Helvetica", "sans-serif"`},components:{MuiTypography:{variants:k(R),styleOverrides:{root:{color:$[C].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: ${f.md}px)`]:{paddingLeft:24,paddingRight:24},[`@media (min-width: ${f.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*m}px ${t.padding.md*m}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"}})}}}});export{C as customTheme};
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 f,base as m,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://useloops-public.s3.eu-west-2.amazonaws.com/public/fonts/",C=(C,R,G)=>t({direction:G,custom:{palette:{black:"#000000",white:"#ffffff",neutral:s[C],neutralAlpha:"light"===C?d:p,purple:i[C],red:n[C],peach:r[C],yellow:a[C],blue:o[C],green:e[C],icon:$[C].icon,interaction:$[C].interaction,stroke:$[C].stroke,surface:$[C].surface,text:$[C].text,input:$[C].input,skeleton:$[C].skeleton,data:$[C].data,body:$[C].surface.default},margin:w,padding:b,radius:h,elevation:g,elevationFilter:y,boxShadow:c,easing:u,typography:x[R]},palette:{mode:C,primary:{main:l[500]}},spacing:m,shape:{borderRadius:m,hotspot:{default:12,active:24}},breakpoints:{values:f},typography:{fontFamily:`"${v.FoundersGrotesk.name}", "Helvetica", "sans-serif"`},components:{MuiTypography:{variants:k(R),styleOverrides:{root:{color:$[C].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: ${f.md}px)`]:{paddingLeft:24,paddingRight:24},[`@media (min-width: ${f.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*m}px ${t.padding.md*m}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{C as customTheme};
@@ -6,7 +6,7 @@ import { TextFieldProps } from '@mui/material';
6
6
  type InputFieldBaseProps = TextFieldProps;
7
7
  declare const InputFieldBase: _emotion_styled.StyledComponent<{
8
8
  variant?: _mui_material.TextFieldVariants | undefined;
9
- } & Omit<_mui_material.FilledTextFieldProps | _mui_material.OutlinedTextFieldProps | _mui_material.StandardTextFieldProps, "variant"> & (_mui_system.MUIStyledCommonProps<_mui_material.Theme> & InputFieldBaseProps), {}, {}>;
9
+ } & Omit<_mui_material.OutlinedTextFieldProps | _mui_material.FilledTextFieldProps | _mui_material.StandardTextFieldProps, "variant"> & (_mui_system.MUIStyledCommonProps<_mui_material.Theme> & InputFieldBaseProps), {}, {}>;
10
10
 
11
11
  export { InputFieldBase as default };
12
12
  export type { InputFieldBaseProps };
@@ -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://useloops-public.s3.eu-west-2.amazonaws.com/public/fonts/";exports.customTheme=(l,p,d)=>t.createTheme({direction:d,custom:{palette:{black:"#000000",white:"#ffffff",neutral:e.neutralRamp[l],neutralAlpha:"light"===l?a.neutralAlpha:a.darkNeutralAlpha,purple:e.purpleRamp[l],red:e.redRamp[l],peach:e.peachRamp[l],yellow:e.yellowRamp[l],blue:e.blueRamp[l],green:e.greenRamp[l],icon:o.semantic[l].icon,interaction:o.semantic[l].interaction,stroke:o.semantic[l].stroke,surface:o.semantic[l].surface,text:o.semantic[l].text,input:o.semantic[l].input,skeleton:o.semantic[l].skeleton,data:o.semantic[l].data,body:o.semantic[l].surface.default},margin:n.margin,padding:n.padding,radius:n.radius,elevation:n.elevation,elevationFilter:n.elevationFilter,boxShadow:n.boxShadow,easing:n.easing,typography:i.typographyVariantMap[p]},palette:{mode:l,primary:{main:a.purple[500]}},spacing:n.base,shape:{borderRadius:n.base,hotspot:{default:12,active:24}},breakpoints:{values:n.breakpoints},typography:{fontFamily:`"${r.fonts.FoundersGrotesk.name}", "Helvetica", "sans-serif"`},components:{MuiTypography:{variants:i.typographyVariants(p),styleOverrides:{root:{color:o.semantic[l].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"}})}}}});
1
+ "use strict";var t=require("@mui/material"),e=require("../systems/BrandCore/colorRamps.js"),a=require("../systems/BrandCore/primitiveColor.js"),o=require("../systems/BrandCore/primitiveVariables.js"),n=require("../systems/BrandCore/semanticColor.js"),r=require("../systems/BrandCore/typography.js"),i=require("../systems/WebCore/utils/typography.util.js");const s="https://useloops-public.s3.eu-west-2.amazonaws.com/public/fonts/";exports.customTheme=(l,p,d)=>t.createTheme({direction:d,custom:{palette:{black:"#000000",white:"#ffffff",neutral:e.neutralRamp[l],neutralAlpha:"light"===l?a.neutralAlpha:a.darkNeutralAlpha,purple:e.purpleRamp[l],red:e.redRamp[l],peach:e.peachRamp[l],yellow:e.yellowRamp[l],blue:e.blueRamp[l],green:e.greenRamp[l],icon:n.semantic[l].icon,interaction:n.semantic[l].interaction,stroke:n.semantic[l].stroke,surface:n.semantic[l].surface,text:n.semantic[l].text,input:n.semantic[l].input,skeleton:n.semantic[l].skeleton,data:n.semantic[l].data,body:n.semantic[l].surface.default},margin:o.margin,padding:o.padding,radius:o.radius,elevation:o.elevation,elevationFilter:o.elevationFilter,boxShadow:o.boxShadow,easing:o.easing,typography:i.typographyVariantMap[p]},palette:{mode:l,primary:{main:a.purple[500]}},spacing:o.base,shape:{borderRadius:o.base,hotspot:{default:12,active:24}},breakpoints:{values:o.breakpoints},typography:{fontFamily:`"${r.fonts.FoundersGrotesk.name}", "Helvetica", "sans-serif"`},components:{MuiTypography:{variants:i.typographyVariants(p),styleOverrides:{root:{color:n.semantic[l].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: ${o.breakpoints.md}px)`]:{paddingLeft:24,paddingRight:24},[`@media (min-width: ${o.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*o.base}px ${t.padding.md*o.base}px`})}},MuiAvatarGroup:{styleOverrides:{root:{flexDirection:"row"},avatar:({theme:{custom:t}})=>({border:`1px solid ${t.palette.stroke.default}`,marginLeft:0,marginRight:-8,":last-child":{marginLeft:"auto"}})}},MuiPaper:{styleOverrides:{root:({theme:{custom:t}})=>({backgroundColor:t.palette.surface.default})}}}});
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@useloops/design-system",
3
- "version": "1.4.566",
3
+ "version": "1.4.567",
4
4
  "description": "The official React based Loops design system",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/esm/index.js",