@robuust-digital/vue-components 3.1.0 → 3.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/CHANGELOG.md CHANGED
@@ -1,3 +1,9 @@
1
+ ## 3.1.1 (07-07-2026)
2
+
3
+ ### Fixed
4
+
5
+ * `Pagination`: Align pagination info left and navigation right when `showPerPage` is disabled
6
+
1
7
  ## 3.1.0 (07-07-2026)
2
8
 
3
9
  ### Added
@@ -274,10 +274,7 @@ var q = ["value", "disabled"], J = ["value", "disabled"], Y = /* @__PURE__ */ p(
274
274
  S(n.$slots, "icon", { icon: e.icon }, () => [(y(), s(C(e.icon ?? T(t)), { "aria-hidden": "true" }))])
275
275
  ], 2));
276
276
  }
277
- }), X = {
278
- key: 0,
279
- class: "rvc-pagination"
280
- }, Z = ["value"], re = { class: "rvc-pagination-info" }, ie = { class: "rvc-pagination-nav-list" }, ae = ["disabled", "onClick"], oe = { key: 2 }, se = { key: 3 }, Q = /* @__PURE__ */ p({
277
+ }), X = ["value"], Z = { class: "rvc-pagination-info" }, re = { class: "rvc-pagination-nav-list" }, ie = ["disabled", "onClick"], ae = { key: 2 }, oe = { key: 3 }, Q = /* @__PURE__ */ p({
281
278
  __name: "Pagination",
282
279
  props: {
283
280
  pagination: {},
@@ -316,7 +313,10 @@ var q = ["value", "disabled"], J = ["value", "disabled"], Y = /* @__PURE__ */ p(
316
313
  get: () => n.perPage,
317
314
  set: (e) => r("pagination:perPage", Number(e))
318
315
  });
319
- return (t, n) => e.pagination?.total ? (y(), l("div", X, [
316
+ return (t, n) => e.pagination?.total ? (y(), l("div", {
317
+ key: 0,
318
+ class: g(["rvc-pagination", { "rvc-pagination-without-per-page": !e.showPerPage }])
319
+ }, [
320
320
  e.showPerPage ? S(t.$slots, "perPage", h({ key: 0 }, e.pagination, { perPage: i.value }), () => [f(Y, {
321
321
  modelValue: i.value,
322
322
  "onUpdate:modelValue": n[0] ||= (e) => i.value = e,
@@ -326,11 +326,11 @@ var q = ["value", "disabled"], J = ["value", "disabled"], Y = /* @__PURE__ */ p(
326
326
  default: A(() => [(y(!0), l(a, null, x(e.perPageOptions, (t) => (y(), l("option", {
327
327
  key: `pagination-items-per-page-option-${t}`,
328
328
  value: t
329
- }, w(t) + " " + w(e.perPageLabel), 9, Z))), 128))]),
329
+ }, w(t) + " " + w(e.perPageLabel), 9, X))), 128))]),
330
330
  _: 1
331
331
  }, 8, ["modelValue"])]) : c("", !0),
332
- S(t.$slots, "info", h(e.pagination, { fromLabel: e.fromLabel }), () => [u("div", re, w(e.pagination.from) + " - " + w(e.pagination.to) + " " + w(e.fromLabel) + " " + w(e.pagination.total), 1)]),
333
- u("nav", null, [u("ol", ie, [(y(!0), l(a, null, x(e.pagination.links, (n, i) => (y(), l("li", {
332
+ S(t.$slots, "info", h(e.pagination, { fromLabel: e.fromLabel }), () => [u("div", Z, w(e.pagination.from) + " - " + w(e.pagination.to) + " " + w(e.fromLabel) + " " + w(e.pagination.total), 1)]),
333
+ u("nav", null, [u("ol", re, [(y(!0), l(a, null, x(e.pagination.links, (n, i) => (y(), l("li", {
334
334
  key: `pagination-link-${n.label}-${i}`,
335
335
  class: "rvc-pagination-nav-list-item"
336
336
  }, [u("button", {
@@ -354,10 +354,10 @@ var q = ["value", "disabled"], J = ["value", "disabled"], Y = /* @__PURE__ */ p(
354
354
  }, () => [(y(), s(C(e.nextIcon || T(ne)), {
355
355
  "aria-hidden": "true",
356
356
  class: g(["rvc-pagination-button-icon", { "rvc-pagination-button-icon-disabled": !n.url }])
357
- }, null, 8, ["class"]))]) : n.label === "..." ? (y(), l("span", oe, " ... ")) : (y(), l("span", se, w(n.label), 1))], 10, ae)]))), 128))])])
358
- ])) : c("", !0);
357
+ }, null, 8, ["class"]))]) : n.label === "..." ? (y(), l("span", ae, " ... ")) : (y(), l("span", oe, w(n.label), 1))], 10, ie)]))), 128))])])
358
+ ], 2)) : c("", !0);
359
359
  }
360
- }), ce = { key: 0 }, le = ["aria-label", "onClick"], ue = ["innerHTML"], de = { key: 2 }, fe = ["colspan"], pe = { key: 3 }, me = ["colspan"], he = { class: "rvc-table-spinner-wrapper" }, ge = { key: 4 }, _e = /* @__PURE__ */ p({
360
+ }), se = { key: 0 }, ce = ["aria-label", "onClick"], le = ["innerHTML"], ue = { key: 2 }, de = ["colspan"], fe = { key: 3 }, pe = ["colspan"], me = { class: "rvc-table-spinner-wrapper" }, he = { key: 4 }, ge = /* @__PURE__ */ p({
361
361
  __name: "DataTable",
362
362
  props: {
363
363
  headers: { default: () => [] },
@@ -420,7 +420,7 @@ var q = ["value", "disabled"], J = ["value", "disabled"], Y = /* @__PURE__ */ p(
420
420
  } : o.value = null, i("table:sortBy", o.value));
421
421
  };
422
422
  return (t, r) => (y(), l("div", null, [u("div", { class: g(["rvc-table-wrapper", e.wrapperClass]) }, [u("table", { class: g([{ "rvc-table-striped": e.striped }, "rvc-table"]) }, [
423
- e.headers.length ? (y(), l("thead", ce, [S(t.$slots, "headers", { headers: e.headers }, () => [u("tr", null, [(y(!0), l(a, null, x(e.headers, (e, n) => S(t.$slots, "header", {
423
+ e.headers.length ? (y(), l("thead", se, [S(t.$slots, "headers", { headers: e.headers }, () => [u("tr", null, [(y(!0), l(a, null, x(e.headers, (e, n) => S(t.$slots, "header", {
424
424
  header: e,
425
425
  index: n
426
426
  }, () => [(y(), l("th", h({ ref_for: !0 }, {
@@ -449,7 +449,7 @@ var q = ["value", "disabled"], J = ["value", "disabled"], Y = /* @__PURE__ */ p(
449
449
  "rvc-table-sort-icon-visible": o.value?.key === e.key,
450
450
  "rvc-table-sort-icon-invisible": !o.value || o.value.key !== e.key,
451
451
  "rvc-table-sort-icon-rotated": o.value?.key === e.key && o.value.direction === "desc"
452
- }]) }, null, 8, ["class"])], 10, le)) : S(t.$slots, "header-label", {
452
+ }]) }, null, 8, ["class"])], 10, ce)) : S(t.$slots, "header-label", {
453
453
  key: 1,
454
454
  sortBy: o.value,
455
455
  header: e
@@ -470,21 +470,21 @@ var q = ["value", "disabled"], J = ["value", "disabled"], Y = /* @__PURE__ */ p(
470
470
  "rvc-table-text-right": p(String(r))?.align === "right"
471
471
  },
472
472
  innerHTML: t
473
- }), null, 16, ue))), 128))])]))])), 256))])]) : !e.items.length && !e.spinning ? (y(), l("tbody", de, [u("tr", null, [u("td", {
473
+ }), null, 16, le))), 128))])]))])), 256))])]) : !e.items.length && !e.spinning ? (y(), l("tbody", ue, [u("tr", null, [u("td", {
474
474
  colspan: e.headers.length,
475
475
  class: "rvc-table-state"
476
- }, [u("p", null, w(e.noResultsText), 1)], 8, fe)])])) : (y(), l("tbody", pe, [u("tr", null, [u("td", {
476
+ }, [u("p", null, w(e.noResultsText), 1)], 8, de)])])) : (y(), l("tbody", fe, [u("tr", null, [u("td", {
477
477
  colspan: e.headers.length,
478
478
  class: "rvc-table-state"
479
479
  }, [S(t.$slots, "spinner", {
480
480
  spinning: e.spinning,
481
481
  label: e.loadingText
482
- }, () => [u("div", he, [e.spinning ? (y(), s(T(n), {
482
+ }, () => [u("div", me, [e.spinning ? (y(), s(T(n), {
483
483
  key: 0,
484
484
  "aria-hidden": "true",
485
485
  class: "rvc-table-spinner"
486
- })) : c("", !0), d(" " + w(e.loadingText), 1)])])], 8, me)])])),
487
- t.$slots.footer ? (y(), l("tfoot", ge, [S(t.$slots, "footer", {
486
+ })) : c("", !0), d(" " + w(e.loadingText), 1)])])], 8, pe)])])),
487
+ t.$slots.footer ? (y(), l("tfoot", he, [S(t.$slots, "footer", {
488
488
  headers: e.headers,
489
489
  items: e.items
490
490
  })])) : c("", !0)
@@ -510,10 +510,10 @@ var q = ["value", "disabled"], J = ["value", "disabled"], Y = /* @__PURE__ */ p(
510
510
  "next-icon"
511
511
  ])]) : c("", !0)]));
512
512
  }
513
- }), ve = {
513
+ }), _e = {
514
514
  key: 1,
515
515
  class: "rvc-empty-state-title"
516
- }, ye = /* @__PURE__ */ p({
516
+ }, ve = /* @__PURE__ */ p({
517
517
  __name: "EmptyState",
518
518
  props: {
519
519
  title: {},
@@ -530,32 +530,32 @@ var q = ["value", "disabled"], J = ["value", "disabled"], Y = /* @__PURE__ */ p(
530
530
  key: 0,
531
531
  class: "rvc-empty-state-icon"
532
532
  })) : c("", !0),
533
- e.title ? (y(), l("p", ve, w(e.title), 1)) : c("", !0),
533
+ e.title ? (y(), l("p", _e, w(e.title), 1)) : c("", !0),
534
534
  S(t.$slots, "default")
535
535
  ], 2));
536
536
  }
537
- }), be = { class: "rvc-file-upload-control" }, xe = [
537
+ }), ye = { class: "rvc-file-upload-control" }, be = [
538
538
  "accept",
539
539
  "multiple",
540
540
  "disabled"
541
- ], Se = ["disabled"], Ce = {
541
+ ], xe = ["disabled"], Se = {
542
542
  key: 0,
543
543
  class: "rvc-file-upload-label"
544
- }, we = {
544
+ }, Ce = {
545
545
  key: 1,
546
546
  class: "rvc-file-upload-description"
547
- }, Te = { class: "rvc-file-upload-list" }, Ee = ["src", "alt"], De = ["href"], Oe = {
547
+ }, we = { class: "rvc-file-upload-list" }, Te = ["src", "alt"], Ee = ["href"], De = {
548
548
  key: 2,
549
549
  class: "rvc-file-upload-file"
550
- }, $ = [
550
+ }, Oe = [
551
551
  "disabled",
552
552
  "aria-label",
553
553
  "onClick"
554
- ], ke = ["src", "alt"], Ae = { class: "rvc-file-upload-file" }, je = [
554
+ ], $ = ["src", "alt"], ke = { class: "rvc-file-upload-file" }, Ae = [
555
555
  "disabled",
556
556
  "aria-label",
557
557
  "onClick"
558
- ], Me = /* @__PURE__ */ p({
558
+ ], je = /* @__PURE__ */ p({
559
559
  inheritAttrs: !1,
560
560
  __name: "FileUpload",
561
561
  props: {
@@ -646,7 +646,7 @@ var q = ["value", "disabled"], J = ["value", "disabled"], Y = /* @__PURE__ */ p(
646
646
  "rvc-file-upload-disabled": e.disabled
647
647
  },
648
648
  e.rootClass
649
- ]) }, [u("div", be, [u("input", h(T(D), {
649
+ ]) }, [u("div", ye, [u("input", h(T(D), {
650
650
  ref_key: "input",
651
651
  ref: d,
652
652
  class: "rvc-file-upload-input",
@@ -655,7 +655,7 @@ var q = ["value", "disabled"], J = ["value", "disabled"], Y = /* @__PURE__ */ p(
655
655
  multiple: e.multiple,
656
656
  disabled: e.disabled,
657
657
  onChange: F
658
- }), null, 16, xe), e.variant === "area" ? (y(), l("button", {
658
+ }), null, 16, be), e.variant === "area" ? (y(), l("button", {
659
659
  key: 0,
660
660
  class: "rvc-file-upload-area rvc-file-upload-trigger",
661
661
  type: "button",
@@ -672,9 +672,9 @@ var q = ["value", "disabled"], J = ["value", "disabled"], Y = /* @__PURE__ */ p(
672
672
  class: "rvc-file-upload-icon",
673
673
  "aria-hidden": "true"
674
674
  }))]),
675
- e.label ? (y(), l("span", Ce, w(e.label), 1)) : c("", !0),
676
- e.description ? (y(), l("span", we, w(e.description), 1)) : c("", !0)
677
- ], 40, Se)) : (y(), s(r, {
675
+ e.label ? (y(), l("span", Se, w(e.label), 1)) : c("", !0),
676
+ e.description ? (y(), l("span", Ce, w(e.description), 1)) : c("", !0)
677
+ ], 40, xe)) : (y(), s(r, {
678
678
  key: 1,
679
679
  class: "rvc-file-upload-trigger",
680
680
  label: e.buttonLabel,
@@ -706,7 +706,7 @@ var q = ["value", "disabled"], J = ["value", "disabled"], Y = /* @__PURE__ */ p(
706
706
  existingFiles: e.existingFiles,
707
707
  removeFile: W,
708
708
  removeExistingFile: K
709
- }, () => [u("ul", Te, [(y(!0), l(a, null, x(e.existingFiles, (t) => (y(), l("li", {
709
+ }, () => [u("ul", we, [(y(!0), l(a, null, x(e.existingFiles, (t) => (y(), l("li", {
710
710
  key: `existing-${t.id}`,
711
711
  class: "rvc-file-upload-item"
712
712
  }, [
@@ -715,19 +715,19 @@ var q = ["value", "disabled"], J = ["value", "disabled"], Y = /* @__PURE__ */ p(
715
715
  class: "rvc-file-upload-thumbnail",
716
716
  src: R(t),
717
717
  alt: t.name
718
- }, null, 8, Ee)) : c("", !0),
718
+ }, null, 8, Te)) : c("", !0),
719
719
  t.url ? (y(), l("a", {
720
720
  key: 1,
721
721
  class: "rvc-file-upload-file",
722
722
  href: t.url
723
- }, w(t.name), 9, De)) : (y(), l("span", Oe, w(t.name), 1)),
723
+ }, w(t.name), 9, Ee)) : (y(), l("span", De, w(t.name), 1)),
724
724
  u("button", {
725
725
  class: "rvc-file-upload-remove",
726
726
  type: "button",
727
727
  disabled: e.disabled,
728
728
  "aria-label": `Remove ${t.name}`,
729
729
  onClick: (e) => K(t)
730
- }, [f(T(G), { "aria-hidden": "true" })], 8, $)
730
+ }, [f(T(G), { "aria-hidden": "true" })], 8, Oe)
731
731
  ]))), 128)), (y(!0), l(a, null, x(k.value, (t, n) => (y(), l("li", {
732
732
  key: `${t.name}-${t.lastModified}-${n}`,
733
733
  class: "rvc-file-upload-item"
@@ -737,18 +737,18 @@ var q = ["value", "disabled"], J = ["value", "disabled"], Y = /* @__PURE__ */ p(
737
737
  class: "rvc-file-upload-thumbnail",
738
738
  src: _.value.get(t),
739
739
  alt: t.name
740
- }, null, 8, ke)) : c("", !0),
741
- u("span", Ae, w(t.name), 1),
740
+ }, null, 8, $)) : c("", !0),
741
+ u("span", ke, w(t.name), 1),
742
742
  u("button", {
743
743
  class: "rvc-file-upload-remove",
744
744
  type: "button",
745
745
  disabled: e.disabled,
746
746
  "aria-label": `Remove ${t.name}`,
747
747
  onClick: (e) => W(n)
748
- }, [f(T(G), { "aria-hidden": "true" })], 8, je)
748
+ }, [f(T(G), { "aria-hidden": "true" })], 8, Ae)
749
749
  ]))), 128))])]) : c("", !0)], 2));
750
750
  }
751
- }), Ne = /* @__PURE__ */ p({
751
+ }), Me = /* @__PURE__ */ p({
752
752
  __name: "FormTextarea",
753
753
  props: {
754
754
  modelValue: { default: void 0 },
@@ -773,7 +773,7 @@ var q = ["value", "disabled"], J = ["value", "disabled"], Y = /* @__PURE__ */ p(
773
773
  class: g(u.value)
774
774
  }, null, 2));
775
775
  }
776
- }), Pe = { class: "rvc-radio-input" }, Fe = { class: "rvc-radio-label" }, Ie = /* @__PURE__ */ p({
776
+ }), Ne = { class: "rvc-radio-input" }, Pe = { class: "rvc-radio-label" }, Fe = /* @__PURE__ */ p({
777
777
  inheritAttrs: !1,
778
778
  __name: "Radio",
779
779
  props: {
@@ -800,16 +800,16 @@ var q = ["value", "disabled"], J = ["value", "disabled"], Y = /* @__PURE__ */ p(
800
800
  ...c,
801
801
  type: "radio"
802
802
  })), f = b(null);
803
- return (t, n) => (y(), l("label", { class: g(["rvc-radio", e.rootClass]) }, [u("div", Pe, [T(s) ? j((y(), l("input", h({ key: 0 }, d.value, {
803
+ return (t, n) => (y(), l("label", { class: g(["rvc-radio", e.rootClass]) }, [u("div", Ne, [T(s) ? j((y(), l("input", h({ key: 0 }, d.value, {
804
804
  ref_key: "input",
805
805
  ref: f,
806
806
  "onUpdate:modelValue": n[0] ||= (e) => a.value = e
807
807
  }), null, 16)), [[D, a.value]]) : (y(), l("input", h({ key: 1 }, d.value, {
808
808
  ref_key: "input",
809
809
  ref: f
810
- }), null, 16))]), S(t.$slots, "default", {}, () => [u("span", Fe, w(e.label), 1)])], 2));
810
+ }), null, 16))]), S(t.$slots, "default", {}, () => [u("span", Pe, w(e.label), 1)])], 2));
811
811
  }
812
- }), Le = { class: "rvc-tabs-nav" }, Re = ["value", "selected"], ze = /* @__PURE__ */ p({
812
+ }), Ie = { class: "rvc-tabs-nav" }, Le = ["value", "selected"], Re = /* @__PURE__ */ p({
813
813
  inheritAttrs: !1,
814
814
  __name: "Tabs",
815
815
  props: {
@@ -837,7 +837,7 @@ var q = ["value", "disabled"], J = ["value", "disabled"], Y = /* @__PURE__ */ p(
837
837
  let { active: t, as: n, bindAs: r, selectEvent: i, name: a, ...o } = e;
838
838
  return o;
839
839
  };
840
- return (t, n) => (y(), l(a, null, [u("div", h(t.$attrs, { class: ["rvc-tabs", { "rvc-tabs-buttons": e.tabStyle === "buttons" }] }), [u("nav", Le, [(y(!0), l(a, null, x(e.tabs, (e, t) => (y(), s(C(e.as ? e.as : "button"), h({ ref_for: !0 }, m(e), {
840
+ return (t, n) => (y(), l(a, null, [u("div", h(t.$attrs, { class: ["rvc-tabs", { "rvc-tabs-buttons": e.tabStyle === "buttons" }] }), [u("nav", Ie, [(y(!0), l(a, null, x(e.tabs, (e, t) => (y(), s(C(e.as ? e.as : "button"), h({ ref_for: !0 }, m(e), {
841
841
  key: `${t}-tab-item`,
842
842
  as: e.bindAs ? e.bindAs : void 0,
843
843
  class: ["rvc-tab", { "rvc-tab-active": c.value === t }],
@@ -858,10 +858,10 @@ var q = ["value", "disabled"], J = ["value", "disabled"], Y = /* @__PURE__ */ p(
858
858
  key: `${t}-tab-item-select-option`,
859
859
  value: t,
860
860
  selected: c.value === t
861
- }, w(e.name), 9, Re))), 128))]),
861
+ }, w(e.name), 9, Le))), 128))]),
862
862
  _: 1
863
863
  }, 16, ["value"])], 64));
864
864
  }
865
865
  });
866
866
  //#endregion
867
- export { ye as a, Y as c, R as d, Me as i, U as l, Ie as n, _e as o, Ne as r, Q as s, ze as t, B as u };
867
+ export { ve as a, Y as c, R as d, je as i, U as l, Fe as n, ge as o, Me as r, Q as s, Re as t, B as u };
@@ -1,4 +1,4 @@
1
- import { a as e, c as t, d as n, i as r, l as i, n as a, o, r as s, s as c, t as l, u } from "../_shared/core-1e7ogP-S.js";
1
+ import { a as e, c as t, d as n, i as r, l as i, n as a, o, r as s, s as c, t as l, u } from "../_shared/core-s0W4Pxm0.js";
2
2
  import { n as d } from "../_shared/ChevronDownIcon-Y_yqpwON.js";
3
3
  import { t as f } from "../_shared/ButtonBase-DyeIkb-l.js";
4
4
  import { t as p } from "../_shared/FormInput-k0vAk3VU.js";
@@ -22,12 +22,13 @@
22
22
  @layer components {
23
23
  .rvc-pagination {
24
24
  display: grid;
25
- grid-template-columns: repeat(2, minmax(0, 1fr));
25
+ grid-template-columns: minmax(0, 1fr) auto;
26
26
  align-items: center;
27
- justify-content: space-between;
28
27
 
29
28
  @media (width >= theme(--breakpoint-md)) {
30
- grid-template-columns: repeat(3, minmax(0, 1fr));
29
+ &:not(.rvc-pagination-without-per-page) {
30
+ grid-template-columns: repeat(3, minmax(0, 1fr));
31
+ }
31
32
  }
32
33
 
33
34
  .rvc-pagination-per-page {
@@ -67,6 +68,12 @@
67
68
 
68
69
  @media (width >= theme(--breakpoint-md)) {
69
70
  display: flex;
71
+ justify-content: flex-start;
72
+ }
73
+ }
74
+
75
+ &:not(.rvc-pagination-without-per-page) .rvc-pagination-info {
76
+ @media (width >= theme(--breakpoint-md)) {
70
77
  justify-content: center;
71
78
  }
72
79
  }
@@ -1,4 +1,4 @@
1
- import { a as e, c as t, d as n, i as r, l as i, n as a, o, r as s, s as c, t as l, u } from "../_shared/core-1e7ogP-S.js";
1
+ import { a as e, c as t, d as n, i as r, l as i, n as a, o, r as s, s as c, t as l, u } from "../_shared/core-s0W4Pxm0.js";
2
2
  import { n as d } from "../_shared/ChevronDownIcon-Y_yqpwON.js";
3
3
  import { t as f } from "../_shared/ButtonBase-DyeIkb-l.js";
4
4
  import { t as p } from "../_shared/FormInput-k0vAk3VU.js";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@robuust-digital/vue-components",
3
- "version": "3.1.0",
3
+ "version": "3.1.1",
4
4
  "type": "module",
5
5
  "publishConfig": {
6
6
  "access": "public"