style: sort imports with prettier

.prettierrc.json

@@ -4,5 +4,6 @@
   "tabWidth": 2,
   "singleQuote": false,
   "printWidth": 100,
-  "trailingComma": "all"
+  "trailingComma": "all",
+  "plugins": ["prettier-plugin-organize-imports"]
 }

apps/alpha-test-app/src/components/layout-demo/SidebarDemo.vue

@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { OnyxButton, OnyxHeadline } from "sit-onyx";
 import xSmall from "@sit-onyx/icons/x-small.svg?raw";
+import { OnyxButton, OnyxHeadline } from "sit-onyx";
 
 const isOpen = defineModel<boolean>();
 defineProps<{ isClosable?: boolean }>();

apps/alpha-test-app/src/components/layout-demo/TempOverlayDemo.vue

@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { OnyxButton, OnyxHeadline } from "sit-onyx";
 import xSmall from "@sit-onyx/icons/x-small.svg?raw";
+import { OnyxButton, OnyxHeadline } from "sit-onyx";
 
 const isOpen = defineModel<boolean>();
 defineProps<{ transparent?: boolean }>();

apps/alpha-test-app/src/views/HomeView.vue

@@ -1,5 +1,6 @@
 <script lang="ts" setup>
 import emojiHappy2 from "@sit-onyx/icons/emoji-happy-2.svg?raw";
+import { useStorage } from "@vueuse/core";
 import {
   DENSITIES,
   OnyxAvatar,
@@ -30,7 +31,6 @@ import {
 import { capitalize, computed, ref } from "vue";
 import { useI18n } from "vue-i18n";
 import LanguageSelection from "../components/LanguageSelection.vue";
-import { useStorage } from "@vueuse/core";
 
 const { locale } = useI18n();
 

apps/alpha-test-app/vite.config.ts

@@ -1,5 +1,5 @@
-import { defineConfig } from "vite";
 import vue from "@vitejs/plugin-vue";
+import { defineConfig } from "vite";
 
 // https://vitejs.dev/config/
 export default defineConfig({

package.json

@@ -44,6 +44,7 @@
     "jsdom": "^24.1.0",
     "lint-staged": "^15.2.7",
     "prettier": "^3.3.2",
+    "prettier-plugin-organize-imports": "^4.0.0",
     "publint": "^0.2.8",
     "rimraf": "^5.0.7",
     "sass": "^1.77.6",

packages/headless/src/composables/comboBox/TestCombobox.ct.tsx

@@ -1,7 +1,7 @@
 import { test } from "@playwright/experimental-ct-vue";
-import TestCombobox from "./TestCombobox.vue";
-import { comboboxTesting, comboboxSelectOnlyTesting } from "./createComboBox.ct";
+import { comboboxSelectOnlyTesting, comboboxTesting } from "./createComboBox.ct";
 import SelectOnlyCombobox from "./SelectOnlyCombobox.vue";
+import TestCombobox from "./TestCombobox.vue";
 
 test("combobox", async ({ mount, page }) => {
   await mount(<TestCombobox />);

packages/headless/src/composables/menuButton/TestMenuButton.vue

@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { createMenuButton } from "./createMenuButton";
 import { ref } from "vue";
+import { createMenuButton } from "./createMenuButton";
 
 const items = Array.from({ length: 10 }, (_, index) => {
   const id = index + 1;

packages/headless/src/index.ts

@@ -1,6 +1,6 @@
 export * from "./composables/comboBox/createComboBox";
 export * from "./composables/listbox/createListbox";
-export * from "./composables/tooltip/createTooltip";
 export * from "./composables/menuButton/createMenuButton";
+export * from "./composables/tooltip/createTooltip";
 export { createId } from "./utils/id";
 export { isPrintableCharacter, wasKeyPressed } from "./utils/keyboard";

packages/nuxt/src/runtime/plugins/onyx.ts

@@ -1,8 +1,8 @@
-import type { Composer } from "vue-i18n";
-import type { LocaleObject } from "@nuxtjs/i18n";
 import { computed, watchEffect, type ComputedRef } from "#imports";
+import type { LocaleObject } from "@nuxtjs/i18n";
 import { defineNuxtPlugin, useNuxtApp } from "nuxt/app";
 import { provideI18n, syncGlobalOptionalText, type TranslationFunction } from "sit-onyx";
+import type { Composer } from "vue-i18n";
 
 type I18n = Composer & { localeProperties: ComputedRef<LocaleObject> };
 

packages/sit-onyx/src/components/OnyxFlyoutMenu/future/OnyxFlyoutMenu.stories.ts

@@ -1,8 +1,8 @@
 import { defineStorybookActionsAndVModels } from "@sit-onyx/storybook-utils";
 import type { Meta, StoryObj } from "@storybook/vue3";
 import { h } from "vue";
-import OnyxNavItem from "../../OnyxNavItem/future/OnyxNavItem.vue";
 import OnyxButton from "../../OnyxButton/OnyxButton.vue";
+import OnyxNavItem from "../../OnyxNavItem/future/OnyxNavItem.vue";
 import OnyxFlyoutMenu from "./OnyxFlyoutMenu.vue";
 
 const meta: Meta<typeof OnyxFlyoutMenu> = {

packages/sit-onyx/src/components/OnyxFlyoutMenu/future/OnyxFlyoutMenu.vue

@@ -1,8 +1,8 @@
 <script setup lang="ts" generic="TValue extends SelectOptionValue = SelectOptionValue">
 import { createMenuButton } from "@sit-onyx/headless";
-import type { SelectOptionValue } from "../../../types";
 import { provide, type VNode } from "vue";
 import { injectI18n } from "../../../i18n";
+import type { SelectOptionValue } from "../../../types";
 import { MENU_BUTTON_ITEM_INJECTION_KEY } from "../../OnyxMenuItem/types";
 
 const slots = defineSlots<{

packages/sit-onyx/src/components/OnyxFormElement/types.ts

@@ -1,5 +1,5 @@
-import type { FormErrorMessages } from "../../composables/useCustomValidity";
 import type { RequiredMarkerProp } from "../../composables/required";
+import type { FormErrorMessages } from "../../composables/useCustomValidity";
 
 export type OnyxFormElementProps = RequiredMarkerProp & {
   /**

packages/sit-onyx/src/components/OnyxInfoTooltip/OnyxInfoTooltip.ct.tsx

@@ -1,5 +1,5 @@
-import { expect, test } from "../../playwright/a11y";
 import type { Locator } from "@playwright/test";
+import { expect, test } from "../../playwright/a11y";
 import { executeMatrixScreenshotTest } from "../../playwright/screenshots";
 import OnyxInfoTooltip from "./OnyxInfoTooltip.vue";
 

packages/sit-onyx/src/components/OnyxInput/OnyxInput.ct.tsx

@@ -1,9 +1,9 @@
+import type { Locator } from "@playwright/test";
+import type { FormErrorMessages } from "src/composables/useCustomValidity";
 import { DENSITIES } from "../../composables/density";
 import { expect, test } from "../../playwright/a11y";
-import type { Locator } from "@playwright/test";
 import { executeMatrixScreenshotTest } from "../../playwright/screenshots";
 import OnyxInput from "./OnyxInput.vue";
-import type { FormErrorMessages } from "src/composables/useCustomValidity";
 
 test.describe("Screenshot tests", () => {
   const isTooltipVisible = async (tooltip: Locator) => {

packages/sit-onyx/src/components/OnyxLink/OnyxLink.vue

@@ -1,11 +1,11 @@
 <script lang="ts" setup>
 import arrowSmallUpRight from "@sit-onyx/icons/arrow-small-up-right.svg?raw";
 import { computed } from "vue";
+import { injectI18n } from "../../i18n";
 import { isExternalLink } from "../../utils";
 import OnyxIcon from "../OnyxIcon/OnyxIcon.vue";
-import type { OnyxLinkProps } from "./types";
 import OnyxVisuallyHidden from "../OnyxVisuallyHidden/OnyxVisuallyHidden.vue";
-import { injectI18n } from "../../i18n";
+import type { OnyxLinkProps } from "./types";
 
 const props = withDefaults(defineProps<OnyxLinkProps>(), {
   target: "_self",

packages/sit-onyx/src/components/OnyxSelectInput/OnyxSelectInput.vue

@@ -1,4 +1,5 @@
 <script lang="ts" setup generic="TValue extends SelectOptionValue">
+import { CLOSING_KEYS, OPENING_KEYS } from "@sit-onyx/headless";
 import chevronDownUp from "@sit-onyx/icons/chevron-down-up.svg?raw";
 import { computed, ref, watch } from "vue";
 import { useDensity } from "../../composables/density";
@@ -13,7 +14,6 @@ import OnyxLoadingIndicator from "../OnyxLoadingIndicator/OnyxLoadingIndicator.v
 import OnyxSkeleton from "../OnyxSkeleton/OnyxSkeleton.vue";
 import OnyxTooltip from "../OnyxTooltip/OnyxTooltip.vue";
 import type { OnyxSelectInputProps } from "./types";
-import { CLOSING_KEYS, OPENING_KEYS } from "@sit-onyx/headless";
 
 defineOptions({ inheritAttrs: false });
 const { rootAttrs, restAttrs } = useRootAttrs();

packages/sit-onyx/src/components/OnyxSelectInput/types.ts

@@ -1,7 +1,7 @@
-import type { CustomValidityProp } from "../../composables/useCustomValidity";
 import type { SelectOption } from "../..";
 import type { DensityProp } from "../../composables/density";
 import type { RequiredMarkerProp } from "../../composables/required";
+import type { CustomValidityProp } from "../../composables/useCustomValidity";
 import type { AutofocusProp, SelectOptionValue } from "../../types";
 import type { OnyxFormElementProps } from "../OnyxFormElement/types";
 

packages/sit-onyx/src/components/OnyxTextarea/OnyxTextarea.ct.tsx

@@ -1,6 +1,6 @@
+import type { Locator } from "@playwright/test";
 import { DENSITIES } from "../../composables/density";
 import { expect, test } from "../../playwright/a11y";
-import type { Locator } from "@playwright/test";
 import { executeMatrixScreenshotTest } from "../../playwright/screenshots";
 import OnyxTextarea from "./OnyxTextarea.vue";
 

packages/sit-onyx/src/composables/useCustomValidity.ts

@@ -1,9 +1,9 @@
 import { computed, ref, watch, watchEffect, type Directive } from "vue";
-import { getFirstInvalidType, transformValidityStateToObject } from "../utils/validity";
-import { areObjectsFlatEqual } from "../utils/objects";
-import enUS from "../i18n/locales/en-US.json";
-import { injectI18n } from "../i18n";
 import type { InputType } from "../components/OnyxInput/types";
+import { injectI18n } from "../i18n";
+import enUS from "../i18n/locales/en-US.json";
+import { areObjectsFlatEqual } from "../utils/objects";
+import { getFirstInvalidType, transformValidityStateToObject } from "../utils/validity";
 
 export type CustomErrorType = string | FormErrorMessages;
 

packages/sit-onyx/src/composables/useManagedState.spec.ts

@@ -1,6 +1,6 @@
 import { describe, expect, test, vi } from "vitest";
-import { useManagedState } from "./useManagedState";
 import { reactive, toRef } from "vue";
+import { useManagedState } from "./useManagedState";
 
 describe("useManagedState", () => {
   const props = reactive({ custom: "customValue" as string | undefined });

packages/sit-onyx/src/i18n/index.ts

@@ -1,5 +1,3 @@
-import type { FlattenedKeysOf, TranslationValue } from "../types/i18n";
-import type { DeepPartial } from "../types/utils";
 import {
   computed,
   inject,
@@ -9,6 +7,8 @@ import {
   type InjectionKey,
   type MaybeRef,
 } from "vue";
+import type { FlattenedKeysOf, TranslationValue } from "../types/i18n";
+import type { DeepPartial } from "../types/utils";
 import enUS from "./locales/en-US.json";
 
 /**

packages/sit-onyx/src/utils/objects.spec.ts

@@ -1,4 +1,4 @@
-import { expect, test, describe } from "vitest";
+import { describe, expect, test } from "vitest";
 import { areObjectsFlatEqual, groupByKey } from "./objects";
 
 const referenceObj = { a: 42, b: "foo", c: null, d: true };