@alfalab/core-components-typography 6.0.2 → 6.0.3

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.
Files changed (103) hide show
  1. package/colors.css +20 -20
  2. package/colors.d.ts +1 -1
  3. package/colors.module.css.js +1 -1
  4. package/colors.module.css.js.map +1 -1
  5. package/cssm/colors.d.ts +1 -1
  6. package/cssm/text/component.d.ts +4 -4
  7. package/cssm/text/component.js.map +1 -1
  8. package/cssm/title/component.d.ts +18 -18
  9. package/cssm/title/component.js.map +1 -1
  10. package/cssm/title/index.d.ts +13 -13
  11. package/cssm/title/utils.js.map +1 -1
  12. package/cssm/title-mobile/component.d.ts +13 -13
  13. package/cssm/title-responsive/component.d.ts +16 -16
  14. package/cssm/types.d.ts +1 -1
  15. package/esm/colors.css +20 -20
  16. package/esm/colors.d.ts +1 -1
  17. package/esm/colors.module.css.js +1 -1
  18. package/esm/colors.module.css.js.map +1 -1
  19. package/esm/text/component.d.ts +4 -4
  20. package/esm/text/component.js.map +1 -1
  21. package/esm/text/index.css +40 -40
  22. package/esm/text/index.module.css.js +1 -1
  23. package/esm/text/index.module.css.js.map +1 -1
  24. package/esm/title/common.css +5 -5
  25. package/esm/title/common.module.css.js +1 -1
  26. package/esm/title/common.module.css.js.map +1 -1
  27. package/esm/title/component.d.ts +18 -18
  28. package/esm/title/component.js.map +1 -1
  29. package/esm/title/index.css +25 -25
  30. package/esm/title/index.d.ts +13 -13
  31. package/esm/title/index.module.css.js +1 -1
  32. package/esm/title/index.module.css.js.map +1 -1
  33. package/esm/title/utils.js.map +1 -1
  34. package/esm/title-mobile/component.d.ts +13 -13
  35. package/esm/title-mobile/index.css +25 -25
  36. package/esm/title-mobile/index.module.css.js +1 -1
  37. package/esm/title-mobile/index.module.css.js.map +1 -1
  38. package/esm/title-responsive/component.d.ts +16 -16
  39. package/esm/types.d.ts +1 -1
  40. package/modern/colors.css +20 -20
  41. package/modern/colors.d.ts +1 -1
  42. package/modern/colors.module.css.js +1 -1
  43. package/modern/colors.module.css.js.map +1 -1
  44. package/modern/text/component.d.ts +4 -4
  45. package/modern/text/component.js.map +1 -1
  46. package/modern/text/index.css +40 -40
  47. package/modern/text/index.module.css.js +1 -1
  48. package/modern/text/index.module.css.js.map +1 -1
  49. package/modern/title/common.css +5 -5
  50. package/modern/title/common.module.css.js +1 -1
  51. package/modern/title/common.module.css.js.map +1 -1
  52. package/modern/title/component.d.ts +18 -18
  53. package/modern/title/component.js.map +1 -1
  54. package/modern/title/index.css +25 -25
  55. package/modern/title/index.d.ts +13 -13
  56. package/modern/title/index.module.css.js +1 -1
  57. package/modern/title/index.module.css.js.map +1 -1
  58. package/modern/title/utils.js.map +1 -1
  59. package/modern/title-mobile/component.d.ts +13 -13
  60. package/modern/title-mobile/index.css +25 -25
  61. package/modern/title-mobile/index.module.css.js +1 -1
  62. package/modern/title-mobile/index.module.css.js.map +1 -1
  63. package/modern/title-responsive/component.d.ts +16 -16
  64. package/modern/types.d.ts +1 -1
  65. package/moderncssm/colors.d.ts +1 -1
  66. package/moderncssm/text/component.d.ts +4 -4
  67. package/moderncssm/text/component.js.map +1 -1
  68. package/moderncssm/title/component.d.ts +18 -18
  69. package/moderncssm/title/component.js.map +1 -1
  70. package/moderncssm/title/index.d.ts +13 -13
  71. package/moderncssm/title/index.module.css +3 -3
  72. package/moderncssm/title/utils.js.map +1 -1
  73. package/moderncssm/title-mobile/component.d.ts +13 -13
  74. package/moderncssm/title-mobile/index.module.css +3 -3
  75. package/moderncssm/title-responsive/component.d.ts +16 -16
  76. package/moderncssm/types.d.ts +1 -1
  77. package/package.json +6 -6
  78. package/src/colors.module.css +1 -1
  79. package/src/text/index.module.css +1 -1
  80. package/src/title/common.module.css +1 -1
  81. package/src/title/index.module.css +1 -1
  82. package/src/title-mobile/index.module.css +1 -1
  83. package/text/component.d.ts +4 -4
  84. package/text/component.js.map +1 -1
  85. package/text/index.css +40 -40
  86. package/text/index.module.css.js +1 -1
  87. package/text/index.module.css.js.map +1 -1
  88. package/title/common.css +5 -5
  89. package/title/common.module.css.js +1 -1
  90. package/title/common.module.css.js.map +1 -1
  91. package/title/component.d.ts +18 -18
  92. package/title/component.js.map +1 -1
  93. package/title/index.css +25 -25
  94. package/title/index.d.ts +13 -13
  95. package/title/index.module.css.js +1 -1
  96. package/title/index.module.css.js.map +1 -1
  97. package/title/utils.js.map +1 -1
  98. package/title-mobile/component.d.ts +13 -13
  99. package/title-mobile/index.css +25 -25
  100. package/title-mobile/index.module.css.js +1 -1
  101. package/title-mobile/index.module.css.js.map +1 -1
  102. package/title-responsive/component.d.ts +16 -16
  103. package/types.d.ts +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"component.js","sources":["../../src/text/component.tsx"],"sourcesContent":["import React, { forwardRef, type HTMLAttributes } from 'react';\nimport mergeRefs from 'react-merge-refs';\nimport cn from 'classnames';\n\nimport { type TextSkeletonProps, useSkeleton } from '@alfalab/core-components-skeleton';\n\nimport { type Color } from '../colors';\nimport { type TextElementType } from '../types';\n\nimport colors from '../colors.module.css';\nimport styles from './index.module.css';\n\ntype NativeProps = HTMLAttributes<HTMLSpanElement>;\n\ntype TextBaseProps = {\n /**\n * [Вариант начертания](https://core-ds.github.io/core-components/master/?path=/docs/tokens-assets-типографика--docs)\n */\n view?:\n | 'primary-large'\n | 'primary-medium'\n | 'primary-small'\n | 'secondary-large'\n | 'secondary-medium'\n | 'secondary-small'\n | 'component-primary'\n | 'component-secondary'\n | 'caps'\n | 'tagline';\n\n /**\n * Цвет текста\n */\n color?: Color;\n\n /**\n * Толщина шрифта\n */\n weight?: 'regular' | 'medium' | 'bold';\n\n /**\n * Делает цифры моноширинными\n */\n monospaceNumbers?: boolean;\n\n /**\n * HTML тег\n */\n tag?: 'span' | 'div';\n\n /**\n * Css-класс для стилизации (native prop)\n */\n className?: string;\n\n /**\n * Id компонента для тестов\n */\n dataTestId?: string;\n\n /**\n * Контент (native prop)\n */\n children?: React.ReactNode;\n\n /**\n * Добавляет отступы к тэгу 'p'\n */\n defaultMargins?: never;\n\n /**\n * Количество строк\n */\n rowLimit?: 1 | 2 | 3;\n\n /**\n * Показать скелетон\n */\n showSkeleton?: boolean;\n\n /**\n * Пропы для скелетона\n */\n skeletonProps?: TextSkeletonProps;\n\n /**\n * Шрифт текста\n *\n * @deprecated\n */\n font?: 'alfasans' | undefined | null;\n};\n\ntype TextPTagProps = Omit<TextBaseProps, 'tag' | 'defaultMargins'> & {\n tag?: 'p';\n defaultMargins?: boolean;\n};\n\nexport type TextProps = Omit<NativeProps, 'color'> & (TextBaseProps | TextPTagProps);\n\nexport const Text = forwardRef<TextElementType, TextProps>(\n (\n {\n view = 'primary-medium',\n tag: Component = 'span',\n weight,\n monospaceNumbers = false,\n defaultMargins = true,\n color,\n className,\n dataTestId,\n children,\n rowLimit,\n showSkeleton,\n skeletonProps,\n font,\n ...restProps\n },\n ref,\n ) => {\n const { renderSkeleton, textRef } = useSkeleton(showSkeleton, skeletonProps);\n\n const skeleton = renderSkeleton({\n wrapperClassName: cn({\n [styles.paragraphWithMargins]: Component === 'p' && defaultMargins,\n }),\n dataTestId,\n });\n\n if (skeleton) {\n return skeleton;\n }\n\n return (\n <Component\n className={cn(\n {\n [styles.paragraph]: Component === 'p' && !defaultMargins,\n [styles.paragraphWithMargins]: Component === 'p' && defaultMargins,\n [styles.monospace]: monospaceNumbers,\n [styles[`rowLimit${rowLimit}`]]: rowLimit,\n [styles.transparent]: showSkeleton,\n },\n className,\n color && colors[color],\n styles[view],\n weight && styles[weight],\n )}\n data-test-id={dataTestId}\n ref={mergeRefs([ref, textRef])}\n {...restProps}\n >\n {children}\n </Component>\n );\n },\n);\n"],"names":[],"mappings":";;;;;;;;IAoGa,IAAI,GAAG,UAAU,CAC1B,UACI,EAeC,EACD,GAAG,EAAA;;IAfC,IAAA,EAAA,GAAA,EAAA,CAAA,IAAuB,CAAvB,CAAA,IAAI,GAAG,EAAA,KAAA,MAAA,GAAA,gBAAgB,GAAA,EAAA,CAAA,CACvB,EAAuB,GAAA,EAAA,CAAA,GAAA,CAAA,CAAlB,SAAS,GAAA,EAAA,KAAA,MAAA,GAAG,MAAM,GAAA,EAAA,CACvB,CAAA,MAAM,GAAA,EAAA,CAAA,MAAA,CAAA,CACN,EAAwB,GAAA,EAAA,CAAA,gBAAA,CAAA,CAAxB,gBAAgB,GAAA,EAAA,KAAA,MAAA,GAAG,KAAK,GAAA,EAAA,CACxB,CAAA,EAAA,GAAA,EAAA,CAAA,cAAqB,CAArB,CAAA,cAAc,GAAG,EAAA,KAAA,MAAA,GAAA,IAAI,KAAA,CACrB,CAAA,KAAK,GAAA,EAAA,CAAA,KAAA,CAAA,CACL,SAAS,GAAA,EAAA,CAAA,SAAA,CACT,CAAA,UAAU,GAAA,EAAA,CAAA,UAAA,CAAA,CACV,QAAQ,GAAA,EAAA,CAAA,QAAA,CACR,CAAA,QAAQ,GAAA,EAAA,CAAA,QAAA,CAAA,CACR,YAAY,GAAA,EAAA,CAAA,YAAA,CACZ,CAAA,aAAa,GAAA,EAAA,CAAA,aAAA,CAAA,CACT,EAAA,CAAA,IAAA,CACD,KAAA,SAAS,GAdhB,MAAA,CAAA,EAAA,EAAA,CAAA,MAAA,EAAA,KAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,gBAAA,EAAA,OAAA,EAAA,WAAA,EAAA,YAAA,EAAA,UAAA,EAAA,UAAA,EAAA,cAAA,EAAA,eAAA,EAAA,MAAA,CAeC;AAGK,IAAA,IAAA,EAA8B,GAAA,WAAW,CAAC,YAAY,EAAE,aAAa,CAAC,EAApE,cAAc,GAAA,EAAA,CAAA,cAAA,EAAE,OAAO,aAA6C;IAE5E,IAAM,QAAQ,GAAG,cAAc,CAAC;AAC5B,QAAA,gBAAgB,EAAE,EAAE,EAAA,EAAA,GAAA,EAAA;YAChB,EAAC,CAAA,MAAM,CAAC,oBAAoB,CAAA,GAAG,SAAS,KAAK,GAAG,IAAI,cAAc;AACpE,YAAA,EAAA,EAAA;AACF,QAAA,UAAU,EAAA,UAAA;AACb,KAAA,CAAC;AAEF,IAAA,IAAI,QAAQ,EAAE;AACV,QAAA,OAAO,QAAQ;AAClB;AAED,IAAA,QACI,KAAC,CAAA,aAAA,CAAA,SAAS,EACN,QAAA,CAAA,EAAA,SAAS,EAAE,EAAE,EAAA,EAAA,GAAA,EAAA;YAEL,EAAC,CAAA,MAAM,CAAC,SAAS,CAAA,GAAG,SAAS,KAAK,GAAG,IAAI,CAAC,cAAc;YACxD,EAAC,CAAA,MAAM,CAAC,oBAAoB,CAAA,GAAG,SAAS,KAAK,GAAG,IAAI,cAAc;AAClE,YAAA,EAAA,CAAC,MAAM,CAAC,SAAS,CAAA,GAAG,gBAAgB;AACpC,YAAA,EAAA,CAAC,MAAM,CAAC,UAAA,CAAA,MAAA,CAAW,QAAQ,CAAE,CAAC,IAAG,QAAQ;AACzC,YAAA,EAAA,CAAC,MAAM,CAAC,WAAW,CAAA,GAAG,YAAY;AAEtC,YAAA,EAAA,GAAA,SAAS,EACT,KAAK,IAAI,MAAM,CAAC,KAAK,CAAC,EACtB,MAAM,CAAC,IAAI,CAAC,EACZ,MAAM,IAAI,MAAM,CAAC,MAAM,CAAC,CAC3B,EAAA,cAAA,EACa,UAAU,EACxB,GAAG,EAAE,SAAS,CAAC,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC,EAC1B,EAAA,SAAS,GAEZ,QAAQ,CACD;AAEpB,CAAC;;;;"}
1
+ {"version":3,"file":"component.js","sources":["../../src/text/component.tsx"],"sourcesContent":["import React, { forwardRef, type HTMLAttributes } from 'react';\nimport mergeRefs from 'react-merge-refs';\nimport cn from 'classnames';\n\nimport { type TextSkeletonProps, useSkeleton } from '@alfalab/core-components-skeleton';\n\nimport { type Color } from '../colors';\nimport { type TextElementType } from '../types';\n\nimport colors from '../colors.module.css';\nimport styles from './index.module.css';\n\ntype NativeProps = HTMLAttributes<HTMLSpanElement>;\n\ntype TextBaseProps = {\n /**\n * [Вариант начертания](https://core-ds.github.io/core-components/master/?path=/docs/tokens-assets-типографика--docs)\n */\n view?:\n | 'primary-large'\n | 'primary-medium'\n | 'primary-small'\n | 'secondary-large'\n | 'secondary-medium'\n | 'secondary-small'\n | 'component-primary'\n | 'component-secondary'\n | 'caps'\n | 'tagline';\n\n /**\n * Цвет текста\n */\n color?: Color;\n\n /**\n * Толщина шрифта\n */\n weight?: 'regular' | 'medium' | 'bold';\n\n /**\n * Делает цифры моноширинными\n */\n monospaceNumbers?: boolean;\n\n /**\n * HTML тег\n */\n tag?: 'span' | 'div';\n\n /**\n * Css-класс для стилизации (native prop)\n */\n className?: string;\n\n /**\n * Id компонента для тестов\n */\n dataTestId?: string;\n\n /**\n * Контент (native prop)\n */\n children?: React.ReactNode;\n\n /**\n * Добавляет отступы к тэгу 'p'\n */\n defaultMargins?: never;\n\n /**\n * Количество строк\n */\n rowLimit?: 1 | 2 | 3;\n\n /**\n * Показать скелетон\n */\n showSkeleton?: boolean;\n\n /**\n * Пропы для скелетона\n */\n skeletonProps?: TextSkeletonProps;\n\n /**\n * Шрифт текста\n *\n * @deprecated\n */\n font?: 'alfasans' | undefined | null;\n};\n\ntype TextPTagProps = Omit<TextBaseProps, 'tag' | 'defaultMargins'> & {\n tag?: 'p';\n defaultMargins?: boolean;\n};\n\nexport type TextProps = Omit<NativeProps, 'color'> & (TextBaseProps | TextPTagProps);\n\nexport const Text = forwardRef<TextElementType, TextProps>(\n (\n {\n view = 'primary-medium',\n tag: Component = 'span',\n weight,\n monospaceNumbers = false,\n defaultMargins = true,\n color,\n className,\n dataTestId,\n children,\n rowLimit,\n showSkeleton,\n skeletonProps,\n font,\n ...restProps\n },\n ref,\n ) => {\n const { renderSkeleton, textRef } = useSkeleton(showSkeleton, skeletonProps);\n\n const skeleton = renderSkeleton({\n wrapperClassName: cn({\n [styles.paragraphWithMargins]: Component === 'p' && defaultMargins,\n }),\n dataTestId,\n });\n\n if (skeleton) {\n return skeleton;\n }\n\n return (\n <Component\n className={cn(\n {\n [styles.paragraph]: Component === 'p' && !defaultMargins,\n [styles.paragraphWithMargins]: Component === 'p' && defaultMargins,\n [styles.monospace]: monospaceNumbers,\n [styles[`rowLimit${rowLimit}`]]: rowLimit,\n [styles.transparent]: showSkeleton,\n },\n className,\n color && colors[color],\n styles[view],\n weight && styles[weight],\n )}\n data-test-id={dataTestId}\n ref={mergeRefs([ref, textRef])}\n {...restProps}\n >\n {children}\n </Component>\n );\n },\n);\n"],"names":[],"mappings":";;;;;;;;IAoGa,IAAI,GAAG,UAAU,CAC1B,UACI,EAeC,EACD,GAAG,EAAA;;IAfC,IAAA,EAAA,GAAA,EAAA,CAAA,IAAuB,CAAvB,CAAA,IAAI,GAAG,EAAA,KAAA,MAAA,GAAA,gBAAgB,GAAA,EAAA,CAAA,CACvB,EAAuB,GAAA,EAAA,CAAA,GAAA,CAAA,CAAlB,SAAS,GAAA,EAAA,KAAA,MAAA,GAAG,MAAM,GAAA,EAAA,CACvB,CAAA,MAAM,GAAA,EAAA,CAAA,MAAA,CAAA,CACN,EAAwB,GAAA,EAAA,CAAA,gBAAA,CAAA,CAAxB,gBAAgB,GAAA,EAAA,KAAA,MAAA,GAAG,KAAK,GAAA,EAAA,CACxB,CAAA,EAAA,GAAA,EAAA,CAAA,cAAqB,CAArB,CAAA,cAAc,GAAG,EAAA,KAAA,MAAA,GAAA,IAAI,KAAA,CACrB,CAAA,KAAK,GAAA,EAAA,CAAA,KAAA,CAAA,CACL,SAAS,GAAA,EAAA,CAAA,SAAA,CACT,CAAA,UAAU,GAAA,EAAA,CAAA,UAAA,CAAA,CACV,QAAQ,GAAA,EAAA,CAAA,QAAA,CACR,CAAA,QAAQ,GAAA,EAAA,CAAA,QAAA,CAAA,CACR,YAAY,GAAA,EAAA,CAAA,YAAA,CACZ,CAAA,aAAa,GAAA,EAAA,CAAA,aAAA,CAAA,CACT,EAAA,CAAA,IAAA,CACD,KAAA,SAAS,GAdhB,MAAA,CAAA,EAAA,EAAA,CAAA,MAAA,EAAA,KAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,gBAAA,EAAA,OAAA,EAAA,WAAA,EAAA,YAAA,EAAA,UAAA,EAAA,UAAA,EAAA,cAAA,EAAA,eAAA,EAAA,MAAA,CAeC;AAGK,IAAA,IAAA,EAA8B,GAAA,WAAW,CAAC,YAAY,EAAE,aAAa,CAAC,EAApE,cAAc,GAAA,EAAA,CAAA,cAAA,EAAE,OAAO,aAA6C;IAE5E,IAAM,QAAQ,GAAG,cAAc,CAAC;AAC5B,QAAA,gBAAgB,EAAE,EAAE,EAAA,EAAA,GAAA,EAAA;YAChB,EAAC,CAAA,MAAM,CAAC,oBAAoB,CAAA,GAAG,SAAS,KAAK,GAAG,IAAI,cAAc;AACpE,YAAA,EAAA,EAAA;AACF,QAAA,UAAU,EAAA,UAAA;AACb,KAAA,CAAC;IAEF,IAAI,QAAQ,EAAE;AACV,QAAA,OAAO,QAAQ;;AAGnB,IAAA,QACI,KAAC,CAAA,aAAA,CAAA,SAAS,EACN,QAAA,CAAA,EAAA,SAAS,EAAE,EAAE,EAAA,EAAA,GAAA,EAAA;YAEL,EAAC,CAAA,MAAM,CAAC,SAAS,CAAA,GAAG,SAAS,KAAK,GAAG,IAAI,CAAC,cAAc;YACxD,EAAC,CAAA,MAAM,CAAC,oBAAoB,CAAA,GAAG,SAAS,KAAK,GAAG,IAAI,cAAc;AAClE,YAAA,EAAA,CAAC,MAAM,CAAC,SAAS,CAAA,GAAG,gBAAgB;AACpC,YAAA,EAAA,CAAC,MAAM,CAAC,UAAA,CAAA,MAAA,CAAW,QAAQ,CAAE,CAAC,IAAG,QAAQ;AACzC,YAAA,EAAA,CAAC,MAAM,CAAC,WAAW,CAAA,GAAG,YAAY;AAEtC,YAAA,EAAA,GAAA,SAAS,EACT,KAAK,IAAI,MAAM,CAAC,KAAK,CAAC,EACtB,MAAM,CAAC,IAAI,CAAC,EACZ,MAAM,IAAI,MAAM,CAAC,MAAM,CAAC,CAC3B,EAAA,cAAA,EACa,UAAU,EACxB,GAAG,EAAE,SAAS,CAAC,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC,EAC1B,EAAA,SAAS,GAEZ,QAAQ,CACD;AAEpB,CAAC;;;;"}
@@ -7,33 +7,33 @@
7
7
  --font-family-system:
8
8
  system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica, sans-serif;
9
9
  }
10
- .typography__transparent_9ra3f {
10
+ .typography__transparent_zanhs {
11
11
  opacity: 0;
12
12
  }
13
13
  :root {
14
14
  --text-paragraph-margin-bottom: var(--gap-0) var(--gap-0) var(--gap-12);
15
15
  }
16
- .typography__paragraph_9ra3f {
16
+ .typography__paragraph_zanhs {
17
17
  margin: var(--gap-0);
18
18
  padding: var(--gap-0);
19
19
  }
20
- .typography__paragraphWithMargins_9ra3f {
20
+ .typography__paragraphWithMargins_zanhs {
21
21
  padding: var(--gap-0);
22
22
  margin: var(--text-paragraph-margin-bottom);
23
23
  }
24
- .typography__component_9ra3f {
24
+ .typography__component_zanhs {
25
25
  font-size: 16px;
26
26
  line-height: 20px;
27
27
  font-weight: 400;
28
28
  font-family: var(--font-family-system);
29
29
  }
30
- .typography__component_9ra3f.typography__bold_9ra3f {
30
+ .typography__component_zanhs.typography__bold_zanhs {
31
31
  font-weight: 700;
32
32
  }
33
- .typography__component_9ra3f.typography__medium_9ra3f {
33
+ .typography__component_zanhs.typography__medium_zanhs {
34
34
  font-weight: 500;
35
35
  }
36
- .typography__caps_9ra3f {
36
+ .typography__caps_zanhs {
37
37
  font-size: 12px;
38
38
  line-height: 16px;
39
39
  font-weight: 400;
@@ -41,13 +41,13 @@
41
41
  text-transform: uppercase;
42
42
  font-family: var(--font-family-system);
43
43
  }
44
- .typography__caps_9ra3f.typography__bold_9ra3f {
44
+ .typography__caps_zanhs.typography__bold_zanhs {
45
45
  font-weight: 700;
46
46
  }
47
- .typography__caps_9ra3f.typography__medium_9ra3f {
47
+ .typography__caps_zanhs.typography__medium_zanhs {
48
48
  font-weight: 500;
49
49
  }
50
- .typography__tagline_9ra3f {
50
+ .typography__tagline_zanhs {
51
51
  font-size: 12px;
52
52
  line-height: 16px;
53
53
  font-weight: 400;
@@ -55,128 +55,128 @@
55
55
  text-transform: uppercase;
56
56
  font-family: var(--font-family-system);
57
57
  }
58
- .typography__tagline_9ra3f.typography__bold_9ra3f {
58
+ .typography__tagline_zanhs.typography__bold_zanhs {
59
59
  font-weight: 700;
60
60
  }
61
- .typography__tagline_9ra3f.typography__medium_9ra3f {
61
+ .typography__tagline_zanhs.typography__medium_zanhs {
62
62
  font-weight: 500;
63
63
  }
64
- .typography__primary-large_9ra3f {
64
+ .typography__primary-large_zanhs {
65
65
  font-size: 18px;
66
66
  line-height: 24px;
67
67
  font-weight: 400;
68
68
  font-family: var(--font-family-system);
69
69
  }
70
- .typography__primary-large_9ra3f.typography__bold_9ra3f {
70
+ .typography__primary-large_zanhs.typography__bold_zanhs {
71
71
  font-weight: 700;
72
72
  }
73
- .typography__primary-large_9ra3f.typography__medium_9ra3f {
73
+ .typography__primary-large_zanhs.typography__medium_zanhs {
74
74
  font-weight: 500;
75
75
  }
76
- .typography__primary-medium_9ra3f {
76
+ .typography__primary-medium_zanhs {
77
77
  font-size: 16px;
78
78
  line-height: 24px;
79
79
  font-weight: 400;
80
80
  font-family: var(--font-family-system);
81
81
  }
82
- .typography__primary-medium_9ra3f.typography__bold_9ra3f {
82
+ .typography__primary-medium_zanhs.typography__bold_zanhs {
83
83
  font-weight: 700;
84
84
  }
85
- .typography__primary-medium_9ra3f.typography__medium_9ra3f {
85
+ .typography__primary-medium_zanhs.typography__medium_zanhs {
86
86
  font-weight: 500;
87
87
  }
88
- .typography__primary-small_9ra3f {
88
+ .typography__primary-small_zanhs {
89
89
  font-size: 14px;
90
90
  line-height: 20px;
91
91
  font-weight: 400;
92
92
  font-family: var(--font-family-system);
93
93
  }
94
- .typography__primary-small_9ra3f.typography__bold_9ra3f {
94
+ .typography__primary-small_zanhs.typography__bold_zanhs {
95
95
  font-weight: 700;
96
96
  }
97
- .typography__primary-small_9ra3f.typography__medium_9ra3f {
97
+ .typography__primary-small_zanhs.typography__medium_zanhs {
98
98
  font-weight: 500;
99
99
  }
100
- .typography__component-primary_9ra3f {
100
+ .typography__component-primary_zanhs {
101
101
  font-size: 16px;
102
102
  line-height: 20px;
103
103
  font-weight: 400;
104
104
  font-family: var(--font-family-system);
105
105
  }
106
- .typography__component-primary_9ra3f.typography__bold_9ra3f {
106
+ .typography__component-primary_zanhs.typography__bold_zanhs {
107
107
  font-weight: 700;
108
108
  }
109
- .typography__component-primary_9ra3f.typography__medium_9ra3f {
109
+ .typography__component-primary_zanhs.typography__medium_zanhs {
110
110
  font-weight: 500;
111
111
  }
112
- .typography__secondary-large_9ra3f {
112
+ .typography__secondary-large_zanhs {
113
113
  font-size: 13px;
114
114
  line-height: 16px;
115
115
  font-weight: 400;
116
116
  font-family: var(--font-family-system);
117
117
  }
118
- .typography__secondary-large_9ra3f.typography__bold_9ra3f {
118
+ .typography__secondary-large_zanhs.typography__bold_zanhs {
119
119
  font-weight: 700;
120
120
  }
121
- .typography__secondary-large_9ra3f.typography__medium_9ra3f {
121
+ .typography__secondary-large_zanhs.typography__medium_zanhs {
122
122
  font-weight: 500;
123
123
  }
124
- .typography__secondary-medium_9ra3f {
124
+ .typography__secondary-medium_zanhs {
125
125
  font-size: 12px;
126
126
  line-height: 16px;
127
127
  font-weight: 400;
128
128
  font-family: var(--font-family-system);
129
129
  }
130
- .typography__secondary-medium_9ra3f.typography__bold_9ra3f {
130
+ .typography__secondary-medium_zanhs.typography__bold_zanhs {
131
131
  font-weight: 700;
132
132
  }
133
- .typography__secondary-medium_9ra3f.typography__medium_9ra3f {
133
+ .typography__secondary-medium_zanhs.typography__medium_zanhs {
134
134
  font-weight: 500;
135
135
  }
136
- .typography__secondary-small_9ra3f {
136
+ .typography__secondary-small_zanhs {
137
137
  font-size: 11px;
138
138
  line-height: 16px;
139
139
  font-weight: 400;
140
140
  font-family: var(--font-family-system);
141
141
  }
142
- .typography__secondary-small_9ra3f.typography__bold_9ra3f {
142
+ .typography__secondary-small_zanhs.typography__bold_zanhs {
143
143
  font-weight: 700;
144
144
  }
145
- .typography__secondary-small_9ra3f.typography__medium_9ra3f {
145
+ .typography__secondary-small_zanhs.typography__medium_zanhs {
146
146
  font-weight: 500;
147
147
  }
148
- .typography__component-secondary_9ra3f {
148
+ .typography__component-secondary_zanhs {
149
149
  font-size: 14px;
150
150
  line-height: 18px;
151
151
  font-weight: 400;
152
152
  font-family: var(--font-family-system);
153
153
  }
154
- .typography__component-secondary_9ra3f.typography__bold_9ra3f {
154
+ .typography__component-secondary_zanhs.typography__bold_zanhs {
155
155
  font-weight: 700;
156
156
  }
157
- .typography__component-secondary_9ra3f.typography__medium_9ra3f {
157
+ .typography__component-secondary_zanhs.typography__medium_zanhs {
158
158
  font-weight: 500;
159
159
  }
160
- .typography__rowLimit1_9ra3f {
160
+ .typography__rowLimit1_zanhs {
161
161
  -webkit-line-clamp: 1;
162
162
  display: -webkit-box;
163
163
  -webkit-box-orient: vertical;
164
164
  overflow: hidden;
165
165
  word-break: break-all;
166
166
  }
167
- .typography__rowLimit2_9ra3f {
167
+ .typography__rowLimit2_zanhs {
168
168
  -webkit-line-clamp: 2;
169
169
  display: -webkit-box;
170
170
  -webkit-box-orient: vertical;
171
171
  overflow: hidden;
172
172
  }
173
- .typography__rowLimit3_9ra3f {
173
+ .typography__rowLimit3_zanhs {
174
174
  -webkit-line-clamp: 3;
175
175
  display: -webkit-box;
176
176
  -webkit-box-orient: vertical;
177
177
  overflow: hidden;
178
178
  }
179
- .typography__monospace_9ra3f {
179
+ .typography__monospace_zanhs {
180
180
  font-feature-settings: "tnum";
181
181
  font-variant-numeric: tabular-nums;
182
182
  }
@@ -1,6 +1,6 @@
1
1
  import './index.css';
2
2
 
3
- var styles = {"transparent":"typography__transparent_9ra3f","paragraph":"typography__paragraph_9ra3f","paragraphWithMargins":"typography__paragraphWithMargins_9ra3f","component":"typography__component_9ra3f","bold":"typography__bold_9ra3f","medium":"typography__medium_9ra3f","caps":"typography__caps_9ra3f","tagline":"typography__tagline_9ra3f","primary-large":"typography__primary-large_9ra3f","primary-medium":"typography__primary-medium_9ra3f","primary-small":"typography__primary-small_9ra3f","component-primary":"typography__component-primary_9ra3f","secondary-large":"typography__secondary-large_9ra3f","secondary-medium":"typography__secondary-medium_9ra3f","secondary-small":"typography__secondary-small_9ra3f","component-secondary":"typography__component-secondary_9ra3f","rowLimit1":"typography__rowLimit1_9ra3f","rowLimit2":"typography__rowLimit2_9ra3f","rowLimit3":"typography__rowLimit3_9ra3f","monospace":"typography__monospace_9ra3f"};
3
+ var styles = {"transparent":"typography__transparent_zanhs","paragraph":"typography__paragraph_zanhs","paragraphWithMargins":"typography__paragraphWithMargins_zanhs","component":"typography__component_zanhs","bold":"typography__bold_zanhs","medium":"typography__medium_zanhs","caps":"typography__caps_zanhs","tagline":"typography__tagline_zanhs","primary-large":"typography__primary-large_zanhs","primary-medium":"typography__primary-medium_zanhs","primary-small":"typography__primary-small_zanhs","component-primary":"typography__component-primary_zanhs","secondary-large":"typography__secondary-large_zanhs","secondary-medium":"typography__secondary-medium_zanhs","secondary-small":"typography__secondary-small_zanhs","component-secondary":"typography__component-secondary_zanhs","rowLimit1":"typography__rowLimit1_zanhs","rowLimit2":"typography__rowLimit2_zanhs","rowLimit3":"typography__rowLimit3_zanhs","monospace":"typography__monospace_zanhs"};
4
4
 
5
5
  export { styles as default };
6
6
  //# sourceMappingURL=index.module.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.module.css.js","sources":["../src/text/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n@import '../common.module.css';\n\n:root {\n --text-paragraph-margin-bottom: var(--gap-0) var(--gap-0) var(--gap-12);\n}\n\n.paragraph {\n margin: var(--gap-0);\n padding: var(--gap-0);\n}\n\n.paragraphWithMargins {\n padding: var(--gap-0);\n margin: var(--text-paragraph-margin-bottom);\n}\n\n@each $view in component, caps, tagline {\n .$(view) {\n @mixin paragraph_$(view);\n }\n\n .$(view).bold {\n @subtract-mixin accent_$(view), paragraph_$(view);\n }\n\n .$(view).medium {\n @subtract-mixin action_$(view), paragraph_$(view);\n }\n}\n\n@each $kind in primary, secondary {\n @each $size in large, medium, small {\n .$(kind)-$(size) {\n /* prettier-ignore */\n @mixin paragraph_$(kind)_$(size);\n }\n\n .$(kind)-$(size).bold {\n @subtract-mixin accent_$(kind)_$(size), paragraph_$(kind)_$(size);\n }\n\n .$(kind)-$(size).medium {\n @subtract-mixin action_$(kind)_$(size), paragraph_$(kind)_$(size);\n }\n }\n\n .component-$(kind) {\n @mixin paragraph_component_$(kind);\n\n &.bold {\n @subtract-mixin accent_component_$(kind), paragraph_component_$(kind);\n }\n\n &.medium {\n @subtract-mixin action_component_$(kind), paragraph_component_$(kind);\n }\n }\n}\n\n.rowLimit1 {\n @mixin row_limit 1;\n word-break: break-all;\n}\n\n.rowLimit2 {\n @mixin row_limit 2;\n}\n\n.rowLimit3 {\n @mixin row_limit 3;\n}\n\n.monospace {\n font-variant-numeric: tabular-nums;\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,aAAa,CAAC,+BAA+B,CAAC,WAAW,CAAC,6BAA6B,CAAC,sBAAsB,CAAC,wCAAwC,CAAC,WAAW,CAAC,6BAA6B,CAAC,MAAM,CAAC,wBAAwB,CAAC,QAAQ,CAAC,0BAA0B,CAAC,MAAM,CAAC,wBAAwB,CAAC,SAAS,CAAC,2BAA2B,CAAC,eAAe,CAAC,iCAAiC,CAAC,gBAAgB,CAAC,kCAAkC,CAAC,eAAe,CAAC,iCAAiC,CAAC,mBAAmB,CAAC,qCAAqC,CAAC,iBAAiB,CAAC,mCAAmC,CAAC,kBAAkB,CAAC,oCAAoC,CAAC,iBAAiB,CAAC,mCAAmC,CAAC,qBAAqB,CAAC,uCAAuC,CAAC,WAAW,CAAC,6BAA6B,CAAC,WAAW,CAAC,6BAA6B,CAAC,WAAW,CAAC,6BAA6B,CAAC,WAAW,CAAC,6BAA6B,CAAC;;;;"}
1
+ {"version":3,"file":"index.module.css.js","sources":["../src/text/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '../common.module.css';\n\n:root {\n --text-paragraph-margin-bottom: var(--gap-0) var(--gap-0) var(--gap-12);\n}\n\n.paragraph {\n margin: var(--gap-0);\n padding: var(--gap-0);\n}\n\n.paragraphWithMargins {\n padding: var(--gap-0);\n margin: var(--text-paragraph-margin-bottom);\n}\n\n@each $view in component, caps, tagline {\n .$(view) {\n @mixin paragraph_$(view);\n }\n\n .$(view).bold {\n @subtract-mixin accent_$(view), paragraph_$(view);\n }\n\n .$(view).medium {\n @subtract-mixin action_$(view), paragraph_$(view);\n }\n}\n\n@each $kind in primary, secondary {\n @each $size in large, medium, small {\n .$(kind)-$(size) {\n /* prettier-ignore */\n @mixin paragraph_$(kind)_$(size);\n }\n\n .$(kind)-$(size).bold {\n @subtract-mixin accent_$(kind)_$(size), paragraph_$(kind)_$(size);\n }\n\n .$(kind)-$(size).medium {\n @subtract-mixin action_$(kind)_$(size), paragraph_$(kind)_$(size);\n }\n }\n\n .component-$(kind) {\n @mixin paragraph_component_$(kind);\n\n &.bold {\n @subtract-mixin accent_component_$(kind), paragraph_component_$(kind);\n }\n\n &.medium {\n @subtract-mixin action_component_$(kind), paragraph_component_$(kind);\n }\n }\n}\n\n.rowLimit1 {\n @mixin row_limit 1;\n word-break: break-all;\n}\n\n.rowLimit2 {\n @mixin row_limit 2;\n}\n\n.rowLimit3 {\n @mixin row_limit 3;\n}\n\n.monospace {\n font-variant-numeric: tabular-nums;\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,aAAa,CAAC,+BAA+B,CAAC,WAAW,CAAC,6BAA6B,CAAC,sBAAsB,CAAC,wCAAwC,CAAC,WAAW,CAAC,6BAA6B,CAAC,MAAM,CAAC,wBAAwB,CAAC,QAAQ,CAAC,0BAA0B,CAAC,MAAM,CAAC,wBAAwB,CAAC,SAAS,CAAC,2BAA2B,CAAC,eAAe,CAAC,iCAAiC,CAAC,gBAAgB,CAAC,kCAAkC,CAAC,eAAe,CAAC,iCAAiC,CAAC,mBAAmB,CAAC,qCAAqC,CAAC,iBAAiB,CAAC,mCAAmC,CAAC,kBAAkB,CAAC,oCAAoC,CAAC,iBAAiB,CAAC,mCAAmC,CAAC,qBAAqB,CAAC,uCAAuC,CAAC,WAAW,CAAC,6BAA6B,CAAC,WAAW,CAAC,6BAA6B,CAAC,WAAW,CAAC,6BAA6B,CAAC,WAAW,CAAC,6BAA6B,CAAC;;;;"}
@@ -1,27 +1,27 @@
1
1
  :root {
2
2
  --gap-0: 0px;
3
3
  }
4
- .typography__transparent_8hyq2 {
4
+ .typography__transparent_y1c4f {
5
5
  opacity: 0;
6
6
  }
7
- .typography__component_8hyq2 {
7
+ .typography__component_y1c4f {
8
8
  margin: var(--gap-0);
9
9
  padding: var(--gap-0);
10
10
  }
11
- .typography__rowLimit1_8hyq2 {
11
+ .typography__rowLimit1_y1c4f {
12
12
  -webkit-line-clamp: 1;
13
13
  display: -webkit-box;
14
14
  -webkit-box-orient: vertical;
15
15
  overflow: hidden;
16
16
  word-break: break-all;
17
17
  }
18
- .typography__rowLimit2_8hyq2 {
18
+ .typography__rowLimit2_y1c4f {
19
19
  -webkit-line-clamp: 2;
20
20
  display: -webkit-box;
21
21
  -webkit-box-orient: vertical;
22
22
  overflow: hidden;
23
23
  }
24
- .typography__rowLimit3_8hyq2 {
24
+ .typography__rowLimit3_y1c4f {
25
25
  -webkit-line-clamp: 3;
26
26
  display: -webkit-box;
27
27
  -webkit-box-orient: vertical;
@@ -1,6 +1,6 @@
1
1
  import './common.css';
2
2
 
3
- var commonStyles = {"transparent":"typography__transparent_8hyq2","component":"typography__component_8hyq2","rowLimit1":"typography__rowLimit1_8hyq2","rowLimit2":"typography__rowLimit2_8hyq2","rowLimit3":"typography__rowLimit3_8hyq2"};
3
+ var commonStyles = {"transparent":"typography__transparent_y1c4f","component":"typography__component_y1c4f","rowLimit1":"typography__rowLimit1_y1c4f","rowLimit2":"typography__rowLimit2_y1c4f","rowLimit3":"typography__rowLimit3_y1c4f"};
4
4
 
5
5
  export { commonStyles as default };
6
6
  //# sourceMappingURL=common.module.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"common.module.css.js","sources":["../src/title/common.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n@import '../common.module.css';\n\n.component {\n margin: var(--gap-0);\n padding: var(--gap-0);\n}\n\n.rowLimit1 {\n @mixin row_limit 1;\n word-break: break-all;\n}\n\n.rowLimit2 {\n @mixin row_limit 2;\n}\n\n.rowLimit3 {\n @mixin row_limit 3;\n}\n"],"names":[],"mappings":";;AAEgB,mBAAe,CAAC,aAAa,CAAC,+BAA+B,CAAC,WAAW,CAAC,6BAA6B,CAAC,WAAW,CAAC,6BAA6B,CAAC,WAAW,CAAC,6BAA6B,CAAC,WAAW,CAAC,6BAA6B,CAAC;;;;"}
1
+ {"version":3,"file":"common.module.css.js","sources":["../src/title/common.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '../common.module.css';\n\n.component {\n margin: var(--gap-0);\n padding: var(--gap-0);\n}\n\n.rowLimit1 {\n @mixin row_limit 1;\n word-break: break-all;\n}\n\n.rowLimit2 {\n @mixin row_limit 2;\n}\n\n.rowLimit3 {\n @mixin row_limit 3;\n}\n"],"names":[],"mappings":";;AAEgB,mBAAe,CAAC,aAAa,CAAC,+BAA+B,CAAC,WAAW,CAAC,6BAA6B,CAAC,WAAW,CAAC,6BAA6B,CAAC,WAAW,CAAC,6BAA6B,CAAC,WAAW,CAAC,6BAA6B,CAAC;;;;"}
@@ -1,8 +1,8 @@
1
1
  import React, { type HTMLAttributes } from 'react';
2
2
  import { type TextSkeletonProps } from '@alfalab/core-components-skeleton/esm';
3
3
  import { type Color } from '../colors';
4
- declare type NativeProps = HTMLAttributes<HTMLHeadingElement>;
5
- export declare type TitleProps = Omit<NativeProps, 'color'> & {
4
+ type NativeProps = HTMLAttributes<HTMLHeadingElement>;
5
+ export type TitleProps = Omit<NativeProps, 'color'> & {
6
6
  /**
7
7
  * HTML тег
8
8
  */
@@ -61,51 +61,51 @@ export declare type TitleProps = Omit<NativeProps, 'color'> & {
61
61
  */
62
62
  defaultMatchMediaValue?: boolean | (() => boolean);
63
63
  };
64
- declare type PrivateProps = {
64
+ type PrivateProps = {
65
65
  styles: {
66
66
  [key: string]: string;
67
67
  };
68
68
  platform: 'mobile' | 'desktop';
69
69
  };
70
- declare type TitleElementType = HTMLHeadingElement | HTMLDivElement;
70
+ type TitleElementType = HTMLHeadingElement | HTMLDivElement;
71
71
  export declare const TitleBase: React.ForwardRefExoticComponent<Omit<NativeProps, "color"> & {
72
72
  /**
73
73
  * HTML тег
74
74
  */
75
- tag: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'div';
75
+ tag: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "div";
76
76
  /**
77
77
  * [Вариант начертания](?path=/docs/guidelines-typography--page)
78
78
  */
79
- view?: "medium" | "small" | "xlarge" | "large" | "xsmall" | undefined;
79
+ view?: "xlarge" | "large" | "medium" | "small" | "xsmall";
80
80
  /**
81
81
  * Цвет текста
82
82
  */
83
- color?: "tertiary" | "disabled" | "accent" | "primary" | "attention" | "positive" | "secondary" | "tertiary-inverted" | "primary-inverted" | "secondary-inverted" | "link" | "negative" | "static-primary-light" | "static-secondary-light" | "static-tertiary-light" | "static-primary-dark" | "static-secondary-dark" | "static-tertiary-dark" | "static-accent" | "static-positive" | undefined;
83
+ color?: Color;
84
84
  /**
85
85
  * Толщина шрифта
86
86
  */
87
- weight?: "regular" | "medium" | "bold" | "semibold" | undefined;
87
+ weight?: "regular" | "medium" | "bold" | "semibold";
88
88
  /**
89
89
  * Шрифт текста
90
90
  *
91
91
  * @deprecated
92
92
  */
93
- font?: "alfasans" | "styrene" | "system" | {
94
- font: 'alfasans';
93
+ font?: "styrene" | "system" | "alfasans" | {
94
+ font: "alfasans";
95
95
  systemCompat: boolean;
96
- } | undefined;
96
+ };
97
97
  /**
98
98
  * Добавляет отступы
99
99
  */
100
- defaultMargins?: boolean | undefined;
100
+ defaultMargins?: boolean;
101
101
  /**
102
102
  * Css-класс для стилизации (native prop)
103
103
  */
104
- className?: string | undefined;
104
+ className?: string;
105
105
  /**
106
106
  * Id компонента для тестов
107
107
  */
108
- dataTestId?: string | undefined;
108
+ dataTestId?: string;
109
109
  /**
110
110
  * Контент (native prop)
111
111
  */
@@ -113,18 +113,18 @@ export declare const TitleBase: React.ForwardRefExoticComponent<Omit<NativeProps
113
113
  /**
114
114
  * Количество строк
115
115
  */
116
- rowLimit?: 1 | 2 | 3 | undefined;
116
+ rowLimit?: 1 | 2 | 3;
117
117
  /**
118
118
  * Показать скелетон
119
119
  */
120
- showSkeleton?: boolean | undefined;
120
+ showSkeleton?: boolean;
121
121
  /**
122
122
  * Пропы для скелетона
123
123
  */
124
- skeletonProps?: TextSkeletonProps | undefined;
124
+ skeletonProps?: TextSkeletonProps;
125
125
  /**
126
126
  * Значение по-умолчанию для хука useMatchMedia
127
127
  */
128
- defaultMatchMediaValue?: boolean | (() => boolean) | undefined;
128
+ defaultMatchMediaValue?: boolean | (() => boolean);
129
129
  } & PrivateProps & React.RefAttributes<TitleElementType>>;
130
130
  export {};
@@ -1 +1 @@
1
- {"version":3,"file":"component.js","sources":["../../src/title/component.tsx"],"sourcesContent":["import React, { forwardRef, type HTMLAttributes } from 'react';\nimport mergeRefs from 'react-merge-refs';\nimport cn from 'classnames';\n\nimport { isObject } from '@alfalab/core-components-shared';\nimport { type TextSkeletonProps, useSkeleton } from '@alfalab/core-components-skeleton';\n\nimport { type Color } from '../colors';\n\nimport { getDefaultWeight } from './utils';\n\nimport colors from '../colors.module.css';\nimport commonStyles from './common.module.css';\n\ntype NativeProps = HTMLAttributes<HTMLHeadingElement>;\n\nexport type TitleProps = Omit<NativeProps, 'color'> & {\n /**\n * HTML тег\n */\n tag: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'div';\n\n /**\n * [Вариант начертания](?path=/docs/guidelines-typography--page)\n */\n view?: 'xlarge' | 'large' | 'medium' | 'small' | 'xsmall';\n\n /**\n * Цвет текста\n */\n color?: Color;\n\n /**\n * Толщина шрифта\n */\n weight?: 'regular' | 'medium' | 'bold' | 'semibold';\n\n /**\n * Шрифт текста\n *\n * @deprecated\n */\n font?: 'styrene' | 'system' | 'alfasans' | { font: 'alfasans'; systemCompat: boolean };\n\n /**\n * Добавляет отступы\n */\n defaultMargins?: boolean;\n\n /**\n * Css-класс для стилизации (native prop)\n */\n className?: string;\n\n /**\n * Id компонента для тестов\n */\n dataTestId?: string;\n\n /**\n * Контент (native prop)\n */\n children?: React.ReactNode;\n\n /**\n * Количество строк\n */\n rowLimit?: 1 | 2 | 3;\n\n /**\n * Показать скелетон\n */\n showSkeleton?: boolean;\n\n /**\n * Пропы для скелетона\n */\n skeletonProps?: TextSkeletonProps;\n\n /**\n * Значение по-умолчанию для хука useMatchMedia\n */\n defaultMatchMediaValue?: boolean | (() => boolean);\n};\n\ntype PrivateProps = {\n styles: {\n [key: string]: string;\n };\n platform: 'mobile' | 'desktop';\n};\n\ntype TitleElementType = HTMLHeadingElement | HTMLDivElement;\n\nexport const TitleBase = forwardRef<TitleElementType, TitleProps & PrivateProps>(\n (\n {\n tag: Component = 'div',\n view = 'medium',\n font = 'styrene',\n platform,\n weight = getDefaultWeight(isObject(font) ? font.font : font, platform),\n defaultMargins = false,\n color,\n className,\n dataTestId,\n children,\n rowLimit,\n styles,\n skeletonProps,\n showSkeleton,\n ...restProps\n },\n ref,\n ) => {\n const { renderSkeleton, textRef } = useSkeleton(showSkeleton, skeletonProps);\n\n const skeleton = renderSkeleton({\n wrapperClassName: cn(defaultMargins && styles[`margins-${view}`]),\n dataTestId,\n });\n\n if (skeleton) {\n return skeleton;\n }\n\n return (\n <Component\n className={cn(\n commonStyles.component,\n styles.component,\n className,\n styles[`${weight === 'regular' ? 'regular-' : ''}${view}`],\n defaultMargins && styles[`margins-${view}`],\n color && colors[color],\n {\n [commonStyles[`rowLimit${rowLimit}`]]: rowLimit,\n [commonStyles.transparent]: showSkeleton,\n [styles.font]:\n (isObject(font) && !font.systemCompat) || !(font === 'system'),\n },\n )}\n data-test-id={dataTestId}\n ref={mergeRefs([ref, textRef])}\n {...restProps}\n >\n {children}\n </Component>\n );\n },\n);\n"],"names":[],"mappings":";;;;;;;;;;IA8Fa,SAAS,GAAG,UAAU,CAC/B,UACI,EAgBC,EACD,GAAG,EAAA;;AAhBC,IAAA,IAAA,WAAsB,EAAjB,SAAS,GAAG,EAAA,KAAA,MAAA,GAAA,KAAK,KAAA,EACtB,EAAA,GAAA,EAAA,CAAA,IAAe,EAAf,IAAI,mBAAG,QAAQ,GAAA,EAAA,EACf,EAAgB,GAAA,EAAA,CAAA,IAAA,EAAhB,IAAI,GAAG,EAAA,KAAA,MAAA,GAAA,SAAS,GAAA,EAAA,EAChB,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,cAAsE,EAAtE,MAAM,mBAAG,gBAAgB,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,EAAE,QAAQ,CAAC,GAAA,EAAA,EACtE,sBAAsB,EAAtB,cAAc,GAAG,EAAA,KAAA,MAAA,GAAA,KAAK,KAAA,EACtB,KAAK,WAAA,EACL,SAAS,eAAA,EACT,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,MAAM,GAAA,EAAA,CAAA,MAAA,EACN,aAAa,GAAA,EAAA,CAAA,aAAA,EACb,YAAY,GAAA,EAAA,CAAA,YAAA,EACT,SAAS,GAAA,MAAA,CAAA,EAAA,EAfhB,sKAgBC,CADe;AAIV,IAAA,IAAA,EAA8B,GAAA,WAAW,CAAC,YAAY,EAAE,aAAa,CAAC,EAApE,cAAc,GAAA,EAAA,CAAA,cAAA,EAAE,OAAO,aAA6C;IAE5E,IAAM,QAAQ,GAAG,cAAc,CAAC;QAC5B,gBAAgB,EAAE,EAAE,CAAC,cAAc,IAAI,MAAM,CAAC,UAAW,CAAA,MAAA,CAAA,IAAI,CAAE,CAAC,CAAC;AACjE,QAAA,UAAU,EAAA,UAAA;AACb,KAAA,CAAC;AAEF,IAAA,IAAI,QAAQ,EAAE;AACV,QAAA,OAAO,QAAQ;AAClB;IAED,QACI,oBAAC,SAAS,EAAA,QAAA,CAAA,EACN,SAAS,EAAE,EAAE,CACT,YAAY,CAAC,SAAS,EACtB,MAAM,CAAC,SAAS,EAChB,SAAS,EACT,MAAM,CAAC,EAAA,CAAA,MAAA,CAAG,MAAM,KAAK,SAAS,GAAG,UAAU,GAAG,EAAE,SAAG,IAAI,CAAE,CAAC,EAC1D,cAAc,IAAI,MAAM,CAAC,UAAA,CAAA,MAAA,CAAW,IAAI,CAAE,CAAC,EAC3C,KAAK,IAAI,MAAM,CAAC,KAAK,CAAC,GAAA,EAAA,GAAA,EAAA;AAElB,YAAA,EAAA,CAAC,YAAY,CAAC,UAAA,CAAA,MAAA,CAAW,QAAQ,CAAE,CAAC,IAAG,QAAQ;AAC/C,YAAA,EAAA,CAAC,YAAY,CAAC,WAAW,CAAA,GAAG,YAAY;YACxC,EAAC,CAAA,MAAM,CAAC,IAAI,CAAA,GACR,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,KAAK,EAAE,IAAI,KAAK,QAAQ,CAAC;AAEzE,YAAA,EAAA,EAAA,EAAA,cAAA,EACa,UAAU,EACxB,GAAG,EAAE,SAAS,CAAC,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC,EAC1B,EAAA,SAAS,GAEZ,QAAQ,CACD;AAEpB,CAAC;;;;"}
1
+ {"version":3,"file":"component.js","sources":["../../src/title/component.tsx"],"sourcesContent":["import React, { forwardRef, type HTMLAttributes } from 'react';\nimport mergeRefs from 'react-merge-refs';\nimport cn from 'classnames';\n\nimport { isObject } from '@alfalab/core-components-shared';\nimport { type TextSkeletonProps, useSkeleton } from '@alfalab/core-components-skeleton';\n\nimport { type Color } from '../colors';\n\nimport { getDefaultWeight } from './utils';\n\nimport colors from '../colors.module.css';\nimport commonStyles from './common.module.css';\n\ntype NativeProps = HTMLAttributes<HTMLHeadingElement>;\n\nexport type TitleProps = Omit<NativeProps, 'color'> & {\n /**\n * HTML тег\n */\n tag: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'div';\n\n /**\n * [Вариант начертания](?path=/docs/guidelines-typography--page)\n */\n view?: 'xlarge' | 'large' | 'medium' | 'small' | 'xsmall';\n\n /**\n * Цвет текста\n */\n color?: Color;\n\n /**\n * Толщина шрифта\n */\n weight?: 'regular' | 'medium' | 'bold' | 'semibold';\n\n /**\n * Шрифт текста\n *\n * @deprecated\n */\n font?: 'styrene' | 'system' | 'alfasans' | { font: 'alfasans'; systemCompat: boolean };\n\n /**\n * Добавляет отступы\n */\n defaultMargins?: boolean;\n\n /**\n * Css-класс для стилизации (native prop)\n */\n className?: string;\n\n /**\n * Id компонента для тестов\n */\n dataTestId?: string;\n\n /**\n * Контент (native prop)\n */\n children?: React.ReactNode;\n\n /**\n * Количество строк\n */\n rowLimit?: 1 | 2 | 3;\n\n /**\n * Показать скелетон\n */\n showSkeleton?: boolean;\n\n /**\n * Пропы для скелетона\n */\n skeletonProps?: TextSkeletonProps;\n\n /**\n * Значение по-умолчанию для хука useMatchMedia\n */\n defaultMatchMediaValue?: boolean | (() => boolean);\n};\n\ntype PrivateProps = {\n styles: {\n [key: string]: string;\n };\n platform: 'mobile' | 'desktop';\n};\n\ntype TitleElementType = HTMLHeadingElement | HTMLDivElement;\n\nexport const TitleBase = forwardRef<TitleElementType, TitleProps & PrivateProps>(\n (\n {\n tag: Component = 'div',\n view = 'medium',\n font = 'styrene',\n platform,\n weight = getDefaultWeight(isObject(font) ? font.font : font, platform),\n defaultMargins = false,\n color,\n className,\n dataTestId,\n children,\n rowLimit,\n styles,\n skeletonProps,\n showSkeleton,\n ...restProps\n },\n ref,\n ) => {\n const { renderSkeleton, textRef } = useSkeleton(showSkeleton, skeletonProps);\n\n const skeleton = renderSkeleton({\n wrapperClassName: cn(defaultMargins && styles[`margins-${view}`]),\n dataTestId,\n });\n\n if (skeleton) {\n return skeleton;\n }\n\n return (\n <Component\n className={cn(\n commonStyles.component,\n styles.component,\n className,\n styles[`${weight === 'regular' ? 'regular-' : ''}${view}`],\n defaultMargins && styles[`margins-${view}`],\n color && colors[color],\n {\n [commonStyles[`rowLimit${rowLimit}`]]: rowLimit,\n [commonStyles.transparent]: showSkeleton,\n [styles.font]:\n (isObject(font) && !font.systemCompat) || !(font === 'system'),\n },\n )}\n data-test-id={dataTestId}\n ref={mergeRefs([ref, textRef])}\n {...restProps}\n >\n {children}\n </Component>\n );\n },\n);\n"],"names":[],"mappings":";;;;;;;;;;IA8Fa,SAAS,GAAG,UAAU,CAC/B,UACI,EAgBC,EACD,GAAG,EAAA;;AAhBC,IAAA,IAAA,WAAsB,EAAjB,SAAS,GAAG,EAAA,KAAA,MAAA,GAAA,KAAK,KAAA,EACtB,EAAA,GAAA,EAAA,CAAA,IAAe,EAAf,IAAI,mBAAG,QAAQ,GAAA,EAAA,EACf,EAAgB,GAAA,EAAA,CAAA,IAAA,EAAhB,IAAI,GAAG,EAAA,KAAA,MAAA,GAAA,SAAS,GAAA,EAAA,EAChB,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,cAAsE,EAAtE,MAAM,mBAAG,gBAAgB,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,EAAE,QAAQ,CAAC,GAAA,EAAA,EACtE,sBAAsB,EAAtB,cAAc,GAAG,EAAA,KAAA,MAAA,GAAA,KAAK,KAAA,EACtB,KAAK,WAAA,EACL,SAAS,eAAA,EACT,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,MAAM,GAAA,EAAA,CAAA,MAAA,EACN,aAAa,GAAA,EAAA,CAAA,aAAA,EACb,YAAY,GAAA,EAAA,CAAA,YAAA,EACT,SAAS,GAAA,MAAA,CAAA,EAAA,EAfhB,sKAgBC,CADe;AAIV,IAAA,IAAA,EAA8B,GAAA,WAAW,CAAC,YAAY,EAAE,aAAa,CAAC,EAApE,cAAc,GAAA,EAAA,CAAA,cAAA,EAAE,OAAO,aAA6C;IAE5E,IAAM,QAAQ,GAAG,cAAc,CAAC;QAC5B,gBAAgB,EAAE,EAAE,CAAC,cAAc,IAAI,MAAM,CAAC,UAAW,CAAA,MAAA,CAAA,IAAI,CAAE,CAAC,CAAC;AACjE,QAAA,UAAU,EAAA,UAAA;AACb,KAAA,CAAC;IAEF,IAAI,QAAQ,EAAE;AACV,QAAA,OAAO,QAAQ;;IAGnB,QACI,oBAAC,SAAS,EAAA,QAAA,CAAA,EACN,SAAS,EAAE,EAAE,CACT,YAAY,CAAC,SAAS,EACtB,MAAM,CAAC,SAAS,EAChB,SAAS,EACT,MAAM,CAAC,EAAA,CAAA,MAAA,CAAG,MAAM,KAAK,SAAS,GAAG,UAAU,GAAG,EAAE,SAAG,IAAI,CAAE,CAAC,EAC1D,cAAc,IAAI,MAAM,CAAC,UAAA,CAAA,MAAA,CAAW,IAAI,CAAE,CAAC,EAC3C,KAAK,IAAI,MAAM,CAAC,KAAK,CAAC,GAAA,EAAA,GAAA,EAAA;AAElB,YAAA,EAAA,CAAC,YAAY,CAAC,UAAA,CAAA,MAAA,CAAW,QAAQ,CAAE,CAAC,IAAG,QAAQ;AAC/C,YAAA,EAAA,CAAC,YAAY,CAAC,WAAW,CAAA,GAAG,YAAY;YACxC,EAAC,CAAA,MAAM,CAAC,IAAI,CAAA,GACR,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,KAAK,EAAE,IAAI,KAAK,QAAQ,CAAC;AAEzE,YAAA,EAAA,EAAA,EAAA,cAAA,EACa,UAAU,EACxB,GAAG,EAAE,SAAS,CAAC,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC,EAC1B,EAAA,SAAS,GAEZ,QAAQ,CACD;AAEpB,CAAC;;;;"}
@@ -16,137 +16,137 @@
16
16
  'Styrene UI', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica,
17
17
  sans-serif;
18
18
  }
19
- .typography__xlarge_1b3u8 {
19
+ .typography__xlarge_1u2wm {
20
20
  font-size: 48px;
21
21
  line-height: 52px;
22
22
  font-weight: 700;
23
23
  font-family: var(--font-family-system);
24
24
  }
25
- .typography__xlarge_1b3u8.typography__font_1b3u8 {
25
+ .typography__xlarge_1u2wm.typography__font_1u2wm {
26
26
  line-height: 64px;
27
27
  font-weight: 500;
28
28
  font-feature-settings: 'ss01';
29
29
  font-family: var(--font-family-styrene);
30
30
  }
31
- .typography__regular-xlarge_1b3u8 {
31
+ .typography__regular-xlarge_1u2wm {
32
32
  font-size: 48px;
33
33
  line-height: 52px;
34
34
  font-weight: 400;
35
35
  font-family: var(--font-family-system);
36
36
  }
37
- .typography__regular-xlarge_1b3u8.typography__font_1b3u8 {
37
+ .typography__regular-xlarge_1u2wm.typography__font_1u2wm {
38
38
  line-height: 64px;
39
39
  font-feature-settings: 'ss01';
40
40
  font-family: var(--font-family-styrene);
41
41
  }
42
- .typography__large_1b3u8 {
42
+ .typography__large_1u2wm {
43
43
  font-size: 40px;
44
44
  line-height: 48px;
45
45
  font-weight: 700;
46
46
  font-family: var(--font-family-system);
47
47
  }
48
- .typography__large_1b3u8.typography__font_1b3u8 {
48
+ .typography__large_1u2wm.typography__font_1u2wm {
49
49
  font-weight: 500;
50
50
  font-feature-settings: 'ss01';
51
51
  font-family: var(--font-family-styrene);
52
52
  }
53
- .typography__regular-large_1b3u8 {
53
+ .typography__regular-large_1u2wm {
54
54
  font-size: 40px;
55
55
  line-height: 48px;
56
56
  font-weight: 400;
57
57
  font-family: var(--font-family-system);
58
58
  }
59
- .typography__regular-large_1b3u8.typography__font_1b3u8 {
59
+ .typography__regular-large_1u2wm.typography__font_1u2wm {
60
60
  font-feature-settings: 'ss01';
61
61
  font-family: var(--font-family-styrene);
62
62
  }
63
- .typography__medium_1b3u8 {
63
+ .typography__medium_1u2wm {
64
64
  font-size: 30px;
65
65
  line-height: 36px;
66
66
  font-weight: 700;
67
67
  font-family: var(--font-family-system);
68
68
  }
69
- .typography__medium_1b3u8.typography__font_1b3u8 {
69
+ .typography__medium_1u2wm.typography__font_1u2wm {
70
70
  font-size: 32px;
71
71
  line-height: 40px;
72
72
  font-weight: 500;
73
73
  font-feature-settings: 'ss01';
74
74
  font-family: var(--font-family-styrene);
75
75
  }
76
- .typography__regular-medium_1b3u8 {
76
+ .typography__regular-medium_1u2wm {
77
77
  font-size: 30px;
78
78
  line-height: 36px;
79
79
  font-weight: 400;
80
80
  font-family: var(--font-family-system);
81
81
  }
82
- .typography__regular-medium_1b3u8.typography__font_1b3u8 {
82
+ .typography__regular-medium_1u2wm.typography__font_1u2wm {
83
83
  font-size: 32px;
84
84
  line-height: 40px;
85
85
  font-feature-settings: 'ss01';
86
86
  font-family: var(--font-family-styrene);
87
87
  }
88
- .typography__small_1b3u8 {
88
+ .typography__small_1u2wm {
89
89
  font-size: 22px;
90
90
  line-height: 26px;
91
91
  font-weight: 700;
92
92
  font-family: var(--font-family-system);
93
93
  }
94
- .typography__small_1b3u8.typography__font_1b3u8 {
94
+ .typography__small_1u2wm.typography__font_1u2wm {
95
95
  font-size: 24px;
96
96
  line-height: 32px;
97
97
  font-weight: 500;
98
98
  font-feature-settings: 'ss01';
99
99
  font-family: var(--font-family-styrene);
100
100
  }
101
- .typography__regular-small_1b3u8 {
101
+ .typography__regular-small_1u2wm {
102
102
  font-size: 22px;
103
103
  line-height: 26px;
104
104
  font-weight: 400;
105
105
  font-family: var(--font-family-system);
106
106
  }
107
- .typography__regular-small_1b3u8.typography__font_1b3u8 {
107
+ .typography__regular-small_1u2wm.typography__font_1u2wm {
108
108
  font-size: 24px;
109
109
  line-height: 32px;
110
110
  font-feature-settings: 'ss01';
111
111
  font-family: var(--font-family-styrene);
112
112
  }
113
- .typography__xsmall_1b3u8 {
113
+ .typography__xsmall_1u2wm {
114
114
  font-size: 18px;
115
115
  line-height: 22px;
116
116
  font-weight: 700;
117
117
  font-family: var(--font-family-system);
118
118
  }
119
- .typography__xsmall_1b3u8.typography__font_1b3u8 {
119
+ .typography__xsmall_1u2wm.typography__font_1u2wm {
120
120
  font-size: 20px;
121
121
  line-height: 24px;
122
122
  font-weight: 500;
123
123
  font-feature-settings: 'ss01';
124
124
  font-family: var(--font-family-styrene);
125
125
  }
126
- .typography__regular-xsmall_1b3u8 {
126
+ .typography__regular-xsmall_1u2wm {
127
127
  font-size: 18px;
128
128
  line-height: 22px;
129
129
  font-weight: 400;
130
130
  font-family: var(--font-family-system);
131
131
  }
132
- .typography__regular-xsmall_1b3u8.typography__font_1b3u8 {
132
+ .typography__regular-xsmall_1u2wm.typography__font_1u2wm {
133
133
  font-size: 20px;
134
134
  line-height: 24px;
135
135
  font-feature-settings: 'ss01';
136
136
  font-family: var(--font-family-styrene);
137
137
  }
138
- .typography__component_1b3u8.typography__margins-xlarge_1b3u8 {
138
+ .typography__component_1u2wm.typography__margins-xlarge_1u2wm {
139
139
  margin: var(--gap-0) var(--gap-0) var(--gap-24);
140
140
  }
141
- .typography__component_1b3u8.typography__margins-large_1b3u8 {
141
+ .typography__component_1u2wm.typography__margins-large_1u2wm {
142
142
  margin: var(--gap-48) var(--gap-0) var(--gap-24);
143
143
  }
144
- .typography__component_1b3u8.typography__margins-medium_1b3u8 {
144
+ .typography__component_1u2wm.typography__margins-medium_1u2wm {
145
145
  margin: var(--gap-48) var(--gap-0) var(--gap-24);
146
146
  }
147
- .typography__component_1b3u8.typography__margins-small_1b3u8 {
147
+ .typography__component_1u2wm.typography__margins-small_1u2wm {
148
148
  margin: var(--gap-40) var(--gap-0) var(--gap-16);
149
149
  }
150
- .typography__component_1b3u8.typography__margins-xsmall_1b3u8 {
150
+ .typography__component_1u2wm.typography__margins-xsmall_1u2wm {
151
151
  margin: var(--gap-40) var(--gap-0) var(--gap-16);
152
152
  }