@veritree/ui 0.65.1 → 0.66.0

package/mixins/form-control.js

@@ -73,7 +73,7 @@ export const formControlStyleMixin = {
       return [
         this.headless
           ? `${this.name}`
-          : 'leading-0 bg-white disabled:bg-gray-200 flex w-full max-w-full relative appearance-none placeholder:font-light placeholder:text-gray-500 items-center justify-between rounded border border-solid px-3 py-2 font-inherit text-base text-inherit file:hidden focus:border-gray-600 focus:placeholder:text-gray-400',
+          : 'leading-0 bg-white disabled:bg-gray-200 flex w-full max-w-full relative appearance-none placeholder:font-light placeholder:text-gray-500 items-center justify-between rounded border border-solid px-3 py-2 font-inherit  text-inherit file:hidden focus:border-gray-600 focus:placeholder:text-gray-400',
         // variant styles
         this.headless
           ? `${this.name}--${this.variant}`
@@ -87,7 +87,7 @@ export const formControlStyleMixin = {
           ? null
           : this.name === 'textarea'
           ? 'min-h-10' // limit it because input type number height can be different from other input types
-          : this.size === 'small' ? 'h-8' : 'h-10',
+          : this.size === 'small' ? 'h-8 text-sm' : 'h-10 text-base',
         // disabled styles
         this.disabled
           ? this.headless

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@veritree/ui",
-  "version": "0.65.1",
+  "version": "0.66.0",
   "description": "veritree ui library",
   "type": "module",
   "main": "index.js",

package/src/components/Carousel/VTCarouselBackward.vue

@@ -1,7 +1,7 @@
 <template>
   <div
     :class="[visible ? 'pointer-events-none opacity-0' : 'opacity-100']"
-    class="transition-opacity duration-100"
+    class="flex items-center justify-start transition-opacity duration-100"
   >
     <slot :scroll-backward="scrollBackward" />
   </div>

package/src/components/Carousel/VTCarouselForward.vue

@@ -1,7 +1,7 @@
 <template>
   <div
     :class="[visible ? 'opacity-100' : 'pointer-events-none opacity-0']"
-    class="transition-opacity duration-100"
+    class="flex items-center justify-end transition-opacity duration-100"
   >
     <slot :scroll-forward="scrollForward" />
   </div>

package/src/components/Carousel/VTCarouselTracker.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="relative flex snap-start overflow-x-scroll">
+  <div class="relative flex snap-start overflow-x-scroll [&>*]:shrink-0">
     <slot />
   </div>
 </template>
@@ -21,7 +21,7 @@ export default {
       return;
     }
 
-    this.$el.removeEventListener('scrollend', this.onScrollEnd);
+    this.$el.removeEventListener('scrollend', this.onScroll);
     this.mutationObserver.disconnect(this.$el);
   },
 
@@ -55,13 +55,14 @@ export default {
 
     /**
      * Adds an event listener to the current element to listen for the 'scrollend' event
-     * and invokes the 'onScrollEnd' method when the event is triggered.
+     * and invokes the 'onScroll' method when the event is triggered.
      */
     addEventListeners() {
-      this.$el.addEventListener('scrollend', this.onScrollEnd);
+      console.log('Add event listener');
+      this.$el.addEventListener('scroll', this.onScroll);
     },
 
-    onScrollEnd() {
+    onScroll() {
       this.apiCarousel().isLeftEndReached();
       this.apiCarousel().isLeftStartReached();
     },