@aotearoan/neon 26.1.0 → 27.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (53) hide show
  1. package/dist/components/layout/card-list/NeonCardList.cjs.js +1 -1
  2. package/dist/components/layout/card-list/NeonCardList.cjs.js.map +1 -1
  3. package/dist/components/layout/card-list/NeonCardList.es.js +54 -40
  4. package/dist/components/layout/card-list/NeonCardList.es.js.map +1 -1
  5. package/dist/components/layout/card-list/NeonCardList.vue.cjs.js +1 -1
  6. package/dist/components/layout/card-list/NeonCardList.vue.cjs.js.map +1 -1
  7. package/dist/components/layout/card-list/NeonCardList.vue.es.js +68 -45
  8. package/dist/components/layout/card-list/NeonCardList.vue.es.js.map +1 -1
  9. package/dist/components/layout/card-list/selectable-card/NeonSelectableCard.cjs.js +2 -0
  10. package/dist/components/layout/card-list/selectable-card/NeonSelectableCard.cjs.js.map +1 -0
  11. package/dist/components/{user-input → layout/card-list}/selectable-card/NeonSelectableCard.es.js +12 -17
  12. package/dist/components/layout/card-list/selectable-card/NeonSelectableCard.es.js.map +1 -0
  13. package/dist/components/layout/card-list/selectable-card/NeonSelectableCard.vue.cjs.js +2 -0
  14. package/dist/components/layout/card-list/selectable-card/NeonSelectableCard.vue.cjs.js.map +1 -0
  15. package/dist/components/{user-input → layout/card-list}/selectable-card/NeonSelectableCard.vue.es.js +12 -13
  16. package/dist/components/layout/card-list/selectable-card/NeonSelectableCard.vue.es.js.map +1 -0
  17. package/dist/components/presentation/expansion-panel/NeonExpansionPanel.cjs.js +1 -1
  18. package/dist/components/presentation/expansion-panel/NeonExpansionPanel.cjs.js.map +1 -1
  19. package/dist/components/presentation/expansion-panel/NeonExpansionPanel.es.js +5 -4
  20. package/dist/components/presentation/expansion-panel/NeonExpansionPanel.es.js.map +1 -1
  21. package/dist/components/presentation/expansion-panel/NeonExpansionPanel.vue.cjs.js +1 -1
  22. package/dist/components/presentation/expansion-panel/NeonExpansionPanel.vue.cjs.js.map +1 -1
  23. package/dist/components/presentation/expansion-panel/NeonExpansionPanel.vue.es.js +7 -6
  24. package/dist/components/presentation/expansion-panel/NeonExpansionPanel.vue.es.js.map +1 -1
  25. package/dist/neon.cjs.js +1 -1
  26. package/dist/neon.es.js +1 -1
  27. package/dist/src/components/layout/card-list/NeonCardList.d.ts +280 -47
  28. package/dist/src/components/{user-input → layout/card-list}/selectable-card/NeonSelectableCard.d.ts +33 -66
  29. package/dist/src/components/presentation/expansion-panel/NeonExpansionPanel.d.ts +3 -0
  30. package/dist/src/model/common/entity/NeonSelectable.d.ts +9 -0
  31. package/dist/src/model/layout/card-list/NeonCardListModel.d.ts +2 -1
  32. package/dist/src/neon.d.ts +2 -1
  33. package/dist/utils/common/date/NeonDateUtils.cjs.js +1 -1
  34. package/dist/utils/common/date/NeonDateUtils.cjs.js.map +1 -1
  35. package/dist/utils/common/date/NeonDateUtils.es.js +55 -52
  36. package/dist/utils/common/date/NeonDateUtils.es.js.map +1 -1
  37. package/package.json +1 -1
  38. package/src/sass/components/_card-list.scss +15 -3
  39. package/src/sass/components/_expansion-panel.scss +13 -3
  40. package/src/sass/components/_modal.scss +6 -3
  41. package/src/sass/components/_selectable-card.scss +7 -21
  42. package/src/sass/components/_swiper.scss +1 -1
  43. package/src/sass/includes/_dependencies.scss +1 -1
  44. package/src/sass/variables-dark.scss +0 -13
  45. package/src/sass/variables-global.scss +0 -7
  46. package/src/sass/variables-light.scss +0 -13
  47. package/dist/components/user-input/selectable-card/NeonSelectableCard.cjs.js +0 -2
  48. package/dist/components/user-input/selectable-card/NeonSelectableCard.cjs.js.map +0 -1
  49. package/dist/components/user-input/selectable-card/NeonSelectableCard.es.js.map +0 -1
  50. package/dist/components/user-input/selectable-card/NeonSelectableCard.vue.cjs.js +0 -2
  51. package/dist/components/user-input/selectable-card/NeonSelectableCard.vue.cjs.js.map +0 -1
  52. package/dist/components/user-input/selectable-card/NeonSelectableCard.vue.es.js.map +0 -1
  53. /package/dist/src/components/{user-input → layout/card-list}/selectable-card/NeonSelectableCard.vue.d.ts +0 -0
@@ -1,2 +1,2 @@
1
- "use strict";const o=require("vue"),c=require("../../user-input/button/NeonButton.vue.cjs.js"),s=require("../inline/NeonInline.vue.cjs.js"),d=require("../../navigation/link/NeonLink.vue.cjs.js"),m=require("../../navigation/pagination/NeonPagination.vue.cjs.js"),N=require("../stack/NeonStack.vue.cjs.js"),f=require("../../../model/user-input/button/NeonButtonStyle.cjs.js"),b=require("../../../model/common/size/NeonSize.cjs.js"),q=require("../../../model/common/color/NeonFunctionalColor.cjs.js"),O=require("../../../utils/common/number/NeonNumberUtils.cjs.js"),S=o.defineComponent({name:"NeonCardList",components:{NeonPagination:m,NeonButton:c,NeonInline:s,NeonLink:d,NeonStack:N},props:{items:{type:Array,required:!0},color:{type:String,default:null},loadOnDemand:{type:Object},pagination:{type:Object}},emits:["show-more"],setup(n,{emit:r}){const i=o.computed(()=>{var e;if(!n.pagination)return((e=n.loadOnDemand)==null?void 0:e.ofLabel)??"of"}),a=o.computed(()=>{var e;if(!n.pagination)return((e=n.loadOnDemand)==null?void 0:e.showMoreLabel)??"Show more"}),u=o.computed(()=>{var e;if(!n.pagination)return((e=n.loadOnDemand)==null?void 0:e.endOfResultsLabel)??"End of results"}),l=o.computed(()=>{var e,t;return((e=n.loadOnDemand)==null?void 0:e.total)??((t=n.pagination)==null?void 0:t.total)??0});return{emit:r,n:O.NeonNumberUtils.formatNumber,NeonButtonStyle:f.NeonButtonStyle,NeonFunctionalColor:q.NeonFunctionalColor,NeonSize:b.NeonSize,ofLabel:i,showMoreLabel:a,endOfResultsLabel:u,total:l}}});module.exports=S;
1
+ "use strict";const o=require("vue"),s=require("../../user-input/button/NeonButton.vue.cjs.js"),d=require("../inline/NeonInline.vue.cjs.js"),m=require("../../navigation/link/NeonLink.vue.cjs.js"),N=require("../../navigation/pagination/NeonPagination.vue.cjs.js"),f=require("../stack/NeonStack.vue.cjs.js"),b=require("../../../model/user-input/button/NeonButtonStyle.cjs.js"),q=require("../../../model/common/size/NeonSize.cjs.js"),S=require("../../../model/common/color/NeonFunctionalColor.cjs.js"),O=require("../../../utils/common/number/NeonNumberUtils.cjs.js"),g=require("./selectable-card/NeonSelectableCard.vue.cjs.js"),y=o.defineComponent({name:"NeonCardList",components:{NeonSelectableCard:g,NeonPagination:N,NeonButton:s,NeonInline:d,NeonLink:m,NeonStack:f},props:{items:{type:Array,required:!0},color:{type:String,default:null},selectable:{type:Boolean,default:!1},loadOnDemand:{type:Object},pagination:{type:Object}},emits:["show-more","toggleSelected"],setup(e,{emit:r,slots:a}){const i=o.computed(()=>{if(!e.pagination&&e.loadOnDemand)return e.loadOnDemand.ofLabel??"of"}),l=o.computed(()=>{var n;if(!e.pagination)return((n=e.loadOnDemand)==null?void 0:n.showMoreLabel)??"Show more"}),u=o.computed(()=>{var n;if(!e.pagination)return((n=e.loadOnDemand)==null?void 0:n.endOfResultsLabel)??"End of results"}),c=o.computed(()=>{var n,t;return((n=e.loadOnDemand)==null?void 0:n.total)??((t=e.pagination)==null?void 0:t.total)??0});return{emit:r,n:O.NeonNumberUtils.formatNumber,NeonButtonStyle:b.NeonButtonStyle,NeonFunctionalColor:S.NeonFunctionalColor,NeonSize:q.NeonSize,ofLabel:i,showMoreLabel:l,endOfResultsLabel:u,total:c,slots:a}}});module.exports=y;
2
2
  //# sourceMappingURL=NeonCardList.cjs.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"NeonCardList.cjs.js","sources":["../../../../src/components/layout/card-list/NeonCardList.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { computed, defineComponent } from 'vue';\nimport NeonButton from '@/components/user-input/button/NeonButton.vue';\nimport NeonInline from '@/components/layout/inline/NeonInline.vue';\nimport NeonLink from '@/components/navigation/link/NeonLink.vue';\nimport NeonPagination from '@/components/navigation/pagination/NeonPagination.vue';\nimport NeonStack from '@/components/layout/stack/NeonStack.vue';\nimport { NeonButtonStyle } from '@/model/user-input/button/NeonButtonStyle';\nimport { NeonSize } from '@/model/common/size/NeonSize';\nimport { NeonFunctionalColor } from '@/model/common/color/NeonFunctionalColor';\nimport type { NeonCardListModel } from '@/model/layout/card-list/NeonCardListModel';\nimport { NeonNumberUtils } from '@/utils/common/number/NeonNumberUtils';\nimport type { NeonLoadOnDemandModel } from '@/model/layout/card-list/NeonLoadOnDemandModel';\nimport type { NeonPaginationModel } from '@/model/navigation/pagination/NeonPaginationModel';\nimport type { NeonIdentifiable } from '@/model/common/entity/NeonIdentifiable';\n\n/**\n * Represent lists of objects as cards. This is intended to be a more responsive replacement for tables. This component\n * will display a list of items as cards with a count (x of y) and a <em>Show more</em> button to load more results.\n * There is also a slot for adding filtering or other content above the list. A slot is provided with card model & index\n * parameters for customising how to display the model for each card.\n */\nexport default defineComponent({\n name: 'NeonCardList',\n components: {\n NeonPagination,\n NeonButton,\n NeonInline,\n NeonLink,\n NeonStack,\n },\n props: {\n /**\n * Items to display as cards. Each item should be a NeonCardListModel.\n */\n items: { type: Array as () => Array<NeonCardListModel<NeonIdentifiable>>, required: true },\n /**\n * Specify a hover color for the cards.\n */\n color: { type: String as () => NeonFunctionalColor, default: null },\n /**\n * Model for configuring the on demand loading layout.\n */\n loadOnDemand: { type: Object as () => NeonLoadOnDemandModel },\n /**\n * Model for configuring pagination, either pagination or loadOnDemand should be provided.\n */\n pagination: { type: Object as () => NeonPaginationModel },\n },\n emits: [\n /**\n * Emitted when the 'Show more' button is clicked in \"on demand\" mode.\n * @type {void}\n */\n 'show-more',\n ],\n setup(props, { emit }) {\n const ofLabel = computed(() => {\n if (!props.pagination) {\n return props.loadOnDemand?.ofLabel ?? 'of';\n }\n\n return undefined;\n });\n\n const showMoreLabel = computed(() => {\n if (!props.pagination) {\n return props.loadOnDemand?.showMoreLabel ?? 'Show more';\n }\n\n return undefined;\n });\n\n const endOfResultsLabel = computed(() => {\n if (!props.pagination) {\n return props.loadOnDemand?.endOfResultsLabel ?? 'End of results';\n }\n\n return undefined;\n });\n\n const total = computed(() => props.loadOnDemand?.total ?? props.pagination?.total ?? 0);\n\n return {\n emit,\n n: NeonNumberUtils.formatNumber,\n NeonButtonStyle,\n NeonFunctionalColor,\n NeonSize,\n ofLabel,\n showMoreLabel,\n endOfResultsLabel,\n total,\n };\n },\n});\n"],"names":["_sfc_main","defineComponent","NeonPagination","NeonButton","NeonInline","NeonLink","NeonStack","props","emit","ofLabel","computed","_a","showMoreLabel","endOfResultsLabel","total","_b","NeonNumberUtils","NeonButtonStyle","NeonFunctionalColor","NeonSize"],"mappings":"mjBAqBAA,EAAeC,kBAAgB,CAC7B,KAAM,eACN,WAAY,CACV,eAAAC,EACA,WAAAC,EACA,WAAAC,EACA,SAAAC,EACA,UAAAC,CAAA,EAEF,MAAO,CAIL,MAAO,CAAE,KAAM,MAA2D,SAAU,EAAA,EAIpF,MAAO,CAAE,KAAM,OAAqC,QAAS,IAAA,EAI7D,aAAc,CAAE,KAAM,MAAA,EAItB,WAAY,CAAE,KAAM,MAAA,CAAoC,EAE1D,MAAO,CAKL,WAAA,EAEF,MAAMC,EAAO,CAAE,KAAAC,GAAQ,CACrB,MAAMC,EAAUC,EAAAA,SAAS,IAAM,OAC7B,GAAI,CAACH,EAAM,WACT,QAAOI,EAAAJ,EAAM,eAAN,YAAAI,EAAoB,UAAW,IAI1C,CAAC,EAEKC,EAAgBF,EAAAA,SAAS,IAAM,OACnC,GAAI,CAACH,EAAM,WACT,QAAOI,EAAAJ,EAAM,eAAN,YAAAI,EAAoB,gBAAiB,WAIhD,CAAC,EAEKE,EAAoBH,EAAAA,SAAS,IAAM,OACvC,GAAI,CAACH,EAAM,WACT,QAAOI,EAAAJ,EAAM,eAAN,YAAAI,EAAoB,oBAAqB,gBAIpD,CAAC,EAEKG,EAAQJ,WAAS,IAAA,SAAM,QAAAC,EAAAJ,EAAM,eAAN,YAAAI,EAAoB,UAASI,EAAAR,EAAM,aAAN,YAAAQ,EAAkB,QAAS,EAAC,EAEtF,MAAO,CACL,KAAAP,EACA,EAAGQ,EAAAA,gBAAgB,aAAA,gBACnBC,EAAAA,gBAAA,oBACAC,EAAAA,oBAAA,SACAC,EAAAA,SACA,QAAAV,EACA,cAAAG,EACA,kBAAAC,EACA,MAAAC,CAAA,CAEJ,CACF,CAAC"}
