@elliemae/ds-typography 3.50.0-next.3 → 3.50.0-rc.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -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 type { DSTypographyT } from '../react-desc-prop-types.js';\n\nconst VariantToAsMap: Record<DSTypographyT.Variant, keyof JSX.IntrinsicElements> = {\n h1: 'h1',\n h2: 'h2',\n h3: 'h3',\n h4: 'h4',\n h5: 'h5',\n 'h3-strong': 'h3',\n 'h4-strong': 'h4',\n 'h5-strong': 'h5',\n b1: 'p',\n b2: 'p',\n b3: 'p',\n b4: 'p',\n 'b1-light': 'p',\n 'b2-light': 'p',\n 'b3-light': 'p',\n button: 'button',\n 'button-sml-title': 'button',\n 'button-med-title': 'button',\n 'button-lrg-title': 'button',\n link: 'a',\n 'link-sml-title': 'a',\n 'link-med-title': 'a',\n 'link-lrg-title': 'a',\n 'quote-brand': 'pre',\n 'quote-neutral': 'pre',\n 'highlight-neutral': 'span',\n 'highlight-brand': 'span',\n 'highlight-important': 'span',\n 'highlight-critical': 'span',\n 'feedback-neutral': 'span',\n 'feedback-brand': 'span',\n 'feedback-important': 'span',\n 'feedback-critical': 'span',\n 'h1-article': 'h1',\n 'h2-article': 'h2',\n 'h3-article': 'h3',\n 'h4-article': 'h4',\n 'h5-article': 'h5',\n 'b1-article': 'p',\n 'b2-article': 'p',\n 'b3-article': 'p',\n};\nexport const useDefaultProps = ({\n variant,\n component,\n as: userAs,\n}: DSTypographyT.Props): { as: keyof JSX.IntrinsicElements } => {\n // component prop has higher priority than as prop and variant prop\n const defaultAs = component || 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
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAGlB,MAAM,iBAA6E;AAAA,EACjF,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,oBAAoB;AAAA,EACpB,oBAAoB;AAAA,EACpB,oBAAoB;AAAA,EACpB,MAAM;AAAA,EACN,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,eAAe;AAAA,EACf,iBAAiB;AAAA,EACjB,qBAAqB;AAAA,EACrB,mBAAmB;AAAA,EACnB,uBAAuB;AAAA,EACvB,sBAAsB;AAAA,EACtB,oBAAoB;AAAA,EACpB,kBAAkB;AAAA,EAClB,sBAAsB;AAAA,EACtB,qBAAqB;AAAA,EACrB,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAChB;AACO,MAAM,kBAAkB,CAAC;AAAA,EAC9B;AAAA,EACA;AAAA,EACA,IAAI;AACN,MAAgE;AAE9D,QAAM,YAAY,aAAa,UAAU,eAAe,OAAO;AAC/D,QAAM,eAAe,aAAAA,QAAM,QAAQ,OAAO,EAAE,IAAI,UAAU,IAAI,CAAC,SAAS,CAAC;AACzE,SAAO;AACT;",
4
+ "sourcesContent": ["import React from 'react';\nimport type { DSTypographyT } from '../react-desc-prop-types.js';\n\nconst VariantToAsMap: Record<DSTypographyT.Variant, keyof React.JSX.IntrinsicElements> = {\n h1: 'h1',\n h2: 'h2',\n h3: 'h3',\n h4: 'h4',\n h5: 'h5',\n 'h3-strong': 'h3',\n 'h4-strong': 'h4',\n 'h5-strong': 'h5',\n b1: 'p',\n b2: 'p',\n b3: 'p',\n b4: 'p',\n 'b1-light': 'p',\n 'b2-light': 'p',\n 'b3-light': 'p',\n button: 'button',\n 'button-sml-title': 'button',\n 'button-med-title': 'button',\n 'button-lrg-title': 'button',\n link: 'a',\n 'link-sml-title': 'a',\n 'link-med-title': 'a',\n 'link-lrg-title': 'a',\n 'quote-brand': 'pre',\n 'quote-neutral': 'pre',\n 'highlight-neutral': 'span',\n 'highlight-brand': 'span',\n 'highlight-important': 'span',\n 'highlight-critical': 'span',\n 'feedback-neutral': 'span',\n 'feedback-brand': 'span',\n 'feedback-important': 'span',\n 'feedback-critical': 'span',\n 'h1-article': 'h1',\n 'h2-article': 'h2',\n 'h3-article': 'h3',\n 'h4-article': 'h4',\n 'h5-article': 'h5',\n 'b1-article': 'p',\n 'b2-article': 'p',\n 'b3-article': 'p',\n};\nexport const useDefaultProps = ({\n variant,\n component,\n as: userAs,\n}: DSTypographyT.Props): { as: keyof React.JSX.IntrinsicElements } => {\n // component prop has higher priority than as prop and variant prop\n const defaultAs = component || 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
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAGlB,MAAM,iBAAmF;AAAA,EACvF,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,oBAAoB;AAAA,EACpB,oBAAoB;AAAA,EACpB,oBAAoB;AAAA,EACpB,MAAM;AAAA,EACN,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,eAAe;AAAA,EACf,iBAAiB;AAAA,EACjB,qBAAqB;AAAA,EACrB,mBAAmB;AAAA,EACnB,uBAAuB;AAAA,EACvB,sBAAsB;AAAA,EACtB,oBAAoB;AAAA,EACpB,kBAAkB;AAAA,EAClB,sBAAsB;AAAA,EACtB,qBAAqB;AAAA,EACrB,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAChB;AACO,MAAM,kBAAkB,CAAC;AAAA,EAC9B;AAAA,EACA;AAAA,EACA,IAAI;AACN,MAAsE;AAEpE,QAAM,YAAY,aAAa,UAAU,eAAe,OAAO;AAC/D,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/react-desc-prop-types.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport type { GlobalAttributesT, XstyledProps, DSPropTypesSchema } from '@elliemae/ds-props-helpers';\nimport { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-props-helpers';\nimport type { FontSizeProps, LineHeightProps, ColorProps } from '@elliemae/ds-system';\nimport type { WeakValidationMap } from 'react';\n\nexport declare namespace DSTypographyT {\n export type HeadingVariants = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h3-strong' | 'h4-strong' | 'h5-strong';\n export type BodyVariants = 'b1' | 'b2' | 'b3' | 'b4' | 'b1-light' | 'b2-light' | 'b3-light';\n export type ButtonVariants = 'button' | 'button-sml-title' | 'button-med-title' | 'button-lrg-title';\n export type LinkVariants = 'link' | 'link-sml-title' | 'link-med-title' | 'link-lrg-title';\n export type QuoteVariants = 'quote-brand' | 'quote-neutral';\n export type HighlightVariants =\n | 'highlight-neutral'\n | 'highlight-brand'\n | 'highlight-important'\n | 'highlight-critical';\n export type FeedbackVariants = 'feedback-neutral' | 'feedback-brand' | 'feedback-important' | 'feedback-critical';\n export type ArticleHeadingVariants = 'h1-article' | 'h2-article' | 'h3-article' | 'h4-article' | 'h5-article';\n export type ArticleBodyVariants = 'b1-article' | 'b2-article' | 'b3-article';\n\n export type Variant =\n | HeadingVariants\n | BodyVariants\n | ButtonVariants\n | LinkVariants\n | QuoteVariants\n | HighlightVariants\n | ArticleHeadingVariants\n | ArticleBodyVariants\n | FeedbackVariants;\n\n export type VariantsMap = {\n [key in Uppercase<TypescriptHelpersT.KebabToSnakeCase<Variant>>]: Lowercase<\n TypescriptHelpersT.SnakeToKebabCase<key>\n >;\n };\n\n export type StyledPropsInterface = FontSizeProps &\n LineHeightProps &\n ColorProps & {\n children: DSTypographyT.InternalProps['children'];\n variant: DSTypographyT.Variant;\n $truncateWithEllipsis?: boolean;\n $truncateWithReadMore?: DSTypographyT.InternalProps['truncateWithReadMore'];\n };\n\n export interface RequiredProps {\n variant: Variant;\n children: React.ReactNode | React.ReactNode[];\n }\n\n export interface OptionalProps {\n as?: keyof JSX.IntrinsicElements;\n component?: keyof JSX.IntrinsicElements;\n innerRef?: React.MutableRefObject<HTMLDivElement | null> | React.RefCallback<HTMLDivElement>;\n truncateWithReadMore?: {\n lines: number;\n expanded: boolean;\n };\n }\n\n export interface DefaultProps {\n truncateWithEllipsis: boolean;\n }\n\n export interface Props\n extends Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps | 'color'>,\n XstyledProps,\n FontSizeProps,\n LineHeightProps,\n ColorProps,\n RequiredProps {}\n\n export interface InternalProps\n extends DefaultProps,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps | 'color'>,\n XstyledProps,\n FontSizeProps,\n LineHeightProps,\n ColorProps,\n RequiredProps {}\n}\n\nexport const DSTypographyPropTypes: DSPropTypesSchema<DSTypographyT.Props> = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n variant: PropTypes.oneOf([\n 'h1',\n 'h2',\n 'h3',\n 'h4',\n 'h5',\n 'h3-strong',\n 'h4-strong',\n 'h5-strong',\n 'b1',\n 'b2',\n 'b3',\n 'b4',\n 'b1-light',\n 'b2-light',\n 'b3-light',\n 'button',\n 'button-sml-title',\n 'button-med-title',\n 'button-lrg-title',\n 'link',\n 'link-sml-title',\n 'link-med-title',\n 'link-lrg-title',\n 'quote-brand',\n 'quote-neutral',\n 'highlight-neutral',\n 'highlight-brand',\n 'highlight-important',\n 'highlight-critical',\n 'feedback-neutral',\n 'feedback-brand',\n 'feedback-important',\n 'feedback-critical',\n 'h1-article',\n 'h2-article',\n 'h3-article',\n 'h4-article',\n 'h5-article',\n 'b1-article',\n 'b2-article',\n 'b3-article',\n ]).description(\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 button => <button />,\n link => <a />,\n 'quote-brand' => <pre />,\n 'quote-neutral' => <pre />,\n 'highlight-neutral' => <span />,\n 'highlight-brand' => <span />,\n 'highlight-important' => <span />,\n 'highlight-critical' => <span />,\n 'h1-article' => <h1 />,\n 'h2-article' => <h2 />,\n 'h3-article' => <h3 />,\n 'h4-article' => <h4 />,\n 'h5-article' => <h5 />,\n 'b1-article' => <p />,\n 'b2-article' => <p />,\n 'b3-article' => <p />,\n `,\n ).isRequired,\n children: PropTypes.node.description('Children element').isRequired,\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).description('Inner ref to font component.'),\n fontSize: PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.object, PropTypes.bool])\n .description('Applies to the root container. For more info read xstyled docs')\n .xstyled(),\n lineHeight: PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.object, PropTypes.bool])\n .description('Applies to the root container. For more info read xstyled docs')\n .xstyled(),\n as: PropTypes.string.description('Use to override the printed HTML tag, ex: `span` or `strong`'),\n component: PropTypes.string.description(\n 'Same as `as` for internal use. Use to override the printed HTML tag, ex: `span` or `strong`',\n ),\n truncateWithEllipsis: PropTypes.bool\n .description('If true, the text will not wrap, but instead will truncate with a text overflow ellipsis.')\n .defaultValue(false),\n truncateWithReadMore: PropTypes.shape({\n lines: PropTypes.number.description('Number of lines to truncate to.'),\n expanded: PropTypes.bool.description('If true, the text will be expanded.'),\n }).description(\n 'Ammount of lines to truncate to. If expanded, the text will be expanded. Use in conjunction with useReadMoreTruncate hook',\n ),\n};\n\nexport const DSTypographyPropTypesSchema = DSTypographyPropTypes as unknown as WeakValidationMap<DSTypographyT.Props>;\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,8BAAuE;AAqFhE,MAAM,wBAAgE;AAAA,EAC3E,GAAG;AAAA,EACH,GAAG;AAAA,EACH,SAAS,kCAAU,MAAM;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC,EAAE;AAAA,IACD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA4BF,EAAE;AAAA,EACF,UAAU,kCAAU,KAAK,YAAY,kBAAkB,EAAE;AAAA,EACzD,UAAU,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,IAAI,CAAC,EAAE,YAAY,8BAA8B;AAAA,EAC5G,UAAU,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,QAAQ,kCAAU,QAAQ,kCAAU,IAAI,CAAC,EACjG,YAAY,gEAAgE,EAC5E,QAAQ;AAAA,EACX,YAAY,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,QAAQ,kCAAU,QAAQ,kCAAU,IAAI,CAAC,EACnG,YAAY,gEAAgE,EAC5E,QAAQ;AAAA,EACX,IAAI,kCAAU,OAAO,YAAY,8DAA8D;AAAA,EAC/F,WAAW,kCAAU,OAAO;AAAA,IAC1B;AAAA,EACF;AAAA,EACA,sBAAsB,kCAAU,KAC7B,YAAY,2FAA2F,EACvG,aAAa,KAAK;AAAA,EACrB,sBAAsB,kCAAU,MAAM;AAAA,IACpC,OAAO,kCAAU,OAAO,YAAY,iCAAiC;AAAA,IACrE,UAAU,kCAAU,KAAK,YAAY,qCAAqC;AAAA,EAC5E,CAAC,EAAE;AAAA,IACD;AAAA,EACF;AACF;AAEO,MAAM,8BAA8B;",
4
+ "sourcesContent": ["import { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport type { GlobalAttributesT, XstyledProps, DSPropTypesSchema } from '@elliemae/ds-props-helpers';\nimport { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-props-helpers';\nimport type { FontSizeProps, LineHeightProps, ColorProps } from '@elliemae/ds-system';\nimport type { WeakValidationMap } from 'react';\n\nexport declare namespace DSTypographyT {\n export type HeadingVariants = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h3-strong' | 'h4-strong' | 'h5-strong';\n export type BodyVariants = 'b1' | 'b2' | 'b3' | 'b4' | 'b1-light' | 'b2-light' | 'b3-light';\n export type ButtonVariants = 'button' | 'button-sml-title' | 'button-med-title' | 'button-lrg-title';\n export type LinkVariants = 'link' | 'link-sml-title' | 'link-med-title' | 'link-lrg-title';\n export type QuoteVariants = 'quote-brand' | 'quote-neutral';\n export type HighlightVariants =\n | 'highlight-neutral'\n | 'highlight-brand'\n | 'highlight-important'\n | 'highlight-critical';\n export type FeedbackVariants = 'feedback-neutral' | 'feedback-brand' | 'feedback-important' | 'feedback-critical';\n export type ArticleHeadingVariants = 'h1-article' | 'h2-article' | 'h3-article' | 'h4-article' | 'h5-article';\n export type ArticleBodyVariants = 'b1-article' | 'b2-article' | 'b3-article';\n\n export type Variant =\n | HeadingVariants\n | BodyVariants\n | ButtonVariants\n | LinkVariants\n | QuoteVariants\n | HighlightVariants\n | ArticleHeadingVariants\n | ArticleBodyVariants\n | FeedbackVariants;\n\n export type VariantsMap = {\n [key in Uppercase<TypescriptHelpersT.KebabToSnakeCase<Variant>>]: Lowercase<\n TypescriptHelpersT.SnakeToKebabCase<key>\n >;\n };\n\n export type StyledPropsInterface = FontSizeProps &\n LineHeightProps &\n ColorProps & {\n children: DSTypographyT.InternalProps['children'];\n variant: DSTypographyT.Variant;\n $truncateWithEllipsis?: boolean;\n $truncateWithReadMore?: DSTypographyT.InternalProps['truncateWithReadMore'];\n };\n\n export interface RequiredProps {\n variant: Variant;\n children: React.ReactNode | React.ReactNode[];\n }\n\n export interface OptionalProps {\n as?: keyof React.JSX.IntrinsicElements;\n component?: keyof React.JSX.IntrinsicElements;\n innerRef?: React.MutableRefObject<HTMLDivElement | null> | React.RefCallback<HTMLDivElement>;\n truncateWithReadMore?: {\n lines: number;\n expanded: boolean;\n };\n }\n\n export interface DefaultProps {\n truncateWithEllipsis: boolean;\n }\n\n export interface Props\n extends Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps | 'color'>,\n XstyledProps,\n FontSizeProps,\n LineHeightProps,\n ColorProps,\n RequiredProps {}\n\n export interface InternalProps\n extends DefaultProps,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps | 'color'>,\n XstyledProps,\n FontSizeProps,\n LineHeightProps,\n ColorProps,\n RequiredProps {}\n}\n\nexport const DSTypographyPropTypes: DSPropTypesSchema<DSTypographyT.Props> = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n variant: PropTypes.oneOf([\n 'h1',\n 'h2',\n 'h3',\n 'h4',\n 'h5',\n 'h3-strong',\n 'h4-strong',\n 'h5-strong',\n 'b1',\n 'b2',\n 'b3',\n 'b4',\n 'b1-light',\n 'b2-light',\n 'b3-light',\n 'button',\n 'button-sml-title',\n 'button-med-title',\n 'button-lrg-title',\n 'link',\n 'link-sml-title',\n 'link-med-title',\n 'link-lrg-title',\n 'quote-brand',\n 'quote-neutral',\n 'highlight-neutral',\n 'highlight-brand',\n 'highlight-important',\n 'highlight-critical',\n 'feedback-neutral',\n 'feedback-brand',\n 'feedback-important',\n 'feedback-critical',\n 'h1-article',\n 'h2-article',\n 'h3-article',\n 'h4-article',\n 'h5-article',\n 'b1-article',\n 'b2-article',\n 'b3-article',\n ]).description(\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 button => <button />,\n link => <a />,\n 'quote-brand' => <pre />,\n 'quote-neutral' => <pre />,\n 'highlight-neutral' => <span />,\n 'highlight-brand' => <span />,\n 'highlight-important' => <span />,\n 'highlight-critical' => <span />,\n 'h1-article' => <h1 />,\n 'h2-article' => <h2 />,\n 'h3-article' => <h3 />,\n 'h4-article' => <h4 />,\n 'h5-article' => <h5 />,\n 'b1-article' => <p />,\n 'b2-article' => <p />,\n 'b3-article' => <p />,\n `,\n ).isRequired,\n children: PropTypes.node.description('Children element').isRequired,\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).description('Inner ref to font component.'),\n fontSize: PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.object, PropTypes.bool])\n .description('Applies to the root container. For more info read xstyled docs')\n .xstyled(),\n lineHeight: PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.object, PropTypes.bool])\n .description('Applies to the root container. For more info read xstyled docs')\n .xstyled(),\n as: PropTypes.string.description('Use to override the printed HTML tag, ex: `span` or `strong`'),\n component: PropTypes.string.description(\n 'Same as `as` for internal use. Use to override the printed HTML tag, ex: `span` or `strong`',\n ),\n truncateWithEllipsis: PropTypes.bool\n .description('If true, the text will not wrap, but instead will truncate with a text overflow ellipsis.')\n .defaultValue(false),\n truncateWithReadMore: PropTypes.shape({\n lines: PropTypes.number.description('Number of lines to truncate to.'),\n expanded: PropTypes.bool.description('If true, the text will be expanded.'),\n }).description(\n 'Ammount of lines to truncate to. If expanded, the text will be expanded. Use in conjunction with useReadMoreTruncate hook',\n ),\n};\n\n// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\nexport const DSTypographyPropTypesSchema = DSTypographyPropTypes as unknown as WeakValidationMap<DSTypographyT.Props>;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,8BAAuE;AAqFhE,MAAM,wBAAgE;AAAA,EAC3E,GAAG;AAAA,EACH,GAAG;AAAA,EACH,SAAS,kCAAU,MAAM;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC,EAAE;AAAA,IACD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA4BF,EAAE;AAAA,EACF,UAAU,kCAAU,KAAK,YAAY,kBAAkB,EAAE;AAAA,EACzD,UAAU,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,IAAI,CAAC,EAAE,YAAY,8BAA8B;AAAA,EAC5G,UAAU,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,QAAQ,kCAAU,QAAQ,kCAAU,IAAI,CAAC,EACjG,YAAY,gEAAgE,EAC5E,QAAQ;AAAA,EACX,YAAY,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,QAAQ,kCAAU,QAAQ,kCAAU,IAAI,CAAC,EACnG,YAAY,gEAAgE,EAC5E,QAAQ;AAAA,EACX,IAAI,kCAAU,OAAO,YAAY,8DAA8D;AAAA,EAC/F,WAAW,kCAAU,OAAO;AAAA,IAC1B;AAAA,EACF;AAAA,EACA,sBAAsB,kCAAU,KAC7B,YAAY,2FAA2F,EACvG,aAAa,KAAK;AAAA,EACrB,sBAAsB,kCAAU,MAAM;AAAA,IACpC,OAAO,kCAAU,OAAO,YAAY,iCAAiC;AAAA,IACrE,UAAU,kCAAU,KAAK,YAAY,qCAAqC;AAAA,EAC5E,CAAC,EAAE;AAAA,IACD;AAAA,EACF;AACF;AAGO,MAAM,8BAA8B;",
6
6
  "names": []
