@twreporter/react-components 8.21.0-rc.1 → 8.21.0-rc.10
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 +101 -0
- package/lib/badge/badge.stories.js +7 -13
- package/lib/bookmark-list/stories/bookmark.stories.js +10 -9
- package/lib/button/components/link.js +38 -7
- package/lib/button/index.js +14 -1
- package/lib/button/stories/iconButton.stories.js +19 -22
- package/lib/button/stories/iconWithTextButton.stories.js +21 -24
- package/lib/button/stories/link.stories.js +95 -51
- package/lib/button/stories/menuButton.stories.js +11 -16
- package/lib/button/stories/pillButton.stories.js +38 -41
- package/lib/button/stories/textButton.stories.js +48 -51
- package/lib/button/stories/toggleButton.stories.js +9 -15
- package/lib/card/stories/articleCard.stories.js +20 -18
- package/lib/card/stories/dialog.stories.js +15 -14
- package/lib/checkbox/checkbox.stories.js +10 -16
- package/lib/divider.stories.js +30 -28
- package/lib/empty-state/stories/empty-guide.stories.js +10 -15
- package/lib/icon/stories/arrow.stories.js +38 -42
- package/lib/icon/stories/article.stories.js +1 -9
- package/lib/icon/stories/bookmark.stories.js +30 -35
- package/lib/icon/stories/changeIconColor.stories.js +1 -5
- package/lib/icon/stories/clock.stories.js +1 -9
- package/lib/icon/stories/copy.stories.js +1 -9
- package/lib/icon/stories/cross.stories.js +1 -9
- package/lib/icon/stories/hamburger.stories.js +1 -9
- package/lib/icon/stories/home.stories.js +1 -9
- package/lib/icon/stories/letter.stories.js +1 -9
- package/lib/icon/stories/loading.stories.js +1 -9
- package/lib/icon/stories/member.stories.js +1 -9
- package/lib/icon/stories/printer.stories.js +1 -9
- package/lib/icon/stories/search.stories.js +1 -9
- package/lib/icon/stories/share.stories.js +1 -9
- package/lib/icon/stories/socialMedia.stories.js +1 -9
- package/lib/icon/stories/text.stories.js +1 -9
- package/lib/icon/stories/topic.stories.js +1 -9
- package/lib/input/stories/search-bar.stories.js +12 -17
- package/lib/input/stories/text-field.stories.js +15 -14
- package/lib/listing-page/stories/cardList.stories.js +52 -57
- package/lib/logo/stories/logoFooter.stories.js +1 -7
- package/lib/logo/stories/logoHeader.stories.js +5 -10
- package/lib/logo/stories/logoLoadingFallback.stories.js +1 -7
- package/lib/logo/stories/logoSymbol.stories.js +5 -10
- package/lib/mobile-member-role-card/index.js +95 -57
- package/lib/mobile-member-role-card/stories/member-role-card.stories.js +14 -13
- package/lib/simple-header/simpleHeader.stories.js +3 -9
- package/lib/snack-bar/stories/snackBar.stories.js +18 -20
- package/lib/text/paragraph.js +2 -2
- package/lib/text/stories/headline.stories.js +72 -74
- package/lib/text/stories/paragraph.stories.js +48 -50
- package/lib/title-bar/stories/bar.stories.js +15 -19
- package/lib/title-bar/stories/tab.stories.js +252 -256
- package/package.json +21 -14
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,107 @@
|
|
|
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.21.0-rc.10](https://github.com/twreporter/twreporter-npm-packages/compare/@twreporter/react-components@8.21.0-rc.9...@twreporter/react-components@8.21.0-rc.10) (2023-11-16)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Bug Fixes
|
|
10
|
+
|
|
11
|
+
* add default value for `link in p` story ([fdb017b](https://github.com/twreporter/twreporter-npm-packages/commit/fdb017b206f0a957c712136438cfba10844fcd5a))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
# [8.21.0-rc.9](https://github.com/twreporter/twreporter-npm-packages/compare/@twreporter/react-components@8.21.0-rc.8...@twreporter/react-components@8.21.0-rc.9) (2023-11-16)
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
### Bug Fixes
|
|
21
|
+
|
|
22
|
+
* mobile-member-role-card width ([d40e5ff](https://github.com/twreporter/twreporter-npm-packages/commit/d40e5ffa944d403e2061e66c41128de70c8cb025))
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
# [8.21.0-rc.8](https://github.com/twreporter/twreporter-npm-packages/compare/@twreporter/react-components@8.21.0-rc.7...@twreporter/react-components@8.21.0-rc.8) (2023-11-16)
|
|
29
|
+
|
|
30
|
+
**Note:** Version bump only for package @twreporter/react-components
|
|
31
|
+
|
|
32
|
+
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
|
|
36
|
+
# [8.21.0-rc.7](https://github.com/twreporter/twreporter-npm-packages/compare/@twreporter/react-components@8.21.0-rc.6...@twreporter/react-components@8.21.0-rc.7) (2023-11-16)
|
|
37
|
+
|
|
38
|
+
|
|
39
|
+
### Bug Fixes
|
|
40
|
+
|
|
41
|
+
* mobile role card text style ([f197cb7](https://github.com/twreporter/twreporter-npm-packages/commit/f197cb7711ee1b9f5120996e65382fa4e22aef76))
|
|
42
|
+
|
|
43
|
+
|
|
44
|
+
|
|
45
|
+
|
|
46
|
+
|
|
47
|
+
# [8.21.0-rc.6](https://github.com/twreporter/twreporter-npm-packages/compare/@twreporter/react-components@8.21.0-rc.5...@twreporter/react-components@8.21.0-rc.6) (2023-11-15)
|
|
48
|
+
|
|
49
|
+
|
|
50
|
+
### Bug Fixes
|
|
51
|
+
|
|
52
|
+
* `InheritLinkButton` cannot set link & style ([a1b1a64](https://github.com/twreporter/twreporter-npm-packages/commit/a1b1a6466f288e435b8bcc28c9c1cea2a2e667fc))
|
|
53
|
+
|
|
54
|
+
|
|
55
|
+
|
|
56
|
+
|
|
57
|
+
|
|
58
|
+
# [8.21.0-rc.5](https://github.com/twreporter/twreporter-npm-packages/compare/@twreporter/react-components@8.21.0-rc.4...@twreporter/react-components@8.21.0-rc.5) (2023-11-14)
|
|
59
|
+
|
|
60
|
+
|
|
61
|
+
### Bug Fixes
|
|
62
|
+
|
|
63
|
+
* paragraph margin block ([949efb7](https://github.com/twreporter/twreporter-npm-packages/commit/949efb7c2d3213b9e0ebc35bdbc3739a14fa8b0e))
|
|
64
|
+
|
|
65
|
+
|
|
66
|
+
|
|
67
|
+
|
|
68
|
+
|
|
69
|
+
# [8.21.0-rc.4](https://github.com/twreporter/twreporter-npm-packages/compare/@twreporter/react-components@8.21.0-rc.3...@twreporter/react-components@8.21.0-rc.4) (2023-11-14)
|
|
70
|
+
|
|
71
|
+
|
|
72
|
+
### Features
|
|
73
|
+
|
|
74
|
+
* upgrade storybook to v7 ([fa85736](https://github.com/twreporter/twreporter-npm-packages/commit/fa85736bd60eda26596bc89c5bccaf74892774f2))
|
|
75
|
+
|
|
76
|
+
|
|
77
|
+
|
|
78
|
+
|
|
79
|
+
|
|
80
|
+
# [8.21.0-rc.3](https://github.com/twreporter/twreporter-npm-packages/compare/@twreporter/react-components@8.21.0-rc.2...@twreporter/react-components@8.21.0-rc.3) (2023-11-13)
|
|
81
|
+
|
|
82
|
+
|
|
83
|
+
### Bug Fixes
|
|
84
|
+
|
|
85
|
+
* use Object.freeze and use en-US ([e4ff2a0](https://github.com/twreporter/twreporter-npm-packages/commit/e4ff2a0dda08003eb762d3009b6670b6c84cbcf1))
|
|
86
|
+
|
|
87
|
+
|
|
88
|
+
### Features
|
|
89
|
+
|
|
90
|
+
* new moblie member role card ([2e01669](https://github.com/twreporter/twreporter-npm-packages/commit/2e01669144c072d5bd89d88fe68b97d69e8b6e6f))
|
|
91
|
+
|
|
92
|
+
|
|
93
|
+
|
|
94
|
+
|
|
95
|
+
|
|
96
|
+
# [8.21.0-rc.2](https://github.com/twreporter/twreporter-npm-packages/compare/@twreporter/react-components@8.21.0-rc.1...@twreporter/react-components@8.21.0-rc.2) (2023-11-13)
|
|
97
|
+
|
|
98
|
+
|
|
99
|
+
### Features
|
|
100
|
+
|
|
101
|
+
* add `InheritLinkButton` component & story ([81788c5](https://github.com/twreporter/twreporter-npm-packages/commit/81788c5cbe4ac208656a83ae9dd565f1e06bb587))
|
|
102
|
+
|
|
103
|
+
|
|
104
|
+
|
|
105
|
+
|
|
106
|
+
|
|
6
107
|
# [8.21.0-rc.1](https://github.com/twreporter/twreporter-npm-packages/compare/@twreporter/react-components@8.21.0-rc.0...@twreporter/react-components@8.21.0-rc.1) (2023-11-13)
|
|
7
108
|
|
|
8
109
|
|
|
@@ -5,8 +5,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports["default"] = exports.badge = void 0;
|
|
7
7
|
|
|
8
|
-
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
|
|
10
8
|
var _ = _interopRequireDefault(require("."));
|
|
11
9
|
|
|
12
10
|
var _color = require("@twreporter/core/lib/constants/color");
|
|
@@ -18,15 +16,11 @@ var _default = {
|
|
|
18
16
|
component: _["default"]
|
|
19
17
|
};
|
|
20
18
|
exports["default"] = _default;
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
19
|
+
var badge = {
|
|
20
|
+
args: {
|
|
21
|
+
text: '不定期',
|
|
22
|
+
textColor: _color.colorBrand.heavy,
|
|
23
|
+
backgroundColor: 'white'
|
|
24
|
+
}
|
|
24
25
|
};
|
|
25
|
-
|
|
26
|
-
var badge = Template.bind({});
|
|
27
|
-
exports.badge = badge;
|
|
28
|
-
badge.args = {
|
|
29
|
-
text: '不定期',
|
|
30
|
-
textColor: _color.colorBrand.heavy,
|
|
31
|
-
backgroundColor: 'white'
|
|
32
|
-
};
|
|
26
|
+
exports.badge = badge;
|
|
@@ -11,18 +11,19 @@ var _bookmarks = _interopRequireDefault(require("../bookmarks"));
|
|
|
11
11
|
|
|
12
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
13
13
|
|
|
14
|
+
/* eslint react/display-name:0 */
|
|
14
15
|
var _default = {
|
|
15
16
|
title: 'Bookmark/Empty List',
|
|
16
17
|
component: _bookmarks["default"]
|
|
17
18
|
};
|
|
18
19
|
exports["default"] = _default;
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
20
|
+
var emptyList = {
|
|
21
|
+
render: function render() {
|
|
22
|
+
return /*#__PURE__*/_react["default"].createElement(_bookmarks["default"], null);
|
|
23
|
+
},
|
|
24
|
+
args: {
|
|
25
|
+
bookmarks: [],
|
|
26
|
+
total: 0
|
|
27
|
+
}
|
|
22
28
|
};
|
|
23
|
-
|
|
24
|
-
exports.emptyList = emptyList;
|
|
25
|
-
emptyList.args = {
|
|
26
|
-
bookmarks: [],
|
|
27
|
-
total: 0
|
|
28
|
-
};
|
|
29
|
+
exports.emptyList = emptyList;
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports["default"] = void 0;
|
|
6
|
+
exports["default"] = exports.InheritLinkButton = void 0;
|
|
7
7
|
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
|
|
@@ -19,7 +19,8 @@ var _enums = require("../enums");
|
|
|
19
19
|
|
|
20
20
|
var _color2 = require("@twreporter/core/lib/constants/color");
|
|
21
21
|
|
|
22
|
-
var _excluded = ["type", "link", "text", "weight", "TextComponent", "disabled"]
|
|
22
|
+
var _excluded = ["type", "link", "text", "weight", "TextComponent", "disabled"],
|
|
23
|
+
_excluded2 = ["type", "link", "text"];
|
|
23
24
|
|
|
24
25
|
var _decoration, _color;
|
|
25
26
|
|
|
@@ -37,16 +38,24 @@ var style = {
|
|
|
37
38
|
decoration: (_decoration = {}, _defineProperty(_decoration, _enums.LinkType.DEFAULT, 'none'), _defineProperty(_decoration, _enums.LinkType.UNDERLINE, 'underline'), _decoration),
|
|
38
39
|
color: (_color = {}, _defineProperty(_color, _enums.LinkType.DEFAULT, _color2.COLOR_SEMANTIC.info), _defineProperty(_color, _enums.LinkType.UNDERLINE, _color2.colorGrayscale.gray600), _color)
|
|
39
40
|
};
|
|
40
|
-
var
|
|
41
|
-
displayName: "
|
|
41
|
+
var BaseContainer = /*#__PURE__*/(0, _styledComponents["default"])(_customizedLink["default"]).withConfig({
|
|
42
|
+
displayName: "link__BaseContainer",
|
|
42
43
|
componentId: "g5z7t5-0"
|
|
43
|
-
})(["
|
|
44
|
+
})(["text-underline-offset:4px;text-decoration-line:", "!important;color:", ";&:hover{text-decoration-line:underline;}"], function (props) {
|
|
44
45
|
return style.decoration[props.type];
|
|
45
46
|
}, function (props) {
|
|
46
47
|
return style.color[props.type];
|
|
47
|
-
}, function (props) {
|
|
48
|
-
return props.disabled ? "\n opacity: 0.5;\n cursor: auto;\n -webkit-tap-highlight-color: transparent;\n " : "\n &:hover {\n text-decoration-line: underline;\n }\n ";
|
|
49
48
|
});
|
|
49
|
+
var LinkContainer = /*#__PURE__*/(0, _styledComponents["default"])(BaseContainer).withConfig({
|
|
50
|
+
displayName: "link__LinkContainer",
|
|
51
|
+
componentId: "g5z7t5-1"
|
|
52
|
+
})(["display:flex;align-items:center;", ""], function (props) {
|
|
53
|
+
return props.disabled ? "\n opacity: 0.5;\n cursor: auto;\n -webkit-tap-highlight-color: transparent;\n " : "\n ";
|
|
54
|
+
});
|
|
55
|
+
var InheritLinkContainer = /*#__PURE__*/(0, _styledComponents["default"])(BaseContainer).withConfig({
|
|
56
|
+
displayName: "link__InheritLinkContainer",
|
|
57
|
+
componentId: "g5z7t5-2"
|
|
58
|
+
})([""]);
|
|
50
59
|
|
|
51
60
|
var LinkButton = function LinkButton(_ref) {
|
|
52
61
|
var _ref$type = _ref.type,
|
|
@@ -86,5 +95,27 @@ LinkButton.propTypes = {
|
|
|
86
95
|
};
|
|
87
96
|
LinkButton.Type = _enums.LinkType;
|
|
88
97
|
LinkButton.Weight = _paragraph.P1.Weight;
|
|
98
|
+
|
|
99
|
+
var InheritLinkButton = function InheritLinkButton(_ref2) {
|
|
100
|
+
var _ref2$type = _ref2.type,
|
|
101
|
+
type = _ref2$type === void 0 ? _enums.LinkType.DEFAULT : _ref2$type,
|
|
102
|
+
_ref2$link = _ref2.link,
|
|
103
|
+
link = _ref2$link === void 0 ? {} : _ref2$link,
|
|
104
|
+
_ref2$text = _ref2.text,
|
|
105
|
+
text = _ref2$text === void 0 ? '' : _ref2$text,
|
|
106
|
+
props = _objectWithoutProperties(_ref2, _excluded2);
|
|
107
|
+
|
|
108
|
+
return /*#__PURE__*/_react["default"].createElement(InheritLinkContainer, _extends({
|
|
109
|
+
type: type
|
|
110
|
+
}, link, props), text);
|
|
111
|
+
};
|
|
112
|
+
|
|
113
|
+
exports.InheritLinkButton = InheritLinkButton;
|
|
114
|
+
InheritLinkButton.propTypes = {
|
|
115
|
+
type: _propTypes["default"].oneOf(Object.values(_enums.LinkType)),
|
|
116
|
+
link: _propTypes["default"].object,
|
|
117
|
+
text: _propTypes["default"].string.isRequired
|
|
118
|
+
};
|
|
119
|
+
InheritLinkButton.Type = _enums.LinkType;
|
|
89
120
|
var _default = LinkButton;
|
|
90
121
|
exports["default"] = _default;
|
package/lib/button/index.js
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
4
|
+
|
|
3
5
|
Object.defineProperty(exports, "__esModule", {
|
|
4
6
|
value: true
|
|
5
7
|
});
|
|
@@ -15,6 +17,12 @@ Object.defineProperty(exports, "IconWithTextButton", {
|
|
|
15
17
|
return _iconWithTextButton["default"];
|
|
16
18
|
}
|
|
17
19
|
});
|
|
20
|
+
Object.defineProperty(exports, "InheritLinkButton", {
|
|
21
|
+
enumerable: true,
|
|
22
|
+
get: function get() {
|
|
23
|
+
return _link.InheritLinkButton;
|
|
24
|
+
}
|
|
25
|
+
});
|
|
18
26
|
Object.defineProperty(exports, "LinkButton", {
|
|
19
27
|
enumerable: true,
|
|
20
28
|
get: function get() {
|
|
@@ -57,10 +65,14 @@ var _textButton = _interopRequireDefault(require("./components/textButton"));
|
|
|
57
65
|
|
|
58
66
|
var _toggleButton = _interopRequireDefault(require("./components/toggleButton"));
|
|
59
67
|
|
|
60
|
-
var _link =
|
|
68
|
+
var _link = _interopRequireWildcard(require("./components/link"));
|
|
61
69
|
|
|
62
70
|
var _menuButton = _interopRequireDefault(require("./components/menuButton"));
|
|
63
71
|
|
|
72
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
73
|
+
|
|
74
|
+
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; }
|
|
75
|
+
|
|
64
76
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
65
77
|
|
|
66
78
|
var _default = {
|
|
@@ -70,6 +82,7 @@ var _default = {
|
|
|
70
82
|
TextButton: _textButton["default"],
|
|
71
83
|
ToggleButton: _toggleButton["default"],
|
|
72
84
|
LinkButton: _link["default"],
|
|
85
|
+
InheritLinkButton: _link.InheritLinkButton,
|
|
73
86
|
MenuButton: _menuButton["default"]
|
|
74
87
|
};
|
|
75
88
|
exports["default"] = _default;
|
|
@@ -28,28 +28,25 @@ var _default = {
|
|
|
28
28
|
}
|
|
29
29
|
};
|
|
30
30
|
exports["default"] = _default;
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
31
|
+
var iconButton = {
|
|
32
|
+
args: {
|
|
33
|
+
iconComponent: /*#__PURE__*/_react["default"].createElement(_icon.Arrow, {
|
|
34
|
+
direction: "down"
|
|
35
|
+
}),
|
|
36
|
+
theme: _iconButton["default"].THEME.normal,
|
|
37
|
+
type: _iconButton["default"].Type.PRIMARY,
|
|
38
|
+
disabled: false,
|
|
39
|
+
active: false
|
|
40
|
+
}
|
|
34
41
|
};
|
|
35
|
-
|
|
36
|
-
var iconButton = Template.bind({});
|
|
37
42
|
exports.iconButton = iconButton;
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
43
|
+
var shareButton = {
|
|
44
|
+
args: {
|
|
45
|
+
iconComponent: /*#__PURE__*/_react["default"].createElement(_icon.Share, null),
|
|
46
|
+
theme: _iconButton["default"].THEME.normal,
|
|
47
|
+
type: _iconButton["default"].Type.PRIMARY,
|
|
48
|
+
disabled: false,
|
|
49
|
+
active: false
|
|
50
|
+
}
|
|
46
51
|
};
|
|
47
|
-
|
|
48
|
-
exports.shareButton = shareButton;
|
|
49
|
-
shareButton.args = {
|
|
50
|
-
iconComponent: /*#__PURE__*/_react["default"].createElement(_icon.Share, null),
|
|
51
|
-
theme: _iconButton["default"].THEME.normal,
|
|
52
|
-
type: _iconButton["default"].Type.PRIMARY,
|
|
53
|
-
disabled: false,
|
|
54
|
-
active: false
|
|
55
|
-
};
|
|
52
|
+
exports.shareButton = shareButton;
|
|
@@ -23,30 +23,27 @@ var _default = {
|
|
|
23
23
|
}
|
|
24
24
|
};
|
|
25
25
|
exports["default"] = _default;
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
26
|
+
var iconWithTextButton = {
|
|
27
|
+
args: {
|
|
28
|
+
text: '文字',
|
|
29
|
+
iconComponent: /*#__PURE__*/_react["default"].createElement(_icon.Arrow, {
|
|
30
|
+
direction: "down"
|
|
31
|
+
}),
|
|
32
|
+
theme: _iconWithTextButton["default"].THEME.normal,
|
|
33
|
+
disabled: false,
|
|
34
|
+
active: false,
|
|
35
|
+
hideText: false
|
|
36
|
+
}
|
|
29
37
|
};
|
|
30
|
-
|
|
31
|
-
var iconWithTextButton = Template.bind({});
|
|
32
38
|
exports.iconWithTextButton = iconWithTextButton;
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
39
|
+
var shareButton = {
|
|
40
|
+
args: {
|
|
41
|
+
text: '分享',
|
|
42
|
+
iconComponent: /*#__PURE__*/_react["default"].createElement(_icon.Share, null),
|
|
43
|
+
theme: _iconWithTextButton["default"].THEME.normal,
|
|
44
|
+
disabled: false,
|
|
45
|
+
active: false,
|
|
46
|
+
hideText: false
|
|
47
|
+
}
|
|
42
48
|
};
|
|
43
|
-
|
|
44
|
-
exports.shareButton = shareButton;
|
|
45
|
-
shareButton.args = {
|
|
46
|
-
text: '分享',
|
|
47
|
-
iconComponent: /*#__PURE__*/_react["default"].createElement(_icon.Share, null),
|
|
48
|
-
theme: _iconWithTextButton["default"].THEME.normal,
|
|
49
|
-
disabled: false,
|
|
50
|
-
active: false,
|
|
51
|
-
hideText: false
|
|
52
|
-
};
|
|
49
|
+
exports.shareButton = shareButton;
|
|
@@ -1,27 +1,37 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
4
|
+
|
|
3
5
|
Object.defineProperty(exports, "__esModule", {
|
|
4
6
|
value: true
|
|
5
7
|
});
|
|
6
|
-
exports.link = exports.disabledLink = exports["default"] = exports.changeTextComponent = void 0;
|
|
8
|
+
exports.linkInParagraph = exports.link = exports.disabledLink = exports["default"] = exports.changeTextComponent = void 0;
|
|
7
9
|
|
|
8
10
|
var _react = _interopRequireDefault(require("react"));
|
|
9
11
|
|
|
12
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
13
|
+
|
|
10
14
|
var _getEnumArg = require("../../storybook/utils/get-enum-arg");
|
|
11
15
|
|
|
12
|
-
var _link =
|
|
16
|
+
var _link = _interopRequireWildcard(require("../components/link"));
|
|
13
17
|
|
|
14
18
|
var _paragraph = require("../../text/paragraph");
|
|
15
19
|
|
|
16
20
|
var _headline = require("../../text/headline");
|
|
17
21
|
|
|
22
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
23
|
+
|
|
24
|
+
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; }
|
|
25
|
+
|
|
18
26
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
19
27
|
|
|
28
|
+
/* eslint react/display-name:0 */
|
|
20
29
|
var _default = {
|
|
21
30
|
title: 'Button/Link',
|
|
22
31
|
component: _link["default"],
|
|
23
32
|
argTypes: {
|
|
24
33
|
type: (0, _getEnumArg.getRadioArg)(_link["default"].Type, _link["default"].Type.DEFAULT),
|
|
34
|
+
weight: (0, _getEnumArg.getRadioArg)(_link["default"].Weight, _link["default"].Weight.NORMAL),
|
|
25
35
|
// textComponent is only for storybook showcase, not real props
|
|
26
36
|
textComponent: {
|
|
27
37
|
defaultValue: 'P2',
|
|
@@ -29,68 +39,102 @@ var _default = {
|
|
|
29
39
|
control: {
|
|
30
40
|
type: 'radio'
|
|
31
41
|
}
|
|
42
|
+
},
|
|
43
|
+
// leftWord & rightWord is only for storybook showcase, not real props
|
|
44
|
+
leftWord: {
|
|
45
|
+
defaultValue: '連結左邊的文字',
|
|
46
|
+
control: {
|
|
47
|
+
type: 'text'
|
|
48
|
+
}
|
|
49
|
+
},
|
|
50
|
+
rightWord: {
|
|
51
|
+
defaultValue: '連結左邊的文字',
|
|
52
|
+
control: {
|
|
53
|
+
type: 'text'
|
|
54
|
+
}
|
|
32
55
|
}
|
|
33
56
|
}
|
|
34
57
|
};
|
|
35
58
|
exports["default"] = _default;
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
}
|
|
49
|
-
};
|
|
50
|
-
link.parameters = {
|
|
51
|
-
controls: {
|
|
52
|
-
exclude: ['textComponent']
|
|
59
|
+
var link = {
|
|
60
|
+
args: {
|
|
61
|
+
text: '文字',
|
|
62
|
+
type: _link["default"].Type.DEFAULT,
|
|
63
|
+
link: {
|
|
64
|
+
to: 'https://www.twreporter.org'
|
|
65
|
+
}
|
|
66
|
+
},
|
|
67
|
+
parameters: {
|
|
68
|
+
controls: {
|
|
69
|
+
exclude: ['textComponent', 'leftWord', 'rightWord']
|
|
70
|
+
}
|
|
53
71
|
}
|
|
54
72
|
};
|
|
73
|
+
exports.link = link;
|
|
74
|
+
var changeTextComponent = {
|
|
75
|
+
render: function render(args) {
|
|
76
|
+
if (args.textComponent === 'P2') {
|
|
77
|
+
args.TextComponent = _paragraph.P2;
|
|
78
|
+
}
|
|
55
79
|
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
}
|
|
80
|
+
if (args.textComponent === 'H4') {
|
|
81
|
+
args.TextComponent = _headline.H4;
|
|
82
|
+
}
|
|
60
83
|
|
|
61
|
-
|
|
62
|
-
|
|
84
|
+
return /*#__PURE__*/_react["default"].createElement(_link["default"], args);
|
|
85
|
+
},
|
|
86
|
+
args: {
|
|
87
|
+
text: '文字',
|
|
88
|
+
type: _link["default"].Type.DEFAULT,
|
|
89
|
+
textComponent: 'P2',
|
|
90
|
+
link: {
|
|
91
|
+
to: 'https://www.twreporter.org'
|
|
92
|
+
}
|
|
93
|
+
},
|
|
94
|
+
parameters: {
|
|
95
|
+
controls: {
|
|
96
|
+
exclude: ['TextComponent', 'leftWord', 'rightWord']
|
|
97
|
+
}
|
|
63
98
|
}
|
|
64
|
-
|
|
65
|
-
return /*#__PURE__*/_react["default"].createElement(_link["default"], args);
|
|
66
99
|
};
|
|
67
|
-
|
|
68
100
|
exports.changeTextComponent = changeTextComponent;
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
101
|
+
var disabledLink = {
|
|
102
|
+
args: {
|
|
103
|
+
text: '文字',
|
|
104
|
+
type: _link["default"].Type.DEFAULT,
|
|
105
|
+
link: {
|
|
106
|
+
to: 'https://www.twreporter.org'
|
|
107
|
+
},
|
|
108
|
+
disabled: true
|
|
109
|
+
},
|
|
110
|
+
parameters: {
|
|
111
|
+
controls: {
|
|
112
|
+
exclude: ['textComponent', 'disabled', 'leftWord', 'rightWord']
|
|
113
|
+
}
|
|
80
114
|
}
|
|
81
115
|
};
|
|
82
|
-
var disabledLink = Template.bind({});
|
|
83
116
|
exports.disabledLink = disabledLink;
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
117
|
+
var StyledP1 = /*#__PURE__*/(0, _styledComponents["default"])(_paragraph.P1).withConfig({
|
|
118
|
+
displayName: "linkstories__StyledP1",
|
|
119
|
+
componentId: "sc-1i9kyc3-0"
|
|
120
|
+
})(["display:unset;"]);
|
|
121
|
+
var linkInParagraph = {
|
|
122
|
+
render: function render(args) {
|
|
123
|
+
return /*#__PURE__*/_react["default"].createElement(StyledP1, null, args.leftWord, /*#__PURE__*/_react["default"].createElement(_link.InheritLinkButton, args), args.rightWord);
|
|
89
124
|
},
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
125
|
+
args: {
|
|
126
|
+
text: '文字',
|
|
127
|
+
type: _link["default"].Type.DEFAULT,
|
|
128
|
+
link: {
|
|
129
|
+
to: 'https://www.twreporter.org'
|
|
130
|
+
},
|
|
131
|
+
leftWord: '~連結左邊~',
|
|
132
|
+
rightWord: '~連結右邊~'
|
|
133
|
+
},
|
|
134
|
+
parameters: {
|
|
135
|
+
controls: {
|
|
136
|
+
exclude: ['textComponent', 'disabled', 'weight', 'TextComponent']
|
|
137
|
+
}
|
|
95
138
|
}
|
|
96
|
-
};
|
|
139
|
+
};
|
|
140
|
+
exports.linkInParagraph = linkInParagraph;
|
|
@@ -5,8 +5,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.menuButton = exports["default"] = void 0;
|
|
7
7
|
|
|
8
|
-
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
|
|
10
8
|
var _menuButton = _interopRequireDefault(require("../components/menuButton"));
|
|
11
9
|
|
|
12
10
|
var _color = require("@twreporter/core/lib/constants/color");
|
|
@@ -23,18 +21,15 @@ var _default = {
|
|
|
23
21
|
}
|
|
24
22
|
};
|
|
25
23
|
exports["default"] = _default;
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
24
|
+
var menuButton = {
|
|
25
|
+
args: {
|
|
26
|
+
text: '文字',
|
|
27
|
+
link: {},
|
|
28
|
+
color: _color.colorGrayscale.gray800,
|
|
29
|
+
hoverBgColor: _color.colorGrayscale.gray100,
|
|
30
|
+
activeBgColor: _color.colorGrayscale.gray200,
|
|
31
|
+
paddingLeft: 32,
|
|
32
|
+
paddingRight: 32
|
|
33
|
+
}
|
|
29
34
|
};
|
|
30
|
-
|
|
31
|
-
exports.menuButton = menuButton;
|
|
32
|
-
menuButton.args = {
|
|
33
|
-
text: '文字',
|
|
34
|
-
link: {},
|
|
35
|
-
color: _color.colorGrayscale.gray800,
|
|
36
|
-
hoverBgColor: _color.colorGrayscale.gray100,
|
|
37
|
-
activeBgColor: _color.colorGrayscale.gray200,
|
|
38
|
-
paddingLeft: 32,
|
|
39
|
-
paddingRight: 32
|
|
40
|
-
};
|
|
35
|
+
exports.menuButton = menuButton;
|