UNPKG

vue-csv-processor

Version:

Vue 3 component library for CSV file processing with encoding detection and preview

3 lines (2 loc) 23 kB
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue")):"function"==typeof define&&define.amd?define(["exports","vue"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).VueCsvProcessor={},e.Vue)}(this,(function(e,t){"use strict";function l(e,t={}){const{hasHeaders:l=!0,delimiter:a="",trimFields:o=!0,encoding:n="UTF-8",skipEmptyLines:r=!0}=t;let s;s=e instanceof ArrayBuffer?new TextDecoder(n).decode(e):e,65279===s.charCodeAt(0)&&(s=s.slice(1));const c=[];let i=[],d="",u=!1;for(let v=0;v<s.length;v++){const e=s.charAt(v),t=v<s.length-1?s.charAt(v+1):"";'"'===e?u&&'"'===t?(d+='"',v++):u=!u:e!==a&&(""!==a||","!==e)||u?"\n"!==e&&("\r"!==e||"\n"!==t)||u?d+=e:("\r"===e&&v++,o?i.push(d.trim()):i.push(d),r&&!i.some((e=>e.length>0))||c.push(i),i=[],d=""):(o?i.push(d.trim()):i.push(d),d="")}if((d.length>0||i.length>0)&&(o?i.push(d.trim()):i.push(d),r&&!i.some((e=>e.length>0))||c.push(i)),0===c.length)return{data:[],headers:[],errors:["Empty CSV content"]};let p=[],m=[],g=[];return l&&c.length>0?(p=c[0],c.shift()):!l&&c.length>0&&(p=c[0].map(((e,t)=>`Column ${t+1}`))),m=c.map(((e,t)=>{const l={};return e.length!==p.length&&(g.push(`Line ${t+1} has ${e.length} fields, expected ${p.length}`),e=e.length<p.length?[...e,...Array(p.length-e.length).fill("")]:e.slice(0,p.length)),p.forEach(((t,a)=>{a<e.length?l[t]=e[a]:l[t]=""})),l})),{data:m,headers:p,errors:g}}const a=[{value:"UTF-8",label:"UTF-8 (Standard)"},{value:"ISO-8859-1",label:"ISO-8859-1 (Latin-1)"},{value:"windows-1252",label:"Windows-1252 (Western European)"},{value:"ISO-8859-15",label:"ISO-8859-15 (Latin-9)"},{value:"macintosh",label:"Mac Roman"},{value:"windows-1251",label:"Windows-1251 (Cyrillic)"},{value:"ISO-8859-2",label:"ISO-8859-2 (Central European)"},{value:"ISO-8859-5",label:"ISO-8859-5 (Cyrillic)"}];function o(e){const t=function(e){const t=new Uint8Array(e.slice(0,4));return 239===t[0]&&187===t[1]&&191===t[2]?"UTF-8":255===t[0]&&254===t[1]?"UTF-16LE":254===t[0]&&255===t[1]?"UTF-16BE":255===t[0]&&254===t[1]&&0===t[2]&&0===t[3]?"UTF-32LE":0===t[0]&&0===t[1]&&254===t[2]&&255===t[3]?"UTF-32BE":null}(e);if(t)return t;const l=new Uint8Array(e);let a=!0,o=!1;for(let n=0;n<l.length;n++){const e=l[n];if(e>127)if(o=!0,e>=192&&e<=223){if(n+1>=l.length||128!=(192&l[n+1])){a=!1;break}n+=1}else if(e>=224&&e<=239){if(n+2>=l.length||128!=(192&l[n+1])||128!=(192&l[n+2])){a=!1;break}n+=2}else{if(!(e>=240&&e<=247)){a=!1;break}if(n+3>=l.length||128!=(192&l[n+1])||128!=(192&l[n+2])||128!=(192&l[n+3])){a=!1;break}n+=3}}return a&&o?"UTF-8":"windows-1252"}const n=(e,t)=>{const l=e.__vccOpts||e;for(const[a,o]of t)l[a]=o;return l},r=t.defineComponent({name:"VueCsvProcessor",props:{modelValue:{type:Array,default:()=>[]},fields:{type:Object,required:!0},text:{type:Object,default:()=>({errors:{fileRequired:"A file is required",invalidMimeType:"Invalid file type",encodingError:"Error processing file with selected encoding"},toggleHeaders:"File has headers",submitBtn:"Submit",fieldColumn:"Field",csvColumn:"Column",encoding:"Text Encoding"})},autoMatch:{type:Boolean,default:!0},defaultEncoding:{type:String,default:"UTF-8"}},emits:["update:modelValue","file-loaded","encoding-changed","headers-toggled","data-updated","mapping-updated"],setup(e,{emit:n}){const r=t.ref(null),s=t.ref(null),c=t.ref(""),i=t.ref(!0),d=t.ref([]),u=t.ref([]),p=t.ref([]),m=t.ref(e.defaultEncoding),g=t.ref(a),v=t.reactive({}),f=t.computed((()=>d.value&&d.value.length?d.value.map((e=>{const t={};return Object.keys(v).forEach((l=>{const a=v[l];t[l]=a&&a in e?e[a]:""})),t})):[]));t.watch(f,(e=>{n("update:modelValue",e),n("data-updated",e)}),{deep:!0}),t.watch(v,(e=>{n("mapping-updated",e)}),{deep:!0});const h=async t=>{if(r.value=t,p.value=[],!t)return d.value=[],u.value=[],s.value=null,void(c.value="");try{s.value=await E(t),m.value===e.defaultEncoding&&(m.value=o(s.value)||e.defaultEncoding),await k(),n("file-loaded",r.value)}catch(l){p.value.push(`Error loading file: ${l.message}`)}},E=e=>new Promise(((t,l)=>{const a=new FileReader;a.onload=e=>t(e.target.result),a.onerror=e=>l(new Error("Error reading file")),a.readAsArrayBuffer(e)})),k=async()=>{if(r.value&&s.value)try{c.value=await async function(e,t="UTF-8"){return e instanceof ArrayBuffer?new TextDecoder(t).decode(e):new Promise(((l,a)=>{const o=new FileReader;o.onload=e=>{const a=e.target.result,o=new TextDecoder(t).decode(a);l(o)},o.onerror=e=>{a(new Error(`Error reading file: ${e.target.error}`))},o.readAsArrayBuffer(e)}))}(s.value,m.value);const t=function(e){const t=e.split(/\r?\n/).slice(0,5).join("\n"),l={",":(t.match(/,/g)||[]).length,";":(t.match(/;/g)||[]).length,"\t":(t.match(/\t/g)||[]).length,"|":(t.match(/\|/g)||[]).length};let a=0,o=",";return Object.entries(l).forEach((([e,t])=>{t>a&&(a=t,o=e)})),o}(c.value),a=l(c.value,{hasHeaders:i.value,delimiter:t,trimFields:!0,encoding:m.value,skipEmptyLines:!0});d.value=a.data,u.value=a.headers,a.errors&&a.errors.length&&(p.value=[...p.value,...a.errors]),e.autoMatch&&B()}catch(t){p.value.push(`${e.text.errors.encodingError}: ${t.message}`)}},w=()=>{i.value=!i.value,n("headers-toggled",i.value),r.value&&k()},y=async e=>{m.value=e,n("encoding-changed",e),r.value&&s.value&&await k()},B=()=>{if(!u.value.length)return;const t=Object.keys(e.fields);Object.keys(v).forEach((e=>{delete v[e]})),t.forEach((t=>{const l=e.fields[t].label||t;let a=u.value.findIndex((e=>e.toLowerCase()===l.toLowerCase()));-1===a&&(a=u.value.findIndex((e=>e.toLowerCase().includes(l.toLowerCase())||l.toLowerCase().includes(e.toLowerCase())))),-1!==a&&(v[t]=u.value[a])}))},C=(e,t)=>{v[e]=t},V=(e=5)=>d.value.slice(0,e);return t.provide("csvProcessor",{file:r,hasHeaders:i,parsedData:d,parsedHeaders:u,errors:p,encoding:m,supportedEncodings:g,mapping:v,rawContent:c,fileBuffer:s,text:e.text,fields:e.fields,setFile:h,toggleHeaders:w,changeEncoding:y,mapField:C,getSampleData:V,processFile:k,autoMapColumns:B}),{file:r,hasHeaders:i,parsedData:d,parsedHeaders:u,errors:p,encoding:m,supportedEncodings:g,mapping:v,rawContent:c,setFile:h,toggleHeaders:w,changeEncoding:y,mapField:C,getSampleData:V}}}),s={class:"vue-csv-processor"};const c=n(r,[["render",function(e,l,a,o,n,r){return t.openBlock(),t.createElementBlock("div",s,[t.renderSlot(e.$slots,"default",{file:e.file,errors:e.errors,fields:e.fields,mapping:e.mapping,hasHeaders:e.hasHeaders,csvData:e.parsedData,rawContent:e.rawContent,encoding:e.encoding},void 0,!0)])}],["__scopeId","data-v-67071360"]]),i=t.defineComponent({name:"VueCsvInput",props:{name:{type:String,default:"csv-file"},accept:{type:String,default:".csv,text/csv,application/vnd.ms-excel,text/plain"},validation:{type:Boolean,default:!0},fileMimeTypes:{type:Array,default:()=>["text/csv","text/x-csv","application/vnd.ms-excel","text/plain"]},maxSize:{type:Number,default:5242880},disabled:{type:Boolean,default:!1}},emits:["change","error"],setup(e,{emit:l}){const a=t.inject("csvProcessor"),o=t.ref(null),n=t.ref(!1),r=t.ref([]),s=t.computed((()=>a.file.value)),c=async t=>{var o;const n=(null==(o=t.target.files)?void 0:o[0])||null;if(n)if(e.validation&&(r.value=i(n),r.value.length>0))l("error",r.value);else try{await a.setFile(n),l("change",n)}catch(s){r.value.push(`Error processing file: ${s.message}`),l("error",r.value)}},i=t=>{const l=[],o=t.name.split(".").pop().toLowerCase(),n=t.type;return e.fileMimeTypes.includes(n)||"csv"===o||l.push(a.text.errors.invalidMimeType),t.size>e.maxSize&&l.push(`File is too large. Maximum size is ${d(e.maxSize)}.`),l},d=e=>{if(0===e)return"0 Bytes";const t=Math.floor(Math.log(e)/Math.log(1024));return parseFloat((e/Math.pow(1024,t)).toFixed(2))+" "+["Bytes","KB","MB","GB"][t]};return t.onMounted((()=>{o.value&&a&&(a.fileInputRef=o)})),t.watch((()=>a.errors.value),(e=>{e&&e.length>0&&(r.value=e)})),{fileInputRef:o,file:s,isDragging:n,fileErrors:r,handleChange:c,removeFile:()=>{o.value&&(o.value.value=""),a.setFile(null),r.value=[],l("change",null)},formatFileSize:d,onDragOver:e=>{n.value=!0},onDragLeave:e=>{n.value=!1},onDrop:e=>{n.value=!1;const t=e.dataTransfer.files[0];if(t&&o.value){const e=new DataTransfer;e.items.add(t),o.value.files=e.files,c({target:o.value})}}}}}),d={class:"vue-csv-input"},u={key:0},p=["name","accept","disabled"],m={class:"file-content"},g={key:0,class:"file-placeholder"},v={key:1,class:"file-info"},f={class:"file-name"},h={class:"file-size"},E={key:0,class:"file-errors"};const k=n(i,[["render",function(e,l,a,o,n,r){return t.openBlock(),t.createElementBlock("div",d,[e.$slots.default?t.renderSlot(e.$slots,"default",{key:1,file:e.file,change:e.handleChange,remove:e.removeFile,errors:e.fileErrors},void 0,!0):(t.openBlock(),t.createElementBlock("div",u,[t.createElementVNode("div",{class:t.normalizeClass(["file-drop-area",{"file-drop-active":e.isDragging,"has-file":!!e.file}]),onDragover:l[2]||(l[2]=t.withModifiers(((...t)=>e.onDragOver&&e.onDragOver(...t)),["prevent"])),onDragleave:l[3]||(l[3]=t.withModifiers(((...t)=>e.onDragLeave&&e.onDragLeave(...t)),["prevent"])),onDrop:l[4]||(l[4]=t.withModifiers(((...t)=>e.onDrop&&e.onDrop(...t)),["prevent"]))},[t.createElementVNode("input",{ref:"fileInputRef",type:"file",name:e.name,accept:e.accept,class:"file-input",onChange:l[0]||(l[0]=(...t)=>e.handleChange&&e.handleChange(...t)),disabled:e.disabled},null,40,p),t.createElementVNode("div",m,[e.file?(t.openBlock(),t.createElementBlock("div",v,[t.createElementVNode("span",f,t.toDisplayString(e.file.name),1),t.createElementVNode("span",h,"("+t.toDisplayString(e.formatFileSize(e.file.size))+")",1),t.createElementVNode("button",{class:"remove-file",onClick:l[1]||(l[1]=t.withModifiers(((...t)=>e.removeFile&&e.removeFile(...t)),["prevent"]))},"✕")])):(t.openBlock(),t.createElementBlock("div",g,l[5]||(l[5]=[t.createElementVNode("div",{class:"file-icon"},[t.createElementVNode("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",width:"24",height:"24"},[t.createElementVNode("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElementVNode("path",{d:"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-6-6zM6 20V4h7v5h5v11H6z"})])],-1),t.createElementVNode("span",null,"Drop CSV file here or click to browse",-1)])))])],34),e.fileErrors.length?(t.openBlock(),t.createElementBlock("div",E,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.fileErrors,((e,l)=>(t.openBlock(),t.createElementBlock("p",{key:l,class:"error-message"},t.toDisplayString(e),1)))),128))])):t.createCommentVNode("",!0)]))])}],["__scopeId","data-v-218ab60c"]]),w=t.defineComponent({name:"VueCsvPreview",props:{encoding:{type:String,default:"UTF-8"},encodings:{type:Array,default:()=>a.map((e=>e.value))},rowCount:{type:Number,default:5},showRowNumbers:{type:Boolean,default:!0},encodingSelectId:{type:String,default:"csv-encoding-select"}},emits:["update:encoding","encoding-change"],setup(e,{emit:l}){const o=t.inject("csvProcessor"),n=t.ref(e.encoding),r=t.ref(e.rowCount),s=t.computed((()=>o.parsedData.value||[])),c=t.computed((()=>o.parsedHeaders.value||[])),i=t.computed((()=>!!o.file.value)),d=t.computed((()=>o.text)),u=t.computed((()=>a.filter((t=>e.encodings.includes(t.value))))),p=t.computed((()=>s.value.slice(0,r.value))),m=t.computed((()=>s.value.length)),g=t.computed((()=>{if(!p.value.length)return!1;for(const e of p.value)for(const t of c.value)if(v(e[t]))return!0;return!1})),v=e=>"string"==typeof e&&(e.includes("�")||e.includes("Ã")||/[\u{D800}-\u{DFFF}]/u.test(e));return t.watch((()=>e.encoding),(e=>{n.value=e})),t.watch((()=>o.encoding.value),(e=>{n.value=e})),{selectedEncoding:n,previewRowCount:r,previewData:p,parsedHeaders:c,totalRows:m,hasFile:i,text:d,supportedEncodings:u,hasEncodingIssues:g,hasEncodingIssue:v,onEncodingChange:()=>{l("update:encoding",n.value),l("encoding-change",n.value),o.changeEncoding(n.value)}}}}),y={class:"vue-csv-preview"},B={key:0},C={key:0,class:"preview-empty"},V={key:1,class:"preview-container"},b={class:"encoding-selector"},S=["for"],N=["id"],D=["value"],x={class:"preview-table-wrapper"},F={class:"preview-table"},M={key:0,class:"row-number-cell"},I={key:0,class:"row-number-cell"},H={class:"preview-controls"},T={class:"preview-info"},L={class:"preview-buttons"},O=["disabled"],P=["disabled"],R={key:0,class:"encoding-note"};const z=n(w,[["render",function(e,l,a,o,n,r){return t.openBlock(),t.createElementBlock("div",y,[e.$slots.default?t.renderSlot(e.$slots,"default",{key:1,previewData:e.previewData,parsedHeaders:e.parsedHeaders,totalRows:e.totalRows,encoding:e.selectedEncoding,supportedEncodings:e.supportedEncodings,changeEncoding:e.onEncodingChange,hasEncodingIssues:e.hasEncodingIssues},void 0,!0):(t.openBlock(),t.createElementBlock("div",B,[e.hasFile?(t.openBlock(),t.createElementBlock("div",V,[t.createElementVNode("div",b,[t.createElementVNode("label",{for:e.encodingSelectId,class:"encoding-label"},t.toDisplayString(e.text.encoding)+":",9,S),t.withDirectives(t.createElementVNode("select",{id:e.encodingSelectId,"onUpdate:modelValue":l[0]||(l[0]=t=>e.selectedEncoding=t),class:"encoding-select",onChange:l[1]||(l[1]=(...t)=>e.onEncodingChange&&e.onEncodingChange(...t))},[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.supportedEncodings,(e=>(t.openBlock(),t.createElementBlock("option",{key:e.value,value:e.value},t.toDisplayString(e.label),9,D)))),128))],40,N),[[t.vModelSelect,e.selectedEncoding]])]),t.createElementVNode("div",x,[t.createElementVNode("table",F,[t.createElementVNode("thead",null,[t.createElementVNode("tr",null,[e.showRowNumbers?(t.openBlock(),t.createElementBlock("th",M,"#")):t.createCommentVNode("",!0),(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.parsedHeaders,((e,l)=>(t.openBlock(),t.createElementBlock("th",{key:l,class:"header-cell"},t.toDisplayString(e),1)))),128))])]),t.createElementVNode("tbody",null,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.previewData,((l,a)=>(t.openBlock(),t.createElementBlock("tr",{key:a,class:"data-row"},[e.showRowNumbers?(t.openBlock(),t.createElementBlock("td",I,t.toDisplayString(a+1),1)):t.createCommentVNode("",!0),(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.parsedHeaders,((a,o)=>(t.openBlock(),t.createElementBlock("td",{key:o,class:t.normalizeClass(["data-cell",{"encoding-issue":e.hasEncodingIssue(l[a])}])},t.toDisplayString(l[a]),3)))),128))])))),128))])])]),t.createElementVNode("div",H,[t.createElementVNode("div",T,[t.createElementVNode("span",null,"Showing "+t.toDisplayString(e.previewData.length)+" of "+t.toDisplayString(e.totalRows)+" rows",1)]),t.createElementVNode("div",L,[t.createElementVNode("button",{class:"preview-button",onClick:l[2]||(l[2]=t=>e.previewRowCount=Math.max(5,e.previewRowCount-5)),disabled:e.previewRowCount<=5}," Show less ",8,O),t.createElementVNode("button",{class:"preview-button",onClick:l[3]||(l[3]=t=>e.previewRowCount=Math.min(e.totalRows,e.previewRowCount+5)),disabled:e.previewRowCount>=e.totalRows}," Show more ",8,P)])]),e.hasEncodingIssues?(t.openBlock(),t.createElementBlock("div",R,l[5]||(l[5]=[t.createElementVNode("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",width:"20",height:"20",class:"warning-icon"},[t.createElementVNode("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElementVNode("path",{d:"M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16zm-1-5h2v2h-2v-2zm0-8h2v6h-2V7z"})],-1),t.createElementVNode("span",null," Some characters may not display correctly. Try a different encoding. ",-1)]))):t.createCommentVNode("",!0)])):(t.openBlock(),t.createElementBlock("div",C,l[4]||(l[4]=[t.createElementVNode("p",null,"Upload a CSV file to preview data",-1)])))]))])}],["__scopeId","data-v-f1c12314"]]),A=t.defineComponent({name:"VueCsvToggleHeaders",props:{toggleId:{type:String,default:"csv-has-headers"},checkboxAttributes:{type:Object,default:()=>({})},labelAttributes:{type:Object,default:()=>({})}},emits:["toggle"],setup(e,{emit:l}){const a=t.inject("csvProcessor"),o=t.computed((()=>a.hasHeaders.value)),n=t.computed((()=>a.text));return{hasHeaders:o,text:n,toggle:()=>{a.toggleHeaders(),l("toggle",!o.value)}}}}),$={class:"vue-csv-toggle-headers"},j={key:0,class:"toggle-container"},U=["id","checked"],_=["for"];const q=n(A,[["render",function(e,l,a,o,n,r){return t.openBlock(),t.createElementBlock("div",$,[e.$slots.default?t.renderSlot(e.$slots,"default",{key:1,hasHeaders:e.hasHeaders,toggle:e.toggle},void 0,!0):(t.openBlock(),t.createElementBlock("div",j,[t.createElementVNode("input",t.mergeProps({id:e.toggleId,type:"checkbox",checked:e.hasHeaders,onChange:l[0]||(l[0]=(...t)=>e.toggle&&e.toggle(...t)),class:"toggle-checkbox"},e.checkboxAttributes),null,16,U),t.createElementVNode("label",t.mergeProps({for:e.toggleId,class:"toggle-label"},e.labelAttributes),t.toDisplayString(e.text.toggleHeaders),17,_)]))])}],["__scopeId","data-v-bcaca94b"]]),W=t.defineComponent({name:"VueCsvMap",props:{noThead:{type:Boolean,default:!1},selectAttributes:{type:Object,default:()=>({})},autoMatch:{type:Boolean,default:!0},autoMatchIgnoreCase:{type:Boolean,default:!0}},emits:["update:mapping","mapping-change"],setup(e,{emit:l}){const a=t.inject("csvProcessor"),o=t.computed((()=>a.fields)),n=t.computed((()=>a.parsedHeaders.value||[])),r=t.computed((()=>a.parsedData.value||[])),s=t.computed((()=>a.mapping)),c=t.computed((()=>a.text)),i=t.computed((()=>r.value.length>0&&n.value.length>0)),d=t.computed((()=>r.value.slice(0,1))),u=t.computed((()=>Object.entries(o.value).some((([e,t])=>t.required&&!s.value[e])))),p=(e,t)=>{a.mapField(e,t),l("update:mapping",{...s.value}),l("mapping-change",{field:e,column:t})},m=()=>{e.autoMatch&&i.value&&Object.keys(o.value).forEach((t=>{if(s.value[t])return;const l=o.value[t].label||t;let a=-1;a=e.autoMatchIgnoreCase?n.value.findIndex((e=>e.toLowerCase()===l.toLowerCase()||e.toLowerCase()===t.toLowerCase())):n.value.findIndex((e=>e===l||e===t)),-1!==a&&p(t,n.value[a])}))};return t.onMounted((()=>{i.value&&m()})),t.watch((()=>n.value),((e,t)=>{e.length>0&&(!t||0===t.length)&&m()})),{fields:o,parsedHeaders:n,mapping:s,text:c,hasData:i,sampleData:d,hasMissingRequiredFields:u,updateMapping:p,formatSampleValue:e=>null==e?"":"string"==typeof e&&e.length>20?e.substring(0,20)+"...":e.toString()}}}),G={class:"vue-csv-map"},K={key:0,class:"map-empty"},J={key:1},Q={key:0},X={key:0},Y={class:"field-column"},Z={class:"csv-column"},ee={class:"field-column"},te={class:"field-info"},le={class:"field-name"},ae={key:0,class:"required-indicator"},oe={class:"csv-column"},ne=["value","onChange"],re=["value"],se={key:0,class:"required-reminder"};const ce=n(W,[["render",function(e,l,a,o,n,r){return t.openBlock(),t.createElementBlock("div",G,[e.hasData?(t.openBlock(),t.createElementBlock("div",J,[e.$slots.default?t.renderSlot(e.$slots,"default",{key:1,sample:e.sampleData,mapping:e.mapping,fields:e.fields,parsedHeaders:e.parsedHeaders,updateMapping:e.updateMapping},void 0,!0):(t.openBlock(),t.createElementBlock("div",Q,[t.createElementVNode("table",{class:t.normalizeClass(["mapping-table",{"no-thead":e.noThead}])},[e.noThead?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("thead",X,[t.createElementVNode("tr",null,[t.createElementVNode("th",Y,t.toDisplayString(e.text.fieldColumn),1),t.createElementVNode("th",Z,t.toDisplayString(e.text.csvColumn),1)])])),t.createElementVNode("tbody",null,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.fields,((a,o)=>(t.openBlock(),t.createElementBlock("tr",{key:o,class:"mapping-row"},[t.createElementVNode("td",ee,[t.createElementVNode("div",te,[t.createElementVNode("span",le,t.toDisplayString(a.label||o),1),a.required?(t.openBlock(),t.createElementBlock("span",ae,"*")):t.createCommentVNode("",!0)])]),t.createElementVNode("td",oe,[t.createElementVNode("select",t.mergeProps({value:e.mapping[o],onChange:t=>e.updateMapping(o,t.target.value),class:"mapping-select",ref_for:!0},e.selectAttributes),[l[1]||(l[1]=t.createElementVNode("option",{value:""},"-- Select Column --",-1)),(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.parsedHeaders,((l,a)=>(t.openBlock(),t.createElementBlock("option",{key:a,value:l},[t.createTextVNode(t.toDisplayString(l)+" ",1),e.sampleData.length&&e.sampleData[0][l]?(t.openBlock(),t.createElementBlock(t.Fragment,{key:0},[t.createTextVNode(" (e.g. "+t.toDisplayString(e.formatSampleValue(e.sampleData[0][l]))+") ",1)],64)):t.createCommentVNode("",!0)],8,re)))),128))],16,ne)])])))),128))])],2),e.hasMissingRequiredFields?(t.openBlock(),t.createElementBlock("div",se,l[2]||(l[2]=[t.createElementVNode("p",null,"* Required fields must be mapped",-1)]))):t.createCommentVNode("",!0)]))])):(t.openBlock(),t.createElementBlock("div",K,l[0]||(l[0]=[t.createElementVNode("p",null,"Upload a CSV file to map columns",-1)])))])}],["__scopeId","data-v-48273534"]]),ie=t.defineComponent({name:"VueCsvErrors",setup(){const e=t.inject("csvProcessor"),l=t.computed((()=>e.errors.value||[])),a=t.computed((()=>l.value.length>0)),o=t.computed((()=>l.value.length));return{errors:l,hasErrors:a,errorCount:o}}}),de={class:"vue-csv-errors"},ue={key:0},pe={key:0,class:"errors-container",role:"alert"},me={class:"errors-header"},ge={class:"errors-list"};const ve=n(ie,[["render",function(e,l,a,o,n,r){return t.openBlock(),t.createElementBlock("div",de,[e.$slots.default?t.renderSlot(e.$slots,"default",{key:1,errors:e.errors},void 0,!0):(t.openBlock(),t.createElementBlock("div",ue,[e.hasErrors?(t.openBlock(),t.createElementBlock("div",pe,[t.createElementVNode("div",me,[l[0]||(l[0]=t.createElementVNode("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",width:"20",height:"20",class:"error-icon"},[t.createElementVNode("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElementVNode("path",{d:"M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm-1-7v2h2v-2h-2zm0-8v6h2V7h-2z"})],-1)),t.createElementVNode("span",null,t.toDisplayString(e.errorCount)+" "+t.toDisplayString(1===e.errorCount?"error":"errors")+" found",1)]),t.createElementVNode("ul",ge,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.errors,((e,l)=>(t.openBlock(),t.createElementBlock("li",{key:l,class:"error-item"},t.toDisplayString(e),1)))),128))])])):t.createCommentVNode("",!0)]))])}],["__scopeId","data-v-3335c9f9"]]),fe={install:(e,t={})=>{e.component("VueCsvProcessor",c),e.component("VueCsvInput",k),e.component("VueCsvPreview",z),e.component("VueCsvToggleHeaders",q),e.component("VueCsvMap",ce),e.component("VueCsvErrors",ve),t.globalProperties&&Object.keys(t.globalProperties).forEach((l=>{e.config.globalProperties[l]=t.globalProperties[l]}))}};e.SUPPORTED_ENCODINGS=a,e.VueCsvErrors=ve,e.VueCsvInput=k,e.VueCsvMap=ce,e.VueCsvPreview=z,e.VueCsvProcessor=c,e.VueCsvProcessorPlugin=fe,e.VueCsvToggleHeaders=q,e.default=fe,e.detectEncoding=o,e.parseCSV=l,Object.defineProperties(e,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})})); //# sourceMappingURL=vue-csv-processor.umd.js.map