fix: vue-tsc経由で型を出力するように修正

package.json

@@ -3,8 +3,8 @@
   "version": "0.3.5",
   "author": "nasum <[email protected]>",
   "scripts": {
-    "build": "yarn run check:types && npm run build:vue",
-    "check:types": "vue-tsc --noEmit",
+    "build": "npm run build:types && npm run build:vue",
+    "build:types": "vue-tsc --declaration --emitDeclarationOnly && tsc-alias -p tsconfig.json",
     "lint": "eslint \"src/**/*.{ts,vue}\"",
     "build:vue": "vite build",
     "chromatic": "npx chromatic storybook:build --project-token $CHROMATIC_TOKEN -b storybook:build --exit-zero-on-changes",
@@ -20,7 +20,8 @@
   },
   "main": "dist/lapras-frontend.js",
   "files": [
-    "dist"
+    "dist",
+    "types"
   ],
   "dependencies": {
     "@popperjs/core": "^2.11.8",
@@ -75,7 +76,7 @@
     "registry": "https://npm.pkg.github.com/"
   },
   "repository": "ssh://[email protected]/lapras-inc/lapras-frontend.git",
-  "types": "dist/main.d.ts",
+  "types": "types/main.d.ts",
   "eslintConfig": {
     "extends": [
       "plugin:storybook/recommended"

types/components/AvatarImg/AvatarImg.stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from '@storybook/vue3';
+import AvatarImg from './AvatarImg.vue';
+declare const meta: Meta<typeof AvatarImg>;
+export default meta;
+type Story = StoryObj<typeof AvatarImg>;
+export declare const Default: Story;
+export declare const NoImage: Story;

types/components/AvatarImg/AvatarImg.vue.d.ts

@@ -0,0 +1,12 @@
+declare const _default: import("vue").DefineComponent<{
+    src: {
+        type: StringConstructor;
+    };
+}, {
+    avatarDefault: string;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    src: {
+        type: StringConstructor;
+    };
+}>>, {}, {}>;
+export default _default;

types/components/Card/Card.stories.d.ts

@@ -0,0 +1,8 @@
+import type { Meta, StoryObj } from '@storybook/vue3';
+import Card from './Card.vue';
+declare const meta: Meta<typeof Card>;
+export default meta;
+type Story = StoryObj<typeof Card>;
+export declare const SkinDefault: Story;
+export declare const SkinBackground: Story;
+export declare const SkinBackgroundLine: Story;

dist/components/Card/Card.vue.d.ts → types/components/Card/Card.vue.d.ts

@@ -1,11 +1,10 @@
 import { PropType } from 'vue';
-
-declare const _default: import('vue').DefineComponent<{
+declare const _default: import("vue").DefineComponent<{
     skin: {
         type: PropType<"default" | "background" | "background-line">;
         default: string;
     };
-}, unknown, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+}, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     skin: {
         type: PropType<"default" | "background" | "background-line">;
         default: string;

types/components/CheckBox/CheckBox.stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from '@storybook/vue3';
+import CheckBox from './CheckBox.vue';
+declare const meta: Meta<typeof CheckBox>;
+export default meta;
+type Story = StoryObj<typeof CheckBox>;
+export declare const Default: Story;
+export declare const Disabled: Story;

dist/components/CheckBox/CheckBox.vue.d.ts → types/components/CheckBox/CheckBox.vue.d.ts

@@ -1,4 +1,4 @@
-declare const _default: import('vue').DefineComponent<{
+declare const _default: import("vue").DefineComponent<{
     modelValue: {
         type: BooleanConstructor;
         default: boolean;
@@ -9,9 +9,9 @@ declare const _default: import('vue').DefineComponent<{
     };
 }, {
     onInput: (e: Event) => void;
-}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     'update:modelValue': null;
-}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     modelValue: {
         type: BooleanConstructor;
         default: boolean;
@@ -23,7 +23,7 @@ declare const _default: import('vue').DefineComponent<{
 }>> & {
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
-    modelValue: boolean;
     disabled: boolean;
+    modelValue: boolean;
 }, {}>;
 export default _default;

types/components/EnhancedIconButton/EnhancedIconButton.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/vue3';
+import EnhancedIconButton from './EnhancedIconButton.vue';
+declare const meta: Meta<typeof EnhancedIconButton>;
+export default meta;
+type Story = StoryObj<typeof EnhancedIconButton>;
+export declare const Default: Story;

types/components/EnhancedIconButton/EnhancedIconButton.vue.d.ts

@@ -0,0 +1,14 @@
+declare const _default: import("vue").DefineComponent<{
+    tag: {
+        type: StringConstructor;
+        default: string;
+    };
+}, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    tag: {
+        type: StringConstructor;
+        default: string;
+    };
+}>>, {
+    tag: string;
+}, {}>;
+export default _default;

types/components/FieldGroup/FieldGroup.stories.d.ts

@@ -0,0 +1,12 @@
+import type { Meta, StoryObj } from '@storybook/vue3';
+import type { ComponentProps } from 'vue-component-type-helpers';
+import FieldGroup from './FieldGroup.vue';
+type FieldGroupPropsAndCustomArgs = ComponentProps<typeof FieldGroup> & {
+    error?: boolean;
+    note: string;
+};
+declare const meta: Meta<FieldGroupPropsAndCustomArgs>;
+export default meta;
+type Story = StoryObj<FieldGroupPropsAndCustomArgs>;
+export declare const Default: Story;
+export declare const HasOptions: Story;

dist/components/FieldGroup/FieldGroup.vue.d.ts → types/components/FieldGroup/FieldGroup.vue.d.ts

@@ -1,6 +1,5 @@
 import { PropType } from 'vue';
-
-declare const _default: import('vue').DefineComponent<{
+declare const _default: import("vue").DefineComponent<{
     label: {
         type: StringConstructor;
         default: string;
@@ -17,7 +16,7 @@ declare const _default: import('vue').DefineComponent<{
         type: PropType<boolean | null>;
         default: null;
     };
-}, unknown, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+}, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     label: {
         type: StringConstructor;
         default: string;
@@ -35,8 +34,8 @@ declare const _default: import('vue').DefineComponent<{
         default: null;
     };
 }>>, {
-    label: string;
     required: boolean | null;
+    label: string;
     subLabel: string;
     errorMessage: string;
 }, {}>;

types/components/FlatButton/FlatButton.stories.d.ts

@@ -0,0 +1,29 @@
+import type { Meta, StoryObj } from '@storybook/vue3';
+import type { ComponentProps } from 'vue-component-type-helpers';
+import FlatButton from './FlatButton.vue';
+type FlatButtonPropsAndCustomArgs = ComponentProps<typeof FlatButton> & {
+    label: string;
+    leftIcon?: string;
+    rightIcon?: string;
+};
+declare const meta: Meta<FlatButtonPropsAndCustomArgs>;
+export default meta;
+type Story = StoryObj<FlatButtonPropsAndCustomArgs>;
+export declare const Default: Story;
+export declare const SkinImportant: Story;
+export declare const SkinPrimary: Story;
+export declare const SkinPrimaryLine: Story;
+export declare const SkinSecondary: Story;
+export declare const SkinTertiary: Story;
+export declare const SkinMuted: Story;
+export declare const SkinDisabled: Story;
+export declare const SizeXl: Story;
+export declare const SizeL: Story;
+export declare const SizeM: Story;
+export declare const SizeS: Story;
+export declare const SizeXs: Story;
+export declare const HasIcons: Story;
+export declare const HasLeftIcon: Story;
+export declare const HasRightIcon: Story;
+export declare const Inline: Story;
+export declare const Enhanced: Story;

dist/components/FlatButton/FlatButton.vue.d.ts → types/components/FlatButton/FlatButton.vue.d.ts

@@ -1,6 +1,5 @@
 import { PropType } from 'vue';
-
-declare const _default: import('vue').DefineComponent<{
+declare const _default: import("vue").DefineComponent<{
     skin: {
         type: PropType<"important" | "primary" | "primary-line" | "secondary" | "tertiary" | "muted" | "disabled">;
         default: string;
@@ -21,7 +20,7 @@ declare const _default: import('vue').DefineComponent<{
         type: StringConstructor;
         default: string;
     };
-}, unknown, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+}, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     skin: {
         type: PropType<"important" | "primary" | "primary-line" | "secondary" | "tertiary" | "muted" | "disabled">;
         default: string;
@@ -43,10 +42,10 @@ declare const _default: import('vue').DefineComponent<{
         default: string;
     };
 }>>, {
-    skin: "disabled" | "important" | "primary" | "primary-line" | "secondary" | "tertiary" | "muted";
-    tag: string;
-    size: "s" | "xl" | "l" | "m" | "xs";
     disabled: boolean;
+    size: "s" | "m" | "xl" | "l" | "xs";
+    tag: string;
+    skin: "disabled" | "muted" | "important" | "primary" | "primary-line" | "secondary" | "tertiary";
     enhanced: boolean;
 }, {}>;
 export default _default;

types/components/Icon/Icon.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/vue3';
+import Icon from './Icon.vue';
+declare const meta: Meta<typeof Icon>;
+export default meta;
+export type Story = StoryObj<typeof Icon>;
+export declare const IconList: Story;