@aotearoan/neon 28.3.0 → 28.4.1

package/dist/components/navigation/pagination/NeonPagination.es.js

@@ -1,12 +1,12 @@
 import f from "../../user-input/button/NeonButton.vue.es.js";
-import c from "../../presentation/icon/NeonIcon.vue.es.js";
-import { defineComponent as d, computed as n } from "vue";
+import d from "../../presentation/icon/NeonIcon.vue.es.js";
+import { defineComponent as v, computed as l } from "vue";
 import { NeonFunctionalColor as P } from "../../../model/common/color/NeonFunctionalColor.es.js";
-const N = d({
+const A = v({
   name: "NeonPagination",
   components: {
     NeonButton: f,
-    NeonIcon: c
+    NeonIcon: d
   },
   props: {
     /**
@@ -17,7 +17,7 @@ const N = d({
      * The URL template for the pagination links. The template should contain a '{page}' placeholder that will be
      * substituted in links with the correct page number.
      */
-    urlTemplate: { type: String, required: !0 },
+    urlTemplate: { type: String },
     /**
      * The number of items per page.
      */
@@ -35,37 +35,47 @@ const N = d({
      */
     color: { type: String, default: () => P.Brand }
   },
-  setup(t) {
-    const e = n(() => Math.ceil(t.total / t.pageSize)), o = n(() => e.value <= 1), r = n(() => Math.max(t.page - 1, 1)), s = n(() => t.page === 1), u = n(() => Math.min(t.page + 1, e.value)), g = n(() => t.page === e.value), p = n(
+  emits: [
+    /**
+     * Emitted when the user clicks on a page link (useful for paginated lists which are not the main focus of the page,
+     * i.e. should not be deep linked).
+     *
+     * @type {number} The new page number.
+     */
+    "page-change"
+  ],
+  setup(t, { emit: o }) {
+    const e = l(() => Math.ceil(t.total / t.pageSize)), s = l(() => e.value <= 1), r = l(() => Math.max(t.page - 1, 1)), u = l(() => t.page === 1), g = l(() => Math.min(t.page + 1, e.value)), m = l(() => t.page === e.value), p = l(
       () => e.value > 5 && t.page >= 5
-    ), m = n(
+    ), y = l(
       () => e.value > 5 && t.page <= e.value - 4
-    ), y = n(() => {
+    ), c = l(() => {
       if (e.value <= 5)
         return Array.from(Array(e.value).keys()).map((a) => a + 1);
       if (t.page <= e.value / 2) {
-        let a = Math.max(t.page - Math.floor(1.5), 1), l = 3;
-        return a === 2 ? (a = 1, l += 1) : a === 3 && (a = 1, l += 2), Array.from(Array(l).keys()).map((i) => a + i);
+        let a = Math.max(t.page - Math.floor(1.5), 1), n = 3;
+        return a === 2 ? (a = 1, n += 1) : a === 3 && (a = 1, n += 2), Array.from(Array(n).keys()).map((i) => a + i);
       } else {
-        let a = Math.min(t.page + Math.floor(1.5), e.value), l = 3;
-        return a === e.value - 1 ? (a = e.value, l += 1) : a === e.value - 2 && (a = e.value, l += 2), Array.from(Array(l).keys()).map((i) => a - (l - 1) + i);
+        let a = Math.min(t.page + Math.floor(1.5), e.value), n = 3;
+        return a === e.value - 1 ? (a = e.value, n += 1) : a === e.value - 2 && (a = e.value, n += 2), Array.from(Array(n).keys()).map((i) => a - (n - 1) + i);
       }
     });
     return {
       pageCount: e,
-      hidePagination: o,
+      hidePagination: s,
       previousPage: r,
-      disabledPrevious: s,
-      nextPage: u,
-      disabledNext: g,
+      disabledPrevious: u,
+      nextPage: g,
+      disabledNext: m,
       showFirstPageWithEllipsis: p,
-      showLastPageWithEllipsis: m,
-      pageRange: y,
-      url: (a) => t.urlTemplate.replace("{page}", a.toString())
+      showLastPageWithEllipsis: y,
+      pageRange: c,
+      url: (a) => t.urlTemplate ? t.urlTemplate.replace("{page}", a.toString()) : void 0,
+      emit: o
     };
   }
 });
 export {
-  N as default
+  A as default
 };
 //# sourceMappingURL=NeonPagination.es.js.map

package/dist/components/navigation/pagination/NeonPagination.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonPagination.es.js","sources":["../../../../src/components/navigation/pagination/NeonPagination.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import NeonButton from '@/components/user-input/button/NeonButton.vue';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { computed, defineComponent } from 'vue';\nimport { NeonFunctionalColor } from '@/model/common/color/NeonFunctionalColor';\n\n/**\n * A pagination component that displays a list of page numbers and allows the user to navigate between pages. Typically,\n * the component displays the first and last page numbers and 3 pages before and after the current page.\n */\nexport default defineComponent({\n  name: 'NeonPagination',\n  components: {\n    NeonButton,\n    NeonIcon,\n  },\n  props: {\n    /**\n     * The current page number.\n     */\n    page: { type: Number, required: true },\n    /**\n     * The URL template for the pagination links. The template should contain a '{page}' placeholder that will be\n     * substituted in links with the correct page number.\n     */\n    urlTemplate: { type: String, required: true },\n    /**\n     * The number of items per page.\n     */\n    pageSize: { type: Number, default: 20 },\n    /**\n     * The total number of items.\n     */\n    total: { type: Number, required: true },\n    /**\n     * Whether to display links to the first and last pages.\n     */\n    displayFirstAndLast: { type: Boolean, default: false },\n    /**\n     * The accent color of the component.\n     */\n    color: { type: String as () => NeonFunctionalColor, default: () => NeonFunctionalColor.Brand },\n  },\n  setup(props) {\n    const maxDisplayPageLinks = 5;\n    const pageDisplayCount = maxDisplayPageLinks - 2;\n\n    const pageCount = computed(() => Math.ceil(props.total / props.pageSize));\n    const hidePagination = computed(() => pageCount.value <= 1);\n\n    const previousPage = computed(() => Math.max(props.page - 1, 1));\n    const disabledPrevious = computed(() => props.page === 1);\n\n    const nextPage = computed(() => Math.min(props.page + 1, pageCount.value));\n    const disabledNext = computed(() => props.page === pageCount.value);\n\n    const showFirstPageWithEllipsis = computed(\n      () => pageCount.value > maxDisplayPageLinks && props.page >= maxDisplayPageLinks,\n    );\n\n    const showLastPageWithEllipsis = computed(\n      () => pageCount.value > maxDisplayPageLinks && props.page <= pageCount.value - (pageDisplayCount + 1),\n    );\n\n    const pageRange = computed(() => {\n      // not enough pages to fill range, show them all\n      if (pageCount.value <= maxDisplayPageLinks) {\n        return Array.from(Array(pageCount.value).keys()).map((value) => value + 1);\n      }\n\n      // determine page range to display\n      if (props.page <= pageCount.value / 2) {\n        // bottom of range calculation\n        let startPage = Math.max(props.page - Math.floor(pageDisplayCount / 2), 1);\n        let numPages = pageDisplayCount;\n\n        // when the start page would be 2 then also display 1, and if start page is 3 then also display 1 and 2 (no ellipsis)\n        if (startPage === 2) {\n          startPage = 1;\n          numPages += 1;\n        } else if (startPage === 3) {\n          startPage = 1;\n          numPages += 2;\n        }\n\n        return Array.from(Array(numPages).keys()).map((value) => startPage + value);\n      } else {\n        // top of range calculation\n        let endPage = Math.min(props.page + Math.floor(pageDisplayCount / 2), pageCount.value);\n        let numPages = pageDisplayCount;\n\n        // when the end page would be pageCount - 1 then also display last page,\n        // and if end page is pageCount - 2 then also display last page & second last page (no ellipsis)\n        if (endPage === pageCount.value - 1) {\n          endPage = pageCount.value;\n          numPages += 1;\n        } else if (endPage === pageCount.value - 2) {\n          endPage = pageCount.value;\n          numPages += 2;\n        }\n\n        return Array.from(Array(numPages).keys()).map((value) => endPage - (numPages - 1) + value);\n      }\n    });\n\n    const url = (page: number) => props.urlTemplate.replace('{page}', page.toString());\n\n    return {\n      pageCount,\n      hidePagination,\n      previousPage,\n      disabledPrevious,\n      nextPage,\n      disabledNext,\n      showFirstPageWithEllipsis,\n      showLastPageWithEllipsis,\n      pageRange,\n      url,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonButton","NeonIcon","NeonFunctionalColor","props","pageCount","computed","hidePagination","previousPage","disabledPrevious","nextPage","disabledNext","showFirstPageWithEllipsis","showLastPageWithEllipsis","pageRange","value","startPage","numPages","endPage","page"],"mappings":";;;;AASA,MAAAA,IAAeC,EAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV,YAAAC;AAAA,IACA,UAAAC;AAAA,EAAA;AAAA,EAEF,OAAO;AAAA;AAAA;AAAA;AAAA,IAIL,MAAM,EAAE,MAAM,QAAQ,UAAU,GAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKhC,aAAa,EAAE,MAAM,QAAQ,UAAU,GAAA;AAAA;AAAA;AAAA;AAAA,IAIvC,UAAU,EAAE,MAAM,QAAQ,SAAS,GAAA;AAAA;AAAA;AAAA;AAAA,IAInC,OAAO,EAAE,MAAM,QAAQ,UAAU,GAAA;AAAA;AAAA;AAAA;AAAA,IAIjC,qBAAqB,EAAE,MAAM,SAAS,SAAS,GAAA;AAAA;AAAA;AAAA;AAAA,IAI/C,OAAO,EAAE,MAAM,QAAqC,SAAS,MAAMC,EAAoB,MAAA;AAAA,EAAM;AAAA,EAE/F,MAAMC,GAAO;AAIX,UAAMC,IAAYC,EAAS,MAAM,KAAK,KAAKF,EAAM,QAAQA,EAAM,QAAQ,CAAC,GAClEG,IAAiBD,EAAS,MAAMD,EAAU,SAAS,CAAC,GAEpDG,IAAeF,EAAS,MAAM,KAAK,IAAIF,EAAM,OAAO,GAAG,CAAC,CAAC,GACzDK,IAAmBH,EAAS,MAAMF,EAAM,SAAS,CAAC,GAElDM,IAAWJ,EAAS,MAAM,KAAK,IAAIF,EAAM,OAAO,GAAGC,EAAU,KAAK,CAAC,GACnEM,IAAeL,EAAS,MAAMF,EAAM,SAASC,EAAU,KAAK,GAE5DO,IAA4BN;AAAA,MAChC,MAAMD,EAAU,QAAQ,KAAuBD,EAAM,QAAQ;AAAA,IAAA,GAGzDS,IAA2BP;AAAA,MAC/B,MAAMD,EAAU,QAAQ,KAAuBD,EAAM,QAAQC,EAAU,QAAS;AAAA,IAAmB,GAG/FS,IAAYR,EAAS,MAAM;AAE/B,UAAID,EAAU,SAAS;AACrB,eAAO,MAAM,KAAK,MAAMA,EAAU,KAAK,EAAE,KAAA,CAAM,EAAE,IAAI,CAACU,MAAUA,IAAQ,CAAC;AAI3E,UAAIX,EAAM,QAAQC,EAAU,QAAQ,GAAG;AAErC,YAAIW,IAAY,KAAK,IAAIZ,EAAM,OAAO,KAAK,MAAM,GAAoB,GAAG,CAAC,GACrEa,IAAW;AAGf,eAAID,MAAc,KAChBA,IAAY,GACZC,KAAY,KACHD,MAAc,MACvBA,IAAY,GACZC,KAAY,IAGP,MAAM,KAAK,MAAMA,CAAQ,EAAE,MAAM,EAAE,IAAI,CAACF,MAAUC,IAAYD,CAAK;AAAA,MAC5E,OAAO;AAEL,YAAIG,IAAU,KAAK,IAAId,EAAM,OAAO,KAAK,MAAM,GAAoB,GAAGC,EAAU,KAAK,GACjFY,IAAW;AAIf,eAAIC,MAAYb,EAAU,QAAQ,KAChCa,IAAUb,EAAU,OACpBY,KAAY,KACHC,MAAYb,EAAU,QAAQ,MACvCa,IAAUb,EAAU,OACpBY,KAAY,IAGP,MAAM,KAAK,MAAMA,CAAQ,EAAE,KAAA,CAAM,EAAE,IAAI,CAACF,MAAUG,KAAWD,IAAW,KAAKF,CAAK;AAAA,MAC3F;AAAA,IACF,CAAC;AAID,WAAO;AAAA,MACL,WAAAV;AAAA,MACA,gBAAAE;AAAA,MACA,cAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,UAAAC;AAAA,MACA,cAAAC;AAAA,MACA,2BAAAC;AAAA,MACA,0BAAAC;AAAA,MACA,WAAAC;AAAA,MACA,KAZU,CAACK,MAAiBf,EAAM,YAAY,QAAQ,UAAUe,EAAK,UAAU;AAAA,IAY/E;AAAA,EAEJ;AACF,CAAC;"}
+{"version":3,"file":"NeonPagination.es.js","sources":["../../../../src/components/navigation/pagination/NeonPagination.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import NeonButton from '@/components/user-input/button/NeonButton.vue';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { computed, defineComponent } from 'vue';\nimport { NeonFunctionalColor } from '@/model/common/color/NeonFunctionalColor';\n\n/**\n * A pagination component that displays a list of page numbers and allows the user to navigate between pages. Typically,\n * the component displays the first and last page numbers and 3 pages before and after the current page.\n */\nexport default defineComponent({\n  name: 'NeonPagination',\n  components: {\n    NeonButton,\n    NeonIcon,\n  },\n  props: {\n    /**\n     * The current page number.\n     */\n    page: { type: Number, required: true },\n    /**\n     * The URL template for the pagination links. The template should contain a '{page}' placeholder that will be\n     * substituted in links with the correct page number.\n     */\n    urlTemplate: { type: String },\n    /**\n     * The number of items per page.\n     */\n    pageSize: { type: Number, default: 20 },\n    /**\n     * The total number of items.\n     */\n    total: { type: Number, required: true },\n    /**\n     * Whether to display links to the first and last pages.\n     */\n    displayFirstAndLast: { type: Boolean, default: false },\n    /**\n     * The accent color of the component.\n     */\n    color: { type: String as () => NeonFunctionalColor, default: () => NeonFunctionalColor.Brand },\n  },\n  emits: [\n    /**\n     * Emitted when the user clicks on a page link (useful for paginated lists which are not the main focus of the page,\n     * i.e. should not be deep linked).\n     *\n     * @type {number} The new page number.\n     */\n    'page-change',\n  ],\n  setup(props, { emit }) {\n    const maxDisplayPageLinks = 5;\n    const pageDisplayCount = maxDisplayPageLinks - 2;\n\n    const pageCount = computed(() => Math.ceil(props.total / props.pageSize));\n    const hidePagination = computed(() => pageCount.value <= 1);\n\n    const previousPage = computed(() => Math.max(props.page - 1, 1));\n    const disabledPrevious = computed(() => props.page === 1);\n\n    const nextPage = computed(() => Math.min(props.page + 1, pageCount.value));\n    const disabledNext = computed(() => props.page === pageCount.value);\n\n    const showFirstPageWithEllipsis = computed(\n      () => pageCount.value > maxDisplayPageLinks && props.page >= maxDisplayPageLinks,\n    );\n\n    const showLastPageWithEllipsis = computed(\n      () => pageCount.value > maxDisplayPageLinks && props.page <= pageCount.value - (pageDisplayCount + 1),\n    );\n\n    const pageRange = computed(() => {\n      // not enough pages to fill range, show them all\n      if (pageCount.value <= maxDisplayPageLinks) {\n        return Array.from(Array(pageCount.value).keys()).map((value) => value + 1);\n      }\n\n      // determine page range to display\n      if (props.page <= pageCount.value / 2) {\n        // bottom of range calculation\n        let startPage = Math.max(props.page - Math.floor(pageDisplayCount / 2), 1);\n        let numPages = pageDisplayCount;\n\n        // when the start page would be 2 then also display 1, and if start page is 3 then also display 1 and 2 (no ellipsis)\n        if (startPage === 2) {\n          startPage = 1;\n          numPages += 1;\n        } else if (startPage === 3) {\n          startPage = 1;\n          numPages += 2;\n        }\n\n        return Array.from(Array(numPages).keys()).map((value) => startPage + value);\n      } else {\n        // top of range calculation\n        let endPage = Math.min(props.page + Math.floor(pageDisplayCount / 2), pageCount.value);\n        let numPages = pageDisplayCount;\n\n        // when the end page would be pageCount - 1 then also display last page,\n        // and if end page is pageCount - 2 then also display last page & second last page (no ellipsis)\n        if (endPage === pageCount.value - 1) {\n          endPage = pageCount.value;\n          numPages += 1;\n        } else if (endPage === pageCount.value - 2) {\n          endPage = pageCount.value;\n          numPages += 2;\n        }\n\n        return Array.from(Array(numPages).keys()).map((value) => endPage - (numPages - 1) + value);\n      }\n    });\n\n    const url = (page: number) =>\n      props.urlTemplate ? props.urlTemplate.replace('{page}', page.toString()) : undefined;\n\n    return {\n      pageCount,\n      hidePagination,\n      previousPage,\n      disabledPrevious,\n      nextPage,\n      disabledNext,\n      showFirstPageWithEllipsis,\n      showLastPageWithEllipsis,\n      pageRange,\n      url,\n      emit,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonButton","NeonIcon","NeonFunctionalColor","props","emit","pageCount","computed","hidePagination","previousPage","disabledPrevious","nextPage","disabledNext","showFirstPageWithEllipsis","showLastPageWithEllipsis","pageRange","value","startPage","numPages","endPage","page"],"mappings":"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"}

package/dist/components/navigation/pagination/NeonPagination.vue.cjs.js

@@ -1,2 +1,2 @@
-"use strict";const a=require("./NeonPagination.cjs.js"),e=require("vue"),i=require("../../../_virtual/_plugin-vue_export-helper.cjs.js"),s={class:"neon-pagination__page-links"},r={key:0,class:"neon-pagination__link--selected"};function c(n,p,u,g,h,k){const o=e.resolveComponent("neon-button"),l=e.resolveComponent("neon-icon");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([[{"neon-pagination--empty":n.hidePagination},`neon-pagination--${n.color}`],"neon-pagination"])},[n.displayFirstAndLast?(e.openBlock(),e.createBlock(o,{key:0,disabled:n.disabledPrevious,href:n.disabledPrevious?void 0:n.url(1),"button-style":"outline",class:"neon-pagination__nav-link neon-pagination__first",color:"high-contrast",icon:"first-page"},null,8,["disabled","href"])):e.createCommentVNode("",!0),e.createVNode(o,{disabled:n.disabledPrevious,href:n.disabledPrevious?void 0:n.url(n.previousPage),"button-style":"outline",class:"neon-pagination__nav-link neon-pagination__previous",color:"high-contrast",icon:"arrow-left-1"},null,8,["disabled","href"]),e.createElementVNode("div",s,[n.showFirstPageWithEllipsis?(e.openBlock(),e.createBlock(o,{key:0,href:n.url(1),"button-style":"text",class:"neon-pagination__link",color:"high-contrast",label:"1",transparent:""},null,8,["href"])):e.createCommentVNode("",!0),n.showFirstPageWithEllipsis?(e.openBlock(),e.createBlock(l,{key:1,class:"neon-pagination__less",color:"low-contrast",name:"ellipsis"})):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.pageRange,t=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:t},[n.page===t?(e.openBlock(),e.createElementBlock("span",r,e.toDisplayString(t),1)):(e.openBlock(),e.createBlock(o,{key:1,href:n.url(t),label:`${t}`,"button-style":"text",class:"neon-pagination__link",color:"high-contrast",transparent:""},null,8,["href","label"]))],64))),128)),n.showLastPageWithEllipsis?(e.openBlock(),e.createBlock(l,{key:2,class:"neon-pagination__more",color:"low-contrast",name:"ellipsis"})):e.createCommentVNode("",!0),n.showLastPageWithEllipsis?(e.openBlock(),e.createBlock(o,{key:3,href:n.url(n.pageCount),label:`${n.pageCount}`,"button-style":"text",class:"neon-pagination__link",color:"high-contrast",transparent:""},null,8,["href","label"])):e.createCommentVNode("",!0)]),e.createVNode(o,{disabled:n.disabledNext,href:n.disabledNext?void 0:n.url(n.nextPage),"button-style":"outline",class:"neon-pagination__nav-link neon-pagination__next",color:"high-contrast",icon:"arrow-right-1"},null,8,["disabled","href"]),n.displayFirstAndLast?(e.openBlock(),e.createBlock(o,{key:1,disabled:n.disabledNext,href:n.disabledNext?void 0:n.url(n.pageCount),"button-style":"outline",class:"neon-pagination__nav-link neon-pagination__last",color:"high-contrast",icon:"last-page"},null,8,["disabled","href"])):e.createCommentVNode("",!0)],2)}const d=i(a,[["render",c]]);module.exports=d;
+"use strict";const a=require("./NeonPagination.cjs.js"),n=require("vue"),s=require("../../../_virtual/_plugin-vue_export-helper.cjs.js"),r={class:"neon-pagination__page-links"},p={key:0,class:"neon-pagination__link--selected"};function u(e,o,g,c,k,h){const l=n.resolveComponent("neon-button"),i=n.resolveComponent("neon-icon");return n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass([[{"neon-pagination--empty":e.hidePagination},`neon-pagination--${e.color}`],"neon-pagination"])},[e.displayFirstAndLast?(n.openBlock(),n.createBlock(l,{key:0,disabled:e.disabledPrevious,href:e.disabledPrevious?void 0:e.url(1),"button-style":"outline",class:"neon-pagination__nav-link neon-pagination__first",color:"high-contrast",icon:"first-page",onClick:o[0]||(o[0]=t=>e.emit("page-change",1))},null,8,["disabled","href"])):n.createCommentVNode("",!0),n.createVNode(l,{disabled:e.disabledPrevious,href:e.disabledPrevious?void 0:e.url(e.previousPage),"button-style":"outline",class:"neon-pagination__nav-link neon-pagination__previous",color:"high-contrast",icon:"chevron-left",onClick:o[1]||(o[1]=t=>e.emit("page-change",e.previousPage))},null,8,["disabled","href"]),n.createElementVNode("div",r,[e.showFirstPageWithEllipsis?(n.openBlock(),n.createBlock(l,{key:0,href:e.url(1),"button-style":"text",class:"neon-pagination__link",color:"high-contrast",label:"1",transparent:"",onClick:o[2]||(o[2]=t=>e.emit("page-change",1))},null,8,["href"])):n.createCommentVNode("",!0),e.showFirstPageWithEllipsis?(n.openBlock(),n.createBlock(i,{key:1,class:"neon-pagination__less",color:"low-contrast",name:"ellipsis"})):n.createCommentVNode("",!0),(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(e.pageRange,t=>(n.openBlock(),n.createElementBlock(n.Fragment,{key:t},[e.page===t?(n.openBlock(),n.createElementBlock("span",p,n.toDisplayString(t),1)):(n.openBlock(),n.createBlock(l,{key:1,href:e.url(t),label:`${t}`,"button-style":"text",class:"neon-pagination__link",color:"high-contrast",transparent:"",onClick:m=>e.emit("page-change",t)},null,8,["href","label","onClick"]))],64))),128)),e.showLastPageWithEllipsis?(n.openBlock(),n.createBlock(i,{key:2,class:"neon-pagination__more",color:"low-contrast",name:"ellipsis"})):n.createCommentVNode("",!0),e.showLastPageWithEllipsis?(n.openBlock(),n.createBlock(l,{key:3,href:e.url(e.pageCount),label:`${e.pageCount}`,"button-style":"text",class:"neon-pagination__link",color:"high-contrast",transparent:"",onClick:o[3]||(o[3]=t=>e.emit("page-change",e.pageCount))},null,8,["href","label"])):n.createCommentVNode("",!0)]),n.createVNode(l,{disabled:e.disabledNext,href:e.disabledNext?void 0:e.url(e.nextPage),"button-style":"outline",class:"neon-pagination__nav-link neon-pagination__next",color:"high-contrast",icon:"chevron-right",onClick:o[4]||(o[4]=t=>e.emit("page-change",e.nextPage))},null,8,["disabled","href"]),e.displayFirstAndLast?(n.openBlock(),n.createBlock(l,{key:1,disabled:e.disabledNext,href:e.disabledNext?void 0:e.url(e.pageCount),"button-style":"outline",class:"neon-pagination__nav-link neon-pagination__last",color:"high-contrast",icon:"last-page",onClick:o[5]||(o[5]=t=>e.emit("page-change",e.pageCount))},null,8,["disabled","href"])):n.createCommentVNode("",!0)],2)}const d=s(a,[["render",u]]);module.exports=d;
 //# sourceMappingURL=NeonPagination.vue.cjs.js.map

package/dist/components/navigation/pagination/NeonPagination.vue.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonPagination.vue.cjs.js","sources":["../../../../src/components/navigation/pagination/NeonPagination.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[\n      {\n        'neon-pagination--empty': hidePagination,\n      },\n      `neon-pagination--${color}`,\n    ]\"\n    class=\"neon-pagination\"\n  >\n    <neon-button\n      v-if=\"displayFirstAndLast\"\n      :disabled=\"disabledPrevious\"\n      :href=\"!disabledPrevious ? url(1) : undefined\"\n      button-style=\"outline\"\n      class=\"neon-pagination__nav-link neon-pagination__first\"\n      color=\"high-contrast\"\n      icon=\"first-page\"\n    />\n    <neon-button\n      :disabled=\"disabledPrevious\"\n      :href=\"!disabledPrevious ? url(previousPage) : undefined\"\n      button-style=\"outline\"\n      class=\"neon-pagination__nav-link neon-pagination__previous\"\n      color=\"high-contrast\"\n      icon=\"arrow-left-1\"\n    />\n    <div class=\"neon-pagination__page-links\">\n      <neon-button\n        v-if=\"showFirstPageWithEllipsis\"\n        :href=\"url(1)\"\n        button-style=\"text\"\n        class=\"neon-pagination__link\"\n        color=\"high-contrast\"\n        label=\"1\"\n        transparent\n      />\n      <neon-icon v-if=\"showFirstPageWithEllipsis\" class=\"neon-pagination__less\" color=\"low-contrast\" name=\"ellipsis\" />\n      <!-- eslint-disable-next-line -->\n      <template v-for=\"pageInRange in pageRange\" :key=\"pageInRange\">\n        <span v-if=\"page === pageInRange\" class=\"neon-pagination__link--selected\">\n          {{ pageInRange }}\n        </span>\n        <neon-button\n          v-else\n          :href=\"url(pageInRange)\"\n          :label=\"`${pageInRange}`\"\n          button-style=\"text\"\n          class=\"neon-pagination__link\"\n          color=\"high-contrast\"\n          transparent\n        />\n      </template>\n      <neon-icon v-if=\"showLastPageWithEllipsis\" class=\"neon-pagination__more\" color=\"low-contrast\" name=\"ellipsis\" />\n      <neon-button\n        v-if=\"showLastPageWithEllipsis\"\n        :href=\"url(pageCount)\"\n        :label=\"`${pageCount}`\"\n        button-style=\"text\"\n        class=\"neon-pagination__link\"\n        color=\"high-contrast\"\n        transparent\n      />\n    </div>\n    <neon-button\n      :disabled=\"disabledNext\"\n      :href=\"!disabledNext ? url(nextPage) : undefined\"\n      button-style=\"outline\"\n      class=\"neon-pagination__nav-link neon-pagination__next\"\n      color=\"high-contrast\"\n      icon=\"arrow-right-1\"\n    />\n    <neon-button\n      v-if=\"displayFirstAndLast\"\n      :disabled=\"disabledNext\"\n      :href=\"!disabledNext ? url(pageCount) : undefined\"\n      button-style=\"outline\"\n      class=\"neon-pagination__nav-link neon-pagination__last\"\n      color=\"high-contrast\"\n      icon=\"last-page\"\n    />\n  </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonPagination.ts\"></script>\n"],"names":["_hoisted_1","_createElementBlock","_normalizeClass","_ctx","_createBlock","_component_neon_button","_createVNode","_createElementVNode","_component_neon_icon","_Fragment","_renderList","pageInRange","_hoisted_2","_toDisplayString"],"mappings":"yIA2BSA,EAAA,CAAA,MAAM,6BAA6B,WAaF,MAAM,4JAvC9CC,EAAAA,mBAgFM,MAAA,CA/EH,MAAKC,EAAAA,eAAA,CAAA,2BAA8CC,EAAA,oCAAmDA,EAAA,KAAK,IAMtG,iBAAiB,CAAA,IAGfA,EAAA,mCADRC,EAAAA,YAQEC,EAAA,OANC,SAAUF,EAAA,iBACV,KAAOA,EAAA,iBAA4B,OAATA,EAAA,OAC3B,eAAa,UACb,MAAM,mDACN,MAAM,gBACN,KAAK,uEAEPG,EAAAA,YAOED,EAAA,CANC,SAAUF,EAAA,iBACV,KAAOA,EAAA,iBAAuC,OAApBA,MAAIA,EAAA,YAAY,EAC3C,eAAa,UACb,MAAM,sDACN,MAAM,gBACN,KAAK,4CAEPI,EAAAA,mBAoCM,MApCNP,EAoCM,CAlCIG,EAAA,yCADRC,EAAAA,YAQEC,EAAA,OANC,KAAMF,EAAA,IAAG,CAAA,EACV,eAAa,OACb,MAAM,wBACN,MAAM,gBACN,MAAM,IACN,YAAA,kDAEeA,EAAA,yCAAjBC,EAAAA,YAAiHI,EAAA,OAArE,MAAM,wBAAwB,MAAM,eAAe,KAAK,2DAEpGP,EAAAA,mBAaWQ,EAAAA,SAAA,KAAAC,EAAAA,WAbqBP,EAAA,UAAfQ,uDAAgCA,GAAW,CAC9CR,EAAA,OAASQ,iBAArBV,EAAAA,mBAEO,OAFPW,EAEOC,kBADFF,CAAW,EAAA,CAAA,kBAEhBP,EAAAA,YAQEC,EAAA,OANC,KAAMF,EAAA,IAAIQ,CAAW,EACrB,SAAUA,CAAW,GACtB,eAAa,OACb,MAAM,wBACN,MAAM,gBACN,YAAA,2CAGaR,EAAA,wCAAjBC,EAAAA,YAAgHI,EAAA,OAArE,MAAM,wBAAwB,MAAM,eAAe,KAAK,0CAE3FL,EAAA,wCADRC,EAAAA,YAQEC,EAAA,OANC,KAAMF,EAAA,IAAIA,EAAA,SAAS,EACnB,SAAUA,EAAA,SAAS,GACpB,eAAa,OACb,MAAM,wBACN,MAAM,gBACN,YAAA,4DAGJG,EAAAA,YAOED,EAAA,CANC,SAAUF,EAAA,aACV,KAAOA,EAAA,aAA+B,OAAhBA,MAAIA,EAAA,QAAQ,EACnC,eAAa,UACb,MAAM,kDACN,MAAM,gBACN,KAAK,6CAGCA,EAAA,mCADRC,EAAAA,YAQEC,EAAA,OANC,SAAUF,EAAA,aACV,KAAOA,EAAA,aAAgC,OAAjBA,MAAIA,EAAA,SAAS,EACpC,eAAa,UACb,MAAM,kDACN,MAAM,gBACN,KAAK"}
+{"version":3,"file":"NeonPagination.vue.cjs.js","sources":["../../../../src/components/navigation/pagination/NeonPagination.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[\n      {\n        'neon-pagination--empty': hidePagination,\n      },\n      `neon-pagination--${color}`,\n    ]\"\n    class=\"neon-pagination\"\n  >\n    <neon-button\n      v-if=\"displayFirstAndLast\"\n      :disabled=\"disabledPrevious\"\n      :href=\"!disabledPrevious ? url(1) : undefined\"\n      button-style=\"outline\"\n      class=\"neon-pagination__nav-link neon-pagination__first\"\n      color=\"high-contrast\"\n      icon=\"first-page\"\n      @click=\"emit('page-change', 1)\"\n    />\n    <neon-button\n      :disabled=\"disabledPrevious\"\n      :href=\"!disabledPrevious ? url(previousPage) : undefined\"\n      button-style=\"outline\"\n      class=\"neon-pagination__nav-link neon-pagination__previous\"\n      color=\"high-contrast\"\n      icon=\"chevron-left\"\n      @click=\"emit('page-change', previousPage)\"\n    />\n    <div class=\"neon-pagination__page-links\">\n      <neon-button\n        v-if=\"showFirstPageWithEllipsis\"\n        :href=\"url(1)\"\n        button-style=\"text\"\n        class=\"neon-pagination__link\"\n        color=\"high-contrast\"\n        label=\"1\"\n        transparent\n        @click=\"emit('page-change', 1)\"\n      />\n      <neon-icon v-if=\"showFirstPageWithEllipsis\" class=\"neon-pagination__less\" color=\"low-contrast\" name=\"ellipsis\" />\n      <!-- eslint-disable-next-line -->\n      <template v-for=\"pageInRange in pageRange\" :key=\"pageInRange\">\n        <span v-if=\"page === pageInRange\" class=\"neon-pagination__link--selected\">\n          {{ pageInRange }}\n        </span>\n        <neon-button\n          v-else\n          :href=\"url(pageInRange)\"\n          :label=\"`${pageInRange}`\"\n          button-style=\"text\"\n          class=\"neon-pagination__link\"\n          color=\"high-contrast\"\n          transparent\n          @click=\"emit('page-change', pageInRange)\"\n        />\n      </template>\n      <neon-icon v-if=\"showLastPageWithEllipsis\" class=\"neon-pagination__more\" color=\"low-contrast\" name=\"ellipsis\" />\n      <neon-button\n        v-if=\"showLastPageWithEllipsis\"\n        :href=\"url(pageCount)\"\n        :label=\"`${pageCount}`\"\n        button-style=\"text\"\n        class=\"neon-pagination__link\"\n        color=\"high-contrast\"\n        transparent\n        @click=\"emit('page-change', pageCount)\"\n      />\n    </div>\n    <neon-button\n      :disabled=\"disabledNext\"\n      :href=\"!disabledNext ? url(nextPage) : undefined\"\n      button-style=\"outline\"\n      class=\"neon-pagination__nav-link neon-pagination__next\"\n      color=\"high-contrast\"\n      icon=\"chevron-right\"\n      @click=\"emit('page-change', nextPage)\"\n    />\n    <neon-button\n      v-if=\"displayFirstAndLast\"\n      :disabled=\"disabledNext\"\n      :href=\"!disabledNext ? url(pageCount) : undefined\"\n      button-style=\"outline\"\n      class=\"neon-pagination__nav-link neon-pagination__last\"\n      color=\"high-contrast\"\n      icon=\"last-page\"\n      @click=\"emit('page-change', pageCount)\"\n    />\n  </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonPagination.ts\"></script>\n"],"names":["_hoisted_1","_createElementBlock","_normalizeClass","_ctx","_createBlock","_component_neon_button","_createVNode","_cache","$event","_createElementVNode","_component_neon_icon","_Fragment","_renderList","pageInRange","_hoisted_2","_toDisplayString"],"mappings":"yIA6BSA,EAAA,CAAA,MAAM,6BAA6B,WAcF,MAAM,4JA1C9CC,EAAAA,mBAuFM,MAAA,CAtFH,MAAKC,EAAAA,eAAA,CAAA,2BAA8CC,EAAA,oCAAmDA,EAAA,KAAK,IAMtG,iBAAiB,CAAA,IAGfA,EAAA,mCADRC,EAAAA,YASEC,EAAA,OAPC,SAAUF,EAAA,iBACV,KAAOA,EAAA,iBAA4B,OAATA,EAAA,OAC3B,eAAa,UACb,MAAM,mDACN,MAAM,gBACN,KAAK,aACJ,uBAAOA,EAAA,KAAI,cAAA,CAAA,6DAEdG,EAAAA,YAQED,EAAA,CAPC,SAAUF,EAAA,iBACV,KAAOA,EAAA,iBAAuC,OAApBA,MAAIA,EAAA,YAAY,EAC3C,eAAa,UACb,MAAM,sDACN,MAAM,gBACN,KAAK,eACJ,QAAKI,EAAA,CAAA,IAAAA,EAAA,CAAA,EAAAC,GAAEL,EAAA,KAAI,cAAgBA,EAAA,YAAY,gCAE1CM,EAAAA,mBAuCM,MAvCNT,EAuCM,CArCIG,EAAA,yCADRC,EAAAA,YASEC,EAAA,OAPC,KAAMF,EAAA,IAAG,CAAA,EACV,eAAa,OACb,MAAM,wBACN,MAAM,gBACN,MAAM,IACN,YAAA,GACC,uBAAOA,EAAA,KAAI,cAAA,CAAA,kDAEGA,EAAA,yCAAjBC,EAAAA,YAAiHM,EAAA,OAArE,MAAM,wBAAwB,MAAM,eAAe,KAAK,2DAEpGT,EAAAA,mBAcWU,EAAAA,SAAA,KAAAC,EAAAA,WAdqBT,EAAA,UAAfU,uDAAgCA,GAAW,CAC9CV,EAAA,OAASU,iBAArBZ,EAAAA,mBAEO,OAFPa,EAEOC,kBADFF,CAAW,EAAA,CAAA,kBAEhBT,EAAAA,YASEC,EAAA,OAPC,KAAMF,EAAA,IAAIU,CAAW,EACrB,SAAUA,CAAW,GACtB,eAAa,OACb,MAAM,wBACN,MAAM,gBACN,YAAA,GACC,QAAKL,GAAEL,EAAA,KAAI,cAAgBU,CAAW,oDAG1BV,EAAA,wCAAjBC,EAAAA,YAAgHM,EAAA,OAArE,MAAM,wBAAwB,MAAM,eAAe,KAAK,0CAE3FP,EAAA,wCADRC,EAAAA,YASEC,EAAA,OAPC,KAAMF,EAAA,IAAIA,EAAA,SAAS,EACnB,SAAUA,EAAA,SAAS,GACpB,eAAa,OACb,MAAM,wBACN,MAAM,gBACN,YAAA,GACC,QAAKI,EAAA,CAAA,IAAAA,EAAA,CAAA,EAAAC,GAAEL,EAAA,KAAI,cAAgBA,EAAA,SAAS,4DAGzCG,EAAAA,YAQED,EAAA,CAPC,SAAUF,EAAA,aACV,KAAOA,EAAA,aAA+B,OAAhBA,MAAIA,EAAA,QAAQ,EACnC,eAAa,UACb,MAAM,kDACN,MAAM,gBACN,KAAK,gBACJ,QAAKI,EAAA,CAAA,IAAAA,EAAA,CAAA,EAAAC,GAAEL,EAAA,KAAI,cAAgBA,EAAA,QAAQ,gCAG9BA,EAAA,mCADRC,EAAAA,YASEC,EAAA,OAPC,SAAUF,EAAA,aACV,KAAOA,EAAA,aAAgC,OAAjBA,MAAIA,EAAA,SAAS,EACpC,eAAa,UACb,MAAM,kDACN,MAAM,gBACN,KAAK,YACJ,QAAKI,EAAA,CAAA,IAAAA,EAAA,CAAA,EAAAC,GAAEL,EAAA,KAAI,cAAgBA,EAAA,SAAS"}

