@alfalab/core-components-navigation-bar-private 2.0.4 → 2.0.5-alfasans
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.js.map +1 -1
- package/components/back-arrow-addon/Component.d.ts +1 -1
- package/components/back-arrow-addon/default.css +7 -7
- package/components/back-arrow-addon/default.module.css.js +1 -1
- package/components/back-arrow-addon/index.css +8 -8
- package/components/back-arrow-addon/index.module.css.js +1 -1
- package/components/back-arrow-addon/index.module.css.js.map +1 -1
- package/components/back-arrow-addon/inverted.css +7 -7
- package/components/back-arrow-addon/inverted.module.css.js +1 -1
- package/components/closer/default.css +2 -2
- package/components/closer/default.module.css.js +1 -1
- package/components/closer/index.css +4 -4
- package/components/closer/index.module.css.js +1 -1
- package/components/closer/index.module.css.js.map +1 -1
- package/components/closer/inverted.css +2 -2
- package/components/closer/inverted.module.css.js +1 -1
- package/cssm/Component.js.map +1 -1
- package/cssm/components/back-arrow-addon/Component.d.ts +1 -1
- package/cssm/index.module.css +7 -4
- package/cssm/types.d.ts +3 -3
- package/esm/Component.js.map +1 -1
- package/esm/components/back-arrow-addon/Component.d.ts +1 -1
- package/esm/components/back-arrow-addon/default.css +7 -7
- package/esm/components/back-arrow-addon/default.module.css.js +1 -1
- package/esm/components/back-arrow-addon/index.css +8 -8
- package/esm/components/back-arrow-addon/index.module.css.js +1 -1
- package/esm/components/back-arrow-addon/index.module.css.js.map +1 -1
- package/esm/components/back-arrow-addon/inverted.css +7 -7
- package/esm/components/back-arrow-addon/inverted.module.css.js +1 -1
- package/esm/components/closer/default.css +2 -2
- package/esm/components/closer/default.module.css.js +1 -1
- package/esm/components/closer/index.css +4 -4
- package/esm/components/closer/index.module.css.js +1 -1
- package/esm/components/closer/index.module.css.js.map +1 -1
- package/esm/components/closer/inverted.css +2 -2
- package/esm/components/closer/inverted.module.css.js +1 -1
- package/esm/index.css +33 -30
- package/esm/index.module.css.js +1 -1
- package/esm/index.module.css.js.map +1 -1
- package/esm/types.d.ts +3 -3
- package/index.css +33 -30
- package/index.module.css.js +1 -1
- package/index.module.css.js.map +1 -1
- package/modern/Component.js.map +1 -1
- package/modern/components/back-arrow-addon/Component.d.ts +1 -1
- package/modern/components/back-arrow-addon/default.css +7 -7
- package/modern/components/back-arrow-addon/default.module.css.js +1 -1
- package/modern/components/back-arrow-addon/index.css +8 -8
- package/modern/components/back-arrow-addon/index.module.css.js +1 -1
- package/modern/components/back-arrow-addon/index.module.css.js.map +1 -1
- package/modern/components/back-arrow-addon/inverted.css +7 -7
- package/modern/components/back-arrow-addon/inverted.module.css.js +1 -1
- package/modern/components/closer/default.css +2 -2
- package/modern/components/closer/default.module.css.js +1 -1
- package/modern/components/closer/index.css +4 -4
- package/modern/components/closer/index.module.css.js +1 -1
- package/modern/components/closer/index.module.css.js.map +1 -1
- package/modern/components/closer/inverted.css +2 -2
- package/modern/components/closer/inverted.module.css.js +1 -1
- package/modern/index.css +33 -30
- package/modern/index.module.css.js +1 -1
- package/modern/index.module.css.js.map +1 -1
- package/modern/types.d.ts +3 -3
- package/moderncssm/Component.js.map +1 -1
- package/moderncssm/components/back-arrow-addon/Component.d.ts +1 -1
- package/moderncssm/index.module.css +4 -2
- package/moderncssm/types.d.ts +3 -3
- package/package.json +7 -7
- package/src/components/back-arrow-addon/index.module.css +1 -1
- package/src/components/closer/index.module.css +1 -1
- package/src/index.module.css +1 -1
- package/src/vars.css +1 -1
- package/types.d.ts +3 -3
package/modern/index.css
CHANGED
|
@@ -10,37 +10,38 @@
|
|
|
10
10
|
--gap-12: var(--gap-s);
|
|
11
11
|
}
|
|
12
12
|
:root {
|
|
13
|
-
--font-family-
|
|
14
|
-
system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',
|
|
13
|
+
--font-family-alfasans:
|
|
14
|
+
'Alfa Interface Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',
|
|
15
|
+
Helvetica, sans-serif;
|
|
15
16
|
}
|
|
16
|
-
.navigation-bar-
|
|
17
|
+
.navigation-bar-private__header_1283p {
|
|
17
18
|
width: 100%;
|
|
18
19
|
box-sizing: border-box;
|
|
19
20
|
transition:
|
|
20
21
|
box-shadow 0.2s ease,
|
|
21
22
|
background 0.2s ease;
|
|
22
23
|
}
|
|
23
|
-
.navigation-bar-
|
|
24
|
+
.navigation-bar-private__header_1283p.navigation-bar-private__header_1283p.navigation-bar-private__backgroundImage_1283p {
|
|
24
25
|
background-repeat: no-repeat;
|
|
25
26
|
background-position: center;
|
|
26
27
|
background-size: cover;
|
|
27
28
|
}
|
|
28
|
-
.navigation-bar-
|
|
29
|
+
.navigation-bar-private__mainLine_1283p {
|
|
29
30
|
display: flex;
|
|
30
31
|
align-items: stretch;
|
|
31
32
|
justify-content: space-between;
|
|
32
33
|
z-index: 1;
|
|
33
34
|
background-color: inherit;
|
|
34
35
|
}
|
|
35
|
-
.navigation-bar-
|
|
36
|
+
.navigation-bar-private__mainLineSticky_1283p {
|
|
36
37
|
position: sticky;
|
|
37
38
|
top: var(--gap-0);
|
|
38
39
|
}
|
|
39
|
-
.navigation-bar-
|
|
40
|
+
.navigation-bar-private__mainLineWithImageBg_1283p {
|
|
40
41
|
background-color: transparent;
|
|
41
42
|
background-color: initial;
|
|
42
43
|
}
|
|
43
|
-
.navigation-bar-
|
|
44
|
+
.navigation-bar-private__content_1283p {
|
|
44
45
|
color: var(--color-light-text-primary);
|
|
45
46
|
display: flex;
|
|
46
47
|
flex-flow: column nowrap;
|
|
@@ -50,37 +51,39 @@
|
|
|
50
51
|
box-sizing: border-box;
|
|
51
52
|
min-height: 48px;
|
|
52
53
|
}
|
|
53
|
-
.navigation-bar-
|
|
54
|
-
.navigation-bar-
|
|
54
|
+
.navigation-bar-private__content_1283p.navigation-bar-private__withBothAddons_1283p,
|
|
55
|
+
.navigation-bar-private__content_1283p.navigation-bar-private__withCompactTitle_1283p {
|
|
55
56
|
font-size: 16px;
|
|
56
57
|
line-height: 20px;
|
|
57
58
|
font-weight: 500;
|
|
58
|
-
|
|
59
|
+
letter-spacing: -0.05px;
|
|
60
|
+
font-family: var(--font-family-alfasans);
|
|
59
61
|
align-self: center;
|
|
60
62
|
padding-top: var(--gap-4);
|
|
61
63
|
padding-bottom: var(--gap-4);
|
|
62
64
|
}
|
|
63
|
-
.navigation-bar-
|
|
64
|
-
.navigation-bar-
|
|
65
|
-
.navigation-bar-
|
|
66
|
-
.navigation-bar-
|
|
65
|
+
.navigation-bar-private__content_1283p.navigation-bar-private__withBothAddons_1283p > .navigation-bar-private__children_1283p,
|
|
66
|
+
.navigation-bar-private__content_1283p.navigation-bar-private__withCompactTitle_1283p > .navigation-bar-private__children_1283p,
|
|
67
|
+
.navigation-bar-private__content_1283p.navigation-bar-private__withBothAddons_1283p > .navigation-bar-private__title_1283p .navigation-bar-private__titleTextContent_1283p,
|
|
68
|
+
.navigation-bar-private__content_1283p.navigation-bar-private__withCompactTitle_1283p > .navigation-bar-private__title_1283p .navigation-bar-private__titleTextContent_1283p {
|
|
67
69
|
-webkit-line-clamp: 1;
|
|
68
70
|
word-break: break-all;
|
|
69
71
|
}
|
|
70
|
-
.navigation-bar-
|
|
72
|
+
.navigation-bar-private__content_1283p.navigation-bar-private__contentOnBotDesktop_1283p.navigation-bar-private__contentOnBotDesktop_1283p {
|
|
71
73
|
padding-top: var(--gap-12);
|
|
72
74
|
}
|
|
73
|
-
.navigation-bar-
|
|
75
|
+
.navigation-bar-private__content_1283p.navigation-bar-private__contentOnBotMobile_1283p.navigation-bar-private__contentOnBotMobile_1283p {
|
|
74
76
|
padding-top: var(--gap-12);
|
|
75
77
|
}
|
|
76
|
-
.navigation-bar-
|
|
78
|
+
.navigation-bar-private__title_1283p .navigation-bar-private__titleTextContent_1283p {
|
|
77
79
|
word-break: break-word;
|
|
78
80
|
}
|
|
79
|
-
.navigation-bar-
|
|
81
|
+
.navigation-bar-private__subtitle_1283p {
|
|
80
82
|
font-size: 14px;
|
|
81
83
|
line-height: 20px;
|
|
82
84
|
font-weight: 400;
|
|
83
|
-
|
|
85
|
+
letter-spacing: -0.08px;
|
|
86
|
+
font-family: var(--font-family-alfasans);
|
|
84
87
|
-webkit-line-clamp: 1;
|
|
85
88
|
display: -webkit-box;
|
|
86
89
|
-webkit-box-orient: vertical;
|
|
@@ -89,13 +92,13 @@
|
|
|
89
92
|
color: var(--color-light-text-secondary);
|
|
90
93
|
word-break: break-all;
|
|
91
94
|
}
|
|
92
|
-
.navigation-bar-
|
|
95
|
+
.navigation-bar-private__addonsWrapper_1283p {
|
|
93
96
|
display: flex;
|
|
94
97
|
}
|
|
95
|
-
.navigation-bar-
|
|
98
|
+
.navigation-bar-private__rightAddons_1283p {
|
|
96
99
|
margin-left: auto;
|
|
97
100
|
}
|
|
98
|
-
.navigation-bar-
|
|
101
|
+
.navigation-bar-private__addon_1283p {
|
|
99
102
|
min-width: 48px;
|
|
100
103
|
height: 48px;
|
|
101
104
|
display: flex;
|
|
@@ -104,23 +107,23 @@
|
|
|
104
107
|
flex-shrink: 0;
|
|
105
108
|
pointer-events: all;
|
|
106
109
|
}
|
|
107
|
-
.navigation-bar-
|
|
110
|
+
.navigation-bar-private__bottomAddons_1283p {
|
|
108
111
|
pointer-events: all;
|
|
109
112
|
}
|
|
110
|
-
.navigation-bar-
|
|
113
|
+
.navigation-bar-private__closer_1283p {
|
|
111
114
|
margin-left: auto;
|
|
112
115
|
}
|
|
113
|
-
.navigation-bar-
|
|
116
|
+
.navigation-bar-private__left_1283p {
|
|
114
117
|
text-align: left;
|
|
115
118
|
}
|
|
116
|
-
.navigation-bar-
|
|
119
|
+
.navigation-bar-private__center_1283p {
|
|
117
120
|
text-align: center;
|
|
118
121
|
}
|
|
119
|
-
.navigation-bar-
|
|
122
|
+
.navigation-bar-private__trim_1283p {
|
|
120
123
|
overflow: hidden;
|
|
121
124
|
}
|
|
122
|
-
.navigation-bar-
|
|
123
|
-
.navigation-bar-
|
|
125
|
+
.navigation-bar-private__trim_1283p .navigation-bar-private__title_1283p .navigation-bar-private__titleTextContent_1283p,
|
|
126
|
+
.navigation-bar-private__trim_1283p .navigation-bar-private__children_1283p {
|
|
124
127
|
-webkit-line-clamp: 2;
|
|
125
128
|
display: -webkit-box;
|
|
126
129
|
-webkit-box-orient: vertical;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import './index.css';
|
|
2
2
|
|
|
3
|
-
const styles = {"header":"navigation-bar-
|
|
3
|
+
const styles = {"header":"navigation-bar-private__header_1283p","backgroundImage":"navigation-bar-private__backgroundImage_1283p","mainLine":"navigation-bar-private__mainLine_1283p","mainLineSticky":"navigation-bar-private__mainLineSticky_1283p","mainLineWithImageBg":"navigation-bar-private__mainLineWithImageBg_1283p","content":"navigation-bar-private__content_1283p","withBothAddons":"navigation-bar-private__withBothAddons_1283p","withCompactTitle":"navigation-bar-private__withCompactTitle_1283p","children":"navigation-bar-private__children_1283p","title":"navigation-bar-private__title_1283p","titleTextContent":"navigation-bar-private__titleTextContent_1283p","contentOnBotDesktop":"navigation-bar-private__contentOnBotDesktop_1283p","contentOnBotMobile":"navigation-bar-private__contentOnBotMobile_1283p","subtitle":"navigation-bar-private__subtitle_1283p","addonsWrapper":"navigation-bar-private__addonsWrapper_1283p","rightAddons":"navigation-bar-private__rightAddons_1283p","addon":"navigation-bar-private__addon_1283p","bottomAddons":"navigation-bar-private__bottomAddons_1283p","closer":"navigation-bar-private__closer_1283p","left":"navigation-bar-private__left_1283p","center":"navigation-bar-private__center_1283p","trim":"navigation-bar-private__trim_1283p"};
|
|
4
4
|
|
|
5
5
|
export { styles as default };
|
|
6
6
|
//# sourceMappingURL=index.module.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/
|
|
1
|
+
{"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n\n.header {\n width: 100%;\n box-sizing: border-box;\n transition:\n box-shadow 0.2s ease,\n background 0.2s ease;\n\n &.header.backgroundImage {\n background-repeat: no-repeat;\n background-position: center;\n background-size: cover;\n }\n}\n\n.mainLine {\n display: flex;\n align-items: stretch;\n justify-content: space-between;\n z-index: 1;\n background-color: inherit;\n}\n\n.mainLineSticky {\n position: sticky;\n top: var(--gap-0);\n}\n\n.mainLineWithImageBg {\n background-color: initial;\n}\n\n.content {\n color: var(--color-light-text-primary);\n display: flex;\n flex-flow: column nowrap;\n justify-content: center;\n flex-grow: 1;\n align-self: baseline;\n box-sizing: border-box;\n min-height: 48px;\n\n &.withBothAddons,\n &.withCompactTitle {\n @mixin action_component;\n align-self: center;\n padding-top: var(--gap-4);\n padding-bottom: var(--gap-4);\n\n & > .children,\n & > .title .titleTextContent {\n -webkit-line-clamp: 1;\n word-break: break-all;\n }\n }\n\n &.contentOnBotDesktop.contentOnBotDesktop {\n padding-top: var(--gap-12);\n }\n\n &.contentOnBotMobile.contentOnBotMobile {\n padding-top: var(--gap-12);\n }\n}\n\n.title {\n & .titleTextContent {\n word-break: break-word;\n }\n}\n\n.subtitle {\n @mixin paragraph_primary_small;\n @mixin row_limit 1;\n\n color: var(--color-light-text-secondary);\n word-break: break-all;\n}\n\n.addonsWrapper {\n display: flex;\n}\n\n.rightAddons {\n margin-left: auto;\n}\n\n.addon {\n min-width: 48px;\n height: 48px;\n display: flex;\n justify-content: center;\n align-items: center;\n flex-shrink: 0;\n pointer-events: all;\n}\n\n.bottomAddons {\n pointer-events: all;\n}\n\n.closer {\n margin-left: auto;\n}\n\n.left {\n text-align: left;\n}\n\n.center {\n text-align: center;\n}\n\n.trim {\n overflow: hidden;\n\n & .title .titleTextContent,\n & .children {\n @mixin row_limit 2;\n }\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,QAAQ,CAAC,sCAAsC,CAAC,iBAAiB,CAAC,+CAA+C,CAAC,UAAU,CAAC,wCAAwC,CAAC,gBAAgB,CAAC,8CAA8C,CAAC,qBAAqB,CAAC,mDAAmD,CAAC,SAAS,CAAC,uCAAuC,CAAC,gBAAgB,CAAC,8CAA8C,CAAC,kBAAkB,CAAC,gDAAgD,CAAC,UAAU,CAAC,wCAAwC,CAAC,OAAO,CAAC,qCAAqC,CAAC,kBAAkB,CAAC,gDAAgD,CAAC,qBAAqB,CAAC,mDAAmD,CAAC,oBAAoB,CAAC,kDAAkD,CAAC,UAAU,CAAC,wCAAwC,CAAC,eAAe,CAAC,6CAA6C,CAAC,aAAa,CAAC,2CAA2C,CAAC,OAAO,CAAC,qCAAqC,CAAC,cAAc,CAAC,4CAA4C,CAAC,QAAQ,CAAC,sCAAsC,CAAC,MAAM,CAAC,oCAAoC,CAAC,QAAQ,CAAC,sCAAsC,CAAC,MAAM,CAAC,oCAAoC,CAAC;;;;"}
|
package/modern/types.d.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { type CSSProperties, type ElementType, type ReactNode, type RefObject } from 'react';
|
|
2
2
|
import { type BackArrowAddonProps } from './components/back-arrow-addon';
|
|
3
3
|
import { type CloserProps } from './components/closer';
|
|
4
|
-
export
|
|
5
|
-
export
|
|
4
|
+
export type ColorType = 'default' | 'inverted';
|
|
5
|
+
export type NavigationBarPrivateProps = {
|
|
6
6
|
/**
|
|
7
7
|
* Контент шапки
|
|
8
8
|
*/
|
|
@@ -134,7 +134,7 @@ export declare type NavigationBarPrivateProps = {
|
|
|
134
134
|
*/
|
|
135
135
|
colors?: ColorType;
|
|
136
136
|
};
|
|
137
|
-
export
|
|
137
|
+
export type ContentParams = {
|
|
138
138
|
extraClassName?: string;
|
|
139
139
|
wrapperRef?: RefObject<HTMLDivElement>;
|
|
140
140
|
style?: CSSProperties;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.js","sources":["../src/Component.tsx"],"sourcesContent":["/* eslint-disable complexity */\nimport React, { forwardRef, useEffect, useRef, useState } from 'react';\nimport mergeRefs from 'react-merge-refs';\nimport cn from 'classnames';\n\nimport { getDataTestId } from '@alfalab/core-components-shared';\nimport { useLayoutEffect_SAFE_FOR_SSR } from '@alfalab/hooks';\n\nimport { BackArrowAddon } from './components/back-arrow-addon';\nimport { Closer } from './components/closer';\nimport { type ContentParams, type NavigationBarPrivateProps } from './types';\n\nimport styles from './index.module.css';\n\nconst ADDONS_HEIGHT = 48;\n\nexport const NavigationBarPrivate = forwardRef<HTMLDivElement, NavigationBarPrivateProps>(\n (\n {\n addonClassName,\n className,\n contentClassName,\n closerClassName,\n leftAddons,\n rightAddons,\n bottomAddons,\n bottomAddonsClassName,\n children,\n align = 'left',\n trim = true,\n title,\n titleSize = 'default',\n subtitle,\n subtitleClassName,\n hasCloser,\n closerProps = {},\n hasBackButton,\n backButtonClassName,\n backButtonProps,\n dataTestId,\n imageUrl,\n closerIcon,\n onClose,\n view,\n scrollableParentRef,\n sticky,\n onBack,\n dataName,\n titleClassName,\n titleRef,\n colors = 'default',\n },\n ref,\n ) => {\n const [scrollTop, setScrollTop] = useState(0);\n const [titleMargin, setTitleMargin] = useState({ left: 0, right: 0 });\n const bottomContentRef = useRef<HTMLDivElement>(null);\n const headerRef = useRef<HTMLDivElement>(null);\n const mainLinePaddingTopRef = useRef<string>('0px');\n const leftAddonsRef = useRef<HTMLDivElement>(null);\n const rightAddonsRef = useRef<HTMLDivElement>(null);\n\n const isMobile = view === 'mobile';\n\n const compactTitle = isMobile && titleSize === 'compact';\n const hasLeftPart = Boolean(leftAddons || hasBackButton);\n const hasRightPart = Boolean(rightAddons || hasCloser);\n const hasContent = Boolean(title || children);\n const withAnimation = Boolean(isMobile && hasLeftPart && sticky && !compactTitle);\n const showContentOnTop = hasContent && (compactTitle || !hasLeftPart);\n const showContentOnBot = hasContent && !compactTitle && hasLeftPart;\n const showStaticContentOnTop = !withAnimation && showContentOnTop;\n const showStaticContentOnBot = !withAnimation && showContentOnBot;\n const showAnimatedContentOnTop =\n withAnimation && showContentOnBot && scrollTop > ADDONS_HEIGHT;\n const showAnimatedContentOnBot = withAnimation && showContentOnBot;\n const headerPaddingTop = mainLinePaddingTopRef.current;\n\n useLayoutEffect_SAFE_FOR_SSR(() => {\n if (align === 'center' && (showStaticContentOnTop || showAnimatedContentOnTop)) {\n const leftAddonsWidth = leftAddonsRef.current?.offsetWidth || 0;\n const rightAddonsWidth = rightAddonsRef.current?.offsetWidth || 0;\n\n const marginSize = Math.abs(rightAddonsWidth - leftAddonsWidth);\n const shouldAddLeftMargin = rightAddonsWidth - leftAddonsWidth > 0;\n\n setTitleMargin((prev) => {\n const newState = shouldAddLeftMargin\n ? { left: marginSize, right: 0 }\n : { left: 0, right: marginSize };\n\n const isStateChanged =\n prev.left !== newState.left || prev.right !== newState.right;\n\n return isStateChanged ? newState : prev;\n });\n }\n }, [\n align,\n showStaticContentOnTop,\n showAnimatedContentOnTop,\n leftAddons,\n rightAddons,\n hasBackButton,\n hasCloser,\n ]);\n\n useEffect(() => {\n const parent = scrollableParentRef?.current;\n\n const handleScroll = (ev: Event) => {\n const divElement = ev.target as HTMLDivElement;\n\n setScrollTop(divElement.scrollTop);\n };\n\n if (withAnimation && headerRef.current) {\n mainLinePaddingTopRef.current = getComputedStyle(headerRef.current).paddingTop;\n }\n\n if (withAnimation && parent) {\n parent.addEventListener('scroll', handleScroll);\n }\n\n return () => parent?.removeEventListener('scroll', handleScroll);\n }, [scrollableParentRef, withAnimation]);\n\n const renderBackButton = () => {\n let textOpacity = 1;\n\n if (withAnimation) {\n const height = hasContent ? ADDONS_HEIGHT : ADDONS_HEIGHT / 2;\n\n textOpacity = Math.max(0, 1 - scrollTop / height);\n } else if (compactTitle) {\n textOpacity = 0;\n }\n\n return (\n <div className={cn(styles.addon, backButtonClassName)}>\n <BackArrowAddon\n data-test-id={getDataTestId(dataTestId, 'back-button')}\n {...backButtonProps}\n colors={colors}\n textOpacity={textOpacity}\n view={view}\n onClick={onBack}\n />\n </div>\n );\n };\n\n const renderContent = (args: ContentParams = {}) => {\n const { extraClassName, wrapperRef, style, hidden, extraAlign } = args;\n\n return (\n <div\n style={{ ...style, visibility: hidden ? 'hidden' : 'visible' }}\n ref={wrapperRef}\n className={cn(\n styles.content,\n extraClassName,\n contentClassName,\n styles[extraAlign || align],\n {\n [styles.trim]: trim,\n [styles.withCompactTitle]: isMobile && compactTitle && hasContent,\n },\n )}\n aria-hidden={hidden}\n >\n {children && <div className={styles.children}>{children}</div>}\n {title && (\n <div\n className={cn(styles.title, titleClassName)}\n data-test-id={hidden ? undefined : getDataTestId(dataTestId, 'title')}\n ref={titleRef}\n >\n <div className={styles.titleTextContent}>{title}</div>\n </div>\n )}\n {compactTitle && subtitle && (\n <div\n className={cn(styles.subtitle, subtitleClassName)}\n data-test-id={getDataTestId(dataTestId, 'subtitle')}\n >\n {subtitle}\n </div>\n )}\n </div>\n );\n };\n\n const renderCloser = () => (\n <div className={cn(styles.addon, styles.closer, closerClassName)}>\n <Closer\n view={view}\n icon={closerIcon}\n colors={colors}\n dataTestId={getDataTestId(dataTestId, 'closer')}\n onClose={onClose}\n {...closerProps}\n />\n </div>\n );\n\n return (\n <div\n ref={mergeRefs([ref, headerRef])}\n className={cn(styles.header, className, { [styles.backgroundImage]: imageUrl })}\n data-test-id={getDataTestId(dataTestId)}\n style={{\n ...(imageUrl && { backgroundImage: `url(${imageUrl})` }),\n ...(withAnimation &&\n bottomContentRef.current && {\n top: -bottomContentRef.current.scrollHeight,\n }),\n }}\n data-name={dataName}\n >\n <div\n className={cn(styles.mainLine, {\n [styles.mainLineSticky]: withAnimation,\n [styles.mainLineWithImageBg]: imageUrl,\n })}\n style={{\n ...(withAnimation\n ? {\n marginTop: `-${headerPaddingTop}`,\n paddingTop: headerPaddingTop,\n }\n : null),\n }}\n >\n {hasLeftPart && (\n <div className={styles.addonsWrapper} ref={leftAddonsRef}>\n {hasBackButton && renderBackButton()}\n {leftAddons && (\n <div className={cn(styles.addon, addonClassName)}>{leftAddons}</div>\n )}\n </div>\n )}\n\n {showStaticContentOnTop &&\n renderContent({\n ...(align === 'center'\n ? {\n style: {\n marginLeft: titleMargin.left,\n marginRight: titleMargin.right,\n },\n }\n : null),\n })}\n\n {showAnimatedContentOnTop &&\n renderContent({\n extraClassName: styles.withBothAddons,\n style: {\n opacity: Math.min(1, (scrollTop - ADDONS_HEIGHT) / ADDONS_HEIGHT),\n ...(align === 'center'\n ? {\n marginLeft: titleMargin.left,\n marginRight: titleMargin.right,\n }\n : null),\n },\n extraAlign: 'center',\n })}\n\n {hasRightPart && (\n <div\n className={cn(styles.addonsWrapper, styles.rightAddons)}\n ref={rightAddonsRef}\n >\n {rightAddons && (\n <div className={cn(styles.addon, addonClassName)}>\n {rightAddons}\n </div>\n )}\n\n {hasCloser && renderCloser()}\n </div>\n )}\n </div>\n\n {showAnimatedContentOnBot &&\n renderContent({\n wrapperRef: bottomContentRef,\n extraClassName: styles.underAddons,\n style: { opacity: Math.max(0, 1 - scrollTop / ADDONS_HEIGHT) },\n hidden: scrollTop / ADDONS_HEIGHT > 1,\n extraAlign: 'left',\n })}\n\n {showStaticContentOnBot &&\n renderContent({\n extraClassName: cn({\n [styles.contentOnBotDesktop]: view === 'desktop',\n [styles.contentOnBotMobile]: isMobile,\n }),\n extraAlign: 'left',\n })}\n\n {bottomAddons && (\n <div className={cn(styles.bottomAddons, bottomAddonsClassName)}>\n {bottomAddons}\n </div>\n )}\n </div>\n );\n },\n);\n\nNavigationBarPrivate.displayName = 'NavigationBarPrivate';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Component.js","sources":["../src/Component.tsx"],"sourcesContent":["/* eslint-disable complexity */\nimport React, { forwardRef, useEffect, useRef, useState } from 'react';\nimport mergeRefs from 'react-merge-refs';\nimport cn from 'classnames';\n\nimport { getDataTestId } from '@alfalab/core-components-shared';\nimport { useLayoutEffect_SAFE_FOR_SSR } from '@alfalab/hooks';\n\nimport { BackArrowAddon } from './components/back-arrow-addon';\nimport { Closer } from './components/closer';\nimport { type ContentParams, type NavigationBarPrivateProps } from './types';\n\nimport styles from './index.module.css';\n\nconst ADDONS_HEIGHT = 48;\n\nexport const NavigationBarPrivate = forwardRef<HTMLDivElement, NavigationBarPrivateProps>(\n (\n {\n addonClassName,\n className,\n contentClassName,\n closerClassName,\n leftAddons,\n rightAddons,\n bottomAddons,\n bottomAddonsClassName,\n children,\n align = 'left',\n trim = true,\n title,\n titleSize = 'default',\n subtitle,\n subtitleClassName,\n hasCloser,\n closerProps = {},\n hasBackButton,\n backButtonClassName,\n backButtonProps,\n dataTestId,\n imageUrl,\n closerIcon,\n onClose,\n view,\n scrollableParentRef,\n sticky,\n onBack,\n dataName,\n titleClassName,\n titleRef,\n colors = 'default',\n },\n ref,\n ) => {\n const [scrollTop, setScrollTop] = useState(0);\n const [titleMargin, setTitleMargin] = useState({ left: 0, right: 0 });\n const bottomContentRef = useRef<HTMLDivElement>(null);\n const headerRef = useRef<HTMLDivElement>(null);\n const mainLinePaddingTopRef = useRef<string>('0px');\n const leftAddonsRef = useRef<HTMLDivElement>(null);\n const rightAddonsRef = useRef<HTMLDivElement>(null);\n\n const isMobile = view === 'mobile';\n\n const compactTitle = isMobile && titleSize === 'compact';\n const hasLeftPart = Boolean(leftAddons || hasBackButton);\n const hasRightPart = Boolean(rightAddons || hasCloser);\n const hasContent = Boolean(title || children);\n const withAnimation = Boolean(isMobile && hasLeftPart && sticky && !compactTitle);\n const showContentOnTop = hasContent && (compactTitle || !hasLeftPart);\n const showContentOnBot = hasContent && !compactTitle && hasLeftPart;\n const showStaticContentOnTop = !withAnimation && showContentOnTop;\n const showStaticContentOnBot = !withAnimation && showContentOnBot;\n const showAnimatedContentOnTop =\n withAnimation && showContentOnBot && scrollTop > ADDONS_HEIGHT;\n const showAnimatedContentOnBot = withAnimation && showContentOnBot;\n const headerPaddingTop = mainLinePaddingTopRef.current;\n\n useLayoutEffect_SAFE_FOR_SSR(() => {\n if (align === 'center' && (showStaticContentOnTop || showAnimatedContentOnTop)) {\n const leftAddonsWidth = leftAddonsRef.current?.offsetWidth || 0;\n const rightAddonsWidth = rightAddonsRef.current?.offsetWidth || 0;\n\n const marginSize = Math.abs(rightAddonsWidth - leftAddonsWidth);\n const shouldAddLeftMargin = rightAddonsWidth - leftAddonsWidth > 0;\n\n setTitleMargin((prev) => {\n const newState = shouldAddLeftMargin\n ? { left: marginSize, right: 0 }\n : { left: 0, right: marginSize };\n\n const isStateChanged =\n prev.left !== newState.left || prev.right !== newState.right;\n\n return isStateChanged ? newState : prev;\n });\n }\n }, [\n align,\n showStaticContentOnTop,\n showAnimatedContentOnTop,\n leftAddons,\n rightAddons,\n hasBackButton,\n hasCloser,\n ]);\n\n useEffect(() => {\n const parent = scrollableParentRef?.current;\n\n const handleScroll = (ev: Event) => {\n const divElement = ev.target as HTMLDivElement;\n\n setScrollTop(divElement.scrollTop);\n };\n\n if (withAnimation && headerRef.current) {\n mainLinePaddingTopRef.current = getComputedStyle(headerRef.current).paddingTop;\n }\n\n if (withAnimation && parent) {\n parent.addEventListener('scroll', handleScroll);\n }\n\n return () => parent?.removeEventListener('scroll', handleScroll);\n }, [scrollableParentRef, withAnimation]);\n\n const renderBackButton = () => {\n let textOpacity = 1;\n\n if (withAnimation) {\n const height = hasContent ? ADDONS_HEIGHT : ADDONS_HEIGHT / 2;\n\n textOpacity = Math.max(0, 1 - scrollTop / height);\n } else if (compactTitle) {\n textOpacity = 0;\n }\n\n return (\n <div className={cn(styles.addon, backButtonClassName)}>\n <BackArrowAddon\n data-test-id={getDataTestId(dataTestId, 'back-button')}\n {...backButtonProps}\n colors={colors}\n textOpacity={textOpacity}\n view={view}\n onClick={onBack}\n />\n </div>\n );\n };\n\n const renderContent = (args: ContentParams = {}) => {\n const { extraClassName, wrapperRef, style, hidden, extraAlign } = args;\n\n return (\n <div\n style={{ ...style, visibility: hidden ? 'hidden' : 'visible' }}\n ref={wrapperRef}\n className={cn(\n styles.content,\n extraClassName,\n contentClassName,\n styles[extraAlign || align],\n {\n [styles.trim]: trim,\n [styles.withCompactTitle]: isMobile && compactTitle && hasContent,\n },\n )}\n aria-hidden={hidden}\n >\n {children && <div className={styles.children}>{children}</div>}\n {title && (\n <div\n className={cn(styles.title, titleClassName)}\n data-test-id={hidden ? undefined : getDataTestId(dataTestId, 'title')}\n ref={titleRef}\n >\n <div className={styles.titleTextContent}>{title}</div>\n </div>\n )}\n {compactTitle && subtitle && (\n <div\n className={cn(styles.subtitle, subtitleClassName)}\n data-test-id={getDataTestId(dataTestId, 'subtitle')}\n >\n {subtitle}\n </div>\n )}\n </div>\n );\n };\n\n const renderCloser = () => (\n <div className={cn(styles.addon, styles.closer, closerClassName)}>\n <Closer\n view={view}\n icon={closerIcon}\n colors={colors}\n dataTestId={getDataTestId(dataTestId, 'closer')}\n onClose={onClose}\n {...closerProps}\n />\n </div>\n );\n\n return (\n <div\n ref={mergeRefs([ref, headerRef])}\n className={cn(styles.header, className, { [styles.backgroundImage]: imageUrl })}\n data-test-id={getDataTestId(dataTestId)}\n style={{\n ...(imageUrl && { backgroundImage: `url(${imageUrl})` }),\n ...(withAnimation &&\n bottomContentRef.current && {\n top: -bottomContentRef.current.scrollHeight,\n }),\n }}\n data-name={dataName}\n >\n <div\n className={cn(styles.mainLine, {\n [styles.mainLineSticky]: withAnimation,\n [styles.mainLineWithImageBg]: imageUrl,\n })}\n style={{\n ...(withAnimation\n ? {\n marginTop: `-${headerPaddingTop}`,\n paddingTop: headerPaddingTop,\n }\n : null),\n }}\n >\n {hasLeftPart && (\n <div className={styles.addonsWrapper} ref={leftAddonsRef}>\n {hasBackButton && renderBackButton()}\n {leftAddons && (\n <div className={cn(styles.addon, addonClassName)}>{leftAddons}</div>\n )}\n </div>\n )}\n\n {showStaticContentOnTop &&\n renderContent({\n ...(align === 'center'\n ? {\n style: {\n marginLeft: titleMargin.left,\n marginRight: titleMargin.right,\n },\n }\n : null),\n })}\n\n {showAnimatedContentOnTop &&\n renderContent({\n extraClassName: styles.withBothAddons,\n style: {\n opacity: Math.min(1, (scrollTop - ADDONS_HEIGHT) / ADDONS_HEIGHT),\n ...(align === 'center'\n ? {\n marginLeft: titleMargin.left,\n marginRight: titleMargin.right,\n }\n : null),\n },\n extraAlign: 'center',\n })}\n\n {hasRightPart && (\n <div\n className={cn(styles.addonsWrapper, styles.rightAddons)}\n ref={rightAddonsRef}\n >\n {rightAddons && (\n <div className={cn(styles.addon, addonClassName)}>\n {rightAddons}\n </div>\n )}\n\n {hasCloser && renderCloser()}\n </div>\n )}\n </div>\n\n {showAnimatedContentOnBot &&\n renderContent({\n wrapperRef: bottomContentRef,\n extraClassName: styles.underAddons,\n style: { opacity: Math.max(0, 1 - scrollTop / ADDONS_HEIGHT) },\n hidden: scrollTop / ADDONS_HEIGHT > 1,\n extraAlign: 'left',\n })}\n\n {showStaticContentOnBot &&\n renderContent({\n extraClassName: cn({\n [styles.contentOnBotDesktop]: view === 'desktop',\n [styles.contentOnBotMobile]: isMobile,\n }),\n extraAlign: 'left',\n })}\n\n {bottomAddons && (\n <div className={cn(styles.bottomAddons, bottomAddonsClassName)}>\n {bottomAddons}\n </div>\n )}\n </div>\n );\n },\n);\n\nNavigationBarPrivate.displayName = 'NavigationBarPrivate';\n"],"names":[],"mappings":"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"}
|
|
@@ -48,7 +48,8 @@
|
|
|
48
48
|
font-size: 16px;
|
|
49
49
|
line-height: 20px;
|
|
50
50
|
font-weight: 500;
|
|
51
|
-
|
|
51
|
+
letter-spacing: -0.05px;
|
|
52
|
+
font-family: var(--font-family-alfasans);
|
|
52
53
|
align-self: center;
|
|
53
54
|
padding-top: var(--gap-4);
|
|
54
55
|
padding-bottom: var(--gap-4);
|
|
@@ -78,7 +79,8 @@
|
|
|
78
79
|
font-size: 14px;
|
|
79
80
|
line-height: 20px;
|
|
80
81
|
font-weight: 400;
|
|
81
|
-
|
|
82
|
+
letter-spacing: -0.08px;
|
|
83
|
+
font-family: var(--font-family-alfasans);
|
|
82
84
|
-webkit-line-clamp: 1;
|
|
83
85
|
display: -webkit-box;
|
|
84
86
|
-webkit-box-orient: vertical;
|
package/moderncssm/types.d.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { type CSSProperties, type ElementType, type ReactNode, type RefObject } from 'react';
|
|
2
2
|
import { type BackArrowAddonProps } from './components/back-arrow-addon';
|
|
3
3
|
import { type CloserProps } from './components/closer';
|
|
4
|
-
export
|
|
5
|
-
export
|
|
4
|
+
export type ColorType = 'default' | 'inverted';
|
|
5
|
+
export type NavigationBarPrivateProps = {
|
|
6
6
|
/**
|
|
7
7
|
* Контент шапки
|
|
8
8
|
*/
|
|
@@ -134,7 +134,7 @@ export declare type NavigationBarPrivateProps = {
|
|
|
134
134
|
*/
|
|
135
135
|
colors?: ColorType;
|
|
136
136
|
};
|
|
137
|
-
export
|
|
137
|
+
export type ContentParams = {
|
|
138
138
|
extraClassName?: string;
|
|
139
139
|
wrapperRef?: RefObject<HTMLDivElement>;
|
|
140
140
|
style?: CSSProperties;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@alfalab/core-components-navigation-bar-private",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.5-alfasans",
|
|
4
4
|
"description": "Navigation bar private component",
|
|
5
5
|
"keywords": [],
|
|
6
6
|
"license": "MIT",
|
|
@@ -10,10 +10,10 @@
|
|
|
10
10
|
"main": "index.js",
|
|
11
11
|
"module": "./esm/index.js",
|
|
12
12
|
"dependencies": {
|
|
13
|
-
"@alfalab/core-components-button": "
|
|
14
|
-
"@alfalab/core-components-icon-button": "
|
|
15
|
-
"@alfalab/core-components-shared": "
|
|
16
|
-
"@alfalab/core-components-typography": "
|
|
13
|
+
"@alfalab/core-components-button": "13.1.1-alfasans",
|
|
14
|
+
"@alfalab/core-components-icon-button": "8.0.4-alfasans",
|
|
15
|
+
"@alfalab/core-components-shared": "2.1.1-alfasans",
|
|
16
|
+
"@alfalab/core-components-typography": "6.0.3-alfasans",
|
|
17
17
|
"@alfalab/hooks": "^1.13.1",
|
|
18
18
|
"@alfalab/icons-glyph": "^2.260.0",
|
|
19
19
|
"classnames": "^2.5.1",
|
|
@@ -28,6 +28,6 @@
|
|
|
28
28
|
"access": "public",
|
|
29
29
|
"directory": "dist"
|
|
30
30
|
},
|
|
31
|
-
"themesVersion": "15.0.2",
|
|
32
|
-
"varsVersion": "11.0.
|
|
31
|
+
"themesVersion": "15.0.2-alfasans",
|
|
32
|
+
"varsVersion": "11.0.2-alfasans"
|
|
33
33
|
}
|
package/src/index.module.css
CHANGED
package/src/vars.css
CHANGED
package/types.d.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { type CSSProperties, type ElementType, type ReactNode, type RefObject } from 'react';
|
|
2
2
|
import { type BackArrowAddonProps } from './components/back-arrow-addon';
|
|
3
3
|
import { type CloserProps } from './components/closer';
|
|
4
|
-
export
|
|
5
|
-
export
|
|
4
|
+
export type ColorType = 'default' | 'inverted';
|
|
5
|
+
export type NavigationBarPrivateProps = {
|
|
6
6
|
/**
|
|
7
7
|
* Контент шапки
|
|
8
8
|
*/
|
|
@@ -134,7 +134,7 @@ export declare type NavigationBarPrivateProps = {
|
|
|
134
134
|
*/
|
|
135
135
|
colors?: ColorType;
|
|
136
136
|
};
|
|
137
|
-
export
|
|
137
|
+
export type ContentParams = {
|
|
138
138
|
extraClassName?: string;
|
|
139
139
|
wrapperRef?: RefObject<HTMLDivElement>;
|
|
140
140
|
style?: CSSProperties;
|