voc-lib-js 1.0.24 → 1.0.26
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/README.md +2 -4
- package/dist/main.d.mts +12 -3
- package/dist/main.d.ts +12 -3
- package/dist/main.global.js +2 -2
- package/dist/main.js +2 -2
- package/dist/main.mjs +2 -2
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -83,7 +83,7 @@ renderForm(element, data, options?) => RenderedForm | null
|
|
|
83
83
|
- onSubmitResult?: callback that receives (response, error) when submitConfig is used
|
|
84
84
|
- enableAutoSubmit?: boolean
|
|
85
85
|
- style?: "bootstrap" — add Bootstrap classes to inputs
|
|
86
|
-
-
|
|
86
|
+
- submit_config?: SubmitConfig — alternative place to pass submit configuration
|
|
87
87
|
|
|
88
88
|
RenderedForm (returned object)
|
|
89
89
|
|
|
@@ -95,7 +95,6 @@ RenderedForm (returned object)
|
|
|
95
95
|
SubmitConfig
|
|
96
96
|
|
|
97
97
|
- url: string — endpoint to post to
|
|
98
|
-
- method: one of GET | POST | PUT | PATCH | DELETE
|
|
99
98
|
- api_token?: string — optional Authorization token
|
|
100
99
|
- additional_data?: Record<string, any> — merged into payload
|
|
101
100
|
|
|
@@ -228,7 +227,7 @@ rendered.onSubmit((data, event) => {
|
|
|
228
227
|
|
|
229
228
|
Auto-submit
|
|
230
229
|
|
|
231
|
-
If the schema includes `submit_config` or you pass `
|
|
230
|
+
If the schema includes `submit_config` or you pass `submit_config` in options, the library will intercept the form submit and call the internal submit helper which posts to the configured endpoint. You can pass `onSubmitResult` in options to receive (response, error).
|
|
232
231
|
|
|
233
232
|
Example submit_config on the schema:
|
|
234
233
|
|
|
@@ -236,7 +235,6 @@ Example submit_config on the schema:
|
|
|
236
235
|
{
|
|
237
236
|
"submit_config": {
|
|
238
237
|
"url": "https://api.example.com/forms/submit",
|
|
239
|
-
"method": "POST",
|
|
240
238
|
"api_token": "<token>",
|
|
241
239
|
"additional_data": { "source": "website" }
|
|
242
240
|
},
|
package/dist/main.d.mts
CHANGED
|
@@ -31,7 +31,17 @@ type RowField = {
|
|
|
31
31
|
description?: string;
|
|
32
32
|
direction?: "horizontal" | "vertical";
|
|
33
33
|
};
|
|
34
|
-
type
|
|
34
|
+
type GroupField = {
|
|
35
|
+
label?: string;
|
|
36
|
+
type: "group";
|
|
37
|
+
items: Field[];
|
|
38
|
+
description?: string;
|
|
39
|
+
header?: {
|
|
40
|
+
title?: string;
|
|
41
|
+
description?: string;
|
|
42
|
+
};
|
|
43
|
+
};
|
|
44
|
+
type Field = BaseField | RowField | GroupField;
|
|
35
45
|
type FormData = {
|
|
36
46
|
id: string;
|
|
37
47
|
code: string;
|
|
@@ -42,7 +52,6 @@ type FormData = {
|
|
|
42
52
|
};
|
|
43
53
|
type SubmitConfig = {
|
|
44
54
|
url: string;
|
|
45
|
-
method: "GET" | "POST" | "PUT" | "PATCH" | "DELETE";
|
|
46
55
|
api_token?: string;
|
|
47
56
|
additional_data?: Record<string, any>;
|
|
48
57
|
};
|
|
@@ -60,7 +69,7 @@ declare function renderForm(element: string | HTMLElement, data: FormData, optio
|
|
|
60
69
|
onSubmitResult?: (response: any, error: Error | null) => void;
|
|
61
70
|
enableAutoSubmit?: boolean;
|
|
62
71
|
style?: "bootstrap" | undefined | null;
|
|
63
|
-
|
|
72
|
+
submit_config?: SubmitConfig;
|
|
64
73
|
}): RenderedForm | null;
|
|
65
74
|
|
|
66
75
|
declare const FormsLib: {
|
package/dist/main.d.ts
CHANGED
|
@@ -31,7 +31,17 @@ type RowField = {
|
|
|
31
31
|
description?: string;
|
|
32
32
|
direction?: "horizontal" | "vertical";
|
|
33
33
|
};
|
|
34
|
-
type
|
|
34
|
+
type GroupField = {
|
|
35
|
+
label?: string;
|
|
36
|
+
type: "group";
|
|
37
|
+
items: Field[];
|
|
38
|
+
description?: string;
|
|
39
|
+
header?: {
|
|
40
|
+
title?: string;
|
|
41
|
+
description?: string;
|
|
42
|
+
};
|
|
43
|
+
};
|
|
44
|
+
type Field = BaseField | RowField | GroupField;
|
|
35
45
|
type FormData = {
|
|
36
46
|
id: string;
|
|
37
47
|
code: string;
|
|
@@ -42,7 +52,6 @@ type FormData = {
|
|
|
42
52
|
};
|
|
43
53
|
type SubmitConfig = {
|
|
44
54
|
url: string;
|
|
45
|
-
method: "GET" | "POST" | "PUT" | "PATCH" | "DELETE";
|
|
46
55
|
api_token?: string;
|
|
47
56
|
additional_data?: Record<string, any>;
|
|
48
57
|
};
|
|
@@ -60,7 +69,7 @@ declare function renderForm(element: string | HTMLElement, data: FormData, optio
|
|
|
60
69
|
onSubmitResult?: (response: any, error: Error | null) => void;
|
|
61
70
|
enableAutoSubmit?: boolean;
|
|
62
71
|
style?: "bootstrap" | undefined | null;
|
|
63
|
-
|
|
72
|
+
submit_config?: SubmitConfig;
|
|
64
73
|
}): RenderedForm | null;
|
|
65
74
|
|
|
66
75
|
declare const FormsLib: {
|
package/dist/main.global.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var VocLibJs=(()=>{var
|
|
2
|
-
`).reduce((
|
|
1
|
+
"use strict";var VocLibJs=(()=>{var F=Object.defineProperty;var S=Object.getOwnPropertyDescriptor;var A=Object.getOwnPropertyNames;var H=Object.prototype.hasOwnProperty;var q=(y,d)=>{for(var p in d)F(y,p,{get:d[p],enumerable:!0})},B=(y,d,p,f)=>{if(d&&typeof d=="object"||typeof d=="function")for(let v of A(d))!H.call(y,v)&&v!==p&&F(y,v,{get:()=>d[v],enumerable:!(f=S(d,v))||f.enumerable});return y};var $=y=>B(F({},"__esModule",{value:!0}),y);var V={};q(V,{FormsLib:()=>z,default:()=>W});function C(y,d=!0){let p=new FormData(y);if(d)return p;let f={};return p.forEach((v,u)=>{let E=(v instanceof File,v);Object.prototype.hasOwnProperty.call(f,u)?Array.isArray(f[u])?f[u].push(E):f[u]=[f[u],E]:f[u]=E}),f}async function N(y,d,p){let f=d.url,v={"Content-Type":"application/json"};d?.api_token&&(v.Authorization=`Bearer ${d.api_token}`);let u=C(y);if(d?.additional_data)for(let[a,g]of Object.entries(d.additional_data))u.append(a,g);let E,s=u instanceof FormData;E={method:"POST",headers:{Authorization:`Bearer ${d.api_token}`,...s?{}:{"Content-Type":"application/json"},Accept:"application/json"},body:s?u:JSON.stringify(Object.fromEntries(u.entries()))};try{fetch(f,E).then(a=>{let g=a.headers.get("content-type");if(!a.ok){let w=a.text();throw new Error(`HTTP ${a.status}: ${w}`)}return g&&g.includes("application/json")?a.json():a.text()}).then(a=>{p&&p(a,null)}).catch(a=>{p&&p(null,a)})}catch(a){p&&p(null,a)}}function R(y,d,p){let f=[];if(typeof y=="string"?f=Array.from(document.querySelectorAll(y)):f=[y],f.length===0)return null;function v(){let s=p?.style==="bootstrap",a=document.createElement("form");a.classList.add("voc-form"),s&&a.classList.add("needs-validation"),a.id=d.id;let g=document.createElement("h2");g.textContent=d.form_name,a.appendChild(g);function w(e,i){i&&(i.min_length!==void 0&&(e.minLength=i.min_length),i.max_length!==void 0&&(e.maxLength=i.max_length),i.regex&&(e instanceof HTMLInputElement?e.pattern=i.regex:e.dataset.pattern=i.regex))}function k(e){if(!e.key&&!e.label)return null;let i=d.default_values||{},h=e.name||e.key,o=h?i[h]:void 0,b=document.createElement("div");if(b.className="voc-form-group",s&&b.classList.add("mb-3"),e.label){let t=document.createElement("label");t.classList.add("voc-form-label"),s&&t.classList.add("form-label"),e.key?e.type==="radio"?t.htmlFor="":t.htmlFor=`voc-form-${e.key}`:t.htmlFor="",t.textContent=e.label+(e.required?" *":""),b.appendChild(t)}let m=null;switch(e.type){case"checkbox":{let t=document.createElement("div");if(t.className="voc-form-checkbox-group "+(e.direction||"vertical"),e.width&&(t.style.width=e.width),e.options)e.options.forEach((n,c)=>{let l=document.createElement("label");l.classList.add("voc-form-checkbox-label"),s&&l.classList.add("form-check"),l.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(l.style.width=e.width);let r=document.createElement("input");r.type="checkbox",r.classList.add("voc-form-checkbox"),s&&r.classList.add("form-check-input"),r.name=e.name||e.key||"",r.value=n.value,e.key&&(r.id=`voc-form-${e.key}-${c}`),e.required&&(r.required=!0),Array.isArray(o)?o.includes(n.value)&&(r.checked=!0):o!==void 0?o===n.value&&(r.checked=!0):e.default===n.value&&(r.checked=!0),l.appendChild(r),l.appendChild(document.createTextNode(n.label)),t.appendChild(l)});else{let n=document.createElement("label");n.classList.add("voc-form-checkbox-label"),s&&n.classList.add("form-check"),e.width&&(n.style.width=e.width);let c=document.createElement("input");c.type="checkbox",c.classList.add("voc-form-checkbox"),(e.key||e.name)&&(c.name=e.name||e.key,e.key&&(c.id=`voc-form-${e.key}`)),s&&c.classList.add("form-check-input"),e.required&&(c.required=!0),o!==void 0?c.checked=!!o:e.default&&(c.checked=!!e.default),n.appendChild(c),n.appendChild(document.createTextNode(e.label||"")),t.appendChild(n)}m=t;break}case"textarea":{let t=document.createElement("textarea");t.classList.add("voc-form-textarea"),s&&t.classList.add("form-control"),(e.key||e.name)&&(t.name=e.name||e.key,e.key&&(t.id=`voc-form-${e.key}`)),e.placeholder&&(t.placeholder=e.placeholder),o!=null?t.value=String(o):e.default!==void 0&&e.default!==null&&(t.value=String(e.default));let n=e.default||o||"";if(n){let c=(n.match(/\n/g)||[]).length,l=80,r=n.split(`
|
|
2
|
+
`).reduce((D,M)=>Math.max(D,M.length),0),L=Math.ceil(r/l)||1,_=Math.max(2,c+L);t.rows=_,t.style.resize="vertical"}e.width&&(t.style.width=e.width),e.required&&(t.required=!0),w(t,e.validation),m=t;break}case"select":{let t=document.createElement("select");if(t.classList.add("voc-form-select"),s&&t.classList.add("form-select"),(e.key||e.name)&&(t.name=e.name||e.key,e.key&&(t.id=`voc-form-${e.key}`)),e.placeholder){let n=document.createElement("option");n.value="",n.textContent=e.placeholder,n.disabled=!0,n.selected=!0,t.appendChild(n)}e.required&&(t.required=!0),e.options&&e.options.forEach(n=>{let c=document.createElement("option");c.value=n.value,c.textContent=n.label,Array.isArray(o)?o.includes(n.value)&&(c.selected=!0):o!==void 0?o===n.value&&(c.selected=!0):e.default===n.value&&(c.selected=!0),t.appendChild(c)}),e.width&&(t.style.width=e.width),m=t;break}case"radio":{let t=document.createElement("div");t.className="voc-form-radio-group "+(e.direction||"vertical"),e.width&&(t.style.width=e.width),e.options&&e.options.forEach((n,c)=>{let l=document.createElement("label");l.classList.add("voc-form-radio-label"),s&&l.classList.add("form-check"),l.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(l.style.width=e.width);let r=document.createElement("input");r.type="radio",r.classList.add("voc-form-radio"),s&&r.classList.add("form-check-input"),r.name=e.name||e.key||"",r.value=n.value,e.key&&(r.id=`voc-form-${e.key}-${c}`),Array.isArray(o)?o.includes(n.value)&&(r.checked=!0):o!==void 0?o===n.value&&(r.checked=!0):e.default===n.value&&(r.checked=!0),l.appendChild(r),l.appendChild(document.createTextNode(n.label)),t.appendChild(l)}),m=t;break}case"file":{let t=document.createElement("div");t.className="voc-form-file-wrapper",e.width&&(t.style.width=e.width);let n=document.createElement("input");n.type="file",n.classList.add("voc-form-file"),s&&n.classList.add("form-control"),(e.key||e.name)&&(n.name=e.name||e.key,e.key&&(n.id=`voc-form-${e.key}`)),e.width&&(n.style.width=e.width),e.required&&(n.required=!0),e.accept&&(n.accept=e.accept),e.multiple&&(n.multiple=!0),t.appendChild(n),m=t;break}default:{let t=document.createElement("input");t.type=e.type||"text",t.classList.add("voc-form-input"),s&&t.classList.add("form-control"),(e.key||e.name)&&(t.name=e.name||e.key,e.key&&(t.id=`voc-form-${e.key}`)),e.placeholder&&(t.placeholder=e.placeholder),o!=null?t.value=String(o):e.default!==void 0&&e.default!==null&&(t.value=String(e.default)),e.width&&(t.style.width=e.width),e.required&&(t.required=!0),w(t,e.validation),m=t;break}}if(m&&b.appendChild(m),e.hint_text){let t=document.createElement("small");t.className="voc-form-hint",t.textContent=e.hint_text,b.appendChild(t)}return b}d.fields.forEach(e=>{if(e.type==="group"&&"items"in e){let i=e;if(s){let h=document.createElement("div");h.className="card voc-form-group-card mb-3";let o=i.label||i.header?.title,b=i.description||i.header?.description;if(o||b){let t=document.createElement("div");if(t.className="card-header voc-form-group-head",o){let n=document.createElement("h5");n.className="mb-0 voc-form-group-label",n.textContent=o,t.appendChild(n)}if(b){let n=document.createElement("p");n.className="mb-0 voc-form-group-description",n.textContent=b,t.appendChild(n)}h.appendChild(t)}let m=document.createElement("div");m.className="card-body voc-form-group-body",i.items.forEach(t=>{if(t.type==="row"&&"items"in t){let n=t,c=document.createElement("div");if(c.className="voc-form-group voc-form-row mb-3",n.label){let r=document.createElement("h6");r.className="voc-form-row-label",r.textContent=n.label,c.appendChild(r)}let l=document.createElement("div");l.className="voc-form-row-items "+(n.direction||"horizontal"),n.items.forEach(r=>{let L=k(r);L&&l.appendChild(L)}),c.appendChild(l),m.appendChild(c)}else{let n=k(t);n&&m.appendChild(n)}}),h.appendChild(m),a.appendChild(h)}else{let h=document.createElement("div");h.className="voc-form-group voc-form-group-wrapper",s&&h.classList.add("mb-3");let o=i.label||i.header?.title,b=i.description||i.header?.description;if(o||b){let m=document.createElement("div");if(m.className="voc-form-group-head",o){let t=document.createElement("h3");t.className="voc-form-group-label",t.textContent=o,m.appendChild(t)}if(b){let t=document.createElement("p");t.className="voc-form-group-description",t.textContent=b,m.appendChild(t)}h.appendChild(m)}i.items.forEach(m=>{if(m.type==="row"&&"items"in m){let t=m,n=document.createElement("div");if(n.className="voc-form-group voc-form-row",s&&n.classList.add("mb-3"),t.label){let l=document.createElement("h4");l.className="voc-form-row-label",l.textContent=t.label,n.appendChild(l)}let c=document.createElement("div");c.className="voc-form-row-items "+(t.direction||"horizontal"),t.items.forEach(l=>{let r=k(l);r&&c.appendChild(r)}),n.appendChild(c),h.appendChild(n)}else{let t=k(m);t&&h.appendChild(t)}}),a.appendChild(h)}return}if(e.type==="row"&&"items"in e){let i=document.createElement("div");if(i.className="voc-form-group voc-form-row",s&&i.classList.add("mb-3"),e.label){let o=document.createElement("h3");o.className="voc-form-row-label",o.textContent=e.label,i.appendChild(o)}if(e.description){let o=document.createElement("p");o.className="voc-form-row-description",o.textContent=e.description,i.appendChild(o)}let h=document.createElement("div");h.className="voc-form-row-items "+(e.direction||"horizontal"),i.appendChild(h),e.items.forEach(o=>{let b=k(o);b&&h.appendChild(b)}),a.appendChild(i)}else{let i=k(e);i&&a.appendChild(i)}});let x=document.createElement("button");return x.type="submit",x.className="voc-form-submit",x.textContent="Submit",s&&x.classList.add("btn","btn-primary"),a.appendChild(x),a}let u=v();f[0].appendChild(u);let E=d?.submit_config??p?.submit_config??null;return E&&u.addEventListener("submit",s=>{s.preventDefault(),N(u,E,(a,g)=>{p?.onSubmitResult&&p.onSubmitResult(a,g)})}),{element:u,validate:()=>{let s=[];return u.querySelectorAll(":invalid").forEach(g=>{let w=g.validationMessage;s.push({element:g,message:w})}),s},getValues:()=>C(u),onSubmit:s=>{u.addEventListener("submit",a=>{a.preventDefault();let g=C(u);s(g,a)})}}}var T={renderForm:R};var z=T,W={FormsLib:T};return $(V);})();
|
package/dist/main.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var
|
|
2
|
-
`).reduce((
|
|
1
|
+
"use strict";var F=Object.defineProperty;var S=Object.getOwnPropertyDescriptor;var A=Object.getOwnPropertyNames;var H=Object.prototype.hasOwnProperty;var q=(y,d)=>{for(var p in d)F(y,p,{get:d[p],enumerable:!0})},B=(y,d,p,f)=>{if(d&&typeof d=="object"||typeof d=="function")for(let v of A(d))!H.call(y,v)&&v!==p&&F(y,v,{get:()=>d[v],enumerable:!(f=S(d,v))||f.enumerable});return y};var $=y=>B(F({},"__esModule",{value:!0}),y);var V={};q(V,{FormsLib:()=>z,default:()=>W});module.exports=$(V);function C(y,d=!0){let p=new FormData(y);if(d)return p;let f={};return p.forEach((v,u)=>{let E=(v instanceof File,v);Object.prototype.hasOwnProperty.call(f,u)?Array.isArray(f[u])?f[u].push(E):f[u]=[f[u],E]:f[u]=E}),f}async function N(y,d,p){let f=d.url,v={"Content-Type":"application/json"};d?.api_token&&(v.Authorization=`Bearer ${d.api_token}`);let u=C(y);if(d?.additional_data)for(let[a,g]of Object.entries(d.additional_data))u.append(a,g);let E,s=u instanceof FormData;E={method:"POST",headers:{Authorization:`Bearer ${d.api_token}`,...s?{}:{"Content-Type":"application/json"},Accept:"application/json"},body:s?u:JSON.stringify(Object.fromEntries(u.entries()))};try{fetch(f,E).then(a=>{let g=a.headers.get("content-type");if(!a.ok){let w=a.text();throw new Error(`HTTP ${a.status}: ${w}`)}return g&&g.includes("application/json")?a.json():a.text()}).then(a=>{p&&p(a,null)}).catch(a=>{p&&p(null,a)})}catch(a){p&&p(null,a)}}function R(y,d,p){let f=[];if(typeof y=="string"?f=Array.from(document.querySelectorAll(y)):f=[y],f.length===0)return null;function v(){let s=p?.style==="bootstrap",a=document.createElement("form");a.classList.add("voc-form"),s&&a.classList.add("needs-validation"),a.id=d.id;let g=document.createElement("h2");g.textContent=d.form_name,a.appendChild(g);function w(e,i){i&&(i.min_length!==void 0&&(e.minLength=i.min_length),i.max_length!==void 0&&(e.maxLength=i.max_length),i.regex&&(e instanceof HTMLInputElement?e.pattern=i.regex:e.dataset.pattern=i.regex))}function k(e){if(!e.key&&!e.label)return null;let i=d.default_values||{},h=e.name||e.key,o=h?i[h]:void 0,b=document.createElement("div");if(b.className="voc-form-group",s&&b.classList.add("mb-3"),e.label){let t=document.createElement("label");t.classList.add("voc-form-label"),s&&t.classList.add("form-label"),e.key?e.type==="radio"?t.htmlFor="":t.htmlFor=`voc-form-${e.key}`:t.htmlFor="",t.textContent=e.label+(e.required?" *":""),b.appendChild(t)}let m=null;switch(e.type){case"checkbox":{let t=document.createElement("div");if(t.className="voc-form-checkbox-group "+(e.direction||"vertical"),e.width&&(t.style.width=e.width),e.options)e.options.forEach((n,c)=>{let l=document.createElement("label");l.classList.add("voc-form-checkbox-label"),s&&l.classList.add("form-check"),l.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(l.style.width=e.width);let r=document.createElement("input");r.type="checkbox",r.classList.add("voc-form-checkbox"),s&&r.classList.add("form-check-input"),r.name=e.name||e.key||"",r.value=n.value,e.key&&(r.id=`voc-form-${e.key}-${c}`),e.required&&(r.required=!0),Array.isArray(o)?o.includes(n.value)&&(r.checked=!0):o!==void 0?o===n.value&&(r.checked=!0):e.default===n.value&&(r.checked=!0),l.appendChild(r),l.appendChild(document.createTextNode(n.label)),t.appendChild(l)});else{let n=document.createElement("label");n.classList.add("voc-form-checkbox-label"),s&&n.classList.add("form-check"),e.width&&(n.style.width=e.width);let c=document.createElement("input");c.type="checkbox",c.classList.add("voc-form-checkbox"),(e.key||e.name)&&(c.name=e.name||e.key,e.key&&(c.id=`voc-form-${e.key}`)),s&&c.classList.add("form-check-input"),e.required&&(c.required=!0),o!==void 0?c.checked=!!o:e.default&&(c.checked=!!e.default),n.appendChild(c),n.appendChild(document.createTextNode(e.label||"")),t.appendChild(n)}m=t;break}case"textarea":{let t=document.createElement("textarea");t.classList.add("voc-form-textarea"),s&&t.classList.add("form-control"),(e.key||e.name)&&(t.name=e.name||e.key,e.key&&(t.id=`voc-form-${e.key}`)),e.placeholder&&(t.placeholder=e.placeholder),o!=null?t.value=String(o):e.default!==void 0&&e.default!==null&&(t.value=String(e.default));let n=e.default||o||"";if(n){let c=(n.match(/\n/g)||[]).length,l=80,r=n.split(`
|
|
2
|
+
`).reduce((D,M)=>Math.max(D,M.length),0),L=Math.ceil(r/l)||1,_=Math.max(2,c+L);t.rows=_,t.style.resize="vertical"}e.width&&(t.style.width=e.width),e.required&&(t.required=!0),w(t,e.validation),m=t;break}case"select":{let t=document.createElement("select");if(t.classList.add("voc-form-select"),s&&t.classList.add("form-select"),(e.key||e.name)&&(t.name=e.name||e.key,e.key&&(t.id=`voc-form-${e.key}`)),e.placeholder){let n=document.createElement("option");n.value="",n.textContent=e.placeholder,n.disabled=!0,n.selected=!0,t.appendChild(n)}e.required&&(t.required=!0),e.options&&e.options.forEach(n=>{let c=document.createElement("option");c.value=n.value,c.textContent=n.label,Array.isArray(o)?o.includes(n.value)&&(c.selected=!0):o!==void 0?o===n.value&&(c.selected=!0):e.default===n.value&&(c.selected=!0),t.appendChild(c)}),e.width&&(t.style.width=e.width),m=t;break}case"radio":{let t=document.createElement("div");t.className="voc-form-radio-group "+(e.direction||"vertical"),e.width&&(t.style.width=e.width),e.options&&e.options.forEach((n,c)=>{let l=document.createElement("label");l.classList.add("voc-form-radio-label"),s&&l.classList.add("form-check"),l.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(l.style.width=e.width);let r=document.createElement("input");r.type="radio",r.classList.add("voc-form-radio"),s&&r.classList.add("form-check-input"),r.name=e.name||e.key||"",r.value=n.value,e.key&&(r.id=`voc-form-${e.key}-${c}`),Array.isArray(o)?o.includes(n.value)&&(r.checked=!0):o!==void 0?o===n.value&&(r.checked=!0):e.default===n.value&&(r.checked=!0),l.appendChild(r),l.appendChild(document.createTextNode(n.label)),t.appendChild(l)}),m=t;break}case"file":{let t=document.createElement("div");t.className="voc-form-file-wrapper",e.width&&(t.style.width=e.width);let n=document.createElement("input");n.type="file",n.classList.add("voc-form-file"),s&&n.classList.add("form-control"),(e.key||e.name)&&(n.name=e.name||e.key,e.key&&(n.id=`voc-form-${e.key}`)),e.width&&(n.style.width=e.width),e.required&&(n.required=!0),e.accept&&(n.accept=e.accept),e.multiple&&(n.multiple=!0),t.appendChild(n),m=t;break}default:{let t=document.createElement("input");t.type=e.type||"text",t.classList.add("voc-form-input"),s&&t.classList.add("form-control"),(e.key||e.name)&&(t.name=e.name||e.key,e.key&&(t.id=`voc-form-${e.key}`)),e.placeholder&&(t.placeholder=e.placeholder),o!=null?t.value=String(o):e.default!==void 0&&e.default!==null&&(t.value=String(e.default)),e.width&&(t.style.width=e.width),e.required&&(t.required=!0),w(t,e.validation),m=t;break}}if(m&&b.appendChild(m),e.hint_text){let t=document.createElement("small");t.className="voc-form-hint",t.textContent=e.hint_text,b.appendChild(t)}return b}d.fields.forEach(e=>{if(e.type==="group"&&"items"in e){let i=e;if(s){let h=document.createElement("div");h.className="card voc-form-group-card mb-3";let o=i.label||i.header?.title,b=i.description||i.header?.description;if(o||b){let t=document.createElement("div");if(t.className="card-header voc-form-group-head",o){let n=document.createElement("h5");n.className="mb-0 voc-form-group-label",n.textContent=o,t.appendChild(n)}if(b){let n=document.createElement("p");n.className="mb-0 voc-form-group-description",n.textContent=b,t.appendChild(n)}h.appendChild(t)}let m=document.createElement("div");m.className="card-body voc-form-group-body",i.items.forEach(t=>{if(t.type==="row"&&"items"in t){let n=t,c=document.createElement("div");if(c.className="voc-form-group voc-form-row mb-3",n.label){let r=document.createElement("h6");r.className="voc-form-row-label",r.textContent=n.label,c.appendChild(r)}let l=document.createElement("div");l.className="voc-form-row-items "+(n.direction||"horizontal"),n.items.forEach(r=>{let L=k(r);L&&l.appendChild(L)}),c.appendChild(l),m.appendChild(c)}else{let n=k(t);n&&m.appendChild(n)}}),h.appendChild(m),a.appendChild(h)}else{let h=document.createElement("div");h.className="voc-form-group voc-form-group-wrapper",s&&h.classList.add("mb-3");let o=i.label||i.header?.title,b=i.description||i.header?.description;if(o||b){let m=document.createElement("div");if(m.className="voc-form-group-head",o){let t=document.createElement("h3");t.className="voc-form-group-label",t.textContent=o,m.appendChild(t)}if(b){let t=document.createElement("p");t.className="voc-form-group-description",t.textContent=b,m.appendChild(t)}h.appendChild(m)}i.items.forEach(m=>{if(m.type==="row"&&"items"in m){let t=m,n=document.createElement("div");if(n.className="voc-form-group voc-form-row",s&&n.classList.add("mb-3"),t.label){let l=document.createElement("h4");l.className="voc-form-row-label",l.textContent=t.label,n.appendChild(l)}let c=document.createElement("div");c.className="voc-form-row-items "+(t.direction||"horizontal"),t.items.forEach(l=>{let r=k(l);r&&c.appendChild(r)}),n.appendChild(c),h.appendChild(n)}else{let t=k(m);t&&h.appendChild(t)}}),a.appendChild(h)}return}if(e.type==="row"&&"items"in e){let i=document.createElement("div");if(i.className="voc-form-group voc-form-row",s&&i.classList.add("mb-3"),e.label){let o=document.createElement("h3");o.className="voc-form-row-label",o.textContent=e.label,i.appendChild(o)}if(e.description){let o=document.createElement("p");o.className="voc-form-row-description",o.textContent=e.description,i.appendChild(o)}let h=document.createElement("div");h.className="voc-form-row-items "+(e.direction||"horizontal"),i.appendChild(h),e.items.forEach(o=>{let b=k(o);b&&h.appendChild(b)}),a.appendChild(i)}else{let i=k(e);i&&a.appendChild(i)}});let x=document.createElement("button");return x.type="submit",x.className="voc-form-submit",x.textContent="Submit",s&&x.classList.add("btn","btn-primary"),a.appendChild(x),a}let u=v();f[0].appendChild(u);let E=d?.submit_config??p?.submit_config??null;return E&&u.addEventListener("submit",s=>{s.preventDefault(),N(u,E,(a,g)=>{p?.onSubmitResult&&p.onSubmitResult(a,g)})}),{element:u,validate:()=>{let s=[];return u.querySelectorAll(":invalid").forEach(g=>{let w=g.validationMessage;s.push({element:g,message:w})}),s},getValues:()=>C(u),onSubmit:s=>{u.addEventListener("submit",a=>{a.preventDefault();let g=C(u);s(g,a)})}}}var T={renderForm:R};var z=T,W={FormsLib:T};0&&(module.exports={FormsLib});
|
package/dist/main.mjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
function
|
|
2
|
-
`).reduce((_,
|
|
1
|
+
function C(v,h=!0){let f=new FormData(v);if(h)return f;let b={};return f.forEach((E,m)=>{let g=(E instanceof File,E);Object.prototype.hasOwnProperty.call(b,m)?Array.isArray(b[m])?b[m].push(g):b[m]=[b[m],g]:b[m]=g}),b}async function T(v,h,f){let b=h.url,E={"Content-Type":"application/json"};h?.api_token&&(E.Authorization=`Bearer ${h.api_token}`);let m=C(v);if(h?.additional_data)for(let[a,y]of Object.entries(h.additional_data))m.append(a,y);let g,s=m instanceof FormData;g={method:"POST",headers:{Authorization:`Bearer ${h.api_token}`,...s?{}:{"Content-Type":"application/json"},Accept:"application/json"},body:s?m:JSON.stringify(Object.fromEntries(m.entries()))};try{fetch(b,g).then(a=>{let y=a.headers.get("content-type");if(!a.ok){let w=a.text();throw new Error(`HTTP ${a.status}: ${w}`)}return y&&y.includes("application/json")?a.json():a.text()}).then(a=>{f&&f(a,null)}).catch(a=>{f&&f(null,a)})}catch(a){f&&f(null,a)}}function N(v,h,f){let b=[];if(typeof v=="string"?b=Array.from(document.querySelectorAll(v)):b=[v],b.length===0)return null;function E(){let s=f?.style==="bootstrap",a=document.createElement("form");a.classList.add("voc-form"),s&&a.classList.add("needs-validation"),a.id=h.id;let y=document.createElement("h2");y.textContent=h.form_name,a.appendChild(y);function w(e,i){i&&(i.min_length!==void 0&&(e.minLength=i.min_length),i.max_length!==void 0&&(e.maxLength=i.max_length),i.regex&&(e instanceof HTMLInputElement?e.pattern=i.regex:e.dataset.pattern=i.regex))}function k(e){if(!e.key&&!e.label)return null;let i=h.default_values||{},u=e.name||e.key,o=u?i[u]:void 0,p=document.createElement("div");if(p.className="voc-form-group",s&&p.classList.add("mb-3"),e.label){let t=document.createElement("label");t.classList.add("voc-form-label"),s&&t.classList.add("form-label"),e.key?e.type==="radio"?t.htmlFor="":t.htmlFor=`voc-form-${e.key}`:t.htmlFor="",t.textContent=e.label+(e.required?" *":""),p.appendChild(t)}let d=null;switch(e.type){case"checkbox":{let t=document.createElement("div");if(t.className="voc-form-checkbox-group "+(e.direction||"vertical"),e.width&&(t.style.width=e.width),e.options)e.options.forEach((n,c)=>{let l=document.createElement("label");l.classList.add("voc-form-checkbox-label"),s&&l.classList.add("form-check"),l.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(l.style.width=e.width);let r=document.createElement("input");r.type="checkbox",r.classList.add("voc-form-checkbox"),s&&r.classList.add("form-check-input"),r.name=e.name||e.key||"",r.value=n.value,e.key&&(r.id=`voc-form-${e.key}-${c}`),e.required&&(r.required=!0),Array.isArray(o)?o.includes(n.value)&&(r.checked=!0):o!==void 0?o===n.value&&(r.checked=!0):e.default===n.value&&(r.checked=!0),l.appendChild(r),l.appendChild(document.createTextNode(n.label)),t.appendChild(l)});else{let n=document.createElement("label");n.classList.add("voc-form-checkbox-label"),s&&n.classList.add("form-check"),e.width&&(n.style.width=e.width);let c=document.createElement("input");c.type="checkbox",c.classList.add("voc-form-checkbox"),(e.key||e.name)&&(c.name=e.name||e.key,e.key&&(c.id=`voc-form-${e.key}`)),s&&c.classList.add("form-check-input"),e.required&&(c.required=!0),o!==void 0?c.checked=!!o:e.default&&(c.checked=!!e.default),n.appendChild(c),n.appendChild(document.createTextNode(e.label||"")),t.appendChild(n)}d=t;break}case"textarea":{let t=document.createElement("textarea");t.classList.add("voc-form-textarea"),s&&t.classList.add("form-control"),(e.key||e.name)&&(t.name=e.name||e.key,e.key&&(t.id=`voc-form-${e.key}`)),e.placeholder&&(t.placeholder=e.placeholder),o!=null?t.value=String(o):e.default!==void 0&&e.default!==null&&(t.value=String(e.default));let n=e.default||o||"";if(n){let c=(n.match(/\n/g)||[]).length,l=80,r=n.split(`
|
|
2
|
+
`).reduce((_,D)=>Math.max(_,D.length),0),L=Math.ceil(r/l)||1,R=Math.max(2,c+L);t.rows=R,t.style.resize="vertical"}e.width&&(t.style.width=e.width),e.required&&(t.required=!0),w(t,e.validation),d=t;break}case"select":{let t=document.createElement("select");if(t.classList.add("voc-form-select"),s&&t.classList.add("form-select"),(e.key||e.name)&&(t.name=e.name||e.key,e.key&&(t.id=`voc-form-${e.key}`)),e.placeholder){let n=document.createElement("option");n.value="",n.textContent=e.placeholder,n.disabled=!0,n.selected=!0,t.appendChild(n)}e.required&&(t.required=!0),e.options&&e.options.forEach(n=>{let c=document.createElement("option");c.value=n.value,c.textContent=n.label,Array.isArray(o)?o.includes(n.value)&&(c.selected=!0):o!==void 0?o===n.value&&(c.selected=!0):e.default===n.value&&(c.selected=!0),t.appendChild(c)}),e.width&&(t.style.width=e.width),d=t;break}case"radio":{let t=document.createElement("div");t.className="voc-form-radio-group "+(e.direction||"vertical"),e.width&&(t.style.width=e.width),e.options&&e.options.forEach((n,c)=>{let l=document.createElement("label");l.classList.add("voc-form-radio-label"),s&&l.classList.add("form-check"),l.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(l.style.width=e.width);let r=document.createElement("input");r.type="radio",r.classList.add("voc-form-radio"),s&&r.classList.add("form-check-input"),r.name=e.name||e.key||"",r.value=n.value,e.key&&(r.id=`voc-form-${e.key}-${c}`),Array.isArray(o)?o.includes(n.value)&&(r.checked=!0):o!==void 0?o===n.value&&(r.checked=!0):e.default===n.value&&(r.checked=!0),l.appendChild(r),l.appendChild(document.createTextNode(n.label)),t.appendChild(l)}),d=t;break}case"file":{let t=document.createElement("div");t.className="voc-form-file-wrapper",e.width&&(t.style.width=e.width);let n=document.createElement("input");n.type="file",n.classList.add("voc-form-file"),s&&n.classList.add("form-control"),(e.key||e.name)&&(n.name=e.name||e.key,e.key&&(n.id=`voc-form-${e.key}`)),e.width&&(n.style.width=e.width),e.required&&(n.required=!0),e.accept&&(n.accept=e.accept),e.multiple&&(n.multiple=!0),t.appendChild(n),d=t;break}default:{let t=document.createElement("input");t.type=e.type||"text",t.classList.add("voc-form-input"),s&&t.classList.add("form-control"),(e.key||e.name)&&(t.name=e.name||e.key,e.key&&(t.id=`voc-form-${e.key}`)),e.placeholder&&(t.placeholder=e.placeholder),o!=null?t.value=String(o):e.default!==void 0&&e.default!==null&&(t.value=String(e.default)),e.width&&(t.style.width=e.width),e.required&&(t.required=!0),w(t,e.validation),d=t;break}}if(d&&p.appendChild(d),e.hint_text){let t=document.createElement("small");t.className="voc-form-hint",t.textContent=e.hint_text,p.appendChild(t)}return p}h.fields.forEach(e=>{if(e.type==="group"&&"items"in e){let i=e;if(s){let u=document.createElement("div");u.className="card voc-form-group-card mb-3";let o=i.label||i.header?.title,p=i.description||i.header?.description;if(o||p){let t=document.createElement("div");if(t.className="card-header voc-form-group-head",o){let n=document.createElement("h5");n.className="mb-0 voc-form-group-label",n.textContent=o,t.appendChild(n)}if(p){let n=document.createElement("p");n.className="mb-0 voc-form-group-description",n.textContent=p,t.appendChild(n)}u.appendChild(t)}let d=document.createElement("div");d.className="card-body voc-form-group-body",i.items.forEach(t=>{if(t.type==="row"&&"items"in t){let n=t,c=document.createElement("div");if(c.className="voc-form-group voc-form-row mb-3",n.label){let r=document.createElement("h6");r.className="voc-form-row-label",r.textContent=n.label,c.appendChild(r)}let l=document.createElement("div");l.className="voc-form-row-items "+(n.direction||"horizontal"),n.items.forEach(r=>{let L=k(r);L&&l.appendChild(L)}),c.appendChild(l),d.appendChild(c)}else{let n=k(t);n&&d.appendChild(n)}}),u.appendChild(d),a.appendChild(u)}else{let u=document.createElement("div");u.className="voc-form-group voc-form-group-wrapper",s&&u.classList.add("mb-3");let o=i.label||i.header?.title,p=i.description||i.header?.description;if(o||p){let d=document.createElement("div");if(d.className="voc-form-group-head",o){let t=document.createElement("h3");t.className="voc-form-group-label",t.textContent=o,d.appendChild(t)}if(p){let t=document.createElement("p");t.className="voc-form-group-description",t.textContent=p,d.appendChild(t)}u.appendChild(d)}i.items.forEach(d=>{if(d.type==="row"&&"items"in d){let t=d,n=document.createElement("div");if(n.className="voc-form-group voc-form-row",s&&n.classList.add("mb-3"),t.label){let l=document.createElement("h4");l.className="voc-form-row-label",l.textContent=t.label,n.appendChild(l)}let c=document.createElement("div");c.className="voc-form-row-items "+(t.direction||"horizontal"),t.items.forEach(l=>{let r=k(l);r&&c.appendChild(r)}),n.appendChild(c),u.appendChild(n)}else{let t=k(d);t&&u.appendChild(t)}}),a.appendChild(u)}return}if(e.type==="row"&&"items"in e){let i=document.createElement("div");if(i.className="voc-form-group voc-form-row",s&&i.classList.add("mb-3"),e.label){let o=document.createElement("h3");o.className="voc-form-row-label",o.textContent=e.label,i.appendChild(o)}if(e.description){let o=document.createElement("p");o.className="voc-form-row-description",o.textContent=e.description,i.appendChild(o)}let u=document.createElement("div");u.className="voc-form-row-items "+(e.direction||"horizontal"),i.appendChild(u),e.items.forEach(o=>{let p=k(o);p&&u.appendChild(p)}),a.appendChild(i)}else{let i=k(e);i&&a.appendChild(i)}});let x=document.createElement("button");return x.type="submit",x.className="voc-form-submit",x.textContent="Submit",s&&x.classList.add("btn","btn-primary"),a.appendChild(x),a}let m=E();b[0].appendChild(m);let g=h?.submit_config??f?.submit_config??null;return g&&m.addEventListener("submit",s=>{s.preventDefault(),T(m,g,(a,y)=>{f?.onSubmitResult&&f.onSubmitResult(a,y)})}),{element:m,validate:()=>{let s=[];return m.querySelectorAll(":invalid").forEach(y=>{let w=y.validationMessage;s.push({element:y,message:w})}),s},getValues:()=>C(m),onSubmit:s=>{m.addEventListener("submit",a=>{a.preventDefault();let y=C(m);s(y,a)})}}}var F={renderForm:N};var V=F,O={FormsLib:F};export{V as FormsLib,O as default};
|