@twreporter/react-components 9.0.2 → 9.1.0-rc.0
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 +22 -0
- package/lib/badge/badge.stories.js +3 -9
- package/lib/badge/index.js +8 -24
- package/lib/bookmark-list/bookmark.js +20 -69
- package/lib/bookmark-list/bookmarks.js +10 -40
- package/lib/bookmark-list/customized-link.js +4 -14
- package/lib/bookmark-list/image-wrapper.js +9 -36
- package/lib/bookmark-list/index.js +36 -91
- package/lib/bookmark-list/redirect-to-sign-in.js +1 -10
- package/lib/bookmark-list/stories/bookmark.stories.js +3 -9
- package/lib/bookmark-widget/index.js +91 -220
- package/lib/button/components/iconButton.js +15 -34
- package/lib/button/components/iconWithTextButton.js +16 -31
- package/lib/button/components/link.js +27 -45
- package/lib/button/components/menuButton.js +18 -38
- package/lib/button/components/pillButton.js +31 -60
- package/lib/button/components/textButton.js +29 -61
- package/lib/button/components/toggleButton.js +11 -31
- package/lib/button/enums/index.js +4 -7
- package/lib/button/index.js +5 -18
- package/lib/button/stories/iconButton.stories.js +4 -15
- package/lib/button/stories/iconWithTextButton.stories.js +4 -13
- package/lib/button/stories/link.stories.js +9 -27
- package/lib/button/stories/menuButton.stories.js +3 -10
- package/lib/button/stories/pillButton.stories.js +4 -15
- package/lib/button/stories/textButton.stories.js +4 -15
- package/lib/button/stories/toggleButton.stories.js +3 -8
- package/lib/button/utils/size.js +3 -8
- package/lib/button/utils/theme.js +11 -102
- package/lib/card/components/article-card.js +31 -59
- package/lib/card/components/dialog.js +7 -22
- package/lib/card/components/short-story.js +24 -44
- package/lib/card/index.js +2 -8
- package/lib/card/stories/articleCard.stories.js +3 -14
- package/lib/card/stories/dialog.stories.js +3 -11
- package/lib/card/stories/shortStory.stories.js +3 -16
- package/lib/checkbox/checkbox.stories.js +3 -8
- package/lib/checkbox/index.js +10 -31
- package/lib/color.stories.js +9 -34
- package/lib/confirmation/index.js +7 -29
- package/lib/customized-link.js +5 -18
- package/lib/divider.js +3 -19
- package/lib/divider.stories.js +5 -18
- package/lib/donation-link.js +2 -14
- package/lib/empty-state/enums/index.js +2 -3
- package/lib/empty-state/index.js +20 -41
- package/lib/empty-state/stories/empty-guide.stories.js +3 -11
- package/lib/error/index.js +3 -8
- package/lib/error/message.js +3 -44
- package/lib/footer/constants/links.js +10 -16
- package/lib/footer/footer.stories.js +3 -10
- package/lib/footer/index.js +5 -40
- package/lib/footer/link.js +15 -46
- package/lib/footer/logo.js +12 -32
- package/lib/hook/index.js +3 -18
- package/lib/hook/use-bookmark.js +21 -47
- package/lib/hook/use-font-face-observer.js +9 -24
- package/lib/hook/use-outside-click.js +4 -9
- package/lib/icon/enum/index.js +5 -9
- package/lib/icon/index.js +49 -105
- package/lib/icon/stories/arrow.stories.js +7 -16
- package/lib/icon/stories/article.stories.js +2 -7
- package/lib/icon/stories/bookmark.stories.js +6 -14
- package/lib/icon/stories/changeIconColor.stories.js +2 -12
- package/lib/icon/stories/clock.stories.js +2 -7
- package/lib/icon/stories/copy.stories.js +2 -7
- package/lib/icon/stories/cross.stories.js +2 -7
- package/lib/icon/stories/hamburger.stories.js +2 -7
- package/lib/icon/stories/home.stories.js +2 -7
- package/lib/icon/stories/letter.stories.js +2 -7
- package/lib/icon/stories/loading.stories.js +2 -7
- package/lib/icon/stories/member.stories.js +2 -7
- package/lib/icon/stories/printer.stories.js +2 -7
- package/lib/icon/stories/search.stories.js +2 -7
- package/lib/icon/stories/share.stories.js +2 -7
- package/lib/icon/stories/socialMedia.stories.js +2 -8
- package/lib/icon/stories/text.stories.js +2 -7
- package/lib/icon/stories/topic.stories.js +2 -7
- package/lib/image-with-fallback.js +22 -52
- package/lib/input/components/search-bar.js +40 -85
- package/lib/input/components/text-field.js +20 -40
- package/lib/input/enums/index.js +6 -8
- package/lib/input/index.js +2 -7
- package/lib/input/stories/search-bar.stories.js +3 -16
- package/lib/input/stories/text-field.stories.js +3 -14
- package/lib/input/utils/theme.js +2 -9
- package/lib/is-fetching-wrapper.js +16 -48
- package/lib/junior-link.js +6 -29
- package/lib/link-with-tracker.js +14 -47
- package/lib/listing-page/components/card-list.js +20 -51
- package/lib/listing-page/components/image.js +15 -46
- package/lib/listing-page/components/list-item.js +18 -65
- package/lib/listing-page/components/list.js +17 -61
- package/lib/listing-page/components/page-content.js +2 -12
- package/lib/listing-page/components/topics/index.js +26 -74
- package/lib/listing-page/components/topics/post-item.js +14 -47
- package/lib/listing-page/components/topics/posts.js +1 -10
- package/lib/listing-page/components/topics/section.js +3 -25
- package/lib/listing-page/components/topics/topic-item.js +17 -56
- package/lib/listing-page/constants/mockup-spec.js +2 -3
- package/lib/listing-page/constants/predefined-css.js +2 -10
- package/lib/listing-page/constants/prop-types.js +2 -7
- package/lib/listing-page/constants/topics.js +2 -3
- package/lib/listing-page/index.js +2 -8
- package/lib/listing-page/stories/cardList.stories.js +3 -10
- package/lib/logo/components/logo-footer.js +6 -21
- package/lib/logo/components/logo-header.js +7 -23
- package/lib/logo/components/logo-loading-fallback.js +4 -13
- package/lib/logo/components/logo-symbol.js +7 -23
- package/lib/logo/index.js +2 -9
- package/lib/logo/stories/logoFooter.stories.js +2 -8
- package/lib/logo/stories/logoHeader.stories.js +3 -9
- package/lib/logo/stories/logoLoadingFallback.stories.js +2 -8
- package/lib/logo/stories/logoSymbol.stories.js +3 -9
- package/lib/logo/utils/path.js +2 -9
- package/lib/material-icon.js +9 -17
- package/lib/mobile-member-role-card/index.js +22 -49
- package/lib/mobile-member-role-card/stories/member-role-card.stories.js +3 -12
- package/lib/mobile-pop-up-modal.js +10 -44
- package/lib/more.js +10 -37
- package/lib/pagination/index.js +17 -83
- package/lib/podcast-link.js +6 -29
- package/lib/rwd.js +6 -26
- package/lib/shared-enum.js +2 -3
- package/lib/side-bar/index.js +16 -59
- package/lib/simple-header/index.js +2 -12
- package/lib/simple-header/simpleHeader.stories.js +3 -8
- package/lib/snack-bar/components/snack-bar.js +9 -20
- package/lib/snack-bar/hooks/use-snack-bar.js +12 -25
- package/lib/snack-bar/index.js +2 -7
- package/lib/snack-bar/stories/snackBar.stories.js +12 -29
- package/lib/snack-bar/utils/theme.js +3 -9
- package/lib/storybook/constants/index.js +3 -11
- package/lib/storybook/utils/get-enum-arg.js +2 -5
- package/lib/table-of-contents/index.js +62 -128
- package/lib/text/constants/headline-type.js +5 -8
- package/lib/text/enums/index.js +3 -5
- package/lib/text/headline.js +14 -41
- package/lib/text/paragraph.js +13 -34
- package/lib/text/stories/headline.stories.js +8 -21
- package/lib/text/stories/paragraph.stories.js +6 -17
- package/lib/text/utils/webfonts.js +9 -22
- package/lib/title-bar/components/tab.js +27 -69
- package/lib/title-bar/components/title1.js +6 -17
- package/lib/title-bar/components/title2.js +7 -23
- package/lib/title-bar/index.js +2 -8
- package/lib/title-bar/stories/tab.stories.js +5 -12
- package/lib/title-bar/stories/title1.stories.js +5 -12
- package/lib/title-bar/stories/title2.stories.js +3 -11
- package/lib/utils/link-with-params.js +0 -5
- package/package.json +4 -4
- package/lib/hook/use-store.js +0 -46
|
@@ -4,18 +4,13 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.search = exports["default"] = void 0;
|
|
7
|
-
|
|
8
7
|
var _index = require("../index");
|
|
9
|
-
|
|
10
8
|
var _constants = require("../../storybook/constants");
|
|
11
|
-
|
|
12
|
-
var _default = {
|
|
9
|
+
var _default = exports["default"] = {
|
|
13
10
|
title: 'Icon/Search',
|
|
14
11
|
component: _index.Search,
|
|
15
12
|
argTypes: {
|
|
16
13
|
releaseBranch: _constants.BRANCH_STORYBOOK_ARG_TYPE
|
|
17
14
|
}
|
|
18
15
|
};
|
|
19
|
-
exports
|
|
20
|
-
var search = {};
|
|
21
|
-
exports.search = search;
|
|
16
|
+
var search = exports.search = {};
|
|
@@ -4,18 +4,13 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.share = exports["default"] = void 0;
|
|
7
|
-
|
|
8
7
|
var _index = require("../index");
|
|
9
|
-
|
|
10
8
|
var _constants = require("../../storybook/constants");
|
|
11
|
-
|
|
12
|
-
var _default = {
|
|
9
|
+
var _default = exports["default"] = {
|
|
13
10
|
title: 'Icon/Share',
|
|
14
11
|
component: _index.Share,
|
|
15
12
|
argTypes: {
|
|
16
13
|
releaseBranch: _constants.BRANCH_STORYBOOK_ARG_TYPE
|
|
17
14
|
}
|
|
18
15
|
};
|
|
19
|
-
exports
|
|
20
|
-
var share = {};
|
|
21
|
-
exports.share = share;
|
|
16
|
+
var share = exports.share = {};
|
|
@@ -4,14 +4,10 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.socialMedia = exports["default"] = void 0;
|
|
7
|
-
|
|
8
7
|
var _getEnumArg = require("../../storybook/utils/get-enum-arg");
|
|
9
|
-
|
|
10
8
|
var _index = require("../index");
|
|
11
|
-
|
|
12
9
|
var _constants = require("../../storybook/constants");
|
|
13
|
-
|
|
14
|
-
var _default = {
|
|
10
|
+
var _default = exports["default"] = {
|
|
15
11
|
title: 'Icon/Social Media',
|
|
16
12
|
component: _index.SocialMedia,
|
|
17
13
|
argTypes: {
|
|
@@ -20,6 +16,4 @@ var _default = {
|
|
|
20
16
|
releaseBranch: _constants.BRANCH_STORYBOOK_ARG_TYPE
|
|
21
17
|
}
|
|
22
18
|
};
|
|
23
|
-
exports
|
|
24
|
-
var socialMedia = {};
|
|
25
|
-
exports.socialMedia = socialMedia;
|
|
19
|
+
var socialMedia = exports.socialMedia = {};
|
|
@@ -4,18 +4,13 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.text = exports["default"] = void 0;
|
|
7
|
-
|
|
8
7
|
var _index = require("../index");
|
|
9
|
-
|
|
10
8
|
var _constants = require("../../storybook/constants");
|
|
11
|
-
|
|
12
|
-
var _default = {
|
|
9
|
+
var _default = exports["default"] = {
|
|
13
10
|
title: 'Icon/Text',
|
|
14
11
|
component: _index.Text,
|
|
15
12
|
argTypes: {
|
|
16
13
|
releaseBranch: _constants.BRANCH_STORYBOOK_ARG_TYPE
|
|
17
14
|
}
|
|
18
15
|
};
|
|
19
|
-
exports
|
|
20
|
-
var text = {};
|
|
21
|
-
exports.text = text;
|
|
16
|
+
var text = exports.text = {};
|
|
@@ -4,18 +4,13 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.topic = exports["default"] = void 0;
|
|
7
|
-
|
|
8
7
|
var _index = require("../index");
|
|
9
|
-
|
|
10
8
|
var _constants = require("../../storybook/constants");
|
|
11
|
-
|
|
12
|
-
var _default = {
|
|
9
|
+
var _default = exports["default"] = {
|
|
13
10
|
title: 'Icon/Topic',
|
|
14
11
|
component: _index.Topic,
|
|
15
12
|
argTypes: {
|
|
16
13
|
releaseBranch: _constants.BRANCH_STORYBOOK_ARG_TYPE
|
|
17
14
|
}
|
|
18
15
|
};
|
|
19
|
-
exports
|
|
20
|
-
var topic = {};
|
|
21
|
-
exports.topic = topic;
|
|
16
|
+
var topic = exports.topic = {};
|
|
@@ -1,53 +1,33 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
function _typeof(
|
|
4
|
-
|
|
3
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports["default"] = void 0;
|
|
9
|
-
|
|
10
8
|
var _react = _interopRequireWildcard(require("react"));
|
|
11
|
-
|
|
12
9
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
13
|
-
|
|
14
10
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
15
|
-
|
|
16
11
|
var _logo = require("./logo");
|
|
17
|
-
|
|
18
12
|
var _storageUrlProcessor = require("@twreporter/core/lib/utils/storage-url-processor");
|
|
19
|
-
|
|
20
13
|
var _releaseBranch = require("@twreporter/core/lib/constants/release-branch");
|
|
21
|
-
|
|
22
14
|
var _get = _interopRequireDefault(require("lodash/get"));
|
|
23
|
-
|
|
24
15
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
25
|
-
|
|
26
|
-
function
|
|
27
|
-
|
|
28
|
-
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; }
|
|
29
|
-
|
|
16
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
17
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
30
18
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
31
|
-
|
|
32
19
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
33
|
-
|
|
34
20
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
35
|
-
|
|
36
|
-
function
|
|
37
|
-
|
|
38
|
-
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
39
|
-
|
|
40
|
-
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
41
|
-
|
|
21
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
22
|
+
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
23
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } // lodash
|
|
42
24
|
var _ = {
|
|
43
25
|
get: _get["default"]
|
|
44
26
|
};
|
|
45
|
-
|
|
46
27
|
var ImgContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
|
47
28
|
displayName: "image-with-fallback__ImgContainer",
|
|
48
29
|
componentId: "qk0kiz-0"
|
|
49
30
|
})(["width:100%;height:100%;position:relative;"]);
|
|
50
|
-
|
|
51
31
|
var ImgObjectFit = /*#__PURE__*/(0, _styledComponents["default"])(ImgContainer).withConfig({
|
|
52
32
|
displayName: "image-with-fallback__ImgObjectFit",
|
|
53
33
|
componentId: "qk0kiz-1"
|
|
@@ -66,53 +46,45 @@ var LogoCenteringBlock = /*#__PURE__*/(0, _styledComponents["default"])(ImgConta
|
|
|
66
46
|
})(["position:absolute;justify-content:center;align-items:center;background-color:white;display:", ";> img{width:65%;height:65%;}"], function (props) {
|
|
67
47
|
return props.$display;
|
|
68
48
|
});
|
|
69
|
-
|
|
70
49
|
var Image = function Image(_ref) {
|
|
71
50
|
var src = _ref.src,
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
51
|
+
_ref$alt = _ref.alt,
|
|
52
|
+
alt = _ref$alt === void 0 ? '' : _ref$alt,
|
|
53
|
+
_ref$srcSet = _ref.srcSet,
|
|
54
|
+
srcSet = _ref$srcSet === void 0 ? '' : _ref$srcSet,
|
|
55
|
+
_ref$releaseBranch = _ref.releaseBranch,
|
|
56
|
+
releaseBranch = _ref$releaseBranch === void 0 ? _releaseBranch.BRANCH.master : _ref$releaseBranch;
|
|
79
57
|
var _useState = (0, _react.useState)(false),
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
58
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
59
|
+
isObjectFit = _useState2[0],
|
|
60
|
+
setIsObjectFit = _useState2[1];
|
|
84
61
|
var _useState3 = (0, _react.useState)(false),
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
62
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
63
|
+
isImgOnLoad = _useState4[0],
|
|
64
|
+
setIsImgOnLoad = _useState4[1];
|
|
89
65
|
var imgNode = (0, _react.useRef)(null);
|
|
90
66
|
(0, _react.useEffect)(function () {
|
|
91
67
|
setIsObjectFit('objectFit' in _.get(document, 'documentElement.style'));
|
|
92
|
-
}, []);
|
|
68
|
+
}, []);
|
|
69
|
+
|
|
70
|
+
// Check if img is already loaded, and cached on the browser.
|
|
93
71
|
// If cached, React.img won't trigger onLoad event.
|
|
94
72
|
// Hence, we need to trigger re-rendering.
|
|
95
|
-
|
|
96
73
|
(0, _react.useEffect)(function () {
|
|
97
74
|
if (!imgNode.current) {
|
|
98
75
|
return;
|
|
99
76
|
}
|
|
100
|
-
|
|
101
77
|
setIsImgOnLoad(imgNode.current.complete);
|
|
102
78
|
}, [imgNode]);
|
|
103
|
-
|
|
104
79
|
var handleImgOnLoad = function handleImgOnLoad() {
|
|
105
80
|
setIsImgOnLoad(true);
|
|
106
81
|
};
|
|
107
|
-
|
|
108
82
|
var logoDisplay = 'flex';
|
|
109
|
-
|
|
110
83
|
if (!isObjectFit) {
|
|
111
84
|
logoDisplay = 'none';
|
|
112
85
|
} else if (isImgOnLoad) {
|
|
113
86
|
logoDisplay = 'none';
|
|
114
87
|
}
|
|
115
|
-
|
|
116
88
|
var ImgJSX = isObjectFit ? /*#__PURE__*/_react["default"].createElement(ImgObjectFit, {
|
|
117
89
|
$opacity: isImgOnLoad ? 1 : 0
|
|
118
90
|
}, /*#__PURE__*/_react["default"].createElement("img", {
|
|
@@ -130,12 +102,10 @@ var Image = function Image(_ref) {
|
|
|
130
102
|
releaseBranch: releaseBranch
|
|
131
103
|
})), ImgJSX);
|
|
132
104
|
};
|
|
133
|
-
|
|
134
105
|
Image.propTypes = {
|
|
135
106
|
alt: _propTypes["default"].string,
|
|
136
107
|
src: _propTypes["default"].string.isRequired,
|
|
137
108
|
srcSet: _propTypes["default"].string,
|
|
138
109
|
releaseBranch: _releaseBranch.BRANCH_PROP_TYPES
|
|
139
110
|
};
|
|
140
|
-
var _default = Image;
|
|
141
|
-
exports["default"] = _default;
|
|
111
|
+
var _default = exports["default"] = Image;
|
|
@@ -1,75 +1,49 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
function _typeof(
|
|
4
|
-
|
|
3
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports["default"] = void 0;
|
|
9
|
-
|
|
10
8
|
var _react = _interopRequireWildcard(require("react"));
|
|
11
|
-
|
|
12
9
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
13
|
-
|
|
14
10
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
15
|
-
|
|
16
11
|
var _theme = require("../utils/theme");
|
|
17
|
-
|
|
18
12
|
var _enums = require("../enums");
|
|
19
|
-
|
|
20
13
|
var _icon = require("../../icon");
|
|
21
|
-
|
|
22
14
|
var _button = require("../../button");
|
|
23
|
-
|
|
24
15
|
var _mediaQuery = _interopRequireDefault(require("@twreporter/core/lib/utils/media-query"));
|
|
25
|
-
|
|
26
16
|
var _releaseBranch = require("@twreporter/core/lib/constants/release-branch");
|
|
27
|
-
|
|
28
17
|
var _theme2 = require("@twreporter/core/lib/constants/theme");
|
|
29
|
-
|
|
30
18
|
var _get = _interopRequireDefault(require("lodash/get"));
|
|
31
|
-
|
|
32
19
|
var _excluded = ["placeholder", "theme", "releaseBranch", "onSearch", "onClose", "handleBlur", "autofocus", "widthType"];
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
20
|
+
var _templateObject, _templateObject2; // utils
|
|
21
|
+
// enums
|
|
22
|
+
// components
|
|
23
|
+
// @twreporter
|
|
24
|
+
// lodash
|
|
36
25
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
37
|
-
|
|
38
|
-
function
|
|
39
|
-
|
|
40
|
-
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; }
|
|
41
|
-
|
|
26
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
27
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
42
28
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
43
|
-
|
|
44
29
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
45
|
-
|
|
46
30
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
47
|
-
|
|
48
31
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
49
|
-
|
|
50
|
-
function
|
|
51
|
-
|
|
52
|
-
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
53
|
-
|
|
32
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
33
|
+
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
54
34
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
55
|
-
|
|
56
35
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
57
|
-
|
|
58
36
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
59
|
-
|
|
60
37
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
61
|
-
|
|
62
38
|
var _ = {
|
|
63
39
|
get: _get["default"]
|
|
64
40
|
};
|
|
65
|
-
|
|
66
41
|
var InputContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
|
67
42
|
displayName: "search-bar__InputContainer",
|
|
68
43
|
componentId: "sc-1mjh7mz-0"
|
|
69
44
|
})(["display:flex;align-items:center;padding:8px 16px;border:none;border-radius:40px;background-color:", ";"], function (props) {
|
|
70
45
|
return props.$bgColor;
|
|
71
46
|
});
|
|
72
|
-
|
|
73
47
|
var Container = /*#__PURE__*/_styledComponents["default"].form.withConfig({
|
|
74
48
|
displayName: "search-bar__Container",
|
|
75
49
|
componentId: "sc-1mjh7mz-1"
|
|
@@ -82,7 +56,6 @@ var Container = /*#__PURE__*/_styledComponents["default"].form.withConfig({
|
|
|
82
56
|
}, _mediaQuery["default"].desktopAndAbove(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n ", "\n "])), function (props) {
|
|
83
57
|
return props.$focus ? "\n background-color: ".concat(props.$desktopBgColor, ";\n ") : '';
|
|
84
58
|
}));
|
|
85
|
-
|
|
86
59
|
var Input = /*#__PURE__*/_styledComponents["default"].input.withConfig({
|
|
87
60
|
displayName: "search-bar__Input",
|
|
88
61
|
componentId: "sc-1mjh7mz-2"
|
|
@@ -93,87 +66,71 @@ var Input = /*#__PURE__*/_styledComponents["default"].input.withConfig({
|
|
|
93
66
|
}, function (props) {
|
|
94
67
|
return props.$placeholderColor;
|
|
95
68
|
});
|
|
96
|
-
|
|
97
69
|
var DesktopOnlyIconButton = /*#__PURE__*/(0, _styledComponents["default"])(_button.IconButton).withConfig({
|
|
98
70
|
displayName: "search-bar__DesktopOnlyIconButton",
|
|
99
71
|
componentId: "sc-1mjh7mz-3"
|
|
100
72
|
})(["margin-left:8px;", ""], _mediaQuery["default"].tabletAndBelow(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: none;\n "]))));
|
|
101
|
-
|
|
102
73
|
var defaultFunc = function defaultFunc() {};
|
|
103
|
-
|
|
104
74
|
var SearchBar = function SearchBar(_ref) {
|
|
105
75
|
var _ref$placeholder = _ref.placeholder,
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
76
|
+
placeholder = _ref$placeholder === void 0 ? '' : _ref$placeholder,
|
|
77
|
+
_ref$theme = _ref.theme,
|
|
78
|
+
theme = _ref$theme === void 0 ? _theme2.THEME.normal : _ref$theme,
|
|
79
|
+
_ref$releaseBranch = _ref.releaseBranch,
|
|
80
|
+
releaseBranch = _ref$releaseBranch === void 0 ? _releaseBranch.BRANCH.master : _ref$releaseBranch,
|
|
81
|
+
_ref$onSearch = _ref.onSearch,
|
|
82
|
+
onSearch = _ref$onSearch === void 0 ? defaultFunc : _ref$onSearch,
|
|
83
|
+
_ref$onClose = _ref.onClose,
|
|
84
|
+
onClose = _ref$onClose === void 0 ? defaultFunc : _ref$onClose,
|
|
85
|
+
_ref$handleBlur = _ref.handleBlur,
|
|
86
|
+
handleBlur = _ref$handleBlur === void 0 ? defaultFunc : _ref$handleBlur,
|
|
87
|
+
_ref$autofocus = _ref.autofocus,
|
|
88
|
+
autofocus = _ref$autofocus === void 0 ? true : _ref$autofocus,
|
|
89
|
+
_ref$widthType = _ref.widthType,
|
|
90
|
+
widthType = _ref$widthType === void 0 ? _enums.WidthType.FIT : _ref$widthType,
|
|
91
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
123
92
|
var _useState = (0, _react.useState)(''),
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
93
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
94
|
+
keywords = _useState2[0],
|
|
95
|
+
setKeywords = _useState2[1];
|
|
128
96
|
var _useState3 = (0, _react.useState)(false),
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
97
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
98
|
+
focus = _useState4[0],
|
|
99
|
+
setFocus = _useState4[1];
|
|
133
100
|
var _selectThemeStyle = (0, _theme.selectThemeStyle)(theme),
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
101
|
+
bgColor = _selectThemeStyle.bgColor,
|
|
102
|
+
focusBgColor = _selectThemeStyle.focusBgColor,
|
|
103
|
+
desktopBgColor = _selectThemeStyle.desktopBgColor,
|
|
104
|
+
borderColor = _selectThemeStyle.borderColor,
|
|
105
|
+
color = _selectThemeStyle.color,
|
|
106
|
+
focusColor = _selectThemeStyle.focusColor,
|
|
107
|
+
placeholderColor = _selectThemeStyle.placeholderColor;
|
|
142
108
|
var SearchIcon = /*#__PURE__*/_react["default"].createElement(_icon.Search, {
|
|
143
109
|
releaseBranch: releaseBranch
|
|
144
110
|
});
|
|
145
|
-
|
|
146
111
|
var CrossIcon = /*#__PURE__*/_react["default"].createElement(_icon.Cross, {
|
|
147
112
|
releaseBranch: releaseBranch
|
|
148
113
|
});
|
|
149
|
-
|
|
150
114
|
var onFocus = function onFocus() {
|
|
151
115
|
setFocus(true);
|
|
152
116
|
};
|
|
153
|
-
|
|
154
117
|
var onBlur = function onBlur() {
|
|
155
118
|
setFocus(false);
|
|
156
119
|
handleBlur();
|
|
157
120
|
};
|
|
158
|
-
|
|
159
121
|
var onSubmit = function onSubmit(e) {
|
|
160
122
|
e.preventDefault();
|
|
161
123
|
onSearch(keywords);
|
|
162
124
|
};
|
|
163
|
-
|
|
164
125
|
var onChange = function onChange(e) {
|
|
165
126
|
e.preventDefault();
|
|
166
|
-
|
|
167
127
|
var input = _.get(e, 'target.value', '');
|
|
168
|
-
|
|
169
128
|
setKeywords(input);
|
|
170
129
|
};
|
|
171
|
-
|
|
172
130
|
var onReset = function onReset(e) {
|
|
173
131
|
e.preventDefault();
|
|
174
132
|
setKeywords('');
|
|
175
133
|
};
|
|
176
|
-
|
|
177
134
|
return /*#__PURE__*/_react["default"].createElement(Container, _extends({
|
|
178
135
|
noValidate: "novalidate",
|
|
179
136
|
onSubmit: onSubmit,
|
|
@@ -206,7 +163,6 @@ var SearchBar = function SearchBar(_ref) {
|
|
|
206
163
|
onClick: onClose
|
|
207
164
|
}));
|
|
208
165
|
};
|
|
209
|
-
|
|
210
166
|
SearchBar.propTypes = {
|
|
211
167
|
placeholder: _propTypes["default"].string,
|
|
212
168
|
theme: _propTypes["default"].oneOf(Object.values(_theme2.THEME)),
|
|
@@ -219,5 +175,4 @@ SearchBar.propTypes = {
|
|
|
219
175
|
};
|
|
220
176
|
SearchBar.THEME = _theme2.THEME;
|
|
221
177
|
SearchBar.WidthType = _enums.WidthType;
|
|
222
|
-
var _default = SearchBar;
|
|
223
|
-
exports["default"] = _default;
|
|
178
|
+
var _default = exports["default"] = SearchBar;
|
|
@@ -4,37 +4,26 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports["default"] = void 0;
|
|
7
|
-
|
|
8
7
|
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
|
|
10
8
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
11
|
-
|
|
12
9
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
13
|
-
|
|
14
10
|
var _enums = require("../enums");
|
|
15
|
-
|
|
16
11
|
var _color = require("@twreporter/core/lib/constants/color");
|
|
17
|
-
|
|
18
12
|
var _paragraph = require("../../text/paragraph");
|
|
19
|
-
|
|
20
13
|
var _excluded = ["placeholder", "align", "state", "message", "onSubmit", "onChange", "className"];
|
|
21
|
-
|
|
22
14
|
var _textColor, _messageColor;
|
|
23
|
-
|
|
24
15
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
25
|
-
|
|
16
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
26
17
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
27
|
-
|
|
28
18
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
29
|
-
|
|
30
19
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
31
|
-
|
|
32
|
-
function
|
|
33
|
-
|
|
20
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
21
|
+
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
22
|
+
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); } // enum
|
|
23
|
+
// @twreporter
|
|
34
24
|
var textColor = (_textColor = {}, _defineProperty(_textColor, _enums.TextState.DEFAULT, _color.colorGrayscale.gray800), _defineProperty(_textColor, _enums.TextState.ERROR, _color.colorGrayscale.gray800), _defineProperty(_textColor, _enums.TextState.DISABLED, _color.colorGrayscale.gray500), _textColor);
|
|
35
25
|
var messageColor = (_messageColor = {}, _defineProperty(_messageColor, _enums.TextState.DEFAULT, _color.colorGrayscale.gray800), _defineProperty(_messageColor, _enums.TextState.ERROR, _color.COLOR_SEMANTIC.danger), _defineProperty(_messageColor, _enums.TextState.DISABLED, _color.colorGrayscale.gray500), _messageColor);
|
|
36
26
|
var borderColor = messageColor;
|
|
37
|
-
|
|
38
27
|
var Input = /*#__PURE__*/_styledComponents["default"].input.withConfig({
|
|
39
28
|
displayName: "text-field__Input",
|
|
40
29
|
componentId: "ld9aag-0"
|
|
@@ -43,14 +32,12 @@ var Input = /*#__PURE__*/_styledComponents["default"].input.withConfig({
|
|
|
43
32
|
}, function (props) {
|
|
44
33
|
return borderColor[props.$state];
|
|
45
34
|
}, _color.colorGrayscale.gray400);
|
|
46
|
-
|
|
47
35
|
var Message = /*#__PURE__*/(0, _styledComponents["default"])(_paragraph.P3).withConfig({
|
|
48
36
|
displayName: "text-field__Message",
|
|
49
37
|
componentId: "ld9aag-1"
|
|
50
38
|
})(["color:", ";margin-top:8px;"], function (props) {
|
|
51
39
|
return messageColor[props.$state];
|
|
52
40
|
});
|
|
53
|
-
|
|
54
41
|
var Container = /*#__PURE__*/_styledComponents["default"].form.withConfig({
|
|
55
42
|
displayName: "text-field__Container",
|
|
56
43
|
componentId: "ld9aag-2"
|
|
@@ -59,36 +46,31 @@ var Container = /*#__PURE__*/_styledComponents["default"].form.withConfig({
|
|
|
59
46
|
}, function (props) {
|
|
60
47
|
return props.$align;
|
|
61
48
|
});
|
|
62
|
-
|
|
63
49
|
var defaultFunc = function defaultFunc() {};
|
|
64
|
-
|
|
65
50
|
var TextField = function TextField(_ref) {
|
|
66
51
|
var _ref$placeholder = _ref.placeholder,
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
52
|
+
placeholder = _ref$placeholder === void 0 ? '' : _ref$placeholder,
|
|
53
|
+
_ref$align = _ref.align,
|
|
54
|
+
align = _ref$align === void 0 ? _enums.TextAlign.LEFT : _ref$align,
|
|
55
|
+
_ref$state = _ref.state,
|
|
56
|
+
state = _ref$state === void 0 ? _enums.TextState.DEFAULT : _ref$state,
|
|
57
|
+
_ref$message = _ref.message,
|
|
58
|
+
message = _ref$message === void 0 ? '' : _ref$message,
|
|
59
|
+
_ref$onSubmit = _ref.onSubmit,
|
|
60
|
+
onSubmit = _ref$onSubmit === void 0 ? defaultFunc : _ref$onSubmit,
|
|
61
|
+
_ref$onChange = _ref.onChange,
|
|
62
|
+
onChange = _ref$onChange === void 0 ? defaultFunc : _ref$onChange,
|
|
63
|
+
_ref$className = _ref.className,
|
|
64
|
+
className = _ref$className === void 0 ? '' : _ref$className,
|
|
65
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
82
66
|
var handleSubmit = function handleSubmit(e) {
|
|
83
67
|
e.preventDefault();
|
|
84
68
|
e.stopPropagation();
|
|
85
69
|
onSubmit(e.target.input.value);
|
|
86
70
|
};
|
|
87
|
-
|
|
88
71
|
var handleChange = function handleChange(e) {
|
|
89
72
|
onChange(e.target.value, e.target.checkValidity());
|
|
90
73
|
};
|
|
91
|
-
|
|
92
74
|
return /*#__PURE__*/_react["default"].createElement(Container, {
|
|
93
75
|
onSubmit: handleSubmit,
|
|
94
76
|
$align: align,
|
|
@@ -104,7 +86,6 @@ var TextField = function TextField(_ref) {
|
|
|
104
86
|
$state: state
|
|
105
87
|
}));
|
|
106
88
|
};
|
|
107
|
-
|
|
108
89
|
TextField.propTypes = {
|
|
109
90
|
placeholder: _propTypes["default"].string,
|
|
110
91
|
align: _propTypes["default"].oneOf(Object.values(_enums.TextAlign)),
|
|
@@ -116,5 +97,4 @@ TextField.propTypes = {
|
|
|
116
97
|
};
|
|
117
98
|
TextField.Align = _enums.TextAlign;
|
|
118
99
|
TextField.State = _enums.TextState;
|
|
119
|
-
var _default = TextField;
|
|
120
|
-
exports["default"] = _default;
|
|
100
|
+
var _default = exports["default"] = TextField;
|
package/lib/input/enums/index.js
CHANGED
|
@@ -5,20 +5,18 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.WidthType = exports.TextState = exports.TextAlign = void 0;
|
|
7
7
|
// enums for search-bar
|
|
8
|
-
var WidthType = Object.freeze({
|
|
8
|
+
var WidthType = exports.WidthType = Object.freeze({
|
|
9
9
|
FIT: 'fit',
|
|
10
10
|
STRETCH: 'stretch'
|
|
11
|
-
});
|
|
11
|
+
});
|
|
12
12
|
|
|
13
|
-
|
|
14
|
-
var TextAlign = Object.freeze({
|
|
13
|
+
// enums for text-field
|
|
14
|
+
var TextAlign = exports.TextAlign = Object.freeze({
|
|
15
15
|
LEFT: 'left',
|
|
16
16
|
CENTER: 'center'
|
|
17
17
|
});
|
|
18
|
-
exports.
|
|
19
|
-
var TextState = Object.freeze({
|
|
18
|
+
var TextState = exports.TextState = Object.freeze({
|
|
20
19
|
DEFAULT: 'default',
|
|
21
20
|
ERROR: 'error',
|
|
22
21
|
DISABLED: 'disabled'
|
|
23
|
-
});
|
|
24
|
-
exports.TextState = TextState;
|
|
22
|
+
});
|