feat: добавлены атомарные экспорты в компаунд-компоненты;

.changeset/funny-oranges-decide.md

@@ -0,0 +1,13 @@
+---
+'@alfalab/core-components-file-upload-item': minor
+'@alfalab/core-components-list': minor
+'@alfalab/core-components-modal': minor
+'@alfalab/core-components-pure-cell': minor
+'@alfalab/core-components-side-panel': minor
+'@alfalab/core-components-tab-bar': minor
+'@alfalab/core-components-table': minor
+---
+
+   - Добавлены атомарные экспорты.
+   - Компаунд-экспорты помечены как deprecated.
+   - Добавлено sideEffects: false

packages/file-upload-item/package.json

@@ -10,6 +10,7 @@
         "access": "public",
         "directory": "dist"
     },
+    "sideEffects": false,
     "peerDependencies": {
         "react": "^16.9.0 || ^17.0.1 || ^18.0.0"
     },

packages/file-upload-item/src/Component.tsx

@@ -76,8 +76,16 @@ export const FileUploadItemComponent: React.FC<FileUploadItemProps> = ({
     </div>
 );
 
+/** @deprecated Используйте атомарные импорты */
 export const FileUploadItem = Object.assign(FileUploadItemComponent, {
     StatusControl,
     Content,
     Actions,
 });
+
+export {
+    // FileUploadItemComponent - экспорт выше
+    StatusControl,
+    Content,
+    Actions,
+};

packages/list/package.json

@@ -10,6 +10,7 @@
         "access": "public",
         "directory": "dist"
     },
+    "sideEffects": false,
     "peerDependencies": {
         "react": "^16.9.0 || ^17.0.1 || ^18.0.0"
     },

packages/list/src/Component.tsx

@@ -140,6 +140,9 @@ const ListComponent: React.FC<ListProps> = ({
     );
 };
 
+/** @deprecated Используйте атомарные импорты */
 export const List = Object.assign(ListComponent, {
     Item,
 });
+
+export { ListComponent, Item };

packages/modal/package.json

@@ -10,6 +10,7 @@
         "access": "public",
         "directory": "dist"
     },
+    "sideEffects": false,
     "dependencies": {
         "@alfalab/core-components-base-modal": "^5.8.4",
         "@alfalab/core-components-navigation-bar-private": "^0.5.1",

packages/modal/src/Component.responsive.tsx

@@ -30,11 +30,14 @@ const ModalResponsiveComponent = forwardRef<HTMLDivElement, ModalResponsiveProps
     },
 );
 
+/** @deprecated Используйте атомарные импорты */
 export const ModalResponsive = Object.assign(ModalResponsiveComponent, {
     Header,
     Content,
     Footer,
     Controls,
 });
 
+export { ModalResponsiveComponent, Header, Content, Footer, Controls };
+
 ModalResponsiveComponent.displayName = 'ModalResponsiveComponent';

packages/modal/src/desktop/Component.desktop.tsx

@@ -11,9 +11,21 @@ const ModalDesktopComponent = forwardRef<HTMLDivElement, ModalDesktopProps>((pro
     <Modal {...props} ref={ref} view='desktop' />
 ));
 
+const HeaderCustomType = Header as React.FC<Omit<HeaderProps, 'titleSize' | 'subtitle'>>;
+const ControlsCustomType = Controls as React.FC<Omit<ControlsProps, 'mobileLayout'>>;
+
+/** @deprecated Используйте атомарные импорты */
 export const ModalDesktop = Object.assign(ModalDesktopComponent, {
     Content,
-    Header: Header as React.FC<Omit<HeaderProps, 'titleSize' | 'subtitle'>>,
+    Header: HeaderCustomType,
     Footer,
-    Controls: Controls as React.FC<Omit<ControlsProps, 'mobileLayout'>>,
+    Controls: ControlsCustomType,
 });
+
+export {
+    ModalDesktopComponent,
+    Content,
+    HeaderCustomType as Header,
+    Footer,
+    ControlsCustomType as Controls,
+};

packages/modal/src/index.ts

@@ -1,2 +1,10 @@
-export { ModalResponsive as Modal } from './Component.responsive';
+export {
+    ModalResponsive as Modal,
+    ModalResponsiveComponent,
+    Header,
+    Content,
+    Footer,
+    Controls,
+} from './Component.responsive';
+
 export { ModalResponsiveProps as ModalProps } from './typings';

packages/modal/src/mobile/Component.mobile.tsx

@@ -11,9 +11,14 @@ const ModalMobileComponent = forwardRef<HTMLDivElement, ModalMobileProps>((props
     <Modal {...props} ref={ref} view='mobile' />
 ));
 
+const ControlsCustomType = Controls as React.FC<Omit<ControlsProps, 'mobileLayout'>>;
+
+/** @deprecated Используйте атомарные импорты */
 export const ModalMobile = Object.assign(ModalMobileComponent, {
     Content,
     Header,
     Footer,
-    Controls: Controls as React.FC<Omit<ControlsProps, 'mobileLayout'>>,
+    Controls: ControlsCustomType,
 });
+
+export { ModalMobileComponent, Content, Header, Footer, ControlsCustomType as Controls };

packages/pure-cell/package.json

@@ -10,6 +10,7 @@
         "access": "public",
         "directory": "dist"
     },
+    "sideEffects": false,
     "peerDependencies": {
         "react": "^16.9.0 || ^17.0.1 || ^18.0.0",
         "react-dom": "^16.9.0 || ^17.0.1 || ^18.0.0"

packages/pure-cell/src/component.tsx

@@ -219,10 +219,14 @@ const PureCellComponent = forwardRef<HTMLElement, PureCellProps>(
     },
 );
 
+const FooterTextCustomType = FooterText as React.FC<FooterTextProps>;
+
 /**
  * Универсальный конструктор для сборки любой ячейки.
  *
  * [Макет](https://www.figma.com/file/KlFOLLkKO8rtvvQE3RXuhq/Click-Library?node-id=43525%3A240018)
+ *
+ * @deprecated Используйте атомарные импорты
  */
 export const PureCell = Object.assign(PureCellComponent, {
     Main,
@@ -233,10 +237,26 @@ export const PureCell = Object.assign(PureCellComponent, {
     AmountTitle,
     Addon,
     Footer,
-    ExtraSubtitle: FooterText as React.FC<FooterTextProps>,
+    ExtraSubtitle: FooterTextCustomType,
     FooterButton,
     Comment,
     Category,
 });
 
+export {
+    PureCellComponent,
+    Main,
+    Graphics,
+    Comment,
+    Text,
+    Amount,
+    AmountTitle,
+    Addon,
+    Footer,
+    FooterTextCustomType as ExtraSubtitle,
+    FooterButton,
+    Content,
+    Category,
+};
+
 PureCellComponent.displayName = 'PureCellComponent';

packages/pure-cell/src/index.ts

@@ -1,2 +1,18 @@
-export { PureCell } from './component';
+export {
+    PureCell,
+    PureCellComponent,
+    Comment,
+    Addon,
+    Amount,
+    AmountTitle,
+    Category,
+    Content,
+    Footer,
+    FooterButton,
+    ExtraSubtitle,
+    Graphics,
+    Main,
+    Text,
+} from './component';
+
 export type { PureCellProps } from './component';

packages/side-panel/src/Component.responsive.tsx

@@ -93,11 +93,23 @@ const SidePanelResponsiveComponent = forwardRef<HTMLDivElement, SidePanelRespons
     },
 );
 
+const ContentGenerated = createResponsive(SidePanelDesktop.Content, SidePanelMobile.Content);
+const FooterGenerated = createResponsive(SidePanelDesktop.Footer, SidePanelMobile.Footer);
+
+/** @deprecated Используйте атомарные импорты */
 export const SidePanelResponsive = Object.assign(SidePanelResponsiveComponent, {
     Header,
     Controls,
-    Content: createResponsive(SidePanelDesktop.Content, SidePanelMobile.Content),
-    Footer: createResponsive(SidePanelDesktop.Footer, SidePanelMobile.Footer),
+    Content: ContentGenerated,
+    Footer: FooterGenerated,
 });
 
+export {
+    SidePanelResponsiveComponent,
+    Header,
+    Controls,
+    ContentGenerated as Content,
+    FooterGenerated as Footer,
+};
+
 SidePanelResponsiveComponent.displayName = 'SidePanelResponsiveComponent';

packages/side-panel/src/desktop/Component.desktop.tsx

@@ -102,9 +102,21 @@ const SidePanelDesktopComponent = forwardRef<HTMLDivElement, SidePanelDesktopPro
     },
 );
 
+const HeaderCustomType = Header as React.FC<Omit<HeaderProps, 'titleSize' | 'subtitle'>>;
+const ControlsCustomType = Controls as React.FC<Omit<ControlsProps, 'mobileLayout'>>;
+
+/** @deprecated Используйте атомарные импорты */
 export const SidePanelDesktop = Object.assign(SidePanelDesktopComponent, {
     Content: ContentDesktop,
-    Header: Header as React.FC<Omit<HeaderProps, 'titleSize' | 'subtitle'>>,
+    Header: HeaderCustomType,
     Footer: FooterDesktop,
-    Controls: Controls as React.FC<Omit<ControlsProps, 'mobileLayout'>>,
+    Controls: ControlsCustomType,
 });
+
+export {
+    SidePanelDesktopComponent,
+    ContentDesktop as Content,
+    HeaderCustomType as Header,
+    FooterDesktop as Footer,
+    ControlsCustomType as Controls,
+};

packages/side-panel/src/mobile/Component.mobile.tsx

@@ -55,9 +55,20 @@ const SidePanelMobileComponent = forwardRef<HTMLDivElement, SidePanelMobileProps
     },
 );
 
+const ControlsCustomType = Controls as React.FC<Omit<ControlsProps, 'mobileLayout'>>;
+
+/** @deprecated Используйте атомарные импорты */
 export const SidePanelMobile = Object.assign(SidePanelMobileComponent, {
     Content: ContentMobile,
     Header,
     Footer: FooterMobile,
-    Controls: Controls as React.FC<Omit<ControlsProps, 'mobileLayout'>>,
+    Controls: ControlsCustomType,
 });
+
+export {
+    SidePanelMobileComponent,
+    ContentMobile as Content,
+    Header,
+    FooterMobile as Footer,
+    ControlsCustomType as Controls,
+};

packages/system-message/src/utils.ts

@@ -6,6 +6,7 @@ import { Graphic } from './components/graphic';
 import { Subtitle } from './components/subtitle';
 import { Title } from './components/title';
 
+// TODO уйти от компаунда
 export function createCompound<T>(functionComponent: T) {
     return Object.assign(functionComponent, {
         Graphic,

packages/tab-bar/package.json

@@ -10,6 +10,7 @@
         "access": "public",
         "directory": "dist"
     },
+    "sideEffects": false,
     "peerDependencies": {
         "react": ">=16.8.0",
         "react-dom": ">=16.8.0"

packages/tab-bar/src/Component.tsx

@@ -55,4 +55,7 @@ const TabBarComponent = forwardRef<HTMLDivElement, TabBarProps>(
 
 TabBarComponent.displayName = 'TabBarComponent';
 
+/** @deprecated Используйте атомарные импорты */
 export const TabBar = Object.assign(TabBarComponent, { Tab });
+
+export { TabBarComponent, Tab };

packages/tab-bar/src/index.ts

@@ -1,2 +1,2 @@
-export { TabBar } from './Component';
+export * from './Component';
 export { TabBarProps, TabProps } from './types';

packages/table/package.json

@@ -10,6 +10,7 @@
         "access": "public",
         "directory": "dist"
     },
+    "sideEffects": false,
     "peerDependencies": {
         "react": "^16.9.0 || ^17.0.1 || ^18.0.0",
         "react-dom": "^16.9.0 || ^17.0.1 || ^18.0.0"

packages/table/src/component.tsx

@@ -10,6 +10,7 @@ import {
     TSortableHeadCell,
 } from './components';
 
+/** @deprecated Используйте атомарные импорты */
 export const Table = Object.assign(TableComponent, {
     TBody,
     THead,
@@ -20,3 +21,15 @@ export const Table = Object.assign(TableComponent, {
     TExpandableRow,
     Pagination,
 });
+
+export {
+    TableComponent,
+    TBody,
+    THead,
+    THeadCell,
+    TSortableHeadCell,
+    TCell,
+    TRow,
+    TExpandableRow,
+    Pagination,
+};