feat(typography): organize folders/files

.changeset/witty-spiders-flash.md

@@ -0,0 +1,5 @@
+---
+'@alfalab/core-components-typography': patch
+---
+
+   - Внутренний рефакторинг: приведена в порядок структура папок

packages/typography/src/colors.ts

@@ -20,4 +20,4 @@ export const colors = [
     'static-accent',
 ] as const;
 
-export type Color = typeof colors[number];
+export type Color = (typeof colors)[number];

packages/typography/src/component.ts

@@ -0,0 +1,22 @@
+import type { FC, ForwardRefExoticComponent, RefAttributes } from 'react';
+
+import type { TitleProps } from './title/component';
+import { type TitleResponsiveProps, TitleResponsive } from './title/component.responsive';
+import { Title } from './title/desktop';
+import { type TitleMobileProps, TitleMobile } from './title/mobile';
+import { type TextProps, Text } from './text';
+import type { TextElementType } from './types';
+
+export const Typography: {
+    Title: FC<TitleProps>;
+    Text: ForwardRefExoticComponent<TextProps & RefAttributes<TextElementType>>;
+    TitleResponsive: FC<TitleResponsiveProps>;
+    TitleMobile: FC<TitleMobileProps>;
+} = {
+    Title,
+    Text,
+    TitleResponsive,
+    TitleMobile,
+};
+
+export { Text, Title as TitleDesktop, TitleResponsive, TitleMobile };

packages/typography/src/docs/Component.docs.mdx

@@ -8,10 +8,7 @@ import Changelog from '../../CHANGELOG.md?raw';
 
 <Meta of={Stories} />
 
-<ComponentHeader
-    name='Текстовые стили'
-    children='Подключение и использование шрифтов.'
-/>
+<ComponentHeader name='Текстовые стили' children='Подключение и использование шрифтов.' />
 
 <Tabs
     description={<Description />}

packages/typography/src/docs/development.mdx

@@ -71,7 +71,7 @@ CDN alfabank.servicecdn.ru — ненадёжный вариант, можно 
 чтобы получить возможные варианты реализации этого стиля в коде.
 
 <div
