@atlaskit/spotlight 0.0.5 → 0.0.6

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.
Files changed (37) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/cjs/index.js +15 -1
  3. package/dist/cjs/ui/controls/index.js +25 -0
  4. package/dist/cjs/ui/dismiss-control/index.js +29 -0
  5. package/dist/cjs/ui/footer/index.compiled.css +3 -2
  6. package/dist/cjs/ui/footer/index.js +1 -1
  7. package/dist/es2019/index.js +3 -1
  8. package/dist/es2019/ui/actions/index.js +2 -2
  9. package/dist/es2019/ui/controls/index.js +18 -0
  10. package/dist/es2019/ui/dismiss-control/index.js +21 -0
  11. package/dist/es2019/ui/footer/index.compiled.css +3 -2
  12. package/dist/es2019/ui/footer/index.js +3 -3
  13. package/dist/es2019/ui/primary-action/index.js +1 -1
  14. package/dist/es2019/ui/secondary-action/index.js +1 -1
  15. package/dist/esm/index.js +3 -1
  16. package/dist/esm/ui/actions/index.js +2 -2
  17. package/dist/esm/ui/controls/index.js +17 -0
  18. package/dist/esm/ui/dismiss-control/index.js +20 -0
  19. package/dist/esm/ui/footer/index.compiled.css +3 -2
  20. package/dist/esm/ui/footer/index.js +3 -3
  21. package/dist/esm/ui/primary-action/index.js +1 -1
  22. package/dist/esm/ui/secondary-action/index.js +1 -1
  23. package/dist/types/index.d.ts +7 -5
  24. package/dist/types/ui/actions/index.d.ts +3 -3
  25. package/dist/types/ui/controls/index.d.ts +19 -0
  26. package/dist/types/ui/dismiss-control/index.d.ts +16 -0
  27. package/dist/types/ui/footer/index.d.ts +1 -1
  28. package/dist/types/ui/primary-action/index.d.ts +3 -3
  29. package/dist/types/ui/secondary-action/index.d.ts +3 -3
  30. package/dist/types-ts4.5/index.d.ts +7 -5
  31. package/dist/types-ts4.5/ui/actions/index.d.ts +3 -3
  32. package/dist/types-ts4.5/ui/controls/index.d.ts +19 -0
  33. package/dist/types-ts4.5/ui/dismiss-control/index.d.ts +16 -0
  34. package/dist/types-ts4.5/ui/footer/index.d.ts +1 -1
  35. package/dist/types-ts4.5/ui/primary-action/index.d.ts +3 -3
  36. package/dist/types-ts4.5/ui/secondary-action/index.d.ts +3 -3
  37. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,12 @@
1
1
  # @atlaskit/spotlight
2
2
 
3
+ ## 0.0.6
4
+
5
+ ### Patch Changes
6
+
7
+ - [`11c7c29e7cff4`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/11c7c29e7cff4) -
8
+ Create Controls, and DismissControl components.
9
+
3
10
  ## 0.0.5
4
11
 
5
12
  ### Patch Changes
package/dist/cjs/index.js CHANGED
@@ -15,6 +15,18 @@ Object.defineProperty(exports, "SpotlightActions", {
15
15
  return _actions.SpotlightActions;
16
16
  }
17
17
  });
