storybook 9.0.0-alpha.5 → 9.0.0-alpha.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/bin/index.cjs +63 -63
- package/dist/bin/index.js +63 -63
- package/dist/builder-manager/index.cjs +253 -280
- package/dist/builder-manager/index.js +305 -332
- package/dist/cli/bin/index.cjs +1 -1
- package/dist/cli/bin/index.js +1 -1
- package/dist/common/index.cjs +63 -63
- package/dist/common/index.js +63 -63
- package/dist/components/index.cjs +2102 -2069
- package/dist/components/index.js +2311 -2278
- package/dist/core-server/index.cjs +10816 -10501
- package/dist/core-server/index.d.ts +260 -2
- package/dist/core-server/index.js +10920 -10611
- package/dist/core-server/presets/common-preset.cjs +59 -59
- package/dist/core-server/presets/common-preset.js +57 -57
- package/dist/csf/index.d.ts +1 -1
- package/dist/instrumenter/index.cjs +1784 -1546
- package/dist/instrumenter/index.js +2220 -2054
- package/dist/manager/globals-module-info.cjs +22 -8
- package/dist/manager/globals-module-info.js +20 -6
- package/dist/manager/globals-runtime.js +22673 -23887
- package/dist/manager/runtime.js +3286 -3200
- package/dist/manager-api/index.cjs +3506 -3179
- package/dist/manager-api/index.d.ts +325 -24
- package/dist/manager-api/index.js +3245 -2957
- package/dist/manager-errors.d.ts +25 -1
- package/dist/manager-errors.js +42 -26
- package/dist/preview/runtime.js +15216 -16734
- package/dist/preview-api/index.cjs +1234 -1683
- package/dist/preview-api/index.d.ts +3 -309
- package/dist/preview-api/index.js +1360 -1785
- package/dist/preview-errors.cjs +98 -81
- package/dist/preview-errors.d.ts +25 -1
- package/dist/preview-errors.js +109 -93
- package/dist/server-errors.cjs +92 -75
- package/dist/server-errors.d.ts +25 -1
- package/dist/server-errors.js +83 -66
- package/dist/test/index.cjs +12779 -11872
- package/dist/test/index.js +12417 -11582
- package/dist/test/preview.cjs +1466 -1467
- package/dist/test/preview.js +4 -5
- package/dist/test/spy.cjs +11 -12
- package/dist/test/spy.js +14 -15
- package/dist/types/index.d.ts +271 -13
- package/package.json +9 -9
|
@@ -178,11 +178,11 @@ declare function useReducer<S, I, A>(reducer: (state: S, action: A) => S, initia
|
|
|
178
178
|
* @returns {void}
|
|
179
179
|
*/
|
|
180
180
|
declare function useEffect(create: () => (() => void) | void, deps?: any[]): void;
|
|
181
|
-
interface Listener
|
|
181
|
+
interface Listener {
|
|
182
182
|
(...args: any[]): void;
|
|
183
183
|
}
|
|
184
184
|
interface EventMap {
|
|
185
|
-
[eventId: string]: Listener
|
|
185
|
+
[eventId: string]: Listener;
|
|
186
186
|
}
|
|
187
187
|
/**
|
|
188
188
|
* Subscribes to events emitted by the Storybook channel and returns a function to emit events.
|
|
@@ -312,312 +312,6 @@ declare const makeDecorator: ({ name, parameterName, wrapper, skipIfNoParameters
|
|
|
312
312
|
|
|
313
313
|
declare function mockChannel(): Channel;
|
|
314
314
|
|
|
315
|
-
type EnvironmentType = (typeof UniversalStore.Environment)[keyof typeof UniversalStore.Environment];
|
|
316
|
-
type StatusType = (typeof UniversalStore.Status)[keyof typeof UniversalStore.Status];
|
|
317
|
-
type StateUpdater<TState> = (prevState: TState) => TState;
|
|
318
|
-
type Actor = {
|
|
319
|
-
id: string;
|
|
320
|
-
type: (typeof UniversalStore.ActorType)[keyof typeof UniversalStore.ActorType];
|
|
321
|
-
environment: EnvironmentType;
|
|
322
|
-
};
|
|
323
|
-
type EventInfo = {
|
|
324
|
-
actor: Actor;
|
|
325
|
-
forwardingActor?: Actor;
|
|
326
|
-
};
|
|
327
|
-
type Listener<TEvent> = (event: TEvent, eventInfo: EventInfo) => void;
|
|
328
|
-
type BaseEvent = {
|
|
329
|
-
type: string;
|
|
330
|
-
payload?: any;
|
|
331
|
-
};
|
|
332
|
-
interface SetStateEvent<TState> extends BaseEvent {
|
|
333
|
-
type: typeof UniversalStore.InternalEventType.SET_STATE;
|
|
334
|
-
payload: {
|
|
335
|
-
state: TState;
|
|
336
|
-
previousState: TState;
|
|
337
|
-
};
|
|
338
|
-
}
|
|
339
|
-
interface ExistingStateRequestEvent extends BaseEvent {
|
|
340
|
-
type: typeof UniversalStore.InternalEventType.EXISTING_STATE_REQUEST;
|
|
341
|
-
payload: never;
|
|
342
|
-
}
|
|
343
|
-
interface ExistingStateResponseEvent<TState> extends BaseEvent {
|
|
344
|
-
type: typeof UniversalStore.InternalEventType.EXISTING_STATE_RESPONSE;
|
|
345
|
-
payload: TState;
|
|
346
|
-
}
|
|
347
|
-
interface LeaderCreatedEvent extends BaseEvent {
|
|
348
|
-
type: typeof UniversalStore.InternalEventType.LEADER_CREATED;
|
|
349
|
-
payload: never;
|
|
350
|
-
}
|
|
351
|
-
interface FollowerCreatedEvent extends BaseEvent {
|
|
352
|
-
type: typeof UniversalStore.InternalEventType.FOLLOWER_CREATED;
|
|
353
|
-
payload: never;
|
|
354
|
-
}
|
|
355
|
-
type InternalEvent<TState> = SetStateEvent<TState> | ExistingStateRequestEvent | ExistingStateResponseEvent<TState> | FollowerCreatedEvent | LeaderCreatedEvent;
|
|
356
|
-
type Event<TState, TEvent extends BaseEvent> = TEvent | InternalEvent<TState>;
|
|
357
|
-
type ChannelLike = Pick<Channel, 'on' | 'off' | 'emit'>;
|
|
358
|
-
type StoreOptions<TState> = {
|
|
359
|
-
id: string;
|
|
360
|
-
leader?: boolean;
|
|
361
|
-
initialState?: TState;
|
|
362
|
-
debug?: boolean;
|
|
363
|
-
};
|
|
364
|
-
type EnvironmentOverrides = {
|
|
365
|
-
channel: ChannelLike;
|
|
366
|
-
environment: EnvironmentType;
|
|
367
|
-
};
|
|
368
|
-
|
|
369
|
-
/**
|
|
370
|
-
* A universal store implementation that synchronizes state across different environments using a
|
|
371
|
-
* channel-based communication.
|
|
372
|
-
*
|
|
373
|
-
* The store follows a leader-follower pattern where:
|
|
374
|
-
*
|
|
375
|
-
* - Leader: The main store instance that owns and manages the state
|
|
376
|
-
* - Follower: Store instances that mirror the leader's state
|
|
377
|
-
*
|
|
378
|
-
* Features:
|
|
379
|
-
*
|
|
380
|
-
* - State synchronization across environments
|
|
381
|
-
* - Event-based communication
|
|
382
|
-
* - Type-safe state and custom events
|
|
383
|
-
* - Subscription system for state changes and custom events
|
|
384
|
-
*
|
|
385
|
-
* @remarks
|
|
386
|
-
* - The store must be created using the static `create()` method, not the constructor
|
|
387
|
-
* - Follower stores will automatically sync with their leader's state. If they have initial state, it
|
|
388
|
-
* will be replaced immediately when it has synced with the leader.
|
|
389
|
-
*
|
|
390
|
-
* @example
|
|
391
|
-
*
|
|
392
|
-
* ```typescript
|
|
393
|
-
* interface MyState {
|
|
394
|
-
* count: number;
|
|
395
|
-
* }
|
|
396
|
-
* interface MyCustomEvent {
|
|
397
|
-
* type: 'INCREMENT';
|
|
398
|
-
* payload: number;
|
|
399
|
-
* }
|
|
400
|
-
*
|
|
401
|
-
* // Create a leader store
|
|
402
|
-
* const leaderStore = UniversalStore.create<MyState, MyCustomEvent>({
|
|
403
|
-
* id: 'my-store',
|
|
404
|
-
* leader: true,
|
|
405
|
-
* initialState: { count: 0 },
|
|
406
|
-
* });
|
|
407
|
-
*
|
|
408
|
-
* // Create a follower store
|
|
409
|
-
* const followerStore = UniversalStore.create<MyState, MyCustomEvent>({
|
|
410
|
-
* id: 'my-store',
|
|
411
|
-
* leader: false,
|
|
412
|
-
* });
|
|
413
|
-
* ```
|
|
414
|
-
*
|
|
415
|
-
* @template State - The type of state managed by the store
|
|
416
|
-
* @template CustomEvent - Custom events that can be sent through the store. Must have a `type`
|
|
417
|
-
* string and optional `payload`
|
|
418
|
-
* @throws {Error} If constructed directly instead of using `create()`
|
|
419
|
-
* @throws {Error} If created without setting a channel first
|
|
420
|
-
* @throws {Error} If a follower is created with initial state
|
|
421
|
-
* @throws {Error} If a follower cannot find its leader within 1 second
|
|
422
|
-
*/
|
|
423
|
-
declare class UniversalStore<State, CustomEvent extends {
|
|
424
|
-
type: string;
|
|
425
|
-
payload?: any;
|
|
426
|
-
} = {
|
|
427
|
-
type: string;
|
|
428
|
-
payload?: any;
|
|
429
|
-
}> {
|
|
430
|
-
/**
|
|
431
|
-
* Defines the possible actor types in the store system
|
|
432
|
-
*
|
|
433
|
-
* @readonly
|
|
434
|
-
*/
|
|
435
|
-
static readonly ActorType: {
|
|
436
|
-
readonly LEADER: "LEADER";
|
|
437
|
-
readonly FOLLOWER: "FOLLOWER";
|
|
438
|
-
};
|
|
439
|
-
/**
|
|
440
|
-
* Defines the possible environments the store can run in
|
|
441
|
-
*
|
|
442
|
-
* @readonly
|
|
443
|
-
*/
|
|
444
|
-
static readonly Environment: {
|
|
445
|
-
readonly SERVER: "SERVER";
|
|
446
|
-
readonly MANAGER: "MANAGER";
|
|
447
|
-
readonly PREVIEW: "PREVIEW";
|
|
448
|
-
readonly UNKNOWN: "UNKNOWN";
|
|
449
|
-
readonly MOCK: "MOCK";
|
|
450
|
-
};
|
|
451
|
-
/**
|
|
452
|
-
* Internal event types used for store synchronization
|
|
453
|
-
*
|
|
454
|
-
* @readonly
|
|
455
|
-
*/
|
|
456
|
-
static readonly InternalEventType: {
|
|
457
|
-
readonly EXISTING_STATE_REQUEST: "__EXISTING_STATE_REQUEST";
|
|
458
|
-
readonly EXISTING_STATE_RESPONSE: "__EXISTING_STATE_RESPONSE";
|
|
459
|
-
readonly SET_STATE: "__SET_STATE";
|
|
460
|
-
readonly LEADER_CREATED: "__LEADER_CREATED";
|
|
461
|
-
readonly FOLLOWER_CREATED: "__FOLLOWER_CREATED";
|
|
462
|
-
};
|
|
463
|
-
static readonly Status: {
|
|
464
|
-
readonly UNPREPARED: "UNPREPARED";
|
|
465
|
-
readonly SYNCING: "SYNCING";
|
|
466
|
-
readonly READY: "READY";
|
|
467
|
-
readonly ERROR: "ERROR";
|
|
468
|
-
};
|
|
469
|
-
protected static isInternalConstructing: boolean;
|
|
470
|
-
/**
|
|
471
|
-
* The preparation construct is used to keep track of all store's preparation state the promise is
|
|
472
|
-
* resolved when the store is prepared with the static __prepare() method which will also change
|
|
473
|
-
* the state from PENDING to RESOLVED
|
|
474
|
-
*/
|
|
475
|
-
private static preparation;
|
|
476
|
-
private static setupPreparationPromise;
|
|
477
|
-
/** Enable debug logs for this store */
|
|
478
|
-
debugging: boolean;
|
|
479
|
-
/** The actor object representing the store instance with a unique ID and a type */
|
|
480
|
-
get actor(): Actor;
|
|
481
|
-
/**
|
|
482
|
-
* The current state of the store, that signals both if the store is prepared by Storybook and
|
|
483
|
-
* also - in the case of a follower - if the state has been synced with the leader's state.
|
|
484
|
-
*/
|
|
485
|
-
get status(): StatusType;
|
|
486
|
-
/**
|
|
487
|
-
* A promise that resolves when the store is fully ready. A leader will be ready when the store
|
|
488
|
-
* has been prepared by Storybook, which is almost instantly.
|
|
489
|
-
*
|
|
490
|
-
* A follower will be ready when the state has been synced with the leader's state, within a few
|
|
491
|
-
* hundred milliseconds.
|
|
492
|
-
*/
|
|
493
|
-
untilReady(): Promise<[{
|
|
494
|
-
channel: ChannelLike;
|
|
495
|
-
environment: EnvironmentType;
|
|
496
|
-
}, void | undefined]>;
|
|
497
|
-
/**
|
|
498
|
-
* The syncing construct is used to keep track of if the instance's state has been synced with the
|
|
499
|
-
* other instances. A leader will immediately have the promise resolved. A follower will initially
|
|
500
|
-
* be in a PENDING state, and resolve the the leader has sent the existing state, or reject if no
|
|
501
|
-
* leader has responded before the timeout.
|
|
502
|
-
*/
|
|
503
|
-
private syncing?;
|
|
504
|
-
private channelEventName;
|
|
505
|
-
private state;
|
|
506
|
-
private channel?;
|
|
507
|
-
private environment?;
|
|
508
|
-
private listeners;
|
|
509
|
-
private id;
|
|
510
|
-
private actorId;
|
|
511
|
-
private actorType;
|
|
512
|
-
protected constructor(options: StoreOptions<State>, environmentOverrides?: EnvironmentOverrides);
|
|
513
|
-
/** Creates a new instance of UniversalStore */
|
|
514
|
-
static create<State = any, CustomEvent extends {
|
|
515
|
-
type: string;
|
|
516
|
-
payload?: any;
|
|
517
|
-
} = {
|
|
518
|
-
type: string;
|
|
519
|
-
payload?: any;
|
|
520
|
-
}>(options: StoreOptions<State>): UniversalStore<State, CustomEvent>;
|
|
521
|
-
/** Gets the current state */
|
|
522
|
-
getState: () => State;
|
|
523
|
-
/**
|
|
524
|
-
* Updates the store's state
|
|
525
|
-
*
|
|
526
|
-
* Either a new state or a state updater function can be passed to the method.
|
|
527
|
-
*/
|
|
528
|
-
setState(updater: State | StateUpdater<State>): void;
|
|
529
|
-
/**
|
|
530
|
-
* Subscribes to store events
|
|
531
|
-
*
|
|
532
|
-
* @returns A function to unsubscribe
|
|
533
|
-
*/
|
|
534
|
-
subscribe: {
|
|
535
|
-
(listener: Listener<Event<State, CustomEvent>>): () => void;
|
|
536
|
-
<EventType extends Event<State, CustomEvent>['type']>(eventType: EventType, listener: Listener<Extract<Event<State, CustomEvent>, {
|
|
537
|
-
type: EventType;
|
|
538
|
-
}>>): () => void;
|
|
539
|
-
};
|
|
540
|
-
/**
|
|
541
|
-
* Subscribes to state changes
|
|
542
|
-
*
|
|
543
|
-
* @returns Unsubscribe function
|
|
544
|
-
*/
|
|
545
|
-
onStateChange(listener: (state: State, previousState: State, eventInfo: EventInfo) => void): () => void;
|
|
546
|
-
/** Sends a custom event to the other stores */
|
|
547
|
-
send: (event: CustomEvent) => void;
|
|
548
|
-
private emitToChannel;
|
|
549
|
-
private prepareThis;
|
|
550
|
-
private emitToListeners;
|
|
551
|
-
private handleChannelEvents;
|
|
552
|
-
private debug;
|
|
553
|
-
}
|
|
554
|
-
|
|
555
|
-
/**
|
|
556
|
-
* A hook to use a UniversalStore in a rendered preview. This hook will react to changes in the
|
|
557
|
-
* store state and re-render when the store changes.
|
|
558
|
-
*
|
|
559
|
-
* @param universalStore The UniversalStore instance to use.
|
|
560
|
-
* @param selector An optional selector function to select a subset of the store state.
|
|
561
|
-
* @remark This hook is intended for use in the preview. For use in the manager UI, import from
|
|
562
|
-
* `storybook/manager-api` instead.
|
|
563
|
-
*/
|
|
564
|
-
declare const useUniversalStore: {
|
|
565
|
-
<TUniversalStore extends UniversalStore<TState, any>, TState = TUniversalStore extends UniversalStore<infer S, any> ? S : never>(universalStore: TUniversalStore): [TState, TUniversalStore['setState']];
|
|
566
|
-
<TUniversalStore extends UniversalStore<any, any>, TSelectedState, TState = TUniversalStore extends UniversalStore<infer S, any> ? S : never>(universalStore: TUniversalStore, selector: (state: TState) => TSelectedState): [TSelectedState, TUniversalStore['setState']];
|
|
567
|
-
};
|
|
568
|
-
|
|
569
|
-
/**
|
|
570
|
-
* A mock universal store that can be used when testing code that relies on a universal store. It
|
|
571
|
-
* functions exactly like a normal universal store, with a few exceptions:
|
|
572
|
-
*
|
|
573
|
-
* - It is fully isolated, meaning that it doesn't interact with any channel, and it is always a
|
|
574
|
-
* leader.
|
|
575
|
-
*
|
|
576
|
-
* If the second testUtils argument is provided, all the public methods are spied on, so they can be
|
|
577
|
-
* asserted.
|
|
578
|
-
*
|
|
579
|
-
* When a mock store is re-used across tests (eg. in stories), you manually need to reset the state
|
|
580
|
-
* after each test.
|
|
581
|
-
*
|
|
582
|
-
* @example
|
|
583
|
-
*
|
|
584
|
-
* ```ts
|
|
585
|
-
* import * as testUtils from 'storybook/test'; // in stories
|
|
586
|
-
* import { vi as testUtils } from 'vitest'; // ... or in Vitest tests
|
|
587
|
-
*
|
|
588
|
-
* const initialState = { ... };
|
|
589
|
-
* const store = new MockUniversalStore({ initialState }, testUtils);
|
|
590
|
-
*
|
|
591
|
-
* export default {
|
|
592
|
-
* title: 'My story',
|
|
593
|
-
* beforeEach: () => {
|
|
594
|
-
* return () => {
|
|
595
|
-
* store.setState(initialState);
|
|
596
|
-
* };
|
|
597
|
-
* }
|
|
598
|
-
* }
|
|
599
|
-
* ```
|
|
600
|
-
*/
|
|
601
|
-
declare class MockUniversalStore<State, CustomEvent extends {
|
|
602
|
-
type: string;
|
|
603
|
-
payload?: any;
|
|
604
|
-
} = {
|
|
605
|
-
type: string;
|
|
606
|
-
payload?: any;
|
|
607
|
-
}> extends UniversalStore<State, CustomEvent> {
|
|
608
|
-
private testUtils;
|
|
609
|
-
constructor(options: StoreOptions<State>, testUtils?: any);
|
|
610
|
-
/** Create a mock universal store. This is just an alias for the constructor */
|
|
611
|
-
static create<State = any, CustomEvent extends {
|
|
612
|
-
type: string;
|
|
613
|
-
payload?: any;
|
|
614
|
-
} = {
|
|
615
|
-
type: string;
|
|
616
|
-
payload?: any;
|
|
617
|
-
}>(options: StoreOptions<State>, testUtils?: any): MockUniversalStore<State, CustomEvent>;
|
|
618
|
-
unsubscribeAll(): void;
|
|
619
|
-
}
|
|
620
|
-
|
|
621
315
|
declare class ArgsStore {
|
|
622
316
|
initialArgsByStoryId: Record<StoryId, Args>;
|
|
623
317
|
argsByStoryId: Record<StoryId, Args>;
|
|
@@ -1397,4 +1091,4 @@ declare type RenderContext<TRenderer extends Renderer = Renderer> = StoryIdentif
|
|
|
1397
1091
|
declare function getCoreAnnotations(): any[];
|
|
1398
1092
|
declare function getComposedCoreAnnotations<TRenderer extends Renderer$1>(): NormalizedProjectAnnotations<TRenderer>;
|
|
1399
1093
|
|
|
1400
|
-
export { DocsContext, HooksContext, Preview, PreviewWeb, PreviewWithSelection, type PropDescriptor, type Report, ReporterAPI, type SelectionStore, StoryStore, UrlStore, type View, WebView, addons, applyHooks, combineArgs, combineParameters, composeConfigs, composeStepRunners, composeStories, composeStory, createPlaywrightTest, decorateStory, defaultDecorateStory, definePreview,
|
|
1094
|
+
export { DocsContext, HooksContext, Preview, PreviewWeb, PreviewWithSelection, type PropDescriptor, type Report, ReporterAPI, type SelectionStore, StoryStore, UrlStore, type View, WebView, addons, applyHooks, combineArgs, combineParameters, composeConfigs, composeStepRunners, composeStories, composeStory, createPlaywrightTest, decorateStory, defaultDecorateStory, definePreview, filterArgTypes, getComposedCoreAnnotations, getCoreAnnotations, getCsfFactoryAnnotations, inferControls, makeDecorator, mockChannel, normalizeProjectAnnotations, normalizeStory, prepareMeta, prepareStory, sanitizeStoryContextUpdate, setDefaultProjectAnnotations, setProjectAnnotations, simulateDOMContentLoaded, simulatePageLoad, sortStoriesV7, useArgs, useCallback, useChannel, useEffect, useGlobals, useMemo, useParameter, useReducer, useRef, useState, useStoryContext, userOrAutoTitle, userOrAutoTitleFromSpecifier };
|