@iankibetsh/shframework 0.7.2 → 0.7.4

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.
@@ -31,6 +31,38 @@
31
31
  opacity: 0.5;
32
32
  }
33
33
 
34
+ .colored-toast.swal2-icon-success {
35
+ background-color: #a5dc86 !important;
36
+ }
37
+
38
+ .colored-toast.swal2-icon-error {
39
+ background-color: #f27474 !important;
40
+ }
41
+
42
+ .colored-toast.swal2-icon-warning {
43
+ background-color: #f8bb86 !important;
44
+ }
45
+
46
+ .colored-toast.swal2-icon-info {
47
+ background-color: #3fc3ee !important;
48
+ }
49
+
50
+ .colored-toast.swal2-icon-question {
51
+ background-color: #87adbd !important;
52
+ }
53
+
54
+ .colored-toast .swal2-title {
55
+ color: white;
56
+ }
57
+
58
+ .colored-toast .swal2-close {
59
+ color: white;
60
+ }
61
+
62
+ .colored-toast .swal2-html-container {
63
+ color: white;
64
+ }
65
+
34
66
  :root {
35
67
  --ck-z-default: 10555 !important;
36
68
  --ck-z-modal: calc(var(--ck-z-default) + 999) !important;
@@ -52,6 +84,10 @@
52
84
  }
53
85
  }
54
86
 
87
+ .sh-forgot-link, .sh-register-link{
88
+ cursor: pointer;
89
+ }
90
+
55
91
  .sh-selected-item{
56
92
  line-height: unset!important;
57
93
  }
@@ -66,7 +102,3 @@
66
102
  margin-bottom: auto;
67
103
  margin-right: 0.255em;
68
104
  }
69
-
70
- .sh-forgot-link, .sh-register-link{
71
- cursor: pointer;
72
- }
package/dist/library.js CHANGED
@@ -2511,7 +2511,7 @@ script$9.__file = "src/lib/components/ShForm.vue";
2511
2511
 
2512
2512
  var script$8 = {
2513
2513
  name: 'ShCanvas',
2514
- props: ['canvasTitle', 'canvasId', 'position'],
2514
+ props: ['canvasTitle', 'canvasId', 'position','canvasSize'],
2515
2515
  components: {
2516
2516
  },
2517
2517
  data () {
@@ -2536,7 +2536,7 @@ const _hoisted_4$8 = { class: "offcanvas-body" };
2536
2536
 
2537
2537
  function render$4(_ctx, _cache, $props, $setup, $data, $options) {
2538
2538
  return (vue.openBlock(), vue.createElementBlock("div", {
2539
- class: vue.normalizeClass(["offcanvas", $data.side]),
2539
+ class: vue.normalizeClass(["offcanvas", $data.side + $props.canvasSize + '']),
2540
2540
  "data-bs-scroll": "true",
2541
2541
  tabindex: "-1",
2542
2542
  id: $props.canvasId,
@@ -2894,6 +2894,7 @@ function getMenuCount (url) {
2894
2894
  console.log(res);
2895
2895
  });
2896
2896
  }
2897
+
2897
2898
  const Toast = Swal__default["default"].mixin({
2898
2899
  toast: true,
2899
2900
  position: 'top-end',
@@ -2909,10 +2910,16 @@ const Toast = Swal__default["default"].mixin({
2909
2910
  toast.addEventListener('mouseleave', Swal__default["default"].resumeTimer);
2910
2911
  }
2911
2912
  });
2912
- function showToast (message, toastType) {
2913
+ function showToast (message, toastType, position) {
2913
2914
  if (!toastType) {
2914
2915
  toastType = 'success';
2915
2916
  }
2917
+ if(!position){
2918
+ position = window.swalPosition;
2919
+ }
2920
+ Toast.mixin({
2921
+ position: position
2922
+ });
2916
2923
  Toast.fire({
2917
2924
  icon: toastType,
2918
2925
  title: message
@@ -2978,7 +2985,7 @@ var shRepo = {
2978
2985
  var script$5 = {
2979
2986
  name: 'sh-table',
2980
2987
  props: ['endPoint', 'headers', 'pageCount', 'actions', 'hideCount', 'hideLoadMore', 'links', 'reload', 'hideSearch', 'sharedData', 'searchPlaceholder', 'event', 'displayMore', 'displayMoreBtnClass', 'moreDetailsColumns', 'moreDetailsFields', 'hasDownload', 'downloadFields', 'tableHover'],
2981
- inject: ['channel', 'global'],
2988
+ inject: ['channel'],
2982
2989
  data () {
2983
2990
  return {
2984
2991
  order_by: '',
@@ -2994,11 +3001,20 @@ var script$5 = {
2994
3001
  moreDetailsId: null,
2995
3002
  moreDetailsModel: null,
2996
3003
  downloading: false,
2997
- appUrl: window.VITE_APP_API_URL
3004
+ appUrl: window.VITE_APP_API_URL,
3005
+ hasCanvas: 0,
3006
+ selectedRecord: null
2998
3007
  }
2999
3008
  },
3000
3009
  mounted () {
3001
3010
  if (this.event) ;
3011
+ if(this.actions && this.actions.actions){
3012
+ this.actions.actions.forEach(action => {
3013
+ if(action.canvasComponent){
3014
+ this.hasCanvas = true;
3015
+ }
3016
+ });
3017
+ }
3002
3018
  },
3003
3019
  methods: {
3004
3020
  newRecordAdded: function (ev) {
@@ -3010,6 +3026,7 @@ var script$5 = {
3010
3026
  console.log(event, record);
3011
3027
  },
3012
3028
  rowSelected: function (row) {
3029
+ this.selectedRecord = row;
3013
3030
  this.$emit('rowSelected', row);
3014
3031
  },
3015
3032
  changeKey: function (key, value) {
@@ -3174,6 +3191,7 @@ var script$5 = {
3174
3191
  this.reloadData();
3175
3192
  },
3176
3193
  components: {
3194
+ ShCanvas: script$8,
3177
3195
  pagination: script$6
3178
3196
  },
3179
3197
  computed: {
@@ -3304,13 +3322,14 @@ const _hoisted_46 = {
3304
3322
  key: 0,
3305
3323
  style: {"white-space":"nowrap"}
3306
3324
  };
3307
- const _hoisted_47 = ["title", "onClick"];
3308
- const _hoisted_48 = { key: 5 };
3309
- const _hoisted_49 = {
3325
+ const _hoisted_47 = ["href"];
3326
+ const _hoisted_48 = ["title", "onClick"];
3327
+ const _hoisted_49 = { key: 5 };
3328
+ const _hoisted_50 = {
3310
3329
  key: 0,
3311
3330
  class: "text-center"
3312
3331
  };
3313
- const _hoisted_50 = /*#__PURE__*/vue.createElementVNode("div", { class: "text-center" }, [
3332
+ const _hoisted_51 = /*#__PURE__*/vue.createElementVNode("div", { class: "text-center" }, [
3314
3333
  /*#__PURE__*/vue.createElementVNode("div", {
3315
3334
  class: "spinner-border",
3316
3335
  role: "status"
@@ -3318,42 +3337,44 @@ const _hoisted_50 = /*#__PURE__*/vue.createElementVNode("div", { class: "text-ce
3318
3337
  /*#__PURE__*/vue.createElementVNode("span", { class: "visually-hidden" }, "Loading...")
3319
3338
  ])
3320
3339
  ], -1 /* HOISTED */);
3321
- const _hoisted_51 = [
3322
- _hoisted_50
3340
+ const _hoisted_52 = [
3341
+ _hoisted_51
3323
3342
  ];
3324
- const _hoisted_52 = { key: 1 };
3325
- const _hoisted_53 = {
3343
+ const _hoisted_53 = { key: 1 };
3344
+ const _hoisted_54 = {
3326
3345
  key: 2,
3327
3346
  class: "mobile-list-items"
3328
3347
  };
3329
- const _hoisted_54 = ["onClick"];
3330
- const _hoisted_55 = {
3348
+ const _hoisted_55 = ["onClick"];
3349
+ const _hoisted_56 = {
3331
3350
  key: 0,
3332
3351
  class: "mb-1 font-weight-bold text-capitalize profile-form-title"
3333
3352
  };
3334
- const _hoisted_56 = {
3353
+ const _hoisted_57 = {
3335
3354
  key: 1,
3336
3355
  class: "mb-1 font-weight-bold text-capitalize profile-form-title"
3337
3356
  };
3338
- const _hoisted_57 = {
3357
+ const _hoisted_58 = {
3339
3358
  key: 2,
3340
3359
  class: "mb-1 font-weight-bold text-capitalize profile-form-title"
3341
3360
  };
3342
- const _hoisted_58 = { key: 1 };
3343
- const _hoisted_59 = {
3361
+ const _hoisted_59 = { key: 1 };
3362
+ const _hoisted_60 = {
3344
3363
  key: 2,
3345
3364
  class: "text-primary fw-bold"
3346
3365
  };
3347
- const _hoisted_60 = ["innerHTML"];
3348
3366
  const _hoisted_61 = ["innerHTML"];
3349
3367
  const _hoisted_62 = ["innerHTML"];
3350
- const _hoisted_63 = /*#__PURE__*/vue.createElementVNode("hr", { class: "my-2" }, null, -1 /* HOISTED */);
3351
- const _hoisted_64 = { key: 0 };
3352
- const _hoisted_65 = ["title", "onClick"];
3368
+ const _hoisted_63 = ["innerHTML"];
3369
+ const _hoisted_64 = /*#__PURE__*/vue.createElementVNode("hr", { class: "my-2" }, null, -1 /* HOISTED */);
3370
+ const _hoisted_65 = { key: 0 };
3371
+ const _hoisted_66 = ["href"];
3372
+ const _hoisted_67 = ["title", "onClick"];
3353
3373
 
3354
3374
  function render$1(_ctx, _cache, $props, $setup, $data, $options) {
3355
3375
  const _component_router_link = vue.resolveComponent("router-link");
3356
3376
  const _component_pagination = vue.resolveComponent("pagination");
3377
+ const _component_sh_canvas = vue.resolveComponent("sh-canvas");
3357
3378
 
3358
3379
  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$5, [
3359
3380
  ($props.hasDownload)
@@ -3531,27 +3552,55 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
3531
3552
  ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
3532
3553
  (!act.validator || act.validator(record))
3533
3554
  ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
3534
- (act.emits)
3535
- ? (vue.openBlock(), vue.createElementBlock("button", {
3555
+ (act.canvasId)
3556
+ ? (vue.openBlock(), vue.createElementBlock("a", {
3536
3557
  key: 0,
3537
- title: act.title,
3538
- class: vue.normalizeClass(act.class ? act.class:'btn btn-default'),
3539
- onClick: $event => ($options.doEmitAction(act.emits,record))
3540
- }, vue.toDisplayString(act.label), 11 /* TEXT, CLASS, PROPS */, _hoisted_47))
3541
- : vue.createCommentVNode("v-if", true),
3542
- (!act.emits)
3543
- ? (vue.openBlock(), vue.createBlock(_component_router_link, {
3544
- key: 1,
3545
- title: act.title,
3546
- to: $options.replaceActionUrl(act.path,record),
3558
+ href: '#' + act.canvasId,
3559
+ "data-bs-toggle": "offcanvas",
3547
3560
  class: vue.normalizeClass(act.class)
3548
- }, {
3549
- default: vue.withCtx(() => [
3550
- vue.createTextVNode(vue.toDisplayString(act.label), 1 /* TEXT */)
3551
- ]),
3552
- _: 2 /* DYNAMIC */
3553
- }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["title", "to", "class"]))
3554
- : vue.createCommentVNode("v-if", true)
3561
+ }, [
3562
+ (act.icon)
3563
+ ? (vue.openBlock(), vue.createElementBlock("span", {
3564
+ key: 0,
3565
+ class: vue.normalizeClass(act.icon)
3566
+ }, null, 2 /* CLASS */))
3567
+ : vue.createCommentVNode("v-if", true),
3568
+ vue.createTextVNode(" " + vue.toDisplayString(act.label), 1 /* TEXT */)
3569
+ ], 10 /* CLASS, PROPS */, _hoisted_47))
3570
+ : (act.emits)
3571
+ ? (vue.openBlock(), vue.createElementBlock("button", {
3572
+ key: 1,
3573
+ title: act.title,
3574
+ class: vue.normalizeClass(act.class ? act.class:'btn btn-default'),
3575
+ onClick: $event => ($options.doEmitAction(act.emits,record))
3576
+ }, [
3577
+ (act.icon)
3578
+ ? (vue.openBlock(), vue.createElementBlock("span", {
3579
+ key: 0,
3580
+ class: vue.normalizeClass(act.icon)
3581
+ }, null, 2 /* CLASS */))
3582
+ : vue.createCommentVNode("v-if", true),
3583
+ vue.createTextVNode(" " + vue.toDisplayString(act.label), 1 /* TEXT */)
3584
+ ], 10 /* CLASS, PROPS */, _hoisted_48))
3585
+ : (!act.emits)
3586
+ ? (vue.openBlock(), vue.createBlock(_component_router_link, {
3587
+ key: 2,
3588
+ title: act.title,
3589
+ to: $options.replaceActionUrl(act.path,record),
3590
+ class: vue.normalizeClass(act.class)
3591
+ }, {
3592
+ default: vue.withCtx(() => [
3593
+ (act.icon)
3594
+ ? (vue.openBlock(), vue.createElementBlock("span", {
3595
+ key: 0,
3596
+ class: vue.normalizeClass(act.icon)
3597
+ }, null, 2 /* CLASS */))
3598
+ : vue.createCommentVNode("v-if", true),
3599
+ vue.createTextVNode(" " + vue.toDisplayString(act.label), 1 /* TEXT */)
3600
+ ]),
3601
+ _: 2 /* DYNAMIC */
3602
+ }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["title", "to", "class"]))
3603
+ : vue.createCommentVNode("v-if", true)
3555
3604
  ], 64 /* STABLE_FRAGMENT */))
3556
3605
  : vue.createCommentVNode("v-if", true)
3557
3606
  ], 64 /* STABLE_FRAGMENT */))
@@ -3565,15 +3614,15 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
3565
3614
  : vue.createCommentVNode("v-if", true)
3566
3615
  ])
3567
3616
  ], 2 /* CLASS */))
3568
- : (vue.openBlock(), vue.createElementBlock("div", _hoisted_48, [
3617
+ : (vue.openBlock(), vue.createElementBlock("div", _hoisted_49, [
3569
3618
  ($data.loading === 'loading')
3570
- ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_49, _hoisted_51))
3619
+ ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_50, _hoisted_52))
3571
3620
  : ($data.loading === 'error')
3572
- ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_52, [
3621
+ ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_53, [
3573
3622
  vue.createElementVNode("span", null, vue.toDisplayString($data.loading_error), 1 /* TEXT */)
3574
3623
  ]))
3575
3624
  : ($data.loading === 'done')
3576
- ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_53, [
3625
+ ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_54, [
3577
3626
  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($data.records, (record, index) => {
3578
3627
  return (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
3579
3628
  key: record.id
@@ -3588,10 +3637,10 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
3588
3637
  key: key[0]
3589
3638
  }, [
3590
3639
  (typeof key === 'string' )
3591
- ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_55, vue.toDisplayString(key.replace(/_/g, ' ')), 1 /* TEXT */))
3640
+ ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_56, vue.toDisplayString(key.replace(/_/g, ' ')), 1 /* TEXT */))
3592
3641
  : (typeof key === 'function')
3593
- ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_56, vue.toDisplayString(key(null).replace(/_/g, ' ')), 1 /* TEXT */))
3594
- : (vue.openBlock(), vue.createElementBlock("p", _hoisted_57, vue.toDisplayString(key[1].replace(/_/g, ' ')), 1 /* TEXT */)),
3642
+ ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_57, vue.toDisplayString(key(null).replace(/_/g, ' ')), 1 /* TEXT */))
3643
+ : (vue.openBlock(), vue.createElementBlock("p", _hoisted_58, vue.toDisplayString(key[1].replace(/_/g, ' ')), 1 /* TEXT */)),
3595
3644
  vue.createElementVNode("span", null, [
3596
3645
  (typeof key === 'string' && $props.links && $props.links[key])
3597
3646
  ? (vue.openBlock(), vue.createBlock(_component_router_link, {
@@ -3601,29 +3650,29 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
3601
3650
  innerHTML: record[key]
3602
3651
  }, null, 8 /* PROPS */, ["to", "class", "innerHTML"]))
3603
3652
  : ($options.getFieldType(key) === 'numeric')
3604
- ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_58, vue.toDisplayString(Intl.NumberFormat().format(record[key])), 1 /* TEXT */))
3653
+ ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_59, vue.toDisplayString(Intl.NumberFormat().format(record[key])), 1 /* TEXT */))
3605
3654
  : ($options.getFieldType(key) === 'money')
3606
- ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_59, "KES " + vue.toDisplayString(Intl.NumberFormat().format(record[key])), 1 /* TEXT */))
3655
+ ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_60, "KES " + vue.toDisplayString(Intl.NumberFormat().format(record[key])), 1 /* TEXT */))
3607
3656
  : (typeof key === 'string')
3608
3657
  ? (vue.openBlock(), vue.createElementBlock("span", {
3609
3658
  key: 3,
3610
3659
  innerHTML: record[key]
3611
- }, null, 8 /* PROPS */, _hoisted_60))
3660
+ }, null, 8 /* PROPS */, _hoisted_61))
3612
3661
  : (typeof key === 'function')
3613
3662
  ? (vue.openBlock(), vue.createElementBlock("span", {
3614
3663
  key: 4,
3615
3664
  innerHTML: key(record, index )
3616
- }, null, 8 /* PROPS */, _hoisted_61))
3665
+ }, null, 8 /* PROPS */, _hoisted_62))
3617
3666
  : (vue.openBlock(), vue.createElementBlock("span", {
3618
3667
  key: 5,
3619
3668
  innerHTML: record[key[0]]
3620
- }, null, 8 /* PROPS */, _hoisted_62))
3669
+ }, null, 8 /* PROPS */, _hoisted_63))
3621
3670
  ]),
