npm - hubbe-sdk - Versions diffs - 1.2.0 - Mend

hubbe-sdk 1.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (36) hide show

package/bin/.token +1 -0
package/bin/build.js +94 -0
package/bin/defaultHtml.html +23 -0
package/bin/defaultJs.js +49 -0
package/bin/deploy.js +130 -0
package/bin/deployTs.js +157 -0
package/bin/fetch.js +118 -0
package/bin/htmlu.js +116 -0
package/bin/index.js +77 -0
package/bin/react-template/html/eslint.config.js +28 -0
package/bin/react-template/html/index.html +7 -0
package/bin/react-template/html/package.json +34 -0
package/bin/react-template/html/postcss.config.js +6 -0
package/bin/react-template/html/src/App.tsx +33 -0
package/bin/react-template/html/src/hooks/index.ts +3 -0
package/bin/react-template/html/src/hooks/useDraggable.ts +69 -0
package/bin/react-template/html/src/hooks/useMessageEvent.ts +120 -0
package/bin/react-template/html/src/hooks/useUserContext.ts +24 -0
package/bin/react-template/html/src/index.css +5 -0
package/bin/react-template/html/src/main.tsx +10 -0
package/bin/react-template/html/src/vite-env.d.ts +1 -0
package/bin/react-template/html/tailwind.config.js +12 -0
package/bin/react-template/html/tsconfig.app.json +24 -0
package/bin/react-template/html/tsconfig.json +7 -0
package/bin/react-template/html/tsconfig.node.json +22 -0
package/bin/react-template/html/vite.config.ts +10 -0
package/bin/react-template/room/global.d.ts +4222 -0
package/bin/react-template/room/room.ts +36 -0
package/bin/react-template/room/tsconfig.json +9 -0
package/bin/react.js +60 -0
package/bin/rollup.js +67 -0
package/bin/rollupTs.js +72 -0
package/bin/script.js +131 -0
package/bin/tsconfig_template.json +9 -0
package/bin/utils.js +35 -0
package/package.json +57 -0

package/bin/index.js ADDED Viewed

@@ -0,0 +1,77 @@
+#! /usr/bin/env node
+const { Command } = require('commander');
+const { setToken, newScript, newReactScript } = require('./utils');
+const HtmlUploader = require('./htmlu');
+const Script = require('./script');
+const Deploy = require('./deploy');
+const Rollup = require('./rollup');
+const DeployTs = require('./deployTs');
+const RollupTs = require('./rollupTs');
+const Build = require('./build');
+const React = require('./react');
+const { resolve } = require('path');
+const program = new Command();
+program
+    .option('-d, --deploy <script>', 'Deploy script (Web Files + Room)')
+    .option('-h, --html <script>', 'Deploy Web Files')
+    .option('-s, --script <script>', 'Deploy Room Script')
+    .option('-t, --token <token>', 'Set the token')
+    .option('-n, --new <script>', 'Create a new script')
+    .option('-r, --rollup <script>', 'Rollup a script')
+    .option('-rts, --rollupts <script>', 'Rollup a script with typescript')
+    .option('-dts, --deployts <script>', 'Deploy with typescript (Web files + room)')
+    .option('-nr, --newreact <script>', 'Create a new react script')
+    .option('-b, --build <script>', 'Build a script')
+program.parse(process.argv);
+const options = program.opts();
+if (options.html) {
+    require('dotenv').config({ path: resolve(__dirname, '../.env') });
+    return new HtmlUploader(options.html);
+}
+if (options.deploy) {
+    // require('dotenv').config({ path: resolve(__dirname, '../.env') });
+    // new HtmlUploader(options.deploy);
+    return new Deploy(options.deploy);
+}
+if (options.script) {
+    return new Script(options.script);
+}
+if (options.token) {
+    return setToken(options.token);
+}
+if (options.new) {
+    return newScript(options.new);
+}
+if (options.rollup) {
+    return new Rollup(options.rollup);
+}
+if (options.deployts) {
+    return new DeployTs(options.deployts);
+}
+if (options.rollupts) {
+    return new RollupTs(options.rollupts);
+}
+if (options.newreact) {
+    return new React(options.newreact);
+}
+if (options.build) {
+    return new Build(options.build);
+}
+program.help();
+//new Script(options.production);

