@emabuild/core 0.2.0 → 0.3.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.
Files changed (60) hide show
  1. package/dist/canvas/column-renderer.d.ts.map +1 -1
  2. package/dist/canvas/content-renderer.d.ts +1 -1
  3. package/dist/canvas/content-renderer.d.ts.map +1 -1
  4. package/dist/canvas/editor-canvas.d.ts +11 -0
  5. package/dist/canvas/editor-canvas.d.ts.map +1 -1
  6. package/dist/canvas/inline-toolbar.d.ts +8 -0
  7. package/dist/canvas/inline-toolbar.d.ts.map +1 -1
  8. package/dist/canvas/row-renderer.d.ts +2 -0
  9. package/dist/canvas/row-renderer.d.ts.map +1 -1
  10. package/dist/compat/unlayer-adapter.d.ts +33 -0
  11. package/dist/compat/unlayer-adapter.d.ts.map +1 -0
  12. package/dist/dnd/drag-manager.d.ts +1 -0
  13. package/dist/dnd/drag-manager.d.ts.map +1 -1
  14. package/dist/dnd/drag-state.d.ts +10 -3
  15. package/dist/dnd/drag-state.d.ts.map +1 -1
  16. package/dist/{form-tool-DdFDrS3b.js → form-tool-C7760Hvm.js} +10 -9
  17. package/dist/{form-tool-DdFDrS3b.js.map → form-tool-C7760Hvm.js.map} +1 -1
  18. package/dist/{html-tool-DMtmrF3n.js → html-tool-4zZO2hqE.js} +2 -2
  19. package/dist/{html-tool-DMtmrF3n.js.map → html-tool-4zZO2hqE.js.map} +1 -1
  20. package/dist/index-zy5NbC2E.js +4303 -0
  21. package/dist/index-zy5NbC2E.js.map +1 -0
  22. package/dist/index.d.ts +1 -0
  23. package/dist/index.d.ts.map +1 -1
  24. package/dist/index.js +7 -5
  25. package/dist/mail-editor.d.ts +13 -2
  26. package/dist/mail-editor.d.ts.map +1 -1
  27. package/dist/{menu-tool-CJcQdpcP.js → menu-tool-Cu5D_VYs.js} +14 -13
  28. package/dist/{menu-tool-CJcQdpcP.js.map → menu-tool-Cu5D_VYs.js.map} +1 -1
  29. package/dist/properties/property-panel.d.ts.map +1 -1
  30. package/dist/register-elements.d.ts.map +1 -1
  31. package/dist/sidebar/a11y-checker.d.ts +27 -0
  32. package/dist/sidebar/a11y-checker.d.ts.map +1 -0
  33. package/dist/sidebar/body-settings.d.ts +2 -0
  34. package/dist/sidebar/body-settings.d.ts.map +1 -1
  35. package/dist/sidebar/editor-sidebar.d.ts +5 -2
  36. package/dist/sidebar/editor-sidebar.d.ts.map +1 -1
  37. package/dist/{social-tool-CRY3-_sU.js → social-tool-kPuP-4n6.js} +13 -12
  38. package/dist/{social-tool-CRY3-_sU.js.map → social-tool-kPuP-4n6.js.map} +1 -1
  39. package/dist/state/editor-store.d.ts +30 -28
  40. package/dist/state/editor-store.d.ts.map +1 -1
  41. package/dist/{table-tool-DeIQci5z.js → table-tool-CcWFvTSc.js} +13 -12
  42. package/dist/{table-tool-DeIQci5z.js.map → table-tool-CcWFvTSc.js.map} +1 -1
  43. package/dist/timer-tool-CG1oul_Z.js +55 -0
  44. package/dist/timer-tool-CG1oul_Z.js.map +1 -0
  45. package/dist/tools/built-in/button-tool.d.ts.map +1 -1
  46. package/dist/tools/built-in/divider-tool.d.ts.map +1 -1
  47. package/dist/tools/built-in/heading-tool.d.ts.map +1 -1
  48. package/dist/tools/built-in/image-tool.d.ts.map +1 -1
  49. package/dist/tools/built-in/paragraph-tool.d.ts.map +1 -1
  50. package/dist/tools/built-in/shared-options.d.ts +105 -0
  51. package/dist/tools/built-in/shared-options.d.ts.map +1 -0
  52. package/dist/tools/built-in/text-tool.d.ts.map +1 -1
  53. package/dist/tools/tool-registry.d.ts.map +1 -1
  54. package/dist/{video-tool-g1fIoCWW.js → video-tool-CttMka8Z.js} +7 -6
  55. package/dist/{video-tool-g1fIoCWW.js.map → video-tool-CttMka8Z.js.map} +1 -1
  56. package/package.json +13 -26
  57. package/dist/index-CpMbWdgn.js +0 -3092
  58. package/dist/index-CpMbWdgn.js.map +0 -1
  59. package/dist/timer-tool-BVE1shO1.js +0 -54
  60. package/dist/timer-tool-BVE1shO1.js.map +0 -1
