@redneckz/wildless-cms-uni-blocks 0.8.18 → 0.8.19
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/bundle/blocks.schema.json +1 -1
- package/bundle/bundle.umd.js +20 -16
- package/bundle/bundle.umd.min.js +1 -1
- package/bundle/ui-kit/SwipeListControl/SwipeListContainer.d.ts +0 -2
- package/bundle/ui-kit/SwipeListControl/SwipeListControlContent.d.ts +2 -7
- package/bundle/ui-kit/SwipeListControl/SwipeListControlDots.d.ts +1 -1
- package/bundle/ui-kit/SwipeListControl/SwipeListControlProps.d.ts +12 -3
- package/bundle/ui-kit/SwipeListControl/getContainerHeight.d.ts +4 -0
- package/dist/components/CarouselLinks/CarouselLinks.js +1 -1
- package/dist/ui-kit/LinkButton/LinkButton.js +4 -4
- package/dist/ui-kit/LinkButton/LinkButton.js.map +1 -1
- package/dist/ui-kit/SwipeListControl/SwipeListContainer.d.ts +0 -2
- package/dist/ui-kit/SwipeListControl/SwipeListContainer.js +4 -8
- package/dist/ui-kit/SwipeListControl/SwipeListContainer.js.map +1 -1
- package/dist/ui-kit/SwipeListControl/SwipeListControl.js +2 -2
- package/dist/ui-kit/SwipeListControl/SwipeListControl.js.map +1 -1
- package/dist/ui-kit/SwipeListControl/SwipeListControlContent.d.ts +2 -7
- package/dist/ui-kit/SwipeListControl/SwipeListControlDots.d.ts +1 -1
- package/dist/ui-kit/SwipeListControl/SwipeListControlProps.d.ts +12 -3
- package/dist/ui-kit/SwipeListControl/getContainerHeight.d.ts +4 -0
- package/dist/ui-kit/SwipeListControl/getContainerHeight.js +13 -0
- package/dist/ui-kit/SwipeListControl/getContainerHeight.js.map +1 -0
- package/lib/components/CarouselLinks/CarouselLinks.js +1 -1
- package/lib/ui-kit/LinkButton/LinkButton.js +4 -4
- package/lib/ui-kit/LinkButton/LinkButton.js.map +1 -1
- package/lib/ui-kit/SwipeListControl/SwipeListContainer.d.ts +0 -2
- package/lib/ui-kit/SwipeListControl/SwipeListContainer.js +4 -8
- package/lib/ui-kit/SwipeListControl/SwipeListContainer.js.map +1 -1
- package/lib/ui-kit/SwipeListControl/SwipeListControl.js +2 -2
- package/lib/ui-kit/SwipeListControl/SwipeListControl.js.map +1 -1
- package/lib/ui-kit/SwipeListControl/SwipeListControlContent.d.ts +2 -7
- package/lib/ui-kit/SwipeListControl/SwipeListControlDots.d.ts +1 -1
- package/lib/ui-kit/SwipeListControl/SwipeListControlProps.d.ts +12 -3
- package/lib/ui-kit/SwipeListControl/getContainerHeight.d.ts +4 -0
- package/lib/ui-kit/SwipeListControl/getContainerHeight.js +10 -0
- package/lib/ui-kit/SwipeListControl/getContainerHeight.js.map +1 -0
- package/mobile/bundle/bundle.umd.js +16 -11
- package/mobile/bundle/bundle.umd.min.js +1 -1
- package/mobile/bundle/ui-kit/SwipeListControl/SwipeListContainer.d.ts +0 -2
- package/mobile/bundle/ui-kit/SwipeListControl/SwipeListControlContent.d.ts +2 -7
- package/mobile/bundle/ui-kit/SwipeListControl/SwipeListControlDots.d.ts +1 -1
- package/mobile/bundle/ui-kit/SwipeListControl/SwipeListControlProps.d.ts +12 -3
- package/mobile/bundle/ui-kit/SwipeListControl/getContainerHeight.d.ts +4 -0
- package/mobile/dist/components/CarouselLinks/CarouselLinks.js +1 -1
- package/mobile/dist/ui-kit/LinkButton/LinkButton.js +4 -4
- package/mobile/dist/ui-kit/LinkButton/LinkButton.js.map +1 -1
- package/mobile/dist/ui-kit/SwipeListControl/SwipeListContainer.d.ts +0 -2
- package/mobile/dist/ui-kit/SwipeListControl/SwipeListContainer.js +4 -8
- package/mobile/dist/ui-kit/SwipeListControl/SwipeListContainer.js.map +1 -1
- package/mobile/dist/ui-kit/SwipeListControl/SwipeListControl.js +2 -2
- package/mobile/dist/ui-kit/SwipeListControl/SwipeListControl.js.map +1 -1
- package/mobile/dist/ui-kit/SwipeListControl/SwipeListControlContent.d.ts +2 -7
- package/mobile/dist/ui-kit/SwipeListControl/SwipeListControlDots.d.ts +1 -1
- package/mobile/dist/ui-kit/SwipeListControl/SwipeListControlProps.d.ts +12 -3
- package/mobile/dist/ui-kit/SwipeListControl/getContainerHeight.d.ts +4 -0
- package/mobile/dist/ui-kit/SwipeListControl/getContainerHeight.js +13 -0
- package/mobile/dist/ui-kit/SwipeListControl/getContainerHeight.js.map +1 -0
- package/mobile/lib/components/CarouselLinks/CarouselLinks.js +1 -1
- package/mobile/lib/ui-kit/LinkButton/LinkButton.js +4 -4
- package/mobile/lib/ui-kit/LinkButton/LinkButton.js.map +1 -1
- package/mobile/lib/ui-kit/SwipeListControl/SwipeListContainer.d.ts +0 -2
- package/mobile/lib/ui-kit/SwipeListControl/SwipeListContainer.js +4 -8
- package/mobile/lib/ui-kit/SwipeListControl/SwipeListContainer.js.map +1 -1
- package/mobile/lib/ui-kit/SwipeListControl/SwipeListControl.js +2 -2
- package/mobile/lib/ui-kit/SwipeListControl/SwipeListControl.js.map +1 -1
- package/mobile/lib/ui-kit/SwipeListControl/SwipeListControlContent.d.ts +2 -7
- package/mobile/lib/ui-kit/SwipeListControl/SwipeListControlDots.d.ts +1 -1
- package/mobile/lib/ui-kit/SwipeListControl/SwipeListControlProps.d.ts +12 -3
- package/mobile/lib/ui-kit/SwipeListControl/getContainerHeight.d.ts +4 -0
- package/mobile/lib/ui-kit/SwipeListControl/getContainerHeight.js +10 -0
- package/mobile/lib/ui-kit/SwipeListControl/getContainerHeight.js.map +1 -0
- package/mobile/src/components/CarouselLinks/CarouselLinks.tsx +1 -1
- package/mobile/src/components/CarouselLinks/CarouselLinks.ui.json +8 -0
- package/mobile/src/ui-kit/LinkButton/LinkButton.tsx +7 -7
- package/mobile/src/ui-kit/SwipeListControl/SwipeListContainer.tsx +4 -10
- package/mobile/src/ui-kit/SwipeListControl/SwipeListControl.tsx +2 -0
- package/mobile/src/ui-kit/SwipeListControl/SwipeListControlContent.ts +2 -8
- package/mobile/src/ui-kit/SwipeListControl/SwipeListControlDots.tsx +1 -1
- package/mobile/src/ui-kit/SwipeListControl/SwipeListControlProps.ts +14 -3
- package/mobile/src/ui-kit/SwipeListControl/getContainerHeight.ts +10 -0
- package/package.json +1 -1
- package/src/components/CarouselLinks/CarouselLinks.tsx +1 -1
- package/src/components/CarouselLinks/CarouselLinks.ui.json +8 -0
- package/src/ui-kit/LinkButton/LinkButton.tsx +7 -7
- package/src/ui-kit/SwipeListControl/SwipeListContainer.tsx +4 -10
- package/src/ui-kit/SwipeListControl/SwipeListControl.tsx +2 -0
- package/src/ui-kit/SwipeListControl/SwipeListControlContent.ts +2 -8
- package/src/ui-kit/SwipeListControl/SwipeListControlDots.tsx +1 -1
- package/src/ui-kit/SwipeListControl/SwipeListControlProps.ts +14 -3
- package/src/ui-kit/SwipeListControl/getContainerHeight.ts +10 -0
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import type { SwipeListControlType } from './SwipeListControlContent';
|
|
2
1
|
import type { SwipeContainerProps } from './SwipeListControlProps';
|
|
3
2
|
declare type ItemsVisibilityList = Array<IntersectionObserverEntry | undefined>;
|
|
4
3
|
declare type SwipeListItemWidthAuto = 0;
|
|
@@ -15,7 +14,6 @@ interface SwipeListContainerProps extends SwipeContainerProps {
|
|
|
15
14
|
snapAlign?: 'snap-start' | 'snap-center' | 'snap-end';
|
|
16
15
|
onVisibleItemsChange?: (itemsVisibilityList: ItemsVisibilityList) => void;
|
|
17
16
|
onVisibleIndicesChange?: (indices: number[]) => void;
|
|
18
|
-
listType?: SwipeListControlType;
|
|
19
17
|
}
|
|
20
18
|
export declare const SwipeListContainer: import("@redneckz/uni-jsx").UNIComponent<SwipeListContainerProps, any, any>;
|
|
21
19
|
export {};
|
|
@@ -1,15 +1,10 @@
|
|
|
1
1
|
import type { BlockVersion } from '../../model/BlockVersion';
|
|
2
|
-
|
|
3
|
-
* @title Вид
|
|
4
|
-
* @enumNames ["Горизонтальный", "Вертикальный"]
|
|
5
|
-
*/
|
|
6
|
-
export declare type SwipeListControlType = 'horizontal-list' | 'vertical-list';
|
|
2
|
+
import type { SwipeContainerProps } from './SwipeListControlProps';
|
|
7
3
|
/**
|
|
8
4
|
* @title Swipe-контроллер
|
|
9
5
|
*/
|
|
10
|
-
export interface SwipeListControlContent {
|
|
6
|
+
export interface SwipeListControlContent extends SwipeContainerProps {
|
|
11
7
|
/** @title Точки-индикаторы */
|
|
12
8
|
showDots?: boolean;
|
|
13
|
-
listType?: SwipeListControlType;
|
|
14
9
|
version?: BlockVersion;
|
|
15
10
|
}
|
|
@@ -1,12 +1,21 @@
|
|
|
1
1
|
import type { SwipeListControlContent } from './SwipeListControlContent';
|
|
2
2
|
/**
|
|
3
|
-
* @title
|
|
3
|
+
* @title Вид
|
|
4
|
+
* @enumNames ["Горизонтальный", "Вертикальный"]
|
|
4
5
|
*/
|
|
6
|
+
export declare type SwipeListControlType = 'horizontal-list' | 'vertical-list';
|
|
7
|
+
/**
|
|
8
|
+
* @title Минимальная высота
|
|
9
|
+
* @enumNames ['Стандартная', 'Маленькая']
|
|
10
|
+
*/
|
|
11
|
+
export declare type ContainerMinHeight = 866 | 720;
|
|
5
12
|
export interface SwipeContainerProps {
|
|
6
|
-
/** @
|
|
13
|
+
/** @hidden */
|
|
7
14
|
gap?: number;
|
|
8
|
-
/** @
|
|
15
|
+
/** @hidden */
|
|
9
16
|
padding?: number;
|
|
17
|
+
listType?: SwipeListControlType;
|
|
18
|
+
minHeight?: ContainerMinHeight;
|
|
10
19
|
}
|
|
11
20
|
/**
|
|
12
21
|
* @title Swipe-контроллер
|
|
@@ -7,7 +7,7 @@ const LinkButton_1 = require("../../ui-kit/LinkButton/LinkButton");
|
|
|
7
7
|
const Paragraph_1 = require("../../ui-kit/Paragraph/Paragraph");
|
|
8
8
|
const Carousel_1 = require("../Carousel/Carousel");
|
|
9
9
|
const Headline_1 = require("../Headline/Headline");
|
|
10
|
-
const MAX_LINKS_COUNT =
|
|
10
|
+
const MAX_LINKS_COUNT = 10;
|
|
11
11
|
exports.CarouselLinks = (0, uni_jsx_1.JSX)(({ className = '', additionalDescription, description, links, title, version = 'secondary', ...rest }) => {
|
|
12
12
|
return ((0, jsx_runtime_1.jsxs)(BlockWrapper_1.BlockWrapper, { className: `flex w-full p-10 overflow-hidden justify-between ${className}`, version: version, ...rest, children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col max-w-96 pr-9 text-white text-xl-light", children: [(0, jsx_runtime_1.jsx)(Headline_1.Headline, { className: "p-0", title: title, description: description, as: "h1", align: "text-left" }), additionalDescription ? ((0, jsx_runtime_1.jsx)("div", { className: "pt-6", children: (0, jsx_runtime_1.jsx)(Paragraph_1.Paragraph, { children: additionalDescription }) })) : null] }), links?.length ? renderLinks(links) : null] }));
|
|
13
13
|
});
|
|
@@ -3,14 +3,14 @@ exports.LinkButton = void 0;
|
|
|
3
3
|
const jsx_runtime_1 = require("@redneckz/uni-jsx/jsx-runtime");
|
|
4
4
|
const uni_jsx_1 = require("@redneckz/uni-jsx");
|
|
5
5
|
const Img_1 = require("../Img/Img");
|
|
6
|
+
const useLink_1 = require("../../hooks/useLink");
|
|
6
7
|
const LINK_CLASS_NAME = `absolute border border-primary-main ml-3 px-6 py-5
|
|
7
8
|
text-l-light bg-white text-primary-text flex w-[316px]
|
|
8
9
|
justify-between items-center group-hover/link:text-primary-main z-10`;
|
|
9
10
|
const LINK_BORDER_CLASS_NAME = 'bg-transparent border-white border h-[70px] absolute w-[316px] top-0';
|
|
10
11
|
exports.LinkButton = (0, uni_jsx_1.JSX)(({ text, href = '', target = '', className = '' }) => {
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
}
|
|
14
|
-
return ((0, jsx_runtime_1.jsxs)("div", { className: `relative group/link cursor-pointer w-[328px] h-[82px] ${className}`, children: [(0, jsx_runtime_1.jsxs)("a", { className: LINK_CLASS_NAME, role: "link", href: href, target: target, children: [(0, jsx_runtime_1.jsx)("div", { className: "p-0.5", children: text }), (0, jsx_runtime_1.jsx)("div", { className: "w-6 h-6", children: (0, jsx_runtime_1.jsx)(Img_1.Img, { className: "w-4 h-4 min-w-4 min-h-4 rounded-full box-border brightness-0 group-hover/link:brightness-100", image: { icon: 'ArrowRightIcon', iconVersion: 'black' }, imageClassName: "group-hover/link:text-primary-main", width: "24", height: "24", asSVG: true }) })] }), (0, jsx_runtime_1.jsx)("div", { className: `${LINK_BORDER_CLASS_NAME} mx-1.5 mt-1.5` }), (0, jsx_runtime_1.jsx)("div", { className: `${LINK_BORDER_CLASS_NAME} mt-3 mr-3` })] }));
|
|
12
|
+
const link = (0, useLink_1.useLink)();
|
|
13
|
+
const adjustedProps = link({ href, target });
|
|
14
|
+
return text ? ((0, jsx_runtime_1.jsxs)("div", { className: `relative group/link cursor-pointer w-[328px] h-[82px] ${className}`, children: [(0, jsx_runtime_1.jsxs)("a", { className: LINK_CLASS_NAME, role: "link", ...adjustedProps, children: [(0, jsx_runtime_1.jsx)("div", { className: "p-0.5", children: text }), (0, jsx_runtime_1.jsx)("div", { className: "w-6 h-6", children: (0, jsx_runtime_1.jsx)(Img_1.Img, { className: "w-4 h-4 min-w-4 min-h-4 rounded-full box-border brightness-0 group-hover/link:brightness-100", image: { icon: 'ArrowRightIcon', iconVersion: 'black' }, imageClassName: "group-hover/link:text-primary-main", width: "24", height: "24", asSVG: true }) })] }), (0, jsx_runtime_1.jsx)("div", { className: `${LINK_BORDER_CLASS_NAME} mx-1.5 mt-1.5` }), (0, jsx_runtime_1.jsx)("div", { className: `${LINK_BORDER_CLASS_NAME} mt-3 mr-3` })] })) : null;
|
|
15
15
|
});
|
|
16
16
|
//# sourceMappingURL=LinkButton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LinkButton.js","sourceRoot":"","sources":["../../../src/ui-kit/LinkButton/LinkButton.tsx"],"names":[],"mappings":";;;AAAA,+CAAwC;
|
|
1
|
+
{"version":3,"file":"LinkButton.js","sourceRoot":"","sources":["../../../src/ui-kit/LinkButton/LinkButton.tsx"],"names":[],"mappings":";;;AAAA,+CAAwC;AACxC,oCAAiC;AACjC,iDAA8C;AAG9C,MAAM,eAAe,GAAG;;uEAE+C,CAAC;AAExE,MAAM,sBAAsB,GAC1B,sEAAsE,CAAC;AAM5D,QAAA,UAAU,GAAG,IAAA,aAAG,EAC3B,CAAC,EAAE,IAAI,EAAE,IAAI,GAAG,EAAE,EAAE,MAAM,GAAG,EAAE,EAAE,SAAS,GAAG,EAAE,EAAE,EAAE,EAAE;IACnD,MAAM,IAAI,GAAG,IAAA,iBAAO,GAAE,CAAC;IACvB,MAAM,aAAa,GAAG,IAAI,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC,CAAC;IAE7C,OAAO,IAAI,CAAC,CAAC,CAAC,CACZ,iCAAK,SAAS,EAAE,yDAAyD,SAAS,EAAE,aAClF,+BAAG,SAAS,EAAE,eAAe,EAAE,IAAI,EAAC,MAAM,KAAK,aAAa,aAC1D,gCAAK,SAAS,EAAC,OAAO,YAAE,IAAI,GAAO,EACnC,gCAAK,SAAS,EAAC,SAAS,YACtB,uBAAC,SAAG,IACF,SAAS,EAAC,8FAA8F,EACxG,KAAK,EAAE,EAAE,IAAI,EAAE,gBAAgB,EAAE,WAAW,EAAE,OAAO,EAAE,EACvD,cAAc,EAAC,oCAAoC,EACnD,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,KAAK,SACL,GACE,IACJ,EACJ,gCAAK,SAAS,EAAE,GAAG,sBAAsB,gBAAgB,GAAI,EAC7D,gCAAK,SAAS,EAAE,GAAG,sBAAsB,YAAY,GAAI,IACrD,CACP,CAAC,CAAC,CAAC,IAAI,CAAC;AACX,CAAC,CACF,CAAC"}
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import type { SwipeListControlType } from './SwipeListControlContent';
|
|
2
1
|
import type { SwipeContainerProps } from './SwipeListControlProps';
|
|
3
2
|
declare type ItemsVisibilityList = Array<IntersectionObserverEntry | undefined>;
|
|
4
3
|
declare type SwipeListItemWidthAuto = 0;
|
|
@@ -15,7 +14,6 @@ interface SwipeListContainerProps extends SwipeContainerProps {
|
|
|
15
14
|
snapAlign?: 'snap-start' | 'snap-center' | 'snap-end';
|
|
16
15
|
onVisibleItemsChange?: (itemsVisibilityList: ItemsVisibilityList) => void;
|
|
17
16
|
onVisibleIndicesChange?: (indices: number[]) => void;
|
|
18
|
-
listType?: SwipeListControlType;
|
|
19
17
|
}
|
|
20
18
|
export declare const SwipeListContainer: import("@redneckz/uni-jsx").UNIComponent<SwipeListContainerProps, any, any>;
|
|
21
19
|
export {};
|
|
@@ -5,10 +5,10 @@ const uni_jsx_1 = require("@redneckz/uni-jsx");
|
|
|
5
5
|
const hooks_1 = require("@redneckz/uni-jsx/lib/hooks");
|
|
6
6
|
const mapChildren_1 = require("../../utils/mapChildren");
|
|
7
7
|
const style_1 = require("../../utils/style");
|
|
8
|
+
const getContainerHeight_1 = require("./getContainerHeight");
|
|
8
9
|
const SwipeListItem_1 = require("./SwipeListItem");
|
|
9
10
|
const childStyleMap = ['min-w-[100%]', 'min-w-[50%]', 'min-w-[33.33%]', 'min-w-[25%]'];
|
|
10
|
-
|
|
11
|
-
exports.SwipeListContainer = (0, uni_jsx_1.JSX)(({ className = '', containerRef, activeIndex, visibleItemCount = 0, gap = 0, padding = 0, listType = 'horizontal-list', snapAlign = 'snap-center', children, onVisibleItemsChange, onVisibleIndicesChange, }) => {
|
|
11
|
+
exports.SwipeListContainer = (0, uni_jsx_1.JSX)(({ className = '', containerRef, activeIndex, visibleItemCount = 0, gap = 0, padding = 0, listType = 'horizontal-list', snapAlign = 'snap-center', minHeight, children, onVisibleItemsChange, onVisibleIndicesChange, }) => {
|
|
12
12
|
const observerOptions = {
|
|
13
13
|
sensitivity: 1,
|
|
14
14
|
rootRef: containerRef,
|
|
@@ -26,14 +26,10 @@ exports.SwipeListContainer = (0, uni_jsx_1.JSX)(({ className = '', containerRef,
|
|
|
26
26
|
const isHorizontalList = listType === 'horizontal-list';
|
|
27
27
|
const containerStyle = {
|
|
28
28
|
...(isHorizontalList ? getContainerOffset(padding, additionPadding) : {}),
|
|
29
|
-
...(isVerticalList ?
|
|
29
|
+
...(isVerticalList ? (0, getContainerHeight_1.getContainerHeight)(minHeight) : {}),
|
|
30
30
|
gap: `${gap}px`,
|
|
31
31
|
};
|
|
32
|
-
|
|
33
|
-
...(isHorizontalList ? getContainerOffset(padding / 4) : {}),
|
|
34
|
-
maxHeight: DEFAULT_HEIGHT,
|
|
35
|
-
};
|
|
36
|
-
return ((0, jsx_runtime_1.jsx)("div", { className: (0, style_1.style)('box-border overflow-auto no-scrollbar', listType, className), style: containerStyle, role: "list", ref: containerRef, children: (0, mapChildren_1.mapChildren)((child, idx) => ((0, jsx_runtime_1.jsx)(SwipeListItem_1.SwipeListItem, { className: (0, style_1.style)(snapAlign, visibleItemCount ? childStyleMap[visibleItemCount - 1] : '', isVerticalList ? 'h-full' : ''), style: itemContainerStyle, activeIndex: activeIndex, idx: idx, observerOptions: observerOptions, onIntersection: handleIntersection, children: child }, String(idx))))(children) }));
|
|
32
|
+
return ((0, jsx_runtime_1.jsx)("div", { className: (0, style_1.style)('box-border overflow-auto no-scrollbar', listType, className), style: containerStyle, role: "list", ref: containerRef, children: (0, mapChildren_1.mapChildren)((child, idx) => ((0, jsx_runtime_1.jsx)(SwipeListItem_1.SwipeListItem, { className: (0, style_1.style)(snapAlign, visibleItemCount ? childStyleMap[visibleItemCount - 1] : '', isVerticalList ? 'h-full' : ''), style: isHorizontalList ? getContainerOffset(padding / 4) : {}, activeIndex: activeIndex, idx: idx, observerOptions: observerOptions, onIntersection: handleIntersection, children: child }, String(idx))))(children) }));
|
|
37
33
|
});
|
|
38
34
|
// Styles used to compensate outer container padding to get rid of clipping effect
|
|
39
35
|
const getContainerOffset = (padding, additionalPadding = 0) => ({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SwipeListContainer.js","sourceRoot":"","sources":["../../../src/ui-kit/SwipeListControl/SwipeListContainer.tsx"],"names":[],"mappings":";;;AAAA,+CAAwC;AACxC,uDAAkE;AAElE,yDAAsD;AACtD,6CAA0C;
|
|
1
|
+
{"version":3,"file":"SwipeListContainer.js","sourceRoot":"","sources":["../../../src/ui-kit/SwipeListControl/SwipeListContainer.tsx"],"names":[],"mappings":"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"}
|
|
@@ -13,13 +13,13 @@ const DEFAULT_GAP = 14;
|
|
|
13
13
|
and get rid of a clipping effect caused by overflow: hidden.
|
|
14
14
|
*/
|
|
15
15
|
const DEFAULT_PADDING = 16;
|
|
16
|
-
exports.SwipeListControl = (0, uni_jsx_1.JSX)(({ className = '', gap = DEFAULT_GAP, padding = DEFAULT_PADDING, showDots = true, children, onVisibleIndicesChange, listType = 'horizontal-list', }) => {
|
|
16
|
+
exports.SwipeListControl = (0, uni_jsx_1.JSX)(({ className = '', gap = DEFAULT_GAP, padding = DEFAULT_PADDING, showDots = true, minHeight, children, onVisibleIndicesChange, listType = 'horizontal-list', }) => {
|
|
17
17
|
const itemCount = Array.isArray(children) ? children.length : 0;
|
|
18
18
|
const [containerRef, scroll] = (0, useSwipeListScroll_1.useSwipeListScroll)({
|
|
19
19
|
itemCount,
|
|
20
20
|
onVisibleIndicesChange,
|
|
21
21
|
});
|
|
22
22
|
const [activeIndex] = scroll.visibleIndicesRange;
|
|
23
|
-
return ((0, jsx_runtime_1.jsxs)("div", { className: (0, style_1.style)(className, listType === 'vertical-list' ? 'relative h-full' : ''), children: [(0, jsx_runtime_1.jsx)(SwipeListContainer_1.SwipeListContainer, { containerRef: containerRef, activeIndex: activeIndex, visibleItemCount: 1, gap: gap, padding: padding, onVisibleIndicesChange: scroll.handleVisibleIndicesChange, listType: listType, children: children }), showDots ? ((0, jsx_runtime_1.jsx)(SwipeListControlDots_1.SwipeListControlDots, { containerRef: containerRef, activeIndex: activeIndex, dotCount: itemCount, listType: listType })) : null] }));
|
|
23
|
+
return ((0, jsx_runtime_1.jsxs)("div", { className: (0, style_1.style)(className, listType === 'vertical-list' ? 'relative h-full' : ''), children: [(0, jsx_runtime_1.jsx)(SwipeListContainer_1.SwipeListContainer, { containerRef: containerRef, activeIndex: activeIndex, visibleItemCount: 1, gap: gap, padding: padding, onVisibleIndicesChange: scroll.handleVisibleIndicesChange, listType: listType, minHeight: minHeight, children: children }), showDots ? ((0, jsx_runtime_1.jsx)(SwipeListControlDots_1.SwipeListControlDots, { containerRef: containerRef, activeIndex: activeIndex, dotCount: itemCount, listType: listType })) : null] }));
|
|
24
24
|
});
|
|
25
25
|
//# sourceMappingURL=SwipeListControl.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SwipeListControl.js","sourceRoot":"","sources":["../../../src/ui-kit/SwipeListControl/SwipeListControl.tsx"],"names":[],"mappings":";;;AAAA,+CAAwC;AACxC,6CAA0C;AAC1C,6DAA0D;AAC1D,iEAA8D;AAE9D,6DAA0D;AAE1D,MAAM,WAAW,GAAG,EAAE,CAAC;AAEvB;;;;GAIG;AACH,MAAM,eAAe,GAAG,EAAE,CAAC;AAEd,QAAA,gBAAgB,GAAG,IAAA,aAAG,EACjC,CAAC,EACC,SAAS,GAAG,EAAE,EACd,GAAG,GAAG,WAAW,EACjB,OAAO,GAAG,eAAe,EACzB,QAAQ,GAAG,IAAI,EACf,QAAQ,EACR,sBAAsB,EACtB,QAAQ,GAAG,iBAAiB,GAC7B,EAAE,EAAE;IACH,MAAM,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;IAEhE,MAAM,CAAC,YAAY,EAAE,MAAM,CAAC,GAAG,IAAA,uCAAkB,EAAiB;QAChE,SAAS;QACT,sBAAsB;KACvB,CAAC,CAAC;IACH,MAAM,CAAC,WAAW,CAAC,GAAG,MAAM,CAAC,mBAAmB,CAAC;IAEjD,OAAO,CACL,iCAAK,SAAS,EAAE,IAAA,aAAK,EAAC,SAAS,EAAE,QAAQ,KAAK,eAAe,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,CAAC,aACrF,uBAAC,uCAAkB,IACjB,YAAY,EAAE,YAAY,EAC1B,WAAW,EAAE,WAAW,EACxB,gBAAgB,EAAE,CAAC,EACnB,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,OAAO,EAChB,sBAAsB,EAAE,MAAM,CAAC,0BAA0B,EACzD,QAAQ,EAAE,QAAQ,
|
|
1
|
+
{"version":3,"file":"SwipeListControl.js","sourceRoot":"","sources":["../../../src/ui-kit/SwipeListControl/SwipeListControl.tsx"],"names":[],"mappings":";;;AAAA,+CAAwC;AACxC,6CAA0C;AAC1C,6DAA0D;AAC1D,iEAA8D;AAE9D,6DAA0D;AAE1D,MAAM,WAAW,GAAG,EAAE,CAAC;AAEvB;;;;GAIG;AACH,MAAM,eAAe,GAAG,EAAE,CAAC;AAEd,QAAA,gBAAgB,GAAG,IAAA,aAAG,EACjC,CAAC,EACC,SAAS,GAAG,EAAE,EACd,GAAG,GAAG,WAAW,EACjB,OAAO,GAAG,eAAe,EACzB,QAAQ,GAAG,IAAI,EACf,SAAS,EACT,QAAQ,EACR,sBAAsB,EACtB,QAAQ,GAAG,iBAAiB,GAC7B,EAAE,EAAE;IACH,MAAM,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;IAEhE,MAAM,CAAC,YAAY,EAAE,MAAM,CAAC,GAAG,IAAA,uCAAkB,EAAiB;QAChE,SAAS;QACT,sBAAsB;KACvB,CAAC,CAAC;IACH,MAAM,CAAC,WAAW,CAAC,GAAG,MAAM,CAAC,mBAAmB,CAAC;IAEjD,OAAO,CACL,iCAAK,SAAS,EAAE,IAAA,aAAK,EAAC,SAAS,EAAE,QAAQ,KAAK,eAAe,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,CAAC,aACrF,uBAAC,uCAAkB,IACjB,YAAY,EAAE,YAAY,EAC1B,WAAW,EAAE,WAAW,EACxB,gBAAgB,EAAE,CAAC,EACnB,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,OAAO,EAChB,sBAAsB,EAAE,MAAM,CAAC,0BAA0B,EACzD,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,YAEnB,QAAQ,GACU,EACpB,QAAQ,CAAC,CAAC,CAAC,CACV,uBAAC,2CAAoB,IACnB,YAAY,EAAE,YAAY,EAC1B,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,SAAS,EACnB,QAAQ,EAAE,QAAQ,GAClB,CACH,CAAC,CAAC,CAAC,IAAI,IACJ,CACP,CAAC;AACJ,CAAC,CACF,CAAC"}
|
|
@@ -1,15 +1,10 @@
|
|
|
1
1
|
import type { BlockVersion } from '../../model/BlockVersion';
|
|
2
|
-
|
|
3
|
-
* @title Вид
|
|
4
|
-
* @enumNames ["Горизонтальный", "Вертикальный"]
|
|
5
|
-
*/
|
|
6
|
-
export declare type SwipeListControlType = 'horizontal-list' | 'vertical-list';
|
|
2
|
+
import type { SwipeContainerProps } from './SwipeListControlProps';
|
|
7
3
|
/**
|
|
8
4
|
* @title Swipe-контроллер
|
|
9
5
|
*/
|
|
10
|
-
export interface SwipeListControlContent {
|
|
6
|
+
export interface SwipeListControlContent extends SwipeContainerProps {
|
|
11
7
|
/** @title Точки-индикаторы */
|
|
12
8
|
showDots?: boolean;
|
|
13
|
-
listType?: SwipeListControlType;
|
|
14
9
|
version?: BlockVersion;
|
|
15
10
|
}
|
|
@@ -1,12 +1,21 @@
|
|
|
1
1
|
import type { SwipeListControlContent } from './SwipeListControlContent';
|
|
2
2
|
/**
|
|
3
|
-
* @title
|
|
3
|
+
* @title Вид
|
|
4
|
+
* @enumNames ["Горизонтальный", "Вертикальный"]
|
|
4
5
|
*/
|
|
6
|
+
export declare type SwipeListControlType = 'horizontal-list' | 'vertical-list';
|
|
7
|
+
/**
|
|
8
|
+
* @title Минимальная высота
|
|
9
|
+
* @enumNames ['Стандартная', 'Маленькая']
|
|
10
|
+
*/
|
|
11
|
+
export declare type ContainerMinHeight = 866 | 720;
|
|
5
12
|
export interface SwipeContainerProps {
|
|
6
|
-
/** @
|
|
13
|
+
/** @hidden */
|
|
7
14
|
gap?: number;
|
|
8
|
-
/** @
|
|
15
|
+
/** @hidden */
|
|
9
16
|
padding?: number;
|
|
17
|
+
listType?: SwipeListControlType;
|
|
18
|
+
minHeight?: ContainerMinHeight;
|
|
10
19
|
}
|
|
11
20
|
/**
|
|
12
21
|
* @title Swipe-контроллер
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
2
|
+
exports.getContainerHeight = void 0;
|
|
3
|
+
const HEADER_HEIGHT = 170;
|
|
4
|
+
const FOOTER_HEIGHT = 48;
|
|
5
|
+
const BLOCKS_GAP = 4;
|
|
6
|
+
const PAGE_PADDINGS_X = 20;
|
|
7
|
+
const DEFAULT_HEIGHT = 866;
|
|
8
|
+
const getContainerHeight = (minHeight) => ({
|
|
9
|
+
height: `calc(100vh - ${HEADER_HEIGHT + FOOTER_HEIGHT + BLOCKS_GAP + PAGE_PADDINGS_X}px)`,
|
|
10
|
+
minHeight: `${minHeight || DEFAULT_HEIGHT}px`,
|
|
11
|
+
});
|
|
12
|
+
exports.getContainerHeight = getContainerHeight;
|
|
13
|
+
//# sourceMappingURL=getContainerHeight.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"getContainerHeight.js","sourceRoot":"","sources":["../../../src/ui-kit/SwipeListControl/getContainerHeight.ts"],"names":[],"mappings":";;AAAA,MAAM,aAAa,GAAG,GAAG,CAAC;AAC1B,MAAM,aAAa,GAAG,EAAE,CAAC;AACzB,MAAM,UAAU,GAAG,CAAC,CAAC;AACrB,MAAM,eAAe,GAAG,EAAE,CAAC;AAC3B,MAAM,cAAc,GAAG,GAAG,CAAC;AAEpB,MAAM,kBAAkB,GAAG,CAAC,SAAkB,EAAE,EAAE,CAAC,CAAC;IACzD,MAAM,EAAE,gBAAgB,aAAa,GAAG,aAAa,GAAG,UAAU,GAAG,eAAe,KAAK;IACzF,SAAS,EAAE,GAAG,SAAS,IAAI,cAAc,IAAI;CAC9C,CAAC,CAAC;AAHU,QAAA,kBAAkB,sBAG5B"}
|
|
@@ -5,7 +5,7 @@ import { LinkButton } from '../../ui-kit/LinkButton/LinkButton.js';
|
|
|
5
5
|
import { Paragraph } from '../../ui-kit/Paragraph/Paragraph.js';
|
|
6
6
|
import { Carousel } from '../Carousel/Carousel.js';
|
|
7
7
|
import { Headline } from '../Headline/Headline.js';
|
|
8
|
-
const MAX_LINKS_COUNT =
|
|
8
|
+
const MAX_LINKS_COUNT = 10;
|
|
9
9
|
export const CarouselLinks = JSX(({ className = '', additionalDescription, description, links, title, version = 'secondary', ...rest }) => {
|
|
10
10
|
return (_jsxs(BlockWrapper, { className: `flex w-full p-10 overflow-hidden justify-between ${className}`, version: version, ...rest, children: [_jsxs("div", { className: "flex flex-col max-w-96 pr-9 text-white text-xl-light", children: [_jsx(Headline, { className: "p-0", title: title, description: description, as: "h1", align: "text-left" }), additionalDescription ? (_jsx("div", { className: "pt-6", children: _jsx(Paragraph, { children: additionalDescription }) })) : null] }), links?.length ? renderLinks(links) : null] }));
|
|
11
11
|
});
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "@redneckz/uni-jsx/jsx-runtime";
|
|
2
2
|
import { JSX } from '@redneckz/uni-jsx';
|
|
3
3
|
import { Img } from '../Img/Img.js';
|
|
4
|
+
import { useLink } from '../../hooks/useLink.js';
|
|
4
5
|
const LINK_CLASS_NAME = `absolute border border-primary-main ml-3 px-6 py-5
|
|
5
6
|
text-l-light bg-white text-primary-text flex w-[316px]
|
|
6
7
|
justify-between items-center group-hover/link:text-primary-main z-10`;
|
|
7
8
|
const LINK_BORDER_CLASS_NAME = 'bg-transparent border-white border h-[70px] absolute w-[316px] top-0';
|
|
8
9
|
export const LinkButton = JSX(({ text, href = '', target = '', className = '' }) => {
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
}
|
|
12
|
-
return (_jsxs("div", { className: `relative group/link cursor-pointer w-[328px] h-[82px] ${className}`, children: [_jsxs("a", { className: LINK_CLASS_NAME, role: "link", href: href, target: target, children: [_jsx("div", { className: "p-0.5", children: text }), _jsx("div", { className: "w-6 h-6", children: _jsx(Img, { className: "w-4 h-4 min-w-4 min-h-4 rounded-full box-border brightness-0 group-hover/link:brightness-100", image: { icon: 'ArrowRightIcon', iconVersion: 'black' }, imageClassName: "group-hover/link:text-primary-main", width: "24", height: "24", asSVG: true }) })] }), _jsx("div", { className: `${LINK_BORDER_CLASS_NAME} mx-1.5 mt-1.5` }), _jsx("div", { className: `${LINK_BORDER_CLASS_NAME} mt-3 mr-3` })] }));
|
|
10
|
+
const link = useLink();
|
|
11
|
+
const adjustedProps = link({ href, target });
|
|
12
|
+
return text ? (_jsxs("div", { className: `relative group/link cursor-pointer w-[328px] h-[82px] ${className}`, children: [_jsxs("a", { className: LINK_CLASS_NAME, role: "link", ...adjustedProps, children: [_jsx("div", { className: "p-0.5", children: text }), _jsx("div", { className: "w-6 h-6", children: _jsx(Img, { className: "w-4 h-4 min-w-4 min-h-4 rounded-full box-border brightness-0 group-hover/link:brightness-100", image: { icon: 'ArrowRightIcon', iconVersion: 'black' }, imageClassName: "group-hover/link:text-primary-main", width: "24", height: "24", asSVG: true }) })] }), _jsx("div", { className: `${LINK_BORDER_CLASS_NAME} mx-1.5 mt-1.5` }), _jsx("div", { className: `${LINK_BORDER_CLASS_NAME} mt-3 mr-3` })] })) : null;
|
|
13
13
|
});
|
|
14
14
|
//# sourceMappingURL=LinkButton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LinkButton.js","sourceRoot":"","sources":["../../../src/ui-kit/LinkButton/LinkButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"LinkButton.js","sourceRoot":"","sources":["../../../src/ui-kit/LinkButton/LinkButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,GAAG,EAAE,MAAM,YAAY,CAAC;AACjC,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAG9C,MAAM,eAAe,GAAG;;uEAE+C,CAAC;AAExE,MAAM,sBAAsB,GAC1B,sEAAsE,CAAC;AAMzE,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,CAC3B,CAAC,EAAE,IAAI,EAAE,IAAI,GAAG,EAAE,EAAE,MAAM,GAAG,EAAE,EAAE,SAAS,GAAG,EAAE,EAAE,EAAE,EAAE;IACnD,MAAM,IAAI,GAAG,OAAO,EAAE,CAAC;IACvB,MAAM,aAAa,GAAG,IAAI,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC,CAAC;IAE7C,OAAO,IAAI,CAAC,CAAC,CAAC,CACZ,eAAK,SAAS,EAAE,yDAAyD,SAAS,EAAE,aAClF,aAAG,SAAS,EAAE,eAAe,EAAE,IAAI,EAAC,MAAM,KAAK,aAAa,aAC1D,cAAK,SAAS,EAAC,OAAO,YAAE,IAAI,GAAO,EACnC,cAAK,SAAS,EAAC,SAAS,YACtB,KAAC,GAAG,IACF,SAAS,EAAC,8FAA8F,EACxG,KAAK,EAAE,EAAE,IAAI,EAAE,gBAAgB,EAAE,WAAW,EAAE,OAAO,EAAE,EACvD,cAAc,EAAC,oCAAoC,EACnD,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,KAAK,SACL,GACE,IACJ,EACJ,cAAK,SAAS,EAAE,GAAG,sBAAsB,gBAAgB,GAAI,EAC7D,cAAK,SAAS,EAAE,GAAG,sBAAsB,YAAY,GAAI,IACrD,CACP,CAAC,CAAC,CAAC,IAAI,CAAC;AACX,CAAC,CACF,CAAC"}
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import type { SwipeListControlType } from './SwipeListControlContent';
|
|
2
1
|
import type { SwipeContainerProps } from './SwipeListControlProps';
|
|
3
2
|
declare type ItemsVisibilityList = Array<IntersectionObserverEntry | undefined>;
|
|
4
3
|
declare type SwipeListItemWidthAuto = 0;
|
|
@@ -15,7 +14,6 @@ interface SwipeListContainerProps extends SwipeContainerProps {
|
|
|
15
14
|
snapAlign?: 'snap-start' | 'snap-center' | 'snap-end';
|
|
16
15
|
onVisibleItemsChange?: (itemsVisibilityList: ItemsVisibilityList) => void;
|
|
17
16
|
onVisibleIndicesChange?: (indices: number[]) => void;
|
|
18
|
-
listType?: SwipeListControlType;
|
|
19
17
|
}
|
|
20
18
|
export declare const SwipeListContainer: import("@redneckz/uni-jsx").UNIComponent<SwipeListContainerProps, any, any>;
|
|
21
19
|
export {};
|
|
@@ -3,10 +3,10 @@ import { JSX } from '@redneckz/uni-jsx';
|
|
|
3
3
|
import { useCallback, useRef } from '@redneckz/uni-jsx/lib/hooks';
|
|
4
4
|
import { mapChildren } from '../../utils/mapChildren.js';
|
|
5
5
|
import { style } from '../../utils/style.js';
|
|
6
|
+
import { getContainerHeight } from './getContainerHeight.js';
|
|
6
7
|
import { SwipeListItem } from './SwipeListItem.js';
|
|
7
8
|
const childStyleMap = ['min-w-[100%]', 'min-w-[50%]', 'min-w-[33.33%]', 'min-w-[25%]'];
|
|
8
|
-
const
|
|
9
|
-
export const SwipeListContainer = JSX(({ className = '', containerRef, activeIndex, visibleItemCount = 0, gap = 0, padding = 0, listType = 'horizontal-list', snapAlign = 'snap-center', children, onVisibleItemsChange, onVisibleIndicesChange, }) => {
|
|
9
|
+
export const SwipeListContainer = JSX(({ className = '', containerRef, activeIndex, visibleItemCount = 0, gap = 0, padding = 0, listType = 'horizontal-list', snapAlign = 'snap-center', minHeight, children, onVisibleItemsChange, onVisibleIndicesChange, }) => {
|
|
10
10
|
const observerOptions = {
|
|
11
11
|
sensitivity: 1,
|
|
12
12
|
rootRef: containerRef,
|
|
@@ -24,14 +24,10 @@ export const SwipeListContainer = JSX(({ className = '', containerRef, activeInd
|
|
|
24
24
|
const isHorizontalList = listType === 'horizontal-list';
|
|
25
25
|
const containerStyle = {
|
|
26
26
|
...(isHorizontalList ? getContainerOffset(padding, additionPadding) : {}),
|
|
27
|
-
...(isVerticalList ?
|
|
27
|
+
...(isVerticalList ? getContainerHeight(minHeight) : {}),
|
|
28
28
|
gap: `${gap}px`,
|
|
29
29
|
};
|
|
30
|
-
|
|
31
|
-
...(isHorizontalList ? getContainerOffset(padding / 4) : {}),
|
|
32
|
-
maxHeight: DEFAULT_HEIGHT,
|
|
33
|
-
};
|
|
34
|
-
return (_jsx("div", { className: style('box-border overflow-auto no-scrollbar', listType, className), style: containerStyle, role: "list", ref: containerRef, children: mapChildren((child, idx) => (_jsx(SwipeListItem, { className: style(snapAlign, visibleItemCount ? childStyleMap[visibleItemCount - 1] : '', isVerticalList ? 'h-full' : ''), style: itemContainerStyle, activeIndex: activeIndex, idx: idx, observerOptions: observerOptions, onIntersection: handleIntersection, children: child }, String(idx))))(children) }));
|
|
30
|
+
return (_jsx("div", { className: style('box-border overflow-auto no-scrollbar', listType, className), style: containerStyle, role: "list", ref: containerRef, children: mapChildren((child, idx) => (_jsx(SwipeListItem, { className: style(snapAlign, visibleItemCount ? childStyleMap[visibleItemCount - 1] : '', isVerticalList ? 'h-full' : ''), style: isHorizontalList ? getContainerOffset(padding / 4) : {}, activeIndex: activeIndex, idx: idx, observerOptions: observerOptions, onIntersection: handleIntersection, children: child }, String(idx))))(children) }));
|
|
35
31
|
});
|
|
36
32
|
// Styles used to compensate outer container padding to get rid of clipping effect
|
|
37
33
|
const getContainerOffset = (padding, additionalPadding = 0) => ({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SwipeListContainer.js","sourceRoot":"","sources":["../../../src/ui-kit/SwipeListControl/SwipeListContainer.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,6BAA6B,CAAC;AAElE,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"SwipeListContainer.js","sourceRoot":"","sources":["../../../src/ui-kit/SwipeListControl/SwipeListContainer.tsx"],"names":[],"mappings":"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"}
|
|
@@ -11,13 +11,13 @@ const DEFAULT_GAP = 14;
|
|
|
11
11
|
and get rid of a clipping effect caused by overflow: hidden.
|
|
12
12
|
*/
|
|
13
13
|
const DEFAULT_PADDING = 16;
|
|
14
|
-
export const SwipeListControl = JSX(({ className = '', gap = DEFAULT_GAP, padding = DEFAULT_PADDING, showDots = true, children, onVisibleIndicesChange, listType = 'horizontal-list', }) => {
|
|
14
|
+
export const SwipeListControl = JSX(({ className = '', gap = DEFAULT_GAP, padding = DEFAULT_PADDING, showDots = true, minHeight, children, onVisibleIndicesChange, listType = 'horizontal-list', }) => {
|
|
15
15
|
const itemCount = Array.isArray(children) ? children.length : 0;
|
|
16
16
|
const [containerRef, scroll] = useSwipeListScroll({
|
|
17
17
|
itemCount,
|
|
18
18
|
onVisibleIndicesChange,
|
|
19
19
|
});
|
|
20
20
|
const [activeIndex] = scroll.visibleIndicesRange;
|
|
21
|
-
return (_jsxs("div", { className: style(className, listType === 'vertical-list' ? 'relative h-full' : ''), children: [_jsx(SwipeListContainer, { containerRef: containerRef, activeIndex: activeIndex, visibleItemCount: 1, gap: gap, padding: padding, onVisibleIndicesChange: scroll.handleVisibleIndicesChange, listType: listType, children: children }), showDots ? (_jsx(SwipeListControlDots, { containerRef: containerRef, activeIndex: activeIndex, dotCount: itemCount, listType: listType })) : null] }));
|
|
21
|
+
return (_jsxs("div", { className: style(className, listType === 'vertical-list' ? 'relative h-full' : ''), children: [_jsx(SwipeListContainer, { containerRef: containerRef, activeIndex: activeIndex, visibleItemCount: 1, gap: gap, padding: padding, onVisibleIndicesChange: scroll.handleVisibleIndicesChange, listType: listType, minHeight: minHeight, children: children }), showDots ? (_jsx(SwipeListControlDots, { containerRef: containerRef, activeIndex: activeIndex, dotCount: itemCount, listType: listType })) : null] }));
|
|
22
22
|
});
|
|
23
23
|
//# sourceMappingURL=SwipeListControl.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SwipeListControl.js","sourceRoot":"","sources":["../../../src/ui-kit/SwipeListControl/SwipeListControl.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1C,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAE9D,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAE1D,MAAM,WAAW,GAAG,EAAE,CAAC;AAEvB;;;;GAIG;AACH,MAAM,eAAe,GAAG,EAAE,CAAC;AAE3B,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,CACjC,CAAC,EACC,SAAS,GAAG,EAAE,EACd,GAAG,GAAG,WAAW,EACjB,OAAO,GAAG,eAAe,EACzB,QAAQ,GAAG,IAAI,EACf,QAAQ,EACR,sBAAsB,EACtB,QAAQ,GAAG,iBAAiB,GAC7B,EAAE,EAAE;IACH,MAAM,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;IAEhE,MAAM,CAAC,YAAY,EAAE,MAAM,CAAC,GAAG,kBAAkB,CAAiB;QAChE,SAAS;QACT,sBAAsB;KACvB,CAAC,CAAC;IACH,MAAM,CAAC,WAAW,CAAC,GAAG,MAAM,CAAC,mBAAmB,CAAC;IAEjD,OAAO,CACL,eAAK,SAAS,EAAE,KAAK,CAAC,SAAS,EAAE,QAAQ,KAAK,eAAe,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,CAAC,aACrF,KAAC,kBAAkB,IACjB,YAAY,EAAE,YAAY,EAC1B,WAAW,EAAE,WAAW,EACxB,gBAAgB,EAAE,CAAC,EACnB,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,OAAO,EAChB,sBAAsB,EAAE,MAAM,CAAC,0BAA0B,EACzD,QAAQ,EAAE,QAAQ,
|
|
1
|
+
{"version":3,"file":"SwipeListControl.js","sourceRoot":"","sources":["../../../src/ui-kit/SwipeListControl/SwipeListControl.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1C,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAE9D,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAE1D,MAAM,WAAW,GAAG,EAAE,CAAC;AAEvB;;;;GAIG;AACH,MAAM,eAAe,GAAG,EAAE,CAAC;AAE3B,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,CACjC,CAAC,EACC,SAAS,GAAG,EAAE,EACd,GAAG,GAAG,WAAW,EACjB,OAAO,GAAG,eAAe,EACzB,QAAQ,GAAG,IAAI,EACf,SAAS,EACT,QAAQ,EACR,sBAAsB,EACtB,QAAQ,GAAG,iBAAiB,GAC7B,EAAE,EAAE;IACH,MAAM,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;IAEhE,MAAM,CAAC,YAAY,EAAE,MAAM,CAAC,GAAG,kBAAkB,CAAiB;QAChE,SAAS;QACT,sBAAsB;KACvB,CAAC,CAAC;IACH,MAAM,CAAC,WAAW,CAAC,GAAG,MAAM,CAAC,mBAAmB,CAAC;IAEjD,OAAO,CACL,eAAK,SAAS,EAAE,KAAK,CAAC,SAAS,EAAE,QAAQ,KAAK,eAAe,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,CAAC,aACrF,KAAC,kBAAkB,IACjB,YAAY,EAAE,YAAY,EAC1B,WAAW,EAAE,WAAW,EACxB,gBAAgB,EAAE,CAAC,EACnB,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,OAAO,EAChB,sBAAsB,EAAE,MAAM,CAAC,0BAA0B,EACzD,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,YAEnB,QAAQ,GACU,EACpB,QAAQ,CAAC,CAAC,CAAC,CACV,KAAC,oBAAoB,IACnB,YAAY,EAAE,YAAY,EAC1B,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,SAAS,EACnB,QAAQ,EAAE,QAAQ,GAClB,CACH,CAAC,CAAC,CAAC,IAAI,IACJ,CACP,CAAC;AACJ,CAAC,CACF,CAAC"}
|
|
@@ -1,15 +1,10 @@
|
|
|
1
1
|
import type { BlockVersion } from '../../model/BlockVersion';
|
|
2
|
-
|
|
3
|
-
* @title Вид
|
|
4
|
-
* @enumNames ["Горизонтальный", "Вертикальный"]
|
|
5
|
-
*/
|
|
6
|
-
export declare type SwipeListControlType = 'horizontal-list' | 'vertical-list';
|
|
2
|
+
import type { SwipeContainerProps } from './SwipeListControlProps';
|
|
7
3
|
/**
|
|
8
4
|
* @title Swipe-контроллер
|
|
9
5
|
*/
|
|
10
|
-
export interface SwipeListControlContent {
|
|
6
|
+
export interface SwipeListControlContent extends SwipeContainerProps {
|
|
11
7
|
/** @title Точки-индикаторы */
|
|
12
8
|
showDots?: boolean;
|
|
13
|
-
listType?: SwipeListControlType;
|
|
14
9
|
version?: BlockVersion;
|
|
15
10
|
}
|
|
@@ -1,12 +1,21 @@
|
|
|
1
1
|
import type { SwipeListControlContent } from './SwipeListControlContent';
|
|
2
2
|
/**
|
|
3
|
-
* @title
|
|
3
|
+
* @title Вид
|
|
4
|
+
* @enumNames ["Горизонтальный", "Вертикальный"]
|
|
4
5
|
*/
|
|
6
|
+
export declare type SwipeListControlType = 'horizontal-list' | 'vertical-list';
|
|
7
|
+
/**
|
|
8
|
+
* @title Минимальная высота
|
|
9
|
+
* @enumNames ['Стандартная', 'Маленькая']
|
|
10
|
+
*/
|
|
11
|
+
export declare type ContainerMinHeight = 866 | 720;
|
|
5
12
|
export interface SwipeContainerProps {
|
|
6
|
-
/** @
|
|
13
|
+
/** @hidden */
|
|
7
14
|
gap?: number;
|
|
8
|
-
/** @
|
|
15
|
+
/** @hidden */
|
|
9
16
|
padding?: number;
|
|
17
|
+
listType?: SwipeListControlType;
|
|
18
|
+
minHeight?: ContainerMinHeight;
|
|
10
19
|
}
|
|
11
20
|
/**
|
|
12
21
|
* @title Swipe-контроллер
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
const HEADER_HEIGHT = 170;
|
|
2
|
+
const FOOTER_HEIGHT = 48;
|
|
3
|
+
const BLOCKS_GAP = 4;
|
|
4
|
+
const PAGE_PADDINGS_X = 20;
|
|
5
|
+
const DEFAULT_HEIGHT = 866;
|
|
6
|
+
export const getContainerHeight = (minHeight) => ({
|
|
7
|
+
height: `calc(100vh - ${HEADER_HEIGHT + FOOTER_HEIGHT + BLOCKS_GAP + PAGE_PADDINGS_X}px)`,
|
|
8
|
+
minHeight: `${minHeight || DEFAULT_HEIGHT}px`,
|
|
9
|
+
});
|
|
10
|
+
//# sourceMappingURL=getContainerHeight.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"getContainerHeight.js","sourceRoot":"","sources":["../../../src/ui-kit/SwipeListControl/getContainerHeight.ts"],"names":[],"mappings":"AAAA,MAAM,aAAa,GAAG,GAAG,CAAC;AAC1B,MAAM,aAAa,GAAG,EAAE,CAAC;AACzB,MAAM,UAAU,GAAG,CAAC,CAAC;AACrB,MAAM,eAAe,GAAG,EAAE,CAAC;AAC3B,MAAM,cAAc,GAAG,GAAG,CAAC;AAE3B,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,SAAkB,EAAE,EAAE,CAAC,CAAC;IACzD,MAAM,EAAE,gBAAgB,aAAa,GAAG,aAAa,GAAG,UAAU,GAAG,eAAe,KAAK;IACzF,SAAS,EAAE,GAAG,SAAS,IAAI,cAAc,IAAI;CAC9C,CAAC,CAAC"}
|
|
@@ -541,6 +541,16 @@
|
|
|
541
541
|
return Array.isArray(children) ? children.map(mapper) : mapper(children, 0);
|
|
542
542
|
};
|
|
543
543
|
|
|
544
|
+
const HEADER_HEIGHT = 170;
|
|
545
|
+
const FOOTER_HEIGHT = 48;
|
|
546
|
+
const BLOCKS_GAP = 4;
|
|
547
|
+
const PAGE_PADDINGS_X = 20;
|
|
548
|
+
const DEFAULT_HEIGHT = 866;
|
|
549
|
+
const getContainerHeight = (minHeight) => ({
|
|
550
|
+
height: `calc(100vh - ${HEADER_HEIGHT + FOOTER_HEIGHT + BLOCKS_GAP + PAGE_PADDINGS_X}px)`,
|
|
551
|
+
minHeight: `${minHeight || DEFAULT_HEIGHT}px`,
|
|
552
|
+
});
|
|
553
|
+
|
|
544
554
|
const SwipeListItem = JSX(({ className = '', style, idx, activeIndex, observerOptions, children, onIntersection }) => {
|
|
545
555
|
const observerCallback = useCallback((entries) => {
|
|
546
556
|
if (entries.length && onIntersection) {
|
|
@@ -552,8 +562,7 @@
|
|
|
552
562
|
});
|
|
553
563
|
|
|
554
564
|
const childStyleMap = ['min-w-[100%]', 'min-w-[50%]', 'min-w-[33.33%]', 'min-w-[25%]'];
|
|
555
|
-
const
|
|
556
|
-
const SwipeListContainer = JSX(({ className = '', containerRef, activeIndex, visibleItemCount = 0, gap = 0, padding = 0, listType = 'horizontal-list', snapAlign = 'snap-center', children, onVisibleItemsChange, onVisibleIndicesChange, }) => {
|
|
565
|
+
const SwipeListContainer = JSX(({ className = '', containerRef, activeIndex, visibleItemCount = 0, gap = 0, padding = 0, listType = 'horizontal-list', snapAlign = 'snap-center', minHeight, children, onVisibleItemsChange, onVisibleIndicesChange, }) => {
|
|
557
566
|
const observerOptions = {
|
|
558
567
|
sensitivity: 1,
|
|
559
568
|
rootRef: containerRef,
|
|
@@ -571,14 +580,10 @@
|
|
|
571
580
|
const isHorizontalList = listType === 'horizontal-list';
|
|
572
581
|
const containerStyle = {
|
|
573
582
|
...(isHorizontalList ? getContainerOffset(padding, additionPadding) : {}),
|
|
574
|
-
...(isVerticalList ?
|
|
583
|
+
...(isVerticalList ? getContainerHeight(minHeight) : {}),
|
|
575
584
|
gap: `${gap}px`,
|
|
576
585
|
};
|
|
577
|
-
|
|
578
|
-
...(isHorizontalList ? getContainerOffset(padding / 4) : {}),
|
|
579
|
-
maxHeight: DEFAULT_HEIGHT,
|
|
580
|
-
};
|
|
581
|
-
return (jsx("div", { className: style('box-border overflow-auto no-scrollbar', listType, className), style: containerStyle, role: "list", ref: containerRef, children: mapChildren((child, idx) => (jsx(SwipeListItem, { className: style(snapAlign, visibleItemCount ? childStyleMap[visibleItemCount - 1] : '', isVerticalList ? 'h-full' : ''), style: itemContainerStyle, activeIndex: activeIndex, idx: idx, observerOptions: observerOptions, onIntersection: handleIntersection, children: child }, String(idx))))(children) }));
|
|
586
|
+
return (jsx("div", { className: style('box-border overflow-auto no-scrollbar', listType, className), style: containerStyle, role: "list", ref: containerRef, children: mapChildren((child, idx) => (jsx(SwipeListItem, { className: style(snapAlign, visibleItemCount ? childStyleMap[visibleItemCount - 1] : '', isVerticalList ? 'h-full' : ''), style: isHorizontalList ? getContainerOffset(padding / 4) : {}, activeIndex: activeIndex, idx: idx, observerOptions: observerOptions, onIntersection: handleIntersection, children: child }, String(idx))))(children) }));
|
|
582
587
|
});
|
|
583
588
|
// Styles used to compensate outer container padding to get rid of clipping effect
|
|
584
589
|
const getContainerOffset = (padding, additionalPadding = 0) => ({
|
|
@@ -688,14 +693,14 @@
|
|
|
688
693
|
and get rid of a clipping effect caused by overflow: hidden.
|
|
689
694
|
*/
|
|
690
695
|
const DEFAULT_PADDING = 16;
|
|
691
|
-
const SwipeListControl = JSX(({ className = '', gap = DEFAULT_GAP, padding = DEFAULT_PADDING, showDots = true, children, onVisibleIndicesChange, listType = 'horizontal-list', }) => {
|
|
696
|
+
const SwipeListControl = JSX(({ className = '', gap = DEFAULT_GAP, padding = DEFAULT_PADDING, showDots = true, minHeight, children, onVisibleIndicesChange, listType = 'horizontal-list', }) => {
|
|
692
697
|
const itemCount = Array.isArray(children) ? children.length : 0;
|
|
693
698
|
const [containerRef, scroll] = useSwipeListScroll({
|
|
694
699
|
itemCount,
|
|
695
700
|
onVisibleIndicesChange,
|
|
696
701
|
});
|
|
697
702
|
const [activeIndex] = scroll.visibleIndicesRange;
|
|
698
|
-
return (jsxs("div", { className: style(className, listType === 'vertical-list' ? 'relative h-full' : ''), children: [jsx(SwipeListContainer, { containerRef: containerRef, activeIndex: activeIndex, visibleItemCount: 1, gap: gap, padding: padding, onVisibleIndicesChange: scroll.handleVisibleIndicesChange, listType: listType, children: children }), showDots ? (jsx(SwipeListControlDots, { containerRef: containerRef, activeIndex: activeIndex, dotCount: itemCount, listType: listType })) : null] }));
|
|
703
|
+
return (jsxs("div", { className: style(className, listType === 'vertical-list' ? 'relative h-full' : ''), children: [jsx(SwipeListContainer, { containerRef: containerRef, activeIndex: activeIndex, visibleItemCount: 1, gap: gap, padding: padding, onVisibleIndicesChange: scroll.handleVisibleIndicesChange, listType: listType, minHeight: minHeight, children: children }), showDots ? (jsx(SwipeListControlDots, { containerRef: containerRef, activeIndex: activeIndex, dotCount: itemCount, listType: listType })) : null] }));
|
|
699
704
|
});
|
|
700
705
|
|
|
701
706
|
/* eslint-disable @typescript-eslint/ban-types */
|
|
@@ -1671,7 +1676,7 @@
|
|
|
1671
1676
|
return (list) => list.reduce((acc, el, i) => (acc.length ? acc.concat({ ...sep, key: i }, el) : [el]), []);
|
|
1672
1677
|
}
|
|
1673
1678
|
|
|
1674
|
-
const packageVersion = "0.8.
|
|
1679
|
+
const packageVersion = "0.8.19";
|
|
1675
1680
|
|
|
1676
1681
|
exports.Blocks = Blocks;
|
|
1677
1682
|
exports.ContentPage = ContentPage;
|