@atlaskit/onboarding 14.3.7 → 14.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,21 @@
1
1
  # @atlaskit/onboarding
2
2
 
3
+ ## 14.4.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`098c92cc2bdcd`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/098c92cc2bdcd) -
8
+ Add `checkVisibility` to `useSpotlight` return value, allowing consumers to determine whether a
9
+ spotlight target is visible as determined by `checkVisibility`
10
+
11
+ ## 14.3.8
12
+
13
+ ### Patch Changes
14
+
15
+ - [`255837cfba315`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/255837cfba315) -
16
+ Internal changes to how border radius is applied.
17
+ - Updated dependencies
18
+
3
19
  ## 14.3.7
4
20
 
5
21
  ### Patch Changes
@@ -1,5 +1,5 @@
1
1
 
2
- ._2rkoglpi{border-radius:var(--ds-border-radius,4px)}._16qszucj{box-shadow:var(--ds-shadow-raised,0 1px 1px #091e4240,0 0 1px #091e424f)}
2
+ ._2rko12b0{border-radius:var(--ds-radius-small,4px)}._16qszucj{box-shadow:var(--ds-shadow-raised,0 1px 1px #091e4240,0 0 1px #091e424f)}
3
3
  ._18m91wug{overflow-y:auto}
4
4
  ._1bah1yb4{justify-content:space-between}
5
5
  ._1e0c1txw{display:flex}
@@ -39,7 +39,7 @@ var DefaultFooter = function DefaultFooter(_ref2) {
39
39
  }, children);
40
40
  };
41
41
  var containerStyles = {
42
- root: "_2rkoglpi _1reo1wug _18m91wug _4t3i1ns9 _syaz15cr _1ul91lit _p12f1ogm"
42
+ root: "_2rko12b0 _1reo1wug _18m91wug _4t3i1ns9 _syaz15cr _1ul91lit _p12f1ogm"
43
43
  };
44
44
  var containerShadowStyles = {
45
45
  root: "_16qszucj"
@@ -19,9 +19,16 @@ function useSpotlight() {
19
19
  var isTargetRendered = (0, _react.useCallback)(function (target) {
20
20
  return !!targetRef.current[target];
21
21
  }, []);
22
+ var checkVisibility = (0, _react.useCallback)(function (target) {
23
+ var _targetRef$current$ta;
24
+ return ((_targetRef$current$ta = targetRef.current[target]) === null || _targetRef$current$ta === void 0 ? void 0 : _targetRef$current$ta.checkVisibility) || function () {
25
+ return false;
26
+ };
27
+ }, []);
22
28
  return (0, _react.useMemo)(function () {
23
29
  return {
24
- isTargetRendered: isTargetRendered
30
+ isTargetRendered: isTargetRendered,
31
+ checkVisibility: checkVisibility
25
32
  };
26
- }, [isTargetRendered]);
33
+ }, [isTargetRendered, checkVisibility]);
27
34
  }
@@ -7,11 +7,11 @@
7
7
  ._1pfhze3t{margin-block-start:var(--ds-space-0,0)}
8
8
  ._1q511jfw{padding-block-start:var(--ds-space-500,40px)}
9
9
  ._1q51ze3t{padding-block-start:var(--ds-space-0,0)}
10
- ._1s1g1sit{border-start-start-radius:var(--ds-border-radius,3px)}
10
+ ._1s1gfajl{border-start-start-radius:var(--ds-radius-small,3px)}
11
11
  ._2lx21sbv{flex-direction:row-reverse}
12
12
  ._2lx2vrvc{flex-direction:row}
13
13
  ._4t3i1wug{height:auto}
14
- ._5fbc1sit{border-start-end-radius:var(--ds-border-radius,3px)}
14
+ ._5fbcfajl{border-start-end-radius:var(--ds-radius-small,3px)}
15
15
  ._6rth1b66{margin-block-end:var(--ds-space-050,4px)}
16
16
  ._6rthu2gc{margin-block-end:var(--ds-space-100,8px)}
17
17
  ._85i514no{padding-block-end:36px}
@@ -57,7 +57,7 @@ var ModalImage = exports.ModalImage = function ModalImage(_ref3) {
57
57
  return /*#__PURE__*/React.createElement("img", {
58
58
  alt: alt,
59
59
  src: src,
60
- className: (0, _runtime.ax)(["_1bsb1osq _4t3i1wug _5fbc1sit _1s1g1sit _j722idpf"])
60
+ className: (0, _runtime.ax)(["_1bsb1osq _4t3i1wug _5fbcfajl _1s1gfajl _j722idpf"])
61
61
  });
62
62
  };
63
63
 
@@ -1,5 +1,5 @@
1
1
 
2
- ._2rkoglpi{border-radius:var(--ds-border-radius,4px)}._16qszucj{box-shadow:var(--ds-shadow-raised,0 1px 1px #091e4240,0 0 1px #091e424f)}
2
+ ._2rko12b0{border-radius:var(--ds-radius-small,4px)}._16qszucj{box-shadow:var(--ds-shadow-raised,0 1px 1px #091e4240,0 0 1px #091e424f)}
3
3
  ._18m91wug{overflow-y:auto}
4
4
  ._1bah1yb4{justify-content:space-between}
5
5
  ._1e0c1txw{display:flex}
@@ -26,7 +26,7 @@ const DefaultFooter = ({
26
26
  className: ax(["_1e0c1txw _4cvr1h6o _1bah1yb4 _1q51u2gc"])
27
27
  }, children);
28
28
  const containerStyles = {
29
- root: "_2rkoglpi _1reo1wug _18m91wug _4t3i1ns9 _syaz15cr _1ul91lit _p12f1ogm"
29
+ root: "_2rko12b0 _1reo1wug _18m91wug _4t3i1ns9 _syaz15cr _1ul91lit _p12f1ogm"
30
30
  };
31
31
  const containerShadowStyles = {
32
32
  root: "_16qszucj"
@@ -13,7 +13,12 @@ export default function useSpotlight() {
13
13
  targetRef.current = targets;
14
14
  }, [targets]);
15
15
  const isTargetRendered = useCallback(target => !!targetRef.current[target], []);
16
+ const checkVisibility = useCallback(target => {
17
+ var _targetRef$current$ta;
18
+ return ((_targetRef$current$ta = targetRef.current[target]) === null || _targetRef$current$ta === void 0 ? void 0 : _targetRef$current$ta.checkVisibility) || (() => false);
19
+ }, []);
16
20
  return useMemo(() => ({
17
- isTargetRendered
18
- }), [isTargetRendered]);
21
+ isTargetRendered,
22
+ checkVisibility
23
+ }), [isTargetRendered, checkVisibility]);
19
24
  }
@@ -7,11 +7,11 @@
7
7
  ._1pfhze3t{margin-block-start:var(--ds-space-0,0)}
8
8
  ._1q511jfw{padding-block-start:var(--ds-space-500,40px)}
9
9
  ._1q51ze3t{padding-block-start:var(--ds-space-0,0)}
10
- ._1s1g1sit{border-start-start-radius:var(--ds-border-radius,3px)}
10
+ ._1s1gfajl{border-start-start-radius:var(--ds-radius-small,3px)}
11
11
  ._2lx21sbv{flex-direction:row-reverse}
12
12
  ._2lx2vrvc{flex-direction:row}
13
13
  ._4t3i1wug{height:auto}
14
- ._5fbc1sit{border-start-end-radius:var(--ds-border-radius,3px)}
14
+ ._5fbcfajl{border-start-end-radius:var(--ds-radius-small,3px)}
15
15
  ._6rth1b66{margin-block-end:var(--ds-space-050,4px)}
16
16
  ._6rthu2gc{margin-block-end:var(--ds-space-100,8px)}
17
17
  ._85i514no{padding-block-end:36px}
@@ -49,7 +49,7 @@ export const ModalImage = ({
49
49
  }) => /*#__PURE__*/React.createElement("img", {
50
50
  alt: alt,
51
51
  src: src,
52
- className: ax(["_1bsb1osq _4t3i1wug _5fbc1sit _1s1g1sit _j722idpf"])
52
+ className: ax(["_1bsb1osq _4t3i1wug _5fbcfajl _1s1gfajl _j722idpf"])
53
53
  });
54
54
 
55
55
  /**
@@ -1,5 +1,5 @@
1
1
 
2
- ._2rkoglpi{border-radius:var(--ds-border-radius,4px)}._16qszucj{box-shadow:var(--ds-shadow-raised,0 1px 1px #091e4240,0 0 1px #091e424f)}
2
+ ._2rko12b0{border-radius:var(--ds-radius-small,4px)}._16qszucj{box-shadow:var(--ds-shadow-raised,0 1px 1px #091e4240,0 0 1px #091e424f)}
3
3
  ._18m91wug{overflow-y:auto}
4
4
  ._1bah1yb4{justify-content:space-between}
5
5
  ._1e0c1txw{display:flex}
@@ -30,7 +30,7 @@ var DefaultFooter = function DefaultFooter(_ref2) {
30
30
  }, children);
31
31
  };
32
32
  var containerStyles = {
33
- root: "_2rkoglpi _1reo1wug _18m91wug _4t3i1ns9 _syaz15cr _1ul91lit _p12f1ogm"
33
+ root: "_2rko12b0 _1reo1wug _18m91wug _4t3i1ns9 _syaz15cr _1ul91lit _p12f1ogm"
34
34
  };
35
35
  var containerShadowStyles = {
36
36
  root: "_16qszucj"
@@ -14,9 +14,16 @@ export default function useSpotlight() {
14
14
  var isTargetRendered = useCallback(function (target) {
15
15
  return !!targetRef.current[target];
16
16
  }, []);
17
+ var checkVisibility = useCallback(function (target) {
18
+ var _targetRef$current$ta;
19
+ return ((_targetRef$current$ta = targetRef.current[target]) === null || _targetRef$current$ta === void 0 ? void 0 : _targetRef$current$ta.checkVisibility) || function () {
20
+ return false;
21
+ };
22
+ }, []);
17
23
  return useMemo(function () {
18
24
  return {
19
- isTargetRendered: isTargetRendered
25
+ isTargetRendered: isTargetRendered,
26
+ checkVisibility: checkVisibility
20
27
  };
21
- }, [isTargetRendered]);
28
+ }, [isTargetRendered, checkVisibility]);
22
29
  }
@@ -7,11 +7,11 @@
7
7
  ._1pfhze3t{margin-block-start:var(--ds-space-0,0)}
8
8
  ._1q511jfw{padding-block-start:var(--ds-space-500,40px)}
9
9
  ._1q51ze3t{padding-block-start:var(--ds-space-0,0)}
10
- ._1s1g1sit{border-start-start-radius:var(--ds-border-radius,3px)}
10
+ ._1s1gfajl{border-start-start-radius:var(--ds-radius-small,3px)}
11
11
  ._2lx21sbv{flex-direction:row-reverse}
12
12
  ._2lx2vrvc{flex-direction:row}
13
13
  ._4t3i1wug{height:auto}
14
- ._5fbc1sit{border-start-end-radius:var(--ds-border-radius,3px)}
14
+ ._5fbcfajl{border-start-end-radius:var(--ds-radius-small,3px)}
15
15
  ._6rth1b66{margin-block-end:var(--ds-space-050,4px)}
16
16
  ._6rthu2gc{margin-block-end:var(--ds-space-100,8px)}
17
17
  ._85i514no{padding-block-end:36px}
@@ -49,7 +49,7 @@ export var ModalImage = function ModalImage(_ref3) {
49
49
  return /*#__PURE__*/React.createElement("img", {
50
50
  alt: alt,
51
51
  src: src,
52
- className: ax(["_1bsb1osq _4t3i1wug _5fbc1sit _1s1g1sit _j722idpf"])
52
+ className: ax(["_1bsb1osq _4t3i1wug _5fbcfajl _1s1gfajl _j722idpf"])
53
53
  });
54
54
  };
55
55
 
@@ -3,4 +3,5 @@
3
3
  */
4
4
  export default function useSpotlight(): {
5
5
  isTargetRendered: (target: string) => boolean;
6
+ checkVisibility: (target: string) => (options?: CheckVisibilityOptions) => boolean;
6
7
  };
@@ -3,4 +3,5 @@
3
3
  */
4
4
  export default function useSpotlight(): {
5
5
  isTargetRendered: (target: string) => boolean;
6
+ checkVisibility: (target: string) => (options?: CheckVisibilityOptions) => boolean;
6
7
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/onboarding",
3
- "version": "14.3.7",
3
+ "version": "14.4.0",
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/"