edvoyui-component-library-test-flight 0.0.92 → 0.0.93

package/src/components/tabs/EUITabs.vue

@@ -1,28 +1,27 @@
 <template>
   <div>
-    <div
-      v-if="tabStyle === 'design'"
+    <div class="overflow-x-scroll">
+      <div
+        v-if="tabStyle === 'design'"
         class="flex flex-row items-center justify-between w-full p-2 bg-gray-100 rounded-xl"
       >
         <button
-         v-for="(tab, tabindex) in tabs"
+          v-for="(tab, tabindex) in tabs"
           :key="tabindex"
           :id="`id-${tab.name}`"
           type="button"
           class="[&:not(:focus-visible)]:focus:outline-none relative w-full inline-flex items-center transition-colors duration-100"
           role="tab"
           tabindex="-1"
-         @click="selectTab(tabindex)"
+          @click="selectTab(tabindex)"
         >
           <div
             class="pointer-events-none absolute inset-0 transition-transform duration-200 transform z-[1] ease-in-out"
             :class="{
-              'translate-x-full':
-                tabindex < activeTabIndex,
-              '-translate-x-full':
-                tabindex > activeTabIndex,
+              'translate-x-full': tabindex < activeTabIndex,
+              '-translate-x-full': tabindex > activeTabIndex,
               'translate-x-0 rounded-lg bg-gray-600':
-                activeTabIndex === tabindex
+                activeTabIndex === tabindex,
             }"
           />
           <span
@@ -30,59 +29,69 @@
               'w-full px-4 py-2 text-sm tracking-wide font-medium capitalize z-10',
               activeTabIndex == tabindex
                 ? ' text-white'
-                : ' text-gray-500 hover:text-gray-600 rounded-lg bg-transparent z-0 transition-colors duration-300 ease-in origin-center'
+                : ' text-gray-500 hover:text-gray-600 rounded-lg bg-transparent z-0 transition-colors duration-300 ease-in origin-center',
             ]"
           >
+            <slot name="title" :tab="tab">
+              {{ tab?.name }}
+            </slot>
+          </span>
+        </button>
+      </div>
+      <div
+        v-else-if="tabStyle === 'border'"
+        class="flex items-center gap-1 before:bottom-0 before:left-0 before:absolute before:content-[''] before:h-px before:w-full before:bg-gray-200 relative before:-z-[1] z-0 bg-white"
+        :class="[
+          tabAlign === 'justify'
+            ? 'justify-between'
+            : tabAlign === 'end'
+            ? 'justify-end'
+            : 'justify-start',
+        ]"
+      >
+        <button
+          v-for="(tab, tabindex) in tabs"
+          :key="tabindex"
+          role="tab"
+          :id="`id-${tab.name}`"
+          :class="[
+            'px-3 py-1 leading-5 transition-all duration-150 ease-in-out hover:text-gray-800',
+            tabSize === 'sm'
+              ? 'text-sm font-semibold border-b-2'
+              : 'text-base font-bold border-b-[3px]',
+            activeTabIndex === tabindex
+              ? 'border-gray-900 text-gray-900'
+              : 'border-transparent text-gray-500',
+          ]"
+          @click="selectTab(tabindex)"
+        >
           <slot name="title" :tab="tab">
             {{ tab?.name }}
           </slot>
-        </span>
         </button>
       </div>
-
-    <div
-      v-else-if="tabStyle === 'border'"
-      class="flex items-center gap-1 before:bottom-0 before:left-0 before:absolute before:content-[''] before:h-px before:w-full before:bg-gray-200 relative before:-z-[1] z-0 bg-white"
-      :class="[tabAlign === 'justify' ? 'justify-between' : tabAlign === 'end' ? 'justify-end' : 'justify-start']"
-    >
-      <button
-        v-for="(tab, tabindex) in tabs"
-        :key="tabindex"
-        role="tab"
-        :id="`id-${tab.name}`"
-        :class="['px-3 py-1 leading-5 transition-all duration-150 ease-in-out hover:text-gray-800',
-        tabSize === 'sm' ? 'text-sm font-semibold border-b-2' : 'text-base font-bold border-b-[3px]',
-        activeTabIndex === tabindex
-            ? 'border-gray-900 text-gray-900'
-            : 'border-transparent text-gray-500']"
-        @click="selectTab(tabindex)"
-      >
-        <slot name="title" :tab="tab">
-          {{ tab?.name }}
-        </slot>
-      </button>
-    </div>
-    <div
-      v-else
-      class="flex items-center gap-1 p-2 transition-all duration-100"
-    >
-      <button
-        v-for="(tab, tabindex) in tabs"
-        :key="tabindex"
-        role="tab"
-        :id="`id-${tab.name}`"
-        class="px-4 py-1 text-sm font-semibold transition-colors duration-150 ease-in-out border rounded-full"
-        :class="
-          activeTabIndex === tabindex
-            ? 'shadow-lg shadow-gray-100 bg-white border-gray-200 focus-within:border-purple-600 text-gray-900'
-            : 'border-white hover:bg-gray-50 text-gray-700'
-        "
-        @click="selectTab(tabindex)"
+      <div
+        v-else
+        class="flex items-center gap-1 p-2 transition-all duration-100"
       >
