GitHub/storybook
1
0
Fork 0
mirror of https://github.com/storybookjs/storybook.git synced 2025-04-07 21:31:48 +08:00
Code Issues Packages Projects Releases Wiki Activity

Prettier

Browse Source
This commit is contained in:
Kasper Peulen 2024-01-09 17:20:55 +01:00
parent 3e97a62fca
commit 13c46e6c0b
63 changed files with 526 additions and 492 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
code/addons/backgrounds/src/containers/BackgroundSelector.tsx
View File

@ -37,40 +37,24 @@ const createBackgroundSelectorItem = memoize(1000)(
})
);
const getDisplayedItems = memoize(10)(
(
const getDisplayedItems = memoize(10)((
backgrounds: Background[],
selectedBackgroundColor: string | null,
change: (arg: { selected: string; name: string }) => void
) => {
) => {
const backgroundSelectorItems = backgrounds.map(({ name, value }) =>
createBackgroundSelectorItem(
null,
name,
value,
true,
change,
value === selectedBackgroundColor
)
createBackgroundSelectorItem(null, name, value, true, change, value === selectedBackgroundColor)
);
if (selectedBackgroundColor !== 'transparent') {
return [
createBackgroundSelectorItem(
'reset',
'Clear background',
'transparent',
null,
change,
false
),
createBackgroundSelectorItem('reset', 'Clear background', 'transparent', null, change, false),
...backgroundSelectorItems,
];
}
return backgroundSelectorItems;
}
);
});
const DEFAULT_BACKGROUNDS_CONFIG: BackgroundsParameter = {
default: null,

11
code/addons/viewport/src/Tool.tsx
View File

@ -35,8 +35,12 @@ const responsiveViewport: ViewportItem = {
const baseViewports: ViewportItem[] = [responsiveViewport];
const toLinks = memoize(50)(
(list: ViewportItem[], active: LinkBase, updateGlobals, close): Link[] => {
const toLinks = memoize(50)((
list: ViewportItem[],
active: LinkBase,
updateGlobals,
close
): Link[] => {
return list
.filter((i) => i.id !== responsiveViewport.id || active.id !== i.id)
.map((i) => {
@ -48,8 +52,7 @@ const toLinks = memoize(50)(
},
};
});
}
);
});
interface LinkBase {
id: string;

2
code/builders/builder-vite/src/vite-config.test.ts
View File

@ -25,7 +25,7 @@ const dummyOptions: Options = {
builder: {},
},
options: {},
}[key]),
})[key],
} as Presets,
presetsList: [],
};

5
code/builders/builder-webpack5/src/preview/iframe-webpack.config.ts
View File

