@iankibetsh/shframework 5.9.1 → 5.9.3

package/README.md

@@ -66,6 +66,7 @@ The flagship component for generating complex forms from simple configurations.
 - **Auto-Detection**: Infers input types from field names (email, phone, date, etc.).
 - **Multi-Step Support**: Break long forms into logical steps with progress indicators.
 - **Validation**: Seamlessly handles and displays Laravel validation errors (422).
+- **Conditional Visibility**: Hide the submit button using `:hide-submit-button="true"`.
 - **Modern Reactivity**: Built using Vue 3.4's `defineModel` for clean, conflict-free two-way binding.
 
 ```html

package/dist/dist/library.mjs.css

@@ -1,36 +1,4 @@
 
-.sh-phone{
-  display: flex;
-  width: 100%;
-  align-items: center;
-  padding: 0 0.25rem;
-}
-.phone-country{
-  width: 2rem;
-  border: none;
-  align-self: center;
-  outline: none !important;
-  padding: 0.4rem;
-  border-right: 1px solid #0003;
-}
-.phone-number{
-  width: calc(100% - 2.2rem);
-  border: none;
-  align-self: center;
-  outline: none;
-  margin-bottom: 0;
-  padding: 0.4rem;
-}
-.sh-phone img{
-  padding: 0.125rem;
-  width: 2rem;
-  height: 2rem;
-}
-.phone-number::placeholder{
-  font-weight: 300;
-  opacity: 0.5;
-}
-
 /* Step Container */
 .sh-form-steps-container {
   margin-bottom: 2.5rem;
@@ -292,6 +260,38 @@
   }
 }
 
+.sh-phone{
+  display: flex;
+  width: 100%;
+  align-items: center;
+  padding: 0 0.25rem;
+}
+.phone-country{
+  width: 2rem;
+  border: none;
+  align-self: center;
+  outline: none !important;
+  padding: 0.4rem;
+  border-right: 1px solid #0003;
+}
+.phone-number{
+  width: calc(100% - 2.2rem);
+  border: none;
+  align-self: center;
+  outline: none;
+  margin-bottom: 0;
+  padding: 0.4rem;
+}
+.sh-phone img{
+  padding: 0.125rem;
+  width: 2rem;
+  height: 2rem;
+}
+.phone-number::placeholder{
+  font-weight: 300;
+  opacity: 0.5;
+}
+
 .colored-toast.swal2-icon-success {
   background-color: #a5dc86 !important;
 }
@@ -384,11 +384,6 @@
   margin-right: 0.255em;
 }
 
-.sh-checkbox-group {
-  display: flex;
-  flex-wrap: wrap;
-}
-
 .callout{
   --bs-link-color-rgb: 110,168,254;
   --bs-code-color: #e685b5;
@@ -405,6 +400,11 @@
   --bd-callout-border: var(--bs-info-border-subtle);
 }
 
+.sh-checkbox-group {
+  display: flex;
+  flex-wrap: wrap;
+}
+
 .sh-forgot-link, .sh-register-link{
   cursor: pointer;
 }

package/dist/library.js

@@ -3727,7 +3727,7 @@ var script$q = {
     type: Array,
     required: false
   },
-  hideButton: {
+  hideSubmitButton: {
     type: Boolean,
     default: false
   }
@@ -4275,7 +4275,7 @@ return (_ctx, _cache) => {
             ], 10 /* CLASS, PROPS */, _hoisted_21$1)
           ], 2 /* CLASS */))
         : vue.createCommentVNode("v-if", true),
-      (isLastStep.value && !__props.hideButton)
+      (isLastStep.value && !__props.hideSubmitButton)
         ? (vue.openBlock(), vue.createElementBlock("div", {
             key: 2,
             class: vue.normalizeClass(getElementClass('formGroup') + ' ms-auto')
@@ -4555,6 +4555,7 @@ const cleanedProp = vue.computed(()=>{
   const p = {...props};
   delete p.class;
   delete p.modalId;
+  delete p.hideButton;
   return p
 });
 
@@ -7064,13 +7065,6 @@ const getTabKey = (tab)=>{
   return tab.name || tab.key
 };
 
-const getTabPermission = tab=>{
-  if (typeof tab === 'string') {
-    return ''
-  }
-  return tab.permission
-};
-
 const getTabLabel = tab=>{
   let label = '';
   if (typeof tab === 'string') {
@@ -7084,7 +7078,6 @@ const getTabLabel = tab=>{
 return (_ctx, _cache) => {
   const _component_router_link = vue.resolveComponent("router-link");
   const _component_router_view = vue.resolveComponent("router-view");
-  const _directive_if_user_can = vue.resolveDirective("if-user-can");
 
   return (allowedTabs.value.length > 0)
     ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
@@ -7092,7 +7085,7 @@ return (_ctx, _cache) => {
           class: vue.normalizeClass(["nav nav-tabs sh-tabs", __props.classes ?? vue.unref(shRepo).getShConfig('tabsClass','sh-tabs nav-tabs-bordered')])
         }, [
           (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(allowedTabs.value, (tab) => {
-            return vue.withDirectives((vue.openBlock(), vue.createElementBlock("li", {
+            return (vue.openBlock(), vue.createElementBlock("li", {
               class: "nav-item",
               key: getTabKey(tab)
             }, [
@@ -7111,9 +7104,7 @@ return (_ctx, _cache) => {
                 ]),
                 _: 2 /* DYNAMIC */
               }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["onClick", "to", "class"])
-            ])), [
-              [_directive_if_user_can, getTabPermission(tab)]
-            ])
+            ]))
           }), 128 /* KEYED_FRAGMENT */))
         ], 2 /* CLASS */),
         vue.createElementVNode("div", {

package/dist/library.mjs

@@ -3,7 +3,7 @@ import { DateTime } from 'luxon';
 import Swal from 'sweetalert2';
 import { Modal, Offcanvas } from 'bootstrap';
 import NProgress from 'nprogress';
-import { ref, computed, watch, onMounted, openBlock, createElementBlock, createElementVNode, createTextVNode, toDisplayString, createCommentVNode, withDirectives, Fragment, renderList, unref, vModelSelect, vModelText, normalizeClass, createBlock, resolveDynamicComponent, resolveComponent, mergeModels, useModel, inject, useTemplateRef, mergeProps, vShow, renderSlot, normalizeStyle, Teleport, createVNode, withCtx, useSlots, onBeforeUnmount, reactive, vModelCheckbox, withModifiers, resolveDirective, shallowRef, markRaw, isRef } from 'vue';
+import { ref, computed, watch, onMounted, openBlock, createElementBlock, createElementVNode, createTextVNode, toDisplayString, createCommentVNode, withDirectives, Fragment, renderList, unref, vModelSelect, vModelText, normalizeClass, createBlock, resolveDynamicComponent, resolveComponent, mergeModels, useModel, inject, useTemplateRef, mergeProps, vShow, renderSlot, normalizeStyle, Teleport, createVNode, withCtx, useSlots, onBeforeUnmount, reactive, vModelCheckbox, withModifiers, shallowRef, markRaw, isRef } from 'vue';
 import _ from 'lodash';
 import { useRouter, useRoute } from 'vue-router';
 import { defineStore, storeToRefs } from 'pinia';
@@ -3716,7 +3716,7 @@ var script$q = {
     type: Array,
     required: false
   },
-  hideButton: {
+  hideSubmitButton: {
     type: Boolean,
     default: false
   }
@@ -4264,7 +4264,7 @@ return (_ctx, _cache) => {
             ], 10 /* CLASS, PROPS */, _hoisted_21$1)
           ], 2 /* CLASS */))
         : createCommentVNode("v-if", true),
-      (isLastStep.value && !__props.hideButton)
+      (isLastStep.value && !__props.hideSubmitButton)
         ? (openBlock(), createElementBlock("div", {
             key: 2,
             class: normalizeClass(getElementClass('formGroup') + ' ms-auto')
@@ -4544,6 +4544,7 @@ const cleanedProp = computed(()=>{
   const p = {...props};
   delete p.class;
   delete p.modalId;
+  delete p.hideButton;
   return p
 });
 
@@ -7053,13 +7054,6 @@ const getTabKey = (tab)=>{
   return tab.name || tab.key
 };
 
-const getTabPermission = tab=>{
-  if (typeof tab === 'string') {
-    return ''
-  }
-  return tab.permission
-};
-
 const getTabLabel = tab=>{
   let label = '';
   if (typeof tab === 'string') {
@@ -7073,7 +7067,6 @@ const getTabLabel = tab=>{
 return (_ctx, _cache) => {
   const _component_router_link = resolveComponent("router-link");
   const _component_router_view = resolveComponent("router-view");
-  const _directive_if_user_can = resolveDirective("if-user-can");
 
   return (allowedTabs.value.length > 0)
     ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
@@ -7081,7 +7074,7 @@ return (_ctx, _cache) => {
           class: normalizeClass(["nav nav-tabs sh-tabs", __props.classes ?? unref(shRepo).getShConfig('tabsClass','sh-tabs nav-tabs-bordered')])
         }, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(allowedTabs.value, (tab) => {
-            return withDirectives((openBlock(), createElementBlock("li", {
+            return (openBlock(), createElementBlock("li", {
               class: "nav-item",
               key: getTabKey(tab)
             }, [
@@ -7100,9 +7093,7 @@ return (_ctx, _cache) => {
                 ]),
                 _: 2 /* DYNAMIC */
               }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["onClick", "to", "class"])
-            ])), [
-              [_directive_if_user_can, getTabPermission(tab)]
-            ])
+            ]))
           }), 128 /* KEYED_FRAGMENT */))
         ], 2 /* CLASS */),
         createElementVNode("div", {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@iankibetsh/shframework",
-  "version": "5.9.1",
+  "version": "5.9.3",
   "description": "Vue library for handling laravel backend",
   "repository": {
     "type": "git",
@@ -59,4 +59,4 @@
     "nprogress": "^0.2.0",
     "sweetalert2": "^11"
   }
-}
+}