selectyc 0.0.9 → 0.0.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/selectyc.js +11 -11
- package/dist/selectyc.umd.cjs +1 -1
- package/package.json +1 -1
package/dist/selectyc.js
CHANGED
|
@@ -139,13 +139,13 @@ class l {
|
|
|
139
139
|
}
|
|
140
140
|
// Draw functions
|
|
141
141
|
#x() {
|
|
142
|
-
this.#
|
|
142
|
+
this.#D();
|
|
143
143
|
const t = document.createElement("div");
|
|
144
144
|
t.className = "main-div-selectyc", t.style.width = this.width;
|
|
145
145
|
const e = document.createElement("div");
|
|
146
146
|
e.className = "custom-multiselect";
|
|
147
147
|
let s = document.createElement("div");
|
|
148
|
-
s.className = "selected-items round" + this.bodyRound, s.tabIndex = 0, s.classList.add(this.boxOverflow === "horizontal" ? "horizontal-overflow" : "vertical-overflow"), this.isMultiple || (s = this.#E(s)), e.appendChild(s), e.appendChild(this.#
|
|
148
|
+
s.className = "selected-items round" + this.bodyRound, s.tabIndex = 0, s.classList.add(this.boxOverflow === "horizontal" ? "horizontal-overflow" : "vertical-overflow"), this.isMultiple || (s = this.#E(s)), e.appendChild(s), e.appendChild(this.#L()), t.appendChild(e);
|
|
149
149
|
const i = document.getElementById(this.id), a = document.createElement("input");
|
|
150
150
|
a.name = i.name, a.style.display = "none";
|
|
151
151
|
let n = i.parentNode;
|
|
@@ -157,11 +157,11 @@ class l {
|
|
|
157
157
|
const s = document.createElement("div");
|
|
158
158
|
return s.innerHTML = this.#S, t.appendChild(e), t.appendChild(s), this.#r = e, t;
|
|
159
159
|
}
|
|
160
|
-
#
|
|
160
|
+
#L() {
|
|
161
161
|
const t = document.createElement("div");
|
|
162
162
|
t.setAttribute("style", "position:fixed; z-index:999;");
|
|
163
163
|
const e = document.createElement("div");
|
|
164
|
-
e.className = "global-dropdown", this.searchInputActive && t.appendChild(this.#
|
|
164
|
+
e.className = "global-dropdown", this.searchInputActive && t.appendChild(this.#O());
|
|
165
165
|
let s;
|
|
166
166
|
return e.addEventListener("scroll", (i) => {
|
|
167
167
|
s && clearTimeout(s), s = setTimeout(() => {
|
|
@@ -169,7 +169,7 @@ class l {
|
|
|
169
169
|
}, 70);
|
|
170
170
|
}), t.appendChild(e), this.#e = e, t;
|
|
171
171
|
}
|
|
172
|
-
#
|
|
172
|
+
#O() {
|
|
173
173
|
const t = document.createElement("input");
|
|
174
174
|
return t.type = "text", t.id = "selectyc_search_input", t.className = "search-input", t.placeholder = "Buscar...", t.addEventListener("input", () => {
|
|
175
175
|
this.filter = t.value, this.#e.innerHTML = "", this.filter = t.value, this.#w();
|
|
@@ -178,14 +178,14 @@ class l {
|
|
|
178
178
|
#a(t) {
|
|
179
179
|
const e = document.createElement("div");
|
|
180
180
|
e.className = "select-option", e.setAttribute("data-value", t.id), e.textContent = t.text, this.#e.appendChild(e), e.addEventListener("click", () => {
|
|
181
|
-
t.id !== "sin_resultados" && (this.#
|
|
181
|
+
t.id !== "sin_resultados" && (this.#N(t.text, t.id), this.onSelect !== void 0 && this.onSelect(t.id), this.#h());
|
|
182
182
|
});
|
|
183
183
|
}
|
|
184
184
|
// Functions
|
|
185
|
-
#
|
|
185
|
+
#D() {
|
|
186
186
|
const t = document.getElementById(this.id);
|
|
187
187
|
this.name = t.name, this.#f = t.required, Array.from(t.options).forEach((e) => {
|
|
188
|
-
if (e.selected) {
|
|
188
|
+
if (e.outerHTML.includes("selected")) {
|
|
189
189
|
const s = e.text, i = this.#o(e.value);
|
|
190
190
|
this.isMultiple ? this.#t.push({ value: i, text: s }) : this.#t[0] = { value: i, text: s };
|
|
191
191
|
}
|
|
@@ -223,7 +223,7 @@ class l {
|
|
|
223
223
|
s.text.toLowerCase().includes(this.#C.toLowerCase()) && !e.includes(s.id) && this.#a(s);
|
|
224
224
|
}), this.#e.hasChildNodes() || this.#a({ id: "sin_resultados", text: "sin resultados ..." });
|
|
225
225
|
}
|
|
226
|
-
async #
|
|
226
|
+
async #M() {
|
|
227
227
|
const t = this.#t.map((n) => n.value);
|
|
228
228
|
let e = this.filter === null ? "" : this.filter, s = this.data.map((n) => n.id);
|
|
229
229
|
this.records = this.records + 10 + this.#t.length;
|
|
@@ -234,7 +234,7 @@ class l {
|
|
|
234
234
|
n.text.toLowerCase().includes(e.toLowerCase()) && !t.includes(n.id) && !s.includes(n.id) && this.#a(n);
|
|
235
235
|
}), this.#u = a === this.#e.lastChild.dataset.value;
|
|
236
236
|
}
|
|
237
|
-
#
|
|
237
|
+
#N(t, e) {
|
|
238
238
|
this.#t.find((i) => i.value === e) || (this.isMultiple || (this.#t = []), this.#t.push({ text: t, value: e })), this.#d(e);
|
|
239
239
|
}
|
|
240
240
|
#d(t) {
|
|
@@ -263,7 +263,7 @@ class l {
|
|
|
263
263
|
}
|
|
264
264
|
#A(t) {
|
|
265
265
|
const { scrollTop: e, scrollHeight: s, clientHeight: i } = this.#e;
|
|
266
|
-
t.target.lastChild !== null && (t.target.lastChild.dataset.value === "loading" || this.#u || e + (i + 1) >= s && (this.#a({ id: "loading", text: "cargando ..." }), this.#
|
|
266
|
+
t.target.lastChild !== null && (t.target.lastChild.dataset.value === "loading" || this.#u || e + (i + 1) >= s && (this.#a({ id: "loading", text: "cargando ..." }), this.#M()));
|
|
267
267
|
}
|
|
268
268
|
#o(t) {
|
|
269
269
|
return !isNaN(t) && !isNaN(parseFloat(t)) ? parseInt(t) : t;
|
package/dist/selectyc.umd.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(h,a){typeof exports=="object"&&typeof module<"u"?a(exports):typeof define=="function"&&define.amd?define(["exports"],a):(h=typeof globalThis<"u"?globalThis:h||self,a(h.selectyc={}))})(this,function(h){"use strict";class a{constructor(t){this.route=t}static make(t){return new a(t)}setMethod(t){return this.method=t,this}getMethod(){return this.method===void 0?"POST":this.method}setData(t){return this.data=t,this}addData(t){if(this.data===void 0)return this.setData(t);for(const e in t)this.data[e]=t[e];return this}setFun(t){return this.fun=t,this}async go(){try{const t={method:this.getMethod(),headers:{"X-CSRF-TOKEN":window.CSRF_TOKEN,Accept:"application/json"}};this.data!==void 0&&(t.body=this.data,Object.prototype.toString.call(this.data)!=="[object FormData]"&&(t.body=JSON.stringify(this.data),t.headers["Content-Type"]="application/json"));const e=await fetch(this.route,t);if(!e.ok){const s=await e.json();throw new Error(s.message)}return this.fun===void 0?await e.json():await this.fun(e)}catch(t){window.toastNotification.setType(!1).show(t.message)}}}class r{#t=[];#c;#f=[];#l;#y;#s;#e;#i;#r;#n=!1;#p=!1;#u=!1;#S="";#C='<svg class="w-5 h-5 text-gray-900 dark:text-gray-400" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m19 9-7 7-7-7"/></svg>';constructor(t){if(window.selects===void 0&&(window.selects=[]),window.selects[t]!==void 0)return window.selects[t];this.id=t,this.name,this.data=[],this.isMultiple=!1,this.clearButton=!1,this.singleLabel=" ",this.records=10,this.filter=null,this.bodyRound="",this.width="100%",this.searchInputActive=!0,this.bodyData=null,this.boxOverflow="horizontal",window.selects[t]=this}static set(t){return new r(t)}setData(t){return this.data=t,this}setMultiple(t="horizontal"){return this.isMultiple=!0,this.boxOverflow=t,this}setClearButton(){return this.clearButton=!0,this}setSelectedOptions(t){this.#t=t,this.#d(t)}getSelectedOptions(){return this.#t}getSelectedOption(){return this.#t[0]}getOptions(){return this.data}setSingleLabel(t){return this.singleLabel=t,this}setBodyRound(t){return this.bodyRound=`-${t}`,this}setRS(t){return this.RS=t,this}setBodyData(t){return this.bodyData=t,this}desactiveSearchInput(){return this.searchInputActive=!1,this}addOption(t){this.data.push(t)}setWidth(t){return this.width=t,this}setOnSelect(t){return this.onSelect=t,this}setOnUnselect(t){return this.onUnselect=t,this}setOnChange(t){return this.onChange=t,this}cleanSelection(){const t=this.#t;this.#t=[],this.#d(t)}#b(){this.#x(),this.#s.addEventListener("click",t=>{if(t.target.classList.contains("remove-tag")){this.#T(t.target.getAttribute("data-value")),this.onUnselect!==void 0&&this.onUnselect(t.target.getAttribute("data-value")),this.#n&&this.#h(),this.#m();return}this.#n?this.#h():this.#m()}),document.addEventListener("click",t=>{!this.#l.contains(t.target)&&!this.#e.contains(t.target)&&!t.target.classList.contains("remove-tag")&&this.#h()}),window.onresize=()=>{this.#h()},this.isMultiple&&this.#v()}#x(){this.#
|
|
1
|
+
(function(h,a){typeof exports=="object"&&typeof module<"u"?a(exports):typeof define=="function"&&define.amd?define(["exports"],a):(h=typeof globalThis<"u"?globalThis:h||self,a(h.selectyc={}))})(this,function(h){"use strict";class a{constructor(t){this.route=t}static make(t){return new a(t)}setMethod(t){return this.method=t,this}getMethod(){return this.method===void 0?"POST":this.method}setData(t){return this.data=t,this}addData(t){if(this.data===void 0)return this.setData(t);for(const e in t)this.data[e]=t[e];return this}setFun(t){return this.fun=t,this}async go(){try{const t={method:this.getMethod(),headers:{"X-CSRF-TOKEN":window.CSRF_TOKEN,Accept:"application/json"}};this.data!==void 0&&(t.body=this.data,Object.prototype.toString.call(this.data)!=="[object FormData]"&&(t.body=JSON.stringify(this.data),t.headers["Content-Type"]="application/json"));const e=await fetch(this.route,t);if(!e.ok){const s=await e.json();throw new Error(s.message)}return this.fun===void 0?await e.json():await this.fun(e)}catch(t){window.toastNotification.setType(!1).show(t.message)}}}class r{#t=[];#c;#f=[];#l;#y;#s;#e;#i;#r;#n=!1;#p=!1;#u=!1;#S="";#C='<svg class="w-5 h-5 text-gray-900 dark:text-gray-400" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m19 9-7 7-7-7"/></svg>';constructor(t){if(window.selects===void 0&&(window.selects=[]),window.selects[t]!==void 0)return window.selects[t];this.id=t,this.name,this.data=[],this.isMultiple=!1,this.clearButton=!1,this.singleLabel=" ",this.records=10,this.filter=null,this.bodyRound="",this.width="100%",this.searchInputActive=!0,this.bodyData=null,this.boxOverflow="horizontal",window.selects[t]=this}static set(t){return new r(t)}setData(t){return this.data=t,this}setMultiple(t="horizontal"){return this.isMultiple=!0,this.boxOverflow=t,this}setClearButton(){return this.clearButton=!0,this}setSelectedOptions(t){this.#t=t,this.#d(t)}getSelectedOptions(){return this.#t}getSelectedOption(){return this.#t[0]}getOptions(){return this.data}setSingleLabel(t){return this.singleLabel=t,this}setBodyRound(t){return this.bodyRound=`-${t}`,this}setRS(t){return this.RS=t,this}setBodyData(t){return this.bodyData=t,this}desactiveSearchInput(){return this.searchInputActive=!1,this}addOption(t){this.data.push(t)}setWidth(t){return this.width=t,this}setOnSelect(t){return this.onSelect=t,this}setOnUnselect(t){return this.onUnselect=t,this}setOnChange(t){return this.onChange=t,this}cleanSelection(){const t=this.#t;this.#t=[],this.#d(t)}#b(){this.#x(),this.#s.addEventListener("click",t=>{if(t.target.classList.contains("remove-tag")){this.#T(t.target.getAttribute("data-value")),this.onUnselect!==void 0&&this.onUnselect(t.target.getAttribute("data-value")),this.#n&&this.#h(),this.#m();return}this.#n?this.#h():this.#m()}),document.addEventListener("click",t=>{!this.#l.contains(t.target)&&!this.#e.contains(t.target)&&!t.target.classList.contains("remove-tag")&&this.#h()}),window.onresize=()=>{this.#h()},this.isMultiple&&this.#v()}#x(){this.#D();const t=document.createElement("div");t.className="main-div-selectyc",t.style.width=this.width;const e=document.createElement("div");e.className="custom-multiselect";let s=document.createElement("div");s.className="selected-items round"+this.bodyRound,s.tabIndex=0,s.classList.add(this.boxOverflow==="horizontal"?"horizontal-overflow":"vertical-overflow"),this.isMultiple||(s=this.#O(s)),e.appendChild(s),e.appendChild(this.#E()),t.appendChild(e);const i=document.getElementById(this.id),l=document.createElement("input");l.name=i.name,l.style.display="none";let n=i.parentNode;t.appendChild(l),n.replaceChild(t,i),this.#c=l,this.#y=s,this.#l=e,this.#s=this.#l.querySelector(".selected-items"),!this.isMultiple&&this.#t.length>0&&(this.#c.value=this.#t[0].value)}#O(t){const e=document.createElement("input");e.className="custom-single-select",e.value=this.#t.length===0?this.singleLabel:this.#t[0].text,e.required=this.#p,e.readOnly=!0;const s=document.createElement("div");return s.innerHTML=this.#C,t.appendChild(e),t.appendChild(s),this.#r=e,t}#E(){const t=document.createElement("div");t.setAttribute("style","position:fixed; z-index:999;");const e=document.createElement("div");e.className="global-dropdown",this.searchInputActive&&t.appendChild(this.#L());let s;return e.addEventListener("scroll",i=>{s&&clearTimeout(s),s=setTimeout(()=>{this.#A(i)},70)}),t.appendChild(e),this.#e=e,t}#L(){const t=document.createElement("input");return t.type="text",t.id="selectyc_search_input",t.className="search-input",t.placeholder="Buscar...",t.addEventListener("input",()=>{this.filter=t.value,this.#e.innerHTML="",this.filter=t.value,this.#w()}),this.#i=t,t}#a(t){const e=document.createElement("div");e.className="select-option",e.setAttribute("data-value",t.id),e.textContent=t.text,this.#e.appendChild(e),e.addEventListener("click",()=>{t.id!=="sin_resultados"&&(this.#N(t.text,t.id),this.onSelect!==void 0&&this.onSelect(t.id),this.#h())})}#D(){const t=document.getElementById(this.id);this.name=t.name,this.#p=t.required,Array.from(t.options).forEach(e=>{if(e.outerHTML.includes("selected")){const s=e.text,i=this.#o(e.value);this.isMultiple?this.#t.push({value:i,text:s}):this.#t[0]={value:i,text:s}}this.#f.push({id:this.#o(e.value),text:e.text})})}#m(){if(this.#n)return;this.#s.classList.remove(`round${this.bodyRound}`),this.#s.classList.add(`round${this.bodyRound}t`);const t=this.#l.getBoundingClientRect();if(this.searchInputActive){this.#i.style.display="block",this.#i.style.width=t.width+"px";const e=this.#i.offsetHeight;this.#e.style.top=e+"px"}this.#e.style.width=t.width+"px",this.#e.innerHTML="",this.#e.style.display="block",this.searchInputActive&&this.#i.focus(),this.#w(),this.#n=!0}#h(){this.#n&&(this.#e.innerHTML="",this.#e.style.display="none",this.searchInputActive&&(this.#i.style.display="none"),this.#s.classList.add(`round${this.bodyRound}`),this.#n=!1)}async#g(){if(this.RS===void 0)return this.data;let t={records:this.records,filter:this.filter};t!==null&&(t={...t,...this.bodyData});const e=await a.make(this.RS).addData(t).setMethod("POST").go(),s=Array.isArray(e)?e:e.data;return this.data=Array.from(new Map([...this.#f,...s].map(i=>[i.id,i])).values()),this.data}async#w(){this.#a({id:"loading",text:"cargando ..."}),this.records=10+this.#t.length,this.#u=!1;let t=await this.#g();const e=this.#t.map(s=>s.value);this.#e.lastChild.dataset.value==="loading"&&this.#e.removeChild(this.#e.lastChild),t.forEach(s=>{s.text.toLowerCase().includes(this.#S.toLowerCase())&&!e.includes(s.id)&&this.#a(s)}),this.#e.hasChildNodes()||this.#a({id:"sin_resultados",text:"sin resultados ..."})}async#M(){const t=this.#t.map(n=>n.value);let e=this.filter===null?"":this.filter,s=this.data.map(n=>n.id);this.records=this.records+10+this.#t.length;let i=await this.#g();this.#e.lastChild.dataset.value==="loading"&&this.#e.removeChild(this.#e.lastChild);const l=this.#e.lastChild.dataset.value;i.forEach(n=>{n.text.toLowerCase().includes(e.toLowerCase())&&!t.includes(n.id)&&!s.includes(n.id)&&this.#a(n)}),this.#u=l===this.#e.lastChild.dataset.value}#N(t,e){this.#t.find(i=>i.value===e)||(this.isMultiple||(this.#t=[]),this.#t.push({text:t,value:e})),this.#d(e)}#d(t){this.onChange!==void 0&&this.onChange(t),this.isMultiple?this.#v():this.#I()}#I(){this.#r.value=null,this.#r.value=this.#t.length>0?this.#t[0].text:this.singleLabel,this.#c.value=this.#t.length>0?this.#t[0].value:null;const t=this.#r.parentNode,e=t.firstChild;if(e.className==="remove-tag"&&e.remove(),!this.clearButton||this.#t.length<=0)return;const s=document.createElement("span");s.dataset.value=this.#t[0].value,s.innerHTML="x",s.className="remove-tag",t.insertBefore(s,t.firstChild)}#v(){if(this.#s.innerHTML="",this.#t.length<=0){this.#s.appendChild(document.createElement("div"));return}this.#t.forEach(({text:t,value:e})=>{const s=document.createElement("div");s.className="selected-tag",s.innerHTML=`${t} <span class="remove-tag" data-value="${e}">x</span>`,this.#s.appendChild(s)})}#T(t){this.#t=this.#t.filter(e=>this.#o(e.value)!==this.#o(t)),this.#d(t)}#A(t){const{scrollTop:e,scrollHeight:s,clientHeight:i}=this.#e;t.target.lastChild!==null&&(t.target.lastChild.dataset.value==="loading"||this.#u||e+(i+1)>=s&&(this.#a({id:"loading",text:"cargando ..."}),this.#M()))}#o(t){return!isNaN(t)&&!isNaN(parseFloat(t))?parseInt(t):t}async render(){this.#b()}}h.selectyc=r,Object.defineProperty(h,Symbol.toStringTag,{value:"Module"})});
|