@skbkontur/react-ui 5.6.1-85c65.0 → 5.6.1-e2bc4.0

package/components/Select/Select.styles.js

@@ -0,0 +1,57 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { memoizeGetStyles } from '../../lib/theming/Emotion.js';
+export var getStyles = memoizeGetStyles(function (_a) {
+    var css = _a.css;
+    return ({
+        root: function () {
+            return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      display: inline-block;\n      position: relative;\n      line-height: normal;\n    "], ["\n      display: inline-block;\n      position: relative;\n      line-height: normal;\n    "])));
+        },
+        rootMobile: function (t) {
+            return css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n      width: ", ";\n      max-width: ", ";\n    "], ["\n      width: ", ";\n      max-width: ", ";\n    "])), t.selectRootWidthMobile, t.mobileSelectMaxWidth);
+        },
+        placeholder: function (t) {
+            return css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n      color: ", ";\n      text-overflow: ellipsis;\n    "], ["\n      color: ", ";\n      text-overflow: ellipsis;\n    "])), t.selectPlaceholderColor);
+        },
+        placeholderDisabled: function (t) {
+            return css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n      color: ", ";\n    "], ["\n      color: ", ";\n    "])), t.selectPlaceholderColorDisabled);
+        },
+        customUsePlaceholder: function () {
+            return css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n      color: inherit;\n      opacity: 0.7;\n    "], ["\n      color: inherit;\n      opacity: 0.7;\n    "])));
+        },
+        arrowWrap: function (t) {
+            return css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n      color: ", ";\n      flex-shrink: 0;\n    "], ["\n      color: ", ";\n      flex-shrink: 0;\n    "])), t.selectMenuArrowColor);
+        },
+        arrowDisabled: function (t) {
+            return css(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n      color: ", ";\n    "], ["\n      color: ", ";\n    "])), t.selectMenuArrowColorDisabled);
+        },
+        customUseArrow: function () {
+            return css(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n      color: inherit;\n      opacity: 0.7;\n    "], ["\n      color: inherit;\n      opacity: 0.7;\n    "])));
+        },
+        label: function () {
+            return css(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n      flex: 1 1 auto;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      overflow: hidden;\n    "], ["\n      flex: 1 1 auto;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      overflow: hidden;\n    "])));
+        },
+        search: function () {
+            return css(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n      margin: 1px 4px 4px;\n    "], ["\n      margin: 1px 4px 4px;\n    "])));
+        },
+        leftIconSmall: function (t) {
+            return css(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n      margin-right: ", ";\n      width: ", ";\n    "], ["\n      margin-right: ", ";\n      width: ", ";\n    "])), t.selectIconGapSmall, t.btnIconSizeSmall);
+        },
+        leftIconMedium: function (t) {
+            return css(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n      margin-right: ", ";\n      width: ", ";\n    "], ["\n      margin-right: ", ";\n      width: ", ";\n    "])), t.selectIconGapMedium, t.btnIconSizeMedium);
+        },
+        leftIconLarge: function (t) {
+            return css(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n      margin-right: ", ";\n      width: ", ";\n    "], ["\n      margin-right: ", ";\n      width: ", ";\n    "])), t.selectIconGapLarge, t.btnIconSizeLarge);
+        },
+        leftIconLink: function (t) {
+            return css(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n      margin-right: ", ";\n    "], ["\n      margin-right: ", ";\n    "])), t.btnLinkIconMarginRight);
+        },
+        selectButtonContainer: function () {
+            return css(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n      width: 100%;\n      display: inline-flex;\n      justify-content: space-between;\n    "], ["\n      width: 100%;\n      display: inline-flex;\n      justify-content: space-between;\n    "])));
+        },
+    });
+});
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15;
+//# sourceMappingURL=Select.styles.js.map

package/components/Select/Select.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.styles.js","sourceRoot":"","sources":["../../../components/Select/Select.styles.ts"],"names":[],"mappings":";;;;AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAGhE,MAAM,CAAC,IAAM,SAAS,GAAG,gBAAgB,CAAC,UAAC,EAAgB;QAAd,GAAG,SAAA;IAAgB,OAAA,CAAC;QAC/D,IAAI;YACF,OAAO,GAAG,gKAAA,6FAIT,KAAC;QACJ,CAAC;QAED,UAAU,YAAC,CAAQ;YACjB,OAAO,GAAG,uHAAA,iBACC,EAAuB,sBACnB,EAAsB,SACpC,KAFU,CAAC,CAAC,qBAAqB,EACnB,CAAC,CAAC,oBAAoB,EACnC;QACJ,CAAC;QAED,WAAW,YAAC,CAAQ;YAClB,OAAO,GAAG,+HAAA,iBACC,EAAwB,yCAElC,KAFU,CAAC,CAAC,sBAAsB,EAEjC;QACJ,CAAC;QAED,mBAAmB,YAAC,CAAQ;YAC1B,OAAO,GAAG,+FAAA,iBACC,EAAgC,SAC1C,KADU,CAAC,CAAC,8BAA8B,EACzC;QACJ,CAAC;QAED,oBAAoB;YAClB,OAAO,GAAG,uHAAA,oDAGT,KAAC;QACJ,CAAC;QAED,SAAS,YAAC,CAAQ;YAChB,OAAO,GAAG,sHAAA,iBACC,EAAsB,gCAEhC,KAFU,CAAC,CAAC,oBAAoB,EAE/B;QACJ,CAAC;QAED,aAAa,YAAC,CAAQ;YACpB,OAAO,GAAG,+FAAA,iBACC,EAA8B,SACxC,KADU,CAAC,CAAC,4BAA4B,EACvC;QACJ,CAAC;QAED,cAAc;YACZ,OAAO,GAAG,uHAAA,oDAGT,KAAC;QACJ,CAAC;QAED,KAAK;YACH,OAAO,GAAG,uLAAA,oHAKT,KAAC;QACJ,CAAC;QAED,MAAM;YACJ,OAAO,GAAG,yGAAA,oCAET,KAAC;QACJ,CAAC;QAED,aAAa,YAAC,CAAQ;YACpB,OAAO,GAAG,4HAAA,wBACQ,EAAoB,kBAC3B,EAAkB,SAC5B,KAFiB,CAAC,CAAC,kBAAkB,EAC3B,CAAC,CAAC,gBAAgB,EAC3B;QACJ,CAAC;QAED,cAAc,YAAC,CAAQ;YACrB,OAAO,GAAG,4HAAA,wBACQ,EAAqB,kBAC5B,EAAmB,SAC7B,KAFiB,CAAC,CAAC,mBAAmB,EAC5B,CAAC,CAAC,iBAAiB,EAC5B;QACJ,CAAC;QAED,aAAa,YAAC,CAAQ;YACpB,OAAO,GAAG,4HAAA,wBACQ,EAAoB,kBAC3B,EAAkB,SAC5B,KAFiB,CAAC,CAAC,kBAAkB,EAC3B,CAAC,CAAC,gBAAgB,EAC3B;QACJ,CAAC;QAED,YAAY,YAAC,CAAQ;YACnB,OAAO,GAAG,wGAAA,wBACQ,EAAwB,SACzC,KADiB,CAAC,CAAC,sBAAsB,EACxC;QACJ,CAAC;QAED,qBAAqB;YACnB,OAAO,GAAG,qKAAA,gGAIT,KAAC;QACJ,CAAC;KACF,CAAC;AAzG8D,CAyG9D,CAAC,CAAC","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeGetStyles } from '../../lib/theming/Emotion.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\n\nexport const getStyles = memoizeGetStyles(({ css }: Emotion) => ({\n  root() {\n    return css`\n      display: inline-block;\n      position: relative;\n      line-height: normal;\n    `;\n  },\n\n  rootMobile(t: Theme) {\n    return css`\n      width: ${t.selectRootWidthMobile};\n      max-width: ${t.mobileSelectMaxWidth};\n    `;\n  },\n\n  placeholder(t: Theme) {\n    return css`\n      color: ${t.selectPlaceholderColor};\n      text-overflow: ellipsis;\n    `;\n  },\n\n  placeholderDisabled(t: Theme) {\n    return css`\n      color: ${t.selectPlaceholderColorDisabled};\n    `;\n  },\n\n  customUsePlaceholder() {\n    return css`\n      color: inherit;\n      opacity: 0.7;\n    `;\n  },\n\n  arrowWrap(t: Theme) {\n    return css`\n      color: ${t.selectMenuArrowColor};\n      flex-shrink: 0;\n    `;\n  },\n\n  arrowDisabled(t: Theme) {\n    return css`\n      color: ${t.selectMenuArrowColorDisabled};\n    `;\n  },\n\n  customUseArrow() {\n    return css`\n      color: inherit;\n      opacity: 0.7;\n    `;\n  },\n\n  label() {\n    return css`\n      flex: 1 1 auto;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      overflow: hidden;\n    `;\n  },\n\n  search() {\n    return css`\n      margin: 1px 4px 4px;\n    `;\n  },\n\n  leftIconSmall(t: Theme) {\n    return css`\n      margin-right: ${t.selectIconGapSmall};\n      width: ${t.btnIconSizeSmall};\n    `;\n  },\n\n  leftIconMedium(t: Theme) {\n    return css`\n      margin-right: ${t.selectIconGapMedium};\n      width: ${t.btnIconSizeMedium};\n    `;\n  },\n\n  leftIconLarge(t: Theme) {\n    return css`\n      margin-right: ${t.selectIconGapLarge};\n      width: ${t.btnIconSizeLarge};\n    `;\n  },\n\n  leftIconLink(t: Theme) {\n    return css`\n      margin-right: ${t.btnLinkIconMarginRight};\n    `;\n  },\n\n  selectButtonContainer() {\n    return css`\n      width: 100%;\n      display: inline-flex;\n      justify-content: space-between;\n    `;\n  },\n}));\n"]}

package/components/Select/index.d.ts

@@ -1 +1 @@
-export * from './Select';
+export * from './Select.js';

package/components/Select/index.js

@@ -0,0 +1,2 @@
+export * from './Select.js';
+//# sourceMappingURL=index.js.map

package/components/Select/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../components/Select/index.tsx"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC","sourcesContent":["export * from './Select.js';\n"]}

package/components/Select/locale/index.d.ts

@@ -1,4 +1,4 @@
-import { LocaleHelper } from '../../../lib/locale/LocaleHelper';
-import type { SelectLocale } from './types';
-export * from './types';
+import { LocaleHelper } from '../../../lib/locale/LocaleHelper.js';
+import type { SelectLocale } from './types.js';
+export * from './types.js';
 export declare const SelectLocaleHelper: LocaleHelper<SelectLocale>;

package/components/Select/locale/index.js

@@ -0,0 +1,9 @@
+import { LocaleHelper } from '../../../lib/locale/LocaleHelper.js';
+import { componentsLocales as en_GB } from './locales/en.js';
+import { componentsLocales as ru_RU } from './locales/ru.js';
+export * from './types.js';
+export var SelectLocaleHelper = new LocaleHelper({
+    ru_RU: ru_RU,
+    en_GB: en_GB,
+});
+//# sourceMappingURL=index.js.map

package/components/Select/locale/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../components/Select/locale/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,qCAAqC,CAAC;AAEnE,OAAO,EAAE,iBAAiB,IAAI,KAAK,EAAE,MAAM,iBAAiB,CAAC;AAC7D,OAAO,EAAE,iBAAiB,IAAI,KAAK,EAAE,MAAM,iBAAiB,CAAC;AAG7D,cAAc,YAAY,CAAC;AAE3B,MAAM,CAAC,IAAM,kBAAkB,GAAG,IAAI,YAAY,CAAe;IAC/D,KAAK,OAAA;IACL,KAAK,OAAA;CACN,CAAC,CAAC","sourcesContent":["import { LocaleHelper } from '../../../lib/locale/LocaleHelper.js';\n\nimport { componentsLocales as en_GB } from './locales/en.js';\nimport { componentsLocales as ru_RU } from './locales/ru.js';\nimport type { SelectLocale } from './types.js';\n\nexport * from './types.js';\n\nexport const SelectLocaleHelper = new LocaleHelper<SelectLocale>({\n  ru_RU,\n  en_GB,\n});\n"]}

package/components/Select/locale/locales/en.d.ts

@@ -1,2 +1,2 @@
-import type { SelectLocale } from '../types';
+import type { SelectLocale } from '../types.js';
 export declare const componentsLocales: SelectLocale;

package/components/Select/locale/locales/en.js

@@ -0,0 +1,4 @@
+export var componentsLocales = {
+    placeholder: 'Nothing selected',
+};
+//# sourceMappingURL=en.js.map

package/components/Select/locale/locales/en.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"en.js","sourceRoot":"","sources":["../../../../../components/Select/locale/locales/en.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,IAAM,iBAAiB,GAAiB;IAC7C,WAAW,EAAE,kBAAkB;CAChC,CAAC","sourcesContent":["import type { SelectLocale } from '../types.js';\n\nexport const componentsLocales: SelectLocale = {\n  placeholder: 'Nothing selected',\n};\n"]}

package/components/Select/locale/locales/ru.d.ts

@@ -1,2 +1,2 @@
-import type { SelectLocale } from '../types';
+import type { SelectLocale } from '../types.js';
 export declare const componentsLocales: SelectLocale;

package/components/Select/locale/locales/ru.js

@@ -0,0 +1,4 @@
+export var componentsLocales = {
+    placeholder: 'Ничего не выбрано',
+};
+//# sourceMappingURL=ru.js.map

package/components/Select/locale/locales/ru.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ru.js","sourceRoot":"","sources":["../../../../../components/Select/locale/locales/ru.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,IAAM,iBAAiB,GAAiB;IAC7C,WAAW,EAAE,mBAAmB;CACjC,CAAC","sourcesContent":["import type { SelectLocale } from '../types.js';\n\nexport const componentsLocales: SelectLocale = {\n  placeholder: 'Ничего не выбрано',\n};\n"]}

package/components/Select/locale/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/components/Select/locale/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../components/Select/locale/types.ts"],"names":[],"mappings":"","sourcesContent":["import type React from 'react';\n\nexport interface SelectLocale {\n  placeholder: React.ReactNode;\n}\n"]}

package/components/Select/selectTheme.d.ts

@@ -1,3 +1,3 @@
-import type { Theme } from '../../lib/theming/Theme';
-import type { SelectProps } from './Select';
+import type { Theme } from '../../lib/theming/Theme.js';
+import type { SelectProps } from './Select.js';
 export declare const getSelectTheme: (theme: Theme, props: SelectProps<any, any>) => Theme;

package/components/Select/selectTheme.js

@@ -0,0 +1,37 @@
+import { ThemeFactory } from '../../lib/theming/ThemeFactory.js';
+export var getSelectTheme = function (theme, props) {
+    var baseTheme = ThemeFactory.create({
+        btnDefaultBg: theme.selectDefaultBg,
+        btnBorderWidth: theme.selectBorderWidth,
+        btnOutlineWidth: theme.selectOutlineWidth,
+        btnLineHeightSmall: theme.selectLineHeightSmall,
+        btnFontSizeSmall: theme.selectFontSizeSmall,
+        btnPaddingXSmall: props._icon ? theme.btnPaddingXSmall : theme.selectPaddingXSmall,
+        btnPaddingYSmall: theme.selectPaddingYSmall,
+        btnIconSizeSmall: theme.selectIconSizeSmall,
+        btnBorderRadiusSmall: theme.selectBorderRadiusSmall,
+        btnLinkHoverTextDecoration: 'none',
+        btnLineHeightMedium: theme.selectLineHeightMedium,
+        btnFontSizeMedium: theme.selectFontSizeMedium,
+        btnPaddingXMedium: props._icon ? theme.btnPaddingXMedium : theme.selectPaddingXMedium,
+        btnPaddingYMedium: theme.selectPaddingYMedium,
+        btnIconSizeMedium: theme.selectIconSizeMedium,
+        btnBorderRadiusMedium: theme.selectBorderRadiusMedium,
+        btnLineHeightLarge: theme.selectLineHeightLarge,
+        btnFontSizeLarge: theme.selectFontSizeLarge,
+        btnPaddingXLarge: props._icon ? theme.btnPaddingXLarge : theme.selectPaddingXLarge,
+        btnPaddingYLarge: theme.selectPaddingYLarge,
+        btnIconSizeLarge: theme.selectIconSizeLarge,
+        btnBorderRadiusLarge: theme.selectBorderRadiusLarge,
+        btnDisabledBg: theme.selectBgDisabled,
+        btnDisabledBorderColor: theme.selectBorderColorDisabled,
+        btnDisabledTextColor: theme.selectTextColorDisabled,
+        btnDefaultHoverBorderColor: theme.selectBorderColorHover,
+        btnBorderColorTransition: theme.selectBorderColorTransition,
+    }, theme);
+    if (props.theme) {
+        return ThemeFactory.create(props.theme, baseTheme);
+    }
+    return baseTheme;
+};
+//# sourceMappingURL=selectTheme.js.map

package/components/Select/selectTheme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"selectTheme.js","sourceRoot":"","sources":["../../../components/Select/selectTheme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AAKjE,MAAM,CAAC,IAAM,cAAc,GAAG,UAAC,KAAY,EAAE,KAA4B;IACvE,IAAM,SAAS,GAAG,YAAY,CAAC,MAAM,CACnC;QACE,YAAY,EAAE,KAAK,CAAC,eAAe;QAEnC,cAAc,EAAE,KAAK,CAAC,iBAAiB;QACvC,eAAe,EAAE,KAAK,CAAC,kBAAkB;QAEzC,kBAAkB,EAAE,KAAK,CAAC,qBAAqB;QAC/C,gBAAgB,EAAE,KAAK,CAAC,mBAAmB;QAC3C,gBAAgB,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,KAAK,CAAC,mBAAmB;QAClF,gBAAgB,EAAE,KAAK,CAAC,mBAAmB;QAC3C,gBAAgB,EAAE,KAAK,CAAC,mBAAmB;QAC3C,oBAAoB,EAAE,KAAK,CAAC,uBAAuB;QAEnD,0BAA0B,EAAE,MAAM;QAElC,mBAAmB,EAAE,KAAK,CAAC,sBAAsB;QACjD,iBAAiB,EAAE,KAAK,CAAC,oBAAoB;QAC7C,iBAAiB,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,iBAAiB,CAAC,CAAC,CAAC,KAAK,CAAC,oBAAoB;QACrF,iBAAiB,EAAE,KAAK,CAAC,oBAAoB;QAC7C,iBAAiB,EAAE,KAAK,CAAC,oBAAoB;QAC7C,qBAAqB,EAAE,KAAK,CAAC,wBAAwB;QAErD,kBAAkB,EAAE,KAAK,CAAC,qBAAqB;QAC/C,gBAAgB,EAAE,KAAK,CAAC,mBAAmB;QAC3C,gBAAgB,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,KAAK,CAAC,mBAAmB;QAClF,gBAAgB,EAAE,KAAK,CAAC,mBAAmB;QAC3C,gBAAgB,EAAE,KAAK,CAAC,mBAAmB;QAC3C,oBAAoB,EAAE,KAAK,CAAC,uBAAuB;QAEnD,aAAa,EAAE,KAAK,CAAC,gBAAgB;QACrC,sBAAsB,EAAE,KAAK,CAAC,yBAAyB;QACvD,oBAAoB,EAAE,KAAK,CAAC,uBAAuB;QAEnD,0BAA0B,EAAE,KAAK,CAAC,sBAAsB;QACxD,wBAAwB,EAAE,KAAK,CAAC,2BAA2B;KAC5D,EACD,KAAK,CACN,CAAC;IAEF,IAAI,KAAK,CAAC,KAAK,EAAE,CAAC;QAChB,OAAO,YAAY,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;IACrD,CAAC;IAED,OAAO,SAAS,CAAC;AACnB,CAAC,CAAC","sourcesContent":["import { ThemeFactory } from '../../lib/theming/ThemeFactory.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\n\nimport type { SelectProps } from './Select.js';\n\nexport const getSelectTheme = (theme: Theme, props: SelectProps<any, any>): Theme => {\n  const baseTheme = ThemeFactory.create(\n    {\n      btnDefaultBg: theme.selectDefaultBg,\n\n      btnBorderWidth: theme.selectBorderWidth,\n      btnOutlineWidth: theme.selectOutlineWidth,\n\n      btnLineHeightSmall: theme.selectLineHeightSmall,\n      btnFontSizeSmall: theme.selectFontSizeSmall,\n      btnPaddingXSmall: props._icon ? theme.btnPaddingXSmall : theme.selectPaddingXSmall,\n      btnPaddingYSmall: theme.selectPaddingYSmall,\n      btnIconSizeSmall: theme.selectIconSizeSmall,\n      btnBorderRadiusSmall: theme.selectBorderRadiusSmall,\n\n      btnLinkHoverTextDecoration: 'none',\n\n      btnLineHeightMedium: theme.selectLineHeightMedium,\n      btnFontSizeMedium: theme.selectFontSizeMedium,\n      btnPaddingXMedium: props._icon ? theme.btnPaddingXMedium : theme.selectPaddingXMedium,\n      btnPaddingYMedium: theme.selectPaddingYMedium,\n      btnIconSizeMedium: theme.selectIconSizeMedium,\n      btnBorderRadiusMedium: theme.selectBorderRadiusMedium,\n\n      btnLineHeightLarge: theme.selectLineHeightLarge,\n      btnFontSizeLarge: theme.selectFontSizeLarge,\n      btnPaddingXLarge: props._icon ? theme.btnPaddingXLarge : theme.selectPaddingXLarge,\n      btnPaddingYLarge: theme.selectPaddingYLarge,\n      btnIconSizeLarge: theme.selectIconSizeLarge,\n      btnBorderRadiusLarge: theme.selectBorderRadiusLarge,\n\n      btnDisabledBg: theme.selectBgDisabled,\n      btnDisabledBorderColor: theme.selectBorderColorDisabled,\n      btnDisabledTextColor: theme.selectTextColorDisabled,\n\n      btnDefaultHoverBorderColor: theme.selectBorderColorHover,\n      btnBorderColorTransition: theme.selectBorderColorTransition,\n    },\n    theme,\n  );\n\n  if (props.theme) {\n    return ThemeFactory.create(props.theme, baseTheme);\n  }\n\n  return baseTheme;\n};\n"]}

package/components/Select/tids.js

@@ -0,0 +1,6 @@
+export var SelectDataTids = {
+    root: 'Select__root',
+    menu: 'Select__menu',
+    label: 'Select__label',
+};
+//# sourceMappingURL=tids.js.map

package/components/Select/tids.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tids.js","sourceRoot":"","sources":["../../../components/Select/tids.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,IAAM,cAAc,GAAG;IAC5B,IAAI,EAAE,cAAc;IACpB,IAAI,EAAE,cAAc;IACpB,KAAK,EAAE,eAAe;CACd,CAAC","sourcesContent":["export const SelectDataTids = {\n  root: 'Select__root',\n  menu: 'Select__menu',\n  label: 'Select__label',\n} as const;\n"]}

package/components/SidePage/SidePage.d.ts

@@ -1,11 +1,11 @@
 import type { AriaAttributes, HTMLAttributes, JSX } from 'react';
 import React from 'react';
-import type { CommonProps } from '../../internal/CommonWrapper';
-import type { TGetRootNode } from '../../lib/rootNode';
-import { SidePageBody } from './SidePageBody';
-import { SidePageContainer } from './SidePageContainer';
-import { SidePageFooter } from './SidePageFooter';
-import { SidePageHeader } from './SidePageHeader';
+import type { CommonProps } from '../../internal/CommonWrapper/index.js';
+import type { TGetRootNode } from '../../lib/rootNode/index.js';
+import { SidePageBody } from './SidePageBody.js';
+import { SidePageContainer } from './SidePageContainer.js';
+import { SidePageFooter } from './SidePageFooter.js';
+import { SidePageHeader } from './SidePageHeader.js';
 export interface SidePageProps extends CommonProps, Pick<HTMLAttributes<unknown>, 'role'>, Pick<AriaAttributes, 'aria-label'> {
     /** Добавляет блокирующий фон, когда сайдпейдж открыт. */
     blockBackground?: boolean;

package/components/SidePage/SidePage.js

@@ -0,0 +1,306 @@
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import React from 'react';
+import { CSSTransition } from 'react-transition-group';
+import FocusLock from 'react-focus-lock';
+import { isNonNullable, isReactUIInstance } from '../../lib/utils.js';
+import { isKeyEscape } from '../../lib/events/keyboard/identifiers.js';
+import * as LayoutEvents from '../../lib/LayoutEvents.js';
+import { HideBodyVerticalScroll } from '../../internal/HideBodyVerticalScroll/index.js';
+import { ModalStack } from '../../lib/ModalStack.js';
+import { RenderContainer } from '../../internal/RenderContainer/index.js';
+import { RenderLayer } from '../../internal/RenderLayer/index.js';
+import { ZIndex } from '../../internal/ZIndex/index.js';
+import { ThemeContext } from '../../lib/theming/ThemeContext.js';
+import { CommonWrapper } from '../../internal/CommonWrapper/index.js';
+import { isTestEnv } from '../../lib/currentEnvironment.js';
+import { ResponsiveLayout } from '../ResponsiveLayout/index.js';
+import { createPropsGetter } from '../../lib/createPropsGetter.js';
+import { isInstanceOf } from '../../lib/isInstanceOf.js';
+import { rootNode } from '../../lib/rootNode/index.js';
+import { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';
+import { SidePageBody } from './SidePageBody.js';
+import { SidePageContainer } from './SidePageContainer.js';
+import { SidePageContext } from './SidePageContext.js';
+import { SidePageFooter } from './SidePageFooter.js';
+import { SidePageHeader } from './SidePageHeader.js';
+import { getStyles } from './SidePage.styles.js';
+export var SidePageDataTids = {
+    root: 'SidePage__root',
+    container: 'SidePage__container',
+};
+var TRANSITION_TIMEOUT = 200;
+/**
+ * `SidePage` — это модальное окно, которое открывается поверх основной страницы и занимает всю высоту окна браузера.
+ *
+ * Используйте его, когда нужно сохранить контекст и показать большое количество данных.
+ *
+ * Содержит в себе три компоненты: `SidePage.Header`, `SidePage.Body` и `SidePage.Footer`.
+ *
+ * Для отображения серой плашки в футере в компонент `Footer` необходимо передать пропс `panel`.
+ */
+var SidePage = /** @class */ (function (_super) {
+    __extends(SidePage, _super);
+    function SidePage() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.state = {
+            hasHeader: false,
+            hasFooter: false,
+            hasPanel: false,
+        };
+        _this.stackSubscription = null;
+        _this.layout = null;
+        _this.header = null;
+        _this.footer = null;
+        _this.rootRef = React.createRef();
+        /**
+         * Обновляет разметку компонента.
+         * @public
+         */
+        _this.updateLayout = function () {
+            var _a, _b;
+            (_a = _this.header) === null || _a === void 0 ? void 0 : _a.update();
+            (_b = _this.footer) === null || _b === void 0 ? void 0 : _b.update();
+        };
+        _this.getProps = createPropsGetter(SidePage_1.defaultProps);
+        _this.getSidePageContextProps = function () {
+            return {
+                hasHeader: _this.state.hasHeader,
+                hasFooter: _this.state.hasFooter,
+                hasPanel: _this.state.hasPanel,
+                requestClose: _this.requestClose,
+                getWidth: _this.getWidth,
+                updateLayout: _this.updateLayout,
+                headerRef: _this.headerRef,
+                footerRef: _this.footerRef,
+                setHasHeader: _this.setHasHeader,
+                setHasFooter: _this.setHasFooter,
+                setHasPanel: _this.setHasPanel,
+            };
+        };
+        _this.getWidth = function () {
+            if (!_this.layout) {
+                return 'auto';
+            }
+            return _this.layout.clientWidth;
+        };
+        _this.handleStackChange = function (stack) {
+            var sidePages = stack.filter(function (x) { return isReactUIInstance(x, 'SidePage') && x.props.fromLeft === _this.props.fromLeft; });
+            var currentSidePagePosition = sidePages.indexOf(_this);
+            var hasMargin = sidePages.length > 1 && currentSidePagePosition === sidePages.length - 1;
+            var hasShadow = sidePages.length < 3 || currentSidePagePosition > sidePages.length - 3;
+            var hasBackground = ModalStack.isBlocking(_this, _this.globalObject);
+            _this.setState({
+                stackPosition: stack.indexOf(_this),
+                hasMargin: hasMargin,
+                hasShadow: hasShadow,
+                hasBackground: hasBackground,
+            });
+        };
+        _this.handleClickOutside = function (e) {
+            if (_this.state.stackPosition === 0 && !_this.props.ignoreBackgroundClick) {
+                // ignore mousedown on window scrollbar
+                if (isInstanceOf(e, _this.globalObject.MouseEvent) &&
+                    _this.globalObject.document &&
+                    e.clientX > _this.globalObject.document.documentElement.clientWidth) {
+                    return;
+                }
+                _this.requestClose();
+            }
+        };
+        _this.handleKeyDown = function (e) {
+            if (_this.state.stackPosition !== 0) {
+                return;
+            }
+            if (isKeyEscape(e)) {
+                e.stopPropagation();
+                _this.requestClose();
+            }
+        };
+        _this.requestClose = function () {
+            if (_this.props.disableClose) {
+                return;
+            }
+            if (_this.props.onClose) {
+                _this.props.onClose();
+            }
+        };
+        _this.headerRef = function (ref) {
+            _this.header = ref;
+        };
+        _this.footerRef = function (ref) {
+            _this.footer = ref;
+        };
+        _this.layoutRef = function (ref) {
+            _this.layout = ref;
+        };
+        _this.setHasHeader = function (hasHeader) {
+            if (hasHeader === void 0) { hasHeader = true; }
+            _this.state.hasHeader !== hasHeader && _this.setState({ hasHeader: hasHeader });
+        };
+        _this.setHasFooter = function (hasFooter) {
+            if (hasFooter === void 0) { hasFooter = true; }
+            _this.state.hasFooter !== hasFooter && _this.setState({ hasFooter: hasFooter });
+        };
+        _this.setHasPanel = function (hasPanel) {
+            if (hasPanel === void 0) { hasPanel = false; }
+            _this.state.hasPanel !== hasPanel && _this.setState({ hasPanel: hasPanel });
+        };
+        return _this;
+    }
+    SidePage_1 = SidePage;
+    SidePage.prototype.componentDidMount = function () {
+        var _a, _b;
+        (_b = (_a = this.globalObject).addEventListener) === null || _b === void 0 ? void 0 : _b.call(_a, 'keydown', this.handleKeyDown);
+        this.stackSubscription = ModalStack.add(this, this.handleStackChange, this.globalObject);
+    };
+    SidePage.prototype.componentDidUpdate = function (prevProps) {
+        if (prevProps.blockBackground !== this.props.blockBackground) {
+            ModalStack.rerender(this.globalObject);
+            this.setState({
+                hasBackground: ModalStack.isBlocking(this, this.globalObject),
+            });
+        }
+    };
+    SidePage.prototype.componentWillUnmount = function () {
+        var _a, _b;
+        (_b = (_a = this.globalObject).removeEventListener) === null || _b === void 0 ? void 0 : _b.call(_a, 'keydown', this.handleKeyDown);
+        if (isNonNullable(this.stackSubscription)) {
+            this.stackSubscription.remove();
+        }
+        ModalStack.remove(this, this.globalObject);
+    };
+    SidePage.prototype.render = function () {
+        var _this = this;
+        this.styles = getStyles(this.emotion);
+        return (React.createElement(ThemeContext.Consumer, null, function (theme) {
+            _this.theme = theme;
+            return _this.renderMain();
+        }));
+    };
+    SidePage.prototype.renderMain = function () {
+        var _this = this;
+        var _a = this.props, blockBackground = _a.blockBackground, onOpened = _a.onOpened;
+        var disableAnimations = this.getProps().disableAnimations;
+        return (React.createElement(ResponsiveLayout, null, function (_a) {
+            var isMobile = _a.isMobile;
+            return (React.createElement(RenderContainer, null,
+                React.createElement(CommonWrapper, __assign({ rootNodeRef: _this.setRootNode }, _this.props),
+                    React.createElement(ZIndex, { priority: 'Sidepage', onScroll: LayoutEvents.emit, createStackingContext: true, style: { position: 'absolute' } },
+                        !isMobile && blockBackground && _this.renderShadow(),
+                        React.createElement(CSSTransition, { in: true, classNames: _this.getTransitionNames(), appear: !disableAnimations, enter: !disableAnimations, exit: false, timeout: {
+                                enter: TRANSITION_TIMEOUT,
+                                exit: TRANSITION_TIMEOUT,
+                            }, nodeRef: _this.rootRef, onEntered: onOpened }, _this.renderContainer(isMobile)),
+                        isMobile && React.createElement(HideBodyVerticalScroll, null)))));
+        }));
+    };
+    Object.defineProperty(SidePage.prototype, "isFocusLockDisabled", {
+        get: function () {
+            var disableFocusLock = this.getProps().disableFocusLock;
+            var blockBackground = this.props.blockBackground;
+            if (!blockBackground) {
+                return true;
+            }
+            if (disableFocusLock !== undefined) {
+                return disableFocusLock;
+            }
+            return false;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    SidePage.prototype.renderContainer = function (isMobile) {
+        var _a, _b;
+        var _c = this.props, mobileWidth = _c.mobileWidth, blockBackground = _c.blockBackground, fromLeft = _c.fromLeft, ariaLabel = _c["aria-label"];
+        var _d = this.getProps(), offset = _d.offset, role = _d.role;
+        var widthDesktop = this.props.width || (blockBackground ? 800 : 500);
+        var widthMobile = mobileWidth || '100%';
+        var width = isMobile ? widthMobile : widthDesktop;
+        return (React.createElement("div", { "aria-modal": true, role: role, "aria-label": ariaLabel, "data-tid": SidePageDataTids.root, className: this.cx((_a = {},
+                _a[this.styles.root()] = true,
+                _a)), ref: this.rootRef, onScroll: LayoutEvents.emit, style: {
+                width: width,
+                right: fromLeft ? 'auto' : offset,
+                left: fromLeft ? offset : 'auto',
+            } },
+            React.createElement(FocusLock, { disabled: this.isFocusLockDisabled, autoFocus: false, className: this.styles.focusLock() },
+                React.createElement(RenderLayer, { onClickOutside: this.handleClickOutside, active: true },
+                    React.createElement("div", { "data-tid": SidePageDataTids.container, className: this.cx(this.styles.wrapper(this.theme), (_b = {},
+                            _b[this.styles.wrapperLeft()] = fromLeft,
+                            _b[this.styles.wrapperMarginLeft()] = this.state.hasMargin && fromLeft,
+                            _b[this.styles.wrapperMarginRight()] = this.state.hasMargin && !fromLeft,
+                            _b[this.styles.shadow(this.theme)] = this.state.hasShadow,
+                            _b)), ref: this.layoutRef },
+                        React.createElement(SidePageContext.Provider, { value: this.getSidePageContextProps() }, this.props.children))))));
+    };
+    SidePage.prototype.renderShadow = function () {
+        var _a;
+        return (React.createElement("div", { className: this.styles.overlay(), onScroll: LayoutEvents.emit },
+            React.createElement(HideBodyVerticalScroll, { key: "hbvs" }),
+            React.createElement("div", { key: "overlay", className: this.cx((_a = {},
+                    _a[this.styles.background()] = true,
+                    _a[this.styles.backgroundGray(this.theme)] = this.state.hasBackground,
+                    _a)) })));
+    };
+    SidePage.prototype.getTransitionNames = function () {
+        var transition = this.props.fromLeft ? this.styles.transitionRight : this.styles.transitionLeft;
+        return {
+            enter: transition(),
+            enterActive: this.styles.transitionActive(),
+            exit: this.styles.transitionLeave(),
+            exitActive: this.styles.transitionLeaveActive(),
+            appear: transition(),
+            appearActive: this.styles.transitionActive(),
+        };
+    };
+    var SidePage_1;
+    SidePage.__KONTUR_REACT_UI__ = 'SidePage';
+    SidePage.displayName = 'SidePage';
+    SidePage.Header = SidePageHeader;
+    SidePage.Body = SidePageBody;
+    SidePage.Footer = SidePageFooter;
+    SidePage.Container = SidePageContainer;
+    SidePage.defaultProps = {
+        disableAnimations: isTestEnv,
+        offset: 0,
+        role: 'dialog',
+    };
+    SidePage = SidePage_1 = __decorate([
+        withRenderEnvironment,
+        rootNode
+    ], SidePage);
+    return SidePage;
+}(React.Component));
+export { SidePage };
+//# sourceMappingURL=SidePage.js.map

package/components/SidePage/SidePage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidePage.js","sourceRoot":"","sources":["../../../components/SidePage/SidePage.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { AriaAttributes, HTMLAttributes, JSX } from 'react';\nimport React from 'react';\nimport { CSSTransition } from 'react-transition-group';\nimport FocusLock from 'react-focus-lock';\nimport type { Emotion } from '@emotion/css/create-instance';\n\nimport type { GlobalObject } from '../../lib/globalObject.js';\nimport { isNonNullable, isReactUIInstance } from '../../lib/utils.js';\nimport { isKeyEscape } from '../../lib/events/keyboard/identifiers.js';\nimport * as LayoutEvents from '../../lib/LayoutEvents.js';\nimport { HideBodyVerticalScroll } from '../../internal/HideBodyVerticalScroll/index.js';\nimport type { ModalStackSubscription } from '../../lib/ModalStack.js';\nimport { ModalStack } from '../../lib/ModalStack.js';\nimport { RenderContainer } from '../../internal/RenderContainer/index.js';\nimport { RenderLayer } from '../../internal/RenderLayer/index.js';\nimport { ZIndex } from '../../internal/ZIndex/index.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { isTestEnv } from '../../lib/currentEnvironment.js';\nimport { ResponsiveLayout } from '../ResponsiveLayout/index.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport { isInstanceOf } from '../../lib/isInstanceOf.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\n\nimport { SidePageBody } from './SidePageBody.js';\nimport { SidePageContainer } from './SidePageContainer.js';\nimport type { SidePageContextType } from './SidePageContext.js';\nimport { SidePageContext } from './SidePageContext.js';\nimport { SidePageFooter } from './SidePageFooter.js';\nimport { SidePageHeader } from './SidePageHeader.js';\nimport { getStyles } from './SidePage.styles.js';\n\nexport interface SidePageProps\n  extends CommonProps,\n    Pick<HTMLAttributes<unknown>, 'role'>,\n    Pick<AriaAttributes, 'aria-label'> {\n  /** Добавляет блокирующий фон, когда сайдпейдж открыт. */\n  blockBackground?: boolean;\n\n  /** Отключает событие onClose, также дизейблит кнопку закрытия сайдпейджа. */\n  disableClose?: boolean;\n\n  /** Оставляет окно открытым при клике на фон. */\n  ignoreBackgroundClick?: boolean;\n\n  /** Задает ширину сайдпейджа. */\n  width?: number | string;\n\n  /** Задает ширину сайдпейджаю на мобилке. По умолчанию ширина во весь экран. */\n  mobileWidth?: number | string;\n\n  /** Задает функцию, которая вызывается при запросе закрытия сайдпейджа пользователем (нажал на фон, на Escape или на крестик). */\n  onClose?: () => void;\n\n  /** Задает функцию, которая вызывается при завершении анимации открытия сайдпейджа. */\n  onOpened?: () => void;\n\n  /** Отображает сайдпэйдж слева. */\n  fromLeft?: boolean;\n\n  /** Отключает анимацию. */\n  disableAnimations?: boolean;\n\n  /** Отключает фокус-лок внутри сайдпейджа.\n   * Работает только при заблокированном фоне: `blockBackground = true`.*/\n  disableFocusLock?: boolean;\n\n  /** Задает отступ от края экрана. */\n  offset?: number | string;\n}\n\nexport interface SidePageState {\n  stackPosition?: number;\n  hasMargin?: boolean;\n  hasShadow?: boolean;\n  hasBackground?: boolean;\n  hasHeader: boolean;\n  hasFooter: boolean;\n  hasPanel: boolean;\n}\n\nexport const SidePageDataTids = {\n  root: 'SidePage__root',\n  container: 'SidePage__container',\n} as const;\n\ntype DefaultProps = Required<Pick<SidePageProps, 'disableAnimations' | 'offset' | 'role'>>;\n\nconst TRANSITION_TIMEOUT = 200;\n\n/**\n * `SidePage` — это модальное окно, которое открывается поверх основной страницы и занимает всю высоту окна браузера.\n *\n * Используйте его, когда нужно сохранить контекст и показать большое количество данных.\n *\n * Содержит в себе три компоненты: `SidePage.Header`, `SidePage.Body` и `SidePage.Footer`.\n *\n * Для отображения серой плашки в футере в компонент `Footer` необходимо передать пропс `panel`.\n */\n@withRenderEnvironment\n@rootNode\nexport class SidePage extends React.Component<SidePageProps, SidePageState> {\n  public static __KONTUR_REACT_UI__ = 'SidePage';\n  public static displayName = 'SidePage';\n\n  public getRootNode!: TGetRootNode;\n  private setRootNode!: TSetRootNode;\n\n  public static Header = SidePageHeader;\n  public static Body = SidePageBody;\n  public static Footer = SidePageFooter;\n  public static Container = SidePageContainer;\n  public state: SidePageState = {\n    hasHeader: false,\n    hasFooter: false,\n    hasPanel: false,\n  };\n\n  private globalObject!: GlobalObject;\n  private emotion!: Emotion;\n  private cx!: Emotion['cx'];\n  private styles!: ReturnType<typeof getStyles>;\n  private theme!: Theme;\n  private stackSubscription: ModalStackSubscription | null = null;\n  private layout: HTMLElement | null = null;\n  private header: SidePageHeader | null = null;\n  private footer: SidePageFooter | null = null;\n  public rootRef = React.createRef<HTMLDivElement>();\n\n  public componentDidMount() {\n    this.globalObject.addEventListener?.('keydown', this.handleKeyDown);\n    this.stackSubscription = ModalStack.add(this, this.handleStackChange, this.globalObject);\n  }\n\n  public componentDidUpdate(prevProps: SidePageProps) {\n    if (prevProps.blockBackground !== this.props.blockBackground) {\n      ModalStack.rerender(this.globalObject);\n      this.setState({\n        hasBackground: ModalStack.isBlocking(this, this.globalObject),\n      });\n    }\n  }\n\n  public componentWillUnmount() {\n    this.globalObject.removeEventListener?.('keydown', this.handleKeyDown);\n    if (isNonNullable(this.stackSubscription)) {\n      this.stackSubscription.remove();\n    }\n    ModalStack.remove(this, this.globalObject);\n  }\n\n  /**\n   * Обновляет разметку компонента.\n   * @public\n   */\n  public updateLayout = (): void => {\n    this.header?.update();\n    this.footer?.update();\n  };\n\n  public static defaultProps: DefaultProps = {\n    disableAnimations: isTestEnv,\n    offset: 0,\n    role: 'dialog',\n  };\n\n  private getProps = createPropsGetter(SidePage.defaultProps);\n\n  public render(): JSX.Element {\n    this.styles = getStyles(this.emotion);\n\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return this.renderMain();\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private renderMain() {\n    const { blockBackground, onOpened } = this.props;\n    const disableAnimations = this.getProps().disableAnimations;\n    return (\n      <ResponsiveLayout>\n        {({ isMobile }) => (\n          <RenderContainer>\n            <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n              <ZIndex\n                priority={'Sidepage'}\n                onScroll={LayoutEvents.emit}\n                createStackingContext\n                style={{ position: 'absolute' }}\n              >\n                {!isMobile && blockBackground && this.renderShadow()}\n                <CSSTransition\n                  in\n                  classNames={this.getTransitionNames()}\n                  appear={!disableAnimations}\n                  enter={!disableAnimations}\n                  exit={false}\n                  timeout={{\n                    enter: TRANSITION_TIMEOUT,\n                    exit: TRANSITION_TIMEOUT,\n                  }}\n                  nodeRef={this.rootRef}\n                  onEntered={onOpened}\n                >\n                  {this.renderContainer(isMobile)}\n                </CSSTransition>\n                {isMobile && <HideBodyVerticalScroll />}\n              </ZIndex>\n            </CommonWrapper>\n          </RenderContainer>\n        )}\n      </ResponsiveLayout>\n    );\n  }\n\n  private get isFocusLockDisabled() {\n    const { disableFocusLock } = this.getProps();\n    const { blockBackground } = this.props;\n    if (!blockBackground) {\n      return true;\n    }\n    if (disableFocusLock !== undefined) {\n      return disableFocusLock;\n    }\n    return false;\n  }\n\n  private renderContainer(isMobile: boolean): JSX.Element {\n    const { mobileWidth, blockBackground, fromLeft, 'aria-label': ariaLabel } = this.props;\n    const { offset, role } = this.getProps();\n\n    const widthDesktop = this.props.width || (blockBackground ? 800 : 500);\n    const widthMobile = mobileWidth || '100%';\n    const width = isMobile ? widthMobile : widthDesktop;\n\n    return (\n      <div\n        aria-modal\n        role={role}\n        aria-label={ariaLabel}\n        data-tid={SidePageDataTids.root}\n        className={this.cx({\n          [this.styles.root()]: true,\n        })}\n        ref={this.rootRef}\n        onScroll={LayoutEvents.emit}\n        style={{\n          width,\n          right: fromLeft ? 'auto' : offset,\n          left: fromLeft ? offset : 'auto',\n        }}\n      >\n        {/* @ts-expect-error: bad cjs-package types */}\n        <FocusLock disabled={this.isFocusLockDisabled} autoFocus={false} className={this.styles.focusLock()}>\n          <RenderLayer onClickOutside={this.handleClickOutside} active>\n            <div\n              data-tid={SidePageDataTids.container}\n              className={this.cx(this.styles.wrapper(this.theme), {\n                [this.styles.wrapperLeft()]: fromLeft,\n                [this.styles.wrapperMarginLeft()]: this.state.hasMargin && fromLeft,\n                [this.styles.wrapperMarginRight()]: this.state.hasMargin && !fromLeft,\n                [this.styles.shadow(this.theme)]: this.state.hasShadow,\n              })}\n              ref={this.layoutRef}\n            >\n              <SidePageContext.Provider value={this.getSidePageContextProps()}>\n                {this.props.children}\n              </SidePageContext.Provider>\n            </div>\n          </RenderLayer>\n        </FocusLock>\n      </div>\n    );\n  }\n\n  private getSidePageContextProps = (): SidePageContextType => {\n    return {\n      hasHeader: this.state.hasHeader,\n      hasFooter: this.state.hasFooter,\n      hasPanel: this.state.hasPanel,\n      requestClose: this.requestClose,\n      getWidth: this.getWidth,\n      updateLayout: this.updateLayout,\n      headerRef: this.headerRef,\n      footerRef: this.footerRef,\n      setHasHeader: this.setHasHeader,\n      setHasFooter: this.setHasFooter,\n      setHasPanel: this.setHasPanel,\n    };\n  };\n\n  private getWidth = () => {\n    if (!this.layout) {\n      return 'auto';\n    }\n    return this.layout.clientWidth;\n  };\n\n  private renderShadow(): JSX.Element {\n    return (\n      <div className={this.styles.overlay()} onScroll={LayoutEvents.emit}>\n        <HideBodyVerticalScroll key=\"hbvs\" />\n        <div\n          key=\"overlay\"\n          className={this.cx({\n            [this.styles.background()]: true,\n            [this.styles.backgroundGray(this.theme)]: this.state.hasBackground,\n          })}\n        />\n      </div>\n    );\n  }\n\n  private getTransitionNames(): Record<string, string> {\n    const transition = this.props.fromLeft ? this.styles.transitionRight : this.styles.transitionLeft;\n\n    return {\n      enter: transition(),\n      enterActive: this.styles.transitionActive(),\n      exit: this.styles.transitionLeave(),\n      exitActive: this.styles.transitionLeaveActive(),\n      appear: transition(),\n      appearActive: this.styles.transitionActive(),\n    };\n  }\n\n  private handleStackChange = (stack: readonly React.Component[]) => {\n    const sidePages = stack.filter(\n      (x) => isReactUIInstance<SidePage>(x, 'SidePage') && x.props.fromLeft === this.props.fromLeft,\n    );\n    const currentSidePagePosition = sidePages.indexOf(this);\n\n    const hasMargin = sidePages.length > 1 && currentSidePagePosition === sidePages.length - 1;\n    const hasShadow = sidePages.length < 3 || currentSidePagePosition > sidePages.length - 3;\n    const hasBackground = ModalStack.isBlocking(this, this.globalObject);\n\n    this.setState({\n      stackPosition: stack.indexOf(this),\n      hasMargin,\n      hasShadow,\n      hasBackground,\n    });\n  };\n\n  private handleClickOutside = (e: Event) => {\n    if (this.state.stackPosition === 0 && !this.props.ignoreBackgroundClick) {\n      // ignore mousedown on window scrollbar\n      if (\n        isInstanceOf(e, this.globalObject.MouseEvent) &&\n        this.globalObject.document &&\n        e.clientX > this.globalObject.document.documentElement.clientWidth\n      ) {\n        return;\n      }\n      this.requestClose();\n    }\n  };\n\n  private handleKeyDown = (e: KeyboardEvent) => {\n    if (this.state.stackPosition !== 0) {\n      return;\n    }\n    if (isKeyEscape(e)) {\n      e.stopPropagation();\n      this.requestClose();\n    }\n  };\n\n  private requestClose = () => {\n    if (this.props.disableClose) {\n      return;\n    }\n    if (this.props.onClose) {\n      this.props.onClose();\n    }\n  };\n\n  private headerRef = (ref: SidePageHeader | null) => {\n    this.header = ref;\n  };\n\n  private footerRef = (ref: SidePageFooter | null) => {\n    this.footer = ref;\n  };\n\n  private layoutRef = (ref: HTMLDivElement | null) => {\n    this.layout = ref;\n  };\n\n  private setHasHeader = (hasHeader = true) => {\n    this.state.hasHeader !== hasHeader && this.setState({ hasHeader });\n  };\n\n  private setHasFooter = (hasFooter = true) => {\n    this.state.hasFooter !== hasFooter && this.setState({ hasFooter });\n  };\n\n  private setHasPanel = (hasPanel = false) => {\n    this.state.hasPanel !== hasPanel && this.setState({ hasPanel });\n  };\n}\n"]}

package/components/SidePage/SidePage.styles.d.ts

@@ -1,5 +1,5 @@
-import type { Theme } from '../../lib/theming/Theme';
-export declare const getStyles: import("../../lib/theming/Emotion").StylesGetter<{
+import type { Theme } from '../../lib/theming/Theme.js';
+export declare const getStyles: import("../../lib/theming/Emotion.js").StylesGetter<{
     root(): string;
     overlay(): string;
     body(t: Theme): string;