@elliemae/ds-typography 3.70.0-next.60 → 3.70.0-next.62

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.
@@ -41,7 +41,6 @@ const VARIANTS_CSS_BODY = {
41
41
  ${import_typographyFontFamily.typographyFontFamily}
42
42
  font-size: ${(props) => props.fontSize ?? "0.8775000000000001rem"};
43
43
  line-height: ${(props) => props.lineHeight ?? "1.1212499999999999rem"};
44
- color: ${(props) => props.theme.colors.neutral[700]};
45
44
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
46
45
  font-size: ${(props) => props.fontSize ?? "1.08rem"};
47
46
  line-height: ${(props) => props.lineHeight ?? "1.38rem"};
@@ -52,7 +51,6 @@ const VARIANTS_CSS_BODY = {
52
51
  ${import_typographyFontFamily.typographyFontFamily}
53
52
  font-size: ${(props) => props.fontSize ?? "0.8125rem"};
54
53
  line-height: ${(props) => props.lineHeight ?? "1rem"};
55
- color: ${(props) => props.theme.colors.neutral[700]};
56
54
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
57
55
  font-size: ${(props) => props.fontSize ?? "1rem"};
58
56
  line-height: ${(props) => props.lineHeight ?? "1.2307692308rem"};
@@ -63,7 +61,6 @@ const VARIANTS_CSS_BODY = {
63
61
  ${import_typographyFontFamily.typographyFontFamily}
64
62
  font-size: ${(props) => props.fontSize ?? "0.7475rem"};
65
63
  line-height: ${(props) => props.lineHeight ?? "0.999375rem"};
66
- color: ${(props) => props.theme.colors.neutral[700]};
67
64
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
68
65
  font-size: ${(props) => props.fontSize ?? "0.92rem"};
69
66
  line-height: ${(props) => props.lineHeight ?? "1.23rem"};
@@ -74,7 +71,6 @@ const VARIANTS_CSS_BODY = {
74
71
  ${import_typographyFontFamily.typographyFontFamily}
75
72
  font-size: ${(props) => props.fontSize ?? "0.6906249999999999rem"};
76
73
  line-height: ${(props) => props.lineHeight ?? "0.8125rem"};
77
- color: ${(props) => props.theme.colors.neutral[700]};
78
74
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
79
75
  font-size: ${(props) => props.fontSize ?? "0.85rem"};
80
76
  line-height: ${(props) => props.lineHeight ?? "1rem"};
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/parts/variants/body.ts", "../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import { css } from '@elliemae/ds-system';\nimport { TYPOGRAPHY_VARIANTS } from '../../constants/index.js';\nimport type { DSTypographyT } from '../../react-desc-prop-types.js';\nimport { typographyFontFamily } from '../typographyFontFamily.js';\n\n// typescript \"hack\" to infer the ReturnType of a generic function (css) with a generic argument (DSTypographyT.StyledPropsInterface)\n// as of 14/november/2023 I was not able to find a better way to do this.\nconst typedCss = () => css<DSTypographyT.StyledPropsInterface>``;\ntype BodyCSSMap = {\n [key in DSTypographyT.BodyVariants]: ReturnType<typeof typedCss>;\n};\n\n// as of 14/november/2023\n// mobile -> font-size: 16px\n// desktop -> font-size: 13px\n// the \"magic values\" of the rem units are the result of the following formula:\n// (variant's requirement px/RT value / 16px) for mobile\n// (variant's requirement px/RT value / 13px) for desktop\nexport const VARIANTS_CSS_BODY: BodyCSSMap = {\n [TYPOGRAPHY_VARIANTS.B1]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8775000000000001rem'};\n line-height: ${(props) => props.lineHeight ?? '1.1212499999999999rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.08rem'};\n line-height: ${(props) => props.lineHeight ?? '1.38rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B2]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8125rem'};\n line-height: ${(props) => props.lineHeight ?? '1rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1rem'};\n line-height: ${(props) => props.lineHeight ?? '1.2307692308rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B3]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.7475rem'};\n line-height: ${(props) => props.lineHeight ?? '0.999375rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '0.92rem'};\n line-height: ${(props) => props.lineHeight ?? '1.23rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B4]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.6906249999999999rem'};\n line-height: ${(props) => props.lineHeight ?? '0.8125rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '0.85rem'};\n line-height: ${(props) => props.lineHeight ?? '1rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B1_LIGHT]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8775000000000001rem'};\n line-height: ${(props) => props.lineHeight ?? '1.1212499999999999rem'};\n color: ${(props) => props.theme.colors.neutral[600]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.08rem'};\n line-height: ${(props) => props.lineHeight ?? '1.38rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B2_LIGHT]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8125rem'};\n line-height: ${(props) => props.lineHeight ?? '1rem'};\n color: ${(props) => props.theme.colors.neutral[600]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1rem'};\n line-height: ${(props) => props.lineHeight ?? '1.2307692308rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B3_LIGHT]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.7475rem'};\n line-height: ${(props) => props.lineHeight ?? '0.999375rem'};\n color: ${(props) => props.theme.colors.neutral[600]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '0.92rem'};\n line-height: ${(props) => props.lineHeight ?? '1.23rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B3_STRONG]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.7475rem'};\n line-height: ${(props) => props.lineHeight ?? '0.999375rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '0.92rem'};\n line-height: ${(props) => props.lineHeight ?? '1.23rem'};\n }\n font-weight: 600;\n `,\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import { css } from '@elliemae/ds-system';\nimport { TYPOGRAPHY_VARIANTS } from '../../constants/index.js';\nimport type { DSTypographyT } from '../../react-desc-prop-types.js';\nimport { typographyFontFamily } from '../typographyFontFamily.js';\n\n// typescript \"hack\" to infer the ReturnType of a generic function (css) with a generic argument (DSTypographyT.StyledPropsInterface)\n// as of 14/november/2023 I was not able to find a better way to do this.\nconst typedCss = () => css<DSTypographyT.StyledPropsInterface>``;\ntype BodyCSSMap = {\n [key in DSTypographyT.BodyVariants]: ReturnType<typeof typedCss>;\n};\n\n// as of 14/november/2023\n// mobile -> font-size: 16px\n// desktop -> font-size: 13px\n// the \"magic values\" of the rem units are the result of the following formula:\n// (variant's requirement px/RT value / 16px) for mobile\n// (variant's requirement px/RT value / 13px) for desktop\nexport const VARIANTS_CSS_BODY: BodyCSSMap = {\n [TYPOGRAPHY_VARIANTS.B1]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8775000000000001rem'};\n line-height: ${(props) => props.lineHeight ?? '1.1212499999999999rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.08rem'};\n line-height: ${(props) => props.lineHeight ?? '1.38rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B2]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8125rem'};\n line-height: ${(props) => props.lineHeight ?? '1rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1rem'};\n line-height: ${(props) => props.lineHeight ?? '1.2307692308rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B3]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.7475rem'};\n line-height: ${(props) => props.lineHeight ?? '0.999375rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '0.92rem'};\n line-height: ${(props) => props.lineHeight ?? '1.23rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B4]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.6906249999999999rem'};\n line-height: ${(props) => props.lineHeight ?? '0.8125rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '0.85rem'};\n line-height: ${(props) => props.lineHeight ?? '1rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B1_LIGHT]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8775000000000001rem'};\n line-height: ${(props) => props.lineHeight ?? '1.1212499999999999rem'};\n color: ${(props) => props.theme.colors.neutral[600]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.08rem'};\n line-height: ${(props) => props.lineHeight ?? '1.38rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B2_LIGHT]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8125rem'};\n line-height: ${(props) => props.lineHeight ?? '1rem'};\n color: ${(props) => props.theme.colors.neutral[600]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1rem'};\n line-height: ${(props) => props.lineHeight ?? '1.2307692308rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B3_LIGHT]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.7475rem'};\n line-height: ${(props) => props.lineHeight ?? '0.999375rem'};\n color: ${(props) => props.theme.colors.neutral[600]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '0.92rem'};\n line-height: ${(props) => props.lineHeight ?? '1.23rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B3_STRONG]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.7475rem'};\n line-height: ${(props) => props.lineHeight ?? '0.999375rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '0.92rem'};\n line-height: ${(props) => props.lineHeight ?? '1.23rem'};\n }\n font-weight: 600;\n `,\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -41,7 +41,6 @@ const VARIANTS_CSS_HEADER = {
41
41
  ${import_typographyFontFamily.typographyFontFamily}
42
42
  font-size: ${(props) => props.fontSize ?? "2.12875rem"};
43
43
  line-height: ${(props) => props.lineHeight ?? "2.5593749999999997rem"};
44
- color: ${(props) => props.theme.colors.neutral[700]};
45
44
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
46
45
  font-size: ${(props) => props.fontSize ?? "2.62rem"};
47
46
  line-height: ${(props) => props.lineHeight ?? "3.15rem"};
@@ -52,7 +51,6 @@ const VARIANTS_CSS_HEADER = {
52
51
  ${import_typographyFontFamily.typographyFontFamily}
53
52
  font-size: ${(props) => props.fontSize ?? "1.503125rem"};
54
53
  line-height: ${(props) => props.lineHeight ?? "1.9337499999999999rem"};
55
- color: ${(props) => props.theme.colors.neutral[700]};
56
54
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
57
55
  font-size: ${(props) => props.fontSize ?? "1.85rem"};
58
56
  line-height: ${(props) => props.lineHeight ?? "2.38rem"};
@@ -63,7 +61,6 @@ const VARIANTS_CSS_HEADER = {
63
61
  ${import_typographyFontFamily.typographyFontFamily}
64
62
  font-size: ${(props) => props.fontSize ?? "1.1212499999999999rem"};
65
63
  line-height: ${(props) => props.lineHeight ?? "1.373125rem"};
66
- color: ${(props) => props.theme.colors.neutral[700]};
67
64
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
68
65
  font-size: ${(props) => props.fontSize ?? "1.38rem"};
69
66
  line-height: ${(props) => props.lineHeight ?? "1.69rem"};
@@ -74,7 +71,6 @@ const VARIANTS_CSS_HEADER = {
74
71
  ${import_typographyFontFamily.typographyFontFamily}
75
72
  font-size: ${(props) => props.fontSize ?? "0.999375rem"};
76
73
  line-height: ${(props) => props.lineHeight ?? "1.25125rem"};
77
- color: ${(props) => props.theme.colors.neutral[700]};
78
74
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
79
75
  font-size: ${(props) => props.fontSize ?? "1.23rem"};
80
76
  line-height: ${(props) => props.lineHeight ?? "1.54rem"};
@@ -85,7 +81,6 @@ const VARIANTS_CSS_HEADER = {
85
81
  ${import_typographyFontFamily.typographyFontFamily}
86
82
  font-size: ${(props) => props.fontSize ?? "0.8775000000000001rem"};
87
83
  line-height: ${(props) => props.lineHeight ?? "1.064375rem"};
88
- color: ${(props) => props.theme.colors.neutral[700]};
89
84
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
90
85
  font-size: ${(props) => props.fontSize ?? "1.08rem"};
91
86
  line-height: ${(props) => props.lineHeight ?? "1.31rem"};
@@ -96,7 +91,6 @@ const VARIANTS_CSS_HEADER = {
96
91
  ${import_typographyFontFamily.typographyFontFamily}
97
92
  font-size: ${(props) => props.fontSize ?? "0.8775000000000001rem"};
98
93
  line-height: ${(props) => props.lineHeight ?? "1.064375rem"};
99
- color: ${(props) => props.theme.colors.neutral[700]};
100
94
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
101
95
  font-size: ${(props) => props.fontSize ?? "1.08rem"};
102
96
  line-height: ${(props) => props.lineHeight ?? "1.31rem"};
@@ -107,7 +101,6 @@ const VARIANTS_CSS_HEADER = {
107
101
  ${import_typographyFontFamily.typographyFontFamily}
108
102
  font-size: ${(props) => props.fontSize ?? "0.999375rem"};
109
103
  line-height: ${(props) => props.lineHeight ?? "1.25125rem"};
110
- color: ${(props) => props.theme.colors.neutral[700]};
111
104
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
112
105
  font-size: ${(props) => props.fontSize ?? "1.23rem"};
113
106
  line-height: ${(props) => props.lineHeight ?? "1.54rem"};
@@ -118,7 +111,6 @@ const VARIANTS_CSS_HEADER = {
118
111
  ${import_typographyFontFamily.typographyFontFamily}
119
112
  font-size: ${(props) => props.fontSize ?? "1.1212499999999999rem"};
120
113
  line-height: ${(props) => props.lineHeight ?? "1.373125rem"};
121
- color: ${(props) => props.theme.colors.neutral[700]};
122
114
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
123
115
  font-size: ${(props) => props.fontSize ?? "1.38rem"};
124
116
  line-height: ${(props) => props.lineHeight ?? "1.69rem"};
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/parts/variants/header.ts", "../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import { css } from '@elliemae/ds-system';\nimport { TYPOGRAPHY_VARIANTS } from '../../constants/index.js';\nimport type { DSTypographyT } from '../../react-desc-prop-types.js';\nimport { typographyFontFamily } from '../typographyFontFamily.js';\n\n// typescript \"hack\" to infer the ReturnType of a generic function (css) with a generic argument (DSTypographyT.StyledPropsInterface)\n// as of 14/november/2023 I was not able to find a better way to do this.\nconst typedCss = () => css<DSTypographyT.StyledPropsInterface>``;\ntype HeadingCSSMap = {\n [key in DSTypographyT.HeadingVariants]: ReturnType<typeof typedCss>;\n};\n\n// as of 14/november/2023\n// mobile -> font-size: 16px\n// desktop -> font-size: 13px\n// the \"magic values\" of the rem units are the result of the following formula:\n// (variant's requirement px/RT value / 16px) for mobile\n// (variant's requirement px/RT value / 13px) for desktop\nexport const VARIANTS_CSS_HEADER: HeadingCSSMap = {\n [TYPOGRAPHY_VARIANTS.H1]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '2.12875rem'};\n line-height: ${(props) => props.lineHeight ?? '2.5593749999999997rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '2.62rem'};\n line-height: ${(props) => props.lineHeight ?? '3.15rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.H2]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '1.503125rem'};\n line-height: ${(props) => props.lineHeight ?? '1.9337499999999999rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.85rem'};\n line-height: ${(props) => props.lineHeight ?? '2.38rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.H3]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '1.1212499999999999rem'};\n line-height: ${(props) => props.lineHeight ?? '1.373125rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.38rem'};\n line-height: ${(props) => props.lineHeight ?? '1.69rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.H4]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.999375rem'};\n line-height: ${(props) => props.lineHeight ?? '1.25125rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.23rem'};\n line-height: ${(props) => props.lineHeight ?? '1.54rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.H5]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8775000000000001rem'};\n line-height: ${(props) => props.lineHeight ?? '1.064375rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.08rem'};\n line-height: ${(props) => props.lineHeight ?? '1.31rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.H5_STRONG]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8775000000000001rem'};\n line-height: ${(props) => props.lineHeight ?? '1.064375rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.08rem'};\n line-height: ${(props) => props.lineHeight ?? '1.31rem'};\n }\n font-weight: 600;\n `,\n [TYPOGRAPHY_VARIANTS.H4_STRONG]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.999375rem'};\n line-height: ${(props) => props.lineHeight ?? '1.25125rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.23rem'};\n line-height: ${(props) => props.lineHeight ?? '1.54rem'};\n }\n font-weight: 600;\n `,\n [TYPOGRAPHY_VARIANTS.H3_STRONG]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '1.1212499999999999rem'};\n line-height: ${(props) => props.lineHeight ?? '1.373125rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.38rem'};\n line-height: ${(props) => props.lineHeight ?? '1.69rem'};\n }\n font-weight: 600;\n `,\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import { css } from '@elliemae/ds-system';\nimport { TYPOGRAPHY_VARIANTS } from '../../constants/index.js';\nimport type { DSTypographyT } from '../../react-desc-prop-types.js';\nimport { typographyFontFamily } from '../typographyFontFamily.js';\n\n// typescript \"hack\" to infer the ReturnType of a generic function (css) with a generic argument (DSTypographyT.StyledPropsInterface)\n// as of 14/november/2023 I was not able to find a better way to do this.\nconst typedCss = () => css<DSTypographyT.StyledPropsInterface>``;\ntype HeadingCSSMap = {\n [key in DSTypographyT.HeadingVariants]: ReturnType<typeof typedCss>;\n};\n\n// as of 14/november/2023\n// mobile -> font-size: 16px\n// desktop -> font-size: 13px\n// the \"magic values\" of the rem units are the result of the following formula:\n// (variant's requirement px/RT value / 16px) for mobile\n// (variant's requirement px/RT value / 13px) for desktop\nexport const VARIANTS_CSS_HEADER: HeadingCSSMap = {\n [TYPOGRAPHY_VARIANTS.H1]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '2.12875rem'};\n line-height: ${(props) => props.lineHeight ?? '2.5593749999999997rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '2.62rem'};\n line-height: ${(props) => props.lineHeight ?? '3.15rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.H2]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '1.503125rem'};\n line-height: ${(props) => props.lineHeight ?? '1.9337499999999999rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.85rem'};\n line-height: ${(props) => props.lineHeight ?? '2.38rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.H3]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '1.1212499999999999rem'};\n line-height: ${(props) => props.lineHeight ?? '1.373125rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.38rem'};\n line-height: ${(props) => props.lineHeight ?? '1.69rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.H4]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.999375rem'};\n line-height: ${(props) => props.lineHeight ?? '1.25125rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.23rem'};\n line-height: ${(props) => props.lineHeight ?? '1.54rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.H5]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8775000000000001rem'};\n line-height: ${(props) => props.lineHeight ?? '1.064375rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.08rem'};\n line-height: ${(props) => props.lineHeight ?? '1.31rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.H5_STRONG]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8775000000000001rem'};\n line-height: ${(props) => props.lineHeight ?? '1.064375rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.08rem'};\n line-height: ${(props) => props.lineHeight ?? '1.31rem'};\n }\n font-weight: 600;\n `,\n [TYPOGRAPHY_VARIANTS.H4_STRONG]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.999375rem'};\n line-height: ${(props) => props.lineHeight ?? '1.25125rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.23rem'};\n line-height: ${(props) => props.lineHeight ?? '1.54rem'};\n }\n font-weight: 600;\n `,\n [TYPOGRAPHY_VARIANTS.H3_STRONG]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '1.1212499999999999rem'};\n line-height: ${(props) => props.lineHeight ?? '1.373125rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.38rem'};\n line-height: ${(props) => props.lineHeight ?? '1.69rem'};\n }\n font-weight: 600;\n `,\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -8,7 +8,6 @@ const VARIANTS_CSS_BODY = {
8
8
  ${typographyFontFamily}
9
9
  font-size: ${(props) => props.fontSize ?? "0.8775000000000001rem"};
10
10
  line-height: ${(props) => props.lineHeight ?? "1.1212499999999999rem"};
11
- color: ${(props) => props.theme.colors.neutral[700]};
12
11
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
13
12
  font-size: ${(props) => props.fontSize ?? "1.08rem"};
14
13
  line-height: ${(props) => props.lineHeight ?? "1.38rem"};
@@ -19,7 +18,6 @@ const VARIANTS_CSS_BODY = {
19
18
  ${typographyFontFamily}
20
19
  font-size: ${(props) => props.fontSize ?? "0.8125rem"};
21
20
  line-height: ${(props) => props.lineHeight ?? "1rem"};
22
- color: ${(props) => props.theme.colors.neutral[700]};
23
21
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
24
22
  font-size: ${(props) => props.fontSize ?? "1rem"};
25
23
  line-height: ${(props) => props.lineHeight ?? "1.2307692308rem"};
@@ -30,7 +28,6 @@ const VARIANTS_CSS_BODY = {
30
28
  ${typographyFontFamily}
31
29
  font-size: ${(props) => props.fontSize ?? "0.7475rem"};
32
30
  line-height: ${(props) => props.lineHeight ?? "0.999375rem"};
33
- color: ${(props) => props.theme.colors.neutral[700]};
34
31
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
35
32
  font-size: ${(props) => props.fontSize ?? "0.92rem"};
36
33
  line-height: ${(props) => props.lineHeight ?? "1.23rem"};
@@ -41,7 +38,6 @@ const VARIANTS_CSS_BODY = {
41
38
  ${typographyFontFamily}
42
39
  font-size: ${(props) => props.fontSize ?? "0.6906249999999999rem"};
43
40
  line-height: ${(props) => props.lineHeight ?? "0.8125rem"};
44
- color: ${(props) => props.theme.colors.neutral[700]};
45
41
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
46
42
  font-size: ${(props) => props.fontSize ?? "0.85rem"};
47
43
  line-height: ${(props) => props.lineHeight ?? "1rem"};
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/variants/body.ts"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { css } from '@elliemae/ds-system';\nimport { TYPOGRAPHY_VARIANTS } from '../../constants/index.js';\nimport type { DSTypographyT } from '../../react-desc-prop-types.js';\nimport { typographyFontFamily } from '../typographyFontFamily.js';\n\n// typescript \"hack\" to infer the ReturnType of a generic function (css) with a generic argument (DSTypographyT.StyledPropsInterface)\n// as of 14/november/2023 I was not able to find a better way to do this.\nconst typedCss = () => css<DSTypographyT.StyledPropsInterface>``;\ntype BodyCSSMap = {\n [key in DSTypographyT.BodyVariants]: ReturnType<typeof typedCss>;\n};\n\n// as of 14/november/2023\n// mobile -> font-size: 16px\n// desktop -> font-size: 13px\n// the \"magic values\" of the rem units are the result of the following formula:\n// (variant's requirement px/RT value / 16px) for mobile\n// (variant's requirement px/RT value / 13px) for desktop\nexport const VARIANTS_CSS_BODY: BodyCSSMap = {\n [TYPOGRAPHY_VARIANTS.B1]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8775000000000001rem'};\n line-height: ${(props) => props.lineHeight ?? '1.1212499999999999rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.08rem'};\n line-height: ${(props) => props.lineHeight ?? '1.38rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B2]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8125rem'};\n line-height: ${(props) => props.lineHeight ?? '1rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1rem'};\n line-height: ${(props) => props.lineHeight ?? '1.2307692308rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B3]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.7475rem'};\n line-height: ${(props) => props.lineHeight ?? '0.999375rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '0.92rem'};\n line-height: ${(props) => props.lineHeight ?? '1.23rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B4]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.6906249999999999rem'};\n line-height: ${(props) => props.lineHeight ?? '0.8125rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '0.85rem'};\n line-height: ${(props) => props.lineHeight ?? '1rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B1_LIGHT]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8775000000000001rem'};\n line-height: ${(props) => props.lineHeight ?? '1.1212499999999999rem'};\n color: ${(props) => props.theme.colors.neutral[600]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.08rem'};\n line-height: ${(props) => props.lineHeight ?? '1.38rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B2_LIGHT]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8125rem'};\n line-height: ${(props) => props.lineHeight ?? '1rem'};\n color: ${(props) => props.theme.colors.neutral[600]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1rem'};\n line-height: ${(props) => props.lineHeight ?? '1.2307692308rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B3_LIGHT]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.7475rem'};\n line-height: ${(props) => props.lineHeight ?? '0.999375rem'};\n color: ${(props) => props.theme.colors.neutral[600]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '0.92rem'};\n line-height: ${(props) => props.lineHeight ?? '1.23rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B3_STRONG]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.7475rem'};\n line-height: ${(props) => props.lineHeight ?? '0.999375rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '0.92rem'};\n line-height: ${(props) => props.lineHeight ?? '1.23rem'};\n }\n font-weight: 600;\n `,\n};\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { css } from '@elliemae/ds-system';\nimport { TYPOGRAPHY_VARIANTS } from '../../constants/index.js';\nimport type { DSTypographyT } from '../../react-desc-prop-types.js';\nimport { typographyFontFamily } from '../typographyFontFamily.js';\n\n// typescript \"hack\" to infer the ReturnType of a generic function (css) with a generic argument (DSTypographyT.StyledPropsInterface)\n// as of 14/november/2023 I was not able to find a better way to do this.\nconst typedCss = () => css<DSTypographyT.StyledPropsInterface>``;\ntype BodyCSSMap = {\n [key in DSTypographyT.BodyVariants]: ReturnType<typeof typedCss>;\n};\n\n// as of 14/november/2023\n// mobile -> font-size: 16px\n// desktop -> font-size: 13px\n// the \"magic values\" of the rem units are the result of the following formula:\n// (variant's requirement px/RT value / 16px) for mobile\n// (variant's requirement px/RT value / 13px) for desktop\nexport const VARIANTS_CSS_BODY: BodyCSSMap = {\n [TYPOGRAPHY_VARIANTS.B1]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8775000000000001rem'};\n line-height: ${(props) => props.lineHeight ?? '1.1212499999999999rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.08rem'};\n line-height: ${(props) => props.lineHeight ?? '1.38rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B2]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8125rem'};\n line-height: ${(props) => props.lineHeight ?? '1rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1rem'};\n line-height: ${(props) => props.lineHeight ?? '1.2307692308rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B3]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.7475rem'};\n line-height: ${(props) => props.lineHeight ?? '0.999375rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '0.92rem'};\n line-height: ${(props) => props.lineHeight ?? '1.23rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B4]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.6906249999999999rem'};\n line-height: ${(props) => props.lineHeight ?? '0.8125rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '0.85rem'};\n line-height: ${(props) => props.lineHeight ?? '1rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B1_LIGHT]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8775000000000001rem'};\n line-height: ${(props) => props.lineHeight ?? '1.1212499999999999rem'};\n color: ${(props) => props.theme.colors.neutral[600]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.08rem'};\n line-height: ${(props) => props.lineHeight ?? '1.38rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B2_LIGHT]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8125rem'};\n line-height: ${(props) => props.lineHeight ?? '1rem'};\n color: ${(props) => props.theme.colors.neutral[600]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1rem'};\n line-height: ${(props) => props.lineHeight ?? '1.2307692308rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B3_LIGHT]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.7475rem'};\n line-height: ${(props) => props.lineHeight ?? '0.999375rem'};\n color: ${(props) => props.theme.colors.neutral[600]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '0.92rem'};\n line-height: ${(props) => props.lineHeight ?? '1.23rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.B3_STRONG]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.7475rem'};\n line-height: ${(props) => props.lineHeight ?? '0.999375rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '0.92rem'};\n line-height: ${(props) => props.lineHeight ?? '1.23rem'};\n }\n font-weight: 600;\n `,\n};\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -8,7 +8,6 @@ const VARIANTS_CSS_HEADER = {
8
8
  ${typographyFontFamily}
9
9
  font-size: ${(props) => props.fontSize ?? "2.12875rem"};
10
10
  line-height: ${(props) => props.lineHeight ?? "2.5593749999999997rem"};
11
- color: ${(props) => props.theme.colors.neutral[700]};
12
11
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
13
12
  font-size: ${(props) => props.fontSize ?? "2.62rem"};
14
13
  line-height: ${(props) => props.lineHeight ?? "3.15rem"};
@@ -19,7 +18,6 @@ const VARIANTS_CSS_HEADER = {
19
18
  ${typographyFontFamily}
20
19
  font-size: ${(props) => props.fontSize ?? "1.503125rem"};
21
20
  line-height: ${(props) => props.lineHeight ?? "1.9337499999999999rem"};
22
- color: ${(props) => props.theme.colors.neutral[700]};
23
21
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
24
22
  font-size: ${(props) => props.fontSize ?? "1.85rem"};
25
23
  line-height: ${(props) => props.lineHeight ?? "2.38rem"};
@@ -30,7 +28,6 @@ const VARIANTS_CSS_HEADER = {
30
28
  ${typographyFontFamily}
31
29
  font-size: ${(props) => props.fontSize ?? "1.1212499999999999rem"};
32
30
  line-height: ${(props) => props.lineHeight ?? "1.373125rem"};
33
- color: ${(props) => props.theme.colors.neutral[700]};
34
31
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
35
32
  font-size: ${(props) => props.fontSize ?? "1.38rem"};
36
33
  line-height: ${(props) => props.lineHeight ?? "1.69rem"};
@@ -41,7 +38,6 @@ const VARIANTS_CSS_HEADER = {
41
38
  ${typographyFontFamily}
42
39
  font-size: ${(props) => props.fontSize ?? "0.999375rem"};
43
40
  line-height: ${(props) => props.lineHeight ?? "1.25125rem"};
44
- color: ${(props) => props.theme.colors.neutral[700]};
45
41
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
46
42
  font-size: ${(props) => props.fontSize ?? "1.23rem"};
47
43
  line-height: ${(props) => props.lineHeight ?? "1.54rem"};
@@ -52,7 +48,6 @@ const VARIANTS_CSS_HEADER = {
52
48
  ${typographyFontFamily}
53
49
  font-size: ${(props) => props.fontSize ?? "0.8775000000000001rem"};
54
50
  line-height: ${(props) => props.lineHeight ?? "1.064375rem"};
55
- color: ${(props) => props.theme.colors.neutral[700]};
56
51
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
57
52
  font-size: ${(props) => props.fontSize ?? "1.08rem"};
58
53
  line-height: ${(props) => props.lineHeight ?? "1.31rem"};
@@ -63,7 +58,6 @@ const VARIANTS_CSS_HEADER = {
63
58
  ${typographyFontFamily}
64
59
  font-size: ${(props) => props.fontSize ?? "0.8775000000000001rem"};
65
60
  line-height: ${(props) => props.lineHeight ?? "1.064375rem"};
66
- color: ${(props) => props.theme.colors.neutral[700]};
67
61
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
68
62
  font-size: ${(props) => props.fontSize ?? "1.08rem"};
69
63
  line-height: ${(props) => props.lineHeight ?? "1.31rem"};
@@ -74,7 +68,6 @@ const VARIANTS_CSS_HEADER = {
74
68
  ${typographyFontFamily}
75
69
  font-size: ${(props) => props.fontSize ?? "0.999375rem"};
76
70
  line-height: ${(props) => props.lineHeight ?? "1.25125rem"};
77
- color: ${(props) => props.theme.colors.neutral[700]};
78
71
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
79
72
  font-size: ${(props) => props.fontSize ?? "1.23rem"};
80
73
  line-height: ${(props) => props.lineHeight ?? "1.54rem"};
@@ -85,7 +78,6 @@ const VARIANTS_CSS_HEADER = {
85
78
  ${typographyFontFamily}
86
79
  font-size: ${(props) => props.fontSize ?? "1.1212499999999999rem"};
87
80
  line-height: ${(props) => props.lineHeight ?? "1.373125rem"};
88
- color: ${(props) => props.theme.colors.neutral[700]};
89
81
  @media (min-width: ${({ theme }) => theme.breakpoints.small}) {
90
82
  font-size: ${(props) => props.fontSize ?? "1.38rem"};
91
83
  line-height: ${(props) => props.lineHeight ?? "1.69rem"};
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/variants/header.ts"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { css } from '@elliemae/ds-system';\nimport { TYPOGRAPHY_VARIANTS } from '../../constants/index.js';\nimport type { DSTypographyT } from '../../react-desc-prop-types.js';\nimport { typographyFontFamily } from '../typographyFontFamily.js';\n\n// typescript \"hack\" to infer the ReturnType of a generic function (css) with a generic argument (DSTypographyT.StyledPropsInterface)\n// as of 14/november/2023 I was not able to find a better way to do this.\nconst typedCss = () => css<DSTypographyT.StyledPropsInterface>``;\ntype HeadingCSSMap = {\n [key in DSTypographyT.HeadingVariants]: ReturnType<typeof typedCss>;\n};\n\n// as of 14/november/2023\n// mobile -> font-size: 16px\n// desktop -> font-size: 13px\n// the \"magic values\" of the rem units are the result of the following formula:\n// (variant's requirement px/RT value / 16px) for mobile\n// (variant's requirement px/RT value / 13px) for desktop\nexport const VARIANTS_CSS_HEADER: HeadingCSSMap = {\n [TYPOGRAPHY_VARIANTS.H1]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '2.12875rem'};\n line-height: ${(props) => props.lineHeight ?? '2.5593749999999997rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '2.62rem'};\n line-height: ${(props) => props.lineHeight ?? '3.15rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.H2]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '1.503125rem'};\n line-height: ${(props) => props.lineHeight ?? '1.9337499999999999rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.85rem'};\n line-height: ${(props) => props.lineHeight ?? '2.38rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.H3]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '1.1212499999999999rem'};\n line-height: ${(props) => props.lineHeight ?? '1.373125rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.38rem'};\n line-height: ${(props) => props.lineHeight ?? '1.69rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.H4]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.999375rem'};\n line-height: ${(props) => props.lineHeight ?? '1.25125rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.23rem'};\n line-height: ${(props) => props.lineHeight ?? '1.54rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.H5]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8775000000000001rem'};\n line-height: ${(props) => props.lineHeight ?? '1.064375rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.08rem'};\n line-height: ${(props) => props.lineHeight ?? '1.31rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.H5_STRONG]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8775000000000001rem'};\n line-height: ${(props) => props.lineHeight ?? '1.064375rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.08rem'};\n line-height: ${(props) => props.lineHeight ?? '1.31rem'};\n }\n font-weight: 600;\n `,\n [TYPOGRAPHY_VARIANTS.H4_STRONG]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.999375rem'};\n line-height: ${(props) => props.lineHeight ?? '1.25125rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.23rem'};\n line-height: ${(props) => props.lineHeight ?? '1.54rem'};\n }\n font-weight: 600;\n `,\n [TYPOGRAPHY_VARIANTS.H3_STRONG]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '1.1212499999999999rem'};\n line-height: ${(props) => props.lineHeight ?? '1.373125rem'};\n color: ${(props) => props.theme.colors.neutral[700]};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.38rem'};\n line-height: ${(props) => props.lineHeight ?? '1.69rem'};\n }\n font-weight: 600;\n `,\n};\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { css } from '@elliemae/ds-system';\nimport { TYPOGRAPHY_VARIANTS } from '../../constants/index.js';\nimport type { DSTypographyT } from '../../react-desc-prop-types.js';\nimport { typographyFontFamily } from '../typographyFontFamily.js';\n\n// typescript \"hack\" to infer the ReturnType of a generic function (css) with a generic argument (DSTypographyT.StyledPropsInterface)\n// as of 14/november/2023 I was not able to find a better way to do this.\nconst typedCss = () => css<DSTypographyT.StyledPropsInterface>``;\ntype HeadingCSSMap = {\n [key in DSTypographyT.HeadingVariants]: ReturnType<typeof typedCss>;\n};\n\n// as of 14/november/2023\n// mobile -> font-size: 16px\n// desktop -> font-size: 13px\n// the \"magic values\" of the rem units are the result of the following formula:\n// (variant's requirement px/RT value / 16px) for mobile\n// (variant's requirement px/RT value / 13px) for desktop\nexport const VARIANTS_CSS_HEADER: HeadingCSSMap = {\n [TYPOGRAPHY_VARIANTS.H1]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '2.12875rem'};\n line-height: ${(props) => props.lineHeight ?? '2.5593749999999997rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '2.62rem'};\n line-height: ${(props) => props.lineHeight ?? '3.15rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.H2]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '1.503125rem'};\n line-height: ${(props) => props.lineHeight ?? '1.9337499999999999rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.85rem'};\n line-height: ${(props) => props.lineHeight ?? '2.38rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.H3]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '1.1212499999999999rem'};\n line-height: ${(props) => props.lineHeight ?? '1.373125rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.38rem'};\n line-height: ${(props) => props.lineHeight ?? '1.69rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.H4]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.999375rem'};\n line-height: ${(props) => props.lineHeight ?? '1.25125rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.23rem'};\n line-height: ${(props) => props.lineHeight ?? '1.54rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.H5]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8775000000000001rem'};\n line-height: ${(props) => props.lineHeight ?? '1.064375rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.08rem'};\n line-height: ${(props) => props.lineHeight ?? '1.31rem'};\n }\n font-weight: 400;\n `,\n [TYPOGRAPHY_VARIANTS.H5_STRONG]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.8775000000000001rem'};\n line-height: ${(props) => props.lineHeight ?? '1.064375rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.08rem'};\n line-height: ${(props) => props.lineHeight ?? '1.31rem'};\n }\n font-weight: 600;\n `,\n [TYPOGRAPHY_VARIANTS.H4_STRONG]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '0.999375rem'};\n line-height: ${(props) => props.lineHeight ?? '1.25125rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.23rem'};\n line-height: ${(props) => props.lineHeight ?? '1.54rem'};\n }\n font-weight: 600;\n `,\n [TYPOGRAPHY_VARIANTS.H3_STRONG]: css<DSTypographyT.StyledPropsInterface>`\n ${typographyFontFamily}\n font-size: ${(props) => props.fontSize ?? '1.1212499999999999rem'};\n line-height: ${(props) => props.lineHeight ?? '1.373125rem'};\n @media (min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => props.fontSize ?? '1.38rem'};\n line-height: ${(props) => props.lineHeight ?? '1.69rem'};\n }\n font-weight: 600;\n `,\n};\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-typography",
3
- "version": "3.70.0-next.60",
3
+ "version": "3.70.0-next.62",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Typography",
6
6
  "files": [
@@ -38,17 +38,17 @@
38
38
  "dependencies": {
39
39
  "@xstyled/system": "~3.8.1",
40
40
  "@xstyled/util": "~3.7.0",
41
- "@elliemae/ds-props-helpers": "3.70.0-next.60",
42
- "@elliemae/ds-typescript-helpers": "3.70.0-next.60",
43
- "@elliemae/ds-system": "3.70.0-next.60"
41
+ "@elliemae/ds-props-helpers": "3.70.0-next.62",
42
+ "@elliemae/ds-system": "3.70.0-next.62",
43
+ "@elliemae/ds-typescript-helpers": "3.70.0-next.62"
44
44
  },
45
45
  "devDependencies": {
46
46
  "jest": "^30.0.0",
47
47
  "react": "^18.3.1",
48
48
  "react-dom": "^18.3.1",
49
49
  "react-test-renderer": "^18.3.1",
50
- "@elliemae/ds-monorepo-devops": "3.70.0-next.60",
51
- "@elliemae/ds-test-utils": "3.70.0-next.60"
50
+ "@elliemae/ds-test-utils": "3.70.0-next.62",
51
+ "@elliemae/ds-monorepo-devops": "3.70.0-next.62"
52
52
  },
53
53
  "peerDependencies": {
54
54
  "@testing-library/jest-dom": "^6.6.3",