@industry-theme/file-city-panel 0.3.4 → 0.3.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/components/TourPlayer.d.ts.map +1 -1
  2. package/dist/panels.bundle.js +252 -232
  3. package/dist/panels.bundle.js.map +1 -1
  4. package/package.json +1 -1
package/dist/components/TourPlayer.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"TourPlayer.d.ts","sourceRoot":"","sources":["../../src/components/TourPlayer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmD,MAAM,OAAO,CAAC;AAiBxE,OAAO,KAAK,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AAC9F,OAAO,KAAK,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAGnF,MAAM,WAAW,eAAe;IAC9B,oCAAoC;IACpC,IAAI,EAAE,gBAAgB,CAAC;IAEvB,2CAA2C;IAC3C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B,iCAAiC;IACjC,YAAY,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAEvE,+BAA+B;IAC/B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IAEpB,uDAAuD;IACvD,mBAAmB,CAAC,EAAE,CAAC,MAAM,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,MAAM,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAE1E,yCAAyC;IACzC,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,qIAAqI;IACrI,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,CAAC;IAE3D,wDAAwD;IACxD,WAAW,CAAC,EAAE,OAAO,CAAC;IAGtB,+CAA+C;IAC/C,UAAU,CAAC,EAAE,mBAAmB,CAAC;IAEjC,2EAA2E;IAC3E,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IAEpC,yDAAyD;IACzD,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB,iEAAiE;IACjE,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAEhC,yEAAyE;IACzE,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED;;;;;GAKG;AACH,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA4+BhD,CAAC"}
1
+ {"version":3,"file":"TourPlayer.d.ts","sourceRoot":"","sources":["../../src/components/TourPlayer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmD,MAAM,OAAO,CAAC;AAiBxE,OAAO,KAAK,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AAC9F,OAAO,KAAK,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAGnF,MAAM,WAAW,eAAe;IAC9B,oCAAoC;IACpC,IAAI,EAAE,gBAAgB,CAAC;IAEvB,2CAA2C;IAC3C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B,iCAAiC;IACjC,YAAY,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAEvE,+BAA+B;IAC/B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IAEpB,uDAAuD;IACvD,mBAAmB,CAAC,EAAE,CAAC,MAAM,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,MAAM,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAE1E,yCAAyC;IACzC,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,qIAAqI;IACrI,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,CAAC;IAE3D,wDAAwD;IACxD,WAAW,CAAC,EAAE,OAAO,CAAC;IAGtB,+CAA+C;IAC/C,UAAU,CAAC,EAAE,mBAAmB,CAAC;IAEjC,2EAA2E;IAC3E,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IAEpC,yDAAyD;IACzD,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB,iEAAiE;IACjE,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAEhC,yEAAyE;IACzE,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED;;;;;GAKG;AACH,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAkgChD,CAAC"}
package/dist/panels.bundle.js CHANGED
@@ -51097,237 +51097,240 @@ const TourPlayer = ({
51097
51097
  };
51098
51098
  if (!isPlaying) {
51099
51099
  return renderWithContainer(
51100
- /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
51101
- "div",
51102
- {
51103
- style: {
51104
- flex: 1,
51105
- minHeight: 0,
51106
- overflow: "auto"
51107
- },
51108
- children: /* @__PURE__ */ jsxs("div", { style: { padding: "12px 16px" }, children: [
51109
- /* @__PURE__ */ jsxs("div", { style: { marginBottom: "16px" }, children: [
51110
- /* @__PURE__ */ jsxs(
51111
- "div",
51112
- {
51113
- style: {
51114
- display: "flex",
51115
- alignItems: "center",
51116
- gap: "8px",
51117
- marginBottom: "8px"
51118
- },
51119
- children: [
51120
- /* @__PURE__ */ jsx(BookOpen, { size: 24, style: { color: theme2.colors.primary } }),
51121
- /* @__PURE__ */ jsx(
51122
- "h2",
51123
- {
51124
- style: {
51125
- fontSize: theme2.fontSizes[4],
51126
- fontFamily: theme2.fonts.heading,
51127
- color: theme2.colors.text,
51128
- margin: 0
51129
- },
51130
- children: tour.title
51131
- }
51132
- )
51133
- ]
51134
- }
51135
- ),
51100
+ /* @__PURE__ */ jsxs(Fragment, { children: [
51101
+ /* @__PURE__ */ jsx(
51102
+ "div",
51103
+ {
51104
+ style: {
51105
+ flex: 1,
51106
+ minHeight: 0,
51107
+ overflow: "auto"
51108
+ },
51109
+ children: /* @__PURE__ */ jsxs("div", { style: { padding: "12px 16px" }, children: [
51110
+ /* @__PURE__ */ jsxs("div", { style: { marginBottom: "16px" }, children: [
51111
+ /* @__PURE__ */ jsxs(
51112
+ "div",
51113
+ {
51114
+ style: {
51115
+ display: "flex",
51116
+ alignItems: "center",
51117
+ gap: "8px",
51118
+ marginBottom: "8px"
51119
+ },
51120
+ children: [
51121
+ /* @__PURE__ */ jsx(BookOpen, { size: 24, style: { color: theme2.colors.primary } }),
51122
+ /* @__PURE__ */ jsx(
51123
+ "h2",
51124
+ {
51125
+ style: {
51126
+ fontSize: theme2.fontSizes[4],
51127
+ fontFamily: theme2.fonts.heading,
51128
+ color: theme2.colors.text,
51129
+ margin: 0
51130
+ },
51131
+ children: tour.title
51132
+ }
51133
+ )
51134
+ ]
51135
+ }
51136
+ ),
51137
+ /* @__PURE__ */ jsx(
51138
+ "p",
51139
+ {
51140
+ style: {
51141
+ fontSize: theme2.fontSizes[2],
51142
+ fontFamily: theme2.fonts.body,
51143
+ color: theme2.colors.textSecondary,
51144
+ margin: 0,
51145
+ marginBottom: "12px"
51146
+ },
51147
+ children: tour.description
51148
+ }
51149
+ ),
51150
+ /* @__PURE__ */ jsxs(
51151
+ "div",
51152
+ {
51153
+ style: {
51154
+ display: "flex",
51155
+ gap: "8px",
51156
+ flexWrap: "wrap"
51157
+ },
51158
+ children: [
51159
+ tour.audience && /* @__PURE__ */ jsx(
51160
+ "span",
51161
+ {
51162
+ style: {
51163
+ padding: "4px 8px",
51164
+ backgroundColor: theme2.colors.primary + "20",
51165
+ color: theme2.colors.primary,
51166
+ borderRadius: "4px",
51167
+ fontSize: theme2.fontSizes[1],
51168
+ fontFamily: theme2.fonts.body,
51169
+ fontWeight: 500
51170
+ },
51171
+ children: tour.audience
51172
+ }
51173
+ ),
51174
+ /* @__PURE__ */ jsxs(
51175
+ "span",
51176
+ {
51177
+ style: {
51178
+ padding: "4px 8px",
51179
+ backgroundColor: theme2.colors.accent + "20",
51180
+ color: theme2.colors.accent,
51181
+ borderRadius: "4px",
51182
+ fontSize: theme2.fontSizes[1],
51183
+ fontFamily: theme2.fonts.body,
51184
+ fontWeight: 500
51185
+ },
51186
+ children: [
51187
+ tour.steps.length,
51188
+ " steps"
51189
+ ]
51190
+ }
51191
+ )
51192
+ ]
51193
+ }
51194
+ )
51195
+ ] }),
51196
+ tour.prerequisites && tour.prerequisites.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
51197
+ /* @__PURE__ */ jsx(
51198
+ "div",
51199
+ {
51200
+ style: {
51201
+ fontSize: theme2.fontSizes[2],
51202
+ fontFamily: theme2.fonts.heading,
51203
+ color: theme2.colors.text,
51204
+ fontWeight: 600,
51205
+ marginBottom: "6px"
51206
+ },
51207
+ children: "Prerequisites:"
51208
+ }
51209
+ ),
51210
+ /* @__PURE__ */ jsx(
51211
+ "ul",
51212
+ {
51213
+ style: {
51214
+ margin: 0,
51215
+ paddingLeft: "20px",
51216
+ fontSize: theme2.fontSizes[1],
51217
+ fontFamily: theme2.fonts.body,
51218
+ color: theme2.colors.textSecondary
51219
+ },
51220
+ children: tour.prerequisites.map((prereq, idx) => /* @__PURE__ */ jsx("li", { children: prereq }, idx))
51221
+ }
51222
+ )
51223
+ ] })
51224
+ ] })
51225
+ }
51226
+ ),
51227
+ /* @__PURE__ */ jsxs(
51228
+ "div",
51229
+ {
51230
+ style: {
51231
+ padding: "12px 16px",
51232
+ borderTop: `1px solid ${theme2.colors.border}`,
51233
+ flexShrink: 0,
51234
+ display: "flex",
51235
+ justifyContent: "flex-end",
51236
+ gap: "12px"
51237
+ },
51238
+ children: [
51136
51239
  /* @__PURE__ */ jsx(
51137
- "p",
51240
+ "button",
51138
51241
  {
51242
+ onClick: handleExit,
51139
51243
  style: {
51244
+ padding: "8px 16px",
51245
+ backgroundColor: "transparent",
51246
+ color: theme2.colors.textSecondary,
51247
+ border: `1px solid ${theme2.colors.border}`,
51248
+ borderRadius: "6px",
51140
51249
  fontSize: theme2.fontSizes[2],
51141
51250
  fontFamily: theme2.fonts.body,
51142
- color: theme2.colors.textSecondary,
51143
- margin: 0,
51144
- marginBottom: "12px"
51251
+ cursor: "pointer",
51252
+ transition: "all 0.2s"
51253
+ },
51254
+ onMouseEnter: (e) => {
51255
+ e.currentTarget.style.borderColor = theme2.colors.text;
51256
+ e.currentTarget.style.color = theme2.colors.text;
51145
51257
  },
51146
- children: tour.description
51258
+ onMouseLeave: (e) => {
51259
+ e.currentTarget.style.borderColor = theme2.colors.border;
51260
+ e.currentTarget.style.color = theme2.colors.textSecondary;
51261
+ },
51262
+ children: "Cancel"
51147
51263
  }
51148
51264
  ),
51149
51265
  /* @__PURE__ */ jsxs(
51150
- "div",
51266
+ "button",
51151
51267
  {
51268
+ onClick: handleStart,
51152
51269
  style: {
51153
51270
  display: "flex",
51154
- gap: "8px",
51155
- flexWrap: "wrap"
51271
+ alignItems: "center",
51272
+ gap: "6px",
51273
+ padding: "8px 16px",
51274
+ backgroundColor: theme2.colors.primary,
51275
+ color: "#ffffff",
51276
+ border: "none",
51277
+ borderRadius: "6px",
51278
+ fontSize: theme2.fontSizes[2],
51279
+ fontFamily: theme2.fonts.body,
51280
+ fontWeight: 600,
51281
+ cursor: "pointer",
51282
+ transition: "all 0.2s"
51283
+ },
51284
+ onMouseEnter: (e) => {
51285
+ e.currentTarget.style.backgroundColor = theme2.colors.primary + "dd";
51286
+ },
51287
+ onMouseLeave: (e) => {
51288
+ e.currentTarget.style.backgroundColor = theme2.colors.primary;
51156
51289
  },
51157
51290
  children: [
51158
- tour.audience && /* @__PURE__ */ jsx(
51159
- "span",
51160
- {
51161
- style: {
51162
- padding: "4px 8px",
51163
- backgroundColor: theme2.colors.primary + "20",
51164
- color: theme2.colors.primary,
51165
- borderRadius: "4px",
51166
- fontSize: theme2.fontSizes[1],
51167
- fontFamily: theme2.fonts.body,
51168
- fontWeight: 500
51169
- },
51170
- children: tour.audience
51171
- }
51172
- ),
51173
- /* @__PURE__ */ jsxs(
51174
- "span",
51175
- {
51176
- style: {
51177
- padding: "4px 8px",
51178
- backgroundColor: theme2.colors.accent + "20",
51179
- color: theme2.colors.accent,
51180
- borderRadius: "4px",
51181
- fontSize: theme2.fontSizes[1],
51182
- fontFamily: theme2.fonts.body,
51183
- fontWeight: 500
51184
- },
51185
- children: [
51186
- tour.steps.length,
51187
- " steps"
51188
- ]
51189
- }
51190
- )
51291
+ /* @__PURE__ */ jsx(Play, { size: 16 }),
51292
+ "Start Tour"
51191
51293
  ]
51192
51294
  }
51193
- )
51194
- ] }),
51195
- tour.prerequisites && tour.prerequisites.length > 0 && /* @__PURE__ */ jsxs("div", { style: { marginBottom: "16px" }, children: [
51196
- /* @__PURE__ */ jsx(
51197
- "div",
51295
+ ),
51296
+ showTTSControls && canAutoPlay && /* @__PURE__ */ jsxs(
51297
+ "button",
51198
51298
  {
51299
+ onClick: () => {
51300
+ handleStart();
51301
+ setIsAutoPlaying(true);
51302
+ },
51199
51303
  style: {
51304
+ display: "flex",
51305
+ alignItems: "center",
51306
+ gap: "6px",
51307
+ padding: "8px 16px",
51308
+ backgroundColor: theme2.colors.accent,
51309
+ color: "#ffffff",
51310
+ border: "none",
51311
+ borderRadius: "6px",
51200
51312
  fontSize: theme2.fontSizes[2],
51201
- fontFamily: theme2.fonts.heading,
51202
- color: theme2.colors.text,
51313
+ fontFamily: theme2.fonts.body,
51203
51314
  fontWeight: 600,
51204
- marginBottom: "6px"
51315
+ cursor: "pointer",
51316
+ transition: "all 0.2s"
51205
51317
  },
51206
- children: "Prerequisites:"
51207
- }
51208
- ),
51209
- /* @__PURE__ */ jsx(
51210
- "ul",
51211
- {
51212
- style: {
51213
- margin: 0,
51214
- paddingLeft: "20px",
51215
- fontSize: theme2.fontSizes[1],
51216
- fontFamily: theme2.fonts.body,
51217
- color: theme2.colors.textSecondary
51318
+ onMouseEnter: (e) => {
51319
+ e.currentTarget.style.backgroundColor = theme2.colors.accent + "dd";
51218
51320
  },
51219
- children: tour.prerequisites.map((prereq, idx) => /* @__PURE__ */ jsx("li", { children: prereq }, idx))
51321
+ onMouseLeave: (e) => {
51322
+ e.currentTarget.style.backgroundColor = theme2.colors.accent;
51323
+ },
51324
+ children: [
51325
+ /* @__PURE__ */ jsx(Volume2, { size: 16 }),
51326
+ "Start with Auto-Play"
51327
+ ]
51220
51328
  }
51221
51329
  )
51222
- ] }),
51223
- /* @__PURE__ */ jsxs(
51224
- "div",
51225
- {
51226
- style: {
51227
- display: "flex",
51228
- justifyContent: "flex-end",
51229
- gap: "12px",
51230
- paddingTop: "12px",
51231
- borderTop: `1px solid ${theme2.colors.border}`
51232
- },
51233
- children: [
51234
- /* @__PURE__ */ jsx(
51235
- "button",
51236
- {
51237
- onClick: handleExit,
51238
- style: {
51239
- padding: "8px 16px",
51240
- backgroundColor: "transparent",
51241
- color: theme2.colors.textSecondary,
51242
- border: `1px solid ${theme2.colors.border}`,
51243
- borderRadius: "6px",
51244
- fontSize: theme2.fontSizes[2],
51245
- fontFamily: theme2.fonts.body,
51246
- cursor: "pointer",
51247
- transition: "all 0.2s"
51248
- },
51249
- onMouseEnter: (e) => {
51250
- e.currentTarget.style.borderColor = theme2.colors.text;
51251
- e.currentTarget.style.color = theme2.colors.text;
51252
- },
51253
- onMouseLeave: (e) => {
51254
- e.currentTarget.style.borderColor = theme2.colors.border;
51255
- e.currentTarget.style.color = theme2.colors.textSecondary;
51256
- },
51257
- children: "Cancel"
51258
- }
51259
- ),
51260
- /* @__PURE__ */ jsxs(
51261
- "button",
51262
- {
51263
- onClick: handleStart,
51264
- style: {
51265
- display: "flex",
51266
- alignItems: "center",
51267
- gap: "6px",
51268
- padding: "8px 16px",
51269
- backgroundColor: theme2.colors.primary,
51270
- color: "#ffffff",
51271
- border: "none",
51272
- borderRadius: "6px",
51273
- fontSize: theme2.fontSizes[2],
51274
- fontFamily: theme2.fonts.body,
51275
- fontWeight: 600,
51276
- cursor: "pointer",
51277
- transition: "all 0.2s"
51278
- },
51279
- onMouseEnter: (e) => {
51280
- e.currentTarget.style.backgroundColor = theme2.colors.primary + "dd";
51281
- },
51282
- onMouseLeave: (e) => {
51283
- e.currentTarget.style.backgroundColor = theme2.colors.primary;
51284
- },
51285
- children: [
51286
- /* @__PURE__ */ jsx(Play, { size: 16 }),
51287
- "Start Tour"
51288
- ]
51289
- }
51290
- ),
51291
- showTTSControls && canAutoPlay && /* @__PURE__ */ jsxs(
51292
- "button",
51293
- {
51294
- onClick: () => {
51295
- handleStart();
51296
- setIsAutoPlaying(true);
51297
- },
51298
- style: {
51299
- display: "flex",
51300
- alignItems: "center",
51301
- gap: "6px",
51302
- padding: "8px 16px",
51303
- backgroundColor: theme2.colors.accent,
51304
- color: "#ffffff",
51305
- border: "none",
51306
- borderRadius: "6px",
51307
- fontSize: theme2.fontSizes[2],
51308
- fontFamily: theme2.fonts.body,
51309
- fontWeight: 600,
51310
- cursor: "pointer",
51311
- transition: "all 0.2s"
51312
- },
51313
- onMouseEnter: (e) => {
51314
- e.currentTarget.style.backgroundColor = theme2.colors.accent + "dd";
51315
- },
51316
- onMouseLeave: (e) => {
51317
- e.currentTarget.style.backgroundColor = theme2.colors.accent;
51318
- },
51319
- children: [
51320
- /* @__PURE__ */ jsx(Volume2, { size: 16 }),
51321
- "Start with Auto-Play"
51322
- ]
51323
- }
51324
- )
51325
- ]
51326
- }
51327
- )
51328
- ] })
51329
- }
51330
- ) })
51330
+ ]
51331
+ }
51332
+ )
51333
+ ] })
51331
51334
  );