@@ -0,0 +1,55 @@
1
+ import { html as r } from "lit";
2
+ import { s as t, e as s } from "./index-zy5NbC2E.js";
3
+ const c = {
4
+ name: "timer",
5
+ label: "Timer",
6
+ icon: '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>',
7
+ supportedDisplayModes: ["email", "web"],
8
+ position: 11,
9
+ options: {
10
+ timer: {
11
+ title: "Timer",
12
+ options: {
13
+ endDate: { label: "End Date (ISO)", defaultValue: new Date(Date.now() + 7 * 864e5).toISOString().split("T")[0], widget: "text" },
14
+ expiredMessage: { label: "Expired Message", defaultValue: "This offer has expired", widget: "text" }
15
+ }
16
+ },
17
+ style: {
18
+ title: "Style",
19
+ options: {
20
+ textAlign: { label: "Align", defaultValue: "center", widget: "alignment" },
21
+ backgroundColor: { label: "Background", defaultValue: "#1f2937", widget: "color_picker" },
22
+ textColor: { label: "Text Color", defaultValue: "#ffffff", widget: "color_picker" },
23
+ fontSize: { label: "Font Size", defaultValue: "32px", widget: "text" }
24
+ }
25
+ },
26
+ spacing: {
27
+ title: "Spacing",
28
+ options: { containerPadding: { label: "Padding", defaultValue: "10px", widget: "padding" } }
29
+ }
30
+ },
31
+ defaultValues: {
32
+ endDate: new Date(Date.now() + 7 * 864e5).toISOString().split("T")[0],
33
+ expiredMessage: "This offer has expired",
34
+ textAlign: "center",
35
+ backgroundColor: "#1f2937",
36
+ textColor: "#ffffff",
37
+ fontSize: "32px",
38
+ containerPadding: "10px"
39
+ },
40
+ renderer: {
41
+ renderEditor(e) {
42
+ t(e, "containerPadding", "10px");
43
+ const o = t(e, "backgroundColor", "#1f2937"), i = t(e, "textColor", "#ffffff"), n = t(e, "fontSize", "32px"), a = t(e, "textAlign", "center");
44
+ return r`<div style="padding:0;"><div style="background:${o};color:${i};text-align:${a};padding:20px;border-radius:4px;font-family:monospace;font-weight:bold;display:flex;flex-wrap:wrap;justify-content:center;gap:4px;"><span style="font-size:${n};letter-spacing:2px;">00</span><span style="font-size:${n};opacity:0.4;">:</span><span style="font-size:${n};letter-spacing:2px;">00</span><span style="font-size:${n};opacity:0.4;">:</span><span style="font-size:${n};letter-spacing:2px;">00</span><span style="font-size:${n};opacity:0.4;">:</span><span style="font-size:${n};letter-spacing:2px;">00</span><div style="width:100%;font-size:10px;letter-spacing:6px;opacity:0.5;margin-top:2px;text-align:center;">DAYS &nbsp; HRS &nbsp; MIN &nbsp; SEC</div></div></div>`;
45
+ },
46
+ renderHtml(e) {
47
+ const o = t(e, "containerPadding", "10px"), i = t(e, "backgroundColor", "#1f2937"), n = t(e, "textColor", "#ffffff"), a = t(e, "fontSize", "32px"), l = t(e, "textAlign", "center"), p = `<table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%" style="background-color:${i};border-radius:4px;"><tr><td style="padding:20px;text-align:${l};font-family:'Courier New',monospace;font-weight:bold;color:${n};font-size:${a};letter-spacing:2px;">00 <span style="opacity:0.4">:</span> 00 <span style="opacity:0.4">:</span> 00 <span style="opacity:0.4">:</span> 00<div style="font-size:10px;letter-spacing:6px;opacity:0.5;margin-top:4px;">DAYS &nbsp; HRS &nbsp; MIN &nbsp; SEC</div></td></tr></table>`;
48
+ return s(p, { padding: o, align: l });
49
+ }
50
+ }
51
+ };
52
+ export {
53
+ c as timerTool
54
+ };
55
+ //# sourceMappingURL=timer-tool-CG1oul_Z.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"timer-tool-CG1oul_Z.js","sources":["../src/tools/built-in/timer-tool.ts"],"sourcesContent":["/**\n * @module timer-tool\n *\n * Countdown timer display block.\n *\n * Email compatibility: Renders as a static styled block.\n * For live countdowns, integrate with a third-party countdown\n * image service (e.g. CountdownMail) in the `endDate` property.\n */\n\nimport { html, TemplateResult } from 'lit';\nimport type { ContentValues } from '@emabuild/types';\nimport type { LitToolDefinition } from '../tool-registry.js';\nimport { str } from '../helpers/value-extractor.js';\nimport { emailTableCell } from '../helpers/email-html.js';\n\nexport const timerTool: LitToolDefinition = {\n name: 'timer',\n label: 'Timer',\n icon: `<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"12\" cy=\"12\" r=\"10\"/><polyline points=\"12 6 12 12 16 14\"/></svg>`,\n supportedDisplayModes: ['email', 'web'],\n position: 11,\n options: {\n timer: {\n title: 'Timer',\n options: {\n endDate: { label: 'End Date (ISO)', defaultValue: new Date(Date.now() + 7 * 86400000).toISOString().split('T')[0], widget: 'text' },\n expiredMessage: { label: 'Expired Message', defaultValue: 'This offer has expired', widget: 'text' },\n },\n },\n style: {\n title: 'Style',\n options: {\n textAlign: { label: 'Align', defaultValue: 'center', widget: 'alignment' },\n backgroundColor: { label: 'Background', defaultValue: '#1f2937', widget: 'color_picker' },\n textColor: { label: 'Text Color', defaultValue: '#ffffff', widget: 'color_picker' },\n fontSize: { label: 'Font Size', defaultValue: '32px', widget: 'text' },\n },\n },\n spacing: {\n title: 'Spacing',\n options: { containerPadding: { label: 'Padding', defaultValue: '10px', widget: 'padding' } },\n },\n },\n defaultValues: {\n endDate: new Date(Date.now() + 7 * 86400000).toISOString().split('T')[0],\n expiredMessage: 'This offer has expired', textAlign: 'center',\n backgroundColor: '#1f2937', textColor: '#ffffff', fontSize: '32px', containerPadding: '10px',\n },\n renderer: {\n renderEditor(values: ContentValues): TemplateResult {\n const padding = str(values, 'containerPadding', '10px');\n const bg = str(values, 'backgroundColor', '#1f2937');\n const color = str(values, 'textColor', '#ffffff');\n const fontSize = str(values, 'fontSize', '32px');\n const align = str(values, 'textAlign', 'center');\n\n return html`<div style=\"padding:0;\"><div style=\"background:${bg};color:${color};text-align:${align};padding:20px;border-radius:4px;font-family:monospace;font-weight:bold;display:flex;flex-wrap:wrap;justify-content:center;gap:4px;\"><span style=\"font-size:${fontSize};letter-spacing:2px;\">00</span><span style=\"font-size:${fontSize};opacity:0.4;\">:</span><span style=\"font-size:${fontSize};letter-spacing:2px;\">00</span><span style=\"font-size:${fontSize};opacity:0.4;\">:</span><span style=\"font-size:${fontSize};letter-spacing:2px;\">00</span><span style=\"font-size:${fontSize};opacity:0.4;\">:</span><span style=\"font-size:${fontSize};letter-spacing:2px;\">00</span><div style=\"width:100%;font-size:10px;letter-spacing:6px;opacity:0.5;margin-top:2px;text-align:center;\">DAYS &nbsp; HRS &nbsp; MIN &nbsp; SEC</div></div></div>`;\n },\n renderHtml(values: ContentValues): string {\n const padding = str(values, 'containerPadding', '10px');\n const bg = str(values, 'backgroundColor', '#1f2937');\n const color = str(values, 'textColor', '#ffffff');\n const fontSize = str(values, 'fontSize', '32px');\n const align = str(values, 'textAlign', 'center');\n\n const inner = `<table role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" width=\"100%\" style=\"background-color:${bg};border-radius:4px;\"><tr><td style=\"padding:20px;text-align:${align};font-family:'Courier New',monospace;font-weight:bold;color:${color};font-size:${fontSize};letter-spacing:2px;\">00 <span style=\"opacity:0.4\">:</span> 00 <span style=\"opacity:0.4\">:</span> 00 <span style=\"opacity:0.4\">:</span> 00<div style=\"font-size:10px;letter-spacing:6px;opacity:0.5;margin-top:4px;\">DAYS &nbsp; HRS &nbsp; MIN &nbsp; SEC</div></td></tr></table>`;\n return emailTableCell(inner, { padding, align });\n },\n },\n};\n"],"names":["timerTool","values","str","bg","color","fontSize","align","html","padding","inner","emailTableCell"],"mappings":";;AAgBO,MAAMA,IAA+B;AAAA,EAC1C,MAAM;AAAA,EACN,OAAO;AAAA,EACP,MAAM;AAAA,EACN,uBAAuB,CAAC,SAAS,KAAK;AAAA,EACtC,UAAU;AAAA,EACV,SAAS;AAAA,IACP,OAAO;AAAA,MACL,OAAO;AAAA,MACP,SAAS;AAAA,QACP,SAAS,EAAE,OAAO,kBAAkB,cAAc,IAAI,KAAK,KAAK,QAAQ,IAAI,KAAQ,EAAE,cAAc,MAAM,GAAG,EAAE,CAAC,GAAG,QAAQ,OAAA;AAAA,QAC3H,gBAAgB,EAAE,OAAO,mBAAmB,cAAc,0BAA0B,QAAQ,OAAA;AAAA,MAAO;AAAA,IACrG;AAAA,IAEF,OAAO;AAAA,MACL,OAAO;AAAA,MACP,SAAS;AAAA,QACP,WAAW,EAAE,OAAO,SAAS,cAAc,UAAU,QAAQ,YAAA;AAAA,QAC7D,iBAAiB,EAAE,OAAO,cAAc,cAAc,WAAW,QAAQ,eAAA;AAAA,QACzE,WAAW,EAAE,OAAO,cAAc,cAAc,WAAW,QAAQ,eAAA;AAAA,QACnE,UAAU,EAAE,OAAO,aAAa,cAAc,QAAQ,QAAQ,OAAA;AAAA,MAAO;AAAA,IACvE;AAAA,IAEF,SAAS;AAAA,MACP,OAAO;AAAA,MACP,SAAS,EAAE,kBAAkB,EAAE,OAAO,WAAW,cAAc,QAAQ,QAAQ,UAAA,EAAU;AAAA,IAAE;AAAA,EAC7F;AAAA,EAEF,eAAe;AAAA,IACb,SAAS,IAAI,KAAK,KAAK,QAAQ,IAAI,KAAQ,EAAE,YAAA,EAAc,MAAM,GAAG,EAAE,CAAC;AAAA,IACvE,gBAAgB;AAAA,IAA0B,WAAW;AAAA,IACrD,iBAAiB;AAAA,IAAW,WAAW;AAAA,IAAW,UAAU;AAAA,IAAQ,kBAAkB;AAAA,EAAA;AAAA,EAExF,UAAU;AAAA,IACR,aAAaC,GAAuC;AAClC,MAAAC,EAAID,GAAQ,oBAAoB,MAAM;AACtD,YAAME,IAAKD,EAAID,GAAQ,mBAAmB,SAAS,GAC7CG,IAAQF,EAAID,GAAQ,aAAa,SAAS,GAC1CI,IAAWH,EAAID,GAAQ,YAAY,MAAM,GACzCK,IAAQJ,EAAID,GAAQ,aAAa,QAAQ;AAE/C,aAAOM,mDAAsDJ,CAAE,UAAUC,CAAK,eAAeE,CAAK,8JAA8JD,CAAQ,yDAAyDA,CAAQ,iDAAiDA,CAAQ,yDAAyDA,CAAQ,iDAAiDA,CAAQ,yDAAyDA,CAAQ,iDAAiDA,CAAQ;AAAA,IACxnB;AAAA,IACA,WAAWJ,GAA+B;AACxC,YAAMO,IAAUN,EAAID,GAAQ,oBAAoB,MAAM,GAChDE,IAAKD,EAAID,GAAQ,mBAAmB,SAAS,GAC7CG,IAAQF,EAAID,GAAQ,aAAa,SAAS,GAC1CI,IAAWH,EAAID,GAAQ,YAAY,MAAM,GACzCK,IAAQJ,EAAID,GAAQ,aAAa,QAAQ,GAEzCQ,IAAQ,8GAA8GN,CAAE,+DAA+DG,CAAK,+DAA+DF,CAAK,cAAcC,CAAQ;AAC5R,aAAOK,EAAeD,GAAO,EAAE,SAAAD,GAAS,OAAAF,GAAO;AAAA,IACjD;AAAA,EAAA;AAEJ;"}
@@ -1 +1 @@
1
- {"version":3,"file":"button-tool.d.ts","sourceRoot":"","sources":["../../../src/tools/built-in/button-tool.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAIH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAI7D,eAAO,MAAM,UAAU,EAAE,iBAiHxB,CAAC"}
1
+ {"version":3,"file":"button-tool.d.ts","sourceRoot":"","sources":["../../../src/tools/built-in/button-tool.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAIH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAK7D,eAAO,MAAM,UAAU,EAAE,iBAgGxB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"divider-tool.d.ts","sourceRoot":"","sources":["../../../src/tools/built-in/divider-tool.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAIH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAI7D,eAAO,MAAM,WAAW,EAAE,iBAqDzB,CAAC"}
1
+ {"version":3,"file":"divider-tool.d.ts","sourceRoot":"","sources":["../../../src/tools/built-in/divider-tool.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAIH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAK7D,eAAO,MAAM,WAAW,EAAE,iBA4CzB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"heading-tool.d.ts","sourceRoot":"","sources":["../../../src/tools/built-in/heading-tool.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAMH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAiB7D,eAAO,MAAM,WAAW,EAAE,iBA6GzB,CAAC"}
1
+ {"version":3,"file":"heading-tool.d.ts","sourceRoot":"","sources":["../../../src/tools/built-in/heading-tool.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAMH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAkB7D,eAAO,MAAM,WAAW,EAAE,iBA4EzB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"image-tool.d.ts","sourceRoot":"","sources":["../../../src/tools/built-in/image-tool.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAIH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAI7D,eAAO,MAAM,SAAS,EAAE,iBAwFvB,CAAC"}
1
+ {"version":3,"file":"image-tool.d.ts","sourceRoot":"","sources":["../../../src/tools/built-in/image-tool.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAIH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAK7D,eAAO,MAAM,SAAS,EAAE,iBA8EvB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"paragraph-tool.d.ts","sourceRoot":"","sources":["../../../src/tools/built-in/paragraph-tool.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAKH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAI7D,eAAO,MAAM,aAAa,EAAE,iBAuD3B,CAAC"}
1
+ {"version":3,"file":"paragraph-tool.d.ts","sourceRoot":"","sources":["../../../src/tools/built-in/paragraph-tool.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAKH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAK7D,eAAO,MAAM,aAAa,EAAE,iBAkD3B,CAAC"}
@@ -0,0 +1,105 @@
1
+ import { ToolPropertyGroup, ToolProperty } from '@emabuild/types';
2
+ export declare const LINE_HEIGHT_OPTIONS: readonly [{
3
+ readonly label: "100%";
4
+ readonly value: "100%";
5
+ }, {
6
+ readonly label: "120%";
7
+ readonly value: "120%";
8
+ }, {
9
+ readonly label: "140%";
10
+ readonly value: "140%";
11
+ }, {
12
+ readonly label: "160%";
13
+ readonly value: "160%";
14
+ }, {
15
+ readonly label: "180%";
16
+ readonly value: "180%";
17
+ }, {
18
+ readonly label: "200%";
19
+ readonly value: "200%";
20
+ }];
21
+ export declare const FONT_WEIGHT_OPTIONS: readonly [{
22
+ readonly label: "Normal";
23
+ readonly value: "400";
24
+ }, {
25
+ readonly label: "Medium";
26
+ readonly value: "500";
27
+ }, {
28
+ readonly label: "Semi Bold";
29
+ readonly value: "600";
30
+ }, {
31
+ readonly label: "Bold";
32
+ readonly value: "700";
33
+ }, {
34
+ readonly label: "Extra Bold";
35
+ readonly value: "800";
36
+ }];
37
+ export declare const FONT_WEIGHT_OPTIONS_SIMPLE: readonly [{
38
+ readonly label: "Normal";
39
+ readonly value: "400";
40
+ }, {
41
+ readonly label: "Bold";
42
+ readonly value: "700";
43
+ }];
44
+ export declare const HEADING_FONT_SIZE_OPTIONS: readonly [{
45
+ readonly label: "12px";
46
+ readonly value: "12px";
47
+ }, {
48
+ readonly label: "14px";
49
+ readonly value: "14px";
50
+ }, {
51
+ readonly label: "16px";
52
+ readonly value: "16px";
53
+ }, {
54
+ readonly label: "18px";
55
+ readonly value: "18px";
56
+ }, {
57
+ readonly label: "20px";
58
+ readonly value: "20px";
59
+ }, {
60
+ readonly label: "22px";
61
+ readonly value: "22px";
62
+ }, {
63
+ readonly label: "26px";
64
+ readonly value: "26px";
65
+ }, {
66
+ readonly label: "30px";
67
+ readonly value: "30px";
68
+ }, {
69
+ readonly label: "36px";
70
+ readonly value: "36px";
71
+ }, {
72
+ readonly label: "48px";
73
+ readonly value: "48px";
74
+ }, {
75
+ readonly label: "60px";
76
+ readonly value: "60px";
77
+ }];
78
+ export declare const BUTTON_FONT_SIZE_OPTIONS: readonly [{
79
+ readonly label: "12px";
80
+ readonly value: "12px";
81
+ }, {
82
+ readonly label: "13px";
83
+ readonly value: "13px";
84
+ }, {
85
+ readonly label: "14px";
86
+ readonly value: "14px";
87
+ }, {
88
+ readonly label: "16px";
89
+ readonly value: "16px";
90
+ }, {
91
+ readonly label: "18px";
92
+ readonly value: "18px";
93
+ }, {
94
+ readonly label: "20px";
95
+ readonly value: "20px";
96
+ }];
97
+ export declare const lineHeightProp: (defaultValue?: string) => ToolProperty;
98
+ export declare const fontWeightProp: (defaultValue?: string, simple?: boolean) => ToolProperty;
99
+ /** Spacing group with containerPadding */
100
+ export declare const SPACING_GROUP: ToolPropertyGroup;
101
+ /** General group with anchor + visibility toggles */
102
+ export declare const GENERAL_GROUP: ToolPropertyGroup;
103
+ /** Minimal general group with visibility toggles only (no anchor) */
104
+ export declare const GENERAL_GROUP_MINIMAL: ToolPropertyGroup;
105
+ //# sourceMappingURL=shared-options.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"shared-options.d.ts","sourceRoot":"","sources":["../../../src/tools/built-in/shared-options.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,iBAAiB,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAIvE,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;EAItB,CAAC;AAEX,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;EAItB,CAAC;AAEX,eAAO,MAAM,0BAA0B;;;;;;EAE7B,CAAC;AAEX,eAAO,MAAM,yBAAyB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAO5B,CAAC;AAEX,eAAO,MAAM,wBAAwB;;;;;;;;;;;;;;;;;;EAI3B,CAAC;AAIX,eAAO,MAAM,cAAc,GAAI,qBAAqB,KAAG,YAGrD,CAAC;AAEH,eAAO,MAAM,cAAc,GAAI,qBAAoB,EAAE,gBAAc,KAAG,YAGpE,CAAC;AAIH,0CAA0C;AAC1C,eAAO,MAAM,aAAa,EAAE,iBAK3B,CAAC;AAEF,qDAAqD;AACrD,eAAO,MAAM,aAAa,EAAE,iBAO3B,CAAC;AAEF,qEAAqE;AACrE,eAAO,MAAM,qBAAqB,EAAE,iBAMnC,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"text-tool.d.ts","sourceRoot":"","sources":["../../../src/tools/built-in/text-tool.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAKH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAI7D,eAAO,MAAM,QAAQ,EAAE,iBAqFtB,CAAC"}
1
+ {"version":3,"file":"text-tool.d.ts","sourceRoot":"","sources":["../../../src/tools/built-in/text-tool.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAKH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAK7D,eAAO,MAAM,QAAQ,EAAE,iBAkEtB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"tool-registry.d.ts","sourceRoot":"","sources":["../../src/tools/tool-registry.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1C,OAAO,KAAK,EAAE,cAAc,EAAE,iBAAiB,EAAE,aAAa,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAElI,6EAA6E;AAC7E,MAAM,WAAW,iBAAkB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACvE,QAAQ,EAAE;QACR,YAAY,CAAC,MAAM,EAAE,aAAa,EAAE,OAAO,EAAE,mBAAmB,GAAG,cAAc,CAAC;QAClF,UAAU,CAAC,MAAM,EAAE,aAAa,EAAE,OAAO,EAAE,mBAAmB,GAAG,MAAM,CAAC;KACzE,CAAC;CACH;AAED,4DAA4D;AAC5D,MAAM,MAAM,cAAc,GAAG,MAAM,OAAO,CAAC,iBAAiB,CAAC,CAAC;AAE9D,oFAAoF;AACpF,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,qBAAa,YAAY;IACvB,OAAO,CAAC,KAAK,CAAwC;IACrD,OAAO,CAAC,WAAW,CAAqC;IACxD,OAAO,CAAC,QAAQ,CAAmC;IACnD,OAAO,CAAC,eAAe,CAAiD;IAExE,sDAAsD;IACtD,QAAQ,CAAC,IAAI,EAAE,iBAAiB,GAAG,IAAI;IAMvC;;;;;;;;;;;;;;OAcG;IACH,YAAY,CAAC,IAAI,EAAE,YAAY,EAAE,MAAM,EAAE,cAAc,GAAG,IAAI;IAM9D,iGAAiG;IACjG,GAAG,CAAC,IAAI,EAAE,MAAM,GAAG,iBAAiB,GAAG,SAAS;IAIhD,oDAAoD;IACpD,GAAG,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO;IAI1B,0DAA0D;IAC1D,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO;IAI/B;;;;OAIG;IACG,YAAY,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO,CAAC,iBAAiB,GAAG,SAAS,CAAC;IAoBxE;;;OAGG;IACH,MAAM,IAAI,iBAAiB,EAAE;IAI7B;;;OAGG;IACH,UAAU,IAAI,YAAY,EAAE;IAa5B,kGAAkG;IAClG,gBAAgB,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAevD,qCAAqC;IACrC,iBAAiB,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,iBAAiB,CAAC;CAGnE"}
1
+ {"version":3,"file":"tool-registry.d.ts","sourceRoot":"","sources":["../../src/tools/tool-registry.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1C,OAAO,KAAK,EAAE,cAAc,EAAE,iBAAiB,EAAE,aAAa,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAElI,6EAA6E;AAC7E,MAAM,WAAW,iBAAkB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACvE,QAAQ,EAAE;QACR,YAAY,CAAC,MAAM,EAAE,aAAa,EAAE,OAAO,EAAE,mBAAmB,GAAG,cAAc,CAAC;QAClF,UAAU,CAAC,MAAM,EAAE,aAAa,EAAE,OAAO,EAAE,mBAAmB,GAAG,MAAM,CAAC;KACzE,CAAC;CACH;AAED,4DAA4D;AAC5D,MAAM,MAAM,cAAc,GAAG,MAAM,OAAO,CAAC,iBAAiB,CAAC,CAAC;AAE9D,oFAAoF;AACpF,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,qBAAa,YAAY;IACvB,OAAO,CAAC,KAAK,CAAwC;IACrD,OAAO,CAAC,WAAW,CAAqC;IACxD,OAAO,CAAC,QAAQ,CAAmC;IACnD,OAAO,CAAC,eAAe,CAA6D;IAEpF,sDAAsD;IACtD,QAAQ,CAAC,IAAI,EAAE,iBAAiB,GAAG,IAAI;IAMvC;;;;;;;;;;;;;;OAcG;IACH,YAAY,CAAC,IAAI,EAAE,YAAY,EAAE,MAAM,EAAE,cAAc,GAAG,IAAI;IAM9D,iGAAiG;IACjG,GAAG,CAAC,IAAI,EAAE,MAAM,GAAG,iBAAiB,GAAG,SAAS;IAIhD,oDAAoD;IACpD,GAAG,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO;IAI1B,0DAA0D;IAC1D,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO;IAI/B;;;;OAIG;IACG,YAAY,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO,CAAC,iBAAiB,GAAG,SAAS,CAAC;IA6BxE;;;OAGG;IACH,MAAM,IAAI,iBAAiB,EAAE;IAI7B;;;OAGG;IACH,UAAU,IAAI,YAAY,EAAE;IAa5B,kGAAkG;IAClG,gBAAgB,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAevD,qCAAqC;IACrC,iBAAiB,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,iBAAiB,CAAC;CAGnE"}
@@ -1,5 +1,5 @@
1
1
  import { html as a } from "lit";
2
- import { s as e, e as u } from "./index-CpMbWdgn.js";
2
+ import { s as e, e as u } from "./index-zy5NbC2E.js";
3
3
  function d(t) {
4
4
  const i = t.match(/(?:youtube\.com\/watch\?v=|youtu\.be\/|youtube\.com\/embed\/)([a-zA-Z0-9_-]{11})/);
5
5
  return i ? `https://img.youtube.com/vi/${i[1]}/maxresdefault.jpg` : null;
@@ -37,16 +37,17 @@ const m = {
37
37
  },
38
38
  renderer: {
39
39
  renderEditor(t) {
40
- const i = e(t, "containerPadding", "10px"), l = e(t, "url"), n = e(t, "thumbnailUrl") || d(l) || "", o = e(t, "textAlign", "center");
41
- return n ? a`<div style="text-align:${o};"><div style="position:relative;display:inline-block;max-width:100%;cursor:pointer;"><img src=${n} alt="Video thumbnail" style="display:block;max-width:100%;border-radius:4px;" /><div style="position:absolute;inset:0;display:flex;align-items:center;justify-content:center;"><div style="width:60px;height:60px;background:rgba(0,0,0,0.7);border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;font-size:24px;">▶</div></div></div></div>` : a`<div style="text-align:${o};"><div style="background:#0f172a;border-radius:8px;padding:40px;text-align:center;color:white;font-family:sans-serif;"><div style="font-size:48px;opacity:0.8;">▶</div><div style="font-size:12px;margin-top:8px;opacity:0.6;">${l || "Enter video URL"}</div></div></div>`;
40
+ e(t, "containerPadding", "10px");
41
+ const i = e(t, "url"), o = e(t, "thumbnailUrl") || d(i) || "", n = e(t, "textAlign", "center");
42
+ return o ? a`<div style="text-align:${n};"><div style="position:relative;display:inline-block;max-width:100%;cursor:pointer;"><img src=${o} alt="Video thumbnail" style="display:block;max-width:100%;border-radius:4px;" /><div style="position:absolute;inset:0;display:flex;align-items:center;justify-content:center;"><div style="width:60px;height:60px;background:rgba(0,0,0,0.7);border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;font-size:24px;">▶</div></div></div></div>` : a`<div style="text-align:${n};"><div style="background:#0f172a;border-radius:8px;padding:40px;text-align:center;color:white;font-family:sans-serif;"><div style="font-size:48px;opacity:0.8;">▶</div><div style="font-size:12px;margin-top:8px;opacity:0.6;">${i || "Enter video URL"}</div></div></div>`;
42
43
  },
43
44
  renderHtml(t, i) {
44
- const l = e(t, "containerPadding", "10px"), n = e(t, "url", "#"), o = e(t, "thumbnailUrl") || d(n) || "", r = e(t, "alt", "Video"), s = e(t, "textAlign", "center"), c = o ? `<img src="${o}" alt="${r}" width="${i.columnWidth}" style="display:block;max-width:100%;width:${i.columnWidth}px;border:0;" />` : '<div style="background:#0f172a;padding:40px;text-align:center;color:white;font-family:arial,sans-serif;font-size:16px;">▶ Watch Video</div>';
45
- return u(`<a href="${n}" target="_blank" style="text-decoration:none;">${c}</a>`, { padding: l, align: s });
45
+ const o = e(t, "containerPadding", "10px"), n = e(t, "url", "#"), l = e(t, "thumbnailUrl") || d(n) || "", r = e(t, "alt", "Video"), s = e(t, "textAlign", "center"), c = l ? `<img src="${l}" alt="${r}" width="${i.columnWidth}" style="display:block;max-width:100%;width:${i.columnWidth}px;border:0;" />` : '<div style="background:#0f172a;padding:40px;text-align:center;color:white;font-family:arial,sans-serif;font-size:16px;">▶ Watch Video</div>';
46
+ return u(`<a href="${n}" target="_blank" style="text-decoration:none;">${c}</a>`, { padding: o, align: s });
46
47
  }
47
48
  }
48
49
  };
49
50
  export {
50
51
  m as videoTool
51
52
  };
52
- //# sourceMappingURL=video-tool-g1fIoCWW.js.map
53
+ //# sourceMappingURL=video-tool-CttMka8Z.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"video-tool-g1fIoCWW.js","sources":["../src/tools/built-in/video-tool.ts"],"sourcesContent":["/**\n * @module video-tool\n *\n * Video embed block with thumbnail and play button overlay.\n * Supports YouTube and Vimeo URLs with auto-thumbnail detection.\n *\n * Email compatibility: Video cannot play in email — renders as\n * a linked thumbnail image with a play button overlay.\n */\n\nimport { html, TemplateResult } from 'lit';\nimport type { ContentValues, ExportRenderContext } from '@emabuild/types';\nimport type { LitToolDefinition } from '../tool-registry.js';\nimport { str } from '../helpers/value-extractor.js';\nimport { emailTableCell } from '../helpers/email-html.js';\n\n/** Extract YouTube video ID and return thumbnail URL */\nfunction getYouTubeThumbnail(url: string): string | null {\n const match = url.match(/(?:youtube\\.com\\/watch\\?v=|youtu\\.be\\/|youtube\\.com\\/embed\\/)([a-zA-Z0-9_-]{11})/);\n return match ? `https://img.youtube.com/vi/${match[1]}/maxresdefault.jpg` : null;\n}\n\nexport const videoTool: LitToolDefinition = {\n name: 'video',\n label: 'Video',\n icon: `<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polygon points=\"5 3 19 12 5 21 5 3\"/></svg>`,\n supportedDisplayModes: ['email', 'web'],\n position: 10,\n options: {\n video: {\n title: 'Video',\n options: {\n url: { label: 'Video URL', defaultValue: 'https://www.youtube.com/watch?v=dQw4w9WgXcQ', widget: 'text' },\n thumbnailUrl: { label: 'Thumbnail URL (auto)', defaultValue: '', widget: 'text' },\n alt: { label: 'Alt Text', defaultValue: 'Video', widget: 'text' },\n },\n },\n style: {\n title: 'Style',\n options: { textAlign: { label: 'Align', defaultValue: 'center', widget: 'alignment' } },\n },\n spacing: {\n title: 'Spacing',\n options: { containerPadding: { label: 'Padding', defaultValue: '10px', widget: 'padding' } },\n },\n },\n defaultValues: {\n url: 'https://www.youtube.com/watch?v=dQw4w9WgXcQ',\n thumbnailUrl: '', alt: 'Video', textAlign: 'center', containerPadding: '10px',\n },\n renderer: {\n renderEditor(values: ContentValues): TemplateResult {\n const padding = str(values, 'containerPadding', '10px');\n const url = str(values, 'url');\n const thumbnail = str(values, 'thumbnailUrl') || getYouTubeThumbnail(url) || '';\n const align = str(values, 'textAlign', 'center');\n\n if (!thumbnail) {\n return html`<div style=\"text-align:${align};\"><div style=\"background:#0f172a;border-radius:8px;padding:40px;text-align:center;color:white;font-family:sans-serif;\"><div style=\"font-size:48px;opacity:0.8;\">▶</div><div style=\"font-size:12px;margin-top:8px;opacity:0.6;\">${url || 'Enter video URL'}</div></div></div>`;\n }\n return html`<div style=\"text-align:${align};\"><div style=\"position:relative;display:inline-block;max-width:100%;cursor:pointer;\"><img src=${thumbnail} alt=\"Video thumbnail\" style=\"display:block;max-width:100%;border-radius:4px;\" /><div style=\"position:absolute;inset:0;display:flex;align-items:center;justify-content:center;\"><div style=\"width:60px;height:60px;background:rgba(0,0,0,0.7);border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;font-size:24px;\">▶</div></div></div></div>`;\n },\n renderHtml(values: ContentValues, ctx: ExportRenderContext): string {\n const padding = str(values, 'containerPadding', '10px');\n const url = str(values, 'url', '#');\n const thumbnail = str(values, 'thumbnailUrl') || getYouTubeThumbnail(url) || '';\n const alt = str(values, 'alt', 'Video');\n const align = str(values, 'textAlign', 'center');\n\n const imgTag = thumbnail\n ? `<img src=\"${thumbnail}\" alt=\"${alt}\" width=\"${ctx.columnWidth}\" style=\"display:block;max-width:100%;width:${ctx.columnWidth}px;border:0;\" />`\n : `<div style=\"background:#0f172a;padding:40px;text-align:center;color:white;font-family:arial,sans-serif;font-size:16px;\">▶ Watch Video</div>`;\n return emailTableCell(`<a href=\"${url}\" target=\"_blank\" style=\"text-decoration:none;\">${imgTag}</a>`, { padding, align });\n },\n },\n};\n"],"names":["getYouTubeThumbnail","url","match","videoTool","values","padding","str","thumbnail","align","html","ctx","alt","imgTag","emailTableCell"],"mappings":";;AAiBA,SAASA,EAAoBC,GAA4B;AACvD,QAAMC,IAAQD,EAAI,MAAM,kFAAkF;AAC1G,SAAOC,IAAQ,8BAA8BA,EAAM,CAAC,CAAC,uBAAuB;AAC9E;AAEO,MAAMC,IAA+B;AAAA,EAC1C,MAAM;AAAA,EACN,OAAO;AAAA,EACP,MAAM;AAAA,EACN,uBAAuB,CAAC,SAAS,KAAK;AAAA,EACtC,UAAU;AAAA,EACV,SAAS;AAAA,IACP,OAAO;AAAA,MACL,OAAO;AAAA,MACP,SAAS;AAAA,QACP,KAAK,EAAE,OAAO,aAAa,cAAc,+CAA+C,QAAQ,OAAA;AAAA,QAChG,cAAc,EAAE,OAAO,wBAAwB,cAAc,IAAI,QAAQ,OAAA;AAAA,QACzE,KAAK,EAAE,OAAO,YAAY,cAAc,SAAS,QAAQ,OAAA;AAAA,MAAO;AAAA,IAClE;AAAA,IAEF,OAAO;AAAA,MACL,OAAO;AAAA,MACP,SAAS,EAAE,WAAW,EAAE,OAAO,SAAS,cAAc,UAAU,QAAQ,YAAA,EAAY;AAAA,IAAE;AAAA,IAExF,SAAS;AAAA,MACP,OAAO;AAAA,MACP,SAAS,EAAE,kBAAkB,EAAE,OAAO,WAAW,cAAc,QAAQ,QAAQ,UAAA,EAAU;AAAA,IAAE;AAAA,EAC7F;AAAA,EAEF,eAAe;AAAA,IACb,KAAK;AAAA,IACL,cAAc;AAAA,IAAI,KAAK;AAAA,IAAS,WAAW;AAAA,IAAU,kBAAkB;AAAA,EAAA;AAAA,EAEzE,UAAU;AAAA,IACR,aAAaC,GAAuC;AAClD,YAAMC,IAAUC,EAAIF,GAAQ,oBAAoB,MAAM,GAChDH,IAAMK,EAAIF,GAAQ,KAAK,GACvBG,IAAYD,EAAIF,GAAQ,cAAc,KAAKJ,EAAoBC,CAAG,KAAK,IACvEO,IAAQF,EAAIF,GAAQ,aAAa,QAAQ;AAE/C,aAAKG,IAGEE,2BAA8BD,CAAK,kGAAkGD,CAAS,kXAF5IE,2BAA8BD,CAAK,mOAAmOP,KAAO,iBAAiB;AAAA,IAGzS;AAAA,IACA,WAAWG,GAAuBM,GAAkC;AAClE,YAAML,IAAUC,EAAIF,GAAQ,oBAAoB,MAAM,GAChDH,IAAMK,EAAIF,GAAQ,OAAO,GAAG,GAC5BG,IAAYD,EAAIF,GAAQ,cAAc,KAAKJ,EAAoBC,CAAG,KAAK,IACvEU,IAAML,EAAIF,GAAQ,OAAO,OAAO,GAChCI,IAAQF,EAAIF,GAAQ,aAAa,QAAQ,GAEzCQ,IAASL,IACX,aAAaA,CAAS,UAAUI,CAAG,YAAYD,EAAI,WAAW,+CAA+CA,EAAI,WAAW,qBAC5H;AACJ,aAAOG,EAAe,YAAYZ,CAAG,mDAAmDW,CAAM,QAAQ,EAAE,SAAAP,GAAS,OAAAG,GAAO;AAAA,IAC1H;AAAA,EAAA;AAEJ;"}
1
+ {"version":3,"file":"video-tool-CttMka8Z.js","sources":["../src/tools/built-in/video-tool.ts"],"sourcesContent":["/**\n * @module video-tool\n *\n * Video embed block with thumbnail and play button overlay.\n * Supports YouTube and Vimeo URLs with auto-thumbnail detection.\n *\n * Email compatibility: Video cannot play in email — renders as\n * a linked thumbnail image with a play button overlay.\n */\n\nimport { html, TemplateResult } from 'lit';\nimport type { ContentValues, ExportRenderContext } from '@emabuild/types';\nimport type { LitToolDefinition } from '../tool-registry.js';\nimport { str } from '../helpers/value-extractor.js';\nimport { emailTableCell } from '../helpers/email-html.js';\n\n/** Extract YouTube video ID and return thumbnail URL */\nfunction getYouTubeThumbnail(url: string): string | null {\n const match = url.match(/(?:youtube\\.com\\/watch\\?v=|youtu\\.be\\/|youtube\\.com\\/embed\\/)([a-zA-Z0-9_-]{11})/);\n return match ? `https://img.youtube.com/vi/${match[1]}/maxresdefault.jpg` : null;\n}\n\nexport const videoTool: LitToolDefinition = {\n name: 'video',\n label: 'Video',\n icon: `<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polygon points=\"5 3 19 12 5 21 5 3\"/></svg>`,\n supportedDisplayModes: ['email', 'web'],\n position: 10,\n options: {\n video: {\n title: 'Video',\n options: {\n url: { label: 'Video URL', defaultValue: 'https://www.youtube.com/watch?v=dQw4w9WgXcQ', widget: 'text' },\n thumbnailUrl: { label: 'Thumbnail URL (auto)', defaultValue: '', widget: 'text' },\n alt: { label: 'Alt Text', defaultValue: 'Video', widget: 'text' },\n },\n },\n style: {\n title: 'Style',\n options: { textAlign: { label: 'Align', defaultValue: 'center', widget: 'alignment' } },\n },\n spacing: {\n title: 'Spacing',\n options: { containerPadding: { label: 'Padding', defaultValue: '10px', widget: 'padding' } },\n },\n },\n defaultValues: {\n url: 'https://www.youtube.com/watch?v=dQw4w9WgXcQ',\n thumbnailUrl: '', alt: 'Video', textAlign: 'center', containerPadding: '10px',\n },\n renderer: {\n renderEditor(values: ContentValues): TemplateResult {\n const padding = str(values, 'containerPadding', '10px');\n const url = str(values, 'url');\n const thumbnail = str(values, 'thumbnailUrl') || getYouTubeThumbnail(url) || '';\n const align = str(values, 'textAlign', 'center');\n\n if (!thumbnail) {\n return html`<div style=\"text-align:${align};\"><div style=\"background:#0f172a;border-radius:8px;padding:40px;text-align:center;color:white;font-family:sans-serif;\"><div style=\"font-size:48px;opacity:0.8;\">▶</div><div style=\"font-size:12px;margin-top:8px;opacity:0.6;\">${url || 'Enter video URL'}</div></div></div>`;\n }\n return html`<div style=\"text-align:${align};\"><div style=\"position:relative;display:inline-block;max-width:100%;cursor:pointer;\"><img src=${thumbnail} alt=\"Video thumbnail\" style=\"display:block;max-width:100%;border-radius:4px;\" /><div style=\"position:absolute;inset:0;display:flex;align-items:center;justify-content:center;\"><div style=\"width:60px;height:60px;background:rgba(0,0,0,0.7);border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;font-size:24px;\">▶</div></div></div></div>`;\n },\n renderHtml(values: ContentValues, ctx: ExportRenderContext): string {\n const padding = str(values, 'containerPadding', '10px');\n const url = str(values, 'url', '#');\n const thumbnail = str(values, 'thumbnailUrl') || getYouTubeThumbnail(url) || '';\n const alt = str(values, 'alt', 'Video');\n const align = str(values, 'textAlign', 'center');\n\n const imgTag = thumbnail\n ? `<img src=\"${thumbnail}\" alt=\"${alt}\" width=\"${ctx.columnWidth}\" style=\"display:block;max-width:100%;width:${ctx.columnWidth}px;border:0;\" />`\n : `<div style=\"background:#0f172a;padding:40px;text-align:center;color:white;font-family:arial,sans-serif;font-size:16px;\">▶ Watch Video</div>`;\n return emailTableCell(`<a href=\"${url}\" target=\"_blank\" style=\"text-decoration:none;\">${imgTag}</a>`, { padding, align });\n },\n },\n};\n"],"names":["getYouTubeThumbnail","url","match","videoTool","values","str","thumbnail","align","html","ctx","padding","alt","imgTag","emailTableCell"],"mappings":";;AAiBA,SAASA,EAAoBC,GAA4B;AACvD,QAAMC,IAAQD,EAAI,MAAM,kFAAkF;AAC1G,SAAOC,IAAQ,8BAA8BA,EAAM,CAAC,CAAC,uBAAuB;AAC9E;AAEO,MAAMC,IAA+B;AAAA,EAC1C,MAAM;AAAA,EACN,OAAO;AAAA,EACP,MAAM;AAAA,EACN,uBAAuB,CAAC,SAAS,KAAK;AAAA,EACtC,UAAU;AAAA,EACV,SAAS;AAAA,IACP,OAAO;AAAA,MACL,OAAO;AAAA,MACP,SAAS;AAAA,QACP,KAAK,EAAE,OAAO,aAAa,cAAc,+CAA+C,QAAQ,OAAA;AAAA,QAChG,cAAc,EAAE,OAAO,wBAAwB,cAAc,IAAI,QAAQ,OAAA;AAAA,QACzE,KAAK,EAAE,OAAO,YAAY,cAAc,SAAS,QAAQ,OAAA;AAAA,MAAO;AAAA,IAClE;AAAA,IAEF,OAAO;AAAA,MACL,OAAO;AAAA,MACP,SAAS,EAAE,WAAW,EAAE,OAAO,SAAS,cAAc,UAAU,QAAQ,YAAA,EAAY;AAAA,IAAE;AAAA,IAExF,SAAS;AAAA,MACP,OAAO;AAAA,MACP,SAAS,EAAE,kBAAkB,EAAE,OAAO,WAAW,cAAc,QAAQ,QAAQ,UAAA,EAAU;AAAA,IAAE;AAAA,EAC7F;AAAA,EAEF,eAAe;AAAA,IACb,KAAK;AAAA,IACL,cAAc;AAAA,IAAI,KAAK;AAAA,IAAS,WAAW;AAAA,IAAU,kBAAkB;AAAA,EAAA;AAAA,EAEzE,UAAU;AAAA,IACR,aAAaC,GAAuC;AAClC,MAAAC,EAAID,GAAQ,oBAAoB,MAAM;AACtD,YAAMH,IAAMI,EAAID,GAAQ,KAAK,GACvBE,IAAYD,EAAID,GAAQ,cAAc,KAAKJ,EAAoBC,CAAG,KAAK,IACvEM,IAAQF,EAAID,GAAQ,aAAa,QAAQ;AAE/C,aAAKE,IAGEE,2BAA8BD,CAAK,kGAAkGD,CAAS,kXAF5IE,2BAA8BD,CAAK,mOAAmON,KAAO,iBAAiB;AAAA,IAGzS;AAAA,IACA,WAAWG,GAAuBK,GAAkC;AAClE,YAAMC,IAAUL,EAAID,GAAQ,oBAAoB,MAAM,GAChDH,IAAMI,EAAID,GAAQ,OAAO,GAAG,GAC5BE,IAAYD,EAAID,GAAQ,cAAc,KAAKJ,EAAoBC,CAAG,KAAK,IACvEU,IAAMN,EAAID,GAAQ,OAAO,OAAO,GAChCG,IAAQF,EAAID,GAAQ,aAAa,QAAQ,GAEzCQ,IAASN,IACX,aAAaA,CAAS,UAAUK,CAAG,YAAYF,EAAI,WAAW,+CAA+CA,EAAI,WAAW,qBAC5H;AACJ,aAAOI,EAAe,YAAYZ,CAAG,mDAAmDW,CAAM,QAAQ,EAAE,SAAAF,GAAS,OAAAH,GAAO;AAAA,IAC1H;AAAA,EAAA;AAEJ;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@emabuild/core",
3
- "version": "0.2.0",
3
+ "version": "0.3.0",
4
4
  "description": "Drag & drop email editor Web Component — embeddable anywhere",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",
@@ -18,10 +18,16 @@
18
18
  "custom-elements.json"
19
19
  ],
20
20
  "customElements": "custom-elements.json",
21
+ "scripts": {
22
+ "build": "vite build",
23
+ "dev": "vite build --watch",
24
+ "clean": "rm -rf dist",
25
+ "prepublishOnly": "pnpm build"
26
+ },
21
27
  "dependencies": {
22
- "lit": "^3.2.0",
23
- "@emabuild/types": "0.2.0",
24
- "@emabuild/email-renderer": "0.2.0"
28
+ "@emabuild/types": "workspace:*",
29
+ "@emabuild/email-renderer": "workspace:*",
30
+ "lit": "^3.2.0"
25
31
  },
26
32
  "devDependencies": {
27
33
  "vite": "^6.2.0",
@@ -30,26 +36,7 @@
30
36
  "publishConfig": {
31
37
  "access": "public"
32
38
  },
33
- "keywords": [
34
- "email",
35
- "editor",
36
- "drag-and-drop",
37
- "email-builder",
38
- "web-component",
39
- "lit",
40
- "newsletter",
41
- "html-email",
42
- "wysiwyg",
43
- "email-template"
44
- ],
39
+ "keywords": ["email", "editor", "drag-and-drop", "email-builder", "web-component", "lit", "newsletter", "html-email", "wysiwyg", "email-template"],
45
40
  "license": "MIT",
46
- "sideEffects": [
47
- "./dist/index.js",
48
- "./dist/mail-editor*.js"
49
- ],
50
- "scripts": {
51
- "build": "vite build",
52
- "dev": "vite build --watch",
53
- "clean": "rm -rf dist"
54
- }
55
- }
41
+ "sideEffects": ["./dist/index.js", "./dist/index-*.js"]
42
+ }