@koaris/bloom-ui 1.1.1 → 1.2.0

package/README.md

@@ -10,12 +10,16 @@ Install the following package:
 npm i @koaris/bloom-ui
 ```
 ## Usage
-View docs [here](https://guilhermesalviano.github.io/bloom-ui).
-
-Import design system css in your css file:
+This design system is built with Tailwind, and you can import it into your project as follows:
+In your CSS file:
 ```css
-@import "@koaris/bloom-ui/dist/tailwind.css";
+@import "@koaris/bloom-ui/tailwind.css";
+```
+Or in your JavaScript file:
+```js
+import '@koaris/bloom-ui/tailwind.css'
 ```
+
 Components usage:
 ```tsx
 import { Text } from '@koaris/bloom-ui'

package/package.json

@@ -1,29 +1,38 @@
 {
   "name": "@koaris/bloom-ui",
-  "version": "1.1.1",
+  "version": "1.2.0",
   "description": "Bloom-ui is a public design system from the Koaris Project developed with React, Typescript, and Tailwind.",
   "source": "./src/index.ts",
-  "main": "./dist/index.js",
+  "type": "module",
+  "main": "dist/index.mjs",
   "module": "./dist/index.mjs",
-  "types": "./dist/index.d.ts",
+  "types": "dist/index.d.ts",
   "scripts": {
-    "build": "tailwindcss -i ./src/styles/tailwind.css -o ./dist/tailwind.css -c ./tailwind.config.ts --minify && tsup src/index.tsx --format esm,cjs --dts --external react",
-    "dev": "concurrently --kill-others \"tailwindcss -i ./src/styles/tailwind.css -o ./dist/tailwind.css -c ./tailwind.config.ts --minify --watch \" \"tsup src/index.tsx --format esm, cjs --dts --external react --watch\"",
+    "build": "NODE_ENV=production tailwindcss -i ./src/styles/tailwind.css -o ./tailwind.css -c ./tailwind.config.ts  --minify && tsup",
+    "dev": "concurrently --kill-others \"tailwindcss -i ./src/styles/tailwind.css -o ./tailwind.css -c ./tailwind.config.ts  --minify --watch \" \"tsup --watch\"",
     "lint": "eslint src/**/*.ts* --fix"
   },
-  "files": [
-    "dist",
-    "README.md"
-  ],
+  "exports": {
+    ".": {
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.d.ts"
+    },
+    "./tailwind.css": "./tailwind.css"
+  },
   "keywords": [
     "design-system",
     "react"
   ],
+  "files": [
+    "dist",
+    "README.md",
+    "tailwind.css"
+  ],
   "author": "guilhermesalviano",
   "homepage": "https://guilhermesalviano.github.io/bloom-ui",
   "repository": {
     "type": "git",
-    "url": "https://github.com/guilhermesalviano/bloom-ui.git"
+    "url": "git+https://github.com/guilhermesalviano/bloom-ui.git"
   },
   "license": "GPL-3.0-only",
   "devDependencies": {

package/dist/index.d.mts

@@ -1,145 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as react from 'react';
-import { DetailedHTMLProps, HTMLAttributes, ButtonHTMLAttributes, AnchorHTMLAttributes, InputHTMLAttributes, TextareaHTMLAttributes, ReactNode, FormHTMLAttributes } from 'react';
-
-/**
- * Primary UI component for user interaction
- */
-interface CardProps extends DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, // Change the type to HTMLDivElement
-HTMLDivElement> {
-    selected?: boolean;
-    disabled?: boolean;
-    direction?: string;
-    size?: string;
-    imageSize: string;
-    image?: string;
-    onClick?: () => void;
-}
-declare const Card: ({ className, selected, direction, size, disabled, imageSize, onClick, ...rest }: CardProps) => react_jsx_runtime.JSX.Element;
-
-/**
- * Primary UI component for user interaction
- */
-interface ButtonProps extends DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement> {
-    size?: 'sm' | 'md';
-    variant?: 'primary' | 'secondary';
-    disabled?: boolean;
-    children: string | JSX.Element;
-}
-declare const Button: ({ className, variant, size, disabled, onClick, ...rest }: ButtonProps) => react_jsx_runtime.JSX.Element;
-
-/**
- * Primary UI component for user interaction
- */
-interface LinkProps extends DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement> {
-    url: string;
-    newPage: boolean;
-    disabled?: boolean;
-    children: string | JSX.Element;
-}
-declare const Link: ({ className, disabled, url, newPage, onClick, ...rest }: LinkProps) => react_jsx_runtime.JSX.Element;
-
-declare const options: {
-    id: number;
-    value: string;
-    label: string;
-}[];
-interface RadioGroupProps extends DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
-    disabled?: boolean;
-    options: typeof options;
-    required?: boolean;
-}
-declare const RadioGroup: ({ disabled, options, required, className, }: RadioGroupProps) => react_jsx_runtime.JSX.Element;
-
-interface CheckboxProps extends DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
-    disabled?: boolean;
-    required?: boolean;
-}
-declare const Checkbox: ({ className, required, disabled }: CheckboxProps) => react_jsx_runtime.JSX.Element;
-
-/**
- * Primary UI component for user interaction
- */
-interface InputProps extends DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement> {
-    disabled?: boolean;
-    placeholder?: string;
-    value?: string;
-    validated?: boolean;
-    error: boolean;
-    required?: boolean;
-    type: 'text' | 'password' | 'date' | 'cpf' | 'phone' | 'cnpj' | 'cep';
-}
-declare const Input: react.ForwardRefExoticComponent<Omit<InputProps, "ref"> & react.RefAttributes<HTMLInputElement>>;
-
-interface TextInputProps extends DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement> {
-    disabled?: boolean;
-    placeholder?: string;
-    prefix?: string;
-    value?: string;
-    variant?: 'primary' | 'secondary';
-    validated?: boolean;
-    error: boolean;
-    required?: boolean;
-    type: 'text' | 'password' | 'date' | 'cpf' | 'phone' | 'cnpj' | 'cep';
-}
-declare const TextInput: react.ForwardRefExoticComponent<Omit<TextInputProps, "ref"> & react.RefAttributes<HTMLInputElement>>;
-
-interface TextAreaProps extends DetailedHTMLProps<TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement> {
-    disabled?: boolean;
-    reference?: React.RefObject<HTMLTextAreaElement>;
-    placeholder?: string;
-    value?: string;
-    validated?: boolean;
-    error: boolean;
-    required?: boolean;
-    resize?: boolean;
-    type: 'text' | 'password' | 'date' | 'cpf' | 'phone' | 'cnpj' | 'cep';
-}
-declare const TextArea: ({ className, disabled, reference, value, error, required, placeholder, resize, onClick, ...rest }: TextAreaProps) => react_jsx_runtime.JSX.Element;
-
-interface TextProps extends DetailedHTMLProps<HTMLAttributes<HTMLLabelElement>, HTMLLabelElement> {
-    children: ReactNode;
-    color?: string;
-    size?: 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | '7xl' | '8xl' | '9xl';
-    tag?: 'p' | 'strong' | 'span' | 'label';
-    htmlFor?: string;
-}
-declare const Text: ({ children, color, size, tag, className, ...rest }: TextProps) => react_jsx_runtime.JSX.Element;
-
-interface HeadingProps extends DetailedHTMLProps<HTMLAttributes<HTMLHeadElement>, HTMLHeadElement> {
-    children: React.ReactNode;
-    color?: string;
-    size?: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | '7xl' | '8xl' | '9xl';
-    tag?: 'h1' | 'h2' | 'h3' | 'h4';
-}
-declare const Heading: ({ children, color, size, tag, className, }: HeadingProps) => react_jsx_runtime.JSX.Element;
-
-interface BoxProps extends DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
-    children: React.ReactNode;
-    tag?: 'div' | 'section' | 'article' | 'aside' | 'header' | 'footer';
-    variant?: 'primary' | 'secondary';
-}
-declare const Box: ({ className, children, tag, variant, }: BoxProps) => react_jsx_runtime.JSX.Element;
-
-interface FormProps extends DetailedHTMLProps<FormHTMLAttributes<HTMLFormElement>, HTMLFormElement> {
-    children: React.ReactNode;
-    variant?: 'primary' | 'secondary';
-    orientation?: 'row' | 'col';
-    handleSubmit?: (event: React.FormEvent<HTMLFormElement>) => void;
-}
-declare const Form: ({ className, children, variant, orientation, ...rest }: FormProps) => react_jsx_runtime.JSX.Element;
-
-interface AvatarProps {
-    src?: string;
-    alt?: string;
-    className?: string;
-}
-declare const Avatar: ({ className, ...rest }: AvatarProps) => react_jsx_runtime.JSX.Element;
-
-interface MultiStepProps extends DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
-    size: number;
-    currentStep?: number;
-}
-declare const MultiStep: ({ className, size, currentStep }: MultiStepProps) => react_jsx_runtime.JSX.Element;
-
-export { Avatar, type AvatarProps, Box, type BoxProps, Button, type ButtonProps, Card, type CardProps, Checkbox, type CheckboxProps, Form, type FormProps, Heading, type HeadingProps, Input, type InputProps, Link, type LinkProps, MultiStep, type MultiStepProps, RadioGroup, type RadioGroupProps, Text, TextArea, type TextAreaProps, TextInput, type TextInputProps, type TextProps };