sprintify-ui 0.10.74 → 0.10.76

package/dist/types/components/BaseAutocomplete.vue.d.ts

@@ -494,8 +494,8 @@ declare const __VLS_self: import("vue").DefineComponent<import("vue").ExtractPro
         type: PropType<SelectConfiguration | undefined>;
     };
     icon: {
-        default: string;
-        type: StringConstructor;
+        default(): string;
+        type: PropType<string>;
     };
     twInput: {
         default: undefined;
@@ -638,8 +638,8 @@ declare const __VLS_self: import("vue").DefineComponent<import("vue").ExtractPro
         type: PropType<SelectConfiguration | undefined>;
     };
     icon: {
-        default: string;
-        type: StringConstructor;
+        default(): string;
+        type: PropType<string>;
     };
     twInput: {
         default: undefined;
@@ -773,8 +773,8 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
         type: PropType<SelectConfiguration | undefined>;
     };
     icon: {
-        default: string;
-        type: StringConstructor;
+        default(): string;
+        type: PropType<string>;
     };
     twInput: {
         default: undefined;
@@ -890,8 +890,8 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
         type: PropType<SelectConfiguration | undefined>;
     };
     icon: {
-        default: string;
-        type: StringConstructor;
+        default(): string;
+        type: PropType<string>;
     };
     twInput: {
         default: undefined;

package/dist/types/components/BaseAutocompleteFetch.vue.d.ts

@@ -172,8 +172,8 @@ declare const autocomplete: import("vue").Ref<({
             type: PropType<SelectConfiguration | undefined>;
         };
         icon: {
-            default: string;
-            type: StringConstructor;
+            default(): string;
+            type: PropType<string>;
         };
         twInput: {
             default: undefined;
@@ -361,8 +361,8 @@ declare const autocomplete: import("vue").Ref<({
         type: PropType<SelectConfiguration | undefined>;
     };
     icon: {
-        default: string;
-        type: StringConstructor;
+        default(): string;
+        type: PropType<string>;
     };
     twInput: {
         default: undefined;
@@ -580,8 +580,8 @@ declare const autocomplete: import("vue").Ref<({
             type: PropType<SelectConfiguration | undefined>;
         };
         icon: {
-            default: string;
-            type: StringConstructor;
+            default(): string;
+            type: PropType<string>;
         };
         twInput: {
             default: undefined;
@@ -769,8 +769,8 @@ declare const autocomplete: import("vue").Ref<({
         type: PropType<SelectConfiguration | undefined>;
     };
     icon: {
-        default: string;
-        type: StringConstructor;
+        default(): string;
+        type: PropType<string>;
     };
     twInput: {
         default: undefined;

package/dist/types/components/BaseBelongsTo.vue.d.ts

@@ -166,8 +166,8 @@ declare const autocomplete: import("vue").Ref<({
             type: PropType<SelectConfiguration | undefined>;
         };
         icon: {
-            default: string;
-            type: StringConstructor;
+            default(): string;
+            type: PropType<string>;
         };
         twInput: {
             default: undefined;
@@ -355,8 +355,8 @@ declare const autocomplete: import("vue").Ref<({
         type: PropType<SelectConfiguration | undefined>;
     };
     icon: {
-        default: string;
-        type: StringConstructor;
+        default(): string;
+        type: PropType<string>;
     };
     twInput: {
         default: undefined;
@@ -574,8 +574,8 @@ declare const autocomplete: import("vue").Ref<({
             type: PropType<SelectConfiguration | undefined>;
         };
         icon: {
-            default: string;
-            type: StringConstructor;
+            default(): string;
+            type: PropType<string>;
         };
         twInput: {
             default: undefined;
@@ -763,8 +763,8 @@ declare const autocomplete: import("vue").Ref<({
         type: PropType<SelectConfiguration | undefined>;
     };
     icon: {
-        default: string;
-        type: StringConstructor;
+        default(): string;
+        type: PropType<string>;
     };
     twInput: {
         default: undefined;
@@ -935,6 +935,10 @@ declare const __VLS_self: import("vue").DefineComponent<import("vue").ExtractPro
         default: undefined;
         type: PropType<SelectConfiguration | undefined>;
     };
+    icon: {
+        default: undefined;
+        type: StringConstructor;
+    };
 }>, {
     BaseAutocomplete: typeof BaseAutocomplete;
     autocomplete: typeof autocomplete;
@@ -1023,6 +1027,10 @@ declare const __VLS_self: import("vue").DefineComponent<import("vue").ExtractPro
         default: undefined;
         type: PropType<SelectConfiguration | undefined>;
     };
+    icon: {
+        default: undefined;
+        type: StringConstructor;
+    };
 }>> & Readonly<{
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }>, {
@@ -1030,6 +1038,7 @@ declare const __VLS_self: import("vue").DefineComponent<import("vue").ExtractPro
     select: SelectConfiguration | undefined;
     size: "xs" | "sm" | "md" | "lg" | "xl";
     required: boolean;
+    icon: string;
     inline: boolean;
     disabled: boolean;
     name: string;
@@ -1126,6 +1135,10 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
         default: undefined;
         type: PropType<SelectConfiguration | undefined>;
     };
+    icon: {
+        default: undefined;
+        type: StringConstructor;
+    };
 }>, {
     focus: () => void | undefined;
     blur: () => void | undefined;
@@ -1215,6 +1228,10 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
         default: undefined;
         type: PropType<SelectConfiguration | undefined>;
     };
+    icon: {
+        default: undefined;
+        type: StringConstructor;
+    };
 }>> & Readonly<{
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }>, {
@@ -1222,6 +1239,7 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
     select: SelectConfiguration | undefined;
     size: "xs" | "sm" | "md" | "lg" | "xl";
     required: boolean;
+    icon: string;
     inline: boolean;
     disabled: boolean;
     name: string;

package/dist/types/components/BaseSideNavigation.vue.d.ts

@@ -1,5 +1,6 @@
 type __VLS_Props = {
     size?: 'xs' | 'sm' | 'md' | 'lg';
+    orientation?: 'left' | 'right';
 };
 declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
 declare var __VLS_1: {};
@@ -8,9 +9,11 @@ type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$
 }>;
 declare const __VLS_self: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
     size: "xs" | "sm" | "md" | "lg";
+    orientation: "left" | "right";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
     size: "xs" | "sm" | "md" | "lg";
+    orientation: "left" | "right";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/types/components/BaseSideNavigationItem.vue.d.ts

@@ -4,6 +4,7 @@ type __VLS_Props = {
     disabled?: boolean;
     activeStrategy?: 'default' | 'exact';
 };
+declare const orientation: import("vue").Ref<"left" | "right", "left" | "right">;
 declare function onClick(navigate: () => Promise<void | NavigationFailure>): Promise<void | NavigationFailure> | undefined;
 declare function isActiveInternal(isActive: boolean, isExactActive: boolean): boolean;
 declare const sizeClassOuter: import("vue").ComputedRef<"" | "py-0.5" | "py-1" | "py-2">;
@@ -16,6 +17,7 @@ type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$
     default?: (props: typeof __VLS_6) => any;
 }>;
 declare const __VLS_self: import("vue").DefineComponent<__VLS_Props, {
+    orientation: typeof orientation;
     onClick: typeof onClick;
     isActiveInternal: typeof isActiveInternal;
     sizeClassOuter: typeof sizeClassOuter;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sprintify-ui",
-  "version": "0.10.74",
+  "version": "0.10.76",
   "type": "module",
   "scripts": {
     "build": "rimraf dist && vue-tsc && vite build",

package/src/components/BaseAutocomplete.vue

@@ -226,8 +226,10 @@ const props = defineProps({
     type: Object as PropType<SelectConfiguration | undefined>,
   },
   icon: {
-    default: 'heroicons:magnifying-glass-solid',
-    type: String,
+    default() {
+      return 'heroicons:magnifying-glass-solid';
+    },
+    type: [String] as PropType<string>,
   },
   twInput: {
     default: undefined,

package/src/components/BaseBelongsTo.vue

@@ -21,6 +21,7 @@
     :visible-focus="visibleFocus"
     :focus-on-mount="focusOnMount"
     :select="select"
+    :icon="icon"
     @update:model-value="onUpdate"
   >
     <template #option="optionProps">
@@ -133,6 +134,10 @@ const props = defineProps({
     default: undefined,
     type: Object as PropType<SelectConfiguration | undefined>,
   },
+  icon: {
+    default: undefined,
+    type: String,
+  },
 });
 
 const emit = defineEmits(['update:modelValue']);

package/src/components/BaseSideNavigation.stories.js

@@ -8,7 +8,16 @@ import BaseCounter from "./BaseCounter.vue";
 export default {
   title: "Navigation/BaseSideNavigation",
   component: BaseSideNavigation,
-  args: {},
+  argTypes: {
+    size: {
+      control: { type: "select" },
+      options: ["xs", "sm", "md", "lg"],
+    },
+    orientation: {
+      control: { type: "select" },
+      options: ["left", "right"],
+    },
+  },
 };
 
 const Template = (args) => ({

package/src/components/BaseSideNavigation.vue

@@ -3,7 +3,10 @@
     aria-label="Sidebar"
     class="relative"
   >
-    <div class="absolute bottom-0 left-0 h-full w-px bg-slate-300" />
+    <div
+      class="absolute bottom-0 h-full w-px bg-slate-300"
+      :class="[orientation == 'left' ? 'left-0' : 'right-0']"
+    />
     <div
       class="relative overflow-x-auto overflow-y-hidden"
       data-scroll-lock-scrollable
@@ -19,9 +22,11 @@
 const props = withDefaults(
   defineProps<{
     size?: 'xs' | 'sm' | 'md' | 'lg';
+    orientation?: 'left' | 'right';
   }>(),
   {
     size: 'md',
+    orientation: 'left',
   }
 );
 
@@ -29,4 +34,10 @@ provide(
   'sideNavigation:size',
   computed(() => props.size)
 );
+
+provide(
+  'sideNavigation:orientation',
+  computed(() => props.orientation)
+);
+
 </script>

package/src/components/BaseSideNavigationItem.vue

@@ -22,8 +22,9 @@
         :class="[sizeClassInner]"
       >
         <div
-          class="absolute left-0 top-0 h-full"
+          class="absolute top-0 h-full"
           :class="[
+            orientation == 'left' ? 'left-0' : 'right-0',
             isActiveInternal(isActive, isExactActive)
               ? 'w-[2px] bg-primary-600'
               : 'group-hover:w-px group-hover:bg-slate-700',
@@ -55,6 +56,11 @@ const size = inject(
   ref<'xs' | 'sm' | 'md' | 'lg'>('md')
 );
 
+const orientation = inject(
+  'sideNavigation:orientation',
+  ref<'left' | 'right'>('left')
+);
+
 function onClick(navigate: () => Promise<void | NavigationFailure>) {
   if (props.disabled) {
     return;