-    data-role="wrapper"
+    data-role='wrapper'
     style={{
         display: 'flex',
         justifyContent: 'center',

packages/typography/src/index.ts

@@ -1,5 +1,5 @@
 export * from './component';
 export * from './presets';
-export type { TitleProps } from './title';
+export type { TitleProps } from './title/component';
 export type { TextProps } from './text';
 export type { Color } from './colors';

packages/typography/src/text/component.tsx

@@ -1,10 +1,10 @@
-import React, { forwardRef, HTMLAttributes } from 'react';
+import React, { type HTMLAttributes, forwardRef } from 'react';
 import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';
 
-import { Color } from '../colors';
+import type { Color } from '../colors';
 import { useSkeleton } from '../hooks';
-import { TextElementType, TextSkeletonProps } from '../types';
+import type { TextElementType, TextSkeletonProps } from '../types';
 
 import colors from '../colors.module.css';
 import styles from './index.module.css';

packages/typography/src/title-responsive/component.tsx → packages/typography/src/title/component.responsive.tsx

@@ -2,8 +2,9 @@ import React, { forwardRef } from 'react';
 
 import { useIsDesktop } from '@alfalab/core-components-mq';
 
-import { Title, TitleProps } from '../title';
-import { TitleMobile } from '../title-mobile';
+import type { TitleProps } from './component';
+import { Title } from './desktop';
+import { TitleMobile } from './mobile';
 
 export type TitleResponsiveProps = TitleProps & {
     /**

packages/typography/src/title/component.tsx

@@ -1,10 +1,10 @@
-import React, { forwardRef, HTMLAttributes } from 'react';
+import React, { type HTMLAttributes, forwardRef } from 'react';
 import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';
 
-import { Color } from '../colors';
+import type { Color } from '../colors';
 import { useSkeleton } from '../hooks';
-import { TextSkeletonProps } from '../types';
+import type { TextSkeletonProps } from '../types';
 
 import { getDefaultWeight } from './utils';
 

packages/typography/src/title/component.screenshots.test.tsx → packages/typography/src/title/desktop/component.screenshots.test.tsx

@@ -2,7 +2,7 @@ import {
     setupScreenshotTesting,
     createSpriteStorybookUrl,
     createPreview,
-} from '../../../screenshot-utils';
+} from '../../../../screenshot-utils';
 
 const screenshotTesting = setupScreenshotTesting({
     it,

packages/typography/src/title/component.test.tsx → packages/typography/src/title/desktop/component.test.tsx

@@ -1,8 +1,9 @@
 import React from 'react';
 import { render } from '@testing-library/react';
 
-import { colors } from '../colors';
-import { Title, TitleProps } from './index';
+import { colors } from '../../colors';
+import { Title } from '.';
+import type { TitleProps } from '../component';
 
 describe('Title', () => {
     describe('Classes tests', () => {

packages/typography/src/title/index.tsx → packages/typography/src/title/desktop/component.tsx

@@ -1,18 +1,15 @@
 import React, { forwardRef } from 'react';
 
-import { TitleBase, TitleProps } from './component';
+import { type TitleProps, TitleBase } from '../component';
 
 import commonStyles from './common.module.css';
 import styles from './index.module.css';
 
-const Title = forwardRef<HTMLHeadingElement | HTMLDivElement, TitleProps>((props, ref) => (
+export const Title = forwardRef<HTMLHeadingElement | HTMLDivElement, TitleProps>((props, ref) => (
     <TitleBase
         {...props}
         styles={Object.assign(commonStyles, styles)}
         ref={ref}
         platform='desktop'
     />
 ));
-
-export { Title };
-export type { TitleProps };

packages/typography/src/title/index.module.css → packages/typography/src/title/desktop/index.module.css

@@ -1,6 +1,6 @@
-@import '../../../vars/src/index.css';
-@import '../margins.module.css';
-@import '../common.module.css';
+@import '../../../../vars/src/index.css';
+@import '../../margins.module.css';
+@import '../../common.module.css';
 
 .styrene-xlarge {
     @mixin headline_xlarge;

packages/typography/src/title-mobile/component.screenshots.test.tsx → packages/typography/src/title/mobile/component.screenshots.test.tsx

@@ -1,4 +1,4 @@
-import { setupScreenshotTesting, createSpriteStorybookUrl } from '../../../screenshot-utils';
+import { setupScreenshotTesting, createSpriteStorybookUrl } from '../../../../screenshot-utils';
 
 const screenshotTesting = setupScreenshotTesting({
     it,

packages/typography/src/title-mobile/component.tsx → packages/typography/src/title/mobile/component.tsx

@@ -1,8 +1,8 @@
 import React, { forwardRef } from 'react';
 
-import { TitleBase, TitleProps } from '../title/component';
+import { type TitleProps, TitleBase } from '../component';
 
-import commonStyles from '../title/common.module.css';
+import commonStyles from '../common.module.css';
 import styles from './index.module.css';
 
 export const TitleMobile = forwardRef<HTMLHeadingElement | HTMLDivElement, TitleProps>(

packages/typography/src/title-mobile/index.module.css → packages/typography/src/title/mobile/index.module.css

@@ -1,5 +1,5 @@
-@import '../../../vars/src/index.css';
-@import '../margins.module.css';
+@import '../../../../vars/src/index.css';
+@import '../../margins.module.css';
 
 .styrene-xlarge {
     @mixin headline-mobile_xlarge;

packages/typography/src/title/mobile/index.ts

@@ -0,0 +1,2 @@
+export { TitleMobile } from './component';
+export type { TitleProps as TitleMobileProps } from '../component';