npm - admins-components - Versions diffs - 9.0.13 → 9.0.14 - Mend

admins-components 9.0.13 → 9.0.14

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.

Files changed (71) hide show

package/dist/admins-components62.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"admins-components62.js","names":[],"sources":["../src/components/data-table/DataCards.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { DataListConfig, DataCardsSettings, DataListSettings } from '@/types/data-list'\nimport DataCell from './DataCell.vue'\nexport { dataCardsSettingsDefaults } from '@/types/data-list'\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, ref, watch } from 'vue'\nimport Button from '@/components/Button.vue'\nimport CopyToClipboard from '@/components/CopyToClipboard.vue'\nimport Loader from '@/components/Loader.vue'\nimport { useSelection } from '@/composables/useSelection'\nimport { dataCardsSettingsDefaults } from '@/types/data-list'\nimport DropdownMenu from '@/components/DropdownMenu.vue'\nimport { getColumnValue } from '@/utils/dataList'\nimport { buildActionGroupMenuItems, isActionGroup } from '@/utils/dataList'\n\nconst props = withDefaults(\n defineProps<{\n config: DataListConfig\n items: Record<string, unknown>[]\n settings?: DataCardsSettings \| DataListSettings\n loading?: boolean\n }>(),\n {\n settings: () => ({ ...dataCardsSettingsDefaults }),\n loading: false,\n },\n)\n\nconst emit = defineEmits<{\n 'selection-change': [selected: unknown[]]\n}>()\n\nconst { selectedKeys, toggle: toggleRow } = useSelection(\n () => props.items,\n () => props.config.selectableAttr,\n (s) => emit('selection-change', s),\n)\n\nconst openRowIndexes = ref<Set<number>>(new Set())\n\nwatch(\n () => props.items,\n () => {\n openRowIndexes.value = new Set()\n },\n)\n\nconst visibleColumns = computed(() => props.config.columns.filter((c) => c.visible !== false))\n\nconst cardHeaderColumns = computed(() => {\n const s = props.settings as any\n if (s?.cardHeaderColumns) {\n const cols = visibleColumns.value.filter((c) => s.cardHeaderColumns[c.property])\n if (cols.length > 0) {\n if (s.cardHeaderOrder) {\n const order = s.cardHeaderOrder as string[]\n return [...cols].sort((a, b) => {\n const ai = order.indexOf(a.property)\n const bi = order.indexOf(b.property)\n return (ai === -1 ? 999 : ai) - (bi === -1 ? 999 : bi)\n })\n }\n return cols\n }\n }\n const primary = visibleColumns.value.filter((c) => c.primary)\n if (primary.length > 0) return primary\n\n return visibleColumns.value.slice(0, 1)\n})\n\nlet longPressTimer: ReturnType<typeof setTimeout> \| null = null\nlet longPressTriggered = false\n\nfunction onPointerDown(e: PointerEvent, item: Record<string, unknown>) {\n if (!props.config.selectableAttr) return\n if (e.button !== 0) return\n longPressTriggered = false\n longPressTimer = setTimeout(() => {\n longPressTriggered = true\n toggleRow(item)\n }, 500)\n}\n\nfunction onPointerUp() {\n if (longPressTimer) {\n clearTimeout(longPressTimer)\n longPressTimer = null\n }\n}\n\nfunction onContextMenu(e: MouseEvent) {\n if (longPressTriggered) {\n e.preventDefault()\n }\n}\n\nfunction onHeaderClick(index: number) {\n if (longPressTriggered) {\n longPressTriggered = false\n return\n }\n toggleAccordion(index)\n}\n\nfunction toggleAccordion(index: number) {\n if (openRowIndexes.value.has(index)) {\n openRowIndexes.value.delete(index)\n } else {\n openRowIndexes.value.add(index)\n }\n openRowIndexes.value = new Set(openRowIndexes.value)\n}\n</script>\n\n<template>\n <div class=\"ac-component\" :class=\"{ 'is-loading': loading }\">\n <div\n v-if=\"!loading \|\| items.length > 0\"\n class=\"c-cards\"\n :class=\"{ 'is-compact': settings.compact }\"\n >\n <div\n v-for=\"(item, index) in items\"\n :key=\"index\"\n class=\"c-card\"\n :class=\"{\n 'is-open': openRowIndexes.has(index),\n 'is-selected': config.selectableAttr && selectedKeys.has(item[config.selectableAttr]),\n }\"\n >\n <button\n type=\"button\"\n class=\"c-card__header\"\n @click=\"onHeaderClick(index)\"\n @pointerdown=\"onPointerDown($event, item)\"\n @pointerup=\"onPointerUp()\"\n @pointerleave=\"onPointerUp()\"\n @contextmenu=\"onContextMenu\"\n >\n <span\n v-if=\"config.selectableAttr\"\n class=\"c-card__check-zone\"\n @click.stop=\"toggleRow(item)\"\n >\n <span\n class=\"c-card__check\"\n :class=\"{ 'is-checked': selectedKeys.has(item[config.selectableAttr]) }\"\n >\n <i class=\"fa-solid fa-check\"></i>\n </span>\n </span>\n <span class=\"c-card__heading\">\n <span\n v-for=\"(col, i) in cardHeaderColumns\"\n :key=\"col.property\"\n class=\"c-card__heading-item\"\n >\n <span class=\"c-card__label\">{{ col.label }}</span>\n <span\n class=\"c-card__title\"\n :class=\"{ 'c-truncate': settings.compact && i === 0 }\"\n v-html=\"getColumnValue(item, col)\"\n ></span>\n </span>\n </span>\n <span class=\"c-card__icon\" aria-hidden=\"true\"\n ><i class=\"fa-solid fa-chevron-down\"></i\n ></span>\n </button>\n\n <div v-show=\"openRowIndexes.has(index)\" class=\"c-card__body\">\n <div v-for=\"col in visibleColumns\" :key=\"col.property\" class=\"c-card__field\" tabindex=\"0\">\n <span class=\"c-card__field-label\">{{ col.label }}</span>\n <DataCell :item=\"item\" :col=\"col\" class=\"c-card__field-value\" :copy=\"false\" />\n\n <CopyToClipboard\n v-if=\"getColumnValue(item, col)\"\n class=\"c-card__field-copy click-expand\"\n :value=\"getColumnValue(item, col)\"\n />\n </div>\n\n <div v-if=\"config.actions\" class=\"c-card__actions\" @click.stop>\n <template v-for=\"(action, ai) in config.actions\" :key=\"ai\">\n <DropdownMenu\n v-if=\"isActionGroup(action)\"\n :icon=\"action.icon\"\n :label=\"action.label\"\n :ariaLabel=\"action.ariaLabel\"\n :items=\"buildActionGroupMenuItems(action, item)\"\n v-bind=\"action.config\"\n />\n\n <Button\n v-else\n :type=\"action.type\"\n :icon=\"action.icon\"\n :label=\"action.cardLabel ?? action.label\"\n :ariaLabel=\"action.ariaLabel\"\n outline\n :disabled=\"action.disabled ? action.disabled(item) : false\"\n :callback=\"() => action.callback(item)\"\n v-bind=\"action.config\"\n />\n </template>\n </div>\n </div>\n </div>\n </div>\n <div v-else class=\"c-cards__loading-wrap\">\n <Loader :loading=\"true\" size=\"2.5rem\" />\n </div>\n <div v-if=\"loading && items.length > 0\" class=\"c-cards__backdrop\" aria-hidden=\"true\">\n <Loader :loading=\"true\" size=\"2.5rem\" />\n </div>\n </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-cards.scss\"></style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAiBA,IAAM,IAAQ,GAaR,IAAO,GAIP,EAAE,iBAAc,QAAQ,MAAc,QACpC,EAAM,aACN,EAAM,OAAO,iBAClB,MAAM,EAAK,oBAAoB,CAAC,CACnC,GAEM,IAAiB,kBAAiB,IAAI,IAAI,CAAC;EAEjD,QACQ,EAAM,aACN;GACJ,EAAe,wBAAQ,IAAI,IAAI;EACjC,CACF;EAEA,IAAM,IAAiB,QAAe,EAAM,OAAO,QAAQ,QAAQ,MAAM,EAAE,YAAY,EAAK,CAAC,GAEvF,IAAoB,QAAe;GACvC,IAAM,IAAI,EAAM;GAChB,IAAI,GAAG,mBAAmB;IACxB,IAAM,IAAO,EAAe,MAAM,QAAQ,MAAM,EAAE,kBAAkB,EAAE,SAAS;IAC/E,IAAI,EAAK,SAAS,GAAG;KACnB,IAAI,EAAE,iBAAiB;MACrB,IAAM,IAAQ,EAAE;MAChB,OAAO,CAAC,GAAG,CAAI,EAAE,MAAM,GAAG,MAAM;OAC9B,IAAM,IAAK,EAAM,QAAQ,EAAE,QAAQ,GAC7B,IAAK,EAAM,QAAQ,EAAE,QAAQ;OACnC,QAAQ,MAAO,KAAK,MAAM,MAAO,MAAO,KAAK,MAAM;MACrD,CAAC;KACH;KACA,OAAO;IACT;GACF;GACA,IAAM,IAAU,EAAe,MAAM,QAAQ,MAAM,EAAE,OAAO;GAG5D,OAFI,EAAQ,SAAS,IAAU,IAExB,EAAe,MAAM,MAAM,GAAG,CAAC;EACxC,CAAC,GAEG,IAAuD,MACvD,IAAqB;EAEzB,SAAS,EAAc,GAAiB,GAA+B;GAChE,EAAM,OAAO,kBACd,EAAE,WAAW,MACjB,IAAqB,IACrB,IAAiB,iBAAiB;IAEhC,AADA,IAAqB,IACrB,EAAU,CAAI;GAChB,GAAG,GAAG;EACR;EAEA,SAAS,IAAc;GACrB,AAEE,OADA,aAAa,CAAc,GACV;EAErB;EAEA,SAAS,EAAc,GAAe;GACpC,AAAI,KACF,EAAE,eAAe;EAErB;EAEA,SAAS,EAAc,GAAe;GACpC,IAAI,GAAoB;IACtB,IAAqB;IACrB;GACF;GACA,EAAgB,CAAK;EACvB;EAEA,SAAS,EAAgB,GAAe;GAMtC,AALI,EAAe,MAAM,IAAI,CAAK,IAChC,EAAe,MAAM,OAAO,CAAK,IAEjC,EAAe,MAAM,IAAI,CAAK,GAEhC,EAAe,QAAQ,IAAI,IAAI,EAAe,KAAK;EACrD;yBAIE,EAoGM,OAAA,EApGD,OAAK,EAAA,CAAC,gBAAc,EAAA,cAAyB,EAAA,QAAO,CAAA,CAAA,EAAA,GAAA,CAAA,CAE9C,EAAA,WAAW,EAAA,MAAM,SAAM,KAAA,EAAA,GADhC,EA4FM,OAAA;;GA1FJ,OAAK,EAAA,CAAC,WAAS,EAAA,cACS,EAAA,SAAS,QAAO,CAAA,CAAA;cAExC,EAsFM,GAAA,MAAA,EArFoB,EAAA,QAAhB,GAAM,YADhB,EAsFM,OAAA;GApFH,KAAK;GACN,OAAK,EAAA,CAAC,UAAQ;eACiB,EAAA,MAAe,IAAI,CAAK;mBAA4B,EAAA,OAAO,kBAAkB,EAAA,CAAA,EAAa,IAAI,EAAK,EAAA,OAAO,eAAc;;MAKvJ,EAsCS,UAAA;GArCP,MAAK;GACL,OAAM;GACL,UAAK,MAAE,EAAc,CAAK;GAC1B,gBAAW,MAAE,EAAc,GAAQ,CAAI;GACvC,aAAS,AAAA,EAAA,QAAA,MAAE,EAAW;GACtB,gBAAY,AAAA,EAAA,QAAA,MAAE,EAAW;GACzB,eAAa;;GAGN,EAAA,OAAO,kBAAA,EAAA,GADf,EAWO,QAAA;;IATL,OAAM;IACL,SAAK,GAAA,MAAO,EAAA,CAAA,EAAU,CAAI,GAAA,CAAA,MAAA,CAAA;OAE3B,EAKO,QAAA,EAJL,OAAK,EAAA,CAAC,iBAAe,EAAA,cACG,EAAA,CAAA,EAAa,IAAI,EAAK,EAAA,OAAO,eAAc,EAAA,CAAA,CAAA,EAAA,GAAA,CAAA,GAAA,AAAA,EAAA,OAAA,CAEnE,EAAiC,KAAA,EAA9B,OAAM,oBAAmB,GAAA,MAAA,EAAA,CAAA,CAAA,GAAA,CAAA,CAAA,GAAA,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA;GAGhC,EAaO,QAbP,GAaO,EAAA,EAAA,EAAA,GAZL,EAWO,GAAA,MAAA,EAVc,EAAA,QAAX,GAAK,YADf,EAWO,QAAA;IATJ,KAAK,EAAI;IACV,OAAM;OAEN,EAAkD,QAAlD,GAAkD,EAAnB,EAAI,KAAK,GAAA,CAAA,GACxC,EAIQ,QAAA;IAHN,OAAK,EAAA,CAAC,iBAAe,EAAA,cACG,EAAA,SAAS,WAAW,MAAC,EAAA,CAAA,CAAA;IAC7C,WAAQ,EAAA,CAAA,EAAe,GAAM,CAAG;;YAItC,EAEQ,QAAA;IAFF,OAAM;IAAe,eAAY;OACpC,EACF,KAAA,EADK,OAAM,2BAA0B,CAAA,CAAA,GAAA,EAAA;eAIxC,EAoCM,OApCN,GAoCM,EAAA,EAAA,EAAA,GAnCJ,EASM,GAAA,MAAA,EATa,EAAA,QAAP,YAAZ,EASM,OAAA;GAT8B,KAAK,EAAI;GAAU,OAAM;GAAgB,UAAS;;GACpF,EAAwD,QAAxD,GAAwD,EAAnB,EAAI,KAAK,GAAA,CAAA;GAC9C,EAA8E,GAAA;IAA7D;IAAY;IAAK,OAAM;IAAuB,MAAM;;GAG7D,EAAA,CAAA,EAAe,GAAM,CAAG,KAAA,EAAA,GADhC,EAIE,GAAA;;IAFA,OAAM;IACL,OAAO,EAAA,CAAA,EAAe,GAAM,CAAG;;eAIzB,EAAA,OAAO,WAAA,EAAA,GAAlB,EAuBM,OAAA;;GAvBqB,OAAM;GAAmB,SAAK,AAAA,EAAA,OAAA,QAAN,CAAA,GAAW,CAAA,MAAA,CAAA;cAC5D,EAqBW,GAAA,MAAA,EArBsB,EAAA,OAAO,UAAtB,GAAQ,wBAA6B,EAAE,GAAA,CAE/C,EAAA,CAAA,EAAc,CAAM,KAAA,EAAA,GAD5B,EAOE,GAPF,EAOE;;GALC,MAAM,EAAO;GACb,OAAO,EAAO;GACd,WAAW,EAAO;GAClB,OAAO,EAAA,CAAA,EAA0B,GAAQ,CAAI;sBACtC,EAAO,MAAM,GAAA,MAAA,IAAA;GAAA;GAAA;GAAA;GAAA;EAAA,CAAA,MAAA,EAAA,GAGvB,EAUE,GAVF,EAUE;;GARC,MAAM,EAAO;GACb,MAAM,EAAO;GACb,OAAO,EAAO,aAAa,EAAO;GAClC,WAAW,EAAO;GACnB,SAAA;GACC,UAAU,EAAO,WAAW,EAAO,SAAS,CAAI,IAAA;GAChD,gBAAgB,EAAO,SAAS,CAAI;sBAC7B,EAAO,MAAM,GAAA,MAAA,IAAA;GAAA;GAAA;GAAA;GAAA;GAAA;GAAA;EAAA,CAAA,EAAA,GAAA,EAAA,uCAhChB,EAAA,MAAe,IAAI,CAAK,CAAA,CAAA,CAAA,CAAA,GAAA,CAAA,yBAuCzC,EAEM,OAFN,GAEM,CADJ,EAAwC,GAAA;GAA/B,SAAS;GAAM,MAAK;SAEpB,EAAA,WAAW,EAAA,MAAM,SAAM,KAAA,EAAA,GAAlC,EAEM,OAFN,GAEM,CADJ,EAAwC,GAAA;GAA/B,SAAS;GAAM,MAAK"}
1	+ {"version":3,"file":"admins-components62.js","names":[],"sources":["../src/components/data-table/DataCards.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { DataListConfig, DataCardsSettings, DataListSettings } from '@/types/data-list'\nimport DataCell from './DataCell.vue'\nexport { dataCardsSettingsDefaults } from '@/types/data-list'\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, ref, watch } from 'vue'\nimport Button from '@/components/Button.vue'\nimport Checkbox from '@/components/Checkbox.vue'\nimport CopyToClipboard from '@/components/CopyToClipboard.vue'\nimport Loader from '@/components/Loader.vue'\nimport { useSelection } from '@/composables/useSelection'\nimport { dataCardsSettingsDefaults } from '@/types/data-list'\nimport DropdownMenu from '@/components/DropdownMenu.vue'\nimport { getColumnValue } from '@/utils/dataList'\nimport { buildActionGroupMenuItems, isActionGroup } from '@/utils/dataList'\n\nconst props = withDefaults(\n defineProps<{\n config: DataListConfig\n items: Record<string, unknown>[]\n settings?: DataCardsSettings \| DataListSettings\n loading?: boolean\n }>(),\n {\n settings: () => ({ ...dataCardsSettingsDefaults }),\n loading: false,\n },\n)\n\nconst emit = defineEmits<{\n 'selection-change': [selected: unknown[]]\n}>()\n\nconst { selectedKeys, toggle: toggleRow } = useSelection(\n () => props.items,\n () => props.config.selectableAttr,\n (s) => emit('selection-change', s),\n)\n\nconst openRowIndexes = ref<Set<number>>(new Set())\n\nwatch(\n () => props.items,\n () => {\n openRowIndexes.value = new Set()\n },\n)\n\nconst visibleColumns = computed(() => props.config.columns.filter((c) => c.visible !== false))\n\nconst cardHeaderColumns = computed(() => {\n const s = props.settings as any\n if (s?.cardHeaderColumns) {\n const cols = visibleColumns.value.filter((c) => s.cardHeaderColumns[c.property])\n if (cols.length > 0) {\n if (s.cardHeaderOrder) {\n const order = s.cardHeaderOrder as string[]\n return [...cols].sort((a, b) => {\n const ai = order.indexOf(a.property)\n const bi = order.indexOf(b.property)\n return (ai === -1 ? 999 : ai) - (bi === -1 ? 999 : bi)\n })\n }\n return cols\n }\n }\n const primary = visibleColumns.value.filter((c) => c.primary)\n if (primary.length > 0) return primary\n\n return visibleColumns.value.slice(0, 1)\n})\n\nlet longPressTimer: ReturnType<typeof setTimeout> \| null = null\nlet longPressTriggered = false\n\nfunction onPointerDown(e: PointerEvent, item: Record<string, unknown>) {\n if (!props.config.selectableAttr) return\n if (e.button !== 0) return\n longPressTriggered = false\n longPressTimer = setTimeout(() => {\n longPressTriggered = true\n toggleRow(item)\n }, 500)\n}\n\nfunction onPointerUp() {\n if (longPressTimer) {\n clearTimeout(longPressTimer)\n longPressTimer = null\n }\n}\n\nfunction onContextMenu(e: MouseEvent) {\n if (longPressTriggered) {\n e.preventDefault()\n }\n}\n\nfunction onHeaderClick(index: number) {\n if (longPressTriggered) {\n longPressTriggered = false\n return\n }\n toggleAccordion(index)\n}\n\nfunction toggleAccordion(index: number) {\n if (openRowIndexes.value.has(index)) {\n openRowIndexes.value.delete(index)\n } else {\n openRowIndexes.value.add(index)\n }\n openRowIndexes.value = new Set(openRowIndexes.value)\n}\n</script>\n\n<template>\n <div class=\"ac-component\">\n <div class=\"c-cards-wrapper\" :class=\"{ 'is-loading': loading }\">\n <div\n v-if=\"!loading \|\| items.length > 0\"\n class=\"c-cards\"\n :class=\"{ 'is-compact': settings.compact }\"\n >\n <div\n v-for=\"(item, index) in items\"\n :key=\"index\"\n class=\"c-card\"\n :class=\"{\n 'is-open': openRowIndexes.has(index),\n 'is-selected': config.selectableAttr && selectedKeys.has(item[config.selectableAttr]),\n }\"\n >\n <button\n type=\"button\"\n class=\"c-card__header\"\n @click=\"onHeaderClick(index)\"\n @pointerdown=\"onPointerDown($event, item)\"\n @pointerup=\"onPointerUp()\"\n @pointerleave=\"onPointerUp()\"\n @contextmenu=\"onContextMenu\"\n >\n <span\n v-if=\"config.selectableAttr\"\n class=\"c-card__check-zone\"\n @click.stop=\"toggleRow(item)\"\n >\n <Checkbox\n :model-value=\"!!selectedKeys.has(item[config.selectableAttr])\"\n @update:model-value=\"toggleRow(item)\"\n @click.stop\n />\n </span>\n <span class=\"c-card__heading\">\n <span\n v-for=\"(col, i) in cardHeaderColumns\"\n :key=\"col.property\"\n class=\"c-card__heading-item\"\n >\n <span class=\"c-card__label\">{{ col.label }}</span>\n <span\n class=\"c-card__title\"\n :class=\"{ 'c-truncate': settings.compact && i === 0 }\"\n v-html=\"getColumnValue(item, col)\"\n ></span>\n </span>\n </span>\n <span class=\"c-card__icon\" aria-hidden=\"true\"\n ><i class=\"fa-solid fa-chevron-down\"></i\n ></span>\n </button>\n\n <div v-show=\"openRowIndexes.has(index)\" class=\"c-card__body\">\n <div\n v-for=\"col in visibleColumns\"\n :key=\"col.property\"\n class=\"c-card__field\"\n tabindex=\"0\"\n >\n <span class=\"c-card__field-label\">{{ col.label }}</span>\n <DataCell :item=\"item\" :col=\"col\" class=\"c-card__field-value\" :copy=\"false\" />\n\n <CopyToClipboard\n v-if=\"getColumnValue(item, col)\"\n class=\"c-card__field-copy click-expand\"\n :value=\"getColumnValue(item, col)\"\n />\n </div>\n\n <div v-if=\"config.actions\" class=\"c-card__actions\" @click.stop>\n <template v-for=\"(action, ai) in config.actions\" :key=\"ai\">\n <DropdownMenu\n v-if=\"isActionGroup(action)\"\n :icon=\"action.icon\"\n :label=\"action.label\"\n :ariaLabel=\"action.ariaLabel\"\n :items=\"buildActionGroupMenuItems(action, item)\"\n v-bind=\"action.config\"\n />\n\n <Button\n v-else\n :type=\"action.type\"\n :icon=\"action.icon\"\n :label=\"action.cardLabel ?? action.label\"\n :ariaLabel=\"action.ariaLabel\"\n outline\n :disabled=\"action.disabled ? action.disabled(item) : false\"\n :callback=\"() => action.callback(item)\"\n v-bind=\"action.config\"\n />\n </template>\n </div>\n </div>\n </div>\n </div>\n <div v-else class=\"c-cards__loading-wrap\">\n <Loader :loading=\"true\" size=\"2.5rem\" />\n </div>\n <div v-if=\"loading && items.length > 0\" class=\"c-cards__backdrop\" aria-hidden=\"true\">\n <Loader :loading=\"true\" size=\"2.5rem\" />\n </div>\n </div>\n </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-cards.scss\"></style>\n"],"mappings":"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"}

package/dist/admins-components64.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"admins-components64.js","names":[],"sources":["../src/components/data-table/DataCards.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { DataListConfig, DataCardsSettings, DataListSettings } from '@/types/data-list'\nimport DataCell from './DataCell.vue'\nexport { dataCardsSettingsDefaults } from '@/types/data-list'\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, ref, watch } from 'vue'\nimport Button from '@/components/Button.vue'\nimport CopyToClipboard from '@/components/CopyToClipboard.vue'\nimport Loader from '@/components/Loader.vue'\nimport { useSelection } from '@/composables/useSelection'\nimport { dataCardsSettingsDefaults } from '@/types/data-list'\nimport DropdownMenu from '@/components/DropdownMenu.vue'\nimport { getColumnValue } from '@/utils/dataList'\nimport { buildActionGroupMenuItems, isActionGroup } from '@/utils/dataList'\n\nconst props = withDefaults(\n defineProps<{\n config: DataListConfig\n items: Record<string, unknown>[]\n settings?: DataCardsSettings \| DataListSettings\n loading?: boolean\n }>(),\n {\n settings: () => ({ ...dataCardsSettingsDefaults }),\n loading: false,\n },\n)\n\nconst emit = defineEmits<{\n 'selection-change': [selected: unknown[]]\n}>()\n\nconst { selectedKeys, toggle: toggleRow } = useSelection(\n () => props.items,\n () => props.config.selectableAttr,\n (s) => emit('selection-change', s),\n)\n\nconst openRowIndexes = ref<Set<number>>(new Set())\n\nwatch(\n () => props.items,\n () => {\n openRowIndexes.value = new Set()\n },\n)\n\nconst visibleColumns = computed(() => props.config.columns.filter((c) => c.visible !== false))\n\nconst cardHeaderColumns = computed(() => {\n const s = props.settings as any\n if (s?.cardHeaderColumns) {\n const cols = visibleColumns.value.filter((c) => s.cardHeaderColumns[c.property])\n if (cols.length > 0) {\n if (s.cardHeaderOrder) {\n const order = s.cardHeaderOrder as string[]\n return [...cols].sort((a, b) => {\n const ai = order.indexOf(a.property)\n const bi = order.indexOf(b.property)\n return (ai === -1 ? 999 : ai) - (bi === -1 ? 999 : bi)\n })\n }\n return cols\n }\n }\n const primary = visibleColumns.value.filter((c) => c.primary)\n if (primary.length > 0) return primary\n\n return visibleColumns.value.slice(0, 1)\n})\n\nlet longPressTimer: ReturnType<typeof setTimeout> \| null = null\nlet longPressTriggered = false\n\nfunction onPointerDown(e: PointerEvent, item: Record<string, unknown>) {\n if (!props.config.selectableAttr) return\n if (e.button !== 0) return\n longPressTriggered = false\n longPressTimer = setTimeout(() => {\n longPressTriggered = true\n toggleRow(item)\n }, 500)\n}\n\nfunction onPointerUp() {\n if (longPressTimer) {\n clearTimeout(longPressTimer)\n longPressTimer = null\n }\n}\n\nfunction onContextMenu(e: MouseEvent) {\n if (longPressTriggered) {\n e.preventDefault()\n }\n}\n\nfunction onHeaderClick(index: number) {\n if (longPressTriggered) {\n longPressTriggered = false\n return\n }\n toggleAccordion(index)\n}\n\nfunction toggleAccordion(index: number) {\n if (openRowIndexes.value.has(index)) {\n openRowIndexes.value.delete(index)\n } else {\n openRowIndexes.value.add(index)\n }\n openRowIndexes.value = new Set(openRowIndexes.value)\n}\n</script>\n\n<template>\n <div class=\"ac-component\" :class=\"{ 'is-loading': loading }\">\n <div\n v-if=\"!loading \|\| items.length > 0\"\n class=\"c-cards\"\n :class=\"{ 'is-compact': settings.compact }\"\n >\n <div\n v-for=\"(item, index) in items\"\n :key=\"index\"\n class=\"c-card\"\n :class=\"{\n 'is-open': openRowIndexes.has(index),\n 'is-selected': config.selectableAttr && selectedKeys.has(item[config.selectableAttr]),\n }\"\n >\n <button\n type=\"button\"\n class=\"c-card__header\"\n @click=\"onHeaderClick(index)\"\n @pointerdown=\"onPointerDown($event, item)\"\n @pointerup=\"onPointerUp()\"\n @pointerleave=\"onPointerUp()\"\n @contextmenu=\"onContextMenu\"\n >\n <span\n v-if=\"config.selectableAttr\"\n class=\"c-card__check-zone\"\n @click.stop=\"toggleRow(item)\"\n >\n <~~span~~\n ~~class=\"c~~-~~card__check\"\n :class~~=\"~~{ 'is-checked':~~ selectedKeys.has(item[config.selectableAttr]) }\"\n ~~>\n <i class~~=\"~~fa-solid fa-check~~\"~~></i>\~~n </span>\n ~~</span>\n~~ <span class=\"c-card__heading\">\n <span\n v-for=\"(col, i) in cardHeaderColumns\"\n :key=\"col.property\"\n class=\"c-card__heading-item\"\n >\n <span class=\"c-card__label\">{{ col.label }}</span>\n <span\n class=\"c-card__title\"\n :class=\"{ 'c-truncate': settings.compact && i === 0 }\"\n v-html=\"getColumnValue(item, col)\"\n ></span>\n </span>\n </span>\n <span class=\"c-card__icon\" aria-hidden=\"true\"\n ><i class=\"fa-solid fa-chevron-down\"></i\n ></span>\n </button>\n\n <div v-show=\"openRowIndexes.has(index)\" class=\"c-card__body\">\n <div v-for=\"col in visibleColumns\" :key=\"col.property\" class=\"c-card__field\" tabindex=\"0\">\n <span class=\"c-card__field-label\">{{ col.label }}</span>\n <DataCell :item=\"item\" :col=\"col\" class=\"c-card__field-value\" :copy=\"false\" />\n\n <CopyToClipboard\n v-if=\"getColumnValue(item, col)\"\n class=\"c-card__field-copy click-expand\"\n :value=\"getColumnValue(item, col)\"\n />\n </div>\n\n <div v-if=\"config.actions\" class=\"c-card__actions\" @click.stop>\n <template v-for=\"(action, ai) in config.actions\" :key=\"ai\">\n <DropdownMenu\n v-if=\"isActionGroup(action)\"\n :icon=\"action.icon\"\n :label=\"action.label\"\n :ariaLabel=\"action.ariaLabel\"\n :items=\"buildActionGroupMenuItems(action, item)\"\n v-bind=\"action.config\"\n />\n\n <Button\n v-else\n :type=\"action.type\"\n :icon=\"action.icon\"\n :label=\"action.cardLabel ?? action.label\"\n :ariaLabel=\"action.ariaLabel\"\n outline\n :disabled=\"action.disabled ? action.disabled(item) : false\"\n :callback=\"() => action.callback(item)\"\n v-bind=\"action.config\"\n />\n </template>\n </div>\n </div>\n </div>\n </div>\n <div v-else class=\"c-cards__loading-wrap\">\n <Loader :loading=\"true\" size=\"2.5rem\" />\n </div>\n <div v-if=\"loading && items.length > 0\" class=\"c-cards__backdrop\" aria-hidden=\"true\">\n <Loader :loading=\"true\" size=\"2.5rem\" />\n </div>\n </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-cards.scss\"></style>\n"],"mappings":""}
1	+ {"version":3,"file":"admins-components64.js","names":[],"sources":["../src/components/data-table/DataCards.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { DataListConfig, DataCardsSettings, DataListSettings } from '@/types/data-list'\nimport DataCell from './DataCell.vue'\nexport { dataCardsSettingsDefaults } from '@/types/data-list'\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, ref, watch } from 'vue'\nimport Button from '@/components/Button.vue'\nimport Checkbox from '@/components/Checkbox.vue'\nimport CopyToClipboard from '@/components/CopyToClipboard.vue'\nimport Loader from '@/components/Loader.vue'\nimport { useSelection } from '@/composables/useSelection'\nimport { dataCardsSettingsDefaults } from '@/types/data-list'\nimport DropdownMenu from '@/components/DropdownMenu.vue'\nimport { getColumnValue } from '@/utils/dataList'\nimport { buildActionGroupMenuItems, isActionGroup } from '@/utils/dataList'\n\nconst props = withDefaults(\n defineProps<{\n config: DataListConfig\n items: Record<string, unknown>[]\n settings?: DataCardsSettings \| DataListSettings\n loading?: boolean\n }>(),\n {\n settings: () => ({ ...dataCardsSettingsDefaults }),\n loading: false,\n },\n)\n\nconst emit = defineEmits<{\n 'selection-change': [selected: unknown[]]\n}>()\n\nconst { selectedKeys, toggle: toggleRow } = useSelection(\n () => props.items,\n () => props.config.selectableAttr,\n (s) => emit('selection-change', s),\n)\n\nconst openRowIndexes = ref<Set<number>>(new Set())\n\nwatch(\n () => props.items,\n () => {\n openRowIndexes.value = new Set()\n },\n)\n\nconst visibleColumns = computed(() => props.config.columns.filter((c) => c.visible !== false))\n\nconst cardHeaderColumns = computed(() => {\n const s = props.settings as any\n if (s?.cardHeaderColumns) {\n const cols = visibleColumns.value.filter((c) => s.cardHeaderColumns[c.property])\n if (cols.length > 0) {\n if (s.cardHeaderOrder) {\n const order = s.cardHeaderOrder as string[]\n return [...cols].sort((a, b) => {\n const ai = order.indexOf(a.property)\n const bi = order.indexOf(b.property)\n return (ai === -1 ? 999 : ai) - (bi === -1 ? 999 : bi)\n })\n }\n return cols\n }\n }\n const primary = visibleColumns.value.filter((c) => c.primary)\n if (primary.length > 0) return primary\n\n return visibleColumns.value.slice(0, 1)\n})\n\nlet longPressTimer: ReturnType<typeof setTimeout> \| null = null\nlet longPressTriggered = false\n\nfunction onPointerDown(e: PointerEvent, item: Record<string, unknown>) {\n if (!props.config.selectableAttr) return\n if (e.button !== 0) return\n longPressTriggered = false\n longPressTimer = setTimeout(() => {\n longPressTriggered = true\n toggleRow(item)\n }, 500)\n}\n\nfunction onPointerUp() {\n if (longPressTimer) {\n clearTimeout(longPressTimer)\n longPressTimer = null\n }\n}\n\nfunction onContextMenu(e: MouseEvent) {\n if (longPressTriggered) {\n e.preventDefault()\n }\n}\n\nfunction onHeaderClick(index: number) {\n if (longPressTriggered) {\n longPressTriggered = false\n return\n }\n toggleAccordion(index)\n}\n\nfunction toggleAccordion(index: number) {\n if (openRowIndexes.value.has(index)) {\n openRowIndexes.value.delete(index)\n } else {\n openRowIndexes.value.add(index)\n }\n openRowIndexes.value = new Set(openRowIndexes.value)\n}\n</script>\n\n<template>\n <div class=\"ac-component\">\n <div class=\"c-cards-wrapper\" :class=\"{ 'is-loading': loading }\">\n <div\n v-if=\"!loading \|\| items.length > 0\"\n class=\"c-cards\"\n :class=\"{ 'is-compact': settings.compact }\"\n >\n <div\n v-for=\"(item, index) in items\"\n :key=\"index\"\n class=\"c-card\"\n :class=\"{\n 'is-open': openRowIndexes.has(index),\n 'is-selected': config.selectableAttr && selectedKeys.has(item[config.selectableAttr]),\n }\"\n >\n <button\n type=\"button\"\n class=\"c-card__header\"\n @click=\"onHeaderClick(index)\"\n @pointerdown=\"onPointerDown($event, item)\"\n @pointerup=\"onPointerUp()\"\n @pointerleave=\"onPointerUp()\"\n @contextmenu=\"onContextMenu\"\n >\n <span\n v-if=\"config.selectableAttr\"\n class=\"c-card__check-zone\"\n @click.stop=\"toggleRow(item)\"\n >\n <Checkbox\n :model-value=\"!!selectedKeys.has(item[config.selectableAttr])\"\n @update:model-value=\"toggleRow(item)\"\n @click.stop\n />\n </span>\n <span class=\"c-card__heading\">\n <span\n v-for=\"(col, i) in cardHeaderColumns\"\n :key=\"col.property\"\n class=\"c-card__heading-item\"\n >\n <span class=\"c-card__label\">{{ col.label }}</span>\n <span\n class=\"c-card__title\"\n :class=\"{ 'c-truncate': settings.compact && i === 0 }\"\n v-html=\"getColumnValue(item, col)\"\n ></span>\n </span>\n </span>\n <span class=\"c-card__icon\" aria-hidden=\"true\"\n ><i class=\"fa-solid fa-chevron-down\"></i\n ></span>\n </button>\n\n <div v-show=\"openRowIndexes.has(index)\" class=\"c-card__body\">\n <div\n v-for=\"col in visibleColumns\"\n :key=\"col.property\"\n class=\"c-card__field\"\n tabindex=\"0\"\n >\n <span class=\"c-card__field-label\">{{ col.label }}</span>\n <DataCell :item=\"item\" :col=\"col\" class=\"c-card__field-value\" :copy=\"false\" />\n\n <CopyToClipboard\n v-if=\"getColumnValue(item, col)\"\n class=\"c-card__field-copy click-expand\"\n :value=\"getColumnValue(item, col)\"\n />\n </div>\n\n <div v-if=\"config.actions\" class=\"c-card__actions\" @click.stop>\n <template v-for=\"(action, ai) in config.actions\" :key=\"ai\">\n <DropdownMenu\n v-if=\"isActionGroup(action)\"\n :icon=\"action.icon\"\n :label=\"action.label\"\n :ariaLabel=\"action.ariaLabel\"\n :items=\"buildActionGroupMenuItems(action, item)\"\n v-bind=\"action.config\"\n />\n\n <Button\n v-else\n :type=\"action.type\"\n :icon=\"action.icon\"\n :label=\"action.cardLabel ?? action.label\"\n :ariaLabel=\"action.ariaLabel\"\n outline\n :disabled=\"action.disabled ? action.disabled(item) : false\"\n :callback=\"() => action.callback(item)\"\n v-bind=\"action.config\"\n />\n </template>\n </div>\n </div>\n </div>\n </div>\n <div v-else class=\"c-cards__loading-wrap\">\n <Loader :loading=\"true\" size=\"2.5rem\" />\n </div>\n <div v-if=\"loading && items.length > 0\" class=\"c-cards__backdrop\" aria-hidden=\"true\">\n <Loader :loading=\"true\" size=\"2.5rem\" />\n </div>\n </div>\n </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-cards.scss\"></style>\n"],"mappings":""}