18
+ Object.defineProperty(exports, "SpotlightControls", {
19
+ enumerable: true,
20
+ get: function get() {
21
+ return _controls.SpotlightControls;
22
+ }
23
+ });
24
+ Object.defineProperty(exports, "SpotlightDismissControl", {
25
+ enumerable: true,
26
+ get: function get() {
27
+ return _dismissControl.SpotlightDismissControl;
28
+ }
29
+ });
18
30
  Object.defineProperty(exports, "SpotlightFooter", {
19
31
  enumerable: true,
20
32
  get: function get() {
@@ -51,4 +63,6 @@ var _headline = require("./ui/headline");
51
63
  var _footer = require("./ui/footer");
52
64
  var _actions = require("./ui/actions");
53
65
  var _primaryAction = require("./ui/primary-action");
54
- var _secondaryAction = require("./ui/secondary-action");
66
+ var _secondaryAction = require("./ui/secondary-action");
67
+ var _controls = require("./ui/controls");
68
+ var _dismissControl = require("./ui/dismiss-control");
@@ -0,0 +1,25 @@
1
+ "use strict";
2
+
3
+ var _typeof = require("@babel/runtime/helpers/typeof");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.SpotlightControls = void 0;
8
+ var _react = _interopRequireWildcard(require("react"));
9
+ var _compiled = require("@atlaskit/primitives/compiled");
10
+ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
11
+ /**
12
+ * __Spotlight controls__
13
+ *
14
+ * `SpotlightControls` groups spotlight control components.
15
+ */
16
+ var SpotlightControls = exports.SpotlightControls = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
17
+ var testId = _ref.testId,
18
+ children = _ref.children;
19
+ return /*#__PURE__*/_react.default.createElement(_compiled.Flex, {
20
+ testId: testId,
21
+ ref: ref,
22
+ gap: "space.100",
23
+ role: "group"
24
+ }, children);
25
+ });
@@ -0,0 +1,29 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ var _typeof = require("@babel/runtime/helpers/typeof");
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.SpotlightDismissControl = void 0;
9
+ var _react = _interopRequireWildcard(require("react"));
10
+ var _new = require("@atlaskit/button/new");
11
+ var _cross = _interopRequireDefault(require("@atlaskit/icon/core/cross"));
12
+ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
13
+ /**
14
+ * __SpotlightDismissControl__
15
+ *
16
+ * SpotlightDismissControl allows the user to close the `Spotlight`.
17
+ *
18
+ */
19
+ var SpotlightDismissControl = exports.SpotlightDismissControl = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
20
+ var testId = _ref.testId;
21
+ return /*#__PURE__*/_react.default.createElement(_new.IconButton, {
22
+ testId: testId,
23
+ ref: ref,
24
+ appearance: "default",
25
+ spacing: "compact",
26
+ icon: _cross.default,
27
+ label: "Close"
28
+ });
29
+ });
@@ -1,3 +1,4 @@
1
- ._18zrpxbi{padding-inline:var(--ds-space-200,1pc)}
2
1
  ._1bsb1osq{width:100%}
3
- ._85i5utpp{padding-block-end:var(--ds-space-150,9pt)}
2
+ ._85i5utpp{padding-block-end:var(--ds-space-150,9pt)}
3
+ ._bozgpxbi{padding-inline-start:var(--ds-space-200,1pc)}
4
+ ._y4tiutpp{padding-inline-end:var(--ds-space-150,9pt)}
@@ -12,7 +12,7 @@ var _react = _interopRequireWildcard(require("react"));
12
12
  var _compiled = require("@atlaskit/primitives/compiled");
13
13
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
14
14
  var styles = {
15
- root: "_18zrpxbi _85i5utpp _1bsb1osq"
15
+ root: "_bozgpxbi _y4tiutpp _85i5utpp _1bsb1osq"
16
16
  };
17
17
  /**
18
18
  * __SpotlightFooter__
@@ -4,4 +4,6 @@ export { SpotlightHeadline } from './ui/headline';
4
4
  export { SpotlightFooter } from './ui/footer';
5
5
  export { SpotlightActions } from './ui/actions';
6
6
  export { SpotlightPrimaryAction } from './ui/primary-action';
7
- export { SpotlightSecondaryAction } from './ui/secondary-action';
7
+ export { SpotlightSecondaryAction } from './ui/secondary-action';
8
+ export { SpotlightControls } from './ui/controls';
9
+ export { SpotlightDismissControl } from './ui/dismiss-control';
@@ -1,8 +1,8 @@
1
1
  /* index.tsx generated by @compiled/babel-plugin v0.36.1 */
2
2
  import "./index.compiled.css";
3
3
  import { ax, ix } from "@compiled/react/runtime";
4
- import React, { forwardRef } from "react";
5
- import { Flex } from "@atlaskit/primitives/compiled";
4
+ import React, { forwardRef } from 'react';
5
+ import { Flex } from '@atlaskit/primitives/compiled';
6
6
  const styles = {
7
7
  root: "_1bsb1osq"
8
8
  };
@@ -0,0 +1,18 @@
1
+ import React, { forwardRef } from "react";
2
+ import { Flex } from "@atlaskit/primitives/compiled";
3
+ /**
4
+ * __Spotlight controls__
5
+ *
6
+ * `SpotlightControls` groups spotlight control components.
7
+ */
8
+ export const SpotlightControls = /*#__PURE__*/forwardRef(({
9
+ testId,
10
+ children
11
+ }, ref) => {
12
+ return /*#__PURE__*/React.createElement(Flex, {
13
+ testId: testId,
14
+ ref: ref,
15
+ gap: "space.100",
16
+ role: "group"
17
+ }, children);
18
+ });
@@ -0,0 +1,21 @@
1
+ import React, { forwardRef } from "react";
2
+ import { IconButton } from '@atlaskit/button/new';
3
+ import CrossIcon from '@atlaskit/icon/core/cross';
4
+ /**
5
+ * __SpotlightDismissControl__
6
+ *
7
+ * SpotlightDismissControl allows the user to close the `Spotlight`.
8
+ *
9
+ */
10
+ export const SpotlightDismissControl = /*#__PURE__*/forwardRef(({
11
+ testId
12
+ }, ref) => {
13
+ return /*#__PURE__*/React.createElement(IconButton, {
14
+ testId: testId,
15
+ ref: ref,
16
+ appearance: "default",
17
+ spacing: "compact",
18
+ icon: CrossIcon,
19
+ label: "Close"
20
+ });
21
+ });
@@ -1,3 +1,4 @@
1
- ._18zrpxbi{padding-inline:var(--ds-space-200,1pc)}
2
1
  ._1bsb1osq{width:100%}
3
- ._85i5utpp{padding-block-end:var(--ds-space-150,9pt)}
2
+ ._85i5utpp{padding-block-end:var(--ds-space-150,9pt)}
3
+ ._bozgpxbi{padding-inline-start:var(--ds-space-200,1pc)}
4
+ ._y4tiutpp{padding-inline-end:var(--ds-space-150,9pt)}
@@ -1,10 +1,10 @@
1
1
  /* index.tsx generated by @compiled/babel-plugin v0.36.1 */
2
2
  import "./index.compiled.css";
3
3
  import { ax, ix } from "@compiled/react/runtime";
4
- import React, { forwardRef } from "react";
5
- import { Flex } from "@atlaskit/primitives/compiled";
4
+ import React, { forwardRef } from 'react';
5
+ import { Flex } from '@atlaskit/primitives/compiled';
6
6
  const styles = {
7
- root: "_18zrpxbi _85i5utpp _1bsb1osq"
7
+ root: "_bozgpxbi _y4tiutpp _85i5utpp _1bsb1osq"
8
8
  };
9
9
  /**
10
10
  * __SpotlightFooter__
@@ -1,4 +1,4 @@
1
- import React, { forwardRef } from "react";
1
+ import React, { forwardRef } from 'react';
2
2
  import Button from '@atlaskit/button/new';
3
3
  /**
4
4
  * __Spotlight primary action__
@@ -1,4 +1,4 @@
1
- import React, { forwardRef } from "react";
1
+ import React, { forwardRef } from 'react';
2
2
  import Button from '@atlaskit/button/new';
3
3
  import { Text } from '@atlaskit/primitives/compiled';
4
4
  /**
package/dist/esm/index.js CHANGED
@@ -4,4 +4,6 @@ export { SpotlightHeadline } from './ui/headline';
4
4
  export { SpotlightFooter } from './ui/footer';
5
5
  export { SpotlightActions } from './ui/actions';
6
6
  export { SpotlightPrimaryAction } from './ui/primary-action';
7
- export { SpotlightSecondaryAction } from './ui/secondary-action';
7
+ export { SpotlightSecondaryAction } from './ui/secondary-action';
8
+ export { SpotlightControls } from './ui/controls';
9
+ export { SpotlightDismissControl } from './ui/dismiss-control';
@@ -1,8 +1,8 @@
1
1
  /* index.tsx generated by @compiled/babel-plugin v0.36.1 */
2
2
  import "./index.compiled.css";
3
3
  import { ax, ix } from "@compiled/react/runtime";
