style: change review button to justify-left & lint fixes

SMS-COSMO · Mar 9, 2025 · 7a0f253 · 7a0f253
1 parent 2c4b42d
commit 7a0f253
Show file tree

Hide file tree

Showing 19 changed files with 222 additions and 221 deletions.
diff --git a/components/ui/button/Button.vue b/components/ui/button/Button.vue
@@ -1,20 +1,3 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { Primitive, type PrimitiveProps } from 'reka-ui'
-import { type ButtonVariants, buttonVariants } from '.'
-
-interface Props extends PrimitiveProps {
-  variant?: ButtonVariants['variant']
-  size?: ButtonVariants['size']
-  class?: HTMLAttributes['class']
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  as: 'button',
-})
-</script>
-
 <template>
   <Primitive
     :as="as"
@@ -24,3 +7,20 @@ const props = withDefaults(defineProps<Props>(), {
     <slot />
   </Primitive>
 </template>
+
+<script setup lang="ts">
+import type { HTMLAttributes } from 'vue';
+import { Primitive, type PrimitiveProps } from 'reka-ui';
+import { type ButtonVariants, buttonVariants } from '.';
+import { cn } from '@/lib/utils';
+
+interface Props extends PrimitiveProps {
+  variant?: ButtonVariants['variant'];
+  size?: ButtonVariants['size'];
+  class?: HTMLAttributes['class'];
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  as: 'button',
+});
+</script>
diff --git a/components/ui/button/index.ts b/components/ui/button/index.ts
@@ -1,6 +1,6 @@
-import { cva, type VariantProps } from 'class-variance-authority'
+import { type VariantProps, cva } from 'class-variance-authority';
 
-export { default as Button } from './Button.vue'
+export { default as Button } from './Button.vue';
 
 export const buttonVariants = cva(
   'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0',
@@ -30,6 +30,6 @@ export const buttonVariants = cva(
       size: 'default',
     },
   },
-)
+);
 
-export type ButtonVariants = VariantProps<typeof buttonVariants>
+export type ButtonVariants = VariantProps<typeof buttonVariants>;
diff --git a/components/ui/calendar/Calendar.vue b/components/ui/calendar/Calendar.vue
@@ -1,22 +1,3 @@
-<script lang="ts" setup>
-import { cn } from '@/lib/utils'
-import { CalendarRoot, type CalendarRootEmits, type CalendarRootProps, useForwardPropsEmits } from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-import { CalendarCell, CalendarCellTrigger, CalendarGrid, CalendarGridBody, CalendarGridHead, CalendarGridRow, CalendarHeadCell, CalendarHeader, CalendarHeading, CalendarNextButton, CalendarPrevButton } from '.'
-
-const props = defineProps<CalendarRootProps & { class?: HTMLAttributes['class'] }>()
-
-const emits = defineEmits<CalendarRootEmits>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-
-const forwarded = useForwardPropsEmits(delegatedProps, emits)
-</script>
-
 <template>
   <CalendarRoot
     v-slot="{ grid, weekDays }"
@@ -58,3 +39,22 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits)
     </div>
   </CalendarRoot>
 </template>
+
+<script lang="ts" setup>
+import { CalendarRoot, type CalendarRootEmits, type CalendarRootProps, useForwardPropsEmits } from 'reka-ui';
+import { type HTMLAttributes, computed } from 'vue';
+import { CalendarCell, CalendarCellTrigger, CalendarGrid, CalendarGridBody, CalendarGridHead, CalendarGridRow, CalendarHeadCell, CalendarHeader, CalendarHeading, CalendarNextButton, CalendarPrevButton } from '.';
+import { cn } from '@/lib/utils';
+
+const props = defineProps<CalendarRootProps & { class?: HTMLAttributes['class'] }>();
+
+const emits = defineEmits<CalendarRootEmits>();
+
+const delegatedProps = computed(() => {
+  const { class: _, ...delegated } = props;
+
+  return delegated;
+});
+
+const forwarded = useForwardPropsEmits(delegatedProps, emits);
+</script>
diff --git a/components/ui/calendar/CalendarCell.vue b/components/ui/calendar/CalendarCell.vue
@@ -1,19 +1,3 @@
-<script lang="ts" setup>
-import { cn } from '@/lib/utils'
-import { CalendarCell, type CalendarCellProps, useForwardProps } from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<CalendarCellProps & { class?: HTMLAttributes['class'] }>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-
-const forwardedProps = useForwardProps(delegatedProps)
-</script>
-
 <template>
   <CalendarCell
     :class="cn('relative p-0 text-center text-sm focus-within:relative focus-within:z-20 [&:has([data-selected])]:rounded-md [&:has([data-selected])]:bg-accent [&:has([data-selected][data-outside-view])]:bg-accent/50', props.class)"
