@burdenoff/microfe-tours 2026.608.1 → 2026.625.1

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 (27) hide show
  1. package/dist/tours/ToursUserRoutes.js +3 -3
  2. package/dist/tours/ToursUserRoutes.js.map +1 -1
  3. package/dist/tours/components/RouteHelpers.js +6 -6
  4. package/dist/tours/components/RouteHelpers.js.map +1 -1
  5. package/dist/tours/pages/AnalyticsDashboardPage.js +80 -74
  6. package/dist/tours/pages/AnalyticsDashboardPage.js.map +1 -1
  7. package/dist/tours/pages/MediaLibraryPage.js +66 -64
  8. package/dist/tours/pages/MediaLibraryPage.js.map +1 -1
  9. package/dist/tours/pages/MyToursPage.js +37 -35
  10. package/dist/tours/pages/MyToursPage.js.map +1 -1
  11. package/dist/tours/pages/MyToursProgressPage.js +60 -56
  12. package/dist/tours/pages/MyToursProgressPage.js.map +1 -1
  13. package/dist/tours/pages/SchedulerPage.js +98 -92
  14. package/dist/tours/pages/SchedulerPage.js.map +1 -1
  15. package/dist/tours/pages/StepEditorPage.js +261 -260
  16. package/dist/tours/pages/StepEditorPage.js.map +1 -1
  17. package/dist/tours/pages/SystemAnalyticsPage.js +59 -53
  18. package/dist/tours/pages/SystemAnalyticsPage.js.map +1 -1
  19. package/dist/tours/pages/TemplateLibraryPage.js +71 -69
  20. package/dist/tours/pages/TemplateLibraryPage.js.map +1 -1
  21. package/dist/tours/pages/TourBuilderPage.js +181 -194
  22. package/dist/tours/pages/TourBuilderPage.js.map +1 -1
  23. package/dist/tours/pages/TourPreviewPage.js +92 -89
  24. package/dist/tours/pages/TourPreviewPage.js.map +1 -1
  25. package/dist/tours/pages/ToursListPage.js +171 -215
  26. package/dist/tours/pages/ToursListPage.js.map +1 -1
  27. package/package.json +2 -2
package/dist/tours/pages/StepEditorPage.js CHANGED
@@ -1,245 +1,245 @@
1
1
  import { useToursContext as e } from "../providers/ToursProvider.js";
2
2
  import { useToursPermissionAccess as t } from "../hooks/useToursPermissionAccess.js";
3
3
  import { TOUR_PERMISSIONS as n } from "../../constants/permissions.js";
4
- import { useToursI18n as r } from "../i18n.js";
5
- import { emitToursApiFailed as i } from "../telemetry.js";
6
- import { useMediaLibrary as a } from "../hooks/useMediaLibrary.js";
7
- import { useStepSequencer as ee } from "../hooks/useStepSequencer.js";
8
- import { useTourBuilder as o } from "../hooks/useTourBuilder.js";
9
- import { useEffect as s, useState as c } from "react";
10
- import { PermissionGate as te } from "@burdenoff/fe-libs/shared/components";
11
- import { ArrowLeft as l, ChevronDown as u, ChevronLeft as d, ChevronRight as f, ChevronUp as p, Menu as m, Paperclip as h, Plus as g, Save as ne, Trash2 as re, X as ie } from "lucide-react";
12
- import { jsx as _, jsxs as v } from "react/jsx-runtime";
13
- import { useNavigate as y, useParams as ae } from "react-router-dom";
14
- import { useEventBus as oe } from "@burdenoff/fe-libs/shared/events";
15
- import { OptionalFields as b } from "@burdenoff/fe-libs/ui";
4
+ import { useToursI18n as ee } from "../i18n.js";
5
+ import { emitToursApiFailed as r } from "../telemetry.js";
6
+ import { useMediaLibrary as te } from "../hooks/useMediaLibrary.js";
7
+ import { useStepSequencer as i } from "../hooks/useStepSequencer.js";
8
+ import { useTourBuilder as a } from "../hooks/useTourBuilder.js";
9
+ import { useEffect as o, useState as s } from "react";
10
+ import { PermissionGate as ne } from "@burdenoff/fe-libs/shared/components";
11
+ import { ArrowLeft as re, ChevronDown as c, ChevronLeft as l, ChevronRight as u, ChevronUp as d, Menu as f, Paperclip as ie, Plus as p, Save as ae, Trash2 as oe, X as se } from "lucide-react";
12
+ import { jsx as m, jsxs as h } from "react/jsx-runtime";
13
+ import { useNavigate as ce, useParams as g } from "react-router-dom";
14
+ import { Button as _, GlassCard as v, OptionalFields as y } from "@burdenoff/fe-libs/ui";
15
+ import { useEventBus as b } from "@burdenoff/fe-libs/shared/events";
16
16
  //#region src/tours/pages/StepEditorPage.tsx
