@atlaskit/onboarding 10.3.6 → 10.3.9

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 CHANGED
@@ -1,5 +1,27 @@
1
1
  # @atlaskit/onboarding
2
2
 
3
+ ## 10.3.9
4
+
5
+ ### Patch Changes
6
+
7
+ - [`cb2392f6d33`](https://bitbucket.org/atlassian/atlassian-frontend/commits/cb2392f6d33) - Upgrade to TypeScript 4.2.4
8
+ - Updated dependencies
9
+
10
+ ## 10.3.8
11
+
12
+ ### Patch Changes
13
+
14
+ - Updated dependencies
15
+
16
+ ## 10.3.7
17
+
18
+ ### Patch Changes
19
+
20
+ - [`ac9343c3ed4`](https://bitbucket.org/atlassian/atlassian-frontend/commits/ac9343c3ed4) - Replaces usage of deprecated design tokens. No visual or functional changes
21
+ - [`dcd92130cc4`](https://bitbucket.org/atlassian/atlassian-frontend/commits/dcd92130cc4) - Migrate deleted background accent tokens to replacements
22
+ - [`62edf20ab1e`](https://bitbucket.org/atlassian/atlassian-frontend/commits/62edf20ab1e) - Migrates all usage of brand tokens to either selected or information tokens. This change is purely for semantic reasons, there are no visual or behavioural changes.
23
+ - Updated dependencies
24
+
3
25
  ## 10.3.6
4
26
 
5
27
  ### Patch Changes
@@ -54,7 +54,7 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
54
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; } }
55
55
 
56
56
  var packageName = "@atlaskit/onboarding";
57
- var packageVersion = "10.3.6";
57
+ var packageVersion = "10.3.9";
58
58
 
59
59
  var SpotlightDialog = /*#__PURE__*/function (_Component) {
60
60
  (0, _inherits2.default)(SpotlightDialog, _Component);
@@ -63,12 +63,12 @@ var spotlightTheme = {
63
63
  active: "var(--ds-background-neutral-pressed, ".concat(colors.P500, ")"),
64
64
  disabled: 'none',
65
65
  selected: {
66
- light: "var(--ds-background-brand-hovered, ".concat(colors.N700, ")"),
67
- dark: "var(--ds-background-brand-hovered, ".concat(colors.DN0, ")")
66
+ light: "var(--ds-background-selected-hovered, ".concat(colors.N700, ")"),
67
+ dark: "var(--ds-background-selected-hovered, ".concat(colors.DN0, ")")
68
68
  },
69
69
  focusSelected: {
70
- light: "var(--ds-background-brand-hovered, ".concat(colors.N700, ")"),
71
- dark: "var(--ds-background-brand-hovered, ".concat(colors.DN0, ")")
70
+ light: "var(--ds-background-selected-hovered, ".concat(colors.N700, ")"),
71
+ dark: "var(--ds-background-selected-hovered, ".concat(colors.DN0, ")")
72
72
  }
73
73
  },
74
74
  boxShadow: {
@@ -101,7 +101,7 @@ var spotlightTheme = {
101
101
  hover: "var(--ds-text-inverse, ".concat(colors.P75, ")"),
102
102
  active: "var(--ds-text-inverse, ".concat(colors.P100, ")"),
103
103
  disabled: "var(--ds-text-discovery, ".concat(colors.P500, ")"),
104
- selected: "var(--ds-text-brand, ".concat(colors.N0, ")"),
104
+ selected: "var(--ds-text-selected, ".concat(colors.N0, ")"),
105
105
  focus: "var(--ds-text-inverse, ".concat(colors.N0, ")")
106
106
  }
107
107
  }
@@ -116,7 +116,7 @@ var modalTheme = {
116
116
  light: "var(--ds-background-disabled, ".concat(colors.N30, ")"),
117
117
  dark: "var(--ds-background-disabled, ".concat(colors.DN70, ")")
118
118
  },
119
- selected: "var(--ds-background-brand-hovered, ".concat(colors.R500, ")"),
119
+ selected: "var(--ds-background-selected-hovered, ".concat(colors.R500, ")"),
120
120
  focus: "var(--ds-background-discovery-bold-hovered, ".concat(colors.P400, ")")
121
121
  },
122
122
  boxShadow: {
@@ -131,7 +131,7 @@ var modalTheme = {
131
131
  light: "var(--ds-text-disabled, ".concat(colors.N0, ")"),
132
132
  dark: "var(--ds-text-disabled, ".concat(colors.DN30, ")")
133
133
  },
134
- selected: "var(--ds-text-brand, ".concat(colors.N0, ")"),
134
+ selected: "var(--ds-text-selected, ".concat(colors.N0, ")"),
135
135
  focus: "var(--ds-text-inverse, ".concat(colors.N0, ")")
136
136
  }
137
137
  }
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/onboarding",
3
- "version": "10.3.6",
3
+ "version": "10.3.9",
4
4
  "sideEffects": false
5
5
  }