package/dist/components/navigation/pagination/NeonPagination.vue.es.js

@@ -1,13 +1,13 @@
-import p from "./NeonPagination.es.js";
-import { resolveComponent as r, openBlock as e, createElementBlock as t, normalizeClass as h, createBlock as i, createCommentVNode as a, createVNode as d, createElementVNode as g, Fragment as u, renderList as b, toDisplayString as c } from "vue";
-import f from "../../../_virtual/_plugin-vue_export-helper.es.js";
-const k = { class: "neon-pagination__page-links" }, m = {
+import g from "./NeonPagination.es.js";
+import { resolveComponent as p, openBlock as i, createElementBlock as s, normalizeClass as h, createBlock as a, createCommentVNode as t, createVNode as d, createElementVNode as b, Fragment as u, renderList as f, toDisplayString as k } from "vue";
+import m from "../../../_virtual/_plugin-vue_export-helper.es.js";
+const v = { class: "neon-pagination__page-links" }, y = {
   key: 0,
   class: "neon-pagination__link--selected"
 };
-function y(n, _, v, P, w, N) {
-  const o = r("neon-button"), s = r("neon-icon");
-  return e(), t("div", {
+function C(n, e, P, $, c, N) {
+  const l = p("neon-button"), r = p("neon-icon");
+  return i(), s("div", {
     class: h([[
       {
         "neon-pagination--empty": n.hidePagination
@@ -15,87 +15,94 @@ function y(n, _, v, P, w, N) {
       `neon-pagination--${n.color}`
     ], "neon-pagination"])
   }, [
-    n.displayFirstAndLast ? (e(), i(o, {
+    n.displayFirstAndLast ? (i(), a(l, {
       key: 0,
       disabled: n.disabledPrevious,
       href: n.disabledPrevious ? void 0 : n.url(1),
       "button-style": "outline",
       class: "neon-pagination__nav-link neon-pagination__first",
       color: "high-contrast",
-      icon: "first-page"
-    }, null, 8, ["disabled", "href"])) : a("", !0),
-    d(o, {
+      icon: "first-page",
+      onClick: e[0] || (e[0] = (o) => n.emit("page-change", 1))
+    }, null, 8, ["disabled", "href"])) : t("", !0),
+    d(l, {
       disabled: n.disabledPrevious,
       href: n.disabledPrevious ? void 0 : n.url(n.previousPage),
       "button-style": "outline",
       class: "neon-pagination__nav-link neon-pagination__previous",
       color: "high-contrast",
-      icon: "arrow-left-1"
+      icon: "chevron-left",
+      onClick: e[1] || (e[1] = (o) => n.emit("page-change", n.previousPage))
     }, null, 8, ["disabled", "href"]),
-    g("div", k, [
-      n.showFirstPageWithEllipsis ? (e(), i(o, {
+    b("div", v, [
+      n.showFirstPageWithEllipsis ? (i(), a(l, {
         key: 0,
         href: n.url(1),
         "button-style": "text",
         class: "neon-pagination__link",
         color: "high-contrast",
         label: "1",
-        transparent: ""
-      }, null, 8, ["href"])) : a("", !0),
-      n.showFirstPageWithEllipsis ? (e(), i(s, {
+        transparent: "",
+        onClick: e[2] || (e[2] = (o) => n.emit("page-change", 1))
+      }, null, 8, ["href"])) : t("", !0),
+      n.showFirstPageWithEllipsis ? (i(), a(r, {
         key: 1,
         class: "neon-pagination__less",
         color: "low-contrast",
         name: "ellipsis"
-      })) : a("", !0),
-      (e(!0), t(u, null, b(n.pageRange, (l) => (e(), t(u, { key: l }, [
-        n.page === l ? (e(), t("span", m, c(l), 1)) : (e(), i(o, {
+      })) : t("", !0),
+      (i(!0), s(u, null, f(n.pageRange, (o) => (i(), s(u, { key: o }, [
+        n.page === o ? (i(), s("span", y, k(o), 1)) : (i(), a(l, {
           key: 1,
-          href: n.url(l),
-          label: `${l}`,
+          href: n.url(o),
+          label: `${o}`,
           "button-style": "text",
           class: "neon-pagination__link",
           color: "high-contrast",
-          transparent: ""
-        }, null, 8, ["href", "label"]))
+          transparent: "",
+          onClick: (w) => n.emit("page-change", o)
+        }, null, 8, ["href", "label", "onClick"]))
       ], 64))), 128)),
-      n.showLastPageWithEllipsis ? (e(), i(s, {
+      n.showLastPageWithEllipsis ? (i(), a(r, {
         key: 2,
         class: "neon-pagination__more",
         color: "low-contrast",
         name: "ellipsis"
-      })) : a("", !0),
-      n.showLastPageWithEllipsis ? (e(), i(o, {
+      })) : t("", !0),
+      n.showLastPageWithEllipsis ? (i(), a(l, {
         key: 3,
         href: n.url(n.pageCount),
         label: `${n.pageCount}`,
         "button-style": "text",
         class: "neon-pagination__link",
         color: "high-contrast",
-        transparent: ""
-      }, null, 8, ["href", "label"])) : a("", !0)
+        transparent: "",
+        onClick: e[3] || (e[3] = (o) => n.emit("page-change", n.pageCount))
+      }, null, 8, ["href", "label"])) : t("", !0)
     ]),
-    d(o, {
+    d(l, {
       disabled: n.disabledNext,
       href: n.disabledNext ? void 0 : n.url(n.nextPage),
       "button-style": "outline",
       class: "neon-pagination__nav-link neon-pagination__next",
       color: "high-contrast",
-      icon: "arrow-right-1"
+      icon: "chevron-right",
+      onClick: e[4] || (e[4] = (o) => n.emit("page-change", n.nextPage))
     }, null, 8, ["disabled", "href"]),
-    n.displayFirstAndLast ? (e(), i(o, {
+    n.displayFirstAndLast ? (i(), a(l, {
       key: 1,
       disabled: n.disabledNext,
       href: n.disabledNext ? void 0 : n.url(n.pageCount),
       "button-style": "outline",
       class: "neon-pagination__nav-link neon-pagination__last",
       color: "high-contrast",
-      icon: "last-page"
-    }, null, 8, ["disabled", "href"])) : a("", !0)
+      icon: "last-page",
+      onClick: e[5] || (e[5] = (o) => n.emit("page-change", n.pageCount))
+    }, null, 8, ["disabled", "href"])) : t("", !0)
   ], 2);
 }
-const F = /* @__PURE__ */ f(p, [["render", y]]);
+const W = /* @__PURE__ */ m(g, [["render", C]]);
 export {
-  F as default
+  W as default
 };
 //# sourceMappingURL=NeonPagination.vue.es.js.map

package/dist/components/navigation/pagination/NeonPagination.vue.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonPagination.vue.es.js","sources":["../../../../src/components/navigation/pagination/NeonPagination.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[\n      {\n        'neon-pagination--empty': hidePagination,\n      },\n      `neon-pagination--${color}`,\n    ]\"\n    class=\"neon-pagination\"\n  >\n    <neon-button\n      v-if=\"displayFirstAndLast\"\n      :disabled=\"disabledPrevious\"\n      :href=\"!disabledPrevious ? url(1) : undefined\"\n      button-style=\"outline\"\n      class=\"neon-pagination__nav-link neon-pagination__first\"\n      color=\"high-contrast\"\n      icon=\"first-page\"\n    />\n    <neon-button\n      :disabled=\"disabledPrevious\"\n      :href=\"!disabledPrevious ? url(previousPage) : undefined\"\n      button-style=\"outline\"\n      class=\"neon-pagination__nav-link neon-pagination__previous\"\n      color=\"high-contrast\"\n      icon=\"arrow-left-1\"\n    />\n    <div class=\"neon-pagination__page-links\">\n      <neon-button\n        v-if=\"showFirstPageWithEllipsis\"\n        :href=\"url(1)\"\n        button-style=\"text\"\n        class=\"neon-pagination__link\"\n        color=\"high-contrast\"\n        label=\"1\"\n        transparent\n      />\n      <neon-icon v-if=\"showFirstPageWithEllipsis\" class=\"neon-pagination__less\" color=\"low-contrast\" name=\"ellipsis\" />\n      <!-- eslint-disable-next-line -->\n      <template v-for=\"pageInRange in pageRange\" :key=\"pageInRange\">\n        <span v-if=\"page === pageInRange\" class=\"neon-pagination__link--selected\">\n          {{ pageInRange }}\n        </span>\n        <neon-button\n          v-else\n          :href=\"url(pageInRange)\"\n          :label=\"`${pageInRange}`\"\n          button-style=\"text\"\n          class=\"neon-pagination__link\"\n          color=\"high-contrast\"\n          transparent\n        />\n      </template>\n      <neon-icon v-if=\"showLastPageWithEllipsis\" class=\"neon-pagination__more\" color=\"low-contrast\" name=\"ellipsis\" />\n      <neon-button\n        v-if=\"showLastPageWithEllipsis\"\n        :href=\"url(pageCount)\"\n        :label=\"`${pageCount}`\"\n        button-style=\"text\"\n        class=\"neon-pagination__link\"\n        color=\"high-contrast\"\n        transparent\n      />\n    </div>\n    <neon-button\n      :disabled=\"disabledNext\"\n      :href=\"!disabledNext ? url(nextPage) : undefined\"\n      button-style=\"outline\"\n      class=\"neon-pagination__nav-link neon-pagination__next\"\n      color=\"high-contrast\"\n      icon=\"arrow-right-1\"\n    />\n    <neon-button\n      v-if=\"displayFirstAndLast\"\n      :disabled=\"disabledNext\"\n      :href=\"!disabledNext ? url(pageCount) : undefined\"\n      button-style=\"outline\"\n      class=\"neon-pagination__nav-link neon-pagination__last\"\n      color=\"high-contrast\"\n      icon=\"last-page\"\n    />\n  </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonPagination.ts\"></script>\n"],"names":["_hoisted_1","_createElementBlock","_normalizeClass","_ctx","_createBlock","_component_neon_button","_createVNode","_createElementVNode","_component_neon_icon","_Fragment","_renderList","pageInRange","_hoisted_2","_toDisplayString"],"mappings":";;;AA2BS,MAAAA,IAAA,EAAA,OAAM,8BAA6B;;EAaF,OAAM;;;;cAvC9CC,EAgFM,OAAA;AAAA,IA/EH,OAAKC,EAAA,CAAA;AAAA;kCAA8CC,EAAA;AAAA;0BAAmDA,EAAA,KAAK;AAAA,OAMtG,iBAAiB,CAAA;AAAA;IAGfA,EAAA,4BADRC,EAQEC,GAAA;AAAA;MANC,UAAUF,EAAA;AAAA,MACV,MAAOA,EAAA,mBAA4B,SAATA,EAAA;MAC3B,gBAAa;AAAA,MACb,OAAM;AAAA,MACN,OAAM;AAAA,MACN,MAAK;AAAA;IAEPG,EAOED,GAAA;AAAA,MANC,UAAUF,EAAA;AAAA,MACV,MAAOA,EAAA,mBAAuC,SAApBA,MAAIA,EAAA,YAAY;AAAA,MAC3C,gBAAa;AAAA,MACb,OAAM;AAAA,MACN,OAAM;AAAA,MACN,MAAK;AAAA;IAEPI,EAoCM,OApCNP,GAoCM;AAAA,MAlCIG,EAAA,kCADRC,EAQEC,GAAA;AAAA;QANC,MAAMF,EAAA,IAAG,CAAA;AAAA,QACV,gBAAa;AAAA,QACb,OAAM;AAAA,QACN,OAAM;AAAA,QACN,OAAM;AAAA,QACN,aAAA;AAAA;MAEeA,EAAA,kCAAjBC,EAAiHI,GAAA;AAAA;QAArE,OAAM;AAAA,QAAwB,OAAM;AAAA,QAAe,MAAK;AAAA;cAEpGP,EAaWQ,GAAA,MAAAC,EAbqBP,EAAA,WAAS,CAAxBQ,wBAAgCA,KAAW;AAAA,QAC9CR,EAAA,SAASQ,UAArBV,EAEO,QAFPW,GAEOC,EADFF,CAAW,GAAA,CAAA,WAEhBP,EAQEC,GAAA;AAAA;UANC,MAAMF,EAAA,IAAIQ,CAAW;AAAA,UACrB,UAAUA,CAAW;AAAA,UACtB,gBAAa;AAAA,UACb,OAAM;AAAA,UACN,OAAM;AAAA,UACN,aAAA;AAAA;;MAGaR,EAAA,iCAAjBC,EAAgHI,GAAA;AAAA;QAArE,OAAM;AAAA,QAAwB,OAAM;AAAA,QAAe,MAAK;AAAA;MAE3FL,EAAA,iCADRC,EAQEC,GAAA;AAAA;QANC,MAAMF,EAAA,IAAIA,EAAA,SAAS;AAAA,QACnB,UAAUA,EAAA,SAAS;AAAA,QACpB,gBAAa;AAAA,QACb,OAAM;AAAA,QACN,OAAM;AAAA,QACN,aAAA;AAAA;;IAGJG,EAOED,GAAA;AAAA,MANC,UAAUF,EAAA;AAAA,MACV,MAAOA,EAAA,eAA+B,SAAhBA,MAAIA,EAAA,QAAQ;AAAA,MACnC,gBAAa;AAAA,MACb,OAAM;AAAA,MACN,OAAM;AAAA,MACN,MAAK;AAAA;IAGCA,EAAA,4BADRC,EAQEC,GAAA;AAAA;MANC,UAAUF,EAAA;AAAA,MACV,MAAOA,EAAA,eAAgC,SAAjBA,MAAIA,EAAA,SAAS;AAAA,MACpC,gBAAa;AAAA,MACb,OAAM;AAAA,MACN,OAAM;AAAA,MACN,MAAK;AAAA;;;;"}
+{"version":3,"file":"NeonPagination.vue.es.js","sources":["../../../../src/components/navigation/pagination/NeonPagination.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[\n      {\n        'neon-pagination--empty': hidePagination,\n      },\n      `neon-pagination--${color}`,\n    ]\"\n    class=\"neon-pagination\"\n  >\n    <neon-button\n      v-if=\"displayFirstAndLast\"\n      :disabled=\"disabledPrevious\"\n      :href=\"!disabledPrevious ? url(1) : undefined\"\n      button-style=\"outline\"\n      class=\"neon-pagination__nav-link neon-pagination__first\"\n      color=\"high-contrast\"\n      icon=\"first-page\"\n      @click=\"emit('page-change', 1)\"\n    />\n    <neon-button\n      :disabled=\"disabledPrevious\"\n      :href=\"!disabledPrevious ? url(previousPage) : undefined\"\n      button-style=\"outline\"\n      class=\"neon-pagination__nav-link neon-pagination__previous\"\n      color=\"high-contrast\"\n      icon=\"chevron-left\"\n      @click=\"emit('page-change', previousPage)\"\n    />\n    <div class=\"neon-pagination__page-links\">\n      <neon-button\n        v-if=\"showFirstPageWithEllipsis\"\n        :href=\"url(1)\"\n        button-style=\"text\"\n        class=\"neon-pagination__link\"\n        color=\"high-contrast\"\n        label=\"1\"\n        transparent\n        @click=\"emit('page-change', 1)\"\n      />\n      <neon-icon v-if=\"showFirstPageWithEllipsis\" class=\"neon-pagination__less\" color=\"low-contrast\" name=\"ellipsis\" />\n      <!-- eslint-disable-next-line -->\n      <template v-for=\"pageInRange in pageRange\" :key=\"pageInRange\">\n        <span v-if=\"page === pageInRange\" class=\"neon-pagination__link--selected\">\n          {{ pageInRange }}\n        </span>\n        <neon-button\n          v-else\n          :href=\"url(pageInRange)\"\n          :label=\"`${pageInRange}`\"\n          button-style=\"text\"\n          class=\"neon-pagination__link\"\n          color=\"high-contrast\"\n          transparent\n          @click=\"emit('page-change', pageInRange)\"\n        />\n      </template>\n      <neon-icon v-if=\"showLastPageWithEllipsis\" class=\"neon-pagination__more\" color=\"low-contrast\" name=\"ellipsis\" />\n      <neon-button\n        v-if=\"showLastPageWithEllipsis\"\n        :href=\"url(pageCount)\"\n        :label=\"`${pageCount}`\"\n        button-style=\"text\"\n        class=\"neon-pagination__link\"\n        color=\"high-contrast\"\n        transparent\n        @click=\"emit('page-change', pageCount)\"\n      />\n    </div>\n    <neon-button\n      :disabled=\"disabledNext\"\n      :href=\"!disabledNext ? url(nextPage) : undefined\"\n      button-style=\"outline\"\n      class=\"neon-pagination__nav-link neon-pagination__next\"\n      color=\"high-contrast\"\n      icon=\"chevron-right\"\n      @click=\"emit('page-change', nextPage)\"\n    />\n    <neon-button\n      v-if=\"displayFirstAndLast\"\n      :disabled=\"disabledNext\"\n      :href=\"!disabledNext ? url(pageCount) : undefined\"\n      button-style=\"outline\"\n      class=\"neon-pagination__nav-link neon-pagination__last\"\n      color=\"high-contrast\"\n      icon=\"last-page\"\n      @click=\"emit('page-change', pageCount)\"\n    />\n  </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonPagination.ts\"></script>\n"],"names":["_hoisted_1","_createElementBlock","_normalizeClass","_ctx","_createBlock","_component_neon_button","_createVNode","_cache","$event","_createElementVNode","_component_neon_icon","_Fragment","_renderList","pageInRange","_hoisted_2","_toDisplayString"],"mappings":"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"}

package/dist/components/presentation/empty-state/NeonEmptyState.cjs.js

@@ -0,0 +1,2 @@
+"use strict";const n=require("vue"),o=require("../../user-input/button/NeonButton.vue.cjs.js"),e=require("../../../model/common/color/NeonFunctionalColor.cjs.js"),r=require("../icon/NeonIcon.vue.cjs.js"),i=require("../../layout/inline/NeonInline.vue.cjs.js"),u=require("../../layout/stack/NeonStack.vue.cjs.js"),c=require("../../../model/user-input/button/NeonButtonStyle.cjs.js"),p=require("../../../model/presentation/empty-state/NeonEmptyStateType.cjs.js"),a=n.defineComponent({name:"NeonEmptyState",components:{NeonButton:o,NeonIcon:r,NeonInline:i,NeonStack:u},props:{image:{type:String},type:{type:String,default:()=>p.NeonEmptyStateType.EmptyState},imageColor:{type:String,default:()=>e.NeonFunctionalColor.Brand},title:{type:String,required:!0},subtitle:{type:String},ctas:{type:Array,default:()=>[]}},emits:["cta-click"],setup:(s,{emit:t})=>({emit:t,NeonButtonStyle:c.NeonButtonStyle,NeonFunctionalColor:e.NeonFunctionalColor})});module.exports=a;
+//# sourceMappingURL=NeonEmptyState.cjs.js.map

package/dist/components/presentation/empty-state/NeonEmptyState.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NeonEmptyState.cjs.js","sources":["../../../../src/components/presentation/empty-state/NeonEmptyState.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { defineComponent } from 'vue';\nimport NeonButton from '@/components/user-input/button/NeonButton.vue';\nimport type { NeonButtonModel } from '@/model/user-input/button/NeonButtonModel';\nimport { NeonFunctionalColor } from '@/model/common/color/NeonFunctionalColor';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport NeonInline from '@/components/layout/inline/NeonInline.vue';\nimport NeonStack from '@/components/layout/stack/NeonStack.vue';\nimport { NeonButtonStyle } from '@/model/user-input/button/NeonButtonStyle';\nimport { NeonEmptyStateType } from '@/model/presentation/empty-state/NeonEmptyStateType';\n\n/**\n * NeonEmptyState is a component for displaying an empty state message with an image and optional call-to-action buttons.\n * It can also be used to render error pages.\n */\nexport default defineComponent({\n  name: 'NeonEmptyState',\n  components: {\n    NeonButton,\n    NeonIcon,\n    NeonInline,\n    NeonStack,\n  },\n  props: {\n    /**\n     * The image to display in the empty state. This is an icon name used by the NeonIcon component, typically an\n     * svg illustration.\n     */\n    image: { type: String },\n    /**\n     * The type of empty state to render, either an empty state or an error.\n     */\n    type: { type: String as () => NeonEmptyStateType, default: () => NeonEmptyStateType.EmptyState },\n    /**\n     * The accent color of the image. This is a functional color from the NeonFunctionalColor enum.\n     */\n    imageColor: { type: String as () => NeonFunctionalColor, default: () => NeonFunctionalColor.Brand },\n    /**\n     * The title of the empty state component.\n     */\n    title: { type: String, required: true },\n    /**\n     * A subtitle of the empty state component.\n     */\n    subtitle: { type: String },\n    /**\n     * A list of CTA buttons to display in the empty state. These are\n     * NeonButtonModel objects.\n     */\n    ctas: { type: Array as () => Array<NeonButtonModel>, default: () => [] },\n  },\n  emits: [\n    /**\n     * Emitted when a CTA button is clicked. The index of the button in the ctas array is passed as the first argument.\n     * @type {number} The index of the button clicked. This corresponds to the index of the button in the ctas property\n     * array.\n     */\n    'cta-click',\n  ],\n  setup: (_props, { emit }) => {\n    return {\n      emit,\n      NeonButtonStyle,\n      NeonFunctionalColor,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonButton","NeonIcon","NeonInline","NeonStack","NeonEmptyStateType","NeonFunctionalColor","_props","emit","NeonButtonStyle"],"mappings":"4cAcAA,EAAeC,kBAAgB,CAC7B,KAAM,iBACN,WAAY,CACV,WAAAC,EACA,SAAAC,EACA,WAAAC,EACA,UAAAC,CAAA,EAEF,MAAO,CAKL,MAAO,CAAE,KAAM,MAAA,EAIf,KAAM,CAAE,KAAM,OAAoC,QAAS,IAAMC,EAAAA,mBAAmB,UAAA,EAIpF,WAAY,CAAE,KAAM,OAAqC,QAAS,IAAMC,EAAAA,oBAAoB,KAAA,EAI5F,MAAO,CAAE,KAAM,OAAQ,SAAU,EAAA,EAIjC,SAAU,CAAE,KAAM,MAAA,EAKlB,KAAM,CAAE,KAAM,MAAuC,QAAS,IAAM,CAAA,CAAC,CAAE,EAEzE,MAAO,CAML,WAAA,EAEF,MAAO,CAACC,EAAQ,CAAE,KAAAC,MACT,CACL,KAAAA,EAAA,gBACAC,EAAAA,gBAAA,oBACAH,EAAAA,mBAAA,EAGN,CAAC"}

package/dist/components/presentation/empty-state/NeonEmptyState.es.js

@@ -0,0 +1,62 @@
+import { defineComponent as o } from "vue";
+import r from "../../user-input/button/NeonButton.vue.es.js";
+import { NeonFunctionalColor as t } from "../../../model/common/color/NeonFunctionalColor.es.js";
+import n from "../icon/NeonIcon.vue.es.js";
+import p from "../../layout/inline/NeonInline.vue.es.js";
+import m from "../../layout/stack/NeonStack.vue.es.js";
+import { NeonButtonStyle as i } from "../../../model/user-input/button/NeonButtonStyle.es.js";
+import { NeonEmptyStateType as a } from "../../../model/presentation/empty-state/NeonEmptyStateType.es.js";
+const g = o({
+  name: "NeonEmptyState",
+  components: {
+    NeonButton: r,
+    NeonIcon: n,
+    NeonInline: p,
+    NeonStack: m
+  },
+  props: {
+    /**
+     * The image to display in the empty state. This is an icon name used by the NeonIcon component, typically an
+     * svg illustration.
+     */
+    image: { type: String },
+    /**
+     * The type of empty state to render, either an empty state or an error.
+     */
+    type: { type: String, default: () => a.EmptyState },
+    /**
+     * The accent color of the image. This is a functional color from the NeonFunctionalColor enum.
+     */
+    imageColor: { type: String, default: () => t.Brand },
+    /**
+     * The title of the empty state component.
+     */
+    title: { type: String, required: !0 },
+    /**
+     * A subtitle of the empty state component.
+     */
+    subtitle: { type: String },
+    /**
+     * A list of CTA buttons to display in the empty state. These are
+     * NeonButtonModel objects.
+     */
+    ctas: { type: Array, default: () => [] }
+  },
+  emits: [
+    /**
+     * Emitted when a CTA button is clicked. The index of the button in the ctas array is passed as the first argument.
+     * @type {number} The index of the button clicked. This corresponds to the index of the button in the ctas property
+     * array.
+     */
+    "cta-click"
+  ],
+  setup: (f, { emit: e }) => ({
+    emit: e,
+    NeonButtonStyle: i,
+    NeonFunctionalColor: t
+  })
+});
+export {
+  g as default
+};
+//# sourceMappingURL=NeonEmptyState.es.js.map

package/dist/components/presentation/empty-state/NeonEmptyState.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NeonEmptyState.es.js","sources":["../../../../src/components/presentation/empty-state/NeonEmptyState.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { defineComponent } from 'vue';\nimport NeonButton from '@/components/user-input/button/NeonButton.vue';\nimport type { NeonButtonModel } from '@/model/user-input/button/NeonButtonModel';\nimport { NeonFunctionalColor } from '@/model/common/color/NeonFunctionalColor';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport NeonInline from '@/components/layout/inline/NeonInline.vue';\nimport NeonStack from '@/components/layout/stack/NeonStack.vue';\nimport { NeonButtonStyle } from '@/model/user-input/button/NeonButtonStyle';\nimport { NeonEmptyStateType } from '@/model/presentation/empty-state/NeonEmptyStateType';\n\n/**\n * NeonEmptyState is a component for displaying an empty state message with an image and optional call-to-action buttons.\n * It can also be used to render error pages.\n */\nexport default defineComponent({\n  name: 'NeonEmptyState',\n  components: {\n    NeonButton,\n    NeonIcon,\n    NeonInline,\n    NeonStack,\n  },\n  props: {\n    /**\n     * The image to display in the empty state. This is an icon name used by the NeonIcon component, typically an\n     * svg illustration.\n     */\n    image: { type: String },\n    /**\n     * The type of empty state to render, either an empty state or an error.\n     */\n    type: { type: String as () => NeonEmptyStateType, default: () => NeonEmptyStateType.EmptyState },\n    /**\n     * The accent color of the image. This is a functional color from the NeonFunctionalColor enum.\n     */\n    imageColor: { type: String as () => NeonFunctionalColor, default: () => NeonFunctionalColor.Brand },\n    /**\n     * The title of the empty state component.\n     */\n    title: { type: String, required: true },\n    /**\n     * A subtitle of the empty state component.\n     */\n    subtitle: { type: String },\n    /**\n     * A list of CTA buttons to display in the empty state. These are\n     * NeonButtonModel objects.\n     */\n    ctas: { type: Array as () => Array<NeonButtonModel>, default: () => [] },\n  },\n  emits: [\n    /**\n     * Emitted when a CTA button is clicked. The index of the button in the ctas array is passed as the first argument.\n     * @type {number} The index of the button clicked. This corresponds to the index of the button in the ctas property\n     * array.\n     */\n    'cta-click',\n  ],\n  setup: (_props, { emit }) => {\n    return {\n      emit,\n      NeonButtonStyle,\n      NeonFunctionalColor,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonButton","NeonIcon","NeonInline","NeonStack","NeonEmptyStateType","NeonFunctionalColor","_props","emit","NeonButtonStyle"],"mappings":";;;;;;;;AAcA,MAAAA,IAAeC,EAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV,YAAAC;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC;AAAA,IACA,WAAAC;AAAA,EAAA;AAAA,EAEF,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKL,OAAO,EAAE,MAAM,OAAA;AAAA;AAAA;AAAA;AAAA,IAIf,MAAM,EAAE,MAAM,QAAoC,SAAS,MAAMC,EAAmB,WAAA;AAAA;AAAA;AAAA;AAAA,IAIpF,YAAY,EAAE,MAAM,QAAqC,SAAS,MAAMC,EAAoB,MAAA;AAAA;AAAA;AAAA;AAAA,IAI5F,OAAO,EAAE,MAAM,QAAQ,UAAU,GAAA;AAAA;AAAA;AAAA;AAAA,IAIjC,UAAU,EAAE,MAAM,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKlB,MAAM,EAAE,MAAM,OAAuC,SAAS,MAAM,CAAA,EAAC;AAAA,EAAE;AAAA,EAEzE,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAML;AAAA,EAAA;AAAA,EAEF,OAAO,CAACC,GAAQ,EAAE,MAAAC,SACT;AAAA,IACL,MAAAA;AAAA,IACA,iBAAAC;AAAA,IACA,qBAAAH;AAAA,EAAA;AAGN,CAAC;"}

package/dist/components/presentation/empty-state/NeonEmptyState.vue.cjs.js

@@ -0,0 +1,2 @@
+"use strict";const c=require("./NeonEmptyState.cjs.js"),e=require("vue"),i=require("../../../_virtual/_plugin-vue_export-helper.cjs.js"),p={class:"neon-empty-state__title"},m={key:1,class:"neon-h3 neon-empty-state__subtitle"},u={class:"neon-empty-state__description"};function _(o,d,k,h,C,b){const l=e.resolveComponent("neon-icon"),s=e.resolveComponent("neon-button"),r=e.resolveComponent("neon-inline"),a=e.resolveComponent("neon-stack");return e.openBlock(),e.createBlock(a,{class:e.normalizeClass([`neon-empty-state--${o.type}`,"neon-empty-state"]),gap:"l"},{default:e.withCtx(()=>[o.image?(e.openBlock(),e.createBlock(l,{key:0,color:o.imageColor,name:o.image,class:"neon-empty-state__illustration"},null,8,["color","name"])):e.createCommentVNode("",!0),e.createElementVNode("h1",p,e.toDisplayString(o.title),1),o.subtitle?(e.openBlock(),e.createElementBlock("h2",m,e.toDisplayString(o.subtitle),1)):e.createCommentVNode("",!0),e.createElementVNode("div",u,[e.renderSlot(o.$slots,"description")]),o.ctas.length>0?(e.openBlock(),e.createBlock(r,{key:2,class:"neon-empty-state__ctas",gap:"m"},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.ctas,(n,t)=>(e.openBlock(),e.createBlock(s,{key:n.label||n.icon,"button-style":n.style||(t===o.ctas.length-1?o.NeonButtonStyle.Solid:o.NeonButtonStyle.Outline),color:n.color||(t===o.ctas.length-1?o.NeonFunctionalColor.Primary:o.NeonFunctionalColor.HighContrast),disabled:!!n.disabled,href:n.href,icon:n.icon,label:n.label,class:"neon-empty-state__cta",onClick:g=>!n.href&&o.emit("cta-click",t)},null,8,["button-style","color","disabled","href","icon","label","onClick"]))),128))]),_:1})):e.createCommentVNode("",!0)]),_:3},8,["class"])}const y=i(c,[["render",_]]);module.exports=y;
+//# sourceMappingURL=NeonEmptyState.vue.cjs.js.map

package/dist/components/presentation/empty-state/NeonEmptyState.vue.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NeonEmptyState.vue.cjs.js","sources":["../../../../src/components/presentation/empty-state/NeonEmptyState.vue"],"sourcesContent":["<template>\n  <neon-stack :class=\"`neon-empty-state--${type}`\" class=\"neon-empty-state\" gap=\"l\">\n    <neon-icon v-if=\"image\" :color=\"imageColor\" :name=\"image\" class=\"neon-empty-state__illustration\" />\n    <h1 class=\"neon-empty-state__title\">{{ title }}</h1>\n    <h2 v-if=\"subtitle\" class=\"neon-h3 neon-empty-state__subtitle\">{{ subtitle }}</h2>\n    <div class=\"neon-empty-state__description\">\n      <!-- @slot description rendered between the empty state title & any CTAs -->\n      <slot name=\"description\"></slot>\n    </div>\n    <neon-inline v-if=\"ctas.length > 0\" class=\"neon-empty-state__ctas\" gap=\"m\">\n      <neon-button\n        v-for=\"(cta, index) in ctas\"\n        :key=\"cta.label || cta.icon\"\n        :button-style=\"cta.style || (index === ctas.length - 1 ? NeonButtonStyle.Solid : NeonButtonStyle.Outline)\"\n        :color=\"\n          cta.color || (index === ctas.length - 1 ? NeonFunctionalColor.Primary : NeonFunctionalColor.HighContrast)\n        \"\n        :disabled=\"!!cta.disabled\"\n        :href=\"cta.href\"\n        :icon=\"cta.icon\"\n        :label=\"cta.label\"\n        class=\"neon-empty-state__cta\"\n        @click=\"!cta.href && emit('cta-click', index)\"\n      />\n    </neon-inline>\n  </neon-stack>\n</template>\n\n<script lang=\"ts\" src=\"./NeonEmptyState.ts\" />\n"],"names":["_hoisted_1","_hoisted_3","_createBlock","_component_neon_stack","_normalizeClass","_ctx","_component_neon_icon","_createElementVNode","_toDisplayString","_createElementBlock","_hoisted_2","_renderSlot","_component_neon_inline","_openBlock","_Fragment","_renderList","cta","index","_component_neon_button"],"mappings":"yIAGQA,EAAA,CAAA,MAAM,yBAAyB,WACf,MAAM,sCACrBC,EAAA,CAAA,MAAM,+BAA+B,kMAJ5CC,EAAAA,YAwBaC,EAAA,CAxBA,MAAKC,EAAAA,eAAA,CAAA,qBAAuBC,EAAA,IAAI,GAAU,kBAAkB,CAAA,EAAC,IAAI,wBAC5E,IAAmG,CAAlFA,EAAA,qBAAjBH,EAAAA,YAAmGI,EAAA,OAA1E,MAAOD,EAAA,WAAa,KAAMA,EAAA,MAAO,MAAM,wFAChEE,EAAAA,mBAAoD,KAApDP,EAAoDQ,EAAAA,gBAAbH,EAAA,KAAK,EAAA,CAAA,EAClCA,EAAA,wBAAVI,EAAAA,mBAAkF,KAAlFC,EAAkFF,EAAAA,gBAAhBH,EAAA,QAAQ,EAAA,CAAA,+BAC1EE,EAAAA,mBAGM,MAHNN,EAGM,CADJU,aAAgCN,EAAA,OAAA,aAAA,IAEfA,EAAA,KAAK,OAAM,iBAA9BH,EAAAA,YAecU,EAAA,OAfsB,MAAM,yBAAyB,IAAI,wBAEnE,IAA4B,EAD9BC,EAAAA,UAAA,EAAA,EAAAJ,EAAAA,mBAaEK,WAAA,KAAAC,EAAAA,WAZuBV,EAAA,KAAI,CAAnBW,EAAKC,mBADff,EAAAA,YAaEgB,EAAA,CAXC,IAAKF,EAAI,OAASA,EAAI,KACtB,eAAcA,EAAI,QAAUC,IAAUZ,EAAA,KAAK,SAAaA,EAAA,gBAAgB,MAAQA,EAAA,gBAAgB,SAChG,MAAkBW,EAAI,QAAUC,IAAUZ,EAAA,KAAK,OAAM,EAAOA,sBAAoB,QAAUA,EAAA,oBAAoB,cAG9G,SAAQ,CAAA,CAAIW,EAAI,SAChB,KAAMA,EAAI,KACV,KAAMA,EAAI,KACV,MAAOA,EAAI,MACZ,MAAM,wBACL,YAAQA,EAAI,MAAQX,EAAA,iBAAkBY,CAAK"}

package/dist/components/presentation/empty-state/NeonEmptyState.vue.es.js

@@ -0,0 +1,54 @@
+import y from "./NeonEmptyState.es.js";
+import { resolveComponent as t, openBlock as o, createBlock as l, normalizeClass as h, withCtx as r, createCommentVNode as a, createElementVNode as i, toDisplayString as c, createElementBlock as m, renderSlot as b, Fragment as f, renderList as k } from "vue";
+import g from "../../../_virtual/_plugin-vue_export-helper.es.js";
+const C = { class: "neon-empty-state__title" }, N = {
+  key: 1,
+  class: "neon-h3 neon-empty-state__subtitle"
+}, $ = { class: "neon-empty-state__description" };
+function S(e, B, v, E, F, V) {
+  const p = t("neon-icon"), u = t("neon-button"), _ = t("neon-inline"), d = t("neon-stack");
+  return o(), l(d, {
+    class: h([`neon-empty-state--${e.type}`, "neon-empty-state"]),
+    gap: "l"
+  }, {
+    default: r(() => [
+      e.image ? (o(), l(p, {
+        key: 0,
+        color: e.imageColor,
+        name: e.image,
+        class: "neon-empty-state__illustration"
+      }, null, 8, ["color", "name"])) : a("", !0),
+      i("h1", C, c(e.title), 1),
+      e.subtitle ? (o(), m("h2", N, c(e.subtitle), 1)) : a("", !0),
+      i("div", $, [
+        b(e.$slots, "description")
+      ]),
+      e.ctas.length > 0 ? (o(), l(_, {
+        key: 2,
+        class: "neon-empty-state__ctas",
+        gap: "m"
+      }, {
+        default: r(() => [
+          (o(!0), m(f, null, k(e.ctas, (n, s) => (o(), l(u, {
+            key: n.label || n.icon,
+            "button-style": n.style || (s === e.ctas.length - 1 ? e.NeonButtonStyle.Solid : e.NeonButtonStyle.Outline),
+            color: n.color || (s === e.ctas.length - 1 ? e.NeonFunctionalColor.Primary : e.NeonFunctionalColor.HighContrast),
+            disabled: !!n.disabled,
+            href: n.href,
+            icon: n.icon,
+            label: n.label,
+            class: "neon-empty-state__cta",
+            onClick: (w) => !n.href && e.emit("cta-click", s)
+          }, null, 8, ["button-style", "color", "disabled", "href", "icon", "label", "onClick"]))), 128))
+        ]),
+        _: 1
+      })) : a("", !0)
+    ]),
+    _: 3
+  }, 8, ["class"]);
+}
+const L = /* @__PURE__ */ g(y, [["render", S]]);
+export {
+  L as default
+};
+//# sourceMappingURL=NeonEmptyState.vue.es.js.map

package/dist/components/presentation/empty-state/NeonEmptyState.vue.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NeonEmptyState.vue.es.js","sources":["../../../../src/components/presentation/empty-state/NeonEmptyState.vue"],"sourcesContent":["<template>\n  <neon-stack :class=\"`neon-empty-state--${type}`\" class=\"neon-empty-state\" gap=\"l\">\n    <neon-icon v-if=\"image\" :color=\"imageColor\" :name=\"image\" class=\"neon-empty-state__illustration\" />\n    <h1 class=\"neon-empty-state__title\">{{ title }}</h1>\n    <h2 v-if=\"subtitle\" class=\"neon-h3 neon-empty-state__subtitle\">{{ subtitle }}</h2>\n    <div class=\"neon-empty-state__description\">\n      <!-- @slot description rendered between the empty state title & any CTAs -->\n      <slot name=\"description\"></slot>\n    </div>\n    <neon-inline v-if=\"ctas.length > 0\" class=\"neon-empty-state__ctas\" gap=\"m\">\n      <neon-button\n        v-for=\"(cta, index) in ctas\"\n        :key=\"cta.label || cta.icon\"\n        :button-style=\"cta.style || (index === ctas.length - 1 ? NeonButtonStyle.Solid : NeonButtonStyle.Outline)\"\n        :color=\"\n          cta.color || (index === ctas.length - 1 ? NeonFunctionalColor.Primary : NeonFunctionalColor.HighContrast)\n        \"\n        :disabled=\"!!cta.disabled\"\n        :href=\"cta.href\"\n        :icon=\"cta.icon\"\n        :label=\"cta.label\"\n        class=\"neon-empty-state__cta\"\n        @click=\"!cta.href && emit('cta-click', index)\"\n      />\n    </neon-inline>\n  </neon-stack>\n</template>\n\n<script lang=\"ts\" src=\"./NeonEmptyState.ts\" />\n"],"names":["_hoisted_1","_hoisted_3","_createBlock","_component_neon_stack","_normalizeClass","_ctx","_component_neon_icon","_createElementVNode","_toDisplayString","_createElementBlock","_hoisted_2","_renderSlot","_component_neon_inline","_openBlock","_Fragment","_renderList","cta","index","_component_neon_button"],"mappings":";;;AAGQ,MAAAA,IAAA,EAAA,OAAM,0BAAyB;;EACf,OAAM;GACrBC,IAAA,EAAA,OAAM,gCAA+B;;;cAJ5CC,EAwBaC,GAAA;AAAA,IAxBA,OAAKC,EAAA,CAAA,qBAAuBC,EAAA,IAAI,IAAU,kBAAkB,CAAA;AAAA,IAAC,KAAI;AAAA;eAC5E,MAAmG;AAAA,MAAlFA,EAAA,cAAjBH,EAAmGI,GAAA;AAAA;QAA1E,OAAOD,EAAA;AAAA,QAAa,MAAMA,EAAA;AAAA,QAAO,OAAM;AAAA;MAChEE,EAAoD,MAApDP,GAAoDQ,EAAbH,EAAA,KAAK,GAAA,CAAA;AAAA,MAClCA,EAAA,iBAAVI,EAAkF,MAAlFC,GAAkFF,EAAhBH,EAAA,QAAQ,GAAA,CAAA;MAC1EE,EAGM,OAHNN,GAGM;AAAA,QADJU,EAAgCN,EAAA,QAAA,aAAA;AAAA;MAEfA,EAAA,KAAK,SAAM,UAA9BH,EAecU,GAAA;AAAA;QAfsB,OAAM;AAAA,QAAyB,KAAI;AAAA;mBAEnE,MAA4B;AAAA,WAD9BC,EAAA,EAAA,GAAAJ,EAaEK,GAAA,MAAAC,EAZuBV,EAAA,MAAI,CAAnBW,GAAKC,YADff,EAaEgB,GAAA;AAAA,YAXC,KAAKF,EAAI,SAASA,EAAI;AAAA,YACtB,gBAAcA,EAAI,UAAUC,MAAUZ,EAAA,KAAK,aAAaA,EAAA,gBAAgB,QAAQA,EAAA,gBAAgB;AAAA,YAChG,OAAkBW,EAAI,UAAUC,MAAUZ,EAAA,KAAK,SAAM,IAAOA,sBAAoB,UAAUA,EAAA,oBAAoB;AAAA,YAG9G,UAAQ,CAAA,CAAIW,EAAI;AAAA,YAChB,MAAMA,EAAI;AAAA,YACV,MAAMA,EAAI;AAAA,YACV,OAAOA,EAAI;AAAA,YACZ,OAAM;AAAA,YACL,iBAAQA,EAAI,QAAQX,EAAA,kBAAkBY,CAAK;AAAA;;;;;;;;;"}

package/dist/components/presentation/image-carousel/NeonImageCarousel.vue.cjs.js

@@ -1,2 +1,2 @@
-"use strict";const u=require("./NeonImageCarousel.cjs.js"),e=require("vue"),c=require("../../../_virtual/_plugin-vue_export-helper.cjs.js"),d={class:"neon-image-carousel-wrapper"},m={class:"neon-image-carousel__container",tabindex:"-1"},p={ref:"carouselItems",class:"no-style neon-image-carousel__items"},g=["alt","src"],k={key:0,class:"neon-image-carousel__item-title"},v={class:"neon-image-carousel__nav",tabindex:"-1"},C=["onClickCapture"],_={key:0,class:"neon-image-carousel__label",tabindex:"-1"};function b(n,o,w,E,f,h){const l=e.resolveComponent("neon-button"),i=e.resolveComponent("neon-link"),r=e.resolveComponent("neon-stack");return e.openBlock(),e.createElementBlock("div",d,[e.createElementVNode("div",{class:e.normalizeClass([{"neon-image-carousel--initialised":n.initialised,"neon-image-carousel--expanded":n.isExpanded},"neon-image-carousel"]),tabindex:"0",onKeydown:[o[2]||(o[2]=e.withKeys(e.withModifiers((...t)=>n.previous&&n.previous(...t),["stop","prevent"]),["left"])),o[3]||(o[3]=e.withKeys(e.withModifiers((...t)=>n.next&&n.next(...t),["stop","prevent"]),["right"])),o[4]||(o[4]=e.withKeys(t=>n.isExpanded&&n.toggleExpanded(),["esc"]))]},[e.createElementVNode("div",m,[n.isExpanded?(e.openBlock(),e.createBlock(l,{key:0,title:n.closeLabel,"button-style":"text",class:"neon-image-carousel__close",color:"low-contrast",icon:"close",size:"l",transparent:"",onClick:o[0]||(o[0]=t=>n.isExpanded&&n.toggleExpanded())},null,8,["title"])):e.createCommentVNode("",!0),e.createVNode(l,{disabled:n.currentImage===0,title:n.previousLabel,transparent:!0,"button-style":"text",class:"neon-image-carousel__previous",color:"neutral",icon:"arrow-left-1",size:"l",onClickCapture:e.withModifiers(n.previous,["stop"])},null,8,["disabled","title","onClickCapture"]),e.createElementVNode("ul",p,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.images,(t,s)=>(e.openBlock(),e.createElementBlock("li",{key:t.src,ref_for:!0,ref:"carouselItem",class:e.normalizeClass([{"neon-image-carousel__item--active":s===n.currentImage},"neon-image-carousel__item"])},[e.createElementVNode("img",{alt:t.alt,src:t.src,class:"neon-image-carousel__image",onClick:o[1]||(o[1]=e.withModifiers(a=>!n.isExpanded&&n.toggleExpanded(),["stop"]))},null,8,g),n.isExpanded&&t.title?(e.openBlock(),e.createElementBlock("p",k,e.toDisplayString(t.title),1)):e.createCommentVNode("",!0)],2))),128))],512),e.createVNode(l,{disabled:n.currentImage===n.images.length-1,title:n.nextLabel,transparent:!0,"button-style":"text",class:"neon-image-carousel__next",color:"neutral",icon:"arrow-right-1",size:"l",onClickCapture:e.withModifiers(n.next,["stop"])},null,8,["disabled","title","onClickCapture"])]),e.createVNode(r,{class:"neon-image-carousel__nav-container",gap:"s"},{default:e.withCtx(()=>[e.createElementVNode("div",v,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.images,(t,s)=>(e.openBlock(),e.createBlock(i,{key:s,"aria-label":`Display image ${s+1}`,class:"neon-image-carousel__nav-item-link","no-style":"","outline-style":"none",role:"button",tabindex:"0",onKeydownCapture:[e.withKeys(e.withModifiers(a=>n.scrollTo(s),["stop","prevent"]),["enter"]),e.withKeys(e.withModifiers(a=>n.scrollTo(s),["stop","prevent"]),["space"])]},{default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass([{"neon-image-carousel__nav-item--active":s===n.currentImage},"neon-image-carousel__nav-item"]),tabindex:"-1",onClickCapture:e.withModifiers(a=>n.scrollTo(s),["stop"])},[...o[5]||(o[5]=[e.createElementVNode("div",{class:"neon-image-carousel__nav-item-indicator"},null,-1)])],42,C)]),_:2},1032,["aria-label","onKeydownCapture"]))),128))]),n.hideLabel?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("span",_,e.toDisplayString(n.imageCountLabel||`${n.images.length} ${n.images.length===1?"image":"images"}`),1))]),_:1})],34)])}const y=c(u,[["render",b]]);module.exports=y;
+"use strict";const c=require("./NeonImageCarousel.cjs.js"),e=require("vue"),u=require("../../../_virtual/_plugin-vue_export-helper.cjs.js"),d={class:"neon-image-carousel-wrapper"},m={class:"neon-image-carousel__container",tabindex:"-1"},p={ref:"carouselItems",class:"no-style neon-image-carousel__items"},g=["alt","src"],v={key:0,class:"neon-image-carousel__item-title"},k={class:"neon-image-carousel__nav",tabindex:"-1"},C=["onClickCapture"],_={key:0,class:"neon-image-carousel__label",tabindex:"-1"};function b(n,o,E,h,w,f){const l=e.resolveComponent("neon-button"),i=e.resolveComponent("neon-link"),r=e.resolveComponent("neon-stack");return e.openBlock(),e.createElementBlock("div",d,[e.createElementVNode("div",{class:e.normalizeClass([{"neon-image-carousel--initialised":n.initialised,"neon-image-carousel--expanded":n.isExpanded},"neon-image-carousel"]),tabindex:"0",onKeydown:[o[2]||(o[2]=e.withKeys(e.withModifiers((...t)=>n.previous&&n.previous(...t),["stop","prevent"]),["left"])),o[3]||(o[3]=e.withKeys(e.withModifiers((...t)=>n.next&&n.next(...t),["stop","prevent"]),["right"])),o[4]||(o[4]=e.withKeys(t=>n.isExpanded&&n.toggleExpanded(),["esc"]))]},[e.createElementVNode("div",m,[n.isExpanded?(e.openBlock(),e.createBlock(l,{key:0,title:n.closeLabel,"button-style":"text",class:"neon-image-carousel__close",color:"low-contrast",icon:"close",size:"l",transparent:"",onClick:o[0]||(o[0]=t=>n.isExpanded&&n.toggleExpanded())},null,8,["title"])):e.createCommentVNode("",!0),e.createVNode(l,{disabled:n.currentImage===0,title:n.previousLabel,transparent:!0,"button-style":"text",class:"neon-image-carousel__previous",color:"neutral",icon:"chevron-left",size:"l",onClickCapture:e.withModifiers(n.previous,["stop"])},null,8,["disabled","title","onClickCapture"]),e.createElementVNode("ul",p,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.images,(t,s)=>(e.openBlock(),e.createElementBlock("li",{key:t.src,ref_for:!0,ref:"carouselItem",class:e.normalizeClass([{"neon-image-carousel__item--active":s===n.currentImage},"neon-image-carousel__item"])},[e.createElementVNode("img",{alt:t.alt,src:t.src,class:"neon-image-carousel__image",onClick:o[1]||(o[1]=e.withModifiers(a=>!n.isExpanded&&n.toggleExpanded(),["stop"]))},null,8,g),n.isExpanded&&t.title?(e.openBlock(),e.createElementBlock("p",v,e.toDisplayString(t.title),1)):e.createCommentVNode("",!0)],2))),128))],512),e.createVNode(l,{disabled:n.currentImage===n.images.length-1,title:n.nextLabel,transparent:!0,"button-style":"text",class:"neon-image-carousel__next",color:"neutral",icon:"chevron-right",size:"l",onClickCapture:e.withModifiers(n.next,["stop"])},null,8,["disabled","title","onClickCapture"])]),e.createVNode(r,{class:"neon-image-carousel__nav-container",gap:"s"},{default:e.withCtx(()=>[e.createElementVNode("div",k,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.images,(t,s)=>(e.openBlock(),e.createBlock(i,{key:s,"aria-label":`Display image ${s+1}`,class:"neon-image-carousel__nav-item-link","no-style":"","outline-style":"none",role:"button",tabindex:"0",onKeydownCapture:[e.withKeys(e.withModifiers(a=>n.scrollTo(s),["stop","prevent"]),["enter"]),e.withKeys(e.withModifiers(a=>n.scrollTo(s),["stop","prevent"]),["space"])]},{default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass([{"neon-image-carousel__nav-item--active":s===n.currentImage},"neon-image-carousel__nav-item"]),tabindex:"-1",onClickCapture:e.withModifiers(a=>n.scrollTo(s),["stop"])},[...o[5]||(o[5]=[e.createElementVNode("div",{class:"neon-image-carousel__nav-item-indicator"},null,-1)])],42,C)]),_:2},1032,["aria-label","onKeydownCapture"]))),128))]),n.hideLabel?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("span",_,e.toDisplayString(n.imageCountLabel||`${n.images.length} ${n.images.length===1?"image":"images"}`),1))]),_:1})],34)])}const y=u(c,[["render",b]]);module.exports=y;
 //# sourceMappingURL=NeonImageCarousel.vue.cjs.js.map