3622
- _hoisted_63
3671
+ _hoisted_64
3623
3672
  ], 64 /* STABLE_FRAGMENT */))
3624
3673
  }), 128 /* KEYED_FRAGMENT */)),
3625
3674
  ($props.actions)
3626
- ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_64, [
3675
+ ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_65, [
3627
3676
  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($props.actions.actions, (act) => {
3628
3677
  return (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
3629
3678
  key: act.path
@@ -3632,27 +3681,55 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
3632
3681
  ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
3633
3682
  (!act.validator || act.validator(record))
3634
3683
  ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
3635
- (act.emits)
3636
- ? (vue.openBlock(), vue.createElementBlock("button", {
3684
+ (act.canvasId)
3685
+ ? (vue.openBlock(), vue.createElementBlock("a", {
3637
3686
  key: 0,
3638
- title: act.title,
3639
- class: vue.normalizeClass(act.class ? act.class:'btn btn-default'),
3640
- onClick: $event => ($options.doEmitAction(act.emits,record))
3641
- }, vue.toDisplayString(act.label), 11 /* TEXT, CLASS, PROPS */, _hoisted_65))
3642
- : vue.createCommentVNode("v-if", true),
3643
- (!act.emits)
3644
- ? (vue.openBlock(), vue.createBlock(_component_router_link, {
3645
- key: 1,
3646
- title: act.title,
3647
- to: $options.replaceActionUrl(act.path,record),
3687
+ href: '#' + act.canvasId,
3688
+ "data-bs-toggle": "offcanvas",
3648
3689
  class: vue.normalizeClass(act.class)
3649
- }, {
3650
- default: vue.withCtx(() => [
3651
- vue.createTextVNode(vue.toDisplayString(act.label), 1 /* TEXT */)
3652
- ]),
3653
- _: 2 /* DYNAMIC */
3654
- }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["title", "to", "class"]))
3655
- : vue.createCommentVNode("v-if", true)
3690
+ }, [
3691
+ (act.icon)
3692
+ ? (vue.openBlock(), vue.createElementBlock("span", {
3693
+ key: 0,
3694
+ class: vue.normalizeClass(act.icon)
3695
+ }, null, 2 /* CLASS */))
3696
+ : vue.createCommentVNode("v-if", true),
3697
+ vue.createTextVNode(" " + vue.toDisplayString(act.label), 1 /* TEXT */)
3698
+ ], 10 /* CLASS, PROPS */, _hoisted_66))
3699
+ : (act.emits)
3700
+ ? (vue.openBlock(), vue.createElementBlock("button", {
3701
+ key: 1,
3702
+ title: act.title,
3703
+ class: vue.normalizeClass(act.class ? act.class:'btn btn-default'),
3704
+ onClick: $event => ($options.doEmitAction(act.emits,record))
3705
+ }, [
3706
+ (act.icon)
3707
+ ? (vue.openBlock(), vue.createElementBlock("span", {
3708
+ key: 0,
3709
+ class: vue.normalizeClass(act.icon)
3710
+ }, null, 2 /* CLASS */))
3711
+ : vue.createCommentVNode("v-if", true),
3712
+ vue.createTextVNode(" " + vue.toDisplayString(act.label), 1 /* TEXT */)
3713
+ ], 10 /* CLASS, PROPS */, _hoisted_67))
3714
+ : (!act.emits)
3715
+ ? (vue.openBlock(), vue.createBlock(_component_router_link, {
3716
+ key: 2,
3717
+ title: act.title,
3718
+ to: $options.replaceActionUrl(act.path,record),
3719
+ class: vue.normalizeClass(act.class)
3720
+ }, {
3721
+ default: vue.withCtx(() => [
3722
+ (act.icon)
3723
+ ? (vue.openBlock(), vue.createElementBlock("span", {
3724
+ key: 0,
3725
+ class: vue.normalizeClass(act.icon)
3726
+ }, null, 2 /* CLASS */))
3727
+ : vue.createCommentVNode("v-if", true),
3728
+ vue.createTextVNode(" " + vue.toDisplayString(act.label), 1 /* TEXT */)
3729
+ ]),
3730
+ _: 2 /* DYNAMIC */
3731
+ }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["title", "to", "class"]))
3732
+ : vue.createCommentVNode("v-if", true)
3656
3733
  ], 64 /* STABLE_FRAGMENT */))
3657
3734
  : vue.createCommentVNode("v-if", true)
3658
3735
  ], 64 /* STABLE_FRAGMENT */))
