@skbkontur/react-ui 4.0.0-beta.2 → 4.0.0-beta.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/cjs/components/Button/Button.d.ts +1 -1
- package/cjs/components/Button/Button.js +4 -3
- package/cjs/components/Button/Button.js.map +1 -1
- package/cjs/components/Button/Button.styles.d.ts +1 -0
- package/cjs/components/Button/Button.styles.js +41 -31
- package/cjs/components/Button/Button.styles.js.map +1 -1
- package/cjs/components/DropdownMenu/DropdownMenu.d.ts +2 -2
- package/cjs/components/DropdownMenu/DropdownMenu.js.map +1 -1
- package/cjs/components/FileUploader/FileUploader.d.ts +31 -0
- package/cjs/components/FileUploader/FileUploader.js +266 -0
- package/cjs/components/FileUploader/FileUploader.js.map +1 -0
- package/cjs/components/FileUploader/FileUploader.md +67 -0
- package/cjs/components/FileUploader/FileUploader.styles.d.ts +20 -0
- package/cjs/components/FileUploader/FileUploader.styles.js +161 -0
- package/cjs/components/FileUploader/FileUploader.styles.js.map +1 -0
- package/cjs/components/FileUploader/index.d.ts +4 -0
- package/cjs/components/FileUploader/index.js +4 -0
- package/cjs/components/FileUploader/index.js.map +1 -0
- package/cjs/components/FileUploader/locale/index.d.ts +4 -0
- package/cjs/components/FileUploader/locale/index.js +11 -0
- package/cjs/components/FileUploader/locale/index.js.map +1 -0
- package/cjs/components/FileUploader/locale/locales/en.d.ts +2 -0
- package/cjs/components/FileUploader/locale/locales/en.js +7 -0
- package/cjs/components/FileUploader/locale/locales/en.js.map +1 -0
- package/cjs/components/FileUploader/locale/locales/ru.d.ts +2 -0
- package/cjs/components/FileUploader/locale/locales/ru.js +7 -0
- package/cjs/components/FileUploader/locale/locales/ru.js.map +1 -0
- package/cjs/components/FileUploader/locale/types.d.ts +6 -0
- package/cjs/components/FileUploader/locale/types.js +1 -0
- package/cjs/components/FileUploader/locale/types.js.map +1 -0
- package/cjs/components/GlobalLoader/GlabalLoaderView.d.ts +8 -0
- package/cjs/components/GlobalLoader/GlabalLoaderView.js +44 -0
- package/cjs/components/GlobalLoader/GlabalLoaderView.js.map +1 -0
- package/cjs/components/GlobalLoader/GlobalLoader.d.ts +102 -0
- package/cjs/components/GlobalLoader/GlobalLoader.js +260 -0
- package/cjs/components/GlobalLoader/GlobalLoader.js.map +1 -0
- package/cjs/components/GlobalLoader/GlobalLoader.md +92 -0
- package/cjs/components/GlobalLoader/GlobalLoaderView.styles.d.ts +13 -0
- package/cjs/components/GlobalLoader/GlobalLoaderView.styles.js +130 -0
- package/cjs/components/GlobalLoader/GlobalLoaderView.styles.js.map +1 -0
- package/cjs/components/GlobalLoader/index.d.ts +1 -0
- package/cjs/components/GlobalLoader/index.js +1 -0
- package/cjs/components/GlobalLoader/index.js.map +1 -0
- package/cjs/components/Hint/Hint.d.ts +2 -1
- package/cjs/components/Hint/Hint.js +0 -16
- package/cjs/components/Hint/Hint.js.map +1 -1
- package/cjs/components/Kebab/Kebab.d.ts +2 -2
- package/cjs/components/Kebab/Kebab.js.map +1 -1
- package/cjs/components/Link/Link.js +1 -1
- package/cjs/components/Link/Link.js.map +1 -1
- package/cjs/components/Link/Link.styles.d.ts +1 -1
- package/cjs/components/Link/Link.styles.js +3 -3
- package/cjs/components/Link/Link.styles.js.map +1 -1
- package/cjs/components/MenuItem/MenuItem.d.ts +1 -1
- package/cjs/components/MenuItem/MenuItem.js +1 -4
- package/cjs/components/MenuItem/MenuItem.js.map +1 -1
- package/cjs/components/Modal/Modal.styles.d.ts +1 -0
- package/cjs/components/Modal/Modal.styles.js +16 -8
- package/cjs/components/Modal/Modal.styles.js.map +1 -1
- package/cjs/components/Modal/ModalFooter.js +1 -0
- package/cjs/components/Modal/ModalFooter.js.map +1 -1
- package/cjs/components/SidePage/SidePage.styles.d.ts +1 -0
- package/cjs/components/SidePage/SidePage.styles.js +14 -6
- package/cjs/components/SidePage/SidePage.styles.js.map +1 -1
- package/cjs/components/SidePage/SidePageFooter.js +2 -1
- package/cjs/components/SidePage/SidePageFooter.js.map +1 -1
- package/cjs/components/Spinner/Spinner.d.ts +8 -0
- package/cjs/components/Spinner/Spinner.js +22 -3
- package/cjs/components/Spinner/Spinner.js.map +1 -1
- package/cjs/components/Spinner/Spinner.md +1 -0
- package/cjs/components/Spinner/Spinner.styles.d.ts +2 -1
- package/cjs/components/Spinner/Spinner.styles.js +14 -11
- package/cjs/components/Spinner/Spinner.styles.js.map +1 -1
- package/cjs/components/Switcher/Switcher.styles.js +4 -2
- package/cjs/components/Switcher/Switcher.styles.js.map +1 -1
- package/cjs/components/Tooltip/Tooltip.d.ts +8 -21
- package/cjs/components/Tooltip/Tooltip.js +15 -28
- package/cjs/components/Tooltip/Tooltip.js.map +1 -1
- package/cjs/components/TooltipMenu/TooltipMenu.d.ts +2 -2
- package/cjs/components/TooltipMenu/TooltipMenu.js.map +1 -1
- package/cjs/hooks/useDrop.d.ts +11 -0
- package/cjs/hooks/useDrop.js +75 -0
- package/cjs/hooks/useDrop.js.map +1 -0
- package/cjs/hooks/useEffectWithoutInitCall.d.ts +2 -0
- package/cjs/hooks/useEffectWithoutInitCall.js +13 -0
- package/cjs/hooks/useEffectWithoutInitCall.js.map +1 -0
- package/cjs/hooks/useMemoObject.d.ts +1 -0
- package/cjs/hooks/useMemoObject.js +5 -0
- package/cjs/hooks/useMemoObject.js.map +1 -0
- package/cjs/index.d.ts +2 -0
- package/cjs/index.js +3 -1
- package/cjs/index.js.map +1 -1
- package/cjs/internal/FileUploaderControl/FileUploaderControlContext.d.ts +12 -0
- package/cjs/internal/FileUploaderControl/FileUploaderControlContext.js +16 -0
- package/cjs/internal/FileUploaderControl/FileUploaderControlContext.js.map +1 -0
- package/cjs/internal/FileUploaderControl/FileUploaderControlProvider.d.ts +14 -0
- package/cjs/internal/FileUploaderControl/FileUploaderControlProvider.js +106 -0
- package/cjs/internal/FileUploaderControl/FileUploaderControlProvider.js.map +1 -0
- package/cjs/internal/FileUploaderControl/FileUploaderFile/FileUploaderFile.d.ts +10 -0
- package/cjs/internal/FileUploaderControl/FileUploaderFile/FileUploaderFile.js +183 -0
- package/cjs/internal/FileUploaderControl/FileUploaderFile/FileUploaderFile.js.map +1 -0
- package/cjs/internal/FileUploaderControl/FileUploaderFile/FileUploaderFile.styles.d.ts +11 -0
- package/cjs/internal/FileUploaderControl/FileUploaderFile/FileUploaderFile.styles.js +68 -0
- package/cjs/internal/FileUploaderControl/FileUploaderFile/FileUploaderFile.styles.js.map +1 -0
- package/cjs/internal/FileUploaderControl/FileUploaderFileList/FileUploaderFileList.d.ts +4 -0
- package/cjs/internal/FileUploaderControl/FileUploaderFileList/FileUploaderFileList.js +24 -0
- package/cjs/internal/FileUploaderControl/FileUploaderFileList/FileUploaderFileList.js.map +1 -0
- package/cjs/internal/FileUploaderControl/FileUploaderFileList/FileUploaderFileList.styles.d.ts +4 -0
- package/cjs/internal/FileUploaderControl/FileUploaderFileList/FileUploaderFileList.styles.js +17 -0
- package/cjs/internal/FileUploaderControl/FileUploaderFileList/FileUploaderFileList.styles.js.map +1 -0
- package/cjs/internal/FileUploaderControl/FileUploaderFileValidationResult.d.ts +7 -0
- package/cjs/internal/FileUploaderControl/FileUploaderFileValidationResult.js +16 -0
- package/cjs/internal/FileUploaderControl/FileUploaderFileValidationResult.js.map +1 -0
- package/cjs/internal/FileUploaderControl/fileUtils.d.ts +14 -0
- package/cjs/internal/FileUploaderControl/fileUtils.js +26 -0
- package/cjs/internal/FileUploaderControl/fileUtils.js.map +1 -0
- package/cjs/internal/FileUploaderControl/hooks/useControlLocale.d.ts +1 -0
- package/cjs/internal/FileUploaderControl/hooks/useControlLocale.js +4 -0
- package/cjs/internal/FileUploaderControl/hooks/useControlLocale.js.map +1 -0
- package/cjs/internal/FileUploaderControl/hooks/useUpload.d.ts +3 -0
- package/cjs/internal/FileUploaderControl/hooks/useUpload.js +51 -0
- package/cjs/internal/FileUploaderControl/hooks/useUpload.js.map +1 -0
- package/cjs/internal/FileUploaderControl/withFileUploaderControlProvider.d.ts +3 -0
- package/cjs/internal/FileUploaderControl/withFileUploaderControlProvider.js +19 -0
- package/cjs/internal/FileUploaderControl/withFileUploaderControlProvider.js.map +1 -0
- package/cjs/internal/Popup/Popup.d.ts +5 -4
- package/cjs/internal/Popup/Popup.js +13 -24
- package/cjs/internal/Popup/Popup.js.map +1 -1
- package/cjs/internal/Popup/PopupHelper.d.ts +2 -2
- package/cjs/internal/Popup/PopupHelper.js.map +1 -1
- package/cjs/internal/Popup/types.d.ts +1 -0
- package/cjs/internal/Popup/types.js +1 -0
- package/cjs/internal/Popup/types.js.map +1 -0
- package/cjs/internal/PopupMenu/PopupMenu.d.ts +3 -3
- package/cjs/internal/PopupMenu/PopupMenu.js +18 -4
- package/cjs/internal/PopupMenu/PopupMenu.js.map +1 -1
- package/cjs/internal/PopupMenu/validatePositions.d.ts +2 -2
- package/cjs/internal/PopupMenu/validatePositions.js +2 -4
- package/cjs/internal/PopupMenu/validatePositions.js.map +1 -1
- package/cjs/internal/TextWidthHelper/TextWidthHelper.d.ts +15 -0
- package/cjs/internal/TextWidthHelper/TextWidthHelper.js +34 -0
- package/cjs/internal/TextWidthHelper/TextWidthHelper.js.map +1 -0
- package/cjs/internal/TextWidthHelper/TextWidthHelper.styles.d.ts +4 -0
- package/cjs/internal/TextWidthHelper/TextWidthHelper.styles.js +23 -0
- package/cjs/internal/TextWidthHelper/TextWidthHelper.styles.js.map +1 -0
- package/cjs/internal/ThemePlayground/Playground.d.ts +1 -0
- package/cjs/internal/ThemePlayground/Playground.js +11 -4
- package/cjs/internal/ThemePlayground/Playground.js.map +1 -1
- package/cjs/internal/ThemePlayground/ThemeContextPlayground.d.ts +0 -2
- package/cjs/internal/ThemePlayground/ThemeContextPlayground.js +2 -8
- package/cjs/internal/ThemePlayground/ThemeContextPlayground.js.map +1 -1
- package/cjs/internal/ThemePlayground/constants.d.ts +1 -2
- package/cjs/internal/ThemePlayground/constants.js +3 -3
- package/cjs/internal/ThemePlayground/constants.js.map +1 -1
- package/cjs/internal/ThemePlayground/darkTheme.d.ts +14 -0
- package/cjs/internal/ThemePlayground/darkTheme.js +14 -0
- package/cjs/internal/ThemePlayground/darkTheme.js.map +1 -1
- package/cjs/internal/ThemeShowcase/ThemeShowcase.js +9 -6
- package/cjs/internal/ThemeShowcase/ThemeShowcase.js.map +1 -1
- package/cjs/internal/ThemeShowcase/ThemeShowcase.styles.d.ts +4 -2
- package/cjs/internal/ThemeShowcase/ThemeShowcase.styles.js +37 -22
- package/cjs/internal/ThemeShowcase/ThemeShowcase.styles.js.map +1 -1
- package/cjs/internal/ThemeShowcase/VariablesCollector.d.ts +1 -1
- package/cjs/internal/ZIndex/ZIndexStorage.d.ts +1 -0
- package/cjs/internal/ZIndex/ZIndexStorage.js +1 -0
- package/cjs/internal/ZIndex/ZIndexStorage.js.map +1 -1
- package/cjs/internal/icons/16px/index.d.ts +3 -0
- package/cjs/internal/icons/16px/index.js +44 -2
- package/cjs/internal/icons/16px/index.js.map +1 -1
- package/cjs/internal/icons/SpinnerIcon.d.ts +4 -1
- package/cjs/internal/icons/SpinnerIcon.js +5 -2
- package/cjs/internal/icons/SpinnerIcon.js.map +1 -1
- package/cjs/internal/themes/DarkTheme.d.ts +34 -0
- package/cjs/internal/themes/DarkTheme.js +55 -3
- package/cjs/internal/themes/DarkTheme.js.map +1 -1
- package/cjs/internal/themes/DefaultTheme.d.ts +39 -3
- package/cjs/internal/themes/DefaultTheme.js +76 -15
- package/cjs/internal/themes/DefaultTheme.js.map +1 -1
- package/cjs/internal/themes/OldColors.d.ts +6 -0
- package/cjs/internal/themes/OldColors.js +35 -17
- package/cjs/internal/themes/OldColors.js.map +1 -1
- package/cjs/lib/ModalStack.js +16 -17
- package/cjs/lib/ModalStack.js.map +1 -1
- package/cjs/lib/locale/types.d.ts +2 -0
- package/cjs/lib/locale/types.js +2 -0
- package/cjs/lib/locale/types.js.map +1 -1
- package/cjs/lib/locale/useLocaleForControl.d.ts +3 -0
- package/cjs/lib/locale/useLocaleForControl.js +14 -0
- package/cjs/lib/locale/useLocaleForControl.js.map +1 -0
- package/cjs/lib/stringUtils.d.ts +1 -0
- package/cjs/lib/stringUtils.js +13 -0
- package/cjs/lib/stringUtils.js.map +1 -0
- package/cjs/lib/theming/AnimationKeyframes.js +1 -1
- package/cjs/lib/theming/AnimationKeyframes.js.map +1 -1
- package/cjs/lib/theming/useTheme.d.ts +1 -0
- package/cjs/lib/theming/useTheme.js +7 -0
- package/cjs/lib/theming/useTheme.js.map +1 -0
- package/cjs/lib/uidUtils.d.ts +1 -0
- package/cjs/lib/uidUtils.js +5 -0
- package/cjs/lib/uidUtils.js.map +1 -0
- package/cjs/lib/utils.d.ts +33 -0
- package/cjs/lib/utils.js +81 -3
- package/cjs/lib/utils.js.map +1 -1
- package/cjs/typings/html-props.d.ts +123 -0
- package/components/Button/Button/Button.js +3 -7
- package/components/Button/Button/Button.js.map +1 -1
- package/components/Button/Button.d.ts +1 -1
- package/components/Button/Button.styles/Button.styles.js +34 -31
- package/components/Button/Button.styles/Button.styles.js.map +1 -1
- package/components/Button/Button.styles.d.ts +1 -0
- package/components/DropdownMenu/DropdownMenu/DropdownMenu.js.map +1 -1
- package/components/DropdownMenu/DropdownMenu.d.ts +2 -2
- package/components/FileUploader/FileUploader/FileUploader.js +258 -0
- package/components/FileUploader/FileUploader/FileUploader.js.map +1 -0
- package/components/FileUploader/FileUploader/package.json +6 -0
- package/components/FileUploader/FileUploader.d.ts +31 -0
- package/components/FileUploader/FileUploader.md +67 -0
- package/components/FileUploader/FileUploader.styles/FileUploader.styles.js +59 -0
- package/components/FileUploader/FileUploader.styles/FileUploader.styles.js.map +1 -0
- package/components/FileUploader/FileUploader.styles/package.json +6 -0
- package/components/FileUploader/FileUploader.styles.d.ts +20 -0
- package/components/FileUploader/index/index.js +3 -0
- package/components/FileUploader/index/index.js.map +1 -0
- package/components/FileUploader/index/package.json +6 -0
- package/components/FileUploader/index.d.ts +4 -0
- package/components/FileUploader/locale/index/index.js +8 -0
- package/components/FileUploader/locale/index/index.js.map +1 -0
- package/components/FileUploader/locale/index/package.json +6 -0
- package/components/FileUploader/locale/index.d.ts +4 -0
- package/components/FileUploader/locale/locales/en/en.js +6 -0
- package/components/FileUploader/locale/locales/en/en.js.map +1 -0
- package/components/FileUploader/locale/locales/en/package.json +6 -0
- package/components/FileUploader/locale/locales/en.d.ts +2 -0
- package/components/FileUploader/locale/locales/ru/package.json +6 -0
- package/components/FileUploader/locale/locales/ru/ru.js +6 -0
- package/components/FileUploader/locale/locales/ru/ru.js.map +1 -0
- package/components/FileUploader/locale/locales/ru.d.ts +2 -0
- package/components/FileUploader/locale/package.json +6 -0
- package/components/FileUploader/locale/types/package.json +6 -0
- package/components/FileUploader/locale/types/types.js +1 -0
- package/components/FileUploader/locale/types/types.js.map +1 -0
- package/components/FileUploader/locale/types.d.ts +6 -0
- package/components/FileUploader/package.json +6 -0
- package/components/GlobalLoader/GlabalLoaderView/GlabalLoaderView.js +30 -0
- package/components/GlobalLoader/GlabalLoaderView/GlabalLoaderView.js.map +1 -0
- package/components/GlobalLoader/GlabalLoaderView/package.json +6 -0
- package/components/GlobalLoader/GlabalLoaderView.d.ts +8 -0
- package/components/GlobalLoader/GlobalLoader/GlobalLoader.js +225 -0
- package/components/GlobalLoader/GlobalLoader/GlobalLoader.js.map +1 -0
- package/components/GlobalLoader/GlobalLoader/package.json +6 -0
- package/components/GlobalLoader/GlobalLoader.d.ts +102 -0
- package/components/GlobalLoader/GlobalLoader.md +92 -0
- package/components/GlobalLoader/GlobalLoaderView.styles/GlobalLoaderView.styles.js +40 -0
- package/components/GlobalLoader/GlobalLoaderView.styles/GlobalLoaderView.styles.js.map +1 -0
- package/components/GlobalLoader/GlobalLoaderView.styles/package.json +6 -0
- package/components/GlobalLoader/GlobalLoaderView.styles.d.ts +13 -0
- package/components/GlobalLoader/index/index.js +1 -0
- package/components/GlobalLoader/index/index.js.map +1 -0
- package/components/GlobalLoader/index/package.json +6 -0
- package/components/GlobalLoader/index.d.ts +1 -0
- package/components/GlobalLoader/package.json +6 -0
- package/components/Hint/Hint/Hint.js.map +1 -1
- package/components/Hint/Hint.d.ts +2 -1
- package/components/Kebab/Kebab/Kebab.js.map +1 -1
- package/components/Kebab/Kebab.d.ts +2 -2
- package/components/Link/Link/Link.js +1 -1
- package/components/Link/Link/Link.js.map +1 -1
- package/components/Link/Link.styles/Link.styles.js +2 -2
- package/components/Link/Link.styles/Link.styles.js.map +1 -1
- package/components/Link/Link.styles.d.ts +1 -1
- package/components/MenuItem/MenuItem/MenuItem.js +2 -7
- package/components/MenuItem/MenuItem/MenuItem.js.map +1 -1
- package/components/MenuItem/MenuItem.d.ts +1 -1
- package/components/Modal/Modal.styles/Modal.styles.js +11 -8
- package/components/Modal/Modal.styles/Modal.styles.js.map +1 -1
- package/components/Modal/Modal.styles.d.ts +1 -0
- package/components/Modal/ModalFooter/ModalFooter.js +1 -1
- package/components/Modal/ModalFooter/ModalFooter.js.map +1 -1
- package/components/SidePage/SidePage.styles/SidePage.styles.js +9 -6
- package/components/SidePage/SidePage.styles/SidePage.styles.js.map +1 -1
- package/components/SidePage/SidePage.styles.d.ts +1 -0
- package/components/SidePage/SidePageFooter/SidePageFooter.js +1 -1
- package/components/SidePage/SidePageFooter/SidePageFooter.js.map +1 -1
- package/components/Spinner/Spinner/Spinner.js +5 -2
- package/components/Spinner/Spinner/Spinner.js.map +1 -1
- package/components/Spinner/Spinner.d.ts +8 -0
- package/components/Spinner/Spinner.md +1 -0
- package/components/Spinner/Spinner.styles/Spinner.styles.js +13 -10
- package/components/Spinner/Spinner.styles/Spinner.styles.js.map +1 -1
- package/components/Spinner/Spinner.styles.d.ts +2 -1
- package/components/Switcher/Switcher.styles/Switcher.styles.js +3 -1
- package/components/Switcher/Switcher.styles/Switcher.styles.js.map +1 -1
- package/components/Tooltip/Tooltip/Tooltip.js +3 -3
- package/components/Tooltip/Tooltip/Tooltip.js.map +1 -1
- package/components/Tooltip/Tooltip.d.ts +8 -21
- package/components/TooltipMenu/TooltipMenu/TooltipMenu.js.map +1 -1
- package/components/TooltipMenu/TooltipMenu.d.ts +2 -2
- package/hooks/useDrop/package.json +6 -0
- package/hooks/useDrop/useDrop.js +57 -0
- package/hooks/useDrop/useDrop.js.map +1 -0
- package/hooks/useDrop.d.ts +11 -0
- package/hooks/useEffectWithoutInitCall/package.json +6 -0
- package/hooks/useEffectWithoutInitCall/useEffectWithoutInitCall.js +11 -0
- package/hooks/useEffectWithoutInitCall/useEffectWithoutInitCall.js.map +1 -0
- package/hooks/useEffectWithoutInitCall.d.ts +2 -0
- package/hooks/useMemoObject/package.json +6 -0
- package/hooks/useMemoObject/useMemoObject.js +6 -0
- package/hooks/useMemoObject/useMemoObject.js.map +1 -0
- package/hooks/useMemoObject.d.ts +1 -0
- package/index.d.ts +2 -0
- package/index.js +3 -1
- package/index.js.map +1 -1
- package/internal/FileUploaderControl/FileUploaderControlContext/FileUploaderControlContext.js +2 -0
- package/internal/FileUploaderControl/FileUploaderControlContext/FileUploaderControlContext.js.map +1 -0
- package/internal/FileUploaderControl/FileUploaderControlContext/package.json +6 -0
- package/internal/FileUploaderControl/FileUploaderControlContext.d.ts +12 -0
- package/internal/FileUploaderControl/FileUploaderControlProvider/FileUploaderControlProvider.js +85 -0
- package/internal/FileUploaderControl/FileUploaderControlProvider/FileUploaderControlProvider.js.map +1 -0
- package/internal/FileUploaderControl/FileUploaderControlProvider/package.json +6 -0
- package/internal/FileUploaderControl/FileUploaderControlProvider.d.ts +14 -0
- package/internal/FileUploaderControl/FileUploaderFile/FileUploaderFile/FileUploaderFile.js +177 -0
- package/internal/FileUploaderControl/FileUploaderFile/FileUploaderFile/FileUploaderFile.js.map +1 -0
- package/internal/FileUploaderControl/FileUploaderFile/FileUploaderFile/package.json +6 -0
- package/internal/FileUploaderControl/FileUploaderFile/FileUploaderFile.d.ts +10 -0
- package/internal/FileUploaderControl/FileUploaderFile/FileUploaderFile.styles/FileUploaderFile.styles.js +32 -0
- package/internal/FileUploaderControl/FileUploaderFile/FileUploaderFile.styles/FileUploaderFile.styles.js.map +1 -0
- package/internal/FileUploaderControl/FileUploaderFile/FileUploaderFile.styles/package.json +6 -0
- package/internal/FileUploaderControl/FileUploaderFile/FileUploaderFile.styles.d.ts +11 -0
- package/internal/FileUploaderControl/FileUploaderFileList/FileUploaderFileList/FileUploaderFileList.js +23 -0
- package/internal/FileUploaderControl/FileUploaderFileList/FileUploaderFileList/FileUploaderFileList.js.map +1 -0
- package/internal/FileUploaderControl/FileUploaderFileList/FileUploaderFileList/package.json +6 -0
- package/internal/FileUploaderControl/FileUploaderFileList/FileUploaderFileList.d.ts +4 -0
- package/internal/FileUploaderControl/FileUploaderFileList/FileUploaderFileList.styles/FileUploaderFileList.styles.js +11 -0
- package/internal/FileUploaderControl/FileUploaderFileList/FileUploaderFileList.styles/FileUploaderFileList.styles.js.map +1 -0
- package/internal/FileUploaderControl/FileUploaderFileList/FileUploaderFileList.styles/package.json +6 -0
- package/internal/FileUploaderControl/FileUploaderFileList/FileUploaderFileList.styles.d.ts +4 -0
- package/internal/FileUploaderControl/FileUploaderFileValidationResult/FileUploaderFileValidationResult.js +16 -0
- package/internal/FileUploaderControl/FileUploaderFileValidationResult/FileUploaderFileValidationResult.js.map +1 -0
- package/internal/FileUploaderControl/FileUploaderFileValidationResult/package.json +6 -0
- package/internal/FileUploaderControl/FileUploaderFileValidationResult.d.ts +7 -0
- package/internal/FileUploaderControl/fileUtils/fileUtils.js +19 -0
- package/internal/FileUploaderControl/fileUtils/fileUtils.js.map +1 -0
- package/internal/FileUploaderControl/fileUtils/package.json +6 -0
- package/internal/FileUploaderControl/fileUtils.d.ts +14 -0
- package/internal/FileUploaderControl/hooks/useControlLocale/package.json +6 -0
- package/internal/FileUploaderControl/hooks/useControlLocale/useControlLocale.js +5 -0
- package/internal/FileUploaderControl/hooks/useControlLocale/useControlLocale.js.map +1 -0
- package/internal/FileUploaderControl/hooks/useControlLocale.d.ts +1 -0
- package/internal/FileUploaderControl/hooks/useUpload/package.json +6 -0
- package/internal/FileUploaderControl/hooks/useUpload/useUpload.js +56 -0
- package/internal/FileUploaderControl/hooks/useUpload/useUpload.js.map +1 -0
- package/internal/FileUploaderControl/hooks/useUpload.d.ts +3 -0
- package/internal/FileUploaderControl/withFileUploaderControlProvider/package.json +6 -0
- package/internal/FileUploaderControl/withFileUploaderControlProvider/withFileUploaderControlProvider.js +17 -0
- package/internal/FileUploaderControl/withFileUploaderControlProvider/withFileUploaderControlProvider.js.map +1 -0
- package/internal/FileUploaderControl/withFileUploaderControlProvider.d.ts +3 -0
- package/internal/Popup/Popup/Popup.js +3 -2
- package/internal/Popup/Popup/Popup.js.map +1 -1
- package/internal/Popup/Popup.d.ts +5 -4
- package/internal/Popup/PopupHelper/PopupHelper.js.map +1 -1
- package/internal/Popup/PopupHelper.d.ts +2 -2
- package/internal/Popup/types/package.json +6 -0
- package/internal/Popup/types/types.js +1 -0
- package/internal/Popup/types/types.js.map +1 -0
- package/internal/Popup/types.d.ts +1 -0
- package/internal/PopupMenu/PopupMenu/PopupMenu.js +4 -4
- package/internal/PopupMenu/PopupMenu/PopupMenu.js.map +1 -1
- package/internal/PopupMenu/PopupMenu.d.ts +3 -3
- package/internal/PopupMenu/validatePositions/validatePositions.js +2 -2
- package/internal/PopupMenu/validatePositions/validatePositions.js.map +1 -1
- package/internal/PopupMenu/validatePositions.d.ts +2 -2
- package/internal/TextWidthHelper/TextWidthHelper/TextWidthHelper.js +51 -0
- package/internal/TextWidthHelper/TextWidthHelper/TextWidthHelper.js.map +1 -0
- package/internal/TextWidthHelper/TextWidthHelper/package.json +6 -0
- package/internal/TextWidthHelper/TextWidthHelper.d.ts +15 -0
- package/internal/TextWidthHelper/TextWidthHelper.styles/TextWidthHelper.styles.js +14 -0
- package/internal/TextWidthHelper/TextWidthHelper.styles/TextWidthHelper.styles.js.map +1 -0
- package/internal/TextWidthHelper/TextWidthHelper.styles/package.json +6 -0
- package/internal/TextWidthHelper/TextWidthHelper.styles.d.ts +4 -0
- package/internal/ThemePlayground/Playground/Playground.js +13 -8
- package/internal/ThemePlayground/Playground/Playground.js.map +1 -1
- package/internal/ThemePlayground/Playground.d.ts +1 -0
- package/internal/ThemePlayground/ThemeContextPlayground/ThemeContextPlayground.js +0 -6
- package/internal/ThemePlayground/ThemeContextPlayground/ThemeContextPlayground.js.map +1 -1
- package/internal/ThemePlayground/ThemeContextPlayground.d.ts +0 -2
- package/internal/ThemePlayground/constants/constants.js +3 -1
- package/internal/ThemePlayground/constants/constants.js.map +1 -1
- package/internal/ThemePlayground/constants.d.ts +1 -2
- package/internal/ThemePlayground/darkTheme/darkTheme.js +14 -0
- package/internal/ThemePlayground/darkTheme/darkTheme.js.map +1 -1
- package/internal/ThemePlayground/darkTheme.d.ts +14 -0
- package/internal/ThemeShowcase/ThemeShowcase/ThemeShowcase.js +7 -5
- package/internal/ThemeShowcase/ThemeShowcase/ThemeShowcase.js.map +1 -1
- package/internal/ThemeShowcase/ThemeShowcase.styles/ThemeShowcase.styles.js +26 -20
- package/internal/ThemeShowcase/ThemeShowcase.styles/ThemeShowcase.styles.js.map +1 -1
- package/internal/ThemeShowcase/ThemeShowcase.styles.d.ts +4 -2
- package/internal/ThemeShowcase/VariablesCollector.d.ts +1 -1
- package/internal/ZIndex/ZIndexStorage/ZIndexStorage.js +1 -0
- package/internal/ZIndex/ZIndexStorage/ZIndexStorage.js.map +1 -1
- package/internal/ZIndex/ZIndexStorage.d.ts +1 -0
- package/internal/icons/16px/index/index.js +42 -0
- package/internal/icons/16px/index/index.js.map +1 -1
- package/internal/icons/16px/index.d.ts +3 -0
- package/internal/icons/SpinnerIcon/SpinnerIcon.js +5 -2
- package/internal/icons/SpinnerIcon/SpinnerIcon.js.map +1 -1
- package/internal/icons/SpinnerIcon.d.ts +4 -1
- package/internal/themes/DarkTheme/DarkTheme.js +65 -3
- package/internal/themes/DarkTheme/DarkTheme.js.map +1 -1
- package/internal/themes/DarkTheme.d.ts +34 -0
- package/internal/themes/DefaultTheme/DefaultTheme.js +104 -20
- package/internal/themes/DefaultTheme/DefaultTheme.js.map +1 -1
- package/internal/themes/DefaultTheme.d.ts +39 -3
- package/internal/themes/OldColors/OldColors.js +31 -19
- package/internal/themes/OldColors/OldColors.js.map +1 -1
- package/internal/themes/OldColors.d.ts +6 -0
- package/lib/ModalStack/ModalStack.js +9 -13
- package/lib/ModalStack/ModalStack.js.map +1 -1
- package/lib/locale/types/types.js.map +1 -1
- package/lib/locale/types.d.ts +2 -0
- package/lib/locale/useLocaleForControl/package.json +6 -0
- package/lib/locale/useLocaleForControl/useLocaleForControl.js +12 -0
- package/lib/locale/useLocaleForControl/useLocaleForControl.js.map +1 -0
- package/lib/locale/useLocaleForControl.d.ts +3 -0
- package/lib/stringUtils/package.json +6 -0
- package/lib/stringUtils/stringUtils.js +12 -0
- package/lib/stringUtils/stringUtils.js.map +1 -0
- package/lib/stringUtils.d.ts +1 -0
- package/lib/theming/AnimationKeyframes/AnimationKeyframes.js +1 -1
- package/lib/theming/AnimationKeyframes/AnimationKeyframes.js.map +1 -1
- package/lib/theming/useTheme/package.json +6 -0
- package/lib/theming/useTheme/useTheme.js +5 -0
- package/lib/theming/useTheme/useTheme.js.map +1 -0
- package/lib/theming/useTheme.d.ts +1 -0
- package/lib/uidUtils/package.json +6 -0
- package/lib/uidUtils/uidUtils.js +4 -0
- package/lib/uidUtils/uidUtils.js.map +1 -0
- package/lib/uidUtils.d.ts +1 -0
- package/lib/utils/utils.js +84 -0
- package/lib/utils/utils.js.map +1 -1
- package/lib/utils.d.ts +33 -0
- package/package.json +4 -1
- package/typings/html-props.d.ts +123 -0
- package/cjs/internal/PopupMenu/PopupMenuPositions.d.ts +0 -2
- package/cjs/internal/PopupMenu/PopupMenuPositions.js +0 -15
- package/cjs/internal/PopupMenu/PopupMenuPositions.js.map +0 -1
- package/internal/PopupMenu/PopupMenuPositions/PopupMenuPositions.js +0 -1
- package/internal/PopupMenu/PopupMenuPositions/PopupMenuPositions.js.map +0 -1
- package/internal/PopupMenu/PopupMenuPositions/package.json +0 -6
- package/internal/PopupMenu/PopupMenuPositions.d.ts +0 -2
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export interface GlobalLoaderProps {
|
|
3
|
+
/**
|
|
4
|
+
* Время(ms) до появления лоадера
|
|
5
|
+
*/
|
|
6
|
+
delayBeforeShow?: number;
|
|
7
|
+
/**
|
|
8
|
+
* Время(ms) до исчезновения лоадера
|
|
9
|
+
*/
|
|
10
|
+
delayBeforeHide?: number;
|
|
11
|
+
/**
|
|
12
|
+
* Ожидаемое время(ms) ответа сервера
|
|
13
|
+
*/
|
|
14
|
+
expectedResponseTime: number;
|
|
15
|
+
/**
|
|
16
|
+
* Добавочное время(ms) ответа сервера
|
|
17
|
+
*/
|
|
18
|
+
overtime?: number;
|
|
19
|
+
/**
|
|
20
|
+
* Анимация лоадера в виде спиннера
|
|
21
|
+
*/
|
|
22
|
+
rejected?: boolean;
|
|
23
|
+
/**
|
|
24
|
+
* Показывать лоадер
|
|
25
|
+
*/
|
|
26
|
+
active?: boolean;
|
|
27
|
+
/**
|
|
28
|
+
* Не показывать анимацию
|
|
29
|
+
*/
|
|
30
|
+
disableAnimations: boolean;
|
|
31
|
+
/**
|
|
32
|
+
* Коллбек, вызывающийся после появления лоадера
|
|
33
|
+
*/
|
|
34
|
+
onStart?(): void;
|
|
35
|
+
/**
|
|
36
|
+
* Коллбек, вызывающийся после исчезновения лоадера
|
|
37
|
+
*/
|
|
38
|
+
onDone?(): void;
|
|
39
|
+
/**
|
|
40
|
+
* Коллбек, вызывающийся после вызова `GlobalLoader.reject()`.
|
|
41
|
+
* Или после установки пропа `rejected = true`
|
|
42
|
+
*/
|
|
43
|
+
onReject?(): void;
|
|
44
|
+
/**
|
|
45
|
+
* Коллбек, вызывающийся после вызова `GlobalLoader.accept()`.
|
|
46
|
+
* Или после установки пропа `rejected = false`
|
|
47
|
+
*/
|
|
48
|
+
onAccept?(): void;
|
|
49
|
+
}
|
|
50
|
+
export interface GlobalLoaderState {
|
|
51
|
+
visible: boolean;
|
|
52
|
+
done: boolean;
|
|
53
|
+
rejected: boolean;
|
|
54
|
+
dead: boolean;
|
|
55
|
+
successAnimationInProgress: boolean;
|
|
56
|
+
expectedResponseTime: number;
|
|
57
|
+
}
|
|
58
|
+
export declare class GlobalLoader extends React.Component<GlobalLoaderProps, GlobalLoaderState> {
|
|
59
|
+
private successAnimationInProgressTimeout;
|
|
60
|
+
private readonly startTask;
|
|
61
|
+
private readonly errorTask;
|
|
62
|
+
private readonly stopTask;
|
|
63
|
+
static defaultProps: Partial<GlobalLoaderProps>;
|
|
64
|
+
constructor(props: GlobalLoaderProps);
|
|
65
|
+
componentDidMount(): void;
|
|
66
|
+
componentDidUpdate(prevProps: Readonly<GlobalLoaderProps>): void;
|
|
67
|
+
componentWillUnmount(): void;
|
|
68
|
+
render(): false | JSX.Element;
|
|
69
|
+
/**
|
|
70
|
+
* Запускает анимацию лоадера <br />
|
|
71
|
+
* Равносильно установке пропа `active = true`
|
|
72
|
+
*
|
|
73
|
+
* @public
|
|
74
|
+
*/
|
|
75
|
+
static start: (expectedResponseTime?: number | undefined) => void;
|
|
76
|
+
/**
|
|
77
|
+
* Останавливает анимацию лоадера <br />
|
|
78
|
+
* Равносильно установке пропа `active = false`
|
|
79
|
+
*
|
|
80
|
+
* @public
|
|
81
|
+
*/
|
|
82
|
+
static done: () => void;
|
|
83
|
+
/**
|
|
84
|
+
* Переключает анимацию лоадера в состояние спиннера <br />
|
|
85
|
+
* Равносильно установке пропа `rejected = true`
|
|
86
|
+
*
|
|
87
|
+
* @public
|
|
88
|
+
*/
|
|
89
|
+
static reject: () => void;
|
|
90
|
+
/**
|
|
91
|
+
* Возвращает анимацию лоадера <br />
|
|
92
|
+
* Равносильно установке пропа `rejected = false`
|
|
93
|
+
*
|
|
94
|
+
* @public
|
|
95
|
+
*/
|
|
96
|
+
static accept: () => void;
|
|
97
|
+
setActive: () => void;
|
|
98
|
+
setDone: () => void;
|
|
99
|
+
setReject: (reject: boolean) => void;
|
|
100
|
+
updateExpectedResponseTime(expectedResponseTime: number): void;
|
|
101
|
+
kill: () => void;
|
|
102
|
+
}
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
Индикатор обмена данными с сервером.
|
|
2
|
+
|
|
3
|
+
Глобальный Лоадер может быть только один в приложении. Поэтому, каждый новый экземпляр компонента
|
|
4
|
+
"убивает" предыдущий
|
|
5
|
+
экземпляр, и начинает перехватывать статические методы.
|
|
6
|
+
|
|
7
|
+
Предполагается монтирование компонента в единственном месте. И управление им через статические методы, либо через пропы.
|
|
8
|
+
|
|
9
|
+
Все статические методы:
|
|
10
|
+
```jsx harmony
|
|
11
|
+
import { Button, Gapped } from '@skbkontur/react-ui';
|
|
12
|
+
|
|
13
|
+
<Gapped>
|
|
14
|
+
<Button onClick={GlobalLoader.start} use="primary">start</Button>
|
|
15
|
+
<Button onClick={GlobalLoader.done} use="success">done</Button>
|
|
16
|
+
<Button onClick={GlobalLoader.reject} use="danger">reject</Button>
|
|
17
|
+
<Button onClick={GlobalLoader.accept} use="pay">accept</Button>
|
|
18
|
+
</Gapped>
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
Монтирование и кастомизация:
|
|
22
|
+
```jsx harmony
|
|
23
|
+
import { Button, Toggle, Gapped, Loader, ThemeContext, ThemeFactory } from '@skbkontur/react-ui';
|
|
24
|
+
import { GlobalLoader } from './GlobalLoader';
|
|
25
|
+
|
|
26
|
+
const myTheme = ThemeFactory.create({ globalLoaderColor: 'red' });
|
|
27
|
+
|
|
28
|
+
const [manually, setManually] = React.useState(false);
|
|
29
|
+
const [active, setActive] = React.useState(false);
|
|
30
|
+
const [error, setError] = React.useState(false);
|
|
31
|
+
|
|
32
|
+
<Gapped vertical>
|
|
33
|
+
<Toggle checked={manually} onValueChange={setManually}>
|
|
34
|
+
Управление пропами
|
|
35
|
+
</Toggle>
|
|
36
|
+
<Loader active={!manually} component={null}>
|
|
37
|
+
<Gapped vertical>
|
|
38
|
+
<Toggle checked={active} onValueChange={setActive}>
|
|
39
|
+
<code>active</code>
|
|
40
|
+
</Toggle>
|
|
41
|
+
<Toggle checked={error} onValueChange={setError}>
|
|
42
|
+
<code>rejected</code>
|
|
43
|
+
</Toggle>
|
|
44
|
+
</Gapped>
|
|
45
|
+
</Loader>
|
|
46
|
+
|
|
47
|
+
<ThemeContext.Provider value={myTheme}>
|
|
48
|
+
<GlobalLoader expectedResponseTime={2000} delayBeforeShow={1000} active={active} rejected={error}
|
|
49
|
+
onStart={(s) => console.log('start', s)}
|
|
50
|
+
onDone={(s) => console.log('done', s)}
|
|
51
|
+
onReject={() => console.log('reject')}
|
|
52
|
+
onAccept={() => console.log('accept')}
|
|
53
|
+
/>
|
|
54
|
+
</ThemeContext.Provider>
|
|
55
|
+
|
|
56
|
+
</Gapped>
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
|
|
60
|
+
Статические методы в модалке:
|
|
61
|
+
```jsx harmony
|
|
62
|
+
import { Button, Gapped, Modal } from '@skbkontur/react-ui';
|
|
63
|
+
|
|
64
|
+
const [opened, setOpened] = React.useState(false);
|
|
65
|
+
|
|
66
|
+
function renderModal() {
|
|
67
|
+
return (
|
|
68
|
+
<Modal onClose={close}>
|
|
69
|
+
<Modal.Header>Заголовок</Modal.Header>
|
|
70
|
+
<Modal.Body>
|
|
71
|
+
<Gapped>
|
|
72
|
+
<Button onClick={GlobalLoader.start} use="primary">start</Button>
|
|
73
|
+
<Button onClick={GlobalLoader.done} use="success">done</Button>
|
|
74
|
+
</Gapped>
|
|
75
|
+
</Modal.Body>
|
|
76
|
+
</Modal>
|
|
77
|
+
);
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
function open() {
|
|
81
|
+
setOpened(true);
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
function close() {
|
|
85
|
+
setOpened(false);
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
<div>
|
|
89
|
+
{opened && renderModal()}
|
|
90
|
+
<Button onClick={open}>Открыть</Button>
|
|
91
|
+
</div>;
|
|
92
|
+
```
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
|
|
2
|
+
|
|
3
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12;
|
|
4
|
+
|
|
5
|
+
import { keyframes } from '@emotion/css';
|
|
6
|
+
import { css, memoizeStyle } from "../../../lib/theming/Emotion";
|
|
7
|
+
export var styles = memoizeStyle({
|
|
8
|
+
outer: function outer(t) {
|
|
9
|
+
return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n background-color: ", ";\n position: ", ";\n left: ", ";\n top: ", ";\n right: ", ";\n bottom: ", ";\n overflow: hidden;\n "])), t.globalLoaderWidth, t.globalLoaderHeight, t.globalLoaderBackgroundColor, t.globalLoaderPosition, t.globalLoaderLeft, t.globalLoaderTop, t.globalLoaderRight, t.globalLoaderBottom);
|
|
10
|
+
},
|
|
11
|
+
inner: function inner(t) {
|
|
12
|
+
return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n width: 0;\n height: ", ";\n position: absolute;\n left: 0;\n overflow: hidden;\n "])), t.globalLoaderColor, t.globalLoaderHeight);
|
|
13
|
+
},
|
|
14
|
+
standardWithoutAnimation: function standardWithoutAnimation() {
|
|
15
|
+
return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n left: 0;\n width: 80%;\n "])));
|
|
16
|
+
},
|
|
17
|
+
successWithoutAnimation: function successWithoutAnimation() {
|
|
18
|
+
return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n left: 0;\n width: 100%;\n "])));
|
|
19
|
+
},
|
|
20
|
+
errorWithoutAnimation: function errorWithoutAnimation() {
|
|
21
|
+
return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n left: 40%;\n width: 20%;\n "])));
|
|
22
|
+
}
|
|
23
|
+
});
|
|
24
|
+
var moveToRightAnimation = keyframes(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n 0% {\n left: 0;\n width: 100%;\n }\n 50% {\n left: 50%;\n width: 50%;\n }\n 100% {\n left: 99%;\n width: 1%\n }\n"])));
|
|
25
|
+
var spinnerAnimation = keyframes(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n 0% {\n transform: translateX(50%) scaleX(.005);\n animation-timing-function: cubic-bezier(.895,.03,.685,.22);\n }\n 50% {\n transform: translateX(0) scaleX(.35);\n animation-timing-function: cubic-bezier(.165,.84,.44,1);\n }\n 100% {\n transform: translateX(-50%) scaleX(.005);\n }\n"])));
|
|
26
|
+
var linearProgressAnimation = keyframes(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n from { width: 0; }\n to { width: 80% }\n"])));
|
|
27
|
+
var slowProgressAnimation = keyframes(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n from { width: 80% }\n to { width: 100% }\n"])));
|
|
28
|
+
export var animations = {
|
|
29
|
+
successAnimation: function successAnimation(delayBeforeHide, width, left) {
|
|
30
|
+
return css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n animation: successAnimation;\n animation-duration: ", "ms;\n @keyframes successAnimation {\n 0% {\n width: ", "px;\n left: ", "px;\n opacity: 1;\n }\n 50% {\n width: 100%;\n left: 0;\n opacity: 1;\n }\n 80% {\n width: 100%;\n left: 0;\n opacity: 1;\n }\n 100% {\n width: 100%;\n opacity: 0;\n }\n }\n "])), delayBeforeHide, width, left);
|
|
31
|
+
},
|
|
32
|
+
errorAnimation: function errorAnimation(t) {
|
|
33
|
+
var transitionDuration = parseInt(t.globalLoaderTransitionDuration);
|
|
34
|
+
var spinnerAnimationDuration = parseInt(t.globalLoaderSpinnerAnimationDuration);
|
|
35
|
+
return css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n left: 0;\n width: 100%;\n animation: ", " ", "ms linear,\n ", "ms ", " ", "ms infinite alternate;\n "])), moveToRightAnimation, transitionDuration, spinnerAnimationDuration, spinnerAnimation, transitionDuration);
|
|
36
|
+
},
|
|
37
|
+
standardAnimation: function standardAnimation(t, expectedTime, overtime) {
|
|
38
|
+
return css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n animation: ", " ", "ms ease-out,\n ", "ms ", " ", "ms ease-out;\n "])), linearProgressAnimation, expectedTime, overtime, slowProgressAnimation, expectedTime);
|
|
39
|
+
}
|
|
40
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["GlobalLoaderView.styles.ts"],"names":["keyframes","css","memoizeStyle","styles","outer","t","globalLoaderWidth","globalLoaderHeight","globalLoaderBackgroundColor","globalLoaderPosition","globalLoaderLeft","globalLoaderTop","globalLoaderRight","globalLoaderBottom","inner","globalLoaderColor","standardWithoutAnimation","successWithoutAnimation","errorWithoutAnimation","moveToRightAnimation","spinnerAnimation","linearProgressAnimation","slowProgressAnimation","animations","successAnimation","delayBeforeHide","width","left","errorAnimation","transitionDuration","parseInt","globalLoaderTransitionDuration","spinnerAnimationDuration","globalLoaderSpinnerAnimationDuration","standardAnimation","expectedTime","overtime"],"mappings":"6TAAA,SAASA,SAAT,QAA0B,cAA1B;;AAEA,SAASC,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;;AAGA,OAAO,IAAMC,MAAM,GAAGD,YAAY,CAAC;AACjCE,EAAAA,KADiC,iBAC3BC,CAD2B,EACjB;AACd,WAAOJ,GAAP;AACWI,IAAAA,CAAC,CAACC,iBADb;AAEYD,IAAAA,CAAC,CAACE,kBAFd;AAGsBF,IAAAA,CAAC,CAACG,2BAHxB;AAIcH,IAAAA,CAAC,CAACI,oBAJhB;AAKUJ,IAAAA,CAAC,CAACK,gBALZ;AAMSL,IAAAA,CAAC,CAACM,eANX;AAOWN,IAAAA,CAAC,CAACO,iBAPb;AAQYP,IAAAA,CAAC,CAACQ,kBARd;;;AAWD,GAbgC;AAcjCC,EAAAA,KAdiC,iBAc3BT,CAd2B,EAcjB;AACd,WAAOJ,GAAP;AACsBI,IAAAA,CAAC,CAACU,iBADxB;;AAGYV,IAAAA,CAAC,CAACE,kBAHd;;;;;AAQD,GAvBgC;AAwBjCS,EAAAA,wBAxBiC,sCAwBN;AACzB,WAAOf,GAAP;;;;AAID,GA7BgC;AA8BjCgB,EAAAA,uBA9BiC,qCA8BP;AACxB,WAAOhB,GAAP;;;;AAID,GAnCgC;AAoCjCiB,EAAAA,qBApCiC,mCAoCT;AACtB,WAAOjB,GAAP;;;;AAID,GAzCgC,EAAD,CAA3B;;;AA4CP,IAAMkB,oBAAoB,GAAGnB,SAAH,wNAA1B;;;;;;;;;;;;;;AAcA,IAAMoB,gBAAgB,GAAGpB,SAAH,+XAAtB;;;;;;;;;;;;;AAaA,IAAMqB,uBAAuB,GAAGrB,SAAH,yHAA7B;;;;AAIA,IAAMsB,qBAAqB,GAAGtB,SAAH,2HAA3B;;;;;AAKA,OAAO,IAAMuB,UAAU,GAAG;AACxBC,EAAAA,gBADwB,4BACPC,eADO,EACkBC,KADlB,EACiCC,IADjC,EAC+C;AACrE,WAAO1B,GAAP;;AAEwBwB,IAAAA,eAFxB;;;AAKeC,IAAAA,KALf;AAMcC,IAAAA,IANd;;;;;;;;;;;;;;;;;;;AAyBD,GA3BuB;AA4BxBC,EAAAA,cA5BwB,0BA4BTvB,CA5BS,EA4BC;AACvB,QAAMwB,kBAAkB,GAAGC,QAAQ,CAACzB,CAAC,CAAC0B,8BAAH,CAAnC;AACA,QAAMC,wBAAwB,GAAGF,QAAQ,CAACzB,CAAC,CAAC4B,oCAAH,CAAzC;;AAEA,WAAOhC,GAAP;;;AAGekB,IAAAA,oBAHf,EAGuCU,kBAHvC;AAIMG,IAAAA,wBAJN,EAIoCZ,gBAJpC,EAIwDS,kBAJxD;;AAMD,GAtCuB;AAuCxBK,EAAAA,iBAvCwB,6BAuCN7B,CAvCM,EAuCI8B,YAvCJ,EAuC0BC,QAvC1B,EAuC4C;AAClE,WAAOnC,GAAP;AACeoB,IAAAA,uBADf,EAC0Cc,YAD1C;AAEMC,IAAAA,QAFN,EAEoBd,qBAFpB,EAE6Ca,YAF7C;;AAID,GA5CuB,EAAnB","sourcesContent":["import { keyframes } from '@emotion/css';\n\nimport { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const styles = memoizeStyle({\n outer(t: Theme) {\n return css`\n width: ${t.globalLoaderWidth};\n height: ${t.globalLoaderHeight};\n background-color: ${t.globalLoaderBackgroundColor};\n position: ${t.globalLoaderPosition};\n left: ${t.globalLoaderLeft};\n top: ${t.globalLoaderTop};\n right: ${t.globalLoaderRight};\n bottom: ${t.globalLoaderBottom};\n overflow: hidden;\n `;\n },\n inner(t: Theme) {\n return css`\n background-color: ${t.globalLoaderColor};\n width: 0;\n height: ${t.globalLoaderHeight};\n position: absolute;\n left: 0;\n overflow: hidden;\n `;\n },\n standardWithoutAnimation() {\n return css`\n left: 0;\n width: 80%;\n `;\n },\n successWithoutAnimation() {\n return css`\n left: 0;\n width: 100%;\n `;\n },\n errorWithoutAnimation() {\n return css`\n left: 40%;\n width: 20%;\n `;\n },\n});\n\nconst moveToRightAnimation = keyframes`\n 0% {\n left: 0;\n width: 100%;\n }\n 50% {\n left: 50%;\n width: 50%;\n }\n 100% {\n left: 99%;\n width: 1%\n }\n`;\nconst spinnerAnimation = keyframes`\n 0% {\n transform: translateX(50%) scaleX(.005);\n animation-timing-function: cubic-bezier(.895,.03,.685,.22);\n }\n 50% {\n transform: translateX(0) scaleX(.35);\n animation-timing-function: cubic-bezier(.165,.84,.44,1);\n }\n 100% {\n transform: translateX(-50%) scaleX(.005);\n }\n`;\nconst linearProgressAnimation = keyframes`\n from { width: 0; }\n to { width: 80% }\n`;\nconst slowProgressAnimation = keyframes`\n from { width: 80% }\n to { width: 100% }\n`;\n\nexport const animations = {\n successAnimation(delayBeforeHide: number, width: number, left: number) {\n return css`\n animation: successAnimation;\n animation-duration: ${delayBeforeHide}ms;\n @keyframes successAnimation {\n 0% {\n width: ${width}px;\n left: ${left}px;\n opacity: 1;\n }\n 50% {\n width: 100%;\n left: 0;\n opacity: 1;\n }\n 80% {\n width: 100%;\n left: 0;\n opacity: 1;\n }\n 100% {\n width: 100%;\n opacity: 0;\n }\n }\n `;\n },\n errorAnimation(t: Theme) {\n const transitionDuration = parseInt(t.globalLoaderTransitionDuration);\n const spinnerAnimationDuration = parseInt(t.globalLoaderSpinnerAnimationDuration);\n\n return css`\n left: 0;\n width: 100%;\n animation: ${moveToRightAnimation} ${transitionDuration}ms linear,\n ${spinnerAnimationDuration}ms ${spinnerAnimation} ${transitionDuration}ms infinite alternate;\n `;\n },\n standardAnimation(t: Theme, expectedTime: number, overtime: number) {\n return css`\n animation: ${linearProgressAnimation} ${expectedTime}ms ease-out,\n ${overtime}ms ${slowProgressAnimation} ${expectedTime}ms ease-out;\n `;\n },\n};\n"]}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { Theme } from '../../lib/theming/Theme';
|
|
2
|
+
export declare const styles: {
|
|
3
|
+
outer(t: Theme): string;
|
|
4
|
+
inner(t: Theme): string;
|
|
5
|
+
standardWithoutAnimation(): string;
|
|
6
|
+
successWithoutAnimation(): string;
|
|
7
|
+
errorWithoutAnimation(): string;
|
|
8
|
+
};
|
|
9
|
+
export declare const animations: {
|
|
10
|
+
successAnimation(delayBeforeHide: number, width: number, left: number): string;
|
|
11
|
+
errorAnimation(t: Theme): string;
|
|
12
|
+
standardAnimation(t: Theme, expectedTime: number, overtime: number): string;
|
|
13
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "../GlobalLoader";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["index.tsx"],"names":[],"mappings":"AAAA,cAAc,gBAAd","sourcesContent":["export * from './GlobalLoader';\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './GlobalLoader';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Hint.tsx"],"names":["React","ThemeContext","ThemeFactory","Popup","isTestEnv","CommonWrapper","cx","responsiveLayout","rootNode","styles","HINT_BORDER_COLOR","Positions","Hint","state","opened","props","manual","timer","getPositions","filter","x","startsWith","pos","handleMouseEnter","e","window","setTimeout","open","onMouseEnter","handleMouseLeave","clearTimeout","setState","onMouseLeave","close","componentDidUpdate","prevProps","componentWillUnmount","render","theme","create","popupPinOffset","hintPinOffset","popupMargin","hintMargin","popupBorder","hintBorder","popupBorderRadius","hintBorderRadius","isMobileLayout","renderMobile","renderMain","children","undefined","renderContent","setRootNode","hintBgColor","disableAnimations","useWrapper","text","maxWidth","className","content","contentCenter","mobileContent","PureComponent","__KONTUR_REACT_UI__","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { Theme } from '../../lib/theming/Theme';\nimport { Popup, PopupPosition } from '../../internal/Popup';\nimport { Nullable } from '../../typings/utility-types';\nimport { MouseEventType } from '../../typings/event-types';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { responsiveLayout } from '../ResponsiveLayout/decorator';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { styles } from './Hint.styles';\n\nconst HINT_BORDER_COLOR = 'transparent';\n\nexport interface HintProps extends CommonProps {\n children?: React.ReactNode;\n /**\n * Переводит отображение подсказки в _\"ручной режим\"_.\n *\n * В _\"ручном режиме\"_ подcказку можно активировать только задав значение пропу `opened`.\n */\n manual?: boolean;\n /**\n * Задаёт максимальную ширину подсказки.\n */\n maxWidth?: React.CSSProperties['maxWidth'];\n /**\n * HTML-событие `mouseenter`.\n */\n onMouseEnter?: (event: MouseEventType) => void;\n /**\n * HTML-событие `mouseleave`.\n */\n onMouseLeave?: (event: MouseEventType) => void;\n /**\n * Если `true` - подсказка будет открыта.\n *\n * _Примечание_: работает только при `manual=true`.\n */\n opened?: boolean;\n /**\n * Расположение подсказки относительно текста.\n *\n * **Допустимые значения**: `\"top\"`, `\"right\"`, `\"bottom\"`, `\"left\"`, `\"top left\"`, `\"top center\"`, `\"top right\"`, `\"right top\"`, `\"right middle\"`, `\"right bottom\"`, `\"bottom left\"`, `\"bottom center\"`, `\"bottom right\"`, `\"left top\"`, `\"left middle\"`, `\"left bottom\"`.\n */\n pos:\n | 'top'\n | 'right'\n | 'bottom'\n | 'left'\n | 'top left'\n | 'top center'\n | 'top right'\n | 'bottom left'\n | 'bottom center'\n | 'bottom right'\n | 'left top'\n | 'left middle'\n | 'left bottom'\n | 'right top'\n | 'right middle'\n | 'right bottom';\n /**\n * Текст подсказки.\n */\n text: React.ReactNode;\n /**\n * Отключает анимацию.\n */\n disableAnimations: boolean;\n /**\n * Явно указывает, что вложенные элементы должны быть обёрнуты в `<span/>`. <br/> Используется для корректного позиционирования тултипа при двух и более вложенных элементах.\n *\n * _Примечание_: при **двух и более** вложенных элементах обёртка будет добавлена автоматически.\n */\n useWrapper: boolean;\n}\n\nexport interface HintState {\n opened: boolean;\n}\n\nconst Positions: PopupPosition[] = [\n 'top center',\n 'top left',\n 'top right',\n 'bottom center',\n 'bottom left',\n 'bottom right',\n 'left middle',\n 'left top',\n 'left bottom',\n 'right middle',\n 'right top',\n 'right bottom',\n];\n\n/**\n * Всплывающая подсказка, которая по умолчанию отображается при наведении на элемент. <br/> Можно задать другие условия отображения.\n */\n@responsiveLayout\n@rootNode\nexport class Hint extends React.PureComponent<HintProps, HintState> {\n public static __KONTUR_REACT_UI__ = 'Hint';\n\n private isMobileLayout!: boolean;\n\n public static defaultProps = {\n pos: 'top',\n manual: false,\n opened: false,\n maxWidth: 200,\n disableAnimations: isTestEnv,\n useWrapper: false,\n };\n\n public state: HintState = {\n opened: this.props.manual ? !!this.props.opened : false,\n };\n\n private timer: Nullable<number> = null;\n private theme!: Theme;\n private setRootNode!: TSetRootNode;\n\n public componentDidUpdate(prevProps: HintProps) {\n if (!this.props.manual) {\n return;\n }\n if (this.timer) {\n clearTimeout(this.timer);\n this.timer = null;\n }\n if (this.props.opened !== prevProps.opened) {\n this.setState({ opened: !!this.props.opened });\n }\n }\n\n public componentWillUnmount() {\n if (this.timer) {\n clearTimeout(this.timer);\n this.timer = null;\n }\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return (\n <ThemeContext.Provider\n value={ThemeFactory.create(\n {\n popupPinOffset: theme.hintPinOffset,\n popupMargin: theme.hintMargin,\n popupBorder: theme.hintBorder,\n popupBorderRadius: theme.hintBorderRadius,\n },\n this.theme,\n )}\n >\n {this.isMobileLayout ? this.renderMobile() : this.renderMain()}\n </ThemeContext.Provider>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n\n public renderMobile() {\n return (\n <CommonWrapper {...this.props}>\n <Popup\n opened={this.state.opened}\n anchorElement={this.props.children}\n positions={[]}\n onClick={!this.props.manual ? this.open : undefined}\n mobileOnCloseRequest={!this.props.manual ? this.close : undefined}\n >\n {this.renderContent()}\n </Popup>\n </CommonWrapper>\n );\n }\n\n public renderMain() {\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <Popup\n hasPin\n opened={this.state.opened}\n anchorElement={this.props.children}\n positions={this.getPositions()}\n backgroundColor={this.theme.hintBgColor}\n borderColor={HINT_BORDER_COLOR}\n disableAnimations={this.props.disableAnimations}\n onMouseEnter={this.handleMouseEnter}\n onMouseLeave={this.handleMouseLeave}\n useWrapper={this.props.useWrapper}\n >\n {this.renderContent()}\n </Popup>\n </CommonWrapper>\n );\n }\n\n private renderContent() {\n if (!this.props.text) {\n return null;\n }\n\n const { pos, maxWidth } = this.props;\n const className = cx({\n [styles.content(this.theme)]: true,\n [styles.contentCenter(this.theme)]: pos === 'top' || pos === 'bottom',\n [styles.mobileContent(this.theme)]: this.isMobileLayout,\n });\n return (\n <div className={className} style={{ maxWidth: this.isMobileLayout ? '100%' : maxWidth }}>\n {this.props.text}\n </div>\n );\n }\n\n private getPositions = (): PopupPosition[] => {\n return Positions.filter((x) => x.startsWith(this.props.pos));\n };\n\n private handleMouseEnter = (e: MouseEventType) => {\n if (!this.props.manual && !this.timer) {\n this.timer = window.setTimeout(this.open, 400);\n }\n\n if (this.props.onMouseEnter) {\n this.props.onMouseEnter(e);\n }\n };\n\n private handleMouseLeave = (e: MouseEventType) => {\n if (!this.props.manual && this.timer) {\n clearTimeout(this.timer);\n this.timer = null;\n this.setState({ opened: false });\n }\n\n if (this.props.onMouseLeave) {\n this.props.onMouseLeave(e);\n }\n };\n\n private close = () => {\n this.setState({ opened: false });\n };\n\n private open = () => {\n this.setState({ opened: true });\n };\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["Hint.tsx"],"names":["React","ThemeContext","ThemeFactory","Popup","isTestEnv","CommonWrapper","cx","responsiveLayout","rootNode","styles","HINT_BORDER_COLOR","Positions","Hint","state","opened","props","manual","timer","getPositions","filter","x","startsWith","pos","handleMouseEnter","e","window","setTimeout","open","onMouseEnter","handleMouseLeave","clearTimeout","setState","onMouseLeave","close","componentDidUpdate","prevProps","componentWillUnmount","render","theme","create","popupPinOffset","hintPinOffset","popupMargin","hintMargin","popupBorder","hintBorder","popupBorderRadius","hintBorderRadius","isMobileLayout","renderMobile","renderMain","children","undefined","renderContent","setRootNode","hintBgColor","disableAnimations","useWrapper","text","maxWidth","className","content","contentCenter","mobileContent","PureComponent","__KONTUR_REACT_UI__","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { Theme } from '../../lib/theming/Theme';\nimport { Popup, PopupPositionsType } from '../../internal/Popup';\nimport { Nullable } from '../../typings/utility-types';\nimport { MouseEventType } from '../../typings/event-types';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { responsiveLayout } from '../ResponsiveLayout/decorator';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { styles } from './Hint.styles';\n\nconst HINT_BORDER_COLOR = 'transparent';\n\nexport interface HintProps extends CommonProps {\n children?: React.ReactNode;\n /**\n * Переводит отображение подсказки в _\"ручной режим\"_.\n *\n * В _\"ручном режиме\"_ подcказку можно активировать только задав значение пропу `opened`.\n */\n manual?: boolean;\n /**\n * Задаёт максимальную ширину подсказки.\n */\n maxWidth?: React.CSSProperties['maxWidth'];\n /**\n * HTML-событие `mouseenter`.\n */\n onMouseEnter?: (event: MouseEventType) => void;\n /**\n * HTML-событие `mouseleave`.\n */\n onMouseLeave?: (event: MouseEventType) => void;\n /**\n * Если `true` - подсказка будет открыта.\n *\n * _Примечание_: работает только при `manual=true`.\n */\n opened?: boolean;\n /**\n * Расположение подсказки относительно текста.\n *\n * **Допустимые значения**: `\"top\"`, `\"right\"`, `\"bottom\"`, `\"left\"`, `\"top left\"`, `\"top center\"`, `\"top right\"`, `\"right top\"`, `\"right middle\"`, `\"right bottom\"`, `\"bottom left\"`, `\"bottom center\"`, `\"bottom right\"`, `\"left top\"`, `\"left middle\"`, `\"left bottom\"`.\n */\n pos: 'top' | 'right' | 'bottom' | 'left' | PopupPositionsType;\n /**\n * Текст подсказки.\n */\n text: React.ReactNode;\n /**\n * Отключает анимацию.\n */\n disableAnimations: boolean;\n /**\n * Явно указывает, что вложенные элементы должны быть обёрнуты в `<span/>`. <br/> Используется для корректного позиционирования тултипа при двух и более вложенных элементах.\n *\n * _Примечание_: при **двух и более** вложенных элементах обёртка будет добавлена автоматически.\n */\n useWrapper: boolean;\n}\n\nexport interface HintState {\n opened: boolean;\n}\n\nconst Positions: PopupPositionsType[] = [\n 'top center',\n 'top left',\n 'top right',\n 'bottom center',\n 'bottom left',\n 'bottom right',\n 'left middle',\n 'left top',\n 'left bottom',\n 'right middle',\n 'right top',\n 'right bottom',\n];\n\n/**\n * Всплывающая подсказка, которая по умолчанию отображается при наведении на элемент. <br/> Можно задать другие условия отображения.\n */\n@responsiveLayout\n@rootNode\nexport class Hint extends React.PureComponent<HintProps, HintState> {\n public static __KONTUR_REACT_UI__ = 'Hint';\n\n private isMobileLayout!: boolean;\n\n public static defaultProps = {\n pos: 'top',\n manual: false,\n opened: false,\n maxWidth: 200,\n disableAnimations: isTestEnv,\n useWrapper: false,\n };\n\n public state: HintState = {\n opened: this.props.manual ? !!this.props.opened : false,\n };\n\n private timer: Nullable<number> = null;\n private theme!: Theme;\n private setRootNode!: TSetRootNode;\n\n public componentDidUpdate(prevProps: HintProps) {\n if (!this.props.manual) {\n return;\n }\n if (this.timer) {\n clearTimeout(this.timer);\n this.timer = null;\n }\n if (this.props.opened !== prevProps.opened) {\n this.setState({ opened: !!this.props.opened });\n }\n }\n\n public componentWillUnmount() {\n if (this.timer) {\n clearTimeout(this.timer);\n this.timer = null;\n }\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return (\n <ThemeContext.Provider\n value={ThemeFactory.create(\n {\n popupPinOffset: theme.hintPinOffset,\n popupMargin: theme.hintMargin,\n popupBorder: theme.hintBorder,\n popupBorderRadius: theme.hintBorderRadius,\n },\n this.theme,\n )}\n >\n {this.isMobileLayout ? this.renderMobile() : this.renderMain()}\n </ThemeContext.Provider>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n\n public renderMobile() {\n return (\n <CommonWrapper {...this.props}>\n <Popup\n opened={this.state.opened}\n anchorElement={this.props.children}\n positions={[]}\n onClick={!this.props.manual ? this.open : undefined}\n mobileOnCloseRequest={!this.props.manual ? this.close : undefined}\n >\n {this.renderContent()}\n </Popup>\n </CommonWrapper>\n );\n }\n\n public renderMain() {\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <Popup\n hasPin\n opened={this.state.opened}\n anchorElement={this.props.children}\n positions={this.getPositions()}\n backgroundColor={this.theme.hintBgColor}\n borderColor={HINT_BORDER_COLOR}\n disableAnimations={this.props.disableAnimations}\n onMouseEnter={this.handleMouseEnter}\n onMouseLeave={this.handleMouseLeave}\n useWrapper={this.props.useWrapper}\n >\n {this.renderContent()}\n </Popup>\n </CommonWrapper>\n );\n }\n\n private renderContent() {\n if (!this.props.text) {\n return null;\n }\n\n const { pos, maxWidth } = this.props;\n const className = cx({\n [styles.content(this.theme)]: true,\n [styles.contentCenter(this.theme)]: pos === 'top' || pos === 'bottom',\n [styles.mobileContent(this.theme)]: this.isMobileLayout,\n });\n return (\n <div className={className} style={{ maxWidth: this.isMobileLayout ? '100%' : maxWidth }}>\n {this.props.text}\n </div>\n );\n }\n\n private getPositions = (): PopupPositionsType[] => {\n return Positions.filter((x) => x.startsWith(this.props.pos));\n };\n\n private handleMouseEnter = (e: MouseEventType) => {\n if (!this.props.manual && !this.timer) {\n this.timer = window.setTimeout(this.open, 400);\n }\n\n if (this.props.onMouseEnter) {\n this.props.onMouseEnter(e);\n }\n };\n\n private handleMouseLeave = (e: MouseEventType) => {\n if (!this.props.manual && this.timer) {\n clearTimeout(this.timer);\n this.timer = null;\n this.setState({ opened: false });\n }\n\n if (this.props.onMouseLeave) {\n this.props.onMouseLeave(e);\n }\n };\n\n private close = () => {\n this.setState({ opened: false });\n };\n\n private open = () => {\n this.setState({ opened: true });\n };\n}\n"]}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import { PopupPositionsType } from '../../internal/Popup';
|
|
2
3
|
import { MouseEventType } from '../../typings/event-types';
|
|
3
4
|
import { CommonProps } from '../../internal/CommonWrapper';
|
|
4
5
|
export interface HintProps extends CommonProps {
|
|
@@ -32,7 +33,7 @@ export interface HintProps extends CommonProps {
|
|
|
32
33
|
*
|
|
33
34
|
* **Допустимые значения**: `"top"`, `"right"`, `"bottom"`, `"left"`, `"top left"`, `"top center"`, `"top right"`, `"right top"`, `"right middle"`, `"right bottom"`, `"bottom left"`, `"bottom center"`, `"bottom right"`, `"left top"`, `"left middle"`, `"left bottom"`.
|
|
34
35
|
*/
|
|
35
|
-
pos: 'top' | 'right' | 'bottom' | 'left' |
|
|
36
|
+
pos: 'top' | 'right' | 'bottom' | 'left' | PopupPositionsType;
|
|
36
37
|
/**
|
|
37
38
|
* Текст подсказки.
|
|
38
39
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Kebab.tsx"],"names":["React","PropTypes","isKeyArrowVertical","isKeyEnter","isKeySpace","someKeys","LayoutEvents","keyListener","PopupMenu","ThemeContext","MenuKebabIcon","isTestEnv","ThemeFactory","CommonWrapper","cx","rootNode","styles","Kebab","state","opened","focusedByTab","anchor","listener","remove","undefined","renderCaption","captionProps","disabled","props","handleCaptionKeyDown","event","openMenu","handleCaptionClick","toggleMenu","handleFocus","handleBlur","kebab","theme","focused","renderIcon","e","preventDefault","handleChangeMenuState","isOpened","restoreFocus","setState","onOpen","onClose","requestAnimationFrame","isTabPressed","componentDidMount","addListener","componentWillUnmount","render","create","popupPinOffset","kebabPinOffset","popupMargin","kebabMargin","popupPinSize","kebabPinSize","renderMain","positions","setRootNode","disableAnimations","menuMaxHeight","children","icon","iconsmall","size","iconmedium","iconlarge","Component","__KONTUR_REACT_UI__","propTypes","defaultProps","node","bool","oneOfType","string","number","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { isKeyArrowVertical, isKeyEnter, isKeySpace, someKeys } from '../../lib/events/keyboard/identifiers';\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { PopupMenu, PopupMenuCaptionProps } from '../../internal/PopupMenu';\nimport { Nullable } from '../../typings/utility-types';\nimport { PopupPosition } from '../../internal/Popup';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { MenuKebabIcon } from '../../internal/icons/16px';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { styles } from './Kebab.styles';\n\nexport interface KebabProps extends CommonProps {\n disabled?: boolean;\n /**\n * Функция вызываемая при закрытии выпадашки\n * @default () => undefined\n */\n onClose: () => void;\n /**\n * Функция вызываемая при открытии выпадашки\n * @default () => undefined\n */\n onOpen: () => void;\n size: 'small' | 'medium' | 'large';\n /**\n * Список позиций доступных для расположения выпадашки.\n *\n * Если во всех позициях выпадашка вылезает за пределы `viewport`, будет использована первая из этого списка.\n *\n * **Возможные значения**: `top left`, `top center`, `top right`, `right top`, `right middle`, `right bottom`, `bottom left`, `bottom center`, `bottom right`, `left top`, `left middle`, `left bottom`\n * @default ['bottom left', 'bottom right', 'top left', 'top right']\n */\n positions: PopupPosition[];\n menuMaxHeight?: number | string;\n /**\n * Не показывать анимацию\n */\n disableAnimations: boolean;\n /**\n * Кастомная иконка\n */\n icon?: React.ReactNode;\n}\n\nexport interface KebabState {\n anchor: Nullable<HTMLElement>;\n focusedByTab: boolean;\n opened: boolean;\n}\n\n@rootNode\nexport class Kebab extends React.Component<KebabProps, KebabState> {\n public static __KONTUR_REACT_UI__ = 'Kebab';\n\n public static propTypes = {};\n\n public static defaultProps = {\n onOpen: () => undefined,\n onClose: () => undefined,\n positions: ['bottom left', 'bottom right', 'top left', 'top right'],\n size: 'small',\n disableAnimations: isTestEnv,\n icon: <MenuKebabIcon />,\n };\n\n public state = {\n opened: false,\n focusedByTab: false,\n anchor: null,\n };\n\n private theme!: Theme;\n private setRootNode!: TSetRootNode;\n\n private listener: {\n remove: () => void;\n } = {\n remove: () => undefined,\n };\n\n public componentDidMount() {\n /** addListener'у нужен колбэк в аргумент */\n this.listener = LayoutEvents.addListener(() => undefined);\n }\n\n public componentWillUnmount() {\n this.listener.remove();\n }\n\n public render(): JSX.Element {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return (\n <ThemeContext.Provider\n value={ThemeFactory.create(\n {\n popupPinOffset: theme.kebabPinOffset,\n popupMargin: theme.kebabMargin,\n popupPinSize: theme.kebabPinSize,\n },\n theme,\n )}\n >\n {this.renderMain()}\n </ThemeContext.Provider>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain() {\n const { disabled, positions } = this.props;\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <PopupMenu\n popupHasPin\n positions={positions}\n onChangeMenuState={this.handleChangeMenuState}\n caption={this.renderCaption}\n disableAnimations={this.props.disableAnimations}\n menuMaxHeight={this.props.menuMaxHeight}\n >\n {!disabled && this.props.children}\n </PopupMenu>\n </CommonWrapper>\n );\n }\n\n private renderCaption = (captionProps: PopupMenuCaptionProps) => {\n const { disabled } = this.props;\n const handleCaptionKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (!disabled) {\n this.handleCaptionKeyDown(event, captionProps.openMenu);\n }\n };\n\n const handleCaptionClick = () => {\n if (!disabled) {\n captionProps.toggleMenu();\n }\n };\n\n return (\n <span\n tabIndex={disabled ? -1 : 0}\n onClick={handleCaptionClick}\n onKeyDown={handleCaptionKeyDown}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n className={cx({\n [styles.kebab(this.theme)]: true,\n [styles.opened(this.theme)]: captionProps.opened,\n [styles.disabled()]: disabled,\n [styles.focused(this.theme)]: this.state.focusedByTab,\n })}\n >\n {this.renderIcon()}\n </span>\n );\n };\n\n private handleCaptionKeyDown = (\n e: React.KeyboardEvent<HTMLDivElement>,\n openMenu: PopupMenuCaptionProps['openMenu'],\n ) => {\n if (someKeys(isKeyEnter, isKeySpace, isKeyArrowVertical)(e)) {\n e.preventDefault();\n openMenu(true);\n }\n };\n\n private handleChangeMenuState = (isOpened: boolean, restoreFocus: boolean): void => {\n this.setState(\n {\n opened: isOpened,\n focusedByTab: !isOpened && restoreFocus,\n },\n () => {\n if (this.props.disabled) {\n return;\n }\n\n if (this.state.opened) {\n this.props.onOpen();\n } else {\n this.props.onClose();\n }\n },\n );\n };\n\n private handleFocus = () => {\n if (!this.props.disabled) {\n // focus event fires before keyDown eventlistener\n // so we should check tabPressed in async way\n requestAnimationFrame(() => {\n if (keyListener.isTabPressed) {\n this.setState({ focusedByTab: true });\n }\n });\n }\n };\n\n private handleBlur = () => {\n this.setState({\n focusedByTab: false,\n });\n };\n\n private renderIcon() {\n return (\n <div\n className={cx({\n [styles.icon()]: true,\n [styles.iconsmall()]: this.props.size === 'small',\n [styles.iconmedium()]: this.props.size === 'medium',\n [styles.iconlarge()]: this.props.size === 'large',\n })}\n >\n {this.props.icon}\n </div>\n );\n }\n}\n\nKebab.propTypes = {\n children: PropTypes.node,\n disabled: PropTypes.bool,\n menuMaxHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n /**\n * Размер кебаба small 14px | large 20px\n */\n size: PropTypes.string,\n\n /**\n * Коллбек, вызывающийся перед закрытием кебаба\n */\n onClose: PropTypes.func,\n\n /**\n * Коллбек, вызывающийся перед открытием кебаба\n */\n onOpen: PropTypes.func,\n};\n"]}
|
|
1
|
+
{"version":3,"sources":["Kebab.tsx"],"names":["React","PropTypes","isKeyArrowVertical","isKeyEnter","isKeySpace","someKeys","LayoutEvents","keyListener","PopupMenu","ThemeContext","MenuKebabIcon","isTestEnv","ThemeFactory","CommonWrapper","cx","rootNode","styles","Kebab","state","opened","focusedByTab","anchor","listener","remove","undefined","renderCaption","captionProps","disabled","props","handleCaptionKeyDown","event","openMenu","handleCaptionClick","toggleMenu","handleFocus","handleBlur","kebab","theme","focused","renderIcon","e","preventDefault","handleChangeMenuState","isOpened","restoreFocus","setState","onOpen","onClose","requestAnimationFrame","isTabPressed","componentDidMount","addListener","componentWillUnmount","render","create","popupPinOffset","kebabPinOffset","popupMargin","kebabMargin","popupPinSize","kebabPinSize","renderMain","positions","setRootNode","disableAnimations","menuMaxHeight","children","icon","iconsmall","size","iconmedium","iconlarge","Component","__KONTUR_REACT_UI__","propTypes","defaultProps","node","bool","oneOfType","string","number","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { isKeyArrowVertical, isKeyEnter, isKeySpace, someKeys } from '../../lib/events/keyboard/identifiers';\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { PopupMenu, PopupMenuCaptionProps } from '../../internal/PopupMenu';\nimport { Nullable } from '../../typings/utility-types';\nimport { PopupPositionsType } from '../../internal/Popup';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { MenuKebabIcon } from '../../internal/icons/16px';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { styles } from './Kebab.styles';\n\nexport interface KebabProps extends CommonProps {\n disabled?: boolean;\n /**\n * Функция вызываемая при закрытии выпадашки\n * @default () => undefined\n */\n onClose: () => void;\n /**\n * Функция вызываемая при открытии выпадашки\n * @default () => undefined\n */\n onOpen: () => void;\n size: 'small' | 'medium' | 'large';\n /**\n * Список позиций доступных для расположения выпадашки.\n *\n * Если во всех позициях выпадашка вылезает за пределы `viewport`, будет использована первая из этого списка.\n *\n * **Возможные значения**: `top left`, `top center`, `top right`, `right top`, `right middle`, `right bottom`, `bottom left`, `bottom center`, `bottom right`, `left top`, `left middle`, `left bottom`\n * @default ['bottom left', 'bottom right', 'top left', 'top right']\n */\n positions: PopupPositionsType[];\n menuMaxHeight?: number | string;\n /**\n * Не показывать анимацию\n */\n disableAnimations: boolean;\n /**\n * Кастомная иконка\n */\n icon?: React.ReactNode;\n}\n\nexport interface KebabState {\n anchor: Nullable<HTMLElement>;\n focusedByTab: boolean;\n opened: boolean;\n}\n\n@rootNode\nexport class Kebab extends React.Component<KebabProps, KebabState> {\n public static __KONTUR_REACT_UI__ = 'Kebab';\n\n public static propTypes = {};\n\n public static defaultProps = {\n onOpen: () => undefined,\n onClose: () => undefined,\n positions: ['bottom left', 'bottom right', 'top left', 'top right'],\n size: 'small',\n disableAnimations: isTestEnv,\n icon: <MenuKebabIcon />,\n };\n\n public state = {\n opened: false,\n focusedByTab: false,\n anchor: null,\n };\n\n private theme!: Theme;\n private setRootNode!: TSetRootNode;\n\n private listener: {\n remove: () => void;\n } = {\n remove: () => undefined,\n };\n\n public componentDidMount() {\n /** addListener'у нужен колбэк в аргумент */\n this.listener = LayoutEvents.addListener(() => undefined);\n }\n\n public componentWillUnmount() {\n this.listener.remove();\n }\n\n public render(): JSX.Element {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return (\n <ThemeContext.Provider\n value={ThemeFactory.create(\n {\n popupPinOffset: theme.kebabPinOffset,\n popupMargin: theme.kebabMargin,\n popupPinSize: theme.kebabPinSize,\n },\n theme,\n )}\n >\n {this.renderMain()}\n </ThemeContext.Provider>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain() {\n const { disabled, positions } = this.props;\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <PopupMenu\n popupHasPin\n positions={positions}\n onChangeMenuState={this.handleChangeMenuState}\n caption={this.renderCaption}\n disableAnimations={this.props.disableAnimations}\n menuMaxHeight={this.props.menuMaxHeight}\n >\n {!disabled && this.props.children}\n </PopupMenu>\n </CommonWrapper>\n );\n }\n\n private renderCaption = (captionProps: PopupMenuCaptionProps) => {\n const { disabled } = this.props;\n const handleCaptionKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (!disabled) {\n this.handleCaptionKeyDown(event, captionProps.openMenu);\n }\n };\n\n const handleCaptionClick = () => {\n if (!disabled) {\n captionProps.toggleMenu();\n }\n };\n\n return (\n <span\n tabIndex={disabled ? -1 : 0}\n onClick={handleCaptionClick}\n onKeyDown={handleCaptionKeyDown}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n className={cx({\n [styles.kebab(this.theme)]: true,\n [styles.opened(this.theme)]: captionProps.opened,\n [styles.disabled()]: disabled,\n [styles.focused(this.theme)]: this.state.focusedByTab,\n })}\n >\n {this.renderIcon()}\n </span>\n );\n };\n\n private handleCaptionKeyDown = (\n e: React.KeyboardEvent<HTMLDivElement>,\n openMenu: PopupMenuCaptionProps['openMenu'],\n ) => {\n if (someKeys(isKeyEnter, isKeySpace, isKeyArrowVertical)(e)) {\n e.preventDefault();\n openMenu(true);\n }\n };\n\n private handleChangeMenuState = (isOpened: boolean, restoreFocus: boolean): void => {\n this.setState(\n {\n opened: isOpened,\n focusedByTab: !isOpened && restoreFocus,\n },\n () => {\n if (this.props.disabled) {\n return;\n }\n\n if (this.state.opened) {\n this.props.onOpen();\n } else {\n this.props.onClose();\n }\n },\n );\n };\n\n private handleFocus = () => {\n if (!this.props.disabled) {\n // focus event fires before keyDown eventlistener\n // so we should check tabPressed in async way\n requestAnimationFrame(() => {\n if (keyListener.isTabPressed) {\n this.setState({ focusedByTab: true });\n }\n });\n }\n };\n\n private handleBlur = () => {\n this.setState({\n focusedByTab: false,\n });\n };\n\n private renderIcon() {\n return (\n <div\n className={cx({\n [styles.icon()]: true,\n [styles.iconsmall()]: this.props.size === 'small',\n [styles.iconmedium()]: this.props.size === 'medium',\n [styles.iconlarge()]: this.props.size === 'large',\n })}\n >\n {this.props.icon}\n </div>\n );\n }\n}\n\nKebab.propTypes = {\n children: PropTypes.node,\n disabled: PropTypes.bool,\n menuMaxHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n /**\n * Размер кебаба small 14px | large 20px\n */\n size: PropTypes.string,\n\n /**\n * Коллбек, вызывающийся перед закрытием кебаба\n */\n onClose: PropTypes.func,\n\n /**\n * Коллбек, вызывающийся перед открытием кебаба\n */\n onOpen: PropTypes.func,\n};\n"]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { Nullable } from '../../typings/utility-types';
|
|
3
|
-
import {
|
|
3
|
+
import { PopupPositionsType } from '../../internal/Popup';
|
|
4
4
|
import { CommonProps } from '../../internal/CommonWrapper';
|
|
5
5
|
export interface KebabProps extends CommonProps {
|
|
6
6
|
disabled?: boolean;
|
|
@@ -23,7 +23,7 @@ export interface KebabProps extends CommonProps {
|
|
|
23
23
|
* **Возможные значения**: `top left`, `top center`, `top right`, `right top`, `right middle`, `right bottom`, `bottom left`, `bottom center`, `bottom right`, `left top`, `left middle`, `left bottom`
|
|
24
24
|
* @default ['bottom left', 'bottom right', 'top left', 'top right']
|
|
25
25
|
*/
|
|
26
|
-
positions:
|
|
26
|
+
positions: PopupPositionsType[];
|
|
27
27
|
menuMaxHeight?: number | string;
|
|
28
28
|
/**
|
|
29
29
|
* Не показывать анимацию
|
|
@@ -75,7 +75,7 @@ var Link = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Co
|
|
|
75
75
|
|
|
76
76
|
var focused = !disabled && _this.state.focusedByTab;
|
|
77
77
|
var linkProps = {
|
|
78
|
-
className: cx((_cx = {}, _cx[styles.root(_this.theme)] = true, _cx[styles.button(_this.theme)] = !!_button, _cx[styles.buttonOpened()] = !!_buttonOpened, _cx[styles.useDefault(_this.theme)] = use === 'default', _cx[styles.useSuccess(_this.theme)] = use === 'success', _cx[styles.useDanger(_this.theme)] = use === 'danger', _cx[styles.useGrayed(_this.theme)] = use === 'grayed', _cx[styles.useGrayedFocus(_this.theme)] = use === 'grayed' && focused, _cx[styles.focus(_this.theme)] = focused, _cx[styles.disabled(_this.theme)] = !!disabled || !!loading, _cx)),
|
|
78
|
+
className: cx((_cx = {}, _cx[styles.root(_this.theme)] = true, _cx[styles.button(_this.theme)] = !!_button, _cx[styles.buttonOpened(_this.theme)] = !!_buttonOpened, _cx[styles.useDefault(_this.theme)] = use === 'default', _cx[styles.useSuccess(_this.theme)] = use === 'success', _cx[styles.useDanger(_this.theme)] = use === 'danger', _cx[styles.useGrayed(_this.theme)] = use === 'grayed', _cx[styles.useGrayedFocus(_this.theme)] = use === 'grayed' && focused, _cx[styles.focus(_this.theme)] = focused, _cx[styles.disabled(_this.theme)] = !!disabled || !!loading, _cx)),
|
|
79
79
|
href: href,
|
|
80
80
|
rel: rel,
|
|
81
81
|
onClick: _this._handleClick,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Link.tsx"],"names":["React","PropTypes","keyListener","ThemeContext","isExternalLink","Spinner","CommonWrapper","cx","rootNode","styles","Link","state","focusedByTab","renderMain","props","disabled","href","icon","use","loading","_button","_buttonOpened","relOrigin","rel","rest","iconElement","theme","arrow","focused","linkProps","className","root","button","buttonOpened","useDefault","useSuccess","useDanger","useGrayed","useGrayedFocus","focus","onClick","_handleClick","onFocus","_handleFocus","onBlur","_handleBlur","tabIndex","children","event","requestAnimationFrame","isTabPressed","setState","preventDefault","render","setRootNode","Component","__KONTUR_REACT_UI__","propTypes","bool","string","oneOfType","node","oneOf","defaultProps"],"mappings":"iWAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;;;AAGA,SAASC,WAAT,QAA4B,8BAA5B;;AAEA,SAASC,YAAT,QAA6B,gCAA7B;AACA,SAASC,cAAT,QAA+B,iBAA/B;AACA,SAASC,OAAT,QAAwB,YAAxB;AACA,SAASC,aAAT,QAAmE,8BAAnE;AACA,SAASC,EAAT,QAAmB,2BAAnB;AACA,SAASC,QAAT,QAAuC,sCAAvC;;AAEA,SAASC,MAAT,QAAuB,eAAvB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsDA,OAJA;AACA;AACA,GAEA,IAAaC,IAAb,GADCF,QACD;;;;;;;;;;;;;;;;AAkBSG,IAAAA,KAlBT,GAkBiB;AACbC,MAAAA,YAAY,EAAE,KADD,EAlBjB;;;;;;;;;;;;;;;;;;;;;AAwCUC,IAAAA,UAxCV,GAwCuB,UAACC,KAAD,EAA8C;AACjE,UAAQC,QAAR,GAAgGD,KAAhG,CAAQC,QAAR,CAAkBC,IAAlB,GAAgGF,KAAhG,CAAkBE,IAAlB,CAAwBC,IAAxB,GAAgGH,KAAhG,CAAwBG,IAAxB,CAA8BC,GAA9B,GAAgGJ,KAAhG,CAA8BI,GAA9B,CAAmCC,OAAnC,GAAgGL,KAAhG,CAAmCK,OAAnC,CAA4CC,OAA5C,GAAgGN,KAAhG,CAA4CM,OAA5C,CAAqDC,aAArD,GAAgGP,KAAhG,CAAqDO,aAArD,CAAyEC,SAAzE,GAAgGR,KAAhG,CAAoES,GAApE,CAAuFC,IAAvF,iCAAgGV,KAAhG;;AAEA,UAAIW,WAAW,GAAG,IAAlB;AACA,UAAIR,IAAJ,EAAU;AACRQ,QAAAA,WAAW;AACT,sCAAM,SAAS,EAAEhB,MAAM,CAACQ,IAAP,CAAY,MAAKS,KAAjB,CAAjB,IAA2CP,OAAO,gBAAG,oBAAC,OAAD,IAAS,OAAO,EAAE,IAAlB,EAAwB,MAAM,MAA9B,EAA+B,MAAM,MAArC,GAAH,GAA8CF,IAAhG,CADF;;AAGD;;AAED,UAAIU,KAAK,GAAG,IAAZ;AACA,UAAIP,OAAJ,EAAa;AACXO,QAAAA,KAAK,gBAAG,8BAAM,SAAS,EAAElB,MAAM,CAACkB,KAAP,EAAjB,GAAR;AACD;;AAED,UAAIJ,GAAG,GAAGD,SAAV;AACA,UAAI,OAAOC,GAAP,KAAe,WAAf,IAA8BP,IAAlC,EAAwC;AACtCO,QAAAA,GAAG,iBAAcnB,cAAc,CAACY,IAAD,CAAd,GAAuB,aAAvB,GAAuC,EAArD,CAAH;AACD;;AAED,UAAMY,OAAO,GAAG,CAACb,QAAD,IAAa,MAAKJ,KAAL,CAAWC,YAAxC;;AAEA,UAAMiB,SAAS,GAAG;AAChBC,QAAAA,SAAS,EAAEvB,EAAE;AACVE,QAAAA,MAAM,CAACsB,IAAP,CAAY,MAAKL,KAAjB,CADU,IACgB,IADhB;AAEVjB,QAAAA,MAAM,CAACuB,MAAP,CAAc,MAAKN,KAAnB,CAFU,IAEkB,CAAC,CAACN,OAFpB;AAGVX,QAAAA,MAAM,CAACwB,YAAP,
|
|
1
|
+
{"version":3,"sources":["Link.tsx"],"names":["React","PropTypes","keyListener","ThemeContext","isExternalLink","Spinner","CommonWrapper","cx","rootNode","styles","Link","state","focusedByTab","renderMain","props","disabled","href","icon","use","loading","_button","_buttonOpened","relOrigin","rel","rest","iconElement","theme","arrow","focused","linkProps","className","root","button","buttonOpened","useDefault","useSuccess","useDanger","useGrayed","useGrayedFocus","focus","onClick","_handleClick","onFocus","_handleFocus","onBlur","_handleBlur","tabIndex","children","event","requestAnimationFrame","isTabPressed","setState","preventDefault","render","setRootNode","Component","__KONTUR_REACT_UI__","propTypes","bool","string","oneOfType","node","oneOf","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { Override } from '../../typings/utility-types';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { Theme } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { isExternalLink } from '../../lib/utils';\nimport { Spinner } from '../Spinner';\nimport { CommonWrapper, CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode/rootNodeDecorator';\n\nimport { styles } from './Link.styles';\n\nexport interface LinkProps\n extends CommonProps,\n Override<\n React.AnchorHTMLAttributes<HTMLAnchorElement>,\n {\n /**\n * Отключенное состояние.\n */\n disabled?: boolean;\n /**\n * HTML-атрибут `href`.\n */\n href?: string;\n /**\n * Добавляет ссылке иконку.\n */\n icon?: React.ReactElement<any>;\n /**\n * Тема ссылки.\n */\n use?: 'default' | 'success' | 'danger' | 'grayed';\n /**\n * @ignore\n */\n _button?: boolean;\n /**\n * @ignore\n */\n _buttonOpened?: boolean;\n /**\n * HTML-атрибут `tabindex`.\n */\n tabIndex?: number;\n /**\n * Переводит ссылку в состояние загрузки.\n */\n loading?: boolean;\n /**\n * HTML-событие `onclick`.\n */\n onClick?: (event: React.MouseEvent<HTMLAnchorElement>) => void;\n }\n > {}\n\nexport interface LinkState {\n focusedByTab: boolean;\n}\n\n/**\n * Элемент ссылки из HTML.\n */\n@rootNode\nexport class Link extends React.Component<LinkProps, LinkState> {\n public static __KONTUR_REACT_UI__ = 'Link';\n\n public static propTypes = {\n disabled: PropTypes.bool,\n\n href: PropTypes.string,\n\n icon: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n\n use: PropTypes.oneOf(['default', 'success', 'danger', 'grayed']),\n };\n\n public static defaultProps = {\n href: '',\n use: 'default',\n };\n\n public state = {\n focusedByTab: false,\n };\n\n private theme!: Theme;\n private setRootNode!: TSetRootNode;\n\n public render(): JSX.Element {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n {this.renderMain}\n </CommonWrapper>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain = (props: CommonWrapperRestProps<LinkProps>) => {\n const { disabled, href, icon, use, loading, _button, _buttonOpened, rel: relOrigin, ...rest } = props;\n\n let iconElement = null;\n if (icon) {\n iconElement = (\n <span className={styles.icon(this.theme)}>{loading ? <Spinner caption={null} dimmed inline /> : icon}</span>\n );\n }\n\n let arrow = null;\n if (_button) {\n arrow = <span className={styles.arrow()} />;\n }\n\n let rel = relOrigin;\n if (typeof rel === 'undefined' && href) {\n rel = `noopener${isExternalLink(href) ? ' noreferrer' : ''}`;\n }\n\n const focused = !disabled && this.state.focusedByTab;\n\n const linkProps = {\n className: cx({\n [styles.root(this.theme)]: true,\n [styles.button(this.theme)]: !!_button,\n [styles.buttonOpened(this.theme)]: !!_buttonOpened,\n [styles.useDefault(this.theme)]: use === 'default',\n [styles.useSuccess(this.theme)]: use === 'success',\n [styles.useDanger(this.theme)]: use === 'danger',\n [styles.useGrayed(this.theme)]: use === 'grayed',\n [styles.useGrayedFocus(this.theme)]: use === 'grayed' && focused,\n [styles.focus(this.theme)]: focused,\n [styles.disabled(this.theme)]: !!disabled || !!loading,\n }),\n href,\n rel,\n onClick: this._handleClick,\n onFocus: this._handleFocus,\n onBlur: this._handleBlur,\n tabIndex: disabled || loading ? -1 : this.props.tabIndex,\n };\n\n return (\n <a {...rest} {...linkProps}>\n {iconElement}\n {this.props.children}\n {arrow}\n </a>\n );\n };\n\n private _handleFocus = (event: React.FocusEvent<HTMLAnchorElement>) => {\n if (!this.props.disabled) {\n // focus event fires before keyDown eventlistener\n // so we should check tabPressed in async way\n requestAnimationFrame(() => {\n if (keyListener.isTabPressed) {\n this.setState({ focusedByTab: true });\n }\n });\n }\n };\n\n private _handleBlur = () => {\n this.setState({ focusedByTab: false });\n };\n\n private _handleClick = (event: React.MouseEvent<HTMLAnchorElement>) => {\n const { href, onClick, disabled, loading } = this.props;\n if (!href) {\n event.preventDefault();\n }\n if (onClick && !disabled && !loading) {\n onClick(event);\n }\n };\n}\n"]}
|
|
@@ -11,8 +11,8 @@ export var styles = memoizeStyle({
|
|
|
11
11
|
button: function button(t) {
|
|
12
12
|
return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n display: inline-block;\n line-height: ", ";\n padding-left: ", ";\n padding-right: ", ";\n "])), t.linkButtonLineHeight, t.linkButtonPaddingX, t.linkButtonPaddingX);
|
|
13
13
|
},
|
|
14
|
-
buttonOpened: function buttonOpened() {
|
|
15
|
-
return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n background:
|
|
14
|
+
buttonOpened: function buttonOpened(t) {
|
|
15
|
+
return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n background: ", ";\n "])), t.btnDefaultActiveBg);
|
|
16
16
|
},
|
|
17
17
|
arrow: function arrow() {
|
|
18
18
|
return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n border: 4px solid transparent;\n border-bottom-width: 0;\n border-top-color: #a0a0a0;\n display: inline-block;\n margin-bottom: 3px;\n margin-left: 3px;\n vertical-align: middle;\n "])));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Link.styles.ts"],"names":["css","memoizeStyle","linkMixin","linkDisabledMixin","linkUseColorsMixin","styles","root","t","linkHoverTextDecoration","button","linkButtonLineHeight","linkButtonPaddingX","buttonOpened","arrow","useDefault","linkColor","linkHoverColor","linkActiveColor","useSuccess","linkSuccessColor","linkSuccessHoverColor","linkSuccessActiveColor","useDanger","linkDangerColor","linkDangerHoverColor","linkDangerActiveColor","useGrayed","linkDisabledColor","useGrayedFocus","focus","disabled","icon","linkIconMarginRight"],"mappings":"6TAAA,SAASA,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;;AAGA,SAASC,SAAT,EAAoBC,iBAApB,EAAuCC,kBAAvC,QAAiE,eAAjE;;AAEA,OAAO,IAAMC,MAAM,GAAGJ,YAAY,CAAC;AACjCK,EAAAA,IADiC,gBAC5BC,CAD4B,EAClB;AACb,WAAOP,GAAP;AACIE,IAAAA,SAAS,CAACK,CAAC,CAACC,uBAAH,CADb;;;AAID,GANgC;;AAQjCC,EAAAA,MARiC,kBAQ1BF,CAR0B,EAQhB;AACf,WAAOP,GAAP;;AAEiBO,IAAAA,CAAC,CAACG,oBAFnB;AAGkBH,IAAAA,CAAC,CAACI,kBAHpB;AAImBJ,IAAAA,CAAC,CAACI,kBAJrB;;AAMD,GAfgC;;AAiBjCC,EAAAA,YAjBiC,
|
|
1
|
+
{"version":3,"sources":["Link.styles.ts"],"names":["css","memoizeStyle","linkMixin","linkDisabledMixin","linkUseColorsMixin","styles","root","t","linkHoverTextDecoration","button","linkButtonLineHeight","linkButtonPaddingX","buttonOpened","btnDefaultActiveBg","arrow","useDefault","linkColor","linkHoverColor","linkActiveColor","useSuccess","linkSuccessColor","linkSuccessHoverColor","linkSuccessActiveColor","useDanger","linkDangerColor","linkDangerHoverColor","linkDangerActiveColor","useGrayed","linkDisabledColor","useGrayedFocus","focus","disabled","icon","linkIconMarginRight"],"mappings":"6TAAA,SAASA,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;;AAGA,SAASC,SAAT,EAAoBC,iBAApB,EAAuCC,kBAAvC,QAAiE,eAAjE;;AAEA,OAAO,IAAMC,MAAM,GAAGJ,YAAY,CAAC;AACjCK,EAAAA,IADiC,gBAC5BC,CAD4B,EAClB;AACb,WAAOP,GAAP;AACIE,IAAAA,SAAS,CAACK,CAAC,CAACC,uBAAH,CADb;;;AAID,GANgC;;AAQjCC,EAAAA,MARiC,kBAQ1BF,CAR0B,EAQhB;AACf,WAAOP,GAAP;;AAEiBO,IAAAA,CAAC,CAACG,oBAFnB;AAGkBH,IAAAA,CAAC,CAACI,kBAHpB;AAImBJ,IAAAA,CAAC,CAACI,kBAJrB;;AAMD,GAfgC;;AAiBjCC,EAAAA,YAjBiC,wBAiBpBL,CAjBoB,EAiBV;AACrB,WAAOP,GAAP;AACgBO,IAAAA,CAAC,CAACM,kBADlB;;AAGD,GArBgC;;AAuBjCC,EAAAA,KAvBiC,mBAuBzB;AACN,WAAOd,GAAP;;;;;;;;;AASD,GAjCgC;;AAmCjCe,EAAAA,UAnCiC,sBAmCtBR,CAnCsB,EAmCZ;AACnB,WAAOP,GAAP;AACII,IAAAA,kBAAkB,CAACG,CAAC,CAACS,SAAH,EAAcT,CAAC,CAACU,cAAhB,EAAgCV,CAAC,CAACW,eAAlC,CADtB;;AAGD,GAvCgC;;AAyCjCC,EAAAA,UAzCiC,sBAyCtBZ,CAzCsB,EAyCZ;AACnB,WAAOP,GAAP;AACII,IAAAA,kBAAkB,CAACG,CAAC,CAACa,gBAAH,EAAqBb,CAAC,CAACc,qBAAvB,EAA8Cd,CAAC,CAACe,sBAAhD,CADtB;;AAGD,GA7CgC;;AA+CjCC,EAAAA,SA/CiC,qBA+CvBhB,CA/CuB,EA+Cb;AAClB,WAAOP,GAAP;AACII,IAAAA,kBAAkB,CAACG,CAAC,CAACiB,eAAH,EAAoBjB,CAAC,CAACkB,oBAAtB,EAA4ClB,CAAC,CAACmB,qBAA9C,CADtB;;AAGD,GAnDgC;;AAqDjCC,EAAAA,SArDiC,qBAqDvBpB,CArDuB,EAqDb;AAClB,WAAOP,GAAP;AACII,IAAAA,kBAAkB,CAACG,CAAC,CAACqB,iBAAH,EAAsBrB,CAAC,CAACqB,iBAAxB,EAA2CrB,CAAC,CAACqB,iBAA7C,CADtB;;AAGD,GAzDgC;;AA2DjCC,EAAAA,cA3DiC,0BA2DlBtB,CA3DkB,EA2DR;AACvB,WAAOP,GAAP;AACWO,IAAAA,CAAC,CAACqB,iBADb;;AAGD,GA/DgC;;AAiEjCE,EAAAA,KAjEiC,iBAiE3BvB,CAjE2B,EAiEjB;AACd,WAAOP,GAAP;AACqBO,IAAAA,CAAC,CAACC,uBADvB;;AAGD,GArEgC;;AAuEjCuB,EAAAA,QAvEiC,oBAuExBxB,CAvEwB,EAuEd;AACjB,WAAOP,GAAP;AACIG,IAAAA,iBAAiB,EADrB;;AAGWI,IAAAA,CAAC,CAACqB,iBAHb;;;AAMarB,IAAAA,CAAC,CAACqB,iBANf;;;AASD,GAjFgC;;AAmFjCI,EAAAA,IAnFiC,gBAmF5BzB,CAnF4B,EAmFlB;AACb,WAAOP,GAAP;;AAEkBO,IAAAA,CAAC,CAAC0B,mBAFpB;;AAID,GAxFgC,EAAD,CAA3B","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nimport { linkMixin, linkDisabledMixin, linkUseColorsMixin } from './Link.mixins';\n\nexport const styles = memoizeStyle({\n root(t: Theme) {\n return css`\n ${linkMixin(t.linkHoverTextDecoration)};\n position: relative;\n `;\n },\n\n button(t: Theme) {\n return css`\n display: inline-block;\n line-height: ${t.linkButtonLineHeight};\n padding-left: ${t.linkButtonPaddingX};\n padding-right: ${t.linkButtonPaddingX};\n `;\n },\n\n buttonOpened(t: Theme) {\n return css`\n background: ${t.btnDefaultActiveBg};\n `;\n },\n\n arrow() {\n return css`\n border: 4px solid transparent;\n border-bottom-width: 0;\n border-top-color: #a0a0a0;\n display: inline-block;\n margin-bottom: 3px;\n margin-left: 3px;\n vertical-align: middle;\n `;\n },\n\n useDefault(t: Theme) {\n return css`\n ${linkUseColorsMixin(t.linkColor, t.linkHoverColor, t.linkActiveColor)};\n `;\n },\n\n useSuccess(t: Theme) {\n return css`\n ${linkUseColorsMixin(t.linkSuccessColor, t.linkSuccessHoverColor, t.linkSuccessActiveColor)};\n `;\n },\n\n useDanger(t: Theme) {\n return css`\n ${linkUseColorsMixin(t.linkDangerColor, t.linkDangerHoverColor, t.linkDangerActiveColor)};\n `;\n },\n\n useGrayed(t: Theme) {\n return css`\n ${linkUseColorsMixin(t.linkDisabledColor, t.linkDisabledColor, t.linkDisabledColor)};\n `;\n },\n\n useGrayedFocus(t: Theme) {\n return css`\n color: ${t.linkDisabledColor};\n `;\n },\n\n focus(t: Theme) {\n return css`\n text-decoration: ${t.linkHoverTextDecoration};\n `;\n },\n\n disabled(t: Theme) {\n return css`\n ${linkDisabledMixin()};\n\n color: ${t.linkDisabledColor};\n\n &:hover {\n color: ${t.linkDisabledColor};\n }\n `;\n },\n\n icon(t: Theme) {\n return css`\n display: inline-block;\n margin-right: ${t.linkIconMarginRight};\n `;\n },\n});\n"]}
|
|
@@ -2,7 +2,7 @@ import { Theme } from '../../lib/theming/Theme';
|
|
|
2
2
|
export declare const styles: {
|
|
3
3
|
root(t: Theme): string;
|
|
4
4
|
button(t: Theme): string;
|
|
5
|
-
buttonOpened(): string;
|
|
5
|
+
buttonOpened(t: Theme): string;
|
|
6
6
|
arrow(): string;
|
|
7
7
|
useDefault(t: Theme): string;
|
|
8
8
|
useSuccess(t: Theme): string;
|
|
@@ -7,7 +7,7 @@ var _class, _class2, _temp;
|
|
|
7
7
|
|
|
8
8
|
import React from 'react';
|
|
9
9
|
import PropTypes from 'prop-types';
|
|
10
|
-
import { isFunction } from "../../../lib/utils";
|
|
10
|
+
import { isFunction, isReactUIComponent } from "../../../lib/utils";
|
|
11
11
|
import { ThemeContext } from "../../../lib/theming/ThemeContext";
|
|
12
12
|
import { CommonWrapper } from "../../../internal/CommonWrapper";
|
|
13
13
|
import { cx } from "../../../lib/theming/Emotion";
|
|
@@ -143,9 +143,4 @@ var MenuItem = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_Reac
|
|
|
143
143
|
target: PropTypes.string,
|
|
144
144
|
onClick: PropTypes.func
|
|
145
145
|
}, _temp)) || _class;
|
|
146
|
-
export var isMenuItem =
|
|
147
|
-
var _child$type; // @ts-ignore
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
return (child == null ? void 0 : (_child$type = child.type) == null ? void 0 : _child$type.__KONTUR_REACT_UI__) === 'MenuItem';
|
|
151
|
-
};
|
|
146
|
+
export var isMenuItem = isReactUIComponent('MenuItem');
|