-        <slot name="title" :tab="tab">
-          {{ tab?.name }}
-        </slot>
-      </button>
+        <button
+          v-for="(tab, tabindex) in tabs"
+          :key="tabindex"
+          role="tab"
+          :id="`id-${tab.name}`"
+          class="px-4 py-1 text-sm font-semibold transition-colors duration-150 ease-in-out border rounded-full"
+          :class="
+            activeTabIndex === tabindex
+              ? 'shadow-lg shadow-gray-100 bg-white border-gray-200 focus-within:border-purple-600 text-gray-900'
+              : 'border-white hover:bg-gray-50 text-gray-700'
+          "
+          @click="selectTab(tabindex)"
+        >
+          <slot name="title" :tab="tab">
+            {{ tab?.name }}
+          </slot>
+        </button>
+      </div>
     </div>
     <div :class="['py-2 text-base font-normal text-gray-700', contentClass]">
       <slot name="content" :active-tab="tabs[activeTabIndex]">
@@ -103,10 +112,10 @@ interface Tab {
 const props = defineProps<{
   tabs: Tab[];
   defaultActiveIndex?: number;
-  tabStyle: "rounded" | "border" | 'design' ,
-  contentClass?: string[] | string,
-  tabSize?: "sm" | "md",
-  tabAlign?: 'start' | 'justify' | 'end'
+  tabStyle: "rounded" | "border" | "design";
+  contentClass?: string[] | string;
+  tabSize?: "sm" | "md";
+  tabAlign?: "start" | "justify" | "end";
 }>();
 
 const emit = defineEmits<{
@@ -124,7 +133,6 @@ watch(
   () => props.defaultActiveIndex,
   (newIndex) => {
     activeTabIndex.value = newIndex ?? 0;
-
   }
 );
 </script>

package/dist/EUISelectSearch.vue.d.ts

@@ -1,4 +0,0 @@
-import _sfc_main from "/Volumes/work/repos/edvoy-ui-v2/src/components/selectSearch/EUISelectSearch.vue?vue&type=script&setup=true&lang.ts";
-export * from "/Volumes/work/repos/edvoy-ui-v2/src/components/selectSearch/EUISelectSearch.vue?vue&type=script&setup=true&lang.ts";
-export default _sfc_main;
-//# sourceMappingURL=EUISelectSearch.vue.d.ts.map

package/dist/EUISelectSearch.vue.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"EUISelectSearch.vue.d.ts","sourceRoot":"","sources":["../src/components/selectSearch/EUISelectSearch.vue"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,oHAAoH,CAAC;AAC3I,cAAc,oHAAoH,CAAC;AACnI,eAAe,SAAS,CAAC"}

package/dist/button/EUIButton.vue.d.ts

@@ -1,5 +0,0 @@
-import _sfc_main from "/Volumes/work/repos/edvoy-ui-v2/src/components/button/EUIButton.vue?vue&type=script&setup=true&lang.ts";
-export * from "/Volumes/work/repos/edvoy-ui-v2/src/components/button/EUIButton.vue?vue&type=script&setup=true&lang.ts";
-import "/Volumes/work/repos/edvoy-ui-v2/src/components/button/EUIButton.vue?vue&type=style&index=0&lang.scss";
-export default _sfc_main;
-//# sourceMappingURL=EUIButton.vue.d.ts.map

package/dist/button/EUIButton.vue.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"EUIButton.vue.d.ts","sourceRoot":"","sources":["../../src/components/button/EUIButton.vue"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,wGAAwG,CAAC;AAC/H,cAAc,wGAAwG,CAAC;AACvH,OAAO,sGAAsG,CAAC;AAC9G,eAAe,SAAS,CAAC"}