@arcanewizards/timecode-toolbox 0.0.3 → 0.1.1

package/package.json

@@ -1,12 +1,16 @@
 {
   "name": "@arcanewizards/timecode-toolbox",
-  "version": "0.0.3",
+  "version": "0.1.1",
   "private": false,
+  "license": "MIT",
   "repository": {
     "type": "git",
     "url": "https://github.com/ArcaneWizards/open-source.git",
     "directory": "apps/timecode-toolbox"
   },
+  "bin": {
+    "timecode-toolbox": "./dist/start.js"
+  },
   "exports": {
     ".": {
       "@arcanewizards/source": "./src/index.ts",
@@ -23,30 +27,15 @@
     "./entrypoint.css": "./dist/entrypoint.css",
     "./package.json": "./package.json"
   },
-  "scripts": {
-    "build": "pnpm check:types && rm -rf dist && tsup && pnpm build:entrypoint && pnpm build:frontend && pnpm build:styles && check-export-map",
-    "build:entrypoint": "arcane-build-frontend --entry src/components/frontend/entrypoint.ts --outfile dist/entrypoint.js --sourcemap",
-    "build:frontend": "arcane-build-frontend --entry src/components/frontend/index.tsx --outfile dist/frontend.js --sourcemap",
-    "build:styles": "tailwindcss -i ./src/components/frontend/frontend.css -o ./dist/entrypoint.css",
-    "check:types": "tsc --noEmit",
-    "format:fix": "cd .. && pnpm format:fix",
-    "lint": "eslint . --max-warnings 0",
-    "lint:fix": "eslint . --max-warnings 0 --fix",
-    "start": "pnpm build:entrypoint && pnpm build:styles && node --import=tsx --conditions=@arcanewizards/source src/start"
-  },
+  "files": [
+    "LICENSE",
+    "dist"
+  ],
   "devDependencies": {
     "@arcanejs/build-utils": "^0.1.2",
     "@arcanejs/diff": "^0.5.2",
     "@arcanejs/protocol": "^0.8.0",
-    "@arcanejs/react-toolkit": "^0.15.1",
-    "@arcanejs/toolkit": "^8.0.0",
     "@arcanejs/toolkit-frontend": "^0.11.0",
-    "@arcanewizards/artnet": "workspace:^",
-    "@arcanewizards/eslint-config": "workspace:^",
-    "@arcanewizards/net-utils": "workspace:^",
-    "@arcanewizards/sigil": "workspace:^",
-    "@arcanewizards/tcnet": "workspace:^",
-    "@arcanewizards/typescript-config": "workspace:^",
     "@types/lodash": "^4.17.13",
     "@types/node": "^22.19.3",
     "@types/react": "^19.2.2",
@@ -55,20 +44,40 @@
     "eslint": "^9",
     "eslint-plugin-better-tailwindcss": "^4.2.0",
     "lodash": "^4.17.21",
-    "pino": "^9.5.0",
-    "pino-pretty": "^11.3.0",
-    "react": "^19.2.0",
     "tailwindcss": "^4.1.13",
     "tsup": "^8.3.5",
     "tsx": "^4.19.1",
     "typescript": "^5.7.3",
     "uuid": "^11.0.3",
-    "zod": "^3.22.4"
-  },
-  "dependencies": {
+    "zod": "^3.22.4",
     "@tailwindcss/cli": "^4.1.13",
     "music-metadata": "^11.0.0",
     "osc-js": "^2.4.1",
-    "radix-ui": "^1.4.3"
+    "radix-ui": "^1.4.3",
+    "@arcanewizards/apis": "^0.0.1",
+    "@arcanewizards/artnet": "^0.1.3",
+    "@arcanewizards/eslint-config": "^0.0.0",
+    "@arcanewizards/net-utils": "^0.1.3",
+    "@arcanewizards/sigil": "^0.1.3",
+    "@arcanewizards/tcnet": "^0.1.3",
+    "@arcanewizards/typescript-config": "^0.0.0"
+  },
+  "dependencies": {
+    "@arcanejs/react-toolkit": "^0.15.1",
+    "@arcanejs/toolkit": "^8.0.0",
+    "pino": "^9.5.0",
+    "pino-pretty": "^11.3.0",
+    "react": "^19.2.0"
+  },
+  "scripts": {
+    "build": "pnpm check:types && rm -rf dist && cp ../../LICENSE ./LICENSE && tsup && pnpm build:entrypoint && pnpm build:frontend && pnpm build:styles && check-export-map",
+    "build:entrypoint": "arcane-build-frontend --entry src/components/frontend/entrypoint.ts --outfile dist/entrypoint.js --sourcemap",
+    "build:frontend": "arcane-build-frontend --entry src/components/frontend/index.tsx --outfile dist/frontend.js --sourcemap",
+    "build:styles": "tailwindcss -i ./src/components/frontend/frontend.css -o ./dist/entrypoint.css",
+    "check:types": "tsc --noEmit",
+    "format:fix": "cd .. && pnpm format:fix",
+    "lint": "eslint . --max-warnings 0",
+    "lint:fix": "eslint . --max-warnings 0 --fix",
+    "start": "pnpm build:entrypoint && pnpm build:styles && node --import=tsx --conditions=@arcanewizards/source src/start"
   }
-}
+}

