voc-lib-js 1.0.42 → 1.0.46
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/main.d.mts +1 -1
- package/dist/main.d.ts +1 -1
- package/dist/main.global.js +1 -1
- package/dist/main.js +1 -1
- package/dist/main.mjs +1 -1
- package/package.json +1 -1
package/dist/main.d.mts
CHANGED
|
@@ -66,7 +66,7 @@ interface RenderedForm {
|
|
|
66
66
|
}
|
|
67
67
|
type RenderOptions = {
|
|
68
68
|
onSubmit?: (result: any, error?: any) => void;
|
|
69
|
-
onSubmitResult?: (response: any, error: Error | null) => void;
|
|
69
|
+
onSubmitResult?: (response: any, error: Error | string | null) => void;
|
|
70
70
|
enableAutoSubmit?: boolean;
|
|
71
71
|
style?: "bootstrap" | undefined | null;
|
|
72
72
|
submit_config?: SubmitConfig;
|
package/dist/main.d.ts
CHANGED
|
@@ -66,7 +66,7 @@ interface RenderedForm {
|
|
|
66
66
|
}
|
|
67
67
|
type RenderOptions = {
|
|
68
68
|
onSubmit?: (result: any, error?: any) => void;
|
|
69
|
-
onSubmitResult?: (response: any, error: Error | null) => void;
|
|
69
|
+
onSubmitResult?: (response: any, error: Error | string | null) => void;
|
|
70
70
|
enableAutoSubmit?: boolean;
|
|
71
71
|
style?: "bootstrap" | undefined | null;
|
|
72
72
|
submit_config?: SubmitConfig;
|
package/dist/main.global.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var VocLibJs=(()=>{var R=Object.defineProperty;var $=Object.getOwnPropertyDescriptor;var O=Object.getOwnPropertyNames;var z=Object.prototype.hasOwnProperty;var W=(i,v)=>{for(var h in v)R(i,h,{get:v[h],enumerable:!0})},I=(i,v,h,b)=>{if(v&&typeof v=="object"||typeof v=="function")for(let f of O(v))!z.call(i,f)&&f!==h&&R(i,f,{get:()=>v[f],enumerable:!(b=$(v,f))||b.enumerable});return i};var j=i=>I(R({},"__esModule",{value:!0}),i);var V={};W(V,{FormsLib:()=>P,default:()=>G});function H(i,v,h){let b=v?.style==="bootstrap",f=document.createElement("div");f.className="voc-form-avatar-wrapper",b&&f.classList.add("d-flex","align-items-center","gap-3");let d=document.createElement("img");d.className="voc-form-avatar-preview",d.alt=i.label||"avatar",b&&(d.classList.add("img-thumbnail","rounded-circle"),d.style.width=d.style.height="64px",d.style.objectFit="cover");let E=h!=null?String(h):i.default!==void 0&&i.default!==null?String(i.default):"";E?d.src=E:(d.src="",d.style.display="none");let a=document.createElement("input");a.type="file",a.accept=i.accept||"image/*",a.className="voc-form-avatar-input",b&&a.classList.add("form-control"),(i.key||i.name)&&(a.name=i.name||i.key,i.key&&(a.id=`voc-form-${i.key}`));let s=document.createElement("input");if(s.type="hidden",(i.key||i.name)&&(s.name=(i.name||i.key)+"_url"),s.value=E||"",a.addEventListener("change",u=>{let c=u.target;if(c.files&&c.files.length>0){let F=c.files[0],C=new FileReader;C.onload=()=>{d.src=String(C.result),d.style.display="",s.value=""},C.readAsDataURL(F)}}),b){let u=document.createElement("div");u.style.flex="1",u.appendChild(a),u.appendChild(s),f.appendChild(d),f.appendChild(u)}else f.appendChild(d),f.appendChild(a),f.appendChild(s);return f}function B(i,v,h){let b=v?.style==="bootstrap",f=document.createElement("div");if(f.className="voc-form-audio-select",!i.options||i.options.length===0)return f;let d=i.name||i.key||`audio_select_${Math.random().toString(36).substr(2,6)}`,E;return Array.isArray(h)?E=h[0]:h!==void 0?E=h:i.default!==void 0&&(E=i.default),i.options.forEach((a,s)=>{let u=document.createElement("div");u.className="voc-form-audio-item",b&&u.classList.add("form-check");let c=document.createElement("input");c.type="radio",c.name=d,c.value=a.value,c.className="voc-form-audio-radio",i.key&&(c.id=`voc-form-${i.key}-${s}`),i.required&&s===0&&(c.required=!0),c.style.position="absolute",c.style.width="1px",c.style.height="1px",c.style.margin="0",c.style.padding="0",c.style.clip="rect(0 0 0 0)",c.style.clipPath="inset(50%)",c.style.overflow="hidden",c.style.border="0",E!==void 0&&(Array.isArray(E)?c.checked=E.includes(a.value):c.checked=String(E)===String(a.value));let F=()=>{c.checked?u.classList.add("selected"):u.classList.remove("selected")};c.addEventListener("change",()=>{f.querySelectorAll(".voc-form-audio-item").forEach(n=>n.classList.remove("selected")),F()}),c.checked&&u.classList.add("selected");let C=document.createElement("label");C.className="voc-form-audio-label",b&&C.classList.add("form-check-label"),C.htmlFor=c.id||"",C.textContent=a.label||a.value,C.tabIndex=0;let e=document.createElement("div");e.className="voc-form-audio-control";let o=null;if(a.audio_link){let t=document.createElement("button");t.type="button",t.className="voc-form-audio-play",b&&t.classList.add("btn","btn-sm","btn-outline-secondary"),t.setAttribute("aria-label",`Play ${a.label||a.value}`);let n="http://www.w3.org/2000/svg",l=document.createElementNS(n,"svg");l.setAttribute("viewBox","0 0 24 24"),l.setAttribute("width","16"),l.setAttribute("height","16"),l.setAttribute("aria-hidden","true");let p=document.createElementNS(n,"path");p.setAttribute("d","M8 5v14l11-7z"),p.setAttribute("fill","currentColor"),l.appendChild(p),t.appendChild(l),o=document.createElement("audio"),o.src=a.audio_link,o.preload="none",o.style.display="none";let m=L=>{for(;L.firstChild;)L.removeChild(L.firstChild)},A=()=>{let L="http://www.w3.org/2000/svg",x=document.createElementNS(L,"svg");x.setAttribute("viewBox","0 0 24 24"),x.setAttribute("width","16"),x.setAttribute("height","16"),x.setAttribute("aria-hidden","true");let k=document.createElementNS(L,"path");return k.setAttribute("d","M8 5v14l11-7z"),k.setAttribute("fill","currentColor"),x.appendChild(k),x},M=()=>{let L="http://www.w3.org/2000/svg",x=document.createElementNS(L,"svg");x.setAttribute("viewBox","0 0 24 24"),x.setAttribute("width","16"),x.setAttribute("height","16"),x.setAttribute("aria-hidden","true");let k=document.createElementNS(L,"rect");return k.setAttribute("x","6"),k.setAttribute("y","6"),k.setAttribute("width","12"),k.setAttribute("height","12"),k.setAttribute("fill","currentColor"),x.appendChild(k),x};m(t),t.appendChild(A());let T=L=>{m(t),L?(t.appendChild(M()),t.setAttribute("aria-label",`Stop ${a.label||a.value}`)):(t.appendChild(A()),t.setAttribute("aria-label",`Play ${a.label||a.value}`))};t.addEventListener("click",()=>{try{if(!o)return;let L=f.querySelectorAll("audio");if(!o.paused&&!o.ended){o.pause(),o.currentTime=0;return}L.forEach(k=>{try{k.pause(),k.currentTime=0}catch{}}),f.querySelectorAll(".voc-form-audio-item").forEach(k=>k.classList.remove("is-playing")),o.play()}catch(L){console.warn("audio play failed",L)}}),o.addEventListener("playing",()=>{u.classList.add("is-playing"),T(!0)});let S=()=>{u.classList.remove("is-playing"),T(!1)};o.addEventListener("pause",S),o.addEventListener("ended",S),e.appendChild(t),e.appendChild(o)}let g=document.createElement("div");g.className="voc-form-item-detail",g.style.display="flex",g.style.flexDirection="column",g.style.gap="4px";let r=document.createElement("div");r.className="voc-form-item-top",r.style.display="flex",r.style.alignItems="center",r.style.gap="8px",r.appendChild(c),r.appendChild(C);let w=document.createElement("div");w.className="voc-form-item-description";let y=a.description||a.hint_text||"";y&&(w.textContent=y),g.appendChild(r),g.appendChild(w),e.appendChild(g),u.appendChild(e),r.addEventListener("click",t=>{let n=t.target;n&&n.closest(".voc-form-audio-play")||(c.checked=!0,c.dispatchEvent(new Event("change",{bubbles:!0})))}),u.addEventListener("click",t=>{let n=t.target;n&&n.closest(".voc-form-audio-play")||(c.checked=!0,c.dispatchEvent(new Event("change",{bubbles:!0})))}),f.appendChild(u)}),f}function N(i,v=!0){let h=new FormData(i);if(v)return h;let b={};return h.forEach((f,d)=>{let E=(f instanceof File,f);Object.prototype.hasOwnProperty.call(b,d)?Array.isArray(b[d])?b[d].push(E):b[d]=[b[d],E]:b[d]=E}),b}async function q(i,v,h){let b=v.url,f={"Content-Type":"application/json"};v?.api_token&&(f.Authorization=`Bearer ${v.api_token}`);let d=N(i);if(v?.additional_data)for(let[s,u]of Object.entries(v.additional_data))d.append(s,u);let E,a=d instanceof FormData;E={method:"POST",headers:{Authorization:`Bearer ${v.api_token}`,...a?{}:{"Content-Type":"application/json"},Accept:"application/json"},body:a?d:JSON.stringify(Object.fromEntries(d.entries()))};try{fetch(b,E).then(async s=>{let u=s.headers.get("content-type");if(!s.ok)try{let c=await s.json();console.log(c);let F=c?.message;throw new Error(F??"Their was an error submitting the form. Check your form and try again.")}catch{throw new Error("Their was an error submitting the form. Check your form and try again.")}return u&&u.includes("application/json")?s.json():s.text()}).then(s=>{h&&h(s,null)}).catch(s=>{h&&h(null,s)})}catch(s){h&&h(null,s)}}function D(i,v,h){let b=[];if(typeof i=="string"?b=Array.from(document.querySelectorAll(i)):b=[i],b.length===0)return null;function f(){let a=h?.style==="bootstrap",s=document.createElement("form");s.classList.add("voc-form"),a&&s.classList.add("needs-validation"),s.id=v.id;let u=document.createElement("h2");u.className="voc-form-title",a&&u.classList.add("mb-3"),u.textContent=v.form_name,s.appendChild(u);function c(e,o){o&&(o.min_length!==void 0&&(e.minLength=o.min_length),o.max_length!==void 0&&(e.maxLength=o.max_length),o.regex&&(e instanceof HTMLInputElement?e.pattern=o.regex:e.dataset.pattern=o.regex))}function F(e){if(!e.key&&!e.label)return null;let o=v.default_values||{},g=e.name||e.key,r=g?o[g]:void 0,w=document.createElement("div");if(w.className="voc-form-group",a&&w.classList.add("mb-3"),e.label){let t=document.createElement("label");if(t.classList.add("voc-form-label"),a&&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){let n=document.createElement("span");n.className="voc-form-required",n.textContent="*",t.appendChild(n)}w.appendChild(t)}let y=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,l)=>{let p=document.createElement("label");p.classList.add("voc-form-checkbox-label"),a&&p.classList.add("form-check"),p.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(p.style.width=e.width);let m=document.createElement("input");m.type="checkbox",m.classList.add("voc-form-checkbox"),a&&m.classList.add("form-check-input"),m.name=e.name||e.key||"",m.value=n.value,e.key&&(m.id=`voc-form-${e.key}-${l}`),e.required&&(m.required=!0),Array.isArray(r)?r.includes(n.value)&&(m.checked=!0):r!==void 0?r===n.value&&(m.checked=!0):e.default===n.value&&(m.checked=!0),p.appendChild(m),p.appendChild(document.createTextNode(n.label)),t.appendChild(p)});else{let n=document.createElement("label");n.classList.add("voc-form-checkbox-label"),a&&n.classList.add("form-check"),e.width&&(n.style.width=e.width);let l=document.createElement("input");l.type="checkbox",l.classList.add("voc-form-checkbox"),(e.key||e.name)&&(l.name=e.name||e.key,e.key&&(l.id=`voc-form-${e.key}`)),a&&l.classList.add("form-check-input"),e.required&&(l.required=!0),r!==void 0?l.checked=!!r:e.default&&(l.checked=!!e.default),n.appendChild(l),n.appendChild(document.createTextNode(e.label||"")),t.appendChild(n)}y=t;break}case"textarea":{let t=document.createElement("textarea");t.classList.add("voc-form-textarea"),a&&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),r!=null?t.value=String(r):e.default!==void 0&&e.default!==null&&(t.value=String(e.default));let n=e.default||r||"";if(n){let l=(n.match(/\n/g)||[]).length,p=80,m=n.split(`
|
|
1
|
+
"use strict";var VocLibJs=(()=>{var R=Object.defineProperty;var $=Object.getOwnPropertyDescriptor;var O=Object.getOwnPropertyNames;var z=Object.prototype.hasOwnProperty;var W=(i,v)=>{for(var h in v)R(i,h,{get:v[h],enumerable:!0})},I=(i,v,h,b)=>{if(v&&typeof v=="object"||typeof v=="function")for(let f of O(v))!z.call(i,f)&&f!==h&&R(i,f,{get:()=>v[f],enumerable:!(b=$(v,f))||b.enumerable});return i};var j=i=>I(R({},"__esModule",{value:!0}),i);var V={};W(V,{FormsLib:()=>P,default:()=>G});function H(i,v,h){let b=v?.style==="bootstrap",f=document.createElement("div");f.className="voc-form-avatar-wrapper",b&&f.classList.add("d-flex","align-items-center","gap-3");let d=document.createElement("img");d.className="voc-form-avatar-preview",d.alt=i.label||"avatar",b&&(d.classList.add("img-thumbnail","rounded-circle"),d.style.width=d.style.height="64px",d.style.objectFit="cover");let E=h!=null?String(h):i.default!==void 0&&i.default!==null?String(i.default):"";E?d.src=E:(d.src="",d.style.display="none");let a=document.createElement("input");a.type="file",a.accept=i.accept||"image/*",a.className="voc-form-avatar-input",b&&a.classList.add("form-control"),(i.key||i.name)&&(a.name=i.name||i.key,i.key&&(a.id=`voc-form-${i.key}`));let s=document.createElement("input");if(s.type="hidden",(i.key||i.name)&&(s.name=(i.name||i.key)+"_url"),s.value=E||"",a.addEventListener("change",u=>{let c=u.target;if(c.files&&c.files.length>0){let F=c.files[0],C=new FileReader;C.onload=()=>{d.src=String(C.result),d.style.display="",s.value=""},C.readAsDataURL(F)}}),b){let u=document.createElement("div");u.style.flex="1",u.appendChild(a),u.appendChild(s),f.appendChild(d),f.appendChild(u)}else f.appendChild(d),f.appendChild(a),f.appendChild(s);return f}function B(i,v,h){let b=v?.style==="bootstrap",f=document.createElement("div");if(f.className="voc-form-audio-select",!i.options||i.options.length===0)return f;let d=i.name||i.key||`audio_select_${Math.random().toString(36).substr(2,6)}`,E;return Array.isArray(h)?E=h[0]:h!==void 0?E=h:i.default!==void 0&&(E=i.default),i.options.forEach((a,s)=>{let u=document.createElement("div");u.className="voc-form-audio-item",b&&u.classList.add("form-check");let c=document.createElement("input");c.type="radio",c.name=d,c.value=a.value,c.className="voc-form-audio-radio",i.key&&(c.id=`voc-form-${i.key}-${s}`),i.required&&s===0&&(c.required=!0),c.style.position="absolute",c.style.width="1px",c.style.height="1px",c.style.margin="0",c.style.padding="0",c.style.clip="rect(0 0 0 0)",c.style.clipPath="inset(50%)",c.style.overflow="hidden",c.style.border="0",E!==void 0&&(Array.isArray(E)?c.checked=E.includes(a.value):c.checked=String(E)===String(a.value));let F=()=>{c.checked?u.classList.add("selected"):u.classList.remove("selected")};c.addEventListener("change",()=>{f.querySelectorAll(".voc-form-audio-item").forEach(n=>n.classList.remove("selected")),F()}),c.checked&&u.classList.add("selected");let C=document.createElement("label");C.className="voc-form-audio-label",b&&C.classList.add("form-check-label"),C.htmlFor=c.id||"",C.textContent=a.label||a.value,C.tabIndex=0;let e=document.createElement("div");e.className="voc-form-audio-control";let o=null;if(a.audio_link){let t=document.createElement("button");t.type="button",t.className="voc-form-audio-play",b&&t.classList.add("btn","btn-sm","btn-outline-secondary"),t.setAttribute("aria-label",`Play ${a.label||a.value}`);let n="http://www.w3.org/2000/svg",l=document.createElementNS(n,"svg");l.setAttribute("viewBox","0 0 24 24"),l.setAttribute("width","16"),l.setAttribute("height","16"),l.setAttribute("aria-hidden","true");let p=document.createElementNS(n,"path");p.setAttribute("d","M8 5v14l11-7z"),p.setAttribute("fill","currentColor"),l.appendChild(p),t.appendChild(l),o=document.createElement("audio"),o.src=a.audio_link,o.preload="none",o.style.display="none";let m=L=>{for(;L.firstChild;)L.removeChild(L.firstChild)},A=()=>{let L="http://www.w3.org/2000/svg",x=document.createElementNS(L,"svg");x.setAttribute("viewBox","0 0 24 24"),x.setAttribute("width","16"),x.setAttribute("height","16"),x.setAttribute("aria-hidden","true");let k=document.createElementNS(L,"path");return k.setAttribute("d","M8 5v14l11-7z"),k.setAttribute("fill","currentColor"),x.appendChild(k),x},M=()=>{let L="http://www.w3.org/2000/svg",x=document.createElementNS(L,"svg");x.setAttribute("viewBox","0 0 24 24"),x.setAttribute("width","16"),x.setAttribute("height","16"),x.setAttribute("aria-hidden","true");let k=document.createElementNS(L,"rect");return k.setAttribute("x","6"),k.setAttribute("y","6"),k.setAttribute("width","12"),k.setAttribute("height","12"),k.setAttribute("fill","currentColor"),x.appendChild(k),x};m(t),t.appendChild(A());let T=L=>{m(t),L?(t.appendChild(M()),t.setAttribute("aria-label",`Stop ${a.label||a.value}`)):(t.appendChild(A()),t.setAttribute("aria-label",`Play ${a.label||a.value}`))};t.addEventListener("click",()=>{try{if(!o)return;let L=f.querySelectorAll("audio");if(!o.paused&&!o.ended){o.pause(),o.currentTime=0;return}L.forEach(k=>{try{k.pause(),k.currentTime=0}catch{}}),f.querySelectorAll(".voc-form-audio-item").forEach(k=>k.classList.remove("is-playing")),o.play()}catch(L){console.warn("audio play failed",L)}}),o.addEventListener("playing",()=>{u.classList.add("is-playing"),T(!0)});let S=()=>{u.classList.remove("is-playing"),T(!1)};o.addEventListener("pause",S),o.addEventListener("ended",S),e.appendChild(t),e.appendChild(o)}let g=document.createElement("div");g.className="voc-form-item-detail",g.style.display="flex",g.style.flexDirection="column",g.style.gap="4px";let r=document.createElement("div");r.className="voc-form-item-top",r.style.display="flex",r.style.alignItems="center",r.style.gap="8px",r.appendChild(c),r.appendChild(C);let w=document.createElement("div");w.className="voc-form-item-description";let y=a.description||a.hint_text||"";y&&(w.textContent=y),g.appendChild(r),g.appendChild(w),e.appendChild(g),u.appendChild(e),r.addEventListener("click",t=>{let n=t.target;n&&n.closest(".voc-form-audio-play")||(c.checked=!0,c.dispatchEvent(new Event("change",{bubbles:!0})))}),u.addEventListener("click",t=>{let n=t.target;n&&n.closest(".voc-form-audio-play")||(c.checked=!0,c.dispatchEvent(new Event("change",{bubbles:!0})))}),f.appendChild(u)}),f}function N(i,v=!0){let h=new FormData(i);if(v)return h;let b={};return h.forEach((f,d)=>{let E=(f instanceof File,f);Object.prototype.hasOwnProperty.call(b,d)?Array.isArray(b[d])?b[d].push(E):b[d]=[b[d],E]:b[d]=E}),b}async function q(i,v,h){let b=v.url,f={"Content-Type":"application/json"};v?.api_token&&(f.Authorization=`Bearer ${v.api_token}`);let d=N(i);if(v?.additional_data)for(let[s,u]of Object.entries(v.additional_data))d.append(s,u);let E,a=d instanceof FormData;E={method:"POST",headers:{Authorization:`Bearer ${v.api_token}`,...a?{}:{"Content-Type":"application/json"},Accept:"application/json"},body:a?d:JSON.stringify(Object.fromEntries(d.entries()))};try{fetch(b,E).then(async s=>{let u=s.headers.get("content-type");if(!s.ok)try{let F=(await s.json())?.message;throw new Error(F??"Their was an error submitting the form. Check your form and try again.")}catch(c){throw new Error(c)}return u&&u.includes("application/json")?s.json():s.text()}).then(s=>{h&&h(s,null)}).catch(s=>{h&&h(null,s.replace(/^Error:\s*/,""))})}catch(s){h&&h(null,s)}}function D(i,v,h){let b=[];if(typeof i=="string"?b=Array.from(document.querySelectorAll(i)):b=[i],b.length===0)return null;function f(){let a=h?.style==="bootstrap",s=document.createElement("form");s.classList.add("voc-form"),a&&s.classList.add("needs-validation"),s.id=v.id;let u=document.createElement("h2");u.className="voc-form-title",a&&u.classList.add("mb-3"),u.textContent=v.form_name,s.appendChild(u);function c(e,o){o&&(o.min_length!==void 0&&(e.minLength=o.min_length),o.max_length!==void 0&&(e.maxLength=o.max_length),o.regex&&(e instanceof HTMLInputElement?e.pattern=o.regex:e.dataset.pattern=o.regex))}function F(e){if(!e.key&&!e.label)return null;let o=v.default_values||{},g=e.name||e.key,r=g?o[g]:void 0,w=document.createElement("div");if(w.className="voc-form-group",a&&w.classList.add("mb-3"),e.label){let t=document.createElement("label");if(t.classList.add("voc-form-label"),a&&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){let n=document.createElement("span");n.className="voc-form-required",n.textContent="*",t.appendChild(n)}w.appendChild(t)}let y=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,l)=>{let p=document.createElement("label");p.classList.add("voc-form-checkbox-label"),a&&p.classList.add("form-check"),p.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(p.style.width=e.width);let m=document.createElement("input");m.type="checkbox",m.classList.add("voc-form-checkbox"),a&&m.classList.add("form-check-input"),m.name=e.name||e.key||"",m.value=n.value,e.key&&(m.id=`voc-form-${e.key}-${l}`),e.required&&(m.required=!0),Array.isArray(r)?r.includes(n.value)&&(m.checked=!0):r!==void 0?r===n.value&&(m.checked=!0):e.default===n.value&&(m.checked=!0),p.appendChild(m),p.appendChild(document.createTextNode(n.label)),t.appendChild(p)});else{let n=document.createElement("label");n.classList.add("voc-form-checkbox-label"),a&&n.classList.add("form-check"),e.width&&(n.style.width=e.width);let l=document.createElement("input");l.type="checkbox",l.classList.add("voc-form-checkbox"),(e.key||e.name)&&(l.name=e.name||e.key,e.key&&(l.id=`voc-form-${e.key}`)),a&&l.classList.add("form-check-input"),e.required&&(l.required=!0),r!==void 0?l.checked=!!r:e.default&&(l.checked=!!e.default),n.appendChild(l),n.appendChild(document.createTextNode(e.label||"")),t.appendChild(n)}y=t;break}case"textarea":{let t=document.createElement("textarea");t.classList.add("voc-form-textarea"),a&&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),r!=null?t.value=String(r):e.default!==void 0&&e.default!==null&&(t.value=String(e.default));let n=e.default||r||"";if(n){let l=(n.match(/\n/g)||[]).length,p=80,m=n.split(`
|
|
2
2
|
`).reduce((T,S)=>Math.max(T,S.length),0),A=Math.ceil(m/p)||1,M=Math.max(2,l+A);t.rows=M,t.style.resize="vertical"}e.width&&(t.style.width=e.width),e.required&&(t.required=!0),c(t,e.validation),y=t;break}case"select":{let t=document.createElement("select");if(t.classList.add("voc-form-select"),a&&t.classList.add("form-select"),a&&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){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 l=document.createElement("option");l.value=n.value,l.textContent=n.label,Array.isArray(r)?r.includes(n.value)&&(l.selected=!0):r!==void 0?r===n.value&&(l.selected=!0):e.default===n.value&&(l.selected=!0),t.appendChild(l)}),e.width&&(t.style.width=e.width),y=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,l)=>{let p=document.createElement("label");p.classList.add("voc-form-radio-label"),a&&p.classList.add("form-check"),p.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(p.style.width=e.width);let m=document.createElement("input");m.type="radio",m.classList.add("voc-form-radio"),a&&m.classList.add("form-check-input"),m.name=e.name||e.key||"",m.value=n.value,e.key&&(m.id=`voc-form-${e.key}-${l}`),Array.isArray(r)?r.includes(n.value)&&(m.checked=!0):r!==void 0?r===n.value&&(m.checked=!0):e.default===n.value&&(m.checked=!0),p.appendChild(m),p.appendChild(document.createTextNode(n.label)),t.appendChild(p)}),y=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"),a&&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),y=t;break}case"avatar":{y=H(e,h||{},r);break}case"audio_select":{y=B(e,h||{},r);break}default:{let t=document.createElement("input");t.type=e.type||"text",t.classList.add("voc-form-input"),a&&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),r!=null?t.value=String(r):e.default!==void 0&&e.default!==null&&(t.value=String(e.default)),e.width&&(t.style.width=e.width),e.required&&(t.required=!0),c(t,e.validation),y=t;break}}if(y&&w.appendChild(y),e.hint_text){let t=document.createElement("small");t.className="voc-form-hint",t.textContent=e.hint_text,w.appendChild(t)}return w}v.fields.forEach(e=>{if(e.type==="group"&&"items"in e){let o=e;if(a){let g=document.createElement("div");g.className="card voc-form-group-card mb-3";let r=o.label||o.header?.title,w=o.description||o.header?.description;if(r||w){let t=document.createElement("div");if(t.className="card-header voc-form-group-head",r){let n=document.createElement("h5");n.className="mb-0 voc-form-group-label",n.textContent=r,t.appendChild(n)}if(w){let n=document.createElement("p");n.className="mb-0 voc-form-group-description",n.textContent=w,t.appendChild(n)}g.appendChild(t)}let y=document.createElement("div");y.className="card-body voc-form-group-body",o.items.forEach(t=>{if(t.type==="row"&&"items"in t){let n=t,l=document.createElement("div");if(l.className="voc-form-group voc-form-row mb-3",n.label){let m=document.createElement("h6");m.className="voc-form-row-label",m.textContent=n.label,l.appendChild(m)}let p=document.createElement("div");p.className="voc-form-row-items "+(n.direction||"horizontal"),n.items.forEach(m=>{let A=F(m);A&&p.appendChild(A)}),l.appendChild(p),y.appendChild(l)}else{let n=F(t);n&&y.appendChild(n)}}),g.appendChild(y),s.appendChild(g)}else{let g=document.createElement("div");g.className="voc-form-group voc-form-group-wrapper",a&&g.classList.add("mb-3");let r=o.label||o.header?.title,w=o.description||o.header?.description;if(r||w){let y=document.createElement("div");if(y.className="voc-form-group-head",r){let t=document.createElement("h3");t.className="voc-form-group-label",t.textContent=r,y.appendChild(t)}if(w){let t=document.createElement("p");t.className="voc-form-group-description",t.textContent=w,y.appendChild(t)}g.appendChild(y)}o.items.forEach(y=>{if(y.type==="row"&&"items"in y){let t=y,n=document.createElement("div");if(n.className="voc-form-group voc-form-row",a&&n.classList.add("mb-3"),t.label){let p=document.createElement("h4");p.className="voc-form-row-label",p.textContent=t.label,n.appendChild(p)}let l=document.createElement("div");l.className="voc-form-row-items "+(t.direction||"horizontal"),t.items.forEach(p=>{let m=F(p);m&&l.appendChild(m)}),n.appendChild(l),g.appendChild(n)}else{let t=F(y);t&&g.appendChild(t)}}),s.appendChild(g)}return}if(e.type==="row"&&"items"in e){let o=document.createElement("div");if(o.className="voc-form-group voc-form-row",a&&o.classList.add("mb-3"),e.label){let r=document.createElement("h3");r.className="voc-form-row-label",r.textContent=e.label,o.appendChild(r)}if(e.description){let r=document.createElement("p");r.className="voc-form-row-description",r.textContent=e.description,o.appendChild(r)}let g=document.createElement("div");g.className="voc-form-row-items "+(e.direction||"horizontal"),o.appendChild(g),e.items.forEach(r=>{let w=F(r);w&&g.appendChild(w)}),s.appendChild(o)}else{let o=F(e);o&&s.appendChild(o)}});let C=document.createElement("button");return C.type="submit",C.className="voc-form-submit",C.textContent="Submit",a&&C.classList.add("btn","btn-primary"),s.appendChild(C),s}let d=f();b[0].appendChild(d);let E=v?.submit_config??h?.submit_config??null;return E&&d.addEventListener("submit",a=>{a.preventDefault(),q(d,E,(s,u)=>{h?.onSubmitResult&&h.onSubmitResult(s,u)})}),{element:d,validate:()=>{let a=[];return d.querySelectorAll(":invalid").forEach(u=>{let c=u.validationMessage;a.push({element:u,message:c})}),a},getValues:()=>N(d),onSubmit:a=>{d.addEventListener("submit",s=>{s.preventDefault();let u=N(d);a(u,s)})}}}var _={renderForm:D};var P=_,G={FormsLib:_};return j(V);})();
|
package/dist/main.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var R=Object.defineProperty;var $=Object.getOwnPropertyDescriptor;var O=Object.getOwnPropertyNames;var z=Object.prototype.hasOwnProperty;var W=(i,v)=>{for(var h in v)R(i,h,{get:v[h],enumerable:!0})},I=(i,v,h,b)=>{if(v&&typeof v=="object"||typeof v=="function")for(let f of O(v))!z.call(i,f)&&f!==h&&R(i,f,{get:()=>v[f],enumerable:!(b=$(v,f))||b.enumerable});return i};var j=i=>I(R({},"__esModule",{value:!0}),i);var V={};W(V,{FormsLib:()=>P,default:()=>G});module.exports=j(V);function H(i,v,h){let b=v?.style==="bootstrap",f=document.createElement("div");f.className="voc-form-avatar-wrapper",b&&f.classList.add("d-flex","align-items-center","gap-3");let d=document.createElement("img");d.className="voc-form-avatar-preview",d.alt=i.label||"avatar",b&&(d.classList.add("img-thumbnail","rounded-circle"),d.style.width=d.style.height="64px",d.style.objectFit="cover");let E=h!=null?String(h):i.default!==void 0&&i.default!==null?String(i.default):"";E?d.src=E:(d.src="",d.style.display="none");let a=document.createElement("input");a.type="file",a.accept=i.accept||"image/*",a.className="voc-form-avatar-input",b&&a.classList.add("form-control"),(i.key||i.name)&&(a.name=i.name||i.key,i.key&&(a.id=`voc-form-${i.key}`));let s=document.createElement("input");if(s.type="hidden",(i.key||i.name)&&(s.name=(i.name||i.key)+"_url"),s.value=E||"",a.addEventListener("change",u=>{let c=u.target;if(c.files&&c.files.length>0){let F=c.files[0],C=new FileReader;C.onload=()=>{d.src=String(C.result),d.style.display="",s.value=""},C.readAsDataURL(F)}}),b){let u=document.createElement("div");u.style.flex="1",u.appendChild(a),u.appendChild(s),f.appendChild(d),f.appendChild(u)}else f.appendChild(d),f.appendChild(a),f.appendChild(s);return f}function B(i,v,h){let b=v?.style==="bootstrap",f=document.createElement("div");if(f.className="voc-form-audio-select",!i.options||i.options.length===0)return f;let d=i.name||i.key||`audio_select_${Math.random().toString(36).substr(2,6)}`,E;return Array.isArray(h)?E=h[0]:h!==void 0?E=h:i.default!==void 0&&(E=i.default),i.options.forEach((a,s)=>{let u=document.createElement("div");u.className="voc-form-audio-item",b&&u.classList.add("form-check");let c=document.createElement("input");c.type="radio",c.name=d,c.value=a.value,c.className="voc-form-audio-radio",i.key&&(c.id=`voc-form-${i.key}-${s}`),i.required&&s===0&&(c.required=!0),c.style.position="absolute",c.style.width="1px",c.style.height="1px",c.style.margin="0",c.style.padding="0",c.style.clip="rect(0 0 0 0)",c.style.clipPath="inset(50%)",c.style.overflow="hidden",c.style.border="0",E!==void 0&&(Array.isArray(E)?c.checked=E.includes(a.value):c.checked=String(E)===String(a.value));let F=()=>{c.checked?u.classList.add("selected"):u.classList.remove("selected")};c.addEventListener("change",()=>{f.querySelectorAll(".voc-form-audio-item").forEach(n=>n.classList.remove("selected")),F()}),c.checked&&u.classList.add("selected");let C=document.createElement("label");C.className="voc-form-audio-label",b&&C.classList.add("form-check-label"),C.htmlFor=c.id||"",C.textContent=a.label||a.value,C.tabIndex=0;let e=document.createElement("div");e.className="voc-form-audio-control";let o=null;if(a.audio_link){let t=document.createElement("button");t.type="button",t.className="voc-form-audio-play",b&&t.classList.add("btn","btn-sm","btn-outline-secondary"),t.setAttribute("aria-label",`Play ${a.label||a.value}`);let n="http://www.w3.org/2000/svg",l=document.createElementNS(n,"svg");l.setAttribute("viewBox","0 0 24 24"),l.setAttribute("width","16"),l.setAttribute("height","16"),l.setAttribute("aria-hidden","true");let p=document.createElementNS(n,"path");p.setAttribute("d","M8 5v14l11-7z"),p.setAttribute("fill","currentColor"),l.appendChild(p),t.appendChild(l),o=document.createElement("audio"),o.src=a.audio_link,o.preload="none",o.style.display="none";let m=L=>{for(;L.firstChild;)L.removeChild(L.firstChild)},A=()=>{let L="http://www.w3.org/2000/svg",x=document.createElementNS(L,"svg");x.setAttribute("viewBox","0 0 24 24"),x.setAttribute("width","16"),x.setAttribute("height","16"),x.setAttribute("aria-hidden","true");let k=document.createElementNS(L,"path");return k.setAttribute("d","M8 5v14l11-7z"),k.setAttribute("fill","currentColor"),x.appendChild(k),x},M=()=>{let L="http://www.w3.org/2000/svg",x=document.createElementNS(L,"svg");x.setAttribute("viewBox","0 0 24 24"),x.setAttribute("width","16"),x.setAttribute("height","16"),x.setAttribute("aria-hidden","true");let k=document.createElementNS(L,"rect");return k.setAttribute("x","6"),k.setAttribute("y","6"),k.setAttribute("width","12"),k.setAttribute("height","12"),k.setAttribute("fill","currentColor"),x.appendChild(k),x};m(t),t.appendChild(A());let T=L=>{m(t),L?(t.appendChild(M()),t.setAttribute("aria-label",`Stop ${a.label||a.value}`)):(t.appendChild(A()),t.setAttribute("aria-label",`Play ${a.label||a.value}`))};t.addEventListener("click",()=>{try{if(!o)return;let L=f.querySelectorAll("audio");if(!o.paused&&!o.ended){o.pause(),o.currentTime=0;return}L.forEach(k=>{try{k.pause(),k.currentTime=0}catch{}}),f.querySelectorAll(".voc-form-audio-item").forEach(k=>k.classList.remove("is-playing")),o.play()}catch(L){console.warn("audio play failed",L)}}),o.addEventListener("playing",()=>{u.classList.add("is-playing"),T(!0)});let S=()=>{u.classList.remove("is-playing"),T(!1)};o.addEventListener("pause",S),o.addEventListener("ended",S),e.appendChild(t),e.appendChild(o)}let g=document.createElement("div");g.className="voc-form-item-detail",g.style.display="flex",g.style.flexDirection="column",g.style.gap="4px";let r=document.createElement("div");r.className="voc-form-item-top",r.style.display="flex",r.style.alignItems="center",r.style.gap="8px",r.appendChild(c),r.appendChild(C);let w=document.createElement("div");w.className="voc-form-item-description";let y=a.description||a.hint_text||"";y&&(w.textContent=y),g.appendChild(r),g.appendChild(w),e.appendChild(g),u.appendChild(e),r.addEventListener("click",t=>{let n=t.target;n&&n.closest(".voc-form-audio-play")||(c.checked=!0,c.dispatchEvent(new Event("change",{bubbles:!0})))}),u.addEventListener("click",t=>{let n=t.target;n&&n.closest(".voc-form-audio-play")||(c.checked=!0,c.dispatchEvent(new Event("change",{bubbles:!0})))}),f.appendChild(u)}),f}function N(i,v=!0){let h=new FormData(i);if(v)return h;let b={};return h.forEach((f,d)=>{let E=(f instanceof File,f);Object.prototype.hasOwnProperty.call(b,d)?Array.isArray(b[d])?b[d].push(E):b[d]=[b[d],E]:b[d]=E}),b}async function q(i,v,h){let b=v.url,f={"Content-Type":"application/json"};v?.api_token&&(f.Authorization=`Bearer ${v.api_token}`);let d=N(i);if(v?.additional_data)for(let[s,u]of Object.entries(v.additional_data))d.append(s,u);let E,a=d instanceof FormData;E={method:"POST",headers:{Authorization:`Bearer ${v.api_token}`,...a?{}:{"Content-Type":"application/json"},Accept:"application/json"},body:a?d:JSON.stringify(Object.fromEntries(d.entries()))};try{fetch(b,E).then(async s=>{let u=s.headers.get("content-type");if(!s.ok)try{let c=await s.json();console.log(c);let F=c?.message;throw new Error(F??"Their was an error submitting the form. Check your form and try again.")}catch{throw new Error("Their was an error submitting the form. Check your form and try again.")}return u&&u.includes("application/json")?s.json():s.text()}).then(s=>{h&&h(s,null)}).catch(s=>{h&&h(null,s)})}catch(s){h&&h(null,s)}}function D(i,v,h){let b=[];if(typeof i=="string"?b=Array.from(document.querySelectorAll(i)):b=[i],b.length===0)return null;function f(){let a=h?.style==="bootstrap",s=document.createElement("form");s.classList.add("voc-form"),a&&s.classList.add("needs-validation"),s.id=v.id;let u=document.createElement("h2");u.className="voc-form-title",a&&u.classList.add("mb-3"),u.textContent=v.form_name,s.appendChild(u);function c(e,o){o&&(o.min_length!==void 0&&(e.minLength=o.min_length),o.max_length!==void 0&&(e.maxLength=o.max_length),o.regex&&(e instanceof HTMLInputElement?e.pattern=o.regex:e.dataset.pattern=o.regex))}function F(e){if(!e.key&&!e.label)return null;let o=v.default_values||{},g=e.name||e.key,r=g?o[g]:void 0,w=document.createElement("div");if(w.className="voc-form-group",a&&w.classList.add("mb-3"),e.label){let t=document.createElement("label");if(t.classList.add("voc-form-label"),a&&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){let n=document.createElement("span");n.className="voc-form-required",n.textContent="*",t.appendChild(n)}w.appendChild(t)}let y=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,l)=>{let p=document.createElement("label");p.classList.add("voc-form-checkbox-label"),a&&p.classList.add("form-check"),p.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(p.style.width=e.width);let m=document.createElement("input");m.type="checkbox",m.classList.add("voc-form-checkbox"),a&&m.classList.add("form-check-input"),m.name=e.name||e.key||"",m.value=n.value,e.key&&(m.id=`voc-form-${e.key}-${l}`),e.required&&(m.required=!0),Array.isArray(r)?r.includes(n.value)&&(m.checked=!0):r!==void 0?r===n.value&&(m.checked=!0):e.default===n.value&&(m.checked=!0),p.appendChild(m),p.appendChild(document.createTextNode(n.label)),t.appendChild(p)});else{let n=document.createElement("label");n.classList.add("voc-form-checkbox-label"),a&&n.classList.add("form-check"),e.width&&(n.style.width=e.width);let l=document.createElement("input");l.type="checkbox",l.classList.add("voc-form-checkbox"),(e.key||e.name)&&(l.name=e.name||e.key,e.key&&(l.id=`voc-form-${e.key}`)),a&&l.classList.add("form-check-input"),e.required&&(l.required=!0),r!==void 0?l.checked=!!r:e.default&&(l.checked=!!e.default),n.appendChild(l),n.appendChild(document.createTextNode(e.label||"")),t.appendChild(n)}y=t;break}case"textarea":{let t=document.createElement("textarea");t.classList.add("voc-form-textarea"),a&&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),r!=null?t.value=String(r):e.default!==void 0&&e.default!==null&&(t.value=String(e.default));let n=e.default||r||"";if(n){let l=(n.match(/\n/g)||[]).length,p=80,m=n.split(`
|
|
1
|
+
"use strict";var R=Object.defineProperty;var $=Object.getOwnPropertyDescriptor;var O=Object.getOwnPropertyNames;var z=Object.prototype.hasOwnProperty;var W=(i,v)=>{for(var h in v)R(i,h,{get:v[h],enumerable:!0})},I=(i,v,h,b)=>{if(v&&typeof v=="object"||typeof v=="function")for(let f of O(v))!z.call(i,f)&&f!==h&&R(i,f,{get:()=>v[f],enumerable:!(b=$(v,f))||b.enumerable});return i};var j=i=>I(R({},"__esModule",{value:!0}),i);var V={};W(V,{FormsLib:()=>P,default:()=>G});module.exports=j(V);function H(i,v,h){let b=v?.style==="bootstrap",f=document.createElement("div");f.className="voc-form-avatar-wrapper",b&&f.classList.add("d-flex","align-items-center","gap-3");let d=document.createElement("img");d.className="voc-form-avatar-preview",d.alt=i.label||"avatar",b&&(d.classList.add("img-thumbnail","rounded-circle"),d.style.width=d.style.height="64px",d.style.objectFit="cover");let E=h!=null?String(h):i.default!==void 0&&i.default!==null?String(i.default):"";E?d.src=E:(d.src="",d.style.display="none");let a=document.createElement("input");a.type="file",a.accept=i.accept||"image/*",a.className="voc-form-avatar-input",b&&a.classList.add("form-control"),(i.key||i.name)&&(a.name=i.name||i.key,i.key&&(a.id=`voc-form-${i.key}`));let s=document.createElement("input");if(s.type="hidden",(i.key||i.name)&&(s.name=(i.name||i.key)+"_url"),s.value=E||"",a.addEventListener("change",u=>{let c=u.target;if(c.files&&c.files.length>0){let F=c.files[0],C=new FileReader;C.onload=()=>{d.src=String(C.result),d.style.display="",s.value=""},C.readAsDataURL(F)}}),b){let u=document.createElement("div");u.style.flex="1",u.appendChild(a),u.appendChild(s),f.appendChild(d),f.appendChild(u)}else f.appendChild(d),f.appendChild(a),f.appendChild(s);return f}function B(i,v,h){let b=v?.style==="bootstrap",f=document.createElement("div");if(f.className="voc-form-audio-select",!i.options||i.options.length===0)return f;let d=i.name||i.key||`audio_select_${Math.random().toString(36).substr(2,6)}`,E;return Array.isArray(h)?E=h[0]:h!==void 0?E=h:i.default!==void 0&&(E=i.default),i.options.forEach((a,s)=>{let u=document.createElement("div");u.className="voc-form-audio-item",b&&u.classList.add("form-check");let c=document.createElement("input");c.type="radio",c.name=d,c.value=a.value,c.className="voc-form-audio-radio",i.key&&(c.id=`voc-form-${i.key}-${s}`),i.required&&s===0&&(c.required=!0),c.style.position="absolute",c.style.width="1px",c.style.height="1px",c.style.margin="0",c.style.padding="0",c.style.clip="rect(0 0 0 0)",c.style.clipPath="inset(50%)",c.style.overflow="hidden",c.style.border="0",E!==void 0&&(Array.isArray(E)?c.checked=E.includes(a.value):c.checked=String(E)===String(a.value));let F=()=>{c.checked?u.classList.add("selected"):u.classList.remove("selected")};c.addEventListener("change",()=>{f.querySelectorAll(".voc-form-audio-item").forEach(n=>n.classList.remove("selected")),F()}),c.checked&&u.classList.add("selected");let C=document.createElement("label");C.className="voc-form-audio-label",b&&C.classList.add("form-check-label"),C.htmlFor=c.id||"",C.textContent=a.label||a.value,C.tabIndex=0;let e=document.createElement("div");e.className="voc-form-audio-control";let o=null;if(a.audio_link){let t=document.createElement("button");t.type="button",t.className="voc-form-audio-play",b&&t.classList.add("btn","btn-sm","btn-outline-secondary"),t.setAttribute("aria-label",`Play ${a.label||a.value}`);let n="http://www.w3.org/2000/svg",l=document.createElementNS(n,"svg");l.setAttribute("viewBox","0 0 24 24"),l.setAttribute("width","16"),l.setAttribute("height","16"),l.setAttribute("aria-hidden","true");let p=document.createElementNS(n,"path");p.setAttribute("d","M8 5v14l11-7z"),p.setAttribute("fill","currentColor"),l.appendChild(p),t.appendChild(l),o=document.createElement("audio"),o.src=a.audio_link,o.preload="none",o.style.display="none";let m=L=>{for(;L.firstChild;)L.removeChild(L.firstChild)},A=()=>{let L="http://www.w3.org/2000/svg",x=document.createElementNS(L,"svg");x.setAttribute("viewBox","0 0 24 24"),x.setAttribute("width","16"),x.setAttribute("height","16"),x.setAttribute("aria-hidden","true");let k=document.createElementNS(L,"path");return k.setAttribute("d","M8 5v14l11-7z"),k.setAttribute("fill","currentColor"),x.appendChild(k),x},M=()=>{let L="http://www.w3.org/2000/svg",x=document.createElementNS(L,"svg");x.setAttribute("viewBox","0 0 24 24"),x.setAttribute("width","16"),x.setAttribute("height","16"),x.setAttribute("aria-hidden","true");let k=document.createElementNS(L,"rect");return k.setAttribute("x","6"),k.setAttribute("y","6"),k.setAttribute("width","12"),k.setAttribute("height","12"),k.setAttribute("fill","currentColor"),x.appendChild(k),x};m(t),t.appendChild(A());let T=L=>{m(t),L?(t.appendChild(M()),t.setAttribute("aria-label",`Stop ${a.label||a.value}`)):(t.appendChild(A()),t.setAttribute("aria-label",`Play ${a.label||a.value}`))};t.addEventListener("click",()=>{try{if(!o)return;let L=f.querySelectorAll("audio");if(!o.paused&&!o.ended){o.pause(),o.currentTime=0;return}L.forEach(k=>{try{k.pause(),k.currentTime=0}catch{}}),f.querySelectorAll(".voc-form-audio-item").forEach(k=>k.classList.remove("is-playing")),o.play()}catch(L){console.warn("audio play failed",L)}}),o.addEventListener("playing",()=>{u.classList.add("is-playing"),T(!0)});let S=()=>{u.classList.remove("is-playing"),T(!1)};o.addEventListener("pause",S),o.addEventListener("ended",S),e.appendChild(t),e.appendChild(o)}let g=document.createElement("div");g.className="voc-form-item-detail",g.style.display="flex",g.style.flexDirection="column",g.style.gap="4px";let r=document.createElement("div");r.className="voc-form-item-top",r.style.display="flex",r.style.alignItems="center",r.style.gap="8px",r.appendChild(c),r.appendChild(C);let w=document.createElement("div");w.className="voc-form-item-description";let y=a.description||a.hint_text||"";y&&(w.textContent=y),g.appendChild(r),g.appendChild(w),e.appendChild(g),u.appendChild(e),r.addEventListener("click",t=>{let n=t.target;n&&n.closest(".voc-form-audio-play")||(c.checked=!0,c.dispatchEvent(new Event("change",{bubbles:!0})))}),u.addEventListener("click",t=>{let n=t.target;n&&n.closest(".voc-form-audio-play")||(c.checked=!0,c.dispatchEvent(new Event("change",{bubbles:!0})))}),f.appendChild(u)}),f}function N(i,v=!0){let h=new FormData(i);if(v)return h;let b={};return h.forEach((f,d)=>{let E=(f instanceof File,f);Object.prototype.hasOwnProperty.call(b,d)?Array.isArray(b[d])?b[d].push(E):b[d]=[b[d],E]:b[d]=E}),b}async function q(i,v,h){let b=v.url,f={"Content-Type":"application/json"};v?.api_token&&(f.Authorization=`Bearer ${v.api_token}`);let d=N(i);if(v?.additional_data)for(let[s,u]of Object.entries(v.additional_data))d.append(s,u);let E,a=d instanceof FormData;E={method:"POST",headers:{Authorization:`Bearer ${v.api_token}`,...a?{}:{"Content-Type":"application/json"},Accept:"application/json"},body:a?d:JSON.stringify(Object.fromEntries(d.entries()))};try{fetch(b,E).then(async s=>{let u=s.headers.get("content-type");if(!s.ok)try{let F=(await s.json())?.message;throw new Error(F??"Their was an error submitting the form. Check your form and try again.")}catch(c){throw new Error(c)}return u&&u.includes("application/json")?s.json():s.text()}).then(s=>{h&&h(s,null)}).catch(s=>{h&&h(null,s.replace(/^Error:\s*/,""))})}catch(s){h&&h(null,s)}}function D(i,v,h){let b=[];if(typeof i=="string"?b=Array.from(document.querySelectorAll(i)):b=[i],b.length===0)return null;function f(){let a=h?.style==="bootstrap",s=document.createElement("form");s.classList.add("voc-form"),a&&s.classList.add("needs-validation"),s.id=v.id;let u=document.createElement("h2");u.className="voc-form-title",a&&u.classList.add("mb-3"),u.textContent=v.form_name,s.appendChild(u);function c(e,o){o&&(o.min_length!==void 0&&(e.minLength=o.min_length),o.max_length!==void 0&&(e.maxLength=o.max_length),o.regex&&(e instanceof HTMLInputElement?e.pattern=o.regex:e.dataset.pattern=o.regex))}function F(e){if(!e.key&&!e.label)return null;let o=v.default_values||{},g=e.name||e.key,r=g?o[g]:void 0,w=document.createElement("div");if(w.className="voc-form-group",a&&w.classList.add("mb-3"),e.label){let t=document.createElement("label");if(t.classList.add("voc-form-label"),a&&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){let n=document.createElement("span");n.className="voc-form-required",n.textContent="*",t.appendChild(n)}w.appendChild(t)}let y=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,l)=>{let p=document.createElement("label");p.classList.add("voc-form-checkbox-label"),a&&p.classList.add("form-check"),p.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(p.style.width=e.width);let m=document.createElement("input");m.type="checkbox",m.classList.add("voc-form-checkbox"),a&&m.classList.add("form-check-input"),m.name=e.name||e.key||"",m.value=n.value,e.key&&(m.id=`voc-form-${e.key}-${l}`),e.required&&(m.required=!0),Array.isArray(r)?r.includes(n.value)&&(m.checked=!0):r!==void 0?r===n.value&&(m.checked=!0):e.default===n.value&&(m.checked=!0),p.appendChild(m),p.appendChild(document.createTextNode(n.label)),t.appendChild(p)});else{let n=document.createElement("label");n.classList.add("voc-form-checkbox-label"),a&&n.classList.add("form-check"),e.width&&(n.style.width=e.width);let l=document.createElement("input");l.type="checkbox",l.classList.add("voc-form-checkbox"),(e.key||e.name)&&(l.name=e.name||e.key,e.key&&(l.id=`voc-form-${e.key}`)),a&&l.classList.add("form-check-input"),e.required&&(l.required=!0),r!==void 0?l.checked=!!r:e.default&&(l.checked=!!e.default),n.appendChild(l),n.appendChild(document.createTextNode(e.label||"")),t.appendChild(n)}y=t;break}case"textarea":{let t=document.createElement("textarea");t.classList.add("voc-form-textarea"),a&&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),r!=null?t.value=String(r):e.default!==void 0&&e.default!==null&&(t.value=String(e.default));let n=e.default||r||"";if(n){let l=(n.match(/\n/g)||[]).length,p=80,m=n.split(`
|
|
2
2
|
`).reduce((T,S)=>Math.max(T,S.length),0),A=Math.ceil(m/p)||1,M=Math.max(2,l+A);t.rows=M,t.style.resize="vertical"}e.width&&(t.style.width=e.width),e.required&&(t.required=!0),c(t,e.validation),y=t;break}case"select":{let t=document.createElement("select");if(t.classList.add("voc-form-select"),a&&t.classList.add("form-select"),a&&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){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 l=document.createElement("option");l.value=n.value,l.textContent=n.label,Array.isArray(r)?r.includes(n.value)&&(l.selected=!0):r!==void 0?r===n.value&&(l.selected=!0):e.default===n.value&&(l.selected=!0),t.appendChild(l)}),e.width&&(t.style.width=e.width),y=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,l)=>{let p=document.createElement("label");p.classList.add("voc-form-radio-label"),a&&p.classList.add("form-check"),p.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(p.style.width=e.width);let m=document.createElement("input");m.type="radio",m.classList.add("voc-form-radio"),a&&m.classList.add("form-check-input"),m.name=e.name||e.key||"",m.value=n.value,e.key&&(m.id=`voc-form-${e.key}-${l}`),Array.isArray(r)?r.includes(n.value)&&(m.checked=!0):r!==void 0?r===n.value&&(m.checked=!0):e.default===n.value&&(m.checked=!0),p.appendChild(m),p.appendChild(document.createTextNode(n.label)),t.appendChild(p)}),y=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"),a&&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),y=t;break}case"avatar":{y=H(e,h||{},r);break}case"audio_select":{y=B(e,h||{},r);break}default:{let t=document.createElement("input");t.type=e.type||"text",t.classList.add("voc-form-input"),a&&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),r!=null?t.value=String(r):e.default!==void 0&&e.default!==null&&(t.value=String(e.default)),e.width&&(t.style.width=e.width),e.required&&(t.required=!0),c(t,e.validation),y=t;break}}if(y&&w.appendChild(y),e.hint_text){let t=document.createElement("small");t.className="voc-form-hint",t.textContent=e.hint_text,w.appendChild(t)}return w}v.fields.forEach(e=>{if(e.type==="group"&&"items"in e){let o=e;if(a){let g=document.createElement("div");g.className="card voc-form-group-card mb-3";let r=o.label||o.header?.title,w=o.description||o.header?.description;if(r||w){let t=document.createElement("div");if(t.className="card-header voc-form-group-head",r){let n=document.createElement("h5");n.className="mb-0 voc-form-group-label",n.textContent=r,t.appendChild(n)}if(w){let n=document.createElement("p");n.className="mb-0 voc-form-group-description",n.textContent=w,t.appendChild(n)}g.appendChild(t)}let y=document.createElement("div");y.className="card-body voc-form-group-body",o.items.forEach(t=>{if(t.type==="row"&&"items"in t){let n=t,l=document.createElement("div");if(l.className="voc-form-group voc-form-row mb-3",n.label){let m=document.createElement("h6");m.className="voc-form-row-label",m.textContent=n.label,l.appendChild(m)}let p=document.createElement("div");p.className="voc-form-row-items "+(n.direction||"horizontal"),n.items.forEach(m=>{let A=F(m);A&&p.appendChild(A)}),l.appendChild(p),y.appendChild(l)}else{let n=F(t);n&&y.appendChild(n)}}),g.appendChild(y),s.appendChild(g)}else{let g=document.createElement("div");g.className="voc-form-group voc-form-group-wrapper",a&&g.classList.add("mb-3");let r=o.label||o.header?.title,w=o.description||o.header?.description;if(r||w){let y=document.createElement("div");if(y.className="voc-form-group-head",r){let t=document.createElement("h3");t.className="voc-form-group-label",t.textContent=r,y.appendChild(t)}if(w){let t=document.createElement("p");t.className="voc-form-group-description",t.textContent=w,y.appendChild(t)}g.appendChild(y)}o.items.forEach(y=>{if(y.type==="row"&&"items"in y){let t=y,n=document.createElement("div");if(n.className="voc-form-group voc-form-row",a&&n.classList.add("mb-3"),t.label){let p=document.createElement("h4");p.className="voc-form-row-label",p.textContent=t.label,n.appendChild(p)}let l=document.createElement("div");l.className="voc-form-row-items "+(t.direction||"horizontal"),t.items.forEach(p=>{let m=F(p);m&&l.appendChild(m)}),n.appendChild(l),g.appendChild(n)}else{let t=F(y);t&&g.appendChild(t)}}),s.appendChild(g)}return}if(e.type==="row"&&"items"in e){let o=document.createElement("div");if(o.className="voc-form-group voc-form-row",a&&o.classList.add("mb-3"),e.label){let r=document.createElement("h3");r.className="voc-form-row-label",r.textContent=e.label,o.appendChild(r)}if(e.description){let r=document.createElement("p");r.className="voc-form-row-description",r.textContent=e.description,o.appendChild(r)}let g=document.createElement("div");g.className="voc-form-row-items "+(e.direction||"horizontal"),o.appendChild(g),e.items.forEach(r=>{let w=F(r);w&&g.appendChild(w)}),s.appendChild(o)}else{let o=F(e);o&&s.appendChild(o)}});let C=document.createElement("button");return C.type="submit",C.className="voc-form-submit",C.textContent="Submit",a&&C.classList.add("btn","btn-primary"),s.appendChild(C),s}let d=f();b[0].appendChild(d);let E=v?.submit_config??h?.submit_config??null;return E&&d.addEventListener("submit",a=>{a.preventDefault(),q(d,E,(s,u)=>{h?.onSubmitResult&&h.onSubmitResult(s,u)})}),{element:d,validate:()=>{let a=[];return d.querySelectorAll(":invalid").forEach(u=>{let c=u.validationMessage;a.push({element:u,message:c})}),a},getValues:()=>N(d),onSubmit:a=>{d.addEventListener("submit",s=>{s.preventDefault();let u=N(d);a(u,s)})}}}var _={renderForm:D};var P=_,G={FormsLib:_};0&&(module.exports={FormsLib});
|
package/dist/main.mjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
function _(m,w,v){let b=w?.style==="bootstrap",y=document.createElement("div");y.className="voc-form-avatar-wrapper",b&&y.classList.add("d-flex","align-items-center","gap-3");let l=document.createElement("img");l.className="voc-form-avatar-preview",l.alt=m.label||"avatar",b&&(l.classList.add("img-thumbnail","rounded-circle"),l.style.width=l.style.height="64px",l.style.objectFit="cover");let g=v!=null?String(v):m.default!==void 0&&m.default!==null?String(m.default):"";g?l.src=g:(l.src="",l.style.display="none");let a=document.createElement("input");a.type="file",a.accept=m.accept||"image/*",a.className="voc-form-avatar-input",b&&a.classList.add("form-control"),(m.key||m.name)&&(a.name=m.name||m.key,m.key&&(a.id=`voc-form-${m.key}`));let i=document.createElement("input");if(i.type="hidden",(m.key||m.name)&&(i.name=(m.name||m.key)+"_url"),i.value=g||"",a.addEventListener("change",u=>{let s=u.target;if(s.files&&s.files.length>0){let F=s.files[0],C=new FileReader;C.onload=()=>{l.src=String(C.result),l.style.display="",i.value=""},C.readAsDataURL(F)}}),b){let u=document.createElement("div");u.style.flex="1",u.appendChild(a),u.appendChild(i),y.appendChild(l),y.appendChild(u)}else y.appendChild(l),y.appendChild(a),y.appendChild(i);return y}function H(m,w,v){let b=w?.style==="bootstrap",y=document.createElement("div");if(y.className="voc-form-audio-select",!m.options||m.options.length===0)return y;let l=m.name||m.key||`audio_select_${Math.random().toString(36).substr(2,6)}`,g;return Array.isArray(v)?g=v[0]:v!==void 0?g=v:m.default!==void 0&&(g=m.default),m.options.forEach((a,i)=>{let u=document.createElement("div");u.className="voc-form-audio-item",b&&u.classList.add("form-check");let s=document.createElement("input");s.type="radio",s.name=l,s.value=a.value,s.className="voc-form-audio-radio",m.key&&(s.id=`voc-form-${m.key}-${i}`),m.required&&i===0&&(s.required=!0),s.style.position="absolute",s.style.width="1px",s.style.height="1px",s.style.margin="0",s.style.padding="0",s.style.clip="rect(0 0 0 0)",s.style.clipPath="inset(50%)",s.style.overflow="hidden",s.style.border="0",g!==void 0&&(Array.isArray(g)?s.checked=g.includes(a.value):s.checked=String(g)===String(a.value));let F=()=>{s.checked?u.classList.add("selected"):u.classList.remove("selected")};s.addEventListener("change",()=>{y.querySelectorAll(".voc-form-audio-item").forEach(n=>n.classList.remove("selected")),F()}),s.checked&&u.classList.add("selected");let C=document.createElement("label");C.className="voc-form-audio-label",b&&C.classList.add("form-check-label"),C.htmlFor=s.id||"",C.textContent=a.label||a.value,C.tabIndex=0;let e=document.createElement("div");e.className="voc-form-audio-control";let o=null;if(a.audio_link){let t=document.createElement("button");t.type="button",t.className="voc-form-audio-play",b&&t.classList.add("btn","btn-sm","btn-outline-secondary"),t.setAttribute("aria-label",`Play ${a.label||a.value}`);let n="http://www.w3.org/2000/svg",c=document.createElementNS(n,"svg");c.setAttribute("viewBox","0 0 24 24"),c.setAttribute("width","16"),c.setAttribute("height","16"),c.setAttribute("aria-hidden","true");let p=document.createElementNS(n,"path");p.setAttribute("d","M8 5v14l11-7z"),p.setAttribute("fill","currentColor"),c.appendChild(p),t.appendChild(c),o=document.createElement("audio"),o.src=a.audio_link,o.preload="none",o.style.display="none";let d=L=>{for(;L.firstChild;)L.removeChild(L.firstChild)},A=()=>{let L="http://www.w3.org/2000/svg",x=document.createElementNS(L,"svg");x.setAttribute("viewBox","0 0 24 24"),x.setAttribute("width","16"),x.setAttribute("height","16"),x.setAttribute("aria-hidden","true");let k=document.createElementNS(L,"path");return k.setAttribute("d","M8 5v14l11-7z"),k.setAttribute("fill","currentColor"),x.appendChild(k),x},M=()=>{let L="http://www.w3.org/2000/svg",x=document.createElementNS(L,"svg");x.setAttribute("viewBox","0 0 24 24"),x.setAttribute("width","16"),x.setAttribute("height","16"),x.setAttribute("aria-hidden","true");let k=document.createElementNS(L,"rect");return k.setAttribute("x","6"),k.setAttribute("y","6"),k.setAttribute("width","12"),k.setAttribute("height","12"),k.setAttribute("fill","currentColor"),x.appendChild(k),x};d(t),t.appendChild(A());let T=L=>{d(t),L?(t.appendChild(M()),t.setAttribute("aria-label",`Stop ${a.label||a.value}`)):(t.appendChild(A()),t.setAttribute("aria-label",`Play ${a.label||a.value}`))};t.addEventListener("click",()=>{try{if(!o)return;let L=y.querySelectorAll("audio");if(!o.paused&&!o.ended){o.pause(),o.currentTime=0;return}L.forEach(k=>{try{k.pause(),k.currentTime=0}catch{}}),y.querySelectorAll(".voc-form-audio-item").forEach(k=>k.classList.remove("is-playing")),o.play()}catch(L){console.warn("audio play failed",L)}}),o.addEventListener("playing",()=>{u.classList.add("is-playing"),T(!0)});let S=()=>{u.classList.remove("is-playing"),T(!1)};o.addEventListener("pause",S),o.addEventListener("ended",S),e.appendChild(t),e.appendChild(o)}let f=document.createElement("div");f.className="voc-form-item-detail",f.style.display="flex",f.style.flexDirection="column",f.style.gap="4px";let r=document.createElement("div");r.className="voc-form-item-top",r.style.display="flex",r.style.alignItems="center",r.style.gap="8px",r.appendChild(s),r.appendChild(C);let E=document.createElement("div");E.className="voc-form-item-description";let h=a.description||a.hint_text||"";h&&(E.textContent=h),f.appendChild(r),f.appendChild(E),e.appendChild(f),u.appendChild(e),r.addEventListener("click",t=>{let n=t.target;n&&n.closest(".voc-form-audio-play")||(s.checked=!0,s.dispatchEvent(new Event("change",{bubbles:!0})))}),u.addEventListener("click",t=>{let n=t.target;n&&n.closest(".voc-form-audio-play")||(s.checked=!0,s.dispatchEvent(new Event("change",{bubbles:!0})))}),y.appendChild(u)}),y}function N(m,w=!0){let v=new FormData(m);if(w)return v;let b={};return v.forEach((y,l)=>{let g=(y instanceof File,y);Object.prototype.hasOwnProperty.call(b,l)?Array.isArray(b[l])?b[l].push(g):b[l]=[b[l],g]:b[l]=g}),b}async function B(m,w,v){let b=w.url,y={"Content-Type":"application/json"};w?.api_token&&(y.Authorization=`Bearer ${w.api_token}`);let l=N(m);if(w?.additional_data)for(let[i,u]of Object.entries(w.additional_data))l.append(i,u);let g,a=l instanceof FormData;g={method:"POST",headers:{Authorization:`Bearer ${w.api_token}`,...a?{}:{"Content-Type":"application/json"},Accept:"application/json"},body:a?l:JSON.stringify(Object.fromEntries(l.entries()))};try{fetch(b,g).then(async i=>{let u=i.headers.get("content-type");if(!i.ok)try{let
|
|
1
|
+
function _(m,w,v){let b=w?.style==="bootstrap",y=document.createElement("div");y.className="voc-form-avatar-wrapper",b&&y.classList.add("d-flex","align-items-center","gap-3");let l=document.createElement("img");l.className="voc-form-avatar-preview",l.alt=m.label||"avatar",b&&(l.classList.add("img-thumbnail","rounded-circle"),l.style.width=l.style.height="64px",l.style.objectFit="cover");let g=v!=null?String(v):m.default!==void 0&&m.default!==null?String(m.default):"";g?l.src=g:(l.src="",l.style.display="none");let a=document.createElement("input");a.type="file",a.accept=m.accept||"image/*",a.className="voc-form-avatar-input",b&&a.classList.add("form-control"),(m.key||m.name)&&(a.name=m.name||m.key,m.key&&(a.id=`voc-form-${m.key}`));let i=document.createElement("input");if(i.type="hidden",(m.key||m.name)&&(i.name=(m.name||m.key)+"_url"),i.value=g||"",a.addEventListener("change",u=>{let s=u.target;if(s.files&&s.files.length>0){let F=s.files[0],C=new FileReader;C.onload=()=>{l.src=String(C.result),l.style.display="",i.value=""},C.readAsDataURL(F)}}),b){let u=document.createElement("div");u.style.flex="1",u.appendChild(a),u.appendChild(i),y.appendChild(l),y.appendChild(u)}else y.appendChild(l),y.appendChild(a),y.appendChild(i);return y}function H(m,w,v){let b=w?.style==="bootstrap",y=document.createElement("div");if(y.className="voc-form-audio-select",!m.options||m.options.length===0)return y;let l=m.name||m.key||`audio_select_${Math.random().toString(36).substr(2,6)}`,g;return Array.isArray(v)?g=v[0]:v!==void 0?g=v:m.default!==void 0&&(g=m.default),m.options.forEach((a,i)=>{let u=document.createElement("div");u.className="voc-form-audio-item",b&&u.classList.add("form-check");let s=document.createElement("input");s.type="radio",s.name=l,s.value=a.value,s.className="voc-form-audio-radio",m.key&&(s.id=`voc-form-${m.key}-${i}`),m.required&&i===0&&(s.required=!0),s.style.position="absolute",s.style.width="1px",s.style.height="1px",s.style.margin="0",s.style.padding="0",s.style.clip="rect(0 0 0 0)",s.style.clipPath="inset(50%)",s.style.overflow="hidden",s.style.border="0",g!==void 0&&(Array.isArray(g)?s.checked=g.includes(a.value):s.checked=String(g)===String(a.value));let F=()=>{s.checked?u.classList.add("selected"):u.classList.remove("selected")};s.addEventListener("change",()=>{y.querySelectorAll(".voc-form-audio-item").forEach(n=>n.classList.remove("selected")),F()}),s.checked&&u.classList.add("selected");let C=document.createElement("label");C.className="voc-form-audio-label",b&&C.classList.add("form-check-label"),C.htmlFor=s.id||"",C.textContent=a.label||a.value,C.tabIndex=0;let e=document.createElement("div");e.className="voc-form-audio-control";let o=null;if(a.audio_link){let t=document.createElement("button");t.type="button",t.className="voc-form-audio-play",b&&t.classList.add("btn","btn-sm","btn-outline-secondary"),t.setAttribute("aria-label",`Play ${a.label||a.value}`);let n="http://www.w3.org/2000/svg",c=document.createElementNS(n,"svg");c.setAttribute("viewBox","0 0 24 24"),c.setAttribute("width","16"),c.setAttribute("height","16"),c.setAttribute("aria-hidden","true");let p=document.createElementNS(n,"path");p.setAttribute("d","M8 5v14l11-7z"),p.setAttribute("fill","currentColor"),c.appendChild(p),t.appendChild(c),o=document.createElement("audio"),o.src=a.audio_link,o.preload="none",o.style.display="none";let d=L=>{for(;L.firstChild;)L.removeChild(L.firstChild)},A=()=>{let L="http://www.w3.org/2000/svg",x=document.createElementNS(L,"svg");x.setAttribute("viewBox","0 0 24 24"),x.setAttribute("width","16"),x.setAttribute("height","16"),x.setAttribute("aria-hidden","true");let k=document.createElementNS(L,"path");return k.setAttribute("d","M8 5v14l11-7z"),k.setAttribute("fill","currentColor"),x.appendChild(k),x},M=()=>{let L="http://www.w3.org/2000/svg",x=document.createElementNS(L,"svg");x.setAttribute("viewBox","0 0 24 24"),x.setAttribute("width","16"),x.setAttribute("height","16"),x.setAttribute("aria-hidden","true");let k=document.createElementNS(L,"rect");return k.setAttribute("x","6"),k.setAttribute("y","6"),k.setAttribute("width","12"),k.setAttribute("height","12"),k.setAttribute("fill","currentColor"),x.appendChild(k),x};d(t),t.appendChild(A());let T=L=>{d(t),L?(t.appendChild(M()),t.setAttribute("aria-label",`Stop ${a.label||a.value}`)):(t.appendChild(A()),t.setAttribute("aria-label",`Play ${a.label||a.value}`))};t.addEventListener("click",()=>{try{if(!o)return;let L=y.querySelectorAll("audio");if(!o.paused&&!o.ended){o.pause(),o.currentTime=0;return}L.forEach(k=>{try{k.pause(),k.currentTime=0}catch{}}),y.querySelectorAll(".voc-form-audio-item").forEach(k=>k.classList.remove("is-playing")),o.play()}catch(L){console.warn("audio play failed",L)}}),o.addEventListener("playing",()=>{u.classList.add("is-playing"),T(!0)});let S=()=>{u.classList.remove("is-playing"),T(!1)};o.addEventListener("pause",S),o.addEventListener("ended",S),e.appendChild(t),e.appendChild(o)}let f=document.createElement("div");f.className="voc-form-item-detail",f.style.display="flex",f.style.flexDirection="column",f.style.gap="4px";let r=document.createElement("div");r.className="voc-form-item-top",r.style.display="flex",r.style.alignItems="center",r.style.gap="8px",r.appendChild(s),r.appendChild(C);let E=document.createElement("div");E.className="voc-form-item-description";let h=a.description||a.hint_text||"";h&&(E.textContent=h),f.appendChild(r),f.appendChild(E),e.appendChild(f),u.appendChild(e),r.addEventListener("click",t=>{let n=t.target;n&&n.closest(".voc-form-audio-play")||(s.checked=!0,s.dispatchEvent(new Event("change",{bubbles:!0})))}),u.addEventListener("click",t=>{let n=t.target;n&&n.closest(".voc-form-audio-play")||(s.checked=!0,s.dispatchEvent(new Event("change",{bubbles:!0})))}),y.appendChild(u)}),y}function N(m,w=!0){let v=new FormData(m);if(w)return v;let b={};return v.forEach((y,l)=>{let g=(y instanceof File,y);Object.prototype.hasOwnProperty.call(b,l)?Array.isArray(b[l])?b[l].push(g):b[l]=[b[l],g]:b[l]=g}),b}async function B(m,w,v){let b=w.url,y={"Content-Type":"application/json"};w?.api_token&&(y.Authorization=`Bearer ${w.api_token}`);let l=N(m);if(w?.additional_data)for(let[i,u]of Object.entries(w.additional_data))l.append(i,u);let g,a=l instanceof FormData;g={method:"POST",headers:{Authorization:`Bearer ${w.api_token}`,...a?{}:{"Content-Type":"application/json"},Accept:"application/json"},body:a?l:JSON.stringify(Object.fromEntries(l.entries()))};try{fetch(b,g).then(async i=>{let u=i.headers.get("content-type");if(!i.ok)try{let F=(await i.json())?.message;throw new Error(F??"Their was an error submitting the form. Check your form and try again.")}catch(s){throw new Error(s)}return u&&u.includes("application/json")?i.json():i.text()}).then(i=>{v&&v(i,null)}).catch(i=>{v&&v(null,i.replace(/^Error:\s*/,""))})}catch(i){v&&v(null,i)}}function q(m,w,v){let b=[];if(typeof m=="string"?b=Array.from(document.querySelectorAll(m)):b=[m],b.length===0)return null;function y(){let a=v?.style==="bootstrap",i=document.createElement("form");i.classList.add("voc-form"),a&&i.classList.add("needs-validation"),i.id=w.id;let u=document.createElement("h2");u.className="voc-form-title",a&&u.classList.add("mb-3"),u.textContent=w.form_name,i.appendChild(u);function s(e,o){o&&(o.min_length!==void 0&&(e.minLength=o.min_length),o.max_length!==void 0&&(e.maxLength=o.max_length),o.regex&&(e instanceof HTMLInputElement?e.pattern=o.regex:e.dataset.pattern=o.regex))}function F(e){if(!e.key&&!e.label)return null;let o=w.default_values||{},f=e.name||e.key,r=f?o[f]:void 0,E=document.createElement("div");if(E.className="voc-form-group",a&&E.classList.add("mb-3"),e.label){let t=document.createElement("label");if(t.classList.add("voc-form-label"),a&&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){let n=document.createElement("span");n.className="voc-form-required",n.textContent="*",t.appendChild(n)}E.appendChild(t)}let h=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 p=document.createElement("label");p.classList.add("voc-form-checkbox-label"),a&&p.classList.add("form-check"),p.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(p.style.width=e.width);let d=document.createElement("input");d.type="checkbox",d.classList.add("voc-form-checkbox"),a&&d.classList.add("form-check-input"),d.name=e.name||e.key||"",d.value=n.value,e.key&&(d.id=`voc-form-${e.key}-${c}`),e.required&&(d.required=!0),Array.isArray(r)?r.includes(n.value)&&(d.checked=!0):r!==void 0?r===n.value&&(d.checked=!0):e.default===n.value&&(d.checked=!0),p.appendChild(d),p.appendChild(document.createTextNode(n.label)),t.appendChild(p)});else{let n=document.createElement("label");n.classList.add("voc-form-checkbox-label"),a&&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}`)),a&&c.classList.add("form-check-input"),e.required&&(c.required=!0),r!==void 0?c.checked=!!r:e.default&&(c.checked=!!e.default),n.appendChild(c),n.appendChild(document.createTextNode(e.label||"")),t.appendChild(n)}h=t;break}case"textarea":{let t=document.createElement("textarea");t.classList.add("voc-form-textarea"),a&&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),r!=null?t.value=String(r):e.default!==void 0&&e.default!==null&&(t.value=String(e.default));let n=e.default||r||"";if(n){let c=(n.match(/\n/g)||[]).length,p=80,d=n.split(`
|
|
2
2
|
`).reduce((T,S)=>Math.max(T,S.length),0),A=Math.ceil(d/p)||1,M=Math.max(2,c+A);t.rows=M,t.style.resize="vertical"}e.width&&(t.style.width=e.width),e.required&&(t.required=!0),s(t,e.validation),h=t;break}case"select":{let t=document.createElement("select");if(t.classList.add("voc-form-select"),a&&t.classList.add("form-select"),a&&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){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(r)?r.includes(n.value)&&(c.selected=!0):r!==void 0?r===n.value&&(c.selected=!0):e.default===n.value&&(c.selected=!0),t.appendChild(c)}),e.width&&(t.style.width=e.width),h=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 p=document.createElement("label");p.classList.add("voc-form-radio-label"),a&&p.classList.add("form-check"),p.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(p.style.width=e.width);let d=document.createElement("input");d.type="radio",d.classList.add("voc-form-radio"),a&&d.classList.add("form-check-input"),d.name=e.name||e.key||"",d.value=n.value,e.key&&(d.id=`voc-form-${e.key}-${c}`),Array.isArray(r)?r.includes(n.value)&&(d.checked=!0):r!==void 0?r===n.value&&(d.checked=!0):e.default===n.value&&(d.checked=!0),p.appendChild(d),p.appendChild(document.createTextNode(n.label)),t.appendChild(p)}),h=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"),a&&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),h=t;break}case"avatar":{h=_(e,v||{},r);break}case"audio_select":{h=H(e,v||{},r);break}default:{let t=document.createElement("input");t.type=e.type||"text",t.classList.add("voc-form-input"),a&&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),r!=null?t.value=String(r):e.default!==void 0&&e.default!==null&&(t.value=String(e.default)),e.width&&(t.style.width=e.width),e.required&&(t.required=!0),s(t,e.validation),h=t;break}}if(h&&E.appendChild(h),e.hint_text){let t=document.createElement("small");t.className="voc-form-hint",t.textContent=e.hint_text,E.appendChild(t)}return E}w.fields.forEach(e=>{if(e.type==="group"&&"items"in e){let o=e;if(a){let f=document.createElement("div");f.className="card voc-form-group-card mb-3";let r=o.label||o.header?.title,E=o.description||o.header?.description;if(r||E){let t=document.createElement("div");if(t.className="card-header voc-form-group-head",r){let n=document.createElement("h5");n.className="mb-0 voc-form-group-label",n.textContent=r,t.appendChild(n)}if(E){let n=document.createElement("p");n.className="mb-0 voc-form-group-description",n.textContent=E,t.appendChild(n)}f.appendChild(t)}let h=document.createElement("div");h.className="card-body voc-form-group-body",o.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 d=document.createElement("h6");d.className="voc-form-row-label",d.textContent=n.label,c.appendChild(d)}let p=document.createElement("div");p.className="voc-form-row-items "+(n.direction||"horizontal"),n.items.forEach(d=>{let A=F(d);A&&p.appendChild(A)}),c.appendChild(p),h.appendChild(c)}else{let n=F(t);n&&h.appendChild(n)}}),f.appendChild(h),i.appendChild(f)}else{let f=document.createElement("div");f.className="voc-form-group voc-form-group-wrapper",a&&f.classList.add("mb-3");let r=o.label||o.header?.title,E=o.description||o.header?.description;if(r||E){let h=document.createElement("div");if(h.className="voc-form-group-head",r){let t=document.createElement("h3");t.className="voc-form-group-label",t.textContent=r,h.appendChild(t)}if(E){let t=document.createElement("p");t.className="voc-form-group-description",t.textContent=E,h.appendChild(t)}f.appendChild(h)}o.items.forEach(h=>{if(h.type==="row"&&"items"in h){let t=h,n=document.createElement("div");if(n.className="voc-form-group voc-form-row",a&&n.classList.add("mb-3"),t.label){let p=document.createElement("h4");p.className="voc-form-row-label",p.textContent=t.label,n.appendChild(p)}let c=document.createElement("div");c.className="voc-form-row-items "+(t.direction||"horizontal"),t.items.forEach(p=>{let d=F(p);d&&c.appendChild(d)}),n.appendChild(c),f.appendChild(n)}else{let t=F(h);t&&f.appendChild(t)}}),i.appendChild(f)}return}if(e.type==="row"&&"items"in e){let o=document.createElement("div");if(o.className="voc-form-group voc-form-row",a&&o.classList.add("mb-3"),e.label){let r=document.createElement("h3");r.className="voc-form-row-label",r.textContent=e.label,o.appendChild(r)}if(e.description){let r=document.createElement("p");r.className="voc-form-row-description",r.textContent=e.description,o.appendChild(r)}let f=document.createElement("div");f.className="voc-form-row-items "+(e.direction||"horizontal"),o.appendChild(f),e.items.forEach(r=>{let E=F(r);E&&f.appendChild(E)}),i.appendChild(o)}else{let o=F(e);o&&i.appendChild(o)}});let C=document.createElement("button");return C.type="submit",C.className="voc-form-submit",C.textContent="Submit",a&&C.classList.add("btn","btn-primary"),i.appendChild(C),i}let l=y();b[0].appendChild(l);let g=w?.submit_config??v?.submit_config??null;return g&&l.addEventListener("submit",a=>{a.preventDefault(),B(l,g,(i,u)=>{v?.onSubmitResult&&v.onSubmitResult(i,u)})}),{element:l,validate:()=>{let a=[];return l.querySelectorAll(":invalid").forEach(u=>{let s=u.validationMessage;a.push({element:u,message:s})}),a},getValues:()=>N(l),onSubmit:a=>{l.addEventListener("submit",i=>{i.preventDefault();let u=N(l);a(u,i)})}}}var R={renderForm:q};var X=R,Y={FormsLib:R};export{X as FormsLib,Y as default};
|