@wishket/design-system 0.4.0 → 0.5.0

package/dist/Components/Atoms/TextInput/TextInput.d.ts

@@ -0,0 +1,3 @@
+import { TextInputProps } from './TextInput.types';
+declare const TextInput: ({ type, name, value, variant, placeholder, lable, startIcon, endIcon, maxLength, supportMessage, measure, isError, errorMessage, disabled, testId, onChange, }: TextInputProps) => import("react/jsx-runtime").JSX.Element;
+export default TextInput;

package/dist/Components/Atoms/TextInput/TextInput.stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import TextInput from './TextInput';
+import { TextInputProps } from './TextInput.types';
+declare const meta: Meta<typeof TextInput>;
+export default meta;
+type Story = StoryObj<TextInputProps>;
+export declare const Default: Story;

package/dist/Components/Atoms/TextInput/TextInput.types.d.ts

@@ -0,0 +1,32 @@
+import { ComponentPropsWithRef } from 'react';
+type variant = 'default' | 'lable' | 'lable_fixed';
+export interface TextInputProps extends ComponentPropsWithRef<'input'> {
+    variant?: variant;
+    lable?: string;
+    isError?: boolean;
+    startIcon?: string;
+    endIcon?: string;
+    supportMessage?: string;
+    measure?: string;
+    errorMessage?: string;
+    testId?: string;
+}
+export interface InputContainerProps extends ComponentPropsWithRef<'input'> {
+    variant: variant;
+    lable?: string;
+    isFocused?: boolean;
+    isError?: boolean;
+}
+export interface LabelContainerProps extends InputContainerProps {
+    startIcon?: string;
+    endIcon?: string;
+    measure?: string;
+}
+export interface SupportContainerProps {
+    isError?: boolean;
+    errorMessage?: string;
+    supportMessage?: string;
+    currentLength?: number;
+    maxLength?: number;
+}
+export {};

package/dist/Components/Atoms/TextInput/index.d.ts

@@ -0,0 +1,2 @@
+import TextInput from './TextInput';
+export default TextInput;

package/dist/Components/Atoms/TextInput/parts/Icon.d.ts

@@ -0,0 +1,6 @@
+interface IconProps {
+    name: string;
+    className?: string;
+}
+export declare const Icon: ({ name, className }: IconProps) => import("react/jsx-runtime").JSX.Element | undefined;
+export {};

package/dist/Components/Atoms/TextInput/parts/InputContainer.d.ts

@@ -0,0 +1,3 @@
+import { InputContainerProps } from '../TextInput.types';
+declare const InputContainer: ({ type, name, value, lable, maxLength, placeholder, variant, disabled, isFocused, isError, onChange, onFocus, onBlur, }: InputContainerProps) => import("react/jsx-runtime").JSX.Element | undefined;
+export default InputContainer;

package/dist/Components/Atoms/TextInput/parts/LabelContainer.d.ts

@@ -0,0 +1,3 @@
+import { LabelContainerProps } from '../TextInput.types';
+declare const LabelContainer: ({ type, name, value, variant, lable, placeholder, startIcon, endIcon, maxLength, measure, isFocused, isError, onBlur, onFocus, disabled, onChange, }: LabelContainerProps) => import("react/jsx-runtime").JSX.Element;
+export default LabelContainer;

package/dist/Components/Atoms/TextInput/parts/PasswordContainer.d.ts

@@ -0,0 +1,3 @@
+import { InputContainerProps } from '../TextInput.types';
+declare const PasswordContainer: ({ type, name, value, lable, maxLength, placeholder, variant, disabled, isFocused, isError, onChange, onFocus, onBlur, }: InputContainerProps) => import("react/jsx-runtime").JSX.Element;
+export default PasswordContainer;

package/dist/Components/Atoms/TextInput/parts/SupportContainer.d.ts

@@ -0,0 +1,3 @@
+import { SupportContainerProps } from '../TextInput.types';
+declare const SupportContainer: ({ isError, errorMessage, supportMessage, currentLength, maxLength, }: SupportContainerProps) => import("react/jsx-runtime").JSX.Element;
+export default SupportContainer;

package/dist/Components/Atoms/TextInput/parts/index.d.ts

@@ -0,0 +1,3 @@
+export { default as LabelContainer } from './LabelContainer';
+export { default as PasswordContainer } from './PasswordContainer';
+export { default as SupportContainer } from './SupportContainer';

package/dist/Components/Atoms/index.d.ts

@@ -6,3 +6,4 @@ export { default as ProductIcon } from './ProductIcon';
 export { default as Radio } from './Radio';
 export { default as Button } from './Button';
 export { default as LoadingIndicator } from './LoadingIndicator';