package/.turbo/turbo-build.log

@@ -1,55 +0,0 @@
-
-
-> @arcanewizards/timecode-toolbox@0.0.3 build /Users/sam/repos/arcane/open-source/apps/timecode-toolbox
-> pnpm check:types && rm -rf dist && tsup && pnpm build:entrypoint && pnpm build:frontend && pnpm build:styles && check-export-map
-
-
-> @arcanewizards/timecode-toolbox@0.0.3 check:types /Users/sam/repos/arcane/open-source/apps/timecode-toolbox
-> tsc --noEmit
-
-CLI Building entry: src/index.ts, src/components/frontend/index.tsx
-CLI Using tsconfig: tsconfig.json
-CLI tsup v8.3.5
-CLI Using tsup config: /Users/sam/repos/arcane/open-source/apps/timecode-toolbox/tsup.config.ts
-CLI Target: es2022
-CJS Build start
-ESM Build start
-CJS dist/index.js                     2.03 MB
-CJS dist/components/frontend/index.js 1.96 MB
-CJS ⚡️ Build success in 142ms
-ESM dist/components/frontend/index.mjs 1.96 MB
-ESM dist/index.mjs                     2.03 MB
-ESM ⚡️ Build success in 143ms
-DTS Build start
-DTS ⚡️ Build success in 2650ms
-DTS dist/index.d.ts                      2.18 KB
-DTS dist/components/frontend/index.d.ts  649.00 B
-DTS dist/index.d.mts                     2.18 KB
-DTS dist/components/frontend/index.d.mts 649.00 B
-
-> @arcanewizards/timecode-toolbox@0.0.3 build:entrypoint /Users/sam/repos/arcane/open-source/apps/timecode-toolbox
-> arcane-build-frontend --entry src/components/frontend/entrypoint.ts --outfile dist/entrypoint.js --sourcemap
-
-
-  dist/entrypoint.js      1.7mb ⚠️
-  dist/entrypoint.js.map  2.8mb
-
-⚡ Done in 869ms
-
-> @arcanewizards/timecode-toolbox@0.0.3 build:frontend /Users/sam/repos/arcane/open-source/apps/timecode-toolbox
-> arcane-build-frontend --entry src/components/frontend/index.tsx --outfile dist/frontend.js --sourcemap
-
-
-  dist/frontend.js      1.7mb ⚠️
-  dist/frontend.js.map  2.8mb
-
-⚡ Done in 802ms
-
-> @arcanewizards/timecode-toolbox@0.0.3 build:styles /Users/sam/repos/arcane/open-source/apps/timecode-toolbox
-> tailwindcss -i ./src/components/frontend/frontend.css -o ./dist/entrypoint.css
-
-≈ tailwindcss v4.2.1
-
-Done in 47ms
-Checking export maps...
- PASS  package.json

package/CHANGELOG.md

@@ -1,24 +0,0 @@
-# @arcanewizards/timecode-toolbox
-
-## 0.0.3
-
-### Patch Changes
-
-- Introduce Appearance Settings
-
-  Make it possible to choose between light/dark/os mode,
-  and to pick a primary interface color.
-
-- Introduce new clock generator
-
-  Introduce a new generator that uses the local time of the system clock,
-  and can be started, stopped, reset etc...
-
-  This can be connected to an output like all the existing inputs.
-
-- Allow individual timecodes to be opened in new window
-
-  For cases where users want to be able to focus on one particular timecode,
-  or have complex multi-window / workspace. /monitor setups where they want to be
-  able to display specific timecodes in different places,
-  it's now possible to open a specific timecode in a new window.

package/eslint.config.mjs

