@infra-cryptomate/react-components 0.0.1 → 0.0.2

package/dist/index.d.ts

@@ -1 +1 @@
-export * from './components';
+export * from './src/index'

package/dist/{components → src/components}/atoms/button/button.d.ts

@@ -1,5 +1,4 @@
-/// <reference types="react" />
-import { StylesVariants, SizesVariants } from './button.types';
+import { type StylesVariants, type SizesVariants } from './button.types';
 interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
     variant?: StylesVariants;
     size?: SizesVariants;

package/dist/{components → src/components}/atoms/button/button.enums.d.ts

@@ -3,7 +3,9 @@ export declare enum STYLES_VARIANTS {
     PRIMARY = "primary",
     SECONDARY = "secondary",
     DANGER = "danger",
-    SUCCESS = "success"
+    SUCCESS = "success",
+    GHOST = "ghost",
+    LINK = "link"
 }
 export declare enum SIZES_VARIANTS {
     DEFAULT = "default",

package/dist/{components → src/components}/atoms/button/button.types.d.ts

@@ -1,3 +1,3 @@
-import { STYLES_VARIANTS, SIZES_VARIANTS } from './button.variants';
+import { type STYLES_VARIANTS, type SIZES_VARIANTS } from './button.variants';
 export type StylesVariants = keyof typeof STYLES_VARIANTS;
 export type SizesVariants = keyof typeof SIZES_VARIANTS;

package/dist/{components → src/components}/atoms/button/button.variants.d.ts

@@ -4,6 +4,8 @@ export declare const STYLES_VARIANTS: {
     secondary: string;
     danger: string;
     success: string;
+    ghost: string;
+    link: string;
 };
 export declare const SIZES_VARIANTS: {
     default: string;

package/dist/{components → src/components}/atoms/checkbox/checkbox.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 interface CheckboxProps extends React.InputHTMLAttributes<HTMLInputElement> {
 }
 export declare const Checkbox: React.FC<CheckboxProps>;

package/dist/{components → src/components}/atoms/heading/heading.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { LevelVariants } from './heading.types';
 interface HeadingProps extends React.HTMLAttributes<HTMLHeadingElement> {
     level?: LevelVariants;

package/dist/{components → src/components}/atoms/input/input.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
 }
 export declare const Input: React.FC<InputProps>;

package/dist/{components → src/components}/atoms/label/label.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 interface LabelProps extends React.HTMLAttributes<HTMLLabelElement> {
     htmlFor?: string;
 }

package/dist/{components → src/components}/atoms/paragraph/paragraph.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 interface ParagraphProps extends React.HTMLAttributes<HTMLParagraphElement> {
 }
 export declare const Paragraph: React.FC<ParagraphProps>;

package/dist/{components → src/components}/atoms/spinner/spinner.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { StylesVariants, SizesVariants } from './spinner.types';
 interface SpinnerProps {
     variant?: StylesVariants;

package/dist/{components → src/components}/atoms/text-area/text-area.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 interface TextAreaProps extends React.HTMLProps<HTMLTextAreaElement> {
 }
 export declare const TextArea: React.FC<TextAreaProps>;

package/dist/src/components/molecules/card/card.d.ts

@@ -0,0 +1,8 @@
+import * as React from "react";
+declare const Card: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CardHeader: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CardTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHeadingElement> & React.RefAttributes<HTMLParagraphElement>>;
+declare const CardDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
+declare const CardContent: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CardFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent };

package/dist/{components → src/components}/molecules/checkbox-container/checkbox-container.d.ts

@@ -1,5 +1,4 @@
-/// <reference types="react" />
-import { Label as LabelType } from './checkbox-container.types';
+import { type Label as LabelType } from './checkbox-container.types';
 interface CheckboxContainerProps extends React.InputHTMLAttributes<HTMLInputElement> {
     label?: LabelType;
 }

package/dist/{components → src/components}/molecules/checkbox-container/checkbox-container.types.d.ts

@@ -1,6 +1,6 @@
-import { STYLES_VARIANTS } from './checkbox-container.variants';
+import { type STYLES_VARIANTS } from './checkbox-container.variants';
 export type StylesVariants = keyof typeof STYLES_VARIANTS;
-export type Label = {
+export interface Label {
     value: string;
     className: string;
-};
+}

package/dist/{components → src/components}/molecules/select/select.d.ts

@@ -8,4 +8,4 @@ declare const SelectContent: React.ForwardRefExoticComponent<Omit<SelectPrimitiv
 declare const SelectLabel: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare const SelectItem: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare const SelectSeparator: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-export { Select, SelectGroup, SelectValue, SelectTrigger, SelectContent, SelectLabel, SelectItem, SelectSeparator, };
+export { Select, SelectGroup, SelectValue, SelectTrigger, SelectContent, SelectLabel, SelectItem, SelectSeparator };

package/dist/src/index.d.ts

@@ -0,0 +1 @@
+export * from './components';

package/dist/style.css

@@ -698,18 +698,22 @@ video {
 .rounded-full {
   border-radius: 9999px;
 }
+.rounded-lg {
+  border-radius: 0.5rem;
+}
 .rounded-md {
   border-radius: 0.375rem;
 }
 .rounded-sm {
   border-radius: 0.125rem;
 }
-.rounded-xl {
-  border-radius: 0.75rem;
-}
 .border {
   border-width: 1px;
 }
+.border-neutral-200 {
+  --tw-border-opacity: 1;
+  border-color: rgb(229 229 229 / var(--tw-border-opacity));
+}
 .border-red-500 {
   --tw-border-opacity: 1;
   border-color: rgb(239 68 68 / var(--tw-border-opacity));
@@ -858,6 +862,14 @@ video {
   --tw-text-opacity: 1;
   color: rgb(6 95 70 / var(--tw-text-opacity));
 }
+.text-neutral-500 {
+  --tw-text-opacity: 1;
+  color: rgb(115 115 115 / var(--tw-text-opacity));
+}
+.text-neutral-950 {
+  --tw-text-opacity: 1;
+  color: rgb(10 10 10 / var(--tw-text-opacity));
+}
 .text-red-800 {
   --tw-text-opacity: 1;
   color: rgb(153 27 27 / var(--tw-text-opacity));
@@ -877,6 +889,9 @@ video {
   --tw-text-opacity: 1;
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
+.underline-offset-4 {
+  text-underline-offset: 4px;
+}
 .opacity-0 {
   opacity: 0;
 }
@@ -889,11 +904,6 @@ video {
 .opacity-90 {
   opacity: 0.9;
 }
-.shadow {
-  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
-  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
-  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
-}
 .shadow-lg {
   --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
   --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
@@ -904,6 +914,11 @@ video {
   --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
+.shadow-sm {
+  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
+  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
 .outline-none {
   outline: 2px solid transparent;
   outline-offset: 2px;
@@ -976,6 +991,9 @@ video {
   --tw-text-opacity: 1;
   color: rgb(2 6 23 / var(--tw-text-opacity));
 }
+.hover\:underline:hover {
+  text-decoration-line: underline;
+}
 .focus\:opacity-100:focus {
   opacity: 1;
 }
@@ -1155,6 +1173,10 @@ video {
 .data-\[state\=open\]\:slide-in-from-top-full[data-state=open] {
   --tw-enter-translate-y: -100%;
 }
+:is(.dark .dark\:border-neutral-800) {
+  --tw-border-opacity: 1;
+  border-color: rgb(38 38 38 / var(--tw-border-opacity));
+}
 :is(.dark .dark\:border-red-900) {
   --tw-border-opacity: 1;
   border-color: rgb(127 29 29 / var(--tw-border-opacity));
@@ -1163,6 +1185,10 @@ video {
   --tw-border-opacity: 1;
   border-color: rgb(30 41 59 / var(--tw-border-opacity));
 }
+:is(.dark .dark\:bg-neutral-950) {
+  --tw-bg-opacity: 1;
+  background-color: rgb(10 10 10 / var(--tw-bg-opacity));
+}
 :is(.dark .dark\:bg-red-900) {
   --tw-bg-opacity: 1;
   background-color: rgb(127 29 29 / var(--tw-bg-opacity));
@@ -1171,6 +1197,14 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(2 6 23 / var(--tw-bg-opacity));
 }
+:is(.dark .dark\:text-neutral-400) {
+  --tw-text-opacity: 1;
+  color: rgb(163 163 163 / var(--tw-text-opacity));
+}
+:is(.dark .dark\:text-neutral-50) {
+  --tw-text-opacity: 1;
+  color: rgb(250 250 250 / var(--tw-text-opacity));
+}
 :is(.dark .dark\:text-slate-50) {
   --tw-text-opacity: 1;
   color: rgb(248 250 252 / var(--tw-text-opacity));
@@ -1238,4 +1272,4 @@ video {
   .md\:max-w-\[420px\] {
     max-width: 420px;
   }
-}
+}

package/dist/test/button.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/test/card.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/test/checkbox.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/test/dropdown.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/test/input.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/test/select.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/test/spinner.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/test/text-area.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/test/toast.test.d.ts

@@ -0,0 +1,3 @@
+export declare function useToast(): {
+    toast: import("@vitest/spy").Mock<any, any>;
+};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@infra-cryptomate/react-components",
   "description": "",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "type": "module",
   "main": "./dist/components.umd.js",
   "module": "./dist/components.es.js",
@@ -22,7 +22,9 @@
     "build": "tsc && vite build && npm run build:styles",
     "build:styles": "postcss ./src/tailwind/theme.css -o ./dist/style.css",
     "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
-    "preview": "vite preview"
+    "preview": "vite preview",
+    "test": "vitest",
+    "coverage": "vitest run --coverage"
   },
   "peerDependencies": {
     "@types/react": "*",
@@ -37,7 +39,9 @@
     "@radix-ui/react-toast": "1.1.4",
     "@types/uuid": "9.0.3",
     "autoprefixer": "10.4.15",
+    "clsx": "2.0.0",
     "lucide-react": "0.274.0",
+    "postcss": "8.4.29",
     "tailwind-merge": "1.14.0",
     "tailwindcss": "3.3.3",
     "tailwindcss-animate": "1.0.7",
@@ -45,16 +49,22 @@
     "vite-plugin-dts": "3.5.3"
   },
   "devDependencies": {
+    "@testing-library/react": "14.0.0",
     "@types/react": "18.2.15",
     "@types/react-dom": "18.2.7",
-    "@typescript-eslint/eslint-plugin": "6.0.0",
+    "@typescript-eslint/eslint-plugin": "6.7.0",
     "@typescript-eslint/parser": "6.0.0",
     "@vitejs/plugin-react": "4.0.4",
     "@vitejs/plugin-react-swc": "3.3.2",
-    "eslint": "8.45.0",
+    "eslint": "8.49.0",
+    "eslint-config-standard-with-typescript": "39.0.0",
+    "eslint-plugin-import": "2.28.1",
+    "eslint-plugin-n": "16.1.0",
+    "eslint-plugin-promise": "6.1.1",
+    "eslint-plugin-react": "7.33.2",
     "eslint-plugin-react-hooks": "4.6.0",
     "eslint-plugin-react-refresh": "0.4.3",
-    "postcss": "8.4.29",
+    "jsdom": "22.1.0",
     "postcss-cli": "10.1.0",
     "typescript": "5.0.2",
     "vite": "4.4.5",

package/dist/components/molecules/card/card.d.ts

@@ -1,20 +0,0 @@
-import * as React from 'react';
-interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
-}
-declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>>;
-interface CardHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
-}
-declare const CardHeader: React.ForwardRefExoticComponent<CardHeaderProps & React.RefAttributes<HTMLDivElement>>;
-interface CardTitleProps extends React.HTMLAttributes<HTMLHeadingElement> {
-}
-declare const CardTitle: React.ForwardRefExoticComponent<CardTitleProps & React.RefAttributes<HTMLParagraphElement>>;
-interface CardDescriptionProps extends React.HTMLAttributes<HTMLParagraphElement> {
-}
-declare const CardDescription: React.ForwardRefExoticComponent<CardDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
-interface CardContentProps extends React.HTMLAttributes<HTMLDivElement> {
-}
-declare const CardContent: React.ForwardRefExoticComponent<CardContentProps & React.RefAttributes<HTMLDivElement>>;
-interface CardFooterProps extends React.HTMLAttributes<HTMLDivElement> {
-}
-declare const CardFooter: React.ForwardRefExoticComponent<CardFooterProps & React.RefAttributes<HTMLDivElement>>;
-export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent };