@doyourjob/gravity-ui-page-constructor 5.31.100 → 5.31.102

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 (12) hide show
  1. package/build/cjs/blocks/SliderNew/Slider.d.ts +2 -14
  2. package/build/cjs/blocks/SliderNew/Slider.js +11 -51
  3. package/build/cjs/blocks/SliderNew/SliderClient.d.ts +14 -0
  4. package/build/cjs/blocks/SliderNew/SliderClient.js +57 -0
  5. package/build/cjs/constructor-items.d.ts +1 -1
  6. package/build/esm/blocks/SliderNew/Slider.d.ts +2 -15
  7. package/build/esm/blocks/SliderNew/Slider.js +11 -52
  8. package/build/esm/blocks/SliderNew/SliderClient.d.ts +15 -0
  9. package/build/esm/blocks/SliderNew/SliderClient.js +53 -0
  10. package/build/esm/constructor-items.d.ts +1 -1
  11. package/package.json +1 -1
  12. package/widget/index.js +1 -1
package/build/cjs/blocks/SliderNew/Slider.d.ts CHANGED
@@ -1,16 +1,4 @@
1
1
  import * as React from 'react';
2
- import 'swiper/css';
3
- import 'swiper/css/autoplay';
4
- import 'swiper/css/pagination';
5
- import type { SwiperProps } from 'swiper/react';
6
- import { ClassNameProps, Refable, SliderProps as SliderParams } from '../../models';
7
- export interface SliderNewProps extends Omit<SliderParams, 'children'>, Partial<Pick<SwiperProps, 'onSlideChange' | 'onSlideChangeTransitionStart' | 'onSlideChangeTransitionEnd' | 'onActiveIndexChange' | 'onBreakpoint'>>, Refable<HTMLDivElement>, ClassNameProps {
8
- type?: string;
9
- anchorId?: string;
10
- dotsClassName?: string;
11
- blockClassName?: string;
12
- arrowSize?: number;
13
- initialSlide?: number;
14
- }
15
- export declare const SliderNewBlock: ({ animated, title, description, type, anchorId, arrows, adaptive, autoplay: autoplayMs, infinite, dots, initialSlide, className, dotsClassName, disclaimer, children, blockClassName, arrowSize, slidesToShow, onSlideChange, onSlideChangeTransitionStart, onSlideChangeTransitionEnd, onActiveIndexChange, onBreakpoint, }: React.PropsWithChildren<SliderNewProps>) => JSX.Element;
2
+ import { SliderNewProps } from './SliderClient';
3
+ export declare const SliderNewBlock: (props: React.PropsWithChildren<SliderNewProps>) => JSX.Element | null;
16
4
  export default SliderNewBlock;
package/build/cjs/blocks/SliderNew/Slider.js CHANGED
@@ -3,57 +3,17 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.SliderNewBlock = void 0;
4
4
  const tslib_1 = require("tslib");
5
5
  const React = tslib_1.__importStar(require("react"));