1
+ {"version":3,"file":"NeonCardList.cjs.js","sources":["../../../../src/components/layout/card-list/NeonCardList.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { computed, defineComponent } from 'vue';\nimport NeonButton from '@/components/user-input/button/NeonButton.vue';\nimport NeonInline from '@/components/layout/inline/NeonInline.vue';\nimport NeonLink from '@/components/navigation/link/NeonLink.vue';\nimport NeonPagination from '@/components/navigation/pagination/NeonPagination.vue';\nimport NeonStack from '@/components/layout/stack/NeonStack.vue';\nimport { NeonButtonStyle } from '@/model/user-input/button/NeonButtonStyle';\nimport { NeonSize } from '@/model/common/size/NeonSize';\nimport { NeonFunctionalColor } from '@/model/common/color/NeonFunctionalColor';\nimport type { NeonCardListModel } from '@/model/layout/card-list/NeonCardListModel';\nimport { NeonNumberUtils } from '@/utils/common/number/NeonNumberUtils';\nimport type { NeonLoadOnDemandModel } from '@/model/layout/card-list/NeonLoadOnDemandModel';\nimport type { NeonPaginationModel } from '@/model/navigation/pagination/NeonPaginationModel';\nimport type { NeonIdentifiable } from '@/model/common/entity/NeonIdentifiable';\nimport type { NeonSelectable } from '@/model/common/entity/NeonSelectable';\nimport NeonSelectableCard from './selectable-card/NeonSelectableCard.vue';\n\n/**\n * TODO: consider refactoring since it's no longer just a layout component when selectable.\n * Represent lists of objects as cards. This is intended to be a more responsive replacement for tables. This component\n * will display a list of items as cards with a count (x of y) and a <em>Show more</em> button to load more results.\n * There is also a slot for adding filtering or other content above the list. A slot is provided with card model & index\n * parameters for customising how to display the model for each card.\n */\nexport default defineComponent({\n name: 'NeonCardList',\n components: {\n NeonSelectableCard,\n NeonPagination,\n NeonButton,\n NeonInline,\n NeonLink,\n NeonStack,\n },\n props: {\n /**\n * Items to display as cards. Each item should be a NeonCardListModel.\n */\n items: {\n type: Array as () => Array<NeonCardListModel<NeonIdentifiable | (NeonIdentifiable & NeonSelectable)>>,\n required: true,\n },\n /**\n * Specify a selection/hover color for the cards.\n */\n color: { type: String as () => NeonFunctionalColor, default: null },\n /**\n * Make cards selectable.\n */\n selectable: { type: Boolean, default: false },\n /**\n * Model for configuring the on-demand loading layout.\n */\n loadOnDemand: { type: Object as () => NeonLoadOnDemandModel },\n /**\n * Model for configuring pagination, either pagination or loadOnDemand should be provided.\n */\n pagination: { type: Object as () => NeonPaginationModel },\n },\n emits: [\n /**\n * Emitted when the 'Show more' button is clicked in \"on demand\" mode.\n * @type {void}\n */\n 'show-more',\n /**\n * Emitted when in selectable mode and the selected state of a card is toggled.\n * @type {string, boolean} - the id of the card which is toggled & the new selected state.\n */\n 'toggleSelected',\n ],\n setup(props, { emit, slots }) {\n const ofLabel = computed(() => {\n if (!props.pagination && props.loadOnDemand) {\n return props.loadOnDemand.ofLabel ?? 'of';\n }\n\n return undefined;\n });\n\n const showMoreLabel = computed(() => {\n if (!props.pagination) {\n return props.loadOnDemand?.showMoreLabel ?? 'Show more';\n }\n\n return undefined;\n });\n\n const endOfResultsLabel = computed(() => {\n if (!props.pagination) {\n return props.loadOnDemand?.endOfResultsLabel ?? 'End of results';\n }\n\n return undefined;\n });\n\n const total = computed(() => props.loadOnDemand?.total ?? props.pagination?.total ?? 0);\n\n return {\n emit,\n n: NeonNumberUtils.formatNumber,\n NeonButtonStyle,\n NeonFunctionalColor,\n NeonSize,\n ofLabel,\n showMoreLabel,\n endOfResultsLabel,\n total,\n slots,\n };\n },\n});\n"],"names":["_sfc_main","defineComponent","NeonSelectableCard","NeonPagination","NeonButton","NeonInline","NeonLink","NeonStack","props","emit","slots","ofLabel","computed","showMoreLabel","_a","endOfResultsLabel","total","_b","NeonNumberUtils","NeonButtonStyle","NeonFunctionalColor","NeonSize"],"mappings":"gnBAwBAA,EAAeC,kBAAgB,CAC7B,KAAM,eACN,WAAY,CACV,mBAAAC,EACA,eAAAC,EACA,WAAAC,EACA,WAAAC,EACA,SAAAC,EACA,UAAAC,CAAA,EAEF,MAAO,CAIL,MAAO,CACL,KAAM,MACN,SAAU,EAAA,EAKZ,MAAO,CAAE,KAAM,OAAqC,QAAS,IAAA,EAI7D,WAAY,CAAE,KAAM,QAAS,QAAS,EAAA,EAItC,aAAc,CAAE,KAAM,MAAA,EAItB,WAAY,CAAE,KAAM,MAAA,CAAoC,EAE1D,MAAO,CAKL,YAKA,gBAAA,EAEF,MAAMC,EAAO,CAAE,KAAAC,EAAM,MAAAC,GAAS,CAC5B,MAAMC,EAAUC,EAAAA,SAAS,IAAM,CAC7B,GAAI,CAACJ,EAAM,YAAcA,EAAM,aAC7B,OAAOA,EAAM,aAAa,SAAW,IAIzC,CAAC,EAEKK,EAAgBD,EAAAA,SAAS,IAAM,OACnC,GAAI,CAACJ,EAAM,WACT,QAAOM,EAAAN,EAAM,eAAN,YAAAM,EAAoB,gBAAiB,WAIhD,CAAC,EAEKC,EAAoBH,EAAAA,SAAS,IAAM,OACvC,GAAI,CAACJ,EAAM,WACT,QAAOM,EAAAN,EAAM,eAAN,YAAAM,EAAoB,oBAAqB,gBAIpD,CAAC,EAEKE,EAAQJ,WAAS,IAAA,SAAM,QAAAE,EAAAN,EAAM,eAAN,YAAAM,EAAoB,UAASG,EAAAT,EAAM,aAAN,YAAAS,EAAkB,QAAS,EAAC,EAEtF,MAAO,CACL,KAAAR,EACA,EAAGS,EAAAA,gBAAgB,aAAA,gBACnBC,EAAAA,gBAAA,oBACAC,EAAAA,oBAAA,SACAC,EAAAA,SACA,QAAAV,EACA,cAAAE,EACA,kBAAAE,EACA,MAAAC,EACA,MAAAN,CAAA,CAEJ,CACF,CAAC"}
@@ -1,33 +1,42 @@
1
1
  import { defineComponent as f, computed as t } from "vue";
2
- import d from "../../user-input/button/NeonButton.vue.es.js";
3
- import u from "../inline/NeonInline.vue.es.js";
4
- import s from "../../navigation/link/NeonLink.vue.es.js";
5
- import c from "../../navigation/pagination/NeonPagination.vue.es.js";
6
- import p from "../stack/NeonStack.vue.es.js";
7
- import { NeonButtonStyle as N } from "../../../model/user-input/button/NeonButtonStyle.es.js";
8
- import { NeonSize as b } from "../../../model/common/size/NeonSize.es.js";
9
- import { NeonFunctionalColor as O } from "../../../model/common/color/NeonFunctionalColor.es.js";
2
+ import u from "../../user-input/button/NeonButton.vue.es.js";
3
+ import s from "../inline/NeonInline.vue.es.js";
4
+ import c from "../../navigation/link/NeonLink.vue.es.js";
5
+ import N from "../../navigation/pagination/NeonPagination.vue.es.js";
6
+ import b from "../stack/NeonStack.vue.es.js";
7
+ import { NeonButtonStyle as p } from "../../../model/user-input/button/NeonButtonStyle.es.js";
8
+ import { NeonSize as O } from "../../../model/common/size/NeonSize.es.js";
9
+ import { NeonFunctionalColor as g } from "../../../model/common/color/NeonFunctionalColor.es.js";
10
10
  import { NeonNumberUtils as L } from "../../../utils/common/number/NeonNumberUtils.es.js";
