selectyc 0.0.7 → 0.0.9
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.css +1 -1
- package/dist/selectyc.js +31 -28
- package/dist/selectyc.umd.cjs +1 -1
- package/package.json +1 -1
package/dist/selectyc.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.custom-multiselect{position:relative;width:100%}.selected-items{display:flex;gap:5px;padding:8px;border:1px solid;cursor:default;align-items:center;@apply bg-gray-50 border-gray-300 text-gray-900 text-sm focus:ring-blue-500 focus:border-[2px] focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500;}.horizontal-overflow{flex-wrap:nowrap;height:42px;white-space:nowrap;overflow-x:auto;overflow-y:hidden}.vertical-overflow{flex-wrap:wrap;min-height:42px;height:auto;max-height:120px;white-space:nowrap;overflow-x:auto;overflow-y:auto}.round{@apply rounded-lg;}.roundt{@apply rounded-t-lg;}.round-l{@apply rounded-l-lg;}.round-r{@apply rounded-r-lg;}.round-lt{@apply rounded-tl-lg;}.round-rt{@apply rounded-tr-lg;}.selected-items::-webkit-scrollbar{height:6px;width:8px}.selected-items::-webkit-scrollbar-thumb{border-radius:1rem;@apply bg-cyan-400 dark:bg-cyan-700;}.selected-items::-webkit-scrollbar-thumb:hover{@apply bg-cyan-500 dark:bg-cyan-600;}.custom-single-select{width:97%;padding-left:.2rem;border:0px solid;background:transparent;cursor:default}.custom-single-select:focus{border:0px solid transparent;outline:none;box-shadow:none}.selected-tag{background-color:#007bff;color:#fff;padding:4px 8px;border-radius:12px;display:inline-flex;align-items:center;gap:5px;font-size:14px;white-space:nowrap;flex:0 0 auto}.remove-tag{cursor:pointer;font-weight:700;border:solid 0px;border-radius:.5rem;padding:1px 6px;@apply hover:bg-blue-400 dark:hover:bg-sky-800;}.global-dropdown{position:absolute;background-color:#374151;max-height:200px;overflow-y:auto;display:none;box-shadow:0 2px 8px #0003;border-bottom-left-radius:.6rem;border-bottom-right-radius:.6rem;@apply bg-gray-50 dark:bg-gray-700;}.global-dropdown::-webkit-scrollbar{width:10px;border-radius:.6rem;@apply bg-gray-200 dark:bg-gray-400;}.global-dropdown::-webkit-scrollbar-thumb{border-radius:.6rem;@apply bg-gray-400 dark:bg-gray-600;}.search-input{position:absolute;width:100%;padding:3px 10px;border:1px solid;display:none;z-index:999;outline:none;color:#000;font-size:.9rem;@apply dark:border-gray-
|
|
1
|
+
.custom-multiselect{position:relative;width:100%}.selected-items{display:flex;gap:5px;padding:8px;border:1px solid;cursor:default;align-items:center;@apply bg-gray-50 border-gray-300 text-gray-900 text-sm focus:ring-blue-500 focus:border-[2px] focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500;}.horizontal-overflow{flex-wrap:nowrap;height:42px;white-space:nowrap;overflow-x:auto;overflow-y:hidden}.vertical-overflow{flex-wrap:wrap;min-height:42px;height:auto;max-height:120px;white-space:nowrap;overflow-x:auto;overflow-y:auto}.round{@apply rounded-lg;}.roundt{@apply rounded-t-lg;}.round-l{@apply rounded-l-lg;}.round-r{@apply rounded-r-lg;}.round-lt{@apply rounded-tl-lg;}.round-rt{@apply rounded-tr-lg;}.selected-items::-webkit-scrollbar{height:6px;width:8px}.selected-items::-webkit-scrollbar-thumb{border-radius:1rem;@apply bg-cyan-400 dark:bg-cyan-700;}.selected-items::-webkit-scrollbar-thumb:hover{@apply bg-cyan-500 dark:bg-cyan-600;}.custom-single-select{width:97%;padding-left:.2rem;border:0px solid;background:transparent;cursor:default}.custom-single-select:focus{border:0px solid transparent;outline:none;box-shadow:none}.selected-tag{background-color:#007bff;color:#fff;padding:4px 8px;border-radius:12px;display:inline-flex;align-items:center;gap:5px;font-size:14px;white-space:nowrap;flex:0 0 auto}.remove-tag{cursor:pointer;font-weight:700;border:solid 0px;border-radius:.5rem;padding:1px 6px;@apply hover:bg-blue-400 dark:hover:bg-sky-800;}.global-dropdown{position:absolute;background-color:#374151;max-height:200px;overflow-y:auto;display:none;z-index:999;box-shadow:0 2px 8px #0003;border-bottom-left-radius:.6rem;border-bottom-right-radius:.6rem;@apply bg-gray-50 dark:bg-gray-700;}.global-dropdown::-webkit-scrollbar{width:10px;border-radius:.6rem;@apply bg-gray-200 dark:bg-gray-400;}.global-dropdown::-webkit-scrollbar-thumb{border-radius:.6rem;@apply bg-gray-400 dark:bg-gray-600;}.search-input{position:absolute;width:100%;padding:3px 10px;border:1px solid;display:none;z-index:999;outline:none;color:#000;font-size:.9rem;@apply bg-white dark:bg-gray-600 dark:border-gray-500 dark:text-white border-blue-500;}.search-input:focus{@apply dark:border-gray-500 border-blue-500;}.search-input::placeholder{@apply text-gray-700 dark:text-gray-400;}.select-option{padding:3px 10px;cursor:pointer;font-size:.9rem}.select-option:hover{background-color:#3777de;color:#fff}
|
package/dist/selectyc.js
CHANGED
|
@@ -48,17 +48,17 @@ class h {
|
|
|
48
48
|
}
|
|
49
49
|
class l {
|
|
50
50
|
#t = [];
|
|
51
|
-
#
|
|
51
|
+
#c;
|
|
52
52
|
#p = [];
|
|
53
53
|
#l;
|
|
54
54
|
#y;
|
|
55
55
|
#s;
|
|
56
56
|
#e;
|
|
57
|
-
#
|
|
57
|
+
#i;
|
|
58
58
|
#r;
|
|
59
|
-
#
|
|
59
|
+
#n = !1;
|
|
60
60
|
#f = !1;
|
|
61
|
-
#
|
|
61
|
+
#u = !1;
|
|
62
62
|
#C = "";
|
|
63
63
|
#S = '<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>';
|
|
64
64
|
constructor(t) {
|
|
@@ -78,6 +78,9 @@ class l {
|
|
|
78
78
|
setClearButton() {
|
|
79
79
|
return this.clearButton = !0, this;
|
|
80
80
|
}
|
|
81
|
+
setSelectedOptions(t) {
|
|
82
|
+
this.#t = t, this.#d(t);
|
|
83
|
+
}
|
|
81
84
|
getSelectedOptions() {
|
|
82
85
|
return this.#t;
|
|
83
86
|
}
|
|
@@ -119,15 +122,15 @@ class l {
|
|
|
119
122
|
}
|
|
120
123
|
cleanSelection() {
|
|
121
124
|
const t = this.#t;
|
|
122
|
-
this.#t = [], this.#
|
|
125
|
+
this.#t = [], this.#d(t);
|
|
123
126
|
}
|
|
124
127
|
#b() {
|
|
125
128
|
this.#x(), this.#s.addEventListener("click", (t) => {
|
|
126
129
|
if (t.target.classList.contains("remove-tag")) {
|
|
127
|
-
this.#T(t.target.getAttribute("data-value")), this.onUnselect !== void 0 && this.onUnselect(t.target.getAttribute("data-value")), this.#
|
|
130
|
+
this.#T(t.target.getAttribute("data-value")), this.onUnselect !== void 0 && this.onUnselect(t.target.getAttribute("data-value")), this.#n && this.#h(), this.#m();
|
|
128
131
|
return;
|
|
129
132
|
}
|
|
130
|
-
this.#
|
|
133
|
+
this.#n ? this.#h() : this.#m();
|
|
131
134
|
}), document.addEventListener("click", (t) => {
|
|
132
135
|
!this.#l.contains(t.target) && !this.#e.contains(t.target) && !t.target.classList.contains("remove-tag") && this.#h();
|
|
133
136
|
}), window.onresize = () => {
|
|
@@ -142,11 +145,11 @@ class l {
|
|
|
142
145
|
const e = document.createElement("div");
|
|
143
146
|
e.className = "custom-multiselect";
|
|
144
147
|
let s = document.createElement("div");
|
|
145
|
-
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),
|
|
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.#O()), t.appendChild(e);
|
|
146
149
|
const i = document.getElementById(this.id), a = document.createElement("input");
|
|
147
150
|
a.name = i.name, a.style.display = "none";
|
|
148
151
|
let n = i.parentNode;
|
|
149
|
-
t.appendChild(a), n.replaceChild(t, i), this.#
|
|
152
|
+
t.appendChild(a), n.replaceChild(t, i), this.#c = a, 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);
|
|
150
153
|
}
|
|
151
154
|
#E(t) {
|
|
152
155
|
const e = document.createElement("input");
|
|
@@ -154,11 +157,11 @@ class l {
|
|
|
154
157
|
const s = document.createElement("div");
|
|
155
158
|
return s.innerHTML = this.#S, t.appendChild(e), t.appendChild(s), this.#r = e, t;
|
|
156
159
|
}
|
|
157
|
-
#
|
|
160
|
+
#O() {
|
|
158
161
|
const t = document.createElement("div");
|
|
159
162
|
t.setAttribute("style", "position:fixed; z-index:999;");
|
|
160
163
|
const e = document.createElement("div");
|
|
161
|
-
e.className = "global-dropdown";
|
|
164
|
+
e.className = "global-dropdown", this.searchInputActive && t.appendChild(this.#D());
|
|
162
165
|
let s;
|
|
163
166
|
return e.addEventListener("scroll", (i) => {
|
|
164
167
|
s && clearTimeout(s), s = setTimeout(() => {
|
|
@@ -166,11 +169,11 @@ class l {
|
|
|
166
169
|
}, 70);
|
|
167
170
|
}), t.appendChild(e), this.#e = e, t;
|
|
168
171
|
}
|
|
169
|
-
#
|
|
172
|
+
#D() {
|
|
170
173
|
const t = document.createElement("input");
|
|
171
174
|
return t.type = "text", t.id = "selectyc_search_input", t.className = "search-input", t.placeholder = "Buscar...", t.addEventListener("input", () => {
|
|
172
175
|
this.filter = t.value, this.#e.innerHTML = "", this.filter = t.value, this.#w();
|
|
173
|
-
}), this.#
|
|
176
|
+
}), this.#i = t, t;
|
|
174
177
|
}
|
|
175
178
|
#a(t) {
|
|
176
179
|
const e = document.createElement("div");
|
|
@@ -183,26 +186,26 @@ class l {
|
|
|
183
186
|
const t = document.getElementById(this.id);
|
|
184
187
|
this.name = t.name, this.#f = t.required, Array.from(t.options).forEach((e) => {
|
|
185
188
|
if (e.selected) {
|
|
186
|
-
const s = e.text, i = this.#
|
|
189
|
+
const s = e.text, i = this.#o(e.value);
|
|
187
190
|
this.isMultiple ? this.#t.push({ value: i, text: s }) : this.#t[0] = { value: i, text: s };
|
|
188
191
|
}
|
|
189
|
-
this.#p.push({ id: this.#
|
|
192
|
+
this.#p.push({ id: this.#o(e.value), text: e.text });
|
|
190
193
|
});
|
|
191
194
|
}
|
|
192
195
|
#m() {
|
|
193
|
-
if (this.#
|
|
196
|
+
if (this.#n)
|
|
194
197
|
return;
|
|
195
198
|
this.#s.classList.remove(`round${this.bodyRound}`), this.#s.classList.add(`round${this.bodyRound}t`);
|
|
196
199
|
const t = this.#l.getBoundingClientRect();
|
|
197
200
|
if (this.searchInputActive) {
|
|
198
|
-
this.#
|
|
199
|
-
const e = this.#
|
|
201
|
+
this.#i.style.display = "block", this.#i.style.width = t.width + "px";
|
|
202
|
+
const e = this.#i.offsetHeight;
|
|
200
203
|
this.#e.style.top = e + "px";
|
|
201
204
|
}
|
|
202
|
-
this.#e.style.width = t.width + "px", this.#e.innerHTML = "", this.#e.style.display = "block", this.searchInputActive && this.#
|
|
205
|
+
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;
|
|
203
206
|
}
|
|
204
207
|
#h() {
|
|
205
|
-
this.#
|
|
208
|
+
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);
|
|
206
209
|
}
|
|
207
210
|
async #g() {
|
|
208
211
|
if (this.RS === void 0)
|
|
@@ -213,7 +216,7 @@ class l {
|
|
|
213
216
|
return this.data = Array.from(new Map([...this.#p, ...s].map((i) => [i.id, i])).values()), this.data;
|
|
214
217
|
}
|
|
215
218
|
async #w() {
|
|
216
|
-
this.#a({ id: "loading", text: "cargando ..." }), this.records = 10 + this.#t.length, this.#
|
|
219
|
+
this.#a({ id: "loading", text: "cargando ..." }), this.records = 10 + this.#t.length, this.#u = !1;
|
|
217
220
|
let t = await this.#g();
|
|
218
221
|
const e = this.#t.map((s) => s.value);
|
|
219
222
|
this.#e.lastChild.dataset.value === "loading" && this.#e.removeChild(this.#e.lastChild), t.forEach((s) => {
|
|
@@ -229,16 +232,16 @@ class l {
|
|
|
229
232
|
const a = this.#e.lastChild.dataset.value;
|
|
230
233
|
i.forEach((n) => {
|
|
231
234
|
n.text.toLowerCase().includes(e.toLowerCase()) && !t.includes(n.id) && !s.includes(n.id) && this.#a(n);
|
|
232
|
-
}), this.#
|
|
235
|
+
}), this.#u = a === this.#e.lastChild.dataset.value;
|
|
233
236
|
}
|
|
234
237
|
#M(t, e) {
|
|
235
|
-
this.#t.find((i) => i.value === e) || (this.isMultiple || (this.#t = []), this.#t.push({ text: t, value: e })), this.#
|
|
238
|
+
this.#t.find((i) => i.value === e) || (this.isMultiple || (this.#t = []), this.#t.push({ text: t, value: e })), this.#d(e);
|
|
236
239
|
}
|
|
237
|
-
#
|
|
240
|
+
#d(t) {
|
|
238
241
|
this.onChange !== void 0 && this.onChange(t), this.isMultiple ? this.#v() : this.#I();
|
|
239
242
|
}
|
|
240
243
|
#I() {
|
|
241
|
-
this.#r.value = null, this.#r.value = this.#t.length > 0 ? this.#t[0].text :
|
|
244
|
+
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;
|
|
242
245
|
const t = this.#r.parentNode, e = t.firstChild;
|
|
243
246
|
if (e.className === "remove-tag" && e.remove(), !this.clearButton || this.#t.length <= 0)
|
|
244
247
|
return;
|
|
@@ -256,13 +259,13 @@ class l {
|
|
|
256
259
|
});
|
|
257
260
|
}
|
|
258
261
|
#T(t) {
|
|
259
|
-
this.#t = this.#t.filter((e) => this.#
|
|
262
|
+
this.#t = this.#t.filter((e) => this.#o(e.value) !== this.#o(t)), this.#d(t);
|
|
260
263
|
}
|
|
261
264
|
#A(t) {
|
|
262
265
|
const { scrollTop: e, scrollHeight: s, clientHeight: i } = this.#e;
|
|
263
|
-
t.target.lastChild !== null && (t.target.lastChild.dataset.value === "loading" || 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.#N()));
|
|
264
267
|
}
|
|
265
|
-
#
|
|
268
|
+
#o(t) {
|
|
266
269
|
return !isNaN(t) && !isNaN(parseFloat(t)) ? parseInt(t) : t;
|
|
267
270
|
}
|
|
268
271
|
async render() {
|
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=[];#
|
|
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.#L();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.#D());let s;return e.addEventListener("scroll",i=>{s&&clearTimeout(s),s=setTimeout(()=>{this.#A(i)},70)}),t.appendChild(e),this.#e=e,t}#D(){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())})}#L(){const t=document.getElementById(this.id);this.name=t.name,this.#p=t.required,Array.from(t.options).forEach(e=>{if(e.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"})});
|