@alfalab/core-components 25.2.0-beta.0 → 25.4.0

package/modal/cssm/Component.mobile.js

@@ -5,15 +5,18 @@ var React = require('react');
 var cn = require('classnames');
 var coreComponentsBaseModal = require('../../base-modal/cssm');
 require('./Context.js');
-require('../../button/cssm');
+require('./components/header/index.module.css');
+require('./components/header/Component.js');
+require('../../icon-button/cssm');
+require('@alfalab/icons-glyph/CrossHeavyMIcon');
 require('./components/closer/index.module.css');
 var components_closer_Component = require('./components/closer/Component.js');
-require('./components/header/Component.js');
 require('./components/content/Component.js');
 require('./components/footer/layout.module.css');
 require('./components/footer/Component.js');
 var transitions = require('./transitions.module.css');
 var hooks = require('@alfalab/hooks');
+require('@alfalab/icons-glyph/CrossMIcon');
 require('./components/header/mobile.module.css');
 var components_header_Component_mobile = require('./components/header/Component.mobile.js');
 require('./components/content/mobile.module.css');

package/modal/cssm/Component.responsive.d.ts

@@ -11,9 +11,9 @@ declare const ModalResponsive: React.ForwardRefExoticComponent<import("packages/
     fixedPosition?: boolean | undefined;
     hasCloser?: boolean | undefined;
 } & React.RefAttributes<HTMLDivElement>> & {
-    Header: React.FC<import("./components/header/Component").HeaderProps> | React.FC<import("./components/header/Component.desktop").HeaderDesktopProps>;
-    Content: React.FC<import("./components/content/Component").ContentProps> | React.FC<import("./components/content/Component.desktop").ContentDesktopProps>;
-    Footer: React.FC<import("./components/footer/Component").FooterProps> | React.FC<import("./components/footer/Component.desktop").FooterDesktopProps>;
+    Header: React.FC<import("./components/header/Component.desktop").HeaderDesktopProps> | React.FC<import("./components/header/Component.mobile").HeaderMobileProps>;
+    Content: React.FC<import("./components/content/Component.desktop").ContentDesktopProps> | React.FC<import("./components/content/Component").ContentProps>;
+    Footer: React.FC<import("./components/footer/Component.desktop").FooterDesktopProps> | React.FC<import("./components/footer/Component").FooterProps>;
     Closer: React.FC<import("./components/closer/Component").CloserProps>;
 };
 export { ModalResponsiveProps, ModalResponsive };

package/modal/cssm/Component.responsive.js

@@ -6,10 +6,12 @@ require('classnames');
 require('../../base-modal/cssm');
 require('react-merge-refs');
 require('./Context.js');
-require('../../button/cssm');
+require('./components/header/index.module.css');
+require('./components/header/Component.js');
+require('../../icon-button/cssm');
+require('@alfalab/icons-glyph/CrossHeavyMIcon');
 require('./components/closer/index.module.css');
 var components_closer_Component = require('./components/closer/Component.js');
-require('./components/header/Component.js');
 require('./components/header/desktop.module.css');
 require('./components/header/Component.desktop.js');
 require('./components/content/Component.js');
@@ -23,6 +25,7 @@ require('./desktop.module.css');
 require('./transitions.module.css');
 var Component_desktop = require('./Component.desktop.js');
 var hooks = require('@alfalab/hooks');
+require('@alfalab/icons-glyph/CrossMIcon');
 require('./components/header/mobile.module.css');
 require('./components/header/Component.mobile.js');
 require('./components/content/mobile.module.css');

package/modal/cssm/components/closer/Component.d.ts