4
- import React, { forwardRef } from "react";
5
- import { Flex } from "@atlaskit/primitives/compiled";
4
+ import React, { forwardRef } from 'react';
5
+ import { Flex } from '@atlaskit/primitives/compiled';
6
6
  var styles = {
7
7
  root: "_1bsb1osq"
8
8
  };
@@ -0,0 +1,17 @@
1
+ import React, { forwardRef } from "react";
2
+ import { Flex } from "@atlaskit/primitives/compiled";
3
+ /**
4
+ * __Spotlight controls__
5
+ *
6
+ * `SpotlightControls` groups spotlight control components.
7
+ */
8
+ export var SpotlightControls = /*#__PURE__*/forwardRef(function (_ref, ref) {
9
+ var testId = _ref.testId,
10
+ children = _ref.children;
11
+ return /*#__PURE__*/React.createElement(Flex, {
12
+ testId: testId,
13
+ ref: ref,
14
+ gap: "space.100",
15
+ role: "group"
16
+ }, children);
17
+ });
@@ -0,0 +1,20 @@
1
+ import React, { forwardRef } from "react";
2
+ import { IconButton } from '@atlaskit/button/new';
3
+ import CrossIcon from '@atlaskit/icon/core/cross';
4
+ /**
5
+ * __SpotlightDismissControl__
6
+ *
7
+ * SpotlightDismissControl allows the user to close the `Spotlight`.
8
+ *
9
+ */
10
+ export var SpotlightDismissControl = /*#__PURE__*/forwardRef(function (_ref, ref) {
11
+ var testId = _ref.testId;
12
+ return /*#__PURE__*/React.createElement(IconButton, {
13
+ testId: testId,
14
+ ref: ref,
15
+ appearance: "default",
16
+ spacing: "compact",
17
+ icon: CrossIcon,
18
+ label: "Close"
19
+ });
20
+ });
@@ -1,3 +1,4 @@
1
- ._18zrpxbi{padding-inline:var(--ds-space-200,1pc)}
2
1
  ._1bsb1osq{width:100%}
3
- ._85i5utpp{padding-block-end:var(--ds-space-150,9pt)}
2
+ ._85i5utpp{padding-block-end:var(--ds-space-150,9pt)}
3
+ ._bozgpxbi{padding-inline-start:var(--ds-space-200,1pc)}
4
+ ._y4tiutpp{padding-inline-end:var(--ds-space-150,9pt)}
@@ -1,10 +1,10 @@
1
1
  /* index.tsx generated by @compiled/babel-plugin v0.36.1 */
2
2
  import "./index.compiled.css";
3
3
  import { ax, ix } from "@compiled/react/runtime";
4
- import React, { forwardRef } from "react";
5
- import { Flex } from "@atlaskit/primitives/compiled";
4
+ import React, { forwardRef } from 'react';
5
+ import { Flex } from '@atlaskit/primitives/compiled';
6
6
  var styles = {
7
- root: "_18zrpxbi _85i5utpp _1bsb1osq"
7
+ root: "_bozgpxbi _y4tiutpp _85i5utpp _1bsb1osq"
8
8
  };
