@useloops/design-system 1.4.602 → 1.4.603
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/WebCore/Label.d.ts +2 -1
- package/dist/WebCore.d.ts +2 -1
- package/dist/esm/systems/Marketing/PlanTierCard/PlanTierCard.js +1 -1
- package/dist/esm/systems/WebCore/Label/StyledLabel.js +1 -1
- package/dist/esm/systems/WebCore/Label/helpers.js +1 -0
- package/dist/index.d.ts +2 -1
- package/dist/systems/Marketing/PlanTierCard/PlanTierCard.js +1 -1
- package/dist/systems/Platform/TestItem/TestItem.d.ts +1 -1
- package/dist/systems/WebCore/Label/Label.d.ts +1 -5
- package/dist/systems/WebCore/Label/StyledLabel.js +1 -1
- package/dist/systems/WebCore/Label/helpers.js +1 -0
- package/dist/systems/WebCore/Label/types.d.ts +14 -0
- package/package.json +1 -1
- package/dist/systems/WebCore/Label/StyledLabel.d.ts +0 -8
package/dist/WebCore/Label.d.ts
CHANGED
|
@@ -1 +1,2 @@
|
|
|
1
|
-
export {
|
|
1
|
+
export { default } from '../systems/WebCore/Label/Label.js';
|
|
2
|
+
export { LabelProps } from '../systems/WebCore/Label/types.js';
|
package/dist/WebCore.d.ts
CHANGED
|
@@ -41,7 +41,8 @@ export { default as InputFieldBase, InputFieldBaseProps } from './systems/WebCor
|
|
|
41
41
|
export { default as InputLabel, InputLabelProps } from './systems/WebCore/InputLabel/InputLabel.js';
|
|
42
42
|
export { default as InputLabelHelp, InputLabelHelpProps } from './systems/WebCore/InputLabelHelp/InputLabelHelp.js';
|
|
43
43
|
export { default as KeyValueLabel, KeyValueLabelProps } from './systems/WebCore/KeyValueLabel/KeyValueLabel.js';
|
|
44
|
-
export { default as Label
|
|
44
|
+
export { default as Label } from './systems/WebCore/Label/Label.js';
|
|
45
|
+
export { LabelProps } from './systems/WebCore/Label/types.js';
|
|
45
46
|
export { default as Likert, LikertProps } from './systems/WebCore/Likert/Likert.js';
|
|
46
47
|
export { default as Link, LinkProps } from './systems/WebCore/Link/Link.js';
|
|
47
48
|
export { default as Loader, LoaderProps } from './systems/WebCore/Loader/Loader.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as r}from"react/jsx-runtime";import{useTheme as o}from"@mui/material";import{useRef as t,useEffect as i,startTransition as a}from"react";import{useBreakpoint as n}from"../../../utils/breakpoint.hook.js";import{useScreenSize as s}from"../../../utils/screen.hook.js";import"
|
|
1
|
+
import{jsx as e,jsxs as r}from"react/jsx-runtime";import{useTheme as o}from"@mui/material";import{useRef as t,useEffect as i,startTransition as a}from"react";import{useBreakpoint as n}from"../../../utils/breakpoint.hook.js";import{useScreenSize as s}from"../../../utils/screen.hook.js";import"../../../utils/formValidation/misc.js";import"../../BrandCore/Icon/Icon.js";import"../../BrandCore/primitiveVariables.js";import"../../WebCore/utils/typography.util.js";import"../../WebCore/AnnualController/AnnualController.js";import"../../WebCore/Accordion/Accordion.js";import l from"../../WebCore/Typography/Typography.js";import"merge-sx";import"../../WebCore/Badge/Badge.js";import"../../WebCore/Breadcrumb/Breadcrumb.js";import p from"../../WebCore/Button/Button.js";import"../../WebCore/ButtonBase/ButtonBase.js";import"../../WebCore/Checkbox/StyledCheckbox.js";import"../../WebCore/InputFieldBase/InputFieldBase.js";import"../../WebCore/CreatableAutocomplete/CreatableAutocomplete.js";import"@mui/icons-material";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/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"../../WebCore/Image/Image.js";import"../../WebCore/KeyValueLabel/KeyValueLabel.js";import m from"../../WebCore/Label/Label.js";import"../../WebCore/Likert/LikertContainer.js";import"../../WebCore/Likert/LikertLabel.js";import"../../WebCore/Likert/LikertRadio.js";import d from"../../WebCore/Link/Link.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"../../WebCore/Progress/Progress.js";import"../../WebCore/Pill/StyledPill.js";import"../../WebCore/ProgressBar/ProgressBar.js";import"../../WebCore/Radio/StyledRadio.js";import"../../WebCore/utils/autocomplete.styles.js";import"../../WebCore/Select/AutocompleteListbox.js";import"../../WebCore/Select/StyledAutocomplete.js";import"../../WebCore/Select/SelectItem.js";import"../../WebCore/Select/StyledSelect.js";import"../../WebCore/RankItem/RankItemContainer.js";import"../../WebCore/RankItem/RankItemLabel.js";import"../../WebCore/SortableList/SortableList.js";import"../../WebCore/SortableList/components/SortableItem/SortableItem.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 b from"./FeatureListItem.js";import c from"./PlanTierCardContainers.js";import C from"./PlanTierCardSkeleton.js";import u from"./RespondentPricingCard.js";import j from"./SavingsPill.js";const h=({amount:h,billingType:W,body:g,bordered:f,ctaEvent:y=()=>{},ctaLink:B="#",ctaTarget:S="_self",ctaText:k,ctaVariation:L="primary",currencySymbol:I,currentPlan:x,featuresHeading:T,features:v=[],featuresIcon:H,heading:P,label:R,loading:F,respondentsTitle:M,respondentsFeatures:A,respondentsFeaturesIcon:w,saving:V,sectionHeights:E,updateSectionHeight:G,syncHeightsOnBreakpoints:N})=>{const D=o(),O=n(),{width:_}=s(),z=t(null),K=t(null),U=t(null),$=t(null);return F?e(C,{}):(i(()=>{a(()=>{if(E&&G){const e=[{ref:z,key:"headerHeight"},{ref:K,key:"bodyHeight"},{ref:U,key:"respondentCardHeight"},{ref:$,key:"bottomHeight"}];N?.includes(O)?e.forEach(({ref:e,key:r})=>{e.current?.offsetHeight&&e.current.offsetHeight>E[r]&&G(r,e.current.offsetHeight)}):e.forEach(({key:e})=>{0!==E[e]&&G(e,0)})}})},[O,N,_,G]),r(c.PlanTierCard,{bordered:f,children:[r(c.Top,{children:[r(c.Head,{ref:z,height:E?.headerHeight,children:[r(c.PlanTitle,{children:[e(l,{variation:"lg",component:"h1",weight:"bold",children:P}),R&&e(m,{body:R,weight:"heavy",sizing:"xxs",colorScheme:"purple",tone:900})]}),r(c.Billing,{children:[e(c.Price,{children:r(l,{variation:"xxl",component:"p",weight:"bold",children:[I,h]})}),W&&e(l,{variation:"sm",component:"p",sx:{color:D.custom.palette.text.secondary},children:W})]}),V&&e(j,{body:V,weight:"heavy"})]}),e(c.Body,{ref:K,height:E?.bodyHeight,children:g}),M&&e(u,{ref:U,height:E?.respondentCardHeight,respondentsTitle:M,respondentsFeatures:A,featuresIcon:w})]}),r(c.Bottom,{ref:$,height:E?.bottomHeight,children:[v?.length&&r(c.FeatureList,{children:[T&&e(l,{component:"p",variation:"sm",weight:"bold",mr:"auto",children:T}),v.map((r,o)=>e(b,{feature:r,featuresIcon:H},`${P}-feature-${o}`))]}),!x&&e(d,{href:B,title:k,target:S,onClick:()=>{P&&y(P)},sx:{"&:hover":{cursor:"pointer"}},children:e(p,{fullWidth:!0,variation:L,sizing:"lg",disabled:x,children:k})})]})]}))};export{h as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{styled as
|
|
1
|
+
import{styled as i,Chip as t}from"@mui/material";import{fontSizemap as o}from"../utils/typography.util.js";import{getWeightStyle as e,getVariationStyle as n,getIconSizing as m,getTextPadding as r,getBorderStyle as s}from"./helpers.js";const a=i(t,{shouldForwardProp:i=>!["colorScheme","weight","tone","sizing"].includes(i)})(({theme:i,colorScheme:t,weight:a,tone:c,sizing:d})=>({...n(i,t,c),...s(i,t,c),height:"fit-content",width:"fit-content",maxWidth:"fit-content",padding:`${i.spacing(i.custom.padding.xs)} ${i.spacing(i.custom.padding.sm)}`,borderRadius:i.spacing(i.custom.radius.md),"& .MuiChip-label":{fontSize:o[d||"md"],fontVariantNumeric:"tabular-nums",...r(i,d),...e(a)},"& .MuiChip-icon":{width:"0.8em",height:"0.8em",marginRight:i.spacing(i.custom.padding.xs),marginLeft:0,...m(d),...n(i,t,c),...e(a)}}));export{a as StyledLabel};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{base as t}from"../../BrandCore/primitiveVariables.js";const e=[0,100,500,900],s={xxs:1.5*t,xs:2*t,sm:2*t,md:2*t,lg:2.5*t,xl:3*t,xxl:3.5*t},o=t=>({height:s[t],width:s[t]}),a=(t,e)=>{switch(e){case"xxs":case"xs":case"sm":case"md":return{paddingLeft:0,paddingRight:0};default:return{paddingLeft:t.spacing(t.custom.padding.xs),paddingRight:t.spacing(t.custom.padding.xs)}}},r=t=>({backgroundColor:t.custom.palette.neutral[0],color:t.custom.palette.neutral[1e3]}),n=(t,s,o)=>{const a=e.includes(o)?500===o?100:o:0;return{backgroundColor:t.custom.palette[s][a],color:t.custom.palette[s][a>500?0:1e3]}},c=(t,s,o)=>{const a=e.includes(o)?o+100:100,r=s||"neutral";return{border:`1px solid ${t.custom.palette[r][a]}`}},d=(t,e,s)=>void 0===e?r(t):n(t,e,s),i=t=>"heavy"===t?{fontWeight:500,textTransform:"uppercase"}:{fontWeight:400};export{c as getBorderStyle,n as getColorStyle,r as getDefaultStyle,o as getIconSizing,a as getTextPadding,d as getVariationStyle,i as getWeightStyle,s as iconSizeMap};
|
package/dist/index.d.ts
CHANGED
|
@@ -107,7 +107,8 @@ export { default as InputFieldBase, InputFieldBaseProps } from './systems/WebCor
|
|
|
107
107
|
export { default as InputLabel, InputLabelProps } from './systems/WebCore/InputLabel/InputLabel.js';
|
|
108
108
|
export { default as InputLabelHelp, InputLabelHelpProps } from './systems/WebCore/InputLabelHelp/InputLabelHelp.js';
|
|
109
109
|
export { default as KeyValueLabel, KeyValueLabelProps } from './systems/WebCore/KeyValueLabel/KeyValueLabel.js';
|
|
110
|
-
export { default as Label
|
|
110
|
+
export { default as Label } from './systems/WebCore/Label/Label.js';
|
|
111
|
+
export { LabelProps } from './systems/WebCore/Label/types.js';
|
|
111
112
|
export { default as Likert, LikertProps } from './systems/WebCore/Likert/Likert.js';
|
|
112
113
|
export { default as Link, LinkProps } from './systems/WebCore/Link/Link.js';
|
|
113
114
|
export { default as Loader, LoaderProps } from './systems/WebCore/Loader/Loader.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var e=require("react/jsx-runtime"),r=require("@mui/material"),t=require("react"),i=require("../../../utils/breakpoint.hook.js"),o=require("../../../utils/screen.hook.js");require("
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),r=require("@mui/material"),t=require("react"),i=require("../../../utils/breakpoint.hook.js"),o=require("../../../utils/screen.hook.js");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 a=require("../../WebCore/Typography/Typography.js");require("merge-sx"),require("../../WebCore/Badge/Badge.js"),require("../../WebCore/Breadcrumb/Breadcrumb.js");var s=require("../../WebCore/Button/Button.js");require("../../WebCore/ButtonBase/ButtonBase.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/KeyValueLabel/KeyValueLabel.js");var u=require("../../WebCore/Label/Label.js");require("../../WebCore/Likert/LikertContainer.js"),require("../../WebCore/Likert/LikertLabel.js"),require("../../WebCore/Likert/LikertRadio.js");var n=require("../../WebCore/Link/Link.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/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"),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 l=require("./FeatureListItem.js"),d=require("./PlanTierCardContainers.js"),b=require("./PlanTierCardSkeleton.js"),c=require("./RespondentPricingCard.js"),j=require("./SavingsPill.js");module.exports=({amount:C,billingType:q,body:p,bordered:h,ctaEvent:W=()=>{},ctaLink:g="#",ctaTarget:m="_self",ctaText:f,ctaVariation:y="primary",currencySymbol:x,currentPlan:B,featuresHeading:S,features:k=[],featuresIcon:L,heading:I,label:v,loading:T,respondentsTitle:R,respondentsFeatures:H,respondentsFeaturesIcon:P,saving:F,sectionHeights:M,updateSectionHeight:A,syncHeightsOnBreakpoints:w})=>{const E=r.useTheme(),V=i.useBreakpoint(),{width:G}=o.useScreenSize(),N=t.useRef(null),D=t.useRef(null),O=t.useRef(null),z=t.useRef(null);return T?e.jsx(b,{}):(t.useEffect(()=>{t.startTransition(()=>{if(M&&A){const e=[{ref:N,key:"headerHeight"},{ref:D,key:"bodyHeight"},{ref:O,key:"respondentCardHeight"},{ref:z,key:"bottomHeight"}];w?.includes(V)?e.forEach(({ref:e,key:r})=>{e.current?.offsetHeight&&e.current.offsetHeight>M[r]&&A(r,e.current.offsetHeight)}):e.forEach(({key:e})=>{0!==M[e]&&A(e,0)})}})},[V,w,G,A]),e.jsxs(d.default.PlanTierCard,{bordered:h,children:[e.jsxs(d.default.Top,{children:[e.jsxs(d.default.Head,{ref:N,height:M?.headerHeight,children:[e.jsxs(d.default.PlanTitle,{children:[e.jsx(a,{variation:"lg",component:"h1",weight:"bold",children:I}),v&&e.jsx(u,{body:v,weight:"heavy",sizing:"xxs",colorScheme:"purple",tone:900})]}),e.jsxs(d.default.Billing,{children:[e.jsx(d.default.Price,{children:e.jsxs(a,{variation:"xxl",component:"p",weight:"bold",children:[x,C]})}),q&&e.jsx(a,{variation:"sm",component:"p",sx:{color:E.custom.palette.text.secondary},children:q})]}),F&&e.jsx(j,{body:F,weight:"heavy"})]}),e.jsx(d.default.Body,{ref:D,height:M?.bodyHeight,children:p}),R&&e.jsx(c,{ref:O,height:M?.respondentCardHeight,respondentsTitle:R,respondentsFeatures:H,featuresIcon:P})]}),e.jsxs(d.default.Bottom,{ref:z,height:M?.bottomHeight,children:[k?.length&&e.jsxs(d.default.FeatureList,{children:[S&&e.jsx(a,{component:"p",variation:"sm",weight:"bold",mr:"auto",children:S}),k.map((r,t)=>e.jsx(l,{feature:r,featuresIcon:L},`${I}-feature-${t}`))]}),!B&&e.jsx(n,{href:g,title:f,target:m,onClick:()=>{I&&W(I)},sx:{"&:hover":{cursor:"pointer"}},children:e.jsx(s,{fullWidth:!0,variation:y,sizing:"lg",disabled:B,children:f})})]})]}))};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import react__default from 'react';
|
|
2
2
|
import { IconButtonProps } from '../../WebCore/IconButton/IconButton.js';
|
|
3
|
-
import { LabelProps } from '../../WebCore/Label/
|
|
3
|
+
import { LabelProps } from '../../WebCore/Label/types.js';
|
|
4
4
|
import { MenuProps } from '../../WebCore/Menu/Menu.js';
|
|
5
5
|
import { SurfaceProps } from '../../WebCore/Surface/Surface.js';
|
|
6
6
|
import { TypographyProps } from '../../WebCore/Typography/Typography.js';
|
|
@@ -1,10 +1,6 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { LabelProps } from './types.js';
|
|
3
3
|
|
|
4
|
-
interface LabelProps extends Omit<StyledChipProps, 'size' | 'color' | 'label' | 'children'> {
|
|
5
|
-
body: string;
|
|
6
|
-
}
|
|
7
4
|
declare const Label: react.ForwardRefExoticComponent<Omit<LabelProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
|
|
8
5
|
|
|
9
6
|
export { Label as default };
|
|
10
|
-
export type { LabelProps };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var t=require("@mui/material"),i=require("../utils/typography.util.js"),e=require("./helpers.js");const n=t.styled(t.Chip,{shouldForwardProp:t=>!["colorScheme","weight","tone","sizing"].includes(t)})(({theme:t,colorScheme:n,weight:a,tone:g,sizing:r})=>({...e.getVariationStyle(t,n,g),...e.getBorderStyle(t,n,g),height:"fit-content",width:"fit-content",maxWidth:"fit-content",padding:`${t.spacing(t.custom.padding.xs)} ${t.spacing(t.custom.padding.sm)}`,borderRadius:t.spacing(t.custom.radius.md),"& .MuiChip-label":{fontSize:i.fontSizemap[r||"md"],fontVariantNumeric:"tabular-nums",...e.getTextPadding(t,r),...e.getWeightStyle(a)},"& .MuiChip-icon":{width:"0.8em",height:"0.8em",marginRight:t.spacing(t.custom.padding.xs),marginLeft:0,...e.getIconSizing(r),...e.getVariationStyle(t,n,g),...e.getWeightStyle(a)}}));exports.StyledLabel=n;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";var e=require("../../BrandCore/primitiveVariables.js");const t=[0,100,500,900],s={xxs:1.5*e.base,xs:2*e.base,sm:2*e.base,md:2*e.base,lg:2.5*e.base,xl:3*e.base,xxl:3.5*e.base},a=e=>({backgroundColor:e.custom.palette.neutral[0],color:e.custom.palette.neutral[1e3]}),r=(e,s,a)=>{const r=t.includes(a)?500===a?100:a:0;return{backgroundColor:e.custom.palette[s][r],color:e.custom.palette[s][r>500?0:1e3]}};exports.getBorderStyle=(e,s,a)=>{const r=t.includes(a)?a+100:100,o=s||"neutral";return{border:`1px solid ${e.custom.palette[o][r]}`}},exports.getColorStyle=r,exports.getDefaultStyle=a,exports.getIconSizing=e=>({height:s[e],width:s[e]}),exports.getTextPadding=(e,t)=>{switch(t){case"xxs":case"xs":case"sm":case"md":return{paddingLeft:0,paddingRight:0};default:return{paddingLeft:e.spacing(e.custom.padding.xs),paddingRight:e.spacing(e.custom.padding.xs)}}},exports.getVariationStyle=(e,t,s)=>void 0===t?a(e):r(e,t,s),exports.getWeightStyle=e=>"heavy"===e?{fontWeight:500,textTransform:"uppercase"}:{fontWeight:400},exports.iconSizeMap=s;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { ChipProps } from '@mui/material';
|
|
2
|
+
|
|
3
|
+
type ToneChoices = 0 | 100 | 500 | 900;
|
|
4
|
+
interface StyledLabelProps extends Pick<ChipProps, 'ref' | 'classes' | 'sx' | 'icon' | 'className' | 'label'> {
|
|
5
|
+
colorScheme?: 'neutral' | 'purple' | 'red' | 'peach' | 'yellow' | 'blue' | 'green';
|
|
6
|
+
tone?: ToneChoices;
|
|
7
|
+
weight?: 'heavy' | 'light';
|
|
8
|
+
sizing?: 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
|
|
9
|
+
}
|
|
10
|
+
interface LabelProps extends Omit<StyledLabelProps, 'children' | 'label'> {
|
|
11
|
+
body: string;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
export type { LabelProps, StyledLabelProps, ToneChoices };
|
package/package.json
CHANGED