sprintify-ui 0.0.189 → 0.0.191

package/dist/types/src/components/BaseFieldI18n.vue.d.ts

@@ -81,9 +81,9 @@ declare const _default: import("vue").DefineComponent<{
 }>> & {
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
+    name: string;
     label: string;
     required: boolean;
-    name: string;
     modelValue: {
         [locale: string]: string | number | boolean;
     } | null;

package/dist/types/src/components/BaseInput.vue.d.ts

@@ -68,7 +68,7 @@ declare const _default: import("vue").DefineComponent<{
         type: NumberConstructor;
     };
     mask: {
-        type: (StringConstructor | ArrayConstructor | FunctionConstructor)[];
+        type: (ArrayConstructor | StringConstructor | FunctionConstructor)[];
         default(): null;
     };
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "focus" | "blur")[], "update:modelValue" | "focus" | "blur", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
@@ -140,7 +140,7 @@ declare const _default: import("vue").DefineComponent<{
         type: NumberConstructor;
     };
     mask: {
-        type: (StringConstructor | ArrayConstructor | FunctionConstructor)[];
+        type: (ArrayConstructor | StringConstructor | FunctionConstructor)[];
         default(): null;
     };
 }>> & {
@@ -148,11 +148,11 @@ declare const _default: import("vue").DefineComponent<{
     onBlur?: ((...args: any[]) => any) | undefined;
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
-    required: boolean;
     type: string;
     name: string;
     mask: string | Function | unknown[];
     step: number;
+    required: boolean;
     modelValue: string | number | null;
     placeholder: string;
     disabled: boolean;

package/dist/types/src/components/BaseInputPercent.vue.d.ts

@@ -118,9 +118,9 @@ declare const _default: import("vue").DefineComponent<{
     onBlur?: ((...args: any[]) => any) | undefined;
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
-    required: boolean;
     name: string;
     step: number;
+    required: boolean;
     icon: string;
     modelValue: string | number | null;
     placeholder: string;

package/dist/types/src/components/BaseMenu.vue.d.ts

@@ -7,7 +7,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     };
     menuClass: {
         default: string;
-        type: (ObjectConstructor | StringConstructor | ArrayConstructor)[];
+        type: (ObjectConstructor | ArrayConstructor | StringConstructor)[];
     };
     position: {
         default: string;
@@ -24,7 +24,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     };
     menuClass: {
         default: string;
-        type: (ObjectConstructor | StringConstructor | ArrayConstructor)[];
+        type: (ObjectConstructor | ArrayConstructor | StringConstructor)[];
     };
     position: {
         default: string;
@@ -37,7 +37,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
 }>>, {
     size: "xs" | "sm" | "md";
     items: MenuItemInterface[];
-    menuClass: string | Record<string, any> | unknown[];
+    menuClass: string | unknown[] | Record<string, any>;
     position: "custom" | "bottom-left" | "bottom-right";
 }>, {
     button: (_: {

package/dist/types/src/components/BaseMenuItem.vue.d.ts

@@ -18,7 +18,7 @@ declare const _default: import("vue").DefineComponent<{
     };
     color: {
         default: string;
-        type: PropType<"dark" | "light" | "danger" | "success" | "warning">;
+        type: PropType<"success" | "danger" | "warning" | "dark" | "light">;
     };
     size: {
         default: string;
@@ -43,7 +43,7 @@ declare const _default: import("vue").DefineComponent<{
     };
     color: {
         default: string;
-        type: PropType<"dark" | "light" | "danger" | "success" | "warning">;
+        type: PropType<"success" | "danger" | "warning" | "dark" | "light">;
     };
     size: {
         default: string;
@@ -52,7 +52,7 @@ declare const _default: import("vue").DefineComponent<{
 }>>, {
     label: string;
     active: boolean;
-    color: "dark" | "light" | "danger" | "success" | "warning";
+    color: "success" | "danger" | "warning" | "dark" | "light";
     icon: string;
     count: number;
     size: "xs" | "sm" | "md";

package/dist/types/src/components/BaseNavbarItemContent.vue.d.ts

@@ -41,10 +41,10 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
     };
 }>>, {
-    dark: boolean;
     label: string;
     active: boolean;
     icon: string;
     count: number;
+    dark: boolean;
 }>;
 export default _default;

package/dist/types/src/components/BaseNavbarSideItemContent.vue.d.ts

@@ -41,10 +41,10 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
     };
 }>>, {
-    dark: boolean;
     label: string;
     active: boolean;
     icon: string;
     count: number;
+    dark: boolean;
 }>;
 export default _default;

package/dist/types/src/components/BaseNumber.vue.d.ts

@@ -45,7 +45,7 @@ declare const _default: import("vue").DefineComponent<{
     };
     rounded: {
         default: string;
-        type: PropType<"left" | "right" | "full" | "none">;
+        type: PropType<"full" | "left" | "right" | "none">;
     };
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "focus" | "blur" | "keydown")[], "update:modelValue" | "focus" | "blur" | "keydown", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     modelValue: {
@@ -93,7 +93,7 @@ declare const _default: import("vue").DefineComponent<{
     };
     rounded: {
         default: string;
-        type: PropType<"left" | "right" | "full" | "none">;
+        type: PropType<"full" | "left" | "right" | "none">;
     };
 }>> & {
     onFocus?: ((...args: any[]) => any) | undefined;
@@ -101,9 +101,9 @@ declare const _default: import("vue").DefineComponent<{
     onKeydown?: ((...args: any[]) => any) | undefined;
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
-    required: boolean;
     name: string;
     step: number;
+    required: boolean;
     modelValue: number | null;
     placeholder: string;
     disabled: boolean;
@@ -111,6 +111,6 @@ declare const _default: import("vue").DefineComponent<{
     max: number;
     hasError: boolean;
     borderless: boolean;
-    rounded: "left" | "right" | "full" | "none";
+    rounded: "full" | "left" | "right" | "none";
 }>;
 export default _default;

package/dist/types/src/components/BasePassword.vue.d.ts

@@ -52,8 +52,8 @@ declare const _default: import("vue").DefineComponent<{
 }>> & {
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
-    required: boolean;
     name: string;
+    required: boolean;
     modelValue: string | null;
     placeholder: string;
     disabled: boolean;

package/dist/types/src/components/BaseRadioGroup.vue.d.ts

@@ -85,8 +85,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
 }>> & {
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
-    required: boolean;
     name: string;
+    required: boolean;
     labelClass: string;
     modelValue: OptionValue | undefined;
     disabled: boolean;

package/dist/types/src/components/BaseRichText.vue.d.ts

@@ -12,7 +12,7 @@ declare const _default: import("vue").DefineComponent<{
         default: string;
     };
     toolbar: {
-        type: PropType<string | Record<string, any> | unknown[] | undefined>;
+        type: PropType<string | unknown[] | Record<string, any> | undefined>;
         default(): string[];
     };
     placeholder: {
@@ -49,7 +49,7 @@ declare const _default: import("vue").DefineComponent<{
         default: string;
     };
     toolbar: {
-        type: PropType<string | Record<string, any> | unknown[] | undefined>;
+        type: PropType<string | unknown[] | Record<string, any> | undefined>;
         default(): string[];
     };
     placeholder: {
@@ -79,14 +79,14 @@ declare const _default: import("vue").DefineComponent<{
 }>> & {
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
-    required: boolean;
     name: string;
+    required: boolean;
     modelValue: string | Delta | null | undefined;
     placeholder: string;
     disabled: boolean;
     hasError: boolean;
     enable: boolean;
-    toolbar: string | Record<string, any> | unknown[] | undefined;
+    toolbar: string | unknown[] | Record<string, any> | undefined;
     theme: "" | "snow" | "bubble";
 }>;
 export default _default;

package/dist/types/src/components/BaseSelect.vue.d.ts

@@ -77,8 +77,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
 }>> & {
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
-    required: boolean;
     name: string;
+    required: boolean;
     modelValue: (string | number | null) | undefined;
     placeholder: string;
     disabled: boolean;

package/dist/types/src/components/BaseShortcut.vue.d.ts

@@ -2,8 +2,16 @@ import { PropType } from 'vue';
 import { RouteLocationRaw } from 'vue-router';
 declare const _default: import("vue").DefineComponent<{
     to: {
-        required: true;
-        type: PropType<RouteLocationRaw>;
+        default: undefined;
+        type: PropType<RouteLocationRaw | undefined>;
+    };
+    href: {
+        default: undefined;
+        type: PropType<string | undefined>;
+    };
+    action: {
+        default: undefined;
+        type: PropType<() => Promise<void> | undefined>;
     };
     title: {
         required: true;
@@ -31,8 +39,16 @@ declare const _default: import("vue").DefineComponent<{
     };
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     to: {
-        required: true;
-        type: PropType<RouteLocationRaw>;
+        default: undefined;
+        type: PropType<RouteLocationRaw | undefined>;
+    };
+    href: {
+        default: undefined;
+        type: PropType<string | undefined>;
+    };
+    action: {
+        default: undefined;
+        type: PropType<() => Promise<void> | undefined>;
     };
     title: {
         required: true;
@@ -59,6 +75,9 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<"high" | "low">;
     };
 }>>, {
+    to: RouteLocationRaw | undefined;
+    href: string | undefined;
+    action: () => Promise<void> | undefined;
     color: string;
     description: string;
     contrast: "high" | "low";

package/dist/types/src/components/BaseStatistic.vue.d.ts

@@ -48,8 +48,8 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<string | null>;
     };
 }>>, {
-    label: string | null;
     caption: string | null;
+    label: string | null;
     secondaryValue: string | null;
     trend: "up" | "down" | null;
 }>;

package/dist/types/src/components/BaseSwitch.vue.d.ts

@@ -10,7 +10,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     };
     color: {
         default: string;
-        type: PropType<"dark" | "light" | "danger" | "success" | "warning" | "info" | "primary">;
+        type: PropType<"success" | "info" | "danger" | "warning" | "dark" | "light" | "primary">;
     };
     size: {
         default: string;
@@ -35,7 +35,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     };
     color: {
         default: string;
-        type: PropType<"dark" | "light" | "danger" | "success" | "warning" | "info" | "primary">;
+        type: PropType<"success" | "info" | "danger" | "warning" | "dark" | "light" | "primary">;
     };
     size: {
         default: string;
@@ -52,9 +52,9 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
 }>> & {
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
-    required: boolean;
     name: string;
-    color: "dark" | "light" | "danger" | "success" | "warning" | "info" | "primary";
+    color: "success" | "info" | "danger" | "warning" | "dark" | "light" | "primary";
+    required: boolean;
     modelValue: string | number | boolean | null | undefined;
     hasError: boolean;
     size: "base" | "xs" | "sm" | "lg" | "xl";

package/dist/types/src/components/BaseSystemAlert.vue.d.ts

@@ -11,7 +11,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     };
     color: {
         default: string;
-        type: PropType<"danger" | "success" | "warning" | "info">;
+        type: PropType<"success" | "info" | "danger" | "warning">;
     };
     closable: {
         default: boolean;
@@ -28,7 +28,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     };
     color: {
         default: string;
-        type: PropType<"danger" | "success" | "warning" | "info">;
+        type: PropType<"success" | "info" | "danger" | "warning">;
     };
     closable: {
         default: boolean;
@@ -38,8 +38,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     onClose?: ((...args: any[]) => any) | undefined;
 }, {
     to: RouteLocationRaw | undefined;
-    color: "danger" | "success" | "warning" | "info";
     action: () => Promise<void> | void;
+    color: "success" | "info" | "danger" | "warning";
     closable: boolean;
 }>, {
     default: (_: {}) => any;

package/dist/types/src/components/BaseTableColumn.vue.d.ts

@@ -153,8 +153,8 @@ declare const _default: import("vue").DefineComponent<{
         default: () => {};
     };
 }>>, {
+    meta: unknown[] | Record<string, any>;
     label: string;
-    meta: Record<string, any> | unknown[];
     toggle: boolean;
     width: number;
     field: string;

package/dist/types/src/components/BaseTagAutocomplete.vue.d.ts

@@ -144,8 +144,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     onOpen?: ((...args: any[]) => any) | undefined;
 }, {
     filter: (option: NormalizedOption) => boolean;
-    required: boolean;
     name: string;
+    required: boolean;
     placeholder: string;
     disabled: boolean;
     max: number;

package/dist/types/src/components/BaseTextarea.vue.d.ts

@@ -84,9 +84,9 @@ declare const _default: import("vue").DefineComponent<{
 }>> & {
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
-    required: boolean;
     type: string;
     name: string;
+    required: boolean;
     modelValue: string | null | undefined;
     placeholder: string;
     disabled: boolean;

package/dist/types/src/types/index.d.ts

@@ -179,6 +179,7 @@ export interface DataIteratorSection {
     title: string;
     closeText: string;
     icon: string;
+    count?: number;
     opened?: boolean;
 }
 export interface RowAction {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sprintify-ui",
-  "version": "0.0.189",
+  "version": "0.0.191",
   "scripts": {
     "build": "rimraf dist && vue-tsc && vite build",
     "build-fast": "rimraf dist && vite build",

package/src/components/BaseActionItem.vue

@@ -1,14 +1,14 @@
 <template>
   <RouterLink
-    v-if="item.to"
+    v-if="to"
     v-slot="{ isActive, href: slotHref, navigate }"
     custom
-    :to="item.to"
+    :to="to"
   >
     <a
       :active="isActive"
       :href="slotHref"
-      :class="itemClass"
+      :class="props.class"
       :aria-current="isActive ? 'page' : undefined"
       @click.prevent="onClick(navigate)"
     >
@@ -16,41 +16,34 @@
     </a>
   </RouterLink>
   <button
-    v-else-if="item.action"
+    v-else-if="action"
     type="button"
-    :class="itemClass"
-    @click="onClick(item.action)"
+    class="text-left"
+    :class="props.class"
+    @click="onClick(action)"
   >
     <slot :active="false"> </slot>
   </button>
-  <a
-    v-else-if="item.href"
-    :href="item.href"
-    :class="itemClass"
-    @click="onClick()"
-  >
+  <a v-else-if="href" :href="href" :class="props.class" @click="onClick()">
     <slot :active="false"> </slot>
   </a>
 </template>
 
+<script lang="ts">
+export default {
+  inheritAttrs: false,
+};
+</script>
+
 <script setup lang="ts">
-import { PropType } from 'vue';
-import { ActionItem } from '@/types';
+import { RouteLocationRaw } from 'vue-router';
 
-defineProps({
-  item: {
-    required: true,
-    type: Object as PropType<ActionItem>,
-  },
-  dark: {
-    default: false,
-    type: Boolean,
-  },
-  itemClass: {
-    default: '',
-    type: [String, Array, Object],
-  },
-});
+const props = defineProps<{
+  to?: RouteLocationRaw;
+  href?: string;
+  action?: (() => Promise<void>) | (() => void);
+  class?: string | string[] | null;
+}>();
 
 const closeMenu = inject('closeMenu', () => {
   return;

package/src/components/BaseBadge.stories.js

@@ -96,3 +96,29 @@ export const Sizes = (args) => ({
   </div>
   `,
 });
+
+export const Wrap = (args) => ({
+  components: { BaseBadge },
+  setup() {
+    return { args, colors, sizes };
+  },
+  template: `
+  <div style="width: 200px; background-color: #eee; padding: 10px;">
+
+    <p class="text-xs text-slate-600 leading-tight mb-1">No Wrap</p>
+    
+    <BaseBadge v-bind="args" :color="color" icon="heroicons:beaker-20-solid">
+      Administrator And More And More And More
+    </BaseBadge>
+
+    <br />
+    <br />
+
+    <p class="text-xs text-slate-600 leading-tight mb-1">Wrap</p>
+
+    <BaseBadge v-bind="args" :color="color" wrap icon="heroicons:beaker-20-solid">
+      Administrator And More And More And More
+    </BaseBadge>
+  </div>
+  `,
+});

package/src/components/BaseBadge.vue

@@ -1,10 +1,16 @@
 <template>
   <span
-    class="inline-flex items-center rounded-full font-medium"
-    :class="[sizeClasses]"
+    class="inline-flex items-center rounded-full font-medium leading-tight"
+    :class="[sizeClasses, wrapClasses]"
     :style="colorStyle"
   >
-    <BaseIcon v-if="icon" :icon="icon" :class="iconSizeClasses"> </BaseIcon>
+    <BaseIcon
+      v-if="icon"
+      :icon="icon"
+      class="shrink-0"
+      :class="iconSizeClasses"
+    >
+    </BaseIcon>
     <slot />
   </span>
 </template>
@@ -19,6 +25,7 @@ const props = withDefaults(
     color?: string;
     size?: 'sm' | 'base' | 'lg';
     icon?: string;
+    wrap?: boolean;
   }>(),
   {
     contrast: 'high',
@@ -37,6 +44,13 @@ const colorStyle = computed((): Record<string, string> => {
   };
 });
 
+const wrapClasses = computed(() => {
+  if (!props.wrap) {
+    return 'whitespace-nowrap';
+  }
+  return '';
+});
+
 const sizeClasses = computed(() => {
   if (props.size == 'sm') {
     return 'px-2 py-px text-[11px]';

package/src/components/BaseDataIteratorSectionButton.vue

@@ -11,12 +11,18 @@
       class="ml-2 whitespace-pre text-sm"
       >{{ section.title }}</span
     >
+    <BaseBadge
+      v-if="section.count"
+      class="ml-2"
+      :label="section.count"
+    ></BaseBadge>
   </button>
 </template>
 
 <script lang="ts" setup>
 import { DataIteratorSection } from '@/types';
 import { BaseIcon } from '.';
+import BaseBadge from './BaseBadge.vue';
 
 defineProps<{
   section: DataIteratorSection;

package/src/components/BaseDataTable.vue

@@ -86,15 +86,13 @@
 
             <BaseTableColumn
               v-slot="{ row }"
-              :visible="editButton || deleteButton || $slots.rowActions != null"
+              :visible="rowActionsInternal.length"
               :toggle="false"
               :clickable="false"
               custom-key="actions"
               class="overflow-hidden"
             >
               <div class="flex justify-end gap-1 pr-2 text-right">
-                <slot name="rowActions" :row="row" />
-
                 <div class="btn-group">
                   <template
                     v-for="rowAction in visibleRowActions"

package/src/components/BaseNavbarItem.vue

@@ -1,9 +1,11 @@
 <template>
   <div class="flex">
     <BaseActionItem
-      :item="item"
+      :to="item.to"
+      :href="item.href"
+      :action="item.action"
       :dark="dark"
-      item-class="flex w-full"
+      class="flex w-full"
       @click="onClick"
     >
       <template #default="{ active }">

package/src/components/BaseNavbarSideItem.vue

@@ -1,9 +1,11 @@
 <template>
   <div>
     <BaseActionItem
-      :item="item"
+      :to="item.to"
+      :href="item.href"
+      :action="item.action"
       :dark="dark"
-      item-class="flex w-full"
+      class="flex w-full"
       @click="onClick"
     >
       <template #default="{ active }">
@@ -23,9 +25,10 @@
     >
       <div v-for="subItem in item.actions" :key="subItem.label" class="mb-1">
         <BaseActionItem
-          :item="subItem"
-          :dark="dark"
-          :item-class="[
+          :to="subItem.to"
+          :href="subItem.href"
+          :action="subItem.action"
+          :class="[
             'flex w-full',
             dark
               ? 'text-slate-300 hover:text-white'