@tent-official/react-walkthrough 1.5.1 → 1.6.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/README.md CHANGED
@@ -87,7 +87,7 @@ Hook to register a walkthrough tour.
87
87
  | `prevLabel` | `string` | `"Back"` | Previous button label (can be overridden per step) |
88
88
  | `skipLabel` | `string` | `"Skip"` | Skip button label (can be overridden per step) |
89
89
  | `delay` | `number` | `0` | Delay in ms before highlighting the first step. During delay, a dark overlay is shown |
90
- | `doneLabel` | `string` | `"Done"` | Done button label (last step) |
90
+ | `doneLabel` | `string` | `"Done"` | Done button label (last step) (can be overridden per step) |
91
91
  | `containerElement` | `string` | — | DOM element ID of the scrollable container (e.g. a drawer). When provided, scrolls within this container instead of the window |
92
92
  | `animationSpeed` | `number` | `350` | Base animation speed (ms) used to calculate transition duration from distance |
93
93
  | `displayTotal` | `number` | — | Override the total step count displayed in the step counter (display-only, does not affect logic) |
@@ -116,6 +116,7 @@ Hook to register a walkthrough tour.
116
116
  | `nextLabel` | `string` | — | Override tour-level `nextLabel` for this step |
117
117
  | `prevLabel` | `string` | — | Override tour-level `prevLabel` for this step |
118
118
  | `skipLabel` | `string` | — | Override tour-level `skipLabel` for this step |
119
+ | `doneLabel` | `string` | — | Override tour-level `doneLabel` for this step |
119
120
  | `displayStep` | `number` | — | Override the displayed step number for this step (display-only) |
120
121
  | `displayTotal` | `number` | — | Override the displayed total for this step (display-only) |
121
122
  | `delayAfterNext` | `number` | `0` | Delay in ms after clicking "Next" (after `onStepNext` and `triggerElOnNext` have fired) before advancing to the next step. The overlay stays visible with the popover hidden during the delay |
package/dist/index.d.mts CHANGED
@@ -55,6 +55,8 @@ interface IWalkthroughStep {
55
55
  prevLabel?: string;
56
56
  /** Override tour-level skipLabel for this specific step. If omitted, uses the tour-level value */
57
57
  skipLabel?: string;
58
+ /** Override tour-level doneLabel for this specific step. If omitted, uses the tour-level value */
59
+ doneLabel?: string;
58
60
  /** Override the displayed current step number for this specific step (display-only, does not affect logic). If omitted, uses the calculated value from tour-level settings */
59
61
  displayStep?: number;
60
62
  /** Override the displayed total step count for this specific step (display-only, does not affect logic). If omitted, uses the tour-level displayTotal or actual count */
package/dist/index.d.ts CHANGED
@@ -55,6 +55,8 @@ interface IWalkthroughStep {
55
55
  prevLabel?: string;
56
56
  /** Override tour-level skipLabel for this specific step. If omitted, uses the tour-level value */
57
57
  skipLabel?: string;
58
+ /** Override tour-level doneLabel for this specific step. If omitted, uses the tour-level value */
59
+ doneLabel?: string;
58
60
  /** Override the displayed current step number for this specific step (display-only, does not affect logic). If omitted, uses the calculated value from tour-level settings */
59
61
  displayStep?: number;
60
62
  /** Override the displayed total step count for this specific step (display-only, does not affect logic). If omitted, uses the tour-level displayTotal or actual count */
package/dist/index.js CHANGED
@@ -625,7 +625,7 @@ var WalkthroughOverlay = ({
625
625
  prevColor,
626
626
  skipColor
627
627
  } = {}) => {
628
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p;
628
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q;
629
629
  injectKeyframes();
630
630
  const { activeTour } = useGlobalState();
631
631
  const instanceIdRef = react.useRef(null);
@@ -948,11 +948,12 @@ var WalkthroughOverlay = ({
948
948
  nextLabel: tourNextLabel = "Next",
949
949
  prevLabel: tourPrevLabel = "Back",
950
950
  skipLabel: tourSkipLabel = "Skip",
951
- doneLabel = "Done"
951
+ doneLabel: tourDoneLabel = "Done"
952
952
  } = activeTour;
953
953
  const nextLabel = (_h = step.nextLabel) != null ? _h : tourNextLabel;
954
954
  const prevLabel = (_i = step.prevLabel) != null ? _i : tourPrevLabel;
955
955
  const skipLabel = (_j = step.skipLabel) != null ? _j : tourSkipLabel;
956
+ const doneLabel = (_k = step.doneLabel) != null ? _k : tourDoneLabel;
956
957
  const advanceStep = (hasTrigger) => {
957
958
  var _a2;
958
959
  const currentOrigIdx = validSteps[currentValidPos]._originalIdx;
@@ -994,13 +995,9 @@ var WalkthroughOverlay = ({
994
995
  const SETTLE_DELAY = 150;
995
996
  const targetEl = document.getElementById(nextElId);
996
997
  if (targetEl) {
997
- let targetStepIdx = -1;
998
- for (let i = currentOrigIdx + 1; i < activeTour.steps.length; i++) {
999
- if (resolveElId(activeTour.steps[i].el) === nextElId) {
1000
- targetStepIdx = i;
1001
- break;
1002
- }
1003
- }
998
+ const targetStepIdx = activeTour.steps.findIndex(
999
+ (s) => resolveElId(s.el) === nextElId
1000
+ );
1004
1001
  if (targetStepIdx !== -1) {
1005
1002
  const targetStepDef = activeTour.steps[targetStepIdx];
1006
1003
  const targetStepWithIdx = { ...targetStepDef, _originalIdx: targetStepIdx };
@@ -1144,10 +1141,10 @@ var WalkthroughOverlay = ({
1144
1141
  displayPosRef.current = currentValidPos;
1145
1142
  }
1146
1143
  const ds = displayStepRef.current;
1147
- const dir = (_k = popoverPos == null ? void 0 : popoverPos.dir) != null ? _k : "bottom";
1148
- const align = (_l = popoverPos == null ? void 0 : popoverPos.align) != null ? _l : "start";
1149
- const offsetX = (_m = popoverPos == null ? void 0 : popoverPos.offsetX) != null ? _m : 0;
1150
- const offsetY = (_n = popoverPos == null ? void 0 : popoverPos.offsetY) != null ? _n : 0;
1144
+ const dir = (_l = popoverPos == null ? void 0 : popoverPos.dir) != null ? _l : "bottom";
1145
+ const align = (_m = popoverPos == null ? void 0 : popoverPos.align) != null ? _m : "start";
1146
+ const offsetX = (_n = popoverPos == null ? void 0 : popoverPos.offsetX) != null ? _n : 0;
1147
+ const offsetY = (_o = popoverPos == null ? void 0 : popoverPos.offsetY) != null ? _o : 0;
1151
1148
  const anchorStyle = popoverReady ? {
1152
1149
  position: "fixed",
1153
1150
  top: rect.top,
@@ -1246,7 +1243,7 @@ var WalkthroughOverlay = ({
1246
1243
  /* @__PURE__ */ jsxRuntime.jsxs(PopoverBody, { children: [
1247
1244
  /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "row", justifyContent: "space-between" }, children: [
1248
1245
  pStep.title ? /* @__PURE__ */ jsxRuntime.jsx(PopoverTitle, { children: pStep.title }) : "",
1249
- ((_o = pStep.isShowStep) != null ? _o : pIsShowStep) && /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { color: "#a1a1aa", fontSize: "12px", fontWeight: "400" }, children: [
1246
+ ((_p = pStep.isShowStep) != null ? _p : pIsShowStep) && /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { color: "#a1a1aa", fontSize: "12px", fontWeight: "400" }, children: [
1250
1247
  pDisplayCurrentStep,
1251
1248
  "/",
1252
1249
  pDisplayTotalSteps
@@ -1271,7 +1268,7 @@ var WalkthroughOverlay = ({
1271
1268
  }
1272
1269
  ) }),
1273
1270
  /* @__PURE__ */ jsxRuntime.jsxs(ButtonGroup, { children: [
1274
- ((_p = pStep.isShowPrev) != null ? _p : pIsShowPrev) && pCurrentValidPos > 0 && /* @__PURE__ */ jsxRuntime.jsx(
1271
+ ((_q = pStep.isShowPrev) != null ? _q : pIsShowPrev) && pCurrentValidPos > 0 && /* @__PURE__ */ jsxRuntime.jsx(
1275
1272
  "button",
1276
1273
  {
1277
1274
  className: "wt-btn",