@usertour/helpers 0.0.59 → 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.
Files changed (11) hide show
  1. package/dist/__tests__/convert-settings.test.cjs +1257 -0
  2. package/dist/__tests__/convert-settings.test.d.cts +2 -0
  3. package/dist/__tests__/convert-settings.test.d.ts +2 -0
  4. package/dist/__tests__/convert-settings.test.js +874 -0
  5. package/dist/chunk-XKSTKX45.js +336 -0
  6. package/dist/convert-settings.cjs +211 -116
  7. package/dist/convert-settings.js +2 -1
  8. package/dist/index.cjs +252 -167
  9. package/dist/index.js +6 -6
  10. package/package.json +2 -2
  11. package/dist/chunk-MA5IMKG6.js +0 -248
package/dist/convert-settings.cjs CHANGED
@@ -73,128 +73,208 @@ var objToString = ObjProto.toString;
73
73
  var objHasOwn = ObjProto.hasOwnProperty;
74
74
  var isUndefined = (x) => x === void 0;
75
75
 
76
+ // src/utils.ts
77
+ var deepClone = (obj) => {
78
+ try {
79
+ return structuredClone(obj);
80
+ } catch (error) {
81
+ console.warn("structuredClone failed, falling back to JSON method:", error);
82
+ return JSON.parse(JSON.stringify(obj));
83
+ }
84
+ };
85
+
76
86
  // src/convert-settings.ts
77
87
  var defaultFontFamily = '-apple-system, "system-ui", "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"';
88
+ var mergeWithDefaults = (0, import_deepmerge_ts.deepmergeCustom)({
89
+ mergeOthers: (values) => {
90
+ const settingsValue = values[values.length - 1];
91
+ if (settingsValue === null || settingsValue === void 0) {
92
+ return values[0];
93
+ }
94
+ return settingsValue;
95
+ }
96
+ });
97
+ var resolveAutoValue = (value, fallback) => {
98
+ if (value === "Auto" || value === void 0 || value === null) {
99
+ return fallback;
100
+ }
101
+ return value;
102
+ };
78
103
  var mergeThemeDefaultSettings = (settings) => {
79
- return (0, import_deepmerge_ts.deepmerge)(import_types.defaultSettings, settings);
104
+ const base = deepClone(import_types.defaultSettings);
105
+ return mergeWithDefaults(base, settings);
80
106
  };
