@atlaskit/smart-card 23.10.1 → 23.10.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 +12 -0
- package/dist/cjs/messages.js +1 -1
- package/dist/cjs/version.json +1 -1
- package/dist/cjs/view/InlineCard/ForbiddenView/index.js +40 -18
- package/dist/cjs/view/InlineCard/IconAndTitleLayout/index.js +5 -2
- package/dist/cjs/view/InlineCard/IconAndTitleLayout/styled.js +1 -1
- package/dist/cjs/view/InlineCard/ResolvedView/index.js +2 -2
- package/dist/es2019/messages.js +1 -1
- package/dist/es2019/version.json +1 -1
- package/dist/es2019/view/InlineCard/ForbiddenView/index.js +40 -19
- package/dist/es2019/view/InlineCard/IconAndTitleLayout/index.js +6 -2
- package/dist/es2019/view/InlineCard/IconAndTitleLayout/styled.js +0 -3
- package/dist/es2019/view/InlineCard/ResolvedView/index.js +3 -3
- package/dist/esm/messages.js +1 -1
- package/dist/esm/version.json +1 -1
- package/dist/esm/view/InlineCard/ForbiddenView/index.js +40 -19
- package/dist/esm/view/InlineCard/IconAndTitleLayout/index.js +6 -2
- package/dist/esm/view/InlineCard/IconAndTitleLayout/styled.js +1 -1
- package/dist/esm/view/InlineCard/ResolvedView/index.js +3 -3
- package/dist/types/view/EmbedCard/components/styled.d.ts +64 -16
- package/dist/types/view/InlineCard/ForbiddenView/index.d.ts +3 -0
- package/dist/types/view/InlineCard/Frame/styled.d.ts +8 -2
- package/dist/types/view/InlineCard/Icon.d.ts +12 -3
- package/dist/types/view/InlineCard/IconAndTitleLayout/index.d.ts +4 -0
- package/dist/types/view/InlineCard/IconAndTitleLayout/styled.d.ts +36 -9
- package/dist/types/view/InlineCard/ResolvingView/styled.d.ts +6 -11
- package/dist/types/view/InlineCard/styled.d.ts +16 -8
- package/package.json +6 -6
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,17 @@
|
|
|
1
1
|
# @atlaskit/smart-card
|
|
2
2
|
|
|
3
|
+
## 23.10.3
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`bca078a37af`](https://bitbucket.org/atlassian/atlassian-frontend/commits/bca078a37af) - Bump to @emotion v11
|
|
8
|
+
|
|
9
|
+
## 23.10.2
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- [`cb819660949`](https://bitbucket.org/atlassian/atlassian-frontend/commits/cb819660949) - [ux] Add a lonzenge to restricted links.
|
|
14
|
+
|
|
3
15
|
## 23.10.1
|
|
4
16
|
|
|
5
17
|
### Patch Changes
|
package/dist/cjs/messages.js
CHANGED
|
@@ -135,7 +135,7 @@ var messages = (0, _reactIntlNext.defineMessages)({
|
|
|
135
135
|
},
|
|
136
136
|
invalid_permissions: {
|
|
137
137
|
id: 'fabric.linking.invalid_permissions',
|
|
138
|
-
defaultMessage: 'Restricted
|
|
138
|
+
defaultMessage: 'Restricted content',
|
|
139
139
|
description: 'Message shown when a user does not have permissions to view an item'
|
|
140
140
|
},
|
|
141
141
|
invalid_permissions_description: {
|
package/dist/cjs/version.json
CHANGED
|
@@ -45,6 +45,10 @@ var _reactIntlNext = require("react-intl-next");
|
|
|
45
45
|
|
|
46
46
|
var _styled = require("../styled");
|
|
47
47
|
|
|
48
|
+
var _lozenge = _interopRequireDefault(require("@atlaskit/lozenge"));
|
|
49
|
+
|
|
50
|
+
var _styled2 = require("../IconAndTitleLayout/styled");
|
|
51
|
+
|
|
48
52
|
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
|
|
49
53
|
|
|
50
54
|
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
@@ -61,6 +65,8 @@ var InlineCardForbiddenView = /*#__PURE__*/function (_React$Component) {
|
|
|
61
65
|
var _super = _createSuper(InlineCardForbiddenView);
|
|
62
66
|
|
|
63
67
|
function InlineCardForbiddenView() {
|
|
68
|
+
var _this$props, _this$props$requestAc;
|
|
69
|
+
|
|
64
70
|
var _this;
|
|
65
71
|
|
|
66
72
|
(0, _classCallCheck2.default)(this, InlineCardForbiddenView);
|
|
@@ -70,6 +76,9 @@ var InlineCardForbiddenView = /*#__PURE__*/function (_React$Component) {
|
|
|
70
76
|
}
|
|
71
77
|
|
|
72
78
|
_this = _super.call.apply(_super, [this].concat(args));
|
|
79
|
+
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
|
|
80
|
+
hasRequestAccessContextMessage: !!((_this$props = _this.props) !== null && _this$props !== void 0 && (_this$props$requestAc = _this$props.requestAccessContext) !== null && _this$props$requestAc !== void 0 && _this$props$requestAc.callToActionMessageKey)
|
|
81
|
+
});
|
|
73
82
|
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleRetry", function (event) {
|
|
74
83
|
var onAuthorise = _this.props.onAuthorise;
|
|
75
84
|
event.preventDefault();
|
|
@@ -78,15 +87,15 @@ var InlineCardForbiddenView = /*#__PURE__*/function (_React$Component) {
|
|
|
78
87
|
if (onAuthorise) {
|
|
79
88
|
onAuthorise();
|
|
80
89
|
} else {
|
|
81
|
-
var _this$
|
|
90
|
+
var _this$props2, _this$props2$requestA, _this$props2$requestA2;
|
|
82
91
|
|
|
83
|
-
(_this$
|
|
92
|
+
(_this$props2 = _this.props) === null || _this$props2 === void 0 ? void 0 : (_this$props2$requestA = _this$props2.requestAccessContext) === null || _this$props2$requestA === void 0 ? void 0 : (_this$props2$requestA2 = _this$props2$requestA.action) === null || _this$props2$requestA2 === void 0 ? void 0 : _this$props2$requestA2.promise();
|
|
84
93
|
}
|
|
85
94
|
});
|
|
86
95
|
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderForbiddenAccessMessage", function () {
|
|
87
|
-
var _this$
|
|
96
|
+
var _this$props3, _this$props3$requestA;
|
|
88
97
|
|
|
89
|
-
if ((_this$
|
|
98
|
+
if ((_this$props3 = _this.props) !== null && _this$props3 !== void 0 && (_this$props3$requestA = _this$props3.requestAccessContext) !== null && _this$props3$requestA !== void 0 && _this$props3$requestA.callToActionMessageKey) {
|
|
90
99
|
var callToActionMessageKey = _this.props.requestAccessContext.callToActionMessageKey;
|
|
91
100
|
return /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, (0, _extends2.default)({}, _messages.messages[callToActionMessageKey], {
|
|
92
101
|
values: {
|
|
@@ -96,23 +105,35 @@ var InlineCardForbiddenView = /*#__PURE__*/function (_React$Component) {
|
|
|
96
105
|
}
|
|
97
106
|
|
|
98
107
|
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.invalid_permissions, function (formattedMessage) {
|
|
99
|
-
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, formattedMessage
|
|
100
|
-
}), /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.try_another_account, function (formattedMessage) {
|
|
101
|
-
return /*#__PURE__*/_react.default.createElement(_styled.LowercaseAppearance, null, formattedMessage);
|
|
108
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, formattedMessage);
|
|
102
109
|
}));
|
|
103
110
|
});
|
|
104
111
|
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderRightSide", function () {
|
|
105
|
-
var _this$props3, _this$props3$requestA;
|
|
106
|
-
|
|
107
112
|
var onAuthorise = _this.props.onAuthorise;
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
113
|
+
|
|
114
|
+
if (_this.state.hasRequestAccessContextMessage) {
|
|
115
|
+
return /*#__PURE__*/_react.default.createElement(_customThemeButton.default, {
|
|
116
|
+
spacing: "none",
|
|
117
|
+
appearance: "subtle-link",
|
|
118
|
+
onClick: _this.handleRetry,
|
|
119
|
+
component: _styled.IconStyledButton,
|
|
120
|
+
testId: "button-connect-other-account"
|
|
121
|
+
}, _this.renderForbiddenAccessMessage());
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
if (onAuthorise) {
|
|
125
|
+
return /*#__PURE__*/_react.default.createElement(_styled2.LozengeBlockWrapper, null, /*#__PURE__*/_react.default.createElement(_customThemeButton.default, {
|
|
126
|
+
spacing: "none",
|
|
127
|
+
appearance: "subtle-link",
|
|
128
|
+
onClick: _this.handleRetry,
|
|
129
|
+
component: _styled.IconStyledButton,
|
|
130
|
+
testId: "button-connect-other-account"
|
|
131
|
+
}, /*#__PURE__*/_react.default.createElement(_styled2.LozengeWrapper, null, /*#__PURE__*/_react.default.createElement(_lozenge.default, {
|
|
132
|
+
appearance: 'moved'
|
|
133
|
+
}, _this.renderForbiddenAccessMessage()))));
|
|
134
|
+
}
|
|
135
|
+
|
|
136
|
+
return null;
|
|
116
137
|
});
|
|
117
138
|
return _this;
|
|
118
139
|
}
|
|
@@ -135,8 +156,9 @@ var InlineCardForbiddenView = /*#__PURE__*/function (_React$Component) {
|
|
|
135
156
|
link: url,
|
|
136
157
|
title: url,
|
|
137
158
|
onClick: onClick,
|
|
159
|
+
titleColor: (0, _tokens.token)('color.text.subtle', _colors.N500),
|
|
138
160
|
rightSide: this.renderRightSide(),
|
|
139
|
-
|
|
161
|
+
rightSideSpacer: this.state.hasRequestAccessContextMessage
|
|
140
162
|
}));
|
|
141
163
|
}
|
|
142
164
|
}]);
|
|
@@ -176,10 +176,13 @@ var IconAndTitleLayout = /*#__PURE__*/function (_React$Component) {
|
|
|
176
176
|
href: link,
|
|
177
177
|
onClick: this.handleClick,
|
|
178
178
|
onKeyPress: this.handleKeyPress
|
|
179
|
-
}, titlePart) : titlePart, rightSide ? /*#__PURE__*/_react.default.createElement(_styled2.NoLinkAppearance, null, ' - ', rightSide) : null));
|
|
179
|
+
}, titlePart) : titlePart, rightSide ? /*#__PURE__*/_react.default.createElement(_styled2.NoLinkAppearance, null, this.props.rightSideSpacer && ' - ', rightSide) : null));
|
|
180
180
|
}
|
|
181
181
|
}]);
|
|
182
182
|
return IconAndTitleLayout;
|
|
183
183
|
}(_react.default.Component);
|
|
184
184
|
|
|
185
|
-
exports.IconAndTitleLayout = IconAndTitleLayout;
|
|
185
|
+
exports.IconAndTitleLayout = IconAndTitleLayout;
|
|
186
|
+
(0, _defineProperty2.default)(IconAndTitleLayout, "defaultProps", {
|
|
187
|
+
rightSideSpacer: true
|
|
188
|
+
});
|
|
@@ -43,7 +43,7 @@ var IconTitleWrapper = _styled.default.span(_templateObject3 || (_templateObject
|
|
|
43
43
|
|
|
44
44
|
exports.IconTitleWrapper = IconTitleWrapper;
|
|
45
45
|
|
|
46
|
-
var LozengeWrapper = _styled.default.span(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n display: inline-block;\n vertical-align: 1px;\n
|
|
46
|
+
var LozengeWrapper = _styled.default.span(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n display: inline-block;\n vertical-align: 1px;\n"]))); // TODO: Replace overrides with proper AtlasKit solution.
|
|
47
47
|
|
|
48
48
|
|
|
49
49
|
exports.LozengeWrapper = LozengeWrapper;
|
|
@@ -52,10 +52,10 @@ var InlineCardResolvedView = /*#__PURE__*/function (_React$Component) {
|
|
|
52
52
|
return null;
|
|
53
53
|
}
|
|
54
54
|
|
|
55
|
-
return /*#__PURE__*/_react.default.createElement(_styled.LozengeWrapper, null, /*#__PURE__*/_react.default.createElement(_lozenge.default, {
|
|
55
|
+
return /*#__PURE__*/_react.default.createElement(_styled.LozengeBlockWrapper, null, /*#__PURE__*/_react.default.createElement(_styled.LozengeWrapper, null, /*#__PURE__*/_react.default.createElement(_lozenge.default, {
|
|
56
56
|
appearance: lozenge.appearance || 'default',
|
|
57
57
|
isBold: lozenge.isBold
|
|
58
|
-
}, lozenge.text));
|
|
58
|
+
}, lozenge.text)));
|
|
59
59
|
}
|
|
60
60
|
}, {
|
|
61
61
|
key: "render",
|
package/dist/es2019/messages.js
CHANGED
|
@@ -127,7 +127,7 @@ export const messages = defineMessages({
|
|
|
127
127
|
},
|
|
128
128
|
invalid_permissions: {
|
|
129
129
|
id: 'fabric.linking.invalid_permissions',
|
|
130
|
-
defaultMessage: 'Restricted
|
|
130
|
+
defaultMessage: 'Restricted content',
|
|
131
131
|
description: 'Message shown when a user does not have permissions to view an item'
|
|
132
132
|
},
|
|
133
133
|
invalid_permissions_description: {
|
package/dist/es2019/version.json
CHANGED
|
@@ -10,7 +10,9 @@ import { IconAndTitleLayout } from '../IconAndTitleLayout';
|
|
|
10
10
|
import { AKIconWrapper } from '../Icon';
|
|
11
11
|
import { messages } from '../../../messages';
|
|
12
12
|
import { FormattedMessage } from 'react-intl-next';
|
|
13
|
-
import { IconStyledButton
|
|
13
|
+
import { IconStyledButton } from '../styled';
|
|
14
|
+
import Lozenge from '@atlaskit/lozenge';
|
|
15
|
+
import { LozengeWrapper, LozengeBlockWrapper } from '../IconAndTitleLayout/styled';
|
|
14
16
|
const FallbackForbiddenIcon = /*#__PURE__*/React.createElement(AKIconWrapper, null, /*#__PURE__*/React.createElement(LockIcon, {
|
|
15
17
|
label: "error",
|
|
16
18
|
size: "small",
|
|
@@ -18,8 +20,14 @@ const FallbackForbiddenIcon = /*#__PURE__*/React.createElement(AKIconWrapper, nu
|
|
|
18
20
|
}));
|
|
19
21
|
export class InlineCardForbiddenView extends React.Component {
|
|
20
22
|
constructor(...args) {
|
|
23
|
+
var _this$props, _this$props$requestAc;
|
|
24
|
+
|
|
21
25
|
super(...args);
|
|
22
26
|
|
|
27
|
+
_defineProperty(this, "state", {
|
|
28
|
+
hasRequestAccessContextMessage: !!((_this$props = this.props) !== null && _this$props !== void 0 && (_this$props$requestAc = _this$props.requestAccessContext) !== null && _this$props$requestAc !== void 0 && _this$props$requestAc.callToActionMessageKey)
|
|
29
|
+
});
|
|
30
|
+
|
|
23
31
|
_defineProperty(this, "handleRetry", event => {
|
|
24
32
|
const {
|
|
25
33
|
onAuthorise
|
|
@@ -30,16 +38,16 @@ export class InlineCardForbiddenView extends React.Component {
|
|
|
30
38
|
if (onAuthorise) {
|
|
31
39
|
onAuthorise();
|
|
32
40
|
} else {
|
|
33
|
-
var _this$
|
|
41
|
+
var _this$props2, _this$props2$requestA, _this$props2$requestA2;
|
|
34
42
|
|
|
35
|
-
(_this$
|
|
43
|
+
(_this$props2 = this.props) === null || _this$props2 === void 0 ? void 0 : (_this$props2$requestA = _this$props2.requestAccessContext) === null || _this$props2$requestA === void 0 ? void 0 : (_this$props2$requestA2 = _this$props2$requestA.action) === null || _this$props2$requestA2 === void 0 ? void 0 : _this$props2$requestA2.promise();
|
|
36
44
|
}
|
|
37
45
|
});
|
|
38
46
|
|
|
39
47
|
_defineProperty(this, "renderForbiddenAccessMessage", () => {
|
|
40
|
-
var _this$
|
|
48
|
+
var _this$props3, _this$props3$requestA;
|
|
41
49
|
|
|
42
|
-
if ((_this$
|
|
50
|
+
if ((_this$props3 = this.props) !== null && _this$props3 !== void 0 && (_this$props3$requestA = _this$props3.requestAccessContext) !== null && _this$props3$requestA !== void 0 && _this$props3$requestA.callToActionMessageKey) {
|
|
43
51
|
const {
|
|
44
52
|
callToActionMessageKey
|
|
45
53
|
} = this.props.requestAccessContext;
|
|
@@ -51,26 +59,38 @@ export class InlineCardForbiddenView extends React.Component {
|
|
|
51
59
|
}
|
|
52
60
|
|
|
53
61
|
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FormattedMessage, messages.invalid_permissions, formattedMessage => {
|
|
54
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, formattedMessage
|
|
55
|
-
}), /*#__PURE__*/React.createElement(FormattedMessage, messages.try_another_account, formattedMessage => {
|
|
56
|
-
return /*#__PURE__*/React.createElement(LowercaseAppearance, null, formattedMessage);
|
|
62
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, formattedMessage);
|
|
57
63
|
}));
|
|
58
64
|
});
|
|
59
65
|
|
|
60
66
|
_defineProperty(this, "renderRightSide", () => {
|
|
61
|
-
var _this$props3, _this$props3$requestA;
|
|
62
|
-
|
|
63
67
|
const {
|
|
64
68
|
onAuthorise
|
|
65
69
|
} = this.props;
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
70
|
+
|
|
71
|
+
if (this.state.hasRequestAccessContextMessage) {
|
|
72
|
+
return /*#__PURE__*/React.createElement(Button, {
|
|
73
|
+
spacing: "none",
|
|
74
|
+
appearance: "subtle-link",
|
|
75
|
+
onClick: this.handleRetry,
|
|
76
|
+
component: IconStyledButton,
|
|
77
|
+
testId: "button-connect-other-account"
|
|
78
|
+
}, this.renderForbiddenAccessMessage());
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
if (onAuthorise) {
|
|
82
|
+
return /*#__PURE__*/React.createElement(LozengeBlockWrapper, null, /*#__PURE__*/React.createElement(Button, {
|
|
83
|
+
spacing: "none",
|
|
84
|
+
appearance: "subtle-link",
|
|
85
|
+
onClick: this.handleRetry,
|
|
86
|
+
component: IconStyledButton,
|
|
87
|
+
testId: "button-connect-other-account"
|
|
88
|
+
}, /*#__PURE__*/React.createElement(LozengeWrapper, null, /*#__PURE__*/React.createElement(Lozenge, {
|
|
89
|
+
appearance: 'moved'
|
|
90
|
+
}, this.renderForbiddenAccessMessage()))));
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
return null;
|
|
74
94
|
});
|
|
75
95
|
}
|
|
76
96
|
|
|
@@ -90,8 +110,9 @@ export class InlineCardForbiddenView extends React.Component {
|
|
|
90
110
|
link: url,
|
|
91
111
|
title: url,
|
|
92
112
|
onClick: onClick,
|
|
113
|
+
titleColor: token('color.text.subtle', N500),
|
|
93
114
|
rightSide: this.renderRightSide(),
|
|
94
|
-
|
|
115
|
+
rightSideSpacer: this.state.hasRequestAccessContextMessage
|
|
95
116
|
}));
|
|
96
117
|
}
|
|
97
118
|
|
|
@@ -134,7 +134,11 @@ export class IconAndTitleLayout extends React.Component {
|
|
|
134
134
|
href: link,
|
|
135
135
|
onClick: this.handleClick,
|
|
136
136
|
onKeyPress: this.handleKeyPress
|
|
137
|
-
}, titlePart) : titlePart, rightSide ? /*#__PURE__*/React.createElement(NoLinkAppearance, null, ' - ', rightSide) : null));
|
|
137
|
+
}, titlePart) : titlePart, rightSide ? /*#__PURE__*/React.createElement(NoLinkAppearance, null, this.props.rightSideSpacer && ' - ', rightSide) : null));
|
|
138
138
|
}
|
|
139
139
|
|
|
140
|
-
}
|
|
140
|
+
}
|
|
141
|
+
|
|
142
|
+
_defineProperty(IconAndTitleLayout, "defaultProps", {
|
|
143
|
+
rightSideSpacer: true
|
|
144
|
+
});
|
|
@@ -62,9 +62,6 @@ export const IconTitleWrapper = styled.span`
|
|
|
62
62
|
export const LozengeWrapper = styled.span`
|
|
63
63
|
display: inline-block;
|
|
64
64
|
vertical-align: 1px;
|
|
65
|
-
& > span {
|
|
66
|
-
margin-left: 4px;
|
|
67
|
-
}
|
|
68
65
|
`; // TODO: Replace overrides with proper AtlasKit solution.
|
|
69
66
|
|
|
70
67
|
export const LozengeBlockWrapper = styled.span`
|
|
@@ -2,7 +2,7 @@ import React from 'react';
|
|
|
2
2
|
import { Frame } from '../Frame';
|
|
3
3
|
import Lozenge from '@atlaskit/lozenge';
|
|
4
4
|
import { IconAndTitleLayout } from '../IconAndTitleLayout';
|
|
5
|
-
import { LozengeWrapper } from '../IconAndTitleLayout/styled';
|
|
5
|
+
import { LozengeWrapper, LozengeBlockWrapper } from '../IconAndTitleLayout/styled';
|
|
6
6
|
import { HoverCard } from '../../../view/HoverCard/index';
|
|
7
7
|
export class InlineCardResolvedView extends React.Component {
|
|
8
8
|
renderLozenge() {
|
|
@@ -14,10 +14,10 @@ export class InlineCardResolvedView extends React.Component {
|
|
|
14
14
|
return null;
|
|
15
15
|
}
|
|
16
16
|
|
|
17
|
-
return /*#__PURE__*/React.createElement(LozengeWrapper, null, /*#__PURE__*/React.createElement(Lozenge, {
|
|
17
|
+
return /*#__PURE__*/React.createElement(LozengeBlockWrapper, null, /*#__PURE__*/React.createElement(LozengeWrapper, null, /*#__PURE__*/React.createElement(Lozenge, {
|
|
18
18
|
appearance: lozenge.appearance || 'default',
|
|
19
19
|
isBold: lozenge.isBold
|
|
20
|
-
}, lozenge.text));
|
|
20
|
+
}, lozenge.text)));
|
|
21
21
|
}
|
|
22
22
|
|
|
23
23
|
render() {
|
package/dist/esm/messages.js
CHANGED
|
@@ -127,7 +127,7 @@ export var messages = defineMessages({
|
|
|
127
127
|
},
|
|
128
128
|
invalid_permissions: {
|
|
129
129
|
id: 'fabric.linking.invalid_permissions',
|
|
130
|
-
defaultMessage: 'Restricted
|
|
130
|
+
defaultMessage: 'Restricted content',
|
|
131
131
|
description: 'Message shown when a user does not have permissions to view an item'
|
|
132
132
|
},
|
|
133
133
|
invalid_permissions_description: {
|
package/dist/esm/version.json
CHANGED
|
@@ -21,7 +21,9 @@ import { IconAndTitleLayout } from '../IconAndTitleLayout';
|
|
|
21
21
|
import { AKIconWrapper } from '../Icon';
|
|
22
22
|
import { messages } from '../../../messages';
|
|
23
23
|
import { FormattedMessage } from 'react-intl-next';
|
|
24
|
-
import { IconStyledButton
|
|
24
|
+
import { IconStyledButton } from '../styled';
|
|
25
|
+
import Lozenge from '@atlaskit/lozenge';
|
|
26
|
+
import { LozengeWrapper, LozengeBlockWrapper } from '../IconAndTitleLayout/styled';
|
|
25
27
|
var FallbackForbiddenIcon = /*#__PURE__*/React.createElement(AKIconWrapper, null, /*#__PURE__*/React.createElement(LockIcon, {
|
|
26
28
|
label: "error",
|
|
27
29
|
size: "small",
|
|
@@ -33,6 +35,8 @@ export var InlineCardForbiddenView = /*#__PURE__*/function (_React$Component) {
|
|
|
33
35
|
var _super = _createSuper(InlineCardForbiddenView);
|
|
34
36
|
|
|
35
37
|
function InlineCardForbiddenView() {
|
|
38
|
+
var _this$props, _this$props$requestAc;
|
|
39
|
+
|
|
36
40
|
var _this;
|
|
37
41
|
|
|
38
42
|
_classCallCheck(this, InlineCardForbiddenView);
|
|
@@ -43,6 +47,10 @@ export var InlineCardForbiddenView = /*#__PURE__*/function (_React$Component) {
|
|
|
43
47
|
|
|
44
48
|
_this = _super.call.apply(_super, [this].concat(args));
|
|
45
49
|
|
|
50
|
+
_defineProperty(_assertThisInitialized(_this), "state", {
|
|
51
|
+
hasRequestAccessContextMessage: !!((_this$props = _this.props) !== null && _this$props !== void 0 && (_this$props$requestAc = _this$props.requestAccessContext) !== null && _this$props$requestAc !== void 0 && _this$props$requestAc.callToActionMessageKey)
|
|
52
|
+
});
|
|
53
|
+
|
|
46
54
|
_defineProperty(_assertThisInitialized(_this), "handleRetry", function (event) {
|
|
47
55
|
var onAuthorise = _this.props.onAuthorise;
|
|
48
56
|
event.preventDefault();
|
|
@@ -51,16 +59,16 @@ export var InlineCardForbiddenView = /*#__PURE__*/function (_React$Component) {
|
|
|
51
59
|
if (onAuthorise) {
|
|
52
60
|
onAuthorise();
|
|
53
61
|
} else {
|
|
54
|
-
var _this$
|
|
62
|
+
var _this$props2, _this$props2$requestA, _this$props2$requestA2;
|
|
55
63
|
|
|
56
|
-
(_this$
|
|
64
|
+
(_this$props2 = _this.props) === null || _this$props2 === void 0 ? void 0 : (_this$props2$requestA = _this$props2.requestAccessContext) === null || _this$props2$requestA === void 0 ? void 0 : (_this$props2$requestA2 = _this$props2$requestA.action) === null || _this$props2$requestA2 === void 0 ? void 0 : _this$props2$requestA2.promise();
|
|
57
65
|
}
|
|
58
66
|
});
|
|
59
67
|
|
|
60
68
|
_defineProperty(_assertThisInitialized(_this), "renderForbiddenAccessMessage", function () {
|
|
61
|
-
var _this$
|
|
69
|
+
var _this$props3, _this$props3$requestA;
|
|
62
70
|
|
|
63
|
-
if ((_this$
|
|
71
|
+
if ((_this$props3 = _this.props) !== null && _this$props3 !== void 0 && (_this$props3$requestA = _this$props3.requestAccessContext) !== null && _this$props3$requestA !== void 0 && _this$props3$requestA.callToActionMessageKey) {
|
|
64
72
|
var callToActionMessageKey = _this.props.requestAccessContext.callToActionMessageKey;
|
|
65
73
|
return /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, messages[callToActionMessageKey], {
|
|
66
74
|
values: {
|
|
@@ -70,24 +78,36 @@ export var InlineCardForbiddenView = /*#__PURE__*/function (_React$Component) {
|
|
|
70
78
|
}
|
|
71
79
|
|
|
72
80
|
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FormattedMessage, messages.invalid_permissions, function (formattedMessage) {
|
|
73
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, formattedMessage
|
|
74
|
-
}), /*#__PURE__*/React.createElement(FormattedMessage, messages.try_another_account, function (formattedMessage) {
|
|
75
|
-
return /*#__PURE__*/React.createElement(LowercaseAppearance, null, formattedMessage);
|
|
81
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, formattedMessage);
|
|
76
82
|
}));
|
|
77
83
|
});
|
|
78
84
|
|
|
79
85
|
_defineProperty(_assertThisInitialized(_this), "renderRightSide", function () {
|
|
80
|
-
var _this$props3, _this$props3$requestA;
|
|
81
|
-
|
|
82
86
|
var onAuthorise = _this.props.onAuthorise;
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
87
|
+
|
|
88
|
+
if (_this.state.hasRequestAccessContextMessage) {
|
|
89
|
+
return /*#__PURE__*/React.createElement(Button, {
|
|
90
|
+
spacing: "none",
|
|
91
|
+
appearance: "subtle-link",
|
|
92
|
+
onClick: _this.handleRetry,
|
|
93
|
+
component: IconStyledButton,
|
|
94
|
+
testId: "button-connect-other-account"
|
|
95
|
+
}, _this.renderForbiddenAccessMessage());
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
if (onAuthorise) {
|
|
99
|
+
return /*#__PURE__*/React.createElement(LozengeBlockWrapper, null, /*#__PURE__*/React.createElement(Button, {
|
|
100
|
+
spacing: "none",
|
|
101
|
+
appearance: "subtle-link",
|
|
102
|
+
onClick: _this.handleRetry,
|
|
103
|
+
component: IconStyledButton,
|
|
104
|
+
testId: "button-connect-other-account"
|
|
105
|
+
}, /*#__PURE__*/React.createElement(LozengeWrapper, null, /*#__PURE__*/React.createElement(Lozenge, {
|
|
106
|
+
appearance: 'moved'
|
|
107
|
+
}, _this.renderForbiddenAccessMessage()))));
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
return null;
|
|
91
111
|
});
|
|
92
112
|
|
|
93
113
|
return _this;
|
|
@@ -111,8 +131,9 @@ export var InlineCardForbiddenView = /*#__PURE__*/function (_React$Component) {
|
|
|
111
131
|
link: url,
|
|
112
132
|
title: url,
|
|
113
133
|
onClick: onClick,
|
|
134
|
+
titleColor: token('color.text.subtle', N500),
|
|
114
135
|
rightSide: this.renderRightSide(),
|
|
115
|
-
|
|
136
|
+
rightSideSpacer: this.state.hasRequestAccessContextMessage
|
|
116
137
|
}));
|
|
117
138
|
}
|
|
118
139
|
}]);
|
|
@@ -156,9 +156,13 @@ export var IconAndTitleLayout = /*#__PURE__*/function (_React$Component) {
|
|
|
156
156
|
href: link,
|
|
157
157
|
onClick: this.handleClick,
|
|
158
158
|
onKeyPress: this.handleKeyPress
|
|
159
|
-
}, titlePart) : titlePart, rightSide ? /*#__PURE__*/React.createElement(NoLinkAppearance, null, ' - ', rightSide) : null));
|
|
159
|
+
}, titlePart) : titlePart, rightSide ? /*#__PURE__*/React.createElement(NoLinkAppearance, null, this.props.rightSideSpacer && ' - ', rightSide) : null));
|
|
160
160
|
}
|
|
161
161
|
}]);
|
|
162
162
|
|
|
163
163
|
return IconAndTitleLayout;
|
|
164
|
-
}(React.Component);
|
|
164
|
+
}(React.Component);
|
|
165
|
+
|
|
166
|
+
_defineProperty(IconAndTitleLayout, "defaultProps", {
|
|
167
|
+
rightSideSpacer: true
|
|
168
|
+
});
|
|
@@ -21,7 +21,7 @@ export var EmojiWrapper = styled.span(_templateObject2 || (_templateObject2 = _t
|
|
|
21
21
|
|
|
22
22
|
export var IconTitleWrapper = styled.span(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n white-space: pre-wrap;\n word-break: break-all;\n"]))); // TODO: Replace overrides with proper AtlasKit solution.
|
|
23
23
|
|
|
24
|
-
export var LozengeWrapper = styled.span(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n display: inline-block;\n vertical-align: 1px;\n
|
|
24
|
+
export var LozengeWrapper = styled.span(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n display: inline-block;\n vertical-align: 1px;\n"]))); // TODO: Replace overrides with proper AtlasKit solution.
|
|
25
25
|
|
|
26
26
|
export var LozengeBlockWrapper = styled.span(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n & > span {\n margin-left: 4px;\n }\n"])));
|
|
27
27
|
export var RightIconPositionWrapper = styled.span(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n margin-left: 2px;\n margin-right: 4px;\n position: relative;\n display: inline-block;\n"]))); // The following components are used to absolutely position icons in the vertical center.
|
|
@@ -12,7 +12,7 @@ import React from 'react';
|
|
|
12
12
|
import { Frame } from '../Frame';
|
|
13
13
|
import Lozenge from '@atlaskit/lozenge';
|
|
14
14
|
import { IconAndTitleLayout } from '../IconAndTitleLayout';
|
|
15
|
-
import { LozengeWrapper } from '../IconAndTitleLayout/styled';
|
|
15
|
+
import { LozengeWrapper, LozengeBlockWrapper } from '../IconAndTitleLayout/styled';
|
|
16
16
|
import { HoverCard } from '../../../view/HoverCard/index';
|
|
17
17
|
export var InlineCardResolvedView = /*#__PURE__*/function (_React$Component) {
|
|
18
18
|
_inherits(InlineCardResolvedView, _React$Component);
|
|
@@ -34,10 +34,10 @@ export var InlineCardResolvedView = /*#__PURE__*/function (_React$Component) {
|
|
|
34
34
|
return null;
|
|
35
35
|
}
|
|
36
36
|
|
|
37
|
-
return /*#__PURE__*/React.createElement(LozengeWrapper, null, /*#__PURE__*/React.createElement(Lozenge, {
|
|
37
|
+
return /*#__PURE__*/React.createElement(LozengeBlockWrapper, null, /*#__PURE__*/React.createElement(LozengeWrapper, null, /*#__PURE__*/React.createElement(Lozenge, {
|
|
38
38
|
appearance: lozenge.appearance || 'default',
|
|
39
39
|
isBold: lozenge.isBold
|
|
40
|
-
}, lozenge.text));
|
|
40
|
+
}, lozenge.text)));
|
|
41
41
|
}
|
|
42
42
|
}, {
|
|
43
43
|
key: "render",
|
|
@@ -13,34 +13,82 @@ export interface WrapperProps {
|
|
|
13
13
|
export declare const borderRadius: string;
|
|
14
14
|
export declare const ellipsis: (maxWidth?: string | number) => string;
|
|
15
15
|
export declare const csssize: (value?: string | number) => string;
|
|
16
|
-
export declare const LinkWrapper: import("@emotion/styled
|
|
17
|
-
|
|
16
|
+
export declare const LinkWrapper: import("@emotion/styled").StyledComponent<{
|
|
17
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
18
|
+
as?: import("react").ElementType<any> | undefined;
|
|
19
|
+
} & WrapperProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
20
|
+
export declare const Wrapper: import("@emotion/styled").StyledComponent<{
|
|
21
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
22
|
+
as?: import("react").ElementType<any> | undefined;
|
|
23
|
+
} & WrapperProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
18
24
|
export declare const embedHeaderHeight = 32;
|
|
19
|
-
export declare const Header: import("@emotion/styled
|
|
25
|
+
export declare const Header: import("@emotion/styled").StyledComponent<{
|
|
26
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
27
|
+
as?: import("react").ElementType<any> | undefined;
|
|
28
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
20
29
|
export interface PlaceholderProps {
|
|
21
30
|
isPlaceholder: boolean;
|
|
22
31
|
}
|
|
23
|
-
export declare const IconWrapper: import("@emotion/styled
|
|
24
|
-
|
|
32
|
+
export declare const IconWrapper: import("@emotion/styled").StyledComponent<{
|
|
33
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
34
|
+
as?: import("react").ElementType<any> | undefined;
|
|
35
|
+
} & PlaceholderProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
36
|
+
export declare const TextWrapper: import("@emotion/styled").StyledComponent<{
|
|
37
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
38
|
+
as?: import("react").ElementType<any> | undefined;
|
|
39
|
+
} & PlaceholderProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
25
40
|
export interface ContentProps {
|
|
26
41
|
isInteractive: boolean;
|
|
27
42
|
allowScrollBar: boolean;
|
|
28
43
|
}
|
|
29
|
-
export declare const Content: import("@emotion/styled
|
|
44
|
+
export declare const Content: import("@emotion/styled").StyledComponent<{
|
|
45
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
46
|
+
as?: import("react").ElementType<any> | undefined;
|
|
47
|
+
} & ContentProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
30
48
|
export interface ImageProps {
|
|
31
49
|
size: number;
|
|
32
50
|
}
|
|
33
|
-
export declare const Image: import("@emotion/styled
|
|
51
|
+
export declare const Image: import("@emotion/styled").StyledComponent<{
|
|
52
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
53
|
+
as?: import("react").ElementType<any> | undefined;
|
|
54
|
+
} & ImageProps, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
|
|
34
55
|
export declare const maxAvatarCount = 6;
|
|
35
|
-
export declare const ContentWrapper: import("@emotion/styled
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
export declare const
|
|
56
|
+
export declare const ContentWrapper: import("@emotion/styled").StyledComponent<{
|
|
57
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
58
|
+
as?: import("react").ElementType<any> | undefined;
|
|
59
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
60
|
+
export declare const Title: import("@emotion/styled").StyledComponent<{
|
|
61
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
62
|
+
as?: import("react").ElementType<any> | undefined;
|
|
63
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
64
|
+
export declare const Byline: import("@emotion/styled").StyledComponent<{
|
|
65
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
66
|
+
as?: import("react").ElementType<any> | undefined;
|
|
67
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
68
|
+
export declare const Description: import("@emotion/styled").StyledComponent<{
|
|
69
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
70
|
+
as?: import("react").ElementType<any> | undefined;
|
|
71
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
72
|
+
export declare const ResolvedViewIconWrapper: import("@emotion/styled").StyledComponent<{
|
|
73
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
74
|
+
as?: import("react").ElementType<any> | undefined;
|
|
75
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
40
76
|
export interface ThumbnailProps {
|
|
41
77
|
src: string;
|
|
42
78
|
}
|
|
43
|
-
export declare const Thumbnail: import("@emotion/styled
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
79
|
+
export declare const Thumbnail: import("@emotion/styled").StyledComponent<{
|
|
80
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
81
|
+
as?: import("react").ElementType<any> | undefined;
|
|
82
|
+
} & ThumbnailProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
83
|
+
export declare const UsersWrapper: import("@emotion/styled").StyledComponent<{
|
|
84
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
85
|
+
as?: import("react").ElementType<any> | undefined;
|
|
86
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
87
|
+
export declare const ActionsWrapper: import("@emotion/styled").StyledComponent<{
|
|
88
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
89
|
+
as?: import("react").ElementType<any> | undefined;
|
|
90
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
91
|
+
export declare const AlertWrapper: import("@emotion/styled").StyledComponent<{
|
|
92
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
93
|
+
as?: import("react").ElementType<any> | undefined;
|
|
94
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
@@ -18,6 +18,9 @@ export interface InlineCardForbiddenViewProps {
|
|
|
18
18
|
requestAccessContext?: RequestAccessContextProps;
|
|
19
19
|
}
|
|
20
20
|
export declare class InlineCardForbiddenView extends React.Component<InlineCardForbiddenViewProps> {
|
|
21
|
+
state: {
|
|
22
|
+
hasRequestAccessContextMessage: boolean;
|
|
23
|
+
};
|
|
21
24
|
handleRetry: (event: React.MouseEvent<HTMLElement>) => void;
|
|
22
25
|
renderForbiddenAccessMessage: () => JSX.Element;
|
|
23
26
|
renderRightSide: () => JSX.Element | null;
|
|
@@ -5,5 +5,11 @@ export interface WrapperProps {
|
|
|
5
5
|
isInteractive?: boolean;
|
|
6
6
|
withoutBackground?: boolean;
|
|
7
7
|
}
|
|
8
|
-
export declare const WrapperAnchor: import("@emotion/styled
|
|
9
|
-
|
|
8
|
+
export declare const WrapperAnchor: import("@emotion/styled").StyledComponent<{
|
|
9
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
10
|
+
as?: import("react").ElementType<any> | undefined;
|
|
11
|
+
} & WrapperProps, import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, {}>;
|
|
12
|
+
export declare const WrapperSpan: import("@emotion/styled").StyledComponent<{
|
|
13
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
14
|
+
as?: import("react").ElementType<any> | undefined;
|
|
15
|
+
} & WrapperProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
@@ -1,4 +1,13 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
export declare const Icon: import("@emotion/styled
|
|
3
|
-
|
|
4
|
-
|
|
2
|
+
export declare const Icon: import("@emotion/styled").StyledComponent<{
|
|
3
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
4
|
+
as?: import("react").ElementType<any> | undefined;
|
|
5
|
+
}, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
|
|
6
|
+
export declare const AKIconWrapper: import("@emotion/styled").StyledComponent<{
|
|
7
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
8
|
+
as?: import("react").ElementType<any> | undefined;
|
|
9
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
10
|
+
export declare const Shimmer: import("@emotion/styled").StyledComponent<{
|
|
11
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
12
|
+
as?: import("react").ElementType<any> | undefined;
|
|
13
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
@@ -11,9 +11,13 @@ export interface IconAndTitleLayoutProps {
|
|
|
11
11
|
testId?: string;
|
|
12
12
|
link?: string;
|
|
13
13
|
rightSide?: React.ReactNode;
|
|
14
|
+
rightSideSpacer: boolean;
|
|
14
15
|
onClick?: React.EventHandler<React.MouseEvent | React.KeyboardEvent>;
|
|
15
16
|
}
|
|
16
17
|
export declare class IconAndTitleLayout extends React.Component<IconAndTitleLayoutProps> {
|
|
18
|
+
static defaultProps: {
|
|
19
|
+
rightSideSpacer: boolean;
|
|
20
|
+
};
|
|
17
21
|
private renderAtlaskitIcon;
|
|
18
22
|
private renderImageIcon;
|
|
19
23
|
private renderIconPlaceholder;
|
|
@@ -1,13 +1,40 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
export declare const IconObjectOverrides = "\n & > span {\n height: 16px;\n width: 14px;\n position: absolute;\n top: 0;\n left: 0;\n line-height: 14px;\n & > svg {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n }\n";
|
|
3
3
|
export declare const IconOverrides = "\n & > * > span {\n height: 16px;\n width: 14px;\n position: absolute;\n top: 0;\n left: 0;\n & > svg {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n }\n";
|
|
4
|
-
export declare const IconWrapper: import("@emotion/styled
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
export declare const
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
4
|
+
export declare const IconWrapper: import("@emotion/styled").StyledComponent<{
|
|
5
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
6
|
+
as?: import("react").ElementType<any> | undefined;
|
|
7
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
8
|
+
export declare const EmojiWrapper: import("@emotion/styled").StyledComponent<{
|
|
9
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
10
|
+
as?: import("react").ElementType<any> | undefined;
|
|
11
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
12
|
+
export declare const IconTitleWrapper: import("@emotion/styled").StyledComponent<{
|
|
13
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
14
|
+
as?: import("react").ElementType<any> | undefined;
|
|
15
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
16
|
+
export declare const LozengeWrapper: import("@emotion/styled").StyledComponent<{
|
|
17
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
18
|
+
as?: import("react").ElementType<any> | undefined;
|
|
19
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
20
|
+
export declare const LozengeBlockWrapper: import("@emotion/styled").StyledComponent<{
|
|
21
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
22
|
+
as?: import("react").ElementType<any> | undefined;
|
|
23
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
24
|
+
export declare const RightIconPositionWrapper: import("@emotion/styled").StyledComponent<{
|
|
25
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
26
|
+
as?: import("react").ElementType<any> | undefined;
|
|
27
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
28
|
+
export declare const IconPositionWrapper: import("@emotion/styled").StyledComponent<{
|
|
29
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
30
|
+
as?: import("react").ElementType<any> | undefined;
|
|
31
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
32
|
+
export declare const IconEmptyWrapper: import("@emotion/styled").StyledComponent<{
|
|
33
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
34
|
+
as?: import("react").ElementType<any> | undefined;
|
|
35
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
12
36
|
export declare const TitleWrapperClassName = "smart-link-title-wrapper";
|
|
13
|
-
export declare const TitleWrapper: import("@emotion/styled
|
|
37
|
+
export declare const TitleWrapper: import("@emotion/styled").StyledComponent<{
|
|
38
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
39
|
+
as?: import("react").ElementType<any> | undefined;
|
|
40
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
@@ -1,14 +1,9 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
export declare const SpinnerWrapper: import("@emotion/styled
|
|
3
|
-
theme?:
|
|
4
|
-
|
|
2
|
+
export declare const SpinnerWrapper: import("@emotion/styled").StyledComponent<{
|
|
3
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
4
|
+
as?: import("react").ElementType<any> | undefined;
|
|
5
|
+
} & import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement> & {
|
|
5
6
|
children?: import("react").ReactNode;
|
|
6
|
-
}, "key" | keyof import("react").HTMLAttributes<HTMLSpanElement> | "theme"> & {
|
|
7
|
-
ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
|
|
8
|
-
}, Pick<Pick<import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement> & Pick<Pick<import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement>, keyof import("react").HTMLAttributes<HTMLSpanElement>>, keyof import("react").HTMLAttributes<HTMLSpanElement>> & {
|
|
9
|
-
theme?: object | undefined;
|
|
10
7
|
} & {
|
|
11
|
-
|
|
12
|
-
},
|
|
13
|
-
ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
|
|
14
|
-
}, keyof import("react").HTMLAttributes<HTMLSpanElement> | "theme">, object>;
|
|
8
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
9
|
+
}, {}, {}>;
|
|
@@ -1,9 +1,17 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
export declare const IconStyledButton: import("@emotion/styled
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
}>;
|
|
6
|
-
export declare const
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
}>;
|
|
2
|
+
export declare const IconStyledButton: import("@emotion/styled").StyledComponent<{
|
|
3
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
4
|
+
as?: import("react").ElementType<any> | undefined;
|
|
5
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
6
|
+
export declare const NoLinkAppearance: import("@emotion/styled").StyledComponent<{
|
|
7
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
8
|
+
as?: import("react").ElementType<any> | undefined;
|
|
9
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
10
|
+
export declare const LowercaseAppearance: import("@emotion/styled").StyledComponent<{
|
|
11
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
12
|
+
as?: import("react").ElementType<any> | undefined;
|
|
13
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
14
|
+
export declare const LinkAppearance: import("@emotion/styled").StyledComponent<{
|
|
15
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
16
|
+
as?: import("react").ElementType<any> | undefined;
|
|
17
|
+
}, import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, {}>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/smart-card",
|
|
3
|
-
"version": "23.10.
|
|
3
|
+
"version": "23.10.3",
|
|
4
4
|
"description": "Smart card component",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
"@atlaskit/analytics-gas-types": "^5.0.0",
|
|
26
26
|
"@atlaskit/analytics-next": "^8.2.0",
|
|
27
27
|
"@atlaskit/avatar": "^21.1.0",
|
|
28
|
-
"@atlaskit/avatar-group": "^9.
|
|
28
|
+
"@atlaskit/avatar-group": "^9.2.0",
|
|
29
29
|
"@atlaskit/button": "^16.5.0",
|
|
30
30
|
"@atlaskit/dropdown-menu": "^11.5.0",
|
|
31
31
|
"@atlaskit/icon": "^21.11.0",
|
|
@@ -36,7 +36,7 @@
|
|
|
36
36
|
"@atlaskit/linking-common": "^1.16.0",
|
|
37
37
|
"@atlaskit/logo": "^13.10.0",
|
|
38
38
|
"@atlaskit/lozenge": "^11.3.0",
|
|
39
|
-
"@atlaskit/media-common": "^2.
|
|
39
|
+
"@atlaskit/media-common": "^2.18.0",
|
|
40
40
|
"@atlaskit/modal-dialog": "^12.4.0",
|
|
41
41
|
"@atlaskit/outbound-auth-flow-client": "^3.3.0",
|
|
42
42
|
"@atlaskit/popup": "^1.5.0",
|
|
@@ -47,7 +47,7 @@
|
|
|
47
47
|
"@atlaskit/ufo": "^0.1.0",
|
|
48
48
|
"@babel/runtime": "^7.0.0",
|
|
49
49
|
"@emotion/react": "^11.7.1",
|
|
50
|
-
"@emotion/styled": "^
|
|
50
|
+
"@emotion/styled": "^11.0.0",
|
|
51
51
|
"@formatjs/intl-utils": "^3.8.4",
|
|
52
52
|
"facepaint": "^1.2.1",
|
|
53
53
|
"json-ld-types": "3.2.0",
|
|
@@ -74,12 +74,12 @@
|
|
|
74
74
|
"@atlaskit/inline-message": "^11.4.0",
|
|
75
75
|
"@atlaskit/lozenge": "^11.3.0",
|
|
76
76
|
"@atlaskit/media-integration-test-helpers": "^2.6.0",
|
|
77
|
-
"@atlaskit/media-test-helpers": "^30.
|
|
77
|
+
"@atlaskit/media-test-helpers": "^30.1.0",
|
|
78
78
|
"@atlaskit/page": "^12.2.0",
|
|
79
79
|
"@atlaskit/radio": "^5.4.0",
|
|
80
80
|
"@atlaskit/range": "^7.0.0",
|
|
81
81
|
"@atlaskit/section-message": "^6.3.0",
|
|
82
|
-
"@atlaskit/select": "^16.
|
|
82
|
+
"@atlaskit/select": "^16.1.0",
|
|
83
83
|
"@atlaskit/table-tree": "^9.2.0",
|
|
84
84
|
"@atlaskit/tabs": "^13.3.0",
|
|
85
85
|
"@atlaskit/textarea": "^4.5.0",
|