@@ -1,4 +1,5 @@
-import { ButtonHTMLAttributes, FC } from 'react';
+import { ButtonHTMLAttributes, ElementType, FC } from 'react';
+import { IconButtonProps } from "../../../../icon-button";
 type CloserProps = ButtonHTMLAttributes<HTMLButtonElement> & {
     /**
      * Дополнительный класс
@@ -8,6 +9,14 @@ type CloserProps = ButtonHTMLAttributes<HTMLButtonElement> & {
      * Позиция крестика
      */
     align?: 'left' | 'right';
+    /**
+     * Размер кнопки
+     */
+    size?: IconButtonProps['size'];
+    /**
+     * Иконка
+     */
+    icon?: ElementType;
     /**
      * Флаг, что модальное окно открыто на весь экран
      */

package/modal/cssm/components/closer/Component.js

@@ -5,7 +5,8 @@ var React = require('react');
 var cn = require('classnames');
 require('../../../../base-modal/cssm');
 var Context = require('../../Context.js');
-var coreComponentsButton = require('../../../../button/cssm');
+var coreComponentsIconButton = require('../../../../icon-button/cssm');
+var CrossHeavyMIcon = require('@alfalab/icons-glyph/CrossHeavyMIcon');
 var styles = require('./index.module.css');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -15,12 +16,12 @@ var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 var styles__default = /*#__PURE__*/_interopDefaultLegacy(styles);
 
 var Closer = function (_a) {
-    var className = _a.className, fullscreen = _a.fullscreen, align = _a.align, restProps = tslib_es6.__rest(_a, ["className", "fullscreen", "align"]);
+    var className = _a.className, fullscreen = _a.fullscreen, align = _a.align, _b = _a.size, size = _b === void 0 ? 's' : _b, _c = _a.icon, icon = _c === void 0 ? CrossHeavyMIcon.CrossHeavyMIcon : _c, restProps = tslib_es6.__rest(_a, ["className", "fullscreen", "align", "size", "icon"]);
     var onClose = React.useContext(Context.ModalContext).onClose;
     var handleClick = React.useCallback(function (event) {
         onClose(event, 'closerClick');
     }, [onClose]);
-    return (React__default['default'].createElement(coreComponentsButton.Button, tslib_es6.__assign({ type: 'button', view: 'ghost', className: cn__default['default'](styles__default['default'].closer, className, fullscreen && styles__default['default'].fullscreen, align && styles__default['default'][align]), "aria-label": '\u0437\u0430\u043A\u0440\u044B\u0442\u044C', onClick: handleClick }, restProps)));
+    return (React__default['default'].createElement(coreComponentsIconButton.IconButton, tslib_es6.__assign({ size: size, className: cn__default['default'](styles__default['default'].closer, className, fullscreen && styles__default['default'].fullscreen, align && styles__default['default'][align]), "aria-label": '\u0437\u0430\u043A\u0440\u044B\u0442\u044C', onClick: handleClick, icon: icon }, restProps)));
 };
 
 exports.Closer = Closer;

package/modal/cssm/components/closer/index.module.css

@@ -16,28 +16,20 @@
 
     /* paddings */
 
-    /* closer */
-    --modal-closer-icon: url('https://alfabank.gcdn.co/icons/glyph_cross_m.svg');
-
     /* sticky */
 
     /* scroll */
+
+    /* mobile */
 }
 .closer {
-    width: 48px;
-    height: 48px;
-    background-image: var(--modal-closer-icon);
-    background-position: center;
-    background-repeat: no-repeat;
     flex-shrink: 0;
-    transition: opacity 0.2s ease-out
+
+    background: rgba(255, 255, 255, 0.4);
+    -webkit-backdrop-filter: blur(10px);
+            backdrop-filter: blur(10px);
+    border-radius: 50px;
 }
