vaderjs 1.3.1 → 1.3.3

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/worker-min.js CHANGED
@@ -1 +1 @@
1
- onmessage=e=>{let a=Date.now(),l=e.data.strings,s=e.data.args,t="",r=e.data.location.split("/").slice(0,-1).join("/"),c="";for(let e=0;e<l.length;e++)c+=l[e],e<s.length&&(c+=s[e]);let o=c.match(/--([^>]*)--/gs);if(o)for(;o.length;){let e=o.pop();console.log(e),c=c.replace(e,"")}if(c=c.replace(/(#+)(.*)/g,((e,a,l)=>{if(console.log(e),e.includes("<")&&e.includes(">"))return e;{let e=a.length;return`<h ${e} class="markdown_heading">${l}</h${e}>`}})),c=c.replace(/\*\*(.*?)\*\*/g,((e,a)=>`<b class="markdown_bold">${a}</b>`)),c=c.replace(/\*(.*?)\*/g,((e,a)=>`<i class="markdown_italic">${a}</i>`)),c=c.replace(/`(.*?)`/g,((e,a)=>`<code>${a}</code>`)),c=c.replace(/\[([^\]]+)\]\(([^)]+)\)/g,((e,a,l)=>`<a class="markdown_link" href="${l}">${a}</a>`)),c=c.replace(/!\[([^\]]+)\]\(([^)]+)\)/g,((e,a,l)=>`<img class="markdown_image" src="${l}" alt="${a}" />`)),c.split("\n").forEach(((e,a,l)=>{e.match(/^\s*-\s+(.*?)$/gm)&&(c=0!==a&&l[a-1].match(/^\s*-\s+(.*?)$/gm)?a!==l.length-1&&l[a+1].match(/^\s*-\s+(.*?)$/gm)?c.replace(e,`<li>${e.replace(/^\s*-\s+(.*?)$/gm,"$1")}</li>`):c.replace(e,`<li>${e.replace(/^\s*-\s+(.*?)$/gm,"$1")}</li></ul>`):c.replace(e,`<ul class="markdown_unordered" style="list-style-type:disc;list-style:inside"><li>${e.replace(/^\s*-\s+(.*?)$/gm,"$1")}</li>`))})),c.split("\n").forEach(((e,a,l)=>{e.match(/^\s*\d+\.\s+(.*?)$/gm)&&(c=0!==a&&l[a-1].match(/^\s*\d+\.\s+(.*?)$/gm)?a!==l.length-1&&l[a+1].match(/^\s*\d+\.\s+(.*?)$/gm)?c.replace(e,`<li>${e.replace(/^\s*\d+\.\s+(.*?)$/gm,"$1")}</li>`):c.replace(e,`<li>${e.replace(/^\s*\d+\.\s+(.*?)$/gm,"$1")}</li></ol>`):c.replace(e,`<ol class="markdown_ordered" style="list-style-type:decimal;"><li>${e.replace(/^\s*\d+\.\s+(.*?)$/gm,"$1")}</li>`))})),c=c.replace(/^\s*-\s+(.*?)$/gm,((e,a)=>`<li class="markdown_list_item">${a}</li>`)),c=c.replace(/^\s*---\s*$/gm,'<hr class="markdown_horizontal" />'),c=c.replace(/^\s*> (.*)$/gm,((e,a)=>`<blockquote class="markdown_blockquote">${a}</blockquote>`)),c=c.replace(/((?: *\|.*?)+)\n((?: *\|.*?)+)/gm,((e,a,l)=>{const s=a.split("|").slice(1,-1),t=l.split("|").slice(1,-1);let r='<table class="markdown_table">';return r+='<thead class="markdown_table_head"><tr class="markdown_table_row">',s.forEach((e=>{r+=`<th class="markdown_table_header_cell">${e}</th>`})),r+='</tr></thead><tbody class="markdown_table_body"><tr class="markdown_table_row">',t.forEach((e=>{r+=`<td class="markdown_table_body_cell">${e}</td>`})),r+="</tr></tbody></table>",r})),!c.includes("<body>"))throw new Error(`Vader Error: You must enclose your html in a body tag for all components. \n\n${c}`);c=c.replace(/classname/g,"class");let n=c.match(/<img([^>]*)>/g);if(n)for(let a=0;a<n.length;a++){let l=n[a],s=l.match(/src="([^"]*)"/),t=l.match(/alt="([^"]*)"/);if(s){if(s[1].includes("http")&&c.includes("\x3c!-- #vader-disable_relative-paths --\x3e"))throw new Error(`Vader Error: You cannot use relative paths in the src attribute of ${s[0]}. Use absolute paths instead. \n\n${s[0]}`);c=c.replace(s[1],`${r}/${s[1]}`)}if(!t&&!c.includes("\x3c!-- #vader-disable_accessibility --\x3e"))throw new Error(`Vader Error: You must include an alt attribute in the image tag \n\n${l} of class ${e.data.name}. `);caches.match(`${r}/${s[1]}`)?console.log("already cached",caches.match(`${r}/${s[1]}`)):caches.open("vader").then((e=>{e.add(`${r}/${s[1]}`),console.log("cached",`${r}/${s[1]}`)})).catch((e=>{console.log(e)}))}let i=c.match(/href="([^"]*)"/g);if(i)for(;i.length;){let a=i.pop();if(a=a.replace('href="',"").replace('"',""),a.includes("http")&&c.includes("\x3c!-- #vader-disable_relative-paths --\x3e"))throw new Error(`Vader Error: You cannot use relative paths in ${e.data.file}. Use absolute paths instead. \n\n${a}`);c=c.replace(`href="${a}"`,`href="#${a}"`)}let d=Date.now()-a,$=!1;(r.includes("localhost")||r.includes("127.0.0.1")&&!$)&&($=!0,c+=`\${console.log('%c${e.data.name} component rendered in ${d}ms','color:#fff;background:#000;padding:5px;border-radius:5px;font-size:12px;font-weight:bold'),""}`);const h=c.split("<script>");h&&h.forEach(((e,a)=>{if(0===a)c=e;else{if(e.includes("// <![CDATA[ <-- For SVG support"))return;let a=e.split("<\/script>")[0];t+=a}}));let p=c.match(/(\$\(.*?\))/gs);if(p)for(;p.length;){let e=p.pop();c=c.replace(e,`\${${e.replace("$(","").replace(")","")}}`)}postMessage({template:`<div data-component=${e.data.name}>${c}</div>`,js:t||""})};
1
+ onmessage=e=>{let l=Date.now(),a=e.data.strings,t=e.data.args,s="",r=e.data.location.split("/").slice(0,-1).join("/"),c="";for(let e=0;e<a.length;e++)c+=a[e],e<t.length&&(c+=t[e]);let i=c.match(/--([^>]*)--/gs);if(i)for(;i.length;){let e=i.pop();c=c.replace(e,"")}if(c=c.replace(/(#+)(.*)/g,((e,l,a)=>{if(e.includes("<")&&e.includes(">"))return e;{let e=l.length;return`<h ${e} class="markdown_heading">${a}</h${e}>`}})),c=c.replace(/\*\*(.*?)\*\*/g,((e,l)=>`<b class="markdown_bold">${l}</b>`)),c=c.replace(/\*(.*?)\*/g,((e,l)=>`<i class="markdown_italic">${l}</i>`)),c=c.replace(/`(.*?)`/g,((e,l)=>`<code>${l}</code>`)),c=c.replace(/\[([^\]]+)\]\(([^)]+)\)/g,((e,l,a)=>`<a class="markdown_link" href="${a}">${l}</a>`)),c=c.replace(/!\[([^\]]+)\]\(([^)]+)\)/g,((e,l,a)=>`<img class="markdown_image" src="${a}" alt="${l}" />`)),c.split("\n").forEach(((e,l,a)=>{e.match(/^\s*-\s+(.*?)$/gm)&&(c=0!==l&&a[l-1].match(/^\s*-\s+(.*?)$/gm)?l!==a.length-1&&a[l+1].match(/^\s*-\s+(.*?)$/gm)?c.replace(e,`<li>${e.replace(/^\s*-\s+(.*?)$/gm,"$1")}</li>`):c.replace(e,`<li>${e.replace(/^\s*-\s+(.*?)$/gm,"$1")}</li></ul>`):c.replace(e,`<ul class="markdown_unordered" style="list-style-type:disc;list-style:inside"><li>${e.replace(/^\s*-\s+(.*?)$/gm,"$1")}</li>`))})),c.split("\n").forEach(((e,l,a)=>{e.match(/^\s*\d+\.\s+(.*?)$/gm)&&(c=0!==l&&a[l-1].match(/^\s*\d+\.\s+(.*?)$/gm)?l!==a.length-1&&a[l+1].match(/^\s*\d+\.\s+(.*?)$/gm)?c.replace(e,`<li>${e.replace(/^\s*\d+\.\s+(.*?)$/gm,"$1")}</li>`):c.replace(e,`<li>${e.replace(/^\s*\d+\.\s+(.*?)$/gm,"$1")}</li></ol>`):c.replace(e,`<ol class="markdown_ordered" style="list-style-type:decimal;"><li>${e.replace(/^\s*\d+\.\s+(.*?)$/gm,"$1")}</li>`))})),c=c.replace(/^\s*-\s+(.*?)$/gm,((e,l)=>`<li class="markdown_list_item">${l}</li>`)),c=c.replace(/^\s*---\s*$/gm,'<hr class="markdown_horizontal" />'),c=c.replace(/^\s*> (.*)$/gm,((e,l)=>`<blockquote class="markdown_blockquote">${l}</blockquote>`)),c=c.replace(/((?: *\|.*?)+)\n((?: *\|.*?)+)/gm,((e,l,a)=>{const t=l.split("|").slice(1,-1),s=a.split("|").slice(1,-1);let r='<table class="markdown_table">';return r+='<thead class="markdown_table_head"><tr class="markdown_table_row">',t.forEach((e=>{r+=`<th class="markdown_table_header_cell">${e}</th>`})),r+='</tr></thead><tbody class="markdown_table_body"><tr class="markdown_table_row">',s.forEach((e=>{r+=`<td class="markdown_table_body_cell">${e}</td>`})),r+="</tr></tbody></table>",r})),!c.includes("<body>"))throw new Error(`Vader Error: You must enclose your html in a body tag for all components. \n\n${c}`);c=c.replace(/classname/g,"class");let n=c.match(/<img([^>]*)>/g);if(n)for(let l=0;l<n.length;l++){let a=n[l],t=a.match(/src="([^"]*)"/);if(!a.match(/alt="([^"]*)"/)&&!c.includes("\x3c!-- #vader-disable_accessibility --\x3e"))throw new Error(`Vader Error: You must include an alt attribute in the image tag \n\n${a} of class ${e.data.name}. `);t&&t.forEach((l=>{if(l.includes("http")||c.includes("\x3c!-- #vader-disable_relative-paths --\x3e")){if(!l.includes("http")&&l.startsWith(".")&&!c.includes("\x3c!-- #vader-disable_relative-paths --\x3e"))throw new Error(`Vader Error: You cannot use absolute paths since relative paths are not disabled in ${e.data.file}. Use relative paths instead. \n\n${l}`)}else c=c.replace(`src="${l}"`,`src="${r}/${l}"`)}))}let o=c.match(/href="([^"]*)"/g);if(o)for(;o.length;){let l=o.pop();if(l=l.replace('href="',"").replace('"',""),l.includes("http")||c.includes("\x3c!-- #vader-disable_relative-paths --\x3e")){if(!l.includes("http")&&l.startsWith(".")&&!c.includes("\x3c!-- #vader-disable_relative-paths --\x3e"))throw new Error(`Vader Error: You cannot use absolute paths since relative paths are not disabled in ${e.data.file}. Use relative paths instead. \n\n${l}`)}else c=c.replace(`href="${l}"`,`href="#${l}"`)}let d=Date.now()-l,p=!1;(r.includes("localhost")||r.includes("127.0.0.1")&&!p)&&(p=!0,c+=`\${console.log('%c${e.data.name} component rendered in ${d}ms')}`);const h=c.split("<script>");h&&h.forEach(((e,l)=>{if(0===l)c=e;else{if(e.includes("// <![CDATA[ <-- For SVG support"))return;let l=e.split("<\/script>")[0];s+=l}}));let m=c.match(/(\$\(.*?\))/gs);if(m)for(;m.length;){let e=m.pop();c=c.replace(e,`\${${e.replace("$(","").replace(")","")}}`)}let $=c.match(/@title '([^>]*)'/);if($){let e=`{document.title = "${$[1]}", ""}`;c=c.replace($[0],"$"+e)}c=c.replaceAll('=""',"");let g=c.match(/@style{([^>]*)};/gs);if(g)for(let e=0;e<g.length;e++){if(!g[e].includes("style"))continue;g[e].match(/@style{([^>]*)};/).forEach((e=>{let l=e.replace("@style{","").replace("};","");l=l.replaceAll(",",";"),l=l.replaceAll(/'/g," "),c=c.replace(e,`style="${l}"`)}))}postMessage({template:`<div data-component=${e.data.name}>${c}</div>`,js:s||""})};
package/worker.js CHANGED
@@ -1,223 +1,301 @@
1
-
2
- onmessage = (e)=>{
3
- let time_started = Date.now()
4
- let strings = e.data.strings
5
- let args = e.data.args
6
- let js = ''
7
- let l = e.data.location.split('/').slice(0,-1).join('/')
8
- let result = "";
9
- for (let i = 0; i < strings.length; i++) {
10
- result += strings[i];
11
- if (i < args.length) {
12
- result += args[i];
1
+ onmessage = (e) => {
2
+ let time_started = Date.now();
3
+ let strings = e.data.strings;
4
+ let args = e.data.args;
5
+ let js = "";
6
+ let l = e.data.location.split("/").slice(0, -1).join("/");
7
+ let result = "";
8
+ for (let i = 0; i < strings.length; i++) {
9
+ result += strings[i];
10
+ if (i < args.length) {
11
+ result += args[i];
12
+ }
13
+ }
14
+
15
+ let comments = result.match(/--([^>]*)--/gs);
16
+ if (comments) {
17
+ while (comments.length) {
18
+ let comment = comments.pop();
19
+ // @ts-ignore
20
+ result = result.replace(comment, "");
21
+ }
22
+ }
23
+
24
+ // Convert headings (e.g., #1-6 Heading => <h1-6>Heading</h1-6>)
25
+ // @ts-ignore
26
+ result = result.replace(/(#+)(.*)/g, (match, hashes, text) => {
27
+ if (!match.includes("<") || !match.includes(">")) {
28
+ let level = hashes.length;
29
+ return `<h ${level} class="markdown_heading">${text}</h${level}>`;
30
+ } else {
31
+ return match;
32
+ }
33
+ });
34
+
35
+ // Convert bold (e.g., **Bold** => <b>Bold</b>)
36
+ result = result.replace(/\*\*(.*?)\*\*/g, (match, text) => {
37
+ return `<b class="markdown_bold">${text}</b>`;
38
+ });
39
+
40
+ // Convert italic (e.g., *Italic* => <i>Italic</i>)
41
+ result = result.replace(/\*(.*?)\*/g, (match, text) => {
42
+ return `<i class="markdown_italic">${text}</i>`;
43
+ });
44
+
45
+ // Convert code (e.g., `code` => <code>code</code>)
46
+ result = result.replace(/`(.*?)`/g, (match, text) => {
47
+ return `<code>${text}</code>`;
48
+ });
49
+
50
+ // Convert links (e.g., [Text](URL) => <a href="URL">Text</a>)
51
+ result = result.replace(/\[([^\]]+)\]\(([^)]+)\)/g, (match, text, url) => {
52
+ return `<a class="markdown_link" href="${url}">${text}</a>`;
53
+ });
54
+
55
+ // Convert images (e.g., ![Alt](URL) => <img src="URL" alt="Alt" />)
56
+ result = result.replace(/!\[([^\]]+)\]\(([^)]+)\)/g, (match, alt, src) => {
57
+ return `<img class="markdown_image" src="${src}" alt="${alt}" />`;
58
+ });
59
+
60
+ // Convert unordered lists (e.g., * Item => <ul><li>Item</li></ul>)
61
+ result.split("\n").forEach((line, index, arr) => {
62
+ if (line.match(/^\s*-\s+(.*?)$/gm)) {
63
+ if (index === 0 || !arr[index - 1].match(/^\s*-\s+(.*?)$/gm)) {
64
+ result = result.replace(
65
+ line,
66
+ `<ul class="markdown_unordered" style="list-style-type:disc;list-style:inside"><li>${line.replace(
67
+ /^\s*-\s+(.*?)$/gm,
68
+ "$1"
69
+ )}</li>`
70
+ );
71
+ } else if (
72
+ index === arr.length - 1 ||
73
+ !arr[index + 1].match(/^\s*-\s+(.*?)$/gm)
74
+ ) {
75
+ result = result.replace(
76
+ line,
77
+ `<li>${line.replace(/^\s*-\s+(.*?)$/gm, "$1")}</li></ul>`
78
+ );
79
+ } else {
80
+ result = result.replace(
81
+ line,
82
+ `<li>${line.replace(/^\s*-\s+(.*?)$/gm, "$1")}</li>`
83
+ );
13
84
  }
14
85
  }
86
+ });
15
87
 
16
- let comments = result.match(/--([^>]*)--/gs)
17
- if(comments){
18
- while(comments.length){
19
- let comment = comments.pop()
20
- console.log(comment)
21
- // @ts-ignore
22
- result = result.replace(comment,'')
23
- }
88
+ // Convert ordered lists (e.g., 1. Item => <ol><li>Item</li></ol>) in order
89
+
90
+ result.split("\n").forEach((line, index, arr) => {
91
+ if (line.match(/^\s*\d+\.\s+(.*?)$/gm)) {
92
+ if (index === 0 || !arr[index - 1].match(/^\s*\d+\.\s+(.*?)$/gm)) {
93
+ result = result.replace(
94
+ line,
95
+ `<ol class="markdown_ordered" style="list-style-type:decimal;"><li>${line.replace(
96
+ /^\s*\d+\.\s+(.*?)$/gm,
97
+ "$1"
98
+ )}</li>`
99
+ );
100
+ } else if (
101
+ index === arr.length - 1 ||
102
+ !arr[index + 1].match(/^\s*\d+\.\s+(.*?)$/gm)
103
+ ) {
104
+ result = result.replace(
105
+ line,
106
+ `<li>${line.replace(/^\s*\d+\.\s+(.*?)$/gm, "$1")}</li></ol>`
107
+ );
108
+ } else {
109
+ result = result.replace(
110
+ line,
111
+ `<li>${line.replace(/^\s*\d+\.\s+(.*?)$/gm, "$1")}</li>`
112
+ );
113
+ }
24
114
  }
115
+ });
25
116
 
26
-
27
- // Convert headings (e.g., #1-6 Heading => <h1-6>Heading</h1-6>)
28
- // @ts-ignore
29
- result = result.replace(/(#+)(.*)/g, (match, hashes, text) => {
30
- console.log(match)
31
- if(!match.includes('<') || !match.includes('>')){
32
- let level = hashes.length;
33
- return `<h ${level} class="markdown_heading">${text}</h${level}>`;
34
- }else{
35
- return match
36
- }
37
- });
38
-
39
-
40
- // Convert bold (e.g., **Bold** => <b>Bold</b>)
41
- result = result.replace(/\*\*(.*?)\*\*/g, (match, text) => {
42
- return `<b class="markdown_bold">${text}</b>`;
43
- });
44
-
45
- // Convert italic (e.g., *Italic* => <i>Italic</i>)
46
- result = result.replace(/\*(.*?)\*/g, (match, text) => {
47
- return `<i class="markdown_italic">${text}</i>`;
48
- });
49
-
50
- // Convert code (e.g., `code` => <code>code</code>)
51
- result = result.replace(/`(.*?)`/g, (match, text) => {
52
- return `<code>${text}</code>`;
53
- });
54
-
55
- // Convert links (e.g., [Text](URL) => <a href="URL">Text</a>)
56
- result = result.replace(/\[([^\]]+)\]\(([^)]+)\)/g, (match, text, url) => {
57
- return `<a class="markdown_link" href="${url}">${text}</a>`;
58
- });
59
-
60
- // Convert images (e.g., ![Alt](URL) => <img src="URL" alt="Alt" />)
61
- result = result.replace(/!\[([^\]]+)\]\(([^)]+)\)/g, (match, alt, src) => {
62
- return `<img class="markdown_image" src="${src}" alt="${alt}" />`;
63
- });
64
-
65
- // Convert unordered lists (e.g., * Item => <ul><li>Item</li></ul>)
66
- result.split('\n').forEach((line, index, arr) => {
67
- if (line.match(/^\s*-\s+(.*?)$/gm)) {
68
- if (index === 0 || !arr[index - 1].match(/^\s*-\s+(.*?)$/gm)) {
69
- result = result.replace(line, `<ul class="markdown_unordered" style="list-style-type:disc;list-style:inside"><li>${line.replace(/^\s*-\s+(.*?)$/gm, '$1')}</li>`);
70
- } else if (index === arr.length - 1 || !arr[index + 1].match(/^\s*-\s+(.*?)$/gm)) {
71
- result = result.replace(line, `<li>${line.replace(/^\s*-\s+(.*?)$/gm, '$1')}</li></ul>`);
72
- } else {
73
- result = result.replace(line, `<li>${line.replace(/^\s*-\s+(.*?)$/gm, '$1')}</li>`);
74
- }
75
- }
76
- });
77
-
78
- // Convert ordered lists (e.g., 1. Item => <ol><li>Item</li></ol>) in order
79
-
80
- result.split('\n').forEach((line, index, arr) => {
81
- if (line.match(/^\s*\d+\.\s+(.*?)$/gm)) {
82
- if (index === 0 || !arr[index - 1].match(/^\s*\d+\.\s+(.*?)$/gm)) {
83
- result = result.replace(line, `<ol class="markdown_ordered" style="list-style-type:decimal;"><li>${line.replace(/^\s*\d+\.\s+(.*?)$/gm, '$1')}</li>`);
84
- } else if (index === arr.length - 1 || !arr[index + 1].match(/^\s*\d+\.\s+(.*?)$/gm)) {
85
- result = result.replace(line, `<li>${line.replace(/^\s*\d+\.\s+(.*?)$/gm, '$1')}</li></ol>`);
86
- } else {
87
- result = result.replace(line, `<li>${line.replace(/^\s*\d+\.\s+(.*?)$/gm, '$1')}</li>`);
88
- }
89
- }
90
- });
117
+ result = result.replace(/^\s*-\s+(.*?)$/gm, (match, text) => {
118
+ return `<li class="markdown_list_item">${text}</li>`;
119
+ });
120
+ result = result.replace(
121
+ /^\s*---\s*$/gm,
122
+ '<hr class="markdown_horizontal" />'
123
+ );
124
+
125
+ // Convert blockquotes (e.g., > Quote => <blockquote>Quote</blockquote>)
126
+ result = result.replace(/^\s*> (.*)$/gm, (match, text) => {
127
+ return `<blockquote class="markdown_blockquote">${text}</blockquote>`;
128
+ });
91
129
 
92
-
93
- result = result.replace(/^\s*-\s+(.*?)$/gm, (match, text) => {
94
- return `<li class="markdown_list_item">${text}</li>`;
130
+ // Convert tables (e.g., | Header | Cell | => <table><thead><tr><th>Header</th><th>Cell</th></tr></thead></table>)
131
+ result = result.replace(
132
+ /((?: *\|.*?)+)\n((?: *\|.*?)+)/gm,
133
+ (match, header, cell) => {
134
+ const headerCells = header.split("|").slice(1, -1);
135
+ const cells = cell.split("|").slice(1, -1);
136
+ let table = '<table class="markdown_table">';
137
+ table +=
138
+ '<thead class="markdown_table_head"><tr class="markdown_table_row">';
139
+ headerCells.forEach((headerCell) => {
140
+ table += `<th class="markdown_table_header_cell">${headerCell}</th>`;
95
141
  });
96
- result = result.replace(/^\s*---\s*$/gm, '<hr class="markdown_horizontal" />');
97
-
98
- // Convert blockquotes (e.g., > Quote => <blockquote>Quote</blockquote>)
99
- result = result.replace(/^\s*> (.*)$/gm, (match, text) => {
100
- return `<blockquote class="markdown_blockquote">${text}</blockquote>`;
142
+ table +=
143
+ '</tr></thead><tbody class="markdown_table_body"><tr class="markdown_table_row">';
144
+ cells.forEach((cell) => {
145
+ table += `<td class="markdown_table_body_cell">${cell}</td>`;
101
146
  });
147
+ table += "</tr></tbody></table>";
148
+ return table;
149
+ }
150
+ );
102
151
 
103
- // Convert tables (e.g., | Header | Cell | => <table><thead><tr><th>Header</th><th>Cell</th></tr></thead></table>)
104
- result = result.replace(/((?: *\|.*?)+)\n((?: *\|.*?)+)/gm, (match, header, cell) => {
105
- const headerCells = header.split('|').slice(1, -1);
106
- const cells = cell.split('|').slice(1, -1);
107
- let table = '<table class="markdown_table">';
108
- table += '<thead class="markdown_table_head"><tr class="markdown_table_row">';
109
- headerCells.forEach((headerCell) => {
110
- table += `<th class="markdown_table_header_cell">${headerCell}</th>`;
111
- });
112
- table += '</tr></thead><tbody class="markdown_table_body"><tr class="markdown_table_row">';
113
- cells.forEach((cell) => {
114
- table += `<td class="markdown_table_body_cell">${cell}</td>`;
152
+ if (!result.includes("<body>")) {
153
+ throw new Error(
154
+ `Vader Error: You must enclose your html in a body tag for all components. \n\n${result}`
155
+ );
156
+ }
157
+ /**
158
+ * @type {string[]}
159
+ * @description - grabbing all className attributes and replace them with class
160
+ */
161
+ // @ts-ignore
162
+ result = result.replace(/classname/g, "class");
163
+ /**
164
+ * @type {string[]}
165
+ * @description - grabbing all image tags and replace the src attribute with the absolute path
166
+ */
167
+ // @ts-ignore
168
+ let images = result.match(/<img([^>]*)>/g);
169
+ if (images) {
170
+ for (let i = 0; i < images.length; i++) {
171
+ let image = images[i];
172
+ let src = image.match(/src="([^"]*)"/);
173
+ let alt = image.match(/alt="([^"]*)"/);
174
+
175
+ if (!alt && !result.includes("<!-- #vader-disable_accessibility -->")) {
176
+ throw new Error(
177
+ `Vader Error: You must include an alt attribute in the image tag \n\n${image} of class ${e.data.name}. `
178
+ );
179
+ }
180
+ if (src) {
181
+ src.forEach((s) => {
182
+ if (
183
+ !s.includes("http") &&
184
+ !result.includes("<!-- #vader-disable_relative-paths -->")
185
+ ) {
186
+ result = result.replace(`src="${s}"`, `src="${l}/${s}"`);
187
+ } else if (
188
+ !s.includes("http") &&
189
+ s.startsWith(".") &&
190
+ !result.includes("<!-- #vader-disable_relative-paths -->")
191
+ ) {
192
+ throw new Error(
193
+ `Vader Error: You cannot use absolute paths since relative paths are not disabled in ${e.data.file}. Use relative paths instead. \n\n${s}`
194
+ );
195
+ }
115
196
  });
116
- table += '</tr></tbody></table>';
117
- return table;
118
- });
119
-
120
-
121
-
122
- if(!result.includes('<body>')){
123
- throw new Error(`Vader Error: You must enclose your html in a body tag for all components. \n\n${result}`)
197
+ }
124
198
  }
125
- /**
126
- * @type {string[]}
127
- * @description - grabbing all className attributes and replace them with class
128
- */
129
- // @ts-ignore
130
- result = result.replace(/classname/g,'class')
131
- /**
132
- * @type {string[]}
133
- * @description - grabbing all image tags and replace the src attribute with the absolute path
134
- */
135
- // @ts-ignore
136
- let images = result.match(/<img([^>]*)>/g)
137
- if(images){
138
- for(let i = 0; i < images.length; i++){
139
- let image = images[i]
140
- let src = image.match(/src="([^"]*)"/)
141
- let alt = image.match(/alt="([^"]*)"/)
142
- if(src){
143
- if(!src[1].includes('http') || !result.includes('<!-- #vader-disable_relative-paths -->')){
144
- // @ts-ignore
145
- result = result.replace(src[1],`${l}/${src[1]}`)
146
- }else{
147
- throw new Error(`Vader Error: You cannot use relative paths in the src attribute of ${src[0]}. Use absolute paths instead. \n\n${src[0]}`)
199
+ }
200
+
201
+ let href = result.match(/href="([^"]*)"/g);
202
+ if (href) {
203
+ while (href.length) {
204
+ let h = href.pop();
205
+ // @ts-ignore
206
+ h = h.replace('href="', "").replace('"', "");
207
+ if (
208
+ !h.includes("http") &&
209
+ !result.includes("<!-- #vader-disable_relative-paths -->")
210
+ ) {
211
+ result = result.replace(`href="${h}"`, `href="#${h}"`);
212
+ } else if (
213
+ !h.includes("http") &&
214
+ h.startsWith(".") &&
215
+ !result.includes("<!-- #vader-disable_relative-paths -->")
216
+ ) {
217
+ throw new Error(
218
+ `Vader Error: You cannot use absolute paths since relative paths are not disabled in ${e.data.file}. Use relative paths instead. \n\n${h}`
219
+ );
220
+ }
221
+ }
222
+ }
223
+
224
+ let time_ended = Date.now();
225
+ let time_taken = time_ended - time_started;
226
+ let hasran = false;
227
+ if (l.includes("localhost") || (l.includes("127.0.0.1") && !hasran)) {
228
+ hasran = true;
229
+ result += `\$\{console.log('%c${e.data.name} component rendered in ${time_taken}ms')\}`;
230
+ }
231
+
232
+ const d = result.split("<script>");
233
+
234
+ if (d) {
235
+ d.forEach((scriptTag, index) => {
236
+ if (index === 0) {
237
+ result = scriptTag;
238
+ } else {
239
+ if (scriptTag.includes("// <![CDATA[ <-- For SVG support")) {
240
+ return;
148
241
  }
242
+ let script = scriptTag.split("</script>")[0];
243
+ js += script;
149
244
  }
150
- if(!alt && !result.includes('<!-- #vader-disable_accessibility -->')){
151
- throw new Error(`Vader Error: You must include an alt attribute in the image tag \n\n${image} of class ${e.data.name}. `)
245
+ });
246
+ }
247
+
248
+ let jstemplates = result.match(/(\$\(.*?\))/gs);
249
+ if (jstemplates) {
250
+ while (jstemplates.length) {
251
+ let jstemplate = jstemplates.pop();
252
+ // @ts-ignore
253
+ result = result.replace(
254
+ // @ts-ignore
255
+ jstemplate,
256
+ // @ts-ignore
257
+ `$\{${jstemplate.replace("$(", "").replace(")", "")}\}`
258
+ );
259
+ }
260
+ }
261
+
262
+ let title = result.match(/@title '([^>]*)'/);
263
+ if (title) {
264
+ let t = title[1];
265
+ let ti = `{document.title = "${t}", ""}`;
266
+ result = result.replace(title[0], "$" + ti);
267
+ }
268
+ // @ts-ignore
269
+ result = result.replaceAll('=""', '')
270
+ let styles = result.match(/@style{([^>]*)};/gs);
271
+ if (styles) {
272
+ for (let i = 0; i < styles.length; i++) {
273
+ // make sure its in a tag
274
+
275
+ if (!styles[i].includes("style")) {
276
+ continue;
152
277
  }
278
+ let style = styles[i];
153
279
 
280
+
281
+ let s = style.match(/@style{([^>]*)};/);
282
+
154
283
  // @ts-ignore
155
- if(!caches.match(`${l}/${src[1]}`)){
156
- caches.open('vader').then((cache)=>{
157
- // @ts-ignore
158
- cache.add(`${l}/${src[1]}`)
159
- // @ts-ignore
160
- console.log('cached', `${l}/${src[1]}`)
161
- }).catch((err)=>{
162
- console.log(err)
163
- })
164
- }else{
284
+ s.forEach((style) => {
285
+
286
+ let st = style.replace("@style{", "").replace("};", "");
165
287
  // @ts-ignore
166
- console.log('already cached', caches.match(`${l}/${src[1]}`))
167
- }
168
- }
169
- }
170
-
171
- let href = result.match(/href="([^"]*)"/g)
172
- if(href){
173
- while(href.length){
174
- let h = href.pop()
175
- // @ts-ignore
176
- h = h.replace('href="','').replace('"','')
177
- if(!h.includes('http') || !result.includes('<!-- #vader-disable_relative-paths -->')){
178
- result = result.replace(`href="${h}"`,`href="#${h}"`)
179
- }else{
180
- throw new Error(`Vader Error: You cannot use relative paths in ${e.data.file}. Use absolute paths instead. \n\n${h}`)
181
- }
182
- }
183
- }
184
-
185
- let time_ended = Date.now()
186
- let time_taken = time_ended - time_started
187
- let hasran = false
188
- if(l.includes('localhost') || l.includes('127.0.0.1') && !hasran){
189
- hasran = true
190
- result+= `\$\{console.log('%c${e.data.name} component rendered in ${time_taken}ms','color:#fff;background:#000;padding:5px;border-radius:5px;font-size:12px;font-weight:bold'),""\}`
191
- }
192
-
193
-
194
- const d = result.split('<script>')
195
-
196
- if (d) {
197
- d.forEach((scriptTag, index) => {
198
- if (index === 0) {
199
- result = scriptTag;
200
- } else {
201
- if(scriptTag.includes('// <![CDATA[ <-- For SVG support')){
202
- return
203
- }
204
- let script = scriptTag.split('</script>')[0];
205
- js += script;
206
- }
288
+ st = st.replaceAll(',', ';')
289
+ // @ts-ignore
290
+ st = st.replaceAll(/'/g, ' ')
291
+
292
+ result = result.replace(style, `style="${st}"`);
207
293
  });
208
294
  }
209
-
210
- let jstemplates = result.match(/(\$\(.*?\))/gs)
211
- if(jstemplates){
212
- while(jstemplates.length){
213
- let jstemplate = jstemplates.pop()
214
- // @ts-ignore
215
- result = result.replace(jstemplate,`$\{${jstemplate.replace('$(','').replace(')','')}\}`)
216
- }
217
- }
218
- postMessage({
219
- template: `<div data-component=${e.data.name}>${result}</div>`,
220
- js: js ? js : ''
221
- })
222
-
223
- }
295
+ }
296
+
297
+ postMessage({
298
+ template: `<div data-component=${e.data.name}>${result}</div>`,
299
+ js: js ? js : ""
300
+ });
301
+ };