@@ -22,3 +6,19 @@ const forwardedProps = useForwardProps(delegatedProps)
     <slot />
   </CalendarCell>
 </template>
+
+<script lang="ts" setup>
+import { CalendarCell, type CalendarCellProps, useForwardProps } from 'reka-ui';
+import { type HTMLAttributes, computed } from 'vue';
+import { cn } from '@/lib/utils';
+
+const props = defineProps<CalendarCellProps & { class?: HTMLAttributes['class'] }>();
+
+const delegatedProps = computed(() => {
+  const { class: _, ...delegated } = props;
+
+  return delegated;
+});
+
+const forwardedProps = useForwardProps(delegatedProps);
+</script>
diff --git a/components/ui/calendar/CalendarCellTrigger.vue b/components/ui/calendar/CalendarCellTrigger.vue
@@ -1,20 +1,3 @@
-<script lang="ts" setup>
-import { cn } from '@/lib/utils'
-import { buttonVariants } from '@/components/ui/button'
-import { CalendarCellTrigger, type CalendarCellTriggerProps, useForwardProps } from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<CalendarCellTriggerProps & { class?: HTMLAttributes['class'] }>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-
-const forwardedProps = useForwardProps(delegatedProps)
-</script>
-
 <template>
   <CalendarCellTrigger
     :class="cn(
@@ -36,3 +19,20 @@ const forwardedProps = useForwardProps(delegatedProps)
     <slot />
   </CalendarCellTrigger>
 </template>
+
+<script lang="ts" setup>
+import { CalendarCellTrigger, type CalendarCellTriggerProps, useForwardProps } from 'reka-ui';
+import { type HTMLAttributes, computed } from 'vue';
+import { cn } from '@/lib/utils';
+import { buttonVariants } from '@/components/ui/button';
+
+const props = defineProps<CalendarCellTriggerProps & { class?: HTMLAttributes['class'] }>();
+
+const delegatedProps = computed(() => {
+  const { class: _, ...delegated } = props;
+
+  return delegated;
+});
+
+const forwardedProps = useForwardProps(delegatedProps);
+</script>
diff --git a/components/ui/calendar/CalendarGrid.vue b/components/ui/calendar/CalendarGrid.vue
@@ -1,19 +1,3 @@
-<script lang="ts" setup>
-import { cn } from '@/lib/utils'
-import { CalendarGrid, type CalendarGridProps, useForwardProps } from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<CalendarGridProps & { class?: HTMLAttributes['class'] }>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-
-const forwardedProps = useForwardProps(delegatedProps)
-</script>
-
 <template>
   <CalendarGrid
     :class="cn('w-full border-collapse space-y-1', props.class)"
@@ -22,3 +6,19 @@ const forwardedProps = useForwardProps(delegatedProps)
     <slot />
   </CalendarGrid>
 </template>
+
+<script lang="ts" setup>
+import { CalendarGrid, type CalendarGridProps, useForwardProps } from 'reka-ui';
+import { type HTMLAttributes, computed } from 'vue';
+import { cn } from '@/lib/utils';
+
+const props = defineProps<CalendarGridProps & { class?: HTMLAttributes['class'] }>();
+
+const delegatedProps = computed(() => {
+  const { class: _, ...delegated } = props;
+
+  return delegated;
+});
+
+const forwardedProps = useForwardProps(delegatedProps);
+</script>
diff --git a/components/ui/calendar/CalendarGridBody.vue b/components/ui/calendar/CalendarGridBody.vue
@@ -1,11 +1,11 @@
-<script lang="ts" setup>
-import { CalendarGridBody, type CalendarGridBodyProps } from 'reka-ui'
-
-const props = defineProps<CalendarGridBodyProps>()
-</script>
-
 <template>
   <CalendarGridBody v-bind="props">
     <slot />
   </CalendarGridBody>
 </template>
+
+<script lang="ts" setup>
+import { CalendarGridBody, type CalendarGridBodyProps } from 'reka-ui';
+
+const props = defineProps<CalendarGridBodyProps>();
+</script>
diff --git a/components/ui/calendar/CalendarGridHead.vue b/components/ui/calendar/CalendarGridHead.vue
@@ -1,12 +1,12 @@
-<script lang="ts" setup>
-import type { HTMLAttributes } from 'vue'
-import { CalendarGridHead, type CalendarGridHeadProps } from 'reka-ui'
-
-const props = defineProps<CalendarGridHeadProps & { class?: HTMLAttributes['class'] }>()
-</script>
-
 <template>
   <CalendarGridHead v-bind="props">
     <slot />
   </CalendarGridHead>
 </template>
