@wireapp/react-ui-kit 8.17.1 → 8.17.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/package.json +28 -28
- package/src/Form/Button.d.js.map +1 -1
- package/src/Form/Button.js +31 -52
- package/src/Form/Button.js.map +1 -1
- package/src/Form/ButtonLink.d.js.map +1 -1
- package/src/Form/ButtonLink.js +7 -25
- package/src/Form/ButtonLink.js.map +1 -1
- package/src/Form/Checkbox.d.js.map +1 -1
- package/src/Form/Checkbox.js +24 -43
- package/src/Form/Checkbox.js.map +1 -1
- package/src/Form/CodeInput.d.js.map +1 -1
- package/src/Form/CodeInput.js +13 -52
- package/src/Form/CodeInput.js.map +1 -1
- package/src/Form/DropFileInput.d.js.map +1 -1
- package/src/Form/DropFileInput.js +14 -53
- package/src/Form/DropFileInput.js.map +1 -1
- package/src/Form/ErrorMessage.d.js.map +1 -1
- package/src/Form/ErrorMessage.js +9 -29
- package/src/Form/ErrorMessage.js.map +1 -1
- package/src/Form/Form.d.js.map +1 -1
- package/src/Form/Form.js +0 -8
- package/src/Form/Form.js.map +1 -1
- package/src/Form/Input.d.js.map +1 -1
- package/src/Form/Input.js +19 -45
- package/src/Form/Input.js.map +1 -1
- package/src/Form/InputBlock.d.js.map +1 -1
- package/src/Form/InputBlock.js +1 -12
- package/src/Form/InputBlock.js.map +1 -1
- package/src/Form/InputLabel.d.js.map +1 -1
- package/src/Form/InputLabel.js +4 -13
- package/src/Form/InputLabel.js.map +1 -1
- package/src/Form/InputSubmitCombo.d.js.map +1 -1
- package/src/Form/InputSubmitCombo.js +3 -17
- package/src/Form/InputSubmitCombo.js.map +1 -1
- package/src/Form/RangeInput.d.js.map +1 -1
- package/src/Form/RangeInput.js +13 -25
- package/src/Form/RangeInput.js.map +1 -1
- package/src/Form/RangeInput.styles.d.js.map +1 -1
- package/src/Form/RangeInput.styles.js +3 -15
- package/src/Form/RangeInput.styles.js.map +1 -1
- package/src/Form/RoundIconButton.d.js.map +1 -1
- package/src/Form/RoundIconButton.js +4 -20
- package/src/Form/RoundIconButton.js.map +1 -1
- package/src/Form/Select.d.js.map +1 -1
- package/src/Form/Select.js +17 -32
- package/src/Form/Select.js.map +1 -1
- package/src/Form/SelectComponents.d.js.map +1 -1
- package/src/Form/SelectComponents.js +15 -46
- package/src/Form/SelectComponents.js.map +1 -1
- package/src/Form/SelectStyles.d.js.map +1 -1
- package/src/Form/SelectStyles.js +6 -13
- package/src/Form/SelectStyles.js.map +1 -1
- package/src/Form/ShakeBox.d.js.map +1 -1
- package/src/Form/ShakeBox.js +12 -27
- package/src/Form/ShakeBox.js.map +1 -1
- package/src/Form/Switch.d.js.map +1 -1
- package/src/Form/Switch.js +14 -26
- package/src/Form/Switch.js.map +1 -1
- package/src/Form/TextArea.d.js.map +1 -1
- package/src/Form/TextArea.js +8 -22
- package/src/Form/TextArea.js.map +1 -1
- package/src/Form/Tooltip.d.js.map +1 -1
- package/src/Form/Tooltip.js +11 -23
- package/src/Form/Tooltip.js.map +1 -1
- package/src/Form/index.d.js +0 -36
- package/src/Form/index.d.js.map +1 -1
- package/src/Form/index.js +0 -36
- package/src/Form/index.js.map +1 -1
- package/src/GlobalCssVariables.d.js.map +1 -1
- package/src/GlobalCssVariables.js +1 -5
- package/src/GlobalCssVariables.js.map +1 -1
- package/src/GlobalStyle.d.js.map +1 -1
- package/src/GlobalStyle.js +2 -12
- package/src/GlobalStyle.js.map +1 -1
- package/src/Icon/AddPeopleIcon.d.js.map +1 -1
- package/src/Icon/AddPeopleIcon.js +3 -7
- package/src/Icon/AddPeopleIcon.js.map +1 -1
- package/src/Icon/ArchiveIcon.d.js.map +1 -1
- package/src/Icon/ArchiveIcon.js +1 -6
- package/src/Icon/ArchiveIcon.js.map +1 -1
- package/src/Icon/ArrowDown.d.js.map +1 -1
- package/src/Icon/ArrowDown.js +3 -7
- package/src/Icon/ArrowDown.js.map +1 -1
- package/src/Icon/ArrowIcon.d.js.map +1 -1
- package/src/Icon/ArrowIcon.js +3 -11
- package/src/Icon/ArrowIcon.js.map +1 -1
- package/src/Icon/AttachmentIcon.d.js.map +1 -1
- package/src/Icon/AttachmentIcon.js +1 -6
- package/src/Icon/AttachmentIcon.js.map +1 -1
- package/src/Icon/AudioVideoIcon.d.js.map +1 -1
- package/src/Icon/AudioVideoIcon.js +1 -6
- package/src/Icon/AudioVideoIcon.js.map +1 -1
- package/src/Icon/BlockIcon.d.js.map +1 -1
- package/src/Icon/BlockIcon.js +1 -6
- package/src/Icon/BlockIcon.js.map +1 -1
- package/src/Icon/Brand/AndroidIcon.d.js.map +1 -1
- package/src/Icon/Brand/AndroidIcon.js +1 -6
- package/src/Icon/Brand/AndroidIcon.js.map +1 -1
- package/src/Icon/Brand/AppleIcon.d.js.map +1 -1
- package/src/Icon/Brand/AppleIcon.js +1 -6
- package/src/Icon/Brand/AppleIcon.js.map +1 -1
- package/src/Icon/Brand/ChromeIcon.d.js.map +1 -1
- package/src/Icon/Brand/ChromeIcon.js +1 -6
- package/src/Icon/Brand/ChromeIcon.js.map +1 -1
- package/src/Icon/Brand/FacebookIcon.d.js.map +1 -1
- package/src/Icon/Brand/FacebookIcon.js +1 -6
- package/src/Icon/Brand/FacebookIcon.js.map +1 -1
- package/src/Icon/Brand/GitHubIcon.d.js.map +1 -1
- package/src/Icon/Brand/GitHubIcon.js +1 -6
- package/src/Icon/Brand/GitHubIcon.js.map +1 -1
- package/src/Icon/Brand/LinkedInIcon.d.js.map +1 -1
- package/src/Icon/Brand/LinkedInIcon.js +1 -6
- package/src/Icon/Brand/LinkedInIcon.js.map +1 -1
- package/src/Icon/Brand/LinuxIcon.d.js.map +1 -1
- package/src/Icon/Brand/LinuxIcon.js +1 -6
- package/src/Icon/Brand/LinuxIcon.js.map +1 -1
- package/src/Icon/Brand/MicrosoftIcon.d.js.map +1 -1
- package/src/Icon/Brand/MicrosoftIcon.js +1 -6
- package/src/Icon/Brand/MicrosoftIcon.js.map +1 -1
- package/src/Icon/Brand/TwitterIcon.d.js.map +1 -1
- package/src/Icon/Brand/TwitterIcon.js +1 -6
- package/src/Icon/Brand/TwitterIcon.js.map +1 -1
- package/src/Icon/CallIcon.d.js.map +1 -1
- package/src/Icon/CallIcon.js +1 -6
- package/src/Icon/CallIcon.js.map +1 -1
- package/src/Icon/CamIcon.d.js.map +1 -1
- package/src/Icon/CamIcon.js +1 -6
- package/src/Icon/CamIcon.js.map +1 -1
- package/src/Icon/CameraIcon.d.js.map +1 -1
- package/src/Icon/CameraIcon.js +3 -7
- package/src/Icon/CameraIcon.js.map +1 -1
- package/src/Icon/CheckIcon.d.js.map +1 -1
- package/src/Icon/CheckIcon.js +1 -6
- package/src/Icon/CheckIcon.js.map +1 -1
- package/src/Icon/CheckRoundIcon.d.js.map +1 -1
- package/src/Icon/CheckRoundIcon.js +1 -6
- package/src/Icon/CheckRoundIcon.js.map +1 -1
- package/src/Icon/ChevronIcon.d.js.map +1 -1
- package/src/Icon/ChevronIcon.js +2 -11
- package/src/Icon/ChevronIcon.js.map +1 -1
- package/src/Icon/CloseIcon.d.js.map +1 -1
- package/src/Icon/CloseIcon.js +1 -6
- package/src/Icon/CloseIcon.js.map +1 -1
- package/src/Icon/CopyIcon.d.js.map +1 -1
- package/src/Icon/CopyIcon.js +1 -6
- package/src/Icon/CopyIcon.js.map +1 -1
- package/src/Icon/DeviceIcon.d.js.map +1 -1
- package/src/Icon/DeviceIcon.js +1 -6
- package/src/Icon/DeviceIcon.js.map +1 -1
- package/src/Icon/DownloadIcon.d.js.map +1 -1
- package/src/Icon/DownloadIcon.js +1 -6
- package/src/Icon/DownloadIcon.js.map +1 -1
- package/src/Icon/EditDocumentIcon.d.js.map +1 -1
- package/src/Icon/EditDocumentIcon.js +3 -7
- package/src/Icon/EditDocumentIcon.js.map +1 -1
- package/src/Icon/EditIcon.d.js.map +1 -1
- package/src/Icon/EditIcon.js +1 -6
- package/src/Icon/EditIcon.js.map +1 -1
- package/src/Icon/EnterIcon.d.js.map +1 -1
- package/src/Icon/EnterIcon.js +1 -6
- package/src/Icon/EnterIcon.js.map +1 -1
- package/src/Icon/ErrorIcon.d.js.map +1 -1
- package/src/Icon/ErrorIcon.js +1 -6
- package/src/Icon/ErrorIcon.js.map +1 -1
- package/src/Icon/FileIcon.d.js.map +1 -1
- package/src/Icon/FileIcon.js +1 -6
- package/src/Icon/FileIcon.js.map +1 -1
- package/src/Icon/GifIcon.d.js.map +1 -1
- package/src/Icon/GifIcon.js +1 -6
- package/src/Icon/GifIcon.js.map +1 -1
- package/src/Icon/GridIcon.d.js.map +1 -1
- package/src/Icon/GridIcon.js +3 -7
- package/src/Icon/GridIcon.js.map +1 -1
- package/src/Icon/GroupIcon.d.js.map +1 -1
- package/src/Icon/GroupIcon.js +1 -6
- package/src/Icon/GroupIcon.js.map +1 -1
- package/src/Icon/HangupIcon.d.js.map +1 -1
- package/src/Icon/HangupIcon.js +1 -6
- package/src/Icon/HangupIcon.js.map +1 -1
- package/src/Icon/HideIcon.d.js.map +1 -1
- package/src/Icon/HideIcon.js +1 -6
- package/src/Icon/HideIcon.js.map +1 -1
- package/src/Icon/ImageIcon.d.js.map +1 -1
- package/src/Icon/ImageIcon.js +1 -6
- package/src/Icon/ImageIcon.js.map +1 -1
- package/src/Icon/InfoIcon.d.js.map +1 -1
- package/src/Icon/InfoIcon.js +1 -6
- package/src/Icon/InfoIcon.js.map +1 -1
- package/src/Icon/InviteIcon.d.js.map +1 -1
- package/src/Icon/InviteIcon.js +1 -6
- package/src/Icon/InviteIcon.js.map +1 -1
- package/src/Icon/LeaveIcon.d.js.map +1 -1
- package/src/Icon/LeaveIcon.js +1 -6
- package/src/Icon/LeaveIcon.js.map +1 -1
- package/src/Icon/LinkIcon.d.js.map +1 -1
- package/src/Icon/LinkIcon.js +3 -7
- package/src/Icon/LinkIcon.js.map +1 -1
- package/src/Icon/ListIcon.d.js.map +1 -1
- package/src/Icon/ListIcon.js +1 -6
- package/src/Icon/ListIcon.js.map +1 -1
- package/src/Icon/LockIcon.d.js.map +1 -1
- package/src/Icon/LockIcon.js +1 -6
- package/src/Icon/LockIcon.js.map +1 -1
- package/src/Icon/MessageIcon.d.js.map +1 -1
- package/src/Icon/MessageIcon.js +1 -6
- package/src/Icon/MessageIcon.js.map +1 -1
- package/src/Icon/MinusIcon.d.js.map +1 -1
- package/src/Icon/MinusIcon.js +1 -6
- package/src/Icon/MinusIcon.js.map +1 -1
- package/src/Icon/MoreIcon.d.js.map +1 -1
- package/src/Icon/MoreIcon.js +1 -6
- package/src/Icon/MoreIcon.js.map +1 -1
- package/src/Icon/MuteIcon.d.js.map +1 -1
- package/src/Icon/MuteIcon.js +1 -6
- package/src/Icon/MuteIcon.js.map +1 -1
- package/src/Icon/NotificationIcon.d.js.map +1 -1
- package/src/Icon/NotificationIcon.js +1 -6
- package/src/Icon/NotificationIcon.js.map +1 -1
- package/src/Icon/NotificationOffIcon.d.js.map +1 -1
- package/src/Icon/NotificationOffIcon.js +1 -6
- package/src/Icon/NotificationOffIcon.js.map +1 -1
- package/src/Icon/OptionsIcon.d.js.map +1 -1
- package/src/Icon/OptionsIcon.js +1 -6
- package/src/Icon/OptionsIcon.js.map +1 -1
- package/src/Icon/PeopleIcon.d.js.map +1 -1
- package/src/Icon/PeopleIcon.js +3 -7
- package/src/Icon/PeopleIcon.js.map +1 -1
- package/src/Icon/PingIcon.d.js.map +1 -1
- package/src/Icon/PingIcon.js +1 -6
- package/src/Icon/PingIcon.js.map +1 -1
- package/src/Icon/PlaneIcon.d.js.map +1 -1
- package/src/Icon/PlaneIcon.js +1 -6
- package/src/Icon/PlaneIcon.js.map +1 -1
- package/src/Icon/PlusIcon.d.js.map +1 -1
- package/src/Icon/PlusIcon.js +1 -6
- package/src/Icon/PlusIcon.js.map +1 -1
- package/src/Icon/ProfileIcon.d.js.map +1 -1
- package/src/Icon/ProfileIcon.js +1 -6
- package/src/Icon/ProfileIcon.js.map +1 -1
- package/src/Icon/RecordBoldIcon.d.js.map +1 -1
- package/src/Icon/RecordBoldIcon.js +2 -11
- package/src/Icon/RecordBoldIcon.js.map +1 -1
- package/src/Icon/RecordIcon.d.js.map +1 -1
- package/src/Icon/RecordIcon.js +1 -6
- package/src/Icon/RecordIcon.js.map +1 -1
- package/src/Icon/RecordPendingIcon.d.js.map +1 -1
- package/src/Icon/RecordPendingIcon.js +1 -6
- package/src/Icon/RecordPendingIcon.js.map +1 -1
- package/src/Icon/ReloadIcon.d.js.map +1 -1
- package/src/Icon/ReloadIcon.js +1 -6
- package/src/Icon/ReloadIcon.js.map +1 -1
- package/src/Icon/SVGIcon.d.js.map +1 -1
- package/src/Icon/SVGIcon.js +11 -22
- package/src/Icon/SVGIcon.js.map +1 -1
- package/src/Icon/ScreenshareIcon.d.js.map +1 -1
- package/src/Icon/ScreenshareIcon.js +1 -6
- package/src/Icon/ScreenshareIcon.js.map +1 -1
- package/src/Icon/SearchIcon.d.js.map +1 -1
- package/src/Icon/SearchIcon.js +1 -6
- package/src/Icon/SearchIcon.js.map +1 -1
- package/src/Icon/ServicesIcon.d.js.map +1 -1
- package/src/Icon/ServicesIcon.js +1 -6
- package/src/Icon/ServicesIcon.js.map +1 -1
- package/src/Icon/SettingsIcon.d.js.map +1 -1
- package/src/Icon/SettingsIcon.js +1 -6
- package/src/Icon/SettingsIcon.js.map +1 -1
- package/src/Icon/ShowIcon.d.js.map +1 -1
- package/src/Icon/ShowIcon.js +1 -6
- package/src/Icon/ShowIcon.js.map +1 -1
- package/src/Icon/SignIcon.d.js.map +1 -1
- package/src/Icon/SignIcon.js +1 -6
- package/src/Icon/SignIcon.js.map +1 -1
- package/src/Icon/SpeakerIcon.d.js.map +1 -1
- package/src/Icon/SpeakerIcon.js +1 -6
- package/src/Icon/SpeakerIcon.js.map +1 -1
- package/src/Icon/SupportIcon.d.js.map +1 -1
- package/src/Icon/SupportIcon.js +1 -6
- package/src/Icon/SupportIcon.js.map +1 -1
- package/src/Icon/TeamIcon.d.js.map +1 -1
- package/src/Icon/TeamIcon.js +1 -6
- package/src/Icon/TeamIcon.js.map +1 -1
- package/src/Icon/TimedIcon.d.js.map +1 -1
- package/src/Icon/TimedIcon.js +1 -6
- package/src/Icon/TimedIcon.js.map +1 -1
- package/src/Icon/TrashCrossIcon.d.js.map +1 -1
- package/src/Icon/TrashCrossIcon.js +1 -6
- package/src/Icon/TrashCrossIcon.js.map +1 -1
- package/src/Icon/TrashIcon.d.js.map +1 -1
- package/src/Icon/TrashIcon.js +1 -6
- package/src/Icon/TrashIcon.js.map +1 -1
- package/src/Icon/TriangleIcon.d.js.map +1 -1
- package/src/Icon/TriangleIcon.js +2 -10
- package/src/Icon/TriangleIcon.js.map +1 -1
- package/src/Icon/UploadIcon.d.js.map +1 -1
- package/src/Icon/UploadIcon.js +1 -6
- package/src/Icon/UploadIcon.js.map +1 -1
- package/src/Icon/WireIcon.d.js.map +1 -1
- package/src/Icon/WireIcon.js +1 -6
- package/src/Icon/WireIcon.js.map +1 -1
- package/src/Icon/index.d.js +0 -146
- package/src/Icon/index.d.js.map +1 -1
- package/src/Icon/index.js +0 -146
- package/src/Icon/index.js.map +1 -1
- package/src/Identity/Animation.d.js.map +1 -1
- package/src/Identity/Animation.js +37 -64
- package/src/Identity/Animation.js.map +1 -1
- package/src/Identity/Avatar.d.js.map +1 -1
- package/src/Identity/Avatar.js +18 -36
- package/src/Identity/Avatar.js.map +1 -1
- package/src/Identity/AvatarGrid.d.js.map +1 -1
- package/src/Identity/AvatarGrid.js +13 -34
- package/src/Identity/AvatarGrid.js.map +1 -1
- package/src/Identity/Logo.d.js.map +1 -1
- package/src/Identity/Logo.js +5 -19
- package/src/Identity/Logo.js.map +1 -1
- package/src/Identity/colors-v2.d.js.map +1 -1
- package/src/Identity/colors-v2.js +4 -13
- package/src/Identity/colors-v2.js.map +1 -1
- package/src/Identity/colors.d.js.map +1 -1
- package/src/Identity/colors.js +6 -22
- package/src/Identity/colors.js.map +1 -1
- package/src/Identity/index.d.js +0 -12
- package/src/Identity/index.d.js.map +1 -1
- package/src/Identity/index.js +0 -12
- package/src/Identity/index.js.map +1 -1
- package/src/Identity/motions.d.js.map +1 -1
- package/src/Identity/motions.js +2 -7
- package/src/Identity/motions.js.map +1 -1
- package/src/Layout/Box.d.js.map +1 -1
- package/src/Layout/Box.js +2 -10
- package/src/Layout/Box.js.map +1 -1
- package/src/Layout/Column.d.js.map +1 -1
- package/src/Layout/Column.js +3 -18
- package/src/Layout/Column.js.map +1 -1
- package/src/Layout/Container.d.js.map +1 -1
- package/src/Layout/Container.js +6 -28
- package/src/Layout/Container.js.map +1 -1
- package/src/Layout/Content.d.js.map +1 -1
- package/src/Layout/Content.js +2 -10
- package/src/Layout/Content.js.map +1 -1
- package/src/Layout/FlexBox.d.js.map +1 -1
- package/src/Layout/FlexBox.js +9 -19
- package/src/Layout/FlexBox.js.map +1 -1
- package/src/Layout/Footer.d.js.map +1 -1
- package/src/Layout/Footer.js +1 -5
- package/src/Layout/Footer.js.map +1 -1
- package/src/Layout/Header.d.js.map +1 -1
- package/src/Layout/Header.js +2 -9
- package/src/Layout/Header.js.map +1 -1
- package/src/Layout/MatchMedia.d.js.map +1 -1
- package/src/Layout/MatchMedia.js +7 -39
- package/src/Layout/MatchMedia.js.map +1 -1
- package/src/Layout/Spacer.d.js.map +1 -1
- package/src/Layout/Spacer.js +4 -7
- package/src/Layout/Spacer.js.map +1 -1
- package/src/Layout/StyledApp.d.js.map +1 -1
- package/src/Layout/StyledApp.js +5 -19
- package/src/Layout/StyledApp.js.map +1 -1
- package/src/Layout/Theme.d.js.map +1 -1
- package/src/Layout/Theme.js +1 -14
- package/src/Layout/Theme.js.map +1 -1
- package/src/Layout/headerMenu/HeaderMenu.d.js.map +1 -1
- package/src/Layout/headerMenu/HeaderMenu.js +8 -32
- package/src/Layout/headerMenu/HeaderMenu.js.map +1 -1
- package/src/Layout/headerMenu/HeaderSubMenu.d.js.map +1 -1
- package/src/Layout/headerMenu/HeaderSubMenu.js +4 -25
- package/src/Layout/headerMenu/HeaderSubMenu.js.map +1 -1
- package/src/Layout/headerMenu/MenuContent.d.js.map +1 -1
- package/src/Layout/headerMenu/MenuContent.js +3 -16
- package/src/Layout/headerMenu/MenuContent.js.map +1 -1
- package/src/Layout/headerMenu/MenuItems.d.js.map +1 -1
- package/src/Layout/headerMenu/MenuItems.js +2 -13
- package/src/Layout/headerMenu/MenuItems.js.map +1 -1
- package/src/Layout/headerMenu/MenuLink.d.js.map +1 -1
- package/src/Layout/headerMenu/MenuLink.js +13 -32
- package/src/Layout/headerMenu/MenuLink.js.map +1 -1
- package/src/Layout/headerMenu/MenuOpenButton.d.js.map +1 -1
- package/src/Layout/headerMenu/MenuOpenButton.js +2 -14
- package/src/Layout/headerMenu/MenuOpenButton.js.map +1 -1
- package/src/Layout/headerMenu/MenuScrollableItems.d.js.map +1 -1
- package/src/Layout/headerMenu/MenuScrollableItems.js +2 -11
- package/src/Layout/headerMenu/MenuScrollableItems.js.map +1 -1
- package/src/Layout/headerMenu/MenuSubLink.d.js.map +1 -1
- package/src/Layout/headerMenu/MenuSubLink.js +3 -17
- package/src/Layout/headerMenu/MenuSubLink.js.map +1 -1
- package/src/Layout/headerMenu/index.d.js +0 -16
- package/src/Layout/headerMenu/index.d.js.map +1 -1
- package/src/Layout/headerMenu/index.js +0 -16
- package/src/Layout/headerMenu/index.js.map +1 -1
- package/src/Layout/index.d.js +0 -26
- package/src/Layout/index.d.js.map +1 -1
- package/src/Layout/index.js +0 -26
- package/src/Layout/index.js.map +1 -1
- package/src/Layout/sizes.d.js.map +1 -1
- package/src/Layout/sizes.js +2 -2
- package/src/Layout/sizes.js.map +1 -1
- package/src/Menu/MenuModal.d.js.map +1 -1
- package/src/Menu/MenuModal.js +10 -34
- package/src/Menu/MenuModal.js.map +1 -1
- package/src/Menu/TabBar.d.js.map +1 -1
- package/src/Menu/TabBar.js +22 -42
- package/src/Menu/TabBar.js.map +1 -1
- package/src/Menu/index.d.js +0 -4
- package/src/Menu/index.d.js.map +1 -1
- package/src/Menu/index.js +0 -4
- package/src/Menu/index.js.map +1 -1
- package/src/Misc/ButtonGroup.d.js.map +1 -1
- package/src/Misc/ButtonGroup.js +5 -20
- package/src/Misc/ButtonGroup.js.map +1 -1
- package/src/Misc/IconButton.d.js.map +1 -1
- package/src/Misc/IconButton.js +8 -26
- package/src/Misc/IconButton.js.map +1 -1
- package/src/Misc/IsInViewport.d.js.map +1 -1
- package/src/Misc/IsInViewport.js +6 -22
- package/src/Misc/IsInViewport.js.map +1 -1
- package/src/Misc/Loading.d.js.map +1 -1
- package/src/Misc/Loading.js +6 -18
- package/src/Misc/Loading.js.map +1 -1
- package/src/Misc/Pagination.d.js.map +1 -1
- package/src/Misc/Pagination.js +13 -36
- package/src/Misc/Pagination.js.map +1 -1
- package/src/Misc/Pill.d.js.map +1 -1
- package/src/Misc/Pill.js +4 -23
- package/src/Misc/Pill.js.map +1 -1
- package/src/Misc/childrenWithDefaultProps.d.js.map +1 -1
- package/src/Misc/childrenWithDefaultProps.js +2 -11
- package/src/Misc/childrenWithDefaultProps.js.map +1 -1
- package/src/Misc/index.d.js +0 -18
- package/src/Misc/index.d.js.map +1 -1
- package/src/Misc/index.js +0 -18
- package/src/Misc/index.js.map +1 -1
- package/src/Misc/useLongTouch.d.js.map +1 -1
- package/src/Misc/useLongTouch.js +3 -11
- package/src/Misc/useLongTouch.js.map +1 -1
- package/src/Misc/useTimeout.d.js.map +1 -1
- package/src/Misc/useTimeout.js +4 -12
- package/src/Misc/useTimeout.js.map +1 -1
- package/src/Modal/Modal.d.js.map +1 -1
- package/src/Modal/Modal.js +10 -40
- package/src/Modal/Modal.js.map +1 -1
- package/src/Modal/Overlay.d.js.map +1 -1
- package/src/Modal/Overlay.js +5 -28
- package/src/Modal/Overlay.js.map +1 -1
- package/src/Modal/index.d.js +0 -3
- package/src/Modal/index.d.js.map +1 -1
- package/src/Modal/index.js +0 -3
- package/src/Modal/index.js.map +1 -1
- package/src/Text/Heading.d.js.map +1 -1
- package/src/Text/Heading.js +42 -74
- package/src/Text/Heading.js.map +1 -1
- package/src/Text/Label.d.js.map +1 -1
- package/src/Text/Label.js +12 -29
- package/src/Text/Label.js.map +1 -1
- package/src/Text/Line.d.js.map +1 -1
- package/src/Text/Line.js +3 -12
- package/src/Text/Line.js.map +1 -1
- package/src/Text/Link.d.js.map +1 -1
- package/src/Text/Link.js +15 -34
- package/src/Text/Link.js.map +1 -1
- package/src/Text/Paragraph.d.js.map +1 -1
- package/src/Text/Paragraph.js +12 -30
- package/src/Text/Paragraph.js.map +1 -1
- package/src/Text/Text.d.js.map +1 -1
- package/src/Text/Text.js +21 -42
- package/src/Text/Text.js.map +1 -1
- package/src/Text/TextLink.d.js.map +1 -1
- package/src/Text/TextLink.js +11 -25
- package/src/Text/TextLink.js.map +1 -1
- package/src/Text/Title.d.js.map +1 -1
- package/src/Text/Title.js +12 -25
- package/src/Text/Title.js.map +1 -1
- package/src/Text/index.d.js +0 -16
- package/src/Text/index.d.js.map +1 -1
- package/src/Text/index.js +0 -16
- package/src/Text/index.js.map +1 -1
- package/src/index.d.js +0 -18
- package/src/index.d.js.map +1 -1
- package/src/index.js +0 -18
- package/src/index.js.map +1 -1
- package/src/mediaQueries.d.js.map +1 -1
- package/src/mediaQueries.js +5 -16
- package/src/mediaQueries.js.map +1 -1
- package/src/util.d.js.map +1 -1
- package/src/util.js +6 -19
- package/src/util.js.map +1 -1
package/package.json
CHANGED
|
@@ -1,41 +1,41 @@
|
|
|
1
1
|
{
|
|
2
2
|
"dependencies": {
|
|
3
|
-
"@types/color": "3.0.
|
|
4
|
-
"bazinga64": "5.11.
|
|
5
|
-
"color": "
|
|
3
|
+
"@types/color": "3.0.3",
|
|
4
|
+
"bazinga64": "5.11.9",
|
|
5
|
+
"color": "4.2.3",
|
|
6
6
|
"emotion-normalize": "11.0.1",
|
|
7
|
-
"react-select": "5.
|
|
8
|
-
"react-transition-group": "4.4.
|
|
7
|
+
"react-select": "5.5.2",
|
|
8
|
+
"react-transition-group": "4.4.5"
|
|
9
9
|
},
|
|
10
10
|
"devDependencies": {
|
|
11
|
-
"@babel/cli": "7.
|
|
12
|
-
"@babel/core": "7.
|
|
13
|
-
"@babel/plugin-proposal-class-properties": "7.
|
|
14
|
-
"@babel/plugin-transform-runtime": "7.
|
|
15
|
-
"@babel/preset-env": "7.
|
|
16
|
-
"@babel/preset-react": "7.
|
|
17
|
-
"@babel/preset-typescript": "7.
|
|
11
|
+
"@babel/cli": "7.19.3",
|
|
12
|
+
"@babel/core": "7.19.3",
|
|
13
|
+
"@babel/plugin-proposal-class-properties": "7.18.6",
|
|
14
|
+
"@babel/plugin-transform-runtime": "7.19.1",
|
|
15
|
+
"@babel/preset-env": "7.19.4",
|
|
16
|
+
"@babel/preset-react": "7.18.6",
|
|
17
|
+
"@babel/preset-typescript": "7.18.6",
|
|
18
18
|
"@emotion/babel-plugin": "11.10.2",
|
|
19
19
|
"@emotion/jest": "11.10.0",
|
|
20
20
|
"@emotion/react": "^11.10.4",
|
|
21
|
-
"@hot-loader/react-dom": "17.0.
|
|
22
|
-
"@testing-library/jest-dom": "5.16.
|
|
23
|
-
"@testing-library/react": "13.
|
|
21
|
+
"@hot-loader/react-dom": "17.0.2",
|
|
22
|
+
"@testing-library/jest-dom": "5.16.5",
|
|
23
|
+
"@testing-library/react": "13.4.0",
|
|
24
24
|
"@types/jest": "^29.1.1",
|
|
25
|
-
"@types/react": "18.0.
|
|
26
|
-
"@types/webpack-env": "1.
|
|
27
|
-
"babel-jest": "
|
|
28
|
-
"babel-loader": "8.2.
|
|
29
|
-
"jest": "29.
|
|
30
|
-
"jest-environment-jsdom": "29.
|
|
31
|
-
"react": "18.
|
|
32
|
-
"react-dom": "18.
|
|
25
|
+
"@types/react": "18.0.21",
|
|
26
|
+
"@types/webpack-env": "1.18.0",
|
|
27
|
+
"babel-jest": "29.2.1",
|
|
28
|
+
"babel-loader": "8.2.5",
|
|
29
|
+
"jest": "29.2.1",
|
|
30
|
+
"jest-environment-jsdom": "29.2.1",
|
|
31
|
+
"react": "18.2.0",
|
|
32
|
+
"react-dom": "18.2.0",
|
|
33
33
|
"react-helmet": "6.1.0",
|
|
34
34
|
"react-hot-loader": "4.13.0",
|
|
35
|
-
"react-styleguidist": "
|
|
36
|
-
"react-test-renderer": "18.
|
|
35
|
+
"react-styleguidist": "13.0.0",
|
|
36
|
+
"react-test-renderer": "18.2.0",
|
|
37
37
|
"rimraf": "3.0.2",
|
|
38
|
-
"typescript": "4.8.
|
|
38
|
+
"typescript": "4.8.4",
|
|
39
39
|
"webpack": "^5.74.0"
|
|
40
40
|
},
|
|
41
41
|
"homepage": "https://wire-react-ui-kit.netlify.app/",
|
|
@@ -73,6 +73,6 @@
|
|
|
73
73
|
"test:update": "yarn test --updateSnapshot",
|
|
74
74
|
"test:project": "yarn dist && yarn test"
|
|
75
75
|
},
|
|
76
|
-
"version": "8.17.
|
|
77
|
-
"gitHead": "
|
|
76
|
+
"version": "8.17.3",
|
|
77
|
+
"gitHead": "cc1de9547f2528a14d3d23937a154f58476d2faf"
|
|
78
78
|
}
|
package/src/Form/Button.d.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"Button.d.js","names":[],"sources":["Button.d.ts"],"sourcesContent":["/** @jsx jsx */\nimport { CSSObject, jsx } from '@emotion/react';\nimport { Theme } from '../Layout';\nimport { TextProps } from '../Text';\nexport declare enum ButtonVariant {\n PRIMARY = \"primary\",\n SECONDARY = \"secondary\",\n TERTIARY = \"tertiary\",\n QUATERNARY = \"quaternary\",\n SEND = \"send\"\n}\nexport interface ButtonProps<T = HTMLButtonElement> extends TextProps<T> {\n variant?: ButtonVariant;\n backgroundColor?: string;\n loadingColor?: string;\n noCapital?: boolean;\n showLoading?: boolean;\n}\nexport declare const buttonStyle: <T>(theme: Theme, props: ButtonProps<T>) => CSSObject;\nexport declare const Button: ({ showLoading, children, loadingColor, ...props }: ButtonProps) => jsx.JSX.Element;\nexport declare const filterButtonProps: (props: ButtonProps) => Object;\n"],"mappings":""}
|
package/src/Form/Button.js
CHANGED
|
@@ -1,40 +1,25 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
|
-
exports.filterButtonProps = exports.
|
|
9
|
-
|
|
7
|
+
exports.filterButtonProps = exports.buttonStyle = exports.ButtonVariant = exports.Button = void 0;
|
|
10
8
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
11
|
-
|
|
12
9
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
13
|
-
|
|
14
10
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
15
|
-
|
|
16
11
|
var _react = require("@emotion/react");
|
|
17
|
-
|
|
18
12
|
var _Identity = require("../Identity");
|
|
19
|
-
|
|
20
13
|
var _motions = require("../Identity/motions");
|
|
21
|
-
|
|
22
14
|
var _Misc = require("../Misc");
|
|
23
|
-
|
|
24
15
|
var _Text = require("../Text");
|
|
25
|
-
|
|
26
16
|
var _util = require("../util");
|
|
27
|
-
|
|
28
17
|
var _excluded = ["variant", "backgroundColor", "block", "disabled", "noCapital", "bold", "center", "color", "fontSize", "noWrap", "textTransform", "truncate"],
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
function
|
|
32
|
-
|
|
33
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
34
|
-
|
|
18
|
+
_excluded2 = ["showLoading", "children", "loadingColor"];
|
|
19
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
20
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
35
21
|
var ButtonVariant;
|
|
36
22
|
exports.ButtonVariant = ButtonVariant;
|
|
37
|
-
|
|
38
23
|
(function (ButtonVariant) {
|
|
39
24
|
ButtonVariant["PRIMARY"] = "primary";
|
|
40
25
|
ButtonVariant["SECONDARY"] = "secondary";
|
|
@@ -42,32 +27,31 @@ exports.ButtonVariant = ButtonVariant;
|
|
|
42
27
|
ButtonVariant["QUATERNARY"] = "quaternary";
|
|
43
28
|
ButtonVariant["SEND"] = "send";
|
|
44
29
|
})(ButtonVariant || (exports.ButtonVariant = ButtonVariant = {}));
|
|
45
|
-
|
|
46
30
|
var buttonStyle = function buttonStyle(theme, _ref) {
|
|
47
31
|
var _ref$variant = _ref.variant,
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
32
|
+
variant = _ref$variant === void 0 ? ButtonVariant.PRIMARY : _ref$variant,
|
|
33
|
+
backgroundColor = _ref.backgroundColor,
|
|
34
|
+
_ref$block = _ref.block,
|
|
35
|
+
block = _ref$block === void 0 ? false : _ref$block,
|
|
36
|
+
_ref$disabled = _ref.disabled,
|
|
37
|
+
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
38
|
+
_ref$noCapital = _ref.noCapital,
|
|
39
|
+
noCapital = _ref$noCapital === void 0 ? false : _ref$noCapital,
|
|
40
|
+
_ref$bold = _ref.bold,
|
|
41
|
+
bold = _ref$bold === void 0 ? true : _ref$bold,
|
|
42
|
+
_ref$center = _ref.center,
|
|
43
|
+
center = _ref$center === void 0 ? true : _ref$center,
|
|
44
|
+
_ref$color = _ref.color,
|
|
45
|
+
color = _ref$color === void 0 ? _Identity.COLOR.WHITE : _ref$color,
|
|
46
|
+
_ref$fontSize = _ref.fontSize,
|
|
47
|
+
fontSize = _ref$fontSize === void 0 ? '16px' : _ref$fontSize,
|
|
48
|
+
_ref$noWrap = _ref.noWrap,
|
|
49
|
+
noWrap = _ref$noWrap === void 0 ? true : _ref$noWrap,
|
|
50
|
+
_ref$textTransform = _ref.textTransform,
|
|
51
|
+
textTransform = _ref$textTransform === void 0 ? 'none' : _ref$textTransform,
|
|
52
|
+
_ref$truncate = _ref.truncate,
|
|
53
|
+
truncate = _ref$truncate === void 0 ? true : _ref$truncate,
|
|
54
|
+
props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
|
|
71
55
|
return _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, (0, _Text.textStyle)(theme, _objectSpread({
|
|
72
56
|
block: block,
|
|
73
57
|
bold: bold,
|
|
@@ -188,15 +172,13 @@ var buttonStyle = function buttonStyle(theme, _ref) {
|
|
|
188
172
|
}
|
|
189
173
|
}));
|
|
190
174
|
};
|
|
191
|
-
|
|
192
175
|
exports.buttonStyle = buttonStyle;
|
|
193
|
-
|
|
194
176
|
var Button = function Button(_ref2) {
|
|
195
177
|
var showLoading = _ref2.showLoading,
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
178
|
+
children = _ref2.children,
|
|
179
|
+
_ref2$loadingColor = _ref2.loadingColor,
|
|
180
|
+
loadingColor = _ref2$loadingColor === void 0 ? _Identity.COLOR.WHITE : _ref2$loadingColor,
|
|
181
|
+
props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded2);
|
|
200
182
|
return (0, _react.jsx)("button", (0, _extends2["default"])({
|
|
201
183
|
css: function css(theme) {
|
|
202
184
|
return buttonStyle(theme, props);
|
|
@@ -210,12 +192,9 @@ var Button = function Button(_ref2) {
|
|
|
210
192
|
}
|
|
211
193
|
}) : children);
|
|
212
194
|
};
|
|
213
|
-
|
|
214
195
|
exports.Button = Button;
|
|
215
|
-
|
|
216
196
|
var filterButtonProps = function filterButtonProps(props) {
|
|
217
197
|
return (0, _util.filterProps)((0, _Text.filterTextProps)(props), ['backgroundColor', 'noCapital']);
|
|
218
198
|
};
|
|
219
|
-
|
|
220
199
|
exports.filterButtonProps = filterButtonProps;
|
|
221
200
|
//# sourceMappingURL=Button.js.map
|
package/src/Form/Button.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Button.tsx"],"names":["ButtonVariant","buttonStyle","theme","variant","PRIMARY","backgroundColor","block","disabled","noCapital","bold","center","color","COLOR","WHITE","fontSize","noWrap","textTransform","truncate","props","border","cursor","display","alignItems","justifyContent","marginBottom","padding","outline","textDecoration","touchAction","transition","defaultTransition","width","TERTIARY","borderRadius","SEND","height","lineHeight","maxWidth","minWidth","Button","primaryDisabledBg","primaryBg","primaryDisabledText","general","contrastColor","primaryHoverBg","primaryFocusBorder","primaryActiveBg","primaryActiveBorder","SECONDARY","COLOR_V2","GRAY_20","GRAY_40","GRAY_60","BLACK","BLUE","BLUE_LIGHT_50","tertiarydisabledBg","tertiaryBg","tertiaryDisabledBorder","tertiaryBorder","Input","placeholderColor","fontWeight","fill","tertiaryHoverBg","tertiaryHoverBorder","focusColor","tertiaryActiveBg","IconButton","primaryActiveFillColor","QUATERNARY","GRAY_50","GREEN","GRAY_80","GREEN_LIGHT_600","GREEN_LIGHT_700","GRAY_70","BLUE_LIGHT_600","BLUE_LIGHT_800","BLUE_LIGHT_700","showLoading","children","loadingColor","filterButtonProps","margin"],"mappings":"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","sourcesContent":["/*\n * Wire\n * Copyright (C) 2018 Wire Swiss GmbH\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see http://www.gnu.org/licenses/.\n *\n */\n\n/** @jsx jsx */\nimport {CSSObject, jsx} from '@emotion/react';\n\nimport {COLOR, COLOR_V2} from '../Identity';\nimport {defaultTransition} from '../Identity/motions';\nimport {Theme} from '../Layout';\nimport {Loading} from '../Misc';\nimport {TextProps, filterTextProps, textStyle} from '../Text';\nimport {filterProps} from '../util';\n\nexport enum ButtonVariant {\n PRIMARY = 'primary',\n SECONDARY = 'secondary',\n TERTIARY = 'tertiary',\n QUATERNARY = 'quaternary',\n SEND = 'send',\n}\n\nexport interface ButtonProps<T = HTMLButtonElement> extends TextProps<T> {\n variant?: ButtonVariant;\n backgroundColor?: string;\n loadingColor?: string;\n noCapital?: boolean;\n showLoading?: boolean;\n}\n\nexport const buttonStyle: <T>(theme: Theme, props: ButtonProps<T>) => CSSObject = (\n theme,\n {\n variant = ButtonVariant.PRIMARY,\n backgroundColor,\n block = false,\n disabled = false,\n noCapital = false,\n bold = true,\n center = true,\n color = COLOR.WHITE,\n fontSize = '16px',\n noWrap = true,\n textTransform = 'none',\n truncate = true,\n ...props\n },\n) => ({\n ...textStyle(theme, {\n block,\n bold,\n center,\n disabled,\n fontSize,\n noWrap,\n textTransform,\n truncate,\n ...props,\n }),\n border: 0,\n cursor: disabled ? 'default' : 'pointer',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n marginBottom: '16px',\n padding: 0,\n outline: 'none',\n textDecoration: 'none',\n touchAction: 'manipulation',\n transition: defaultTransition,\n width: block ? '100%' : 'auto',\n '&:hover, &:focus': {\n textDecoration: 'none',\n },\n ...(variant !== ButtonVariant.TERTIARY && {\n borderRadius: variant === ButtonVariant.SEND ? '100%' : '16px',\n height: variant === ButtonVariant.SEND ? '40px' : '48px',\n lineHeight: variant === ButtonVariant.SEND ? '40px' : '48px',\n ...(variant !== ButtonVariant.SEND && {\n maxWidth: '100%',\n minWidth: '125px',\n padding: '0 16px',\n }),\n }),\n ...(variant === ButtonVariant.PRIMARY && {\n backgroundColor: backgroundColor || (disabled ? theme.Button.primaryDisabledBg : theme.Button.primaryBg),\n color: disabled ? theme.Button.primaryDisabledText : theme.general.contrastColor,\n ...(!disabled && {\n '&:hover, &:focus': {\n backgroundColor: theme.Button.primaryHoverBg,\n },\n '&:focus': {\n border: `1px solid ${theme.Button.primaryFocusBorder}`,\n },\n '&:active': {\n backgroundColor: theme.Button.primaryActiveBg,\n border: `1px solid ${theme.Button.primaryActiveBorder}`,\n color: COLOR.WHITE,\n },\n }),\n }),\n ...(variant === ButtonVariant.SECONDARY && {\n backgroundColor: backgroundColor || (disabled ? COLOR_V2.GRAY_20 : COLOR_V2.WHITE),\n border: `1px solid ${COLOR_V2.GRAY_40}`,\n color: disabled ? COLOR_V2.GRAY_60 : COLOR_V2.BLACK,\n ...(!disabled && {\n '&:hover, &:focus': {\n border: `1px solid ${COLOR_V2.BLUE}`,\n },\n '&:focus': {\n color: COLOR_V2.BLUE,\n },\n '&:active': {\n backgroundColor: COLOR_V2.BLUE_LIGHT_50,\n border: `1px solid ${COLOR_V2.BLUE}`,\n color: COLOR_V2.BLUE,\n },\n }),\n }),\n ...(variant === ButtonVariant.TERTIARY && {\n backgroundColor: backgroundColor || (disabled ? theme.Button.tertiarydisabledBg : theme.Button.tertiaryBg),\n border: disabled ? `1px solid ${theme.Button.tertiaryDisabledBorder}` : `1px solid ${theme.Button.tertiaryBorder}`,\n borderRadius: '12px',\n color: disabled ? theme.Input.placeholderColor : theme.general.color,\n fontSize: '14px',\n fontWeight: 700,\n lineHeight: '24px',\n padding: '4px 8px',\n '& > svg > path': {\n fill: disabled ? theme.Input.placeholderColor : theme.general.color,\n },\n ...(!disabled && {\n '&:hover, &:focus': {\n backgroundColor: theme.Button.tertiaryHoverBg,\n border: `1px solid ${theme.Button.tertiaryHoverBorder}`,\n },\n '&:focus': {\n border: `1px solid ${theme.general.focusColor}`,\n },\n '&:active': {\n backgroundColor: theme.Button.tertiaryActiveBg,\n color: theme.IconButton.primaryActiveFillColor,\n '& > svg > path': {\n fill: theme.IconButton.primaryActiveFillColor,\n },\n },\n }),\n }),\n ...(variant === ButtonVariant.QUATERNARY && {\n backgroundColor: backgroundColor || (disabled ? COLOR_V2.GRAY_50 : COLOR_V2.GREEN),\n color: disabled ? COLOR_V2.GRAY_80 : COLOR_V2.WHITE,\n lineHeight: '24px',\n ...(!disabled && {\n '&:hover, &:focus': {\n backgroundColor: COLOR_V2.GREEN_LIGHT_600,\n },\n '&:focus': {\n border: `1px solid ${COLOR_V2.GREEN_LIGHT_700}`,\n },\n '&:active': {\n backgroundColor: COLOR_V2.GREEN_LIGHT_700,\n },\n }),\n }),\n ...(variant === ButtonVariant.SEND && {\n backgroundColor: backgroundColor || (disabled ? COLOR_V2.GRAY_70 : COLOR_V2.BLUE),\n width: '40px',\n ...(!disabled && {\n '&:hover, &:focus': {\n backgroundColor: COLOR_V2.BLUE_LIGHT_600,\n },\n '&:focus': {\n border: `1px solid ${COLOR_V2.BLUE_LIGHT_800}`,\n },\n '&:active': {\n backgroundColor: COLOR_V2.BLUE_LIGHT_700,\n },\n }),\n }),\n});\n\nexport const Button = ({showLoading, children, loadingColor = COLOR.WHITE, ...props}: ButtonProps) => (\n <button css={(theme: Theme) => buttonStyle(theme, props)} {...filterButtonProps(props)}>\n {showLoading ? <Loading size={30} color={loadingColor} style={{display: 'flex', margin: 'auto'}} /> : children}\n </button>\n);\n\nexport const filterButtonProps = (props: ButtonProps) => {\n return filterProps(filterTextProps(props) as ButtonProps, ['backgroundColor', 'noCapital']);\n};\n"],"file":"Button.js"}
|
|
1
|
+
{"version":3,"file":"Button.js","names":["ButtonVariant","buttonStyle","theme","variant","PRIMARY","backgroundColor","block","disabled","noCapital","bold","center","color","COLOR","WHITE","fontSize","noWrap","textTransform","truncate","props","textStyle","border","cursor","display","alignItems","justifyContent","marginBottom","padding","outline","textDecoration","touchAction","transition","defaultTransition","width","TERTIARY","borderRadius","SEND","height","lineHeight","maxWidth","minWidth","Button","primaryDisabledBg","primaryBg","primaryDisabledText","general","contrastColor","primaryHoverBg","primaryFocusBorder","primaryActiveBg","primaryActiveBorder","SECONDARY","COLOR_V2","GRAY_20","GRAY_40","GRAY_60","BLACK","BLUE","BLUE_LIGHT_50","tertiarydisabledBg","tertiaryBg","tertiaryDisabledBorder","tertiaryBorder","Input","placeholderColor","fontWeight","fill","tertiaryHoverBg","tertiaryHoverBorder","focusColor","tertiaryActiveBg","IconButton","primaryActiveFillColor","QUATERNARY","GRAY_50","GREEN","GRAY_80","GREEN_LIGHT_600","GREEN_LIGHT_700","GRAY_70","BLUE_LIGHT_600","BLUE_LIGHT_800","BLUE_LIGHT_700","showLoading","children","loadingColor","filterButtonProps","margin","filterProps","filterTextProps"],"sources":["Button.tsx"],"sourcesContent":["/*\n * Wire\n * Copyright (C) 2018 Wire Swiss GmbH\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see http://www.gnu.org/licenses/.\n *\n */\n\n/** @jsx jsx */\nimport {CSSObject, jsx} from '@emotion/react';\n\nimport {COLOR, COLOR_V2} from '../Identity';\nimport {defaultTransition} from '../Identity/motions';\nimport {Theme} from '../Layout';\nimport {Loading} from '../Misc';\nimport {TextProps, filterTextProps, textStyle} from '../Text';\nimport {filterProps} from '../util';\n\nexport enum ButtonVariant {\n PRIMARY = 'primary',\n SECONDARY = 'secondary',\n TERTIARY = 'tertiary',\n QUATERNARY = 'quaternary',\n SEND = 'send',\n}\n\nexport interface ButtonProps<T = HTMLButtonElement> extends TextProps<T> {\n variant?: ButtonVariant;\n backgroundColor?: string;\n loadingColor?: string;\n noCapital?: boolean;\n showLoading?: boolean;\n}\n\nexport const buttonStyle: <T>(theme: Theme, props: ButtonProps<T>) => CSSObject = (\n theme,\n {\n variant = ButtonVariant.PRIMARY,\n backgroundColor,\n block = false,\n disabled = false,\n noCapital = false,\n bold = true,\n center = true,\n color = COLOR.WHITE,\n fontSize = '16px',\n noWrap = true,\n textTransform = 'none',\n truncate = true,\n ...props\n },\n) => ({\n ...textStyle(theme, {\n block,\n bold,\n center,\n disabled,\n fontSize,\n noWrap,\n textTransform,\n truncate,\n ...props,\n }),\n border: 0,\n cursor: disabled ? 'default' : 'pointer',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n marginBottom: '16px',\n padding: 0,\n outline: 'none',\n textDecoration: 'none',\n touchAction: 'manipulation',\n transition: defaultTransition,\n width: block ? '100%' : 'auto',\n '&:hover, &:focus': {\n textDecoration: 'none',\n },\n ...(variant !== ButtonVariant.TERTIARY && {\n borderRadius: variant === ButtonVariant.SEND ? '100%' : '16px',\n height: variant === ButtonVariant.SEND ? '40px' : '48px',\n lineHeight: variant === ButtonVariant.SEND ? '40px' : '48px',\n ...(variant !== ButtonVariant.SEND && {\n maxWidth: '100%',\n minWidth: '125px',\n padding: '0 16px',\n }),\n }),\n ...(variant === ButtonVariant.PRIMARY && {\n backgroundColor: backgroundColor || (disabled ? theme.Button.primaryDisabledBg : theme.Button.primaryBg),\n color: disabled ? theme.Button.primaryDisabledText : theme.general.contrastColor,\n ...(!disabled && {\n '&:hover, &:focus': {\n backgroundColor: theme.Button.primaryHoverBg,\n },\n '&:focus': {\n border: `1px solid ${theme.Button.primaryFocusBorder}`,\n },\n '&:active': {\n backgroundColor: theme.Button.primaryActiveBg,\n border: `1px solid ${theme.Button.primaryActiveBorder}`,\n color: COLOR.WHITE,\n },\n }),\n }),\n ...(variant === ButtonVariant.SECONDARY && {\n backgroundColor: backgroundColor || (disabled ? COLOR_V2.GRAY_20 : COLOR_V2.WHITE),\n border: `1px solid ${COLOR_V2.GRAY_40}`,\n color: disabled ? COLOR_V2.GRAY_60 : COLOR_V2.BLACK,\n ...(!disabled && {\n '&:hover, &:focus': {\n border: `1px solid ${COLOR_V2.BLUE}`,\n },\n '&:focus': {\n color: COLOR_V2.BLUE,\n },\n '&:active': {\n backgroundColor: COLOR_V2.BLUE_LIGHT_50,\n border: `1px solid ${COLOR_V2.BLUE}`,\n color: COLOR_V2.BLUE,\n },\n }),\n }),\n ...(variant === ButtonVariant.TERTIARY && {\n backgroundColor: backgroundColor || (disabled ? theme.Button.tertiarydisabledBg : theme.Button.tertiaryBg),\n border: disabled ? `1px solid ${theme.Button.tertiaryDisabledBorder}` : `1px solid ${theme.Button.tertiaryBorder}`,\n borderRadius: '12px',\n color: disabled ? theme.Input.placeholderColor : theme.general.color,\n fontSize: '14px',\n fontWeight: 700,\n lineHeight: '24px',\n padding: '4px 8px',\n '& > svg > path': {\n fill: disabled ? theme.Input.placeholderColor : theme.general.color,\n },\n ...(!disabled && {\n '&:hover, &:focus': {\n backgroundColor: theme.Button.tertiaryHoverBg,\n border: `1px solid ${theme.Button.tertiaryHoverBorder}`,\n },\n '&:focus': {\n border: `1px solid ${theme.general.focusColor}`,\n },\n '&:active': {\n backgroundColor: theme.Button.tertiaryActiveBg,\n color: theme.IconButton.primaryActiveFillColor,\n '& > svg > path': {\n fill: theme.IconButton.primaryActiveFillColor,\n },\n },\n }),\n }),\n ...(variant === ButtonVariant.QUATERNARY && {\n backgroundColor: backgroundColor || (disabled ? COLOR_V2.GRAY_50 : COLOR_V2.GREEN),\n color: disabled ? COLOR_V2.GRAY_80 : COLOR_V2.WHITE,\n lineHeight: '24px',\n ...(!disabled && {\n '&:hover, &:focus': {\n backgroundColor: COLOR_V2.GREEN_LIGHT_600,\n },\n '&:focus': {\n border: `1px solid ${COLOR_V2.GREEN_LIGHT_700}`,\n },\n '&:active': {\n backgroundColor: COLOR_V2.GREEN_LIGHT_700,\n },\n }),\n }),\n ...(variant === ButtonVariant.SEND && {\n backgroundColor: backgroundColor || (disabled ? COLOR_V2.GRAY_70 : COLOR_V2.BLUE),\n width: '40px',\n ...(!disabled && {\n '&:hover, &:focus': {\n backgroundColor: COLOR_V2.BLUE_LIGHT_600,\n },\n '&:focus': {\n border: `1px solid ${COLOR_V2.BLUE_LIGHT_800}`,\n },\n '&:active': {\n backgroundColor: COLOR_V2.BLUE_LIGHT_700,\n },\n }),\n }),\n});\n\nexport const Button = ({showLoading, children, loadingColor = COLOR.WHITE, ...props}: ButtonProps) => (\n <button css={(theme: Theme) => buttonStyle(theme, props)} {...filterButtonProps(props)}>\n {showLoading ? <Loading size={30} color={loadingColor} style={{display: 'flex', margin: 'auto'}} /> : children}\n </button>\n);\n\nexport const filterButtonProps = (props: ButtonProps) => {\n return filterProps(filterTextProps(props) as ButtonProps, ['backgroundColor', 'noCapital']);\n};\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"ButtonLink.d.js","names":[],"sources":["ButtonLink.d.ts"],"sourcesContent":["/** @jsx jsx */\nimport { CSSObject, jsx } from '@emotion/react';\nimport { ButtonProps } from './Button';\nimport { Theme } from '../Layout';\nexport declare const buttonLinkStyle: (theme: Theme, props: ButtonProps<HTMLAnchorElement>) => CSSObject;\nexport declare const ButtonLink: ({ children, showLoading, loadingColor, ...props }: ButtonProps<HTMLAnchorElement>) => jsx.JSX.Element;\n"],"mappings":""}
|
package/src/Form/ButtonLink.js
CHANGED
|
@@ -1,54 +1,37 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
|
-
exports.
|
|
9
|
-
|
|
7
|
+
exports.buttonLinkStyle = exports.ButtonLink = void 0;
|
|
10
8
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
11
|
-
|
|
12
9
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
13
|
-
|
|
14
10
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
15
|
-
|
|
16
11
|
var _react = require("@emotion/react");
|
|
17
|
-
|
|
18
12
|
var _Misc = require("../Misc");
|
|
19
|
-
|
|
20
13
|
var _Identity = require("../Identity");
|
|
21
|
-
|
|
22
14
|
var _util = require("../util");
|
|
23
|
-
|
|
24
15
|
var _Text = require("../Text");
|
|
25
|
-
|
|
26
16
|
var _Button = require("./Button");
|
|
27
|
-
|
|
28
17
|
var _excluded = ["children", "showLoading", "loadingColor"];
|
|
29
|
-
|
|
30
|
-
function
|
|
31
|
-
|
|
32
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
33
|
-
|
|
18
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
19
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
34
20
|
var buttonLinkStyle = function buttonLinkStyle(theme, props) {
|
|
35
21
|
return _objectSpread(_objectSpread({}, (0, _Button.buttonStyle)(theme, props)), {}, {
|
|
36
22
|
display: 'inline-flex !important'
|
|
37
23
|
});
|
|
38
24
|
};
|
|
39
|
-
|
|
40
25
|
exports.buttonLinkStyle = buttonLinkStyle;
|
|
41
|
-
|
|
42
26
|
var filterButtonLinkProps = function filterButtonLinkProps(props) {
|
|
43
27
|
return (0, _util.filterProps)((0, _Text.filterTextProps)(props), ['backgroundColor', 'disabled', 'noCapital']);
|
|
44
28
|
};
|
|
45
|
-
|
|
46
29
|
var ButtonLink = function ButtonLink(_ref) {
|
|
47
30
|
var children = _ref.children,
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
31
|
+
showLoading = _ref.showLoading,
|
|
32
|
+
_ref$loadingColor = _ref.loadingColor,
|
|
33
|
+
loadingColor = _ref$loadingColor === void 0 ? _Identity.COLOR.WHITE : _ref$loadingColor,
|
|
34
|
+
props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
|
|
52
35
|
return (0, _react.jsx)("a", (0, _extends2["default"])({
|
|
53
36
|
css: function css(theme) {
|
|
54
37
|
return buttonLinkStyle(theme, props);
|
|
@@ -62,6 +45,5 @@ var ButtonLink = function ButtonLink(_ref) {
|
|
|
62
45
|
}
|
|
63
46
|
}) : children);
|
|
64
47
|
};
|
|
65
|
-
|
|
66
48
|
exports.ButtonLink = ButtonLink;
|
|
67
49
|
//# sourceMappingURL=ButtonLink.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"ButtonLink.js","names":["buttonLinkStyle","theme","props","buttonStyle","display","filterButtonLinkProps","filterProps","filterTextProps","ButtonLink","children","showLoading","loadingColor","COLOR","WHITE","margin"],"sources":["ButtonLink.tsx"],"sourcesContent":["/*\n * Wire\n * Copyright (C) 2018 Wire Swiss GmbH\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see http://www.gnu.org/licenses/.\n *\n */\n\n/** @jsx jsx */\nimport {CSSObject, jsx} from '@emotion/react';\n\nimport {Loading} from '../Misc';\nimport {COLOR} from '../Identity';\nimport {filterProps} from '../util';\nimport {filterTextProps} from '../Text';\nimport {ButtonProps, buttonStyle} from './Button';\nimport {Theme} from '../Layout';\n\nexport const buttonLinkStyle: (theme: Theme, props: ButtonProps<HTMLAnchorElement>) => CSSObject = (theme, props) => ({\n ...buttonStyle(theme, props),\n display: 'inline-flex !important',\n});\n\nconst filterButtonLinkProps = (props: ButtonProps<HTMLAnchorElement>) => {\n return filterProps(filterTextProps(props) as ButtonProps<HTMLAnchorElement>, [\n 'backgroundColor',\n 'disabled',\n 'noCapital',\n ]);\n};\n\nexport const ButtonLink = ({\n children,\n showLoading,\n loadingColor = COLOR.WHITE,\n ...props\n}: ButtonProps<HTMLAnchorElement>) => (\n <a css={(theme: Theme) => buttonLinkStyle(theme, props)} {...filterButtonLinkProps(props)}>\n {showLoading ? <Loading size={30} color={loadingColor} style={{display: 'flex', margin: 'auto'}} /> : children}\n </a>\n);\n"],"mappings":";;;;;;;;;;AAoBA;AAEA;AACA;AACA;AACA;AACA;AAAkD;AAAA;AAAA;AAG3C,IAAMA,eAAmF,GAAG,SAAtFA,eAAmF,CAAIC,KAAK,EAAEC,KAAK;EAAA,uCAC3G,IAAAC,mBAAW,EAACF,KAAK,EAAEC,KAAK,CAAC;IAC5BE,OAAO,EAAE;EAAwB;AAAA,CACjC;AAAC;AAEH,IAAMC,qBAAqB,GAAG,SAAxBA,qBAAqB,CAAIH,KAAqC,EAAK;EACvE,OAAO,IAAAI,iBAAW,EAAC,IAAAC,qBAAe,EAACL,KAAK,CAAC,EAAoC,CAC3E,iBAAiB,EACjB,UAAU,EACV,WAAW,CACZ,CAAC;AACJ,CAAC;AAEM,IAAMM,UAAU,GAAG,SAAbA,UAAU;EAAA,IACrBC,QAAQ,QAARA,QAAQ;IACRC,WAAW,QAAXA,WAAW;IAAA,yBACXC,YAAY;IAAZA,YAAY,kCAAGC,eAAK,CAACC,KAAK;IACvBX,KAAK;EAAA,OAER;IAAG,GAAG,EAAE,aAACD,KAAY;MAAA,OAAKD,eAAe,CAACC,KAAK,EAAEC,KAAK,CAAC;IAAA;EAAC,GAAKG,qBAAqB,CAACH,KAAK,CAAC,GACtFQ,WAAW,GAAG,gBAAC,aAAO;IAAC,IAAI,EAAE,EAAG;IAAC,KAAK,EAAEC,YAAa;IAAC,KAAK,EAAE;MAACP,OAAO,EAAE,MAAM;MAAEU,MAAM,EAAE;IAAM;EAAE,EAAG,GAAGL,QAAQ,CAC5G;AAAA,CACL;AAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"Checkbox.d.js","names":[],"sources":["Checkbox.d.ts"],"sourcesContent":["/** @jsx jsx */\nimport { jsx } from '@emotion/react';\nimport React from 'react';\nimport { TextProps } from '../Text';\nimport { InputProps } from './Input';\nexport interface StyledLabelProps<T = HTMLLabelElement> extends React.HTMLProps<T> {\n disabled?: boolean;\n markInvalid?: boolean;\n aligncenter?: boolean;\n labelBeforeCheckbox?: boolean;\n}\ninterface CheckboxProps<T = HTMLInputElement> extends InputProps<T> {\n id?: string;\n aligncenter?: boolean;\n labelBeforeCheckbox?: boolean;\n outlineOffset?: string;\n}\nexport declare const Checkbox: React.FC<CheckboxProps<HTMLInputElement>>;\nexport declare type CheckboxLabelProps<T = HTMLSpanElement> = TextProps<T>;\nexport declare const CheckboxLabel: ({ ...props }: CheckboxLabelProps) => jsx.JSX.Element;\nexport {};\n"],"mappings":""}
|
package/src/Form/Checkbox.js
CHANGED
|
@@ -1,52 +1,37 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
-
|
|
7
5
|
Object.defineProperty(exports, "__esModule", {
|
|
8
6
|
value: true
|
|
9
7
|
});
|
|
10
8
|
exports.CheckboxLabel = exports.Checkbox = void 0;
|
|
11
|
-
|
|
9
|
+
var _objectDestructuringEmpty2 = _interopRequireDefault(require("@babel/runtime/helpers/objectDestructuringEmpty"));
|
|
12
10
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
13
|
-
|
|
14
11
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
15
|
-
|
|
16
12
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
17
|
-
|
|
18
13
|
var _react = require("@emotion/react");
|
|
19
|
-
|
|
20
14
|
var _react2 = _interopRequireWildcard(require("react"));
|
|
21
|
-
|
|
22
15
|
var _Text = require("../Text");
|
|
23
|
-
|
|
24
16
|
var _Input = require("./Input");
|
|
25
|
-
|
|
26
17
|
var _excluded = ["disabled", "markInvalid", "aligncenter", "labelBeforeCheckbox", "children"],
|
|
27
|
-
|
|
28
|
-
|
|
18
|
+
_excluded2 = ["id", "children", "style", "disabled", "wrapperCSS", "markInvalid", "aligncenter", "labelBeforeCheckbox", "outlineOffset"];
|
|
29
19
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
30
|
-
|
|
31
20
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
32
|
-
|
|
33
|
-
function
|
|
34
|
-
|
|
35
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
36
|
-
|
|
21
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
22
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
37
23
|
var StyledLabel = function StyledLabel(_ref) {
|
|
38
24
|
var disabled = _ref.disabled,
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
25
|
+
markInvalid = _ref.markInvalid,
|
|
26
|
+
_ref$aligncenter = _ref.aligncenter,
|
|
27
|
+
aligncenter = _ref$aligncenter === void 0 ? false : _ref$aligncenter,
|
|
28
|
+
_ref$labelBeforeCheck = _ref.labelBeforeCheckbox,
|
|
29
|
+
labelBeforeCheckbox = _ref$labelBeforeCheck === void 0 ? false : _ref$labelBeforeCheck,
|
|
30
|
+
children = _ref.children,
|
|
31
|
+
props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
|
|
46
32
|
return (0, _react.jsx)("label", (0, _extends2["default"])({
|
|
47
33
|
css: function css(theme) {
|
|
48
34
|
var _objectSpread2;
|
|
49
|
-
|
|
50
35
|
return _objectSpread(_objectSpread(_objectSpread((_objectSpread2 = {}, (0, _defineProperty2["default"])(_objectSpread2, ".".concat(_Input.INPUT_CLASSNAME, ":checked + &::before"), {
|
|
51
36
|
background: "".concat(disabled ? theme.Checkbox.disablecheckedBgColor : theme.general.primaryColor),
|
|
52
37
|
borderColor: theme.general.primaryColor
|
|
@@ -103,21 +88,20 @@ var StyledLabel = function StyledLabel(_ref) {
|
|
|
103
88
|
d: "M5.65685 12.0711L15.9842 1.62738L14.57 0.213167L5.65685 9.24264L1.41421 5L0 6.41421L5.65685 12.0711Z"
|
|
104
89
|
})));
|
|
105
90
|
};
|
|
106
|
-
|
|
107
91
|
var Checkbox = /*#__PURE__*/_react2["default"].forwardRef(function (_ref3, ref) {
|
|
108
92
|
var _ref3$id = _ref3.id,
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
93
|
+
id = _ref3$id === void 0 ? (0, _react2.useId)() : _ref3$id,
|
|
94
|
+
children = _ref3.children,
|
|
95
|
+
style = _ref3.style,
|
|
96
|
+
disabled = _ref3.disabled,
|
|
97
|
+
_ref3$wrapperCSS = _ref3.wrapperCSS,
|
|
98
|
+
wrapperCSS = _ref3$wrapperCSS === void 0 ? {} : _ref3$wrapperCSS,
|
|
99
|
+
markInvalid = _ref3.markInvalid,
|
|
100
|
+
aligncenter = _ref3.aligncenter,
|
|
101
|
+
labelBeforeCheckbox = _ref3.labelBeforeCheckbox,
|
|
102
|
+
_ref3$outlineOffset = _ref3.outlineOffset,
|
|
103
|
+
outlineOffset = _ref3$outlineOffset === void 0 ? '0.4rem' : _ref3$outlineOffset,
|
|
104
|
+
props = (0, _objectWithoutProperties2["default"])(_ref3, _excluded2);
|
|
121
105
|
return (0, _react.jsx)("div", {
|
|
122
106
|
css: function css(theme) {
|
|
123
107
|
return _objectSpread((0, _defineProperty2["default"])({
|
|
@@ -153,17 +137,14 @@ var Checkbox = /*#__PURE__*/_react2["default"].forwardRef(function (_ref3, ref)
|
|
|
153
137
|
labelBeforeCheckbox: labelBeforeCheckbox
|
|
154
138
|
}, children));
|
|
155
139
|
});
|
|
156
|
-
|
|
157
140
|
exports.Checkbox = Checkbox;
|
|
158
|
-
|
|
159
141
|
var CheckboxLabel = function CheckboxLabel(_ref4) {
|
|
160
|
-
var props = (0, _extends2["default"])({}, _ref4);
|
|
142
|
+
var props = (0, _extends2["default"])({}, ((0, _objectDestructuringEmpty2["default"])(_ref4), _ref4));
|
|
161
143
|
return (0, _react.jsx)(_Text.Text, (0, _extends2["default"])({
|
|
162
144
|
css: function css(theme) {
|
|
163
145
|
return _objectSpread({}, (0, _Text.textStyle)(theme, _objectSpread({}, props)));
|
|
164
146
|
}
|
|
165
147
|
}, props));
|
|
166
148
|
};
|
|
167
|
-
|
|
168
149
|
exports.CheckboxLabel = CheckboxLabel;
|
|
169
150
|
//# sourceMappingURL=Checkbox.js.map
|
package/src/Form/Checkbox.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Checkbox.tsx"],"names":["StyledLabel","disabled","markInvalid","aligncenter","labelBeforeCheckbox","children","props","theme","INPUT_CLASSNAME","background","Checkbox","disablecheckedBgColor","general","primaryColor","borderColor","fill","backgroundColor","position","top","transform","right","left","disableBgColor","border","invalidBorderColor","disableBorderColor","borderRadius","boxSizing","content","display","width","height","lineHeight","margin","color","flexDirection","justifyContent","alignItems","opacity","cursor","React","forwardRef","ref","id","style","wrapperCSS","outlineOffset","outline","marginBottom","CheckboxLabel"],"mappings":"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","sourcesContent":["/*\n * Wire\n * Copyright (C) 2018 Wire Swiss GmbH\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see http://www.gnu.org/licenses/.\n *\n */\n\n/** @jsx jsx */\nimport {jsx} from '@emotion/react';\nimport React, {useId} from 'react';\n\nimport {Theme} from '../Layout';\nimport {Text, TextProps, textStyle} from '../Text';\nimport {INPUT_CLASSNAME, InputProps} from './Input';\n\nexport interface StyledLabelProps<T = HTMLLabelElement> extends React.HTMLProps<T> {\n disabled?: boolean;\n markInvalid?: boolean;\n aligncenter?: boolean;\n labelBeforeCheckbox?: boolean;\n}\n\nconst StyledLabel = ({\n disabled,\n markInvalid,\n aligncenter = false,\n labelBeforeCheckbox = false,\n children,\n ...props\n}: StyledLabelProps) => {\n return (\n <label\n css={(theme: Theme) => ({\n [`.${INPUT_CLASSNAME}:checked + &::before`]: {\n background: `${disabled ? theme.Checkbox.disablecheckedBgColor : theme.general.primaryColor}`,\n borderColor: theme.general.primaryColor,\n },\n [`.${INPUT_CLASSNAME}:checked + & > svg`]: {\n fill: theme.general.backgroundColor,\n },\n [`.${INPUT_CLASSNAME} + & > svg`]: {\n fill: 'none',\n position: 'absolute',\n top: '50%',\n transform: 'translateY(-50%)',\n ...(labelBeforeCheckbox\n ? {\n right: '0.75rem',\n }\n : {\n left: '0.25rem',\n }),\n },\n ...(!disabled && {\n [`.${INPUT_CLASSNAME}:hover + &::before`]: {\n borderColor: theme.general.primaryColor,\n },\n }),\n [`.${INPUT_CLASSNAME} + &::before`]: {\n background: disabled ? theme.Checkbox.disableBgColor : theme.Checkbox.background,\n ...(!disabled\n ? {\n border: markInvalid\n ? `2px solid ${theme.Checkbox.invalidBorderColor}`\n : `2px solid ${theme.Checkbox.border}`,\n }\n : {\n border: `2px solid ${theme.Checkbox.disableBorderColor}`,\n }),\n borderRadius: '3px',\n boxSizing: 'border-box',\n content: '\"\"',\n display: 'inline-block',\n width: '22px',\n height: '22px',\n lineHeight: 1.4,\n margin: '0 8px 0 0px',\n color: theme.general.color,\n },\n ...(labelBeforeCheckbox && {\n flexDirection: 'row-reverse',\n justifyContent: 'space-between',\n }),\n alignItems: 'center',\n position: 'relative',\n margin: '0 0 0 -16px',\n width: aligncenter ? 'auto' : '100%',\n lineHeight: 1.4,\n display: 'flex',\n opacity: disabled ? 0.56 : 1,\n cursor: disabled ? 'not-allowed' : 'pointer',\n borderRadius: '4px',\n })}\n {...props}\n >\n {children}\n <svg width=\"15\" height=\"13\" viewBox=\"0 0 16 13\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M5.65685 12.0711L15.9842 1.62738L14.57 0.213167L5.65685 9.24264L1.41421 5L0 6.41421L5.65685 12.0711Z\" />\n </svg>\n </label>\n );\n};\n\ninterface CheckboxProps<T = HTMLInputElement> extends InputProps<T> {\n id?: string;\n aligncenter?: boolean;\n labelBeforeCheckbox?: boolean;\n outlineOffset?: string;\n}\n\nexport const Checkbox: React.FC<CheckboxProps<HTMLInputElement>> = React.forwardRef<\n HTMLInputElement,\n CheckboxProps<HTMLInputElement>\n>(\n (\n {\n id = useId(),\n children,\n style,\n disabled,\n wrapperCSS = {},\n markInvalid,\n aligncenter,\n labelBeforeCheckbox,\n outlineOffset = '0.4rem',\n ...props\n },\n ref,\n ) => (\n <div\n css={(theme: Theme) => ({\n alignItems: 'center',\n display: 'flex',\n justifyContent: 'flex-start',\n position: 'relative',\n left: '-0.3rem',\n [`.${INPUT_CLASSNAME}:focus-visible + label`]: {\n outline: `1px solid ${theme.general.primaryColor}`,\n outlineOffset: outlineOffset,\n },\n ...wrapperCSS,\n })}\n style={style}\n >\n <input\n type=\"checkbox\"\n id={id}\n style={{\n height: '22px',\n marginBottom: '0',\n opacity: 0,\n width: '22px',\n cursor: disabled ? 'not-allowed' : 'pointer',\n }}\n disabled={disabled}\n ref={ref}\n className={INPUT_CLASSNAME}\n {...props}\n />\n\n <StyledLabel\n htmlFor={id}\n disabled={disabled}\n markInvalid={markInvalid}\n aligncenter={aligncenter}\n labelBeforeCheckbox={labelBeforeCheckbox}\n >\n {children}\n </StyledLabel>\n </div>\n ),\n);\n\nexport type CheckboxLabelProps<T = HTMLSpanElement> = TextProps<T>;\n\nexport const CheckboxLabel = ({...props}: CheckboxLabelProps) => (\n <Text\n css={(theme: Theme) => ({\n ...textStyle(theme, {\n ...props,\n }),\n })}\n {...props}\n />\n);\n"],"file":"Checkbox.js"}
|
|
1
|
+
{"version":3,"file":"Checkbox.js","names":["StyledLabel","disabled","markInvalid","aligncenter","labelBeforeCheckbox","children","props","theme","INPUT_CLASSNAME","background","Checkbox","disablecheckedBgColor","general","primaryColor","borderColor","fill","backgroundColor","position","top","transform","right","left","disableBgColor","border","invalidBorderColor","disableBorderColor","borderRadius","boxSizing","content","display","width","height","lineHeight","margin","color","flexDirection","justifyContent","alignItems","opacity","cursor","React","forwardRef","ref","id","useId","style","wrapperCSS","outlineOffset","outline","marginBottom","CheckboxLabel","textStyle"],"sources":["Checkbox.tsx"],"sourcesContent":["/*\n * Wire\n * Copyright (C) 2018 Wire Swiss GmbH\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see http://www.gnu.org/licenses/.\n *\n */\n\n/** @jsx jsx */\nimport {jsx} from '@emotion/react';\nimport React, {useId} from 'react';\n\nimport {Theme} from '../Layout';\nimport {Text, TextProps, textStyle} from '../Text';\nimport {INPUT_CLASSNAME, InputProps} from './Input';\n\nexport interface StyledLabelProps<T = HTMLLabelElement> extends React.HTMLProps<T> {\n disabled?: boolean;\n markInvalid?: boolean;\n aligncenter?: boolean;\n labelBeforeCheckbox?: boolean;\n}\n\nconst StyledLabel = ({\n disabled,\n markInvalid,\n aligncenter = false,\n labelBeforeCheckbox = false,\n children,\n ...props\n}: StyledLabelProps) => {\n return (\n <label\n css={(theme: Theme) => ({\n [`.${INPUT_CLASSNAME}:checked + &::before`]: {\n background: `${disabled ? theme.Checkbox.disablecheckedBgColor : theme.general.primaryColor}`,\n borderColor: theme.general.primaryColor,\n },\n [`.${INPUT_CLASSNAME}:checked + & > svg`]: {\n fill: theme.general.backgroundColor,\n },\n [`.${INPUT_CLASSNAME} + & > svg`]: {\n fill: 'none',\n position: 'absolute',\n top: '50%',\n transform: 'translateY(-50%)',\n ...(labelBeforeCheckbox\n ? {\n right: '0.75rem',\n }\n : {\n left: '0.25rem',\n }),\n },\n ...(!disabled && {\n [`.${INPUT_CLASSNAME}:hover + &::before`]: {\n borderColor: theme.general.primaryColor,\n },\n }),\n [`.${INPUT_CLASSNAME} + &::before`]: {\n background: disabled ? theme.Checkbox.disableBgColor : theme.Checkbox.background,\n ...(!disabled\n ? {\n border: markInvalid\n ? `2px solid ${theme.Checkbox.invalidBorderColor}`\n : `2px solid ${theme.Checkbox.border}`,\n }\n : {\n border: `2px solid ${theme.Checkbox.disableBorderColor}`,\n }),\n borderRadius: '3px',\n boxSizing: 'border-box',\n content: '\"\"',\n display: 'inline-block',\n width: '22px',\n height: '22px',\n lineHeight: 1.4,\n margin: '0 8px 0 0px',\n color: theme.general.color,\n },\n ...(labelBeforeCheckbox && {\n flexDirection: 'row-reverse',\n justifyContent: 'space-between',\n }),\n alignItems: 'center',\n position: 'relative',\n margin: '0 0 0 -16px',\n width: aligncenter ? 'auto' : '100%',\n lineHeight: 1.4,\n display: 'flex',\n opacity: disabled ? 0.56 : 1,\n cursor: disabled ? 'not-allowed' : 'pointer',\n borderRadius: '4px',\n })}\n {...props}\n >\n {children}\n <svg width=\"15\" height=\"13\" viewBox=\"0 0 16 13\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M5.65685 12.0711L15.9842 1.62738L14.57 0.213167L5.65685 9.24264L1.41421 5L0 6.41421L5.65685 12.0711Z\" />\n </svg>\n </label>\n );\n};\n\ninterface CheckboxProps<T = HTMLInputElement> extends InputProps<T> {\n id?: string;\n aligncenter?: boolean;\n labelBeforeCheckbox?: boolean;\n outlineOffset?: string;\n}\n\nexport const Checkbox: React.FC<CheckboxProps<HTMLInputElement>> = React.forwardRef<\n HTMLInputElement,\n CheckboxProps<HTMLInputElement>\n>(\n (\n {\n id = useId(),\n children,\n style,\n disabled,\n wrapperCSS = {},\n markInvalid,\n aligncenter,\n labelBeforeCheckbox,\n outlineOffset = '0.4rem',\n ...props\n },\n ref,\n ) => (\n <div\n css={(theme: Theme) => ({\n alignItems: 'center',\n display: 'flex',\n justifyContent: 'flex-start',\n position: 'relative',\n left: '-0.3rem',\n [`.${INPUT_CLASSNAME}:focus-visible + label`]: {\n outline: `1px solid ${theme.general.primaryColor}`,\n outlineOffset: outlineOffset,\n },\n ...wrapperCSS,\n })}\n style={style}\n >\n <input\n type=\"checkbox\"\n id={id}\n style={{\n height: '22px',\n marginBottom: '0',\n opacity: 0,\n width: '22px',\n cursor: disabled ? 'not-allowed' : 'pointer',\n }}\n disabled={disabled}\n ref={ref}\n className={INPUT_CLASSNAME}\n {...props}\n />\n\n <StyledLabel\n htmlFor={id}\n disabled={disabled}\n markInvalid={markInvalid}\n aligncenter={aligncenter}\n labelBeforeCheckbox={labelBeforeCheckbox}\n >\n {children}\n </StyledLabel>\n </div>\n ),\n);\n\nexport type CheckboxLabelProps<T = HTMLSpanElement> = TextProps<T>;\n\nexport const CheckboxLabel = ({...props}: CheckboxLabelProps) => (\n <Text\n css={(theme: Theme) => ({\n ...textStyle(theme, {\n ...props,\n }),\n })}\n {...props}\n />\n);\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"CodeInput.d.js","names":[],"sources":["CodeInput.d.ts"],"sourcesContent":["/** @jsx jsx */\nimport { jsx } from '@emotion/react';\nimport { InputProps } from './Input';\nexport interface CodeInputProps<T = HTMLInputElement> extends InputProps<T> {\n autoFocus?: boolean;\n digits?: number;\n markInvalid?: boolean;\n onCodeComplete?: (completeCode?: string) => void;\n}\nexport declare const CodeInput: ({ style, digits, autoFocus, markInvalid, onCodeComplete, disabled, }: CodeInputProps) => jsx.JSX.Element;\n"],"mappings":""}
|