Add custom /scotty command

.devcontainer/devcontainer.json

@@ -0,0 +1,24 @@
+// For format details, see https://aka.ms/devcontainer.json. For config options, see the
+// README at: https://github.com/devcontainers/templates/tree/main/src/typescript-node
+{
+	"name": "Node.js & TypeScript",
+	// Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile
+	"image": "mcr.microsoft.com/devcontainers/typescript-node:5-22-bookworm",
+
+	"postCreateCommand": "curl -fsSL https://bun.sh/install | bash"
+
+	// Features to add to the dev container. More info: https://containers.dev/features.
+	// "features": {},
+
+	// Use 'forwardPorts' to make a list of ports inside the container available locally.
+	// "forwardPorts": [],
+
+	// Use 'postCreateCommand' to run commands after the container is created.
+	// "postCreateCommand": "yarn install",
+
+	// Configure tool-specific properties.
+	// "customizations": {},
+
+	// Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root.
+	// "remoteUser": "root"
+}

.github/workflows/test.yml

@@ -57,6 +57,10 @@ jobs:
             turbo-${{ runner.os }}-${{ hashFiles('turbo.json', '**/package.json') }}-
             turbo-${{ runner.os }}-
 
+      - name: Validate UI class prop refactor
+        working-directory: packages/ui
+        run: bun test src/props.test.ts --coverage --coverage-reporter=text --coverage-reporter=lcov --coverage-dir=./coverage
+
       - name: Run unit tests
         timeout-minutes: 10
         # Default turbo concurrency (10) oversubscribes ubuntu-latest's 4

packages/tui/src/app.tsx

@@ -806,6 +806,32 @@ function App(props: { onSnapshot?: () => Promise<string[]>; pluginHost: TuiPlugi
         },
         category: "System",
       },
+      {
+        name: "scotty.show",
+        title: "Show Scotty the Scottish Terrier",
+        slashName: "scotty",
+        run: () => {
+          dialog.replace(() => (
+            <DialogAlert
+              title="Scotty the Scottish Terrier"
+              message={String.raw`     /\  /\
+    /  \/  \___
+   |  o        @\
+   |      ______/
+   /     /                 /|
+  /      \________________/ |
+ |                          |
+ |      T A R T A N          |
+  \     PRIDE!      ________/
+   |   |  |   |   |  |   |
+   |___|  |___|   |__|___|
+
+Go Tartans!`}
+            />
+          ))
+        },
+        category: "System",
+      },
       {
         name: "help.show",
         title: "Help",

packages/ui/src/components/dock-surface.tsx

@@ -1,54 +1,19 @@
 import { type ComponentProps, splitProps } from "solid-js"
+import { withClassList } from "../props"
 
 export interface DockTrayProps extends ComponentProps<"div"> {
   attach?: "none" | "top"
 }
 
 export function DockShell(props: ComponentProps<"div">) {
-  const [split, rest] = splitProps(props, ["children", "class", "classList"])
-  return (
-    <div
-      {...rest}
-      data-dock-surface="shell"
-      classList={{
-        ...split.classList,
-        [split.class ?? ""]: !!split.class,
-      }}
-    >
-      {split.children}
-    </div>
-  )
+  return <div {...withClassList(props)} data-dock-surface="shell" />
 }
 
 export function DockShellForm(props: ComponentProps<"form">) {
-  const [split, rest] = splitProps(props, ["children", "class", "classList"])
-  return (
-    <form
-      {...rest}
-      data-dock-surface="shell"
-      classList={{
-        ...split.classList,
-        [split.class ?? ""]: !!split.class,
-      }}
-    >
-      {split.children}
-    </form>
-  )
+  return <form {...withClassList(props)} data-dock-surface="shell" />
 }
 
 export function DockTray(props: DockTrayProps) {
-  const [split, rest] = splitProps(props, ["attach", "children", "class", "classList"])
-  return (
-    <div
-      {...rest}
-      data-dock-surface="tray"
-      data-dock-attach={split.attach || "none"}
-      classList={{
-        ...split.classList,
-        [split.class ?? ""]: !!split.class,
-      }}
-    >
-      {split.children}
-    </div>
-  )
+  const [split, rest] = splitProps(props, ["attach"])
+  return <div {...withClassList(rest)} data-dock-surface="tray" data-dock-attach={split.attach || "none"} />
 }

packages/ui/src/components/tag.tsx

@@ -1,22 +1,11 @@
 import { type ComponentProps, splitProps } from "solid-js"
+import { withClassList } from "../props"
 
 export interface TagProps extends ComponentProps<"span"> {
   size?: "normal" | "large"
 }
 
 export function Tag(props: TagProps) {
-  const [split, rest] = splitProps(props, ["size", "class", "classList", "children"])
-  return (
-    <span
-      {...rest}
-      data-component="tag"
-      data-size={split.size || "normal"}
-      classList={{
-        ...split.classList,
-        [split.class ?? ""]: !!split.class,
-      }}
-    >
-      {split.children}
-    </span>
-  )
+  const [split, rest] = splitProps(props, ["size"])
+  return <span {...withClassList(rest)} data-component="tag" data-size={split.size || "normal"} />
 }