@@ -1,49 +0,0 @@
-import { defineConfig } from 'eslint/config';
-import { fileURLToPath } from 'url';
-import { dirname } from 'path';
-
-import {
-  tsParser,
-  js,
-  FlatCompat,
-} from '@arcanewizards/eslint-config/dependencies.js';
-import eslintPluginBetterTailwindcss from 'eslint-plugin-better-tailwindcss';
-import reactTailwindConfig from '@arcanewizards/eslint-config/react-tailwind.js';
-
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = dirname(__filename);
-const { REACT_TAILWIND_CALLEES } = reactTailwindConfig;
-
-const compat = new FlatCompat({
-  baseDirectory: __dirname,
-  recommendedConfig: js.configs.recommended,
-  allConfig: js.configs.all,
-});
-
-export default defineConfig([
-  {
-    extends: compat.extends('@arcanewizards/eslint-config/library.js'),
-
-    languageOptions: {
-      parser: tsParser,
-    },
-  },
-  {
-    extends: [eslintPluginBetterTailwindcss.configs.recommended],
-    settings: {
-      'better-tailwindcss': {
-        entryPoint: './src/components/frontend/frontend.css',
-        tsconfig: './tsconfig.json',
-        callees: REACT_TAILWIND_CALLEES,
-      },
-    },
-    rules: {
-      'better-tailwindcss/no-unknown-classes': 'error',
-    },
-  },
-  {
-    rules: {
-      'turbo/no-undeclared-env-vars': 'off',
-    },
-  },
-]);

package/src/app.tsx

@@ -1,147 +0,0 @@
-import {
-  AppShell,
-  AppListenerManager,
-  SigilRuntimeAppProps,
-} from '@arcanewizards/sigil';
-import {
-  JSX,
-  ReactNode,
-  useCallback,
-  useEffect,
-  useMemo,
-  useState,
-} from 'react';
-import { C } from './components/backend';
-import { ToolboxConfigData } from './config';
-import path from 'node:path';
-import { useDataFileContext } from '@arcanejs/react-toolkit/data';
-import {
-  ApplicationState,
-  AvailableHandlers,
-  DEFAULT_CONFIG,
-  TimecodeHandlerMethods,
-  ToolboxConfig,
-  ToolboxRootCallHandler,
-} from './components/proto';
-import { patchJson, Diff } from '@arcanejs/diff';
-import { InputConnections } from './inputs';
-import { OutputConnections } from './outputs';
-import { Generators } from './generators';
-import { TimecodeHandlers } from './types';
-import { getTreeValue, mapTree, Tree } from './tree';
-
-export type AppApi = Record<never, never>;
-
-export type TimecodeToolboxAppProps = {
-  dataDirectory: string;
-};
-
-export type AppProps = SigilRuntimeAppProps<AppApi, TimecodeToolboxAppProps>;
-
-export const App = ({
-  title,
-  version,
-  toolkit,
-  dataDirectory,
-  logger,
-  logEventEmitter,
-  setWindowUrl,
-  shutdownContext,
-}: AppProps): ReactNode => {
-  const { data, error, updateData, resetData } =
-    useDataFileContext(ToolboxConfigData);
-
-  useEffect(() => {
-    if (error) {
-      logger.warn('Resetting config to application default');
-      resetData();
-    }
-  }, [logger, error, resetData]);
-
-  const onUpdateConfig = (diff: Diff<ToolboxConfig>) => {
-    updateData((prev) => patchJson(prev, diff) ?? DEFAULT_CONFIG);
-  };
-
-  const [state, setState] = useState<Omit<ApplicationState, 'handlers'>>({
-    inputs: {},
-    outputs: {},
-    generators: {},
-  });
-
-  const [handlers, setHandlers] = useState<TimecodeHandlers>({ children: {} });
-
-  const availableHandlers: Tree<AvailableHandlers> = useMemo(
-    () =>
-      mapTree(handlers, (node) =>
-        Object.fromEntries(
-          Object.entries(node)
-            .filter(([_, handler]) => handler)
-            .map(([key]) => [key, true]),
-        ),
-      ),
-    [handlers],
-  );
-
-  const callHandler = useCallback(
-    async <H extends keyof AvailableHandlers>(
-      call: ToolboxRootCallHandler<H>,
-    ) => {
-      const handlerFunc = getTreeValue(handlers, call.path)?.[call.handler];
-      if (handlerFunc) {
-        return await (
-          handlerFunc as (
-            ...args: Parameters<NonNullable<TimecodeHandlerMethods[H]>>
-          ) => void
-        )(...call.args);
-      }
-      throw new Error(
-        `No handler found for path: ${call.path.join(' -> ')} and handler: ${call.handler}`,
-      );
-    },
-    [handlers],
-  );
-
-  return (
-    <AppShell
-      title={title}
-      version={version}
-      dataDirectory={dataDirectory}
-      logger={logger}
-      logEventEmitter={logEventEmitter}
-      shutdownContext={shutdownContext}
-    >
-      <C.ToolboxRoot
-        config={data}
-        state={state}
-        handlers={availableHandlers}
-        onUpdateConfig={onUpdateConfig}
-        onCallHandler={callHandler}
-      />
-      <InputConnections state={state} setState={setState} />
-      <Generators state={state} setState={setState} setHandlers={setHandlers} />
-      <OutputConnections state={state} setState={setState} />
-      <AppListenerManager
-        toolkit={toolkit}
-        setWindowUrl={setWindowUrl}
-        listenerConfig={{
-          default: {
-            port: {
-              from: 4100,
-              to: 4200,
-            },
-          },
-        }}
-      />
-    </AppShell>
-  );
-};
-
-export const createApp = (props: AppProps): JSX.Element => {
-  return (
-    <ToolboxConfigData.Provider
-      path={path.join(props.dataDirectory, 'config.json')}
-    >
-      <App {...props} />
-    </ToolboxConfigData.Provider>
-  );
-};

package/src/components/backend/index.ts

@@ -1,6 +0,0 @@
-import { prepareComponents } from '@arcanejs/react-toolkit';
-import { ToolboxRoot } from './toolbox-root';
-
-export const C = prepareComponents('timecode-toolbox', {
-  ToolboxRoot,
-});

package/src/components/backend/toolbox-root.ts

@@ -1,119 +0,0 @@
-import { IDMap } from '@arcanejs/toolkit/util';
-import { Diff } from '@arcanejs/diff';
-
-import {
-  Base,
-  EventEmitter,
-  Listenable,
-} from '@arcanejs/toolkit/components/base';
-import {
-  TimecodeToolboxComponentCalls,
-  Namespace,
-  ToolboxRootComponent,
-  ToolboxConfig,
-  isTimecodeToolboxComponentMessage,
-  DEFAULT_CONFIG,
-  isTimecodeToolboxComponentCall,
-  ToolboxRootCallHandler,
-} from '../proto';
-import {
-  AnyClientComponentCall,
-  AnyClientComponentMessage,
-} from '@arcanejs/protocol';
-import { getNetworkInterfaces } from '@arcanewizards/net-utils';
-
-export type Events = {
-  updateConfig: (diff: Diff<ToolboxConfig>) => void;
-  callHandler: (call: ToolboxRootCallHandler) => Promise<void>;
-};
-
-export type AppRootProps = Pick<
-  ToolboxRootComponent,
-  'config' | 'state' | 'handlers'
-> & {
-  onUpdateConfig?: Events['updateConfig'];
-  onCallHandler?: Events['callHandler'];
-};
-
-const DEFAULT_PROPS: AppRootProps = {
-  config: DEFAULT_CONFIG,
-  state: {
-    inputs: {},
-    outputs: {},
-    generators: {},
-  },
-  handlers: { children: {} },
-};
-
-export class ToolboxRoot
-  extends Base<
-    Namespace,
-    ToolboxRootComponent,
-    AppRootProps,
-    TimecodeToolboxComponentCalls
-  >
-  implements Listenable<Events>
-{
-  /** @hidden */
-  private readonly events = new EventEmitter<Events>();
-
-  public constructor(props: AppRootProps) {
-    super(DEFAULT_PROPS, props, {
-      onPropsUpdated: (oldProps) =>
-        this.events.processPropChanges(
-          {
-            onUpdateConfig: 'updateConfig',
-            onCallHandler: 'callHandler',
-          },
-          oldProps,
-          this.props,
-        ),
-    });
-    this.triggerInitialPropsUpdate();
-  }
-
-  addListener = this.events.addListener;
-  removeListener = this.events.removeListener;
-
-  /** @hidden */
-  public getProtoInfo(idMap: IDMap): ToolboxRootComponent {
-    return {
-      namespace: 'timecode-toolbox',
-      component: 'toolbox-root',
-      key: idMap.getId(this),
-      config: this.props.config,
-      state: this.props.state,
-      handlers: this.props.handlers,
-    };
-  }
-
-  /** @hidden */
-  public handleMessage = (message: AnyClientComponentMessage) => {
-    if (isTimecodeToolboxComponentMessage(message, 'toolbox-root')) {
-      if (message.action === 'update-config') {
-        this.events.emit('updateConfig', message.diff);
-      }
-    }
-  };
-
-  /** @hidden */
-  public handleCall = async (call: AnyClientComponentCall) => {
-    if (
-      isTimecodeToolboxComponentCall(
-        call,
-        'toolbox-root-get-network-interfaces',
-      )
-    ) {
-      return getNetworkInterfaces();
-    } else if (
-      isTimecodeToolboxComponentCall(call, 'toolbox-root-call-handler')
-    ) {
-      const result = await this.events.emit('callHandler', call);
-      if (result[0]) {
-        return result[0];
-      }
-      throw new Error(`No handler for callHandler`);
-    }
-    throw new Error(`Unhandled call action: ${call.action}`);
-  };
-}

