@fluxy-chat/create-fluxy-chat 0.4.0 → 0.5.0

package/templates/full/src/index.css

@@ -0,0 +1,242 @@
+:root {
+  font-family: system-ui, -apple-system, sans-serif;
+  line-height: 1.5;
+  color: #0f172a;
+  background: #fdfbf9;
+}
+
+* {
+  box-sizing: border-box;
+}
+
+body {
+  margin: 0;
+}
+
+.shell {
+  max-width: 880px;
+  margin: 0 auto;
+  padding: 1.5rem;
+}
+
+.hero {
+  margin-bottom: 1rem;
+}
+
+.hero h1 {
+  font-size: 1.35rem;
+  margin: 0 0 0.35rem;
+}
+
+.hero p {
+  margin: 0;
+  font-size: 0.875rem;
+  color: #64748b;
+}
+
+.hero a {
+  color: #c2410c;
+}
+
+.layout {
+  display: grid;
+  gap: 1rem;
+}
+
+@media (min-width: 900px) {
+  .layout {
+    grid-template-columns: 1fr 240px;
+    align-items: start;
+  }
+}
+
+.chat-panel {
+  display: flex;
+  flex-direction: column;
+  min-height: 520px;
+  border: 1px solid #e7e5e4;
+  border-radius: 16px;
+  background: #fff;
+  overflow: hidden;
+  box-shadow: 0 8px 30px rgb(15 23 42 / 6%);
+}
+
+.chat-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 0.75rem 1rem;
+  border-bottom: 1px solid #e7e5e4;
+  background: #0f172a;
+  color: #fff;
+}
+
+.status {
+  font-size: 0.75rem;
+  opacity: 0.85;
+}
+
+.messages {
+  flex: 1;
+  overflow-y: auto;
+  list-style: none;
+  margin: 0;
+  padding: 1rem;
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
+}
+
+.message {
+  display: flex;
+  flex-direction: column;
+  gap: 0.15rem;
+  padding: 0.6rem 0.85rem;
+  border-radius: 10px;
+  background: #f8fafc;
+  max-width: 85%;
+}
+
+.message.self {
+  align-self: flex-end;
+  background: #fff7ed;
+  border: 1px solid #fed7aa;
+}
+
+.message.agent {
+  background: #f1f5f9;
+  border: 1px solid #e2e8f0;
+}
+
+.author {
+  font-size: 0.7rem;
+  color: #64748b;
+  font-weight: 600;
+}
+
+.composer {
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
+  padding: 0.75rem;
+  border-top: 1px solid #e7e5e4;
+}
+
+.composer-row {
+  display: flex;
+  gap: 0.5rem;
+}
+
+.composer input {
+  flex: 1;
+  border: 1px solid #cbd5e1;
+  border-radius: 10px;
+  padding: 0.55rem 0.75rem;
+}
+
+.composer button {
+  border: none;
+  border-radius: 10px;
+  background: #c2410c;
+  color: #fff;
+  padding: 0.55rem 1rem;
+  cursor: pointer;
+  font-weight: 600;
+}
+
+.composer button.secondary {
+  background: #0f172a;
+}
+
+.composer button:disabled {
+  opacity: 0.55;
+  cursor: not-allowed;
+}
+
+.hint {
+  font-size: 0.75rem;
+  color: #64748b;
+}
+
+.tools {
+  margin: 0 1rem 1rem;
+  padding: 0.75rem;
+  border-radius: 10px;
+  border: 1px solid #e2e8f0;
+  background: #f8fafc;
+}
+
+.tools h3 {
+  margin: 0 0 0.5rem;
+  font-size: 0.7rem;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+  color: #64748b;
+}
+
+.tools ul {
+  margin: 0;
+  padding-left: 1rem;
+  font-size: 0.8rem;
+}
+
+.side {
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+}
+
+.card {
+  border: 1px solid #e7e5e4;
+  border-radius: 12px;
+  padding: 0.85rem 1rem;
+  background: #fff;
+  font-size: 0.8rem;
+}
+
+.card h2 {
+  margin: 0 0 0.5rem;
+  font-size: 0.75rem;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  color: #64748b;
+}
+
+.card dl {
+  margin: 0;
+  display: grid;
+  gap: 0.35rem;
+}
+
+.card dt {
+  color: #94a3b8;
+  font-size: 0.7rem;
+}
+
+.card dd {
+  margin: 0;
+  word-break: break-all;
+}
+
+.card a {
+  color: #c2410c;
+}
+
+.error-box {
+  border: 1px solid #fecaca;
+  background: #fef2f2;
+  color: #991b1b;
+  border-radius: 12px;
+  padding: 1rem;
+  font-size: 0.875rem;
+}
+
+.error-box code {
+  font-size: 0.8rem;
+}
+
+.typing {
+  padding: 0 1rem 0.5rem;
+  font-size: 0.75rem;
+  color: #64748b;
+}

package/templates/full/src/main.tsx

@@ -0,0 +1,10 @@
+import { StrictMode } from "react";
+import { createRoot } from "react-dom/client";
+import { App } from "./App";
+import "./index.css";
+
+createRoot(document.getElementById("root")!).render(
+  <StrictMode>
+    <App />
+  </StrictMode>,
+);

package/templates/full/src/vite-env.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="vite/client" />
+
+interface ImportMetaEnv {
+  readonly VITE_FLUXYCHAT_WORKER_URL: string;
+  readonly VITE_FLUXYCHAT_MEMBER_JWT: string;
+  readonly VITE_FLUXYCHAT_ROOM_ID: string;
+  readonly VITE_FLUXYCHAT_AGENT_ID: string;
+  readonly VITE_FLUXYCHAT_AGENT_HANDLE: string;
+  readonly VITE_FLUXYCHAT_PROJECT_ID: string;
+  readonly VITE_FLUXYCHAT_CONSOLE_URL: string;
+  readonly VITE_FLUXYCHAT_USER_ID: string;
+}
+
+interface ImportMeta {
+  readonly env: ImportMetaEnv;
+}

package/templates/full/tsconfig.json

@@ -0,0 +1,21 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "useDefineForClassFields": true,
+    "lib": ["ES2022", "DOM", "DOM.Iterable"],
+    "module": "ESNext",
+    "skipLibCheck": true,
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "isolatedModules": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+    "jsx": "react-jsx",
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true
+  },
+  "include": ["src"]
+}

package/templates/full/vite.config.ts

@@ -0,0 +1,7 @@
+import { defineConfig } from "vite";
+import react from "@vitejs/plugin-react";
+
+export default defineConfig({
+  plugins: [react()],
+  server: { port: 5173, open: true },
+});