9
9
  /**
10
10
  * __SpotlightFooter__
@@ -1,4 +1,4 @@
1
- import React, { forwardRef } from "react";
1
+ import React, { forwardRef } from 'react';
2
2
  import Button from '@atlaskit/button/new';
3
3
  /**
4
4
  * __Spotlight primary action__
@@ -1,4 +1,4 @@
1
- import React, { forwardRef } from "react";
1
+ import React, { forwardRef } from 'react';
2
2
  import Button from '@atlaskit/button/new';
3
3
  import { Text } from '@atlaskit/primitives/compiled';
4
4
  /**
@@ -1,7 +1,9 @@
1
1
  export { Spotlight, type SpotlightProps } from './ui/spotlight';
2
2
  export { SpotlightHeader, type SpotlightHeaderProps } from './ui/header';
3
- export { SpotlightHeadline } from './ui/headline';
4
- export { SpotlightFooter } from './ui/footer';
5
- export { SpotlightActions } from './ui/actions';
6
- export { SpotlightPrimaryAction } from './ui/primary-action';
7
- export { SpotlightSecondaryAction } from './ui/secondary-action';
3
+ export { SpotlightHeadline, type SpotlightHeadlineProps } from './ui/headline';
4
+ export { SpotlightFooter, type SpotlightFooterProps } from './ui/footer';
5
+ export { SpotlightActions, type SpotlightActionsProps } from './ui/actions';
6
+ export { SpotlightPrimaryAction, type SpotlightPrimaryActionProps } from './ui/primary-action';
7
+ export { SpotlightSecondaryAction, type SpotlightSecondaryActionProps } from './ui/secondary-action';
8
+ export { SpotlightControls, type SpotlightControlsProps } from './ui/controls';
9
+ export { SpotlightDismissControl, type SpotlightDismissControlProps } from './ui/dismiss-control';
@@ -1,5 +1,5 @@
1
- import React, { type ReactNode } from "react";
2
- export interface SpotlighActionsProps {
1
+ import React, { type ReactNode } from 'react';
2
+ export interface SpotlightActionsProps {
3
3
  /**
4
4
  * A `testId` prop is provided for specified elements, which is a unique
5
5
  * string that appears as a data attribute `data-testid` in the rendered code,
@@ -17,4 +17,4 @@ export interface SpotlighActionsProps {
17
17
  * `SpotlightActions` groups `SpotlightAction` components.
18
18
  *
19
19
  */
