@diplodoc/components 5.16.2 → 5.17.2

package/build/cjs/components/MobileControls/MobileControl/MobileControl.js

@@ -33,12 +33,13 @@ __export(MobileControl_exports, {
   default: () => MobileControl_default
 });
 module.exports = __toCommonJS(MobileControl_exports);
-var import_react = __toESM(require("react"));
+var import_react = require("react");
 var import_icons = require("@gravity-ui/icons");
 var import_uikit = require("@gravity-ui/uikit");
 var import_bem_cn_lite = __toESM(require("bem-cn-lite"));
 var import_MobileControlSheet = __toESM(require("../MobileControlSheet/MobileControlSheet"));
 var import_MobileControl = require("./MobileControl.css");
+var import_jsx_runtime = require("react/jsx-runtime");
 var b = (0, import_bem_cn_lite.default)("dc-mobile-control");
 var MobileControl = (0, import_react.memo)(
   ({
@@ -65,29 +66,37 @@ var MobileControl = (0, import_react.memo)(
     const onSheetClose = () => setSheetIsVisible(false);
     const onItemClick = onChangeValue ? (value, options) => onChangeValue(value, options) : () => {
     };
-    return /* @__PURE__ */ import_react.default.createElement("div", { key: name, className: b() }, /* @__PURE__ */ import_react.default.createElement(
-      import_MobileControlSheet.default,
-      {
-        title,
-        items: displayItems,
-        onItemClick,
-        isVisible: sheetIsVisible,
-        onClose: onSheetClose,
-        selectedItemIndex,
-        availableLangs
-      }
-    ), /* @__PURE__ */ import_react.default.createElement(
-      import_uikit.Button,
-      {
-        disabled,
-        view: "flat",
-        size: "s",
-        className: b("wrapper"),
-        onClick: onSheetOpen
-      },
-      /* @__PURE__ */ import_react.default.createElement("div", { className: b("label") }, /* @__PURE__ */ import_react.default.createElement(Icon, { width: 16, height: 16 }), buttonLabel != null ? buttonLabel : labelText),
-      !disabled && /* @__PURE__ */ import_react.default.createElement(import_uikit.Button.Icon, { className: b("arrow"), side: "right" }, /* @__PURE__ */ import_react.default.createElement(import_icons.ChevronDown, { width: 16, height: 16 }))
-    ));
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: b(), children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_MobileControlSheet.default,
+        {
+          title,
+          items: displayItems,
+          onItemClick,
+          isVisible: sheetIsVisible,
+          onClose: onSheetClose,
+          selectedItemIndex,
+          availableLangs
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        import_uikit.Button,
+        {
+          disabled,
+          view: "flat",
+          size: "s",
+          className: b("wrapper"),
+          onClick: onSheetOpen,
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: b("label"), children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, { width: 16, height: 16 }),
+              buttonLabel != null ? buttonLabel : labelText
+            ] }),
+            !disabled && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_uikit.Button.Icon, { className: b("arrow"), side: "right", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.ChevronDown, { width: 16, height: 16 }) })
+          ]
+        }
+      )
+    ] }, name);
   }
 );
 MobileControl.displayName = "MobileControl";

package/build/cjs/components/MobileControls/MobileControl/MobileControl.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../src/components/MobileControls/MobileControl/MobileControl.tsx"],
   "sourcesContent": ["import type {ReactNode, SVGProps} from 'react';\nimport type {AvailableLangs, LangOptions, ListItem} from '../../../models';\n\nimport React, {memo, useMemo, useState} from 'react';\nimport {ChevronDown} from '@gravity-ui/icons';\nimport {Button} from '@gravity-ui/uikit';\nimport block from 'bem-cn-lite';\n\nimport MobileControlSheet from '../MobileControlSheet/MobileControlSheet';\n\nimport './MobileControl.scss';\n\nconst b = block('dc-mobile-control');\n\nexport interface MobileControlProps {\n    name: string;\n    title: string;\n    buttonLabel?: string;\n    Icon: (props: SVGProps<SVGSVGElement>) => React.JSX.Element;\n    selectedItem: ReactNode;\n    selectedItemIndex: number;\n    displayItems: ListItem[];\n    availableLangs?: AvailableLangs;\n    onChangeValue?: (lang: string, options?: LangOptions) => void;\n}\n\nconst MobileControl = memo(\n    ({\n        name,\n        title,\n        buttonLabel,\n        Icon,\n        selectedItem,\n        selectedItemIndex,\n        displayItems,\n        availableLangs,\n        onChangeValue,\n    }: MobileControlProps) => {\n        const labelText = useMemo(\n            () =>\n                displayItems.find((displayItem) => selectedItem === displayItem.value)?.text ??\n                selectedItem,\n            [selectedItem, displayItems],\n        );\n\n        const disabled = !onChangeValue;\n\n        const [sheetIsVisible, setSheetIsVisible] = useState(false);\n\n        const onSheetOpen = () => setSheetIsVisible(true);\n        const onSheetClose = () => setSheetIsVisible(false);\n        const onItemClick = onChangeValue\n            ? (value: string, options?: LangOptions) => onChangeValue(value, options)\n            : () => {};\n\n        return (\n            <div key={name} className={b()}>\n                <MobileControlSheet\n                    title={title}\n                    items={displayItems}\n                    onItemClick={onItemClick}\n                    isVisible={sheetIsVisible}\n                    onClose={onSheetClose}\n                    selectedItemIndex={selectedItemIndex}\n                    availableLangs={availableLangs}\n                />\n                <Button\n                    disabled={disabled}\n                    view={'flat'}\n                    size={'s'}\n                    className={b('wrapper')}\n                    onClick={onSheetOpen}\n                >\n                    <div className={b('label')}>\n                        <Icon width={16} height={16} />\n                        {buttonLabel ?? labelText}\n                    </div>\n                    {!disabled && (\n                        <Button.Icon className={b('arrow')} side={'right'}>\n                            <ChevronDown width={16} height={16} />\n                        </Button.Icon>\n                    )}\n                </Button>\n            </div>\n        );\n    },\n);\n\nMobileControl.displayName = 'MobileControl';\n\nexport default MobileControl;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,mBAA6C;AAC7C,mBAA0B;AAC1B,mBAAqB;AACrB,yBAAkB;AAElB,gCAA+B;AAE/B,2BAAO;AAEP,IAAM,QAAI,mBAAAA,SAAM,mBAAmB;AAcnC,IAAM,oBAAgB;AAAA,EAClB,CAAC;AAAA,IACG;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ,MAA0B;AACtB,UAAM,gBAAY;AAAA,MACd,MAAG;AAvCf;AAwCgB,wCAAa,KAAK,CAAC,gBAAgB,iBAAiB,YAAY,KAAK,MAArE,mBAAwE,SAAxE,YACA;AAAA;AAAA,MACJ,CAAC,cAAc,YAAY;AAAA,IAC/B;AAEA,UAAM,WAAW,CAAC;AAElB,UAAM,CAAC,gBAAgB,iBAAiB,QAAI,uBAAS,KAAK;AAE1D,UAAM,cAAc,MAAM,kBAAkB,IAAI;AAChD,UAAM,eAAe,MAAM,kBAAkB,KAAK;AAClD,UAAM,cAAc,gBACd,CAAC,OAAe,YAA0B,cAAc,OAAO,OAAO,IACtE,MAAM;AAAA,IAAC;AAEb,WACI,6BAAAC,QAAA,cAAC,SAAI,KAAK,MAAM,WAAW,EAAE,KACzB,6BAAAA,QAAA;AAAA,MAAC,0BAAAC;AAAA,MAAA;AAAA,QACG;AAAA,QACA,OAAO;AAAA,QACP;AAAA,QACA,WAAW;AAAA,QACX,SAAS;AAAA,QACT;AAAA,QACA;AAAA;AAAA,IACJ,GACA,6BAAAD,QAAA;AAAA,MAAC;AAAA;AAAA,QACG;AAAA,QACA,MAAM;AAAA,QACN,MAAM;AAAA,QACN,WAAW,EAAE,SAAS;AAAA,QACtB,SAAS;AAAA;AAAA,MAET,6BAAAA,QAAA,cAAC,SAAI,WAAW,EAAE,OAAO,KACrB,6BAAAA,QAAA,cAAC,QAAK,OAAO,IAAI,QAAQ,IAAI,GAC5B,oCAAe,SACpB;AAAA,MACC,CAAC,YACE,6BAAAA,QAAA,cAAC,oBAAO,MAAP,EAAY,WAAW,EAAE,OAAO,GAAG,MAAM,WACtC,6BAAAA,QAAA,cAAC,4BAAY,OAAO,IAAI,QAAQ,IAAI,CACxC;AAAA,IAER,CACJ;AAAA,EAER;AACJ;AAEA,cAAc,cAAc;AAE5B,IAAO,wBAAQ;",
-  "names": ["block", "React", "MobileControlSheet"]
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,mBAA6C;AAC7C,mBAA0B;AAC1B,mBAAqB;AACrB,yBAAkB;AAElB,gCAA+B;AAE/B,2BAAO;AA+CS;AA7ChB,IAAM,QAAI,mBAAAA,SAAM,mBAAmB;AAcnC,IAAM,oBAAgB;AAAA,EAClB,CAAC;AAAA,IACG;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ,MAA0B;AACtB,UAAM,gBAAY;AAAA,MACd,MAAG;AAvCf;AAwCgB,wCAAa,KAAK,CAAC,gBAAgB,iBAAiB,YAAY,KAAK,MAArE,mBAAwE,SAAxE,YACA;AAAA;AAAA,MACJ,CAAC,cAAc,YAAY;AAAA,IAC/B;AAEA,UAAM,WAAW,CAAC;AAElB,UAAM,CAAC,gBAAgB,iBAAiB,QAAI,uBAAS,KAAK;AAE1D,UAAM,cAAc,MAAM,kBAAkB,IAAI;AAChD,UAAM,eAAe,MAAM,kBAAkB,KAAK;AAClD,UAAM,cAAc,gBACd,CAAC,OAAe,YAA0B,cAAc,OAAO,OAAO,IACtE,MAAM;AAAA,IAAC;AAEb,WACI,6CAAC,SAAe,WAAW,EAAE,GACzB;AAAA;AAAA,QAAC,0BAAAC;AAAA,QAAA;AAAA,UACG;AAAA,UACA,OAAO;AAAA,UACP;AAAA,UACA,WAAW;AAAA,UACX,SAAS;AAAA,UACT;AAAA,UACA;AAAA;AAAA,MACJ;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACG;AAAA,UACA,MAAM;AAAA,UACN,MAAM;AAAA,UACN,WAAW,EAAE,SAAS;AAAA,UACtB,SAAS;AAAA,UAET;AAAA,yDAAC,SAAI,WAAW,EAAE,OAAO,GACrB;AAAA,0DAAC,QAAK,OAAO,IAAI,QAAQ,IAAI;AAAA,cAC5B,oCAAe;AAAA,eACpB;AAAA,YACC,CAAC,YACE,4CAAC,oBAAO,MAAP,EAAY,WAAW,EAAE,OAAO,GAAG,MAAM,SACtC,sDAAC,4BAAY,OAAO,IAAI,QAAQ,IAAI,GACxC;AAAA;AAAA;AAAA,MAER;AAAA,SA1BM,IA2BV;AAAA,EAER;AACJ;AAEA,cAAc,cAAc;AAE5B,IAAO,wBAAQ;",
+  "names": ["block", "MobileControlSheet"]
 }

