storybookjs · kasperpeulen · Feb 7, 2025 · Dec 9, 2019 · Jan 23, 2020 · Jan 23, 2020
diff --git a/code/addons/a11y/src/preview.test.tsx b/code/addons/a11y/src/preview.test.tsx
@@ -1,7 +1,7 @@
 // @vitest-environment happy-dom
 import { beforeEach, describe, expect, it, vi } from 'vitest';
 
-import type { StoryContext } from '@storybook/csf';
+import type { StoryContext } from 'storybook/internal/csf';
 
 import { run } from './a11yRunner';
 import { A11Y_TEST_TAG } from './constants';

diff --git a/code/addons/controls/src/manager.tsx b/code/addons/controls/src/manager.tsx
@@ -7,6 +7,7 @@ import type {
   SaveStoryResponsePayload,
 } from 'storybook/internal/core-events';
 import { SAVE_STORY_REQUEST, SAVE_STORY_RESPONSE } from 'storybook/internal/core-events';
+import type { Args } from 'storybook/internal/csf';
 import {
   addons,
   experimental_requestResponse,
@@ -15,8 +16,6 @@ import {
 } from 'storybook/internal/manager-api';
 import { color } from 'storybook/internal/theming';
 
-import type { Args } from '@storybook/csf';
-
 import { dequal as deepEqual } from 'dequal';
 
 import { ControlsPanel } from './ControlsPanel';

diff --git a/code/addons/links/src/utils.ts b/code/addons/links/src/utils.ts
@@ -1,8 +1,8 @@
 import { SELECT_STORY, STORY_CHANGED } from 'storybook/internal/core-events';
+import { toId } from 'storybook/internal/csf';
 import { addons, makeDecorator } from 'storybook/internal/preview-api';
 import type { ComponentTitle, StoryId, StoryKind, StoryName } from 'storybook/internal/types';
 
-import { toId } from '@storybook/csf';
 import { global } from '@storybook/global';
 
 import { PARAM_KEY } from './constants';

diff --git a/code/addons/test/src/components/TestProviderRender.tsx b/code/addons/test/src/components/TestProviderRender.tsx
@@ -20,11 +20,11 @@ import {
   type TestProviderConfig,
   type TestProviderState,
 } from 'storybook/internal/core-events';
+import type { Tag } from 'storybook/internal/csf';
 import { addons, useStorybookState } from 'storybook/internal/manager-api';
 import type { API } from 'storybook/internal/manager-api';
 import { styled, useTheme } from 'storybook/internal/theming';
 
-import type { Tag } from '@storybook/csf';
 import {
   AccessibilityIcon,
   EditIcon,

diff --git a/code/addons/test/src/vitest-plugin/viewports.ts b/code/addons/test/src/vitest-plugin/viewports.ts
@@ -1,8 +1,7 @@
 /* eslint-disable no-underscore-dangle */
+import type { Globals, Parameters } from 'storybook/internal/csf';
 import { UnsupportedViewportDimensionError } from 'storybook/internal/preview-errors';
 
-import type { Globals, Parameters } from '@storybook/csf';
-
 import { MINIMAL_VIEWPORTS } from '../../../viewport/src/defaults';
 import type { ViewportMap, ViewportStyles } from '../../../viewport/src/types';
 

diff --git a/code/core/package.json b/code/core/package.json
@@ -97,6 +97,11 @@
       "import": "./dist/csf-tools/index.js",
       "require": "./dist/csf-tools/index.cjs"
     },
+    "./csf": {
+      "types": "./dist/csf/index.d.ts",
+      "import": "./dist/csf/index.js",
+      "require": "./dist/csf/index.cjs"
+    },
     "./common": {
       "types": "./dist/common/index.d.ts",
       "import": "./dist/common/index.js",
@@ -219,6 +224,9 @@
       "csf-tools": [
         "./dist/csf-tools/index.d.ts"
       ],
+      "csf": [
+        "./dist/csf/index.d.ts"
+      ],
       "common": [
         "./dist/common/index.d.ts"
       ],
@@ -303,6 +311,7 @@
     "@emotion/use-insertion-effect-with-fallbacks": "^1.2.0",
     "@fal-works/esbuild-plugin-global-externals": "^2.1.2",
     "@ndelangen/get-tarball": "^3.0.7",
+    "@ngard/tiny-isequal": "^1.1.0",
     "@polka/compression": "^1.0.0-next.28",
     "@popperjs/core": "^2.6.0",
     "@radix-ui/react-dialog": "^1.1.2",

diff --git a/code/core/scripts/entries.ts b/code/core/scripts/entries.ts
@@ -25,6 +25,7 @@ export const getEntries = (cwd: string) => {
     define('src/channels/index.ts', ['browser', 'node'], true),
     define('src/types/index.ts', ['browser', 'node'], true, ['react']),
     define('src/csf-tools/index.ts', ['node'], true),
+    define('src/csf/index.ts', ['browser', 'node'], true),
     define('src/common/index.ts', ['node'], true),
     define('src/builder-manager/index.ts', ['node'], true),
     define('src/telemetry/index.ts', ['node'], true),

diff --git a/code/core/src/common/utils/get-story-id.ts b/code/core/src/common/utils/get-story-id.ts
@@ -1,8 +1,8 @@
 import { relative } from 'node:path';
 
 import { normalizeStories, normalizeStoryPath } from '@storybook/core/common';
+import { sanitize, storyNameFromExport, toId } from '@storybook/core/csf';
 import type { Options, StoriesEntry } from '@storybook/core/types';
-import { sanitize, storyNameFromExport, toId } from '@storybook/csf';
 
 import { userOrAutoTitleFromSpecifier } from '@storybook/core/preview-api';
 

diff --git a/code/core/src/components/components/tabs/tabs.hooks.tsx b/code/core/src/components/components/tabs/tabs.hooks.tsx
@@ -1,7 +1,7 @@
 import React, { useCallback, useLayoutEffect, useRef, useState } from 'react';
 
+import { sanitize } from '@storybook/core/csf';
 import { styled } from '@storybook/core/theming';
-import { sanitize } from '@storybook/csf';
 
 import useResizeObserver from 'use-resize-observer';
 

diff --git a/code/core/src/components/components/tabs/tabs.tsx b/code/core/src/components/components/tabs/tabs.tsx
@@ -1,9 +1,9 @@
 import type { FC, PropsWithChildren, ReactElement, ReactNode, SyntheticEvent } from 'react';
 import React, { Component, memo, useMemo } from 'react';
 
+import { sanitize } from '@storybook/core/csf';
 import { styled } from '@storybook/core/theming';
 import type { Addon_RenderOptions } from '@storybook/core/types';
-import { sanitize } from '@storybook/csf';
 
 import { FlexBar } from '../bar/bar';
 import { TabButton } from '../bar/button';

diff --git a/code/core/src/core-events/data/argtypes-info.ts b/code/core/src/core-events/data/argtypes-info.ts
@@ -1,4 +1,4 @@
-import type { ArgTypes } from '@storybook/csf';
+import type { ArgTypes } from '@storybook/core/csf';
 
 export interface ArgTypesRequestPayload {
   storyId: string;

diff --git a/code/core/src/core-server/utils/StoryIndexGenerator.test.ts b/code/core/src/core-server/utils/StoryIndexGenerator.test.ts
@@ -4,8 +4,8 @@ import { join } from 'node:path';
 import { beforeEach, describe, expect, it, vi } from 'vitest';
 
 import { normalizeStoriesEntry } from '@storybook/core/common';
+import { toId } from '@storybook/core/csf';
 import type { NormalizedStoriesSpecifier, StoryIndexEntry } from '@storybook/core/types';
-import { toId } from '@storybook/csf';
 
 import { getStorySortParameter, readCsf } from '@storybook/core/csf-tools';
 import { logger, once } from '@storybook/core/node-logger';
@@ -14,8 +14,8 @@ import { csfIndexer } from '../presets/common-preset';
 import type { StoryIndexGeneratorOptions } from './StoryIndexGenerator';
 import { StoryIndexGenerator } from './StoryIndexGenerator';
 
-vi.mock('@storybook/csf', async (importOriginal) => {
-  const csf = await importOriginal<typeof import('@storybook/csf')>();
+vi.mock('@storybook/core/csf', async (importOriginal) => {
+  const csf = await importOriginal<typeof import('@storybook/core/csf')>();
   return {
     ...csf,
     toId: vi.fn(csf.toId),

diff --git a/code/core/src/core-server/utils/StoryIndexGenerator.ts b/code/core/src/core-server/utils/StoryIndexGenerator.ts
@@ -4,6 +4,7 @@ import { readFile } from 'node:fs/promises';
 import { dirname, extname, join, normalize, relative, resolve, sep } from 'node:path';
 
 import { commonGlobOptions, normalizeStoryPath } from '@storybook/core/common';
+import { combineTags, storyNameFromExport, toId } from '@storybook/core/csf';
 import type {
   DocsIndexEntry,
   DocsOptions,
@@ -17,7 +18,6 @@ import type {
   StorybookConfigRaw,
   Tag,
 } from '@storybook/core/types';
-import { combineTags, storyNameFromExport, toId } from '@storybook/csf';
 
 import { getStorySortParameter, loadConfig } from '@storybook/core/csf-tools';
 import { logger, once } from '@storybook/core/node-logger';

diff --git a/code/core/src/core-server/utils/save-story/save-story.ts b/code/core/src/core-server/utils/save-story/save-story.ts
@@ -4,9 +4,9 @@ import { basename, join } from 'node:path';
 
 import type { Channel } from '@storybook/core/channels';
 import { formatFileContent } from '@storybook/core/common';
+import { storyNameFromExport, toId } from '@storybook/core/csf';
 import { isExampleStoryId, telemetry } from '@storybook/core/telemetry';
 import type { CoreConfig, Options } from '@storybook/core/types';
-import { storyNameFromExport, toId } from '@storybook/csf';
 
 import type {
   RequestData,

diff --git a/code/core/src/csf-tools/CsfFile.ts b/code/core/src/csf-tools/CsfFile.ts
@@ -11,6 +11,7 @@ import {
   types as t,
   traverse,
 } from '@storybook/core/babel';
+import { isExportStory, storyNameFromExport, toId } from '@storybook/core/csf';
 import type {
   ComponentAnnotations,
   IndexInput,
@@ -19,7 +20,6 @@ import type {
   StoryAnnotations,
   Tag,
 } from '@storybook/core/types';
-import { isExportStory, storyNameFromExport, toId } from '@storybook/csf';
 
 import { dedent } from 'ts-dedent';
 

diff --git a/code/core/src/csf-tools/vitest-plugin/transformer.ts b/code/core/src/csf-tools/vitest-plugin/transformer.ts
@@ -3,8 +3,8 @@
 /* eslint-disable no-underscore-dangle */
 import { types as t } from '@storybook/core/babel';
 import { getStoryTitle } from '@storybook/core/common';
+import { combineTags } from '@storybook/core/csf';
 import type { StoriesEntry, Tag } from '@storybook/core/types';
-import { combineTags } from '@storybook/csf';
 
 import { dedent } from 'ts-dedent';
 

diff --git a/code/core/src/csf/SBType.ts b/code/core/src/csf/SBType.ts
@@ -0,0 +1,42 @@
+interface SBBaseType {
+  required?: boolean;
+  raw?: string;
+}
-interface SBBaseType {
-  required?: boolean;
-  raw?: string;
-}
+export interface SBBaseType {
+  required?: boolean;
+  raw?: string;
+}
-interface SBBaseType {
-  required?: boolean;
-  raw?: string;
-}
+export interface SBBaseType {
+  required?: boolean;
+  raw?: string;
+}
+
+export type SBScalarType = SBBaseType & {
+  name: 'boolean' | 'string' | 'number' | 'function' | 'symbol';
+};
+
+export type SBArrayType = SBBaseType & {
+  name: 'array';
+  value: SBType;
+};
+export type SBObjectType = SBBaseType & {
+  name: 'object';
+  value: Record<string, SBType>;
+};
+export type SBEnumType = SBBaseType & {
+  name: 'enum';
+  value: (string | number)[];
+};
+export type SBIntersectionType = SBBaseType & {
+  name: 'intersection';
+  value: SBType[];
+};
+export type SBUnionType = SBBaseType & {
+  name: 'union';
+  value: SBType[];
+};
+export type SBOtherType = SBBaseType & {
+  name: 'other';
+  value: string;
+};
+
+export type SBType =
+  | SBScalarType
+  | SBEnumType
+  | SBArrayType
+  | SBObjectType
+  | SBIntersectionType
+  | SBUnionType
+  | SBOtherType;