@@ -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 = "10.3.6";
10
+ const packageVersion = "10.3.9";
11
11
 
12
12
  class SpotlightDialog extends Component {
13
13
  constructor(...args) {
@@ -34,12 +34,12 @@ const spotlightTheme = {
34
34
  active: `var(--ds-background-neutral-pressed, ${colors.P500})`,
35
35
  disabled: 'none',
36
36
  selected: {
37
- light: `var(--ds-background-brand-hovered, ${colors.N700})`,
38
- dark: `var(--ds-background-brand-hovered, ${colors.DN0})`
37
+ light: `var(--ds-background-selected-hovered, ${colors.N700})`,
38
+ dark: `var(--ds-background-selected-hovered, ${colors.DN0})`
39
39
  },
40
40
  focusSelected: {
41
- light: `var(--ds-background-brand-hovered, ${colors.N700})`,
42
- dark: `var(--ds-background-brand-hovered, ${colors.DN0})`
41
+ light: `var(--ds-background-selected-hovered, ${colors.N700})`,
42
+ dark: `var(--ds-background-selected-hovered, ${colors.DN0})`
43
43
  }
44
44
  },
45
45
  boxShadow: {
@@ -72,7 +72,7 @@ const spotlightTheme = {
72
72
  hover: `var(--ds-text-inverse, ${colors.P75})`,
73
73
  active: `var(--ds-text-inverse, ${colors.P100})`,
74
74
  disabled: `var(--ds-text-discovery, ${colors.P500})`,
75
- selected: `var(--ds-text-brand, ${colors.N0})`,
75
+ selected: `var(--ds-text-selected, ${colors.N0})`,
76
76
  focus: `var(--ds-text-inverse, ${colors.N0})`
77
77
  }
78
78
  }
@@ -87,7 +87,7 @@ const modalTheme = {
87
87
  light: `var(--ds-background-disabled, ${colors.N30})`,
88
88
  dark: `var(--ds-background-disabled, ${colors.DN70})`
89
89
  },
90
- selected: `var(--ds-background-brand-hovered, ${colors.R500})`,
90
+ selected: `var(--ds-background-selected-hovered, ${colors.R500})`,
91
91
  focus: `var(--ds-background-discovery-bold-hovered, ${colors.P400})`
92
92
  },
93
93
  boxShadow: {
@@ -102,7 +102,7 @@ const modalTheme = {
102
102
  light: `var(--ds-text-disabled, ${colors.N0})`,
103
103
  dark: `var(--ds-text-disabled, ${colors.DN30})`
104
104
  },
105
- selected: `var(--ds-text-brand, ${colors.N0})`,
105
+ selected: `var(--ds-text-selected, ${colors.N0})`,
106
106
  focus: `var(--ds-text-inverse, ${colors.N0})`
107
107
  }
108
108
  }
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/onboarding",
3
- "version": "10.3.6",
3
+ "version": "10.3.9",
4
4
  "sideEffects": false
5
5
  }
