@pantoken/drupal 0.1.0

package/README.md

@@ -0,0 +1,59 @@
+# @pantoken/drupal
+
+Emit an Instructure-themed Drupal 10/11 sub-theme: the token stylesheet plus the `*.info.yml` and
+`*.libraries.yml` a theme needs to load it. Drop the files into `themes/custom/<machine>/`.
+
+## Install
+
+```sh
+npm i @pantoken/drupal
+```
+
+Also available as `pantoken/drupal`.
+
+## Usage
+
+```ts
+import { toDrupalTheme } from "@pantoken/drupal";
+
+const files = toDrupalTheme({ name: "Instructure" });
+// [ instructure.info.yml, instructure.libraries.yml, css/tokens.css, css/pantoken-prose.css ]
+for (const { path, content } of files) {
+  /* write `path` under themes/custom/instructure/ */
+}
+```
+
+Or via the CLI, straight into a theme directory:
+
+```sh
+pantoken generate drupal --out ./themes/custom/instructure
+```
+
+## Output
+
+- `<machine>.info.yml` — the theme manifest (`core_version_requirement: ^10 || ^11`), attaching the
+  `tokens` library.
+- `<machine>.libraries.yml` — a `tokens` library that loads `css/tokens.css` and
+  `css/pantoken-prose.css`.
+- `css/tokens.css` — the `@pantoken/css` token stylesheet, defining the `--instui-*` custom
+  properties your theme and modules consume.
+- `css/pantoken-prose.css` — an InstUI-look stylesheet (from `@pantoken/components`) for rendered
+  content in a `.pantoken-prose` region (tables, headings, links, code).
+
+`<machine>` is the display name lower-snake-cased (for example `Instructure` → `instructure`).
+
+## API
+
+- **`toDrupalTheme(options?): DrupalFile[]`** — build the sub-theme files. `options` takes `name`
+  (display name, default `"Instructure"`) and `baseTheme` (default `false`).
+- **`machineName(name): string`** — convert a display name to a Drupal machine name (`lower_snake`).
+- **`DrupalFile`** — a generated file: `path` (theme-relative) and `content`.
+- **`ToDrupalThemeOptions`** — the options `toDrupalTheme` accepts.
+
+## Related
+
+- Wraps `@pantoken/css` (the token stylesheet) and `@pantoken/components` (the content look).
+
+## License
+
+MIT

package/dist/index.d.mts

@@ -0,0 +1,56 @@
+//#region src/index.d.ts
+/** A generated file: a theme-relative path and its contents. */
+interface DrupalFile {
+  path: string;
+  content: string;
+}
+/**
+ * Convert a display name to a Drupal machine name (`lower_snake`).
+ *
+ * @example
+ * ```ts
+ * import { machineName } from "@pantoken/drupal";
+ *
+ * machineName("Instructure"); // "instructure"
+ * machineName("My Canvas Theme"); // "my_canvas_theme"
+ * ```
+ */
+declare function machineName(name: string): string;
+/** Options for {@link toDrupalTheme}. */
+interface ToDrupalThemeOptions {
+  /** The theme's human-readable name (default `"Instructure"`). */
+  name?: string;
+  /** The base theme (default `false` — a standalone theme). */
+  baseTheme?: string | false;
+}
+/**
+ * Build the files for a Drupal sub-theme that loads the Instructure tokens.
+ *
+ * @param options - {@link ToDrupalThemeOptions}.
+ * @returns The theme files, paths relative to the theme directory.
+ *
+ * @example Build and write a standalone sub-theme
+ * ```ts
+ * import { writeFileSync, mkdirSync } from "node:fs";
+ * import { dirname, join } from "node:path";
+ * import { toDrupalTheme } from "@pantoken/drupal";
+ *
+ * const files = toDrupalTheme({ name: "Instructure" });
+ * // [ instructure.info.yml, instructure.libraries.yml, css/tokens.css, css/pantoken-prose.css ]
+ * for (const { path, content } of files) {
+ *   const dest = join("./themes/custom/instructure", path);
+ *   mkdirSync(dirname(dest), { recursive: true });
+ *   writeFileSync(dest, content);
+ * }
+ * ```
+ *
+ * @example Build a sub-theme on top of a base theme
+ * ```ts
+ * import { toDrupalTheme } from "@pantoken/drupal";
+ *
+ * const files = toDrupalTheme({ name: "Instructure", baseTheme: "olivero" });
+ * ```
+ */
+declare function toDrupalTheme(options?: ToDrupalThemeOptions): DrupalFile[];
+//#endregion
+export { DrupalFile, ToDrupalThemeOptions, machineName, toDrupalTheme };

