@usertour/helpers 0.0.60 → 0.0.62

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 (8) hide show
  1. package/dist/__tests__/convert-settings.test.cjs +195 -1
  2. package/dist/__tests__/convert-settings.test.js +144 -1
  3. package/dist/{chunk-77ALLS35.js → chunk-H5PTH5RA.js} +52 -1
  4. package/dist/convert-settings.cjs +52 -1
  5. package/dist/convert-settings.js +1 -1
  6. package/dist/index.cjs +52 -1
  7. package/dist/index.js +1 -1
  8. package/package.json +2 -2
package/dist/__tests__/convert-settings.test.cjs CHANGED
@@ -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 ? "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,36 @@ describe("convert-settings", () => {
495
546
  }
496
547
  }
497
548
  },
549
+ launcherButtons: {
550
+ height: 32,
551
+ px: 16,
552
+ borderRadius: 8,
553
+ primary: {
554
+ fontWeight: 600,
555
+ textColor: {
556
+ color: "Auto",
557
+ hover: "Auto",
558
+ active: "Auto",
559
+ background: "#FFFFFF"
560
+ },
561
+ backgroundColor: {
562
+ color: "#FFFFFF",
563
+ hover: "Auto",
564
+ active: "Auto",
565
+ background: "Auto"
566
+ },
567
+ border: {
568
+ enabled: false,
569
+ borderWidth: 1,
570
+ color: {
571
+ color: "Auto",
572
+ hover: "Auto",
573
+ active: "Auto",
574
+ background: "#FFFFFF"
575
+ }
576
+ }
577
+ }
578
+ },
498
579
  tooltip: {
499
580
  width: 300,
500
581
  notchSize: 20
@@ -706,6 +787,44 @@ describe("convert-settings", () => {
706
787
  expect(result.survey.color).toBe(completeSettings.brandColor.background);
707
788
  });
708
789
  });