package/build/cjs/components/MobileControls/MobileControlSheet/MobileControlSheet.css.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../../../src/components/MobileControls/MobileControlSheet/MobileControlSheet.scss", "../../../../../src/components/MobileControls/MobileControlSheet/%3Cinput css EJcu_F%3E", "../../../../../src/styles/mixins.scss"],
+  "sources": ["../../../../../src/components/MobileControls/MobileControlSheet/MobileControlSheet.scss", "../../../../../src/components/MobileControls/MobileControlSheet/%3Cinput css g5PrQh%3E", "../../../../../src/styles/mixins.scss"],
   "sourcesContent": ["@use '../../../styles/mixins';\n@use '../../../styles/variables';\n\n.dc-mobile-control-sheet {\n    --g-sheet-content-padding: 0;\n\n    &__list {\n        padding: 4px 0;\n        padding-bottom: 34px;\n    }\n\n    &__list-item {\n        --g-focus-border-radius: 4px;\n\n        display: flex;\n        align-items: center;\n        justify-content: start;\n        gap: 8px;\n\n        width: 100%;\n        height: 100%;\n        padding: 12px 20px;\n\n        border-radius: var(--g-focus-border-radius);\n        border: 0;\n\n        color: inherit;\n        cursor: pointer;\n        background-color: inherit;\n\n        font-family: inherit;\n\n        @include mixins.text-size(body-2);\n\n        @include mixins.focusable(-2px);\n\n        // fixes a bug where the button text remains at the beginning (left)\n        // of the button on both dir='ltr' and dir='rtl'\n        // * justify-content: flex-start - doesn't work\n        [dir='rtl'] & {\n            justify-content: end;\n        }\n    }\n\n    &__list-item_tld {\n        flex-direction: column;\n        align-items: flex-start;\n        justify-content: center;\n        gap: 4px;\n    }\n\n    &__list-item_tld > span {\n        color: var(--g-color-text-hint);\n    }\n\n    &__list-item_disabled {\n        color: var(--g-color-text-secondary);\n        cursor: default;\n        opacity: 0.7;\n    }\n}\n", ".dc-mobile-control-sheet {\n  --g-sheet-content-padding: 0;\n}\n.dc-mobile-control-sheet__list {\n  padding: 4px 0;\n  padding-bottom: 34px;\n}\n.dc-mobile-control-sheet__list-item {\n  --g-focus-border-radius: 4px;\n  display: flex;\n  align-items: center;\n  justify-content: start;\n  gap: 8px;\n  width: 100%;\n  height: 100%;\n  padding: 12px 20px;\n  border-radius: var(--g-focus-border-radius);\n  border: 0;\n  color: inherit;\n  cursor: pointer;\n  background-color: inherit;\n  font-family: inherit;\n  font-size: var(--g-text-body-2-font-size);\n  line-height: var(--g-text-body-2-line-height);\n}\n.dc-mobile-control-sheet__list-item:focus {\n  outline: 2px solid var(--g-color-line-focus);\n  outline-offset: -2px;\n}\n.dc-mobile-control-sheet__list-item:focus:not(:focus-visible) {\n  outline: 0;\n}\n[dir=rtl] .dc-mobile-control-sheet__list-item {\n  justify-content: end;\n}\n.dc-mobile-control-sheet__list-item_tld {\n  flex-direction: column;\n  align-items: flex-start;\n  justify-content: center;\n  gap: 4px;\n}\n.dc-mobile-control-sheet__list-item_tld > span {\n  color: var(--g-color-text-hint);\n}\n.dc-mobile-control-sheet__list-item_disabled {\n  color: var(--g-color-text-secondary);\n  cursor: default;\n  opacity: 0.7;\n}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VSb290IjoiL2hvbWUvcnVubmVyL3dvcmsvY29tcG9uZW50cy9jb21wb25lbnRzL3NyYy9jb21wb25lbnRzL01vYmlsZUNvbnRyb2xzL01vYmlsZUNvbnRyb2xTaGVldCIsInNvdXJjZXMiOlsiTW9iaWxlQ29udHJvbFNoZWV0LnNjc3MiLCIuLi8uLi8uLi9zdHlsZXMvbWl4aW5zLnNjc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBR0E7RUFDSTs7QUFFQTtFQUNJO0VBQ0E7O0FBR0o7RUFDSTtFQUVBO0VBQ0E7RUFDQTtFQUNBO0VBRUE7RUFDQTtFQUNBO0VBRUE7RUFDQTtFQUVBO0VBQ0E7RUFDQTtFQUVBO0VDMUJKO0VBQ0E7O0FBNkJJO0VBQ0k7RUFDQSxnQkRGc0I7O0FDSTFCO0VBQ0k7O0FEQUo7RUFDSTs7QUFJUjtFQUNJO0VBQ0E7RUFDQTtFQUNBOztBQUdKO0VBQ0k7O0FBR0o7RUFDSTtFQUNBO0VBQ0EiLCJzb3VyY2VzQ29udGVudCI6WyJAdXNlICcuLi8uLi8uLi9zdHlsZXMvbWl4aW5zJztcbkB1c2UgJy4uLy4uLy4uL3N0eWxlcy92YXJpYWJsZXMnO1xuXG4uZGMtbW9iaWxlLWNvbnRyb2wtc2hlZXQge1xuICAgIC0tZy1zaGVldC1jb250ZW50LXBhZGRpbmc6IDA7XG5cbiAgICAmX19saXN0IHtcbiAgICAgICAgcGFkZGluZzogNHB4IDA7XG4gICAgICAgIHBhZGRpbmctYm90dG9tOiAzNHB4O1xuICAgIH1cblxuICAgICZfX2xpc3QtaXRlbSB7XG4gICAgICAgIC0tZy1mb2N1cy1ib3JkZXItcmFkaXVzOiA0cHg7XG5cbiAgICAgICAgZGlzcGxheTogZmxleDtcbiAgICAgICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICAgICAganVzdGlmeS1jb250ZW50OiBzdGFydDtcbiAgICAgICAgZ2FwOiA4cHg7XG5cbiAgICAgICAgd2lkdGg6IDEwMCU7XG4gICAgICAgIGhlaWdodDogMTAwJTtcbiAgICAgICAgcGFkZGluZzogMTJweCAyMHB4O1xuXG4gICAgICAgIGJvcmRlci1yYWRpdXM6IHZhcigtLWctZm9jdXMtYm9yZGVyLXJhZGl1cyk7XG4gICAgICAgIGJvcmRlcjogMDtcblxuICAgICAgICBjb2xvcjogaW5oZXJpdDtcbiAgICAgICAgY3Vyc29yOiBwb2ludGVyO1xuICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiBpbmhlcml0O1xuXG4gICAgICAgIGZvbnQtZmFtaWx5OiBpbmhlcml0O1xuXG4gICAgICAgIEBpbmNsdWRlIG1peGlucy50ZXh0LXNpemUoYm9keS0yKTtcblxuICAgICAgICBAaW5jbHVkZSBtaXhpbnMuZm9jdXNhYmxlKC0ycHgpO1xuXG4gICAgICAgIC8vIGZpeGVzIGEgYnVnIHdoZXJlIHRoZSBidXR0b24gdGV4dCByZW1haW5zIGF0IHRoZSBiZWdpbm5pbmcgKGxlZnQpXG4gICAgICAgIC8vIG9mIHRoZSBidXR0b24gb24gYm90aCBkaXI9J2x0cicgYW5kIGRpcj0ncnRsJ1xuICAgICAgICAvLyAqIGp1c3RpZnktY29udGVudDogZmxleC1zdGFydCAtIGRvZXNuJ3Qgd29ya1xuICAgICAgICBbZGlyPSdydGwnXSAmIHtcbiAgICAgICAgICAgIGp1c3RpZnktY29udGVudDogZW5kO1xuICAgICAgICB9XG4gICAgfVxuXG4gICAgJl9fbGlzdC1pdGVtX3RsZCB7XG4gICAgICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG4gICAgICAgIGFsaWduLWl0ZW1zOiBmbGV4LXN0YXJ0O1xuICAgICAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgICAgICAgZ2FwOiA0cHg7XG4gICAgfVxuXG4gICAgJl9fbGlzdC1pdGVtX3RsZCA+IHNwYW4ge1xuICAgICAgICBjb2xvcjogdmFyKC0tZy1jb2xvci10ZXh0LWhpbnQpO1xuICAgIH1cblxuICAgICZfX2xpc3QtaXRlbV9kaXNhYmxlZCB7XG4gICAgICAgIGNvbG9yOiB2YXIoLS1nLWNvbG9yLXRleHQtc2Vjb25kYXJ5KTtcbiAgICAgICAgY3Vyc29yOiBkZWZhdWx0O1xuICAgICAgICBvcGFjaXR5OiAwLjc7XG4gICAgfVxufVxuIiwiQHVzZSAnc2FzczptYXAnO1xuQHVzZSAndmFyaWFibGVzJztcblxuQG1peGluIHRleHQtc2l6ZSgkbmFtZSkge1xuICAgIGZvbnQtc2l6ZTogdmFyKC0tZy10ZXh0LSN7JG5hbWV9LWZvbnQtc2l6ZSk7XG4gICAgbGluZS1oZWlnaHQ6IHZhcigtLWctdGV4dC0jeyRuYW1lfS1saW5lLWhlaWdodCk7XG59XG5cbkBtaXhpbiByZXNldC1saXN0LXN0eWxlKCkge1xuICAgIG1hcmdpbjogMDtcbiAgICBwYWRkaW5nOiAwO1xuICAgIGxpc3Qtc3R5bGU6IG5vbmU7XG59XG5cbkBtaXhpbiBmaXhBbmNob3JQb3NpdGlvbigkb2Zmc2V0OiAwcHgpIHtcbiAgICBwYWRkaW5nLXRvcDogY2FsYyh2YXIoLS1kYy1oZWFkZXItaGVpZ2h0LCAje3ZhcmlhYmxlcy4kaGVhZGVySGVpZ2h0fSkpO1xuICAgIG1hcmdpbi10b3A6IGNhbGMoI3skb2Zmc2V0fSAtIHZhcigtLWRjLWhlYWRlci1oZWlnaHQsICN7dmFyaWFibGVzLiRoZWFkZXJIZWlnaHR9KSk7XG59XG5cbkBtaXhpbiByZXNldC1saW5rLXN0eWxlKCkge1xuICAgIGNvbG9yOiBpbmhlcml0O1xuICAgIHRleHQtZGVjb3JhdGlvbjogbm9uZTtcbn1cblxuQG1peGluIGlzbGFuZHMtZm9jdXMoKSB7XG4gICAgb3V0bGluZTogbm9uZTtcblxuICAgIC51dGlsaXR5Zm9jdXMgJjpmb2N1cyB7XG4gICAgICAgIG91dGxpbmU6IDJweCBzb2xpZCAjZmZkYjRkO1xuICAgIH1cbn1cblxuQG1peGluIGZvY3VzYWJsZSgkb2Zmc2V0OiAwLCAkbW9kZTogJ291dGxpbmUnKSB7XG4gICAgQGlmICRtb2RlID09ICdvdXRsaW5lJyB7XG4gICAgICAgICY6Zm9jdXMge1xuICAgICAgICAgICAgb3V0bGluZTogMnB4IHNvbGlkIHZhcigtLWctY29sb3ItbGluZS1mb2N1cyk7XG4gICAgICAgICAgICBvdXRsaW5lLW9mZnNldDogJG9mZnNldDtcbiAgICAgICAgfVxuICAgICAgICAmOmZvY3VzOm5vdCg6Zm9jdXMtdmlzaWJsZSkge1xuICAgICAgICAgICAgb3V0bGluZTogMDtcbiAgICAgICAgfVxuICAgIH1cblxuICAgIEBpZiAkbW9kZSA9PSAnYm94LXNoYWRvdycge1xuICAgICAgICAmOmZvY3VzIHtcbiAgICAgICAgICAgIGJveC1zaGFkb3c6IDAgMCAwIDJweCB2YXIoLS1nLWNvbG9yLWxpbmUtZm9jdXMpO1xuICAgICAgICAgICAgb3V0bGluZTogMDtcbiAgICAgICAgfVxuICAgICAgICAmOmZvY3VzOm5vdCg6Zm9jdXMtdmlzaWJsZSkge1xuICAgICAgICAgICAgYm94LXNoYWRvdzogbm9uZTtcbiAgICAgICAgfVxuICAgIH1cbn1cblxuQG1peGluIGxpbmsoKSB7XG4gICAgY29sb3I6IHZhcigtLWctY29sb3ItdGV4dC1saW5rKTtcbiAgICB0ZXh0LWRlY29yYXRpb246IG5vbmU7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIGJvcmRlci1yYWRpdXM6IHZhcigtLWctZm9jdXMtYm9yZGVyLXJhZGl1cyk7XG5cbiAgICBAaW5jbHVkZSBpc2xhbmRzLWZvY3VzKCk7XG5cbiAgICBAaW5jbHVkZSBmb2N1c2FibGUoMCwgJ2JveC1zaGFkb3cnKTtcblxuICAgICY6aG92ZXIsXG4gICAgJjphY3RpdmUge1xuICAgICAgICBjb2xvcjogdmFyKC0tZy1jb2xvci10ZXh0LWxpbmstaG92ZXIpO1xuICAgIH1cbn1cblxuQG1peGluIGhlYWRpbmcxKCkge1xuICAgIGZvbnQtd2VpZ2h0OiA1MDA7XG5cbiAgICBAaW5jbHVkZSB0ZXh0LXNpemUoZGlzcGxheS0zKTtcblxuICAgIEBtZWRpYSAobWF4LXdpZHRoOiBtYXAuZ2V0KHZhcmlhYmxlcy4kc2NyZWVuQnJlYWtwb2ludHMsICdtZCcpIC0gMSkge1xuICAgICAgICBAaW5jbHVkZSB0ZXh0LXNpemUoZGlzcGxheS0yKTtcbiAgICB9XG59XG5cbkBtaXhpbiBoZWFkaW5nMigpIHtcbiAgICBmb250LXdlaWdodDogNTAwO1xuXG4gICAgQGluY2x1ZGUgdGV4dC1zaXplKGRpc3BsYXktMSk7XG59XG5cbkBtaXhpbiBoZWFkaW5nMygpIHtcbiAgICBmb250LXdlaWdodDogNTAwO1xuXG4gICAgQGluY2x1ZGUgdGV4dC1zaXplKGhlYWRlci0yKTtcbn1cblxuQG1peGluIGhlYWRpbmc0KCkge1xuICAgIGZvbnQtd2VpZ2h0OiA1MDA7XG5cbiAgICBAaW5jbHVkZSB0ZXh0LXNpemUoaGVhZGVyLTEpO1xufVxuXG5AbWl4aW4gaGVhZGluZzUoKSB7XG4gICAgZm9udC13ZWlnaHQ6IDUwMDtcblxuICAgIEBpbmNsdWRlIHRleHQtc2l6ZShib2R5LTMpO1xufVxuXG5AbWl4aW4gaGVhZGluZzYoKSB7XG4gICAgZm9udC13ZWlnaHQ6IDQwMDtcblxuICAgIEBpbmNsdWRlIHRleHQtc2l6ZShib2R5LTMpO1xufVxuXG5AbWl4aW4gY29udHJpYnV0b3JzLXRleHQoKSB7XG4gICAgZm9udC1zaXplOiAxM3B4O1xuICAgIGZvbnQtd2VpZ2h0OiA0MDA7XG4gICAgbWFyZ2luLXJpZ2h0OiA1cHg7XG4gICAgYWxpZ24tc2VsZjogY2VudGVyO1xufVxuXG5AbWl4aW4gdGV4dC1ib2R5LTEoKSB7XG4gICAgZm9udC1zaXplOiB2YXIoLS1nLXRleHQtYm9keS0xLWZvbnQtc2l6ZSk7XG4gICAgbGluZS1oZWlnaHQ6IHZhcigtLWctdGV4dC1ib2R5LTEtbGluZS1oZWlnaHQpO1xuICAgIGZvbnQtd2VpZ2h0OiB2YXIoLS1nLXRleHQtYm9keS1mb250LXdlaWdodCk7XG59XG5cbkBtaXhpbiBkZXNrdG9wLW9ubHkoKSB7XG4gICAgQG1lZGlhIChtYXgtd2lkdGg6IG1hcC5nZXQodmFyaWFibGVzLiRzY3JlZW5CcmVha3BvaW50cywgJ21kJykgLSAxKSB7XG4gICAgICAgIGRpc3BsYXk6IG5vbmU7XG4gICAgfVxufVxuXG5AbWl4aW4gZGVza3RvcC10YWJsZXQtb25seSgpIHtcbiAgICBAbWVkaWEgKG1heC13aWR0aDogbWFwLmdldCh2YXJpYWJsZXMuJHNjcmVlbkJyZWFrcG9pbnRzLCAnc20nKSAtIDEpIHtcbiAgICAgICAgZGlzcGxheTogbm9uZTtcbiAgICB9XG59XG5cbkBtaXhpbiBtb2JpbGUtdGFibGV0LW9ubHkoKSB7XG4gICAgQG1lZGlhIChtaW4td2lkdGg6IG1hcC5nZXQodmFyaWFibGVzLiRzY3JlZW5CcmVha3BvaW50cywgJ21kJykpIHtcbiAgICAgICAgZGlzcGxheTogbm9uZTtcbiAgICB9XG59XG5cbkBtaXhpbiBtb2JpbGUtb25seSgpIHtcbiAgICBAbWVkaWEgKG1pbi13aWR0aDogbWFwLmdldCh2YXJpYWJsZXMuJHNjcmVlbkJyZWFrcG9pbnRzLCAnc20nKSkge1xuICAgICAgICBkaXNwbGF5OiBub25lO1xuICAgIH1cbn1cblxuQG1peGluIGdyYXZpdHktdWktdGV4dC1zaXplcygkZGVsdGEpIHtcbiAgICAtLWctdGV4dC1ib2R5LTEtZm9udC1zaXplOiAjezEzcHggKyAkZGVsdGF9O1xuICAgIC0tZy10ZXh0LWJvZHktMS1saW5lLWhlaWdodDogI3sxOHB4ICsgJGRlbHRhfTtcbiAgICAtLWctdGV4dC1ib2R5LTItZm9udC1zaXplOiAjezE1cHggKyAkZGVsdGF9O1xuICAgIC0tZy10ZXh0LWJvZHktMi1saW5lLWhlaWdodDogI3syMHB4ICsgJGRlbHRhfTtcbiAgICAtLWctdGV4dC1ib2R5LTMtZm9udC1zaXplOiAjezE3cHggKyAkZGVsdGF9O1xuICAgIC0tZy10ZXh0LWJvZHktMy1saW5lLWhlaWdodDogI3syNHB4ICsgJGRlbHRhfTtcbiAgICAtLWctdGV4dC1ib2R5LXNob3J0LWZvbnQtc2l6ZTogI3sxM3B4ICsgJGRlbHRhfTtcbiAgICAtLWctdGV4dC1jYXB0aW9uLTEtZm9udC1zaXplOiAjezlweCArICRkZWx0YX07XG4gICAgLS1nLXRleHQtY2FwdGlvbi0yLWZvbnQtc2l6ZTogI3sxMXB4ICsgJGRlbHRhfTtcbiAgICAtLWctdGV4dC1oZWFkZXItMS1mb250LXNpemU6ICN7MjBweCArICRkZWx0YX07XG4gICAgLS1nLXRleHQtaGVhZGVyLTItZm9udC1zaXplOiAjezI0cHggKyAkZGVsdGF9O1xuICAgIC0tZy10ZXh0LXN1YmhlYWRlci0xLWZvbnQtc2l6ZTogI3sxM3B4ICsgJGRlbHRhfTtcbiAgICAtLWctdGV4dC1zdWJoZWFkZXItMi1mb250LXNpemU6ICN7MTVweCArICRkZWx0YX07XG4gICAgLS1nLXRleHQtc3ViaGVhZGVyLTMtZm9udC1zaXplOiAjezE3cHggKyAkZGVsdGF9O1xuICAgIC0tZy10ZXh0LWRpc3BsYXktMS1mb250LXNpemU6ICN7MjhweCArICRkZWx0YX07XG4gICAgLS1nLXRleHQtZGlzcGxheS0yLWZvbnQtc2l6ZTogI3szMnB4ICsgJGRlbHRhfTtcbiAgICAtLWctdGV4dC1kaXNwbGF5LTMtZm9udC1zaXplOiAjezQwcHggKyAkZGVsdGF9O1xuICAgIC0tZy10ZXh0LWRpc3BsYXktNC1mb250LXNpemU6ICN7NDhweCArICRkZWx0YX07XG4gICAgLS1nLXRleHQtY29kZS0xLWZvbnQtc2l6ZTogI3sxMnB4ICsgJGRlbHRhfTtcbiAgICAtLWctdGV4dC1jb2RlLTItZm9udC1zaXplOiAjezE0cHggKyAkZGVsdGF9O1xuICAgIC0tZy10ZXh0LWNvZGUtMy1mb250LXNpemU6ICN7MTZweCArICRkZWx0YX07XG4gICAgLS1nLXRleHQtY29kZS1pbmxpbmUtMS1mb250LXNpemU6ICN7MTJweCArICRkZWx0YX07XG4gICAgLS1nLXRleHQtY29kZS1pbmxpbmUtMi1mb250LXNpemU6ICN7MTRweCArICRkZWx0YX07XG4gICAgLS1nLXRleHQtY29kZS1pbmxpbmUtMy1mb250LXNpemU6ICN7MTZweCArICRkZWx0YX07XG5cbiAgICAtLXlmbS1mb250LXNpemU6IHZhcigtLWctdGV4dC1ib2R5LTItZm9udC1zaXplKTtcbiAgICAtLXlmbS1mb250LWxpbmUtaGVpZ2h0OiB2YXIoLS1nLXRleHQtYm9keS0yLWxpbmUtaGVpZ2h0KTtcbiAgICAtLXlmbS1mb250LXNpemUtaDI6IHZhcigtLWctdGV4dC1oZWFkZXItMi1mb250LXNpemUpO1xuICAgIC0teWZtLWZvbnQtc2l6ZS1oMzogdmFyKC0tZy10ZXh0LWhlYWRlci0xLWZvbnQtc2l6ZSk7XG4gICAgLS15Zm0tZm9udC1zaXplLWg0OiB2YXIoLS1nLXRleHQtc3ViaGVhZGVyLTMtZm9udC1zaXplKTtcbiAgICAtLXlmbS1mb250LXNpemUtaDU6IHZhcigtLWctdGV4dC1zdWJoZWFkZXItMi1mb250LXNpemUpO1xuICAgIC0teWZtLWZvbnQtc2l6ZS1oNjogdmFyKC0tZy10ZXh0LXN1YmhlYWRlci0xLWZvbnQtc2l6ZSk7XG59XG4iXX0= */", "@use 'sass:map';\n@use 'variables';\n\n@mixin text-size($name) {\n    font-size: var(--g-text-#{$name}-font-size);\n    line-height: var(--g-text-#{$name}-line-height);\n}\n\n@mixin reset-list-style() {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n}\n\n@mixin fixAnchorPosition($offset: 0px) {\n    padding-top: calc(var(--dc-header-height, #{variables.$headerHeight}));\n    margin-top: calc(#{$offset} - var(--dc-header-height, #{variables.$headerHeight}));\n}\n\n@mixin reset-link-style() {\n    color: inherit;\n    text-decoration: none;\n}\n\n@mixin islands-focus() {\n    outline: none;\n\n    .utilityfocus &:focus {\n        outline: 2px solid #ffdb4d;\n    }\n}\n\n@mixin focusable($offset: 0, $mode: 'outline') {\n    @if $mode == 'outline' {\n        &:focus {\n            outline: 2px solid var(--g-color-line-focus);\n            outline-offset: $offset;\n        }\n        &:focus:not(:focus-visible) {\n            outline: 0;\n        }\n    }\n\n    @if $mode == 'box-shadow' {\n        &:focus {\n            box-shadow: 0 0 0 2px var(--g-color-line-focus);\n            outline: 0;\n        }\n        &:focus:not(:focus-visible) {\n            box-shadow: none;\n        }\n    }\n}\n\n@mixin link() {\n    color: var(--g-color-text-link);\n    text-decoration: none;\n    cursor: pointer;\n    border-radius: var(--g-focus-border-radius);\n\n    @include islands-focus();\n\n    @include focusable(0, 'box-shadow');\n\n    &:hover,\n    &:active {\n        color: var(--g-color-text-link-hover);\n    }\n}\n\n@mixin heading1() {\n    font-weight: 500;\n\n    @include text-size(display-3);\n\n    @media (max-width: map.get(variables.$screenBreakpoints, 'md') - 1) {\n        @include text-size(display-2);\n    }\n}\n\n@mixin heading2() {\n    font-weight: 500;\n\n    @include text-size(display-1);\n}\n\n@mixin heading3() {\n    font-weight: 500;\n\n    @include text-size(header-2);\n}\n\n@mixin heading4() {\n    font-weight: 500;\n\n    @include text-size(header-1);\n}\n\n@mixin heading5() {\n    font-weight: 500;\n\n    @include text-size(body-3);\n}\n\n@mixin heading6() {\n    font-weight: 400;\n\n    @include text-size(body-3);\n}\n\n@mixin contributors-text() {\n    font-size: 13px;\n    font-weight: 400;\n    margin-right: 5px;\n    align-self: center;\n}\n\n@mixin text-body-1() {\n    font-size: var(--g-text-body-1-font-size);\n    line-height: var(--g-text-body-1-line-height);\n    font-weight: var(--g-text-body-font-weight);\n}\n\n@mixin desktop-only() {\n    @media (max-width: map.get(variables.$screenBreakpoints, 'md') - 1) {\n        display: none;\n    }\n}\n\n@mixin desktop-tablet-only() {\n    @media (max-width: map.get(variables.$screenBreakpoints, 'sm') - 1) {\n        display: none;\n    }\n}\n\n@mixin mobile-tablet-only() {\n    @media (min-width: map.get(variables.$screenBreakpoints, 'md')) {\n        display: none;\n    }\n}\n\n@mixin mobile-only() {\n    @media (min-width: map.get(variables.$screenBreakpoints, 'sm')) {\n        display: none;\n    }\n}\n\n@mixin gravity-ui-text-sizes($delta) {\n    --g-text-body-1-font-size: #{13px + $delta};\n    --g-text-body-1-line-height: #{18px + $delta};\n    --g-text-body-2-font-size: #{15px + $delta};\n    --g-text-body-2-line-height: #{20px + $delta};\n    --g-text-body-3-font-size: #{17px + $delta};\n    --g-text-body-3-line-height: #{24px + $delta};\n    --g-text-body-short-font-size: #{13px + $delta};\n    --g-text-caption-1-font-size: #{9px + $delta};\n    --g-text-caption-2-font-size: #{11px + $delta};\n    --g-text-header-1-font-size: #{20px + $delta};\n    --g-text-header-2-font-size: #{24px + $delta};\n    --g-text-subheader-1-font-size: #{13px + $delta};\n    --g-text-subheader-2-font-size: #{15px + $delta};\n    --g-text-subheader-3-font-size: #{17px + $delta};\n    --g-text-display-1-font-size: #{28px + $delta};\n    --g-text-display-2-font-size: #{32px + $delta};\n    --g-text-display-3-font-size: #{40px + $delta};\n    --g-text-display-4-font-size: #{48px + $delta};\n    --g-text-code-1-font-size: #{12px + $delta};\n    --g-text-code-2-font-size: #{14px + $delta};\n    --g-text-code-3-font-size: #{16px + $delta};\n    --g-text-code-inline-1-font-size: #{12px + $delta};\n    --g-text-code-inline-2-font-size: #{14px + $delta};\n    --g-text-code-inline-3-font-size: #{16px + $delta};\n\n    --yfm-font-size: var(--g-text-body-2-font-size);\n    --yfm-font-line-height: var(--g-text-body-2-line-height);\n    --yfm-font-size-h2: var(--g-text-header-2-font-size);\n    --yfm-font-size-h3: var(--g-text-header-1-font-size);\n    --yfm-font-size-h4: var(--g-text-subheader-3-font-size);\n    --yfm-font-size-h5: var(--g-text-subheader-2-font-size);\n    --yfm-font-size-h6: var(--g-text-subheader-1-font-size);\n}\n"],
   "mappings": ";AAGA,CAAA;AACI,6BAAA;ACFJ;ADII,CAAA;AACI,WAAA,IAAA;AACA,kBAAA;ACFR;ADKI,CAAA;AACI,2BAAA;AAEA,WAAA;AACA,eAAA;AACA,mBAAA;AACA,OAAA;AAEA,SAAA;AACA,UAAA;AACA,WAAA,KAAA;AAEA,iBAAA;AAAA,iBAAA,IAAA;AACA,UAAA;AAEA,SAAA;AACA,UAAA;AACA,oBAAA;AAEA,eAAA;AE1BJ,aAAA,IAAA;AACA,eAAA,IAAA;ADmBJ;ACUQ,CFvBJ,kCEuBI;AACI,WAAA,IAAA,MAAA,IAAA;AACA,kBAAA;ADRZ;ACUQ,CF3BJ,kCE2BI,MAAA,KAAA;AACI,WAAA;ADRZ;ADQQ,CAAA,SAAA,CA5BJ;AA6BQ,mBAAA;ACNZ;ADUI,CAAA;AACI,kBAAA;AACA,eAAA;AACA,mBAAA;AACA,OAAA;ACRR;ADWI,CAPA,uCAOA,EAAA;AACI,SAAA,IAAA;ACTR;ADYI,CAAA;AACI,SAAA,IAAA;AACA,UAAA;AACA,WAAA;ACVR;",
   "names": []