7
7
  }
@@ -26,7 +26,7 @@ var import_jsx_runtime = require("react/jsx-runtime");
26
26
  var import__ = require("../index.js");
27
27
  const testRequiredProps = {
28
28
  variant: "h1",
29
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: "nope" })
29
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {})
30
30
  };
31
31
  const testOptionalProps = {
32
32
  truncateWithReadMore: {
@@ -63,20 +63,20 @@ const testExplicitDefinition = {
63
63
  fontSize: "16px",
64
64
  lineHeight: "20px",
65
65
  color: "brand-200",
66
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: "noop" })
66
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {})
67
67
  };
68
68
  const testInferedTypeCompatibility = {
69
69
  variant: "b1",
70
70
  fontSize: "16px",
71
71
  lineHeight: "20px",
72
- color: "neutral-500",
72
+ color: "info-500",
73
73
  textDecoration: "underline",
74
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: "noop" })
74
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {})
75
75
  };
76
76
  const testDefinitionAsConst = {
77
77
  variant: "link",
78
78
  href: "something.com",
79
- color: "brand-300",
79
+ color: "neutral-300",
80
80
  children: "Some children value"
81
81
  };
82
82
  const ExampleUsageComponent = () => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/typescript-testing/typescript-typography-valid.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-unused-vars, no-unused-vars */\nimport { DSTypography } from '../index.js';\nimport type { DSTypographyT } from '../index.js';\n\n// test we expose the namespace and the namespace follows our deliverable conventions\ntype ComponentPropsForApp = DSTypographyT.Props;\ntype ComponentPropsInternals = DSTypographyT.InternalProps;\ntype ComponentPropsDefaultProps = DSTypographyT.DefaultProps;\ntype ComponentPropsOptionalProps = DSTypographyT.OptionalProps;\ntype ComponentPropsRequiredProps = DSTypographyT.RequiredProps;\n\nconst testRequiredProps: ComponentPropsRequiredProps = {\n variant: 'h1',\n children: <>nope</>,\n};\nconst testOptionalProps: ComponentPropsOptionalProps = {\n truncateWithReadMore: {\n lines: 2,\n expanded: false,\n },\n};\n\n// difference Props and InternalProps is that InternalProps has all the default props filled in\n// Props allows for partial defaults\nconst testPartialDefaults: Partial<ComponentPropsDefaultProps> = {};\nconst testProps: ComponentPropsForApp = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testPartialDefaults,\n};\nconst testPropsAsSyntax = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testPartialDefaults,\n} as ComponentPropsForApp;\n// InternalProps requires all defaults to be filled in\nconst testCompleteDefaults: Required<ComponentPropsDefaultProps> = {\n truncateWithEllipsis: true,\n};\nconst testInternalProps: ComponentPropsInternals = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testCompleteDefaults,\n};\nconst testInternalPropsAsSyntax = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testCompleteDefaults,\n} as ComponentPropsInternals;\n\n// using the explicit type definition, if there is an error, it will be marked on the key that is wrong\nconst testExplicitDefinition: ComponentPropsForApp = {\n variant: 'h1',\n fontSize: '16px',\n lineHeight: '20px',\n color: 'brand-200',\n children: <>noop</>,\n};\n\n// using the \"as\" syntax, if there is an error, it will be marking the whole object as wrong because it is not compatible with the type\nconst testInferedTypeCompatibility = {\n variant: 'b1',\n fontSize: '16px',\n lineHeight: '20px',\n color: 'neutral-500',\n textDecoration: 'underline',\n children: <>noop</>,\n} as ComponentPropsForApp;\n\nconst testDefinitionAsConst = {\n variant: 'link',\n href: 'something.com',\n color: 'brand-300',\n children: 'Some children value',\n} as const;\n\nconst ExampleUsageComponent = () => (\n <>\n {/* works with explicitly casted props, all syntaxes */}\n <DSTypography {...testExplicitDefinition} />\n <DSTypography {...testInferedTypeCompatibility} />\n <DSTypography {...testDefinitionAsConst} />\n {/* works with inline values */}\n <DSTypography variant=\"button\">Button</DSTypography>\n </>\n);\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA,YAAuB;ACaX;AAZZ,eAA6B;AAU7B,MAAM,oBAAiD;AAAA,EACrD,SAAS;AAAA,EACT,UAAU,2EAAE,kBAAI;AAClB;AACA,MAAM,oBAAiD;AAAA,EACrD,sBAAsB;AAAA,IACpB,OAAO;AAAA,IACP,UAAU;AAAA,EACZ;AACF;AAIA,MAAM,sBAA2D,CAAC;AAClE,MAAM,YAAkC;AAAA,EACtC,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AACA,MAAM,oBAAoB;AAAA,EACxB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAEA,MAAM,uBAA6D;AAAA,EACjE,sBAAsB;AACxB;AACA,MAAM,oBAA6C;AAAA,EACjD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AACA,MAAM,4BAA4B;AAAA,EAChC,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAGA,MAAM,yBAA+C;AAAA,EACnD,SAAS;AAAA,EACT,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,UAAU,2EAAE,kBAAI;AAClB;AAGA,MAAM,+BAA+B;AAAA,EACnC,SAAS;AAAA,EACT,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,gBAAgB;AAAA,EAChB,UAAU,2EAAE,kBAAI;AAClB;AAEA,MAAM,wBAAwB;AAAA,EAC5B,SAAS;AAAA,EACT,MAAM;AAAA,EACN,OAAO;AAAA,EACP,UAAU;AACZ;AAEA,MAAM,wBAAwB,MAC5B,4EAEE;AAAA,8CAAC,yBAAc,GAAG,wBAAwB;AAAA,EAC1C,4CAAC,yBAAc,GAAG,8BAA8B;AAAA,EAChD,4CAAC,yBAAc,GAAG,uBAAuB;AAAA,EAEzC,4CAAC,yBAAa,SAAQ,UAAS,oBAAM;AAAA,GACvC;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-unused-vars, no-unused-vars */\nimport { DSTypography } from '../index.js';\nimport type { DSTypographyT } from '../index.js';\n\n// test we expose the namespace and the namespace follows our deliverable conventions\ntype ComponentPropsForApp = DSTypographyT.Props;\ntype ComponentPropsInternals = DSTypographyT.InternalProps;\ntype ComponentPropsDefaultProps = DSTypographyT.DefaultProps;\ntype ComponentPropsOptionalProps = DSTypographyT.OptionalProps;\ntype ComponentPropsRequiredProps = DSTypographyT.RequiredProps;\n\nconst testRequiredProps: ComponentPropsRequiredProps = {\n variant: 'h1',\n children: <></>,\n};\nconst testOptionalProps: ComponentPropsOptionalProps = {\n truncateWithReadMore: {\n lines: 2,\n expanded: false,\n },\n};\n\n// difference Props and InternalProps is that InternalProps has all the default props filled in\n// Props allows for partial defaults\nconst testPartialDefaults: Partial<ComponentPropsDefaultProps> = {};\nconst testProps: ComponentPropsForApp = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testPartialDefaults,\n};\nconst testPropsAsSyntax = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testPartialDefaults,\n} as ComponentPropsForApp;\n// InternalProps requires all defaults to be filled in\nconst testCompleteDefaults: Required<ComponentPropsDefaultProps> = {\n truncateWithEllipsis: true,\n};\nconst testInternalProps: ComponentPropsInternals = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testCompleteDefaults,\n};\nconst testInternalPropsAsSyntax = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testCompleteDefaults,\n} as ComponentPropsInternals;\n\n// using the explicit type definition, if there is an error, it will be marked on the key that is wrong\nconst testExplicitDefinition: ComponentPropsForApp = {\n variant: 'h1',\n fontSize: '16px',\n lineHeight: '20px',\n color: 'brand-200',\n children: <></>,\n};\n\n// using the \"as\" syntax, if there is an error, it will be marking the whole object as wrong because it is not compatible with the type\nconst testInferedTypeCompatibility = {\n variant: 'b1',\n fontSize: '16px',\n lineHeight: '20px',\n color: 'info-500',\n textDecoration: 'underline',\n children: <></>,\n} as ComponentPropsForApp;\n\nconst testDefinitionAsConst = {\n variant: 'link',\n href: 'something.com',\n color: 'neutral-300',\n children: 'Some children value',\n} as const;\n\nconst ExampleUsageComponent = () => (\n <>\n {/* works with explicitly casted props, all syntaxes */}\n <DSTypography {...testExplicitDefinition} />\n <DSTypography {...testInferedTypeCompatibility} />\n <DSTypography {...testDefinitionAsConst} />\n {/* works with inline values */}\n <DSTypography variant=\"button\">Button</DSTypography>\n </>\n);\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA,YAAuB;ACaX;AAZZ,eAA6B;AAU7B,MAAM,oBAAiD;AAAA,EACrD,SAAS;AAAA,EACT,UAAU,2EAAE;AACd;AACA,MAAM,oBAAiD;AAAA,EACrD,sBAAsB;AAAA,IACpB,OAAO;AAAA,IACP,UAAU;AAAA,EACZ;AACF;AAIA,MAAM,sBAA2D,CAAC;AAClE,MAAM,YAAkC;AAAA,EACtC,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AACA,MAAM,oBAAoB;AAAA,EACxB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAEA,MAAM,uBAA6D;AAAA,EACjE,sBAAsB;AACxB;AACA,MAAM,oBAA6C;AAAA,EACjD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AACA,MAAM,4BAA4B;AAAA,EAChC,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAGA,MAAM,yBAA+C;AAAA,EACnD,SAAS;AAAA,EACT,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,UAAU,2EAAE;AACd;AAGA,MAAM,+BAA+B;AAAA,EACnC,SAAS;AAAA,EACT,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,gBAAgB;AAAA,EAChB,UAAU,2EAAE;AACd;AAEA,MAAM,wBAAwB;AAAA,EAC5B,SAAS;AAAA,EACT,MAAM;AAAA,EACN,OAAO;AAAA,EACP,UAAU;AACZ;AAEA,MAAM,wBAAwB,MAC5B,4EAEE;AAAA,8CAAC,yBAAc,GAAG,wBAAwB;AAAA,EAC1C,4CAAC,yBAAc,GAAG,8BAA8B;AAAA,EAChD,4CAAC,yBAAc,GAAG,uBAAuB;AAAA,EAEzC,4CAAC,yBAAa,SAAQ,UAAS,oBAAM;AAAA,GACvC;",
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 type { DSTypographyT } from '../react-desc-prop-types.js';\n\nconst VariantToAsMap: Record<DSTypographyT.Variant, keyof JSX.IntrinsicElements> = {\n h1: 'h1',\n h2: 'h2',\n h3: 'h3',\n h4: 'h4',\n h5: 'h5',\n 'h3-strong': 'h3',\n 'h4-strong': 'h4',\n 'h5-strong': 'h5',\n b1: 'p',\n b2: 'p',\n b3: 'p',\n b4: 'p',\n 'b1-light': 'p',\n 'b2-light': 'p',\n 'b3-light': 'p',\n button: 'button',\n 'button-sml-title': 'button',\n 'button-med-title': 'button',\n 'button-lrg-title': 'button',\n link: 'a',\n 'link-sml-title': 'a',\n 'link-med-title': 'a',\n 'link-lrg-title': 'a',\n 'quote-brand': 'pre',\n 'quote-neutral': 'pre',\n 'highlight-neutral': 'span',\n 'highlight-brand': 'span',\n 'highlight-important': 'span',\n 'highlight-critical': 'span',\n 'feedback-neutral': 'span',\n 'feedback-brand': 'span',\n 'feedback-important': 'span',\n 'feedback-critical': 'span',\n 'h1-article': 'h1',\n 'h2-article': 'h2',\n 'h3-article': 'h3',\n 'h4-article': 'h4',\n 'h5-article': 'h5',\n 'b1-article': 'p',\n 'b2-article': 'p',\n 'b3-article': 'p',\n};\nexport const useDefaultProps = ({\n variant,\n component,\n as: userAs,\n}: DSTypographyT.Props): { as: keyof JSX.IntrinsicElements } => {\n // component prop has higher priority than as prop and variant prop\n const defaultAs = component || userAs || VariantToAsMap[variant];\n const defaultProps = React.useMemo(() => ({ as: defaultAs }), [defaultAs]);\n return defaultProps;\n};\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAGlB,MAAM,iBAA6E;AAAA,EACjF,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,oBAAoB;AAAA,EACpB,oBAAoB;AAAA,EACpB,oBAAoB;AAAA,EACpB,MAAM;AAAA,EACN,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,eAAe;AAAA,EACf,iBAAiB;AAAA,EACjB,qBAAqB;AAAA,EACrB,mBAAmB;AAAA,EACnB,uBAAuB;AAAA,EACvB,sBAAsB;AAAA,EACtB,oBAAoB;AAAA,EACpB,kBAAkB;AAAA,EAClB,sBAAsB;AAAA,EACtB,qBAAqB;AAAA,EACrB,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAChB;AACO,MAAM,kBAAkB,CAAC;AAAA,EAC9B;AAAA,EACA;AAAA,EACA,IAAI;AACN,MAAgE;AAE9D,QAAM,YAAY,aAAa,UAAU,eAAe,OAAO;AAC/D,QAAM,eAAeA,OAAM,QAAQ,OAAO,EAAE,IAAI,UAAU,IAAI,CAAC,SAAS,CAAC;AACzE,SAAO;AACT;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport type { DSTypographyT } from '../react-desc-prop-types.js';\n\nconst VariantToAsMap: Record<DSTypographyT.Variant, keyof React.JSX.IntrinsicElements> = {\n h1: 'h1',\n h2: 'h2',\n h3: 'h3',\n h4: 'h4',\n h5: 'h5',\n 'h3-strong': 'h3',\n 'h4-strong': 'h4',\n 'h5-strong': 'h5',\n b1: 'p',\n b2: 'p',\n b3: 'p',\n b4: 'p',\n 'b1-light': 'p',\n 'b2-light': 'p',\n 'b3-light': 'p',\n button: 'button',\n 'button-sml-title': 'button',\n 'button-med-title': 'button',\n 'button-lrg-title': 'button',\n link: 'a',\n 'link-sml-title': 'a',\n 'link-med-title': 'a',\n 'link-lrg-title': 'a',\n 'quote-brand': 'pre',\n 'quote-neutral': 'pre',\n 'highlight-neutral': 'span',\n 'highlight-brand': 'span',\n 'highlight-important': 'span',\n 'highlight-critical': 'span',\n 'feedback-neutral': 'span',\n 'feedback-brand': 'span',\n 'feedback-important': 'span',\n 'feedback-critical': 'span',\n 'h1-article': 'h1',\n 'h2-article': 'h2',\n 'h3-article': 'h3',\n 'h4-article': 'h4',\n 'h5-article': 'h5',\n 'b1-article': 'p',\n 'b2-article': 'p',\n 'b3-article': 'p',\n};\nexport const useDefaultProps = ({\n variant,\n component,\n as: userAs,\n}: DSTypographyT.Props): { as: keyof React.JSX.IntrinsicElements } => {\n // component prop has higher priority than as prop and variant prop\n const defaultAs = component || userAs || VariantToAsMap[variant];\n const defaultProps = React.useMemo(() => ({ as: defaultAs }), [defaultAs]);\n return defaultProps;\n};\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAGlB,MAAM,iBAAmF;AAAA,EACvF,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,oBAAoB;AAAA,EACpB,oBAAoB;AAAA,EACpB,oBAAoB;AAAA,EACpB,MAAM;AAAA,EACN,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,eAAe;AAAA,EACf,iBAAiB;AAAA,EACjB,qBAAqB;AAAA,EACrB,mBAAmB;AAAA,EACnB,uBAAuB;AAAA,EACvB,sBAAsB;AAAA,EACtB,oBAAoB;AAAA,EACpB,kBAAkB;AAAA,EAClB,sBAAsB;AAAA,EACtB,qBAAqB;AAAA,EACrB,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAChB;AACO,MAAM,kBAAkB,CAAC;AAAA,EAC9B;AAAA,EACA;AAAA,EACA,IAAI;AACN,MAAsE;AAEpE,QAAM,YAAY,aAAa,UAAU,eAAe,OAAO;AAC/D,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/react-desc-prop-types.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport type { GlobalAttributesT, XstyledProps, DSPropTypesSchema } from '@elliemae/ds-props-helpers';\nimport { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-props-helpers';\nimport type { FontSizeProps, LineHeightProps, ColorProps } from '@elliemae/ds-system';\nimport type { WeakValidationMap } from 'react';\n\nexport declare namespace DSTypographyT {\n export type HeadingVariants = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h3-strong' | 'h4-strong' | 'h5-strong';\n export type BodyVariants = 'b1' | 'b2' | 'b3' | 'b4' | 'b1-light' | 'b2-light' | 'b3-light';\n export type ButtonVariants = 'button' | 'button-sml-title' | 'button-med-title' | 'button-lrg-title';\n export type LinkVariants = 'link' | 'link-sml-title' | 'link-med-title' | 'link-lrg-title';\n export type QuoteVariants = 'quote-brand' | 'quote-neutral';\n export type HighlightVariants =\n | 'highlight-neutral'\n | 'highlight-brand'\n | 'highlight-important'\n | 'highlight-critical';\n export type FeedbackVariants = 'feedback-neutral' | 'feedback-brand' | 'feedback-important' | 'feedback-critical';\n export type ArticleHeadingVariants = 'h1-article' | 'h2-article' | 'h3-article' | 'h4-article' | 'h5-article';\n export type ArticleBodyVariants = 'b1-article' | 'b2-article' | 'b3-article';\n\n export type Variant =\n | HeadingVariants\n | BodyVariants\n | ButtonVariants\n | LinkVariants\n | QuoteVariants\n | HighlightVariants\n | ArticleHeadingVariants\n | ArticleBodyVariants\n | FeedbackVariants;\n\n export type VariantsMap = {\n [key in Uppercase<TypescriptHelpersT.KebabToSnakeCase<Variant>>]: Lowercase<\n TypescriptHelpersT.SnakeToKebabCase<key>\n >;\n };\n\n export type StyledPropsInterface = FontSizeProps &\n LineHeightProps &\n ColorProps & {\n children: DSTypographyT.InternalProps['children'];\n variant: DSTypographyT.Variant;\n $truncateWithEllipsis?: boolean;\n $truncateWithReadMore?: DSTypographyT.InternalProps['truncateWithReadMore'];\n };\n\n export interface RequiredProps {\n variant: Variant;\n children: React.ReactNode | React.ReactNode[];\n }\n\n export interface OptionalProps {\n as?: keyof JSX.IntrinsicElements;\n component?: keyof JSX.IntrinsicElements;\n innerRef?: React.MutableRefObject<HTMLDivElement | null> | React.RefCallback<HTMLDivElement>;\n truncateWithReadMore?: {\n lines: number;\n expanded: boolean;\n };\n }\n\n export interface DefaultProps {\n truncateWithEllipsis: boolean;\n }\n\n export interface Props\n extends Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps | 'color'>,\n XstyledProps,\n FontSizeProps,\n LineHeightProps,\n ColorProps,\n RequiredProps {}\n\n export interface InternalProps\n extends DefaultProps,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps | 'color'>,\n XstyledProps,\n FontSizeProps,\n LineHeightProps,\n ColorProps,\n RequiredProps {}\n}\n\nexport const DSTypographyPropTypes: DSPropTypesSchema<DSTypographyT.Props> = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n variant: PropTypes.oneOf([\n 'h1',\n 'h2',\n 'h3',\n 'h4',\n 'h5',\n 'h3-strong',\n 'h4-strong',\n 'h5-strong',\n 'b1',\n 'b2',\n 'b3',\n 'b4',\n 'b1-light',\n 'b2-light',\n 'b3-light',\n 'button',\n 'button-sml-title',\n 'button-med-title',\n 'button-lrg-title',\n 'link',\n 'link-sml-title',\n 'link-med-title',\n 'link-lrg-title',\n 'quote-brand',\n 'quote-neutral',\n 'highlight-neutral',\n 'highlight-brand',\n 'highlight-important',\n 'highlight-critical',\n 'feedback-neutral',\n 'feedback-brand',\n 'feedback-important',\n 'feedback-critical',\n 'h1-article',\n 'h2-article',\n 'h3-article',\n 'h4-article',\n 'h5-article',\n 'b1-article',\n 'b2-article',\n 'b3-article',\n ]).description(\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 button => <button />,\n link => <a />,\n 'quote-brand' => <pre />,\n 'quote-neutral' => <pre />,\n 'highlight-neutral' => <span />,\n 'highlight-brand' => <span />,\n 'highlight-important' => <span />,\n 'highlight-critical' => <span />,\n 'h1-article' => <h1 />,\n 'h2-article' => <h2 />,\n 'h3-article' => <h3 />,\n 'h4-article' => <h4 />,\n 'h5-article' => <h5 />,\n 'b1-article' => <p />,\n 'b2-article' => <p />,\n 'b3-article' => <p />,\n `,\n ).isRequired,\n children: PropTypes.node.description('Children element').isRequired,\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).description('Inner ref to font component.'),\n fontSize: PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.object, PropTypes.bool])\n .description('Applies to the root container. For more info read xstyled docs')\n .xstyled(),\n lineHeight: PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.object, PropTypes.bool])\n .description('Applies to the root container. For more info read xstyled docs')\n .xstyled(),\n as: PropTypes.string.description('Use to override the printed HTML tag, ex: `span` or `strong`'),\n component: PropTypes.string.description(\n 'Same as `as` for internal use. Use to override the printed HTML tag, ex: `span` or `strong`',\n ),\n truncateWithEllipsis: PropTypes.bool\n .description('If true, the text will not wrap, but instead will truncate with a text overflow ellipsis.')\n .defaultValue(false),\n truncateWithReadMore: PropTypes.shape({\n lines: PropTypes.number.description('Number of lines to truncate to.'),\n expanded: PropTypes.bool.description('If true, the text will be expanded.'),\n }).description(\n 'Ammount of lines to truncate to. If expanded, the text will be expanded. Use in conjunction with useReadMoreTruncate hook',\n ),\n};\n\nexport const DSTypographyPropTypesSchema = DSTypographyPropTypes as unknown as WeakValidationMap<DSTypographyT.Props>;\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACEvB,SAAS,WAAW,2BAA2B,wBAAwB;AAqFhE,MAAM,wBAAgE;AAAA,EAC3E,GAAG;AAAA,EACH,GAAG;AAAA,EACH,SAAS,UAAU,MAAM;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC,EAAE;AAAA,IACD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA4BF,EAAE;AAAA,EACF,UAAU,UAAU,KAAK,YAAY,kBAAkB,EAAE;AAAA,EACzD,UAAU,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,IAAI,CAAC,EAAE,YAAY,8BAA8B;AAAA,EAC5G,UAAU,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,QAAQ,UAAU,QAAQ,UAAU,IAAI,CAAC,EACjG,YAAY,gEAAgE,EAC5E,QAAQ;AAAA,EACX,YAAY,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,QAAQ,UAAU,QAAQ,UAAU,IAAI,CAAC,EACnG,YAAY,gEAAgE,EAC5E,QAAQ;AAAA,EACX,IAAI,UAAU,OAAO,YAAY,8DAA8D;AAAA,EAC/F,WAAW,UAAU,OAAO;AAAA,IAC1B;AAAA,EACF;AAAA,EACA,sBAAsB,UAAU,KAC7B,YAAY,2FAA2F,EACvG,aAAa,KAAK;AAAA,EACrB,sBAAsB,UAAU,MAAM;AAAA,IACpC,OAAO,UAAU,OAAO,YAAY,iCAAiC;AAAA,IACrE,UAAU,UAAU,KAAK,YAAY,qCAAqC;AAAA,EAC5E,CAAC,EAAE;AAAA,IACD;AAAA,EACF;AACF;AAEO,MAAM,8BAA8B;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport type { GlobalAttributesT, XstyledProps, DSPropTypesSchema } from '@elliemae/ds-props-helpers';\nimport { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-props-helpers';\nimport type { FontSizeProps, LineHeightProps, ColorProps } from '@elliemae/ds-system';\nimport type { WeakValidationMap } from 'react';\n\nexport declare namespace DSTypographyT {\n export type HeadingVariants = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h3-strong' | 'h4-strong' | 'h5-strong';\n export type BodyVariants = 'b1' | 'b2' | 'b3' | 'b4' | 'b1-light' | 'b2-light' | 'b3-light';\n export type ButtonVariants = 'button' | 'button-sml-title' | 'button-med-title' | 'button-lrg-title';\n export type LinkVariants = 'link' | 'link-sml-title' | 'link-med-title' | 'link-lrg-title';\n export type QuoteVariants = 'quote-brand' | 'quote-neutral';\n export type HighlightVariants =\n | 'highlight-neutral'\n | 'highlight-brand'\n | 'highlight-important'\n | 'highlight-critical';\n export type FeedbackVariants = 'feedback-neutral' | 'feedback-brand' | 'feedback-important' | 'feedback-critical';\n export type ArticleHeadingVariants = 'h1-article' | 'h2-article' | 'h3-article' | 'h4-article' | 'h5-article';\n export type ArticleBodyVariants = 'b1-article' | 'b2-article' | 'b3-article';\n\n export type Variant =\n | HeadingVariants\n | BodyVariants\n | ButtonVariants\n | LinkVariants\n | QuoteVariants\n | HighlightVariants\n | ArticleHeadingVariants\n | ArticleBodyVariants\n | FeedbackVariants;\n\n export type VariantsMap = {\n [key in Uppercase<TypescriptHelpersT.KebabToSnakeCase<Variant>>]: Lowercase<\n TypescriptHelpersT.SnakeToKebabCase<key>\n >;\n };\n\n export type StyledPropsInterface = FontSizeProps &\n LineHeightProps &\n ColorProps & {\n children: DSTypographyT.InternalProps['children'];\n variant: DSTypographyT.Variant;\n $truncateWithEllipsis?: boolean;\n $truncateWithReadMore?: DSTypographyT.InternalProps['truncateWithReadMore'];\n };\n\n export interface RequiredProps {\n variant: Variant;\n children: React.ReactNode | React.ReactNode[];\n }\n\n export interface OptionalProps {\n as?: keyof React.JSX.IntrinsicElements;\n component?: keyof React.JSX.IntrinsicElements;\n innerRef?: React.MutableRefObject<HTMLDivElement | null> | React.RefCallback<HTMLDivElement>;\n truncateWithReadMore?: {\n lines: number;\n expanded: boolean;\n };\n }\n\n export interface DefaultProps {\n truncateWithEllipsis: boolean;\n }\n\n export interface Props\n extends Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps | 'color'>,\n XstyledProps,\n FontSizeProps,\n LineHeightProps,\n ColorProps,\n RequiredProps {}\n\n export interface InternalProps\n extends DefaultProps,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps | 'color'>,\n XstyledProps,\n FontSizeProps,\n LineHeightProps,\n ColorProps,\n RequiredProps {}\n}\n\nexport const DSTypographyPropTypes: DSPropTypesSchema<DSTypographyT.Props> = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n variant: PropTypes.oneOf([\n 'h1',\n 'h2',\n 'h3',\n 'h4',\n 'h5',\n 'h3-strong',\n 'h4-strong',\n 'h5-strong',\n 'b1',\n 'b2',\n 'b3',\n 'b4',\n 'b1-light',\n 'b2-light',\n 'b3-light',\n 'button',\n 'button-sml-title',\n 'button-med-title',\n 'button-lrg-title',\n 'link',\n 'link-sml-title',\n 'link-med-title',\n 'link-lrg-title',\n 'quote-brand',\n 'quote-neutral',\n 'highlight-neutral',\n 'highlight-brand',\n 'highlight-important',\n 'highlight-critical',\n 'feedback-neutral',\n 'feedback-brand',\n 'feedback-important',\n 'feedback-critical',\n 'h1-article',\n 'h2-article',\n 'h3-article',\n 'h4-article',\n 'h5-article',\n 'b1-article',\n 'b2-article',\n 'b3-article',\n ]).description(\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 button => <button />,\n link => <a />,\n 'quote-brand' => <pre />,\n 'quote-neutral' => <pre />,\n 'highlight-neutral' => <span />,\n 'highlight-brand' => <span />,\n 'highlight-important' => <span />,\n 'highlight-critical' => <span />,\n 'h1-article' => <h1 />,\n 'h2-article' => <h2 />,\n 'h3-article' => <h3 />,\n 'h4-article' => <h4 />,\n 'h5-article' => <h5 />,\n 'b1-article' => <p />,\n 'b2-article' => <p />,\n 'b3-article' => <p />,\n `,\n ).isRequired,\n children: PropTypes.node.description('Children element').isRequired,\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).description('Inner ref to font component.'),\n fontSize: PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.object, PropTypes.bool])\n .description('Applies to the root container. For more info read xstyled docs')\n .xstyled(),\n lineHeight: PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.object, PropTypes.bool])\n .description('Applies to the root container. For more info read xstyled docs')\n .xstyled(),\n as: PropTypes.string.description('Use to override the printed HTML tag, ex: `span` or `strong`'),\n component: PropTypes.string.description(\n 'Same as `as` for internal use. Use to override the printed HTML tag, ex: `span` or `strong`',\n ),\n truncateWithEllipsis: PropTypes.bool\n .description('If true, the text will not wrap, but instead will truncate with a text overflow ellipsis.')\n .defaultValue(false),\n truncateWithReadMore: PropTypes.shape({\n lines: PropTypes.number.description('Number of lines to truncate to.'),\n expanded: PropTypes.bool.description('If true, the text will be expanded.'),\n }).description(\n 'Ammount of lines to truncate to. If expanded, the text will be expanded. Use in conjunction with useReadMoreTruncate hook',\n ),\n};\n\n// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\nexport const DSTypographyPropTypesSchema = DSTypographyPropTypes as unknown as WeakValidationMap<DSTypographyT.Props>;\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACEvB,SAAS,WAAW,2BAA2B,wBAAwB;AAqFhE,MAAM,wBAAgE;AAAA,EAC3E,GAAG;AAAA,EACH,GAAG;AAAA,EACH,SAAS,UAAU,MAAM;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC,EAAE;AAAA,IACD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA4BF,EAAE;AAAA,EACF,UAAU,UAAU,KAAK,YAAY,kBAAkB,EAAE;AAAA,EACzD,UAAU,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,IAAI,CAAC,EAAE,YAAY,8BAA8B;AAAA,EAC5G,UAAU,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,QAAQ,UAAU,QAAQ,UAAU,IAAI,CAAC,EACjG,YAAY,gEAAgE,EAC5E,QAAQ;AAAA,EACX,YAAY,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,QAAQ,UAAU,QAAQ,UAAU,IAAI,CAAC,EACnG,YAAY,gEAAgE,EAC5E,QAAQ;AAAA,EACX,IAAI,UAAU,OAAO,YAAY,8DAA8D;AAAA,EAC/F,WAAW,UAAU,OAAO;AAAA,IAC1B;AAAA,EACF;AAAA,EACA,sBAAsB,UAAU,KAC7B,YAAY,2FAA2F,EACvG,aAAa,KAAK;AAAA,EACrB,sBAAsB,UAAU,MAAM;AAAA,IACpC,OAAO,UAAU,OAAO,YAAY,iCAAiC;AAAA,IACrE,UAAU,UAAU,KAAK,YAAY,qCAAqC;AAAA,EAC5E,CAAC,EAAE;AAAA,IACD;AAAA,EACF;AACF;AAGO,MAAM,8BAA8B;",
6
6
  "names": []
7
7
  }