+export { default as TextInput } from './TextInput';

package/dist/Components/Organisms/Modal/Modal.d.ts

@@ -0,0 +1,10 @@
+import { ModalRootProps } from './Modal.types';
+export interface ModalProps extends ModalRootProps {
+    isPreventClose?: boolean;
+}
+declare const Modal: {
+    Root: ({ children, hasBackground, isPreventClose, size, }: ModalRootProps) => import("react/jsx-runtime").JSX.Element;
+    Trigger: ({ children, testId }: import("./Modal.types").ModalTriggerProps) => import("react/jsx-runtime").JSX.Element;
+    Content: ({ children, testId, role, className, }: import("./Modal.types").ModalContentProps) => import("react/jsx-runtime").JSX.Element;
+};
+export default Modal;

package/dist/Components/Organisms/Modal/Modal.parts.d.ts

@@ -0,0 +1,4 @@
+import { ModalContentProps, ModalRootProps, ModalTriggerProps } from './Modal.types';
+export declare const Root: ({ children, hasBackground, isPreventClose, size, }: ModalRootProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Trigger: ({ children, testId }: ModalTriggerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Content: ({ children, testId, role, className, }: ModalContentProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Components/Organisms/Modal/Modal.stories.d.ts

@@ -0,0 +1,22 @@
+import type { StoryObj } from '@storybook/react';
+import { ModalRootProps } from './Modal.types';
+import Modal from '.';
+declare const meta: {
+    title: string;
+    component: ({ children, ...rest }: ModalRootProps) => import("react/jsx-runtime").JSX.Element;
+    argTypes: {
+        hasBackground: {
+            control: string;
+        };
+        isPreventClose: {
+            control: string;
+        };
+        size: {
+            options: string[];
+            control: string;
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof Modal.Root>;
+export declare const Default: Story;

package/dist/Components/Organisms/Modal/Modal.types.d.ts

@@ -0,0 +1,23 @@
+import { ReactNode } from 'react';
+export interface ModalRootProps {
+    children: ReactNode;
+    hasBackground?: boolean;
+    isPreventClose?: boolean;
+    size?: 'sm' | 'md' | 'lg';
+}
+export interface ModalTriggerProps {
+    setOpen?: () => void;
+    children?: ReactNode;
+    testId?: string;
+}
+export interface ModalBackgroundProps {
+    isOpen?: boolean;
+    hasBackground?: boolean;
+    testId?: string;
+}
+export interface ModalContentProps {
+    children?: ReactNode;
+    testId?: string;
+    role?: string;
+    className?: string;
+}

package/dist/Components/Organisms/Modal/hooks/index.d.ts

@@ -0,0 +1 @@
+export { default as usePreventScroll } from './usePreventScroll';

package/dist/Components/Organisms/Modal/hooks/usePreventScroll.d.ts

@@ -0,0 +1,2 @@
+declare const usePreventScroll: (isOpen?: boolean) => void;
+export default usePreventScroll;

package/dist/Components/Organisms/Modal/index.d.ts

@@ -0,0 +1,2 @@
+import Modal from './Modal';
+export default Modal;

package/dist/Components/Organisms/index.d.ts

@@ -0,0 +1 @@
+export { default as Modal } from './Modal';

package/dist/config/tailwind.config.js

@@ -10,7 +10,7 @@ module.exports = {
     screens: {
       mobile: '360px',
       tablet: '720px',
-      desktop: '980px',
+      desktop: '960px',
     },
     extend: {
       gridAutoColumns: {
@@ -125,6 +125,14 @@ module.exports = {
         'w-secondary': '#2E6BAA',
         'y-primary': '#6B16EE',
       },
+      boxShadow: {
+        'graysmall': '0px 1px 4px 0px rgba(0, 0, 0, 0.12)',
+        'graymedium': '0px 2px 8px 0px rgba(0, 0, 0, 0.16)',
+        'bluegray': '0px 1px 4px 0px rgba(230, 235, 240, 0.80)',
+        'cyan': '0px 2px 8px 0px rgba(59, 163, 199, 0.32)',
+        'indigo': '0px 2px 8px 0px rgba(46, 107, 170, 0.32)',
+        'violet': '0px 2px 8px 0px rgba(107, 22, 238, 0.32)',
+      },
       backgroundImage: {
         'gradient-cyan-0': 'linear-gradient(0deg, #5db6d4 0%, #369cc2 100%)',
         'gradient-violet-0': 'linear-gradient(0deg, #8e2de2 0%, #5a00db 100%)',

package/dist/index.d.ts

@@ -1,2 +1,3 @@
 export * from './Components/Atoms';
 export * from './Components/Molecules';
+export * from './Components/Organisms';