admins-components 9.0.27 → 9.0.29

package/dist/admins-components84.js.map

@@ -1 +1 @@
-{"version":3,"file":"admins-components84.js","names":[],"sources":["../src/components/data-table/DataListGuide.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref } from 'vue'\nimport Sidebar, { type SidebarPosition } from '@/components/Sidebar.vue'\n\nwithDefaults(\n  defineProps<{\n    open?: boolean\n    position?: SidebarPosition\n  }>(),\n  {\n    open: false,\n    position: 'right',\n  },\n)\n\nconst emit = defineEmits<{\n  close: []\n}>()\n\nconst root = ref<HTMLElement | null>(null)\n\nfunction scrollToSection(target: string | null | undefined) {\n  if (!target || !root.value) return\n  const el = root.value.querySelector(`#${target}`)\n  if (el) el.scrollIntoView({ behavior: 'smooth', block: 'start' })\n}\n</script>\n\n<template>\n  <Sidebar :open=\"open\" title=\"Súgó\" :position=\"position\" @close=\"emit('close')\">\n    <div ref=\"root\" class=\"ac-component dl-guide\">\n      <section class=\"dl-guide-section\">\n        <h3 class=\"dl-guide-title\">Tartalom</h3>\n        <ul class=\"dl-guide-toc m-0\">\n          <li>\n            <a\n              href=\"#\"\n              class=\"dl-guide-toc-link dl-guide-toc-link--primary\"\n              @click.prevent=\"scrollToSection('layout')\"\n              >Megjelenés testreszabása</a\n            >\n            <ul>\n              <li class=\"m-0\">\n                <a href=\"#\" class=\"dl-guide-toc-link\" @click.prevent=\"scrollToSection('view')\"\n                  >Nézet</a\n                >\n              </li>\n              <li class=\"m-0\">\n                <a href=\"#\" class=\"dl-guide-toc-link\" @click.prevent=\"scrollToSection('appearance')\"\n                  >Megjelenés</a\n                >\n              </li>\n              <li class=\"m-0\">\n                <a href=\"#\" class=\"dl-guide-toc-link\" @click.prevent=\"scrollToSection('columns')\"\n                  >Oszlopok láthatósága és sorrendje</a\n                >\n              </li>\n              <li class=\"m-0\">\n                <a href=\"#\" class=\"dl-guide-toc-link\" @click.prevent=\"scrollToSection('reset')\"\n                  >Beállítások visszaállítása</a\n                >\n              </li>\n            </ul>\n          </li>\n          <li>\n            <a\n              href=\"#\"\n              class=\"dl-guide-toc-link dl-guide-toc-link--primary\"\n              @click.prevent=\"scrollToSection('filters')\"\n              >Szűrők</a\n            >\n            <ul>\n                 <li class=\"m-0\">\n                <a\n                  href=\"#\"\n                  class=\"dl-guide-toc-link\"\n                  @click.prevent=\"scrollToSection('exact-match')\"\n                  >Pontos egyezés</a\n                >\n              </li>\n              <li class=\"m-0\">\n                <a\n                  href=\"#\"\n                  class=\"dl-guide-toc-link\"\n                  @click.prevent=\"scrollToSection('save-filters')\"\n                  >Szűrések mentése</a\n                >\n              </li>\n            </ul>\n          </li>\n        </ul>\n      </section>\n      <hr class=\"separator\" />\n      <section id=\"layout\" class=\"dl-guide-section\">\n        <h3 class=\"dl-guide-title\">A táblázat megjelenésének testreszabása</h3>\n        <p>\n          A <strong><i class=\"fa-solid fa-gear\"></i> Beállítások</strong> gombra kattintva lehetőség\n          van a tábla megjelenésének testreszabására. A beállítások az adott táblához kapcsolódóan\n          helyi tárolóban kerülnek mentésre, így ugyanazon eszközön és böngészőben megmaradnak a\n          következő látogatáskor is.\n        </p>\n        <hr class=\"separator\" />\n        <h4 id=\"view\" class=\"dl-guide-subtitle\">Nézet</h4>\n        <ul>\n          <li>\n            <i class=\"fa-solid fa-display mr-1\"></i>\n            <strong>Kijelző méretéhez igazodó</strong> (alapértelmezett): A kijelző méretétől\n            függően automatikusan választ a táblázat és a kártyás nézet között.\n          </li>\n          <li>\n            <i class=\"fa-solid fa-table-list mr-1\"></i> <strong>Táblázat:</strong> klasszikus\n            táblázatos megjelenés\n          </li>\n          <li>\n            <i class=\"fa-solid fa-list mr-1\"></i> <strong>Kártyák:</strong> sorok kártyás\n            megjelenítése, a kártya fejlécére kattintva lenyithatóak a részletes adatok.\n          </li>\n        </ul>\n        <hr class=\"separator\" />\n        <h4 id=\"appearance\" class=\"dl-guide-subtitle\">Megjelenés</h4>\n        <ul>\n          <li>\n            <strong>Kompakt:</strong> A sorok közti távolság és a belső margók csökkentésével több\n            adat jeleníthető meg egyszerre.\n          </li>\n          <li>\n            <strong>Sávos (striped):</strong> Csak a táblázatos nézetben elérhető, minden második\n            sor enyhe szürke hátteret kap, ezzel megkönnyítve a sorok követését.\n          </li>\n        </ul>\n        <hr class=\"separator\" />\n        <h4 id=\"columns\" class=\"dl-guide-subtitle\">Oszlopok láthatósága és sorrendje</h4>\n        <ul>\n          <li>\n            <strong>Kártya fejléc:</strong> kártyás nézet esetén a fejlécben megjelenő mezők\n            láthatósága és sorrendje.\n          </li>\n          <li>\n            <strong>Oszlopok:</strong> táblázat nézetben az oszlopok láthatósága és sorrendje.\n          </li>\n        </ul>\n        <p>\n          A sorrend módosítása történhet az <i class=\"fa-solid fa-grip-vertical\"></i> ikonon\n          <strong class=\"nowrap\">drag-n-drop</strong>al vagy az ikonra kattinva a megjelenő nyilak\n          segítségével.\n        </p>\n        <hr class=\"separator\" />\n\n        <h4 id=\"reset\" class=\"dl-guide-subtitle\">Beállítások visszaállítása</h4>\n        <p>\n          Az\n          <strong>Alapértelmezés visszaállítása</strong> gomb visszaállítja a gyári értékeket, és\n          törli a helyi tárolóban elmentett beállításokat.\n        </p>\n      </section>\n      <hr class=\"separator\" />\n      <section id=\"filters\" class=\"dl-guide-section\">\n        <h3 class=\"dl-guide-title\">Szűrők</h3>\n        <h4 id=\"exact-match\" class=\"dl-guide-subtitle\">Pontos egyezés</h4>\n        <p>\n          Amennyiben a táblázhoz tartozik szabad szavas keresés, a pontos egyezés opciót használva\n          csak azokat a találatokat kapjuk, amelyek teljes mértékben megfelelnek a keresett\n          kifejezésnek. Pl. alap esetben <strong><em>\"alma\"</em></strong> keresésre a <strong><em>\"piros alma\"</em></strong>, <strong><em>\"almafa\"</em></strong>, <strong><em>\"alma\"</em></strong> vagy\n          <strong><em>\"almás pite\"</em></strong> is találat lehet, míg pontos egyezés esetén csak az <strong><em>\"alma\"</em></strong> található meg.\n        </p>\n<hr class=\"separator\" />\n        <h4 id=\"save-filters\" class=\"dl-guide-subtitle\">Szűrések mentése</h4>\n        <p>\n          A <strong><i class=\"fa-solid fa-sliders\"></i> Mentett szűrők</strong>re kattintva\n          lehetőség van elmenteni az aktuális szűrési feltételeket, így később egyetlen kattintással\n          előhívhatja azokat.\n        </p>\n        <p>\n          A szűrési feltételek megadása után a\n          <strong><i class=\"fa-solid fa-bookmark fa-sm\"></i> Mentés</strong> gomb megnyomásával\n          elmenthető a szűrőkészlet. Az elnevezés megadása nem kötelező, csak saját magadnak szól a\n          későbbi könnyebb azonosítás érdekében.\n        </p>\n        <p>\n          Ezt követően a szűrőkészlet a mentés dátumával és elnevezésével jelenik meg a mentett\n          szűrők között. Ezekre kattintva lenyithatók a szűrőkészlet részletei.\n        </p>\n        <p>A mentett készlet jobb oldalán található 3 ikon:</p>\n        <ul>\n          <li>\n            <i class=\"fa-solid fa-check\"></i>: ikonra kattintva tölthetők be a készletek.\n            Megnyomásakor a szűrési feltételek automatikusan kitöltődnek az elmentett értékekkel.\n          </li>\n\n          <li>\n            <span class=\"c-indicator\">?</span>: azt mutatja, hogy hány szűrési feltétel van a\n            készletben.\n          </li>\n          <li>\n            <i class=\"fa-solid fa-xmark\"></i>: a mentett szűrőkészlet törlése (a művelet\n            megerősítést kér).\n          </li>\n        </ul>\n        <p class=\"dl-guide-note\">Táblázatonként maximum <strong>20</strong> készlet menthető el.</p>\n        <p>\n          A lista alján található \"Összes törlése\" gombbal törölhető a táblához tartozó minden\n          elmentett szűrőkészlet.\n        </p>\n\n        <p class=\"dl-guide-note\">\n          <strong>Fontos:</strong> a beállítások és a szűrők is csak böngészőben (localStorage)\n          kerülnek tárolásra, ezért más eszközön vagy böngészőben nem lesznek elérhetőek.\n        </p>\n      </section>\n    </div>\n  </Sidebar>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-list-guide.scss\"></style>\n"],"mappings":"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"}
+{"version":3,"file":"admins-components84.js","names":[],"sources":["../src/components/data-table/FilterTags.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { FilterItem } from '@/components/data-table/DataFilters.vue'\nimport { displayFilterValue } from '@/utils/filterDisplay'\n\nconst props = defineProps<{\n  filters: Record<string, any>\n  items: FilterItem[]\n  itemClass?: string\n}>()\nconst emit = defineEmits<{\n  remove: [key: string]\n  openFilter: [key: string]\n}>()\n\nfunction getFilterItem(key: string): FilterItem | undefined {\n  return props.items.find((i) => i.key === key)\n}\n\nfunction getLabel(key: string): string {\n  return getFilterItem(key)?.label ?? key\n}\n</script>\n\n<template>\n  <div class=\"filter-tags ac-component gap-1\">\n    <template v-for=\"(value, key) in filters\" :key=\"key\">\n      <span\n        v-if=\"value != null && value !== ''\"\n        class=\"filter-tags__tag c-chip\"\n        :class=\"[itemClass, getFilterItem(key)?.displayClass]\"\n      >\n        <span\n          class=\"filter-tags__content align-center-fix\"\n          @click=\"emit('openFilter', String(key))\"\n        >\n          <span class=\"filter-tags__key\">{{ getLabel(String(key)) }}:</span>\n          <span class=\"filter-tags__value\" :title=\"displayFilterValue(items, String(key), value)\">{{\n            displayFilterValue(items, String(key), value)\n          }}</span>\n        </span>\n\n        <button\n          type=\"button\"\n          class=\"filter-tags__remove\"\n          @click=\"emit('remove', String(key))\"\n          aria-label=\"Remove filter\"\n        >\n          <i class=\"fa-solid fa-fw fa-xmark\"></i>\n        </button>\n      </span>\n    </template>\n  </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/filter-tags.scss\"></style>\n"],"mappings":";;;;;;;;;;;;EAIA,IAAM,IAAQ,GAKR,IAAO;EAKb,SAAS,EAAc,GAAqC;GAC1D,OAAO,EAAM,MAAM,MAAM,MAAM,EAAE,QAAQ,CAAG;EAC9C;EAEA,SAAS,EAAS,GAAqB;GACrC,OAAO,EAAc,CAAG,GAAG,SAAS;EACtC;yBAIE,EA2BM,OA3BN,GA2BM,EAAA,EAAA,EAAA,GA1BJ,EAyBW,GAAA,MAAA,EAzBsB,EAAA,UAAf,GAAO,mBAAuB,OAAG,GAAA,CAEzC,KAAK,QAAY,MAAK,MAAA,EAAA,GAD9B,EAuBO,QAAA;;GArBL,OAAK,EAAA,CAAC,2BAAyB,CACtB,EAAA,WAAW,EAAc,CAAG,GAAG,YAAY,CAAA,CAAA;MAEpD,EAQO,QAAA;GAPL,OAAM;GACL,UAAK,MAAE,EAAI,cAAe,OAAO,CAAG,CAAA;MAErC,EAAkE,QAAlE,GAAkE,EAAhC,EAAS,OAAO,CAAG,CAAA,CAAA,IAAK,KAAC,CAAA,GAC3D,EAES,QAAA;GAFH,OAAM;GAAsB,OAAO,EAAA,CAAA,EAAmB,EAAA,OAAO,OAAO,CAAG,GAAG,CAAK;OACnF,EAAA,CAAA,EAAmB,EAAA,OAAO,OAAO,CAAG,GAAG,CAAK,CAAA,GAAA,GAAA,CAAA,CAAA,GAAA,GAAA,CAAA,GAIhD,EAOS,UAAA;GANP,MAAK;GACL,OAAM;GACL,UAAK,MAAE,EAAI,UAAW,OAAO,CAAG,CAAA;GACjC,cAAW;mBAEX,EAAuC,KAAA,EAApC,OAAM,0BAAyB,GAAA,MAAA,EAAA,CAAA,CAAA,GAAA,GAAA,CAAA,CAAA,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,GAAA,EAAA"}

package/dist/admins-components86.js

@@ -1,7 +1,7 @@
-import './src/styles/components/data-table/data-list-guide.scss_vue_type_style_index_0_src_true_lang.css';
+import './src/styles/components/data-table/filter-tags.scss_vue_type_style_index_0_src_true_lang.css';
 import e from "./admins-components84.js";
 /* empty css                    */
-//#region src/components/data-table/DataListGuide.vue
+//#region src/components/data-table/FilterTags.vue
 var t = e;
 //#endregion
 export { t as default };

package/dist/admins-components86.js.map

@@ -1 +1 @@
-{"version":3,"file":"admins-components86.js","names":[],"sources":["../src/components/data-table/DataListGuide.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref } from 'vue'\nimport Sidebar, { type SidebarPosition } from '@/components/Sidebar.vue'\n\nwithDefaults(\n  defineProps<{\n    open?: boolean\n    position?: SidebarPosition\n  }>(),\n  {\n    open: false,\n    position: 'right',\n  },\n)\n\nconst emit = defineEmits<{\n  close: []\n}>()\n\nconst root = ref<HTMLElement | null>(null)\n\nfunction scrollToSection(target: string | null | undefined) {\n  if (!target || !root.value) return\n  const el = root.value.querySelector(`#${target}`)\n  if (el) el.scrollIntoView({ behavior: 'smooth', block: 'start' })\n}\n</script>\n\n<template>\n  <Sidebar :open=\"open\" title=\"Súgó\" :position=\"position\" @close=\"emit('close')\">\n    <div ref=\"root\" class=\"ac-component dl-guide\">\n      <section class=\"dl-guide-section\">\n        <h3 class=\"dl-guide-title\">Tartalom</h3>\n        <ul class=\"dl-guide-toc m-0\">\n          <li>\n            <a\n              href=\"#\"\n              class=\"dl-guide-toc-link dl-guide-toc-link--primary\"\n              @click.prevent=\"scrollToSection('layout')\"\n              >Megjelenés testreszabása</a\n            >\n            <ul>\n              <li class=\"m-0\">\n                <a href=\"#\" class=\"dl-guide-toc-link\" @click.prevent=\"scrollToSection('view')\"\n                  >Nézet</a\n                >\n              </li>\n              <li class=\"m-0\">\n                <a href=\"#\" class=\"dl-guide-toc-link\" @click.prevent=\"scrollToSection('appearance')\"\n                  >Megjelenés</a\n                >\n              </li>\n              <li class=\"m-0\">\n                <a href=\"#\" class=\"dl-guide-toc-link\" @click.prevent=\"scrollToSection('columns')\"\n                  >Oszlopok láthatósága és sorrendje</a\n                >\n              </li>\n              <li class=\"m-0\">\n                <a href=\"#\" class=\"dl-guide-toc-link\" @click.prevent=\"scrollToSection('reset')\"\n                  >Beállítások visszaállítása</a\n                >\n              </li>\n            </ul>\n          </li>\n          <li>\n            <a\n              href=\"#\"\n              class=\"dl-guide-toc-link dl-guide-toc-link--primary\"\n              @click.prevent=\"scrollToSection('filters')\"\n              >Szűrők</a\n            >\n            <ul>\n                 <li class=\"m-0\">\n                <a\n                  href=\"#\"\n                  class=\"dl-guide-toc-link\"\n                  @click.prevent=\"scrollToSection('exact-match')\"\n                  >Pontos egyezés</a\n                >\n              </li>\n              <li class=\"m-0\">\n                <a\n                  href=\"#\"\n                  class=\"dl-guide-toc-link\"\n                  @click.prevent=\"scrollToSection('save-filters')\"\n                  >Szűrések mentése</a\n                >\n              </li>\n            </ul>\n          </li>\n        </ul>\n      </section>\n      <hr class=\"separator\" />\n      <section id=\"layout\" class=\"dl-guide-section\">\n        <h3 class=\"dl-guide-title\">A táblázat megjelenésének testreszabása</h3>\n        <p>\n          A <strong><i class=\"fa-solid fa-gear\"></i> Beállítások</strong> gombra kattintva lehetőség\n          van a tábla megjelenésének testreszabására. A beállítások az adott táblához kapcsolódóan\n          helyi tárolóban kerülnek mentésre, így ugyanazon eszközön és böngészőben megmaradnak a\n          következő látogatáskor is.\n        </p>\n        <hr class=\"separator\" />\n        <h4 id=\"view\" class=\"dl-guide-subtitle\">Nézet</h4>\n        <ul>\n          <li>\n            <i class=\"fa-solid fa-display mr-1\"></i>\n            <strong>Kijelző méretéhez igazodó</strong> (alapértelmezett): A kijelző méretétől\n            függően automatikusan választ a táblázat és a kártyás nézet között.\n          </li>\n          <li>\n            <i class=\"fa-solid fa-table-list mr-1\"></i> <strong>Táblázat:</strong> klasszikus\n            táblázatos megjelenés\n          </li>\n          <li>\n            <i class=\"fa-solid fa-list mr-1\"></i> <strong>Kártyák:</strong> sorok kártyás\n            megjelenítése, a kártya fejlécére kattintva lenyithatóak a részletes adatok.\n          </li>\n        </ul>\n        <hr class=\"separator\" />\n        <h4 id=\"appearance\" class=\"dl-guide-subtitle\">Megjelenés</h4>\n        <ul>\n          <li>\n            <strong>Kompakt:</strong> A sorok közti távolság és a belső margók csökkentésével több\n            adat jeleníthető meg egyszerre.\n          </li>\n          <li>\n            <strong>Sávos (striped):</strong> Csak a táblázatos nézetben elérhető, minden második\n            sor enyhe szürke hátteret kap, ezzel megkönnyítve a sorok követését.\n          </li>\n        </ul>\n        <hr class=\"separator\" />\n        <h4 id=\"columns\" class=\"dl-guide-subtitle\">Oszlopok láthatósága és sorrendje</h4>\n        <ul>\n          <li>\n            <strong>Kártya fejléc:</strong> kártyás nézet esetén a fejlécben megjelenő mezők\n            láthatósága és sorrendje.\n          </li>\n          <li>\n            <strong>Oszlopok:</strong> táblázat nézetben az oszlopok láthatósága és sorrendje.\n          </li>\n        </ul>\n        <p>\n          A sorrend módosítása történhet az <i class=\"fa-solid fa-grip-vertical\"></i> ikonon\n          <strong class=\"nowrap\">drag-n-drop</strong>al vagy az ikonra kattinva a megjelenő nyilak\n          segítségével.\n        </p>\n        <hr class=\"separator\" />\n\n        <h4 id=\"reset\" class=\"dl-guide-subtitle\">Beállítások visszaállítása</h4>\n        <p>\n          Az\n          <strong>Alapértelmezés visszaállítása</strong> gomb visszaállítja a gyári értékeket, és\n          törli a helyi tárolóban elmentett beállításokat.\n        </p>\n      </section>\n      <hr class=\"separator\" />\n      <section id=\"filters\" class=\"dl-guide-section\">\n        <h3 class=\"dl-guide-title\">Szűrők</h3>\n        <h4 id=\"exact-match\" class=\"dl-guide-subtitle\">Pontos egyezés</h4>\n        <p>\n          Amennyiben a táblázhoz tartozik szabad szavas keresés, a pontos egyezés opciót használva\n          csak azokat a találatokat kapjuk, amelyek teljes mértékben megfelelnek a keresett\n          kifejezésnek. Pl. alap esetben <strong><em>\"alma\"</em></strong> keresésre a <strong><em>\"piros alma\"</em></strong>, <strong><em>\"almafa\"</em></strong>, <strong><em>\"alma\"</em></strong> vagy\n          <strong><em>\"almás pite\"</em></strong> is találat lehet, míg pontos egyezés esetén csak az <strong><em>\"alma\"</em></strong> található meg.\n        </p>\n<hr class=\"separator\" />\n        <h4 id=\"save-filters\" class=\"dl-guide-subtitle\">Szűrések mentése</h4>\n        <p>\n          A <strong><i class=\"fa-solid fa-sliders\"></i> Mentett szűrők</strong>re kattintva\n          lehetőség van elmenteni az aktuális szűrési feltételeket, így később egyetlen kattintással\n          előhívhatja azokat.\n        </p>\n        <p>\n          A szűrési feltételek megadása után a\n          <strong><i class=\"fa-solid fa-bookmark fa-sm\"></i> Mentés</strong> gomb megnyomásával\n          elmenthető a szűrőkészlet. Az elnevezés megadása nem kötelező, csak saját magadnak szól a\n          későbbi könnyebb azonosítás érdekében.\n        </p>\n        <p>\n          Ezt követően a szűrőkészlet a mentés dátumával és elnevezésével jelenik meg a mentett\n          szűrők között. Ezekre kattintva lenyithatók a szűrőkészlet részletei.\n        </p>\n        <p>A mentett készlet jobb oldalán található 3 ikon:</p>\n        <ul>\n          <li>\n            <i class=\"fa-solid fa-check\"></i>: ikonra kattintva tölthetők be a készletek.\n            Megnyomásakor a szűrési feltételek automatikusan kitöltődnek az elmentett értékekkel.\n          </li>\n\n          <li>\n            <span class=\"c-indicator\">?</span>: azt mutatja, hogy hány szűrési feltétel van a\n            készletben.\n          </li>\n          <li>\n            <i class=\"fa-solid fa-xmark\"></i>: a mentett szűrőkészlet törlése (a művelet\n            megerősítést kér).\n          </li>\n        </ul>\n        <p class=\"dl-guide-note\">Táblázatonként maximum <strong>20</strong> készlet menthető el.</p>\n        <p>\n          A lista alján található \"Összes törlése\" gombbal törölhető a táblához tartozó minden\n          elmentett szűrőkészlet.\n        </p>\n\n        <p class=\"dl-guide-note\">\n          <strong>Fontos:</strong> a beállítások és a szűrők is csak böngészőben (localStorage)\n          kerülnek tárolásra, ezért más eszközön vagy böngészőben nem lesznek elérhetőek.\n        </p>\n      </section>\n    </div>\n  </Sidebar>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-list-guide.scss\"></style>\n"],"mappings":""}
+{"version":3,"file":"admins-components86.js","names":[],"sources":["../src/components/data-table/FilterTags.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { FilterItem } from '@/components/data-table/DataFilters.vue'\nimport { displayFilterValue } from '@/utils/filterDisplay'\n\nconst props = defineProps<{\n  filters: Record<string, any>\n  items: FilterItem[]\n  itemClass?: string\n}>()\nconst emit = defineEmits<{\n  remove: [key: string]\n  openFilter: [key: string]\n}>()\n\nfunction getFilterItem(key: string): FilterItem | undefined {\n  return props.items.find((i) => i.key === key)\n}\n\nfunction getLabel(key: string): string {\n  return getFilterItem(key)?.label ?? key\n}\n</script>\n\n<template>\n  <div class=\"filter-tags ac-component gap-1\">\n    <template v-for=\"(value, key) in filters\" :key=\"key\">\n      <span\n        v-if=\"value != null && value !== ''\"\n        class=\"filter-tags__tag c-chip\"\n        :class=\"[itemClass, getFilterItem(key)?.displayClass]\"\n      >\n        <span\n          class=\"filter-tags__content align-center-fix\"\n          @click=\"emit('openFilter', String(key))\"\n        >\n          <span class=\"filter-tags__key\">{{ getLabel(String(key)) }}:</span>\n          <span class=\"filter-tags__value\" :title=\"displayFilterValue(items, String(key), value)\">{{\n            displayFilterValue(items, String(key), value)\n          }}</span>\n        </span>\n\n        <button\n          type=\"button\"\n          class=\"filter-tags__remove\"\n          @click=\"emit('remove', String(key))\"\n          aria-label=\"Remove filter\"\n        >\n          <i class=\"fa-solid fa-fw fa-xmark\"></i>\n        </button>\n      </span>\n    </template>\n  </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/filter-tags.scss\"></style>\n"],"mappings":""}

