From e840ca38e2c9a801bbe0e90aedcaffad940d4290 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Denis=20=F0=9F=8E=83=20Khripkov?= Date: Mon, 23 Dec 2024 13:59:33 +0300 Subject: [PATCH] feat(amount): add atom imports; --- .changeset/brown-coins-sing.md | 7 ------- .changeset/flat-oranges-heal.md | 5 +++++ packages/amount/src/docs/development.mdx | 6 +++--- packages/amount/src/index.ts | 3 +-- packages/modal/src/Component.responsive.tsx | 8 ------- .../modal/src/desktop/Component.desktop.tsx | 15 ++----------- packages/modal/src/desktop/index.ts | 2 +- packages/modal/src/docs/description.mdx | 2 -- packages/modal/src/docs/development.mdx | 21 +++++++------------ packages/modal/src/index.ts | 4 +--- .../modal/src/mobile/Component.mobile.tsx | 12 +---------- packages/modal/src/mobile/index.ts | 2 +- 12 files changed, 23 insertions(+), 64 deletions(-) delete mode 100644 .changeset/brown-coins-sing.md create mode 100644 .changeset/flat-oranges-heal.md diff --git a/.changeset/brown-coins-sing.md b/.changeset/brown-coins-sing.md deleted file mode 100644 index e41a68d344..0000000000 --- a/.changeset/brown-coins-sing.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -'@alfalab/core-components-amount': minor -'@alfalab/core-components-modal': minor ---- - - - Добавлены атомарные импорты - - Добавлено sideEffects:false diff --git a/.changeset/flat-oranges-heal.md b/.changeset/flat-oranges-heal.md new file mode 100644 index 0000000000..b0ab40336d --- /dev/null +++ b/.changeset/flat-oranges-heal.md @@ -0,0 +1,5 @@ +--- +'@alfalab/core-components-amount': minor +--- + +Добавлены атомарные импорты diff --git a/packages/amount/src/docs/development.mdx b/packages/amount/src/docs/development.mdx index e3b3a7cfa0..29b44b4cbd 100644 --- a/packages/amount/src/docs/development.mdx +++ b/packages/amount/src/docs/development.mdx @@ -6,11 +6,11 @@ import styles from '!!raw-loader!../index.module.css'; ## Подключение ```jsx -// Атомарные импорты -import { AmountComponent, Pure } from '@alfalab/core-components/amount'; - // Компаунд импорт import { Amount } from '@alfalab/core-components/amount'; + +// Атомарные импорты +import { AmountComponent, Pure } from '@alfalab/core-components/amount'; ``` ## Свойства diff --git a/packages/amount/src/index.ts b/packages/amount/src/index.ts index e73e67d1da..e2a50d656e 100644 --- a/packages/amount/src/index.ts +++ b/packages/amount/src/index.ts @@ -1,8 +1,7 @@ -import { PureAmount } from './pure/component'; import { Amount as DefaultAmount } from './component'; +import { PureAmount } from './pure'; type AmountType = typeof DefaultAmount & { Pure: typeof PureAmount }; - export const Amount: AmountType = DefaultAmount as AmountType; Amount.Pure = PureAmount; diff --git a/packages/modal/src/Component.responsive.tsx b/packages/modal/src/Component.responsive.tsx index 4f88f60474..5ca5392191 100644 --- a/packages/modal/src/Component.responsive.tsx +++ b/packages/modal/src/Component.responsive.tsx @@ -38,11 +38,3 @@ export const ModalResponsive = Object.assign(ModalResponsiveComponent, { }); ModalResponsiveComponent.displayName = 'ModalResponsiveComponent'; - -export { - ModalResponsiveComponent as ModalComponentResponsive, - Header as HeaderResponsive, - Content as ContentResponsive, - Footer as FooterResponsive, - Controls as ControlsResponsive, -}; diff --git a/packages/modal/src/desktop/Component.desktop.tsx b/packages/modal/src/desktop/Component.desktop.tsx index e9d62adbd2..54fcd5574d 100644 --- a/packages/modal/src/desktop/Component.desktop.tsx +++ b/packages/modal/src/desktop/Component.desktop.tsx @@ -11,20 +11,9 @@ const ModalDesktopComponent = forwardRef((pro )); -const HeaderDesktop = Header as React.FC>; -const ControlsDesktop = Controls as React.FC>; - export const ModalDesktop = Object.assign(ModalDesktopComponent, { Content, - Header: HeaderDesktop, + Header: Header as React.FC>, Footer, - Controls: ControlsDesktop, + Controls: Controls as React.FC>, }); - -export { - ModalDesktopComponent as ModalComponentDesktop, - Content as ContentDesktop, - HeaderDesktop, - Footer as FooterDesktop, - ControlsDesktop, -}; diff --git a/packages/modal/src/desktop/index.ts b/packages/modal/src/desktop/index.ts index 3acadf16fa..19781c2a3e 100644 --- a/packages/modal/src/desktop/index.ts +++ b/packages/modal/src/desktop/index.ts @@ -1,2 +1,2 @@ export * from './Component.desktop'; -export { type ModalDesktopProps } from '../typings'; +export { ModalDesktopProps } from '../typings'; diff --git a/packages/modal/src/docs/description.mdx b/packages/modal/src/docs/description.mdx index b8eb5badfc..f971e32ee9 100644 --- a/packages/modal/src/docs/description.mdx +++ b/packages/modal/src/docs/description.mdx @@ -4,8 +4,6 @@ Modal построен как Compound Components. Состоит из Header, C Чтобы во время скролла заголовок и кнопки оставались неподвижны, их нужно расположить в `header` и `footer`. Текст и изображения всегда располагаются в `content` части. -Также есть атомарные импорты. - ```jsx live mobileHeight={640} const Header = () => { const { setHasHeader } = React.useContext(ModalContext); diff --git a/packages/modal/src/docs/development.mdx b/packages/modal/src/docs/development.mdx index 0e10d50d02..e68ca6ba76 100644 --- a/packages/modal/src/docs/development.mdx +++ b/packages/modal/src/docs/development.mdx @@ -1,24 +1,19 @@ import { ArgsTabs, CssVars } from 'storybook/blocks'; -import { ModalDesktop, ModalMobile, Modal as ModalResponsive } from '..'; +import { ModalMobile } from '../mobile'; +import { ModalDesktop } from '../desktop'; +import { ModalResponsive } from '../Component.responsive'; import vars from '!!raw-loader!../vars.css'; ## Подключение ```jsx -// Атомарные импорты -import { ModalComponentDesktop, ContentDesktop, HeaderDesktop, FooterDesktop, ControlsDesktop } from '@alfalab/core-components/modal'; -import { ModalComponentMobile, ContentMobile, HeaderMobile, FooterMobile, ControlsMobile } from '@alfalab/core-components/modal'; -import { ModalComponentResponsive, ContentResponsive, HeaderResponsive, FooterResponsive, ControlsResponsive } from '@alfalab/core-components/modal'; +import { Modal } from '@alfalab/core-components/modal'; +import { ModalDesktop } from '@alfalab/core-components/modal/desktop'; +import { ModalMobile } from '@alfalab/core-components/modal/mobile'; -// Компаунд импорты -import { Modal, ModalDesktop, ModalMobile } from '@alfalab/core-components/modal'; - -// Контекст import { ModalContext } from '@alfalab/core-components/modal/shared'; ``` -Импорт Modal - респонсивный компаунд - ## Использование контекста Компонент модального окна предоставляет доступ к контексту, что позволяет гибко настраивать и расширять компонент, а также упрощает использование. @@ -48,8 +43,8 @@ export type ModalContext = { ## Использование dataTestId -В компоненте используются модификаторы для `dataTestId`. -Для удобного поиска элементов можно воспользоваться функцией `getModalTestIds`. +В компоненте используются модификаторы для `dataTestId`. +Для удобного поиска элементов можно воспользоваться функцией `getModalTestIds`. Импорт из `@alfalab/core-components/modal/shared`. Функция возвращает объект: diff --git a/packages/modal/src/index.ts b/packages/modal/src/index.ts index af20a39a63..4df5fa1e49 100644 --- a/packages/modal/src/index.ts +++ b/packages/modal/src/index.ts @@ -1,4 +1,2 @@ -export * from './desktop'; -export * from './mobile'; export { ModalResponsive as Modal } from './Component.responsive'; -export { type ModalResponsiveProps as ModalProps } from './typings'; +export { ModalResponsiveProps as ModalProps } from './typings'; diff --git a/packages/modal/src/mobile/Component.mobile.tsx b/packages/modal/src/mobile/Component.mobile.tsx index 1bf94057ac..d167e5b5f2 100644 --- a/packages/modal/src/mobile/Component.mobile.tsx +++ b/packages/modal/src/mobile/Component.mobile.tsx @@ -11,19 +11,9 @@ const ModalMobileComponent = forwardRef((props )); -const ControlsMobile = Controls as React.FC>; - export const ModalMobile = Object.assign(ModalMobileComponent, { Content, Header, Footer, - Controls: ControlsMobile, + Controls: Controls as React.FC>, }); - -export { - ModalMobileComponent as ModalComponentMobile, - Content as ContentMobile, - Header as HeaderMobile, - Footer as FooterMobile, - ControlsMobile, -}; diff --git a/packages/modal/src/mobile/index.ts b/packages/modal/src/mobile/index.ts index d5c4b2ecc7..af19409db7 100644 --- a/packages/modal/src/mobile/index.ts +++ b/packages/modal/src/mobile/index.ts @@ -1,2 +1,2 @@ export * from './Component.mobile'; -export { type ModalMobileProps } from '../typings'; +export { ModalMobileProps } from '../typings';