@neo4j-ndl/react 3.1.6 → 3.2.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/lib/cjs/index.js +1 -0
- package/lib/cjs/index.js.map +1 -1
- package/lib/cjs/spotlight/Spotlight.js +137 -0
- package/lib/cjs/spotlight/Spotlight.js.map +1 -0
- package/lib/cjs/spotlight/SpotlightProvider.js +57 -0
- package/lib/cjs/spotlight/SpotlightProvider.js.map +1 -0
- package/lib/cjs/spotlight/SpotlightTarget.js +58 -0
- package/lib/cjs/spotlight/SpotlightTarget.js.map +1 -0
- package/lib/cjs/spotlight/SpotlightTour.js +138 -0
- package/lib/cjs/spotlight/SpotlightTour.js.map +1 -0
- package/lib/cjs/spotlight/index.js +41 -0
- package/lib/cjs/spotlight/index.js.map +1 -0
- package/lib/esm/index.js +1 -0
- package/lib/esm/index.js.map +1 -1
- package/lib/esm/spotlight/Spotlight.js +108 -0
- package/lib/esm/spotlight/Spotlight.js.map +1 -0
- package/lib/esm/spotlight/SpotlightProvider.js +49 -0
- package/lib/esm/spotlight/SpotlightProvider.js.map +1 -0
- package/lib/esm/spotlight/SpotlightTarget.js +52 -0
- package/lib/esm/spotlight/SpotlightTarget.js.map +1 -0
- package/lib/esm/spotlight/SpotlightTour.js +134 -0
- package/lib/esm/spotlight/SpotlightTour.js.map +1 -0
- package/lib/esm/spotlight/index.js +25 -0
- package/lib/esm/spotlight/index.js.map +1 -0
- package/lib/types/index.d.ts +1 -0
- package/lib/types/spotlight/Spotlight.d.ts +84 -0
- package/lib/types/spotlight/SpotlightProvider.d.ts +40 -0
- package/lib/types/spotlight/SpotlightTarget.d.ts +37 -0
- package/lib/types/spotlight/SpotlightTour.d.ts +39 -0
- package/lib/types/spotlight/index.d.ts +24 -0
- package/package.json +2 -2
package/lib/cjs/index.js
CHANGED
|
@@ -82,4 +82,5 @@ __exportStar(require("./callout"), exports);
|
|
|
82
82
|
__exportStar(require("./tooltip"), exports);
|
|
83
83
|
__exportStar(require("./skeleton"), exports);
|
|
84
84
|
__exportStar(require("./time-picker"), exports);
|
|
85
|
+
__exportStar(require("./spotlight"), exports);
|
|
85
86
|
//# sourceMappingURL=index.js.map
|
package/lib/cjs/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;;;;;;;;;;;;;;AAEH,8CAA4B;AAC5B,2CAAyB;AACzB,0CAAwB;AACxB,2CAAyB;AACzB,6CAA2B;AAC3B,2CAAyB;AACzB,0CAAwB;AACxB,iDAA+B;AAC/B,gDAA8B;AAC9B,2CAAyB;AACzB,0CAAwB;AACxB,oDAAkC;AAClC,yCAAuB;AACvB,sDAAoC;AACpC,4CAA0B;AAC1B,iDAA+B;AAC/B,6CAA2B;AAC3B,8CAA4B;AAC5B,+CAA6B;AAC7B,8CAA4B;AAC5B,8CAA4B;AAC5B,2CAAyB;AACzB,wCAAsB;AACtB,0CAAwB;AACxB,2CAAyB;AACzB,2CAAyB;AACzB,gDAA8B;AAC9B,yCAAuB;AACvB,qDAAmC;AACnC,oDAAkC;AAClC,+CAA6B;AAC7B,2CAAyB;AACzB,gDAA8B;AAC9B,0CAAwB;AACxB,2CAAyB;AACzB,2CAAyB;AACzB,yCAAuB;AACvB,qDAAmC;AACnC,2CAAyB;AACzB,gDAA8B;AAC9B,oDAAkC;AAClC,4CAA0B;AAC1B,8CAA4B;AAC5B,0CAAwB;AACxB,4CAA0B;AAC1B,4CAA0B;AAC1B,6CAA2B;AAC3B,gDAA8B"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;;;;;;;;;;;;;;AAEH,8CAA4B;AAC5B,2CAAyB;AACzB,0CAAwB;AACxB,2CAAyB;AACzB,6CAA2B;AAC3B,2CAAyB;AACzB,0CAAwB;AACxB,iDAA+B;AAC/B,gDAA8B;AAC9B,2CAAyB;AACzB,0CAAwB;AACxB,oDAAkC;AAClC,yCAAuB;AACvB,sDAAoC;AACpC,4CAA0B;AAC1B,iDAA+B;AAC/B,6CAA2B;AAC3B,8CAA4B;AAC5B,+CAA6B;AAC7B,8CAA4B;AAC5B,8CAA4B;AAC5B,2CAAyB;AACzB,wCAAsB;AACtB,0CAAwB;AACxB,2CAAyB;AACzB,2CAAyB;AACzB,gDAA8B;AAC9B,yCAAuB;AACvB,qDAAmC;AACnC,oDAAkC;AAClC,+CAA6B;AAC7B,2CAAyB;AACzB,gDAA8B;AAC9B,0CAAwB;AACxB,2CAAyB;AACzB,2CAAyB;AACzB,yCAAuB;AACvB,qDAAmC;AACnC,2CAAyB;AACzB,gDAA8B;AAC9B,oDAAkC;AAClC,4CAA0B;AAC1B,8CAA4B;AAC5B,0CAAwB;AACxB,4CAA0B;AAC1B,4CAA0B;AAC1B,6CAA2B;AAC3B,gDAA8B;AAC9B,8CAA4B"}
|
|
@@ -0,0 +1,137 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
+
if (mod && mod.__esModule) return mod;
|
|
20
|
+
var result = {};
|
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
+
__setModuleDefault(result, mod);
|
|
23
|
+
return result;
|
|
24
|
+
};
|
|
25
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
26
|
+
var t = {};
|
|
27
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
28
|
+
t[p] = s[p];
|
|
29
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
30
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
31
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
32
|
+
t[p[i]] = s[p[i]];
|
|
33
|
+
}
|
|
34
|
+
return t;
|
|
35
|
+
};
|
|
36
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
37
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
38
|
+
};
|
|
39
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
40
|
+
exports.Spotlight = void 0;
|
|
41
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
42
|
+
/**
|
|
43
|
+
*
|
|
44
|
+
* Copyright (c) "Neo4j"
|
|
45
|
+
* Neo4j Sweden AB [http://neo4j.com]
|
|
46
|
+
*
|
|
47
|
+
* This file is part of Neo4j.
|
|
48
|
+
*
|
|
49
|
+
* Neo4j is free software: you can redistribute it and/or modify
|
|
50
|
+
* it under the terms of the GNU General Public License as published by
|
|
51
|
+
* the Free Software Foundation, either version 3 of the License, or
|
|
52
|
+
* (at your option) any later version.
|
|
53
|
+
*
|
|
54
|
+
* This program is distributed in the hope that it will be useful,
|
|
55
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
56
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
57
|
+
* GNU General Public License for more details.
|
|
58
|
+
*
|
|
59
|
+
* You should have received a copy of the GNU General Public License
|
|
60
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
61
|
+
*/
|
|
62
|
+
const react_1 = __importStar(require("react"));
|
|
63
|
+
const classnames_1 = __importDefault(require("classnames"));
|
|
64
|
+
const SpotlightProvider_1 = require("./SpotlightProvider");
|
|
65
|
+
const button_1 = require("../button");
|
|
66
|
+
const popover_1 = require("../popover");
|
|
67
|
+
const label_1 = require("../label");
|
|
68
|
+
const typography_1 = require("../typography");
|
|
69
|
+
const SpotlightActions = react_1.default.forwardRef(function SpotlightActions(_a, ref) {
|
|
70
|
+
var { label, fill, as, style, className, htmlAttributes } = _a, restProps = __rest(_a, ["label", "fill", "as", "style", "className", "htmlAttributes"]);
|
|
71
|
+
if (fill === 'text') {
|
|
72
|
+
return ((0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({}, restProps, { fill: "text", size: "medium", as: as || 'button', ref: ref, style: style, className: className, htmlAttributes: htmlAttributes, children: label })));
|
|
73
|
+
}
|
|
74
|
+
else {
|
|
75
|
+
return ((0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({}, restProps, { fill: "outlined", size: "medium", as: as || 'button', ref: ref, style: style, className: className, htmlAttributes: htmlAttributes, children: label })));
|
|
76
|
+
}
|
|
77
|
+
});
|
|
78
|
+
const SpotlightHeader = react_1.default.forwardRef(function SpotlightHeader({ children, className, as, style, htmlAttributes, }, ref) {
|
|
79
|
+
(0, SpotlightProvider_1.useSpotlightContext)();
|
|
80
|
+
const classes = (0, classnames_1.default)('ndl-spotlight-header', className);
|
|
81
|
+
return ((0, jsx_runtime_1.jsx)(typography_1.Typography, Object.assign({ variant: "h6", ref: ref, as: as || 'div', className: classes, style: style }, htmlAttributes, { children: children })));
|
|
82
|
+
});
|
|
83
|
+
const SpotlightBody = react_1.default.forwardRef(function SpotlightBody({ children, className, as, style, htmlAttributes, }, ref) {
|
|
84
|
+
(0, SpotlightProvider_1.useSpotlightContext)();
|
|
85
|
+
const classes = (0, classnames_1.default)('ndl-spotlight-body', className);
|
|
86
|
+
return ((0, jsx_runtime_1.jsx)(typography_1.Typography, Object.assign({ variant: "body-medium", className: classes, as: as || 'div', style: style, ref: ref }, htmlAttributes, { children: children })));
|
|
87
|
+
});
|
|
88
|
+
const SpotlightLabel = react_1.default.forwardRef(function SpotlightLabel({ className, children, hasIcon, as, style, htmlAttributes, }, ref) {
|
|
89
|
+
(0, SpotlightProvider_1.useSpotlightContext)();
|
|
90
|
+
const classes = (0, classnames_1.default)('ndl-spotlight-label', className);
|
|
91
|
+
return ((0, jsx_runtime_1.jsx)(label_1.Label, Object.assign({ fill: "semi-filled", color: "discovery", hasIcon: hasIcon, ref: ref, as: as, className: classes, style: style }, htmlAttributes, { children: children })));
|
|
92
|
+
});
|
|
93
|
+
const SpotlightImage = react_1.default.forwardRef(function Image({ src, alt, className, style, htmlAttributes }, ref) {
|
|
94
|
+
(0, SpotlightProvider_1.useSpotlightContext)();
|
|
95
|
+
const classes = (0, classnames_1.default)('ndl-spotlight-image n-body-medium', className);
|
|
96
|
+
return ((0, jsx_runtime_1.jsx)("img", Object.assign({ src: src, alt: alt, ref: ref, className: classes, style: style }, htmlAttributes)));
|
|
97
|
+
});
|
|
98
|
+
const SpotlightIconWrapper = react_1.default.forwardRef(function SpotlightIconWrapper({ children, className, as, style, htmlAttributes, }, ref) {
|
|
99
|
+
(0, SpotlightProvider_1.useSpotlightContext)();
|
|
100
|
+
const classes = (0, classnames_1.default)('ndl-spotlight-icon-wrapper', className);
|
|
101
|
+
const Component = as || 'div';
|
|
102
|
+
return ((0, jsx_runtime_1.jsx)(Component, Object.assign({ ref: ref, className: classes, style: style }, htmlAttributes, { children: children })));
|
|
103
|
+
});
|
|
104
|
+
const SpotlightComponent = react_1.default.forwardRef(function SpotlightComponent({ target, actions = [], beforeActions, initialFocus, onClose, children, className, style, htmlAttributes, }, ref) {
|
|
105
|
+
const { isActiveSpotlight, isOpen, setActiveSpotlight, setIsOpen } = (0, SpotlightProvider_1.useSpotlightContext)();
|
|
106
|
+
const targetRef = react_1.default.useRef(null);
|
|
107
|
+
(0, react_1.useEffect)(() => {
|
|
108
|
+
const targetElement = document.getElementById(target);
|
|
109
|
+
if (!targetElement)
|
|
110
|
+
return;
|
|
111
|
+
targetRef.current = targetElement;
|
|
112
|
+
}, [target]);
|
|
113
|
+
const classes = (0, classnames_1.default)('ndl-spotlight', className);
|
|
114
|
+
return ((0, jsx_runtime_1.jsx)(popover_1.Popover, { anchorElement: targetRef.current, isOpen: isActiveSpotlight(target) && isOpen, shouldCaptureFocus: true, onOpenChange: (isOpen, event) => {
|
|
115
|
+
if (!isOpen) {
|
|
116
|
+
if (event instanceof PointerEvent) {
|
|
117
|
+
onClose === null || onClose === void 0 ? void 0 : onClose('clickOutside');
|
|
118
|
+
}
|
|
119
|
+
else if (event instanceof KeyboardEvent) {
|
|
120
|
+
onClose === null || onClose === void 0 ? void 0 : onClose('escapeKeyDown');
|
|
121
|
+
}
|
|
122
|
+
setActiveSpotlight(null);
|
|
123
|
+
setIsOpen(false);
|
|
124
|
+
}
|
|
125
|
+
}, initialFocus: initialFocus, children: (0, jsx_runtime_1.jsxs)(popover_1.Popover.Content, Object.assign({ ref: ref, className: classes, style: style }, htmlAttributes, { children: [(0, jsx_runtime_1.jsx)("div", { children: children }), (beforeActions || !!(actions === null || actions === void 0 ? void 0 : actions.length)) && ((0, jsx_runtime_1.jsxs)("div", { className: "ndl-spotlight-footer", children: [(0, jsx_runtime_1.jsx)(typography_1.Typography, { variant: "body-medium", children: beforeActions }), !!(actions === null || actions === void 0 ? void 0 : actions.length) && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-spotlight-actions", children: actions.map((action, index) => ((0, jsx_runtime_1.jsx)(SpotlightActions, Object.assign({}, action), index))) }))] }))] })) }));
|
|
126
|
+
});
|
|
127
|
+
SpotlightComponent.displayName = 'Spotlight';
|
|
128
|
+
const Spotlight = Object.assign(SpotlightComponent, {
|
|
129
|
+
Actions: SpotlightActions,
|
|
130
|
+
Body: SpotlightBody,
|
|
131
|
+
Header: SpotlightHeader,
|
|
132
|
+
IconWrapper: SpotlightIconWrapper,
|
|
133
|
+
Image: SpotlightImage,
|
|
134
|
+
Label: SpotlightLabel,
|
|
135
|
+
});
|
|
136
|
+
exports.Spotlight = Spotlight;
|
|
137
|
+
//# sourceMappingURL=Spotlight.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Spotlight.js","sourceRoot":"","sources":["../../../src/spotlight/Spotlight.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.SpotlightProvider = exports.useSpotlightContext = void 0;
|
|
7
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
8
|
+
/**
|
|
9
|
+
*
|
|
10
|
+
* Copyright (c) "Neo4j"
|
|
11
|
+
* Neo4j Sweden AB [http://neo4j.com]
|
|
12
|
+
*
|
|
13
|
+
* This file is part of Neo4j.
|
|
14
|
+
*
|
|
15
|
+
* Neo4j is free software: you can redistribute it and/or modify
|
|
16
|
+
* it under the terms of the GNU General Public License as published by
|
|
17
|
+
* the Free Software Foundation, either version 3 of the License, or
|
|
18
|
+
* (at your option) any later version.
|
|
19
|
+
*
|
|
20
|
+
* This program is distributed in the hope that it will be useful,
|
|
21
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
22
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
23
|
+
* GNU General Public License for more details.
|
|
24
|
+
*
|
|
25
|
+
* You should have received a copy of the GNU General Public License
|
|
26
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
27
|
+
*/
|
|
28
|
+
const classnames_1 = __importDefault(require("classnames"));
|
|
29
|
+
const react_1 = require("react");
|
|
30
|
+
const SpotlightContext = (0, react_1.createContext)(null);
|
|
31
|
+
const useSpotlightContext = () => {
|
|
32
|
+
const context = (0, react_1.useContext)(SpotlightContext);
|
|
33
|
+
if (context == null) {
|
|
34
|
+
throw new Error('Spotlight components must be wrapped in <SpotlightProvider />');
|
|
35
|
+
}
|
|
36
|
+
return context;
|
|
37
|
+
};
|
|
38
|
+
exports.useSpotlightContext = useSpotlightContext;
|
|
39
|
+
const SpotlightProvider = (props) => {
|
|
40
|
+
const { children, hasOverlay = true } = props;
|
|
41
|
+
const [active, setActive] = (0, react_1.useState)(null);
|
|
42
|
+
const [isOpen, setIsOpen] = (0, react_1.useState)(false);
|
|
43
|
+
const contextValue = {
|
|
44
|
+
isOpen,
|
|
45
|
+
setIsOpen: (0, react_1.useCallback)((open) => setIsOpen(open), []),
|
|
46
|
+
isActiveSpotlight: (0, react_1.useCallback)((target) => target === active, [active]),
|
|
47
|
+
setActiveSpotlight: (0, react_1.useCallback)((target) => setActive(target), []),
|
|
48
|
+
};
|
|
49
|
+
const overlayClasses = (0, classnames_1.default)('ndl-spotlight-overlay', {
|
|
50
|
+
'ndl-spotlight-overlay-open': isOpen && active != null,
|
|
51
|
+
});
|
|
52
|
+
/** transparent overlay to sandwich the SpotlightTarget, thus making it "highlighted" */
|
|
53
|
+
const highlightOverlayClasses = (0, classnames_1.default)(overlayClasses, 'n-bg-transparent n-z-[32]');
|
|
54
|
+
return ((0, jsx_runtime_1.jsxs)(SpotlightContext.Provider, { value: contextValue, children: [hasOverlay && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { "data-testid": "ndl-spotlight-overlay-highlight", className: highlightOverlayClasses }), (0, jsx_runtime_1.jsx)("div", { "data-testid": "ndl-spotlight-overlay", className: overlayClasses })] })), children] }));
|
|
55
|
+
};
|
|
56
|
+
exports.SpotlightProvider = SpotlightProvider;
|
|
57
|
+
//# sourceMappingURL=SpotlightProvider.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SpotlightProvider.js","sourceRoot":"","sources":["../../../src/spotlight/SpotlightProvider.tsx"],"names":[],"mappings":";;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,4DAAoC;AACpC,iCAAgF;AAahF,MAAM,gBAAgB,GAAG,IAAA,qBAAa,EAA8B,IAAI,CAAC,CAAC;AAEnE,MAAM,mBAAmB,GAAG,GAAyB,EAAE;IAC5D,MAAM,OAAO,GAAG,IAAA,kBAAU,EAAC,gBAAgB,CAAC,CAAC;IAE7C,IAAI,OAAO,IAAI,IAAI,EAAE,CAAC;QACpB,MAAM,IAAI,KAAK,CACb,+DAA+D,CAChE,CAAC;IACJ,CAAC;IAED,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAVW,QAAA,mBAAmB,uBAU9B;AAQK,MAAM,iBAAiB,GAAG,CAAC,KAA6B,EAAE,EAAE;IACjE,MAAM,EAAE,QAAQ,EAAE,UAAU,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IAC9C,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAgB,IAAI,CAAC,CAAC;IAC1D,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAU,KAAK,CAAC,CAAC;IAErD,MAAM,YAAY,GAAG;QACnB,MAAM;QACN,SAAS,EAAE,IAAA,mBAAW,EAAC,CAAC,IAAa,EAAE,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC;QAC9D,iBAAiB,EAAE,IAAA,mBAAW,EAC5B,CAAC,MAAc,EAAE,EAAE,CAAC,MAAM,KAAK,MAAM,EACrC,CAAC,MAAM,CAAC,CACT;QACD,kBAAkB,EAAE,IAAA,mBAAW,EAC7B,CAAC,MAAqB,EAAE,EAAE,CAAC,SAAS,CAAC,MAAM,CAAC,EAC5C,EAAE,CACH;KACF,CAAC;IAEF,MAAM,cAAc,GAAG,IAAA,oBAAU,EAAC,uBAAuB,EAAE;QACzD,4BAA4B,EAAE,MAAM,IAAI,MAAM,IAAI,IAAI;KACvD,CAAC,CAAC;IAEH,wFAAwF;IACxF,MAAM,uBAAuB,GAAG,IAAA,oBAAU,EACxC,cAAc,EACd,2BAA2B,CAC5B,CAAC;IAEF,OAAO,CACL,wBAAC,gBAAgB,CAAC,QAAQ,IAAC,KAAK,EAAE,YAAY,aAC3C,UAAU,IAAI,CACb,6DACE,+CACc,iCAAiC,EAC7C,SAAS,EAAE,uBAAuB,GAC7B,EACP,+CACc,uBAAuB,EACnC,SAAS,EAAE,cAAc,GACpB,IACN,CACJ,EACA,QAAQ,IACiB,CAC7B,CAAC;AACJ,CAAC,CAAC;AA7CW,QAAA,iBAAiB,qBA6C5B"}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.SpotlightTarget = void 0;
|
|
7
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
8
|
+
/**
|
|
9
|
+
*
|
|
10
|
+
* Copyright (c) "Neo4j"
|
|
11
|
+
* Neo4j Sweden AB [http://neo4j.com]
|
|
12
|
+
*
|
|
13
|
+
* This file is part of Neo4j.
|
|
14
|
+
*
|
|
15
|
+
* Neo4j is free software: you can redistribute it and/or modify
|
|
16
|
+
* it under the terms of the GNU General Public License as published by
|
|
17
|
+
* the Free Software Foundation, either version 3 of the License, or
|
|
18
|
+
* (at your option) any later version.
|
|
19
|
+
*
|
|
20
|
+
* This program is distributed in the hope that it will be useful,
|
|
21
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
22
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
23
|
+
* GNU General Public License for more details.
|
|
24
|
+
*
|
|
25
|
+
* You should have received a copy of the GNU General Public License
|
|
26
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
27
|
+
*/
|
|
28
|
+
const react_1 = __importDefault(require("react"));
|
|
29
|
+
const SpotlightProvider_1 = require("./SpotlightProvider");
|
|
30
|
+
const classnames_1 = __importDefault(require("classnames"));
|
|
31
|
+
const ConditionalWrap_1 = __importDefault(require("../_common/ConditionalWrap"));
|
|
32
|
+
exports.SpotlightTarget = react_1.default.forwardRef(function SpotlightTarget({ id, hasPulse = true, backgroundColor, borderRadius, children, className, htmlAttributes, }, ref) {
|
|
33
|
+
const { isActiveSpotlight, isOpen, setIsOpen } = (0, SpotlightProvider_1.useSpotlightContext)();
|
|
34
|
+
const classes = (0, classnames_1.default)('ndl-spotlight-target', {
|
|
35
|
+
'ndl-spotlight-target-pulse': hasPulse,
|
|
36
|
+
'ndl-spotlight-target-open': isOpen,
|
|
37
|
+
}, className);
|
|
38
|
+
const isActive = isActiveSpotlight(id);
|
|
39
|
+
return ((0, jsx_runtime_1.jsx)("div", { className: isActive ? classes : '', style: { backgroundColor, borderRadius }, children: (0, jsx_runtime_1.jsx)("div", Object.assign({ role: isActive ? 'button' : undefined, id: id, ref: ref, className: "ndl-spotlight-target-inner", onClick: (e) => {
|
|
40
|
+
if (isActive && !isOpen) {
|
|
41
|
+
setIsOpen(true);
|
|
42
|
+
e.preventDefault();
|
|
43
|
+
}
|
|
44
|
+
}, style: { borderRadius }, onKeyDown: (e) => {
|
|
45
|
+
console.log('e.key', e); // eslint-disable-line
|
|
46
|
+
if (isActive &&
|
|
47
|
+
!isOpen &&
|
|
48
|
+
(e.code === 'Enter' || e.code === 'Space')) {
|
|
49
|
+
setIsOpen(true);
|
|
50
|
+
e.preventDefault();
|
|
51
|
+
}
|
|
52
|
+
}, tabIndex: isActive ? 0 : -1, "aria-label": "spotlight target" }, htmlAttributes, { children: (0, jsx_runtime_1.jsx)(ConditionalWrap_1.default, { shouldWrap: isActive,
|
|
53
|
+
// TODO v4: inert should be fixed in react 19? https://github.com/facebook/react/pull/24730#event-12109747640. inert="" is a workaround for now
|
|
54
|
+
wrap: (children) => (
|
|
55
|
+
/* @ts-expect-error inert not allowed */
|
|
56
|
+
(0, jsx_runtime_1.jsx)("div", { inert: "", "aria-disabled": true, className: "ndl-spotlight-target-inert", children: children })), children: children }) })) }));
|
|
57
|
+
});
|
|
58
|
+
//# sourceMappingURL=SpotlightTarget.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SpotlightTarget.js","sourceRoot":"","sources":["../../../src/spotlight/SpotlightTarget.tsx"],"names":[],"mappings":";;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,kDAA0B;AAC1B,2DAA0D;AAC1D,4DAAoC;AAMpC,iFAAyD;AAgB5C,QAAA,eAAe,GAGxB,eAAK,CAAC,UAAU,CAAC,SAAS,eAAe,CAG3C,EACE,EAAE,EACF,QAAQ,GAAG,IAAI,EACf,eAAe,EACf,YAAY,EACZ,QAAQ,EACR,SAAS,EACT,cAAc,GACsC,EACtD,GAAsB;IAEtB,MAAM,EAAE,iBAAiB,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,IAAA,uCAAmB,GAAE,CAAC;IAEvE,MAAM,OAAO,GAAG,IAAA,oBAAU,EACxB,sBAAsB,EACtB;QACE,4BAA4B,EAAE,QAAQ;QACtC,2BAA2B,EAAE,MAAM;KACpC,EACD,SAAS,CACV,CAAC;IAEF,MAAM,QAAQ,GAAG,iBAAiB,CAAC,EAAE,CAAC,CAAC;IAEvC,OAAO,CACL,gCACE,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EAClC,KAAK,EAAE,EAAE,eAAe,EAAE,YAAY,EAAE,YAExC,8CACE,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EACrC,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,EACR,SAAS,EAAC,4BAA4B,EACtC,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;gBACb,IAAI,QAAQ,IAAI,CAAC,MAAM,EAAE,CAAC;oBACxB,SAAS,CAAC,IAAI,CAAC,CAAC;oBAChB,CAAC,CAAC,cAAc,EAAE,CAAC;gBACrB,CAAC;YACH,CAAC,EACD,KAAK,EAAE,EAAE,YAAY,EAAE,EACvB,SAAS,EAAE,CAAC,CAAC,EAAE,EAAE;gBACf,OAAO,CAAC,GAAG,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC,sBAAsB;gBAC/C,IACE,QAAQ;oBACR,CAAC,MAAM;oBACP,CAAC,CAAC,CAAC,IAAI,KAAK,OAAO,IAAI,CAAC,CAAC,IAAI,KAAK,OAAO,CAAC,EAC1C,CAAC;oBACD,SAAS,CAAC,IAAI,CAAC,CAAC;oBAChB,CAAC,CAAC,cAAc,EAAE,CAAC;gBACrB,CAAC;YACH,CAAC,EACD,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,gBAChB,kBAAkB,IACzB,cAAc,cAElB,uBAAC,yBAAe,IACd,UAAU,EAAE,QAAQ;gBACpB,+IAA+I;gBAC/I,IAAI,EAAE,CAAC,QAAQ,EAAE,EAAE,CAAC;gBAClB,wCAAwC;gBACxC,gCAAK,KAAK,EAAC,EAAE,yBAAe,SAAS,EAAC,4BAA4B,YAC/D,QAAQ,GACL,CACP,YAEA,QAAQ,GACO,IACd,GACF,CACP,CAAC;AACJ,CAAC,CAAsE,CAAC"}
|
|
@@ -0,0 +1,138 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
3
|
+
var t = {};
|
|
4
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
5
|
+
t[p] = s[p];
|
|
6
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
7
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
8
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
9
|
+
t[p[i]] = s[p[i]];
|
|
10
|
+
}
|
|
11
|
+
return t;
|
|
12
|
+
};
|
|
13
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
14
|
+
exports.SpotlightTour = void 0;
|
|
15
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
16
|
+
/**
|
|
17
|
+
*
|
|
18
|
+
* Copyright (c) "Neo4j"
|
|
19
|
+
* Neo4j Sweden AB [http://neo4j.com]
|
|
20
|
+
*
|
|
21
|
+
* This file is part of Neo4j.
|
|
22
|
+
*
|
|
23
|
+
* Neo4j is free software: you can redistribute it and/or modify
|
|
24
|
+
* it under the terms of the GNU General Public License as published by
|
|
25
|
+
* the Free Software Foundation, either version 3 of the License, or
|
|
26
|
+
* (at your option) any later version.
|
|
27
|
+
*
|
|
28
|
+
* This program is distributed in the hope that it will be useful,
|
|
29
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
30
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
31
|
+
* GNU General Public License for more details.
|
|
32
|
+
*
|
|
33
|
+
* You should have received a copy of the GNU General Public License
|
|
34
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
35
|
+
*/
|
|
36
|
+
const react_1 = require("react");
|
|
37
|
+
const Spotlight_1 = require("./Spotlight");
|
|
38
|
+
const SpotlightProvider_1 = require("./SpotlightProvider");
|
|
39
|
+
const SpotlightTour = (props) => {
|
|
40
|
+
const { setActiveSpotlight, setIsOpen } = (0, SpotlightProvider_1.useSpotlightContext)();
|
|
41
|
+
const { spotlights, dismissButtonText = 'Dismiss', backButtonText = 'Back', nextButtonText = 'Next', closeButtonText = 'Close', onAction, } = props;
|
|
42
|
+
const next = (0, react_1.useCallback)((index) => {
|
|
43
|
+
onAction === null || onAction === void 0 ? void 0 : onAction(spotlights[index].target, 'next');
|
|
44
|
+
setActiveSpotlight(spotlights[index + 1].target);
|
|
45
|
+
}, [onAction, spotlights, setActiveSpotlight]);
|
|
46
|
+
const back = (0, react_1.useCallback)((index) => {
|
|
47
|
+
onAction === null || onAction === void 0 ? void 0 : onAction(spotlights[index].target, 'back');
|
|
48
|
+
setActiveSpotlight(spotlights[index - 1].target);
|
|
49
|
+
}, [onAction, spotlights, setActiveSpotlight]);
|
|
50
|
+
const dismiss = (0, react_1.useCallback)((index) => {
|
|
51
|
+
onAction === null || onAction === void 0 ? void 0 : onAction(spotlights[index].target, 'dismiss');
|
|
52
|
+
setActiveSpotlight(null);
|
|
53
|
+
setIsOpen(false);
|
|
54
|
+
}, [onAction, spotlights, setActiveSpotlight, setIsOpen]);
|
|
55
|
+
const close = (0, react_1.useCallback)((index) => {
|
|
56
|
+
onAction === null || onAction === void 0 ? void 0 : onAction(spotlights[index].target, 'close');
|
|
57
|
+
setActiveSpotlight(null);
|
|
58
|
+
setIsOpen(false);
|
|
59
|
+
}, [onAction, spotlights, setActiveSpotlight, setIsOpen]);
|
|
60
|
+
const getActions = (0, react_1.useCallback)((actions, index) => {
|
|
61
|
+
if (actions === null || actions === void 0 ? void 0 : actions.length) {
|
|
62
|
+
return actions;
|
|
63
|
+
}
|
|
64
|
+
const isFirst = index === 0;
|
|
65
|
+
const isLast = index === spotlights.length - 1;
|
|
66
|
+
const hasMultiple = spotlights.length > 1;
|
|
67
|
+
const newActions = [];
|
|
68
|
+
if (!isLast && hasMultiple) {
|
|
69
|
+
newActions.push({
|
|
70
|
+
label: dismissButtonText,
|
|
71
|
+
fill: 'text',
|
|
72
|
+
onClick: () => dismiss(index),
|
|
73
|
+
});
|
|
74
|
+
}
|
|
75
|
+
if (!isFirst && hasMultiple) {
|
|
76
|
+
newActions.push({
|
|
77
|
+
label: backButtonText,
|
|
78
|
+
fill: 'text',
|
|
79
|
+
onClick: () => back(index),
|
|
80
|
+
});
|
|
81
|
+
}
|
|
82
|
+
if (isLast) {
|
|
83
|
+
newActions.push({
|
|
84
|
+
label: closeButtonText,
|
|
85
|
+
fill: 'outlined',
|
|
86
|
+
onClick: () => close(index),
|
|
87
|
+
});
|
|
88
|
+
}
|
|
89
|
+
else {
|
|
90
|
+
newActions.push({
|
|
91
|
+
label: nextButtonText,
|
|
92
|
+
fill: 'outlined',
|
|
93
|
+
onClick: () => next(index),
|
|
94
|
+
});
|
|
95
|
+
}
|
|
96
|
+
return newActions;
|
|
97
|
+
}, [
|
|
98
|
+
spotlights,
|
|
99
|
+
dismissButtonText,
|
|
100
|
+
dismiss,
|
|
101
|
+
backButtonText,
|
|
102
|
+
back,
|
|
103
|
+
closeButtonText,
|
|
104
|
+
close,
|
|
105
|
+
nextButtonText,
|
|
106
|
+
next,
|
|
107
|
+
]);
|
|
108
|
+
const getBeforeActions = (0, react_1.useCallback)((beforeActions, index) => {
|
|
109
|
+
if (beforeActions) {
|
|
110
|
+
return beforeActions;
|
|
111
|
+
}
|
|
112
|
+
return spotlights.length > 1 ? index + 1 + '/' + spotlights.length : null;
|
|
113
|
+
}, [spotlights]);
|
|
114
|
+
const getInitialFocus = (0, react_1.useCallback)((initialFocus, actions) => {
|
|
115
|
+
if (initialFocus !== undefined) {
|
|
116
|
+
return initialFocus;
|
|
117
|
+
}
|
|
118
|
+
return actions.length - 1;
|
|
119
|
+
}, []);
|
|
120
|
+
const getOnClose = (0, react_1.useCallback)((onClose, index) => {
|
|
121
|
+
if (onClose) {
|
|
122
|
+
return onClose;
|
|
123
|
+
}
|
|
124
|
+
return (reason) => {
|
|
125
|
+
onAction === null || onAction === void 0 ? void 0 : onAction(spotlights[index].target, reason);
|
|
126
|
+
};
|
|
127
|
+
}, [onAction, spotlights]);
|
|
128
|
+
return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: spotlights.map((spotlight, index) => {
|
|
129
|
+
const { actions, beforeActions, initialFocus, onClose } = spotlight, restSpotlight = __rest(spotlight, ["actions", "beforeActions", "initialFocus", "onClose"]);
|
|
130
|
+
const newActions = getActions(actions, index);
|
|
131
|
+
const newBeforeActions = getBeforeActions(beforeActions, index);
|
|
132
|
+
const newInitialFocus = getInitialFocus(initialFocus, newActions);
|
|
133
|
+
const newOnClose = getOnClose(onClose, index);
|
|
134
|
+
return ((0, jsx_runtime_1.jsx)(Spotlight_1.Spotlight, Object.assign({}, restSpotlight, { actions: newActions, beforeActions: newBeforeActions, initialFocus: newInitialFocus, onClose: newOnClose }), index));
|
|
135
|
+
}) }));
|
|
136
|
+
};
|
|
137
|
+
exports.SpotlightTour = SpotlightTour;
|
|
138
|
+
//# sourceMappingURL=SpotlightTour.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SpotlightTour.js","sourceRoot":"","sources":["../../../src/spotlight/SpotlightTour.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
/**
|
|
3
|
+
*
|
|
4
|
+
* Copyright (c) "Neo4j"
|
|
5
|
+
* Neo4j Sweden AB [http://neo4j.com]
|
|
6
|
+
*
|
|
7
|
+
* This file is part of Neo4j.
|
|
8
|
+
*
|
|
9
|
+
* Neo4j is free software: you can redistribute it and/or modify
|
|
10
|
+
* it under the terms of the GNU General Public License as published by
|
|
11
|
+
* the Free Software Foundation, either version 3 of the License, or
|
|
12
|
+
* (at your option) any later version.
|
|
13
|
+
*
|
|
14
|
+
* This program is distributed in the hope that it will be useful,
|
|
15
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
16
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
17
|
+
* GNU General Public License for more details.
|
|
18
|
+
*
|
|
19
|
+
* You should have received a copy of the GNU General Public License
|
|
20
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
21
|
+
*/
|
|
22
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
23
|
+
if (k2 === undefined) k2 = k;
|
|
24
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
25
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
26
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
27
|
+
}
|
|
28
|
+
Object.defineProperty(o, k2, desc);
|
|
29
|
+
}) : (function(o, m, k, k2) {
|
|
30
|
+
if (k2 === undefined) k2 = k;
|
|
31
|
+
o[k2] = m[k];
|
|
32
|
+
}));
|
|
33
|
+
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
34
|
+
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
35
|
+
};
|
|
36
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
37
|
+
__exportStar(require("./Spotlight"), exports);
|
|
38
|
+
__exportStar(require("./SpotlightProvider"), exports);
|
|
39
|
+
__exportStar(require("./SpotlightTarget"), exports);
|
|
40
|
+
__exportStar(require("./SpotlightTour"), exports);
|
|
41
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/spotlight/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;;;;;;;;;;;;;;AAEH,8CAA4B;AAC5B,sDAAoC;AACpC,oDAAkC;AAClC,kDAAgC"}
|
package/lib/esm/index.js
CHANGED
package/lib/esm/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,mBAAmB,CAAC;AAClC,cAAc,QAAQ,CAAC;AACvB,cAAc,qBAAqB,CAAC;AACpC,cAAc,WAAW,CAAC;AAC1B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC;AACtB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,QAAQ,CAAC;AACvB,cAAc,oBAAoB,CAAC;AACnC,cAAc,mBAAmB,CAAC;AAClC,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,oBAAoB,CAAC;AACnC,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,mBAAmB,CAAC;AAClC,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,mBAAmB,CAAC;AAClC,cAAc,QAAQ,CAAC;AACvB,cAAc,qBAAqB,CAAC;AACpC,cAAc,WAAW,CAAC;AAC1B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC;AACtB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,QAAQ,CAAC;AACvB,cAAc,oBAAoB,CAAC;AACnC,cAAc,mBAAmB,CAAC;AAClC,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,oBAAoB,CAAC;AACnC,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,mBAAmB,CAAC;AAClC,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC"}
|
|
@@ -0,0 +1,108 @@
|
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
2
|
+
var t = {};
|
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4
|
+
t[p] = s[p];
|
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
8
|
+
t[p[i]] = s[p[i]];
|
|
9
|
+
}
|
|
10
|
+
return t;
|
|
11
|
+
};
|
|
12
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
+
/**
|
|
14
|
+
*
|
|
15
|
+
* Copyright (c) "Neo4j"
|
|
16
|
+
* Neo4j Sweden AB [http://neo4j.com]
|
|
17
|
+
*
|
|
18
|
+
* This file is part of Neo4j.
|
|
19
|
+
*
|
|
20
|
+
* Neo4j is free software: you can redistribute it and/or modify
|
|
21
|
+
* it under the terms of the GNU General Public License as published by
|
|
22
|
+
* the Free Software Foundation, either version 3 of the License, or
|
|
23
|
+
* (at your option) any later version.
|
|
24
|
+
*
|
|
25
|
+
* This program is distributed in the hope that it will be useful,
|
|
26
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
27
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
28
|
+
* GNU General Public License for more details.
|
|
29
|
+
*
|
|
30
|
+
* You should have received a copy of the GNU General Public License
|
|
31
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
32
|
+
*/
|
|
33
|
+
import React, { useEffect } from 'react';
|
|
34
|
+
import classNames from 'classnames';
|
|
35
|
+
import { useSpotlightContext } from './SpotlightProvider';
|
|
36
|
+
import { Button } from '../button';
|
|
37
|
+
import { Popover } from '../popover';
|
|
38
|
+
import { Label } from '../label';
|
|
39
|
+
import { Typography } from '../typography';
|
|
40
|
+
const SpotlightActions = React.forwardRef(function SpotlightActions(_a, ref) {
|
|
41
|
+
var { label, fill, as, style, className, htmlAttributes } = _a, restProps = __rest(_a, ["label", "fill", "as", "style", "className", "htmlAttributes"]);
|
|
42
|
+
if (fill === 'text') {
|
|
43
|
+
return (_jsx(Button, Object.assign({}, restProps, { fill: "text", size: "medium", as: as || 'button', ref: ref, style: style, className: className, htmlAttributes: htmlAttributes, children: label })));
|
|
44
|
+
}
|
|
45
|
+
else {
|
|
46
|
+
return (_jsx(Button, Object.assign({}, restProps, { fill: "outlined", size: "medium", as: as || 'button', ref: ref, style: style, className: className, htmlAttributes: htmlAttributes, children: label })));
|
|
47
|
+
}
|
|
48
|
+
});
|
|
49
|
+
const SpotlightHeader = React.forwardRef(function SpotlightHeader({ children, className, as, style, htmlAttributes, }, ref) {
|
|
50
|
+
useSpotlightContext();
|
|
51
|
+
const classes = classNames('ndl-spotlight-header', className);
|
|
52
|
+
return (_jsx(Typography, Object.assign({ variant: "h6", ref: ref, as: as || 'div', className: classes, style: style }, htmlAttributes, { children: children })));
|
|
53
|
+
});
|
|
54
|
+
const SpotlightBody = React.forwardRef(function SpotlightBody({ children, className, as, style, htmlAttributes, }, ref) {
|
|
55
|
+
useSpotlightContext();
|
|
56
|
+
const classes = classNames('ndl-spotlight-body', className);
|
|
57
|
+
return (_jsx(Typography, Object.assign({ variant: "body-medium", className: classes, as: as || 'div', style: style, ref: ref }, htmlAttributes, { children: children })));
|
|
58
|
+
});
|
|
59
|
+
const SpotlightLabel = React.forwardRef(function SpotlightLabel({ className, children, hasIcon, as, style, htmlAttributes, }, ref) {
|
|
60
|
+
useSpotlightContext();
|
|
61
|
+
const classes = classNames('ndl-spotlight-label', className);
|
|
62
|
+
return (_jsx(Label, Object.assign({ fill: "semi-filled", color: "discovery", hasIcon: hasIcon, ref: ref, as: as, className: classes, style: style }, htmlAttributes, { children: children })));
|
|
63
|
+
});
|
|
64
|
+
const SpotlightImage = React.forwardRef(function Image({ src, alt, className, style, htmlAttributes }, ref) {
|
|
65
|
+
useSpotlightContext();
|
|
66
|
+
const classes = classNames('ndl-spotlight-image n-body-medium', className);
|
|
67
|
+
return (_jsx("img", Object.assign({ src: src, alt: alt, ref: ref, className: classes, style: style }, htmlAttributes)));
|
|
68
|
+
});
|
|
69
|
+
const SpotlightIconWrapper = React.forwardRef(function SpotlightIconWrapper({ children, className, as, style, htmlAttributes, }, ref) {
|
|
70
|
+
useSpotlightContext();
|
|
71
|
+
const classes = classNames('ndl-spotlight-icon-wrapper', className);
|
|
72
|
+
const Component = as || 'div';
|
|
73
|
+
return (_jsx(Component, Object.assign({ ref: ref, className: classes, style: style }, htmlAttributes, { children: children })));
|
|
74
|
+
});
|
|
75
|
+
const SpotlightComponent = React.forwardRef(function SpotlightComponent({ target, actions = [], beforeActions, initialFocus, onClose, children, className, style, htmlAttributes, }, ref) {
|
|
76
|
+
const { isActiveSpotlight, isOpen, setActiveSpotlight, setIsOpen } = useSpotlightContext();
|
|
77
|
+
const targetRef = React.useRef(null);
|
|
78
|
+
useEffect(() => {
|
|
79
|
+
const targetElement = document.getElementById(target);
|
|
80
|
+
if (!targetElement)
|
|
81
|
+
return;
|
|
82
|
+
targetRef.current = targetElement;
|
|
83
|
+
}, [target]);
|
|
84
|
+
const classes = classNames('ndl-spotlight', className);
|
|
85
|
+
return (_jsx(Popover, { anchorElement: targetRef.current, isOpen: isActiveSpotlight(target) && isOpen, shouldCaptureFocus: true, onOpenChange: (isOpen, event) => {
|
|
86
|
+
if (!isOpen) {
|
|
87
|
+
if (event instanceof PointerEvent) {
|
|
88
|
+
onClose === null || onClose === void 0 ? void 0 : onClose('clickOutside');
|
|
89
|
+
}
|
|
90
|
+
else if (event instanceof KeyboardEvent) {
|
|
91
|
+
onClose === null || onClose === void 0 ? void 0 : onClose('escapeKeyDown');
|
|
92
|
+
}
|
|
93
|
+
setActiveSpotlight(null);
|
|
94
|
+
setIsOpen(false);
|
|
95
|
+
}
|
|
96
|
+
}, initialFocus: initialFocus, children: _jsxs(Popover.Content, Object.assign({ ref: ref, className: classes, style: style }, htmlAttributes, { children: [_jsx("div", { children: children }), (beforeActions || !!(actions === null || actions === void 0 ? void 0 : actions.length)) && (_jsxs("div", { className: "ndl-spotlight-footer", children: [_jsx(Typography, { variant: "body-medium", children: beforeActions }), !!(actions === null || actions === void 0 ? void 0 : actions.length) && (_jsx("div", { className: "ndl-spotlight-actions", children: actions.map((action, index) => (_jsx(SpotlightActions, Object.assign({}, action), index))) }))] }))] })) }));
|
|
97
|
+
});
|
|
98
|
+
SpotlightComponent.displayName = 'Spotlight';
|
|
99
|
+
const Spotlight = Object.assign(SpotlightComponent, {
|
|
100
|
+
Actions: SpotlightActions,
|
|
101
|
+
Body: SpotlightBody,
|
|
102
|
+
Header: SpotlightHeader,
|
|
103
|
+
IconWrapper: SpotlightIconWrapper,
|
|
104
|
+
Image: SpotlightImage,
|
|
105
|
+
Label: SpotlightLabel,
|
|
106
|
+
});
|
|
107
|
+
export { Spotlight };
|
|
108
|
+
//# sourceMappingURL=Spotlight.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Spotlight.js","sourceRoot":"","sources":["../../../src/spotlight/Spotlight.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
/**
|
|
3
|
+
*
|
|
4
|
+
* Copyright (c) "Neo4j"
|
|
5
|
+
* Neo4j Sweden AB [http://neo4j.com]
|
|
6
|
+
*
|
|
7
|
+
* This file is part of Neo4j.
|
|
8
|
+
*
|
|
9
|
+
* Neo4j is free software: you can redistribute it and/or modify
|
|
10
|
+
* it under the terms of the GNU General Public License as published by
|
|
11
|
+
* the Free Software Foundation, either version 3 of the License, or
|
|
12
|
+
* (at your option) any later version.
|
|
13
|
+
*
|
|
14
|
+
* This program is distributed in the hope that it will be useful,
|
|
15
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
16
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
17
|
+
* GNU General Public License for more details.
|
|
18
|
+
*
|
|
19
|
+
* You should have received a copy of the GNU General Public License
|
|
20
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
21
|
+
*/
|
|
22
|
+
import classNames from 'classnames';
|
|
23
|
+
import { useState, useContext, useCallback, createContext } from 'react';
|
|
24
|
+
const SpotlightContext = createContext(null);
|
|
25
|
+
export const useSpotlightContext = () => {
|
|
26
|
+
const context = useContext(SpotlightContext);
|
|
27
|
+
if (context == null) {
|
|
28
|
+
throw new Error('Spotlight components must be wrapped in <SpotlightProvider />');
|
|
29
|
+
}
|
|
30
|
+
return context;
|
|
31
|
+
};
|
|
32
|
+
export const SpotlightProvider = (props) => {
|
|
33
|
+
const { children, hasOverlay = true } = props;
|
|
34
|
+
const [active, setActive] = useState(null);
|
|
35
|
+
const [isOpen, setIsOpen] = useState(false);
|
|
36
|
+
const contextValue = {
|
|
37
|
+
isOpen,
|
|
38
|
+
setIsOpen: useCallback((open) => setIsOpen(open), []),
|
|
39
|
+
isActiveSpotlight: useCallback((target) => target === active, [active]),
|
|
40
|
+
setActiveSpotlight: useCallback((target) => setActive(target), []),
|
|
41
|
+
};
|
|
42
|
+
const overlayClasses = classNames('ndl-spotlight-overlay', {
|
|
43
|
+
'ndl-spotlight-overlay-open': isOpen && active != null,
|
|
44
|
+
});
|
|
45
|
+
/** transparent overlay to sandwich the SpotlightTarget, thus making it "highlighted" */
|
|
46
|
+
const highlightOverlayClasses = classNames(overlayClasses, 'n-bg-transparent n-z-[32]');
|
|
47
|
+
return (_jsxs(SpotlightContext.Provider, { value: contextValue, children: [hasOverlay && (_jsxs(_Fragment, { children: [_jsx("div", { "data-testid": "ndl-spotlight-overlay-highlight", className: highlightOverlayClasses }), _jsx("div", { "data-testid": "ndl-spotlight-overlay", className: overlayClasses })] })), children] }));
|
|
48
|
+
};
|
|
49
|
+
//# sourceMappingURL=SpotlightProvider.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SpotlightProvider.js","sourceRoot":"","sources":["../../../src/spotlight/SpotlightProvider.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAc,EAAE,QAAQ,EAAE,UAAU,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAahF,MAAM,gBAAgB,GAAG,aAAa,CAA8B,IAAI,CAAC,CAAC;AAE1E,MAAM,CAAC,MAAM,mBAAmB,GAAG,GAAyB,EAAE;IAC5D,MAAM,OAAO,GAAG,UAAU,CAAC,gBAAgB,CAAC,CAAC;IAE7C,IAAI,OAAO,IAAI,IAAI,EAAE,CAAC;QACpB,MAAM,IAAI,KAAK,CACb,+DAA+D,CAChE,CAAC;IACJ,CAAC;IAED,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAQF,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,KAA6B,EAAE,EAAE;IACjE,MAAM,EAAE,QAAQ,EAAE,UAAU,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IAC9C,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAC1D,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAErD,MAAM,YAAY,GAAG;QACnB,MAAM;QACN,SAAS,EAAE,WAAW,CAAC,CAAC,IAAa,EAAE,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC;QAC9D,iBAAiB,EAAE,WAAW,CAC5B,CAAC,MAAc,EAAE,EAAE,CAAC,MAAM,KAAK,MAAM,EACrC,CAAC,MAAM,CAAC,CACT;QACD,kBAAkB,EAAE,WAAW,CAC7B,CAAC,MAAqB,EAAE,EAAE,CAAC,SAAS,CAAC,MAAM,CAAC,EAC5C,EAAE,CACH;KACF,CAAC;IAEF,MAAM,cAAc,GAAG,UAAU,CAAC,uBAAuB,EAAE;QACzD,4BAA4B,EAAE,MAAM,IAAI,MAAM,IAAI,IAAI;KACvD,CAAC,CAAC;IAEH,wFAAwF;IACxF,MAAM,uBAAuB,GAAG,UAAU,CACxC,cAAc,EACd,2BAA2B,CAC5B,CAAC;IAEF,OAAO,CACL,MAAC,gBAAgB,CAAC,QAAQ,IAAC,KAAK,EAAE,YAAY,aAC3C,UAAU,IAAI,CACb,8BACE,6BACc,iCAAiC,EAC7C,SAAS,EAAE,uBAAuB,GAC7B,EACP,6BACc,uBAAuB,EACnC,SAAS,EAAE,cAAc,GACpB,IACN,CACJ,EACA,QAAQ,IACiB,CAC7B,CAAC;AACJ,CAAC,CAAC"}
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
/**
|
|
3
|
+
*
|
|
4
|
+
* Copyright (c) "Neo4j"
|
|
5
|
+
* Neo4j Sweden AB [http://neo4j.com]
|
|
6
|
+
*
|
|
7
|
+
* This file is part of Neo4j.
|
|
8
|
+
*
|
|
9
|
+
* Neo4j is free software: you can redistribute it and/or modify
|
|
10
|
+
* it under the terms of the GNU General Public License as published by
|
|
11
|
+
* the Free Software Foundation, either version 3 of the License, or
|
|
12
|
+
* (at your option) any later version.
|
|
13
|
+
*
|
|
14
|
+
* This program is distributed in the hope that it will be useful,
|
|
15
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
16
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
17
|
+
* GNU General Public License for more details.
|
|
18
|
+
*
|
|
19
|
+
* You should have received a copy of the GNU General Public License
|
|
20
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
21
|
+
*/
|
|
22
|
+
import React from 'react';
|
|
23
|
+
import { useSpotlightContext } from './SpotlightProvider';
|
|
24
|
+
import classNames from 'classnames';
|
|
25
|
+
import ConditionalWrap from '../_common/ConditionalWrap';
|
|
26
|
+
export const SpotlightTarget = React.forwardRef(function SpotlightTarget({ id, hasPulse = true, backgroundColor, borderRadius, children, className, htmlAttributes, }, ref) {
|
|
27
|
+
const { isActiveSpotlight, isOpen, setIsOpen } = useSpotlightContext();
|
|
28
|
+
const classes = classNames('ndl-spotlight-target', {
|
|
29
|
+
'ndl-spotlight-target-pulse': hasPulse,
|
|
30
|
+
'ndl-spotlight-target-open': isOpen,
|
|
31
|
+
}, className);
|
|
32
|
+
const isActive = isActiveSpotlight(id);
|
|
33
|
+
return (_jsx("div", { className: isActive ? classes : '', style: { backgroundColor, borderRadius }, children: _jsx("div", Object.assign({ role: isActive ? 'button' : undefined, id: id, ref: ref, className: "ndl-spotlight-target-inner", onClick: (e) => {
|
|
34
|
+
if (isActive && !isOpen) {
|
|
35
|
+
setIsOpen(true);
|
|
36
|
+
e.preventDefault();
|
|
37
|
+
}
|
|
38
|
+
}, style: { borderRadius }, onKeyDown: (e) => {
|
|
39
|
+
console.log('e.key', e); // eslint-disable-line
|
|
40
|
+
if (isActive &&
|
|
41
|
+
!isOpen &&
|
|
42
|
+
(e.code === 'Enter' || e.code === 'Space')) {
|
|
43
|
+
setIsOpen(true);
|
|
44
|
+
e.preventDefault();
|
|
45
|
+
}
|
|
46
|
+
}, tabIndex: isActive ? 0 : -1, "aria-label": "spotlight target" }, htmlAttributes, { children: _jsx(ConditionalWrap, { shouldWrap: isActive,
|
|
47
|
+
// TODO v4: inert should be fixed in react 19? https://github.com/facebook/react/pull/24730#event-12109747640. inert="" is a workaround for now
|
|
48
|
+
wrap: (children) => (
|
|
49
|
+
/* @ts-expect-error inert not allowed */
|
|
50
|
+
_jsx("div", { inert: "", "aria-disabled": true, className: "ndl-spotlight-target-inert", children: children })), children: children }) })) }));
|
|
51
|
+
});
|
|
52
|
+
//# sourceMappingURL=SpotlightTarget.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SpotlightTarget.js","sourceRoot":"","sources":["../../../src/spotlight/SpotlightTarget.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AAC1D,OAAO,UAAU,MAAM,YAAY,CAAC;AAMpC,OAAO,eAAe,MAAM,4BAA4B,CAAC;AAgBzD,MAAM,CAAC,MAAM,eAAe,GAGxB,KAAK,CAAC,UAAU,CAAC,SAAS,eAAe,CAG3C,EACE,EAAE,EACF,QAAQ,GAAG,IAAI,EACf,eAAe,EACf,YAAY,EACZ,QAAQ,EACR,SAAS,EACT,cAAc,GACsC,EACtD,GAAsB;IAEtB,MAAM,EAAE,iBAAiB,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,mBAAmB,EAAE,CAAC;IAEvE,MAAM,OAAO,GAAG,UAAU,CACxB,sBAAsB,EACtB;QACE,4BAA4B,EAAE,QAAQ;QACtC,2BAA2B,EAAE,MAAM;KACpC,EACD,SAAS,CACV,CAAC;IAEF,MAAM,QAAQ,GAAG,iBAAiB,CAAC,EAAE,CAAC,CAAC;IAEvC,OAAO,CACL,cACE,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EAClC,KAAK,EAAE,EAAE,eAAe,EAAE,YAAY,EAAE,YAExC,4BACE,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EACrC,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,EACR,SAAS,EAAC,4BAA4B,EACtC,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;gBACb,IAAI,QAAQ,IAAI,CAAC,MAAM,EAAE,CAAC;oBACxB,SAAS,CAAC,IAAI,CAAC,CAAC;oBAChB,CAAC,CAAC,cAAc,EAAE,CAAC;gBACrB,CAAC;YACH,CAAC,EACD,KAAK,EAAE,EAAE,YAAY,EAAE,EACvB,SAAS,EAAE,CAAC,CAAC,EAAE,EAAE;gBACf,OAAO,CAAC,GAAG,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC,sBAAsB;gBAC/C,IACE,QAAQ;oBACR,CAAC,MAAM;oBACP,CAAC,CAAC,CAAC,IAAI,KAAK,OAAO,IAAI,CAAC,CAAC,IAAI,KAAK,OAAO,CAAC,EAC1C,CAAC;oBACD,SAAS,CAAC,IAAI,CAAC,CAAC;oBAChB,CAAC,CAAC,cAAc,EAAE,CAAC;gBACrB,CAAC;YACH,CAAC,EACD,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,gBAChB,kBAAkB,IACzB,cAAc,cAElB,KAAC,eAAe,IACd,UAAU,EAAE,QAAQ;gBACpB,+IAA+I;gBAC/I,IAAI,EAAE,CAAC,QAAQ,EAAE,EAAE,CAAC;gBAClB,wCAAwC;gBACxC,cAAK,KAAK,EAAC,EAAE,yBAAe,SAAS,EAAC,4BAA4B,YAC/D,QAAQ,GACL,CACP,YAEA,QAAQ,GACO,IACd,GACF,CACP,CAAC;AACJ,CAAC,CAAsE,CAAC"}
|
|
@@ -0,0 +1,134 @@
|
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
2
|
+
var t = {};
|
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4
|
+
t[p] = s[p];
|
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
8
|
+
t[p[i]] = s[p[i]];
|
|
9
|
+
}
|
|
10
|
+
return t;
|
|
11
|
+
};
|
|
12
|
+
import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
|
|
13
|
+
/**
|
|
14
|
+
*
|
|
15
|
+
* Copyright (c) "Neo4j"
|
|
16
|
+
* Neo4j Sweden AB [http://neo4j.com]
|
|
17
|
+
*
|
|
18
|
+
* This file is part of Neo4j.
|
|
19
|
+
*
|
|
20
|
+
* Neo4j is free software: you can redistribute it and/or modify
|
|
21
|
+
* it under the terms of the GNU General Public License as published by
|
|
22
|
+
* the Free Software Foundation, either version 3 of the License, or
|
|
23
|
+
* (at your option) any later version.
|
|
24
|
+
*
|
|
25
|
+
* This program is distributed in the hope that it will be useful,
|
|
26
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
27
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
28
|
+
* GNU General Public License for more details.
|
|
29
|
+
*
|
|
30
|
+
* You should have received a copy of the GNU General Public License
|
|
31
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
32
|
+
*/
|
|
33
|
+
import { useCallback } from 'react';
|
|
34
|
+
import { Spotlight } from './Spotlight';
|
|
35
|
+
import { useSpotlightContext } from './SpotlightProvider';
|
|
36
|
+
export const SpotlightTour = (props) => {
|
|
37
|
+
const { setActiveSpotlight, setIsOpen } = useSpotlightContext();
|
|
38
|
+
const { spotlights, dismissButtonText = 'Dismiss', backButtonText = 'Back', nextButtonText = 'Next', closeButtonText = 'Close', onAction, } = props;
|
|
39
|
+
const next = useCallback((index) => {
|
|
40
|
+
onAction === null || onAction === void 0 ? void 0 : onAction(spotlights[index].target, 'next');
|
|
41
|
+
setActiveSpotlight(spotlights[index + 1].target);
|
|
42
|
+
}, [onAction, spotlights, setActiveSpotlight]);
|
|
43
|
+
const back = useCallback((index) => {
|
|
44
|
+
onAction === null || onAction === void 0 ? void 0 : onAction(spotlights[index].target, 'back');
|
|
45
|
+
setActiveSpotlight(spotlights[index - 1].target);
|
|
46
|
+
}, [onAction, spotlights, setActiveSpotlight]);
|
|
47
|
+
const dismiss = useCallback((index) => {
|
|
48
|
+
onAction === null || onAction === void 0 ? void 0 : onAction(spotlights[index].target, 'dismiss');
|
|
49
|
+
setActiveSpotlight(null);
|
|
50
|
+
setIsOpen(false);
|
|
51
|
+
}, [onAction, spotlights, setActiveSpotlight, setIsOpen]);
|
|
52
|
+
const close = useCallback((index) => {
|
|
53
|
+
onAction === null || onAction === void 0 ? void 0 : onAction(spotlights[index].target, 'close');
|
|
54
|
+
setActiveSpotlight(null);
|
|
55
|
+
setIsOpen(false);
|
|
56
|
+
}, [onAction, spotlights, setActiveSpotlight, setIsOpen]);
|
|
57
|
+
const getActions = useCallback((actions, index) => {
|
|
58
|
+
if (actions === null || actions === void 0 ? void 0 : actions.length) {
|
|
59
|
+
return actions;
|
|
60
|
+
}
|
|
61
|
+
const isFirst = index === 0;
|
|
62
|
+
const isLast = index === spotlights.length - 1;
|
|
63
|
+
const hasMultiple = spotlights.length > 1;
|
|
64
|
+
const newActions = [];
|
|
65
|
+
if (!isLast && hasMultiple) {
|
|
66
|
+
newActions.push({
|
|
67
|
+
label: dismissButtonText,
|
|
68
|
+
fill: 'text',
|
|
69
|
+
onClick: () => dismiss(index),
|
|
70
|
+
});
|
|
71
|
+
}
|
|
72
|
+
if (!isFirst && hasMultiple) {
|
|
73
|
+
newActions.push({
|
|
74
|
+
label: backButtonText,
|
|
75
|
+
fill: 'text',
|
|
76
|
+
onClick: () => back(index),
|
|
77
|
+
});
|
|
78
|
+
}
|
|
79
|
+
if (isLast) {
|
|
80
|
+
newActions.push({
|
|
81
|
+
label: closeButtonText,
|
|
82
|
+
fill: 'outlined',
|
|
83
|
+
onClick: () => close(index),
|
|
84
|
+
});
|
|
85
|
+
}
|
|
86
|
+
else {
|
|
87
|
+
newActions.push({
|
|
88
|
+
label: nextButtonText,
|
|
89
|
+
fill: 'outlined',
|
|
90
|
+
onClick: () => next(index),
|
|
91
|
+
});
|
|
92
|
+
}
|
|
93
|
+
return newActions;
|
|
94
|
+
}, [
|
|
95
|
+
spotlights,
|
|
96
|
+
dismissButtonText,
|
|
97
|
+
dismiss,
|
|
98
|
+
backButtonText,
|
|
99
|
+
back,
|
|
100
|
+
closeButtonText,
|
|
101
|
+
close,
|
|
102
|
+
nextButtonText,
|
|
103
|
+
next,
|
|
104
|
+
]);
|
|
105
|
+
const getBeforeActions = useCallback((beforeActions, index) => {
|
|
106
|
+
if (beforeActions) {
|
|
107
|
+
return beforeActions;
|
|
108
|
+
}
|
|
109
|
+
return spotlights.length > 1 ? index + 1 + '/' + spotlights.length : null;
|
|
110
|
+
}, [spotlights]);
|
|
111
|
+
const getInitialFocus = useCallback((initialFocus, actions) => {
|
|
112
|
+
if (initialFocus !== undefined) {
|
|
113
|
+
return initialFocus;
|
|
114
|
+
}
|
|
115
|
+
return actions.length - 1;
|
|
116
|
+
}, []);
|
|
117
|
+
const getOnClose = useCallback((onClose, index) => {
|
|
118
|
+
if (onClose) {
|
|
119
|
+
return onClose;
|
|
120
|
+
}
|
|
121
|
+
return (reason) => {
|
|
122
|
+
onAction === null || onAction === void 0 ? void 0 : onAction(spotlights[index].target, reason);
|
|
123
|
+
};
|
|
124
|
+
}, [onAction, spotlights]);
|
|
125
|
+
return (_jsx(_Fragment, { children: spotlights.map((spotlight, index) => {
|
|
126
|
+
const { actions, beforeActions, initialFocus, onClose } = spotlight, restSpotlight = __rest(spotlight, ["actions", "beforeActions", "initialFocus", "onClose"]);
|
|
127
|
+
const newActions = getActions(actions, index);
|
|
128
|
+
const newBeforeActions = getBeforeActions(beforeActions, index);
|
|
129
|
+
const newInitialFocus = getInitialFocus(initialFocus, newActions);
|
|
130
|
+
const newOnClose = getOnClose(onClose, index);
|
|
131
|
+
return (_jsx(Spotlight, Object.assign({}, restSpotlight, { actions: newActions, beforeActions: newBeforeActions, initialFocus: newInitialFocus, onClose: newOnClose }), index));
|
|
132
|
+
}) }));
|
|
133
|
+
};
|
|
134
|
+
//# sourceMappingURL=SpotlightTour.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SpotlightTour.js","sourceRoot":"","sources":["../../../src/spotlight/SpotlightTour.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
/**
|
|
2
|
+
*
|
|
3
|
+
* Copyright (c) "Neo4j"
|
|
4
|
+
* Neo4j Sweden AB [http://neo4j.com]
|
|
5
|
+
*
|
|
6
|
+
* This file is part of Neo4j.
|
|
7
|
+
*
|
|
8
|
+
* Neo4j is free software: you can redistribute it and/or modify
|
|
9
|
+
* it under the terms of the GNU General Public License as published by
|
|
10
|
+
* the Free Software Foundation, either version 3 of the License, or
|
|
11
|
+
* (at your option) any later version.
|
|
12
|
+
*
|
|
13
|
+
* This program is distributed in the hope that it will be useful,
|
|
14
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
15
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
16
|
+
* GNU General Public License for more details.
|
|
17
|
+
*
|
|
18
|
+
* You should have received a copy of the GNU General Public License
|
|
19
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
20
|
+
*/
|
|
21
|
+
export * from './Spotlight';
|
|
22
|
+
export * from './SpotlightProvider';
|
|
23
|
+
export * from './SpotlightTarget';
|
|
24
|
+
export * from './SpotlightTour';
|
|
25
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/spotlight/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,cAAc,aAAa,CAAC;AAC5B,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC"}
|
package/lib/types/index.d.ts
CHANGED
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
/**
|
|
2
|
+
*
|
|
3
|
+
* Copyright (c) "Neo4j"
|
|
4
|
+
* Neo4j Sweden AB [http://neo4j.com]
|
|
5
|
+
*
|
|
6
|
+
* This file is part of Neo4j.
|
|
7
|
+
*
|
|
8
|
+
* Neo4j is free software: you can redistribute it and/or modify
|
|
9
|
+
* it under the terms of the GNU General Public License as published by
|
|
10
|
+
* the Free Software Foundation, either version 3 of the License, or
|
|
11
|
+
* (at your option) any later version.
|
|
12
|
+
*
|
|
13
|
+
* This program is distributed in the hope that it will be useful,
|
|
14
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
15
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
16
|
+
* GNU General Public License for more details.
|
|
17
|
+
*
|
|
18
|
+
* You should have received a copy of the GNU General Public License
|
|
19
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
20
|
+
*/
|
|
21
|
+
import React from 'react';
|
|
22
|
+
import { HtmlAttributes, PolymorphicForwardRefExoticComponent, PolymorphicPropsWithRef } from '../_common/types';
|
|
23
|
+
import { EventTypeLabelProps } from '../label';
|
|
24
|
+
export type SpotlightActionsProps = {
|
|
25
|
+
label: string;
|
|
26
|
+
isDisabled?: boolean;
|
|
27
|
+
fill?: 'text' | 'outlined';
|
|
28
|
+
} & ({
|
|
29
|
+
as: 'button';
|
|
30
|
+
onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
|
|
31
|
+
} | {
|
|
32
|
+
as?: 'a';
|
|
33
|
+
href?: string;
|
|
34
|
+
target?: React.ComponentPropsWithoutRef<'a'>['target'];
|
|
35
|
+
} | {
|
|
36
|
+
as: React.ElementType;
|
|
37
|
+
});
|
|
38
|
+
declare const SpotlightActions: PolymorphicForwardRefExoticComponent<'button', SpotlightActionsProps>;
|
|
39
|
+
type SpotlightHeaderProps = {
|
|
40
|
+
children?: React.ReactNode;
|
|
41
|
+
};
|
|
42
|
+
type SpotlightBodyProps = {
|
|
43
|
+
children?: React.ReactNode;
|
|
44
|
+
};
|
|
45
|
+
type SpotlightLabelProps = Omit<EventTypeLabelProps, 'color' | 'fill'>;
|
|
46
|
+
type SpotlightImageProps = {
|
|
47
|
+
src: string;
|
|
48
|
+
alt: string;
|
|
49
|
+
htmlAttributes?: HtmlAttributes<'img'>;
|
|
50
|
+
className?: string;
|
|
51
|
+
style?: React.CSSProperties;
|
|
52
|
+
};
|
|
53
|
+
type SpotlightIconWrapperProps = {
|
|
54
|
+
children?: React.ReactNode;
|
|
55
|
+
};
|
|
56
|
+
export type SpotlightCloseAction = 'clickOutside' | 'escapeKeyDown';
|
|
57
|
+
export type SpotlightProps = {
|
|
58
|
+
/** Id of the SpotlightTarget where the spotlight should be rendered */
|
|
59
|
+
target: string;
|
|
60
|
+
/** Action buttons in the footer */
|
|
61
|
+
actions?: React.ComponentProps<typeof SpotlightActions>[];
|
|
62
|
+
/** Left bottom corner content */
|
|
63
|
+
beforeActions?: React.ReactNode;
|
|
64
|
+
/** Which element to initially focus. Either a tabbable index or ref */
|
|
65
|
+
initialFocus?: number | React.MutableRefObject<HTMLElement | null>;
|
|
66
|
+
onClose?: (action: SpotlightCloseAction) => void;
|
|
67
|
+
children?: React.ReactNode;
|
|
68
|
+
className?: string;
|
|
69
|
+
style?: React.CSSProperties;
|
|
70
|
+
htmlAttributes?: HtmlAttributes<'div'>;
|
|
71
|
+
};
|
|
72
|
+
declare const Spotlight: Omit<React.ForwardRefExoticComponent<SpotlightProps & {
|
|
73
|
+
[key: string]: unknown;
|
|
74
|
+
}>, "$$typeof"> & Omit<React.ExoticComponent<SpotlightProps & {
|
|
75
|
+
[key: string]: unknown;
|
|
76
|
+
}>, never> & (<InstanceT extends React.ElementType = "div">(props: PolymorphicPropsWithRef<InstanceT, SpotlightProps>) => React.ReactElement | null) & {
|
|
77
|
+
Actions: PolymorphicForwardRefExoticComponent<"button", SpotlightActionsProps>;
|
|
78
|
+
Body: PolymorphicForwardRefExoticComponent<"div", SpotlightBodyProps>;
|
|
79
|
+
Header: PolymorphicForwardRefExoticComponent<"div", SpotlightHeaderProps>;
|
|
80
|
+
IconWrapper: PolymorphicForwardRefExoticComponent<"div", SpotlightIconWrapperProps>;
|
|
81
|
+
Image: React.ForwardRefExoticComponent<SpotlightImageProps & React.RefAttributes<HTMLImageElement>>;
|
|
82
|
+
Label: PolymorphicForwardRefExoticComponent<"div", SpotlightLabelProps>;
|
|
83
|
+
};
|
|
84
|
+
export { Spotlight };
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
/**
|
|
2
|
+
*
|
|
3
|
+
* Copyright (c) "Neo4j"
|
|
4
|
+
* Neo4j Sweden AB [http://neo4j.com]
|
|
5
|
+
*
|
|
6
|
+
* This file is part of Neo4j.
|
|
7
|
+
*
|
|
8
|
+
* Neo4j is free software: you can redistribute it and/or modify
|
|
9
|
+
* it under the terms of the GNU General Public License as published by
|
|
10
|
+
* the Free Software Foundation, either version 3 of the License, or
|
|
11
|
+
* (at your option) any later version.
|
|
12
|
+
*
|
|
13
|
+
* This program is distributed in the hope that it will be useful,
|
|
14
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
15
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
16
|
+
* GNU General Public License for more details.
|
|
17
|
+
*
|
|
18
|
+
* You should have received a copy of the GNU General Public License
|
|
19
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
20
|
+
*/
|
|
21
|
+
|
|
22
|
+
import React from 'react';
|
|
23
|
+
type SpotlightContextType = {
|
|
24
|
+
/** Is true if the spotlight is open */
|
|
25
|
+
isOpen: boolean;
|
|
26
|
+
/** Closes or opens the spotlight */
|
|
27
|
+
setIsOpen: (arg: boolean) => void;
|
|
28
|
+
/** Is true if the provided target is the active spotlight */
|
|
29
|
+
isActiveSpotlight: (target: string) => boolean;
|
|
30
|
+
/** Sets the active spotlight to the provided target. Use null to clear active target */
|
|
31
|
+
setActiveSpotlight: (target: string | null) => void;
|
|
32
|
+
};
|
|
33
|
+
export declare const useSpotlightContext: () => SpotlightContextType;
|
|
34
|
+
type SpotlightProviderProps = {
|
|
35
|
+
children: React.ReactNode;
|
|
36
|
+
/** If the spotlights should have an overlay */
|
|
37
|
+
hasOverlay?: boolean;
|
|
38
|
+
};
|
|
39
|
+
export declare const SpotlightProvider: (props: SpotlightProviderProps) => import("react/jsx-runtime").JSX.Element;
|
|
40
|
+
export {};
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
/**
|
|
2
|
+
*
|
|
3
|
+
* Copyright (c) "Neo4j"
|
|
4
|
+
* Neo4j Sweden AB [http://neo4j.com]
|
|
5
|
+
*
|
|
6
|
+
* This file is part of Neo4j.
|
|
7
|
+
*
|
|
8
|
+
* Neo4j is free software: you can redistribute it and/or modify
|
|
9
|
+
* it under the terms of the GNU General Public License as published by
|
|
10
|
+
* the Free Software Foundation, either version 3 of the License, or
|
|
11
|
+
* (at your option) any later version.
|
|
12
|
+
*
|
|
13
|
+
* This program is distributed in the hope that it will be useful,
|
|
14
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
15
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
16
|
+
* GNU General Public License for more details.
|
|
17
|
+
*
|
|
18
|
+
* You should have received a copy of the GNU General Public License
|
|
19
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
20
|
+
*/
|
|
21
|
+
import React from 'react';
|
|
22
|
+
import { PolymorphicForwardRefExoticComponent } from '../_common/types';
|
|
23
|
+
type SpotlightTargetProps = {
|
|
24
|
+
/** id of the target. should match with target prop in Spotlight */
|
|
25
|
+
id: string;
|
|
26
|
+
/** if the target should have a pulse animation. default behaviour is true */
|
|
27
|
+
hasPulse?: boolean;
|
|
28
|
+
/** background color */
|
|
29
|
+
backgroundColor?: React.CSSProperties['backgroundColor'];
|
|
30
|
+
/** border radius */
|
|
31
|
+
borderRadius?: React.CSSProperties['borderRadius'];
|
|
32
|
+
/** classnames are only applied when target is active */
|
|
33
|
+
className?: string;
|
|
34
|
+
children?: React.ReactNode;
|
|
35
|
+
};
|
|
36
|
+
export declare const SpotlightTarget: PolymorphicForwardRefExoticComponent<'div', SpotlightTargetProps>;
|
|
37
|
+
export {};
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
/**
|
|
2
|
+
*
|
|
3
|
+
* Copyright (c) "Neo4j"
|
|
4
|
+
* Neo4j Sweden AB [http://neo4j.com]
|
|
5
|
+
*
|
|
6
|
+
* This file is part of Neo4j.
|
|
7
|
+
*
|
|
8
|
+
* Neo4j is free software: you can redistribute it and/or modify
|
|
9
|
+
* it under the terms of the GNU General Public License as published by
|
|
10
|
+
* the Free Software Foundation, either version 3 of the License, or
|
|
11
|
+
* (at your option) any later version.
|
|
12
|
+
*
|
|
13
|
+
* This program is distributed in the hope that it will be useful,
|
|
14
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
15
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
16
|
+
* GNU General Public License for more details.
|
|
17
|
+
*
|
|
18
|
+
* You should have received a copy of the GNU General Public License
|
|
19
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
20
|
+
*/
|
|
21
|
+
import React from 'react';
|
|
22
|
+
import { Spotlight, SpotlightCloseAction } from './Spotlight';
|
|
23
|
+
type SpotlightTourAction = SpotlightCloseAction | 'dismiss' | 'back' | 'next' | 'close';
|
|
24
|
+
type SpotlightTourProps = {
|
|
25
|
+
/** Array of spotlights */
|
|
26
|
+
spotlights: React.ComponentProps<typeof Spotlight>[];
|
|
27
|
+
/** Text override for dismiss button */
|
|
28
|
+
dismissButtonText?: string;
|
|
29
|
+
/** Text override for back button */
|
|
30
|
+
backButtonText?: string;
|
|
31
|
+
/** Text override for next button */
|
|
32
|
+
nextButtonText?: string;
|
|
33
|
+
/** Text override for close button */
|
|
34
|
+
closeButtonText?: string;
|
|
35
|
+
/** Callback function on button clicks, outside clicks, and escape key down */
|
|
36
|
+
onAction?: (target: string, action: SpotlightTourAction) => void;
|
|
37
|
+
};
|
|
38
|
+
export declare const SpotlightTour: (props: SpotlightTourProps) => import("react/jsx-runtime").JSX.Element;
|
|
39
|
+
export {};
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
/**
|
|
2
|
+
*
|
|
3
|
+
* Copyright (c) "Neo4j"
|
|
4
|
+
* Neo4j Sweden AB [http://neo4j.com]
|
|
5
|
+
*
|
|
6
|
+
* This file is part of Neo4j.
|
|
7
|
+
*
|
|
8
|
+
* Neo4j is free software: you can redistribute it and/or modify
|
|
9
|
+
* it under the terms of the GNU General Public License as published by
|
|
10
|
+
* the Free Software Foundation, either version 3 of the License, or
|
|
11
|
+
* (at your option) any later version.
|
|
12
|
+
*
|
|
13
|
+
* This program is distributed in the hope that it will be useful,
|
|
14
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
15
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
16
|
+
* GNU General Public License for more details.
|
|
17
|
+
*
|
|
18
|
+
* You should have received a copy of the GNU General Public License
|
|
19
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
20
|
+
*/
|
|
21
|
+
export * from './Spotlight';
|
|
22
|
+
export * from './SpotlightProvider';
|
|
23
|
+
export * from './SpotlightTarget';
|
|
24
|
+
export * from './SpotlightTour';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@neo4j-ndl/react",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.2.0",
|
|
4
4
|
"sideEffects": false,
|
|
5
5
|
"description": "React implementation of Neo4j Design System",
|
|
6
6
|
"keywords": [
|
|
@@ -64,7 +64,7 @@
|
|
|
64
64
|
"@tanstack/react-table": "8.20.5",
|
|
65
65
|
"react": ">=16.8.0",
|
|
66
66
|
"react-dom": ">=16.8.0",
|
|
67
|
-
"@neo4j-ndl/base": "^3.
|
|
67
|
+
"@neo4j-ndl/base": "^3.2.0"
|
|
68
68
|
},
|
|
69
69
|
"dependencies": {
|
|
70
70
|
"@dnd-kit/core": "6.1.0",
|