11
- const B = f({
11
+ import y from "./selectable-card/NeonSelectableCard.vue.es.js";
12
+ const _ = f({
12
13
  name: "NeonCardList",
13
14
  components: {
14
- NeonPagination: c,
15
- NeonButton: d,
16
- NeonInline: u,
17
- NeonLink: s,
18
- NeonStack: p
15
+ NeonSelectableCard: y,
16
+ NeonPagination: N,
17
+ NeonButton: u,
18
+ NeonInline: s,
19
+ NeonLink: c,
20
+ NeonStack: b
19
21
  },
20
22
  props: {
21
23
  /**
22
24
  * Items to display as cards. Each item should be a NeonCardListModel.
23
25
  */
24
- items: { type: Array, required: !0 },
26
+ items: {
27
+ type: Array,
28
+ required: !0
29
+ },
25
30
  /**
26
- * Specify a hover color for the cards.
31
+ * Specify a selection/hover color for the cards.
27
32
  */
28
33
  color: { type: String, default: null },
29
34
  /**
30
- * Model for configuring the on demand loading layout.
35
+ * Make cards selectable.
36
+ */
37
+ selectable: { type: Boolean, default: !1 },
38
+ /**
39
+ * Model for configuring the on-demand loading layout.
31
40
  */
32
41
  loadOnDemand: { type: Object },
33
42
  /**
@@ -40,39 +49,44 @@ const B = f({
40
49
  * Emitted when the 'Show more' button is clicked in "on demand" mode.
41
50
  * @type {void}
42
51
  */
43
- "show-more"
52
+ "show-more",
53
+ /**
54
+ * Emitted when in selectable mode and the selected state of a card is toggled.
55
+ * @type {string, boolean} - the id of the card which is toggled & the new selected state.
56
+ */
57
+ "toggleSelected"
44
58
  ],
45
- setup(n, { emit: r }) {
46
- const a = t(() => {
47
- var o;
48
- if (!n.pagination)
49
- return ((o = n.loadOnDemand) == null ? void 0 : o.ofLabel) ?? "of";
50
- }), i = t(() => {
51
- var o;
52
- if (!n.pagination)
53
- return ((o = n.loadOnDemand) == null ? void 0 : o.showMoreLabel) ?? "Show more";
59
+ setup(e, { emit: a, slots: r }) {
60
+ const i = t(() => {
61
+ if (!e.pagination && e.loadOnDemand)
62
+ return e.loadOnDemand.ofLabel ?? "of";
54
63
  }), m = t(() => {
55
64
  var o;
56
- if (!n.pagination)
57
- return ((o = n.loadOnDemand) == null ? void 0 : o.endOfResultsLabel) ?? "End of results";
65
+ if (!e.pagination)
66
+ return ((o = e.loadOnDemand) == null ? void 0 : o.showMoreLabel) ?? "Show more";
58
67
  }), l = t(() => {
59
- var o, e;
60
- return ((o = n.loadOnDemand) == null ? void 0 : o.total) ?? ((e = n.pagination) == null ? void 0 : e.total) ?? 0;
68
+ var o;
69
+ if (!e.pagination)
70
+ return ((o = e.loadOnDemand) == null ? void 0 : o.endOfResultsLabel) ?? "End of results";
71
+ }), d = t(() => {
72
+ var o, n;
73
+ return ((o = e.loadOnDemand) == null ? void 0 : o.total) ?? ((n = e.pagination) == null ? void 0 : n.total) ?? 0;
61
74
  });
62
75
  return {
63
- emit: r,
76
+ emit: a,
64
77
  n: L.formatNumber,
65
- NeonButtonStyle: N,
66
- NeonFunctionalColor: O,
67
- NeonSize: b,
68
- ofLabel: a,
69
- showMoreLabel: i,
70
- endOfResultsLabel: m,
71
- total: l
78
+ NeonButtonStyle: p,
79
+ NeonFunctionalColor: g,
80
+ NeonSize: O,
81
+ ofLabel: i,
82
+ showMoreLabel: m,
83
+ endOfResultsLabel: l,
84
+ total: d,
85
+ slots: r
72
86
  };
73
87
  }
74
88
  });
75
89
  export {
76
- B as default
90
+ _ as default
77
91
  };
78
92
  //# sourceMappingURL=NeonCardList.es.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"NeonCardList.es.js","sources":["../../../../src/components/layout/card-list/NeonCardList.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { computed, defineComponent } from 'vue';\nimport NeonButton from '@/components/user-input/button/NeonButton.vue';\nimport NeonInline from '@/components/layout/inline/NeonInline.vue';\nimport NeonLink from '@/components/navigation/link/NeonLink.vue';\nimport NeonPagination from '@/components/navigation/pagination/NeonPagination.vue';\nimport NeonStack from '@/components/layout/stack/NeonStack.vue';\nimport { NeonButtonStyle } from '@/model/user-input/button/NeonButtonStyle';\nimport { NeonSize } from '@/model/common/size/NeonSize';\nimport { NeonFunctionalColor } from '@/model/common/color/NeonFunctionalColor';\nimport type { NeonCardListModel } from '@/model/layout/card-list/NeonCardListModel';\nimport { NeonNumberUtils } from '@/utils/common/number/NeonNumberUtils';\nimport type { NeonLoadOnDemandModel } from '@/model/layout/card-list/NeonLoadOnDemandModel';\nimport type { NeonPaginationModel } from '@/model/navigation/pagination/NeonPaginationModel';\nimport type { NeonIdentifiable } from '@/model/common/entity/NeonIdentifiable';\n\n/**\n * Represent lists of objects as cards. This is intended to be a more responsive replacement for tables. This component\n * will display a list of items as cards with a count (x of y) and a <em>Show more</em> button to load more results.\n * There is also a slot for adding filtering or other content above the list. A slot is provided with card model & index\n * parameters for customising how to display the model for each card.\n */\nexport default defineComponent({\n name: 'NeonCardList',\n components: {\n NeonPagination,\n NeonButton,\n NeonInline,\n NeonLink,\n NeonStack,\n },\n props: {\n /**\n * Items to display as cards. Each item should be a NeonCardListModel.\n */\n items: { type: Array as () => Array<NeonCardListModel<NeonIdentifiable>>, required: true },\n /**\n * Specify a hover color for the cards.\n */\n color: { type: String as () => NeonFunctionalColor, default: null },\n /**\n * Model for configuring the on demand loading layout.\n */\n loadOnDemand: { type: Object as () => NeonLoadOnDemandModel },\n /**\n * Model for configuring pagination, either pagination or loadOnDemand should be provided.\n */\n pagination: { type: Object as () => NeonPaginationModel },\n },\n emits: [\n /**\n * Emitted when the 'Show more' button is clicked in \"on demand\" mode.\n * @type {void}\n */\n 'show-more',\n ],\n setup(props, { emit }) {\n const ofLabel = computed(() => {\n if (!props.pagination) {\n return props.loadOnDemand?.ofLabel ?? 'of';\n }\n\n return undefined;\n });\n\n const showMoreLabel = computed(() => {\n if (!props.pagination) {\n return props.loadOnDemand?.showMoreLabel ?? 'Show more';\n }\n\n return undefined;\n });\n\n const endOfResultsLabel = computed(() => {\n if (!props.pagination) {\n return props.loadOnDemand?.endOfResultsLabel ?? 'End of results';\n }\n\n return undefined;\n });\n\n const total = computed(() => props.loadOnDemand?.total ?? props.pagination?.total ?? 0);\n\n return {\n emit,\n n: NeonNumberUtils.formatNumber,\n NeonButtonStyle,\n NeonFunctionalColor,\n NeonSize,\n ofLabel,\n showMoreLabel,\n endOfResultsLabel,\n total,\n };\n },\n});\n"],"names":["_sfc_main","defineComponent","NeonPagination","NeonButton","NeonInline","NeonLink","NeonStack","props","emit","ofLabel","computed","_a","showMoreLabel","endOfResultsLabel","total","_b","NeonNumberUtils","NeonButtonStyle","NeonFunctionalColor","NeonSize"],"mappings":";;;;;;;;;;AAqBA,MAAAA,IAAeC,EAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV,gBAAAC;AAAA,IACA,YAAAC;AAAA,IACA,YAAAC;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC;AAAA,EAAA;AAAA,EAEF,OAAO;AAAA;AAAA;AAAA;AAAA,IAIL,OAAO,EAAE,MAAM,OAA2D,UAAU,GAAA;AAAA;AAAA;AAAA;AAAA,IAIpF,OAAO,EAAE,MAAM,QAAqC,SAAS,KAAA;AAAA;AAAA;AAAA;AAAA,IAI7D,cAAc,EAAE,MAAM,OAAA;AAAA;AAAA;AAAA;AAAA,IAItB,YAAY,EAAE,MAAM,OAAA;AAAA,EAAoC;AAAA,EAE1D,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKL;AAAA,EAAA;AAAA,EAEF,MAAMC,GAAO,EAAE,MAAAC,KAAQ;AACrB,UAAMC,IAAUC,EAAS,MAAM;;AAC7B,UAAI,CAACH,EAAM;AACT,iBAAOI,IAAAJ,EAAM,iBAAN,gBAAAI,EAAoB,YAAW;AAAA,IAI1C,CAAC,GAEKC,IAAgBF,EAAS,MAAM;;AACnC,UAAI,CAACH,EAAM;AACT,iBAAOI,IAAAJ,EAAM,iBAAN,gBAAAI,EAAoB,kBAAiB;AAAA,IAIhD,CAAC,GAEKE,IAAoBH,EAAS,MAAM;;AACvC,UAAI,CAACH,EAAM;AACT,iBAAOI,IAAAJ,EAAM,iBAAN,gBAAAI,EAAoB,sBAAqB;AAAA,IAIpD,CAAC,GAEKG,IAAQJ,EAAS,MAAA;;AAAM,eAAAC,IAAAJ,EAAM,iBAAN,gBAAAI,EAAoB,YAASI,IAAAR,EAAM,eAAN,gBAAAQ,EAAkB,UAAS;AAAA,KAAC;AAEtF,WAAO;AAAA,MACL,MAAAP;AAAA,MACA,GAAGQ,EAAgB;AAAA,MACnB,iBAAAC;AAAA,MACA,qBAAAC;AAAA,MACA,UAAAC;AAAA,MACA,SAAAV;AAAA,MACA,eAAAG;AAAA,MACA,mBAAAC;AAAA,MACA,OAAAC;AAAA,IAAA;AAAA,EAEJ;AACF,CAAC;"}
1
+ {"version":3,"file":"NeonCardList.es.js","sources":["../../../../src/components/layout/card-list/NeonCardList.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { computed, defineComponent } from 'vue';\nimport NeonButton from '@/components/user-input/button/NeonButton.vue';\nimport NeonInline from '@/components/layout/inline/NeonInline.vue';\nimport NeonLink from '@/components/navigation/link/NeonLink.vue';\nimport NeonPagination from '@/components/navigation/pagination/NeonPagination.vue';\nimport NeonStack from '@/components/layout/stack/NeonStack.vue';\nimport { NeonButtonStyle } from '@/model/user-input/button/NeonButtonStyle';\nimport { NeonSize } from '@/model/common/size/NeonSize';\nimport { NeonFunctionalColor } from '@/model/common/color/NeonFunctionalColor';\nimport type { NeonCardListModel } from '@/model/layout/card-list/NeonCardListModel';\nimport { NeonNumberUtils } from '@/utils/common/number/NeonNumberUtils';\nimport type { NeonLoadOnDemandModel } from '@/model/layout/card-list/NeonLoadOnDemandModel';\nimport type { NeonPaginationModel } from '@/model/navigation/pagination/NeonPaginationModel';\nimport type { NeonIdentifiable } from '@/model/common/entity/NeonIdentifiable';\nimport type { NeonSelectable } from '@/model/common/entity/NeonSelectable';\nimport NeonSelectableCard from './selectable-card/NeonSelectableCard.vue';\n\n/**\n * TODO: consider refactoring since it's no longer just a layout component when selectable.\n * Represent lists of objects as cards. This is intended to be a more responsive replacement for tables. This component\n * will display a list of items as cards with a count (x of y) and a <em>Show more</em> button to load more results.\n * There is also a slot for adding filtering or other content above the list. A slot is provided with card model & index\n * parameters for customising how to display the model for each card.\n */\nexport default defineComponent({\n name: 'NeonCardList',\n components: {\n NeonSelectableCard,\n NeonPagination,\n NeonButton,\n NeonInline,\n NeonLink,\n NeonStack,\n },\n props: {\n /**\n * Items to display as cards. Each item should be a NeonCardListModel.\n */\n items: {\n type: Array as () => Array<NeonCardListModel<NeonIdentifiable | (NeonIdentifiable & NeonSelectable)>>,\n required: true,\n },\n /**\n * Specify a selection/hover color for the cards.\n */\n color: { type: String as () => NeonFunctionalColor, default: null },\n /**\n * Make cards selectable.\n */\n selectable: { type: Boolean, default: false },\n /**\n * Model for configuring the on-demand loading layout.\n */\n loadOnDemand: { type: Object as () => NeonLoadOnDemandModel },\n /**\n * Model for configuring pagination, either pagination or loadOnDemand should be provided.\n */\n pagination: { type: Object as () => NeonPaginationModel },\n },\n emits: [\n /**\n * Emitted when the 'Show more' button is clicked in \"on demand\" mode.\n * @type {void}\n */\n 'show-more',\n /**\n * Emitted when in selectable mode and the selected state of a card is toggled.\n * @type {string, boolean} - the id of the card which is toggled & the new selected state.\n */\n 'toggleSelected',\n ],\n setup(props, { emit, slots }) {\n const ofLabel = computed(() => {\n if (!props.pagination && props.loadOnDemand) {\n return props.loadOnDemand.ofLabel ?? 'of';\n }\n\n return undefined;\n });\n\n const showMoreLabel = computed(() => {\n if (!props.pagination) {\n return props.loadOnDemand?.showMoreLabel ?? 'Show more';\n }\n\n return undefined;\n });\n\n const endOfResultsLabel = computed(() => {\n if (!props.pagination) {\n return props.loadOnDemand?.endOfResultsLabel ?? 'End of results';\n }\n\n return undefined;\n });\n\n const total = computed(() => props.loadOnDemand?.total ?? props.pagination?.total ?? 0);\n\n return {\n emit,\n n: NeonNumberUtils.formatNumber,\n NeonButtonStyle,\n NeonFunctionalColor,\n NeonSize,\n ofLabel,\n showMoreLabel,\n endOfResultsLabel,\n total,\n slots,\n };\n },\n});\n"],"names":["_sfc_main","defineComponent","NeonSelectableCard","NeonPagination","NeonButton","NeonInline","NeonLink","NeonStack","props","emit","slots","ofLabel","computed","showMoreLabel","_a","endOfResultsLabel","total","_b","NeonNumberUtils","NeonButtonStyle","NeonFunctionalColor","NeonSize"],"mappings":";;;;;;;;;;;AAwBA,MAAAA,IAAeC,EAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV,oBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,YAAAC;AAAA,IACA,YAAAC;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC;AAAA,EAAA;AAAA,EAEF,OAAO;AAAA;AAAA;AAAA;AAAA,IAIL,OAAO;AAAA,MACL,MAAM;AAAA,MACN,UAAU;AAAA,IAAA;AAAA;AAAA;AAAA;AAAA,IAKZ,OAAO,EAAE,MAAM,QAAqC,SAAS,KAAA;AAAA;AAAA;AAAA;AAAA,IAI7D,YAAY,EAAE,MAAM,SAAS,SAAS,GAAA;AAAA;AAAA;AAAA;AAAA,IAItC,cAAc,EAAE,MAAM,OAAA;AAAA;AAAA;AAAA;AAAA,IAItB,YAAY,EAAE,MAAM,OAAA;AAAA,EAAoC;AAAA,EAE1D,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKL;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA;AAAA,EAAA;AAAA,EAEF,MAAMC,GAAO,EAAE,MAAAC,GAAM,OAAAC,KAAS;AAC5B,UAAMC,IAAUC,EAAS,MAAM;AAC7B,UAAI,CAACJ,EAAM,cAAcA,EAAM;AAC7B,eAAOA,EAAM,aAAa,WAAW;AAAA,IAIzC,CAAC,GAEKK,IAAgBD,EAAS,MAAM;;AACnC,UAAI,CAACJ,EAAM;AACT,iBAAOM,IAAAN,EAAM,iBAAN,gBAAAM,EAAoB,kBAAiB;AAAA,IAIhD,CAAC,GAEKC,IAAoBH,EAAS,MAAM;;AACvC,UAAI,CAACJ,EAAM;AACT,iBAAOM,IAAAN,EAAM,iBAAN,gBAAAM,EAAoB,sBAAqB;AAAA,IAIpD,CAAC,GAEKE,IAAQJ,EAAS,MAAA;;AAAM,eAAAE,IAAAN,EAAM,iBAAN,gBAAAM,EAAoB,YAASG,IAAAT,EAAM,eAAN,gBAAAS,EAAkB,UAAS;AAAA,KAAC;AAEtF,WAAO;AAAA,MACL,MAAAR;AAAA,MACA,GAAGS,EAAgB;AAAA,MACnB,iBAAAC;AAAA,MACA,qBAAAC;AAAA,MACA,UAAAC;AAAA,MACA,SAAAV;AAAA,MACA,eAAAE;AAAA,MACA,mBAAAE;AAAA,MACA,OAAAC;AAAA,MACA,OAAAN;AAAA,IAAA;AAAA,EAEJ;AACF,CAAC;"}
@@ -1,2 +1,2 @@
1
- "use strict";const c=require("./NeonCardList.cjs.js"),e=require("vue"),p=require("../../../_virtual/_plugin-vue_export-helper.cjs.js"),m={class:"neon-card-list"},u={key:0,class:"neon-card-list__total"},k={class:"neon-card-list__card"},_={key:0,class:"neon-card-list__results-end"};function g(o,t,B,f,h,C){const a=e.resolveComponent("neon-inline"),r=e.resolveComponent("neon-link"),s=e.resolveComponent("neon-stack"),i=e.resolveComponent("neon-button"),d=e.resolveComponent("neon-pagination");return e.openBlock(),e.createElementBlock("div",m,[e.createVNode(a,{breakpoint:"",class:"neon-card-list__header"},{default:e.withCtx(()=>[e.renderSlot(o.$slots,"header"),o.loadOnDemand?(e.openBlock(),e.createElementBlock("span",u,e.toDisplayString(o.n(o.items.length))+" "+e.toDisplayString(o.ofLabel)+" "+e.toDisplayString(o.n(o.total)),1)):e.createCommentVNode("",!0)]),_:3}),e.createVNode(s,{class:"neon-card-list__cards",gap:"z"},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.items,(n,l)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[n.href&&!n.disabled?(e.openBlock(),e.createBlock(r,{key:`${n.model.id??l}-link`,class:e.normalizeClass([o.color&&`neon-card-list__link--${o.color}`,"neon-card-list__link"]),href:n.href,"no-style":"","outline-style":"background"},{default:e.withCtx(()=>[e.createElementVNode("div",k,[e.renderSlot(o.$slots,"card",e.mergeProps({ref_for:!0},{model:n.model,index:l}))])]),_:2},1032,["class","href"])):(e.openBlock(),e.createElementBlock("div",{key:`${n.model.id??l}-readonly`,class:e.normalizeClass([{"neon-card-list__card--disabled":n.disabled},"neon-card-list__card"])},[e.renderSlot(o.$slots,"card",e.mergeProps({ref_for:!0},{model:n.model,index:l}))],2))],64))),256))]),_:3}),o.loadOnDemand?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[o.items.length===o.total?(e.openBlock(),e.createElementBlock("span",_,e.toDisplayString(o.endOfResultsLabel),1)):(e.openBlock(),e.createBlock(i,{key:1,"button-style":o.NeonButtonStyle.Text,color:o.NeonFunctionalColor.Neutral,label:o.showMoreLabel,size:o.NeonSize.Small,class:"neon-card-list__show-more",onClick:t[0]||(t[0]=n=>o.emit("show-more",n))},null,8,["button-style","color","label","size"]))],64)):o.pagination?(e.openBlock(),e.createBlock(d,{key:1,color:o.color,"display-first-and-last":o.pagination.displayFirstAndLast,page:o.pagination.page,"page-size":o.pagination.pageSize,total:o.pagination.total,"url-template":o.pagination.urlTemplate},null,8,["color","display-first-and-last","page","page-size","total","url-template"])):e.createCommentVNode("",!0)])}const y=p(c,[["render",g]]);module.exports=y;
1
+ "use strict";const m=require("./NeonCardList.cjs.js"),e=require("vue"),u=require("../../../_virtual/_plugin-vue_export-helper.cjs.js"),k={class:"neon-card-list"},_={key:0,class:"neon-card-list__total"},g={class:"neon-card-list__card"},B={key:0,class:"neon-card-list__results-end"};function b(o,a,y,C,h,v){const t=e.resolveComponent("neon-inline"),s=e.resolveComponent("neon-link"),r=e.resolveComponent("neon-selectable-card"),d=e.resolveComponent("neon-stack"),i=e.resolveComponent("neon-button"),c=e.resolveComponent("neon-pagination");return e.openBlock(),e.createElementBlock("div",k,[o.slots.header||o.loadOnDemand?(e.openBlock(),e.createBlock(t,{key:0,class:"neon-card-list__header"},{default:e.withCtx(()=>[e.renderSlot(o.$slots,"header"),o.loadOnDemand?(e.openBlock(),e.createElementBlock("span",_,e.toDisplayString(o.n(o.items.length))+" "+e.toDisplayString(o.ofLabel)+" "+e.toDisplayString(o.n(o.total)),1)):e.createCommentVNode("",!0)]),_:3})):e.createCommentVNode("",!0),e.createVNode(d,{class:"neon-card-list__cards",gap:"z"},{default:e.withCtx(()=>[e.createVNode(e.TransitionGroup,{mode:"out-in",name:"neon-fade-transition",tag:"div"},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.items,(n,l)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[n.href&&!n.disabled?(e.openBlock(),e.createBlock(s,{key:`${n.model.id??l}-link`,class:e.normalizeClass([o.color&&`neon-card-list__link--${o.color}`,"neon-card-list__link"]),href:n.href,"no-style":"","outline-style":"background"},{default:e.withCtx(()=>[e.createElementVNode("div",g,[e.renderSlot(o.$slots,"card",e.mergeProps({ref_for:!0},{model:n.model,index:l}))])]),_:2},1032,["class","href"])):o.selectable?(e.openBlock(),e.createBlock(r,{key:`${n.model.id??l}-selectable`,class:e.normalizeClass([{"neon-card-list__card--disabled":n.disabled,"neon-card-list__card--selected":n.selected},"neon-card-list__card neon-card-list__card--selectable"]),disabled:n.disabled,"model-value":!!n.selected,"onUpdate:modelValue":p=>o.emit("toggleSelected",n.model.id,p)},{default:e.withCtx(()=>[e.renderSlot(o.$slots,"card",e.mergeProps({ref_for:!0},{model:n.model,index:l}))]),_:2},1032,["class","disabled","model-value","onUpdate:modelValue"])):(e.openBlock(),e.createElementBlock("div",{key:`${n.model.id??l}-link`,class:e.normalizeClass([{"neon-card-list__card--disabled":n.disabled},"neon-card-list__card"])},[e.renderSlot(o.$slots,"card",e.mergeProps({ref_for:!0},{model:n.model,index:l}))],2))],64))),256))]),_:3})]),_:3}),o.loadOnDemand?(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[o.items.length===o.total?(e.openBlock(),e.createElementBlock("span",B,e.toDisplayString(o.endOfResultsLabel),1)):(e.openBlock(),e.createBlock(i,{key:1,"button-style":o.NeonButtonStyle.Text,color:o.NeonFunctionalColor.Neutral,label:o.showMoreLabel,size:o.NeonSize.Small,class:"neon-card-list__show-more",onClick:a[0]||(a[0]=n=>o.emit("show-more",n))},null,8,["button-style","color","label","size"]))],64)):o.pagination?(e.openBlock(),e.createBlock(c,{key:2,color:o.color,"display-first-and-last":o.pagination.displayFirstAndLast,page:o.pagination.page,"page-size":o.pagination.pageSize,total:o.pagination.total,"url-template":o.pagination.urlTemplate},null,8,["color","display-first-and-last","page","page-size","total","url-template"])):e.createCommentVNode("",!0)])}const f=u(m,[["render",b]]);module.exports=f;
2
2
  //# sourceMappingURL=NeonCardList.vue.cjs.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"NeonCardList.vue.cjs.js","sources":["../../../../src/components/layout/card-list/NeonCardList.vue"],"sourcesContent":["<template>\n <div class=\"neon-card-list\">\n <neon-inline breakpoint=\"\" class=\"neon-card-list__header\">\n <!-- @slot slot for providing filters or titles for the card list aligned next to the result count -->\n <slot name=\"header\"></slot>\n <span v-if=\"loadOnDemand\" class=\"neon-card-list__total\">{{ n(items.length) }} {{ ofLabel }} {{ n(total) }}</span>\n </neon-inline>\n <neon-stack class=\"neon-card-list__cards\" gap=\"z\">\n <template v-for=\"(item, index) in items\">\n <neon-link\n v-if=\"item.href && !item.disabled\"\n :key=\"`${item.model.id ?? index}-link`\"\n :class=\"color && `neon-card-list__link--${color}`\"\n :href=\"item.href\"\n class=\"neon-card-list__link\"\n no-style\n outline-style=\"background\"\n >\n <div class=\"neon-card-list__card\">\n <!-- @slot slot for rendering card contents, two parameters are available:\n@binding {T} model - the model item to be rendered\n@binding {number} index - the index of the item in the list -->\n <slot name=\"card\" v-bind=\"{ model: item.model, index: index }\"></slot>\n </div>\n </neon-link>\n <div\n v-else\n :key=\"`${item.model.id ?? index}-readonly`\"\n :class=\"{ 'neon-card-list__card--disabled': item.disabled }\"\n class=\"neon-card-list__card\"\n >\n <!-- @slot slot for rendering card contents, two parameters are available:\n @binding {T} model - the model item to be rendered\n @binding {number} index - the index of the item in the list -->\n <slot name=\"card\" v-bind=\"{ model: item.model, index: index }\"></slot>\n </div>\n </template>\n </neon-stack>\n <template v-if=\"loadOnDemand\">\n <span v-if=\"items.length === total\" class=\"neon-card-list__results-end\">{{ endOfResultsLabel }}</span>\n <neon-button\n v-else\n :button-style=\"NeonButtonStyle.Text\"\n :color=\"NeonFunctionalColor.Neutral\"\n :label=\"showMoreLabel\"\n :size=\"NeonSize.Small\"\n class=\"neon-card-list__show-more\"\n @click=\"emit('show-more', $event)\"\n />\n </template>\n <neon-pagination\n v-else-if=\"pagination\"\n :color=\"color\"\n :display-first-and-last=\"pagination.displayFirstAndLast\"\n :page=\"pagination.page\"\n :page-size=\"pagination.pageSize\"\n :total=\"pagination.total\"\n :url-template=\"pagination.urlTemplate\"\n />\n </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonCardList.ts\"></script>\n"],"names":["_hoisted_1","_hoisted_3","_openBlock","_createElementBlock","_createVNode","_component_neon_inline","_renderSlot","_ctx","_hoisted_2","_toDisplayString","_component_neon_stack","_Fragment","_renderList","item","index","_createBlock","_component_neon_link","_normalizeClass","_createElementVNode","_mergeProps","_hoisted_4","_component_neon_button","_cache","$event","_component_neon_pagination"],"mappings":"uIACOA,EAAA,CAAA,MAAM,gBAAgB,WAIG,MAAM,yBAavBC,EAAA,CAAA,MAAM,sBAAsB,WAqBD,MAAM,kPAtC9C,OAAAC,YAAA,EAAAC,qBA0DM,MA1DNH,EA0DM,CAzDJI,EAAAA,YAIcC,EAAA,CAJD,WAAW,GAAG,MAAM,6CAE/B,IAA2B,CAA3BC,aAA2BC,EAAA,OAAA,QAAA,EACfA,EAAA,cAAZL,EAAAA,YAAAC,EAAAA,mBAAiH,OAAjHK,EAAiHC,EAAAA,gBAAtDF,EAAA,EAAEA,QAAM,MAAM,CAAA,EAAI,sBAAIA,EAAA,OAAO,EAAG,IAACE,EAAAA,gBAAGF,EAAA,EAAEA,EAAA,KAAK,CAAA,EAAA,CAAA,uCAExGH,EAAAA,YA8BaM,EAAA,CA9BD,MAAM,wBAAwB,IAAI,wBAClC,IAA8B,EAAxCR,EAAAA,UAAA,EAAA,EAAAC,EAAAA,mBA4BWQ,WAAA,KAAAC,EAAAA,WA5BuBL,EAAA,MAAK,CAArBM,EAAMC,yDAEdD,EAAK,MAAI,CAAKA,EAAK,wBAD3BE,EAAAA,YAeYC,EAAA,CAbT,OAAQH,EAAK,MAAM,IAAMC,CAAK,QAC9B,MAAKG,EAAAA,eAAA,CAAEV,EAAA,OAAK,yBAA6BA,EAAA,KAAK,GAEzC,sBAAsB,CAAA,EAD3B,KAAMM,EAAK,KAEZ,WAAA,GACA,gBAAc,iCAEd,IAKM,CALNK,EAAAA,mBAKM,MALNjB,EAKM,CADJK,EAAAA,WAAsEC,gBAAtEY,EAAAA,WAAsE,CAAA,QAAA,EAAA,EAAA,CAAA,MAAnCN,EAAK,YAAcC,CAAK,CAAA,CAAA,kDAG/DX,EAAAA,mBAUM,MAAA,CARH,OAAQU,EAAK,MAAM,IAAMC,CAAK,YAC9B,MAAKG,EAAAA,eAAA,CAAA,CAAA,iCAAsCJ,EAAK,QAAQ,EACnD,sBAAsB,CAAA,IAK5BP,EAAAA,WAAsEC,gBAAtEY,EAAAA,WAAsE,CAAA,QAAA,EAAA,EAAA,CAAA,MAAnCN,EAAK,YAAcC,CAAK,CAAA,CAAA,4BAIjDP,EAAA,4BAAhBJ,EAAAA,mBAWWQ,EAAAA,SAAA,CAAA,IAAA,CAAA,EAAA,CAVGJ,EAAA,MAAM,SAAWA,EAAA,qBAA7BJ,EAAAA,mBAAsG,OAAtGiB,EAAsGX,EAAAA,gBAA3BF,EAAA,iBAAiB,EAAA,CAAA,kBAC5FQ,EAAAA,YAQEM,EAAA,OANC,eAAcd,EAAA,gBAAgB,KAC9B,MAAOA,EAAA,oBAAoB,QAC3B,MAAOA,EAAA,cACP,KAAMA,EAAA,SAAS,MAChB,MAAM,4BACL,QAAKe,EAAA,CAAA,IAAAA,EAAA,CAAA,EAAAC,GAAEhB,EAAA,KAAI,YAAcgB,CAAM,2DAIvBhB,EAAA,0BADbQ,EAAAA,YAQES,EAAA,OANC,MAAOjB,EAAA,MACP,yBAAwBA,EAAA,WAAW,oBACnC,KAAMA,EAAA,WAAW,KACjB,YAAWA,EAAA,WAAW,SACtB,MAAOA,EAAA,WAAW,MAClB,eAAcA,EAAA,WAAW"}