17
17
  function x() {
18
- let { tr: x } = r(), { tourId: S, stepId: C } = ae(), se = y(), w = e(), { basePath: ce = "/" } = w, T = oe(), { hasPermission: E } = t(), D = E(n.TOUR_STEP_CREATE), O = E(n.TOUR_STEP_UPDATE), k = E(n.TOUR_STEP_DELETE), { tour: A, loadTour: j, syncSteps: M, saving: N } = o(S), { steps: P, selectedStep: F, selectStep: I, createStep: L, deleteStep: R, updateStepField: z, moveStep: B } = ee(), { media: le, fetchMedia: V, attachToStep: H, loading: U } = a(), [W, G] = c(!1), [K, q] = c(() => typeof window < "u" && window.innerWidth < 768), [J, Y] = c(""), [X, ue] = c("body"), [de, Z] = c(!1);
19
- s(() => {
18
+ let { tr: x } = ee(), { tourId: S, stepId: C } = g(), le = ce(), w = e(), { basePath: T = "/" } = w, E = b(), { hasPermission: D } = t(), O = D(n.TOUR_STEP_CREATE), k = D(n.TOUR_STEP_UPDATE), A = D(n.TOUR_STEP_DELETE), { tour: j, loadTour: M, syncSteps: N, saving: P } = a(S), { steps: F, selectedStep: I, selectStep: L, createStep: R, deleteStep: z, updateStepField: B, moveStep: V } = i(), { media: H, fetchMedia: U, attachToStep: W, loading: ue } = te(), [G, K] = s(!1), [q, de] = s(() => typeof window < "u" && window.innerWidth < 768), [J, Y] = s(""), [X, fe] = s("body"), [pe, Z] = s(!1);
19
+ o(() => {
20
20
  let e = () => {
21
21
  let e = window.innerWidth < 768;
22
- q(e), e || G(!1);
22
+ de(e), e || K(!1);
23
23
  };
24
24
  return window.addEventListener("resize", e), () => window.removeEventListener("resize", e);
25
- }, []), s(() => {
26
- S && j(S);
27
- }, [S, j]), s(() => {
28
- V();
29
- }, [V]), s(() => {
30
- let e = C || F?.id;
31
- if (e && P.length > 0) {
32
- let t = P.find((t) => t.id === e);
33
- t && I(t);
25
+ }, []), o(() => {
26
+ S && M(S);
27
+ }, [S, M]), o(() => {
28
+ U();
29
+ }, [U]), o(() => {
30
+ let e = C || I?.id;
31
+ if (e && F.length > 0) {
32
+ let t = F.find((t) => t.id === e);
33
+ t && L(t);
34
34
  }
35
35
  }, [
36
36
  C,
37
- P,
38
- I,
39
- F?.id
37
+ F,
38
+ L,
39
+ I?.id
40
40
  ]);
41
41
  let Q = () => {
42
- L();
43
- }, fe = async () => {
42
+ R();
43
+ }, me = async () => {
44
44
  if (S) try {
45
- await M(S, P);
45
+ await N(S, F);
46
46
  } catch {
47
- i(T, "step.save", w);
47
+ r(E, "step.save", w);
48
48
  }
49
- }, pe = () => {
50
- se(`${ce}/${S}/edit`);
51
- }, me = async () => {
52
- if (!(!F || !S || !J)) {
53
- if (F.id.startsWith("temp_")) {
49
+ }, he = () => {
50
+ le(`${T}/${S}/edit`);
51
+ }, ge = async () => {
52
+ if (!(!I || !S || !J)) {
53
+ if (I.id.startsWith("temp_")) {
54
54
  window.alert("Save your steps before attaching media to them.");
55
55
  return;
56
56
  }
57
57
  try {
58
- Z(!0), await H(F.id, J, X, (F.media?.length ?? 0) + 1), await j(S), Y("");
58
+ Z(!0), await W(I.id, J, X, (I.media?.length ?? 0) + 1), await M(S), Y("");
59
59
  } catch {
60
- i(T, "media.attach", w);
60
+ r(E, "media.attach", w);
61
61
  } finally {
62
62
  Z(!1);
63
63
  }
64
64
  }
65
65
  }, $ = (e) => {
66
- I(e), K && G(!1);
66
+ L(e), q && K(!1);
67
67
  };
68
- return /* @__PURE__ */ v("div", {
69
- className: "flex flex-col h-full bg-background",
70
- children: [/* @__PURE__ */ v("div", {
71
- className: "border-b border-border p-3 sm:p-4 flex flex-col sm:flex-row sm:items-center gap-3 sm:gap-4 bg-card",
72
- children: [/* @__PURE__ */ v("div", {
68
+ return /* @__PURE__ */ h("div", {
69
+ className: "flex flex-col h-full bg-bg-surface",
70
+ children: [/* @__PURE__ */ h("div", {
71
+ className: "border-b border-border-subtle p-3 sm:p-4 flex flex-col sm:flex-row sm:items-center gap-3 sm:gap-4 bg-bg-surface",
72
+ children: [/* @__PURE__ */ h("div", {
73
73
  className: "flex items-center gap-3",
74
- children: [/* @__PURE__ */ _("button", {
74
+ children: [/* @__PURE__ */ m("button", {
75
75
  type: "button",
76
- onClick: pe,
76
+ onClick: he,
77
77
  className: "p-2 hover:bg-accent rounded-md shrink-0",
78
78
  "aria-label": x("stepEditor.goBack"),
79
- children: /* @__PURE__ */ _(l, { size: 20 })
80
- }), /* @__PURE__ */ v("div", {
79
+ children: /* @__PURE__ */ m(re, { size: 20 })
80
+ }), /* @__PURE__ */ h("div", {
81
81
  className: "flex-1 min-w-0",
82
- children: [/* @__PURE__ */ v("h1", {
82
+ children: [/* @__PURE__ */ h("h1", {
83
83
  className: "text-base sm:text-lg font-semibold truncate",
84
84
  children: [
85
- A?.name || x("stepEditor.tourFallback"),
85
+ j?.name || x("stepEditor.tourFallback"),
86
86
  " - ",
87
87
  x("stepEditor.stepsLabel")
88
88
  ]
89
- }), /* @__PURE__ */ v("p", {
90
- className: "text-xs sm:text-sm text-muted-foreground",
89
+ }), /* @__PURE__ */ h("p", {
90
+ className: "text-xs sm:text-sm text-text-secondary",
91
91
  children: [
92
- P.length,
92
+ F.length,
93
93
  " ",
94
94
  x("stepEditor.stepsCount")
95
95
  ]
96
96
  })]
97
97
  })]
98
- }), /* @__PURE__ */ v("div", {
98
+ }), /* @__PURE__ */ h("div", {
99
99
  className: "flex items-center gap-2 sm:gap-3 ml-auto",
100
100
  children: [
101
- K && /* @__PURE__ */ v("button", {
101
+ q && /* @__PURE__ */ h("button", {
102
102
  type: "button",
103
- onClick: () => G(!W),
104
- className: "px-3 py-2 border border-border rounded-md hover:bg-accent flex items-center gap-2 sm:hidden",
103
+ onClick: () => K(!G),
104
+ className: "px-3 py-2 border border-border-subtle rounded-md hover:bg-accent flex items-center gap-2 sm:hidden",
105
105
  children: [
106
- /* @__PURE__ */ _(m, { size: 18 }),
107
- /* @__PURE__ */ _("span", {
106
+ /* @__PURE__ */ m(f, { size: 18 }),
107
+ /* @__PURE__ */ m("span", {
108
108
  className: "text-sm",
109
109
  children: x("stepEditor.steps")
110
110
  }),
111
- P.length > 0 && /* @__PURE__ */ _("span", {
112
- className: "px-1.5 py-0.5 text-xs bg-primary/20 rounded-full",
113
- children: P.length
111
+ F.length > 0 && /* @__PURE__ */ m("span", {
112
+ className: "px-1.5 py-0.5 text-xs bg-action-primary-bg/20 rounded-full",
113
+ children: F.length
114
114
  })
115
115
  ]
116
116
  }),
117
- D && /* @__PURE__ */ v("button", {
117
+ O && /* @__PURE__ */ h("button", {
118
118
  type: "button",
119
119
  onClick: Q,
120
- className: "px-3 sm:px-4 py-2 border border-border rounded-md hover:bg-accent flex items-center gap-2 text-sm sm:text-base",
121
- children: [/* @__PURE__ */ _(g, { size: 18 }), /* @__PURE__ */ _("span", {
120
+ className: "px-3 sm:px-4 py-2 border border-border-subtle rounded-md hover:bg-accent flex items-center gap-2 text-sm sm:text-base",
121
+ children: [/* @__PURE__ */ m(p, { size: 18 }), /* @__PURE__ */ m("span", {
122
122
  className: "hidden xs:inline",
123
123
  children: x("stepEditor.addStep")
124
124
  })]
125
125
  }),
126
- /* @__PURE__ */ _(te, {
126
+ /* @__PURE__ */ m(ne, {
127
127
  permission: n.TOUR_STEP_UPDATE,
128
- children: /* @__PURE__ */ v("button", {
128
+ children: /* @__PURE__ */ h(_, {
129
129
  type: "button",
130
- onClick: fe,
131
- disabled: N || !O,
132
- className: "px-3 sm:px-4 py-2 bg-primary text-primary-foreground rounded-md hover:bg-primary/90 disabled:opacity-50 flex items-center gap-2 text-sm sm:text-base",
133
- children: [/* @__PURE__ */ _(ne, { size: 18 }), /* @__PURE__ */ _("span", {
130
+ onClick: me,
131
+ disabled: P || !k,
132
+ className: "min-h-[44px] text-sm sm:text-base",
133
+ children: [/* @__PURE__ */ m(ae, { size: 18 }), /* @__PURE__ */ m("span", {
134
134
  className: "hidden xs:inline",
135
- children: x(N ? "stepEditor.saving" : "stepEditor.save")
135
+ children: x(P ? "stepEditor.saving" : "stepEditor.save")
136
136
  })]
137
137
  })
138
138
  })
139
139
  ]
140
140
  })]
141
- }), /* @__PURE__ */ v("div", {
141
+ }), /* @__PURE__ */ h("div", {
142
142
  className: "flex-1 flex overflow-hidden relative",
143
143
  children: [
144
- K && W && /* @__PURE__ */ _("button", {
144
+ q && G && /* @__PURE__ */ m("button", {
145
145
  type: "button",
146
146
  "aria-label": x("stepEditor.closeSteps"),
147
147
  className: "fixed inset-0 bg-foreground/40 z-40 md:hidden",
148
- onClick: () => G(!1)
148
+ onClick: () => K(!1)
149
149
  }),
150
- /* @__PURE__ */ v("div", {
150
+ /* @__PURE__ */ h("div", {
151
151
  className: `
152
- ${K ? "fixed inset-y-0 left-0 z-50 w-[min(18rem,calc(100vw-2rem))] transform transition-transform duration-300" : "w-64 lg:w-80 shrink-0"}
153
- ${K && !W ? "-translate-x-full" : "translate-x-0"}
154
- border-r border-border overflow-y-auto bg-card
152
+ ${q ? "fixed inset-y-0 left-0 z-50 w-[min(18rem,calc(100vw-2rem))] transform transition-transform duration-300" : "w-64 lg:w-80 shrink-0"}
153
+ ${q && !G ? "-translate-x-full" : "translate-x-0"}
154
+ border-r border-border-subtle overflow-y-auto bg-bg-surface
155
155
  `,
156
- children: [K && /* @__PURE__ */ v("div", {
157
- className: "flex items-center justify-between p-4 border-b border-border sticky top-0 bg-card z-10",
158
- children: [/* @__PURE__ */ _("h2", {
156
+ children: [q && /* @__PURE__ */ h("div", {
157
+ className: "flex items-center justify-between p-4 border-b border-border-subtle sticky top-0 bg-bg-surface z-10",
158
+ children: [/* @__PURE__ */ m("h2", {
159
159
  className: "font-semibold",
160
160
  children: x("stepEditor.tourSteps")
161
- }), /* @__PURE__ */ _("button", {
161
+ }), /* @__PURE__ */ m("button", {
162
162
  type: "button",
163
- onClick: () => G(!1),
163
+ onClick: () => K(!1),
164
164
  className: "p-2 min-h-[44px] min-w-[44px] hover:bg-accent rounded-md",
165
165
  "aria-label": x("stepEditor.closeSteps"),
166
- children: /* @__PURE__ */ _(ie, { size: 20 })
166
+ children: /* @__PURE__ */ m(se, { size: 20 })
167
167
  })]
168
- }), /* @__PURE__ */ _("div", {
168
+ }), /* @__PURE__ */ m("div", {
169
169
  className: "p-3 sm:p-4 space-y-2",
170
- children: P.length === 0 ? /* @__PURE__ */ v("div", {
171
- className: "text-center py-8 text-muted-foreground",
172
- children: [/* @__PURE__ */ _("p", {
170
+ children: F.length === 0 ? /* @__PURE__ */ h("div", {
171
+ className: "text-center py-8 text-text-secondary",
172
+ children: [/* @__PURE__ */ m("p", {
173
173
  className: "text-sm",
174
174
  children: x("stepEditor.noStepsYet")
175
- }), /* @__PURE__ */ _("p", {
175
+ }), /* @__PURE__ */ m("p", {
176
176
  className: "text-xs mt-1",
177
177
  children: x("stepEditor.clickAddStep")
178
178
  })]
179
- }) : P.map((e, t) => /* @__PURE__ */ _("div", {
179
+ }) : F.map((e, t) => /* @__PURE__ */ m("div", {
180
180
  role: "button",
181
181
  tabIndex: 0,
182
182
  onClick: () => $(e),
183
183
  onKeyDown: (t) => {
184
184
  (t.key === "Enter" || t.key === " ") && (t.preventDefault(), $(e));
185
185
  },
186
- className: `p-3 border rounded-md cursor-pointer transition-colors ${F?.id === e.id ? "border-primary bg-primary/10" : "border-border hover:bg-accent"}`,
187
- children: /* @__PURE__ */ v("div", {
186
+ className: `p-3 border rounded-md cursor-pointer transition-colors ${I?.id === e.id ? "border-primary bg-action-primary-bg/10 shadow-[var(--shadow-pop)]" : "border-border-seam hover:bg-accent"}`,
187
+ children: /* @__PURE__ */ h("div", {
188
188
  className: "flex items-start justify-between gap-2",
189
- children: [/* @__PURE__ */ v("div", {
189
+ children: [/* @__PURE__ */ h("div", {
190
190
  className: "flex-1 min-w-0",
191
191
  children: [
192
- /* @__PURE__ */ v("div", {
193
- className: "text-xs text-muted-foreground mb-1",
192
+ /* @__PURE__ */ h("div", {
193
+ className: "text-xs text-text-secondary mb-1",
194
194
  children: [
195
195
  x("stepEditor.stepNumber"),
196
196
  " ",
197
197
  t + 1
198
198
  ]
199
199
  }),
200
- /* @__PURE__ */ _("div", {
200
+ /* @__PURE__ */ m("div", {
201
201
  className: "font-medium text-sm truncate",
202
202
  children: e.title || x("stepEditor.untitled")
203
203
  }),
204
- e.targetSelector && /* @__PURE__ */ _("div", {
205
- className: "text-xs text-muted-foreground mt-1 truncate font-mono",
204
+ e.targetSelector && /* @__PURE__ */ m("div", {
205
+ className: "text-xs text-text-secondary mt-1 truncate font-mono",
206
206
  children: e.targetSelector
207
207
  })
208
208
  ]
209
- }), k && /* @__PURE__ */ v("div", {
209
+ }), A && /* @__PURE__ */ h("div", {
210
210
  className: "flex items-center gap-1 shrink-0",
211
211
  children: [
212
- /* @__PURE__ */ _("button", {
212
+ /* @__PURE__ */ m("button", {
213
213
  type: "button",
214
214
  onClick: (e) => {
215
- e.stopPropagation(), t > 0 && B(t, t - 1);
215
+ e.stopPropagation(), t > 0 && V(t, t - 1);
216
216
  },
217
217
  className: "p-1.5 sm:p-2 min-h-[32px] min-w-[32px] sm:min-h-[40px] sm:min-w-[40px] hover:bg-accent rounded",
218
218
  title: "Move step up",
219
219
  "aria-label": "Move step up",
220
220
  disabled: t === 0,
221
- children: /* @__PURE__ */ _(p, { size: 14 })
221
+ children: /* @__PURE__ */ m(d, { size: 14 })
222
222
  }),
223
- /* @__PURE__ */ _("button", {
223
+ /* @__PURE__ */ m("button", {
224
224
  type: "button",
225
225
  onClick: (e) => {
226
- e.stopPropagation(), t < P.length - 1 && B(t, t + 1);
226
+ e.stopPropagation(), t < F.length - 1 && V(t, t + 1);
227
227
  },
228
228
  className: "p-1.5 sm:p-2 min-h-[32px] min-w-[32px] sm:min-h-[40px] sm:min-w-[40px] hover:bg-accent rounded",
229
229
  title: "Move step down",
230
230
  "aria-label": "Move step down",
231
- disabled: t === P.length - 1,
232
- children: /* @__PURE__ */ _(u, { size: 14 })
231
+ disabled: t === F.length - 1,
232
+ children: /* @__PURE__ */ m(c, { size: 14 })
233
233
  }),
234
- /* @__PURE__ */ _("button", {
234
+ /* @__PURE__ */ m("button", {
235
235
  type: "button",
236
236
  onClick: (t) => {
237
- t.stopPropagation(), R(e.id);
237
+ t.stopPropagation(), z(e.id);
238
238
  },
239
- className: "p-1.5 sm:p-2 min-h-[32px] min-w-[32px] sm:min-h-[40px] sm:min-w-[40px] hover:bg-destructive/10 rounded text-destructive",
239
+ className: "p-1.5 sm:p-2 min-h-[32px] min-w-[32px] sm:min-h-[40px] sm:min-w-[40px] hover:bg-status-error-bg/10 rounded text-status-error-text",
240
240
  title: x("stepEditor.deleteStep"),
241
241
  "aria-label": x("stepEditor.deleteStep"),
242
- children: /* @__PURE__ */ _(re, { size: 14 })
242
+ children: /* @__PURE__ */ m(oe, { size: 14 })
243
243
  })
244
244
  ]
245
245
  })]
@@ -247,89 +247,89 @@ function x() {
247
247
  }, e.id))
248
248
  })]
249
249
  }),
250
- /* @__PURE__ */ _("div", {
250
+ /* @__PURE__ */ m("div", {
251
251
  className: "flex-1 overflow-y-auto p-4 sm:p-6",
252
- children: F ? /* @__PURE__ */ v("div", {
252
+ children: I ? /* @__PURE__ */ h("div", {
253
253
  className: "max-w-2xl mx-auto space-y-4 sm:space-y-6",
254
254
  children: [
255
- K && P.length > 1 && /* @__PURE__ */ v("div", {
256
- className: "flex items-center justify-between bg-muted/50 rounded-lg p-2 mb-4",
255
+ q && F.length > 1 && /* @__PURE__ */ h("div", {
256
+ className: "flex items-center justify-between bg-bg-sunken/50 rounded-lg p-2 mb-4",
257
257
  children: [
258
- /* @__PURE__ */ _("button", {
258
+ /* @__PURE__ */ m("button", {
259
259
  type: "button",
260
260
  onClick: () => {
261
- let e = P.findIndex((e) => e.id === F.id);
262
- e > 0 && I(P[e - 1]);
261
+ let e = F.findIndex((e) => e.id === I.id);
262
+ e > 0 && L(F[e - 1]);
263
263
  },
264
- disabled: P.findIndex((e) => e.id === F.id) === 0,
264
+ disabled: F.findIndex((e) => e.id === I.id) === 0,
265
265
  className: "p-2 min-h-[44px] min-w-[44px] hover:bg-accent rounded-md disabled:opacity-30",
266
266
  "aria-label": x("stepEditor.previousStep"),
267
- children: /* @__PURE__ */ _(d, { size: 20 })
267
+ children: /* @__PURE__ */ m(l, { size: 20 })
268
268
  }),
269
- /* @__PURE__ */ v("span", {
270
- className: "text-sm text-muted-foreground",
269
+ /* @__PURE__ */ h("span", {
270
+ className: "text-sm text-text-secondary",
271
271
  children: [
272
272
  x("stepEditor.stepNumber"),
273
273
  " ",
274
- P.findIndex((e) => e.id === F.id) + 1,
274
+ F.findIndex((e) => e.id === I.id) + 1,
275
275
  " ",
276
276
  x("stepEditor.of"),
277
277
  " ",
278
- P.length
278
+ F.length
279
279
  ]
280
280
  }),
281
- /* @__PURE__ */ _("button", {
281
+ /* @__PURE__ */ m("button", {
282
282
  type: "button",
283
283
  onClick: () => {
284
- let e = P.findIndex((e) => e.id === F.id);
285
- e < P.length - 1 && I(P[e + 1]);
284
+ let e = F.findIndex((e) => e.id === I.id);
285
+ e < F.length - 1 && L(F[e + 1]);
286
286
  },
287
- disabled: P.findIndex((e) => e.id === F.id) === P.length - 1,
287
+ disabled: F.findIndex((e) => e.id === I.id) === F.length - 1,
288
288
  className: "p-2 min-h-[44px] min-w-[44px] hover:bg-accent rounded-md disabled:opacity-30",
289
289
  "aria-label": x("stepEditor.nextStep"),
290
- children: /* @__PURE__ */ _(f, { size: 20 })
290
+ children: /* @__PURE__ */ m(u, { size: 20 })
291
291
  })
292
292
  ]
293
293
  }),
294
- /* @__PURE__ */ _("h2", {
294
+ /* @__PURE__ */ m("h2", {
295
295
  className: "text-lg sm:text-xl font-semibold",
296
296
  children: x("stepEditor.editStep")
297
297
  }),
298
- /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ v("label", {
298
+ /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ h("label", {
299
299
  className: "block text-sm font-medium mb-2",
300
300
  htmlFor: "step-editor-title",
301
301
  children: [x("stepEditor.stepTitle"), " *"]
302
- }), /* @__PURE__ */ _("input", {
302
+ }), /* @__PURE__ */ m("input", {
303
303
  id: "step-editor-title",
304
304
  type: "text",
305
- value: F.title,
306
- onChange: (e) => z(F.id, "title", e.target.value),
307
- className: "w-full px-3 py-2 border border-border rounded-md bg-background text-sm sm:text-base",
305
+ value: I.title,
306
+ onChange: (e) => B(I.id, "title", e.target.value),
307
+ className: "w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm sm:text-base",
308
308
  placeholder: x("stepEditor.stepTitlePlaceholder"),
309
309
  "aria-label": x("stepEditor.stepTitle")
310
310
  })] }),
311
- /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ v("label", {
311
+ /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ h("label", {
312
312
  className: "block text-sm font-medium mb-2",
313
313
  htmlFor: "step-editor-content",
314
314
  children: [x("stepEditor.content"), " *"]
315
- }), /* @__PURE__ */ _("textarea", {
315
+ }), /* @__PURE__ */ m("textarea", {
316
316
  id: "step-editor-content",
317
- value: F.content,
318
- onChange: (e) => z(F.id, "content", e.target.value),
317
+ value: I.content,
318
+ onChange: (e) => B(I.id, "content", e.target.value),
319
319
  rows: 4,
320
- className: "w-full px-3 py-2 border border-border rounded-md bg-background text-sm sm:text-base resize-y min-h-[100px]",
320
+ className: "w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm sm:text-base resize-y min-h-[100px]",
321
321
  placeholder: x("stepEditor.contentPlaceholder"),
322
322
  "aria-label": x("stepEditor.content")
323
323
  })] }),
324
- /* @__PURE__ */ v("div", { children: [
325
- /* @__PURE__ */ v("label", {
324
+ /* @__PURE__ */ h("div", { children: [
325
+ /* @__PURE__ */ h("label", {
326
326
  className: "block text-sm font-medium mb-2",
327
327
  htmlFor: "step-editor-css-selector",
328
328
  children: [
329
329
  x("stepEditor.cssSelector"),
330
330
  " *",
331
- /* @__PURE__ */ v("span", {
332
- className: "text-muted-foreground font-normal ml-2",
331
+ /* @__PURE__ */ h("span", {
332
+ className: "text-text-secondary font-normal ml-2",
333
333
  children: [
334
334
  "(",
335
335
  x("stepEditor.targetElement"),
@@ -338,242 +338,243 @@ function x() {
338
338
  })
339
339
  ]
340
340
  }),
341
- /* @__PURE__ */ _("input", {
341
+ /* @__PURE__ */ m("input", {
342
342
  id: "step-editor-css-selector",
343
343
  type: "text",
344
- value: F.targetSelector || "",
345
- onChange: (e) => z(F.id, "targetSelector", e.target.value),
344
+ value: I.targetSelector || "",
345
+ onChange: (e) => B(I.id, "targetSelector", e.target.value),
346
346
  placeholder: x("stepEditor.cssSelectorPlaceholder"),
347
- className: "w-full px-3 py-2 border border-border rounded-md bg-background font-mono text-sm",
347
+ className: "w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface font-mono text-sm",
348
348
  "aria-label": "{tr('stepEditor.cssSelector')} *\n \n ({tr('stepEditor.targetElement')})"
349
349
  }),
350
- /* @__PURE__ */ _("p", {
351
- className: "text-xs text-muted-foreground mt-1",
350
+ /* @__PURE__ */ m("p", {
351
+ className: "text-xs text-text-secondary mt-1",
352
352
  children: x("stepEditor.dataTourHint")
353
353
  })
354
354
  ] }),
355
- /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
355
+ /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("label", {
356
356
  className: "block text-sm font-medium mb-2",
357
357
  htmlFor: "step-editor-placement",
358
358
  children: x("stepEditor.tooltipPlacement")
359
- }), /* @__PURE__ */ v("select", {
359
+ }), /* @__PURE__ */ h("select", {
360
360
  id: "step-editor-placement",
361
- value: F.placement,
362
- onChange: (e) => z(F.id, "placement", e.target.value),
363
- className: "w-full px-3 py-2 border border-border rounded-md bg-background text-sm sm:text-base",
361
+ value: I.placement,
362
+ onChange: (e) => B(I.id, "placement", e.target.value),
363
+ className: "w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm sm:text-base",
364
364
  "aria-label": x("stepEditor.tooltipPlacement"),
365
365
  children: [
366
- /* @__PURE__ */ _("option", {
366
+ /* @__PURE__ */ m("option", {
367
367
  value: "AUTO",
368
368
  children: x("stepEditor.placementAuto")
369
369
  }),
370
- /* @__PURE__ */ _("option", {
370
+ /* @__PURE__ */ m("option", {
371
371
  value: "TOP",
372
372
  children: x("stepEditor.placementTop")
373
373
  }),
374
- /* @__PURE__ */ _("option", {
374
+ /* @__PURE__ */ m("option", {
375
375
  value: "BOTTOM",
376
376
  children: x("stepEditor.placementBottom")
377
377
  }),
378
- /* @__PURE__ */ _("option", {
378
+ /* @__PURE__ */ m("option", {
379
379
  value: "LEFT",
380
380
  children: x("stepEditor.placementLeft")
381
381
  }),
382
- /* @__PURE__ */ _("option", {
382
+ /* @__PURE__ */ m("option", {
383
383
  value: "RIGHT",
384
384
  children: x("stepEditor.placementRight")
385
385
  }),
386
- /* @__PURE__ */ _("option", {
386
+ /* @__PURE__ */ m("option", {
387
387
  value: "CENTER",
388
388
  children: x("stepEditor.placementCenter")
389
389
  })
390
390
  ]
391
391
  })] }),
392
- /* @__PURE__ */ v("details", {
393
- className: "border border-border rounded-md",
394
- children: [/* @__PURE__ */ _("summary", {
392
+ /* @__PURE__ */ h("details", {
393
+ className: "border border-border-subtle rounded-md",
394
+ children: [/* @__PURE__ */ m("summary", {
395
395
  className: "px-4 py-3 cursor-pointer font-medium text-sm hover:bg-accent/50 rounded-t-md",
396
396
  children: x("stepEditor.deviceSpecificSelectors")
397
- }), /* @__PURE__ */ v("div", {
398
- className: "p-4 pt-0 space-y-3 border-t border-border",
397
+ }), /* @__PURE__ */ h("div", {
398
+ className: "p-4 pt-0 space-y-3 border-t border-border-subtle",
399
399
  children: [
400
- /* @__PURE__ */ _("p", {
401
- className: "text-xs text-muted-foreground mb-3",
400
+ /* @__PURE__ */ m("p", {
401
+ className: "text-xs text-text-secondary mb-3",
402
402
  children: x("stepEditor.deviceSelectorHint")
403
403
  }),
404
- /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
404
+ /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("label", {
405
405
  className: "block text-xs font-medium mb-1",
406
406
  htmlFor: "step-editor-mobile-selector",
407
407
  children: x("stepEditor.mobileSelector")
408
- }), /* @__PURE__ */ _("input", {
408
+ }), /* @__PURE__ */ m("input", {
409
409
  id: "step-editor-mobile-selector",
410
410
  type: "text",
411
- value: F.targetSelectorMobile || "",
412
- onChange: (e) => z(F.id, "targetSelectorMobile", e.target.value),
411
+ value: I.targetSelectorMobile || "",
412
+ onChange: (e) => B(I.id, "targetSelectorMobile", e.target.value),
413
413
  placeholder: x("stepEditor.leaveEmptyDefault"),
414
- className: "w-full px-3 py-2 border border-border rounded-md bg-background text-sm font-mono",
414
+ className: "w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm font-mono",
415
415
  "aria-label": x("stepEditor.mobileSelector")
416
416
  })] }),
417
- /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
417
+ /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("label", {
418
418
  className: "block text-xs font-medium mb-1",
419
419
  htmlFor: "step-editor-tablet-selector",
420
420
  children: x("stepEditor.tabletSelector")
421
- }), /* @__PURE__ */ _("input", {
421
+ }), /* @__PURE__ */ m("input", {
422
422
  id: "step-editor-tablet-selector",
423
423
  type: "text",
424
- value: F.targetSelectorTablet || "",
425
- onChange: (e) => z(F.id, "targetSelectorTablet", e.target.value),
424
+ value: I.targetSelectorTablet || "",
425
+ onChange: (e) => B(I.id, "targetSelectorTablet", e.target.value),
426
426
  placeholder: x("stepEditor.leaveEmptyDefault"),
427
- className: "w-full px-3 py-2 border border-border rounded-md bg-background text-sm font-mono",
427
+ className: "w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm font-mono",
428
428
  "aria-label": x("stepEditor.tabletSelector")
429
429
  })] }),
430
- /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
430
+ /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("label", {
431
431
  className: "block text-xs font-medium mb-1",
432
432
  htmlFor: "step-editor-desktop-selector",
433
433
  children: x("stepEditor.desktopSelector")
434
- }), /* @__PURE__ */ _("input", {
434
+ }), /* @__PURE__ */ m("input", {
435
435
  id: "step-editor-desktop-selector",
436
436
  type: "text",
437
- value: F.targetSelectorDesktop || "",
438
- onChange: (e) => z(F.id, "targetSelectorDesktop", e.target.value),
437
+ value: I.targetSelectorDesktop || "",
438
+ onChange: (e) => B(I.id, "targetSelectorDesktop", e.target.value),
439
439
  placeholder: x("stepEditor.leaveEmptyDefault"),
440
- className: "w-full px-3 py-2 border border-border rounded-md bg-background text-sm font-mono",
440
+ className: "w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm font-mono",
441
441
  "aria-label": x("stepEditor.desktopSelector")
442
442
  })] })
443
443
  ]
444
444
  })]
445
445
  }),
446
- /* @__PURE__ */ v("div", {
446
+ /* @__PURE__ */ h("div", {
447
447
  className: "grid grid-cols-1 gap-4 sm:grid-cols-2",
448
- children: [/* @__PURE__ */ v("label", {
449
- className: "flex items-center gap-3 cursor-pointer rounded-md border border-border p-3",
450
- children: [/* @__PURE__ */ _("input", {
448
+ children: [/* @__PURE__ */ h("label", {
449
+ className: "flex items-center gap-3 cursor-pointer rounded-md border border-border-subtle p-3",
450
+ children: [/* @__PURE__ */ m("input", {
451
451
  type: "checkbox",
452
- checked: F.requireInteraction ?? !1,
453
- onChange: (e) => z(F.id, "requireInteraction", e.target.checked),
452
+ checked: I.requireInteraction ?? !1,
453
+ onChange: (e) => B(I.id, "requireInteraction", e.target.checked),
454
454
  className: "size-4 rounded",
455
455
  "aria-label": "Require interaction"
456
- }), /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("div", {
456
+ }), /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("div", {
457
457
  className: "text-sm font-medium",
458
458
  children: "Require interaction"
459
- }), /* @__PURE__ */ _("div", {
460
- className: "text-xs text-muted-foreground",
459
+ }), /* @__PURE__ */ m("div", {
460
+ className: "text-xs text-text-secondary",
461
461
  children: "User must interact with the highlighted element before advancing."
462
462
  })] })]
463
- }), /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
463
+ }), /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("label", {
464
464
  className: "block text-sm font-medium mb-2",
465
465
  htmlFor: "step-editor-wait-timeout",
466
466
  children: "Wait for timeout (ms)"
467
- }), /* @__PURE__ */ _("input", {
467
+ }), /* @__PURE__ */ m("input", {
468
468
  id: "step-editor-wait-timeout",
469
469
  type: "number",
470
470
  min: "0",
471
- value: F.waitForTimeout ?? "",
472
- onChange: (e) => z(F.id, "waitForTimeout", e.target.value ? Number(e.target.value) : void 0),
473
- className: "w-full px-3 py-2 border border-border rounded-md bg-background text-sm",
471
+ value: I.waitForTimeout ?? "",
472
+ onChange: (e) => B(I.id, "waitForTimeout", e.target.value ? Number(e.target.value) : void 0),
473
+ className: "w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm",
474
474
  placeholder: "1500",
475
475
  "aria-label": "Wait for timeout (ms)"
476
476
  })] })]
477
477
  }),
478
- /* @__PURE__ */ v(b, {
478
+ /* @__PURE__ */ h(y, {
479
479
  title: "Advanced settings",
480
480
  description: "Step-timing waits, skip conditions, and analytics tags.",
481
- children: [/* @__PURE__ */ v("div", {
481
+ children: [/* @__PURE__ */ h("div", {
482
482
  className: "grid grid-cols-1 gap-4 sm:grid-cols-2",
483
- children: [/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
483
+ children: [/* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("label", {
484
484
  className: "block text-sm font-medium mb-2",
485
485
  htmlFor: "step-editor-wait-selector",
486
486
  children: "Wait for selector"
487
- }), /* @__PURE__ */ _("input", {
487
+ }), /* @__PURE__ */ m("input", {
488
488
  id: "step-editor-wait-selector",
489
489
  type: "text",
490
- value: F.waitForSelector || "",
491
- onChange: (e) => z(F.id, "waitForSelector", e.target.value || void 0),
492
- className: "w-full px-3 py-2 border border-border rounded-md bg-background text-sm font-mono",
490
+ value: I.waitForSelector || "",
491
+ onChange: (e) => B(I.id, "waitForSelector", e.target.value || void 0),
492
+ className: "w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm font-mono",
493
493
  placeholder: "[data-tour='agents-tabs']",
494
494
  "aria-label": "Wait for selector"
495
- })] }), /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
495
+ })] }), /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("label", {
496
496
  className: "block text-sm font-medium mb-2",
497
497
  htmlFor: "step-editor-wait-event",
498
498
  children: "Wait for event"
499
- }), /* @__PURE__ */ _("input", {
499
+ }), /* @__PURE__ */ m("input", {
500
500
  id: "step-editor-wait-event",
501
501
  type: "text",
502
- value: F.waitForEvent || "",
503
- onChange: (e) => z(F.id, "waitForEvent", e.target.value || void 0),
504
- className: "w-full px-3 py-2 border border-border rounded-md bg-background text-sm",
502
+ value: I.waitForEvent || "",
503
+ onChange: (e) => B(I.id, "waitForEvent", e.target.value || void 0),
504
+ className: "w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm",
505
505
  placeholder: "tour:ready",
506
506
  "aria-label": "Wait for event"
507
507
  })] })]
508
- }), /* @__PURE__ */ v("div", {
508
+ }), /* @__PURE__ */ h("div", {
509
509
  className: "mt-4",
510
- children: [/* @__PURE__ */ _("label", {
510
+ children: [/* @__PURE__ */ m("label", {
511
511
  className: "block text-sm font-medium mb-2",
512
512
  htmlFor: "step-editor-skip-conditions",
513
513
  children: "Skip conditions (JSON)"
514
- }), /* @__PURE__ */ _("textarea", {
514
+ }), /* @__PURE__ */ m("textarea", {
515
515
  id: "step-editor-skip-conditions",
516
- value: F.skipConditions ? JSON.stringify(F.skipConditions, null, 2) : "",
516
+ value: I.skipConditions ? JSON.stringify(I.skipConditions, null, 2) : "",
517
517
  onChange: (e) => {
518
518
  let t = e.target.value.trim();
519
519
  if (!t) {
520
- z(F.id, "skipConditions", void 0);
520
+ B(I.id, "skipConditions", void 0);
521
521
  return;
522
522
  }
523
523
  try {
524
- z(F.id, "skipConditions", JSON.parse(t));
524
+ B(I.id, "skipConditions", JSON.parse(t));
525
525
  } catch {
526
- z(F.id, "skipConditions", t);
526
+ B(I.id, "skipConditions", t);
527
527
  }
528
528
  },
529
529
  rows: 4,
530
- className: "w-full px-3 py-2 border border-border rounded-md bg-background text-sm font-mono",
530
+ className: "w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm font-mono",
531
531
  placeholder: "{\"selectorMissing\":\"[data-tour=\\\"missing\\\"]\"}",
532
532
  "aria-label": "Skip conditions (JSON)"
533
533
  })]
534
534
  })]
535
535
  }),
536
- /* @__PURE__ */ v("div", {
537
- className: "border border-border rounded-md p-4 space-y-4",
536
+ /* @__PURE__ */ h(v, {
537
+ treatment: "plain",
538
+ className: "p-4 space-y-4 border-border-seam",
538
539
  children: [
539
- /* @__PURE__ */ v("div", {
540
+ /* @__PURE__ */ h("div", {
540
541
  className: "flex items-center gap-2",
541
- children: [/* @__PURE__ */ _(h, { size: 18 }), /* @__PURE__ */ _("h3", {
542
+ children: [/* @__PURE__ */ m(ie, { size: 18 }), /* @__PURE__ */ m("h3", {
542
543
  className: "text-sm font-semibold",
543
544
  children: "Step media"
544
545
  })]
545
546
  }),
546
- F.media && F.media.length > 0 ? /* @__PURE__ */ _("div", {
547
+ I.media && I.media.length > 0 ? /* @__PURE__ */ m("div", {
547
548
  className: "space-y-2",
548
- children: F.media.map((e) => /* @__PURE__ */ v("div", {
549
- className: "flex items-center justify-between rounded-md border border-border p-2 text-sm",
550
- children: [/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("div", {
549
+ children: I.media.map((e) => /* @__PURE__ */ h("div", {
550
+ className: "flex items-center justify-between rounded-md border border-border-subtle p-2 text-sm",
551
+ children: [/* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("div", {
551
552
  className: "font-medium",
552
553
  children: e.media.name
553
- }), /* @__PURE__ */ _("div", {
554
- className: "text-xs text-muted-foreground",
554
+ }), /* @__PURE__ */ m("div", {
555
+ className: "text-xs text-text-secondary",
555
556
  children: e.position
556
- })] }), /* @__PURE__ */ _("span", {
557
- className: "text-xs text-muted-foreground",
557
+ })] }), /* @__PURE__ */ m("span", {
558
+ className: "text-xs text-text-secondary",
558
559
  children: e.media.type
559
560
  })]
560
561
  }, e.id))
561
- }) : /* @__PURE__ */ _("p", {
562
- className: "text-sm text-muted-foreground",
562
+ }) : /* @__PURE__ */ m("p", {
563
+ className: "text-sm text-text-secondary",
563
564
  children: "No media attached to this step yet."
564
565
  }),
565
- /* @__PURE__ */ v("div", {
566
+ /* @__PURE__ */ h("div", {
566
567
  className: "grid grid-cols-1 gap-3 sm:grid-cols-[minmax(0,1fr)_160px_auto]",
567
568
  children: [
568
- /* @__PURE__ */ v("select", {
569
+ /* @__PURE__ */ h("select", {
569
570
  value: J,
570
571
  onChange: (e) => Y(e.target.value),
571
- className: "w-full px-3 py-2 border border-border rounded-md bg-background text-sm",
572
+ className: "w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm",
572
573
  "aria-label": "Select media to attach",
573
- children: [/* @__PURE__ */ _("option", {
574
+ children: [/* @__PURE__ */ m("option", {
574
575
  value: "",
575
- children: U ? "Loading media..." : "Select uploaded media"
576
- }), le.map((e) => /* @__PURE__ */ v("option", {
576
+ children: ue ? "Loading media..." : "Select uploaded media"
577
+ }), H.map((e) => /* @__PURE__ */ h("option", {
577
578
  value: e.id,
578
579
  children: [
579
580
  e.name,
@@ -583,31 +584,31 @@ function x() {
583
584
  ]
584
585
  }, e.id))]
585
586
  }),
586
- /* @__PURE__ */ v("select", {
587
+ /* @__PURE__ */ h("select", {
587
588
  value: X,
588
- onChange: (e) => ue(e.target.value),
589
- className: "w-full px-3 py-2 border border-border rounded-md bg-background text-sm",
589
+ onChange: (e) => fe(e.target.value),
590
+ className: "w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm",
590
591
  "aria-label": "Attachment position",
591
592
  children: [
592
- /* @__PURE__ */ _("option", {
593
+ /* @__PURE__ */ m("option", {
593
594
  value: "header",
594
595
  children: "Header"
595
596
  }),
596
- /* @__PURE__ */ _("option", {
597
+ /* @__PURE__ */ m("option", {
597
598
  value: "body",
598
599
  children: "Body"
599
600
  }),
600
- /* @__PURE__ */ _("option", {
601
+ /* @__PURE__ */ m("option", {
601
602
  value: "footer",
602
603
  children: "Footer"
603
604
  })
604
605
  ]
605
606
  }),
606
- /* @__PURE__ */ _("button", {
607
+ /* @__PURE__ */ m("button", {
607
608
  type: "button",
608
- onClick: me,
609
- disabled: de || !J,
610
- className: "px-4 py-2 min-h-[44px] border border-border rounded-md hover:bg-accent disabled:opacity-50",
609
+ onClick: ge,
610
+ disabled: pe || !J,
611
+ className: "px-4 py-2 min-h-[44px] border border-border-subtle rounded-md hover:bg-accent disabled:opacity-50",
611
612
  children: "Attach"
612
613
  })
613
614
  ]
@@ -615,29 +616,29 @@ function x() {
615
616
  ]
616
617
  })
617
618
  ]
618
- }) : /* @__PURE__ */ v("div", {
619
+ }) : /* @__PURE__ */ h("div", {
619
620
  className: "flex flex-col items-center justify-center h-full text-center px-4",
620
621
  children: [
621
- /* @__PURE__ */ _("div", {
622
- className: "size-16 bg-muted rounded-full flex items-center justify-center mb-4",
623
- children: /* @__PURE__ */ _(g, {
622
+ /* @__PURE__ */ m("div", {
623
+ className: "size-16 bg-bg-sunken rounded-full flex items-center justify-center mb-4",
624
+ children: /* @__PURE__ */ m(p, {
624
625
  size: 24,
625
- className: "text-muted-foreground"
626
+ className: "text-text-secondary"
626
627
  })
627
628
  }),
628
- /* @__PURE__ */ _("p", {
629
- className: "text-muted-foreground mb-2",
629
+ /* @__PURE__ */ m("p", {
630
+ className: "text-text-secondary mb-2",
630
631
  children: x("stepEditor.noStepSelected")
631
632
  }),
632
- /* @__PURE__ */ _("p", {
633
- className: "text-sm text-muted-foreground mb-4",
634
- children: P.length > 0 ? x("stepEditor.selectStepToEdit") : x("stepEditor.createFirstStep")
633
+ /* @__PURE__ */ m("p", {
634
+ className: "text-sm text-text-secondary mb-4",
635
+ children: F.length > 0 ? x("stepEditor.selectStepToEdit") : x("stepEditor.createFirstStep")
635
636
  }),
636
- P.length === 0 && D && /* @__PURE__ */ v("button", {
637
+ F.length === 0 && O && /* @__PURE__ */ h("button", {
637
638
  type: "button",
638
639
  onClick: Q,
639
- className: "px-4 py-2 min-h-[44px] bg-primary text-primary-foreground rounded-md hover:bg-primary/90 flex items-center gap-2",
640
- children: [/* @__PURE__ */ _(g, { size: 18 }), x("stepEditor.addFirstStep")]
640
+ className: "px-4 py-2 min-h-[44px] bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg/90 flex items-center gap-2",
641
+ children: [/* @__PURE__ */ m(p, { size: 18 }), x("stepEditor.addFirstStep")]
641
642
  })
642
643
  ]
643
644
  })