@@ -24,7 +24,7 @@ import { DialogImage } from '../styled/dialog';
24
24
  import SpotlightCard from './spotlight-card';
25
25
  import ValueChanged from './value-changed';
26
26
  var packageName = "@atlaskit/onboarding";
27
- var packageVersion = "10.3.6";
27
+ var packageVersion = "10.3.9";
28
28
 
29
29
  var SpotlightDialog = /*#__PURE__*/function (_Component) {
30
30
  _inherits(SpotlightDialog, _Component);
@@ -44,12 +44,12 @@ var spotlightTheme = {
44
44
  active: "var(--ds-background-neutral-pressed, ".concat(colors.P500, ")"),
45
45
  disabled: 'none',
46
46
  selected: {
47
- light: "var(--ds-background-brand-hovered, ".concat(colors.N700, ")"),
48
- dark: "var(--ds-background-brand-hovered, ".concat(colors.DN0, ")")
47
+ light: "var(--ds-background-selected-hovered, ".concat(colors.N700, ")"),
48
+ dark: "var(--ds-background-selected-hovered, ".concat(colors.DN0, ")")
49
49
  },
50
50
  focusSelected: {
51
- light: "var(--ds-background-brand-hovered, ".concat(colors.N700, ")"),
52
- dark: "var(--ds-background-brand-hovered, ".concat(colors.DN0, ")")
51
+ light: "var(--ds-background-selected-hovered, ".concat(colors.N700, ")"),
52
+ dark: "var(--ds-background-selected-hovered, ".concat(colors.DN0, ")")
53
53
  }
54
54
  },
55
55
  boxShadow: {
@@ -82,7 +82,7 @@ var spotlightTheme = {
82
82
  hover: "var(--ds-text-inverse, ".concat(colors.P75, ")"),
83
83
  active: "var(--ds-text-inverse, ".concat(colors.P100, ")"),
84
84
  disabled: "var(--ds-text-discovery, ".concat(colors.P500, ")"),
85
- selected: "var(--ds-text-brand, ".concat(colors.N0, ")"),
85
+ selected: "var(--ds-text-selected, ".concat(colors.N0, ")"),
86
86
  focus: "var(--ds-text-inverse, ".concat(colors.N0, ")")
87
87
  }
88
88
  }
@@ -97,7 +97,7 @@ var modalTheme = {
97
97
  light: "var(--ds-background-disabled, ".concat(colors.N30, ")"),
98
98
  dark: "var(--ds-background-disabled, ".concat(colors.DN70, ")")
99
99
  },
100
- selected: "var(--ds-background-brand-hovered, ".concat(colors.R500, ")"),
100
+ selected: "var(--ds-background-selected-hovered, ".concat(colors.R500, ")"),
101
101
  focus: "var(--ds-background-discovery-bold-hovered, ".concat(colors.P400, ")")
102
102
  },
103
103
  boxShadow: {
@@ -112,7 +112,7 @@ var modalTheme = {
112
112
  light: "var(--ds-text-disabled, ".concat(colors.N0, ")"),
113
113
  dark: "var(--ds-text-disabled, ".concat(colors.DN30, ")")
114
114
  },
115
- selected: "var(--ds-text-brand, ".concat(colors.N0, ")"),
115
+ selected: "var(--ds-text-selected, ".concat(colors.N0, ")"),
116
116
  focus: "var(--ds-text-inverse, ".concat(colors.N0, ")")
117
117
  }
118
118
  }
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/onboarding",
3
- "version": "10.3.6",
3
+ "version": "10.3.9",
4
4
  "sideEffects": false
5
5
  }
