diff --git a/README.md b/README.md index 8192368..b74edb5 100644 --- a/README.md +++ b/README.md @@ -39,7 +39,7 @@ UI kit использует следующие виды шрифтов. | Тип шрифта | Используемые начертания | Рекомендуемый шрифт | Рекомендуемый аналог | | ----------- | ---------------------------------------------- | ------------------- | -------------------- | | `primary` | – regular
– demibold
– demibold italic | TT Fellows | Noto Sans | -| `secondary` | – regular
– medium
– bold | Noto Sans | — | +| `secondary` | – regular
– bold | Noto Sans | — | Исходники шрифтов не поставляются вместе с пакетом, их требуется подключать отдельно. После подключения шрифтов в проект, необходимо указать их в @@ -87,7 +87,6 @@ UI kit использует следующие виды шрифтов. fontFamily: 'Noto Sans', fontDefinitions: [ { path: './assets/NotoSans-Bold.ttf', weight: 700 }, - { path: './assets/NotoSans-Medium.ttf', weight: 500 }, { path: './assets/NotoSans-Regular.ttf', weight: 400 }, ], }, @@ -108,7 +107,6 @@ UI kit использует следующие виды шрифтов. - ``` @@ -158,7 +156,6 @@ UI kit использует следующие виды шрифтов. TTFellows-DemiBoldItalic.ttf TTFellows-Regular.ttf NotoSans-Regular.ttf - NotoSans-Medium.ttf NotoSans-Bold.ttf ``` diff --git a/src/components/List/Base/__tests__/__snapshots__/ListBase.test.tsx.snap b/src/components/List/Base/__tests__/__snapshots__/ListBase.test.tsx.snap index 5a31652..323012b 100644 --- a/src/components/List/Base/__tests__/__snapshots__/ListBase.test.tsx.snap +++ b/src/components/List/Base/__tests__/__snapshots__/ListBase.test.tsx.snap @@ -311,7 +311,6 @@ exports[`ListBase tests ListBase centered and full divider 1`] = ` "fontFamily": "Noto Sans", "fontSize": 14, "includeFontPadding": false, - "letterSpacing": -0.5, "lineHeight": 20, "verticalAlign": "middle", }, @@ -867,7 +866,6 @@ exports[`ListBase tests ListBase full disabled 1`] = ` "fontFamily": "Noto Sans", "fontSize": 14, "includeFontPadding": false, - "letterSpacing": -0.5, "lineHeight": 20, "verticalAlign": "middle", }, @@ -1430,7 +1428,6 @@ exports[`ListBase tests ListBase maximal config 1`] = ` "fontFamily": "Noto Sans", "fontSize": 14, "includeFontPadding": false, - "letterSpacing": -0.5, "lineHeight": 20, "verticalAlign": "middle", }, @@ -1765,7 +1762,6 @@ exports[`ListBase tests ListBase minimal config 1`] = ` "fontFamily": "Noto Sans", "fontSize": 14, "includeFontPadding": false, - "letterSpacing": -0.5, "lineHeight": 20, "verticalAlign": "middle", }, diff --git a/src/components/MenuItem/Template/__tests__/__snapshots__/MenuItemTemplate.test.tsx.snap b/src/components/MenuItem/Template/__tests__/__snapshots__/MenuItemTemplate.test.tsx.snap index 9a2d895..bc4546e 100644 --- a/src/components/MenuItem/Template/__tests__/__snapshots__/MenuItemTemplate.test.tsx.snap +++ b/src/components/MenuItem/Template/__tests__/__snapshots__/MenuItemTemplate.test.tsx.snap @@ -244,7 +244,6 @@ exports[`MenuItemTemplate tests MenuItemTemplate full disabled 1`] = ` "fontFamily": "Noto Sans", "fontSize": 14, "includeFontPadding": false, - "letterSpacing": -0.5, "lineHeight": 20, "verticalAlign": "middle", }, @@ -612,7 +611,6 @@ exports[`MenuItemTemplate tests MenuItemTemplate minimal config 1`] = ` "fontFamily": "Noto Sans", "fontSize": 14, "includeFontPadding": false, - "letterSpacing": -0.5, "lineHeight": 20, "verticalAlign": "middle", }, @@ -815,7 +813,6 @@ exports[`MenuItemTemplate tests MenuItemTemplate prefix,suffix = right 1`] = ` "fontFamily": "Noto Sans", "fontSize": 14, "includeFontPadding": false, - "letterSpacing": -0.5, "lineHeight": 20, "verticalAlign": "middle", }, @@ -1154,7 +1151,6 @@ exports[`MenuItemTemplate tests MenuItemTemplate with colored icon 1`] = ` "fontFamily": "Noto Sans", "fontSize": 14, "includeFontPadding": false, - "letterSpacing": -0.5, "lineHeight": 20, "verticalAlign": "middle", }, @@ -1270,7 +1266,6 @@ exports[`MenuItemTemplate tests MenuItemTemplate with extra 1`] = ` "fontFamily": "Noto Sans", "fontSize": 14, "includeFontPadding": false, - "letterSpacing": -0.5, "lineHeight": 20, "verticalAlign": "middle", }, @@ -1595,7 +1590,6 @@ exports[`MenuItemTemplate tests MenuItemTemplate with icon 1`] = ` "fontFamily": "Noto Sans", "fontSize": 14, "includeFontPadding": false, - "letterSpacing": -0.5, "lineHeight": 20, "verticalAlign": "middle", }, @@ -1859,7 +1853,6 @@ exports[`MenuItemTemplate tests MenuItemTemplate with icon and badge 1`] = ` "fontFamily": "Noto Sans", "fontSize": 14, "includeFontPadding": false, - "letterSpacing": -0.5, "lineHeight": 20, "verticalAlign": "middle", }, @@ -1978,7 +1971,6 @@ exports[`MenuItemTemplate tests MenuItemTemplate with padding 1`] = ` "fontFamily": "Noto Sans", "fontSize": 14, "includeFontPadding": false, - "letterSpacing": -0.5, "lineHeight": 20, "verticalAlign": "middle", }, @@ -2100,7 +2092,6 @@ exports[`MenuItemTemplate tests MenuItemTemplate with separator 1`] = ` "fontFamily": "Noto Sans", "fontSize": 14, "includeFontPadding": false, - "letterSpacing": -0.5, "lineHeight": 20, "verticalAlign": "middle", }, diff --git a/src/components/Typography/Anchor.tsx b/src/components/Typography/Anchor.tsx index 535f30a..475176e 100644 --- a/src/components/Typography/Anchor.tsx +++ b/src/components/Typography/Anchor.tsx @@ -146,7 +146,11 @@ const styles = StyleSheet.create(({ spacing, typography, fonts }) => ({ letterSpacing: -0.25, }, underlined: { textDecorationLine: 'underline' }, - base: { lineHeight: 18, letterSpacing: 0 }, + base: { + fontSize: typography.Size['text-base'], + lineHeight: undefined, + letterSpacing: 0, + }, visited: { color: typography.Color.Service['text-help'] }, icon: { width: typography.Size['text-base'], diff --git a/src/components/Typography/Body.tsx b/src/components/Typography/Body.tsx index 9ad101d..f223873 100644 --- a/src/components/Typography/Body.tsx +++ b/src/components/Typography/Body.tsx @@ -7,7 +7,7 @@ export interface BodyProps extends TextProps { readonly color?: 'default' | 'secondary' | 'primary' readonly disabled?: boolean readonly paragraph?: boolean - readonly weight?: 'regular' | 'medium' | 'bold' + readonly weight?: 'regular' | 'bold' } export const Body = ({ @@ -43,11 +43,9 @@ const styles = StyleSheet.create(({ theme, typography, fonts }) => ({ verticalAlign: 'middle', fontFamily: fonts.secondary, lineHeight: 20, - letterSpacing: -0.5, }, regular: { fontWeight: 400 }, - medium: { fontWeight: 500 }, - bold: { fontWeight: 700 }, + bold: { fontWeight: 700, letterSpacing: -0.5 }, default: { color: theme.General.textColor }, primary: { color: theme.General.primaryColor }, secondary: { color: theme.General.textSecondaryColor }, diff --git a/src/components/Typography/Service.tsx b/src/components/Typography/Service.tsx index 75ba9fa..78ea369 100644 --- a/src/components/Typography/Service.tsx +++ b/src/components/Typography/Service.tsx @@ -108,7 +108,7 @@ const styles = StyleSheet.create(({ typography, spacing, fonts }) => ({ lineHeight: 15, letterSpacing: -0.25, }, - textBase: { lineHeight: 18 }, + textBase: { lineHeight: undefined, fontSize: typography.Size['text-base'] }, warning: { color: typography.Color.Service['text-warning'] }, success: { color: typography.Color.Service['text-success'] }, diff --git a/src/components/Typography/__tests__/Body.test.tsx b/src/components/Typography/__tests__/Body.test.tsx index a9430b0..7dc1cb3 100644 --- a/src/components/Typography/__tests__/Body.test.tsx +++ b/src/components/Typography/__tests__/Body.test.tsx @@ -8,7 +8,7 @@ describe('Body component tests', () => { color: ['default', 'secondary', 'primary'], disabled: [true, false], paragraph: [true, false], - weight: ['regular', 'medium', 'bold'], + weight: ['regular', 'bold'], }) test.each(snapshotCases)( diff --git a/src/components/Typography/__tests__/__snapshots__/Anchor.test.tsx.snap b/src/components/Typography/__tests__/__snapshots__/Anchor.test.tsx.snap index b2b21e6..53bf936 100644 --- a/src/components/Typography/__tests__/__snapshots__/Anchor.test.tsx.snap +++ b/src/components/Typography/__tests__/__snapshots__/Anchor.test.tsx.snap @@ -231,8 +231,9 @@ exports[`Body component tests левая иконка, base, visited, testID = C }, false, { + "fontSize": 14, "letterSpacing": 0, - "lineHeight": 18, + "lineHeight": undefined, }, { "color": "#9457ea", diff --git a/src/components/Typography/__tests__/__snapshots__/Body.test.tsx.snap b/src/components/Typography/__tests__/__snapshots__/Body.test.tsx.snap index 93d9b12..5e3a51a 100644 --- a/src/components/Typography/__tests__/__snapshots__/Body.test.tsx.snap +++ b/src/components/Typography/__tests__/__snapshots__/Body.test.tsx.snap @@ -8,42 +8,12 @@ exports[`Body component tests base = false, color = default, disabled = false, p "fontFamily": "Noto Sans", "fontSize": 14, "includeFontPadding": false, - "letterSpacing": -0.5, "lineHeight": 20, "verticalAlign": "middle", }, { "fontWeight": 700, - }, - { - "color": "#181a1f", - }, - false, - false, - false, - undefined, - ] - } - testID="Body" -> - Text - -`; - -exports[`Body component tests base = false, color = default, disabled = false, paragraph = false, weight = medium 1`] = ` - - Text - -`; - -exports[`Body component tests base = false, color = default, disabled = false, paragraph = true, weight = medium 1`] = ` - - Text - -`; - -exports[`Body component tests base = false, color = default, disabled = true, paragraph = false, weight = medium 1`] = ` - - Text - -`; - -exports[`Body component tests base = false, color = default, disabled = true, paragraph = true, weight = medium 1`] = ` - - Text - -`; - -exports[`Body component tests base = false, color = primary, disabled = false, paragraph = false, weight = medium 1`] = ` - - Text - -`; - -exports[`Body component tests base = false, color = primary, disabled = false, paragraph = true, weight = medium 1`] = ` - - Text - -`; - -exports[`Body component tests base = false, color = primary, disabled = true, paragraph = false, weight = medium 1`] = ` - `; -exports[`Body component tests base = false, color = primary, disabled = true, paragraph = true, weight = medium 1`] = ` +exports[`Body component tests base = false, color = primary, disabled = true, paragraph = true, weight = regular 1`] = ` `; -exports[`Body component tests base = false, color = primary, disabled = true, paragraph = true, weight = regular 1`] = ` +exports[`Body component tests base = false, color = secondary, disabled = false, paragraph = false, weight = bold 1`] = ` `; -exports[`Body component tests base = false, color = secondary, disabled = false, paragraph = false, weight = bold 1`] = ` +exports[`Body component tests base = false, color = secondary, disabled = false, paragraph = false, weight = regular 1`] = ` `; -exports[`Body component tests base = false, color = secondary, disabled = false, paragraph = false, weight = medium 1`] = ` +exports[`Body component tests base = false, color = secondary, disabled = false, paragraph = true, weight = bold 1`] = ` `; -exports[`Body component tests base = false, color = secondary, disabled = false, paragraph = false, weight = regular 1`] = ` +exports[`Body component tests base = false, color = secondary, disabled = false, paragraph = true, weight = regular 1`] = ` `; -exports[`Body component tests base = false, color = secondary, disabled = false, paragraph = true, weight = bold 1`] = ` - - Text - -`; - -exports[`Body component tests base = false, color = secondary, disabled = false, paragraph = true, weight = medium 1`] = ` - - Text - -`; - -exports[`Body component tests base = false, color = secondary, disabled = false, paragraph = true, weight = regular 1`] = ` - - Text - -`; - -exports[`Body component tests base = false, color = secondary, disabled = true, paragraph = false, weight = bold 1`] = ` - - Text - -`; - -exports[`Body component tests base = false, color = secondary, disabled = true, paragraph = false, weight = medium 1`] = ` - - Text - -`; - -exports[`Body component tests base = false, color = secondary, disabled = true, paragraph = false, weight = regular 1`] = ` - - Text - -`; - -exports[`Body component tests base = false, color = secondary, disabled = true, paragraph = true, weight = bold 1`] = ` - - Text - -`; - -exports[`Body component tests base = false, color = secondary, disabled = true, paragraph = true, weight = medium 1`] = ` - - Text - -`; - -exports[`Body component tests base = false, color = secondary, disabled = true, paragraph = true, weight = regular 1`] = ` - - Text - -`; - -exports[`Body component tests base = true, color = default, disabled = false, paragraph = false, weight = bold 1`] = ` - - Text - -`; - -exports[`Body component tests base = true, color = default, disabled = false, paragraph = false, weight = medium 1`] = ` - - Text - -`; - -exports[`Body component tests base = true, color = default, disabled = false, paragraph = false, weight = regular 1`] = ` - - Text - -`; - -exports[`Body component tests base = true, color = default, disabled = false, paragraph = true, weight = bold 1`] = ` - - Text - -`; - -exports[`Body component tests base = true, color = default, disabled = false, paragraph = true, weight = medium 1`] = ` - - Text - -`; - -exports[`Body component tests base = true, color = default, disabled = false, paragraph = true, weight = regular 1`] = ` - - Text - -`; - -exports[`Body component tests base = true, color = default, disabled = true, paragraph = false, weight = bold 1`] = ` - - Text - -`; - -exports[`Body component tests base = true, color = default, disabled = true, paragraph = false, weight = medium 1`] = ` - - Text - -`; - -exports[`Body component tests base = true, color = default, disabled = true, paragraph = false, weight = regular 1`] = ` +exports[`Body component tests base = false, color = secondary, disabled = true, paragraph = false, weight = bold 1`] = ` `; -exports[`Body component tests base = true, color = default, disabled = true, paragraph = true, weight = bold 1`] = ` +exports[`Body component tests base = false, color = secondary, disabled = true, paragraph = false, weight = regular 1`] = ` `; -exports[`Body component tests base = true, color = default, disabled = true, paragraph = true, weight = medium 1`] = ` +exports[`Body component tests base = false, color = secondary, disabled = true, paragraph = true, weight = bold 1`] = ` `; -exports[`Body component tests base = true, color = default, disabled = true, paragraph = true, weight = regular 1`] = ` +exports[`Body component tests base = false, color = secondary, disabled = true, paragraph = true, weight = regular 1`] = ` `; -exports[`Body component tests base = true, color = primary, disabled = false, paragraph = false, weight = bold 1`] = ` +exports[`Body component tests base = true, color = default, disabled = false, paragraph = false, weight = bold 1`] = ` `; -exports[`Body component tests base = true, color = primary, disabled = false, paragraph = false, weight = medium 1`] = ` +exports[`Body component tests base = true, color = default, disabled = false, paragraph = false, weight = regular 1`] = ` `; -exports[`Body component tests base = true, color = primary, disabled = false, paragraph = false, weight = regular 1`] = ` +exports[`Body component tests base = true, color = default, disabled = false, paragraph = true, weight = bold 1`] = ` `; -exports[`Body component tests base = true, color = primary, disabled = false, paragraph = true, weight = bold 1`] = ` +exports[`Body component tests base = true, color = default, disabled = false, paragraph = true, weight = regular 1`] = ` `; -exports[`Body component tests base = true, color = primary, disabled = false, paragraph = true, weight = medium 1`] = ` +exports[`Body component tests base = true, color = default, disabled = true, paragraph = false, weight = bold 1`] = ` `; -exports[`Body component tests base = true, color = primary, disabled = false, paragraph = true, weight = regular 1`] = ` +exports[`Body component tests base = true, color = default, disabled = true, paragraph = false, weight = regular 1`] = ` `; -exports[`Body component tests base = true, color = primary, disabled = true, paragraph = false, weight = bold 1`] = ` +exports[`Body component tests base = true, color = default, disabled = true, paragraph = true, weight = bold 1`] = ` `; -exports[`Body component tests base = true, color = primary, disabled = true, paragraph = false, weight = medium 1`] = ` +exports[`Body component tests base = true, color = default, disabled = true, paragraph = true, weight = regular 1`] = ` `; -exports[`Body component tests base = true, color = primary, disabled = true, paragraph = false, weight = regular 1`] = ` +exports[`Body component tests base = true, color = primary, disabled = false, paragraph = false, weight = bold 1`] = ` `; -exports[`Body component tests base = true, color = primary, disabled = true, paragraph = true, weight = bold 1`] = ` +exports[`Body component tests base = true, color = primary, disabled = false, paragraph = false, weight = regular 1`] = ` `; -exports[`Body component tests base = true, color = primary, disabled = true, paragraph = true, weight = medium 1`] = ` +exports[`Body component tests base = true, color = primary, disabled = false, paragraph = true, weight = bold 1`] = ` `; -exports[`Body component tests base = true, color = primary, disabled = true, paragraph = true, weight = regular 1`] = ` +exports[`Body component tests base = true, color = primary, disabled = false, paragraph = true, weight = regular 1`] = ` `; -exports[`Body component tests base = true, color = secondary, disabled = false, paragraph = false, weight = bold 1`] = ` +exports[`Body component tests base = true, color = primary, disabled = true, paragraph = false, weight = bold 1`] = ` `; -exports[`Body component tests base = true, color = secondary, disabled = false, paragraph = false, weight = medium 1`] = ` +exports[`Body component tests base = true, color = primary, disabled = true, paragraph = false, weight = regular 1`] = ` `; -exports[`Body component tests base = true, color = secondary, disabled = false, paragraph = false, weight = regular 1`] = ` +exports[`Body component tests base = true, color = primary, disabled = true, paragraph = true, weight = bold 1`] = ` `; -exports[`Body component tests base = true, color = secondary, disabled = false, paragraph = true, weight = bold 1`] = ` +exports[`Body component tests base = true, color = primary, disabled = true, paragraph = true, weight = regular 1`] = ` `; -exports[`Body component tests base = true, color = secondary, disabled = false, paragraph = true, weight = medium 1`] = ` +exports[`Body component tests base = true, color = secondary, disabled = false, paragraph = false, weight = bold 1`] = ` `; -exports[`Body component tests base = true, color = secondary, disabled = false, paragraph = true, weight = regular 1`] = ` +exports[`Body component tests base = true, color = secondary, disabled = false, paragraph = false, weight = regular 1`] = ` `; -exports[`Body component tests base = true, color = secondary, disabled = true, paragraph = false, weight = bold 1`] = ` +exports[`Body component tests base = true, color = secondary, disabled = false, paragraph = true, weight = bold 1`] = ` `; -exports[`Body component tests base = true, color = secondary, disabled = true, paragraph = false, weight = medium 1`] = ` +exports[`Body component tests base = true, color = secondary, disabled = false, paragraph = true, weight = regular 1`] = ` `; -exports[`Body component tests base = true, color = secondary, disabled = true, paragraph = false, weight = regular 1`] = ` +exports[`Body component tests base = true, color = secondary, disabled = true, paragraph = false, weight = bold 1`] = ` `; -exports[`Body component tests base = true, color = secondary, disabled = true, paragraph = true, weight = bold 1`] = ` +exports[`Body component tests base = true, color = secondary, disabled = true, paragraph = false, weight = regular 1`] = ` `; -exports[`Body component tests base = true, color = secondary, disabled = true, paragraph = true, weight = medium 1`] = ` +exports[`Body component tests base = true, color = secondary, disabled = true, paragraph = true, weight = bold 1`] = `