letalkui 0.0.6 → 0.0.7

package/package.json

@@ -1,9 +1,12 @@
 {
   "name": "letalkui",
   "private": false,
-  "version": "0.0.6",
+  "version": "0.0.7",
   "type": "module",
-  "scripts": {
+	"files": [
+		"dist"
+	],
+	"scripts": {
     "lint": "eslint .",
     "dev": "storybook dev -p 6006",
     "build": "tsup",

package/.editorconfig

@@ -1,11 +0,0 @@
-root = true
-
-[*]
-indent_style = tab
-indent_size = 4
-# LF (Line Feed) and CRLF (Carriage Return + Line Feed) are different line-ending conventions used to mark the end of a line in text files:
-# More information in this post: https://medium.com/@feldy7k/understanding-line-break-types-cr-lf-and-crlf-278069b8da29
-end_of_line = lf
-charset = utf-8
-trim_trailing_whitespace = true
-insert_final_newline = true

package/.github/workflows/check.yml

@@ -1,33 +0,0 @@
-on:
-    push:
-        branches:
-            - master
-
-    pull_request:
-
-    workflow_dispatch:
-
-name: Check
-
-jobs:
-    check:
-        name: Check
-        runs-on: ubuntu-latest
-
-        steps:
-            -   name: Checkout
-                uses: actions/checkout@v2
-
-            -   name: Setup NodeJS
-                uses: actions/setup-node@v1
-                with:
-                    node-version: "18.20.3"
-
-            -   name: Install All Dependencies
-                run: npm i -f
-
-            -   name: Build
-                env:
-                    CI: true
-                    NODE_OPTIONS: --max-old-space-size=4096
-                run: npm run build

package/.github/workflows/lint.yaml

@@ -1,25 +0,0 @@
-on: pull_request
-
-name: Lint
-
-jobs:
-    check:
-        name: Lint
-        runs-on: ubuntu-latest
-        container:
-            image: node:18.20.3
-
-        steps:
-            -   name: Checkout
-                uses: actions/checkout@v2
-
-            -   name: Setup NodeJS
-                uses: actions/setup-node@v2
-                with:
-                    node-version: "18.20.3"
-
-            -   name: Install packages
-                run: npm ci
-
-            -   name: Check Lint
-                run: npx eslint 'src/**'

package/.github/workflows/npm-publish.yml

@@ -1,27 +0,0 @@
-name: Release
-
-on:
-    push:
-        branches:
-            - master
-
-jobs:
-    release:
-        runs-on: ubuntu-latest
-        steps:
-            -   name: Checkout
-                uses: actions/checkout@v3
-
-            -   name: Setup Node.js
-                uses: actions/setup-node@v3
-                with:
-                    node-version: "18.20.3"
-                    registry-url: 'https://registry.npmjs.org'
-
-            -   name: Install dependencies
-                run: npm i -f
-
-            -   name: Release
-                run: npm publish
-                env:
-                    NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

package/.nvmrc

@@ -1 +0,0 @@
-14.18.1

package/.storybook/main.ts

@@ -1,13 +0,0 @@
-import type { StorybookConfig } from "@storybook/react-vite";
-
-const config: StorybookConfig = {
-  stories: ["../src/**/*.mdx", "../src/components/**/*.stories.@(js|jsx|mjs|ts|tsx)"],
-  addons: [
-    "@storybook/addon-essentials"
-  ],
-  framework: {
-    name: "@storybook/react-vite",
-    options: {},
-  },
-};
-export default config;

package/.storybook/preview.ts

@@ -1,14 +0,0 @@
-import type { Preview } from "@storybook/react";
-
-const preview: Preview = {
-  parameters: {
-    controls: {
-      matchers: {
-        color: /(background|color)$/i,
-        date: /Date$/i,
-      },
-    },
-  },
-};
-
-export default preview;

package/eslint.config.js

@@ -1,68 +0,0 @@
-import js from "@eslint/js"
-import globals from "globals"
-import reactHooks from "eslint-plugin-react-hooks"
-import reactRefresh from "eslint-plugin-react-refresh"
-import react from "eslint-plugin-react"
-import typescriptEslint from "@typescript-eslint/eslint-plugin"
-import jsxA11Y from "eslint-plugin-jsx-a11y"
-import _import from "eslint-plugin-import"
-import tsParser from "@typescript-eslint/parser"
-
-export default [
-    {
-        ignores: ["dist", ".storybook", "vite.config.ts", "tsup.config.ts"],
-    },
-    js.configs.recommended,
-    {
-        files: ["**/*.{ts,tsx}"],
-        languageOptions: {
-            ecmaVersion: 2020,
-            sourceType: "module",
-            globals: {
-                ...globals.browser,
-                ...globals.node,
-                ...globals.jest,
-            },
-            parser: tsParser,
-            parserOptions: {
-                project: "./tsconfig.eslint.json",
-                ecmaFeatures: {
-                    jsx: true,
-                },
-            },
-        },
-        plugins: {
-            "react-hooks": reactHooks,
-            "react-refresh": reactRefresh,
-            react,
-            "@typescript-eslint": typescriptEslint,
-            "jsx-a11y": jsxA11Y,
-            import: _import,
-        },
-        rules: {
-            ...reactHooks.configs.recommended.rules,
-            "react-refresh/only-export-components": [
-                "warn",
-                { allowConstantExport: true },
-            ],
-            ...typescriptEslint.configs.recommended.rules,
-            ...react.configs.recommended.rules,
-            "@typescript-eslint/no-unused-vars": "error",
-            indent: ["error", "tab"],
-            quotes: ["error", "double"],
-            semi: ["error", "never"],
-			"object-curly-spacing": ["error", "always"],
-			"comma-dangle": ["error", "never"]
-        },
-        settings: {
-            "import/resolver": {
-                typescript: {
-                    project: ["./tsconfig.json"],
-                },
-            },
-            react: {
-                version: "detect",
-            },
-        },
-    },
-]

package/index.html

@@ -1,13 +0,0 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Vite + React + TS</title>
-  </head>
-  <body>
-    <div id="root"></div>
-    <script type="module" src="/src/main.tsx"></script>
-  </body>
-</html>

package/src/componentPatterns/JsonForm/ActionButton.tsx

@@ -1,35 +0,0 @@
-import React from "react"
-
-import {
-	Button,
-	CircularProgress
-} from "@mui/material"
-
-type ActionButtonProps = {
-	onSave: () => void
-	loading: boolean
-}
-
-export const ActionButton: React.FC<ActionButtonProps> = (props) => {
-	const {
-		onSave,
-		loading
-	} = props
-
-	const handleSave = () => {
-		onSave()
-	}
-
-	return (
-		<Button
-			onClick={handleSave}
-			color="primary"
-			variant="contained"
-			disableElevation
-			disabled={loading}
-			endIcon={loading && <CircularProgress size={20} color="inherit" />}
-		>
-			Salvar
-		</Button>
-	)
-}

package/src/componentPatterns/JsonForm/ActionsButtons.tsx

@@ -1,23 +0,0 @@
-import React from "react"
-import {
-	Grid2 as Grid
-} from "@mui/material"
-
-type ActionsButtonsProps = {
-	children: React.ReactNode
-}
-
-export const ActionsButtons: React.FC<ActionsButtonsProps> = (props) => {
-	return (
-		<Grid
-			container
-			justify="flex-end"
-		>
-			<Grid
-				item
-			>
-				{props.children}
-			</Grid>
-		</Grid>
-	)
-}

package/src/componentPatterns/JsonForm/Content.tsx

@@ -1,67 +0,0 @@
-import React from "react"
-import AceEditor, { IAceEditorProps } from "react-ace"
-import {
-	FormControl,
-	FormHelperText,
-	Grid2 as Grid
-} from "@mui/material"
-
-export type JsonValue = Record<string | number, unknown>
-
-export type Overwrite<T, NewT> = Omit<T, keyof NewT> & NewT;
-
-export type ContentProps = Overwrite<IAceEditorProps, {
-	value?: JsonValue | null
-	onChange?: (updatedJson: string) => void
-	currentError?: boolean
-	currentHelperText?: string
-}>
-
-const INPUT_NAME = "json-editor"
-
-export const Content: React.FC<ContentProps> = (props) => {
-	const {
-		value,
-		onChange,
-		currentError,
-		currentHelperText,
-		...rest
-	} = props
-
-	const stringifyValue = JSON.stringify(value, null, 2)
-
-	return (
-		<Grid>
-			<FormControl
-				error={currentError}
-				fullWidth
-			>
-				<AceEditor
-					{...rest}
-					name={INPUT_NAME}
-					value={stringifyValue}
-					wrapEnabled={true}
-					mode="json"
-					theme="textmate"
-					onChange={onChange}
-					fontSize={16}
-					showPrintMargin={true}
-					showGutter={true}
-					highlightActiveLine={true}
-					editorProps={{ $blockScrolling: true }}
-					setOptions={{
-						showLineNumbers: true,
-						tabSize: 2
-					}}
-				/>
-			</FormControl>
-			{currentHelperText && (
-				<FormHelperText
-					error={currentError}
-				>
-					{currentHelperText}
-				</FormHelperText>
-			)}
-		</Grid>
-	)
-}

package/src/componentPatterns/JsonForm/Root.tsx

@@ -1,21 +0,0 @@
-import React from "react"
-
-import {
-	Grid2 as Grid
-} from "@mui/material"
-
-type RootProps = {
-	children: React.ReactNode
-}
-
-export const Root: React.FC<RootProps> = (props) => {
-	return (
-		<Grid
-			container
-			direction="column"
-			spacing={2}
-		>
-			{props.children}
-		</Grid>
-	)
-}

package/src/componentPatterns/JsonForm/index.ts

@@ -1,11 +0,0 @@
-import { Root } from "@/componentPatterns/JsonForm/Root"
-import { ActionButton } from "@/componentPatterns/JsonForm/ActionButton"
-import { ActionsButtons } from "@/componentPatterns/JsonForm/ActionsButtons"
-import { Content } from "@/componentPatterns/JsonForm/Content"
-
-export const JsonForm = {
-	Root,
-	ActionButton,
-	ActionsButtons,
-	Content
-}

package/src/components/Button/Button.stories.ts

@@ -1,53 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react"
-import { fn } from "@storybook/test"
-
-import { Button } from "@/components/Button"
-
-const meta: Meta<typeof Button> = {
-	title: "Example/Button",
-	component: Button,
-	parameters: {
-		layout: "centered"
-	},
-	tags: ["autodocs"],
-	argTypes: {
-		backgroundColor: {
-			control: "color"
-		}
-	},
-	args: {
-		onClick: fn()
-	}
-}
-
-export default meta
-
-type Story = StoryObj<typeof meta>
-
-export const Primary: Story = {
-	args: {
-		primary: true,
-		label: "Button",
-		size: "large"
-	}
-}
-
-export const Secondary: Story = {
-	args: {
-		label: "Button"
-	}
-}
-
-export const Large: Story = {
-	args: {
-		size: "large",
-		label: "Button"
-	}
-}
-
-export const Small: Story = {
-	args: {
-		size: "small",
-		label: "Button"
-	}
-}

package/src/components/Button/index.tsx

@@ -1,30 +0,0 @@
-import React from "react"
-
-export interface ButtonProps {
-	primary?: boolean
-	backgroundColor?: string
-	size?: "small" | "medium" | "large"
-	label: string
-	onClick?: () => void
-}
-
-export const Button = (props: ButtonProps) => {
-	const {
-		backgroundColor,
-		label,
-		size,
-		primary
-	} = props
-
-	const mode = primary ? "storybook-button--primary" : "storybook-button--secondary"
-	return (
-		<button
-			type="button"
-			className={["storybook-button", `storybook-button--${size}`, mode].join("")}
-			style={{ backgroundColor }}
-			{...props}
-		>
-			{label}
-		</button>
-	)
-}

package/src/components/JsonEditor/JsonEditor.stories.ts

@@ -1,47 +0,0 @@
-import {
-	Meta,
-	StoryObj
-} from "@storybook/react"
-
-import { JsonEditor } from "@/components/JsonEditor"
-
-const meta: Meta<typeof JsonEditor> = {
-	title: "Example/JsonEditor",
-	component: JsonEditor,
-	parameters: {
-		layout: "centered"
-	},
-	tags: ["autodocs"],
-	argTypes: {
-		value: {
-			type: "string"
-		}
-	}
-}
-
-export default meta
-
-type Story = StoryObj<typeof meta>
-
-export const Primary: Story = {
-	args: {
-		value: {
-			"id": 1,
-			"nome": "dsadsa",
-			"ativo": true,
-			"dataCriacao": "2025-02-07T12:00:00.000Z",
-
-			"itens": [{
-				"id": 101,
-				"descricao": "Item 1",
-				"quantidade": 10,
-				"preco": 19.99
-			}, {
-				"id": 102,
-				"descricao": "Item 2",
-				"quantidade": 5,
-				"preco": 49.99
-			}]
-		}
-	}
-}

package/src/components/JsonEditor/index.tsx

@@ -1,93 +0,0 @@
-import React, { useState } from "react"
-import { IAceEditorProps } from "react-ace"
-
-import { JsonForm } from "@/componentPatterns/JsonForm"
-import {
-	JsonValue,
-	Overwrite
-} from "@/componentPatterns/JsonForm/Content"
-
-import useValidation from "@/hooks/useValidation"
-
-type JsonEditorProps = Overwrite<IAceEditorProps, {
-	value?: JsonValue | null
-	onChange?: (value: string) => void
-	onSave?: (value: JsonValue) => Promise<JsonValue>
-	helperText?: string
-	error?: boolean
-}>
-
-const INPUT_NAME = "json-editor"
-
-export const JsonEditor: React.FC<JsonEditorProps> = (props) => {
-	const {
-		value,
-		onChange,
-		onSave,
-		helperText,
-		error,
-		...rest
-	} = props
-
-	const { addValidation, clearValidation, validation } = useValidation()
-
-	const stringifyValue = JSON.stringify(value, null, 2)
-
-	const [jsonData, setJsonData] = useState<string>(stringifyValue)
-	const [loadingSaveJson, setLoadingSaveJson] = useState<boolean>(false)
-
-	const currentError: boolean = Boolean(validation[INPUT_NAME]) ?? error
-
-	const currentHelperText = (): string => {
-		if (INPUT_NAME in validation) {
-			if (helperText) return helperText
-
-			return "Ocorreu um erro inesperado. Por favor, tente novamente mais tarde."
-		}
-
-		return "Ocorreu um erro inesperado. Por favor, tente novamente mais tarde."
-	}
-
-	const handleChange = (newValue: string) => {
-		clearValidation(INPUT_NAME)
-
-		setJsonData(newValue)
-
-		onChange?.(newValue)
-	}
-
-	const handleSave = async () => {
-		setLoadingSaveJson(true)
-
-		if (onSave) {
-			try {
-				const parseJsonData = JSON.parse(jsonData)
-
-				await onSave(parseJsonData)
-			} catch (error) {
-				addValidation({ [INPUT_NAME]: error })
-			}
-		}
-
-		setLoadingSaveJson(false)
-	}
-
-	return (
-		<JsonForm.Root>
-			<JsonForm.Content
-				{...rest}
-				value={value}
-				onChange={handleChange}
-				currentError={currentError}
-				currentHelperText={currentHelperText()}
-			/>
-
-			<JsonForm.ActionsButtons>
-				<JsonForm.ActionButton
-					onSave={handleSave}
-					loading={loadingSaveJson}
-				/>
-			</JsonForm.ActionsButtons>
-		</JsonForm.Root>
-	)
-}

package/src/components/JsonView/JsonView.stories.ts

@@ -1,42 +0,0 @@
-import type {
-	Meta,
-	StoryObj
-} from "@storybook/react"
-
-import { JsonView } from "@/components/JsonView"
-
-const meta: Meta<typeof JsonView> = {
-	title: "Example/JsonView",
-	component: JsonView,
-	parameters: {
-		layout: "centered"
-	},
-	tags: ["autodocs"]
-}
-
-export default meta
-
-type Story = StoryObj<typeof meta>
-
-export const Primary: Story = {
-	args: {
-		value: {
-			"id": 1,
-			"nome": "dsadsa",
-			"ativo": true,
-			"dataCriacao": "2025-02-07T12:00:00.000Z",
-
-			"itens": [{
-				"id": 101,
-				"descricao": "Item 1",
-				"quantidade": 10,
-				"preco": 19.99
-			}, {
-				"id": 102,
-				"descricao": "Item 2",
-				"quantidade": 5,
-				"preco": 49.99
-			}]
-		}
-	}
-}

package/src/components/JsonView/index.tsx

@@ -1,29 +0,0 @@
-import React from "react"
-import { IAceEditorProps } from "react-ace"
-
-import { JsonForm } from "@/componentPatterns/JsonForm"
-
-import {
-	JsonValue,
-	Overwrite
-} from "@/componentPatterns/JsonForm/Content"
-
-type JsonViewProps = Overwrite<IAceEditorProps, {
-	value?: JsonValue | null
-}>
-
-export const JsonView: React.FC<JsonViewProps> = (props) => {
-	const {
-		value,
-		...rest
-	} = props
-
-	return (
-		<JsonForm.Root>
-			<JsonForm.Content
-				{...rest}
-				value={value}
-			/>
-		</JsonForm.Root>
-	)
-}

package/src/hooks/useValidation.tsx

@@ -1,39 +0,0 @@
-import { useState } from "react"
-
-export type ValidationType = Record<string, unknown>
-
-const useValidation = () => {
-	const [validation, setValidation] = useState<ValidationType>({})
-
-	const addValidation = (newValidation: ValidationType) => {
-		setValidation((lastValidation) => ({
-			...lastValidation,
-			...newValidation
-		}))
-	}
-
-	const clearValidation = (key: string) => {
-		if (key in validation) {
-			setValidation((lastValidation) => {
-				const updatedData: ValidationType = { ...lastValidation }
-
-				delete updatedData[key]
-
-				return updatedData
-			})
-		}
-	}
-
-	const clearAllValidations = () => {
-		setValidation({})
-	}
-
-	return {
-		addValidation,
-		clearValidation,
-		clearAllValidations,
-		validation
-	}
-}
-
-export default useValidation

package/src/index.ts

@@ -1,3 +0,0 @@
-export * from "@/components/Button"
-export * from "@/components/JsonEditor"
-export * from "@/components/JsonView"

package/tsconfig.app.json

@@ -1,31 +0,0 @@
-{
-  "compilerOptions": {
-    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
-    "target": "ES2020",
-    "useDefineForClassFields": true,
-    "lib": ["ES2020", "DOM", "DOM.Iterable"],
-    "module": "ESNext",
-    "skipLibCheck": true,
-
-    /* Bundler mode */
-    "moduleResolution": "bundler",
-    "allowImportingTsExtensions": true,
-    "isolatedModules": true,
-    "moduleDetection": "force",
-    "noEmit": true,
-    "jsx": "react-jsx",
-
-    /* Linting */
-    "strict": true,
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
-    "noFallthroughCasesInSwitch": true,
-    "noUncheckedSideEffectImports": true,
-    "baseUrl": ".",
-    "paths": {
-      "@/*": ["src/*"]
-    },
-    "allowSyntheticDefaultImports": true
-  },
-  "include": ["src"]
-}

package/tsconfig.build.json

@@ -1,18 +0,0 @@
-{
-    "compilerOptions": {
-        "jsx": "react-jsx",
-        "target": "ES2022",
-        "esModuleInterop": true,
-		"moduleResolution": "node",
-		"strict": true,
-        "module": "ESNext",
-        "sourceMap": true,
-        "declaration": true,
-        "lib": ["ES2022", "DOM", "DOM.Iterable"],
-        "baseUrl": ".",
-        "paths": {
-            "@/*": ["src/*"]
-        }
-    },
-    "include": ["src"]
-}

package/tsconfig.eslint.json

@@ -1,4 +0,0 @@
-{
-  "extends": "./tsconfig.json",
-  "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.stories.ts"]
-}

package/tsconfig.json

@@ -1,7 +0,0 @@
-{
-  "files": [],
-  "references": [
-    { "path": "./tsconfig.app.json" },
-    { "path": "./tsconfig.node.json" }
-  ]
-}

package/tsconfig.node.json

@@ -1,24 +0,0 @@
-{
-  "compilerOptions": {
-    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
-    "target": "ES2022",
-    "lib": ["ES2023"],
-    "module": "ESNext",
-    "skipLibCheck": true,
-
-    /* Bundler mode */
-    "moduleResolution": "bundler",
-    "allowImportingTsExtensions": true,
-    "isolatedModules": true,
-    "moduleDetection": "force",
-    "noEmit": true,
-
-    /* Linting */
-    "strict": true,
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
-    "noFallthroughCasesInSwitch": true,
-    "noUncheckedSideEffectImports": true
-  },
-  "include": ["vite.config.ts"]
-}

package/tsup.config.ts

@@ -1,12 +0,0 @@
-import { defineConfig } from "tsup"
-
-export default defineConfig({
-    minify: true,
-    entry: ["src/index.ts"],
-    sourcemap: true,
-    outDir: "dist",
-    clean: true,
-    format: ["cjs", "esm"],
-    dts: true,
-    tsconfig: "tsconfig.build.json"
-})

package/vite.config.ts

@@ -1,13 +0,0 @@
-import { defineConfig } from 'vite'
-import react from '@vitejs/plugin-react-swc'
-import path from 'node:path'
-
-// https://vite.dev/config/
-export default defineConfig({
-  plugins: [react()],
-  resolve: {
-    alias: {
-      "@": path.resolve(__dirname, "./src")
-    }
-  }
-})