@@ -3661,7 +3738,7 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
3661
3738
  }), 128 /* KEYED_FRAGMENT */))
3662
3739
  ]))
3663
3740
  : vue.createCommentVNode("v-if", true)
3664
- ], 8 /* PROPS */, _hoisted_54)
3741
+ ], 8 /* PROPS */, _hoisted_55)
3665
3742
  ], 64 /* STABLE_FRAGMENT */))
3666
3743
  }), 128 /* KEYED_FRAGMENT */))
3667
3744
  ]))
@@ -3677,6 +3754,34 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
3677
3754
  onChangeKey: $options.changeKey,
3678
3755
  "load-more": "1"
3679
3756
  }, null, 8 /* PROPS */, ["onLoadMoreRecords", "hide-load-more", "hide-count", "pagination_data", "onChangeKey"]))
3757
+ : vue.createCommentVNode("v-if", true),
3758
+ ($props.actions)
3759
+ ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 7 }, vue.renderList($props.actions.actions, (action) => {
3760
+ return (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
3761
+ key: action.label
3762
+ }, [
3763
+ (action.canvasId)
3764
+ ? (vue.openBlock(), vue.createBlock(_component_sh_canvas, {
3765
+ key: 0,
3766
+ position: action.canvasPosition,
3767
+ "canvas-size": action.canvasSize,
3768
+ "canvas-title": action.canvasTitle,
3769
+ "canvas-id": action.canvasId,
3770
+ onOffcanvasClosed: _cache[3] || (_cache[3] = $event => ($options.rowSelected(null)))
3771
+ }, {
3772
+ default: vue.withCtx(() => [
3773
+ ($data.selectedRecord)
3774
+ ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(action.canvasComponent), {
3775
+ key: 0,
3776
+ record: $data.selectedRecord
3777
+ }, null, 8 /* PROPS */, ["record"]))
3778
+ : vue.createCommentVNode("v-if", true)
3779
+ ]),
3780
+ _: 2 /* DYNAMIC */
3781
+ }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["position", "canvas-size", "canvas-title", "canvas-id"]))
3782
+ : vue.createCommentVNode("v-if", true)
3783
+ ], 64 /* STABLE_FRAGMENT */))
3784
+ }), 128 /* KEYED_FRAGMENT */))
3680
3785
  : vue.createCommentVNode("v-if", true)
3681
3786
  ]))
3682
3787
  }
@@ -3982,11 +4087,11 @@ const useUserStore = pinia.defineStore('user-store', {
3982
4087
  }
3983
4088
  });
3984
4089
 
3985
- const _hoisted_1$2 = /*#__PURE__*/vue.createElementVNode("h5", null, "Departments (updated)", -1 /* HOISTED */);
4090
+ const _hoisted_1$2 = /*#__PURE__*/vue.createElementVNode("h5", null, "Departments", -1 /* HOISTED */);
3986
4091
  const _hoisted_2$2 = {
3987
4092
  "data-bs-toggle": "modal",
3988
4093
  ref: "addDeptBtn",
3989
- href: "#department_modal",
4094
+ href: "#sh-department_modal",
3990
4095
  class: "btn btn-info btn-sm"
3991
4096
  };
3992
4097
  const _hoisted_3$2 = /*#__PURE__*/vue.createElementVNode("i", { class: "fa fa-plus" }, null, -1 /* HOISTED */);
@@ -4014,7 +4119,8 @@ vue.onMounted(() => {
4014
4119
  });
4015
4120
 
4016
4121
  function departmentAdded (response) {
4017
- this.reload += 1;
4122
+ shRepo.showToast('Department added');
4123
+ reload.value += 1;
4018
4124
  }
4019
4125
 