package/build/cjs/components/MobileControls/MobileControlSheet/MobileControlSheet.d.ts

@@ -1,5 +1,4 @@
 import type { AvailableLangs, LangOptions, ListItem } from '../../../models';
-import React from 'react';
 import './MobileControlSheet.scss';
 export interface MobileControlSheetProps {
     title: string;
@@ -10,5 +9,5 @@ export interface MobileControlSheetProps {
     selectedItemIndex: number;
     availableLangs?: AvailableLangs;
 }
-declare const MobileControlSheet: React.MemoExoticComponent<({ title, items, onItemClick, isVisible, onClose, selectedItemIndex, availableLangs, }: MobileControlSheetProps) => React.JSX.Element>;
+declare const MobileControlSheet: import("react").MemoExoticComponent<({ title, items, onItemClick, isVisible, onClose, selectedItemIndex, availableLangs, }: MobileControlSheetProps) => import("react").JSX.Element>;
 export default MobileControlSheet;

package/build/cjs/components/MobileControls/MobileControlSheet/MobileControlSheet.js

@@ -33,11 +33,12 @@ __export(MobileControlSheet_exports, {
   default: () => MobileControlSheet_default
 });
 module.exports = __toCommonJS(MobileControlSheet_exports);
-var import_react = __toESM(require("react"));
+var import_react = require("react");
 var import_uikit = require("@gravity-ui/uikit");
 var import_bem_cn_lite = __toESM(require("bem-cn-lite"));
 var import_utils = require("../../../utils");
 var import_MobileControlSheet = require("./MobileControlSheet.css");
+var import_jsx_runtime = require("react/jsx-runtime");
 var LIST_ITEM_HEIGHT = 44;
 var b = (0, import_bem_cn_lite.default)("dc-mobile-control-sheet");
 var MobileControlSheet = (0, import_react.memo)(
@@ -57,19 +58,21 @@ var MobileControlSheet = (0, import_react.memo)(
           (availableLangs == null ? void 0 : availableLangs.length) && !availableLangs.includes(item.value)
         ) && !href;
         const country = item.country;
-        return /* @__PURE__ */ import_react.default.createElement(
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
           "button",
           {
             className: b("list-item", { disabled, tld: Boolean(tld) }),
-            disabled
-          },
-          item.text,
-          tld && country && /* @__PURE__ */ import_react.default.createElement("span", null, country)
+            disabled,
+            children: [
+              item.text,
+              tld && country && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: country })
+            ]
+          }
         );
       },
       [availableLangs]
     );
