@cloud-ru/uikit-product-site-section 1.7.18 → 1.7.19-preview-60906cd3.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.
- package/dist/cjs/components/SectionBasic/SectionBasic.js +4 -1
- package/dist/cjs/helperComponents/SectionTitle/SectionTitle.d.ts +2 -2
- package/dist/esm/components/SectionBasic/SectionBasic.js +4 -1
- package/dist/esm/helperComponents/SectionTitle/SectionTitle.d.ts +2 -2
- package/package.json +25 -26
- package/src/components/SectionBasic/SectionBasic.tsx +6 -2
- package/src/helperComponents/SectionTitle/SectionTitle.tsx +1 -1
|
@@ -42,5 +42,8 @@ function SectionBasic(_a) {
|
|
|
42
42
|
const [currentTab, setCurrentTab] = (0, react_1.useState)(getInitialTab(tabBarItems));
|
|
43
43
|
const { t } = (0, uikit_product_locale_1.useLocale)('SiteSection');
|
|
44
44
|
const showFooter = Boolean(pagination || moreButton);
|
|
45
|
-
return ((0, jsx_runtime_1.jsx)(uikit_product_site_layout_1.Layout.SectionWrapper, Object.assign({ id: id, layoutType: layoutType, className: (0, classnames_1.default)(className, styles_module_scss_1.default.wrapper), "data-section-background": backgroundColor }, (0, uikit_product_utils_1.extractSupportProps)(rest), { children: (0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.sectionBasic, "data-layout-type": layoutType, children: [(0, jsx_runtime_1.jsx)(helperComponents_1.SectionTitle, { layoutType: layoutType, title: title, description: description, titleSectionSize: titleSectionSize, titleTag: titleTag, titleAlign: titleAlign, subtitle: subtitle, subtitleTag: subtitleTag, appearance: (0, utils_1.getAppearanceByBackground)(backgroundColor) }), (tabBarItems === null || tabBarItems === void 0 ? void 0 : tabBarItems.length) && ((0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.sectionTabs, children: (0, jsx_runtime_1.jsx)(tabs_1.Tabs, { value: currentTab, onChange: setCurrentTab, children: (0, jsx_runtime_1.jsx)(tabs_1.Tabs.TabBar, { children: tabBarItems.map(
|
|
45
|
+
return ((0, jsx_runtime_1.jsx)(uikit_product_site_layout_1.Layout.SectionWrapper, Object.assign({ id: id, layoutType: layoutType, className: (0, classnames_1.default)(className, styles_module_scss_1.default.wrapper), "data-section-background": backgroundColor }, (0, uikit_product_utils_1.extractSupportProps)(rest), { children: (0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.sectionBasic, "data-layout-type": layoutType, children: [(0, jsx_runtime_1.jsx)(helperComponents_1.SectionTitle, { layoutType: layoutType, title: title, description: description, titleSectionSize: titleSectionSize, titleTag: titleTag, titleAlign: titleAlign, subtitle: subtitle, subtitleTag: subtitleTag, appearance: (0, utils_1.getAppearanceByBackground)(backgroundColor) }), (tabBarItems === null || tabBarItems === void 0 ? void 0 : tabBarItems.length) && ((0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.sectionTabs, children: (0, jsx_runtime_1.jsx)(tabs_1.Tabs, { value: currentTab, onChange: setCurrentTab, children: (0, jsx_runtime_1.jsx)(tabs_1.Tabs.TabBar, { children: tabBarItems.map((_a) => {
|
|
46
|
+
var { counter } = _a, tabProps = __rest(_a, ["counter"]);
|
|
47
|
+
return ((0, jsx_runtime_1.jsx)(tabs_1.Tabs.Tab, Object.assign({}, tabProps, { counter: counter === undefined ? undefined : { label: counter } }), tabProps.value));
|
|
48
|
+
}) }) }) })), (filterItems === null || filterItems === void 0 ? void 0 : filterItems.length) && ((0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.sectionFilters, "data-layout-type": layoutType, children: filterItems.map(filterProps => ((0, jsx_runtime_1.jsx)(uikit_product_mobile_fields_1.AdaptiveFieldSelect, Object.assign({}, filterProps, { className: (0, classnames_1.default)(filterProps.className, styles_module_scss_1.default.filter), layoutType: layoutType, size: 'l' }), filterProps.id))) })), children, showFooter && ((0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.footer, "data-layout-type": layoutType, children: [pagination && (0, jsx_runtime_1.jsx)(pagination_1.Pagination, Object.assign({}, pagination)), moreButton && ((0, jsx_runtime_1.jsx)(button_1.ButtonOutline, { className: styles_module_scss_1.default.showMoreButton, label: (_b = moreButton.label) !== null && _b !== void 0 ? _b : t('Basic.showMore'), onClick: moreButton.onClick, href: moreButton.href, "data-test-id": (_c = moreButton['data-test-id']) !== null && _c !== void 0 ? _c : 'section__more-btn', appearance: 'neutral', size: 'l', type: 'button', "data-layout-type": layoutType }))] }))] }) })));
|
|
46
49
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { WithLayoutType } from '@cloud-ru/uikit-product-utils';
|
|
2
|
-
import {
|
|
2
|
+
import { PickLinkProps } from '@snack-uikit/link';
|
|
3
3
|
import { SectionTag, Size } from './types';
|
|
4
4
|
export type SectionTitleProps = WithLayoutType<{
|
|
5
5
|
/** Название секции */
|
|
@@ -7,7 +7,7 @@ export type SectionTitleProps = WithLayoutType<{
|
|
|
7
7
|
/** Подзаголовок секции */
|
|
8
8
|
subtitle?: string;
|
|
9
9
|
/** Ссылка в названии */
|
|
10
|
-
titleLink?: PickLinkProps<
|
|
10
|
+
titleLink?: PickLinkProps<'a', 'href' | 'onClick' | 'target' | 'appearance' | 'textMode'>;
|
|
11
11
|
/** Описание секции */
|
|
12
12
|
description?: string;
|
|
13
13
|
/** Размер шрифтов заголовка и подзаголовка */
|
|
@@ -36,5 +36,8 @@ export function SectionBasic(_a) {
|
|
|
36
36
|
const [currentTab, setCurrentTab] = useState(getInitialTab(tabBarItems));
|
|
37
37
|
const { t } = useLocale('SiteSection');
|
|
38
38
|
const showFooter = Boolean(pagination || moreButton);
|
|
39
|
-
return (_jsx(Layout.SectionWrapper, Object.assign({ id: id, layoutType: layoutType, className: cn(className, styles.wrapper), "data-section-background": backgroundColor }, extractSupportProps(rest), { children: _jsxs("div", { className: styles.sectionBasic, "data-layout-type": layoutType, children: [_jsx(SectionTitle, { layoutType: layoutType, title: title, description: description, titleSectionSize: titleSectionSize, titleTag: titleTag, titleAlign: titleAlign, subtitle: subtitle, subtitleTag: subtitleTag, appearance: getAppearanceByBackground(backgroundColor) }), (tabBarItems === null || tabBarItems === void 0 ? void 0 : tabBarItems.length) && (_jsx("div", { className: styles.sectionTabs, children: _jsx(Tabs, { value: currentTab, onChange: setCurrentTab, children: _jsx(Tabs.TabBar, { children: tabBarItems.map(
|
|
39
|
+
return (_jsx(Layout.SectionWrapper, Object.assign({ id: id, layoutType: layoutType, className: cn(className, styles.wrapper), "data-section-background": backgroundColor }, extractSupportProps(rest), { children: _jsxs("div", { className: styles.sectionBasic, "data-layout-type": layoutType, children: [_jsx(SectionTitle, { layoutType: layoutType, title: title, description: description, titleSectionSize: titleSectionSize, titleTag: titleTag, titleAlign: titleAlign, subtitle: subtitle, subtitleTag: subtitleTag, appearance: getAppearanceByBackground(backgroundColor) }), (tabBarItems === null || tabBarItems === void 0 ? void 0 : tabBarItems.length) && (_jsx("div", { className: styles.sectionTabs, children: _jsx(Tabs, { value: currentTab, onChange: setCurrentTab, children: _jsx(Tabs.TabBar, { children: tabBarItems.map((_a) => {
|
|
40
|
+
var { counter } = _a, tabProps = __rest(_a, ["counter"]);
|
|
41
|
+
return (_jsx(Tabs.Tab, Object.assign({}, tabProps, { counter: counter === undefined ? undefined : { label: counter } }), tabProps.value));
|
|
42
|
+
}) }) }) })), (filterItems === null || filterItems === void 0 ? void 0 : filterItems.length) && (_jsx("div", { className: styles.sectionFilters, "data-layout-type": layoutType, children: filterItems.map(filterProps => (_jsx(AdaptiveFieldSelect, Object.assign({}, filterProps, { className: cn(filterProps.className, styles.filter), layoutType: layoutType, size: 'l' }), filterProps.id))) })), children, showFooter && (_jsxs("div", { className: styles.footer, "data-layout-type": layoutType, children: [pagination && _jsx(Pagination, Object.assign({}, pagination)), moreButton && (_jsx(ButtonOutline, { className: styles.showMoreButton, label: (_b = moreButton.label) !== null && _b !== void 0 ? _b : t('Basic.showMore'), onClick: moreButton.onClick, href: moreButton.href, "data-test-id": (_c = moreButton['data-test-id']) !== null && _c !== void 0 ? _c : 'section__more-btn', appearance: 'neutral', size: 'l', type: 'button', "data-layout-type": layoutType }))] }))] }) })));
|
|
40
43
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { WithLayoutType } from '@cloud-ru/uikit-product-utils';
|
|
2
|
-
import {
|
|
2
|
+
import { PickLinkProps } from '@snack-uikit/link';
|
|
3
3
|
import { SectionTag, Size } from './types';
|
|
4
4
|
export type SectionTitleProps = WithLayoutType<{
|
|
5
5
|
/** Название секции */
|
|
@@ -7,7 +7,7 @@ export type SectionTitleProps = WithLayoutType<{
|
|
|
7
7
|
/** Подзаголовок секции */
|
|
8
8
|
subtitle?: string;
|
|
9
9
|
/** Ссылка в названии */
|
|
10
|
-
titleLink?: PickLinkProps<
|
|
10
|
+
titleLink?: PickLinkProps<'a', 'href' | 'onClick' | 'target' | 'appearance' | 'textMode'>;
|
|
11
11
|
/** Описание секции */
|
|
12
12
|
description?: string;
|
|
13
13
|
/** Размер шрифтов заголовка и подзаголовка */
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@cloud-ru/uikit-product-site-section",
|
|
3
3
|
"title": "Site Section",
|
|
4
|
-
"version": "1.7.
|
|
4
|
+
"version": "1.7.19-preview-60906cd3.0",
|
|
5
5
|
"sideEffects": [
|
|
6
6
|
"*.css",
|
|
7
7
|
"*.woff",
|
|
@@ -34,30 +34,29 @@
|
|
|
34
34
|
"publishConfig": {
|
|
35
35
|
"access": "public"
|
|
36
36
|
},
|
|
37
|
-
"scripts": {},
|
|
38
37
|
"dependencies": {
|
|
39
|
-
"@
|
|
40
|
-
"@
|
|
41
|
-
"@
|
|
42
|
-
"@
|
|
43
|
-
"@
|
|
44
|
-
"@
|
|
45
|
-
"@
|
|
46
|
-
"@
|
|
47
|
-
"@
|
|
48
|
-
"
|
|
49
|
-
"
|
|
50
|
-
"
|
|
51
|
-
"@
|
|
52
|
-
"@
|
|
53
|
-
"@
|
|
54
|
-
"@
|
|
55
|
-
"@
|
|
56
|
-
"@
|
|
57
|
-
"@
|
|
58
|
-
"
|
|
59
|
-
"
|
|
60
|
-
"
|
|
38
|
+
"@snack-uikit/accordion": "^1.0.1",
|
|
39
|
+
"@snack-uikit/button": "^1.0.1",
|
|
40
|
+
"@snack-uikit/card": "^1.0.1",
|
|
41
|
+
"@snack-uikit/carousel": "^1.0.1",
|
|
42
|
+
"@snack-uikit/link": "^1.0.1",
|
|
43
|
+
"@snack-uikit/pagination": "^1.0.1",
|
|
44
|
+
"@snack-uikit/tabs": "^1.0.1",
|
|
45
|
+
"@snack-uikit/typography": "^1.0.1",
|
|
46
|
+
"@snack-uikit/utils": "^5.0.0",
|
|
47
|
+
"classnames": "^2.5.1",
|
|
48
|
+
"lodash.debounce": "^4.0.8",
|
|
49
|
+
"uncontrollable": "^8.0.4",
|
|
50
|
+
"@cloud-ru/uikit-product-mobile-fields": "2.2.17-preview-60906cd3.0",
|
|
51
|
+
"@cloud-ru/uikit-product-icons": "18.2.1-preview-60906cd3.0",
|
|
52
|
+
"@cloud-ru/uikit-product-site-cards": "1.4.12-preview-60906cd3.0",
|
|
53
|
+
"@cloud-ru/uikit-product-site-case-card": "1.2.6-preview-60906cd3.0",
|
|
54
|
+
"@cloud-ru/uikit-product-site-grid": "1.1.4-preview-60906cd3.0",
|
|
55
|
+
"@cloud-ru/uikit-product-site-layout": "1.1.4-preview-60906cd3.0",
|
|
56
|
+
"@cloud-ru/uikit-product-site-media": "1.1.27-preview-60906cd3.0",
|
|
57
|
+
"@cloud-ru/uikit-product-site-table": "1.1.6-preview-60906cd3.0",
|
|
58
|
+
"@cloud-ru/uikit-product-utils": "9.1.1-preview-60906cd3.0",
|
|
59
|
+
"@cloud-ru/uikit-product-site-rich-text": "1.1.4-preview-60906cd3.0"
|
|
61
60
|
},
|
|
62
61
|
"devDependencies": {
|
|
63
62
|
"@types/lodash.debounce": "4.0.9"
|
|
@@ -67,5 +66,5 @@
|
|
|
67
66
|
"@cloud-ru/uikit-product-locale": "*",
|
|
68
67
|
"@snack-uikit/figma-tokens": "*"
|
|
69
68
|
},
|
|
70
|
-
"
|
|
71
|
-
}
|
|
69
|
+
"scripts": {}
|
|
70
|
+
}
|
|
@@ -111,8 +111,12 @@ export function SectionBasic({
|
|
|
111
111
|
<div className={styles.sectionTabs}>
|
|
112
112
|
<Tabs value={currentTab} onChange={setCurrentTab}>
|
|
113
113
|
<Tabs.TabBar>
|
|
114
|
-
{tabBarItems.map(tabProps => (
|
|
115
|
-
<Tabs.Tab
|
|
114
|
+
{tabBarItems.map(({ counter, ...tabProps }) => (
|
|
115
|
+
<Tabs.Tab
|
|
116
|
+
key={tabProps.value}
|
|
117
|
+
{...tabProps}
|
|
118
|
+
counter={counter === undefined ? undefined : { label: counter }}
|
|
119
|
+
/>
|
|
116
120
|
))}
|
|
117
121
|
</Tabs.TabBar>
|
|
118
122
|
</Tabs>
|
|
@@ -15,7 +15,7 @@ export type SectionTitleProps = WithLayoutType<{
|
|
|
15
15
|
/** Подзаголовок секции */
|
|
16
16
|
subtitle?: string;
|
|
17
17
|
/** Ссылка в названии */
|
|
18
|
-
titleLink?: PickLinkProps<
|
|
18
|
+
titleLink?: PickLinkProps<'a', 'href' | 'onClick' | 'target' | 'appearance' | 'textMode'>;
|
|
19
19
|
/** Описание секции */
|
|
20
20
|
description?: string;
|
|
21
21
|
/** Размер шрифтов заголовка и подзаголовка */
|