@apideck/file-picker
Version:
A React file picker component that works with the Apideck [File Storage API](https://developers.apideck.com/apis/file-storage/reference).
3 lines (2 loc) • 35.2 kB
JavaScript
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react"),r=e(t),n=require("@headlessui/react"),a=require("react-dom"),o=e(require("swr")),l=require("react-table"),i=require("react-waypoint");function c(e,t,r,n,a,o,l){try{var i=e[o](l),c=i.value}catch(e){return void r(e)}i.done?t(c):Promise.resolve(c).then(n,a)}function s(e){return function(){var t=this,r=arguments;return new Promise((function(n,a){var o=e.apply(t,r);function l(e){c(o,n,a,l,i,"next",e)}function i(e){c(o,n,a,l,i,"throw",e)}l(void 0)}))}}function u(){return(u=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e}).apply(this,arguments)}var m,d=["children","onClose","isOpen","className","style"],f=r.forwardRef((function(e,o){var l=e.children,i=e.onClose,c=e.isOpen,s=e.className,m=void 0===s?"":s,f=e.style,p=void 0===f?{}:f,h=function(e,t){if(null==e)return{};var r,n,a={},o=Object.keys(e);for(n=0;n<o.length;n++)t.indexOf(r=o[n])>=0||(a[r]=e[r]);return a}(e,d),v=t.useState(!1),g=v[0],y=v[1];t.useEffect((function(){y(!0)}),[]);var x=r.createElement(n.Transition,{show:c},r.createElement(n.Transition.Child,{enter:"transition ease-out duration-150",enterFrom:"opacity-0",enterTo:"opacity-100",leave:"transition ease-in duration-150",leaveFrom:"opacity-100",leaveTo:"opacity-0"},r.createElement("div",{className:"fixed inset-0 z-40 flex items-end bg-gray-400 bg-opacity-75 dark:bg-gray-600 sm:items-center sm:justify-center","data-testid":"backdrop",onClick:i},r.createElement(n.Transition.Child,Object.assign({enter:"transition ease-out duration-150",enterFrom:"opacity-0 transform translate-y-1/4 scale-95",enterTo:"opacity-100 scale-100",leave:"transition ease-in duration-150",leaveFrom:"opacity-100 scale-100",leaveTo:"opacity-0 transform translate-y-1/4 scale-95",className:"w-full p-5 overflow-hidden bg-white dark:bg-gray-800 dark-text-gray-400 shadow-lg rounded-t-lg sm:p-6 no-scrollbar sm:rounded-lg sm:m-4 sm:max-w-xl relative "+m,style:u({maxHeight:"90%"},p),ref:o,role:"dialog",onClick:function(e){return e.stopPropagation()}},h),l))));return g?a.createPortal(x,document.body):null})),p=(function(e){var t=function(e){var t=Object.prototype,r=t.hasOwnProperty,n="function"==typeof Symbol?Symbol:{},a=n.iterator||"@@iterator",o=n.asyncIterator||"@@asyncIterator",l=n.toStringTag||"@@toStringTag";function i(e,t,r){return Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}),e[t]}try{i({},"")}catch(e){i=function(e,t,r){return e[t]=r}}function c(e,t,r,n){var a=Object.create((t&&t.prototype instanceof m?t:m).prototype),o=new N(n||[]);return a._invoke=function(e,t,r){var n="suspendedStart";return function(a,o){if("executing"===n)throw new Error("Generator is already running");if("completed"===n){if("throw"===a)throw o;return{value:void 0,done:!0}}for(r.method=a,r.arg=o;;){var l=r.delegate;if(l){var i=w(l,r);if(i){if(i===u)continue;return i}}if("next"===r.method)r.sent=r._sent=r.arg;else if("throw"===r.method){if("suspendedStart"===n)throw n="completed",r.arg;r.dispatchException(r.arg)}else"return"===r.method&&r.abrupt("return",r.arg);n="executing";var c=s(e,t,r);if("normal"===c.type){if(n=r.done?"completed":"suspendedYield",c.arg===u)continue;return{value:c.arg,done:r.done}}"throw"===c.type&&(n="completed",r.method="throw",r.arg=c.arg)}}}(e,r,o),a}function s(e,t,r){try{return{type:"normal",arg:e.call(t,r)}}catch(e){return{type:"throw",arg:e}}}e.wrap=c;var u={};function m(){}function d(){}function f(){}var p={};i(p,a,(function(){return this}));var h=Object.getPrototypeOf,v=h&&h(h(k([])));v&&v!==t&&r.call(v,a)&&(p=v);var g=f.prototype=m.prototype=Object.create(p);function y(e){["next","throw","return"].forEach((function(t){i(e,t,(function(e){return this._invoke(t,e)}))}))}function x(e,t){var n;this._invoke=function(a,o){function l(){return new t((function(n,l){!function n(a,o,l,i){var c=s(e[a],e,o);if("throw"!==c.type){var u=c.arg,m=u.value;return m&&"object"==typeof m&&r.call(m,"__await")?t.resolve(m.__await).then((function(e){n("next",e,l,i)}),(function(e){n("throw",e,l,i)})):t.resolve(m).then((function(e){u.value=e,l(u)}),(function(e){return n("throw",e,l,i)}))}i(c.arg)}(a,o,n,l)}))}return n=n?n.then(l,l):l()}}function w(e,t){var r=e.iterator[t.method];if(void 0===r){if(t.delegate=null,"throw"===t.method){if(e.iterator.return&&(t.method="return",t.arg=void 0,w(e,t),"throw"===t.method))return u;t.method="throw",t.arg=new TypeError("The iterator does not provide a 'throw' method")}return u}var n=s(r,e.iterator,t.arg);if("throw"===n.type)return t.method="throw",t.arg=n.arg,t.delegate=null,u;var a=n.arg;return a?a.done?(t[e.resultName]=a.value,t.next=e.nextLoc,"return"!==t.method&&(t.method="next",t.arg=void 0),t.delegate=null,u):a:(t.method="throw",t.arg=new TypeError("iterator result is not an object"),t.delegate=null,u)}function E(e){var t={tryLoc:e[0]};1 in e&&(t.catchLoc=e[1]),2 in e&&(t.finallyLoc=e[2],t.afterLoc=e[3]),this.tryEntries.push(t)}function b(e){var t=e.completion||{};t.type="normal",delete t.arg,e.completion=t}function N(e){this.tryEntries=[{tryLoc:"root"}],e.forEach(E,this),this.reset(!0)}function k(e){if(e){var t=e[a];if(t)return t.call(e);if("function"==typeof e.next)return e;if(!isNaN(e.length)){var n=-1,o=function t(){for(;++n<e.length;)if(r.call(e,n))return t.value=e[n],t.done=!1,t;return t.value=void 0,t.done=!0,t};return o.next=o}}return{next:S}}function S(){return{value:void 0,done:!0}}return d.prototype=f,i(g,"constructor",f),i(f,"constructor",d),d.displayName=i(f,l,"GeneratorFunction"),e.isGeneratorFunction=function(e){var t="function"==typeof e&&e.constructor;return!!t&&(t===d||"GeneratorFunction"===(t.displayName||t.name))},e.mark=function(e){return Object.setPrototypeOf?Object.setPrototypeOf(e,f):(e.__proto__=f,i(e,l,"GeneratorFunction")),e.prototype=Object.create(g),e},e.awrap=function(e){return{__await:e}},y(x.prototype),i(x.prototype,o,(function(){return this})),e.AsyncIterator=x,e.async=function(t,r,n,a,o){void 0===o&&(o=Promise);var l=new x(c(t,r,n,a),o);return e.isGeneratorFunction(r)?l:l.next().then((function(e){return e.done?e.value:l.next()}))},y(g),i(g,l,"Generator"),i(g,a,(function(){return this})),i(g,"toString",(function(){return"[object Generator]"})),e.keys=function(e){var t=[];for(var r in e)t.push(r);return t.reverse(),function r(){for(;t.length;){var n=t.pop();if(n in e)return r.value=n,r.done=!1,r}return r.done=!0,r}},e.values=k,N.prototype={constructor:N,reset:function(e){if(this.prev=0,this.next=0,this.sent=this._sent=void 0,this.done=!1,this.delegate=null,this.method="next",this.arg=void 0,this.tryEntries.forEach(b),!e)for(var t in this)"t"===t.charAt(0)&&r.call(this,t)&&!isNaN(+t.slice(1))&&(this[t]=void 0)},stop:function(){this.done=!0;var e=this.tryEntries[0].completion;if("throw"===e.type)throw e.arg;return this.rval},dispatchException:function(e){if(this.done)throw e;var t=this;function n(r,n){return l.type="throw",l.arg=e,t.next=r,n&&(t.method="next",t.arg=void 0),!!n}for(var a=this.tryEntries.length-1;a>=0;--a){var o=this.tryEntries[a],l=o.completion;if("root"===o.tryLoc)return n("end");if(o.tryLoc<=this.prev){var i=r.call(o,"catchLoc"),c=r.call(o,"finallyLoc");if(i&&c){if(this.prev<o.catchLoc)return n(o.catchLoc,!0);if(this.prev<o.finallyLoc)return n(o.finallyLoc)}else if(i){if(this.prev<o.catchLoc)return n(o.catchLoc,!0)}else{if(!c)throw new Error("try statement without catch or finally");if(this.prev<o.finallyLoc)return n(o.finallyLoc)}}}},abrupt:function(e,t){for(var n=this.tryEntries.length-1;n>=0;--n){var a=this.tryEntries[n];if(a.tryLoc<=this.prev&&r.call(a,"finallyLoc")&&this.prev<a.finallyLoc){var o=a;break}}o&&("break"===e||"continue"===e)&&o.tryLoc<=t&&t<=o.finallyLoc&&(o=null);var l=o?o.completion:{};return l.type=e,l.arg=t,o?(this.method="next",this.next=o.finallyLoc,u):this.complete(l)},complete:function(e,t){if("throw"===e.type)throw e.arg;return"break"===e.type||"continue"===e.type?this.next=e.arg:"return"===e.type?(this.rval=this.arg=e.arg,this.method="return",this.next="end"):"normal"===e.type&&t&&(this.next=t),u},finish:function(e){for(var t=this.tryEntries.length-1;t>=0;--t){var r=this.tryEntries[t];if(r.finallyLoc===e)return this.complete(r.completion,r.afterLoc),b(r),u}},catch:function(e){for(var t=this.tryEntries.length-1;t>=0;--t){var r=this.tryEntries[t];if(r.tryLoc===e){var n=r.completion;if("throw"===n.type){var a=n.arg;b(r)}return a}}throw new Error("illegal catch attempt")},delegateYield:function(e,t,r){return this.delegate={iterator:k(e),resultName:t,nextLoc:r},"next"===this.method&&(this.arg=void 0),u}},e}(e.exports);try{regeneratorRuntime=t}catch(e){"object"==typeof globalThis?globalThis.regeneratorRuntime=t:Function("r","regeneratorRuntime = r")(t)}}(m={exports:{}}),m.exports),h=function(e){var t=e.folders,a=e.handleClick;return r.createElement(n.Transition,{show:!(null==t||!t.length),enter:"transition ease-out duration-200",enterFrom:"transform opacity-60",enterTo:"transform opacity-100",leave:"transition ease-in duration-200",leaveFrom:"transform opacity-100",leaveTo:"transform opacity-0"},r.createElement("div",{className:"flex items-center text-sm"},r.createElement("button",{className:"text-gray-600 hover:text-gray-900",onClick:function(){return a()}},r.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",className:"inline-block w-5 h-5 text-yellow-300",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor"},r.createElement("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M5 19a2 2 0 01-2-2V7a2 2 0 012-2h4l2 2h4a2 2 0 012 2v1M5 19h14a2 2 0 002-2v-5a2 2 0 00-2-2H9a2 2 0 00-2 2v5a2 2 0 01-2 2z"}))),t.map((function(e,o){return r.createElement(n.Transition.Child,{enter:"transition ease-out duration-200",enterFrom:"transform opacity-60 translate-x-1",enterTo:"transform opacity-100",leave:"transition ease-in duration-100",leaveFrom:"transform opacity-100",leaveTo:"transform opacity-0",className:"flex items-center",as:"div",key:e.id},r.createElement("svg",{className:"flex-shrink-0 w-5 h-5 text-gray-300",fill:"currentColor",viewBox:"0 0 20 20"},r.createElement("path",{fillRule:"evenodd",d:"M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z",clipRule:"evenodd"})),o===t.length-1?r.createElement("span",{className:"font-medium text-gray-900"},e.name):r.createElement("button",{className:"text-gray-600 hover:text-gray-900",onClick:function(){return a(e)}},e.name))}))))},v=function(e,t){if(void 0===t&&(t=2),0===e)return"0 Bytes";var r=t<0?0:t,n=Math.floor(Math.log(e)/Math.log(1024));return parseFloat((e/Math.pow(1024,n)).toFixed(r))+" "+["Bytes","KB","MB","GB","TB","PB","EB","ZB","YB"][n]},g=function(e){var t,n,a=e.file,o=e.setFile,l=e.onSelect;return a?r.createElement("div",{className:"flex flex-col justify-between h-full"},r.createElement("dl",{className:"grid grid-cols-2 gap-x-4 gap-y-6"},r.createElement("div",{className:"col-span-1"},r.createElement("dt",{className:"text-sm font-medium text-gray-500"},"Name"),r.createElement("dd",{className:"mt-1 text-sm text-gray-900"},null==a?void 0:a.name)),r.createElement("div",{className:"col-span-1"},r.createElement("dt",{className:"text-sm font-medium text-gray-500"},"Size"),r.createElement("dd",{className:"mt-1 text-sm text-gray-900"},null!=a&&a.size?v(null==a?void 0:a.size):"-")),r.createElement("div",{className:"col-span-1"},r.createElement("dt",{className:"text-sm font-medium text-gray-500"},"Mime type"),r.createElement("dd",{className:"mt-1 text-sm text-gray-900"},null==a?void 0:a.mime_type)),r.createElement("div",{className:"col-span-1"},r.createElement("dt",{className:"text-sm font-medium text-gray-500"},"Downloadable"),r.createElement("dd",{className:"mt-1 text-sm text-gray-900"},null!=a&&a.downloadable?"Yes":"No")),r.createElement("div",{className:"col-span-1"},r.createElement("dt",{className:"text-sm font-medium text-gray-500"},"Created"),r.createElement("dd",{className:"mt-1 text-sm text-gray-900"},r.createElement("div",null,r.createElement("span",{className:"mr-2 text-gray-900"},(null==a?void 0:a.created_at)&&new Date(a.created_at).toLocaleDateString()),r.createElement("span",{className:"text-gray-500 "},(null==a?void 0:a.created_at)&&new Date(a.created_at).toLocaleTimeString())))),r.createElement("div",{className:"col-span-1"},r.createElement("dt",{className:"text-sm font-medium text-gray-500"},"Updated"),r.createElement("dd",{className:"mt-1 text-sm text-gray-900"},r.createElement("div",null,r.createElement("span",{className:"mr-2 text-gray-900"},(null==a?void 0:a.updated_at)&&new Date(a.updated_at).toLocaleDateString()),r.createElement("span",{className:"text-gray-500 "},(null==a?void 0:a.updated_at)&&new Date(a.updated_at).toLocaleTimeString())))),r.createElement("div",{className:"col-span-1"},r.createElement("dt",{className:"text-sm font-medium text-gray-500"},"Owner"),r.createElement("dd",{className:"mt-1 text-sm text-gray-900"},null==a||null==(t=a.owner)?void 0:t.name)),r.createElement("div",{className:"col-span-1"},r.createElement("dt",{className:"text-sm font-medium text-gray-500"},"Email"),r.createElement("dd",{className:"mt-1 text-sm text-gray-900"},null==a||null==(n=a.owner)?void 0:n.email))),r.createElement("div",{className:"flex justify-between pt-6"},r.createElement("button",{type:"button",className:"items-center w-full px-3 py-2 mr-2 text-sm font-medium leading-4 text-gray-700 bg-white border border-gray-300 rounded-md shadow-sm sm:mr-3 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500",onClick:function(){return o(null)}},"Close"),r.createElement("button",{type:"button",className:"items-center w-full px-3 py-2 ml-2 text-sm font-medium leading-4 text-white bg-blue-600 border border-transparent rounded-md shadow-sm sm:ml-3 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500",onClick:function(){return l(a)}},"Select file"))):r.createElement("p",{className:"p-4 text-center"},"No file found")},y=[{Header:"Name"},{Header:"Size"},{Header:"Updated"}],x=function(){var e=Array.from(Array(8).keys());return r.createElement("div",{className:"overflow-auto"},r.createElement("table",{className:"min-w-full divide-y divide-gray-200"},r.createElement("thead",null,r.createElement("tr",null,y.map((function(e,t){return r.createElement("th",{key:"column-"+t,className:"py-3 space-x-6 text-xs font-medium tracking-wide text-left text-gray-500 uppercase"},e.Header)})))),r.createElement("tbody",{className:"bg-white divide-y divide-gray-200"},e.map((function(e,t){return r.createElement(w,{key:t})})))))},w=function(){return r.createElement("tr",null,y.map((function(e,t){return r.createElement("td",{className:"py-4 space-x-6 text-sm font-medium truncate whitespace-nowrap",key:"cell-"+t,style:{maxWidth:100}},r.createElement("span",{className:"px-16 py-0 bg-gray-200 rounded-sm animate-pulse"}))})))},E=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],b=function(e){var t=e.data,a=void 0===t?[]:t,o=e.isLoadingMore,i=e.handleSelect,c=r.useMemo((function(){return[{Header:"Name",accessor:"name",Cell:function(e){return"folder"===e.row.original.type?r.createElement("div",{className:"flex items-center"},r.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",className:"inline-block w-5 h-5 mr-1 text-yellow-300",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor"},r.createElement("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M3 7v10a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-6l-2-2H5a2 2 0 00-2 2z"})),r.createElement("span",{className:"truncate"},e.value)):r.createElement("div",{className:"flex items-center truncate"},r.createElement("svg",{viewBox:"0 0 24 24",className:"inline-block w-5 h-5 mr-1 text-gray-500"},r.createElement("path",{d:"M17 6v12c0 .52-.2 1-1 1H4c-.7 0-1-.33-1-1V2c0-.55.42-1 1-1h8l5 5zM14 8h-3.13c-.51 0-.87-.34-.87-.87V4",stroke:"currentColor",fill:"none",fillRule:"evenodd",strokeLinejoin:"round"})),r.createElement("span",{className:"truncate"},e.value))}},{Header:"Size",accessor:"size",Cell:function(e){var t=e.value;return r.createElement("div",null,t?v(t):null)}},{Header:"Updated",accessor:"updated_at",Cell:function(e){var t=e.value;if(!t)return r.createElement("span",{className:"text-gray-900"},"-");var n=new Date(t);return r.createElement("span",{className:"text-gray-900 "},E[n.getMonth()]+" "+n.getDay()+", "+new Date(t).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"}))}}]}),[]),s=l.useTable({columns:c,data:a},l.useSortBy),u=s.getTableBodyProps,m=s.rows,d=s.prepareRow;return r.createElement("div",{className:"overflow-auto"},r.createElement("table",{className:"min-w-full divide-y divide-gray-200"},r.createElement("thead",{className:""},s.headerGroups.map((function(e,t){return r.createElement("tr",Object.assign({},e.getHeaderGroupProps(),{key:"headerGroup"+t}),e.headers.map((function(e,t){return r.createElement("th",Object.assign({key:"column-"+t,className:"py-3 pr-2 space-x-6 text-xs font-medium tracking-wide text-left text-gray-500 uppercase"},e.getHeaderProps(e.getSortByToggleProps())),e.render("Header"),r.createElement("span",null,e.isSorted?r.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",className:"inline-block w-4 h-4 ml-2 text-gray-500"},r.createElement("path",e.isSortedDesc?{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"}:{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M5 15l7-7 7 7"})):""))})))}))),r.createElement("tbody",Object.assign({},u(),{className:"bg-white divide-y divide-gray-200"}),m.map((function(e,t){return d(e),r.createElement(n.Transition,Object.assign({show:!0,enter:"transition ease-out duration-300",enterFrom:"transform opacity-40",enterTo:"transform opacity-100",leave:"transition ease-in duration-300",leaveFrom:"transform opacity-100",leaveTo:"transform opacity-0",as:"tr"},e.getRowProps(),{key:"row-"+t,className:"cursor-pointer hover:bg-gray-50",onClick:function(){return i(e.original)}}),e.cells.map((function(e,t){return r.createElement("td",Object.assign({className:"py-3 space-x-6 text-xs text-gray-900 truncate max-w-2xs whitespace-nowrap",style:{maxWidth:"16rem"}},e.getCellProps(),{key:"cell-"+t}),e.render("Cell"))})))})))),o?r.createElement("table",{className:"min-w-full divide-y divide-gray-200"},Array.from(Array(12).keys()).map((function(e){return r.createElement(w,{key:e})}))):"")},N=function(e){var n=e.onChange,a=e.searchTerm,o=e.isSearchVisible,l=e.setIsSearchVisible,i=t.useRef(null),c=function(){o?(n(""),l(!1)):(l(!0),setTimeout((function(){var e;null==(e=i.current)||e.focus()}),0))};return o?r.createElement("div",{className:"h-5"},r.createElement("div",{className:"absolute w-full -inset-x-0 -top-2"},r.createElement("div",{className:"relative"},r.createElement("button",{className:"absolute right-2 top-2",onClick:function(){return c()}},r.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",className:"w-5 h-5 text-gray-400 transition duration-150 hover:text-gray-500",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor"},r.createElement("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"}))),r.createElement("input",{className:"w-full px-3 py-2 mb-3 text-sm leading-tight text-gray-700 border border-gray-200 rounded shadow-sm appearance-none focus:outline-none focus:shadow-outline",name:"search",placeholder:"Search",autoComplete:"off",ref:i,onChange:function(e){return n(e.target.value)},value:a})))):r.createElement("button",{className:"",onClick:function(){return c()}},r.createElement("svg",{className:"w-5 h-5 text-gray-400 transition duration-150 hover:text-gray-500",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 20 20",fill:"currentColor","aria-hidden":"true"},r.createElement("path",{fillRule:"evenodd",d:"M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z",clipRule:"evenodd"})))},k=function(e){var a;return r.createElement(n.Transition,{show:e.open,as:t.Fragment},r.createElement("div",{className:"absolute bottom-0 left-0 right-0 rounded-t-2xl",style:(null==(a=window)?void 0:a.innerWidth)>768?{width:"calc(100% - 3rem)",left:"1.5rem"}:{width:"calc(100% - 2rem)",left:"1rem"}},r.createElement(n.Transition.Child,{as:t.Fragment,enter:"transform transition ease-in-out duration-300",enterFrom:"translate-y-full",enterTo:"translate-y-0",leave:"transform transition ease-in-out duration-300",leaveFrom:"translate-y-0",leaveTo:"translate-y-full"},r.createElement("div",{className:"relative w-full rounded-t-2xl"},r.createElement("div",{className:"flex flex-col h-full py-6 overflow-y-auto border border-gray-200 rounded-t-lg shadow-sm bg-gray-50"},r.createElement("div",{className:"relative flex-1 px-4 sm:px-6"},e.children))))))},S="undefined"==typeof window||"Deno"in window?t.useEffect:t.useLayoutEffect,j={}[0],L=function(e){return e===j},C=function(e){return"function"==typeof e},T=new WeakMap,O=0;function M(e){if(C(e))try{e=e()}catch(t){e=""}var t;return Array.isArray(e)?(t=e,e=function(e){if(!e.length)return"";for(var t="arg",r=0;r<e.length;++r){var n=e[r],a=j;null===n||"object"!=typeof n&&!C(n)?a=JSON.stringify(n):T.has(n)?a=T.get(n):(a=O,T.set(n,O++)),t+="$"+a}return t}(e)):t=[e=String(e||"")],[e,t,e?"$err$"+e:"",e?"$req$"+e:""]}function F(e){return C(e[1])?[e[0],e[1],e[2]||{}]:[e[0],null,(null===e[1]?e[2]:e[1])||{}]}var _=function(e,t){return function(){for(var r=[],n=0;n<arguments.length;n++)r[n]=arguments[n];var a=F(r),o=a[0],l=a[1],i=a[2];return i.use=(i.use||[]).concat(t),e(o,l,i)}}(o,(function(e){return function(r,n,a){var o=a.cache,l=a.initialSize,i=void 0===l?1:l,c=a.revalidateAll,s=void 0!==c&&c,u=a.persistSize,m=void 0!==u&&u,d=null;try{d=function(e){return M(e?e(0,null):null)[0]}(r)}catch(e){}var f=t.useState({})[1],p=null;d&&(p="$ctx$"+d);var h=null;d&&(h="$len$"+d);var v=t.useRef(!1),g=t.useCallback((function(){var e=o.get(h);return L(e)?i:e}),[h,i]),y=t.useRef(g());S((function(){v.current?d&&o.set(h,m?y.current:i):v.current=!0}),[d]);var x=t.useRef(),w=e(d?"$inf$"+d:null,(function(){return function(e,t,r,n){return new(r||(r=Promise))((function(e,t){function a(e){try{l(n.next(e))}catch(e){t(e)}}function o(e){try{l(n.throw(e))}catch(e){t(e)}}function l(t){var n;t.done?e(t.value):(n=t.value,n instanceof r?n:new r((function(e){e(n)}))).then(a,o)}l((n=n.apply(void 0,[])).next())}))}(0,0,void 0,(function(){var e,t,l,i,c,u,m,d,f,h,v,y;return function(e,t){var r,n,a,o,l={label:0,sent:function(){if(1&a[0])throw a[1];return a[1]},trys:[],ops:[]};return o={next:i(0),throw:i(1),return:i(2)},"function"==typeof Symbol&&(o[Symbol.iterator]=function(){return this}),o;function i(o){return function(i){return function(o){if(r)throw new TypeError("Generator is already executing.");for(;l;)try{if(r=1,n&&(a=2&o[0]?n.return:o[0]?n.throw||((a=n.return)&&a.call(n),0):n.next)&&!(a=a.call(n,o[1])).done)return a;switch(n=0,a&&(o=[2&o[0],a.value]),o[0]){case 0:case 1:a=o;break;case 4:return l.label++,{value:o[1],done:!1};case 5:l.label++,n=o[1],o=[0];continue;case 7:o=l.ops.pop(),l.trys.pop();continue;default:if(!((a=(a=l.trys).length>0&&a[a.length-1])||6!==o[0]&&2!==o[0])){l=0;continue}if(3===o[0]&&(!a||o[1]>a[0]&&o[1]<a[3])){l.label=o[1];break}if(6===o[0]&&l.label<a[1]){l.label=a[1],a=o;break}if(a&&l.label<a[2]){l.label=a[2],l.ops.push(o);break}a[2]&&l.ops.pop(),l.trys.pop();continue}o=t.call(e,l)}catch(e){o=[6,e],n=0}finally{r=a=0}if(5&o[0])throw o[1];return{value:o[0]?o[1]:void 0,done:!0}}([o,i])}}}(this,(function(w){switch(w.label){case 0:e=o.get(p)||[],t=e[0],l=e[1],i=[],c=g(),u=null,m=0,w.label=1;case 1:return m<c?(d=M(r?r(m,u):null),h=d[1],(f=d[0])?(v=o.get(f),y=s||t||L(v)||!m&&!L(x.current)||l&&!L(l[m])&&!a.compare(l[m],v),n&&y?[4,n.apply(void 0,h)]:[3,3]):[3,5]):[3,5];case 2:v=w.sent(),o.set(f,v),w.label=3;case 3:i.push(v),u=v,w.label=4;case 4:return++m,[3,1];case 5:return o.delete(p),[2,i]}}))}))}),a);S((function(){x.current=w.data}),[w.data]);var E=t.useCallback((function(e,t){if(void 0===t&&(t=!0),p)return t&&!L(e)?o.set(p,[!1,x.current]):t&&o.set(p,[!0]),w.mutate(e,t)}),[p]),b=t.useCallback((function(e){var t;if(h&&(C(e)?t=e(g()):"number"==typeof e&&(t=e),"number"==typeof t))return o.set(h,t),y.current=t,f({}),E(function(e){for(var t=[],n=null,a=0;a<e;++a){var l=M(r?r(a,n):null)[0],i=l?o.get(l):j;if(L(i))return x.current;t.push(i),n=i}return t}(t))}),[h,g,E]);return{size:g(),setSize:b,mutate:E,get error(){return w.error},get data(){return w.data},get isValidating(){return w.isValidating}}}})),B=function(e){var n,a,o,l,c,u=e.appId,m=e.consumerId,d=e.jwt,f=e.serviceId,v=e.onSelect,y=t.useState("root"),w=y[0],E=y[1],S=t.useState([]),j=S[0],L=S[1],C=t.useState(null),T=C[0],O=C[1],M=t.useState(""),F=M[0],B=M[1],z=t.useState(),P=z[0],I=z[1],R=t.useState(!1),A=R[0],H=R[1],W=t.useState(!1),G=W[0],D=W[1],V=function(e,r){void 0===r&&(r=500);var n=t.useState(e),a=n[0],o=n[1],l=t.useRef(null),i=function(){null!==l.current&&clearInterval(l.current)};return t.useEffect((function(){return l.current=setTimeout((function(){o(e)}),r),i}),[e,r]),t.useEffect((function(){return i}),[]),a}(F),$=(l=f,c=t.useRef(),t.useEffect((function(){c.current=l}),[l]),c.current),q=null==V?void 0:V.length,J={"Content-Type":"application/json","x-apideck-auth-type":"JWT","x-apideck-app-id":u,"x-apideck-consumer-id":m,"x-apideck-service-id":f,Authorization:"Bearer "+d},Y=_((function(e,t){var r,n,a,o=$&&$!==f?"root":w,l="https://unify.apideck.com/file-storage/files?limit=30&"+("shared"===o?"filter[shared]=true":"filter[folder_id]="+o)+"#serviceId="+f;return!t||null!=t&&null!=(r=t.data)&&r.length?0===e?l:l+"&cursor="+(null==t||null==(n=t.meta)||null==(a=n.cursors)?void 0:a.next):null}),function(){var e=s(p.mark((function e(t){var r;return p.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.next=2,fetch(t,{headers:J});case 2:return r=e.sent,e.next=5,r.json();case 5:return e.abrupt("return",e.sent);case 6:case"end":return e.stop()}}),e)})));return function(t){return e.apply(this,arguments)}}(),{shouldRetryOnError:!1}),U=Y.data,K=Y.setSize,Z=Y.size,Q=Y.error;t.useEffect((function(){$&&$!==f&&(E("root"),L([]))}),[f,$]);var X=Q||(null==U?void 0:U.length)&&(null==(n=U[U.length-1])?void 0:n.error),ee=!U&&!Q,te=Z>0&&U&&void 0===U[Z-1],re=(null==U?void 0:U.map((function(e){return null==e?void 0:e.data})).flat())||[];if("root"===w&&null!=U&&U.length&&"google-drive"===f){var ne,ae={id:"shared",name:"Shared with me",type:"folder"};null!=(ne=re)&&ne.length?re=[ae].concat(re):re.push(ae)}t.useEffect((function(){null!=V&&V.length&&(H(!0),function(){var e=s(p.mark((function e(){var t;return p.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return t={headers:J,method:"POST",body:JSON.stringify({query:V})},e.next=4,fetch("https://unify.apideck.com/file-storage/files/search",t);case 4:return e.abrupt("return",e.sent.json());case 6:case"end":return e.stop()}}),e)})));return function(){return e.apply(this,arguments)}}()().then((function(e){I(e.data)})).finally((function(){return H(!1)})))}),[V,f]);var oe=q?null==P?void 0:P.length:null==(a=re)?void 0:a.length;return r.createElement(t.Fragment,null,r.createElement("div",{className:"relative flex items-center mb-1 "+(null!=j&&j.length?"justify-between":"justify-end")},r.createElement(h,{folders:j,handleClick:function(e){if(e){E(e.id);var t=j.indexOf(e),r=[].concat(j.slice(0,t+1));L(r)}else E("root"),L([])}}),r.createElement(N,{onChange:function(e){B(e)},searchTerm:F,isSearchVisible:G,setIsSearchVisible:D})),ee||A?r.createElement(x,null):null,!ee&&oe?r.createElement(b,{data:q&&P?P:re,handleSelect:function(e){"folder"===e.type&&(E(e.id),q?(B(""),D(!1),L([e])):L([].concat(j,[e]))),"file"===e.type&&O(e)},isLoadingMore:te}):null,ee||oe?null:r.createElement("p",{className:"py-4 text-sm text-center text-gray-700"},"No files found"),ee?null:r.createElement(k,{open:!!T},r.createElement(g,{file:T,setFile:O,onSelect:v})),!ee&&Q?r.createElement("p",{className:"text-red-600"},(null==X?void 0:X.message)||X):null,null==(o=re)||!o.length||te||q?null:r.createElement("div",{className:"flex flex-row-reverse py-4 border-gray-200"},r.createElement(i.Waypoint,{onEnter:function(){var e,t,r;(null==U?void 0:U.length)&&(null==(e=U[U.length-1])||null==(t=e.meta)||null==(r=t.cursors)?void 0:r.next)&&K(Z+1)}})))},z=function(e){var t=e.className;return r.createElement("svg",{className:"text-blue-600 animate-spin "+(void 0===t?"w-8 h-8":t),xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24"},r.createElement("circle",{className:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),r.createElement("path",{className:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"}))},P=function(e){var t=e.jwt,a=e.connections,o=e.connection,l=e.setConnection,i=e.isLoading,c=function(e){return e.enabled?"callable"!==e.state?"bg-yellow-400":"bg-green-400":"bg-gray-300"};return r.createElement("div",{className:"relative inline-block"},r.createElement(n.Menu,null,(function(e){var s=e.open;return r.createElement(r.Fragment,null,r.createElement(n.Menu.Button,{className:"flex items-center justify-between w-full px-4 py-2 text-sm font-medium text-blue-800 bg-blue-100 border border-blue-200 rounded-md group hover:bg-cool-gray-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-cool-gray-100 focus:ring-blue-600",style:{minWidth:180}},r.createElement("div",null,!i&&(null==o?void 0:o.icon)&&r.createElement("img",{className:"inline-block w-6 h-6 mr-2 rounded-full "+(i?"animate-spin opacity-20":""),src:!i&&null!=o&&o.icon?null==o?void 0:o.icon:"/img/logo.png",alt:""}),i&&r.createElement(z,{className:"w-6 h-6"}),!i&&r.createElement("span",null,(null==o?void 0:o.name)||"No integrations")),r.createElement("svg",{className:"w-5 h-5 ml-2 -mr-1",viewBox:"0 0 20 20",fill:"currentColor"},r.createElement("path",{fillRule:"evenodd",d:"M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z",clipRule:"evenodd"}))),r.createElement(n.Transition,{show:s,enter:"transition ease-out duration-100",enterFrom:"transform opacity-0 scale-95",enterTo:"transform opacity-100 scale-100",leave:"transition ease-in duration-75",leaveFrom:"transform opacity-100 scale-100",leaveTo:"transform opacity-0 scale-95",className:"min-w-sm"},r.createElement(n.Menu.Items,{static:!0,className:"absolute right-0 z-10 w-full mt-2 origin-top-right bg-white border divide-y rounded-md outline-none border-cool-gray-200 divide-cool-gray-100"},r.createElement("div",{className:"py-1"},null==a?void 0:a.map((function(e,a){return r.createElement(n.Menu.Item,{key:a},(function(n){return r.createElement("div",{onClick:function(){return function(e){"callable"!==e.state?window.location.href="available"!==e.state?"https://vault.apideck.com/integrations/file-storage/"+(null==e?void 0:e.service_id)+"?jwt="+t:"https://vault.apideck.com/integrations/file-storage/"+(null==e?void 0:e.service_id)+"/enable?jwt="+t:l(e)}(e)},className:(n.active?"bg-gray-100 text-gray-900":"text-gray-600")+" flex items-center justify-between min-w-0 mx-2 cursor-pointer rounded-md py-0.5 overflow-hidden "+(e.enabled?"":"opacity-60")},r.createElement("img",{className:"flex-shrink-0 w-6 h-6 m-2 rounded-full",src:e.icon,alt:""}),r.createElement("span",{className:"flex-1 min-w-0"},r.createElement("span",{className:"text-sm font-medium text-gray-900 truncate"},e.name)),r.createElement("span",{className:"inline-block w-2.5 h-2.5 mr-2 rounded-full ring-2 ring-white "+c(e)}))}))})),r.createElement(n.Menu.Item,null,(function(e){return r.createElement("div",{onClick:function(){window.location.href="https://vault.apideck.com/session/"+t},className:(e.active?"bg-gray-100 text-gray-900":"text-gray-600")+" flex items-center justify-between min-w-0 mx-2 cursor-pointer rounded-md py-0.5 overflow-hidden"},r.createElement("svg",{className:"flex-shrink-0 w-6 h-6 m-2",xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor"},r.createElement("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 6v6m0 0v6m0-6h6m-6 0H6"})),r.createElement("span",{className:"flex-1 min-w-0"},r.createElement("span",{className:"text-sm font-medium text-gray-900 truncate"},"Add integration")))}))))))})))},I=function(e){var n=e.appId,a=e.consumerId,l=e.jwt,i=e.onSelect,c=e.title,u=e.subTitle,m=t.useState(),d=m[0],f=m[1],h=o("https://unify.apideck.com/vault/connections?api=file-storage",function(){var e=s(p.mark((function e(t){var r;return p.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.next=2,fetch(t,{headers:{"Content-Type":"application/json","x-apideck-consumer-id":a,"x-apideck-app-id":n,"x-apideck-auth-type":"JWT",Authorization:"Bearer "+l}});case 2:return r=e.sent,e.next=5,r.json();case 5:return e.abrupt("return",e.sent);case 6:case"end":return e.stop()}}),e)})));return function(t){return e.apply(this,arguments)}}(),{shouldRetryOnError:!1}),v=h.data,g=h.error,y=!v&&!g,x=(null==v?void 0:v.error)||g,w=null==v?void 0:v.data,E=null==w?void 0:w.filter((function(e){return"callable"===e.state}));return t.useEffect((function(){!d&&null!=E&&E.length&&f(E[0])}),[f,E]),r.createElement("div",{className:"-m-6 bg-white sm:rounded-lg h-modal",style:{height:"34rem"}},r.createElement("div",{className:"flex items-center justify-between px-4 py-5 sm:px-6"},r.createElement("div",null,r.createElement("h3",{className:"text-lg font-medium leading-6 text-gray-900"},c),r.createElement("p",{className:"max-w-2xl mt-1 text-sm text-gray-500"},x?r.createElement("span",{className:"mb-2 text-red-600"},x):r.createElement("span",{className:"text-gray-700 dark:text-gray-400"},d?u:"No connector selected"))),r.createElement(P,{jwt:l,connections:w,connection:d,setConnection:f,isLoading:y})),r.createElement("div",{className:"h-full px-4 py-5 overflow-y-auto border-t border-gray-200 sm:px-6"},d?r.createElement(B,{appId:n,consumerId:a,serviceId:d.service_id,jwt:l,onSelect:i}):null!=E&&E.length||y?null:r.createElement("div",{className:"flex items-center justify-center border-2 border-gray-200 border-dashed rounded-lg h-96"},r.createElement("div",{className:"text-center"},r.createElement("a",{href:"https://vault.apideck.com/session/"+l,target:"_blank",rel:"noreferrer",className:"text-indigo-600 hover:text-indigo-900"},"Go to vault")," ","to add file storage connectors"))))};exports.FilePicker=t.forwardRef((function(e,n){var a=e.appId,o=e.consumerId,l=e.jwt,i=e.trigger,c=e.onSelect,s=e.title,u=void 0===s?"Apideck File Picker":s,m=e.subTitle,d=void 0===m?"Select a file":m,p=t.useState(!1),h=p[0],v=p[1];return r.createElement(t.Fragment,null,r.cloneElement(i,{onClick:function(){return v(!0)},ref:n}),r.createElement(f,{isOpen:h,onClose:function(){return v(!1)}},r.createElement(I,{appId:a,consumerId:o,jwt:l,onSelect:function(e){c(e),v(!1)},title:u,subTitle:d})))}));
//# sourceMappingURL=file-picker.cjs.production.min.js.map