-    return /* @__PURE__ */ import_react.default.createElement(import_uikit.Sheet, { title, className: b(), visible: isVisible, onClose }, /* @__PURE__ */ import_react.default.createElement(
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_uikit.Sheet, { title, className: b(), visible: isVisible, onClose, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       import_uikit.List,
       {
         role: "list",
@@ -82,7 +85,7 @@ var MobileControlSheet = (0, import_react.memo)(
         renderItem,
         selectedItemIndex
       }
-    ));
+    ) });
   }
 );
 MobileControlSheet.displayName = "MobileControlSheet";

package/build/cjs/components/MobileControls/MobileControlSheet/MobileControlSheet.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/MobileControls/MobileControlSheet/MobileControlSheet.tsx"],
-  "sourcesContent": ["import type {AvailableLangs, Lang, LangOptions, ListItem} from '../../../models';\n\nimport React, {memo, useCallback} from 'react';\nimport {List, Sheet} from '@gravity-ui/uikit';\nimport block from 'bem-cn-lite';\n\nimport {getItemHeight, getItemsHeight} from '../../../utils';\n\nimport './MobileControlSheet.scss';\n\nconst LIST_ITEM_HEIGHT = 44;\n\nconst b = block('dc-mobile-control-sheet');\n\nexport interface MobileControlSheetProps {\n    title: string;\n    items: ListItem[];\n    onItemClick: (value: string, options?: LangOptions) => void;\n    isVisible: boolean;\n    onClose: () => void;\n    selectedItemIndex: number;\n    availableLangs?: AvailableLangs;\n}\n\nconst MobileControlSheet = memo(\n    ({\n        title,\n        items,\n        onItemClick,\n        isVisible,\n        onClose,\n        selectedItemIndex,\n        availableLangs,\n    }: MobileControlSheetProps) => {\n        const renderItem = useCallback(\n            (item: ListItem) => {\n                const {tld, href} = item.options || {};\n\n                const disabled =\n                    Boolean(\n                        availableLangs?.length && !availableLangs.includes(item.value as Lang),\n                    ) && !href;\n\n                const country = item.country;\n\n                return (\n                    <button\n                        className={b('list-item', {disabled, tld: Boolean(tld)})}\n                        disabled={disabled}\n                    >\n                        {item.text}\n                        {tld && country && <span>{country}</span>}\n                    </button>\n                );\n            },\n            [availableLangs],\n        );\n\n        return (\n            <Sheet title={title} className={b()} visible={isVisible} onClose={onClose}>\n                <List\n                    role={'list'}\n                    className={b('list')}\n                    filterable={false}\n                    items={items}\n                    onItemClick={(item: ListItem) => onItemClick(item.value, item.options)}\n                    itemHeight={(items) => getItemHeight(LIST_ITEM_HEIGHT, items)}\n                    itemsHeight={(items) => getItemsHeight(LIST_ITEM_HEIGHT, items)}\n                    renderItem={renderItem}\n                    selectedItemIndex={selectedItemIndex}\n                />\n            </Sheet>\n        );\n    },\n);\n\nMobileControlSheet.displayName = 'MobileControlSheet';\n\nexport default MobileControlSheet;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAAuC;AACvC,mBAA0B;AAC1B,yBAAkB;AAElB,mBAA4C;AAE5C,gCAAO;AAEP,IAAM,mBAAmB;AAEzB,IAAM,QAAI,mBAAAA,SAAM,yBAAyB;AAYzC,IAAM,yBAAqB;AAAA,EACvB,CAAC;AAAA,IACG;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ,MAA+B;AAC3B,UAAM,iBAAa;AAAA,MACf,CAAC,SAAmB;AAChB,cAAM,EAAC,KAAK,KAAI,IAAI,KAAK,WAAW,CAAC;AAErC,cAAM,WACF;AAAA,WACI,iDAAgB,WAAU,CAAC,eAAe,SAAS,KAAK,KAAa;AAAA,QACzE,KAAK,CAAC;AAEV,cAAM,UAAU,KAAK;AAErB,eACI,6BAAAC,QAAA;AAAA,UAAC;AAAA;AAAA,YACG,WAAW,EAAE,aAAa,EAAC,UAAU,KAAK,QAAQ,GAAG,EAAC,CAAC;AAAA,YACvD;AAAA;AAAA,UAEC,KAAK;AAAA,UACL,OAAO,WAAW,6BAAAA,QAAA,cAAC,cAAM,OAAQ;AAAA,QACtC;AAAA,MAER;AAAA,MACA,CAAC,cAAc;AAAA,IACnB;AAEA,WACI,6BAAAA,QAAA,cAAC,sBAAM,OAAc,WAAW,EAAE,GAAG,SAAS,WAAW,WACrD,6BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACG,MAAM;AAAA,QACN,WAAW,EAAE,MAAM;AAAA,QACnB,YAAY;AAAA,QACZ;AAAA,QACA,aAAa,CAAC,SAAmB,YAAY,KAAK,OAAO,KAAK,OAAO;AAAA,QACrE,YAAY,CAACC,eAAU,4BAAc,kBAAkBA,MAAK;AAAA,QAC5D,aAAa,CAACA,eAAU,6BAAe,kBAAkBA,MAAK;AAAA,QAC9D;AAAA,QACA;AAAA;AAAA,IACJ,CACJ;AAAA,EAER;AACJ;AAEA,mBAAmB,cAAc;AAEjC,IAAO,6BAAQ;",
-  "names": ["block", "React", "items"]
+  "sourcesContent": ["import type {AvailableLangs, Lang, LangOptions, ListItem} from '../../../models';\n\nimport {memo, useCallback} from 'react';\nimport {List, Sheet} from '@gravity-ui/uikit';\nimport block from 'bem-cn-lite';\n\nimport {getItemHeight, getItemsHeight} from '../../../utils';\n\nimport './MobileControlSheet.scss';\n\nconst LIST_ITEM_HEIGHT = 44;\n\nconst b = block('dc-mobile-control-sheet');\n\nexport interface MobileControlSheetProps {\n    title: string;\n    items: ListItem[];\n    onItemClick: (value: string, options?: LangOptions) => void;\n    isVisible: boolean;\n    onClose: () => void;\n    selectedItemIndex: number;\n    availableLangs?: AvailableLangs;\n}\n\nconst MobileControlSheet = memo(\n    ({\n        title,\n        items,\n        onItemClick,\n        isVisible,\n        onClose,\n        selectedItemIndex,\n        availableLangs,\n    }: MobileControlSheetProps) => {\n        const renderItem = useCallback(\n            (item: ListItem) => {\n                const {tld, href} = item.options || {};\n\n                const disabled =\n                    Boolean(\n                        availableLangs?.length && !availableLangs.includes(item.value as Lang),\n                    ) && !href;\n\n                const country = item.country;\n\n                return (\n                    <button\n                        className={b('list-item', {disabled, tld: Boolean(tld)})}\n                        disabled={disabled}\n                    >\n                        {item.text}\n                        {tld && country && <span>{country}</span>}\n                    </button>\n                );\n            },\n            [availableLangs],\n        );\n\n        return (\n            <Sheet title={title} className={b()} visible={isVisible} onClose={onClose}>\n                <List\n                    role={'list'}\n                    className={b('list')}\n                    filterable={false}\n                    items={items}\n                    onItemClick={(item: ListItem) => onItemClick(item.value, item.options)}\n                    itemHeight={(items) => getItemHeight(LIST_ITEM_HEIGHT, items)}\n                    itemsHeight={(items) => getItemsHeight(LIST_ITEM_HEIGHT, items)}\n                    renderItem={renderItem}\n                    selectedItemIndex={selectedItemIndex}\n                />\n            </Sheet>\n        );\n    },\n);\n\nMobileControlSheet.displayName = 'MobileControlSheet';\n\nexport default MobileControlSheet;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAAgC;AAChC,mBAA0B;AAC1B,yBAAkB;AAElB,mBAA4C;AAE5C,gCAAO;AAsCa;AApCpB,IAAM,mBAAmB;AAEzB,IAAM,QAAI,mBAAAA,SAAM,yBAAyB;AAYzC,IAAM,yBAAqB;AAAA,EACvB,CAAC;AAAA,IACG;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ,MAA+B;AAC3B,UAAM,iBAAa;AAAA,MACf,CAAC,SAAmB;AAChB,cAAM,EAAC,KAAK,KAAI,IAAI,KAAK,WAAW,CAAC;AAErC,cAAM,WACF;AAAA,WACI,iDAAgB,WAAU,CAAC,eAAe,SAAS,KAAK,KAAa;AAAA,QACzE,KAAK,CAAC;AAEV,cAAM,UAAU,KAAK;AAErB,eACI;AAAA,UAAC;AAAA;AAAA,YACG,WAAW,EAAE,aAAa,EAAC,UAAU,KAAK,QAAQ,GAAG,EAAC,CAAC;AAAA,YACvD;AAAA,YAEC;AAAA,mBAAK;AAAA,cACL,OAAO,WAAW,4CAAC,UAAM,mBAAQ;AAAA;AAAA;AAAA,QACtC;AAAA,MAER;AAAA,MACA,CAAC,cAAc;AAAA,IACnB;AAEA,WACI,4CAAC,sBAAM,OAAc,WAAW,EAAE,GAAG,SAAS,WAAW,SACrD;AAAA,MAAC;AAAA;AAAA,QACG,MAAM;AAAA,QACN,WAAW,EAAE,MAAM;AAAA,QACnB,YAAY;AAAA,QACZ;AAAA,QACA,aAAa,CAAC,SAAmB,YAAY,KAAK,OAAO,KAAK,OAAO;AAAA,QACrE,YAAY,CAACC,eAAU,4BAAc,kBAAkBA,MAAK;AAAA,QAC5D,aAAa,CAACA,eAAU,6BAAe,kBAAkBA,MAAK;AAAA,QAC9D;AAAA,QACA;AAAA;AAAA,IACJ,GACJ;AAAA,EAER;AACJ;AAEA,mBAAmB,cAAc;AAEjC,IAAO,6BAAQ;",
+  "names": ["block", "items"]
 }

package/build/cjs/components/MobileControls/MobileControls.css.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../../src/components/MobileControls/MobileControls.scss", "../../../../src/components/MobileControls/%3Cinput css aLZGAq%3E"],
+  "sources": ["../../../../src/components/MobileControls/MobileControls.scss", "../../../../src/components/MobileControls/%3Cinput css GCehoG%3E"],
   "sourcesContent": ["@use 'sass:map';\n@use '../../styles/variables.scss';\n@use '../../styles/mixins.scss';\n\n.dc-mobile-controls {\n    $padding-inline: 16px;\n\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--g-spacing-2, 8px);\n\n    height: #{variables.$mobileControlsHeight};\n\n    width: calc(100% - 2 * #{$padding-inline});\n\n    box-sizing: content-box;\n    padding-top: #{variables.$mobileControlsTopPadding};\n    padding-bottom: #{variables.$mobileControlsBottomPadding};\n    padding-inline: $padding-inline;\n\n    background-color: var(--g-color-base-background);\n\n    border-top: 1px solid var(--g-color-line-generic);\n\n    &:has(.dc-mobile-control:only-child) {\n        justify-content: flex-end;\n    }\n\n    @media (min-width: map.get(variables.$screenBreakpoints, 'md')) {\n        display: none;\n    }\n}\n", ".dc-mobile-controls {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: var(--g-spacing-2, 8px);\n  height: 32px;\n  width: calc(100% - 2 * 16px);\n  box-sizing: content-box;\n  padding-top: 8px;\n  padding-bottom: 12px;\n  padding-inline: 16px;\n  background-color: var(--g-color-base-background);\n  border-top: 1px solid var(--g-color-line-generic);\n}\n.dc-mobile-controls:has(.dc-mobile-control:only-child) {\n  justify-content: flex-end;\n}\n@media (min-width: 769px) {\n  .dc-mobile-controls {\n    display: none;\n  }\n}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VSb290IjoiL2hvbWUvcnVubmVyL3dvcmsvY29tcG9uZW50cy9jb21wb25lbnRzL3NyYy9jb21wb25lbnRzL01vYmlsZUNvbnRyb2xzIiwic291cmNlcyI6WyJNb2JpbGVDb250cm9scy5zY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUlBO0VBR0k7RUFDQTtFQUNBO0VBQ0E7RUFFQTtFQUVBO0VBRUE7RUFDQTtFQUNBO0VBQ0EsZ0JBZGlCO0VBZ0JqQjtFQUVBOztBQUVBO0VBQ0k7O0FBR0o7RUF6Qko7SUEwQlEiLCJzb3VyY2VzQ29udGVudCI6WyJAdXNlICdzYXNzOm1hcCc7XG5AdXNlICcuLi8uLi9zdHlsZXMvdmFyaWFibGVzLnNjc3MnO1xuQHVzZSAnLi4vLi4vc3R5bGVzL21peGlucy5zY3NzJztcblxuLmRjLW1vYmlsZS1jb250cm9scyB7XG4gICAgJHBhZGRpbmctaW5saW5lOiAxNnB4O1xuXG4gICAgZGlzcGxheTogZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIGp1c3RpZnktY29udGVudDogc3BhY2UtYmV0d2VlbjtcbiAgICBnYXA6IHZhcigtLWctc3BhY2luZy0yLCA4cHgpO1xuXG4gICAgaGVpZ2h0OiAje3ZhcmlhYmxlcy4kbW9iaWxlQ29udHJvbHNIZWlnaHR9O1xuXG4gICAgd2lkdGg6IGNhbGMoMTAwJSAtIDIgKiAjeyRwYWRkaW5nLWlubGluZX0pO1xuXG4gICAgYm94LXNpemluZzogY29udGVudC1ib3g7XG4gICAgcGFkZGluZy10b3A6ICN7dmFyaWFibGVzLiRtb2JpbGVDb250cm9sc1RvcFBhZGRpbmd9O1xuICAgIHBhZGRpbmctYm90dG9tOiAje3ZhcmlhYmxlcy4kbW9iaWxlQ29udHJvbHNCb3R0b21QYWRkaW5nfTtcbiAgICBwYWRkaW5nLWlubGluZTogJHBhZGRpbmctaW5saW5lO1xuXG4gICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tZy1jb2xvci1iYXNlLWJhY2tncm91bmQpO1xuXG4gICAgYm9yZGVyLXRvcDogMXB4IHNvbGlkIHZhcigtLWctY29sb3ItbGluZS1nZW5lcmljKTtcblxuICAgICY6aGFzKC5kYy1tb2JpbGUtY29udHJvbDpvbmx5LWNoaWxkKSB7XG4gICAgICAgIGp1c3RpZnktY29udGVudDogZmxleC1lbmQ7XG4gICAgfVxuXG4gICAgQG1lZGlhIChtaW4td2lkdGg6IG1hcC5nZXQodmFyaWFibGVzLiRzY3JlZW5CcmVha3BvaW50cywgJ21kJykpIHtcbiAgICAgICAgZGlzcGxheTogbm9uZTtcbiAgICB9XG59XG4iXX0= */"],
   "mappings": ";AAIA,CAAA;AAGI,WAAA;AACA,eAAA;AACA,mBAAA;AACA,OAAA;AAAA,OAAA,IAAA,aAAA,EAAA;AAEA,UAAA;AAEA,SAAA,KAAA,KAAA,EAAA,EAAA,EAAA;AAEA,cAAA;AACA,eAAA;AACA,kBAAA;AACA,gBAAA;AAAA,iBAAA;AAEA,oBAAA,IAAA;AAEA,cAAA,IAAA,MAAA,IAAA;ACVJ;ADYI,CArBJ,kBAqBI,KAAA,CAAA,iBAAA;AACI,mBAAA;ACVR;ADaI,QAAA,WAAA;AAzBJ,GAAA;AA0BQ,aAAA;ACVN;AACF;",
   "names": []

package/build/cjs/components/MobileControls/MobileControls.d.ts

@@ -1,10 +1,9 @@
 import type { ControlsProps } from '../Controls';
 import type { ControlSizes, DocSettings } from '../../models';
-import React from 'react';
 import './MobileControls.scss';
 export interface MobileControlsProps {
     controlSize: ControlSizes;
     userSettings: DocSettings & ControlsProps;
 }
-declare const MobileControls: React.MemoExoticComponent<({ controlSize, userSettings }: MobileControlsProps) => React.JSX.Element | null>;
+declare const MobileControls: import("react").MemoExoticComponent<({ controlSize, userSettings }: MobileControlsProps) => import("react").JSX.Element | null>;
 export default MobileControls;

package/build/cjs/components/MobileControls/MobileControls.js

@@ -33,7 +33,7 @@ __export(MobileControls_exports, {
   default: () => MobileControls_default
 });
 module.exports = __toCommonJS(MobileControls_exports);
-var import_react = __toESM(require("react"));
+var import_react = require("react");
 var import_icons = require("@gravity-ui/icons");
 var import_bem_cn_lite = __toESM(require("bem-cn-lite"));
 var import_langs = __toESM(require("langs"));
@@ -43,6 +43,7 @@ var import_hooks = require("../../hooks");
 var import_models = require("../../models");
 var import_MobileControl = __toESM(require("./MobileControl/MobileControl"));
 var import_MobileControls = require("./MobileControls.css");
+var import_jsx_runtime = require("react/jsx-runtime");
 var b = (0, import_bem_cn_lite.default)("dc-mobile-controls");
 var useLangControl = (t, lang, availableLangs, langs, onChangeLang) => {
   const langItems = (0, import_react.useMemo)(() => {
@@ -74,7 +75,7 @@ var useLangControl = (t, lang, availableLangs, langs, onChangeLang) => {
     return preparedLangs.length ? preparedLangs : import_constants.LEGACY_LANG_ITEMS;
   }, [langs]);
   const selectedItemIndex = (0, import_react.useMemo)(() => langs ? langs.indexOf(lang) : -1, [lang, langs]);
-  return /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     import_MobileControl.default,
     {
       name: "lang",
@@ -110,7 +111,7 @@ var useThemeControl = (t, theme, onChangeTheme) => {
     return "";
   }, [t, theme, themesItems]);
   const selectedItemIndex = (0, import_react.useMemo)(() => theme ? themes.indexOf(theme) : -1, [theme]);
-  return /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     import_MobileControl.default,
     {
       name: "theme",
@@ -132,7 +133,10 @@ var MobileControls = (0, import_react.memo)(({ controlSize, userSettings }) => {
   if (!onChangeTheme && !onChangeLang) {
     return null;
   }
-  return /* @__PURE__ */ import_react.default.createElement("div", { className: b() }, /* @__PURE__ */ import_react.default.createElement(import_Controls.ControlsLayout, { controlClassName: b("control"), controlSize }, onChangeTheme && themeControl, onChangeLang && langControl));
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: b(), children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_Controls.ControlsLayout, { controlClassName: b("control"), controlSize, children: [
+    onChangeTheme && themeControl,
+    onChangeLang && langControl
+  ] }) });
 });
 MobileControls.displayName = "MobileControls";
 var MobileControls_default = MobileControls;

package/build/cjs/components/MobileControls/MobileControls.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/MobileControls/MobileControls.tsx"],
-  "sourcesContent": ["import type {ControlsProps} from '../Controls';\nimport type {\n    AvailableLangs,\n    ControlSizes,\n    DocSettings,\n    ExtendedLang,\n    LangOptions,\n    ListItem,\n    OnChangeValue,\n    TFunction,\n} from '../../models';\n\nimport React, {memo, useMemo} from 'react';\nimport {Globe, Sun} from '@gravity-ui/icons';\nimport block from 'bem-cn-lite';\nimport allLangs from 'langs';\n\nimport {DEFAULT_LANGS, LEGACY_LANG_ITEMS} from '../../constants';\nimport {ControlsLayout} from '../Controls';\nimport {useTranslation} from '../../hooks';\nimport {Lang, Theme} from '../../models';\n\nimport MobileControl from './MobileControl/MobileControl';\nimport './MobileControls.scss';\n\nconst b = block('dc-mobile-controls');\n\nexport interface MobileControlsProps {\n    controlSize: ControlSizes;\n    userSettings: DocSettings & ControlsProps;\n}\n\nconst useLangControl = (\n    t: TFunction,\n    lang: `${Lang}` | Lang,\n    availableLangs: AvailableLangs,\n    langs?: (string | ExtendedLang)[],\n    onChangeLang?: (lang: `${Lang}` | Lang, options?: LangOptions) => void,\n) => {\n    const langItems = useMemo(() => {\n        const preparedLangs = (langs ?? DEFAULT_LANGS)\n            .map((code) => {\n                let lang: string;\n                let tld: string | undefined;\n                let href: string | undefined;\n\n                if (typeof code === 'string') {\n                    lang = code;\n                } else {\n                    lang = code.lang;\n                    tld = code.tld;\n                    href = code.href;\n                }\n\n                const locale = lang.split('-')[0];\n                const langData = allLangs.where('1', locale);\n\n                const regionNames = new Intl.DisplayNames([lang], {type: 'region'});\n                const country = tld ? regionNames.of(tld.toUpperCase()) : undefined;\n\n                return langData\n                    ? {\n                          text: langData.local,\n                          country,\n                          value: lang,\n                          options: {\n                              tld,\n                              href,\n                          },\n                      }\n                    : undefined;\n            })\n            .filter(Boolean) as ListItem[];\n\n        return preparedLangs.length ? preparedLangs : LEGACY_LANG_ITEMS;\n    }, [langs]);\n\n    const selectedItemIndex = useMemo(() => (langs ? langs.indexOf(lang) : -1), [lang, langs]);\n\n    return (\n        <MobileControl\n            name={'lang'}\n            title={t('lang-text')}\n            Icon={Globe}\n            selectedItem={lang}\n            selectedItemIndex={selectedItemIndex}\n            displayItems={langItems}\n            availableLangs={availableLangs}\n            onChangeValue={onChangeLang as OnChangeValue}\n        />\n    );\n};\nconst themes = [Theme.Light, Theme.Dark];\n\nconst useThemeControl = (t: TFunction, theme: Theme, onChangeTheme?: (theme: Theme) => void) => {\n    const themesItems = useMemo(\n        () =>\n            themes.map((value) => {\n                const text = t(`label_${value}_theme`);\n\n                return {\n                    text,\n                    value,\n                };\n            }),\n        [t],\n    );\n\n    const buttonLabel = useMemo(() => {\n        for (const item of themesItems) {\n            if (theme !== item.value) {\n                continue;\n            }\n\n            return t(`full_label_${item.value}_theme`);\n        }\n\n        return '';\n    }, [t, theme, themesItems]);\n\n    const selectedItemIndex = useMemo(() => (theme ? themes.indexOf(theme) : -1), [theme]);\n\n    return (\n        <MobileControl\n            name={'theme'}\n            title={t('label_theme')}\n            buttonLabel={buttonLabel}\n            Icon={Sun}\n            selectedItem={theme}\n            selectedItemIndex={selectedItemIndex}\n            displayItems={themesItems}\n            onChangeValue={onChangeTheme as OnChangeValue}\n        />\n    );\n};\n\nconst MobileControls = memo(({controlSize, userSettings}: MobileControlsProps) => {\n    const {t} = useTranslation('controls');\n    const {onChangeLang, lang, langs, availableLangs = [], onChangeTheme, theme} = userSettings;\n\n    const langControl = useLangControl(t, lang ?? Lang.En, availableLangs, langs, onChangeLang);\n    const themeControl = useThemeControl(t, theme ?? Theme.Light, onChangeTheme);\n\n    if (!onChangeTheme && !onChangeLang) {\n        return null;\n    }\n\n    return (\n        <div className={b()}>\n            <ControlsLayout controlClassName={b('control')} controlSize={controlSize}>\n                {onChangeTheme && themeControl}\n                {onChangeLang && langControl}\n            </ControlsLayout>\n        </div>\n    );\n});\n\nMobileControls.displayName = 'MobileControls';\n\nexport default MobileControls;\n"],
-  "mappings": "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",
-  "names": ["block", "lang", "allLangs", "React", "MobileControl"]
+  "sourcesContent": ["import type {ControlsProps} from '../Controls';\nimport type {\n    AvailableLangs,\n    ControlSizes,\n    DocSettings,\n    ExtendedLang,\n    LangOptions,\n    ListItem,\n    OnChangeValue,\n    TFunction,\n} from '../../models';\n\nimport {memo, useMemo} from 'react';\nimport {Globe, Sun} from '@gravity-ui/icons';\nimport block from 'bem-cn-lite';\nimport allLangs from 'langs';\n\nimport {DEFAULT_LANGS, LEGACY_LANG_ITEMS} from '../../constants';\nimport {ControlsLayout} from '../Controls';\nimport {useTranslation} from '../../hooks';\nimport {Lang, Theme} from '../../models';\n\nimport MobileControl from './MobileControl/MobileControl';\nimport './MobileControls.scss';\n\nconst b = block('dc-mobile-controls');\n\nexport interface MobileControlsProps {\n    controlSize: ControlSizes;\n    userSettings: DocSettings & ControlsProps;\n}\n\nconst useLangControl = (\n    t: TFunction,\n    lang: `${Lang}` | Lang,\n    availableLangs: AvailableLangs,\n    langs?: (string | ExtendedLang)[],\n    onChangeLang?: (lang: `${Lang}` | Lang, options?: LangOptions) => void,\n) => {\n    const langItems = useMemo(() => {\n        const preparedLangs = (langs ?? DEFAULT_LANGS)\n            .map((code) => {\n                let lang: string;\n                let tld: string | undefined;\n                let href: string | undefined;\n\n                if (typeof code === 'string') {\n                    lang = code;\n                } else {\n                    lang = code.lang;\n                    tld = code.tld;\n                    href = code.href;\n                }\n\n                const locale = lang.split('-')[0];\n                const langData = allLangs.where('1', locale);\n\n                const regionNames = new Intl.DisplayNames([lang], {type: 'region'});\n                const country = tld ? regionNames.of(tld.toUpperCase()) : undefined;\n\n                return langData\n                    ? {\n                          text: langData.local,\n                          country,\n                          value: lang,\n                          options: {\n                              tld,\n                              href,\n                          },\n                      }\n                    : undefined;\n            })\n            .filter(Boolean) as ListItem[];\n\n        return preparedLangs.length ? preparedLangs : LEGACY_LANG_ITEMS;\n    }, [langs]);\n\n    const selectedItemIndex = useMemo(() => (langs ? langs.indexOf(lang) : -1), [lang, langs]);\n\n    return (\n        <MobileControl\n            name={'lang'}\n            title={t('lang-text')}\n            Icon={Globe}\n            selectedItem={lang}\n            selectedItemIndex={selectedItemIndex}\n            displayItems={langItems}\n            availableLangs={availableLangs}\n            onChangeValue={onChangeLang as OnChangeValue}\n        />\n    );\n};\nconst themes = [Theme.Light, Theme.Dark];\n\nconst useThemeControl = (t: TFunction, theme: Theme, onChangeTheme?: (theme: Theme) => void) => {\n    const themesItems = useMemo(\n        () =>\n            themes.map((value) => {\n                const text = t(`label_${value}_theme`);\n\n                return {\n                    text,\n                    value,\n                };\n            }),\n        [t],\n    );\n\n    const buttonLabel = useMemo(() => {\n        for (const item of themesItems) {\n            if (theme !== item.value) {\n                continue;\n            }\n\n            return t(`full_label_${item.value}_theme`);\n        }\n\n        return '';\n    }, [t, theme, themesItems]);\n\n    const selectedItemIndex = useMemo(() => (theme ? themes.indexOf(theme) : -1), [theme]);\n\n    return (\n        <MobileControl\n            name={'theme'}\n            title={t('label_theme')}\n            buttonLabel={buttonLabel}\n            Icon={Sun}\n            selectedItem={theme}\n            selectedItemIndex={selectedItemIndex}\n            displayItems={themesItems}\n            onChangeValue={onChangeTheme as OnChangeValue}\n        />\n    );\n};\n\nconst MobileControls = memo(({controlSize, userSettings}: MobileControlsProps) => {\n    const {t} = useTranslation('controls');\n    const {onChangeLang, lang, langs, availableLangs = [], onChangeTheme, theme} = userSettings;\n\n    const langControl = useLangControl(t, lang ?? Lang.En, availableLangs, langs, onChangeLang);\n    const themeControl = useThemeControl(t, theme ?? Theme.Light, onChangeTheme);\n\n    if (!onChangeTheme && !onChangeLang) {\n        return null;\n    }\n\n    return (\n        <div className={b()}>\n            <ControlsLayout controlClassName={b('control')} controlSize={controlSize}>\n                {onChangeTheme && themeControl}\n                {onChangeLang && langControl}\n            </ControlsLayout>\n        </div>\n    );\n});\n\nMobileControls.displayName = 'MobileControls';\n\nexport default MobileControls;\n"],
+  "mappings": "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",
+  "names": ["block", "lang", "allLangs", "MobileControl"]
 }