51332
51335
  }
51333
51336
  return renderWithContainer(
@@ -51756,7 +51759,7 @@ const TourPlayer = ({
51756
51759
  display: "flex",
51757
51760
  alignItems: "center",
51758
51761
  gap: "6px",
51759
- padding: "10px 20px",
51762
+ padding: position === "top" ? "10px" : "10px 20px",
51760
51763
  backgroundColor: "transparent",
51761
51764
  color: isFirstStep ? theme2.colors.textSecondary : theme2.colors.text,
51762
51765
  border: `1px solid ${theme2.colors.border}`,
@@ -51765,7 +51768,8 @@ const TourPlayer = ({
51765
51768
  fontFamily: theme2.fonts.body,
51766
51769
  cursor: isFirstStep ? "not-allowed" : "pointer",
51767
51770
  opacity: isFirstStep ? 0.5 : 1,
51768
- transition: "all 0.2s"
51771
+ transition: "all 0.2s",
51772
+ flexShrink: 0
51769
51773
  },
51770
51774
  onMouseEnter: (e) => {
51771
51775
  if (!isFirstStep) {
@@ -51775,34 +51779,48 @@ const TourPlayer = ({
51775
51779
  onMouseLeave: (e) => {
51776
51780
  e.currentTarget.style.backgroundColor = "transparent";
51777
51781
  },
51782
+ title: "Previous step",
51778
51783
  children: [
51779
51784
  /* @__PURE__ */ jsx(ChevronLeft, { size: 16 }),
51780
- "Previous"
51785
+ position !== "top" && "Previous"
51781
51786
  ]
51782
51787
  }
51783
51788
  ),
51784
- /* @__PURE__ */ jsx("div", { style: { display: "flex", gap: "6px", alignItems: "center" }, children: tour.steps.map((step, idx) => /* @__PURE__ */ jsx(
51789
+ /* @__PURE__ */ jsx(
51785
51790
  "div",
51786
51791
  {
51787
- onClick: () => goToStep(idx),
51788
51792
  style: {
51789
- width: "8px",
51790
- height: "8px",
51791
- borderRadius: "50%",
51792
- backgroundColor: idx === currentStepIndex ? theme2.colors.primary : completedSteps.has(step.id) ? theme2.colors.accent : theme2.colors.border,
51793
- cursor: "pointer",
51794
- transition: "all 0.2s"
51795
- },
51796
- onMouseEnter: (e) => {
51797
- e.currentTarget.style.transform = "scale(1.3)";
51793
+ flex: 1,
51794
+ minWidth: 0,
51795
+ overflow: "auto",
51796
+ display: "flex",
51797
+ justifyContent: "center"
51798
51798
  },
51799
- onMouseLeave: (e) => {
51800
- e.currentTarget.style.transform = "scale(1)";
51801
- }
51802
- },
51803
- step.id
51804
- )) }),
51805
- /* @__PURE__ */ jsxs(
51799
+ children: /* @__PURE__ */ jsx("div", { style: { display: "flex", gap: "6px", alignItems: "center", padding: "0 8px" }, children: tour.steps.map((step, idx) => /* @__PURE__ */ jsx(
51800
+ "div",
51801
+ {
51802
+ onClick: () => goToStep(idx),
51803
+ style: {
51804
+ width: "8px",
51805
+ height: "8px",
51806
+ borderRadius: "50%",
51807
+ backgroundColor: idx === currentStepIndex ? theme2.colors.primary : completedSteps.has(step.id) ? theme2.colors.accent : theme2.colors.border,
51808
+ cursor: "pointer",
51809
+ transition: "all 0.2s",
51810
+ flexShrink: 0
51811
+ },
51812
+ onMouseEnter: (e) => {
51813
+ e.currentTarget.style.transform = "scale(1.3)";
51814
+ },
51815
+ onMouseLeave: (e) => {
51816
+ e.currentTarget.style.transform = "scale(1)";
51817
+ }
51818
+ },
51819
+ step.id
51820
+ )) })
51821
+ }
51822
+ ),
51823
+ /* @__PURE__ */ jsx(
51806
51824
  "button",
51807
51825
  {
51808
51826
  onClick: nextStep,
@@ -51811,7 +51829,7 @@ const TourPlayer = ({
51811
51829
  display: "flex",
51812
51830
  alignItems: "center",
51813
51831
  gap: "6px",
51814
- padding: "10px 20px",
51832
+ padding: position === "top" ? "10px" : "10px 20px",
51815
51833
  backgroundColor: isLastStep ? "transparent" : theme2.colors.primary,
51816
51834
  color: isLastStep ? theme2.colors.textSecondary : "#ffffff",
51817
51835
  border: `1px solid ${isLastStep ? theme2.colors.border : theme2.colors.primary}`,
@@ -51821,7 +51839,8 @@ const TourPlayer = ({
51821
51839
  fontWeight: 600,
51822
51840
  cursor: isLastStep ? "not-allowed" : "pointer",
51823
51841
  opacity: isLastStep ? 0.5 : 1,
51824
- transition: "all 0.2s"
51842
+ transition: "all 0.2s",
51843
+ flexShrink: 0
51825
51844
  },
51826
51845
  onMouseEnter: (e) => {
51827
51846
  if (!isLastStep) {
@@ -51833,10 +51852,11 @@ const TourPlayer = ({
51833
51852
  e.currentTarget.style.backgroundColor = theme2.colors.primary;
51834
51853
  }
51835
51854
  },
51836
- children: [
51855
+ title: isLastStep ? "Finished" : "Next step",
51856
+ children: position === "top" ? isLastStep ? /* @__PURE__ */ jsx(CircleCheck, { size: 16 }) : /* @__PURE__ */ jsx(ChevronRight, { size: 16 }) : /* @__PURE__ */ jsxs(Fragment, { children: [
51837
51857
  isLastStep ? "Finished" : "Next",
51838
51858
  !isLastStep && /* @__PURE__ */ jsx(ChevronRight, { size: 16 })
51839
- ]
51859
+ ] })
51840
51860
  }
51841
51861
  )
51842
51862
  ]