@idds/js 1.0.92 → 1.0.94
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/index.iife.js +42 -3
- package/dist/index.js +42 -3
- package/package.json +1 -1
package/dist/index.iife.js
CHANGED
|
@@ -3423,10 +3423,10 @@ var InaUI = (() => {
|
|
|
3423
3423
|
${col.header}
|
|
3424
3424
|
<div class="${PREFIX}-table__sort-icon">
|
|
3425
3425
|
<div class="${PREFIX}-table__sort-button" data-order="asc">
|
|
3426
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="
|
|
3426
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 5l0 14" /><path d="M16 9l-4 -4" /><path d="M8 9l4 -4" /></svg>
|
|
3427
3427
|
</div>
|
|
3428
3428
|
<div class="${PREFIX}-table__sort-button ${PREFIX}-table__sort-button-right" data-order="desc">
|
|
3429
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="
|
|
3429
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 5l0 14" /><path d="M16 15l-4 4" /><path d="M8 15l4 4" /></svg>
|
|
3430
3430
|
</div>
|
|
3431
3431
|
</div>
|
|
3432
3432
|
</div>
|
|
@@ -3569,7 +3569,19 @@ var InaUI = (() => {
|
|
|
3569
3569
|
this.elements.pagination.innerHTML = `
|
|
3570
3570
|
<div class="${PREFIX}-pagination">
|
|
3571
3571
|
<div class="${PREFIX}-pagination__nav-container">
|
|
3572
|
-
<div class="${PREFIX}-pagination__page-info">
|
|
3572
|
+
<div class="${PREFIX}-pagination__page-info">
|
|
3573
|
+
Halaman
|
|
3574
|
+
<input
|
|
3575
|
+
type="number"
|
|
3576
|
+
min="1"
|
|
3577
|
+
max="${this.state.totalPages}"
|
|
3578
|
+
value="${this.state.currentPage}"
|
|
3579
|
+
class="${PREFIX}-pagination__page-input"
|
|
3580
|
+
style="width: calc(${Math.max(1, String(this.state.currentPage).length)}ch + 12px)"
|
|
3581
|
+
aria-label="Current page"
|
|
3582
|
+
/>
|
|
3583
|
+
dari ${this.state.totalPages}
|
|
3584
|
+
</div>
|
|
3573
3585
|
<div class="${PREFIX}-pagination__nav-buttons"></div>
|
|
3574
3586
|
</div>
|
|
3575
3587
|
<div class="${PREFIX}-pagination__page-size-container">
|
|
@@ -3588,6 +3600,33 @@ var InaUI = (() => {
|
|
|
3588
3600
|
const pageSizeSelect = this.elements.pagination.querySelector(
|
|
3589
3601
|
`.${PREFIX}-pagination__page-size-select`
|
|
3590
3602
|
);
|
|
3603
|
+
const pageInput = this.elements.pagination.querySelector(
|
|
3604
|
+
`.${PREFIX}-pagination__page-input`
|
|
3605
|
+
);
|
|
3606
|
+
if (pageInput) {
|
|
3607
|
+
const handlePageInputCommit = () => {
|
|
3608
|
+
let val = parseInt(pageInput.value, 10);
|
|
3609
|
+
if (isNaN(val) || val < 1) val = 1;
|
|
3610
|
+
if (val > this.state.totalPages) val = this.state.totalPages;
|
|
3611
|
+
if (val !== this.state.currentPage) {
|
|
3612
|
+
this.state.currentPage = val;
|
|
3613
|
+
this.loadData();
|
|
3614
|
+
} else {
|
|
3615
|
+
pageInput.value = this.state.currentPage;
|
|
3616
|
+
pageInput.style.width = `calc(${Math.max(1, String(this.state.currentPage).length)}ch + 12px)`;
|
|
3617
|
+
}
|
|
3618
|
+
};
|
|
3619
|
+
pageInput.addEventListener("input", (e) => {
|
|
3620
|
+
const val = e.target.value;
|
|
3621
|
+
e.target.style.width = `calc(${Math.max(1, val.length)}ch + 12px)`;
|
|
3622
|
+
});
|
|
3623
|
+
pageInput.addEventListener("blur", handlePageInputCommit);
|
|
3624
|
+
pageInput.addEventListener("keydown", (e) => {
|
|
3625
|
+
if (e.key === "Enter") {
|
|
3626
|
+
handlePageInputCommit();
|
|
3627
|
+
}
|
|
3628
|
+
});
|
|
3629
|
+
}
|
|
3591
3630
|
pageSizeSelect.addEventListener("change", (e) => {
|
|
3592
3631
|
this.state.pageSize = parseInt(e.target.value, 10);
|
|
3593
3632
|
this.state.currentPage = 1;
|
package/dist/index.js
CHANGED
|
@@ -3505,10 +3505,10 @@ var Table = class {
|
|
|
3505
3505
|
${col.header}
|
|
3506
3506
|
<div class="${PREFIX}-table__sort-icon">
|
|
3507
3507
|
<div class="${PREFIX}-table__sort-button" data-order="asc">
|
|
3508
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="
|
|
3508
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 5l0 14" /><path d="M16 9l-4 -4" /><path d="M8 9l4 -4" /></svg>
|
|
3509
3509
|
</div>
|
|
3510
3510
|
<div class="${PREFIX}-table__sort-button ${PREFIX}-table__sort-button-right" data-order="desc">
|
|
3511
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="
|
|
3511
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 5l0 14" /><path d="M16 15l-4 4" /><path d="M8 15l4 4" /></svg>
|
|
3512
3512
|
</div>
|
|
3513
3513
|
</div>
|
|
3514
3514
|
</div>
|
|
@@ -3651,7 +3651,19 @@ var Table = class {
|
|
|
3651
3651
|
this.elements.pagination.innerHTML = `
|
|
3652
3652
|
<div class="${PREFIX}-pagination">
|
|
3653
3653
|
<div class="${PREFIX}-pagination__nav-container">
|
|
3654
|
-
<div class="${PREFIX}-pagination__page-info">
|
|
3654
|
+
<div class="${PREFIX}-pagination__page-info">
|
|
3655
|
+
Halaman
|
|
3656
|
+
<input
|
|
3657
|
+
type="number"
|
|
3658
|
+
min="1"
|
|
3659
|
+
max="${this.state.totalPages}"
|
|
3660
|
+
value="${this.state.currentPage}"
|
|
3661
|
+
class="${PREFIX}-pagination__page-input"
|
|
3662
|
+
style="width: calc(${Math.max(1, String(this.state.currentPage).length)}ch + 12px)"
|
|
3663
|
+
aria-label="Current page"
|
|
3664
|
+
/>
|
|
3665
|
+
dari ${this.state.totalPages}
|
|
3666
|
+
</div>
|
|
3655
3667
|
<div class="${PREFIX}-pagination__nav-buttons"></div>
|
|
3656
3668
|
</div>
|
|
3657
3669
|
<div class="${PREFIX}-pagination__page-size-container">
|
|
@@ -3670,6 +3682,33 @@ var Table = class {
|
|
|
3670
3682
|
const pageSizeSelect = this.elements.pagination.querySelector(
|
|
3671
3683
|
`.${PREFIX}-pagination__page-size-select`
|
|
3672
3684
|
);
|
|
3685
|
+
const pageInput = this.elements.pagination.querySelector(
|
|
3686
|
+
`.${PREFIX}-pagination__page-input`
|
|
3687
|
+
);
|
|
3688
|
+
if (pageInput) {
|
|
3689
|
+
const handlePageInputCommit = () => {
|
|
3690
|
+
let val = parseInt(pageInput.value, 10);
|
|
3691
|
+
if (isNaN(val) || val < 1) val = 1;
|
|
3692
|
+
if (val > this.state.totalPages) val = this.state.totalPages;
|
|
3693
|
+
if (val !== this.state.currentPage) {
|
|
3694
|
+
this.state.currentPage = val;
|
|
3695
|
+
this.loadData();
|
|
3696
|
+
} else {
|
|
3697
|
+
pageInput.value = this.state.currentPage;
|
|
3698
|
+
pageInput.style.width = `calc(${Math.max(1, String(this.state.currentPage).length)}ch + 12px)`;
|
|
3699
|
+
}
|
|
3700
|
+
};
|
|
3701
|
+
pageInput.addEventListener("input", (e) => {
|
|
3702
|
+
const val = e.target.value;
|
|
3703
|
+
e.target.style.width = `calc(${Math.max(1, val.length)}ch + 12px)`;
|
|
3704
|
+
});
|
|
3705
|
+
pageInput.addEventListener("blur", handlePageInputCommit);
|
|
3706
|
+
pageInput.addEventListener("keydown", (e) => {
|
|
3707
|
+
if (e.key === "Enter") {
|
|
3708
|
+
handlePageInputCommit();
|
|
3709
|
+
}
|
|
3710
|
+
});
|
|
3711
|
+
}
|
|
3673
3712
|
pageSizeSelect.addEventListener("change", (e) => {
|
|
3674
3713
|
this.state.pageSize = parseInt(e.target.value, 10);
|
|
3675
3714
|
this.state.currentPage = 1;
|