refactor(ui): rename all to kebab-case

packages/ui/package.json

@@ -16,8 +16,8 @@
   },
   "exports": {
     ".": "./src/index.ts",
-    "./components/animations": "./src/components/Animations/index.ts",
-    "./components/form": "./src/components/Form/index.ts",
+    "./components/animations": "./src/components/animations/index.ts",
+    "./components/form": "./src/components/form/index.ts",
     "./components/layouts": "./src/components/layouts/index.ts",
     "./*": "./*"
   },

packages/ui/src/components/Animations/index.ts

@@ -1,3 +0,0 @@
-export { default as BidirectionalTransition } from './BidirectionalTransition.vue'
-export { default as TransitionHorizontal } from './TransitionHorizontal.vue'
-export { default as TransitionVertical } from './TransitionVertical.vue'

packages/ui/src/components/Form/Field/index.ts

@@ -1,7 +0,0 @@
-export { default as FieldCheckbox } from './FieldCheckbox.vue'
-export { default as FieldInput } from './FieldInput.vue'
-export { default as FieldKeyValues } from './FieldKeyValues.vue'
-export { default as FieldRange } from './FieldRange.vue'
-export { default as FieldSelect } from './FieldSelect.vue'
-export { default as FieldTextArea } from './FieldTextArea.vue'
-export { default as FieldValues } from './FieldValues.vue'

packages/ui/src/components/Form/Input/index.ts

@@ -1,4 +0,0 @@
-export { default as BasicInputFile } from './BasicInputFile.vue'
-export { default as Input } from './Input.vue'
-export { default as InputFile } from './InputFile.vue'
-export { default as InputKeyValue } from './InputKeyValue.vue'

packages/ui/src/components/Form/Radio/index.ts

@@ -1 +0,0 @@
-export { default as Radio } from './Radio.vue'

packages/ui/src/components/Form/Range/index.ts

@@ -1,3 +0,0 @@
-export { default as ColorHueRange } from './ColorHueRange.vue'
-export { default as Range } from './Range.vue'
-export { default as RoundRange } from './RoundRange.vue'

packages/ui/src/components/Form/Select/index.ts

@@ -1,2 +0,0 @@
-export { default as Option } from './Option.vue'
-export { default as Select } from './Select.vue'

packages/ui/src/components/Form/SelectTab/index.ts

@@ -1 +0,0 @@
-export { default as SelectTab } from './SelectTab.vue'

packages/ui/src/components/Form/Textarea/index.ts

@@ -1,2 +0,0 @@
-export { default as BasicTextarea } from './Basic.vue'
-export { default as Textarea } from './Textarea.vue'

packages/ui/src/components/Form/index.ts

@@ -1,9 +0,0 @@
-export * from './Checkbox'
-export * from './Combobox'
-export * from './Field'
-export * from './Input'
-export * from './Radio'
-export * from './Range'
-export * from './Select'
-export * from './SelectTab'
-export * from './Textarea'

packages/ui/src/components/Misc/index.ts

@@ -1,3 +0,0 @@
-export { default as Button } from './Button.vue'
-export { default as Callout } from './Callout.vue'
-export { default as DoubleCheckButton } from './DoubleCheckButton.vue'

packages/ui/src/components/animations/index.ts

@@ -0,0 +1,9 @@
+export { default as TransitionBidirectional } from './transition-bidirectional.vue'
+export {
+  /**
+   * @deprecated Use TransitionBidirectional instead
+   */
+  default as BidirectionalTransition,
+} from './transition-bidirectional.vue'
+export { default as TransitionHorizontal } from './transition-horizontal.vue'
+export { default as TransitionVertical } from './transition-vertical.vue'

packages/ui/src/components/form/field/field-checkbox.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import Checkbox from '../Checkbox/Checkbox.vue'
+import { Checkbox } from '../checkbox'
 
 const props = defineProps<{
   label?: string

packages/ui/src/components/form/field/field-input.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import Input from '../Input/Input.vue'
+import { Input } from '../input'
 
 const props = withDefaults(defineProps<{
   label?: string

packages/ui/src/components/form/field/field-key-values.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { ref, watch } from 'vue'
 
-import InputKeyValue from '../Input/InputKeyValue.vue'
+import { InputKeyValue } from '../input'
 
 const props = defineProps<{
   label?: string

packages/ui/src/components/form/field/field-range.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import Range from '../Range/Range.vue'
+import { Range } from '../range'
 
 const props = withDefaults(defineProps<{
   min?: number

packages/ui/src/components/form/field/field-select.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { Select } from '@proj-airi/ui'
+import { Select } from '../select'
 
 const props = withDefaults(defineProps<{
   label: string

packages/ui/src/components/form/field/field-text-area.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import Textarea from '../Textarea/Textarea.vue'
+import { Textarea } from '../textarea'
 
 const props = withDefaults(defineProps<{
   label?: string

packages/ui/src/components/form/field/field-values.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import Input from '../Input/Input.vue'
+import { Input } from '../input'
 
 const props = defineProps<{
   label?: string

packages/ui/src/components/form/field/index.ts

@@ -0,0 +1,7 @@
+export { default as FieldCheckbox } from './field-checkbox.vue'
+export { default as FieldInput } from './field-input.vue'
+export { default as FieldKeyValues } from './field-key-values.vue'
+export { default as FieldRange } from './field-range.vue'
+export { default as FieldSelect } from './field-select.vue'
+export { default as FieldTextArea } from './field-text-area.vue'
+export { default as FieldValues } from './field-values.vue'

packages/ui/src/components/form/index.ts

@@ -0,0 +1,9 @@
+export * from './checkbox'
+export * from './combobox'
+export * from './field'
+export * from './input'
+export * from './radio'
+export * from './range'
+export * from './select'
+export * from './select-tab'
+export * from './textarea'

packages/ui/src/components/form/input/index.ts

@@ -0,0 +1,4 @@
+export { default as BasicInputFile } from './basic-input-file.vue'
+export { default as InputFile } from './input-file.vue'
+export { default as InputKeyValue } from './input-key-value.vue'
+export { default as Input } from './input.vue'

packages/ui/src/components/form/radio/index.ts

@@ -0,0 +1 @@
+export { default as Radio } from './radio.vue'

packages/ui/src/components/form/range/index.ts

@@ -0,0 +1,3 @@
+export { default as ColorHueRange } from './color-hue-range.vue'
+export { default as Range } from './range.vue'
+export { default as RoundRange } from './round-range.vue'

packages/ui/src/components/form/select-tab/index.ts

@@ -0,0 +1 @@
+export { default as SelectTab } from './select-tab.vue'

packages/ui/src/components/form/select/index.ts

@@ -0,0 +1,2 @@
+export { default as Option } from './option.vue'
+export { default as Select } from './select.vue'

packages/ui/src/components/form/select/select.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { provide, ref } from 'vue'
 
-import Combobox from '../Combobox/Combobox.vue'
+import { Combobox } from '../combobox'
 
 const props = defineProps<{
   options?: { label: string, value: string | number }[]

packages/ui/src/components/form/textarea/index.ts

@@ -0,0 +1,2 @@
+export { default as BasicTextarea } from './basic-text-area.vue'
+export { default as Textarea } from './textarea.vue'

packages/ui/src/components/form/textarea/textarea.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import BasicTextarea from './Basic.vue'
+import BasicTextarea from './basic-text-area.vue'
 
 const modelValue = defineModel<string>({ default: '' })
 </script>

packages/ui/src/components/layouts/collapsible.vue

@@ -1,7 +1,8 @@
 <script lang="ts" setup>
-import { TransitionVertical } from '@proj-airi/ui'
 import { watchEffect } from 'vue'
 
+import { TransitionVertical } from '../animations'
+
 const props = defineProps<{
   default?: boolean
   label?: string

packages/ui/src/components/misc/button.vue

@@ -1,7 +1,8 @@
 <script setup lang="ts">
-import { BidirectionalTransition } from '@proj-airi/ui'
 import { computed } from 'vue'
 
+import { TransitionBidirectional } from '../animations'
+
 // Define button variants for better type safety and maintainability
 type ButtonVariant = 'primary' | 'secondary' | 'secondary-muted' | 'danger' | 'caution' | 'pure' | 'ghost'
 
@@ -157,7 +158,7 @@ const baseClasses = computed(() => {
     :class="baseClasses"
   >
     <div class="flex flex-row items-center justify-center gap-2">
-      <BidirectionalTransition
+      <TransitionBidirectional
         from-class="opacity-0 mr-0! w-0!"
         active-class="transition-[width,margin] ease-in-out overflow-hidden transition-100"
       >
@@ -165,7 +166,7 @@ const baseClasses = computed(() => {
           <div v-if="loading" class="i-svg-spinners:ring-resize h-4 w-4" />
           <div v-else-if="icon" class="h-4 w-4" :class="icon" />
         </div>
-      </BidirectionalTransition>
+      </TransitionBidirectional>
       <span v-if="label">{{ label }}</span>
       <slot v-else />
     </div>

packages/ui/src/components/misc/index.ts

@@ -0,0 +1,3 @@
+export { default as Button } from './button.vue'
+export { default as Callout } from './callout.vue'
+export { default as DoubleCheckButton } from './double-check-button.vue'