@@ -41,8 +41,8 @@ declare type ModalProps = {
41
41
  * - [Examples](https://atlaskit.atlassian.com/packages/design-system/onboarding)
42
42
  */
43
43
  export default class OnboardingModal extends Component<ModalProps> {
44
- headerComponent: (props: ModalProps) => "symbol" | "object" | "clipPath" | "filter" | "mask" | "marker" | "small" | "ruby" | "table" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "s" | "samp" | "script" | "section" | "select" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<HeaderComponentProps, any> | import("react").FunctionComponent<HeaderComponentProps> | (() => JSX.Element);
45
- footerComponent: (props: ModalProps) => "symbol" | "object" | "clipPath" | "filter" | "mask" | "marker" | "small" | "ruby" | "table" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "s" | "samp" | "script" | "section" | "select" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<FooterComponentProps, any> | import("react").FunctionComponent<FooterComponentProps> | (() => JSX.Element | null);
44
+ headerComponent: (props: ModalProps) => ElementType<HeaderComponentProps> | (() => JSX.Element);
45
+ footerComponent: (props: ModalProps) => ElementType<FooterComponentProps> | (() => JSX.Element | null);
46
46
  render(): JSX.Element;
47
47
  }
48
48
  export {};
@@ -57,5 +57,5 @@ export interface SpotlightDialogProps extends WithAnalyticsEventsProps {
57
57
  */
58
58
  testId?: string;
59
59
  }
60
- declare const _default: React.ForwardRefExoticComponent<Pick<Pick<SpotlightDialogProps, "children" | "footer" | "header" | "image" | "testId" | "actions" | "heading" | "targetNode" | "actionsBeforeElement" | "headingAfterElement" | "dialogPlacement" | "dialogWidth" | "animationStyles"> & React.RefAttributes<any> & import("@atlaskit/analytics-next").WithContextProps, "children" | "footer" | "header" | "image" | "testId" | "analyticsContext" | "actions" | "heading" | "key" | "targetNode" | "actionsBeforeElement" | "headingAfterElement" | "dialogPlacement" | "dialogWidth" | "animationStyles"> & React.RefAttributes<any>>;
60
+ declare const _default: React.ForwardRefExoticComponent<Pick<Omit<SpotlightDialogProps, keyof WithAnalyticsEventsProps> & React.RefAttributes<any> & import("@atlaskit/analytics-next").WithContextProps, "children" | "footer" | "header" | "image" | "testId" | "analyticsContext" | "actions" | "heading" | "key" | "targetNode" | "actionsBeforeElement" | "headingAfterElement" | "dialogPlacement" | "dialogWidth" | "animationStyles"> & React.RefAttributes<any>>;
61
61
  export default _default;
@@ -22,7 +22,7 @@ interface SpotlightTransitionContextModel {
22
22
  */
23
23
  declare class SpotlightTransition extends React.Component<SpotlightTransitionProps, State> {
24
24
  static getDerivedStateFromProps(props: SpotlightTransitionProps, state: State): {
25
- currentChildren: {} | null | undefined;
25
+ currentChildren: React.ReactNode;
26
26
  };
27
27
  state: {
28
28
  currentChildren: undefined;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/onboarding",
3
- "version": "10.3.6",
3
+ "version": "10.3.9",
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/"
@@ -25,12 +25,12 @@
25
25
  },
26
26
  "dependencies": {
27
27
  "@atlaskit/analytics-next": "^8.0.0",
28
- "@atlaskit/button": "^16.2.0",
28
+ "@atlaskit/button": "^16.3.0",
29
29
  "@atlaskit/modal-dialog": "^12.2.0",
30
30
  "@atlaskit/popper": "^5.0.0",
31
31
  "@atlaskit/portal": "^4.0.0",
32
32
  "@atlaskit/theme": "^12.1.0",
33
- "@atlaskit/tokens": "^0.7.0",
33
+ "@atlaskit/tokens": "^0.9.0",
34
34
  "@babel/runtime": "^7.0.0",
35
35
  "@emotion/core": "^10.0.9",
36
36
  "exenv": "^1.2.2",
@@ -60,7 +60,7 @@
60
60
  "raf-stub": "^2.0.1",
61
61
  "react-dom": "^16.8.0",
62
62
  "react-lorem-component": "^0.13.0",
63
- "typescript": "3.9.6"
63
+ "typescript": "4.2.4"
64
64
  },
65
65
  "techstack": {
66
66
  "@atlassian/frontend": {