npm - @skbkontur/react-ui - Versions diffs - 0.0.0-2ac4c133dd → 0.0.0-2dd5039746 - Mend

@skbkontur/react-ui 0.0.0-2ac4c133dd → 0.0.0-2dd5039746

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1102) hide show

package/components/SidePage/SidePage.d.ts CHANGED Viewed

@@ -26,6 +26,10 @@ export interface SidePageProps extends CommonProps {
      * Escape или на крестик).
      */
     onClose?: () => void;
+    /**
+     * Вызывается, когда анимация открытия сайдпейджа полностью прошла
+     */
+    onOpened?: () => void;
     /**
      * Показывать сайдпэйдж слева
      *
@@ -39,7 +43,7 @@ export interface SidePageProps extends CommonProps {
     /**
      * Работает только при заблокированном фоне: `blockBackground = true`
      */
-    disableFocusLock: boolean;
+    disableFocusLock?: boolean;
     /**
      * задает отступ от края экрана
      */
@@ -58,6 +62,7 @@ export declare const SidePageDataTids: {
     readonly root: "SidePage__root";
     readonly container: "SidePage__container";
 };
+declare type DefaultProps = Required<Pick<SidePageProps, 'disableAnimations' | 'disableFocusLock' | 'offset'>>;
 /**
  * Сайдпейдж
  *
@@ -87,11 +92,8 @@ export declare class SidePage extends React.Component<SidePageProps, SidePageSta
      * @public
      */
     updateLayout: () => void;
-    static defaultProps: {
-        disableAnimations: boolean;
-        disableFocusLock: boolean;
-        offset: number;
-    };
+    static defaultProps: DefaultProps;
+    private getProps;
     render(): JSX.Element;
     private renderMain;
     private renderContainer;
@@ -110,3 +112,4 @@ export declare class SidePage extends React.Component<SidePageProps, SidePageSta
     private setHasFooter;
     private setHasPanel;
 }
+export {};

package/components/SidePage/SidePageFooter/SidePageFooter.js CHANGED Viewed

@@ -12,6 +12,8 @@ import { cx } from "../../../lib/theming/Emotion";
 import { responsiveLayout } from "../../ResponsiveLayout/decorator";
 import { getRootNode, rootNode } from "../../../lib/rootNode";
 import { getDOMRect } from "../../../lib/dom/getDOMRect";
+import { Gapped } from "../../Gapped";
+import { isNonNullable } from "../../../lib/utils";
 import { styles } from "../SidePage.styles";
 import { SidePageContext } from "../SidePageContext";
 export var SidePageFooterDataTids = {
@@ -142,7 +144,10 @@ export var SidePageFooter = responsiveLayout(_class = rootNode(_class = (_temp =
       }, /*#__PURE__*/React.createElement("div", {
         className: cx(styles.footerContent(_this3.theme), (_cx2 = {}, _cx2[styles.footerFixed(_this3.theme)] = _this3.state.fixed, _cx2[styles.panel(_this3.theme)] = !!_this3.props.panel, _cx2[styles.panelFixed(_this3.theme)] = !!_this3.props.panel && _this3.state.fixed, _cx2[styles.mobileFooterContent(_this3.theme)] = _this3.isMobileLayout, _cx2)),
         ref: _this3.refContent
-      }, _this3.props.children));
+      }, isNonNullable(_this3.props.gap) ? /*#__PURE__*/React.createElement(Gapped, {
+        vertical: _this3.isMobileLayout,
+        gap: _this3.props.gap
+      }, _this3.props.children) : _this3.props.children));
     })));
   };

