Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

tweakpane-plugin-file-import

Package Overview
Dependencies
Maintainers
1
Versions
13
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

tweakpane-plugin-file-import - npm Package Compare versions

Comparing version 0.1.7 to 0.2.0

13

dist/tweakpane-plugin-file-import.js

@@ -338,2 +338,3 @@ (function (global, factory) {

this.warning.classList.add(containerClassName('warning'));
this.warning.innerHTML = config.invalidFiletypeMessage;
this.warning.style.display = 'none';

@@ -373,2 +374,3 @@ // Delete button

value: config.value,
invalidFiletypeMessage: config.invalidFiletypeMessage,
lineCount: config.lineCount,

@@ -422,6 +424,4 @@ filetypes: config.filetypes,

this.view.warning.style.display = 'block';
this.view.warning.innerHTML = 'Unaccepted file type.';
setTimeout(() => {
// Resetting warning text
this.view.warning.innerHTML = '';
this.view.warning.style.display = 'none';

@@ -551,3 +551,3 @@ }, 5000);

// See rollup.config.js for details
css: '.tp-ctnv{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:rgba(0,0,0,0);border-width:0;font-family:inherit;font-size:inherit;font-weight:inherit;margin:0;outline:none;padding:0}.tp-ctnv{background-color:var(--in-bg);border-radius:var(--elm-br);box-sizing:border-box;color:var(--in-fg);font-family:inherit;height:var(--bld-us);line-height:var(--bld-us);min-width:0;width:100%}.tp-ctnv:hover{background-color:var(--in-bg-h)}.tp-ctnv:focus{background-color:var(--in-bg-f)}.tp-ctnv:active{background-color:var(--in-bg-a)}.tp-ctnv:disabled{opacity:.5}.tp-ctnv{cursor:pointer;display:flex;justify-content:center;align-items:center;overflow:hidden;position:relative;height:100%;width:100%;border:1px dashed #717070;border-radius:5px}.tp-ctnv.tp-v-disabled{opacity:.5}.tp-ctnv_input_area_dragging{border:1px dashed #6774ff;background-color:rgba(88,88,185,.231372549)}.tp-ctnv_warning{color:var(--in-fg);bottom:2px;display:inline-block;font-size:.9em;height:-moz-max-content;height:max-content;line-height:.9;margin:.2rem;opacity:.5;white-space:normal;width:-moz-max-content;width:max-content;word-wrap:break-word;text-align:right;width:100%;margin-top:var(--cnt-h-p)}.tp-ctnv_text{color:var(--in-fg);bottom:2px;display:inline-block;font-size:.9em;height:-moz-max-content;height:max-content;line-height:.9;margin:.2rem;max-height:100%;max-width:100%;opacity:.5;position:absolute;right:2px;text-align:right;white-space:normal;width:-moz-max-content;width:max-content;word-wrap:break-word}.tp-ctnv_frac{background-color:var(--in-fg);border-radius:1px;height:2px;left:50%;margin-top:-1px;position:absolute;top:50%}.tp-ctnv_icon{box-sizing:border-box;position:absolute;display:block;transform:scale(var(--ggs, 1));width:16px;height:6px;border:2px solid;border-top:0;border-bottom-left-radius:2px;border-bottom-right-radius:2px;margin-top:8px;opacity:.5}.tp-ctnv_icon::after{content:"";display:block;box-sizing:border-box;position:absolute;width:8px;height:8px;border-left:2px solid;border-top:2px solid;transform:rotate(45deg);left:2px;bottom:4px}.tp-ctnv_icon::before{content:"";display:block;box-sizing:border-box;position:absolute;border-radius:3px;width:2px;height:10px;background:currentColor;left:5px;bottom:3px}.tp-btnv_b{margin-top:10px}.tp-inputv{opacity:0}',
css: '.tp-ctnv{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:rgba(0,0,0,0);border-width:0;font-family:inherit;font-size:inherit;font-weight:inherit;margin:0;outline:none;padding:0}.tp-ctnv{background-color:var(--in-bg);border-radius:var(--elm-br);box-sizing:border-box;color:var(--in-fg);font-family:inherit;height:var(--bld-us);line-height:var(--bld-us);min-width:0;width:100%}.tp-ctnv:hover{background-color:var(--in-bg-h)}.tp-ctnv:focus{background-color:var(--in-bg-f)}.tp-ctnv:active{background-color:var(--in-bg-a)}.tp-ctnv:disabled{opacity:.5}.tp-ctnv{cursor:pointer;display:flex;justify-content:center;align-items:center;overflow:hidden;position:relative;height:100%;width:100%;border:1px dashed #717070;border-radius:5px}.tp-ctnv.tp-v-disabled{opacity:.5}.tp-ctnv_input_area_dragging{border:1px dashed #6774ff;background-color:rgba(88,88,185,.231372549)}.tp-ctnv_warning{color:var(--in-fg);bottom:2px;display:inline-block;font-size:.9em;height:-moz-max-content;height:max-content;line-height:1.5;margin:.2rem;opacity:.5;white-space:normal;width:-moz-max-content;width:max-content;word-wrap:break-word;text-align:right;width:100%;margin-top:var(--cnt-h-p)}.tp-ctnv_text{color:var(--in-fg);bottom:2px;display:inline-block;font-size:.9em;height:-moz-max-content;height:max-content;line-height:.9;margin:.2rem;max-height:100%;max-width:100%;opacity:.5;position:absolute;right:2px;text-align:right;white-space:normal;width:-moz-max-content;width:max-content;word-wrap:break-word}.tp-ctnv_frac{background-color:var(--in-fg);border-radius:1px;height:2px;left:50%;margin-top:-1px;position:absolute;top:50%}.tp-ctnv_icon{box-sizing:border-box;position:absolute;display:block;transform:scale(var(--ggs, 1));width:16px;height:6px;border:2px solid;border-top:0;border-bottom-left-radius:2px;border-bottom-right-radius:2px;margin-top:8px;opacity:.5}.tp-ctnv_icon::after{content:"";display:block;box-sizing:border-box;position:absolute;width:8px;height:8px;border-left:2px solid;border-top:2px solid;transform:rotate(45deg);left:2px;bottom:4px}.tp-ctnv_icon::before{content:"";display:block;box-sizing:border-box;position:absolute;border-radius:3px;width:2px;height:10px;background:currentColor;left:5px;bottom:3px}.tp-btnv_b{margin-top:10px}.tp-inputv{opacity:0}',
accept(exValue, params) {

@@ -563,2 +563,3 @@ if (typeof exValue !== 'string') {

view: p.required.constant('file-input'),
invalidFiletypeMessage: p.optional.string,
lineCount: p.optional.number,

@@ -595,4 +596,5 @@ filetypes: p.optional.array(p.required.string),

controller(args) {
var _a;
var _a, _b;
const defaultNumberOfLines = 3;
const defaultFiletypeWarningText = 'Unaccepted file type.';
// Create a controller for the plugin

@@ -602,3 +604,4 @@ return new FilePluginController(args.document, {

viewProps: args.viewProps,
lineCount: (_a = args.params.lineCount) !== null && _a !== void 0 ? _a : defaultNumberOfLines,
invalidFiletypeMessage: (_a = args.params.invalidFiletypeMessage) !== null && _a !== void 0 ? _a : defaultFiletypeWarningText,
lineCount: (_b = args.params.lineCount) !== null && _b !== void 0 ? _b : defaultNumberOfLines,
filetypes: args.params.filetypes,

@@ -605,0 +608,0 @@ });

@@ -1,1 +0,1 @@

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).TweakpaneFileImportPlugin={})}(this,(function(e){"use strict";const t="tp";function i(e){return(i,n)=>[t,"-",e,"v",i?`_${i}`:"",n?`-${n}`:""].join("")}function n(e){return t=>i=>{if(!t&&void 0===i)return{succeeded:!1,value:void 0};if(t&&void 0===i)return{succeeded:!0,value:void 0};const n=e(i);return void 0!==n?{succeeded:!0,value:n}:{succeeded:!1,value:void 0}}}function o(e){return{custom:t=>n(t)(e),boolean:n((e=>"boolean"==typeof e?e:void 0))(e),number:n((e=>"number"==typeof e?e:void 0))(e),string:n((e=>"string"==typeof e?e:void 0))(e),function:n((e=>"function"==typeof e?e:void 0))(e),constant:t=>n((e=>e===t?t:void 0))(e),raw:n((e=>e))(e),object:t=>n((e=>{var i;if(null!==(i=e)&&"object"==typeof i)return function(e,t){return Object.keys(t).reduce(((i,n)=>{if(void 0===i)return;const o=(0,t[n])(e[n]);return o.succeeded?Object.assign(Object.assign({},i),{[n]:o.value}):void 0}),{})}(e,t)}))(e),array:t=>n((e=>{var i;if(Array.isArray(e))return i=t,e.reduce(((e,t)=>{if(void 0===e)return;const n=i(t);return n.succeeded&&void 0!==n.value?[...e,n.value]:void 0}),[])}))(e)}}const r={optional:o(!0),required:o(!1)};class a{constructor(e){this.constraints=e}constrain(e){return this.constraints.reduce(((e,t)=>t.constrain(e)),e)}}function s(e){return t=>t.toFixed(Math.max(Math.min(e,20),0))}s(0);function l(e){return[e[0],e[1],e[2]]}function d(e){return t=>function(e,t){const i=s("float"===t?2:0);return`rgb(${l(e.getComponents("rgb",t)).map((e=>i(e))).join(", ")})`}(t,e)}function c(e){return t=>function(e,t){const i=s(2),n=s("float"===t?2:0);return`rgba(${e.getComponents("rgb",t).map(((e,t)=>(3===t?i:n)(e))).join(", ")})`}(t,e)}function p(e){return t=>function(e,t){const i=s("float"===t?2:0),n=["r","g","b"];return`{${l(e.getComponents("rgb",t)).map(((e,t)=>`${n[t]}: ${i(e)}`)).join(", ")}}`}(t,e)}function h(e){return t=>function(e,t){const i=s(2),n=s("float"===t?2:0),o=["r","g","b","a"];return`{${e.getComponents("rgb",t).map(((e,t)=>`${o[t]}: ${(3===t?i:n)(e)}`)).join(", ")}}`}(t,e)}["int","float"].reduce(((e,t)=>[...e,{format:{alpha:!1,mode:"rgb",notation:"func",type:t},stringifier:d(t)},{format:{alpha:!0,mode:"rgb",notation:"func",type:t},stringifier:c(t)},{format:{alpha:!1,mode:"rgb",notation:"object",type:t},stringifier:p(t)},{format:{alpha:!0,mode:"rgb",notation:"object",type:t},stringifier:h(t)}]),[]);const u=i("ctn"),v=i("input"),g=i("btn");class f{constructor(e,t){this.element=e.createElement("div"),this.container=e.createElement("div"),this.container.classList.add(u()),t.viewProps.bindClassModifiers(this.container),this.input=e.createElement("input"),this.input.classList.add(v()),this.input.setAttribute("type","file"),this.input.setAttribute("accept",t.filetypes?t.filetypes.join(","):"*"),this.input.style.height=`calc(20px * ${t.lineCount})`,this.fileIcon=e.createElement("div"),this.fileIcon.classList.add(u("icon")),this.text=e.createElement("span"),this.text.classList.add(u("text")),this.warning=e.createElement("span"),this.warning.classList.add(u("warning")),this.warning.style.display="none",this.deleteButton=e.createElement("button"),this.deleteButton.classList.add(g("b")),this.deleteButton.innerHTML="Delete",this.deleteButton.style.display="none",this.container.appendChild(this.input),this.container.appendChild(this.fileIcon),this.element.appendChild(this.container),this.element.appendChild(this.warning),this.element.appendChild(this.deleteButton)}changeDraggingState(e){var t,i;e?null===(t=this.container)||void 0===t||t.classList.add(u("input_area_dragging")):null===(i=this.container)||void 0===i||i.classList.remove(u("input_area_dragging"))}}class b{constructor(e,t){this.value=t.value,this.viewProps=t.viewProps,this.view=new f(e,{viewProps:this.viewProps,value:t.value,lineCount:t.lineCount,filetypes:t.filetypes}),this.config=t,this.onFile=this.onFile.bind(this),this.onDrop=this.onDrop.bind(this),this.onDragOver=this.onDragOver.bind(this),this.onDragLeave=this.onDragLeave.bind(this),this.onDeleteClick=this.onDeleteClick.bind(this),this.view.input.addEventListener("change",this.onFile),this.view.element.addEventListener("drop",this.onDrop),this.view.element.addEventListener("dragover",this.onDragOver),this.view.element.addEventListener("dragleave",this.onDragLeave),this.view.deleteButton.addEventListener("click",this.onDeleteClick),this.value.emitter.on("change",(()=>this.handleValueChange())),this.viewProps.handleDispose((()=>{this.view.input.removeEventListener("change",this.onFile),this.view.element.removeEventListener("drop",this.onDrop),this.view.element.removeEventListener("dragover",this.onDragOver),this.view.element.removeEventListener("dragleave",this.onDragLeave),this.view.deleteButton.removeEventListener("click",this.onDeleteClick)}))}onFile(e){const t=this.view.input;if(t.files&&t.files.length>0){const e=t.files[0];this.isFileValid(e)?this.value.setRawValue(e):this.showWarning()}}showWarning(){this.view.warning.style.display="block",this.view.warning.innerHTML="Unaccepted file type.",setTimeout((()=>{this.view.warning.innerHTML="",this.view.warning.style.display="none"}),5e3)}isFileValid(e){var t;const i=this.config.filetypes,n="."+(null===(t=e.name.split(".").pop())||void 0===t?void 0:t.toLowerCase());return!(i&&i.length>0&&!i.includes(n)&&n)}onDeleteClick(){this.value.rawValue&&(this.value.setRawValue(null),this.view.input.value="",this.view.warning.innerHTML="",this.view.warning.style.display="none")}onDragOver(e){e.preventDefault(),this.view.changeDraggingState(!0)}onDragLeave(){this.view.changeDraggingState(!1)}onDrop(e){if(e instanceof DragEvent&&(e.preventDefault(),e.dataTransfer&&e.dataTransfer.files)){const t=e.dataTransfer.files;if(1==t.length){const e=t.item(0);e&&(this.isFileValid(e)?this.value.setRawValue(e):this.showWarning())}}this.view.changeDraggingState(!1)}handleValueChange(){const e=this.value.rawValue,t=this.view.container,i=this.view.text,n=this.view.fileIcon,o=this.view.deleteButton;e?(i.textContent=e.name,t.appendChild(i),t.contains(n)&&t.removeChild(n),this.view.warning.innerHTML="",this.view.warning.style.display="none",o.style.display="block",t.style.border="unset"):(i.textContent="",t.appendChild(n),t.removeChild(i),this.view.warning.innerHTML="",this.view.warning.style.display="none",o.style.display="none",t.style.border="1px dashed #717070")}}const m=[{id:"file-input",type:"input",css:'.tp-ctnv{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:rgba(0,0,0,0);border-width:0;font-family:inherit;font-size:inherit;font-weight:inherit;margin:0;outline:none;padding:0}.tp-ctnv{background-color:var(--in-bg);border-radius:var(--elm-br);box-sizing:border-box;color:var(--in-fg);font-family:inherit;height:var(--bld-us);line-height:var(--bld-us);min-width:0;width:100%}.tp-ctnv:hover{background-color:var(--in-bg-h)}.tp-ctnv:focus{background-color:var(--in-bg-f)}.tp-ctnv:active{background-color:var(--in-bg-a)}.tp-ctnv:disabled{opacity:.5}.tp-ctnv{cursor:pointer;display:flex;justify-content:center;align-items:center;overflow:hidden;position:relative;height:100%;width:100%;border:1px dashed #717070;border-radius:5px}.tp-ctnv.tp-v-disabled{opacity:.5}.tp-ctnv_input_area_dragging{border:1px dashed #6774ff;background-color:rgba(88,88,185,.231372549)}.tp-ctnv_warning{color:var(--in-fg);bottom:2px;display:inline-block;font-size:.9em;height:-moz-max-content;height:max-content;line-height:.9;margin:.2rem;opacity:.5;white-space:normal;width:-moz-max-content;width:max-content;word-wrap:break-word;text-align:right;width:100%;margin-top:var(--cnt-h-p)}.tp-ctnv_text{color:var(--in-fg);bottom:2px;display:inline-block;font-size:.9em;height:-moz-max-content;height:max-content;line-height:.9;margin:.2rem;max-height:100%;max-width:100%;opacity:.5;position:absolute;right:2px;text-align:right;white-space:normal;width:-moz-max-content;width:max-content;word-wrap:break-word}.tp-ctnv_frac{background-color:var(--in-fg);border-radius:1px;height:2px;left:50%;margin-top:-1px;position:absolute;top:50%}.tp-ctnv_icon{box-sizing:border-box;position:absolute;display:block;transform:scale(var(--ggs, 1));width:16px;height:6px;border:2px solid;border-top:0;border-bottom-left-radius:2px;border-bottom-right-radius:2px;margin-top:8px;opacity:.5}.tp-ctnv_icon::after{content:"";display:block;box-sizing:border-box;position:absolute;width:8px;height:8px;border-left:2px solid;border-top:2px solid;transform:rotate(45deg);left:2px;bottom:4px}.tp-ctnv_icon::before{content:"";display:block;box-sizing:border-box;position:absolute;border-radius:3px;width:2px;height:10px;background:currentColor;left:5px;bottom:3px}.tp-btnv_b{margin-top:10px}.tp-inputv{opacity:0}',accept(e,t){if("string"!=typeof e)return null;const i=r,n=function(e,t){const i=r.required.object(t)(e);return i.succeeded?i.value:void 0}(t,{view:i.required.constant("file-input"),lineCount:i.optional.number,filetypes:i.optional.array(i.required.string)});return n?{initialValue:e,params:n}:null},binding:{reader:e=>e=>e instanceof File?e:null,constraint:e=>new a([]),writer:e=>(e,t)=>{e.write(t)}},controller(e){var t;return new b(e.document,{value:e.value,viewProps:e.viewProps,lineCount:null!==(t=e.params.lineCount)&&void 0!==t?t:3,filetypes:e.params.filetypes})}}];e.plugins=m,Object.defineProperty(e,"__esModule",{value:!0})}));
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).TweakpaneFileImportPlugin={})}(this,(function(e){"use strict";const t="tp";function i(e){return(i,n)=>[t,"-",e,"v",i?`_${i}`:"",n?`-${n}`:""].join("")}function n(e){return t=>i=>{if(!t&&void 0===i)return{succeeded:!1,value:void 0};if(t&&void 0===i)return{succeeded:!0,value:void 0};const n=e(i);return void 0!==n?{succeeded:!0,value:n}:{succeeded:!1,value:void 0}}}function o(e){return{custom:t=>n(t)(e),boolean:n((e=>"boolean"==typeof e?e:void 0))(e),number:n((e=>"number"==typeof e?e:void 0))(e),string:n((e=>"string"==typeof e?e:void 0))(e),function:n((e=>"function"==typeof e?e:void 0))(e),constant:t=>n((e=>e===t?t:void 0))(e),raw:n((e=>e))(e),object:t=>n((e=>{var i;if(null!==(i=e)&&"object"==typeof i)return function(e,t){return Object.keys(t).reduce(((i,n)=>{if(void 0===i)return;const o=(0,t[n])(e[n]);return o.succeeded?Object.assign(Object.assign({},i),{[n]:o.value}):void 0}),{})}(e,t)}))(e),array:t=>n((e=>{var i;if(Array.isArray(e))return i=t,e.reduce(((e,t)=>{if(void 0===e)return;const n=i(t);return n.succeeded&&void 0!==n.value?[...e,n.value]:void 0}),[])}))(e)}}const r={optional:o(!0),required:o(!1)};class a{constructor(e){this.constraints=e}constrain(e){return this.constraints.reduce(((e,t)=>t.constrain(e)),e)}}function s(e){return t=>t.toFixed(Math.max(Math.min(e,20),0))}s(0);function l(e){return[e[0],e[1],e[2]]}function d(e){return t=>function(e,t){const i=s("float"===t?2:0);return`rgb(${l(e.getComponents("rgb",t)).map((e=>i(e))).join(", ")})`}(t,e)}function c(e){return t=>function(e,t){const i=s(2),n=s("float"===t?2:0);return`rgba(${e.getComponents("rgb",t).map(((e,t)=>(3===t?i:n)(e))).join(", ")})`}(t,e)}function p(e){return t=>function(e,t){const i=s("float"===t?2:0),n=["r","g","b"];return`{${l(e.getComponents("rgb",t)).map(((e,t)=>`${n[t]}: ${i(e)}`)).join(", ")}}`}(t,e)}function h(e){return t=>function(e,t){const i=s(2),n=s("float"===t?2:0),o=["r","g","b","a"];return`{${e.getComponents("rgb",t).map(((e,t)=>`${o[t]}: ${(3===t?i:n)(e)}`)).join(", ")}}`}(t,e)}["int","float"].reduce(((e,t)=>[...e,{format:{alpha:!1,mode:"rgb",notation:"func",type:t},stringifier:d(t)},{format:{alpha:!0,mode:"rgb",notation:"func",type:t},stringifier:c(t)},{format:{alpha:!1,mode:"rgb",notation:"object",type:t},stringifier:p(t)},{format:{alpha:!0,mode:"rgb",notation:"object",type:t},stringifier:h(t)}]),[]);const u=i("ctn"),v=i("input"),g=i("btn");class f{constructor(e,t){this.element=e.createElement("div"),this.container=e.createElement("div"),this.container.classList.add(u()),t.viewProps.bindClassModifiers(this.container),this.input=e.createElement("input"),this.input.classList.add(v()),this.input.setAttribute("type","file"),this.input.setAttribute("accept",t.filetypes?t.filetypes.join(","):"*"),this.input.style.height=`calc(20px * ${t.lineCount})`,this.fileIcon=e.createElement("div"),this.fileIcon.classList.add(u("icon")),this.text=e.createElement("span"),this.text.classList.add(u("text")),this.warning=e.createElement("span"),this.warning.classList.add(u("warning")),this.warning.innerHTML=t.invalidFiletypeMessage,this.warning.style.display="none",this.deleteButton=e.createElement("button"),this.deleteButton.classList.add(g("b")),this.deleteButton.innerHTML="Delete",this.deleteButton.style.display="none",this.container.appendChild(this.input),this.container.appendChild(this.fileIcon),this.element.appendChild(this.container),this.element.appendChild(this.warning),this.element.appendChild(this.deleteButton)}changeDraggingState(e){var t,i;e?null===(t=this.container)||void 0===t||t.classList.add(u("input_area_dragging")):null===(i=this.container)||void 0===i||i.classList.remove(u("input_area_dragging"))}}class b{constructor(e,t){this.value=t.value,this.viewProps=t.viewProps,this.view=new f(e,{viewProps:this.viewProps,value:t.value,invalidFiletypeMessage:t.invalidFiletypeMessage,lineCount:t.lineCount,filetypes:t.filetypes}),this.config=t,this.onFile=this.onFile.bind(this),this.onDrop=this.onDrop.bind(this),this.onDragOver=this.onDragOver.bind(this),this.onDragLeave=this.onDragLeave.bind(this),this.onDeleteClick=this.onDeleteClick.bind(this),this.view.input.addEventListener("change",this.onFile),this.view.element.addEventListener("drop",this.onDrop),this.view.element.addEventListener("dragover",this.onDragOver),this.view.element.addEventListener("dragleave",this.onDragLeave),this.view.deleteButton.addEventListener("click",this.onDeleteClick),this.value.emitter.on("change",(()=>this.handleValueChange())),this.viewProps.handleDispose((()=>{this.view.input.removeEventListener("change",this.onFile),this.view.element.removeEventListener("drop",this.onDrop),this.view.element.removeEventListener("dragover",this.onDragOver),this.view.element.removeEventListener("dragleave",this.onDragLeave),this.view.deleteButton.removeEventListener("click",this.onDeleteClick)}))}onFile(e){const t=this.view.input;if(t.files&&t.files.length>0){const e=t.files[0];this.isFileValid(e)?this.value.setRawValue(e):this.showWarning()}}showWarning(){this.view.warning.style.display="block",setTimeout((()=>{this.view.warning.style.display="none"}),5e3)}isFileValid(e){var t;const i=this.config.filetypes,n="."+(null===(t=e.name.split(".").pop())||void 0===t?void 0:t.toLowerCase());return!(i&&i.length>0&&!i.includes(n)&&n)}onDeleteClick(){this.value.rawValue&&(this.value.setRawValue(null),this.view.input.value="",this.view.warning.innerHTML="",this.view.warning.style.display="none")}onDragOver(e){e.preventDefault(),this.view.changeDraggingState(!0)}onDragLeave(){this.view.changeDraggingState(!1)}onDrop(e){if(e instanceof DragEvent&&(e.preventDefault(),e.dataTransfer&&e.dataTransfer.files)){const t=e.dataTransfer.files;if(1==t.length){const e=t.item(0);e&&(this.isFileValid(e)?this.value.setRawValue(e):this.showWarning())}}this.view.changeDraggingState(!1)}handleValueChange(){const e=this.value.rawValue,t=this.view.container,i=this.view.text,n=this.view.fileIcon,o=this.view.deleteButton;e?(i.textContent=e.name,t.appendChild(i),t.contains(n)&&t.removeChild(n),this.view.warning.innerHTML="",this.view.warning.style.display="none",o.style.display="block",t.style.border="unset"):(i.textContent="",t.appendChild(n),t.removeChild(i),this.view.warning.innerHTML="",this.view.warning.style.display="none",o.style.display="none",t.style.border="1px dashed #717070")}}const m=[{id:"file-input",type:"input",css:'.tp-ctnv{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:rgba(0,0,0,0);border-width:0;font-family:inherit;font-size:inherit;font-weight:inherit;margin:0;outline:none;padding:0}.tp-ctnv{background-color:var(--in-bg);border-radius:var(--elm-br);box-sizing:border-box;color:var(--in-fg);font-family:inherit;height:var(--bld-us);line-height:var(--bld-us);min-width:0;width:100%}.tp-ctnv:hover{background-color:var(--in-bg-h)}.tp-ctnv:focus{background-color:var(--in-bg-f)}.tp-ctnv:active{background-color:var(--in-bg-a)}.tp-ctnv:disabled{opacity:.5}.tp-ctnv{cursor:pointer;display:flex;justify-content:center;align-items:center;overflow:hidden;position:relative;height:100%;width:100%;border:1px dashed #717070;border-radius:5px}.tp-ctnv.tp-v-disabled{opacity:.5}.tp-ctnv_input_area_dragging{border:1px dashed #6774ff;background-color:rgba(88,88,185,.231372549)}.tp-ctnv_warning{color:var(--in-fg);bottom:2px;display:inline-block;font-size:.9em;height:-moz-max-content;height:max-content;line-height:1.5;margin:.2rem;opacity:.5;white-space:normal;width:-moz-max-content;width:max-content;word-wrap:break-word;text-align:right;width:100%;margin-top:var(--cnt-h-p)}.tp-ctnv_text{color:var(--in-fg);bottom:2px;display:inline-block;font-size:.9em;height:-moz-max-content;height:max-content;line-height:.9;margin:.2rem;max-height:100%;max-width:100%;opacity:.5;position:absolute;right:2px;text-align:right;white-space:normal;width:-moz-max-content;width:max-content;word-wrap:break-word}.tp-ctnv_frac{background-color:var(--in-fg);border-radius:1px;height:2px;left:50%;margin-top:-1px;position:absolute;top:50%}.tp-ctnv_icon{box-sizing:border-box;position:absolute;display:block;transform:scale(var(--ggs, 1));width:16px;height:6px;border:2px solid;border-top:0;border-bottom-left-radius:2px;border-bottom-right-radius:2px;margin-top:8px;opacity:.5}.tp-ctnv_icon::after{content:"";display:block;box-sizing:border-box;position:absolute;width:8px;height:8px;border-left:2px solid;border-top:2px solid;transform:rotate(45deg);left:2px;bottom:4px}.tp-ctnv_icon::before{content:"";display:block;box-sizing:border-box;position:absolute;border-radius:3px;width:2px;height:10px;background:currentColor;left:5px;bottom:3px}.tp-btnv_b{margin-top:10px}.tp-inputv{opacity:0}',accept(e,t){if("string"!=typeof e)return null;const i=r,n=function(e,t){const i=r.required.object(t)(e);return i.succeeded?i.value:void 0}(t,{view:i.required.constant("file-input"),invalidFiletypeMessage:i.optional.string,lineCount:i.optional.number,filetypes:i.optional.array(i.required.string)});return n?{initialValue:e,params:n}:null},binding:{reader:e=>e=>e instanceof File?e:null,constraint:e=>new a([]),writer:e=>(e,t)=>{e.write(t)}},controller(e){var t,i;return new b(e.document,{value:e.value,viewProps:e.viewProps,invalidFiletypeMessage:null!==(t=e.params.invalidFiletypeMessage)&&void 0!==t?t:"Unaccepted file type.",lineCount:null!==(i=e.params.lineCount)&&void 0!==i?i:3,filetypes:e.params.filetypes})}}];e.plugins=m,Object.defineProperty(e,"__esModule",{value:!0})}));
{
"name": "tweakpane-plugin-file-import",
"version": "0.1.7",
"version": "0.2.0",
"description": "A general-purpose and simple file input Tweakpane plugin",

@@ -5,0 +5,0 @@ "homepage": "https://github.com/LuchoTurtle/tweakpane-plugin-file-import",

@@ -70,2 +70,3 @@ # `tweakpane-plugin-file-import`

filetypes: ['.png', '.jpg'],
invalidFiletypeMessage: "We can't accept those filetypes!"
})

@@ -84,2 +85,3 @@ .on('change', (ev) => {

| filetypes | array | Array of valid file extensions. |
| invalidFiletypeMessage | string | String shown when the user tries to upload an invalid filetype. |

@@ -86,0 +88,0 @@

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc