@leaflink/stash 42.4.4 → 42.5.1

package/dist/DataViewSortButton.js

@@ -1,29 +1,25 @@
 import { defineComponent as g, inject as y, openBlock as r, createBlock as n, withCtx as o, createVNode as i, createTextVNode as d, toDisplayString as l, unref as e, createElementVNode as c, createElementBlock as f, Fragment as w, renderList as D, normalizeClass as k, createCommentVNode as m } from "vue";
 import { t as S } from "./locale.js";
 import u from "./Button.js";
+import "lodash-es/cloneDeep";
 import b from "./Icon.js";
 import "./Paginate.vue_used_vue_type_style_index_0_lang.module-e579235f.js";
 import { D as h } from "./DataView.vue_used_vue_type_style_index_0_lang.module-d878ca9a.js";
 import V from "./Dropdown.js";
 import v from "./IconLabel.js";
 import { _ as B } from "./_plugin-vue_export-helper-dad06003.js";
-import "./get-27d90892.js";
-import "./isObjectLike-54341556.js";
-import "./toString-7d5bf363.js";
-import "./_MapCache-65811284.js";
+import "lodash-es/get";
 import "./Button.vue_used_vue_type_style_index_0_lang.module-b77978d6.js";
-import "./Icon.vue_used_vue_type_style_index_0_lang.module-d2507af3.js";
-import "./uniqueId-847efe53.js";
+import "lodash-es/uniqueId";
 import "./index-79ce320f.js";
+import "./Icon.vue_used_vue_type_style_index_0_lang.module-eb359559.js";
 import "./constants.js";
 import "./clickoutside.js";
 import "./utils/calculateElementOverflow.js";
 import "./utils/helpers.js";
-import "./capitalize-667d9f60.js";
-import "./_createCompounder-ae01a723.js";
-import "./isPlainObject-55c7f916.js";
-import "./_getPrototype-3e6fccd6.js";
-import "./_overArg-6d920d99.js";
+import "lodash-es/camelCase";
+import "lodash-es/isFinite";
+import "lodash-es/isPlainObject";
 const I = {
   class: "dropdown__list",
   "data-test": "stash-data-view-sort-button|sort-menu"
@@ -33,11 +29,11 @@ const I = {
     sortOptions: { default: () => [] }
   },
   setup(C) {
-    const p = C, { currentSortId: a, currentSortOrder: s, updateCurrentSort: _ } = y(
+    const _ = C, { currentSortId: a, currentSortOrder: s, updateCurrentSort: p } = y(
       h.key,
       h.defaults
     );
-    return (T, L) => p.sortOptions.length ? (r(), n(V, {
+    return (T, L) => _.sortOptions.length ? (r(), n(V, {
       key: 0,
       align: "left",
       class: "stash-data-view-sort-button",
@@ -67,12 +63,12 @@ const I = {
       ]),
       default: o(() => [
         c("ul", I, [
-          (r(!0), f(w, null, D(p.sortOptions, (t) => (r(), f(w, {
+          (r(!0), f(w, null, D(_.sortOptions, (t) => (r(), f(w, {
             key: t.id
           }, [
             c("li", {
               class: k(["dropdown__item rounded", { "is-selected": t.id === e(a) && e(s) === "asc" }]),
-              onClick: () => e(_)(t.id, { sortOrder: "asc", shouldEmit: !0 })
+              onClick: () => e(p)(t.id, { sortOrder: "asc", shouldEmit: !0 })
             }, [
               i(u, {
                 inline: "",
@@ -91,7 +87,7 @@ const I = {
             ], 10, E),
             c("li", {
               class: k(["dropdown__item rounded", { "is-selected": t.id === e(a) && e(s) === "desc" }]),
-              onClick: () => e(_)(t.id, { sortOrder: "desc", shouldEmit: !0 })
+              onClick: () => e(p)(t.id, { sortOrder: "desc", shouldEmit: !0 })
             }, [
               i(u, {
                 inline: "",
@@ -115,8 +111,8 @@ const I = {
     })) : m("", !0);
   }
 });
-const nt = /* @__PURE__ */ B(A, [["__scopeId", "data-v-1bb03502"]]);
+const rt = /* @__PURE__ */ B(A, [["__scopeId", "data-v-1bb03502"]]);
 export {
-  nt as default
+  rt as default
 };
 //# sourceMappingURL=DataViewSortButton.js.map

package/dist/DataViewSortButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataViewSortButton.js","sources":["../src/components/DataViewSortButton/DataViewSortButton.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n  import { inject } from 'vue';\n\n  import { t } from '../../locale';\n  import Button from '../Button/Button.vue';\n  import { DATA_VIEW_INJECTION } from '../DataView/DataView.vue';\n  import Dropdown from '../Dropdown/Dropdown.vue';\n  import Icon from '../Icon/Icon.vue';\n  import IconLabel from '../IconLabel/IconLabel.vue';\n  import { SortOption } from './DataViewSortButton.types';\n\n  export interface DataViewToolbarProps {\n    /**\n     * An array of sort options to display in the dropdown.\n     */\n    sortOptions?: SortOption[];\n  }\n\n  const props = withDefaults(defineProps<DataViewToolbarProps>(), {\n    sortOptions: () => [],\n  });\n\n  const { currentSortId, currentSortOrder, updateCurrentSort } = inject(\n    DATA_VIEW_INJECTION.key,\n    DATA_VIEW_INJECTION.defaults,\n  );\n</script>\n\n<template>\n  <Dropdown\n    v-if=\"props.sortOptions.length\"\n    align=\"left\"\n    class=\"stash-data-view-sort-button\"\n    data-test=\"stash-data-view-sort-button\"\n  >\n    <template #toggle=\"{ isActive, toggle }\">\n      <Button\n        icon-label\n        :aria-expanded=\"isActive.toString()\"\n        class=\"tw-text-blue\"\n        data-test=\"stash-data-view-sort-button|sort-menu-button\"\n        @click=\"toggle\"\n      >\n        <IconLabel icon=\"sort\" stacked>\n          {{ t('ll.sort') }}\n        </IconLabel>\n      </Button>\n    </template>\n    <ul class=\"dropdown__list\" data-test=\"stash-data-view-sort-button|sort-menu\">\n      <template v-for=\"sortOption in props.sortOptions\" :key=\"sortOption.id\">\n        <li\n          class=\"dropdown__item rounded\"\n          :class=\"{ 'is-selected': sortOption.id === currentSortId && currentSortOrder === 'asc' }\"\n          @click=\"() => updateCurrentSort(sortOption.id, { sortOrder: 'asc', shouldEmit: true })\"\n        >\n          <Button inline class=\"tw-h-9\">\n            {{ sortOption.labelAsc }}\n            <Icon\n              v-if=\"sortOption.id === currentSortId && currentSortOrder === 'asc'\"\n              name=\"check\"\n              class=\"tw-text-blue tw-ml-auto\"\n            />\n          </Button>\n        </li>\n        <li\n          class=\"dropdown__item rounded\"\n          :class=\"{ 'is-selected': sortOption.id === currentSortId && currentSortOrder === 'desc' }\"\n          @click=\"() => updateCurrentSort(sortOption.id, { sortOrder: 'desc', shouldEmit: true })\"\n        >\n          <Button inline class=\"tw-h-9\">\n            {{ sortOption.labelDesc }}\n            <Icon\n              v-if=\"sortOption.id === currentSortId && currentSortOrder === 'desc'\"\n              name=\"check\"\n              class=\"tw-text-blue tw-ml-auto\"\n            />\n          </Button>\n        </li>\n      </template>\n    </ul>\n  </Dropdown>\n</template>\n\n<style scoped>\n  .dropdown__item > button {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n  }\n</style>\n"],"names":["currentSortId","currentSortOrder","updateCurrentSort","inject","DATA_VIEW_INJECTION"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAsBQ,EAAE,eAAAA,GAAe,kBAAAC,GAAkB,mBAAAC,EAAsB,IAAAC;AAAA,MAC7DC,EAAoB;AAAA,MACpBA,EAAoB;AAAA,IAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"DataViewSortButton.js","sources":["../src/components/DataViewSortButton/DataViewSortButton.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n  import { inject } from 'vue';\n\n  import { t } from '../../locale';\n  import Button from '../Button/Button.vue';\n  import { DATA_VIEW_INJECTION } from '../DataView/DataView.vue';\n  import Dropdown from '../Dropdown/Dropdown.vue';\n  import Icon from '../Icon/Icon.vue';\n  import IconLabel from '../IconLabel/IconLabel.vue';\n  import { SortOption } from './DataViewSortButton.types';\n\n  export interface DataViewToolbarProps {\n    /**\n     * An array of sort options to display in the dropdown.\n     */\n    sortOptions?: SortOption[];\n  }\n\n  const props = withDefaults(defineProps<DataViewToolbarProps>(), {\n    sortOptions: () => [],\n  });\n\n  const { currentSortId, currentSortOrder, updateCurrentSort } = inject(\n    DATA_VIEW_INJECTION.key,\n    DATA_VIEW_INJECTION.defaults,\n  );\n</script>\n\n<template>\n  <Dropdown\n    v-if=\"props.sortOptions.length\"\n    align=\"left\"\n    class=\"stash-data-view-sort-button\"\n    data-test=\"stash-data-view-sort-button\"\n  >\n    <template #toggle=\"{ isActive, toggle }\">\n      <Button\n        icon-label\n        :aria-expanded=\"isActive.toString()\"\n        class=\"tw-text-blue\"\n        data-test=\"stash-data-view-sort-button|sort-menu-button\"\n        @click=\"toggle\"\n      >\n        <IconLabel icon=\"sort\" stacked>\n          {{ t('ll.sort') }}\n        </IconLabel>\n      </Button>\n    </template>\n    <ul class=\"dropdown__list\" data-test=\"stash-data-view-sort-button|sort-menu\">\n      <template v-for=\"sortOption in props.sortOptions\" :key=\"sortOption.id\">\n        <li\n          class=\"dropdown__item rounded\"\n          :class=\"{ 'is-selected': sortOption.id === currentSortId && currentSortOrder === 'asc' }\"\n          @click=\"() => updateCurrentSort(sortOption.id, { sortOrder: 'asc', shouldEmit: true })\"\n        >\n          <Button inline class=\"tw-h-9\">\n            {{ sortOption.labelAsc }}\n            <Icon\n              v-if=\"sortOption.id === currentSortId && currentSortOrder === 'asc'\"\n              name=\"check\"\n              class=\"tw-text-blue tw-ml-auto\"\n            />\n          </Button>\n        </li>\n        <li\n          class=\"dropdown__item rounded\"\n          :class=\"{ 'is-selected': sortOption.id === currentSortId && currentSortOrder === 'desc' }\"\n          @click=\"() => updateCurrentSort(sortOption.id, { sortOrder: 'desc', shouldEmit: true })\"\n        >\n          <Button inline class=\"tw-h-9\">\n            {{ sortOption.labelDesc }}\n            <Icon\n              v-if=\"sortOption.id === currentSortId && currentSortOrder === 'desc'\"\n              name=\"check\"\n              class=\"tw-text-blue tw-ml-auto\"\n            />\n          </Button>\n        </li>\n      </template>\n    </ul>\n  </Dropdown>\n</template>\n\n<style scoped>\n  .dropdown__item > button {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n  }\n</style>\n"],"names":["currentSortId","currentSortOrder","updateCurrentSort","inject","DATA_VIEW_INJECTION"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAsBQ,EAAE,eAAAA,GAAe,kBAAAC,GAAkB,mBAAAC,EAAsB,IAAAC;AAAA,MAC7DC,EAAoB;AAAA,MACpBA,EAAoB;AAAA,IAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/DataViewToolbar.js

@@ -1,18 +1,16 @@
 import { defineComponent as D, useCssModule as N, inject as M, computed as b, openBlock as a, createElementBlock as s, normalizeClass as g, unref as t, createElementVNode as B, renderSlot as I, toDisplayString as T, createCommentVNode as d, Fragment as $, createVNode as r, withCtx as _ } from "vue";
 import { t as z } from "./locale.js";
 import h from "./Button.js";
+import "lodash-es/cloneDeep";
 import x from "./Icon.js";
 import "./Paginate.vue_used_vue_type_style_index_0_lang.module-e579235f.js";
 import { D as y } from "./DataView.vue_used_vue_type_style_index_0_lang.module-d878ca9a.js";
 import { _ as j } from "./_plugin-vue_export-helper-dad06003.js";
-import "./get-27d90892.js";
-import "./isObjectLike-54341556.js";
-import "./toString-7d5bf363.js";
-import "./_MapCache-65811284.js";
+import "lodash-es/get";
 import "./Button.vue_used_vue_type_style_index_0_lang.module-b77978d6.js";
-import "./Icon.vue_used_vue_type_style_index_0_lang.module-d2507af3.js";
-import "./uniqueId-847efe53.js";
+import "lodash-es/uniqueId";
 import "./index-79ce320f.js";
+import "./Icon.vue_used_vue_type_style_index_0_lang.module-eb359559.js";
 const A = {
   key: 0,
   class: "tw-flex tw-items-center"
@@ -29,10 +27,10 @@ const A = {
     const u = C, k = N(), {
       isWithinModule: n,
       variant: m,
-      density: p,
+      density: c,
       currentPage: o,
       isPaginationEnabled: V,
-      pageCount: c,
+      pageCount: p,
       pageSize: w,
       totalDataCount: f,
       goPrevPage: E,
@@ -47,8 +45,8 @@ const A = {
         "tw-rounded": v.value === "rounded",
         "tw-rounded-t": v.value === "rounded-top",
         "tw-mb-3": t(m) !== "table" && !t(n),
-        "tw-px-0": t(p) === "compact",
-        "lg:tw-px-3": t(p) === "comfortable"
+        "tw-px-0": t(c) === "compact",
+        "lg:tw-px-3": t(c) === "comfortable"
       }]),
       "data-test": "stash-data-view-toolbar"
     }, [
@@ -59,7 +57,7 @@ const A = {
       ], 2),
       t(V) ? (a(), s("div", A, [
         u.hidePageStats ? d("", !0) : (a(), s("span", W, T(S.value), 1)),
-        t(c) > 1 ? (a(), s($, { key: 1 }, [
+        t(p) > 1 ? (a(), s($, { key: 1 }, [
           r(h, {
             icon: "",
             class: "tw-h-9 tw-w-9 tw-p-1.5",
@@ -76,7 +74,7 @@ const A = {
             icon: "",
             class: "tw-h-9 tw-w-9 tw-p-1.5",
             "data-test": "button|next-page",
-            disabled: t(o) === t(c),
+            disabled: t(o) === t(p),
             onClick: e[1] || (e[1] = (i) => t(P)({ shouldEmit: !0 }))
           }, {
             default: _(() => [
@@ -92,8 +90,8 @@ const A = {
   "default-slot": "_default-slot_zx9nb_2"
 }, O = {
   $style: J
-}, st = /* @__PURE__ */ j(F, [["__cssModules", O]]);
+}, ot = /* @__PURE__ */ j(F, [["__cssModules", O]]);
 export {
-  st as default
+  ot as default
 };
 //# sourceMappingURL=DataViewToolbar.js.map

package/dist/DataViewToolbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataViewToolbar.js","sources":["../src/components/DataViewToolbar/DataViewToolbar.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { computed, inject, useCssModule } from 'vue';\n\n  import { t } from '../../locale';\n  import Button from '../Button/Button.vue';\n  import { DATA_VIEW_INJECTION } from '../DataView/DataView.vue';\n  import Icon from '../Icon/Icon.vue';\n  import { ToolbarRadiuses } from './DataViewToolbar.types';\n\n  export interface DataViewToolbarProps {\n    /**\n     * Hides the page statistics (ex: \"1 - 12 of 20\") in the toolbar\n     */\n    hidePageStats?: boolean;\n\n    /**\n     * Controls the corners of DataViewToolbar with the \"border-radius\" CSS property. The default value is \"rounded\".\n     */\n    radius?: ToolbarRadiuses;\n  }\n\n  const props = withDefaults(defineProps<DataViewToolbarProps>(), {\n    hidePageStats: false,\n    radius: 'rounded',\n  });\n  const classes = useCssModule();\n\n  const {\n    isWithinModule,\n    variant: dataViewVariant,\n    density,\n    currentPage,\n    isPaginationEnabled,\n    pageCount,\n    pageSize,\n    totalDataCount,\n    goPrevPage,\n    goNextPage,\n  } = inject(DATA_VIEW_INJECTION.key, DATA_VIEW_INJECTION.defaults);\n\n  const computedRadius = computed<ToolbarRadiuses>(() => {\n    if (isWithinModule.value) {\n      return 'none';\n    }\n\n    if (dataViewVariant.value === 'table') {\n      return 'rounded-top';\n    }\n\n    return props.radius;\n  });\n\n  // #region pagination\n  const pageStats = computed(() => {\n    const from = pageSize.value * (currentPage.value - 1) + 1;\n    const to = Math.min(pageSize.value * currentPage.value, totalDataCount.value);\n    const total = totalDataCount.value;\n\n    return t('ll.pageStats', { from, to, total });\n  });\n  // #endregion pagination\n</script>\n\n<template>\n  <div\n    class=\"stash-data-view-toolbar tw-flex tw-justify-between tw-items-center tw-bg-white tw-py-1.5 tw-min-h-[3.75rem]\"\n    :class=\"{\n      'tw-border-t tw-border-ice-200': isWithinModule,\n      'tw-rounded': computedRadius === 'rounded',\n      'tw-rounded-t': computedRadius === 'rounded-top',\n      'tw-mb-3': dataViewVariant !== 'table' && !isWithinModule,\n      'tw-px-0': density === 'compact',\n      'lg:tw-px-3': density === 'comfortable',\n    }\"\n    data-test=\"stash-data-view-toolbar\"\n  >\n    <div class=\"tw-flex tw-items-center\" :class=\"classes['default-slot']\">\n      <!-- @slot default -->\n      <slot></slot>\n    </div>\n\n    <!-- Pagination -->\n    <div v-if=\"isPaginationEnabled\" class=\"tw-flex tw-items-center\">\n      <span v-if=\"!props.hidePageStats\" class=\"tw-text-xs tw-mr-1.5\">\n        {{ pageStats }}\n      </span>\n      <template v-if=\"pageCount > 1\">\n        <Button\n          icon\n          class=\"tw-h-9 tw-w-9 tw-p-1.5\"\n          data-test=\"button|prev-page\"\n          :disabled=\"currentPage === 1\"\n          @click=\"goPrevPage({ shouldEmit: true })\"\n        >\n          <Icon name=\"chevron-left\" />\n        </Button>\n        <Button\n          icon\n          class=\"tw-h-9 tw-w-9 tw-p-1.5\"\n          data-test=\"button|next-page\"\n          :disabled=\"currentPage === pageCount\"\n          @click=\"goNextPage({ shouldEmit: true })\"\n        >\n          <Icon name=\"chevron-right\" />\n        </Button>\n      </template>\n    </div>\n  </div>\n</template>\n\n<style module>\n  .default-slot > *:not(:last-of-type) {\n    margin-right: 0.5rem;\n  }\n</style>\n"],"names":["classes","useCssModule","isWithinModule","dataViewVariant","density","currentPage","isPaginationEnabled","pageCount","pageSize","totalDataCount","goPrevPage","goNextPage","inject","DATA_VIEW_INJECTION","computedRadius","computed","props","pageStats","from","to","total","t"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAyBQA,IAAUC,KAEV;AAAA,MACJ,gBAAAC;AAAA,MACA,SAASC;AAAA,MACT,SAAAC;AAAA,MACA,aAAAC;AAAA,MACA,qBAAAC;AAAA,MACA,WAAAC;AAAA,MACA,UAAAC;AAAA,MACA,gBAAAC;AAAA,MACA,YAAAC;AAAA,MACA,YAAAC;AAAA,IACE,IAAAC,EAAOC,EAAoB,KAAKA,EAAoB,QAAQ,GAE1DC,IAAiBC,EAA0B,MAC3Cb,EAAe,QACV,SAGLC,EAAgB,UAAU,UACrB,gBAGFa,EAAM,MACd,GAGKC,IAAYF,EAAS,MAAM;AAC/B,YAAMG,IAAOV,EAAS,SAASH,EAAY,QAAQ,KAAK,GAClDc,IAAK,KAAK,IAAIX,EAAS,QAAQH,EAAY,OAAOI,EAAe,KAAK,GACtEW,IAAQX,EAAe;AAE7B,aAAOY,EAAE,gBAAgB,EAAE,MAAAH,GAAM,IAAAC,GAAI,OAAAC,GAAO;AAAA,IAAA,CAC7C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"DataViewToolbar.js","sources":["../src/components/DataViewToolbar/DataViewToolbar.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { computed, inject, useCssModule } from 'vue';\n\n  import { t } from '../../locale';\n  import Button from '../Button/Button.vue';\n  import { DATA_VIEW_INJECTION } from '../DataView/DataView.vue';\n  import Icon from '../Icon/Icon.vue';\n  import { ToolbarRadiuses } from './DataViewToolbar.types';\n\n  export interface DataViewToolbarProps {\n    /**\n     * Hides the page statistics (ex: \"1 - 12 of 20\") in the toolbar\n     */\n    hidePageStats?: boolean;\n\n    /**\n     * Controls the corners of DataViewToolbar with the \"border-radius\" CSS property. The default value is \"rounded\".\n     */\n    radius?: ToolbarRadiuses;\n  }\n\n  const props = withDefaults(defineProps<DataViewToolbarProps>(), {\n    hidePageStats: false,\n    radius: 'rounded',\n  });\n  const classes = useCssModule();\n\n  const {\n    isWithinModule,\n    variant: dataViewVariant,\n    density,\n    currentPage,\n    isPaginationEnabled,\n    pageCount,\n    pageSize,\n    totalDataCount,\n    goPrevPage,\n    goNextPage,\n  } = inject(DATA_VIEW_INJECTION.key, DATA_VIEW_INJECTION.defaults);\n\n  const computedRadius = computed<ToolbarRadiuses>(() => {\n    if (isWithinModule.value) {\n      return 'none';\n    }\n\n    if (dataViewVariant.value === 'table') {\n      return 'rounded-top';\n    }\n\n    return props.radius;\n  });\n\n  // #region pagination\n  const pageStats = computed(() => {\n    const from = pageSize.value * (currentPage.value - 1) + 1;\n    const to = Math.min(pageSize.value * currentPage.value, totalDataCount.value);\n    const total = totalDataCount.value;\n\n    return t('ll.pageStats', { from, to, total });\n  });\n  // #endregion pagination\n</script>\n\n<template>\n  <div\n    class=\"stash-data-view-toolbar tw-flex tw-justify-between tw-items-center tw-bg-white tw-py-1.5 tw-min-h-[3.75rem]\"\n    :class=\"{\n      'tw-border-t tw-border-ice-200': isWithinModule,\n      'tw-rounded': computedRadius === 'rounded',\n      'tw-rounded-t': computedRadius === 'rounded-top',\n      'tw-mb-3': dataViewVariant !== 'table' && !isWithinModule,\n      'tw-px-0': density === 'compact',\n      'lg:tw-px-3': density === 'comfortable',\n    }\"\n    data-test=\"stash-data-view-toolbar\"\n  >\n    <div class=\"tw-flex tw-items-center\" :class=\"classes['default-slot']\">\n      <!-- @slot default -->\n      <slot></slot>\n    </div>\n\n    <!-- Pagination -->\n    <div v-if=\"isPaginationEnabled\" class=\"tw-flex tw-items-center\">\n      <span v-if=\"!props.hidePageStats\" class=\"tw-text-xs tw-mr-1.5\">\n        {{ pageStats }}\n      </span>\n      <template v-if=\"pageCount > 1\">\n        <Button\n          icon\n          class=\"tw-h-9 tw-w-9 tw-p-1.5\"\n          data-test=\"button|prev-page\"\n          :disabled=\"currentPage === 1\"\n          @click=\"goPrevPage({ shouldEmit: true })\"\n        >\n          <Icon name=\"chevron-left\" />\n        </Button>\n        <Button\n          icon\n          class=\"tw-h-9 tw-w-9 tw-p-1.5\"\n          data-test=\"button|next-page\"\n          :disabled=\"currentPage === pageCount\"\n          @click=\"goNextPage({ shouldEmit: true })\"\n        >\n          <Icon name=\"chevron-right\" />\n        </Button>\n      </template>\n    </div>\n  </div>\n</template>\n\n<style module>\n  .default-slot > *:not(:last-of-type) {\n    margin-right: 0.5rem;\n  }\n</style>\n"],"names":["classes","useCssModule","isWithinModule","dataViewVariant","density","currentPage","isPaginationEnabled","pageCount","pageSize","totalDataCount","goPrevPage","goNextPage","inject","DATA_VIEW_INJECTION","computedRadius","computed","props","pageStats","from","to","total","t"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;iBAyBQA,IAAUC,KAEV;AAAA,MACJ,gBAAAC;AAAA,MACA,SAASC;AAAA,MACT,SAAAC;AAAA,MACA,aAAAC;AAAA,MACA,qBAAAC;AAAA,MACA,WAAAC;AAAA,MACA,UAAAC;AAAA,MACA,gBAAAC;AAAA,MACA,YAAAC;AAAA,MACA,YAAAC;AAAA,IACE,IAAAC,EAAOC,EAAoB,KAAKA,EAAoB,QAAQ,GAE1DC,IAAiBC,EAA0B,MAC3Cb,EAAe,QACV,SAGLC,EAAgB,UAAU,UACrB,gBAGFa,EAAM,MACd,GAGKC,IAAYF,EAAS,MAAM;AAC/B,YAAMG,IAAOV,EAAS,SAASH,EAAY,QAAQ,KAAK,GAClDc,IAAK,KAAK,IAAIX,EAAS,QAAQH,EAAY,OAAOI,EAAe,KAAK,GACtEW,IAAQX,EAAe;AAE7B,aAAOY,EAAE,gBAAgB,EAAE,MAAAH,GAAM,IAAAC,GAAI,OAAAC,GAAO;AAAA,IAAA,CAC7C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}