@synchat/webchat 0.0.1

package/README.md

@@ -0,0 +1,77 @@
+# React + TypeScript Component Library (tsup)
+
+Starter para publicar um componente React no npm e consumir em outro projeto.
+
+## Como usar este template
+
+1. **Renomeie o pacote** em `package.json`:
+   - Para um pacote público com _scope_: `"name": "@seu-escopo/minha-lib"`
+     - O primeiro publish precisa de `--access public`
+   - Ou sem scope: `"name": "minha-lib"`
+
+2. **Instale dependências**:
+   ```bash
+   npm install
+   ```
+
+3. **Build**:
+   ```bash
+   npm run build
+   ```
+
+4. **Publicar no npm**:
+   - Faça login (`npm login`).
+   - Se usar scope público: `npm publish --access public`
+     - Sem scope: `npm publish`
+
+> Dica: mantenha `react` e `react-dom` como `peerDependencies` (já configurado).
+> Isso evita múltiplas cópias do React no projeto consumidor.
+
+## Estrutura
+```
+.
+├─ src/
+│  ├─ MyButton.tsx
+│  └─ index.ts
+├─ package.json
+├─ tsconfig.json
+├─ tsup.config.ts
+├─ .gitignore
+└─ .npmignore
+```
+
+- Edite/adicione componentes em `src/` e reexporte em `src/index.ts`.
+
+## Consumindo em outro projeto
+
+```bash
+# em outro app (Vite, Next, CRA, etc.)
+npm install minha-lib
+# ou
+npm install @seu-escopo/minha-lib
+```
+
+```tsx
+// Exemplo de uso
+import { MyButton } from 'minha-lib'
+
+export default function Page() {
+  return <MyButton onClick={() => alert('olá!')}>Enviar</MyButton>
+}
+```
+
+## Versionamento
+- Atualize `version` no `package.json` (ex.: `0.1.1`) antes de publicar novamente.
+- Ou use `npm version patch|minor|major`.
+
+## Teste local sem publicar (opcional)
+- `npm pack` gera um `.tgz` local. No app consumidor: `npm install ../caminho/minha-lib-0.1.0.tgz`.
+
+## Dicas de qualidade
+- Adicione linters (`eslint`, `prettier`).
+- Configure CI (GitHub Actions) e _release_ automatizado (semantic-release).
+- Exporte CSS opcional com `style`/`files` ou mantenha apenas estilos inline/CSS-in-JS.
+- Se for SSR/Next.js, prefira `exports` bem definidos (já incluso).
+
+---
+Feito com ❤️

package/dist/index.d.mts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+
+type MyButtonProps = {
+    children?: React.ReactNode;
+    onClick?: () => void;
+    className?: string;
+    /** Desabilita o botão */
+    disabled?: boolean;
+};
+/**
+ * Um botão básico para exemplo da lib.
+ * Renderiza um <button> com estilos básicos inline (você pode trocar para CSS Modules/Tailwind/etc).
+ */
+declare const MyButton: React.FC<MyButtonProps>;
+
+export { MyButton, type MyButtonProps };

package/dist/index.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+
+type MyButtonProps = {
+    children?: React.ReactNode;
+    onClick?: () => void;
+    className?: string;
+    /** Desabilita o botão */
+    disabled?: boolean;
+};
+/**
+ * Um botão básico para exemplo da lib.
+ * Renderiza um <button> com estilos básicos inline (você pode trocar para CSS Modules/Tailwind/etc).
+ */
+declare const MyButton: React.FC<MyButtonProps>;
+
+export { MyButton, type MyButtonProps };

package/dist/index.js

@@ -0,0 +1,28 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/MyButton.tsx
+var MyButton = ({ children = "Clique", onClick, className, disabled }) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "button",
+    {
+      onClick,
+      disabled,
+      className,
+      style: {
+        padding: "8px 14px",
+        borderRadius: 8,
+        border: "1px solid #ddd",
+        cursor: disabled ? "not-allowed" : "pointer",
+        background: disabled ? "#f2f2f2" : "#fff",
+        fontWeight: 600
+      },
+      children
+    }
+  );
+};
+
+exports.MyButton = MyButton;
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/MyButton.tsx"],"names":["jsx"],"mappings":";;;;;AAcO,IAAM,QAAA,GAAoC,CAAC,EAAE,QAAA,GAAW,UAAU,OAAA,EAAS,SAAA,EAAW,UAAS,KAAM;AAC1G,EAAA,uBACEA,cAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,OAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,KAAA,EAAO;AAAA,QACL,OAAA,EAAS,UAAA;AAAA,QACT,YAAA,EAAc,CAAA;AAAA,QACd,MAAA,EAAQ,gBAAA;AAAA,QACR,MAAA,EAAQ,WAAW,aAAA,GAAgB,SAAA;AAAA,QACnC,UAAA,EAAY,WAAW,SAAA,GAAY,MAAA;AAAA,QACnC,UAAA,EAAY;AAAA,OACd;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ","file":"index.js","sourcesContent":["import * as React from 'react'\n\nexport type MyButtonProps = {\n  children?: React.ReactNode\n  onClick?: () => void\n  className?: string\n  /** Desabilita o botão */\n  disabled?: boolean\n}\n\n/**\n * Um botão básico para exemplo da lib.\n * Renderiza um <button> com estilos básicos inline (você pode trocar para CSS Modules/Tailwind/etc).\n */\nexport const MyButton: React.FC<MyButtonProps> = ({ children = 'Clique', onClick, className, disabled }) => {\n  return (\n    <button\n      onClick={onClick}\n      disabled={disabled}\n      className={className}\n      style={{\n        padding: '8px 14px',\n        borderRadius: 8,\n        border: '1px solid #ddd',\n        cursor: disabled ? 'not-allowed' : 'pointer',\n        background: disabled ? '#f2f2f2' : '#fff',\n        fontWeight: 600\n      }}\n    >\n      {children}\n    </button>\n  )\n}\n"]}

