UI-397 : upgrading unocss (#395)

youcan-shop · Aug 5, 2024 · e4b614e · e4b614e
1 parent 2cd376e
commit e4b614e
Show file tree

Hide file tree

Showing 27 changed files with 1,412 additions and 1,037 deletions.
diff --git a/packages/alto/package.json b/packages/alto/package.json
@@ -102,7 +102,7 @@
     "storybook": "^8.0.10",
     "storybook-addon-rtl": "^1.0.0",
     "typescript": "4.8.2",
-    "unocss": "^0.47.6",
+    "unocss": "^0.58.0",
     "vite": "^5.0.11",
     "vite-bundle-visualizer": "^1.0.1",
     "vue": "^3.4.5",

diff --git a/packages/alto/src/components/Alert/Alert.stories.ts b/packages/alto/src/components/Alert/Alert.stories.ts
@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
 import { ref } from 'vue';
-import { Alert } from '~/components';
+import Alert from './Alert.vue';
 
 type Story = StoryObj<typeof Alert>;
 const meta: Meta<typeof Alert> = {

diff --git a/packages/alto/src/components/Breadcrumbs/Breadcrumbs.stories.ts b/packages/alto/src/components/Breadcrumbs/Breadcrumbs.stories.ts
@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
-import { Breadcrumbs } from '~/components';
+import Breadcrumbs from './Breadcrumbs.vue';
 
 type Story = StoryObj<typeof Breadcrumbs>;
 

diff --git a/packages/alto/src/components/Color/ColorInput.stories.ts b/packages/alto/src/components/Color/ColorInput.stories.ts
@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
 import { ref } from 'vue';
-import { ColorInput } from '~/components';
+import ColorInput from './ColorInput.vue';
 
 type Story = StoryObj<typeof ColorInput>;
 const meta: Meta<typeof ColorInput> = {

diff --git a/packages/alto/src/components/DatePicker/DatePicker.stories.ts b/packages/alto/src/components/DatePicker/DatePicker.stories.ts
@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
 import { ref } from 'vue';
-import { DatePicker } from '~/components';
+import DatePicker from './DatePicker.vue';
 import type { DateValue } from '~/types';
 
 type Story = StoryObj<typeof DatePicker>;

diff --git a/packages/alto/src/components/DatePicker/DatePickerPresets.stories.ts b/packages/alto/src/components/DatePicker/DatePickerPresets.stories.ts
@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
 import { ref } from 'vue';
-import { DatePicker } from '~/components';
+import DatePicker from './DatePicker.vue';
 import type { DateRangeValue, Preset } from '~/types';
 import { getDateDaysAgo, moveToMonth } from '~/helpers';
 

diff --git a/packages/alto/src/components/DatePicker/DatePickerRange.stories.ts b/packages/alto/src/components/DatePicker/DatePickerRange.stories.ts
@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
 import { ref } from 'vue';
-import { DatePicker } from '~/components';
+import DatePicker from './DatePicker.vue';
 import type { DateRangeValue } from '~/types';
 
 type Story = StoryObj<typeof DatePicker>;

diff --git a/packages/alto/src/components/Dropdown/Dropdown.stories.ts b/packages/alto/src/components/Dropdown/Dropdown.stories.ts
@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
 import { ref } from 'vue';
-import { Dropdown } from '~/components';
+import Dropdown from './Dropdown.vue';
 import type { DropdownValue } from '~/types';
 
 type Story = StoryObj<typeof Dropdown>;

diff --git a/packages/alto/src/components/Increment/Increment.stories.ts b/packages/alto/src/components/Increment/Increment.stories.ts
@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
 import { ref } from 'vue';
-import { Increment } from '~/components';
+import Increment from './Increment.vue';
 
 type Story = StoryObj<typeof Increment>;
 const meta: Meta<typeof Increment> = {

diff --git a/packages/alto/src/components/Modal/Modal.stories.ts b/packages/alto/src/components/Modal/Modal.stories.ts
@@ -1,6 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
 import { ref } from 'vue';
-import { Button, Modal } from '~/components';
+import Modal from './Modal.vue';
+import { Button } from '~/components';
 
 type Story = StoryObj<typeof Modal>;
 const meta: Meta<typeof Modal> = {

diff --git a/packages/alto/src/components/ResourcePicker/ResourcePicker.stories.ts b/packages/alto/src/components/ResourcePicker/ResourcePicker.stories.ts
@@ -1,6 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
 import { ref } from 'vue';
-import { Button, ResourcePicker } from '~/components';
+import ResourcePicker from './ResourcePicker.vue';
+import { Button } from '~/components';
 import type { Resource } from '~/components/ResourcePicker/types';
 
 type Story = StoryObj<typeof ResourcePicker>;

diff --git a/packages/alto/src/components/Table/Table.stories.ts b/packages/alto/src/components/Table/Table.stories.ts
@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
 import { ref } from 'vue';
-import { Table } from '~/components';
+import Table from './Table.vue';
 import type { TableColumn } from '~/types';
 
 type Story = StoryObj<typeof Table>;

diff --git a/packages/alto/src/components/Tag/Tag.stories.ts b/packages/alto/src/components/Tag/Tag.stories.ts
@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
 import { ref } from 'vue';
 import type { TagItemValue } from './types';
-import { Tag } from '~/components';
+import Tag from './Tag.vue';
 
 type Story = StoryObj<typeof Tag>;
 const meta: Meta<typeof Tag> = {

diff --git a/packages/alto/src/components/ToastContainer/Toast.stories.ts b/packages/alto/src/components/ToastContainer/Toast.stories.ts
@@ -1,7 +1,8 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
+import ToastContainer from './ToastContainer.vue';
 import type { ToastOptions } from '~/types';
 import { toast } from '~/helpers';
-import { Button, ToastContainer } from '~/components';
+import { Button } from '~/components';
 
 type Story = StoryObj<typeof ToastContainer>;
 const meta: Meta<typeof ToastContainer> = {

diff --git a/packages/alto/src/components/Upload/Upload.stories.ts b/packages/alto/src/components/Upload/Upload.stories.ts
@@ -1,6 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
 import { ref } from 'vue';
-import { Upload, UploadPreview } from '~/components';
+import Upload from './Upload.vue';
+import UploadPreview from './UploadPreview.vue';
 
 type Story = StoryObj<typeof Upload>;
 const meta: Meta<typeof Upload> = {

diff --git a/packages/alto/src/index.ts b/packages/alto/src/index.ts
@@ -1 +1,3 @@
+import 'uno.css';
+
 export * from './components';
diff --git a/packages/vue3/.storybook/main.ts b/packages/vue3/.storybook/main.ts
@@ -1,9 +1,8 @@
 import path from 'path';
-import Unocss from 'unocss/vite';
+import UnoCSS from 'unocss/vite';
 
 module.exports = {
   "stories": [
-    "../src/**/*.mdx",
     "../src/**/*.stories.@(js|jsx|ts|tsx)"
   ],
   "addons": [
@@ -20,7 +19,7 @@ module.exports = {
   },
   async viteFinal(config, { configType }) {
     config.resolve.alias['~'] =  `${path.resolve(__dirname, 'src')}/`;
-    config.plugins.push(Unocss);
+    config.plugins.push(UnoCSS);
     return config;
   }
 }
diff --git a/packages/vue3/package.json b/packages/vue3/package.json
@@ -86,7 +86,7 @@
     "sass": "1.54.8",
     "storybook": "^7.6.10",
     "typescript": "4.8.2",
-    "unocss": "^0.47.6",
+    "unocss": "^0.58.0",
     "vite": "^5.0.11",
     "vite-bundle-visualizer": "^1.0.1",
     "vue": "^3.4.5",

diff --git a/packages/vue3/src/components/DateInput/SingleDateInput.stories.ts b/packages/vue3/src/components/DateInput/SingleDateInput.stories.ts
@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
 import { ref } from 'vue';
-import { SingleDateInput } from '~/components';
+import SingleDateInput from './SingleDateInput.vue';
 
 type Story = StoryObj<typeof SingleDateInput>;
 const meta: Meta<typeof SingleDateInput> = {

diff --git a/packages/vue3/src/components/Dropdown/Dropdown.stories.ts b/packages/vue3/src/components/Dropdown/Dropdown.stories.ts
@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
 import { ref } from 'vue';
-import { Dropdown } from '~/components';
+import Dropdown from './Dropdown.vue';
 
 type Story = StoryObj<typeof Dropdown>;
 const meta: Meta<typeof Dropdown> = {

diff --git a/packages/vue3/src/components/Dropdown/MultiselectDropdown.stories.ts b/packages/vue3/src/components/Dropdown/MultiselectDropdown.stories.ts
@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
 import { ref } from 'vue';
-import { MultiselectDropdown } from '~/components';
+import MultiselectDropdown from './MultiselectDropdown.vue';
 
 type Story = StoryObj<typeof MultiselectDropdown>;
 const meta: Meta<typeof MultiselectDropdown> = {

diff --git a/packages/vue3/src/components/Modal/Modal.stories.ts b/packages/vue3/src/components/Modal/Modal.stories.ts
@@ -1,6 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
 import { ref } from 'vue';
-import { Modal, PrimaryButton } from '~/components';
+import Modal from './Modal.vue';
+import { PrimaryButton } from '~/components';
 
 type Story = StoryObj<typeof Modal>;
 const meta: Meta<typeof Modal> = {

diff --git a/packages/vue3/src/components/ResourcePicker/ResourcePicker.stories.ts b/packages/vue3/src/components/ResourcePicker/ResourcePicker.stories.ts
@@ -1,6 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
 import { ref } from 'vue';
-import { PrimaryButton, ResourcePicker } from '~/components';
+import ResourcePicker from './ResourcePicker.vue';
+import { PrimaryButton } from '~/components';
 import type { Resource } from '~/components/ResourcePicker/types';
 
 type Story = StoryObj<typeof ResourcePicker>;

diff --git a/packages/vue3/src/components/Tag/Tag.stories.ts b/packages/vue3/src/components/Tag/Tag.stories.ts
@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
 import { ref } from 'vue';
 import type { TagItemValue } from './types';
-import { Tag } from '~/components';
+import Tag from './Tag.vue';
 
 type Story = StoryObj<typeof Tag>;
 const meta: Meta<typeof Tag> = {

diff --git a/packages/vue3/src/components/ToastContainer/Toast.stories.ts b/packages/vue3/src/components/ToastContainer/Toast.stories.ts
@@ -1,7 +1,8 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
+import ToastContainer from './ToastContainer.vue';
 import type { ToastOptions } from '~/types';
 import { toast } from '~/helpers';
-import { PrimaryButton, ToastContainer } from '~/components';
+import { PrimaryButton } from '~/components';
 
 type Story = StoryObj<typeof ToastContainer>;
 const meta: Meta<typeof ToastContainer> = {

diff --git a/packages/vue3/src/components/Upload/MediaInput.stories.ts b/packages/vue3/src/components/Upload/MediaInput.stories.ts
@@ -1,6 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/vue3';
 import { ref } from 'vue';
-import { MediaInput, UploadedMedia } from '~/components';
+import UploadedMedia from './UploadedMedia.vue';
+import { MediaInput } from '~/components';
 
 type Story = StoryObj<typeof MediaInput>;
 const meta: Meta<typeof MediaInput> = {