@contentful/f36-badge 5.7.0 → 6.0.0-alpha.1
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/index.js +1 -11
- package/dist/esm/index.js.map +1 -1
- package/dist/index.d.mts +11 -11
- package/dist/index.d.ts +11 -11
- package/dist/index.js +1 -19
- package/dist/index.js.map +1 -1
- package/package.json +8 -9
package/dist/esm/index.js
CHANGED
|
@@ -1,12 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { cx, css } from 'emotion';
|
|
3
|
-
import { Box } from '@contentful/f36-core';
|
|
4
|
-
import a from '@contentful/f36-tokens';
|
|
5
|
-
import { useDensity, getIconColorToken, iconColorByVariant } from '@contentful/f36-utils';
|
|
6
|
-
import { ClockIcon } from '@contentful/f36-icons';
|
|
7
|
-
|
|
8
|
-
var K=Object.defineProperty,Q=Object.defineProperties;var ee=Object.getOwnPropertyDescriptors;var I=Object.getOwnPropertySymbols;var M=Object.prototype.hasOwnProperty,R=Object.prototype.propertyIsEnumerable;var k=(e,r,t)=>r in e?K(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,p=(e,r)=>{for(var t in r||(r={}))M.call(r,t)&&k(e,t,r[t]);if(I)for(var t of I(r))R.call(r,t)&&k(e,t,r[t]);return e},z=(e,r)=>Q(e,ee(r));var b=(e,r)=>{var t={};for(var o in e)M.call(e,o)&&r.indexOf(o)<0&&(t[o]=e[o]);if(e!=null&&I)for(var o of I(e))r.indexOf(o)<0&&R.call(e,o)&&(t[o]=e[o]);return t};var re=Object.defineProperty,oe=Object.defineProperties,ae=Object.getOwnPropertyDescriptors,C=Object.getOwnPropertySymbols,L=Object.prototype.hasOwnProperty,X=Object.prototype.propertyIsEnumerable,O=(e,r,t)=>r in e?re(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,h=(e,r)=>{for(var t in r||(r={}))L.call(r,t)&&O(e,t,r[t]);if(C)for(var t of C(r))X.call(r,t)&&O(e,t,r[t]);return e},u=(e,r)=>oe(e,ae(r)),y=(e,r)=>{var t={};for(var o in e)L.call(e,o)&&r.indexOf(o)<0&&(t[o]=e[o]);if(e!=null&&C)for(var o of C(e))r.indexOf(o)<0&&X.call(e,o)&&(t[o]=e[o]);return t},ie="span";function ne(){return css({overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",maxWidth:"100%"})}function se(){return css({wordBreak:"break-word"})}function V(e,r){let t=e,{fontSize:o="fontSizeM",fontStack:i="fontStackPrimary",fontWeight:s="fontWeightNormal",fontColor:d="gray800",lineHeight:n="lineHeightM",letterSpacing:l="letterSpacingDefault",children:g,isTruncated:f,isWordBreak:N,as:v,className:H,margin:x="none"}=t,Z=y(t,["fontSize","fontStack","fontWeight","fontColor","lineHeight","letterSpacing","children","isTruncated","isWordBreak","as","className","margin"]),_=v||ie;return c.createElement(Box,u(h({},Z),{as:_,className:cx(css({padding:0,fontFamily:a[i],fontWeight:a[s],color:a[d],fontSize:a[o],lineHeight:a[n],letterSpacing:a[l]}),f?ne():null,N?se():null,H),margin:x,ref:r}),g)}V.displayName="Text";var S=c.forwardRef(V),le="span";function j(e,r){var t=e,{children:o,fontWeight:i="fontWeightNormal",testId:s="cf-ui-caption",as:d,fontColor:n="gray900"}=t,l=y(t,["children","fontWeight","testId","as","fontColor"]);let g=useDensity();return c.createElement(S,u(h({as:d||le,testId:s,fontSize:g==="high"?"fontSizeSHigh":"fontSizeS",lineHeight:g==="high"?"lineHeightSHigh":"lineHeightS",fontColor:n,fontWeight:i},l),{ref:r}),o)}j.displayName="Caption";var U=c.forwardRef(j),de="h1";function $(e,r){var t=e,{children:o,testId:i="cf-ui-heading",as:s,fontColor:d="gray900",marginBottom:n="spacingM"}=t,l=y(t,["children","testId","as","fontColor","marginBottom"]);let g=useDensity();return c.createElement(S,u(h({as:s||de,testId:i,marginBottom:n,fontWeight:"fontWeightDemiBold",fontColor:d,fontSize:g==="high"?"fontSizeXlHigh":"fontSizeXl",lineHeight:g==="high"?"lineHeightXlHigh":"lineHeightXl"},l),{ref:r}),o)}$.displayName="Heading";c.forwardRef($);var ge="h3";function A(e,r){var t=e,{children:o,testId:i="cf-ui-subheading",as:s,fontColor:d="gray900"}=t,n=y(t,["children","testId","as","fontColor"]);let l=useDensity();return c.createElement(S,u(h({as:s||ge,testId:i,marginBottom:"spacingM",fontSize:l==="high"?"fontSizeLHigh":"fontSizeL",lineHeight:l==="high"?"lineHeightLHigh":"lineHeightL",fontWeight:"fontWeightDemiBold",fontColor:d},n),{ref:r}),o)}A.displayName="Subheading";c.forwardRef(A);var ce="h2";function F(e,r){var t=e,{children:o,size:i="default",testId:s="cf-ui-display-text",as:d,fontColor:n="gray900"}=t,l=y(t,["children","size","testId","as","fontColor"]);let g="fontSize2Xl",f="lineHeightXl";return i==="large"&&(g="fontSize3Xl",f="lineHeight3Xl"),c.createElement(S,u(h({as:d||ce,testId:s,marginBottom:i==="default"?"spacingL":"spacingXl",fontSize:g,lineHeight:f,fontColor:n,fontWeight:"fontWeightDemiBold"},l),{ref:r}),o)}F.displayName="DisplayText";c.forwardRef(F);var fe="h2";function G(e,r){var t=e,{children:o,className:i,testId:s="cf-ui-section-heading",as:d,fontColor:n="gray600",marginBottom:l="spacingL"}=t,g=y(t,["children","className","testId","as","fontColor","marginBottom"]);let f=useDensity();return c.createElement(S,u(h({as:d||fe,testId:s,marginBottom:l,fontWeight:"fontWeightMedium",fontColor:n,fontSize:f==="high"?"fontSizeSHigh":"fontSizeS",lineHeight:f==="high"?"lineHeightSHigh":"lineHeightS",className:cx(css({letterSpacing:a.letterSpacingDefault}),i)},g),{ref:r}),o)}G.displayName="SectionHeading";c.forwardRef(G);var pe=c.forwardRef((e,r)=>{var t=e,{children:o,testId:i="cf-ui-paragraph",marginBottom:s="spacingM"}=t,d=y(t,["children","testId","marginBottom"]);let n=useDensity();return c.createElement(S,u(h({as:"p",testId:i,fontSize:n==="high"?"fontSizeMHigh":"fontSizeM",lineHeight:n==="high"?"lineHeightMHigh":"lineHeightM",marginBottom:s},d),{ref:r}),o)});pe.displayName="Paragraph";var me=({variant:e})=>{switch(e){case"positive":return {color:a.green600,backgroundColor:a.green200};case"primary":return {color:a.blue600,backgroundColor:a.blue200};case"negative":return {color:a.red600,backgroundColor:a.red200};case"warning":return {color:a.orange600,backgroundColor:a.orange200};case"secondary":return {color:a.gray700,backgroundColor:a.gray200};case"primary-filled":return {color:a.colorWhite,backgroundColor:a.blue600};case"featured":return {color:a.purple600,backgroundColor:a.purple200};default:return {}}},he=({size:e})=>{switch(e){case"small":return {padding:`0 ${a.spacing2Xs}`,lineHeight:a.lineHeightS,maxHeight:a.lineHeightS};default:return {padding:`0 ${a.spacingXs}`,lineHeight:a.lineHeightM,maxHeight:a.lineHeightM}}},q=()=>({badge:({variant:e,size:r})=>css(p(p({columnGap:a.spacing2Xs,alignItems:"center",borderRadius:a.borderRadiusSmall,overflow:"hidden",verticalAlign:"middle"},me({variant:e})),he({size:r}))),badgeIcon:css({flexShrink:0}),badgeIconCustomTiny:css({width:"0.875rem",height:"0.875rem"}),badgeText:({textTransform:e})=>css([{color:"currentcolor",lineHeight:"inherit"},e!=="none"&&{textTransform:"lowercase","&::first-letter":{textTransform:"uppercase"}}])});var w=c.forwardRef((e,r)=>{let t=q(),H=e,{children:o,variant:i="primary",size:s="default",testId:d="cf-ui-badge",startIcon:n,endIcon:l,className:g,textTransform:f=void 0}=H,N=b(H,["children","variant","size","testId","startIcon","endIcon","className","textTransform"]),v=x=>c.cloneElement(x,{size:"tiny",className:cx(t.badgeIcon,x.props.className,{[t.badgeIconCustomTiny]:s==="small"}),color:a[getIconColorToken(i,iconColorByVariant)]});return c.createElement(Box,z(p({as:"div",testId:d,display:"inline-flex",className:cx(t.badge({variant:i,size:s}),g)},N),{ref:r}),n&&v(n),c.createElement(U,{fontWeight:"fontWeightMedium",isTruncated:!0,className:t.badgeText({textTransform:f})},o),l&&v(l))});w.displayName="Badge";var He={published:"positive",draft:"warning",archived:"secondary",changed:"primary",deleted:"negative",new:"primary-filled"};function Y(e,r){let l=e,{entityStatus:t,isScheduled:o=void 0,size:i="default"}=l,s=b(l,["entityStatus","isScheduled","size"]),d=o&&i==="default",n=He[t];return c.createElement(w,z(p(p({},s),d?{size:i,startIcon:c.createElement(ClockIcon,{testId:"schedule-icon"})}:{size:i}),{variant:n,ref:r}),t)}Y.displayName="EntityStatusBadge";var xe=c.forwardRef(Y);
|
|
9
|
-
|
|
10
|
-
export { w as Badge, xe as EntityStatusBadge };
|
|
11
|
-
//# sourceMappingURL=out.js.map
|
|
1
|
+
import g from'react';import {css,cx}from'@emotion/css';import {Box}from'@contentful/f36-core';import o from'@contentful/f36-tokens';import'react-dom';import {ClockIcon}from'@contentful/f36-icons';var te=Object.defineProperty,re=Object.defineProperties;var ne=Object.getOwnPropertyDescriptors;var b=Object.getOwnPropertySymbols;var R=Object.prototype.hasOwnProperty,M=Object.prototype.propertyIsEnumerable;var W=(e,r,t)=>r in e?te(e,r,{enumerable:true,configurable:true,writable:true,value:t}):e[r]=t,p=(e,r)=>{for(var t in r||(r={}))R.call(r,t)&&W(e,t,r[t]);if(b)for(var t of b(r))M.call(r,t)&&W(e,t,r[t]);return e},I=(e,r)=>re(e,ne(r));var C=(e,r)=>{var t={};for(var n in e)R.call(e,n)&&r.indexOf(n)<0&&(t[n]=e[n]);if(e!=null&&b)for(var n of b(e))r.indexOf(n)<0&&M.call(e,n)&&(t[n]=e[n]);return t};var O=g.createContext("low"),S=()=>g.useContext(O);O.Provider;var oe=Object.defineProperty,ie=Object.defineProperties,se=Object.getOwnPropertyDescriptors,P=Object.getOwnPropertySymbols,$=Object.prototype.hasOwnProperty,j=Object.prototype.propertyIsEnumerable,L=(e,r,t)=>r in e?oe(e,r,{enumerable:true,configurable:true,writable:true,value:t}):e[r]=t,u=(e,r)=>{for(var t in r||(r={}))$.call(r,t)&&L(e,t,r[t]);if(P)for(var t of P(r))j.call(r,t)&&L(e,t,r[t]);return e},h=(e,r)=>ie(e,se(r)),y=(e,r)=>{var t={};for(var n in e)$.call(e,n)&&r.indexOf(n)<0&&(t[n]=e[n]);if(e!=null&&P)for(var n of P(e))r.indexOf(n)<0&&j.call(e,n)&&(t[n]=e[n]);return t},le="span";function de(){return css({overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",maxWidth:"100%"})}function ce(){return css({wordBreak:"break-word"})}function V(e,r){let t=e,{fontSize:n="fontSizeM",fontStack:a="fontStackPrimary",fontWeight:s="fontWeightNormal",fontColor:d="gray800",lineHeight:i="lineHeightM",letterSpacing:l="letterSpacingDefault",children:c,isTruncated:f,isWordBreak:k,as:v,className:x,margin:H="none",testId:Q="cf-ui-text"}=t,_=y(t,["fontSize","fontStack","fontWeight","fontColor","lineHeight","letterSpacing","children","isTruncated","isWordBreak","as","className","margin","testId"]),ee=v||le;return g.createElement(Box,h(u({},_),{as:ee,testId:Q,className:cx(css({padding:0,fontFamily:o[a],fontWeight:o[s],color:o[d],fontSize:o[n],lineHeight:o[i],letterSpacing:o[l]}),f?de():null,k?ce():null,x),margin:H,ref:r}),c)}V.displayName="Text";var B=g.forwardRef(V),ge="span";function A(e,r){var t=e,{children:n,fontWeight:a="fontWeightNormal",testId:s="cf-ui-caption",as:d,fontColor:i="gray900"}=t,l=y(t,["children","fontWeight","testId","as","fontColor"]);let c=S();return g.createElement(B,h(u({as:d||ge,testId:s,fontSize:c==="high"?"fontSizeSHigh":"fontSizeS",lineHeight:c==="high"?"lineHeightSHigh":"lineHeightS",fontColor:i,fontWeight:a},l),{ref:r}),n)}A.displayName="Caption";var F=g.forwardRef(A),fe="h1";function G(e,r){var t=e,{children:n,testId:a="cf-ui-heading",as:s,fontColor:d="gray900",marginBottom:i="spacingM"}=t,l=y(t,["children","testId","as","fontColor","marginBottom"]);let c=S();return g.createElement(B,h(u({as:s||fe,testId:a,marginBottom:i,fontWeight:"fontWeightDemiBold",fontColor:d,fontSize:c==="high"?"fontSizeXlHigh":"fontSizeXl",lineHeight:c==="high"?"lineHeightXlHigh":"lineHeightXl"},l),{ref:r}),n)}G.displayName="Heading";g.forwardRef(G);var pe="h3";function K(e,r){var t=e,{children:n,testId:a="cf-ui-subheading",as:s,fontColor:d="gray900"}=t,i=y(t,["children","testId","as","fontColor"]);let l=S();return g.createElement(B,h(u({as:s||pe,testId:a,marginBottom:"spacingM",fontSize:l==="high"?"fontSizeLHigh":"fontSizeL",lineHeight:l==="high"?"lineHeightLHigh":"lineHeightL",fontWeight:"fontWeightDemiBold",fontColor:d},i),{ref:r}),n)}K.displayName="Subheading";g.forwardRef(K);var me="h2";function U(e,r){var t=e,{children:n,size:a="default",testId:s="cf-ui-display-text",as:d,fontColor:i="gray900"}=t,l=y(t,["children","size","testId","as","fontColor"]);let c="fontSize2Xl",f="lineHeightXl";return a==="large"&&(c="fontSize3Xl",f="lineHeight3Xl"),g.createElement(B,h(u({as:d||me,testId:s,marginBottom:a==="default"?"spacingL":"spacingXl",fontSize:c,lineHeight:f,fontColor:i,fontWeight:"fontWeightDemiBold"},l),{ref:r}),n)}U.displayName="DisplayText";g.forwardRef(U);var ue="h2";function q(e,r){var t=e,{children:n,className:a,testId:s="cf-ui-section-heading",as:d,fontColor:i="gray600",marginBottom:l="spacingL"}=t,c=y(t,["children","className","testId","as","fontColor","marginBottom"]);let f=S();return g.createElement(B,h(u({as:d||ue,testId:s,marginBottom:l,fontWeight:"fontWeightMedium",fontColor:i,fontSize:f==="high"?"fontSizeSHigh":"fontSizeS",lineHeight:f==="high"?"lineHeightSHigh":"lineHeightS",className:cx(css({letterSpacing:o.letterSpacingDefault}),a)},c),{ref:r}),n)}q.displayName="SectionHeading";g.forwardRef(q);var he=g.forwardRef((e,r)=>{var t=e,{children:n,testId:a="cf-ui-paragraph",marginBottom:s="spacingM"}=t,d=y(t,["children","testId","marginBottom"]);let i=S();return g.createElement(B,h(u({as:"p",testId:a,fontSize:i==="high"?"fontSizeMHigh":"fontSizeM",lineHeight:i==="high"?"lineHeightMHigh":"lineHeightM",marginBottom:s},d),{ref:r}),n)});he.displayName="Paragraph";var ye=({variant:e})=>{switch(e){case "positive":return {color:o.green600,backgroundColor:o.green200};case "primary":return {color:o.blue600,backgroundColor:o.blue200};case "negative":return {color:o.red600,backgroundColor:o.red200};case "warning":return {color:o.orange600,backgroundColor:o.orange200};case "secondary":return {color:o.gray700,backgroundColor:o.gray200};case "primary-filled":return {color:o.colorWhite,backgroundColor:o.blue600};case "featured":return {color:o.purple600,backgroundColor:o.purple200};default:return {}}},Se=({size:e})=>{switch(e){case "small":return {padding:`0 ${o.spacing2Xs}`,lineHeight:o.lineHeightS,maxHeight:o.lineHeightS};default:return {padding:`0 ${o.spacingXs}`,lineHeight:o.lineHeightM,maxHeight:o.lineHeightM}}},J=()=>({badge:({variant:e,size:r})=>css(p(p({columnGap:o.spacing2Xs,alignItems:"center",borderRadius:o.borderRadiusSmall,overflow:"hidden",verticalAlign:"middle"},ye({variant:e})),Se({size:r}))),badgeIcon:css({flexShrink:0}),badgeIconCustomTiny:css({width:"0.875rem",height:"0.875rem"}),badgeText:({textTransform:e})=>css([{color:"currentcolor",lineHeight:"inherit"},e!=="none"&&{textTransform:"lowercase","&::first-letter":{textTransform:"uppercase"}}])});var T=g.forwardRef((e,r)=>{let t=J(),x=e,{children:n,variant:a="primary",size:s="default",testId:d="cf-ui-badge",startIcon:i,endIcon:l,className:c,textTransform:f=void 0}=x,k=C(x,["children","variant","size","testId","startIcon","endIcon","className","textTransform"]),v=H=>g.cloneElement(H,{size:"tiny",className:cx(t.badgeIcon,H.props.className,{[t.badgeIconCustomTiny]:s==="small"}),variant:a==="primary-filled"?"white":a});return g.createElement(Box,I(p({as:"div",testId:d,display:"inline-flex",className:cx(t.badge({variant:a,size:s}),c)},k),{ref:r}),i&&v(i),g.createElement(F,{fontWeight:"fontWeightMedium",isTruncated:true,className:t.badgeText({textTransform:f})},n),l&&v(l))});T.displayName="Badge";var xe={published:"positive",draft:"warning",archived:"secondary",changed:"primary",deleted:"negative",new:"primary-filled"};function Z(e,r){let l=e,{entityStatus:t,isScheduled:n=void 0,size:a="default"}=l,s=C(l,["entityStatus","isScheduled","size"]),d=n&&a==="default",i=xe[t];return g.createElement(T,I(p(p({},s),d?{size:a,startIcon:g.createElement(ClockIcon,{testId:"schedule-icon"})}:{size:a}),{variant:i,ref:r}),t)}Z.displayName="EntityStatusBadge";var He=g.forwardRef(Z);export{T as Badge,He as EntityStatusBadge};//# sourceMappingURL=index.js.map
|
|
12
2
|
//# sourceMappingURL=index.js.map
|
package/dist/esm/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Badge/Badge.tsx","../../src/Badge/Badge.styles.ts","../../src/EntityStatusBadge/EntityStatusBadge.tsx"],"names":["React","cx","Box","tokens","css","variantToStyles","variant","sizeToStyles","size","getBadgeStyles","__spreadValues","textTransform","getIconColorToken","iconColorByVariant","Badge","props","ref","styles","_a","children","testId","startIcon","endIcon","className","otherProps","__objRest","iconContent","icon","__spreadProps","I","ClockIcon","statusMap","EntityStatusBadge","entityStatus","isScheduled","withClockIcon","_EntityStatusBadge"],"mappings":"ilBAAA,OAAOA,MAAW,QAClB,OAAS,MAAAC,MAAU,UACnB,OACE,OAAAC,OAIK,yzICPP,OAAOC,MAAY,yBACnB,OAAS,OAAAC,MAAW,UAIpB,IAAMC,GAAkB,CAAC,CAAE,QAAAC,CAAQ,IAAiC,CAClE,OAAQA,EAAS,CACf,IAAK,WACH,MAAO,CACL,MAAOH,EAAO,SACd,gBAAiBA,EAAO,QAC1B,EACF,IAAK,UACH,MAAO,CACL,MAAOA,EAAO,QACd,gBAAiBA,EAAO,OAC1B,EACF,IAAK,WACH,MAAO,CACL,MAAOA,EAAO,OACd,gBAAiBA,EAAO,MAC1B,EACF,IAAK,UACH,MAAO,CACL,MAAOA,EAAO,UACd,gBAAiBA,EAAO,SAC1B,EACF,IAAK,YACH,MAAO,CACL,MAAOA,EAAO,QACd,gBAAiBA,EAAO,OAC1B,EACF,IAAK,iBACH,MAAO,CACL,MAAOA,EAAO,WACd,gBAAiBA,EAAO,OAC1B,EACF,IAAK,WACH,MAAO,CACL,MAAOA,EAAO,UACd,gBAAiBA,EAAO,SAC1B,EACF,QACE,MAAO,CAAC,CACZ,CACF,EAEMI,GAAe,CAAC,CAAE,KAAAC,CAAK,IAA2B,CACtD,OAAQA,EAAM,CACZ,IAAK,QACH,MAAO,CACL,QAAS,KAAKL,EAAO,UAAU,GAC/B,WAAYA,EAAO,YACnB,UAAWA,EAAO,WACpB,EACF,QACE,MAAO,CACL,QAAS,KAAKA,EAAO,SAAS,GAC9B,WAAYA,EAAO,YACnB,UAAWA,EAAO,WACpB,CACJ,CACF,EAEaM,EAAiB,KAAO,CACnC,MAAO,CAAC,CAAE,QAAAH,EAAS,KAAAE,CAAK,IACtBJ,EAAIM,IAAA,CACF,UAAWP,EAAO,WAClB,WAAY,SACZ,aAAcA,EAAO,kBACrB,SAAU,SACV,cAAe,UACZE,GAAgB,CAAE,QAAAC,CAAQ,CAAC,GAC3BC,GAAa,CAAE,KAAAC,CAAK,CAAC,EACzB,EACH,UAAWJ,EAAI,CACb,WAAY,CACd,CAAC,EACD,oBAAqBA,EAAI,CACvB,MAAO,WACP,OAAQ,UACV,CAAC,EACD,UAAW,CAAC,CACV,cAAAO,CACF,IAGEP,EAAI,CACF,CACE,MAAO,eACP,WAAY,SACd,EACAO,IAAkB,QAAU,CAC1B,cAAe,YACf,kBAAmB,CACjB,cAAe,WACjB,CACF,CACF,CAAC,CACL,GDtFA,OAAOR,OAAY,yBACnB,OAAS,qBAAAS,GAAmB,sBAAAC,OAA0B,wBAkC/C,IAAMC,EAAQd,EAAM,WACzB,CAACe,EAAOC,IAAQ,CACd,IAAMC,EAASR,EAAe,EAW1BS,EAAAH,EATF,UAAAI,EACA,QAAAb,EAAU,UACV,KAAAE,EAAO,UACP,OAAAY,EAAS,cACT,UAAAC,EACA,QAAAC,EACA,UAAAC,EACA,cAAAZ,EAAgB,MA3DtB,EA6DQO,EADCM,EAAAC,EACDP,EADC,CARH,WACA,UACA,OACA,SACA,YACA,UACA,YACA,kBAIIQ,EAAeC,GACnB3B,EAAM,aAAa2B,EAAM,CACvB,KAAM,OACN,UAAW1B,EAAGgB,EAAO,UAAWU,EAAK,MAAM,UAAW,CACpD,CAACV,EAAO,mBAAmB,EAAGT,IAAS,OACzC,CAAC,EACD,MAAOL,GAAOS,GAAkBN,EAASO,EAAkB,CAAC,CAC9D,CAAC,EAEH,OACEb,EAAA,cAACE,GAAA0B,EAAAlB,EAAA,CACC,GAAG,MACH,OAAQU,EACR,QAAQ,cACR,UAAWnB,EAAGgB,EAAO,MAAM,CAAE,QAAAX,EAAS,KAAAE,CAAK,CAAC,EAAGe,CAAS,GACpDC,GALL,CAMC,IAAKR,IAEJK,GAAaK,EAAYL,CAAS,EACnCrB,EAAA,cAAC6B,EAAA,CACC,WAAW,mBACX,YAAW,GACX,UAAWZ,EAAO,UAAU,CAAE,cAAAN,CAAc,CAAC,GAE5CQ,CACH,EACCG,GAAWI,EAAYJ,CAAO,CACjC,CAEJ,CACF,EAEAR,EAAM,YAAc,QE/FpB,OAAOd,MAAW,QAMlB,OAAS,aAAA8B,OAAiB,wBAK1B,IAAMC,GAAqD,CACzD,UAAW,WACX,MAAO,UACP,SAAU,YACV,QAAS,UACT,QAAS,WACT,IAAK,gBACP,EAgCA,SAASC,EACPjB,EACAC,EACA,CACA,IAKIE,EAAAH,EAJF,cAAAkB,EACA,YAAAC,EAAc,OACd,KAAA1B,EAAO,SAzDX,EA2DMU,EADCM,EAAAC,EACDP,EADC,CAHH,eACA,cACA,SAGIiB,EAAgBD,GAAe1B,IAAS,UACxCF,EAAUyB,GAAUE,CAAY,EAEtC,OACEjC,EAAA,cAACc,EAAAc,EAAAlB,IAAA,GACKc,GACCW,EACD,CAAE,KAAA3B,EAAM,UAAWR,EAAA,cAAC8B,GAAA,CAAU,OAAO,gBAAgB,CAAG,EACxD,CAAE,KAAAtB,CAAK,GAJZ,CAKC,QAASF,EACT,IAAKU,IAEJiB,CACH,CAEJ,CAEAD,EAAkB,YAAc,oBAEhC,IAAMI,GAAqBpC,EAAM,WAG/BgC,CAAiB","sourcesContent":["import React from 'react';\nimport { cx } from 'emotion';\nimport {\n Box,\n type CommonProps,\n type PropsWithHTMLElement,\n type ExpandProps,\n} from '@contentful/f36-core';\nimport { Caption } from '@contentful/f36-typography';\nimport type * as CSS from 'csstype';\n\nimport type { BadgeSize, BadgeVariant } from '../types';\nimport { getBadgeStyles } from './Badge.styles';\nimport tokens from '@contentful/f36-tokens';\nimport { getIconColorToken, iconColorByVariant } from '@contentful/f36-utils';\n\nexport type BadgeInternalProps = CommonProps & {\n /**\n * Determines the variation of the component\n * @default primary\n */\n variant?: BadgeVariant;\n children: React.ReactNode;\n /**\n * Sets the size of the component\n * @default default\n */\n size?: BadgeSize;\n /**\n * Expects any of the icon components. Renders the icon aligned to the start\n */\n startIcon?: React.ReactNode;\n /**\n * Expects any of the icon components. Renders the icon aligned to the end\n */\n endIcon?: React.ReactNode;\n /**\n * By default the Badge uses CSS to capitalize only the first letter of the\n * badge text. This CSS is hit by a bug in Firefox that results in the badge\n * being rendered slightly too wide. To avoid the bug, set this property to\n * `none` to disable the text transformation. Please be sure the initial\n * letter of the badge text is already capitalized!\n */\n textTransform?: Extract<CSS.Property.TextTransform, 'none'> | undefined;\n};\n\nexport type BadgeProps = PropsWithHTMLElement<BadgeInternalProps, 'div'>;\n\nexport const Badge = React.forwardRef<HTMLDivElement, ExpandProps<BadgeProps>>(\n (props, ref) => {\n const styles = getBadgeStyles();\n const {\n children,\n variant = 'primary',\n size = 'default',\n testId = 'cf-ui-badge',\n startIcon,\n endIcon,\n className,\n textTransform = undefined,\n ...otherProps\n } = props;\n\n const iconContent = (icon) =>\n React.cloneElement(icon, {\n size: 'tiny',\n className: cx(styles.badgeIcon, icon.props.className, {\n [styles.badgeIconCustomTiny]: size === 'small',\n }),\n color: tokens[getIconColorToken(variant, iconColorByVariant)],\n });\n\n return (\n <Box\n as=\"div\"\n testId={testId}\n display=\"inline-flex\"\n className={cx(styles.badge({ variant, size }), className)}\n {...otherProps}\n ref={ref}\n >\n {startIcon && iconContent(startIcon)}\n <Caption\n fontWeight=\"fontWeightMedium\"\n isTruncated\n className={styles.badgeText({ textTransform })}\n >\n {children}\n </Caption>\n {endIcon && iconContent(endIcon)}\n </Box>\n );\n },\n);\n\nBadge.displayName = 'Badge';\n","import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\nimport type { BadgeVariant, BadgeSize, BadgeStylesProps } from '../types';\nimport type { BadgeInternalProps } from './Badge';\n\nconst variantToStyles = ({ variant }: { variant: BadgeVariant }) => {\n switch (variant) {\n case 'positive':\n return {\n color: tokens.green600,\n backgroundColor: tokens.green200,\n };\n case 'primary':\n return {\n color: tokens.blue600,\n backgroundColor: tokens.blue200,\n };\n case 'negative':\n return {\n color: tokens.red600,\n backgroundColor: tokens.red200,\n };\n case 'warning':\n return {\n color: tokens.orange600,\n backgroundColor: tokens.orange200,\n };\n case 'secondary':\n return {\n color: tokens.gray700,\n backgroundColor: tokens.gray200,\n };\n case 'primary-filled':\n return {\n color: tokens.colorWhite,\n backgroundColor: tokens.blue600,\n };\n case 'featured':\n return {\n color: tokens.purple600,\n backgroundColor: tokens.purple200,\n };\n default:\n return {};\n }\n};\n\nconst sizeToStyles = ({ size }: { size: BadgeSize }) => {\n switch (size) {\n case 'small':\n return {\n padding: `0 ${tokens.spacing2Xs}`,\n lineHeight: tokens.lineHeightS,\n maxHeight: tokens.lineHeightS,\n };\n default:\n return {\n padding: `0 ${tokens.spacingXs}`,\n lineHeight: tokens.lineHeightM,\n maxHeight: tokens.lineHeightM,\n };\n }\n};\n\nexport const getBadgeStyles = () => ({\n badge: ({ variant, size }: BadgeStylesProps) =>\n css({\n columnGap: tokens.spacing2Xs,\n alignItems: 'center',\n borderRadius: tokens.borderRadiusSmall,\n overflow: 'hidden',\n verticalAlign: 'middle',\n ...variantToStyles({ variant }),\n ...sizeToStyles({ size }),\n }),\n badgeIcon: css({\n flexShrink: 0,\n }),\n badgeIconCustomTiny: css({\n width: '0.875rem',\n height: '0.875rem',\n }),\n badgeText: ({\n textTransform,\n }: {\n textTransform: BadgeInternalProps['textTransform'];\n }) =>\n css([\n {\n color: 'currentcolor',\n lineHeight: 'inherit',\n },\n textTransform !== 'none' && {\n textTransform: 'lowercase',\n '&::first-letter': {\n textTransform: 'uppercase',\n },\n },\n ]),\n});\n","import React from 'react';\nimport type {\n EntityStatus,\n ExpandProps,\n PickUnion,\n} from '@contentful/f36-core';\nimport { ClockIcon } from '@contentful/f36-icons';\n\nimport { Badge, type BadgeProps } from '../Badge/Badge';\nimport type { BadgeSize, BadgeVariant } from '../types';\n\nconst statusMap: { [key in EntityStatus]: BadgeVariant } = {\n published: 'positive',\n draft: 'warning',\n archived: 'secondary',\n changed: 'primary',\n deleted: 'negative',\n new: 'primary-filled',\n};\n\ntype BadgeSizeWithIsScheduledProp =\n | {\n /**\n * Sets the size of the component\n * @default default\n */\n size?: Exclude<BadgeSize, 'small'>;\n /**\n * Indicates that the entity that the badge is related to has a scheduled action\n */\n isScheduled?: boolean;\n }\n | {\n /**\n * Sets the size of the component\n * @default default\n */\n size: PickUnion<BadgeSize, 'small'>;\n // We use discriminative union typing, so in case the size is set as small we don't allow isScheduled\n isScheduled?: never;\n };\n\nexport type EntityStatusBadgeProps = Omit<\n BadgeProps,\n 'children' | 'endIcon' | 'size' | 'startIcon' | 'variant'\n> &\n BadgeSizeWithIsScheduledProp & {\n entityStatus: EntityStatus;\n };\n\nfunction EntityStatusBadge(\n props: EntityStatusBadgeProps,\n ref: React.Ref<HTMLDivElement>,\n) {\n const {\n entityStatus,\n isScheduled = undefined,\n size = 'default',\n ...otherProps\n } = props;\n const withClockIcon = isScheduled && size === 'default';\n const variant = statusMap[entityStatus];\n\n return (\n <Badge\n {...otherProps}\n {...(withClockIcon\n ? { size, startIcon: <ClockIcon testId=\"schedule-icon\" /> }\n : { size })}\n variant={variant}\n ref={ref}\n >\n {entityStatus}\n </Badge>\n );\n}\n\nEntityStatusBadge.displayName = 'EntityStatusBadge';\n\nconst _EntityStatusBadge = React.forwardRef<\n HTMLDivElement,\n ExpandProps<EntityStatusBadgeProps>\n>(EntityStatusBadge);\nexport { _EntityStatusBadge as EntityStatusBadge };\n"]}
|
|
1
|
+
{"version":3,"sources":["../../src/Badge/Badge.tsx","../../../utils/src/useDensity/useDensity.ts","../../../typography/src/Caption/Caption.tsx","../../../typography/src/Text/Text.tsx","../../../typography/src/Heading/Heading.tsx","../../../typography/src/Subheading/Subheading.tsx","../../../typography/src/DisplayText/DisplayText.tsx","../../../typography/src/SectionHeading/SectionHeading.tsx","../../../typography/src/Paragraph/Paragraph.tsx","../../src/Badge/Badge.styles.ts","../../src/EntityStatusBadge/EntityStatusBadge.tsx"],"names":["DensityContext","React","useDensity","q","J","K","h","S","u","H","t","o","p","a","s","TEXT_DEFAULT_TAG","truncatedStyle","css","wordBreakStyle","TextBase","props","ref","_a","fontSize","fontStack","fontWeight","fontColor","lineHeight","letterSpacing","children","isTruncated","isWordBreak","as","className","margin","testId","otherProps","__objRest","Element","Box","__spreadProps","__spreadValues","cx","tokens","Text","CAPTION_DEFAULT_TAG","CaptionBase","_b","density","Caption","HEADING_DEFAULT_TAG","HeadingBase","marginBottom","SUBHEADING_DEFAULT_TAG","SubheadingBase","DISPLAY_TEXT_DEFAULT_TAG","DisplayTextBase","size","SECTION_HEADING_DEFAULT_TAG","SectionHeadingBase","Paragraph","variantToStyles","variant","sizeToStyles","getBadgeStyles","textTransform","Badge","styles","startIcon","endIcon","iconContent","icon","R","statusMap","EntityStatusBadgeBase","entityStatus","isScheduled","withClockIcon","ClockIcon","EntityStatusBadge"],"mappings":"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","file":"index.js","sourcesContent":["import React from 'react';\nimport { cx } from '@emotion/css';\nimport {\n Box,\n type CommonProps,\n type PropsWithHTMLElement,\n type ExpandProps,\n} from '@contentful/f36-core';\nimport { Caption } from '@contentful/f36-typography';\nimport type * as CSS from 'csstype';\n\nimport type { BadgeSize, BadgeVariant } from '../types';\nimport { getBadgeStyles } from './Badge.styles';\n\nexport type BadgeInternalProps = CommonProps & {\n /**\n * Determines the variation of the component\n * @default primary\n */\n variant?: BadgeVariant;\n children: React.ReactNode;\n /**\n * Sets the size of the component\n * @default default\n */\n size?: BadgeSize;\n /**\n * Expects any of the icon components. Renders the icon aligned to the start\n */\n startIcon?: React.ReactNode;\n /**\n * Expects any of the icon components. Renders the icon aligned to the end\n */\n endIcon?: React.ReactNode;\n /**\n * By default the Badge uses CSS to capitalize only the first letter of the\n * badge text. This CSS is hit by a bug in Firefox that results in the badge\n * being rendered slightly too wide. To avoid the bug, set this property to\n * `none` to disable the text transformation. Please be sure the initial\n * letter of the badge text is already capitalized!\n */\n textTransform?: Extract<CSS.Property.TextTransform, 'none'> | undefined;\n};\n\nexport type BadgeProps = PropsWithHTMLElement<BadgeInternalProps, 'div'>;\n\nexport const Badge = React.forwardRef<HTMLDivElement, ExpandProps<BadgeProps>>(\n (props, ref) => {\n const styles = getBadgeStyles();\n const {\n children,\n variant = 'primary',\n size = 'default',\n testId = 'cf-ui-badge',\n startIcon,\n endIcon,\n className,\n textTransform = undefined,\n ...otherProps\n } = props;\n\n const iconContent = (icon) =>\n React.cloneElement(icon, {\n size: 'tiny',\n className: cx(styles.badgeIcon, icon.props.className, {\n [styles.badgeIconCustomTiny]: size === 'small',\n }),\n variant: variant === 'primary-filled' ? 'white' : variant,\n });\n\n return (\n <Box\n as=\"div\"\n testId={testId}\n display=\"inline-flex\"\n className={cx(styles.badge({ variant, size }), className)}\n {...otherProps}\n ref={ref}\n >\n {startIcon && iconContent(startIcon)}\n <Caption\n fontWeight=\"fontWeightMedium\"\n isTruncated\n className={styles.badgeText({ textTransform })}\n >\n {children}\n </Caption>\n {endIcon && iconContent(endIcon)}\n </Box>\n );\n },\n);\n\nBadge.displayName = 'Badge';\n","import React from 'react';\n\nexport type Density = 'low' | 'high';\n\nconst DensityContext = React.createContext<Density>('low');\n\n/**\n * Use this hook to adapt your component styling/rendering based on the density.\n * The density is retrieved from the `DensityProvider`.\n */\nexport const useDensity = () => {\n const context = React.useContext(DensityContext);\n\n return context;\n};\n\nexport const DensityProvider = DensityContext.Provider;\n","import React from 'react';\nimport { FontWeightTokens } from '@contentful/f36-tokens';\nimport type {\n PolymorphicComponent,\n PolymorphicProps,\n ExpandProps,\n} from '@contentful/f36-core';\nimport { Text, type TextProps } from '../Text';\nimport { useDensity } from '@contentful/f36-utils';\n\nconst CAPTION_DEFAULT_TAG = 'span';\n\nexport interface CaptionInternalProps extends Omit<TextProps, 'as'> {\n children?: React.ReactNode;\n fontWeight?: Extract<\n FontWeightTokens,\n 'fontWeightNormal' | 'fontWeightMedium'\n >;\n isTruncated?: boolean;\n isWordBreak?: boolean;\n}\n\nexport type CaptionProps<\n E extends React.ElementType = typeof CAPTION_DEFAULT_TAG,\n> = PolymorphicProps<CaptionInternalProps, E>;\n\nfunction CaptionBase<E extends React.ElementType = typeof CAPTION_DEFAULT_TAG>(\n {\n children,\n fontWeight = 'fontWeightNormal',\n testId = 'cf-ui-caption',\n as,\n fontColor = 'gray900',\n ...otherProps\n }: CaptionProps<E>,\n ref: React.Ref<HTMLElement>,\n) {\n const density = useDensity();\n const Element: React.ElementType = as || CAPTION_DEFAULT_TAG;\n return (\n <Text\n as={Element}\n testId={testId}\n fontSize={density === 'high' ? 'fontSizeSHigh' : 'fontSizeS'}\n lineHeight={density === 'high' ? 'lineHeightSHigh' : 'lineHeightS'}\n fontColor={fontColor}\n fontWeight={fontWeight}\n {...otherProps}\n ref={ref}\n >\n {children}\n </Text>\n );\n}\n\nCaptionBase.displayName = 'Caption';\n\nexport const Caption = React.forwardRef(CaptionBase) as PolymorphicComponent<\n ExpandProps<CaptionInternalProps>,\n typeof CAPTION_DEFAULT_TAG\n>;\n","import React from 'react';\nimport tokens, {\n FontSizeTokens,\n LineHeightTokens,\n FontWeightTokens,\n FontStackTokens,\n ColorTokens,\n LetterSpacingTokens,\n} from '@contentful/f36-tokens';\nimport { css, cx } from '@emotion/css';\nimport {\n Box,\n type PolymorphicComponent,\n type CommonProps,\n type MarginProps,\n type PolymorphicProps,\n type ExpandProps,\n} from '@contentful/f36-core';\n\nexport interface TextInternalProps extends CommonProps, MarginProps {\n children?: React.ReactNode;\n fontSize?: FontSizeTokens;\n lineHeight?: LineHeightTokens;\n letterSpacing?: LetterSpacingTokens;\n fontStack?: FontStackTokens;\n fontWeight?: FontWeightTokens;\n fontColor?: ColorTokens;\n isTruncated?: boolean;\n isWordBreak?: boolean;\n}\n\nconst TEXT_DEFAULT_TAG = 'span';\n\nfunction truncatedStyle() {\n return css({\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n maxWidth: '100%',\n });\n}\n\nfunction wordBreakStyle() {\n return css({\n wordBreak: 'break-word',\n });\n}\n\nexport type TextProps<E extends React.ElementType = typeof TEXT_DEFAULT_TAG> =\n PolymorphicProps<TextInternalProps, E, 'color'>;\n\nfunction TextBase<E extends React.ElementType = typeof TEXT_DEFAULT_TAG>(\n props: TextProps<E>,\n // as this is a polymorphic base component we can not narrow down the type\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n ref: React.Ref<any>,\n) {\n const {\n fontSize = 'fontSizeM',\n fontStack = 'fontStackPrimary',\n fontWeight = 'fontWeightNormal',\n fontColor = 'gray800',\n lineHeight = 'lineHeightM',\n letterSpacing = 'letterSpacingDefault',\n children,\n isTruncated,\n isWordBreak,\n as,\n className,\n margin = 'none',\n testId = 'cf-ui-text',\n ...otherProps\n } = props;\n const Element: React.ElementType = as || TEXT_DEFAULT_TAG;\n\n return (\n <Box\n {...otherProps}\n as={Element}\n testId={testId}\n className={cx(\n css({\n padding: 0,\n fontFamily: tokens[fontStack],\n fontWeight: tokens[fontWeight],\n color: tokens[fontColor],\n fontSize: tokens[fontSize],\n lineHeight: tokens[lineHeight],\n letterSpacing: tokens[letterSpacing],\n }),\n isTruncated ? truncatedStyle() : null,\n isWordBreak ? wordBreakStyle() : null,\n className,\n )}\n margin={margin}\n ref={ref}\n >\n {children}\n </Box>\n );\n}\n\nTextBase.displayName = 'Text';\n\nexport const Text = React.forwardRef(TextBase) as PolymorphicComponent<\n ExpandProps<TextInternalProps>,\n typeof TEXT_DEFAULT_TAG,\n 'color'\n>;\n","import React from 'react';\nimport type {\n PolymorphicComponent,\n PolymorphicProps,\n ExpandProps,\n} from '@contentful/f36-core';\nimport { Text, type TextProps } from '../Text';\nimport { useDensity } from '@contentful/f36-utils';\n\nconst HEADING_DEFAULT_TAG = 'h1';\n\nexport type HeadingElement = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n\nexport interface HeadingInternalProps extends Omit<TextProps, 'as'> {\n as?: HeadingElement;\n children?: React.ReactNode;\n isTruncated?: boolean;\n isWordBreak?: boolean;\n}\n\nexport type HeadingProps<\n E extends React.ElementType = typeof HEADING_DEFAULT_TAG,\n> = PolymorphicProps<HeadingInternalProps, E>;\n\nfunction HeadingBase<E extends React.ElementType = typeof HEADING_DEFAULT_TAG>(\n {\n children,\n testId = 'cf-ui-heading',\n as,\n fontColor = 'gray900',\n marginBottom = 'spacingM',\n ...otherProps\n }: HeadingProps<E>,\n ref: React.Ref<HTMLHeadingElement>,\n) {\n const density = useDensity();\n const Element: React.ElementType = as || HEADING_DEFAULT_TAG;\n\n return (\n <Text\n as={Element}\n testId={testId}\n marginBottom={marginBottom}\n fontWeight=\"fontWeightDemiBold\"\n fontColor={fontColor}\n fontSize={density === 'high' ? 'fontSizeXlHigh' : 'fontSizeXl'}\n lineHeight={density === 'high' ? 'lineHeightXlHigh' : 'lineHeightXl'}\n {...otherProps}\n ref={ref}\n >\n {children}\n </Text>\n );\n}\n\nHeadingBase.displayName = 'Heading';\n\nexport const Heading = React.forwardRef(HeadingBase) as PolymorphicComponent<\n ExpandProps<HeadingInternalProps>,\n typeof HEADING_DEFAULT_TAG\n>;\n","import React from 'react';\nimport type {\n PolymorphicComponent,\n PolymorphicProps,\n ExpandProps,\n} from '@contentful/f36-core';\nimport type { HeadingElement } from '../Heading';\nimport { Text, type TextProps } from '../Text';\nimport { useDensity } from '@contentful/f36-utils';\n\nconst SUBHEADING_DEFAULT_TAG = 'h3';\n\nexport interface SubheadingInternalProps extends Omit<TextProps, 'as'> {\n children?: React.ReactNode;\n as?: HeadingElement;\n isTruncated?: boolean;\n isWordBreak?: boolean;\n}\n\nexport type SubheadingProps<\n E extends React.ElementType = typeof SUBHEADING_DEFAULT_TAG,\n> = PolymorphicProps<SubheadingInternalProps, E>;\n\nfunction SubheadingBase<\n E extends React.ElementType = typeof SUBHEADING_DEFAULT_TAG,\n>(\n {\n children,\n testId = 'cf-ui-subheading',\n as,\n fontColor = 'gray900',\n ...otherProps\n }: SubheadingProps<E>,\n ref: React.Ref<HTMLHeadingElement>,\n) {\n const density = useDensity();\n const Element: React.ElementType = as || SUBHEADING_DEFAULT_TAG;\n return (\n <Text\n as={Element}\n testId={testId}\n marginBottom=\"spacingM\"\n fontSize={density === 'high' ? 'fontSizeLHigh' : 'fontSizeL'}\n lineHeight={density === 'high' ? 'lineHeightLHigh' : 'lineHeightL'}\n fontWeight=\"fontWeightDemiBold\"\n fontColor={fontColor}\n {...otherProps}\n ref={ref}\n >\n {children}\n </Text>\n );\n}\n\nSubheadingBase.displayName = 'Subheading';\n\nexport const Subheading = React.forwardRef(\n SubheadingBase,\n) as PolymorphicComponent<\n ExpandProps<SubheadingInternalProps>,\n typeof SUBHEADING_DEFAULT_TAG\n>;\n","import React from 'react';\nimport { FontSizeTokens, LineHeightTokens } from '@contentful/f36-tokens';\nimport type {\n PolymorphicComponent,\n PolymorphicProps,\n ExpandProps,\n} from '@contentful/f36-core';\nimport { Text, type TextProps } from '../Text';\nimport type { HeadingElement } from '../Heading';\n\nconst DISPLAY_TEXT_DEFAULT_TAG = 'h2';\n\nexport interface DisplayTextInternalProps extends Omit<TextProps, 'as'> {\n children?: React.ReactNode;\n size?: 'default' | 'large';\n as?: HeadingElement;\n isTruncated?: boolean;\n isWordBreak?: boolean;\n}\n\nexport type DisplayTextProps<\n E extends React.ElementType = typeof DISPLAY_TEXT_DEFAULT_TAG,\n> = PolymorphicProps<DisplayTextInternalProps, E>;\n\nfunction DisplayTextBase<\n E extends React.ElementType = typeof DISPLAY_TEXT_DEFAULT_TAG,\n>(\n {\n children,\n size = 'default',\n testId = 'cf-ui-display-text',\n as,\n fontColor = 'gray900',\n ...otherProps\n }: DisplayTextProps<E>,\n ref: React.Ref<HTMLHeadingElement>,\n) {\n let fontSize: FontSizeTokens = 'fontSize2Xl';\n let lineHeight: LineHeightTokens = 'lineHeightXl';\n\n if (size === 'large') {\n fontSize = 'fontSize3Xl';\n lineHeight = 'lineHeight3Xl';\n }\n const Element: React.ElementType = as || DISPLAY_TEXT_DEFAULT_TAG;\n\n return (\n <Text\n as={Element}\n testId={testId}\n marginBottom={size === 'default' ? 'spacingL' : 'spacingXl'}\n fontSize={fontSize}\n lineHeight={lineHeight}\n fontColor={fontColor}\n fontWeight=\"fontWeightDemiBold\"\n {...otherProps}\n ref={ref}\n >\n {children}\n </Text>\n );\n}\n\nDisplayTextBase.displayName = 'DisplayText';\n\nexport const DisplayText = React.forwardRef(\n DisplayTextBase,\n) as PolymorphicComponent<\n ExpandProps<DisplayTextInternalProps>,\n typeof DISPLAY_TEXT_DEFAULT_TAG\n>;\n","import React from 'react';\nimport tokens from '@contentful/f36-tokens';\nimport { css, cx } from '@emotion/css';\nimport type {\n PolymorphicComponent,\n PolymorphicProps,\n ExpandProps,\n} from '@contentful/f36-core';\nimport type { HeadingElement } from '../Heading';\nimport { Text, type TextProps } from '../Text';\nimport { useDensity } from '@contentful/f36-utils';\n\nconst SECTION_HEADING_DEFAULT_TAG = 'h2';\n\nexport interface SectionHeadingInternalProps extends Omit<TextProps, 'as'> {\n children?: React.ReactNode;\n as?: HeadingElement;\n isTruncated?: boolean;\n isWordBreak?: boolean;\n}\n\nexport type SectionHeadingProps<\n E extends React.ElementType = typeof SECTION_HEADING_DEFAULT_TAG,\n> = PolymorphicProps<SectionHeadingInternalProps, E>;\n\nfunction SectionHeadingBase<\n E extends React.ElementType = typeof SECTION_HEADING_DEFAULT_TAG,\n>(\n {\n children,\n className,\n testId = 'cf-ui-section-heading',\n as,\n fontColor = 'gray600',\n marginBottom = 'spacingL',\n ...otherProps\n }: SectionHeadingProps<E>,\n ref: React.Ref<HTMLHeadingElement>,\n) {\n const density = useDensity();\n const Element: React.ElementType = as || SECTION_HEADING_DEFAULT_TAG;\n\n return (\n <Text\n as={Element}\n testId={testId}\n marginBottom={marginBottom}\n fontWeight=\"fontWeightMedium\"\n fontColor={fontColor}\n fontSize={density === 'high' ? 'fontSizeSHigh' : 'fontSizeS'}\n lineHeight={density === 'high' ? 'lineHeightSHigh' : 'lineHeightS'}\n className={cx(\n css({\n letterSpacing: tokens.letterSpacingDefault,\n }),\n className,\n )}\n {...otherProps}\n ref={ref}\n >\n {children}\n </Text>\n );\n}\n\nSectionHeadingBase.displayName = 'SectionHeading';\n\nexport const SectionHeading = React.forwardRef(\n SectionHeadingBase,\n) as PolymorphicComponent<\n ExpandProps<SectionHeadingInternalProps>,\n typeof SECTION_HEADING_DEFAULT_TAG\n>;\n","import React from 'react';\nimport type { PropsWithHTMLElement, ExpandProps } from '@contentful/f36-core';\nimport { Text, type TextProps } from '../Text';\nimport { useDensity } from '@contentful/f36-utils';\n\nexport type ParagraphInternalProps = TextProps & {\n children: React.ReactNode;\n isTruncated?: boolean;\n isWordBreak?: boolean;\n};\n\nexport type ParagraphProps = PropsWithHTMLElement<ParagraphInternalProps, 'p'>;\n\nexport const Paragraph = React.forwardRef<\n HTMLParagraphElement,\n ExpandProps<ParagraphProps>\n>(\n (\n {\n children,\n testId = 'cf-ui-paragraph',\n marginBottom = 'spacingM',\n ...otherProps\n },\n ref,\n ) => {\n const density = useDensity();\n\n return (\n <Text\n as=\"p\"\n testId={testId}\n fontSize={density === 'high' ? 'fontSizeMHigh' : 'fontSizeM'}\n lineHeight={density === 'high' ? 'lineHeightMHigh' : 'lineHeightM'}\n marginBottom={marginBottom}\n {...otherProps}\n ref={ref}\n >\n {children}\n </Text>\n );\n },\n);\n\nParagraph.displayName = 'Paragraph';\n","import tokens from '@contentful/f36-tokens';\nimport { css } from '@emotion/css';\nimport type { BadgeVariant, BadgeSize, BadgeStylesProps } from '../types';\nimport type { BadgeInternalProps } from './Badge';\n\nconst variantToStyles = ({ variant }: { variant: BadgeVariant }) => {\n switch (variant) {\n case 'positive':\n return {\n color: tokens.green600,\n backgroundColor: tokens.green200,\n };\n case 'primary':\n return {\n color: tokens.blue600,\n backgroundColor: tokens.blue200,\n };\n case 'negative':\n return {\n color: tokens.red600,\n backgroundColor: tokens.red200,\n };\n case 'warning':\n return {\n color: tokens.orange600,\n backgroundColor: tokens.orange200,\n };\n case 'secondary':\n return {\n color: tokens.gray700,\n backgroundColor: tokens.gray200,\n };\n case 'primary-filled':\n return {\n color: tokens.colorWhite,\n backgroundColor: tokens.blue600,\n };\n case 'featured':\n return {\n color: tokens.purple600,\n backgroundColor: tokens.purple200,\n };\n default:\n return {};\n }\n};\n\nconst sizeToStyles = ({ size }: { size: BadgeSize }) => {\n switch (size) {\n case 'small':\n return {\n padding: `0 ${tokens.spacing2Xs}`,\n lineHeight: tokens.lineHeightS,\n maxHeight: tokens.lineHeightS,\n };\n default:\n return {\n padding: `0 ${tokens.spacingXs}`,\n lineHeight: tokens.lineHeightM,\n maxHeight: tokens.lineHeightM,\n };\n }\n};\n\nexport const getBadgeStyles = () => ({\n badge: ({ variant, size }: BadgeStylesProps) =>\n css({\n columnGap: tokens.spacing2Xs,\n alignItems: 'center',\n borderRadius: tokens.borderRadiusSmall,\n overflow: 'hidden',\n verticalAlign: 'middle',\n ...variantToStyles({ variant }),\n ...sizeToStyles({ size }),\n }),\n badgeIcon: css({\n flexShrink: 0,\n }),\n badgeIconCustomTiny: css({\n width: '0.875rem',\n height: '0.875rem',\n }),\n badgeText: ({\n textTransform,\n }: {\n textTransform: BadgeInternalProps['textTransform'];\n }) =>\n css([\n {\n color: 'currentcolor',\n lineHeight: 'inherit',\n },\n textTransform !== 'none' && {\n textTransform: 'lowercase',\n '&::first-letter': {\n textTransform: 'uppercase',\n },\n },\n ]),\n});\n","import React from 'react';\nimport type {\n EntityStatus,\n ExpandProps,\n PickUnion,\n} from '@contentful/f36-core';\nimport { ClockIcon } from '@contentful/f36-icons';\n\nimport { Badge, type BadgeProps } from '../Badge/Badge';\nimport type { BadgeSize, BadgeVariant } from '../types';\n\nconst statusMap: { [key in EntityStatus]: BadgeVariant } = {\n published: 'positive',\n draft: 'warning',\n archived: 'secondary',\n changed: 'primary',\n deleted: 'negative',\n new: 'primary-filled',\n};\n\ntype BadgeSizeWithIsScheduledProp =\n | {\n /**\n * Sets the size of the component\n * @default default\n */\n size?: Exclude<BadgeSize, 'small'>;\n /**\n * Indicates that the entity that the badge is related to has a scheduled action\n */\n isScheduled?: boolean;\n }\n | {\n /**\n * Sets the size of the component\n * @default default\n */\n size: PickUnion<BadgeSize, 'small'>;\n // We use discriminative union typing, so in case the size is set as small we don't allow isScheduled\n isScheduled?: never;\n };\n\nexport type EntityStatusBadgeProps = Omit<\n BadgeProps,\n 'children' | 'endIcon' | 'size' | 'startIcon' | 'variant'\n> &\n BadgeSizeWithIsScheduledProp & {\n entityStatus: EntityStatus;\n };\n\nfunction EntityStatusBadgeBase(\n props: EntityStatusBadgeProps,\n ref: React.Ref<HTMLDivElement>,\n) {\n const {\n entityStatus,\n isScheduled = undefined,\n size = 'default',\n ...otherProps\n } = props;\n const withClockIcon = isScheduled && size === 'default';\n const variant = statusMap[entityStatus];\n\n return (\n <Badge\n {...otherProps}\n {...(withClockIcon\n ? { size, startIcon: <ClockIcon testId=\"schedule-icon\" /> }\n : { size })}\n variant={variant}\n ref={ref}\n >\n {entityStatus}\n </Badge>\n );\n}\n\nEntityStatusBadgeBase.displayName = 'EntityStatusBadge';\n\nconst EntityStatusBadge = React.forwardRef<\n HTMLDivElement,\n ExpandProps<EntityStatusBadgeProps>\n>(EntityStatusBadgeBase);\nexport { EntityStatusBadge };\n"]}
|
package/dist/index.d.mts
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { PropsWithHTMLElement,
|
|
2
|
+
import { CommonProps, PropsWithHTMLElement, PickUnion, EntityStatus } from '@contentful/f36-core';
|
|
3
3
|
import * as CSS from 'csstype';
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
|
|
5
|
+
type BadgeSize = 'default' | 'small';
|
|
6
|
+
type BadgeVariant = 'negative' | 'positive' | 'primary' | 'secondary' | 'warning' | 'primary-filled' | 'featured';
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
type BadgeInternalProps = CommonProps & {
|
|
9
9
|
/**
|
|
10
10
|
* Determines the variation of the component
|
|
11
11
|
* @default primary
|
|
@@ -34,8 +34,8 @@ declare type BadgeInternalProps = CommonProps & {
|
|
|
34
34
|
*/
|
|
35
35
|
textTransform?: Extract<CSS.Property.TextTransform, 'none'> | undefined;
|
|
36
36
|
};
|
|
37
|
-
|
|
38
|
-
declare const Badge: React.ForwardRefExoticComponent<Omit<Omit<
|
|
37
|
+
type BadgeProps = PropsWithHTMLElement<BadgeInternalProps, 'div'>;
|
|
38
|
+
declare const Badge: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, never>, "variant" | "size" | "textTransform" | "children" | keyof CommonProps | "startIcon" | "endIcon"> & CommonProps & {
|
|
39
39
|
/**
|
|
40
40
|
* Determines the variation of the component
|
|
41
41
|
* @default primary
|
|
@@ -62,10 +62,10 @@ declare const Badge: React.ForwardRefExoticComponent<Omit<Omit<Pick<React.Detail
|
|
|
62
62
|
* `none` to disable the text transformation. Please be sure the initial
|
|
63
63
|
* letter of the badge text is already capitalized!
|
|
64
64
|
*/
|
|
65
|
-
textTransform?: Extract<CSS.Property.TextTransform,
|
|
65
|
+
textTransform?: Extract<CSS.Property.TextTransform, "none"> | undefined;
|
|
66
66
|
} & React.RefAttributes<HTMLDivElement>>;
|
|
67
67
|
|
|
68
|
-
|
|
68
|
+
type BadgeSizeWithIsScheduledProp = {
|
|
69
69
|
/**
|
|
70
70
|
* Sets the size of the component
|
|
71
71
|
* @default default
|
|
@@ -83,9 +83,9 @@ declare type BadgeSizeWithIsScheduledProp = {
|
|
|
83
83
|
size: PickUnion<BadgeSize, 'small'>;
|
|
84
84
|
isScheduled?: never;
|
|
85
85
|
};
|
|
86
|
-
|
|
86
|
+
type EntityStatusBadgeProps = Omit<BadgeProps, 'children' | 'endIcon' | 'size' | 'startIcon' | 'variant'> & BadgeSizeWithIsScheduledProp & {
|
|
87
87
|
entityStatus: EntityStatus;
|
|
88
88
|
};
|
|
89
|
-
declare const
|
|
89
|
+
declare const EntityStatusBadge: React.ForwardRefExoticComponent<EntityStatusBadgeProps & React.RefAttributes<HTMLDivElement>>;
|
|
90
90
|
|
|
91
|
-
export { Badge, BadgeProps, BadgeVariant,
|
|
91
|
+
export { Badge, type BadgeProps, type BadgeVariant, EntityStatusBadge, type EntityStatusBadgeProps };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { PropsWithHTMLElement,
|
|
2
|
+
import { CommonProps, PropsWithHTMLElement, PickUnion, EntityStatus } from '@contentful/f36-core';
|
|
3
3
|
import * as CSS from 'csstype';
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
|
|
5
|
+
type BadgeSize = 'default' | 'small';
|
|
6
|
+
type BadgeVariant = 'negative' | 'positive' | 'primary' | 'secondary' | 'warning' | 'primary-filled' | 'featured';
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
type BadgeInternalProps = CommonProps & {
|
|
9
9
|
/**
|
|
10
10
|
* Determines the variation of the component
|
|
11
11
|
* @default primary
|
|
@@ -34,8 +34,8 @@ declare type BadgeInternalProps = CommonProps & {
|
|
|
34
34
|
*/
|
|
35
35
|
textTransform?: Extract<CSS.Property.TextTransform, 'none'> | undefined;
|
|
36
36
|
};
|
|
37
|
-
|
|
38
|
-
declare const Badge: React.ForwardRefExoticComponent<Omit<Omit<
|
|
37
|
+
type BadgeProps = PropsWithHTMLElement<BadgeInternalProps, 'div'>;
|
|
38
|
+
declare const Badge: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, never>, "variant" | "size" | "textTransform" | "children" | keyof CommonProps | "startIcon" | "endIcon"> & CommonProps & {
|
|
39
39
|
/**
|
|
40
40
|
* Determines the variation of the component
|
|
41
41
|
* @default primary
|
|
@@ -62,10 +62,10 @@ declare const Badge: React.ForwardRefExoticComponent<Omit<Omit<Pick<React.Detail
|
|
|
62
62
|
* `none` to disable the text transformation. Please be sure the initial
|
|
63
63
|
* letter of the badge text is already capitalized!
|
|
64
64
|
*/
|
|
65
|
-
textTransform?: Extract<CSS.Property.TextTransform,
|
|
65
|
+
textTransform?: Extract<CSS.Property.TextTransform, "none"> | undefined;
|
|
66
66
|
} & React.RefAttributes<HTMLDivElement>>;
|
|
67
67
|
|
|
68
|
-
|
|
68
|
+
type BadgeSizeWithIsScheduledProp = {
|
|
69
69
|
/**
|
|
70
70
|
* Sets the size of the component
|
|
71
71
|
* @default default
|
|
@@ -83,9 +83,9 @@ declare type BadgeSizeWithIsScheduledProp = {
|
|
|
83
83
|
size: PickUnion<BadgeSize, 'small'>;
|
|
84
84
|
isScheduled?: never;
|
|
85
85
|
};
|
|
86
|
-
|
|
86
|
+
type EntityStatusBadgeProps = Omit<BadgeProps, 'children' | 'endIcon' | 'size' | 'startIcon' | 'variant'> & BadgeSizeWithIsScheduledProp & {
|
|
87
87
|
entityStatus: EntityStatus;
|
|
88
88
|
};
|
|
89
|
-
declare const
|
|
89
|
+
declare const EntityStatusBadge: React.ForwardRefExoticComponent<EntityStatusBadgeProps & React.RefAttributes<HTMLDivElement>>;
|
|
90
90
|
|
|
91
|
-
export { Badge, BadgeProps, BadgeVariant,
|
|
91
|
+
export { Badge, type BadgeProps, type BadgeVariant, EntityStatusBadge, type EntityStatusBadgeProps };
|
package/dist/index.js
CHANGED
|
@@ -1,20 +1,2 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var c = require('react');
|
|
4
|
-
var emotion = require('emotion');
|
|
5
|
-
var f36Core = require('@contentful/f36-core');
|
|
6
|
-
var a = require('@contentful/f36-tokens');
|
|
7
|
-
var f36Utils = require('@contentful/f36-utils');
|
|
8
|
-
var f36Icons = require('@contentful/f36-icons');
|
|
9
|
-
|
|
10
|
-
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
11
|
-
|
|
12
|
-
var c__default = /*#__PURE__*/_interopDefault(c);
|
|
13
|
-
var a__default = /*#__PURE__*/_interopDefault(a);
|
|
14
|
-
|
|
15
|
-
var K=Object.defineProperty,Q=Object.defineProperties;var ee=Object.getOwnPropertyDescriptors;var I=Object.getOwnPropertySymbols;var M=Object.prototype.hasOwnProperty,R=Object.prototype.propertyIsEnumerable;var k=(e,r,t)=>r in e?K(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,p=(e,r)=>{for(var t in r||(r={}))M.call(r,t)&&k(e,t,r[t]);if(I)for(var t of I(r))R.call(r,t)&&k(e,t,r[t]);return e},z=(e,r)=>Q(e,ee(r));var b=(e,r)=>{var t={};for(var o in e)M.call(e,o)&&r.indexOf(o)<0&&(t[o]=e[o]);if(e!=null&&I)for(var o of I(e))r.indexOf(o)<0&&R.call(e,o)&&(t[o]=e[o]);return t};var re=Object.defineProperty,oe=Object.defineProperties,ae=Object.getOwnPropertyDescriptors,C=Object.getOwnPropertySymbols,L=Object.prototype.hasOwnProperty,X=Object.prototype.propertyIsEnumerable,O=(e,r,t)=>r in e?re(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,h=(e,r)=>{for(var t in r||(r={}))L.call(r,t)&&O(e,t,r[t]);if(C)for(var t of C(r))X.call(r,t)&&O(e,t,r[t]);return e},u=(e,r)=>oe(e,ae(r)),y=(e,r)=>{var t={};for(var o in e)L.call(e,o)&&r.indexOf(o)<0&&(t[o]=e[o]);if(e!=null&&C)for(var o of C(e))r.indexOf(o)<0&&X.call(e,o)&&(t[o]=e[o]);return t},ie="span";function ne(){return emotion.css({overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",maxWidth:"100%"})}function se(){return emotion.css({wordBreak:"break-word"})}function V(e,r){let t=e,{fontSize:o="fontSizeM",fontStack:i="fontStackPrimary",fontWeight:s="fontWeightNormal",fontColor:d="gray800",lineHeight:n="lineHeightM",letterSpacing:l="letterSpacingDefault",children:g,isTruncated:f,isWordBreak:N,as:v,className:H,margin:x="none"}=t,Z=y(t,["fontSize","fontStack","fontWeight","fontColor","lineHeight","letterSpacing","children","isTruncated","isWordBreak","as","className","margin"]),_=v||ie;return c__default.default.createElement(f36Core.Box,u(h({},Z),{as:_,className:emotion.cx(emotion.css({padding:0,fontFamily:a__default.default[i],fontWeight:a__default.default[s],color:a__default.default[d],fontSize:a__default.default[o],lineHeight:a__default.default[n],letterSpacing:a__default.default[l]}),f?ne():null,N?se():null,H),margin:x,ref:r}),g)}V.displayName="Text";var S=c__default.default.forwardRef(V),le="span";function j(e,r){var t=e,{children:o,fontWeight:i="fontWeightNormal",testId:s="cf-ui-caption",as:d,fontColor:n="gray900"}=t,l=y(t,["children","fontWeight","testId","as","fontColor"]);let g=f36Utils.useDensity();return c__default.default.createElement(S,u(h({as:d||le,testId:s,fontSize:g==="high"?"fontSizeSHigh":"fontSizeS",lineHeight:g==="high"?"lineHeightSHigh":"lineHeightS",fontColor:n,fontWeight:i},l),{ref:r}),o)}j.displayName="Caption";var U=c__default.default.forwardRef(j),de="h1";function $(e,r){var t=e,{children:o,testId:i="cf-ui-heading",as:s,fontColor:d="gray900",marginBottom:n="spacingM"}=t,l=y(t,["children","testId","as","fontColor","marginBottom"]);let g=f36Utils.useDensity();return c__default.default.createElement(S,u(h({as:s||de,testId:i,marginBottom:n,fontWeight:"fontWeightDemiBold",fontColor:d,fontSize:g==="high"?"fontSizeXlHigh":"fontSizeXl",lineHeight:g==="high"?"lineHeightXlHigh":"lineHeightXl"},l),{ref:r}),o)}$.displayName="Heading";c__default.default.forwardRef($);var ge="h3";function A(e,r){var t=e,{children:o,testId:i="cf-ui-subheading",as:s,fontColor:d="gray900"}=t,n=y(t,["children","testId","as","fontColor"]);let l=f36Utils.useDensity();return c__default.default.createElement(S,u(h({as:s||ge,testId:i,marginBottom:"spacingM",fontSize:l==="high"?"fontSizeLHigh":"fontSizeL",lineHeight:l==="high"?"lineHeightLHigh":"lineHeightL",fontWeight:"fontWeightDemiBold",fontColor:d},n),{ref:r}),o)}A.displayName="Subheading";c__default.default.forwardRef(A);var ce="h2";function F(e,r){var t=e,{children:o,size:i="default",testId:s="cf-ui-display-text",as:d,fontColor:n="gray900"}=t,l=y(t,["children","size","testId","as","fontColor"]);let g="fontSize2Xl",f="lineHeightXl";return i==="large"&&(g="fontSize3Xl",f="lineHeight3Xl"),c__default.default.createElement(S,u(h({as:d||ce,testId:s,marginBottom:i==="default"?"spacingL":"spacingXl",fontSize:g,lineHeight:f,fontColor:n,fontWeight:"fontWeightDemiBold"},l),{ref:r}),o)}F.displayName="DisplayText";c__default.default.forwardRef(F);var fe="h2";function G(e,r){var t=e,{children:o,className:i,testId:s="cf-ui-section-heading",as:d,fontColor:n="gray600",marginBottom:l="spacingL"}=t,g=y(t,["children","className","testId","as","fontColor","marginBottom"]);let f=f36Utils.useDensity();return c__default.default.createElement(S,u(h({as:d||fe,testId:s,marginBottom:l,fontWeight:"fontWeightMedium",fontColor:n,fontSize:f==="high"?"fontSizeSHigh":"fontSizeS",lineHeight:f==="high"?"lineHeightSHigh":"lineHeightS",className:emotion.cx(emotion.css({letterSpacing:a__default.default.letterSpacingDefault}),i)},g),{ref:r}),o)}G.displayName="SectionHeading";c__default.default.forwardRef(G);var pe=c__default.default.forwardRef((e,r)=>{var t=e,{children:o,testId:i="cf-ui-paragraph",marginBottom:s="spacingM"}=t,d=y(t,["children","testId","marginBottom"]);let n=f36Utils.useDensity();return c__default.default.createElement(S,u(h({as:"p",testId:i,fontSize:n==="high"?"fontSizeMHigh":"fontSizeM",lineHeight:n==="high"?"lineHeightMHigh":"lineHeightM",marginBottom:s},d),{ref:r}),o)});pe.displayName="Paragraph";var me=({variant:e})=>{switch(e){case"positive":return {color:a__default.default.green600,backgroundColor:a__default.default.green200};case"primary":return {color:a__default.default.blue600,backgroundColor:a__default.default.blue200};case"negative":return {color:a__default.default.red600,backgroundColor:a__default.default.red200};case"warning":return {color:a__default.default.orange600,backgroundColor:a__default.default.orange200};case"secondary":return {color:a__default.default.gray700,backgroundColor:a__default.default.gray200};case"primary-filled":return {color:a__default.default.colorWhite,backgroundColor:a__default.default.blue600};case"featured":return {color:a__default.default.purple600,backgroundColor:a__default.default.purple200};default:return {}}},he=({size:e})=>{switch(e){case"small":return {padding:`0 ${a__default.default.spacing2Xs}`,lineHeight:a__default.default.lineHeightS,maxHeight:a__default.default.lineHeightS};default:return {padding:`0 ${a__default.default.spacingXs}`,lineHeight:a__default.default.lineHeightM,maxHeight:a__default.default.lineHeightM}}},q=()=>({badge:({variant:e,size:r})=>emotion.css(p(p({columnGap:a__default.default.spacing2Xs,alignItems:"center",borderRadius:a__default.default.borderRadiusSmall,overflow:"hidden",verticalAlign:"middle"},me({variant:e})),he({size:r}))),badgeIcon:emotion.css({flexShrink:0}),badgeIconCustomTiny:emotion.css({width:"0.875rem",height:"0.875rem"}),badgeText:({textTransform:e})=>emotion.css([{color:"currentcolor",lineHeight:"inherit"},e!=="none"&&{textTransform:"lowercase","&::first-letter":{textTransform:"uppercase"}}])});var w=c__default.default.forwardRef((e,r)=>{let t=q(),H=e,{children:o,variant:i="primary",size:s="default",testId:d="cf-ui-badge",startIcon:n,endIcon:l,className:g,textTransform:f=void 0}=H,N=b(H,["children","variant","size","testId","startIcon","endIcon","className","textTransform"]),v=x=>c__default.default.cloneElement(x,{size:"tiny",className:emotion.cx(t.badgeIcon,x.props.className,{[t.badgeIconCustomTiny]:s==="small"}),color:a__default.default[f36Utils.getIconColorToken(i,f36Utils.iconColorByVariant)]});return c__default.default.createElement(f36Core.Box,z(p({as:"div",testId:d,display:"inline-flex",className:emotion.cx(t.badge({variant:i,size:s}),g)},N),{ref:r}),n&&v(n),c__default.default.createElement(U,{fontWeight:"fontWeightMedium",isTruncated:!0,className:t.badgeText({textTransform:f})},o),l&&v(l))});w.displayName="Badge";var He={published:"positive",draft:"warning",archived:"secondary",changed:"primary",deleted:"negative",new:"primary-filled"};function Y(e,r){let l=e,{entityStatus:t,isScheduled:o=void 0,size:i="default"}=l,s=b(l,["entityStatus","isScheduled","size"]),d=o&&i==="default",n=He[t];return c__default.default.createElement(w,z(p(p({},s),d?{size:i,startIcon:c__default.default.createElement(f36Icons.ClockIcon,{testId:"schedule-icon"})}:{size:i}),{variant:n,ref:r}),t)}Y.displayName="EntityStatusBadge";var xe=c__default.default.forwardRef(Y);
|
|
16
|
-
|
|
17
|
-
exports.Badge = w;
|
|
18
|
-
exports.EntityStatusBadge = xe;
|
|
19
|
-
//# sourceMappingURL=out.js.map
|
|
1
|
+
'use strict';var g=require('react'),css=require('@emotion/css'),f36Core=require('@contentful/f36-core'),o=require('@contentful/f36-tokens');require('react-dom');var f36Icons=require('@contentful/f36-icons');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var g__default=/*#__PURE__*/_interopDefault(g);var o__default=/*#__PURE__*/_interopDefault(o);var te=Object.defineProperty,re=Object.defineProperties;var ne=Object.getOwnPropertyDescriptors;var b=Object.getOwnPropertySymbols;var R=Object.prototype.hasOwnProperty,M=Object.prototype.propertyIsEnumerable;var W=(e,r,t)=>r in e?te(e,r,{enumerable:true,configurable:true,writable:true,value:t}):e[r]=t,p=(e,r)=>{for(var t in r||(r={}))R.call(r,t)&&W(e,t,r[t]);if(b)for(var t of b(r))M.call(r,t)&&W(e,t,r[t]);return e},I=(e,r)=>re(e,ne(r));var C=(e,r)=>{var t={};for(var n in e)R.call(e,n)&&r.indexOf(n)<0&&(t[n]=e[n]);if(e!=null&&b)for(var n of b(e))r.indexOf(n)<0&&M.call(e,n)&&(t[n]=e[n]);return t};var O=g__default.default.createContext("low"),S=()=>g__default.default.useContext(O);O.Provider;var oe=Object.defineProperty,ie=Object.defineProperties,se=Object.getOwnPropertyDescriptors,P=Object.getOwnPropertySymbols,$=Object.prototype.hasOwnProperty,j=Object.prototype.propertyIsEnumerable,L=(e,r,t)=>r in e?oe(e,r,{enumerable:true,configurable:true,writable:true,value:t}):e[r]=t,u=(e,r)=>{for(var t in r||(r={}))$.call(r,t)&&L(e,t,r[t]);if(P)for(var t of P(r))j.call(r,t)&&L(e,t,r[t]);return e},h=(e,r)=>ie(e,se(r)),y=(e,r)=>{var t={};for(var n in e)$.call(e,n)&&r.indexOf(n)<0&&(t[n]=e[n]);if(e!=null&&P)for(var n of P(e))r.indexOf(n)<0&&j.call(e,n)&&(t[n]=e[n]);return t},le="span";function de(){return css.css({overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",maxWidth:"100%"})}function ce(){return css.css({wordBreak:"break-word"})}function V(e,r){let t=e,{fontSize:n="fontSizeM",fontStack:a="fontStackPrimary",fontWeight:s="fontWeightNormal",fontColor:d="gray800",lineHeight:i="lineHeightM",letterSpacing:l="letterSpacingDefault",children:c,isTruncated:f,isWordBreak:k,as:v,className:x,margin:H="none",testId:Q="cf-ui-text"}=t,_=y(t,["fontSize","fontStack","fontWeight","fontColor","lineHeight","letterSpacing","children","isTruncated","isWordBreak","as","className","margin","testId"]),ee=v||le;return g__default.default.createElement(f36Core.Box,h(u({},_),{as:ee,testId:Q,className:css.cx(css.css({padding:0,fontFamily:o__default.default[a],fontWeight:o__default.default[s],color:o__default.default[d],fontSize:o__default.default[n],lineHeight:o__default.default[i],letterSpacing:o__default.default[l]}),f?de():null,k?ce():null,x),margin:H,ref:r}),c)}V.displayName="Text";var B=g__default.default.forwardRef(V),ge="span";function A(e,r){var t=e,{children:n,fontWeight:a="fontWeightNormal",testId:s="cf-ui-caption",as:d,fontColor:i="gray900"}=t,l=y(t,["children","fontWeight","testId","as","fontColor"]);let c=S();return g__default.default.createElement(B,h(u({as:d||ge,testId:s,fontSize:c==="high"?"fontSizeSHigh":"fontSizeS",lineHeight:c==="high"?"lineHeightSHigh":"lineHeightS",fontColor:i,fontWeight:a},l),{ref:r}),n)}A.displayName="Caption";var F=g__default.default.forwardRef(A),fe="h1";function G(e,r){var t=e,{children:n,testId:a="cf-ui-heading",as:s,fontColor:d="gray900",marginBottom:i="spacingM"}=t,l=y(t,["children","testId","as","fontColor","marginBottom"]);let c=S();return g__default.default.createElement(B,h(u({as:s||fe,testId:a,marginBottom:i,fontWeight:"fontWeightDemiBold",fontColor:d,fontSize:c==="high"?"fontSizeXlHigh":"fontSizeXl",lineHeight:c==="high"?"lineHeightXlHigh":"lineHeightXl"},l),{ref:r}),n)}G.displayName="Heading";g__default.default.forwardRef(G);var pe="h3";function K(e,r){var t=e,{children:n,testId:a="cf-ui-subheading",as:s,fontColor:d="gray900"}=t,i=y(t,["children","testId","as","fontColor"]);let l=S();return g__default.default.createElement(B,h(u({as:s||pe,testId:a,marginBottom:"spacingM",fontSize:l==="high"?"fontSizeLHigh":"fontSizeL",lineHeight:l==="high"?"lineHeightLHigh":"lineHeightL",fontWeight:"fontWeightDemiBold",fontColor:d},i),{ref:r}),n)}K.displayName="Subheading";g__default.default.forwardRef(K);var me="h2";function U(e,r){var t=e,{children:n,size:a="default",testId:s="cf-ui-display-text",as:d,fontColor:i="gray900"}=t,l=y(t,["children","size","testId","as","fontColor"]);let c="fontSize2Xl",f="lineHeightXl";return a==="large"&&(c="fontSize3Xl",f="lineHeight3Xl"),g__default.default.createElement(B,h(u({as:d||me,testId:s,marginBottom:a==="default"?"spacingL":"spacingXl",fontSize:c,lineHeight:f,fontColor:i,fontWeight:"fontWeightDemiBold"},l),{ref:r}),n)}U.displayName="DisplayText";g__default.default.forwardRef(U);var ue="h2";function q(e,r){var t=e,{children:n,className:a,testId:s="cf-ui-section-heading",as:d,fontColor:i="gray600",marginBottom:l="spacingL"}=t,c=y(t,["children","className","testId","as","fontColor","marginBottom"]);let f=S();return g__default.default.createElement(B,h(u({as:d||ue,testId:s,marginBottom:l,fontWeight:"fontWeightMedium",fontColor:i,fontSize:f==="high"?"fontSizeSHigh":"fontSizeS",lineHeight:f==="high"?"lineHeightSHigh":"lineHeightS",className:css.cx(css.css({letterSpacing:o__default.default.letterSpacingDefault}),a)},c),{ref:r}),n)}q.displayName="SectionHeading";g__default.default.forwardRef(q);var he=g__default.default.forwardRef((e,r)=>{var t=e,{children:n,testId:a="cf-ui-paragraph",marginBottom:s="spacingM"}=t,d=y(t,["children","testId","marginBottom"]);let i=S();return g__default.default.createElement(B,h(u({as:"p",testId:a,fontSize:i==="high"?"fontSizeMHigh":"fontSizeM",lineHeight:i==="high"?"lineHeightMHigh":"lineHeightM",marginBottom:s},d),{ref:r}),n)});he.displayName="Paragraph";var ye=({variant:e})=>{switch(e){case "positive":return {color:o__default.default.green600,backgroundColor:o__default.default.green200};case "primary":return {color:o__default.default.blue600,backgroundColor:o__default.default.blue200};case "negative":return {color:o__default.default.red600,backgroundColor:o__default.default.red200};case "warning":return {color:o__default.default.orange600,backgroundColor:o__default.default.orange200};case "secondary":return {color:o__default.default.gray700,backgroundColor:o__default.default.gray200};case "primary-filled":return {color:o__default.default.colorWhite,backgroundColor:o__default.default.blue600};case "featured":return {color:o__default.default.purple600,backgroundColor:o__default.default.purple200};default:return {}}},Se=({size:e})=>{switch(e){case "small":return {padding:`0 ${o__default.default.spacing2Xs}`,lineHeight:o__default.default.lineHeightS,maxHeight:o__default.default.lineHeightS};default:return {padding:`0 ${o__default.default.spacingXs}`,lineHeight:o__default.default.lineHeightM,maxHeight:o__default.default.lineHeightM}}},J=()=>({badge:({variant:e,size:r})=>css.css(p(p({columnGap:o__default.default.spacing2Xs,alignItems:"center",borderRadius:o__default.default.borderRadiusSmall,overflow:"hidden",verticalAlign:"middle"},ye({variant:e})),Se({size:r}))),badgeIcon:css.css({flexShrink:0}),badgeIconCustomTiny:css.css({width:"0.875rem",height:"0.875rem"}),badgeText:({textTransform:e})=>css.css([{color:"currentcolor",lineHeight:"inherit"},e!=="none"&&{textTransform:"lowercase","&::first-letter":{textTransform:"uppercase"}}])});var T=g__default.default.forwardRef((e,r)=>{let t=J(),x=e,{children:n,variant:a="primary",size:s="default",testId:d="cf-ui-badge",startIcon:i,endIcon:l,className:c,textTransform:f=void 0}=x,k=C(x,["children","variant","size","testId","startIcon","endIcon","className","textTransform"]),v=H=>g__default.default.cloneElement(H,{size:"tiny",className:css.cx(t.badgeIcon,H.props.className,{[t.badgeIconCustomTiny]:s==="small"}),variant:a==="primary-filled"?"white":a});return g__default.default.createElement(f36Core.Box,I(p({as:"div",testId:d,display:"inline-flex",className:css.cx(t.badge({variant:a,size:s}),c)},k),{ref:r}),i&&v(i),g__default.default.createElement(F,{fontWeight:"fontWeightMedium",isTruncated:true,className:t.badgeText({textTransform:f})},n),l&&v(l))});T.displayName="Badge";var xe={published:"positive",draft:"warning",archived:"secondary",changed:"primary",deleted:"negative",new:"primary-filled"};function Z(e,r){let l=e,{entityStatus:t,isScheduled:n=void 0,size:a="default"}=l,s=C(l,["entityStatus","isScheduled","size"]),d=n&&a==="default",i=xe[t];return g__default.default.createElement(T,I(p(p({},s),d?{size:a,startIcon:g__default.default.createElement(f36Icons.ClockIcon,{testId:"schedule-icon"})}:{size:a}),{variant:i,ref:r}),t)}Z.displayName="EntityStatusBadge";var He=g__default.default.forwardRef(Z);exports.Badge=T;exports.EntityStatusBadge=He;//# sourceMappingURL=index.js.map
|
|
20
2
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Badge/Badge.tsx","../src/Badge/Badge.styles.ts","../src/EntityStatusBadge/EntityStatusBadge.tsx"],"names":["React","cx","Box","tokens","css","variantToStyles","variant","sizeToStyles","size","getBadgeStyles","__spreadValues","textTransform","getIconColorToken","iconColorByVariant","Badge","props","ref","styles","_a","children","testId","startIcon","endIcon","className","otherProps","__objRest","iconContent","icon","__spreadProps","I","ClockIcon","statusMap","EntityStatusBadge","entityStatus","isScheduled","withClockIcon","_EntityStatusBadge"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { cx } from 'emotion';\nimport {\n Box,\n type CommonProps,\n type PropsWithHTMLElement,\n type ExpandProps,\n} from '@contentful/f36-core';\nimport { Caption } from '@contentful/f36-typography';\nimport type * as CSS from 'csstype';\n\nimport type { BadgeSize, BadgeVariant } from '../types';\nimport { getBadgeStyles } from './Badge.styles';\nimport tokens from '@contentful/f36-tokens';\nimport { getIconColorToken, iconColorByVariant } from '@contentful/f36-utils';\n\nexport type BadgeInternalProps = CommonProps & {\n /**\n * Determines the variation of the component\n * @default primary\n */\n variant?: BadgeVariant;\n children: React.ReactNode;\n /**\n * Sets the size of the component\n * @default default\n */\n size?: BadgeSize;\n /**\n * Expects any of the icon components. Renders the icon aligned to the start\n */\n startIcon?: React.ReactNode;\n /**\n * Expects any of the icon components. Renders the icon aligned to the end\n */\n endIcon?: React.ReactNode;\n /**\n * By default the Badge uses CSS to capitalize only the first letter of the\n * badge text. This CSS is hit by a bug in Firefox that results in the badge\n * being rendered slightly too wide. To avoid the bug, set this property to\n * `none` to disable the text transformation. Please be sure the initial\n * letter of the badge text is already capitalized!\n */\n textTransform?: Extract<CSS.Property.TextTransform, 'none'> | undefined;\n};\n\nexport type BadgeProps = PropsWithHTMLElement<BadgeInternalProps, 'div'>;\n\nexport const Badge = React.forwardRef<HTMLDivElement, ExpandProps<BadgeProps>>(\n (props, ref) => {\n const styles = getBadgeStyles();\n const {\n children,\n variant = 'primary',\n size = 'default',\n testId = 'cf-ui-badge',\n startIcon,\n endIcon,\n className,\n textTransform = undefined,\n ...otherProps\n } = props;\n\n const iconContent = (icon) =>\n React.cloneElement(icon, {\n size: 'tiny',\n className: cx(styles.badgeIcon, icon.props.className, {\n [styles.badgeIconCustomTiny]: size === 'small',\n }),\n color: tokens[getIconColorToken(variant, iconColorByVariant)],\n });\n\n return (\n <Box\n as=\"div\"\n testId={testId}\n display=\"inline-flex\"\n className={cx(styles.badge({ variant, size }), className)}\n {...otherProps}\n ref={ref}\n >\n {startIcon && iconContent(startIcon)}\n <Caption\n fontWeight=\"fontWeightMedium\"\n isTruncated\n className={styles.badgeText({ textTransform })}\n >\n {children}\n </Caption>\n {endIcon && iconContent(endIcon)}\n </Box>\n );\n },\n);\n\nBadge.displayName = 'Badge';\n","import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\nimport type { BadgeVariant, BadgeSize, BadgeStylesProps } from '../types';\nimport type { BadgeInternalProps } from './Badge';\n\nconst variantToStyles = ({ variant }: { variant: BadgeVariant }) => {\n switch (variant) {\n case 'positive':\n return {\n color: tokens.green600,\n backgroundColor: tokens.green200,\n };\n case 'primary':\n return {\n color: tokens.blue600,\n backgroundColor: tokens.blue200,\n };\n case 'negative':\n return {\n color: tokens.red600,\n backgroundColor: tokens.red200,\n };\n case 'warning':\n return {\n color: tokens.orange600,\n backgroundColor: tokens.orange200,\n };\n case 'secondary':\n return {\n color: tokens.gray700,\n backgroundColor: tokens.gray200,\n };\n case 'primary-filled':\n return {\n color: tokens.colorWhite,\n backgroundColor: tokens.blue600,\n };\n case 'featured':\n return {\n color: tokens.purple600,\n backgroundColor: tokens.purple200,\n };\n default:\n return {};\n }\n};\n\nconst sizeToStyles = ({ size }: { size: BadgeSize }) => {\n switch (size) {\n case 'small':\n return {\n padding: `0 ${tokens.spacing2Xs}`,\n lineHeight: tokens.lineHeightS,\n maxHeight: tokens.lineHeightS,\n };\n default:\n return {\n padding: `0 ${tokens.spacingXs}`,\n lineHeight: tokens.lineHeightM,\n maxHeight: tokens.lineHeightM,\n };\n }\n};\n\nexport const getBadgeStyles = () => ({\n badge: ({ variant, size }: BadgeStylesProps) =>\n css({\n columnGap: tokens.spacing2Xs,\n alignItems: 'center',\n borderRadius: tokens.borderRadiusSmall,\n overflow: 'hidden',\n verticalAlign: 'middle',\n ...variantToStyles({ variant }),\n ...sizeToStyles({ size }),\n }),\n badgeIcon: css({\n flexShrink: 0,\n }),\n badgeIconCustomTiny: css({\n width: '0.875rem',\n height: '0.875rem',\n }),\n badgeText: ({\n textTransform,\n }: {\n textTransform: BadgeInternalProps['textTransform'];\n }) =>\n css([\n {\n color: 'currentcolor',\n lineHeight: 'inherit',\n },\n textTransform !== 'none' && {\n textTransform: 'lowercase',\n '&::first-letter': {\n textTransform: 'uppercase',\n },\n },\n ]),\n});\n","import React from 'react';\nimport type {\n EntityStatus,\n ExpandProps,\n PickUnion,\n} from '@contentful/f36-core';\nimport { ClockIcon } from '@contentful/f36-icons';\n\nimport { Badge, type BadgeProps } from '../Badge/Badge';\nimport type { BadgeSize, BadgeVariant } from '../types';\n\nconst statusMap: { [key in EntityStatus]: BadgeVariant } = {\n published: 'positive',\n draft: 'warning',\n archived: 'secondary',\n changed: 'primary',\n deleted: 'negative',\n new: 'primary-filled',\n};\n\ntype BadgeSizeWithIsScheduledProp =\n | {\n /**\n * Sets the size of the component\n * @default default\n */\n size?: Exclude<BadgeSize, 'small'>;\n /**\n * Indicates that the entity that the badge is related to has a scheduled action\n */\n isScheduled?: boolean;\n }\n | {\n /**\n * Sets the size of the component\n * @default default\n */\n size: PickUnion<BadgeSize, 'small'>;\n // We use discriminative union typing, so in case the size is set as small we don't allow isScheduled\n isScheduled?: never;\n };\n\nexport type EntityStatusBadgeProps = Omit<\n BadgeProps,\n 'children' | 'endIcon' | 'size' | 'startIcon' | 'variant'\n> &\n BadgeSizeWithIsScheduledProp & {\n entityStatus: EntityStatus;\n };\n\nfunction EntityStatusBadge(\n props: EntityStatusBadgeProps,\n ref: React.Ref<HTMLDivElement>,\n) {\n const {\n entityStatus,\n isScheduled = undefined,\n size = 'default',\n ...otherProps\n } = props;\n const withClockIcon = isScheduled && size === 'default';\n const variant = statusMap[entityStatus];\n\n return (\n <Badge\n {...otherProps}\n {...(withClockIcon\n ? { size, startIcon: <ClockIcon testId=\"schedule-icon\" /> }\n : { size })}\n variant={variant}\n ref={ref}\n >\n {entityStatus}\n </Badge>\n );\n}\n\nEntityStatusBadge.displayName = 'EntityStatusBadge';\n\nconst _EntityStatusBadge = React.forwardRef<\n HTMLDivElement,\n ExpandProps<EntityStatusBadgeProps>\n>(EntityStatusBadge);\nexport { _EntityStatusBadge as EntityStatusBadge };\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/Badge/Badge.tsx","../../utils/src/useDensity/useDensity.ts","../../typography/src/Caption/Caption.tsx","../../typography/src/Text/Text.tsx","../../typography/src/Heading/Heading.tsx","../../typography/src/Subheading/Subheading.tsx","../../typography/src/DisplayText/DisplayText.tsx","../../typography/src/SectionHeading/SectionHeading.tsx","../../typography/src/Paragraph/Paragraph.tsx","../src/Badge/Badge.styles.ts","../src/EntityStatusBadge/EntityStatusBadge.tsx"],"names":["DensityContext","React","useDensity","q","J","K","h","S","u","H","t","o","p","a","s","TEXT_DEFAULT_TAG","truncatedStyle","css","wordBreakStyle","TextBase","props","ref","_a","fontSize","fontStack","fontWeight","fontColor","lineHeight","letterSpacing","children","isTruncated","isWordBreak","as","className","margin","testId","otherProps","__objRest","Element","Box","__spreadProps","__spreadValues","cx","tokens","Text","CAPTION_DEFAULT_TAG","CaptionBase","_b","density","Caption","HEADING_DEFAULT_TAG","HeadingBase","marginBottom","SUBHEADING_DEFAULT_TAG","SubheadingBase","DISPLAY_TEXT_DEFAULT_TAG","DisplayTextBase","size","SECTION_HEADING_DEFAULT_TAG","SectionHeadingBase","Paragraph","variantToStyles","variant","sizeToStyles","getBadgeStyles","textTransform","Badge","styles","startIcon","endIcon","iconContent","icon","R","statusMap","EntityStatusBadgeBase","entityStatus","isScheduled","withClockIcon","ClockIcon","EntityStatusBadge"],"mappings":"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","file":"index.js","sourcesContent":["import React from 'react';\nimport { cx } from '@emotion/css';\nimport {\n Box,\n type CommonProps,\n type PropsWithHTMLElement,\n type ExpandProps,\n} from '@contentful/f36-core';\nimport { Caption } from '@contentful/f36-typography';\nimport type * as CSS from 'csstype';\n\nimport type { BadgeSize, BadgeVariant } from '../types';\nimport { getBadgeStyles } from './Badge.styles';\n\nexport type BadgeInternalProps = CommonProps & {\n /**\n * Determines the variation of the component\n * @default primary\n */\n variant?: BadgeVariant;\n children: React.ReactNode;\n /**\n * Sets the size of the component\n * @default default\n */\n size?: BadgeSize;\n /**\n * Expects any of the icon components. Renders the icon aligned to the start\n */\n startIcon?: React.ReactNode;\n /**\n * Expects any of the icon components. Renders the icon aligned to the end\n */\n endIcon?: React.ReactNode;\n /**\n * By default the Badge uses CSS to capitalize only the first letter of the\n * badge text. This CSS is hit by a bug in Firefox that results in the badge\n * being rendered slightly too wide. To avoid the bug, set this property to\n * `none` to disable the text transformation. Please be sure the initial\n * letter of the badge text is already capitalized!\n */\n textTransform?: Extract<CSS.Property.TextTransform, 'none'> | undefined;\n};\n\nexport type BadgeProps = PropsWithHTMLElement<BadgeInternalProps, 'div'>;\n\nexport const Badge = React.forwardRef<HTMLDivElement, ExpandProps<BadgeProps>>(\n (props, ref) => {\n const styles = getBadgeStyles();\n const {\n children,\n variant = 'primary',\n size = 'default',\n testId = 'cf-ui-badge',\n startIcon,\n endIcon,\n className,\n textTransform = undefined,\n ...otherProps\n } = props;\n\n const iconContent = (icon) =>\n React.cloneElement(icon, {\n size: 'tiny',\n className: cx(styles.badgeIcon, icon.props.className, {\n [styles.badgeIconCustomTiny]: size === 'small',\n }),\n variant: variant === 'primary-filled' ? 'white' : variant,\n });\n\n return (\n <Box\n as=\"div\"\n testId={testId}\n display=\"inline-flex\"\n className={cx(styles.badge({ variant, size }), className)}\n {...otherProps}\n ref={ref}\n >\n {startIcon && iconContent(startIcon)}\n <Caption\n fontWeight=\"fontWeightMedium\"\n isTruncated\n className={styles.badgeText({ textTransform })}\n >\n {children}\n </Caption>\n {endIcon && iconContent(endIcon)}\n </Box>\n );\n },\n);\n\nBadge.displayName = 'Badge';\n","import React from 'react';\n\nexport type Density = 'low' | 'high';\n\nconst DensityContext = React.createContext<Density>('low');\n\n/**\n * Use this hook to adapt your component styling/rendering based on the density.\n * The density is retrieved from the `DensityProvider`.\n */\nexport const useDensity = () => {\n const context = React.useContext(DensityContext);\n\n return context;\n};\n\nexport const DensityProvider = DensityContext.Provider;\n","import React from 'react';\nimport { FontWeightTokens } from '@contentful/f36-tokens';\nimport type {\n PolymorphicComponent,\n PolymorphicProps,\n ExpandProps,\n} from '@contentful/f36-core';\nimport { Text, type TextProps } from '../Text';\nimport { useDensity } from '@contentful/f36-utils';\n\nconst CAPTION_DEFAULT_TAG = 'span';\n\nexport interface CaptionInternalProps extends Omit<TextProps, 'as'> {\n children?: React.ReactNode;\n fontWeight?: Extract<\n FontWeightTokens,\n 'fontWeightNormal' | 'fontWeightMedium'\n >;\n isTruncated?: boolean;\n isWordBreak?: boolean;\n}\n\nexport type CaptionProps<\n E extends React.ElementType = typeof CAPTION_DEFAULT_TAG,\n> = PolymorphicProps<CaptionInternalProps, E>;\n\nfunction CaptionBase<E extends React.ElementType = typeof CAPTION_DEFAULT_TAG>(\n {\n children,\n fontWeight = 'fontWeightNormal',\n testId = 'cf-ui-caption',\n as,\n fontColor = 'gray900',\n ...otherProps\n }: CaptionProps<E>,\n ref: React.Ref<HTMLElement>,\n) {\n const density = useDensity();\n const Element: React.ElementType = as || CAPTION_DEFAULT_TAG;\n return (\n <Text\n as={Element}\n testId={testId}\n fontSize={density === 'high' ? 'fontSizeSHigh' : 'fontSizeS'}\n lineHeight={density === 'high' ? 'lineHeightSHigh' : 'lineHeightS'}\n fontColor={fontColor}\n fontWeight={fontWeight}\n {...otherProps}\n ref={ref}\n >\n {children}\n </Text>\n );\n}\n\nCaptionBase.displayName = 'Caption';\n\nexport const Caption = React.forwardRef(CaptionBase) as PolymorphicComponent<\n ExpandProps<CaptionInternalProps>,\n typeof CAPTION_DEFAULT_TAG\n>;\n","import React from 'react';\nimport tokens, {\n FontSizeTokens,\n LineHeightTokens,\n FontWeightTokens,\n FontStackTokens,\n ColorTokens,\n LetterSpacingTokens,\n} from '@contentful/f36-tokens';\nimport { css, cx } from '@emotion/css';\nimport {\n Box,\n type PolymorphicComponent,\n type CommonProps,\n type MarginProps,\n type PolymorphicProps,\n type ExpandProps,\n} from '@contentful/f36-core';\n\nexport interface TextInternalProps extends CommonProps, MarginProps {\n children?: React.ReactNode;\n fontSize?: FontSizeTokens;\n lineHeight?: LineHeightTokens;\n letterSpacing?: LetterSpacingTokens;\n fontStack?: FontStackTokens;\n fontWeight?: FontWeightTokens;\n fontColor?: ColorTokens;\n isTruncated?: boolean;\n isWordBreak?: boolean;\n}\n\nconst TEXT_DEFAULT_TAG = 'span';\n\nfunction truncatedStyle() {\n return css({\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n maxWidth: '100%',\n });\n}\n\nfunction wordBreakStyle() {\n return css({\n wordBreak: 'break-word',\n });\n}\n\nexport type TextProps<E extends React.ElementType = typeof TEXT_DEFAULT_TAG> =\n PolymorphicProps<TextInternalProps, E, 'color'>;\n\nfunction TextBase<E extends React.ElementType = typeof TEXT_DEFAULT_TAG>(\n props: TextProps<E>,\n // as this is a polymorphic base component we can not narrow down the type\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n ref: React.Ref<any>,\n) {\n const {\n fontSize = 'fontSizeM',\n fontStack = 'fontStackPrimary',\n fontWeight = 'fontWeightNormal',\n fontColor = 'gray800',\n lineHeight = 'lineHeightM',\n letterSpacing = 'letterSpacingDefault',\n children,\n isTruncated,\n isWordBreak,\n as,\n className,\n margin = 'none',\n testId = 'cf-ui-text',\n ...otherProps\n } = props;\n const Element: React.ElementType = as || TEXT_DEFAULT_TAG;\n\n return (\n <Box\n {...otherProps}\n as={Element}\n testId={testId}\n className={cx(\n css({\n padding: 0,\n fontFamily: tokens[fontStack],\n fontWeight: tokens[fontWeight],\n color: tokens[fontColor],\n fontSize: tokens[fontSize],\n lineHeight: tokens[lineHeight],\n letterSpacing: tokens[letterSpacing],\n }),\n isTruncated ? truncatedStyle() : null,\n isWordBreak ? wordBreakStyle() : null,\n className,\n )}\n margin={margin}\n ref={ref}\n >\n {children}\n </Box>\n );\n}\n\nTextBase.displayName = 'Text';\n\nexport const Text = React.forwardRef(TextBase) as PolymorphicComponent<\n ExpandProps<TextInternalProps>,\n typeof TEXT_DEFAULT_TAG,\n 'color'\n>;\n","import React from 'react';\nimport type {\n PolymorphicComponent,\n PolymorphicProps,\n ExpandProps,\n} from '@contentful/f36-core';\nimport { Text, type TextProps } from '../Text';\nimport { useDensity } from '@contentful/f36-utils';\n\nconst HEADING_DEFAULT_TAG = 'h1';\n\nexport type HeadingElement = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n\nexport interface HeadingInternalProps extends Omit<TextProps, 'as'> {\n as?: HeadingElement;\n children?: React.ReactNode;\n isTruncated?: boolean;\n isWordBreak?: boolean;\n}\n\nexport type HeadingProps<\n E extends React.ElementType = typeof HEADING_DEFAULT_TAG,\n> = PolymorphicProps<HeadingInternalProps, E>;\n\nfunction HeadingBase<E extends React.ElementType = typeof HEADING_DEFAULT_TAG>(\n {\n children,\n testId = 'cf-ui-heading',\n as,\n fontColor = 'gray900',\n marginBottom = 'spacingM',\n ...otherProps\n }: HeadingProps<E>,\n ref: React.Ref<HTMLHeadingElement>,\n) {\n const density = useDensity();\n const Element: React.ElementType = as || HEADING_DEFAULT_TAG;\n\n return (\n <Text\n as={Element}\n testId={testId}\n marginBottom={marginBottom}\n fontWeight=\"fontWeightDemiBold\"\n fontColor={fontColor}\n fontSize={density === 'high' ? 'fontSizeXlHigh' : 'fontSizeXl'}\n lineHeight={density === 'high' ? 'lineHeightXlHigh' : 'lineHeightXl'}\n {...otherProps}\n ref={ref}\n >\n {children}\n </Text>\n );\n}\n\nHeadingBase.displayName = 'Heading';\n\nexport const Heading = React.forwardRef(HeadingBase) as PolymorphicComponent<\n ExpandProps<HeadingInternalProps>,\n typeof HEADING_DEFAULT_TAG\n>;\n","import React from 'react';\nimport type {\n PolymorphicComponent,\n PolymorphicProps,\n ExpandProps,\n} from '@contentful/f36-core';\nimport type { HeadingElement } from '../Heading';\nimport { Text, type TextProps } from '../Text';\nimport { useDensity } from '@contentful/f36-utils';\n\nconst SUBHEADING_DEFAULT_TAG = 'h3';\n\nexport interface SubheadingInternalProps extends Omit<TextProps, 'as'> {\n children?: React.ReactNode;\n as?: HeadingElement;\n isTruncated?: boolean;\n isWordBreak?: boolean;\n}\n\nexport type SubheadingProps<\n E extends React.ElementType = typeof SUBHEADING_DEFAULT_TAG,\n> = PolymorphicProps<SubheadingInternalProps, E>;\n\nfunction SubheadingBase<\n E extends React.ElementType = typeof SUBHEADING_DEFAULT_TAG,\n>(\n {\n children,\n testId = 'cf-ui-subheading',\n as,\n fontColor = 'gray900',\n ...otherProps\n }: SubheadingProps<E>,\n ref: React.Ref<HTMLHeadingElement>,\n) {\n const density = useDensity();\n const Element: React.ElementType = as || SUBHEADING_DEFAULT_TAG;\n return (\n <Text\n as={Element}\n testId={testId}\n marginBottom=\"spacingM\"\n fontSize={density === 'high' ? 'fontSizeLHigh' : 'fontSizeL'}\n lineHeight={density === 'high' ? 'lineHeightLHigh' : 'lineHeightL'}\n fontWeight=\"fontWeightDemiBold\"\n fontColor={fontColor}\n {...otherProps}\n ref={ref}\n >\n {children}\n </Text>\n );\n}\n\nSubheadingBase.displayName = 'Subheading';\n\nexport const Subheading = React.forwardRef(\n SubheadingBase,\n) as PolymorphicComponent<\n ExpandProps<SubheadingInternalProps>,\n typeof SUBHEADING_DEFAULT_TAG\n>;\n","import React from 'react';\nimport { FontSizeTokens, LineHeightTokens } from '@contentful/f36-tokens';\nimport type {\n PolymorphicComponent,\n PolymorphicProps,\n ExpandProps,\n} from '@contentful/f36-core';\nimport { Text, type TextProps } from '../Text';\nimport type { HeadingElement } from '../Heading';\n\nconst DISPLAY_TEXT_DEFAULT_TAG = 'h2';\n\nexport interface DisplayTextInternalProps extends Omit<TextProps, 'as'> {\n children?: React.ReactNode;\n size?: 'default' | 'large';\n as?: HeadingElement;\n isTruncated?: boolean;\n isWordBreak?: boolean;\n}\n\nexport type DisplayTextProps<\n E extends React.ElementType = typeof DISPLAY_TEXT_DEFAULT_TAG,\n> = PolymorphicProps<DisplayTextInternalProps, E>;\n\nfunction DisplayTextBase<\n E extends React.ElementType = typeof DISPLAY_TEXT_DEFAULT_TAG,\n>(\n {\n children,\n size = 'default',\n testId = 'cf-ui-display-text',\n as,\n fontColor = 'gray900',\n ...otherProps\n }: DisplayTextProps<E>,\n ref: React.Ref<HTMLHeadingElement>,\n) {\n let fontSize: FontSizeTokens = 'fontSize2Xl';\n let lineHeight: LineHeightTokens = 'lineHeightXl';\n\n if (size === 'large') {\n fontSize = 'fontSize3Xl';\n lineHeight = 'lineHeight3Xl';\n }\n const Element: React.ElementType = as || DISPLAY_TEXT_DEFAULT_TAG;\n\n return (\n <Text\n as={Element}\n testId={testId}\n marginBottom={size === 'default' ? 'spacingL' : 'spacingXl'}\n fontSize={fontSize}\n lineHeight={lineHeight}\n fontColor={fontColor}\n fontWeight=\"fontWeightDemiBold\"\n {...otherProps}\n ref={ref}\n >\n {children}\n </Text>\n );\n}\n\nDisplayTextBase.displayName = 'DisplayText';\n\nexport const DisplayText = React.forwardRef(\n DisplayTextBase,\n) as PolymorphicComponent<\n ExpandProps<DisplayTextInternalProps>,\n typeof DISPLAY_TEXT_DEFAULT_TAG\n>;\n","import React from 'react';\nimport tokens from '@contentful/f36-tokens';\nimport { css, cx } from '@emotion/css';\nimport type {\n PolymorphicComponent,\n PolymorphicProps,\n ExpandProps,\n} from '@contentful/f36-core';\nimport type { HeadingElement } from '../Heading';\nimport { Text, type TextProps } from '../Text';\nimport { useDensity } from '@contentful/f36-utils';\n\nconst SECTION_HEADING_DEFAULT_TAG = 'h2';\n\nexport interface SectionHeadingInternalProps extends Omit<TextProps, 'as'> {\n children?: React.ReactNode;\n as?: HeadingElement;\n isTruncated?: boolean;\n isWordBreak?: boolean;\n}\n\nexport type SectionHeadingProps<\n E extends React.ElementType = typeof SECTION_HEADING_DEFAULT_TAG,\n> = PolymorphicProps<SectionHeadingInternalProps, E>;\n\nfunction SectionHeadingBase<\n E extends React.ElementType = typeof SECTION_HEADING_DEFAULT_TAG,\n>(\n {\n children,\n className,\n testId = 'cf-ui-section-heading',\n as,\n fontColor = 'gray600',\n marginBottom = 'spacingL',\n ...otherProps\n }: SectionHeadingProps<E>,\n ref: React.Ref<HTMLHeadingElement>,\n) {\n const density = useDensity();\n const Element: React.ElementType = as || SECTION_HEADING_DEFAULT_TAG;\n\n return (\n <Text\n as={Element}\n testId={testId}\n marginBottom={marginBottom}\n fontWeight=\"fontWeightMedium\"\n fontColor={fontColor}\n fontSize={density === 'high' ? 'fontSizeSHigh' : 'fontSizeS'}\n lineHeight={density === 'high' ? 'lineHeightSHigh' : 'lineHeightS'}\n className={cx(\n css({\n letterSpacing: tokens.letterSpacingDefault,\n }),\n className,\n )}\n {...otherProps}\n ref={ref}\n >\n {children}\n </Text>\n );\n}\n\nSectionHeadingBase.displayName = 'SectionHeading';\n\nexport const SectionHeading = React.forwardRef(\n SectionHeadingBase,\n) as PolymorphicComponent<\n ExpandProps<SectionHeadingInternalProps>,\n typeof SECTION_HEADING_DEFAULT_TAG\n>;\n","import React from 'react';\nimport type { PropsWithHTMLElement, ExpandProps } from '@contentful/f36-core';\nimport { Text, type TextProps } from '../Text';\nimport { useDensity } from '@contentful/f36-utils';\n\nexport type ParagraphInternalProps = TextProps & {\n children: React.ReactNode;\n isTruncated?: boolean;\n isWordBreak?: boolean;\n};\n\nexport type ParagraphProps = PropsWithHTMLElement<ParagraphInternalProps, 'p'>;\n\nexport const Paragraph = React.forwardRef<\n HTMLParagraphElement,\n ExpandProps<ParagraphProps>\n>(\n (\n {\n children,\n testId = 'cf-ui-paragraph',\n marginBottom = 'spacingM',\n ...otherProps\n },\n ref,\n ) => {\n const density = useDensity();\n\n return (\n <Text\n as=\"p\"\n testId={testId}\n fontSize={density === 'high' ? 'fontSizeMHigh' : 'fontSizeM'}\n lineHeight={density === 'high' ? 'lineHeightMHigh' : 'lineHeightM'}\n marginBottom={marginBottom}\n {...otherProps}\n ref={ref}\n >\n {children}\n </Text>\n );\n },\n);\n\nParagraph.displayName = 'Paragraph';\n","import tokens from '@contentful/f36-tokens';\nimport { css } from '@emotion/css';\nimport type { BadgeVariant, BadgeSize, BadgeStylesProps } from '../types';\nimport type { BadgeInternalProps } from './Badge';\n\nconst variantToStyles = ({ variant }: { variant: BadgeVariant }) => {\n switch (variant) {\n case 'positive':\n return {\n color: tokens.green600,\n backgroundColor: tokens.green200,\n };\n case 'primary':\n return {\n color: tokens.blue600,\n backgroundColor: tokens.blue200,\n };\n case 'negative':\n return {\n color: tokens.red600,\n backgroundColor: tokens.red200,\n };\n case 'warning':\n return {\n color: tokens.orange600,\n backgroundColor: tokens.orange200,\n };\n case 'secondary':\n return {\n color: tokens.gray700,\n backgroundColor: tokens.gray200,\n };\n case 'primary-filled':\n return {\n color: tokens.colorWhite,\n backgroundColor: tokens.blue600,\n };\n case 'featured':\n return {\n color: tokens.purple600,\n backgroundColor: tokens.purple200,\n };\n default:\n return {};\n }\n};\n\nconst sizeToStyles = ({ size }: { size: BadgeSize }) => {\n switch (size) {\n case 'small':\n return {\n padding: `0 ${tokens.spacing2Xs}`,\n lineHeight: tokens.lineHeightS,\n maxHeight: tokens.lineHeightS,\n };\n default:\n return {\n padding: `0 ${tokens.spacingXs}`,\n lineHeight: tokens.lineHeightM,\n maxHeight: tokens.lineHeightM,\n };\n }\n};\n\nexport const getBadgeStyles = () => ({\n badge: ({ variant, size }: BadgeStylesProps) =>\n css({\n columnGap: tokens.spacing2Xs,\n alignItems: 'center',\n borderRadius: tokens.borderRadiusSmall,\n overflow: 'hidden',\n verticalAlign: 'middle',\n ...variantToStyles({ variant }),\n ...sizeToStyles({ size }),\n }),\n badgeIcon: css({\n flexShrink: 0,\n }),\n badgeIconCustomTiny: css({\n width: '0.875rem',\n height: '0.875rem',\n }),\n badgeText: ({\n textTransform,\n }: {\n textTransform: BadgeInternalProps['textTransform'];\n }) =>\n css([\n {\n color: 'currentcolor',\n lineHeight: 'inherit',\n },\n textTransform !== 'none' && {\n textTransform: 'lowercase',\n '&::first-letter': {\n textTransform: 'uppercase',\n },\n },\n ]),\n});\n","import React from 'react';\nimport type {\n EntityStatus,\n ExpandProps,\n PickUnion,\n} from '@contentful/f36-core';\nimport { ClockIcon } from '@contentful/f36-icons';\n\nimport { Badge, type BadgeProps } from '../Badge/Badge';\nimport type { BadgeSize, BadgeVariant } from '../types';\n\nconst statusMap: { [key in EntityStatus]: BadgeVariant } = {\n published: 'positive',\n draft: 'warning',\n archived: 'secondary',\n changed: 'primary',\n deleted: 'negative',\n new: 'primary-filled',\n};\n\ntype BadgeSizeWithIsScheduledProp =\n | {\n /**\n * Sets the size of the component\n * @default default\n */\n size?: Exclude<BadgeSize, 'small'>;\n /**\n * Indicates that the entity that the badge is related to has a scheduled action\n */\n isScheduled?: boolean;\n }\n | {\n /**\n * Sets the size of the component\n * @default default\n */\n size: PickUnion<BadgeSize, 'small'>;\n // We use discriminative union typing, so in case the size is set as small we don't allow isScheduled\n isScheduled?: never;\n };\n\nexport type EntityStatusBadgeProps = Omit<\n BadgeProps,\n 'children' | 'endIcon' | 'size' | 'startIcon' | 'variant'\n> &\n BadgeSizeWithIsScheduledProp & {\n entityStatus: EntityStatus;\n };\n\nfunction EntityStatusBadgeBase(\n props: EntityStatusBadgeProps,\n ref: React.Ref<HTMLDivElement>,\n) {\n const {\n entityStatus,\n isScheduled = undefined,\n size = 'default',\n ...otherProps\n } = props;\n const withClockIcon = isScheduled && size === 'default';\n const variant = statusMap[entityStatus];\n\n return (\n <Badge\n {...otherProps}\n {...(withClockIcon\n ? { size, startIcon: <ClockIcon testId=\"schedule-icon\" /> }\n : { size })}\n variant={variant}\n ref={ref}\n >\n {entityStatus}\n </Badge>\n );\n}\n\nEntityStatusBadgeBase.displayName = 'EntityStatusBadge';\n\nconst EntityStatusBadge = React.forwardRef<\n HTMLDivElement,\n ExpandProps<EntityStatusBadgeProps>\n>(EntityStatusBadgeBase);\nexport { EntityStatusBadge };\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@contentful/f36-badge",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "6.0.0-alpha.1",
|
|
4
4
|
"description": "Forma 36: Badge React Component",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"files": [
|
|
@@ -20,18 +20,17 @@
|
|
|
20
20
|
"build": "tsup"
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|
|
23
|
-
"@contentful/f36-core": "^
|
|
24
|
-
"@contentful/f36-icons": "^
|
|
25
|
-
"@contentful/f36-tokens": "^
|
|
26
|
-
"@
|
|
27
|
-
"emotion": "^10.0.17"
|
|
23
|
+
"@contentful/f36-core": "^6.0.0-alpha.0",
|
|
24
|
+
"@contentful/f36-icons": "^6.0.0-alpha.0",
|
|
25
|
+
"@contentful/f36-tokens": "^6.0.0-alpha.0",
|
|
26
|
+
"@emotion/css": "^11.13.5"
|
|
28
27
|
},
|
|
29
28
|
"devDependencies": {
|
|
30
|
-
"@contentful/f36-typography": "^
|
|
29
|
+
"@contentful/f36-typography": "^6.0.0-alpha.0"
|
|
31
30
|
},
|
|
32
31
|
"peerDependencies": {
|
|
33
|
-
"react": ">=
|
|
34
|
-
"react-dom": ">=
|
|
32
|
+
"react": ">=19.1.0",
|
|
33
|
+
"react-dom": ">=19.1.0"
|
|
35
34
|
},
|
|
36
35
|
"publishConfig": {
|
|
37
36
|
"registry": "https://npm.pkg.github.com/",
|