package/build/cjs/components/NeuroExpertModal/NeuroExpertModal.css.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../../src/components/NeuroExpertModal/NeuroExpertModal.scss", "../../../../src/components/NeuroExpertModal/%3Cinput css 3SVes4%3E"],
+  "sources": ["../../../../src/components/NeuroExpertModal/NeuroExpertModal.scss", "../../../../src/components/NeuroExpertModal/%3Cinput css l6GDw2%3E"],
   "sourcesContent": ["@use 'sass:map';\n@use '../../styles/variables';\n\n.dc-neuro-expert-modal {\n    &__modal {\n        display: grid;\n\n        .g-modal__content {\n            border-radius: 8px;\n            width: 50vw;\n            height: 70vh;\n        }\n    }\n\n    &__header-caption {\n        display: grid;\n        align-items: center;\n        grid-template-columns: auto 1fr;\n        width: fit-content;\n        gap: 8px;\n    }\n\n    &__header {\n        display: grid;\n        justify-content: center;\n        padding-bottom: 20px;\n    }\n\n    &__body {\n        position: relative;\n        padding: 0;\n    }\n\n    &__container {\n        width: 100%;\n        height: 62vh;\n    }\n\n    &__iframe {\n        width: 100%;\n        height: 100%;\n        border: none;\n    }\n\n    &__loader {\n        position: absolute;\n        inset: 0;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        background: var(--g-color-base-background);\n    }\n\n    @media (max-width: map.get(variables.$screenBreakpoints, 'xl')) {\n        &__modal {\n            .g-modal__content {\n                width: 70vw;\n            }\n        }\n    }\n\n    @media (max-width: map.get(variables.$screenBreakpoints, 'md')) {\n        &__modal {\n            .g-modal__content {\n                border-radius: 0;\n                width: 100vw;\n                height: 100vh;\n            }\n        }\n\n        &__container {\n            height: 92vh;\n        }\n    }\n}\n", ".dc-neuro-expert-modal__modal {\n  display: grid;\n}\n.dc-neuro-expert-modal__modal .g-modal__content {\n  border-radius: 8px;\n  width: 50vw;\n  height: 70vh;\n}\n.dc-neuro-expert-modal__header-caption {\n  display: grid;\n  align-items: center;\n  grid-template-columns: auto 1fr;\n  width: fit-content;\n  gap: 8px;\n}\n.dc-neuro-expert-modal__header {\n  display: grid;\n  justify-content: center;\n  padding-bottom: 20px;\n}\n.dc-neuro-expert-modal__body {\n  position: relative;\n  padding: 0;\n}\n.dc-neuro-expert-modal__container {\n  width: 100%;\n  height: 62vh;\n}\n.dc-neuro-expert-modal__iframe {\n  width: 100%;\n  height: 100%;\n  border: none;\n}\n.dc-neuro-expert-modal__loader {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--g-color-base-background);\n}\n@media (max-width: 1185px) {\n  .dc-neuro-expert-modal__modal .g-modal__content {\n    width: 70vw;\n  }\n}\n@media (max-width: 769px) {\n  .dc-neuro-expert-modal__modal .g-modal__content {\n    border-radius: 0;\n    width: 100vw;\n    height: 100vh;\n  }\n  .dc-neuro-expert-modal__container {\n    height: 92vh;\n  }\n}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VSb290IjoiL2hvbWUvcnVubmVyL3dvcmsvY29tcG9uZW50cy9jb21wb25lbnRzL3NyYy9jb21wb25lbnRzL05ldXJvRXhwZXJ0TW9kYWwiLCJzb3VyY2VzIjpbIk5ldXJvRXhwZXJ0TW9kYWwuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFJSTtFQUNJOztBQUVBO0VBQ0k7RUFDQTtFQUNBOztBQUlSO0VBQ0k7RUFDQTtFQUNBO0VBQ0E7RUFDQTs7QUFHSjtFQUNJO0VBQ0E7RUFDQTs7QUFHSjtFQUNJO0VBQ0E7O0FBR0o7RUFDSTtFQUNBOztBQUdKO0VBQ0k7RUFDQTtFQUNBOztBQUdKO0VBQ0k7RUFDQTtFQUNBO0VBQ0E7RUFDQTtFQUNBOztBQUdKO0VBRVE7SUFDSTs7O0FBS1o7RUFFUTtJQUNJO0lBQ0E7SUFDQTs7RUFJUjtJQUNJIiwic291cmNlc0NvbnRlbnQiOlsiQHVzZSAnc2FzczptYXAnO1xuQHVzZSAnLi4vLi4vc3R5bGVzL3ZhcmlhYmxlcyc7XG5cbi5kYy1uZXVyby1leHBlcnQtbW9kYWwge1xuICAgICZfX21vZGFsIHtcbiAgICAgICAgZGlzcGxheTogZ3JpZDtcblxuICAgICAgICAuZy1tb2RhbF9fY29udGVudCB7XG4gICAgICAgICAgICBib3JkZXItcmFkaXVzOiA4cHg7XG4gICAgICAgICAgICB3aWR0aDogNTB2dztcbiAgICAgICAgICAgIGhlaWdodDogNzB2aDtcbiAgICAgICAgfVxuICAgIH1cblxuICAgICZfX2hlYWRlci1jYXB0aW9uIHtcbiAgICAgICAgZGlzcGxheTogZ3JpZDtcbiAgICAgICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICAgICAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiBhdXRvIDFmcjtcbiAgICAgICAgd2lkdGg6IGZpdC1jb250ZW50O1xuICAgICAgICBnYXA6IDhweDtcbiAgICB9XG5cbiAgICAmX19oZWFkZXIge1xuICAgICAgICBkaXNwbGF5OiBncmlkO1xuICAgICAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgICAgICAgcGFkZGluZy1ib3R0b206IDIwcHg7XG4gICAgfVxuXG4gICAgJl9fYm9keSB7XG4gICAgICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICAgICAgcGFkZGluZzogMDtcbiAgICB9XG5cbiAgICAmX19jb250YWluZXIge1xuICAgICAgICB3aWR0aDogMTAwJTtcbiAgICAgICAgaGVpZ2h0OiA2MnZoO1xuICAgIH1cblxuICAgICZfX2lmcmFtZSB7XG4gICAgICAgIHdpZHRoOiAxMDAlO1xuICAgICAgICBoZWlnaHQ6IDEwMCU7XG4gICAgICAgIGJvcmRlcjogbm9uZTtcbiAgICB9XG5cbiAgICAmX19sb2FkZXIge1xuICAgICAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgICAgIGluc2V0OiAwO1xuICAgICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgICAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgICAgICAgYmFja2dyb3VuZDogdmFyKC0tZy1jb2xvci1iYXNlLWJhY2tncm91bmQpO1xuICAgIH1cblxuICAgIEBtZWRpYSAobWF4LXdpZHRoOiBtYXAuZ2V0KHZhcmlhYmxlcy4kc2NyZWVuQnJlYWtwb2ludHMsICd4bCcpKSB7XG4gICAgICAgICZfX21vZGFsIHtcbiAgICAgICAgICAgIC5nLW1vZGFsX19jb250ZW50IHtcbiAgICAgICAgICAgICAgICB3aWR0aDogNzB2dztcbiAgICAgICAgICAgIH1cbiAgICAgICAgfVxuICAgIH1cblxuICAgIEBtZWRpYSAobWF4LXdpZHRoOiBtYXAuZ2V0KHZhcmlhYmxlcy4kc2NyZWVuQnJlYWtwb2ludHMsICdtZCcpKSB7XG4gICAgICAgICZfX21vZGFsIHtcbiAgICAgICAgICAgIC5nLW1vZGFsX19jb250ZW50IHtcbiAgICAgICAgICAgICAgICBib3JkZXItcmFkaXVzOiAwO1xuICAgICAgICAgICAgICAgIHdpZHRoOiAxMDB2dztcbiAgICAgICAgICAgICAgICBoZWlnaHQ6IDEwMHZoO1xuICAgICAgICAgICAgfVxuICAgICAgICB9XG5cbiAgICAgICAgJl9fY29udGFpbmVyIHtcbiAgICAgICAgICAgIGhlaWdodDogOTJ2aDtcbiAgICAgICAgfVxuICAgIH1cbn1cbiJdfQ== */"],
   "mappings": ";AAII,CAAA;AACI,WAAA;ACHR;ADKQ,CAHJ,6BAGI,CAAA;AACI,iBAAA;AACA,SAAA;AACA,UAAA;ACHZ;ADOI,CAAA;AACI,WAAA;AACA,eAAA;AACA,yBAAA,KAAA;AACA,SAAA;AAAA,SAAA;AACA,YAAA;AAAA,OAAA;ACLR;ADQI,CAAA;AACI,WAAA;AACA,mBAAA;AACA,kBAAA;ACNR;ADSI,CAAA;AACI,YAAA;AACA,WAAA;ACPR;ADUI,CAAA;AACI,SAAA;AACA,UAAA;ACRR;ADWI,CAAA;AACI,SAAA;AACA,UAAA;AACA,UAAA;ACTR;ADYI,CAAA;AACI,YAAA;AACA,OAAA;AAAA,SAAA;AAAA,UAAA;AAAA,QAAA;AACA,WAAA;AACA,eAAA;AACA,mBAAA;AACA,cAAA,IAAA;ACVR;ADaI,QAAA,WAAA;AAEQ,GAnDR,6BAmDQ,CAhDJ;AAiDQ,WAAA;ACZd;AACF;ADgBI,QAAA,WAAA;AAEQ,GA3DR,6BA2DQ,CAxDJ;AAyDQ,mBAAA;AACA,WAAA;AACA,YAAA;ACfd;ADmBM,GArCJ;AAsCQ,YAAA;ACjBV;AACF;",
   "names": []

