@itcase/ui 1.9.21 → 1.9.23
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.
|
@@ -100,7 +100,7 @@ const modalAppearanceSurface = {
|
|
|
100
100
|
surfacePrimary: {
|
|
101
101
|
fill: 'surfacePrimary',
|
|
102
102
|
borderColor: 'surfaceBorderPrimary',
|
|
103
|
-
closeIconAppearance: 'surfacePrimary
|
|
103
|
+
closeIconAppearance: 'surfacePrimary ghost circular',
|
|
104
104
|
},
|
|
105
105
|
};
|
|
106
106
|
|
|
@@ -137,7 +137,7 @@ const getOrCreateModalElement = (modalIdQuerySelector, className = '') => {
|
|
|
137
137
|
};
|
|
138
138
|
// Modal component that is an abstraction around the portal API.
|
|
139
139
|
const Modal = React.forwardRef(function Modal(props, ref) {
|
|
140
|
-
const { id, appearance, className, dataTestId, dataTour, title, absoluteHeader = false, modalIdQuerySelector = 'modal-global', print, scroll = false, stickyHeader = false, closeIcon, isDisabled, isSkeleton, isCloseOnBlur = true, isOpen: initialIsOpen = false, isOverlay = true, isScrollOnOpen = true, isSetFocusOnOpen = true, onClickOverlay, onCloseModal, onOpenModal, children, } = props;
|
|
140
|
+
const { id, appearance, className, dataTestId, dataTour, title, absoluteHeader = false, modalIdQuerySelector = 'modal-global', print, scroll = false, stickyHeader = false, closeIcon = true, isDisabled, isSkeleton, isCloseOnBlur = true, isOpen: initialIsOpen = false, isOverlay = true, isScrollOnOpen = true, isSetFocusOnOpen = true, onClickOverlay, onCloseModal, onOpenModal, children, } = props;
|
|
141
141
|
// Query DOM element
|
|
142
142
|
const [modalElement, setModalElement] = React.useState(null);
|
|
143
143
|
const [isOpen, setIsOpen] = React.useState(initialIsOpen);
|
|
@@ -81,13 +81,13 @@ function Swiper(props) {
|
|
|
81
81
|
const { alignClass, alignDirectionClass, fillClass, shapeClass } = propsGenerator;
|
|
82
82
|
// @ts-expect-error
|
|
83
83
|
const { styles: style } = useStyles.useStyles(props);
|
|
84
|
-
return (jsxRuntime.jsxs("div", { id: id, className: clsx('swiper-block', slidesPerView === 'auto' && 'swiper-block_type_auto', fillClass && `fill_${fillClass}`, shapeClass && `swiper_shape_${shapeClass}`, className), style: style, children: [
|
|
84
|
+
return (jsxRuntime.jsxs("div", { id: id, className: clsx('swiper-block', slidesPerView === 'auto' && 'swiper-block_type_auto', fillClass && `fill_${fillClass}`, shapeClass && `swiper_shape_${shapeClass}`, className), style: style, children: [title && (jsxRuntime.jsxs("div", { className: "swiper-block__wrapper", children: [title && (jsxRuntime.jsx(Icon.Title, { className: "swiper-block__title", size: titleSize, textColor: titleTextColor, textWeight: titleWeight, children: title })), titleAfter] })), prevButton && nextButton && (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsx("div", { className: "swiper-block__prev swiper-button", ref: prevRef, children: prevButton }), jsxRuntime.jsx("div", { className: "swiper-block__next swiper-button", ref: nextRef, children: nextButton })] })), jsxRuntime.jsx(react.Swiper, { className: clsx('swiper-block__swiper', swiperClass), ref: swiperRef, direction: direction, allowTouchMove: allowTouchMove, autoHeight: autoHeight ?? false, breakpoints: breakpoints, centeredSlides: true, freeMode: freeMode, init: isInit ?? true, keyboard: keyboard, loop: isLoop, modules: modules, mousewheel: mousewheel, navigation: isNavigation ? { nextEl, prevEl } : false, normalizeSlideIndex: normalizeSlideIndex, pagination: pagination, preventClicks: preventClicks, preventClicksPropagation: preventClicksPropagation, scrollbar: isScrollbar, simulateTouch: simulateTouch, slidesPerView: slidesPerView, spaceBetween: spaceBetween, speed: speed ?? 500, zoom: {
|
|
85
85
|
minRatio: minZoom,
|
|
86
86
|
maxRatio: maxZoom,
|
|
87
87
|
enabled: isZoomEnabled,
|
|
88
88
|
toggle: true,
|
|
89
89
|
}, onInit: onInitSwiper, onSlideChange: onSlideChange, onSlideNextTransitionEnd: onSlideNextTransitionEnd, onSlidePrevTransitionEnd: onSlidePrevTransitionEnd, onSwiper: onSwiper, onTransitionStart: onTransitionStart, onUpdate: onUpdate, children: children ||
|
|
90
|
-
items?.map((item, i) => (jsxRuntime.jsx(react.SwiperSlide, { className: clsx('swiper-block__item', isZoomEnabled && 'swiper-block__item_zooming', swiperSlideClass, alignDirectionClass && `align_${alignDirectionClass}`, alignClass && `align_${alignClass}`), children: isZoomEnabled ? (jsxRuntime.jsx("div", { className: "swiper-zoom-container", children: item })) : (item) }, `swiper-slide_${i}`))) }), isShowOriginalLink && (jsxRuntime.jsx(Group.Group, { width: "fill", fill: "surfacePrimary", padding: "1m 0", children: jsxRuntime.jsx(Text.Text, { size: "
|
|
90
|
+
items?.map((item, i) => (jsxRuntime.jsx(react.SwiperSlide, { className: clsx('swiper-block__item', isZoomEnabled && 'swiper-block__item_zooming', swiperSlideClass, alignDirectionClass && `align_${alignDirectionClass}`, alignClass && `align_${alignClass}`), children: isZoomEnabled ? (jsxRuntime.jsx("div", { className: "swiper-zoom-container", children: item })) : (item) }, `swiper-slide_${i}`))) }), isShowOriginalLink && (jsxRuntime.jsx(Group.Group, { width: "fill", fill: "surfacePrimary", padding: "1m 0", children: jsxRuntime.jsx(Text.Text, { size: "s", textColor: "surfaceTextPrimary", textColorHover: "surfaceTextQuaternary", onClick: onClickShowOriginalButton, children: "\u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C \u043E\u0440\u0438\u0433\u0438\u043D\u0430\u043B" }) }))] }));
|
|
91
91
|
}
|
|
92
92
|
// https://github.com/nolimits4web/swiper/issues/3855#issuecomment-1050694342
|
|
93
93
|
const useSwiperRef = () => {
|
package/dist/components/Modal.js
CHANGED
|
@@ -98,7 +98,7 @@ const modalAppearanceSurface = {
|
|
|
98
98
|
surfacePrimary: {
|
|
99
99
|
fill: 'surfacePrimary',
|
|
100
100
|
borderColor: 'surfaceBorderPrimary',
|
|
101
|
-
closeIconAppearance: 'surfacePrimary
|
|
101
|
+
closeIconAppearance: 'surfacePrimary ghost circular',
|
|
102
102
|
},
|
|
103
103
|
};
|
|
104
104
|
|
|
@@ -135,7 +135,7 @@ const getOrCreateModalElement = (modalIdQuerySelector, className = '') => {
|
|
|
135
135
|
};
|
|
136
136
|
// Modal component that is an abstraction around the portal API.
|
|
137
137
|
const Modal = React.forwardRef(function Modal(props, ref) {
|
|
138
|
-
const { id, appearance, className, dataTestId, dataTour, title, absoluteHeader = false, modalIdQuerySelector = 'modal-global', print, scroll = false, stickyHeader = false, closeIcon, isDisabled, isSkeleton, isCloseOnBlur = true, isOpen: initialIsOpen = false, isOverlay = true, isScrollOnOpen = true, isSetFocusOnOpen = true, onClickOverlay, onCloseModal, onOpenModal, children, } = props;
|
|
138
|
+
const { id, appearance, className, dataTestId, dataTour, title, absoluteHeader = false, modalIdQuerySelector = 'modal-global', print, scroll = false, stickyHeader = false, closeIcon = true, isDisabled, isSkeleton, isCloseOnBlur = true, isOpen: initialIsOpen = false, isOverlay = true, isScrollOnOpen = true, isSetFocusOnOpen = true, onClickOverlay, onCloseModal, onOpenModal, children, } = props;
|
|
139
139
|
// Query DOM element
|
|
140
140
|
const [modalElement, setModalElement] = useState(null);
|
|
141
141
|
const [isOpen, setIsOpen] = useState(initialIsOpen);
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { useRef, useCallback, useImperativeHandle, useEffect, useState } from 'react';
|
|
2
|
+
import React, { useRef, useCallback, useImperativeHandle, useEffect, useState } from 'react';
|
|
3
3
|
import clsx from 'clsx';
|
|
4
4
|
import { Swiper as Swiper$1, SwiperSlide } from 'swiper/react';
|
|
5
5
|
import { G as Group } from '../Group_es_BwTj-yH-.js';
|
|
@@ -79,13 +79,13 @@ function Swiper(props) {
|
|
|
79
79
|
const { alignClass, alignDirectionClass, fillClass, shapeClass } = propsGenerator;
|
|
80
80
|
// @ts-expect-error
|
|
81
81
|
const { styles: style } = useStyles(props);
|
|
82
|
-
return (jsxs("div", { id: id, className: clsx('swiper-block', slidesPerView === 'auto' && 'swiper-block_type_auto', fillClass && `fill_${fillClass}`, shapeClass && `swiper_shape_${shapeClass}`, className), style: style, children: [
|
|
82
|
+
return (jsxs("div", { id: id, className: clsx('swiper-block', slidesPerView === 'auto' && 'swiper-block_type_auto', fillClass && `fill_${fillClass}`, shapeClass && `swiper_shape_${shapeClass}`, className), style: style, children: [title && (jsxs("div", { className: "swiper-block__wrapper", children: [title && (jsx(Title, { className: "swiper-block__title", size: titleSize, textColor: titleTextColor, textWeight: titleWeight, children: title })), titleAfter] })), prevButton && nextButton && (jsxs(React.Fragment, { children: [jsx("div", { className: "swiper-block__prev swiper-button", ref: prevRef, children: prevButton }), jsx("div", { className: "swiper-block__next swiper-button", ref: nextRef, children: nextButton })] })), jsx(Swiper$1, { className: clsx('swiper-block__swiper', swiperClass), ref: swiperRef, direction: direction, allowTouchMove: allowTouchMove, autoHeight: autoHeight ?? false, breakpoints: breakpoints, centeredSlides: true, freeMode: freeMode, init: isInit ?? true, keyboard: keyboard, loop: isLoop, modules: modules, mousewheel: mousewheel, navigation: isNavigation ? { nextEl, prevEl } : false, normalizeSlideIndex: normalizeSlideIndex, pagination: pagination, preventClicks: preventClicks, preventClicksPropagation: preventClicksPropagation, scrollbar: isScrollbar, simulateTouch: simulateTouch, slidesPerView: slidesPerView, spaceBetween: spaceBetween, speed: speed ?? 500, zoom: {
|
|
83
83
|
minRatio: minZoom,
|
|
84
84
|
maxRatio: maxZoom,
|
|
85
85
|
enabled: isZoomEnabled,
|
|
86
86
|
toggle: true,
|
|
87
87
|
}, onInit: onInitSwiper, onSlideChange: onSlideChange, onSlideNextTransitionEnd: onSlideNextTransitionEnd, onSlidePrevTransitionEnd: onSlidePrevTransitionEnd, onSwiper: onSwiper, onTransitionStart: onTransitionStart, onUpdate: onUpdate, children: children ||
|
|
88
|
-
items?.map((item, i) => (jsx(SwiperSlide, { className: clsx('swiper-block__item', isZoomEnabled && 'swiper-block__item_zooming', swiperSlideClass, alignDirectionClass && `align_${alignDirectionClass}`, alignClass && `align_${alignClass}`), children: isZoomEnabled ? (jsx("div", { className: "swiper-zoom-container", children: item })) : (item) }, `swiper-slide_${i}`))) }), isShowOriginalLink && (jsx(Group, { width: "fill", fill: "surfacePrimary", padding: "1m 0", children: jsx(Text, { size: "
|
|
88
|
+
items?.map((item, i) => (jsx(SwiperSlide, { className: clsx('swiper-block__item', isZoomEnabled && 'swiper-block__item_zooming', swiperSlideClass, alignDirectionClass && `align_${alignDirectionClass}`, alignClass && `align_${alignClass}`), children: isZoomEnabled ? (jsx("div", { className: "swiper-zoom-container", children: item })) : (item) }, `swiper-slide_${i}`))) }), isShowOriginalLink && (jsx(Group, { width: "fill", fill: "surfacePrimary", padding: "1m 0", children: jsx(Text, { size: "s", textColor: "surfaceTextPrimary", textColorHover: "surfaceTextQuaternary", onClick: onClickShowOriginalButton, children: "\u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C \u043E\u0440\u0438\u0433\u0438\u043D\u0430\u043B" }) }))] }));
|
|
89
89
|
}
|
|
90
90
|
// https://github.com/nolimits4web/swiper/issues/3855#issuecomment-1050694342
|
|
91
91
|
const useSwiperRef = () => {
|