package/components/SidePage/SidePageFooter/SidePageFooter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["SidePageFooter.tsx"],"names":["React","LayoutEvents","ThemeContext","CommonWrapper","cx","responsiveLayout","getRootNode","rootNode","getDOMRect","styles","SidePageContext","SidePageFooterDataTids","root","SidePageFooter","context","state","fixed","content","layoutSub","update","setProperStyles","refContent","node","wrapper","wrapperRect","contentRect","top","setState","componentDidMount","footerRef","addListener","setHasFooter","setHasPanel","props","panel","componentDidUpdate","prevProps","componentWillUnmount","remove","getSticky","sticky","isMobileLayout","render","theme","renderMain","setRootNode","height","getContentHeight","footerWrapper","getWidth","footer","positionStatic","width","footerContent","footerFixed","panelFixed","mobileFooterContent","children","Component","__KONTUR_REACT_UI__","contextType"],"mappings":"iPAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,OAAO,KAAKC,YAAZ,MAA8B,wBAA9B;AACA,SAASC,YAAT,QAA6B,gCAA7B;;AAEA,SAAsBC,aAAtB,QAA2C,8BAA3C;AACA,SAASC,EAAT,QAAmB,2BAAnB;AACA,SAASC,gBAAT,QAAiC,+BAAjC;AACA,SAASC,WAAT,EAAsBC,QAAtB,QAAoD,oBAApD;AACA,SAASC,UAAT,QAA2B,0BAA3B;;AAEA,SAASC,MAAT,QAAuB,mBAAvB;AACA,SAASC,eAAT,QAAqD,mBAArD~~;;;;;;;;;;;AAWA~~,OAAO,IAAMC,sBAAsB,GAAG;AACpCC,EAAAA,IAAI,EAAE,sBAD8B,EAA/B;;;AAIP;AACA;AACA;AACA;AACA;;;AAGA,WAAaC,cAAb,~~GAFCR~~,gBAED,UADCE,QACD;;;;~~AAISO~~,IAAAA,OAJT,GAIwC,MAAKA,OAJ7C;;;AAOSC,IAAAA,KAPT,~~GAOiB~~;~~AACbC~~,MAAAA,KAAK,EAAE,~~KADM~~,~~EAPjB~~;;;;AAYUC,IAAAA,OAZV,GAYwC,IAZxC;AAaUC,IAAAA,SAbV,GAa0E,IAb1E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4DSC,IAAAA,MA5DT,GA4DkB,YAAM;AACpB,YAAKC,eAAL;AACD,KA9DH~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqGUC~~,IAAAA,~~UArGV~~,~~GAqGuB~~,UAACC,IAAD,EAA8B;AACjD,YAAKL,OAAL,GAAeK,IAAf;AACD,~~KAvGH~~;;~~AAyGUF~~,IAAAA,~~eAzGV~~,~~GAyG4B~~,YAAM;AAC9B,UAAMG,OAAO,~~GAAGjB~~,WAAW,+BAA3B;AACA,~~UAAIiB~~,OAAO,IAAI,MAAKN,OAApB,EAA6B;AAC3B,YAAMO,WAAW,~~GAAGhB~~,UAAU,~~CAACe~~,OAAD,CAA9B;AACA,YAAME,WAAW,~~GAAGjB~~,UAAU,CAAC,~~MAAKS~~,OAAN,CAA9B;AACA,YAAMD,MAAK,GAAGQ,WAAW,CAACE,GAAZ,GAAkBD,WAAW,CAACC,GAA5C;AACA,cAAKC,QAAL,CAAc,EAAEX,KAAK,EAALA,MAAF,EAAd;AACD;AACF,~~KAjHH~~,4DAgBSY,iBAhBT,GAgBE,6BAA2B,iFACzB,KAAKd,OAAL,CAAae,SAAb,CAAuB,IAAvB,EACA,KAAKV,MAAL,GACA,KAAKD,SAAL,~~GAAiBjB~~,YAAY,~~CAAC6B~~,WAAb,CAAyB,KAAKX,MAA9B,CAAjB,CACA,+CAAKL,OAAL,EAAaiB,YAAb,+DACA,gDAAKjB,OAAL,EAAakB,WAAb,gEAA2B,KAAKC,KAAL,CAAWC,KAAtC,EACD,CAtBH,QAwBSC,kBAxBT,GAwBE,4BAA0BC,SAA1B,EAAoE,4CAClE,KAAKH,KAAL,CAAWC,KAAX,KAAqBE,SAAS,CAACF,KAA/B,+BAAwC,uBAAKpB,OAAL,EAAakB,WAArD,qBAAwC,4CAA2B,KAAKC,KAAL,CAAWC,KAAtC,CAAxC,EACD,CA1BH,QA4BSG,oBA5BT,GA4BE,gCAA8B,oFAC5B,KAAKvB,OAAL,CAAae,SAAb,CAAuB,IAAvB,EACA,IAAI,KAAKX,SAAT,EAAoB,CAClB,KAAKA,SAAL,CAAeoB,MAAf,GACD,CACD,iDAAKxB,OAAL,EAAaiB,YAAb,iEAA4B,KAA5B,EACA,iDAAKjB,OAAL,EAAakB,WAAb,iEAA2B,KAA3B,EACD,CAnCH,QAqCSO,SArCT,GAqCE,qBAAmB,CACjB,IAAI,OAAO,KAAKN,KAAL,CAAWO,MAAlB,KAA6B,WAAjC,EAA8C,CAC5C,OAAO,KAAKP,KAAL,CAAWO,MAAlB,CACD,CAED,IAAI,KAAKC,cAAT,EAAyB,CACvB,OAAO,KAAP,CACD,CAED,OAAO,IAAP,CACD,CA/CH,QAiDSC,MAjDT,GAiDE,kBAA6B,mBAC3B,oBACE,oBAAC,YAAD,CAAc,QAAd,QACG,UAACC,KAAD,EAAW,CACV,MAAI,CAACA,KAAL,GAAaA,KAAb,CACA,OAAO,MAAI,CAACC,UAAL,EAAP,CACD,CAJH,CADF,CAQD,CA1DH,QAgEUA,UAhEV,GAgEE,sBAAqB,mBACnB,oBACE,oBAAC,aAAD,aAAe,WAAW,EAAE,KAAKC,WAAjC,IAAkD,KAAKZ,KAAvD,gBACE,6BACE,YAAUtB,sBAAsB,CAACC,IADnC,EAEE,KAAK,EAAE,EAAEkC,MAAM,EAAE,KAAKC,gBAAL,EAAV,EAFT,EAGE,SAAS,EAAEtC,MAAM,CAACuC,aAAP,EAHb,iBAKE,oBAAC,eAAD,CAAiB,QAAjB,QACG,mCAAGC,QAAH,QAAGA,QAAH,qBACC,6BACE,SAAS,~~EAAE7C~~,EAAE,~~CAACK~~,MAAM,CAACyC,MAAP,CAAc,MAAI,CAACP,KAAnB,CAAD,iBACVlC,MAAM,CAAC0C,cAAP,EADU,IACgB,CAAC,MAAI,CAACZ,SAAL,EADjB,OADf,EAIE,KAAK,EAAE,EACLa,KAAK,EAAEH,QAAQ,EADV,EAJT,iBAQE,6BACE,SAAS,~~EAAE7C~~,EAAE,~~CAACK~~,MAAM,CAAC4C,aAAP,CAAqB,MAAI,CAACV,KAA1B,CAAD,mBACVlC,MAAM,CAAC6C,WAAP,CAAmB,MAAI,CAACX,KAAxB,CADU,IACuB,MAAI,CAAC5B,KAAL,CAAWC,KADlC,OAEVP,MAAM,CAACyB,KAAP,CAAa,MAAI,CAACS,KAAlB,CAFU,IAEiB,CAAC,CAAC,MAAI,CAACV,KAAL,CAAWC,KAF9B,OAGVzB,MAAM,CAAC8C,UAAP,CAAkB,MAAI,CAACZ,KAAvB,CAHU,IAGsB,CAAC,CAAC,MAAI,CAACV,KAAL,CAAWC,KAAb,IAAsB,MAAI,CAACnB,KAAL,CAAWC,KAHvD,OAIVP,MAAM,CAAC+C,mBAAP,CAA2B,MAAI,CAACb,KAAhC,CAJU,IAI+B,MAAI,CAACF,cAJpC,QADf,EAOE,GAAG,EAAE,MAAI,CAACpB,UAPZ,~~IASG~~,MAAI,~~CAACY~~,KAAL,CAAWwB,~~QATd~~,CARF,CADD,EADH,CALF,CADF,CADF,~~CAkCD~~,~~CAnGH~~;;~~AAmHUV~~,EAAAA,~~gBAnHV~~,~~GAmHE~~,4BAA2B;AACzB,QAAI,CAAC,KAAK9B,OAAV,EAAmB;AACjB,aAAO,MAAP;AACD;AACD,~~WAAOT~~,UAAU,CAAC,~~KAAKS~~,OAAN,CAAV,CAAyB6B,MAAhC;AACD,~~GAxHH~~,~~yBAAoC9C~~,KAAK,~~CAAC0D~~,SAA1C,WACgBC,mBADhB,GACsC,gBADtC,UAGgBC,WAHhB,~~GAG8BlD~~,eAH9B","sourcesContent":["import React from 'react';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { responsiveLayout } from '../ResponsiveLayout/decorator';\nimport { getRootNode, rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\n\nimport { styles } from './SidePage.styles';\nimport { SidePageContext, SidePageContextType } from './SidePageContext';\n\nexport interface SidePageFooterProps extends CommonProps {\n children?: React.ReactNode \| ((fixed: boolean) => React.ReactNode);\n /*\n Включает серый цвет в футере\n /\n panel?: boolean;\n sticky?: boolean;\n}\n\nexport const SidePageFooterDataTids = {\n root: 'SidePageFooter__root',\n} as const;\n\n/\n Футер сайдпейджа.\n \n @visibleName SidePage.Footer\n */\n@responsiveLayout\n@rootNode\nexport class SidePageFooter extends React.Component<SidePageFooterProps> {\n public static __KONTUR_REACT_UI__ = 'SidePageFooter';\n\n public static contextType = SidePageContext;\n public context: SidePageContextType = this.context;\n private isMobileLayout!: boolean;\n\n public state = {\n fixed: false,\n };\n\n private theme!: Theme;\n private content: HTMLElement \| null = null;\n private layoutSub: ReturnType<typeof LayoutEvents.addListener> \| null = null;\n private setRootNode!: TSetRootNode;\n\n public componentDidMount() {\n this.context.footerRef(this);\n this.update();\n this.layoutSub = LayoutEvents.addListener(this.update);\n this.context.setHasFooter?.();\n this.context.setHasPanel?.(this.props.panel);\n }\n\n public componentDidUpdate(prevProps: Readonly<SidePageFooterProps>) {\n this.props.panel !== prevProps.panel && this.context.setHasPanel?.(this.props.panel);\n }\n\n public componentWillUnmount() {\n this.context.footerRef(null);\n if (this.layoutSub) {\n this.layoutSub.remove();\n }\n this.context.setHasFooter?.(false);\n this.context.setHasPanel?.(false);\n }\n\n public getSticky() {\n if (typeof this.props.sticky !== 'undefined') {\n return this.props.sticky;\n }\n\n if (this.isMobileLayout) {\n return false;\n }\n\n return true;\n }\n\n public render(): JSX.Element {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n public update = () => {\n this.setProperStyles();\n };\n\n private renderMain() {\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div\n data-tid={SidePageFooterDataTids.root}\n style={{ height: this.getContentHeight() }}\n className={styles.footerWrapper()}\n >\n <SidePageContext.Consumer>\n {({ getWidth }) => (\n <div\n className={cx(styles.footer(this.theme), {\n [styles.positionStatic()]: !this.getSticky(),\n })}\n style={{\n width: getWidth(),\n }}\n >\n <div\n className={cx(styles.footerContent(this.theme), {\n [styles.footerFixed(this.theme)]: this.state.fixed,\n [styles.panel(this.theme)]: !!this.props.panel,\n [styles.panelFixed(this.theme)]: !!this.props.panel && this.state.fixed,\n [styles.mobileFooterContent(this.theme)]: this.isMobileLayout,\n })}\n ref={this.refContent}\n >\n {this.props.children}\n </div>\n </div>\n )}\n </SidePageContext.Consumer>\n </div>\n </CommonWrapper>\n );\n }\n\n private refContent = (node: HTMLElement \| null) => {\n this.content = node;\n };\n\n private setProperStyles = () => {\n const wrapper = getRootNode(this);\n if (wrapper && this.content) {\n const wrapperRect = getDOMRect(wrapper);\n const contentRect = getDOMRect(this.content);\n const fixed = wrapperRect.top > contentRect.top;\n this.setState({ fixed });\n }\n };\n\n private getContentHeight() {\n if (!this.content) {\n return 'auto';\n }\n return getDOMRect(this.content).height;\n }\n}\n"]}
1	+ {"version":3,"sources":["SidePageFooter.tsx"],"names":["React","LayoutEvents","ThemeContext","CommonWrapper","cx","responsiveLayout","getRootNode","rootNode","getDOMRect","Gapped","isNonNullable","styles","SidePageContext","SidePageFooterDataTids","root","SidePageFooter","context","state","fixed","content","layoutSub","update","setProperStyles","refContent","node","wrapper","wrapperRect","contentRect","top","setState","componentDidMount","footerRef","addListener","setHasFooter","setHasPanel","props","panel","componentDidUpdate","prevProps","componentWillUnmount","remove","getSticky","sticky","isMobileLayout","render","theme","renderMain","setRootNode","height","getContentHeight","footerWrapper","getWidth","footer","positionStatic","width","footerContent","footerFixed","panelFixed","mobileFooterContent","gap","children","Component","__KONTUR_REACT_UI__","contextType"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { responsiveLayout } from '../ResponsiveLayout/decorator';\nimport { getRootNode, rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\nimport { Gapped, GappedProps } from '../Gapped';\nimport { isNonNullable } from '../../lib/utils';\n\nimport { styles } from './SidePage.styles';\nimport { SidePageContext, SidePageContextType } from './SidePageContext';\n\nexport interface SidePageFooterProps extends Omit<CommonProps, 'children'> {\n children?: React.ReactNode \| ((fixed: boolean) => React.ReactNode);\n /*\n Включает серый цвет в футере\n /\n panel?: boolean;\n /\n Закрепляет футер снизу сайдпейджа\n /\n sticky?: boolean;\n /\n Задаёт отступ между элементами футера\n /\n gap?: GappedProps['gap'];\n}\n\ninterface SidePageFooterState {\n fixed: boolean;\n}\n\nexport const SidePageFooterDataTids = {\n root: 'SidePageFooter__root',\n} as const;\n\n/\n Футер сайдпейджа.\n \n @visibleName SidePage.Footer\n */\n@responsiveLayout\n@rootNode\nexport class SidePageFooter extends React.Component<SidePageFooterProps, SidePageFooterState> {\n public static __KONTUR_REACT_UI__ = 'SidePageFooter';\n\n public static contextType = SidePageContext;\n public context: SidePageContextType = this.context;\n private isMobileLayout!: boolean;\n\n public state: SidePageFooterState = {\n fixed: false,\n };\n\n private theme!: Theme;\n private content: HTMLElement \| null = null;\n private layoutSub: ReturnType<typeof LayoutEvents.addListener> \| null = null;\n private setRootNode!: TSetRootNode;\n\n public componentDidMount() {\n this.context.footerRef(this);\n this.update();\n this.layoutSub = LayoutEvents.addListener(this.update);\n this.context.setHasFooter?.();\n this.context.setHasPanel?.(this.props.panel);\n }\n\n public componentDidUpdate(prevProps: Readonly<SidePageFooterProps>) {\n this.props.panel !== prevProps.panel && this.context.setHasPanel?.(this.props.panel);\n }\n\n public componentWillUnmount() {\n this.context.footerRef(null);\n if (this.layoutSub) {\n this.layoutSub.remove();\n }\n this.context.setHasFooter?.(false);\n this.context.setHasPanel?.(false);\n }\n\n public getSticky() {\n if (typeof this.props.sticky !== 'undefined') {\n return this.props.sticky;\n }\n\n if (this.isMobileLayout) {\n return false;\n }\n\n return true;\n }\n\n public render(): JSX.Element {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n public update = () => {\n this.setProperStyles();\n };\n\n private renderMain() {\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div\n data-tid={SidePageFooterDataTids.root}\n style={{ height: this.getContentHeight() }}\n className={styles.footerWrapper()}\n >\n <SidePageContext.Consumer>\n {({ getWidth }) => (\n <div\n className={cx(styles.footer(this.theme), {\n [styles.positionStatic()]: !this.getSticky(),\n })}\n style={{\n width: getWidth(),\n }}\n >\n <div\n className={cx(styles.footerContent(this.theme), {\n [styles.footerFixed(this.theme)]: this.state.fixed,\n [styles.panel(this.theme)]: !!this.props.panel,\n [styles.panelFixed(this.theme)]: !!this.props.panel && this.state.fixed,\n [styles.mobileFooterContent(this.theme)]: this.isMobileLayout,\n })}\n ref={this.refContent}\n >\n {isNonNullable(this.props.gap) ? (\n <Gapped vertical={this.isMobileLayout} gap={this.props.gap}>\n {this.props.children}\n </Gapped>\n ) : (\n this.props.children\n )}\n </div>\n </div>\n )}\n </SidePageContext.Consumer>\n </div>\n </CommonWrapper>\n );\n }\n\n private refContent = (node: HTMLElement \| null) => {\n this.content = node;\n };\n\n private setProperStyles = () => {\n const wrapper = getRootNode(this);\n if (wrapper && this.content) {\n const wrapperRect = getDOMRect(wrapper);\n const contentRect = getDOMRect(this.content);\n const fixed = wrapperRect.top > contentRect.top;\n this.setState({ fixed });\n }\n };\n\n private getContentHeight() {\n if (!this.content) {\n return 'auto';\n }\n return getDOMRect(this.content).height;\n }\n}\n"]}

package/components/SidePage/SidePageFooter.d.ts CHANGED Viewed

@@ -1,13 +1,24 @@
 import React from 'react';
 import { CommonProps } from '../../internal/CommonWrapper';
+import { GappedProps } from '../Gapped';
 import { SidePageContextType } from './SidePageContext';
-export interface SidePageFooterProps extends CommonProps {
+export interface SidePageFooterProps extends Omit<CommonProps, 'children'> {
     children?: React.ReactNode | ((fixed: boolean) => React.ReactNode);
     /**
      * Включает серый цвет в футере
      */
     panel?: boolean;
+    /**
+     * Закрепляет футер снизу сайдпейджа
+     */
     sticky?: boolean;
+    /**
+     * Задаёт отступ между элементами футера
+     */
+    gap?: GappedProps['gap'];
+}
+interface SidePageFooterState {
+    fixed: boolean;
 }
 export declare const SidePageFooterDataTids: {
     readonly root: "SidePageFooter__root";
@@ -17,14 +28,12 @@ export declare const SidePageFooterDataTids: {
  *
  * @visibleName SidePage.Footer
  */
-export declare class SidePageFooter extends React.Component<SidePageFooterProps> {
+export declare class SidePageFooter extends React.Component<SidePageFooterProps, SidePageFooterState> {
     static __KONTUR_REACT_UI__: string;
     static contextType: React.Context<SidePageContextType>;
     context: SidePageContextType;
     private isMobileLayout;
-    state: {
-        fixed: boolean;
-    };
+    state: SidePageFooterState;
     private theme;
     private content;
     private layoutSub;
@@ -40,3 +49,4 @@ export declare class SidePageFooter extends React.Component<SidePageFooterProps>
     private setProperStyles;
     private getContentHeight;
 }
+export {};

package/components/SidePage/SidePageHeader/SidePageHeader.js CHANGED Viewed

@@ -90,7 +90,7 @@ export var SidePageHeader = responsiveLayout(_class = rootNode(_class = (_temp =
       var stickyOffset = parseInt(_this.theme.sidePageHeaderStickyOffset);
       return /*#__PURE__*/React.createElement("div", {
         className: cx(styles.wrapperClose(_this.theme), (_cx3 = {}, _cx3[styles.wrapperCloseFixed(_this.theme)] = fixed, _cx3[styles.mobileWrapperClose(_this.theme)] = _this.isMobileLayout, _cx3))
-      }, _this.isMobileLayout ? _this.closeIcon : /*#__PURE__*/React.createElement(Sticky, {
+      }, _this.isMobileLayout ? _this.closeIcon() : /*#__PURE__*/React.createElement(Sticky, {
         side: "top",
         offset: stickyOffset
       }, _this.closeIcon));

package/components/SidePage/SidePageHeader/SidePageHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["SidePageHeader.tsx"],"names":["React","Sticky","CrossIcon","isFunction","ThemeContext","CommonWrapper","cx","keyListener","responsiveLayout","rootNode","getDOMRect","styles","SidePageContext","SidePageHeaderDataTids","root","close","SidePageHeader","context","state","isReadyToFix","focusedByTab","wrapper","sticky","lastRegularHeight","componentDidMount","window","addEventListener","update","setHasHeader","headerRef","componentWillUnmount","removeEventListener","reflow","updateReadyToFix","renderHeader","fixed","header","theme","headerFixed","mobileHeader","isMobileLayout","renderClose","title","mobileTitle","titleFixed","props","children","stickyOffset","parseInt","sidePageHeaderStickyOffset","wrapperClose","wrapperCloseFixed","mobileWrapperClose","closeIcon","requestClose","closeFocus","handleFocus","handleBlur","wrapperScrolledUp","top","regularHeight","fixedHeaderHeight","setState","wrapperRef","el","stickyRef","requestAnimationFrame","isTabPressed","render","renderMain","getStickyProp","isStickyDesktop","isStickyMobile","setRootNode","headerWrapper","height","sidePageHeaderFixedLineHeight","sidePageHeaderFixedPaddingY","Component","__KONTUR_REACT_UI__","contextType"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { Sticky } from '../Sticky';\nimport { CrossIcon } from '../../internal/icons/CrossIcon';\nimport { isFunction } from '../../lib/utils';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { responsiveLayout } from '../ResponsiveLayout/decorator';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\n\nimport { styles } from './SidePage.styles';\nimport { SidePageContext, SidePageContextType } from './SidePageContext';\n\nexport interface SidePageHeaderProps extends CommonProps {\n children?: React.ReactNode \| ((fixed: boolean) => React.ReactNode);\n sticky?: boolean;\n}\n\nexport interface SidePageHeaderState {\n isReadyToFix: boolean;\n focusedByTab: boolean;\n}\n\nexport const SidePageHeaderDataTids = {\n root: 'SidePageHeader__root',\n close: 'SidePage__close',\n} as const;\n\n/*\n Шапка сайдпейджа\n \n @visibleName SidePage.Header\n /\n@responsiveLayout\n@rootNode\nexport class SidePageHeader extends React.Component<SidePageHeaderProps, SidePageHeaderState> {\n public static __KONTUR_REACT_UI__ = 'SidePageHeader';\n\n public static contextType = SidePageContext;\n public context: SidePageContextType = this.context;\n\n private isMobileLayout!: boolean;\n\n public state: SidePageHeaderState = {\n isReadyToFix: false,\n focusedByTab: false,\n };\n\n private theme!: Theme;\n private wrapper: HTMLElement \| null = null;\n private sticky: Sticky \| null = null;\n private lastRegularHeight = 0;\n private setRootNode!: TSetRootNode;\n\n public get regularHeight(): number {\n const { isReadyToFix } = this.state;\n if (!this.wrapper) {\n return 0;\n }\n if (!isReadyToFix) {\n this.lastRegularHeight = getDOMRect(this.wrapper).height;\n }\n return this.lastRegularHeight;\n }\n\n public get fixedHeaderHeight(): number {\n const { theme } = this;\n return parseInt(theme.sidePageHeaderFixedLineHeight) + parseInt(theme.sidePageHeaderFixedPaddingY) 2;\n }\n\n public componentDidMount = () => {\n window.addEventListener('scroll', this.update, true);\n this.context.setHasHeader?.();\n this.context.headerRef(this);\n };\n\n public componentWillUnmount = () => {\n window.removeEventListener('scroll', this.update, true);\n this.context.setHasHeader?.(false);\n this.context.headerRef(null);\n };\n\n public update = () => {\n this.sticky?.reflow();\n this.updateReadyToFix();\n };\n\n public render(): JSX.Element {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n public getStickyProp() {\n if (typeof this.props.sticky !== 'undefined') {\n return this.props.sticky;\n }\n\n if (this.isMobileLayout) {\n return false;\n }\n\n return true;\n }\n\n private renderMain() {\n const { isReadyToFix } = this.state;\n\n const isStickyDesktop = !this.isMobileLayout && this.getStickyProp() && isReadyToFix;\n const isStickyMobile = this.isMobileLayout && this.getStickyProp();\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div data-tid={SidePageHeaderDataTids.root} ref={this.wrapperRef} className={styles.headerWrapper()}>\n {isStickyDesktop \|\| isStickyMobile ? (\n <Sticky ref={this.stickyRef} side=\"top\">\n {this.renderHeader}\n </Sticky>\n ) : (\n this.renderHeader()\n )}\n </div>\n </CommonWrapper>\n );\n }\n\n private renderHeader = (fixed = false) => {\n return (\n <div\n className={cx(styles.header(this.theme), {\n [styles.headerFixed(this.theme)]: fixed,\n [styles.mobileHeader(this.theme)]: this.isMobileLayout,\n })}\n >\n {this.renderClose(fixed)}\n <div\n className={cx(styles.title(this.theme), {\n [styles.mobileTitle(this.theme)]: this.isMobileLayout,\n [styles.titleFixed()]: fixed,\n })}\n >\n {isFunction(this.props.children) ? this.props.children(fixed) : this.props.children}\n </div>\n </div>\n );\n };\n\n private renderClose = (fixed: boolean) => {\n const stickyOffset = parseInt(this.theme.sidePageHeaderStickyOffset);\n return (\n <div\n className={cx(styles.wrapperClose(this.theme), {\n [styles.wrapperCloseFixed(this.theme)]: fixed,\n [styles.mobileWrapperClose(this.theme)]: this.isMobileLayout,\n })}\n >\n {this.isMobileLayout ? (\n this.closeIcon\n ) : (\n <Sticky side=\"top\" offset={stickyOffset}>\n {this.closeIcon}\n </Sticky>\n )}\n </div>\n );\n };\n\n private closeIcon = () => (\n <SidePageContext.Consumer>\n {({ requestClose }) => (\n <button\n className={cx(styles.close(this.theme), {\n [styles.closeFocus(this.theme)]: this.state.focusedByTab,\n })}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n onClick={requestClose}\n data-tid={SidePageHeaderDataTids.close}\n tabIndex={0}\n >\n <CrossIcon />\n </button>\n )}\n </SidePageContext.Consumer>\n );\n\n private updateReadyToFix = () => {\n if (this.wrapper) {\n const wrapperScrolledUp = getDOMRect(this.wrapper).top;\n const isReadyToFix = this.regularHeight + wrapperScrolledUp <= this.fixedHeaderHeight;\n this.setState((state) => (state.isReadyToFix !== isReadyToFix ? { ...state, isReadyToFix } : state));\n }\n };\n\n private wrapperRef = (el: HTMLElement \| null) => {\n this.wrapper = el;\n };\n\n private stickyRef = (el: Sticky \| null) => {\n this.sticky = el;\n };\n\n private handleFocus = () => {\n requestAnimationFrame(() => {\n if (keyListener.isTabPressed) {\n this.setState({ focusedByTab: true });\n }\n });\n };\n\n private handleBlur = () => {\n this.setState({ focusedByTab: false });\n };\n}\n"]}
1	+ {"version":3,"sources":["SidePageHeader.tsx"],"names":["React","Sticky","CrossIcon","isFunction","ThemeContext","CommonWrapper","cx","keyListener","responsiveLayout","rootNode","getDOMRect","styles","SidePageContext","SidePageHeaderDataTids","root","close","SidePageHeader","context","state","isReadyToFix","focusedByTab","wrapper","sticky","lastRegularHeight","componentDidMount","window","addEventListener","update","setHasHeader","headerRef","componentWillUnmount","removeEventListener","reflow","updateReadyToFix","renderHeader","fixed","header","theme","headerFixed","mobileHeader","isMobileLayout","renderClose","title","mobileTitle","titleFixed","props","children","stickyOffset","parseInt","sidePageHeaderStickyOffset","wrapperClose","wrapperCloseFixed","mobileWrapperClose","closeIcon","requestClose","closeFocus","handleFocus","handleBlur","wrapperScrolledUp","top","regularHeight","fixedHeaderHeight","setState","wrapperRef","el","stickyRef","requestAnimationFrame","isTabPressed","render","renderMain","getStickyProp","isStickyDesktop","isStickyMobile","setRootNode","headerWrapper","height","sidePageHeaderFixedLineHeight","sidePageHeaderFixedPaddingY","Component","__KONTUR_REACT_UI__","contextType"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { Sticky } from '../Sticky';\nimport { CrossIcon } from '../../internal/icons/CrossIcon';\nimport { isFunction } from '../../lib/utils';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { responsiveLayout } from '../ResponsiveLayout/decorator';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\n\nimport { styles } from './SidePage.styles';\nimport { SidePageContext, SidePageContextType } from './SidePageContext';\n\nexport interface SidePageHeaderProps extends Omit<CommonProps, 'children'> {\n children?: React.ReactNode \| ((fixed: boolean) => React.ReactNode);\n sticky?: boolean;\n}\n\nexport interface SidePageHeaderState {\n isReadyToFix: boolean;\n focusedByTab: boolean;\n}\n\nexport const SidePageHeaderDataTids = {\n root: 'SidePageHeader__root',\n close: 'SidePage__close',\n} as const;\n\n/*\n Шапка сайдпейджа\n \n @visibleName SidePage.Header\n /\n@responsiveLayout\n@rootNode\nexport class SidePageHeader extends React.Component<SidePageHeaderProps, SidePageHeaderState> {\n public static __KONTUR_REACT_UI__ = 'SidePageHeader';\n\n public static contextType = SidePageContext;\n public context: SidePageContextType = this.context;\n\n private isMobileLayout!: boolean;\n\n public state: SidePageHeaderState = {\n isReadyToFix: false,\n focusedByTab: false,\n };\n\n private theme!: Theme;\n private wrapper: HTMLElement \| null = null;\n private sticky: Sticky \| null = null;\n private lastRegularHeight = 0;\n private setRootNode!: TSetRootNode;\n\n public get regularHeight(): number {\n const { isReadyToFix } = this.state;\n if (!this.wrapper) {\n return 0;\n }\n if (!isReadyToFix) {\n this.lastRegularHeight = getDOMRect(this.wrapper).height;\n }\n return this.lastRegularHeight;\n }\n\n public get fixedHeaderHeight(): number {\n const { theme } = this;\n return parseInt(theme.sidePageHeaderFixedLineHeight) + parseInt(theme.sidePageHeaderFixedPaddingY) 2;\n }\n\n public componentDidMount = () => {\n window.addEventListener('scroll', this.update, true);\n this.context.setHasHeader?.();\n this.context.headerRef(this);\n };\n\n public componentWillUnmount = () => {\n window.removeEventListener('scroll', this.update, true);\n this.context.setHasHeader?.(false);\n this.context.headerRef(null);\n };\n\n public update = () => {\n this.sticky?.reflow();\n this.updateReadyToFix();\n };\n\n public render(): JSX.Element {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n public getStickyProp() {\n if (typeof this.props.sticky !== 'undefined') {\n return this.props.sticky;\n }\n\n if (this.isMobileLayout) {\n return false;\n }\n\n return true;\n }\n\n private renderMain() {\n const { isReadyToFix } = this.state;\n\n const isStickyDesktop = !this.isMobileLayout && this.getStickyProp() && isReadyToFix;\n const isStickyMobile = this.isMobileLayout && this.getStickyProp();\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div data-tid={SidePageHeaderDataTids.root} ref={this.wrapperRef} className={styles.headerWrapper()}>\n {isStickyDesktop \|\| isStickyMobile ? (\n <Sticky ref={this.stickyRef} side=\"top\">\n {this.renderHeader}\n </Sticky>\n ) : (\n this.renderHeader()\n )}\n </div>\n </CommonWrapper>\n );\n }\n\n private renderHeader = (fixed = false) => {\n return (\n <div\n className={cx(styles.header(this.theme), {\n [styles.headerFixed(this.theme)]: fixed,\n [styles.mobileHeader(this.theme)]: this.isMobileLayout,\n })}\n >\n {this.renderClose(fixed)}\n <div\n className={cx(styles.title(this.theme), {\n [styles.mobileTitle(this.theme)]: this.isMobileLayout,\n [styles.titleFixed()]: fixed,\n })}\n >\n {isFunction(this.props.children) ? this.props.children(fixed) : this.props.children}\n </div>\n </div>\n );\n };\n\n private renderClose = (fixed: boolean) => {\n const stickyOffset = parseInt(this.theme.sidePageHeaderStickyOffset);\n return (\n <div\n className={cx(styles.wrapperClose(this.theme), {\n [styles.wrapperCloseFixed(this.theme)]: fixed,\n [styles.mobileWrapperClose(this.theme)]: this.isMobileLayout,\n })}\n >\n {this.isMobileLayout ? (\n this.closeIcon()\n ) : (\n <Sticky side=\"top\" offset={stickyOffset}>\n {this.closeIcon}\n </Sticky>\n )}\n </div>\n );\n };\n\n private closeIcon = () => (\n <SidePageContext.Consumer>\n {({ requestClose }) => (\n <button\n className={cx(styles.close(this.theme), {\n [styles.closeFocus(this.theme)]: this.state.focusedByTab,\n })}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n onClick={requestClose}\n data-tid={SidePageHeaderDataTids.close}\n tabIndex={0}\n >\n <CrossIcon />\n </button>\n )}\n </SidePageContext.Consumer>\n );\n\n private updateReadyToFix = () => {\n if (this.wrapper) {\n const wrapperScrolledUp = getDOMRect(this.wrapper).top;\n const isReadyToFix = this.regularHeight + wrapperScrolledUp <= this.fixedHeaderHeight;\n this.setState((state) => (state.isReadyToFix !== isReadyToFix ? { ...state, isReadyToFix } : state));\n }\n };\n\n private wrapperRef = (el: HTMLElement \| null) => {\n this.wrapper = el;\n };\n\n private stickyRef = (el: Sticky \| null) => {\n this.sticky = el;\n };\n\n private handleFocus = () => {\n requestAnimationFrame(() => {\n if (keyListener.isTabPressed) {\n this.setState({ focusedByTab: true });\n }\n });\n };\n\n private handleBlur = () => {\n this.setState({ focusedByTab: false });\n };\n}\n"]}

package/components/SidePage/SidePageHeader.d.ts CHANGED Viewed

@@ -1,7 +1,7 @@
 import React from 'react';
 import { CommonProps } from '../../internal/CommonWrapper';
 import { SidePageContextType } from './SidePageContext';
-export interface SidePageHeaderProps extends CommonProps {
+export interface SidePageHeaderProps extends Omit<CommonProps, 'children'> {
     children?: React.ReactNode | ((fixed: boolean) => React.ReactNode);
     sticky?: boolean;
 }

package/components/Spinner/Spinner/Spinner.js CHANGED Viewed

@@ -11,6 +11,7 @@ import { SpinnerIcon } from "../../../internal/icons/SpinnerIcon";
 import { CommonWrapper } from "../../../internal/CommonWrapper";
 import { cx } from "../../../lib/theming/Emotion";
 import { rootNode } from "../../../lib/rootNode";
+import { createPropsGetter } from "../../../lib/createPropsGetter";
 import { styles } from "../Spinner.styles";
 import { SpinnerLocaleHelper } from "../locale";
 var types = {
@@ -21,11 +22,11 @@ var types = {
 export var SpinnerDataTids = {
   root: 'Spinner__root'
 };
+export
 /**
- * DRAFT - инлайн-лоадер
- */
-export var Spinner = (_dec = locale('Spinner', SpinnerLocaleHelper), rootNode(_class = _dec(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
+* Используйте компонент `Spinner`, если вам нужен спиннер, без дополнительного функционала, который предоставляет компонент [Loader](https://tech.skbkontur.ru/react-ui/#/Components/Loader)
+*/
+var Spinner = (_dec = locale('Spinner', SpinnerLocaleHelper), rootNode(_class = _dec(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
   _inheritsLoose(Spinner, _React$Component);
   function Spinner() {
@@ -36,13 +37,14 @@ export var Spinner = (_dec = locale('Spinner', SpinnerLocaleHelper), rootNode(_c
     }
     _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
+    _this.getProps = createPropsGetter(Spinner.defaultProps);
     _this.renderSpinner = function (type, dimmed, inline) {
       var _cx;
       return /*#__PURE__*/React.createElement(SpinnerIcon, {
         size: type,
-        className: cx((_cx = {}, _cx[styles.circle(_this.theme)] = !dimmed && !_this.props.color, _cx[styles.circleDimmedColor(_this.theme)] = dimmed, _cx[styles.circleWithoutColorAnimation(_this.theme)] = dimmed || !!_this.props.color, _cx)),
+        className: cx((_cx = {}, _cx[styles.circle(_this.theme)] = !dimmed && !_this.props.color, _cx[styles.circleDimmedColor(_this.theme)] = dimmed, _cx[styles.circleWithoutColorAnimation()] = dimmed || !!_this.props.color, _cx)),
         dimmed: dimmed,
         width: _this.props.width,
         color: _this.props.color,
@@ -72,11 +74,11 @@ export var Spinner = (_dec = locale('Spinner', SpinnerLocaleHelper), rootNode(_c
   _proto.renderMain = function renderMain() {
     var _this$props = this.props,
-        type = _this$props.type,
         _this$props$caption = _this$props.caption,
         caption = _this$props$caption === void 0 ? this.locale.loading : _this$props$caption,
         dimmed = _this$props.dimmed,
         inline = _this$props.inline;
+    var type = this.getProps().type;
     return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
       rootNodeRef: this.setRootNode
     }, this.props), /*#__PURE__*/React.createElement("div", {

package/components/Spinner/Spinner/Spinner.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["Spinner.tsx"],"names":["React","PropTypes","locale","ThemeContext","SpinnerIcon","CommonWrapper","cx","rootNode","styles","SpinnerLocaleHelper","types","big","mini","normal","SpinnerDataTids","root","Spinner","renderSpinner","type","dimmed","inline","circle","theme","props","color","circleDimmedColor","circleWithoutColorAnimation","width","renderCaption","caption","captionColor","render","renderMain","loading","setRootNode","spinner","inner","Component","__KONTUR_REACT_UI__","propTypes","node","bool","oneOf","Object","keys","~~defaultProps","~~Types"],"mappings":"iKAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;;AAEA,SAASC,MAAT,QAAuB,6BAAvB;;AAEA,SAASC,YAAT,QAA6B,gCAA7B;AACA,SAASC,WAAT,QAA4B,kCAA5B;AACA,SAAsBC,aAAtB,QAA2C,8BAA3C;AACA,SAASC,EAAT,QAAmB,2BAAnB;AACA,SAASC,QAAT,QAAuC,oBAAvC;;AAEA,SAASC,MAAT,QAAuB,kBAAvB;AACA,SAAwBC,mBAAxB,QAAmD,UAAnD;;AAEA,IAAMC,KAAuC,GAAG;AAC9CC,EAAAA,GAAG,EAAE,KADyC;AAE9CC,EAAAA,IAAI,EAAE,MAFwC;AAG9CC,EAAAA,MAAM,EAAE,QAHsC,EAAhD~~;;;;;;;;;;;;;;;;;;;;;;;;AA2BA~~,OAAO,IAAMC,eAAe,GAAG;AAC7BC,EAAAA,IAAI,EAAE,eADuB,EAAxB~~;;;AAIP~~;AACA;AACA~~;;;;AAIA~~,~~WAAaC~~,OAAb,~~WADCd~~,MAAM,CAAC,SAAD,~~EAAYO~~,mBAAZ,CACP,~~EAFCF~~,QAED~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwDUU~~,IAAAA,~~aAxDV~~,~~GAwD0B~~,UAACC,IAAD,EAAoBC,MAApB,EAAsCC,MAAtC,EAA2D;AACjF;AACE,4BAAC,WAAD;AACE,UAAA,IAAI,EAAEF,IADR;AAEE,UAAA,SAAS,~~EAAEZ~~,EAAE;~~AACVE~~,UAAAA,MAAM,~~CAACa~~,MAAP,CAAc,MAAKC,KAAnB,CADU,IACkB,CAACH,MAAD,IAAW,CAAC,MAAKI,KAAL,CAAWC,KADzC;~~AAEVhB~~,UAAAA,MAAM,~~CAACiB~~,iBAAP,CAAyB,MAAKH,KAA9B,CAFU,IAE6BH,MAF7B;~~AAGVX~~,UAAAA,MAAM,~~CAACkB~~,2BAAP,~~CAAmC~~,~~MAAKJ~~,~~KAAxC,CAHU,IAGuCH,~~MAAM,IAAI,CAAC,CAAC,MAAKI,KAAL,CAAWC,~~KAH9D~~,OAFf;;AAOE,UAAA,MAAM,EAAEL,MAPV;AAQE,UAAA,KAAK,EAAE,MAAKI,KAAL,CAAWI,KARpB;AASE,UAAA,KAAK,EAAE,MAAKJ,KAAL,CAAWC,KATpB;AAUE,UAAA,MAAM,EAAEJ,MAVV,GADF;;;AAcD,~~KAvEH~~;;~~AAyEUQ~~,IAAAA,~~aAzEV~~,~~GAyE0B~~,UAACV,IAAD,EAAoBW,OAApB;AACtB,sCAAM,SAAS,~~EAAEvB~~,EAAE,~~CAACE~~,MAAM,~~CAACU~~,IAAD,CAAN,CAAa,MAAKI,KAAlB,CAAD,~~EAA2Bd~~,MAAM,~~CAACsB~~,YAAP,CAAoB,MAAKR,KAAzB,CAA3B,CAAnB,IAAiFO,OAAjF,CADsB,~~GAzE1B~~,~~qDAgCSE~~,~~MAhCT~~,~~GAgCE~~,kBAAgB,mBACd,oBACE,oBAAC,YAAD,CAAc,QAAd,QACG,UAACT,KAAD,EAAW,CACV,MAAI,CAACA,KAAL,GAAaA,KAAb,CACA,OAAO,MAAI,CAACU,UAAL,EAAP,CACD,CAJH,CADF,CAQD,~~CAzCH~~,~~QA2CUA~~,~~UA3CV~~,~~GA2CE~~,sBAAqB,CACnB,~~kBAAgE~~,KAAKT,~~KAArE~~,~~CAAQL~~,~~IAAR~~,~~eAAQA~~,~~IAAR~~,~~mCAAcW~~,~~OAAd~~,~~CAAcA~~,~~OAAd~~,~~oCAAwB~~,~~KAAK3B~~,~~MAAL~~,~~CAAY~~+B,~~OAApC~~,~~uBAA6Cd~~,~~MAA7C~~,~~eAA6CA~~,~~MAA7C~~,~~CAAqDC~~,~~MAArD~~,~~eAAqDA~~,~~MAArD~~,CAEA,oBACE,oBAAC,aAAD,aAAe,WAAW,EAAE,~~KAAKc~~,WAAjC,IAAkD,KAAKX,KAAvD,gBACE,6BAAK,~~YAAUT~~,eAAe,CAACC,IAA/B,EAAqC,SAAS,EAAEP,MAAM,~~CAAC2B~~,OAAP,EAAhD,iBACE,8BAAM,SAAS,~~EAAE3B~~,MAAM,~~CAAC4B~~,KAAP,EAAjB,IAAkC,KAAKnB,aAAL,CAAmBC,IAAnB,EAAyBC,MAAzB,EAAiCC,MAAjC,CAAlC,CADF,EAEGS,OAAO,IAAI,KAAKD,aAAL,CAAmBV,IAAnB,EAAyBW,OAAzB,CAFd,CADF,CADF,CAQD,~~CAtDH~~,~~kBAA6B7B~~,KAAK,~~CAACqC~~,SAAnC,WACgBC,mBADhB,GACsC,SADtC,UAGgBC,SAHhB,GAG4B,EACxB;AACJ;AACA;AACA;AACA,KACIV,OAAO,~~EAAE5B~~,SAAS,~~CAACuC~~,IANK,EAQxBrB,MAAM,~~EAAElB~~,SAAS,~~CAACwC~~,IARM,EAUxB;AACJ;AACA;AACA;AACA;AACA;AACA,KACIvB,IAAI,~~EAAEjB~~,SAAS,~~CAACyC~~,KAAV,CAAgBC,MAAM,CAACC,IAAP,~~CAAYlC~~,KAAZ,CAAhB,CAjBkB,EAH5B,~~UAuBgBmC~~,YAvBhB,GAuB6C,~~EACzC3B~~,IAAI,EAAE,QADmC,EAvB7C,~~UA2BgB4B~~,~~KA3BhB~~,~~GA2BsCpC~~,~~KA3BtC~~","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { locale } from '../../lib/locale/decorators';\nimport { Theme } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { SpinnerIcon } from '../../internal/icons/SpinnerIcon';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { styles } from './Spinner.styles';\nimport { SpinnerLocale, SpinnerLocaleHelper } from './locale';\n\nconst types: Record<SpinnerType, SpinnerType> = {\n big: 'big',\n mini: 'mini',\n normal: 'normal',\n};\n\nexport type SpinnerType = 'mini' \| 'normal' \| 'big';\n\nexport interface SpinnerProps extends CommonProps {\n caption?: React.ReactNode;\n dimmed?: boolean;\n /*\n ~~Тип~~ ~~спиннера\~~n * @default normal\n /\n type: SpinnerType;\n inline?: boolean;\n /\n Толщина спиннера\n /\n width?: number;\n /\n Цвет спиннера\n /\n color?: React.CSSProperties['color'];\n}\n\nexport const SpinnerDataTids = {\n root: 'Spinner__root',\n} as const;\n\n/\n ~~DRAFT~~ - ~~инлайн-лоадер\~~n /\n\n@rootNode\n@locale('Spinner', SpinnerLocaleHelper)\nexport class Spinner extends React.Component<SpinnerProps> {\n public static __KONTUR_REACT_UI__ = 'Spinner';\n\n public static propTypes = {\n /\n Текст рядом с мини-лоадером.\n \n 'Загрузка' - значение по-умолчанию\n /\n caption: PropTypes.node,\n\n dimmed: PropTypes.bool,\n\n /\n Тип спиннера: mini, normal, big\n \n Значение по-умолчанию - normal\n \n Spinner.types - все доступные типы\n */\n type: PropTypes.oneOf(Object.keys(types)),\n };\n\n public static defaultProps: ~~SpinnerProps~~ = {\n type: 'normal',\n };\n\n public static Types: typeof types = types;\n private theme!: Theme;\n private readonly locale!: SpinnerLocale;\n private setRootNode!: TSetRootNode;\n\n public render() {\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 { ~~type,~~ caption = this.locale.loading, dimmed, inline } = this.props;\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div data-tid={SpinnerDataTids.root} className={styles.spinner()}>\n <span className={styles.inner()}>{this.renderSpinner(type, dimmed, inline)}</span>\n {caption && this.renderCaption(type, caption)}\n </div>\n </CommonWrapper>\n );\n }\n\n private renderSpinner = (type: SpinnerType, dimmed?: boolean, inline?: boolean) => {\n return (\n <SpinnerIcon\n size={type}\n className={cx({\n [styles.circle(this.theme)]: !dimmed && !this.props.color,\n [styles.circleDimmedColor(this.theme)]: dimmed,\n [styles.circleWithoutColorAnimation(~~this.theme~~)]: dimmed \|\| !!this.props.color,\n })}\n dimmed={dimmed}\n width={this.props.width}\n color={this.props.color}\n inline={inline}\n />\n );\n };\n\n private renderCaption = (type: SpinnerType, caption: React.ReactNode) => (\n <span className={cx(styles[type](this.theme), styles.captionColor(this.theme))}>{caption}</span>\n );\n}\n"]}
1	+ {"version":3,"sources":["Spinner.tsx"],"names":["React","PropTypes","locale","ThemeContext","SpinnerIcon","CommonWrapper","cx","rootNode","createPropsGetter","styles","SpinnerLocaleHelper","types","big","mini","normal","SpinnerDataTids","root","Spinner","getProps","defaultProps","renderSpinner","type","dimmed","inline","circle","theme","props","color","circleDimmedColor","circleWithoutColorAnimation","width","renderCaption","caption","captionColor","render","renderMain","loading","setRootNode","spinner","inner","Component","__KONTUR_REACT_UI__","propTypes","node","bool","oneOf","Object","keys","Types"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { locale } from '../../lib/locale/decorators';\nimport { Theme } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { SpinnerIcon } from '../../internal/icons/SpinnerIcon';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { styles } from './Spinner.styles';\nimport { SpinnerLocale, SpinnerLocaleHelper } from './locale';\n\nconst types: Record<SpinnerType, SpinnerType> = {\n big: 'big',\n mini: 'mini',\n normal: 'normal',\n};\n\nexport type SpinnerType = 'mini' \| 'normal' \| 'big';\n\nexport interface SpinnerProps extends CommonProps {\n /*\n Подпись под спиннером\n /\n caption?: React.ReactNode;\n /\n Переводит спиннер в \"затемнённый режим\"\n \n Цвет спиннера в \"затемнённом режиме\" определяется переменной `spinnerDimmedColor`\n /\n dimmed?: boolean;\n /\n Размер спиннера и текста\n \n @default normal\n /\n type?: SpinnerType;\n inline?: boolean;\n /\n Толщина спиннера\n /\n width?: number;\n /\n Цвет спиннера\n /\n color?: React.CSSProperties['color'];\n}\n\nexport const SpinnerDataTids = {\n root: 'Spinner__root',\n} as const;\n\ntype DefaultProps = Required<Pick<SpinnerProps, 'type'>>;\n\n/\n Используйте компонент `Spinner`, если вам нужен спиннер, без дополнительного функционала, который предоставляет компонент [Loader](https://tech.skbkontur.ru/react-ui/#/Components/Loader)\n /\n\n@rootNode\n@locale('Spinner', SpinnerLocaleHelper)\nexport class Spinner extends React.Component<SpinnerProps> {\n public static __KONTUR_REACT_UI__ = 'Spinner';\n\n public static propTypes = {\n /\n Текст рядом с мини-лоадером.\n \n 'Загрузка' - значение по-умолчанию\n /\n caption: PropTypes.node,\n\n dimmed: PropTypes.bool,\n\n /\n Тип спиннера: mini, normal, big\n \n Значение по-умолчанию - normal\n \n Spinner.types - все доступные типы\n */\n type: PropTypes.oneOf(Object.keys(types)),\n };\n\n public static defaultProps: DefaultProps = {\n type: 'normal',\n };\n\n private getProps = createPropsGetter(Spinner.defaultProps);\n\n public static Types: typeof types = types;\n private theme!: Theme;\n private readonly locale!: SpinnerLocale;\n private setRootNode!: TSetRootNode;\n\n public render() {\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 { caption = this.locale.loading, dimmed, inline } = this.props;\n const type = this.getProps().type;\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div data-tid={SpinnerDataTids.root} className={styles.spinner()}>\n <span className={styles.inner()}>{this.renderSpinner(type, dimmed, inline)}</span>\n {caption && this.renderCaption(type, caption)}\n </div>\n </CommonWrapper>\n );\n }\n\n private renderSpinner = (type: SpinnerType, dimmed?: boolean, inline?: boolean) => {\n return (\n <SpinnerIcon\n size={type}\n className={cx({\n [styles.circle(this.theme)]: !dimmed && !this.props.color,\n [styles.circleDimmedColor(this.theme)]: dimmed,\n [styles.circleWithoutColorAnimation()]: dimmed \|\| !!this.props.color,\n })}\n dimmed={dimmed}\n width={this.props.width}\n color={this.props.color}\n inline={inline}\n />\n );\n };\n\n private renderCaption = (type: SpinnerType, caption: React.ReactNode) => (\n <span className={cx(styles[type](this.theme), styles.captionColor(this.theme))}>{caption}</span>\n );\n}\n"]}

package/components/Spinner/Spinner.d.ts CHANGED Viewed

@@ -4,13 +4,22 @@ import { CommonProps } from '../../internal/CommonWrapper';
 declare const types: Record<SpinnerType, SpinnerType>;
 export declare type SpinnerType = 'mini' | 'normal' | 'big';
 export interface SpinnerProps extends CommonProps {
+    /**
+     * Подпись под спиннером
+     */
     caption?: React.ReactNode;
+    /**
+     * Переводит спиннер в "затемнённый режим"
+     *
+     * Цвет спиннера в "затемнённом режиме" определяется переменной `spinnerDimmedColor`
+     */
     dimmed?: boolean;
     /**
-     * Тип спиннера
+     * Размер спиннера и текста
+     *
      * @default normal
      */
-    type: SpinnerType;
+    type?: SpinnerType;
     inline?: boolean;
     /**
      * Толщина спиннера
@@ -24,8 +33,9 @@ export interface SpinnerProps extends CommonProps {
 export declare const SpinnerDataTids: {
     readonly root: "Spinner__root";
 };
+declare type DefaultProps = Required<Pick<SpinnerProps, 'type'>>;
 /**
- * DRAFT - инлайн-лоадер
+ * Используйте компонент `Spinner`, если вам нужен спиннер, без дополнительного функционала, который предоставляет компонент [Loader](https://tech.skbkontur.ru/react-ui/#/Components/Loader)
  */
 export declare class Spinner extends React.Component<SpinnerProps> {
     static __KONTUR_REACT_UI__: string;
@@ -46,7 +56,8 @@ export declare class Spinner extends React.Component<SpinnerProps> {
          */
         type: PropTypes.Requireable<string>;
     };
-    static defaultProps: SpinnerProps;
+    static defaultProps: DefaultProps;
+    private getProps;
     static Types: typeof types;
     private theme;
     private readonly locale;

package/components/Spinner/Spinner.styles/Spinner.styles.js CHANGED Viewed

@@ -7,13 +7,13 @@ import { AnimationKeyframes } from "../../../lib/theming/AnimationKeyframes";
 import { isIE11 } from "../../../lib/client";
 export var styles = memoizeStyle({
   circle: function circle(t) {
-    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      stroke: ", ";\n\n      ", "\n    "])), t.spinnerColor, !isIE11 && "\n          animation: " + AnimationKeyframes.spinnerCircleOffset(t) + " 1s cubic-bezier(0.5, 0.2, 0.5, 0.8) infinite,\n            " + AnimationKeyframes.spinnerCircleLength(t) + " 2s cubic-bezier(0.36, 0.14, 0.38, 0.69) infinite,\n            " + AnimationKeyframes.spinnerCircleRotate(t) + " 2s linear infinite,\n            " + AnimationKeyframes.spinnerColor(t) + " 6s ease-in-out infinite;\n        ");
+    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      stroke: ", ";\n\n      ", "\n    "])), t.spinnerColor, !isIE11 && "\n          animation: " + AnimationKeyframes.spinnerCircleOffset() + " 1s cubic-bezier(0.5, 0.2, 0.5, 0.8) infinite,\n            " + AnimationKeyframes.spinnerCircleLength() + " 2s cubic-bezier(0.36, 0.14, 0.38, 0.69) infinite,\n            " + AnimationKeyframes.spinnerCircleRotate() + " 2s linear infinite,\n            " + AnimationKeyframes.spinnerColor(t) + " 6s ease-in-out infinite;\n        ");
   },
   circleDimmedColor: function circleDimmedColor(t) {
     return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      stroke: ", ";\n    "])), t.spinnerDimmedColor);
   },
-  circleWithoutColorAnimation: function circleWithoutColorAnimation(t) {
-    return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      ", "\n    "])), !isIE11 && "\n          animation: " + AnimationKeyframes.spinnerCircleOffset(t) + " 1s cubic-bezier(0.5, 0.2, 0.5, 0.8) infinite,\n          " + AnimationKeyframes.spinnerCircleLength(t) + " 2s cubic-bezier(0.36, 0.14, 0.38, 0.69) infinite,\n          " + AnimationKeyframes.spinnerCircleRotate(t) + " 2s linear infinite;\n        ");
+  circleWithoutColorAnimation: function circleWithoutColorAnimation() {
+    return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      ", "\n    "])), !isIE11 && "\n          animation: " + AnimationKeyframes.spinnerCircleOffset() + " 1s cubic-bezier(0.5, 0.2, 0.5, 0.8) infinite,\n          " + AnimationKeyframes.spinnerCircleLength() + " 2s cubic-bezier(0.36, 0.14, 0.38, 0.69) infinite,\n          " + AnimationKeyframes.spinnerCircleRotate() + " 2s linear infinite;\n        ");
   },
   captionColor: function captionColor(t) {
     return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.spinnerCaptionColor);

package/components/Spinner/Spinner.styles/Spinner.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["Spinner.styles.ts"],"names":["css","memoizeStyle","AnimationKeyframes","isIE11","styles","circle","t","spinnerColor","spinnerCircleOffset","spinnerCircleLength","spinnerCircleRotate","circleDimmedColor","spinnerDimmedColor","circleWithoutColorAnimation","captionColor","spinnerCaptionColor","inline","mini","spinnerCaptionGapSmall","spinnerFontSizeSmall","spinnerLineHeightSmall","normal","spinnerFontSizeMedium","spinnerLineHeightMedium","spinnerCaptionGapMedium","big","spinnerFontSizeLarge","spinnerLineHeightLarge","spinnerCaptionGapLarge","spinner","inner"],"mappings":"uRAAA,SAASA,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;AAEA,SAASC,kBAAT,QAAmC,sCAAnC;AACA,SAASC,MAAT,QAAuB,kBAAvB;;AAEA,OAAO,IAAMC,MAAM,GAAGH,YAAY,CAAC;AACjCI,EAAAA,MADiC,kBAC1BC,CAD0B,EAChB;AACf,WAAON,GAAP;AACYM,IAAAA,CAAC,CAACC,YADd;;AAGI,KAACJ,MAAD;;AAEeD,IAAAA,kBAAkB,CAACM,mBAAnB,~~CAAuCF,CAAvC,CAFf~~;~~AAGMJ~~,IAAAA,kBAAkB,CAACO,mBAAnB,~~CAAuCH,CAAvC,CAHN~~;~~AAIMJ~~,IAAAA,kBAAkB,CAACQ,mBAAnB,~~CAAuCJ,CAAvC,CAJN~~;~~AAKMJ~~,IAAAA,kBAAkB,CAACK,YAAnB,CAAgCD,CAAhC,CALN,wCAHJ;;;AAWD,GAbgC;AAcjCK,EAAAA,iBAdiC,6BAcfL,CAde,EAcL;AAC1B,WAAON,GAAP;AACYM,IAAAA,CAAC,CAACM,kBADd;;AAGD,GAlBgC;AAmBjCC,EAAAA,2BAnBiC,~~uCAmBLP,CAnBK,EAmBK~~;~~AACpC~~,~~WAAON~~,GAAP;AACI,KAACG,MAAD;;AAEeD,IAAAA,kBAAkB,CAACM,mBAAnB,~~CAAuCF,CAAvC,CAFf~~;~~AAGIJ~~,IAAAA,kBAAkB,CAACO,mBAAnB,~~CAAuCH,CAAvC,CAHJ~~;~~AAIIJ~~,IAAAA,kBAAkB,CAACQ,mBAAnB,~~CAAuCJ~~,~~CAAvC,CAJJ,~~mCADJ;;;AAQD,GA5BgC;;~~AA8BjCQ~~,EAAAA,YA9BiC,wBA8BpBR,CA9BoB,EA8BV;AACrB,WAAON,GAAP;AACWM,IAAAA,CAAC,CAACS,mBADb;;AAGD,GAlCgC;;AAoCjCC,EAAAA,MApCiC,oBAoCxB;AACP,WAAOhB,GAAP;;;;AAID,GAzCgC;;AA2CjCiB,EAAAA,IA3CiC,gBA2C5BX,CA3C4B,EA2ClB;AACb,WAAON,GAAP;AACiBM,IAAAA,CAAC,CAACY,sBADnB;AAEeZ,IAAAA,CAAC,CAACa,oBAFjB;AAGiBb,IAAAA,CAAC,CAACc,sBAHnB;;AAKD,GAjDgC;;AAmDjCC,EAAAA,MAnDiC,kBAmD1Bf,CAnD0B,EAmDhB;AACf,WAAON,GAAP;;AAEeM,IAAAA,CAAC,CAACgB,qBAFjB;AAGiBhB,IAAAA,CAAC,CAACiB,uBAHnB;AAIgBjB,IAAAA,CAAC,CAACkB,uBAJlB;;AAMD,GA1DgC;;AA4DjCC,EAAAA,GA5DiC,eA4D7BnB,CA5D6B,EA4DnB;AACZ,WAAON,GAAP;;AAEeM,IAAAA,CAAC,CAACoB,oBAFjB;AAGiBpB,IAAAA,CAAC,CAACqB,sBAHnB;AAIgBrB,IAAAA,CAAC,CAACsB,sBAJlB;;AAMD,GAnEgC;;AAqEjCC,EAAAA,OArEiC,qBAqEvB;AACR,WAAO7B,GAAP;;;;;AAKD,GA3EgC;;AA6EjC8B,EAAAA,KA7EiC,mBA6EzB;AACN,WAAO9B,GAAP;;;AAGD,GAjFgC,EAAD,CAA3B","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { AnimationKeyframes } from '../../lib/theming/AnimationKeyframes';\nimport { isIE11 } from '../../lib/client';\n\nexport const styles = memoizeStyle({\n circle(t: Theme) {\n return css`\n stroke: ${t.spinnerColor};\n\n ${!isIE11 &&\n `\n animation: ${AnimationKeyframes.spinnerCircleOffset(t)} 1s cubic-bezier(0.5, 0.2, 0.5, 0.8) infinite,\n ${AnimationKeyframes.spinnerCircleLength(t)} 2s cubic-bezier(0.36, 0.14, 0.38, 0.69) infinite,\n ${AnimationKeyframes.spinnerCircleRotate(t)} 2s linear infinite,\n ${AnimationKeyframes.spinnerColor(t)} 6s ease-in-out infinite;\n `}\n `;\n },\n circleDimmedColor(t: Theme) {\n return css`\n stroke: ${t.spinnerDimmedColor};\n `;\n },\n circleWithoutColorAnimation(~~t: Theme~~) {\n return css`\n ${!isIE11 &&\n `\n animation: ${AnimationKeyframes.spinnerCircleOffset(t)} 1s cubic-bezier(0.5, 0.2, 0.5, 0.8) infinite,\n ${AnimationKeyframes.spinnerCircleLength(t)} 2s cubic-bezier(0.36, 0.14, 0.38, 0.69) infinite,\n ${AnimationKeyframes.spinnerCircleRotate(t)} 2s linear infinite;\n `}\n `;\n },\n\n captionColor(t: Theme) {\n return css`\n color: ${t.spinnerCaptionColor};\n `;\n },\n\n inline() {\n return css`\n font-size: inherit;\n line-height: inherit;\n `;\n },\n\n mini(t: Theme) {\n return css`\n margin-left: ${t.spinnerCaptionGapSmall};\n font-size: ${t.spinnerFontSizeSmall};\n line-height: ${t.spinnerLineHeightSmall};\n `;\n },\n\n normal(t: Theme) {\n return css`\n display: block;\n font-size: ${t.spinnerFontSizeMedium};\n line-height: ${t.spinnerLineHeightMedium};\n margin-top: ${t.spinnerCaptionGapMedium};\n `;\n },\n\n big(t: Theme) {\n return css`\n display: block;\n font-size: ${t.spinnerFontSizeLarge};\n line-height: ${t.spinnerLineHeightLarge};\n margin-top: ${t.spinnerCaptionGapLarge};\n `;\n },\n\n spinner() {\n return css`\n display: inline-block;\n text-align: center;\n line-height: normal;\n `;\n },\n\n inner() {\n return css`\n display: inline-block;\n `;\n },\n});\n"]}
1	+ {"version":3,"sources":["Spinner.styles.ts"],"names":["css","memoizeStyle","AnimationKeyframes","isIE11","styles","circle","t","spinnerColor","spinnerCircleOffset","spinnerCircleLength","spinnerCircleRotate","circleDimmedColor","spinnerDimmedColor","circleWithoutColorAnimation","captionColor","spinnerCaptionColor","inline","mini","spinnerCaptionGapSmall","spinnerFontSizeSmall","spinnerLineHeightSmall","normal","spinnerFontSizeMedium","spinnerLineHeightMedium","spinnerCaptionGapMedium","big","spinnerFontSizeLarge","spinnerLineHeightLarge","spinnerCaptionGapLarge","spinner","inner"],"mappings":"uRAAA,SAASA,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;AAEA,SAASC,kBAAT,QAAmC,sCAAnC;AACA,SAASC,MAAT,QAAuB,kBAAvB;;AAEA,OAAO,IAAMC,MAAM,GAAGH,YAAY,CAAC;AACjCI,EAAAA,MADiC,kBAC1BC,CAD0B,EAChB;AACf,WAAON,GAAP;AACYM,IAAAA,CAAC,CAACC,YADd;;AAGI,KAACJ,MAAD;;AAEeD,IAAAA,kBAAkB,CAACM,mBAAnB,EAFf;AAGMN,IAAAA,kBAAkB,CAACO,mBAAnB,EAHN;AAIMP,IAAAA,kBAAkB,CAACQ,mBAAnB,EAJN;AAKMR,IAAAA,kBAAkB,CAACK,YAAnB,CAAgCD,CAAhC,CALN,wCAHJ;;;AAWD,GAbgC;AAcjCK,EAAAA,iBAdiC,6BAcfL,CAde,EAcL;AAC1B,WAAON,GAAP;AACYM,IAAAA,CAAC,CAACM,kBADd;;AAGD,GAlBgC;AAmBjCC,EAAAA,2BAnBiC,yCAmBH;AAC5B,WAAOb,GAAP;AACI,KAACG,MAAD;;AAEeD,IAAAA,kBAAkB,CAACM,mBAAnB,EAFf;AAGIN,IAAAA,kBAAkB,CAACO,mBAAnB,EAHJ;AAIIP,IAAAA,kBAAkB,CAACQ,mBAAnB,EAJJ,mCADJ;;;AAQD,GA5BgC;;AA8BjCI,EAAAA,YA9BiC,wBA8BpBR,CA9BoB,EA8BV;AACrB,WAAON,GAAP;AACWM,IAAAA,CAAC,CAACS,mBADb;;AAGD,GAlCgC;;AAoCjCC,EAAAA,MApCiC,oBAoCxB;AACP,WAAOhB,GAAP;;;;AAID,GAzCgC;;AA2CjCiB,EAAAA,IA3CiC,gBA2C5BX,CA3C4B,EA2ClB;AACb,WAAON,GAAP;AACiBM,IAAAA,CAAC,CAACY,sBADnB;AAEeZ,IAAAA,CAAC,CAACa,oBAFjB;AAGiBb,IAAAA,CAAC,CAACc,sBAHnB;;AAKD,GAjDgC;;AAmDjCC,EAAAA,MAnDiC,kBAmD1Bf,CAnD0B,EAmDhB;AACf,WAAON,GAAP;;AAEeM,IAAAA,CAAC,CAACgB,qBAFjB;AAGiBhB,IAAAA,CAAC,CAACiB,uBAHnB;AAIgBjB,IAAAA,CAAC,CAACkB,uBAJlB;;AAMD,GA1DgC;;AA4DjCC,EAAAA,GA5DiC,eA4D7BnB,CA5D6B,EA4DnB;AACZ,WAAON,GAAP;;AAEeM,IAAAA,CAAC,CAACoB,oBAFjB;AAGiBpB,IAAAA,CAAC,CAACqB,sBAHnB;AAIgBrB,IAAAA,CAAC,CAACsB,sBAJlB;;AAMD,GAnEgC;;AAqEjCC,EAAAA,OArEiC,qBAqEvB;AACR,WAAO7B,GAAP;;;;;AAKD,GA3EgC;;AA6EjC8B,EAAAA,KA7EiC,mBA6EzB;AACN,WAAO9B,GAAP;;;AAGD,GAjFgC,EAAD,CAA3B","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { AnimationKeyframes } from '../../lib/theming/AnimationKeyframes';\nimport { isIE11 } from '../../lib/client';\n\nexport const styles = memoizeStyle({\n circle(t: Theme) {\n return css`\n stroke: ${t.spinnerColor};\n\n ${!isIE11 &&\n `\n animation: ${AnimationKeyframes.spinnerCircleOffset()} 1s cubic-bezier(0.5, 0.2, 0.5, 0.8) infinite,\n ${AnimationKeyframes.spinnerCircleLength()} 2s cubic-bezier(0.36, 0.14, 0.38, 0.69) infinite,\n ${AnimationKeyframes.spinnerCircleRotate()} 2s linear infinite,\n ${AnimationKeyframes.spinnerColor(t)} 6s ease-in-out infinite;\n `}\n `;\n },\n circleDimmedColor(t: Theme) {\n return css`\n stroke: ${t.spinnerDimmedColor};\n `;\n },\n circleWithoutColorAnimation() {\n return css`\n ${!isIE11 &&\n `\n animation: ${AnimationKeyframes.spinnerCircleOffset()} 1s cubic-bezier(0.5, 0.2, 0.5, 0.8) infinite,\n ${AnimationKeyframes.spinnerCircleLength()} 2s cubic-bezier(0.36, 0.14, 0.38, 0.69) infinite,\n ${AnimationKeyframes.spinnerCircleRotate()} 2s linear infinite;\n `}\n `;\n },\n\n captionColor(t: Theme) {\n return css`\n color: ${t.spinnerCaptionColor};\n `;\n },\n\n inline() {\n return css`\n font-size: inherit;\n line-height: inherit;\n `;\n },\n\n mini(t: Theme) {\n return css`\n margin-left: ${t.spinnerCaptionGapSmall};\n font-size: ${t.spinnerFontSizeSmall};\n line-height: ${t.spinnerLineHeightSmall};\n `;\n },\n\n normal(t: Theme) {\n return css`\n display: block;\n font-size: ${t.spinnerFontSizeMedium};\n line-height: ${t.spinnerLineHeightMedium};\n margin-top: ${t.spinnerCaptionGapMedium};\n `;\n },\n\n big(t: Theme) {\n return css`\n display: block;\n font-size: ${t.spinnerFontSizeLarge};\n line-height: ${t.spinnerLineHeightLarge};\n margin-top: ${t.spinnerCaptionGapLarge};\n `;\n },\n\n spinner() {\n return css`\n display: inline-block;\n text-align: center;\n line-height: normal;\n `;\n },\n\n inner() {\n return css`\n display: inline-block;\n `;\n },\n});\n"]}

package/components/Spinner/Spinner.styles.d.ts CHANGED Viewed

@@ -2,7 +2,7 @@ import { Theme } from '../../lib/theming/Theme';
 export declare const styles: {
     circle(t: Theme): string;
     circleDimmedColor(t: Theme): string;
-    circleWithoutColorAnimation(t: Theme): string;
+    circleWithoutColorAnimation(): string;
     captionColor(t: Theme): string;
     inline(): string;
     mini(t: Theme): string;

package/components/Sticky/Sticky/Sticky.js CHANGED Viewed

@@ -13,10 +13,11 @@ import { CommonWrapper } from "../../../internal/CommonWrapper";
 import { cx } from "../../../lib/theming/Emotion";
 import { rootNode } from "../../../lib/rootNode";
 import { getDOMRect } from "../../../lib/dom/getDOMRect";
+import { createPropsGetter } from "../../../lib/createPropsGetter";
 import { styles } from "../Sticky.styles";
 var MAX_REFLOW_RETRIES = 5;
 export var StickyDataTids = {
-  root: 'Spinner__root'
+  root: 'Sticky__root'
 };
 export var Sticky = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
   _inheritsLoose(Sticky, _React$Component);
@@ -29,6 +30,7 @@ export var Sticky = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (
     }
     _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
+    _this.getProps = createPropsGetter(Sticky.defaultProps);
     _this.state = {
       fixed: false,
       deltaHeight: 0,
@@ -72,13 +74,15 @@ export var Sticky = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (
           height = _getDOMRect2.height;
       var _this$props = _this.props,
-          offset = _this$props.offset,
           getStop = _this$props.getStop,
           side = _this$props.side;
       var _this$state = _this.state,
           prevFixed = _this$state.fixed,
           _this$state$height = _this$state.height,
           prevHeight = _this$state$height === void 0 ? height : _this$state$height;
+      var offset = _this.getProps().offset;
       var fixed = side === 'top' ? top < offset : Math.floor(bottom) > windowHeight - offset;
       _this.setState({
@@ -152,9 +156,8 @@ export var Sticky = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (
     var _cx;
     var children = this.props.children;
-    var _this$props2 = this.props,
-        side = _this$props2.side,
-        offset = _this$props2.offset;
+    var side = this.props.side;
+    var offset = this.getProps().offset;
     var _this$state2 = this.state,
         fixed = _this$state2.fixed,
         stopped = _this$state2.stopped,

package/components/Sticky/Sticky/Sticky.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["Sticky.tsx"],"names":["React","PropTypes","shallowEqual","LayoutEvents","isFunction","ZIndex","CommonWrapper","cx","rootNode","getDOMRect","styles","MAX_REFLOW_RETRIES","StickyDataTids","root","Sticky","state","fixed","deltaHeight","stopped","relativeTop","layoutSubscription","remove","reflowCounter","refWrapper","ref","wrapper","refInner","inner","reflow","document","documentElement","Error","windowHeight","window","innerHeight","clientHeight","top","bottom","left","width","height","props","offset","getStop","side","prevFixed","prevHeight","Math","floor","setState","stop","stopRect","outerHeight","componentDidMount","addListener","componentWillUnmount","componentDidUpdate","prevProps","prevState","emit","render","children","innerStyle","setRootNode","container","Component","__KONTUR_REACT_UI__","propTypes","oneOfType","node","func","number","oneOf","isRequired","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport shallowEqual from 'shallowequal';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { Nullable } from '../../typings/utility-types';\nimport { isFunction } from '../../lib/utils';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\n\nimport { styles } from './Sticky.styles';\n\nconst MAX_REFLOW_RETRIES = 5;\n\nexport interface StickyProps extends CommonProps {\n side: 'top' \| 'bottom';\n /*\n Отступ в пикселях от края экрана, на сколько сдвигается элемент в залипшем состоянии\n * @default 0\n /\n offset: number;\n getStop?: () => Nullable<HTMLElement>;\n children?: React.ReactNode \| ((fixed: boolean) => React.ReactNode);\n}\n\nexport interface StickyState {\n fixed: boolean;\n deltaHeight: number;\n height?: number;\n width?: number;\n left?: number;\n stopped: boolean;\n relativeTop: number;\n}\n\nexport const StickyDataTids = {\n root: 'Spinner__root',\n} as const;\n\n@rootNode\nexport class Sticky extends React.Component<StickyProps, StickyState> {\n public static __KONTUR_REACT_UI__ = 'Sticky';\n\n public static propTypes = {\n children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\n\n /\n Функция, которая возвращает DOM-элемент, который нельзя пересекать.\n /\n getStop: PropTypes.func,\n\n /\n Отступ от границы в пикселях\n /\n offset: PropTypes.number,\n\n side: PropTypes.oneOf(['top', 'bottom']).isRequired,\n };\n\n public static defaultProps = { offset: 0 };\n\n public state: StickyState = {\n fixed: false,\n deltaHeight: 0,\n stopped: false,\n relativeTop: 0,\n };\n\n private wrapper: Nullable<HTMLElement>;\n private inner: Nullable<HTMLElement>;\n private layoutSubscription: { remove: Nullable<() => void> } = { remove: null };\n private reflowCounter = 0;\n private setRootNode!: TSetRootNode;\n\n public componentDidMount() {\n this.reflow();\n\n this.layoutSubscription = LayoutEvents.addListener(this.reflow);\n }\n\n public componentWillUnmount() {\n if (this.layoutSubscription.remove) {\n this.layoutSubscription.remove();\n }\n }\n\n public componentDidUpdate(prevProps: StickyProps, prevState: StickyState) {\n if (!shallowEqual(prevProps, this.props) \|\| !shallowEqual(prevState, this.state)) {\n if (this.reflowCounter < MAX_REFLOW_RETRIES) {\n LayoutEvents.emit();\n this.reflowCounter += 1;\n return;\n }\n }\n this.reflowCounter = 0;\n }\n\n public render() {\n let { children } = this.props;\n const { side, offset } = this.props;\n const { fixed, stopped, relativeTop, deltaHeight, width, height, left } = this.state;\n const innerStyle: React.CSSProperties = {};\n\n if (fixed) {\n if (stopped) {\n innerStyle.top = relativeTop;\n innerStyle[side === 'top' ? 'marginTop' : 'marginBottom'] = deltaHeight;\n } else {\n innerStyle.width = width;\n innerStyle[side] = offset;\n innerStyle.left = left;\n }\n }\n\n if (isFunction(children)) {\n children = children(fixed);\n }\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div data-tid={StickyDataTids.root} ref={this.refWrapper} className={styles.wrapper()}>\n <ZIndex\n priority=\"Sticky\"\n applyZIndex={fixed}\n className={cx(styles.inner(), {\n [styles.fixed()]: fixed && !stopped,\n [styles.stopped()]: stopped,\n })}\n style={innerStyle}\n wrapperRef={this.refInner}\n >\n <div className={styles.container()}>{children}</div>\n </ZIndex>\n {fixed && !stopped ? <div style={{ width, height }} /> : null}\n </div>\n </CommonWrapper>\n );\n }\n\n private refWrapper = (ref: Nullable<HTMLElement>) => (this.wrapper = ref);\n\n private refInner = (ref: Nullable<HTMLElement>) => (this.inner = ref);\n\n /\n Пересчитать габариты и позицию залипшего элемента\n \n @public\n */\n public reflow = () => {\n const { documentElement } = document;\n\n if (!documentElement) {\n throw Error('There is no \"documentElement\" in document');\n }\n\n const windowHeight = window.innerHeight \|\| documentElement.clientHeight;\n if (!this.wrapper \|\| !this.inner) {\n return;\n }\n const { top, bottom, left } = getDOMRect(this.wrapper);\n const { width, height } = getDOMRect(this.inner);\n const { offset, getStop, side } = this.props;\n const { fixed: prevFixed, height: prevHeight = height } = this.state;\n const fixed = side === 'top' ? top < offset : Math.floor(bottom) > windowHeight - offset;\n\n this.setState({ fixed, left });\n\n if (fixed && !prevFixed) {\n this.setState({ width, height });\n }\n\n if (fixed) {\n const stop = getStop && getStop();\n if (stop) {\n const deltaHeight = prevHeight - height;\n const stopRect = getDOMRect(stop);\n const outerHeight = height + offset;\n let stopped = false;\n let relativeTop = 0;\n\n if (side === 'top') {\n stopped = stopRect.top - outerHeight < 0;\n relativeTop = stopRect.top - prevHeight - top;\n } else {\n stopped = stopRect.bottom + outerHeight > windowHeight;\n relativeTop = stopRect.bottom - top;\n }\n\n this.setState({ relativeTop, deltaHeight, stopped });\n }\n }\n };\n}\n"]}
1	+ {"version":3,"sources":["Sticky.tsx"],"names":["React","PropTypes","shallowEqual","LayoutEvents","isFunction","ZIndex","CommonWrapper","cx","rootNode","getDOMRect","createPropsGetter","styles","MAX_REFLOW_RETRIES","StickyDataTids","root","Sticky","getProps","defaultProps","state","fixed","deltaHeight","stopped","relativeTop","layoutSubscription","remove","reflowCounter","refWrapper","ref","wrapper","refInner","inner","reflow","document","documentElement","Error","windowHeight","window","innerHeight","clientHeight","top","bottom","left","width","height","props","getStop","side","prevFixed","prevHeight","offset","Math","floor","setState","stop","stopRect","outerHeight","componentDidMount","addListener","componentWillUnmount","componentDidUpdate","prevProps","prevState","emit","render","children","innerStyle","setRootNode","container","Component","__KONTUR_REACT_UI__","propTypes","oneOfType","node","func","number","oneOf","isRequired"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport shallowEqual from 'shallowequal';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { Nullable } from '../../typings/utility-types';\nimport { isFunction } from '../../lib/utils';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { styles } from './Sticky.styles';\n\nconst MAX_REFLOW_RETRIES = 5;\n\nexport interface StickyProps extends Omit<CommonProps, 'children'> {\n side: 'top' \| 'bottom';\n /*\n Отступ в пикселях от края экрана, на сколько сдвигается элемент в залипшем состоянии\n * @default 0\n /\n offset?: number;\n getStop?: () => Nullable<HTMLElement>;\n children?: React.ReactNode \| ((fixed: boolean) => React.ReactNode);\n}\n\nexport interface StickyState {\n fixed: boolean;\n deltaHeight: number;\n height?: number;\n width?: number;\n left?: number;\n stopped: boolean;\n relativeTop: number;\n}\n\nexport const StickyDataTids = {\n root: 'Sticky__root',\n} as const;\n\ntype DefaultProps = Required<Pick<StickyProps, 'offset'>>;\n\n@rootNode\nexport class Sticky extends React.Component<StickyProps, StickyState> {\n public static __KONTUR_REACT_UI__ = 'Sticky';\n\n public static propTypes = {\n children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\n\n /\n Функция, которая возвращает DOM-элемент, который нельзя пересекать.\n /\n getStop: PropTypes.func,\n\n /\n Отступ от границы в пикселях\n /\n offset: PropTypes.number,\n\n side: PropTypes.oneOf(['top', 'bottom']).isRequired,\n };\n\n public static defaultProps: DefaultProps = { offset: 0 };\n\n private getProps = createPropsGetter(Sticky.defaultProps);\n\n public state: StickyState = {\n fixed: false,\n deltaHeight: 0,\n stopped: false,\n relativeTop: 0,\n };\n\n private wrapper: Nullable<HTMLElement>;\n private inner: Nullable<HTMLElement>;\n private layoutSubscription: { remove: Nullable<() => void> } = { remove: null };\n private reflowCounter = 0;\n private setRootNode!: TSetRootNode;\n\n public componentDidMount() {\n this.reflow();\n\n this.layoutSubscription = LayoutEvents.addListener(this.reflow);\n }\n\n public componentWillUnmount() {\n if (this.layoutSubscription.remove) {\n this.layoutSubscription.remove();\n }\n }\n\n public componentDidUpdate(prevProps: StickyProps, prevState: StickyState) {\n if (!shallowEqual(prevProps, this.props) \|\| !shallowEqual(prevState, this.state)) {\n if (this.reflowCounter < MAX_REFLOW_RETRIES) {\n LayoutEvents.emit();\n this.reflowCounter += 1;\n return;\n }\n }\n this.reflowCounter = 0;\n }\n\n public render() {\n let { children } = this.props;\n const { side } = this.props;\n const offset = this.getProps().offset;\n const { fixed, stopped, relativeTop, deltaHeight, width, height, left } = this.state;\n const innerStyle: React.CSSProperties = {};\n\n if (fixed) {\n if (stopped) {\n innerStyle.top = relativeTop;\n innerStyle[side === 'top' ? 'marginTop' : 'marginBottom'] = deltaHeight;\n } else {\n innerStyle.width = width;\n innerStyle[side] = offset;\n innerStyle.left = left;\n }\n }\n\n if (isFunction(children)) {\n children = children(fixed);\n }\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div data-tid={StickyDataTids.root} ref={this.refWrapper} className={styles.wrapper()}>\n <ZIndex\n priority=\"Sticky\"\n applyZIndex={fixed}\n className={cx(styles.inner(), {\n [styles.fixed()]: fixed && !stopped,\n [styles.stopped()]: stopped,\n })}\n style={innerStyle}\n wrapperRef={this.refInner}\n >\n <div className={styles.container()}>{children}</div>\n </ZIndex>\n {fixed && !stopped ? <div style={{ width, height }} /> : null}\n </div>\n </CommonWrapper>\n );\n }\n\n private refWrapper = (ref: Nullable<HTMLElement>) => (this.wrapper = ref);\n\n private refInner = (ref: Nullable<HTMLElement>) => (this.inner = ref);\n\n /\n Пересчитать габариты и позицию залипшего элемента\n \n @public\n */\n public reflow = () => {\n const { documentElement } = document;\n\n if (!documentElement) {\n throw Error('There is no \"documentElement\" in document');\n }\n\n const windowHeight = window.innerHeight \|\| documentElement.clientHeight;\n if (!this.wrapper \|\| !this.inner) {\n return;\n }\n const { top, bottom, left } = getDOMRect(this.wrapper);\n const { width, height } = getDOMRect(this.inner);\n const { getStop, side } = this.props;\n const { fixed: prevFixed, height: prevHeight = height } = this.state;\n const offset = this.getProps().offset;\n const fixed = side === 'top' ? top < offset : Math.floor(bottom) > windowHeight - offset;\n\n this.setState({ fixed, left });\n\n if (fixed && !prevFixed) {\n this.setState({ width, height });\n }\n\n if (fixed) {\n const stop = getStop && getStop();\n if (stop) {\n const deltaHeight = prevHeight - height;\n const stopRect = getDOMRect(stop);\n const outerHeight = height + offset;\n let stopped = false;\n let relativeTop = 0;\n\n if (side === 'top') {\n stopped = stopRect.top - outerHeight < 0;\n relativeTop = stopRect.top - prevHeight - top;\n } else {\n stopped = stopRect.bottom + outerHeight > windowHeight;\n relativeTop = stopRect.bottom - top;\n }\n\n this.setState({ relativeTop, deltaHeight, stopped });\n }\n }\n };\n}\n"]}

package/components/Sticky/Sticky.d.ts CHANGED Viewed

@@ -2,13 +2,13 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { Nullable } from '../../typings/utility-types';
 import { CommonProps } from '../../internal/CommonWrapper';
-export interface StickyProps extends CommonProps {
+export interface StickyProps extends Omit<CommonProps, 'children'> {
     side: 'top' | 'bottom';
     /**
      * Отступ в пикселях от края экрана, на сколько сдвигается элемент в залипшем состоянии
      * @default 0
      */
-    offset: number;
+    offset?: number;
     getStop?: () => Nullable<HTMLElement>;
     children?: React.ReactNode | ((fixed: boolean) => React.ReactNode);
 }
@@ -22,8 +22,9 @@ export interface StickyState {
     relativeTop: number;
 }
 export declare const StickyDataTids: {
-    readonly root: "Spinner__root";
+    readonly root: "Sticky__root";
 };
+declare type DefaultProps = Required<Pick<StickyProps, 'offset'>>;
 export declare class Sticky extends React.Component<StickyProps, StickyState> {
     static __KONTUR_REACT_UI__: string;
     static propTypes: {
@@ -38,9 +39,8 @@ export declare class Sticky extends React.Component<StickyProps, StickyState> {
         offset: PropTypes.Requireable<number>;
         side: PropTypes.Validator<string>;
     };
-    static defaultProps: {
-        offset: number;
-    };
+    static defaultProps: DefaultProps;
+    private getProps;
     state: StickyState;
     private wrapper;
     private inner;
@@ -60,3 +60,4 @@ export declare class Sticky extends React.Component<StickyProps, StickyState> {
      */
     reflow: () => void;
 }
+export {};