@imparth/react-file-viewer
Version:
Extendable file viewer for web that preview images, pdf and text files via file object or web url
32 lines (29 loc) • 13.7 kB
JavaScript
(function(x,w){typeof exports=="object"&&typeof module<"u"?module.exports=w(require("react")):typeof define=="function"&&define.amd?define(["react"],w):(x=typeof globalThis<"u"?globalThis:x||self,x.ReactFileViewer=w(x.React))})(this,function(x){"use strict";var w={exports:{}},C={};/**
* @license React
* react-jsx-runtime.production.js
*
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/var I;function he(){if(I)return C;I=1;var i=Symbol.for("react.transitional.element"),E=Symbol.for("react.fragment");function s(b,u,d){var l=null;if(d!==void 0&&(l=""+d),u.key!==void 0&&(l=""+u.key),"key"in u){d={};for(var v in u)v!=="key"&&(d[v]=u[v])}else d=u;return u=d.ref,{$$typeof:i,type:b,key:l,ref:u!==void 0?u:null,props:d}}return C.Fragment=E,C.jsx=s,C.jsxs=s,C}var k={};/**
* @license React
* react-jsx-runtime.development.js
*
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/var Q;function je(){return Q||(Q=1,process.env.NODE_ENV!=="production"&&function(){function i(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===Ce?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case V:return"Fragment";case Se:return"Portal";case oe:return"Profiler";case ne:return"StrictMode";case J:return"Suspense";case H:return"SuspenseList"}if(typeof e=="object")switch(typeof e.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),e.$$typeof){case ie:return(e.displayName||"Context")+".Provider";case ae:return(e._context.displayName||"Context")+".Consumer";case F:var r=e.render;return e=e.displayName,e||(e=r.displayName||r.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case q:return r=e.displayName||null,r!==null?r:i(e.type)||"Memo";case G:r=e._payload,e=e._init;try{return i(e(r))}catch{}}return null}function E(e){return""+e}function s(e){try{E(e);var r=!1}catch{r=!0}if(r){r=console;var t=r.error,o=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return t.call(r,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",o),E(e)}}function b(){}function u(){if(N===0){ue=console.log,ce=console.info,fe=console.warn,de=console.error,ve=console.group,Ee=console.groupCollapsed,be=console.groupEnd;var e={configurable:!0,enumerable:!0,value:b,writable:!0};Object.defineProperties(console,{info:e,log:e,warn:e,error:e,group:e,groupCollapsed:e,groupEnd:e})}N++}function d(){if(N--,N===0){var e={configurable:!0,enumerable:!0,writable:!0};Object.defineProperties(console,{log:T({},e,{value:ue}),info:T({},e,{value:ce}),warn:T({},e,{value:fe}),error:T({},e,{value:de}),group:T({},e,{value:ve}),groupCollapsed:T({},e,{value:Ee}),groupEnd:T({},e,{value:be})})}0>N&&console.error("disabledDepth fell below zero. This is a bug in React. Please file an issue.")}function l(e){if(L===void 0)try{throw Error()}catch(t){var r=t.stack.trim().match(/\n( *(at )?)/);L=r&&r[1]||"",ge=-1<t.stack.indexOf(`
at`)?" (<anonymous>)":-1<t.stack.indexOf("@")?"@unknown:0:0":""}return`
`+L+e+ge}function v(e,r){if(!e||X)return"";var t=Z.get(e);if(t!==void 0)return t;X=!0,t=Error.prepareStackTrace,Error.prepareStackTrace=void 0;var o=null;o=y.H,y.H=null,u();try{var c={DetermineComponentFrameRoot:function(){try{if(r){var h=function(){throw Error()};if(Object.defineProperty(h.prototype,"props",{set:function(){throw Error()}}),typeof Reflect=="object"&&Reflect.construct){try{Reflect.construct(h,[])}catch(p){var U=p}Reflect.construct(e,[],h)}else{try{h.call()}catch(p){U=p}e.call(h.prototype)}}else{try{throw Error()}catch(p){U=p}(h=e())&&typeof h.catch=="function"&&h.catch(function(){})}}catch(p){if(p&&U&&typeof p.stack=="string")return[p.stack,U.stack]}return[null,null]}};c.DetermineComponentFrameRoot.displayName="DetermineComponentFrameRoot";var a=Object.getOwnPropertyDescriptor(c.DetermineComponentFrameRoot,"name");a&&a.configurable&&Object.defineProperty(c.DetermineComponentFrameRoot,"name",{value:"DetermineComponentFrameRoot"});var n=c.DetermineComponentFrameRoot(),m=n[0],A=n[1];if(m&&A){var f=m.split(`
`),R=A.split(`
`);for(n=a=0;a<f.length&&!f[a].includes("DetermineComponentFrameRoot");)a++;for(;n<R.length&&!R[n].includes("DetermineComponentFrameRoot");)n++;if(a===f.length||n===R.length)for(a=f.length-1,n=R.length-1;1<=a&&0<=n&&f[a]!==R[n];)n--;for(;1<=a&&0<=n;a--,n--)if(f[a]!==R[n]){if(a!==1||n!==1)do if(a--,n--,0>n||f[a]!==R[n]){var P=`
`+f[a].replace(" at new "," at ");return e.displayName&&P.includes("<anonymous>")&&(P=P.replace("<anonymous>",e.displayName)),typeof e=="function"&&Z.set(e,P),P}while(1<=a&&0<=n);break}}}finally{X=!1,y.H=o,d(),Error.prepareStackTrace=t}return f=(f=e?e.displayName||e.name:"")?l(f):"",typeof e=="function"&&Z.set(e,f),f}function O(e){if(e==null)return"";if(typeof e=="function"){var r=e.prototype;return v(e,!(!r||!r.isReactComponent))}if(typeof e=="string")return l(e);switch(e){case J:return l("Suspense");case H:return l("SuspenseList")}if(typeof e=="object")switch(e.$$typeof){case F:return e=v(e.render,!1),e;case q:return O(e.type);case G:r=e._payload,e=e._init;try{return O(e(r))}catch{}}return""}function _(){var e=y.A;return e===null?null:e.getOwner()}function W(e){if(se.call(e,"key")){var r=Object.getOwnPropertyDescriptor(e,"key").get;if(r&&r.isReactWarning)return!1}return e.key!==void 0}function Y(e,r){function t(){me||(me=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",r))}t.isReactWarning=!0,Object.defineProperty(e,"key",{get:t,configurable:!0})}function M(){var e=i(this.type);return pe[e]||(pe[e]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),e=this.props.ref,e!==void 0?e:null}function j(e,r,t,o,c,a){return t=a.ref,e={$$typeof:$,type:e,key:r,props:a,_owner:c},(t!==void 0?t:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:M}):Object.defineProperty(e,"ref",{enumerable:!1,value:null}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function S(e,r,t,o,c,a){if(typeof e=="string"||typeof e=="function"||e===V||e===oe||e===ne||e===J||e===H||e===Ae||typeof e=="object"&&e!==null&&(e.$$typeof===G||e.$$typeof===q||e.$$typeof===ie||e.$$typeof===ae||e.$$typeof===F||e.$$typeof===ke||e.getModuleId!==void 0)){var n=r.children;if(n!==void 0)if(o)if(B(n)){for(o=0;o<n.length;o++)re(n[o],e);Object.freeze&&Object.freeze(n)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else re(n,e)}else n="",(e===void 0||typeof e=="object"&&e!==null&&Object.keys(e).length===0)&&(n+=" You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports."),e===null?o="null":B(e)?o="array":e!==void 0&&e.$$typeof===$?(o="<"+(i(e.type)||"Unknown")+" />",n=" Did you accidentally export a JSX literal instead of a component?"):o=typeof e,console.error("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",o,n);if(se.call(r,"key")){n=i(e);var m=Object.keys(r).filter(function(f){return f!=="key"});o=0<m.length?"{key: someKey, "+m.join(": ..., ")+": ...}":"{key: someKey}",xe[n+o]||(m=0<m.length?"{"+m.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
let props = %s;
<%s {...props} />
React keys must be passed directly to JSX without using spread:
let props = %s;
<%s key={someKey} {...props} />`,o,n,m,n),xe[n+o]=!0)}if(n=null,t!==void 0&&(s(t),n=""+t),W(r)&&(s(r.key),n=""+r.key),"key"in r){t={};for(var A in r)A!=="key"&&(t[A]=r[A])}else t=r;return n&&Y(t,typeof e=="function"?e.displayName||e.name||"Unknown":e),j(e,n,a,c,_(),t)}function re(e,r){if(typeof e=="object"&&e&&e.$$typeof!==Oe){if(B(e))for(var t=0;t<e.length;t++){var o=e[t];z(o)&&te(o,r)}else if(z(e))e._store&&(e._store.validated=1);else if(e===null||typeof e!="object"?t=null:(t=le&&e[le]||e["@@iterator"],t=typeof t=="function"?t:null),typeof t=="function"&&t!==e.entries&&(t=t.call(e),t!==e))for(;!(e=t.next()).done;)z(e.value)&&te(e.value,r)}}function z(e){return typeof e=="object"&&e!==null&&e.$$typeof===$}function te(e,r){if(e._store&&!e._store.validated&&e.key==null&&(e._store.validated=1,r=Re(r),!we[r])){we[r]=!0;var t="";e&&e._owner!=null&&e._owner!==_()&&(t=null,typeof e._owner.tag=="number"?t=i(e._owner.type):typeof e._owner.name=="string"&&(t=e._owner.name),t=" It was passed a child from "+t+".");var o=y.getCurrentStack;y.getCurrentStack=function(){var c=O(e.type);return o&&(c+=o()||""),c},console.error('Each child in a list should have a unique "key" prop.%s%s See https://react.dev/link/warning-keys for more information.',r,t),y.getCurrentStack=o}}function Re(e){var r="",t=_();return t&&(t=i(t.type))&&(r=`
Check the render method of \``+t+"`."),r||(e=i(e))&&(r=`
Check the top-level render call using <`+e+">."),r}var _e=x,$=Symbol.for("react.transitional.element"),Se=Symbol.for("react.portal"),V=Symbol.for("react.fragment"),ne=Symbol.for("react.strict_mode"),oe=Symbol.for("react.profiler"),ae=Symbol.for("react.consumer"),ie=Symbol.for("react.context"),F=Symbol.for("react.forward_ref"),J=Symbol.for("react.suspense"),H=Symbol.for("react.suspense_list"),q=Symbol.for("react.memo"),G=Symbol.for("react.lazy"),Ae=Symbol.for("react.offscreen"),le=Symbol.iterator,Ce=Symbol.for("react.client.reference"),y=_e.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,se=Object.prototype.hasOwnProperty,T=Object.assign,ke=Symbol.for("react.client.reference"),B=Array.isArray,N=0,ue,ce,fe,de,ve,Ee,be;b.__reactDisabledLog=!0;var L,ge,X=!1,Z=new(typeof WeakMap=="function"?WeakMap:Map),Oe=Symbol.for("react.client.reference"),me,pe={},xe={},we={};k.Fragment=V,k.jsx=function(e,r,t,o,c){return S(e,r,t,!1,o,c)},k.jsxs=function(e,r,t,o,c){return S(e,r,t,!0,o,c)}}()),k}var K;function ye(){return K||(K=1,process.env.NODE_ENV==="production"?w.exports=he():w.exports=je()),w.exports}var g=ye();const D=["exe","scr","msi","bat","sh","cmd","com","dll","pif","vb","vbe","vbs","ws","wsc","wsf","wsh"],Te={container:{flexDirection:"column",backgroundColor:"#fff",borderRadius:"10px",boxShadow:"0 1px 2px 0 rgb(0 0 0 / 10%)",padding:"auto"},svg:{position:"relative",userSelect:"none",display:"inline-block",height:"42px",fill:"grey"},noPreviewText:{color:"rgb(128, 144, 162)",fontSize:"12px",textAlign:"center"}};function ee({type:i,url:E,file:s,onError:b}){var d;let u=E||"";if(i==="file"&&s)try{const l=(d=s.name.split(".").pop())==null?void 0:d.toLowerCase();if(s.type===""||D.includes(l||"")||s.type.includes("application")&&s.type!=="application/pdf"){const v=`${s.name} is not a valid file.`;b?b(v):alert(v)}else u=URL.createObjectURL(s)}catch(l){b?b(l):alert(l)}return{url:u,preview:u!==""?"imgPreview":"noURL"}}return({type:i="url",file:E=null,url:s="",width:b="424px",height:u="424px",invalidExtensions:d=D,styles:l=Te,onError:v})=>{const[O,_]=x.useState(()=>{const{url:j,preview:S}=ee({type:i,url:s,file:E,onError:v});return{preview:S,type:i,file:E,url:j}}),W={width:"100%",height:u};x.useEffect(()=>{const{url:j,preview:S}=ee({type:i,url:s,file:E,onError:v});_({preview:S,type:i,file:E,url:j})},[i,E,s,v]);const{preview:Y,url:M}=O;return g.jsx("div",{style:{...l.container,width:b},children:Y==="imgPreview"?g.jsx("img",{src:M,onError:()=>_(j=>({...j,preview:"docPreview"})),style:W,alt:"Preview"}):Y==="docPreview"?g.jsx("object",{style:{width:"100%",objectFit:"cover",objectPosition:"center",aspectRatio:"4/3"},data:M}):g.jsx("div",{style:{...l.container,padding:"5em"},children:g.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:7},children:[g.jsx("svg",{color:"grey",viewBox:"0 0 24 24",style:l.svg,children:g.jsxs("g",{children:[g.jsx("path",{d:"M2.25 24A2.252 2.252 0 0 1 0 21.75V2.25A2.252 2.252 0 0 1 2.25 0h19.5A2.252 2.252 0 0 1 24 2.25v19.5A2.252 2.252 0 0 1 21.75 24H2.25zm0-22.5a.75.75 0 0 0-.75.75v19.5c0 .414.336.75.75.75h19.5a.75.75 0 0 0 .75-.75V2.25a.75.75 0 0 0-.75-.75H2.25z"}),g.jsx("path",{d:"M16.5 11.25c-2.068 0-3.75-1.682-3.75-3.75s1.682-3.75 3.75-3.75 3.75 1.682 3.75 3.75-1.682 3.75-3.75 3.75zm0-6c-1.241 0-2.25 1.009-2.25 2.25s1.009 2.25 2.25 2.25 2.25-1.009 2.25-2.25-1.009-2.25-2.25-2.25zM15.655 19.858a.746.746 0 0 1-.699-.478 7.507 7.507 0 0 0-1.132-1.96l-.021-.026a7.364 7.364 0 0 0-3.819-2.495 7.485 7.485 0 0 0-1.979-.268 7.442 7.442 0 0 0-3.674.98.754.754 0 0 1-1.023-.281.751.751 0 0 1 .28-1.023 8.936 8.936 0 0 1 4.415-1.177 8.97 8.97 0 0 1 2.376.322 8.892 8.892 0 0 1 4.1 2.441 5.243 5.243 0 0 1 2.902-.879c1.219 0 2.402.427 3.331 1.204a.743.743 0 0 1 .266.509.743.743 0 0 1-.172.548.747.747 0 0 1-1.056.094 3.699 3.699 0 0 0-2.369-.855c-.692 0-1.375.195-1.957.555a8.833 8.833 0 0 1 .928 1.769.747.747 0 0 1-.697 1.02z"})]})}),g.jsx("span",{style:l.noPreviewText,children:"No Preview Available"})]})})})}});