package/bin/react-template/html/eslint.config.js ADDED Viewed

@@ -0,0 +1,28 @@
+import js from '@eslint/js'
+import globals from 'globals'
+import reactHooks from 'eslint-plugin-react-hooks'
+import reactRefresh from 'eslint-plugin-react-refresh'
+import tseslint from 'typescript-eslint'
+export default tseslint.config(
+  { ignores: ['dist'] },
+  {
+    extends: [js.configs.recommended, ...tseslint.configs.recommended],
+    files: ['**/*.{ts,tsx}'],
+    languageOptions: {
+      ecmaVersion: 2020,
+      globals: globals.browser,
+    },
+    plugins: {
+      'react-hooks': reactHooks,
+      'react-refresh': reactRefresh,
+    },
+    rules: {
+      ...reactHooks.configs.recommended.rules,
+      'react-refresh/only-export-components': [
+        'warn',
+        { allowConstantExport: true },
+      ],
+    },
+  },
+)

package/bin/react-template/html/index.html ADDED Viewed

@@ -0,0 +1,7 @@
+<!doctype html>
+<html lang="en">
+  <body>
+    <div id="root_%workspaceName%"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>

package/bin/react-template/html/package.json ADDED Viewed

@@ -0,0 +1,34 @@
+{
+  "name": "vite-react-typescript-starter",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "lint": "eslint .",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "lucide-react": "^0.344.0",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "use-between": "^1.3.5"
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.9.1",
+    "@types/react": "^18.3.5",
+    "@types/react-dom": "^18.3.0",
+    "@vitejs/plugin-react": "^4.3.1",
+    "autoprefixer": "^10.4.18",
+    "eslint": "^9.9.1",
+    "eslint-plugin-react-hooks": "^5.1.0-rc.0",
+    "eslint-plugin-react-refresh": "^0.4.11",
+    "globals": "^15.9.0",
+    "postcss": "^8.4.35",
+    "tailwindcss": "^3.4.1",
+    "typescript": "^5.5.3",
+    "typescript-eslint": "^8.3.0",
+    "vite": "^5.4.2"
+  }
+}

package/bin/react-template/html/postcss.config.js ADDED Viewed

@@ -0,0 +1,6 @@
+export default {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+}

package/bin/react-template/html/src/App.tsx ADDED Viewed

@@ -0,0 +1,33 @@
+import { useEffect } from 'react';
+import { useMessageEvent } from './hooks';
+import { User, useUserContext } from './hooks';
+export default function App() {
+  const { updateUser } = useUserContext();
+  const { on, off, send } = useMessageEvent();
+  useEffect(() => {
+    on('update-user', (data: unknown) => {
+      const { user } = data as { user: User };
+      if (user) updateUser(user);
+    });
+    send('ready', {});
+    return () => {
+      off('update-user');
+    };
+  }, []);
+  /* Example
+  return (
+    <div className="%workspaceName%-flex %workspaceName%-flex-col %workspaceName%-items-center %workspaceName%-justify-center %workspaceName%-h-screen %workspaceName%-bg-gray-100">
+      <h1>React Template</h1>
+      <p>Esse é um template para começar a usar o React no %workspaceName%.</p>
+      <p>Para mais informações, veja a documentação do React.</p>
+      <p>Essa é uma aplicação simples, mas você pode expandi-la como quiser.</p>
+    </div>
+  ) */
+  return null;
+}

package/bin/react-template/html/src/hooks/index.ts ADDED Viewed

@@ -0,0 +1,3 @@
+export * from './useDraggable';
+export * from './useMessageEvent';
+export * from './useUserContext';

package/bin/react-template/html/src/hooks/useDraggable.ts ADDED Viewed

@@ -0,0 +1,69 @@
+import { useState, useEffect, RefObject, useCallback } from 'react';
+interface Position {
+  x: number;
+  y: number;
+}
+export function useDraggable(elementRef: RefObject<HTMLElement>, handler?: string) {
+  const [position, setPosition] = useState<Position>({
+    x: window.innerWidth * 0.8 / 2,
+    y: window.innerHeight * 0.5 / 2
+  });
+  const [isDragging, setIsDragging] = useState(false);
+  const [dragOffset, setDragOffset] = useState<Position>({ x: 0, y: 0 });
+  const handleMouseDown = useCallback((e: React.MouseEvent) => {
+    if (!elementRef.current) return;
+    if (handler && e.target !== elementRef.current.querySelector(handler)) return;
+    const rect = elementRef.current.getBoundingClientRect();
+    setDragOffset({
+      x: e.clientX - rect.left,
+      y: e.clientY - rect.top
+    });
+    setIsDragging(true);
+  }, [elementRef, handler]);
+  const handleMouseMove = useCallback((e: MouseEvent) => {
+    if (!isDragging) return;
+    requestAnimationFrame(() => {
+      setPosition({
+        x: Math.max(0, Math.min(window.innerWidth - (elementRef.current?.offsetWidth || 0), e.clientX - dragOffset.x)),
+        y: Math.max(0, Math.min(window.innerHeight - (elementRef.current?.offsetHeight || 0), e.clientY - dragOffset.y))
+      });
+    });
+  }, [isDragging, dragOffset, elementRef]);
+  const handleMouseUp = useCallback(() => {
+    setIsDragging(false);
+  }, []);
+  useEffect(() => {
+    if (isDragging) {
+      window.addEventListener('mousemove', handleMouseMove, { passive: true });
+      window.addEventListener('mouseup', handleMouseUp);
+      document.body.style.userSelect = 'none';
+      document.body.style.cursor = 'grabbing';
+    } else {
+      document.body.style.userSelect = '';
+      document.body.style.cursor = '';
+    }
+    return () => {
+      window.removeEventListener('mousemove', handleMouseMove);
+      window.removeEventListener('mouseup', handleMouseUp);
+      document.body.style.userSelect = '';
+      document.body.style.cursor = '';
+    };
+  }, [isDragging, handleMouseMove, handleMouseUp]);
+  return {
+    position,
+    handleMouseDown
+  };
+}

package/bin/react-template/html/src/hooks/useMessageEvent.ts ADDED Viewed