package/build/cjs/components/NeuroExpertModal/NeuroExpertModal.js

@@ -33,13 +33,14 @@ __export(NeuroExpertModal_exports, {
   NeuroExpertModal: () => NeuroExpertModal
 });
 module.exports = __toCommonJS(NeuroExpertModal_exports);
-var import_react = __toESM(require("react"));
+var import_react = require("react");
 var import_uikit = require("@gravity-ui/uikit");
 var import_react_i18next = require("react-i18next");
 var import_bem_cn_lite = __toESM(require("bem-cn-lite"));
 var import_analytics = require("../../shared/libs/analytics");
 var import_SearchSuggest = require("../SearchSuggest");
 var import_NeuroExpertModal = require("./NeuroExpertModal.css");
+var import_jsx_runtime = require("react/jsx-runtime");
 var b = (0, import_bem_cn_lite.default)("dc-neuro-expert-modal");
 var IFRAME_BASE_URL = "https://expert.yandex.ru/expert/projects";
 var IFRAME_ORIGIN = "https://expert.yandex.ru";
@@ -48,7 +49,10 @@ var IFRAME_ACTION_MAP = {
 };
 var HeaderCaption = () => {
   const { t } = (0, import_react_i18next.useTranslation)("search-suggest");
-  return /* @__PURE__ */ import_react.default.createElement("div", { className: b("header-caption") }, /* @__PURE__ */ import_react.default.createElement(import_SearchSuggest.AiIcon, null), /* @__PURE__ */ import_react.default.createElement(import_uikit.Text, { variant: "subheader-2" }, t("search-suggest_ai-chat")));
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: b("header-caption"), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_SearchSuggest.AiIcon, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_uikit.Text, { variant: "subheader-2", children: t("search-suggest_ai-chat") })
+  ] });
 };
 var NeuroExpertModal = ({ open, query, projectId, onClose }) => {
   const analytics = (0, import_analytics.useAnalytics)();
@@ -102,7 +106,7 @@ var NeuroExpertModal = ({ open, query, projectId, onClose }) => {
       IFRAME_ORIGIN
     );
   }, [open, loaded, query]);
-  return /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
     import_uikit.Dialog,
     {
       open,
@@ -111,17 +115,22 @@ var NeuroExpertModal = ({ open, query, projectId, onClose }) => {
       keepMounted: loaded,
       className: b(),
       modalClassName: b("modal"),
-      onTransitionOutComplete: restoreBodyScroll
-    },
-    /* @__PURE__ */ import_react.default.createElement(import_uikit.Dialog.Header, { className: b("header"), caption: /* @__PURE__ */ import_react.default.createElement(HeaderCaption, null) }),
-    /* @__PURE__ */ import_react.default.createElement(import_uikit.Dialog.Body, { className: b("body") }, /* @__PURE__ */ import_react.default.createElement("div", { className: b("container") }, /* @__PURE__ */ import_react.default.createElement(
-      "iframe",
-      {
-        ref: iframeRef,
-        src: iframeSrc,
-        style: { width: "100%", height: "100%", border: "none" }
-      }
-    )), !loaded && /* @__PURE__ */ import_react.default.createElement("div", { className: b("loader") }, /* @__PURE__ */ import_react.default.createElement(import_uikit.Loader, { size: "l" })))
+      onTransitionOutComplete: restoreBodyScroll,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_uikit.Dialog.Header, { className: b("header"), caption: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(HeaderCaption, {}) }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_uikit.Dialog.Body, { className: b("body"), children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: b("container"), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "iframe",
+            {
+              ref: iframeRef,
+              src: iframeSrc,
+              style: { width: "100%", height: "100%", border: "none" }
+            }
+          ) }),
+          !loaded && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: b("loader"), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_uikit.Loader, { size: "l" }) })
+        ] })
+      ]
+    }
   );
 };
 //# sourceMappingURL=NeuroExpertModal.js.map

