@hiroleague/taskmanager 0.0.3 → 0.0.4

package/src/client/index.css

@@ -1,249 +1,249 @@
-@import "tailwindcss";
-@import "tw-animate-css";
-@import "shadcn/tailwind.css";
-@import "@fontsource-variable/plus-jakarta-sans";
-@import "@fontsource/lora";
-
-@custom-variant dark (&:is(.dark *));
-
-@theme inline {
-  --color-background: var(--background);
-  --color-foreground: var(--foreground);
-  --color-card: var(--card);
-  --color-card-foreground: var(--card-foreground);
-  --color-popover: var(--popover);
-  --color-popover-foreground: var(--popover-foreground);
-  --color-primary: var(--primary);
-  --color-primary-foreground: var(--primary-foreground);
-  --color-secondary: var(--secondary);
-  --color-secondary-foreground: var(--secondary-foreground);
-  --color-muted: var(--muted);
-  --color-muted-foreground: var(--muted-foreground);
-  --color-accent: var(--accent);
-  --color-accent-foreground: var(--accent-foreground);
-  --color-destructive: var(--destructive);
-  --color-destructive-foreground: var(--destructive-foreground);
-  --color-border: var(--border);
-  --color-input: var(--input);
-  --color-ring: var(--ring);
-  --color-chart-1: var(--chart-1);
-  --color-chart-2: var(--chart-2);
-  --color-chart-3: var(--chart-3);
-  --color-chart-4: var(--chart-4);
-  --color-chart-5: var(--chart-5);
-  --radius-sm: calc(var(--radius) * 0.6);
-  --radius-md: calc(var(--radius) * 0.8);
-  --radius-lg: var(--radius);
-  --radius-xl: calc(var(--radius) * 1.4);
-  --radius-2xl: calc(var(--radius) * 1.8);
-  --radius-3xl: calc(var(--radius) * 2.2);
-  --radius-4xl: calc(var(--radius) * 2.6);
-  --color-sidebar: var(--sidebar);
-  --color-sidebar-foreground: var(--sidebar-foreground);
-  --color-sidebar-primary: var(--sidebar-primary);
-  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
-  --color-sidebar-accent: var(--sidebar-accent);
-  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
-  --color-sidebar-border: var(--sidebar-border);
-  --color-sidebar-ring: var(--sidebar-ring);
-  --color-header: var(--header);
-  --color-header-border: var(--header-border);
-  --color-board-canvas: var(--board-canvas);
-  --color-list-column: var(--list-column);
-  --color-task-card: var(--task-card);
-  --color-task-card-foreground: var(--task-card-foreground);
-  /* Swap typography roles so body uses Jakarta and headings use Lora. */
-  --font-sans: 'Plus Jakarta Sans Variable', sans-serif;
-  --font-heading: 'Lora', serif;
-}
-
-:root {
-  --radius: 0.625rem;
-  --background: oklch(1 0 0);
-  --foreground: oklch(0.141 0.005 285.823);
-  --card: oklch(0.9 0 0);
-  --card-foreground: oklch(0.141 0.005 285.823);
-  --popover: oklch(1 0 0);
-  --popover-foreground: oklch(0.141 0.005 285.823);
-  --primary: oklch(0.5 0.134 242.749);
-  --primary-foreground: oklch(0.977 0.013 236.62);
-  --secondary: oklch(0.967 0.001 286.375);
-  --secondary-foreground: oklch(0.21 0.006 285.885);
-  --muted: oklch(0.967 0.001 286.375);
-  --muted-foreground: oklch(0.552 0.016 285.938);
-  --accent: oklch(0.967 0.001 286.375);
-  --accent-foreground: oklch(0.21 0.006 285.885);
-  --destructive: oklch(0.577 0.245 27.325);
-  --border: oklch(0.92 0.004 286.32);
-  --input: oklch(0.92 0.004 286.32);
-  --ring: oklch(0.705 0.015 286.067);
-  --chart-1: oklch(0.871 0.006 286.286);
-  --chart-2: oklch(0.552 0.016 285.938);
-  --chart-3: oklch(0.442 0.017 285.786);
-  --chart-4: oklch(0.37 0.013 285.805);
-  --chart-5: oklch(0.274 0.006 286.033);
-  --sidebar: oklch(0.985 0 0);
-  --sidebar-foreground: oklch(0.141 0.005 285.823);
-  --sidebar-primary: oklch(0.588 0.158 241.966);
-  --sidebar-primary-foreground: oklch(0.977 0.013 236.62);
-  --sidebar-accent: oklch(0.967 0.001 286.375);
-  --sidebar-accent-foreground: oklch(0.21 0.006 285.885);
-  --sidebar-border: oklch(0.92 0.004 286.32);
-  --sidebar-ring: oklch(0.705 0.015 286.067);
-  --scrollbar-track: oklch(0.94 0 0);
-  --scrollbar-thumb: oklch(0.72 0 0);
-  --scrollbar-thumb-hover: oklch(0.62 0 0);
-  --board-canvas: var(--background);
-  /* Muted surface so list columns read against the board; task cards use --task-card */
-  --list-column: var(--muted);
-  --task-card: var(--card);
-  --task-card-foreground: var(--card-foreground);
-  --header: var(--background);
-  --header-border: var(--border);
-}
-
-.dark {
-  --background: oklch(0.141 0.005 285.823);
-  --foreground: oklch(0.985 0 0);
-  --card: oklch(0.21 0.006 285.885);
-  --card-foreground: oklch(0.985 0 0);
-  --popover: oklch(0.21 0.006 285.885);
-  --popover-foreground: oklch(0.985 0 0);
-  --primary: oklch(0.443 0.11 240.79);
-  --primary-foreground: oklch(0.977 0.013 236.62);
-  --secondary: oklch(0.274 0.006 286.033);
-  --secondary-foreground: oklch(0.985 0 0);
-  --muted: oklch(0.274 0.006 286.033);
-  --muted-foreground: oklch(0.705 0.015 286.067);
-  --accent: oklch(0.274 0.006 286.033);
-  --accent-foreground: oklch(0.985 0 0);
-  --destructive: oklch(0.704 0.191 22.216);
-  --border: oklch(1 0 0 / 10%);
-  --input: oklch(1 0 0 / 15%);
-  --ring: oklch(0.552 0.016 285.938);
-  --chart-1: oklch(0.871 0.006 286.286);
-  --chart-2: oklch(0.552 0.016 285.938);
-  --chart-3: oklch(0.442 0.017 285.786);
-  --chart-4: oklch(0.37 0.013 285.805);
-  --chart-5: oklch(0.274 0.006 286.033);
-  /* Sidebar: cool charcoal (slightly blue) so it reads as “dark gray” vs. near-black header */
-  --sidebar: oklch(0.21 0.006 285.885);
-  --sidebar-foreground: oklch(0.985 0 0);
-  --sidebar-primary: oklch(0.685 0.169 237.323);
-  --sidebar-primary-foreground: oklch(0.293 0.066 243.157);
-  --sidebar-accent: oklch(0.274 0.006 286.033);
-  --sidebar-accent-foreground: oklch(0.985 0 0);
-  --sidebar-border: oklch(1 0 0 / 10%);
-  --sidebar-ring: oklch(0.552 0.016 285.938);
-  /* Header strip: true dark; separates from sidebar + main canvas */
-  --header: oklch(0.06 0.004 285);
-  --header-border: oklch(1 0 0 / 11%);
-  --scrollbar-track: oklch(0.2 0 0);
-  --scrollbar-thumb: oklch(0.4 0 0);
-  --scrollbar-thumb-hover: oklch(0.5 0 0);
-  /* Between --background and --card; list columns match sidebar */
-  --board-canvas: oklch(0.178 0.006 285.85);
-  --list-column: var(--sidebar);
-  /* Same C/H as --sidebar; only L is higher so cards read as one step above the list */
-  --task-card: oklch(0.30 0.016 268);
-  --task-card-foreground: oklch(0.985 0 0);
-}
-
-@layer base {
-  * {
-    @apply border-border outline-ring/50;
-    scrollbar-width: thin;
-    scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
-  }
-
-  *::-webkit-scrollbar {
-    width: 10px;
-    height: 10px;
-  }
-
-  *::-webkit-scrollbar-track {
-    background: var(--scrollbar-track);
-  }
-
-  *::-webkit-scrollbar-thumb {
-    background-color: var(--scrollbar-thumb);
-    border-radius: 9999px;
-    border: 2px solid transparent;
-    background-clip: padding-box;
-  }
-
-  *::-webkit-scrollbar-thumb:hover {
-    background-color: var(--scrollbar-thumb-hover);
-  }
-
-  body {
-    @apply antialiased bg-background text-foreground;
-  }
-  html {
-    @apply font-sans;
-  }
-  /* Apply the requested heading font globally without changing theme colors. */
-  h1, h2, h3, h4, h5, h6 {
-    @apply font-heading;
-  }
-}
-
-@layer components {
-  /* App header title: teal-first cool gradient (no orange); light uses darker stops for white bg */
-  .app-title-gradient {
-    /* Use background-image, not background: shorthand resets background-clip and breaks text clipping */
-    background-image: linear-gradient(90deg, #0f766e 0%, #0e7490 42%, #0369a1 100%);
-    -webkit-background-clip: text;
-    background-clip: text;
-    color: #0f766e;
-    -webkit-text-fill-color: transparent;
-  }
-
-  .dark .app-title-gradient {
-    background-image: linear-gradient(90deg, #2dd4bf 0%, #22d3ee 48%, #7dd3fc 100%);
-  }
-
-  /*
-   * Board stats chips — waiting-to-load indicator.
-   * Source / find later: https://css-loaders.com/dots/ (search repo: css-loaders.com/dots)
-   * Namespaced class + keyframes to avoid colliding with a generic `.loader`.
-   */
-  .board-stats-dots-loader {
-    width: 14px;
-    aspect-ratio: 1;
-    opacity: 0.85;
-    color: inherit;
-    --_g: no-repeat radial-gradient(farthest-side, currentColor 90%, transparent);
-    background: var(--_g), var(--_g), var(--_g), var(--_g);
-    background-size: 40% 40%;
-    animation: board-stats-dots-l46 1s infinite;
-  }
-
-  @keyframes board-stats-dots-l46 {
-    0% {
-      background-position: 0 0, 100% 0, 100% 100%, 0 100%;
-    }
-    40%,
-    50% {
-      background-position: 100% 100%, 100% 0, 0 0, 0 100%;
-    }
-    90%,
-    100% {
-      background-position: 100% 100%, 0 100%, 0 0, 100% 0;
-    }
-  }
-
-  /*
-   * Task MD editor (@uiw/react-md-editor): Tailwind Preflight sets ul/ol { list-style: none },
-   * which removes bullets and numbers in the preview pane. Restore normal list styling here.
-   * Checkbox task lines use .contains-task-list li.task-list-item { list-style: none } from the library.
-   */
-  .task-md-editor .w-md-editor-preview ul {
-    list-style-type: disc;
-    padding-inline-start: 1.5rem;
-  }
-  .task-md-editor .w-md-editor-preview ol {
-    list-style-type: decimal;
-    padding-inline-start: 1.5rem;
-  }
+@import "tailwindcss";
+@import "tw-animate-css";
+@import "shadcn/tailwind.css";
+@import "@fontsource-variable/plus-jakarta-sans";
+@import "@fontsource/lora";
+
+@custom-variant dark (&:is(.dark *));
+
+@theme inline {
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --color-card: var(--card);
+  --color-card-foreground: var(--card-foreground);
+  --color-popover: var(--popover);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-primary: var(--primary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-secondary: var(--secondary);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-muted: var(--muted);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-accent: var(--accent);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-destructive: var(--destructive);
+  --color-destructive-foreground: var(--destructive-foreground);
+  --color-border: var(--border);
+  --color-input: var(--input);
+  --color-ring: var(--ring);
+  --color-chart-1: var(--chart-1);
+  --color-chart-2: var(--chart-2);
+  --color-chart-3: var(--chart-3);
+  --color-chart-4: var(--chart-4);
+  --color-chart-5: var(--chart-5);
+  --radius-sm: calc(var(--radius) * 0.6);
+  --radius-md: calc(var(--radius) * 0.8);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) * 1.4);
+  --radius-2xl: calc(var(--radius) * 1.8);
+  --radius-3xl: calc(var(--radius) * 2.2);
+  --radius-4xl: calc(var(--radius) * 2.6);
+  --color-sidebar: var(--sidebar);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-ring: var(--sidebar-ring);
+  --color-header: var(--header);
+  --color-header-border: var(--header-border);
+  --color-board-canvas: var(--board-canvas);
+  --color-list-column: var(--list-column);
+  --color-task-card: var(--task-card);
+  --color-task-card-foreground: var(--task-card-foreground);
+  /* Swap typography roles so body uses Jakarta and headings use Lora. */
+  --font-sans: 'Plus Jakarta Sans Variable', sans-serif;
+  --font-heading: 'Lora', serif;
+}
+
+:root {
+  --radius: 0.625rem;
+  --background: oklch(1 0 0);
+  --foreground: oklch(0.141 0.005 285.823);
+  --card: oklch(0.9 0 0);
+  --card-foreground: oklch(0.141 0.005 285.823);
+  --popover: oklch(1 0 0);
+  --popover-foreground: oklch(0.141 0.005 285.823);
+  --primary: oklch(0.5 0.134 242.749);
+  --primary-foreground: oklch(0.977 0.013 236.62);
+  --secondary: oklch(0.967 0.001 286.375);
+  --secondary-foreground: oklch(0.21 0.006 285.885);
+  --muted: oklch(0.967 0.001 286.375);
+  --muted-foreground: oklch(0.552 0.016 285.938);
+  --accent: oklch(0.967 0.001 286.375);
+  --accent-foreground: oklch(0.21 0.006 285.885);
+  --destructive: oklch(0.577 0.245 27.325);
+  --border: oklch(0.92 0.004 286.32);
+  --input: oklch(0.92 0.004 286.32);
+  --ring: oklch(0.705 0.015 286.067);
+  --chart-1: oklch(0.871 0.006 286.286);
+  --chart-2: oklch(0.552 0.016 285.938);
+  --chart-3: oklch(0.442 0.017 285.786);
+  --chart-4: oklch(0.37 0.013 285.805);
+  --chart-5: oklch(0.274 0.006 286.033);
+  --sidebar: oklch(0.985 0 0);
+  --sidebar-foreground: oklch(0.141 0.005 285.823);
+  --sidebar-primary: oklch(0.588 0.158 241.966);
+  --sidebar-primary-foreground: oklch(0.977 0.013 236.62);
+  --sidebar-accent: oklch(0.967 0.001 286.375);
+  --sidebar-accent-foreground: oklch(0.21 0.006 285.885);
+  --sidebar-border: oklch(0.92 0.004 286.32);
+  --sidebar-ring: oklch(0.705 0.015 286.067);
+  --scrollbar-track: oklch(0.94 0 0);
+  --scrollbar-thumb: oklch(0.72 0 0);
+  --scrollbar-thumb-hover: oklch(0.62 0 0);
+  --board-canvas: var(--background);
+  /* Muted surface so list columns read against the board; task cards use --task-card */
+  --list-column: var(--muted);
+  --task-card: var(--card);
+  --task-card-foreground: var(--card-foreground);
+  --header: var(--background);
+  --header-border: var(--border);
+}
+
+.dark {
+  --background: oklch(0.141 0.005 285.823);
+  --foreground: oklch(0.985 0 0);
+  --card: oklch(0.21 0.006 285.885);
+  --card-foreground: oklch(0.985 0 0);
+  --popover: oklch(0.21 0.006 285.885);
+  --popover-foreground: oklch(0.985 0 0);
+  --primary: oklch(0.443 0.11 240.79);
+  --primary-foreground: oklch(0.977 0.013 236.62);
+  --secondary: oklch(0.274 0.006 286.033);
+  --secondary-foreground: oklch(0.985 0 0);
+  --muted: oklch(0.274 0.006 286.033);
+  --muted-foreground: oklch(0.705 0.015 286.067);
+  --accent: oklch(0.274 0.006 286.033);
+  --accent-foreground: oklch(0.985 0 0);
+  --destructive: oklch(0.704 0.191 22.216);
+  --border: oklch(1 0 0 / 10%);
+  --input: oklch(1 0 0 / 15%);
+  --ring: oklch(0.552 0.016 285.938);
+  --chart-1: oklch(0.871 0.006 286.286);
+  --chart-2: oklch(0.552 0.016 285.938);
+  --chart-3: oklch(0.442 0.017 285.786);
+  --chart-4: oklch(0.37 0.013 285.805);
+  --chart-5: oklch(0.274 0.006 286.033);
+  /* Sidebar: cool charcoal (slightly blue) so it reads as “dark gray” vs. near-black header */
+  --sidebar: oklch(0.21 0.006 285.885);
+  --sidebar-foreground: oklch(0.985 0 0);
+  --sidebar-primary: oklch(0.685 0.169 237.323);
+  --sidebar-primary-foreground: oklch(0.293 0.066 243.157);
+  --sidebar-accent: oklch(0.274 0.006 286.033);
+  --sidebar-accent-foreground: oklch(0.985 0 0);
+  --sidebar-border: oklch(1 0 0 / 10%);
+  --sidebar-ring: oklch(0.552 0.016 285.938);
+  /* Header strip: true dark; separates from sidebar + main canvas */
+  --header: oklch(0.06 0.004 285);
+  --header-border: oklch(1 0 0 / 11%);
+  --scrollbar-track: oklch(0.2 0 0);
+  --scrollbar-thumb: oklch(0.4 0 0);
+  --scrollbar-thumb-hover: oklch(0.5 0 0);
+  /* Between --background and --card; list columns match sidebar */
+  --board-canvas: oklch(0.178 0.006 285.85);
+  --list-column: var(--sidebar);
+  /* Same C/H as --sidebar; only L is higher so cards read as one step above the list */
+  --task-card: oklch(0.30 0.016 268);
+  --task-card-foreground: oklch(0.985 0 0);
+}
+
+@layer base {
+  * {
+    @apply border-border outline-ring/50;
+    scrollbar-width: thin;
+    scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
+  }
+
+  *::-webkit-scrollbar {
+    width: 10px;
+    height: 10px;
+  }
+
+  *::-webkit-scrollbar-track {
+    background: var(--scrollbar-track);
+  }
+
+  *::-webkit-scrollbar-thumb {
+    background-color: var(--scrollbar-thumb);
+    border-radius: 9999px;
+    border: 2px solid transparent;
+    background-clip: padding-box;
+  }
+
+  *::-webkit-scrollbar-thumb:hover {
+    background-color: var(--scrollbar-thumb-hover);
+  }
+
+  body {
+    @apply antialiased bg-background text-foreground;
+  }
+  html {
+    @apply font-sans;
+  }
+  /* Apply the requested heading font globally without changing theme colors. */
+  h1, h2, h3, h4, h5, h6 {
+    @apply font-heading;
+  }
+}
+
+@layer components {
+  /* App header title: teal-first cool gradient (no orange); light uses darker stops for white bg */
+  .app-title-gradient {
+    /* Use background-image, not background: shorthand resets background-clip and breaks text clipping */
+    background-image: linear-gradient(90deg, #0f766e 0%, #0e7490 42%, #0369a1 100%);
+    -webkit-background-clip: text;
+    background-clip: text;
+    color: #0f766e;
+    -webkit-text-fill-color: transparent;
+  }
+
+  .dark .app-title-gradient {
+    background-image: linear-gradient(90deg, #2dd4bf 0%, #22d3ee 48%, #7dd3fc 100%);
+  }
+
+  /*
+   * Board stats chips — waiting-to-load indicator.
+   * Source / find later: https://css-loaders.com/dots/ (search repo: css-loaders.com/dots)
+   * Namespaced class + keyframes to avoid colliding with a generic `.loader`.
+   */
+  .board-stats-dots-loader {
+    width: 14px;
+    aspect-ratio: 1;
+    opacity: 0.85;
+    color: inherit;
+    --_g: no-repeat radial-gradient(farthest-side, currentColor 90%, transparent);
+    background: var(--_g), var(--_g), var(--_g), var(--_g);
+    background-size: 40% 40%;
+    animation: board-stats-dots-l46 1s infinite;
+  }
+
+  @keyframes board-stats-dots-l46 {
+    0% {
+      background-position: 0 0, 100% 0, 100% 100%, 0 100%;
+    }
+    40%,
+    50% {
+      background-position: 100% 100%, 100% 0, 0 0, 0 100%;
+    }
+    90%,
+    100% {
+      background-position: 100% 100%, 0 100%, 0 0, 100% 0;
+    }
+  }
+
+  /*
+   * Task MD editor (@uiw/react-md-editor): Tailwind Preflight sets ul/ol { list-style: none },
+   * which removes bullets and numbers in the preview pane. Restore normal list styling here.
+   * Checkbox task lines use .contains-task-list li.task-list-item { list-style: none } from the library.
+   */
+  .task-md-editor .w-md-editor-preview ul {
+    list-style-type: disc;
+    padding-inline-start: 1.5rem;
+  }
+  .task-md-editor .w-md-editor-preview ol {
+    list-style-type: decimal;
+    padding-inline-start: 1.5rem;
+  }
 }

package/src/client/lib/appNavigate.ts

@@ -1,16 +1,16 @@
-import type { NavigateFunction } from "react-router-dom";
-
-let impl: NavigateFunction | null = null;
-
-/** Called from a component under the router (e.g. once on mount). */
-export function registerAppNavigate(fn: NavigateFunction | null): void {
-  impl = fn;
-}
-
-/** Imperative navigation for mutations and non-component code. */
-export function appNavigate(
-  to: string,
-  options?: { replace?: boolean },
-): void {
-  impl?.(to, { replace: options?.replace ?? false });
-}
+import type { NavigateFunction } from "react-router-dom";
+
+let impl: NavigateFunction | null = null;
+
+/** Called from a component under the router (e.g. once on mount). */
+export function registerAppNavigate(fn: NavigateFunction | null): void {
+  impl = fn;
+}
+
+/** Imperative navigation for mutations and non-component code. */
+export function appNavigate(
+  to: string,
+  options?: { replace?: boolean },
+): void {
+  impl?.(to, { replace: options?.replace ?? false });
+}