@ -132,9 +132,8 @@ export default async (
externals['@storybook/blocks'] = '__STORYBOOK_BLOCKS_EMPTY_MODULE__';
}
const { virtualModules: virtualModuleMapping, entries: dynamicEntries } = await getVirtualModules(
options
);
const { virtualModules: virtualModuleMapping, entries: dynamicEntries } =
await getVirtualModules(options);
return {
name: 'preview',

2
code/frameworks/angular/src/client/angular-beta/ComputesTemplateFromComponent.ts
View File

@ -172,7 +172,7 @@ const buildTemplate = (
const firstSelector = selector.split(',')[0];
const templateReplacers: [
string | RegExp,
string | ((substring: string, ...args: any[]) => string)
string | ((substring: string, ...args: any[]) => string),
][] = [
[/(^.*?)(?=[,])/, '$1'],
[/(^\..+)/, 'div$1'],

5
code/frameworks/angular/src/client/angular-beta/utils/PropertyExtractor.ts
View File

@ -41,7 +41,10 @@ export class PropertyExtractor implements NgModuleMetadata {
applicationProviders?: Array<Provider | ReturnType<typeof importProvidersFrom>>;
/* eslint-enable @typescript-eslint/lines-between-class-members */
constructor(private metadata: NgModuleMetadata, private component?: any) {
constructor(
private metadata: NgModuleMetadata,
private component?: any
) {
this.init();
}

5
code/frameworks/angular/template/stories/basics/component-with-complex-selectors/attribute-selector.component.ts
View File

@ -11,7 +11,10 @@ export class AttributeSelectorComponent {
selectors!: string;
constructor(public el: ElementRef, private resolver: ComponentFactoryResolver) {
constructor(
public el: ElementRef,
private resolver: ComponentFactoryResolver
) {
const factory = this.resolver.resolveComponentFactory(AttributeSelectorComponent);
this.selectors = factory.selector;
this.generatedTemplate = el.nativeElement.outerHTML;

5
code/frameworks/angular/template/stories/basics/component-with-complex-selectors/class-selector.component.ts
View File

@ -11,7 +11,10 @@ export class ClassSelectorComponent {
selectors!: string;
constructor(public el: ElementRef, private resolver: ComponentFactoryResolver) {
constructor(
public el: ElementRef,
private resolver: ComponentFactoryResolver
) {
const factory = this.resolver.resolveComponentFactory(ClassSelectorComponent);
this.selectors = factory.selector;
this.generatedTemplate = el.nativeElement.outerHTML;

10
code/frameworks/angular/template/stories/basics/component-with-complex-selectors/multiple-selector.component.ts
View File

@ -11,7 +11,10 @@ export class MultipleSelectorComponent {
selectors!: string;
constructor(public el: ElementRef, private resolver: ComponentFactoryResolver) {
constructor(
public el: ElementRef,
private resolver: ComponentFactoryResolver
) {
const factory = this.resolver.resolveComponentFactory(MultipleClassSelectorComponent);
this.selectors = factory.selector;
this.generatedTemplate = el.nativeElement.outerHTML;
@ -29,7 +32,10 @@ export class MultipleClassSelectorComponent {
selectors!: string;
constructor(public el: ElementRef, private resolver: ComponentFactoryResolver) {
constructor(
public el: ElementRef,
private resolver: ComponentFactoryResolver
) {
const factory = this.resolver.resolveComponentFactory(MultipleClassSelectorComponent);
this.selectors = factory.selector;
this.generatedTemplate = el.nativeElement.outerHTML;

6
code/lib/cli/src/automigrate/fixes/angular-builders-multiproject.test.ts
View File

@ -104,7 +104,7 @@ describe('is not Nx project', () => {
() =>
({
hasStorybookBuilder: true,
} as any)
}) as any
);
});
@ -129,7 +129,7 @@ describe('is not Nx project', () => {
project1: { root: 'project1', architect: {} },
},
rootProject: 'project1',
} as any)
}) as any
);
});
@ -155,7 +155,7 @@ describe('is not Nx project', () => {
project2: { root: 'project2', architect: {} },
},
rootProject: null,
} as any)
}) as any
);
});

6
code/lib/cli/src/automigrate/fixes/angular-builders.test.ts
View File

@ -107,7 +107,7 @@ describe('is not Nx project', () => {
() =>
({
hasStorybookBuilder: true,
} as any)
}) as any
);
});
@ -133,7 +133,7 @@ describe('is not Nx project', () => {
project2: { root: 'project2', architect: {} },
},
rootProject: null,
} as any)
}) as any
);
});
@ -158,7 +158,7 @@ describe('is not Nx project', () => {
project1: { root: 'project1', architect: {} },
},
rootProject: 'project1',
} as any)
}) as any
);
});

14
code/lib/cli/src/automigrate/fixes/sb-scripts.ts
View File