-.closer:hover {
-        opacity: 0.7;
-    }
-.closer:active {
-        opacity: 0.5;
-    }
 .left,
 .right {
     position: sticky;

package/modal/cssm/components/content/desktop.module.css

@@ -20,11 +20,11 @@
     --modal-l-content-paddings: 0 var(--gap-6xl) 0;
     --modal-l-content-no-footer-bottom-padding: var(--gap-6xl);
 
-    /* closer */
-
     /* sticky */
 
     /* scroll */
+
+    /* mobile */
 }
 .content {
     composes: content from 'index.module.css';

package/modal/cssm/components/content/index.module.css

@@ -18,11 +18,11 @@
     --modal-content-no-footer-bottom-padding: var(--gap-4xl);
     --modal-content-no-header-top-padding: var(--gap-2xl);
 
-    /* closer */
-
     /* sticky */
 
     /* scroll */
+
+    /* mobile */
 }
 .content {
     box-sizing: border-box;

package/modal/cssm/components/content/mobile.module.css

@@ -15,11 +15,11 @@
 
     /* paddings */
 
-    /* closer */
-
     /* sticky */
 
     /* scroll */
+
+    /* mobile */
 }
 .content {
     composes: content from 'index.module.css';

package/modal/cssm/components/footer/desktop.module.css

@@ -26,11 +26,11 @@
     --modal-m-footer-paddings: var(--gap-xl) var(--gap-4xl) var(--gap-4xl);
     --modal-l-footer-paddings: var(--gap-xl) var(--gap-6xl) var(--gap-6xl);
 
-    /* closer */
-
     /* sticky */
 
     /* scroll */
+
+    /* mobile */
 }
 .footer {
     composes: footer from 'index.module.css';

package/modal/cssm/components/footer/index.module.css

@@ -6,7 +6,6 @@
     /* Hard */
 
     /* Up */
-    --shadow-s-up: 0 0 8px rgba(11, 31, 53, 0.04), 0 -4px 8px rgba(11, 31, 53, 0.08);
 
     /* Hard up */
 }
@@ -17,15 +16,15 @@
 
     /* paddings */
 
-    /* closer */
-
     /* sticky */
     --modal-footer-sticky-box-shadow: none;
     --modal-footer-sticky-background: var(--modal-header-background);
 
     /* scroll */
-    --modal-footer-highlight-box-shadow: var(--shadow-s-up);
+    --modal-footer-highlight-box-shadow: none;
     --modal-footer-highlight-background: var(--color-light-bg-primary);
