@gravity-ui/page-constructor 8.13.1 → 8.14.0

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.
Files changed (188) hide show
  1. package/build/cjs/_vendor/swiper-modules.js +187 -136
  2. package/build/cjs/_vendor/swiper-modules.js.map +3 -3
  3. package/build/cjs/_vendor/swiper-react.js +770 -481
  4. package/build/cjs/_vendor/swiper-react.js.map +3 -3
  5. package/build/cjs/_vendor/swiper.js +693 -404
  6. package/build/cjs/_vendor/swiper.js.map +3 -3
  7. package/build/cjs/blocks/Footer/Footer.css +53 -0
  8. package/build/cjs/blocks/Footer/Footer.d.ts +5 -0
  9. package/build/cjs/blocks/Footer/Footer.js +34 -0
  10. package/build/cjs/blocks/Footer/Footer.js.map +1 -0
  11. package/build/cjs/blocks/Footer/components/CopyrightFloor/CopyrightFloor.css +201 -0
  12. package/build/cjs/blocks/Footer/components/CopyrightFloor/CopyrightFloor.d.ts +6 -0
  13. package/build/cjs/blocks/Footer/components/CopyrightFloor/CopyrightFloor.js +142 -0
  14. package/build/cjs/blocks/Footer/components/CopyrightFloor/CopyrightFloor.js.map +1 -0
  15. package/build/cjs/blocks/Footer/components/CopyrightFloor/index.d.ts +1 -0
  16. package/build/cjs/blocks/Footer/components/CopyrightFloor/index.js +6 -0
  17. package/build/cjs/blocks/Footer/components/CopyrightFloor/index.js.map +1 -0
  18. package/build/cjs/blocks/Footer/components/DisclaimerFloor/DisclaimerFloor.css +28 -0
  19. package/build/cjs/blocks/Footer/components/DisclaimerFloor/DisclaimerFloor.d.ts +6 -0
  20. package/build/cjs/blocks/Footer/components/DisclaimerFloor/DisclaimerFloor.js +18 -0
  21. package/build/cjs/blocks/Footer/components/DisclaimerFloor/DisclaimerFloor.js.map +1 -0
  22. package/build/cjs/blocks/Footer/components/DisclaimerFloor/index.d.ts +1 -0
  23. package/build/cjs/blocks/Footer/components/DisclaimerFloor/index.js +6 -0
  24. package/build/cjs/blocks/Footer/components/DisclaimerFloor/index.js.map +1 -0
  25. package/build/cjs/blocks/Footer/components/LangSwitcher/LangSwitcher.css +14 -0
  26. package/build/cjs/blocks/Footer/components/LangSwitcher/LangSwitcher.d.ts +11 -0
  27. package/build/cjs/blocks/Footer/components/LangSwitcher/LangSwitcher.js +38 -0
  28. package/build/cjs/blocks/Footer/components/LangSwitcher/LangSwitcher.js.map +1 -0
  29. package/build/cjs/blocks/Footer/components/LangSwitcher/index.d.ts +1 -0
  30. package/build/cjs/blocks/Footer/components/LangSwitcher/index.js +6 -0
  31. package/build/cjs/blocks/Footer/components/LangSwitcher/index.js.map +1 -0
  32. package/build/cjs/blocks/Footer/components/NavigationFloor/NavigationFloor.css +93 -0
  33. package/build/cjs/blocks/Footer/components/NavigationFloor/NavigationFloor.d.ts +12 -0
  34. package/build/cjs/blocks/Footer/components/NavigationFloor/NavigationFloor.js +37 -0
  35. package/build/cjs/blocks/Footer/components/NavigationFloor/NavigationFloor.js.map +1 -0
  36. package/build/cjs/blocks/Footer/components/NavigationFloor/index.d.ts +1 -0
  37. package/build/cjs/blocks/Footer/components/NavigationFloor/index.js +6 -0
  38. package/build/cjs/blocks/Footer/components/NavigationFloor/index.js.map +1 -0
  39. package/build/cjs/blocks/Footer/components/SocialFloor/SocialFloor.css +77 -0
  40. package/build/cjs/blocks/Footer/components/SocialFloor/SocialFloor.d.ts +6 -0
  41. package/build/cjs/blocks/Footer/components/SocialFloor/SocialFloor.js +38 -0
  42. package/build/cjs/blocks/Footer/components/SocialFloor/SocialFloor.js.map +1 -0
  43. package/build/cjs/blocks/Footer/components/SocialFloor/index.d.ts +1 -0
  44. package/build/cjs/blocks/Footer/components/SocialFloor/index.js +6 -0
  45. package/build/cjs/blocks/Footer/components/SocialFloor/index.js.map +1 -0
  46. package/build/cjs/blocks/Footer/hooks/useLogoImageProps.d.ts +2 -0
  47. package/build/cjs/blocks/Footer/hooks/useLogoImageProps.js +21 -0
  48. package/build/cjs/blocks/Footer/hooks/useLogoImageProps.js.map +1 -0
  49. package/build/cjs/blocks/Footer/hooks/useOverflowListItems.d.ts +18 -0
  50. package/build/cjs/blocks/Footer/hooks/useOverflowListItems.js +108 -0
  51. package/build/cjs/blocks/Footer/hooks/useOverflowListItems.js.map +1 -0
  52. package/build/cjs/blocks/Footer/schema.d.ts +347 -0
  53. package/build/cjs/blocks/Footer/schema.js +123 -0
  54. package/build/cjs/blocks/Footer/schema.js.map +1 -0
  55. package/build/cjs/blocks/index.d.ts +1 -0
  56. package/build/cjs/blocks/index.js +3 -1
  57. package/build/cjs/blocks/index.js.map +1 -1
  58. package/build/cjs/blocks/validators.d.ts +1 -0
  59. package/build/cjs/blocks/validators.js +1 -0
  60. package/build/cjs/blocks/validators.js.map +1 -1
  61. package/build/cjs/components/BrandFooter/BrandFooter.css +2 -2
  62. package/build/cjs/constructor-items.d.ts +2 -1
  63. package/build/cjs/constructor-items.js +1 -0
  64. package/build/cjs/constructor-items.js.map +1 -1
  65. package/build/cjs/containers/PageConstructor/PageConstructor.d.ts +0 -1
  66. package/build/cjs/containers/PageConstructor/PageConstructor.js +0 -1
  67. package/build/cjs/containers/PageConstructor/PageConstructor.js.map +1 -1
  68. package/build/cjs/models/constructor-items/blocks.d.ts +77 -2
  69. package/build/cjs/models/constructor-items/blocks.js +1 -0
  70. package/build/cjs/models/constructor-items/blocks.js.map +1 -1
  71. package/build/cjs/models/navigation.d.ts +1 -0
  72. package/build/cjs/models/navigation.js.map +1 -1
  73. package/build/cjs/navigation/components/NavigationItem/components/NavigationDropdown/NavigationDropdown.d.ts +1 -1
  74. package/build/cjs/navigation/components/NavigationItem/components/NavigationDropdown/NavigationDropdown.js +2 -2
  75. package/build/cjs/navigation/components/NavigationItem/components/NavigationDropdown/NavigationDropdown.js.map +1 -1
  76. package/build/cjs/navigation/components/NavigationItem/hooks/useNavigationItemMap.d.ts +1 -1
  77. package/build/cjs/navigation/components/NavigationPopup/NavigationPopup.d.ts +1 -1
  78. package/build/cjs/navigation/components/NavigationPopup/NavigationPopup.js +2 -2
  79. package/build/cjs/navigation/components/NavigationPopup/NavigationPopup.js.map +1 -1
  80. package/build/cjs/navigation/hooks/useActiveNavItem.d.ts +2 -0
  81. package/build/cjs/navigation/models.d.ts +1 -0
  82. package/build/cjs/navigation/models.js.map +1 -1
  83. package/build/cjs/navigation/utils.d.ts +1 -0
  84. package/build/cjs/node_modules/swiper/modules/index.js +187 -136
  85. package/build/cjs/node_modules/swiper/modules/pagination.css +108 -104
  86. package/build/cjs/node_modules/swiper/package.json +1 -1
  87. package/build/cjs/node_modules/swiper/swiper-react.d.ts +5 -0
  88. package/build/cjs/node_modules/swiper/swiper-react.js +770 -481
  89. package/build/cjs/node_modules/swiper/swiper.css +124 -102
  90. package/build/cjs/node_modules/swiper/swiper.js +693 -404
  91. package/build/cjs/node_modules/swiper/types/modules/index.d.ts +0 -2
  92. package/build/cjs/schema/constants.js +2 -0
  93. package/build/cjs/schema/constants.js.map +1 -1
  94. package/build/cjs/schema/validators/blocks.d.ts +1 -0
  95. package/build/cjs/schema/validators/blocks.js +1 -0
  96. package/build/cjs/schema/validators/blocks.js.map +1 -1
  97. package/build/cjs/text-transform/config.js +13 -0
  98. package/build/cjs/text-transform/config.js.map +1 -1
  99. package/build/esm/blocks/Footer/Footer.css +53 -0
  100. package/build/esm/blocks/Footer/Footer.d.ts +6 -0
  101. package/build/esm/blocks/Footer/Footer.js +31 -0
  102. package/build/esm/blocks/Footer/Footer.js.map +1 -0
  103. package/build/esm/blocks/Footer/components/CopyrightFloor/CopyrightFloor.css +201 -0
  104. package/build/esm/blocks/Footer/components/CopyrightFloor/CopyrightFloor.d.ts +7 -0
  105. package/build/esm/blocks/Footer/components/CopyrightFloor/CopyrightFloor.js +138 -0
  106. package/build/esm/blocks/Footer/components/CopyrightFloor/CopyrightFloor.js.map +1 -0
  107. package/build/esm/blocks/Footer/components/CopyrightFloor/index.d.ts +1 -0
  108. package/build/esm/blocks/Footer/components/CopyrightFloor/index.js +2 -0
  109. package/build/esm/blocks/Footer/components/CopyrightFloor/index.js.map +1 -0
  110. package/build/esm/blocks/Footer/components/DisclaimerFloor/DisclaimerFloor.css +28 -0
  111. package/build/esm/blocks/Footer/components/DisclaimerFloor/DisclaimerFloor.d.ts +7 -0
  112. package/build/esm/blocks/Footer/components/DisclaimerFloor/DisclaimerFloor.js +15 -0
  113. package/build/esm/blocks/Footer/components/DisclaimerFloor/DisclaimerFloor.js.map +1 -0
  114. package/build/esm/blocks/Footer/components/DisclaimerFloor/index.d.ts +1 -0
  115. package/build/esm/blocks/Footer/components/DisclaimerFloor/index.js +2 -0
  116. package/build/esm/blocks/Footer/components/DisclaimerFloor/index.js.map +1 -0
  117. package/build/esm/blocks/Footer/components/LangSwitcher/LangSwitcher.css +14 -0
  118. package/build/esm/blocks/Footer/components/LangSwitcher/LangSwitcher.d.ts +12 -0
  119. package/build/esm/blocks/Footer/components/LangSwitcher/LangSwitcher.js +34 -0
  120. package/build/esm/blocks/Footer/components/LangSwitcher/LangSwitcher.js.map +1 -0
  121. package/build/esm/blocks/Footer/components/LangSwitcher/index.d.ts +1 -0
  122. package/build/esm/blocks/Footer/components/LangSwitcher/index.js +2 -0
  123. package/build/esm/blocks/Footer/components/LangSwitcher/index.js.map +1 -0
  124. package/build/esm/blocks/Footer/components/NavigationFloor/NavigationFloor.css +93 -0
  125. package/build/esm/blocks/Footer/components/NavigationFloor/NavigationFloor.d.ts +13 -0
  126. package/build/esm/blocks/Footer/components/NavigationFloor/NavigationFloor.js +33 -0
  127. package/build/esm/blocks/Footer/components/NavigationFloor/NavigationFloor.js.map +1 -0
  128. package/build/esm/blocks/Footer/components/NavigationFloor/index.d.ts +1 -0
  129. package/build/esm/blocks/Footer/components/NavigationFloor/index.js +2 -0
  130. package/build/esm/blocks/Footer/components/NavigationFloor/index.js.map +1 -0
  131. package/build/esm/blocks/Footer/components/SocialFloor/SocialFloor.css +77 -0
  132. package/build/esm/blocks/Footer/components/SocialFloor/SocialFloor.d.ts +7 -0
  133. package/build/esm/blocks/Footer/components/SocialFloor/SocialFloor.js +35 -0
  134. package/build/esm/blocks/Footer/components/SocialFloor/SocialFloor.js.map +1 -0
  135. package/build/esm/blocks/Footer/components/SocialFloor/index.d.ts +1 -0
  136. package/build/esm/blocks/Footer/components/SocialFloor/index.js +2 -0
  137. package/build/esm/blocks/Footer/components/SocialFloor/index.js.map +1 -0
  138. package/build/esm/blocks/Footer/hooks/useLogoImageProps.d.ts +2 -0
  139. package/build/esm/blocks/Footer/hooks/useLogoImageProps.js +17 -0
  140. package/build/esm/blocks/Footer/hooks/useLogoImageProps.js.map +1 -0
  141. package/build/esm/blocks/Footer/hooks/useOverflowListItems.d.ts +18 -0
  142. package/build/esm/blocks/Footer/hooks/useOverflowListItems.js +104 -0
  143. package/build/esm/blocks/Footer/hooks/useOverflowListItems.js.map +1 -0
  144. package/build/esm/blocks/Footer/schema.d.ts +347 -0
  145. package/build/esm/blocks/Footer/schema.js +120 -0
  146. package/build/esm/blocks/Footer/schema.js.map +1 -0
  147. package/build/esm/blocks/index.d.ts +1 -0
  148. package/build/esm/blocks/index.js +1 -0
  149. package/build/esm/blocks/index.js.map +1 -1
  150. package/build/esm/blocks/validators.d.ts +1 -0
  151. package/build/esm/blocks/validators.js +1 -0
  152. package/build/esm/blocks/validators.js.map +1 -1
  153. package/build/esm/components/BrandFooter/BrandFooter.css +2 -2
  154. package/build/esm/constructor-items.d.ts +2 -1
  155. package/build/esm/constructor-items.js +2 -1
  156. package/build/esm/constructor-items.js.map +1 -1
  157. package/build/esm/containers/PageConstructor/PageConstructor.d.ts +0 -1
  158. package/build/esm/containers/PageConstructor/PageConstructor.js +0 -1
  159. package/build/esm/containers/PageConstructor/PageConstructor.js.map +1 -1
  160. package/build/esm/models/constructor-items/blocks.d.ts +77 -2
  161. package/build/esm/models/constructor-items/blocks.js +1 -0
  162. package/build/esm/models/constructor-items/blocks.js.map +1 -1
  163. package/build/esm/models/navigation.d.ts +1 -0
  164. package/build/esm/models/navigation.js.map +1 -1
  165. package/build/esm/navigation/components/NavigationItem/components/NavigationDropdown/NavigationDropdown.d.ts +1 -1
  166. package/build/esm/navigation/components/NavigationItem/components/NavigationDropdown/NavigationDropdown.js +2 -2
  167. package/build/esm/navigation/components/NavigationItem/components/NavigationDropdown/NavigationDropdown.js.map +1 -1
  168. package/build/esm/navigation/components/NavigationItem/hooks/useNavigationItemMap.d.ts +1 -1
  169. package/build/esm/navigation/components/NavigationPopup/NavigationPopup.d.ts +1 -1
  170. package/build/esm/navigation/components/NavigationPopup/NavigationPopup.js +2 -2
  171. package/build/esm/navigation/components/NavigationPopup/NavigationPopup.js.map +1 -1
  172. package/build/esm/navigation/hooks/useActiveNavItem.d.ts +2 -0
  173. package/build/esm/navigation/models.d.ts +1 -0
  174. package/build/esm/navigation/models.js.map +1 -1
  175. package/build/esm/navigation/utils.d.ts +1 -0
  176. package/build/esm/schema/constants.js +3 -1
  177. package/build/esm/schema/constants.js.map +1 -1
  178. package/build/esm/schema/validators/blocks.d.ts +1 -0
  179. package/build/esm/schema/validators/blocks.js +1 -0
  180. package/build/esm/schema/validators/blocks.js.map +1 -1
  181. package/build/esm/text-transform/config.js +13 -0
  182. package/build/esm/text-transform/config.js.map +1 -1
  183. package/package.json +3 -2
  184. package/schema/index.js +1 -1
  185. package/server/models/constructor-items/blocks.d.ts +77 -2
  186. package/server/models/constructor-items/blocks.js +1 -0
  187. package/server/models/navigation.d.ts +1 -0
  188. package/server/text-transform/config.js +10 -0
