@atlaskit/onboarding 11.5.1 → 11.5.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 +15 -0
- package/dist/cjs/components/spotlight-card.js +40 -27
- package/dist/cjs/components/spotlight-dialog.js +1 -1
- package/dist/es2019/components/spotlight-card.js +11 -2
- package/dist/es2019/components/spotlight-dialog.js +1 -1
- package/dist/esm/components/spotlight-card.js +40 -27
- package/dist/esm/components/spotlight-dialog.js +1 -1
- package/dist/types/components/spotlight-card.d.ts +2 -2
- package/dist/types-ts4.5/components/spotlight-card.d.ts +2 -2
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,20 @@
|
|
|
1
1
|
# @atlaskit/onboarding
|
|
2
2
|
|
|
3
|
+
## 11.5.3
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies
|
|
8
|
+
|
|
9
|
+
## 11.5.2
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- [#96747](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/96747)
|
|
14
|
+
[`3fdc807b70fb`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/3fdc807b70fb) -
|
|
15
|
+
Re-add custom theme wrapper to prevent buttons accidentally inheriting themes. To be removed
|
|
16
|
+
when component is updated to use new buttons.
|
|
17
|
+
|
|
3
18
|
## 11.5.1
|
|
4
19
|
|
|
5
20
|
### Patch Changes
|
|
@@ -12,10 +12,12 @@ var _react2 = require("@emotion/react");
|
|
|
12
12
|
var _customThemeButton = _interopRequireWildcard(require("@atlaskit/button/custom-theme-button"));
|
|
13
13
|
var _heading = _interopRequireDefault(require("@atlaskit/heading"));
|
|
14
14
|
var _primitives = require("@atlaskit/primitives");
|
|
15
|
+
var _components = require("@atlaskit/theme/components");
|
|
15
16
|
var _dialog = require("../styled/dialog");
|
|
16
17
|
var _theme = require("./theme");
|
|
17
18
|
var _excluded = ["text", "key"];
|
|
18
19
|
/** @jsx jsx */
|
|
20
|
+
// eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
|
|
19
21
|
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); }
|
|
20
22
|
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; }
|
|
21
23
|
var bodyStyles = (0, _react2.css)({
|
|
@@ -62,6 +64,13 @@ var containerStyles = (0, _primitives.xcss)({
|
|
|
62
64
|
var containerShadowStyles = (0, _primitives.xcss)({
|
|
63
65
|
boxShadow: 'elevation.shadow.raised'
|
|
64
66
|
});
|
|
67
|
+
|
|
68
|
+
/**
|
|
69
|
+
* @deprecated
|
|
70
|
+
*/
|
|
71
|
+
var Theme = (0, _components.createTheme)(function () {
|
|
72
|
+
return {};
|
|
73
|
+
});
|
|
65
74
|
/**
|
|
66
75
|
* __Spotlight card__
|
|
67
76
|
*
|
|
@@ -95,33 +104,37 @@ var SpotlightCard = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
|
95
104
|
Footer = _components$Footer === void 0 ? DefaultFooter : _components$Footer;
|
|
96
105
|
return (0, _react2.jsx)(_customThemeButton.Theme.Provider, {
|
|
97
106
|
value: _theme.spotlightButtonTheme
|
|
98
|
-
}, (0, _react2.jsx)(
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
107
|
+
}, (0, _react2.jsx)(Theme.Provider, {
|
|
108
|
+
value: undefined
|
|
109
|
+
}, (0, _react2.jsx)(Theme.Consumer, null, function () {
|
|
110
|
+
return (0, _react2.jsx)(_primitives.Box, {
|
|
111
|
+
backgroundColor: "color.background.discovery.bold",
|
|
112
|
+
xcss: [containerStyles, !isFlat && containerShadowStyles],
|
|
113
|
+
style: {
|
|
114
|
+
width: width
|
|
115
|
+
},
|
|
116
|
+
ref: ref || innerRef,
|
|
117
|
+
testId: testId
|
|
118
|
+
}, typeof image === 'string' ? (0, _react2.jsx)("img", {
|
|
119
|
+
css: imageStyles,
|
|
120
|
+
src: image,
|
|
121
|
+
alt: ""
|
|
122
|
+
}) : image, (0, _react2.jsx)("div", {
|
|
123
|
+
css: bodyStyles
|
|
124
|
+
}, heading || headingAfterElement ? (0, _react2.jsx)(Header, null, (0, _react2.jsx)(_heading.default, {
|
|
125
|
+
id: headingId,
|
|
126
|
+
color: "inverse",
|
|
127
|
+
size: "medium",
|
|
128
|
+
as: "h".concat(headingLevel)
|
|
129
|
+
}, heading), headingAfterElement) : null, (0, _react2.jsx)(_primitives.Text, null, children), actions.length > 0 || actionsBeforeElement ? (0, _react2.jsx)(Footer, null, actionsBeforeElement || (0, _react2.jsx)("span", null), (0, _react2.jsx)(_dialog.DialogActionItemContainer, null, actions.map(function (_ref3, idx) {
|
|
130
|
+
var text = _ref3.text,
|
|
131
|
+
key = _ref3.key,
|
|
132
|
+
rest = (0, _objectWithoutProperties2.default)(_ref3, _excluded);
|
|
133
|
+
return (0, _react2.jsx)(_dialog.DialogActionItem, {
|
|
134
|
+
key: key || (typeof text === 'string' ? text : "".concat(idx))
|
|
135
|
+
}, (0, _react2.jsx)(_customThemeButton.default, rest, text));
|
|
136
|
+
}))) : null));
|
|
137
|
+
})));
|
|
125
138
|
});
|
|
126
139
|
SpotlightCard.displayName = 'SpotlightCard';
|
|
127
140
|
var _default = exports.default = SpotlightCard;
|
|
@@ -27,7 +27,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
|
|
|
27
27
|
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); }; }
|
|
28
28
|
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
|
|
29
29
|
var packageName = "@atlaskit/onboarding";
|
|
30
|
-
var packageVersion = "11.5.
|
|
30
|
+
var packageVersion = "11.5.3";
|
|
31
31
|
var SpotlightDialog = /*#__PURE__*/function (_Component) {
|
|
32
32
|
(0, _inherits2.default)(SpotlightDialog, _Component);
|
|
33
33
|
var _super = _createSuper(SpotlightDialog);
|
|
@@ -4,6 +4,8 @@ import { css, jsx } from '@emotion/react';
|
|
|
4
4
|
import Button, { Theme as ButtonTheme } from '@atlaskit/button/custom-theme-button';
|
|
5
5
|
import Heading from '@atlaskit/heading';
|
|
6
6
|
import { Box, Text, xcss } from '@atlaskit/primitives';
|
|
7
|
+
// eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
|
|
8
|
+
import { createTheme } from '@atlaskit/theme/components';
|
|
7
9
|
import { DialogActionItem, DialogActionItemContainer } from '../styled/dialog';
|
|
8
10
|
import { spotlightButtonTheme } from './theme';
|
|
9
11
|
const bodyStyles = css({
|
|
@@ -48,6 +50,11 @@ const containerStyles = xcss({
|
|
|
48
50
|
const containerShadowStyles = xcss({
|
|
49
51
|
boxShadow: 'elevation.shadow.raised'
|
|
50
52
|
});
|
|
53
|
+
|
|
54
|
+
/**
|
|
55
|
+
* @deprecated
|
|
56
|
+
*/
|
|
57
|
+
const Theme = createTheme(() => ({}));
|
|
51
58
|
/**
|
|
52
59
|
* __Spotlight card__
|
|
53
60
|
*
|
|
@@ -79,7 +86,9 @@ const SpotlightCard = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
79
86
|
} = components;
|
|
80
87
|
return jsx(ButtonTheme.Provider, {
|
|
81
88
|
value: spotlightButtonTheme
|
|
82
|
-
}, jsx(
|
|
89
|
+
}, jsx(Theme.Provider, {
|
|
90
|
+
value: undefined
|
|
91
|
+
}, jsx(Theme.Consumer, null, () => jsx(Box, {
|
|
83
92
|
backgroundColor: "color.background.discovery.bold",
|
|
84
93
|
xcss: [containerStyles, !isFlat && containerShadowStyles],
|
|
85
94
|
style: {
|
|
@@ -106,7 +115,7 @@ const SpotlightCard = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
106
115
|
return jsx(DialogActionItem, {
|
|
107
116
|
key: key || (typeof text === 'string' ? text : `${idx}`)
|
|
108
117
|
}, jsx(Button, rest, text));
|
|
109
|
-
}))) : null)));
|
|
118
|
+
}))) : null)))));
|
|
110
119
|
});
|
|
111
120
|
SpotlightCard.displayName = 'SpotlightCard';
|
|
112
121
|
export default SpotlightCard;
|
|
@@ -7,7 +7,7 @@ import { DialogImage } from '../styled/dialog';
|
|
|
7
7
|
import SpotlightCard from './spotlight-card';
|
|
8
8
|
import ValueChanged from './value-changed';
|
|
9
9
|
const packageName = "@atlaskit/onboarding";
|
|
10
|
-
const packageVersion = "11.5.
|
|
10
|
+
const packageVersion = "11.5.3";
|
|
11
11
|
class SpotlightDialog extends Component {
|
|
12
12
|
constructor(...args) {
|
|
13
13
|
super(...args);
|
|
@@ -6,6 +6,8 @@ import { css, jsx } from '@emotion/react';
|
|
|
6
6
|
import Button, { Theme as ButtonTheme } from '@atlaskit/button/custom-theme-button';
|
|
7
7
|
import Heading from '@atlaskit/heading';
|
|
8
8
|
import { Box, Text, xcss } from '@atlaskit/primitives';
|
|
9
|
+
// eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
|
|
10
|
+
import { createTheme } from '@atlaskit/theme/components';
|
|
9
11
|
import { DialogActionItem, DialogActionItemContainer } from '../styled/dialog';
|
|
10
12
|
import { spotlightButtonTheme } from './theme';
|
|
11
13
|
var bodyStyles = css({
|
|
@@ -52,6 +54,13 @@ var containerStyles = xcss({
|
|
|
52
54
|
var containerShadowStyles = xcss({
|
|
53
55
|
boxShadow: 'elevation.shadow.raised'
|
|
54
56
|
});
|
|
57
|
+
|
|
58
|
+
/**
|
|
59
|
+
* @deprecated
|
|
60
|
+
*/
|
|
61
|
+
var Theme = createTheme(function () {
|
|
62
|
+
return {};
|
|
63
|
+
});
|
|
55
64
|
/**
|
|
56
65
|
* __Spotlight card__
|
|
57
66
|
*
|
|
@@ -85,33 +94,37 @@ var SpotlightCard = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
85
94
|
Footer = _components$Footer === void 0 ? DefaultFooter : _components$Footer;
|
|
86
95
|
return jsx(ButtonTheme.Provider, {
|
|
87
96
|
value: spotlightButtonTheme
|
|
88
|
-
}, jsx(
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
97
|
+
}, jsx(Theme.Provider, {
|
|
98
|
+
value: undefined
|
|
99
|
+
}, jsx(Theme.Consumer, null, function () {
|
|
100
|
+
return jsx(Box, {
|
|
101
|
+
backgroundColor: "color.background.discovery.bold",
|
|
102
|
+
xcss: [containerStyles, !isFlat && containerShadowStyles],
|
|
103
|
+
style: {
|
|
104
|
+
width: width
|
|
105
|
+
},
|
|
106
|
+
ref: ref || innerRef,
|
|
107
|
+
testId: testId
|
|
108
|
+
}, typeof image === 'string' ? jsx("img", {
|
|
109
|
+
css: imageStyles,
|
|
110
|
+
src: image,
|
|
111
|
+
alt: ""
|
|
112
|
+
}) : image, jsx("div", {
|
|
113
|
+
css: bodyStyles
|
|
114
|
+
}, heading || headingAfterElement ? jsx(Header, null, jsx(Heading, {
|
|
115
|
+
id: headingId,
|
|
116
|
+
color: "inverse",
|
|
117
|
+
size: "medium",
|
|
118
|
+
as: "h".concat(headingLevel)
|
|
119
|
+
}, heading), headingAfterElement) : null, jsx(Text, null, children), actions.length > 0 || actionsBeforeElement ? jsx(Footer, null, actionsBeforeElement || jsx("span", null), jsx(DialogActionItemContainer, null, actions.map(function (_ref3, idx) {
|
|
120
|
+
var text = _ref3.text,
|
|
121
|
+
key = _ref3.key,
|
|
122
|
+
rest = _objectWithoutProperties(_ref3, _excluded);
|
|
123
|
+
return jsx(DialogActionItem, {
|
|
124
|
+
key: key || (typeof text === 'string' ? text : "".concat(idx))
|
|
125
|
+
}, jsx(Button, rest, text));
|
|
126
|
+
}))) : null));
|
|
127
|
+
})));
|
|
115
128
|
});
|
|
116
129
|
SpotlightCard.displayName = 'SpotlightCard';
|
|
117
130
|
export default SpotlightCard;
|
|
@@ -17,7 +17,7 @@ import { DialogImage } from '../styled/dialog';
|
|
|
17
17
|
import SpotlightCard from './spotlight-card';
|
|
18
18
|
import ValueChanged from './value-changed';
|
|
19
19
|
var packageName = "@atlaskit/onboarding";
|
|
20
|
-
var packageVersion = "11.5.
|
|
20
|
+
var packageVersion = "11.5.3";
|
|
21
21
|
var SpotlightDialog = /*#__PURE__*/function (_Component) {
|
|
22
22
|
_inherits(SpotlightDialog, _Component);
|
|
23
23
|
var _super = _createSuper(SpotlightDialog);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
|
-
import { ComponentType, ReactNode, Ref } from 'react';
|
|
3
|
-
import { Actions } from '../types';
|
|
2
|
+
import { type ComponentType, type ReactNode, type Ref } from 'react';
|
|
3
|
+
import { type Actions } from '../types';
|
|
4
4
|
interface SpotlightCardProps {
|
|
5
5
|
/**
|
|
6
6
|
* Buttons to render in the footer.
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
|
-
import { ComponentType, ReactNode, Ref } from 'react';
|
|
3
|
-
import { Actions } from '../types';
|
|
2
|
+
import { type ComponentType, type ReactNode, type Ref } from 'react';
|
|
3
|
+
import { type Actions } from '../types';
|
|
4
4
|
interface SpotlightCardProps {
|
|
5
5
|
/**
|
|
6
6
|
* Buttons to render in the footer.
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/onboarding",
|
|
3
|
-
"version": "11.5.
|
|
3
|
+
"version": "11.5.3",
|
|
4
4
|
"description": "An onboarding spotlight introduces new features to users through focused messages or multi-step tours.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -48,7 +48,7 @@
|
|
|
48
48
|
"@atlaskit/motion": "^1.5.0",
|
|
49
49
|
"@atlaskit/popper": "^5.5.0",
|
|
50
50
|
"@atlaskit/portal": "^4.4.0",
|
|
51
|
-
"@atlaskit/primitives": "^
|
|
51
|
+
"@atlaskit/primitives": "^6.0.0",
|
|
52
52
|
"@atlaskit/theme": "^12.7.0",
|
|
53
53
|
"@atlaskit/tokens": "^1.45.0",
|
|
54
54
|
"@babel/runtime": "^7.0.0",
|