npm - @skbkontur/react-ui - Versions diffs - 6.4.6 → 6.4.7-9ac75.0 - Mend

@skbkontur/react-ui 6.4.6 → 6.4.7-9ac75.0

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 (908) hide show

package/components/SidePage/SidePage.css.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"SidePage.css.js","sourceRoot":"","sources":["SidePage.css.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAE1D,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAC7D,OAAO,EAAE,qBAAqB,EAAE,MAAM,2CAA2C,CAAC;AAClF,OAAO,EAAE,CAAC,EAAE,MAAM,8BAA8B,CAAC;AAEjD,MAAM,CAAC,IAAM,IAAI,GAAG,KAAK,CAAC;IACxB,MAAM,EAAE,MAAM;IACd,QAAQ,EAAE,OAAO;IACjB,GAAG,EAAE,CAAC;CACP,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,OAAO,GAAG,KAAK,CAAC;IAC3B,QAAQ,EAAE,OAAO;IACjB,GAAG,EAAE,CAAC;IACN,KAAK,EAAE,CAAC;IACR,MAAM,EAAE,CAAC;IACT,IAAI,EAAE,CAAC;CACR,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,IAAI,GAAG,KAAK,CAAC;IACxB,IAAI,EAAE,UAAU;IAChB,MAAM,EAAE,CAAC;IACT,KAAK,EAAE,CAAC,CAAC,kBAAkB;CAC5B,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,UAAU,GAAG,KAAK,CAAC;IAC9B,QAAQ,EAAE,EAAE;IACZ,UAAU,EAAE,MAAM;CACnB,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,SAAS,GAAG,KAAK,CAAC;IAC7B,WAAW,EAAE,CAAC,CAAC,mBAAmB;IAClC,YAAY,EAAE,CAAC,CAAC,oBAAoB;CACrC,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,sBAAsB,GAAG,KAAK,CAAC,EAAE,UAAU,EAAE,CAAC,CAAC,kBAAkB,EAAE,CAAC,CAAC;AAElF,MAAM,CAAC,IAAM,SAAS,GAAG,KAAK,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC,CAAC;AAEnD,MAAM,CAAC,IAAM,OAAO,GAAG,KAAK,CAAC;IAC3B,UAAU,EAAE,CAAC,CAAC,iBAAiB;IAC/B,KAAK,EAAE,OAAO;IACd,MAAM,EAAE,MAAM;IACd,KAAK,EAAE,MAAM;IACb,SAAS,EAAE,MAAM;IACjB,QAAQ,EAAE,UAAU;IACpB,UAAU,EAAE,QAAQ;IACpB,UAAU,EAAE,SAAS;IACrB,OAAO,EAAE,MAAM;IACf,aAAa,EAAE,QAAQ;CACxB,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,WAAW,GAAG,KAAK,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,CAAC;AAEpD,MAAM,CAAC,IAAM,iBAAiB,GAAG,KAAK,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC,CAAC;AAE3D,MAAM,CAAC,IAAM,kBAAkB,GAAG,KAAK,CAAC,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC,CAAC;AAE7D,MAAM,CAAC,IAAM,aAAa,GAAG,KAAK,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC,CAAC;AAEzD,MAAM,CAAC,IAAM,MAAM,GAAG,KAAK,CAAC;IAC1B,QAAQ,EAAE,CAAC,CAAC,sBAAsB;IAClC,UAAU,EAAE,CAAC,CAAC,wBAAwB;IACtC,OAAO,EAAE,UAAG,CAAC,CAAC,wBAAwB,gBAAM,CAAC,CAAC,2BAA2B,CAAE;IAC3E,KAAK,EAAE,MAAM;IACb,QAAQ,EAAE,UAAU;IACpB,KAAK,EAAE,CAAC,CAAC,uBAAuB;IAChC,UAAU,EAAE,CAAC,CAAC,wBAAwB;CACvC,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,YAAY,GAAG,KAAK,CAAC;IAChC,QAAQ,EAAE,CAAC,CAAC,4BAA4B;IACxC,UAAU,EAAE,CAAC,CAAC,8BAA8B;IAC5C,OAAO,EAAE,UAAG,CAAC,CAAC,8BAA8B,gBAAM,CAAC,CAAC,iCAAiC,CAAE;CACxF,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,WAAW,GAAG,KAAK,CAAC,EAAE,UAAU,EAAE,CAAC,CAAC,iBAAiB,EAAE,CAAC,CAAC;AAEtE,MAAM,CAAC,IAAM,iBAAiB,GAAG,KAAK,CAAC;IACrC,QAAQ,EAAE,QAAQ;IAClB,GAAG,EAAE,CAAC;IACN,MAAM,EAAE,KAAK;IACb,UAAU,EAAE,8CAAuC,CAAC,CAAC,2BAA2B,eAAK,CAAC,CAAC,iBAAiB,UAAO;CAChH,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,KAAK,GAAG,KAAK,CAAC;IACzB,WAAW,EAAE,CAAC,CAAC,mBAAmB;IAClC,YAAY,EAAE,eAAQ,CAAC,CAAC,gCAAgC,gBAAM,CAAC,CAAC,qBAAqB,gBAAM,CAAC,CAAC,iCAAiC,MAAG;CAClI,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,WAAW,GAAG,KAAK,CAAC;IAC/B,WAAW,EAAE,CAAC,CAAC,yBAAyB;IACxC,YAAY,EAAE,eAAQ,CAAC,CAAC,gCAAgC,oBAAU,CAAC,CAAC,qBAAqB,MAAG;CAC7F,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,QAAQ,GAAG,KAAK,CAAC;IAC5B,QAAQ,EAAE,QAAQ;IAClB,YAAY,EAAE,UAAU;IACxB,UAAU,EAAE,QAAQ;CACrB,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,UAAU,GAAG,KAAK,CAAC;IAC9B,MAAM,EAAE,MAAM;IACd,QAAQ,EAAE,UAAU;IACpB,KAAK,EAAE,MAAM;CACd,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,cAAc,GAAG,KAAK,CAAC;IAClC,UAAU,EAAE,CAAC,CAAC,iBAAiB;IAC/B,OAAO,EAAE,CAAC,CAAC,wBAAwB;CACpC,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,MAAM,GAAG,KAAK,CAAC,EAAE,SAAS,EAAE,CAAC,CAAC,uBAAuB,EAAE,CAAC,CAAC;AAEtE,kHAAkH;AAC1G,IAAO,UAAU,GAAiC,eAAe,MAAhD,EAAK,uBAAuB,UAAK,eAAe,EAAnE,SAAiD,CAAF,CAAqB;AAE1E,MAAM,CAAC,IAAM,KAAK,GAAG,KAAK,uBACrB,uBAAuB,KAC1B,MAAM,EAAE,SAAS,EACjB,KAAK,EAAE,CAAC,UAAU,EAAE,CAAC,CAAC,wBAAwB,CAAC,EAC/C,UAAU,EAAE,CAAC,CAAC,+BAA+B,EAC7C,SAAS,EAAE,oBAAa,CAAC,CAAC,+BAA+B,MAAG,EAC5D,YAAY,EAAE,CAAC,CAAC,iCAAiC,EACjD,WAAW,EAAE,oBAAa,CAAC,CAAC,iCAAiC,MAAG,EAChE,aAAa,EAAE,CAAC,CAAC,kCAAkC,EACnD,YAAY,EAAE,oBAAa,CAAC,CAAC,kCAAkC,MAAG,EAClE,WAAW,EAAE,CAAC,CAAC,gCAAgC,EAC/C,UAAU,EAAE,oBAAa,CAAC,CAAC,gCAAgC,MAAG,EAC9D,QAAQ,EAAE,CAAC,IACX,CAAC;AAEH,MAAM,CAAC,IAAM,WAAW,GAAG,KAAK,CAAC;IAC/B,UAAU,EAAE,CAAC,CAAC,oCAAoC;IAClD,SAAS,EAAE,oBAAa,CAAC,CAAC,oCAAoC,MAAG;IACjE,aAAa,EAAE,CAAC,CAAC,uCAAuC;IACxD,YAAY,EAAE,oBAAa,CAAC,CAAC,uCAAuC,MAAG;CACxE,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,WAAW,GAAG,KAAK,CAAC;IAC/B,OAAO,EAAE,CAAC,CAAC,kCAAkC;IAC7C,MAAM,EAAE,oBAAa,CAAC,CAAC,kCAAkC,MAAG;IAC5D,QAAQ,EAAE,CAAC;CACZ,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,UAAU,GAAG,KAAK,CAAC;IAC9B,SAAS,EAAE,0BAAmB,CAAC,CAAC,gBAAgB,CAAE;IAClD,YAAY,EAAE,CAAC;CAChB,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,YAAY,GAAG,KAAK,CAAC;IAChC,SAAS,EAAE,YAAY;IACvB,MAAM,EAAE,MAAM;IACd,UAAU,EAAE,CAAC,CAAC,wBAAwB;IACtC,OAAO,EAAE,UAAG,CAAC,CAAC,wBAAwB,gBAAM,CAAC,CAAC,2BAA2B,CAAE;IAC3E,QAAQ,EAAE,UAAU;IACpB,KAAK,EAAE,CAAC,CAAC,iCAAiC;IAC1C,GAAG,EAAE,CAAC,CAAC,mCAAmC;CAC3C,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,eAAe,GAAG,KAAK,CAAC;IACnC,MAAM,EAAE,MAAM;IACd,aAAa,EAAE,CAAC;CACjB,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,kBAAkB,GAAG,KAAK,CAAC;IACtC,UAAU,EAAE,CAAC,CAAC,8BAA8B;IAC5C,OAAO,EAAE,UAAG,CAAC,CAAC,8BAA8B,gBAAM,CAAC,CAAC,iCAAiC,CAAE;IACvF,KAAK,EAAE,CAAC,CAAC,gCAAgC;CAC1C,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,KAAK,GAAG,KAAK,CAAC;IACzB,UAAU,EAAE,CAAC,CAAC,qBAAqB;IACnC,OAAO,EAAE,UAAG,CAAC,CAAC,6BAA6B,cAAI,CAAC,CAAC,oBAAoB,cAAI,CAAC,CAAC,gCAAgC,cAAI,CAAC,CAAC,mBAAmB,CAAE;CACvI,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,iBAAiB,GAAG,KAAK,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC,wCAAwC,EAAE,CAAC,CAAC;AAE5F,uEAAuE;AACvE,MAAM,CAAC,IAAM,aAAa,GAAG,aAAa,CAAC;AAE3C,MAAM,CAAC,IAAM,MAAM,GAAG,KAAK,CAAC;IAC1B,MAAM,EAAE,CAAC;IACT,QAAQ,EAAE,OAAO;IACjB,MAAM,EAAE,EAAE;IACV,KAAK,EAAE,CAAC,CAAC,uBAAuB;CACjC,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,cAAc,GAAG,KAAK,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC;AAE5D,MAAM,CAAC,IAAM,aAAa,GAAG,KAAK,CAAC;IACjC,OAAO,EAAE,UAAG,CAAC,CAAC,wBAAwB,cAAI,CAAC,CAAC,oBAAoB,cAAI,CAAC,CAAC,2BAA2B,cAAI,CAAC,CAAC,mBAAmB,CAAE;CAC7H,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,mBAAmB,GAAG,KAAK,CAAC;IACvC,OAAO,EAAE,MAAM;IACf,QAAQ,EAAE,eAAe;IACzB,OAAO,EAAE,CAAC,CAAC,2BAA2B;CACvC,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,WAAW,GAAG,KAAK,CAAC,EAAE,UAAU,EAAE,CAAC,CAAC,iBAAiB,EAAE,CAAC,CAAC;AAEtE,MAAM,CAAC,IAAM,UAAU,GAAG,KAAK,CAAC,EAAE,CAAC,CAAC;AAEpC,MAAM,CAAC,IAAM,cAAc,GAAG,KAAK,CAAC,EAAE,SAAS,EAAE,mBAAmB,EAAE,CAAC,CAAC;AAExE,MAAM,CAAC,IAAM,eAAe,GAAG,KAAK,CAAC,EAAE,SAAS,EAAE,oBAAoB,EAAE,CAAC,CAAC;AAE1E,MAAM,CAAC,IAAM,gBAAgB,GAAG,KAAK,CAAC;IACpC,UAAU,EAAE,oGAAoG;IAChH,OAAO,EAAE,cAAc;IACvB,SAAS,EAAE,4BAA4B;CACxC,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,eAAe,GAAG,KAAK,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,CAAC;AAErD,MAAM,CAAC,IAAM,qBAAqB,GAAG,KAAK,CAAC;IACzC,OAAO,EAAE,iBAAiB;IAC1B,UAAU,EAAE,wBAAwB;CACrC,CAAC,CAAC;AAEH,mFAAmF;AACnF,MAAM,CAAC,IAAM,sBAAsB,GAAG,KAAK,CAAC,EAAE,aAAa,EAAE,CAAC,CAAC,qBAAqB,EAAE,CAAC,CAAC;AAExF,gFAAgF;AAChF,MAAM,CAAC,IAAM,kBAAkB,GAAG,sBAAsB,CAAC;AAEzD,MAAM,CAAC,IAAM,eAAe,GAAG,KAAK,CAAC;IACnC,WAAW,EAAE,CAAC,CAAC,yBAAyB;IACxC,YAAY,EAAE,CAAC,CAAC,0BAA0B;IAC1C,aAAa,EAAE,CAAC,CAAC,2BAA2B;CAC7C,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,4BAA4B,GAAG,KAAK,CAAC,EAAE,UAAU,EAAE,CAAC,CAAC,wBAAwB,EAAE,CAAC,CAAC;AAE9F,qFAAqF;AACrF,WAAW,CAAC,UAAG,WAAW,WAAQ,EAAE;IAClC,MAAM,EAAE,KAAK;IACb,OAAO,EAAE,IAAI;IACb,QAAQ,EAAE,UAAU;IACpB,MAAM,EAAE,CAAC;IACT,KAAK,EAAE,MAAM;IACb,IAAI,EAAE,CAAC;IACP,MAAM,EAAE,CAAC,CAAC;IACV,SAAS,EAAE,CAAC,CAAC,yBAAyB;CACvC,CAAC,CAAC;AAEH,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAC7B,WAAW,CAAC,UAAG,KAAK,qBAAW,KAAK,WAAQ,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,6BAA6B,EAAE,CAAC,CAAC;AAC1F,WAAW,CAAC,UAAG,KAAK,WAAQ,EAAE;IAC5B,KAAK,EAAE,CAAC,CAAC,qBAAqB;IAC9B,MAAM,EAAE,CAAC,CAAC,qBAAqB;IAC/B,SAAS,EAAE,aAAa;CACzB,CAAC,CAAC;AAEH,WAAW,CAAC,UAAG,WAAW,YAAS,EAAE;IACnC,GAAG,EAAE,KAAK;IACV,OAAO,EAAE,IAAI;IACb,QAAQ,EAAE,UAAU;IACpB,MAAM,EAAE,CAAC;IACT,KAAK,EAAE,MAAM;IACb,IAAI,EAAE,CAAC;IACP,MAAM,EAAE,CAAC,CAAC;IACV,SAAS,EAAE,CAAC,CAAC,yBAAyB;CACvC,CAAC,CAAC;AAEH,WAAW,CAAC,UAAG,UAAU,YAAS,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC,wBAAwB,EAAE,CAAC,CAAC;AAE/E,MAAM,CAAC,IAAM,MAAM,GAAG;IACpB,IAAI,MAAA;IACJ,OAAO,SAAA;IACP,IAAI,MAAA;IACJ,UAAU,YAAA;IACV,SAAS,WAAA;IACT,eAAe,iBAAA;IACf,sBAAsB,wBAAA;IACtB,4BAA4B,8BAAA;IAC5B,sBAAsB,wBAAA;IACtB,kBAAkB,oBAAA;IAClB,SAAS,WAAA;IACT,OAAO,SAAA;IACP,WAAW,aAAA;IACX,iBAAiB,mBAAA;IACjB,kBAAkB,oBAAA;IAClB,aAAa,eAAA;IACb,MAAM,QAAA;IACN,YAAY,cAAA;IACZ,WAAW,aAAA;IACX,iBAAiB,mBAAA;IACjB,KAAK,OAAA;IACL,WAAW,aAAA;IACX,QAAQ,UAAA;IACR,UAAU,YAAA;IACV,cAAc,gBAAA;IACd,MAAM,QAAA;IACN,KAAK,OAAA;IACL,WAAW,aAAA;IACX,WAAW,aAAA;IACX,UAAU,YAAA;IACV,YAAY,cAAA;IACZ,eAAe,iBAAA;IACf,kBAAkB,oBAAA;IAClB,KAAK,OAAA;IACL,iBAAiB,mBAAA;IACjB,aAAa,eAAA;IACb,MAAM,QAAA;IACN,cAAc,gBAAA;IACd,aAAa,eAAA;IACb,mBAAmB,qBAAA;IACnB,WAAW,aAAA;IACX,UAAU,YAAA;IACV,cAAc,gBAAA;IACd,eAAe,iBAAA;IACf,gBAAgB,kBAAA;IAChB,eAAe,iBAAA;IACf,qBAAqB,uBAAA;CACtB,CAAC","sourcesContent":["import { globalStyle, style } from '@vanilla-extract/css';\n\nimport { resetButtonRule } from '../../lib/styles/Mixins.js';\nimport { resetButtonFocusInner } from '../../lib/styles/resetButtonFocusInner.js';\nimport { t } from '../../lib/theming/vanilla.js';\n\nexport const root = style({\n height: '100%',\n position: 'fixed',\n top: 0,\n});\n\nexport const overlay = style({\n position: 'fixed',\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n});\n\nexport const body = style({\n flex: '1 0 auto',\n zIndex: 0,\n color: t.modalBodyTextColor,\n});\n\nexport const mobileBody = style({\n fontSize: 16,\n lineHeight: '22px',\n});\n\nexport const container = style({\n paddingLeft: t.sidePagePaddingLeft,\n paddingRight: t.sidePagePaddingRight,\n});\n\nexport const containerWithoutHeader = style({ paddingTop: t.sidePagePaddingTop });\n\nexport const focusLock = style({ height: '100%' });\n\nexport const wrapper = style({\n background: t.sidePageBgDefault,\n float: 'right',\n height: '100%',\n width: '100%',\n overflowY: 'auto',\n position: 'relative',\n whiteSpace: 'normal',\n alignItems: 'stretch',\n display: 'flex',\n flexDirection: 'column',\n});\n\nexport const wrapperLeft = style({ float: 'left' });\n\nexport const wrapperMarginLeft = style({ marginLeft: 20 });\n\nexport const wrapperMarginRight = style({ marginRight: 20 });\n\nexport const headerWrapper = style({ flex: '0 0 auto' });\n\nexport const header = style({\n fontSize: t.sidePageHeaderFontSize,\n lineHeight: t.sidePageHeaderLineHeight,\n padding: `${t.sidePageHeaderPaddingTop} 0 ${t.sidePageHeaderPaddingBottom}`,\n width: '100%',\n position: 'relative',\n color: t.sidePageHeaderTextColor,\n fontWeight: t.sidePageHeaderFontWeight,\n});\n\nexport const mobileHeader = style({\n fontSize: t.mobileSidePageHeaderFontSize,\n lineHeight: t.mobileSidePageHeaderLineHeight,\n padding: `${t.mobileSidePageHeaderPaddingTop} 0 ${t.mobileSidePageHeaderPaddingBottom}`,\n});\n\nexport const headerFixed = style({ background: t.sidePageBgDefault });\n\nexport const headerNativeStuck = style({\n position: 'sticky',\n top: 0,\n zIndex: 16000,\n background: `linear-gradient(to top, transparent ${t.sidePageHeaderPaddingBottom}, ${t.sidePageBgDefault} 0px)`,\n});\n\nexport const title = style({\n paddingLeft: t.sidePagePaddingLeft,\n paddingRight: `calc(${t.sidePageCloseButtonClickAreaLeft} + ${t.sidePageCloseIconSize} + ${t.sidePageCloseButtonClickAreaRight})`,\n});\n\nexport const mobileTitle = style({\n paddingLeft: t.mobileSidePagePaddingLeft,\n paddingRight: `calc(${t.mobileSidePageCloseButtonPadding} * 2 + ${t.sidePageCloseIconSize})`,\n});\n\nexport const titleCut = style({\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n});\n\nexport const background = style({\n height: '100%',\n position: 'absolute',\n width: '100%',\n});\n\nexport const backgroundGray = style({\n background: t.sidePageBackingBg,\n opacity: t.sidePageBackingBgOpacity,\n});\n\nexport const shadow = style({ boxShadow: t.sidePageContainerShadow });\n\n// цвет из resetButtonRule уходит запасным значением к своему: Emotion ставил повтор на место последнего вхождения\nconst { color: resetColor, ...resetButtonWithoutColor } = resetButtonRule;\n\nexport const close = style({\n ...resetButtonWithoutColor,\n cursor: 'pointer',\n color: [resetColor, t.sidePageCloseButtonColor],\n paddingTop: t.sidePageCloseButtonClickAreaTop,\n marginTop: `calc(-1 * ${t.sidePageCloseButtonClickAreaTop})`,\n paddingRight: t.sidePageCloseButtonClickAreaRight,\n marginRight: `calc(-1 * ${t.sidePageCloseButtonClickAreaRight})`,\n paddingBottom: t.sidePageCloseButtonClickAreaBottom,\n marginBottom: `calc(-1 * ${t.sidePageCloseButtonClickAreaBottom})`,\n paddingLeft: t.sidePageCloseButtonClickAreaLeft,\n marginLeft: `calc(-1 * ${t.sidePageCloseButtonClickAreaLeft})`,\n fontSize: 0,\n});\n\nexport const closeSticky = style({\n paddingTop: t.sidePageCloseButtonFixedClickAreaTop,\n marginTop: `calc(-1 * ${t.sidePageCloseButtonFixedClickAreaTop})`,\n paddingBottom: t.sidePageCloseButtonFixedClickAreaBottom,\n marginBottom: `calc(-1 * ${t.sidePageCloseButtonFixedClickAreaBottom})`,\n});\n\nexport const closeMobile = style({\n padding: t.mobileSidePageCloseButtonClickArea,\n margin: `calc(-1 * ${t.mobileSidePageCloseButtonClickArea})`,\n fontSize: 0,\n});\n\nexport const closeFocus = style({\n boxShadow: `inset 0 0 0 2px ${t.borderColorFocus}`,\n borderRadius: 4,\n});\n\nexport const wrapperClose = style({\n boxSizing: 'border-box',\n height: '100%',\n lineHeight: t.sidePageHeaderLineHeight,\n padding: `${t.sidePageHeaderPaddingTop} 0 ${t.sidePageHeaderPaddingBottom}`,\n position: 'absolute',\n right: t.sidePageCloseButtonClickAreaRight,\n top: t.sidePageCloseButtonWrapperOffsetTop,\n});\n\nexport const wrapperClose6_4 = style({\n height: 'auto',\n paddingBottom: 0,\n});\n\nexport const mobileWrapperClose = style({\n lineHeight: t.mobileSidePageHeaderLineHeight,\n padding: `${t.mobileSidePageHeaderPaddingTop} 0 ${t.mobileSidePageHeaderPaddingBottom}`,\n right: t.mobileSidePageCloseButtonPadding,\n});\n\nexport const panel = style({\n background: t.sidePageFooterPanelBg,\n padding: `${t.sidePageFooterPanelPaddingTop} ${t.sidePagePaddingRight} ${t.sidePageFooterPanelPaddingBottom} ${t.sidePagePaddingLeft}`,\n});\n\nexport const wrapperCloseFixed = style({ top: t.sidePageCloseButtonWrapperFixedOffsetTop });\n\n// стили совпадали с headerWrapper, и Emotion отдавал один класс на оба\nexport const footerWrapper = headerWrapper;\n\nexport const footer = style({\n bottom: 0,\n position: 'fixed',\n zIndex: 10,\n color: t.sidePageFooterTextColor,\n});\n\nexport const positionStatic = style({ position: 'static' });\n\nexport const footerContent = style({\n padding: `${t.sidePageFooterPaddingTop} ${t.sidePagePaddingRight} ${t.sidePageFooterPaddingBottom} ${t.sidePagePaddingLeft}`,\n});\n\nexport const mobileFooterContent = style({\n display: 'flex',\n flexFlow: 'column nowrap',\n padding: t.mobileSidePageFooterPadding,\n});\n\nexport const footerFixed = style({ background: t.sidePageBgDefault });\n\nexport const panelFixed = style({});\n\nexport const transitionLeft = style({ transform: 'translateX(100px)' });\n\nexport const transitionRight = style({ transform: 'translateX(-100px)' });\n\nexport const transitionActive = style({\n transition: 'transform 0.18s cubic-bezier(0.22, 0.61, 0.36, 1), opacity 0.18s cubic-bezier(0.22, 0.61, 0.36, 1)',\n opacity: '1 !important',\n transform: 'translate(0, 0) !important',\n});\n\nexport const transitionLeave = style({ opacity: 1 });\n\nexport const transitionLeaveActive = style({\n opacity: '0.01 !important',\n transition: 'opacity 0.15s ease-out',\n});\n\n// порядок вызова в cx(...) SidePageContainer: мобильные модификаторы после базовых\nexport const containerWithoutFooter = style({ paddingBottom: t.sidePagePaddingBottom });\n\n// стили совпадали с containerWithoutFooter, и Emotion отдавал один класс на оба\nexport const containerWithPanel = containerWithoutFooter;\n\nexport const mobileContainer = style({\n paddingLeft: t.mobileSidePagePaddingLeft,\n paddingRight: t.mobileSidePagePaddingRight,\n paddingBottom: t.mobileSidePagePaddingBottom,\n});\n\nexport const mobileContainerWithoutHeader = style({ paddingTop: t.mobileSidePagePaddingTop });\n\n// вложенные правила — после баз всех классов файла, как было в склеенном CSS Emotion\nglobalStyle(`${headerFixed}:after`, {\n bottom: '0px',\n content: \"''\",\n position: 'absolute',\n height: 1,\n width: '100%',\n left: 0,\n zIndex: -1,\n boxShadow: t.sidePageFixedHeaderShadow,\n});\n\nresetButtonFocusInner(close);\nglobalStyle(`${close}:focus, ${close}:hover`, { color: t.sidePageCloseButtonHoverColor });\nglobalStyle(`${close} > svg`, {\n width: t.sidePageCloseIconSize,\n height: t.sidePageCloseIconSize,\n boxSizing: 'content-box',\n});\n\nglobalStyle(`${footerFixed}:before`, {\n top: '0px',\n content: \"''\",\n position: 'absolute',\n height: 1,\n width: '100%',\n left: 0,\n zIndex: -1,\n boxShadow: t.sidePageFixedFooterShadow,\n});\n\nglobalStyle(`${panelFixed}:before`, { boxShadow: t.sidePageFixedPanelShadow });\n\nexport const styles = {\n root,\n overlay,\n body,\n mobileBody,\n container,\n mobileContainer,\n containerWithoutHeader,\n mobileContainerWithoutHeader,\n containerWithoutFooter,\n containerWithPanel,\n focusLock,\n wrapper,\n wrapperLeft,\n wrapperMarginLeft,\n wrapperMarginRight,\n headerWrapper,\n header,\n mobileHeader,\n headerFixed,\n headerNativeStuck,\n title,\n mobileTitle,\n titleCut,\n background,\n backgroundGray,\n shadow,\n close,\n closeSticky,\n closeMobile,\n closeFocus,\n wrapperClose,\n wrapperClose6_4,\n mobileWrapperClose,\n panel,\n wrapperCloseFixed,\n footerWrapper,\n footer,\n positionStatic,\n footerContent,\n mobileFooterContent,\n footerFixed,\n panelFixed,\n transitionLeft,\n transitionRight,\n transitionActive,\n transitionLeave,\n transitionLeaveActive,\n};\n"]}

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

@@ -77,10 +77,6 @@ export declare class SidePage extends React.Component<SidePageProps, SidePageSta
     static Container: typeof SidePageContainer;
     state: SidePageState;
     private globalObject;
-    private emotion;
-    private cx;
-    private styles;
-    private theme;
     private stackSubscription;
     private layout;
     private header;
@@ -97,7 +93,6 @@ export declare class SidePage extends React.Component<SidePageProps, SidePageSta
     static defaultProps: DefaultProps;
     private getProps;
     render(): JSX.Element;
-    private renderMain;
     private get isFocusLockDisabled();
     private renderContainer;
     private getSidePageContextProps;

package/components/SidePage/SidePage.js CHANGED Viewed

@@ -40,16 +40,16 @@ import { RenderLayer } from '../../internal/RenderLayer/index.js';
 import { ZIndex } from '../../internal/ZIndex/index.js';
 import { createPropsGetter } from '../../lib/createPropsGetter.js';
 import { isTestEnv } from '../../lib/currentEnvironment.js';
+import { cx } from '../../lib/cx.js';
 import { isKeyEscape } from '../../lib/events/keyboard/identifiers.js';
 import { isInstanceOf } from '../../lib/isInstanceOf.js';
 import * as LayoutEvents from '../../lib/LayoutEvents.js';
 import { ModalStack } from '../../lib/ModalStack.js';
 import { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';
 import { rootNode } from '../../lib/rootNode/index.js';
-import { ThemeContext } from '../../lib/theming/ThemeContext.js';
 import { isNonNullable, isReactUIInstance } from '../../lib/utils.js';
 import { ResponsiveLayout } from '../ResponsiveLayout/index.js';
-import { getStyles } from './SidePage.styles.js';
+import { styles } from './SidePage.css.js';
 import { SidePageBody } from './SidePageBody.js';
 import { SidePageContainer } from './SidePageContainer.js';
 import { SidePageContext } from './SidePageContext.js';
@@ -222,14 +222,6 @@ var SidePage = /** @class */ (function (_super) {
         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;
@@ -268,41 +260,41 @@ var SidePage = /** @class */ (function (_super) {
         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,
+        return (React.createElement("div", { "aria-modal": true, role: role, "aria-label": ariaLabel, "data-tid": SidePageDataTids.root, className: cx((_a = {},
+                _a[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(FocusLock, { disabled: this.isFocusLockDisabled, autoFocus: false, className: 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,
+                    React.createElement("div", { "data-tid": SidePageDataTids.container, className: cx(styles.wrapper, (_b = {},
+                            _b[styles.wrapperLeft] = fromLeft,
+                            _b[styles.wrapperMarginLeft] = this.state.hasMargin && fromLeft,
+                            _b[styles.wrapperMarginRight] = this.state.hasMargin && !fromLeft,
+                            _b[styles.shadow] = this.state.hasShadow,
                             _b)), "data-scroll-inset-top": this.state.stickyHeaderHeight || undefined, "data-scroll-inset-bottom": this.state.stickyFooterHeight || undefined, 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 },
+        return (React.createElement("div", { className: 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,
+            React.createElement("div", { key: "overlay", className: cx((_a = {},
+                    _a[styles.background] = true,
+                    _a[styles.backgroundGray] = this.state.hasBackground,
                     _a)) })));
     };
     SidePage.prototype.getTransitionNames = function () {
-        var transition = this.props.fromLeft ? this.styles.transitionRight : this.styles.transitionLeft;
+        var transition = this.props.fromLeft ? styles.transitionRight : styles.transitionLeft;
         return {
-            enter: transition(),
-            enterActive: this.styles.transitionActive(),
-            exit: this.styles.transitionLeave(),
-            exitActive: this.styles.transitionLeaveActive(),
-            appear: transition(),
-            appearActive: this.styles.transitionActive(),
+            enter: transition,
+            enterActive: styles.transitionActive,
+            exit: styles.transitionLeave,
+            exitActive: styles.transitionLeaveActive,
+            appear: transition,
+            appearActive: styles.transitionActive,
         };
     };
     var SidePage_1;

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

	@@ -1 +1 @@
1	- {"version":3,"file":"SidePage.js","sourceRoot":"","sources":["SidePage.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\nimport type { AriaAttributes, HTMLAttributes, JSX } from 'react';\nimport React from 'react';\nimport { CSSTransition } from 'react-transition-group';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { HideBodyVerticalScroll } from '../../internal/HideBodyVerticalScroll/index.js';\nimport { FocusLock } from '../../internal/react-focus-lock/index.js';\nimport { RenderContainer } from '../../internal/RenderContainer/index.js';\nimport { RenderLayer } from '../../internal/RenderLayer/index.js';\nimport { ZIndex } from '../../internal/ZIndex/index.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport { isTestEnv } from '../../lib/currentEnvironment.js';\nimport { isKeyEscape } from '../../lib/events/keyboard/identifiers.js';\nimport type { GlobalObject } from '../../lib/globalObject.js';\nimport { isInstanceOf } from '../../lib/isInstanceOf.js';\nimport * as LayoutEvents from '../../lib/LayoutEvents.js';\nimport { ModalStack } from '../../lib/ModalStack.js';\nimport type { ModalStackSubscription } from '../../lib/ModalStack.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport { isNonNullable, isReactUIInstance } from '../../lib/utils.js';\nimport { ResponsiveLayout } from '../ResponsiveLayout/index.js';\nimport { getStyles } from './SidePage.styles.js';\nimport { SidePageBody } from './SidePageBody.js';\nimport { SidePageContainer } from './SidePageContainer.js';\nimport { SidePageContext } from './SidePageContext.js';\nimport type { SidePageContextType } from './SidePageContext.js';\nimport { SidePageFooter } from './SidePageFooter.js';\nimport { SidePageHeader } from './SidePageHeader.js';\nexport interface SidePageProps\n extends CommonProps, Pick<HTMLAttributes<unknown>, 'role'>, Pick<AriaAttributes, 'aria-label'> {\n /** Блокирует фон, когда сайдпейдж открыт: основная страница затемняется, действия на ней становятся недоступны. /\n blockBackground?: boolean;\n\n /* Отключает событие `onClose` и блокирует кнопку закрытия сайдпейджа. /\n disableClose?: boolean;\n\n /\n Оставляет сайдпейдж открытым, когда пользователь нажал на фон.\n * @deprecated Используйте `ignoreOutsideClick` вместо `ignoreBackgroundClick`\n /\n ignoreBackgroundClick?: boolean;\n /\n * Оставляет сайдпейдж открытым, когда пользователь нажал на фон.\n /\n ignoreOutsideClick?: 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 Событие нажатия на фон.\n /\n onOutsideClick?: (e: Event) => void;\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 stickyHeaderHeight: number;\n stickyFooterHeight: number;\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 Сайдпейдж — это модальное окно, которое открывается поверх основной страницы и занимает всю высоту окна браузера.\n \n Составной компонент, включает в себя:\n * - «шапку» [SidePage.Header](https://tech.skbkontur.ru/kontur-ui/?path=/docs/react-ui_overlay-sidepage-sidepageheader--docs), состоящую из заголовка и крестика закрытия окна;\n * - контент-зону [SidePage.Body](https://tech.skbkontur.ru/kontur-ui/?path=/docs/react-ui_overlay-sidepage-sidepagebody--docs) и контейнер с отступами [SidePage.Container](https://tech.skbkontur.ru/kontur-ui/?path=/docs/react-ui_overlay-sidepage-sidepagecontainer--docs);\n * - футер [SidePage.Footer](https://tech.skbkontur.ru/kontur-ui/?path=/docs/react-ui_overlay-sidepage-sidepagefooter--docs).\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 stickyHeaderHeight: 0,\n stickyFooterHeight: 0,\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 <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 data-scroll-inset-top={this.state.stickyHeaderHeight \|\| undefined}\n data-scroll-inset-bottom={this.state.stickyFooterHeight \|\| undefined}\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 setStickyHeaderHeight: this.setStickyHeaderHeight,\n setStickyFooterHeight: this.setStickyFooterHeight,\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 \|\| this.props.ignoreOutsideClick)) {\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 if (this.props.onOutsideClick) {\n this.props.onOutsideClick(e);\n if (e.defaultPrevented) {\n return;\n }\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 private setStickyHeaderHeight = (stickyHeaderHeight = 0) => {\n if (this.state.stickyHeaderHeight !== stickyHeaderHeight) {\n this.setState({ stickyHeaderHeight });\n }\n };\n\n private setStickyFooterHeight = (stickyFooterHeight = 0) => {\n if (this.state.stickyFooterHeight !== stickyFooterHeight) {\n this.setState({ stickyFooterHeight });\n }\n };\n}\n"]}
1	+ {"version":3,"file":"SidePage.js","sourceRoot":"","sources":["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';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { HideBodyVerticalScroll } from '../../internal/HideBodyVerticalScroll/index.js';\nimport { FocusLock } from '../../internal/react-focus-lock/index.js';\nimport { RenderContainer } from '../../internal/RenderContainer/index.js';\nimport { RenderLayer } from '../../internal/RenderLayer/index.js';\nimport { ZIndex } from '../../internal/ZIndex/index.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport { isTestEnv } from '../../lib/currentEnvironment.js';\nimport { cx } from '../../lib/cx.js';\nimport { isKeyEscape } from '../../lib/events/keyboard/identifiers.js';\nimport type { GlobalObject } from '../../lib/globalObject.js';\nimport { isInstanceOf } from '../../lib/isInstanceOf.js';\nimport * as LayoutEvents from '../../lib/LayoutEvents.js';\nimport { ModalStack } from '../../lib/ModalStack.js';\nimport type { ModalStackSubscription } from '../../lib/ModalStack.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport { isNonNullable, isReactUIInstance } from '../../lib/utils.js';\nimport { ResponsiveLayout } from '../ResponsiveLayout/index.js';\nimport { styles } from './SidePage.css.js';\nimport { SidePageBody } from './SidePageBody.js';\nimport { SidePageContainer } from './SidePageContainer.js';\nimport { SidePageContext } from './SidePageContext.js';\nimport type { SidePageContextType } from './SidePageContext.js';\nimport { SidePageFooter } from './SidePageFooter.js';\nimport { SidePageHeader } from './SidePageHeader.js';\nexport interface SidePageProps\n extends CommonProps, Pick<HTMLAttributes<unknown>, 'role'>, Pick<AriaAttributes, 'aria-label'> {\n /** Блокирует фон, когда сайдпейдж открыт: основная страница затемняется, действия на ней становятся недоступны. /\n blockBackground?: boolean;\n\n /* Отключает событие `onClose` и блокирует кнопку закрытия сайдпейджа. /\n disableClose?: boolean;\n\n /\n Оставляет сайдпейдж открытым, когда пользователь нажал на фон.\n * @deprecated Используйте `ignoreOutsideClick` вместо `ignoreBackgroundClick`\n /\n ignoreBackgroundClick?: boolean;\n /\n * Оставляет сайдпейдж открытым, когда пользователь нажал на фон.\n /\n ignoreOutsideClick?: 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 Событие нажатия на фон.\n /\n onOutsideClick?: (e: Event) => void;\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 stickyHeaderHeight: number;\n stickyFooterHeight: number;\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 Сайдпейдж — это модальное окно, которое открывается поверх основной страницы и занимает всю высоту окна браузера.\n \n Составной компонент, включает в себя:\n * - «шапку» [SidePage.Header](https://tech.skbkontur.ru/kontur-ui/?path=/docs/react-ui_overlay-sidepage-sidepageheader--docs), состоящую из заголовка и крестика закрытия окна;\n * - контент-зону [SidePage.Body](https://tech.skbkontur.ru/kontur-ui/?path=/docs/react-ui_overlay-sidepage-sidepagebody--docs) и контейнер с отступами [SidePage.Container](https://tech.skbkontur.ru/kontur-ui/?path=/docs/react-ui_overlay-sidepage-sidepagecontainer--docs);\n * - футер [SidePage.Footer](https://tech.skbkontur.ru/kontur-ui/?path=/docs/react-ui_overlay-sidepage-sidepagefooter--docs).\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 stickyHeaderHeight: 0,\n stickyFooterHeight: 0,\n };\n\n private globalObject!: GlobalObject;\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 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={cx({\n [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 <FocusLock disabled={this.isFocusLockDisabled} autoFocus={false} className={styles.focusLock}>\n <RenderLayer onClickOutside={this.handleClickOutside} active>\n <div\n data-tid={SidePageDataTids.container}\n className={cx(styles.wrapper, {\n [styles.wrapperLeft]: fromLeft,\n [styles.wrapperMarginLeft]: this.state.hasMargin && fromLeft,\n [styles.wrapperMarginRight]: this.state.hasMargin && !fromLeft,\n [styles.shadow]: this.state.hasShadow,\n })}\n data-scroll-inset-top={this.state.stickyHeaderHeight \|\| undefined}\n data-scroll-inset-bottom={this.state.stickyFooterHeight \|\| undefined}\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 setStickyHeaderHeight: this.setStickyHeaderHeight,\n setStickyFooterHeight: this.setStickyFooterHeight,\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={styles.overlay} onScroll={LayoutEvents.emit}>\n <HideBodyVerticalScroll key=\"hbvs\" />\n <div\n key=\"overlay\"\n className={cx({\n [styles.background]: true,\n [styles.backgroundGray]: this.state.hasBackground,\n })}\n />\n </div>\n );\n }\n\n private getTransitionNames(): Record<string, string> {\n const transition = this.props.fromLeft ? styles.transitionRight : styles.transitionLeft;\n\n return {\n enter: transition,\n enterActive: styles.transitionActive,\n exit: styles.transitionLeave,\n exitActive: styles.transitionLeaveActive,\n appear: transition,\n appearActive: 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 \|\| this.props.ignoreOutsideClick)) {\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 if (this.props.onOutsideClick) {\n this.props.onOutsideClick(e);\n if (e.defaultPrevented) {\n return;\n }\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 private setStickyHeaderHeight = (stickyHeaderHeight = 0) => {\n if (this.state.stickyHeaderHeight !== stickyHeaderHeight) {\n this.setState({ stickyHeaderHeight });\n }\n };\n\n private setStickyFooterHeight = (stickyFooterHeight = 0) => {\n if (this.state.stickyFooterHeight !== stickyFooterHeight) {\n this.setState({ stickyFooterHeight });\n }\n };\n}\n"]}

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

@@ -21,9 +21,6 @@ export declare class SidePageBody extends React.Component<SidePageBodyProps> {
     private isMobileLayout;
     getRootNode: TGetRootNode;
     private setRootNode;
-    private emotion;
-    private cx;
-    private styles;
     componentDidUpdate(): void;
     render(): React.JSX.Element;
 }

package/components/SidePage/SidePageBody.js CHANGED Viewed

@@ -32,11 +32,10 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import React from 'react';
 import { CommonWrapper } from '../../internal/CommonWrapper/index.js';
-import { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';
+import { cx } from '../../lib/cx.js';
 import { rootNode } from '../../lib/rootNode/index.js';
-import { ThemeContext } from '../../lib/theming/ThemeContext.js';
 import { responsiveLayout } from '../ResponsiveLayout/decorator.js';
-import { getStyles } from './SidePage.styles.js';
+import { styles } from './SidePage.css.js';
 import { SidePageContext } from './SidePageContext.js';
 export var SidePageBodyDataTids = {
     root: 'SidePageBody__root',
@@ -57,19 +56,14 @@ var SidePageBody = /** @class */ (function (_super) {
         this.context.updateLayout();
     };
     SidePageBody.prototype.render = function () {
-        var _this = this;
-        this.styles = getStyles(this.emotion);
-        return (React.createElement(ThemeContext.Consumer, null, function (theme) {
-            var _a;
-            return (React.createElement(CommonWrapper, __assign({ rootNodeRef: _this.setRootNode }, _this.props),
-                React.createElement("div", { "data-tid": SidePageBodyDataTids.root, className: _this.cx(_this.styles.body(theme), (_a = {}, _a[_this.styles.mobileBody()] = _this.isMobileLayout, _a)) }, _this.props.children)));
-        }));
+        var _a;
+        return (React.createElement(CommonWrapper, __assign({ rootNodeRef: this.setRootNode }, this.props),
+            React.createElement("div", { "data-tid": SidePageBodyDataTids.root, className: cx(styles.body, (_a = {}, _a[styles.mobileBody] = this.isMobileLayout, _a)) }, this.props.children)));
     };
     SidePageBody.__KONTUR_REACT_UI__ = 'SidePageBody';
     SidePageBody.displayName = 'SidePageBody';
     SidePageBody.contextType = SidePageContext;
     SidePageBody = __decorate([
-        withRenderEnvironment,
         responsiveLayout,
         rootNode
     ], SidePageBody);

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

	@@ -1 +1 @@
1	- {"version":3,"file":"SidePageBody.js","sourceRoot":"","sources":["SidePageBody.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AACA~~,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AACtE,OAAO,EAAE,~~qBAAqB~~,EAAE,MAAM,~~sCAAsC~~,CAAC;~~AAE7E~~,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,~~YAAY,EAAE,MAAM,mCAAmC,CAAC;AACjE,OAAO,EAAE,~~gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AACpE,OAAO,EAAE,~~SAAS~~,EAAE,MAAM,~~sBAAsB~~,CAAC;~~AACjD~~,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAOvD,MAAM,CAAC,IAAM,oBAAoB,GAAG;IAClC,IAAI,EAAE,oBAAoB;CAClB,CAAC;AACX;;;;GAIG;~~AAIH~~;IAAkC,gCAAkC;IAApE;;QAKS,aAAO,GAAwB,KAAI,CAAC,OAAO,CAAC;;~~IAgCrD~~,CAAC;~~IAxBQ~~,yCAAkB,GAAzB;QACE,IAAI,CAAC,OAAO,CAAC,YAAY,EAAE,CAAC;IAC9B,CAAC;IAEM,6BAAM,GAAb~~;QAAA,iBAmBC;QAlBC,IAAI,CAAC,MAAM,GAAG,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAEtC,OAAO,CACL,oBAAC,YAAY,CAAC,QAAQ,QACnB,UAAC,KAAK~~;;~~YACL~~,OAAO,CACL,oBAAC,aAAa,aAAC,WAAW,EAAE,~~KAAI~~,CAAC,WAAW,IAAM,~~KAAI~~,CAAC,KAAK;~~gBAC1D~~,yCACY,oBAAoB,CAAC,IAAI,EACnC,SAAS,EAAE,~~KAAI,CAAC,~~EAAE,CAAC,~~KAAI,CAAC,~~MAAM,CAAC,IAAI,~~CAAC,KAAK,CAAC,~~YAAI,GAAC,~~KAAI,CAAC,~~MAAM,CAAC,UAAU,~~EAAE,~~IAAG,~~KAAI~~,CAAC,cAAc,MAAG,~~IAE/F~~,~~KAAI~~,CAAC,KAAK,CAAC,QAAQ,CAChB,CACQ,CACjB,CAAC;~~QACJ,CAAC,CACqB,CACzB,CAAC;~~IACJ,CAAC;~~IAnCa~~,gCAAmB,GAAG,cAAc,AAAjB,CAAkB;IACrC,wBAAW,GAAG,cAAc,AAAjB,CAAkB;IAE7B,wBAAW,GAAG,eAAe,AAAlB,CAAmB;IAJjC,YAAY;~~QAHxB~~,~~qBAAqB;QACrB,~~gBAAgB;QAChB,QAAQ;OACI,YAAY,~~CAqCxB~~;IAAD,mBAAC;CAAA,~~AArCD~~,CAAkC,KAAK,CAAC,SAAS,~~GAqChD~~;~~SArCY~~,YAAY","sourcesContent":["import ~~type { Emotion } from '@emotion/css/create-instance';\nimport~~ React from 'react';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { ~~withRenderEnvironment~~ } from '../../lib/~~renderEnvironment/index~~.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport { ~~ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport {~~ responsiveLayout } from '../ResponsiveLayout/decorator.js';\nimport { ~~getStyles~~ } from './SidePage.~~styles~~.js';\nimport { SidePageContext } from './SidePageContext.js';\nimport type { SidePageContextType } from './SidePageContext.js';\n\nexport interface SidePageBodyProps extends CommonProps {\n children?: React.ReactNode;\n}\n\nexport const SidePageBodyDataTids = {\n root: 'SidePageBody__root',\n} as const;\n/*\n Контент-зона сайдпейджа.\n \n @visibleName SidePage.Body\n */\n@~~withRenderEnvironment\n@~~responsiveLayout\n@rootNode\nexport class SidePageBody extends React.Component<SidePageBodyProps> {\n public static __KONTUR_REACT_UI__ = 'SidePageBody';\n public static displayName = 'SidePageBody';\n\n public static contextType = SidePageContext;\n public context: SidePageContextType = this.context;\n private isMobileLayout!: boolean;\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n ~~private emotion!: Emotion;\n private cx!: Emotion['cx'];\n private styles!: ReturnType<typeof getStyles>;\n~~\n public componentDidUpdate() {\n this.context.updateLayout();\n }\n\n public render(): React.JSX.Element {\n ~~this.styles = getStyles(this.emotion);\n\n~~ return (\n <~~ThemeContext.Consumer>\n {(theme) => {\n return (\n <~~CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div\n data-tid={SidePageBodyDataTids.root}\n className={~~this.~~cx(~~this.~~styles.body~~(theme)~~, { [~~this.~~styles.mobileBody()]: this.isMobileLayout })}\n >\n {this.props.children}\n </div>\n </CommonWrapper>\n ~~);\n }}\n </ThemeContext.Consumer>\n~~ );\n }\n}\n"]}
1	+ {"version":3,"file":"SidePageBody.js","sourceRoot":"","sources":["SidePageBody.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AACtE,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AAErC,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AACpE,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAOvD,MAAM,CAAC,IAAM,oBAAoB,GAAG;IAClC,IAAI,EAAE,oBAAoB;CAClB,CAAC;AACX;;;;GAIG;AAGH;IAAkC,gCAAkC;IAApE;;QAKS,aAAO,GAAwB,KAAI,CAAC,OAAO,CAAC;;IAqBrD,CAAC;IAhBQ,yCAAkB,GAAzB;QACE,IAAI,CAAC,OAAO,CAAC,YAAY,EAAE,CAAC;IAC9B,CAAC;IAEM,6BAAM,GAAb;;QACE,OAAO,CACL,oBAAC,aAAa,aAAC,WAAW,EAAE,IAAI,CAAC,WAAW,IAAM,IAAI,CAAC,KAAK;YAC1D,yCACY,oBAAoB,CAAC,IAAI,EACnC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,YAAI,GAAC,MAAM,CAAC,UAAU,IAAG,IAAI,CAAC,cAAc,MAAG,IAEvE,IAAI,CAAC,KAAK,CAAC,QAAQ,CAChB,CACQ,CACjB,CAAC;IACJ,CAAC;IAxBa,gCAAmB,GAAG,cAAc,AAAjB,CAAkB;IACrC,wBAAW,GAAG,cAAc,AAAjB,CAAkB;IAE7B,wBAAW,GAAG,eAAe,AAAlB,CAAmB;IAJjC,YAAY;QAFxB,gBAAgB;QAChB,QAAQ;OACI,YAAY,CA0BxB;IAAD,mBAAC;CAAA,AA1BD,CAAkC,KAAK,CAAC,SAAS,GA0BhD;SA1BY,YAAY","sourcesContent":["import React from 'react';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { cx } from '../../lib/cx.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport { responsiveLayout } from '../ResponsiveLayout/decorator.js';\nimport { styles } from './SidePage.css.js';\nimport { SidePageContext } from './SidePageContext.js';\nimport type { SidePageContextType } from './SidePageContext.js';\n\nexport interface SidePageBodyProps extends CommonProps {\n children?: React.ReactNode;\n}\n\nexport const SidePageBodyDataTids = {\n root: 'SidePageBody__root',\n} as const;\n/*\n Контент-зона сайдпейджа.\n \n @visibleName SidePage.Body\n */\n@responsiveLayout\n@rootNode\nexport class SidePageBody extends React.Component<SidePageBodyProps> {\n public static __KONTUR_REACT_UI__ = 'SidePageBody';\n public static displayName = 'SidePageBody';\n\n public static contextType = SidePageContext;\n public context: SidePageContextType = this.context;\n private isMobileLayout!: boolean;\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n\n public componentDidUpdate() {\n this.context.updateLayout();\n }\n\n public render(): React.JSX.Element {\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div\n data-tid={SidePageBodyDataTids.root}\n className={cx(styles.body, { [styles.mobileBody]: this.isMobileLayout })}\n >\n {this.props.children}\n </div>\n </CommonWrapper>\n );\n }\n}\n"]}

package/components/SidePage/SidePageCloseButton.js CHANGED Viewed

@@ -1,11 +1,11 @@
 import React, { useContext, useState } from 'react';
 import { XIcon20Regular } from '../../internal/icons2022/XIcon/XIcon20Regular.js';
+import { cx } from '../../lib/cx.js';
 import { useKeyListener } from '../../lib/events/keyListener.js';
 import { useLocaleForControl } from '../../lib/locale/useLocaleForControl.js';
-import { useEmotion, useGlobal, useStyles } from '../../lib/renderEnvironment/index.js';
-import { ThemeContext } from '../../lib/theming/ThemeContext.js';
+import { useGlobal } from '../../lib/renderEnvironment/index.js';
 import { SidePageLocaleHelper } from './locale/index.js';
-import { getStyles } from './SidePage.styles.js';
+import { styles } from './SidePage.css.js';
 import { SidePageContext } from './SidePageContext.js';
 import { SidePageHeaderDataTids } from './SidePageHeader.js';
 export var SidePageCloseButton = function (_a) {
@@ -14,9 +14,6 @@ export var SidePageCloseButton = function (_a) {
     var _c = useState(false), isFocusedByTab = _c[0], setIsFocusedByTab = _c[1];
     var locale = useLocaleForControl('SidePage', SidePageLocaleHelper);
     var globalObject = useGlobal();
-    var theme = useContext(ThemeContext);
-    var cx = useEmotion().cx;
-    var styles = useStyles(getStyles);
     var keyListener = useKeyListener();
     var sidePageContext = useContext(SidePageContext);
     var handleFocus = function () {
@@ -31,10 +28,10 @@ export var SidePageCloseButton = function (_a) {
         setIsFocusedByTab(false);
     };
     var icon = React.createElement(XIcon20Regular, { align: "none" });
-    return (React.createElement("button", { "aria-label": locale === null || locale === void 0 ? void 0 : locale.closeButtonAriaLabel, className: cx(styles.close(theme), (_b = {},
-            _b[styles.closeFocus(theme)] = isFocusedByTab,
-            _b[styles.closeSticky(theme)] = isHeaderFixed,
-            _b[styles.closeMobile(theme)] = isMobile,
+    return (React.createElement("button", { "aria-label": locale === null || locale === void 0 ? void 0 : locale.closeButtonAriaLabel, className: cx(styles.close, (_b = {},
+            _b[styles.closeFocus] = isFocusedByTab,
+            _b[styles.closeSticky] = isHeaderFixed,
+            _b[styles.closeMobile] = isMobile,
             _b)), onFocus: handleFocus, onBlur: handleBlur, onClick: sidePageContext.requestClose, "data-tid": SidePageHeaderDataTids.close }, icon));
 };
 SidePageCloseButton.__KONTUR_REACT_UI__ = 'SidePageCloseButton';

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

	@@ -1 +1 @@
1	- {"version":3,"file":"SidePageCloseButton.js","sourceRoot":"","sources":["SidePageCloseButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGpD,OAAO,EAAE,cAAc,EAAE,MAAM,kDAAkD,CAAC;AAClF,OAAO,EAAE,~~cAAc~~,EAAE,MAAM,~~iCAAiC~~,CAAC;~~AACjE~~,OAAO,EAAE,~~mBAAmB~~,EAAE,MAAM,~~yCAAyC~~,CAAC;~~AAC9E~~,OAAO,EAAE,~~UAAU~~,EAAE,~~SAAS,EAAE,SAAS,EAAE,~~MAAM,~~sCAAsC~~,CAAC;~~AACxF~~,OAAO,EAAE,~~YAAY~~,EAAE,MAAM,~~mCAAmC~~,CAAC;AACjE,OAAO,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAAE,~~SAAS~~,EAAE,MAAM,~~sBAAsB~~,CAAC;~~AACjD~~,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AAO7D,MAAM,CAAC,IAAM,mBAAmB,GAAG,UAAC,EAAqD;;QAAnD,aAAa,mBAAA,EAAE,QAAQ,cAAA;IACrD,IAAA,KAAsC,QAAQ,CAAC,KAAK,CAAC,EAApD,cAAc,QAAA,EAAE,iBAAiB,QAAmB,CAAC;IAE5D,IAAM,MAAM,GAAG,mBAAmB,CAAC,UAAU,EAAE,oBAAoB,CAAC,CAAC;IACrE,IAAM,YAAY,GAAG,SAAS,EAAE,CAAC;IACjC,IAAM,~~KAAK,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IAC/B,IAAA,EAAE,GAAK,UAAU,EAAE,GAAjB,CAAkB;IAC5B,IAAM,MAAM,GAAG,SAAS,CAAC,SAAS,CAAC,CAAC;IACpC,IAAM,~~WAAW,GAAG,cAAc,EAAE,CAAC;IACrC,IAAM,eAAe,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IAEpD,IAAM,WAAW,GAAG;;QAClB,MAAA,YAAY,CAAC,qBAAqB,6DAAG;YACnC,IAAI,WAAW,CAAC,YAAY,EAAE,CAAC;gBAC7B,iBAAiB,CAAC,IAAI,CAAC,CAAC;YAC1B,CAAC;QACH,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,IAAM,UAAU,GAAG;QACjB,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAC3B,CAAC,CAAC;IAEF,IAAM,IAAI,GAAG,oBAAC,cAAc,IAAC,KAAK,EAAC,MAAM,GAAG,CAAC;IAC7C,OAAO,CACL,8CACc,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,oBAAoB,EACxC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK~~,CAAC,KAAK,CAAC~~;~~YAC/B~~,GAAC,MAAM,CAAC,UAAU,~~CAAC,KAAK,CAAC,~~IAAG,cAAc;~~YAC1C~~,GAAC,MAAM,CAAC,WAAW,~~CAAC,KAAK,CAAC,~~IAAG,aAAa;~~YAC1C~~,GAAC,MAAM,CAAC,WAAW,~~CAAC,KAAK,CAAC,~~IAAG,QAAQ;~~gBACrC~~,EACF,OAAO,EAAE,WAAW,EACpB,MAAM,EAAE,UAAU,EAClB,OAAO,EAAE,eAAe,CAAC,YAAY,cAC3B,sBAAsB,CAAC,KAAK,IAErC,IAAI,CACE,CACV,CAAC;AACJ,CAAC,CAAC;AAEF,mBAAmB,CAAC,mBAAmB,GAAG,qBAAqB,CAAC;AAChE,mBAAmB,CAAC,WAAW,GAAG,qBAAqB,CAAC","sourcesContent":["import React, { useContext, useState } from 'react';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { XIcon20Regular } from '../../internal/icons2022/XIcon/XIcon20Regular.js';\nimport { ~~useKeyListener~~ } from '../../lib/~~events/keyListener~~.js';\nimport { ~~useLocaleForControl~~ } from '../../lib/~~locale~~/~~useLocaleForControl~~.js';\nimport { ~~useEmotion,~~ ~~useGlobal, useStyles~~ } from '../../lib/~~renderEnvironment~~/~~index~~.js';\nimport { ~~ThemeContext~~ } from '../../lib/~~theming~~/~~ThemeContext~~.js';\nimport { SidePageLocaleHelper } from './locale/index.js';\nimport { ~~getStyles~~ } from './SidePage.~~styles~~.js';\nimport { SidePageContext } from './SidePageContext.js';\nimport { SidePageHeaderDataTids } from './SidePageHeader.js';\n\nexport interface SidePageCloseButtonProps extends CommonProps {\n isHeaderFixed: boolean;\n isMobile?: boolean;\n}\n\nexport const SidePageCloseButton = ({ isHeaderFixed, isMobile }: SidePageCloseButtonProps): React.JSX.Element => {\n const [isFocusedByTab, setIsFocusedByTab] = useState(false);\n\n const locale = useLocaleForControl('SidePage', SidePageLocaleHelper);\n const globalObject = useGlobal();\n const ~~theme = useContext(ThemeContext);\n const { cx } = useEmotion();\n const styles = useStyles(getStyles);\n const~~ keyListener = useKeyListener();\n const sidePageContext = useContext(SidePageContext);\n\n const handleFocus = () => {\n globalObject.requestAnimationFrame?.(() => {\n if (keyListener.isTabPressed) {\n setIsFocusedByTab(true);\n }\n });\n };\n\n const handleBlur = () => {\n setIsFocusedByTab(false);\n };\n\n const icon = <XIcon20Regular align=\"none\" />;\n return (\n <button\n aria-label={locale?.closeButtonAriaLabel}\n className={cx(styles.close~~(theme)~~, {\n [styles.closeFocus~~(theme)~~]: isFocusedByTab,\n [styles.closeSticky~~(theme)~~]: isHeaderFixed,\n [styles.closeMobile~~(theme)~~]: isMobile,\n })}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onClick={sidePageContext.requestClose}\n data-tid={SidePageHeaderDataTids.close}\n >\n {icon}\n </button>\n );\n};\n\nSidePageCloseButton.__KONTUR_REACT_UI__ = 'SidePageCloseButton';\nSidePageCloseButton.displayName = 'SidePageCloseButton';\n"]}
1	+ {"version":3,"file":"SidePageCloseButton.js","sourceRoot":"","sources":["SidePageCloseButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGpD,OAAO,EAAE,cAAc,EAAE,MAAM,kDAAkD,CAAC;AAClF,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,cAAc,EAAE,MAAM,iCAAiC,CAAC;AACjE,OAAO,EAAE,mBAAmB,EAAE,MAAM,yCAAyC,CAAC;AAC9E,OAAO,EAAE,SAAS,EAAE,MAAM,sCAAsC,CAAC;AACjE,OAAO,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AAO7D,MAAM,CAAC,IAAM,mBAAmB,GAAG,UAAC,EAAqD;;QAAnD,aAAa,mBAAA,EAAE,QAAQ,cAAA;IACrD,IAAA,KAAsC,QAAQ,CAAC,KAAK,CAAC,EAApD,cAAc,QAAA,EAAE,iBAAiB,QAAmB,CAAC;IAE5D,IAAM,MAAM,GAAG,mBAAmB,CAAC,UAAU,EAAE,oBAAoB,CAAC,CAAC;IACrE,IAAM,YAAY,GAAG,SAAS,EAAE,CAAC;IACjC,IAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IACrC,IAAM,eAAe,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IAEpD,IAAM,WAAW,GAAG;;QAClB,MAAA,YAAY,CAAC,qBAAqB,6DAAG;YACnC,IAAI,WAAW,CAAC,YAAY,EAAE,CAAC;gBAC7B,iBAAiB,CAAC,IAAI,CAAC,CAAC;YAC1B,CAAC;QACH,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,IAAM,UAAU,GAAG;QACjB,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAC3B,CAAC,CAAC;IAEF,IAAM,IAAI,GAAG,oBAAC,cAAc,IAAC,KAAK,EAAC,MAAM,GAAG,CAAC;IAC7C,OAAO,CACL,8CACc,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,oBAAoB,EACxC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK;YACxB,GAAC,MAAM,CAAC,UAAU,IAAG,cAAc;YACnC,GAAC,MAAM,CAAC,WAAW,IAAG,aAAa;YACnC,GAAC,MAAM,CAAC,WAAW,IAAG,QAAQ;gBAC9B,EACF,OAAO,EAAE,WAAW,EACpB,MAAM,EAAE,UAAU,EAClB,OAAO,EAAE,eAAe,CAAC,YAAY,cAC3B,sBAAsB,CAAC,KAAK,IAErC,IAAI,CACE,CACV,CAAC;AACJ,CAAC,CAAC;AAEF,mBAAmB,CAAC,mBAAmB,GAAG,qBAAqB,CAAC;AAChE,mBAAmB,CAAC,WAAW,GAAG,qBAAqB,CAAC","sourcesContent":["import React, { useContext, useState } from 'react';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { XIcon20Regular } from '../../internal/icons2022/XIcon/XIcon20Regular.js';\nimport { cx } from '../../lib/cx.js';\nimport { useKeyListener } from '../../lib/events/keyListener.js';\nimport { useLocaleForControl } from '../../lib/locale/useLocaleForControl.js';\nimport { useGlobal } from '../../lib/renderEnvironment/index.js';\nimport { SidePageLocaleHelper } from './locale/index.js';\nimport { styles } from './SidePage.css.js';\nimport { SidePageContext } from './SidePageContext.js';\nimport { SidePageHeaderDataTids } from './SidePageHeader.js';\n\nexport interface SidePageCloseButtonProps extends CommonProps {\n isHeaderFixed: boolean;\n isMobile?: boolean;\n}\n\nexport const SidePageCloseButton = ({ isHeaderFixed, isMobile }: SidePageCloseButtonProps): React.JSX.Element => {\n const [isFocusedByTab, setIsFocusedByTab] = useState(false);\n\n const locale = useLocaleForControl('SidePage', SidePageLocaleHelper);\n const globalObject = useGlobal();\n const keyListener = useKeyListener();\n const sidePageContext = useContext(SidePageContext);\n\n const handleFocus = () => {\n globalObject.requestAnimationFrame?.(() => {\n if (keyListener.isTabPressed) {\n setIsFocusedByTab(true);\n }\n });\n };\n\n const handleBlur = () => {\n setIsFocusedByTab(false);\n };\n\n const icon = <XIcon20Regular align=\"none\" />;\n return (\n <button\n aria-label={locale?.closeButtonAriaLabel}\n className={cx(styles.close, {\n [styles.closeFocus]: isFocusedByTab,\n [styles.closeSticky]: isHeaderFixed,\n [styles.closeMobile]: isMobile,\n })}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onClick={sidePageContext.requestClose}\n data-tid={SidePageHeaderDataTids.close}\n >\n {icon}\n </button>\n );\n};\n\nSidePageCloseButton.__KONTUR_REACT_UI__ = 'SidePageCloseButton';\nSidePageCloseButton.displayName = 'SidePageCloseButton';\n"]}

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

@@ -13,10 +13,6 @@ export declare const SidePageContainerDataTids: {
 export declare class SidePageContainer extends React.Component<SidePageContainerProps> {
     static __KONTUR_REACT_UI__: string;
     static displayName: string;
-    private emotion;
-    private cx;
-    private styles;
-    private theme;
     private isMobileLayout;
     getRootNode: TGetRootNode;
     private setRootNode;

package/components/SidePage/SidePageContainer.js CHANGED Viewed

@@ -32,11 +32,10 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import React from 'react';
 import { CommonWrapper } from '../../internal/CommonWrapper/index.js';
-import { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';
+import { cx } from '../../lib/cx.js';
 import { rootNode } from '../../lib/rootNode/index.js';
-import { ThemeContext } from '../../lib/theming/ThemeContext.js';
 import { responsiveLayout } from '../ResponsiveLayout/decorator.js';
-import { getStyles } from './SidePage.styles.js';
+import { styles } from './SidePage.css.js';
 import { SidePageContext } from './SidePageContext.js';
 export var SidePageContainerDataTids = {
     root: 'SidePageContainer__root',
@@ -52,12 +51,7 @@ var SidePageContainer = /** @class */ (function (_super) {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     SidePageContainer.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();
-        }));
+        return this.renderMain();
     };
     SidePageContainer.prototype.renderMain = function () {
         var _this = this;
@@ -65,20 +59,19 @@ var SidePageContainer = /** @class */ (function (_super) {
             var _b;
             var hasHeader = _a.hasHeader, hasFooter = _a.hasFooter, hasPanel = _a.hasPanel;
             return (React.createElement(CommonWrapper, __assign({ rootNodeRef: _this.setRootNode }, _this.props),
-                React.createElement("div", { "data-tid": SidePageContainerDataTids.root, className: _this.cx((_b = {},
-                        _b[_this.styles.container(_this.theme)] = true,
-                        _b[_this.styles.containerWithoutHeader(_this.theme)] = !hasHeader,
-                        _b[_this.styles.containerWithoutFooter(_this.theme)] = !hasFooter,
-                        _b[_this.styles.containerWithPanel(_this.theme)] = hasPanel,
-                        _b[_this.styles.mobileContainer(_this.theme)] = _this.isMobileLayout,
-                        _b[_this.styles.mobileContainerWithoutHeader(_this.theme)] = _this.isMobileLayout && !hasHeader,
+                React.createElement("div", { "data-tid": SidePageContainerDataTids.root, className: cx((_b = {},
+                        _b[styles.container] = true,
+                        _b[styles.containerWithoutHeader] = !hasHeader,
+                        _b[styles.containerWithoutFooter] = !hasFooter,
+                        _b[styles.containerWithPanel] = hasPanel,
+                        _b[styles.mobileContainer] = _this.isMobileLayout,
+                        _b[styles.mobileContainerWithoutHeader] = _this.isMobileLayout && !hasHeader,
                         _b)) }, _this.props.children)));
         }));
     };
     SidePageContainer.__KONTUR_REACT_UI__ = 'SidePageContainer';
     SidePageContainer.displayName = 'SidePageContainer';
     SidePageContainer = __decorate([
-        withRenderEnvironment,
         responsiveLayout,
         rootNode
     ], SidePageContainer);

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

	@@ -1 +1 @@
1	- {"version":3,"file":"SidePageContainer.js","sourceRoot":"","sources":["SidePageContainer.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AACA~~,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AACtE,OAAO,EAAE,~~qBAAqB~~,EAAE,MAAM,~~sCAAsC~~,CAAC;~~AAE7E~~,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;~~AAEvD~~,OAAO,EAAE,~~YAAY,EAAE,MAAM,mCAAmC,CAAC;AACjE,OAAO,EAAE,~~gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AACpE,OAAO,EAAE,~~SAAS~~,EAAE,MAAM,~~sBAAsB~~,CAAC;~~AACjD~~,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAIvD,MAAM,CAAC,IAAM,yBAAyB,GAAG;IACvC,IAAI,EAAE,yBAAyB;CACvB,CAAC;AAEX;;;;GAIG;~~AAIH~~;IAAuC,qCAAuC;IAA9E;;~~IAgDA~~,CAAC;~~IApCQ~~,kCAAM,GAAb;~~QAAA~~,~~iBAWC;QAVC~~,IAAI,CAAC,~~MAAM,GAAG,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAEtC,OAAO,CACL,oBAAC,YAAY,CAAC,QAAQ,QACnB,UAAC,KAAK;YACL,KAAI,CAAC,KAAK,GAAG,KAAK,CAAC;YACnB,OAAO,KAAI,CAAC,~~UAAU,EAAE,CAAC;~~QAC3B~~,CAAC~~,CACqB,CACzB,CAAC~~;~~IACJ,CAAC;~~IAEM,sCAAU,GAAjB;QAAA,iBAsBC;QArBC,OAAO,CACL,oBAAC,eAAe,CAAC,QAAQ,QACtB,UAAC,EAAkC;;gBAAhC,SAAS,eAAA,EAAE,SAAS,eAAA,EAAE,QAAQ,cAAA;YAAO,OAAA,CACvC,oBAAC,aAAa,aAAC,WAAW,EAAE,KAAI,CAAC,WAAW,IAAM,KAAI,CAAC,KAAK;gBAC1D,yCACY,yBAAyB,CAAC,IAAI,EACxC,SAAS,EAAE,~~KAAI,CAAC,~~EAAE;~~wBAChB~~,GAAC,~~KAAI,CAAC,~~MAAM,CAAC,SAAS,~~CAAC,KAAI,CAAC,KAAK,CAAC,~~IAAG,IAAI;~~wBACzC~~,GAAC,~~KAAI,CAAC,~~MAAM,CAAC,sBAAsB,~~CAAC,KAAI,CAAC,KAAK,CAAC,~~IAAG,CAAC,SAAS;~~wBAC5D~~,GAAC,~~KAAI,CAAC,~~MAAM,CAAC,sBAAsB,~~CAAC,KAAI,CAAC,KAAK,CAAC,~~IAAG,CAAC,SAAS;~~wBAC5D~~,GAAC,~~KAAI,CAAC,~~MAAM,CAAC,kBAAkB,~~CAAC,KAAI,CAAC,KAAK,CAAC,~~IAAG,QAAQ;~~wBACtD~~,GAAC,~~KAAI,CAAC,~~MAAM,CAAC,eAAe,~~CAAC,KAAI,CAAC,KAAK,CAAC,~~IAAG,KAAI,CAAC,cAAc;~~wBAC9D~~,GAAC,~~KAAI,CAAC,~~MAAM,CAAC,4BAA4B,~~CAAC,KAAI,CAAC,KAAK,CAAC,~~IAAG,KAAI,CAAC,cAAc,IAAI,CAAC,SAAS;~~4BACzF~~,IAED,KAAI,CAAC,KAAK,CAAC,QAAQ,CAChB,CACQ,CACjB;QAhBwC,CAgBxC,CACwB,CAC5B,CAAC;IACJ,CAAC;~~IA9Ca~~,qCAAmB,GAAG,mBAAmB,AAAtB,CAAuB;IAC1C,6BAAW,GAAG,mBAAmB,AAAtB,CAAuB;IAFrC,iBAAiB;~~QAH7B~~,~~qBAAqB;QACrB,~~gBAAgB;QAChB,QAAQ;OACI,iBAAiB,~~CAgD7B~~;IAAD,wBAAC;CAAA,~~AAhDD~~,CAAuC,KAAK,CAAC,SAAS,~~GAgDrD~~;~~SAhDY~~,iBAAiB","sourcesContent":["import ~~type { Emotion } from '@emotion/css/create-instance';\nimport~~ React from 'react';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { ~~withRenderEnvironment~~ } from '../../lib/~~renderEnvironment/index~~.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport ~~type~~ { ~~Theme } from '../../lib/theming/Theme.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport {~~ responsiveLayout } from '../ResponsiveLayout/decorator.js';\nimport { ~~getStyles~~ } from './SidePage.~~styles~~.js';\nimport { SidePageContext } from './SidePageContext.js';\n\nexport type SidePageContainerProps = CommonProps;\n\nexport const SidePageContainerDataTids = {\n root: 'SidePageContainer__root',\n} as const;\n\n/*\n Контейнер с отступами для содержимого сайдпейджа.\n \n @visibleName SidePage.Container\n */\n@~~withRenderEnvironment\n@~~responsiveLayout\n@rootNode\nexport class SidePageContainer extends React.Component<SidePageContainerProps> {\n public static __KONTUR_REACT_UI__ = 'SidePageContainer';\n public static displayName = 'SidePageContainer';\n\n private ~~emotion!: Emotion;\n private cx!: Emotion['cx'];\n private styles!: ReturnType<typeof getStyles>;\n private theme!: Theme;\n private~~ isMobileLayout!: boolean;\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n\n public render(): React.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 public renderMain(): React.JSX.Element {\n return (\n <SidePageContext.Consumer>\n {({ hasHeader, hasFooter, hasPanel }) => (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div\n data-tid={SidePageContainerDataTids.root}\n className={~~this.~~cx({\n [~~this.~~styles.container~~(this.theme)~~]: true,\n [~~this.~~styles.containerWithoutHeader~~(this.theme)~~]: !hasHeader,\n [~~this.~~styles.containerWithoutFooter~~(this.theme)~~]: !hasFooter,\n [~~this.~~styles.containerWithPanel~~(this.theme)~~]: hasPanel,\n [~~this.~~styles.mobileContainer~~(this.theme)~~]: this.isMobileLayout,\n [~~this.~~styles.mobileContainerWithoutHeader~~(this.theme)~~]: this.isMobileLayout && !hasHeader,\n })}\n >\n {this.props.children}\n </div>\n </CommonWrapper>\n )}\n </SidePageContext.Consumer>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"SidePageContainer.js","sourceRoot":"","sources":["SidePageContainer.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AACtE,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AAErC,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AACpE,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAIvD,MAAM,CAAC,IAAM,yBAAyB,GAAG;IACvC,IAAI,EAAE,yBAAyB;CACvB,CAAC;AAEX;;;;GAIG;AAGH;IAAuC,qCAAuC;IAA9E;;IAmCA,CAAC;IA3BQ,kCAAM,GAAb;QACE,OAAO,IAAI,CAAC,UAAU,EAAE,CAAC;IAC3B,CAAC;IAEM,sCAAU,GAAjB;QAAA,iBAsBC;QArBC,OAAO,CACL,oBAAC,eAAe,CAAC,QAAQ,QACtB,UAAC,EAAkC;;gBAAhC,SAAS,eAAA,EAAE,SAAS,eAAA,EAAE,QAAQ,cAAA;YAAO,OAAA,CACvC,oBAAC,aAAa,aAAC,WAAW,EAAE,KAAI,CAAC,WAAW,IAAM,KAAI,CAAC,KAAK;gBAC1D,yCACY,yBAAyB,CAAC,IAAI,EACxC,SAAS,EAAE,EAAE;wBACX,GAAC,MAAM,CAAC,SAAS,IAAG,IAAI;wBACxB,GAAC,MAAM,CAAC,sBAAsB,IAAG,CAAC,SAAS;wBAC3C,GAAC,MAAM,CAAC,sBAAsB,IAAG,CAAC,SAAS;wBAC3C,GAAC,MAAM,CAAC,kBAAkB,IAAG,QAAQ;wBACrC,GAAC,MAAM,CAAC,eAAe,IAAG,KAAI,CAAC,cAAc;wBAC7C,GAAC,MAAM,CAAC,4BAA4B,IAAG,KAAI,CAAC,cAAc,IAAI,CAAC,SAAS;4BACxE,IAED,KAAI,CAAC,KAAK,CAAC,QAAQ,CAChB,CACQ,CACjB;QAhBwC,CAgBxC,CACwB,CAC5B,CAAC;IACJ,CAAC;IAjCa,qCAAmB,GAAG,mBAAmB,AAAtB,CAAuB;IAC1C,6BAAW,GAAG,mBAAmB,AAAtB,CAAuB;IAFrC,iBAAiB;QAF7B,gBAAgB;QAChB,QAAQ;OACI,iBAAiB,CAmC7B;IAAD,wBAAC;CAAA,AAnCD,CAAuC,KAAK,CAAC,SAAS,GAmCrD;SAnCY,iBAAiB","sourcesContent":["import React from 'react';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { cx } from '../../lib/cx.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport { responsiveLayout } from '../ResponsiveLayout/decorator.js';\nimport { styles } from './SidePage.css.js';\nimport { SidePageContext } from './SidePageContext.js';\n\nexport type SidePageContainerProps = CommonProps;\n\nexport const SidePageContainerDataTids = {\n root: 'SidePageContainer__root',\n} as const;\n\n/*\n Контейнер с отступами для содержимого сайдпейджа.\n \n @visibleName SidePage.Container\n */\n@responsiveLayout\n@rootNode\nexport class SidePageContainer extends React.Component<SidePageContainerProps> {\n public static __KONTUR_REACT_UI__ = 'SidePageContainer';\n public static displayName = 'SidePageContainer';\n\n private isMobileLayout!: boolean;\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n\n public render(): React.JSX.Element {\n return this.renderMain();\n }\n\n public renderMain(): React.JSX.Element {\n return (\n <SidePageContext.Consumer>\n {({ hasHeader, hasFooter, hasPanel }) => (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div\n data-tid={SidePageContainerDataTids.root}\n className={cx({\n [styles.container]: true,\n [styles.containerWithoutHeader]: !hasHeader,\n [styles.containerWithoutFooter]: !hasFooter,\n [styles.containerWithPanel]: hasPanel,\n [styles.mobileContainer]: this.isMobileLayout,\n [styles.mobileContainerWithoutHeader]: this.isMobileLayout && !hasHeader,\n })}\n >\n {this.props.children}\n </div>\n </CommonWrapper>\n )}\n </SidePageContext.Consumer>\n );\n }\n}\n"]}

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

@@ -32,10 +32,6 @@ export declare class SidePageFooter extends React.Component<React.PropsWithChild
     private isMobileLayout;
     state: SidePageFooterState;
     private globalObject;
-    private emotion;
-    private cx;
-    private styles;
-    private theme;
     private content;
     private layoutSub;
     getRootNode: TGetRootNode;
@@ -44,9 +40,8 @@ export declare class SidePageFooter extends React.Component<React.PropsWithChild
     componentDidUpdate(prevProps: Readonly<SidePageFooterProps>): void;
     componentWillUnmount(): void;
     getSticky(): boolean;
-    render(): JSX.Element;
     update: () => void;
-    private renderMain;
+    render(): JSX.Element;
     private refContent;
     private setProperStyles;
     private getContentHeight;

package/components/SidePage/SidePageFooter.js CHANGED Viewed

@@ -32,16 +32,16 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import React from 'react';
 import { CommonWrapper } from '../../internal/CommonWrapper/index.js';
+import { cx } from '../../lib/cx.js';
 import { getDOMRect } from '../../lib/dom/getDOMRect.js';
 import * as LayoutEvents from '../../lib/LayoutEvents.js';
 import { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';
 import { getRootNode, rootNode } from '../../lib/rootNode/index.js';
-import { ThemeContext } from '../../lib/theming/ThemeContext.js';
 import { isNonNullable } from '../../lib/utils.js';
 import { Gapped } from '../Gapped/index.js';
 import { ModalSeparator } from '../Modal/ModalSeparator.js';
 import { responsiveLayout } from '../ResponsiveLayout/decorator.js';
-import { getStyles } from './SidePage.styles.js';
+import { styles } from './SidePage.css.js';
 import { SidePageContext } from './SidePageContext.js';
 export var SidePageFooterDataTids = {
     root: 'SidePageFooter__root',
@@ -112,32 +112,24 @@ var SidePageFooter = /** @class */ (function (_super) {
         return true;
     };
     SidePageFooter.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();
-        }));
-    };
-    SidePageFooter.prototype.renderMain = function () {
         var _this = this;
         var separator = (this.props.panel || this.state.fixed) && (React.createElement(ModalSeparator, { fixed: this.state.fixed }));
         return (React.createElement(CommonWrapper, __assign({ rootNodeRef: this.setRootNode }, this.props),
-            React.createElement("div", { "data-tid": SidePageFooterDataTids.root, style: { height: this.getContentHeight() }, className: this.styles.footerWrapper() },
+            React.createElement("div", { "data-tid": SidePageFooterDataTids.root, style: { height: this.getContentHeight() }, className: styles.footerWrapper },
                 React.createElement(SidePageContext.Consumer, null, function (_a) {
                     var _b, _c;
                     var getWidth = _a.getWidth;
-                    return (React.createElement("div", { className: _this.cx(_this.styles.footer(_this.theme), (_b = {},
-                            _b[_this.styles.positionStatic()] = !_this.getSticky(),
+                    return (React.createElement("div", { className: cx(styles.footer, (_b = {},
+                            _b[styles.positionStatic] = !_this.getSticky(),
                             _b)), style: {
                             width: getWidth(),
                         } },
                         separator,
-                        React.createElement("div", { className: _this.cx(_this.styles.footerContent(_this.theme), (_c = {},
-                                _c[_this.styles.footerFixed(_this.theme)] = _this.state.fixed,
-                                _c[_this.styles.panel(_this.theme)] = !!_this.props.panel,
-                                _c[_this.styles.panelFixed(_this.theme)] = !!_this.props.panel && _this.state.fixed,
-                                _c[_this.styles.mobileFooterContent(_this.theme)] = _this.isMobileLayout,
+                        React.createElement("div", { className: cx(styles.footerContent, (_c = {},
+                                _c[styles.footerFixed] = _this.state.fixed,
+                                _c[styles.panel] = !!_this.props.panel,
+                                _c[styles.panelFixed] = !!_this.props.panel && _this.state.fixed,
+                                _c[styles.mobileFooterContent] = _this.isMobileLayout,
                                 _c)), ref: _this.refContent }, isNonNullable(_this.props.gap) ? (React.createElement(Gapped, { vertical: _this.isMobileLayout, gap: _this.props.gap }, _this.props.children)) : (_this.props.children))));
                 }))));
     };