@@ -0,0 +1,120 @@
+import { useEffect, useCallback, useMemo } from 'react';
+interface MessageEvent {
+  detail: {
+    name: string;
+    data: string;
+  };
+}
+interface DisposeEvent {
+  detail: {
+    allScripts: boolean;
+  };
+}
+declare global {
+  interface Window {
+    sendScriptMessage: (event: string, data: object) => void;
+  }
+}
+const workspaceName = "%workspaceName%"
+const isDebbuging = true;
+export function useMessageEvent() {
+  const events = useMemo(() => new Map<string, (data: unknown) => void>(), []);
+  const emit = useCallback((event: MessageEvent) => {
+    const { name, data } = event.detail;
+    const isMassUpdate = name === `${workspaceName}-mass-update`;
+    let parsedData: unknown = data;
+    if (data !== '' && (data.startsWith('{') && data.endsWith('}') || data.startsWith('[') && data.endsWith(']'))) {
+      try {
+        parsedData = JSON.parse(data);
+      } catch {
+        return;
+      }
+    }
+    if (isMassUpdate) {
+      const eventsData = parsedData as { events: { eventName: string, data?: unknown }[] };
+      if (!eventsData.events) {
+        return;
+      }
+      eventsData.events.forEach(event => {
+        const callback = events.get(event.eventName);
+        if (callback) {
+          if (isDebbuging) {
+            console.log('Event:', event.eventName);
+            console.log('Data:', event.data);
+          }
+          callback(event.data);
+        }
+      });
+      return;
+    }
+    const callback = events.get(name);
+    if (callback) {
+      if (isDebbuging) {
+        console.log('Event:', name);
+        console.log('Data:', data);
+      }
+      callback(parsedData);
+    }
+  }, [events]);
+  const dispose = useCallback((event: DisposeEvent): void => {
+    if (!event?.detail?.allScripts) return;
+    events.clear();
+  }, [events]);
+  const on = useCallback((event: string, callback: (data: unknown) => void): void => {
+    events.set(`${workspaceName}-` + event, callback);
+  }, [events]);
+  const off = useCallback((event: string): void => {
+    events.delete(`${workspaceName}-` + event);
+  }, [events]);
+  const send = useCallback((event: string, data: object): void => {
+    try {
+      window.sendScriptMessage(`${workspaceName}-` + event, data);
+    }
+    catch {
+      // empty
+    }
+  }, []);
+  useEffect(() => {
+    const scriptEvents = document.getElementById('script-events');
+    if (scriptEvents) {
+      scriptEvents.addEventListener('uiMessage', emit as unknown as EventListener);
+      scriptEvents.addEventListener('dispose', dispose as unknown as EventListener);
+    }
+    return () => {
+      if (scriptEvents) {
+        scriptEvents.removeEventListener('uiMessage', emit as unknown as EventListener);
+        scriptEvents.removeEventListener('dispose', dispose as unknown as EventListener);
+        events.clear();
+      }
+    };
+  }, [emit, dispose, events]);
+  return {
+    on,
+    off,
+    send
+  };
+}

package/bin/react-template/html/src/hooks/useUserContext.ts ADDED Viewed

@@ -0,0 +1,24 @@
+import { useState } from 'react';
+import { useBetween } from 'use-between';
+export interface User {
+  name: string;
+}
+const useUserContextState = () => {
+  const [user, setUser] = useState<User>({
+    name: ''
+  });
+  const updateUser = (newUser: Partial<User>) => {
+    setUser((prevUser: User) => ({
+      ...prevUser,
+      ...newUser,
+    }));
+  };
+  return { user, updateUser };
+};
+export const useUserContext = () => useBetween(useUserContextState);

package/bin/react-template/html/src/index.css ADDED Viewed

@@ -0,0 +1,5 @@
+#root_%workspaceName% {
+  @tailwind base;
+  @tailwind components;
+  @tailwind utilities;
+}

package/bin/react-template/html/src/main.tsx ADDED Viewed

@@ -0,0 +1,10 @@
+import { StrictMode } from 'react'
+import { createRoot } from 'react-dom/client'
+import App from './App.tsx'
+import './index.css'
+createRoot(document.getElementById('root_%workspaceName%')!).render(
+  <StrictMode>
+    <App />
+  </StrictMode>,
+)

package/bin/react-template/html/src/vite-env.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ /// <reference types="vite/client" />

package/bin/react-template/html/tailwind.config.js ADDED Viewed

@@ -0,0 +1,12 @@
+/** @type {import('tailwindcss').Config} */
+export default {
+  content: [
+    "./index.html",
+    "./src/**/*.{js,ts,jsx,tsx}",
+  ],
+  prefix: "%workspaceName%-",
+  theme: {
+    extend: {},
+  },
+  plugins: [],
+}

package/bin/react-template/html/tsconfig.app.json ADDED Viewed

@@ -0,0 +1,24 @@
+{
+  "compilerOptions": {
+    "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
+  },
+  "include": ["src"]
+}

package/bin/react-template/html/tsconfig.json ADDED Viewed

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

package/bin/react-template/html/tsconfig.node.json ADDED Viewed

@@ -0,0 +1,22 @@
+{
+  "compilerOptions": {
+    "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
+  },
+  "include": ["vite.config.ts"]
+}

package/bin/react-template/html/vite.config.ts ADDED Viewed

@@ -0,0 +1,10 @@
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react'
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [react()],
+  optimizeDeps: {
+    exclude: ['lucide-react'],
+  },
+})