package/build/cjs/components/NeuroExpertModal/NeuroExpertModal.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/NeuroExpertModal/NeuroExpertModal.tsx"],
-  "sourcesContent": ["import type {FC} from 'react';\n\nimport React, {useCallback, useEffect, useRef, useState} from 'react';\nimport {Dialog, Loader, Text} from '@gravity-ui/uikit';\nimport {useTranslation} from 'react-i18next';\nimport block from 'bem-cn-lite';\n\nimport {CommonAnalyticsEvent, useAnalytics} from '../../shared/libs/analytics';\nimport {AiIcon} from '../SearchSuggest';\n\nimport './NeuroExpertModal.scss';\n\nconst b = block('dc-neuro-expert-modal');\n\nconst IFRAME_BASE_URL = 'https://expert.yandex.ru/expert/projects';\nconst IFRAME_ORIGIN = 'https://expert.yandex.ru';\n\nconst IFRAME_ACTION_MAP: Record<string, string> = {\n    'message-sent': 'message',\n};\n\nexport interface NeuroExpertModalProps {\n    open: boolean;\n    query: string;\n    projectId: string;\n    onClose: () => void;\n}\n\nconst HeaderCaption = () => {\n    const {t} = useTranslation('search-suggest');\n\n    return (\n        <div className={b('header-caption')}>\n            <AiIcon />\n            <Text variant=\"subheader-2\">{t('search-suggest_ai-chat')}</Text>\n        </div>\n    );\n};\n\nexport const NeuroExpertModal: FC<NeuroExpertModalProps> = ({open, query, projectId, onClose}) => {\n    const analytics = useAnalytics();\n    const [loaded, setLoaded] = useState<boolean>(false);\n    const iframeRef = useRef<HTMLIFrameElement>(null);\n    const iframeSrc = `${IFRAME_BASE_URL}/${projectId}/iframe`;\n\n    const restoreBodyScroll = useCallback(() => {\n        document.body.style.removeProperty('overflow');\n        document.body.style.removeProperty('padding-right');\n        document.body.style.removeProperty('--floating-ui-scrollbar-width');\n    }, []);\n\n    const trackAction = useCallback(\n        (action: string) => {\n            analytics.track(CommonAnalyticsEvent.DOCS_NEUROEXPERT_ACTION, {\n                action,\n                initType: 'search',\n            });\n        },\n        [analytics],\n    );\n\n    useEffect(() => {\n        const handleMessage = (event: MessageEvent) => {\n            if (event.source !== iframeRef.current?.contentWindow) {\n                return;\n            }\n\n            const type = event.data?.type;\n\n            if (type === 'chat-mounted' && !loaded) {\n                setLoaded(true);\n            }\n\n            const mappedAction = IFRAME_ACTION_MAP[type];\n            if (mappedAction) {\n                trackAction(mappedAction);\n            }\n        };\n\n        window.addEventListener('message', handleMessage);\n\n        return () => window.removeEventListener('message', handleMessage);\n    }, [loaded, trackAction]);\n\n    useEffect(() => {\n        if (open) {\n            trackAction('open');\n        }\n    }, [open, trackAction]);\n\n    useEffect(() => {\n        if (!open || !loaded) {\n            return;\n        }\n\n        iframeRef.current?.contentWindow?.postMessage(\n            {type: 'send-message', payload: {text: query}},\n            IFRAME_ORIGIN,\n        );\n    }, [open, loaded, query]);\n\n    return (\n        <Dialog\n            open={open}\n            onClose={onClose}\n            hasCloseButton\n            keepMounted={loaded}\n            className={b()}\n            modalClassName={b('modal')}\n            onTransitionOutComplete={restoreBodyScroll}\n        >\n            <Dialog.Header className={b('header')} caption={<HeaderCaption />} />\n            <Dialog.Body className={b('body')}>\n                <div className={b('container')}>\n                    <iframe\n                        ref={iframeRef}\n                        src={iframeSrc}\n                        style={{width: '100%', height: '100%', border: 'none'}}\n                    />\n                </div>\n                {!loaded && (\n                    <div className={b('loader')}>\n                        <Loader size=\"l\" />\n                    </div>\n                )}\n            </Dialog.Body>\n        </Dialog>\n    );\n};\n"],
-  "mappings": "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",
-  "names": ["block", "React"]
+  "sourcesContent": ["import type {FC} from 'react';\n\nimport {useCallback, useEffect, useRef, useState} from 'react';\nimport {Dialog, Loader, Text} from '@gravity-ui/uikit';\nimport {useTranslation} from 'react-i18next';\nimport block from 'bem-cn-lite';\n\nimport {CommonAnalyticsEvent, useAnalytics} from '../../shared/libs/analytics';\nimport {AiIcon} from '../SearchSuggest';\n\nimport './NeuroExpertModal.scss';\n\nconst b = block('dc-neuro-expert-modal');\n\nconst IFRAME_BASE_URL = 'https://expert.yandex.ru/expert/projects';\nconst IFRAME_ORIGIN = 'https://expert.yandex.ru';\n\nconst IFRAME_ACTION_MAP: Record<string, string> = {\n    'message-sent': 'message',\n};\n\nexport interface NeuroExpertModalProps {\n    open: boolean;\n    query: string;\n    projectId: string;\n    onClose: () => void;\n}\n\nconst HeaderCaption = () => {\n    const {t} = useTranslation('search-suggest');\n\n    return (\n        <div className={b('header-caption')}>\n            <AiIcon />\n            <Text variant=\"subheader-2\">{t('search-suggest_ai-chat')}</Text>\n        </div>\n    );\n};\n\nexport const NeuroExpertModal: FC<NeuroExpertModalProps> = ({open, query, projectId, onClose}) => {\n    const analytics = useAnalytics();\n    const [loaded, setLoaded] = useState<boolean>(false);\n    const iframeRef = useRef<HTMLIFrameElement>(null);\n    const iframeSrc = `${IFRAME_BASE_URL}/${projectId}/iframe`;\n\n    const restoreBodyScroll = useCallback(() => {\n        document.body.style.removeProperty('overflow');\n        document.body.style.removeProperty('padding-right');\n        document.body.style.removeProperty('--floating-ui-scrollbar-width');\n    }, []);\n\n    const trackAction = useCallback(\n        (action: string) => {\n            analytics.track(CommonAnalyticsEvent.DOCS_NEUROEXPERT_ACTION, {\n                action,\n                initType: 'search',\n            });\n        },\n        [analytics],\n    );\n\n    useEffect(() => {\n        const handleMessage = (event: MessageEvent) => {\n            if (event.source !== iframeRef.current?.contentWindow) {\n                return;\n            }\n\n            const type = event.data?.type;\n\n            if (type === 'chat-mounted' && !loaded) {\n                setLoaded(true);\n            }\n\n            const mappedAction = IFRAME_ACTION_MAP[type];\n            if (mappedAction) {\n                trackAction(mappedAction);\n            }\n        };\n\n        window.addEventListener('message', handleMessage);\n\n        return () => window.removeEventListener('message', handleMessage);\n    }, [loaded, trackAction]);\n\n    useEffect(() => {\n        if (open) {\n            trackAction('open');\n        }\n    }, [open, trackAction]);\n\n    useEffect(() => {\n        if (!open || !loaded) {\n            return;\n        }\n\n        iframeRef.current?.contentWindow?.postMessage(\n            {type: 'send-message', payload: {text: query}},\n            IFRAME_ORIGIN,\n        );\n    }, [open, loaded, query]);\n\n    return (\n        <Dialog\n            open={open}\n            onClose={onClose}\n            hasCloseButton\n            keepMounted={loaded}\n            className={b()}\n            modalClassName={b('modal')}\n            onTransitionOutComplete={restoreBodyScroll}\n        >\n            <Dialog.Header className={b('header')} caption={<HeaderCaption />} />\n            <Dialog.Body className={b('body')}>\n                <div className={b('container')}>\n                    <iframe\n                        ref={iframeRef}\n                        src={iframeSrc}\n                        style={{width: '100%', height: '100%', border: 'none'}}\n                    />\n                </div>\n                {!loaded && (\n                    <div className={b('loader')}>\n                        <Loader size=\"l\" />\n                    </div>\n                )}\n            </Dialog.Body>\n        </Dialog>\n    );\n};\n"],
+  "mappings": "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",
+  "names": ["block"]
 }

package/build/cjs/components/Notification/Notification.css.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../../src/components/Notification/Notification.scss", "../../../../src/components/Notification/%3Cinput css jhyeRe%3E"],
+  "sources": ["../../../../src/components/Notification/Notification.scss", "../../../../src/components/Notification/%3Cinput css Q4D3xB%3E"],
   "sourcesContent": ["@use 'sass:color';\n@use 'sass:map';\n@use '../../styles/variables';\n@use '../../styles/mixins';\n\n$infoColor: #027bf3;\n$tipColor: #56bd67;\n$warningColor: #f19518;\n$importantColor: #ff4645;\n\n$infoBackgroundColor: rgba(2, 123, 243, 0.08);\n$tipBackgroundColor: rgba(63, 201, 46, 0.1);\n$warningBackgroundColor: rgba(255, 136, 0, 0.15);\n$importantBackgroundColor: rgba(235, 50, 38, 0.08);\n\n.dc-note {\n    position: relative;\n    padding: 20px 20px 20px 64px;\n    border-radius: 10px;\n\n    &__wrapper {\n        margin: 20px 36px;\n    }\n\n    &__xmark {\n        position: absolute;\n        top: 0;\n        right: 0;\n    }\n\n    &__template {\n        padding: 20px;\n        border: 1px solid var(--g-color-line-generic);\n    }\n\n    &__title {\n        font-weight: 700;\n    }\n\n    & > p {\n        margin: 0 0 10px;\n\n        &:first-child {\n            &::before {\n                box-sizing: content-box;\n                display: block;\n                width: 24px;\n                height: 24px;\n                margin-top: -2px;\n                margin-left: -44px;\n                padding-right: 20px;\n                float: left;\n            }\n        }\n\n        &:last-child {\n            margin-bottom: 0;\n        }\n    }\n\n    $colors: (\n        dc-accent-info: $infoColor,\n        dc-accent-tip: $tipColor,\n        dc-accent-alert: $importantColor,\n        dc-accent-warning: $warningColor,\n    );\n\n    @each $type, $color in $colors {\n        &.#{$type} > p:first-child::before {\n            $r: color.channel($color, 'red');\n            $g: color.channel($color, 'green');\n            $b: color.channel($color, 'blue');\n            $rgbColor: 'rgb(' + $r + ',' + $g + ',' + $b + ')';\n            content: url('data:image/svg+xml,%3Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 16 16\"%3E%3Ccircle cx=\"8\" cy=\"8\" r=\"8\" fill=\"' + $rgbColor + '\"/%3E%3Crect width=\"1\" height=\"5\" x=\"7.5\" y=\"6.5\" stroke=\"%23fff\" rx=\".5\"/%3E%3Ccircle cx=\"8\" cy=\"4\" r=\"1\" fill=\"%23fff\"/%3E%3C/svg%3E');\n        }\n    }\n\n    $backgroundColors: (\n        dc-accent-info: $infoBackgroundColor,\n        dc-accent-tip: $tipBackgroundColor,\n        dc-accent-alert: $importantBackgroundColor,\n        dc-accent-warning: $warningBackgroundColor,\n    );\n\n    @each $type, $color in $backgroundColors {\n        &.#{$type} {\n            background: $color;\n        }\n    }\n}\n\n.pc-page-constructor__docs,\n.fullscreen-mode {\n    .dc-note__wrapper {\n        margin: 0px 0px 20px;\n    }\n}\n", ".dc-note {\n  position: relative;\n  padding: 20px 20px 20px 64px;\n  border-radius: 10px;\n}\n.dc-note__wrapper {\n  margin: 20px 36px;\n}\n.dc-note__xmark {\n  position: absolute;\n  top: 0;\n  right: 0;\n}\n.dc-note__template {\n  padding: 20px;\n  border: 1px solid var(--g-color-line-generic);\n}\n.dc-note__title {\n  font-weight: 700;\n}\n.dc-note > p {\n  margin: 0 0 10px;\n}\n.dc-note > p:first-child::before {\n  box-sizing: content-box;\n  display: block;\n  width: 24px;\n  height: 24px;\n  margin-top: -2px;\n  margin-left: -44px;\n  padding-right: 20px;\n  float: left;\n}\n.dc-note > p:last-child {\n  margin-bottom: 0;\n}\n.dc-note.dc-accent-info > p:first-child::before {\n  content: url('data:image/svg+xml,%3Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 16 16\"%3E%3Ccircle cx=\"8\" cy=\"8\" r=\"8\" fill=\"rgb(2,123,243)\"/%3E%3Crect width=\"1\" height=\"5\" x=\"7.5\" y=\"6.5\" stroke=\"%23fff\" rx=\".5\"/%3E%3Ccircle cx=\"8\" cy=\"4\" r=\"1\" fill=\"%23fff\"/%3E%3C/svg%3E');\n}\n.dc-note.dc-accent-tip > p:first-child::before {\n  content: url('data:image/svg+xml,%3Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 16 16\"%3E%3Ccircle cx=\"8\" cy=\"8\" r=\"8\" fill=\"rgb(86,189,103)\"/%3E%3Crect width=\"1\" height=\"5\" x=\"7.5\" y=\"6.5\" stroke=\"%23fff\" rx=\".5\"/%3E%3Ccircle cx=\"8\" cy=\"4\" r=\"1\" fill=\"%23fff\"/%3E%3C/svg%3E');\n}\n.dc-note.dc-accent-alert > p:first-child::before {\n  content: url('data:image/svg+xml,%3Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 16 16\"%3E%3Ccircle cx=\"8\" cy=\"8\" r=\"8\" fill=\"rgb(255,70,69)\"/%3E%3Crect width=\"1\" height=\"5\" x=\"7.5\" y=\"6.5\" stroke=\"%23fff\" rx=\".5\"/%3E%3Ccircle cx=\"8\" cy=\"4\" r=\"1\" fill=\"%23fff\"/%3E%3C/svg%3E');\n}\n.dc-note.dc-accent-warning > p:first-child::before {\n  content: url('data:image/svg+xml,%3Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 16 16\"%3E%3Ccircle cx=\"8\" cy=\"8\" r=\"8\" fill=\"rgb(241,149,24)\"/%3E%3Crect width=\"1\" height=\"5\" x=\"7.5\" y=\"6.5\" stroke=\"%23fff\" rx=\".5\"/%3E%3Ccircle cx=\"8\" cy=\"4\" r=\"1\" fill=\"%23fff\"/%3E%3C/svg%3E');\n}\n.dc-note.dc-accent-info {\n  background: rgba(2, 123, 243, 0.08);\n}\n.dc-note.dc-accent-tip {\n  background: rgba(63, 201, 46, 0.1);\n}\n.dc-note.dc-accent-alert {\n  background: rgba(235, 50, 38, 0.08);\n}\n.dc-note.dc-accent-warning {\n  background: rgba(255, 136, 0, 0.15);\n}\n\n.pc-page-constructor__docs .dc-note__wrapper,\n.fullscreen-mode .dc-note__wrapper {\n  margin: 0px 0px 20px;\n}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VSb290IjoiL2hvbWUvcnVubmVyL3dvcmsvY29tcG9uZW50cy9jb21wb25lbnRzL3NyYy9jb21wb25lbnRzL05vdGlmaWNhdGlvbiIsInNvdXJjZXMiOlsiTm90aWZpY2F0aW9uLnNjc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZUE7RUFDSTtFQUNBO0VBQ0E7O0FBRUE7RUFDSTs7QUFHSjtFQUNJO0VBQ0E7RUFDQTs7QUFHSjtFQUNJO0VBQ0E7O0FBR0o7RUFDSTs7QUFHSjtFQUNJOztBQUdJO0VBQ0k7RUFDQTtFQUNBO0VBQ0E7RUFDQTtFQUNBO0VBQ0E7RUFDQTs7QUFJUjtFQUNJOztBQVlKO0VBS0k7O0FBTEo7RUFLSTs7QUFMSjtFQUtJOztBQUxKO0VBS0k7O0FBWUo7RUFDSSxZQVRXOztBQVFmO0VBQ0ksWUFUVzs7QUFRZjtFQUNJLFlBVFc7O0FBUWY7RUFDSSxZQVRXOzs7QUFnQm5CO0FBQUE7RUFDSSIsInNvdXJjZXNDb250ZW50IjpbIkB1c2UgJ3Nhc3M6Y29sb3InO1xuQHVzZSAnc2FzczptYXAnO1xuQHVzZSAnLi4vLi4vc3R5bGVzL3ZhcmlhYmxlcyc7XG5AdXNlICcuLi8uLi9zdHlsZXMvbWl4aW5zJztcblxuJGluZm9Db2xvcjogIzAyN2JmMztcbiR0aXBDb2xvcjogIzU2YmQ2NztcbiR3YXJuaW5nQ29sb3I6ICNmMTk1MTg7XG4kaW1wb3J0YW50Q29sb3I6ICNmZjQ2NDU7XG5cbiRpbmZvQmFja2dyb3VuZENvbG9yOiByZ2JhKDIsIDEyMywgMjQzLCAwLjA4KTtcbiR0aXBCYWNrZ3JvdW5kQ29sb3I6IHJnYmEoNjMsIDIwMSwgNDYsIDAuMSk7XG4kd2FybmluZ0JhY2tncm91bmRDb2xvcjogcmdiYSgyNTUsIDEzNiwgMCwgMC4xNSk7XG4kaW1wb3J0YW50QmFja2dyb3VuZENvbG9yOiByZ2JhKDIzNSwgNTAsIDM4LCAwLjA4KTtcblxuLmRjLW5vdGUge1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICBwYWRkaW5nOiAyMHB4IDIwcHggMjBweCA2NHB4O1xuICAgIGJvcmRlci1yYWRpdXM6IDEwcHg7XG5cbiAgICAmX193cmFwcGVyIHtcbiAgICAgICAgbWFyZ2luOiAyMHB4IDM2cHg7XG4gICAgfVxuXG4gICAgJl9feG1hcmsge1xuICAgICAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgICAgIHRvcDogMDtcbiAgICAgICAgcmlnaHQ6IDA7XG4gICAgfVxuXG4gICAgJl9fdGVtcGxhdGUge1xuICAgICAgICBwYWRkaW5nOiAyMHB4O1xuICAgICAgICBib3JkZXI6IDFweCBzb2xpZCB2YXIoLS1nLWNvbG9yLWxpbmUtZ2VuZXJpYyk7XG4gICAgfVxuXG4gICAgJl9fdGl0bGUge1xuICAgICAgICBmb250LXdlaWdodDogNzAwO1xuICAgIH1cblxuICAgICYgPiBwIHtcbiAgICAgICAgbWFyZ2luOiAwIDAgMTBweDtcblxuICAgICAgICAmOmZpcnN0LWNoaWxkIHtcbiAgICAgICAgICAgICY6OmJlZm9yZSB7XG4gICAgICAgICAgICAgICAgYm94LXNpemluZzogY29udGVudC1ib3g7XG4gICAgICAgICAgICAgICAgZGlzcGxheTogYmxvY2s7XG4gICAgICAgICAgICAgICAgd2lkdGg6IDI0cHg7XG4gICAgICAgICAgICAgICAgaGVpZ2h0OiAyNHB4O1xuICAgICAgICAgICAgICAgIG1hcmdpbi10b3A6IC0ycHg7XG4gICAgICAgICAgICAgICAgbWFyZ2luLWxlZnQ6IC00NHB4O1xuICAgICAgICAgICAgICAgIHBhZGRpbmctcmlnaHQ6IDIwcHg7XG4gICAgICAgICAgICAgICAgZmxvYXQ6IGxlZnQ7XG4gICAgICAgICAgICB9XG4gICAgICAgIH1cblxuICAgICAgICAmOmxhc3QtY2hpbGQge1xuICAgICAgICAgICAgbWFyZ2luLWJvdHRvbTogMDtcbiAgICAgICAgfVxuICAgIH1cblxuICAgICRjb2xvcnM6IChcbiAgICAgICAgZGMtYWNjZW50LWluZm86ICRpbmZvQ29sb3IsXG4gICAgICAgIGRjLWFjY2VudC10aXA6ICR0aXBDb2xvcixcbiAgICAgICAgZGMtYWNjZW50LWFsZXJ0OiAkaW1wb3J0YW50Q29sb3IsXG4gICAgICAgIGRjLWFjY2VudC13YXJuaW5nOiAkd2FybmluZ0NvbG9yLFxuICAgICk7XG5cbiAgICBAZWFjaCAkdHlwZSwgJGNvbG9yIGluICRjb2xvcnMge1xuICAgICAgICAmLiN7JHR5cGV9ID4gcDpmaXJzdC1jaGlsZDo6YmVmb3JlIHtcbiAgICAgICAgICAgICRyOiBjb2xvci5jaGFubmVsKCRjb2xvciwgJ3JlZCcpO1xuICAgICAgICAgICAgJGc6IGNvbG9yLmNoYW5uZWwoJGNvbG9yLCAnZ3JlZW4nKTtcbiAgICAgICAgICAgICRiOiBjb2xvci5jaGFubmVsKCRjb2xvciwgJ2JsdWUnKTtcbiAgICAgICAgICAgICRyZ2JDb2xvcjogJ3JnYignICsgJHIgKyAnLCcgKyAkZyArICcsJyArICRiICsgJyknO1xuICAgICAgICAgICAgY29udGVudDogdXJsKCdkYXRhOmltYWdlL3N2Zyt4bWwsJTNDc3ZnIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIiB3aWR0aD1cIjI0XCIgaGVpZ2h0PVwiMjRcIiB2aWV3Qm94PVwiMCAwIDE2IDE2XCIlM0UlM0NjaXJjbGUgY3g9XCI4XCIgY3k9XCI4XCIgcj1cIjhcIiBmaWxsPVwiJyArICRyZ2JDb2xvciArICdcIi8lM0UlM0NyZWN0IHdpZHRoPVwiMVwiIGhlaWdodD1cIjVcIiB4PVwiNy41XCIgeT1cIjYuNVwiIHN0cm9rZT1cIiUyM2ZmZlwiIHJ4PVwiLjVcIi8lM0UlM0NjaXJjbGUgY3g9XCI4XCIgY3k9XCI0XCIgcj1cIjFcIiBmaWxsPVwiJTIzZmZmXCIvJTNFJTNDL3N2ZyUzRScpO1xuICAgICAgICB9XG4gICAgfVxuXG4gICAgJGJhY2tncm91bmRDb2xvcnM6IChcbiAgICAgICAgZGMtYWNjZW50LWluZm86ICRpbmZvQmFja2dyb3VuZENvbG9yLFxuICAgICAgICBkYy1hY2NlbnQtdGlwOiAkdGlwQmFja2dyb3VuZENvbG9yLFxuICAgICAgICBkYy1hY2NlbnQtYWxlcnQ6ICRpbXBvcnRhbnRCYWNrZ3JvdW5kQ29sb3IsXG4gICAgICAgIGRjLWFjY2VudC13YXJuaW5nOiAkd2FybmluZ0JhY2tncm91bmRDb2xvcixcbiAgICApO1xuXG4gICAgQGVhY2ggJHR5cGUsICRjb2xvciBpbiAkYmFja2dyb3VuZENvbG9ycyB7XG4gICAgICAgICYuI3skdHlwZX0ge1xuICAgICAgICAgICAgYmFja2dyb3VuZDogJGNvbG9yO1xuICAgICAgICB9XG4gICAgfVxufVxuXG4ucGMtcGFnZS1jb25zdHJ1Y3Rvcl9fZG9jcyxcbi5mdWxsc2NyZWVuLW1vZGUge1xuICAgIC5kYy1ub3RlX193cmFwcGVyIHtcbiAgICAgICAgbWFyZ2luOiAwcHggMHB4IDIwcHg7XG4gICAgfVxufVxuIl19 */"],
   "mappings": ";AAeA,CAAA;AACI,YAAA;AACA,WAAA,KAAA,KAAA,KAAA;AACA,iBAAA;ACdJ;ADgBI,CAAA;AACI,UAAA,KAAA;ACdR;ADiBI,CAAA;AACI,YAAA;AACA,OAAA;AACA,SAAA;ACfR;ADkBI,CAAA;AACI,WAAA;AACA,UAAA,IAAA,MAAA,IAAA;AChBR;ADmBI,CAAA;AACI,eAAA;ACjBR;ADoBI,CAxBJ,QAwBI,EAAA;AACI,UAAA,EAAA,EAAA;AClBR;ADqBY,CA5BZ,QA4BY,EAAA,CAAA,YAAA;AACI,cAAA;AACA,WAAA;AACA,SAAA;AACA,UAAA;AACA,cAAA;AACA,eAAA;AACA,iBAAA;AACA,SAAA;ACnBhB;ADuBQ,CAxCR,QAwCQ,EAAA,CAAA;AACI,iBAAA;ACrBZ;ADiCQ,CArDR,OAqDQ,CAAA,eAAA,EAAA,CAAA,YAAA;AAKI,WAAA;ACnCZ;AD8BQ,CArDR,OAqDQ,CAAA,cAAA,EAAA,CAAA,YAAA;AAKI,WAAA;AChCZ;AD2BQ,CArDR,OAqDQ,CAAA,gBAAA,EAAA,CAAA,YAAA;AAKI,WAAA;AC7BZ;ADwBQ,CArDR,OAqDQ,CAAA,kBAAA,EAAA,CAAA,YAAA;AAKI,WAAA;AC1BZ;ADsCQ,CAtER,OAsEQ,CAjBA;AAkBI,cAAA,KAAA,CAAA,EAAA,GAAA,EAAA,GAAA,EAAA;ACpCZ;ADmCQ,CAtER,OAsEQ,CAjBA;AAkBI,cAAA,KAAA,EAAA,EAAA,GAAA,EAAA,EAAA,EAAA;ACjCZ;ADgCQ,CAtER,OAsEQ,CAjBA;AAkBI,cAAA,KAAA,GAAA,EAAA,EAAA,EAAA,EAAA,EAAA;AC9BZ;AD6BQ,CAtER,OAsEQ,CAjBA;AAkBI,cAAA,KAAA,GAAA,EAAA,GAAA,EAAA,CAAA,EAAA;AC3BZ;ADkCI,CAAA,0BAAA,CAzEA;kBAAA;AA0EI,UAAA,IAAA,IAAA;AC9BR;",
   "names": []

package/build/cjs/components/Notification/Notification.js

@@ -33,12 +33,13 @@ __export(Notification_exports, {
   default: () => Notification_default
 });
 module.exports = __toCommonJS(Notification_exports);
-var import_react = __toESM(require("react"));
+var import_react = require("react");
 var import_uikit = require("@gravity-ui/uikit");
 var import_icons = require("@gravity-ui/icons");
 var import_bem_cn_lite = __toESM(require("bem-cn-lite"));
 var import_HTML = require("../HTML");
 var import_Notification = require("./Notification.css");
+var import_jsx_runtime = require("react/jsx-runtime");
 var bNote = (0, import_bem_cn_lite.default)("dc-note");
 var Notification = ({ notification, notificationCb }) => {
   const [showNotification, setShowNotification] = (0, import_react.useState)(true);
@@ -47,21 +48,25 @@ var Notification = ({ notification, notificationCb }) => {
   }
   const { title = "", content = "", type = "", permanent } = notification;
   const isNoteTypeCorrect = ["info", "tip", "warning", "alert"].includes(type.toLowerCase());
-  return /* @__PURE__ */ import_react.default.createElement("div", { className: bNote("wrapper") }, /* @__PURE__ */ import_react.default.createElement("div", { className: bNote({}, isNoteTypeCorrect ? `dc-accent-${type}` : bNote("template")) }, title && /* @__PURE__ */ import_react.default.createElement("p", { className: bNote("title") }, title), !permanent && /* @__PURE__ */ import_react.default.createElement(
-    import_uikit.Button,
-    {
-      view: "flat",
-      className: bNote("xmark"),
-      style: { position: "absolute" },
-      onClick: () => {
-        if (notificationCb) {
-          notificationCb();
-        }
-        setShowNotification(false);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: bNote("wrapper"), children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: bNote({}, isNoteTypeCorrect ? `dc-accent-${type}` : bNote("template")), children: [
+    title && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: bNote("title"), children: title }),
+    !permanent && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_uikit.Button,
+      {
+        view: "flat",
+        className: bNote("xmark"),
+        style: { position: "absolute" },
+        onClick: () => {
+          if (notificationCb) {
+            notificationCb();
+          }
+          setShowNotification(false);
+        },
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_uikit.Icon, { data: import_icons.Xmark })
       }
-    },
-    /* @__PURE__ */ import_react.default.createElement(import_uikit.Icon, { data: import_icons.Xmark })
-  ), content && /* @__PURE__ */ import_react.default.createElement(import_HTML.HTML, { className: bNote("content") }, content)));
+    ),
+    content && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_HTML.HTML, { className: bNote("content"), children: content })
+  ] }) });
 };
 var Notification_default = Notification;
 //# sourceMappingURL=Notification.js.map