4020
4126
  return (_ctx, _cache) => {
@@ -4022,8 +4128,6 @@ return (_ctx, _cache) => {
4022
4128
  _hoisted_1$2,
4023
4129
  vue.createElementVNode("a", _hoisted_2$2, _hoisted_5$2, 512 /* NEED_PATCH */),
4024
4130
  vue.createVNode(script$5, {
4025
- reload: vue.unref(reload),
4026
- onRowSelected: _ctx.rowSelected,
4027
4131
  headers: ['id','name','description', 'created_at'],
4028
4132
  "end-point": "admin/departments/list",
4029
4133
  actions: {
@@ -4036,9 +4140,9 @@ return (_ctx, _cache) => {
4036
4140
  }
4037
4141
  ]
4038
4142
  }
4039
- }, null, 8 /* PROPS */, ["reload", "onRowSelected"]),
4143
+ }),
4040
4144
  vue.createVNode(script$7, {
4041
- "modal-id": "department_modal",
4145
+ "modal-id": "sh-department_modal",
4042
4146
  "modal-title": "Department Form"
4043
4147
  }, {
4044
4148
  default: vue.withCtx(() => [
@@ -4385,6 +4489,7 @@ const ShFrontend = {
4385
4489
  app.provide('sessionTimeout',options.sessionTimeout);
4386
4490
  ShStorage.setItem('sessionTimeout',options.sessionTimeout);
4387
4491
  }
4492
+ const swalPosition = options.swalPosition ?? 'top-end';
4388
4493
  const loginEndpoint = options.loginEndpoint ?? 'auth/login';
4389
4494
  const registerEndpoint = options.registerEndpoint ?? 'auth/register';
4390
4495
  const registerTitle = options.registerTitle ?? 'Create a new account';
@@ -4400,6 +4505,7 @@ const ShFrontend = {
4400
4505
  app.provide('registerSubTitle', registerSubTitle);
4401
4506
  app.provide('redirectLogin', redirectLogin);
4402
4507
  app.provide('redirectRegister', redirectRegister);
4508
+ window.swalPosition = swalPosition;
4403
4509
  if(options.router) {
4404
4510
  options.router.addRoute({
4405
4511
  path: '/sh-auth',
package/dist/library.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import Axios from 'axios';
2
2
  import moment from 'moment';
3
- import { inject, openBlock, createElementBlock, createElementVNode, createTextVNode, toDisplayString, createCommentVNode, withDirectives, Fragment, renderList, vModelSelect, vModelText, resolveComponent, withModifiers, createVNode, ref, onMounted, unref, normalizeClass, createBlock, renderSlot, createStaticVNode, withCtx, shallowRef, resolveDynamicComponent, computed, isRef, vModelCheckbox, watch, pushScopeId, popScopeId } from 'vue';
3
+ import { inject, openBlock, createElementBlock, createElementVNode, createTextVNode, toDisplayString, createCommentVNode, withDirectives, Fragment, renderList, vModelSelect, vModelText, resolveComponent, withModifiers, createVNode, ref, onMounted, unref, normalizeClass, createBlock, renderSlot, createStaticVNode, withCtx, resolveDynamicComponent, shallowRef, computed, isRef, vModelCheckbox, watch, pushScopeId, popScopeId } from 'vue';
4
4
  import NProgress from 'nprogress';
5
5
  import Editor from '@tinymce/tinymce-vue';
6
6
  import Swal from 'sweetalert2';
@@ -2499,7 +2499,7 @@ script$9.__file = "src/lib/components/ShForm.vue";
2499
2499
 
2500
2500
  var script$8 = {
2501
2501
  name: 'ShCanvas',
2502
- props: ['canvasTitle', 'canvasId', 'position'],
2502
+ props: ['canvasTitle', 'canvasId', 'position','canvasSize'],
2503
2503
  components: {
2504
2504
  },
2505
2505
  data () {
@@ -2524,7 +2524,7 @@ const _hoisted_4$8 = { class: "offcanvas-body" };
2524
2524
 
2525
2525
  function render$4(_ctx, _cache, $props, $setup, $data, $options) {
2526
2526
  return (openBlock(), createElementBlock("div", {
2527
- class: normalizeClass(["offcanvas", $data.side]),
2527
+ class: normalizeClass(["offcanvas", $data.side + $props.canvasSize + '']),
2528
2528
  "data-bs-scroll": "true",
2529
2529
  tabindex: "-1",
2530
2530
  id: $props.canvasId,
@@ -2882,6 +2882,7 @@ function getMenuCount (url) {
2882
2882
  console.log(res);
2883
2883
  });
2884
2884
  }
2885
+
2885
2886
  const Toast = Swal.mixin({
2886
2887
  toast: true,
2887
2888
  position: 'top-end',
@@ -2897,10 +2898,16 @@ const Toast = Swal.mixin({
2897
2898
  toast.addEventListener('mouseleave', Swal.resumeTimer);
2898
2899
  }
2899
2900
  });
2900
- function showToast (message, toastType) {
2901
+ function showToast (message, toastType, position) {
2901
2902
  if (!toastType) {
2902
2903
  toastType = 'success';
2903
2904
  }
2905
+ if(!position){
2906
+ position = window.swalPosition;
2907
+ }
2908
+ Toast.mixin({
2909
+ position: position
2910
+ });
2904
2911
  Toast.fire({
2905
2912
  icon: toastType,
2906
2913
  title: message
@@ -2966,7 +2973,7 @@ var shRepo = {
2966
2973
  var script$5 = {
2967
2974
  name: 'sh-table',
2968
2975
  props: ['endPoint', 'headers', 'pageCount', 'actions', 'hideCount', 'hideLoadMore', 'links', 'reload', 'hideSearch', 'sharedData', 'searchPlaceholder', 'event', 'displayMore', 'displayMoreBtnClass', 'moreDetailsColumns', 'moreDetailsFields', 'hasDownload', 'downloadFields', 'tableHover'],
2969
- inject: ['channel', 'global'],
2976
+ inject: ['channel'],
2970
2977
  data () {
2971
2978
  return {
2972
2979
  order_by: '',
@@ -2982,11 +2989,20 @@ var script$5 = {
2982
2989
  moreDetailsId: null,
2983
2990
  moreDetailsModel: null,
2984
2991
  downloading: false,
2985
- appUrl: window.VITE_APP_API_URL
2992
+ appUrl: window.VITE_APP_API_URL,
2993
+ hasCanvas: 0,
2994
+ selectedRecord: null
2986
2995
  }
2987
2996
  },
2988
2997
  mounted () {
2989
2998
  if (this.event) ;
2999
+ if(this.actions && this.actions.actions){
3000
+ this.actions.actions.forEach(action => {
3001
+ if(action.canvasComponent){
3002
+ this.hasCanvas = true;
3003
+ }
3004
+ });
3005
+ }
2990
3006
  },
2991
3007
  methods: {
2992
3008
  newRecordAdded: function (ev) {
@@ -2998,6 +3014,7 @@ var script$5 = {
2998
3014
  console.log(event, record);
2999
3015
  },
3000
3016
  rowSelected: function (row) {
3017
+ this.selectedRecord = row;
3001
3018
  this.$emit('rowSelected', row);
3002
3019
  },
3003
3020
  changeKey: function (key, value) {
@@ -3162,6 +3179,7 @@ var script$5 = {
3162
3179
  this.reloadData();
3163
3180
  },
3164
3181
  components: {
3182
+ ShCanvas: script$8,
3165
3183
  pagination: script$6
3166
3184
  },
3167
3185
  computed: {
@@ -3292,13 +3310,14 @@ const _hoisted_46 = {
3292
3310
  key: 0,
3293
3311
  style: {"white-space":"nowrap"}
3294
3312
  };
3295
- const _hoisted_47 = ["title", "onClick"];
3296
- const _hoisted_48 = { key: 5 };
3297
- const _hoisted_49 = {
3313
+ const _hoisted_47 = ["href"];
3314
+ const _hoisted_48 = ["title", "onClick"];
3315
+ const _hoisted_49 = { key: 5 };
3316
+ const _hoisted_50 = {
3298
3317
  key: 0,
3299
3318
  class: "text-center"
3300
3319
  };
3301
- const _hoisted_50 = /*#__PURE__*/createElementVNode("div", { class: "text-center" }, [
3320
+ const _hoisted_51 = /*#__PURE__*/createElementVNode("div", { class: "text-center" }, [
3302
3321
  /*#__PURE__*/createElementVNode("div", {
3303
3322
  class: "spinner-border",
3304
3323
  role: "status"
@@ -3306,42 +3325,44 @@ const _hoisted_50 = /*#__PURE__*/createElementVNode("div", { class: "text-center
3306
3325
  /*#__PURE__*/createElementVNode("span", { class: "visually-hidden" }, "Loading...")
3307
3326
  ])
3308
3327
  ], -1 /* HOISTED */);
3309
- const _hoisted_51 = [
3310
- _hoisted_50
3328
+ const _hoisted_52 = [
3329
+ _hoisted_51
3311
3330
  ];
3312
- const _hoisted_52 = { key: 1 };
3313
- const _hoisted_53 = {
3331
+ const _hoisted_53 = { key: 1 };
3332
+ const _hoisted_54 = {
3314
3333
  key: 2,
3315
3334
  class: "mobile-list-items"
3316
3335
  };
3317
- const _hoisted_54 = ["onClick"];
3318
- const _hoisted_55 = {
3336
+ const _hoisted_55 = ["onClick"];
3337
+ const _hoisted_56 = {
3319
3338
  key: 0,
3320
3339
  class: "mb-1 font-weight-bold text-capitalize profile-form-title"
3321
3340
  };
3322
- const _hoisted_56 = {
3341
+ const _hoisted_57 = {
3323
3342
  key: 1,
3324
3343
  class: "mb-1 font-weight-bold text-capitalize profile-form-title"
3325
3344
  };
3326
- const _hoisted_57 = {
3345
+ const _hoisted_58 = {
3327
3346
  key: 2,
3328
3347
  class: "mb-1 font-weight-bold text-capitalize profile-form-title"
3329
3348
  };
3330
- const _hoisted_58 = { key: 1 };
3331
- const _hoisted_59 = {
3349
+ const _hoisted_59 = { key: 1 };
3350
+ const _hoisted_60 = {
3332
3351
  key: 2,
3333
3352
  class: "text-primary fw-bold"
3334
3353
  };
3335
- const _hoisted_60 = ["innerHTML"];
3336
3354
  const _hoisted_61 = ["innerHTML"];
3337
3355
  const _hoisted_62 = ["innerHTML"];
3338
- const _hoisted_63 = /*#__PURE__*/createElementVNode("hr", { class: "my-2" }, null, -1 /* HOISTED */);
3339
- const _hoisted_64 = { key: 0 };
3340
- const _hoisted_65 = ["title", "onClick"];
3356
+ const _hoisted_63 = ["innerHTML"];
3357
+ const _hoisted_64 = /*#__PURE__*/createElementVNode("hr", { class: "my-2" }, null, -1 /* HOISTED */);
3358
+ const _hoisted_65 = { key: 0 };
3359
+ const _hoisted_66 = ["href"];
3360
+ const _hoisted_67 = ["title", "onClick"];
3341
3361
 
3342
3362
  function render$1(_ctx, _cache, $props, $setup, $data, $options) {
3343
3363
  const _component_router_link = resolveComponent("router-link");
3344
3364
  const _component_pagination = resolveComponent("pagination");
3365
+ const _component_sh_canvas = resolveComponent("sh-canvas");
3345
3366
 
3346
3367
  return (openBlock(), createElementBlock("div", _hoisted_1$5, [
3347
3368
  ($props.hasDownload)
@@ -3519,27 +3540,55 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
3519
3540
  ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
3520
3541
  (!act.validator || act.validator(record))
3521
3542
  ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
3522
- (act.emits)
3523
- ? (openBlock(), createElementBlock("button", {
3543
+ (act.canvasId)
3544
+ ? (openBlock(), createElementBlock("a", {
3524
3545
  key: 0,
3525
- title: act.title,
3526
- class: normalizeClass(act.class ? act.class:'btn btn-default'),
3527
- onClick: $event => ($options.doEmitAction(act.emits,record))
3528
- }, toDisplayString(act.label), 11 /* TEXT, CLASS, PROPS */, _hoisted_47))
3529
- : createCommentVNode("v-if", true),
3530
- (!act.emits)
3531
- ? (openBlock(), createBlock(_component_router_link, {
3532
- key: 1,
3533
- title: act.title,
3534
- to: $options.replaceActionUrl(act.path,record),
3546
+ href: '#' + act.canvasId,
3547
+ "data-bs-toggle": "offcanvas",
3535
3548
  class: normalizeClass(act.class)
3536
- }, {
3537
- default: withCtx(() => [
3538
- createTextVNode(toDisplayString(act.label), 1 /* TEXT */)
3539
- ]),
3540
- _: 2 /* DYNAMIC */
3541
- }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["title", "to", "class"]))
3542
- : createCommentVNode("v-if", true)
3549
+ }, [
3550
+ (act.icon)
3551
+ ? (openBlock(), createElementBlock("span", {
3552
+ key: 0,
3553
+ class: normalizeClass(act.icon)
3554
+ }, null, 2 /* CLASS */))
3555
+ : createCommentVNode("v-if", true),
3556
+ createTextVNode(" " + toDisplayString(act.label), 1 /* TEXT */)
3557
+ ], 10 /* CLASS, PROPS */, _hoisted_47))
3558
+ : (act.emits)
3559
+ ? (openBlock(), createElementBlock("button", {
3560
+ key: 1,
3561
+ title: act.title,
3562
+ class: normalizeClass(act.class ? act.class:'btn btn-default'),
3563
+ onClick: $event => ($options.doEmitAction(act.emits,record))
3564
+ }, [
3565
+ (act.icon)
3566
+ ? (openBlock(), createElementBlock("span", {
3567
+ key: 0,
3568
+ class: normalizeClass(act.icon)
3569
+ }, null, 2 /* CLASS */))
3570
+ : createCommentVNode("v-if", true),
3571
+ createTextVNode(" " + toDisplayString(act.label), 1 /* TEXT */)
3572
+ ], 10 /* CLASS, PROPS */, _hoisted_48))
3573
+ : (!act.emits)
3574
+ ? (openBlock(), createBlock(_component_router_link, {
3575
+ key: 2,
3576
+ title: act.title,
3577
+ to: $options.replaceActionUrl(act.path,record),
3578
+ class: normalizeClass(act.class)
3579
+ }, {
3580
+ default: withCtx(() => [
3581
+ (act.icon)
3582
+ ? (openBlock(), createElementBlock("span", {
3583
+ key: 0,
3584
+ class: normalizeClass(act.icon)
3585
+ }, null, 2 /* CLASS */))
3586
+ : createCommentVNode("v-if", true),
3587
+ createTextVNode(" " + toDisplayString(act.label), 1 /* TEXT */)
3588
+ ]),
3589
+ _: 2 /* DYNAMIC */
3590
+ }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["title", "to", "class"]))
3591
+ : createCommentVNode("v-if", true)
3543
3592
  ], 64 /* STABLE_FRAGMENT */))
3544
3593
  : createCommentVNode("v-if", true)
3545
3594
  ], 64 /* STABLE_FRAGMENT */))
@@ -3553,15 +3602,15 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
3553
3602
  : createCommentVNode("v-if", true)
3554
3603
  ])
3555
3604
  ], 2 /* CLASS */))
3556
- : (openBlock(), createElementBlock("div", _hoisted_48, [
3605
+ : (openBlock(), createElementBlock("div", _hoisted_49, [
3557
3606
  ($data.loading === 'loading')
3558
- ? (openBlock(), createElementBlock("div", _hoisted_49, _hoisted_51))
3607
+ ? (openBlock(), createElementBlock("div", _hoisted_50, _hoisted_52))
3559
3608
  : ($data.loading === 'error')
3560
- ? (openBlock(), createElementBlock("div", _hoisted_52, [
3609
+ ? (openBlock(), createElementBlock("div", _hoisted_53, [
3561
3610
  createElementVNode("span", null, toDisplayString($data.loading_error), 1 /* TEXT */)
3562
3611
  ]))
3563
3612
  : ($data.loading === 'done')
3564
- ? (openBlock(), createElementBlock("div", _hoisted_53, [
3613
+ ? (openBlock(), createElementBlock("div", _hoisted_54, [
3565
3614
  (openBlock(true), createElementBlock(Fragment, null, renderList($data.records, (record, index) => {
3566
3615
  return (openBlock(), createElementBlock(Fragment, {
3567
3616
  key: record.id
@@ -3576,10 +3625,10 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
3576
3625
  key: key[0]
3577
3626
  }, [
3578
3627
  (typeof key === 'string' )
3579
- ? (openBlock(), createElementBlock("p", _hoisted_55, toDisplayString(key.replace(/_/g, ' ')), 1 /* TEXT */))
3628
+ ? (openBlock(), createElementBlock("p", _hoisted_56, toDisplayString(key.replace(/_/g, ' ')), 1 /* TEXT */))
3580
3629
  : (typeof key === 'function')
3581
- ? (openBlock(), createElementBlock("p", _hoisted_56, toDisplayString(key(null).replace(/_/g, ' ')), 1 /* TEXT */))
3582
- : (openBlock(), createElementBlock("p", _hoisted_57, toDisplayString(key[1].replace(/_/g, ' ')), 1 /* TEXT */)),
3630
+ ? (openBlock(), createElementBlock("p", _hoisted_57, toDisplayString(key(null).replace(/_/g, ' ')), 1 /* TEXT */))
3631
+ : (openBlock(), createElementBlock("p", _hoisted_58, toDisplayString(key[1].replace(/_/g, ' ')), 1 /* TEXT */)),
3583
3632
  createElementVNode("span", null, [
3584
3633
  (typeof key === 'string' && $props.links && $props.links[key])
3585
3634
  ? (openBlock(), createBlock(_component_router_link, {
@@ -3589,29 +3638,29 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
3589
3638
  innerHTML: record[key]
3590
3639
  }, null, 8 /* PROPS */, ["to", "class", "innerHTML"]))
3591
3640
  : ($options.getFieldType(key) === 'numeric')
3592
- ? (openBlock(), createElementBlock("span", _hoisted_58, toDisplayString(Intl.NumberFormat().format(record[key])), 1 /* TEXT */))
3641
+ ? (openBlock(), createElementBlock("span", _hoisted_59, toDisplayString(Intl.NumberFormat().format(record[key])), 1 /* TEXT */))
3593
3642
  : ($options.getFieldType(key) === 'money')
3594
- ? (openBlock(), createElementBlock("span", _hoisted_59, "KES " + toDisplayString(Intl.NumberFormat().format(record[key])), 1 /* TEXT */))
3643
+ ? (openBlock(), createElementBlock("span", _hoisted_60, "KES " + toDisplayString(Intl.NumberFormat().format(record[key])), 1 /* TEXT */))
3595
3644
  : (typeof key === 'string')
3596
3645
  ? (openBlock(), createElementBlock("span", {
3597
3646
  key: 3,
3598
3647
  innerHTML: record[key]
3599
- }, null, 8 /* PROPS */, _hoisted_60))
3648
+ }, null, 8 /* PROPS */, _hoisted_61))
3600
3649
  : (typeof key === 'function')
3601
3650
  ? (openBlock(), createElementBlock("span", {
3602
3651
  key: 4,
3603
3652
  innerHTML: key(record, index )
3604
- }, null, 8 /* PROPS */, _hoisted_61))
3653
+ }, null, 8 /* PROPS */, _hoisted_62))
3605
3654
  : (openBlock(), createElementBlock("span", {
3606
3655
  key: 5,
3607
3656
  innerHTML: record[key[0]]
3608
- }, null, 8 /* PROPS */, _hoisted_62))
3657
+ }, null, 8 /* PROPS */, _hoisted_63))
3609
3658
  ]),
3610
- _hoisted_63
3659
+ _hoisted_64
3611
3660
  ], 64 /* STABLE_FRAGMENT */))
3612
3661
  }), 128 /* KEYED_FRAGMENT */)),
3613
3662
  ($props.actions)
3614
- ? (openBlock(), createElementBlock("div", _hoisted_64, [
3663
+ ? (openBlock(), createElementBlock("div", _hoisted_65, [
3615
3664
  (openBlock(true), createElementBlock(Fragment, null, renderList($props.actions.actions, (act) => {
3616
3665
  return (openBlock(), createElementBlock(Fragment, {
3617
3666
  key: act.path
@@ -3620,27 +3669,55 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
3620
3669
  ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
3621
3670
  (!act.validator || act.validator(record))
3622
3671
  ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
3623
- (act.emits)
3624
- ? (openBlock(), createElementBlock("button", {
3672
+ (act.canvasId)
3673
+ ? (openBlock(), createElementBlock("a", {
3625
3674
  key: 0,
3626
- title: act.title,
3627
- class: normalizeClass(act.class ? act.class:'btn btn-default'),
3628
- onClick: $event => ($options.doEmitAction(act.emits,record))
3629
- }, toDisplayString(act.label), 11 /* TEXT, CLASS, PROPS */, _hoisted_65))
3630
- : createCommentVNode("v-if", true),
3631
- (!act.emits)
3632
- ? (openBlock(), createBlock(_component_router_link, {
3633
- key: 1,
3634
- title: act.title,
3635
- to: $options.replaceActionUrl(act.path,record),
3675
+ href: '#' + act.canvasId,
3676
+ "data-bs-toggle": "offcanvas",
3636
3677
  class: normalizeClass(act.class)
3637
- }, {
3638
- default: withCtx(() => [
3639
- createTextVNode(toDisplayString(act.label), 1 /* TEXT */)
3640
- ]),
3641
- _: 2 /* DYNAMIC */
3642
- }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["title", "to", "class"]))
3643
- : createCommentVNode("v-if", true)
3678
+ }, [
3679
+ (act.icon)
3680
+ ? (openBlock(), createElementBlock("span", {
3681
+ key: 0,
3682
+ class: normalizeClass(act.icon)
3683
+ }, null, 2 /* CLASS */))
3684
+ : createCommentVNode("v-if", true),
3685
+ createTextVNode(" " + toDisplayString(act.label), 1 /* TEXT */)
3686
+ ], 10 /* CLASS, PROPS */, _hoisted_66))
3687
+ : (act.emits)
3688
+ ? (openBlock(), createElementBlock("button", {
3689
+ key: 1,
3690
+ title: act.title,
3691
+ class: normalizeClass(act.class ? act.class:'btn btn-default'),
3692
+ onClick: $event => ($options.doEmitAction(act.emits,record))
3693
+ }, [
3694
+ (act.icon)
3695
+ ? (openBlock(), createElementBlock("span", {
3696
+ key: 0,
3697
+ class: normalizeClass(act.icon)
3698
+ }, null, 2 /* CLASS */))
3699
+ : createCommentVNode("v-if", true),
3700
+ createTextVNode(" " + toDisplayString(act.label), 1 /* TEXT */)
3701
+ ], 10 /* CLASS, PROPS */, _hoisted_67))
3702
+ : (!act.emits)
3703
+ ? (openBlock(), createBlock(_component_router_link, {
3704
+ key: 2,
3705
+ title: act.title,
3706
+ to: $options.replaceActionUrl(act.path,record),
3707
+ class: normalizeClass(act.class)
3708
+ }, {
3709
+ default: withCtx(() => [
3710
+ (act.icon)
3711
+ ? (openBlock(), createElementBlock("span", {
3712
+ key: 0,
3713
+ class: normalizeClass(act.icon)
3714
+ }, null, 2 /* CLASS */))
3715
+ : createCommentVNode("v-if", true),
3716
+ createTextVNode(" " + toDisplayString(act.label), 1 /* TEXT */)
3717
+ ]),
3718
+ _: 2 /* DYNAMIC */
3719
+ }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["title", "to", "class"]))
3720
+ : createCommentVNode("v-if", true)
3644
3721
  ], 64 /* STABLE_FRAGMENT */))
3645
3722
  : createCommentVNode("v-if", true)
3646
3723
  ], 64 /* STABLE_FRAGMENT */))
@@ -3649,7 +3726,7 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
3649
3726
  }), 128 /* KEYED_FRAGMENT */))
3650
3727
  ]))
3651
3728
  : createCommentVNode("v-if", true)
3652
- ], 8 /* PROPS */, _hoisted_54)
3729
+ ], 8 /* PROPS */, _hoisted_55)
3653
3730
  ], 64 /* STABLE_FRAGMENT */))
3654
3731
  }), 128 /* KEYED_FRAGMENT */))
3655
3732
  ]))
@@ -3665,6 +3742,34 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
3665
3742
  onChangeKey: $options.changeKey,
3666
3743
  "load-more": "1"
3667
3744
  }, null, 8 /* PROPS */, ["onLoadMoreRecords", "hide-load-more", "hide-count", "pagination_data", "onChangeKey"]))
3745
+ : createCommentVNode("v-if", true),
3746
+ ($props.actions)
3747
+ ? (openBlock(true), createElementBlock(Fragment, { key: 7 }, renderList($props.actions.actions, (action) => {
3748
+ return (openBlock(), createElementBlock(Fragment, {
3749
+ key: action.label
3750
+ }, [
3751
+ (action.canvasId)
3752
+ ? (openBlock(), createBlock(_component_sh_canvas, {
3753
+ key: 0,
3754
+ position: action.canvasPosition,
3755
+ "canvas-size": action.canvasSize,
3756
+ "canvas-title": action.canvasTitle,
3757
+ "canvas-id": action.canvasId,
3758
+ onOffcanvasClosed: _cache[3] || (_cache[3] = $event => ($options.rowSelected(null)))
3759
+ }, {
3760
+ default: withCtx(() => [
3761
+ ($data.selectedRecord)
3762
+ ? (openBlock(), createBlock(resolveDynamicComponent(action.canvasComponent), {
3763
+ key: 0,
3764
+ record: $data.selectedRecord
3765
+ }, null, 8 /* PROPS */, ["record"]))
3766
+ : createCommentVNode("v-if", true)
3767
+ ]),
3768
+ _: 2 /* DYNAMIC */
3769
+ }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["position", "canvas-size", "canvas-title", "canvas-id"]))
3770
+ : createCommentVNode("v-if", true)
3771
+ ], 64 /* STABLE_FRAGMENT */))
3772
+ }), 128 /* KEYED_FRAGMENT */))
3668
3773
  : createCommentVNode("v-if", true)
3669
3774
  ]))
3670
3775
  }
@@ -3970,11 +4075,11 @@ const useUserStore = defineStore('user-store', {
3970
4075
  }
3971
4076
  });
3972
4077
 
3973
- const _hoisted_1$2 = /*#__PURE__*/createElementVNode("h5", null, "Departments (updated)", -1 /* HOISTED */);
4078
+ const _hoisted_1$2 = /*#__PURE__*/createElementVNode("h5", null, "Departments", -1 /* HOISTED */);
3974
4079
  const _hoisted_2$2 = {
3975
4080
  "data-bs-toggle": "modal",
3976
4081
  ref: "addDeptBtn",
3977
- href: "#department_modal",
4082
+ href: "#sh-department_modal",
3978
4083
  class: "btn btn-info btn-sm"
3979
4084
  };
3980
4085
  const _hoisted_3$2 = /*#__PURE__*/createElementVNode("i", { class: "fa fa-plus" }, null, -1 /* HOISTED */);
@@ -4002,7 +4107,8 @@ onMounted(() => {
4002
4107
  });
4003
4108
 
4004
4109
  function departmentAdded (response) {
4005
- this.reload += 1;
4110
+ shRepo.showToast('Department added');
4111
+ reload.value += 1;
4006
4112
  }
4007
4113
 
4008
4114
  return (_ctx, _cache) => {
@@ -4010,8 +4116,6 @@ return (_ctx, _cache) => {
4010
4116
  _hoisted_1$2,
4011
4117
  createElementVNode("a", _hoisted_2$2, _hoisted_5$2, 512 /* NEED_PATCH */),
4012
4118
  createVNode(script$5, {
4013
- reload: unref(reload),
4014
- onRowSelected: _ctx.rowSelected,
4015
4119
  headers: ['id','name','description', 'created_at'],
4016
4120
  "end-point": "admin/departments/list",
4017
4121
  actions: {
@@ -4024,9 +4128,9 @@ return (_ctx, _cache) => {
4024
4128
  }
4025
4129
  ]
4026
4130
  }
4027
- }, null, 8 /* PROPS */, ["reload", "onRowSelected"]),
4131
+ }),
4028
4132
  createVNode(script$7, {
4029
- "modal-id": "department_modal",
4133
+ "modal-id": "sh-department_modal",
4030
4134
  "modal-title": "Department Form"
4031
4135
  }, {
4032
4136
  default: withCtx(() => [
@@ -4373,6 +4477,7 @@ const ShFrontend = {
4373
4477
  app.provide('sessionTimeout',options.sessionTimeout);
4374
4478
  ShStorage.setItem('sessionTimeout',options.sessionTimeout);
4375
4479
  }
4480
+ const swalPosition = options.swalPosition ?? 'top-end';
4376
4481
  const loginEndpoint = options.loginEndpoint ?? 'auth/login';
4377
4482
  const registerEndpoint = options.registerEndpoint ?? 'auth/register';
4378
4483
  const registerTitle = options.registerTitle ?? 'Create a new account';
@@ -4388,6 +4493,7 @@ const ShFrontend = {
4388
4493
  app.provide('registerSubTitle', registerSubTitle);
4389
4494
  app.provide('redirectLogin', redirectLogin);
4390
4495
  app.provide('redirectRegister', redirectRegister);
4496
+ window.swalPosition = swalPosition;
4391
4497
  if(options.router) {
4392
4498
  options.router.addRoute({
4393
4499
  path: '/sh-auth',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@iankibetsh/shframework",
3
- "version": "0.7.2",
3
+ "version": "0.7.4",
4
4
  "description": "Vue library for handling laravel backend",
5
5
  "main": "dist/library.js",
6
6
  "module": "dist/library.mjs",
@@ -30,13 +30,11 @@
30
30
  "vue": "^3.2.37"
31
31
  },
32
32
  "devDependencies": {
33
- "@vitejs/plugin-vue": "^3.0.3",
34
33
  "rollup": "^2.75.7",
35
34
  "rollup-plugin-css-only": "^3.1.0",
36
35
  "rollup-plugin-dotenv": "^0.3.0",
37
36
  "rollup-plugin-peer-deps-external": "^2.2.4",
38
37
  "rollup-plugin-vue": "^6.0.0",
39
- "vite": "^3.0.7",
40
38
  "vuepress": "^2.0.0-beta.48"
41
39
  },
42
40
  "dependencies": {