voc-lib-js 1.0.54 → 1.0.56

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/main.global.js +2 -2
  2. package/dist/main.js +2 -2
  3. package/dist/main.mjs +2 -2
  4. package/package.json +1 -1
package/dist/main.global.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";var VocLibJs=(()=>{var j=Object.defineProperty;var Y=Object.getOwnPropertyDescriptor;var Q=Object.getOwnPropertyNames;var X=Object.prototype.hasOwnProperty;var Z=(s,b)=>{for(var f in b)j(s,f,{get:b[f],enumerable:!0})},ee=(s,b,f,y)=>{if(b&&typeof b=="object"||typeof b=="function")for(let m of Q(b))!X.call(s,m)&&m!==f&&j(s,m,{get:()=>b[m],enumerable:!(y=Y(b,m))||y.enumerable});return s};var te=s=>ee(j({},"__esModule",{value:!0}),s);var oe={};Z(oe,{FormsLib:()=>ne,default:()=>re});function W(s,b,f){let y=b?.style==="bootstrap",m=document.createElement("div");m.className="voc-form-avatar-wrapper",y&&m.classList.add("d-flex","align-items-center","gap-3");let u=document.createElement("img");u.className="voc-form-avatar-preview",u.alt=s.label||"avatar",y&&(u.classList.add("img-thumbnail","rounded-circle"),u.style.width=u.style.height="64px",u.style.objectFit="cover");let E=f!=null?String(f):s.default!==void 0&&s.default!==null?String(s.default):"";E?u.src=E:(u.src="",u.style.display="none");let c=document.createElement("input");c.type="file",c.accept=s.accept||"image/*",c.className="voc-form-avatar-input",y&&c.classList.add("form-control"),(s.key||s.name)&&(c.name=s.name||s.key,s.key&&(c.id=`voc-form-${s.key}`));let h=document.createElement("input");if(h.type="hidden",(s.key||s.name)&&(h.name=(s.name||s.key)+"_url"),h.value=E||"",c.addEventListener("change",v=>{let d=v.target;if(d.files&&d.files.length>0){let N=d.files[0],x=new FileReader;x.onload=()=>{u.src=String(x.result),u.style.display="",h.value=""},x.readAsDataURL(N)}}),y){let v=document.createElement("div");v.style.flex="1",v.appendChild(c),v.appendChild(h),m.appendChild(u),m.appendChild(v)}else m.appendChild(u),m.appendChild(c),m.appendChild(h);return m}function z(s,b,f){let y=b?.style==="bootstrap",m=document.createElement("div");if(m.className="voc-form-audio-select",!s.options||s.options.length===0)return m;let u=s.name||s.key||`audio_select_${Math.random().toString(36).substr(2,6)}`,E;return Array.isArray(f)?E=f[0]:f!==void 0?E=f:s.default!==void 0&&(E=s.default),s.options.forEach((c,h)=>{let v=document.createElement("div");v.className="voc-form-audio-item",y&&v.classList.add("form-check");let d=document.createElement("input");d.type="radio",d.name=u,d.value=c.value,d.className="voc-form-audio-radio",s.key&&(d.id=`voc-form-${s.key}-${h}`),s.required&&h===0&&(d.required=!0),d.style.position="absolute",d.style.width="1px",d.style.height="1px",d.style.margin="0",d.style.padding="0",d.style.clip="rect(0 0 0 0)",d.style.clipPath="inset(50%)",d.style.overflow="hidden",d.style.border="0",E!==void 0&&(Array.isArray(E)?d.checked=E.includes(c.value):d.checked=String(E)===String(c.value));let N=()=>{d.checked?v.classList.add("selected"):v.classList.remove("selected")};d.addEventListener("change",()=>{m.querySelectorAll(".voc-form-audio-item").forEach(a=>a.classList.remove("selected")),N()}),d.checked&&v.classList.add("selected");let x=document.createElement("label");x.className="voc-form-audio-label",y&&x.classList.add("form-check-label"),x.htmlFor=d.id||"",x.textContent=c.label||c.value,x.tabIndex=0;let e=document.createElement("div");e.className="voc-form-audio-control";let p=null;if(c.audio_link){let t=document.createElement("button");t.type="button",t.className="voc-form-audio-play",y&&t.classList.add("btn","btn-sm","btn-outline-secondary"),t.setAttribute("aria-label",`Play ${c.label||c.value}`);let a="http://www.w3.org/2000/svg",i=document.createElementNS(a,"svg");i.setAttribute("viewBox","0 0 24 24"),i.setAttribute("width","16"),i.setAttribute("height","16"),i.setAttribute("aria-hidden","true");let n=document.createElementNS(a,"path");n.setAttribute("d","M8 5v14l11-7z"),n.setAttribute("fill","currentColor"),i.appendChild(n),t.appendChild(i),p=document.createElement("audio"),p.src=c.audio_link,p.preload="none",p.style.display="none";let o=l=>{for(;l.firstChild;)l.removeChild(l.firstChild)},w=()=>{let l="http://www.w3.org/2000/svg",S=document.createElementNS(l,"svg");S.setAttribute("viewBox","0 0 24 24"),S.setAttribute("width","16"),S.setAttribute("height","16"),S.setAttribute("aria-hidden","true");let T=document.createElementNS(l,"path");return T.setAttribute("d","M8 5v14l11-7z"),T.setAttribute("fill","currentColor"),S.appendChild(T),S},A=()=>{let l="http://www.w3.org/2000/svg",S=document.createElementNS(l,"svg");S.setAttribute("viewBox","0 0 24 24"),S.setAttribute("width","16"),S.setAttribute("height","16"),S.setAttribute("aria-hidden","true");let T=document.createElementNS(l,"rect");return T.setAttribute("x","6"),T.setAttribute("y","6"),T.setAttribute("width","12"),T.setAttribute("height","12"),T.setAttribute("fill","currentColor"),S.appendChild(T),S};o(t),t.appendChild(w());let H=l=>{o(t),l?(t.appendChild(A()),t.setAttribute("aria-label",`Stop ${c.label||c.value}`)):(t.appendChild(w()),t.setAttribute("aria-label",`Play ${c.label||c.value}`))};t.addEventListener("click",()=>{try{if(!p)return;let l=m.querySelectorAll("audio");if(!p.paused&&!p.ended){p.pause(),p.currentTime=0;return}l.forEach(T=>{try{T.pause(),T.currentTime=0}catch{}}),m.querySelectorAll(".voc-form-audio-item").forEach(T=>T.classList.remove("is-playing")),p.play()}catch(l){console.warn("audio play failed",l)}}),p.addEventListener("playing",()=>{v.classList.add("is-playing"),H(!0)});let R=()=>{v.classList.remove("is-playing"),H(!1)};p.addEventListener("pause",R),p.addEventListener("ended",R),e.appendChild(t),e.appendChild(p)}let L=document.createElement("div");L.className="voc-form-item-detail",L.style.display="flex",L.style.flexDirection="column",L.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(d),r.appendChild(x);let C=document.createElement("div");C.className="voc-form-item-description";let k=c.description||c.hint_text||"";k&&(C.textContent=k),L.appendChild(r),L.appendChild(C),e.appendChild(L),v.appendChild(e),r.addEventListener("click",t=>{let a=t.target;a&&a.closest(".voc-form-audio-play")||(d.checked=!0,d.dispatchEvent(new Event("change",{bubbles:!0})))}),v.addEventListener("click",t=>{let a=t.target;a&&a.closest(".voc-form-audio-play")||(d.checked=!0,d.dispatchEvent(new Event("change",{bubbles:!0})))}),m.appendChild(v)}),m}function V(s,b,f){let y=document.createElement("div");y.className="voc-form-table-wrapper";let m=b?.style==="bootstrap",u=document.createElement("input");u.type="hidden",u.name=s.name||s.key,s.key&&(u.id=`voc-form-${s.key}`),y.appendChild(u);let E=document.createElement("table");E.className="voc-form-table",m&&E.classList.add("table","table-bordered");let c=document.createElement("thead"),h=document.createElement("tr"),v=document.createElement("th");v.className="voc-form-table-drag-col",v.textContent="",h.appendChild(v),(s.fields||[]).forEach(a=>{let i=document.createElement("th");i.textContent=a.label||a.key,h.appendChild(i)});let d=document.createElement("th");d.textContent="Actions",h.appendChild(d),c.appendChild(h),E.appendChild(c);let N=document.createElement("tbody");E.appendChild(N),y.appendChild(E);let x=document.createElement("button");x.type="button",x.className="voc-form-table-add",m&&x.classList.add("btn","btn-secondary"),x.textContent="+Add";let e=document.createElement("tfoot"),p=document.createElement("tr"),L=document.createElement("td");L.colSpan=(s.fields?s.fields.length:0)+1,L.appendChild(x),p.appendChild(L),e.appendChild(p),E.appendChild(e),y.appendChild(E);let r=[];function C(){u.value=JSON.stringify(r)}function k(a){let i=[];return s.fields.forEach(n=>{let o=a[n.key];if(n.type==="checkbox"){let w=Array.isArray(o)?o:o?[o]:[];n.required&&w.length===0&&i.push(`${n.label||n.key} is required`);return}n.required&&(o==null||String(o).trim()==="")&&i.push(`${n.label||n.key} is required`),n.type==="email"&&o&&(/^\S+@\S+\.\S+$/.test(String(o))||i.push(`${n.label||n.key} must be a valid email`)),n.type==="number"&&o&&isNaN(Number(o))&&i.push(`${n.label||n.key} must be a number`),n.validation&&n.validation.regex&&o&&(new RegExp(n.validation.regex).test(String(o))||i.push(`${n.label||n.key} invalid format`))}),i}function t(){N.innerHTML="";let a=(i,n)=>{n.draggable=!0,n.addEventListener("mousedown",()=>{n.style.cursor="grabbing"}),n.addEventListener("mouseup",()=>{n.style.cursor="grab"}),n.addEventListener("dragstart",o=>{let w=Number(i.dataset.rowIndex);o.dataTransfer.setData("text/plain",String(w)),i.classList.add("dragging");try{o.dataTransfer?.setDragImage(n,10,10)}catch{}}),n.addEventListener("dragend",()=>{i.classList.remove("dragging"),n.style.cursor="grab"}),i.addEventListener("dragover",o=>{o.preventDefault();let w=o.currentTarget,A=w.getBoundingClientRect(),H=A.top+A.height/2,R=(o.clientY||o.y)>H;w.classList.remove("drag-over-top","drag-over-bottom"),R?(w.classList.add("drag-over-bottom"),w.dataset.dropPosition="after"):(w.classList.add("drag-over-top"),w.dataset.dropPosition="before")}),i.addEventListener("dragleave",o=>{let w=o.currentTarget;w.classList.remove("drag-over-top","drag-over-bottom"),delete w.dataset.dropPosition}),i.addEventListener("drop",o=>{o.preventDefault();let w=o.dataTransfer.getData("text/plain"),A=Number(o.currentTarget.dataset.rowIndex),H=Number(w),R=o.currentTarget.dataset.dropPosition||"before";if(isNaN(H)||isNaN(A))return;let[l]=r.splice(H,1),S=A;H<A&&(S=A-1);let T=R==="after"?S+1:S;r.splice(T,0,l),o.currentTarget.classList.remove("drag-over-top","drag-over-bottom"),delete o.currentTarget.dataset.dropPosition,t(),C()})};r.forEach((i,n)=>{let o=document.createElement("tr");o.dataset.rowIndex=String(n),o.classList.add("voc-form-table-row");let w=document.createElement("td");w.className="voc-form-table-drag-handle";let A=document.createElement("span");A.className="voc-form-drag-handle-icon",A.textContent="\u2630",A.style.cursor="grab",w.appendChild(A),o.appendChild(w),a(o,A),s.fields.forEach(l=>{let S=document.createElement("td"),T,q=(l.type||"text").toLowerCase();if(q==="select"){let g=document.createElement("select");if(g.className="voc-form-table-cell",m&&g.classList.add("form-control"),l.placeholder){let F=document.createElement("option");F.value="",F.textContent=l.placeholder,F.disabled=!0,(i[l.key]===void 0||i[l.key]===null||i[l.key]==="")&&(F.selected=!0),g.appendChild(F)}(l.options||[]).forEach(F=>{let D=document.createElement("option");D.value=F.value,D.textContent=F.label,g.appendChild(D)}),g.value=i[l.key]!==void 0&&i[l.key]!==null?String(i[l.key]):"",l.required&&(g.required=!0),g.addEventListener("change",F=>{r[n][l.key]=F.target.value,C()}),T=g}else if(q==="checkbox"){let g=document.createElement("div");g.className="voc-form-table-checkboxes",m&&g.classList.add("form-check");let B=l.options||[];Array.isArray(r[n][l.key])||(r[n][l.key]=r[n][l.key]?[r[n][l.key]]:[]),B.forEach(F=>{let D=`voc-form-${s.key}-${l.key}-${n}-${F.value}`,$=document.createElement("div");$.className="voc-form-table-checkbox-item",m&&$.classList.add("form-check");let M=document.createElement("input");M.type="checkbox",M.className="voc-form-table-cell",m&&M.classList.add("form-check-input"),M.id=D,M.value=F.value,M.checked=Array.isArray(r[n][l.key])&&r[n][l.key].includes(F.value),M.addEventListener("change",O=>{let U=O.target.checked;Array.isArray(r[n][l.key])||(r[n][l.key]=[]),U?r[n][l.key].includes(F.value)||r[n][l.key].push(F.value):r[n][l.key]=r[n][l.key].filter(K=>K!==F.value),C()});let _=document.createElement("label");_.htmlFor=D,_.className="voc-form-table-checkbox-label",m&&_.classList.add("form-check-label"),_.textContent=F.label,$.appendChild(M),$.appendChild(_),g.appendChild($)}),T=g}else if(q==="radio"){let g=document.createElement("div");g.className="voc-form-table-radios",m&&g.classList.add("form-check");let B=l.options||[];r[n][l.key]===void 0&&(r[n][l.key]=""),B.forEach(F=>{let D=`voc-form-${s.key}-${l.key}-${n}-${F.value}`,$=document.createElement("div");$.className="voc-form-table-radio-item",m&&$.classList.add("form-check");let M=document.createElement("input");M.type="radio",M.className="voc-form-table-cell",m&&M.classList.add("form-check-input"),M.id=D,M.name=`voc-form-${s.key}-${l.key}-${n}`,M.value=F.value,M.checked=r[n][l.key]===F.value,M.addEventListener("change",O=>{O.target.checked&&(r[n][l.key]=O.target.value,C())});let _=document.createElement("label");_.htmlFor=D,_.className="voc-form-table-radio-label",m&&_.classList.add("form-check-label"),_.textContent=F.label,$.appendChild(M),$.appendChild(_),g.appendChild($)}),T=g}else{let g=document.createElement("input");q==="number"?g.type="number":q==="email"?g.type="email":q==="tel"?g.type="tel":q==="url"?g.type="url":q==="date"?g.type="date":g.type="text",g.value=i[l.key]!==void 0&&i[l.key]!==null?String(i[l.key]):"",l.placeholder&&(g.placeholder=l.placeholder),l.required&&(g.required=!0),g.className="voc-form-table-cell",m&&g.classList.add("form-control"),g.addEventListener("input",B=>{r[n][l.key]=B.target.value,C()}),T=g}S.appendChild(T),o.appendChild(S)});let H=document.createElement("td"),R=document.createElement("button");R.type="button",R.className="voc-form-table-remove",m&&R.classList.add("btn","btn-danger"),R.textContent="Remove",R.addEventListener("click",()=>{r.splice(n,1),t(),C()}),H.appendChild(R),o.appendChild(H),N.appendChild(o)})}return x.addEventListener("click",()=>{if(s.validation?.max_rows!==void 0&&r.length>=s.validation.max_rows)return;let a={};s.fields.forEach(i=>a[i.key]=""),r.push(a),t(),C()}),Array.isArray(f)&&f.length?r=f.map(a=>({...a})):s.default&&Array.isArray(s.default)&&(r=s.default.map(a=>({...a}))),t(),C(),y.validate=function(){let a=[];return r.forEach((i,n)=>{let o=k(i);o.length&&a.push(`Row ${n+1}: ${o.join("; ")}`)}),s.validation?.min_rows!==void 0&&r.length<s.validation.min_rows&&a.push(`At least ${s.validation.min_rows} rows required`),s.validation?.max_rows!==void 0&&r.length>s.validation.max_rows&&a.push(`No more than ${s.validation.max_rows} rows allowed`),s.validation?.unique_fields&&s.validation.unique_fields.length&&s.validation.unique_fields.forEach(i=>{let n=new Set;r.forEach((o,w)=>{let A=o[i];A!=null&&(n.has(A)&&a.push(`Field ${i} must be unique (duplicate at row ${w+1})`),n.add(A))})}),a},y}function I(s,b=!0){let f=new FormData(s);if(b)return ae(f);let y={};return f.forEach((m,u)=>{let E=(m instanceof File,m);Object.prototype.hasOwnProperty.call(y,u)?Array.isArray(y[u])?y[u].push(E):y[u]=[y[u],E]:y[u]=E}),y}function ae(s){let b=new FormData;for(let[f,y]of s.entries()){if(y instanceof File){b.append(f,y);continue}let m;try{m=JSON.parse(y)}catch{m=null}Array.isArray(m)?m.length===0?b.append(f,"[]"):m.every(u=>typeof u=="object"&&u!==null)?m.forEach((u,E)=>{for(let[c,h]of Object.entries(u))b.append(`${f}[${E}][${c}]`,h)}):b.append(f,y):b.append(f,y)}return b}async function G(s,b,f){let y=b.url,m={"Content-Type":"application/json"};b?.api_token&&(m.Authorization=`Bearer ${b.api_token}`);let u=I(s);if(b?.additional_data)for(let[h,v]of Object.entries(b.additional_data))u.append(h,v);let E,c=u instanceof FormData;E={method:"POST",headers:{Authorization:`Bearer ${b.api_token}`,...c?{}:{"Content-Type":"application/json"},Accept:"application/json"},body:c?u:JSON.stringify(Object.fromEntries(u.entries()))};try{fetch(y,E).then(async h=>{let v=h.headers.get("content-type");if(!h.ok)try{let N=(await h.json())?.message;throw new Error(N??"Their was an error submitting the form. Check your form and try again.")}catch(d){throw new Error(d.message)}return v&&v.includes("application/json")?h.json():h.text()}).then(h=>{f&&f(h,null)}).catch(h=>{f&&f(null,h)})}catch(h){f&&f(null,h)}}function J(s,b,f){let y=[];if(typeof s=="string"?y=Array.from(document.querySelectorAll(s)):y=[s],y.length===0)return null;function m(){let c=f?.style==="bootstrap",h=document.createElement("form");h.classList.add("voc-form"),c&&h.classList.add("needs-validation"),h.id=b.id;let v=document.createElement("h2");v.className="voc-form-title",c&&v.classList.add("mb-3"),v.textContent=b.form_name,h.appendChild(v);function d(e,p){p&&(p.min_length!==void 0&&(e.minLength=p.min_length),p.max_length!==void 0&&(e.maxLength=p.max_length),p.regex&&(e instanceof HTMLInputElement?e.pattern=p.regex:e.dataset.pattern=p.regex))}function N(e){if(!e.key&&!e.label)return null;let p=b.default_values||{},L=e.name||e.key,r=L?p[L]:void 0,C=document.createElement("div");if(C.className="voc-form-group",c&&C.classList.add("mb-3"),e.label){let t=document.createElement("label");if(t.classList.add("voc-form-label"),c&&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 a=document.createElement("span");a.className="voc-form-required",a.textContent="*",t.appendChild(a)}C.appendChild(t)}let k=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((a,i)=>{let n=document.createElement("label");n.classList.add("voc-form-checkbox-label"),c&&n.classList.add("form-check"),n.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(n.style.width=e.width);let o=document.createElement("input");o.type="checkbox",o.classList.add("voc-form-checkbox"),c&&o.classList.add("form-check-input"),o.name=e.name||e.key||"",o.value=a.value,e.key&&(o.id=`voc-form-${e.key}-${i}`),e.required&&(o.required=!0),Array.isArray(r)?r.includes(a.value)&&(o.checked=!0):r!==void 0?r===a.value&&(o.checked=!0):e.default===a.value&&(o.checked=!0),n.appendChild(o),n.appendChild(document.createTextNode(a.label)),t.appendChild(n)});else{let a=document.createElement("label");a.classList.add("voc-form-checkbox-label"),c&&a.classList.add("form-check"),e.width&&(a.style.width=e.width);let i=document.createElement("input");i.type="checkbox",i.classList.add("voc-form-checkbox"),(e.key||e.name)&&(i.name=e.name||e.key,e.key&&(i.id=`voc-form-${e.key}`)),c&&i.classList.add("form-check-input"),e.required&&(i.required=!0),r!==void 0?i.checked=!!r:e.default&&(i.checked=!!e.default),a.appendChild(i),a.appendChild(document.createTextNode(e.label||"")),t.appendChild(a)}k=t;break}case"textarea":{let t=document.createElement("textarea");t.classList.add("voc-form-textarea"),c&&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 a=e.default||r||"";if(a){let i=(a.match(/\n/g)||[]).length,n=80,o=a.split(`
2
- `).reduce((H,R)=>Math.max(H,R.length),0),w=Math.ceil(o/n)||1,A=Math.max(2,i+w);t.rows=A,t.style.resize="vertical"}e.width&&(t.style.width=e.width),e.required&&(t.required=!0),d(t,e.validation),k=t;break}case"select":{let t=document.createElement("select");if(t.classList.add("voc-form-select"),c&&t.classList.add("form-select"),c&&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 a=document.createElement("option");a.value="",a.textContent=e.placeholder,a.disabled=!0,a.selected=!0,t.appendChild(a)}e.required&&(t.required=!0),e.options&&e.options.forEach(a=>{let i=document.createElement("option");i.value=a.value,i.textContent=a.label,Array.isArray(r)?r.includes(a.value)&&(i.selected=!0):r!==void 0?r===a.value&&(i.selected=!0):e.default===a.value&&(i.selected=!0),t.appendChild(i)}),e.width&&(t.style.width=e.width),k=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((a,i)=>{let n=document.createElement("label");n.classList.add("voc-form-radio-label"),c&&n.classList.add("form-check"),n.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(n.style.width=e.width);let o=document.createElement("input");o.type="radio",o.classList.add("voc-form-radio"),c&&o.classList.add("form-check-input"),o.name=e.name||e.key||"",o.value=a.value,e.key&&(o.id=`voc-form-${e.key}-${i}`),Array.isArray(r)?r.includes(a.value)&&(o.checked=!0):r!==void 0?r===a.value&&(o.checked=!0):e.default===a.value&&(o.checked=!0),n.appendChild(o),n.appendChild(document.createTextNode(a.label)),t.appendChild(n)}),k=t;break}case"file":{let t=document.createElement("div");t.className="voc-form-file-wrapper",e.width&&(t.style.width=e.width);let a=document.createElement("input");a.type="file",a.classList.add("voc-form-file"),c&&a.classList.add("form-control"),(e.key||e.name)&&(a.name=e.name||e.key,e.key&&(a.id=`voc-form-${e.key}`)),e.width&&(a.style.width=e.width),e.required&&(a.required=!0),e.accept&&(a.accept=e.accept),e.multiple&&(a.multiple=!0),t.appendChild(a),k=t;break}case"avatar":{k=W(e,f||{},r);break}case"table":{k=V(e,f||{},r);break}case"audio_select":{k=z(e,f||{},r);break}default:{let t=document.createElement("input");t.type=e.type||"text",t.classList.add("voc-form-input"),c&&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),d(t,e.validation),k=t;break}}if(k&&C.appendChild(k),e.hint_text){let t=document.createElement("small");t.className="voc-form-hint",t.textContent=e.hint_text,C.appendChild(t)}return C}b.fields.forEach(e=>{if(e.type==="group"&&"items"in e){let p=e;if(c){let L=document.createElement("div");L.className="card voc-form-group-card mb-3";let r=p.label||p.header?.title,C=p.description||p.header?.description;if(r||C){let t=document.createElement("div");if(t.className="card-header voc-form-group-head",r){let a=document.createElement("h5");a.className="mb-0 voc-form-group-label",a.textContent=r,t.appendChild(a)}if(C){let a=document.createElement("p");a.className="mb-0 voc-form-group-description",a.textContent=C,t.appendChild(a)}L.appendChild(t)}let k=document.createElement("div");k.className="card-body voc-form-group-body",p.items.forEach(t=>{if(t.type==="row"&&"items"in t){let a=t,i=document.createElement("div");if(i.className="voc-form-group voc-form-row mb-3",a.label){let o=document.createElement("h6");o.className="voc-form-row-label",o.textContent=a.label,i.appendChild(o)}let n=document.createElement("div");n.className="voc-form-row-items "+(a.direction||"horizontal"),a.items.forEach(o=>{let w=N(o);w&&n.appendChild(w)}),i.appendChild(n),k.appendChild(i)}else{let a=N(t);a&&k.appendChild(a)}}),L.appendChild(k),h.appendChild(L)}else{let L=document.createElement("div");L.className="voc-form-group voc-form-group-wrapper",c&&L.classList.add("mb-3");let r=p.label||p.header?.title,C=p.description||p.header?.description;if(r||C){let k=document.createElement("div");if(k.className="voc-form-group-head",r){let t=document.createElement("h3");t.className="voc-form-group-label",t.textContent=r,k.appendChild(t)}if(C){let t=document.createElement("p");t.className="voc-form-group-description",t.textContent=C,k.appendChild(t)}L.appendChild(k)}p.items.forEach(k=>{if(k.type==="row"&&"items"in k){let t=k,a=document.createElement("div");if(a.className="voc-form-group voc-form-row",c&&a.classList.add("mb-3"),t.label){let n=document.createElement("h4");n.className="voc-form-row-label",n.textContent=t.label,a.appendChild(n)}let i=document.createElement("div");i.className="voc-form-row-items "+(t.direction||"horizontal"),t.items.forEach(n=>{let o=N(n);o&&i.appendChild(o)}),a.appendChild(i),L.appendChild(a)}else{let t=N(k);t&&L.appendChild(t)}}),h.appendChild(L)}return}if(e.type==="row"&&"items"in e){let p=document.createElement("div");if(p.className="voc-form-group voc-form-row",c&&p.classList.add("mb-3"),e.label){let r=document.createElement("h3");r.className="voc-form-row-label",r.textContent=e.label,p.appendChild(r)}if(e.description){let r=document.createElement("p");r.className="voc-form-row-description",r.textContent=e.description,p.appendChild(r)}let L=document.createElement("div");L.className="voc-form-row-items "+(e.direction||"horizontal"),p.appendChild(L),e.items.forEach(r=>{let C=N(r);C&&L.appendChild(C)}),h.appendChild(p)}else{let p=N(e);p&&h.appendChild(p)}});let x=document.createElement("button");return x.type="submit",x.className="voc-form-submit",x.textContent="Submit",c&&x.classList.add("btn","btn-primary"),h.appendChild(x),h}let u=m();y[0].appendChild(u);let E=b?.submit_config??f?.submit_config??null;return E&&u.addEventListener("submit",c=>{if(c.preventDefault(),!u.checkValidity()){u.reportValidity(),f?.onSubmitResult&&f.onSubmitResult(null,new Error("Form validation failed"));return}let h=Array.from(u.querySelectorAll(" .voc-form-table-wrapper, .voc-form-table-wrapper")),v=[];if(h.forEach(d=>{if(d&&typeof d.validate=="function"){let N=d.validate();N&&N.length&&v.push(...N)}}),v.length){f?.onSubmitResult&&f.onSubmitResult(null,new Error(v.join("; ")));let d=h[0];d&&d.scrollIntoView({behavior:"smooth",block:"center"});return}if(f?.onSubmit){let d=I(u);f.onSubmit(d)}G(u,E,(d,N)=>{f?.onSubmitResult&&f.onSubmitResult(d,N)})}),{element:u,validate:()=>{let c=[];return u.querySelectorAll(":invalid").forEach(v=>{let d=v.validationMessage;c.push({element:v,message:d})}),c},getValues:()=>I(u),onSubmit:c=>{u.addEventListener("submit",h=>{h.preventDefault();let v=I(u);c(v,h)})}}}var P={renderForm:J};var ne=P,re={FormsLib:P};return te(oe);})();
1
+ "use strict";var VocLibJs=(()=>{var P=Object.defineProperty;var Q=Object.getOwnPropertyDescriptor;var X=Object.getOwnPropertyNames;var Z=Object.prototype.hasOwnProperty;var ee=(s,b)=>{for(var h in b)P(s,h,{get:b[h],enumerable:!0})},te=(s,b,h,y)=>{if(b&&typeof b=="object"||typeof b=="function")for(let d of X(b))!Z.call(s,d)&&d!==h&&P(s,d,{get:()=>b[d],enumerable:!(y=Q(b,d))||y.enumerable});return s};var ae=s=>te(P({},"__esModule",{value:!0}),s);var ce={};ee(ce,{FormsLib:()=>oe,default:()=>ie});function W(s,b,h){let y=b?.style==="bootstrap",d=document.createElement("div");d.className="voc-form-avatar-wrapper",y&&d.classList.add("d-flex","align-items-center","gap-3");let m=document.createElement("img");m.className="voc-form-avatar-preview",m.alt=s.label||"avatar",y&&(m.classList.add("img-thumbnail","rounded-circle"),m.style.width=m.style.height="64px",m.style.objectFit="cover");let L=h!=null?String(h):s.default!==void 0&&s.default!==null?String(s.default):"";L?m.src=L:(m.src="",m.style.display="none");let c=document.createElement("input");c.type="file",c.accept=s.accept||"image/*",c.className="voc-form-avatar-input",y&&c.classList.add("form-control"),(s.key||s.name)&&(c.name=s.name||s.key,s.key&&(c.id=`voc-form-${s.key}`));let f=document.createElement("input");if(f.type="hidden",(s.key||s.name)&&(f.name=(s.name||s.key)+"_url"),f.value=L||"",c.addEventListener("change",g=>{let u=g.target;if(u.files&&u.files.length>0){let x=u.files[0],N=new FileReader;N.onload=()=>{m.src=String(N.result),m.style.display="",f.value=""},N.readAsDataURL(x)}}),y){let g=document.createElement("div");g.style.flex="1",g.appendChild(c),g.appendChild(f),d.appendChild(m),d.appendChild(g)}else d.appendChild(m),d.appendChild(c),d.appendChild(f);return d}function z(s,b,h){let y=b?.style==="bootstrap",d=document.createElement("div");if(d.className="voc-form-audio-select",!s.options||s.options.length===0)return d;let m=s.name||s.key||`audio_select_${Math.random().toString(36).substr(2,6)}`,L;return Array.isArray(h)?L=h[0]:h!==void 0?L=h:s.default!==void 0&&(L=s.default),s.options.forEach((c,f)=>{let g=document.createElement("div");g.className="voc-form-audio-item",y&&g.classList.add("form-check");let u=document.createElement("input");u.type="radio",u.name=m,u.value=c.value,u.className="voc-form-audio-radio",s.key&&(u.id=`voc-form-${s.key}-${f}`),s.required&&f===0&&(u.required=!0),u.style.position="absolute",u.style.width="1px",u.style.height="1px",u.style.margin="0",u.style.padding="0",u.style.clip="rect(0 0 0 0)",u.style.clipPath="inset(50%)",u.style.overflow="hidden",u.style.border="0",L!==void 0&&(Array.isArray(L)?u.checked=L.includes(c.value):u.checked=String(L)===String(c.value));let x=()=>{u.checked?g.classList.add("selected"):g.classList.remove("selected")};u.addEventListener("change",()=>{d.querySelectorAll(".voc-form-audio-item").forEach(n=>n.classList.remove("selected")),x()}),u.checked&&g.classList.add("selected");let N=document.createElement("label");N.className="voc-form-audio-label",y&&N.classList.add("form-check-label"),N.htmlFor=u.id||"",N.textContent=c.label||c.value,N.tabIndex=0;let e=document.createElement("div");e.className="voc-form-audio-control";let l=null;if(c.audio_link){let t=document.createElement("button");t.type="button",t.className="voc-form-audio-play",y&&t.classList.add("btn","btn-sm","btn-outline-secondary"),t.setAttribute("aria-label",`Play ${c.label||c.value}`);let n="http://www.w3.org/2000/svg",i=document.createElementNS(n,"svg");i.setAttribute("viewBox","0 0 24 24"),i.setAttribute("width","16"),i.setAttribute("height","16"),i.setAttribute("aria-hidden","true");let r=document.createElementNS(n,"path");r.setAttribute("d","M8 5v14l11-7z"),r.setAttribute("fill","currentColor"),i.appendChild(r),t.appendChild(i),l=document.createElement("audio"),l.src=c.audio_link,l.preload="none",l.style.display="none";let o=p=>{for(;p.firstChild;)p.removeChild(p.firstChild)},C=()=>{let p="http://www.w3.org/2000/svg",S=document.createElementNS(p,"svg");S.setAttribute("viewBox","0 0 24 24"),S.setAttribute("width","16"),S.setAttribute("height","16"),S.setAttribute("aria-hidden","true");let A=document.createElementNS(p,"path");return A.setAttribute("d","M8 5v14l11-7z"),A.setAttribute("fill","currentColor"),S.appendChild(A),S},F=()=>{let p="http://www.w3.org/2000/svg",S=document.createElementNS(p,"svg");S.setAttribute("viewBox","0 0 24 24"),S.setAttribute("width","16"),S.setAttribute("height","16"),S.setAttribute("aria-hidden","true");let A=document.createElementNS(p,"rect");return A.setAttribute("x","6"),A.setAttribute("y","6"),A.setAttribute("width","12"),A.setAttribute("height","12"),A.setAttribute("fill","currentColor"),S.appendChild(A),S};o(t),t.appendChild(C());let R=p=>{o(t),p?(t.appendChild(F()),t.setAttribute("aria-label",`Stop ${c.label||c.value}`)):(t.appendChild(C()),t.setAttribute("aria-label",`Play ${c.label||c.value}`))};t.addEventListener("click",()=>{try{if(!l)return;let p=d.querySelectorAll("audio");if(!l.paused&&!l.ended){l.pause(),l.currentTime=0;return}p.forEach(A=>{try{A.pause(),A.currentTime=0}catch{}}),d.querySelectorAll(".voc-form-audio-item").forEach(A=>A.classList.remove("is-playing")),l.play()}catch(p){console.warn("audio play failed",p)}}),l.addEventListener("playing",()=>{g.classList.add("is-playing"),R(!0)});let H=()=>{g.classList.remove("is-playing"),R(!1)};l.addEventListener("pause",H),l.addEventListener("ended",H),e.appendChild(t),e.appendChild(l)}let v=document.createElement("div");v.className="voc-form-item-detail",v.style.display="flex",v.style.flexDirection="column",v.style.gap="4px";let a=document.createElement("div");a.className="voc-form-item-top",a.style.display="flex",a.style.alignItems="center",a.style.gap="8px",a.appendChild(u),a.appendChild(N);let E=document.createElement("div");E.className="voc-form-item-description";let k=c.description||c.hint_text||"";k&&(E.textContent=k),v.appendChild(a),v.appendChild(E),e.appendChild(v),g.appendChild(e),a.addEventListener("click",t=>{let n=t.target;n&&n.closest(".voc-form-audio-play")||(u.checked=!0,u.dispatchEvent(new Event("change",{bubbles:!0})))}),g.addEventListener("click",t=>{let n=t.target;n&&n.closest(".voc-form-audio-play")||(u.checked=!0,u.dispatchEvent(new Event("change",{bubbles:!0})))}),d.appendChild(g)}),d}function G(s,b,h){let y=document.createElement("div");y.className="voc-form-table-wrapper";let d=b?.style==="bootstrap",m=document.createElement("input");m.type="hidden",m.name=s.name||s.key,s.key&&(m.id=`voc-form-${s.key}`),y.appendChild(m);let L=document.createElement("table");L.className="voc-form-table",d&&L.classList.add("table","table-bordered");let c=document.createElement("thead"),f=document.createElement("tr"),g=document.createElement("th");g.className="voc-form-table-drag-col",g.textContent="",f.appendChild(g),(s.fields||[]).forEach(n=>{let i=document.createElement("th");i.textContent=n.label||n.key,f.appendChild(i)});let u=document.createElement("th");u.textContent="Actions",f.appendChild(u),c.appendChild(f),L.appendChild(c);let x=document.createElement("tbody");L.appendChild(x),y.appendChild(L);let N=document.createElement("button");N.type="button",N.className="voc-form-table-add",d&&N.classList.add("btn","btn-secondary"),N.textContent="+Add";let e=document.createElement("tfoot"),l=document.createElement("tr"),v=document.createElement("td");v.colSpan=(s.fields?s.fields.length:0)+1,v.appendChild(N),l.appendChild(v),e.appendChild(l),L.appendChild(e),y.appendChild(L);let a=[];function E(){m.value=JSON.stringify(a)}function k(n){let i=[];return s.fields.forEach(r=>{let o=n[r.key];if(r.type==="checkbox"){let C=Array.isArray(o)?o:o?[o]:[];r.required&&C.length===0&&i.push(`${r.label||r.key} is required`);return}r.required&&(o==null||String(o).trim()==="")&&i.push(`${r.label||r.key} is required`),r.type==="email"&&o&&(/^\S+@\S+\.\S+$/.test(String(o))||i.push(`${r.label||r.key} must be a valid email`)),r.type==="number"&&o&&isNaN(Number(o))&&i.push(`${r.label||r.key} must be a number`),r.validation&&r.validation.regex&&o&&(new RegExp(r.validation.regex).test(String(o))||i.push(`${r.label||r.key} invalid format`))}),i}function t(){x.innerHTML="";let n=(i,r)=>{r.draggable=!0,r.addEventListener("mousedown",()=>{r.style.cursor="grabbing"}),r.addEventListener("mouseup",()=>{r.style.cursor="grab"}),r.addEventListener("dragstart",o=>{let C=Number(i.dataset.rowIndex);o.dataTransfer.setData("text/plain",String(C)),i.classList.add("dragging");try{o.dataTransfer?.setDragImage(r,10,10)}catch{}}),r.addEventListener("dragend",()=>{i.classList.remove("dragging"),r.style.cursor="grab"}),i.addEventListener("dragover",o=>{o.preventDefault();let C=o.currentTarget,F=C.getBoundingClientRect(),R=F.top+F.height/2,H=(o.clientY||o.y)>R;C.classList.remove("drag-over-top","drag-over-bottom"),H?(C.classList.add("drag-over-bottom"),C.dataset.dropPosition="after"):(C.classList.add("drag-over-top"),C.dataset.dropPosition="before")}),i.addEventListener("dragleave",o=>{let C=o.currentTarget;C.classList.remove("drag-over-top","drag-over-bottom"),delete C.dataset.dropPosition}),i.addEventListener("drop",o=>{o.preventDefault();let C=o.dataTransfer.getData("text/plain"),F=Number(o.currentTarget.dataset.rowIndex),R=Number(C),H=o.currentTarget.dataset.dropPosition||"before";if(isNaN(R)||isNaN(F))return;let[p]=a.splice(R,1),S=F;R<F&&(S=F-1);let A=H==="after"?S+1:S;a.splice(A,0,p),o.currentTarget.classList.remove("drag-over-top","drag-over-bottom"),delete o.currentTarget.dataset.dropPosition,t(),E()})};a.forEach((i,r)=>{let o=document.createElement("tr");o.dataset.rowIndex=String(r),o.classList.add("voc-form-table-row");let C=document.createElement("td");C.className="voc-form-table-drag-handle";let F=document.createElement("span");F.className="voc-form-drag-handle-icon",F.textContent="\u2630",F.style.cursor="grab",C.appendChild(F),o.appendChild(C),n(o,F),s.fields.forEach(p=>{let S=document.createElement("td"),A,_=(p.type||"text").toLowerCase();if(_==="select"){let w=document.createElement("select");if(w.className="voc-form-table-cell",d&&w.classList.add("form-control"),p.placeholder){let T=document.createElement("option");T.value="",T.textContent=p.placeholder,T.disabled=!0,(i[p.key]===void 0||i[p.key]===null||i[p.key]==="")&&(T.selected=!0),w.appendChild(T)}(p.options||[]).forEach(T=>{let D=document.createElement("option");D.value=T.value,D.textContent=T.label,w.appendChild(D)}),w.value=i[p.key]!==void 0&&i[p.key]!==null?String(i[p.key]):"",p.required&&(w.required=!0),w.addEventListener("change",T=>{a[r][p.key]=T.target.value,E()}),A=w}else if(_==="checkbox"){let w=document.createElement("div");w.className="voc-form-table-checkboxes",d&&w.classList.add("form-check");let B=p.options||[];Array.isArray(a[r][p.key])||(a[r][p.key]=a[r][p.key]?[a[r][p.key]]:[]),B.forEach(T=>{let D=`voc-form-${s.key}-${p.key}-${r}-${T.value}`,$=document.createElement("div");$.className="voc-form-table-checkbox-item",d&&$.classList.add("form-check");let M=document.createElement("input");M.type="checkbox",M.className="voc-form-table-cell",d&&M.classList.add("form-check-input"),M.id=D,M.value=T.value,M.checked=Array.isArray(a[r][p.key])&&a[r][p.key].includes(T.value),M.addEventListener("change",O=>{let K=O.target.checked;Array.isArray(a[r][p.key])||(a[r][p.key]=[]),K?a[r][p.key].includes(T.value)||a[r][p.key].push(T.value):a[r][p.key]=a[r][p.key].filter(Y=>Y!==T.value),E()});let q=document.createElement("label");q.htmlFor=D,q.className="voc-form-table-checkbox-label",d&&q.classList.add("form-check-label"),q.textContent=T.label,$.appendChild(M),$.appendChild(q),w.appendChild($)}),A=w}else if(_==="radio"){let w=document.createElement("div");w.className="voc-form-table-radios",d&&w.classList.add("form-check");let B=p.options||[];a[r][p.key]===void 0&&(a[r][p.key]=""),B.forEach(T=>{let D=`voc-form-${s.key}-${p.key}-${r}-${T.value}`,$=document.createElement("div");$.className="voc-form-table-radio-item",d&&$.classList.add("form-check");let M=document.createElement("input");M.type="radio",M.className="voc-form-table-cell",d&&M.classList.add("form-check-input"),M.id=D,M.name=`voc-form-${s.key}-${p.key}-${r}`,M.value=T.value,M.checked=a[r][p.key]===T.value,M.addEventListener("change",O=>{O.target.checked&&(a[r][p.key]=O.target.value,E())});let q=document.createElement("label");q.htmlFor=D,q.className="voc-form-table-radio-label",d&&q.classList.add("form-check-label"),q.textContent=T.label,$.appendChild(M),$.appendChild(q),w.appendChild($)}),A=w}else{let w=document.createElement("input");_==="number"?w.type="number":_==="email"?w.type="email":_==="tel"?w.type="tel":_==="url"?w.type="url":_==="date"?w.type="date":w.type="text",w.value=i[p.key]!==void 0&&i[p.key]!==null?String(i[p.key]):"",p.placeholder&&(w.placeholder=p.placeholder),p.required&&(w.required=!0),w.className="voc-form-table-cell",d&&w.classList.add("form-control"),w.addEventListener("input",B=>{a[r][p.key]=B.target.value,E()}),A=w}S.appendChild(A),o.appendChild(S)});let R=document.createElement("td"),H=document.createElement("button");H.type="button",H.className="voc-form-table-remove",d&&H.classList.add("btn","btn-danger"),H.textContent="Remove",H.addEventListener("click",()=>{a.splice(r,1),t(),E()}),R.appendChild(H),o.appendChild(R),x.appendChild(o)})}return N.addEventListener("click",()=>{if(s.validation?.max_rows!==void 0&&a.length>=s.validation.max_rows)return;let n={};s.fields.forEach(i=>n[i.key]=""),a.push(n),t(),E()}),Array.isArray(h)&&h.length?a=h.map(n=>({...n})):s.default&&Array.isArray(s.default)&&(a=s.default.map(n=>({...n}))),t(),E(),y.validate=function(){let n=[];return a.forEach((i,r)=>{let o=k(i);o.length&&n.push(`Row ${r+1}: ${o.join("; ")}`)}),s.validation?.min_rows!==void 0&&a.length<s.validation.min_rows&&n.push(`At least ${s.validation.min_rows} rows required`),s.validation?.max_rows!==void 0&&a.length>s.validation.max_rows&&n.push(`No more than ${s.validation.max_rows} rows allowed`),s.validation?.unique_fields&&s.validation.unique_fields.length&&s.validation.unique_fields.forEach(i=>{let r=new Set;a.forEach((o,C)=>{let F=o[i];F!=null&&(r.has(F)&&n.push(`Field ${i} must be unique (duplicate at row ${C+1})`),r.add(F))})}),n},y}async function ne(s){let h=new TextEncoder().encode(s),y=await crypto.subtle.digest("SHA-256",h);return Array.from(new Uint8Array(y)).map(m=>m.toString(16).padStart(2,"0")).join("")}async function re(s){let b=String(s||"").trim().toLowerCase();return b?`https://gravatar.com/avatar/${await ne(b)}?d=mp`:""}function U(s,b,h){let y=b?.style==="bootstrap",d=document.createElement("div");d.className="voc-form-users";let m=document.createElement("div");if(m.className="voc-form-users-header",y&&m.classList.add("mb-2"),s.label){let e=document.createElement("div");if(e.className="voc-form-users-label",y&&e.classList.add("form-label"),e.textContent=s.label,s.required){let l=document.createElement("span");l.className="voc-form-required",l.textContent="*",e.appendChild(l)}m.appendChild(e)}if(s.description){let e=document.createElement("div");e.className="voc-form-users-description",y&&e.classList.add("form-text"),e.textContent=s.description,m.appendChild(e)}d.appendChild(m);let L=document.createElement("div");L.className="voc-form-users-search-wrapper";let c=document.createElement("input");if(c.type="search",c.placeholder="Search users...",c.className="voc-form-users-search",y&&c.classList.add("form-control","mb-2"),L.appendChild(c),d.appendChild(L),!s.options||s.options.length===0)return d;let f=document.createElement("div");f.className="voc-form-users-list",y&&f.classList.add("list-group");let g=s.name||s.key||`users_${Math.random().toString(36).substr(2,6)}`,u=[];Array.isArray(h)?u=h:h!=null?u=[h]:Array.isArray(s.default)&&(u=s.default),s.options.forEach((e,l)=>{let v=document.createElement("div");v.className="voc-form-user-item",v.dataset.label=String(e.label||"").toLowerCase(),v.dataset.email=String(e.email||"").toLowerCase(),v.dataset.value=String(e.value||"").toLowerCase(),y&&v.classList.add("d-flex","align-items-center","gap-2");let a=document.createElement("input");a.type="checkbox",a.name=`${g}[]`,a.value=e.value,a.className="voc-form-user-checkbox",s.key&&(a.id=`voc-form-${s.key}-${l}`),s.required&&l===0&&(a.required=!0),a.style.position="absolute",a.style.width="1px",a.style.height="1px",a.style.margin="0",a.style.padding="0",a.style.clip="rect(0 0 0 0)",a.style.clipPath="inset(50%)",a.style.overflow="hidden",a.style.border="0",u&&Array.isArray(u)&&(a.checked=u.includes(e.value));let E=document.createElement("img");E.className="voc-form-user-avatar",E.alt=e.label||String(e.value||"user"),E.style.width=E.style.height="40px",E.style.objectFit="cover",E.style.borderRadius="50%",E.src="",e.email&&re(e.email).then(i=>{i&&(E.src=i)}).catch(()=>{});let k=document.createElement("div");k.className="voc-form-user-info",k.style.display="flex",k.style.flexDirection="column",k.style.gap="2px";let t=document.createElement("div");t.className="voc-form-user-label",t.textContent=e.label||String(e.value);let n=document.createElement("small");n.className="voc-form-user-email",n.textContent=e.email||"",k.appendChild(t),k.appendChild(n),v.addEventListener("click",i=>{let r=i.target;r&&(r.closest("input")||r.closest("a")||r.closest("button"))||(a.checked=!a.checked,a.dispatchEvent(new Event("change",{bubbles:!0})))}),a.addEventListener("change",()=>{a.checked?v.classList.add("selected"):v.classList.remove("selected")}),a.checked&&v.classList.add("selected"),v.appendChild(a),v.appendChild(E),v.appendChild(k),f.appendChild(v)}),d.appendChild(f);let x=Array.from(f.querySelectorAll(".voc-form-user-item")),N=()=>{let e=String(c.value||"").trim().toLowerCase();if(!e){x.forEach(l=>l.style.setProperty("display","flex","important"));return}x.forEach(l=>{let v=l.dataset.label||"",a=l.dataset.email||"",E=l.dataset.value||"",k=v.includes(e)||a.includes(e)||E.includes(e);l.style.setProperty("display",k?"flex":"none","important")})};return c.addEventListener("input",N),d}function I(s,b=!0){let h=new FormData(s);if(b)return se(h);let y={};return h.forEach((d,m)=>{let L=(d instanceof File,d);Object.prototype.hasOwnProperty.call(y,m)?Array.isArray(y[m])?y[m].push(L):y[m]=[y[m],L]:y[m]=L}),y}function se(s){let b=new FormData;for(let[h,y]of s.entries()){if(y instanceof File){b.append(h,y);continue}let d;try{d=JSON.parse(y)}catch{d=null}Array.isArray(d)?d.length===0?b.append(h,"[]"):d.every(m=>typeof m=="object"&&m!==null)?d.forEach((m,L)=>{for(let[c,f]of Object.entries(m))b.append(`${h}[${L}][${c}]`,f)}):b.append(h,y):b.append(h,y)}return b}async function J(s,b,h){let y=b.url,d={"Content-Type":"application/json"};b?.api_token&&(d.Authorization=`Bearer ${b.api_token}`);let m=I(s);if(b?.additional_data)for(let[f,g]of Object.entries(b.additional_data))m.append(f,g);let L,c=m instanceof FormData;L={method:"POST",headers:{Authorization:`Bearer ${b.api_token}`,...c?{}:{"Content-Type":"application/json"},Accept:"application/json"},body:c?m:JSON.stringify(Object.fromEntries(m.entries()))};try{fetch(y,L).then(async f=>{let g=f.headers.get("content-type");if(!f.ok)try{let x=(await f.json())?.message;throw new Error(x??"Their was an error submitting the form. Check your form and try again.")}catch(u){throw new Error(u.message)}return g&&g.includes("application/json")?f.json():f.text()}).then(f=>{h&&h(f,null)}).catch(f=>{h&&h(null,f)})}catch(f){h&&h(null,f)}}function V(s,b,h){let y=[];if(typeof s=="string"?y=Array.from(document.querySelectorAll(s)):y=[s],y.length===0)return null;function d(){let c=h?.style==="bootstrap",f=document.createElement("form");f.classList.add("voc-form"),c&&f.classList.add("needs-validation"),f.id=b.id;let g=document.createElement("h2");g.className="voc-form-title",c&&g.classList.add("mb-3"),g.textContent=b.form_name,f.appendChild(g);function u(e,l){l&&(l.min_length!==void 0&&(e.minLength=l.min_length),l.max_length!==void 0&&(e.maxLength=l.max_length),l.regex&&(e instanceof HTMLInputElement?e.pattern=l.regex:e.dataset.pattern=l.regex))}function x(e){if(!e.key&&!e.label)return null;let l=b.default_values||{},v=e.name||e.key,a=v?l[v]:void 0,E=document.createElement("div");if(E.className="voc-form-group",c&&E.classList.add("mb-3"),e.label&&e.type!=="users"){let t=document.createElement("label");if(t.classList.add("voc-form-label"),c&&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 k=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,i)=>{let r=document.createElement("label");r.classList.add("voc-form-checkbox-label"),c&&r.classList.add("form-check"),r.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(r.style.width=e.width);let o=document.createElement("input");o.type="checkbox",o.classList.add("voc-form-checkbox"),c&&o.classList.add("form-check-input"),o.name=e.name||e.key||"",o.value=n.value,e.key&&(o.id=`voc-form-${e.key}-${i}`),e.required&&(o.required=!0),Array.isArray(a)?a.includes(n.value)&&(o.checked=!0):a!==void 0?a===n.value&&(o.checked=!0):e.default===n.value&&(o.checked=!0),r.appendChild(o),r.appendChild(document.createTextNode(n.label)),t.appendChild(r)});else{let n=document.createElement("label");n.classList.add("voc-form-checkbox-label"),c&&n.classList.add("form-check"),e.width&&(n.style.width=e.width);let i=document.createElement("input");i.type="checkbox",i.classList.add("voc-form-checkbox"),(e.key||e.name)&&(i.name=e.name||e.key,e.key&&(i.id=`voc-form-${e.key}`)),c&&i.classList.add("form-check-input"),e.required&&(i.required=!0),a!==void 0?i.checked=!!a:e.default&&(i.checked=!!e.default),n.appendChild(i),n.appendChild(document.createTextNode(e.label||"")),t.appendChild(n)}k=t;break}case"textarea":{let t=document.createElement("textarea");t.classList.add("voc-form-textarea"),c&&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),a!=null?t.value=String(a):e.default!==void 0&&e.default!==null&&(t.value=String(e.default));let n=e.default||a||"";if(n){let i=(n.match(/\n/g)||[]).length,r=80,o=n.split(`
2
+ `).reduce((R,H)=>Math.max(R,H.length),0),C=Math.ceil(o/r)||1,F=Math.max(2,i+C);t.rows=F,t.style.resize="vertical"}e.width&&(t.style.width=e.width),e.required&&(t.required=!0),u(t,e.validation),k=t;break}case"select":{let t=document.createElement("select");if(t.classList.add("voc-form-select"),c&&t.classList.add("form-select"),c&&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 i=document.createElement("option");i.value=n.value,i.textContent=n.label,Array.isArray(a)?a.includes(n.value)&&(i.selected=!0):a!==void 0?a===n.value&&(i.selected=!0):e.default===n.value&&(i.selected=!0),t.appendChild(i)}),e.width&&(t.style.width=e.width),k=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,i)=>{let r=document.createElement("label");r.classList.add("voc-form-radio-label"),c&&r.classList.add("form-check"),r.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(r.style.width=e.width);let o=document.createElement("input");o.type="radio",o.classList.add("voc-form-radio"),c&&o.classList.add("form-check-input"),o.name=e.name||e.key||"",o.value=n.value,e.key&&(o.id=`voc-form-${e.key}-${i}`),Array.isArray(a)?a.includes(n.value)&&(o.checked=!0):a!==void 0?a===n.value&&(o.checked=!0):e.default===n.value&&(o.checked=!0),r.appendChild(o),r.appendChild(document.createTextNode(n.label)),t.appendChild(r)}),k=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"),c&&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),k=t;break}case"avatar":{k=W(e,h||{},a);break}case"table":{k=G(e,h||{},a);break}case"users":{k=U(e,h||{},a);break}case"audio_select":{k=z(e,h||{},a);break}default:{let t=document.createElement("input");t.type=e.type||"text",t.classList.add("voc-form-input"),c&&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),a!=null?t.value=String(a):e.default!==void 0&&e.default!==null&&(t.value=String(e.default)),e.width&&(t.style.width=e.width),e.required&&(t.required=!0),u(t,e.validation),k=t;break}}if(k&&E.appendChild(k),e.hint_text){let t=document.createElement("small");t.className="voc-form-hint",t.textContent=e.hint_text,E.appendChild(t)}return E}b.fields.forEach(e=>{if(e.type==="group"&&"items"in e){let l=e;if(c){let v=document.createElement("div");v.className="card voc-form-group-card mb-3";let a=l.label||l.header?.title,E=l.description||l.header?.description;if(a||E){let t=document.createElement("div");if(t.className="card-header voc-form-group-head",a){let n=document.createElement("h5");n.className="mb-0 voc-form-group-label",n.textContent=a,t.appendChild(n)}if(E){let n=document.createElement("p");n.className="mb-0 voc-form-group-description",n.textContent=E,t.appendChild(n)}v.appendChild(t)}let k=document.createElement("div");k.className="card-body voc-form-group-body",l.items.forEach(t=>{if(t.type==="row"&&"items"in t){let n=t,i=document.createElement("div");if(i.className="voc-form-group voc-form-row mb-3",n.label){let o=document.createElement("h6");o.className="voc-form-row-label",o.textContent=n.label,i.appendChild(o)}let r=document.createElement("div");r.className="voc-form-row-items "+(n.direction||"horizontal"),n.items.forEach(o=>{let C=x(o);C&&r.appendChild(C)}),i.appendChild(r),k.appendChild(i)}else{let n=x(t);n&&k.appendChild(n)}}),v.appendChild(k),f.appendChild(v)}else{let v=document.createElement("div");v.className="voc-form-group voc-form-group-wrapper",c&&v.classList.add("mb-3");let a=l.label||l.header?.title,E=l.description||l.header?.description;if(a||E){let k=document.createElement("div");if(k.className="voc-form-group-head",a){let t=document.createElement("h3");t.className="voc-form-group-label",t.textContent=a,k.appendChild(t)}if(E){let t=document.createElement("p");t.className="voc-form-group-description",t.textContent=E,k.appendChild(t)}v.appendChild(k)}l.items.forEach(k=>{if(k.type==="row"&&"items"in k){let t=k,n=document.createElement("div");if(n.className="voc-form-group voc-form-row",c&&n.classList.add("mb-3"),t.label){let r=document.createElement("h4");r.className="voc-form-row-label",r.textContent=t.label,n.appendChild(r)}let i=document.createElement("div");i.className="voc-form-row-items "+(t.direction||"horizontal"),t.items.forEach(r=>{let o=x(r);o&&i.appendChild(o)}),n.appendChild(i),v.appendChild(n)}else{let t=x(k);t&&v.appendChild(t)}}),f.appendChild(v)}return}if(e.type==="row"&&"items"in e){let l=document.createElement("div");if(l.className="voc-form-group voc-form-row",c&&l.classList.add("mb-3"),e.label){let a=document.createElement("h3");a.className="voc-form-row-label",a.textContent=e.label,l.appendChild(a)}if(e.description){let a=document.createElement("p");a.className="voc-form-row-description",a.textContent=e.description,l.appendChild(a)}let v=document.createElement("div");v.className="voc-form-row-items "+(e.direction||"horizontal"),l.appendChild(v),e.items.forEach(a=>{let E=x(a);E&&v.appendChild(E)}),f.appendChild(l)}else{let l=x(e);l&&f.appendChild(l)}});let N=document.createElement("button");return N.type="submit",N.className="voc-form-submit",N.textContent="Submit",c&&N.classList.add("btn","btn-primary"),f.appendChild(N),f}let m=d();y[0].appendChild(m);let L=b?.submit_config??h?.submit_config??null;return L&&m.addEventListener("submit",c=>{if(c.preventDefault(),!m.checkValidity()){m.reportValidity(),h?.onSubmitResult&&h.onSubmitResult(null,new Error("Form validation failed"));return}let f=Array.from(m.querySelectorAll(" .voc-form-table-wrapper, .voc-form-table-wrapper")),g=[];if(f.forEach(u=>{if(u&&typeof u.validate=="function"){let x=u.validate();x&&x.length&&g.push(...x)}}),g.length){h?.onSubmitResult&&h.onSubmitResult(null,new Error(g.join("; ")));let u=f[0];u&&u.scrollIntoView({behavior:"smooth",block:"center"});return}if(h?.onSubmit){let u=I(m);h.onSubmit(u)}J(m,L,(u,x)=>{h?.onSubmitResult&&h.onSubmitResult(u,x)})}),{element:m,validate:()=>{let c=[];return m.querySelectorAll(":invalid").forEach(g=>{let u=g.validationMessage;c.push({element:g,message:u})}),c},getValues:()=>I(m),onSubmit:c=>{m.addEventListener("submit",f=>{f.preventDefault();let g=I(m);c(g,f)})}}}var j={renderForm:V};var oe=j,ie={FormsLib:j};return ae(ce);})();
package/dist/main.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";var j=Object.defineProperty;var Y=Object.getOwnPropertyDescriptor;var Q=Object.getOwnPropertyNames;var X=Object.prototype.hasOwnProperty;var Z=(s,b)=>{for(var f in b)j(s,f,{get:b[f],enumerable:!0})},ee=(s,b,f,y)=>{if(b&&typeof b=="object"||typeof b=="function")for(let m of Q(b))!X.call(s,m)&&m!==f&&j(s,m,{get:()=>b[m],enumerable:!(y=Y(b,m))||y.enumerable});return s};var te=s=>ee(j({},"__esModule",{value:!0}),s);var oe={};Z(oe,{FormsLib:()=>ne,default:()=>re});module.exports=te(oe);function W(s,b,f){let y=b?.style==="bootstrap",m=document.createElement("div");m.className="voc-form-avatar-wrapper",y&&m.classList.add("d-flex","align-items-center","gap-3");let u=document.createElement("img");u.className="voc-form-avatar-preview",u.alt=s.label||"avatar",y&&(u.classList.add("img-thumbnail","rounded-circle"),u.style.width=u.style.height="64px",u.style.objectFit="cover");let E=f!=null?String(f):s.default!==void 0&&s.default!==null?String(s.default):"";E?u.src=E:(u.src="",u.style.display="none");let c=document.createElement("input");c.type="file",c.accept=s.accept||"image/*",c.className="voc-form-avatar-input",y&&c.classList.add("form-control"),(s.key||s.name)&&(c.name=s.name||s.key,s.key&&(c.id=`voc-form-${s.key}`));let h=document.createElement("input");if(h.type="hidden",(s.key||s.name)&&(h.name=(s.name||s.key)+"_url"),h.value=E||"",c.addEventListener("change",v=>{let d=v.target;if(d.files&&d.files.length>0){let N=d.files[0],x=new FileReader;x.onload=()=>{u.src=String(x.result),u.style.display="",h.value=""},x.readAsDataURL(N)}}),y){let v=document.createElement("div");v.style.flex="1",v.appendChild(c),v.appendChild(h),m.appendChild(u),m.appendChild(v)}else m.appendChild(u),m.appendChild(c),m.appendChild(h);return m}function z(s,b,f){let y=b?.style==="bootstrap",m=document.createElement("div");if(m.className="voc-form-audio-select",!s.options||s.options.length===0)return m;let u=s.name||s.key||`audio_select_${Math.random().toString(36).substr(2,6)}`,E;return Array.isArray(f)?E=f[0]:f!==void 0?E=f:s.default!==void 0&&(E=s.default),s.options.forEach((c,h)=>{let v=document.createElement("div");v.className="voc-form-audio-item",y&&v.classList.add("form-check");let d=document.createElement("input");d.type="radio",d.name=u,d.value=c.value,d.className="voc-form-audio-radio",s.key&&(d.id=`voc-form-${s.key}-${h}`),s.required&&h===0&&(d.required=!0),d.style.position="absolute",d.style.width="1px",d.style.height="1px",d.style.margin="0",d.style.padding="0",d.style.clip="rect(0 0 0 0)",d.style.clipPath="inset(50%)",d.style.overflow="hidden",d.style.border="0",E!==void 0&&(Array.isArray(E)?d.checked=E.includes(c.value):d.checked=String(E)===String(c.value));let N=()=>{d.checked?v.classList.add("selected"):v.classList.remove("selected")};d.addEventListener("change",()=>{m.querySelectorAll(".voc-form-audio-item").forEach(a=>a.classList.remove("selected")),N()}),d.checked&&v.classList.add("selected");let x=document.createElement("label");x.className="voc-form-audio-label",y&&x.classList.add("form-check-label"),x.htmlFor=d.id||"",x.textContent=c.label||c.value,x.tabIndex=0;let e=document.createElement("div");e.className="voc-form-audio-control";let p=null;if(c.audio_link){let t=document.createElement("button");t.type="button",t.className="voc-form-audio-play",y&&t.classList.add("btn","btn-sm","btn-outline-secondary"),t.setAttribute("aria-label",`Play ${c.label||c.value}`);let a="http://www.w3.org/2000/svg",i=document.createElementNS(a,"svg");i.setAttribute("viewBox","0 0 24 24"),i.setAttribute("width","16"),i.setAttribute("height","16"),i.setAttribute("aria-hidden","true");let n=document.createElementNS(a,"path");n.setAttribute("d","M8 5v14l11-7z"),n.setAttribute("fill","currentColor"),i.appendChild(n),t.appendChild(i),p=document.createElement("audio"),p.src=c.audio_link,p.preload="none",p.style.display="none";let o=l=>{for(;l.firstChild;)l.removeChild(l.firstChild)},w=()=>{let l="http://www.w3.org/2000/svg",S=document.createElementNS(l,"svg");S.setAttribute("viewBox","0 0 24 24"),S.setAttribute("width","16"),S.setAttribute("height","16"),S.setAttribute("aria-hidden","true");let T=document.createElementNS(l,"path");return T.setAttribute("d","M8 5v14l11-7z"),T.setAttribute("fill","currentColor"),S.appendChild(T),S},A=()=>{let l="http://www.w3.org/2000/svg",S=document.createElementNS(l,"svg");S.setAttribute("viewBox","0 0 24 24"),S.setAttribute("width","16"),S.setAttribute("height","16"),S.setAttribute("aria-hidden","true");let T=document.createElementNS(l,"rect");return T.setAttribute("x","6"),T.setAttribute("y","6"),T.setAttribute("width","12"),T.setAttribute("height","12"),T.setAttribute("fill","currentColor"),S.appendChild(T),S};o(t),t.appendChild(w());let H=l=>{o(t),l?(t.appendChild(A()),t.setAttribute("aria-label",`Stop ${c.label||c.value}`)):(t.appendChild(w()),t.setAttribute("aria-label",`Play ${c.label||c.value}`))};t.addEventListener("click",()=>{try{if(!p)return;let l=m.querySelectorAll("audio");if(!p.paused&&!p.ended){p.pause(),p.currentTime=0;return}l.forEach(T=>{try{T.pause(),T.currentTime=0}catch{}}),m.querySelectorAll(".voc-form-audio-item").forEach(T=>T.classList.remove("is-playing")),p.play()}catch(l){console.warn("audio play failed",l)}}),p.addEventListener("playing",()=>{v.classList.add("is-playing"),H(!0)});let R=()=>{v.classList.remove("is-playing"),H(!1)};p.addEventListener("pause",R),p.addEventListener("ended",R),e.appendChild(t),e.appendChild(p)}let L=document.createElement("div");L.className="voc-form-item-detail",L.style.display="flex",L.style.flexDirection="column",L.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(d),r.appendChild(x);let C=document.createElement("div");C.className="voc-form-item-description";let k=c.description||c.hint_text||"";k&&(C.textContent=k),L.appendChild(r),L.appendChild(C),e.appendChild(L),v.appendChild(e),r.addEventListener("click",t=>{let a=t.target;a&&a.closest(".voc-form-audio-play")||(d.checked=!0,d.dispatchEvent(new Event("change",{bubbles:!0})))}),v.addEventListener("click",t=>{let a=t.target;a&&a.closest(".voc-form-audio-play")||(d.checked=!0,d.dispatchEvent(new Event("change",{bubbles:!0})))}),m.appendChild(v)}),m}function V(s,b,f){let y=document.createElement("div");y.className="voc-form-table-wrapper";let m=b?.style==="bootstrap",u=document.createElement("input");u.type="hidden",u.name=s.name||s.key,s.key&&(u.id=`voc-form-${s.key}`),y.appendChild(u);let E=document.createElement("table");E.className="voc-form-table",m&&E.classList.add("table","table-bordered");let c=document.createElement("thead"),h=document.createElement("tr"),v=document.createElement("th");v.className="voc-form-table-drag-col",v.textContent="",h.appendChild(v),(s.fields||[]).forEach(a=>{let i=document.createElement("th");i.textContent=a.label||a.key,h.appendChild(i)});let d=document.createElement("th");d.textContent="Actions",h.appendChild(d),c.appendChild(h),E.appendChild(c);let N=document.createElement("tbody");E.appendChild(N),y.appendChild(E);let x=document.createElement("button");x.type="button",x.className="voc-form-table-add",m&&x.classList.add("btn","btn-secondary"),x.textContent="+Add";let e=document.createElement("tfoot"),p=document.createElement("tr"),L=document.createElement("td");L.colSpan=(s.fields?s.fields.length:0)+1,L.appendChild(x),p.appendChild(L),e.appendChild(p),E.appendChild(e),y.appendChild(E);let r=[];function C(){u.value=JSON.stringify(r)}function k(a){let i=[];return s.fields.forEach(n=>{let o=a[n.key];if(n.type==="checkbox"){let w=Array.isArray(o)?o:o?[o]:[];n.required&&w.length===0&&i.push(`${n.label||n.key} is required`);return}n.required&&(o==null||String(o).trim()==="")&&i.push(`${n.label||n.key} is required`),n.type==="email"&&o&&(/^\S+@\S+\.\S+$/.test(String(o))||i.push(`${n.label||n.key} must be a valid email`)),n.type==="number"&&o&&isNaN(Number(o))&&i.push(`${n.label||n.key} must be a number`),n.validation&&n.validation.regex&&o&&(new RegExp(n.validation.regex).test(String(o))||i.push(`${n.label||n.key} invalid format`))}),i}function t(){N.innerHTML="";let a=(i,n)=>{n.draggable=!0,n.addEventListener("mousedown",()=>{n.style.cursor="grabbing"}),n.addEventListener("mouseup",()=>{n.style.cursor="grab"}),n.addEventListener("dragstart",o=>{let w=Number(i.dataset.rowIndex);o.dataTransfer.setData("text/plain",String(w)),i.classList.add("dragging");try{o.dataTransfer?.setDragImage(n,10,10)}catch{}}),n.addEventListener("dragend",()=>{i.classList.remove("dragging"),n.style.cursor="grab"}),i.addEventListener("dragover",o=>{o.preventDefault();let w=o.currentTarget,A=w.getBoundingClientRect(),H=A.top+A.height/2,R=(o.clientY||o.y)>H;w.classList.remove("drag-over-top","drag-over-bottom"),R?(w.classList.add("drag-over-bottom"),w.dataset.dropPosition="after"):(w.classList.add("drag-over-top"),w.dataset.dropPosition="before")}),i.addEventListener("dragleave",o=>{let w=o.currentTarget;w.classList.remove("drag-over-top","drag-over-bottom"),delete w.dataset.dropPosition}),i.addEventListener("drop",o=>{o.preventDefault();let w=o.dataTransfer.getData("text/plain"),A=Number(o.currentTarget.dataset.rowIndex),H=Number(w),R=o.currentTarget.dataset.dropPosition||"before";if(isNaN(H)||isNaN(A))return;let[l]=r.splice(H,1),S=A;H<A&&(S=A-1);let T=R==="after"?S+1:S;r.splice(T,0,l),o.currentTarget.classList.remove("drag-over-top","drag-over-bottom"),delete o.currentTarget.dataset.dropPosition,t(),C()})};r.forEach((i,n)=>{let o=document.createElement("tr");o.dataset.rowIndex=String(n),o.classList.add("voc-form-table-row");let w=document.createElement("td");w.className="voc-form-table-drag-handle";let A=document.createElement("span");A.className="voc-form-drag-handle-icon",A.textContent="\u2630",A.style.cursor="grab",w.appendChild(A),o.appendChild(w),a(o,A),s.fields.forEach(l=>{let S=document.createElement("td"),T,q=(l.type||"text").toLowerCase();if(q==="select"){let g=document.createElement("select");if(g.className="voc-form-table-cell",m&&g.classList.add("form-control"),l.placeholder){let F=document.createElement("option");F.value="",F.textContent=l.placeholder,F.disabled=!0,(i[l.key]===void 0||i[l.key]===null||i[l.key]==="")&&(F.selected=!0),g.appendChild(F)}(l.options||[]).forEach(F=>{let D=document.createElement("option");D.value=F.value,D.textContent=F.label,g.appendChild(D)}),g.value=i[l.key]!==void 0&&i[l.key]!==null?String(i[l.key]):"",l.required&&(g.required=!0),g.addEventListener("change",F=>{r[n][l.key]=F.target.value,C()}),T=g}else if(q==="checkbox"){let g=document.createElement("div");g.className="voc-form-table-checkboxes",m&&g.classList.add("form-check");let B=l.options||[];Array.isArray(r[n][l.key])||(r[n][l.key]=r[n][l.key]?[r[n][l.key]]:[]),B.forEach(F=>{let D=`voc-form-${s.key}-${l.key}-${n}-${F.value}`,$=document.createElement("div");$.className="voc-form-table-checkbox-item",m&&$.classList.add("form-check");let M=document.createElement("input");M.type="checkbox",M.className="voc-form-table-cell",m&&M.classList.add("form-check-input"),M.id=D,M.value=F.value,M.checked=Array.isArray(r[n][l.key])&&r[n][l.key].includes(F.value),M.addEventListener("change",O=>{let U=O.target.checked;Array.isArray(r[n][l.key])||(r[n][l.key]=[]),U?r[n][l.key].includes(F.value)||r[n][l.key].push(F.value):r[n][l.key]=r[n][l.key].filter(K=>K!==F.value),C()});let _=document.createElement("label");_.htmlFor=D,_.className="voc-form-table-checkbox-label",m&&_.classList.add("form-check-label"),_.textContent=F.label,$.appendChild(M),$.appendChild(_),g.appendChild($)}),T=g}else if(q==="radio"){let g=document.createElement("div");g.className="voc-form-table-radios",m&&g.classList.add("form-check");let B=l.options||[];r[n][l.key]===void 0&&(r[n][l.key]=""),B.forEach(F=>{let D=`voc-form-${s.key}-${l.key}-${n}-${F.value}`,$=document.createElement("div");$.className="voc-form-table-radio-item",m&&$.classList.add("form-check");let M=document.createElement("input");M.type="radio",M.className="voc-form-table-cell",m&&M.classList.add("form-check-input"),M.id=D,M.name=`voc-form-${s.key}-${l.key}-${n}`,M.value=F.value,M.checked=r[n][l.key]===F.value,M.addEventListener("change",O=>{O.target.checked&&(r[n][l.key]=O.target.value,C())});let _=document.createElement("label");_.htmlFor=D,_.className="voc-form-table-radio-label",m&&_.classList.add("form-check-label"),_.textContent=F.label,$.appendChild(M),$.appendChild(_),g.appendChild($)}),T=g}else{let g=document.createElement("input");q==="number"?g.type="number":q==="email"?g.type="email":q==="tel"?g.type="tel":q==="url"?g.type="url":q==="date"?g.type="date":g.type="text",g.value=i[l.key]!==void 0&&i[l.key]!==null?String(i[l.key]):"",l.placeholder&&(g.placeholder=l.placeholder),l.required&&(g.required=!0),g.className="voc-form-table-cell",m&&g.classList.add("form-control"),g.addEventListener("input",B=>{r[n][l.key]=B.target.value,C()}),T=g}S.appendChild(T),o.appendChild(S)});let H=document.createElement("td"),R=document.createElement("button");R.type="button",R.className="voc-form-table-remove",m&&R.classList.add("btn","btn-danger"),R.textContent="Remove",R.addEventListener("click",()=>{r.splice(n,1),t(),C()}),H.appendChild(R),o.appendChild(H),N.appendChild(o)})}return x.addEventListener("click",()=>{if(s.validation?.max_rows!==void 0&&r.length>=s.validation.max_rows)return;let a={};s.fields.forEach(i=>a[i.key]=""),r.push(a),t(),C()}),Array.isArray(f)&&f.length?r=f.map(a=>({...a})):s.default&&Array.isArray(s.default)&&(r=s.default.map(a=>({...a}))),t(),C(),y.validate=function(){let a=[];return r.forEach((i,n)=>{let o=k(i);o.length&&a.push(`Row ${n+1}: ${o.join("; ")}`)}),s.validation?.min_rows!==void 0&&r.length<s.validation.min_rows&&a.push(`At least ${s.validation.min_rows} rows required`),s.validation?.max_rows!==void 0&&r.length>s.validation.max_rows&&a.push(`No more than ${s.validation.max_rows} rows allowed`),s.validation?.unique_fields&&s.validation.unique_fields.length&&s.validation.unique_fields.forEach(i=>{let n=new Set;r.forEach((o,w)=>{let A=o[i];A!=null&&(n.has(A)&&a.push(`Field ${i} must be unique (duplicate at row ${w+1})`),n.add(A))})}),a},y}function I(s,b=!0){let f=new FormData(s);if(b)return ae(f);let y={};return f.forEach((m,u)=>{let E=(m instanceof File,m);Object.prototype.hasOwnProperty.call(y,u)?Array.isArray(y[u])?y[u].push(E):y[u]=[y[u],E]:y[u]=E}),y}function ae(s){let b=new FormData;for(let[f,y]of s.entries()){if(y instanceof File){b.append(f,y);continue}let m;try{m=JSON.parse(y)}catch{m=null}Array.isArray(m)?m.length===0?b.append(f,"[]"):m.every(u=>typeof u=="object"&&u!==null)?m.forEach((u,E)=>{for(let[c,h]of Object.entries(u))b.append(`${f}[${E}][${c}]`,h)}):b.append(f,y):b.append(f,y)}return b}async function G(s,b,f){let y=b.url,m={"Content-Type":"application/json"};b?.api_token&&(m.Authorization=`Bearer ${b.api_token}`);let u=I(s);if(b?.additional_data)for(let[h,v]of Object.entries(b.additional_data))u.append(h,v);let E,c=u instanceof FormData;E={method:"POST",headers:{Authorization:`Bearer ${b.api_token}`,...c?{}:{"Content-Type":"application/json"},Accept:"application/json"},body:c?u:JSON.stringify(Object.fromEntries(u.entries()))};try{fetch(y,E).then(async h=>{let v=h.headers.get("content-type");if(!h.ok)try{let N=(await h.json())?.message;throw new Error(N??"Their was an error submitting the form. Check your form and try again.")}catch(d){throw new Error(d.message)}return v&&v.includes("application/json")?h.json():h.text()}).then(h=>{f&&f(h,null)}).catch(h=>{f&&f(null,h)})}catch(h){f&&f(null,h)}}function J(s,b,f){let y=[];if(typeof s=="string"?y=Array.from(document.querySelectorAll(s)):y=[s],y.length===0)return null;function m(){let c=f?.style==="bootstrap",h=document.createElement("form");h.classList.add("voc-form"),c&&h.classList.add("needs-validation"),h.id=b.id;let v=document.createElement("h2");v.className="voc-form-title",c&&v.classList.add("mb-3"),v.textContent=b.form_name,h.appendChild(v);function d(e,p){p&&(p.min_length!==void 0&&(e.minLength=p.min_length),p.max_length!==void 0&&(e.maxLength=p.max_length),p.regex&&(e instanceof HTMLInputElement?e.pattern=p.regex:e.dataset.pattern=p.regex))}function N(e){if(!e.key&&!e.label)return null;let p=b.default_values||{},L=e.name||e.key,r=L?p[L]:void 0,C=document.createElement("div");if(C.className="voc-form-group",c&&C.classList.add("mb-3"),e.label){let t=document.createElement("label");if(t.classList.add("voc-form-label"),c&&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 a=document.createElement("span");a.className="voc-form-required",a.textContent="*",t.appendChild(a)}C.appendChild(t)}let k=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((a,i)=>{let n=document.createElement("label");n.classList.add("voc-form-checkbox-label"),c&&n.classList.add("form-check"),n.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(n.style.width=e.width);let o=document.createElement("input");o.type="checkbox",o.classList.add("voc-form-checkbox"),c&&o.classList.add("form-check-input"),o.name=e.name||e.key||"",o.value=a.value,e.key&&(o.id=`voc-form-${e.key}-${i}`),e.required&&(o.required=!0),Array.isArray(r)?r.includes(a.value)&&(o.checked=!0):r!==void 0?r===a.value&&(o.checked=!0):e.default===a.value&&(o.checked=!0),n.appendChild(o),n.appendChild(document.createTextNode(a.label)),t.appendChild(n)});else{let a=document.createElement("label");a.classList.add("voc-form-checkbox-label"),c&&a.classList.add("form-check"),e.width&&(a.style.width=e.width);let i=document.createElement("input");i.type="checkbox",i.classList.add("voc-form-checkbox"),(e.key||e.name)&&(i.name=e.name||e.key,e.key&&(i.id=`voc-form-${e.key}`)),c&&i.classList.add("form-check-input"),e.required&&(i.required=!0),r!==void 0?i.checked=!!r:e.default&&(i.checked=!!e.default),a.appendChild(i),a.appendChild(document.createTextNode(e.label||"")),t.appendChild(a)}k=t;break}case"textarea":{let t=document.createElement("textarea");t.classList.add("voc-form-textarea"),c&&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 a=e.default||r||"";if(a){let i=(a.match(/\n/g)||[]).length,n=80,o=a.split(`
2
- `).reduce((H,R)=>Math.max(H,R.length),0),w=Math.ceil(o/n)||1,A=Math.max(2,i+w);t.rows=A,t.style.resize="vertical"}e.width&&(t.style.width=e.width),e.required&&(t.required=!0),d(t,e.validation),k=t;break}case"select":{let t=document.createElement("select");if(t.classList.add("voc-form-select"),c&&t.classList.add("form-select"),c&&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 a=document.createElement("option");a.value="",a.textContent=e.placeholder,a.disabled=!0,a.selected=!0,t.appendChild(a)}e.required&&(t.required=!0),e.options&&e.options.forEach(a=>{let i=document.createElement("option");i.value=a.value,i.textContent=a.label,Array.isArray(r)?r.includes(a.value)&&(i.selected=!0):r!==void 0?r===a.value&&(i.selected=!0):e.default===a.value&&(i.selected=!0),t.appendChild(i)}),e.width&&(t.style.width=e.width),k=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((a,i)=>{let n=document.createElement("label");n.classList.add("voc-form-radio-label"),c&&n.classList.add("form-check"),n.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(n.style.width=e.width);let o=document.createElement("input");o.type="radio",o.classList.add("voc-form-radio"),c&&o.classList.add("form-check-input"),o.name=e.name||e.key||"",o.value=a.value,e.key&&(o.id=`voc-form-${e.key}-${i}`),Array.isArray(r)?r.includes(a.value)&&(o.checked=!0):r!==void 0?r===a.value&&(o.checked=!0):e.default===a.value&&(o.checked=!0),n.appendChild(o),n.appendChild(document.createTextNode(a.label)),t.appendChild(n)}),k=t;break}case"file":{let t=document.createElement("div");t.className="voc-form-file-wrapper",e.width&&(t.style.width=e.width);let a=document.createElement("input");a.type="file",a.classList.add("voc-form-file"),c&&a.classList.add("form-control"),(e.key||e.name)&&(a.name=e.name||e.key,e.key&&(a.id=`voc-form-${e.key}`)),e.width&&(a.style.width=e.width),e.required&&(a.required=!0),e.accept&&(a.accept=e.accept),e.multiple&&(a.multiple=!0),t.appendChild(a),k=t;break}case"avatar":{k=W(e,f||{},r);break}case"table":{k=V(e,f||{},r);break}case"audio_select":{k=z(e,f||{},r);break}default:{let t=document.createElement("input");t.type=e.type||"text",t.classList.add("voc-form-input"),c&&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),d(t,e.validation),k=t;break}}if(k&&C.appendChild(k),e.hint_text){let t=document.createElement("small");t.className="voc-form-hint",t.textContent=e.hint_text,C.appendChild(t)}return C}b.fields.forEach(e=>{if(e.type==="group"&&"items"in e){let p=e;if(c){let L=document.createElement("div");L.className="card voc-form-group-card mb-3";let r=p.label||p.header?.title,C=p.description||p.header?.description;if(r||C){let t=document.createElement("div");if(t.className="card-header voc-form-group-head",r){let a=document.createElement("h5");a.className="mb-0 voc-form-group-label",a.textContent=r,t.appendChild(a)}if(C){let a=document.createElement("p");a.className="mb-0 voc-form-group-description",a.textContent=C,t.appendChild(a)}L.appendChild(t)}let k=document.createElement("div");k.className="card-body voc-form-group-body",p.items.forEach(t=>{if(t.type==="row"&&"items"in t){let a=t,i=document.createElement("div");if(i.className="voc-form-group voc-form-row mb-3",a.label){let o=document.createElement("h6");o.className="voc-form-row-label",o.textContent=a.label,i.appendChild(o)}let n=document.createElement("div");n.className="voc-form-row-items "+(a.direction||"horizontal"),a.items.forEach(o=>{let w=N(o);w&&n.appendChild(w)}),i.appendChild(n),k.appendChild(i)}else{let a=N(t);a&&k.appendChild(a)}}),L.appendChild(k),h.appendChild(L)}else{let L=document.createElement("div");L.className="voc-form-group voc-form-group-wrapper",c&&L.classList.add("mb-3");let r=p.label||p.header?.title,C=p.description||p.header?.description;if(r||C){let k=document.createElement("div");if(k.className="voc-form-group-head",r){let t=document.createElement("h3");t.className="voc-form-group-label",t.textContent=r,k.appendChild(t)}if(C){let t=document.createElement("p");t.className="voc-form-group-description",t.textContent=C,k.appendChild(t)}L.appendChild(k)}p.items.forEach(k=>{if(k.type==="row"&&"items"in k){let t=k,a=document.createElement("div");if(a.className="voc-form-group voc-form-row",c&&a.classList.add("mb-3"),t.label){let n=document.createElement("h4");n.className="voc-form-row-label",n.textContent=t.label,a.appendChild(n)}let i=document.createElement("div");i.className="voc-form-row-items "+(t.direction||"horizontal"),t.items.forEach(n=>{let o=N(n);o&&i.appendChild(o)}),a.appendChild(i),L.appendChild(a)}else{let t=N(k);t&&L.appendChild(t)}}),h.appendChild(L)}return}if(e.type==="row"&&"items"in e){let p=document.createElement("div");if(p.className="voc-form-group voc-form-row",c&&p.classList.add("mb-3"),e.label){let r=document.createElement("h3");r.className="voc-form-row-label",r.textContent=e.label,p.appendChild(r)}if(e.description){let r=document.createElement("p");r.className="voc-form-row-description",r.textContent=e.description,p.appendChild(r)}let L=document.createElement("div");L.className="voc-form-row-items "+(e.direction||"horizontal"),p.appendChild(L),e.items.forEach(r=>{let C=N(r);C&&L.appendChild(C)}),h.appendChild(p)}else{let p=N(e);p&&h.appendChild(p)}});let x=document.createElement("button");return x.type="submit",x.className="voc-form-submit",x.textContent="Submit",c&&x.classList.add("btn","btn-primary"),h.appendChild(x),h}let u=m();y[0].appendChild(u);let E=b?.submit_config??f?.submit_config??null;return E&&u.addEventListener("submit",c=>{if(c.preventDefault(),!u.checkValidity()){u.reportValidity(),f?.onSubmitResult&&f.onSubmitResult(null,new Error("Form validation failed"));return}let h=Array.from(u.querySelectorAll(" .voc-form-table-wrapper, .voc-form-table-wrapper")),v=[];if(h.forEach(d=>{if(d&&typeof d.validate=="function"){let N=d.validate();N&&N.length&&v.push(...N)}}),v.length){f?.onSubmitResult&&f.onSubmitResult(null,new Error(v.join("; ")));let d=h[0];d&&d.scrollIntoView({behavior:"smooth",block:"center"});return}if(f?.onSubmit){let d=I(u);f.onSubmit(d)}G(u,E,(d,N)=>{f?.onSubmitResult&&f.onSubmitResult(d,N)})}),{element:u,validate:()=>{let c=[];return u.querySelectorAll(":invalid").forEach(v=>{let d=v.validationMessage;c.push({element:v,message:d})}),c},getValues:()=>I(u),onSubmit:c=>{u.addEventListener("submit",h=>{h.preventDefault();let v=I(u);c(v,h)})}}}var P={renderForm:J};var ne=P,re={FormsLib:P};0&&(module.exports={FormsLib});
1
+ "use strict";var P=Object.defineProperty;var Q=Object.getOwnPropertyDescriptor;var X=Object.getOwnPropertyNames;var Z=Object.prototype.hasOwnProperty;var ee=(s,b)=>{for(var h in b)P(s,h,{get:b[h],enumerable:!0})},te=(s,b,h,y)=>{if(b&&typeof b=="object"||typeof b=="function")for(let d of X(b))!Z.call(s,d)&&d!==h&&P(s,d,{get:()=>b[d],enumerable:!(y=Q(b,d))||y.enumerable});return s};var ae=s=>te(P({},"__esModule",{value:!0}),s);var ce={};ee(ce,{FormsLib:()=>oe,default:()=>ie});module.exports=ae(ce);function W(s,b,h){let y=b?.style==="bootstrap",d=document.createElement("div");d.className="voc-form-avatar-wrapper",y&&d.classList.add("d-flex","align-items-center","gap-3");let m=document.createElement("img");m.className="voc-form-avatar-preview",m.alt=s.label||"avatar",y&&(m.classList.add("img-thumbnail","rounded-circle"),m.style.width=m.style.height="64px",m.style.objectFit="cover");let L=h!=null?String(h):s.default!==void 0&&s.default!==null?String(s.default):"";L?m.src=L:(m.src="",m.style.display="none");let c=document.createElement("input");c.type="file",c.accept=s.accept||"image/*",c.className="voc-form-avatar-input",y&&c.classList.add("form-control"),(s.key||s.name)&&(c.name=s.name||s.key,s.key&&(c.id=`voc-form-${s.key}`));let f=document.createElement("input");if(f.type="hidden",(s.key||s.name)&&(f.name=(s.name||s.key)+"_url"),f.value=L||"",c.addEventListener("change",g=>{let u=g.target;if(u.files&&u.files.length>0){let x=u.files[0],N=new FileReader;N.onload=()=>{m.src=String(N.result),m.style.display="",f.value=""},N.readAsDataURL(x)}}),y){let g=document.createElement("div");g.style.flex="1",g.appendChild(c),g.appendChild(f),d.appendChild(m),d.appendChild(g)}else d.appendChild(m),d.appendChild(c),d.appendChild(f);return d}function z(s,b,h){let y=b?.style==="bootstrap",d=document.createElement("div");if(d.className="voc-form-audio-select",!s.options||s.options.length===0)return d;let m=s.name||s.key||`audio_select_${Math.random().toString(36).substr(2,6)}`,L;return Array.isArray(h)?L=h[0]:h!==void 0?L=h:s.default!==void 0&&(L=s.default),s.options.forEach((c,f)=>{let g=document.createElement("div");g.className="voc-form-audio-item",y&&g.classList.add("form-check");let u=document.createElement("input");u.type="radio",u.name=m,u.value=c.value,u.className="voc-form-audio-radio",s.key&&(u.id=`voc-form-${s.key}-${f}`),s.required&&f===0&&(u.required=!0),u.style.position="absolute",u.style.width="1px",u.style.height="1px",u.style.margin="0",u.style.padding="0",u.style.clip="rect(0 0 0 0)",u.style.clipPath="inset(50%)",u.style.overflow="hidden",u.style.border="0",L!==void 0&&(Array.isArray(L)?u.checked=L.includes(c.value):u.checked=String(L)===String(c.value));let x=()=>{u.checked?g.classList.add("selected"):g.classList.remove("selected")};u.addEventListener("change",()=>{d.querySelectorAll(".voc-form-audio-item").forEach(n=>n.classList.remove("selected")),x()}),u.checked&&g.classList.add("selected");let N=document.createElement("label");N.className="voc-form-audio-label",y&&N.classList.add("form-check-label"),N.htmlFor=u.id||"",N.textContent=c.label||c.value,N.tabIndex=0;let e=document.createElement("div");e.className="voc-form-audio-control";let l=null;if(c.audio_link){let t=document.createElement("button");t.type="button",t.className="voc-form-audio-play",y&&t.classList.add("btn","btn-sm","btn-outline-secondary"),t.setAttribute("aria-label",`Play ${c.label||c.value}`);let n="http://www.w3.org/2000/svg",i=document.createElementNS(n,"svg");i.setAttribute("viewBox","0 0 24 24"),i.setAttribute("width","16"),i.setAttribute("height","16"),i.setAttribute("aria-hidden","true");let r=document.createElementNS(n,"path");r.setAttribute("d","M8 5v14l11-7z"),r.setAttribute("fill","currentColor"),i.appendChild(r),t.appendChild(i),l=document.createElement("audio"),l.src=c.audio_link,l.preload="none",l.style.display="none";let o=p=>{for(;p.firstChild;)p.removeChild(p.firstChild)},C=()=>{let p="http://www.w3.org/2000/svg",S=document.createElementNS(p,"svg");S.setAttribute("viewBox","0 0 24 24"),S.setAttribute("width","16"),S.setAttribute("height","16"),S.setAttribute("aria-hidden","true");let A=document.createElementNS(p,"path");return A.setAttribute("d","M8 5v14l11-7z"),A.setAttribute("fill","currentColor"),S.appendChild(A),S},F=()=>{let p="http://www.w3.org/2000/svg",S=document.createElementNS(p,"svg");S.setAttribute("viewBox","0 0 24 24"),S.setAttribute("width","16"),S.setAttribute("height","16"),S.setAttribute("aria-hidden","true");let A=document.createElementNS(p,"rect");return A.setAttribute("x","6"),A.setAttribute("y","6"),A.setAttribute("width","12"),A.setAttribute("height","12"),A.setAttribute("fill","currentColor"),S.appendChild(A),S};o(t),t.appendChild(C());let R=p=>{o(t),p?(t.appendChild(F()),t.setAttribute("aria-label",`Stop ${c.label||c.value}`)):(t.appendChild(C()),t.setAttribute("aria-label",`Play ${c.label||c.value}`))};t.addEventListener("click",()=>{try{if(!l)return;let p=d.querySelectorAll("audio");if(!l.paused&&!l.ended){l.pause(),l.currentTime=0;return}p.forEach(A=>{try{A.pause(),A.currentTime=0}catch{}}),d.querySelectorAll(".voc-form-audio-item").forEach(A=>A.classList.remove("is-playing")),l.play()}catch(p){console.warn("audio play failed",p)}}),l.addEventListener("playing",()=>{g.classList.add("is-playing"),R(!0)});let H=()=>{g.classList.remove("is-playing"),R(!1)};l.addEventListener("pause",H),l.addEventListener("ended",H),e.appendChild(t),e.appendChild(l)}let v=document.createElement("div");v.className="voc-form-item-detail",v.style.display="flex",v.style.flexDirection="column",v.style.gap="4px";let a=document.createElement("div");a.className="voc-form-item-top",a.style.display="flex",a.style.alignItems="center",a.style.gap="8px",a.appendChild(u),a.appendChild(N);let E=document.createElement("div");E.className="voc-form-item-description";let k=c.description||c.hint_text||"";k&&(E.textContent=k),v.appendChild(a),v.appendChild(E),e.appendChild(v),g.appendChild(e),a.addEventListener("click",t=>{let n=t.target;n&&n.closest(".voc-form-audio-play")||(u.checked=!0,u.dispatchEvent(new Event("change",{bubbles:!0})))}),g.addEventListener("click",t=>{let n=t.target;n&&n.closest(".voc-form-audio-play")||(u.checked=!0,u.dispatchEvent(new Event("change",{bubbles:!0})))}),d.appendChild(g)}),d}function G(s,b,h){let y=document.createElement("div");y.className="voc-form-table-wrapper";let d=b?.style==="bootstrap",m=document.createElement("input");m.type="hidden",m.name=s.name||s.key,s.key&&(m.id=`voc-form-${s.key}`),y.appendChild(m);let L=document.createElement("table");L.className="voc-form-table",d&&L.classList.add("table","table-bordered");let c=document.createElement("thead"),f=document.createElement("tr"),g=document.createElement("th");g.className="voc-form-table-drag-col",g.textContent="",f.appendChild(g),(s.fields||[]).forEach(n=>{let i=document.createElement("th");i.textContent=n.label||n.key,f.appendChild(i)});let u=document.createElement("th");u.textContent="Actions",f.appendChild(u),c.appendChild(f),L.appendChild(c);let x=document.createElement("tbody");L.appendChild(x),y.appendChild(L);let N=document.createElement("button");N.type="button",N.className="voc-form-table-add",d&&N.classList.add("btn","btn-secondary"),N.textContent="+Add";let e=document.createElement("tfoot"),l=document.createElement("tr"),v=document.createElement("td");v.colSpan=(s.fields?s.fields.length:0)+1,v.appendChild(N),l.appendChild(v),e.appendChild(l),L.appendChild(e),y.appendChild(L);let a=[];function E(){m.value=JSON.stringify(a)}function k(n){let i=[];return s.fields.forEach(r=>{let o=n[r.key];if(r.type==="checkbox"){let C=Array.isArray(o)?o:o?[o]:[];r.required&&C.length===0&&i.push(`${r.label||r.key} is required`);return}r.required&&(o==null||String(o).trim()==="")&&i.push(`${r.label||r.key} is required`),r.type==="email"&&o&&(/^\S+@\S+\.\S+$/.test(String(o))||i.push(`${r.label||r.key} must be a valid email`)),r.type==="number"&&o&&isNaN(Number(o))&&i.push(`${r.label||r.key} must be a number`),r.validation&&r.validation.regex&&o&&(new RegExp(r.validation.regex).test(String(o))||i.push(`${r.label||r.key} invalid format`))}),i}function t(){x.innerHTML="";let n=(i,r)=>{r.draggable=!0,r.addEventListener("mousedown",()=>{r.style.cursor="grabbing"}),r.addEventListener("mouseup",()=>{r.style.cursor="grab"}),r.addEventListener("dragstart",o=>{let C=Number(i.dataset.rowIndex);o.dataTransfer.setData("text/plain",String(C)),i.classList.add("dragging");try{o.dataTransfer?.setDragImage(r,10,10)}catch{}}),r.addEventListener("dragend",()=>{i.classList.remove("dragging"),r.style.cursor="grab"}),i.addEventListener("dragover",o=>{o.preventDefault();let C=o.currentTarget,F=C.getBoundingClientRect(),R=F.top+F.height/2,H=(o.clientY||o.y)>R;C.classList.remove("drag-over-top","drag-over-bottom"),H?(C.classList.add("drag-over-bottom"),C.dataset.dropPosition="after"):(C.classList.add("drag-over-top"),C.dataset.dropPosition="before")}),i.addEventListener("dragleave",o=>{let C=o.currentTarget;C.classList.remove("drag-over-top","drag-over-bottom"),delete C.dataset.dropPosition}),i.addEventListener("drop",o=>{o.preventDefault();let C=o.dataTransfer.getData("text/plain"),F=Number(o.currentTarget.dataset.rowIndex),R=Number(C),H=o.currentTarget.dataset.dropPosition||"before";if(isNaN(R)||isNaN(F))return;let[p]=a.splice(R,1),S=F;R<F&&(S=F-1);let A=H==="after"?S+1:S;a.splice(A,0,p),o.currentTarget.classList.remove("drag-over-top","drag-over-bottom"),delete o.currentTarget.dataset.dropPosition,t(),E()})};a.forEach((i,r)=>{let o=document.createElement("tr");o.dataset.rowIndex=String(r),o.classList.add("voc-form-table-row");let C=document.createElement("td");C.className="voc-form-table-drag-handle";let F=document.createElement("span");F.className="voc-form-drag-handle-icon",F.textContent="\u2630",F.style.cursor="grab",C.appendChild(F),o.appendChild(C),n(o,F),s.fields.forEach(p=>{let S=document.createElement("td"),A,_=(p.type||"text").toLowerCase();if(_==="select"){let w=document.createElement("select");if(w.className="voc-form-table-cell",d&&w.classList.add("form-control"),p.placeholder){let T=document.createElement("option");T.value="",T.textContent=p.placeholder,T.disabled=!0,(i[p.key]===void 0||i[p.key]===null||i[p.key]==="")&&(T.selected=!0),w.appendChild(T)}(p.options||[]).forEach(T=>{let D=document.createElement("option");D.value=T.value,D.textContent=T.label,w.appendChild(D)}),w.value=i[p.key]!==void 0&&i[p.key]!==null?String(i[p.key]):"",p.required&&(w.required=!0),w.addEventListener("change",T=>{a[r][p.key]=T.target.value,E()}),A=w}else if(_==="checkbox"){let w=document.createElement("div");w.className="voc-form-table-checkboxes",d&&w.classList.add("form-check");let B=p.options||[];Array.isArray(a[r][p.key])||(a[r][p.key]=a[r][p.key]?[a[r][p.key]]:[]),B.forEach(T=>{let D=`voc-form-${s.key}-${p.key}-${r}-${T.value}`,$=document.createElement("div");$.className="voc-form-table-checkbox-item",d&&$.classList.add("form-check");let M=document.createElement("input");M.type="checkbox",M.className="voc-form-table-cell",d&&M.classList.add("form-check-input"),M.id=D,M.value=T.value,M.checked=Array.isArray(a[r][p.key])&&a[r][p.key].includes(T.value),M.addEventListener("change",O=>{let K=O.target.checked;Array.isArray(a[r][p.key])||(a[r][p.key]=[]),K?a[r][p.key].includes(T.value)||a[r][p.key].push(T.value):a[r][p.key]=a[r][p.key].filter(Y=>Y!==T.value),E()});let q=document.createElement("label");q.htmlFor=D,q.className="voc-form-table-checkbox-label",d&&q.classList.add("form-check-label"),q.textContent=T.label,$.appendChild(M),$.appendChild(q),w.appendChild($)}),A=w}else if(_==="radio"){let w=document.createElement("div");w.className="voc-form-table-radios",d&&w.classList.add("form-check");let B=p.options||[];a[r][p.key]===void 0&&(a[r][p.key]=""),B.forEach(T=>{let D=`voc-form-${s.key}-${p.key}-${r}-${T.value}`,$=document.createElement("div");$.className="voc-form-table-radio-item",d&&$.classList.add("form-check");let M=document.createElement("input");M.type="radio",M.className="voc-form-table-cell",d&&M.classList.add("form-check-input"),M.id=D,M.name=`voc-form-${s.key}-${p.key}-${r}`,M.value=T.value,M.checked=a[r][p.key]===T.value,M.addEventListener("change",O=>{O.target.checked&&(a[r][p.key]=O.target.value,E())});let q=document.createElement("label");q.htmlFor=D,q.className="voc-form-table-radio-label",d&&q.classList.add("form-check-label"),q.textContent=T.label,$.appendChild(M),$.appendChild(q),w.appendChild($)}),A=w}else{let w=document.createElement("input");_==="number"?w.type="number":_==="email"?w.type="email":_==="tel"?w.type="tel":_==="url"?w.type="url":_==="date"?w.type="date":w.type="text",w.value=i[p.key]!==void 0&&i[p.key]!==null?String(i[p.key]):"",p.placeholder&&(w.placeholder=p.placeholder),p.required&&(w.required=!0),w.className="voc-form-table-cell",d&&w.classList.add("form-control"),w.addEventListener("input",B=>{a[r][p.key]=B.target.value,E()}),A=w}S.appendChild(A),o.appendChild(S)});let R=document.createElement("td"),H=document.createElement("button");H.type="button",H.className="voc-form-table-remove",d&&H.classList.add("btn","btn-danger"),H.textContent="Remove",H.addEventListener("click",()=>{a.splice(r,1),t(),E()}),R.appendChild(H),o.appendChild(R),x.appendChild(o)})}return N.addEventListener("click",()=>{if(s.validation?.max_rows!==void 0&&a.length>=s.validation.max_rows)return;let n={};s.fields.forEach(i=>n[i.key]=""),a.push(n),t(),E()}),Array.isArray(h)&&h.length?a=h.map(n=>({...n})):s.default&&Array.isArray(s.default)&&(a=s.default.map(n=>({...n}))),t(),E(),y.validate=function(){let n=[];return a.forEach((i,r)=>{let o=k(i);o.length&&n.push(`Row ${r+1}: ${o.join("; ")}`)}),s.validation?.min_rows!==void 0&&a.length<s.validation.min_rows&&n.push(`At least ${s.validation.min_rows} rows required`),s.validation?.max_rows!==void 0&&a.length>s.validation.max_rows&&n.push(`No more than ${s.validation.max_rows} rows allowed`),s.validation?.unique_fields&&s.validation.unique_fields.length&&s.validation.unique_fields.forEach(i=>{let r=new Set;a.forEach((o,C)=>{let F=o[i];F!=null&&(r.has(F)&&n.push(`Field ${i} must be unique (duplicate at row ${C+1})`),r.add(F))})}),n},y}async function ne(s){let h=new TextEncoder().encode(s),y=await crypto.subtle.digest("SHA-256",h);return Array.from(new Uint8Array(y)).map(m=>m.toString(16).padStart(2,"0")).join("")}async function re(s){let b=String(s||"").trim().toLowerCase();return b?`https://gravatar.com/avatar/${await ne(b)}?d=mp`:""}function U(s,b,h){let y=b?.style==="bootstrap",d=document.createElement("div");d.className="voc-form-users";let m=document.createElement("div");if(m.className="voc-form-users-header",y&&m.classList.add("mb-2"),s.label){let e=document.createElement("div");if(e.className="voc-form-users-label",y&&e.classList.add("form-label"),e.textContent=s.label,s.required){let l=document.createElement("span");l.className="voc-form-required",l.textContent="*",e.appendChild(l)}m.appendChild(e)}if(s.description){let e=document.createElement("div");e.className="voc-form-users-description",y&&e.classList.add("form-text"),e.textContent=s.description,m.appendChild(e)}d.appendChild(m);let L=document.createElement("div");L.className="voc-form-users-search-wrapper";let c=document.createElement("input");if(c.type="search",c.placeholder="Search users...",c.className="voc-form-users-search",y&&c.classList.add("form-control","mb-2"),L.appendChild(c),d.appendChild(L),!s.options||s.options.length===0)return d;let f=document.createElement("div");f.className="voc-form-users-list",y&&f.classList.add("list-group");let g=s.name||s.key||`users_${Math.random().toString(36).substr(2,6)}`,u=[];Array.isArray(h)?u=h:h!=null?u=[h]:Array.isArray(s.default)&&(u=s.default),s.options.forEach((e,l)=>{let v=document.createElement("div");v.className="voc-form-user-item",v.dataset.label=String(e.label||"").toLowerCase(),v.dataset.email=String(e.email||"").toLowerCase(),v.dataset.value=String(e.value||"").toLowerCase(),y&&v.classList.add("d-flex","align-items-center","gap-2");let a=document.createElement("input");a.type="checkbox",a.name=`${g}[]`,a.value=e.value,a.className="voc-form-user-checkbox",s.key&&(a.id=`voc-form-${s.key}-${l}`),s.required&&l===0&&(a.required=!0),a.style.position="absolute",a.style.width="1px",a.style.height="1px",a.style.margin="0",a.style.padding="0",a.style.clip="rect(0 0 0 0)",a.style.clipPath="inset(50%)",a.style.overflow="hidden",a.style.border="0",u&&Array.isArray(u)&&(a.checked=u.includes(e.value));let E=document.createElement("img");E.className="voc-form-user-avatar",E.alt=e.label||String(e.value||"user"),E.style.width=E.style.height="40px",E.style.objectFit="cover",E.style.borderRadius="50%",E.src="",e.email&&re(e.email).then(i=>{i&&(E.src=i)}).catch(()=>{});let k=document.createElement("div");k.className="voc-form-user-info",k.style.display="flex",k.style.flexDirection="column",k.style.gap="2px";let t=document.createElement("div");t.className="voc-form-user-label",t.textContent=e.label||String(e.value);let n=document.createElement("small");n.className="voc-form-user-email",n.textContent=e.email||"",k.appendChild(t),k.appendChild(n),v.addEventListener("click",i=>{let r=i.target;r&&(r.closest("input")||r.closest("a")||r.closest("button"))||(a.checked=!a.checked,a.dispatchEvent(new Event("change",{bubbles:!0})))}),a.addEventListener("change",()=>{a.checked?v.classList.add("selected"):v.classList.remove("selected")}),a.checked&&v.classList.add("selected"),v.appendChild(a),v.appendChild(E),v.appendChild(k),f.appendChild(v)}),d.appendChild(f);let x=Array.from(f.querySelectorAll(".voc-form-user-item")),N=()=>{let e=String(c.value||"").trim().toLowerCase();if(!e){x.forEach(l=>l.style.setProperty("display","flex","important"));return}x.forEach(l=>{let v=l.dataset.label||"",a=l.dataset.email||"",E=l.dataset.value||"",k=v.includes(e)||a.includes(e)||E.includes(e);l.style.setProperty("display",k?"flex":"none","important")})};return c.addEventListener("input",N),d}function I(s,b=!0){let h=new FormData(s);if(b)return se(h);let y={};return h.forEach((d,m)=>{let L=(d instanceof File,d);Object.prototype.hasOwnProperty.call(y,m)?Array.isArray(y[m])?y[m].push(L):y[m]=[y[m],L]:y[m]=L}),y}function se(s){let b=new FormData;for(let[h,y]of s.entries()){if(y instanceof File){b.append(h,y);continue}let d;try{d=JSON.parse(y)}catch{d=null}Array.isArray(d)?d.length===0?b.append(h,"[]"):d.every(m=>typeof m=="object"&&m!==null)?d.forEach((m,L)=>{for(let[c,f]of Object.entries(m))b.append(`${h}[${L}][${c}]`,f)}):b.append(h,y):b.append(h,y)}return b}async function J(s,b,h){let y=b.url,d={"Content-Type":"application/json"};b?.api_token&&(d.Authorization=`Bearer ${b.api_token}`);let m=I(s);if(b?.additional_data)for(let[f,g]of Object.entries(b.additional_data))m.append(f,g);let L,c=m instanceof FormData;L={method:"POST",headers:{Authorization:`Bearer ${b.api_token}`,...c?{}:{"Content-Type":"application/json"},Accept:"application/json"},body:c?m:JSON.stringify(Object.fromEntries(m.entries()))};try{fetch(y,L).then(async f=>{let g=f.headers.get("content-type");if(!f.ok)try{let x=(await f.json())?.message;throw new Error(x??"Their was an error submitting the form. Check your form and try again.")}catch(u){throw new Error(u.message)}return g&&g.includes("application/json")?f.json():f.text()}).then(f=>{h&&h(f,null)}).catch(f=>{h&&h(null,f)})}catch(f){h&&h(null,f)}}function V(s,b,h){let y=[];if(typeof s=="string"?y=Array.from(document.querySelectorAll(s)):y=[s],y.length===0)return null;function d(){let c=h?.style==="bootstrap",f=document.createElement("form");f.classList.add("voc-form"),c&&f.classList.add("needs-validation"),f.id=b.id;let g=document.createElement("h2");g.className="voc-form-title",c&&g.classList.add("mb-3"),g.textContent=b.form_name,f.appendChild(g);function u(e,l){l&&(l.min_length!==void 0&&(e.minLength=l.min_length),l.max_length!==void 0&&(e.maxLength=l.max_length),l.regex&&(e instanceof HTMLInputElement?e.pattern=l.regex:e.dataset.pattern=l.regex))}function x(e){if(!e.key&&!e.label)return null;let l=b.default_values||{},v=e.name||e.key,a=v?l[v]:void 0,E=document.createElement("div");if(E.className="voc-form-group",c&&E.classList.add("mb-3"),e.label&&e.type!=="users"){let t=document.createElement("label");if(t.classList.add("voc-form-label"),c&&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 k=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,i)=>{let r=document.createElement("label");r.classList.add("voc-form-checkbox-label"),c&&r.classList.add("form-check"),r.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(r.style.width=e.width);let o=document.createElement("input");o.type="checkbox",o.classList.add("voc-form-checkbox"),c&&o.classList.add("form-check-input"),o.name=e.name||e.key||"",o.value=n.value,e.key&&(o.id=`voc-form-${e.key}-${i}`),e.required&&(o.required=!0),Array.isArray(a)?a.includes(n.value)&&(o.checked=!0):a!==void 0?a===n.value&&(o.checked=!0):e.default===n.value&&(o.checked=!0),r.appendChild(o),r.appendChild(document.createTextNode(n.label)),t.appendChild(r)});else{let n=document.createElement("label");n.classList.add("voc-form-checkbox-label"),c&&n.classList.add("form-check"),e.width&&(n.style.width=e.width);let i=document.createElement("input");i.type="checkbox",i.classList.add("voc-form-checkbox"),(e.key||e.name)&&(i.name=e.name||e.key,e.key&&(i.id=`voc-form-${e.key}`)),c&&i.classList.add("form-check-input"),e.required&&(i.required=!0),a!==void 0?i.checked=!!a:e.default&&(i.checked=!!e.default),n.appendChild(i),n.appendChild(document.createTextNode(e.label||"")),t.appendChild(n)}k=t;break}case"textarea":{let t=document.createElement("textarea");t.classList.add("voc-form-textarea"),c&&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),a!=null?t.value=String(a):e.default!==void 0&&e.default!==null&&(t.value=String(e.default));let n=e.default||a||"";if(n){let i=(n.match(/\n/g)||[]).length,r=80,o=n.split(`
2
+ `).reduce((R,H)=>Math.max(R,H.length),0),C=Math.ceil(o/r)||1,F=Math.max(2,i+C);t.rows=F,t.style.resize="vertical"}e.width&&(t.style.width=e.width),e.required&&(t.required=!0),u(t,e.validation),k=t;break}case"select":{let t=document.createElement("select");if(t.classList.add("voc-form-select"),c&&t.classList.add("form-select"),c&&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 i=document.createElement("option");i.value=n.value,i.textContent=n.label,Array.isArray(a)?a.includes(n.value)&&(i.selected=!0):a!==void 0?a===n.value&&(i.selected=!0):e.default===n.value&&(i.selected=!0),t.appendChild(i)}),e.width&&(t.style.width=e.width),k=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,i)=>{let r=document.createElement("label");r.classList.add("voc-form-radio-label"),c&&r.classList.add("form-check"),r.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(r.style.width=e.width);let o=document.createElement("input");o.type="radio",o.classList.add("voc-form-radio"),c&&o.classList.add("form-check-input"),o.name=e.name||e.key||"",o.value=n.value,e.key&&(o.id=`voc-form-${e.key}-${i}`),Array.isArray(a)?a.includes(n.value)&&(o.checked=!0):a!==void 0?a===n.value&&(o.checked=!0):e.default===n.value&&(o.checked=!0),r.appendChild(o),r.appendChild(document.createTextNode(n.label)),t.appendChild(r)}),k=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"),c&&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),k=t;break}case"avatar":{k=W(e,h||{},a);break}case"table":{k=G(e,h||{},a);break}case"users":{k=U(e,h||{},a);break}case"audio_select":{k=z(e,h||{},a);break}default:{let t=document.createElement("input");t.type=e.type||"text",t.classList.add("voc-form-input"),c&&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),a!=null?t.value=String(a):e.default!==void 0&&e.default!==null&&(t.value=String(e.default)),e.width&&(t.style.width=e.width),e.required&&(t.required=!0),u(t,e.validation),k=t;break}}if(k&&E.appendChild(k),e.hint_text){let t=document.createElement("small");t.className="voc-form-hint",t.textContent=e.hint_text,E.appendChild(t)}return E}b.fields.forEach(e=>{if(e.type==="group"&&"items"in e){let l=e;if(c){let v=document.createElement("div");v.className="card voc-form-group-card mb-3";let a=l.label||l.header?.title,E=l.description||l.header?.description;if(a||E){let t=document.createElement("div");if(t.className="card-header voc-form-group-head",a){let n=document.createElement("h5");n.className="mb-0 voc-form-group-label",n.textContent=a,t.appendChild(n)}if(E){let n=document.createElement("p");n.className="mb-0 voc-form-group-description",n.textContent=E,t.appendChild(n)}v.appendChild(t)}let k=document.createElement("div");k.className="card-body voc-form-group-body",l.items.forEach(t=>{if(t.type==="row"&&"items"in t){let n=t,i=document.createElement("div");if(i.className="voc-form-group voc-form-row mb-3",n.label){let o=document.createElement("h6");o.className="voc-form-row-label",o.textContent=n.label,i.appendChild(o)}let r=document.createElement("div");r.className="voc-form-row-items "+(n.direction||"horizontal"),n.items.forEach(o=>{let C=x(o);C&&r.appendChild(C)}),i.appendChild(r),k.appendChild(i)}else{let n=x(t);n&&k.appendChild(n)}}),v.appendChild(k),f.appendChild(v)}else{let v=document.createElement("div");v.className="voc-form-group voc-form-group-wrapper",c&&v.classList.add("mb-3");let a=l.label||l.header?.title,E=l.description||l.header?.description;if(a||E){let k=document.createElement("div");if(k.className="voc-form-group-head",a){let t=document.createElement("h3");t.className="voc-form-group-label",t.textContent=a,k.appendChild(t)}if(E){let t=document.createElement("p");t.className="voc-form-group-description",t.textContent=E,k.appendChild(t)}v.appendChild(k)}l.items.forEach(k=>{if(k.type==="row"&&"items"in k){let t=k,n=document.createElement("div");if(n.className="voc-form-group voc-form-row",c&&n.classList.add("mb-3"),t.label){let r=document.createElement("h4");r.className="voc-form-row-label",r.textContent=t.label,n.appendChild(r)}let i=document.createElement("div");i.className="voc-form-row-items "+(t.direction||"horizontal"),t.items.forEach(r=>{let o=x(r);o&&i.appendChild(o)}),n.appendChild(i),v.appendChild(n)}else{let t=x(k);t&&v.appendChild(t)}}),f.appendChild(v)}return}if(e.type==="row"&&"items"in e){let l=document.createElement("div");if(l.className="voc-form-group voc-form-row",c&&l.classList.add("mb-3"),e.label){let a=document.createElement("h3");a.className="voc-form-row-label",a.textContent=e.label,l.appendChild(a)}if(e.description){let a=document.createElement("p");a.className="voc-form-row-description",a.textContent=e.description,l.appendChild(a)}let v=document.createElement("div");v.className="voc-form-row-items "+(e.direction||"horizontal"),l.appendChild(v),e.items.forEach(a=>{let E=x(a);E&&v.appendChild(E)}),f.appendChild(l)}else{let l=x(e);l&&f.appendChild(l)}});let N=document.createElement("button");return N.type="submit",N.className="voc-form-submit",N.textContent="Submit",c&&N.classList.add("btn","btn-primary"),f.appendChild(N),f}let m=d();y[0].appendChild(m);let L=b?.submit_config??h?.submit_config??null;return L&&m.addEventListener("submit",c=>{if(c.preventDefault(),!m.checkValidity()){m.reportValidity(),h?.onSubmitResult&&h.onSubmitResult(null,new Error("Form validation failed"));return}let f=Array.from(m.querySelectorAll(" .voc-form-table-wrapper, .voc-form-table-wrapper")),g=[];if(f.forEach(u=>{if(u&&typeof u.validate=="function"){let x=u.validate();x&&x.length&&g.push(...x)}}),g.length){h?.onSubmitResult&&h.onSubmitResult(null,new Error(g.join("; ")));let u=f[0];u&&u.scrollIntoView({behavior:"smooth",block:"center"});return}if(h?.onSubmit){let u=I(m);h.onSubmit(u)}J(m,L,(u,x)=>{h?.onSubmitResult&&h.onSubmitResult(u,x)})}),{element:m,validate:()=>{let c=[];return m.querySelectorAll(":invalid").forEach(g=>{let u=g.validationMessage;c.push({element:g,message:u})}),c},getValues:()=>I(m),onSubmit:c=>{m.addEventListener("submit",f=>{f.preventDefault();let g=I(m);c(g,f)})}}}var j={renderForm:V};var oe=j,ie={FormsLib:j};0&&(module.exports={FormsLib});
package/dist/main.mjs CHANGED
@@ -1,2 +1,2 @@
1
- function P(i,C,f){let y=C?.style==="bootstrap",h=document.createElement("div");h.className="voc-form-avatar-wrapper",y&&h.classList.add("d-flex","align-items-center","gap-3");let m=document.createElement("img");m.className="voc-form-avatar-preview",m.alt=i.label||"avatar",y&&(m.classList.add("img-thumbnail","rounded-circle"),m.style.width=m.style.height="64px",m.style.objectFit="cover");let g=f!=null?String(f):i.default!==void 0&&i.default!==null?String(i.default):"";g?m.src=g:(m.src="",m.style.display="none");let c=document.createElement("input");c.type="file",c.accept=i.accept||"image/*",c.className="voc-form-avatar-input",y&&c.classList.add("form-control"),(i.key||i.name)&&(c.name=i.name||i.key,i.key&&(c.id=`voc-form-${i.key}`));let p=document.createElement("input");if(p.type="hidden",(i.key||i.name)&&(p.name=(i.name||i.key)+"_url"),p.value=g||"",c.addEventListener("change",v=>{let d=v.target;if(d.files&&d.files.length>0){let N=d.files[0],x=new FileReader;x.onload=()=>{m.src=String(x.result),m.style.display="",p.value=""},x.readAsDataURL(N)}}),y){let v=document.createElement("div");v.style.flex="1",v.appendChild(c),v.appendChild(p),h.appendChild(m),h.appendChild(v)}else h.appendChild(m),h.appendChild(c),h.appendChild(p);return h}function W(i,C,f){let y=C?.style==="bootstrap",h=document.createElement("div");if(h.className="voc-form-audio-select",!i.options||i.options.length===0)return h;let m=i.name||i.key||`audio_select_${Math.random().toString(36).substr(2,6)}`,g;return Array.isArray(f)?g=f[0]:f!==void 0?g=f:i.default!==void 0&&(g=i.default),i.options.forEach((c,p)=>{let v=document.createElement("div");v.className="voc-form-audio-item",y&&v.classList.add("form-check");let d=document.createElement("input");d.type="radio",d.name=m,d.value=c.value,d.className="voc-form-audio-radio",i.key&&(d.id=`voc-form-${i.key}-${p}`),i.required&&p===0&&(d.required=!0),d.style.position="absolute",d.style.width="1px",d.style.height="1px",d.style.margin="0",d.style.padding="0",d.style.clip="rect(0 0 0 0)",d.style.clipPath="inset(50%)",d.style.overflow="hidden",d.style.border="0",g!==void 0&&(Array.isArray(g)?d.checked=g.includes(c.value):d.checked=String(g)===String(c.value));let N=()=>{d.checked?v.classList.add("selected"):v.classList.remove("selected")};d.addEventListener("change",()=>{h.querySelectorAll(".voc-form-audio-item").forEach(a=>a.classList.remove("selected")),N()}),d.checked&&v.classList.add("selected");let x=document.createElement("label");x.className="voc-form-audio-label",y&&x.classList.add("form-check-label"),x.htmlFor=d.id||"",x.textContent=c.label||c.value,x.tabIndex=0;let e=document.createElement("div");e.className="voc-form-audio-control";let u=null;if(c.audio_link){let t=document.createElement("button");t.type="button",t.className="voc-form-audio-play",y&&t.classList.add("btn","btn-sm","btn-outline-secondary"),t.setAttribute("aria-label",`Play ${c.label||c.value}`);let a="http://www.w3.org/2000/svg",s=document.createElementNS(a,"svg");s.setAttribute("viewBox","0 0 24 24"),s.setAttribute("width","16"),s.setAttribute("height","16"),s.setAttribute("aria-hidden","true");let n=document.createElementNS(a,"path");n.setAttribute("d","M8 5v14l11-7z"),n.setAttribute("fill","currentColor"),s.appendChild(n),t.appendChild(s),u=document.createElement("audio"),u.src=c.audio_link,u.preload="none",u.style.display="none";let o=l=>{for(;l.firstChild;)l.removeChild(l.firstChild)},k=()=>{let l="http://www.w3.org/2000/svg",S=document.createElementNS(l,"svg");S.setAttribute("viewBox","0 0 24 24"),S.setAttribute("width","16"),S.setAttribute("height","16"),S.setAttribute("aria-hidden","true");let T=document.createElementNS(l,"path");return T.setAttribute("d","M8 5v14l11-7z"),T.setAttribute("fill","currentColor"),S.appendChild(T),S},A=()=>{let l="http://www.w3.org/2000/svg",S=document.createElementNS(l,"svg");S.setAttribute("viewBox","0 0 24 24"),S.setAttribute("width","16"),S.setAttribute("height","16"),S.setAttribute("aria-hidden","true");let T=document.createElementNS(l,"rect");return T.setAttribute("x","6"),T.setAttribute("y","6"),T.setAttribute("width","12"),T.setAttribute("height","12"),T.setAttribute("fill","currentColor"),S.appendChild(T),S};o(t),t.appendChild(k());let H=l=>{o(t),l?(t.appendChild(A()),t.setAttribute("aria-label",`Stop ${c.label||c.value}`)):(t.appendChild(k()),t.setAttribute("aria-label",`Play ${c.label||c.value}`))};t.addEventListener("click",()=>{try{if(!u)return;let l=h.querySelectorAll("audio");if(!u.paused&&!u.ended){u.pause(),u.currentTime=0;return}l.forEach(T=>{try{T.pause(),T.currentTime=0}catch{}}),h.querySelectorAll(".voc-form-audio-item").forEach(T=>T.classList.remove("is-playing")),u.play()}catch(l){console.warn("audio play failed",l)}}),u.addEventListener("playing",()=>{v.classList.add("is-playing"),H(!0)});let R=()=>{v.classList.remove("is-playing"),H(!1)};u.addEventListener("pause",R),u.addEventListener("ended",R),e.appendChild(t),e.appendChild(u)}let w=document.createElement("div");w.className="voc-form-item-detail",w.style.display="flex",w.style.flexDirection="column",w.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(d),r.appendChild(x);let L=document.createElement("div");L.className="voc-form-item-description";let E=c.description||c.hint_text||"";E&&(L.textContent=E),w.appendChild(r),w.appendChild(L),e.appendChild(w),v.appendChild(e),r.addEventListener("click",t=>{let a=t.target;a&&a.closest(".voc-form-audio-play")||(d.checked=!0,d.dispatchEvent(new Event("change",{bubbles:!0})))}),v.addEventListener("click",t=>{let a=t.target;a&&a.closest(".voc-form-audio-play")||(d.checked=!0,d.dispatchEvent(new Event("change",{bubbles:!0})))}),h.appendChild(v)}),h}function z(i,C,f){let y=document.createElement("div");y.className="voc-form-table-wrapper";let h=C?.style==="bootstrap",m=document.createElement("input");m.type="hidden",m.name=i.name||i.key,i.key&&(m.id=`voc-form-${i.key}`),y.appendChild(m);let g=document.createElement("table");g.className="voc-form-table",h&&g.classList.add("table","table-bordered");let c=document.createElement("thead"),p=document.createElement("tr"),v=document.createElement("th");v.className="voc-form-table-drag-col",v.textContent="",p.appendChild(v),(i.fields||[]).forEach(a=>{let s=document.createElement("th");s.textContent=a.label||a.key,p.appendChild(s)});let d=document.createElement("th");d.textContent="Actions",p.appendChild(d),c.appendChild(p),g.appendChild(c);let N=document.createElement("tbody");g.appendChild(N),y.appendChild(g);let x=document.createElement("button");x.type="button",x.className="voc-form-table-add",h&&x.classList.add("btn","btn-secondary"),x.textContent="+Add";let e=document.createElement("tfoot"),u=document.createElement("tr"),w=document.createElement("td");w.colSpan=(i.fields?i.fields.length:0)+1,w.appendChild(x),u.appendChild(w),e.appendChild(u),g.appendChild(e),y.appendChild(g);let r=[];function L(){m.value=JSON.stringify(r)}function E(a){let s=[];return i.fields.forEach(n=>{let o=a[n.key];if(n.type==="checkbox"){let k=Array.isArray(o)?o:o?[o]:[];n.required&&k.length===0&&s.push(`${n.label||n.key} is required`);return}n.required&&(o==null||String(o).trim()==="")&&s.push(`${n.label||n.key} is required`),n.type==="email"&&o&&(/^\S+@\S+\.\S+$/.test(String(o))||s.push(`${n.label||n.key} must be a valid email`)),n.type==="number"&&o&&isNaN(Number(o))&&s.push(`${n.label||n.key} must be a number`),n.validation&&n.validation.regex&&o&&(new RegExp(n.validation.regex).test(String(o))||s.push(`${n.label||n.key} invalid format`))}),s}function t(){N.innerHTML="";let a=(s,n)=>{n.draggable=!0,n.addEventListener("mousedown",()=>{n.style.cursor="grabbing"}),n.addEventListener("mouseup",()=>{n.style.cursor="grab"}),n.addEventListener("dragstart",o=>{let k=Number(s.dataset.rowIndex);o.dataTransfer.setData("text/plain",String(k)),s.classList.add("dragging");try{o.dataTransfer?.setDragImage(n,10,10)}catch{}}),n.addEventListener("dragend",()=>{s.classList.remove("dragging"),n.style.cursor="grab"}),s.addEventListener("dragover",o=>{o.preventDefault();let k=o.currentTarget,A=k.getBoundingClientRect(),H=A.top+A.height/2,R=(o.clientY||o.y)>H;k.classList.remove("drag-over-top","drag-over-bottom"),R?(k.classList.add("drag-over-bottom"),k.dataset.dropPosition="after"):(k.classList.add("drag-over-top"),k.dataset.dropPosition="before")}),s.addEventListener("dragleave",o=>{let k=o.currentTarget;k.classList.remove("drag-over-top","drag-over-bottom"),delete k.dataset.dropPosition}),s.addEventListener("drop",o=>{o.preventDefault();let k=o.dataTransfer.getData("text/plain"),A=Number(o.currentTarget.dataset.rowIndex),H=Number(k),R=o.currentTarget.dataset.dropPosition||"before";if(isNaN(H)||isNaN(A))return;let[l]=r.splice(H,1),S=A;H<A&&(S=A-1);let T=R==="after"?S+1:S;r.splice(T,0,l),o.currentTarget.classList.remove("drag-over-top","drag-over-bottom"),delete o.currentTarget.dataset.dropPosition,t(),L()})};r.forEach((s,n)=>{let o=document.createElement("tr");o.dataset.rowIndex=String(n),o.classList.add("voc-form-table-row");let k=document.createElement("td");k.className="voc-form-table-drag-handle";let A=document.createElement("span");A.className="voc-form-drag-handle-icon",A.textContent="\u2630",A.style.cursor="grab",k.appendChild(A),o.appendChild(k),a(o,A),i.fields.forEach(l=>{let S=document.createElement("td"),T,q=(l.type||"text").toLowerCase();if(q==="select"){let b=document.createElement("select");if(b.className="voc-form-table-cell",h&&b.classList.add("form-control"),l.placeholder){let F=document.createElement("option");F.value="",F.textContent=l.placeholder,F.disabled=!0,(s[l.key]===void 0||s[l.key]===null||s[l.key]==="")&&(F.selected=!0),b.appendChild(F)}(l.options||[]).forEach(F=>{let D=document.createElement("option");D.value=F.value,D.textContent=F.label,b.appendChild(D)}),b.value=s[l.key]!==void 0&&s[l.key]!==null?String(s[l.key]):"",l.required&&(b.required=!0),b.addEventListener("change",F=>{r[n][l.key]=F.target.value,L()}),T=b}else if(q==="checkbox"){let b=document.createElement("div");b.className="voc-form-table-checkboxes",h&&b.classList.add("form-check");let B=l.options||[];Array.isArray(r[n][l.key])||(r[n][l.key]=r[n][l.key]?[r[n][l.key]]:[]),B.forEach(F=>{let D=`voc-form-${i.key}-${l.key}-${n}-${F.value}`,$=document.createElement("div");$.className="voc-form-table-checkbox-item",h&&$.classList.add("form-check");let M=document.createElement("input");M.type="checkbox",M.className="voc-form-table-cell",h&&M.classList.add("form-check-input"),M.id=D,M.value=F.value,M.checked=Array.isArray(r[n][l.key])&&r[n][l.key].includes(F.value),M.addEventListener("change",O=>{let J=O.target.checked;Array.isArray(r[n][l.key])||(r[n][l.key]=[]),J?r[n][l.key].includes(F.value)||r[n][l.key].push(F.value):r[n][l.key]=r[n][l.key].filter(U=>U!==F.value),L()});let _=document.createElement("label");_.htmlFor=D,_.className="voc-form-table-checkbox-label",h&&_.classList.add("form-check-label"),_.textContent=F.label,$.appendChild(M),$.appendChild(_),b.appendChild($)}),T=b}else if(q==="radio"){let b=document.createElement("div");b.className="voc-form-table-radios",h&&b.classList.add("form-check");let B=l.options||[];r[n][l.key]===void 0&&(r[n][l.key]=""),B.forEach(F=>{let D=`voc-form-${i.key}-${l.key}-${n}-${F.value}`,$=document.createElement("div");$.className="voc-form-table-radio-item",h&&$.classList.add("form-check");let M=document.createElement("input");M.type="radio",M.className="voc-form-table-cell",h&&M.classList.add("form-check-input"),M.id=D,M.name=`voc-form-${i.key}-${l.key}-${n}`,M.value=F.value,M.checked=r[n][l.key]===F.value,M.addEventListener("change",O=>{O.target.checked&&(r[n][l.key]=O.target.value,L())});let _=document.createElement("label");_.htmlFor=D,_.className="voc-form-table-radio-label",h&&_.classList.add("form-check-label"),_.textContent=F.label,$.appendChild(M),$.appendChild(_),b.appendChild($)}),T=b}else{let b=document.createElement("input");q==="number"?b.type="number":q==="email"?b.type="email":q==="tel"?b.type="tel":q==="url"?b.type="url":q==="date"?b.type="date":b.type="text",b.value=s[l.key]!==void 0&&s[l.key]!==null?String(s[l.key]):"",l.placeholder&&(b.placeholder=l.placeholder),l.required&&(b.required=!0),b.className="voc-form-table-cell",h&&b.classList.add("form-control"),b.addEventListener("input",B=>{r[n][l.key]=B.target.value,L()}),T=b}S.appendChild(T),o.appendChild(S)});let H=document.createElement("td"),R=document.createElement("button");R.type="button",R.className="voc-form-table-remove",h&&R.classList.add("btn","btn-danger"),R.textContent="Remove",R.addEventListener("click",()=>{r.splice(n,1),t(),L()}),H.appendChild(R),o.appendChild(H),N.appendChild(o)})}return x.addEventListener("click",()=>{if(i.validation?.max_rows!==void 0&&r.length>=i.validation.max_rows)return;let a={};i.fields.forEach(s=>a[s.key]=""),r.push(a),t(),L()}),Array.isArray(f)&&f.length?r=f.map(a=>({...a})):i.default&&Array.isArray(i.default)&&(r=i.default.map(a=>({...a}))),t(),L(),y.validate=function(){let a=[];return r.forEach((s,n)=>{let o=E(s);o.length&&a.push(`Row ${n+1}: ${o.join("; ")}`)}),i.validation?.min_rows!==void 0&&r.length<i.validation.min_rows&&a.push(`At least ${i.validation.min_rows} rows required`),i.validation?.max_rows!==void 0&&r.length>i.validation.max_rows&&a.push(`No more than ${i.validation.max_rows} rows allowed`),i.validation?.unique_fields&&i.validation.unique_fields.length&&i.validation.unique_fields.forEach(s=>{let n=new Set;r.forEach((o,k)=>{let A=o[s];A!=null&&(n.has(A)&&a.push(`Field ${s} must be unique (duplicate at row ${k+1})`),n.add(A))})}),a},y}function I(i,C=!0){let f=new FormData(i);if(C)return K(f);let y={};return f.forEach((h,m)=>{let g=(h instanceof File,h);Object.prototype.hasOwnProperty.call(y,m)?Array.isArray(y[m])?y[m].push(g):y[m]=[y[m],g]:y[m]=g}),y}function K(i){let C=new FormData;for(let[f,y]of i.entries()){if(y instanceof File){C.append(f,y);continue}let h;try{h=JSON.parse(y)}catch{h=null}Array.isArray(h)?h.length===0?C.append(f,"[]"):h.every(m=>typeof m=="object"&&m!==null)?h.forEach((m,g)=>{for(let[c,p]of Object.entries(m))C.append(`${f}[${g}][${c}]`,p)}):C.append(f,y):C.append(f,y)}return C}async function V(i,C,f){let y=C.url,h={"Content-Type":"application/json"};C?.api_token&&(h.Authorization=`Bearer ${C.api_token}`);let m=I(i);if(C?.additional_data)for(let[p,v]of Object.entries(C.additional_data))m.append(p,v);let g,c=m instanceof FormData;g={method:"POST",headers:{Authorization:`Bearer ${C.api_token}`,...c?{}:{"Content-Type":"application/json"},Accept:"application/json"},body:c?m:JSON.stringify(Object.fromEntries(m.entries()))};try{fetch(y,g).then(async p=>{let v=p.headers.get("content-type");if(!p.ok)try{let N=(await p.json())?.message;throw new Error(N??"Their was an error submitting the form. Check your form and try again.")}catch(d){throw new Error(d.message)}return v&&v.includes("application/json")?p.json():p.text()}).then(p=>{f&&f(p,null)}).catch(p=>{f&&f(null,p)})}catch(p){f&&f(null,p)}}function G(i,C,f){let y=[];if(typeof i=="string"?y=Array.from(document.querySelectorAll(i)):y=[i],y.length===0)return null;function h(){let c=f?.style==="bootstrap",p=document.createElement("form");p.classList.add("voc-form"),c&&p.classList.add("needs-validation"),p.id=C.id;let v=document.createElement("h2");v.className="voc-form-title",c&&v.classList.add("mb-3"),v.textContent=C.form_name,p.appendChild(v);function d(e,u){u&&(u.min_length!==void 0&&(e.minLength=u.min_length),u.max_length!==void 0&&(e.maxLength=u.max_length),u.regex&&(e instanceof HTMLInputElement?e.pattern=u.regex:e.dataset.pattern=u.regex))}function N(e){if(!e.key&&!e.label)return null;let u=C.default_values||{},w=e.name||e.key,r=w?u[w]:void 0,L=document.createElement("div");if(L.className="voc-form-group",c&&L.classList.add("mb-3"),e.label){let t=document.createElement("label");if(t.classList.add("voc-form-label"),c&&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 a=document.createElement("span");a.className="voc-form-required",a.textContent="*",t.appendChild(a)}L.appendChild(t)}let E=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((a,s)=>{let n=document.createElement("label");n.classList.add("voc-form-checkbox-label"),c&&n.classList.add("form-check"),n.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(n.style.width=e.width);let o=document.createElement("input");o.type="checkbox",o.classList.add("voc-form-checkbox"),c&&o.classList.add("form-check-input"),o.name=e.name||e.key||"",o.value=a.value,e.key&&(o.id=`voc-form-${e.key}-${s}`),e.required&&(o.required=!0),Array.isArray(r)?r.includes(a.value)&&(o.checked=!0):r!==void 0?r===a.value&&(o.checked=!0):e.default===a.value&&(o.checked=!0),n.appendChild(o),n.appendChild(document.createTextNode(a.label)),t.appendChild(n)});else{let a=document.createElement("label");a.classList.add("voc-form-checkbox-label"),c&&a.classList.add("form-check"),e.width&&(a.style.width=e.width);let s=document.createElement("input");s.type="checkbox",s.classList.add("voc-form-checkbox"),(e.key||e.name)&&(s.name=e.name||e.key,e.key&&(s.id=`voc-form-${e.key}`)),c&&s.classList.add("form-check-input"),e.required&&(s.required=!0),r!==void 0?s.checked=!!r:e.default&&(s.checked=!!e.default),a.appendChild(s),a.appendChild(document.createTextNode(e.label||"")),t.appendChild(a)}E=t;break}case"textarea":{let t=document.createElement("textarea");t.classList.add("voc-form-textarea"),c&&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 a=e.default||r||"";if(a){let s=(a.match(/\n/g)||[]).length,n=80,o=a.split(`
2
- `).reduce((H,R)=>Math.max(H,R.length),0),k=Math.ceil(o/n)||1,A=Math.max(2,s+k);t.rows=A,t.style.resize="vertical"}e.width&&(t.style.width=e.width),e.required&&(t.required=!0),d(t,e.validation),E=t;break}case"select":{let t=document.createElement("select");if(t.classList.add("voc-form-select"),c&&t.classList.add("form-select"),c&&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 a=document.createElement("option");a.value="",a.textContent=e.placeholder,a.disabled=!0,a.selected=!0,t.appendChild(a)}e.required&&(t.required=!0),e.options&&e.options.forEach(a=>{let s=document.createElement("option");s.value=a.value,s.textContent=a.label,Array.isArray(r)?r.includes(a.value)&&(s.selected=!0):r!==void 0?r===a.value&&(s.selected=!0):e.default===a.value&&(s.selected=!0),t.appendChild(s)}),e.width&&(t.style.width=e.width),E=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((a,s)=>{let n=document.createElement("label");n.classList.add("voc-form-radio-label"),c&&n.classList.add("form-check"),n.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(n.style.width=e.width);let o=document.createElement("input");o.type="radio",o.classList.add("voc-form-radio"),c&&o.classList.add("form-check-input"),o.name=e.name||e.key||"",o.value=a.value,e.key&&(o.id=`voc-form-${e.key}-${s}`),Array.isArray(r)?r.includes(a.value)&&(o.checked=!0):r!==void 0?r===a.value&&(o.checked=!0):e.default===a.value&&(o.checked=!0),n.appendChild(o),n.appendChild(document.createTextNode(a.label)),t.appendChild(n)}),E=t;break}case"file":{let t=document.createElement("div");t.className="voc-form-file-wrapper",e.width&&(t.style.width=e.width);let a=document.createElement("input");a.type="file",a.classList.add("voc-form-file"),c&&a.classList.add("form-control"),(e.key||e.name)&&(a.name=e.name||e.key,e.key&&(a.id=`voc-form-${e.key}`)),e.width&&(a.style.width=e.width),e.required&&(a.required=!0),e.accept&&(a.accept=e.accept),e.multiple&&(a.multiple=!0),t.appendChild(a),E=t;break}case"avatar":{E=P(e,f||{},r);break}case"table":{E=z(e,f||{},r);break}case"audio_select":{E=W(e,f||{},r);break}default:{let t=document.createElement("input");t.type=e.type||"text",t.classList.add("voc-form-input"),c&&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),d(t,e.validation),E=t;break}}if(E&&L.appendChild(E),e.hint_text){let t=document.createElement("small");t.className="voc-form-hint",t.textContent=e.hint_text,L.appendChild(t)}return L}C.fields.forEach(e=>{if(e.type==="group"&&"items"in e){let u=e;if(c){let w=document.createElement("div");w.className="card voc-form-group-card mb-3";let r=u.label||u.header?.title,L=u.description||u.header?.description;if(r||L){let t=document.createElement("div");if(t.className="card-header voc-form-group-head",r){let a=document.createElement("h5");a.className="mb-0 voc-form-group-label",a.textContent=r,t.appendChild(a)}if(L){let a=document.createElement("p");a.className="mb-0 voc-form-group-description",a.textContent=L,t.appendChild(a)}w.appendChild(t)}let E=document.createElement("div");E.className="card-body voc-form-group-body",u.items.forEach(t=>{if(t.type==="row"&&"items"in t){let a=t,s=document.createElement("div");if(s.className="voc-form-group voc-form-row mb-3",a.label){let o=document.createElement("h6");o.className="voc-form-row-label",o.textContent=a.label,s.appendChild(o)}let n=document.createElement("div");n.className="voc-form-row-items "+(a.direction||"horizontal"),a.items.forEach(o=>{let k=N(o);k&&n.appendChild(k)}),s.appendChild(n),E.appendChild(s)}else{let a=N(t);a&&E.appendChild(a)}}),w.appendChild(E),p.appendChild(w)}else{let w=document.createElement("div");w.className="voc-form-group voc-form-group-wrapper",c&&w.classList.add("mb-3");let r=u.label||u.header?.title,L=u.description||u.header?.description;if(r||L){let E=document.createElement("div");if(E.className="voc-form-group-head",r){let t=document.createElement("h3");t.className="voc-form-group-label",t.textContent=r,E.appendChild(t)}if(L){let t=document.createElement("p");t.className="voc-form-group-description",t.textContent=L,E.appendChild(t)}w.appendChild(E)}u.items.forEach(E=>{if(E.type==="row"&&"items"in E){let t=E,a=document.createElement("div");if(a.className="voc-form-group voc-form-row",c&&a.classList.add("mb-3"),t.label){let n=document.createElement("h4");n.className="voc-form-row-label",n.textContent=t.label,a.appendChild(n)}let s=document.createElement("div");s.className="voc-form-row-items "+(t.direction||"horizontal"),t.items.forEach(n=>{let o=N(n);o&&s.appendChild(o)}),a.appendChild(s),w.appendChild(a)}else{let t=N(E);t&&w.appendChild(t)}}),p.appendChild(w)}return}if(e.type==="row"&&"items"in e){let u=document.createElement("div");if(u.className="voc-form-group voc-form-row",c&&u.classList.add("mb-3"),e.label){let r=document.createElement("h3");r.className="voc-form-row-label",r.textContent=e.label,u.appendChild(r)}if(e.description){let r=document.createElement("p");r.className="voc-form-row-description",r.textContent=e.description,u.appendChild(r)}let w=document.createElement("div");w.className="voc-form-row-items "+(e.direction||"horizontal"),u.appendChild(w),e.items.forEach(r=>{let L=N(r);L&&w.appendChild(L)}),p.appendChild(u)}else{let u=N(e);u&&p.appendChild(u)}});let x=document.createElement("button");return x.type="submit",x.className="voc-form-submit",x.textContent="Submit",c&&x.classList.add("btn","btn-primary"),p.appendChild(x),p}let m=h();y[0].appendChild(m);let g=C?.submit_config??f?.submit_config??null;return g&&m.addEventListener("submit",c=>{if(c.preventDefault(),!m.checkValidity()){m.reportValidity(),f?.onSubmitResult&&f.onSubmitResult(null,new Error("Form validation failed"));return}let p=Array.from(m.querySelectorAll(" .voc-form-table-wrapper, .voc-form-table-wrapper")),v=[];if(p.forEach(d=>{if(d&&typeof d.validate=="function"){let N=d.validate();N&&N.length&&v.push(...N)}}),v.length){f?.onSubmitResult&&f.onSubmitResult(null,new Error(v.join("; ")));let d=p[0];d&&d.scrollIntoView({behavior:"smooth",block:"center"});return}if(f?.onSubmit){let d=I(m);f.onSubmit(d)}V(m,g,(d,N)=>{f?.onSubmitResult&&f.onSubmitResult(d,N)})}),{element:m,validate:()=>{let c=[];return m.querySelectorAll(":invalid").forEach(v=>{let d=v.validationMessage;c.push({element:v,message:d})}),c},getValues:()=>I(m),onSubmit:c=>{m.addEventListener("submit",p=>{p.preventDefault();let v=I(m);c(v,p)})}}}var j={renderForm:G};var me=j,ue={FormsLib:j};export{me as FormsLib,ue as default};
1
+ function j(s,L,f){let v=L?.style==="bootstrap",h=document.createElement("div");h.className="voc-form-avatar-wrapper",v&&h.classList.add("d-flex","align-items-center","gap-3");let d=document.createElement("img");d.className="voc-form-avatar-preview",d.alt=s.label||"avatar",v&&(d.classList.add("img-thumbnail","rounded-circle"),d.style.width=d.style.height="64px",d.style.objectFit="cover");let k=f!=null?String(f):s.default!==void 0&&s.default!==null?String(s.default):"";k?d.src=k:(d.src="",d.style.display="none");let c=document.createElement("input");c.type="file",c.accept=s.accept||"image/*",c.className="voc-form-avatar-input",v&&c.classList.add("form-control"),(s.key||s.name)&&(c.name=s.name||s.key,s.key&&(c.id=`voc-form-${s.key}`));let p=document.createElement("input");if(p.type="hidden",(s.key||s.name)&&(p.name=(s.name||s.key)+"_url"),p.value=k||"",c.addEventListener("change",b=>{let m=b.target;if(m.files&&m.files.length>0){let x=m.files[0],N=new FileReader;N.onload=()=>{d.src=String(N.result),d.style.display="",p.value=""},N.readAsDataURL(x)}}),v){let b=document.createElement("div");b.style.flex="1",b.appendChild(c),b.appendChild(p),h.appendChild(d),h.appendChild(b)}else h.appendChild(d),h.appendChild(c),h.appendChild(p);return h}function W(s,L,f){let v=L?.style==="bootstrap",h=document.createElement("div");if(h.className="voc-form-audio-select",!s.options||s.options.length===0)return h;let d=s.name||s.key||`audio_select_${Math.random().toString(36).substr(2,6)}`,k;return Array.isArray(f)?k=f[0]:f!==void 0?k=f:s.default!==void 0&&(k=s.default),s.options.forEach((c,p)=>{let b=document.createElement("div");b.className="voc-form-audio-item",v&&b.classList.add("form-check");let m=document.createElement("input");m.type="radio",m.name=d,m.value=c.value,m.className="voc-form-audio-radio",s.key&&(m.id=`voc-form-${s.key}-${p}`),s.required&&p===0&&(m.required=!0),m.style.position="absolute",m.style.width="1px",m.style.height="1px",m.style.margin="0",m.style.padding="0",m.style.clip="rect(0 0 0 0)",m.style.clipPath="inset(50%)",m.style.overflow="hidden",m.style.border="0",k!==void 0&&(Array.isArray(k)?m.checked=k.includes(c.value):m.checked=String(k)===String(c.value));let x=()=>{m.checked?b.classList.add("selected"):b.classList.remove("selected")};m.addEventListener("change",()=>{h.querySelectorAll(".voc-form-audio-item").forEach(n=>n.classList.remove("selected")),x()}),m.checked&&b.classList.add("selected");let N=document.createElement("label");N.className="voc-form-audio-label",v&&N.classList.add("form-check-label"),N.htmlFor=m.id||"",N.textContent=c.label||c.value,N.tabIndex=0;let e=document.createElement("div");e.className="voc-form-audio-control";let l=null;if(c.audio_link){let t=document.createElement("button");t.type="button",t.className="voc-form-audio-play",v&&t.classList.add("btn","btn-sm","btn-outline-secondary"),t.setAttribute("aria-label",`Play ${c.label||c.value}`);let n="http://www.w3.org/2000/svg",i=document.createElementNS(n,"svg");i.setAttribute("viewBox","0 0 24 24"),i.setAttribute("width","16"),i.setAttribute("height","16"),i.setAttribute("aria-hidden","true");let r=document.createElementNS(n,"path");r.setAttribute("d","M8 5v14l11-7z"),r.setAttribute("fill","currentColor"),i.appendChild(r),t.appendChild(i),l=document.createElement("audio"),l.src=c.audio_link,l.preload="none",l.style.display="none";let o=u=>{for(;u.firstChild;)u.removeChild(u.firstChild)},C=()=>{let u="http://www.w3.org/2000/svg",S=document.createElementNS(u,"svg");S.setAttribute("viewBox","0 0 24 24"),S.setAttribute("width","16"),S.setAttribute("height","16"),S.setAttribute("aria-hidden","true");let A=document.createElementNS(u,"path");return A.setAttribute("d","M8 5v14l11-7z"),A.setAttribute("fill","currentColor"),S.appendChild(A),S},F=()=>{let u="http://www.w3.org/2000/svg",S=document.createElementNS(u,"svg");S.setAttribute("viewBox","0 0 24 24"),S.setAttribute("width","16"),S.setAttribute("height","16"),S.setAttribute("aria-hidden","true");let A=document.createElementNS(u,"rect");return A.setAttribute("x","6"),A.setAttribute("y","6"),A.setAttribute("width","12"),A.setAttribute("height","12"),A.setAttribute("fill","currentColor"),S.appendChild(A),S};o(t),t.appendChild(C());let R=u=>{o(t),u?(t.appendChild(F()),t.setAttribute("aria-label",`Stop ${c.label||c.value}`)):(t.appendChild(C()),t.setAttribute("aria-label",`Play ${c.label||c.value}`))};t.addEventListener("click",()=>{try{if(!l)return;let u=h.querySelectorAll("audio");if(!l.paused&&!l.ended){l.pause(),l.currentTime=0;return}u.forEach(A=>{try{A.pause(),A.currentTime=0}catch{}}),h.querySelectorAll(".voc-form-audio-item").forEach(A=>A.classList.remove("is-playing")),l.play()}catch(u){console.warn("audio play failed",u)}}),l.addEventListener("playing",()=>{b.classList.add("is-playing"),R(!0)});let H=()=>{b.classList.remove("is-playing"),R(!1)};l.addEventListener("pause",H),l.addEventListener("ended",H),e.appendChild(t),e.appendChild(l)}let y=document.createElement("div");y.className="voc-form-item-detail",y.style.display="flex",y.style.flexDirection="column",y.style.gap="4px";let a=document.createElement("div");a.className="voc-form-item-top",a.style.display="flex",a.style.alignItems="center",a.style.gap="8px",a.appendChild(m),a.appendChild(N);let g=document.createElement("div");g.className="voc-form-item-description";let E=c.description||c.hint_text||"";E&&(g.textContent=E),y.appendChild(a),y.appendChild(g),e.appendChild(y),b.appendChild(e),a.addEventListener("click",t=>{let n=t.target;n&&n.closest(".voc-form-audio-play")||(m.checked=!0,m.dispatchEvent(new Event("change",{bubbles:!0})))}),b.addEventListener("click",t=>{let n=t.target;n&&n.closest(".voc-form-audio-play")||(m.checked=!0,m.dispatchEvent(new Event("change",{bubbles:!0})))}),h.appendChild(b)}),h}function z(s,L,f){let v=document.createElement("div");v.className="voc-form-table-wrapper";let h=L?.style==="bootstrap",d=document.createElement("input");d.type="hidden",d.name=s.name||s.key,s.key&&(d.id=`voc-form-${s.key}`),v.appendChild(d);let k=document.createElement("table");k.className="voc-form-table",h&&k.classList.add("table","table-bordered");let c=document.createElement("thead"),p=document.createElement("tr"),b=document.createElement("th");b.className="voc-form-table-drag-col",b.textContent="",p.appendChild(b),(s.fields||[]).forEach(n=>{let i=document.createElement("th");i.textContent=n.label||n.key,p.appendChild(i)});let m=document.createElement("th");m.textContent="Actions",p.appendChild(m),c.appendChild(p),k.appendChild(c);let x=document.createElement("tbody");k.appendChild(x),v.appendChild(k);let N=document.createElement("button");N.type="button",N.className="voc-form-table-add",h&&N.classList.add("btn","btn-secondary"),N.textContent="+Add";let e=document.createElement("tfoot"),l=document.createElement("tr"),y=document.createElement("td");y.colSpan=(s.fields?s.fields.length:0)+1,y.appendChild(N),l.appendChild(y),e.appendChild(l),k.appendChild(e),v.appendChild(k);let a=[];function g(){d.value=JSON.stringify(a)}function E(n){let i=[];return s.fields.forEach(r=>{let o=n[r.key];if(r.type==="checkbox"){let C=Array.isArray(o)?o:o?[o]:[];r.required&&C.length===0&&i.push(`${r.label||r.key} is required`);return}r.required&&(o==null||String(o).trim()==="")&&i.push(`${r.label||r.key} is required`),r.type==="email"&&o&&(/^\S+@\S+\.\S+$/.test(String(o))||i.push(`${r.label||r.key} must be a valid email`)),r.type==="number"&&o&&isNaN(Number(o))&&i.push(`${r.label||r.key} must be a number`),r.validation&&r.validation.regex&&o&&(new RegExp(r.validation.regex).test(String(o))||i.push(`${r.label||r.key} invalid format`))}),i}function t(){x.innerHTML="";let n=(i,r)=>{r.draggable=!0,r.addEventListener("mousedown",()=>{r.style.cursor="grabbing"}),r.addEventListener("mouseup",()=>{r.style.cursor="grab"}),r.addEventListener("dragstart",o=>{let C=Number(i.dataset.rowIndex);o.dataTransfer.setData("text/plain",String(C)),i.classList.add("dragging");try{o.dataTransfer?.setDragImage(r,10,10)}catch{}}),r.addEventListener("dragend",()=>{i.classList.remove("dragging"),r.style.cursor="grab"}),i.addEventListener("dragover",o=>{o.preventDefault();let C=o.currentTarget,F=C.getBoundingClientRect(),R=F.top+F.height/2,H=(o.clientY||o.y)>R;C.classList.remove("drag-over-top","drag-over-bottom"),H?(C.classList.add("drag-over-bottom"),C.dataset.dropPosition="after"):(C.classList.add("drag-over-top"),C.dataset.dropPosition="before")}),i.addEventListener("dragleave",o=>{let C=o.currentTarget;C.classList.remove("drag-over-top","drag-over-bottom"),delete C.dataset.dropPosition}),i.addEventListener("drop",o=>{o.preventDefault();let C=o.dataTransfer.getData("text/plain"),F=Number(o.currentTarget.dataset.rowIndex),R=Number(C),H=o.currentTarget.dataset.dropPosition||"before";if(isNaN(R)||isNaN(F))return;let[u]=a.splice(R,1),S=F;R<F&&(S=F-1);let A=H==="after"?S+1:S;a.splice(A,0,u),o.currentTarget.classList.remove("drag-over-top","drag-over-bottom"),delete o.currentTarget.dataset.dropPosition,t(),g()})};a.forEach((i,r)=>{let o=document.createElement("tr");o.dataset.rowIndex=String(r),o.classList.add("voc-form-table-row");let C=document.createElement("td");C.className="voc-form-table-drag-handle";let F=document.createElement("span");F.className="voc-form-drag-handle-icon",F.textContent="\u2630",F.style.cursor="grab",C.appendChild(F),o.appendChild(C),n(o,F),s.fields.forEach(u=>{let S=document.createElement("td"),A,_=(u.type||"text").toLowerCase();if(_==="select"){let w=document.createElement("select");if(w.className="voc-form-table-cell",h&&w.classList.add("form-control"),u.placeholder){let T=document.createElement("option");T.value="",T.textContent=u.placeholder,T.disabled=!0,(i[u.key]===void 0||i[u.key]===null||i[u.key]==="")&&(T.selected=!0),w.appendChild(T)}(u.options||[]).forEach(T=>{let D=document.createElement("option");D.value=T.value,D.textContent=T.label,w.appendChild(D)}),w.value=i[u.key]!==void 0&&i[u.key]!==null?String(i[u.key]):"",u.required&&(w.required=!0),w.addEventListener("change",T=>{a[r][u.key]=T.target.value,g()}),A=w}else if(_==="checkbox"){let w=document.createElement("div");w.className="voc-form-table-checkboxes",h&&w.classList.add("form-check");let B=u.options||[];Array.isArray(a[r][u.key])||(a[r][u.key]=a[r][u.key]?[a[r][u.key]]:[]),B.forEach(T=>{let D=`voc-form-${s.key}-${u.key}-${r}-${T.value}`,$=document.createElement("div");$.className="voc-form-table-checkbox-item",h&&$.classList.add("form-check");let M=document.createElement("input");M.type="checkbox",M.className="voc-form-table-cell",h&&M.classList.add("form-check-input"),M.id=D,M.value=T.value,M.checked=Array.isArray(a[r][u.key])&&a[r][u.key].includes(T.value),M.addEventListener("change",O=>{let V=O.target.checked;Array.isArray(a[r][u.key])||(a[r][u.key]=[]),V?a[r][u.key].includes(T.value)||a[r][u.key].push(T.value):a[r][u.key]=a[r][u.key].filter(K=>K!==T.value),g()});let q=document.createElement("label");q.htmlFor=D,q.className="voc-form-table-checkbox-label",h&&q.classList.add("form-check-label"),q.textContent=T.label,$.appendChild(M),$.appendChild(q),w.appendChild($)}),A=w}else if(_==="radio"){let w=document.createElement("div");w.className="voc-form-table-radios",h&&w.classList.add("form-check");let B=u.options||[];a[r][u.key]===void 0&&(a[r][u.key]=""),B.forEach(T=>{let D=`voc-form-${s.key}-${u.key}-${r}-${T.value}`,$=document.createElement("div");$.className="voc-form-table-radio-item",h&&$.classList.add("form-check");let M=document.createElement("input");M.type="radio",M.className="voc-form-table-cell",h&&M.classList.add("form-check-input"),M.id=D,M.name=`voc-form-${s.key}-${u.key}-${r}`,M.value=T.value,M.checked=a[r][u.key]===T.value,M.addEventListener("change",O=>{O.target.checked&&(a[r][u.key]=O.target.value,g())});let q=document.createElement("label");q.htmlFor=D,q.className="voc-form-table-radio-label",h&&q.classList.add("form-check-label"),q.textContent=T.label,$.appendChild(M),$.appendChild(q),w.appendChild($)}),A=w}else{let w=document.createElement("input");_==="number"?w.type="number":_==="email"?w.type="email":_==="tel"?w.type="tel":_==="url"?w.type="url":_==="date"?w.type="date":w.type="text",w.value=i[u.key]!==void 0&&i[u.key]!==null?String(i[u.key]):"",u.placeholder&&(w.placeholder=u.placeholder),u.required&&(w.required=!0),w.className="voc-form-table-cell",h&&w.classList.add("form-control"),w.addEventListener("input",B=>{a[r][u.key]=B.target.value,g()}),A=w}S.appendChild(A),o.appendChild(S)});let R=document.createElement("td"),H=document.createElement("button");H.type="button",H.className="voc-form-table-remove",h&&H.classList.add("btn","btn-danger"),H.textContent="Remove",H.addEventListener("click",()=>{a.splice(r,1),t(),g()}),R.appendChild(H),o.appendChild(R),x.appendChild(o)})}return N.addEventListener("click",()=>{if(s.validation?.max_rows!==void 0&&a.length>=s.validation.max_rows)return;let n={};s.fields.forEach(i=>n[i.key]=""),a.push(n),t(),g()}),Array.isArray(f)&&f.length?a=f.map(n=>({...n})):s.default&&Array.isArray(s.default)&&(a=s.default.map(n=>({...n}))),t(),g(),v.validate=function(){let n=[];return a.forEach((i,r)=>{let o=E(i);o.length&&n.push(`Row ${r+1}: ${o.join("; ")}`)}),s.validation?.min_rows!==void 0&&a.length<s.validation.min_rows&&n.push(`At least ${s.validation.min_rows} rows required`),s.validation?.max_rows!==void 0&&a.length>s.validation.max_rows&&n.push(`No more than ${s.validation.max_rows} rows allowed`),s.validation?.unique_fields&&s.validation.unique_fields.length&&s.validation.unique_fields.forEach(i=>{let r=new Set;a.forEach((o,C)=>{let F=o[i];F!=null&&(r.has(F)&&n.push(`Field ${i} must be unique (duplicate at row ${C+1})`),r.add(F))})}),n},v}async function Y(s){let f=new TextEncoder().encode(s),v=await crypto.subtle.digest("SHA-256",f);return Array.from(new Uint8Array(v)).map(d=>d.toString(16).padStart(2,"0")).join("")}async function Q(s){let L=String(s||"").trim().toLowerCase();return L?`https://gravatar.com/avatar/${await Y(L)}?d=mp`:""}function G(s,L,f){let v=L?.style==="bootstrap",h=document.createElement("div");h.className="voc-form-users";let d=document.createElement("div");if(d.className="voc-form-users-header",v&&d.classList.add("mb-2"),s.label){let e=document.createElement("div");if(e.className="voc-form-users-label",v&&e.classList.add("form-label"),e.textContent=s.label,s.required){let l=document.createElement("span");l.className="voc-form-required",l.textContent="*",e.appendChild(l)}d.appendChild(e)}if(s.description){let e=document.createElement("div");e.className="voc-form-users-description",v&&e.classList.add("form-text"),e.textContent=s.description,d.appendChild(e)}h.appendChild(d);let k=document.createElement("div");k.className="voc-form-users-search-wrapper";let c=document.createElement("input");if(c.type="search",c.placeholder="Search users...",c.className="voc-form-users-search",v&&c.classList.add("form-control","mb-2"),k.appendChild(c),h.appendChild(k),!s.options||s.options.length===0)return h;let p=document.createElement("div");p.className="voc-form-users-list",v&&p.classList.add("list-group");let b=s.name||s.key||`users_${Math.random().toString(36).substr(2,6)}`,m=[];Array.isArray(f)?m=f:f!=null?m=[f]:Array.isArray(s.default)&&(m=s.default),s.options.forEach((e,l)=>{let y=document.createElement("div");y.className="voc-form-user-item",y.dataset.label=String(e.label||"").toLowerCase(),y.dataset.email=String(e.email||"").toLowerCase(),y.dataset.value=String(e.value||"").toLowerCase(),v&&y.classList.add("d-flex","align-items-center","gap-2");let a=document.createElement("input");a.type="checkbox",a.name=`${b}[]`,a.value=e.value,a.className="voc-form-user-checkbox",s.key&&(a.id=`voc-form-${s.key}-${l}`),s.required&&l===0&&(a.required=!0),a.style.position="absolute",a.style.width="1px",a.style.height="1px",a.style.margin="0",a.style.padding="0",a.style.clip="rect(0 0 0 0)",a.style.clipPath="inset(50%)",a.style.overflow="hidden",a.style.border="0",m&&Array.isArray(m)&&(a.checked=m.includes(e.value));let g=document.createElement("img");g.className="voc-form-user-avatar",g.alt=e.label||String(e.value||"user"),g.style.width=g.style.height="40px",g.style.objectFit="cover",g.style.borderRadius="50%",g.src="",e.email&&Q(e.email).then(i=>{i&&(g.src=i)}).catch(()=>{});let E=document.createElement("div");E.className="voc-form-user-info",E.style.display="flex",E.style.flexDirection="column",E.style.gap="2px";let t=document.createElement("div");t.className="voc-form-user-label",t.textContent=e.label||String(e.value);let n=document.createElement("small");n.className="voc-form-user-email",n.textContent=e.email||"",E.appendChild(t),E.appendChild(n),y.addEventListener("click",i=>{let r=i.target;r&&(r.closest("input")||r.closest("a")||r.closest("button"))||(a.checked=!a.checked,a.dispatchEvent(new Event("change",{bubbles:!0})))}),a.addEventListener("change",()=>{a.checked?y.classList.add("selected"):y.classList.remove("selected")}),a.checked&&y.classList.add("selected"),y.appendChild(a),y.appendChild(g),y.appendChild(E),p.appendChild(y)}),h.appendChild(p);let x=Array.from(p.querySelectorAll(".voc-form-user-item")),N=()=>{let e=String(c.value||"").trim().toLowerCase();if(!e){x.forEach(l=>l.style.setProperty("display","flex","important"));return}x.forEach(l=>{let y=l.dataset.label||"",a=l.dataset.email||"",g=l.dataset.value||"",E=y.includes(e)||a.includes(e)||g.includes(e);l.style.setProperty("display",E?"flex":"none","important")})};return c.addEventListener("input",N),h}function I(s,L=!0){let f=new FormData(s);if(L)return X(f);let v={};return f.forEach((h,d)=>{let k=(h instanceof File,h);Object.prototype.hasOwnProperty.call(v,d)?Array.isArray(v[d])?v[d].push(k):v[d]=[v[d],k]:v[d]=k}),v}function X(s){let L=new FormData;for(let[f,v]of s.entries()){if(v instanceof File){L.append(f,v);continue}let h;try{h=JSON.parse(v)}catch{h=null}Array.isArray(h)?h.length===0?L.append(f,"[]"):h.every(d=>typeof d=="object"&&d!==null)?h.forEach((d,k)=>{for(let[c,p]of Object.entries(d))L.append(`${f}[${k}][${c}]`,p)}):L.append(f,v):L.append(f,v)}return L}async function U(s,L,f){let v=L.url,h={"Content-Type":"application/json"};L?.api_token&&(h.Authorization=`Bearer ${L.api_token}`);let d=I(s);if(L?.additional_data)for(let[p,b]of Object.entries(L.additional_data))d.append(p,b);let k,c=d instanceof FormData;k={method:"POST",headers:{Authorization:`Bearer ${L.api_token}`,...c?{}:{"Content-Type":"application/json"},Accept:"application/json"},body:c?d:JSON.stringify(Object.fromEntries(d.entries()))};try{fetch(v,k).then(async p=>{let b=p.headers.get("content-type");if(!p.ok)try{let x=(await p.json())?.message;throw new Error(x??"Their was an error submitting the form. Check your form and try again.")}catch(m){throw new Error(m.message)}return b&&b.includes("application/json")?p.json():p.text()}).then(p=>{f&&f(p,null)}).catch(p=>{f&&f(null,p)})}catch(p){f&&f(null,p)}}function J(s,L,f){let v=[];if(typeof s=="string"?v=Array.from(document.querySelectorAll(s)):v=[s],v.length===0)return null;function h(){let c=f?.style==="bootstrap",p=document.createElement("form");p.classList.add("voc-form"),c&&p.classList.add("needs-validation"),p.id=L.id;let b=document.createElement("h2");b.className="voc-form-title",c&&b.classList.add("mb-3"),b.textContent=L.form_name,p.appendChild(b);function m(e,l){l&&(l.min_length!==void 0&&(e.minLength=l.min_length),l.max_length!==void 0&&(e.maxLength=l.max_length),l.regex&&(e instanceof HTMLInputElement?e.pattern=l.regex:e.dataset.pattern=l.regex))}function x(e){if(!e.key&&!e.label)return null;let l=L.default_values||{},y=e.name||e.key,a=y?l[y]:void 0,g=document.createElement("div");if(g.className="voc-form-group",c&&g.classList.add("mb-3"),e.label&&e.type!=="users"){let t=document.createElement("label");if(t.classList.add("voc-form-label"),c&&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)}g.appendChild(t)}let E=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,i)=>{let r=document.createElement("label");r.classList.add("voc-form-checkbox-label"),c&&r.classList.add("form-check"),r.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(r.style.width=e.width);let o=document.createElement("input");o.type="checkbox",o.classList.add("voc-form-checkbox"),c&&o.classList.add("form-check-input"),o.name=e.name||e.key||"",o.value=n.value,e.key&&(o.id=`voc-form-${e.key}-${i}`),e.required&&(o.required=!0),Array.isArray(a)?a.includes(n.value)&&(o.checked=!0):a!==void 0?a===n.value&&(o.checked=!0):e.default===n.value&&(o.checked=!0),r.appendChild(o),r.appendChild(document.createTextNode(n.label)),t.appendChild(r)});else{let n=document.createElement("label");n.classList.add("voc-form-checkbox-label"),c&&n.classList.add("form-check"),e.width&&(n.style.width=e.width);let i=document.createElement("input");i.type="checkbox",i.classList.add("voc-form-checkbox"),(e.key||e.name)&&(i.name=e.name||e.key,e.key&&(i.id=`voc-form-${e.key}`)),c&&i.classList.add("form-check-input"),e.required&&(i.required=!0),a!==void 0?i.checked=!!a:e.default&&(i.checked=!!e.default),n.appendChild(i),n.appendChild(document.createTextNode(e.label||"")),t.appendChild(n)}E=t;break}case"textarea":{let t=document.createElement("textarea");t.classList.add("voc-form-textarea"),c&&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),a!=null?t.value=String(a):e.default!==void 0&&e.default!==null&&(t.value=String(e.default));let n=e.default||a||"";if(n){let i=(n.match(/\n/g)||[]).length,r=80,o=n.split(`
2
+ `).reduce((R,H)=>Math.max(R,H.length),0),C=Math.ceil(o/r)||1,F=Math.max(2,i+C);t.rows=F,t.style.resize="vertical"}e.width&&(t.style.width=e.width),e.required&&(t.required=!0),m(t,e.validation),E=t;break}case"select":{let t=document.createElement("select");if(t.classList.add("voc-form-select"),c&&t.classList.add("form-select"),c&&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 i=document.createElement("option");i.value=n.value,i.textContent=n.label,Array.isArray(a)?a.includes(n.value)&&(i.selected=!0):a!==void 0?a===n.value&&(i.selected=!0):e.default===n.value&&(i.selected=!0),t.appendChild(i)}),e.width&&(t.style.width=e.width),E=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,i)=>{let r=document.createElement("label");r.classList.add("voc-form-radio-label"),c&&r.classList.add("form-check"),r.style.display=e.direction==="horizontal"?"inline-block":"block",e.width&&(r.style.width=e.width);let o=document.createElement("input");o.type="radio",o.classList.add("voc-form-radio"),c&&o.classList.add("form-check-input"),o.name=e.name||e.key||"",o.value=n.value,e.key&&(o.id=`voc-form-${e.key}-${i}`),Array.isArray(a)?a.includes(n.value)&&(o.checked=!0):a!==void 0?a===n.value&&(o.checked=!0):e.default===n.value&&(o.checked=!0),r.appendChild(o),r.appendChild(document.createTextNode(n.label)),t.appendChild(r)}),E=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"),c&&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),E=t;break}case"avatar":{E=j(e,f||{},a);break}case"table":{E=z(e,f||{},a);break}case"users":{E=G(e,f||{},a);break}case"audio_select":{E=W(e,f||{},a);break}default:{let t=document.createElement("input");t.type=e.type||"text",t.classList.add("voc-form-input"),c&&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),a!=null?t.value=String(a):e.default!==void 0&&e.default!==null&&(t.value=String(e.default)),e.width&&(t.style.width=e.width),e.required&&(t.required=!0),m(t,e.validation),E=t;break}}if(E&&g.appendChild(E),e.hint_text){let t=document.createElement("small");t.className="voc-form-hint",t.textContent=e.hint_text,g.appendChild(t)}return g}L.fields.forEach(e=>{if(e.type==="group"&&"items"in e){let l=e;if(c){let y=document.createElement("div");y.className="card voc-form-group-card mb-3";let a=l.label||l.header?.title,g=l.description||l.header?.description;if(a||g){let t=document.createElement("div");if(t.className="card-header voc-form-group-head",a){let n=document.createElement("h5");n.className="mb-0 voc-form-group-label",n.textContent=a,t.appendChild(n)}if(g){let n=document.createElement("p");n.className="mb-0 voc-form-group-description",n.textContent=g,t.appendChild(n)}y.appendChild(t)}let E=document.createElement("div");E.className="card-body voc-form-group-body",l.items.forEach(t=>{if(t.type==="row"&&"items"in t){let n=t,i=document.createElement("div");if(i.className="voc-form-group voc-form-row mb-3",n.label){let o=document.createElement("h6");o.className="voc-form-row-label",o.textContent=n.label,i.appendChild(o)}let r=document.createElement("div");r.className="voc-form-row-items "+(n.direction||"horizontal"),n.items.forEach(o=>{let C=x(o);C&&r.appendChild(C)}),i.appendChild(r),E.appendChild(i)}else{let n=x(t);n&&E.appendChild(n)}}),y.appendChild(E),p.appendChild(y)}else{let y=document.createElement("div");y.className="voc-form-group voc-form-group-wrapper",c&&y.classList.add("mb-3");let a=l.label||l.header?.title,g=l.description||l.header?.description;if(a||g){let E=document.createElement("div");if(E.className="voc-form-group-head",a){let t=document.createElement("h3");t.className="voc-form-group-label",t.textContent=a,E.appendChild(t)}if(g){let t=document.createElement("p");t.className="voc-form-group-description",t.textContent=g,E.appendChild(t)}y.appendChild(E)}l.items.forEach(E=>{if(E.type==="row"&&"items"in E){let t=E,n=document.createElement("div");if(n.className="voc-form-group voc-form-row",c&&n.classList.add("mb-3"),t.label){let r=document.createElement("h4");r.className="voc-form-row-label",r.textContent=t.label,n.appendChild(r)}let i=document.createElement("div");i.className="voc-form-row-items "+(t.direction||"horizontal"),t.items.forEach(r=>{let o=x(r);o&&i.appendChild(o)}),n.appendChild(i),y.appendChild(n)}else{let t=x(E);t&&y.appendChild(t)}}),p.appendChild(y)}return}if(e.type==="row"&&"items"in e){let l=document.createElement("div");if(l.className="voc-form-group voc-form-row",c&&l.classList.add("mb-3"),e.label){let a=document.createElement("h3");a.className="voc-form-row-label",a.textContent=e.label,l.appendChild(a)}if(e.description){let a=document.createElement("p");a.className="voc-form-row-description",a.textContent=e.description,l.appendChild(a)}let y=document.createElement("div");y.className="voc-form-row-items "+(e.direction||"horizontal"),l.appendChild(y),e.items.forEach(a=>{let g=x(a);g&&y.appendChild(g)}),p.appendChild(l)}else{let l=x(e);l&&p.appendChild(l)}});let N=document.createElement("button");return N.type="submit",N.className="voc-form-submit",N.textContent="Submit",c&&N.classList.add("btn","btn-primary"),p.appendChild(N),p}let d=h();v[0].appendChild(d);let k=L?.submit_config??f?.submit_config??null;return k&&d.addEventListener("submit",c=>{if(c.preventDefault(),!d.checkValidity()){d.reportValidity(),f?.onSubmitResult&&f.onSubmitResult(null,new Error("Form validation failed"));return}let p=Array.from(d.querySelectorAll(" .voc-form-table-wrapper, .voc-form-table-wrapper")),b=[];if(p.forEach(m=>{if(m&&typeof m.validate=="function"){let x=m.validate();x&&x.length&&b.push(...x)}}),b.length){f?.onSubmitResult&&f.onSubmitResult(null,new Error(b.join("; ")));let m=p[0];m&&m.scrollIntoView({behavior:"smooth",block:"center"});return}if(f?.onSubmit){let m=I(d);f.onSubmit(m)}U(d,k,(m,x)=>{f?.onSubmitResult&&f.onSubmitResult(m,x)})}),{element:d,validate:()=>{let c=[];return d.querySelectorAll(":invalid").forEach(b=>{let m=b.validationMessage;c.push({element:b,message:m})}),c},getValues:()=>I(d),onSubmit:c=>{d.addEventListener("submit",p=>{p.preventDefault();let b=I(d);c(b,p)})}}}var P={renderForm:J};var ye=P,ve={FormsLib:P};export{ye as FormsLib,ve as default};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "voc-lib-js",
3
- "version": "1.0.54",
3
+ "version": "1.0.56",
4
4
  "description": "A JavaScript library for VocPhone",
5
5
  "main": "./dist/main.cjs",
6
6
  "module": "./dist/main.mjs",