6
- require("swiper/css");
7
- require("swiper/css/autoplay");
8
- require("swiper/css/pagination");
9
- const modules_1 = require("swiper/modules");
10
- const react_1 = require("swiper/react");
11
- const Anchor_1 = tslib_1.__importDefault(require("../../components/Anchor/Anchor"));
12
- const AnimateBlock_1 = tslib_1.__importDefault(require("../../components/AnimateBlock/AnimateBlock"));
13
- const Title_1 = tslib_1.__importDefault(require("../../components/Title/Title"));
14
- const models_1 = require("../../models");
15
- const utils_1 = require("../../utils");
16
- const Arrow_1 = tslib_1.__importDefault(require("./Arrow/Arrow"));
17
- const i18n_1 = require("./i18n");
18
- const useSlider_1 = require("./useSlider");
19
- const useSliderPagination_1 = require("./useSliderPagination");
20
- const b = (0, utils_1.block)('slider-new-block');
21
- const SliderNewBlock = ({ animated, title, description, type, anchorId, arrows = true, adaptive, autoplay: autoplayMs, infinite = false, dots = true, initialSlide = 0, className, dotsClassName, disclaimer, children, blockClassName, arrowSize, slidesToShow, onSlideChange, onSlideChangeTransitionStart, onSlideChangeTransitionEnd, onActiveIndexChange, onBreakpoint, }) => {
22
- const { autoplay, isLocked, childrenCount, breakpoints, onSwiper, handleSwiperInit, onPrev, onNext, setIsLocked, } = (0, useSlider_1.useSlider)({
23
- slidesToShow,
24
- children,
25
- type,
26
- autoplayMs,
27
- });
28
- const isA11yControlHidden = Boolean(autoplay);
29
- const controlTabIndex = isA11yControlHidden ? -1 : 0;
30
- const paginationProps = (0, useSliderPagination_1.useSliderPagination)({
31
- enabled: dots,
32
- isA11yControlHidden,
33
- controlTabIndex,
34
- bulletClass: b('dot', dotsClassName),
35
- bulletActiveClass: b('dot_active'),
36
- paginationLabel: (0, i18n_1.i18n)('pagination-label'),
37
- });
38
- return (React.createElement("div", { className: b({
39
- 'one-slide': childrenCount === 1,
40
- 'only-arrows': (!title || (typeof title !== 'string' && !(title === null || title === void 0 ? void 0 : title.text))) &&
41
- !description &&
42
- arrows,
43
- 'without-dots': !dots || isLocked,
44
- type,
45
- }, blockClassName) },
46
- anchorId && React.createElement(Anchor_1.default, { id: anchorId }),
47
- React.createElement(Title_1.default, { title: title, subtitle: description, className: b('header', { 'no-description': !description }) }),
48
- React.createElement(AnimateBlock_1.default, { className: b('animate-slides'), animate: animated },
49
- React.createElement(react_1.Swiper, Object.assign({ modules: [modules_1.Autoplay, modules_1.A11y, modules_1.Pagination], className: b('slider', className), onSwiper: onSwiper, speed: 700, autoplay: autoplay, loop: infinite, autoHeight: adaptive, initialSlide: initialSlide, noSwiping: false, slidesOffsetBefore: 24, slidesOffsetAfter: 24, breakpoints: breakpoints, onSlideChange: onSlideChange, onSlideChangeTransitionStart: onSlideChangeTransitionStart, onSlideChangeTransitionEnd: onSlideChangeTransitionEnd, onActiveIndexChange: onActiveIndexChange, onBreakpoint: onBreakpoint, onLock: () => setIsLocked(true), onUnlock: () => setIsLocked(false), onInit: handleSwiperInit, watchSlidesProgress: true, watchOverflow: true, a11y: {
50
- slideLabelMessage: '',
51
- paginationBulletMessage: (0, i18n_1.i18n)('dot-label', { index: '{{index}}' }),
52
- } }, paginationProps), React.Children.map(children, (elem, index) => (React.createElement(react_1.SwiperSlide, { className: b('slide'), key: index }, ({ isVisible }) => (React.createElement("div", { className: b('slide-item'), "aria-hidden": !isA11yControlHidden && !isVisible }, elem)))))),
53
- arrows && !isLocked && (React.createElement("div", { "aria-hidden": isA11yControlHidden },
54
- React.createElement(Arrow_1.default, { className: b('arrow', { prev: true }), type: "left", transparent: type === models_1.SliderType.HeaderCard, onClick: onPrev, size: arrowSize, extraProps: { tabIndex: controlTabIndex } }),
55
- React.createElement(Arrow_1.default, { className: b('arrow', { next: true }), type: "right", transparent: type === models_1.SliderType.HeaderCard, onClick: onNext, size: arrowSize, extraProps: { tabIndex: controlTabIndex } }))),
56
- React.createElement("div", { className: b('footer') }, disclaimer ? (React.createElement("div", { className: b('disclaimer', { size: (disclaimer === null || disclaimer === void 0 ? void 0 : disclaimer.size) || 'm' }) }, disclaimer === null || disclaimer === void 0 ? void 0 : disclaimer.text)) : null))));
6
+ const SliderClient_1 = tslib_1.__importDefault(require("./SliderClient"));
7
+ const SliderNewBlock = (props) => {
8
+ const [ClientComponent, setClientComponent] = React.useState(null);
9
+ React.useEffect(() => {
10
+ Promise.resolve().then(() => tslib_1.__importStar(require('./SliderClient'))).then((mod) => {
11
+ setClientComponent(() => mod.default);
12
+ });
13
+ }, []);
14
+ if (!ClientComponent)
15
+ return null; // или прелоадер
16
+ return React.createElement(SliderClient_1.default, Object.assign({}, props));
57
17
  };
58
18
  exports.SliderNewBlock = SliderNewBlock;
59
19
  exports.default = exports.SliderNewBlock;
package/build/cjs/blocks/SliderNew/SliderClient.d.ts ADDED
@@ -0,0 +1,14 @@
1
+ import * as React from 'react';
2
+ import type { SwiperProps } from 'swiper/react';
3
+ import { ClassNameProps, Refable, SliderProps as SliderParams } from '../../models';
4
+ import 'swiper/swiper-bundle.css';
5
+ export interface SliderNewProps extends Omit<SliderParams, 'children'>, Partial<Pick<SwiperProps, 'onSlideChange' | 'onSlideChangeTransitionStart' | 'onSlideChangeTransitionEnd' | 'onActiveIndexChange' | 'onBreakpoint'>>, Refable<HTMLDivElement>, ClassNameProps {
6
+ type?: string;
7
+ anchorId?: string;
8
+ dotsClassName?: string;
9
+ blockClassName?: string;
10
+ arrowSize?: number;
11
+ initialSlide?: number;
12
+ }
13
+ export declare const SliderClient: ({ animated, title, description, type, anchorId, arrows, adaptive, autoplay: autoplayMs, infinite, dots, initialSlide, className, dotsClassName, disclaimer, children, blockClassName, arrowSize, slidesToShow, onSlideChange, onSlideChangeTransitionStart, onSlideChangeTransitionEnd, onActiveIndexChange, onBreakpoint, }: React.PropsWithChildren<SliderNewProps>) => JSX.Element;
14
+ export default SliderClient;
package/build/cjs/blocks/SliderNew/SliderClient.js ADDED
@@ -0,0 +1,57 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.SliderClient = void 0;
4
+ const tslib_1 = require("tslib");
5
+ const React = tslib_1.__importStar(require("react"));
6
+ const modules_1 = require("swiper/modules");
7
+ const react_1 = require("swiper/react");
8
+ const Anchor_1 = tslib_1.__importDefault(require("../../components/Anchor/Anchor"));
9
+ const AnimateBlock_1 = tslib_1.__importDefault(require("../../components/AnimateBlock/AnimateBlock"));
10
+ const Title_1 = tslib_1.__importDefault(require("../../components/Title/Title"));
11
+ const models_1 = require("../../models");
12
+ const utils_1 = require("../../utils");
13
+ const Arrow_1 = tslib_1.__importDefault(require("./Arrow/Arrow"));
14
+ const i18n_1 = require("./i18n");
15
+ const useSlider_1 = require("./useSlider");
16
+ const useSliderPagination_1 = require("./useSliderPagination");
17
+ require("swiper/swiper-bundle.css");
18
+ const b = (0, utils_1.block)('slider-new-block');
19
+ const SliderClient = ({ animated, title, description, type, anchorId, arrows = true, adaptive, autoplay: autoplayMs, infinite = false, dots = true, initialSlide = 0, className, dotsClassName, disclaimer, children, blockClassName, arrowSize, slidesToShow, onSlideChange, onSlideChangeTransitionStart, onSlideChangeTransitionEnd, onActiveIndexChange, onBreakpoint, }) => {
20
+ const { autoplay, isLocked, childrenCount, breakpoints, onSwiper, handleSwiperInit, onPrev, onNext, setIsLocked, } = (0, useSlider_1.useSlider)({
21
+ slidesToShow,
22
+ children,
23
+ type,
24
+ autoplayMs,
25
+ });
26
+ const isA11yControlHidden = Boolean(autoplay);
27
+ const controlTabIndex = isA11yControlHidden ? -1 : 0;
28
+ const paginationProps = (0, useSliderPagination_1.useSliderPagination)({
29
+ enabled: dots,
30
+ isA11yControlHidden,
31
+ controlTabIndex,
32
+ bulletClass: b('dot', dotsClassName),
33
+ bulletActiveClass: b('dot_active'),
34
+ paginationLabel: (0, i18n_1.i18n)('pagination-label'),
35
+ });
36
+ return (React.createElement("div", { className: b({
37
+ 'one-slide': childrenCount === 1,
38
+ 'only-arrows': (!title || (typeof title !== 'string' && !(title === null || title === void 0 ? void 0 : title.text))) &&
39
+ !description &&
40
+ arrows,
41
+ 'without-dots': !dots || isLocked,
42
+ type,
43
+ }, blockClassName) },
44
+ anchorId && React.createElement(Anchor_1.default, { id: anchorId }),
45
+ React.createElement(Title_1.default, { title: title, subtitle: description, className: b('header', { 'no-description': !description }) }),
46
+ React.createElement(AnimateBlock_1.default, { className: b('animate-slides'), animate: animated },
47
+ React.createElement(react_1.Swiper, Object.assign({ modules: [modules_1.Autoplay, modules_1.A11y, modules_1.Pagination], className: b('slider', className), onSwiper: onSwiper, speed: 700, autoplay: autoplay, loop: infinite, autoHeight: adaptive, initialSlide: initialSlide, noSwiping: false, slidesOffsetBefore: 24, slidesOffsetAfter: 24, breakpoints: breakpoints, onSlideChange: onSlideChange, onSlideChangeTransitionStart: onSlideChangeTransitionStart, onSlideChangeTransitionEnd: onSlideChangeTransitionEnd, onActiveIndexChange: onActiveIndexChange, onBreakpoint: onBreakpoint, onLock: () => setIsLocked(true), onUnlock: () => setIsLocked(false), onInit: handleSwiperInit, watchSlidesProgress: true, watchOverflow: true, a11y: {
48
+ slideLabelMessage: '',
49
+ paginationBulletMessage: (0, i18n_1.i18n)('dot-label', { index: '{{index}}' }),
50
+ } }, paginationProps), React.Children.map(children, (elem, index) => (React.createElement(react_1.SwiperSlide, { className: b('slide'), key: index }, ({ isVisible }) => (React.createElement("div", { className: b('slide-item'), "aria-hidden": !isA11yControlHidden && !isVisible }, elem)))))),
51
+ arrows && !isLocked && (React.createElement("div", { "aria-hidden": isA11yControlHidden },
52
+ React.createElement(Arrow_1.default, { className: b('arrow', { prev: true }), type: "left", transparent: type === models_1.SliderType.HeaderCard, onClick: onPrev, size: arrowSize, extraProps: { tabIndex: controlTabIndex } }),
53
+ React.createElement(Arrow_1.default, { className: b('arrow', { next: true }), type: "right", transparent: type === models_1.SliderType.HeaderCard, onClick: onNext, size: arrowSize, extraProps: { tabIndex: controlTabIndex } }))),
54
+ React.createElement("div", { className: b('footer') }, disclaimer ? (React.createElement("div", { className: b('disclaimer', { size: (disclaimer === null || disclaimer === void 0 ? void 0 : disclaimer.size) || 'm' }) }, disclaimer === null || disclaimer === void 0 ? void 0 : disclaimer.text)) : null))));
55
+ };
56
+ exports.SliderClient = SliderClient;
57
+ exports.default = exports.SliderClient;
package/build/cjs/constructor-items.d.ts CHANGED
@@ -36,7 +36,7 @@ export declare const blockMap: {
36
36
  "reports-cards-block": ({ title, typeKey, postscript, empty }: import("./models").ReportsCardsBlockProps) => JSX.Element;
37
37
  "reports-sections-block": ({ title, typeKey, empty }: import("./models").ReportsSectionsBlockProps) => JSX.Element;
38
38
  "form-wall-block": (props: import("./models").FormWallBlockProps) => JSX.Element;
39
- "slider-new-block": ({ animated, title, description, type, anchorId, arrows, adaptive, autoplay: autoplayMs, infinite, dots, initialSlide, className, dotsClassName, disclaimer, children, blockClassName, arrowSize, slidesToShow, onSlideChange, onSlideChangeTransitionStart, onSlideChangeTransitionEnd, onActiveIndexChange, onBreakpoint, }: import("react").PropsWithChildren<import("./blocks/SliderNew/Slider").SliderNewProps>) => JSX.Element;
39
+ "slider-new-block": (props: import("react").PropsWithChildren<import("./blocks/SliderNew/SliderClient").SliderNewProps>) => JSX.Element | null;
40
40
  };
41
41
  export declare const subBlockMap: {
42
42
  divider: ({ size, border }: import("./models").DividerProps) => JSX.Element;
package/build/esm/blocks/SliderNew/Slider.d.ts CHANGED
@@ -1,17 +1,4 @@
1
1
  import * as React from 'react';
2
- import 'swiper/css';
3
- import 'swiper/css/autoplay';
4
- import 'swiper/css/pagination';
5
- import type { SwiperProps } from 'swiper/react';
6
- import { ClassNameProps, Refable, SliderProps as SliderParams } from '../../models';
7
- import './Slider.css';
8
- export interface SliderNewProps extends Omit<SliderParams, 'children'>, Partial<Pick<SwiperProps, 'onSlideChange' | 'onSlideChangeTransitionStart' | 'onSlideChangeTransitionEnd' | 'onActiveIndexChange' | 'onBreakpoint'>>, Refable<HTMLDivElement>, ClassNameProps {
9
- type?: string;
10
- anchorId?: string;
11
- dotsClassName?: string;
12
- blockClassName?: string;
13
- arrowSize?: number;
14
- initialSlide?: number;
15
- }
16
- export declare const SliderNewBlock: ({ animated, title, description, type, anchorId, arrows, adaptive, autoplay: autoplayMs, infinite, dots, initialSlide, className, dotsClassName, disclaimer, children, blockClassName, arrowSize, slidesToShow, onSlideChange, onSlideChangeTransitionStart, onSlideChangeTransitionEnd, onActiveIndexChange, onBreakpoint, }: React.PropsWithChildren<SliderNewProps>) => JSX.Element;
2
+ import { SliderNewProps } from './SliderClient';
3
+ export declare const SliderNewBlock: (props: React.PropsWithChildren<SliderNewProps>) => JSX.Element | null;
17
4
  export default SliderNewBlock;
package/build/esm/blocks/SliderNew/Slider.js CHANGED
@@ -1,55 +1,14 @@
1
1
  import * as React from 'react';
2
- import 'swiper/css';
3
- import 'swiper/css/autoplay';
4
- import 'swiper/css/pagination';
5
- import { A11y, Autoplay, Pagination } from 'swiper/modules';
6
- import { Swiper as SwiperReact, SwiperSlide } from 'swiper/react';
7
- import Anchor from '../../components/Anchor/Anchor';
8
- import AnimateBlock from '../../components/AnimateBlock/AnimateBlock';
9
- import Title from '../../components/Title/Title';
10
- import { SliderType } from '../../models';
11
- import { block } from '../../utils';
12
- import Arrow from './Arrow/Arrow';
13
- import { i18n } from './i18n';
14
- import { useSlider } from './useSlider';
15
- import { useSliderPagination } from './useSliderPagination';
16
- import './Slider.css';
17
- const b = block('slider-new-block');
18
- export const SliderNewBlock = ({ animated, title, description, type, anchorId, arrows = true, adaptive, autoplay: autoplayMs, infinite = false, dots = true, initialSlide = 0, className, dotsClassName, disclaimer, children, blockClassName, arrowSize, slidesToShow, onSlideChange, onSlideChangeTransitionStart, onSlideChangeTransitionEnd, onActiveIndexChange, onBreakpoint, }) => {
19
- const { autoplay, isLocked, childrenCount, breakpoints, onSwiper, handleSwiperInit, onPrev, onNext, setIsLocked, } = useSlider({
20
- slidesToShow,
21
- children,
22
- type,
23
- autoplayMs,
24
- });
25
- const isA11yControlHidden = Boolean(autoplay);
26
- const controlTabIndex = isA11yControlHidden ? -1 : 0;
27
- const paginationProps = useSliderPagination({
28
- enabled: dots,
29
- isA11yControlHidden,
30
- controlTabIndex,
31
- bulletClass: b('dot', dotsClassName),
32
- bulletActiveClass: b('dot_active'),
33
- paginationLabel: i18n('pagination-label'),
34
- });
35
- return (React.createElement("div", { className: b({
36
- 'one-slide': childrenCount === 1,
37
- 'only-arrows': (!title || (typeof title !== 'string' && !(title === null || title === void 0 ? void 0 : title.text))) &&
38
- !description &&
39
- arrows,
40
- 'without-dots': !dots || isLocked,
41
- type,
42
- }, blockClassName) },
43
- anchorId && React.createElement(Anchor, { id: anchorId }),
44
- React.createElement(Title, { title: title, subtitle: description, className: b('header', { 'no-description': !description }) }),
45
- React.createElement(AnimateBlock, { className: b('animate-slides'), animate: animated },
46
- React.createElement(SwiperReact, Object.assign({ modules: [Autoplay, A11y, Pagination], className: b('slider', className), onSwiper: onSwiper, speed: 700, autoplay: autoplay, loop: infinite, autoHeight: adaptive, initialSlide: initialSlide, noSwiping: false, slidesOffsetBefore: 24, slidesOffsetAfter: 24, breakpoints: breakpoints, onSlideChange: onSlideChange, onSlideChangeTransitionStart: onSlideChangeTransitionStart, onSlideChangeTransitionEnd: onSlideChangeTransitionEnd, onActiveIndexChange: onActiveIndexChange, onBreakpoint: onBreakpoint, onLock: () => setIsLocked(true), onUnlock: () => setIsLocked(false), onInit: handleSwiperInit, watchSlidesProgress: true, watchOverflow: true, a11y: {
47
- slideLabelMessage: '',
48
- paginationBulletMessage: i18n('dot-label', { index: '{{index}}' }),
49
- } }, paginationProps), React.Children.map(children, (elem, index) => (React.createElement(SwiperSlide, { className: b('slide'), key: index }, ({ isVisible }) => (React.createElement("div", { className: b('slide-item'), "aria-hidden": !isA11yControlHidden && !isVisible }, elem)))))),
50
- arrows && !isLocked && (React.createElement("div", { "aria-hidden": isA11yControlHidden },
51
- React.createElement(Arrow, { className: b('arrow', { prev: true }), type: "left", transparent: type === SliderType.HeaderCard, onClick: onPrev, size: arrowSize, extraProps: { tabIndex: controlTabIndex } }),
52
- React.createElement(Arrow, { className: b('arrow', { next: true }), type: "right", transparent: type === SliderType.HeaderCard, onClick: onNext, size: arrowSize, extraProps: { tabIndex: controlTabIndex } }))),
53
- React.createElement("div", { className: b('footer') }, disclaimer ? (React.createElement("div", { className: b('disclaimer', { size: (disclaimer === null || disclaimer === void 0 ? void 0 : disclaimer.size) || 'm' }) }, disclaimer === null || disclaimer === void 0 ? void 0 : disclaimer.text)) : null))));
2
+ import SliderClient from './SliderClient';
3
+ export const SliderNewBlock = (props) => {
4
+ const [ClientComponent, setClientComponent] = React.useState(null);
5
+ React.useEffect(() => {
6
+ import('./SliderClient').then((mod) => {
7
+ setClientComponent(() => mod.default);
8
+ });
9
+ }, []);
10
+ if (!ClientComponent)
11
+ return null; // или прелоадер
12
+ return React.createElement(SliderClient, Object.assign({}, props));
54
13
  };
55
14
  export default SliderNewBlock;
package/build/esm/blocks/SliderNew/SliderClient.d.ts ADDED
@@ -0,0 +1,15 @@
1
+ import * as React from 'react';
2
+ import type { SwiperProps } from 'swiper/react';
3
+ import { ClassNameProps, Refable, SliderProps as SliderParams } from '../../models';
4
+ import './Slider.css';
5
+ import 'swiper/swiper-bundle.css';
6
+ export interface SliderNewProps extends Omit<SliderParams, 'children'>, Partial<Pick<SwiperProps, 'onSlideChange' | 'onSlideChangeTransitionStart' | 'onSlideChangeTransitionEnd' | 'onActiveIndexChange' | 'onBreakpoint'>>, Refable<HTMLDivElement>, ClassNameProps {
7
+ type?: string;
8
+ anchorId?: string;
9
+ dotsClassName?: string;
10
+ blockClassName?: string;
11
+ arrowSize?: number;
12
+ initialSlide?: number;
13
+ }
14
+ export declare const SliderClient: ({ animated, title, description, type, anchorId, arrows, adaptive, autoplay: autoplayMs, infinite, dots, initialSlide, className, dotsClassName, disclaimer, children, blockClassName, arrowSize, slidesToShow, onSlideChange, onSlideChangeTransitionStart, onSlideChangeTransitionEnd, onActiveIndexChange, onBreakpoint, }: React.PropsWithChildren<SliderNewProps>) => JSX.Element;
15
+ export default SliderClient;
package/build/esm/blocks/SliderNew/SliderClient.js ADDED
@@ -0,0 +1,53 @@
1
+ import * as React from 'react';
2
+ import { A11y, Autoplay, Pagination } from 'swiper/modules';
3
+ import { Swiper as SwiperReact, SwiperSlide } from 'swiper/react';
4
+ import Anchor from '../../components/Anchor/Anchor';
5
+ import AnimateBlock from '../../components/AnimateBlock/AnimateBlock';
6
+ import Title from '../../components/Title/Title';
7
+ import { SliderType } from '../../models';
8
+ import { block } from '../../utils';
9
+ import Arrow from './Arrow/Arrow';
10
+ import { i18n } from './i18n';
11
+ import { useSlider } from './useSlider';
12
+ import { useSliderPagination } from './useSliderPagination';
13
+ import './Slider.css';
14
+ import 'swiper/swiper-bundle.css';
15
+ const b = block('slider-new-block');
16
+ export const SliderClient = ({ animated, title, description, type, anchorId, arrows = true, adaptive, autoplay: autoplayMs, infinite = false, dots = true, initialSlide = 0, className, dotsClassName, disclaimer, children, blockClassName, arrowSize, slidesToShow, onSlideChange, onSlideChangeTransitionStart, onSlideChangeTransitionEnd, onActiveIndexChange, onBreakpoint, }) => {
17
+ const { autoplay, isLocked, childrenCount, breakpoints, onSwiper, handleSwiperInit, onPrev, onNext, setIsLocked, } = useSlider({
18
+ slidesToShow,
19
+ children,
20
+ type,
21
+ autoplayMs,
22
+ });
23
+ const isA11yControlHidden = Boolean(autoplay);
24
+ const controlTabIndex = isA11yControlHidden ? -1 : 0;
25
+ const paginationProps = useSliderPagination({
26
+ enabled: dots,
27
+ isA11yControlHidden,
28
+ controlTabIndex,
29
+ bulletClass: b('dot', dotsClassName),
30
+ bulletActiveClass: b('dot_active'),
31
+ paginationLabel: i18n('pagination-label'),
32
+ });
33
+ return (React.createElement("div", { className: b({
34
+ 'one-slide': childrenCount === 1,
35
+ 'only-arrows': (!title || (typeof title !== 'string' && !(title === null || title === void 0 ? void 0 : title.text))) &&
36
+ !description &&
37
+ arrows,
38
+ 'without-dots': !dots || isLocked,
39
+ type,
40
+ }, blockClassName) },
41
+ anchorId && React.createElement(Anchor, { id: anchorId }),
42
+ React.createElement(Title, { title: title, subtitle: description, className: b('header', { 'no-description': !description }) }),
43
+ React.createElement(AnimateBlock, { className: b('animate-slides'), animate: animated },
44
+ React.createElement(SwiperReact, Object.assign({ modules: [Autoplay, A11y, Pagination], className: b('slider', className), onSwiper: onSwiper, speed: 700, autoplay: autoplay, loop: infinite, autoHeight: adaptive, initialSlide: initialSlide, noSwiping: false, slidesOffsetBefore: 24, slidesOffsetAfter: 24, breakpoints: breakpoints, onSlideChange: onSlideChange, onSlideChangeTransitionStart: onSlideChangeTransitionStart, onSlideChangeTransitionEnd: onSlideChangeTransitionEnd, onActiveIndexChange: onActiveIndexChange, onBreakpoint: onBreakpoint, onLock: () => setIsLocked(true), onUnlock: () => setIsLocked(false), onInit: handleSwiperInit, watchSlidesProgress: true, watchOverflow: true, a11y: {
45
+ slideLabelMessage: '',
46
+ paginationBulletMessage: i18n('dot-label', { index: '{{index}}' }),
47
+ } }, paginationProps), React.Children.map(children, (elem, index) => (React.createElement(SwiperSlide, { className: b('slide'), key: index }, ({ isVisible }) => (React.createElement("div", { className: b('slide-item'), "aria-hidden": !isA11yControlHidden && !isVisible }, elem)))))),
48
+ arrows && !isLocked && (React.createElement("div", { "aria-hidden": isA11yControlHidden },
49
+ React.createElement(Arrow, { className: b('arrow', { prev: true }), type: "left", transparent: type === SliderType.HeaderCard, onClick: onPrev, size: arrowSize, extraProps: { tabIndex: controlTabIndex } }),
50
+ React.createElement(Arrow, { className: b('arrow', { next: true }), type: "right", transparent: type === SliderType.HeaderCard, onClick: onNext, size: arrowSize, extraProps: { tabIndex: controlTabIndex } }))),
51
+ React.createElement("div", { className: b('footer') }, disclaimer ? (React.createElement("div", { className: b('disclaimer', { size: (disclaimer === null || disclaimer === void 0 ? void 0 : disclaimer.size) || 'm' }) }, disclaimer === null || disclaimer === void 0 ? void 0 : disclaimer.text)) : null))));
52
+ };
53
+ export default SliderClient;
package/build/esm/constructor-items.d.ts CHANGED
@@ -36,7 +36,7 @@ export declare const blockMap: {
36
36
  "reports-cards-block": ({ title, typeKey, postscript, empty }: import("./models").ReportsCardsBlockProps) => JSX.Element;
37
37
  "reports-sections-block": ({ title, typeKey, empty }: import("./models").ReportsSectionsBlockProps) => JSX.Element;
38
38
  "form-wall-block": (props: import("./models").FormWallBlockProps) => JSX.Element;
39
- "slider-new-block": ({ animated, title, description, type, anchorId, arrows, adaptive, autoplay: autoplayMs, infinite, dots, initialSlide, className, dotsClassName, disclaimer, children, blockClassName, arrowSize, slidesToShow, onSlideChange, onSlideChangeTransitionStart, onSlideChangeTransitionEnd, onActiveIndexChange, onBreakpoint, }: import("react").PropsWithChildren<import("./blocks/SliderNew/Slider").SliderNewProps>) => JSX.Element;
39
+ "slider-new-block": (props: import("react").PropsWithChildren<import("./blocks/SliderNew/SliderClient").SliderNewProps>) => JSX.Element | null;
40
40
  };
41
41
  export declare const subBlockMap: {
42
42
  divider: ({ size, border }: import("./models").DividerProps) => JSX.Element;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@doyourjob/gravity-ui-page-constructor",
3
- "version": "5.31.100",
3
+ "version": "5.31.102",
4
4
  "description": "Gravity UI Page Constructor",
5
5
  "license": "MIT",
6
6
  "repository": {