package/src/components/frontend/constants.ts

@@ -1,81 +0,0 @@
-import { TIMECODE_FPS } from '@arcanewizards/artnet/constants';
-
-const MS_FORMAT = new Intl.NumberFormat(undefined, {
-  style: 'unit',
-  unit: 'millisecond',
-  maximumFractionDigits: 0,
-});
-
-export const STRINGS = {
-  title: 'Timecode Toolbox',
-  debugger: 'Debug Tools & Log',
-  connectionError: 'Disconnected from Timecode Toolbox Server',
-  reconnect: 'Reconnect',
-  openInNewWindow: 'Open in new window',
-  toggle: (text: string) => `Toggle ${text}`,
-  close: (text: string) => `Close ${text}`,
-  protocols: {
-    artnet: {
-      short: 'ArtNet',
-      long: 'ArtNet',
-    },
-    tcnet: {
-      short: 'TCNet',
-      long: 'TCNet (ShowKontrol / Pioneer)',
-    },
-  },
-  inputs: {
-    title: 'INPUTS',
-    noChildren: 'No inputs yet. Please add one using the buttons below.',
-    addButton: (protocol: string) => `Add ${protocol}`,
-    addDialog: (protocol: string) => `Add ${protocol} Input`,
-    editDialog: (protocol: string, name: string) =>
-      `Edit ${protocol} Input ${name}`,
-  },
-  smtpeModes: {
-    SMPTE: `SMPTE ${TIMECODE_FPS.SMPTE}FPS`,
-    FILM: `FILM ${TIMECODE_FPS.FILM}FPS`,
-    EBU: `EBU ${TIMECODE_FPS.EBU}FPS`,
-    DF: `DF ${TIMECODE_FPS.DF}FPS`,
-  },
-  smtpeModeOptions: {
-    SMPTE: `SMPTE (${TIMECODE_FPS.SMPTE}FPS) (Recommended)`,
-    FILM: `FILM (${TIMECODE_FPS.FILM}FPS)`,
-    EBU: `EBU (${TIMECODE_FPS.EBU}FPS)`,
-    DF: `DF (${TIMECODE_FPS.DF}FPS)`,
-  },
-  accuracy: (accuracyMillis: number) =>
-    `Accuracy: ${MS_FORMAT.format(accuracyMillis)}`,
-  delay: (delayMs: number) => `Delay: ${MS_FORMAT.format(delayMs)}`,
-  generators: {
-    title: 'GENERATORS',
-    noChildren: 'No generators yet. Please add one using the buttons below.',
-    type: {
-      clock: 'Clock',
-    },
-    addDialog: (protocol: string) => `Add ${protocol} Generator`,
-    editDialog: (protocol: string, name: string) =>
-      `Edit ${protocol} Generator ${name}`,
-  },
-  outputs: {
-    title: 'OUTPUTS',
-    noChildren: 'No outputs yet. Please add one using the buttons below.',
-    addButton: (protocol: string) => `Add ${protocol}`,
-    addDialog: (protocol: string) => `Add ${protocol} Output`,
-    editDialog: (protocol: string, name: string) =>
-      `Edit ${protocol} Output ${name}`,
-  },
-  settings: {
-    title: 'Settings',
-  },
-  controls: {
-    play: 'Play',
-    pause: 'Pause',
-    beginning: 'Reset timecode to start',
-    back5seconds: 'Back 5 Seconds',
-    forward5seconds: 'Forward 5 Seconds',
-  },
-  errors: {
-    unknownTimecodeID: 'Unknown timecode ID, please close the window',
-  },
-} as const;

package/src/components/frontend/entrypoint.ts

@@ -1,12 +0,0 @@
-import {
-  startTimecodeToolboxServerFrontend,
-  TimecodeToolboxBrowserContext,
-} from '.';
-
-declare global {
-  interface Window {
-    BROWSER_CONTEXT?: TimecodeToolboxBrowserContext;
-  }
-}
-
-startTimecodeToolboxServerFrontend(window.BROWSER_CONTEXT);