@usertour/helpers 0.0.60 → 0.0.61

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.
@@ -227,6 +227,42 @@ var convertSettings = (settings) => {
227
227
  data.brandColor.color
228
228
  );
229
229
  data.survey.color = resolveAutoValue(data.survey.color, data.brandColor.background);
230
+ data.launcherButtons.primary.textColor.color = resolveAutoValue(
231
+ data.launcherButtons.primary.textColor.color,
232
+ data.brandColor.color
233
+ );
234
+ data.launcherButtons.primary.textColor.hover = resolveAutoValue(
235
+ data.launcherButtons.primary.textColor.hover,
236
+ data.brandColor.color
237
+ );
238
+ data.launcherButtons.primary.textColor.active = resolveAutoValue(
239
+ data.launcherButtons.primary.textColor.active,
240
+ data.brandColor.color
241
+ );
242
+ data.launcherButtons.primary.backgroundColor.background = resolveAutoValue(
243
+ data.launcherButtons.primary.backgroundColor.background,
244
+ data.brandColor.background
245
+ );
246
+ data.launcherButtons.primary.backgroundColor.hover = resolveAutoValue(
247
+ data.launcherButtons.primary.backgroundColor.hover,
248
+ data.brandColor.autoHover
249
+ );
250
+ data.launcherButtons.primary.backgroundColor.active = resolveAutoValue(
251
+ data.launcherButtons.primary.backgroundColor.active,
252
+ data.brandColor.autoActive
253
+ );
254
+ data.launcherButtons.primary.border.color.color = resolveAutoValue(
255
+ data.launcherButtons.primary.border.color.color,
256
+ data.brandColor.background
257
+ );
258
+ data.launcherButtons.primary.border.color.hover = resolveAutoValue(
259
+ data.launcherButtons.primary.border.color.hover,
260
+ data.brandColor.autoHover
261
+ );
262
+ data.launcherButtons.primary.border.color.active = resolveAutoValue(
263
+ data.launcherButtons.primary.border.color.active,
264
+ data.brandColor.autoActive
265
+ );
230
266
  if (data.font.fontFamily === "System font") {
231
267
  data.font.fontFamily = defaultFontFamily;
232
268
  } else if (!data.font.fontFamily.includes("sans-serif")) {
@@ -326,7 +362,22 @@ var convertToCssVars = (settings, type = "tooltip") => {
326
362
  "--usertour-checkmark-background-color": settings.checklist.checkmarkColor,
327
363
  "--usertour-checklist-trigger-height": `${settings.checklistLauncher.height}px`,
328
364
  "--usertour-checklist-trigger-hover-background-color": settings.checklistLauncher.color.hover,
329
- "--usertour-question-color": hexToHSLString(settings.survey.color)
365
+ "--usertour-question-color": hexToHSLString(settings.survey.color),
366
+ "--usertour-launcher-button-height": `${settings.launcherButtons.height}px`,
367
+ "--usertour-launcher-button-width": settings.launcherButtons.width === 0 ? "auto" : `${settings.launcherButtons.width}px`,
368
+ "--usertour-launcher-button-horizontal-padding": `${settings.launcherButtons.px}px`,
369
+ "--usertour-launcher-button-border-radius": `${settings.launcherButtons.borderRadius}px`,
370
+ "--usertour-launcher-button-background-color": settings.launcherButtons.primary.backgroundColor.background,
371
+ "--usertour-launcher-button-hover-background-color": settings.launcherButtons.primary.backgroundColor.hover,
372
+ "--usertour-launcher-button-active-background-color": settings.launcherButtons.primary.backgroundColor.active,
373
+ "--usertour-launcher-button-font-color": settings.launcherButtons.primary.textColor.color,
374
+ "--usertour-launcher-button-hover-font-color": settings.launcherButtons.primary.textColor.hover,
375
+ "--usertour-launcher-button-active-font-color": settings.launcherButtons.primary.textColor.active,
376
+ "--usertour-launcher-button-font-weight": settings.launcherButtons.primary.fontWeight,
377
+ "--usertour-launcher-button-border-width": settings.launcherButtons.primary.border.enabled ? `${settings.launcherButtons.primary.border.borderWidth}px` : "0px",
378
+ "--usertour-launcher-button-border-color": settings.launcherButtons.primary.border.color.color,
379
+ "--usertour-launcher-button-hover-border-color": settings.launcherButtons.primary.border.color.hover,
380
+ "--usertour-launcher-button-active-border-color": settings.launcherButtons.primary.border.color.active
330
381
  };
331
382
  if (settings.backdrop.highlight.type === "inside") {
332
383
  cssMapping["--usertour-backdrop-highlight-inset"] = "inset";
@@ -495,6 +546,37 @@ describe("convert-settings", () => {
495
546
  }
496
547
  }
497
548
  },
549
+ launcherButtons: {
550
+ height: 32,
551
+ width: 0,
552
+ px: 16,
553
+ borderRadius: 8,
554
+ primary: {
555
+ fontWeight: 600,
556
+ textColor: {
557
+ color: "Auto",
558
+ hover: "Auto",
559
+ active: "Auto",
560
+ background: "#FFFFFF"
561
+ },
562
+ backgroundColor: {
563
+ color: "#FFFFFF",
564
+ hover: "Auto",
565
+ active: "Auto",
566
+ background: "Auto"
567
+ },
568
+ border: {
569
+ enabled: false,
570
+ borderWidth: 1,
571
+ color: {
572
+ color: "Auto",
573
+ hover: "Auto",
574
+ active: "Auto",
575
+ background: "#FFFFFF"
576
+ }
577
+ }
578
+ }
579
+ },
498
580
  tooltip: {
499
581
  width: 300,
500
582
  notchSize: 20
@@ -706,6 +788,44 @@ describe("convert-settings", () => {
706
788
  expect(result.survey.color).toBe(completeSettings.brandColor.background);
707
789
  });
708
790
  });
