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