@wireapp/react-ui-kit 8.14.0 → 8.14.1
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 +3 -3
- package/src/Form/Button.js +125 -210
- package/src/Form/Button.js.map +1 -1
- package/src/Form/ButtonLink.js +47 -60
- package/src/Form/ButtonLink.js.map +1 -1
- package/src/Form/Checkbox.js +84 -139
- package/src/Form/Checkbox.js.map +1 -1
- package/src/Form/CodeInput.js +98 -201
- package/src/Form/CodeInput.js.map +1 -1
- package/src/Form/DropFileInput.js +116 -214
- package/src/Form/DropFileInput.js.map +1 -1
- package/src/Form/ErrorMessage.js +45 -78
- package/src/Form/ErrorMessage.js.map +1 -1
- package/src/Form/Form.d.ts +0 -1
- package/src/Form/Form.js +28 -31
- package/src/Form/Form.js.map +1 -1
- package/src/Form/Input.js +101 -178
- package/src/Form/Input.js.map +1 -1
- package/src/Form/InputBlock.d.ts +1 -1
- package/src/Form/InputBlock.js +19 -45
- package/src/Form/InputBlock.js.map +1 -1
- package/src/Form/InputLabel.js +44 -46
- package/src/Form/InputLabel.js.map +1 -1
- package/src/Form/InputSubmitCombo.js +49 -53
- package/src/Form/InputSubmitCombo.js.map +1 -1
- package/src/Form/RangeInput.js +47 -71
- package/src/Form/RangeInput.js.map +1 -1
- package/src/Form/RangeInput.styles.js +39 -55
- package/src/Form/RangeInput.styles.js.map +1 -1
- package/src/Form/RoundIconButton.js +42 -62
- package/src/Form/RoundIconButton.js.map +1 -1
- package/src/Form/Select.js +55 -95
- package/src/Form/Select.js.map +1 -1
- package/src/Form/SelectComponents.js +101 -173
- package/src/Form/SelectComponents.js.map +1 -1
- package/src/Form/SelectStyles.d.ts +1 -899
- package/src/Form/SelectStyles.js +96 -156
- package/src/Form/SelectStyles.js.map +1 -1
- package/src/Form/ShakeBox.d.ts +1 -1
- package/src/Form/ShakeBox.js +33 -81
- package/src/Form/ShakeBox.js.map +1 -1
- package/src/Form/Switch.js +89 -124
- package/src/Form/Switch.js.map +1 -1
- package/src/Form/TextArea.js +59 -80
- package/src/Form/TextArea.js.map +1 -1
- package/src/Form/Tooltip.js +66 -75
- package/src/Form/Tooltip.js.map +1 -1
- package/src/Form/index.js +52 -238
- package/src/Form/index.js.map +1 -1
- package/src/GlobalCssVariables.js +79 -96
- package/src/GlobalCssVariables.js.map +1 -1
- package/src/GlobalStyle.d.js +0 -2
- package/src/GlobalStyle.d.js.map +1 -1
- package/src/GlobalStyle.d.ts +1 -2
- package/src/GlobalStyle.js +40 -55
- package/src/GlobalStyle.js.map +1 -1
- package/src/Icon/AddPeopleIcon.js +19 -24
- package/src/Icon/AddPeopleIcon.js.map +1 -1
- package/src/Icon/ArchiveIcon.js +6 -24
- package/src/Icon/ArchiveIcon.js.map +1 -1
- package/src/Icon/ArrowDown.js +19 -23
- package/src/Icon/ArrowDown.js.map +1 -1
- package/src/Icon/ArrowIcon.js +42 -35
- package/src/Icon/ArrowIcon.js.map +1 -1
- package/src/Icon/AttachmentIcon.js +6 -24
- package/src/Icon/AttachmentIcon.js.map +1 -1
- package/src/Icon/AudioVideoIcon.js +6 -24
- package/src/Icon/AudioVideoIcon.js.map +1 -1
- package/src/Icon/BlockIcon.js +6 -24
- package/src/Icon/BlockIcon.js.map +1 -1
- package/src/Icon/Brand/AndroidIcon.js +6 -25
- package/src/Icon/Brand/AndroidIcon.js.map +1 -1
- package/src/Icon/Brand/AppleIcon.js +6 -25
- package/src/Icon/Brand/AppleIcon.js.map +1 -1
- package/src/Icon/Brand/ChromeIcon.js +6 -25
- package/src/Icon/Brand/ChromeIcon.js.map +1 -1
- package/src/Icon/Brand/FacebookIcon.js +6 -24
- package/src/Icon/Brand/FacebookIcon.js.map +1 -1
- package/src/Icon/Brand/GitHubIcon.js +6 -24
- package/src/Icon/Brand/GitHubIcon.js.map +1 -1
- package/src/Icon/Brand/LinkedInIcon.js +6 -24
- package/src/Icon/Brand/LinkedInIcon.js.map +1 -1
- package/src/Icon/Brand/LinuxIcon.js +6 -25
- package/src/Icon/Brand/LinuxIcon.js.map +1 -1
- package/src/Icon/Brand/MicrosoftIcon.js +6 -25
- package/src/Icon/Brand/MicrosoftIcon.js.map +1 -1
- package/src/Icon/Brand/TwitterIcon.js +6 -24
- package/src/Icon/Brand/TwitterIcon.js.map +1 -1
- package/src/Icon/CallIcon.js +6 -24
- package/src/Icon/CallIcon.js.map +1 -1
- package/src/Icon/CamIcon.js +6 -24
- package/src/Icon/CamIcon.js.map +1 -1
- package/src/Icon/CameraIcon.js +19 -24
- package/src/Icon/CameraIcon.js.map +1 -1
- package/src/Icon/CheckIcon.js +6 -24
- package/src/Icon/CheckIcon.js.map +1 -1
- package/src/Icon/CheckRoundIcon.js +6 -24
- package/src/Icon/CheckRoundIcon.js.map +1 -1
- package/src/Icon/ChevronIcon.js +38 -31
- package/src/Icon/ChevronIcon.js.map +1 -1
- package/src/Icon/CloseIcon.js +6 -24
- package/src/Icon/CloseIcon.js.map +1 -1
- package/src/Icon/CopyIcon.js +6 -24
- package/src/Icon/CopyIcon.js.map +1 -1
- package/src/Icon/DeviceIcon.js +6 -24
- package/src/Icon/DeviceIcon.js.map +1 -1
- package/src/Icon/DownloadIcon.js +6 -24
- package/src/Icon/DownloadIcon.js.map +1 -1
- package/src/Icon/EditDocumentIcon.js +19 -25
- package/src/Icon/EditDocumentIcon.js.map +1 -1
- package/src/Icon/EditIcon.js +6 -24
- package/src/Icon/EditIcon.js.map +1 -1
- package/src/Icon/EnterIcon.js +6 -24
- package/src/Icon/EnterIcon.js.map +1 -1
- package/src/Icon/ErrorIcon.js +9 -39
- package/src/Icon/ErrorIcon.js.map +1 -1
- package/src/Icon/FileIcon.js +6 -24
- package/src/Icon/FileIcon.js.map +1 -1
- package/src/Icon/GifIcon.js +6 -24
- package/src/Icon/GifIcon.js.map +1 -1
- package/src/Icon/GridIcon.js +19 -24
- package/src/Icon/GridIcon.js.map +1 -1
- package/src/Icon/GroupIcon.js +6 -24
- package/src/Icon/GroupIcon.js.map +1 -1
- package/src/Icon/HangupIcon.js +6 -24
- package/src/Icon/HangupIcon.js.map +1 -1
- package/src/Icon/HideIcon.js +6 -24
- package/src/Icon/HideIcon.js.map +1 -1
- package/src/Icon/ImageIcon.js +6 -24
- package/src/Icon/ImageIcon.js.map +1 -1
- package/src/Icon/InfoIcon.js +6 -24
- package/src/Icon/InfoIcon.js.map +1 -1
- package/src/Icon/InviteIcon.js +6 -24
- package/src/Icon/InviteIcon.js.map +1 -1
- package/src/Icon/LeaveIcon.js +6 -24
- package/src/Icon/LeaveIcon.js.map +1 -1
- package/src/Icon/LinkIcon.js +19 -24
- package/src/Icon/LinkIcon.js.map +1 -1
- package/src/Icon/ListIcon.js +6 -24
- package/src/Icon/ListIcon.js.map +1 -1
- package/src/Icon/LockIcon.js +6 -25
- package/src/Icon/LockIcon.js.map +1 -1
- package/src/Icon/MessageIcon.js +6 -24
- package/src/Icon/MessageIcon.js.map +1 -1
- package/src/Icon/MinusIcon.js +6 -24
- package/src/Icon/MinusIcon.js.map +1 -1
- package/src/Icon/MoreIcon.js +6 -24
- package/src/Icon/MoreIcon.js.map +1 -1
- package/src/Icon/MuteIcon.js +6 -24
- package/src/Icon/MuteIcon.js.map +1 -1
- package/src/Icon/NotificationIcon.js +6 -24
- package/src/Icon/NotificationIcon.js.map +1 -1
- package/src/Icon/NotificationOffIcon.js +6 -24
- package/src/Icon/NotificationOffIcon.js.map +1 -1
- package/src/Icon/OptionsIcon.js +6 -24
- package/src/Icon/OptionsIcon.js.map +1 -1
- package/src/Icon/PeopleIcon.js +19 -24
- package/src/Icon/PeopleIcon.js.map +1 -1
- package/src/Icon/PingIcon.js +6 -24
- package/src/Icon/PingIcon.js.map +1 -1
- package/src/Icon/PlaneIcon.js +6 -24
- package/src/Icon/PlaneIcon.js.map +1 -1
- package/src/Icon/PlusIcon.js +6 -24
- package/src/Icon/PlusIcon.js.map +1 -1
- package/src/Icon/ProfileIcon.js +6 -24
- package/src/Icon/ProfileIcon.js.map +1 -1
- package/src/Icon/RecordBoldIcon.js +43 -50
- package/src/Icon/RecordBoldIcon.js.map +1 -1
- package/src/Icon/RecordIcon.js +8 -34
- package/src/Icon/RecordIcon.js.map +1 -1
- package/src/Icon/RecordPendingIcon.js +8 -31
- package/src/Icon/RecordPendingIcon.js.map +1 -1
- package/src/Icon/ReloadIcon.js +6 -24
- package/src/Icon/ReloadIcon.js.map +1 -1
- package/src/Icon/SVGIcon.js +53 -78
- package/src/Icon/SVGIcon.js.map +1 -1
- package/src/Icon/ScreenshareIcon.js +6 -24
- package/src/Icon/ScreenshareIcon.js.map +1 -1
- package/src/Icon/SearchIcon.js +6 -25
- package/src/Icon/SearchIcon.js.map +1 -1
- package/src/Icon/ServicesIcon.js +6 -24
- package/src/Icon/ServicesIcon.js.map +1 -1
- package/src/Icon/SettingsIcon.js +6 -24
- package/src/Icon/SettingsIcon.js.map +1 -1
- package/src/Icon/ShowIcon.js +6 -24
- package/src/Icon/ShowIcon.js.map +1 -1
- package/src/Icon/SignIcon.js +6 -24
- package/src/Icon/SignIcon.js.map +1 -1
- package/src/Icon/SpeakerIcon.js +6 -24
- package/src/Icon/SpeakerIcon.js.map +1 -1
- package/src/Icon/SupportIcon.js +6 -24
- package/src/Icon/SupportIcon.js.map +1 -1
- package/src/Icon/TeamIcon.js +6 -24
- package/src/Icon/TeamIcon.js.map +1 -1
- package/src/Icon/TimedIcon.js +6 -24
- package/src/Icon/TimedIcon.js.map +1 -1
- package/src/Icon/TrashCrossIcon.js +6 -24
- package/src/Icon/TrashCrossIcon.js.map +1 -1
- package/src/Icon/TrashIcon.js +6 -24
- package/src/Icon/TrashIcon.js.map +1 -1
- package/src/Icon/TriangleIcon.js +42 -35
- package/src/Icon/TriangleIcon.js.map +1 -1
- package/src/Icon/UploadIcon.js +6 -24
- package/src/Icon/UploadIcon.js.map +1 -1
- package/src/Icon/WireIcon.js +6 -24
- package/src/Icon/WireIcon.js.map +1 -1
- package/src/Icon/index.js +107 -953
- package/src/Icon/index.js.map +1 -1
- package/src/Identity/Animation.js +88 -211
- package/src/Identity/Animation.js.map +1 -1
- package/src/Identity/Avatar.js +66 -114
- package/src/Identity/Avatar.js.map +1 -1
- package/src/Identity/AvatarGrid.js +66 -108
- package/src/Identity/AvatarGrid.js.map +1 -1
- package/src/Identity/Logo.js +45 -54
- package/src/Identity/Logo.js.map +1 -1
- package/src/Identity/colors-v2.js +163 -186
- package/src/Identity/colors-v2.js.map +1 -1
- package/src/Identity/colors.js +64 -80
- package/src/Identity/colors.js.map +1 -1
- package/src/Identity/index.js +38 -81
- package/src/Identity/index.js.map +1 -1
- package/src/Identity/motions.js +71 -35
- package/src/Identity/motions.js.map +1 -1
- package/src/Layout/Box.d.ts +1 -1
- package/src/Layout/Box.js +9 -31
- package/src/Layout/Box.js.map +1 -1
- package/src/Layout/Column.d.ts +1 -1
- package/src/Layout/Column.js +17 -57
- package/src/Layout/Column.js.map +1 -1
- package/src/Layout/Container.d.ts +5 -5
- package/src/Layout/Container.js +29 -102
- package/src/Layout/Container.js.map +1 -1
- package/src/Layout/Content.d.ts +1 -1
- package/src/Layout/Content.js +8 -31
- package/src/Layout/Content.js.map +1 -1
- package/src/Layout/FlexBox.js +10 -45
- package/src/Layout/FlexBox.js.map +1 -1
- package/src/Layout/Footer.d.ts +1 -4
- package/src/Layout/Footer.js +4 -17
- package/src/Layout/Footer.js.map +1 -1
- package/src/Layout/Header.d.ts +1 -1
- package/src/Layout/Header.js +7 -28
- package/src/Layout/Header.js.map +1 -1
- package/src/Layout/MatchMedia.js +27 -112
- package/src/Layout/MatchMedia.js.map +1 -1
- package/src/Layout/Spacer.js +6 -26
- package/src/Layout/Spacer.js.map +1 -1
- package/src/Layout/StyledApp.js +45 -53
- package/src/Layout/StyledApp.js.map +1 -1
- package/src/Layout/Theme.js +217 -225
- package/src/Layout/Theme.js.map +1 -1
- package/src/Layout/headerMenu/HeaderMenu.js +54 -117
- package/src/Layout/headerMenu/HeaderMenu.js.map +1 -1
- package/src/Layout/headerMenu/HeaderSubMenu.d.ts +1 -1
- package/src/Layout/headerMenu/HeaderSubMenu.js +74 -131
- package/src/Layout/headerMenu/HeaderSubMenu.js.map +1 -1
- package/src/Layout/headerMenu/MenuContent.js +26 -47
- package/src/Layout/headerMenu/MenuContent.js.map +1 -1
- package/src/Layout/headerMenu/MenuItems.js +22 -52
- package/src/Layout/headerMenu/MenuItems.js.map +1 -1
- package/src/Layout/headerMenu/MenuLink.js +65 -89
- package/src/Layout/headerMenu/MenuLink.js.map +1 -1
- package/src/Layout/headerMenu/MenuOpenButton.js +26 -54
- package/src/Layout/headerMenu/MenuOpenButton.js.map +1 -1
- package/src/Layout/headerMenu/MenuScrollableItems.js +13 -36
- package/src/Layout/headerMenu/MenuScrollableItems.js.map +1 -1
- package/src/Layout/headerMenu/MenuSubLink.js +45 -64
- package/src/Layout/headerMenu/MenuSubLink.js.map +1 -1
- package/src/Layout/headerMenu/index.js +41 -108
- package/src/Layout/headerMenu/index.js.map +1 -1
- package/src/Layout/index.js +46 -173
- package/src/Layout/index.js.map +1 -1
- package/src/Layout/sizes.js +14 -21
- package/src/Layout/sizes.js.map +1 -1
- package/src/Menu/MenuModal.js +78 -123
- package/src/Menu/MenuModal.js.map +1 -1
- package/src/Menu/TabBar.d.ts +1 -1
- package/src/Menu/TabBar.js +50 -96
- package/src/Menu/TabBar.js.map +1 -1
- package/src/Menu/index.js +34 -29
- package/src/Menu/index.js.map +1 -1
- package/src/Misc/ButtonGroup.js +67 -97
- package/src/Misc/ButtonGroup.js.map +1 -1
- package/src/Misc/IconButton.js +72 -102
- package/src/Misc/IconButton.js.map +1 -1
- package/src/Misc/IsInViewport.js +57 -63
- package/src/Misc/IsInViewport.js.map +1 -1
- package/src/Misc/Loading.d.ts +1 -1
- package/src/Misc/Loading.js +58 -66
- package/src/Misc/Loading.js.map +1 -1
- package/src/Misc/Pagination.js +64 -149
- package/src/Misc/Pagination.js.map +1 -1
- package/src/Misc/Pill.js +66 -80
- package/src/Misc/Pill.js.map +1 -1
- package/src/Misc/childrenWithDefaultProps.d.ts +1 -1
- package/src/Misc/childrenWithDefaultProps.js +28 -28
- package/src/Misc/childrenWithDefaultProps.js.map +1 -1
- package/src/Misc/index.js +42 -121
- package/src/Misc/index.js.map +1 -1
- package/src/Misc/useLongTouch.js +23 -38
- package/src/Misc/useLongTouch.js.map +1 -1
- package/src/Misc/useTimeout.js +24 -44
- package/src/Misc/useTimeout.js.map +1 -1
- package/src/Modal/Modal.js +95 -177
- package/src/Modal/Modal.js.map +1 -1
- package/src/Modal/Overlay.d.ts +2 -2
- package/src/Modal/Overlay.js +68 -92
- package/src/Modal/Overlay.js.map +1 -1
- package/src/Modal/index.js +36 -28
- package/src/Modal/index.js.map +1 -1
- package/src/Text/Heading.js +71 -188
- package/src/Text/Heading.js.map +1 -1
- package/src/Text/Label.js +45 -74
- package/src/Text/Label.js.map +1 -1
- package/src/Text/Line.js +11 -36
- package/src/Text/Line.js.map +1 -1
- package/src/Text/Link.js +60 -88
- package/src/Text/Link.js.map +1 -1
- package/src/Text/Paragraph.js +44 -75
- package/src/Text/Paragraph.js.map +1 -1
- package/src/Text/Text.d.ts +6 -6
- package/src/Text/Text.js +29 -107
- package/src/Text/Text.js.map +1 -1
- package/src/Text/TextLink.js +38 -52
- package/src/Text/TextLink.js.map +1 -1
- package/src/Text/Title.js +38 -55
- package/src/Text/Title.js.map +1 -1
- package/src/Text/index.js +41 -108
- package/src/Text/index.js.map +1 -1
- package/src/index.js +42 -121
- package/src/index.js.map +1 -1
- package/src/mediaQueries.js +40 -41
- package/src/mediaQueries.js.map +1 -1
- package/src/util.js +8 -39
- package/src/util.js.map +1 -1
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"dependencies": {
|
|
3
3
|
"@emotion/react": "11.9.0",
|
|
4
|
-
"bazinga64": "5.11.
|
|
4
|
+
"bazinga64": "5.11.1",
|
|
5
5
|
"color": "3.1.3",
|
|
6
6
|
"emotion-normalize": "11.0.1",
|
|
7
7
|
"react-select": "5.4.0",
|
|
@@ -72,6 +72,6 @@
|
|
|
72
72
|
"test:update": "yarn test --updateSnapshot",
|
|
73
73
|
"test:project": "yarn dist && yarn test"
|
|
74
74
|
},
|
|
75
|
-
"version": "8.14.
|
|
76
|
-
"gitHead": "
|
|
75
|
+
"version": "8.14.1",
|
|
76
|
+
"gitHead": "dd789e2ce6c0b5197a25733d1f86bc13bdf06641"
|
|
77
77
|
}
|
package/src/Form/Button.js
CHANGED
|
@@ -1,221 +1,136 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
2
|
+
/*
|
|
3
|
+
* Wire
|
|
4
|
+
* Copyright (C) 2018 Wire Swiss GmbH
|
|
5
|
+
*
|
|
6
|
+
* This program is free software: you can redistribute it and/or modify
|
|
7
|
+
* it under the terms of the GNU General Public License as published by
|
|
8
|
+
* the Free Software Foundation, either version 3 of the License, or
|
|
9
|
+
* (at your option) any later version.
|
|
10
|
+
*
|
|
11
|
+
* This program is distributed in the hope that it will be useful,
|
|
12
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
13
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
14
|
+
* GNU General Public License for more details.
|
|
15
|
+
*
|
|
16
|
+
* You should have received a copy of the GNU General Public License
|
|
17
|
+
* along with this program. If not, see http://www.gnu.org/licenses/.
|
|
18
|
+
*
|
|
19
|
+
*/
|
|
20
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
21
|
+
var t = {};
|
|
22
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
23
|
+
t[p] = s[p];
|
|
24
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
25
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
26
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
27
|
+
t[p[i]] = s[p[i]];
|
|
28
|
+
}
|
|
29
|
+
return t;
|
|
30
|
+
};
|
|
31
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
8
32
|
exports.filterButtonProps = exports.Button = exports.buttonStyle = exports.ButtonVariant = void 0;
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
var _react = require("@emotion/react");
|
|
17
|
-
|
|
18
|
-
var _Identity = require("../Identity");
|
|
19
|
-
|
|
20
|
-
var _motions = require("../Identity/motions");
|
|
21
|
-
|
|
22
|
-
var _Misc = require("../Misc");
|
|
23
|
-
|
|
24
|
-
var _Text = require("../Text");
|
|
25
|
-
|
|
26
|
-
var _util = require("../util");
|
|
27
|
-
|
|
28
|
-
var _excluded = ["variant", "backgroundColor", "block", "disabled", "noCapital", "bold", "center", "color", "fontSize", "noWrap", "textTransform", "truncate"],
|
|
29
|
-
_excluded2 = ["showLoading", "children", "loadingColor"];
|
|
30
|
-
|
|
31
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
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
|
-
|
|
33
|
+
/** @jsx jsx */
|
|
34
|
+
const react_1 = require("@emotion/react");
|
|
35
|
+
const Identity_1 = require("../Identity");
|
|
36
|
+
const motions_1 = require("../Identity/motions");
|
|
37
|
+
const Misc_1 = require("../Misc");
|
|
38
|
+
const Text_1 = require("../Text");
|
|
39
|
+
const util_1 = require("../util");
|
|
35
40
|
var ButtonVariant;
|
|
36
|
-
exports.ButtonVariant = ButtonVariant;
|
|
37
|
-
|
|
38
41
|
(function (ButtonVariant) {
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
})(ButtonVariant
|
|
45
|
-
|
|
46
|
-
var
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
'
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
color: disabled ? _Identity.COLOR_V2.GRAY_60 : _Identity.COLOR_V2.BLACK
|
|
123
|
-
}, !disabled && {
|
|
124
|
-
'&:hover, &:focus': {
|
|
125
|
-
border: "1px solid ".concat(_Identity.COLOR_V2.BLUE)
|
|
126
|
-
},
|
|
127
|
-
'&:focus': {
|
|
128
|
-
color: _Identity.COLOR_V2.BLUE
|
|
129
|
-
},
|
|
130
|
-
'&:active': {
|
|
131
|
-
backgroundColor: _Identity.COLOR_V2.BLUE_LIGHT_50,
|
|
132
|
-
border: "1px solid ".concat(_Identity.COLOR_V2.BLUE),
|
|
133
|
-
color: _Identity.COLOR_V2.BLUE
|
|
134
|
-
}
|
|
135
|
-
})), variant === ButtonVariant.TERTIARY && _objectSpread({
|
|
136
|
-
backgroundColor: backgroundColor || (disabled ? theme.Button.tertiarydisabledBg : theme.Button.tertiaryBg),
|
|
137
|
-
border: disabled ? "1px solid ".concat(theme.Button.tertiaryDisabledBorder) : "1px solid ".concat(theme.Button.tertiaryBorder),
|
|
138
|
-
borderRadius: '12px',
|
|
139
|
-
color: disabled ? theme.Input.placeholderColor : theme.general.color,
|
|
140
|
-
fontSize: '14px',
|
|
141
|
-
fontWeight: 700,
|
|
142
|
-
lineHeight: '24px',
|
|
143
|
-
padding: '4px 8px',
|
|
144
|
-
'& > svg > path': {
|
|
145
|
-
fill: disabled ? theme.Input.placeholderColor : theme.general.color
|
|
146
|
-
}
|
|
147
|
-
}, !disabled && {
|
|
148
|
-
'&:hover, &:focus': {
|
|
149
|
-
backgroundColor: theme.Button.tertiaryHoverBg,
|
|
150
|
-
border: "1px solid ".concat(theme.Button.tertiaryHoverBorder)
|
|
151
|
-
},
|
|
152
|
-
'&:focus': {
|
|
153
|
-
border: "1px solid ".concat(theme.general.focusColor)
|
|
154
|
-
},
|
|
155
|
-
'&:active': {
|
|
156
|
-
backgroundColor: theme.Button.tertiaryActiveBg,
|
|
157
|
-
color: theme.IconButton.primaryActiveFillColor,
|
|
158
|
-
'& > svg > path': {
|
|
159
|
-
fill: theme.IconButton.primaryActiveFillColor
|
|
160
|
-
}
|
|
161
|
-
}
|
|
162
|
-
})), variant === ButtonVariant.QUATERNARY && _objectSpread({
|
|
163
|
-
backgroundColor: backgroundColor || (disabled ? _Identity.COLOR_V2.GRAY_50 : _Identity.COLOR_V2.GREEN),
|
|
164
|
-
color: disabled ? _Identity.COLOR_V2.GRAY_80 : _Identity.COLOR_V2.WHITE,
|
|
165
|
-
lineHeight: '24px'
|
|
166
|
-
}, !disabled && {
|
|
167
|
-
'&:hover, &:focus': {
|
|
168
|
-
backgroundColor: _Identity.COLOR_V2.GREEN_LIGHT_600
|
|
169
|
-
},
|
|
170
|
-
'&:focus': {
|
|
171
|
-
border: "1px solid ".concat(_Identity.COLOR_V2.GREEN_LIGHT_700)
|
|
172
|
-
},
|
|
173
|
-
'&:active': {
|
|
174
|
-
backgroundColor: _Identity.COLOR_V2.GREEN_LIGHT_700
|
|
175
|
-
}
|
|
176
|
-
})), variant === ButtonVariant.SEND && _objectSpread({
|
|
177
|
-
backgroundColor: backgroundColor || (disabled ? _Identity.COLOR_V2.GRAY_70 : _Identity.COLOR_V2.BLUE),
|
|
178
|
-
width: '40px'
|
|
179
|
-
}, !disabled && {
|
|
180
|
-
'&:hover, &:focus': {
|
|
181
|
-
backgroundColor: _Identity.COLOR_V2.BLUE_LIGHT_600
|
|
182
|
-
},
|
|
183
|
-
'&:focus': {
|
|
184
|
-
border: "1px solid ".concat(_Identity.COLOR_V2.BLUE_LIGHT_800)
|
|
185
|
-
},
|
|
186
|
-
'&:active': {
|
|
187
|
-
backgroundColor: _Identity.COLOR_V2.BLUE_LIGHT_700
|
|
188
|
-
}
|
|
189
|
-
}));
|
|
42
|
+
ButtonVariant["PRIMARY"] = "primary";
|
|
43
|
+
ButtonVariant["SECONDARY"] = "secondary";
|
|
44
|
+
ButtonVariant["TERTIARY"] = "tertiary";
|
|
45
|
+
ButtonVariant["QUATERNARY"] = "quaternary";
|
|
46
|
+
ButtonVariant["SEND"] = "send";
|
|
47
|
+
})(ButtonVariant = exports.ButtonVariant || (exports.ButtonVariant = {}));
|
|
48
|
+
const buttonStyle = (theme, _a) => {
|
|
49
|
+
var { variant = ButtonVariant.PRIMARY, backgroundColor, block = false, disabled = false, noCapital = false, bold = true, center = true, color = Identity_1.COLOR.WHITE, fontSize = '16px', noWrap = true, textTransform = 'none', truncate = true } = _a, props = __rest(_a, ["variant", "backgroundColor", "block", "disabled", "noCapital", "bold", "center", "color", "fontSize", "noWrap", "textTransform", "truncate"]);
|
|
50
|
+
return (Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (0, Text_1.textStyle)(theme, Object.assign({ block,
|
|
51
|
+
bold,
|
|
52
|
+
center,
|
|
53
|
+
disabled,
|
|
54
|
+
fontSize,
|
|
55
|
+
noWrap,
|
|
56
|
+
textTransform,
|
|
57
|
+
truncate }, props))), { border: 0, cursor: disabled ? 'default' : 'pointer', display: 'flex', alignItems: 'center', justifyContent: 'center', marginBottom: '16px', padding: 0, outline: 'none', textDecoration: 'none', touchAction: 'manipulation', transition: motions_1.defaultTransition, width: block ? '100%' : 'auto', '&:hover, &:focus': {
|
|
58
|
+
textDecoration: 'none',
|
|
59
|
+
} }), (variant !== ButtonVariant.TERTIARY && Object.assign({ borderRadius: variant === ButtonVariant.SEND ? '100%' : '16px', height: variant === ButtonVariant.SEND ? '40px' : '48px', lineHeight: variant === ButtonVariant.SEND ? '40px' : '48px' }, (variant !== ButtonVariant.SEND && {
|
|
60
|
+
maxWidth: '100%',
|
|
61
|
+
minWidth: '125px',
|
|
62
|
+
padding: '0 16px',
|
|
63
|
+
})))), (variant === ButtonVariant.PRIMARY && Object.assign({ backgroundColor: backgroundColor || (disabled ? theme.Button.primaryDisabledBg : theme.Button.primaryBg), color: disabled ? theme.Button.primaryDisabledText : theme.general.contrastColor }, (!disabled && {
|
|
64
|
+
'&:hover, &:focus': {
|
|
65
|
+
backgroundColor: theme.Button.primaryHoverBg,
|
|
66
|
+
},
|
|
67
|
+
'&:focus': {
|
|
68
|
+
border: `1px solid ${theme.Button.primaryFocusBorder}`,
|
|
69
|
+
},
|
|
70
|
+
'&:active': {
|
|
71
|
+
backgroundColor: theme.Button.primaryActiveBg,
|
|
72
|
+
border: `1px solid ${theme.Button.primaryActiveBorder}`,
|
|
73
|
+
color: Identity_1.COLOR.WHITE,
|
|
74
|
+
},
|
|
75
|
+
})))), (variant === ButtonVariant.SECONDARY && Object.assign({ backgroundColor: backgroundColor || (disabled ? Identity_1.COLOR_V2.GRAY_20 : Identity_1.COLOR_V2.WHITE), border: `1px solid ${Identity_1.COLOR_V2.GRAY_40}`, color: disabled ? Identity_1.COLOR_V2.GRAY_60 : Identity_1.COLOR_V2.BLACK }, (!disabled && {
|
|
76
|
+
'&:hover, &:focus': {
|
|
77
|
+
border: `1px solid ${Identity_1.COLOR_V2.BLUE}`,
|
|
78
|
+
},
|
|
79
|
+
'&:focus': {
|
|
80
|
+
color: Identity_1.COLOR_V2.BLUE,
|
|
81
|
+
},
|
|
82
|
+
'&:active': {
|
|
83
|
+
backgroundColor: Identity_1.COLOR_V2.BLUE_LIGHT_50,
|
|
84
|
+
border: `1px solid ${Identity_1.COLOR_V2.BLUE}`,
|
|
85
|
+
color: Identity_1.COLOR_V2.BLUE,
|
|
86
|
+
},
|
|
87
|
+
})))), (variant === ButtonVariant.TERTIARY && Object.assign({ backgroundColor: backgroundColor || (disabled ? theme.Button.tertiarydisabledBg : theme.Button.tertiaryBg), border: disabled ? `1px solid ${theme.Button.tertiaryDisabledBorder}` : `1px solid ${theme.Button.tertiaryBorder}`, borderRadius: '12px', color: disabled ? theme.Input.placeholderColor : theme.general.color, fontSize: '14px', fontWeight: 700, lineHeight: '24px', padding: '4px 8px', '& > svg > path': {
|
|
88
|
+
fill: disabled ? theme.Input.placeholderColor : theme.general.color,
|
|
89
|
+
} }, (!disabled && {
|
|
90
|
+
'&:hover, &:focus': {
|
|
91
|
+
backgroundColor: theme.Button.tertiaryHoverBg,
|
|
92
|
+
border: `1px solid ${theme.Button.tertiaryHoverBorder}`,
|
|
93
|
+
},
|
|
94
|
+
'&:focus': {
|
|
95
|
+
border: `1px solid ${theme.general.focusColor}`,
|
|
96
|
+
},
|
|
97
|
+
'&:active': {
|
|
98
|
+
backgroundColor: theme.Button.tertiaryActiveBg,
|
|
99
|
+
color: theme.IconButton.primaryActiveFillColor,
|
|
100
|
+
'& > svg > path': {
|
|
101
|
+
fill: theme.IconButton.primaryActiveFillColor,
|
|
102
|
+
},
|
|
103
|
+
},
|
|
104
|
+
})))), (variant === ButtonVariant.QUATERNARY && Object.assign({ backgroundColor: backgroundColor || (disabled ? Identity_1.COLOR_V2.GRAY_50 : Identity_1.COLOR_V2.GREEN), color: disabled ? Identity_1.COLOR_V2.GRAY_80 : Identity_1.COLOR_V2.WHITE, lineHeight: '24px' }, (!disabled && {
|
|
105
|
+
'&:hover, &:focus': {
|
|
106
|
+
backgroundColor: Identity_1.COLOR_V2.GREEN_LIGHT_600,
|
|
107
|
+
},
|
|
108
|
+
'&:focus': {
|
|
109
|
+
border: `1px solid ${Identity_1.COLOR_V2.GREEN_LIGHT_700}`,
|
|
110
|
+
},
|
|
111
|
+
'&:active': {
|
|
112
|
+
backgroundColor: Identity_1.COLOR_V2.GREEN_LIGHT_700,
|
|
113
|
+
},
|
|
114
|
+
})))), (variant === ButtonVariant.SEND && Object.assign({ backgroundColor: backgroundColor || (disabled ? Identity_1.COLOR_V2.GRAY_70 : Identity_1.COLOR_V2.BLUE), width: '40px' }, (!disabled && {
|
|
115
|
+
'&:hover, &:focus': {
|
|
116
|
+
backgroundColor: Identity_1.COLOR_V2.BLUE_LIGHT_600,
|
|
117
|
+
},
|
|
118
|
+
'&:focus': {
|
|
119
|
+
border: `1px solid ${Identity_1.COLOR_V2.BLUE_LIGHT_800}`,
|
|
120
|
+
},
|
|
121
|
+
'&:active': {
|
|
122
|
+
backgroundColor: Identity_1.COLOR_V2.BLUE_LIGHT_700,
|
|
123
|
+
},
|
|
124
|
+
})))));
|
|
190
125
|
};
|
|
191
|
-
|
|
192
126
|
exports.buttonStyle = buttonStyle;
|
|
193
|
-
|
|
194
|
-
var
|
|
195
|
-
|
|
196
|
-
children = _ref2.children,
|
|
197
|
-
_ref2$loadingColor = _ref2.loadingColor,
|
|
198
|
-
loadingColor = _ref2$loadingColor === void 0 ? _Identity.COLOR.WHITE : _ref2$loadingColor,
|
|
199
|
-
props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded2);
|
|
200
|
-
return (0, _react.jsx)("button", (0, _extends2["default"])({
|
|
201
|
-
css: function css(theme) {
|
|
202
|
-
return buttonStyle(theme, props);
|
|
203
|
-
}
|
|
204
|
-
}, filterButtonProps(props)), showLoading ? (0, _react.jsx)(_Misc.Loading, {
|
|
205
|
-
size: 30,
|
|
206
|
-
color: loadingColor,
|
|
207
|
-
style: {
|
|
208
|
-
display: 'flex',
|
|
209
|
-
margin: 'auto'
|
|
210
|
-
}
|
|
211
|
-
}) : children);
|
|
127
|
+
const Button = (_a) => {
|
|
128
|
+
var { showLoading, children, loadingColor = Identity_1.COLOR.WHITE } = _a, props = __rest(_a, ["showLoading", "children", "loadingColor"]);
|
|
129
|
+
return ((0, react_1.jsx)("button", Object.assign({ css: (theme) => (0, exports.buttonStyle)(theme, props) }, (0, exports.filterButtonProps)(props)), showLoading ? (0, react_1.jsx)(Misc_1.Loading, { size: 30, color: loadingColor, style: { display: 'flex', margin: 'auto' } }) : children));
|
|
212
130
|
};
|
|
213
|
-
|
|
214
131
|
exports.Button = Button;
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
return (0, _util.filterProps)((0, _Text.filterTextProps)(props), ['backgroundColor', 'noCapital']);
|
|
132
|
+
const filterButtonProps = (props) => {
|
|
133
|
+
return (0, util_1.filterProps)((0, Text_1.filterTextProps)(props), ['backgroundColor', 'noCapital']);
|
|
218
134
|
};
|
|
219
|
-
|
|
220
135
|
exports.filterButtonProps = filterButtonProps;
|
|
221
136
|
//# 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","sourceRoot":"","sources":["Button.tsx"],"names":[],"mappings":"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"}
|
package/src/Form/ButtonLink.js
CHANGED
|
@@ -1,67 +1,54 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
var
|
|
21
|
-
|
|
22
|
-
var
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
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
|
-
|
|
34
|
-
var buttonLinkStyle = function buttonLinkStyle(theme, props) {
|
|
35
|
-
return _objectSpread(_objectSpread({}, (0, _Button.buttonStyle)(theme, props)), {}, {
|
|
36
|
-
display: 'inline-flex !important'
|
|
37
|
-
});
|
|
2
|
+
/*
|
|
3
|
+
* Wire
|
|
4
|
+
* Copyright (C) 2018 Wire Swiss GmbH
|
|
5
|
+
*
|
|
6
|
+
* This program is free software: you can redistribute it and/or modify
|
|
7
|
+
* it under the terms of the GNU General Public License as published by
|
|
8
|
+
* the Free Software Foundation, either version 3 of the License, or
|
|
9
|
+
* (at your option) any later version.
|
|
10
|
+
*
|
|
11
|
+
* This program is distributed in the hope that it will be useful,
|
|
12
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
13
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
14
|
+
* GNU General Public License for more details.
|
|
15
|
+
*
|
|
16
|
+
* You should have received a copy of the GNU General Public License
|
|
17
|
+
* along with this program. If not, see http://www.gnu.org/licenses/.
|
|
18
|
+
*
|
|
19
|
+
*/
|
|
20
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
21
|
+
var t = {};
|
|
22
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
23
|
+
t[p] = s[p];
|
|
24
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
25
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
26
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
27
|
+
t[p[i]] = s[p[i]];
|
|
28
|
+
}
|
|
29
|
+
return t;
|
|
38
30
|
};
|
|
39
|
-
|
|
31
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
32
|
+
exports.ButtonLink = exports.buttonLinkStyle = void 0;
|
|
33
|
+
/** @jsx jsx */
|
|
34
|
+
const react_1 = require("@emotion/react");
|
|
35
|
+
const Misc_1 = require("../Misc");
|
|
36
|
+
const Identity_1 = require("../Identity");
|
|
37
|
+
const util_1 = require("../util");
|
|
38
|
+
const Text_1 = require("../Text");
|
|
39
|
+
const Button_1 = require("./Button");
|
|
40
|
+
const buttonLinkStyle = (theme, props) => (Object.assign(Object.assign({}, (0, Button_1.buttonStyle)(theme, props)), { display: 'inline-flex !important' }));
|
|
40
41
|
exports.buttonLinkStyle = buttonLinkStyle;
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
42
|
+
const filterButtonLinkProps = (props) => {
|
|
43
|
+
return (0, util_1.filterProps)((0, Text_1.filterTextProps)(props), [
|
|
44
|
+
'backgroundColor',
|
|
45
|
+
'disabled',
|
|
46
|
+
'noCapital',
|
|
47
|
+
]);
|
|
44
48
|
};
|
|
45
|
-
|
|
46
|
-
var
|
|
47
|
-
|
|
48
|
-
showLoading = _ref.showLoading,
|
|
49
|
-
_ref$loadingColor = _ref.loadingColor,
|
|
50
|
-
loadingColor = _ref$loadingColor === void 0 ? _Identity.COLOR.WHITE : _ref$loadingColor,
|
|
51
|
-
props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
|
|
52
|
-
return (0, _react.jsx)("a", (0, _extends2["default"])({
|
|
53
|
-
css: function css(theme) {
|
|
54
|
-
return buttonLinkStyle(theme, props);
|
|
55
|
-
}
|
|
56
|
-
}, filterButtonLinkProps(props)), showLoading ? (0, _react.jsx)(_Misc.Loading, {
|
|
57
|
-
size: 30,
|
|
58
|
-
color: loadingColor,
|
|
59
|
-
style: {
|
|
60
|
-
display: 'flex',
|
|
61
|
-
margin: 'auto'
|
|
62
|
-
}
|
|
63
|
-
}) : children);
|
|
49
|
+
const ButtonLink = (_a) => {
|
|
50
|
+
var { children, showLoading, loadingColor = Identity_1.COLOR.WHITE } = _a, props = __rest(_a, ["children", "showLoading", "loadingColor"]);
|
|
51
|
+
return ((0, react_1.jsx)("a", Object.assign({ css: (theme) => (0, exports.buttonLinkStyle)(theme, props) }, filterButtonLinkProps(props)), showLoading ? (0, react_1.jsx)(Misc_1.Loading, { size: 30, color: loadingColor, style: { display: 'flex', margin: 'auto' } }) : children));
|
|
64
52
|
};
|
|
65
|
-
|
|
66
53
|
exports.ButtonLink = ButtonLink;
|
|
67
54
|
//# sourceMappingURL=ButtonLink.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"ButtonLink.js","sourceRoot":"","sources":["ButtonLink.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;GAiBG;;;;;;;;;;;;;;AAEH,eAAe;AACf,0CAA8C;AAE9C,kCAAgC;AAChC,0CAAkC;AAClC,kCAAoC;AACpC,kCAAwC;AACxC,qCAAkD;AAG3C,MAAM,eAAe,GAAuE,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC,iCAChH,IAAA,oBAAW,EAAC,KAAK,EAAE,KAAK,CAAC,KAC5B,OAAO,EAAE,wBAAwB,IACjC,CAAC;AAHU,QAAA,eAAe,mBAGzB;AAEH,MAAM,qBAAqB,GAAG,CAAC,KAAqC,EAAE,EAAE;IACtE,OAAO,IAAA,kBAAW,EAAC,IAAA,sBAAe,EAAC,KAAK,CAAmC,EAAE;QAC3E,iBAAiB;QACjB,UAAU;QACV,WAAW;KACZ,CAAC,CAAC;AACL,CAAC,CAAC;AAEK,MAAM,UAAU,GAAG,CAAC,EAKM,EAAE,EAAE;QALV,EACzB,QAAQ,EACR,WAAW,EACX,YAAY,GAAG,gBAAK,CAAC,KAAK,OAEK,EAD5B,KAAK,cAJiB,2CAK1B,CADS;IAC4B,OAAA,CACpC,sCAAG,GAAG,EAAE,CAAC,KAAY,EAAE,EAAE,CAAC,IAAA,uBAAe,EAAC,KAAK,EAAE,KAAK,CAAC,IAAM,qBAAqB,CAAC,KAAK,CAAC,GACtF,WAAW,CAAC,CAAC,CAAC,iBAAC,cAAO,IAAC,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,YAAY,EAAE,KAAK,EAAE,EAAC,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAC,GAAI,CAAC,CAAC,CAAC,QAAQ,CAC5G,CACL,CAAA;CAAA,CAAC;AATW,QAAA,UAAU,cASrB"}
|