@elliemae/ds-typography 3.12.0-next.0 → 3.12.0-rc.0
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/cjs/config/useDefaultProps.js.map +1 -1
- package/dist/cjs/config/useTypography.js.map +2 -2
- package/dist/cjs/react-desc-prop-types.js.map +2 -2
- package/dist/cjs/styled.js +2 -7
- package/dist/cjs/styled.js.map +2 -2
- package/dist/esm/config/useDefaultProps.js.map +1 -1
- package/dist/esm/config/useTypography.js.map +2 -2
- package/dist/esm/react-desc-prop-types.js +1 -5
- package/dist/esm/react-desc-prop-types.js.map +2 -2
- package/dist/esm/styled.js +3 -8
- package/dist/esm/styled.js.map +2 -2
- package/package.json +3 -3
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/config/useDefaultProps.ts", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { DSTypographyT } from '../react-desc-prop-types';\n\nconst VariantToAsMap: Record<DSTypographyT.Props['variant'], keyof JSX.IntrinsicElements> = {\n h1: 'h1',\n h2: 'h2',\n h3: 'h3',\n h4: 'h4',\n h5: 'h5',\n b1: 'p',\n b2: 'p',\n b3: 'p',\n b4: 'p',\n};\nexport const useDefaultProps = ({ variant, as: userAs }: DSTypographyT.Props) => {\n const defaultAs = userAs || VariantToAsMap[variant];\n const defaultProps = React.useMemo(() => ({ as: defaultAs }), [defaultAs]);\n return defaultProps;\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport type { DSTypographyT } from '../react-desc-prop-types';\n\nconst VariantToAsMap: Record<DSTypographyT.Props['variant'], keyof JSX.IntrinsicElements> = {\n h1: 'h1',\n h2: 'h2',\n h3: 'h3',\n h4: 'h4',\n h5: 'h5',\n b1: 'p',\n b2: 'p',\n b3: 'p',\n b4: 'p',\n};\nexport const useDefaultProps = ({ variant, as: userAs }: DSTypographyT.Props) => {\n const defaultAs = userAs || VariantToAsMap[variant];\n const defaultProps = React.useMemo(() => ({ as: defaultAs }), [defaultAs]);\n return defaultProps;\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAGlB,MAAM,iBAAsF;AAAA,EAC1F,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AACO,MAAM,kBAAkB,CAAC,EAAE,SAAS,IAAI,OAAO,MAA2B;AAC/E,QAAM,YAAY,UAAU,eAAe;AAC3C,QAAM,eAAe,aAAAA,QAAM,QAAQ,OAAO,EAAE,IAAI,UAAU,IAAI,CAAC,SAAS,CAAC;AACzE,SAAO;AACT;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/config/useTypography.ts", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport {\n useGetGlobalAttributes,\n useGetXstyledProps,\n useMemoMergePropsWithDefault,\n useValidateTypescriptPropTypes,\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-utilities';\nimport {\n useGetGlobalAttributes,\n useGetXstyledProps,\n useMemoMergePropsWithDefault,\n useValidateTypescriptPropTypes,\n} from '@elliemae/ds-utilities';\n\nimport type { DSTypographyT } from '../react-desc-prop-types';\nimport { DSTypographyPropTypes } from '../react-desc-prop-types';\nimport { useDefaultProps } from './useDefaultProps';\n\ninterface UseTypographyT {\n propsWithDefault: DSTypographyT.InternalProps;\n globalAttributes: GlobalAttributesT;\n xstyledProps: XstyledProps;\n}\n\nexport const useTypography = (props: DSTypographyT.Props): UseTypographyT => {\n useValidateTypescriptPropTypes(props, DSTypographyPropTypes);\n const defaultProps = useDefaultProps(props);\n const propsWithDefault = useMemoMergePropsWithDefault<DSTypographyT.InternalProps>(props, defaultProps);\n const globalAttributes = useGetGlobalAttributes(propsWithDefault);\n\n const xstyledProps = useGetXstyledProps(propsWithDefault);\n return React.useMemo(\n () => ({ propsWithDefault, globalAttributes, xstyledProps }),\n [globalAttributes, propsWithDefault, xstyledProps],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAElB,0BAKO;AAGP,mCAAsC;AACtC,6BAAgC;AAQzB,MAAM,gBAAgB,CAAC,UAA+C;AAC3E,0DAA+B,OAAO,kDAAqB;AAC3D,QAAM,mBAAe,wCAAgB,KAAK;AAC1C,QAAM,uBAAmB,kDAA0D,OAAO,YAAY;AACtG,QAAM,uBAAmB,4CAAuB,gBAAgB;AAEhE,QAAM,mBAAe,wCAAmB,gBAAgB;AACxD,SAAO,aAAAA,QAAM;AAAA,IACX,OAAO,EAAE,kBAAkB,kBAAkB,aAAa;AAAA,IAC1D,CAAC,kBAAkB,kBAAkB,YAAY;AAAA,EACnD;AACF;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/react-desc-prop-types.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["import type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-utilities';\nimport { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-utilities';\nimport type { FontSizeProps, ColorProps } from '@elliemae/ds-system';\nimport type { WeakValidationMap } from 'react';\n\nexport declare namespace DSTypographyT {\n type Ivariant = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'b1' | 'b2' | 'b3' | 'b4';\n interface IProps {\n variant: Ivariant;\n as?: keyof JSX.IntrinsicElements;\n children: React.ReactNode | React.ReactNode[];\n }\n\n export interface Props\n extends IProps,\n Omit<GlobalAttributesT<HTMLElement>, keyof IProps | 'color'>,\n XstyledProps,\n FontSizeProps,\n ColorProps {}\n export interface InternalProps extends Props {\n as: keyof JSX.IntrinsicElements;\n }\n}\n\nexport const DSTypographyPropTypes = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n variant: PropTypes.oneOf(['h1', 'h2', 'h3', 'h4', 'h5', 'b1', 'b2', 'b3', 'b4']).description(\n `\n render the default style based on the variant and the default mapping HTML tag:\n Variant to HTML Tag\n h1 => <h1 />\n h2 => <h2 />\n h3 => <h3 />\n h4 => <h4 />\n h5 => <h5 />\n b1 => <p />\n b2 => <p />\n b3 => <p />\n b4 => <p />\n `,\n ).isRequired,\n children: PropTypes.node.description('Children element').isRequired,\n as: PropTypes.string.description('Use to override the printed HTML tag, ex: `span` or `strong`'),\n} as WeakValidationMap<unknown>;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,0BAAuE;AAuBhE,MAAM,wBAAwB;AAAA,EACnC,GAAG;AAAA,EACH,GAAG;AAAA,EACH,SAAS,8BAAU,MAAM,CAAC,MAAM,MAAM,MAAM,MAAM,MAAM,MAAM,MAAM,MAAM,IAAI,CAAC,EAAE;AAAA,IAC/E;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAaF,EAAE;AAAA,EACF,UAAU,8BAAU,KAAK,YAAY,kBAAkB,EAAE;AAAA,EACzD,IAAI,8BAAU,OAAO,YAAY,8DAA8D;AACjG;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/styled.js
CHANGED
|
@@ -107,19 +107,14 @@ const mapper = {
|
|
|
107
107
|
line-height: ${styleMap.b4.lineHeight};
|
|
108
108
|
`
|
|
109
109
|
};
|
|
110
|
-
const StyledTypography = (0, import_ds_system.styled)(
|
|
110
|
+
const StyledTypography = (0, import_ds_system.styled)(import_ds_system.XStyledWrapper, {
|
|
111
111
|
name: import_DSTypographyDatatestId.DSTypographyName,
|
|
112
112
|
slot: import_DSTypographyDatatestId.DSTypographyDataTestId.TYPOGRAPHY_ELEMENT
|
|
113
113
|
}).withConfig({
|
|
114
|
-
shouldForwardProp: (prop, defaultValidatorFn) => !["fontSize", "color", "as", "variant"].includes(prop) && defaultValidatorFn(prop)
|
|
114
|
+
shouldForwardProp: (prop, defaultValidatorFn) => !["fontSize", "color", "as", "variant"].includes(prop.toString()) && defaultValidatorFn(prop)
|
|
115
115
|
})`
|
|
116
116
|
margin: 0;
|
|
117
117
|
padding: 0;
|
|
118
118
|
${(props) => mapper[props.variant]}
|
|
119
|
-
${import_ds_system.fontSize}
|
|
120
|
-
${import_ds_system.space}
|
|
121
|
-
${import_ds_system.sizing}
|
|
122
|
-
${import_ds_system.layout}
|
|
123
|
-
${import_ds_system.color}
|
|
124
119
|
`;
|
|
125
120
|
//# sourceMappingURL=styled.js.map
|
package/dist/cjs/styled.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/styled.ts", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { styled, css,
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,
|
|
4
|
+
"sourcesContent": ["import { styled, css, XStyledWrapper } from '@elliemae/ds-system';\nimport { DSTypographyName, DSTypographyDataTestId } from './DSTypographyDatatestId';\nimport type { DSTypographyT } from './react-desc-prop-types';\nimport type {} from '@xstyled/util';\nimport type {} from '@xstyled/system';\nexport const styleMap = {\n h1: {\n fontSize: '34px',\n lineHeight: '41px',\n },\n h2: {\n fontSize: '24px',\n lineHeight: '31px',\n },\n h3: {\n fontSize: '18px',\n lineHeight: '22px',\n },\n h4: {\n fontSize: '16px',\n lineHeight: '20px',\n },\n h5: {\n fontSize: '14px',\n lineHeight: '17px',\n },\n b1: {\n fontSize: '14px',\n lineHeight: '18px',\n },\n b2: {\n fontSize: '13px',\n lineHeight: '17px',\n },\n b3: {\n fontSize: '12px',\n lineHeight: '16px',\n },\n b4: {\n fontSize: '11px',\n lineHeight: '13px',\n },\n};\n\nconst mapper = {\n h1: css`\n font-size: ${styleMap.h1.fontSize};\n line-height: ${styleMap.h1.lineHeight};\n `,\n h2: css`\n font-size: ${styleMap.h2.fontSize};\n line-height: ${styleMap.h2.lineHeight};\n `,\n h3: css`\n font-size: ${styleMap.h3.fontSize};\n line-height: ${styleMap.h3.lineHeight};\n `,\n h4: css`\n font-size: ${styleMap.h4.fontSize};\n line-height: ${styleMap.h4.lineHeight};\n `,\n h5: css`\n font-size: ${styleMap.h5.fontSize};\n line-height: ${styleMap.h5.lineHeight};\n `,\n b1: css`\n font-size: ${styleMap.b1.fontSize};\n line-height: ${styleMap.b1.lineHeight};\n `,\n b2: css`\n font-size: ${styleMap.b2.fontSize};\n line-height: ${styleMap.b2.lineHeight};\n `,\n b3: css`\n font-size: ${styleMap.b3.fontSize};\n line-height: ${styleMap.b3.lineHeight};\n `,\n b4: css`\n font-size: ${styleMap.b4.fontSize};\n line-height: ${styleMap.b4.lineHeight};\n `,\n};\n\ntype StyleIProp = DSTypographyT.InternalProps & {\n children: DSTypographyT.InternalProps['children'];\n};\n\nexport const StyledTypography = styled(XStyledWrapper, {\n name: DSTypographyName,\n slot: DSTypographyDataTestId.TYPOGRAPHY_ELEMENT,\n}).withConfig({\n shouldForwardProp: (prop, defaultValidatorFn) =>\n !['fontSize', 'color', 'as', 'variant'].includes(prop.toString()) && defaultValidatorFn(prop),\n})<StyleIProp>`\n margin: 0;\n padding: 0;\n ${(props: StyleIProp) => mapper[props.variant]}\n`;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAA4C;AAC5C,oCAAyD;AAIlD,MAAM,WAAW;AAAA,EACtB,IAAI;AAAA,IACF,UAAU;AAAA,IACV,YAAY;AAAA,EACd;AAAA,EACA,IAAI;AAAA,IACF,UAAU;AAAA,IACV,YAAY;AAAA,EACd;AAAA,EACA,IAAI;AAAA,IACF,UAAU;AAAA,IACV,YAAY;AAAA,EACd;AAAA,EACA,IAAI;AAAA,IACF,UAAU;AAAA,IACV,YAAY;AAAA,EACd;AAAA,EACA,IAAI;AAAA,IACF,UAAU;AAAA,IACV,YAAY;AAAA,EACd;AAAA,EACA,IAAI;AAAA,IACF,UAAU;AAAA,IACV,YAAY;AAAA,EACd;AAAA,EACA,IAAI;AAAA,IACF,UAAU;AAAA,IACV,YAAY;AAAA,EACd;AAAA,EACA,IAAI;AAAA,IACF,UAAU;AAAA,IACV,YAAY;AAAA,EACd;AAAA,EACA,IAAI;AAAA,IACF,UAAU;AAAA,IACV,YAAY;AAAA,EACd;AACF;AAEA,MAAM,SAAS;AAAA,EACb,IAAI;AAAA,iBACW,SAAS,GAAG;AAAA,mBACV,SAAS,GAAG;AAAA;AAAA,EAE7B,IAAI;AAAA,iBACW,SAAS,GAAG;AAAA,mBACV,SAAS,GAAG;AAAA;AAAA,EAE7B,IAAI;AAAA,iBACW,SAAS,GAAG;AAAA,mBACV,SAAS,GAAG;AAAA;AAAA,EAE7B,IAAI;AAAA,iBACW,SAAS,GAAG;AAAA,mBACV,SAAS,GAAG;AAAA;AAAA,EAE7B,IAAI;AAAA,iBACW,SAAS,GAAG;AAAA,mBACV,SAAS,GAAG;AAAA;AAAA,EAE7B,IAAI;AAAA,iBACW,SAAS,GAAG;AAAA,mBACV,SAAS,GAAG;AAAA;AAAA,EAE7B,IAAI;AAAA,iBACW,SAAS,GAAG;AAAA,mBACV,SAAS,GAAG;AAAA;AAAA,EAE7B,IAAI;AAAA,iBACW,SAAS,GAAG;AAAA,mBACV,SAAS,GAAG;AAAA;AAAA,EAE7B,IAAI;AAAA,iBACW,SAAS,GAAG;AAAA,mBACV,SAAS,GAAG;AAAA;AAE/B;AAMO,MAAM,uBAAmB,yBAAO,iCAAgB;AAAA,EACrD,MAAM;AAAA,EACN,MAAM,qDAAuB;AAC/B,CAAC,EAAE,WAAW;AAAA,EACZ,mBAAmB,CAAC,MAAM,uBACxB,CAAC,CAAC,YAAY,SAAS,MAAM,SAAS,EAAE,SAAS,KAAK,SAAS,CAAC,KAAK,mBAAmB,IAAI;AAChG,CAAC;AAAA;AAAA;AAAA,IAGG,CAAC,UAAsB,OAAO,MAAM;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/useDefaultProps.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { DSTypographyT } from '../react-desc-prop-types';\n\nconst VariantToAsMap: Record<DSTypographyT.Props['variant'], keyof JSX.IntrinsicElements> = {\n h1: 'h1',\n h2: 'h2',\n h3: 'h3',\n h4: 'h4',\n h5: 'h5',\n b1: 'p',\n b2: 'p',\n b3: 'p',\n b4: 'p',\n};\nexport const useDefaultProps = ({ variant, as: userAs }: DSTypographyT.Props) => {\n const defaultAs = userAs || VariantToAsMap[variant];\n const defaultProps = React.useMemo(() => ({ as: defaultAs }), [defaultAs]);\n return defaultProps;\n};\n"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport type { DSTypographyT } from '../react-desc-prop-types';\n\nconst VariantToAsMap: Record<DSTypographyT.Props['variant'], keyof JSX.IntrinsicElements> = {\n h1: 'h1',\n h2: 'h2',\n h3: 'h3',\n h4: 'h4',\n h5: 'h5',\n b1: 'p',\n b2: 'p',\n b3: 'p',\n b4: 'p',\n};\nexport const useDefaultProps = ({ variant, as: userAs }: DSTypographyT.Props) => {\n const defaultAs = userAs || VariantToAsMap[variant];\n const defaultProps = React.useMemo(() => ({ as: defaultAs }), [defaultAs]);\n return defaultProps;\n};\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAGlB,MAAM,iBAAsF;AAAA,EAC1F,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AACO,MAAM,kBAAkB,CAAC,EAAE,SAAS,IAAI,OAAO,MAA2B;AAC/E,QAAM,YAAY,UAAU,eAAe;AAC3C,QAAM,eAAeA,OAAM,QAAQ,OAAO,EAAE,IAAI,UAAU,IAAI,CAAC,SAAS,CAAC;AACzE,SAAO;AACT;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/useTypography.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport {\n useGetGlobalAttributes,\n useGetXstyledProps,\n useMemoMergePropsWithDefault,\n useValidateTypescriptPropTypes,\n
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-utilities';\nimport {\n useGetGlobalAttributes,\n useGetXstyledProps,\n useMemoMergePropsWithDefault,\n useValidateTypescriptPropTypes,\n} from '@elliemae/ds-utilities';\n\nimport type { DSTypographyT } from '../react-desc-prop-types';\nimport { DSTypographyPropTypes } from '../react-desc-prop-types';\nimport { useDefaultProps } from './useDefaultProps';\n\ninterface UseTypographyT {\n propsWithDefault: DSTypographyT.InternalProps;\n globalAttributes: GlobalAttributesT;\n xstyledProps: XstyledProps;\n}\n\nexport const useTypography = (props: DSTypographyT.Props): UseTypographyT => {\n useValidateTypescriptPropTypes(props, DSTypographyPropTypes);\n const defaultProps = useDefaultProps(props);\n const propsWithDefault = useMemoMergePropsWithDefault<DSTypographyT.InternalProps>(props, defaultProps);\n const globalAttributes = useGetGlobalAttributes(propsWithDefault);\n\n const xstyledProps = useGetXstyledProps(propsWithDefault);\n return React.useMemo(\n () => ({ propsWithDefault, globalAttributes, xstyledProps }),\n [globalAttributes, propsWithDefault, xstyledProps],\n );\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAElB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAGP,SAAS,6BAA6B;AACtC,SAAS,uBAAuB;AAQzB,MAAM,gBAAgB,CAAC,UAA+C;AAC3E,iCAA+B,OAAO,qBAAqB;AAC3D,QAAM,eAAe,gBAAgB,KAAK;AAC1C,QAAM,mBAAmB,6BAA0D,OAAO,YAAY;AACtG,QAAM,mBAAmB,uBAAuB,gBAAgB;AAEhE,QAAM,eAAe,mBAAmB,gBAAgB;AACxD,SAAOA,OAAM;AAAA,IACX,OAAO,EAAE,kBAAkB,kBAAkB,aAAa;AAAA,IAC1D,CAAC,kBAAkB,kBAAkB,YAAY;AAAA,EACnD;AACF;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -1,9 +1,5 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import {
|
|
3
|
-
PropTypes,
|
|
4
|
-
globalAttributesPropTypes,
|
|
5
|
-
xstyledPropTypes
|
|
6
|
-
} from "@elliemae/ds-utilities";
|
|
2
|
+
import { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from "@elliemae/ds-utilities";
|
|
7
3
|
const DSTypographyPropTypes = {
|
|
8
4
|
...globalAttributesPropTypes,
|
|
9
5
|
...xstyledPropTypes,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import {
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-utilities';\nimport { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-utilities';\nimport type { FontSizeProps, ColorProps } from '@elliemae/ds-system';\nimport type { WeakValidationMap } from 'react';\n\nexport declare namespace DSTypographyT {\n type Ivariant = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'b1' | 'b2' | 'b3' | 'b4';\n interface IProps {\n variant: Ivariant;\n as?: keyof JSX.IntrinsicElements;\n children: React.ReactNode | React.ReactNode[];\n }\n\n export interface Props\n extends IProps,\n Omit<GlobalAttributesT<HTMLElement>, keyof IProps | 'color'>,\n XstyledProps,\n FontSizeProps,\n ColorProps {}\n export interface InternalProps extends Props {\n as: keyof JSX.IntrinsicElements;\n }\n}\n\nexport const DSTypographyPropTypes = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n variant: PropTypes.oneOf(['h1', 'h2', 'h3', 'h4', 'h5', 'b1', 'b2', 'b3', 'b4']).description(\n `\n render the default style based on the variant and the default mapping HTML tag:\n Variant to HTML Tag\n h1 => <h1 />\n h2 => <h2 />\n h3 => <h3 />\n h4 => <h4 />\n h5 => <h5 />\n b1 => <p />\n b2 => <p />\n b3 => <p />\n b4 => <p />\n `,\n ).isRequired,\n children: PropTypes.node.description('Children element').isRequired,\n as: PropTypes.string.description('Use to override the printed HTML tag, ex: `span` or `strong`'),\n} as WeakValidationMap<unknown>;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,WAAW,2BAA2B,wBAAwB;AAuBhE,MAAM,wBAAwB;AAAA,EACnC,GAAG;AAAA,EACH,GAAG;AAAA,EACH,SAAS,UAAU,MAAM,CAAC,MAAM,MAAM,MAAM,MAAM,MAAM,MAAM,MAAM,MAAM,IAAI,CAAC,EAAE;AAAA,IAC/E;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAaF,EAAE;AAAA,EACF,UAAU,UAAU,KAAK,YAAY,kBAAkB,EAAE;AAAA,EACzD,IAAI,UAAU,OAAO,YAAY,8DAA8D;AACjG;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/styled.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import { styled, css,
|
|
2
|
+
import { styled, css, XStyledWrapper } from "@elliemae/ds-system";
|
|
3
3
|
import { DSTypographyName, DSTypographyDataTestId } from "./DSTypographyDatatestId";
|
|
4
4
|
const styleMap = {
|
|
5
5
|
h1: {
|
|
@@ -77,20 +77,15 @@ const mapper = {
|
|
|
77
77
|
line-height: ${styleMap.b4.lineHeight};
|
|
78
78
|
`
|
|
79
79
|
};
|
|
80
|
-
const StyledTypography = styled(
|
|
80
|
+
const StyledTypography = styled(XStyledWrapper, {
|
|
81
81
|
name: DSTypographyName,
|
|
82
82
|
slot: DSTypographyDataTestId.TYPOGRAPHY_ELEMENT
|
|
83
83
|
}).withConfig({
|
|
84
|
-
shouldForwardProp: (prop, defaultValidatorFn) => !["fontSize", "color", "as", "variant"].includes(prop) && defaultValidatorFn(prop)
|
|
84
|
+
shouldForwardProp: (prop, defaultValidatorFn) => !["fontSize", "color", "as", "variant"].includes(prop.toString()) && defaultValidatorFn(prop)
|
|
85
85
|
})`
|
|
86
86
|
margin: 0;
|
|
87
87
|
padding: 0;
|
|
88
88
|
${(props) => mapper[props.variant]}
|
|
89
|
-
${fontSize}
|
|
90
|
-
${space}
|
|
91
|
-
${sizing}
|
|
92
|
-
${layout}
|
|
93
|
-
${color}
|
|
94
89
|
`;
|
|
95
90
|
export {
|
|
96
91
|
StyledTypography,
|
package/dist/esm/styled.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/styled.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled, css,
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,QAAQ,KAAK,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled, css, XStyledWrapper } from '@elliemae/ds-system';\nimport { DSTypographyName, DSTypographyDataTestId } from './DSTypographyDatatestId';\nimport type { DSTypographyT } from './react-desc-prop-types';\nimport type {} from '@xstyled/util';\nimport type {} from '@xstyled/system';\nexport const styleMap = {\n h1: {\n fontSize: '34px',\n lineHeight: '41px',\n },\n h2: {\n fontSize: '24px',\n lineHeight: '31px',\n },\n h3: {\n fontSize: '18px',\n lineHeight: '22px',\n },\n h4: {\n fontSize: '16px',\n lineHeight: '20px',\n },\n h5: {\n fontSize: '14px',\n lineHeight: '17px',\n },\n b1: {\n fontSize: '14px',\n lineHeight: '18px',\n },\n b2: {\n fontSize: '13px',\n lineHeight: '17px',\n },\n b3: {\n fontSize: '12px',\n lineHeight: '16px',\n },\n b4: {\n fontSize: '11px',\n lineHeight: '13px',\n },\n};\n\nconst mapper = {\n h1: css`\n font-size: ${styleMap.h1.fontSize};\n line-height: ${styleMap.h1.lineHeight};\n `,\n h2: css`\n font-size: ${styleMap.h2.fontSize};\n line-height: ${styleMap.h2.lineHeight};\n `,\n h3: css`\n font-size: ${styleMap.h3.fontSize};\n line-height: ${styleMap.h3.lineHeight};\n `,\n h4: css`\n font-size: ${styleMap.h4.fontSize};\n line-height: ${styleMap.h4.lineHeight};\n `,\n h5: css`\n font-size: ${styleMap.h5.fontSize};\n line-height: ${styleMap.h5.lineHeight};\n `,\n b1: css`\n font-size: ${styleMap.b1.fontSize};\n line-height: ${styleMap.b1.lineHeight};\n `,\n b2: css`\n font-size: ${styleMap.b2.fontSize};\n line-height: ${styleMap.b2.lineHeight};\n `,\n b3: css`\n font-size: ${styleMap.b3.fontSize};\n line-height: ${styleMap.b3.lineHeight};\n `,\n b4: css`\n font-size: ${styleMap.b4.fontSize};\n line-height: ${styleMap.b4.lineHeight};\n `,\n};\n\ntype StyleIProp = DSTypographyT.InternalProps & {\n children: DSTypographyT.InternalProps['children'];\n};\n\nexport const StyledTypography = styled(XStyledWrapper, {\n name: DSTypographyName,\n slot: DSTypographyDataTestId.TYPOGRAPHY_ELEMENT,\n}).withConfig({\n shouldForwardProp: (prop, defaultValidatorFn) =>\n !['fontSize', 'color', 'as', 'variant'].includes(prop.toString()) && defaultValidatorFn(prop),\n})<StyleIProp>`\n margin: 0;\n padding: 0;\n ${(props: StyleIProp) => mapper[props.variant]}\n`;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,QAAQ,KAAK,sBAAsB;AAC5C,SAAS,kBAAkB,8BAA8B;AAIlD,MAAM,WAAW;AAAA,EACtB,IAAI;AAAA,IACF,UAAU;AAAA,IACV,YAAY;AAAA,EACd;AAAA,EACA,IAAI;AAAA,IACF,UAAU;AAAA,IACV,YAAY;AAAA,EACd;AAAA,EACA,IAAI;AAAA,IACF,UAAU;AAAA,IACV,YAAY;AAAA,EACd;AAAA,EACA,IAAI;AAAA,IACF,UAAU;AAAA,IACV,YAAY;AAAA,EACd;AAAA,EACA,IAAI;AAAA,IACF,UAAU;AAAA,IACV,YAAY;AAAA,EACd;AAAA,EACA,IAAI;AAAA,IACF,UAAU;AAAA,IACV,YAAY;AAAA,EACd;AAAA,EACA,IAAI;AAAA,IACF,UAAU;AAAA,IACV,YAAY;AAAA,EACd;AAAA,EACA,IAAI;AAAA,IACF,UAAU;AAAA,IACV,YAAY;AAAA,EACd;AAAA,EACA,IAAI;AAAA,IACF,UAAU;AAAA,IACV,YAAY;AAAA,EACd;AACF;AAEA,MAAM,SAAS;AAAA,EACb,IAAI;AAAA,iBACW,SAAS,GAAG;AAAA,mBACV,SAAS,GAAG;AAAA;AAAA,EAE7B,IAAI;AAAA,iBACW,SAAS,GAAG;AAAA,mBACV,SAAS,GAAG;AAAA;AAAA,EAE7B,IAAI;AAAA,iBACW,SAAS,GAAG;AAAA,mBACV,SAAS,GAAG;AAAA;AAAA,EAE7B,IAAI;AAAA,iBACW,SAAS,GAAG;AAAA,mBACV,SAAS,GAAG;AAAA;AAAA,EAE7B,IAAI;AAAA,iBACW,SAAS,GAAG;AAAA,mBACV,SAAS,GAAG;AAAA;AAAA,EAE7B,IAAI;AAAA,iBACW,SAAS,GAAG;AAAA,mBACV,SAAS,GAAG;AAAA;AAAA,EAE7B,IAAI;AAAA,iBACW,SAAS,GAAG;AAAA,mBACV,SAAS,GAAG;AAAA;AAAA,EAE7B,IAAI;AAAA,iBACW,SAAS,GAAG;AAAA,mBACV,SAAS,GAAG;AAAA;AAAA,EAE7B,IAAI;AAAA,iBACW,SAAS,GAAG;AAAA,mBACV,SAAS,GAAG;AAAA;AAE/B;AAMO,MAAM,mBAAmB,OAAO,gBAAgB;AAAA,EACrD,MAAM;AAAA,EACN,MAAM,uBAAuB;AAC/B,CAAC,EAAE,WAAW;AAAA,EACZ,mBAAmB,CAAC,MAAM,uBACxB,CAAC,CAAC,YAAY,SAAS,MAAM,SAAS,EAAE,SAAS,KAAK,SAAS,CAAC,KAAK,mBAAmB,IAAI;AAChG,CAAC;AAAA;AAAA;AAAA,IAGG,CAAC,UAAsB,OAAO,MAAM;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-typography",
|
|
3
|
-
"version": "3.12.0-
|
|
3
|
+
"version": "3.12.0-rc.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Typography",
|
|
6
6
|
"files": [
|
|
@@ -35,8 +35,8 @@
|
|
|
35
35
|
"indent": 4
|
|
36
36
|
},
|
|
37
37
|
"dependencies": {
|
|
38
|
-
"@elliemae/ds-system": "3.12.0-
|
|
39
|
-
"@elliemae/ds-utilities": "3.12.0-
|
|
38
|
+
"@elliemae/ds-system": "3.12.0-rc.0",
|
|
39
|
+
"@elliemae/ds-utilities": "3.12.0-rc.0"
|
|
40
40
|
},
|
|
41
41
|
"devDependencies": {
|
|
42
42
|
"@testing-library/jest-dom": "~5.16.4",
|