81
107
  var convertSettings = (settings) => {
82
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u;
83
108
  const data = mergeThemeDefaultSettings(settings);
84
- if (settings.mainColor.hover === "Auto") {
85
- data.mainColor.hover = settings.mainColor.autoHover;
86
- }
87
- if (settings.mainColor.active === "Auto") {
88
- data.mainColor.active = settings.mainColor.autoActive;
89
- }
90
- if (settings.brandColor.hover === "Auto") {
91
- data.brandColor.hover = settings.brandColor.autoHover;
92
- }
93
- if (settings.brandColor.active === "Auto") {
94
- data.brandColor.active = settings.brandColor.autoActive;
95
- }
96
- if (settings.border.borderColor === "Auto") {
97
- data.border.borderColor = settings.mainColor.color;
98
- }
99
- if (settings.buttons.primary.textColor.color === "Auto") {
100
- data.buttons.primary.textColor.color = settings.brandColor.color;
101
- }
102
- if (settings.buttons.primary.textColor.hover === "Auto") {
103
- data.buttons.primary.textColor.hover = settings.brandColor.color;
104
- }
105
- if (settings.buttons.primary.textColor.active === "Auto") {
106
- data.buttons.primary.textColor.active = settings.brandColor.color;
107
- }
108
- if (settings.buttons.primary.backgroundColor.background === "Auto") {
109
- data.buttons.primary.backgroundColor.background = settings.brandColor.background;
110
- }
111
- if (settings.buttons.primary.backgroundColor.hover === "Auto") {
112
- data.buttons.primary.backgroundColor.hover = settings.brandColor.autoHover;
113
- }
114
- if (settings.buttons.primary.backgroundColor.active === "Auto") {
115
- data.buttons.primary.backgroundColor.active = settings.brandColor.autoActive;
116
- }
117
- if (settings.buttons.primary.border.color.color === "Auto") {
118
- data.buttons.primary.border.color.color = settings.brandColor.background;
119
- }
120
- if (settings.buttons.primary.border.color.hover === "Auto") {
121
- data.buttons.primary.border.color.hover = settings.brandColor.autoHover;
122
- }
123
- if (settings.buttons.primary.border.color.active === "Auto") {
124
- data.buttons.primary.border.color.active = settings.brandColor.autoActive;
125
- }
126
- if (settings.buttons.secondary.textColor.color === "Auto") {
127
- data.buttons.secondary.textColor.color = settings.brandColor.background;
128
- }
129
- if (settings.buttons.secondary.textColor.hover === "Auto") {
130
- data.buttons.secondary.textColor.hover = settings.brandColor.background;
131
- }
132
- if (settings.buttons.secondary.textColor.active === "Auto") {
133
- data.buttons.secondary.textColor.active = settings.brandColor.background;
134
- }
135
- if (settings.buttons.secondary.backgroundColor.background === "Auto") {
136
- data.buttons.secondary.backgroundColor.background = settings.mainColor.background;
137
- }
138
- if (settings.buttons.secondary.backgroundColor.hover === "Auto") {
139
- data.buttons.secondary.backgroundColor.hover = settings.mainColor.autoHover;
140
- }
141
- if (settings.buttons.secondary.backgroundColor.active === "Auto") {
142
- data.buttons.secondary.backgroundColor.active = settings.mainColor.autoActive;
143
- }
144
- if (settings.buttons.secondary.border.color.color === "Auto") {
145
- data.buttons.secondary.border.color.color = settings.brandColor.background;
146
- }
147
- if (settings.buttons.secondary.border.color.hover === "Auto") {
148
- data.buttons.secondary.border.color.hover = settings.brandColor.background;
149
- }
150
- if (settings.buttons.secondary.border.color.active === "Auto") {
151
- data.buttons.secondary.border.color.active = settings.brandColor.background;
152
- }
153
- if (settings.font.linkColor === "Auto") {
154
- data.font.linkColor = settings.brandColor.background;
155
- }
156
- if (settings.xbutton.color === "Auto") {
157
- data.xbutton.color = settings.mainColor.color;
158
- }
159
- if (((_a = settings == null ? void 0 : settings.progress) == null ? void 0 : _a.color) === "Auto") {
160
- data.progress.color = settings.brandColor.background;
161
- }
162
- if (((_b = settings == null ? void 0 : settings.launcherBeacon) == null ? void 0 : _b.color) === "Auto") {
163
- data.launcherBeacon.color = settings.brandColor.background;
164
- }
165
- if (((_d = (_c = settings == null ? void 0 : settings.launcherIcon) == null ? void 0 : _c.color) == null ? void 0 : _d.color) === "Auto") {
166
- data.launcherIcon.color.color = settings.brandColor.background;
167
- }
168
- if (((_f = (_e = settings == null ? void 0 : settings.launcherIcon) == null ? void 0 : _e.color) == null ? void 0 : _f.hover) === "Auto") {
169
- data.launcherIcon.color.hover = settings.brandColor.autoHover;
170
- }
171
- if (((_h = (_g = settings == null ? void 0 : settings.launcherIcon) == null ? void 0 : _g.color) == null ? void 0 : _h.active) === "Auto") {
172
- data.launcherIcon.color.active = settings.brandColor.autoActive;
173
- }
174
- if (((_j = (_i = settings.checklistLauncher) == null ? void 0 : _i.color) == null ? void 0 : _j.color) === "Auto") {
175
- data.checklistLauncher.color.color = settings.brandColor.color;
176
- }
177
- if (((_l = (_k = settings.checklistLauncher) == null ? void 0 : _k.color) == null ? void 0 : _l.background) === "Auto") {
178
- data.checklistLauncher.color.background = settings.brandColor.background;
179
- }
180
- if (((_n = (_m = settings.checklistLauncher) == null ? void 0 : _m.color) == null ? void 0 : _n.hover) === "Auto") {
181
- data.checklistLauncher.color.hover = settings.brandColor.autoHover;
182
- }
183
- if (((_p = (_o = settings.checklistLauncher) == null ? void 0 : _o.color) == null ? void 0 : _p.active) === "Auto") {
184
- data.checklistLauncher.color.active = settings.brandColor.autoActive;
185
- }
186
- if (((_r = (_q = settings.checklistLauncher) == null ? void 0 : _q.counter) == null ? void 0 : _r.color) === "Auto") {
187
- data.checklistLauncher.counter.color = settings.brandColor.background;
188
- }
189
- if (((_t = (_s = settings.checklistLauncher) == null ? void 0 : _s.counter) == null ? void 0 : _t.background) === "Auto") {
190
- data.checklistLauncher.counter.background = settings.brandColor.color;
191
- }
192
- if (((_u = settings.survey) == null ? void 0 : _u.color) === "Auto") {
193
- data.survey.color = settings.brandColor.background;
194
- }
195
- if (settings.font.fontFamily === "System font") {
109
+ data.mainColor.hover = resolveAutoValue(data.mainColor.hover, data.mainColor.autoHover);
110
+ data.mainColor.active = resolveAutoValue(
111
+ data.mainColor.active,
112
+ data.mainColor.autoActive
113
+ );
114
+ data.brandColor.hover = resolveAutoValue(
115
+ data.brandColor.hover,
116
+ data.brandColor.autoHover
117
+ );
118
+ data.brandColor.active = resolveAutoValue(
119
+ data.brandColor.active,
120
+ data.brandColor.autoActive
121
+ );
122
+ data.border.borderColor = resolveAutoValue(data.border.borderColor, data.mainColor.color);
123
+ data.buttons.primary.textColor.color = resolveAutoValue(
124
+ data.buttons.primary.textColor.color,
125
+ data.brandColor.color
126
+ );
127
+ data.buttons.primary.textColor.hover = resolveAutoValue(
128
+ data.buttons.primary.textColor.hover,
129
+ data.brandColor.color
130
+ );
131
+ data.buttons.primary.textColor.active = resolveAutoValue(
132
+ data.buttons.primary.textColor.active,
133
+ data.brandColor.color
134
+ );
135
+ data.buttons.primary.backgroundColor.background = resolveAutoValue(
136
+ data.buttons.primary.backgroundColor.background,
137
+ data.brandColor.background
138
+ );
139
+ data.buttons.primary.backgroundColor.hover = resolveAutoValue(
140
+ data.buttons.primary.backgroundColor.hover,
141
+ data.brandColor.autoHover
142
+ );
143
+ data.buttons.primary.backgroundColor.active = resolveAutoValue(
144
+ data.buttons.primary.backgroundColor.active,
145
+ data.brandColor.autoActive
146
+ );
147
+ data.buttons.primary.border.color.color = resolveAutoValue(
148
+ data.buttons.primary.border.color.color,
149
+ data.brandColor.background
150
+ );
151
+ data.buttons.primary.border.color.hover = resolveAutoValue(
152
+ data.buttons.primary.border.color.hover,
153
+ data.brandColor.autoHover
154
+ );
155
+ data.buttons.primary.border.color.active = resolveAutoValue(
156
+ data.buttons.primary.border.color.active,
157
+ data.brandColor.autoActive
158
+ );
159
+ data.buttons.secondary.textColor.color = resolveAutoValue(
160
+ data.buttons.secondary.textColor.color,
161
+ data.brandColor.background
162
+ );
163
+ data.buttons.secondary.textColor.hover = resolveAutoValue(
164
+ data.buttons.secondary.textColor.hover,
165
+ data.brandColor.background
166
+ );
167
+ data.buttons.secondary.textColor.active = resolveAutoValue(
168
+ data.buttons.secondary.textColor.active,
169
+ data.brandColor.background
170
+ );
171
+ data.buttons.secondary.backgroundColor.background = resolveAutoValue(
172
+ data.buttons.secondary.backgroundColor.background,
173
+ data.mainColor.background
174
+ );
175
+ data.buttons.secondary.backgroundColor.hover = resolveAutoValue(
176
+ data.buttons.secondary.backgroundColor.hover,
177
+ data.mainColor.autoHover
178
+ );
179
+ data.buttons.secondary.backgroundColor.active = resolveAutoValue(
180
+ data.buttons.secondary.backgroundColor.active,
181
+ data.mainColor.autoActive
182
+ );
183
+ data.buttons.secondary.border.color.color = resolveAutoValue(
184
+ data.buttons.secondary.border.color.color,
185
+ data.brandColor.background
186
+ );
187
+ data.buttons.secondary.border.color.hover = resolveAutoValue(
188
+ data.buttons.secondary.border.color.hover,
189
+ data.brandColor.background
190
+ );
191
+ data.buttons.secondary.border.color.active = resolveAutoValue(
192
+ data.buttons.secondary.border.color.active,
193
+ data.brandColor.background
194
+ );
195
+ data.font.linkColor = resolveAutoValue(data.font.linkColor, data.brandColor.background);
196
+ data.xbutton.color = resolveAutoValue(data.xbutton.color, data.mainColor.color);
197
+ data.progress.color = resolveAutoValue(data.progress.color, data.brandColor.background);
198
+ data.launcherBeacon.color = resolveAutoValue(
199
+ data.launcherBeacon.color,
200
+ data.brandColor.background
201
+ );
202
+ data.launcherIcon.color.color = resolveAutoValue(
203
+ data.launcherIcon.color.color,
204
+ data.brandColor.background
205
+ );
206
+ data.launcherIcon.color.hover = resolveAutoValue(
207
+ data.launcherIcon.color.hover,
208
+ data.brandColor.autoHover
209
+ );
210
+ data.launcherIcon.color.active = resolveAutoValue(
211
+ data.launcherIcon.color.active,
212
+ data.brandColor.autoActive
213
+ );
214
+ data.checklistLauncher.color.color = resolveAutoValue(
215
+ data.checklistLauncher.color.color,
216
+ data.brandColor.color
217
+ );
218
+ data.checklistLauncher.color.background = resolveAutoValue(
219
+ data.checklistLauncher.color.background,
220
+ data.brandColor.background
221
+ );
222
+ data.checklistLauncher.color.hover = resolveAutoValue(
223
+ data.checklistLauncher.color.hover,
224
+ data.brandColor.autoHover
225
+ );
226
+ data.checklistLauncher.color.active = resolveAutoValue(
227
+ data.checklistLauncher.color.active,
228
+ data.brandColor.autoActive
229
+ );
230
+ data.checklistLauncher.counter.color = resolveAutoValue(
231
+ data.checklistLauncher.counter.color,
232
+ data.brandColor.background
233
+ );
234
+ data.checklistLauncher.counter.background = resolveAutoValue(
235
+ data.checklistLauncher.counter.background,
236
+ data.brandColor.color
237
+ );
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
+ );
275
+ if (data.font.fontFamily === "System font") {
196
276
  data.font.fontFamily = defaultFontFamily;
197
- } else {
277
+ } else if (!data.font.fontFamily.includes("sans-serif")) {
198
278
  data.font.fontFamily += ", sans-serif;";
199
279
  }
200
280
  return data;
@@ -291,7 +371,22 @@ var convertToCssVars = (settings, type = "tooltip") => {
291
371
  "--usertour-checkmark-background-color": settings.checklist.checkmarkColor,
292
372
  "--usertour-checklist-trigger-height": `${settings.checklistLauncher.height}px`,
293
373
  "--usertour-checklist-trigger-hover-background-color": settings.checklistLauncher.color.hover,
294
- "--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
295
390
  };
296
391
  if (settings.backdrop.highlight.type === "inside") {
297
392
  cssMapping["--usertour-backdrop-highlight-inset"] = "inset";
package/dist/convert-settings.js CHANGED
@@ -2,7 +2,8 @@ import {
2
2
  convertSettings,
3
3
  convertToCssVars,
4
4
  mergeThemeDefaultSettings
5
- } from "./chunk-MA5IMKG6.js";
5
+ } from "./chunk-XKSTKX45.js";
6
+ import "./chunk-5C3J4DM2.js";
6
7
  import "./chunk-FZFHBCB6.js";
7
8
  import "./chunk-GFH3VWOC.js";
8
9
  import "./chunk-XEO3YXBM.js";