791
+ describe("launcherButtons Auto values", () => {
792
+ it("should resolve launcherButtons primary textColor from brandColor.color when set to Auto", () => {
793
+ const result = convertSettings(completeSettings);
794
+ expect(result.launcherButtons.primary.textColor.color).toBe(
795
+ completeSettings.brandColor.color
796
+ );
797
+ expect(result.launcherButtons.primary.textColor.hover).toBe(
798
+ completeSettings.brandColor.color
799
+ );
800
+ expect(result.launcherButtons.primary.textColor.active).toBe(
801
+ completeSettings.brandColor.color
802
+ );
803
+ });
804
+ it("should resolve launcherButtons primary backgroundColor from brandColor when set to Auto", () => {
805
+ const result = convertSettings(completeSettings);
806
+ expect(result.launcherButtons.primary.backgroundColor.background).toBe(
807
+ completeSettings.brandColor.background
808
+ );
809
+ expect(result.launcherButtons.primary.backgroundColor.hover).toBe(
810
+ completeSettings.brandColor.autoHover
811
+ );
812
+ expect(result.launcherButtons.primary.backgroundColor.active).toBe(
813
+ completeSettings.brandColor.autoActive
814
+ );
815
+ });
816
+ it("should resolve launcherButtons primary border.color from brandColor when set to Auto", () => {
817
+ const result = convertSettings(completeSettings);
818
+ expect(result.launcherButtons.primary.border.color.color).toBe(
819
+ completeSettings.brandColor.background
820
+ );
821
+ expect(result.launcherButtons.primary.border.color.hover).toBe(
822
+ completeSettings.brandColor.autoHover
823
+ );
824
+ expect(result.launcherButtons.primary.border.color.active).toBe(
825
+ completeSettings.brandColor.autoActive
826
+ );
827
+ });
828
+ });
709
829
  describe("font family handling", () => {
710
830
  it("should convert System font to full font family string", () => {
711
831
  const result = convertSettings(completeSettings);
@@ -791,6 +911,21 @@ describe("convert-settings", () => {
791
911
  expect(result.launcherIcon).toBeDefined();
792
912
  expect(result.launcherIcon.size).toBe(import_types2.defaultSettings.launcherIcon.size);
793
913
  });
914
+ it("should handle missing launcherButtons with defaultSettings fallback", () => {
915
+ const settings = {
916
+ mainColor: completeSettings.mainColor,
917
+ brandColor: completeSettings.brandColor
918
+ };
919
+ const result = convertSettings(settings);
920
+ expect(result.launcherButtons).toBeDefined();
921
+ expect(result.launcherButtons.height).toBe(import_types2.defaultSettings.launcherButtons.height);
922
+ expect(result.launcherButtons.width).toBe(import_types2.defaultSettings.launcherButtons.width);
923
+ expect(result.launcherButtons.px).toBe(import_types2.defaultSettings.launcherButtons.px);
924
+ expect(result.launcherButtons.borderRadius).toBe(
925
+ import_types2.defaultSettings.launcherButtons.borderRadius
926
+ );
927
+ expect(result.launcherButtons.primary).toBeDefined();
928
+ });
794
929
  });
795
930
  describe("convertSettings - Combined fallback (missing data + Auto resolution)", () => {
796
931
  it("should apply both defaultSettings fallback and Auto resolution for empty input", () => {
@@ -821,6 +956,13 @@ describe("convert-settings", () => {
821
956
  expect(result.buttons.secondary.backgroundColor.background).toBe(
822
957
  import_types2.defaultSettings.mainColor.background
823
958
  );
959
+ expect(result.launcherButtons.primary.textColor.color).toBe(import_types2.defaultSettings.brandColor.color);
960
+ expect(result.launcherButtons.primary.backgroundColor.background).toBe(
961
+ import_types2.defaultSettings.brandColor.background
962
+ );
963
+ expect(result.launcherButtons.primary.backgroundColor.hover).toBe(
964
+ import_types2.defaultSettings.brandColor.autoHover
965
+ );
824
966
  });
825
967
  it("should handle partial settings with correct fallback chain", () => {
826
968
  const partialSettings = {
@@ -889,6 +1031,35 @@ describe("convert-settings", () => {
889
1031
  expect(css).toContain("--usertour-widget-launcher-icon-hover-color:");
890
1032
  expect(css).toContain("--usertour-widget-beacon-color:");
891
1033
  });
1034
+ it("should include launcher button CSS variables", () => {
1035
+ const convertedSettings = convertSettings(completeSettings);
1036
+ const css = convertToCssVars(convertedSettings);
1037
+ expect(css).toContain("--usertour-launcher-button-height:");
1038
+ expect(css).toContain("--usertour-launcher-button-width:");
1039
+ expect(css).toContain("--usertour-launcher-button-horizontal-padding:");
1040
+ expect(css).toContain("--usertour-launcher-button-border-radius:");
1041
+ expect(css).toContain("--usertour-launcher-button-background-color:");
1042
+ expect(css).toContain("--usertour-launcher-button-hover-background-color:");
1043
+ expect(css).toContain("--usertour-launcher-button-active-background-color:");
1044
+ expect(css).toContain("--usertour-launcher-button-font-color:");
1045
+ expect(css).toContain("--usertour-launcher-button-hover-font-color:");
1046
+ expect(css).toContain("--usertour-launcher-button-active-font-color:");
1047
+ expect(css).toContain("--usertour-launcher-button-font-weight:");
1048
+ expect(css).toContain("--usertour-launcher-button-border-width:");
1049
+ expect(css).toContain("--usertour-launcher-button-border-color:");
1050
+ expect(css).toContain("--usertour-launcher-button-hover-border-color:");
1051
+ expect(css).toContain("--usertour-launcher-button-active-border-color:");
1052
+ });
1053
+ it("should set launcher button width to auto when width is 0", () => {
1054
+ const convertedSettings = convertSettings(completeSettings);
1055
+ const css = convertToCssVars(convertedSettings);
1056
+ expect(css).toContain("--usertour-launcher-button-width:auto");
1057
+ });
1058
+ it("should set launcher button border width to 0px when border is disabled", () => {
1059
+ const convertedSettings = convertSettings(completeSettings);
1060
+ const css = convertToCssVars(convertedSettings);
1061
+ expect(css).toContain("--usertour-launcher-button-border-width:0px");
1062
+ });
892
1063
  it("should add modal padding for modal type", () => {
893
1064
  const convertedSettings = convertSettings(completeSettings);
894
1065
  const css = convertToCssVars(convertedSettings, "modal");
@@ -2,7 +2,7 @@ import {
2
2
  convertSettings,
3
3
  convertToCssVars,
4
4
  mergeThemeDefaultSettings
5
- } from "../chunk-77ALLS35.js";
5
+ } from "../chunk-XKSTKX45.js";
6
6
  import "../chunk-5C3J4DM2.js";
7
7
  import "../chunk-FZFHBCB6.js";
8
8
  import "../chunk-GFH3VWOC.js";
@@ -163,6 +163,37 @@ describe("convert-settings", () => {
163
163
  }
164
164
  }
165
165
  },
166
+ launcherButtons: {
167
+ height: 32,
168
+ width: 0,
169
+ px: 16,
170
+ borderRadius: 8,
171
+ primary: {
172
+ fontWeight: 600,
173
+ textColor: {
174
+ color: "Auto",
175
+ hover: "Auto",
176
+ active: "Auto",
177
+ background: "#FFFFFF"
178
+ },
179
+ backgroundColor: {
180
+ color: "#FFFFFF",
181
+ hover: "Auto",
182
+ active: "Auto",
183
+ background: "Auto"
184
+ },
185
+ border: {
186
+ enabled: false,
187
+ borderWidth: 1,
188
+ color: {
189
+ color: "Auto",
190
+ hover: "Auto",
191
+ active: "Auto",
192
+ background: "#FFFFFF"
193
+ }
194
+ }
195
+ }
196
+ },
166
197
  tooltip: {
167
198
  width: 300,
168
199
  notchSize: 20
@@ -374,6 +405,44 @@ describe("convert-settings", () => {
374
405
  expect(result.survey.color).toBe(completeSettings.brandColor.background);
375
406
  });
376
407
  });
408
+ describe("launcherButtons Auto values", () => {
409
+ it("should resolve launcherButtons primary textColor from brandColor.color when set to Auto", () => {
410
+ const result = convertSettings(completeSettings);
411
+ expect(result.launcherButtons.primary.textColor.color).toBe(
412
+ completeSettings.brandColor.color
413
+ );
414
+ expect(result.launcherButtons.primary.textColor.hover).toBe(
415
+ completeSettings.brandColor.color
416
+ );
417
+ expect(result.launcherButtons.primary.textColor.active).toBe(
418
+ completeSettings.brandColor.color
419
+ );
420
+ });
421
+ it("should resolve launcherButtons primary backgroundColor from brandColor when set to Auto", () => {
422
+ const result = convertSettings(completeSettings);
423
+ expect(result.launcherButtons.primary.backgroundColor.background).toBe(
424
+ completeSettings.brandColor.background
425
+ );
426
+ expect(result.launcherButtons.primary.backgroundColor.hover).toBe(
427
+ completeSettings.brandColor.autoHover
428
+ );
429
+ expect(result.launcherButtons.primary.backgroundColor.active).toBe(
430
+ completeSettings.brandColor.autoActive
431
+ );
432
+ });
433
+ it("should resolve launcherButtons primary border.color from brandColor when set to Auto", () => {
434
+ const result = convertSettings(completeSettings);
435
+ expect(result.launcherButtons.primary.border.color.color).toBe(
436
+ completeSettings.brandColor.background
437
+ );
438
+ expect(result.launcherButtons.primary.border.color.hover).toBe(
439
+ completeSettings.brandColor.autoHover
440
+ );
441
+ expect(result.launcherButtons.primary.border.color.active).toBe(
442
+ completeSettings.brandColor.autoActive
443
+ );
444
+ });
445
+ });
377
446
  describe("font family handling", () => {
378
447
  it("should convert System font to full font family string", () => {
379
448
  const result = convertSettings(completeSettings);
@@ -459,6 +528,21 @@ describe("convert-settings", () => {
459
528
  expect(result.launcherIcon).toBeDefined();
460
529
  expect(result.launcherIcon.size).toBe(defaultSettings.launcherIcon.size);
461
530
  });
531
+ it("should handle missing launcherButtons with defaultSettings fallback", () => {
532
+ const settings = {
533
+ mainColor: completeSettings.mainColor,
534
+ brandColor: completeSettings.brandColor
535
+ };
536
+ const result = convertSettings(settings);
537
+ expect(result.launcherButtons).toBeDefined();
538
+ expect(result.launcherButtons.height).toBe(defaultSettings.launcherButtons.height);
539
+ expect(result.launcherButtons.width).toBe(defaultSettings.launcherButtons.width);
540
+ expect(result.launcherButtons.px).toBe(defaultSettings.launcherButtons.px);
541
+ expect(result.launcherButtons.borderRadius).toBe(
542
+ defaultSettings.launcherButtons.borderRadius
543
+ );
544
+ expect(result.launcherButtons.primary).toBeDefined();
545
+ });
462
546
  });
463
547
  describe("convertSettings - Combined fallback (missing data + Auto resolution)", () => {
464
548
  it("should apply both defaultSettings fallback and Auto resolution for empty input", () => {
@@ -489,6 +573,13 @@ describe("convert-settings", () => {
489
573
  expect(result.buttons.secondary.backgroundColor.background).toBe(
490
574
  defaultSettings.mainColor.background
491
575
  );
576
+ expect(result.launcherButtons.primary.textColor.color).toBe(defaultSettings.brandColor.color);
577
+ expect(result.launcherButtons.primary.backgroundColor.background).toBe(
578
+ defaultSettings.brandColor.background
579
+ );
580
+ expect(result.launcherButtons.primary.backgroundColor.hover).toBe(
581
+ defaultSettings.brandColor.autoHover
582
+ );
492
583
  });
493
584
  it("should handle partial settings with correct fallback chain", () => {
494
585
  const partialSettings = {
@@ -557,6 +648,35 @@ describe("convert-settings", () => {
557
648
  expect(css).toContain("--usertour-widget-launcher-icon-hover-color:");
558
649
  expect(css).toContain("--usertour-widget-beacon-color:");
559
650
  });
651
+ it("should include launcher button CSS variables", () => {
652
+ const convertedSettings = convertSettings(completeSettings);
653
+ const css = convertToCssVars(convertedSettings);
654
+ expect(css).toContain("--usertour-launcher-button-height:");
655
+ expect(css).toContain("--usertour-launcher-button-width:");
656
+ expect(css).toContain("--usertour-launcher-button-horizontal-padding:");
657
+ expect(css).toContain("--usertour-launcher-button-border-radius:");
658
+ expect(css).toContain("--usertour-launcher-button-background-color:");
659
+ expect(css).toContain("--usertour-launcher-button-hover-background-color:");
660
+ expect(css).toContain("--usertour-launcher-button-active-background-color:");
661
+ expect(css).toContain("--usertour-launcher-button-font-color:");
662
+ expect(css).toContain("--usertour-launcher-button-hover-font-color:");
663
+ expect(css).toContain("--usertour-launcher-button-active-font-color:");
664
+ expect(css).toContain("--usertour-launcher-button-font-weight:");
665
+ expect(css).toContain("--usertour-launcher-button-border-width:");
666
+ expect(css).toContain("--usertour-launcher-button-border-color:");
667
+ expect(css).toContain("--usertour-launcher-button-hover-border-color:");
668
+ expect(css).toContain("--usertour-launcher-button-active-border-color:");
669
+ });
670
+ it("should set launcher button width to auto when width is 0", () => {
671
+ const convertedSettings = convertSettings(completeSettings);
672
+ const css = convertToCssVars(convertedSettings);
673
+ expect(css).toContain("--usertour-launcher-button-width:auto");
674
+ });
675
+ it("should set launcher button border width to 0px when border is disabled", () => {
676
+ const convertedSettings = convertSettings(completeSettings);
677
+ const css = convertToCssVars(convertedSettings);
678
+ expect(css).toContain("--usertour-launcher-button-border-width:0px");
679
+ });
560
680
  it("should add modal padding for modal type", () => {
561
681
  const convertedSettings = convertSettings(completeSettings);
562
682
  const css = convertToCssVars(convertedSettings, "modal");
@@ -164,6 +164,42 @@ var convertSettings = (settings) => {
164
164
  data.brandColor.color
165
165
  );
166
166
  data.survey.color = resolveAutoValue(data.survey.color, data.brandColor.background);
167
+ data.launcherButtons.primary.textColor.color = resolveAutoValue(
168
+ data.launcherButtons.primary.textColor.color,
169
+ data.brandColor.color
170
+ );
171
+ data.launcherButtons.primary.textColor.hover = resolveAutoValue(
172
+ data.launcherButtons.primary.textColor.hover,
173
+ data.brandColor.color
174
+ );
175
+ data.launcherButtons.primary.textColor.active = resolveAutoValue(
176
+ data.launcherButtons.primary.textColor.active,
177
+ data.brandColor.color
178
+ );
179
+ data.launcherButtons.primary.backgroundColor.background = resolveAutoValue(
180
+ data.launcherButtons.primary.backgroundColor.background,
181
+ data.brandColor.background
182
+ );
183
+ data.launcherButtons.primary.backgroundColor.hover = resolveAutoValue(
184
+ data.launcherButtons.primary.backgroundColor.hover,
185
+ data.brandColor.autoHover
186
+ );
187
+ data.launcherButtons.primary.backgroundColor.active = resolveAutoValue(
188
+ data.launcherButtons.primary.backgroundColor.active,
189
+ data.brandColor.autoActive
190
+ );
191
+ data.launcherButtons.primary.border.color.color = resolveAutoValue(
192
+ data.launcherButtons.primary.border.color.color,
193
+ data.brandColor.background
194
+ );
195
+ data.launcherButtons.primary.border.color.hover = resolveAutoValue(
196
+ data.launcherButtons.primary.border.color.hover,
197
+ data.brandColor.autoHover
198
+ );
199
+ data.launcherButtons.primary.border.color.active = resolveAutoValue(
200
+ data.launcherButtons.primary.border.color.active,
201
+ data.brandColor.autoActive
202
+ );
167
203
  if (data.font.fontFamily === "System font") {
168
204
  data.font.fontFamily = defaultFontFamily;
169
205
  } else if (!data.font.fontFamily.includes("sans-serif")) {
@@ -263,7 +299,22 @@ var convertToCssVars = (settings, type = "tooltip") => {
263
299
  "--usertour-checkmark-background-color": settings.checklist.checkmarkColor,
264
300
  "--usertour-checklist-trigger-height": `${settings.checklistLauncher.height}px`,
265
301
  "--usertour-checklist-trigger-hover-background-color": settings.checklistLauncher.color.hover,
266
- "--usertour-question-color": hexToHSLString(settings.survey.color)
302
+ "--usertour-question-color": hexToHSLString(settings.survey.color),
303
+ "--usertour-launcher-button-height": `${settings.launcherButtons.height}px`,
304
+ "--usertour-launcher-button-width": settings.launcherButtons.width === 0 ? "auto" : `${settings.launcherButtons.width}px`,
305
+ "--usertour-launcher-button-horizontal-padding": `${settings.launcherButtons.px}px`,
306
+ "--usertour-launcher-button-border-radius": `${settings.launcherButtons.borderRadius}px`,
307
+ "--usertour-launcher-button-background-color": settings.launcherButtons.primary.backgroundColor.background,
308
+ "--usertour-launcher-button-hover-background-color": settings.launcherButtons.primary.backgroundColor.hover,
309
+ "--usertour-launcher-button-active-background-color": settings.launcherButtons.primary.backgroundColor.active,
310
+ "--usertour-launcher-button-font-color": settings.launcherButtons.primary.textColor.color,
311
+ "--usertour-launcher-button-hover-font-color": settings.launcherButtons.primary.textColor.hover,
312
+ "--usertour-launcher-button-active-font-color": settings.launcherButtons.primary.textColor.active,
313
+ "--usertour-launcher-button-font-weight": settings.launcherButtons.primary.fontWeight,
314
+ "--usertour-launcher-button-border-width": settings.launcherButtons.primary.border.enabled ? `${settings.launcherButtons.primary.border.borderWidth}px` : "0px",
315
+ "--usertour-launcher-button-border-color": settings.launcherButtons.primary.border.color.color,
316
+ "--usertour-launcher-button-hover-border-color": settings.launcherButtons.primary.border.color.hover,
317
+ "--usertour-launcher-button-active-border-color": settings.launcherButtons.primary.border.color.active
267
318
  };
268
319
  if (settings.backdrop.highlight.type === "inside") {
269
320
  cssMapping["--usertour-backdrop-highlight-inset"] = "inset";
@@ -236,6 +236,42 @@ var convertSettings = (settings) => {
236
236
  data.brandColor.color
237
237
  );
238
238
  data.survey.color = resolveAutoValue(data.survey.color, data.brandColor.background);
239
+ data.launcherButtons.primary.textColor.color = resolveAutoValue(
240
+ data.launcherButtons.primary.textColor.color,
241
+ data.brandColor.color
242
+ );
243
+ data.launcherButtons.primary.textColor.hover = resolveAutoValue(
244
+ data.launcherButtons.primary.textColor.hover,
245
+ data.brandColor.color
246
+ );
247
+ data.launcherButtons.primary.textColor.active = resolveAutoValue(
248
+ data.launcherButtons.primary.textColor.active,
249
+ data.brandColor.color
250
+ );
251
+ data.launcherButtons.primary.backgroundColor.background = resolveAutoValue(
252
+ data.launcherButtons.primary.backgroundColor.background,
253
+ data.brandColor.background
254
+ );
255
+ data.launcherButtons.primary.backgroundColor.hover = resolveAutoValue(
256
+ data.launcherButtons.primary.backgroundColor.hover,
257
+ data.brandColor.autoHover
258
+ );
259
+ data.launcherButtons.primary.backgroundColor.active = resolveAutoValue(
260
+ data.launcherButtons.primary.backgroundColor.active,
261
+ data.brandColor.autoActive
262
+ );
263
+ data.launcherButtons.primary.border.color.color = resolveAutoValue(
264
+ data.launcherButtons.primary.border.color.color,
265
+ data.brandColor.background
266
+ );
267
+ data.launcherButtons.primary.border.color.hover = resolveAutoValue(
268
+ data.launcherButtons.primary.border.color.hover,
269
+ data.brandColor.autoHover
270
+ );
271
+ data.launcherButtons.primary.border.color.active = resolveAutoValue(
272
+ data.launcherButtons.primary.border.color.active,
273
+ data.brandColor.autoActive
274
+ );
239
275
  if (data.font.fontFamily === "System font") {
240
276
  data.font.fontFamily = defaultFontFamily;
241
277
  } else if (!data.font.fontFamily.includes("sans-serif")) {
@@ -335,7 +371,22 @@ var convertToCssVars = (settings, type = "tooltip") => {
335
371
  "--usertour-checkmark-background-color": settings.checklist.checkmarkColor,
336
372
  "--usertour-checklist-trigger-height": `${settings.checklistLauncher.height}px`,
337
373
  "--usertour-checklist-trigger-hover-background-color": settings.checklistLauncher.color.hover,
338
- "--usertour-question-color": hexToHSLString(settings.survey.color)
374
+ "--usertour-question-color": hexToHSLString(settings.survey.color),
375
+ "--usertour-launcher-button-height": `${settings.launcherButtons.height}px`,
376
+ "--usertour-launcher-button-width": settings.launcherButtons.width === 0 ? "auto" : `${settings.launcherButtons.width}px`,
377
+ "--usertour-launcher-button-horizontal-padding": `${settings.launcherButtons.px}px`,
378
+ "--usertour-launcher-button-border-radius": `${settings.launcherButtons.borderRadius}px`,
379
+ "--usertour-launcher-button-background-color": settings.launcherButtons.primary.backgroundColor.background,
380
+ "--usertour-launcher-button-hover-background-color": settings.launcherButtons.primary.backgroundColor.hover,
381
+ "--usertour-launcher-button-active-background-color": settings.launcherButtons.primary.backgroundColor.active,
382
+ "--usertour-launcher-button-font-color": settings.launcherButtons.primary.textColor.color,
383
+ "--usertour-launcher-button-hover-font-color": settings.launcherButtons.primary.textColor.hover,
384
+ "--usertour-launcher-button-active-font-color": settings.launcherButtons.primary.textColor.active,
385
+ "--usertour-launcher-button-font-weight": settings.launcherButtons.primary.fontWeight,
386
+ "--usertour-launcher-button-border-width": settings.launcherButtons.primary.border.enabled ? `${settings.launcherButtons.primary.border.borderWidth}px` : "0px",
387
+ "--usertour-launcher-button-border-color": settings.launcherButtons.primary.border.color.color,
388
+ "--usertour-launcher-button-hover-border-color": settings.launcherButtons.primary.border.color.hover,
389
+ "--usertour-launcher-button-active-border-color": settings.launcherButtons.primary.border.color.active
339
390
  };
340
391
  if (settings.backdrop.highlight.type === "inside") {
341
392
  cssMapping["--usertour-backdrop-highlight-inset"] = "inset";
@@ -2,7 +2,7 @@ import {
2
2
  convertSettings,
3
3
  convertToCssVars,
4
4
  mergeThemeDefaultSettings
5
- } from "./chunk-77ALLS35.js";
5
+ } from "./chunk-XKSTKX45.js";
6
6
  import "./chunk-5C3J4DM2.js";
7
7
  import "./chunk-FZFHBCB6.js";
8
8
  import "./chunk-GFH3VWOC.js";
package/dist/index.cjs CHANGED
@@ -538,6 +538,42 @@ var convertSettings = (settings) => {
538
538
  data.brandColor.color
539
539
  );
540
540
  data.survey.color = resolveAutoValue(data.survey.color, data.brandColor.background);
541
+ data.launcherButtons.primary.textColor.color = resolveAutoValue(
542
+ data.launcherButtons.primary.textColor.color,
543
+ data.brandColor.color
544
+ );
545
+ data.launcherButtons.primary.textColor.hover = resolveAutoValue(
546
+ data.launcherButtons.primary.textColor.hover,
547
+ data.brandColor.color
548
+ );
549
+ data.launcherButtons.primary.textColor.active = resolveAutoValue(
550
+ data.launcherButtons.primary.textColor.active,
551
+ data.brandColor.color
552
+ );
553
+ data.launcherButtons.primary.backgroundColor.background = resolveAutoValue(
554
+ data.launcherButtons.primary.backgroundColor.background,
555
+ data.brandColor.background
556
+ );
557
+ data.launcherButtons.primary.backgroundColor.hover = resolveAutoValue(
558
+ data.launcherButtons.primary.backgroundColor.hover,
559
+ data.brandColor.autoHover
560
+ );
561
+ data.launcherButtons.primary.backgroundColor.active = resolveAutoValue(
562
+ data.launcherButtons.primary.backgroundColor.active,
563
+ data.brandColor.autoActive
564
+ );
565
+ data.launcherButtons.primary.border.color.color = resolveAutoValue(
566
+ data.launcherButtons.primary.border.color.color,
567
+ data.brandColor.background
568
+ );
569
+ data.launcherButtons.primary.border.color.hover = resolveAutoValue(
570
+ data.launcherButtons.primary.border.color.hover,
571
+ data.brandColor.autoHover
572
+ );
573
+ data.launcherButtons.primary.border.color.active = resolveAutoValue(
574
+ data.launcherButtons.primary.border.color.active,
575
+ data.brandColor.autoActive
576
+ );
541
577
  if (data.font.fontFamily === "System font") {
542
578
  data.font.fontFamily = defaultFontFamily;
543
579
  } else if (!data.font.fontFamily.includes("sans-serif")) {
@@ -637,7 +673,22 @@ var convertToCssVars = (settings, type = "tooltip") => {
637
673
  "--usertour-checkmark-background-color": settings.checklist.checkmarkColor,
638
674
  "--usertour-checklist-trigger-height": `${settings.checklistLauncher.height}px`,
639
675
  "--usertour-checklist-trigger-hover-background-color": settings.checklistLauncher.color.hover,
640
- "--usertour-question-color": hexToHSLString(settings.survey.color)
676
+ "--usertour-question-color": hexToHSLString(settings.survey.color),
677
+ "--usertour-launcher-button-height": `${settings.launcherButtons.height}px`,
678
+ "--usertour-launcher-button-width": settings.launcherButtons.width === 0 ? "auto" : `${settings.launcherButtons.width}px`,
679
+ "--usertour-launcher-button-horizontal-padding": `${settings.launcherButtons.px}px`,
680
+ "--usertour-launcher-button-border-radius": `${settings.launcherButtons.borderRadius}px`,
681
+ "--usertour-launcher-button-background-color": settings.launcherButtons.primary.backgroundColor.background,
682
+ "--usertour-launcher-button-hover-background-color": settings.launcherButtons.primary.backgroundColor.hover,
683
+ "--usertour-launcher-button-active-background-color": settings.launcherButtons.primary.backgroundColor.active,
684
+ "--usertour-launcher-button-font-color": settings.launcherButtons.primary.textColor.color,
685
+ "--usertour-launcher-button-hover-font-color": settings.launcherButtons.primary.textColor.hover,
686
+ "--usertour-launcher-button-active-font-color": settings.launcherButtons.primary.textColor.active,
687
+ "--usertour-launcher-button-font-weight": settings.launcherButtons.primary.fontWeight,
688
+ "--usertour-launcher-button-border-width": settings.launcherButtons.primary.border.enabled ? `${settings.launcherButtons.primary.border.borderWidth}px` : "0px",
689
+ "--usertour-launcher-button-border-color": settings.launcherButtons.primary.border.color.color,
690
+ "--usertour-launcher-button-hover-border-color": settings.launcherButtons.primary.border.color.hover,
691
+ "--usertour-launcher-button-active-border-color": settings.launcherButtons.primary.border.color.active
641
692
  };
642
693
  if (settings.backdrop.highlight.type === "inside") {
643
694
  cssMapping["--usertour-backdrop-highlight-inset"] = "inset";
package/dist/index.js CHANGED
@@ -75,7 +75,7 @@ import {
75
75
  convertSettings,
76
76
  convertToCssVars,
77
77
  mergeThemeDefaultSettings
78
- } from "./chunk-77ALLS35.js";
78
+ } from "./chunk-XKSTKX45.js";
79
79
  import {
80
80
  deepClone,
81
81
  parseUrlParams,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@usertour/helpers",
3
- "version": "0.0.60",
3
+ "version": "0.0.61",
4
4
  "type": "module",
5
5
  "description": "Utility functions and helpers shared across the UserTour project",
6
6
  "homepage": "https://www.usertour.io",
@@ -29,7 +29,7 @@
29
29
  },
30
30
  "dependencies": {
31
31
  "@paralleldrive/cuid2": "^2.2.2",
32
- "@usertour/types": "^0.0.43",
32
+ "@usertour/types": "^0.0.45",
33
33
  "chroma-js": "^3.1.2",
34
34
  "class-variance-authority": "^0.4.0",
35
35
  "date-fns": "^2.30.0",