package/dist/index.mjs

@@ -0,0 +1,99 @@
+import { css } from "@pantoken/css";
+import { proseCss } from "@pantoken/components";
+//#region src/index.ts
+/**
+* `@pantoken/drupal` — emit an Instructure-themed Drupal sub-theme.
+*
+* Produces the token stylesheet (from `@pantoken/css`) and an InstUI-look prose stylesheet (from
+* `@pantoken/components`, styling content in a `.pantoken-prose` region), plus the `*.info.yml`
+* and `*.libraries.yml` a Drupal 10/11 theme needs to load them. Drop the files into
+* `themes/custom/<machine>/`.
+*
+* @module
+* @experimental
+*/
+/**
+* Convert a display name to a Drupal machine name (`lower_snake`).
+*
+* @example
+* ```ts
+* import { machineName } from "@pantoken/drupal";
+*
+* machineName("Instructure"); // "instructure"
+* machineName("My Canvas Theme"); // "my_canvas_theme"
+* ```
+*/
+function machineName(name) {
+	return name.toLowerCase().replace(/[^a-z0-9]+/g, "_").replace(/^_+|_+$/g, "") || "pantoken";
+}
+/**
+* Build the files for a Drupal sub-theme that loads the Instructure tokens.
+*
+* @param options - {@link ToDrupalThemeOptions}.
+* @returns The theme files, paths relative to the theme directory.
+*
+* @example Build and write a standalone sub-theme
+* ```ts
+* import { writeFileSync, mkdirSync } from "node:fs";
+* import { dirname, join } from "node:path";
+* import { toDrupalTheme } from "@pantoken/drupal";
+*
+* const files = toDrupalTheme({ name: "Instructure" });
+* // [ instructure.info.yml, instructure.libraries.yml, css/tokens.css, css/pantoken-prose.css ]
+* for (const { path, content } of files) {
+*   const dest = join("./themes/custom/instructure", path);
+*   mkdirSync(dirname(dest), { recursive: true });
+*   writeFileSync(dest, content);
+* }
+* ```
+*
+* @example Build a sub-theme on top of a base theme
+* ```ts
+* import { toDrupalTheme } from "@pantoken/drupal";
+*
+* const files = toDrupalTheme({ name: "Instructure", baseTheme: "olivero" });
+* ```
+*/
+function toDrupalTheme(options = {}) {
+	const name = options.name ?? "Instructure";
+	const machine = machineName(name);
+	const baseTheme = options.baseTheme ?? false;
+	const info = [
+		`name: ${name}`,
+		"type: theme",
+		`base theme: ${baseTheme === false ? "false" : baseTheme}`,
+		"core_version_requirement: ^10 || ^11",
+		"libraries:",
+		`  - ${machine}/tokens`,
+		""
+	].join("\n");
+	const libraries = [
+		"tokens:",
+		"  version: 1.x",
+		"  css:",
+		"    theme:",
+		"      css/tokens.css: {}",
+		"      css/pantoken-prose.css: {}",
+		""
+	].join("\n");
+	return [
+		{
+			path: `${machine}.info.yml`,
+			content: info
+		},
+		{
+			path: `${machine}.libraries.yml`,
+			content: libraries
+		},
+		{
+			path: "css/tokens.css",
+			content: css
+		},
+		{
+			path: "css/pantoken-prose.css",
+			content: proseCss({ scope: ".pantoken-prose" })
+		}
+	];
+}
+//#endregion
+export { machineName, toDrupalTheme };

package/package.json

@@ -0,0 +1,37 @@
+{
+  "name": "@pantoken/drupal",
+  "version": "0.1.0",
+  "description": "Emit an Instructure-themed Drupal sub-theme: token CSS plus *.info.yml and *.libraries.yml.",
+  "license": "MIT",
+  "files": [
+    "dist"
+  ],
+  "type": "module",
+  "exports": {
+    ".": "./dist/index.mjs",
+    "./package.json": "./package.json"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "@pantoken/components": "0.1.0",
+    "@pantoken/css": "0.1.0"
+  },
+  "devDependencies": {
+    "@types/node": "^24.13.3",
+    "typescript": "^6.0.3",
+    "vite": "npm:@voidzero-dev/vite-plus-core@0.2.4",
+    "vite-plus": "0.2.4"
+  },
+  "pantoken": {
+    "key": "drupal",
+    "kind": "subpath"
+  },
+  "scripts": {
+    "build": "vp pack",
+    "dev": "vp pack --watch",
+    "test": "vp test",
+    "check": "vp check"
+  }
+}