@@ -0,0 +1,138 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import * as React from 'react';
3
+ import { DropdownMenu, Link, useResizeObserver } from '@gravity-ui/uikit';
4
+ import { Image } from "../../../../components/index.js";
5
+ import { BREAKPOINTS } from "../../../../constants.js";
6
+ import { useTheme } from "../../../../context/theme/index.js";
7
+ import { Col } from "../../../../grid/index.js";
8
+ import { block, getThemedValue } from "../../../../utils/index.js";
9
+ import { useLogoImageProps } from "../../hooks/useLogoImageProps.js";
10
+ import { useOverflowListItems } from "../../hooks/useOverflowListItems.js";
11
+ import { LangSwitcher } from "../LangSwitcher/index.js";
12
+ import './CopyrightFloor.css';
13
+ const b = block('footer-block');
14
+ const MOBILE_WIDTH = BREAKPOINTS.sm;
15
+ const THREE_COLUMN_DESKTOP_WIDTH = BREAKPOINTS.md;
16
+ function getElementFlexContentWidth(element) {
17
+ const children = Array.from(element.children);
18
+ if (!children.length) {
19
+ return element.scrollWidth;
20
+ }
21
+ const elementStyles = window.getComputedStyle(element);
22
+ const columnGap = parseFloat(elementStyles.columnGap);
23
+ const gap = Number.isNaN(columnGap) ? 0 : columnGap;
24
+ // extra 1px to prevent overflow
25
+ const childrenWidths = children.map((child) => child.scrollWidth + 1);
26
+ if (elementStyles.flexDirection.startsWith('column')) {
27
+ return Math.ceil(Math.max(...childrenWidths));
28
+ }
29
+ return Math.ceil(childrenWidths.reduce((sum, width) => sum + width, 0) + gap * (children.length - 1));
30
+ }
31
+ function useLinksAlignmentState(copyright) {
32
+ const hasOnlyLinks = Boolean(copyright.links?.length &&
33
+ !copyright.logo &&
34
+ !copyright.languageSwitcher &&
35
+ !copyright.copyrightText);
36
+ const areLinksInTheMiddle = Boolean(copyright.logo &&
37
+ copyright.links?.length &&
38
+ (copyright.languageSwitcher || copyright.copyrightText));
39
+ return {
40
+ shouldCenterLinks: areLinksInTheMiddle || hasOnlyLinks,
41
+ threeColumnLayout: areLinksInTheMiddle,
42
+ hasOnlyLinks,
43
+ };
44
+ }
45
+ const CopyrightLogo = ({ logo, logoImageProps, logoRef }) => {
46
+ if (!logo || !logoImageProps) {
47
+ return null;
48
+ }
49
+ return (_jsx("div", { className: b('logo'), ref: logoRef, children: logo.url ? (_jsx(Link, { href: logo.url, children: _jsx(Image, { ...logoImageProps, alt: logo.alt ?? '', className: b('logo-image') }) })) : (_jsx(Image, { ...logoImageProps, alt: logo.alt ?? '', className: b('logo-image') })) }));
50
+ };
51
+ const VisibleLinks = ({ items, isLinksOverflowDropdown }) => {
52
+ if (!items?.length) {
53
+ return null;
54
+ }
55
+ return (_jsx("ul", { className: b('links-floor-list', {
56
+ wrap: !isLinksOverflowDropdown,
57
+ }), children: items.map((item, index) => (_jsx("li", { className: b('links-floor-item'), children: _jsx("a", { href: item.url, children: item.text }) }, index))) }));
58
+ };
59
+ const OverflowDropdown = ({ isLinksOverflowDropdown, items }) => {
60
+ if (!isLinksOverflowDropdown || !items.length) {
61
+ return null;
62
+ }
63
+ return (_jsx(DropdownMenu, { items: items, switcherWrapperClassName: b('more-button', {
64
+ visible: isLinksOverflowDropdown && items.length > 0,
65
+ }), size: "l" }));
66
+ };
67
+ const RightSide = ({ copyright, rightSideRef, style }) => {
68
+ const theme = useTheme();
69
+ return (_jsxs("div", { className: b('links-floor-right'), ref: rightSideRef, style: style, children: [copyright.languageSwitcher && (_jsx(LangSwitcher, { buttonText: copyright.languageSwitcher.buttonText, items: copyright.languageSwitcher.items, image: getThemedValue(copyright.languageSwitcher.image, theme) })), copyright.copyrightText && (_jsx("span", { className: b('links-floor-copyright'), children: copyright.copyrightText }))] }));
70
+ };
71
+ const DOCUMENT_ELEMENT_REF = {
72
+ current: document.documentElement,
73
+ };
74
+ export const CopyrightFloor = ({ copyright }) => {
75
+ const theme = useTheme();
76
+ const [isSmallWidth, setIsSmallWidth] = React.useState(() => {
77
+ return document.documentElement.clientWidth <= MOBILE_WIDTH;
78
+ });
79
+ const [isThreeColumnStacked, setIsThreeColumnStacked] = React.useState(() => {
80
+ return document.documentElement.clientWidth <= THREE_COLUMN_DESKTOP_WIDTH;
81
+ });
82
+ const [sideColumnWidth, setSideColumnWidth] = React.useState();
83
+ const logoRef = React.useRef(null);
84
+ const rightSideRef = React.useRef(null);
85
+ const updateSideColumnWidth = React.useCallback(() => {
86
+ const logoWidth = Math.ceil(logoRef.current?.getBoundingClientRect().width ?? 0);
87
+ const rightSideWidth = rightSideRef.current
88
+ ? getElementFlexContentWidth(rightSideRef.current)
89
+ : 0;
90
+ const maxSideWidth = Math.max(logoWidth, rightSideWidth);
91
+ setSideColumnWidth(maxSideWidth || undefined);
92
+ }, []);
93
+ const updateFloorSize = React.useCallback(() => {
94
+ setIsSmallWidth(document.documentElement.clientWidth <= MOBILE_WIDTH);
95
+ setIsThreeColumnStacked(document.documentElement.clientWidth <= THREE_COLUMN_DESKTOP_WIDTH);
96
+ updateSideColumnWidth();
97
+ }, [updateSideColumnWidth]);
98
+ useResizeObserver({
99
+ ref: DOCUMENT_ELEMENT_REF,
100
+ onResize: updateFloorSize,
101
+ });
102
+ const menuContainerRef = React.useRef(null);
103
+ const linksOverflowStrategy = copyright.linksOverflowStrategy || 'dropdown';
104
+ const isLinksOverflowDropdown = linksOverflowStrategy === 'dropdown';
105
+ const { visibleItems, hiddenItems, measured } = useOverflowListItems({
106
+ isDropdown: isLinksOverflowDropdown && !isSmallWidth,
107
+ containerRef: menuContainerRef,
108
+ items: copyright.links,
109
+ itemSelector: `.${b('links-floor-item')}`,
110
+ moreButtonWidth: 52,
111
+ });
112
+ const { shouldCenterLinks, threeColumnLayout, hasOnlyLinks } = useLinksAlignmentState(copyright);
113
+ const hasLanguageSwitcher = Boolean(copyright.languageSwitcher);
114
+ const hasCopyrightText = Boolean(copyright.copyrightText);
115
+ const hasRightSideContent = hasLanguageSwitcher || hasCopyrightText;
116
+ const copyrightLogoImage = copyright.logo && getThemedValue(copyright.logo.image, theme);
117
+ const copyrightLogoImageProps = useLogoImageProps(copyrightLogoImage);
118
+ React.useEffect(() => {
119
+ if (isThreeColumnStacked) {
120
+ updateSideColumnWidth();
121
+ }
122
+ }, [updateSideColumnWidth, copyrightLogoImageProps, hasRightSideContent, isThreeColumnStacked]);
123
+ const linksContent = (_jsxs("div", { className: b('links-floor-left', { measured }), ref: menuContainerRef, children: [_jsx(VisibleLinks, { items: visibleItems, isLinksOverflowDropdown: isLinksOverflowDropdown }), _jsx(OverflowDropdown, { isLinksOverflowDropdown: isLinksOverflowDropdown, items: hiddenItems })] }));
124
+ const sideColumnStyle = React.useMemo(() => {
125
+ if (!threeColumnLayout || isThreeColumnStacked || sideColumnWidth === undefined) {
126
+ return undefined;
127
+ }
128
+ return { width: sideColumnWidth };
129
+ }, [isThreeColumnStacked, sideColumnWidth, threeColumnLayout]);
130
+ return (_jsx(Col, { sizes: { all: 12 }, className: b('floor', { copyright: true }), children: _jsxs("div", { className: b('links-floor-inner', {
131
+ centered: shouldCenterLinks,
132
+ threeColumn: threeColumnLayout,
133
+ overflow: linksOverflowStrategy,
134
+ withLanguageSwitcher: hasLanguageSwitcher,
135
+ hasOnlyLinks,
136
+ }), children: [copyright.logo && (_jsx("div", { className: b('links-floor-side'), style: sideColumnStyle, children: _jsx(CopyrightLogo, { logo: copyright.logo, logoImageProps: copyrightLogoImageProps, logoRef: logoRef }) })), threeColumnLayout ? (_jsx("div", { className: b('links-floor-center'), children: linksContent })) : (linksContent), hasRightSideContent && (_jsx(RightSide, { copyright: copyright, rightSideRef: rightSideRef, style: sideColumnStyle }))] }) }));
137
+ };
138
+ //# sourceMappingURL=CopyrightFloor.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CopyrightFloor.js","sourceRoot":"../../../../../../src","sources":["blocks/Footer/components/CopyrightFloor/CopyrightFloor.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {DropdownMenu, DropdownMenuItem, Link, useResizeObserver} from '@gravity-ui/uikit';\n\nimport {Image} from '../../../../components';\nimport {BREAKPOINTS} from '../../../../constants';\nimport {useTheme} from '../../../../context/theme';\nimport {Col} from '../../../../grid';\nimport type {FooterBlockProps} from '../../../../models';\nimport {block, getThemedValue} from '../../../../utils';\nimport {useLogoImageProps} from '../../hooks/useLogoImageProps';\nimport {LinkItem, useOverflowListItems} from '../../hooks/useOverflowListItems';\nimport {LangSwitcher} from '../LangSwitcher';\n\nimport './CopyrightFloor.scss';\n\nconst b = block('footer-block');\n\nconst MOBILE_WIDTH = BREAKPOINTS.sm;\nconst THREE_COLUMN_DESKTOP_WIDTH = BREAKPOINTS.md;\n\ntype CopyrightFloorProps = {\n copyright: NonNullable<FooterBlockProps['copyright']>;\n};\n\nfunction getElementFlexContentWidth(element: HTMLElement) {\n const children = Array.from(element.children) as HTMLElement[];\n\n if (!children.length) {\n return element.scrollWidth;\n }\n\n const elementStyles = window.getComputedStyle(element);\n const columnGap = parseFloat(elementStyles.columnGap);\n const gap = Number.isNaN(columnGap) ? 0 : columnGap;\n // extra 1px to prevent overflow\n const childrenWidths = children.map((child) => child.scrollWidth + 1);\n\n if (elementStyles.flexDirection.startsWith('column')) {\n return Math.ceil(Math.max(...childrenWidths));\n }\n\n return Math.ceil(\n childrenWidths.reduce((sum, width) => sum + width, 0) + gap * (children.length - 1),\n );\n}\n\nfunction useLinksAlignmentState(copyright: CopyrightFloorProps['copyright']) {\n const hasOnlyLinks = Boolean(\n copyright.links?.length &&\n !copyright.logo &&\n !copyright.languageSwitcher &&\n !copyright.copyrightText,\n );\n const areLinksInTheMiddle = Boolean(\n copyright.logo &&\n copyright.links?.length &&\n (copyright.languageSwitcher || copyright.copyrightText),\n );\n\n return {\n shouldCenterLinks: areLinksInTheMiddle || hasOnlyLinks,\n threeColumnLayout: areLinksInTheMiddle,\n hasOnlyLinks,\n };\n}\n\ntype CopyrightLogoProps = {\n logo: CopyrightFloorProps['copyright']['logo'];\n logoImageProps: Record<string, unknown> | null;\n logoRef?: React.RefObject<HTMLDivElement>;\n};\n\nconst CopyrightLogo = ({logo, logoImageProps, logoRef}: CopyrightLogoProps) => {\n if (!logo || !logoImageProps) {\n return null;\n }\n\n return (\n <div className={b('logo')} ref={logoRef}>\n {logo.url ? (\n <Link href={logo.url}>\n <Image {...logoImageProps} alt={logo.alt ?? ''} className={b('logo-image')} />\n </Link>\n ) : (\n <Image {...logoImageProps} alt={logo.alt ?? ''} className={b('logo-image')} />\n )}\n </div>\n );\n};\n\ntype VisibleLinksProps = {\n items: LinkItem[];\n isLinksOverflowDropdown: boolean;\n};\n\nconst VisibleLinks = ({items, isLinksOverflowDropdown}: VisibleLinksProps) => {\n if (!items?.length) {\n return null;\n }\n\n return (\n <ul\n className={b('links-floor-list', {\n wrap: !isLinksOverflowDropdown,\n })}\n >\n {items.map((item, index) => (\n <li key={index} className={b('links-floor-item')}>\n <a href={item.url}>{item.text}</a>\n </li>\n ))}\n </ul>\n );\n};\n\ntype OverflowDropdownProps = {\n isLinksOverflowDropdown: boolean;\n items: DropdownMenuItem[];\n};\n\nconst OverflowDropdown = ({isLinksOverflowDropdown, items}: OverflowDropdownProps) => {\n if (!isLinksOverflowDropdown || !items.length) {\n return null;\n }\n\n return (\n <DropdownMenu\n items={items}\n switcherWrapperClassName={b('more-button', {\n visible: isLinksOverflowDropdown && items.length > 0,\n })}\n size=\"l\"\n />\n );\n};\n\ntype RightSideProps = {\n copyright: CopyrightFloorProps['copyright'];\n rightSideRef: React.RefObject<HTMLDivElement>;\n style?: React.CSSProperties;\n};\n\nconst RightSide = ({copyright, rightSideRef, style}: RightSideProps) => {\n const theme = useTheme();\n\n return (\n <div className={b('links-floor-right')} ref={rightSideRef} style={style}>\n {copyright.languageSwitcher && (\n <LangSwitcher\n buttonText={copyright.languageSwitcher.buttonText}\n items={copyright.languageSwitcher.items}\n image={getThemedValue(copyright.languageSwitcher.image, theme)}\n />\n )}\n {copyright.copyrightText && (\n <span className={b('links-floor-copyright')}>{copyright.copyrightText}</span>\n )}\n </div>\n );\n};\n\nconst DOCUMENT_ELEMENT_REF = {\n current: document.documentElement,\n};\n\nexport const CopyrightFloor = ({copyright}: CopyrightFloorProps) => {\n const theme = useTheme();\n const [isSmallWidth, setIsSmallWidth] = React.useState(() => {\n return document.documentElement.clientWidth <= MOBILE_WIDTH;\n });\n const [isThreeColumnStacked, setIsThreeColumnStacked] = React.useState(() => {\n return document.documentElement.clientWidth <= THREE_COLUMN_DESKTOP_WIDTH;\n });\n const [sideColumnWidth, setSideColumnWidth] = React.useState<number>();\n const logoRef = React.useRef<HTMLDivElement>(null);\n const rightSideRef = React.useRef<HTMLDivElement>(null);\n\n const updateSideColumnWidth = React.useCallback(() => {\n const logoWidth = Math.ceil(logoRef.current?.getBoundingClientRect().width ?? 0);\n const rightSideWidth = rightSideRef.current\n ? getElementFlexContentWidth(rightSideRef.current)\n : 0;\n const maxSideWidth = Math.max(logoWidth, rightSideWidth);\n\n setSideColumnWidth(maxSideWidth || undefined);\n }, []);\n\n const updateFloorSize = React.useCallback(() => {\n setIsSmallWidth(document.documentElement.clientWidth <= MOBILE_WIDTH);\n setIsThreeColumnStacked(document.documentElement.clientWidth <= THREE_COLUMN_DESKTOP_WIDTH);\n updateSideColumnWidth();\n }, [updateSideColumnWidth]);\n\n useResizeObserver({\n ref: DOCUMENT_ELEMENT_REF,\n onResize: updateFloorSize,\n });\n\n const menuContainerRef = React.useRef<HTMLDivElement>(null);\n const linksOverflowStrategy = copyright.linksOverflowStrategy || 'dropdown';\n const isLinksOverflowDropdown = linksOverflowStrategy === 'dropdown';\n const {visibleItems, hiddenItems, measured} = useOverflowListItems({\n isDropdown: isLinksOverflowDropdown && !isSmallWidth,\n containerRef: menuContainerRef,\n items: copyright.links,\n itemSelector: `.${b('links-floor-item')}`,\n moreButtonWidth: 52,\n });\n const {shouldCenterLinks, threeColumnLayout, hasOnlyLinks} = useLinksAlignmentState(copyright);\n const hasLanguageSwitcher = Boolean(copyright.languageSwitcher);\n const hasCopyrightText = Boolean(copyright.copyrightText);\n const hasRightSideContent = hasLanguageSwitcher || hasCopyrightText;\n const copyrightLogoImage = copyright.logo && getThemedValue(copyright.logo.image, theme);\n const copyrightLogoImageProps = useLogoImageProps(copyrightLogoImage);\n\n React.useEffect(() => {\n if (isThreeColumnStacked) {\n updateSideColumnWidth();\n }\n }, [updateSideColumnWidth, copyrightLogoImageProps, hasRightSideContent, isThreeColumnStacked]);\n\n const linksContent = (\n <div className={b('links-floor-left', {measured})} ref={menuContainerRef}>\n <VisibleLinks items={visibleItems} isLinksOverflowDropdown={isLinksOverflowDropdown} />\n <OverflowDropdown\n isLinksOverflowDropdown={isLinksOverflowDropdown}\n items={hiddenItems}\n />\n </div>\n );\n\n const sideColumnStyle = React.useMemo<React.CSSProperties | undefined>(() => {\n if (!threeColumnLayout || isThreeColumnStacked || sideColumnWidth === undefined) {\n return undefined;\n }\n\n return {width: sideColumnWidth};\n }, [isThreeColumnStacked, sideColumnWidth, threeColumnLayout]);\n\n return (\n <Col sizes={{all: 12}} className={b('floor', {copyright: true})}>\n <div\n className={b('links-floor-inner', {\n centered: shouldCenterLinks,\n threeColumn: threeColumnLayout,\n overflow: linksOverflowStrategy,\n withLanguageSwitcher: hasLanguageSwitcher,\n hasOnlyLinks,\n })}\n >\n {copyright.logo && (\n <div className={b('links-floor-side')} style={sideColumnStyle}>\n <CopyrightLogo\n logo={copyright.logo}\n logoImageProps={copyrightLogoImageProps}\n logoRef={logoRef}\n />\n </div>\n )}\n {threeColumnLayout ? (\n <div className={b('links-floor-center')}>{linksContent}</div>\n ) : (\n linksContent\n )}\n {hasRightSideContent && (\n <RightSide\n copyright={copyright}\n rightSideRef={rightSideRef}\n style={sideColumnStyle}\n />\n )}\n </div>\n </Col>\n );\n};\n"]}
@@ -0,0 +1 @@
1
+ export { CopyrightFloor } from "./CopyrightFloor.js";
@@ -0,0 +1,2 @@
1
+ export { CopyrightFloor } from "./CopyrightFloor.js";
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"../../../../../../src","sources":["blocks/Footer/components/CopyrightFloor/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,cAAc,EAAC,4BAAyB","sourcesContent":["export {CopyrightFloor} from './CopyrightFloor';\n"]}
@@ -0,0 +1,28 @@
1
+ /* use this for style redefinitions to awoid problems with
2
+ unpredictable css rules order in build */
3
+ .pc-footer-block__disclaimer-floor-content {
4
+ font-size: var(--g-text-body-2-font-size);
5
+ line-height: var(--g-text-body-2-line-height);
6
+ color: var(--g-color-text-secondary);
7
+ }
8
+ .pc-footer-block__disclaimer-floor-content .yfm {
9
+ margin: 0;
10
+ }
11
+ .pc-footer-block__disclaimer-floor-content .yfm a {
12
+ color: var(--g-color-text-secondary);
13
+ text-decoration: underline;
14
+ }
15
+ .pc-footer-block__disclaimer-floor-content .yfm a:hover {
16
+ color: var(--g-color-text-primary);
17
+ }
18
+ .pc-footer-block__disclaimer-floor-content_align_center {
19
+ text-align: center;
20
+ }
21
+ .pc-footer-block__disclaimer-floor-content_align_left {
22
+ text-align: left;
23
+ }
24
+ @media (max-width: 577px) {
25
+ .pc-footer-block__floor_disclaimer.col {
26
+ padding: 24px 0;
27
+ }
28
+ }
@@ -0,0 +1,7 @@
1
+ import { FooterBlockProps } from "../../../../models/index.js";
2
+ import './DisclaimerFloor.css';
3
+ type DisclaimerFloorProps = {
4
+ disclaimer: NonNullable<FooterBlockProps['disclaimer']>;
5
+ };
6
+ export declare const DisclaimerFloor: ({ disclaimer }: DisclaimerFloorProps) => import("react/jsx-runtime").JSX.Element;
7
+ export {};
@@ -0,0 +1,15 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { YFMWrapper } from "../../../../components/index.js";
3
+ import { Col } from "../../../../grid/index.js";
4
+ import { block } from "../../../../utils/index.js";
5
+ import './DisclaimerFloor.css';
6
+ const b = block('footer-block');
7
+ export const DisclaimerFloor = ({ disclaimer }) => {
8
+ return (_jsx(Col, { sizes: { all: 12 }, className: b('floor', { disclaimer: true }), children: _jsx("div", { className: b('disclaimer-floor-content', {
9
+ align: disclaimer.align || 'left',
10
+ }), children: _jsx(YFMWrapper, { content: disclaimer.text, modifiers: {
11
+ constructor: true,
12
+ 'constructor-notice': true,
13
+ } }) }) }));
14
+ };
15
+ //# sourceMappingURL=DisclaimerFloor.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DisclaimerFloor.js","sourceRoot":"../../../../../../src","sources":["blocks/Footer/components/DisclaimerFloor/DisclaimerFloor.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,UAAU,EAAC,wCAA+B;AAClD,OAAO,EAAC,GAAG,EAAC,kCAAyB;AAErC,OAAO,EAAC,KAAK,EAAC,mCAA0B;AAExC,OAAO,uBAAuB,CAAC;AAE/B,MAAM,CAAC,GAAG,KAAK,CAAC,cAAc,CAAC,CAAC;AAMhC,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,EAAC,UAAU,EAAuB,EAAE,EAAE;IAClE,OAAO,CACH,KAAC,GAAG,IAAC,KAAK,EAAE,EAAC,GAAG,EAAE,EAAE,EAAC,EAAE,SAAS,EAAE,CAAC,CAAC,OAAO,EAAE,EAAC,UAAU,EAAE,IAAI,EAAC,CAAC,YAC5D,cACI,SAAS,EAAE,CAAC,CAAC,0BAA0B,EAAE;gBACrC,KAAK,EAAE,UAAU,CAAC,KAAK,IAAI,MAAM;aACpC,CAAC,YAEF,KAAC,UAAU,IACP,OAAO,EAAE,UAAU,CAAC,IAAI,EACxB,SAAS,EAAE;oBACP,WAAW,EAAE,IAAI;oBACjB,oBAAoB,EAAE,IAAI;iBAC7B,GACH,GACA,GACJ,CACT,CAAC;AACN,CAAC,CAAC","sourcesContent":["import {YFMWrapper} from '../../../../components';\nimport {Col} from '../../../../grid';\nimport {FooterBlockProps} from '../../../../models';\nimport {block} from '../../../../utils';\n\nimport './DisclaimerFloor.scss';\n\nconst b = block('footer-block');\n\ntype DisclaimerFloorProps = {\n disclaimer: NonNullable<FooterBlockProps['disclaimer']>;\n};\n\nexport const DisclaimerFloor = ({disclaimer}: DisclaimerFloorProps) => {\n return (\n <Col sizes={{all: 12}} className={b('floor', {disclaimer: true})}>\n <div\n className={b('disclaimer-floor-content', {\n align: disclaimer.align || 'left',\n })}\n >\n <YFMWrapper\n content={disclaimer.text}\n modifiers={{\n constructor: true,\n 'constructor-notice': true,\n }}\n />\n </div>\n </Col>\n );\n};\n"]}
@@ -0,0 +1 @@
1
+ export { DisclaimerFloor } from "./DisclaimerFloor.js";
@@ -0,0 +1,2 @@
1
+ export { DisclaimerFloor } from "./DisclaimerFloor.js";
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"../../../../../../src","sources":["blocks/Footer/components/DisclaimerFloor/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,eAAe,EAAC,6BAA0B","sourcesContent":["export {DisclaimerFloor} from './DisclaimerFloor';\n"]}
@@ -0,0 +1,14 @@
1
+ /* use this for style redefinitions to awoid problems with
2
+ unpredictable css rules order in build */
3
+ .pc-footer-block__links-floor-right .pc-lang-switcher {
4
+ height: var(--g-spacing-9);
5
+ padding: 0;
6
+ cursor: pointer;
7
+ }
8
+ .pc-footer-block__links-floor-right .pc-lang-switcher .pc-content-wrapper__text {
9
+ font-size: var(--g-text-body-2-font-size);
10
+ line-height: var(--g-text-body-2-line-height);
11
+ }
12
+ .pc-footer-block__links-floor-right .pc-lang-switcher:hover .pc-content-wrapper__text {
13
+ color: var(--g-color-text-secondary);
14
+ }
@@ -0,0 +1,12 @@
1
+ import { ImageProps } from "../../../../models/index.js";
2
+ import './LangSwitcher.css';
3
+ type LanguageSwitcherProps = {
4
+ buttonText?: string;
5
+ items: {
6
+ text: string;
7
+ href: string;
8
+ }[];
9
+ image?: ImageProps;
10
+ };
11
+ export declare const LangSwitcher: ({ buttonText, items, image }: LanguageSwitcherProps) => import("react/jsx-runtime").JSX.Element;
12
+ export {};
@@ -0,0 +1,34 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import * as React from 'react';
3
+ import { InnerContext } from "../../../../context/innerContext/index.js";
4
+ import { NavigationItemType, } from "../../../../models/index.js";
5
+ import { block } from "../../../../utils/index.js";
6
+ import './LangSwitcher.css';
7
+ const b = block('lang-switcher');
8
+ export const LangSwitcher = ({ buttonText, items, image }) => {
9
+ const [isActive, setIsActive] = React.useState(false);
10
+ const { navItemMap } = React.useContext(InnerContext);
11
+ const navigationItems = React.useMemo(() => items.map((item) => ({
12
+ type: NavigationItemType.Link,
13
+ text: item.text,
14
+ url: item.href,
15
+ })), [items]);
16
+ const hidePopup = React.useCallback(() => {
17
+ setIsActive(false);
18
+ }, []);
19
+ const onClick = React.useCallback((event) => {
20
+ event.stopPropagation();
21
+ setIsActive((active) => !active);
22
+ }, []);
23
+ const text = buttonText ?? 'Language';
24
+ const data = {
25
+ type: NavigationItemType.Dropdown,
26
+ text,
27
+ items: navigationItems,
28
+ isActive,
29
+ hidePopup,
30
+ };
31
+ const NavigationDropdown = navItemMap[NavigationItemType.Dropdown];
32
+ return (_jsx(NavigationDropdown, { data: data, text: text, type: NavigationItemType.Dropdown, items: navigationItems, isActive: isActive, hidePopup: hidePopup, onClick: onClick, className: b(), placement: "top-start", icon: image, iconSize: 20 }));
33
+ };
34
+ //# sourceMappingURL=LangSwitcher.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"LangSwitcher.js","sourceRoot":"../../../../../../src","sources":["blocks/Footer/components/LangSwitcher/LangSwitcher.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,YAAY,EAAC,kDAAyC;AAC9D,OAAO,EAGH,kBAAkB,GAErB,oCAA2B;AAC5B,OAAO,EAAC,KAAK,EAAC,mCAA0B;AAExC,OAAO,oBAAoB,CAAC;AAW5B,MAAM,CAAC,GAAG,KAAK,CAAC,eAAe,CAAC,CAAC;AAEjC,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,EAAC,UAAU,EAAE,KAAK,EAAE,KAAK,EAAwB,EAAE,EAAE;IAC9E,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IACtD,MAAM,EAAC,UAAU,EAAC,GAAG,KAAK,CAAC,UAAU,CAAC,YAAY,CAAC,CAAC;IAEpD,MAAM,eAAe,GAAG,KAAK,CAAC,OAAO,CACjC,GAAG,EAAE,CACD,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QACjB,IAAI,EAAE,kBAAkB,CAAC,IAAI;QAC7B,IAAI,EAAE,IAAI,CAAC,IAAI;QACf,GAAG,EAAE,IAAI,CAAC,IAAI;KACjB,CAAC,CAAC,EACP,CAAC,KAAK,CAAC,CACV,CAAC;IAEF,MAAM,SAAS,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACrC,WAAW,CAAC,KAAK,CAAC,CAAC;IACvB,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,OAAO,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,KAAuB,EAAE,EAAE;QAC1D,KAAK,CAAC,eAAe,EAAE,CAAC;QACxB,WAAW,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC;IACrC,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,IAAI,GAAG,UAAU,IAAI,UAAU,CAAC;IACtC,MAAM,IAAI,GAA2B;QACjC,IAAI,EAAE,kBAAkB,CAAC,QAAQ;QACjC,IAAI;QACJ,KAAK,EAAE,eAAe;QACtB,QAAQ;QACR,SAAS;KACZ,CAAC;IAEF,MAAM,kBAAkB,GAAG,UAAU,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;IAEnE,OAAO,CACH,KAAC,kBAAkB,IACf,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,kBAAkB,CAAC,QAAQ,EACjC,KAAK,EAAE,eAAe,EACtB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,CAAC,EAAE,EACd,SAAS,EAAC,WAAW,EACrB,IAAI,EAAE,KAAK,EACX,QAAQ,EAAE,EAAE,GACd,CACL,CAAC;AACN,CAAC,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {InnerContext} from '../../../../context/innerContext';\nimport {\n ImageProps,\n NavigationDropdownItem,\n NavigationItemType,\n NavigationLinkItem,\n} from '../../../../models';\nimport {block} from '../../../../utils';\n\nimport './LangSwitcher.scss';\n\ntype LanguageSwitcherProps = {\n buttonText?: string;\n items: {\n text: string;\n href: string;\n }[];\n image?: ImageProps;\n};\n\nconst b = block('lang-switcher');\n\nexport const LangSwitcher = ({buttonText, items, image}: LanguageSwitcherProps) => {\n const [isActive, setIsActive] = React.useState(false);\n const {navItemMap} = React.useContext(InnerContext);\n\n const navigationItems = React.useMemo<NavigationLinkItem[]>(\n () =>\n items.map((item) => ({\n type: NavigationItemType.Link,\n text: item.text,\n url: item.href,\n })),\n [items],\n );\n\n const hidePopup = React.useCallback(() => {\n setIsActive(false);\n }, []);\n\n const onClick = React.useCallback((event: React.MouseEvent) => {\n event.stopPropagation();\n setIsActive((active) => !active);\n }, []);\n\n const text = buttonText ?? 'Language';\n const data: NavigationDropdownItem = {\n type: NavigationItemType.Dropdown,\n text,\n items: navigationItems,\n isActive,\n hidePopup,\n };\n\n const NavigationDropdown = navItemMap[NavigationItemType.Dropdown];\n\n return (\n <NavigationDropdown\n data={data}\n text={text}\n type={NavigationItemType.Dropdown}\n items={navigationItems}\n isActive={isActive}\n hidePopup={hidePopup}\n onClick={onClick}\n className={b()}\n placement=\"top-start\"\n icon={image}\n iconSize={20}\n />\n );\n};\n"]}
@@ -0,0 +1 @@
1
+ export { LangSwitcher } from "./LangSwitcher.js";
@@ -0,0 +1,2 @@
1
+ export { LangSwitcher } from "./LangSwitcher.js";
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"../../../../../../src","sources":["blocks/Footer/components/LangSwitcher/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,YAAY,EAAC,0BAAuB","sourcesContent":["export {LangSwitcher} from './LangSwitcher';\n"]}
@@ -0,0 +1,93 @@
1
+ /* use this for style redefinitions to awoid problems with
2
+ unpredictable css rules order in build */
3
+ .pc-footer-block .pc-footer-block__floor.pc-footer-block__floor_navigation {
4
+ margin: 0 auto;
5
+ padding: 32px 0 var(--g-spacing-10);
6
+ border: none;
7
+ }
8
+ .pc-footer-block__floor .pc-footer-block__columns-container {
9
+ padding: 0;
10
+ }
11
+ .pc-footer-block__floor_logo-placement_left .pc-footer-block__logo-col.col {
12
+ padding: 0 0 32px;
13
+ }
14
+ .pc-footer-block__floor_logo-placement_left .pc-footer-block__logo-col.col .row {
15
+ margin: 0;
16
+ }
17
+ .pc-footer-block__floor_logo-placement_top {
18
+ padding-top: 0;
19
+ }
20
+ .pc-footer-block__floor_logo-placement_top .pc-footer-block__logo-col_top.col {
21
+ padding: 0 0 24px;
22
+ margin-bottom: 32px;
23
+ border-bottom: 1px solid var(--g-color-line-generic);
24
+ }
25
+ .pc-footer-block__column {
26
+ min-width: 0;
27
+ padding-right: 16px;
28
+ }
29
+ .pc-footer-block__column-inner {
30
+ display: flex;
31
+ flex-direction: column;
32
+ gap: 20px;
33
+ }
34
+ .pc-footer-block__nav-row {
35
+ width: calc(100% + 24px);
36
+ min-width: 0;
37
+ gap: 48px 0;
38
+ }
39
+ @media (min-width: 1081px) {
40
+ .pc-footer-block__nav-row_custom-columns > .pc-footer-block__column {
41
+ flex: 0 0 var(--pc-footer-navigation-column-width);
42
+ max-width: var(--pc-footer-navigation-column-width);
43
+ }
44
+ }
45
+ .pc-footer-block__column-title {
46
+ font-size: var(--g-text-subheader-3-font-size);
47
+ line-height: var(--g-text-subheader-3-line-height);
48
+ font-weight: var(--g-text-accent-font-weight);
49
+ color: var(--g-color-text-primary);
50
+ margin: 0;
51
+ }
52
+ .pc-footer-block__links {
53
+ list-style: none;
54
+ margin: 0;
55
+ padding: 0;
56
+ }
57
+ .pc-footer-block__link-item {
58
+ margin: 0;
59
+ }
60
+ .pc-footer-block__link-item:not(:last-child) {
61
+ margin-bottom: 16px;
62
+ }
63
+ .pc-footer-block__link {
64
+ font-size: var(--g-text-body-2-font-size);
65
+ line-height: var(--g-text-body-2-line-height);
66
+ outline: none;
67
+ color: var(--g-color-text-link);
68
+ text-decoration: none;
69
+ cursor: pointer;
70
+ color: var(--g-color-text-primary);
71
+ text-decoration: none;
72
+ line-height: var(--g-text-body-2-line-height);
73
+ }
74
+ .utilityfocus .pc-footer-block__link:focus {
75
+ outline: 2px solid #ffdb4d;
76
+ }
77
+ .pc-footer-block__link:hover, .pc-footer-block__link:active {
78
+ --pc-text-header-color: var(--g-color-text-link-hover);
79
+ color: var(--g-color-text-link-hover);
80
+ }
81
+ .pc-footer-block__link:hover {
82
+ color: var(--g-color-text-secondary);
83
+ }
84
+ @media (max-width: 1081px) {
85
+ .pc-footer-block__floor_logo-placement_top .pc-footer-block__logo-col.col {
86
+ padding: 0 0 32px;
87
+ }
88
+ }
89
+ @media (max-width: 769px) {
90
+ .pc-footer-block__floor_navigation .pc-footer-block__logo {
91
+ height: 48px;
92
+ }
93
+ }
@@ -0,0 +1,13 @@
1
+ import * as React from 'react';
2
+ import type { GridColumnSizesType } from "../../../../grid/index.js";
3
+ import { FooterLinkColumn } from "../../../../models/index.js";
4
+ import './NavigationFloor.css';
5
+ type NavigationFloorProps = {
6
+ columns: FooterLinkColumn[];
7
+ logoContent: React.ReactNode;
8
+ colSizes?: GridColumnSizesType;
9
+ columnsPerRow?: number;
10
+ logoPlacement?: 'left' | 'top';
11
+ };
12
+ export declare const NavigationFloor: ({ columns, logoContent, colSizes, columnsPerRow, logoPlacement, }: NavigationFloorProps) => import("react/jsx-runtime").JSX.Element;
13
+ export {};
@@ -0,0 +1,33 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import * as React from 'react';
3
+ import { Link } from '@gravity-ui/uikit';
4
+ import { Col, Row } from "../../../../grid/index.js";
5
+ import { block } from "../../../../utils/index.js";
6
+ import './NavigationFloor.css';
7
+ const b = block('footer-block');
8
+ const DEFAULT_COL_SIZES_WITH_LOGO = { all: 6, sm: 4, md: 3, lg: 3 };
9
+ const DEFAULT_COL_SIZES_WITHOUT_LOGO = { all: 6, sm: 4, md: 3, lg: 3 };
10
+ const DEFAULT_LOGO_COL_SIZES = { all: 12, md: 4 };
11
+ function NavigationColumns({ columns, hasLogo, colSizes, columnsPerRow }) {
12
+ const defaultColSizes = hasLogo
13
+ ? DEFAULT_COL_SIZES_WITH_LOGO
14
+ : DEFAULT_COL_SIZES_WITHOUT_LOGO;
15
+ const resolvedColSizes = React.useMemo(() => ({
16
+ all: colSizes?.all ?? defaultColSizes.all,
17
+ sm: colSizes?.sm ?? defaultColSizes.sm,
18
+ md: colSizes?.md ?? defaultColSizes.md,
19
+ lg: colSizes?.lg ?? defaultColSizes.lg,
20
+ }), [colSizes, defaultColSizes]);
21
+ const customColumnsStyle = columnsPerRow
22
+ ? {
23
+ '--pc-footer-navigation-column-width': `${100 / columnsPerRow}%`,
24
+ }
25
+ : undefined;
26
+ return (_jsx(Col, { className: b('columns-container'), children: _jsx(Row, { className: b('nav-row', { 'custom-columns': Boolean(columnsPerRow) }), style: customColumnsStyle, children: columns.map((column, columnIndex) => (_jsx(Col, { className: b('column'), sizes: resolvedColSizes, children: _jsxs("div", { className: b('column-inner'), children: [_jsx("h6", { className: b('column-title'), children: column.title }), _jsx("ul", { className: b('links'), children: column.links.map((link, linkIndex) => (_jsx("li", { className: b('link-item'), children: _jsx(Link, { href: link.url, className: b('link'), title: link.urlTitle, target: link.target, children: link.text }) }, linkIndex))) })] }) }, columnIndex))) }) }));
27
+ }
28
+ export const NavigationFloor = ({ columns, logoContent, colSizes, columnsPerRow, logoPlacement, }) => {
29
+ const isTopLogoPlacement = logoPlacement === 'top';
30
+ const hasSideLogo = Boolean(logoContent) && !isTopLogoPlacement;
31
+ return (_jsxs(Row, { className: b('floor', { navigation: true, 'logo-placement': logoPlacement }), children: [logoContent && isTopLogoPlacement && (_jsx(Col, { className: b('logo-col', { top: true }), sizes: { all: 12 }, children: logoContent })), logoContent && !isTopLogoPlacement && (_jsx(Col, { className: b('logo-col'), sizes: DEFAULT_LOGO_COL_SIZES, children: _jsx(Row, { children: logoContent }) })), _jsx(NavigationColumns, { columns: columns, hasLogo: hasSideLogo, colSizes: colSizes, columnsPerRow: columnsPerRow })] }));
32
+ };
33
+ //# sourceMappingURL=NavigationFloor.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"NavigationFloor.js","sourceRoot":"../../../../../../src","sources":["blocks/Footer/components/NavigationFloor/NavigationFloor.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {Link} from '@gravity-ui/uikit';\n\nimport type {GridColumnSizesType} from '../../../../grid';\nimport {Col, Row} from '../../../../grid';\nimport {FooterLinkColumn} from '../../../../models';\nimport {block} from '../../../../utils';\n\nimport './NavigationFloor.scss';\n\nconst b = block('footer-block');\n\nconst DEFAULT_COL_SIZES_WITH_LOGO: GridColumnSizesType = {all: 6, sm: 4, md: 3, lg: 3};\nconst DEFAULT_COL_SIZES_WITHOUT_LOGO: GridColumnSizesType = {all: 6, sm: 4, md: 3, lg: 3};\nconst DEFAULT_LOGO_COL_SIZES: GridColumnSizesType = {all: 12, md: 4};\n\ntype NavigationColumnsProps = {\n columns: FooterLinkColumn[];\n hasLogo: boolean;\n colSizes?: GridColumnSizesType;\n columnsPerRow?: number;\n};\n\nfunction NavigationColumns({columns, hasLogo, colSizes, columnsPerRow}: NavigationColumnsProps) {\n const defaultColSizes: GridColumnSizesType = hasLogo\n ? DEFAULT_COL_SIZES_WITH_LOGO\n : DEFAULT_COL_SIZES_WITHOUT_LOGO;\n const resolvedColSizes: GridColumnSizesType = React.useMemo(\n () => ({\n all: colSizes?.all ?? defaultColSizes.all,\n sm: colSizes?.sm ?? defaultColSizes.sm,\n md: colSizes?.md ?? defaultColSizes.md,\n lg: colSizes?.lg ?? defaultColSizes.lg,\n }),\n [colSizes, defaultColSizes],\n );\n const customColumnsStyle = columnsPerRow\n ? ({\n '--pc-footer-navigation-column-width': `${100 / columnsPerRow}%`,\n } as React.CSSProperties)\n : undefined;\n\n return (\n <Col className={b('columns-container')}>\n <Row\n className={b('nav-row', {'custom-columns': Boolean(columnsPerRow)})}\n style={customColumnsStyle}\n >\n {columns.map((column, columnIndex) => (\n <Col key={columnIndex} className={b('column')} sizes={resolvedColSizes}>\n <div className={b('column-inner')}>\n <h6 className={b('column-title')}>{column.title}</h6>\n <ul className={b('links')}>\n {column.links.map((link, linkIndex) => (\n <li key={linkIndex} className={b('link-item')}>\n <Link\n href={link.url}\n className={b('link')}\n title={link.urlTitle}\n target={link.target}\n >\n {link.text}\n </Link>\n </li>\n ))}\n </ul>\n </div>\n </Col>\n ))}\n </Row>\n </Col>\n );\n}\n\ntype NavigationFloorProps = {\n columns: FooterLinkColumn[];\n logoContent: React.ReactNode;\n colSizes?: GridColumnSizesType;\n columnsPerRow?: number;\n logoPlacement?: 'left' | 'top';\n};\n\nexport const NavigationFloor = ({\n columns,\n logoContent,\n colSizes,\n columnsPerRow,\n logoPlacement,\n}: NavigationFloorProps) => {\n const isTopLogoPlacement = logoPlacement === 'top';\n const hasSideLogo = Boolean(logoContent) && !isTopLogoPlacement;\n\n return (\n <Row className={b('floor', {navigation: true, 'logo-placement': logoPlacement})}>\n {logoContent && isTopLogoPlacement && (\n <Col className={b('logo-col', {top: true})} sizes={{all: 12}}>\n {logoContent}\n </Col>\n )}\n {logoContent && !isTopLogoPlacement && (\n <Col className={b('logo-col')} sizes={DEFAULT_LOGO_COL_SIZES}>\n <Row>{logoContent}</Row>\n </Col>\n )}\n <NavigationColumns\n columns={columns}\n hasLogo={hasSideLogo}\n colSizes={colSizes}\n columnsPerRow={columnsPerRow}\n />\n </Row>\n );\n};\n"]}
@@ -0,0 +1 @@
1
+ export { NavigationFloor } from "./NavigationFloor.js";
@@ -0,0 +1,2 @@
1
+ export { NavigationFloor } from "./NavigationFloor.js";
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"../../../../../../src","sources":["blocks/Footer/components/NavigationFloor/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,eAAe,EAAC,6BAA0B","sourcesContent":["export {NavigationFloor} from './NavigationFloor';\n"]}
@@ -0,0 +1,77 @@
1
+ /* use this for style redefinitions to awoid problems with
2
+ unpredictable css rules order in build */
3
+ .pc-footer-block__social-floor-inner {
4
+ display: flex;
5
+ flex-wrap: wrap;
6
+ align-items: center;
7
+ gap: 24px;
8
+ }
9
+ .pc-footer-block__social-floor-inner_title-position_top {
10
+ flex-direction: column;
11
+ align-items: unset;
12
+ }
13
+ .pc-footer-block__social-floor-inner_links-position_center {
14
+ align-items: center;
15
+ }
16
+ .pc-footer-block__social-floor-inner_links-position_center .pc-footer-block__social-icons-list {
17
+ justify-content: center;
18
+ }
19
+ .pc-footer-block__social-floor-inner_size_m .pc-footer-block__social-icons-list {
20
+ gap: 24px;
21
+ }
22
+ .pc-footer-block__social-floor-inner_size_m .pc-footer-block__social-icon-item {
23
+ width: 32px;
24
+ height: 32px;
25
+ }
26
+ .pc-footer-block__social-floor-inner_size_l .pc-footer-block__social-icons-list {
27
+ gap: var(--g-spacing-10);
28
+ }
29
+ .pc-footer-block__social-floor-inner_size_l .pc-footer-block__social-icon-item {
30
+ width: 48px;
31
+ height: 48px;
32
+ }
33
+ .pc-footer-block__social-icon-item {
34
+ margin-right: 0;
35
+ }
36
+ .pc-footer-block__social-floor-title {
37
+ font-size: var(--g-text-body-3-font-size);
38
+ line-height: var(--g-text-body-3-line-height);
39
+ font-weight: var(--g-text-accent-font-weight);
40
+ margin: 0;
41
+ color: var(--g-color-text-primary);
42
+ }
43
+ .pc-footer-block__social-icons-list {
44
+ display: flex;
45
+ flex-wrap: wrap;
46
+ align-items: center;
47
+ list-style: none;
48
+ margin: 0;
49
+ padding: 0;
50
+ }
51
+ .pc-footer-block__social-icons-item {
52
+ margin: 0;
53
+ transition: transform 200ms ease-in-out;
54
+ }
55
+ .pc-footer-block__social-icons-item:hover {
56
+ transform: translateY(-4px);
57
+ }
58
+ .pc-footer-block__social-icon-link, .pc-footer-block__social-icon-link:hover {
59
+ text-decoration: none;
60
+ color: var(--g-color-text-primary);
61
+ }
62
+ .pc-footer-block__social-icon-item {
63
+ margin-right: 0;
64
+ }
65
+ .pc-footer-block__social-icon-item_size_m {
66
+ width: 32px;
67
+ height: 32px;
68
+ }
69
+ .pc-footer-block__social-icon-item_size_l {
70
+ width: 48px;
71
+ height: 48px;
72
+ }
73
+ @media (max-width: 577px) {
74
+ .pc-footer-block__floor_social.col {
75
+ padding: 24px 0;
76
+ }
77
+ }
@@ -0,0 +1,7 @@
1
+ import type { FooterBlockProps } from "../../../../models/index.js";
2
+ import './SocialFloor.css';
3
+ type SocialFloorProps = {
4
+ contacts: NonNullable<FooterBlockProps['contacts']>;
5
+ };
6
+ export declare const SocialFloor: ({ contacts }: SocialFloorProps) => import("react/jsx-runtime").JSX.Element | null;
7
+ export {};