@taikai/rocket-kit 3.0.2 → 3.0.4

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "3.0.2",
+  "version": "3.0.4",
   "name": "@taikai/rocket-kit",
   "author": "taikai",
   "description": "TAIKAI Design System",
@@ -31,8 +31,8 @@
     "prepare": "tsdx build",
     "size": "size-limit",
     "analyze": "size-limit --why",
-    "storybook": "start-storybook -s ./static -p 6006 --no-manager-cache",
-    "build-storybook": "build-storybook -s ./static",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build",
     "chromatic": "dotenv cross-var npx chromatic --project-token %CHROMATIC_PROJECT_TOKEN%"
   },
   "peerDependencies": {
@@ -63,14 +63,18 @@
   ],
   "devDependencies": {
     "@babel/core": "^7.13.8",
+    "@babel/preset-env": "^7.22.5",
+    "@babel/preset-typescript": "^7.22.5",
     "@size-limit/preset-small-lib": "^4.10.0",
-    "@storybook/addon-a11y": "^6.5.10",
-    "@storybook/addon-controls": "^6.5.10",
-    "@storybook/addon-essentials": "^6.5.10",
-    "@storybook/addon-links": "^6.5.10",
-    "@storybook/addons": "^6.5.10",
-    "@storybook/react": "^6.5.10",
-    "@storybook/theming": "^6.5.10",
+    "@storybook/addon-a11y": "^7.0.22",
+    "@storybook/addon-controls": "^7.0.22",
+    "@storybook/addon-essentials": "^7.0.22",
+    "@storybook/addon-links": "^7.0.22",
+    "@storybook/addon-styling": "^1.3.0",
+    "@storybook/addons": "^7.0.22",
+    "@storybook/react": "^7.0.22",
+    "@storybook/react-webpack5": "^7.0.22",
+    "@storybook/theming": "^7.0.22",
     "@testing-library/jest-dom": "^5.11.9",
     "@testing-library/react": "^11.2.2",
     "@testing-library/user-event": "^13.0.7",
@@ -82,28 +86,31 @@
     "@types/styled-components": "^5.1.4",
     "babel-jest": "^26.6.3",
     "babel-loader": "^8.2.2",
-    "babel-plugin-macros": "^3.0.1",
+    "babel-plugin-macros": "^3.1.0",
     "chromatic": "^6.17.4",
     "cross-var": "^1.1.0",
     "dotenv-cli": "^4.0.0",
     "eslint-plugin-jest-dom": "^3.6.5",
     "eslint-plugin-jsx-a11y": "^6.4.1",
+    "eslint-plugin-storybook": "^0.6.12",
     "eslint-plugin-testing-library": "^3.10.1",
     "husky": "^5.1.3",
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
     "react-is": "^17.0.1",
     "size-limit": "^4.10.0",
-    "storybook-addon-designs": "^6.3.1",
+    "storybook": "^7.0.22",
     "tsdx": "^0.14.1",
     "tslib": "^2.0.3",
-    "typescript": "^4.2.3"
+    "typescript": "^4.2.3",
+    "webpack-cli": "^5.1.4"
   },
   "publishConfig": {
     "access": "public",
     "registry": "https://registry.npmjs.org"
   },
   "dependencies": {
+    "@babel/preset-react": "^7.22.5",
     "@types/uuid": "^8.3.4",
     "boring-avatars": "^1.5.8",
     "jest-styled-components": "^7.0.3",

package/dist/atoms/avatar-image/stories/avatar-image.stories.d.ts

@@ -1,48 +0,0 @@
-import React from 'react';
-import { AvatarProps } from '..';
-declare const _default: {
-    title: string;
-    component: (props: AvatarProps) => React.JSX.Element;
-    argTypes: {
-        boringType: {
-            control: {
-                type: string;
-                options: string[];
-            };
-        };
-    };
-};
-export default _default;
-export declare const PNG: {
-    (args: AvatarProps): React.JSX.Element;
-    args: {
-        size: number;
-        boring: boolean;
-        boringType: string;
-        square: boolean;
-        alt: string;
-        url: string;
-    };
-};
-export declare const SVG: {
-    (args: AvatarProps): React.JSX.Element;
-    args: {
-        size: number;
-        boring: boolean;
-        boringType: string;
-        square: boolean;
-        alt: string;
-        url: string;
-    };
-};
-export declare const BoringAvatar: {
-    (args: AvatarProps): React.JSX.Element;
-    args: {
-        size: number;
-        boring: boolean;
-        boringType: string;
-        square: boolean;
-        alt: string;
-        url: string;
-    };
-};

package/dist/atoms/button/stories/button.stories.d.ts

@@ -1,57 +0,0 @@
-import React from 'react';
-import { ButtonProps } from '..';
-declare const _default: {
-    title: string;
-    component: (props: ButtonProps) => React.JSX.Element;
-    argTypes: {
-        variant: {
-            control: {
-                type: string;
-                options: string[];
-            };
-        };
-        color: {
-            control: {
-                type: string;
-                options: string[];
-            };
-        };
-        txtColor: {
-            control: {
-                type: string;
-                options: string[];
-            };
-        };
-        iconPosition: {
-            control: {
-                type: string;
-                options: string[];
-            };
-        };
-        icon: {
-            control: {
-                type: string;
-                options: string[];
-            };
-        };
-    };
-};
-export default _default;
-export declare const ButtonComponent: {
-    (args: ButtonProps): React.JSX.Element;
-    storyName: string;
-    args: {
-        variant: string;
-        rounded: boolean;
-        color: string;
-        txtColor: string;
-        className: string;
-        value: string;
-        iconPosition: string;
-        icon: string;
-        loading: boolean;
-        ariaLabel: string;
-        ariaHidden: boolean;
-        disabled: boolean;
-    };
-};

package/dist/atoms/button-dropdown/stories/button-dropdown.stories.d.ts

@@ -1,56 +0,0 @@
-import React from 'react';
-import { ActionsMenuInterface } from '..';
-declare const _default: {
-    title: string;
-    component: <T>(props: ActionsMenuInterface<T>) => React.JSX.Element;
-    argTypes: {
-        variant: {
-            control: {
-                type: string;
-                options: string[];
-            };
-        };
-        color: {
-            control: {
-                type: string;
-                options: string[];
-            };
-        };
-        txtColor: {
-            control: {
-                type: string;
-                options: string[];
-            };
-        };
-        icon: {
-            control: {
-                type: string;
-                options: string[];
-            };
-        };
-    };
-};
-export default _default;
-export declare const ButtonDropdownComponent: {
-    <T>(args: ActionsMenuInterface<T>): React.JSX.Element;
-    storyName: string;
-    args: {
-        variant: string;
-        rounded: boolean;
-        color: string;
-        txtColor: string;
-        className: string;
-        value: string;
-        icon: string;
-        ariaLabel: string;
-        ariaHidden: boolean;
-        actions: {
-            id: string;
-            value: string;
-            url: null;
-            action: () => void;
-        }[];
-        startsOpen: boolean;
-        disabled: boolean;
-    };
-};

package/dist/atoms/button-link/stories/button-link.stories.d.ts

@@ -1,58 +0,0 @@
-import React from 'react';
-import { ButtonLinkProps } from '..';
-declare const _default: {
-    title: string;
-    component: (props: ButtonLinkProps) => React.JSX.Element;
-    argTypes: {
-        variant: {
-            control: {
-                type: string;
-                options: string[];
-            };
-        };
-        color: {
-            control: {
-                type: string;
-                options: string[];
-            };
-        };
-        txtColor: {
-            control: {
-                type: string;
-                options: string[];
-            };
-        };
-        iconPosition: {
-            control: {
-                type: string;
-                options: string[];
-            };
-        };
-        icon: {
-            control: {
-                type: string;
-                options: string[];
-            };
-        };
-    };
-};
-export default _default;
-export declare const ButtonLinkComponent: {
-    (args: ButtonLinkProps): React.JSX.Element;
-    storyName: string;
-    args: {
-        variant: string;
-        rounded: boolean;
-        color: string;
-        txtColor: string;
-        className: string;
-        url: string;
-        blank: boolean;
-        rel: string;
-        value: string;
-        iconPosition: string;
-        icon: string;
-        ariaLabel: string;
-        ariaHidden: boolean;
-    };
-};

package/dist/atoms/checkbox-button/stories/checkbox-button.stories.d.ts

@@ -1,24 +0,0 @@
-import React from 'react';
-import { CheckboxButtonProps } from '..';
-declare const _default: {
-    title: string;
-    component: (props: CheckboxButtonProps) => React.JSX.Element;
-    argTypes: {
-        onChange: {
-            action: () => void;
-        };
-    };
-};
-export default _default;
-export declare const CheckboxButtonComponent: {
-    (args: CheckboxButtonProps): React.JSX.Element;
-    storyName: string;
-    args: {
-        label: string;
-        value: string;
-        checked: boolean;
-        className: string;
-        disabled: boolean;
-        required: boolean;
-    };
-};

package/dist/atoms/file-picker/stories/file-picker.stories.d.ts

@@ -1,22 +0,0 @@
-import React from 'react';
-import { FilePickerProps } from '..';
-declare const _default: {
-    title: string;
-    component: (props: FilePickerProps) => React.JSX.Element;
-};
-export default _default;
-export declare const FilePickerComponent: {
-    (args: FilePickerProps): React.JSX.Element;
-    story: {
-        name: string;
-        args: {
-            multiple: boolean;
-            name: string;
-            placeholder: string;
-            pluralText: string;
-            error: string;
-            buttonText: string;
-            disabled: boolean;
-        };
-    };
-};

package/dist/atoms/icon/stories/icon.stories.d.ts

@@ -1,40 +0,0 @@
-import React from 'react';
-import { IconProps } from '..';
-declare const _default: {
-    title: string;
-    component: (props: IconProps) => React.JSX.Element;
-    argTypes: {
-        fill: {
-            control: string;
-        };
-    };
-};
-export default _default;
-export declare const Icons: {
-    (args: IconProps): React.JSX.Element;
-    story: {
-        name: string;
-        args: {
-            fill: string;
-        };
-    };
-};
-export declare const IconComponent: {
-    (args: IconProps): React.JSX.Element;
-    story: {
-        name: string;
-        args: {
-            icon: string;
-            fill: string;
-        };
-        argTypes: {
-            icon: {
-                control: {
-                    type: string;
-                    options: string[];
-                };
-            };
-        };
-        decorators: ((Story: any) => React.JSX.Element)[];
-    };
-};

package/dist/atoms/label/stories/label.stories.d.ts

@@ -1,30 +0,0 @@
-import React from 'react';
-import { LabelProps } from '..';
-declare const _default: {
-    title: string;
-    component: (props: LabelProps) => React.JSX.Element;
-    argTypes: {
-        currency: {
-            control: {
-                type: string;
-                options: string[];
-            };
-        };
-    };
-};
-export default _default;
-export declare const LabelComponentKAI: {
-    (args: LabelProps): React.JSX.Element;
-    storyName: string;
-    args: {
-        currency: string;
-        value: string;
-    };
-};
-export declare const LabelComponent: {
-    (args: LabelProps): React.JSX.Element;
-    storyName: string;
-    args: {
-        value: string;
-    };
-};

package/dist/atoms/progress-bar/stories/progress-bar.stories.d.ts

@@ -1,15 +0,0 @@
-import React from 'react';
-import { ProgressBarProps } from '..';
-declare const _default: {
-    title: string;
-    component: (props: ProgressBarProps) => React.JSX.Element;
-};
-export default _default;
-export declare const ProgressBarComponent: {
-    (args: ProgressBarProps): React.JSX.Element;
-    storyName: string;
-    args: {
-        progress: number;
-        value: string;
-    };
-};

package/dist/atoms/select/stories/select.stories.d.ts

@@ -1,31 +0,0 @@
-import React from 'react';
-import { SelectProps } from '..';
-declare const _default: {
-    title: string;
-    component: (props: SelectProps) => React.JSX.Element;
-    argTypes: {
-        onChange: {
-            action: string;
-        };
-        disabled: {
-            control: {
-                type: string;
-            };
-        };
-    };
-};
-export default _default;
-export declare const SelectComponent: {
-    (args: SelectProps): React.JSX.Element;
-    storyName: string;
-    args: {
-        name: string;
-        placeholder: string;
-        options: {
-            value: string;
-            name: string;
-        }[];
-        error: string;
-        disabled: boolean;
-    };
-};

package/dist/atoms/select-interactive/stories/select-interactive.stories.d.ts

@@ -1,50 +0,0 @@
-import React from 'react';
-import { SelectInteractiveProps, TSelectInteractiveOption } from '../types';
-declare const _default: {
-    title: string;
-    component: ({ name, multi, search, placeholder, options, value, clear, error, disabled, formatGroupLabel, onChange, onInputChange, ...rest }: SelectInteractiveProps<TSelectInteractiveOption>) => React.JSX.Element;
-    argTypes: {
-        multi: {
-            control: {
-                type: string;
-            };
-        };
-        search: {
-            control: {
-                type: string;
-            };
-        };
-    };
-};
-export default _default;
-export declare const SelectInteractiveSimpleComponent: {
-    (args: SelectInteractiveProps<TSelectInteractiveOption>): React.JSX.Element;
-    storyName: string;
-    args: {
-        multi: boolean;
-        search: boolean;
-        placeholder: string;
-    };
-};
-export declare const SelectInteractiveFormatedGroupedOptionsComponent: {
-    (args: SelectInteractiveProps<TSelectInteractiveOption>): React.JSX.Element;
-    storyName: string;
-};
-export declare const SelectInteractiveIconsComponent: {
-    (args: SelectInteractiveProps<TSelectInteractiveOption>): React.JSX.Element;
-    storyName: string;
-    args: {
-        multi: boolean;
-        search: boolean;
-        placeholder: string;
-    };
-};
-export declare const SelectInteractiveCustomComponent: {
-    (args: SelectInteractiveProps<TSelectInteractiveOption>): React.JSX.Element;
-    storyName: string;
-    args: {
-        multi: boolean;
-        search: boolean;
-        placeholder: string;
-    };
-};

package/dist/atoms/slideshow/stories/slideshow.stories.d.ts

@@ -1,22 +0,0 @@
-import React from 'react';
-import { SlideshowProps } from '..';
-declare const _default: {
-    title: string;
-    component: (props: SlideshowProps) => React.JSX.Element;
-};
-export default _default;
-export declare const SlideshowComponent: {
-    (args: SlideshowProps): React.JSX.Element;
-    story: {
-        name: string;
-    };
-    args: {
-        showArrows: boolean;
-        slidesNumber: number;
-        autoPlay: boolean;
-        stopOnHover: boolean;
-        interval: number;
-        dynamicHeight: boolean;
-        slideSelected: number;
-    };
-};

package/dist/atoms/tag/stories/tag.stories.d.ts

@@ -1,37 +0,0 @@
-import React from 'react';
-import { TagProps } from '..';
-declare const _default: {
-    title: string;
-    component: (props: TagProps) => React.JSX.Element;
-    argTypes: {
-        color: {
-            control: {
-                type: string;
-                options: string[];
-            };
-        };
-        txtColor: {
-            control: {
-                type: string;
-                options: string[];
-            };
-        };
-        variant: {
-            control: {
-                type: string;
-                options: string[];
-            };
-        };
-    };
-};
-export default _default;
-export declare const TagPrimaryComponent: {
-    (args: TagProps): React.JSX.Element;
-    storyName: string;
-    args: {
-        color: string;
-        txtColor: string;
-        variant: string;
-        value: string;
-    };
-};

package/dist/atoms/tag-number/stories/tag-number.stories.d.ts

@@ -1,31 +0,0 @@
-import React from 'react';
-import { TagNumberProps } from '..';
-declare const _default: {
-    title: string;
-    component: (props: TagNumberProps) => React.JSX.Element;
-    argTypes: {
-        color: {
-            control: {
-                type: string;
-                options: string[];
-            };
-        };
-        valueColor: {
-            control: {
-                type: string;
-                options: string[];
-            };
-        };
-    };
-};
-export default _default;
-export declare const TagNumberComponent: {
-    (args: TagNumberProps): React.JSX.Element;
-    storyName: string;
-    args: {
-        color: string;
-        label: string;
-        value: number;
-        valueColor: string;
-    };
-};

package/dist/atoms/text-area/stories/text-area.stories.d.ts

@@ -1,80 +0,0 @@
-import React from 'react';
-import { TextAreaProps } from '..';
-declare const _default: {
-    title: string;
-    component: (props: TextAreaProps) => React.JSX.Element;
-};
-export default _default;
-export declare const TextAreaComponent: {
-    (args: TextAreaProps): React.JSX.Element;
-    storyName: string;
-    args: {
-        name: string;
-        placeholder: string;
-        height: string;
-        onChange: () => void;
-        error: string;
-        disabled: boolean;
-        required: boolean;
-    };
-};
-export declare const TextAreaCharactersCountComponent: {
-    (args: TextAreaProps): React.JSX.Element;
-    storyName: string;
-    args: {
-        name: string;
-        placeholder: string;
-        height: string;
-        error: string;
-        disabled: boolean;
-        required: boolean;
-    };
-};
-export declare const TextAreaDefaultComponent: {
-    (args: TextAreaProps): React.JSX.Element;
-    storyName: string;
-    args: {
-        height: string;
-        placeholder: string;
-        defaultValue: string;
-        value: null;
-        onChange: () => void;
-        disabled: boolean;
-    };
-};
-export declare const TextAreaDisabledComponent: {
-    (args: TextAreaProps): React.JSX.Element;
-    storyName: string;
-    args: {
-        name: string;
-        height: string;
-        placeholder: string;
-        value: string;
-        onChange: () => void;
-        disabled: boolean;
-    };
-};
-export declare const TextAreaFullBorderComponent: {
-    (args: TextAreaProps): React.JSX.Element;
-    storyName: string;
-    args: {
-        name: string;
-        height: string;
-        placeholder: string;
-        onChange: () => void;
-        disabled: boolean;
-    };
-};
-export declare const TextAreaErrorComponent: {
-    (args: TextAreaProps): React.JSX.Element;
-    storyName: string;
-    args: {
-        name: string;
-        height: string;
-        placeholder: string;
-        value: string;
-        onChange: () => void;
-        error: string;
-        disabled: boolean;
-    };
-};