@frollo/frollo-web-ui 8.1.0 → 8.1.1
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/cjs/index.js +28 -95
- package/esm/fw-provider-list.js +1 -1
- package/esm/{fw-table-row-DhDvTJHm.js → fw-table-row-Cianlk0N.js} +25 -93
- package/esm/fw-table.js +1 -4
- package/esm/index.js +1 -1
- package/frollo-web-ui.esm.js +28 -95
- package/index.d.ts +9 -7
- package/package.json +1 -1
- package/types/components/fw-table/fw-table.vue.d.ts +8 -7
- package/types/components/fw-table/index.types.d.ts +1 -0
- package/web-components/index.js +30 -97
package/cjs/index.js
CHANGED
|
@@ -8138,10 +8138,10 @@ var _hoisted_10$4 = {
|
|
|
8138
8138
|
};
|
|
8139
8139
|
var _hoisted_11$2 = ["aria-labelledby"];
|
|
8140
8140
|
var _hoisted_12$2 = ["onClick"];
|
|
8141
|
-
var _hoisted_13$
|
|
8141
|
+
var _hoisted_13$1 = {
|
|
8142
8142
|
"class": "flex items-center gap-x-2"
|
|
8143
8143
|
};
|
|
8144
|
-
var _hoisted_14$
|
|
8144
|
+
var _hoisted_14$1 = {
|
|
8145
8145
|
"class": "flex flex-col text-left"
|
|
8146
8146
|
};
|
|
8147
8147
|
var _hoisted_15$1 = {
|
|
@@ -8200,11 +8200,11 @@ function render$p(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
8200
8200
|
onClick: function onClick($event) {
|
|
8201
8201
|
return _ctx.selectOption(option);
|
|
8202
8202
|
}
|
|
8203
|
-
}, [vue.createElementVNode("div", _hoisted_13$
|
|
8203
|
+
}, [vue.createElementVNode("div", _hoisted_13$1, [option.image_url ? (vue.openBlock(), vue.createBlock(_component_FwImage, {
|
|
8204
8204
|
key: 0,
|
|
8205
8205
|
src: option.image_url,
|
|
8206
8206
|
"class": "w-[20px] h-[20px]"
|
|
8207
|
-
}, null, 8, ["src"])) : vue.createCommentVNode("", true), vue.createElementVNode("div", _hoisted_14$
|
|
8207
|
+
}, null, 8, ["src"])) : vue.createCommentVNode("", true), vue.createElementVNode("div", _hoisted_14$1, [vue.createElementVNode("span", null, vue.toDisplayString(option.label), 1), option.description ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_15$1, vue.toDisplayString(option.description), 1)) : vue.createCommentVNode("", true)])])], 10, _hoisted_12$2);
|
|
8208
8208
|
}), 128))], 10, _hoisted_11$2), [[vue.vShow, _ctx.isOpen]])];
|
|
8209
8209
|
}),
|
|
8210
8210
|
_: 1
|
|
@@ -9331,8 +9331,7 @@ styleInject(css_248z$b);__default__$7.render = render$g;var __default__$6 = vue.
|
|
|
9331
9331
|
ChevronLeftSvg: render$O,
|
|
9332
9332
|
ChevronRightSvg: render$P,
|
|
9333
9333
|
FwLoadingBar: script$k,
|
|
9334
|
-
FwButton: script$f
|
|
9335
|
-
FwInput: script$m
|
|
9334
|
+
FwButton: script$f
|
|
9336
9335
|
},
|
|
9337
9336
|
emits: [/** Fired when a row is clicked with row data */
|
|
9338
9337
|
'rowClicked', /** Fired when a column is sorted */
|
|
@@ -9368,6 +9367,9 @@ styleInject(css_248z$b);__default__$7.render = render$g;var __default__$6 = vue.
|
|
|
9368
9367
|
},
|
|
9369
9368
|
totalAmount: {
|
|
9370
9369
|
type: Number
|
|
9370
|
+
},
|
|
9371
|
+
pageSize: {
|
|
9372
|
+
type: Number
|
|
9371
9373
|
}
|
|
9372
9374
|
},
|
|
9373
9375
|
setup: function setup(props, ctx) {
|
|
@@ -9377,39 +9379,15 @@ styleInject(css_248z$b);__default__$7.render = render$g;var __default__$6 = vue.
|
|
|
9377
9379
|
var sortBy = vue.ref('');
|
|
9378
9380
|
var sortDirection = vue.ref('asc');
|
|
9379
9381
|
var currentSortedColumn = vue.ref('');
|
|
9380
|
-
var currentPage = vue.ref(
|
|
9381
|
-
var
|
|
9382
|
-
var pages = vue.computed(function () {
|
|
9383
|
-
if (!props.totalAmount) return;
|
|
9384
|
-
var currentPageNumber = Number(currentPage.value);
|
|
9385
|
-
var pageButtons = [];
|
|
9386
|
-
var pageNumberLimit = currentPageNumber + maxDisplayedPages - 1;
|
|
9387
|
-
var maxPageNumber = props.totalAmount - currentPageNumber < maxDisplayedPages ? props.totalAmount : pageNumberLimit + 1;
|
|
9388
|
-
for (var i = currentPageNumber; i < maxPageNumber + 1; i++) {
|
|
9389
|
-
pageButtons.push({
|
|
9390
|
-
pageNumber: i.toString(),
|
|
9391
|
-
selected: i.toString() === currentPage.value
|
|
9392
|
-
});
|
|
9393
|
-
}
|
|
9394
|
-
if (props.totalAmount === maxDisplayedPages) {
|
|
9395
|
-
return pageButtons;
|
|
9396
|
-
}
|
|
9397
|
-
if (props.totalAmount - currentPageNumber > maxDisplayedPages) {
|
|
9398
|
-
pageButtons.push({
|
|
9399
|
-
pageNumber: '...',
|
|
9400
|
-
selected: false
|
|
9401
|
-
}, {
|
|
9402
|
-
pageNumber: props.totalAmount.toString(),
|
|
9403
|
-
selected: false
|
|
9404
|
-
});
|
|
9405
|
-
}
|
|
9406
|
-
ctx.emit('pageChanged', currentPage.value);
|
|
9407
|
-
return pageButtons;
|
|
9408
|
-
});
|
|
9382
|
+
var currentPage = vue.ref(1);
|
|
9383
|
+
var maxPageAmount = vue.ref();
|
|
9409
9384
|
vue.onMounted(function () {
|
|
9410
9385
|
if (Number(props.autoSortColumn) >= 0) {
|
|
9411
9386
|
sortColumn(columns.value[Number(props.autoSortColumn)], false);
|
|
9412
9387
|
}
|
|
9388
|
+
if (props.totalAmount && props.pageSize) {
|
|
9389
|
+
maxPageAmount.value = Math.ceil(props.totalAmount / props.pageSize);
|
|
9390
|
+
}
|
|
9413
9391
|
});
|
|
9414
9392
|
var _useColours = useColours(),
|
|
9415
9393
|
bgHoverColor = _useColours.primaryFade5;
|
|
@@ -9479,15 +9457,9 @@ styleInject(css_248z$b);__default__$7.render = render$g;var __default__$6 = vue.
|
|
|
9479
9457
|
var rowClicked = function rowClicked(row) {
|
|
9480
9458
|
if (props.clickableRows) ctx.emit('rowClicked', row);
|
|
9481
9459
|
};
|
|
9482
|
-
var pageNumberClick = function pageNumberClick(pageNumber) {
|
|
9483
|
-
if (pageNumber === '...') {
|
|
9484
|
-
currentPage.value = (Number(currentPage.value) + maxDisplayedPages + 1).toString();
|
|
9485
|
-
return;
|
|
9486
|
-
}
|
|
9487
|
-
currentPage.value = pageNumber;
|
|
9488
|
-
};
|
|
9489
9460
|
var pageArrowClick = function pageArrowClick(next) {
|
|
9490
|
-
currentPage.value =
|
|
9461
|
+
currentPage.value = currentPage.value + (next ? 1 : -1);
|
|
9462
|
+
ctx.emit('pageChanged', next);
|
|
9491
9463
|
};
|
|
9492
9464
|
return {
|
|
9493
9465
|
columns: columns,
|
|
@@ -9503,8 +9475,7 @@ styleInject(css_248z$b);__default__$7.render = render$g;var __default__$6 = vue.
|
|
|
9503
9475
|
rowClicked: rowClicked,
|
|
9504
9476
|
bgHoverColor: bgHoverColor,
|
|
9505
9477
|
currentPage: currentPage,
|
|
9506
|
-
|
|
9507
|
-
pageNumberClick: pageNumberClick,
|
|
9478
|
+
maxPageAmount: maxPageAmount,
|
|
9508
9479
|
pageArrowClick: pageArrowClick
|
|
9509
9480
|
};
|
|
9510
9481
|
}
|
|
@@ -9512,7 +9483,7 @@ styleInject(css_248z$b);__default__$7.render = render$g;var __default__$6 = vue.
|
|
|
9512
9483
|
var __injectCSSVars__$5 = function __injectCSSVars__() {
|
|
9513
9484
|
vue.useCssVars(function (_ctx) {
|
|
9514
9485
|
return {
|
|
9515
|
-
"
|
|
9486
|
+
"11c7ec1c": _ctx.bgHoverColor
|
|
9516
9487
|
};
|
|
9517
9488
|
});
|
|
9518
9489
|
};
|
|
@@ -9521,7 +9492,7 @@ __default__$6.setup = __setup__$5 ? function (props, ctx) {
|
|
|
9521
9492
|
__injectCSSVars__$5();
|
|
9522
9493
|
return __setup__$5(props, ctx);
|
|
9523
9494
|
} : __injectCSSVars__$5;var _withScopeId$4 = function _withScopeId(n) {
|
|
9524
|
-
return vue.pushScopeId("data-v-
|
|
9495
|
+
return vue.pushScopeId("data-v-b7ffd9d4"), n = n(), vue.popScopeId(), n;
|
|
9525
9496
|
};
|
|
9526
9497
|
var _hoisted_1$p = {
|
|
9527
9498
|
"class": "flex flex-col"
|
|
@@ -9553,25 +9524,15 @@ var _hoisted_10$1 = ["onClick", "tabindex", "onKeydown"];
|
|
|
9553
9524
|
var _hoisted_11$1 = ["innerHTML"];
|
|
9554
9525
|
var _hoisted_12$1 = {
|
|
9555
9526
|
key: 0,
|
|
9556
|
-
"class": "flex flex-row h-[44px] mt-8
|
|
9557
|
-
};
|
|
9558
|
-
var _hoisted_13$1 = {
|
|
9559
|
-
"class": "h-4 w-4"
|
|
9527
|
+
"class": "flex flex-row justify-center h-[44px] mt-8 space-x-2 mb-[40px]"
|
|
9560
9528
|
};
|
|
9561
|
-
var _hoisted_14$1 = /*#__PURE__*/_withScopeId$4(function () {
|
|
9562
|
-
return /*#__PURE__*/vue.createElementVNode("strong", {
|
|
9563
|
-
"class": "whitespace-nowrap px-4 self-center"
|
|
9564
|
-
}, "Go to", -1);
|
|
9565
|
-
});
|
|
9566
9529
|
function render$f(_ctx, _cache, $props, $setup, $data, $options) {
|
|
9567
|
-
var _ctx$options;
|
|
9568
9530
|
var _component_ArrowSortSvg = vue.resolveComponent("ArrowSortSvg");
|
|
9569
9531
|
var _component_ArrowDownSvg = vue.resolveComponent("ArrowDownSvg");
|
|
9570
9532
|
var _component_FwLoadingBar = vue.resolveComponent("FwLoadingBar");
|
|
9571
9533
|
var _component_ChevronLeftSvg = vue.resolveComponent("ChevronLeftSvg");
|
|
9572
9534
|
var _component_FwButton = vue.resolveComponent("FwButton");
|
|
9573
9535
|
var _component_ChevronRightSvg = vue.resolveComponent("ChevronRightSvg");
|
|
9574
|
-
var _component_FwInput = vue.resolveComponent("FwInput");
|
|
9575
9536
|
return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$p, [vue.createElementVNode("table", {
|
|
9576
9537
|
"class": vue.normalizeClass(["fw-table table-auto table-responsive rounded-md shadow-card flex-1", _ctx.loading ? 'cursor-wait' : '']),
|
|
9577
9538
|
"aria-live": "polite",
|
|
@@ -9647,9 +9608,9 @@ function render$f(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
9647
9608
|
key: 1,
|
|
9648
9609
|
row: row
|
|
9649
9610
|
}) : vue.createCommentVNode("", true)], 42, _hoisted_10$1);
|
|
9650
|
-
}), 128))])], 10, _hoisted_2$n), _ctx.enablePagination
|
|
9611
|
+
}), 128))])], 10, _hoisted_2$n), _ctx.enablePagination ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_12$1, [vue.createVNode(_component_FwButton, {
|
|
9651
9612
|
variant: 'tertiary',
|
|
9652
|
-
disabled: _ctx.currentPage ===
|
|
9613
|
+
disabled: _ctx.currentPage === 1,
|
|
9653
9614
|
size: "sm",
|
|
9654
9615
|
"class": "border-grey-40",
|
|
9655
9616
|
onClick: _cache[0] || (_cache[0] = function ($event) {
|
|
@@ -9658,33 +9619,14 @@ function render$f(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
9658
9619
|
}, {
|
|
9659
9620
|
"default": vue.withCtx(function () {
|
|
9660
9621
|
return [vue.createVNode(_component_ChevronLeftSvg, {
|
|
9661
|
-
"class": "h-4 w-4
|
|
9622
|
+
"class": "h-4 w-4",
|
|
9662
9623
|
"stroke-width": "3"
|
|
9663
9624
|
})];
|
|
9664
9625
|
}),
|
|
9665
9626
|
_: 1
|
|
9666
|
-
}, 8, ["disabled"]),
|
|
9667
|
-
return vue.openBlock(), vue.createBlock(_component_FwButton, {
|
|
9668
|
-
rounded: "",
|
|
9669
|
-
size: "sm",
|
|
9670
|
-
key: page.pageNumber,
|
|
9671
|
-
variant: page.selected ? 'tertiary' : 'secondary',
|
|
9672
|
-
"class": vue.normalizeClass({
|
|
9673
|
-
'border-none': !page.selected,
|
|
9674
|
-
'bg-transparent': true
|
|
9675
|
-
}),
|
|
9676
|
-
onClick: function onClick($event) {
|
|
9677
|
-
return _ctx.pageNumberClick(page.pageNumber);
|
|
9678
|
-
}
|
|
9679
|
-
}, {
|
|
9680
|
-
"default": vue.withCtx(function () {
|
|
9681
|
-
return [vue.createElementVNode("div", _hoisted_13$1, [vue.createElementVNode("strong", null, vue.toDisplayString(page.pageNumber), 1)])];
|
|
9682
|
-
}),
|
|
9683
|
-
_: 2
|
|
9684
|
-
}, 1032, ["variant", "class", "onClick"]);
|
|
9685
|
-
}), 128)), vue.createVNode(_component_FwButton, {
|
|
9627
|
+
}, 8, ["disabled"]), vue.renderSlot(_ctx.$slots, "page"), vue.createVNode(_component_FwButton, {
|
|
9686
9628
|
variant: 'tertiary',
|
|
9687
|
-
disabled: _ctx.
|
|
9629
|
+
disabled: _ctx.currentPage === _ctx.maxPageAmount,
|
|
9688
9630
|
size: "sm",
|
|
9689
9631
|
"class": "border-grey-40",
|
|
9690
9632
|
onClick: _cache[1] || (_cache[1] = function ($event) {
|
|
@@ -9697,20 +9639,11 @@ function render$f(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
9697
9639
|
})];
|
|
9698
9640
|
}),
|
|
9699
9641
|
_: 1
|
|
9700
|
-
}, 8, ["disabled"])
|
|
9701
|
-
|
|
9702
|
-
|
|
9703
|
-
name: "page",
|
|
9704
|
-
modelValue: _ctx.currentPage,
|
|
9705
|
-
"onUpdate:modelValue": _cache[2] || (_cache[2] = function ($event) {
|
|
9706
|
-
return _ctx.currentPage = $event;
|
|
9707
|
-
}),
|
|
9708
|
-
type: "tel"
|
|
9709
|
-
}, null, 8, ["modelValue"])])) : vue.createCommentVNode("", true)]);
|
|
9710
|
-
}var css_248z$a = ".fw-table-head--sortable[data-v-84c515f0]:hover{background-color:var(--c795d904)}.fw-table-row[data-v-84c515f0]:hover{background-color:var(--c795d904)}";
|
|
9711
|
-
var stylesheet$a = ".fw-table-head--sortable[data-v-84c515f0]:hover{background-color:var(--c795d904)}.fw-table-row[data-v-84c515f0]:hover{background-color:var(--c795d904)}";
|
|
9642
|
+
}, 8, ["disabled"])])) : vue.createCommentVNode("", true)]);
|
|
9643
|
+
}var css_248z$a = ".fw-table-head--sortable[data-v-b7ffd9d4]:hover{background-color:var(--11c7ec1c)}.fw-table-row[data-v-b7ffd9d4]:hover{background-color:var(--11c7ec1c)}";
|
|
9644
|
+
var stylesheet$a = ".fw-table-head--sortable[data-v-b7ffd9d4]:hover{background-color:var(--11c7ec1c)}.fw-table-row[data-v-b7ffd9d4]:hover{background-color:var(--11c7ec1c)}";
|
|
9712
9645
|
styleInject(css_248z$a);__default__$6.render = render$f;
|
|
9713
|
-
__default__$6.__scopeId = "data-v-
|
|
9646
|
+
__default__$6.__scopeId = "data-v-b7ffd9d4";var script$9 = vue.defineComponent({
|
|
9714
9647
|
name: 'FwTableHead'
|
|
9715
9648
|
});var _hoisted_1$o = {
|
|
9716
9649
|
"class": "py-6 px-5 text-left font-medium"
|
package/esm/fw-provider-list.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { e as _defineProperty } from './_rollupPluginBabelHelpers-DpC_oIQV.js';
|
|
2
2
|
import { defineComponent, ref, computed, createElementVNode, resolveComponent, openBlock, createElementBlock, toDisplayString, createVNode, withCtx, createBlock, createCommentVNode, createTextVNode } from 'vue';
|
|
3
|
-
import { _ as __default__, s as script$4, a as script$5 } from './fw-table-row-
|
|
3
|
+
import { _ as __default__, s as script$4, a as script$5 } from './fw-table-row-Cianlk0N.js';
|
|
4
4
|
import { s as script$1 } from './fw-input-BPFFMpc2.js';
|
|
5
5
|
import { _ as __default__$1 } from './fw-tag-508OLlZR.js';
|
|
6
6
|
import { s as script$3 } from './fw-button-DdxvSBFa.js';
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
import { g as render$3, h as render$4, i as render$5, f as render$6 } from './index-svDiDkSU.js';
|
|
2
|
-
import { defineComponent, computed, ref, onMounted, useCssVars, pushScopeId, popScopeId,
|
|
2
|
+
import { defineComponent, computed, ref, onMounted, useCssVars, pushScopeId, popScopeId, resolveComponent, openBlock, createElementBlock, createElementVNode, normalizeClass, renderSlot, createCommentVNode, Fragment, renderList, withKeys, toDisplayString, createBlock, createVNode, withCtx } from 'vue';
|
|
3
3
|
import { u as useColours } from './get-root-colours-DYEoJPEb.js';
|
|
4
4
|
import { s as script$2 } from './fw-loading-bar-DThRjdw1.js';
|
|
5
5
|
import { s as script$3 } from './fw-button-DdxvSBFa.js';
|
|
6
|
-
import { s as script$4 } from './fw-input-BPFFMpc2.js';
|
|
7
6
|
import { s as styleInject } from './style-inject.es-tgCJW-Cu.js';
|
|
8
7
|
|
|
9
8
|
var __default__ = defineComponent({
|
|
@@ -14,8 +13,7 @@ var __default__ = defineComponent({
|
|
|
14
13
|
ChevronLeftSvg: render$5,
|
|
15
14
|
ChevronRightSvg: render$6,
|
|
16
15
|
FwLoadingBar: script$2,
|
|
17
|
-
FwButton: script$3
|
|
18
|
-
FwInput: script$4
|
|
16
|
+
FwButton: script$3
|
|
19
17
|
},
|
|
20
18
|
emits: [/** Fired when a row is clicked with row data */
|
|
21
19
|
'rowClicked', /** Fired when a column is sorted */
|
|
@@ -51,6 +49,9 @@ var __default__ = defineComponent({
|
|
|
51
49
|
},
|
|
52
50
|
totalAmount: {
|
|
53
51
|
type: Number
|
|
52
|
+
},
|
|
53
|
+
pageSize: {
|
|
54
|
+
type: Number
|
|
54
55
|
}
|
|
55
56
|
},
|
|
56
57
|
setup: function setup(props, ctx) {
|
|
@@ -60,39 +61,15 @@ var __default__ = defineComponent({
|
|
|
60
61
|
var sortBy = ref('');
|
|
61
62
|
var sortDirection = ref('asc');
|
|
62
63
|
var currentSortedColumn = ref('');
|
|
63
|
-
var currentPage = ref(
|
|
64
|
-
var
|
|
65
|
-
var pages = computed(function () {
|
|
66
|
-
if (!props.totalAmount) return;
|
|
67
|
-
var currentPageNumber = Number(currentPage.value);
|
|
68
|
-
var pageButtons = [];
|
|
69
|
-
var pageNumberLimit = currentPageNumber + maxDisplayedPages - 1;
|
|
70
|
-
var maxPageNumber = props.totalAmount - currentPageNumber < maxDisplayedPages ? props.totalAmount : pageNumberLimit + 1;
|
|
71
|
-
for (var i = currentPageNumber; i < maxPageNumber + 1; i++) {
|
|
72
|
-
pageButtons.push({
|
|
73
|
-
pageNumber: i.toString(),
|
|
74
|
-
selected: i.toString() === currentPage.value
|
|
75
|
-
});
|
|
76
|
-
}
|
|
77
|
-
if (props.totalAmount === maxDisplayedPages) {
|
|
78
|
-
return pageButtons;
|
|
79
|
-
}
|
|
80
|
-
if (props.totalAmount - currentPageNumber > maxDisplayedPages) {
|
|
81
|
-
pageButtons.push({
|
|
82
|
-
pageNumber: '...',
|
|
83
|
-
selected: false
|
|
84
|
-
}, {
|
|
85
|
-
pageNumber: props.totalAmount.toString(),
|
|
86
|
-
selected: false
|
|
87
|
-
});
|
|
88
|
-
}
|
|
89
|
-
ctx.emit('pageChanged', currentPage.value);
|
|
90
|
-
return pageButtons;
|
|
91
|
-
});
|
|
64
|
+
var currentPage = ref(1);
|
|
65
|
+
var maxPageAmount = ref();
|
|
92
66
|
onMounted(function () {
|
|
93
67
|
if (Number(props.autoSortColumn) >= 0) {
|
|
94
68
|
sortColumn(columns.value[Number(props.autoSortColumn)], false);
|
|
95
69
|
}
|
|
70
|
+
if (props.totalAmount && props.pageSize) {
|
|
71
|
+
maxPageAmount.value = Math.ceil(props.totalAmount / props.pageSize);
|
|
72
|
+
}
|
|
96
73
|
});
|
|
97
74
|
var _useColours = useColours(),
|
|
98
75
|
bgHoverColor = _useColours.primaryFade5;
|
|
@@ -162,15 +139,9 @@ var __default__ = defineComponent({
|
|
|
162
139
|
var rowClicked = function rowClicked(row) {
|
|
163
140
|
if (props.clickableRows) ctx.emit('rowClicked', row);
|
|
164
141
|
};
|
|
165
|
-
var pageNumberClick = function pageNumberClick(pageNumber) {
|
|
166
|
-
if (pageNumber === '...') {
|
|
167
|
-
currentPage.value = (Number(currentPage.value) + maxDisplayedPages + 1).toString();
|
|
168
|
-
return;
|
|
169
|
-
}
|
|
170
|
-
currentPage.value = pageNumber;
|
|
171
|
-
};
|
|
172
142
|
var pageArrowClick = function pageArrowClick(next) {
|
|
173
|
-
currentPage.value =
|
|
143
|
+
currentPage.value = currentPage.value + (next ? 1 : -1);
|
|
144
|
+
ctx.emit('pageChanged', next);
|
|
174
145
|
};
|
|
175
146
|
return {
|
|
176
147
|
columns: columns,
|
|
@@ -186,8 +157,7 @@ var __default__ = defineComponent({
|
|
|
186
157
|
rowClicked: rowClicked,
|
|
187
158
|
bgHoverColor: bgHoverColor,
|
|
188
159
|
currentPage: currentPage,
|
|
189
|
-
|
|
190
|
-
pageNumberClick: pageNumberClick,
|
|
160
|
+
maxPageAmount: maxPageAmount,
|
|
191
161
|
pageArrowClick: pageArrowClick
|
|
192
162
|
};
|
|
193
163
|
}
|
|
@@ -195,7 +165,7 @@ var __default__ = defineComponent({
|
|
|
195
165
|
var __injectCSSVars__ = function __injectCSSVars__() {
|
|
196
166
|
useCssVars(function (_ctx) {
|
|
197
167
|
return {
|
|
198
|
-
"
|
|
168
|
+
"11c7ec1c": _ctx.bgHoverColor
|
|
199
169
|
};
|
|
200
170
|
});
|
|
201
171
|
};
|
|
@@ -206,7 +176,7 @@ __default__.setup = __setup__ ? function (props, ctx) {
|
|
|
206
176
|
} : __injectCSSVars__;
|
|
207
177
|
|
|
208
178
|
var _withScopeId = function _withScopeId(n) {
|
|
209
|
-
return pushScopeId("data-v-
|
|
179
|
+
return pushScopeId("data-v-b7ffd9d4"), n = n(), popScopeId(), n;
|
|
210
180
|
};
|
|
211
181
|
var _hoisted_1$2 = {
|
|
212
182
|
"class": "flex flex-col"
|
|
@@ -238,25 +208,15 @@ var _hoisted_10 = ["onClick", "tabindex", "onKeydown"];
|
|
|
238
208
|
var _hoisted_11 = ["innerHTML"];
|
|
239
209
|
var _hoisted_12 = {
|
|
240
210
|
key: 0,
|
|
241
|
-
"class": "flex flex-row h-[44px] mt-8
|
|
211
|
+
"class": "flex flex-row justify-center h-[44px] mt-8 space-x-2 mb-[40px]"
|
|
242
212
|
};
|
|
243
|
-
var _hoisted_13 = {
|
|
244
|
-
"class": "h-4 w-4"
|
|
245
|
-
};
|
|
246
|
-
var _hoisted_14 = /*#__PURE__*/_withScopeId(function () {
|
|
247
|
-
return /*#__PURE__*/createElementVNode("strong", {
|
|
248
|
-
"class": "whitespace-nowrap px-4 self-center"
|
|
249
|
-
}, "Go to", -1);
|
|
250
|
-
});
|
|
251
213
|
function render$2(_ctx, _cache, $props, $setup, $data, $options) {
|
|
252
|
-
var _ctx$options;
|
|
253
214
|
var _component_ArrowSortSvg = resolveComponent("ArrowSortSvg");
|
|
254
215
|
var _component_ArrowDownSvg = resolveComponent("ArrowDownSvg");
|
|
255
216
|
var _component_FwLoadingBar = resolveComponent("FwLoadingBar");
|
|
256
217
|
var _component_ChevronLeftSvg = resolveComponent("ChevronLeftSvg");
|
|
257
218
|
var _component_FwButton = resolveComponent("FwButton");
|
|
258
219
|
var _component_ChevronRightSvg = resolveComponent("ChevronRightSvg");
|
|
259
|
-
var _component_FwInput = resolveComponent("FwInput");
|
|
260
220
|
return openBlock(), createElementBlock("div", _hoisted_1$2, [createElementVNode("table", {
|
|
261
221
|
"class": normalizeClass(["fw-table table-auto table-responsive rounded-md shadow-card flex-1", _ctx.loading ? 'cursor-wait' : '']),
|
|
262
222
|
"aria-live": "polite",
|
|
@@ -332,9 +292,9 @@ function render$2(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
332
292
|
key: 1,
|
|
333
293
|
row: row
|
|
334
294
|
}) : createCommentVNode("", true)], 42, _hoisted_10);
|
|
335
|
-
}), 128))])], 10, _hoisted_2$1), _ctx.enablePagination
|
|
295
|
+
}), 128))])], 10, _hoisted_2$1), _ctx.enablePagination ? (openBlock(), createElementBlock("div", _hoisted_12, [createVNode(_component_FwButton, {
|
|
336
296
|
variant: 'tertiary',
|
|
337
|
-
disabled: _ctx.currentPage ===
|
|
297
|
+
disabled: _ctx.currentPage === 1,
|
|
338
298
|
size: "sm",
|
|
339
299
|
"class": "border-grey-40",
|
|
340
300
|
onClick: _cache[0] || (_cache[0] = function ($event) {
|
|
@@ -343,33 +303,14 @@ function render$2(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
343
303
|
}, {
|
|
344
304
|
"default": withCtx(function () {
|
|
345
305
|
return [createVNode(_component_ChevronLeftSvg, {
|
|
346
|
-
"class": "h-4 w-4
|
|
306
|
+
"class": "h-4 w-4",
|
|
347
307
|
"stroke-width": "3"
|
|
348
308
|
})];
|
|
349
309
|
}),
|
|
350
310
|
_: 1
|
|
351
|
-
}, 8, ["disabled"]), (
|
|
352
|
-
return openBlock(), createBlock(_component_FwButton, {
|
|
353
|
-
rounded: "",
|
|
354
|
-
size: "sm",
|
|
355
|
-
key: page.pageNumber,
|
|
356
|
-
variant: page.selected ? 'tertiary' : 'secondary',
|
|
357
|
-
"class": normalizeClass({
|
|
358
|
-
'border-none': !page.selected,
|
|
359
|
-
'bg-transparent': true
|
|
360
|
-
}),
|
|
361
|
-
onClick: function onClick($event) {
|
|
362
|
-
return _ctx.pageNumberClick(page.pageNumber);
|
|
363
|
-
}
|
|
364
|
-
}, {
|
|
365
|
-
"default": withCtx(function () {
|
|
366
|
-
return [createElementVNode("div", _hoisted_13, [createElementVNode("strong", null, toDisplayString(page.pageNumber), 1)])];
|
|
367
|
-
}),
|
|
368
|
-
_: 2
|
|
369
|
-
}, 1032, ["variant", "class", "onClick"]);
|
|
370
|
-
}), 128)), createVNode(_component_FwButton, {
|
|
311
|
+
}, 8, ["disabled"]), renderSlot(_ctx.$slots, "page"), createVNode(_component_FwButton, {
|
|
371
312
|
variant: 'tertiary',
|
|
372
|
-
disabled: _ctx.
|
|
313
|
+
disabled: _ctx.currentPage === _ctx.maxPageAmount,
|
|
373
314
|
size: "sm",
|
|
374
315
|
"class": "border-grey-40",
|
|
375
316
|
onClick: _cache[1] || (_cache[1] = function ($event) {
|
|
@@ -382,24 +323,15 @@ function render$2(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
382
323
|
})];
|
|
383
324
|
}),
|
|
384
325
|
_: 1
|
|
385
|
-
}, 8, ["disabled"])
|
|
386
|
-
"center-align-input": "",
|
|
387
|
-
"class": "max-w-[66px] p-0 text-center",
|
|
388
|
-
name: "page",
|
|
389
|
-
modelValue: _ctx.currentPage,
|
|
390
|
-
"onUpdate:modelValue": _cache[2] || (_cache[2] = function ($event) {
|
|
391
|
-
return _ctx.currentPage = $event;
|
|
392
|
-
}),
|
|
393
|
-
type: "tel"
|
|
394
|
-
}, null, 8, ["modelValue"])])) : createCommentVNode("", true)]);
|
|
326
|
+
}, 8, ["disabled"])])) : createCommentVNode("", true)]);
|
|
395
327
|
}
|
|
396
328
|
|
|
397
|
-
var css_248z = ".fw-table-head--sortable[data-v-
|
|
398
|
-
var stylesheet = ".fw-table-head--sortable[data-v-
|
|
329
|
+
var css_248z = ".fw-table-head--sortable[data-v-b7ffd9d4]:hover{background-color:var(--11c7ec1c)}.fw-table-row[data-v-b7ffd9d4]:hover{background-color:var(--11c7ec1c)}";
|
|
330
|
+
var stylesheet = ".fw-table-head--sortable[data-v-b7ffd9d4]:hover{background-color:var(--11c7ec1c)}.fw-table-row[data-v-b7ffd9d4]:hover{background-color:var(--11c7ec1c)}";
|
|
399
331
|
styleInject(css_248z);
|
|
400
332
|
|
|
401
333
|
__default__.render = render$2;
|
|
402
|
-
__default__.__scopeId = "data-v-
|
|
334
|
+
__default__.__scopeId = "data-v-b7ffd9d4";
|
|
403
335
|
|
|
404
336
|
var script$1 = defineComponent({
|
|
405
337
|
name: 'FwTableHead'
|
package/esm/fw-table.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { _ as FwTable, s as FwTableHead, a as FwTableRow } from './fw-table-row-
|
|
1
|
+
export { _ as FwTable, s as FwTableHead, a as FwTableRow } from './fw-table-row-Cianlk0N.js';
|
|
2
2
|
import './index-svDiDkSU.js';
|
|
3
3
|
import 'vue';
|
|
4
4
|
import './check--YD4Ts6g.js';
|
|
@@ -7,6 +7,3 @@ import './fw-loading-bar-DThRjdw1.js';
|
|
|
7
7
|
import './style-inject.es-tgCJW-Cu.js';
|
|
8
8
|
import './fw-button-DdxvSBFa.js';
|
|
9
9
|
import './fw-loading-spinner-BEzZf1xe.js';
|
|
10
|
-
import './fw-input-BPFFMpc2.js';
|
|
11
|
-
import './vee-validate.esm-3ptvCDR1.js';
|
|
12
|
-
import './uniqueId-DK6xzFd8.js';
|
package/esm/index.js
CHANGED
|
@@ -29,7 +29,7 @@ import { s as script$5 } from './fw-dropdown-BcnKbaW1.js';
|
|
|
29
29
|
import { s as script$2 } from './fw-card-bsYbpPmW.js';
|
|
30
30
|
import { s as script$1 } from './fw-button-DdxvSBFa.js';
|
|
31
31
|
import { _ as __default__$6 } from './fw-tag-508OLlZR.js';
|
|
32
|
-
import { _ as __default__$5, s as script$i, a as script$j } from './fw-table-row-
|
|
32
|
+
import { _ as __default__$5, s as script$i, a as script$j } from './fw-table-row-Cianlk0N.js';
|
|
33
33
|
import { s as script$6 } from './fw-image-DedhILQL.js';
|
|
34
34
|
import { s as script$8 } from './fw-loading-bar-DThRjdw1.js';
|
|
35
35
|
import { s as script$a } from './fw-loading-spinner-BEzZf1xe.js';
|