@alfalab/core-components-side-panel 7.0.4 → 7.0.5
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.
- package/Component.responsive.d.ts +11 -11
- package/Context.d.ts +0 -1
- package/components/content/Component.d.ts +1 -1
- package/components/content/Component.desktop.d.ts +1 -1
- package/components/content/Component.mobile.d.ts +1 -1
- package/components/content/desktop.css +2 -2
- package/components/content/desktop.module.css.js +1 -1
- package/components/content/index.css +3 -3
- package/components/content/index.module.css.js +1 -1
- package/components/content/mobile.css +2 -2
- package/components/content/mobile.module.css.js +1 -1
- package/components/controls/index.css +1 -1
- package/components/controls/index.module.css.js +1 -1
- package/components/footer/Component.d.ts +1 -1
- package/components/footer/Component.desktop.d.ts +1 -1
- package/components/footer/Component.mobile.d.ts +1 -1
- package/components/footer/desktop.css +2 -2
- package/components/footer/desktop.module.css.js +1 -1
- package/components/footer/index.css +3 -3
- package/components/footer/index.module.css.js +1 -1
- package/components/footer/layout.css +16 -16
- package/components/footer/layout.module.css.js +1 -1
- package/components/footer/mobile.css +3 -3
- package/components/footer/mobile.module.css.js +1 -1
- package/components/footer/mobile.module.css.js.map +1 -1
- package/components/header/Component.d.ts +1 -1
- package/components/header/desktop.css +3 -3
- package/components/header/desktop.module.css.js +1 -1
- package/components/header/index.css +13 -13
- package/components/header/index.module.css.js +1 -1
- package/components/header/mobile.css +4 -4
- package/components/header/mobile.module.css.js +1 -1
- package/cssm/Component.responsive.d.ts +11 -11
- package/cssm/Context.d.ts +0 -1
- package/cssm/components/content/Component.d.ts +1 -1
- package/cssm/components/content/Component.desktop.d.ts +1 -1
- package/cssm/components/content/Component.mobile.d.ts +1 -1
- package/cssm/components/footer/Component.d.ts +1 -1
- package/cssm/components/footer/Component.desktop.d.ts +1 -1
- package/cssm/components/footer/Component.mobile.d.ts +1 -1
- package/cssm/components/header/Component.d.ts +1 -1
- package/cssm/desktop/Component.desktop.d.ts +6 -6
- package/cssm/desktop/Component.desktop.js +3 -1
- package/cssm/desktop/Component.desktop.js.map +1 -1
- package/cssm/mobile/Component.mobile.d.ts +3 -3
- package/cssm/typings.d.ts +2 -2
- package/desktop/Component.desktop.d.ts +6 -6
- package/desktop/Component.desktop.js +3 -1
- package/desktop/Component.desktop.js.map +1 -1
- package/desktop/desktop.css +2 -2
- package/desktop/desktop.module.css.js +1 -1
- package/desktop/transitions.desktop.css +6 -6
- package/desktop/transitions.desktop.module.css.js +1 -1
- package/esm/Component.responsive.d.ts +11 -11
- package/esm/Context.d.ts +0 -1
- package/esm/components/content/Component.d.ts +1 -1
- package/esm/components/content/Component.desktop.d.ts +1 -1
- package/esm/components/content/Component.mobile.d.ts +1 -1
- package/esm/components/content/desktop.css +2 -2
- package/esm/components/content/desktop.module.css.js +1 -1
- package/esm/components/content/index.css +3 -3
- package/esm/components/content/index.module.css.js +1 -1
- package/esm/components/content/mobile.css +2 -2
- package/esm/components/content/mobile.module.css.js +1 -1
- package/esm/components/controls/index.css +1 -1
- package/esm/components/controls/index.module.css.js +1 -1
- package/esm/components/footer/Component.d.ts +1 -1
- package/esm/components/footer/Component.desktop.d.ts +1 -1
- package/esm/components/footer/Component.mobile.d.ts +1 -1
- package/esm/components/footer/desktop.css +2 -2
- package/esm/components/footer/desktop.module.css.js +1 -1
- package/esm/components/footer/index.css +3 -3
- package/esm/components/footer/index.module.css.js +1 -1
- package/esm/components/footer/layout.css +16 -16
- package/esm/components/footer/layout.module.css.js +1 -1
- package/esm/components/footer/mobile.css +3 -3
- package/esm/components/footer/mobile.module.css.js +1 -1
- package/esm/components/footer/mobile.module.css.js.map +1 -1
- package/esm/components/header/Component.d.ts +1 -1
- package/esm/components/header/desktop.css +3 -3
- package/esm/components/header/desktop.module.css.js +1 -1
- package/esm/components/header/index.css +13 -13
- package/esm/components/header/index.module.css.js +1 -1
- package/esm/components/header/mobile.css +4 -4
- package/esm/components/header/mobile.module.css.js +1 -1
- package/esm/desktop/Component.desktop.d.ts +6 -6
- package/esm/desktop/Component.desktop.js +3 -1
- package/esm/desktop/Component.desktop.js.map +1 -1
- package/esm/desktop/desktop.css +2 -2
- package/esm/desktop/desktop.module.css.js +1 -1
- package/esm/desktop/transitions.desktop.css +6 -6
- package/esm/desktop/transitions.desktop.module.css.js +1 -1
- package/esm/mobile/Component.mobile.d.ts +3 -3
- package/esm/mobile/mobile.css +4 -4
- package/esm/mobile/mobile.module.css.js +1 -1
- package/esm/mobile/transitions.mobile.css +7 -7
- package/esm/mobile/transitions.mobile.module.css.js +1 -1
- package/esm/typings.d.ts +2 -2
- package/mobile/Component.mobile.d.ts +3 -3
- package/mobile/mobile.css +4 -4
- package/mobile/mobile.module.css.js +1 -1
- package/mobile/transitions.mobile.css +7 -7
- package/mobile/transitions.mobile.module.css.js +1 -1
- package/modern/Component.responsive.d.ts +11 -11
- package/modern/Context.d.ts +0 -1
- package/modern/components/content/Component.d.ts +1 -1
- package/modern/components/content/Component.desktop.d.ts +1 -1
- package/modern/components/content/Component.mobile.d.ts +1 -1
- package/modern/components/content/desktop.css +2 -2
- package/modern/components/content/desktop.module.css.js +1 -1
- package/modern/components/content/index.css +3 -3
- package/modern/components/content/index.module.css.js +1 -1
- package/modern/components/content/mobile.css +2 -2
- package/modern/components/content/mobile.module.css.js +1 -1
- package/modern/components/controls/index.css +1 -1
- package/modern/components/controls/index.module.css.js +1 -1
- package/modern/components/footer/Component.d.ts +1 -1
- package/modern/components/footer/Component.desktop.d.ts +1 -1
- package/modern/components/footer/Component.mobile.d.ts +1 -1
- package/modern/components/footer/desktop.css +2 -2
- package/modern/components/footer/desktop.module.css.js +1 -1
- package/modern/components/footer/index.css +3 -3
- package/modern/components/footer/index.module.css.js +1 -1
- package/modern/components/footer/layout.css +16 -16
- package/modern/components/footer/layout.module.css.js +1 -1
- package/modern/components/footer/mobile.css +3 -3
- package/modern/components/footer/mobile.module.css.js +1 -1
- package/modern/components/footer/mobile.module.css.js.map +1 -1
- package/modern/components/header/Component.d.ts +1 -1
- package/modern/components/header/desktop.css +3 -3
- package/modern/components/header/desktop.module.css.js +1 -1
- package/modern/components/header/index.css +13 -13
- package/modern/components/header/index.module.css.js +1 -1
- package/modern/components/header/mobile.css +4 -4
- package/modern/components/header/mobile.module.css.js +1 -1
- package/modern/desktop/Component.desktop.d.ts +6 -6
- package/modern/desktop/Component.desktop.js +3 -1
- package/modern/desktop/Component.desktop.js.map +1 -1
- package/modern/desktop/desktop.css +2 -2
- package/modern/desktop/desktop.module.css.js +1 -1
- package/modern/desktop/transitions.desktop.css +6 -6
- package/modern/desktop/transitions.desktop.module.css.js +1 -1
- package/modern/mobile/Component.mobile.d.ts +3 -3
- package/modern/mobile/mobile.css +4 -4
- package/modern/mobile/mobile.module.css.js +1 -1
- package/modern/mobile/transitions.mobile.css +7 -7
- package/modern/mobile/transitions.mobile.module.css.js +1 -1
- package/modern/typings.d.ts +2 -2
- package/moderncssm/Component.responsive.d.ts +11 -11
- package/moderncssm/Context.d.ts +0 -1
- package/moderncssm/components/content/Component.d.ts +1 -1
- package/moderncssm/components/content/Component.desktop.d.ts +1 -1
- package/moderncssm/components/content/Component.mobile.d.ts +1 -1
- package/moderncssm/components/footer/Component.d.ts +1 -1
- package/moderncssm/components/footer/Component.desktop.d.ts +1 -1
- package/moderncssm/components/footer/Component.mobile.d.ts +1 -1
- package/moderncssm/components/header/Component.d.ts +1 -1
- package/moderncssm/desktop/Component.desktop.d.ts +6 -6
- package/moderncssm/desktop/Component.desktop.js +3 -1
- package/moderncssm/desktop/Component.desktop.js.map +1 -1
- package/moderncssm/mobile/Component.mobile.d.ts +3 -3
- package/moderncssm/typings.d.ts +2 -2
- package/package.json +7 -7
- package/src/desktop/Component.desktop.tsx +3 -1
- package/src/vars.css +1 -1
- package/typings.d.ts +2 -2
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import { type FC } from 'react';
|
|
2
2
|
import { type NavigationBarPrivateProps } from '@alfalab/core-components-navigation-bar-private/cssm';
|
|
3
|
-
export
|
|
3
|
+
export type HeaderProps = Omit<NavigationBarPrivateProps, 'size' | 'view' | 'parentRef'>;
|
|
4
4
|
export declare const Header: FC<HeaderProps>;
|
|
@@ -5,7 +5,7 @@ import { ContentDesktop } from '../components/content/Component.desktop';
|
|
|
5
5
|
import { type ControlsProps } from '../components/controls';
|
|
6
6
|
import { FooterDesktop } from '../components/footer/Component.desktop';
|
|
7
7
|
import { type HeaderProps } from '../components/header/Component';
|
|
8
|
-
export
|
|
8
|
+
export type SidePanelDesktopProps = BaseModalProps & Pick<DrawerProps, 'placement' | 'nativeScrollbar' | 'contentTransitionProps'> & {
|
|
9
9
|
/**
|
|
10
10
|
* Ширина модального окна
|
|
11
11
|
* @default "s"
|
|
@@ -22,26 +22,26 @@ declare const SidePanelDesktopComponent: React.ForwardRefExoticComponent<BaseMod
|
|
|
22
22
|
* Ширина модального окна
|
|
23
23
|
* @default "s"
|
|
24
24
|
*/
|
|
25
|
-
size?: "s" | 500
|
|
25
|
+
size?: "s" | 500;
|
|
26
26
|
/**
|
|
27
27
|
* Управление наличием закрывающего крестика
|
|
28
28
|
* @default false
|
|
29
29
|
*/
|
|
30
|
-
hasCloser?: boolean
|
|
30
|
+
hasCloser?: boolean;
|
|
31
31
|
} & React.RefAttributes<HTMLDivElement>>;
|
|
32
|
-
declare const HeaderDesktop: React.FC<Omit<HeaderProps, "
|
|
32
|
+
declare const HeaderDesktop: React.FC<Omit<HeaderProps, "titleSize" | "subtitle">>;
|
|
33
33
|
declare const ControlsDesktop: React.FC<Omit<ControlsProps, "mobileLayout">>;
|
|
34
34
|
declare const SidePanelDesktop: React.ForwardRefExoticComponent<BaseModalProps & Pick<DrawerProps, "placement" | "nativeScrollbar" | "contentTransitionProps"> & {
|
|
35
35
|
/**
|
|
36
36
|
* Ширина модального окна
|
|
37
37
|
* @default "s"
|
|
38
38
|
*/
|
|
39
|
-
size?: "s" | 500
|
|
39
|
+
size?: "s" | 500;
|
|
40
40
|
/**
|
|
41
41
|
* Управление наличием закрывающего крестика
|
|
42
42
|
* @default false
|
|
43
43
|
*/
|
|
44
|
-
hasCloser?: boolean
|
|
44
|
+
hasCloser?: boolean;
|
|
45
45
|
} & React.RefAttributes<HTMLDivElement>> & {
|
|
46
46
|
Content: React.FC<import("../components/content/Component.desktop").ContentDesktopProps>;
|
|
47
47
|
Header: React.FC<Omit<HeaderProps, "subtitle" | "titleSize">>;
|
|
@@ -47,7 +47,9 @@ var SidePanelDesktopComponent = React.forwardRef(function (_a, ref) {
|
|
|
47
47
|
exitActive: exitCn,
|
|
48
48
|
exitDone: exitCn,
|
|
49
49
|
} }, contentTransitionProps) }), React__default.default.Children.map(children, function (child) {
|
|
50
|
-
return React.isValidElement(child)
|
|
50
|
+
return React.isValidElement(child)
|
|
51
|
+
? React.cloneElement(child, { size: size })
|
|
52
|
+
: child;
|
|
51
53
|
}))); };
|
|
52
54
|
var renderWithContext = function () { return (React__default.default.createElement(ResponsiveContext.ResponsiveContext.Provider, { value: contextValue }, renderContent())); };
|
|
53
55
|
return responsiveContext ? renderContent() : renderWithContext();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.desktop.js","sources":["../../src/desktop/Component.desktop.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef, isValidElement, useContext, useRef } from 'react';\nimport mergeRefs from 'react-merge-refs';\nimport cn from 'classnames';\n\nimport { type BaseModalProps } from '@alfalab/core-components-base-modal';\nimport { Drawer, type DrawerProps } from '@alfalab/core-components-drawer';\n\nimport { ContentDesktop } from '../components/content/Component.desktop';\nimport { Controls, type ControlsProps } from '../components/controls';\nimport { FooterDesktop } from '../components/footer/Component.desktop';\nimport { Header, type HeaderProps } from '../components/header/Component';\nimport { SIZE_TO_CLASSNAME_MAP } from '../consts';\nimport { ResponsiveContext } from '../ResponsiveContext';\nimport { type TResponsiveModalContext } from '../typings';\n\nimport styles from './desktop.module.css';\nimport transitions from './transitions.desktop.module.css';\n\nexport type SidePanelDesktopProps = BaseModalProps &\n Pick<DrawerProps, 'placement' | 'nativeScrollbar' | 'contentTransitionProps'> & {\n /**\n * Ширина модального окна\n * @default \"s\"\n */\n size?: 's' | 500;\n\n /**\n * Управление наличием закрывающего крестика\n * @default false\n */\n hasCloser?: boolean;\n };\n\nconst SidePanelDesktopComponent = forwardRef<HTMLDivElement, SidePanelDesktopProps>(\n (\n {\n size = 500,\n children,\n className,\n wrapperClassName,\n contentTransitionProps = {},\n backdropProps,\n placement = 'right',\n dataTestId,\n ...restProps\n },\n ref,\n ) => {\n const responsiveContext = useContext(ResponsiveContext);\n const modalRef = useRef<HTMLElement>(null);\n\n const enterCn = cn({\n [transitions.appearRight]: placement === 'right',\n [transitions.appearLeft]: placement === 'left',\n });\n\n const exitCn = cn({\n [transitions.exitActiveRight]: placement === 'right',\n [transitions.exitActiveLeft]: placement === 'left',\n });\n\n const contextValue = React.useMemo<TResponsiveModalContext>(\n () => ({ size, view: 'desktop', dataTestId }),\n [size, dataTestId],\n );\n\n const renderContent = () => (\n <Drawer\n {...restProps}\n dataTestId={dataTestId}\n ref={mergeRefs([ref, modalRef])}\n placement={placement}\n wrapperClassName={wrapperClassName}\n className={cn(className, styles[SIZE_TO_CLASSNAME_MAP[size]], styles.hidden)}\n backdropProps={backdropProps}\n contentTransitionProps={{\n classNames: {\n appear: enterCn,\n enter: enterCn,\n appearActive: transitions.enterActive,\n enterActive: transitions.enterActive,\n exit: transitions.exit,\n exitActive: exitCn,\n exitDone: exitCn,\n },\n ...contentTransitionProps,\n }}\n >\n {React.Children.map(children, (child) =>\n isValidElement(child)
|
|
1
|
+
{"version":3,"file":"Component.desktop.js","sources":["../../src/desktop/Component.desktop.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef, isValidElement, useContext, useRef } from 'react';\nimport mergeRefs from 'react-merge-refs';\nimport cn from 'classnames';\n\nimport { type BaseModalProps } from '@alfalab/core-components-base-modal';\nimport { Drawer, type DrawerProps } from '@alfalab/core-components-drawer';\n\nimport { ContentDesktop } from '../components/content/Component.desktop';\nimport { Controls, type ControlsProps } from '../components/controls';\nimport { FooterDesktop } from '../components/footer/Component.desktop';\nimport { Header, type HeaderProps } from '../components/header/Component';\nimport { SIZE_TO_CLASSNAME_MAP } from '../consts';\nimport { ResponsiveContext } from '../ResponsiveContext';\nimport { type TResponsiveModalContext } from '../typings';\n\nimport styles from './desktop.module.css';\nimport transitions from './transitions.desktop.module.css';\n\nexport type SidePanelDesktopProps = BaseModalProps &\n Pick<DrawerProps, 'placement' | 'nativeScrollbar' | 'contentTransitionProps'> & {\n /**\n * Ширина модального окна\n * @default \"s\"\n */\n size?: 's' | 500;\n\n /**\n * Управление наличием закрывающего крестика\n * @default false\n */\n hasCloser?: boolean;\n };\n\nconst SidePanelDesktopComponent = forwardRef<HTMLDivElement, SidePanelDesktopProps>(\n (\n {\n size = 500,\n children,\n className,\n wrapperClassName,\n contentTransitionProps = {},\n backdropProps,\n placement = 'right',\n dataTestId,\n ...restProps\n },\n ref,\n ) => {\n const responsiveContext = useContext(ResponsiveContext);\n const modalRef = useRef<HTMLElement>(null);\n\n const enterCn = cn({\n [transitions.appearRight]: placement === 'right',\n [transitions.appearLeft]: placement === 'left',\n });\n\n const exitCn = cn({\n [transitions.exitActiveRight]: placement === 'right',\n [transitions.exitActiveLeft]: placement === 'left',\n });\n\n const contextValue = React.useMemo<TResponsiveModalContext>(\n () => ({ size, view: 'desktop', dataTestId }),\n [size, dataTestId],\n );\n\n const renderContent = () => (\n <Drawer\n {...restProps}\n dataTestId={dataTestId}\n ref={mergeRefs([ref, modalRef])}\n placement={placement}\n wrapperClassName={wrapperClassName}\n className={cn(className, styles[SIZE_TO_CLASSNAME_MAP[size]], styles.hidden)}\n backdropProps={backdropProps}\n contentTransitionProps={{\n classNames: {\n appear: enterCn,\n enter: enterCn,\n appearActive: transitions.enterActive,\n enterActive: transitions.enterActive,\n exit: transitions.exit,\n exitActive: exitCn,\n exitDone: exitCn,\n },\n ...contentTransitionProps,\n }}\n >\n {React.Children.map(children, (child) =>\n isValidElement<{ size: unknown }>(child)\n ? cloneElement(child, { size })\n : child,\n )}\n </Drawer>\n );\n\n const renderWithContext = () => (\n <ResponsiveContext.Provider value={contextValue}>\n {renderContent()}\n </ResponsiveContext.Provider>\n );\n\n return responsiveContext ? renderContent() : renderWithContext();\n },\n);\n\nconst HeaderDesktop = Header as React.FC<Omit<HeaderProps, 'titleSize' | 'subtitle'>>;\nconst ControlsDesktop = Controls as React.FC<Omit<ControlsProps, 'mobileLayout'>>;\n\nconst SidePanelDesktop = Object.assign(SidePanelDesktopComponent, {\n Content: ContentDesktop,\n Header: HeaderDesktop,\n Footer: FooterDesktop,\n Controls: ControlsDesktop,\n});\n\nexport {\n SidePanelDesktop,\n SidePanelDesktopComponent as SidePanelComponentDesktop,\n ContentDesktop,\n HeaderDesktop,\n FooterDesktop,\n ControlsDesktop,\n};\n"],"names":["forwardRef","__rest","useContext","ResponsiveContext","useRef","cn","transitions","React","Drawer","__assign","mergeRefs","styles","SIZE_TO_CLASSNAME_MAP","isValidElement","cloneElement","Header","Controls","ContentDesktop","FooterDesktop"],"mappings":"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"}
|
|
@@ -4,7 +4,7 @@ import { ContentMobile } from '../components/content/Component.mobile';
|
|
|
4
4
|
import { type ControlsProps } from '../components/controls';
|
|
5
5
|
import { FooterMobile } from '../components/footer/Component.mobile';
|
|
6
6
|
import { Header } from '../components/header/Component';
|
|
7
|
-
export
|
|
7
|
+
export type SidePanelMobileProps = BaseModalProps & {
|
|
8
8
|
/**
|
|
9
9
|
* Управление наличием закрывающего крестика
|
|
10
10
|
* @default false
|
|
@@ -16,7 +16,7 @@ declare const SidePanelMobileComponent: React.ForwardRefExoticComponent<BaseModa
|
|
|
16
16
|
* Управление наличием закрывающего крестика
|
|
17
17
|
* @default false
|
|
18
18
|
*/
|
|
19
|
-
hasCloser?: boolean
|
|
19
|
+
hasCloser?: boolean;
|
|
20
20
|
} & React.RefAttributes<HTMLDivElement>>;
|
|
21
21
|
declare const ControlsMobile: React.FC<Omit<ControlsProps, "mobileLayout">>;
|
|
22
22
|
declare const SidePanelMobile: React.ForwardRefExoticComponent<BaseModalProps & {
|
|
@@ -24,7 +24,7 @@ declare const SidePanelMobile: React.ForwardRefExoticComponent<BaseModalProps &
|
|
|
24
24
|
* Управление наличием закрывающего крестика
|
|
25
25
|
* @default false
|
|
26
26
|
*/
|
|
27
|
-
hasCloser?: boolean
|
|
27
|
+
hasCloser?: boolean;
|
|
28
28
|
} & React.RefAttributes<HTMLDivElement>> & {
|
|
29
29
|
Content: React.FC<import("../components/content/Component").ContentProps>;
|
|
30
30
|
Header: React.FC<import("../components/header/Component").HeaderProps>;
|
package/cssm/typings.d.ts
CHANGED
|
@@ -5,7 +5,7 @@ import { ContentDesktop } from '../components/content/Component.desktop';
|
|
|
5
5
|
import { type ControlsProps } from '../components/controls';
|
|
6
6
|
import { FooterDesktop } from '../components/footer/Component.desktop';
|
|
7
7
|
import { type HeaderProps } from '../components/header/Component';
|
|
8
|
-
export
|
|
8
|
+
export type SidePanelDesktopProps = BaseModalProps & Pick<DrawerProps, 'placement' | 'nativeScrollbar' | 'contentTransitionProps'> & {
|
|
9
9
|
/**
|
|
10
10
|
* Ширина модального окна
|
|
11
11
|
* @default "s"
|
|
@@ -22,26 +22,26 @@ declare const SidePanelDesktopComponent: React.ForwardRefExoticComponent<BaseMod
|
|
|
22
22
|
* Ширина модального окна
|
|
23
23
|
* @default "s"
|
|
24
24
|
*/
|
|
25
|
-
size?: "s" | 500
|
|
25
|
+
size?: "s" | 500;
|
|
26
26
|
/**
|
|
27
27
|
* Управление наличием закрывающего крестика
|
|
28
28
|
* @default false
|
|
29
29
|
*/
|
|
30
|
-
hasCloser?: boolean
|
|
30
|
+
hasCloser?: boolean;
|
|
31
31
|
} & React.RefAttributes<HTMLDivElement>>;
|
|
32
|
-
declare const HeaderDesktop: React.FC<Omit<HeaderProps, "
|
|
32
|
+
declare const HeaderDesktop: React.FC<Omit<HeaderProps, "titleSize" | "subtitle">>;
|
|
33
33
|
declare const ControlsDesktop: React.FC<Omit<ControlsProps, "mobileLayout">>;
|
|
34
34
|
declare const SidePanelDesktop: React.ForwardRefExoticComponent<BaseModalProps & Pick<DrawerProps, "placement" | "nativeScrollbar" | "contentTransitionProps"> & {
|
|
35
35
|
/**
|
|
36
36
|
* Ширина модального окна
|
|
37
37
|
* @default "s"
|
|
38
38
|
*/
|
|
39
|
-
size?: "s" | 500
|
|
39
|
+
size?: "s" | 500;
|
|
40
40
|
/**
|
|
41
41
|
* Управление наличием закрывающего крестика
|
|
42
42
|
* @default false
|
|
43
43
|
*/
|
|
44
|
-
hasCloser?: boolean
|
|
44
|
+
hasCloser?: boolean;
|
|
45
45
|
} & React.RefAttributes<HTMLDivElement>> & {
|
|
46
46
|
Content: React.FC<import("../components/content/Component.desktop").ContentDesktopProps>;
|
|
47
47
|
Header: React.FC<Omit<HeaderProps, "subtitle" | "titleSize">>;
|
|
@@ -45,7 +45,9 @@ var SidePanelDesktopComponent = React.forwardRef(function (_a, ref) {
|
|
|
45
45
|
exitActive: exitCn,
|
|
46
46
|
exitDone: exitCn,
|
|
47
47
|
} }, contentTransitionProps) }), React__default.default.Children.map(children, function (child) {
|
|
48
|
-
return React.isValidElement(child)
|
|
48
|
+
return React.isValidElement(child)
|
|
49
|
+
? React.cloneElement(child, { size: size })
|
|
50
|
+
: child;
|
|
49
51
|
}))); };
|
|
50
52
|
var renderWithContext = function () { return (React__default.default.createElement(ResponsiveContext.ResponsiveContext.Provider, { value: contextValue }, renderContent())); };
|
|
51
53
|
return responsiveContext ? renderContent() : renderWithContext();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.desktop.js","sources":["../src/desktop/Component.desktop.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef, isValidElement, useContext, useRef } from 'react';\nimport mergeRefs from 'react-merge-refs';\nimport cn from 'classnames';\n\nimport { type BaseModalProps } from '@alfalab/core-components-base-modal';\nimport { Drawer, type DrawerProps } from '@alfalab/core-components-drawer';\n\nimport { ContentDesktop } from '../components/content/Component.desktop';\nimport { Controls, type ControlsProps } from '../components/controls';\nimport { FooterDesktop } from '../components/footer/Component.desktop';\nimport { Header, type HeaderProps } from '../components/header/Component';\nimport { SIZE_TO_CLASSNAME_MAP } from '../consts';\nimport { ResponsiveContext } from '../ResponsiveContext';\nimport { type TResponsiveModalContext } from '../typings';\n\nimport styles from './desktop.module.css';\nimport transitions from './transitions.desktop.module.css';\n\nexport type SidePanelDesktopProps = BaseModalProps &\n Pick<DrawerProps, 'placement' | 'nativeScrollbar' | 'contentTransitionProps'> & {\n /**\n * Ширина модального окна\n * @default \"s\"\n */\n size?: 's' | 500;\n\n /**\n * Управление наличием закрывающего крестика\n * @default false\n */\n hasCloser?: boolean;\n };\n\nconst SidePanelDesktopComponent = forwardRef<HTMLDivElement, SidePanelDesktopProps>(\n (\n {\n size = 500,\n children,\n className,\n wrapperClassName,\n contentTransitionProps = {},\n backdropProps,\n placement = 'right',\n dataTestId,\n ...restProps\n },\n ref,\n ) => {\n const responsiveContext = useContext(ResponsiveContext);\n const modalRef = useRef<HTMLElement>(null);\n\n const enterCn = cn({\n [transitions.appearRight]: placement === 'right',\n [transitions.appearLeft]: placement === 'left',\n });\n\n const exitCn = cn({\n [transitions.exitActiveRight]: placement === 'right',\n [transitions.exitActiveLeft]: placement === 'left',\n });\n\n const contextValue = React.useMemo<TResponsiveModalContext>(\n () => ({ size, view: 'desktop', dataTestId }),\n [size, dataTestId],\n );\n\n const renderContent = () => (\n <Drawer\n {...restProps}\n dataTestId={dataTestId}\n ref={mergeRefs([ref, modalRef])}\n placement={placement}\n wrapperClassName={wrapperClassName}\n className={cn(className, styles[SIZE_TO_CLASSNAME_MAP[size]], styles.hidden)}\n backdropProps={backdropProps}\n contentTransitionProps={{\n classNames: {\n appear: enterCn,\n enter: enterCn,\n appearActive: transitions.enterActive,\n enterActive: transitions.enterActive,\n exit: transitions.exit,\n exitActive: exitCn,\n exitDone: exitCn,\n },\n ...contentTransitionProps,\n }}\n >\n {React.Children.map(children, (child) =>\n isValidElement(child)
|
|
1
|
+
{"version":3,"file":"Component.desktop.js","sources":["../src/desktop/Component.desktop.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef, isValidElement, useContext, useRef } from 'react';\nimport mergeRefs from 'react-merge-refs';\nimport cn from 'classnames';\n\nimport { type BaseModalProps } from '@alfalab/core-components-base-modal';\nimport { Drawer, type DrawerProps } from '@alfalab/core-components-drawer';\n\nimport { ContentDesktop } from '../components/content/Component.desktop';\nimport { Controls, type ControlsProps } from '../components/controls';\nimport { FooterDesktop } from '../components/footer/Component.desktop';\nimport { Header, type HeaderProps } from '../components/header/Component';\nimport { SIZE_TO_CLASSNAME_MAP } from '../consts';\nimport { ResponsiveContext } from '../ResponsiveContext';\nimport { type TResponsiveModalContext } from '../typings';\n\nimport styles from './desktop.module.css';\nimport transitions from './transitions.desktop.module.css';\n\nexport type SidePanelDesktopProps = BaseModalProps &\n Pick<DrawerProps, 'placement' | 'nativeScrollbar' | 'contentTransitionProps'> & {\n /**\n * Ширина модального окна\n * @default \"s\"\n */\n size?: 's' | 500;\n\n /**\n * Управление наличием закрывающего крестика\n * @default false\n */\n hasCloser?: boolean;\n };\n\nconst SidePanelDesktopComponent = forwardRef<HTMLDivElement, SidePanelDesktopProps>(\n (\n {\n size = 500,\n children,\n className,\n wrapperClassName,\n contentTransitionProps = {},\n backdropProps,\n placement = 'right',\n dataTestId,\n ...restProps\n },\n ref,\n ) => {\n const responsiveContext = useContext(ResponsiveContext);\n const modalRef = useRef<HTMLElement>(null);\n\n const enterCn = cn({\n [transitions.appearRight]: placement === 'right',\n [transitions.appearLeft]: placement === 'left',\n });\n\n const exitCn = cn({\n [transitions.exitActiveRight]: placement === 'right',\n [transitions.exitActiveLeft]: placement === 'left',\n });\n\n const contextValue = React.useMemo<TResponsiveModalContext>(\n () => ({ size, view: 'desktop', dataTestId }),\n [size, dataTestId],\n );\n\n const renderContent = () => (\n <Drawer\n {...restProps}\n dataTestId={dataTestId}\n ref={mergeRefs([ref, modalRef])}\n placement={placement}\n wrapperClassName={wrapperClassName}\n className={cn(className, styles[SIZE_TO_CLASSNAME_MAP[size]], styles.hidden)}\n backdropProps={backdropProps}\n contentTransitionProps={{\n classNames: {\n appear: enterCn,\n enter: enterCn,\n appearActive: transitions.enterActive,\n enterActive: transitions.enterActive,\n exit: transitions.exit,\n exitActive: exitCn,\n exitDone: exitCn,\n },\n ...contentTransitionProps,\n }}\n >\n {React.Children.map(children, (child) =>\n isValidElement<{ size: unknown }>(child)\n ? cloneElement(child, { size })\n : child,\n )}\n </Drawer>\n );\n\n const renderWithContext = () => (\n <ResponsiveContext.Provider value={contextValue}>\n {renderContent()}\n </ResponsiveContext.Provider>\n );\n\n return responsiveContext ? renderContent() : renderWithContext();\n },\n);\n\nconst HeaderDesktop = Header as React.FC<Omit<HeaderProps, 'titleSize' | 'subtitle'>>;\nconst ControlsDesktop = Controls as React.FC<Omit<ControlsProps, 'mobileLayout'>>;\n\nconst SidePanelDesktop = Object.assign(SidePanelDesktopComponent, {\n Content: ContentDesktop,\n Header: HeaderDesktop,\n Footer: FooterDesktop,\n Controls: ControlsDesktop,\n});\n\nexport {\n SidePanelDesktop,\n SidePanelDesktopComponent as SidePanelComponentDesktop,\n ContentDesktop,\n HeaderDesktop,\n FooterDesktop,\n ControlsDesktop,\n};\n"],"names":["forwardRef","__rest","useContext","ResponsiveContext","useRef","cn","transitions","React","Drawer","__assign","mergeRefs","styles","SIZE_TO_CLASSNAME_MAP","isValidElement","cloneElement","Header","Controls","ContentDesktop","FooterDesktop"],"mappings":"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"}
|
package/desktop/desktop.css
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
:root {
|
|
2
2
|
--side-panel-s-width: 500px;
|
|
3
3
|
}
|
|
4
|
-
.side-panel__size-
|
|
4
|
+
.side-panel__size-500_w7uvm.side-panel__size-500_w7uvm {
|
|
5
5
|
width: var(--side-panel-s-width);
|
|
6
6
|
}
|
|
7
|
-
.side-
|
|
7
|
+
.side-panel__hidden_w7uvm {
|
|
8
8
|
overflow-x: hidden;
|
|
9
9
|
}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
require('./desktop.css');
|
|
4
4
|
|
|
5
|
-
var styles = {"size-500":"side-panel__size-
|
|
5
|
+
var styles = {"size-500":"side-panel__size-500_w7uvm","hidden":"side-panel__hidden_w7uvm"};
|
|
6
6
|
|
|
7
7
|
module.exports = styles;
|
|
8
8
|
//# sourceMappingURL=desktop.module.css.js.map
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
.side-
|
|
1
|
+
.side-panel__enterRight_1izc2 {
|
|
2
2
|
opacity: 0;
|
|
3
3
|
transform: translateX(15px);
|
|
4
4
|
}
|
|
5
5
|
|
|
6
|
-
.side-
|
|
6
|
+
.side-panel__enterLeft_1izc2 {
|
|
7
7
|
opacity: 0;
|
|
8
8
|
transform: translateX(-15px);
|
|
9
9
|
}
|
|
10
10
|
|
|
11
|
-
.side-
|
|
11
|
+
.side-panel__enterActive_1izc2 {
|
|
12
12
|
opacity: 1;
|
|
13
13
|
transform: translateX(0);
|
|
14
14
|
transition:
|
|
@@ -16,12 +16,12 @@
|
|
|
16
16
|
transform 200ms ease-in;
|
|
17
17
|
}
|
|
18
18
|
|
|
19
|
-
.side-
|
|
19
|
+
.side-panel__exit_1izc2 {
|
|
20
20
|
opacity: 1;
|
|
21
21
|
transform: translateX(0);
|
|
22
22
|
}
|
|
23
23
|
|
|
24
|
-
.side-
|
|
24
|
+
.side-panel__exitActiveRight_1izc2 {
|
|
25
25
|
opacity: 0;
|
|
26
26
|
transition:
|
|
27
27
|
opacity 200ms ease-out,
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
transform: translateX(15px);
|
|
30
30
|
}
|
|
31
31
|
|
|
32
|
-
.side-
|
|
32
|
+
.side-panel__exitActiveLeft_1izc2 {
|
|
33
33
|
opacity: 0;
|
|
34
34
|
transition:
|
|
35
35
|
opacity 200ms ease-out,
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
require('./transitions.desktop.css');
|
|
4
4
|
|
|
5
|
-
var transitions = {"enterActive":"side-
|
|
5
|
+
var transitions = {"enterActive":"side-panel__enterActive_1izc2","exit":"side-panel__exit_1izc2","exitActiveRight":"side-panel__exitActiveRight_1izc2","exitActiveLeft":"side-panel__exitActiveLeft_1izc2"};
|
|
6
6
|
|
|
7
7
|
module.exports = transitions;
|
|
8
8
|
//# sourceMappingURL=transitions.desktop.module.css.js.map
|
|
@@ -3,7 +3,7 @@ import { type BaseModalProps } from '@alfalab/core-components-base-modal/esm';
|
|
|
3
3
|
import { type DrawerProps } from '@alfalab/core-components-drawer/esm';
|
|
4
4
|
import { Controls } from './components/controls';
|
|
5
5
|
import { Header } from './components/header/Component';
|
|
6
|
-
export
|
|
6
|
+
export type SidePanelResponsiveProps = BaseModalProps & Pick<DrawerProps, 'contentTransitionProps' | 'placement' | 'nativeScrollbar'> & {
|
|
7
7
|
/**
|
|
8
8
|
* Ширина модального окна
|
|
9
9
|
* @default "s"
|
|
@@ -34,26 +34,26 @@ declare const SidePanelResponsiveComponent: React.ForwardRefExoticComponent<Base
|
|
|
34
34
|
* Ширина модального окна
|
|
35
35
|
* @default "s"
|
|
36
36
|
*/
|
|
37
|
-
size?: "s" | 500
|
|
37
|
+
size?: "s" | 500;
|
|
38
38
|
/**
|
|
39
39
|
* Управление наличием закрывающего крестика
|
|
40
40
|
* @default false
|
|
41
41
|
*/
|
|
42
|
-
hasCloser?: boolean
|
|
42
|
+
hasCloser?: boolean;
|
|
43
43
|
/**
|
|
44
44
|
* Контрольная точка, с нее начинается desktop версия
|
|
45
45
|
* @default 1024
|
|
46
46
|
*/
|
|
47
|
-
breakpoint?: number
|
|
47
|
+
breakpoint?: number;
|
|
48
48
|
/**
|
|
49
49
|
* Версия, которая будет использоваться при серверном рендеринге
|
|
50
50
|
*/
|
|
51
|
-
client?: "desktop" | "mobile"
|
|
51
|
+
client?: "desktop" | "mobile";
|
|
52
52
|
/**
|
|
53
53
|
* Значение по-умолчанию для хука useMatchMedia
|
|
54
54
|
* @deprecated Используйте client
|
|
55
55
|
*/
|
|
56
|
-
defaultMatchMediaValue?: boolean | (() => boolean)
|
|
56
|
+
defaultMatchMediaValue?: boolean | (() => boolean);
|
|
57
57
|
} & React.RefAttributes<HTMLDivElement>>;
|
|
58
58
|
declare const ContentResponsive: React.FC<import("./components/content/Component").ContentProps> | React.FC<import("./components/content/Component.desktop").ContentDesktopProps>;
|
|
59
59
|
declare const FooterResponsive: React.FC<import("./components/footer/Component").FooterProps> | React.FC<import("./components/footer/Component.desktop").FooterDesktopProps>;
|
|
@@ -63,26 +63,26 @@ declare const SidePanelResponsive: React.ForwardRefExoticComponent<BaseModalProp
|
|
|
63
63
|
* Ширина модального окна
|
|
64
64
|
* @default "s"
|
|
65
65
|
*/
|
|
66
|
-
size?: "s" | 500
|
|
66
|
+
size?: "s" | 500;
|
|
67
67
|
/**
|
|
68
68
|
* Управление наличием закрывающего крестика
|
|
69
69
|
* @default false
|
|
70
70
|
*/
|
|
71
|
-
hasCloser?: boolean
|
|
71
|
+
hasCloser?: boolean;
|
|
72
72
|
/**
|
|
73
73
|
* Контрольная точка, с нее начинается desktop версия
|
|
74
74
|
* @default 1024
|
|
75
75
|
*/
|
|
76
|
-
breakpoint?: number
|
|
76
|
+
breakpoint?: number;
|
|
77
77
|
/**
|
|
78
78
|
* Версия, которая будет использоваться при серверном рендеринге
|
|
79
79
|
*/
|
|
80
|
-
client?: "desktop" | "mobile"
|
|
80
|
+
client?: "desktop" | "mobile";
|
|
81
81
|
/**
|
|
82
82
|
* Значение по-умолчанию для хука useMatchMedia
|
|
83
83
|
* @deprecated Используйте client
|
|
84
84
|
*/
|
|
85
|
-
defaultMatchMediaValue?: boolean | (() => boolean)
|
|
85
|
+
defaultMatchMediaValue?: boolean | (() => boolean);
|
|
86
86
|
} & React.RefAttributes<HTMLDivElement>> & {
|
|
87
87
|
Header: React.FC<import("./components/header/Component").HeaderProps>;
|
|
88
88
|
Controls: React.FC<import("./components/controls").ControlsProps>;
|
package/esm/Context.d.ts
CHANGED
|
@@ -8,9 +8,9 @@
|
|
|
8
8
|
:root {
|
|
9
9
|
--side-panel-s-content-paddings: var(--gap-40) var(--gap-40) var(--gap-0);
|
|
10
10
|
}
|
|
11
|
-
.side-panel__size-
|
|
11
|
+
.side-panel__size-500_dm43t {
|
|
12
12
|
padding: var(--side-panel-s-content-paddings);
|
|
13
13
|
}
|
|
14
|
-
.side-panel__size-
|
|
14
|
+
.side-panel__size-500_dm43t:last-child {
|
|
15
15
|
padding-bottom: var(--gap-32);
|
|
16
16
|
}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
:root {
|
|
2
2
|
--gap-0: 0px;
|
|
3
3
|
}
|
|
4
|
-
.side-
|
|
4
|
+
.side-panel__content_vyzcj {
|
|
5
5
|
position: relative;
|
|
6
6
|
box-sizing: border-box;
|
|
7
7
|
width: 100%;
|
|
8
8
|
z-index: 0;
|
|
9
9
|
}
|
|
10
|
-
.side-
|
|
10
|
+
.side-panel__content_vyzcj.side-panel__withHeader_vyzcj {
|
|
11
11
|
padding-top: var(--gap-0);
|
|
12
12
|
}
|
|
13
|
-
.side-
|
|
13
|
+
.side-panel__flex_vyzcj {
|
|
14
14
|
flex: 1 1 auto;
|
|
15
15
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import './index.css';
|
|
2
2
|
|
|
3
|
-
var styles = {"content":"side-
|
|
3
|
+
var styles = {"content":"side-panel__content_vyzcj","withHeader":"side-panel__withHeader_vyzcj","flex":"side-panel__flex_vyzcj"};
|
|
4
4
|
|
|
5
5
|
export { styles as default };
|
|
6
6
|
//# sourceMappingURL=index.module.css.js.map
|
|
@@ -3,9 +3,9 @@
|
|
|
3
3
|
--gap-0: 0px;
|
|
4
4
|
--gap-16: var(--gap-m);
|
|
5
5
|
}
|
|
6
|
-
.side-
|
|
6
|
+
.side-panel__content_120x4 {
|
|
7
7
|
padding: var(--gap-16) var(--gap-16) var(--gap-0);
|
|
8
8
|
}
|
|
9
|
-
.side-
|
|
9
|
+
.side-panel__content_120x4:last-child {
|
|
10
10
|
padding-bottom: var(--gap-16);
|
|
11
11
|
}
|
|
@@ -8,9 +8,9 @@
|
|
|
8
8
|
:root {
|
|
9
9
|
--side-panel-s-footer-paddings: var(--gap-24) var(--gap-40) var(--gap-40);
|
|
10
10
|
}
|
|
11
|
-
.side-
|
|
11
|
+
.side-panel__sticky_wk41v {
|
|
12
12
|
bottom: var(--gap-0);
|
|
13
13
|
}
|
|
14
|
-
.side-panel__size-
|
|
14
|
+
.side-panel__size-500_wk41v {
|
|
15
15
|
padding: var(--side-panel-s-footer-paddings);
|
|
16
16
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import './desktop.css';
|
|
2
2
|
|
|
3
|
-
var styles = {"sticky":"side-
|
|
3
|
+
var styles = {"sticky":"side-panel__sticky_wk41v","size-500":"side-panel__size-500_wk41v"};
|
|
4
4
|
|
|
5
5
|
export { styles as default };
|
|
6
6
|
//# sourceMappingURL=desktop.module.css.js.map
|
|
@@ -7,19 +7,19 @@
|
|
|
7
7
|
--side-panel-footer-highlight-background: var(--color-light-modal-bg-primary);
|
|
8
8
|
--side-panel-footer-highlight-box-shadow: 0 -1px 0 0 var(--color-light-neutral-300);
|
|
9
9
|
}
|
|
10
|
-
.side-
|
|
10
|
+
.side-panel__footer_obuo9 {
|
|
11
11
|
width: 100%;
|
|
12
12
|
box-sizing: border-box;
|
|
13
13
|
transition:
|
|
14
14
|
box-shadow 0.2s ease,
|
|
15
15
|
background 0.2s ease;
|
|
16
16
|
}
|
|
17
|
-
.side-
|
|
17
|
+
.side-panel__sticky_obuo9 {
|
|
18
18
|
background: var(--side-panel-footer-background);
|
|
19
19
|
position: sticky;
|
|
20
20
|
z-index: 1;
|
|
21
21
|
}
|
|
22
|
-
.side-
|
|
22
|
+
.side-panel__highlighted_obuo9 {
|
|
23
23
|
background: var(--side-panel-footer-highlight-background);
|
|
24
24
|
box-shadow: var(--side-panel-footer-highlight-box-shadow);
|
|
25
25
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import './index.css';
|
|
2
2
|
|
|
3
|
-
var styles = {"footer":"side-
|
|
3
|
+
var styles = {"footer":"side-panel__footer_obuo9","sticky":"side-panel__sticky_obuo9","highlighted":"side-panel__highlighted_obuo9"};
|
|
4
4
|
|
|
5
5
|
export { styles as default };
|
|
6
6
|
//# sourceMappingURL=index.module.css.js.map
|