@skbkontur/react-ui 4.0.0 → 4.0.3
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.
- package/CHANGELOG.md +36 -0
- package/cjs/components/Button/Button.js +1 -1
- package/cjs/components/Button/Button.js.map +1 -1
- package/cjs/components/DatePicker/DatePicker.d.ts +0 -3
- package/cjs/components/DatePicker/DatePicker.js +14 -9
- package/cjs/components/DatePicker/DatePicker.js.map +1 -1
- package/cjs/components/Modal/Modal.js +2 -2
- package/cjs/components/Modal/Modal.js.map +1 -1
- package/cjs/components/Modal/ModalFooter.js +1 -0
- package/cjs/components/Modal/ModalFooter.js.map +1 -1
- package/cjs/components/Modal/ModalHeader.js +1 -0
- package/cjs/components/Modal/ModalHeader.js.map +1 -1
- package/cjs/components/SidePage/SidePage.styles.js +2 -2
- package/cjs/components/SidePage/SidePage.styles.js.map +1 -1
- package/cjs/components/Textarea/TextareaCounter.js +3 -4
- package/cjs/components/Textarea/TextareaCounter.js.map +1 -1
- package/cjs/components/Toast/Toast.styles.js +2 -2
- package/cjs/components/Toast/Toast.styles.js.map +1 -1
- package/cjs/internal/DropdownContainer/DropdownContainer.d.ts +1 -1
- package/cjs/internal/DropdownContainer/DropdownContainer.js +15 -13
- package/cjs/internal/DropdownContainer/DropdownContainer.js.map +1 -1
- package/cjs/internal/ThemeShowcase/ThemeShowcase.js +29 -29
- package/cjs/internal/ThemeShowcase/ThemeShowcase.js.map +1 -1
- package/cjs/internal/ThemeShowcase/VariablesCollector.js +14 -9
- package/cjs/internal/ThemeShowcase/VariablesCollector.js.map +1 -1
- package/cjs/internal/icons/SpinnerIcon.js +2 -2
- package/cjs/internal/icons/SpinnerIcon.js.map +1 -1
- package/components/Button/Button/Button.js +1 -2
- package/components/Button/Button/Button.js.map +1 -1
- package/components/DatePicker/DatePicker/DatePicker.js +19 -15
- package/components/DatePicker/DatePicker/DatePicker.js.map +1 -1
- package/components/DatePicker/DatePicker.d.ts +0 -3
- package/components/Modal/Modal/Modal.js +1 -1
- package/components/Modal/Modal/Modal.js.map +1 -1
- package/components/Modal/ModalFooter/ModalFooter.js +1 -1
- package/components/Modal/ModalFooter/ModalFooter.js.map +1 -1
- package/components/Modal/ModalHeader/ModalHeader.js +1 -1
- package/components/Modal/ModalHeader/ModalHeader.js.map +1 -1
- package/components/SidePage/SidePage.styles/SidePage.styles.js +2 -2
- package/components/SidePage/SidePage.styles/SidePage.styles.js.map +1 -1
- package/components/Textarea/TextareaCounter/TextareaCounter.js +4 -6
- package/components/Textarea/TextareaCounter/TextareaCounter.js.map +1 -1
- package/components/Toast/Toast.styles/Toast.styles.js +2 -2
- package/components/Toast/Toast.styles/Toast.styles.js.map +1 -1
- package/internal/DropdownContainer/DropdownContainer/DropdownContainer.js +18 -21
- package/internal/DropdownContainer/DropdownContainer/DropdownContainer.js.map +1 -1
- package/internal/DropdownContainer/DropdownContainer.d.ts +1 -1
- package/internal/ThemeShowcase/ThemeShowcase/ThemeShowcase.js +2 -2
- package/internal/ThemeShowcase/ThemeShowcase/ThemeShowcase.js.map +1 -1
- package/internal/ThemeShowcase/VariablesCollector/VariablesCollector.js +18 -10
- package/internal/ThemeShowcase/VariablesCollector/VariablesCollector.js.map +1 -1
- package/internal/icons/SpinnerIcon/SpinnerIcon.js +2 -3
- package/internal/icons/SpinnerIcon/SpinnerIcon.js.map +1 -1
- package/package.json +3 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["SidePage.styles.ts"],"names":["styles","root","css","mobileRoot","overlay","body","t","modalBodyTextColor","mobileBody","container","sidePagePaddingLeft","sidePagePaddingRight","mobileContainer","mobileSidePagePaddingLeft","mobileSidePagePaddingRight","mobileSidePagePaddingBottom","containerWithoutHeader","sidePagePaddingTop","mobileContainerWithoutHeader","mobileSidePagePaddingTop","containerWithoutFooter","sidePagePaddingBottom","containerWithPanel","focusLock","wrapper","sidePageBgDefault","wrapperLeft","wrapperMarginLeft","wrapperMarginRight","headerWrapper","header","sidePageHeaderFontSize","sidePageHeaderLineHeight","sidePageHeaderPaddingTop","sidePageHeaderPaddingBottom","sidePageHeaderTextColor","mobileHeader","mobileSidePageHeaderFontSize","mobileSidePageHeaderLineHeight","mobileSidePageHeaderPaddingTop","mobileSidePageHeaderPaddingBottom","headerFixed","sidePageHeaderFixedFontSize","sidePageHeaderFixedLineHeight","sidePageHeaderFixedPaddingY","sidePageFixedHeaderShadow","title","paddingRight","parseInt","sidePageCloseButtonPadding","sidePageCloseButtonLegacyPaddingLeft","sidePageCloseIconSize","mobileTitle","mobileSidePageCloseButtonPadding","titleFixed","background","backgroundGray","sidePageBackingBg","sidePageBackingBgOpacity","shadow","sidePageContainerShadow","close","sidePageCloseButtonColor","sidePageCloseButtonClickArea","sidePageCloseButtonHoverColor","mobileClose","mobileSidePageCloseButtonClickArea","closeFocus","borderColorFocus","wrapperClose","mobileWrapperClose","panel","sidePageFooterPanelBg","sidePageFooterPanelPaddingTop","sidePageFooterPanelPaddingBottom","wrapperCloseFixed","footerWrapper","footer","sidePageFooterTextColor","positionStatic","footerContent","sidePageFooterPaddingTop","sidePageFooterPaddingBottom","mobileFooterContent","mobileSidePageFooterPadding","footerFixed","sidePageFixedFooterShadow","panelFixed","sidePageFixedPanelShadow","transitionLeft","transitionRight","transitionActive","transitionLeave","transitionLeaveActive"],"mappings":"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","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { resetButton } from '../../lib/styles/Mixins';\n\nexport const styles = memoizeStyle({\n root() {\n return css`\n height: 100%;\n position: fixed;\n top: 0;\n `;\n },\n\n mobileRoot() {\n return css`\n width: 100%;\n `;\n },\n\n overlay() {\n return css`\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n `;\n },\n\n body(t: Theme) {\n return css`\n flex: 1 0 auto;\n z-index: 0;\n color: ${t.modalBodyTextColor};\n `;\n },\n\n mobileBody() {\n return css`\n font-size: 16px;\n line-height: 22px;\n `;\n },\n\n container(t: Theme) {\n return css`\n padding-left: ${t.sidePagePaddingLeft};\n padding-right: ${t.sidePagePaddingRight};\n `;\n },\n\n mobileContainer(t: Theme) {\n return css`\n padding-left: ${t.mobileSidePagePaddingLeft};\n padding-right: ${t.mobileSidePagePaddingRight};\n padding-bottom: ${t.mobileSidePagePaddingBottom};\n `;\n },\n\n containerWithoutHeader(t: Theme) {\n return css`\n padding-top: ${t.sidePagePaddingTop};\n `;\n },\n\n mobileContainerWithoutHeader(t: Theme) {\n return css`\n padding-top: ${t.mobileSidePagePaddingTop};\n `;\n },\n\n containerWithoutFooter(t: Theme) {\n return css`\n padding-bottom: ${t.sidePagePaddingBottom};\n `;\n },\n\n containerWithPanel(t: Theme) {\n return css`\n padding-bottom: ${t.sidePagePaddingBottom};\n `;\n },\n\n focusLock() {\n return css`\n height: 100%;\n `;\n },\n\n wrapper(t: Theme) {\n return css`\n background: ${t.sidePageBgDefault};\n float: right;\n height: 100%;\n width: 100%;\n overflow-y: auto;\n position: relative;\n white-space: normal;\n align-items: stretch;\n display: flex;\n flex-direction: column;\n `;\n },\n\n wrapperLeft() {\n return css`\n float: left;\n `;\n },\n\n wrapperMarginLeft() {\n return css`\n margin-left: 20px;\n `;\n },\n\n wrapperMarginRight() {\n return css`\n margin-right: 20px;\n `;\n },\n\n headerWrapper() {\n return css`\n flex: 0 0 auto;\n `;\n },\n\n header(t: Theme) {\n return css`\n font-size: ${t.sidePageHeaderFontSize};\n line-height: ${t.sidePageHeaderLineHeight};\n padding: ${t.sidePageHeaderPaddingTop} 0 ${t.sidePageHeaderPaddingBottom};\n width: 100%;\n position: relative;\n color: ${t.sidePageHeaderTextColor};\n `;\n },\n\n mobileHeader(t: Theme) {\n return css`\n font-size: ${t.mobileSidePageHeaderFontSize};\n line-height: ${t.mobileSidePageHeaderLineHeight};\n padding: ${t.mobileSidePageHeaderPaddingTop} 0 ${t.mobileSidePageHeaderPaddingBottom};\n `;\n },\n\n headerFixed(t: Theme) {\n return css`\n background: ${t.sidePageBgDefault};\n font-size: ${t.sidePageHeaderFixedFontSize};\n line-height: ${t.sidePageHeaderFixedLineHeight};\n padding: ${t.sidePageHeaderFixedPaddingY} 0;\n\n &:after {\n bottom: 0px;\n content: '';\n position: absolute;\n height: 1px;\n width: 100%;\n left: 0;\n z-index: -1;\n box-shadow: ${t.sidePageFixedHeaderShadow};\n }\n `;\n },\n\n title(t: Theme) {\n const paddingRight =\n parseInt(t.sidePageCloseButtonPadding) +\n parseInt(t.sidePageCloseButtonLegacyPaddingLeft) +\n parseInt(t.sidePageCloseIconSize);\n return css`\n padding-left: ${t.sidePagePaddingLeft};\n padding-right: ${paddingRight}px;\n `;\n },\n\n mobileTitle(t: Theme) {\n const paddingRight = parseInt(t.mobileSidePageCloseButtonPadding) * 2 + parseInt(t.sidePageCloseIconSize);\n return css`\n padding-left: ${t.mobileSidePagePaddingLeft};\n padding-right: ${paddingRight}px;\n `;\n },\n\n titleFixed() {\n return css`\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n `;\n },\n\n background() {\n return css`\n height: 100%;\n position: absolute;\n width: 100%;\n `;\n },\n\n backgroundGray(t: Theme) {\n return css`\n background: ${t.sidePageBackingBg};\n opacity: ${t.sidePageBackingBgOpacity};\n `;\n },\n\n shadow(t: Theme) {\n return css`\n box-shadow: ${t.sidePageContainerShadow};\n `;\n },\n\n close(t: Theme) {\n return css`\n ${resetButton()};\n cursor: pointer;\n color: ${t.sidePageCloseButtonColor};\n padding: ${t.sidePageCloseButtonClickArea};\n margin: -${t.sidePageCloseButtonClickArea};\n font-size: 0;\n\n &:focus,\n &:hover {\n color: ${t.sidePageCloseButtonHoverColor};\n }\n\n & > svg {\n width: ${t.sidePageCloseIconSize};\n height: ${t.sidePageCloseIconSize};\n box-sizing: content-box;\n }\n `;\n },\n\n mobileClose(t: Theme) {\n return css`\n padding: ${t.mobileSidePageCloseButtonClickArea};\n margin: -${t.mobileSidePageCloseButtonClickArea};\n font-size: 0;\n `;\n },\n\n closeFocus(t: Theme) {\n return css`\n outline: 2px solid ${t.borderColorFocus};\n `;\n },\n\n wrapperClose(t: Theme) {\n return css`\n box-sizing: border-box;\n height: 100%;\n line-height: ${t.sidePageHeaderLineHeight};\n padding: ${t.sidePageHeaderPaddingTop} 0 ${t.sidePageHeaderPaddingBottom};\n position: absolute;\n right: ${t.sidePageCloseButtonPadding};\n top: 0;\n `;\n },\n\n mobileWrapperClose(t: Theme) {\n return css`\n line-height: ${t.mobileSidePageHeaderLineHeight};\n padding: ${t.mobileSidePageHeaderPaddingTop} 0 ${t.mobileSidePageHeaderPaddingBottom};\n right: ${t.mobileSidePageCloseButtonPadding};\n `;\n },\n\n panel(t: Theme) {\n return css`\n background: ${t.sidePageFooterPanelBg};\n padding: ${t.sidePageFooterPanelPaddingTop} ${t.sidePagePaddingRight} ${t.sidePageFooterPanelPaddingBottom}\n ${t.sidePagePaddingLeft};\n `;\n },\n\n wrapperCloseFixed(t: Theme) {\n return css`\n line-height: ${t.sidePageHeaderFixedLineHeight};\n padding: ${t.sidePageHeaderFixedPaddingY} 0;\n `;\n },\n\n footerWrapper() {\n return css`\n flex: 0 0 auto;\n `;\n },\n\n footer(t: Theme) {\n return css`\n bottom: 0;\n position: fixed;\n z-index: 10;\n color: ${t.sidePageFooterTextColor};\n `;\n },\n\n positionStatic() {\n return css`\n position: static;\n `;\n },\n\n footerContent(t: Theme) {\n return css`\n padding: ${t.sidePageFooterPaddingTop} ${t.sidePagePaddingRight} ${t.sidePageFooterPaddingBottom}\n ${t.sidePagePaddingLeft};\n `;\n },\n\n mobileFooterContent(t: Theme) {\n return css`\n display: flex;\n flex-flow: column nowrap;\n padding: ${t.mobileSidePageFooterPadding};\n `;\n },\n\n footerFixed(t: Theme) {\n return css`\n background: ${t.sidePageBgDefault};\n\n &:before {\n top: 0px;\n content: '';\n position: absolute;\n height: 1px;\n width: 100%;\n left: 0;\n z-index: -1;\n box-shadow: ${t.sidePageFixedFooterShadow};\n }\n `;\n },\n\n panelFixed(t: Theme) {\n return css`\n &:before {\n box-shadow: ${t.sidePageFixedPanelShadow};\n }\n `;\n },\n\n transitionLeft() {\n return css`\n transform: translateX(100px);\n `;\n },\n\n transitionRight() {\n return css`\n transform: translateX(-100px);\n `;\n },\n\n transitionActive() {\n return css`\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;\n transform: translate(0, 0);\n `;\n },\n\n transitionLeave() {\n return css`\n opacity: 1;\n `;\n },\n\n transitionLeaveActive() {\n return css`\n opacity: 0.01;\n transition: opacity 0.15s ease-out;\n `;\n },\n});\n"]}
|
|
1
|
+
{"version":3,"sources":["SidePage.styles.ts"],"names":["styles","root","css","mobileRoot","overlay","body","t","modalBodyTextColor","mobileBody","container","sidePagePaddingLeft","sidePagePaddingRight","mobileContainer","mobileSidePagePaddingLeft","mobileSidePagePaddingRight","mobileSidePagePaddingBottom","containerWithoutHeader","sidePagePaddingTop","mobileContainerWithoutHeader","mobileSidePagePaddingTop","containerWithoutFooter","sidePagePaddingBottom","containerWithPanel","focusLock","wrapper","sidePageBgDefault","wrapperLeft","wrapperMarginLeft","wrapperMarginRight","headerWrapper","header","sidePageHeaderFontSize","sidePageHeaderLineHeight","sidePageHeaderPaddingTop","sidePageHeaderPaddingBottom","sidePageHeaderTextColor","mobileHeader","mobileSidePageHeaderFontSize","mobileSidePageHeaderLineHeight","mobileSidePageHeaderPaddingTop","mobileSidePageHeaderPaddingBottom","headerFixed","sidePageHeaderFixedFontSize","sidePageHeaderFixedLineHeight","sidePageHeaderFixedPaddingY","sidePageFixedHeaderShadow","title","paddingRight","parseInt","sidePageCloseButtonPadding","sidePageCloseButtonLegacyPaddingLeft","sidePageCloseIconSize","mobileTitle","mobileSidePageCloseButtonPadding","titleFixed","background","backgroundGray","sidePageBackingBg","sidePageBackingBgOpacity","shadow","sidePageContainerShadow","close","sidePageCloseButtonColor","sidePageCloseButtonClickArea","sidePageCloseButtonHoverColor","mobileClose","mobileSidePageCloseButtonClickArea","closeFocus","borderColorFocus","wrapperClose","mobileWrapperClose","panel","sidePageFooterPanelBg","sidePageFooterPanelPaddingTop","sidePageFooterPanelPaddingBottom","wrapperCloseFixed","footerWrapper","footer","sidePageFooterTextColor","positionStatic","footerContent","sidePageFooterPaddingTop","sidePageFooterPaddingBottom","mobileFooterContent","mobileSidePageFooterPadding","footerFixed","sidePageFixedFooterShadow","panelFixed","sidePageFixedPanelShadow","transitionLeft","transitionRight","transitionActive","transitionLeave","transitionLeaveActive"],"mappings":"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","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { resetButton } from '../../lib/styles/Mixins';\n\nexport const styles = memoizeStyle({\n root() {\n return css`\n height: 100%;\n position: fixed;\n top: 0;\n `;\n },\n\n mobileRoot() {\n return css`\n width: 100%;\n `;\n },\n\n overlay() {\n return css`\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n `;\n },\n\n body(t: Theme) {\n return css`\n flex: 1 0 auto;\n z-index: 0;\n color: ${t.modalBodyTextColor};\n `;\n },\n\n mobileBody() {\n return css`\n font-size: 16px;\n line-height: 22px;\n `;\n },\n\n container(t: Theme) {\n return css`\n padding-left: ${t.sidePagePaddingLeft};\n padding-right: ${t.sidePagePaddingRight};\n `;\n },\n\n mobileContainer(t: Theme) {\n return css`\n padding-left: ${t.mobileSidePagePaddingLeft};\n padding-right: ${t.mobileSidePagePaddingRight};\n padding-bottom: ${t.mobileSidePagePaddingBottom};\n `;\n },\n\n containerWithoutHeader(t: Theme) {\n return css`\n padding-top: ${t.sidePagePaddingTop};\n `;\n },\n\n mobileContainerWithoutHeader(t: Theme) {\n return css`\n padding-top: ${t.mobileSidePagePaddingTop};\n `;\n },\n\n containerWithoutFooter(t: Theme) {\n return css`\n padding-bottom: ${t.sidePagePaddingBottom};\n `;\n },\n\n containerWithPanel(t: Theme) {\n return css`\n padding-bottom: ${t.sidePagePaddingBottom};\n `;\n },\n\n focusLock() {\n return css`\n height: 100%;\n `;\n },\n\n wrapper(t: Theme) {\n return css`\n background: ${t.sidePageBgDefault};\n float: right;\n height: 100%;\n width: 100%;\n overflow-y: auto;\n position: relative;\n white-space: normal;\n align-items: stretch;\n display: flex;\n flex-direction: column;\n `;\n },\n\n wrapperLeft() {\n return css`\n float: left;\n `;\n },\n\n wrapperMarginLeft() {\n return css`\n margin-left: 20px;\n `;\n },\n\n wrapperMarginRight() {\n return css`\n margin-right: 20px;\n `;\n },\n\n headerWrapper() {\n return css`\n flex: 0 0 auto;\n `;\n },\n\n header(t: Theme) {\n return css`\n font-size: ${t.sidePageHeaderFontSize};\n line-height: ${t.sidePageHeaderLineHeight};\n padding: ${t.sidePageHeaderPaddingTop} 0 ${t.sidePageHeaderPaddingBottom};\n width: 100%;\n position: relative;\n color: ${t.sidePageHeaderTextColor};\n `;\n },\n\n mobileHeader(t: Theme) {\n return css`\n font-size: ${t.mobileSidePageHeaderFontSize};\n line-height: ${t.mobileSidePageHeaderLineHeight};\n padding: ${t.mobileSidePageHeaderPaddingTop} 0 ${t.mobileSidePageHeaderPaddingBottom};\n `;\n },\n\n headerFixed(t: Theme) {\n return css`\n background: ${t.sidePageBgDefault};\n font-size: ${t.sidePageHeaderFixedFontSize};\n line-height: ${t.sidePageHeaderFixedLineHeight};\n padding: ${t.sidePageHeaderFixedPaddingY} 0;\n\n &:after {\n bottom: 0px;\n content: '';\n position: absolute;\n height: 1px;\n width: 100%;\n left: 0;\n z-index: -1;\n box-shadow: ${t.sidePageFixedHeaderShadow};\n }\n `;\n },\n\n title(t: Theme) {\n const paddingRight =\n parseInt(t.sidePageCloseButtonPadding) +\n parseInt(t.sidePageCloseButtonLegacyPaddingLeft) +\n parseInt(t.sidePageCloseIconSize);\n return css`\n padding-left: ${t.sidePagePaddingLeft};\n padding-right: ${paddingRight}px;\n `;\n },\n\n mobileTitle(t: Theme) {\n const paddingRight = parseInt(t.mobileSidePageCloseButtonPadding) * 2 + parseInt(t.sidePageCloseIconSize);\n return css`\n padding-left: ${t.mobileSidePagePaddingLeft};\n padding-right: ${paddingRight}px;\n `;\n },\n\n titleFixed() {\n return css`\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n `;\n },\n\n background() {\n return css`\n height: 100%;\n position: absolute;\n width: 100%;\n `;\n },\n\n backgroundGray(t: Theme) {\n return css`\n background: ${t.sidePageBackingBg};\n opacity: ${t.sidePageBackingBgOpacity};\n `;\n },\n\n shadow(t: Theme) {\n return css`\n box-shadow: ${t.sidePageContainerShadow};\n `;\n },\n\n close(t: Theme) {\n return css`\n ${resetButton()};\n cursor: pointer;\n color: ${t.sidePageCloseButtonColor};\n padding: ${t.sidePageCloseButtonClickArea};\n margin: -${t.sidePageCloseButtonClickArea};\n font-size: 0;\n\n &:focus,\n &:hover {\n color: ${t.sidePageCloseButtonHoverColor};\n }\n\n & > svg {\n width: ${t.sidePageCloseIconSize};\n height: ${t.sidePageCloseIconSize};\n box-sizing: content-box;\n }\n `;\n },\n\n mobileClose(t: Theme) {\n return css`\n padding: ${t.mobileSidePageCloseButtonClickArea};\n margin: -${t.mobileSidePageCloseButtonClickArea};\n font-size: 0;\n `;\n },\n\n closeFocus(t: Theme) {\n return css`\n outline: 2px solid ${t.borderColorFocus};\n `;\n },\n\n wrapperClose(t: Theme) {\n return css`\n box-sizing: border-box;\n height: 100%;\n line-height: ${t.sidePageHeaderLineHeight};\n padding: ${t.sidePageHeaderPaddingTop} 0 ${t.sidePageHeaderPaddingBottom};\n position: absolute;\n right: ${t.sidePageCloseButtonPadding};\n top: 0;\n `;\n },\n\n mobileWrapperClose(t: Theme) {\n return css`\n line-height: ${t.mobileSidePageHeaderLineHeight};\n padding: ${t.mobileSidePageHeaderPaddingTop} 0 ${t.mobileSidePageHeaderPaddingBottom};\n right: ${t.mobileSidePageCloseButtonPadding};\n `;\n },\n\n panel(t: Theme) {\n return css`\n background: ${t.sidePageFooterPanelBg};\n padding: ${t.sidePageFooterPanelPaddingTop} ${t.sidePagePaddingRight} ${t.sidePageFooterPanelPaddingBottom}\n ${t.sidePagePaddingLeft};\n `;\n },\n\n wrapperCloseFixed(t: Theme) {\n return css`\n line-height: ${t.sidePageHeaderFixedLineHeight};\n padding: ${t.sidePageHeaderFixedPaddingY} 0;\n `;\n },\n\n footerWrapper() {\n return css`\n flex: 0 0 auto;\n `;\n },\n\n footer(t: Theme) {\n return css`\n bottom: 0;\n position: fixed;\n z-index: 10;\n color: ${t.sidePageFooterTextColor};\n `;\n },\n\n positionStatic() {\n return css`\n position: static;\n `;\n },\n\n footerContent(t: Theme) {\n return css`\n padding: ${t.sidePageFooterPaddingTop} ${t.sidePagePaddingRight} ${t.sidePageFooterPaddingBottom}\n ${t.sidePagePaddingLeft};\n `;\n },\n\n mobileFooterContent(t: Theme) {\n return css`\n display: flex;\n flex-flow: column nowrap;\n padding: ${t.mobileSidePageFooterPadding};\n `;\n },\n\n footerFixed(t: Theme) {\n return css`\n background: ${t.sidePageBgDefault};\n\n &:before {\n top: 0px;\n content: '';\n position: absolute;\n height: 1px;\n width: 100%;\n left: 0;\n z-index: -1;\n box-shadow: ${t.sidePageFixedFooterShadow};\n }\n `;\n },\n\n panelFixed(t: Theme) {\n return css`\n &:before {\n box-shadow: ${t.sidePageFixedPanelShadow};\n }\n `;\n },\n\n transitionLeft() {\n return css`\n transform: translateX(100px);\n `;\n },\n\n transitionRight() {\n return css`\n transform: translateX(-100px);\n `;\n },\n\n transitionActive() {\n return css`\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 },\n\n transitionLeave() {\n return css`\n opacity: 1;\n `;\n },\n\n transitionLeaveActive() {\n return css`\n opacity: 0.01 !important;\n transition: opacity 0.15s ease-out;\n `;\n },\n});\n"]}
|
|
@@ -30,13 +30,12 @@ ref)
|
|
|
30
30
|
var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);
|
|
31
31
|
var _useState = (0, _react.useState)(textarea.clientWidth),width = _useState[0],setWidth = _useState[1];
|
|
32
32
|
var _useState2 = (0, _react.useState)(textarea.clientHeight),height = _useState2[0],setHeight = _useState2[1];
|
|
33
|
-
var reflow = function
|
|
33
|
+
var reflow = (0, _react.useCallback)(function () {
|
|
34
34
|
var clientWidth = textarea.clientWidth,clientHeight = textarea.clientHeight;
|
|
35
35
|
setWidth(clientWidth);
|
|
36
36
|
setHeight(clientHeight);
|
|
37
|
-
};
|
|
38
|
-
(0, _react.
|
|
39
|
-
(0, _react.useImperativeHandle)(ref, function () {return { reflow: reflow };}, [ref]);
|
|
37
|
+
}, [textarea]);
|
|
38
|
+
(0, _react.useImperativeHandle)(ref, function () {return { reflow: reflow };}, [reflow]);
|
|
40
39
|
var renderTooltipContent = (0, _react.useCallback)(function () {return help;}, [help]);
|
|
41
40
|
var textareaValue = value ? value.toString().length : 0;
|
|
42
41
|
var counterValue = length - textareaValue;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["TextareaCounter.tsx"],"names":["handleHelpMouseDown","e","preventDefault","TextareaCounter","React","forwardRef","ref","length","value","help","onCloseHelp","textarea","theme","ThemeContext","clientWidth","width","setWidth","clientHeight","height","setHeight","reflow","renderTooltipContent","textareaValue","toString","counterValue","counterHelp","textareaCounterHelpIconColor","styles","counterContainer","counter","counterError"],"mappings":"wEAAA;;AAEA;AACA;AACA;AACA;AACA;;;AAGA,6C;;;;;;;;;;;;;;AAcA,IAAMA,mBAAmB,GAAG,SAAtBA,mBAAsB,CAACC,CAAD,UAAuBA,CAAC,CAACC,cAAF,EAAvB,EAA5B;;AAEO,IAAMC,eAAe,gBAAGC,eAAMC,UAAN,CAA2D,SAASF,eAAT;;AAExFG,GAFwF;AAGxF,aAFEC,MAEF,QAFEA,MAEF,CAFUC,KAEV,QAFUA,KAEV,CAFiBC,IAEjB,QAFiBA,IAEjB,CAFuBC,WAEvB,QAFuBA,WAEvB,CAFoCC,QAEpC,QAFoCA,QAEpC;AACA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,kBAA0B,qBAASF,QAAQ,CAACG,WAAlB,CAA1B,CAAOC,KAAP,gBAAcC,QAAd;AACA,mBAA4B,qBAASL,QAAQ,CAACM,YAAlB,CAA5B,CAAOC,MAAP,iBAAeC,SAAf;AACA,MAAMC,MAAM,GAAG,
|
|
1
|
+
{"version":3,"sources":["TextareaCounter.tsx"],"names":["handleHelpMouseDown","e","preventDefault","TextareaCounter","React","forwardRef","ref","length","value","help","onCloseHelp","textarea","theme","ThemeContext","clientWidth","width","setWidth","clientHeight","height","setHeight","reflow","renderTooltipContent","textareaValue","toString","counterValue","counterHelp","textareaCounterHelpIconColor","styles","counterContainer","counter","counterError"],"mappings":"wEAAA;;AAEA;AACA;AACA;AACA;AACA;;;AAGA,6C;;;;;;;;;;;;;;AAcA,IAAMA,mBAAmB,GAAG,SAAtBA,mBAAsB,CAACC,CAAD,UAAuBA,CAAC,CAACC,cAAF,EAAvB,EAA5B;;AAEO,IAAMC,eAAe,gBAAGC,eAAMC,UAAN,CAA2D,SAASF,eAAT;;AAExFG,GAFwF;AAGxF,aAFEC,MAEF,QAFEA,MAEF,CAFUC,KAEV,QAFUA,KAEV,CAFiBC,IAEjB,QAFiBA,IAEjB,CAFuBC,WAEvB,QAFuBA,WAEvB,CAFoCC,QAEpC,QAFoCA,QAEpC;AACA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,kBAA0B,qBAASF,QAAQ,CAACG,WAAlB,CAA1B,CAAOC,KAAP,gBAAcC,QAAd;AACA,mBAA4B,qBAASL,QAAQ,CAACM,YAAlB,CAA5B,CAAOC,MAAP,iBAAeC,SAAf;AACA,MAAMC,MAAM,GAAG,wBAAY,YAAM;AAC/B,QAAQN,WAAR,GAAsCH,QAAtC,CAAQG,WAAR,CAAqBG,YAArB,GAAsCN,QAAtC,CAAqBM,YAArB;AACAD,IAAAA,QAAQ,CAACF,WAAD,CAAR;AACAK,IAAAA,SAAS,CAACF,YAAD,CAAT;AACD,GAJc,EAIZ,CAACN,QAAD,CAJY,CAAf;AAKA,kCAAoBL,GAApB,EAAyB,oBAAO,EAAEc,MAAM,EAANA,MAAF,EAAP,EAAzB,EAA6C,CAACA,MAAD,CAA7C;AACA,MAAMC,oBAAoB,GAAG,wBAAY,oBAAMZ,IAAN,EAAZ,EAAwB,CAACA,IAAD,CAAxB,CAA7B;AACA,MAAMa,aAAa,GAAGd,KAAK,GAAGA,KAAK,CAACe,QAAN,GAAiBhB,MAApB,GAA6B,CAAxD;AACA,MAAMiB,YAAY,GAAGjB,MAAM,GAAGe,aAA9B;AACA,MAAMG,WAAW,GAAG,uBAAWhB,IAAX;AAClBA,EAAAA,IAAI,EADc;;AAGlB,+BAAC,gBAAD,IAAS,GAAG,EAAE,cAAd,EAA8B,OAAO,EAAE,OAAvC,EAAgD,MAAM,EAAEY,oBAAxD,EAA8E,YAAY,EAAEX,WAA5F;AACE,+BAAC,eAAD,IAAa,WAAW,EAAEV,mBAA1B,EAA+C,KAAK,EAAEY,KAAK,CAACc,4BAA5D,GADF,CAHF;;;;AAQA;AACE,0CAAK,SAAS,EAAEC,iBAAOC,gBAAP,CAAwBhB,KAAxB,CAAhB,EAAgD,KAAK,EAAE,EAAEG,KAAK,EAALA,KAAF,EAASG,MAAM,EAANA,MAAT,EAAvD;AACE;AACE,MAAA,SAAS,EAAE,iBAAGS,iBAAOE,OAAP,CAAejB,KAAf,CAAH;AACRe,uBAAOG,YAAP,CAAoBlB,KAApB,CADQ,IACqBY,YAAY,GAAG,CADpC,OADb;;;AAKGA,IAAAA,YALH;AAMGf,IAAAA,IAAI,iBAAI,uCAAM,SAAS,EAAEkB,iBAAOF,WAAP,EAAjB,IAAwCA,WAAxC,CANX,CADF,CADF;;;;AAYD,CApC8B,CAAxB,C","sourcesContent":["import React, { SyntheticEvent, useContext, useCallback, useImperativeHandle, useState } from 'react';\n\nimport { HelpDotIcon } from '../../internal/icons/16px';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { isFunction } from '../../lib/utils';\nimport { Tooltip } from '../Tooltip';\nimport { cx } from '../../lib/theming/Emotion';\n\nimport { TextareaProps } from './Textarea';\nimport { styles } from './Textarea.styles';\n\nexport type TextareaCounterProps = {\n value: TextareaProps['value'];\n length: number;\n help: TextareaProps['counterHelp'];\n onCloseHelp: () => void;\n textarea: HTMLTextAreaElement;\n};\n\nexport interface TextareaCounterRef {\n reflow: () => void;\n}\n\nconst handleHelpMouseDown = (e: SyntheticEvent) => e.preventDefault();\n\nexport const TextareaCounter = React.forwardRef<TextareaCounterRef, TextareaCounterProps>(function TextareaCounter(\n { length, value, help, onCloseHelp, textarea },\n ref,\n) {\n const theme = useContext(ThemeContext);\n const [width, setWidth] = useState(textarea.clientWidth);\n const [height, setHeight] = useState(textarea.clientHeight);\n const reflow = useCallback(() => {\n const { clientWidth, clientHeight } = textarea;\n setWidth(clientWidth);\n setHeight(clientHeight);\n }, [textarea]);\n useImperativeHandle(ref, () => ({ reflow }), [reflow]);\n const renderTooltipContent = useCallback(() => help, [help]);\n const textareaValue = value ? value.toString().length : 0;\n const counterValue = length - textareaValue;\n const counterHelp = isFunction(help) ? (\n help()\n ) : (\n <Tooltip pos={'right bottom'} trigger={'click'} render={renderTooltipContent} onCloseClick={onCloseHelp}>\n <HelpDotIcon onMouseDown={handleHelpMouseDown} color={theme.textareaCounterHelpIconColor} />\n </Tooltip>\n );\n\n return (\n <div className={styles.counterContainer(theme)} style={{ width, height }}>\n <span\n className={cx(styles.counter(theme), {\n [styles.counterError(theme)]: counterValue < 0,\n })}\n >\n {counterValue}\n {help && <span className={styles.counterHelp()}>{counterHelp}</span>}\n </span>\n </div>\n );\n});\n"]}
|
|
@@ -7,7 +7,7 @@ var styles = (0, _Emotion.memoizeStyle)({
|
|
|
7
7
|
|
|
8
8
|
},
|
|
9
9
|
enterActive: function enterActive() {
|
|
10
|
-
return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n transition: transform 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);\n transform: translateY(0);\n "])));
|
|
10
|
+
return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n transition: transform 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);\n transform: translateY(0) !important;\n "])));
|
|
11
11
|
|
|
12
12
|
|
|
13
13
|
|
|
@@ -19,7 +19,7 @@ var styles = (0, _Emotion.memoizeStyle)({
|
|
|
19
19
|
|
|
20
20
|
},
|
|
21
21
|
exitActive: function exitActive() {
|
|
22
|
-
return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n opacity: 0.01;\n transition: opacity 0.15s ease-out;\n "])));
|
|
22
|
+
return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n opacity: 0.01 !important;\n transition: opacity 0.15s ease-out;\n "])));
|
|
23
23
|
|
|
24
24
|
|
|
25
25
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Toast.styles.ts"],"names":["styles","enter","css","enterActive","exit","exitActive"],"mappings":"4QAAA,oD;;AAEO,IAAMA,MAAM,GAAG,2BAAa;AACjCC,EAAAA,KADiC,mBACzB;AACN,eAAOC,YAAP;;;AAGD,GALgC;AAMjCC,EAAAA,WANiC,yBAMnB;AACZ,eAAOD,YAAP;;;;AAID,GAXgC;AAYjCE,EAAAA,IAZiC,kBAY1B;AACL,eAAOF,YAAP;;;;AAID,GAjBgC;AAkBjCG,EAAAA,UAlBiC,wBAkBpB;AACX,eAAOH,YAAP;;;;AAID,GAvBgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\n\nexport const styles = memoizeStyle({\n enter() {\n return css`\n transform: translateY(-40px);\n `;\n },\n enterActive() {\n return css`\n transition: transform 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);\n transform: translateY(0);\n `;\n },\n exit() {\n return css`\n transform: translateY(0);\n opacity: 1;\n `;\n },\n exitActive() {\n return css`\n opacity: 0.01;\n transition: opacity 0.15s ease-out;\n `;\n },\n});\n"]}
|
|
1
|
+
{"version":3,"sources":["Toast.styles.ts"],"names":["styles","enter","css","enterActive","exit","exitActive"],"mappings":"4QAAA,oD;;AAEO,IAAMA,MAAM,GAAG,2BAAa;AACjCC,EAAAA,KADiC,mBACzB;AACN,eAAOC,YAAP;;;AAGD,GALgC;AAMjCC,EAAAA,WANiC,yBAMnB;AACZ,eAAOD,YAAP;;;;AAID,GAXgC;AAYjCE,EAAAA,IAZiC,kBAY1B;AACL,eAAOF,YAAP;;;;AAID,GAjBgC;AAkBjCG,EAAAA,UAlBiC,wBAkBpB;AACX,eAAOH,YAAP;;;;AAID,GAvBgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\n\nexport const styles = memoizeStyle({\n enter() {\n return css`\n transform: translateY(-40px);\n `;\n },\n enterActive() {\n return css`\n transition: transform 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);\n transform: translateY(0) !important;\n `;\n },\n exit() {\n return css`\n transform: translateY(0);\n opacity: 1;\n `;\n },\n exitActive() {\n return css`\n opacity: 0.01 !important;\n transition: opacity 0.15s ease-out;\n `;\n },\n});\n"]}
|
|
@@ -28,10 +28,10 @@ export declare class DropdownContainer extends React.PureComponent<DropdownConta
|
|
|
28
28
|
offsetX: number;
|
|
29
29
|
offsetY: number;
|
|
30
30
|
};
|
|
31
|
-
state: DropdownContainerState;
|
|
32
31
|
private getProps;
|
|
33
32
|
private dom;
|
|
34
33
|
private layoutSub;
|
|
34
|
+
constructor(props: DropdownContainerProps);
|
|
35
35
|
componentDidMount(): void;
|
|
36
36
|
componentWillUnmount(): void;
|
|
37
37
|
render(): JSX.Element;
|
|
@@ -33,7 +33,7 @@ var _DropdownContainer = require("./DropdownContainer.styles");function _getRequ
|
|
|
33
33
|
|
|
34
34
|
|
|
35
35
|
|
|
36
|
-
DropdownContainer = /*#__PURE__*/function (_React$PureComponent) {(0, _inheritsLoose2.default)(DropdownContainer, _React$PureComponent);
|
|
36
|
+
DropdownContainer = /*#__PURE__*/function (_React$PureComponent) {(0, _inheritsLoose2.default)(DropdownContainer, _React$PureComponent);
|
|
37
37
|
|
|
38
38
|
|
|
39
39
|
|
|
@@ -43,22 +43,13 @@ DropdownContainer = /*#__PURE__*/function (_React$PureComponent) {(0, _inheritsL
|
|
|
43
43
|
|
|
44
44
|
|
|
45
45
|
|
|
46
|
-
state = {
|
|
47
|
-
position: null,
|
|
48
|
-
minWidth: 0,
|
|
49
|
-
isDocumentElementRoot: true };_this.
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
getProps = (0, _createPropsGetter.createPropsGetter)(DropdownContainer.defaultProps);_this.
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
46
|
|
|
58
47
|
|
|
59
48
|
|
|
60
49
|
|
|
61
50
|
|
|
51
|
+
function DropdownContainer(props) {var _this;
|
|
52
|
+
_this = _React$PureComponent.call(this, props) || this;_this.getProps = (0, _createPropsGetter.createPropsGetter)(DropdownContainer.defaultProps);_this.
|
|
62
53
|
|
|
63
54
|
|
|
64
55
|
|
|
@@ -207,4 +198,15 @@ DropdownContainer = /*#__PURE__*/function (_React$PureComponent) {(0, _inheritsL
|
|
|
207
198
|
left: offsetX,
|
|
208
199
|
right: null };
|
|
209
200
|
|
|
210
|
-
};return _this;}var _proto = DropdownContainer.prototype;_proto.componentDidMount = function componentDidMount() {this.position();this.layoutSub = LayoutEvents.addListener(this.position);
|
|
201
|
+
};_this.state = { position: null, minWidth: 0, isDocumentElementRoot: getIsDocumentElementRoot() };return _this;}var _proto = DropdownContainer.prototype;_proto.componentDidMount = function componentDidMount() {this.position();this.layoutSub = LayoutEvents.addListener(this.position);};_proto.componentWillUnmount = function componentWillUnmount() {if (this.layoutSub) {this.layoutSub.remove();}};_proto.render = function render() {var _cx;var style = { position: 'absolute', top: '0' };if (this.state.position) {var _this$state$position = this.state.position,top = _this$state$position.top,bottom = _this$state$position.bottom,left = _this$state$position.left,right = _this$state$position.right;style = (0, _extends2.default)({}, style, { top: top !== null ? top : undefined, bottom: bottom !== null ? bottom : undefined, left: left !== null ? left : undefined, right: right !== null ? right : undefined, minWidth: this.state.minWidth, maxWidth: this.props.hasFixedWidth ? this.state.minWidth : undefined });}var content = /*#__PURE__*/_react.default.createElement(_ZIndex.ZIndex, { priority: 'DropdownContainer', wrapperRef: this.ZIndexRef, style: style, className: (0, _Emotion.cx)((_cx = {}, _cx[_DropdownContainer.styles.alignRight()] = this.props.align === 'right' && !_client.isIE11, _cx)) }, this.props.children);return this.props.disablePortal ? content : /*#__PURE__*/_react.default.createElement(_RenderContainer.RenderContainer, null, content);};return DropdownContainer;}(_react.default.PureComponent);exports.DropdownContainer = DropdownContainer;DropdownContainer.__KONTUR_REACT_UI__ = 'DropdownContainer';DropdownContainer.defaultProps = { align: 'left', disablePortal: false, offsetX: 0, offsetY: -1 };
|
|
202
|
+
|
|
203
|
+
|
|
204
|
+
var getIsDocumentElementRoot = function getIsDocumentElementRoot() {
|
|
205
|
+
var _document2 = document,body = _document2.body,documentElement = _document2.documentElement;
|
|
206
|
+
var htmlPosition = getComputedStyle(documentElement).position;
|
|
207
|
+
var bodyPosition = getComputedStyle(body).position;
|
|
208
|
+
|
|
209
|
+
var hasLimitedHeightRoot = body.scrollHeight > body.clientHeight;
|
|
210
|
+
var hasStaticRoot = htmlPosition === 'static' && bodyPosition === 'static';
|
|
211
|
+
return hasLimitedHeightRoot || hasStaticRoot;
|
|
212
|
+
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["DropdownContainer.tsx"],"names":["DropdownContainer","state","position","minWidth","isDocumentElementRoot","getProps","defaultProps","ZIndexRef","element","dom","isElement","node","Element","target","props","getParent","targetRect","getBoundingClientRect","document","body","docEl","documentElement","Error","scrollX","window","pageXOffset","scrollLeft","scrollY","pageYOffset","scrollTop","left","right","align","docWidth","offsetWidth","offsetX","offsetY","bottom","top","distanceToBottom","clientHeight","dropdownHeight","getHeight","scrollHeight","setState","getMinWidth","disablePortal","convertToRelativePosition","child","children","item","height","width","targetHeight","componentDidMount","layoutSub","LayoutEvents","addListener","htmlPosition","getComputedStyle","bodyPosition","hasLimitedHeightRoot","hasStaticRoot","componentWillUnmount","remove","render","style","undefined","maxWidth","hasFixedWidth","content","styles","alignRight","isIE11","React","PureComponent","__KONTUR_REACT_UI__"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { RenderContainer } from '../RenderContainer';\nimport { ZIndex } from '../ZIndex';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { Nullable } from '../../typings/utility-types';\nimport { cx } from '../../lib/theming/Emotion';\nimport { isIE11 } from '../../lib/client';\n\nimport { styles } from './DropdownContainer.styles';\n\nexport interface DropdownContainerPosition {\n top: Nullable<number>;\n bottom: Nullable<number>;\n left: Nullable<number>;\n right: Nullable<number>;\n}\n\nexport interface DropdownContainerProps {\n align?: 'left' | 'right';\n getParent: () => Nullable<HTMLElement>;\n children?: React.ReactNode;\n disablePortal?: boolean;\n offsetY?: number;\n offsetX?: number;\n hasFixedWidth?: boolean;\n}\n\nexport interface DropdownContainerState {\n position: Nullable<DropdownContainerPosition>;\n minWidth: number;\n isDocumentElementRoot?: boolean;\n}\n\nexport class DropdownContainer extends React.PureComponent<DropdownContainerProps, DropdownContainerState> {\n public static __KONTUR_REACT_UI__ = 'DropdownContainer';\n\n public static defaultProps = {\n align: 'left',\n disablePortal: false,\n offsetX: 0,\n offsetY: -1,\n };\n\n public state: DropdownContainerState = {\n position: null,\n minWidth: 0,\n isDocumentElementRoot: true,\n };\n\n private getProps = createPropsGetter(DropdownContainer.defaultProps);\n\n private dom: Nullable<HTMLDivElement>;\n private layoutSub: Nullable<ReturnType<typeof LayoutEvents.addListener>>;\n\n public componentDidMount() {\n this.position();\n this.layoutSub = LayoutEvents.addListener(this.position);\n\n const { body, documentElement: docEl } = document;\n const htmlPosition = getComputedStyle(docEl).position;\n const bodyPosition = getComputedStyle(body).position;\n\n const hasLimitedHeightRoot = body.scrollHeight > body.clientHeight;\n const hasStaticRoot = htmlPosition === 'static' && bodyPosition === 'static';\n\n this.setState({ isDocumentElementRoot: hasLimitedHeightRoot || hasStaticRoot });\n }\n\n public componentWillUnmount() {\n if (this.layoutSub) {\n this.layoutSub.remove();\n }\n }\n\n public render() {\n let style: React.CSSProperties = {\n position: 'absolute',\n top: '0',\n };\n if (this.state.position) {\n const { top, bottom, left, right } = this.state.position;\n style = {\n ...style,\n top: top !== null ? top : undefined,\n bottom: bottom !== null ? bottom : undefined,\n left: left !== null ? left : undefined,\n right: right !== null ? right : undefined,\n minWidth: this.state.minWidth,\n maxWidth: this.props.hasFixedWidth ? this.state.minWidth : undefined,\n };\n }\n\n const content = (\n <ZIndex\n priority={'DropdownContainer'}\n wrapperRef={this.ZIndexRef}\n style={style}\n className={cx({\n [styles.alignRight()]: this.props.align === 'right' && !isIE11,\n })}\n >\n {this.props.children}\n </ZIndex>\n );\n\n return this.props.disablePortal ? content : <RenderContainer>{content}</RenderContainer>;\n }\n\n private ZIndexRef = (element: Nullable<HTMLDivElement>) => {\n this.dom = element;\n };\n\n private isElement = (node: Nullable<Element>): node is Element => {\n return node instanceof Element;\n };\n\n public position = () => {\n const target = this.props.getParent();\n const dom = this.dom;\n\n if (target && this.isElement(target) && dom) {\n const targetRect = target.getBoundingClientRect();\n const { body, documentElement: docEl } = document;\n\n if (!docEl) {\n throw Error('There is no \"documentElement\" in \"document\"');\n }\n\n const scrollX = window.pageXOffset || docEl.scrollLeft || 0;\n const scrollY = window.pageYOffset || docEl.scrollTop || 0;\n\n let left = null;\n let right = null;\n\n if (this.props.align === 'right') {\n const docWidth = docEl.offsetWidth || 0;\n right = docWidth - (targetRect.right + scrollX) + this.getProps().offsetX;\n } else {\n left = targetRect.left + scrollX + this.getProps().offsetX;\n }\n\n const { offsetY = 0 } = this.props;\n let bottom = null;\n let top: number | null = targetRect.bottom + scrollY + offsetY;\n\n const distanceToBottom = docEl.clientHeight - targetRect.bottom;\n const dropdownHeight = this.getHeight();\n\n if (distanceToBottom < dropdownHeight && targetRect.top > dropdownHeight) {\n const clientHeight = this.state.isDocumentElementRoot ? docEl.clientHeight : body.scrollHeight;\n\n top = null;\n bottom = clientHeight + offsetY - scrollY - targetRect.top;\n }\n\n const position = {\n top,\n left,\n right,\n bottom,\n };\n\n this.setState({\n minWidth: this.getMinWidth(),\n position: this.props.disablePortal ? this.convertToRelativePosition(position) : position,\n });\n }\n };\n\n private getHeight = () => {\n if (!this.isElement(this.dom)) {\n return 0;\n }\n const child = this.dom.children.item(0);\n if (!child) {\n return 0;\n }\n return child.getBoundingClientRect().height;\n };\n\n private getMinWidth = () => {\n const target = this.props.getParent();\n if (!target || !this.isElement(target)) {\n return 0;\n }\n return target.getBoundingClientRect().width;\n };\n\n private convertToRelativePosition = (position: DropdownContainerPosition): DropdownContainerPosition => {\n const target = this.props.getParent();\n const { offsetX = 0, offsetY = 0 } = this.props;\n const { top, bottom, left, right } = position;\n if (target && this.isElement(target)) {\n const targetHeight = target.getBoundingClientRect().height;\n return {\n top: top !== null ? targetHeight + offsetY : null,\n bottom: bottom !== null ? targetHeight + offsetY : null,\n left: left !== null ? offsetX : null,\n right: right !== null ? offsetX : null,\n };\n }\n return {\n top: offsetY,\n bottom: null,\n left: offsetX,\n right: null,\n };\n };\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["DropdownContainer.tsx"],"names":["DropdownContainer","props","getProps","defaultProps","ZIndexRef","element","dom","isElement","node","Element","position","target","getParent","targetRect","getBoundingClientRect","document","body","docEl","documentElement","Error","scrollX","window","pageXOffset","scrollLeft","scrollY","pageYOffset","scrollTop","left","right","align","docWidth","offsetWidth","offsetX","offsetY","bottom","top","distanceToBottom","clientHeight","dropdownHeight","getHeight","state","isDocumentElementRoot","scrollHeight","setState","minWidth","getMinWidth","disablePortal","convertToRelativePosition","child","children","item","height","width","targetHeight","getIsDocumentElementRoot","componentDidMount","layoutSub","LayoutEvents","addListener","componentWillUnmount","remove","render","style","undefined","maxWidth","hasFixedWidth","content","styles","alignRight","isIE11","React","PureComponent","__KONTUR_REACT_UI__","htmlPosition","getComputedStyle","bodyPosition","hasLimitedHeightRoot","hasStaticRoot"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { RenderContainer } from '../RenderContainer';\nimport { ZIndex } from '../ZIndex';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { Nullable } from '../../typings/utility-types';\nimport { cx } from '../../lib/theming/Emotion';\nimport { isIE11 } from '../../lib/client';\n\nimport { styles } from './DropdownContainer.styles';\n\nexport interface DropdownContainerPosition {\n top: Nullable<number>;\n bottom: Nullable<number>;\n left: Nullable<number>;\n right: Nullable<number>;\n}\n\nexport interface DropdownContainerProps {\n align?: 'left' | 'right';\n getParent: () => Nullable<HTMLElement>;\n children?: React.ReactNode;\n disablePortal?: boolean;\n offsetY?: number;\n offsetX?: number;\n hasFixedWidth?: boolean;\n}\n\nexport interface DropdownContainerState {\n position: Nullable<DropdownContainerPosition>;\n minWidth: number;\n isDocumentElementRoot?: boolean;\n}\n\nexport class DropdownContainer extends React.PureComponent<DropdownContainerProps, DropdownContainerState> {\n public static __KONTUR_REACT_UI__ = 'DropdownContainer';\n\n public static defaultProps = {\n align: 'left',\n disablePortal: false,\n offsetX: 0,\n offsetY: -1,\n };\n\n private getProps = createPropsGetter(DropdownContainer.defaultProps);\n\n private dom: Nullable<HTMLDivElement>;\n private layoutSub: Nullable<ReturnType<typeof LayoutEvents.addListener>>;\n\n constructor(props: DropdownContainerProps) {\n super(props);\n\n this.state = { position: null, minWidth: 0, isDocumentElementRoot: getIsDocumentElementRoot() };\n }\n\n public componentDidMount() {\n this.position();\n this.layoutSub = LayoutEvents.addListener(this.position);\n }\n\n public componentWillUnmount() {\n if (this.layoutSub) {\n this.layoutSub.remove();\n }\n }\n\n public render() {\n let style: React.CSSProperties = {\n position: 'absolute',\n top: '0',\n };\n if (this.state.position) {\n const { top, bottom, left, right } = this.state.position;\n style = {\n ...style,\n top: top !== null ? top : undefined,\n bottom: bottom !== null ? bottom : undefined,\n left: left !== null ? left : undefined,\n right: right !== null ? right : undefined,\n minWidth: this.state.minWidth,\n maxWidth: this.props.hasFixedWidth ? this.state.minWidth : undefined,\n };\n }\n\n const content = (\n <ZIndex\n priority={'DropdownContainer'}\n wrapperRef={this.ZIndexRef}\n style={style}\n className={cx({\n [styles.alignRight()]: this.props.align === 'right' && !isIE11,\n })}\n >\n {this.props.children}\n </ZIndex>\n );\n\n return this.props.disablePortal ? content : <RenderContainer>{content}</RenderContainer>;\n }\n\n private ZIndexRef = (element: Nullable<HTMLDivElement>) => {\n this.dom = element;\n };\n\n private isElement = (node: Nullable<Element>): node is Element => {\n return node instanceof Element;\n };\n\n public position = () => {\n const target = this.props.getParent();\n const dom = this.dom;\n\n if (target && this.isElement(target) && dom) {\n const targetRect = target.getBoundingClientRect();\n const { body, documentElement: docEl } = document;\n\n if (!docEl) {\n throw Error('There is no \"documentElement\" in \"document\"');\n }\n\n const scrollX = window.pageXOffset || docEl.scrollLeft || 0;\n const scrollY = window.pageYOffset || docEl.scrollTop || 0;\n\n let left = null;\n let right = null;\n\n if (this.props.align === 'right') {\n const docWidth = docEl.offsetWidth || 0;\n right = docWidth - (targetRect.right + scrollX) + this.getProps().offsetX;\n } else {\n left = targetRect.left + scrollX + this.getProps().offsetX;\n }\n\n const { offsetY = 0 } = this.props;\n let bottom = null;\n let top: number | null = targetRect.bottom + scrollY + offsetY;\n\n const distanceToBottom = docEl.clientHeight - targetRect.bottom;\n const dropdownHeight = this.getHeight();\n\n if (distanceToBottom < dropdownHeight && targetRect.top > dropdownHeight) {\n const clientHeight = this.state.isDocumentElementRoot ? docEl.clientHeight : body.scrollHeight;\n\n top = null;\n bottom = clientHeight + offsetY - scrollY - targetRect.top;\n }\n\n const position = {\n top,\n left,\n right,\n bottom,\n };\n\n this.setState({\n minWidth: this.getMinWidth(),\n position: this.props.disablePortal ? this.convertToRelativePosition(position) : position,\n });\n }\n };\n\n private getHeight = () => {\n if (!this.isElement(this.dom)) {\n return 0;\n }\n const child = this.dom.children.item(0);\n if (!child) {\n return 0;\n }\n return child.getBoundingClientRect().height;\n };\n\n private getMinWidth = () => {\n const target = this.props.getParent();\n if (!target || !this.isElement(target)) {\n return 0;\n }\n return target.getBoundingClientRect().width;\n };\n\n private convertToRelativePosition = (position: DropdownContainerPosition): DropdownContainerPosition => {\n const target = this.props.getParent();\n const { offsetX = 0, offsetY = 0 } = this.props;\n const { top, bottom, left, right } = position;\n if (target && this.isElement(target)) {\n const targetHeight = target.getBoundingClientRect().height;\n return {\n top: top !== null ? targetHeight + offsetY : null,\n bottom: bottom !== null ? targetHeight + offsetY : null,\n left: left !== null ? offsetX : null,\n right: right !== null ? offsetX : null,\n };\n }\n return {\n top: offsetY,\n bottom: null,\n left: offsetX,\n right: null,\n };\n };\n}\n\nconst getIsDocumentElementRoot = () => {\n const { body, documentElement } = document;\n const htmlPosition = getComputedStyle(documentElement).position;\n const bodyPosition = getComputedStyle(body).position;\n\n const hasLimitedHeightRoot = body.scrollHeight > body.clientHeight;\n const hasStaticRoot = htmlPosition === 'static' && bodyPosition === 'static';\n return hasLimitedHeightRoot || hasStaticRoot;\n};\n"]}
|
|
@@ -163,57 +163,57 @@ ComponentShowcase = /*#__PURE__*/function (_React$Component2) {(0, _inheritsLoos
|
|
|
163
163
|
var _this$props = this.props,name = _this$props.name,description = _this$props.description,onVariableSelect = _this$props.onVariableSelect,isDebugMode = _this$props.isDebugMode;
|
|
164
164
|
var elements = Object.keys(description);
|
|
165
165
|
|
|
166
|
-
return /*#__PURE__*/
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
166
|
+
return elements.length ? /*#__PURE__*/
|
|
167
|
+
_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null,
|
|
168
|
+
function (theme) {
|
|
169
|
+
return /*#__PURE__*/(
|
|
170
|
+
_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/
|
|
171
|
+
_react.default.createElement(_Sticky.Sticky, { side: 'top', offset: 40 },
|
|
172
|
+
function (isSticky) {var _cx;return /*#__PURE__*/(
|
|
173
|
+
_react.default.createElement("h2", {
|
|
174
|
+
className: (0, _Emotion.cx)((_cx = {}, _cx[
|
|
175
|
+
_ThemeShowcase.styles.heading(theme)] = true, _cx[
|
|
176
|
+
_ThemeShowcase.styles.headingSticky()] = isSticky, _cx)) },
|
|
178
177
|
|
|
179
|
-
_this3.props.name));}), /*#__PURE__*/
|
|
180
178
|
|
|
179
|
+
_this3.props.name));}), /*#__PURE__*/
|
|
181
180
|
|
|
182
181
|
|
|
183
|
-
_react.default.createElement("table", { className: _ThemeShowcase.styles.table() }, /*#__PURE__*/
|
|
184
|
-
_react.default.createElement("thead", null, /*#__PURE__*/
|
|
185
|
-
_react.default.createElement("tr", null, /*#__PURE__*/
|
|
186
|
-
_react.default.createElement("th", { className: _ThemeShowcase.styles.headerCell(), style: { width: 170 } }, "ClassName"), /*#__PURE__*/
|
|
187
182
|
|
|
183
|
+
_react.default.createElement("table", { className: _ThemeShowcase.styles.table() }, /*#__PURE__*/
|
|
184
|
+
_react.default.createElement("thead", null, /*#__PURE__*/
|
|
185
|
+
_react.default.createElement("tr", null, /*#__PURE__*/
|
|
186
|
+
_react.default.createElement("th", { className: _ThemeShowcase.styles.headerCell(), style: { width: 170 } }, "ClassName"), /*#__PURE__*/
|
|
188
187
|
|
|
189
|
-
_react.default.createElement("th", { className: _ThemeShowcase.styles.headerCell(), style: { width: 210 } }, "Variable Name"), /*#__PURE__*/
|
|
190
188
|
|
|
189
|
+
_react.default.createElement("th", { className: _ThemeShowcase.styles.headerCell(), style: { width: 210 } }, "Variable Name"), /*#__PURE__*/
|
|
191
190
|
|
|
192
|
-
_react.default.createElement("th", { className: _ThemeShowcase.styles.headerCell(), style: { width: 250 } }, "Default Value"), /*#__PURE__*/
|
|
193
191
|
|
|
192
|
+
_react.default.createElement("th", { className: _ThemeShowcase.styles.headerCell(), style: { width: 250 } }, "Default Value"), /*#__PURE__*/
|
|
194
193
|
|
|
195
|
-
_react.default.createElement("th", { className: _ThemeShowcase.styles.headerCell(), style: { width: 250 } }, "Dark Value"))), /*#__PURE__*/
|
|
196
194
|
|
|
195
|
+
_react.default.createElement("th", { className: _ThemeShowcase.styles.headerCell(), style: { width: 250 } }, "Dark Value"))), /*#__PURE__*/
|
|
197
196
|
|
|
198
197
|
|
|
199
198
|
|
|
200
|
-
_react.default.createElement("tbody", null,
|
|
201
|
-
elements.map(function (el) {return /*#__PURE__*/(
|
|
202
|
-
_react.default.createElement(ComponentShowcaseRow, {
|
|
203
|
-
key: name + "_" + el,
|
|
204
|
-
element: el,
|
|
205
|
-
row: description[el],
|
|
206
|
-
onVariableSelect: onVariableSelect,
|
|
207
|
-
isDebugMode: isDebugMode }));})))));
|
|
208
199
|
|
|
200
|
+
_react.default.createElement("tbody", null,
|
|
201
|
+
elements.map(function (el) {return /*#__PURE__*/(
|
|
202
|
+
_react.default.createElement(ComponentShowcaseRow, {
|
|
203
|
+
key: name + "_" + el,
|
|
204
|
+
element: el,
|
|
205
|
+
row: description[el],
|
|
206
|
+
onVariableSelect: onVariableSelect,
|
|
207
|
+
isDebugMode: isDebugMode }));})))));
|
|
209
208
|
|
|
210
209
|
|
|
211
210
|
|
|
212
211
|
|
|
213
212
|
|
|
214
|
-
}));
|
|
215
213
|
|
|
214
|
+
}) :
|
|
216
215
|
|
|
216
|
+
null;
|
|
217
217
|
};return ComponentShowcase;}(_react.default.Component);var
|
|
218
218
|
|
|
219
219
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["ThemeShowcase.tsx"],"names":["EMPTY_ARRAY","ALL_VARIABLES","Object","keys","defaultVariables","ThemeShowcase","props","state","isUnmounting","variablesDiff","getItems","query","Promise","resolve","getValues","handleVariableChange","item","setState","selectedVariable","handleUnexpectedVariableInput","values","length","resetVariable","undefined","isDebugMode","forEach","variable","found","ALL_USED_VARIABLES","includes","push","render","IS_PROXY_SUPPORTED","descriptionsToRender","COMPONENT_DESCRIPTIONS_BY_VARIABLE","value","COMPONENT_DESCRIPTIONS","callsCount","CALLS_COUNT","executionTime","EXECUTION_TIME","toFixed","theme","styles","searchBar","sort","map","componentName","componentWillUnmount","lowerCaseQuery","toLowerCase","trim","allItems","filter","usedVariable","startsWith","usedVariableName","label","React","Component","ComponentShowcase","name","description","onVariableSelect","elements","isSticky","heading","headingSticky","table","headerCell","width","el","ComponentShowcaseRow","element","row","rowSpan","variables","invisibleRow","invisibleDarkRow","darkVariables","cell","majorCell","elementName","invisibleCell","varName","dependencies","variableDefault","variableDark","hasNoVariables","suspiciousRow","darkRow","VariableName","handleVariableSelect","variableName","renderDependencies","dependency","DependencyName","dependencyName","dependencyDefault","dependencyDark","handleDependencySelect","onDependencySelect","VariableValue","valueIsColor","isColor","valueIsGradient","isGradient","hasExample","borderColor","ColorFunctions","contrast","colorExample","background","ShowUnusedVariables","diff","unusedVariablesWarning","v","input"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { DEFAULT_THEME as defaultVariables } from '../../lib/theming/themes/DefaultTheme';\nimport { DARK_THEME as darkVariables } from '../../lib/theming/themes/DarkTheme';\nimport { ComboBox, ComboBoxItem } from '../../components/ComboBox';\nimport { Gapped } from '../../components/Gapped';\nimport { Link } from '../../components/Link';\nimport { Sticky } from '../../components/Sticky';\nimport * as ColorFunctions from '../../lib/styles/ColorFunctions';\nimport { Tooltip } from '../../components/Tooltip';\nimport { IS_PROXY_SUPPORTED } from '../../lib/Supports';\nimport { Theme } from '../../lib/theming/Theme';\nimport { cx } from '../../lib/theming/Emotion';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\n\nimport {\n ALL_USED_VARIABLES,\n CALLS_COUNT,\n COMPONENT_DESCRIPTIONS,\n COMPONENT_DESCRIPTIONS_BY_VARIABLE,\n ComponentDescriptionType,\n ComponentRowDescriptionType,\n EXECUTION_TIME,\n} from './VariablesCollector';\nimport { styles } from './ThemeShowcase.styles';\n\nconst EMPTY_ARRAY: string[] = [];\n\nconst ALL_VARIABLES = Object.keys(defaultVariables) as Array<keyof Theme>;\n\ninterface ShowcaseProps {\n isDebugMode?: boolean;\n}\ninterface ShowcaseState {\n selectedVariable?: ComboBoxItem;\n}\n\nexport class ThemeShowcase extends React.Component<ShowcaseProps, ShowcaseState> {\n public state: ShowcaseState = {};\n\n private isUnmounting = false;\n private variablesDiff: string[] = [];\n\n constructor(props: ShowcaseProps) {\n super(props);\n if (props.isDebugMode) {\n ALL_VARIABLES.forEach((variable) => {\n const found = ALL_USED_VARIABLES.includes(variable);\n if (!found) {\n this.variablesDiff.push(variable);\n }\n });\n }\n }\n\n public render() {\n if (!IS_PROXY_SUPPORTED) {\n return (\n <div>\n Таблица использования переменных доступна только в{' '}\n <Link href={'https://caniuse.com/#feat=proxy'} target={'_blank'}>\n браузерах с поддержкой Proxy\n </Link>\n .\n </div>\n );\n }\n\n const selectedVariable = this.state.selectedVariable;\n const descriptionsToRender = selectedVariable\n ? COMPONENT_DESCRIPTIONS_BY_VARIABLE[selectedVariable.value] || {}\n : COMPONENT_DESCRIPTIONS;\n\n const isDebugMode = this.props.isDebugMode;\n const callsCount = isDebugMode ? `(${CALLS_COUNT} вызовов)` : '';\n const executionTime = isDebugMode ? `Сгенерировано за ${EXECUTION_TIME.toFixed(3)}ms` : '';\n\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n return (\n <Gapped wrap gap={30} verticalAlign={'top'}>\n <div>\n <Sticky side={'top'}>\n <div className={styles.searchBar(theme)} data-perf-info={`${executionTime} ${callsCount}`}>\n <Gapped gap={15}>\n <ComboBox\n getItems={this.getItems}\n value={selectedVariable}\n onValueChange={this.handleVariableChange}\n onUnexpectedInput={this.handleUnexpectedVariableInput}\n placeholder={'поиск по названию переменной'}\n />\n {!!selectedVariable && <Link onClick={this.resetVariable}>сбросить</Link>}\n </Gapped>\n </div>\n </Sticky>\n {Object.keys(descriptionsToRender)\n .sort()\n .map((componentName) => (\n <ComponentShowcase\n key={componentName}\n name={componentName}\n description={descriptionsToRender[componentName]}\n isDebugMode={isDebugMode}\n onVariableSelect={this.handleVariableChange}\n />\n ))}\n </div>\n <ShowUnusedVariables diff={this.variablesDiff} />\n </Gapped>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n public componentWillUnmount(): void {\n this.isUnmounting = true;\n }\n\n private getValues(query: string) {\n const lowerCaseQuery = query && query.toLowerCase().trim();\n let allItems = ALL_USED_VARIABLES;\n if (lowerCaseQuery) {\n allItems = ALL_USED_VARIABLES.filter((usedVariable) => usedVariable.toLowerCase().startsWith(lowerCaseQuery));\n }\n return allItems.map((usedVariableName) => ({\n value: usedVariableName,\n label: usedVariableName,\n }));\n }\n private getItems = (query: string) => {\n return Promise.resolve(this.getValues(query));\n };\n private handleVariableChange = (item: ComboBoxItem) => {\n if (!this.isUnmounting) {\n this.setState({ selectedVariable: item });\n }\n };\n private handleUnexpectedVariableInput = (query: string) => {\n const values = this.getValues(query);\n if (values.length > 0) {\n return values[0];\n } else {\n return this.resetVariable();\n }\n };\n private resetVariable = () => {\n if (!this.isUnmounting) {\n this.setState({ selectedVariable: undefined });\n }\n };\n}\n\ninterface ComponentShowcaseProps {\n name: string;\n description: ComponentDescriptionType;\n isDebugMode?: boolean;\n onVariableSelect: (item: ComboBoxItem) => void;\n}\nclass ComponentShowcase extends React.Component<ComponentShowcaseProps, {}> {\n public render() {\n const { name, description, onVariableSelect, isDebugMode } = this.props;\n const elements = Object.keys(description);\n\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n return (\n <React.Fragment>\n <Sticky side={'top'} offset={40}>\n {(isSticky) => (\n <h2\n className={cx({\n [styles.heading(theme)]: true,\n [styles.headingSticky()]: isSticky,\n })}\n >\n {this.props.name}\n </h2>\n )}\n </Sticky>\n <table className={styles.table()}>\n <thead>\n <tr>\n <th className={styles.headerCell()} style={{ width: 170 }}>\n ClassName\n </th>\n <th className={styles.headerCell()} style={{ width: 210 }}>\n Variable Name\n </th>\n <th className={styles.headerCell()} style={{ width: 250 }}>\n Default Value\n </th>\n <th className={styles.headerCell()} style={{ width: 250 }}>\n Dark Value\n </th>\n </tr>\n </thead>\n <tbody>\n {elements.map((el) => (\n <ComponentShowcaseRow\n key={`${name}_${el}`}\n element={el}\n row={description[el]}\n onVariableSelect={onVariableSelect}\n isDebugMode={isDebugMode}\n />\n ))}\n </tbody>\n </table>\n </React.Fragment>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n}\n\ninterface ComponentShowcaseRowProps {\n element: string;\n row: ComponentRowDescriptionType;\n isDebugMode?: boolean;\n onVariableSelect: (item: ComboBoxItem) => void;\n}\n\nclass ComponentShowcaseRow extends React.Component<ComponentShowcaseRowProps> {\n public render() {\n const { element: el, row, isDebugMode } = this.props;\n const rowSpan = row.variables.length + 1;\n\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n return (\n <React.Fragment>\n <tr className={cx(styles.invisibleRow(), { [styles.invisibleDarkRow()]: theme === darkVariables })}>\n <td className={cx(styles.cell(), styles.majorCell())} rowSpan={rowSpan}>\n <span className={styles.elementName()}>.{el}</span>\n </td>\n <td className={styles.invisibleCell()} />\n <td className={styles.invisibleCell()} />\n <td className={styles.invisibleCell()} />\n </tr>\n {row.variables.map((varName) => {\n const dependencies = row.dependencies[varName] || EMPTY_ARRAY;\n const variableDefault = defaultVariables[varName] as string;\n const variableDark = darkVariables[varName] as string;\n const hasNoVariables = isDebugMode && !variableDefault;\n return (\n <tr\n key={`${el}_${varName}`}\n className={cx(styles.row(), {\n [styles.suspiciousRow()]: hasNoVariables,\n [styles.darkRow()]: theme === darkVariables,\n })}\n >\n <td className={styles.cell()}>\n <VariableName\n variableName={varName as string}\n dependencies={dependencies}\n onVariableSelect={this.props.onVariableSelect}\n />\n </td>\n <td className={styles.cell()}>\n <VariableValue value={variableDefault} />\n </td>\n <td className={styles.cell()}>\n <VariableValue value={variableDark} />\n </td>\n </tr>\n );\n })}\n </React.Fragment>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n}\n\ninterface VariableNameProps {\n variableName: string;\n dependencies: Array<keyof Theme>;\n onVariableSelect: (item: ComboBoxItem) => void;\n}\n\nclass VariableName extends React.Component<VariableNameProps> {\n public render() {\n return (\n <span>\n <span className={styles.variableName()} onClick={this.handleVariableSelect}>\n {this.props.variableName}\n </span>\n {this.props.dependencies.length > 0 && this.renderDependencies()}\n </span>\n );\n }\n\n private renderDependencies() {\n const { dependencies, onVariableSelect } = this.props;\n return (\n <React.Fragment>\n <br />\n <br />\n зависит от:\n {dependencies.map((dependency) => (\n <DependencyName\n key={`dependency_${dependency}`}\n dependencyName={dependency}\n onDependencySelect={onVariableSelect}\n />\n ))}\n </React.Fragment>\n );\n }\n\n private handleVariableSelect = () => {\n const { variableName, onVariableSelect } = this.props;\n if (onVariableSelect) {\n onVariableSelect({ value: variableName, label: variableName });\n }\n };\n}\n\ninterface DependencyNameProps {\n dependencyName: keyof Theme;\n onDependencySelect: (item: ComboBoxItem) => void;\n}\nclass DependencyName extends React.Component<DependencyNameProps> {\n public render() {\n return (\n <React.Fragment>\n <br />\n –{' '}\n <Tooltip trigger={'hover'} render={this.getValues} pos={'right middle'}>\n <span className={styles.variableName()} onClick={this.handleDependencySelect}>\n {this.props.dependencyName}\n </span>\n </Tooltip>\n </React.Fragment>\n );\n }\n\n private getValues = () => {\n const dependencyName = this.props.dependencyName;\n const dependencyDefault = defaultVariables[dependencyName] as string;\n const dependencyDark = darkVariables[dependencyName] as string;\n return (\n <React.Fragment>\n <span>Default value: {<VariableValue value={dependencyDefault} />}</span>\n <span>Dark value: {<VariableValue value={dependencyDark} />}</span>\n </React.Fragment>\n );\n };\n\n private handleDependencySelect = () => {\n const { dependencyName, onDependencySelect } = this.props;\n if (onDependencySelect) {\n onDependencySelect({ value: dependencyName, label: dependencyName });\n }\n };\n}\n\nconst VariableValue = (props: { value: string }) => {\n const value = props.value;\n const valueIsColor = isColor(value);\n const valueIsGradient = isGradient(value);\n const hasExample = valueIsColor || valueIsGradient;\n let borderColor = 'transparent';\n if (hasExample) {\n borderColor = valueIsColor ? ColorFunctions.contrast(value) : '#000';\n }\n\n return (\n <span className={cx({ [styles.undefined()]: !value })}>\n {hasExample && <span className={styles.colorExample()} style={{ background: value, borderColor }} />}\n {value || 'undefined'}\n </span>\n );\n};\n\nconst ShowUnusedVariables = (props: { diff: string[] }) => {\n if (props.diff.length === 0) {\n return null;\n }\n\n return (\n <div className={styles.unusedVariablesWarning()}>\n Неиспользованные переменные ({props.diff.length}\n ):\n <ul>\n {props.diff.sort().map((v) => (\n <li key={v}>{v}</li>\n ))}\n </ul>\n </div>\n );\n};\n\nfunction isColor(input: string) {\n return !!input && (input.startsWith('#') || input.startsWith('rgb') || input.startsWith('hsl'));\n}\n\nfunction isGradient(input: string) {\n return !!input && input.startsWith('linear-gradient');\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["ThemeShowcase.tsx"],"names":["EMPTY_ARRAY","ALL_VARIABLES","Object","keys","defaultVariables","ThemeShowcase","props","state","isUnmounting","variablesDiff","getItems","query","Promise","resolve","getValues","handleVariableChange","item","setState","selectedVariable","handleUnexpectedVariableInput","values","length","resetVariable","undefined","isDebugMode","forEach","variable","found","ALL_USED_VARIABLES","includes","push","render","IS_PROXY_SUPPORTED","descriptionsToRender","COMPONENT_DESCRIPTIONS_BY_VARIABLE","value","COMPONENT_DESCRIPTIONS","callsCount","CALLS_COUNT","executionTime","EXECUTION_TIME","toFixed","theme","styles","searchBar","sort","map","componentName","componentWillUnmount","lowerCaseQuery","toLowerCase","trim","allItems","filter","usedVariable","startsWith","usedVariableName","label","React","Component","ComponentShowcase","name","description","onVariableSelect","elements","isSticky","heading","headingSticky","table","headerCell","width","el","ComponentShowcaseRow","element","row","rowSpan","variables","invisibleRow","invisibleDarkRow","darkVariables","cell","majorCell","elementName","invisibleCell","varName","dependencies","variableDefault","variableDark","hasNoVariables","suspiciousRow","darkRow","VariableName","handleVariableSelect","variableName","renderDependencies","dependency","DependencyName","dependencyName","dependencyDefault","dependencyDark","handleDependencySelect","onDependencySelect","VariableValue","valueIsColor","isColor","valueIsGradient","isGradient","hasExample","borderColor","ColorFunctions","contrast","colorExample","background","ShowUnusedVariables","diff","unusedVariablesWarning","v","input"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { DEFAULT_THEME as defaultVariables } from '../../lib/theming/themes/DefaultTheme';\nimport { DARK_THEME as darkVariables } from '../../lib/theming/themes/DarkTheme';\nimport { ComboBox, ComboBoxItem } from '../../components/ComboBox';\nimport { Gapped } from '../../components/Gapped';\nimport { Link } from '../../components/Link';\nimport { Sticky } from '../../components/Sticky';\nimport * as ColorFunctions from '../../lib/styles/ColorFunctions';\nimport { Tooltip } from '../../components/Tooltip';\nimport { IS_PROXY_SUPPORTED } from '../../lib/Supports';\nimport { Theme } from '../../lib/theming/Theme';\nimport { cx } from '../../lib/theming/Emotion';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\n\nimport {\n ALL_USED_VARIABLES,\n CALLS_COUNT,\n COMPONENT_DESCRIPTIONS,\n COMPONENT_DESCRIPTIONS_BY_VARIABLE,\n ComponentDescriptionType,\n ComponentRowDescriptionType,\n EXECUTION_TIME,\n} from './VariablesCollector';\nimport { styles } from './ThemeShowcase.styles';\n\nconst EMPTY_ARRAY: string[] = [];\n\nconst ALL_VARIABLES = Object.keys(defaultVariables) as Array<keyof Theme>;\n\ninterface ShowcaseProps {\n isDebugMode?: boolean;\n}\ninterface ShowcaseState {\n selectedVariable?: ComboBoxItem;\n}\n\nexport class ThemeShowcase extends React.Component<ShowcaseProps, ShowcaseState> {\n public state: ShowcaseState = {};\n\n private isUnmounting = false;\n private variablesDiff: string[] = [];\n\n constructor(props: ShowcaseProps) {\n super(props);\n if (props.isDebugMode) {\n ALL_VARIABLES.forEach((variable) => {\n const found = ALL_USED_VARIABLES.includes(variable);\n if (!found) {\n this.variablesDiff.push(variable);\n }\n });\n }\n }\n\n public render() {\n if (!IS_PROXY_SUPPORTED) {\n return (\n <div>\n Таблица использования переменных доступна только в{' '}\n <Link href={'https://caniuse.com/#feat=proxy'} target={'_blank'}>\n браузерах с поддержкой Proxy\n </Link>\n .\n </div>\n );\n }\n\n const selectedVariable = this.state.selectedVariable;\n const descriptionsToRender = selectedVariable\n ? COMPONENT_DESCRIPTIONS_BY_VARIABLE[selectedVariable.value] || {}\n : COMPONENT_DESCRIPTIONS;\n\n const isDebugMode = this.props.isDebugMode;\n const callsCount = isDebugMode ? `(${CALLS_COUNT} вызовов)` : '';\n const executionTime = isDebugMode ? `Сгенерировано за ${EXECUTION_TIME.toFixed(3)}ms` : '';\n\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n return (\n <Gapped wrap gap={30} verticalAlign={'top'}>\n <div>\n <Sticky side={'top'}>\n <div className={styles.searchBar(theme)} data-perf-info={`${executionTime} ${callsCount}`}>\n <Gapped gap={15}>\n <ComboBox\n getItems={this.getItems}\n value={selectedVariable}\n onValueChange={this.handleVariableChange}\n onUnexpectedInput={this.handleUnexpectedVariableInput}\n placeholder={'поиск по названию переменной'}\n />\n {!!selectedVariable && <Link onClick={this.resetVariable}>сбросить</Link>}\n </Gapped>\n </div>\n </Sticky>\n {Object.keys(descriptionsToRender)\n .sort()\n .map((componentName) => (\n <ComponentShowcase\n key={componentName}\n name={componentName}\n description={descriptionsToRender[componentName]}\n isDebugMode={isDebugMode}\n onVariableSelect={this.handleVariableChange}\n />\n ))}\n </div>\n <ShowUnusedVariables diff={this.variablesDiff} />\n </Gapped>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n public componentWillUnmount(): void {\n this.isUnmounting = true;\n }\n\n private getValues(query: string) {\n const lowerCaseQuery = query && query.toLowerCase().trim();\n let allItems = ALL_USED_VARIABLES;\n if (lowerCaseQuery) {\n allItems = ALL_USED_VARIABLES.filter((usedVariable) => usedVariable.toLowerCase().startsWith(lowerCaseQuery));\n }\n return allItems.map((usedVariableName) => ({\n value: usedVariableName,\n label: usedVariableName,\n }));\n }\n private getItems = (query: string) => {\n return Promise.resolve(this.getValues(query));\n };\n private handleVariableChange = (item: ComboBoxItem) => {\n if (!this.isUnmounting) {\n this.setState({ selectedVariable: item });\n }\n };\n private handleUnexpectedVariableInput = (query: string) => {\n const values = this.getValues(query);\n if (values.length > 0) {\n return values[0];\n } else {\n return this.resetVariable();\n }\n };\n private resetVariable = () => {\n if (!this.isUnmounting) {\n this.setState({ selectedVariable: undefined });\n }\n };\n}\n\ninterface ComponentShowcaseProps {\n name: string;\n description: ComponentDescriptionType;\n isDebugMode?: boolean;\n onVariableSelect: (item: ComboBoxItem) => void;\n}\nclass ComponentShowcase extends React.Component<ComponentShowcaseProps, {}> {\n public render() {\n const { name, description, onVariableSelect, isDebugMode } = this.props;\n const elements = Object.keys(description);\n\n return elements.length ? (\n <ThemeContext.Consumer>\n {(theme) => {\n return (\n <React.Fragment>\n <Sticky side={'top'} offset={40}>\n {(isSticky) => (\n <h2\n className={cx({\n [styles.heading(theme)]: true,\n [styles.headingSticky()]: isSticky,\n })}\n >\n {this.props.name}\n </h2>\n )}\n </Sticky>\n <table className={styles.table()}>\n <thead>\n <tr>\n <th className={styles.headerCell()} style={{ width: 170 }}>\n ClassName\n </th>\n <th className={styles.headerCell()} style={{ width: 210 }}>\n Variable Name\n </th>\n <th className={styles.headerCell()} style={{ width: 250 }}>\n Default Value\n </th>\n <th className={styles.headerCell()} style={{ width: 250 }}>\n Dark Value\n </th>\n </tr>\n </thead>\n <tbody>\n {elements.map((el) => (\n <ComponentShowcaseRow\n key={`${name}_${el}`}\n element={el}\n row={description[el]}\n onVariableSelect={onVariableSelect}\n isDebugMode={isDebugMode}\n />\n ))}\n </tbody>\n </table>\n </React.Fragment>\n );\n }}\n </ThemeContext.Consumer>\n ) : null;\n }\n}\n\ninterface ComponentShowcaseRowProps {\n element: string;\n row: ComponentRowDescriptionType;\n isDebugMode?: boolean;\n onVariableSelect: (item: ComboBoxItem) => void;\n}\n\nclass ComponentShowcaseRow extends React.Component<ComponentShowcaseRowProps> {\n public render() {\n const { element: el, row, isDebugMode } = this.props;\n const rowSpan = row.variables.length + 1;\n\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n return (\n <React.Fragment>\n <tr className={cx(styles.invisibleRow(), { [styles.invisibleDarkRow()]: theme === darkVariables })}>\n <td className={cx(styles.cell(), styles.majorCell())} rowSpan={rowSpan}>\n <span className={styles.elementName()}>.{el}</span>\n </td>\n <td className={styles.invisibleCell()} />\n <td className={styles.invisibleCell()} />\n <td className={styles.invisibleCell()} />\n </tr>\n {row.variables.map((varName) => {\n const dependencies = row.dependencies[varName] || EMPTY_ARRAY;\n const variableDefault = defaultVariables[varName] as string;\n const variableDark = darkVariables[varName] as string;\n const hasNoVariables = isDebugMode && !variableDefault;\n return (\n <tr\n key={`${el}_${varName}`}\n className={cx(styles.row(), {\n [styles.suspiciousRow()]: hasNoVariables,\n [styles.darkRow()]: theme === darkVariables,\n })}\n >\n <td className={styles.cell()}>\n <VariableName\n variableName={varName as string}\n dependencies={dependencies}\n onVariableSelect={this.props.onVariableSelect}\n />\n </td>\n <td className={styles.cell()}>\n <VariableValue value={variableDefault} />\n </td>\n <td className={styles.cell()}>\n <VariableValue value={variableDark} />\n </td>\n </tr>\n );\n })}\n </React.Fragment>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n}\n\ninterface VariableNameProps {\n variableName: string;\n dependencies: Array<keyof Theme>;\n onVariableSelect: (item: ComboBoxItem) => void;\n}\n\nclass VariableName extends React.Component<VariableNameProps> {\n public render() {\n return (\n <span>\n <span className={styles.variableName()} onClick={this.handleVariableSelect}>\n {this.props.variableName}\n </span>\n {this.props.dependencies.length > 0 && this.renderDependencies()}\n </span>\n );\n }\n\n private renderDependencies() {\n const { dependencies, onVariableSelect } = this.props;\n return (\n <React.Fragment>\n <br />\n <br />\n зависит от:\n {dependencies.map((dependency) => (\n <DependencyName\n key={`dependency_${dependency}`}\n dependencyName={dependency}\n onDependencySelect={onVariableSelect}\n />\n ))}\n </React.Fragment>\n );\n }\n\n private handleVariableSelect = () => {\n const { variableName, onVariableSelect } = this.props;\n if (onVariableSelect) {\n onVariableSelect({ value: variableName, label: variableName });\n }\n };\n}\n\ninterface DependencyNameProps {\n dependencyName: keyof Theme;\n onDependencySelect: (item: ComboBoxItem) => void;\n}\nclass DependencyName extends React.Component<DependencyNameProps> {\n public render() {\n return (\n <React.Fragment>\n <br />\n –{' '}\n <Tooltip trigger={'hover'} render={this.getValues} pos={'right middle'}>\n <span className={styles.variableName()} onClick={this.handleDependencySelect}>\n {this.props.dependencyName}\n </span>\n </Tooltip>\n </React.Fragment>\n );\n }\n\n private getValues = () => {\n const dependencyName = this.props.dependencyName;\n const dependencyDefault = defaultVariables[dependencyName] as string;\n const dependencyDark = darkVariables[dependencyName] as string;\n return (\n <React.Fragment>\n <span>Default value: {<VariableValue value={dependencyDefault} />}</span>\n <span>Dark value: {<VariableValue value={dependencyDark} />}</span>\n </React.Fragment>\n );\n };\n\n private handleDependencySelect = () => {\n const { dependencyName, onDependencySelect } = this.props;\n if (onDependencySelect) {\n onDependencySelect({ value: dependencyName, label: dependencyName });\n }\n };\n}\n\nconst VariableValue = (props: { value: string }) => {\n const value = props.value;\n const valueIsColor = isColor(value);\n const valueIsGradient = isGradient(value);\n const hasExample = valueIsColor || valueIsGradient;\n let borderColor = 'transparent';\n if (hasExample) {\n borderColor = valueIsColor ? ColorFunctions.contrast(value) : '#000';\n }\n\n return (\n <span className={cx({ [styles.undefined()]: !value })}>\n {hasExample && <span className={styles.colorExample()} style={{ background: value, borderColor }} />}\n {value || 'undefined'}\n </span>\n );\n};\n\nconst ShowUnusedVariables = (props: { diff: string[] }) => {\n if (props.diff.length === 0) {\n return null;\n }\n\n return (\n <div className={styles.unusedVariablesWarning()}>\n Неиспользованные переменные ({props.diff.length}\n ):\n <ul>\n {props.diff.sort().map((v) => (\n <li key={v}>{v}</li>\n ))}\n </ul>\n </div>\n );\n};\n\nfunction isColor(input: string) {\n return !!input && (input.startsWith('#') || input.startsWith('rgb') || input.startsWith('hsl'));\n}\n\nfunction isGradient(input: string) {\n return !!input && input.startsWith('linear-gradient');\n}\n"]}
|
|
@@ -106,18 +106,23 @@ if (_Supports.IS_PROXY_SUPPORTED) {
|
|
|
106
106
|
function getProxyHandler(accumulator, dependencies) {
|
|
107
107
|
var accessLevel = 0;
|
|
108
108
|
var rootProp = '';
|
|
109
|
+
function isThemeVariable(theme, name) {
|
|
110
|
+
return typeof theme[name] === 'string';
|
|
111
|
+
}
|
|
109
112
|
return {
|
|
110
113
|
get: function get(target, prop, receiver) {
|
|
111
114
|
var propName = prop;
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
dependencies[rootProp]
|
|
119
|
-
|
|
120
|
-
dependencies[rootProp].
|
|
115
|
+
if (isThemeVariable(target, propName)) {
|
|
116
|
+
ALL_USED_VARIABLES_SET.add(propName);
|
|
117
|
+
if (accessLevel === 0) {
|
|
118
|
+
rootProp = propName;
|
|
119
|
+
accumulator.add(propName);
|
|
120
|
+
} else {
|
|
121
|
+
if (!dependencies[rootProp]) {
|
|
122
|
+
dependencies[rootProp] = [propName];
|
|
123
|
+
} else if (!dependencies[rootProp].includes(propName)) {
|
|
124
|
+
dependencies[rootProp].push(propName);
|
|
125
|
+
}
|
|
121
126
|
}
|
|
122
127
|
}
|
|
123
128
|
accessLevel++;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["VariablesCollector.ts"],"names":["callsCount","executionTime","ALL_USED_VARIABLES_SET","Set","COMPONENT_DESCRIPTIONS","COMPONENT_DESCRIPTIONS_BY_VARIABLE","IS_PROXY_SUPPORTED","baseThemes","push","DEFAULT_THEME","DARK_THEME","componentsContext","require","context","keys","forEach","fileName","fileNameStart","lastIndexOf","componentName","substring","replace","componentDescription","Object","exportName","styles","elementName","jsStyle","variablesAccumulator","dependencies","elementProxyHandler","getProxyHandler","themes","map","t","Proxy","variables","Array","from","length","variableName","variableNode","componentNode","includes","dependenciesList","dependencyName","dependencyNode","accumulator","accessLevel","rootProp","get","target","prop","receiver","propName","add","start","performance","now","result","Reflect","ALL_USED_VARIABLES","CALLS_COUNT","EXECUTION_TIME"],"mappings":"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","sourcesContent":["import { Theme } from '../../lib/theming/Theme';\nimport { DEFAULT_THEME } from '../../lib/theming/themes/DefaultTheme';\nimport { DARK_THEME } from '../../lib/theming/themes/DarkTheme';\nimport { IS_PROXY_SUPPORTED } from '../../lib/Supports';\n\nexport interface DescriptionsType {\n [componentName: string]: ComponentDescriptionType;\n}\n\nexport interface ComponentDescriptionType {\n [elementName: string]: ComponentRowDescriptionType;\n}\n\nexport interface ComponentRowDescriptionType {\n variables: Array<keyof Theme>;\n dependencies: VariableDependencies;\n}\n\nexport interface VariableNameToComponentsMap {\n [variableName: string]: DescriptionsType;\n}\n\nexport interface VariableDependencies {\n [variableName: string]: Array<keyof Theme>;\n}\n\nlet callsCount = 0;\nlet executionTime = 0;\nconst ALL_USED_VARIABLES_SET = new Set<keyof Theme>();\n\nexport const COMPONENT_DESCRIPTIONS: DescriptionsType = {};\nexport const COMPONENT_DESCRIPTIONS_BY_VARIABLE: VariableNameToComponentsMap = {};\n\nif (IS_PROXY_SUPPORTED) {\n const baseThemes: Theme[] = [];\n baseThemes.push(DEFAULT_THEME);\n baseThemes.push(DARK_THEME);\n\n const componentsContext = require.context('../../../', true, /\\.styles.ts$/);\n componentsContext.keys().forEach((fileName) => {\n const fileNameStart = fileName.lastIndexOf('/') + 1;\n const componentName = fileName.substring(fileNameStart).replace('.styles.ts', '');\n const componentDescription: ComponentDescriptionType = {};\n Object.keys(componentsContext(fileName)).forEach((exportName) => {\n const styles = componentsContext(fileName)[exportName];\n\n Object.keys(styles).forEach((elementName) => {\n const jsStyle = styles[elementName];\n if (typeof jsStyle !== 'function') {\n return;\n }\n const variablesAccumulator = new Set<keyof Theme>();\n const dependencies: VariableDependencies = {};\n const elementProxyHandler = getProxyHandler(variablesAccumulator, dependencies);\n const themes = baseThemes.map((t) => new Proxy(t, elementProxyHandler));\n themes.forEach((t) => jsStyle(t));\n\n const variables = Array.from(variablesAccumulator);\n\n if (variables.length > 0) {\n componentDescription[elementName] = { variables, dependencies };\n\n variables.forEach((variableName) => {\n if (!COMPONENT_DESCRIPTIONS_BY_VARIABLE[variableName]) {\n COMPONENT_DESCRIPTIONS_BY_VARIABLE[variableName] = {};\n }\n\n const variableNode = COMPONENT_DESCRIPTIONS_BY_VARIABLE[variableName];\n if (!variableNode[componentName]) {\n variableNode[componentName] = {};\n }\n\n const componentNode = variableNode[componentName];\n if (!componentNode[elementName]) {\n componentNode[elementName] = {\n dependencies,\n variables: [variableName],\n };\n } else if (!componentNode[elementName].variables.includes(variableName)) {\n componentNode[elementName].dependencies = dependencies;\n componentNode[elementName].variables.push(variableName);\n }\n\n const dependenciesList = dependencies[variableName];\n if (dependenciesList) {\n dependenciesList.forEach((dependencyName) => {\n if (!COMPONENT_DESCRIPTIONS_BY_VARIABLE[dependencyName]) {\n COMPONENT_DESCRIPTIONS_BY_VARIABLE[dependencyName] = {};\n }\n\n const dependencyNode = COMPONENT_DESCRIPTIONS_BY_VARIABLE[dependencyName];\n if (!dependencyNode[componentName]) {\n dependencyNode[componentName] = COMPONENT_DESCRIPTIONS_BY_VARIABLE[variableName][componentName];\n }\n });\n }\n });\n }\n });\n });\n\n COMPONENT_DESCRIPTIONS[componentName] = componentDescription;\n });\n}\n\nfunction getProxyHandler(accumulator: Set<keyof Theme>, dependencies: VariableDependencies): ProxyHandler<Theme> {\n let accessLevel = 0;\n let rootProp = '';\n return {\n get(target, prop, receiver) {\n const propName = prop as keyof Theme;\n ALL_USED_VARIABLES_SET.add(propName);\n if (accessLevel === 0) {\n rootProp = propName;\n accumulator.add(propName);\n } else {\n if (!dependencies[rootProp]) {\n dependencies[rootProp] = [propName];\n } else if (!dependencies[rootProp].includes(propName)) {\n dependencies[rootProp].push(propName);\n }\n }\n accessLevel++;\n const start = performance.now();\n const result = Reflect.get(target, prop, receiver);\n executionTime += performance.now() - start;\n callsCount++;\n accessLevel--;\n return result;\n },\n };\n}\n\nexport const ALL_USED_VARIABLES = Array.from(ALL_USED_VARIABLES_SET);\nexport const CALLS_COUNT = callsCount;\nexport const EXECUTION_TIME = executionTime;\n"]}
|
|
1
|
+
{"version":3,"sources":["VariablesCollector.ts"],"names":["callsCount","executionTime","ALL_USED_VARIABLES_SET","Set","COMPONENT_DESCRIPTIONS","COMPONENT_DESCRIPTIONS_BY_VARIABLE","IS_PROXY_SUPPORTED","baseThemes","push","DEFAULT_THEME","DARK_THEME","componentsContext","require","context","keys","forEach","fileName","fileNameStart","lastIndexOf","componentName","substring","replace","componentDescription","Object","exportName","styles","elementName","jsStyle","variablesAccumulator","dependencies","elementProxyHandler","getProxyHandler","themes","map","t","Proxy","variables","Array","from","length","variableName","variableNode","componentNode","includes","dependenciesList","dependencyName","dependencyNode","accumulator","accessLevel","rootProp","isThemeVariable","theme","name","get","target","prop","receiver","propName","add","start","performance","now","result","Reflect","ALL_USED_VARIABLES","CALLS_COUNT","EXECUTION_TIME"],"mappings":"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","sourcesContent":["import { Theme } from '../../lib/theming/Theme';\nimport { DEFAULT_THEME } from '../../lib/theming/themes/DefaultTheme';\nimport { DARK_THEME } from '../../lib/theming/themes/DarkTheme';\nimport { IS_PROXY_SUPPORTED } from '../../lib/Supports';\n\nexport interface DescriptionsType {\n [componentName: string]: ComponentDescriptionType;\n}\n\nexport interface ComponentDescriptionType {\n [elementName: string]: ComponentRowDescriptionType;\n}\n\nexport interface ComponentRowDescriptionType {\n variables: Array<keyof Theme>;\n dependencies: VariableDependencies;\n}\n\nexport interface VariableNameToComponentsMap {\n [variableName: string]: DescriptionsType;\n}\n\nexport interface VariableDependencies {\n [variableName: string]: Array<keyof Theme>;\n}\n\nlet callsCount = 0;\nlet executionTime = 0;\nconst ALL_USED_VARIABLES_SET = new Set<keyof Theme>();\n\nexport const COMPONENT_DESCRIPTIONS: DescriptionsType = {};\nexport const COMPONENT_DESCRIPTIONS_BY_VARIABLE: VariableNameToComponentsMap = {};\n\nif (IS_PROXY_SUPPORTED) {\n const baseThemes: Theme[] = [];\n baseThemes.push(DEFAULT_THEME);\n baseThemes.push(DARK_THEME);\n\n const componentsContext = require.context('../../../', true, /\\.styles.ts$/);\n componentsContext.keys().forEach((fileName) => {\n const fileNameStart = fileName.lastIndexOf('/') + 1;\n const componentName = fileName.substring(fileNameStart).replace('.styles.ts', '');\n const componentDescription: ComponentDescriptionType = {};\n Object.keys(componentsContext(fileName)).forEach((exportName) => {\n const styles = componentsContext(fileName)[exportName];\n\n Object.keys(styles).forEach((elementName) => {\n const jsStyle = styles[elementName];\n if (typeof jsStyle !== 'function') {\n return;\n }\n const variablesAccumulator = new Set<keyof Theme>();\n const dependencies: VariableDependencies = {};\n const elementProxyHandler = getProxyHandler(variablesAccumulator, dependencies);\n const themes = baseThemes.map((t) => new Proxy(t, elementProxyHandler));\n themes.forEach((t) => jsStyle(t));\n\n const variables = Array.from(variablesAccumulator);\n\n if (variables.length > 0) {\n componentDescription[elementName] = { variables, dependencies };\n\n variables.forEach((variableName) => {\n if (!COMPONENT_DESCRIPTIONS_BY_VARIABLE[variableName]) {\n COMPONENT_DESCRIPTIONS_BY_VARIABLE[variableName] = {};\n }\n\n const variableNode = COMPONENT_DESCRIPTIONS_BY_VARIABLE[variableName];\n if (!variableNode[componentName]) {\n variableNode[componentName] = {};\n }\n\n const componentNode = variableNode[componentName];\n if (!componentNode[elementName]) {\n componentNode[elementName] = {\n dependencies,\n variables: [variableName],\n };\n } else if (!componentNode[elementName].variables.includes(variableName)) {\n componentNode[elementName].dependencies = dependencies;\n componentNode[elementName].variables.push(variableName);\n }\n\n const dependenciesList = dependencies[variableName];\n if (dependenciesList) {\n dependenciesList.forEach((dependencyName) => {\n if (!COMPONENT_DESCRIPTIONS_BY_VARIABLE[dependencyName]) {\n COMPONENT_DESCRIPTIONS_BY_VARIABLE[dependencyName] = {};\n }\n\n const dependencyNode = COMPONENT_DESCRIPTIONS_BY_VARIABLE[dependencyName];\n if (!dependencyNode[componentName]) {\n dependencyNode[componentName] = COMPONENT_DESCRIPTIONS_BY_VARIABLE[variableName][componentName];\n }\n });\n }\n });\n }\n });\n });\n\n COMPONENT_DESCRIPTIONS[componentName] = componentDescription;\n });\n}\n\nfunction getProxyHandler(accumulator: Set<keyof Theme>, dependencies: VariableDependencies): ProxyHandler<Theme> {\n let accessLevel = 0;\n let rootProp = '';\n function isThemeVariable<T extends Theme>(theme: T, name: keyof T) {\n return typeof theme[name] === 'string';\n }\n return {\n get(target, prop, receiver) {\n const propName = prop as keyof Theme;\n if (isThemeVariable(target, propName)) {\n ALL_USED_VARIABLES_SET.add(propName);\n if (accessLevel === 0) {\n rootProp = propName;\n accumulator.add(propName);\n } else {\n if (!dependencies[rootProp]) {\n dependencies[rootProp] = [propName];\n } else if (!dependencies[rootProp].includes(propName)) {\n dependencies[rootProp].push(propName);\n }\n }\n }\n accessLevel++;\n const start = performance.now();\n const result = Reflect.get(target, prop, receiver);\n executionTime += performance.now() - start;\n callsCount++;\n accessLevel--;\n return result;\n },\n };\n}\n\nexport const ALL_USED_VARIABLES = Array.from(ALL_USED_VARIABLES_SET);\nexport const CALLS_COUNT = callsCount;\nexport const EXECUTION_TIME = executionTime;\n"]}
|