+
+<script lang="ts" setup>
+import type { HTMLAttributes } from 'vue';
+import { CalendarGridHead, type CalendarGridHeadProps } from 'reka-ui';
+
+const props = defineProps<CalendarGridHeadProps & { class?: HTMLAttributes['class'] }>();
+</script>
diff --git a/components/ui/calendar/CalendarGridRow.vue b/components/ui/calendar/CalendarGridRow.vue
@@ -1,21 +1,21 @@
+<template>
+  <CalendarGridRow :class="cn('flex', props.class)" v-bind="forwardedProps">
+    <slot />
+  </CalendarGridRow>
+</template>
+
 <script lang="ts" setup>
-import { cn } from '@/lib/utils'
-import { CalendarGridRow, type CalendarGridRowProps, useForwardProps } from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
+import { CalendarGridRow, type CalendarGridRowProps, useForwardProps } from 'reka-ui';
+import { type HTMLAttributes, computed } from 'vue';
+import { cn } from '@/lib/utils';
 
-const props = defineProps<CalendarGridRowProps & { class?: HTMLAttributes['class'] }>()
+const props = defineProps<CalendarGridRowProps & { class?: HTMLAttributes['class'] }>();
 
 const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
+  const { class: _, ...delegated } = props;
 
-  return delegated
-})
+  return delegated;
+});
 
-const forwardedProps = useForwardProps(delegatedProps)
+const forwardedProps = useForwardProps(delegatedProps);
 </script>
-
-<template>
-  <CalendarGridRow :class="cn('flex', props.class)" v-bind="forwardedProps">
-    <slot />
-  </CalendarGridRow>
-</template>
diff --git a/components/ui/calendar/CalendarHeadCell.vue b/components/ui/calendar/CalendarHeadCell.vue
@@ -1,21 +1,21 @@
+<template>
+  <CalendarHeadCell :class="cn('w-8 rounded-md text-[0.8rem] font-normal text-muted-foreground', props.class)" v-bind="forwardedProps">
+    <slot />
+  </CalendarHeadCell>
+</template>
+
 <script lang="ts" setup>
-import { cn } from '@/lib/utils'
-import { CalendarHeadCell, type CalendarHeadCellProps, useForwardProps } from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
+import { CalendarHeadCell, type CalendarHeadCellProps, useForwardProps } from 'reka-ui';
+import { type HTMLAttributes, computed } from 'vue';
+import { cn } from '@/lib/utils';
 
-const props = defineProps<CalendarHeadCellProps & { class?: HTMLAttributes['class'] }>()
+const props = defineProps<CalendarHeadCellProps & { class?: HTMLAttributes['class'] }>();
 
 const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
+  const { class: _, ...delegated } = props;
 
-  return delegated
-})
+  return delegated;
+});
 
-const forwardedProps = useForwardProps(delegatedProps)
+const forwardedProps = useForwardProps(delegatedProps);
 </script>
-
-<template>
-  <CalendarHeadCell :class="cn('w-8 rounded-md text-[0.8rem] font-normal text-muted-foreground', props.class)" v-bind="forwardedProps">
-    <slot />
-  </CalendarHeadCell>
-</template>
diff --git a/components/ui/calendar/CalendarHeader.vue b/components/ui/calendar/CalendarHeader.vue
@@ -1,21 +1,21 @@
+<template>
+  <CalendarHeader :class="cn('relative flex w-full items-center justify-between pt-1', props.class)" v-bind="forwardedProps">
+    <slot />
+  </CalendarHeader>
+</template>
+
 <script lang="ts" setup>
-import { cn } from '@/lib/utils'
-import { CalendarHeader, type CalendarHeaderProps, useForwardProps } from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
+import { CalendarHeader, type CalendarHeaderProps, useForwardProps } from 'reka-ui';
+import { type HTMLAttributes, computed } from 'vue';
+import { cn } from '@/lib/utils';
 
-const props = defineProps<CalendarHeaderProps & { class?: HTMLAttributes['class'] }>()
+const props = defineProps<CalendarHeaderProps & { class?: HTMLAttributes['class'] }>();
 
 const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
+  const { class: _, ...delegated } = props;
 
-  return delegated
-})
+  return delegated;
+});
 
-const forwardedProps = useForwardProps(delegatedProps)
+const forwardedProps = useForwardProps(delegatedProps);
 </script>
-
-<template>
-  <CalendarHeader :class="cn('relative flex w-full items-center justify-between pt-1', props.class)" v-bind="forwardedProps">
-    <slot />
-  </CalendarHeader>
-</template>