@itcase/ui 1.8.66 → 1.8.68

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 (7) hide show
  1. package/dist/cjs/components/Modal.js +1 -1
  2. package/dist/cjs/components/ModalSheetBottom.js +1 -1
  3. package/dist/components/Modal.js +1 -1
  4. package/dist/components/ModalSheetBottom.js +1 -1
  5. package/dist/css/components/Modal/Modal.css +2 -1
  6. package/dist/css/components/ModalSheetBottom/ModalSheetBottom.css +4 -1
  7. package/package.json +4 -4
package/dist/cjs/components/Modal.js CHANGED
@@ -225,7 +225,7 @@ var Modal = React.forwardRef(function Modal(props, ref) {
225
225
  return (modalElement &&
226
226
  ReactDOM.createPortal(
227
227
  // Any valid React child: JSX, strings, arrays, etc.
228
- isOpen ? (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsxs("div", { id: id, className: clsx('modal__content', contentClassName, fillClass && "fill_".concat(fillClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), shapeClass && "shape_".concat(shapeClass), sizeClass && "modal_size_".concat(sizeClass), shapeStrengthClass && "shape-strength_".concat(shapeStrengthClass), borderColorClass && "border-color_".concat(borderColorClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass), elevationClass && "elevation_".concat(elevationClass), scroll && "modal-scroll_".concat(scroll), isSkeleton && 'modal_skeleton'), dataTestId: dataTestId, dataTour: dataTour, ref: modalContentRef, style: modalStyles, tabIndex: 0, onBlur: isCloseOnBlur && closeModal, children: [(title || closeIconImage) && (jsxRuntime.jsxs("div", { className: "modal__header", children: [title && (jsxRuntime.jsx(Icon.Title, { className: "modal__title", width: titleTextWidth, size: titleTextSize, textColor: titleTextColor, textColorHover: titleTextColorHover, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), closeIconImage && (jsxRuntime.jsx("div", { className: "modal__close", onClick: closeModal, children: jsxRuntime.jsx(Icon.Icon, { appearance: closeIconAppearance, SvgImage: closeIconImage, iconSize: closeIconSize, shape: closeIconShape }) }))] })), jsxRuntime.jsx("div", { className: "modal__content-wrapper", children: children })] }), jsxRuntime.jsx(Overlay.Overlay, { className: "modal__overlay",
228
+ isOpen ? (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsxs("div", { id: id, className: clsx('modal__content', contentClassName, fillClass && "fill_".concat(fillClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), shapeClass && "shape_".concat(shapeClass), sizeClass && "modal_size_".concat(sizeClass), shapeStrengthClass && "shape-strength_".concat(shapeStrengthClass), borderColorClass && "border-color_".concat(borderColorClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass), elevationClass && "elevation_".concat(elevationClass), scroll && "modal-scroll_".concat(scroll), isSkeleton && 'modal_skeleton'), dataTestId: dataTestId, dataTour: dataTour, ref: modalContentRef, style: modalStyles, tabIndex: 0, onBlur: isCloseOnBlur && closeModal, children: [(closeModal || title || closeIconImage) && (jsxRuntime.jsxs("div", { className: "modal__header", children: [title && (jsxRuntime.jsx(Icon.Title, { className: "modal__title", width: titleTextWidth, size: titleTextSize, textColor: titleTextColor, textColorHover: titleTextColorHover, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), closeIconImage && (jsxRuntime.jsx("div", { className: "modal__close", onClick: closeModal, children: jsxRuntime.jsx(Icon.Icon, { appearance: closeIconAppearance, iconSize: closeIconSize, shape: closeIconShape, SvgImage: closeIconImage }) }))] })), jsxRuntime.jsx("div", { className: "modal__content-wrapper", children: children })] }), jsxRuntime.jsx(Overlay.Overlay, { className: "modal__overlay",
229
229
  // ref={modalOverlayRef}
230
230
  fill: overlayFill, opacity: overlayOpacity, isOverlay: isOverlay, onClick: onClickOverlay })] })) : null,
231
231
  // A DOM element
package/dist/cjs/components/ModalSheetBottom.js CHANGED
@@ -41,7 +41,7 @@ var ModalSheetBottom = React.forwardRef(function Modal(props, ref) {
41
41
  React.useImperativeHandle(ref, function () { return ({ openModalSheetBottom: openModalSheetBottom, closeModalSheetBottom: closeModalSheetBottom, isOpen: isOpen }); }, [isOpen, openModalSheetBottom, closeModalSheetBottom]);
42
42
  // @ts-expect-error
43
43
  var styles = useStyles.useStyles(props).styles;
44
- return (jsxRuntime.jsxs(reactModalSheet.Sheet, tslib_es6.__assign({ className: "modal-sheet-bottom", dataTestId: dataTestId, dataTour: dataTour, isOpen: isOpen, onClose: closeModalSheetBottom }, props, { children: [jsxRuntime.jsxs(reactModalSheet.Sheet.Container, { className: "modal-sheet-bottom__container", style: styles, children: [closeButton ? (jsxRuntime.jsx("div", { className: "modal-sheet-bottom__header", children: jsxRuntime.jsx("div", { className: "modal-sheet-bottom__close", onClick: closeModalSheetBottom, children: closeButton }) })) : (jsxRuntime.jsx(reactModalSheet.Sheet.Header, { className: "modal-sheet-bottom__header" })), jsxRuntime.jsx(reactModalSheet.Sheet.Content, { className: "modal-sheet-bottom__content", children: children })] }), jsxRuntime.jsx(reactModalSheet.Sheet.Backdrop, { className: "modal-sheet-bottom__backdrop", onClick: closeModalSheetBottom })] })));
44
+ return (jsxRuntime.jsxs(reactModalSheet.Sheet, tslib_es6.__assign({ className: "modal-sheet-bottom", dataTestId: dataTestId, dataTour: dataTour, isOpen: isOpen, onClose: closeModalSheetBottom }, props, { children: [jsxRuntime.jsxs(reactModalSheet.Sheet.Container, { className: "modal-sheet-bottom__container", style: styles, children: [closeButton ? (jsxRuntime.jsx("div", { className: "modal-sheet-bottom__header", children: jsxRuntime.jsx("div", { className: "modal-sheet-bottom__close", onClick: closeModalSheetBottom, children: closeButton }) })) : (jsxRuntime.jsx(reactModalSheet.Sheet.Header, { className: "modal-sheet-bottom__header" })), jsxRuntime.jsx(reactModalSheet.Sheet.Content, { className: "modal-sheet-bottom__content", children: jsxRuntime.jsx("div", { className: "modal-sheet-bottom__content-wrapper", children: children }) })] }), jsxRuntime.jsx(reactModalSheet.Sheet.Backdrop, { className: "modal-sheet-bottom__backdrop", onClick: closeModalSheetBottom })] })));
45
45
  });
46
46
 
47
47
  exports.ModalSheetBottom = ModalSheetBottom;
package/dist/components/Modal.js CHANGED
@@ -223,7 +223,7 @@ var Modal = React.forwardRef(function Modal(props, ref) {
223
223
  return (modalElement &&
224
224
  ReactDOM.createPortal(
225
225
  // Any valid React child: JSX, strings, arrays, etc.
226
- isOpen ? (jsxs(React.Fragment, { children: [jsxs("div", { id: id, className: clsx('modal__content', contentClassName, fillClass && "fill_".concat(fillClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), shapeClass && "shape_".concat(shapeClass), sizeClass && "modal_size_".concat(sizeClass), shapeStrengthClass && "shape-strength_".concat(shapeStrengthClass), borderColorClass && "border-color_".concat(borderColorClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass), elevationClass && "elevation_".concat(elevationClass), scroll && "modal-scroll_".concat(scroll), isSkeleton && 'modal_skeleton'), dataTestId: dataTestId, dataTour: dataTour, ref: modalContentRef, style: modalStyles, tabIndex: 0, onBlur: isCloseOnBlur && closeModal, children: [(title || closeIconImage) && (jsxs("div", { className: "modal__header", children: [title && (jsx(Title, { className: "modal__title", width: titleTextWidth, size: titleTextSize, textColor: titleTextColor, textColorHover: titleTextColorHover, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), closeIconImage && (jsx("div", { className: "modal__close", onClick: closeModal, children: jsx(Icon, { appearance: closeIconAppearance, SvgImage: closeIconImage, iconSize: closeIconSize, shape: closeIconShape }) }))] })), jsx("div", { className: "modal__content-wrapper", children: children })] }), jsx(Overlay, { className: "modal__overlay",
226
+ isOpen ? (jsxs(React.Fragment, { children: [jsxs("div", { id: id, className: clsx('modal__content', contentClassName, fillClass && "fill_".concat(fillClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), shapeClass && "shape_".concat(shapeClass), sizeClass && "modal_size_".concat(sizeClass), shapeStrengthClass && "shape-strength_".concat(shapeStrengthClass), borderColorClass && "border-color_".concat(borderColorClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass), elevationClass && "elevation_".concat(elevationClass), scroll && "modal-scroll_".concat(scroll), isSkeleton && 'modal_skeleton'), dataTestId: dataTestId, dataTour: dataTour, ref: modalContentRef, style: modalStyles, tabIndex: 0, onBlur: isCloseOnBlur && closeModal, children: [(closeModal || title || closeIconImage) && (jsxs("div", { className: "modal__header", children: [title && (jsx(Title, { className: "modal__title", width: titleTextWidth, size: titleTextSize, textColor: titleTextColor, textColorHover: titleTextColorHover, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), closeIconImage && (jsx("div", { className: "modal__close", onClick: closeModal, children: jsx(Icon, { appearance: closeIconAppearance, iconSize: closeIconSize, shape: closeIconShape, SvgImage: closeIconImage }) }))] })), jsx("div", { className: "modal__content-wrapper", children: children })] }), jsx(Overlay, { className: "modal__overlay",
227
227
  // ref={modalOverlayRef}
228
228
  fill: overlayFill, opacity: overlayOpacity, isOverlay: isOverlay, onClick: onClickOverlay })] })) : null,
229
229
  // A DOM element
package/dist/components/ModalSheetBottom.js CHANGED
@@ -39,7 +39,7 @@ var ModalSheetBottom = React.forwardRef(function Modal(props, ref) {
39
39
  useImperativeHandle(ref, function () { return ({ openModalSheetBottom: openModalSheetBottom, closeModalSheetBottom: closeModalSheetBottom, isOpen: isOpen }); }, [isOpen, openModalSheetBottom, closeModalSheetBottom]);
40
40
  // @ts-expect-error
41
41
  var styles = useStyles(props).styles;
42
- return (jsxs(Sheet, __assign({ className: "modal-sheet-bottom", dataTestId: dataTestId, dataTour: dataTour, isOpen: isOpen, onClose: closeModalSheetBottom }, props, { children: [jsxs(Sheet.Container, { className: "modal-sheet-bottom__container", style: styles, children: [closeButton ? (jsx("div", { className: "modal-sheet-bottom__header", children: jsx("div", { className: "modal-sheet-bottom__close", onClick: closeModalSheetBottom, children: closeButton }) })) : (jsx(Sheet.Header, { className: "modal-sheet-bottom__header" })), jsx(Sheet.Content, { className: "modal-sheet-bottom__content", children: children })] }), jsx(Sheet.Backdrop, { className: "modal-sheet-bottom__backdrop", onClick: closeModalSheetBottom })] })));
42
+ return (jsxs(Sheet, __assign({ className: "modal-sheet-bottom", dataTestId: dataTestId, dataTour: dataTour, isOpen: isOpen, onClose: closeModalSheetBottom }, props, { children: [jsxs(Sheet.Container, { className: "modal-sheet-bottom__container", style: styles, children: [closeButton ? (jsx("div", { className: "modal-sheet-bottom__header", children: jsx("div", { className: "modal-sheet-bottom__close", onClick: closeModalSheetBottom, children: closeButton }) })) : (jsx(Sheet.Header, { className: "modal-sheet-bottom__header" })), jsx(Sheet.Content, { className: "modal-sheet-bottom__content", children: jsx("div", { className: "modal-sheet-bottom__content-wrapper", children: children }) })] }), jsx(Sheet.Backdrop, { className: "modal-sheet-bottom__backdrop", onClick: closeModalSheetBottom })] })));
43
43
  });
44
44
 
45
45
  export { ModalSheetBottom, modalSheetBottomAppearance };
package/dist/css/components/Modal/Modal.css CHANGED
@@ -13,6 +13,7 @@
13
13
  min-width: 200px;
14
14
  min-height: 200px;
15
15
  max-width: var(--modal-max-width);
16
+ border: solid 20px red;
16
17
  position: relative;
17
18
  z-index: 100;
18
19
  &:focus {
@@ -52,7 +53,7 @@
52
53
  }
53
54
  ^&__content {
54
55
  &-wrapper {
55
- padding: var(--modal-$(size)-padding) 0;
56
+ padding: 0 var(--modal-$(size)-padding);
56
57
  }
57
58
  }
58
59
  }
package/dist/css/components/ModalSheetBottom/ModalSheetBottom.css CHANGED
@@ -17,7 +17,10 @@
17
17
  }
18
18
  }
19
19
  &__content {
20
- margin: 0 0 32px 0;
20
+ padding: 0 16px;
21
+ &-wrapper {
22
+ padding: 0 0 32px 0;
23
+ }
21
24
  }
22
25
  &__backdrop {
23
26
  background-color: var(
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@itcase/ui",
3
- "version": "1.8.66",
3
+ "version": "1.8.68",
4
4
  "description": "UI components (Modal, Loader, Popup, etc)",
5
5
  "keywords": [
6
6
  "Modal",
@@ -103,7 +103,7 @@
103
103
  "@emotion/is-prop-valid": "^1.3.1",
104
104
  "@itcase/common": "^1.2.28",
105
105
  "@itcase/icons": "^1.2.16",
106
- "@itcase/storybook-config": "^1.1.54",
106
+ "@itcase/storybook-config": "^1.1.61",
107
107
  "@itcase/tokens-am": "^1.1.19",
108
108
  "@itcase/tokens-baikal": "^1.1.17",
109
109
  "@itcase/tokens-palette": "^1.1.11",
@@ -112,11 +112,11 @@
112
112
  "date-fns": "^4.1.0",
113
113
  "eslint-import-resolver-alias": "^1.1.2",
114
114
  "eslint-plugin-import": "^2.32.0",
115
- "framer-motion": "^12.23.7",
115
+ "framer-motion": "^12.23.9",
116
116
  "js-cookie": "^3.0.5",
117
117
  "lodash": "^4.17.21",
118
118
  "luxon": "^3.7.1",
119
- "motion": "^12.23.7",
119
+ "motion": "^12.23.9",
120
120
  "rc-slider": "^11.1.8",
121
121
  "react": "^18.3.1",
122
122
  "react-dadata": "^2.27.4",