+
+    /* mobile */
 }
 .footer {
     width: 100%;

package/modal/cssm/components/footer/layout.module.css

@@ -18,11 +18,11 @@
 
     /* paddings */
 
-    /* closer */
-
     /* sticky */
 
     /* scroll */
+
+    /* mobile */
 }
 .column {
     display: flex;

package/modal/cssm/components/footer/mobile.module.css

@@ -16,11 +16,11 @@
 
     /* paddings */
 
-    /* closer */
-
     /* sticky */
 
     /* scroll */
+
+    /* mobile */
 }
 .footer {
     composes: footer from 'index.module.css';

package/modal/cssm/components/header/Component.d.ts

@@ -5,23 +5,38 @@ type HeaderProps = {
      */
     children?: ReactNode;
     /**
-     * Наличие крестика
+     * Слот слева
      */
-    hasCloser?: boolean;
+    leftAddons?: ReactNode;
+    /**
+     * Компонент крестика
+     */
+    closer?: ReactNode;
     /**
      * Дополнительный класс
      */
     className?: string;
+    /**
+     * Дополнительный класс для аддонов
+     */
+    addonClassName?: string;
+    /**
+     * Дополнительный класс для контента
+     */
+    contentClassName?: string;
     /**
      * Заголовок шапки
      */
     title?: string;
+    /**
+     * Выравнивание заголовка
+     */
+    align?: 'left' | 'right' | 'center';
+    trim?: boolean;
     /**
      * Фиксирует шапку
      */
     sticky?: boolean;
 };
-declare const Header: FC<HeaderProps & {
-    styles: Record<string, string>;
-}>;
+declare const Header: FC<HeaderProps>;
 export { HeaderProps, Header };

package/modal/cssm/components/header/Component.desktop.d.ts

@@ -1,6 +1,6 @@
 import { FC } from 'react';
 import { HeaderProps } from "./Component";
-type HeaderDesktopProps = HeaderProps & {
+type HeaderDesktopProps = Omit<HeaderProps, 'closer'> & {
     /**
      * Размер
      */
@@ -9,6 +9,10 @@ type HeaderDesktopProps = HeaderProps & {
      * Флаг, что модальное окно открыто на весь экран
      */
     fullscreen?: boolean;
+    /**
+     * Наличие крестика
+     */
+    hasCloser?: boolean;
 };
 declare const HeaderDesktop: FC<HeaderDesktopProps>;
 export { HeaderDesktopProps, HeaderDesktop };

package/modal/cssm/components/header/Component.desktop.js

@@ -5,10 +5,12 @@ var React = require('react');
 var cn = require('classnames');
 require('../../../../base-modal/cssm');
 require('../../Context.js');
-require('../../../../button/cssm');
-require('../closer/index.module.css');
-require('../closer/Component.js');
+require('./index.module.css');
 var components_header_Component = require('./Component.js');
+require('../../../../icon-button/cssm');
+require('@alfalab/icons-glyph/CrossHeavyMIcon');
+require('../closer/index.module.css');
+var components_closer_Component = require('../closer/Component.js');
 var styles = require('./desktop.module.css');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -18,8 +20,12 @@ var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 var styles__default = /*#__PURE__*/_interopDefaultLegacy(styles);
 
 var HeaderDesktop = function (_a) {
-    var size = _a.size, className = _a.className, fullscreen = _a.fullscreen, restProps = tslib_es6.__rest(_a, ["size", "className", "fullscreen"]);
-    return (React__default['default'].createElement(components_header_Component.Header, tslib_es6.__assign({ className: cn__default['default'](className, size && styles__default['default'][size], fullscreen && styles__default['default'].fullscreen), styles: styles__default['default'] }, restProps)));
+    var _b;
+    var size = _a.size, className = _a.className, contentClassName = _a.contentClassName, fullscreen = _a.fullscreen, hasCloser = _a.hasCloser, sticky = _a.sticky, restProps = tslib_es6.__rest(_a, ["size", "className", "contentClassName", "fullscreen", "hasCloser", "sticky"]);
+    return (React__default['default'].createElement(components_header_Component.Header, tslib_es6.__assign({ className: cn__default['default'](className, styles__default['default'].header, size && styles__default['default'][size], (_b = {},
+            _b[styles__default['default'].fullscreen] = fullscreen,
+            _b[styles__default['default'].sticky] = sticky,
+            _b)), contentClassName: cn__default['default'](styles__default['default'].content, contentClassName), closer: hasCloser ? React__default['default'].createElement(components_closer_Component.Closer, null) : null, sticky: sticky }, restProps)));
 };
 
 exports.HeaderDesktop = HeaderDesktop;

package/modal/cssm/components/header/Component.js

@@ -1,35 +1,37 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('../../tslib.es6-ce870b46.js');
 var React = require('react');
 var cn = require('classnames');
 require('../../../../base-modal/cssm');
 var Context = require('../../Context.js');
-require('../../../../button/cssm');
-require('../closer/index.module.css');
-var components_closer_Component = require('../closer/Component.js');
+var styles = require('./index.module.css');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
+var styles__default = /*#__PURE__*/_interopDefaultLegacy(styles);
 
 var Header = function (_a) {
-    var _b;
-    var className = _a.className, children = _a.children, title = _a.title, _c = _a.hasCloser, hasCloser = _c === void 0 ? true : _c, sticky = _a.sticky, styles = _a.styles;
-    var _d = React.useContext(Context.ModalContext), headerHighlighted = _d.headerHighlighted, setHasHeader = _d.setHasHeader;
+    var _b, _c;
+    var className = _a.className, addonClassName = _a.addonClassName, contentClassName = _a.contentClassName, leftAddons = _a.leftAddons, children = _a.children, _d = _a.align, align = _d === void 0 ? 'left' : _d, _e = _a.trim, trim = _e === void 0 ? true : _e, title = _a.title, closer = _a.closer, sticky = _a.sticky;
+    var _f = React.useContext(Context.ModalContext), headerHighlighted = _f.headerHighlighted, setHasHeader = _f.setHasHeader;
     var hasContent = title || Boolean(children);
     React.useEffect(function () {
         setHasHeader(true);
     }, [setHasHeader]);
-    return (React__default['default'].createElement("div", { className: cn__default['default'](styles.header, className, (_b = {},
-            _b[styles.highlighted] = sticky && headerHighlighted,
-            _b[styles.sticky] = sticky,
+    return (React__default['default'].createElement("div", { className: cn__default['default'](styles__default['default'].header, className, (_b = {},
+            _b[styles__default['default'].highlighted] = hasContent && sticky && headerHighlighted,
+            _b[styles__default['default'].sticky] = sticky,
+            _b[styles__default['default'].hasContent] = hasContent,
             _b)) },
-        hasContent && (React__default['default'].createElement("div", { className: styles.content },
+        leftAddons && React__default['default'].createElement("div", { className: cn__default['default'](styles__default['default'].addon, addonClassName) }, leftAddons),
+        hasContent && (React__default['default'].createElement("div", { className: cn__default['default'](styles__default['default'].content, contentClassName, styles__default['default'][align], (_c = {},
+                _c[styles__default['default'].trim] = trim,
+                _c)) },
             children,
-            title && React__default['default'].createElement("div", { className: styles.title }, title))),
-        hasCloser && React__default['default'].createElement(components_closer_Component.Closer, null)));
+            title && React__default['default'].createElement("div", { className: styles__default['default'].title }, title))),
+        closer && React__default['default'].createElement("div", { className: cn__default['default'](styles__default['default'].addon, addonClassName) }, closer)));
 };
 
 exports.Header = Header;

package/modal/cssm/components/header/Component.mobile.d.ts

@@ -1,5 +1,10 @@
 import { FC } from 'react';
 import { HeaderProps } from "./Component";
-type HeaderMobileProps = HeaderProps;
+type HeaderMobileProps = Omit<HeaderProps, 'closer'> & {
+    /**
+     * Наличие крестика
+     */
+    hasCloser?: boolean;
+};
 declare const HeaderMobile: FC<HeaderMobileProps>;
 export { HeaderMobileProps, HeaderMobile };

package/modal/cssm/components/header/Component.mobile.js

@@ -2,20 +2,31 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var tslib_es6 = require('../../tslib.es6-ce870b46.js');
 var React = require('react');
-require('classnames');
+var cn = require('classnames');
 require('../../../../base-modal/cssm');
 require('../../Context.js');
-require('../../../../button/cssm');
-require('../closer/index.module.css');
-require('../closer/Component.js');
+require('./index.module.css');
 var components_header_Component = require('./Component.js');
+require('../../../../icon-button/cssm');
+require('@alfalab/icons-glyph/CrossHeavyMIcon');
+require('../closer/index.module.css');
+var components_closer_Component = require('../closer/Component.js');
+var CrossMIcon = require('@alfalab/icons-glyph/CrossMIcon');
 var styles = require('./mobile.module.css');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
+var CrossMIcon__default = /*#__PURE__*/_interopDefaultLegacy(CrossMIcon);
 var styles__default = /*#__PURE__*/_interopDefaultLegacy(styles);
 
-var HeaderMobile = function (props) { return React__default['default'].createElement(components_header_Component.Header, tslib_es6.__assign({ styles: styles__default['default'] }, props)); };
+var HeaderMobile = function (_a) {
+    var _b;
+    var className = _a.className, hasCloser = _a.hasCloser, sticky = _a.sticky, contentClassName = _a.contentClassName, restProps = tslib_es6.__rest(_a, ["className", "hasCloser", "sticky", "contentClassName"]);
+    return (React__default['default'].createElement(components_header_Component.Header, tslib_es6.__assign({ className: cn__default['default'](className, (_b = {},
+            _b[styles__default['default'].sticky] = sticky,
+            _b)), contentClassName: cn__default['default'](styles__default['default'].content, contentClassName), closer: hasCloser ? React__default['default'].createElement(components_closer_Component.Closer, { icon: CrossMIcon__default['default'], size: 'xs' }) : null, sticky: sticky }, restProps)));
+};
 
 exports.HeaderMobile = HeaderMobile;

package/modal/cssm/components/header/desktop.module.css

@@ -7,10 +7,16 @@
     /* Hard up */
 }
 :root {
+    --gap-xs: 8px;
+    --gap-m: 16px;
     --gap-3xl: 40px;
     --gap-4xl: 48px;
     --gap-6xl: 72px;
 }
+:root {
+    --font-family-styrene: 'Styrene UI', system-ui, -apple-system, 'Segoe UI', Roboto,
+        'Helvetica Neue', Helvetica, sans-serif;
+}
 :root {
     --border-radius-m: 8px;
 }
@@ -27,19 +33,26 @@
     --modal-m-header-paddings: 0 0 0 var(--gap-4xl);
     --modal-l-header-paddings: 0 0 0 var(--gap-6xl);
 
-    /* closer */
-
     /* sticky */
 
     /* scroll */
+
+    /* mobile */
 }
 .header {
-    composes: header from 'index.module.css';
-
     min-height: var(--modal-header-min-height);
     border-top-left-radius: var(--modal-border-radius);
     border-top-right-radius: var(--modal-border-radius);
 }
+.content {
+    font-size: 24px;
+    line-height: 32px;
+    font-weight: 500;
+    font-feature-settings: 'ss01';
+    font-family: var(--font-family-styrene);
+
+    margin: var(--gap-xs) var(--gap-m) var(--gap-xs) 0;
+}
 .s {
     padding: var(--modal-s-header-paddings);
 }
@@ -52,19 +65,8 @@
     padding: var(--modal-l-header-paddings);
 }
 .sticky {
-    composes: sticky from 'index.module.css';
-
     top: calc(var(--modal-vertical-padding) * -1);
 }
 .fullscreen {
     top: 0;
 }
-.highlighted {
-    composes: highlighted from 'index.module.css';
-}
-.content {
-    composes: content from 'index.module.css';
-}
-.title {
-    composes: title from 'index.module.css';
-}

package/modal/cssm/components/header/index.module.css

@@ -2,7 +2,6 @@
     --color-light-bg-primary: #fff;
 }
 :root {
-    --shadow-s: 0 0 8px rgba(11, 31, 53, 0.04), 0 4px 8px rgba(11, 31, 53, 0.08);
 
     /* Hard */
 
@@ -10,14 +9,6 @@
 
     /* Hard up */
 }
-:root {
-    --gap-xs: 8px;
-    --gap-m: 16px;
-}
-:root {
-    --font-family-styrene: 'Styrene UI', system-ui, -apple-system, 'Segoe UI', Roboto,
-        'Helvetica Neue', Helvetica, sans-serif;
-}
 :root {
     --modal-header-background: var(--color-light-bg-primary);
 
@@ -25,13 +16,13 @@
 
     /* paddings */
 
-    /* closer */
-
     /* sticky */
 
     /* scroll */
-    --modal-header-highlight-box-shadow: var(--shadow-s);
+    --modal-header-highlight-box-shadow: none;
     --modal-header-highlight-background: var(--color-light-bg-primary);
+
+    /* mobile */
 }
 .header {
     width: 100%;
@@ -40,24 +31,47 @@
     align-items: stretch;
     justify-content: flex-end;
     transition: box-shadow 0.2s ease, background 0.2s ease;
-    background: var(--modal-header-background);
 }
 .highlighted {
     background: var(--modal-header-highlight-background);
     box-shadow: var(--modal-header-highlight-box-shadow);
 }
 .sticky {
-    position: sticky;
+    position: sticky
 }
+.sticky.hasContent {
+        background: var(--modal-header-background);
+    }
 .content {
-    font-size: 24px;
-    line-height: 32px;
-    font-weight: 500;
-    font-feature-settings: 'ss01';
-    font-family: var(--font-family-styrene);
     flex-grow: 1;
-    margin: var(--gap-xs) var(--gap-m) var(--gap-xs) 0;
 }
 .title {
     word-break: break-word;
 }
+.addon {
+    min-width: 48px;
+    height: 48px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+.left {
+    justify-content: flex-start;
+    text-align: left;
+}
+.center {
+    justify-content: center;
+    text-align: center;
+}
+.right {
+    justify-content: flex-end;
+    text-align: right;
+}
+.trim {
+    overflow: hidden
+}
+.trim .title {
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+    }