@ -20,7 +20,8 @@ const logger = console;
* which could actually be a custom script even though the name matches the legacy binary name
*/
export const getStorybookScripts = (allScripts: NonNullable<PackageJson['scripts']>) => {
return Object.keys(allScripts).reduce((acc, key) => {
return Object.keys(allScripts).reduce(
(acc, key) => {
const currentScript = allScripts[key];
if (currentScript == null) {
return acc;
@ -62,7 +63,9 @@ export const getStorybookScripts = (allScripts: NonNullable<PackageJson['scripts
}
return acc;
}, {} as Record<string, { before: string; after: string }>);
},
{} as Record<string, { before: string; after: string }>
);
};
/**
@ -129,10 +132,13 @@ export const sbScripts: Fix<SbScriptsRunOptions> = {
logger.info(`✅ Updating scripts in package.json`);
logger.log();
if (!dryRun) {
const newScripts = Object.keys(storybookScripts).reduce((acc, scriptKey) => {
const newScripts = Object.keys(storybookScripts).reduce(
(acc, scriptKey) => {
acc[scriptKey] = storybookScripts[scriptKey].after;
return acc;
}, {} as Record<string, string>);
},
{} as Record<string, string>
);
logger.log();

10
code/lib/cli/src/automigrate/helpers/new-frameworks-utils.ts
View File

@ -107,12 +107,10 @@ export const detectBuilderInfo = async ({
// if builder is still not detected, rely on package dependencies
if (!builderOrFrameworkName) {
const storybookBuilderViteVersion = await packageManager.getPackageVersion(
'@storybook/builder-vite'
);
const storybookBuilderVite2Version = await packageManager.getPackageVersion(
'storybook-builder-vite'
);
const storybookBuilderViteVersion =
await packageManager.getPackageVersion('@storybook/builder-vite');
const storybookBuilderVite2Version =
await packageManager.getPackageVersion('storybook-builder-vite');
const storybookBuilderWebpack5Version = await packageManager.getPackageVersion(
'@storybook/builder-webpack5'
);

5
code/lib/cli/src/detect.ts
View File

@ -185,9 +185,8 @@ export async function detectLanguage(packageManager: JsPackageManager) {
'@typescript-eslint/parser'
);
const eslintPluginStorybookVersion = await packageManager.getPackageVersion(
'eslint-plugin-storybook'
);
const eslintPluginStorybookVersion =
await packageManager.getPackageVersion('eslint-plugin-storybook');
if (isTypescriptDirectDependency && typescriptVersion) {
if (

2
code/lib/cli/src/doctor/getIncompatibleAddons.ts
View File

@ -52,7 +52,7 @@ export const getIncompatibleAddons = async (
({
name: addon,
version: await packageManager.getPackageVersion(addon),
} as { name: keyof typeof incompatibleList; version: string })
}) as { name: keyof typeof incompatibleList; version: string }
)
);

5
code/lib/cli/src/generators/baseGenerator.ts
View File

@ -355,9 +355,8 @@ export async function baseGenerator(
try {
if (process.env.CI !== 'true') {
const { hasEslint, isStorybookPluginInstalled, eslintConfigFile } = await extractEslintInfo(
packageManager
);
const { hasEslint, isStorybookPluginInstalled, eslintConfigFile } =
await extractEslintInfo(packageManager);
if (hasEslint && !isStorybookPluginInstalled) {
if (skipPrompts || (await suggestESLintPlugin())) {

2
code/lib/cli/src/js-package-manager/Yarn1Proxy.ts
View File

@ -192,7 +192,7 @@ export class Yarn1Proxy extends JsPackageManager {
const existingVersions: Record<string, string[]> = {};
const duplicatedDependencies: Record<string, string[]> = {};
const recurse = (tree: typeof trees[0]) => {
const recurse = (tree: (typeof trees)[0]) => {
const { children } = tree;
const { name, value } = parsePackageData(tree.name);
if (!name || !name.includes('storybook')) return;

7
code/lib/core-server/src/utils/StoryIndexGenerator.ts
View File

@ -538,10 +538,13 @@ export class StoryIndexGenerator {
sortStoriesV7(sortableStories, storySortParameter, fileNameOrder);
}
return sortableStories.reduce((acc, item) => {
return sortableStories.reduce(
(acc, item) => {
acc[item.id] = item;
return acc;
}, {} as StoryIndex['entries']);
},
{} as StoryIndex['entries']
);
}
async getIndex() {

4
code/lib/core-server/src/utils/build-or-throw.ts
View File

@ -6,8 +6,8 @@ export async function buildOrThrow<T>(callback: () => Promise<T>): Promise<T> {
} catch (err: any) {
const builderErrors = err.errors as { text: string }[];
if (builderErrors) {
const inconsistentVersionsError = builderErrors.find((er) =>
er.text?.includes('No matching export')
const inconsistentVersionsError = builderErrors.find(
(er) => er.text?.includes('No matching export')
);
if (inconsistentVersionsError) {

26
code/lib/core-server/src/withTelemetry.test.ts
View File

@ -79,7 +79,7 @@ describe('withTelemetry', () => {
it('does not send full error message when crash reports are disabled', async () => {
vi.mocked(loadAllPresets).mockResolvedValueOnce({
apply: async () => ({ enableCrashReports: false } as any),
apply: async () => ({ enableCrashReports: false }) as any,
});
await expect(async () =>
withTelemetry(
@ -99,7 +99,7 @@ describe('withTelemetry', () => {
it('does send error message when crash reports are enabled', async () => {
vi.mocked(loadAllPresets).mockResolvedValueOnce({
apply: async () => ({ enableCrashReports: true } as any),
apply: async () => ({ enableCrashReports: true }) as any,
});
await expect(async () =>
@ -120,7 +120,7 @@ describe('withTelemetry', () => {
it('does not send any error message when telemetry is disabled', async () => {
vi.mocked(loadAllPresets).mockResolvedValueOnce({
apply: async () => ({ disableTelemetry: true } as any),
apply: async () => ({ disableTelemetry: true }) as any,
});
await expect(async () =>
@ -141,7 +141,7 @@ describe('withTelemetry', () => {
it('does send error messages when telemetry is disabled, but crash reports are enabled', async () => {
vi.mocked(loadAllPresets).mockResolvedValueOnce({
apply: async () => ({ disableTelemetry: true, enableCrashReports: true } as any),
apply: async () => ({ disableTelemetry: true, enableCrashReports: true }) as any,
});
await expect(async () =>
@ -162,7 +162,7 @@ describe('withTelemetry', () => {
it('does not send full error messages when disabled crash reports are cached', async () => {
vi.mocked(loadAllPresets).mockResolvedValueOnce({
apply: async () => ({} as any),
apply: async () => ({}) as any,
});
vi.mocked(cache.get).mockResolvedValueOnce(false);
@ -184,7 +184,7 @@ describe('withTelemetry', () => {
it('does send error messages when enabled crash reports are cached', async () => {
vi.mocked(loadAllPresets).mockResolvedValueOnce({
apply: async () => ({} as any),
apply: async () => ({}) as any,
});
vi.mocked(cache.get).mockResolvedValueOnce(true);
@ -206,7 +206,7 @@ describe('withTelemetry', () => {
it('does not send full error messages when disabled crash reports are prompted', async () => {
vi.mocked(loadAllPresets).mockResolvedValueOnce({
apply: async () => ({} as any),
apply: async () => ({}) as any,
});
vi.mocked(cache.get).mockResolvedValueOnce(undefined);
vi.mocked(prompts).mockResolvedValueOnce({ enableCrashReports: false });
@ -229,7 +229,7 @@ describe('withTelemetry', () => {
it('does send error messages when enabled crash reports are prompted', async () => {
vi.mocked(loadAllPresets).mockResolvedValueOnce({
apply: async () => ({} as any),
apply: async () => ({}) as any,
});
vi.mocked(cache.get).mockResolvedValueOnce(undefined);
vi.mocked(prompts).mockResolvedValueOnce({ enableCrashReports: true });
@ -386,7 +386,7 @@ describe('getErrorLevel', () => {
};
vi.mocked(loadAllPresets).mockResolvedValueOnce({
apply: async () => ({ enableCrashReports: true } as any),
apply: async () => ({ enableCrashReports: true }) as any,
});
vi.mocked(cache.get).mockResolvedValueOnce(false);
@ -405,7 +405,7 @@ describe('getErrorLevel', () => {
};
vi.mocked(loadAllPresets).mockResolvedValueOnce({
apply: async () => ({ enableCrashReports: false } as any),
apply: async () => ({ enableCrashReports: false }) as any,
});
vi.mocked(cache.get).mockResolvedValueOnce(false);
@ -424,7 +424,7 @@ describe('getErrorLevel', () => {
};
vi.mocked(loadAllPresets).mockResolvedValueOnce({
apply: async () => ({ disableTelemetry: true } as any),
apply: async () => ({ disableTelemetry: true }) as any,
});
vi.mocked(cache.get).mockResolvedValueOnce(false);
@ -444,7 +444,7 @@ describe('getErrorLevel', () => {
vi.mocked(cache.get).mockResolvedValueOnce(true);
vi.mocked(loadAllPresets).mockResolvedValueOnce({
apply: async () => ({} as any),
apply: async () => ({}) as any,
});
const errorLevel = await getErrorLevel(options);
@ -462,7 +462,7 @@ describe('getErrorLevel', () => {
};
vi.mocked(loadAllPresets).mockResolvedValueOnce({
apply: async () => ({} as any),
apply: async () => ({}) as any,
});
vi.mocked(cache.get).mockResolvedValueOnce(undefined);

14
code/lib/csf-tools/src/CsfFile.ts
View File

@ -100,11 +100,14 @@ const parseExportsOrder = (init: t.Expression) => {
};
const sortExports = (exportByName: Record<string, any>, order: string[]) => {
return order.reduce((acc, name) => {
return order.reduce(
(acc, name) => {
const namedExport = exportByName[name];
if (namedExport) acc[name] = namedExport;
return acc;
}, {} as Record<string, any>);
},
{} as Record<string, any>
);
};
export interface CsfOptions {
@ -491,7 +494,8 @@ export class CsfFile {
if (self._metaAnnotations.play) {
self._meta.tags = [...(self._meta.tags || []), 'play-fn'];
}
self._stories = entries.reduce((acc, [key, story]) => {
self._stories = entries.reduce(
(acc, [key, story]) => {
if (!isExportStory(key, self._meta as StaticMeta)) {
return acc;
}
@ -519,7 +523,9 @@ export class CsfFile {
acc[key].tags = [...(acc[key].tags || []), 'play-fn'];
}
return acc;
}, {} as Record<string, StaticStory>);
},
{} as Record<string, StaticStory>
);
Object.keys(self._storyExports).forEach((key) => {
if (!isExportStory(key, self._meta as StaticMeta)) {

7
code/lib/instrumenter/src/instrumenter.ts
View File

@ -248,12 +248,15 @@ export class Instrumenter {
cleanup() {
// Reset stories with retained state to their initial state, and drop the rest.
this.state = Object.entries(this.state).reduce((acc, [storyId, state]) => {
this.state = Object.entries(this.state).reduce(
(acc, [storyId, state]) => {
const retainedState = getRetainedState(state);
if (!retainedState) return acc;
acc[storyId] = Object.assign(getInitialState(), retainedState);
return acc;
}, {} as Record<StoryId, State>);
},
{} as Record<StoryId, State>
);
const payload: SyncPayload = { controlStates: controlsDisabled, logItems: [] };
this.channel.emit(EVENTS.SYNC, payload);
// @ts-expect-error (TS doesn't know about this global variable)

2
code/lib/manager-api/src/lib/addons.ts
View File

@ -104,7 +104,7 @@ export class AddonStore {
| Addon_Types
| Addon_TypesEnum.experimental_PAGE
| Addon_TypesEnum.experimental_SIDEBAR_BOTTOM
| Addon_TypesEnum.experimental_SIDEBAR_TOP
| Addon_TypesEnum.experimental_SIDEBAR_TOP,
>(type: T): Addon_Collection<Addon_TypesMapping[T]> | any {
if (!this.elements[type]) {
this.elements[type] = {};

14
code/lib/manager-api/src/lib/stories.ts
View File

@ -92,7 +92,8 @@ export const transformSetStoriesStoryDataToPreparedStoryIndex = (
export const transformStoryIndexV2toV3 = (index: StoryIndexV2): StoryIndexV3 => {
return {
v: 3,
stories: Object.values(index.stories).reduce((acc, entry) => {
stories: Object.values(index.stories).reduce(
(acc, entry) => {
acc[entry.id] = {
...entry,
title: entry.kind,
@ -101,7 +102,9 @@ export const transformStoryIndexV2toV3 = (index: StoryIndexV2): StoryIndexV3 =>
};
return acc;
}, {} as StoryIndexV3['stories']),
},
{} as StoryIndexV3['stories']
),
};
};
@ -109,7 +112,8 @@ export const transformStoryIndexV3toV4 = (index: StoryIndexV3): API_PreparedStor
const countByTitle = countBy(Object.values(index.stories), 'title');
return {
v: 4,
entries: Object.values(index.stories).reduce((acc, entry: any) => {
entries: Object.values(index.stories).reduce(
(acc, entry: any) => {
let type: IndexEntry['type'] = 'story';
if (
entry.parameters?.docsOnly ||
@ -129,7 +133,9 @@ export const transformStoryIndexV3toV4 = (index: StoryIndexV3): API_PreparedStor
delete acc[entry.id].kind;
return acc;
}, {} as API_PreparedStoryIndex['entries']),
},
{} as API_PreparedStoryIndex['entries']
),
};
};

2
code/lib/manager-api/src/modules/addons.ts
View File

@ -28,7 +28,7 @@ export interface SubAPI {
| Addon_Types
| Addon_TypesEnum.experimental_PAGE
| Addon_TypesEnum.experimental_SIDEBAR_BOTTOM
| Addon_TypesEnum.experimental_SIDEBAR_TOP = Addon_Types
| Addon_TypesEnum.experimental_SIDEBAR_TOP = Addon_Types,
>(
type: T
) => Addon_Collection<Addon_TypesMapping[T]>;

3
code/lib/manager-api/src/modules/whatsnew.ts
View File

@ -57,7 +57,8 @@ export const init: ModuleFn = ({ fullAPI, store, provider }) => {
function getLatestWhatsNewPost(): Promise<WhatsNewData> {
provider.channel?.emit(REQUEST_WHATS_NEW_DATA);
return new Promise((resolve) =>
return new Promise(
(resolve) =>
provider.channel?.once(RESULT_WHATS_NEW_DATA, ({ data }: { data: WhatsNewData }) =>
resolve(data)
)

8
code/lib/preview-api/src/modules/addons/hooks.ts
View File

@ -221,14 +221,14 @@ const invalidHooksError = () =>
function getHooksContextOrNull<
TRenderer extends Renderer,
TArgs extends Args = Args
TArgs extends Args = Args,
>(): HooksContext<TRenderer, TArgs> | null {
return global.STORYBOOK_HOOKS_CONTEXT || null;
}
function getHooksContextOrThrow<
TRenderer extends Renderer,
TArgs extends Args = Args
TArgs extends Args = Args,
>(): HooksContext<TRenderer, TArgs> {
const hooks = getHooksContextOrNull<TRenderer, TArgs>();
if (hooks == null) {
@ -530,7 +530,7 @@ export function useChannel(eventMap: EventMap, deps: any[] = []) {
*/
export function useStoryContext<
TRenderer extends Renderer,
TArgs extends Args = Args
TArgs extends Args = Args,
>(): StoryContext<TRenderer> {
const { currentContext } = getHooksContextOrThrow<TRenderer, TArgs>();
if (currentContext == null) {
@ -576,7 +576,7 @@ export function useParameter<S>(parameterKey: string, defaultValue?: S): S | und
export function useArgs<TArgs extends Args = Args>(): [
TArgs,
(newArgs: Partial<TArgs>) => void,
(argNames?: (keyof TArgs)[]) => void
(argNames?: (keyof TArgs)[]) => void,
] {
const channel = addons.getChannel();
const { id: storyId, args } = useStoryContext<Renderer, TArgs>();

7
code/lib/preview-api/src/modules/client-api/StoryStoreFacade.ts
View File

@ -110,13 +110,16 @@ export class StoryStoreFacade<TRenderer extends Renderer> {
}
throw err;
}
const entries = sortedV7.reduce((acc, s) => {
const entries = sortedV7.reduce(
(acc, s) => {
// We use the original entry we stored in `this.stories` because it is possible that the CSF file itself
// exports a `parameters.fileName` which can be different and mess up our `importFn`.
// NOTE: this doesn't actually change the story object, just the index.
acc[s.id] = this.entries[s.id];
return acc;
}, {} as StoryIndex['entries']);
},
{} as StoryIndex['entries']
);
return { v: 4, entries };
}

2
code/lib/preview-api/src/modules/core-client/start.test.ts
View File

@ -83,7 +83,7 @@ beforeEach(() => {
const start: typeof realStart = (...args) => {
const result = realStart(...args);
const configure: typeof result['configure'] = (
const configure: (typeof result)['configure'] = (
framework: string,
loadable: Loadable,
m?: NodeModule,

2
code/lib/preview-api/src/modules/preview-web/PreviewWeb.mockdata.ts
View File

@ -57,7 +57,7 @@ export const importFn: Mocked<ModuleImportFn> = vi.fn(
'./src/ComponentTwo.stories.js': componentTwoExports,
'./src/Introduction.mdx': unattachedDocsExports,
'./src/ExtraComponentOne.stories.js': extraComponentOneExports,
}[path] || {})
})[path] || {}
);
export const docsRenderer = {

2
code/lib/preview-api/src/modules/preview-web/WebView.ts
View File

@ -38,7 +38,7 @@ const ansiConverter = new AnsiToHtml({
});
export class WebView implements View<HTMLElement> {
private currentLayoutClass?: typeof layoutClassMap[keyof typeof layoutClassMap] | null;
private currentLayoutClass?: (typeof layoutClassMap)[keyof typeof layoutClassMap] | null;
private testing = false;

7
code/lib/preview-api/src/modules/store/StoryIndexStore.ts
View File

@ -12,10 +12,13 @@ import { MissingStoryAfterHmrError } from '@storybook/core-events/preview-errors
export type StorySpecifier = StoryId | { name: StoryName; title: ComponentTitle } | '*';
const getImportPathMap = memoize(1)((entries: StoryIndex['entries']) =>
Object.values(entries).reduce((acc, entry) => {
Object.values(entries).reduce(
(acc, entry) => {
acc[entry.importPath] = acc[entry.importPath] || entry;
return acc;
}, {} as Record<Path, IndexEntry>)
},
{} as Record<Path, IndexEntry>
)
);
export class StoryIndexStore {

7
code/lib/preview-api/src/modules/store/StoryStore.ts
View File

@ -185,10 +185,13 @@ export class StoryStore<TRenderer extends Renderer> {
};
return loadInBatches(importPaths).then((list) =>
list.reduce((acc, { importPath, csfFile }) => {
list.reduce(
(acc, { importPath, csfFile }) => {
acc[importPath] = csfFile;
return acc;
}, {} as Record<Path, CSFFile<TRenderer>>)
},
{} as Record<Path, CSFFile<TRenderer>>
)
);
}

2
code/lib/preview-api/src/modules/store/csf/prepareStory.ts
View File

@ -228,7 +228,7 @@ function preparePartialAnnotations<TRenderer extends Renderer>(
// eg. reactive proxies set by frameworks like SolidJS or Vue
export function prepareContext<
TRenderer extends Renderer,
TContext extends Pick<StoryContextForLoaders<TRenderer>, 'args' | 'argTypes' | 'globals'>
TContext extends Pick<StoryContextForLoaders<TRenderer>, 'args' | 'argTypes' | 'globals'>,
>(
context: TContext
): TContext & Pick<StoryContextForLoaders<TRenderer>, 'allArgs' | 'argsByTarget' | 'unmappedArgs'> {

18
code/lib/router/src/utils.ts
View File

@ -14,8 +14,9 @@ export interface StoryData {
const splitPathRegex = /\/([^/]+)\/(?:(.*)_)?([^/]+)?/;
export const parsePath: (path: string | undefined) => StoryData = memoize(1000)(
(path: string | undefined | null) => {
export const parsePath: (path: string | undefined) => StoryData = memoize(1000)((
path: string | undefined | null
) => {
const result: StoryData = {
viewMode: undefined,
storyId: undefined,
@ -33,8 +34,7 @@ export const parsePath: (path: string | undefined) => StoryData = memoize(1000)(
}
}
return result;
}
);
});
interface Args {
[key: string]: any;
@ -157,8 +157,11 @@ export const stringifyQuery = (query: Query) =>
type Match = { path: string };
export const getMatch = memoize(1000)(
(current: string, target: string | RegExp, startsWith = true): Match | null => {
export const getMatch = memoize(1000)((
current: string,
target: string | RegExp,
startsWith = true
): Match | null => {
if (startsWith) {
if (typeof target !== 'string') {
throw new Error('startsWith only works with string targets');
@ -179,5 +182,4 @@ export const getMatch = memoize(1000)(
}
return null;
}
);
});

10
code/lib/theming/src/global.ts
View File

@ -84,16 +84,15 @@ export const createReset = memoize(1)(
})
);
export const createGlobal = memoize(1)(
({
export const createGlobal = memoize(1)(({
color,
background,
typography,
}: {
}: {
color: Color;
background: Background;
typography: Typography;
}): Return => {
}): Return => {
const resetStyles = createReset({ typography });
return {
...resetStyles,
@ -109,5 +108,4 @@ export const createGlobal = memoize(1)(
borderTop: `1px solid ${color.border}`,
},
};
}
);
});

2
code/lib/types/src/modules/addons.ts
View File

@ -172,7 +172,7 @@ export type Addon_BaseDecorators<StoryFnReturnType> = Array<
export interface Addon_BaseAnnotations<
TArgs,
StoryFnReturnType,
TRenderer extends Renderer = Renderer
TRenderer extends Renderer = Renderer,
> {
/**
* Dynamic data that are provided (and possibly updated by) Storybook and its addons.

2
code/lib/types/src/modules/composedStory.ts
View File

@ -53,7 +53,7 @@ export type PartialArgsStoryFn<TRenderer extends Renderer = Renderer, TArgs = Ar
*/
export type ComposedStoryFn<
TRenderer extends Renderer = Renderer,
TArgs = Args
TArgs = Args,
> = PartialArgsStoryFn<TRenderer, TArgs> & {
play: ComposedStoryPlayFn<TRenderer, TArgs>;
args: TArgs;

2
code/lib/types/src/modules/docs.ts
View File

@ -32,7 +32,7 @@ export type ResolvedModuleExportType = 'component' | 'meta' | 'story';
*/
export type ResolvedModuleExportFromType<
TType extends ResolvedModuleExportType,
TRenderer extends Renderer = Renderer
TRenderer extends Renderer = Renderer,
> = TType extends 'component'
? {
type: 'component';

4
code/presets/react-webpack/src/framework-preset-react-docs.test.ts
View File

@ -114,7 +114,7 @@ describe('framework-preset-react-docgen', () => {
({
check: false,
reactDocgen: false,
} as Partial<TypescriptOptions>),
}) as Partial<TypescriptOptions>,
},
presetsList: presetsListWithDocs,
});
@ -136,7 +136,7 @@ describe('framework-preset-react-docgen', () => {
({
check: false,
reactDocgen: 'react-docgen-typescript',
} as Partial<TypescriptOptions>),
}) as Partial<TypescriptOptions>,
},
presetsList: [],
});

2
code/renderers/html/src/docs/sourceDecorator.test.ts
View File

@ -33,7 +33,7 @@ const makeContext = (name: string, parameters: any, args: any, extra?: object):
initialArgs: {},
...extra,
} as StoryContext);
}) as StoryContext;
describe('sourceDecorator', () => {
let mockChannel: { on: Mock; emit?: Mock };

9
code/renderers/react/src/docs/jsxDecorator.test.tsx
View File

@ -113,12 +113,11 @@ describe('renderJsx', () => {
});
it('forwardRef component', () => {
const MyExoticComponentRef = React.forwardRef<FC, PropsWithChildren>(function MyExoticComponent(
props,
_ref
) {
const MyExoticComponentRef = React.forwardRef<FC, PropsWithChildren>(
function MyExoticComponent(props, _ref) {
return <div>{props.children}</div>;
});
}
);
expect(renderJsx(createElement(MyExoticComponentRef, {}, 'I am forwardRef!'), {}))
.toMatchInlineSnapshot(`

2
code/renderers/react/src/public-types.ts
View File

@ -46,7 +46,7 @@ export type StoryObj<TMetaOrCmpOrArgs = Args> = [TMetaOrCmpOrArgs] extends [
render?: ArgsStoryFn<ReactRenderer, any>;
component?: infer Component;
args?: infer DefaultArgs;
}
},
]
? Simplify<
(Component extends ComponentType<any> ? ComponentProps<Component> : unknown) &

4
code/renderers/svelte/src/types.ts
View File

@ -24,7 +24,7 @@ interface MountProps {
type ComponentType<
Props extends Record<string, any> = any,
Events extends Record<string, any> = any
Events extends Record<string, any> = any,
> = new (options: ComponentConstructorOptions<Props>) => {
[P in keyof SvelteComponentTyped<Props> as P extends `$$${string}`
? never
@ -41,7 +41,7 @@ export interface SvelteRenderer<C extends SvelteComponentTyped = SvelteComponent
export interface SvelteStoryResult<
Props extends Record<string, any> = any,
Events extends Record<string, any> = any
Events extends Record<string, any> = any,
> {
Component?: ComponentType<Props>;
on?: Record<string, any> extends Events

2
code/renderers/vue3/src/docs/sourceDecorator.ts
View File

@ -86,7 +86,7 @@ function mapAttributesAndDirectives(props: Args) {
loc: { source: attributeSource(tranformKey(key), props[key]) }, // attribute value or directive value
exp: { isStatic: false, loc: { source: props[key] } }, // directive expression
modifiers: [''],
} as unknown as AttributeNode)
}) as unknown as AttributeNode
);
}
/**

2
code/renderers/web-components/src/docs/sourceDecorator.test.ts
View File

@ -29,7 +29,7 @@ const makeContext = (name: string, parameters: any, args: any, extra?: Partial<S
argTypes: {},
globals: {},
...extra,
} as StoryContext);
}) as StoryContext;
describe('sourceDecorator', () => {
let mockChannel: { on: Mock; emit?: Mock };

3
code/renderers/web-components/template/stories/demo-wc-card.stories.js
View File

@ -3,8 +3,7 @@ import './demo-wc-card';
export default {
component: 'demo-wc-card',
render: ({ backSide, header, rows, prefix }) =>
html`
render: ({ backSide, header, rows, prefix }) => html`
<demo-wc-card .backSide="${backSide}" .header="${header}" .rows="${rows}"
><span slot="prefix">${prefix}</span>A simple card</demo-wc-card
>

2
code/ui/components/src/components/icon/icon.tsx
View File

@ -5,7 +5,7 @@ import { styled } from '@storybook/theming';
import { deprecate, logger } from '@storybook/client-logger';
export type IconType = keyof typeof icons;
type NewIconTypes = typeof icons[IconType];
type NewIconTypes = (typeof icons)[IconType];
const Svg = styled.svg`
display: inline-block;

2
code/ui/manager/src/components/preview/Preview.tsx
View File

@ -238,7 +238,7 @@ function filterTabs(panels: Addon_BaseType[], parameters: Record<string, any>) {
const t = arrTabs.find((tab) => tab.id === panel.id);
return t === undefined || t.id === 'canvas' || !t.hidden;
})
.map((panel, index) => ({ ...panel, index } as Addon_BaseType))
.map((panel, index) => ({ ...panel, index }) as Addon_BaseType)
.sort((p1, p2) => {
/* eslint-disable @typescript-eslint/naming-convention */
const tab_1 = arrTabs.find((tab) => tab.id === p1.id);

8
code/ui/manager/src/components/sidebar/Refs.tsx
View File

@ -77,9 +77,8 @@ const CollapseButton = styled.button(({ theme }) => ({
},
}));
export const Ref: FC<RefType & RefProps & { status?: State['status'] }> = React.memo(function Ref(
props
) {
export const Ref: FC<RefType & RefProps & { status?: State['status'] }> = React.memo(
function Ref(props) {
const { docsOptions } = useStorybookState();
const api = useStorybookApi();
const {
@ -167,4 +166,5 @@ export const Ref: FC<RefType & RefProps & { status?: State['status'] }> = React.
)}
</>
);
});
}
);

2
code/ui/manager/src/components/sidebar/useHighlighted.ts
View File

@ -32,7 +32,7 @@ export const useHighlighted = ({
}: HighlightedProps): [
Highlight,
Dispatch<SetStateAction<Highlight>>,
MutableRefObject<Highlight>
MutableRefObject<Highlight>,
] => {
const initialHighlight = fromSelection(selected);
const highlightedRef = useRef<Highlight>(initialHighlight);

7
code/ui/manager/src/globals/globals-module-info.ts
View File

@ -21,7 +21,8 @@ import { globalPackages, globalsNameReferenceMap } from './globals';
* The `runtime.ts` file is used inside the manager's browser code runtime.
*/
export const globalsModuleInfoMap = globalPackages.reduce((acc, key) => {
export const globalsModuleInfoMap = globalPackages.reduce(
(acc, key) => {
acc[key] = {
type: 'esm',
varName: globalsNameReferenceMap[key],
@ -29,4 +30,6 @@ export const globalsModuleInfoMap = globalPackages.reduce((acc, key) => {
defaultExport: true,
};
return acc;
}, {} as Required<Record<keyof typeof globalsNameReferenceMap, Required<ModuleInfo>>>);
},
{} as Required<Record<keyof typeof globalsNameReferenceMap, Required<ModuleInfo>>>
);

10
code/ui/manager/src/utils/tree.ts
View File

@ -33,8 +33,11 @@ export const getParents = memoize(1000)((id: string, dataset: Dataset): Item[] =
export const getAncestorIds = memoize(1000)((data: IndexHash, id: string): string[] =>
getParents(id, data).map((item) => item.id)
);
export const getDescendantIds = memoize(1000)(
(data: IndexHash, id: string, skipLeafs: boolean): string[] => {
export const getDescendantIds = memoize(1000)((
data: IndexHash,
id: string,
skipLeafs: boolean
): string[] => {
const entry = data[id];
const children = entry.type === 'story' || entry.type === 'docs' ? [] : entry.children;
return children.reduce((acc, childId) => {
@ -43,8 +46,7 @@ export const getDescendantIds = memoize(1000)(
acc.push(childId, ...getDescendantIds(data, childId, skipLeafs));
return acc;
}, []);
}
);
});
export function getPath(item: Item, ref: RefType): string[] {
const parent = item.type !== 'root' && item.parent ? ref.index[item.parent] : null;