fix(storybook): Rename sb framework package

Tobbe · Tobbe · commit b1327f75c4a9 · 2025-05-18T23:02:13.000+02:00
diff --git a/README.md b/README.md
@@ -26,7 +26,7 @@ Search and replace all instances of `@redwoodjs` in all files with `@cedarjs`.
 Pay attention to `yarn.lock`. If anything changed in there you probably have to
 do some manual editing. Also find all mentions of
 `storybook-framework-redwoodjs-vite` and replace with
-`storybook-framework-cedar`
+`storybook-framework-cedarjs`
 
 Cedar doesn't have the equivalent of Redwood Studio yet. So Studio will not
 work for now. Let me know if that's something you use and need.
diff --git a/docs/docs/storybook.md b/docs/docs/storybook.md
@@ -32,7 +32,7 @@ If this is your first time running Storybook:
 - The Redwood CLI will install Storybook, the framework package, and all related dependencies.
 - The Redwood CLI will create the following config files for you:
   - `web/.storybook/main.ts`
-    - This is the primary [Storybook configuration file](https://storybook.js.org/docs/7/configure). Note that it references our framework package, [`storybook-framework-cedar`](https://www.npmjs.com/package/storybook-framework-cedar).
+    - This is the primary [Storybook configuration file](https://storybook.js.org/docs/7/configure). Note that it references our framework package, [`storybook-framework-cedarjs`](https://www.npmjs.com/package/storybook-framework-cedarjs).
   - `web/.storybook/preview-body.html`
     - This is required to change the `id` of the root div to `redwood-app`, which is what the entry file used by Vite requires.
 
diff --git a/docs/versioned_docs/version-0.0.1/storybook.md b/docs/versioned_docs/version-0.0.1/storybook.md
@@ -32,7 +32,7 @@ If this is your first time running Storybook:
 - The Redwood CLI will install Storybook, the framework package, and all related dependencies.
 - The Redwood CLI will create the following config files for you:
   - `web/.storybook/main.ts`
-    - This is the primary [Storybook configuration file](https://storybook.js.org/docs/7/configure). Note that it references our framework package, [`storybook-framework-cedar`](https://www.npmjs.com/package/storybook-framework-cedar).
+    - This is the primary [Storybook configuration file](https://storybook.js.org/docs/7/configure). Note that it references our framework package, [`storybook-framework-cedarjs`](https://www.npmjs.com/package/storybook-framework-cedarjs).
   - `web/.storybook/preview-body.html`
     - This is required to change the `id` of the root div to `redwood-app`, which is what the entry file used by Vite requires.
 
diff --git a/docs/versioned_docs/version-0.0.2/storybook.md b/docs/versioned_docs/version-0.0.2/storybook.md
@@ -32,7 +32,7 @@ If this is your first time running Storybook:
 - The Redwood CLI will install Storybook, the framework package, and all related dependencies.
 - The Redwood CLI will create the following config files for you:
   - `web/.storybook/main.ts`
-    - This is the primary [Storybook configuration file](https://storybook.js.org/docs/7/configure). Note that it references our framework package, [`storybook-framework-cedar`](https://www.npmjs.com/package/storybook-framework-cedar).
+    - This is the primary [Storybook configuration file](https://storybook.js.org/docs/7/configure). Note that it references our framework package, [`storybook-framework-cedarjs`](https://www.npmjs.com/package/storybook-framework-cedarjs).
   - `web/.storybook/preview-body.html`
     - This is required to change the `id` of the root div to `redwood-app`, which is what the entry file used by Vite requires.
 
diff --git a/docs/versioned_docs/version-0.0.3/storybook.md b/docs/versioned_docs/version-0.0.3/storybook.md
@@ -32,7 +32,7 @@ If this is your first time running Storybook:
 - The Redwood CLI will install Storybook, the framework package, and all related dependencies.
 - The Redwood CLI will create the following config files for you:
   - `web/.storybook/main.ts`
-    - This is the primary [Storybook configuration file](https://storybook.js.org/docs/7/configure). Note that it references our framework package, [`storybook-framework-cedar`](https://www.npmjs.com/package/storybook-framework-cedar).
+    - This is the primary [Storybook configuration file](https://storybook.js.org/docs/7/configure). Note that it references our framework package, [`storybook-framework-cedarjs`](https://www.npmjs.com/package/storybook-framework-cedarjs).
   - `web/.storybook/preview-body.html`
     - This is required to change the `id` of the root div to `redwood-app`, which is what the entry file used by Vite requires.
 
diff --git a/docs/versioned_docs/version-0.0.4/storybook.md b/docs/versioned_docs/version-0.0.4/storybook.md
@@ -32,7 +32,7 @@ If this is your first time running Storybook:
 - The Redwood CLI will install Storybook, the framework package, and all related dependencies.
 - The Redwood CLI will create the following config files for you:
   - `web/.storybook/main.ts`
-    - This is the primary [Storybook configuration file](https://storybook.js.org/docs/7/configure). Note that it references our framework package, [`storybook-framework-cedar`](https://www.npmjs.com/package/storybook-framework-cedar).
+    - This is the primary [Storybook configuration file](https://storybook.js.org/docs/7/configure). Note that it references our framework package, [`storybook-framework-cedarjs`](https://www.npmjs.com/package/storybook-framework-cedarjs).
   - `web/.storybook/preview-body.html`
     - This is required to change the `id` of the root div to `redwood-app`, which is what the entry file used by Vite requires.
 
diff --git a/docs/versioned_docs/version-8.0/storybook.md b/docs/versioned_docs/version-8.0/storybook.md
@@ -32,7 +32,7 @@ If this is your first time running Storybook:
 - The Redwood CLI will install Storybook, the framework package, and all related dependencies.
 - The Redwood CLI will create the following config files for you:
   - `web/.storybook/main.ts`
-    - This is the primary [Storybook configuration file](https://storybook.js.org/docs/7/configure). Note that it references our framework package, [`storybook-framework-cedar`](https://www.npmjs.com/package/storybook-framework-cedar).
+    - This is the primary [Storybook configuration file](https://storybook.js.org/docs/7/configure). Note that it references our framework package, [`storybook-framework-cedarjs`](https://www.npmjs.com/package/storybook-framework-cedarjs).
   - `web/.storybook/preview-body.html`
     - This is required to change the `id` of the root div to `redwood-app`, which is what the entry file used by Vite requires.
 
diff --git a/packages/cli-packages/storybook-vite/package.json b/packages/cli-packages/storybook-vite/package.json
@@ -29,7 +29,7 @@
     "execa": "5.1.1",
     "semver": "7.6.3",
     "storybook": "7.6.20",
-    "storybook-framework-cedar": "workspace:*",
+    "storybook-framework-cedarjs": "workspace:*",
     "terminal-link": "2.1.1",
     "vitest": "2.1.9",
     "yargs": "17.7.2"
diff --git a/packages/cli-packages/storybook-vite/src/__tests__/storybookConfigFixtures.test.ts b/packages/cli-packages/storybook-vite/src/__tests__/storybookConfigFixtures.test.ts
@@ -8,14 +8,14 @@ describe('storybook config file fixtures', () => {
     console.log('mainTemplatePath', mainTemplatePath)
     const mainTemplate = fs.readFileSync(mainTemplatePath, { encoding: 'utf8' })
     expect(mainTemplate).toMatchInlineSnapshot(`
-      "import type { StorybookConfig } from 'storybook-framework-cedar'
+      "import type { StorybookConfig } from 'storybook-framework-cedarjs'
 
       import { getPaths, importStatementPath } from '@cedarjs/project-config'
 
       const cedarProjectPaths = getPaths()
 
       const config: StorybookConfig = {
-        framework: 'storybook-framework-cedar',
+        framework: 'storybook-framework-cedarjs',
 
         stories: [
           \`\${importStatementPath(
diff --git a/packages/cli-packages/storybook-vite/src/commands/templates/main.ts.template b/packages/cli-packages/storybook-vite/src/commands/templates/main.ts.template
@@ -1,11 +1,11 @@
-import type { StorybookConfig } from 'storybook-framework-cedar'
+import type { StorybookConfig } from 'storybook-framework-cedarjs'
 
 import { getPaths, importStatementPath } from '@cedarjs/project-config'
 
 const cedarProjectPaths = getPaths()
 
 const config: StorybookConfig = {
-  framework: 'storybook-framework-cedar',
+  framework: 'storybook-framework-cedarjs',
 
   stories: [
     `${importStatementPath(
diff --git a/packages/storybook/package.json b/packages/storybook/package.json
@@ -1,7 +1,7 @@
 {
-  "name": "storybook-framework-cedar",
-  "version": "0.0.3",
-  "description": "Storybook for Cedar with Vite",
+  "name": "storybook-framework-cedarjs",
+  "version": "0.0.4",
+  "description": "Storybook for CedarJS",
   "keywords": [
     "Storybook",
     "Cedar",
@@ -44,7 +44,7 @@
   ],
   "scripts": {
     "build": "tsx build.ts && yarn build:types",
-    "build:pack": "yarn pack -o storybook-framework-cedar.tgz",
+    "build:pack": "yarn pack -o storybook-framework-cedarjs.tgz",
     "build:types": "tsc --build --verbose"
   },
   "dependencies": {
diff --git a/packages/storybook/src/plugins/mock-router.ts b/packages/storybook/src/plugins/mock-router.ts
@@ -8,7 +8,7 @@ export function mockRouter(): PluginOption {
       if (id.includes('src')) {
         code = code.replace(
           "'@cedarjs/router'",
-          "'storybook-framework-cedar/dist/mocks/MockRouter'",
+          "'storybook-framework-cedarjs/dist/mocks/MockRouter'",
         )
       }
       return code
diff --git a/packages/storybook/src/types.ts b/packages/storybook/src/types.ts
@@ -8,7 +8,7 @@ import type {
   TypescriptOptions as TypescriptOptionsBase,
 } from '@storybook/types'
 
-type FrameworkName = 'storybook-framework-cedar'
+type FrameworkName = 'storybook-framework-cedarjs'
 type BuilderName = '@storybook/builder-vite'
 
 export type FrameworkOptions = {
diff --git a/tasks/framework-tools/lib/framework.mjs b/tasks/framework-tools/lib/framework.mjs
@@ -81,7 +81,7 @@ export function getFrameworkDependencies(
       }
 
       // Skip storybook packages because they're installed manually by the user.
-      if (name.startsWith('storybook-framework-cedar')) {
+      if (name.startsWith('storybook-framework-cedarjs')) {
         continue
       }
 
diff --git a/yarn.lock b/yarn.lock
@@ -2711,7 +2711,7 @@ __metadata:
     execa: "npm:5.1.1"
     semver: "npm:7.6.3"
     storybook: "npm:7.6.20"
-    storybook-framework-cedar: "workspace:*"
+    storybook-framework-cedarjs: "workspace:*"
     terminal-link: "npm:2.1.1"
     tsx: "npm:4.19.3"
     typescript: "npm:5.6.2"
@@ -8054,7 +8054,18 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@peculiar/asn1-schema@npm:^2.3.0, @peculiar/asn1-schema@npm:^2.3.15, @peculiar/asn1-schema@npm:^2.3.6, @peculiar/asn1-schema@npm:^2.3.8":
+"@peculiar/asn1-schema@npm:^2.3.0, @peculiar/asn1-schema@npm:^2.3.6":
+  version: 2.3.6
+  resolution: "@peculiar/asn1-schema@npm:2.3.6"
+  dependencies:
+    asn1js: "npm:^3.0.5"
+    pvtsutils: "npm:^1.3.2"
+    tslib: "npm:^2.4.0"
+  checksum: 10c0/86591b1691f6b296b515137d699e45c6384a08f38ddd080dc13a5b7f85d59aa4a0a1c52fa857b47e727c4b997293bc50c0812d22f1ba9ed7b246a8a8aac5491c
+  languageName: node
+  linkType: hard
+
+"@peculiar/asn1-schema@npm:^2.3.15, @peculiar/asn1-schema@npm:^2.3.8":
   version: 2.3.15
   resolution: "@peculiar/asn1-schema@npm:2.3.15"
   dependencies:
@@ -12053,7 +12064,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"acorn-loose@npm:8.4.0, acorn-loose@npm:^8.3.0, acorn-loose@npm:^8.4.0":
+"acorn-loose@npm:8.4.0":
   version: 8.4.0
   resolution: "acorn-loose@npm:8.4.0"
   dependencies:
@@ -12062,6 +12073,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"acorn-loose@npm:^8.3.0, acorn-loose@npm:^8.4.0":
+  version: 8.5.0
+  resolution: "acorn-loose@npm:8.5.0"
+  dependencies:
+    acorn: "npm:^8.14.0"
+  checksum: 10c0/221df4224ccad267d46775323d956636dd0e4ef263d18450258daff1a33d99e8e00e6214465bdc658fc961cc77fc60cef2f0f4710ec93543ce179f287da0ea80
+  languageName: node
+  linkType: hard
+
 "acorn-walk@npm:^7.2.0":
   version: 7.2.0
   resolution: "acorn-walk@npm:7.2.0"
@@ -12096,6 +12116,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"acorn@npm:^8.14.0":
+  version: 8.14.1
+  resolution: "acorn@npm:8.14.1"
+  bin:
+    acorn: bin/acorn
+  checksum: 10c0/dbd36c1ed1d2fa3550140000371fcf721578095b18777b85a79df231ca093b08edc6858d75d6e48c73e431c174dcf9214edbd7e6fa5911b93bd8abfa54e47123
+  languageName: node
+  linkType: hard
+
 "add-stream@npm:^1.0.0":
   version: 1.0.0
   resolution: "add-stream@npm:1.0.0"
@@ -27517,9 +27546,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"storybook-framework-cedar@workspace:*, storybook-framework-cedar@workspace:packages/storybook":
+"storybook-framework-cedarjs@workspace:*, storybook-framework-cedarjs@workspace:packages/storybook":
   version: 0.0.0-use.local
-  resolution: "storybook-framework-cedar@workspace:packages/storybook"
+  resolution: "storybook-framework-cedarjs@workspace:packages/storybook"
   dependencies:
     "@cedarjs/testing": "workspace:*"
     "@joshwooding/vite-plugin-react-docgen-typescript": "npm:0.4.2"
