@fraczled/sdk 1.27.0 → 1.29.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/fraczled-sdk.es.js +1 -1
- package/dist/fraczled-sdk.umd.js +226 -226
- package/dist/{index-kl-DXnau.js → index-CKZGj1xb.js} +11824 -11160
- package/dist/{index.es-C5_hrsKM.js → index.es-DtkeWqk-.js} +1 -1
- package/index.d.ts +155 -0
- package/package.json +1 -1
package/index.d.ts
CHANGED
|
@@ -312,6 +312,17 @@ export interface EditorUiConfig {
|
|
|
312
312
|
hiddenPanels?: PanelId[];
|
|
313
313
|
}
|
|
314
314
|
|
|
315
|
+
export type TemplateCategory = 'social-media' | 'business' | 'marketing' | 'personal' | (string & {});
|
|
316
|
+
|
|
317
|
+
export interface DesignTemplate {
|
|
318
|
+
id: string;
|
|
319
|
+
name: string;
|
|
320
|
+
category: TemplateCategory;
|
|
321
|
+
thumbnail: string;
|
|
322
|
+
tags: string[];
|
|
323
|
+
designState: any;
|
|
324
|
+
}
|
|
325
|
+
|
|
315
326
|
export interface EditorConfig {
|
|
316
327
|
apiKey: string;
|
|
317
328
|
projectId: string;
|
|
@@ -324,6 +335,14 @@ export interface EditorConfig {
|
|
|
324
335
|
services?: SDKServicesConfig;
|
|
325
336
|
assets?: SDKAssetsConfig;
|
|
326
337
|
customPanels?: CustomSidebarPanel[];
|
|
338
|
+
customContextMenuItems?: CustomContextMenuItem[];
|
|
339
|
+
customToolbarItems?: CustomToolbarItem[];
|
|
340
|
+
keyboardShortcuts?: KeyboardShortcutConfig;
|
|
341
|
+
customFonts?: CustomFontsConfig;
|
|
342
|
+
customTemplates?: CustomTemplatesConfig;
|
|
343
|
+
customExportFormats?: CustomExportFormat[];
|
|
344
|
+
customElementTypes?: CustomElementType[];
|
|
345
|
+
theme?: EditorTheme;
|
|
327
346
|
ui?: EditorUiConfig;
|
|
328
347
|
}
|
|
329
348
|
|
|
@@ -347,6 +366,142 @@ export interface CustomSidebarPanel {
|
|
|
347
366
|
render: (context: CustomPanelContext) => React.ReactNode;
|
|
348
367
|
}
|
|
349
368
|
|
|
369
|
+
export interface ContextMenuContext {
|
|
370
|
+
store: Store;
|
|
371
|
+
selection: string[];
|
|
372
|
+
element?: CanvasElement;
|
|
373
|
+
menuType: 'canvas' | 'object';
|
|
374
|
+
closeMenu: () => void;
|
|
375
|
+
}
|
|
376
|
+
|
|
377
|
+
export interface CustomContextMenuItem {
|
|
378
|
+
id: string;
|
|
379
|
+
label: string;
|
|
380
|
+
icon?: React.ComponentType<{ size?: number }>;
|
|
381
|
+
shortcut?: string;
|
|
382
|
+
section?: 'top' | 'middle' | 'bottom';
|
|
383
|
+
showFor?: 'object' | 'canvas' | 'both';
|
|
384
|
+
onClick: (context: ContextMenuContext) => void;
|
|
385
|
+
}
|
|
386
|
+
|
|
387
|
+
export interface ToolbarContext {
|
|
388
|
+
store: Store;
|
|
389
|
+
selection: string[];
|
|
390
|
+
element?: CanvasElement;
|
|
391
|
+
}
|
|
392
|
+
|
|
393
|
+
export interface CustomToolbarItem {
|
|
394
|
+
id: string;
|
|
395
|
+
label: string;
|
|
396
|
+
icon?: React.ComponentType<{ size?: number }>;
|
|
397
|
+
location: 'topbar' | 'object-toolbar' | 'both';
|
|
398
|
+
showFor?: Array<CanvasElement['type']>;
|
|
399
|
+
onClick?: (context: ToolbarContext) => void;
|
|
400
|
+
render?: (context: ToolbarContext) => React.ReactNode;
|
|
401
|
+
}
|
|
402
|
+
|
|
403
|
+
export type ShortcutAction =
|
|
404
|
+
| 'undo' | 'redo' | 'copy' | 'paste' | 'duplicate' | 'delete'
|
|
405
|
+
| 'selectAll' | 'deselect' | 'group' | 'ungroup'
|
|
406
|
+
| 'bringForward' | 'sendBackward' | 'bringToFront' | 'sendToBack'
|
|
407
|
+
| 'zoomIn' | 'zoomOut' | 'fitToScreen'
|
|
408
|
+
| 'toolSelect' | 'toolText' | 'toolPen' | 'toolHand' | 'toolZoom';
|
|
409
|
+
|
|
410
|
+
export interface ShortcutContext {
|
|
411
|
+
store: Store;
|
|
412
|
+
selection: string[];
|
|
413
|
+
}
|
|
414
|
+
|
|
415
|
+
export interface CustomShortcut {
|
|
416
|
+
id: string;
|
|
417
|
+
keys: string;
|
|
418
|
+
action: (context: ShortcutContext) => void;
|
|
419
|
+
}
|
|
420
|
+
|
|
421
|
+
export interface KeyboardShortcutConfig {
|
|
422
|
+
overrides?: Record<ShortcutAction, string | false>;
|
|
423
|
+
custom?: CustomShortcut[];
|
|
424
|
+
disableDefaults?: boolean;
|
|
425
|
+
}
|
|
426
|
+
|
|
427
|
+
export interface FontDefinition {
|
|
428
|
+
family: string;
|
|
429
|
+
category: 'sans-serif' | 'serif' | 'display' | 'handwriting' | 'monospace';
|
|
430
|
+
url?: string;
|
|
431
|
+
weights?: number[];
|
|
432
|
+
}
|
|
433
|
+
|
|
434
|
+
export interface CustomFontsConfig {
|
|
435
|
+
fonts?: FontDefinition[];
|
|
436
|
+
additionalFonts?: FontDefinition[];
|
|
437
|
+
fontLoader?: (family: string) => Promise<void>;
|
|
438
|
+
hideDefaultFonts?: boolean;
|
|
439
|
+
}
|
|
440
|
+
|
|
441
|
+
export interface CustomTemplatesConfig {
|
|
442
|
+
templates?: DesignTemplate[];
|
|
443
|
+
fetchTemplates?: () => Promise<DesignTemplate[]>;
|
|
444
|
+
hideDefaultTemplates?: boolean;
|
|
445
|
+
categories?: TemplateCategory[];
|
|
446
|
+
}
|
|
447
|
+
|
|
448
|
+
export interface ExportCaptureOptions {
|
|
449
|
+
width?: number;
|
|
450
|
+
height?: number;
|
|
451
|
+
bleed?: number;
|
|
452
|
+
backgroundColor?: string;
|
|
453
|
+
pixelRatio?: number;
|
|
454
|
+
kind?: 'web' | 'print';
|
|
455
|
+
dpi?: number;
|
|
456
|
+
}
|
|
457
|
+
|
|
458
|
+
export interface ExportContext {
|
|
459
|
+
store: Store;
|
|
460
|
+
pages: Page[];
|
|
461
|
+
settings: DocumentSettings;
|
|
462
|
+
captureCanvas: (pageId: string, options?: ExportCaptureOptions) => Promise<string>;
|
|
463
|
+
}
|
|
464
|
+
|
|
465
|
+
export interface CustomExportFormat {
|
|
466
|
+
id: string;
|
|
467
|
+
label: string;
|
|
468
|
+
description?: string;
|
|
469
|
+
icon?: React.ComponentType<{ size?: number }>;
|
|
470
|
+
section?: 'web' | 'print' | 'other';
|
|
471
|
+
handler: (context: ExportContext) => Promise<void>;
|
|
472
|
+
}
|
|
473
|
+
|
|
474
|
+
export interface ElementRenderContext {
|
|
475
|
+
zoom: number;
|
|
476
|
+
isSelected: boolean;
|
|
477
|
+
isEditing: boolean;
|
|
478
|
+
settings: DocumentSettings;
|
|
479
|
+
}
|
|
480
|
+
|
|
481
|
+
export interface CustomElementType {
|
|
482
|
+
type: string;
|
|
483
|
+
label: string;
|
|
484
|
+
icon?: React.ComponentType<{ size?: number }>;
|
|
485
|
+
defaultProps: Partial<CanvasElement>;
|
|
486
|
+
render: (element: CanvasElement, context: ElementRenderContext) => React.ReactNode;
|
|
487
|
+
toolbarItems?: CustomToolbarItem[];
|
|
488
|
+
propertyPanel?: (context: CustomPanelContext) => React.ReactNode;
|
|
489
|
+
}
|
|
490
|
+
|
|
491
|
+
export interface EditorTheme {
|
|
492
|
+
primary?: string;
|
|
493
|
+
primaryHover?: string;
|
|
494
|
+
background?: string;
|
|
495
|
+
surface?: string;
|
|
496
|
+
border?: string;
|
|
497
|
+
text?: string;
|
|
498
|
+
textMuted?: string;
|
|
499
|
+
topBar?: { background?: string; borderColor?: string };
|
|
500
|
+
sidebar?: { background?: string; width?: number };
|
|
501
|
+
panels?: { background?: string; borderRadius?: number };
|
|
502
|
+
darkMode?: boolean;
|
|
503
|
+
}
|
|
504
|
+
|
|
350
505
|
export type EventType = 'change' | 'save' | 'select' | 'export';
|
|
351
506
|
|
|
352
507
|
export interface Store {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fraczled/sdk",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.29.0",
|
|
4
4
|
"description": "Fraczled Design Studio SDK - Embed a powerful design editor in your application",
|
|
5
5
|
"scripts": {
|
|
6
6
|
"build": "vite build --config ../vite.sdk.config.ts && vite build --config ../vite.sdk.umd.config.ts",
|