@@ -3,7 +3,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
3
3
  import { DSTypography } from "../index.js";
4
4
  const testRequiredProps = {
5
5
  variant: "h1",
6
- children: /* @__PURE__ */ jsx(Fragment, { children: "nope" })
6
+ children: /* @__PURE__ */ jsx(Fragment, {})
7
7
  };
8
8
  const testOptionalProps = {
9
9
  truncateWithReadMore: {
@@ -40,20 +40,20 @@ const testExplicitDefinition = {
40
40
  fontSize: "16px",
41
41
  lineHeight: "20px",
42
42
  color: "brand-200",
43
- children: /* @__PURE__ */ jsx(Fragment, { children: "noop" })
43
+ children: /* @__PURE__ */ jsx(Fragment, {})
44
44
  };
45
45
  const testInferedTypeCompatibility = {
46
46
  variant: "b1",
47
47
  fontSize: "16px",
48
48
  lineHeight: "20px",
49
- color: "neutral-500",
49
+ color: "info-500",
50
50
  textDecoration: "underline",
51
- children: /* @__PURE__ */ jsx(Fragment, { children: "noop" })
51
+ children: /* @__PURE__ */ jsx(Fragment, {})
52
52
  };
53
53
  const testDefinitionAsConst = {
54
54
  variant: "link",
55
55
  href: "something.com",
56
- color: "brand-300",
56
+ color: "neutral-300",
57
57
  children: "Some children value"
58
58
  };
59
59
  const ExampleUsageComponent = () => /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/typescript-testing/typescript-typography-valid.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-unused-vars, no-unused-vars */\nimport { DSTypography } from '../index.js';\nimport type { DSTypographyT } from '../index.js';\n\n// test we expose the namespace and the namespace follows our deliverable conventions\ntype ComponentPropsForApp = DSTypographyT.Props;\ntype ComponentPropsInternals = DSTypographyT.InternalProps;\ntype ComponentPropsDefaultProps = DSTypographyT.DefaultProps;\ntype ComponentPropsOptionalProps = DSTypographyT.OptionalProps;\ntype ComponentPropsRequiredProps = DSTypographyT.RequiredProps;\n\nconst testRequiredProps: ComponentPropsRequiredProps = {\n variant: 'h1',\n children: <>nope</>,\n};\nconst testOptionalProps: ComponentPropsOptionalProps = {\n truncateWithReadMore: {\n lines: 2,\n expanded: false,\n },\n};\n\n// difference Props and InternalProps is that InternalProps has all the default props filled in\n// Props allows for partial defaults\nconst testPartialDefaults: Partial<ComponentPropsDefaultProps> = {};\nconst testProps: ComponentPropsForApp = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testPartialDefaults,\n};\nconst testPropsAsSyntax = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testPartialDefaults,\n} as ComponentPropsForApp;\n// InternalProps requires all defaults to be filled in\nconst testCompleteDefaults: Required<ComponentPropsDefaultProps> = {\n truncateWithEllipsis: true,\n};\nconst testInternalProps: ComponentPropsInternals = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testCompleteDefaults,\n};\nconst testInternalPropsAsSyntax = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testCompleteDefaults,\n} as ComponentPropsInternals;\n\n// using the explicit type definition, if there is an error, it will be marked on the key that is wrong\nconst testExplicitDefinition: ComponentPropsForApp = {\n variant: 'h1',\n fontSize: '16px',\n lineHeight: '20px',\n color: 'brand-200',\n children: <>noop</>,\n};\n\n// using the \"as\" syntax, if there is an error, it will be marking the whole object as wrong because it is not compatible with the type\nconst testInferedTypeCompatibility = {\n variant: 'b1',\n fontSize: '16px',\n lineHeight: '20px',\n color: 'neutral-500',\n textDecoration: 'underline',\n children: <>noop</>,\n} as ComponentPropsForApp;\n\nconst testDefinitionAsConst = {\n variant: 'link',\n href: 'something.com',\n color: 'brand-300',\n children: 'Some children value',\n} as const;\n\nconst ExampleUsageComponent = () => (\n <>\n {/* works with explicitly casted props, all syntaxes */}\n <DSTypography {...testExplicitDefinition} />\n <DSTypography {...testInferedTypeCompatibility} />\n <DSTypography {...testDefinitionAsConst} />\n {/* works with inline values */}\n <DSTypography variant=\"button\">Button</DSTypography>\n </>\n);\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACaX,wBAgEV,YAhEU;AAZZ,SAAS,oBAAoB;AAU7B,MAAM,oBAAiD;AAAA,EACrD,SAAS;AAAA,EACT,UAAU,gCAAE,kBAAI;AAClB;AACA,MAAM,oBAAiD;AAAA,EACrD,sBAAsB;AAAA,IACpB,OAAO;AAAA,IACP,UAAU;AAAA,EACZ;AACF;AAIA,MAAM,sBAA2D,CAAC;AAClE,MAAM,YAAkC;AAAA,EACtC,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AACA,MAAM,oBAAoB;AAAA,EACxB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAEA,MAAM,uBAA6D;AAAA,EACjE,sBAAsB;AACxB;AACA,MAAM,oBAA6C;AAAA,EACjD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AACA,MAAM,4BAA4B;AAAA,EAChC,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAGA,MAAM,yBAA+C;AAAA,EACnD,SAAS;AAAA,EACT,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,UAAU,gCAAE,kBAAI;AAClB;AAGA,MAAM,+BAA+B;AAAA,EACnC,SAAS;AAAA,EACT,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,gBAAgB;AAAA,EAChB,UAAU,gCAAE,kBAAI;AAClB;AAEA,MAAM,wBAAwB;AAAA,EAC5B,SAAS;AAAA,EACT,MAAM;AAAA,EACN,OAAO;AAAA,EACP,UAAU;AACZ;AAEA,MAAM,wBAAwB,MAC5B,iCAEE;AAAA,sBAAC,gBAAc,GAAG,wBAAwB;AAAA,EAC1C,oBAAC,gBAAc,GAAG,8BAA8B;AAAA,EAChD,oBAAC,gBAAc,GAAG,uBAAuB;AAAA,EAEzC,oBAAC,gBAAa,SAAQ,UAAS,oBAAM;AAAA,GACvC;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-unused-vars, no-unused-vars */\nimport { DSTypography } from '../index.js';\nimport type { DSTypographyT } from '../index.js';\n\n// test we expose the namespace and the namespace follows our deliverable conventions\ntype ComponentPropsForApp = DSTypographyT.Props;\ntype ComponentPropsInternals = DSTypographyT.InternalProps;\ntype ComponentPropsDefaultProps = DSTypographyT.DefaultProps;\ntype ComponentPropsOptionalProps = DSTypographyT.OptionalProps;\ntype ComponentPropsRequiredProps = DSTypographyT.RequiredProps;\n\nconst testRequiredProps: ComponentPropsRequiredProps = {\n variant: 'h1',\n children: <></>,\n};\nconst testOptionalProps: ComponentPropsOptionalProps = {\n truncateWithReadMore: {\n lines: 2,\n expanded: false,\n },\n};\n\n// difference Props and InternalProps is that InternalProps has all the default props filled in\n// Props allows for partial defaults\nconst testPartialDefaults: Partial<ComponentPropsDefaultProps> = {};\nconst testProps: ComponentPropsForApp = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testPartialDefaults,\n};\nconst testPropsAsSyntax = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testPartialDefaults,\n} as ComponentPropsForApp;\n// InternalProps requires all defaults to be filled in\nconst testCompleteDefaults: Required<ComponentPropsDefaultProps> = {\n truncateWithEllipsis: true,\n};\nconst testInternalProps: ComponentPropsInternals = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testCompleteDefaults,\n};\nconst testInternalPropsAsSyntax = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testCompleteDefaults,\n} as ComponentPropsInternals;\n\n// using the explicit type definition, if there is an error, it will be marked on the key that is wrong\nconst testExplicitDefinition: ComponentPropsForApp = {\n variant: 'h1',\n fontSize: '16px',\n lineHeight: '20px',\n color: 'brand-200',\n children: <></>,\n};\n\n// using the \"as\" syntax, if there is an error, it will be marking the whole object as wrong because it is not compatible with the type\nconst testInferedTypeCompatibility = {\n variant: 'b1',\n fontSize: '16px',\n lineHeight: '20px',\n color: 'info-500',\n textDecoration: 'underline',\n children: <></>,\n} as ComponentPropsForApp;\n\nconst testDefinitionAsConst = {\n variant: 'link',\n href: 'something.com',\n color: 'neutral-300',\n children: 'Some children value',\n} as const;\n\nconst ExampleUsageComponent = () => (\n <>\n {/* works with explicitly casted props, all syntaxes */}\n <DSTypography {...testExplicitDefinition} />\n <DSTypography {...testInferedTypeCompatibility} />\n <DSTypography {...testDefinitionAsConst} />\n {/* works with inline values */}\n <DSTypography variant=\"button\">Button</DSTypography>\n </>\n);\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACaX,wBAgEV,YAhEU;AAZZ,SAAS,oBAAoB;AAU7B,MAAM,oBAAiD;AAAA,EACrD,SAAS;AAAA,EACT,UAAU,gCAAE;AACd;AACA,MAAM,oBAAiD;AAAA,EACrD,sBAAsB;AAAA,IACpB,OAAO;AAAA,IACP,UAAU;AAAA,EACZ;AACF;AAIA,MAAM,sBAA2D,CAAC;AAClE,MAAM,YAAkC;AAAA,EACtC,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AACA,MAAM,oBAAoB;AAAA,EACxB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAEA,MAAM,uBAA6D;AAAA,EACjE,sBAAsB;AACxB;AACA,MAAM,oBAA6C;AAAA,EACjD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AACA,MAAM,4BAA4B;AAAA,EAChC,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAGA,MAAM,yBAA+C;AAAA,EACnD,SAAS;AAAA,EACT,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,UAAU,gCAAE;AACd;AAGA,MAAM,+BAA+B;AAAA,EACnC,SAAS;AAAA,EACT,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,gBAAgB;AAAA,EAChB,UAAU,gCAAE;AACd;AAEA,MAAM,wBAAwB;AAAA,EAC5B,SAAS;AAAA,EACT,MAAM;AAAA,EACN,OAAO;AAAA,EACP,UAAU;AACZ;AAEA,MAAM,wBAAwB,MAC5B,iCAEE;AAAA,sBAAC,gBAAc,GAAG,wBAAwB;AAAA,EAC1C,oBAAC,gBAAc,GAAG,8BAA8B;AAAA,EAChD,oBAAC,gBAAc,GAAG,uBAAuB;AAAA,EAEzC,oBAAC,gBAAa,SAAQ,UAAS,oBAAM;AAAA,GACvC;",
6
6
  "names": []
7
7
  }
@@ -1,4 +1,5 @@
1
+ import React from 'react';
1
2
  import type { DSTypographyT } from '../react-desc-prop-types.js';
2
3
  export declare const useDefaultProps: ({ variant, component, as: userAs, }: DSTypographyT.Props) => {
3
- as: keyof JSX.IntrinsicElements;
4
+ as: keyof React.JSX.IntrinsicElements;
4
5
  };
@@ -27,8 +27,8 @@ export declare namespace DSTypographyT {
27
27
  children: React.ReactNode | React.ReactNode[];
28
28
  }
29
29
  interface OptionalProps {
30
- as?: keyof JSX.IntrinsicElements;
31
- component?: keyof JSX.IntrinsicElements;
30
+ as?: keyof React.JSX.IntrinsicElements;
31
+ component?: keyof React.JSX.IntrinsicElements;
32
32
  innerRef?: React.MutableRefObject<HTMLDivElement | null> | React.RefCallback<HTMLDivElement>;
33
33
  truncateWithReadMore?: {
34
34
  lines: number;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-typography",
3
- "version": "3.50.0-next.3",
3
+ "version": "3.50.0-rc.1",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Typography",
6
6
  "files": [
@@ -25,8 +25,8 @@
25
25
  "url": "https://git.elliemae.io/platform-ui/dimsum.git"
26
26
  },
27
27
  "engines": {
28
- "pnpm": ">=6",
29
- "node": ">=16"
28
+ "pnpm": ">=9",
29
+ "node": ">=22"
30
30
  },
31
31
  "author": "ICE MT",
32
32
  "jestSonar": {
@@ -37,22 +37,23 @@
37
37
  },
38
38
  "dependencies": {
39
39
  "@xstyled/system": "~3.7.3",
40
- "@xstyled/util": "~3.7.0",
41
- "@elliemae/ds-props-helpers": "3.50.0-next.3",
42
- "@elliemae/ds-system": "3.50.0-next.3",
43
- "@elliemae/ds-typescript-helpers": "3.50.0-next.3"
40
+ "@xstyled/util": "3.7.0",
41
+ "@elliemae/ds-props-helpers": "3.50.0-rc.1",
42
+ "@elliemae/ds-typescript-helpers": "3.50.0-rc.1",
43
+ "@elliemae/ds-system": "3.50.0-rc.1"
44
44
  },
45
45
  "devDependencies": {
46
- "@elliemae/pui-cli": "9.0.0-next.31",
46
+ "@elliemae/pui-cli": "9.0.0-next.50",
47
47
  "jest": "~29.7.0",
48
+ "jest-cli": "~29.7.0",
48
49
  "react": "^17.0.2",
49
50
  "react-dom": "^17.0.2",
50
- "react-test-renderer": "^17.0.2",
51
- "@elliemae/ds-monorepo-devops": "3.50.0-next.3"
51
+ "react-test-renderer": "~17.0.2",
52
+ "@elliemae/ds-monorepo-devops": "3.50.0-rc.1"
52
53
  },
53
54
  "peerDependencies": {
54
- "@testing-library/jest-dom": "^5.17.0",
55
- "@testing-library/react": "^12.1.5",
55
+ "@testing-library/jest-dom": "~5.16.4",
56
+ "@testing-library/react": "~12.1.3",
56
57
  "@testing-library/user-event": "~13.5.0",
57
58
  "react": "^17.0.2",
58
59
  "react-dom": "^17.0.2",