20
- export declare const SpotlightActions: React.ForwardRefExoticComponent<SpotlighActionsProps & React.RefAttributes<HTMLDivElement>>;
20
+ export declare const SpotlightActions: React.ForwardRefExoticComponent<SpotlightActionsProps & React.RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,19 @@
1
+ import React, { type ReactNode } from "react";
2
+ export interface SpotlightControlsProps {
3
+ /**
4
+ * A `testId` prop is provided for specified elements, which is a unique
5
+ * string that appears as a data attribute `data-testid` in the rendered code,
6
+ * serving as a hook for automated tests
7
+ */
8
+ testId?: string;
9
+ /**
10
+ * Elements to be rendered inside the `SpotlightFooter`.
11
+ */
12
+ children?: ReactNode;
13
+ }
14
+ /**
15
+ * __Spotlight controls__
16
+ *
17
+ * `SpotlightControls` groups spotlight control components.
18
+ */
19
+ export declare const SpotlightControls: React.ForwardRefExoticComponent<SpotlightControlsProps & React.RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,16 @@
1
+ import React from "react";
2
+ export interface SpotlightDismissControlProps {
3
+ /**
4
+ * A `testId` prop is provided for specified elements, which is a unique
5
+ * string that appears as a data attribute `data-testid` in the rendered code,
6
+ * serving as a hook for automated tests
7
+ */
8
+ testId?: string;
9
+ }
10
+ /**
11
+ * __SpotlightDismissControl__
12
+ *
13
+ * SpotlightDismissControl allows the user to close the `Spotlight`.
14
+ *
15
+ */
16
+ export declare const SpotlightDismissControl: React.ForwardRefExoticComponent<SpotlightDismissControlProps & React.RefAttributes<HTMLButtonElement>>;
@@ -1,4 +1,4 @@
1
- import React, { type ReactNode } from "react";
1
+ import React, { type ReactNode } from 'react';
2
2
  export interface SpotlightFooterProps {
3
3
  /**
4
4
  * A `testId` prop is provided for specified elements, which is a unique
@@ -1,6 +1,6 @@
1
- import React, { type ReactNode } from "react";
1
+ import React, { type ReactNode } from 'react';
2
2
  import { type ButtonProps } from '@atlaskit/button/new';
3
- export interface PrimaryActionProps {
3
+ export interface SpotlightPrimaryActionProps {
4
4
  /**
5
5
  * A `testId` prop is provided for specified elements, which is a unique
6
6
  * string that appears as a data attribute `data-testid` in the rendered code,
@@ -23,4 +23,4 @@ export interface PrimaryActionProps {
23
23
  * for single step spotlights, or to show the next step on multi step spotlight tours.
24
24
  *
25
25
  */
26
- export declare const SpotlightPrimaryAction: React.ForwardRefExoticComponent<PrimaryActionProps & React.RefAttributes<HTMLButtonElement>>;
26
+ export declare const SpotlightPrimaryAction: React.ForwardRefExoticComponent<SpotlightPrimaryActionProps & React.RefAttributes<HTMLButtonElement>>;
@@ -1,6 +1,6 @@
1
- import React, { type ReactNode } from "react";
1
+ import React, { type ReactNode } from 'react';
2
2
  import { type ButtonProps } from '@atlaskit/button/new';
3
- export interface SecondaryActionProps {
3
+ export interface SpotlightSecondaryActionProps {
4
4
  /**
5
5
  * A `testId` prop is provided for specified elements, which is a unique
6
6
  * string that appears as a data attribute `data-testid` in the rendered code,
@@ -23,4 +23,4 @@ export interface SecondaryActionProps {
23
23
  * It is intended to be used to go back to the previous step in multi step spotlight tours, or other similar actions.
24
24
  *
25
25
  */
26
- export declare const SpotlightSecondaryAction: React.ForwardRefExoticComponent<SecondaryActionProps & React.RefAttributes<HTMLButtonElement>>;
26
+ export declare const SpotlightSecondaryAction: React.ForwardRefExoticComponent<SpotlightSecondaryActionProps & React.RefAttributes<HTMLButtonElement>>;
@@ -1,7 +1,9 @@
1
1
  export { Spotlight, type SpotlightProps } from './ui/spotlight';
2
2
  export { SpotlightHeader, type SpotlightHeaderProps } from './ui/header';
3
- export { SpotlightHeadline } from './ui/headline';
4
- export { SpotlightFooter } from './ui/footer';
5
- export { SpotlightActions } from './ui/actions';
6
- export { SpotlightPrimaryAction } from './ui/primary-action';
7
- export { SpotlightSecondaryAction } from './ui/secondary-action';
3
+ export { SpotlightHeadline, type SpotlightHeadlineProps } from './ui/headline';
4
+ export { SpotlightFooter, type SpotlightFooterProps } from './ui/footer';
5
+ export { SpotlightActions, type SpotlightActionsProps } from './ui/actions';
6
+ export { SpotlightPrimaryAction, type SpotlightPrimaryActionProps } from './ui/primary-action';
7
+ export { SpotlightSecondaryAction, type SpotlightSecondaryActionProps } from './ui/secondary-action';
8
+ export { SpotlightControls, type SpotlightControlsProps } from './ui/controls';
9
+ export { SpotlightDismissControl, type SpotlightDismissControlProps } from './ui/dismiss-control';
@@ -1,5 +1,5 @@
1
- import React, { type ReactNode } from "react";
2
- export interface SpotlighActionsProps {
1
+ import React, { type ReactNode } from 'react';
2
+ export interface SpotlightActionsProps {
3
3
  /**
4
4
  * A `testId` prop is provided for specified elements, which is a unique
5
5
  * string that appears as a data attribute `data-testid` in the rendered code,
@@ -17,4 +17,4 @@ export interface SpotlighActionsProps {
17
17
  * `SpotlightActions` groups `SpotlightAction` components.
18
18
  *
19
19
  */
20
- export declare const SpotlightActions: React.ForwardRefExoticComponent<SpotlighActionsProps & React.RefAttributes<HTMLDivElement>>;
20
+ export declare const SpotlightActions: React.ForwardRefExoticComponent<SpotlightActionsProps & React.RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,19 @@
1
+ import React, { type ReactNode } from "react";
2
+ export interface SpotlightControlsProps {
3
+ /**
4
+ * A `testId` prop is provided for specified elements, which is a unique
5
+ * string that appears as a data attribute `data-testid` in the rendered code,
6
+ * serving as a hook for automated tests
7
+ */
8
+ testId?: string;
9
+ /**
10
+ * Elements to be rendered inside the `SpotlightFooter`.
11
+ */
12
+ children?: ReactNode;
13
+ }
14
+ /**
15
+ * __Spotlight controls__
16
+ *
17
+ * `SpotlightControls` groups spotlight control components.
18
+ */
19
+ export declare const SpotlightControls: React.ForwardRefExoticComponent<SpotlightControlsProps & React.RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,16 @@
1
+ import React from "react";
2
+ export interface SpotlightDismissControlProps {
3
+ /**
4
+ * A `testId` prop is provided for specified elements, which is a unique
5
+ * string that appears as a data attribute `data-testid` in the rendered code,
6
+ * serving as a hook for automated tests
7
+ */
8
+ testId?: string;
9
+ }
10
+ /**
11
+ * __SpotlightDismissControl__
12
+ *
13
+ * SpotlightDismissControl allows the user to close the `Spotlight`.
14
+ *
15
+ */
16
+ export declare const SpotlightDismissControl: React.ForwardRefExoticComponent<SpotlightDismissControlProps & React.RefAttributes<HTMLButtonElement>>;
@@ -1,4 +1,4 @@
1
- import React, { type ReactNode } from "react";
1
+ import React, { type ReactNode } from 'react';
2
2
  export interface SpotlightFooterProps {
3
3
  /**
4
4
  * A `testId` prop is provided for specified elements, which is a unique
@@ -1,6 +1,6 @@
1
- import React, { type ReactNode } from "react";
1
+ import React, { type ReactNode } from 'react';
2
2
  import { type ButtonProps } from '@atlaskit/button/new';
3
- export interface PrimaryActionProps {
3
+ export interface SpotlightPrimaryActionProps {
4
4
  /**
5
5
  * A `testId` prop is provided for specified elements, which is a unique
6
6
  * string that appears as a data attribute `data-testid` in the rendered code,
@@ -23,4 +23,4 @@ export interface PrimaryActionProps {
23
23
  * for single step spotlights, or to show the next step on multi step spotlight tours.
24
24
  *
25
25
  */
26
- export declare const SpotlightPrimaryAction: React.ForwardRefExoticComponent<PrimaryActionProps & React.RefAttributes<HTMLButtonElement>>;
26
+ export declare const SpotlightPrimaryAction: React.ForwardRefExoticComponent<SpotlightPrimaryActionProps & React.RefAttributes<HTMLButtonElement>>;
@@ -1,6 +1,6 @@
1
- import React, { type ReactNode } from "react";
1
+ import React, { type ReactNode } from 'react';
2
2
  import { type ButtonProps } from '@atlaskit/button/new';
3
- export interface SecondaryActionProps {
3
+ export interface SpotlightSecondaryActionProps {
4
4
  /**
5
5
  * A `testId` prop is provided for specified elements, which is a unique
6
6
  * string that appears as a data attribute `data-testid` in the rendered code,
@@ -23,4 +23,4 @@ export interface SecondaryActionProps {
23
23
  * It is intended to be used to go back to the previous step in multi step spotlight tours, or other similar actions.
24
24
  *
25
25
  */
26
- export declare const SpotlightSecondaryAction: React.ForwardRefExoticComponent<SecondaryActionProps & React.RefAttributes<HTMLButtonElement>>;
26
+ export declare const SpotlightSecondaryAction: React.ForwardRefExoticComponent<SpotlightSecondaryActionProps & React.RefAttributes<HTMLButtonElement>>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/spotlight",
3
- "version": "0.0.5",
3
+ "version": "0.0.6",
4
4
  "description": "A spotlight introduces users to various points of interest across Atlassian through focused messages or multi-step tours.",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -32,6 +32,7 @@
32
32
  "@atlaskit/button": "^23.3.0",
33
33
  "@atlaskit/css": "^0.12.0",
34
34
  "@atlaskit/heading": "^5.2.0",
35
+ "@atlaskit/icon": "^27.9.0",
35
36
  "@atlaskit/primitives": "^14.11.0",
36
37
  "@atlaskit/tokens": "^6.0.0",
37
38
  "@babel/runtime": "^7.0.0",
@@ -46,8 +47,7 @@
46
47
  "@atlaskit/ssr": "workspace:^",
47
48
  "@atlaskit/visual-regression": "workspace:^",
48
49
  "@testing-library/react": "^13.4.0",
49
- "react-dom": "^18.2.0",
50
- "typescript": "~5.4.2"
50
+ "react-dom": "^18.2.0"
51
51
  },
52
52
  "platform-feature-flags": {
53
53
  "platform-component-visual-refresh": {