@wireapp/react-ui-kit 8.7.2 → 8.7.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +8 -0
- package/package.json +2 -2
- package/src/Form/Checkbox.js +19 -22
- package/src/Form/Checkbox.js.map +1 -1
- package/src/Layout/Theme.js +3 -3
- package/src/Layout/Theme.js.map +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,14 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [8.7.3](https://github.com/wireapp/wire-web-packages/tree/main/packages/react-ui-kit/compare/@wireapp/react-ui-kit@8.7.2...@wireapp/react-ui-kit@8.7.3) (2022-07-07)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @wireapp/react-ui-kit
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
6
14
|
## [8.7.2](https://github.com/wireapp/wire-web-packages/tree/main/packages/react-ui-kit/compare/@wireapp/react-ui-kit@8.7.1...@wireapp/react-ui-kit@8.7.2) (2022-07-06)
|
|
7
15
|
|
|
8
16
|
|
package/package.json
CHANGED
|
@@ -67,6 +67,6 @@
|
|
|
67
67
|
"test:update": "yarn test --updateSnapshot",
|
|
68
68
|
"test:project": "yarn dist && yarn test"
|
|
69
69
|
},
|
|
70
|
-
"version": "8.7.
|
|
71
|
-
"gitHead": "
|
|
70
|
+
"version": "8.7.3",
|
|
71
|
+
"gitHead": "d337f26edd891dc23c00212e4d1a1d8f4f8c1752"
|
|
72
72
|
}
|
package/src/Form/Checkbox.js
CHANGED
|
@@ -28,8 +28,6 @@ var _Input = require("./Input");
|
|
|
28
28
|
var _excluded = ["id", "children", "style", "disabled"],
|
|
29
29
|
_excluded2 = ["color"];
|
|
30
30
|
|
|
31
|
-
function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
|
|
32
|
-
|
|
33
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; }
|
|
34
32
|
|
|
35
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; }
|
|
@@ -43,7 +41,7 @@ var StyledLabel = function StyledLabel(props) {
|
|
|
43
41
|
markInvalid = props.markInvalid;
|
|
44
42
|
return (0, _react.jsx)("label", (0, _extends2["default"])({
|
|
45
43
|
css: function css(theme) {
|
|
46
|
-
var _objectSpread2,
|
|
44
|
+
var _objectSpread2, _objectSpread3;
|
|
47
45
|
|
|
48
46
|
return _objectSpread(_objectSpread((_objectSpread2 = {}, (0, _defineProperty2["default"])(_objectSpread2, ".".concat(_Input.INPUT_CLASSNAME, ":checked + &::before"), {
|
|
49
47
|
background: "".concat(disabled ? theme.checkbox.disablecheckedBgColor : theme.general.primaryColor),
|
|
@@ -53,13 +51,11 @@ var StyledLabel = function StyledLabel(props) {
|
|
|
53
51
|
}), (0, _defineProperty2["default"])(_objectSpread2, ".".concat(_Input.INPUT_CLASSNAME, " + & > svg"), {
|
|
54
52
|
fill: 'none',
|
|
55
53
|
position: 'absolute',
|
|
56
|
-
left: '
|
|
54
|
+
left: '0.25rem',
|
|
57
55
|
top: '0.25rem'
|
|
58
|
-
}), _objectSpread2), !disabled && (
|
|
59
|
-
borderColor: theme.general.primaryColor
|
|
60
|
-
}), (0, _defineProperty2["default"])(_ref, ".".concat(_Input.INPUT_CLASSNAME, ":hover + &::before"), {
|
|
56
|
+
}), _objectSpread2), !disabled && (0, _defineProperty2["default"])({}, ".".concat(_Input.INPUT_CLASSNAME, ":hover + &::before"), {
|
|
61
57
|
borderColor: theme.general.primaryColor
|
|
62
|
-
})
|
|
58
|
+
})), {}, (_objectSpread3 = {}, (0, _defineProperty2["default"])(_objectSpread3, ".".concat(_Input.INPUT_CLASSNAME, " + &::before"), _objectSpread(_objectSpread({
|
|
63
59
|
background: disabled ? theme.checkbox.disableBgColor : theme.checkbox.background
|
|
64
60
|
}, !disabled ? {
|
|
65
61
|
border: markInvalid ? "1.5px solid ".concat(theme.checkbox.invalidBorderColor) : "1.5px solid ".concat(theme.checkbox.border)
|
|
@@ -70,12 +66,12 @@ var StyledLabel = function StyledLabel(props) {
|
|
|
70
66
|
boxSizing: 'border-box',
|
|
71
67
|
content: '""',
|
|
72
68
|
display: 'inline-block',
|
|
69
|
+
width: '22px',
|
|
73
70
|
height: '22px',
|
|
74
71
|
lineHeight: 1.4,
|
|
75
|
-
margin: '0 8px 0
|
|
76
|
-
width: '22px',
|
|
72
|
+
margin: '0 8px 0 0px',
|
|
77
73
|
color: theme.general.color
|
|
78
|
-
})), (0, _defineProperty2["default"])(_objectSpread3, "a", _objectSpread({}, (0, _Text.textLinkStyle)(theme, {}))), (0, _defineProperty2["default"])(_objectSpread3, "position", 'relative'), (0, _defineProperty2["default"])(_objectSpread3, "lineHeight", 1.4), (0, _defineProperty2["default"])(_objectSpread3, "display", 'flex'), (0, _defineProperty2["default"])(_objectSpread3, "opacity", disabled ? 0.56 : 1), (0, _defineProperty2["default"])(_objectSpread3, "cursor", disabled ? 'not-allowed' : 'pointer'), _objectSpread3));
|
|
74
|
+
})), (0, _defineProperty2["default"])(_objectSpread3, "a", _objectSpread({}, (0, _Text.textLinkStyle)(theme, {}))), (0, _defineProperty2["default"])(_objectSpread3, "position", 'relative'), (0, _defineProperty2["default"])(_objectSpread3, "margin", '0 0 0 -16px'), (0, _defineProperty2["default"])(_objectSpread3, "width", '100%'), (0, _defineProperty2["default"])(_objectSpread3, "lineHeight", 1.4), (0, _defineProperty2["default"])(_objectSpread3, "display", 'flex'), (0, _defineProperty2["default"])(_objectSpread3, "opacity", disabled ? 0.56 : 1), (0, _defineProperty2["default"])(_objectSpread3, "cursor", disabled ? 'not-allowed' : 'pointer'), _objectSpread3));
|
|
79
75
|
}
|
|
80
76
|
}, filterStyledLabelProps(props)), props.children, (0, _react.jsx)("svg", {
|
|
81
77
|
width: "15",
|
|
@@ -92,16 +88,6 @@ var filterCheckboxProps = function filterCheckboxProps(props) {
|
|
|
92
88
|
}; // We use Math.random..., because some of apps doesn't migrated to newest version of React.
|
|
93
89
|
|
|
94
90
|
|
|
95
|
-
var _ref3 = process.env.NODE_ENV === "production" ? {
|
|
96
|
-
name: "1emb0lq",
|
|
97
|
-
styles: "align-items:center;display:flex;justify-content:flex-start;position:relative;left:-0.3rem"
|
|
98
|
-
} : {
|
|
99
|
-
name: "nkfm6i-Checkbox",
|
|
100
|
-
styles: "align-items:center;display:flex;justify-content:flex-start;position:relative;left:-0.3rem;label:Checkbox;",
|
|
101
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNoZWNrYm94LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFrSEkiLCJmaWxlIjoiQ2hlY2tib3gudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLypcbiAqIFdpcmVcbiAqIENvcHlyaWdodCAoQykgMjAxOCBXaXJlIFN3aXNzIEdtYkhcbiAqXG4gKiBUaGlzIHByb2dyYW0gaXMgZnJlZSBzb2Z0d2FyZTogeW91IGNhbiByZWRpc3RyaWJ1dGUgaXQgYW5kL29yIG1vZGlmeVxuICogaXQgdW5kZXIgdGhlIHRlcm1zIG9mIHRoZSBHTlUgR2VuZXJhbCBQdWJsaWMgTGljZW5zZSBhcyBwdWJsaXNoZWQgYnlcbiAqIHRoZSBGcmVlIFNvZnR3YXJlIEZvdW5kYXRpb24sIGVpdGhlciB2ZXJzaW9uIDMgb2YgdGhlIExpY2Vuc2UsIG9yXG4gKiAoYXQgeW91ciBvcHRpb24pIGFueSBsYXRlciB2ZXJzaW9uLlxuICpcbiAqIFRoaXMgcHJvZ3JhbSBpcyBkaXN0cmlidXRlZCBpbiB0aGUgaG9wZSB0aGF0IGl0IHdpbGwgYmUgdXNlZnVsLFxuICogYnV0IFdJVEhPVVQgQU5ZIFdBUlJBTlRZOyB3aXRob3V0IGV2ZW4gdGhlIGltcGxpZWQgd2FycmFudHkgb2ZcbiAqIE1FUkNIQU5UQUJJTElUWSBvciBGSVRORVNTIEZPUiBBIFBBUlRJQ1VMQVIgUFVSUE9TRS4gU2VlIHRoZVxuICogR05VIEdlbmVyYWwgUHVibGljIExpY2Vuc2UgZm9yIG1vcmUgZGV0YWlscy5cbiAqXG4gKiBZb3Ugc2hvdWxkIGhhdmUgcmVjZWl2ZWQgYSBjb3B5IG9mIHRoZSBHTlUgR2VuZXJhbCBQdWJsaWMgTGljZW5zZVxuICogYWxvbmcgd2l0aCB0aGlzIHByb2dyYW0uIElmIG5vdCwgc2VlIGh0dHA6Ly93d3cuZ251Lm9yZy9saWNlbnNlcy8uXG4gKlxuICovXG5cbi8qKiBAanN4IGpzeCAqL1xuaW1wb3J0IHtqc3h9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCc7XG5cbmltcG9ydCB7Q09MT1J9IGZyb20gJy4uL0lkZW50aXR5JztcbmltcG9ydCB7VGhlbWV9IGZyb20gJy4uL0xheW91dCc7XG5pbXBvcnQge1RleHQsIFRleHRQcm9wcywgdGV4dFN0eWxlLCB0ZXh0TGlua1N0eWxlfSBmcm9tICcuLi9UZXh0JztcbmltcG9ydCB7ZmlsdGVyUHJvcHN9IGZyb20gJy4uL3V0aWwnO1xuaW1wb3J0IHtJTlBVVF9DTEFTU05BTUUsIElucHV0UHJvcHN9IGZyb20gJy4vSW5wdXQnO1xuXG5leHBvcnQgaW50ZXJmYWNlIFN0eWxlZExhYmVsUHJvcHM8VCA9IEhUTUxMYWJlbEVsZW1lbnQ+IGV4dGVuZHMgUmVhY3QuSFRNTFByb3BzPFQ+IHtcbiAgZGlzYWJsZWQ/OiBib29sZWFuO1xuICBtYXJrSW52YWxpZD86IGJvb2xlYW47XG59XG5cbmNvbnN0IGZpbHRlclN0eWxlZExhYmVsUHJvcHMgPSAocHJvcHM6IFN0eWxlZExhYmVsUHJvcHMpID0+IGZpbHRlclByb3BzKHByb3BzLCBbJ21hcmtJbnZhbGlkJ10pO1xuXG5jb25zdCBTdHlsZWRMYWJlbCA9IChwcm9wczogU3R5bGVkTGFiZWxQcm9wcykgPT4ge1xuICBjb25zdCB7ZGlzYWJsZWQsIG1hcmtJbnZhbGlkfSA9IHByb3BzO1xuICByZXR1cm4gKFxuICAgIDxsYWJlbFxuICAgICAgY3NzPXsodGhlbWU6IFRoZW1lKSA9PiAoe1xuICAgICAgICBbYC4ke0lOUFVUX0NMQVNTTkFNRX06Y2hlY2tlZCArICY6OmJlZm9yZWBdOiB7XG4gICAgICAgICAgYmFja2dyb3VuZDogYCR7ZGlzYWJsZWQgPyB0aGVtZS5jaGVja2JveC5kaXNhYmxlY2hlY2tlZEJnQ29sb3IgOiB0aGVtZS5nZW5lcmFsLnByaW1hcnlDb2xvcn1gLFxuICAgICAgICAgIGJvcmRlckNvbG9yOiB0aGVtZS5nZW5lcmFsLnByaW1hcnlDb2xvcixcbiAgICAgICAgfSxcbiAgICAgICAgW2AuJHtJTlBVVF9DTEFTU05BTUV9OmNoZWNrZWQgKyAmID4gc3ZnYF06IHtcbiAgICAgICAgICBmaWxsOiB0aGVtZS5nZW5lcmFsLmJhY2tncm91bmRDb2xvcixcbiAgICAgICAgfSxcbiAgICAgICAgW2AuJHtJTlBVVF9DTEFTU05BTUV9ICsgJiA+IHN2Z2BdOiB7XG4gICAgICAgICAgZmlsbDogJ25vbmUnLFxuICAgICAgICAgIHBvc2l0aW9uOiAnYWJzb2x1dGUnLFxuICAgICAgICAgIGxlZnQ6ICctMC43NXJlbScsXG4gICAgICAgICAgdG9wOiAnMC4yNXJlbScsXG4gICAgICAgIH0sXG4gICAgICAgIC4uLighZGlzYWJsZWQgJiYge1xuICAgICAgICAgIFtgLiR7SU5QVVRfQ0xBU1NOQU1FfTpmb2N1cy12aXNpYmxlICsgJjo6YmVmb3JlYF06IHtcbiAgICAgICAgICAgIGJvcmRlckNvbG9yOiB0aGVtZS5nZW5lcmFsLnByaW1hcnlDb2xvcixcbiAgICAgICAgICB9LFxuICAgICAgICAgIFtgLiR7SU5QVVRfQ0xBU1NOQU1FfTpob3ZlciArICY6OmJlZm9yZWBdOiB7XG4gICAgICAgICAgICBib3JkZXJDb2xvcjogdGhlbWUuZ2VuZXJhbC5wcmltYXJ5Q29sb3IsXG4gICAgICAgICAgfSxcbiAgICAgICAgfSksXG4gICAgICAgIFtgLiR7SU5QVVRfQ0xBU1NOQU1FfSArICY6OmJlZm9yZWBdOiB7XG4gICAgICAgICAgYmFja2dyb3VuZDogZGlzYWJsZWQgPyB0aGVtZS5jaGVja2JveC5kaXNhYmxlQmdDb2xvciA6IHRoZW1lLmNoZWNrYm94LmJhY2tncm91bmQsXG4gICAgICAgICAgLi4uKCFkaXNhYmxlZFxuICAgICAgICAgICAgPyB7XG4gICAgICAgICAgICAgICAgYm9yZGVyOiBtYXJrSW52YWxpZFxuICAgICAgICAgICAgICAgICAgPyBgMS41cHggc29saWQgJHt0aGVtZS5jaGVja2JveC5pbnZhbGlkQm9yZGVyQ29sb3J9YFxuICAgICAgICAgICAgICAgICAgOiBgMS41cHggc29saWQgJHt0aGVtZS5jaGVja2JveC5ib3JkZXJ9YCxcbiAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgOiB7XG4gICAgICAgICAgICAgICAgYm9yZGVyOiBgMS41cHggc29saWQgJHt0aGVtZS5jaGVja2JveC5kaXNhYmxlQm9yZGVyQ29sb3J9YCxcbiAgICAgICAgICAgICAgfSksXG4gICAgICAgICAgYm9yZGVyUmFkaXVzOiAnM3B4JyxcbiAgICAgICAgICBib3hTaXppbmc6ICdib3JkZXItYm94JyxcbiAgICAgICAgICBjb250ZW50OiAnXCJcIicsXG4gICAgICAgICAgZGlzcGxheTogJ2lubGluZS1ibG9jaycsXG4gICAgICAgICAgaGVpZ2h0OiAnMjJweCcsXG4gICAgICAgICAgbGluZUhlaWdodDogMS40LFxuICAgICAgICAgIG1hcmdpbjogJzAgOHB4IDAgLTE2cHgnLFxuICAgICAgICAgIHdpZHRoOiAnMjJweCcsXG4gICAgICAgICAgY29sb3I6IHRoZW1lLmdlbmVyYWwuY29sb3IsXG4gICAgICAgIH0sXG4gICAgICAgIGE6IHtcbiAgICAgICAgICAuLi50ZXh0TGlua1N0eWxlKHRoZW1lLCB7fSksXG4gICAgICAgIH0sXG4gICAgICAgIHBvc2l0aW9uOiAncmVsYXRpdmUnLFxuICAgICAgICBsaW5lSGVpZ2h0OiAxLjQsXG4gICAgICAgIGRpc3BsYXk6ICdmbGV4JyxcbiAgICAgICAgb3BhY2l0eTogZGlzYWJsZWQgPyAwLjU2IDogMSxcbiAgICAgICAgY3Vyc29yOiBkaXNhYmxlZCA/ICdub3QtYWxsb3dlZCcgOiAncG9pbnRlcicsXG4gICAgICB9KX1cbiAgICAgIHsuLi5maWx0ZXJTdHlsZWRMYWJlbFByb3BzKHByb3BzKX1cbiAgICA+XG4gICAgICB7cHJvcHMuY2hpbGRyZW59XG4gICAgICA8c3ZnIHdpZHRoPVwiMTVcIiBoZWlnaHQ9XCIxM1wiIHZpZXdCb3g9XCIwIDAgMTYgMTNcIiB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCI+XG4gICAgICAgIDxwYXRoIGQ9XCJNNS42NTY4NSAxMi4wNzExTDE1Ljk4NDIgMS42MjczOEwxNC41NyAwLjIxMzE2N0w1LjY1Njg1IDkuMjQyNjRMMS40MTQyMSA1TDAgNi40MTQyMUw1LjY1Njg1IDEyLjA3MTFaXCIgLz5cbiAgICAgIDwvc3ZnPlxuICAgIDwvbGFiZWw+XG4gICk7XG59O1xuXG5pbnRlcmZhY2UgQ2hlY2tib3hQcm9wczxUID0gSFRNTElucHV0RWxlbWVudD4gZXh0ZW5kcyBJbnB1dFByb3BzPFQ+IHtcbiAgaWQ/OiBzdHJpbmc7XG59XG5cbmNvbnN0IGZpbHRlckNoZWNrYm94UHJvcHMgPSAocHJvcHM6IENoZWNrYm94UHJvcHMpID0+IGZpbHRlclByb3BzKHByb3BzLCBbJ21hcmtJbnZhbGlkJ10pO1xuXG4vLyBXZSB1c2UgTWF0aC5yYW5kb20uLi4sIGJlY2F1c2Ugc29tZSBvZiBhcHBzIGRvZXNuJ3QgbWlncmF0ZWQgdG8gbmV3ZXN0IHZlcnNpb24gb2YgUmVhY3QuXG5leHBvcnQgY29uc3QgQ2hlY2tib3g6IFJlYWN0LkZDPENoZWNrYm94UHJvcHM8SFRNTElucHV0RWxlbWVudD4+ID0gUmVhY3QuZm9yd2FyZFJlZjxcbiAgSFRNTElucHV0RWxlbWVudCxcbiAgQ2hlY2tib3hQcm9wczxIVE1MSW5wdXRFbGVtZW50PlxuPigoe2lkID0gTWF0aC5yYW5kb20oKS50b1N0cmluZygpLCBjaGlsZHJlbiwgc3R5bGUsIGRpc2FibGVkLCAuLi5wcm9wc30sIHJlZikgPT4gKFxuICA8ZGl2XG4gICAgY3NzPXt7XG4gICAgICBhbGlnbkl0ZW1zOiAnY2VudGVyJyxcbiAgICAgIGRpc3BsYXk6ICdmbGV4JyxcbiAgICAgIGp1c3RpZnlDb250ZW50OiAnZmxleC1zdGFydCcsXG4gICAgICBwb3NpdGlvbjogJ3JlbGF0aXZlJyxcbiAgICAgIGxlZnQ6ICctMC4zcmVtJyxcbiAgICB9fVxuICAgIHN0eWxlPXtzdHlsZX1cbiAgPlxuICAgIDxpbnB1dFxuICAgICAgdHlwZT1cImNoZWNrYm94XCJcbiAgICAgIGlkPXtpZH1cbiAgICAgIHN0eWxlPXt7XG4gICAgICAgIGhlaWdodDogJzIycHgnLFxuICAgICAgICBtYXJnaW5Cb3R0b206ICcwJyxcbiAgICAgICAgb3BhY2l0eTogMCxcbiAgICAgICAgd2lkdGg6ICcyMnB4JyxcbiAgICAgICAgY3Vyc29yOiBkaXNhYmxlZCA/ICdub3QtYWxsb3dlZCcgOiAncG9pbnRlcicsXG4gICAgICB9fVxuICAgICAgZGlzYWJsZWQ9e2Rpc2FibGVkfVxuICAgICAgcmVmPXtyZWZ9XG4gICAgICBjbGFzc05hbWU9e0lOUFVUX0NMQVNTTkFNRX1cbiAgICAgIHsuLi5maWx0ZXJDaGVja2JveFByb3BzKHByb3BzKX1cbiAgICAvPlxuXG4gICAgPFN0eWxlZExhYmVsIGh0bWxGb3I9e2lkfSBkaXNhYmxlZD17ZGlzYWJsZWR9IG1hcmtJbnZhbGlkPXtwcm9wcy5tYXJrSW52YWxpZH0+XG4gICAgICB7Y2hpbGRyZW59XG4gICAgPC9TdHlsZWRMYWJlbD5cbiAgPC9kaXY+XG4pKTtcblxuZXhwb3J0IHR5cGUgQ2hlY2tib3hMYWJlbFByb3BzPFQgPSBIVE1MU3BhbkVsZW1lbnQ+ID0gVGV4dFByb3BzPFQ+O1xuXG5leHBvcnQgY29uc3QgQ2hlY2tib3hMYWJlbCA9ICh7Y29sb3IgPSBDT0xPUi5URVhULCAuLi5wcm9wc306IENoZWNrYm94TGFiZWxQcm9wcykgPT4gKFxuICA8VGV4dFxuICAgIGNzcz17KHRoZW1lOiBUaGVtZSkgPT4gKHtcbiAgICAgIC4uLnRleHRTdHlsZSh0aGVtZSwge1xuICAgICAgICBjb2xvcixcbiAgICAgICAgLi4ucHJvcHMsXG4gICAgICB9KSxcbiAgICAgIGE6IHtcbiAgICAgICAgY29sb3I6IENPTE9SLkxJTkssXG4gICAgICAgIHRleHREZWNvcmF0aW9uOiAnbm9uZScsXG4gICAgICB9LFxuICAgIH0pfVxuICAgIHsuLi5wcm9wc31cbiAgLz5cbik7XG4iXX0= */",
|
|
102
|
-
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
103
|
-
};
|
|
104
|
-
|
|
105
91
|
var Checkbox = /*#__PURE__*/_react2["default"].forwardRef(function (_ref2, ref) {
|
|
106
92
|
var _ref2$id = _ref2.id,
|
|
107
93
|
id = _ref2$id === void 0 ? Math.random().toString() : _ref2$id,
|
|
@@ -110,7 +96,18 @@ var Checkbox = /*#__PURE__*/_react2["default"].forwardRef(function (_ref2, ref)
|
|
|
110
96
|
disabled = _ref2.disabled,
|
|
111
97
|
props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded);
|
|
112
98
|
return (0, _react.jsx)("div", {
|
|
113
|
-
css:
|
|
99
|
+
css: function css(theme) {
|
|
100
|
+
return (0, _defineProperty2["default"])({
|
|
101
|
+
alignItems: 'center',
|
|
102
|
+
display: 'flex',
|
|
103
|
+
justifyContent: 'flex-start',
|
|
104
|
+
position: 'relative',
|
|
105
|
+
left: '-0.3rem'
|
|
106
|
+
}, ".".concat(_Input.INPUT_CLASSNAME, ":focus-visible + label"), {
|
|
107
|
+
outline: "1px solid ".concat(theme.general.primaryColor),
|
|
108
|
+
outlineOffset: '0.4rem'
|
|
109
|
+
});
|
|
110
|
+
},
|
|
114
111
|
style: style
|
|
115
112
|
}, (0, _react.jsx)("input", (0, _extends2["default"])({
|
|
116
113
|
type: "checkbox",
|
package/src/Form/Checkbox.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Checkbox.tsx"],"names":["filterStyledLabelProps","props","StyledLabel","disabled","markInvalid","theme","INPUT_CLASSNAME","background","checkbox","disablecheckedBgColor","general","primaryColor","borderColor","fill","backgroundColor","position","left","top","disableBgColor","border","invalidBorderColor","disableBorderColor","borderRadius","boxSizing","content","display","height","lineHeight","margin","
|
|
1
|
+
{"version":3,"sources":["Checkbox.tsx"],"names":["filterStyledLabelProps","props","StyledLabel","disabled","markInvalid","theme","INPUT_CLASSNAME","background","checkbox","disablecheckedBgColor","general","primaryColor","borderColor","fill","backgroundColor","position","left","top","disableBgColor","border","invalidBorderColor","disableBorderColor","borderRadius","boxSizing","content","display","width","height","lineHeight","margin","color","children","filterCheckboxProps","Checkbox","React","forwardRef","ref","id","Math","random","toString","style","alignItems","justifyContent","outline","outlineOffset","marginBottom","opacity","cursor","CheckboxLabel","COLOR","TEXT","a","LINK","textDecoration"],"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 from 'react';\n\nimport {COLOR} from '../Identity';\nimport {Theme} from '../Layout';\nimport {Text, TextProps, textStyle, textLinkStyle} from '../Text';\nimport {filterProps} from '../util';\nimport {INPUT_CLASSNAME, InputProps} from './Input';\n\nexport interface StyledLabelProps<T = HTMLLabelElement> extends React.HTMLProps<T> {\n disabled?: boolean;\n markInvalid?: boolean;\n}\n\nconst filterStyledLabelProps = (props: StyledLabelProps) => filterProps(props, ['markInvalid']);\n\nconst StyledLabel = (props: StyledLabelProps) => {\n const {disabled, markInvalid} = props;\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 left: '0.25rem',\n top: '0.25rem',\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 ? `1.5px solid ${theme.checkbox.invalidBorderColor}`\n : `1.5px solid ${theme.checkbox.border}`,\n }\n : {\n border: `1.5px 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 a: {\n ...textLinkStyle(theme, {}),\n },\n position: 'relative',\n margin: '0 0 0 -16px',\n width: '100%',\n lineHeight: 1.4,\n display: 'flex',\n opacity: disabled ? 0.56 : 1,\n cursor: disabled ? 'not-allowed' : 'pointer',\n })}\n {...filterStyledLabelProps(props)}\n >\n {props.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}\n\nconst filterCheckboxProps = (props: CheckboxProps) => filterProps(props, ['markInvalid']);\n\n// We use Math.random..., because some of apps doesn't migrated to newest version of React.\nexport const Checkbox: React.FC<CheckboxProps<HTMLInputElement>> = React.forwardRef<\n HTMLInputElement,\n CheckboxProps<HTMLInputElement>\n>(({id = Math.random().toString(), children, style, disabled, ...props}, ref) => (\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: '0.4rem',\n },\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 {...filterCheckboxProps(props)}\n />\n\n <StyledLabel htmlFor={id} disabled={disabled} markInvalid={props.markInvalid}>\n {children}\n </StyledLabel>\n </div>\n));\n\nexport type CheckboxLabelProps<T = HTMLSpanElement> = TextProps<T>;\n\nexport const CheckboxLabel = ({color = COLOR.TEXT, ...props}: CheckboxLabelProps) => (\n <Text\n css={(theme: Theme) => ({\n ...textStyle(theme, {\n color,\n ...props,\n }),\n a: {\n color: COLOR.LINK,\n textDecoration: 'none',\n },\n })}\n {...props}\n />\n);\n"],"file":"Checkbox.js"}
|
package/src/Layout/Theme.js
CHANGED
|
@@ -39,7 +39,7 @@ var themes = (_themes = {}, (0, _defineProperty2["default"])(_themes, THEME_ID.L
|
|
|
39
39
|
labelColor: _colorsV.COLOR_V2.GRAY_80
|
|
40
40
|
},
|
|
41
41
|
general: {
|
|
42
|
-
backgroundColor:
|
|
42
|
+
backgroundColor: _colorsV.COLOR_V2.GRAY_20,
|
|
43
43
|
color: _colors.COLOR.TEXT,
|
|
44
44
|
primaryColor: _colorsV.COLOR_V2.BLUE,
|
|
45
45
|
dangerColor: _colorsV.COLOR_V2.RED
|
|
@@ -51,7 +51,7 @@ var themes = (_themes = {}, (0, _defineProperty2["default"])(_themes, THEME_ID.L
|
|
|
51
51
|
},
|
|
52
52
|
checkbox: {
|
|
53
53
|
background: _colorsV.COLOR_V2.GRAY_20,
|
|
54
|
-
border: _colorsV.COLOR_V2.
|
|
54
|
+
border: _colorsV.COLOR_V2.GRAY_80,
|
|
55
55
|
borderFocused: _colorsV.BASE_LIGHT_COLOR.BLUE,
|
|
56
56
|
disableBgColor: _colorsV.COLOR_V2.GRAY_20,
|
|
57
57
|
disableBorderColor: _colorsV.COLOR_V2.GRAY_60,
|
|
@@ -78,7 +78,7 @@ var themes = (_themes = {}, (0, _defineProperty2["default"])(_themes, THEME_ID.L
|
|
|
78
78
|
},
|
|
79
79
|
checkbox: {
|
|
80
80
|
background: _colorsV.COLOR_V2.GRAY_20,
|
|
81
|
-
border: _colorsV.COLOR_V2.
|
|
81
|
+
border: _colorsV.COLOR_V2.GRAY_60,
|
|
82
82
|
borderFocused: _colorsV.BASE_DARK_COLOR.BLUE,
|
|
83
83
|
disableBgColor: _colorsV.COLOR_V2.GRAY_10,
|
|
84
84
|
disableBorderColor: _colorsV.COLOR_V2.GRAY_70,
|
package/src/Layout/Theme.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Theme.tsx"],"names":["THEME_ID","themes","LIGHT","Input","backgroundColor","COLOR","WHITE","backgroundColorDisabled","COLOR_V2","GRAY_20","placeholderColor","GRAY_DARKEN_24","labelColor","GRAY_80","general","
|
|
1
|
+
{"version":3,"sources":["Theme.tsx"],"names":["THEME_ID","themes","LIGHT","Input","backgroundColor","COLOR","WHITE","backgroundColorDisabled","COLOR_V2","GRAY_20","placeholderColor","GRAY_DARKEN_24","labelColor","GRAY_80","general","color","TEXT","primaryColor","BLUE","dangerColor","RED","select","disabledColor","GRAY_70","contrastTextColor","borderColor","GRAY_40","checkbox","background","border","borderFocused","BASE_LIGHT_COLOR","disableBgColor","disableBorderColor","GRAY_60","disablecheckedBgColor","invalidBorderColor","DARK","BLACK_LIGHTEN_24","GRAY_100","GRAY_LIGHTEN_88","BLACK","GRAY_90","BASE_DARK_COLOR","GRAY_10","filterThemeProps","props","ThemeProvider","theme"],"mappings":"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","sourcesContent":["/*\n * Wire\n * Copyright (C) 2019 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, ThemeProvider as EmotionThemeProvider} from '@emotion/react';\nimport React from 'react';\n\nimport {COLOR} from '../Identity/colors';\nimport {COLOR_V2, BASE_DARK_COLOR, BASE_LIGHT_COLOR} from '../Identity/colors-v2';\nimport {filterProps} from '../util';\n\nexport enum THEME_ID {\n DARK = 'THEME_DARK',\n LIGHT = 'THEME_LIGHT',\n}\n\nexport interface Theme {\n general: {\n backgroundColor: string;\n color: string;\n dangerColor?: string;\n primaryColor?: string;\n };\n Input: {\n backgroundColor: string;\n backgroundColorDisabled: string;\n placeholderColor: string;\n labelColor: string;\n };\n select: {\n disabledColor?: string;\n contrastTextColor?: string;\n borderColor?: string;\n };\n checkbox: {\n background?: string;\n border?: string;\n borderFocused?: string;\n disableBgColor?: string;\n disableBorderColor?: string;\n disablecheckedBgColor?: string;\n invalidBorderColor?: string;\n };\n}\n\nexport const themes: {[themeId in THEME_ID]: Theme} = {\n [THEME_ID.LIGHT]: {\n Input: {\n backgroundColor: COLOR.WHITE,\n backgroundColorDisabled: COLOR_V2.GRAY_20,\n placeholderColor: COLOR.GRAY_DARKEN_24,\n labelColor: COLOR_V2.GRAY_80,\n },\n general: {\n backgroundColor: COLOR_V2.GRAY_20,\n color: COLOR.TEXT,\n primaryColor: COLOR_V2.BLUE,\n dangerColor: COLOR_V2.RED,\n },\n select: {\n disabledColor: COLOR_V2.GRAY_70,\n contrastTextColor: COLOR.WHITE,\n borderColor: COLOR_V2.GRAY_40,\n },\n checkbox: {\n background: COLOR_V2.GRAY_20,\n border: COLOR_V2.GRAY_80,\n borderFocused: BASE_LIGHT_COLOR.BLUE,\n disableBgColor: COLOR_V2.GRAY_20,\n disableBorderColor: COLOR_V2.GRAY_60,\n disablecheckedBgColor: COLOR_V2.GRAY_20,\n invalidBorderColor: BASE_LIGHT_COLOR.RED,\n },\n },\n [THEME_ID.DARK]: {\n Input: {\n backgroundColor: COLOR.BLACK_LIGHTEN_24,\n backgroundColorDisabled: COLOR.GRAY_100,\n placeholderColor: COLOR.GRAY_LIGHTEN_88,\n labelColor: COLOR_V2.GRAY_40,\n },\n general: {\n backgroundColor: COLOR.BLACK,\n color: COLOR.WHITE,\n primaryColor: COLOR_V2.BLUE,\n dangerColor: COLOR_V2.RED,\n },\n select: {\n disabledColor: COLOR_V2.GRAY_60,\n contrastTextColor: COLOR.BLACK,\n borderColor: COLOR_V2.GRAY_90,\n },\n checkbox: {\n background: COLOR_V2.GRAY_20,\n border: COLOR_V2.GRAY_60,\n borderFocused: BASE_DARK_COLOR.BLUE,\n disableBgColor: COLOR_V2.GRAY_10,\n disableBorderColor: COLOR_V2.GRAY_70,\n disablecheckedBgColor: COLOR_V2.GRAY_60,\n invalidBorderColor: BASE_DARK_COLOR.RED,\n },\n },\n};\n\nexport interface ThemeProps<T = HTMLDivElement> extends React.HTMLProps<T> {\n theme?: Theme;\n}\n\nconst filterThemeProps = (props: ThemeProps) => filterProps(props, ['theme']);\n\nexport const ThemeProvider = (props: ThemeProps) => (\n <EmotionThemeProvider theme={props.theme} {...filterThemeProps(props)} />\n);\n"],"file":"Theme.js"}
|