package/dist/admins-components69.js CHANGED Viewed

@@ -1,21 +1,21 @@
 import e from "./admins-components6.js";
 import { Fragment as t, computed as n, createElementBlock as r, createElementVNode as i, createVNode as a, defineComponent as o, normalizeClass as s, openBlock as c, renderList as l, toDisplayString as u } from "vue";
 //#region src/components/data-table/DataPaginator.vue?vue&type=script&setup=true&lang.ts
-var d = { class: "c-paginator-wrapper ac-component" }, f = { class: "c-paginator" }, p = { class: "c-paginator__info" }, m = { class: "c-paginator__range" }, h = { class: "c-paginator__total" }, g = {
+var d = { class: "ac-component" }, f = { class: "c-paginator-wrapper" }, p = { class: "c-paginator" }, m = { class: "c-paginator__info" }, h = { class: "c-paginator__range" }, g = { class: "c-paginator__total" }, _ = {
 	class: "c-paginator__nav",
 	"aria-label": "Pagination"
-}, _ = {
+}, v = {
 	key: 0,
 	class: "c-paginator__ellipsis"
-}, v = ["onClick"], y = { class: "c-paginator__size" }, b = ["value"], x = ["value"], S = [
+}, y = ["onClick"], b = { class: "c-paginator__size" }, x = ["value"], S = ["value"], C = [
 	10,
 	25,
 	50,
 	100
-], C = "pagesize-";
-function w(e) {
+], w = "pagesize-";
+function T(e) {
 	try {
-		let t = localStorage.getItem(C + e);
+		let t = localStorage.getItem(w + e);
 		if (t) {
 			let e = Number(t);
 			if (e > 0) return e;
@@ -23,35 +23,35 @@ function w(e) {
 	} catch {}
 	return 25;
 }
-function T(e) {
+function E(e) {
 	return {
 		total: 0,
 		page: 1,
-		pageSize: w(e)
+		pageSize: T(e)
 	};
 }
-var E = /* @__PURE__ */ o({
+var D = /* @__PURE__ */ o({
 	__name: "DataPaginator",
 	props: {
 		settings: {},
 		storageKey: {}
 	},
 	emits: ["update:pagination"],
-	setup(o, { emit: w }) {
-		let T = o, E = w;
-		function D(e) {
+	setup(o, { emit: T }) {
+		let E = o, D = T;
+		function O(e) {
 			try {
-				localStorage.setItem(C + T.storageKey, String(e));
+				localStorage.setItem(w + E.storageKey, String(e));
 			} catch {}
 		}
-		let O = n(() => Math.max(1, Math.ceil(T.settings.total / T.settings.pageSize))), k = n(() => T.settings.total === 0 ? 0 : (T.settings.page - 1) * T.settings.pageSize + 1), A = n(() => Math.min(T.settings.page * T.settings.pageSize, T.settings.total)), j = n(() => {
-			let e = O.value, t = T.settings.page;
-			if (e <= M) {
+		let k = n(() => Math.max(1, Math.ceil(E.settings.total / E.settings.pageSize))), A = n(() => E.settings.total === 0 ? 0 : (E.settings.page - 1) * E.settings.pageSize + 1), j = n(() => Math.min(E.settings.page * E.settings.pageSize, E.settings.total)), M = n(() => {
+			let e = k.value, t = E.settings.page;
+			if (e <= N) {
 				let t = [];
 				for (let n = 1; n <= e; n++) t.push(n);
 				return t;
 			}
-			let n = M - 2, r = t - 1, i = t + 1;
+			let n = N - 2, r = t - 1, i = t + 1;
 			for (r < 2 && (i = Math.min(e - 1, i + (2 - r)), r = 2), i > e - 1 && (r = Math.max(2, r - (i - (e - 1))), i = e - 1); i - r + 1 < n;) {
 				let t = r > 2, a = i < e - 1;
 				if (!t && !a) break;
@@ -62,59 +62,59 @@ var E = /* @__PURE__ */ o({
 			s.push(1), a && s.push("...");
 			for (let e = r; e <= i; e++) s.push(e);
 			return o && s.push("..."), s.push(e), s;
-		}), M = 7;
-		function N(e) {
-			let t = T.settings.page, n = O.value, r = e === 1 || e === n, i = e === t;
+		}), N = 7;
+		function P(e) {
+			let t = E.settings.page, n = k.value, r = e === 1 || e === n, i = e === t;
 			return t > 3 && t < n - 2 && !r && !i;
 		}
-		function P(e) {
-			e < 1 || e > O.value || e === T.settings.page || E("update:pagination", {
+		function F(e) {
+			e < 1 || e > k.value || e === E.settings.page || D("update:pagination", {
 				page: e,
-				pageSize: T.settings.pageSize
+				pageSize: E.settings.pageSize
 			});
 		}
-		function F(e) {
+		function I(e) {
 			let t = Number(e.target.value);
-			D(t), E("update:pagination", {
+			O(t), D("update:pagination", {
 				page: 1,
 				pageSize: t
 			});
 		}
-		return (n, C) => (c(), r("div", d, [i("div", f, [
-			i("div", p, [i("span", m, u(k.value) + "–" + u(A.value), 1), i("span", h, " / " + u(o.settings.total), 1)]),
-			i("nav", g, [
+		return (n, w) => (c(), r("div", d, [i("div", f, [i("div", p, [
+			i("div", m, [i("span", h, u(A.value) + "–" + u(j.value), 1), i("span", g, " / " + u(o.settings.total), 1)]),
+			i("nav", _, [
 				a(e, {
 					icon: "fa-solid fa-chevron-left",
 					rel: "prev",
 					disabled: o.settings.page <= 1,
-					callback: () => P(o.settings.page - 1)
+					callback: () => F(o.settings.page - 1)
 				}, null, 8, ["disabled", "callback"]),
-				(c(!0), r(t, null, l(j.value, (e, n) => (c(), r(t, { key: n }, [e === "..." ? (c(), r("span", _, "…")) : (c(), r("button", {
+				(c(!0), r(t, null, l(M.value, (e, n) => (c(), r(t, { key: n }, [e === "..." ? (c(), r("span", v, "…")) : (c(), r("button", {
 					key: 1,
 					type: "button",
 					class: s(["c-paginator__page", {
 						"is-active": e === o.settings.page,
-						"is-hidden-sm": N(e)
+						"is-hidden-sm": P(e)
 					}]),
-					onClick: (t) => P(e)
-				}, u(e), 11, v))], 64))), 128)),
+					onClick: (t) => F(e)
+				}, u(e), 11, y))], 64))), 128)),
 				a(e, {
 					icon: "fa-solid fa-chevron-right",
 					rel: "next",
-					disabled: o.settings.page >= O.value,
-					callback: () => P(o.settings.page + 1)
+					disabled: o.settings.page >= k.value,
+					callback: () => F(o.settings.page + 1)
 				}, null, 8, ["disabled", "callback"])
 			]),
-			i("div", y, [i("select", {
+			i("div", b, [i("select", {
 				class: "c-paginator__select",
 				value: o.settings.pageSize,
-				onChange: F
-			}, [(c(), r(t, null, l(S, (e) => i("option", {
+				onChange: I
+			}, [(c(), r(t, null, l(C, (e) => i("option", {
 				key: e,
 				value: e
-			}, u(e) + " elem / oldal", 9, x)), 64))], 40, b)])
-		])]));
+			}, u(e) + " elem / oldal", 9, S)), 64))], 40, x)])
+		])])]));
 	}
 });
 //#endregion
-export { E as default, T as getDefaultPaginator, w as getPageSize };
+export { D as default, E as getDefaultPaginator, T as getPageSize };

package/dist/admins-components69.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"admins-components69.js","names":[],"sources":["../src/components/data-table/DataPaginator.vue"],"sourcesContent":["<script lang=\"ts\">\nconst SIZE_OPTIONS = [10, 25, 50, 100]\nconst STORAGE_KEY_PREFIX = 'pagesize-'\n\nexport function getPageSize(storageKey: string): number {\n try {\n const raw = localStorage.getItem(STORAGE_KEY_PREFIX + storageKey)\n if (raw) {\n const size = Number(raw)\n if (size > 0) return size\n }\n } catch {\n /* ignore /\n }\n return 25\n}\n\nexport function getDefaultPaginator(storageKey: string) {\n return {\n total: 0,\n page: 1,\n pageSize: getPageSize(storageKey),\n } as PaginatorSettings\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport Button from '@/components/Button.vue'\nimport type { PaginatorSettings, PageSettings } from '@/types/data-list'\n\nconst props = defineProps<{ settings: PaginatorSettings; storageKey: string }>()\n\nconst emit = defineEmits<{\n 'update:pagination': [pagination: PageSettings]\n}>()\n\nfunction savePageSize(size: number) {\n try {\n localStorage.setItem(STORAGE_KEY_PREFIX + props.storageKey, String(size))\n } catch {\n / ignore /\n }\n}\n\nconst totalPages = computed(() =>\n Math.max(1, Math.ceil(props.settings.total / props.settings.pageSize)),\n)\n\nconst rangeStart = computed(() =>\n props.settings.total === 0 ? 0 : (props.settings.page - 1) props.settings.pageSize + 1,\n)\nconst rangeEnd = computed(() =>\n Math.min(props.settings.page * props.settings.pageSize, props.settings.total),\n)\n\nconst visiblePages = computed<(number \| '...')[]>(() => {\n const total = totalPages.value\n const current = props.settings.page\n\n if (total <= SLOT_COUNT) {\n const pages: number[] = []\n for (let i = 1; i <= total; i++) pages.push(i)\n return pages\n }\n\n const inner = SLOT_COUNT - 2\n let winStart = current - 1\n let winEnd = current + 1\n if (winStart < 2) {\n winEnd = Math.min(total - 1, winEnd + (2 - winStart))\n winStart = 2\n }\n if (winEnd > total - 1) {\n winStart = Math.max(2, winStart - (winEnd - (total - 1)))\n winEnd = total - 1\n }\n\n while (winEnd - winStart + 1 < inner) {\n const canExtendLeft = winStart > 2\n const canExtendRight = winEnd < total - 1\n if (!canExtendLeft && !canExtendRight) break\n\n const roomLeft = winStart - 2\n const roomRight = total - 1 - winEnd\n\n const ellipsisIfExtendLeft =\n ((canExtendLeft ? winStart - 1 : 0) > 2 ? 1 : 0) + (winEnd < total - 1 ? 1 : 0)\n const ellipsisIfExtendRight =\n (winStart > 2 ? 1 : 0) + ((canExtendRight ? winEnd + 1 : 0) < total - 1 ? 1 : 0)\n\n const newSize = winEnd - winStart + 2\n\n let extended = false\n if (\n canExtendLeft &&\n (roomLeft >= roomRight \|\| !canExtendRight) &&\n newSize + ellipsisIfExtendLeft <= inner\n ) {\n winStart--\n extended = true\n } else if (canExtendRight && newSize + ellipsisIfExtendRight <= inner) {\n winEnd++\n extended = true\n }\n if (!extended) break\n }\n const showLeftEllipsis = winStart > 2\n const showRightEllipsis = winEnd < total - 1\n\n const pages: (number \| '...')[] = []\n pages.push(1)\n if (showLeftEllipsis) pages.push('...')\n for (let p = winStart; p <= winEnd; p++) pages.push(p)\n if (showRightEllipsis) pages.push('...')\n pages.push(total)\n\n return pages\n})\n\nconst SLOT_COUNT = 7\n\nfunction shouldHideOnSmall(page: number) {\n const current = props.settings.page\n const total = totalPages.value\n\n const isEdge = page === 1 \|\| page === total\n const isCurrent = page === current\n\n const isMiddleRange = current > 3 && current < total - 2\n\n return isMiddleRange && !isEdge && !isCurrent\n}\n\nfunction goToPage(page: number) {\n if (page < 1 \|\| page > totalPages.value \|\| page === props.settings.page) return\n emit('update:pagination', { page, pageSize: props.settings.pageSize })\n}\n\nfunction changePageSize(event: Event) {\n const size = Number((event.target as HTMLSelectElement).value)\n savePageSize(size)\n emit('update:pagination', { page: 1, pageSize: size })\n}\n</script>\n\n<template>\n <div class=\"~~c-paginator-wrapper~~ ac-component\">\n <div class=\"c-paginator\">\n <div class=\"c-~~paginator__info~~\">\n <span class=\"c-paginator__range\">{{ rangeStart }}–{{ rangeEnd }}</span>\n <span class=\"c-paginator__total\"> / {{ settings.total }}</span>\n </div>\n\n <nav class=\"c-paginator__nav\" aria-label=\"Pagination\">\n <Button\n icon=\"fa-solid fa-chevron-left\"\n rel=\"prev\"\n :disabled=\"settings.page <= 1\"\n :callback=\"() => goToPage(settings.page - 1)\"\n />\n\n <template v-for=\"(p, i) in visiblePages\" :key=\"i\">\n <span v-if=\"p === '...'\" class=\"c-paginator__ellipsis\">…</span>\n <button\n v-else\n type=\"button\"\n class=\"c-paginator__page\"\n :class=\"{\n 'is-active': p === settings.page,\n 'is-hidden-sm': shouldHideOnSmall(p),\n }\"\n @click=\"goToPage(p)\"\n >\n {{ p }}\n </button>\n </template>\n\n <Button\n icon=\"fa-solid fa-chevron-right\"\n rel=\"next\"\n :disabled=\"settings.page >= totalPages\"\n :callback=\"() => goToPage(settings.page + 1)\"\n />\n </nav>\n\n <div class=\"c-paginator__size\">\n <select class=\"c-paginator__select\" :value=\"settings.pageSize\" @change=\"changePageSize\">\n <option v-for=\"s in SIZE_OPTIONS\" :key=\"s\" :value=\"s\">{{ s }} elem / oldal</option>\n </select>\n </div>\n </div>\n </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-paginator.scss\"></style>\n"],"mappings":"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~~mBACY~~,MAAM,EAAA,SAAS;~~sBAAoC~~,EAAkB,CAAC;;~~KAI1G~~,UAAK,MAAE,EAAS,CAAC;SAEf,CAAC,GAAA,IAAA,CAAA,EAAA,GAAA,EAAA;IAIR,EAKE,GAAA;KAJA,MAAK;KACL,KAAI;KACH,UAAU,EAAA,SAAS,QAAQ,EAAA;KAC3B,gBAAgB,EAAS,EAAA,SAAS,OAAI,CAAA;;;GAI3C,EAIM,OAJN,GAIM,CAHJ,EAES,UAAA;IAFD,OAAM;IAAuB,OAAO,EAAA,SAAS;IAAW,UAAQ;aACtE,EAAmF,GAAA,MAAA,EAA/D,IAAL,MAAf,EAAmF,UAAA;IAAhD,KAAK;IAAI,OAAO;QAAM,CAAC,IAAG,iBAAa,GAAA,CAAA"}
1	+ {"version":3,"file":"admins-components69.js","names":[],"sources":["../src/components/data-table/DataPaginator.vue"],"sourcesContent":["<script lang=\"ts\">\nconst SIZE_OPTIONS = [10, 25, 50, 100]\nconst STORAGE_KEY_PREFIX = 'pagesize-'\n\nexport function getPageSize(storageKey: string): number {\n try {\n const raw = localStorage.getItem(STORAGE_KEY_PREFIX + storageKey)\n if (raw) {\n const size = Number(raw)\n if (size > 0) return size\n }\n } catch {\n /* ignore /\n }\n return 25\n}\n\nexport function getDefaultPaginator(storageKey: string) {\n return {\n total: 0,\n page: 1,\n pageSize: getPageSize(storageKey),\n } as PaginatorSettings\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport Button from '@/components/Button.vue'\nimport type { PaginatorSettings, PageSettings } from '@/types/data-list'\n\nconst props = defineProps<{ settings: PaginatorSettings; storageKey: string }>()\n\nconst emit = defineEmits<{\n 'update:pagination': [pagination: PageSettings]\n}>()\n\nfunction savePageSize(size: number) {\n try {\n localStorage.setItem(STORAGE_KEY_PREFIX + props.storageKey, String(size))\n } catch {\n / ignore /\n }\n}\n\nconst totalPages = computed(() =>\n Math.max(1, Math.ceil(props.settings.total / props.settings.pageSize)),\n)\n\nconst rangeStart = computed(() =>\n props.settings.total === 0 ? 0 : (props.settings.page - 1) props.settings.pageSize + 1,\n)\nconst rangeEnd = computed(() =>\n Math.min(props.settings.page * props.settings.pageSize, props.settings.total),\n)\n\nconst visiblePages = computed<(number \| '...')[]>(() => {\n const total = totalPages.value\n const current = props.settings.page\n\n if (total <= SLOT_COUNT) {\n const pages: number[] = []\n for (let i = 1; i <= total; i++) pages.push(i)\n return pages\n }\n\n const inner = SLOT_COUNT - 2\n let winStart = current - 1\n let winEnd = current + 1\n if (winStart < 2) {\n winEnd = Math.min(total - 1, winEnd + (2 - winStart))\n winStart = 2\n }\n if (winEnd > total - 1) {\n winStart = Math.max(2, winStart - (winEnd - (total - 1)))\n winEnd = total - 1\n }\n\n while (winEnd - winStart + 1 < inner) {\n const canExtendLeft = winStart > 2\n const canExtendRight = winEnd < total - 1\n if (!canExtendLeft && !canExtendRight) break\n\n const roomLeft = winStart - 2\n const roomRight = total - 1 - winEnd\n\n const ellipsisIfExtendLeft =\n ((canExtendLeft ? winStart - 1 : 0) > 2 ? 1 : 0) + (winEnd < total - 1 ? 1 : 0)\n const ellipsisIfExtendRight =\n (winStart > 2 ? 1 : 0) + ((canExtendRight ? winEnd + 1 : 0) < total - 1 ? 1 : 0)\n\n const newSize = winEnd - winStart + 2\n\n let extended = false\n if (\n canExtendLeft &&\n (roomLeft >= roomRight \|\| !canExtendRight) &&\n newSize + ellipsisIfExtendLeft <= inner\n ) {\n winStart--\n extended = true\n } else if (canExtendRight && newSize + ellipsisIfExtendRight <= inner) {\n winEnd++\n extended = true\n }\n if (!extended) break\n }\n const showLeftEllipsis = winStart > 2\n const showRightEllipsis = winEnd < total - 1\n\n const pages: (number \| '...')[] = []\n pages.push(1)\n if (showLeftEllipsis) pages.push('...')\n for (let p = winStart; p <= winEnd; p++) pages.push(p)\n if (showRightEllipsis) pages.push('...')\n pages.push(total)\n\n return pages\n})\n\nconst SLOT_COUNT = 7\n\nfunction shouldHideOnSmall(page: number) {\n const current = props.settings.page\n const total = totalPages.value\n\n const isEdge = page === 1 \|\| page === total\n const isCurrent = page === current\n\n const isMiddleRange = current > 3 && current < total - 2\n\n return isMiddleRange && !isEdge && !isCurrent\n}\n\nfunction goToPage(page: number) {\n if (page < 1 \|\| page > totalPages.value \|\| page === props.settings.page) return\n emit('update:pagination', { page, pageSize: props.settings.pageSize })\n}\n\nfunction changePageSize(event: Event) {\n const size = Number((event.target as HTMLSelectElement).value)\n savePageSize(size)\n emit('update:pagination', { page: 1, pageSize: size })\n}\n</script>\n\n<template>\n <div class=\"ac-component\">\n <div class=\"c-paginator-wrapper\">\n <div class=\"c-paginator\">\n <div class=\"c-paginator__info\">\n <span class=\"c-paginator__range\">{{ rangeStart }}–{{ rangeEnd }}</span>\n <span class=\"c-paginator__total\"> / {{ settings.total }}</span>\n </div>\n\n <nav class=\"c-paginator__nav\" aria-label=\"Pagination\">\n <Button\n icon=\"fa-solid fa-chevron-left\"\n rel=\"prev\"\n :disabled=\"settings.page <= 1\"\n :callback=\"() => goToPage(settings.page - 1)\"\n />\n\n <template v-for=\"(p, i) in visiblePages\" :key=\"i\">\n <span v-if=\"p === '...'\" class=\"c-paginator__ellipsis\">…</span>\n <button\n v-else\n type=\"button\"\n class=\"c-paginator__page\"\n :class=\"{\n 'is-active': p === settings.page,\n 'is-hidden-sm': shouldHideOnSmall(p),\n }\"\n @click=\"goToPage(p)\"\n >\n {{ p }}\n </button>\n </template>\n\n <Button\n icon=\"fa-solid fa-chevron-right\"\n rel=\"next\"\n :disabled=\"settings.page >= totalPages\"\n :callback=\"() => goToPage(settings.page + 1)\"\n />\n </nav>\n\n <div class=\"c-paginator__size\">\n <select class=\"c-paginator__select\" :value=\"settings.pageSize\" @change=\"changePageSize\">\n <option v-for=\"s in SIZE_OPTIONS\" :key=\"s\" :value=\"s\">{{ s }} elem / oldal</option>\n </select>\n </div>\n </div>\n </div>\n </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-paginator.scss\"></style>\n"],"mappings":"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"}

package/dist/admins-components71.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"admins-components71.js","names":[],"sources":["../src/components/data-table/DataPaginator.vue"],"sourcesContent":["<script lang=\"ts\">\nconst SIZE_OPTIONS = [10, 25, 50, 100]\nconst STORAGE_KEY_PREFIX = 'pagesize-'\n\nexport function getPageSize(storageKey: string): number {\n try {\n const raw = localStorage.getItem(STORAGE_KEY_PREFIX + storageKey)\n if (raw) {\n const size = Number(raw)\n if (size > 0) return size\n }\n } catch {\n /* ignore /\n }\n return 25\n}\n\nexport function getDefaultPaginator(storageKey: string) {\n return {\n total: 0,\n page: 1,\n pageSize: getPageSize(storageKey),\n } as PaginatorSettings\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport Button from '@/components/Button.vue'\nimport type { PaginatorSettings, PageSettings } from '@/types/data-list'\n\nconst props = defineProps<{ settings: PaginatorSettings; storageKey: string }>()\n\nconst emit = defineEmits<{\n 'update:pagination': [pagination: PageSettings]\n}>()\n\nfunction savePageSize(size: number) {\n try {\n localStorage.setItem(STORAGE_KEY_PREFIX + props.storageKey, String(size))\n } catch {\n / ignore /\n }\n}\n\nconst totalPages = computed(() =>\n Math.max(1, Math.ceil(props.settings.total / props.settings.pageSize)),\n)\n\nconst rangeStart = computed(() =>\n props.settings.total === 0 ? 0 : (props.settings.page - 1) props.settings.pageSize + 1,\n)\nconst rangeEnd = computed(() =>\n Math.min(props.settings.page * props.settings.pageSize, props.settings.total),\n)\n\nconst visiblePages = computed<(number \| '...')[]>(() => {\n const total = totalPages.value\n const current = props.settings.page\n\n if (total <= SLOT_COUNT) {\n const pages: number[] = []\n for (let i = 1; i <= total; i++) pages.push(i)\n return pages\n }\n\n const inner = SLOT_COUNT - 2\n let winStart = current - 1\n let winEnd = current + 1\n if (winStart < 2) {\n winEnd = Math.min(total - 1, winEnd + (2 - winStart))\n winStart = 2\n }\n if (winEnd > total - 1) {\n winStart = Math.max(2, winStart - (winEnd - (total - 1)))\n winEnd = total - 1\n }\n\n while (winEnd - winStart + 1 < inner) {\n const canExtendLeft = winStart > 2\n const canExtendRight = winEnd < total - 1\n if (!canExtendLeft && !canExtendRight) break\n\n const roomLeft = winStart - 2\n const roomRight = total - 1 - winEnd\n\n const ellipsisIfExtendLeft =\n ((canExtendLeft ? winStart - 1 : 0) > 2 ? 1 : 0) + (winEnd < total - 1 ? 1 : 0)\n const ellipsisIfExtendRight =\n (winStart > 2 ? 1 : 0) + ((canExtendRight ? winEnd + 1 : 0) < total - 1 ? 1 : 0)\n\n const newSize = winEnd - winStart + 2\n\n let extended = false\n if (\n canExtendLeft &&\n (roomLeft >= roomRight \|\| !canExtendRight) &&\n newSize + ellipsisIfExtendLeft <= inner\n ) {\n winStart--\n extended = true\n } else if (canExtendRight && newSize + ellipsisIfExtendRight <= inner) {\n winEnd++\n extended = true\n }\n if (!extended) break\n }\n const showLeftEllipsis = winStart > 2\n const showRightEllipsis = winEnd < total - 1\n\n const pages: (number \| '...')[] = []\n pages.push(1)\n if (showLeftEllipsis) pages.push('...')\n for (let p = winStart; p <= winEnd; p++) pages.push(p)\n if (showRightEllipsis) pages.push('...')\n pages.push(total)\n\n return pages\n})\n\nconst SLOT_COUNT = 7\n\nfunction shouldHideOnSmall(page: number) {\n const current = props.settings.page\n const total = totalPages.value\n\n const isEdge = page === 1 \|\| page === total\n const isCurrent = page === current\n\n const isMiddleRange = current > 3 && current < total - 2\n\n return isMiddleRange && !isEdge && !isCurrent\n}\n\nfunction goToPage(page: number) {\n if (page < 1 \|\| page > totalPages.value \|\| page === props.settings.page) return\n emit('update:pagination', { page, pageSize: props.settings.pageSize })\n}\n\nfunction changePageSize(event: Event) {\n const size = Number((event.target as HTMLSelectElement).value)\n savePageSize(size)\n emit('update:pagination', { page: 1, pageSize: size })\n}\n</script>\n\n<template>\n <div class=\"~~c-paginator-wrapper~~ ac-component\">\n <div class=\"c-paginator\">\n <div class=\"c-~~paginator__info~~\">\n <span class=\"c-paginator__range\">{{ rangeStart }}–{{ rangeEnd }}</span>\n <span class=\"c-paginator__total\"> / {{ settings.total }}</span>\n </div>\n\n <nav class=\"c-paginator__nav\" aria-label=\"Pagination\">\n <Button\n icon=\"fa-solid fa-chevron-left\"\n rel=\"prev\"\n :disabled=\"settings.page <= 1\"\n :callback=\"() => goToPage(settings.page - 1)\"\n />\n\n <template v-for=\"(p, i) in visiblePages\" :key=\"i\">\n <span v-if=\"p === '...'\" class=\"c-paginator__ellipsis\">…</span>\n <button\n v-else\n type=\"button\"\n class=\"c-paginator__page\"\n :class=\"{\n 'is-active': p === settings.page,\n 'is-hidden-sm': shouldHideOnSmall(p),\n }\"\n @click=\"goToPage(p)\"\n >\n {{ p }}\n </button>\n </template>\n\n <Button\n icon=\"fa-solid fa-chevron-right\"\n rel=\"next\"\n :disabled=\"settings.page >= totalPages\"\n :callback=\"() => goToPage(settings.page + 1)\"\n />\n </nav>\n\n <div class=\"c-paginator__size\">\n <select class=\"c-paginator__select\" :value=\"settings.pageSize\" @change=\"changePageSize\">\n <option v-for=\"s in SIZE_OPTIONS\" :key=\"s\" :value=\"s\">{{ s }} elem / oldal</option>\n </select>\n </div>\n </div>\n </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-paginator.scss\"></style>\n"],"mappings":""}
1	+ {"version":3,"file":"admins-components71.js","names":[],"sources":["../src/components/data-table/DataPaginator.vue"],"sourcesContent":["<script lang=\"ts\">\nconst SIZE_OPTIONS = [10, 25, 50, 100]\nconst STORAGE_KEY_PREFIX = 'pagesize-'\n\nexport function getPageSize(storageKey: string): number {\n try {\n const raw = localStorage.getItem(STORAGE_KEY_PREFIX + storageKey)\n if (raw) {\n const size = Number(raw)\n if (size > 0) return size\n }\n } catch {\n /* ignore /\n }\n return 25\n}\n\nexport function getDefaultPaginator(storageKey: string) {\n return {\n total: 0,\n page: 1,\n pageSize: getPageSize(storageKey),\n } as PaginatorSettings\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport Button from '@/components/Button.vue'\nimport type { PaginatorSettings, PageSettings } from '@/types/data-list'\n\nconst props = defineProps<{ settings: PaginatorSettings; storageKey: string }>()\n\nconst emit = defineEmits<{\n 'update:pagination': [pagination: PageSettings]\n}>()\n\nfunction savePageSize(size: number) {\n try {\n localStorage.setItem(STORAGE_KEY_PREFIX + props.storageKey, String(size))\n } catch {\n / ignore /\n }\n}\n\nconst totalPages = computed(() =>\n Math.max(1, Math.ceil(props.settings.total / props.settings.pageSize)),\n)\n\nconst rangeStart = computed(() =>\n props.settings.total === 0 ? 0 : (props.settings.page - 1) props.settings.pageSize + 1,\n)\nconst rangeEnd = computed(() =>\n Math.min(props.settings.page * props.settings.pageSize, props.settings.total),\n)\n\nconst visiblePages = computed<(number \| '...')[]>(() => {\n const total = totalPages.value\n const current = props.settings.page\n\n if (total <= SLOT_COUNT) {\n const pages: number[] = []\n for (let i = 1; i <= total; i++) pages.push(i)\n return pages\n }\n\n const inner = SLOT_COUNT - 2\n let winStart = current - 1\n let winEnd = current + 1\n if (winStart < 2) {\n winEnd = Math.min(total - 1, winEnd + (2 - winStart))\n winStart = 2\n }\n if (winEnd > total - 1) {\n winStart = Math.max(2, winStart - (winEnd - (total - 1)))\n winEnd = total - 1\n }\n\n while (winEnd - winStart + 1 < inner) {\n const canExtendLeft = winStart > 2\n const canExtendRight = winEnd < total - 1\n if (!canExtendLeft && !canExtendRight) break\n\n const roomLeft = winStart - 2\n const roomRight = total - 1 - winEnd\n\n const ellipsisIfExtendLeft =\n ((canExtendLeft ? winStart - 1 : 0) > 2 ? 1 : 0) + (winEnd < total - 1 ? 1 : 0)\n const ellipsisIfExtendRight =\n (winStart > 2 ? 1 : 0) + ((canExtendRight ? winEnd + 1 : 0) < total - 1 ? 1 : 0)\n\n const newSize = winEnd - winStart + 2\n\n let extended = false\n if (\n canExtendLeft &&\n (roomLeft >= roomRight \|\| !canExtendRight) &&\n newSize + ellipsisIfExtendLeft <= inner\n ) {\n winStart--\n extended = true\n } else if (canExtendRight && newSize + ellipsisIfExtendRight <= inner) {\n winEnd++\n extended = true\n }\n if (!extended) break\n }\n const showLeftEllipsis = winStart > 2\n const showRightEllipsis = winEnd < total - 1\n\n const pages: (number \| '...')[] = []\n pages.push(1)\n if (showLeftEllipsis) pages.push('...')\n for (let p = winStart; p <= winEnd; p++) pages.push(p)\n if (showRightEllipsis) pages.push('...')\n pages.push(total)\n\n return pages\n})\n\nconst SLOT_COUNT = 7\n\nfunction shouldHideOnSmall(page: number) {\n const current = props.settings.page\n const total = totalPages.value\n\n const isEdge = page === 1 \|\| page === total\n const isCurrent = page === current\n\n const isMiddleRange = current > 3 && current < total - 2\n\n return isMiddleRange && !isEdge && !isCurrent\n}\n\nfunction goToPage(page: number) {\n if (page < 1 \|\| page > totalPages.value \|\| page === props.settings.page) return\n emit('update:pagination', { page, pageSize: props.settings.pageSize })\n}\n\nfunction changePageSize(event: Event) {\n const size = Number((event.target as HTMLSelectElement).value)\n savePageSize(size)\n emit('update:pagination', { page: 1, pageSize: size })\n}\n</script>\n\n<template>\n <div class=\"ac-component\">\n <div class=\"c-paginator-wrapper\">\n <div class=\"c-paginator\">\n <div class=\"c-paginator__info\">\n <span class=\"c-paginator__range\">{{ rangeStart }}–{{ rangeEnd }}</span>\n <span class=\"c-paginator__total\"> / {{ settings.total }}</span>\n </div>\n\n <nav class=\"c-paginator__nav\" aria-label=\"Pagination\">\n <Button\n icon=\"fa-solid fa-chevron-left\"\n rel=\"prev\"\n :disabled=\"settings.page <= 1\"\n :callback=\"() => goToPage(settings.page - 1)\"\n />\n\n <template v-for=\"(p, i) in visiblePages\" :key=\"i\">\n <span v-if=\"p === '...'\" class=\"c-paginator__ellipsis\">…</span>\n <button\n v-else\n type=\"button\"\n class=\"c-paginator__page\"\n :class=\"{\n 'is-active': p === settings.page,\n 'is-hidden-sm': shouldHideOnSmall(p),\n }\"\n @click=\"goToPage(p)\"\n >\n {{ p }}\n </button>\n </template>\n\n <Button\n icon=\"fa-solid fa-chevron-right\"\n rel=\"next\"\n :disabled=\"settings.page >= totalPages\"\n :callback=\"() => goToPage(settings.page + 1)\"\n />\n </nav>\n\n <div class=\"c-paginator__size\">\n <select class=\"c-paginator__select\" :value=\"settings.pageSize\" @change=\"changePageSize\">\n <option v-for=\"s in SIZE_OPTIONS\" :key=\"s\" :value=\"s\">{{ s }} elem / oldal</option>\n </select>\n </div>\n </div>\n </div>\n </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-paginator.scss\"></style>\n"],"mappings":""}