790
+ describe("launcherButtons Auto values", () => {
791
+ it("should resolve launcherButtons primary textColor from brandColor.color when set to Auto", () => {
792
+ const result = convertSettings(completeSettings);
793
+ expect(result.launcherButtons.primary.textColor.color).toBe(
794
+ completeSettings.brandColor.color
795
+ );
796
+ expect(result.launcherButtons.primary.textColor.hover).toBe(
797
+ completeSettings.brandColor.color
798
+ );
799
+ expect(result.launcherButtons.primary.textColor.active).toBe(
800
+ completeSettings.brandColor.color
801
+ );
802
+ });
803
+ it("should resolve launcherButtons primary backgroundColor from brandColor when set to Auto", () => {
804
+ const result = convertSettings(completeSettings);
805
+ expect(result.launcherButtons.primary.backgroundColor.background).toBe(
806
+ completeSettings.brandColor.background
807
+ );
808
+ expect(result.launcherButtons.primary.backgroundColor.hover).toBe(
809
+ completeSettings.brandColor.autoHover
810
+ );
811
+ expect(result.launcherButtons.primary.backgroundColor.active).toBe(
812
+ completeSettings.brandColor.autoActive
813
+ );
814
+ });
815
+ it("should resolve launcherButtons primary border.color from brandColor when set to Auto", () => {
816
+ const result = convertSettings(completeSettings);
817
+ expect(result.launcherButtons.primary.border.color.color).toBe(
818
+ completeSettings.brandColor.background
819
+ );
820
+ expect(result.launcherButtons.primary.border.color.hover).toBe(
821
+ completeSettings.brandColor.autoHover
822
+ );
823
+ expect(result.launcherButtons.primary.border.color.active).toBe(
824
+ completeSettings.brandColor.autoActive
825
+ );
826
+ });
827
+ });
709
828
  describe("font family handling", () => {
710
829
  it("should convert System font to full font family string", () => {
711
830
  const result = convertSettings(completeSettings);
@@ -791,6 +910,21 @@ describe("convert-settings", () => {
791
910
  expect(result.launcherIcon).toBeDefined();
792
911
  expect(result.launcherIcon.size).toBe(import_types2.defaultSettings.launcherIcon.size);
793
912
  });
913
+ it("should handle missing launcherButtons with defaultSettings fallback", () => {
914
+ const settings = {
915
+ mainColor: completeSettings.mainColor,
916
+ brandColor: completeSettings.brandColor
917
+ };
918
+ const result = convertSettings(settings);
919
+ expect(result.launcherButtons).toBeDefined();
920
+ expect(result.launcherButtons.height).toBe(import_types2.defaultSettings.launcherButtons.height);
921
+ expect(result.launcherButtons.width).toBeUndefined();
922
+ expect(result.launcherButtons.px).toBe(import_types2.defaultSettings.launcherButtons.px);
923
+ expect(result.launcherButtons.borderRadius).toBe(
924
+ import_types2.defaultSettings.launcherButtons.borderRadius
925
+ );
926
+ expect(result.launcherButtons.primary).toBeDefined();
927
+ });
794
928
  });
795
929
  describe("convertSettings - Combined fallback (missing data + Auto resolution)", () => {
796
930
  it("should apply both defaultSettings fallback and Auto resolution for empty input", () => {
@@ -821,6 +955,13 @@ describe("convert-settings", () => {
821
955
  expect(result.buttons.secondary.backgroundColor.background).toBe(
822
956
  import_types2.defaultSettings.mainColor.background
823
957
  );
958
+ expect(result.launcherButtons.primary.textColor.color).toBe(import_types2.defaultSettings.brandColor.color);
959
+ expect(result.launcherButtons.primary.backgroundColor.background).toBe(
960
+ import_types2.defaultSettings.brandColor.background
961
+ );
962
+ expect(result.launcherButtons.primary.backgroundColor.hover).toBe(
963
+ import_types2.defaultSettings.brandColor.autoHover
964
+ );
824
965
  });
825
966
  it("should handle partial settings with correct fallback chain", () => {
826
967
  const partialSettings = {
@@ -889,6 +1030,59 @@ describe("convert-settings", () => {
889
1030
  expect(css).toContain("--usertour-widget-launcher-icon-hover-color:");
890
1031
  expect(css).toContain("--usertour-widget-beacon-color:");
891
1032
  });
1033
+ it("should include launcher button CSS variables", () => {
1034
+ const convertedSettings = convertSettings(completeSettings);
1035
+ const css = convertToCssVars(convertedSettings);
1036
+ expect(css).toContain("--usertour-launcher-button-height:");
1037
+ expect(css).toContain("--usertour-launcher-button-width:");
1038
+ expect(css).toContain("--usertour-launcher-button-horizontal-padding:");
1039
+ expect(css).toContain("--usertour-launcher-button-border-radius:");
1040
+ expect(css).toContain("--usertour-launcher-button-background-color:");
1041
+ expect(css).toContain("--usertour-launcher-button-hover-background-color:");
1042
+ expect(css).toContain("--usertour-launcher-button-active-background-color:");
1043
+ expect(css).toContain("--usertour-launcher-button-font-color:");
1044
+ expect(css).toContain("--usertour-launcher-button-hover-font-color:");
1045
+ expect(css).toContain("--usertour-launcher-button-active-font-color:");
1046
+ expect(css).toContain("--usertour-launcher-button-font-weight:");
1047
+ expect(css).toContain("--usertour-launcher-button-border-width:");
1048
+ expect(css).toContain("--usertour-launcher-button-border-color:");
1049
+ expect(css).toContain("--usertour-launcher-button-hover-border-color:");
1050
+ expect(css).toContain("--usertour-launcher-button-active-border-color:");
1051
+ });
1052
+ it("should set launcher button width to auto when width is undefined", () => {
1053
+ const convertedSettings = convertSettings(completeSettings);
1054
+ const css = convertToCssVars(convertedSettings);
1055
+ expect(css).toContain("--usertour-launcher-button-width:auto");
1056
+ });
1057
+ it("should set launcher button width to auto when width is 0", () => {
1058
+ const settingsWithZeroWidth = {
1059
+ ...completeSettings,
1060
+ launcherButtons: {
1061
+ ...completeSettings.launcherButtons,
1062
+ width: 0
1063
+ }
1064
+ };
1065
+ const convertedSettings = convertSettings(settingsWithZeroWidth);
1066
+ const css = convertToCssVars(convertedSettings);
1067
+ expect(css).toContain("--usertour-launcher-button-width:auto");
1068
+ });
1069
+ it("should set launcher button width to specific value when width is provided", () => {
1070
+ const settingsWithWidth = {
1071
+ ...completeSettings,
1072
+ launcherButtons: {
1073
+ ...completeSettings.launcherButtons,
1074
+ width: 120
1075
+ }
1076
+ };
1077
+ const convertedSettings = convertSettings(settingsWithWidth);
1078
+ const css = convertToCssVars(convertedSettings);
1079
+ expect(css).toContain("--usertour-launcher-button-width:120px");
1080
+ });
1081
+ it("should set launcher button border width to 0px when border is disabled", () => {
1082
+ const convertedSettings = convertSettings(completeSettings);
1083
+ const css = convertToCssVars(convertedSettings);
1084
+ expect(css).toContain("--usertour-launcher-button-border-width:0px");
1085
+ });
892
1086
  it("should add modal padding for modal type", () => {
893
1087
  const convertedSettings = convertSettings(completeSettings);
894
1088
  const css = convertToCssVars(convertedSettings, "modal");
package/dist/__tests__/convert-settings.test.js CHANGED
@@ -2,7 +2,7 @@ import {
2
2
  convertSettings,
3
3
  convertToCssVars,
4
4
  mergeThemeDefaultSettings
5
- } from "../chunk-77ALLS35.js";
5
+ } from "../chunk-H5PTH5RA.js";
6
6
  import "../chunk-5C3J4DM2.js";
7
7
  import "../chunk-FZFHBCB6.js";
8
8
  import "../chunk-GFH3VWOC.js";
@@ -163,6 +163,36 @@ describe("convert-settings", () => {
163
163
  }
164
164
  }
165
165
  },
166
+ launcherButtons: {
167
+ height: 32,
168
+ px: 16,
169
+ borderRadius: 8,
170
+ primary: {
171
+ fontWeight: 600,
172
+ textColor: {
173
+ color: "Auto",
174
+ hover: "Auto",
175
+ active: "Auto",
176
+ background: "#FFFFFF"
177
+ },
178
+ backgroundColor: {
179
+ color: "#FFFFFF",
180
+ hover: "Auto",
181
+ active: "Auto",
182
+ background: "Auto"
183
+ },
184
+ border: {
185
+ enabled: false,
186
+ borderWidth: 1,
187
+ color: {
188
+ color: "Auto",
189
+ hover: "Auto",
190
+ active: "Auto",
191
+ background: "#FFFFFF"
192
+ }
193
+ }
194
+ }
195
+ },
166
196
  tooltip: {
167
197
  width: 300,
168
198
  notchSize: 20
@@ -374,6 +404,44 @@ describe("convert-settings", () => {
374
404
  expect(result.survey.color).toBe(completeSettings.brandColor.background);
375
405
  });
376
406
  });
407
+ describe("launcherButtons Auto values", () => {
408
+ it("should resolve launcherButtons primary textColor from brandColor.color when set to Auto", () => {
409
+ const result = convertSettings(completeSettings);
410
+ expect(result.launcherButtons.primary.textColor.color).toBe(
411
+ completeSettings.brandColor.color
412
+ );
413
+ expect(result.launcherButtons.primary.textColor.hover).toBe(
414
+ completeSettings.brandColor.color
415
+ );
416
+ expect(result.launcherButtons.primary.textColor.active).toBe(
417
+ completeSettings.brandColor.color
418
+ );
419
+ });
420
+ it("should resolve launcherButtons primary backgroundColor from brandColor when set to Auto", () => {
421
+ const result = convertSettings(completeSettings);
422
+ expect(result.launcherButtons.primary.backgroundColor.background).toBe(
423
+ completeSettings.brandColor.background
424
+ );
425
+ expect(result.launcherButtons.primary.backgroundColor.hover).toBe(
426
+ completeSettings.brandColor.autoHover
427
+ );
428
+ expect(result.launcherButtons.primary.backgroundColor.active).toBe(
429
+ completeSettings.brandColor.autoActive
430
+ );
431
+ });
432
+ it("should resolve launcherButtons primary border.color from brandColor when set to Auto", () => {
433
+ const result = convertSettings(completeSettings);
434
+ expect(result.launcherButtons.primary.border.color.color).toBe(
435
+ completeSettings.brandColor.background
436
+ );
437
+ expect(result.launcherButtons.primary.border.color.hover).toBe(
438
+ completeSettings.brandColor.autoHover
439
+ );
440
+ expect(result.launcherButtons.primary.border.color.active).toBe(
441
+ completeSettings.brandColor.autoActive
442
+ );
443
+ });
444
+ });
377
445
  describe("font family handling", () => {
378
446
  it("should convert System font to full font family string", () => {
379
447
  const result = convertSettings(completeSettings);
@@ -459,6 +527,21 @@ describe("convert-settings", () => {
459
527
  expect(result.launcherIcon).toBeDefined();
460
528
  expect(result.launcherIcon.size).toBe(defaultSettings.launcherIcon.size);
461
529
  });
530
+ it("should handle missing launcherButtons with defaultSettings fallback", () => {
531
+ const settings = {
532
+ mainColor: completeSettings.mainColor,
533
+ brandColor: completeSettings.brandColor
534
+ };
535
+ const result = convertSettings(settings);
536
+ expect(result.launcherButtons).toBeDefined();
537
+ expect(result.launcherButtons.height).toBe(defaultSettings.launcherButtons.height);
538
+ expect(result.launcherButtons.width).toBeUndefined();
539
+ expect(result.launcherButtons.px).toBe(defaultSettings.launcherButtons.px);
540
+ expect(result.launcherButtons.borderRadius).toBe(
541
+ defaultSettings.launcherButtons.borderRadius
542
+ );
543
+ expect(result.launcherButtons.primary).toBeDefined();
544
+ });
462
545
  });
463
546
  describe("convertSettings - Combined fallback (missing data + Auto resolution)", () => {
464
547
  it("should apply both defaultSettings fallback and Auto resolution for empty input", () => {
@@ -489,6 +572,13 @@ describe("convert-settings", () => {
489
572
  expect(result.buttons.secondary.backgroundColor.background).toBe(
490
573
  defaultSettings.mainColor.background
491
574
  );
575
+ expect(result.launcherButtons.primary.textColor.color).toBe(defaultSettings.brandColor.color);
576
+ expect(result.launcherButtons.primary.backgroundColor.background).toBe(
577
+ defaultSettings.brandColor.background
578
+ );
579
+ expect(result.launcherButtons.primary.backgroundColor.hover).toBe(
580
+ defaultSettings.brandColor.autoHover
581
+ );
492
582
  });
493
583
  it("should handle partial settings with correct fallback chain", () => {
494
584
  const partialSettings = {
@@ -557,6 +647,59 @@ describe("convert-settings", () => {
557
647
  expect(css).toContain("--usertour-widget-launcher-icon-hover-color:");
558
648
  expect(css).toContain("--usertour-widget-beacon-color:");
559
649
  });
650
+ it("should include launcher button CSS variables", () => {
651
+ const convertedSettings = convertSettings(completeSettings);
652
+ const css = convertToCssVars(convertedSettings);
653
+ expect(css).toContain("--usertour-launcher-button-height:");
654
+ expect(css).toContain("--usertour-launcher-button-width:");
655
+ expect(css).toContain("--usertour-launcher-button-horizontal-padding:");
656
+ expect(css).toContain("--usertour-launcher-button-border-radius:");
657
+ expect(css).toContain("--usertour-launcher-button-background-color:");
658
+ expect(css).toContain("--usertour-launcher-button-hover-background-color:");
659
+ expect(css).toContain("--usertour-launcher-button-active-background-color:");
660
+ expect(css).toContain("--usertour-launcher-button-font-color:");
661
+ expect(css).toContain("--usertour-launcher-button-hover-font-color:");
662
+ expect(css).toContain("--usertour-launcher-button-active-font-color:");
663
+ expect(css).toContain("--usertour-launcher-button-font-weight:");
664
+ expect(css).toContain("--usertour-launcher-button-border-width:");
665
+ expect(css).toContain("--usertour-launcher-button-border-color:");
666
+ expect(css).toContain("--usertour-launcher-button-hover-border-color:");
667
+ expect(css).toContain("--usertour-launcher-button-active-border-color:");
668
+ });
669
+ it("should set launcher button width to auto when width is undefined", () => {
670
+ const convertedSettings = convertSettings(completeSettings);
671
+ const css = convertToCssVars(convertedSettings);
672
+ expect(css).toContain("--usertour-launcher-button-width:auto");
673
+ });
674
+ it("should set launcher button width to auto when width is 0", () => {
675
+ const settingsWithZeroWidth = {
676
+ ...completeSettings,
677
+ launcherButtons: {
678
+ ...completeSettings.launcherButtons,
679
+ width: 0
680
+ }
681
+ };
682
+ const convertedSettings = convertSettings(settingsWithZeroWidth);
683
+ const css = convertToCssVars(convertedSettings);
684
+ expect(css).toContain("--usertour-launcher-button-width:auto");
685
+ });
686
+ it("should set launcher button width to specific value when width is provided", () => {
687
+ const settingsWithWidth = {
688
+ ...completeSettings,
689
+ launcherButtons: {
690
+ ...completeSettings.launcherButtons,
691
+ width: 120
692
+ }
693
+ };
694
+ const convertedSettings = convertSettings(settingsWithWidth);
695
+ const css = convertToCssVars(convertedSettings);
696
+ expect(css).toContain("--usertour-launcher-button-width:120px");
697
+ });
698
+ it("should set launcher button border width to 0px when border is disabled", () => {
699
+ const convertedSettings = convertSettings(completeSettings);
700
+ const css = convertToCssVars(convertedSettings);
701
+ expect(css).toContain("--usertour-launcher-button-border-width:0px");
702
+ });
560
703
  it("should add modal padding for modal type", () => {
561
704
  const convertedSettings = convertSettings(completeSettings);
562
705
  const css = convertToCssVars(convertedSettings, "modal");
package/dist/{chunk-77ALLS35.js → chunk-H5PTH5RA.js} RENAMED
@@ -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 ? "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";
package/dist/convert-settings.cjs CHANGED
@@ -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 ? "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";
package/dist/convert-settings.js CHANGED
@@ -2,7 +2,7 @@ import {
2
2
  convertSettings,
3
3
  convertToCssVars,
4
4
  mergeThemeDefaultSettings
5
- } from "./chunk-77ALLS35.js";
5
+ } from "./chunk-H5PTH5RA.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 ? "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-H5PTH5RA.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.62",
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.46",
33
33
  "chroma-js": "^3.1.2",
34
34
  "class-variance-authority": "^0.4.0",
35
35
  "date-fns": "^2.30.0",