package/dist/admins-components87.js

@@ -1,188 +1,199 @@
-import e from "./admins-components6.js";
-import t from "./admins-components61.js";
-import n from "./admins-components64.js";
-import r from "./admins-components68.js";
-import i from "./admins-components71.js";
-import { getFilterParams as a } from "./admins-components77.js";
-import o from "./admins-components80.js";
-import s from "./admins-components83.js";
-import c from "./admins-components86.js";
-import { Fragment as l, computed as u, createBlock as d, createCommentVNode as f, createElementBlock as p, createElementVNode as m, createVNode as h, defineComponent as g, mergeDefaults as _, onBeforeUnmount as v, onMounted as y, openBlock as b, ref as x } from "vue";
-//#region src/components/data-table/DataList.vue?vue&type=script&setup=true&lang.ts
-var S = { class: "ac-component" }, C = { class: "flex-center gap-2 mb-3 wrap-on-small" }, w = { class: "flex-center gap-1" }, T = { class: "c-data-list__toolbar" }, E = {
-	layoutBreakpoint: 768,
-	orderable: !0,
-	historyEnabled: !0,
-	loading: !1,
-	handleUrl: !1
-}, D = /* @__PURE__ */ g({
-	__name: "DataList",
-	props: /* @__PURE__ */ _({
-		config: {},
-		items: {},
-		settings: {},
-		id: {},
-		layoutBreakpoint: {},
-		orderable: { type: Boolean },
-		pagination: {},
-		filters: {},
-		historyEnabled: { type: Boolean },
-		loading: { type: Boolean },
-		handleUrl: { type: Boolean }
-	}, { ...E }),
-	emits: [
-		"filter-change",
-		"selection-change",
-		"settings-change",
-		"pagination-change",
-		"sort-change"
-	],
-	setup(g, { expose: _, emit: E }) {
-		let D = x(null), O = g, k = E, A = x(!1), j = x(!1), M = x(null), N = x(!1), P = x(null), F = x(!1), I = x(O.filters ? a(O.filters) ?? {} : {}), L = null;
-		y(() => {
-			L = new ResizeObserver((e) => {
-				N.value = (e[0]?.contentRect.width ?? 0) < O.layoutBreakpoint;
-			}), P.value && L.observe(P.value);
-		}), v(() => L?.disconnect());
-		let R = u(() => {
-			let e = M.value?.layout;
-			return e === "table" || e === "cards" ? e : N.value ? "cards" : "table";
-		}), z = u(() => {
-			if (!M.value) return O.config;
-			let e = M.value.columnOrder, t = O.config.columns.map((e) => ({
-				...e,
-				visible: M.value.columns[e.property] ?? e.visible !== !1
-			}));
-			return e?.length && t.sort((t, n) => {
-				let r = e.indexOf(t.property), i = e.indexOf(n.property);
-				return (r === -1 ? 999 : r) - (i === -1 ? 999 : i);
-			}), {
-				...O.config,
-				columns: t
-			};
-		});
-		function B(e) {
-			M.value = e, k("settings-change", e);
+import e from "./admins-components31.js";
+import { createBlock as t, createElementVNode as n, createTextVNode as r, defineComponent as i, openBlock as a, ref as o, withCtx as s, withModifiers as c } from "vue";
+//#region src/components/data-table/DataListGuide.vue?vue&type=script&setup=true&lang.ts
+var l = { class: "dl-guide-section" }, u = { class: "dl-guide-toc m-0" }, d = { class: "m-0" }, f = { class: "m-0" }, p = { class: "m-0" }, m = { class: "m-0" }, h = { class: "m-0" }, g = { class: "m-0" }, _ = /* @__PURE__ */ i({
+	__name: "DataListGuide",
+	props: {
+		open: {
+			type: Boolean,
+			default: !1
+		},
+		position: { default: "right" }
+	},
+	emits: ["close"],
+	setup(i, { emit: _ }) {
+		let v = _, y = o(null);
+		function b(e) {
+			if (!e || !y.value) return;
+			let t = y.value.querySelector(`#${e}`);
+			t && t.scrollIntoView({
+				behavior: "smooth",
+				block: "start"
+			});
 		}
-		_({
-			openOptions: () => A.value = !0,
-			closeOptions: () => A.value = !1,
-			openFilters: () => F.value = !0,
-			closeFilters: () => F.value = !1
-		});
-		async function V(e) {
-			F.value = !0, setTimeout(() => {
-				D.value?.focusFilter(e);
-			}, 300);
-		}
-		function H(e) {
-			I.value = e.values, k("filter-change", e.transformed);
-		}
-		let U = u(() => Object.values(I.value).filter((e) => e != null && e !== "").length), W = u(() => !!O.pagination && (O.items.length > 0 || !O.loading));
-		return (a, u) => (b(), p("div", S, [m("div", {
-			ref_key: "root",
-			ref: P,
-			class: "c-data-list"
-		}, [
-			g.filters && g.filters.length > 0 ? (b(), p(l, { key: 0 }, [m("div", C, [h(e, {
-				label: "Szűrők megnyitása",
-				icon: "fa-solid fa-filter",
-				onClick: u[0] ||= (e) => F.value = !0,
-				style: { "flex-shrink": "0" },
-				type: U.value > 0 ? "info" : "normal",
-				indicator: U.value > 0 ? U.value : void 0
-			}, null, 8, ["type", "indicator"]), m("div", w, [h(s, {
-				filters: I.value,
-				items: g.filters,
-				onRemove: u[1] ||= (e) => D.value?.clearFilter(e),
-				onOpenFilter: V
-			}, null, 8, ["filters", "items"])])]), h(o, {
-				ref_key: "dataFiltersRef",
-				ref: D,
-				open: F.value,
-				items: g.filters,
-				"history-enabled": g.historyEnabled,
-				lazy: "",
-				"handle-url": g.handleUrl,
-				"storage-key": g.id,
-				onClose: u[2] ||= (e) => F.value = !1,
-				onChange: H
-			}, null, 8, [
-				"open",
-				"items",
-				"history-enabled",
-				"handle-url",
-				"storage-key"
-			])], 64)) : f("", !0),
-			m("div", T, [h(e, {
-				label: "Beállítások",
-				icon: "fa-solid fa-gear",
-				class: "c-data-list__toolbar__item",
-				size: "small",
-				onClick: u[3] ||= (e) => A.value = !0
-			}), h(e, {
-				label: "Súgó",
-				icon: "fa-solid fa-question",
-				"icon-position": "right",
-				class: "c-data-list__toolbar__item ml-auto",
-				"label-alignment-fix": "",
-				size: "small",
-				onClick: u[4] ||= (e) => j.value = !0
-			})]),
-			h(c, {
-				open: j.value,
-				onClose: u[5] ||= (e) => j.value = !1
-			}, null, 8, ["open"]),
-			R.value === "table" ? (b(), d(t, {
-				key: 1,
-				config: z.value,
-				loading: g.loading,
-				items: g.items,
-				settings: M.value ?? void 0,
-				onFilterChange: u[6] ||= (e) => k("filter-change", e),
-				onSelectionChange: u[7] ||= (e) => k("selection-change", e),
-				onSortChange: u[8] ||= (e) => k("sort-change", e)
-			}, null, 8, [
-				"config",
-				"loading",
-				"items",
-				"settings"
-			])) : (b(), d(n, {
-				key: 2,
-				config: z.value,
-				loading: g.loading,
-				items: g.items,
-				settings: M.value ?? void 0,
-				onSelectionChange: u[9] ||= (e) => k("selection-change", e)
-			}, null, 8, [
-				"config",
-				"loading",
-				"items",
-				"settings"
-			])),
-			g.pagination && W.value ? (b(), d(i, {
-				key: 3,
-				settings: g.pagination,
-				"storage-key": g.id,
-				"onUpdate:pagination": u[10] ||= (e) => k("pagination-change", e)
-			}, null, 8, ["settings", "storage-key"])) : f("", !0),
-			h(r, {
-				open: A.value,
-				columns: g.config.columns,
-				settings: g.settings ?? {},
-				"storage-key": g.id,
-				orderable: g.orderable,
-				onClose: u[11] ||= (e) => A.value = !1,
-				onChange: B
-			}, null, 8, [
-				"open",
-				"columns",
-				"settings",
-				"storage-key",
-				"orderable"
-			])
-		], 512)]));
+		return (o, _) => (a(), t(e, {
+			open: i.open,
+			title: "Súgó",
+			position: i.position,
+			onClose: _[8] ||= (e) => v("close")
+		}, {
+			default: s(() => [n("div", {
+				ref_key: "root",
+				ref: y,
+				class: "ac-component dl-guide"
+			}, [
+				n("section", l, [_[9] ||= n("h3", { class: "dl-guide-title" }, "Tartalom", -1), n("ul", u, [n("li", null, [n("a", {
+					href: "#",
+					class: "dl-guide-toc-link dl-guide-toc-link--primary",
+					onClick: _[0] ||= c((e) => b("layout"), ["prevent"])
+				}, "Megjelenés testreszabása"), n("ul", null, [
+					n("li", d, [n("a", {
+						href: "#",
+						class: "dl-guide-toc-link",
+						onClick: _[1] ||= c((e) => b("view"), ["prevent"])
+					}, "Nézet")]),
+					n("li", f, [n("a", {
+						href: "#",
+						class: "dl-guide-toc-link",
+						onClick: _[2] ||= c((e) => b("appearance"), ["prevent"])
+					}, "Megjelenés")]),
+					n("li", p, [n("a", {
+						href: "#",
+						class: "dl-guide-toc-link",
+						onClick: _[3] ||= c((e) => b("columns"), ["prevent"])
+					}, "Oszlopok láthatósága és sorrendje")]),
+					n("li", m, [n("a", {
+						href: "#",
+						class: "dl-guide-toc-link",
+						onClick: _[4] ||= c((e) => b("reset"), ["prevent"])
+					}, "Beállítások visszaállítása")])
+				])]), n("li", null, [n("a", {
+					href: "#",
+					class: "dl-guide-toc-link dl-guide-toc-link--primary",
+					onClick: _[5] ||= c((e) => b("filters"), ["prevent"])
+				}, "Szűrők"), n("ul", null, [n("li", h, [n("a", {
+					href: "#",
+					class: "dl-guide-toc-link",
+					onClick: _[6] ||= c((e) => b("exact-match"), ["prevent"])
+				}, "Pontos egyezés")]), n("li", g, [n("a", {
+					href: "#",
+					class: "dl-guide-toc-link",
+					onClick: _[7] ||= c((e) => b("save-filters"), ["prevent"])
+				}, "Szűrések mentése")])])])])]),
+				_[10] ||= n("hr", { class: "separator" }, null, -1),
+				_[11] ||= n("section", {
+					id: "layout",
+					class: "dl-guide-section"
+				}, [
+					n("h3", { class: "dl-guide-title" }, "A táblázat megjelenésének testreszabása"),
+					n("p", null, [
+						r(" A "),
+						n("strong", null, [n("i", { class: "fa-solid fa-gear" }), r(" Beállítások")]),
+						r(" gombra kattintva lehetőség van a tábla megjelenésének testreszabására. A beállítások az adott táblához kapcsolódóan helyi tárolóban kerülnek mentésre, így ugyanazon eszközön és böngészőben megmaradnak a következő látogatáskor is. ")
+					]),
+					n("hr", { class: "separator" }),
+					n("h4", {
+						id: "view",
+						class: "dl-guide-subtitle"
+					}, "Nézet"),
+					n("ul", null, [
+						n("li", null, [
+							n("i", { class: "fa-solid fa-display mr-1" }),
+							n("strong", null, "Kijelző méretéhez igazodó"),
+							r(" (alapértelmezett): A kijelző méretétől függően automatikusan választ a táblázat és a kártyás nézet között. ")
+						]),
+						n("li", null, [
+							n("i", { class: "fa-solid fa-table-list mr-1" }),
+							r(),
+							n("strong", null, "Táblázat:"),
+							r(" klasszikus táblázatos megjelenés ")
+						]),
+						n("li", null, [
+							n("i", { class: "fa-solid fa-list mr-1" }),
+							r(),
+							n("strong", null, "Kártyák:"),
+							r(" sorok kártyás megjelenítése, a kártya fejlécére kattintva lenyithatóak a részletes adatok. ")
+						])
+					]),
+					n("hr", { class: "separator" }),
+					n("h4", {
+						id: "appearance",
+						class: "dl-guide-subtitle"
+					}, "Megjelenés"),
+					n("ul", null, [n("li", null, [n("strong", null, "Kompakt:"), r(" A sorok közti távolság és a belső margók csökkentésével több adat jeleníthető meg egyszerre. ")]), n("li", null, [n("strong", null, "Sávos (striped):"), r(" Csak a táblázatos nézetben elérhető, minden második sor enyhe szürke hátteret kap, ezzel megkönnyítve a sorok követését. ")])]),
+					n("hr", { class: "separator" }),
+					n("h4", {
+						id: "columns",
+						class: "dl-guide-subtitle"
+					}, "Oszlopok láthatósága és sorrendje"),
+					n("ul", null, [n("li", null, [n("strong", null, "Kártya fejléc:"), r(" kártyás nézet esetén a fejlécben megjelenő mezők láthatósága és sorrendje. ")]), n("li", null, [n("strong", null, "Oszlopok:"), r(" táblázat nézetben az oszlopok láthatósága és sorrendje. ")])]),
+					n("p", null, [
+						r(" A sorrend módosítása történhet az "),
+						n("i", { class: "fa-solid fa-grip-vertical" }),
+						r(" ikonon "),
+						n("strong", { class: "nowrap" }, "drag-n-drop"),
+						r("al vagy az ikonra kattinva a megjelenő nyilak segítségével. ")
+					]),
+					n("hr", { class: "separator" }),
+					n("h4", {
+						id: "reset",
+						class: "dl-guide-subtitle"
+					}, "Beállítások visszaállítása"),
+					n("p", null, [
+						r(" Az "),
+						n("strong", null, "Alapértelmezés visszaállítása"),
+						r(" gomb visszaállítja a gyári értékeket, és törli a helyi tárolóban elmentett beállításokat. ")
+					])
+				], -1),
+				_[12] ||= n("hr", { class: "separator" }, null, -1),
+				_[13] ||= n("section", {
+					id: "filters",
+					class: "dl-guide-section"
+				}, [
+					n("h3", { class: "dl-guide-title" }, "Szűrők"),
+					n("h4", {
+						id: "exact-match",
+						class: "dl-guide-subtitle"
+					}, "Pontos egyezés"),
+					n("p", null, [
+						r(" Amennyiben a táblázhoz tartozik szabad szavas keresés, a pontos egyezés opciót használva csak azokat a találatokat kapjuk, amelyek teljes mértékben megfelelnek a keresett kifejezésnek. Pl. alap esetben "),
+						n("strong", null, [n("em", null, "\"alma\"")]),
+						r(" keresésre a "),
+						n("strong", null, [n("em", null, "\"piros alma\"")]),
+						r(", "),
+						n("strong", null, [n("em", null, "\"almafa\"")]),
+						r(", "),
+						n("strong", null, [n("em", null, "\"alma\"")]),
+						r(" vagy "),
+						n("strong", null, [n("em", null, "\"almás pite\"")]),
+						r(" is találat lehet, míg pontos egyezés esetén csak az "),
+						n("strong", null, [n("em", null, "\"alma\"")]),
+						r(" található meg. ")
+					]),
+					n("hr", { class: "separator" }),
+					n("h4", {
+						id: "save-filters",
+						class: "dl-guide-subtitle"
+					}, "Szűrések mentése"),
+					n("p", null, [
+						r(" A "),
+						n("strong", null, [n("i", { class: "fa-solid fa-sliders" }), r(" Mentett szűrők")]),
+						r("re kattintva lehetőség van elmenteni az aktuális szűrési feltételeket, így később egyetlen kattintással előhívhatja azokat. ")
+					]),
+					n("p", null, [
+						r(" A szűrési feltételek megadása után a "),
+						n("strong", null, [n("i", { class: "fa-solid fa-bookmark fa-sm" }), r(" Mentés")]),
+						r(" gomb megnyomásával elmenthető a szűrőkészlet. Az elnevezés megadása nem kötelező, csak saját magadnak szól a későbbi könnyebb azonosítás érdekében. ")
+					]),
+					n("p", null, " Ezt követően a szűrőkészlet a mentés dátumával és elnevezésével jelenik meg a mentett szűrők között. Ezekre kattintva lenyithatók a szűrőkészlet részletei. "),
+					n("p", null, "A mentett készlet jobb oldalán található 3 ikon:"),
+					n("ul", null, [
+						n("li", null, [n("i", { class: "fa-solid fa-check" }), r(": ikonra kattintva tölthetők be a készletek. Megnyomásakor a szűrési feltételek automatikusan kitöltődnek az elmentett értékekkel. ")]),
+						n("li", null, [n("span", { class: "c-indicator" }, "?"), r(": azt mutatja, hogy hány szűrési feltétel van a készletben. ")]),
+						n("li", null, [n("i", { class: "fa-solid fa-xmark" }), r(": a mentett szűrőkészlet törlése (a művelet megerősítést kér). ")])
+					]),
+					n("p", { class: "dl-guide-note" }, [
+						r("Táblázatonként maximum "),
+						n("strong", null, "20"),
+						r(" készlet menthető el.")
+					]),
+					n("p", null, " A lista alján található \"Összes törlése\" gombbal törölhető a táblához tartozó minden elmentett szűrőkészlet. "),
+					n("p", { class: "dl-guide-note" }, [n("strong", null, "Fontos:"), r(" a beállítások és a szűrők is csak böngészőben (localStorage) kerülnek tárolásra, ezért más eszközön vagy böngészőben nem lesznek elérhetőek. ")])
+				], -1)
+			], 512)]),
+			_: 1
+		}, 8, ["open", "position"]));
 	}
 });
 //#endregion
-export { E as dataListDefaults, D as default };
+export { _ as default };

package/dist/admins-components87.js.map

@@ -1 +1 @@
-{"version":3,"file":"admins-components87.js","names":[],"sources":["../src/components/data-table/DataList.vue"],"sourcesContent":["<script lang=\"ts\">\nexport type { PaginatorSettings } from '@/types/data-list'\n\nexport interface DataListProps {\n  config: DataListConfig\n  items: Record<string, unknown>[]\n  settings?: Partial<DataListSettings>\n  id: string\n  layoutBreakpoint?: number\n  orderable?: boolean\n  pagination?: PaginatorSettings\n  filters?: FilterItem[]\n  historyEnabled?: boolean\n  loading?: boolean\n  handleUrl?: boolean\n}\n\nexport const dataListDefaults = {\n  layoutBreakpoint: 768,\n  orderable: true,\n  historyEnabled: true,\n  loading: false,\n  handleUrl: false,\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, computed, onMounted, onBeforeUnmount } from 'vue'\nimport DataTable from '@/components/data-table/DataTable.vue'\nimport DataCards from '@/components/data-table/DataCards.vue'\nimport DataListOptions from '@/components/data-table/DataListOptions.vue'\nimport DataPaginator from '@/components/data-table/DataPaginator.vue'\nimport Button from '@/components/Button.vue'\nimport type {\n  DataListConfig,\n  DataListSettings,\n  PageSettings,\n  PaginatorSettings,\n} from '@/types/data-list'\nimport type { FilterValue } from '@/types/data-list'\nimport DataFilters, {\n  type FilterItem,\n  type FilterResponse,\n} from '@/components/data-table/DataFilters.vue'\nimport FilterTags from '@/components/data-table/FilterTags.vue'\nimport DataListGuide from '@/components/data-table/DataListGuide.vue'\nimport { getFilterParams } from '@/utils/dataFilters'\n\nconst dataFiltersRef = ref<InstanceType<typeof DataFilters> | null>(null)\n\nconst props = withDefaults(defineProps<DataListProps>(), {\n  ...dataListDefaults,\n})\n\nconst emit = defineEmits<{\n  'filter-change': [filters: Record<string, FilterValue>]\n  'selection-change': [selected: unknown[]]\n  'settings-change': [settings: DataListSettings]\n  'pagination-change': [pagination: PageSettings]\n  'sort-change': [sort: { key: string; direction: 'asc' | 'desc' }]\n}>()\n\nconst showOptions = ref(false)\nconst showGuide = ref(false)\nconst resolvedSettings = ref<DataListSettings | null>(null)\nconst isMobile = ref(false)\nconst root = ref<HTMLElement | null>(null)\nconst showFilters = ref(false)\n\n// const hasTextFilter = computed(() =>\n//   props.filters?.some((item) => item.type === 'text' || item.type === 'textarea'),\n// )\n\n// const exactMatchFilterItem: FilterItem = {\n//   type: 'checkbox',\n//   key: 'exactMatch',\n//   label: 'Pontos egyezés',\n//   fullWidth: true,\n//   config: {\n//     labelAlignmentFix: true,\n//   },\n//   displayClass: 'highlight-chip',\n// }\n\n// function ensureExactMatchItem(items: FilterItem[]): FilterItem[] {\n//   if (!hasTextFilter.value) return items\n//   if (items.some((i) => i.key === 'exactMatch')) return items\n\n//   return [exactMatchFilterItem, ...items]\n// }\n\n// const resolvedFilters = computed<FilterItem[]>(() => ensureExactMatchItem(props.filters ?? []))\n\nconst activeFilters = ref<Record<string, any>>(\n  props.filters ? (getFilterParams(props.filters) ?? {}) : {},\n)\n\nlet resizeObserver: ResizeObserver | null = null\n\nonMounted(() => {\n  resizeObserver = new ResizeObserver((entries) => {\n    isMobile.value = (entries[0]?.contentRect.width ?? 0) < props.layoutBreakpoint\n  })\n  if (root.value) resizeObserver.observe(root.value)\n})\n\nonBeforeUnmount(() => resizeObserver?.disconnect())\n\nconst effectiveLayout = computed<'table' | 'cards'>(() => {\n  const layout = resolvedSettings.value?.layout\n  if (layout === 'table' || layout === 'cards') return layout\n  return isMobile.value ? 'cards' : 'table'\n})\n\nconst internalConfig = computed<DataListConfig>(() => {\n  if (!resolvedSettings.value) return props.config\n  const order = resolvedSettings.value.columnOrder\n  const mapped = props.config.columns.map((c) => ({\n    ...c,\n    visible: resolvedSettings.value!.columns[c.property] ?? c.visible !== false,\n  }))\n  if (order?.length) {\n    mapped.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 { ...props.config, columns: mapped }\n})\n\nfunction onSettingsChange(s: DataListSettings) {\n  resolvedSettings.value = s\n  emit('settings-change', s)\n}\n\ndefineExpose({\n  openOptions: () => (showOptions.value = true),\n  closeOptions: () => (showOptions.value = false),\n  openFilters: () => (showFilters.value = true),\n  closeFilters: () => (showFilters.value = false),\n})\n\nasync function openFilter(key: string) {\n  showFilters.value = true\n  setTimeout(() => {\n    dataFiltersRef.value?.focusFilter(key)\n  }, 300)\n}\n\nfunction onFilterChange(response: FilterResponse) {\n  activeFilters.value = response.values\n  emit('filter-change', response.transformed)\n}\n\nconst activeFiltersCount = computed(\n  () => Object.values(activeFilters.value).filter((v) => v != null && v !== '').length,\n)\n\nconst showPaginator = computed(\n  () => !!props.pagination && (props.items.length > 0 || !props.loading),\n)\n</script>\n\n<template>\n  <div class=\"ac-component\">\n    <div ref=\"root\" class=\"c-data-list\">\n      <template v-if=\"filters && filters.length > 0\">\n        <div class=\"flex-center gap-2 mb-3 wrap-on-small\">\n          <Button\n            label=\"Szűrők megnyitása\"\n            icon=\"fa-solid fa-filter\"\n            @click=\"showFilters = true\"\n            style=\"flex-shrink: 0\"\n            :type=\"activeFiltersCount > 0 ? 'info' : 'normal'\"\n            :indicator=\"activeFiltersCount > 0 ? activeFiltersCount : undefined\"\n          />\n          <div class=\"flex-center gap-1\">\n            <FilterTags\n              :filters=\"activeFilters\"\n              :items=\"filters\"\n              @remove=\"(key: string) => dataFiltersRef?.clearFilter(key)\"\n              @openFilter=\"openFilter\"\n            />\n          </div>\n        </div>\n        <DataFilters\n          ref=\"dataFiltersRef\"\n          :open=\"showFilters\"\n          :items=\"filters\"\n          :history-enabled=\"historyEnabled\"\n          lazy\n          :handle-url=\"handleUrl\"\n          :storage-key=\"id\"\n          @close=\"showFilters = false\"\n          @change=\"onFilterChange\"\n        />\n      </template>\n\n      <div class=\"c-data-list__toolbar\">\n        <Button\n          label=\"Beállítások\"\n          icon=\"fa-solid fa-gear\"\n          class=\"c-data-list__toolbar__item\"\n          size=\"small\"\n          @click=\"showOptions = true\"\n        />\n        <Button\n          label=\"Súgó\"\n          icon=\"fa-solid fa-question\"\n          icon-position=\"right\"\n          class=\"c-data-list__toolbar__item ml-auto\"\n          label-alignment-fix\n          size=\"small\"\n          @click=\"showGuide = true\"\n        />\n      </div>\n      <DataListGuide :open=\"showGuide\" @close=\"showGuide = false\" />\n      <DataTable\n        v-if=\"effectiveLayout === 'table'\"\n        :config=\"internalConfig\"\n        :loading=\"loading\"\n        :items=\"items\"\n        :settings=\"resolvedSettings ?? undefined\"\n        @filter-change=\"emit('filter-change', $event)\"\n        @selection-change=\"emit('selection-change', $event)\"\n        @sort-change=\"emit('sort-change', $event)\"\n      />\n\n      <DataCards\n        v-else\n        :config=\"internalConfig\"\n        :loading=\"loading\"\n        :items=\"items\"\n        :settings=\"resolvedSettings ?? undefined\"\n        @selection-change=\"emit('selection-change', $event)\"\n      />\n\n      <DataPaginator\n        v-if=\"pagination && showPaginator\"\n        :settings=\"pagination\"\n        :storage-key=\"id\"\n        @update:pagination=\"emit('pagination-change', $event)\"\n      />\n\n      <DataListOptions\n        :open=\"showOptions\"\n        :columns=\"config.columns\"\n        :settings=\"settings ?? {}\"\n        :storage-key=\"id\"\n        :orderable=\"orderable\"\n        @close=\"showOptions = false\"\n        @change=\"onSettingsChange\"\n      />\n    </div>\n  </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-list.scss\"></style>\n"],"mappings":"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"}
+{"version":3,"file":"admins-components87.js","names":[],"sources":["../src/components/data-table/DataListGuide.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref } from 'vue'\nimport Sidebar, { type SidebarPosition } from '@/components/Sidebar.vue'\n\nwithDefaults(\n  defineProps<{\n    open?: boolean\n    position?: SidebarPosition\n  }>(),\n  {\n    open: false,\n    position: 'right',\n  },\n)\n\nconst emit = defineEmits<{\n  close: []\n}>()\n\nconst root = ref<HTMLElement | null>(null)\n\nfunction scrollToSection(target: string | null | undefined) {\n  if (!target || !root.value) return\n  const el = root.value.querySelector(`#${target}`)\n  if (el) el.scrollIntoView({ behavior: 'smooth', block: 'start' })\n}\n</script>\n\n<template>\n  <Sidebar :open=\"open\" title=\"Súgó\" :position=\"position\" @close=\"emit('close')\">\n    <div ref=\"root\" class=\"ac-component dl-guide\">\n      <section class=\"dl-guide-section\">\n        <h3 class=\"dl-guide-title\">Tartalom</h3>\n        <ul class=\"dl-guide-toc m-0\">\n          <li>\n            <a\n              href=\"#\"\n              class=\"dl-guide-toc-link dl-guide-toc-link--primary\"\n              @click.prevent=\"scrollToSection('layout')\"\n              >Megjelenés testreszabása</a\n            >\n            <ul>\n              <li class=\"m-0\">\n                <a href=\"#\" class=\"dl-guide-toc-link\" @click.prevent=\"scrollToSection('view')\"\n                  >Nézet</a\n                >\n              </li>\n              <li class=\"m-0\">\n                <a href=\"#\" class=\"dl-guide-toc-link\" @click.prevent=\"scrollToSection('appearance')\"\n                  >Megjelenés</a\n                >\n              </li>\n              <li class=\"m-0\">\n                <a href=\"#\" class=\"dl-guide-toc-link\" @click.prevent=\"scrollToSection('columns')\"\n                  >Oszlopok láthatósága és sorrendje</a\n                >\n              </li>\n              <li class=\"m-0\">\n                <a href=\"#\" class=\"dl-guide-toc-link\" @click.prevent=\"scrollToSection('reset')\"\n                  >Beállítások visszaállítása</a\n                >\n              </li>\n            </ul>\n          </li>\n          <li>\n            <a\n              href=\"#\"\n              class=\"dl-guide-toc-link dl-guide-toc-link--primary\"\n              @click.prevent=\"scrollToSection('filters')\"\n              >Szűrők</a\n            >\n            <ul>\n                 <li class=\"m-0\">\n                <a\n                  href=\"#\"\n                  class=\"dl-guide-toc-link\"\n                  @click.prevent=\"scrollToSection('exact-match')\"\n                  >Pontos egyezés</a\n                >\n              </li>\n              <li class=\"m-0\">\n                <a\n                  href=\"#\"\n                  class=\"dl-guide-toc-link\"\n                  @click.prevent=\"scrollToSection('save-filters')\"\n                  >Szűrések mentése</a\n                >\n              </li>\n            </ul>\n          </li>\n        </ul>\n      </section>\n      <hr class=\"separator\" />\n      <section id=\"layout\" class=\"dl-guide-section\">\n        <h3 class=\"dl-guide-title\">A táblázat megjelenésének testreszabása</h3>\n        <p>\n          A <strong><i class=\"fa-solid fa-gear\"></i> Beállítások</strong> gombra kattintva lehetőség\n          van a tábla megjelenésének testreszabására. A beállítások az adott táblához kapcsolódóan\n          helyi tárolóban kerülnek mentésre, így ugyanazon eszközön és böngészőben megmaradnak a\n          következő látogatáskor is.\n        </p>\n        <hr class=\"separator\" />\n        <h4 id=\"view\" class=\"dl-guide-subtitle\">Nézet</h4>\n        <ul>\n          <li>\n            <i class=\"fa-solid fa-display mr-1\"></i>\n            <strong>Kijelző méretéhez igazodó</strong> (alapértelmezett): A kijelző méretétől\n            függően automatikusan választ a táblázat és a kártyás nézet között.\n          </li>\n          <li>\n            <i class=\"fa-solid fa-table-list mr-1\"></i> <strong>Táblázat:</strong> klasszikus\n            táblázatos megjelenés\n          </li>\n          <li>\n            <i class=\"fa-solid fa-list mr-1\"></i> <strong>Kártyák:</strong> sorok kártyás\n            megjelenítése, a kártya fejlécére kattintva lenyithatóak a részletes adatok.\n          </li>\n        </ul>\n        <hr class=\"separator\" />\n        <h4 id=\"appearance\" class=\"dl-guide-subtitle\">Megjelenés</h4>\n        <ul>\n          <li>\n            <strong>Kompakt:</strong> A sorok közti távolság és a belső margók csökkentésével több\n            adat jeleníthető meg egyszerre.\n          </li>\n          <li>\n            <strong>Sávos (striped):</strong> Csak a táblázatos nézetben elérhető, minden második\n            sor enyhe szürke hátteret kap, ezzel megkönnyítve a sorok követését.\n          </li>\n        </ul>\n        <hr class=\"separator\" />\n        <h4 id=\"columns\" class=\"dl-guide-subtitle\">Oszlopok láthatósága és sorrendje</h4>\n        <ul>\n          <li>\n            <strong>Kártya fejléc:</strong> kártyás nézet esetén a fejlécben megjelenő mezők\n            láthatósága és sorrendje.\n          </li>\n          <li>\n            <strong>Oszlopok:</strong> táblázat nézetben az oszlopok láthatósága és sorrendje.\n          </li>\n        </ul>\n        <p>\n          A sorrend módosítása történhet az <i class=\"fa-solid fa-grip-vertical\"></i> ikonon\n          <strong class=\"nowrap\">drag-n-drop</strong>al vagy az ikonra kattinva a megjelenő nyilak\n          segítségével.\n        </p>\n        <hr class=\"separator\" />\n\n        <h4 id=\"reset\" class=\"dl-guide-subtitle\">Beállítások visszaállítása</h4>\n        <p>\n          Az\n          <strong>Alapértelmezés visszaállítása</strong> gomb visszaállítja a gyári értékeket, és\n          törli a helyi tárolóban elmentett beállításokat.\n        </p>\n      </section>\n      <hr class=\"separator\" />\n      <section id=\"filters\" class=\"dl-guide-section\">\n        <h3 class=\"dl-guide-title\">Szűrők</h3>\n        <h4 id=\"exact-match\" class=\"dl-guide-subtitle\">Pontos egyezés</h4>\n        <p>\n          Amennyiben a táblázhoz tartozik szabad szavas keresés, a pontos egyezés opciót használva\n          csak azokat a találatokat kapjuk, amelyek teljes mértékben megfelelnek a keresett\n          kifejezésnek. Pl. alap esetben <strong><em>\"alma\"</em></strong> keresésre a <strong><em>\"piros alma\"</em></strong>, <strong><em>\"almafa\"</em></strong>, <strong><em>\"alma\"</em></strong> vagy\n          <strong><em>\"almás pite\"</em></strong> is találat lehet, míg pontos egyezés esetén csak az <strong><em>\"alma\"</em></strong> található meg.\n        </p>\n<hr class=\"separator\" />\n        <h4 id=\"save-filters\" class=\"dl-guide-subtitle\">Szűrések mentése</h4>\n        <p>\n          A <strong><i class=\"fa-solid fa-sliders\"></i> Mentett szűrők</strong>re kattintva\n          lehetőség van elmenteni az aktuális szűrési feltételeket, így később egyetlen kattintással\n          előhívhatja azokat.\n        </p>\n        <p>\n          A szűrési feltételek megadása után a\n          <strong><i class=\"fa-solid fa-bookmark fa-sm\"></i> Mentés</strong> gomb megnyomásával\n          elmenthető a szűrőkészlet. Az elnevezés megadása nem kötelező, csak saját magadnak szól a\n          későbbi könnyebb azonosítás érdekében.\n        </p>\n        <p>\n          Ezt követően a szűrőkészlet a mentés dátumával és elnevezésével jelenik meg a mentett\n          szűrők között. Ezekre kattintva lenyithatók a szűrőkészlet részletei.\n        </p>\n        <p>A mentett készlet jobb oldalán található 3 ikon:</p>\n        <ul>\n          <li>\n            <i class=\"fa-solid fa-check\"></i>: ikonra kattintva tölthetők be a készletek.\n            Megnyomásakor a szűrési feltételek automatikusan kitöltődnek az elmentett értékekkel.\n          </li>\n\n          <li>\n            <span class=\"c-indicator\">?</span>: azt mutatja, hogy hány szűrési feltétel van a\n            készletben.\n          </li>\n          <li>\n            <i class=\"fa-solid fa-xmark\"></i>: a mentett szűrőkészlet törlése (a művelet\n            megerősítést kér).\n          </li>\n        </ul>\n        <p class=\"dl-guide-note\">Táblázatonként maximum <strong>20</strong> készlet menthető el.</p>\n        <p>\n          A lista alján található \"Összes törlése\" gombbal törölhető a táblához tartozó minden\n          elmentett szűrőkészlet.\n        </p>\n\n        <p class=\"dl-guide-note\">\n          <strong>Fontos:</strong> a beállítások és a szűrők is csak böngészőben (localStorage)\n          kerülnek tárolásra, ezért más eszközön vagy böngészőben nem lesznek elérhetőek.\n        </p>\n      </section>\n    </div>\n  </Sidebar>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-list-guide.scss\"></style>\n"],"mappings":"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"}

package/dist/admins-components89.js

@@ -1,7 +1,7 @@
-import './src/styles/components/data-table/data-list.scss_vue_type_style_index_0_src_true_lang.css';
+import './src/styles/components/data-table/data-list-guide.scss_vue_type_style_index_0_src_true_lang.css';
 import e from "./admins-components87.js";
 /* empty css                    */
-//#region src/components/data-table/DataList.vue
+//#region src/components/data-table/DataListGuide.vue
 var t = e;
 //#endregion
 export { t as default };