1
+ {"version":3,"file":"NeonCardList.vue.cjs.js","sources":["../../../../src/components/layout/card-list/NeonCardList.vue"],"sourcesContent":["<template>\n <div class=\"neon-card-list\">\n <neon-inline v-if=\"slots.header || loadOnDemand\" class=\"neon-card-list__header\">\n <!-- @slot slot for providing filters or titles for the card list aligned next to the result count -->\n <slot name=\"header\"></slot>\n <span v-if=\"loadOnDemand\" class=\"neon-card-list__total\">{{ n(items.length) }} {{ ofLabel }} {{ n(total) }}</span>\n </neon-inline>\n <neon-stack class=\"neon-card-list__cards\" gap=\"z\">\n <transition-group mode=\"out-in\" name=\"neon-fade-transition\" tag=\"div\">\n <template v-for=\"(item, index) in items\">\n <neon-link\n v-if=\"item.href && !item.disabled\"\n :key=\"`${item.model.id ?? index}-link`\"\n :class=\"color && `neon-card-list__link--${color}`\"\n :href=\"item.href\"\n class=\"neon-card-list__link\"\n no-style\n outline-style=\"background\"\n >\n <div class=\"neon-card-list__card\">\n <!-- @slot slot for rendering card contents, two parameters are available:\n @binding {T} model - the model item to be rendered\n @binding {number} index - the index of the item in the list -->\n <slot name=\"card\" v-bind=\"{ model: item.model, index: index }\"></slot>\n </div>\n </neon-link>\n <neon-selectable-card\n v-else-if=\"selectable\"\n :key=\"`${item.model.id ?? index}-selectable`\"\n :class=\"{\n 'neon-card-list__card--disabled': item.disabled,\n 'neon-card-list__card--selected': item.selected,\n }\"\n :disabled=\"item.disabled\"\n :model-value=\"!!item.selected\"\n class=\"neon-card-list__card neon-card-list__card--selectable\"\n @update:model-value=\"emit('toggleSelected', item.model.id, $event)\"\n >\n <!-- @slot slot for rendering card contents, two parameters are available:\n @binding {T} model - the model item to be rendered\n @binding {number} index - the index of the item in the list -->\n <slot name=\"card\" v-bind=\"{ model: item.model, index: index }\"></slot>\n </neon-selectable-card>\n <div\n v-else\n :key=\"`${item.model.id ?? index}-link`\"\n :class=\"{ 'neon-card-list__card--disabled': item.disabled }\"\n class=\"neon-card-list__card\"\n >\n <!-- @slot slot for rendering card contents, two parameters are available:\n @binding {T} model - the model item to be rendered\n @binding {number} index - the index of the item in the list -->\n <slot name=\"card\" v-bind=\"{ model: item.model, index: index }\"></slot>\n </div>\n </template>\n </transition-group>\n </neon-stack>\n <template v-if=\"loadOnDemand\">\n <span v-if=\"items.length === total\" class=\"neon-card-list__results-end\">{{ endOfResultsLabel }}</span>\n <neon-button\n v-else\n :button-style=\"NeonButtonStyle.Text\"\n :color=\"NeonFunctionalColor.Neutral\"\n :label=\"showMoreLabel\"\n :size=\"NeonSize.Small\"\n class=\"neon-card-list__show-more\"\n @click=\"emit('show-more', $event)\"\n />\n </template>\n <neon-pagination\n v-else-if=\"pagination\"\n :color=\"color\"\n :display-first-and-last=\"pagination.displayFirstAndLast\"\n :page=\"pagination.page\"\n :page-size=\"pagination.pageSize\"\n :total=\"pagination.total\"\n :url-template=\"pagination.urlTemplate\"\n />\n </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonCardList.ts\"></script>\n"],"names":["_hoisted_1","_hoisted_3","_openBlock","_createElementBlock","_ctx","_createBlock","_component_neon_inline","_renderSlot","_hoisted_2","_toDisplayString","_createVNode","_component_neon_stack","_TransitionGroup","_Fragment","_renderList","item","index","_component_neon_link","_normalizeClass","_createElementVNode","_mergeProps","_component_neon_selectable_card","$event","_hoisted_4","_component_neon_button","_cache","_component_neon_pagination"],"mappings":"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"}
@@ -1,78 +1,101 @@
1
- import $ from "./NeonCardList.es.js";
2
- import { resolveComponent as a, openBlock as o, createElementBlock as l, createVNode as m, withCtx as r, renderSlot as i, toDisplayString as t, createCommentVNode as u, Fragment as d, renderList as z, createBlock as p, normalizeClass as _, createElementVNode as N, mergeProps as f } from "vue";
3
- import C from "../../../_virtual/_plugin-vue_export-helper.es.js";
4
- const L = { class: "neon-card-list" }, S = {
1
+ import N from "./NeonCardList.es.js";
2
+ import { resolveComponent as s, openBlock as o, createElementBlock as l, createBlock as t, withCtx as d, renderSlot as r, toDisplayString as i, createCommentVNode as c, createVNode as f, TransitionGroup as v, Fragment as p, renderList as C, normalizeClass as u, createElementVNode as S, mergeProps as m } from "vue";
3
+ import L from "../../../_virtual/_plugin-vue_export-helper.es.js";
4
+ const V = { class: "neon-card-list" }, w = {
5
5
  key: 0,
6
6
  class: "neon-card-list__total"
7
- }, v = { class: "neon-card-list__card" }, w = {
7
+ }, B = { class: "neon-card-list__card" }, D = {
8
8
  key: 0,
9
9
  class: "neon-card-list__results-end"
10
10
  };
11
- function B(e, c, D, F, O, V) {
12
- const g = a("neon-inline"), k = a("neon-link"), y = a("neon-stack"), h = a("neon-button"), b = a("neon-pagination");
13
- return o(), l("div", L, [
14
- m(g, {
15
- breakpoint: "",
11
+ function O(e, _, F, T, E, U) {
12
+ const g = s("neon-inline"), b = s("neon-link"), k = s("neon-selectable-card"), y = s("neon-stack"), h = s("neon-button"), $ = s("neon-pagination");
13
+ return o(), l("div", V, [
14
+ e.slots.header || e.loadOnDemand ? (o(), t(g, {
15
+ key: 0,
16
16
  class: "neon-card-list__header"
17
17
  }, {
18
- default: r(() => [
19
- i(e.$slots, "header"),
20
- e.loadOnDemand ? (o(), l("span", S, t(e.n(e.items.length)) + " " + t(e.ofLabel) + " " + t(e.n(e.total)), 1)) : u("", !0)
18
+ default: d(() => [
19
+ r(e.$slots, "header"),
20
+ e.loadOnDemand ? (o(), l("span", w, i(e.n(e.items.length)) + " " + i(e.ofLabel) + " " + i(e.n(e.total)), 1)) : c("", !0)
21
21
  ]),
22
22
  _: 3
23
- }),
24
- m(y, {
23
+ })) : c("", !0),
24
+ f(y, {
25
25
  class: "neon-card-list__cards",
26
26
  gap: "z"
27
27
  }, {
28
- default: r(() => [
29
- (o(!0), l(d, null, z(e.items, (n, s) => (o(), l(d, null, [
30
- n.href && !n.disabled ? (o(), p(k, {
31
- key: `${n.model.id ?? s}-link`,
32
- class: _([e.color && `neon-card-list__link--${e.color}`, "neon-card-list__link"]),
33
- href: n.href,
34
- "no-style": "",
35
- "outline-style": "background"
36
- }, {
37
- default: r(() => [
38
- N("div", v, [
39
- i(e.$slots, "card", f({ ref_for: !0 }, { model: n.model, index: s }))
40
- ])
41
- ]),
42
- _: 2
43
- }, 1032, ["class", "href"])) : (o(), l("div", {
44
- key: `${n.model.id ?? s}-readonly`,
45
- class: _([{ "neon-card-list__card--disabled": n.disabled }, "neon-card-list__card"])
46
- }, [
47
- i(e.$slots, "card", f({ ref_for: !0 }, { model: n.model, index: s }))
48
- ], 2))
49
- ], 64))), 256))
28
+ default: d(() => [
29
+ f(v, {
30
+ mode: "out-in",
31
+ name: "neon-fade-transition",
32
+ tag: "div"
33
+ }, {
34
+ default: d(() => [
35
+ (o(!0), l(p, null, C(e.items, (n, a) => (o(), l(p, null, [
36
+ n.href && !n.disabled ? (o(), t(b, {
37
+ key: `${n.model.id ?? a}-link`,
38
+ class: u([e.color && `neon-card-list__link--${e.color}`, "neon-card-list__link"]),
39
+ href: n.href,
40
+ "no-style": "",
41
+ "outline-style": "background"
42
+ }, {
43
+ default: d(() => [
44
+ S("div", B, [
45
+ r(e.$slots, "card", m({ ref_for: !0 }, { model: n.model, index: a }))
46
+ ])
47
+ ]),
48
+ _: 2
49
+ }, 1032, ["class", "href"])) : e.selectable ? (o(), t(k, {
50
+ key: `${n.model.id ?? a}-selectable`,
51
+ class: u([{
52
+ "neon-card-list__card--disabled": n.disabled,
53
+ "neon-card-list__card--selected": n.selected
54
+ }, "neon-card-list__card neon-card-list__card--selectable"]),
55
+ disabled: n.disabled,
56
+ "model-value": !!n.selected,
57
+ "onUpdate:modelValue": (z) => e.emit("toggleSelected", n.model.id, z)
58
+ }, {
59
+ default: d(() => [
60
+ r(e.$slots, "card", m({ ref_for: !0 }, { model: n.model, index: a }))
61
+ ]),
62
+ _: 2
63
+ }, 1032, ["class", "disabled", "model-value", "onUpdate:modelValue"])) : (o(), l("div", {
64
+ key: `${n.model.id ?? a}-link`,
65
+ class: u([{ "neon-card-list__card--disabled": n.disabled }, "neon-card-list__card"])
66
+ }, [
67
+ r(e.$slots, "card", m({ ref_for: !0 }, { model: n.model, index: a }))
68
+ ], 2))
69
+ ], 64))), 256))
70
+ ]),
71
+ _: 3
72
+ })
50
73
  ]),
51
74
  _: 3
52
75
  }),
53
- e.loadOnDemand ? (o(), l(d, { key: 0 }, [
54
- e.items.length === e.total ? (o(), l("span", w, t(e.endOfResultsLabel), 1)) : (o(), p(h, {
76
+ e.loadOnDemand ? (o(), l(p, { key: 1 }, [
77
+ e.items.length === e.total ? (o(), l("span", D, i(e.endOfResultsLabel), 1)) : (o(), t(h, {
55
78
  key: 1,
56
79
  "button-style": e.NeonButtonStyle.Text,
57
80
  color: e.NeonFunctionalColor.Neutral,
58
81
  label: e.showMoreLabel,
59
82
  size: e.NeonSize.Small,
60
83
  class: "neon-card-list__show-more",
61
- onClick: c[0] || (c[0] = (n) => e.emit("show-more", n))
84
+ onClick: _[0] || (_[0] = (n) => e.emit("show-more", n))
62
85
  }, null, 8, ["button-style", "color", "label", "size"]))
63
- ], 64)) : e.pagination ? (o(), p(b, {
64
- key: 1,
86
+ ], 64)) : e.pagination ? (o(), t($, {
87
+ key: 2,
65
88
  color: e.color,
66
89
  "display-first-and-last": e.pagination.displayFirstAndLast,
67
90
  page: e.pagination.page,
68
91
  "page-size": e.pagination.pageSize,
69
92
  total: e.pagination.total,
70
93
  "url-template": e.pagination.urlTemplate
71
- }, null, 8, ["color", "display-first-and-last", "page", "page-size", "total", "url-template"])) : u("", !0)
94
+ }, null, 8, ["color", "display-first-and-last", "page", "page-size", "total", "url-template"])) : c("", !0)
72
95
  ]);
73
96
  }
74
- const M = /* @__PURE__ */ C($, [["render", B]]);
97
+ const P = /* @__PURE__ */ L(N, [["render", O]]);
75
98
  export {
76
- M as default
99
+ P as default
77
100
  };
78
101
  //# sourceMappingURL=NeonCardList.vue.es.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"NeonCardList.vue.es.js","sources":["../../../../src/components/layout/card-list/NeonCardList.vue"],"sourcesContent":["<template>\n <div class=\"neon-card-list\">\n <neon-inline breakpoint=\"\" class=\"neon-card-list__header\">\n <!-- @slot slot for providing filters or titles for the card list aligned next to the result count -->\n <slot name=\"header\"></slot>\n <span v-if=\"loadOnDemand\" class=\"neon-card-list__total\">{{ n(items.length) }} {{ ofLabel }} {{ n(total) }}</span>\n </neon-inline>\n <neon-stack class=\"neon-card-list__cards\" gap=\"z\">\n <template v-for=\"(item, index) in items\">\n <neon-link\n v-if=\"item.href && !item.disabled\"\n :key=\"`${item.model.id ?? index}-link`\"\n :class=\"color && `neon-card-list__link--${color}`\"\n :href=\"item.href\"\n class=\"neon-card-list__link\"\n no-style\n outline-style=\"background\"\n >\n <div class=\"neon-card-list__card\">\n <!-- @slot slot for rendering card contents, two parameters are available:\n@binding {T} model - the model item to be rendered\n@binding {number} index - the index of the item in the list -->\n <slot name=\"card\" v-bind=\"{ model: item.model, index: index }\"></slot>\n </div>\n </neon-link>\n <div\n v-else\n :key=\"`${item.model.id ?? index}-readonly`\"\n :class=\"{ 'neon-card-list__card--disabled': item.disabled }\"\n class=\"neon-card-list__card\"\n >\n <!-- @slot slot for rendering card contents, two parameters are available:\n @binding {T} model - the model item to be rendered\n @binding {number} index - the index of the item in the list -->\n <slot name=\"card\" v-bind=\"{ model: item.model, index: index }\"></slot>\n </div>\n </template>\n </neon-stack>\n <template v-if=\"loadOnDemand\">\n <span v-if=\"items.length === total\" class=\"neon-card-list__results-end\">{{ endOfResultsLabel }}</span>\n <neon-button\n v-else\n :button-style=\"NeonButtonStyle.Text\"\n :color=\"NeonFunctionalColor.Neutral\"\n :label=\"showMoreLabel\"\n :size=\"NeonSize.Small\"\n class=\"neon-card-list__show-more\"\n @click=\"emit('show-more', $event)\"\n />\n </template>\n <neon-pagination\n v-else-if=\"pagination\"\n :color=\"color\"\n :display-first-and-last=\"pagination.displayFirstAndLast\"\n :page=\"pagination.page\"\n :page-size=\"pagination.pageSize\"\n :total=\"pagination.total\"\n :url-template=\"pagination.urlTemplate\"\n />\n </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonCardList.ts\"></script>\n"],"names":["_hoisted_1","_hoisted_3","_openBlock","_createElementBlock","_createVNode","_component_neon_inline","_renderSlot","_ctx","_hoisted_2","_toDisplayString","_component_neon_stack","_Fragment","_renderList","item","index","_createBlock","_component_neon_link","_normalizeClass","_createElementVNode","_mergeProps","_hoisted_4","_component_neon_button","_cache","$event","_component_neon_pagination"],"mappings":";;;AACO,MAAAA,IAAA,EAAA,OAAM,iBAAgB;;EAIG,OAAM;GAavBC,IAAA,EAAA,OAAM,uBAAsB;;EAqBD,OAAM;;;;AAtC9C,SAAAC,EAAA,GAAAC,EA0DM,OA1DNH,GA0DM;AAAA,IAzDJI,EAIcC,GAAA;AAAA,MAJD,YAAW;AAAA,MAAG,OAAM;AAAA;iBAE/B,MAA2B;AAAA,QAA3BC,EAA2BC,EAAA,QAAA,QAAA;AAAA,QACfA,EAAA,gBAAZL,KAAAC,EAAiH,QAAjHK,GAAiHC,EAAtDF,EAAA,EAAEA,QAAM,MAAM,CAAA,IAAI,QAAIA,EAAA,OAAO,IAAG,MAACE,EAAGF,EAAA,EAAEA,EAAA,KAAK,CAAA,GAAA,CAAA;;;;IAExGH,EA8BaM,GAAA;AAAA,MA9BD,OAAM;AAAA,MAAwB,KAAI;AAAA;iBAClC,MAA8B;AAAA,SAAxCR,EAAA,EAAA,GAAAC,EA4BWQ,GAAA,MAAAC,EA5BuBL,EAAA,OAAK,CAArBM,GAAMC;UAEdD,EAAK,QAAI,CAAKA,EAAK,iBAD3BE,EAeYC,GAAA;AAAA,YAbT,QAAQH,EAAK,MAAM,MAAMC,CAAK;AAAA,YAC9B,OAAKG,EAAA,CAAEV,EAAA,SAAK,yBAA6BA,EAAA,KAAK,IAEzC,sBAAsB,CAAA;AAAA,YAD3B,MAAMM,EAAK;AAAA,YAEZ,YAAA;AAAA,YACA,iBAAc;AAAA;uBAEd,MAKM;AAAA,cALNK,EAKM,OALNjB,GAKM;AAAA,gBADJK,EAAsEC,kBAAtEY,EAAsE,EAAA,SAAA,GAAA,GAAA,EAAA,OAAnCN,EAAK,cAAcC,EAAK,CAAA,CAAA;AAAA;;;+CAG/DX,EAUM,OAAA;AAAA,YARH,QAAQU,EAAK,MAAM,MAAMC,CAAK;AAAA,YAC9B,OAAKG,EAAA,CAAA,EAAA,kCAAsCJ,EAAK,SAAQ,GACnD,sBAAsB,CAAA;AAAA;YAK5BP,EAAsEC,kBAAtEY,EAAsE,EAAA,SAAA,GAAA,GAAA,EAAA,OAAnCN,EAAK,cAAcC,EAAK,CAAA,CAAA;AAAA;;;;;IAIjDP,EAAA,qBAAhBJ,EAWWQ,GAAA,EAAA,KAAA,EAAA,GAAA;AAAA,MAVGJ,EAAA,MAAM,WAAWA,EAAA,cAA7BJ,EAAsG,QAAtGiB,GAAsGX,EAA3BF,EAAA,iBAAiB,GAAA,CAAA,WAC5FQ,EAQEM,GAAA;AAAA;QANC,gBAAcd,EAAA,gBAAgB;AAAA,QAC9B,OAAOA,EAAA,oBAAoB;AAAA,QAC3B,OAAOA,EAAA;AAAA,QACP,MAAMA,EAAA,SAAS;AAAA,QAChB,OAAM;AAAA,QACL,SAAKe,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAC,MAAEhB,EAAA,KAAI,aAAcgB,CAAM;AAAA;cAIvBhB,EAAA,mBADbQ,EAQES,GAAA;AAAA;MANC,OAAOjB,EAAA;AAAA,MACP,0BAAwBA,EAAA,WAAW;AAAA,MACnC,MAAMA,EAAA,WAAW;AAAA,MACjB,aAAWA,EAAA,WAAW;AAAA,MACtB,OAAOA,EAAA,WAAW;AAAA,MAClB,gBAAcA,EAAA,WAAW;AAAA;;;;"}
1
+ {"version":3,"file":"NeonCardList.vue.es.js","sources":["../../../../src/components/layout/card-list/NeonCardList.vue"],"sourcesContent":["<template>\n <div class=\"neon-card-list\">\n <neon-inline v-if=\"slots.header || loadOnDemand\" class=\"neon-card-list__header\">\n <!-- @slot slot for providing filters or titles for the card list aligned next to the result count -->\n <slot name=\"header\"></slot>\n <span v-if=\"loadOnDemand\" class=\"neon-card-list__total\">{{ n(items.length) }} {{ ofLabel }} {{ n(total) }}</span>\n </neon-inline>\n <neon-stack class=\"neon-card-list__cards\" gap=\"z\">\n <transition-group mode=\"out-in\" name=\"neon-fade-transition\" tag=\"div\">\n <template v-for=\"(item, index) in items\">\n <neon-link\n v-if=\"item.href && !item.disabled\"\n :key=\"`${item.model.id ?? index}-link`\"\n :class=\"color && `neon-card-list__link--${color}`\"\n :href=\"item.href\"\n class=\"neon-card-list__link\"\n no-style\n outline-style=\"background\"\n >\n <div class=\"neon-card-list__card\">\n <!-- @slot slot for rendering card contents, two parameters are available:\n @binding {T} model - the model item to be rendered\n @binding {number} index - the index of the item in the list -->\n <slot name=\"card\" v-bind=\"{ model: item.model, index: index }\"></slot>\n </div>\n </neon-link>\n <neon-selectable-card\n v-else-if=\"selectable\"\n :key=\"`${item.model.id ?? index}-selectable`\"\n :class=\"{\n 'neon-card-list__card--disabled': item.disabled,\n 'neon-card-list__card--selected': item.selected,\n }\"\n :disabled=\"item.disabled\"\n :model-value=\"!!item.selected\"\n class=\"neon-card-list__card neon-card-list__card--selectable\"\n @update:model-value=\"emit('toggleSelected', item.model.id, $event)\"\n >\n <!-- @slot slot for rendering card contents, two parameters are available:\n @binding {T} model - the model item to be rendered\n @binding {number} index - the index of the item in the list -->\n <slot name=\"card\" v-bind=\"{ model: item.model, index: index }\"></slot>\n </neon-selectable-card>\n <div\n v-else\n :key=\"`${item.model.id ?? index}-link`\"\n :class=\"{ 'neon-card-list__card--disabled': item.disabled }\"\n class=\"neon-card-list__card\"\n >\n <!-- @slot slot for rendering card contents, two parameters are available:\n @binding {T} model - the model item to be rendered\n @binding {number} index - the index of the item in the list -->\n <slot name=\"card\" v-bind=\"{ model: item.model, index: index }\"></slot>\n </div>\n </template>\n </transition-group>\n </neon-stack>\n <template v-if=\"loadOnDemand\">\n <span v-if=\"items.length === total\" class=\"neon-card-list__results-end\">{{ endOfResultsLabel }}</span>\n <neon-button\n v-else\n :button-style=\"NeonButtonStyle.Text\"\n :color=\"NeonFunctionalColor.Neutral\"\n :label=\"showMoreLabel\"\n :size=\"NeonSize.Small\"\n class=\"neon-card-list__show-more\"\n @click=\"emit('show-more', $event)\"\n />\n </template>\n <neon-pagination\n v-else-if=\"pagination\"\n :color=\"color\"\n :display-first-and-last=\"pagination.displayFirstAndLast\"\n :page=\"pagination.page\"\n :page-size=\"pagination.pageSize\"\n :total=\"pagination.total\"\n :url-template=\"pagination.urlTemplate\"\n />\n </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonCardList.ts\"></script>\n"],"names":["_hoisted_1","_hoisted_3","_openBlock","_createElementBlock","_ctx","_createBlock","_component_neon_inline","_renderSlot","_hoisted_2","_toDisplayString","_createVNode","_component_neon_stack","_TransitionGroup","_Fragment","_renderList","item","index","_component_neon_link","_normalizeClass","_createElementVNode","_mergeProps","_component_neon_selectable_card","$event","_hoisted_4","_component_neon_button","_cache","_component_neon_pagination"],"mappings":"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"}
@@ -0,0 +1,2 @@
1
+ "use strict";const o=require("vue"),t=require("../../../../model/common/color/NeonFunctionalColor.cjs.js"),r=require("../../card/NeonCard.vue.cjs.js"),a=require("../../card/header/NeonCardHeader.vue.cjs.js"),s=require("../../../user-input/switch/NeonSwitch.vue.cjs.js"),i=require("../../../../model/common/responsive/NeonResponsive.cjs.js"),l=o.defineComponent({name:"NeonSelectableCard",components:{NeonCard:r,NeonCardHeader:a,NeonSwitch:s},props:{modelValue:{type:Boolean,required:!0},color:{type:String,default:t.NeonFunctionalColor.Brand},disabled:{type:Boolean,default:!1}},emits:["update:modelValue"],setup(e,{emit:n}){return{active:o.ref(!1),clicked:()=>{e.disabled||n("update:modelValue",!e.modelValue)},NeonResponsive:i.NeonResponsive}}});module.exports=l;
2
+ //# sourceMappingURL=NeonSelectableCard.cjs.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"NeonSelectableCard.cjs.js","sources":["../../../../../src/components/layout/card-list/selectable-card/NeonSelectableCard.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { defineComponent, ref } from 'vue';\nimport { NeonFunctionalColor } from '@/model/common/color/NeonFunctionalColor';\nimport NeonCard from '@/components/layout/card/NeonCard.vue';\nimport NeonCardHeader from '@/components/layout/card/header/NeonCardHeader.vue';\nimport NeonSwitch from '@/components/user-input/switch/NeonSwitch.vue';\nimport { NeonResponsive } from '@/model/common/responsive/NeonResponsive';\n\n/**\n * <p>\n * INTERNAL USE ONLY: <strong>NeonSelectableCard</strong> is a horizontal card that is selectable by clicking on it.\n * NOTE: do not use this component directly, prefer to use the <a href=\"/layout/card-list\">NeonCardList</a> setting\n * selectable=true. NeonCardList uses NeonSelectableCard internally.\n * </p>\n */\nexport default defineComponent({\n name: 'NeonSelectableCard',\n components: {\n NeonCard,\n NeonCardHeader,\n NeonSwitch,\n },\n props: {\n /**\n * The selected state of the card\n */\n modelValue: { type: Boolean, required: true },\n /**\n * The selection color. This will be used for the checkbox as well as borders & the background color\n */\n color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Brand },\n /**\n * The disabled state of the card.\n */\n disabled: { type: Boolean, default: false },\n },\n emits: [\n /**\n * Emitted when the user clicks on the card, toggling the selection state.\n * @type {boolean} the current selection state of the card.\n */\n 'update:modelValue',\n ],\n setup(props, { emit }) {\n const active = ref<boolean>(false);\n const clicked = () => {\n if (!props.disabled) {\n emit('update:modelValue', !props.modelValue);\n }\n };\n\n return {\n active,\n clicked,\n NeonResponsive,\n };\n },\n});\n"],"names":["_sfc_main","defineComponent","NeonCard","NeonCardHeader","NeonSwitch","NeonFunctionalColor","props","emit","ref","NeonResponsive"],"mappings":"qVAcAA,EAAeC,kBAAgB,CAC7B,KAAM,qBACN,WAAY,CACV,SAAAC,EACA,eAAAC,EACA,WAAAC,CAAA,EAEF,MAAO,CAIL,WAAY,CAAE,KAAM,QAAS,SAAU,EAAA,EAIvC,MAAO,CAAE,KAAM,OAAqC,QAASC,EAAAA,oBAAoB,KAAA,EAIjF,SAAU,CAAE,KAAM,QAAS,QAAS,EAAA,CAAM,EAE5C,MAAO,CAKL,mBAAA,EAEF,MAAMC,EAAO,CAAE,KAAAC,GAAQ,CAQrB,MAAO,CACL,OARaC,EAAAA,IAAa,EAAK,EAS/B,QARc,IAAM,CACfF,EAAM,UACTC,EAAK,oBAAqB,CAACD,EAAM,UAAU,CAE/C,EAIE,eACAG,EAAAA,cAAA,CAEJ,CACF,CAAC"}
@@ -1,30 +1,25 @@
1
- import { defineComponent as t, ref as r } from "vue";
2
- import { NeonSize as a } from "../../../model/common/size/NeonSize.es.js";
3
- import { NeonFunctionalColor as l } from "../../../model/common/color/NeonFunctionalColor.es.js";
4
- import n from "../../layout/card/NeonCard.vue.es.js";
5
- import i from "../../layout/card/header/NeonCardHeader.vue.es.js";
6
- import m from "../switch/NeonSwitch.vue.es.js";
7
- import { NeonResponsive as d } from "../../../model/common/responsive/NeonResponsive.es.js";
1
+ import { defineComponent as t, ref as a } from "vue";
2
+ import { NeonFunctionalColor as r } from "../../../../model/common/color/NeonFunctionalColor.es.js";
3
+ import l from "../../card/NeonCard.vue.es.js";
4
+ import n from "../../card/header/NeonCardHeader.vue.es.js";
5
+ import d from "../../../user-input/switch/NeonSwitch.vue.es.js";
6
+ import { NeonResponsive as i } from "../../../../model/common/responsive/NeonResponsive.es.js";
8
7
  const V = t({
9
8
  name: "NeonSelectableCard",
10
9
  components: {
11
- NeonCard: n,
12
- NeonCardHeader: i,
13
- NeonSwitch: m
10
+ NeonCard: l,
11
+ NeonCardHeader: n,
12
+ NeonSwitch: d
14
13
  },
15
14
  props: {
16
15
  /**
17
16
  * The selected state of the card
18
17
  */
19
18
  modelValue: { type: Boolean, required: !0 },
20
- /**
21
- * The size of the card.
22
- */
23
- size: { type: String, default: a.Small },
24
19
  /**
25
20
  * The selection color. This will be used for the checkbox as well as borders & the background color
26
21
  */
27
- color: { type: String, default: l.Brand },
22
+ color: { type: String, default: r.Brand },
28
23
  /**
29
24
  * The disabled state of the card.
30
25
  */
@@ -39,11 +34,11 @@ const V = t({
39
34
  ],
40
35
  setup(e, { emit: o }) {
41
36
  return {
42
- active: r(!1),
37
+ active: a(!1),
43
38
  clicked: () => {
44
39
  e.disabled || o("update:modelValue", !e.modelValue);
45
40
  },
46
- NeonResponsive: d
41
+ NeonResponsive: i
47
42
  };
48
43
  }
49
44
  });
@@ -0,0 +1 @@
1
+ {"version":3,"file":"NeonSelectableCard.es.js","sources":["../../../../../src/components/layout/card-list/selectable-card/NeonSelectableCard.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { defineComponent, ref } from 'vue';\nimport { NeonFunctionalColor } from '@/model/common/color/NeonFunctionalColor';\nimport NeonCard from '@/components/layout/card/NeonCard.vue';\nimport NeonCardHeader from '@/components/layout/card/header/NeonCardHeader.vue';\nimport NeonSwitch from '@/components/user-input/switch/NeonSwitch.vue';\nimport { NeonResponsive } from '@/model/common/responsive/NeonResponsive';\n\n/**\n * <p>\n * INTERNAL USE ONLY: <strong>NeonSelectableCard</strong> is a horizontal card that is selectable by clicking on it.\n * NOTE: do not use this component directly, prefer to use the <a href=\"/layout/card-list\">NeonCardList</a> setting\n * selectable=true. NeonCardList uses NeonSelectableCard internally.\n * </p>\n */\nexport default defineComponent({\n name: 'NeonSelectableCard',\n components: {\n NeonCard,\n NeonCardHeader,\n NeonSwitch,\n },\n props: {\n /**\n * The selected state of the card\n */\n modelValue: { type: Boolean, required: true },\n /**\n * The selection color. This will be used for the checkbox as well as borders & the background color\n */\n color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Brand },\n /**\n * The disabled state of the card.\n */\n disabled: { type: Boolean, default: false },\n },\n emits: [\n /**\n * Emitted when the user clicks on the card, toggling the selection state.\n * @type {boolean} the current selection state of the card.\n */\n 'update:modelValue',\n ],\n setup(props, { emit }) {\n const active = ref<boolean>(false);\n const clicked = () => {\n if (!props.disabled) {\n emit('update:modelValue', !props.modelValue);\n }\n };\n\n return {\n active,\n clicked,\n NeonResponsive,\n };\n },\n});\n"],"names":["_sfc_main","defineComponent","NeonCard","NeonCardHeader","NeonSwitch","NeonFunctionalColor","props","emit","ref","NeonResponsive"],"mappings":";;;;;;AAcA,MAAAA,IAAeC,EAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV,UAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,YAAAC;AAAA,EAAA;AAAA,EAEF,OAAO;AAAA;AAAA;AAAA;AAAA,IAIL,YAAY,EAAE,MAAM,SAAS,UAAU,GAAA;AAAA;AAAA;AAAA;AAAA,IAIvC,OAAO,EAAE,MAAM,QAAqC,SAASC,EAAoB,MAAA;AAAA;AAAA;AAAA;AAAA,IAIjF,UAAU,EAAE,MAAM,SAAS,SAAS,GAAA;AAAA,EAAM;AAAA,EAE5C,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKL;AAAA,EAAA;AAAA,EAEF,MAAMC,GAAO,EAAE,MAAAC,KAAQ;AAQrB,WAAO;AAAA,MACL,QARaC,EAAa,EAAK;AAAA,MAS/B,SARc,MAAM;AACpB,QAAKF,EAAM,YACTC,EAAK,qBAAqB,CAACD,EAAM,UAAU;AAAA,MAE/C;AAAA,MAKE,gBAAAG;AAAA,IAAA;AAAA,EAEJ;AACF,CAAC;"}
@@ -0,0 +1,2 @@
1
+ "use strict";const d=require("./NeonSelectableCard.cjs.js"),e=require("vue"),a=require("../../../../_virtual/_plugin-vue_export-helper.cjs.js");function i(o,n,p,u,b,v){const t=e.resolveComponent("neon-switch"),r=e.resolveComponent("neon-card-header"),s=e.resolveComponent("neon-card");return e.openBlock(),e.createBlock(s,{class:e.normalizeClass([[`neon-selectable-card--${o.color}`,{"neon-selectable-card--selected":o.modelValue},{"neon-selectable-card--disabled":o.disabled}],"neon-selectable-card"]),"horizontal-borders":!1,"no-break":!0,tabindex:o.disabled?-1:0,orientation:"horizontal",size:"s",onClick:n[1]||(n[1]=l=>o.clicked()),onKeydown:[n[2]||(n[2]=e.withKeys(e.withModifiers(l=>o.clicked(),["stop","prevent"]),["enter"])),n[3]||(n[3]=e.withKeys(e.withModifiers(l=>o.clicked(),["stop","prevent"]),["space"]))]},{default:e.withCtx(()=>[e.createVNode(r,null,{default:e.withCtx(()=>[e.createVNode(t,{color:o.color,disabled:o.disabled,"model-value":o.modelValue,class:"neon-selectable-card__checkbox","switch-style":"checkbox","onUpdate:modelValue":n[0]||(n[0]=l=>o.clicked())},null,8,["color","disabled","model-value"])]),_:1}),e.renderSlot(o.$slots,"default")]),_:3},8,["class","tabindex"])}const c=a(d,[["render",i]]);module.exports=c;
2
+ //# sourceMappingURL=NeonSelectableCard.vue.cjs.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"NeonSelectableCard.vue.cjs.js","sources":["../../../../../src/components/layout/card-list/selectable-card/NeonSelectableCard.vue"],"sourcesContent":["<template>\n <neon-card\n :class=\"[\n `neon-selectable-card--${color}`,\n { 'neon-selectable-card--selected': modelValue },\n { 'neon-selectable-card--disabled': disabled },\n ]\"\n :horizontal-borders=\"false\"\n :no-break=\"true\"\n :tabindex=\"disabled ? -1 : 0\"\n class=\"neon-selectable-card\"\n orientation=\"horizontal\"\n size=\"s\"\n @click=\"clicked()\"\n @keydown.enter.stop.prevent=\"clicked()\"\n @keydown.space.stop.prevent=\"clicked()\"\n >\n <neon-card-header>\n <neon-switch\n :color=\"color\"\n :disabled=\"disabled\"\n :model-value=\"modelValue\"\n class=\"neon-selectable-card__checkbox\"\n switch-style=\"checkbox\"\n @update:modelValue=\"clicked()\"\n />\n </neon-card-header>\n <!-- @slot the card sections to add to the card after the checkbox -->\n <slot name=\"default\"></slot>\n </neon-card>\n</template>\n\n<script lang=\"ts\" src=\"./NeonSelectableCard.ts\" />\n"],"names":["_createBlock","_component_neon_card","_normalizeClass","_ctx","_createVNode","_component_neon_card_header","_component_neon_switch","_renderSlot"],"mappings":"kTACEA,EAAAA,YA4BYC,EAAA,CA3BT,MAAKC,EAAAA,eAAA,CAAA,0BAAmCC,EAAA,KAAK,qCAA8CA,EAAA,UAAU,oCAA8CA,EAAA,QAAQ,GAQtJ,sBAAsB,CAAA,EAH3B,qBAAoB,GACpB,WAAU,GACV,SAAUA,EAAA,SAAQ,GAAA,EAEnB,YAAY,aACZ,KAAK,IACJ,uBAAOA,EAAA,QAAO,GACd,UAAO,2CAAqBA,EAAA,QAAO,EAAA,CAAA,OAAA,SAAA,CAAA,EAAA,CAAA,OAAA,CAAA,6CACPA,EAAA,QAAO,EAAA,CAAA,OAAA,SAAA,CAAA,EAAA,CAAA,OAAA,CAAA,wBAEpC,IASmB,CATnBC,EAAAA,YASmBC,EAAA,KAAA,mBARjB,IAOE,CAPFD,EAAAA,YAOEE,EAAA,CANC,MAAOH,EAAA,MACP,SAAUA,EAAA,SACV,cAAaA,EAAA,WACd,MAAM,iCACN,eAAa,WACZ,qCAAmBA,EAAA,+DAIxBI,aAA4BJ,EAAA,OAAA,SAAA"}