@doist/reactist 24.0.0-beta → 24.1.0-beta
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/reactist.cjs.development.js +1 -1
- package/dist/reactist.cjs.development.js.map +1 -1
- package/dist/reactist.cjs.production.min.js +1 -1
- package/dist/reactist.cjs.production.min.js.map +1 -1
- package/es/heading/heading.js.map +1 -1
- package/es/heading/heading.module.css.js +1 -1
- package/lib/heading/heading.d.ts +4 -4
- package/lib/heading/heading.js.map +1 -1
- package/lib/heading/heading.module.css.js +1 -1
- package/package.json +1 -1
- package/styles/heading.css +1 -1
- package/styles/heading.module.css.css +1 -1
- package/styles/reactist.css +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"heading.js","sources":["../../src/heading/heading.tsx"],"sourcesContent":["import * as React from 'react'\nimport { getClassNames } from '../utils/responsive-props'\nimport { Box } from '../box'\nimport styles from './heading.module.css'\nimport type { ObfuscatedClassName } from '../utils/polymorphism'\nimport type { Tone } from '../utils/common-types'\nimport type { BoxProps } from '../box'\n\ntype HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6 | '1' | '2' | '3' | '4' | '5' | '6'\ntype HeadingElement = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n\ntype SupportedHeadingElementProps = Omit<\n JSX.IntrinsicElements[HeadingElement],\n 'className' | 'children' | 'placeholder'\n>\n\ntype HeadingProps = SupportedHeadingElementProps & {\n children: React.ReactNode\n /**\n * The semantic level of the heading.\n */\n level: HeadingLevel\n /**\n * The weight of the heading. Used to de-emphasize the heading visually when using 'light'.\n *\n * @default 'regular'\n */\n weight?: 'regular' | 'light'\n /**\n * Shifts the default heading visual text size up or down, depending on the original size\n * imposed by the `level`. The heading continues to be semantically at the given level.\n *\n * By default, no value is applied, and the default size from the level is applied. The values\n * have the following effect:\n *\n * - 'smaller' shifts the default level size down in the font-size scale (it tends to make the\n * level look visually as if it were of the immediately lower level).\n * - 'larger' has the opposite effect than 'smaller' shifting the visual font size up in the\n * scale.\n * - 'largest' can be thought of as applying 'larger' twice.\n *\n * @see level\n * @default undefined\n */\n size?: 'smaller' | 'larger' | 'largest'\n /**\n * The tone (semantic color) of the heading.\n *\n * @default 'normal'\n */\n tone?: Tone\n /**\n * Used to truncate the heading to a given number of lines.\n *\n * It will add an ellipsis (`…`) to the text at the end of the last line, only if the text was\n * truncated. If the text fits without it being truncated, no ellipsis is added.\n *\n * By default, the text is not truncated at all, no matter how many lines it takes to render it.\n *\n * @default undefined\n */\n lineClamp?: 1 | 2 | 3 | 4 | 5 | '1' | '2' | '3' | '4' | '5'\n /**\n * How to align the heading text horizontally.\n *\n * @default 'start'\n */\n align?: BoxProps['textAlign']\n}\n\nconst Heading = React.forwardRef<HTMLHeadingElement, HeadingProps & ObfuscatedClassName>(\n function Heading(\n {\n level,\n weight = 'regular',\n size,\n tone = 'normal',\n children,\n lineClamp,\n align,\n exceptionallySetClassName,\n ...props\n },\n ref,\n ) {\n // In TypeScript v4.1, this would be properly recognized without needing the type assertion\n // https://devblogs.microsoft.com/typescript/announcing-typescript-4-1-beta/#template-literal-types\n const headingElementName = `h${level}` as HeadingElement\n const lineClampMultipleLines =\n typeof lineClamp === 'string' ? parseInt(lineClamp, 10) > 1 : (lineClamp || 0) > 1\n\n return (\n <Box\n {...props}\n className={[\n exceptionallySetClassName,\n styles.heading,\n weight !== 'regular' ? getClassNames(styles, 'weight', weight) : null,\n tone !== 'normal' ? getClassNames(styles, 'tone', tone) : null,\n getClassNames(styles, 'size', size),\n lineClampMultipleLines ? styles.lineClampMultipleLines : null,\n lineClamp ? getClassNames(styles, 'lineClamp', lineClamp.toString()) : null,\n ]}\n textAlign={align}\n // Prevents emojis from being cut-off\n // See https://github.com/Doist/reactist/pull/528\n paddingRight={lineClamp ? 'xsmall' : undefined}\n as={headingElementName}\n ref={ref}\n >\n {children}\n </Box>\n )\n },\n)\n\nexport type { HeadingProps, HeadingLevel }\nexport { Heading }\n"],"names":["Heading","React","ref","level","weight","size","tone","children","lineClamp","align","exceptionallySetClassName","props","headingElementName","lineClampMultipleLines","parseInt","Box","className","styles","heading","getClassNames","toString","textAlign","paddingRight","undefined","as"],"mappings":";;;;;;;MAsEMA,OAAO,gBAAGC,UAAA,CACZ,SAASD,OAAT,OAYIE,GAZJ;MACI;IACIC,KADJ;IAEIC,MAAM,GAAG,SAFb;IAGIC,IAHJ;IAIIC,IAAI,GAAG,QAJX;IAKIC,QALJ;IAMIC,SANJ;IAOIC,KAPJ;IAQIC;;MACGC;;;;EAMP,MAAMC,kBAAkB,SAAOT,KAA/B;EACA,MAAMU,sBAAsB,GACxB,OAAOL,SAAP,KAAqB,QAArB,GAAgCM,QAAQ,CAACN,SAAD,EAAY,EAAZ,CAAR,GAA0B,CAA1D,GAA8D,CAACA,SAAS,IAAI,CAAd,IAAmB,CADrF;EAGA,oBACIP,aAAA,CAACc,GAAD,oCACQJ,KADR;IAEIK,SAAS,EAAE,CACPN,yBADO,EAEPO,MAAM,CAACC,OAFA,EAGPd,MAAM,KAAK,SAAX,GAAuBe,aAAa,CAACF,MAAD,EAAS,QAAT,EAAmBb,MAAnB,CAApC,GAAiE,IAH1D,EAIPE,IAAI,KAAK,QAAT,GAAoBa,aAAa,CAACF,MAAD,EAAS,MAAT,EAAiBX,IAAjB,CAAjC,GAA0D,IAJnD,EAKPa,aAAa,CAACF,MAAD,EAAS,MAAT,EAAiBZ,IAAjB,CALN,EAMPQ,sBAAsB,GAAGI,MAAM,CAACJ,sBAAV,GAAmC,IANlD,EAOPL,SAAS,GAAGW,aAAa,CAACF,MAAD,EAAS,WAAT,EAAsBT,SAAS,CAACY,QAAV,EAAtB,CAAhB,GAA8D,IAPhE,CAFf;IAWIC,SAAS,EAAEZ,KAXf;;;IAcIa,YAAY,EAAEd,SAAS,GAAG,QAAH,GAAce,SAdzC;IAeIC,EAAE,EAAEZ,kBAfR;IAgBIV,GAAG,EAAEA;MAEJK,QAlBL,CADJ;AAsBH,CA3CW;;;;"}
|
|
1
|
+
{"version":3,"file":"heading.js","sources":["../../src/heading/heading.tsx"],"sourcesContent":["import * as React from 'react'\nimport { getClassNames } from '../utils/responsive-props'\nimport { Box } from '../box'\nimport styles from './heading.module.css'\nimport type { ObfuscatedClassName } from '../utils/polymorphism'\nimport type { Tone } from '../utils/common-types'\nimport type { BoxProps } from '../box'\n\ntype HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6 | '1' | '2' | '3' | '4' | '5' | '6'\ntype HeadingElement = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n\ntype SupportedHeadingElementProps = Omit<\n JSX.IntrinsicElements[HeadingElement],\n 'className' | 'children' | 'placeholder'\n>\n\ntype HeadingProps = SupportedHeadingElementProps & {\n children: React.ReactNode\n /**\n * The semantic level of the heading.\n */\n level: HeadingLevel\n /**\n * The weight of the heading. Used to de-emphasize the heading visually when using 'medium' or 'light'.\n *\n * @default 'regular'\n */\n weight?: 'regular' | 'medium' | 'light'\n /**\n * Shifts the default heading visual text size up or down, depending on the original size\n * imposed by the `level`. The heading continues to be semantically at the given level.\n *\n * By default, no value is applied, and the default size from the level is applied. The values\n * have the following effect:\n *\n * - 'smaller' shifts the default level size down in the font-size scale (it tends to make the\n * level look visually as if it were of the immediately lower level).\n * - 'larger' has the opposite effect than 'smaller' shifting the visual font size up in the\n * scale.\n * - 'largest' can be thought of as applying 'larger' twice.\n *\n * @see level\n * @default undefined\n */\n size?: 'smaller' | 'larger' | 'largest'\n /**\n * The tone (semantic color) of the heading.\n *\n * @default 'normal'\n */\n tone?: Tone\n /**\n * Used to truncate the heading to a given number of lines.\n *\n * It will add an ellipsis (`…`) to the text at the end of the last line, only if the text was\n * truncated. If the text fits without it being truncated, no ellipsis is added.\n *\n * By default, the text is not truncated at all, no matter how many lines it takes to render it.\n *\n * @default undefined\n */\n lineClamp?: 1 | 2 | 3 | 4 | 5 | '1' | '2' | '3' | '4' | '5'\n /**\n * How to align the heading text horizontally.\n *\n * @default 'start'\n */\n align?: BoxProps['textAlign']\n}\n\nconst Heading = React.forwardRef<HTMLHeadingElement, HeadingProps & ObfuscatedClassName>(\n function Heading(\n {\n level,\n weight = 'regular',\n size,\n tone = 'normal',\n children,\n lineClamp,\n align,\n exceptionallySetClassName,\n ...props\n },\n ref,\n ) {\n // In TypeScript v4.1, this would be properly recognized without needing the type assertion\n // https://devblogs.microsoft.com/typescript/announcing-typescript-4-1-beta/#template-literal-types\n const headingElementName = `h${level}` as HeadingElement\n const lineClampMultipleLines =\n typeof lineClamp === 'string' ? parseInt(lineClamp, 10) > 1 : (lineClamp || 0) > 1\n\n return (\n <Box\n {...props}\n className={[\n exceptionallySetClassName,\n styles.heading,\n weight !== 'regular' ? getClassNames(styles, 'weight', weight) : null,\n tone !== 'normal' ? getClassNames(styles, 'tone', tone) : null,\n getClassNames(styles, 'size', size),\n lineClampMultipleLines ? styles.lineClampMultipleLines : null,\n lineClamp ? getClassNames(styles, 'lineClamp', lineClamp.toString()) : null,\n ]}\n textAlign={align}\n // Prevents emojis from being cut-off\n // See https://github.com/Doist/reactist/pull/528\n paddingRight={lineClamp ? 'xsmall' : undefined}\n as={headingElementName}\n ref={ref}\n >\n {children}\n </Box>\n )\n },\n)\n\nexport type { HeadingProps, HeadingLevel }\nexport { Heading }\n"],"names":["Heading","React","ref","level","weight","size","tone","children","lineClamp","align","exceptionallySetClassName","props","headingElementName","lineClampMultipleLines","parseInt","Box","className","styles","heading","getClassNames","toString","textAlign","paddingRight","undefined","as"],"mappings":";;;;;;;MAsEMA,OAAO,gBAAGC,UAAA,CACZ,SAASD,OAAT,OAYIE,GAZJ;MACI;IACIC,KADJ;IAEIC,MAAM,GAAG,SAFb;IAGIC,IAHJ;IAIIC,IAAI,GAAG,QAJX;IAKIC,QALJ;IAMIC,SANJ;IAOIC,KAPJ;IAQIC;;MACGC;;;;EAMP,MAAMC,kBAAkB,SAAOT,KAA/B;EACA,MAAMU,sBAAsB,GACxB,OAAOL,SAAP,KAAqB,QAArB,GAAgCM,QAAQ,CAACN,SAAD,EAAY,EAAZ,CAAR,GAA0B,CAA1D,GAA8D,CAACA,SAAS,IAAI,CAAd,IAAmB,CADrF;EAGA,oBACIP,aAAA,CAACc,GAAD,oCACQJ,KADR;IAEIK,SAAS,EAAE,CACPN,yBADO,EAEPO,MAAM,CAACC,OAFA,EAGPd,MAAM,KAAK,SAAX,GAAuBe,aAAa,CAACF,MAAD,EAAS,QAAT,EAAmBb,MAAnB,CAApC,GAAiE,IAH1D,EAIPE,IAAI,KAAK,QAAT,GAAoBa,aAAa,CAACF,MAAD,EAAS,MAAT,EAAiBX,IAAjB,CAAjC,GAA0D,IAJnD,EAKPa,aAAa,CAACF,MAAD,EAAS,MAAT,EAAiBZ,IAAjB,CALN,EAMPQ,sBAAsB,GAAGI,MAAM,CAACJ,sBAAV,GAAmC,IANlD,EAOPL,SAAS,GAAGW,aAAa,CAACF,MAAD,EAAS,WAAT,EAAsBT,SAAS,CAACY,QAAV,EAAtB,CAAhB,GAA8D,IAPhE,CAFf;IAWIC,SAAS,EAAEZ,KAXf;;;IAcIa,YAAY,EAAEd,SAAS,GAAG,QAAH,GAAce,SAdzC;IAeIC,EAAE,EAAEZ,kBAfR;IAgBIV,GAAG,EAAEA;MAEJK,QAlBL,CADJ;AAsBH,CA3CW;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var modules_949d2ff4 = {"heading":"
|
|
1
|
+
var modules_949d2ff4 = {"heading":"bff24867","weight-medium":"_9b540c61","weight-light":"c6729907","tone-secondary":"d6507f70","tone-danger":"d1846d93","size-largest":"_7cbdd1ba","size-larger":"b3e14969","size-smaller":"be14a265","lineClampMultipleLines":"_71391f13","lineClamp-1":"_97298b1b","lineClamp-2":"_6d357d76","lineClamp-3":"d820b451","lineClamp-4":"_8d37487d","lineClamp-5":"_5215b4d7"};
|
|
2
2
|
|
|
3
3
|
export default modules_949d2ff4;
|
|
4
4
|
//# sourceMappingURL=heading.module.css.js.map
|
package/lib/heading/heading.d.ts
CHANGED
|
@@ -12,11 +12,11 @@ declare type HeadingProps = SupportedHeadingElementProps & {
|
|
|
12
12
|
*/
|
|
13
13
|
level: HeadingLevel;
|
|
14
14
|
/**
|
|
15
|
-
* The weight of the heading. Used to de-emphasize the heading visually when using 'light'.
|
|
15
|
+
* The weight of the heading. Used to de-emphasize the heading visually when using 'medium' or 'light'.
|
|
16
16
|
*
|
|
17
17
|
* @default 'regular'
|
|
18
18
|
*/
|
|
19
|
-
weight?: 'regular' | 'light';
|
|
19
|
+
weight?: 'regular' | 'medium' | 'light';
|
|
20
20
|
/**
|
|
21
21
|
* Shifts the default heading visual text size up or down, depending on the original size
|
|
22
22
|
* imposed by the `level`. The heading continues to be semantically at the given level.
|
|
@@ -65,11 +65,11 @@ declare const Heading: React.ForwardRefExoticComponent<Pick<SupportedHeadingElem
|
|
|
65
65
|
*/
|
|
66
66
|
level: HeadingLevel;
|
|
67
67
|
/**
|
|
68
|
-
* The weight of the heading. Used to de-emphasize the heading visually when using 'light'.
|
|
68
|
+
* The weight of the heading. Used to de-emphasize the heading visually when using 'medium' or 'light'.
|
|
69
69
|
*
|
|
70
70
|
* @default 'regular'
|
|
71
71
|
*/
|
|
72
|
-
weight?: "regular" | "light" | undefined;
|
|
72
|
+
weight?: "regular" | "medium" | "light" | undefined;
|
|
73
73
|
/**
|
|
74
74
|
* Shifts the default heading visual text size up or down, depending on the original size
|
|
75
75
|
* imposed by the `level`. The heading continues to be semantically at the given level.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"heading.js","sources":["../../src/heading/heading.tsx"],"sourcesContent":["import * as React from 'react'\nimport { getClassNames } from '../utils/responsive-props'\nimport { Box } from '../box'\nimport styles from './heading.module.css'\nimport type { ObfuscatedClassName } from '../utils/polymorphism'\nimport type { Tone } from '../utils/common-types'\nimport type { BoxProps } from '../box'\n\ntype HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6 | '1' | '2' | '3' | '4' | '5' | '6'\ntype HeadingElement = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n\ntype SupportedHeadingElementProps = Omit<\n JSX.IntrinsicElements[HeadingElement],\n 'className' | 'children' | 'placeholder'\n>\n\ntype HeadingProps = SupportedHeadingElementProps & {\n children: React.ReactNode\n /**\n * The semantic level of the heading.\n */\n level: HeadingLevel\n /**\n * The weight of the heading. Used to de-emphasize the heading visually when using 'light'.\n *\n * @default 'regular'\n */\n weight?: 'regular' | 'light'\n /**\n * Shifts the default heading visual text size up or down, depending on the original size\n * imposed by the `level`. The heading continues to be semantically at the given level.\n *\n * By default, no value is applied, and the default size from the level is applied. The values\n * have the following effect:\n *\n * - 'smaller' shifts the default level size down in the font-size scale (it tends to make the\n * level look visually as if it were of the immediately lower level).\n * - 'larger' has the opposite effect than 'smaller' shifting the visual font size up in the\n * scale.\n * - 'largest' can be thought of as applying 'larger' twice.\n *\n * @see level\n * @default undefined\n */\n size?: 'smaller' | 'larger' | 'largest'\n /**\n * The tone (semantic color) of the heading.\n *\n * @default 'normal'\n */\n tone?: Tone\n /**\n * Used to truncate the heading to a given number of lines.\n *\n * It will add an ellipsis (`…`) to the text at the end of the last line, only if the text was\n * truncated. If the text fits without it being truncated, no ellipsis is added.\n *\n * By default, the text is not truncated at all, no matter how many lines it takes to render it.\n *\n * @default undefined\n */\n lineClamp?: 1 | 2 | 3 | 4 | 5 | '1' | '2' | '3' | '4' | '5'\n /**\n * How to align the heading text horizontally.\n *\n * @default 'start'\n */\n align?: BoxProps['textAlign']\n}\n\nconst Heading = React.forwardRef<HTMLHeadingElement, HeadingProps & ObfuscatedClassName>(\n function Heading(\n {\n level,\n weight = 'regular',\n size,\n tone = 'normal',\n children,\n lineClamp,\n align,\n exceptionallySetClassName,\n ...props\n },\n ref,\n ) {\n // In TypeScript v4.1, this would be properly recognized without needing the type assertion\n // https://devblogs.microsoft.com/typescript/announcing-typescript-4-1-beta/#template-literal-types\n const headingElementName = `h${level}` as HeadingElement\n const lineClampMultipleLines =\n typeof lineClamp === 'string' ? parseInt(lineClamp, 10) > 1 : (lineClamp || 0) > 1\n\n return (\n <Box\n {...props}\n className={[\n exceptionallySetClassName,\n styles.heading,\n weight !== 'regular' ? getClassNames(styles, 'weight', weight) : null,\n tone !== 'normal' ? getClassNames(styles, 'tone', tone) : null,\n getClassNames(styles, 'size', size),\n lineClampMultipleLines ? styles.lineClampMultipleLines : null,\n lineClamp ? getClassNames(styles, 'lineClamp', lineClamp.toString()) : null,\n ]}\n textAlign={align}\n // Prevents emojis from being cut-off\n // See https://github.com/Doist/reactist/pull/528\n paddingRight={lineClamp ? 'xsmall' : undefined}\n as={headingElementName}\n ref={ref}\n >\n {children}\n </Box>\n )\n },\n)\n\nexport type { HeadingProps, HeadingLevel }\nexport { Heading }\n"],"names":["React","ref","level","weight","size","tone","children","lineClamp","align","exceptionallySetClassName","props","headingElementName","lineClampMultipleLines","parseInt","Box","className","styles","heading","getClassNames","toString","textAlign","paddingRight","undefined","as"],"mappings":"+WAsEgBA,cACZ,WAYIC,OAXAC,MACIA,EADJC,OAEIA,EAAS,UAFbC,KAGIA,EAHJC,KAIIA,EAAO,SAJXC,SAKIA,EALJC,UAMIA,EANJC,MAOIA,EAPJC,0BAQIA,KACGC,iCAMP,MAAMC,MAAyBT,EACzBU,EACmB,iBAAdL,EAAyBM,SAASN,EAAW,IAAM,GAAKA,GAAa,GAAK,EAErF,OACIP,gBAACc,yCACOJ,OACJK,UAAW,CACPN,EACAO,UAAOC,QACI,YAAXd,EAAuBe,gBAAcF,UAAQ,SAAUb,GAAU,KACxD,WAATE,EAAoBa,gBAAcF,UAAQ,OAAQX,GAAQ,KAC1Da,gBAAcF,UAAQ,OAAQZ,GAC9BQ,EAAyBI,UAAOJ,uBAAyB,KACzDL,EAAYW,gBAAcF,UAAQ,YAAaT,EAAUY,YAAc,MAE3EC,UAAWZ,EAGXa,aAAcd,EAAY,cAAWe,EACrCC,GAAIZ,EACJV,IAAKA,IAEJK"}
|
|
1
|
+
{"version":3,"file":"heading.js","sources":["../../src/heading/heading.tsx"],"sourcesContent":["import * as React from 'react'\nimport { getClassNames } from '../utils/responsive-props'\nimport { Box } from '../box'\nimport styles from './heading.module.css'\nimport type { ObfuscatedClassName } from '../utils/polymorphism'\nimport type { Tone } from '../utils/common-types'\nimport type { BoxProps } from '../box'\n\ntype HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6 | '1' | '2' | '3' | '4' | '5' | '6'\ntype HeadingElement = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n\ntype SupportedHeadingElementProps = Omit<\n JSX.IntrinsicElements[HeadingElement],\n 'className' | 'children' | 'placeholder'\n>\n\ntype HeadingProps = SupportedHeadingElementProps & {\n children: React.ReactNode\n /**\n * The semantic level of the heading.\n */\n level: HeadingLevel\n /**\n * The weight of the heading. Used to de-emphasize the heading visually when using 'medium' or 'light'.\n *\n * @default 'regular'\n */\n weight?: 'regular' | 'medium' | 'light'\n /**\n * Shifts the default heading visual text size up or down, depending on the original size\n * imposed by the `level`. The heading continues to be semantically at the given level.\n *\n * By default, no value is applied, and the default size from the level is applied. The values\n * have the following effect:\n *\n * - 'smaller' shifts the default level size down in the font-size scale (it tends to make the\n * level look visually as if it were of the immediately lower level).\n * - 'larger' has the opposite effect than 'smaller' shifting the visual font size up in the\n * scale.\n * - 'largest' can be thought of as applying 'larger' twice.\n *\n * @see level\n * @default undefined\n */\n size?: 'smaller' | 'larger' | 'largest'\n /**\n * The tone (semantic color) of the heading.\n *\n * @default 'normal'\n */\n tone?: Tone\n /**\n * Used to truncate the heading to a given number of lines.\n *\n * It will add an ellipsis (`…`) to the text at the end of the last line, only if the text was\n * truncated. If the text fits without it being truncated, no ellipsis is added.\n *\n * By default, the text is not truncated at all, no matter how many lines it takes to render it.\n *\n * @default undefined\n */\n lineClamp?: 1 | 2 | 3 | 4 | 5 | '1' | '2' | '3' | '4' | '5'\n /**\n * How to align the heading text horizontally.\n *\n * @default 'start'\n */\n align?: BoxProps['textAlign']\n}\n\nconst Heading = React.forwardRef<HTMLHeadingElement, HeadingProps & ObfuscatedClassName>(\n function Heading(\n {\n level,\n weight = 'regular',\n size,\n tone = 'normal',\n children,\n lineClamp,\n align,\n exceptionallySetClassName,\n ...props\n },\n ref,\n ) {\n // In TypeScript v4.1, this would be properly recognized without needing the type assertion\n // https://devblogs.microsoft.com/typescript/announcing-typescript-4-1-beta/#template-literal-types\n const headingElementName = `h${level}` as HeadingElement\n const lineClampMultipleLines =\n typeof lineClamp === 'string' ? parseInt(lineClamp, 10) > 1 : (lineClamp || 0) > 1\n\n return (\n <Box\n {...props}\n className={[\n exceptionallySetClassName,\n styles.heading,\n weight !== 'regular' ? getClassNames(styles, 'weight', weight) : null,\n tone !== 'normal' ? getClassNames(styles, 'tone', tone) : null,\n getClassNames(styles, 'size', size),\n lineClampMultipleLines ? styles.lineClampMultipleLines : null,\n lineClamp ? getClassNames(styles, 'lineClamp', lineClamp.toString()) : null,\n ]}\n textAlign={align}\n // Prevents emojis from being cut-off\n // See https://github.com/Doist/reactist/pull/528\n paddingRight={lineClamp ? 'xsmall' : undefined}\n as={headingElementName}\n ref={ref}\n >\n {children}\n </Box>\n )\n },\n)\n\nexport type { HeadingProps, HeadingLevel }\nexport { Heading }\n"],"names":["React","ref","level","weight","size","tone","children","lineClamp","align","exceptionallySetClassName","props","headingElementName","lineClampMultipleLines","parseInt","Box","className","styles","heading","getClassNames","toString","textAlign","paddingRight","undefined","as"],"mappings":"+WAsEgBA,cACZ,WAYIC,OAXAC,MACIA,EADJC,OAEIA,EAAS,UAFbC,KAGIA,EAHJC,KAIIA,EAAO,SAJXC,SAKIA,EALJC,UAMIA,EANJC,MAOIA,EAPJC,0BAQIA,KACGC,iCAMP,MAAMC,MAAyBT,EACzBU,EACmB,iBAAdL,EAAyBM,SAASN,EAAW,IAAM,GAAKA,GAAa,GAAK,EAErF,OACIP,gBAACc,yCACOJ,OACJK,UAAW,CACPN,EACAO,UAAOC,QACI,YAAXd,EAAuBe,gBAAcF,UAAQ,SAAUb,GAAU,KACxD,WAATE,EAAoBa,gBAAcF,UAAQ,OAAQX,GAAQ,KAC1Da,gBAAcF,UAAQ,OAAQZ,GAC9BQ,EAAyBI,UAAOJ,uBAAyB,KACzDL,EAAYW,gBAAcF,UAAQ,YAAaT,EAAUY,YAAc,MAE3EC,UAAWZ,EAGXa,aAAcd,EAAY,cAAWe,EACrCC,GAAIZ,EACJV,IAAKA,IAEJK"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={heading:"
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={heading:"bff24867","weight-medium":"_9b540c61","weight-light":"c6729907","tone-secondary":"d6507f70","tone-danger":"d1846d93","size-largest":"_7cbdd1ba","size-larger":"b3e14969","size-smaller":"be14a265",lineClampMultipleLines:"_71391f13","lineClamp-1":"_97298b1b","lineClamp-2":"_6d357d76","lineClamp-3":"d820b451","lineClamp-4":"_8d37487d","lineClamp-5":"_5215b4d7"};
|
|
2
2
|
//# sourceMappingURL=heading.module.css.js.map
|
package/package.json
CHANGED
package/styles/heading.css
CHANGED
|
@@ -3,4 +3,4 @@
|
|
|
3
3
|
.c7813d79{margin-top:var(--reactist-spacing-xsmall)}.d3449da6{margin-top:var(--reactist-spacing-small)}._4ea254c1{margin-top:var(--reactist-spacing-medium)}.c0844f64{margin-top:var(--reactist-spacing-large)}._213145b4{margin-top:var(--reactist-spacing-xlarge)}.df61c84c{margin-top:var(--reactist-spacing-xxlarge)}.efe72b13{margin-top:calc(var(--reactist-spacing-xsmall)*-1)}._870c2768{margin-top:calc(var(--reactist-spacing-small)*-1)}._0b927c57{margin-top:calc(var(--reactist-spacing-medium)*-1)}._461db014{margin-top:calc(var(--reactist-spacing-large)*-1)}._2a3a8cb8{margin-top:calc(var(--reactist-spacing-xlarge)*-1)}._9bcda921{margin-top:calc(var(--reactist-spacing-xxlarge)*-1)}@media (min-width:768px){._6add01e4{margin-top:var(--reactist-spacing-xsmall)}._735ef86b{margin-top:var(--reactist-spacing-small)}._0477d068{margin-top:var(--reactist-spacing-medium)}._2c90af97{margin-top:var(--reactist-spacing-large)}._63a82db6{margin-top:var(--reactist-spacing-xlarge)}._03cd7726{margin-top:var(--reactist-spacing-xxlarge)}.c986a62a{margin-top:calc(var(--reactist-spacing-xsmall)*-1)}.be2bdcdd{margin-top:calc(var(--reactist-spacing-small)*-1)}._47d2686b{margin-top:calc(var(--reactist-spacing-medium)*-1)}._25e5af9d{margin-top:calc(var(--reactist-spacing-large)*-1)}.ee82f441{margin-top:calc(var(--reactist-spacing-xlarge)*-1)}.a6f9d404{margin-top:calc(var(--reactist-spacing-xxlarge)*-1)}}@media (min-width:992px){._4d8d9a36{margin-top:var(--reactist-spacing-xsmall)}.e813cee7{margin-top:var(--reactist-spacing-small)}._56975b7d{margin-top:var(--reactist-spacing-medium)}._53b367f6{margin-top:var(--reactist-spacing-large)}.d69e7311{margin-top:var(--reactist-spacing-xlarge)}._92f57c7e{margin-top:var(--reactist-spacing-xxlarge)}._96880d3e{margin-top:calc(var(--reactist-spacing-xsmall)*-1)}.dc3f3555{margin-top:calc(var(--reactist-spacing-small)*-1)}._86dd06bb{margin-top:calc(var(--reactist-spacing-medium)*-1)}.c93ef12e{margin-top:calc(var(--reactist-spacing-large)*-1)}.bc8fd4a2{margin-top:calc(var(--reactist-spacing-xlarge)*-1)}.b12a9124{margin-top:calc(var(--reactist-spacing-xxlarge)*-1)}}._6016f4fb{margin-right:var(--reactist-spacing-xsmall)}.b85e3dfa{margin-right:var(--reactist-spacing-small)}._297575f4{margin-right:var(--reactist-spacing-medium)}.b401ac6c{margin-right:var(--reactist-spacing-large)}.dc3ec387{margin-right:var(--reactist-spacing-xlarge)}._24694604{margin-right:var(--reactist-spacing-xxlarge)}._8e9bf2ee{margin-right:calc(var(--reactist-spacing-xsmall)*-1)}.ae9d1115{margin-right:calc(var(--reactist-spacing-small)*-1)}._14e46fc3{margin-right:calc(var(--reactist-spacing-medium)*-1)}._3370631b{margin-right:calc(var(--reactist-spacing-large)*-1)}._3f0e9b50{margin-right:calc(var(--reactist-spacing-xlarge)*-1)}.bc13e010{margin-right:calc(var(--reactist-spacing-xxlarge)*-1)}@media (min-width:768px){._6fa1aae3{margin-right:var(--reactist-spacing-xsmall)}._2976c5cb{margin-right:var(--reactist-spacing-small)}._38d94802{margin-right:var(--reactist-spacing-medium)}.db9569b5{margin-right:var(--reactist-spacing-large)}._4a52f06d{margin-right:var(--reactist-spacing-xlarge)}._8a0f0410{margin-right:var(--reactist-spacing-xxlarge)}.e7d40e9d{margin-right:calc(var(--reactist-spacing-xsmall)*-1)}._680fde91{margin-right:calc(var(--reactist-spacing-small)*-1)}._021010ca{margin-right:calc(var(--reactist-spacing-medium)*-1)}._9e52c87c{margin-right:calc(var(--reactist-spacing-large)*-1)}._4d602613{margin-right:calc(var(--reactist-spacing-xlarge)*-1)}._21b1b65a{margin-right:calc(var(--reactist-spacing-xxlarge)*-1)}}@media (min-width:992px){._7321bc07{margin-right:var(--reactist-spacing-xsmall)}.fa1721f4{margin-right:var(--reactist-spacing-small)}._3fd7b4b8{margin-right:var(--reactist-spacing-medium)}._4fdc2f74{margin-right:var(--reactist-spacing-large)}.c0254761{margin-right:var(--reactist-spacing-xlarge)}._710a5f09{margin-right:var(--reactist-spacing-xxlarge)}.e08bee7f{margin-right:calc(var(--reactist-spacing-xsmall)*-1)}.e5ab73d2{margin-right:calc(var(--reactist-spacing-small)*-1)}._5e731477{margin-right:calc(var(--reactist-spacing-medium)*-1)}._0f57a22e{margin-right:calc(var(--reactist-spacing-large)*-1)}._25f26ed3{margin-right:calc(var(--reactist-spacing-xlarge)*-1)}._11a3b4e0{margin-right:calc(var(--reactist-spacing-xxlarge)*-1)}}._6a4f69f7{margin-bottom:var(--reactist-spacing-xsmall)}.db26b033{margin-bottom:var(--reactist-spacing-small)}.c7313022{margin-bottom:var(--reactist-spacing-medium)}.a5885889{margin-bottom:var(--reactist-spacing-large)}._33dfbd8e{margin-bottom:var(--reactist-spacing-xlarge)}._795ad2de{margin-bottom:var(--reactist-spacing-xxlarge)}.a329dbd3{margin-bottom:calc(var(--reactist-spacing-xsmall)*-1)}._85e739fb{margin-bottom:calc(var(--reactist-spacing-small)*-1)}._681f65ff{margin-bottom:calc(var(--reactist-spacing-medium)*-1)}.caf50d8f{margin-bottom:calc(var(--reactist-spacing-large)*-1)}._1e084cbf{margin-bottom:calc(var(--reactist-spacing-xlarge)*-1)}._3dfb1c7e{margin-bottom:calc(var(--reactist-spacing-xxlarge)*-1)}@media (min-width:768px){.ef4735be{margin-bottom:var(--reactist-spacing-xsmall)}.de55afba{margin-bottom:var(--reactist-spacing-small)}._0e33ce88{margin-bottom:var(--reactist-spacing-medium)}._8ca391fc{margin-bottom:var(--reactist-spacing-large)}._3a609d23{margin-bottom:var(--reactist-spacing-xlarge)}._3e1177e4{margin-bottom:var(--reactist-spacing-xxlarge)}.d384884d{margin-bottom:calc(var(--reactist-spacing-xsmall)*-1)}._75254cec{margin-bottom:calc(var(--reactist-spacing-small)*-1)}._5d9f127d{margin-bottom:calc(var(--reactist-spacing-medium)*-1)}._835f1089{margin-bottom:calc(var(--reactist-spacing-large)*-1)}.dad52a72{margin-bottom:calc(var(--reactist-spacing-xlarge)*-1)}._8703a4bf{margin-bottom:calc(var(--reactist-spacing-xxlarge)*-1)}}@media (min-width:992px){._90fd20e9{margin-bottom:var(--reactist-spacing-xsmall)}.f3769191{margin-bottom:var(--reactist-spacing-small)}._156410f8{margin-bottom:var(--reactist-spacing-medium)}._7fed74d0{margin-bottom:var(--reactist-spacing-large)}._477dc10e{margin-bottom:var(--reactist-spacing-xlarge)}._85c82d89{margin-bottom:var(--reactist-spacing-xxlarge)}._4f09c1e0{margin-bottom:calc(var(--reactist-spacing-xsmall)*-1)}._9523e048{margin-bottom:calc(var(--reactist-spacing-small)*-1)}.efe10240{margin-bottom:calc(var(--reactist-spacing-medium)*-1)}.c43971e6{margin-bottom:calc(var(--reactist-spacing-large)*-1)}.f9b4da15{margin-bottom:calc(var(--reactist-spacing-xlarge)*-1)}.a10fdf70{margin-bottom:calc(var(--reactist-spacing-xxlarge)*-1)}}.f9be90b4{margin-left:var(--reactist-spacing-xsmall)}.f53218d5{margin-left:var(--reactist-spacing-small)}.c4a9b3ab{margin-left:var(--reactist-spacing-medium)}._5755e2c3{margin-left:var(--reactist-spacing-large)}._33fc9354{margin-left:var(--reactist-spacing-xlarge)}._4749a3bf{margin-left:var(--reactist-spacing-xxlarge)}.c76cb3c7{margin-left:calc(var(--reactist-spacing-xsmall)*-1)}._96003c07{margin-left:calc(var(--reactist-spacing-small)*-1)}._09988d07{margin-left:calc(var(--reactist-spacing-medium)*-1)}.b4a486f6{margin-left:calc(var(--reactist-spacing-large)*-1)}.f396e75e{margin-left:calc(var(--reactist-spacing-xlarge)*-1)}._81d1f26d{margin-left:calc(var(--reactist-spacing-xxlarge)*-1)}@media (min-width:768px){._0a46e8f1{margin-left:var(--reactist-spacing-xsmall)}._57c970af{margin-left:var(--reactist-spacing-small)}._4b6099d3{margin-left:var(--reactist-spacing-medium)}._378fcff5{margin-left:var(--reactist-spacing-large)}.f8785663{margin-left:var(--reactist-spacing-xlarge)}._72f957ee{margin-left:var(--reactist-spacing-xxlarge)}._2288c7e1{margin-left:calc(var(--reactist-spacing-xsmall)*-1)}.b27c1c05{margin-left:calc(var(--reactist-spacing-small)*-1)}._702cbb13{margin-left:calc(var(--reactist-spacing-medium)*-1)}._1a2748b4{margin-left:calc(var(--reactist-spacing-large)*-1)}.b8c043a5{margin-left:calc(var(--reactist-spacing-xlarge)*-1)}._8dc8ff63{margin-left:calc(var(--reactist-spacing-xxlarge)*-1)}}@media (min-width:992px){.c2af646d{margin-left:var(--reactist-spacing-xsmall)}.c03d07be{margin-left:var(--reactist-spacing-small)}._915fb1d3{margin-left:var(--reactist-spacing-medium)}._64214ee1{margin-left:var(--reactist-spacing-large)}._7be4a22c{margin-left:var(--reactist-spacing-xlarge)}._5ec0a401{margin-left:var(--reactist-spacing-xxlarge)}.ea29f1ee{margin-left:calc(var(--reactist-spacing-xsmall)*-1)}.c26652c7{margin-left:calc(var(--reactist-spacing-small)*-1)}.c24f6af9{margin-left:calc(var(--reactist-spacing-medium)*-1)}.c2671f27{margin-left:calc(var(--reactist-spacing-large)*-1)}.cc51a04e{margin-left:calc(var(--reactist-spacing-xlarge)*-1)}.fd581f54{margin-left:calc(var(--reactist-spacing-xxlarge)*-1)}}
|
|
4
4
|
._68ab48ca{min-width:0}._6fa2b565{min-width:var(--reactist-width-xsmall)}.dd50fabd{min-width:var(--reactist-width-small)}.e7e2c808{min-width:var(--reactist-width-medium)}._6abbe25e{min-width:var(--reactist-width-large)}._54f479ac{min-width:var(--reactist-width-xlarge)}._148492bc{max-width:var(--reactist-width-xsmall)}.bd023b96{max-width:var(--reactist-width-small)}.e102903f{max-width:var(--reactist-width-medium)}._0e8d76d7{max-width:var(--reactist-width-large)}._47a031d0{max-width:var(--reactist-width-xlarge)}.cd4c8183{max-width:100%}._5f5959e8{width:0}._8c75067a{width:100%}._56a651f6{width:auto}._26f87bb8{width:-moz-max-content;width:-webkit-max-content;width:max-content}._07a6ab44{width:-moz-min-content;width:-webkit-min-content;width:min-content}.a87016fa{width:-moz-fit-content;width:-webkit-fit-content;width:fit-content}._1a972e50{width:var(--reactist-width-xsmall)}.c96d8261{width:var(--reactist-width-small)}.f3829d42{width:var(--reactist-width-medium)}._2caef228{width:var(--reactist-width-large)}._069e1491{width:var(--reactist-width-xlarge)}
|
|
5
5
|
._64ed24f4{gap:0}._2580a74b{gap:var(--reactist-spacing-xsmall)}.c68f8bf6{gap:var(--reactist-spacing-small)}._43e5f8e9{gap:var(--reactist-spacing-medium)}._966b120f{gap:var(--reactist-spacing-large)}.f957894c{gap:var(--reactist-spacing-xlarge)}._8cca104b{gap:var(--reactist-spacing-xxlarge)}@media (min-width:768px){._5797cee2{gap:0}._9015672f{gap:var(--reactist-spacing-xsmall)}._7ec86eec{gap:var(--reactist-spacing-small)}._714d7179{gap:var(--reactist-spacing-medium)}.ae1deb59{gap:var(--reactist-spacing-large)}.e1cfce55{gap:var(--reactist-spacing-xlarge)}._168a8ff8{gap:var(--reactist-spacing-xxlarge)}}@media (min-width:992px){._43e2b619{gap:0}._0ea9bf88{gap:var(--reactist-spacing-xsmall)}.d451307a{gap:var(--reactist-spacing-small)}.bf93cf66{gap:var(--reactist-spacing-medium)}._1430cddf{gap:var(--reactist-spacing-large)}.fa00c93e{gap:var(--reactist-spacing-xlarge)}._6f3aee54{gap:var(--reactist-spacing-xxlarge)}}
|
|
6
|
-
.
|
|
6
|
+
.bff24867{color:var(--reactist-content-primary);font-weight:var(--reactist-font-weight-strong);font-family:var(--reactist-font-family)}._9b540c61{font-weight:var(--reactist-font-weight-medium)}.c6729907{font-weight:var(--reactist-font-weight-regular)}.d6507f70{color:var(--reactist-content-secondary)}.d1846d93{color:#d1453b}h1.bff24867{font-size:var(--reactist-font-size-header)}h1._7cbdd1ba{font-size:var(--reactist-font-size-header-xlarge)}h1.b3e14969{font-size:var(--reactist-font-size-header-large)}h1.be14a265,h2.bff24867{font-size:var(--reactist-font-size-subtitle)}h2._7cbdd1ba{font-size:var(--reactist-font-size-header-large)}h2.b3e14969{font-size:var(--reactist-font-size-header)}h2.be14a265,h3.bff24867{font-size:var(--reactist-font-size-body)}h3._7cbdd1ba{font-size:var(--reactist-font-size-header)}h3.b3e14969{font-size:var(--reactist-font-size-subtitle)}h3.be14a265{font-size:var(--reactist-font-size-caption)}h4.bff24867,h5.bff24867,h6.bff24867{font-size:var(--reactist-font-size-body)}h4._7cbdd1ba,h5._7cbdd1ba,h6._7cbdd1ba{font-size:var(--reactist-font-size-header)}h4.b3e14969,h5.b3e14969,h6.b3e14969{font-size:var(--reactist-font-size-subtitle)}._71391f13{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}._97298b1b{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}._6d357d76{-webkit-line-clamp:2}.d820b451{-webkit-line-clamp:3}._8d37487d{-webkit-line-clamp:4}._5215b4d7{-webkit-line-clamp:5}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
.bff24867{color:var(--reactist-content-primary);font-weight:var(--reactist-font-weight-strong);font-family:var(--reactist-font-family)}._9b540c61{font-weight:var(--reactist-font-weight-medium)}.c6729907{font-weight:var(--reactist-font-weight-regular)}.d6507f70{color:var(--reactist-content-secondary)}.d1846d93{color:#d1453b}h1.bff24867{font-size:var(--reactist-font-size-header)}h1._7cbdd1ba{font-size:var(--reactist-font-size-header-xlarge)}h1.b3e14969{font-size:var(--reactist-font-size-header-large)}h1.be14a265,h2.bff24867{font-size:var(--reactist-font-size-subtitle)}h2._7cbdd1ba{font-size:var(--reactist-font-size-header-large)}h2.b3e14969{font-size:var(--reactist-font-size-header)}h2.be14a265,h3.bff24867{font-size:var(--reactist-font-size-body)}h3._7cbdd1ba{font-size:var(--reactist-font-size-header)}h3.b3e14969{font-size:var(--reactist-font-size-subtitle)}h3.be14a265{font-size:var(--reactist-font-size-caption)}h4.bff24867,h5.bff24867,h6.bff24867{font-size:var(--reactist-font-size-body)}h4._7cbdd1ba,h5._7cbdd1ba,h6._7cbdd1ba{font-size:var(--reactist-font-size-header)}h4.b3e14969,h5.b3e14969,h6.b3e14969{font-size:var(--reactist-font-size-subtitle)}._71391f13{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}._97298b1b{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}._6d357d76{-webkit-line-clamp:2}.d820b451{-webkit-line-clamp:3}._8d37487d{-webkit-line-clamp:4}._5215b4d7{-webkit-line-clamp:5}
|
package/styles/reactist.css
CHANGED
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
:root{--reactist-spinner-tint:var(--reactist-bg-brand);--reactist-spinner-fill:var(--reactist-framework-fill-crest)}@-webkit-keyframes _54fbe2b3{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes _54fbe2b3{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}._51539197{-webkit-animation-name:_54fbe2b3;animation-name:_54fbe2b3;-webkit-animation-duration:1.2s;animation-duration:1.2s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-timing-function:linear;animation-timing-function:linear}.a0c466ed{fill:var(--reactist-spinner-tint)}._745b73d3{fill:var(--reactist-spinner-fill)}
|
|
14
14
|
._464500ae{color:var(--reactist-content-primary)}._1abfe147 svg{color:var(--reactist-alert-tone-info-icon)}._36ce9859 svg{color:var(--reactist-alert-tone-positive-icon)}.f92214b7 svg{color:var(--reactist-alert-tone-caution-icon)}.be6cf28e svg{color:var(--reactist-alert-tone-critical-icon)}
|
|
15
15
|
._616cc3f3{bottom:0;pointer-events:none;z-index:var(--reactist-stacking-order-toast)}._1b5f8e86{pointer-events:all;gap:var(--reactist-spacing-medium);box-shadow:var(--reactist-toast-box-shadow)}.ce2e3476{color:var(--reactist-content-primary)}@media (max-width:500px){._1b5f8e86{width:100%!important}}
|
|
16
|
-
.
|
|
16
|
+
.bff24867{color:var(--reactist-content-primary);font-weight:var(--reactist-font-weight-strong);font-family:var(--reactist-font-family)}._9b540c61{font-weight:var(--reactist-font-weight-medium)}.c6729907{font-weight:var(--reactist-font-weight-regular)}.d6507f70{color:var(--reactist-content-secondary)}.d1846d93{color:#d1453b}h1.bff24867{font-size:var(--reactist-font-size-header)}h1._7cbdd1ba{font-size:var(--reactist-font-size-header-xlarge)}h1.b3e14969{font-size:var(--reactist-font-size-header-large)}h1.be14a265,h2.bff24867{font-size:var(--reactist-font-size-subtitle)}h2._7cbdd1ba{font-size:var(--reactist-font-size-header-large)}h2.b3e14969{font-size:var(--reactist-font-size-header)}h2.be14a265,h3.bff24867{font-size:var(--reactist-font-size-body)}h3._7cbdd1ba{font-size:var(--reactist-font-size-header)}h3.b3e14969{font-size:var(--reactist-font-size-subtitle)}h3.be14a265{font-size:var(--reactist-font-size-caption)}h4.bff24867,h5.bff24867,h6.bff24867{font-size:var(--reactist-font-size-body)}h4._7cbdd1ba,h5._7cbdd1ba,h6._7cbdd1ba{font-size:var(--reactist-font-size-header)}h4.b3e14969,h5.b3e14969,h6.b3e14969{font-size:var(--reactist-font-size-subtitle)}._71391f13{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}._97298b1b{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}._6d357d76{-webkit-line-clamp:2}.d820b451{-webkit-line-clamp:3}._8d37487d{-webkit-line-clamp:4}._5215b4d7{-webkit-line-clamp:5}
|
|
17
17
|
.a83bd4e0{font-family:var(--reactist-font-family);font-size:var(--reactist-font-size-body);font-weight:var(--reactist-font-weight-regular);color:var(--reactist-content-primary)}._266d6623{font-size:var(--reactist-font-size-caption)}.a8d37c6e{font-size:var(--reactist-font-size-copy)}._39f4eb1f{font-size:var(--reactist-font-size-subtitle)}._7be5c531{font-weight:var(--reactist-font-weight-medium)}.e214ff2e{font-weight:var(--reactist-font-weight-strong)}._6a3e5ade{color:var(--reactist-content-secondary)}._8f5b5f2b{color:var(--reactist-content-danger)}._9ae47ae4{color:var(--reactist-content-positive)}._969f18f7{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}._2f303ac3{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.d3e04245{-webkit-line-clamp:2}._33411704{-webkit-line-clamp:3}.bfc32640{-webkit-line-clamp:4}.f813c82f{-webkit-line-clamp:5}
|
|
18
18
|
:root{--reactist-prose-code-fill:#f7fafb;--reactist-prose-code-tint:var(--reactist-content-primary);--reactist-prose-code-border:var(--reactist-divider-primary);--reactist-prose-quote-tint:#4a6368;--reactist-prose-link-idle-tint:#006f85;--reactist-prose-link-idle-underline:var(--reactist-divider-primary);--reactist-prose-link-hover-tint:#006f85;--reactist-prose-link-hover-underline:#006f85;--reactist-prose-content-font-size:15px;--reactist-prose-em-multiplier:1.5;--reactist-prose-space-1:calc(var(--reactist-prose-em-multiplier)*var(--reactist-prose-content-font-size)/3);--reactist-prose-space-2:calc(var(--reactist-prose-em-multiplier)*var(--reactist-prose-content-font-size)*2/3);--reactist-prose-space-3:calc(var(--reactist-prose-em-multiplier)*var(--reactist-prose-content-font-size)*1);--reactist-prose-space-4:calc(var(--reactist-prose-em-multiplier)*var(--reactist-prose-content-font-size)*4/3);--reactist-prose-space-6:calc(var(--reactist-prose-em-multiplier)*var(--reactist-prose-content-font-size)*5/3)}._560c1e08{font-size:var(--reactist-prose-content-font-size);color:var(--reactist-content-primary);line-height:1.65;overflow-wrap:break-word;word-wrap:break-word;word-break:break-word}._560c1e08,._560c1e08 *,._560c1e08 :after,._560c1e08 :before{box-sizing:border-box}._560c1e08 p{margin-top:var(--reactist-prose-space-2)}._560c1e08 h1,._560c1e08 h2,._560c1e08 h3,._560c1e08 h4,._560c1e08 h5,._560c1e08 h6{font-weight:600;margin:0}._560c1e08 h1{font-size:1.35em;margin-top:var(--reactist-prose-space-4);line-height:1.35}._560c1e08 h2{font-size:1.2em;margin-top:var(--reactist-prose-space-3);line-height:1.45}._560c1e08 h1 *,._560c1e08 h2 *{font-size:1em}._560c1e08 h3,._560c1e08 h4,._560c1e08 h5,._560c1e08 h6{font-size:inherit;margin-top:var(--reactist-prose-space-2);line-height:inherit}._560c1e08 ol,._560c1e08 ul{margin:var(--reactist-prose-space-1) 0 0;padding-left:var(--reactist-prose-space-4)}._560c1e08 ol li p,._560c1e08 ul li p{margin-block:var(--reactist-prose-space-1)}._560c1e08 ol li p:first-child,._560c1e08 ul li p:first-child{margin:0}._560c1e08 ul{list-style:disc}._560c1e08 ul ul{list-style:circle}._560c1e08 ul ul ul{list-style:square}._560c1e08 ol{list-style:decimal}._560c1e08 li+li,._560c1e08 ol ol,._560c1e08 ol ul,._560c1e08 ul ol,._560c1e08 ul ul{margin-top:calc(0.5*var(--reactist-prose-space-1))}._560c1e08 ol li{padding-left:4px}._560c1e08 ul li::marker{font-size:.9em}._560c1e08 hr{margin-block:var(--reactist-prose-space-2);border:none;border-top:1px solid var(--reactist-divider-secondary)}._560c1e08 blockquote{color:var(--reactist-prose-quote-tint);padding:0;padding-block:0;padding-inline:var(--reactist-spacing-large);margin:0;margin-block:var(--reactist-prose-space-2);position:relative}._560c1e08 blockquote:before{content:"";border-left:2px solid var(--reactist-divider-primary);position:absolute;top:.25em;bottom:.25em;left:0}._560c1e08 blockquote :first-child{margin-top:0}._560c1e08 blockquote code{color:inherit}._560c1e08 :not(pre)>code,._560c1e08 pre{color:var(--reactist-prose-code-tint);background-color:var(--reactist-prose-code-fill);border:1px solid var(--reactist-prose-code-border);border-radius:var(--reactist-border-radius-small);font-family:var(--reactist-font-family-monospace);font-size:.875em;line-height:1.6}._560c1e08 :not(pre)>code{padding:2px 4px}._560c1e08 pre{margin:var(--reactist-prose-space-2) 0 0;padding:var(--reactist-prose-space-1) var(--reactist-prose-space-2)}._560c1e08 pre code{white-space:break-spaces;overflow:auto}._560c1e08 h1+*{margin-top:var(--reactist-prose-space-1)!important}._560c1e08 h1+h2,._560c1e08 h2+h3,._560c1e08 h3+h4,._560c1e08 h4+h5,._560c1e08 h5+h6{margin-top:var(--reactist-prose-space-3)!important}._560c1e08 h2+:not(h3){margin-top:var(--reactist-prose-space-1)!important}._560c1e08 em{font-style:italic}._560c1e08 b,._560c1e08 strong{font-weight:600}._560c1e08 a,._560c1e08 a code{color:var(--reactist-prose-link-idle-tint);-webkit-text-decoration-line:underline;text-decoration-line:underline;-webkit-text-decoration-style:solid;text-decoration-style:solid;-webkit-text-decoration-color:var(--reactist-prose-link-idle-underline);text-decoration-color:var(--reactist-prose-link-idle-underline)}._560c1e08 a:active,._560c1e08 a:active code,._560c1e08 a:focus,._560c1e08 a:focus code,._560c1e08 a:hover,._560c1e08 a:hover code{color:var(--reactist-prose-link-hover-tint);-webkit-text-decoration-color:var(--reactist-prose-link-hover-underline);text-decoration-color:var(--reactist-prose-link-hover-underline)}._560c1e08._8b53b13e{letter-spacing:.0065em}._560c1e08._8b53b13e h1,._560c1e08._8b53b13e h2{letter-spacing:.0125em}._560c1e08._8b53b13e b,._560c1e08._8b53b13e b *,._560c1e08._8b53b13e strong,._560c1e08._8b53b13e strong *{letter-spacing:.01em}
|
|
19
19
|
:root{--reactist-button-small-font-size:var(--reactist-font-size-caption);--reactist-button-small-spacing:var(--reactist-spacing-small);--reactist-button-small-height:28px;--reactist-button-normal-font-size:var(--reactist-font-size-copy);--reactist-button-normal-spacing:var(--reactist-spacing-medium);--reactist-button-normal-height:32px;--reactist-button-large-font-size:var(--reactist-font-size-body);--reactist-button-large-spacing:var(--reactist-spacing-large);--reactist-button-large-height:36px;--reactist-actionable-primary-idle-tint:#fff;--reactist-actionable-primary-idle-fill:#008aa6;--reactist-actionable-primary-hover-tint:#fff;--reactist-actionable-primary-hover-fill:#007992;--reactist-actionable-primary-disabled-tint:#fff;--reactist-actionable-primary-disabled-fill:#99d0db;--reactist-actionable-secondary-idle-tint:#282f30;--reactist-actionable-secondary-idle-fill:#f2f6f7;--reactist-actionable-secondary-hover-tint:#282f30;--reactist-actionable-secondary-hover-fill:#e3e7e8;--reactist-actionable-secondary-disabled-tint:#a9acac;--reactist-actionable-secondary-disabled-fill:#f2f6f7;--reactist-actionable-tertiary-idle-tint:#006f85;--reactist-actionable-tertiary-hover-tint:#006f85;--reactist-actionable-tertiary-hover-fill:#f2f6f7;--reactist-actionable-tertiary-disabled-tint:#99c5ce;--reactist-actionable-quaternary-idle-tint:#6c777a;--reactist-actionable-quaternary-hover-tint:#282f30;--reactist-actionable-quaternary-hover-fill:#e0e7e8;--reactist-actionable-quaternary-disabled-tint:#c4c9ca;--reactist-actionable-primary-destructive-idle-tint:#fff;--reactist-actionable-primary-destructive-idle-fill:#dc4c3e;--reactist-actionable-primary-destructive-hover-tint:#fff;--reactist-actionable-primary-destructive-hover-fill:#b03d32;--reactist-actionable-primary-destructive-disabled-tint:#fff;--reactist-actionable-primary-destructive-disabled-fill:#f1b7b2;--reactist-actionable-secondary-destructive-idle-tint:#dc4c3e;--reactist-actionable-secondary-destructive-hover-tint:#b03d32;--reactist-actionable-secondary-destructive-hover-fill:transparent;--reactist-actionable-secondary-destructive-disabled-tint:#f1b7b2}._8313bd46{max-width:100%;display:flex;flex-direction:row;justify-content:center;align-items:center;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:inherit;background-color:transparent;border-radius:var(--reactist-border-radius-small);white-space:nowrap;font-family:var(--reactist-font-family);font-weight:var(--reactist-font-weight-medium);text-decoration:none;border:1px solid transparent;transition-duration:.3s;transition-property:color,background-color;transition-timing-function:cubic-bezier(.4,0,.2,1)}._0051d171{text-overflow:ellipsis;white-space:nowrap;font-size:inherit}._8313bd46:active:not([aria-disabled=true]){transform:scale(.97);transition:transform .2s cubic-bezier(.02,1.505,.745,1.235)}._8313bd46{padding:0 var(--reactist-btn-spacing);font-size:var(--reactist-btn-font-size);height:var(--reactist-btn-height);line-height:var(--reactist-btn-height);--reactist-spinner-tint:var(--reactist-btn-idle-tint);--reactist-spinner-fill:var(--reactist-btn-idle-fill)}._8313bd46._8eb8f0fa{border-radius:1000px}._8313bd46._8b7f1a82{--reactist-btn-height:var(--reactist-button-small-height);--reactist-btn-spacing:var(--reactist-button-small-spacing);--reactist-btn-font-size:var(--reactist-button-small-font-size)}._8313bd46._5e45d59f{--reactist-btn-height:var(--reactist-button-normal-height);--reactist-btn-spacing:var(--reactist-button-normal-spacing);--reactist-btn-font-size:var(--reactist-button-normal-font-size)}._8313bd46._95951888{--reactist-btn-height:var(--reactist-button-large-height);--reactist-btn-spacing:var(--reactist-button-large-spacing);--reactist-btn-font-size:var(--reactist-button-large-font-size)}._8313bd46:not(._43792df1){color:var(--reactist-btn-idle-tint);background-color:var(--reactist-btn-idle-fill)}._8313bd46:focus-visible:not([aria-disabled=true]),._8313bd46:hover:not([aria-disabled=true]),._8313bd46[aria-expanded=true]{color:var(--reactist-btn-hover-tint);background-color:var(--reactist-btn-hover-fill)}._8313bd46._43792df1{cursor:not-allowed;color:var(--reactist-btn-disabled-tint);background-color:var(--reactist-btn-disabled-fill)}._8313bd46:not(._8644eccb){min-width:68px}._8313bd46._8644eccb{width:var(--reactist-btn-height);height:var(--reactist-btn-height);padding:0}._8313bd46 .a44d4350{margin-right:calc(var(--reactist-btn-spacing) - 6px);margin-left:-6px}._8313bd46 ._073e1aa4{margin-left:calc(var(--reactist-btn-spacing) - 6px);margin-right:-6px}._8313bd46>*{pointer-events:none}._7a4dbd5f{--reactist-btn-idle-tint:var(--reactist-actionable-primary-idle-tint);--reactist-btn-idle-fill:var(--reactist-actionable-primary-idle-fill);--reactist-btn-hover-tint:var(--reactist-actionable-primary-hover-tint);--reactist-btn-hover-fill:var(--reactist-actionable-primary-hover-fill);--reactist-btn-disabled-tint:var(--reactist-actionable-primary-disabled-tint);--reactist-btn-disabled-fill:var(--reactist-actionable-primary-disabled-fill)}._54d56775{--reactist-btn-idle-tint:var(--reactist-actionable-secondary-idle-tint);--reactist-btn-idle-fill:var(--reactist-actionable-secondary-idle-fill);--reactist-btn-hover-tint:var(--reactist-actionable-secondary-hover-tint);--reactist-btn-hover-fill:var(--reactist-actionable-secondary-hover-fill);--reactist-btn-disabled-tint:var(--reactist-actionable-secondary-disabled-tint);--reactist-btn-disabled-fill:var(--reactist-actionable-secondary-disabled-fill)}._907a61ca{--reactist-btn-idle-tint:var(--reactist-actionable-tertiary-idle-tint);--reactist-btn-hover-tint:var(--reactist-actionable-tertiary-hover-tint);--reactist-btn-hover-fill:var(--reactist-actionable-tertiary-hover-fill);--reactist-btn-disabled-tint:var(--reactist-actionable-tertiary-disabled-tint)}.f169a390,._907a61ca{--reactist-btn-idle-fill:transparent;--reactist-btn-disabled-fill:transparent}.f169a390{--reactist-btn-idle-tint:var(--reactist-actionable-quaternary-idle-tint);--reactist-btn-hover-tint:var(--reactist-actionable-quaternary-hover-tint);--reactist-btn-hover-fill:var(--reactist-actionable-quaternary-hover-fill);--reactist-btn-disabled-tint:var(--reactist-actionable-quaternary-disabled-tint)}._7a4dbd5f.ccb3eb8c{--reactist-btn-idle-tint:var(--reactist-actionable-primary-destructive-idle-tint);--reactist-btn-idle-fill:var(--reactist-actionable-primary-destructive-idle-fill);--reactist-btn-hover-tint:var(--reactist-actionable-primary-destructive-hover-tint);--reactist-btn-hover-fill:var(--reactist-actionable-primary-destructive-hover-fill);--reactist-btn-disabled-tint:var(--reactist-actionable-primary-destructive-disabled-tint);--reactist-btn-disabled-fill:var(--reactist-actionable-primary-destructive-disabled-fill)}._54d56775.ccb3eb8c{--reactist-btn-idle-tint:var(--reactist-actionable-secondary-destructive-idle-tint);--reactist-btn-idle-fill:transparent;--reactist-btn-hover-tint:var(--reactist-actionable-secondary-destructive-hover-tint);--reactist-btn-hover-fill:var(--reactist-actionable-secondary-destructive-hover-fill);--reactist-btn-disabled-tint:var(--reactist-actionable-secondary-destructive-disabled-tint);--reactist-btn-disabled-fill:transparent;border-color:var(--reactist-btn-idle-tint)}._54d56775.ccb3eb8c:hover{border-color:var(--reactist-btn-hover-tint)}._54d56775.ccb3eb8c._43792df1{border-color:var(--reactist-btn-disabled-tint)}.f169a390.ccb3eb8c,._907a61ca.ccb3eb8c{--reactist-btn-idle-tint:var(--reactist-actionable-secondary-destructive-idle-tint);--reactist-btn-hover-tint:var(--reactist-actionable-secondary-destructive-hover-tint);--reactist-btn-disabled-tint:var(--reactist-actionable-secondary-destructive-disabled-tint)}
|