package/dist/index.mjs

@@ -0,0 +1,26 @@
+import { jsx } from 'react/jsx-runtime';
+
+// src/MyButton.tsx
+var MyButton = ({ children = "Clique", onClick, className, disabled }) => {
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      onClick,
+      disabled,
+      className,
+      style: {
+        padding: "8px 14px",
+        borderRadius: 8,
+        border: "1px solid #ddd",
+        cursor: disabled ? "not-allowed" : "pointer",
+        background: disabled ? "#f2f2f2" : "#fff",
+        fontWeight: 600
+      },
+      children
+    }
+  );
+};
+
+export { MyButton };
+//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/MyButton.tsx"],"names":[],"mappings":";;;AAcO,IAAM,QAAA,GAAoC,CAAC,EAAE,QAAA,GAAW,UAAU,OAAA,EAAS,SAAA,EAAW,UAAS,KAAM;AAC1G,EAAA,uBACE,GAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,OAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,KAAA,EAAO;AAAA,QACL,OAAA,EAAS,UAAA;AAAA,QACT,YAAA,EAAc,CAAA;AAAA,QACd,MAAA,EAAQ,gBAAA;AAAA,QACR,MAAA,EAAQ,WAAW,aAAA,GAAgB,SAAA;AAAA,QACnC,UAAA,EAAY,WAAW,SAAA,GAAY,MAAA;AAAA,QACnC,UAAA,EAAY;AAAA,OACd;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ","file":"index.mjs","sourcesContent":["import * as React from 'react'\n\nexport type MyButtonProps = {\n  children?: React.ReactNode\n  onClick?: () => void\n  className?: string\n  /** Desabilita o botão */\n  disabled?: boolean\n}\n\n/**\n * Um botão básico para exemplo da lib.\n * Renderiza um <button> com estilos básicos inline (você pode trocar para CSS Modules/Tailwind/etc).\n */\nexport const MyButton: React.FC<MyButtonProps> = ({ children = 'Clique', onClick, className, disabled }) => {\n  return (\n    <button\n      onClick={onClick}\n      disabled={disabled}\n      className={className}\n      style={{\n        padding: '8px 14px',\n        borderRadius: 8,\n        border: '1px solid #ddd',\n        cursor: disabled ? 'not-allowed' : 'pointer',\n        background: disabled ? '#f2f2f2' : '#fff',\n        fontWeight: 600\n      }}\n    >\n      {children}\n    </button>\n  )\n}\n"]}

package/package.json

@@ -0,0 +1,48 @@
+{
+  "name": "@synchat/webchat",
+  "version": "0.0.1",
+  "description": "Starter de biblioteca de componentes React + TypeScript com tsup.",
+  "author": "synchat <contato@synchat.com.br>",
+  "license": "MIT",
+  "main": "dist/index.cjs",
+  "module": "dist/index.mjs",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "sideEffects": false,
+  "files": [
+    "dist"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/synchat-br/synchat-webchat"
+  },
+  "scripts": {
+    "build": "tsup",
+    "clean": "rimraf dist",
+    "typecheck": "tsc --noEmit",
+    "prepublishOnly": "npm run build"
+  },
+  "keywords": [
+    "react",
+    "typescript",
+    "component-library",
+    "tsup"
+  ],
+  "dependencies": {
+    "react": "19.2.0",
+    "react-dom": "19.2.0"
+  },
+  "devDependencies": {
+    "@types/react": "^18.3.0",
+    "@types/react-dom": "^18.3.0",
+    "tsup": "^8.0.1",
+    "typescript": "^5.6.0",
+    "rimraf": "^6.0.0"
+  }
+}