@redseed/redseed-ui-vue3 2.0.0 → 2.0.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redseed/redseed-ui-vue3",
-  "version": "2.0.0",
+  "version": "2.0.2",
   "description": "RedSeed UI Vue 3 components",
   "main": "index.js",
   "scripts": {

package/src/components/Button/ButtonDanger.vue

@@ -29,6 +29,6 @@ const buttonClass = computed(() => [
     // default active state
     @apply active:border-danger active:bg-danger/10;
     // default disabled state
-    @apply disabled:text-danger/10 disabled:border-danger/10 disabled:bg-danger-content;
+    @apply disabled:text-danger/20 disabled:border-danger/20 disabled:bg-danger-content;
 }
 </style>

package/src/components/Button/ButtonPrimary.vue

@@ -27,6 +27,6 @@ const buttonClass = computed(() => [
     // default active state
     @apply active:border-primary active:bg-primary/80;
     // default disabled state
-    @apply disabled:text-primary-content disabled:border-transparent disabled:bg-primary/20;
+    @apply disabled:text-primary-content disabled:border-transparent disabled:bg-primary/30;
 }
 </style>

package/src/components/Button/ButtonSecondary.vue

@@ -27,6 +27,6 @@ const buttonClass = computed(() => [
     // default active state
     @apply active:border-secondary active:bg-secondary/80;
     // default disabled state
-    @apply disabled:text-secondary-content disabled:border-transparent disabled:bg-secondary/20;
+    @apply disabled:text-secondary-content disabled:border-transparent disabled:bg-secondary/30;
 }
 </style>

package/src/components/Button/ButtonSlot.vue

@@ -83,7 +83,7 @@ const buttonSlotClass = computed(() => [
     // default control
     @apply w-fit h-fit inline-flex shrink-0 items-center justify-center select-none outline-none whitespace-nowrap;
     // default shape
-    @apply font-semibold gap-1 rounded-md border transition;
+    @apply font-semibold gap-2 rounded-md border transition;
     // default colors
     @apply bg-black text-white ring-black/20 border-black;
     // default focus state

package/src/components/Button/ButtonTertiary.vue

@@ -29,6 +29,6 @@ const buttonClass = computed(() => [
     // default active state
     @apply active:border-tertiary-content active:bg-tertiary-content/10;
     // default disabled state
-    @apply disabled:text-tertiary-content/10 disabled:border-tertiary-content/10 disabled:bg-tertiary;
+    @apply disabled:text-tertiary-content/20 disabled:border-tertiary-content/20 disabled:bg-tertiary;
 }
 </style>

package/src/components/Pagination/Pagination.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, computed } from 'vue'
+import { ref, computed, watch } from 'vue'
 import PaginationItem from './PaginationItem.vue'
 import PaginationItemCollapsed from './PaginationItemCollapsed.vue'
 import PaginationItemNext from './PaginationItemNext.vue'
@@ -40,6 +40,8 @@ const totalPages = computed(() => {
     return Math.ceil(props.totalItems / props.perPage)
 })
 
+watch(totalPages, () => goToPage(1))
+
 const hasOnePage = computed(() => totalPages.value == 1)
 
 const hasMoreThanOnePage = computed(() => totalPages.value > 1)
@@ -153,7 +155,7 @@ const emit = defineEmits(['change'])
 const goingPrevious = ref(false)
 const goingNext = ref(false)
 
-function clickPage(page) {
+function goToPage(page) {
     if (page == current.value) return
 
     if (page < current.value) {
@@ -181,7 +183,7 @@ function clickPage(page) {
     <div class="rsui-pagination__previous">
         <PaginationItemPrevious
             :disabled="disabledPrevious"
-            @click="clickPage(current - 1)"
+            @click="goToPage(current - 1)"
         ></PaginationItemPrevious>
     </div>
     <!-- Page items if not arrows only -->
@@ -203,7 +205,7 @@ function clickPage(page) {
             <PaginationItem v-for="page in totalPages"
                 :key="page"
                 :active="page == current"
-                @click="clickPage(page)"
+                @click="goToPage(page)"
             >
                 {{ page }}
             </PaginationItem>
@@ -215,7 +217,7 @@ function clickPage(page) {
             <PaginationItem
                 v-if="showCollapsedStart"
                 :active="current == 1"
-                @click="clickPage(1)"
+                @click="goToPage(1)"
             >
                 1
             </PaginationItem>
@@ -227,7 +229,7 @@ function clickPage(page) {
             <PaginationItem v-for="page in range"
                 :key="page"
                 :active="page == current"
-                @click="clickPage(page)"
+                @click="goToPage(page)"
             >
                 {{ page }}
             </PaginationItem>
@@ -239,7 +241,7 @@ function clickPage(page) {
             <PaginationItem
                 v-if="showCollapsedEnd"
                 :active="totalPages == current"
-                @click="clickPage(totalPages)"
+                @click="goToPage(totalPages)"
             >
                 {{ totalPages }}
             </PaginationItem>
@@ -249,7 +251,7 @@ function clickPage(page) {
     <div class="rsui-pagination__next">
         <PaginationItemNext
             :disabled="disabledNext"
-            @click="clickPage(current + 1)"
+            @click="goToPage(current + 1)"
         ></PaginationItemNext>
     </div>
 </div>