tabSize: 4

src/components/ui/UIButton.vue

@@ -1,62 +1,62 @@
 <script setup lang="ts">
 interface Props {
-  size?: 'xs' | 'sm' | 'md' | 'lg'
-  variant?: 'regular' | 'outline'
-  color?: 'regular' | 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'
-  dropdown?: boolean
-  join?: boolean
+    size?: 'xs' | 'sm' | 'md' | 'lg'
+    variant?: 'regular' | 'outline'
+    color?: 'regular' | 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'
+    dropdown?: boolean
+    join?: boolean
 }
 
 const props = withDefaults(defineProps<Props>(), {
-  size: 'md',
-  variant: 'regular',
-  color: 'regular',
-  dropdown: false,
-  join: false
+    size: 'md',
+    variant: 'regular',
+    color: 'regular',
+    dropdown: false,
+    join: false
 })
 
 const styleClass = computed(() => {
-  const sizeVariants = {
-    xs: 'dui-btn-xs',
-    sm: 'dui-btn-sm',
-    md: 'dui-btn-md',
-    lg: 'dui-btn-lg'
-  }
-  const colorVariants = {
-    regular: '',
-    primary: 'dui-btn-primary',
-    secondary: 'dui-btn-secondary',
-    info: 'dui-btn-info',
-    success: 'dui-btn-success',
-    warning: 'dui-btn-warning',
-    error: 'dui-btn-error'
-  }
-  const variantVariants = {
-    regular: '',
-    outline: 'dui-btn-outline'
-  }
-  const sizeClass = sizeVariants[props.size]
-  const variantClass = variantVariants[props.variant]
-  const colorClass = colorVariants[props.color]
-  const joinClass = props.join ? 'dui-join-item' : ''
-  return [sizeClass, variantClass, colorClass, joinClass]
+    const sizeVariants = {
+        xs: 'dui-btn-xs',
+        sm: 'dui-btn-sm',
+        md: 'dui-btn-md',
+        lg: 'dui-btn-lg'
+    }
+    const colorVariants = {
+        regular: '',
+        primary: 'dui-btn-primary',
+        secondary: 'dui-btn-secondary',
+        info: 'dui-btn-info',
+        success: 'dui-btn-success',
+        warning: 'dui-btn-warning',
+        error: 'dui-btn-error'
+    }
+    const variantVariants = {
+        regular: '',
+        outline: 'dui-btn-outline'
+    }
+    const sizeClass = sizeVariants[props.size]
+    const variantClass = variantVariants[props.variant]
+    const colorClass = colorVariants[props.color]
+    const joinClass = props.join ? 'dui-join-item' : ''
+    return [sizeClass, variantClass, colorClass, joinClass]
 })
 </script>
 <template>
-  <label
-    class="dui-btn h-auto px-3 py-2 duration-0"
-    :class="styleClass"
-    v-if="props.dropdown"
-    tabindex="0"
-  >
-    <slot></slot>
-  </label>
-  <button
-    type="button"
-    class="dui-btn inline-block h-auto max-w-full truncate px-3 py-2 duration-0"
-    :class="styleClass"
-    v-else
-  >
-    <slot></slot>
-  </button>
+    <label
+        class="dui-btn h-auto px-3 py-2 duration-0"
+        :class="styleClass"
+        v-if="props.dropdown"
+        tabindex="0"
+    >
+        <slot></slot>
+    </label>
+    <button
+        type="button"
+        class="dui-btn inline-block h-auto max-w-full truncate px-3 py-2 duration-0"
+        :class="styleClass"
+        v-else
+    >
+        <slot></slot>
+    </button>
 </template>