xlsx-preview/dist/xlsxPreview.umd.js

Preview the .xlsx in the browser, convert to HTML with styles.

!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("exceljs")):"function"==typeof define&&define.amd?define(["exceljs"],e):"object"==typeof exports?exports.xlsxPreview=e(require("exceljs")):t.xlsxPreview=e(t.exceljs)}(globalThis,(function(t){return(()=>{"use strict";var e={674:e=>{e.exports=t}},n={};function o(t){var r=n[t];if(void 0!==r)return r.exports;var l=n[t]={exports:{}};return e[t](l,l.exports,o),l.exports}o.d=(t,e)=>{for(var n in e)o.o(e,n)&&!o.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},o.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),o.r=t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};var r={};return(()=>{o.r(r),o.d(r,{default:()=>j,xlsx2Html:()=>M});var t=o(674);function e(t){let e="";for(const n of t){let t=n.toString(16);for(;t.length<2;)t="0"+t;e+=t}return e}const n=function(){const t=crypto.getRandomValues(new Uint8Array(8)),n=t.slice(0,4),o=t.slice(4);return`${e(n)}-${e(o)}`}(),l=`excel-sheets-${n}`,s=`table-${n}`,i=`tbody-${n}`,c=`sheet-${n}`,a=`sheet-toggle-bar-${n}`,f=`locate-btns-x-${n}`,d=`l-btn-${n}`,u=`toggle-btns-x-${n}`,$=`t-btn-${n}`;let h=20,p=16;const x=`\nfunction toggleBtnEventBind() {\n  document.querySelector('.${u}').addEventListener('click',e => {\n    const target = e.target;\n    if(target.classList.contains('${$}')) {\n      const index = target.dataset.index;\n      setActiveByIndex(index);\n    }\n  })\n}\n`,b=`\nconst sheetBtnOffsetMap = (function calcSheetToggleBtnOffset() {\n  const result = [];\n  const btns = document.querySelectorAll(".${$}");\n  btns.forEach((ele, idx) => {\n    result[idx] = ele.offsetLeft;\n  });\n  return result;\n})();\n`,g=`\nfunction setActiveByIndex(index) {\n  document.querySelector('.${$}.active').classList.remove('active');\n  document.querySelector('.${c}.active').classList.remove('active');\n  document.querySelector('.${$}[data-index="' + index + '"]').classList.add("active");\n  document.querySelector('.${c}[data-index="' + index + '"]').classList.add("active");\n}\n`,y=`\nlet offsetIndex = 0;\nfunction locateBtnEventBind() {\n  document.querySelector('.${f}').addEventListener('click', e => {\n    const target = e.target;\n    if (target.classList.contains('${d}')) {\n      const toggleBtnX = document.querySelector('.${u}');\n      switch (target.id) {\n        case 'first-${n}':\n          toggleBtnX.scrollTo({ left: 0 });\n          offsetIndex = 0;\n          break;\n        case 'last-${n}':\n          toggleBtnX.scrollTo({ left: sheetBtnOffsetMap[sheetBtnOffsetMap.length - 1] })\n          offsetIndex = sheetBtnOffsetMap.length - 1;\n          break;\n        case 'prev-${n}':\n          toPrevOffsetIndex(toggleBtnX);\n          break;\n        case 'next-${n}':\n          if (offsetIndex === sheetBtnOffsetMap.length - 1) return;\n          toggleBtnX.scrollTo({ left: sheetBtnOffsetMap[++offsetIndex] });\n          break;\n        default:\n          break;\n      }\n    }\n  })\n}\n`,v={};function m(t,e){if(v[t])return`<tr>${e}${v[t]}</tr>`;let n="";for(let e=1;e<=t;e++)n+="<td></td>";return v[t]=n,`<tr>${e}${n}</tr>`}function w(t,e){const{rows:n,cols:o}=e,{tl:r,br:l}=t,s=(r.col-r.nativeCol)*o[Math.ceil(r.col)],i=(r.row-r.nativeRow)*n[Math.ceil(r.row)];let c=0;for(let t=r.nativeCol;t>=0;t--)c+=o[t];let a=0;for(let t=r.nativeRow;t>=0;t--)a+=n[t];const f=c+s,d=a+i,u=(l.col-l.nativeCol)*o[Math.ceil(l.col)],$=(l.col-l.nativeCol)*n[Math.ceil(l.row)];let h=0;for(let t=l.nativeCol;t>=0;t--)h+=o[t];let p=0;for(let t=l.nativeRow;t>=0;t--)p+=n[t];return{left:f,top:d,width:h+u-f,height:p+$-d}}function B(t,e,n){if(t.width)return t;const{cols:o}=n,{tl:r,br:l}=e,s=(l.nativeColOff-r.nativeColOff)/1e4,i=r.nativeColOff/1e4;let c=0;for(let t=r.nativeCol;t>=0;t--)c+=o[t];const a=c+i;return Object.assign(Object.assign({},t),{left:a,width:s})}function O(t){let e="";const{bold:n,italic:o,family:r,name:l,size:s,underline:i,color:c}=t;return n&&(e+="font-weight: bold;"),o&&(e+="font-style: italic;"),r&&(e+=`font-family: ${l};`),s&&(e+=`font-size: ${s}px;`),i&&(e+="text-decoration: underline;"),c&&c.argb&&(e+=`color: ${k(c.argb)};`),e}function k(t){const{a:e,r:n,g:o,b:r}=function(t){if(8!==t.length)throw"This is not a standard argb string.";const e=[];for(let n=0;n<4;n++)e.push(t.substr(2*n,2));const[n,o,r,l]=e.map((t=>parseInt(t,16)));return{a:n,r:o,g:r,b:l}}(t);return`rgba(${n},${o},${r},${e/255})`}function S(e){let n=null;if(e.isMerged){if(e.master!==e)return"";n=function(t){if(!t.isMerged||t.master!==t)return null;const{row:e,col:n}=t.fullAddress;let o,r=e+1;do{o=t.worksheet.findCell(r++,n)}while(o&&o.master===t);let l=n+1;o=void 0;do{o=t.worksheet.findCell(e,l++)}while(o&&o.master===t);const s={};return r-e>1&&(s.row=r-e-1),l-n>1&&(s.col=l-n-1),s}(e)}let o=function(e){const{type:n,value:o}=e;switch(n){case t.ValueType.Null:return"";case t.ValueType.Hyperlink:return function(t){return`<a href="${t.hyperlink}" target="_blank">${t.text}</a>`}(o);case t.ValueType.RichText:return function(t){const e=t.richText;let n="";for(const t of e){let e="";t.font&&(e=O(t.font)),n+=e?`<span style="${e}">${t.text}</span>`:`<span>${t.text}</span>`}return n}(o);case t.ValueType.Formula:return function(t){return"0.00%"===t.numFmt?(100*t.result).toFixed(2)+"%":t.result||""}(e);case t.ValueType.Date:return function(t){return t.toString()}(o);default:return o||""}}(e),r="";n&&(n.col&&(r+=` colspan="${n.col}"`),n.row&&(r+=` rowspan="${n.row}"`));let l="";return e.font&&(l+=O(e.font)),e.alignment&&(l+=function(t){let e="";const{horizontal:n,vertical:o,indent:r,readingOrder:l}=t;return n&&(e+=`text-align: ${n};`),o&&(e+=`vertical-align: ${o};`),r&&(e+=`text-indent: ${r};`),l&&(e+=`direction: ${l};`),e}(e.alignment)),e.fill&&(l+=function(t){const{type:e}=t;if("pattern"===e){const{fgColor:e,bgColor:n}=t;if(e&&e.argb)return`background-color: ${k(e.argb)};`;if(n&&n.argb)return`background-color: ${k(n.argb)};`}return""}(e.fill)),l&&(r+=` style="${l}"`),`<td${r}>${o}</td>`}function C(t){return e=this,o=void 0,l=function*(){const e={rows:[],cols:[]},o={};t.eachRow(((t,e)=>{o[e]=t}));const r=t.lastRow&&t.lastRow.number||0,l=Math.max(r,h),c=t.lastColumn&&t.lastColumn.number||0,a=Math.max(c,p),{resultRows:f,rowsSpan:d}=function(t,e,n,o){let r="";const l=[];for(let s=1;s<=e;s++){let e="";const i=`<td class="order order-row">${s}</td>`;let c;if(t[s]){const{height:r}=t[s];let l="";for(let t=1;t<=n;t++){const e=o.findCell(s,t);l+=e?S(e):"<td></td>"}let a="";r?(a+=` style="height:${r}px;"`,c=r):c=24,e+=`<tr${a}>${i}${l}</tr>`}else c=24,e+=m(n,i);r+=e,l[s]=c}return{resultRows:r,rowsSpan:l}}(o,l,a,t);e.rows=[24,...d];const{sheetWidth:u,orderCol:$,colStyles:x,colsSpan:b}=function(t,e){const n=e.properties.defaultColWidth||9;let o=0,r='<td class="order order-row"></td>',l="";const s=[];for(let c=1;c<=t;c++){const t=e.getColumn(c);if(r+=`<td class="order order-col index-${c}">${t.letter}</td>`,t.width){const e=72*t.width/n;s[c]=e,o+=e,l+=`.${i} td.index-${c} { width: ${e}px; }`}else o+=72,s[c]=72}return{sheetWidth:o,orderCol:r,colStyles:l,colsSpan:s}}(a,t);e.cols=[32,...b];const g=t.views.some((t=>!t.showGridLines))?`.${i}.${i} td:not(.order) { border: none; }`:"";let y=`<body class="embed-body-${n}">\n        <table class="${s}">\n            <tbody class="${i}">${$+f}</tbody>\n        </table>\n    </body>`;const v=`.${s} { width: ${u}px; } ${g}`,O=yield function(t,e){return n=this,o=void 0,l=function*(){const n=t.getImages();let o="";for(const r of n){let n=w(r.range,e);const{left:l,top:s,width:i,height:c}=B(n,r.range,e),a=`position: absolute; left: ${l}px; top: ${s}px; width: ${i}px; height: ${c}px;`,f=t.workbook.getImage(r.imageId),d=`image/${f.extension}`;f.base64?o+=`<img src="${f.base64}" style="${a}" />`:f.buffer&&(o+=`<object type="${d}" data="${URL.createObjectURL(new Blob([f.buffer],{type:d}))}" style="${a}"></object>`)}return o},new((r=void 0)||(r=Promise))((function(t,e){function s(t){try{c(l.next(t))}catch(t){e(t)}}function i(t){try{c(l.throw(t))}catch(t){e(t)}}function c(e){var n;e.done?t(e.value):(n=e.value,n instanceof r?n:new r((function(t){t(n)}))).then(s,i)}c((l=l.apply(n,o||[])).next())}));var n,o,r,l}(t,e);return y+=O,y+=`<style>${v}${x}</style>`,y+=`\n    <style>\n      .embed-body-${n} { margin: 0; padding: 0; }\n      .${s} { border-collapse: collapse; table-layout: fixed; }\n      .${i} { border-right: 1px solid #f0f0f0; border-bottom: 1px solid #f0f0f0; }\n      .${i} td { border-left: 1px solid #f0f0f0; border-top: 1px solid #f0f0f0; width: 72px; height: 24px; text-overflow: ellipsis; overflow: hidden; }\n      .${i} td.order { color: #333; text-align: center; background: #b6d9fb; }\n      .${i} td.order-row { width: 32px; }\n    </style>`,y},new((r=void 0)||(r=Promise))((function(t,n){function s(t){try{c(l.next(t))}catch(t){n(t)}}function i(t){try{c(l.throw(t))}catch(t){n(t)}}function c(e){var n;e.done?t(e.value):(n=e.value,n instanceof r?n:new r((function(t){t(n)}))).then(s,i)}c((l=l.apply(e,o||[])).next())}));var e,o,r,l}function M(e,o){return r=this,s=void 0,v=function*(){var r;let s;if((null==o?void 0:o.minimumRows)&&((r=o.minimumRows)<20&&console.warn("setMinimumNumberRows: count less then DEFAULT_NUMBER_ROWS."),h=r),(null==o?void 0:o.minimumCols)&&function(t){t<16&&console.warn("setMinimumNumberCols: count less then DEFAULT_NUMBER_COLS."),p=t}(o.minimumCols),e instanceof Blob)s=yield e.arrayBuffer();else{if(!(e instanceof ArrayBuffer))throw"xlsx2Html(data, options): The parameter data can only be passed ArrayBuffer, Blob or File type";s=e}const i=new t.Workbook;yield i.xlsx.load(s);const v=i.worksheets.length,m=[];for(let t=0;t<v;t++){const e=yield C(i.worksheets[t]);m.push(e)}if(!0===(null==o?void 0:o.separateSheets))return"arrayBuffer"===o.output?m.map((t=>R(t))):m;const w=function(t,e){let o="",r="";for(let n=0;n<t.length;n++){const l="text/html",s=URL.createObjectURL(new Blob([t[n]],{type:l})),i=0===n?" active":"";o+=`<object class="${c}${i}" data-index="${n}" type="${l}" data="${s}"></object>`,r+=`<button class="${$}${i}" data-index="${n}">${e[n].name}</button>`}return o+=`<div class="${a}"><div class="${f}">\n    <button class="${d}" id="first-${n}">⇤</button>\n    <button class="${d}" id="prev-${n}">←</button>\n    <button class="${d}" id="next-${n}">→</button>\n    <button class="${d}" id="last-${n}">⇥</button>\n  </div><div class="${u}">${r}</div></div>`,o+=`\n    <style>\n      body { margin-bottom: 0; }\n      .${l} { position: relative; height: 100%; }\n      .${c} { display: none; width: 100%; height: calc(100% - 30px); }\n      .${c}.active { display: block; }\n      .${a} { position: fixed; left: 0px; bottom: 0px; width: 100%; display: flex; }\n      .${f} { display: flex; algin-items: center; margin-right: 1px; }\n      .${d} { height: 30px; border: none; }\n      .${d}:active { background: #fff; }\n      .${u} { position: relative; flex: 1; overflow: hidden; white-space: nowrap; }\n      .${$} { height: 30px; padding: 0 15px; border: none; box-shadow: 1px 0 2px #ccc; }\n      .${$}.active { border-bottom: 2px solid; background: #fff; }\n    </style>\n  <script>\n    ${x}\n    ${b}\n    ${g}\n    \nfunction toPrevOffsetIndex(toggleBtnX) {\n  if (offsetIndex === 0) return;\n  const scrollLeft = toggleBtnX.scrollLeft;\n  const scrollWidth = toggleBtnX.scrollWidth;\n  const offsetWidth = toggleBtnX.offsetWidth;\n  const maxOffset = scrollWidth - offsetWidth;\n  let idx = offsetIndex - 1;\n  while (idx >= 0) {\n    let cur = sheetBtnOffsetMap[idx];\n    if (cur < maxOffset) {\n      toggleBtnX.scrollTo({ left: cur });\n      offsetIndex = idx;\n      break;\n    }\n    idx--;\n  }\n}\n\n    ${y}\n    window.onload = function() {\n      toggleBtnEventBind();\n      locateBtnEventBind();\n    }\n  <\/script>`,`<div class="${l}">${o}</div>`}(m,i.worksheets);return"arrayBuffer"===(null==o?void 0:o.output)?R(w):w},new((i=void 0)||(i=Promise))((function(t,e){function n(t){try{l(v.next(t))}catch(t){e(t)}}function o(t){try{l(v.throw(t))}catch(t){e(t)}}function l(e){var r;e.done?t(e.value):(r=e.value,r instanceof i?r:new i((function(t){t(r)}))).then(n,o)}l((v=v.apply(r,s||[])).next())}));var r,s,i,v}function R(t){return new Blob([t],{type:"text/html"}).arrayBuffer()}const j={xlsx2Html:M}})(),r})()}));
//# sourceMappingURL=xlsxPreview.umd.js.map