@wix/editor 1.477.0 → 1.479.0
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.
- package/dist/cjs/index.js +599 -525
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/index.js +593 -519
- package/dist/esm/index.js.map +1 -1
- package/dist/statics/docs-ts-model.json +1514 -2731
- package/dist/statics/index.js +599 -525
- package/dist/statics/index.js.map +1 -1
- package/dist/types/index.d.ts +28 -99
- package/package.json +5 -5
package/dist/cjs/index.js
CHANGED
|
@@ -177,361 +177,35 @@ class EventsSDKShape extends BaseSDKShape {
|
|
|
177
177
|
}
|
|
178
178
|
var index$c = new PlatformSDKShape(EventsSDKShape).withPublicMethod("addEventListener").build();
|
|
179
179
|
|
|
180
|
-
class ElementsSDKShape extends BaseSDKShape {
|
|
181
|
-
async getSelection() {
|
|
182
|
-
const privateAPI = await this.getPlatformPrivateAPI();
|
|
183
|
-
const refs = await privateAPI.components.getSelectedComponents();
|
|
184
|
-
return Promise.all(
|
|
185
|
-
refs.map(
|
|
186
|
-
(ref) => privateAPI.components.getComponent(ref)
|
|
187
|
-
)
|
|
188
|
-
);
|
|
189
|
-
}
|
|
190
|
-
async onSelectionChange(cb) {
|
|
191
|
-
const events = new EventsSDKShape(this.getApplicationContext());
|
|
192
|
-
void events.addEventListener("componentSelectionChanged", (payload) => {
|
|
193
|
-
cb(payload.components);
|
|
194
|
-
});
|
|
195
|
-
}
|
|
196
|
-
}
|
|
197
|
-
var index$b = new PlatformSDKShape(ElementsSDKShape).withPublicMethod("onSelectionChange").withPublicMethod("getSelection").build();
|
|
198
|
-
|
|
199
|
-
class InfoSDKShape extends BaseSDKShape {
|
|
200
|
-
async getViewMode() {
|
|
201
|
-
const privateAPI = await this.getPlatformPrivateAPI();
|
|
202
|
-
return privateAPI.info.getViewMode();
|
|
203
|
-
}
|
|
204
|
-
async getLanguageCode() {
|
|
205
|
-
const privateAPI = await this.getPlatformPrivateAPI();
|
|
206
|
-
return privateAPI.info.getLanguageCode();
|
|
207
|
-
}
|
|
208
|
-
async getSiteDirection() {
|
|
209
|
-
const privateAPI = await this.getPlatformPrivateAPI();
|
|
210
|
-
return privateAPI.info.getSiteDirection();
|
|
211
|
-
}
|
|
212
|
-
async siteHasCustomClasses() {
|
|
213
|
-
const privateAPI = await this.getPlatformPrivateAPI();
|
|
214
|
-
return privateAPI.info.siteHasCustomClasses();
|
|
215
|
-
}
|
|
216
|
-
async getThemeCustomProperties(filter) {
|
|
217
|
-
const privateAPI = await this.getPlatformPrivateAPI();
|
|
218
|
-
return privateAPI.info.getThemeCustomProperties(filter);
|
|
219
|
-
}
|
|
220
|
-
async getSiteFonts(filter) {
|
|
221
|
-
const privateAPI = await this.getPlatformPrivateAPI();
|
|
222
|
-
return privateAPI.info.getSiteFonts(filter);
|
|
223
|
-
}
|
|
224
|
-
async getMetaSiteId() {
|
|
225
|
-
const privateAPI = await this.getPlatformPrivateAPI();
|
|
226
|
-
return privateAPI.info.getMetaSiteId();
|
|
227
|
-
}
|
|
228
|
-
}
|
|
229
|
-
var index$a = new PlatformSDKShape(InfoSDKShape).withPublicMethod("getViewMode").withPublicMethod("getLanguageCode").withPublicMethod("getSiteDirection").withPublicMethod("siteHasCustomClasses").withPublicMethod("getThemeCustomProperties").withPublicMethod("getSiteFonts").withPublicMethod("getMetaSiteId").build();
|
|
230
|
-
|
|
231
|
-
var WidgetShapeErrorCode = /* @__PURE__ */ ((WidgetShapeErrorCode2) => {
|
|
232
|
-
WidgetShapeErrorCode2["UndefinedCompRef"] = "UndefinedCompRef";
|
|
233
|
-
WidgetShapeErrorCode2["NotAvailableMethod"] = "NotAvailableMethod";
|
|
234
|
-
return WidgetShapeErrorCode2;
|
|
235
|
-
})(WidgetShapeErrorCode || {});
|
|
236
|
-
class WidgetShapeError extends publicEditorPlatformErrors.BaseError {
|
|
237
|
-
constructor(message, code) {
|
|
238
|
-
super(message, code, "Widget Error");
|
|
239
|
-
}
|
|
240
|
-
}
|
|
241
|
-
const createWidgetShapeError = publicEditorPlatformErrors.createErrorBuilder(WidgetShapeError);
|
|
242
|
-
|
|
243
|
-
const UNDERLINE_DEFINITION = "underline";
|
|
244
|
-
function getFontFamiliesFromFonts(fonts) {
|
|
245
|
-
return fonts.map((font) => parseFontString({ font }).family).filter(Boolean);
|
|
246
|
-
}
|
|
247
|
-
function parseFontString(fontPickerValue) {
|
|
248
|
-
const font = {
|
|
249
|
-
family: void 0,
|
|
250
|
-
size: void 0
|
|
251
|
-
};
|
|
252
|
-
if (fontPickerValue?.font) {
|
|
253
|
-
const { variableName, fallbackValue } = extractFontVar(
|
|
254
|
-
fontPickerValue.font
|
|
255
|
-
);
|
|
256
|
-
font.cssVariableName = variableName;
|
|
257
|
-
const parts = fallbackValue.match(/(?:(["']).*?\1|\S)+/g) || [];
|
|
258
|
-
for (let i = 0; i < parts.length; i++) {
|
|
259
|
-
const part = parts[i];
|
|
260
|
-
switch (part) {
|
|
261
|
-
case "bold":
|
|
262
|
-
font.bold = true;
|
|
263
|
-
break;
|
|
264
|
-
case "italic":
|
|
265
|
-
font.italic = true;
|
|
266
|
-
break;
|
|
267
|
-
default:
|
|
268
|
-
if (part?.endsWith("px")) {
|
|
269
|
-
font.size = parseInt(part, 10);
|
|
270
|
-
} else if (i === parts.length - 1) {
|
|
271
|
-
font.family = part;
|
|
272
|
-
} else {
|
|
273
|
-
font.family = (font.family || "") + " " + part;
|
|
274
|
-
}
|
|
275
|
-
}
|
|
276
|
-
}
|
|
277
|
-
}
|
|
278
|
-
if (fontPickerValue?.textDecoration) {
|
|
279
|
-
font.underline = fontPickerValue.textDecoration === UNDERLINE_DEFINITION;
|
|
280
|
-
}
|
|
281
|
-
font.family = font.family?.trim().replace(/['"]+/g, "");
|
|
282
|
-
return font;
|
|
283
|
-
}
|
|
284
|
-
function extractFontVar(fontString) {
|
|
285
|
-
const trimmedFont = fontString.trim();
|
|
286
|
-
const match = trimmedFont.match(/var\((--[\w-]+),\s*(.+)\)/);
|
|
287
|
-
if (match) {
|
|
288
|
-
return {
|
|
289
|
-
variableName: match[1],
|
|
290
|
-
fallbackValue: match[2]?.trim() ?? ""
|
|
291
|
-
};
|
|
292
|
-
} else {
|
|
293
|
-
return {
|
|
294
|
-
variableName: void 0,
|
|
295
|
-
fallbackValue: trimmedFont
|
|
296
|
-
};
|
|
297
|
-
}
|
|
298
|
-
}
|
|
299
|
-
|
|
300
|
-
class WidgetScopedSDK {
|
|
301
|
-
constructor(compRef, privateAPI) {
|
|
302
|
-
this.compRef = compRef;
|
|
303
|
-
this.privateAPI = privateAPI;
|
|
304
|
-
}
|
|
305
|
-
async getProp(propName) {
|
|
306
|
-
const props = await this.privateAPI.refComponents.getProps(this.compRef);
|
|
307
|
-
return props?.[propName];
|
|
308
|
-
}
|
|
309
|
-
async setProp(propName, value) {
|
|
310
|
-
await this.privateAPI.refComponents.setProps(this.compRef, {
|
|
311
|
-
[propName]: value
|
|
312
|
-
});
|
|
313
|
-
}
|
|
314
|
-
async getDesignPreset() {
|
|
315
|
-
return this.privateAPI.designPresets.getDesignPresetName(this.compRef);
|
|
316
|
-
}
|
|
317
|
-
async setDesignPreset(designPresetName) {
|
|
318
|
-
await this.privateAPI.designPresets.setDesignPresetByName(
|
|
319
|
-
this.compRef,
|
|
320
|
-
designPresetName
|
|
321
|
-
);
|
|
322
|
-
}
|
|
323
|
-
async getNestedWidget(selector) {
|
|
324
|
-
const childCompRef = await this.privateAPI.refComponents.findComponentBySelector(
|
|
325
|
-
this.compRef,
|
|
326
|
-
selector
|
|
327
|
-
);
|
|
328
|
-
if (!childCompRef) {
|
|
329
|
-
return null;
|
|
330
|
-
}
|
|
331
|
-
return new WidgetScopedSDK(childCompRef, this.privateAPI);
|
|
332
|
-
}
|
|
333
|
-
}
|
|
334
|
-
class WidgetSDKShape extends BaseSDKShape {
|
|
335
|
-
async #getSelectedComponentRef() {
|
|
336
|
-
const privateAPI = await this.getPlatformPrivateAPI();
|
|
337
|
-
const refs = await privateAPI.components.getSelectedComponents();
|
|
338
|
-
const compRef = refs[0];
|
|
339
|
-
if (!compRef) {
|
|
340
|
-
throw createWidgetShapeError(WidgetShapeErrorCode.UndefinedCompRef);
|
|
341
|
-
}
|
|
342
|
-
return compRef;
|
|
343
|
-
}
|
|
344
|
-
async setPreloadFonts(fonts) {
|
|
345
|
-
const privateAPI = await this.getPlatformPrivateAPI();
|
|
346
|
-
const compRef = await this.#getSelectedComponentRef();
|
|
347
|
-
if (await privateAPI.refComponents.isRefComponent(compRef)) {
|
|
348
|
-
throw createWidgetShapeError(
|
|
349
|
-
WidgetShapeErrorCode.NotAvailableMethod,
|
|
350
|
-
"not available for the current component type"
|
|
351
|
-
);
|
|
352
|
-
}
|
|
353
|
-
const fontFamilies = getFontFamiliesFromFonts(fonts);
|
|
354
|
-
await privateAPI.customElement.setPreloadFonts(compRef, fontFamilies);
|
|
355
|
-
}
|
|
356
|
-
async getProp(propName) {
|
|
357
|
-
const privateAPI = await this.getPlatformPrivateAPI();
|
|
358
|
-
const compRef = await this.#getSelectedComponentRef();
|
|
359
|
-
if (await privateAPI.refComponents.isRefComponent(compRef)) {
|
|
360
|
-
return new WidgetScopedSDK(compRef, privateAPI).getProp(propName);
|
|
361
|
-
} else {
|
|
362
|
-
return privateAPI.customElement.getAttribute(compRef, propName);
|
|
363
|
-
}
|
|
364
|
-
}
|
|
365
|
-
async setProp(propName, value) {
|
|
366
|
-
const privateAPI = await this.getPlatformPrivateAPI();
|
|
367
|
-
const compRef = await this.#getSelectedComponentRef();
|
|
368
|
-
if (await privateAPI.refComponents.isRefComponent(compRef)) {
|
|
369
|
-
return new WidgetScopedSDK(compRef, privateAPI).setProp(propName, value);
|
|
370
|
-
} else {
|
|
371
|
-
await privateAPI.customElement.setAttribute(compRef, propName, value);
|
|
372
|
-
}
|
|
373
|
-
}
|
|
374
|
-
async getDesignPreset() {
|
|
375
|
-
const privateAPI = await this.getPlatformPrivateAPI();
|
|
376
|
-
const compRef = await this.#getSelectedComponentRef();
|
|
377
|
-
if (!await privateAPI.refComponents.isRefComponent(compRef)) {
|
|
378
|
-
throw createWidgetShapeError(
|
|
379
|
-
WidgetShapeErrorCode.NotAvailableMethod,
|
|
380
|
-
"not available for the current component type"
|
|
381
|
-
);
|
|
382
|
-
}
|
|
383
|
-
return new WidgetScopedSDK(compRef, privateAPI).getDesignPreset();
|
|
384
|
-
}
|
|
385
|
-
async setDesignPreset(designPresetName) {
|
|
386
|
-
const privateAPI = await this.getPlatformPrivateAPI();
|
|
387
|
-
const compRef = await this.#getSelectedComponentRef();
|
|
388
|
-
if (!await privateAPI.refComponents.isRefComponent(compRef)) {
|
|
389
|
-
throw createWidgetShapeError(
|
|
390
|
-
WidgetShapeErrorCode.NotAvailableMethod,
|
|
391
|
-
"not available for the current component type"
|
|
392
|
-
);
|
|
393
|
-
}
|
|
394
|
-
return new WidgetScopedSDK(compRef, privateAPI).setDesignPreset(
|
|
395
|
-
designPresetName
|
|
396
|
-
);
|
|
397
|
-
}
|
|
398
|
-
async getNestedWidget(selector) {
|
|
399
|
-
const privateAPI = await this.getPlatformPrivateAPI();
|
|
400
|
-
const compRef = await this.#getSelectedComponentRef();
|
|
401
|
-
return new WidgetScopedSDK(compRef, privateAPI).getNestedWidget(selector);
|
|
402
|
-
}
|
|
403
|
-
}
|
|
404
|
-
const widgetShape = new PlatformSDKShape(WidgetSDKShape).withPublicMethod("getNestedWidget").withPublicMethod("setDesignPreset").withPublicMethod("getDesignPreset").withPublicMethod("setProp").withPublicMethod("getProp").withPublicMethod("setPreloadFonts");
|
|
405
|
-
var index$9 = widgetShape.build();
|
|
406
|
-
|
|
407
|
-
function fontValueToCSS(fontValue) {
|
|
408
|
-
return `${fontValue.cssVariableName ? `var(${fontValue.cssVariableName}, ` : ""}${fontValue.italic ? "italic " : ""}${fontValue.bold ? "bold " : ""}${fontValue.size || 16}px ${// wrap each font family with quotes
|
|
409
|
-
fontValue.family?.split(",").map((fontFamily) => `"${fontFamily.replace(/['"]+/g, "")}"`).join(",") || "serif"}${fontValue.cssVariableName ? ")" : ""}`;
|
|
410
|
-
}
|
|
411
|
-
function parseColorString(colorPickerValue) {
|
|
412
|
-
if (!colorPickerValue) {
|
|
413
|
-
return null;
|
|
414
|
-
}
|
|
415
|
-
const colorString = colorPickerValue;
|
|
416
|
-
const match = colorString.match(/var\((--[\w-]+),\s*(.+)\)/);
|
|
417
|
-
if (match) {
|
|
418
|
-
return {
|
|
419
|
-
cssVariableName: match[1],
|
|
420
|
-
color: match[2]
|
|
421
|
-
};
|
|
422
|
-
} else {
|
|
423
|
-
return {
|
|
424
|
-
color: colorString
|
|
425
|
-
};
|
|
426
|
-
}
|
|
427
|
-
}
|
|
428
|
-
function colorValueToCSS(colorValue) {
|
|
429
|
-
if (!colorValue) {
|
|
430
|
-
return "";
|
|
431
|
-
}
|
|
432
|
-
return colorValue.cssVariableName ? `var(${colorValue.cssVariableName}, ${colorValue.color})` : colorValue.color;
|
|
433
|
-
}
|
|
434
|
-
const fonts = {
|
|
435
|
-
transformFontInternalValue: (value) => {
|
|
436
|
-
if (value) {
|
|
437
|
-
const { theme, cssVariableName, bold, italic, underline, ...rest } = value;
|
|
438
|
-
return {
|
|
439
|
-
...rest,
|
|
440
|
-
style: {
|
|
441
|
-
bold,
|
|
442
|
-
italic,
|
|
443
|
-
underline
|
|
444
|
-
},
|
|
445
|
-
editorKey: cssVariableName || theme || ""
|
|
446
|
-
};
|
|
447
|
-
} else {
|
|
448
|
-
return {
|
|
449
|
-
editorKey: "font_7",
|
|
450
|
-
family: "helvetica-w01-roman",
|
|
451
|
-
size: 16,
|
|
452
|
-
style: {}
|
|
453
|
-
};
|
|
454
|
-
}
|
|
455
|
-
}
|
|
456
|
-
};
|
|
457
|
-
class InputsSDKShape extends BaseSDKShape {
|
|
458
|
-
async selectColor(value, options) {
|
|
459
|
-
const privateAPI = await this.getPlatformPrivateAPI();
|
|
460
|
-
let colorValue = parseColorString(value);
|
|
461
|
-
let colorResult = colorValueToCSS(colorValue);
|
|
462
|
-
await privateAPI.inputs.openColorPicker(
|
|
463
|
-
{
|
|
464
|
-
color: colorValue?.cssVariableName || colorValue?.theme || colorValue?.color
|
|
465
|
-
},
|
|
466
|
-
({
|
|
467
|
-
color,
|
|
468
|
-
theme,
|
|
469
|
-
cssVariableTheme
|
|
470
|
-
}) => {
|
|
471
|
-
colorValue = {
|
|
472
|
-
color,
|
|
473
|
-
theme,
|
|
474
|
-
cssVariableName: cssVariableTheme
|
|
475
|
-
};
|
|
476
|
-
colorResult = colorValueToCSS(colorValue);
|
|
477
|
-
options?.onChange?.(colorResult);
|
|
478
|
-
}
|
|
479
|
-
);
|
|
480
|
-
return colorResult;
|
|
481
|
-
}
|
|
482
|
-
async selectFont(value, options) {
|
|
483
|
-
const privateAPI = await this.getPlatformPrivateAPI();
|
|
484
|
-
const fontValue = parseFontString(value);
|
|
485
|
-
let _value = value;
|
|
486
|
-
await privateAPI.inputs.openFontPickerV2(
|
|
487
|
-
{
|
|
488
|
-
...options,
|
|
489
|
-
panelSectionsDefinition: {
|
|
490
|
-
htmlTag: "hidden"
|
|
491
|
-
},
|
|
492
|
-
componentStyle: fonts.transformFontInternalValue(fontValue)
|
|
493
|
-
},
|
|
494
|
-
(font, accessibility) => {
|
|
495
|
-
_value = {
|
|
496
|
-
font: fontValueToCSS(font),
|
|
497
|
-
textDecoration: font.underline ? UNDERLINE_DEFINITION : void 0
|
|
498
|
-
};
|
|
499
|
-
options?.onChange?.(_value);
|
|
500
|
-
}
|
|
501
|
-
);
|
|
502
|
-
return _value;
|
|
503
|
-
}
|
|
504
|
-
}
|
|
505
|
-
var index$8 = new PlatformSDKShape(InputsSDKShape).withPublicMethod("selectColor").withPublicMethod("selectFont").build();
|
|
506
|
-
|
|
507
|
-
class PanelsSDKShape extends BaseSDKShape {
|
|
508
|
-
async openLanguageSupportPanel() {
|
|
509
|
-
const privateAPI = await this.getPlatformPrivateAPI();
|
|
510
|
-
return privateAPI.panels.openLanguageSupportPanel();
|
|
511
|
-
}
|
|
512
|
-
async openFontsUploadPanel() {
|
|
513
|
-
const privateAPI = await this.getPlatformPrivateAPI();
|
|
514
|
-
return privateAPI.panels.openFontsUploadPanel();
|
|
515
|
-
}
|
|
516
|
-
}
|
|
517
|
-
var index$7 = new PlatformSDKShape(PanelsSDKShape).withPublicMethod("openLanguageSupportPanel").withPublicMethod("openFontsUploadPanel").build();
|
|
518
|
-
|
|
519
|
-
class ModalsSDKShape extends BaseSDKShape {
|
|
520
|
-
async openDashboardModal(options) {
|
|
521
|
-
const privateAPI = await this.getPlatformPrivateAPI();
|
|
522
|
-
return privateAPI.panels.openDashboardPanel(
|
|
523
|
-
await this.getAppDefinitionId(),
|
|
524
|
-
options
|
|
525
|
-
);
|
|
526
|
-
}
|
|
527
|
-
}
|
|
528
|
-
var index$6 = new PlatformSDKShape(ModalsSDKShape).withPublicMethod("openDashboardModal").build();
|
|
529
|
-
|
|
530
180
|
class ElementSDKShape extends BaseSDKShape {
|
|
531
|
-
constructor(overriddenApplicationContext = null, childPath = []) {
|
|
181
|
+
constructor(overriddenApplicationContext = null, childPath = [], overrides = {}) {
|
|
532
182
|
super(overriddenApplicationContext);
|
|
533
183
|
this.overriddenApplicationContext = overriddenApplicationContext;
|
|
534
184
|
this.childPath = childPath;
|
|
185
|
+
this.type = overrides.type ?? null;
|
|
186
|
+
this.compRef = overrides.compRef;
|
|
187
|
+
this.#manifestContextIdOverride = overrides.manifestContextId;
|
|
188
|
+
}
|
|
189
|
+
type;
|
|
190
|
+
compRef;
|
|
191
|
+
#manifestContextIdOverride;
|
|
192
|
+
async getManifestContextId() {
|
|
193
|
+
return this.#manifestContextIdOverride ?? (await this.getApplicationContext()).getManifestContextId();
|
|
194
|
+
}
|
|
195
|
+
/**
|
|
196
|
+
* Reads a single data-item value by key. Equivalent to `(await getData())[prop]`.
|
|
197
|
+
* Provided for interface parity with elements.getSelection() results.
|
|
198
|
+
*/
|
|
199
|
+
async getProp(prop) {
|
|
200
|
+
const data = await this.getData();
|
|
201
|
+
return data?.[prop];
|
|
202
|
+
}
|
|
203
|
+
/**
|
|
204
|
+
* Writes a single data-item value by key. Equivalent to
|
|
205
|
+
* `setData({ [prop]: value })`. Other data items are left unchanged.
|
|
206
|
+
*/
|
|
207
|
+
async setProp(prop, value) {
|
|
208
|
+
await this.setData({ [prop]: value });
|
|
535
209
|
}
|
|
536
210
|
/**
|
|
537
211
|
* Retrieves the style definitions declared in the component's manifest,
|
|
@@ -1075,207 +749,607 @@ class ElementSDKShape extends BaseSDKShape {
|
|
|
1075
749
|
* ```ts
|
|
1076
750
|
* import { element } from '@wix/editor';
|
|
1077
751
|
*
|
|
1078
|
-
* const color = await element.selectColor({ styleItemKey: 'backgroundColor' });
|
|
1079
|
-
*
|
|
1080
|
-
* const color = await element.selectColor({
|
|
1081
|
-
* initialValue: '#ff0000',
|
|
1082
|
-
* mode: ['solid', 'gradient'],
|
|
1083
|
-
* showOpacity: true,
|
|
1084
|
-
* onChange: (color) => console.log('Preview:', color),
|
|
1085
|
-
* onApply: (color) => console.log('Applied:', color),
|
|
1086
|
-
* });
|
|
752
|
+
* const color = await element.selectColor({ styleItemKey: 'backgroundColor' });
|
|
753
|
+
*
|
|
754
|
+
* const color = await element.selectColor({
|
|
755
|
+
* initialValue: '#ff0000',
|
|
756
|
+
* mode: ['solid', 'gradient'],
|
|
757
|
+
* showOpacity: true,
|
|
758
|
+
* onChange: (color) => console.log('Preview:', color),
|
|
759
|
+
* onApply: (color) => console.log('Applied:', color),
|
|
760
|
+
* });
|
|
761
|
+
* ```
|
|
762
|
+
*/
|
|
763
|
+
async selectColor(params) {
|
|
764
|
+
const privateAPI = await this.getPlatformPrivateAPI();
|
|
765
|
+
try {
|
|
766
|
+
const manifestContextId = await this.getRequiredManifestContextId();
|
|
767
|
+
const selectedColor = await privateAPI.builderComponent.selectColor(
|
|
768
|
+
manifestContextId,
|
|
769
|
+
this.childPath,
|
|
770
|
+
params
|
|
771
|
+
);
|
|
772
|
+
return selectedColor;
|
|
773
|
+
} catch (error) {
|
|
774
|
+
}
|
|
775
|
+
}
|
|
776
|
+
/**
|
|
777
|
+
* Opens the background picker for selecting a background fill
|
|
778
|
+
* (color, gradient, or image).
|
|
779
|
+
*
|
|
780
|
+
* @param options - Background picker configuration.
|
|
781
|
+
* @returns Selected background fill value.
|
|
782
|
+
*
|
|
783
|
+
* @example
|
|
784
|
+
* ```ts
|
|
785
|
+
* import { element } from '@wix/editor';
|
|
786
|
+
*
|
|
787
|
+
* const bg = await element.selectBackground({
|
|
788
|
+
* initialValue: { backgroundColor: '#fff', backgroundImage: '' },
|
|
789
|
+
* onChange: (value) => console.log('Preview:', value),
|
|
790
|
+
* });
|
|
791
|
+
* ```
|
|
792
|
+
*/
|
|
793
|
+
async selectBackground(options) {
|
|
794
|
+
const privateAPI = await this.getPlatformPrivateAPI();
|
|
795
|
+
const manifestContextId = await this.getRequiredManifestContextId();
|
|
796
|
+
return privateAPI.builderComponent.selectBackground(
|
|
797
|
+
manifestContextId,
|
|
798
|
+
this.childPath,
|
|
799
|
+
options
|
|
800
|
+
);
|
|
801
|
+
}
|
|
802
|
+
/**
|
|
803
|
+
* Opens the font weight picker for selecting a font weight for a specified
|
|
804
|
+
* font family.
|
|
805
|
+
*
|
|
806
|
+
* Pass manifest style item keys to bind the picker, or pass manual
|
|
807
|
+
* options to handle the selection via callbacks.
|
|
808
|
+
*
|
|
809
|
+
* @param params - Manifest style item keys, or manual picker options.
|
|
810
|
+
* @returns Selected font weight.
|
|
811
|
+
*
|
|
812
|
+
* @example
|
|
813
|
+
* ```ts
|
|
814
|
+
* import { element } from '@wix/editor';
|
|
815
|
+
*
|
|
816
|
+
* const weight = await element.selectFontWeight({
|
|
817
|
+
* fontFamilyStyleItemKey: 'headingFontFamily',
|
|
818
|
+
* fontWeightStyleItemKey: 'headingFontWeight',
|
|
819
|
+
* });
|
|
820
|
+
*
|
|
821
|
+
* const weight = await element.selectFontWeight({
|
|
822
|
+
* fontFamily: { family: 'Arial', weight: '400' },
|
|
823
|
+
* onChange: (value) => console.log('Selected weight:', value.weight),
|
|
824
|
+
* });
|
|
825
|
+
* ```
|
|
826
|
+
*/
|
|
827
|
+
async selectFontWeight(params) {
|
|
828
|
+
const privateAPI = await this.getPlatformPrivateAPI();
|
|
829
|
+
const manifestContextId = await this.getRequiredManifestContextId();
|
|
830
|
+
return {
|
|
831
|
+
weight: await privateAPI.builderComponent.selectFontWeight(
|
|
832
|
+
manifestContextId,
|
|
833
|
+
this.childPath,
|
|
834
|
+
params
|
|
835
|
+
)
|
|
836
|
+
};
|
|
837
|
+
}
|
|
838
|
+
/**
|
|
839
|
+
* Opens the text theme picker for selecting a predefined text theme
|
|
840
|
+
* (a combination of font and color from the site's theme).
|
|
841
|
+
*
|
|
842
|
+
* @param params - Text theme picker configuration.
|
|
843
|
+
* @param params.target - HTML element to anchor the picker to.
|
|
844
|
+
* @param params.initialValue - Initial font and color values.
|
|
845
|
+
* @returns Selected text theme.
|
|
846
|
+
*
|
|
847
|
+
* @example
|
|
848
|
+
* ```ts
|
|
849
|
+
* import { element } from '@wix/editor';
|
|
850
|
+
*
|
|
851
|
+
* const theme = await element.selectTextTheme({
|
|
852
|
+
* initialValue: { font: 'Heading 1', color: '#333' },
|
|
853
|
+
* });
|
|
854
|
+
* ```
|
|
855
|
+
*/
|
|
856
|
+
async selectTextTheme(params) {
|
|
857
|
+
const privateAPI = await this.getPlatformPrivateAPI();
|
|
858
|
+
const manifestContextId = await this.getRequiredManifestContextId();
|
|
859
|
+
return privateAPI.builderComponent.selectTextTheme(
|
|
860
|
+
manifestContextId,
|
|
861
|
+
params
|
|
862
|
+
);
|
|
863
|
+
}
|
|
864
|
+
/**
|
|
865
|
+
* Retrieves the currently selected index in an array items data group.
|
|
866
|
+
*
|
|
867
|
+
* @param options - Specify `arrayItemsDisplayGroupKey` if the component
|
|
868
|
+
* has multiple array item groups.
|
|
869
|
+
* @returns Index of the currently selected array item.
|
|
870
|
+
*
|
|
871
|
+
* @example
|
|
872
|
+
* ```ts
|
|
873
|
+
* import { element } from '@wix/editor';
|
|
874
|
+
*
|
|
875
|
+
* const index = await element.getArrayItemsSelectedIndex();
|
|
876
|
+
* ```
|
|
877
|
+
*/
|
|
878
|
+
async getArrayItemsSelectedIndex(options) {
|
|
879
|
+
const privateAPI = await this.getPlatformPrivateAPI();
|
|
880
|
+
const manifestContextId = await this.getRequiredManifestContextId();
|
|
881
|
+
return privateAPI.builderComponent.getArrayItemsSelectedIndex(
|
|
882
|
+
manifestContextId,
|
|
883
|
+
this.childPath,
|
|
884
|
+
options
|
|
885
|
+
);
|
|
886
|
+
}
|
|
887
|
+
/**
|
|
888
|
+
* Sets the selected index in an array items data group.
|
|
889
|
+
*
|
|
890
|
+
* @param options - Object containing the `index` to select, and optionally
|
|
891
|
+
* `arrayItemsDisplayGroupKey` if there are multiple array item groups.
|
|
892
|
+
*
|
|
893
|
+
* @example
|
|
894
|
+
* ```ts
|
|
895
|
+
* import { element } from '@wix/editor';
|
|
896
|
+
*
|
|
897
|
+
* await element.setArrayItemsSelectedIndex({ index: 2 });
|
|
898
|
+
* ```
|
|
899
|
+
*/
|
|
900
|
+
async setArrayItemsSelectedIndex(options) {
|
|
901
|
+
const privateAPI = await this.getPlatformPrivateAPI();
|
|
902
|
+
const manifestContextId = await this.getRequiredManifestContextId();
|
|
903
|
+
return privateAPI.builderComponent.setArrayItemsSelectedIndex(
|
|
904
|
+
manifestContextId,
|
|
905
|
+
this.childPath,
|
|
906
|
+
options
|
|
907
|
+
);
|
|
908
|
+
}
|
|
909
|
+
/**
|
|
910
|
+
* Resets the selected index in an array items data group to the default.
|
|
911
|
+
*
|
|
912
|
+
* @param options - Specify `arrayItemsDisplayGroupKey` if the component
|
|
913
|
+
* has multiple array item groups.
|
|
914
|
+
*
|
|
915
|
+
* @example
|
|
916
|
+
* ```ts
|
|
917
|
+
* import { element } from '@wix/editor';
|
|
918
|
+
*
|
|
919
|
+
* await element.resetArrayItemsSelectedIndex();
|
|
1087
920
|
* ```
|
|
1088
921
|
*/
|
|
1089
|
-
async
|
|
922
|
+
async resetArrayItemsSelectedIndex(options) {
|
|
1090
923
|
const privateAPI = await this.getPlatformPrivateAPI();
|
|
1091
|
-
|
|
1092
|
-
|
|
1093
|
-
|
|
1094
|
-
|
|
1095
|
-
|
|
1096
|
-
|
|
1097
|
-
);
|
|
1098
|
-
return selectedColor;
|
|
1099
|
-
} catch (error) {
|
|
1100
|
-
}
|
|
924
|
+
const manifestContextId = await this.getRequiredManifestContextId();
|
|
925
|
+
return privateAPI.builderComponent.resetArrayItemsSelectedIndex(
|
|
926
|
+
manifestContextId,
|
|
927
|
+
this.childPath,
|
|
928
|
+
options
|
|
929
|
+
);
|
|
1101
930
|
}
|
|
1102
931
|
/**
|
|
1103
|
-
*
|
|
1104
|
-
* (color, gradient, or image).
|
|
932
|
+
* Retrieves the BI (Business Intelligence) token for the component.
|
|
1105
933
|
*
|
|
1106
|
-
* @
|
|
1107
|
-
* @returns Selected background fill value.
|
|
934
|
+
* @returns BI token string.
|
|
1108
935
|
*
|
|
1109
936
|
* @example
|
|
1110
937
|
* ```ts
|
|
1111
938
|
* import { element } from '@wix/editor';
|
|
1112
939
|
*
|
|
1113
|
-
* const
|
|
1114
|
-
* initialValue: { backgroundColor: '#fff', backgroundImage: '' },
|
|
1115
|
-
* onChange: (value) => console.log('Preview:', value),
|
|
1116
|
-
* });
|
|
940
|
+
* const token = await element.getBiToken();
|
|
1117
941
|
* ```
|
|
1118
942
|
*/
|
|
1119
|
-
async
|
|
943
|
+
async getBiToken() {
|
|
944
|
+
const privateAPI = await this.getPlatformPrivateAPI();
|
|
945
|
+
const manifestContextId = await this.getRequiredManifestContextId();
|
|
946
|
+
return privateAPI.builderComponent.getBiToken(
|
|
947
|
+
manifestContextId,
|
|
948
|
+
this.childPath
|
|
949
|
+
);
|
|
950
|
+
}
|
|
951
|
+
}
|
|
952
|
+
var index$b = new PlatformSDKShape(ElementSDKShape).withPublicMethod("getProp").withPublicMethod("setProp").withPublicMethod("getDataDefinitions").withPublicMethod("getData").withPublicMethod("getResolvedData").withPublicMethod("setData").withPublicMethod("getStyleDefinitions").withPublicMethod("getStyles").withPublicMethod("setStyles").withPublicMethod("removeStyles").withPublicMethod("getPresetDefinitions").withPublicMethod("getAppliedPreset").withPublicMethod("applyPreset").withPublicMethod("getDisplayGroupDefinitions").withPublicMethod("getDisplayName").withPublicMethod("getState").withPublicMethod("setState").withPublicMethod("onChange").withPublicMethod("getStateDefinitions").withPublicMethod("selectFont").withPublicMethod("selectFontFamily").withPublicMethod("selectMedia").withPublicMethod("selectLink").withPublicMethod("selectColor").withPublicMethod("selectBackground").withPublicMethod("selectFontWeight").withPublicMethod("selectTextTheme").withPublicMethod("getArrayItemsSelectedIndex").withPublicMethod("setArrayItemsSelectedIndex").withPublicMethod("resetArrayItemsSelectedIndex").withPublicMethod("getBiToken").build();
|
|
953
|
+
|
|
954
|
+
function createSelectedBuilderElement(element) {
|
|
955
|
+
const facade = {
|
|
956
|
+
type: element.type,
|
|
957
|
+
getProp: element.getProp.bind(element),
|
|
958
|
+
setProp: element.setProp.bind(element),
|
|
959
|
+
getDataDefinitions: element.getDataDefinitions.bind(element),
|
|
960
|
+
getData: element.getData.bind(element),
|
|
961
|
+
getResolvedData: element.getResolvedData.bind(element),
|
|
962
|
+
setData: element.setData.bind(element),
|
|
963
|
+
getStyleDefinitions: element.getStyleDefinitions.bind(element),
|
|
964
|
+
getStyles: element.getStyles.bind(element),
|
|
965
|
+
setStyles: element.setStyles.bind(element),
|
|
966
|
+
removeStyles: element.removeStyles.bind(element),
|
|
967
|
+
getPresetDefinitions: element.getPresetDefinitions.bind(element),
|
|
968
|
+
getAppliedPreset: element.getAppliedPreset.bind(element),
|
|
969
|
+
applyPreset: element.applyPreset.bind(element),
|
|
970
|
+
getDisplayGroupDefinitions: element.getDisplayGroupDefinitions.bind(element),
|
|
971
|
+
getDisplayName: element.getDisplayName.bind(element),
|
|
972
|
+
getState: element.getState.bind(element),
|
|
973
|
+
setState: element.setState.bind(element),
|
|
974
|
+
onChange: element.onChange.bind(element),
|
|
975
|
+
getStateDefinitions: element.getStateDefinitions.bind(element),
|
|
976
|
+
selectFont: element.selectFont.bind(element),
|
|
977
|
+
selectFontFamily: element.selectFontFamily.bind(element),
|
|
978
|
+
selectMedia: element.selectMedia.bind(element),
|
|
979
|
+
selectLink: element.selectLink.bind(element),
|
|
980
|
+
selectColor: element.selectColor.bind(element),
|
|
981
|
+
selectBackground: element.selectBackground.bind(element),
|
|
982
|
+
selectFontWeight: element.selectFontWeight.bind(element),
|
|
983
|
+
selectTextTheme: element.selectTextTheme.bind(element),
|
|
984
|
+
getArrayItemsSelectedIndex: element.getArrayItemsSelectedIndex.bind(element),
|
|
985
|
+
setArrayItemsSelectedIndex: element.setArrayItemsSelectedIndex.bind(element),
|
|
986
|
+
resetArrayItemsSelectedIndex: element.resetArrayItemsSelectedIndex.bind(element),
|
|
987
|
+
getBiToken: element.getBiToken.bind(element)
|
|
988
|
+
};
|
|
989
|
+
return facade;
|
|
990
|
+
}
|
|
991
|
+
|
|
992
|
+
class ElementsSDKShape extends BaseSDKShape {
|
|
993
|
+
async getSelection() {
|
|
994
|
+
const privateAPI = await this.getPlatformPrivateAPI();
|
|
995
|
+
const refs = await privateAPI.components.getSelectedComponents();
|
|
996
|
+
return Promise.all(
|
|
997
|
+
refs.map(async (ref) => {
|
|
998
|
+
const builderCtx = await privateAPI.components.getBuilderContext(ref);
|
|
999
|
+
if (builderCtx) {
|
|
1000
|
+
const builderElement = new ElementSDKShape(
|
|
1001
|
+
this.getApplicationContext(),
|
|
1002
|
+
[],
|
|
1003
|
+
{
|
|
1004
|
+
manifestContextId: builderCtx.manifestContextId,
|
|
1005
|
+
type: builderCtx.compType
|
|
1006
|
+
}
|
|
1007
|
+
);
|
|
1008
|
+
return createSelectedBuilderElement(builderElement);
|
|
1009
|
+
}
|
|
1010
|
+
return privateAPI.components.getComponent(ref);
|
|
1011
|
+
})
|
|
1012
|
+
);
|
|
1013
|
+
}
|
|
1014
|
+
async onSelectionChange(cb) {
|
|
1015
|
+
const events = new EventsSDKShape(this.getApplicationContext());
|
|
1016
|
+
void events.addEventListener("componentSelectionChanged", async () => {
|
|
1017
|
+
cb(await this.getSelection());
|
|
1018
|
+
});
|
|
1019
|
+
}
|
|
1020
|
+
}
|
|
1021
|
+
var index$a = new PlatformSDKShape(ElementsSDKShape).withPublicMethod("onSelectionChange").withPublicMethod("getSelection").build();
|
|
1022
|
+
|
|
1023
|
+
class InfoSDKShape extends BaseSDKShape {
|
|
1024
|
+
async getViewMode() {
|
|
1025
|
+
const privateAPI = await this.getPlatformPrivateAPI();
|
|
1026
|
+
return privateAPI.info.getViewMode();
|
|
1027
|
+
}
|
|
1028
|
+
async getLanguageCode() {
|
|
1029
|
+
const privateAPI = await this.getPlatformPrivateAPI();
|
|
1030
|
+
return privateAPI.info.getLanguageCode();
|
|
1031
|
+
}
|
|
1032
|
+
async getSiteDirection() {
|
|
1033
|
+
const privateAPI = await this.getPlatformPrivateAPI();
|
|
1034
|
+
return privateAPI.info.getSiteDirection();
|
|
1035
|
+
}
|
|
1036
|
+
async siteHasCustomClasses() {
|
|
1037
|
+
const privateAPI = await this.getPlatformPrivateAPI();
|
|
1038
|
+
return privateAPI.info.siteHasCustomClasses();
|
|
1039
|
+
}
|
|
1040
|
+
async getThemeCustomProperties(filter) {
|
|
1041
|
+
const privateAPI = await this.getPlatformPrivateAPI();
|
|
1042
|
+
return privateAPI.info.getThemeCustomProperties(filter);
|
|
1043
|
+
}
|
|
1044
|
+
async getSiteFonts(filter) {
|
|
1045
|
+
const privateAPI = await this.getPlatformPrivateAPI();
|
|
1046
|
+
return privateAPI.info.getSiteFonts(filter);
|
|
1047
|
+
}
|
|
1048
|
+
async getMetaSiteId() {
|
|
1049
|
+
const privateAPI = await this.getPlatformPrivateAPI();
|
|
1050
|
+
return privateAPI.info.getMetaSiteId();
|
|
1051
|
+
}
|
|
1052
|
+
}
|
|
1053
|
+
var index$9 = new PlatformSDKShape(InfoSDKShape).withPublicMethod("getViewMode").withPublicMethod("getLanguageCode").withPublicMethod("getSiteDirection").withPublicMethod("siteHasCustomClasses").withPublicMethod("getThemeCustomProperties").withPublicMethod("getSiteFonts").withPublicMethod("getMetaSiteId").build();
|
|
1054
|
+
|
|
1055
|
+
var WidgetShapeErrorCode = /* @__PURE__ */ ((WidgetShapeErrorCode2) => {
|
|
1056
|
+
WidgetShapeErrorCode2["UndefinedCompRef"] = "UndefinedCompRef";
|
|
1057
|
+
WidgetShapeErrorCode2["NotAvailableMethod"] = "NotAvailableMethod";
|
|
1058
|
+
return WidgetShapeErrorCode2;
|
|
1059
|
+
})(WidgetShapeErrorCode || {});
|
|
1060
|
+
class WidgetShapeError extends publicEditorPlatformErrors.BaseError {
|
|
1061
|
+
constructor(message, code) {
|
|
1062
|
+
super(message, code, "Widget Error");
|
|
1063
|
+
}
|
|
1064
|
+
}
|
|
1065
|
+
const createWidgetShapeError = publicEditorPlatformErrors.createErrorBuilder(WidgetShapeError);
|
|
1066
|
+
|
|
1067
|
+
const UNDERLINE_DEFINITION = "underline";
|
|
1068
|
+
function getFontFamiliesFromFonts(fonts) {
|
|
1069
|
+
return fonts.map((font) => parseFontString({ font }).family).filter(Boolean);
|
|
1070
|
+
}
|
|
1071
|
+
function parseFontString(fontPickerValue) {
|
|
1072
|
+
const font = {
|
|
1073
|
+
family: void 0,
|
|
1074
|
+
size: void 0
|
|
1075
|
+
};
|
|
1076
|
+
if (fontPickerValue?.font) {
|
|
1077
|
+
const { variableName, fallbackValue } = extractFontVar(
|
|
1078
|
+
fontPickerValue.font
|
|
1079
|
+
);
|
|
1080
|
+
font.cssVariableName = variableName;
|
|
1081
|
+
const parts = fallbackValue.match(/(?:(["']).*?\1|\S)+/g) || [];
|
|
1082
|
+
for (let i = 0; i < parts.length; i++) {
|
|
1083
|
+
const part = parts[i];
|
|
1084
|
+
switch (part) {
|
|
1085
|
+
case "bold":
|
|
1086
|
+
font.bold = true;
|
|
1087
|
+
break;
|
|
1088
|
+
case "italic":
|
|
1089
|
+
font.italic = true;
|
|
1090
|
+
break;
|
|
1091
|
+
default:
|
|
1092
|
+
if (part?.endsWith("px")) {
|
|
1093
|
+
font.size = parseInt(part, 10);
|
|
1094
|
+
} else if (i === parts.length - 1) {
|
|
1095
|
+
font.family = part;
|
|
1096
|
+
} else {
|
|
1097
|
+
font.family = (font.family || "") + " " + part;
|
|
1098
|
+
}
|
|
1099
|
+
}
|
|
1100
|
+
}
|
|
1101
|
+
}
|
|
1102
|
+
if (fontPickerValue?.textDecoration) {
|
|
1103
|
+
font.underline = fontPickerValue.textDecoration === UNDERLINE_DEFINITION;
|
|
1104
|
+
}
|
|
1105
|
+
font.family = font.family?.trim().replace(/['"]+/g, "");
|
|
1106
|
+
return font;
|
|
1107
|
+
}
|
|
1108
|
+
function extractFontVar(fontString) {
|
|
1109
|
+
const trimmedFont = fontString.trim();
|
|
1110
|
+
const match = trimmedFont.match(/var\((--[\w-]+),\s*(.+)\)/);
|
|
1111
|
+
if (match) {
|
|
1112
|
+
return {
|
|
1113
|
+
variableName: match[1],
|
|
1114
|
+
fallbackValue: match[2]?.trim() ?? ""
|
|
1115
|
+
};
|
|
1116
|
+
} else {
|
|
1117
|
+
return {
|
|
1118
|
+
variableName: void 0,
|
|
1119
|
+
fallbackValue: trimmedFont
|
|
1120
|
+
};
|
|
1121
|
+
}
|
|
1122
|
+
}
|
|
1123
|
+
|
|
1124
|
+
class WidgetScopedSDK {
|
|
1125
|
+
constructor(compRef, privateAPI) {
|
|
1126
|
+
this.compRef = compRef;
|
|
1127
|
+
this.privateAPI = privateAPI;
|
|
1128
|
+
}
|
|
1129
|
+
async getProp(propName) {
|
|
1130
|
+
const props = await this.privateAPI.refComponents.getProps(this.compRef);
|
|
1131
|
+
return props?.[propName];
|
|
1132
|
+
}
|
|
1133
|
+
async setProp(propName, value) {
|
|
1134
|
+
await this.privateAPI.refComponents.setProps(this.compRef, {
|
|
1135
|
+
[propName]: value
|
|
1136
|
+
});
|
|
1137
|
+
}
|
|
1138
|
+
async getDesignPreset() {
|
|
1139
|
+
return this.privateAPI.designPresets.getDesignPresetName(this.compRef);
|
|
1140
|
+
}
|
|
1141
|
+
async setDesignPreset(designPresetName) {
|
|
1142
|
+
await this.privateAPI.designPresets.setDesignPresetByName(
|
|
1143
|
+
this.compRef,
|
|
1144
|
+
designPresetName
|
|
1145
|
+
);
|
|
1146
|
+
}
|
|
1147
|
+
async getNestedWidget(selector) {
|
|
1148
|
+
const childCompRef = await this.privateAPI.refComponents.findComponentBySelector(
|
|
1149
|
+
this.compRef,
|
|
1150
|
+
selector
|
|
1151
|
+
);
|
|
1152
|
+
if (!childCompRef) {
|
|
1153
|
+
return null;
|
|
1154
|
+
}
|
|
1155
|
+
return new WidgetScopedSDK(childCompRef, this.privateAPI);
|
|
1156
|
+
}
|
|
1157
|
+
}
|
|
1158
|
+
class WidgetSDKShape extends BaseSDKShape {
|
|
1159
|
+
async #getSelectedComponentRef() {
|
|
1160
|
+
const privateAPI = await this.getPlatformPrivateAPI();
|
|
1161
|
+
const refs = await privateAPI.components.getSelectedComponents();
|
|
1162
|
+
const compRef = refs[0];
|
|
1163
|
+
if (!compRef) {
|
|
1164
|
+
throw createWidgetShapeError(WidgetShapeErrorCode.UndefinedCompRef);
|
|
1165
|
+
}
|
|
1166
|
+
return compRef;
|
|
1167
|
+
}
|
|
1168
|
+
async setPreloadFonts(fonts) {
|
|
1169
|
+
const privateAPI = await this.getPlatformPrivateAPI();
|
|
1170
|
+
const compRef = await this.#getSelectedComponentRef();
|
|
1171
|
+
if (await privateAPI.refComponents.isRefComponent(compRef)) {
|
|
1172
|
+
throw createWidgetShapeError(
|
|
1173
|
+
WidgetShapeErrorCode.NotAvailableMethod,
|
|
1174
|
+
"not available for the current component type"
|
|
1175
|
+
);
|
|
1176
|
+
}
|
|
1177
|
+
const fontFamilies = getFontFamiliesFromFonts(fonts);
|
|
1178
|
+
await privateAPI.customElement.setPreloadFonts(compRef, fontFamilies);
|
|
1179
|
+
}
|
|
1180
|
+
async getProp(propName) {
|
|
1181
|
+
const privateAPI = await this.getPlatformPrivateAPI();
|
|
1182
|
+
const compRef = await this.#getSelectedComponentRef();
|
|
1183
|
+
if (await privateAPI.refComponents.isRefComponent(compRef)) {
|
|
1184
|
+
return new WidgetScopedSDK(compRef, privateAPI).getProp(propName);
|
|
1185
|
+
} else {
|
|
1186
|
+
return privateAPI.customElement.getAttribute(compRef, propName);
|
|
1187
|
+
}
|
|
1188
|
+
}
|
|
1189
|
+
async setProp(propName, value) {
|
|
1190
|
+
const privateAPI = await this.getPlatformPrivateAPI();
|
|
1191
|
+
const compRef = await this.#getSelectedComponentRef();
|
|
1192
|
+
if (await privateAPI.refComponents.isRefComponent(compRef)) {
|
|
1193
|
+
return new WidgetScopedSDK(compRef, privateAPI).setProp(propName, value);
|
|
1194
|
+
} else {
|
|
1195
|
+
await privateAPI.customElement.setAttribute(compRef, propName, value);
|
|
1196
|
+
}
|
|
1197
|
+
}
|
|
1198
|
+
async getDesignPreset() {
|
|
1199
|
+
const privateAPI = await this.getPlatformPrivateAPI();
|
|
1200
|
+
const compRef = await this.#getSelectedComponentRef();
|
|
1201
|
+
if (!await privateAPI.refComponents.isRefComponent(compRef)) {
|
|
1202
|
+
throw createWidgetShapeError(
|
|
1203
|
+
WidgetShapeErrorCode.NotAvailableMethod,
|
|
1204
|
+
"not available for the current component type"
|
|
1205
|
+
);
|
|
1206
|
+
}
|
|
1207
|
+
return new WidgetScopedSDK(compRef, privateAPI).getDesignPreset();
|
|
1208
|
+
}
|
|
1209
|
+
async setDesignPreset(designPresetName) {
|
|
1120
1210
|
const privateAPI = await this.getPlatformPrivateAPI();
|
|
1121
|
-
const
|
|
1122
|
-
|
|
1123
|
-
|
|
1124
|
-
|
|
1125
|
-
|
|
1211
|
+
const compRef = await this.#getSelectedComponentRef();
|
|
1212
|
+
if (!await privateAPI.refComponents.isRefComponent(compRef)) {
|
|
1213
|
+
throw createWidgetShapeError(
|
|
1214
|
+
WidgetShapeErrorCode.NotAvailableMethod,
|
|
1215
|
+
"not available for the current component type"
|
|
1216
|
+
);
|
|
1217
|
+
}
|
|
1218
|
+
return new WidgetScopedSDK(compRef, privateAPI).setDesignPreset(
|
|
1219
|
+
designPresetName
|
|
1126
1220
|
);
|
|
1127
1221
|
}
|
|
1128
|
-
|
|
1129
|
-
* Opens the font weight picker for selecting a font weight for a specified
|
|
1130
|
-
* font family.
|
|
1131
|
-
*
|
|
1132
|
-
* Pass manifest style item keys to bind the picker, or pass manual
|
|
1133
|
-
* options to handle the selection via callbacks.
|
|
1134
|
-
*
|
|
1135
|
-
* @param params - Manifest style item keys, or manual picker options.
|
|
1136
|
-
* @returns Selected font weight.
|
|
1137
|
-
*
|
|
1138
|
-
* @example
|
|
1139
|
-
* ```ts
|
|
1140
|
-
* import { element } from '@wix/editor';
|
|
1141
|
-
*
|
|
1142
|
-
* const weight = await element.selectFontWeight({
|
|
1143
|
-
* fontFamilyStyleItemKey: 'headingFontFamily',
|
|
1144
|
-
* fontWeightStyleItemKey: 'headingFontWeight',
|
|
1145
|
-
* });
|
|
1146
|
-
*
|
|
1147
|
-
* const weight = await element.selectFontWeight({
|
|
1148
|
-
* fontFamily: { family: 'Arial', weight: '400' },
|
|
1149
|
-
* onChange: (value) => console.log('Selected weight:', value.weight),
|
|
1150
|
-
* });
|
|
1151
|
-
* ```
|
|
1152
|
-
*/
|
|
1153
|
-
async selectFontWeight(params) {
|
|
1222
|
+
async getNestedWidget(selector) {
|
|
1154
1223
|
const privateAPI = await this.getPlatformPrivateAPI();
|
|
1155
|
-
const
|
|
1224
|
+
const compRef = await this.#getSelectedComponentRef();
|
|
1225
|
+
return new WidgetScopedSDK(compRef, privateAPI).getNestedWidget(selector);
|
|
1226
|
+
}
|
|
1227
|
+
}
|
|
1228
|
+
const widgetShape = new PlatformSDKShape(WidgetSDKShape).withPublicMethod("getNestedWidget").withPublicMethod("setDesignPreset").withPublicMethod("getDesignPreset").withPublicMethod("setProp").withPublicMethod("getProp").withPublicMethod("setPreloadFonts");
|
|
1229
|
+
var index$8 = widgetShape.build();
|
|
1230
|
+
|
|
1231
|
+
function fontValueToCSS(fontValue) {
|
|
1232
|
+
return `${fontValue.cssVariableName ? `var(${fontValue.cssVariableName}, ` : ""}${fontValue.italic ? "italic " : ""}${fontValue.bold ? "bold " : ""}${fontValue.size || 16}px ${// wrap each font family with quotes
|
|
1233
|
+
fontValue.family?.split(",").map((fontFamily) => `"${fontFamily.replace(/['"]+/g, "")}"`).join(",") || "serif"}${fontValue.cssVariableName ? ")" : ""}`;
|
|
1234
|
+
}
|
|
1235
|
+
function parseColorString(colorPickerValue) {
|
|
1236
|
+
if (!colorPickerValue) {
|
|
1237
|
+
return null;
|
|
1238
|
+
}
|
|
1239
|
+
const colorString = colorPickerValue;
|
|
1240
|
+
const match = colorString.match(/var\((--[\w-]+),\s*(.+)\)/);
|
|
1241
|
+
if (match) {
|
|
1156
1242
|
return {
|
|
1157
|
-
|
|
1158
|
-
|
|
1159
|
-
|
|
1160
|
-
|
|
1161
|
-
|
|
1243
|
+
cssVariableName: match[1],
|
|
1244
|
+
color: match[2]
|
|
1245
|
+
};
|
|
1246
|
+
} else {
|
|
1247
|
+
return {
|
|
1248
|
+
color: colorString
|
|
1162
1249
|
};
|
|
1163
1250
|
}
|
|
1164
|
-
|
|
1165
|
-
|
|
1166
|
-
|
|
1167
|
-
|
|
1168
|
-
|
|
1169
|
-
|
|
1170
|
-
|
|
1171
|
-
|
|
1172
|
-
|
|
1173
|
-
|
|
1174
|
-
|
|
1175
|
-
|
|
1176
|
-
|
|
1177
|
-
|
|
1178
|
-
|
|
1179
|
-
|
|
1180
|
-
|
|
1181
|
-
|
|
1182
|
-
|
|
1251
|
+
}
|
|
1252
|
+
function colorValueToCSS(colorValue) {
|
|
1253
|
+
if (!colorValue) {
|
|
1254
|
+
return "";
|
|
1255
|
+
}
|
|
1256
|
+
return colorValue.cssVariableName ? `var(${colorValue.cssVariableName}, ${colorValue.color})` : colorValue.color;
|
|
1257
|
+
}
|
|
1258
|
+
const fonts = {
|
|
1259
|
+
transformFontInternalValue: (value) => {
|
|
1260
|
+
if (value) {
|
|
1261
|
+
const { theme, cssVariableName, bold, italic, underline, ...rest } = value;
|
|
1262
|
+
return {
|
|
1263
|
+
...rest,
|
|
1264
|
+
style: {
|
|
1265
|
+
bold,
|
|
1266
|
+
italic,
|
|
1267
|
+
underline
|
|
1268
|
+
},
|
|
1269
|
+
editorKey: cssVariableName || theme || ""
|
|
1270
|
+
};
|
|
1271
|
+
} else {
|
|
1272
|
+
return {
|
|
1273
|
+
editorKey: "font_7",
|
|
1274
|
+
family: "helvetica-w01-roman",
|
|
1275
|
+
size: 16,
|
|
1276
|
+
style: {}
|
|
1277
|
+
};
|
|
1278
|
+
}
|
|
1279
|
+
}
|
|
1280
|
+
};
|
|
1281
|
+
class InputsSDKShape extends BaseSDKShape {
|
|
1282
|
+
async selectColor(value, options) {
|
|
1183
1283
|
const privateAPI = await this.getPlatformPrivateAPI();
|
|
1184
|
-
|
|
1185
|
-
|
|
1186
|
-
|
|
1187
|
-
|
|
1284
|
+
let colorValue = parseColorString(value);
|
|
1285
|
+
let colorResult = colorValueToCSS(colorValue);
|
|
1286
|
+
await privateAPI.inputs.openColorPicker(
|
|
1287
|
+
{
|
|
1288
|
+
color: colorValue?.cssVariableName || colorValue?.theme || colorValue?.color
|
|
1289
|
+
},
|
|
1290
|
+
({
|
|
1291
|
+
color,
|
|
1292
|
+
theme,
|
|
1293
|
+
cssVariableTheme
|
|
1294
|
+
}) => {
|
|
1295
|
+
colorValue = {
|
|
1296
|
+
color,
|
|
1297
|
+
theme,
|
|
1298
|
+
cssVariableName: cssVariableTheme
|
|
1299
|
+
};
|
|
1300
|
+
colorResult = colorValueToCSS(colorValue);
|
|
1301
|
+
options?.onChange?.(colorResult);
|
|
1302
|
+
}
|
|
1188
1303
|
);
|
|
1304
|
+
return colorResult;
|
|
1189
1305
|
}
|
|
1190
|
-
|
|
1191
|
-
* Retrieves the currently selected index in an array items data group.
|
|
1192
|
-
*
|
|
1193
|
-
* @param options - Specify `arrayItemsDisplayGroupKey` if the component
|
|
1194
|
-
* has multiple array item groups.
|
|
1195
|
-
* @returns Index of the currently selected array item.
|
|
1196
|
-
*
|
|
1197
|
-
* @example
|
|
1198
|
-
* ```ts
|
|
1199
|
-
* import { element } from '@wix/editor';
|
|
1200
|
-
*
|
|
1201
|
-
* const index = await element.getArrayItemsSelectedIndex();
|
|
1202
|
-
* ```
|
|
1203
|
-
*/
|
|
1204
|
-
async getArrayItemsSelectedIndex(options) {
|
|
1306
|
+
async selectFont(value, options) {
|
|
1205
1307
|
const privateAPI = await this.getPlatformPrivateAPI();
|
|
1206
|
-
const
|
|
1207
|
-
|
|
1208
|
-
|
|
1209
|
-
|
|
1210
|
-
|
|
1308
|
+
const fontValue = parseFontString(value);
|
|
1309
|
+
let _value = value;
|
|
1310
|
+
await privateAPI.inputs.openFontPickerV2(
|
|
1311
|
+
{
|
|
1312
|
+
...options,
|
|
1313
|
+
panelSectionsDefinition: {
|
|
1314
|
+
htmlTag: "hidden"
|
|
1315
|
+
},
|
|
1316
|
+
componentStyle: fonts.transformFontInternalValue(fontValue)
|
|
1317
|
+
},
|
|
1318
|
+
(font, accessibility) => {
|
|
1319
|
+
_value = {
|
|
1320
|
+
font: fontValueToCSS(font),
|
|
1321
|
+
textDecoration: font.underline ? UNDERLINE_DEFINITION : void 0
|
|
1322
|
+
};
|
|
1323
|
+
options?.onChange?.(_value);
|
|
1324
|
+
}
|
|
1211
1325
|
);
|
|
1326
|
+
return _value;
|
|
1212
1327
|
}
|
|
1213
|
-
|
|
1214
|
-
|
|
1215
|
-
|
|
1216
|
-
|
|
1217
|
-
|
|
1218
|
-
*
|
|
1219
|
-
* @example
|
|
1220
|
-
* ```ts
|
|
1221
|
-
* import { element } from '@wix/editor';
|
|
1222
|
-
*
|
|
1223
|
-
* await element.setArrayItemsSelectedIndex({ index: 2 });
|
|
1224
|
-
* ```
|
|
1225
|
-
*/
|
|
1226
|
-
async setArrayItemsSelectedIndex(options) {
|
|
1328
|
+
}
|
|
1329
|
+
var index$7 = new PlatformSDKShape(InputsSDKShape).withPublicMethod("selectColor").withPublicMethod("selectFont").build();
|
|
1330
|
+
|
|
1331
|
+
class PanelsSDKShape extends BaseSDKShape {
|
|
1332
|
+
async openLanguageSupportPanel() {
|
|
1227
1333
|
const privateAPI = await this.getPlatformPrivateAPI();
|
|
1228
|
-
|
|
1229
|
-
return privateAPI.builderComponent.setArrayItemsSelectedIndex(
|
|
1230
|
-
manifestContextId,
|
|
1231
|
-
this.childPath,
|
|
1232
|
-
options
|
|
1233
|
-
);
|
|
1334
|
+
return privateAPI.panels.openLanguageSupportPanel();
|
|
1234
1335
|
}
|
|
1235
|
-
|
|
1236
|
-
* Resets the selected index in an array items data group to the default.
|
|
1237
|
-
*
|
|
1238
|
-
* @param options - Specify `arrayItemsDisplayGroupKey` if the component
|
|
1239
|
-
* has multiple array item groups.
|
|
1240
|
-
*
|
|
1241
|
-
* @example
|
|
1242
|
-
* ```ts
|
|
1243
|
-
* import { element } from '@wix/editor';
|
|
1244
|
-
*
|
|
1245
|
-
* await element.resetArrayItemsSelectedIndex();
|
|
1246
|
-
* ```
|
|
1247
|
-
*/
|
|
1248
|
-
async resetArrayItemsSelectedIndex(options) {
|
|
1336
|
+
async openFontsUploadPanel() {
|
|
1249
1337
|
const privateAPI = await this.getPlatformPrivateAPI();
|
|
1250
|
-
|
|
1251
|
-
return privateAPI.builderComponent.resetArrayItemsSelectedIndex(
|
|
1252
|
-
manifestContextId,
|
|
1253
|
-
this.childPath,
|
|
1254
|
-
options
|
|
1255
|
-
);
|
|
1338
|
+
return privateAPI.panels.openFontsUploadPanel();
|
|
1256
1339
|
}
|
|
1257
|
-
|
|
1258
|
-
|
|
1259
|
-
|
|
1260
|
-
|
|
1261
|
-
|
|
1262
|
-
* @example
|
|
1263
|
-
* ```ts
|
|
1264
|
-
* import { element } from '@wix/editor';
|
|
1265
|
-
*
|
|
1266
|
-
* const token = await element.getBiToken();
|
|
1267
|
-
* ```
|
|
1268
|
-
*/
|
|
1269
|
-
async getBiToken() {
|
|
1340
|
+
}
|
|
1341
|
+
var index$6 = new PlatformSDKShape(PanelsSDKShape).withPublicMethod("openLanguageSupportPanel").withPublicMethod("openFontsUploadPanel").build();
|
|
1342
|
+
|
|
1343
|
+
class ModalsSDKShape extends BaseSDKShape {
|
|
1344
|
+
async openDashboardModal(options) {
|
|
1270
1345
|
const privateAPI = await this.getPlatformPrivateAPI();
|
|
1271
|
-
|
|
1272
|
-
|
|
1273
|
-
|
|
1274
|
-
this.childPath
|
|
1346
|
+
return privateAPI.panels.openDashboardPanel(
|
|
1347
|
+
await this.getAppDefinitionId(),
|
|
1348
|
+
options
|
|
1275
1349
|
);
|
|
1276
1350
|
}
|
|
1277
1351
|
}
|
|
1278
|
-
var index$5 = new PlatformSDKShape(
|
|
1352
|
+
var index$5 = new PlatformSDKShape(ModalsSDKShape).withPublicMethod("openDashboardModal").build();
|
|
1279
1353
|
|
|
1280
1354
|
class PreferencesSDKShape extends BaseSDKShape {
|
|
1281
1355
|
async get(keys) {
|
|
@@ -1680,15 +1754,15 @@ exports.bindingsProviders = index;
|
|
|
1680
1754
|
exports.cmsBindings = index$1;
|
|
1681
1755
|
exports.controllers = index$2;
|
|
1682
1756
|
exports.editor = editor;
|
|
1683
|
-
exports.element = index$
|
|
1684
|
-
exports.elements = index$
|
|
1757
|
+
exports.element = index$b;
|
|
1758
|
+
exports.elements = index$a;
|
|
1685
1759
|
exports.events = index$c;
|
|
1686
1760
|
exports.externalPanels = index$3;
|
|
1687
|
-
exports.info = index$
|
|
1688
|
-
exports.inputs = index$
|
|
1689
|
-
exports.modals = index$
|
|
1690
|
-
exports.panels = index$
|
|
1761
|
+
exports.info = index$9;
|
|
1762
|
+
exports.inputs = index$7;
|
|
1763
|
+
exports.modals = index$5;
|
|
1764
|
+
exports.panels = index$6;
|
|
1691
1765
|
exports.preferences = index$4;
|
|
1692
1766
|
exports.providers = providersPublicSDKShape;
|
|
1693
|
-
exports.widget = index$
|
|
1767
|
+
exports.widget = index$8;
|
|
1694
1768
|
//# sourceMappingURL=index.js.map
|