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

Controls: Rework conditional controls with globals, queries

Browse Source
This commit is contained in:
Michael Shilman 2022-04-05 14:23:09 +08:00
parent d377613e42
commit 5dee0358ff
43 changed files with 145 additions and 97 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
addons/a11y/package.json
View File

@ -51,7 +51,7 @@
"@storybook/client-logger": "6.5.0-alpha.55",
"@storybook/components": "6.5.0-alpha.55",
"@storybook/core-events": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/theming": "6.5.0-alpha.55",
"axe-core": "^4.2.0",
"core-js": "^3.8.2",

2
addons/backgrounds/package.json
View File

@ -50,7 +50,7 @@
"@storybook/client-logger": "6.5.0-alpha.55",
"@storybook/components": "6.5.0-alpha.55",
"@storybook/core-events": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/theming": "6.5.0-alpha.55",
"core-js": "^3.8.2",
"global": "^4.4.0",

2
addons/controls/package.json
View File

@ -50,7 +50,7 @@
"@storybook/client-logger": "6.5.0-alpha.55",
"@storybook/components": "6.5.0-alpha.55",
"@storybook/core-common": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/node-logger": "6.5.0-alpha.55",
"@storybook/store": "6.5.0-alpha.55",
"@storybook/theming": "6.5.0-alpha.55",

11
addons/controls/src/ControlsPanel.tsx
View File

@ -1,5 +1,12 @@
import React, { FC } from 'react';
import { ArgTypes, useArgs, useArgTypes, useParameter, useStorybookState } from '@storybook/api';
import {
ArgTypes,
useArgs,
useGlobals,
useArgTypes,
useParameter,
useStorybookState,
} from '@storybook/api';
import { ArgsTable, NoControlsWarning, PresetColor, SortType } from '@storybook/components';
import { PARAM_KEY } from './constants';
@ -13,6 +20,7 @@ interface ControlsParameters {
export const ControlsPanel: FC = () => {
const [args, updateArgs, resetArgs] = useArgs();
const [globals] = useGlobals();
const rows = useArgTypes();
const isArgsStory = useParameter<boolean>('__isArgsStory', false);
const {
@ -41,6 +49,7 @@ export const ControlsPanel: FC = () => {
compact: !expanded && hasControls,
rows: withPresetColors,
args,
globals,
updateArgs,
resetArgs,
inAddonPanel: true,

2
addons/docs/docs/multiframework.md
View File

@ -53,8 +53,6 @@ export interface ArgType {
name?: string;
description?: string;
defaultValue?: any;
addIf?: string;
removeIf?: string;
[key: string]: any;
}

2
addons/docs/package.json
View File

@ -64,7 +64,7 @@
"@storybook/components": "6.5.0-alpha.55",
"@storybook/core-common": "6.5.0-alpha.55",
"@storybook/core-events": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/docs-tools": "6.5.0-alpha.55",
"@storybook/mdx1-csf": "canary",
"@storybook/node-logger": "6.5.0-alpha.55",

37
addons/docs/src/blocks/ArgsTable.tsx
View File

@ -11,7 +11,7 @@ import { ArgTypesExtractor } from '@storybook/docs-tools';
import { addons } from '@storybook/addons';
import { filterArgTypes, PropDescriptor } from '@storybook/store';
import Events from '@storybook/core-events';
import { StrictArgTypes, Args } from '@storybook/csf';
import { StrictArgTypes, Args, Globals } from '@storybook/csf';
import { DocsContext, DocsContextProps } from './DocsContext';
import { Component, CURRENT_SELECTION, PRIMARY_STORY } from './types';
@ -42,18 +42,20 @@ type StoryProps = BaseProps & {
type ArgsTableProps = BaseProps | OfProps | ComponentsProps | StoryProps;
const getContext = (storyId: string, context: DocsContextProps) => {
const story = context.storyById(storyId);
if (!story) {
throw new Error(`Unknown story: ${storyId}`);
}
return context.getStoryContext(story);
};
const useArgs = (
storyId: string,
context: DocsContextProps
): [Args, (args: Args) => void, (argNames?: string[]) => void] => {
const channel = addons.getChannel();
const story = context.storyById(storyId);
if (!story) {
throw new Error(`Unknown story: ${storyId}`);
}
const storyContext = context.getStoryContext(story);
const storyContext = getContext(storyId, context);
const [args, setArgs] = useState(storyContext.args);
useEffect(() => {
@ -76,6 +78,22 @@ const useArgs = (
return [args, updateArgs, resetArgs];
};
const useGlobals = (storyId: string, context: DocsContextProps): [Globals] => {
const channel = addons.getChannel();
const storyContext = getContext(storyId, context);
const [globals, setGlobals] = useState(storyContext.globals);
useEffect(() => {
const cb = (changed: { globals: Globals }) => {
setGlobals(changed.globals);
};
channel.on(Events.GLOBALS_UPDATED, cb);
return () => channel.off(Events.GLOBALS_UPDATED, cb);
}, []);
return [globals];
};
export const extractComponentArgTypes = (
component: Component,
{ id, storyById }: DocsContextProps,
@ -162,13 +180,14 @@ export const StoryTable: FC<
const story = useStory(storyId, context);
// eslint-disable-next-line prefer-const
let [args, updateArgs, resetArgs] = useArgs(storyId, context);
const [globals] = useGlobals(storyId, context);
if (!story) return <PureArgsTable isLoading updateArgs={updateArgs} resetArgs={resetArgs} />;
const argTypes = filterArgTypes(story.argTypes, include, exclude);
const mainLabel = getComponentName(component) || 'Story';
let tabs = { [mainLabel]: { rows: argTypes, args, updateArgs, resetArgs } } as Record<
let tabs = { [mainLabel]: { rows: argTypes, args, globals, updateArgs, resetArgs } } as Record<
string,
PureArgsTableProps
>;

2
addons/links/package.json
View File

@ -44,7 +44,7 @@
"@storybook/addons": "6.5.0-alpha.55",
"@storybook/client-logger": "6.5.0-alpha.55",
"@storybook/core-events": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/router": "6.5.0-alpha.55",
"@types/qs": "^6.9.5",
"core-js": "^3.8.2",

2
addons/measure/package.json
View File

@ -49,7 +49,7 @@
"@storybook/client-logger": "6.5.0-alpha.55",
"@storybook/components": "6.5.0-alpha.55",
"@storybook/core-events": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"core-js": "^3.8.2",
"global": "^4.4.0"
},

2
addons/outline/package.json
View File

@ -52,7 +52,7 @@
"@storybook/client-logger": "6.5.0-alpha.55",
"@storybook/components": "6.5.0-alpha.55",
"@storybook/core-events": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"core-js": "^3.8.2",
"global": "^4.4.0",
"regenerator-runtime": "^0.13.7",

2
addons/storyshots/storyshots-core/package.json
View File

@ -51,7 +51,7 @@
"@storybook/core": "6.5.0-alpha.55",
"@storybook/core-client": "6.5.0-alpha.55",
"@storybook/core-common": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@types/glob": "^7.1.3",
"@types/jest": "^26.0.16",
"@types/jest-specific-snapshot": "^0.5.3",

4
addons/storyshots/storyshots-puppeteer/package.json
View File

@ -41,7 +41,7 @@
},
"dependencies": {
"@axe-core/puppeteer": "^4.2.0",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/node-logger": "6.5.0-alpha.55",
"@types/jest-image-snapshot": "^4.1.3",
"core-js": "^3.8.2",
@ -49,7 +49,7 @@
"regenerator-runtime": "^0.13.7"
},
"devDependencies": {
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@types/puppeteer": "^5.4.0"
},
"peerDependencies": {

2
app/angular/package.json
View File

@ -51,7 +51,7 @@
"@storybook/core": "6.5.0-alpha.55",
"@storybook/core-common": "6.5.0-alpha.55",
"@storybook/core-events": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/docs-tools": "6.5.0-alpha.55",
"@storybook/node-logger": "6.5.0-alpha.55",
"@storybook/semver": "^7.3.2",

2
app/html/package.json
View File

@ -48,7 +48,7 @@
"@storybook/addons": "6.5.0-alpha.55",
"@storybook/core": "6.5.0-alpha.55",
"@storybook/core-common": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/docs-tools": "6.5.0-alpha.55",
"@storybook/preview-web": "6.5.0-alpha.55",
"@storybook/store": "6.5.0-alpha.55",

2
app/preact/package.json
View File

@ -49,7 +49,7 @@
"@storybook/addons": "6.5.0-alpha.55",
"@storybook/core": "6.5.0-alpha.55",
"@storybook/core-common": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/store": "6.5.0-alpha.55",
"@types/node": "^14.14.20 || ^16.0.0",
"@types/webpack-env": "^1.16.0",

2
app/react/package.json
View File

@ -53,7 +53,7 @@
"@storybook/client-logger": "6.5.0-alpha.55",
"@storybook/core": "6.5.0-alpha.55",
"@storybook/core-common": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/docs-tools": "6.5.0-alpha.55",
"@storybook/node-logger": "6.5.0-alpha.55",
"@storybook/react-docgen-typescript-plugin": "1.0.2-canary.6.9d540b91e815f8fc2f8829189deb00553559ff63.0",

2
app/server/package.json
View File

@ -50,7 +50,7 @@
"@storybook/client-api": "6.5.0-alpha.55",
"@storybook/core": "6.5.0-alpha.55",
"@storybook/core-common": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/node-logger": "6.5.0-alpha.55",
"@storybook/preview-web": "6.5.0-alpha.55",
"@storybook/store": "6.5.0-alpha.55",

2
app/svelte/package.json
View File

@ -50,7 +50,7 @@
"@storybook/client-logger": "6.5.0-alpha.55",
"@storybook/core": "6.5.0-alpha.55",
"@storybook/core-common": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/docs-tools": "6.5.0-alpha.55",
"@storybook/node-logger": "6.5.0-alpha.55",
"@storybook/store": "6.5.0-alpha.55",

2
app/vue/package.json
View File

@ -49,7 +49,7 @@
"@storybook/client-logger": "6.5.0-alpha.55",
"@storybook/core": "6.5.0-alpha.55",
"@storybook/core-common": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/docs-tools": "6.5.0-alpha.55",
"@storybook/store": "6.5.0-alpha.55",
"@types/node": "^14.14.20 || ^16.0.0",

2
app/vue3/package.json
View File

@ -48,7 +48,7 @@
"@storybook/addons": "6.5.0-alpha.55",
"@storybook/core": "6.5.0-alpha.55",
"@storybook/core-common": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/docs-tools": "6.5.0-alpha.55",
"@storybook/store": "6.5.0-alpha.55",
"@types/node": "^14.14.20 || ^16.0.0",

2
app/web-components/package.json
View File

@ -55,7 +55,7 @@
"@storybook/client-logger": "6.5.0-alpha.55",
"@storybook/core": "6.5.0-alpha.55",
"@storybook/core-common": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/docs-tools": "6.5.0-alpha.55",
"@storybook/preview-web": "6.5.0-alpha.55",
"@storybook/store": "6.5.0-alpha.55",

2
docs/essentials/controls.md
View File

@ -302,7 +302,7 @@ paths={[
### Conditional controls
In some cases, it's useful to be able to conditionally exclude a control based on the value of another control. Controls supports basic versions of these use cases with the `addIf` and `removeIf` options, which can take a boolean value, or a string which can refer to the value of another arg.
In some cases, it's useful to be able to conditionally exclude a control based on the value of another control. Controls supports basic versions of these use cases with the `if`, which can takes a simple query object to determine whether to include the control.
Consider a collection of "advanced" settings that are only visible when the user toggles an "advanced" toggle.

7
docs/snippets/common/component-story-conditional-controls-mutual-exclusion.js.mdx
View File

@ -6,10 +6,13 @@ export default {
title: 'Button',
argTypes: {
// button can be passed a label or an image, not both
label: { control: 'text', removeIf: 'image' },
label: {
control: 'text',
if: { arg: 'image', truthy: false },
},
image: {
control: { type: 'select', options: ['foo.jpg', 'bar.jpg'] },
removeIf: 'label',
if: { arg: 'label', truthy: false },
},
},
};

6
docs/snippets/common/component-story-conditional-controls-toggle.js.mdx
View File

@ -8,9 +8,9 @@ export default {
label: { control: 'text' }, // always shows
advanced: { control: 'boolean' },
// below are only included when advanced is true
margin: { control: 'number', addIf: 'advanced' },
padding: { control: 'number', addIf: 'advanced' },
cornerRadius: { control: 'number', addIf: 'advanced' },
margin: { control: 'number', if: { arg: 'advanced' } },
padding: { control: 'number', if: { arg: 'advanced' } },
cornerRadius: { control: 'number', if: { arg: 'advanced' } },
},
};
```

21
examples/official-storybook/stories/addon-controls.stories.tsx
View File

@ -28,17 +28,17 @@ export default {
],
},
},
mutuallyExclusiveA: { control: 'text', removeIf: 'mutuallyExclusiveB' },
mutuallyExclusiveB: { control: 'text', removeIf: 'mutuallyExclusiveA' },
mutuallyExclusiveA: { control: 'text', if: { arg: 'mutuallyExclusiveB', truthy: false } },
mutuallyExclusiveB: { control: 'text', if: { arg: 'mutuallyExclusiveA', truthy: false } },
colorMode: {
control: 'boolean',
},
dynamicText: {
removeIf: 'colorMode',
if: { arg: 'colorMode', truthy: false },
control: 'text',
},
dynamicColor: {
addIf: 'colorMode',
if: { arg: 'colorMode' },
control: 'color',
},
advanced: {
@ -46,19 +46,22 @@ export default {
},
margin: {
control: 'number',
addIf: 'advanced',
if: { arg: 'advanced' },
},
padding: {
control: 'number',
addIf: 'advanced',
if: { arg: 'advanced' },
},
cornerRadius: {
control: 'number',
addIf: 'advanced',
if: { arg: 'advanced' },
},
someText: { control: 'text' },
subText: { control: 'text', addIf: 'someText' },
anotherText: { control: 'text', addIf: 'someText' },
subText: { control: 'text', if: { arg: 'someText' } },
ifThemeExists: { control: 'text', if: { global: 'theme' } },
ifThemeNotExists: { control: 'text', if: { global: 'theme', exists: false } },
ifLightTheme: { control: 'text', if: { global: 'theme', eq: 'light' } },
ifNotLightTheme: { control: 'text', if: { global: 'theme', neq: 'light' } },
},
parameters: {
chromatic: { disable: true },

2
lib/addons/package.json
View File

@ -44,7 +44,7 @@
"@storybook/channels": "6.5.0-alpha.55",
"@storybook/client-logger": "6.5.0-alpha.55",
"@storybook/core-events": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/router": "6.5.0-alpha.55",
"@storybook/theming": "6.5.0-alpha.55",
"@types/webpack-env": "^1.16.0",

2
lib/api/package.json
View File

@ -41,7 +41,7 @@
"@storybook/channels": "6.5.0-alpha.55",
"@storybook/client-logger": "6.5.0-alpha.55",
"@storybook/core-events": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/router": "6.5.0-alpha.55",
"@storybook/semver": "^7.3.2",
"@storybook/theming": "6.5.0-alpha.55",

4
lib/api/src/index.tsx
View File

@ -11,6 +11,7 @@ import React, {
useRef,
} from 'react';
import mergeWith from 'lodash/mergeWith';
import { Conditional } from '@storybook/csf';
import {
STORY_CHANGED,
@ -117,8 +118,7 @@ export interface ArgType {
name?: string;
description?: string;
defaultValue?: any;
addIf?: string;
removeIf?: string;
if?: Conditional;
[key: string]: any;
}

2
lib/client-api/package.json
View File

@ -45,7 +45,7 @@
"@storybook/channels": "6.5.0-alpha.55",
"@storybook/client-logger": "6.5.0-alpha.55",
"@storybook/core-events": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/store": "6.5.0-alpha.55",
"@types/qs": "^6.9.5",
"@types/webpack-env": "^1.16.0",

2
lib/codemod/package.json
View File

@ -43,7 +43,7 @@
"dependencies": {
"@babel/types": "^7.12.11",
"@mdx-js/mdx": "^1.6.22",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/csf-tools": "6.5.0-alpha.55",
"@storybook/node-logger": "6.5.0-alpha.55",
"core-js": "^3.8.2",

2
lib/components/package.json
View File

@ -41,7 +41,7 @@
},
"dependencies": {
"@storybook/client-logger": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/theming": "6.5.0-alpha.55",
"core-js": "^3.8.2",
"regenerator-runtime": "^0.13.7"

10
lib/components/src/blocks/ArgsTable/ArgsTable.tsx
View File

@ -6,7 +6,7 @@ import { includeConditionalArg } from '@storybook/csf';
import { Icons } from '../../icon/icon';
import { ArgRow } from './ArgRow';
import { SectionRow } from './SectionRow';
import { ArgType, ArgTypes, Args } from './types';
import { ArgType, ArgTypes, Args, Globals } from './types';
import { EmptyBlock } from '../EmptyBlock';
import { Link } from '../../typography/link/link';
import { ResetWrapper } from '../../typography/ResetWrapper';
@ -271,6 +271,7 @@ export interface ArgsTableOptionProps {
export interface ArgsTableDataProps {
rows: ArgTypes;
args?: Args;
globals?: Globals;
}
export interface ArgsTableErrorProps {
@ -396,10 +397,13 @@ export const ArgsTable: FC<ArgsTableProps> = (props) => {
sort = 'none',
} = props;
const isLoading = 'isLoading' in props;
const { rows, args } = 'rows' in props ? props : argsTableLoadingData;
const { rows, args, globals } = 'rows' in props ? props : argsTableLoadingData;
const groups = groupRows(
pickBy(rows, (row) => !row?.table?.disable && includeConditionalArg(row, args)),
pickBy(
rows,
(row) => !row?.table?.disable && includeConditionalArg(row, args || {}, globals || {})
),
sort
);

7
lib/components/src/blocks/ArgsTable/types.ts
View File

@ -1,3 +1,5 @@
import type { Conditional } from '@storybook/csf';
export interface JsDocParam {
name: string;
description?: string;
@ -32,8 +34,7 @@ export interface ArgType {
name?: string;
description?: string;
defaultValue?: any;
addIf?: string;
removeIf?: string;
if?: Conditional;
[key: string]: any;
}
@ -44,3 +45,5 @@ export interface ArgTypes {
export interface Args {
[key: string]: any;
}
export type Globals = { [name: string]: any };

2
lib/core-client/package.json
View File

@ -46,7 +46,7 @@
"@storybook/client-api": "6.5.0-alpha.55",
"@storybook/client-logger": "6.5.0-alpha.55",
"@storybook/core-events": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/preview-web": "6.5.0-alpha.55",
"@storybook/store": "6.5.0-alpha.55",
"@storybook/ui": "6.5.0-alpha.55",

2
lib/core-server/package.json
View File

@ -44,7 +44,7 @@
"@storybook/core-client": "6.5.0-alpha.55",
"@storybook/core-common": "6.5.0-alpha.55",
"@storybook/core-events": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/csf-tools": "6.5.0-alpha.55",
"@storybook/manager-webpack4": "6.5.0-alpha.55",
"@storybook/node-logger": "6.5.0-alpha.55",

2
lib/csf-tools/package.json
View File

@ -47,7 +47,7 @@
"@babel/preset-env": "^7.12.11",
"@babel/traverse": "^7.12.11",
"@babel/types": "^7.12.11",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/mdx1-csf": "canary",
"core-js": "^3.8.2",
"fs-extra": "^9.0.1",

2
lib/docs-tools/package.json
View File

@ -41,7 +41,7 @@
},
"dependencies": {
"@babel/core": "^7.12.10",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/store": "6.5.0-alpha.55",
"core-js": "^3.8.2",
"doctrine": "^3.0.0",

2
lib/preview-web/package.json
View File

@ -44,7 +44,7 @@
"@storybook/channel-postmessage": "6.5.0-alpha.55",
"@storybook/client-logger": "6.5.0-alpha.55",
"@storybook/core-events": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"@storybook/store": "6.5.0-alpha.55",
"ansi-to-html": "^0.6.11",
"core-js": "^3.8.2",

2
lib/source-loader/package.json
View File

@ -43,7 +43,7 @@
"dependencies": {
"@storybook/addons": "6.5.0-alpha.55",
"@storybook/client-logger": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"core-js": "^3.8.2",
"estraverse": "^5.2.0",
"global": "^4.4.0",

2
lib/store/package.json
View File

@ -43,7 +43,7 @@
"@storybook/addons": "6.5.0-alpha.55",
"@storybook/client-logger": "6.5.0-alpha.55",
"@storybook/core-events": "6.5.0-alpha.55",
"@storybook/csf": "0.0.2--canary.507502b.0",
"@storybook/csf": "0.0.2--canary.7c6c115.0",
"core-js": "^3.8.2",
"fast-deep-equal": "^3.1.3",
"global": "^4.4.0",

2
lib/store/src/csf/prepareStory.test.ts
View File

@ -511,7 +511,7 @@ describe('prepareStory', () => {
id,
name,
args: { a: 1, b: 2 },
argTypes: { b: { name: 'b', removeIf: 'a' } },
argTypes: { b: { name: 'b', if: { arg: 'a', truthy: false } } },
},
{ id, title },
{ render: renderMock }

2
lib/store/src/csf/prepareStory.ts
View File

@ -169,7 +169,7 @@ export function prepareStory<TFramework extends AnyFramework>(
const includedArgs = Object.entries(mappedArgs).reduce((acc, [key, val]) => {
const argType = context.argTypes[key] || {};
if (includeConditionalArg(argType, mappedArgs)) acc[key] = val;
if (includeConditionalArg(argType, mappedArgs, context.globals)) acc[key] = val;
return acc;
}, {} as Args);

69
yarn.lock
View File

@ -6185,7 +6185,7 @@ __metadata:
"@storybook/client-logger": 6.5.0-alpha.55
"@storybook/components": 6.5.0-alpha.55
"@storybook/core-events": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/theming": 6.5.0-alpha.55
"@testing-library/react": ^11.2.2
"@types/webpack-env": ^1.16.0
@ -6253,7 +6253,7 @@ __metadata:
"@storybook/client-logger": 6.5.0-alpha.55
"@storybook/components": 6.5.0-alpha.55
"@storybook/core-events": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/theming": 6.5.0-alpha.55
"@types/webpack-env": ^1.16.0
core-js: ^3.8.2
@ -6282,7 +6282,7 @@ __metadata:
"@storybook/client-logger": 6.5.0-alpha.55
"@storybook/components": 6.5.0-alpha.55
"@storybook/core-common": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/node-logger": 6.5.0-alpha.55
"@storybook/store": 6.5.0-alpha.55
"@storybook/theming": 6.5.0-alpha.55
@ -6314,7 +6314,7 @@ __metadata:
"@storybook/components": 6.5.0-alpha.55
"@storybook/core-common": 6.5.0-alpha.55
"@storybook/core-events": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/docs-tools": 6.5.0-alpha.55
"@storybook/mdx1-csf": canary
"@storybook/mdx2-csf": canary
@ -6495,7 +6495,7 @@ __metadata:
"@storybook/addons": 6.5.0-alpha.55
"@storybook/client-logger": 6.5.0-alpha.55
"@storybook/core-events": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/router": 6.5.0-alpha.55
"@types/qs": ^6.9.5
"@types/webpack-env": ^1.16.0
@ -6525,7 +6525,7 @@ __metadata:
"@storybook/client-logger": 6.5.0-alpha.55
"@storybook/components": 6.5.0-alpha.55
"@storybook/core-events": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@types/webpack-env": ^1.16.0
core-js: ^3.8.2
global: ^4.4.0
@ -6549,7 +6549,7 @@ __metadata:
"@storybook/client-logger": 6.5.0-alpha.55
"@storybook/components": 6.5.0-alpha.55
"@storybook/core-events": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@types/webpack-env": ^1.16.0
core-js: ^3.8.2
global: ^4.4.0
@ -6584,7 +6584,7 @@ __metadata:
resolution: "@storybook/addon-storyshots-puppeteer@workspace:addons/storyshots/storyshots-puppeteer"
dependencies:
"@axe-core/puppeteer": ^4.2.0
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/node-logger": 6.5.0-alpha.55
"@types/jest-image-snapshot": ^4.1.3
"@types/puppeteer": ^5.4.0
@ -6615,7 +6615,7 @@ __metadata:
"@storybook/core": 6.5.0-alpha.55
"@storybook/core-client": 6.5.0-alpha.55
"@storybook/core-common": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/react": 6.5.0-alpha.55
"@storybook/vue": 6.5.0-alpha.55
"@storybook/vue3": 6.5.0-alpha.55
@ -6777,7 +6777,7 @@ __metadata:
"@storybook/channels": 6.5.0-alpha.55
"@storybook/client-logger": 6.5.0-alpha.55
"@storybook/core-events": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/router": 6.5.0-alpha.55
"@storybook/theming": 6.5.0-alpha.55
"@types/webpack-env": ^1.16.0
@ -6834,7 +6834,7 @@ __metadata:
"@storybook/core": 6.5.0-alpha.55
"@storybook/core-common": 6.5.0-alpha.55
"@storybook/core-events": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/docs-tools": 6.5.0-alpha.55
"@storybook/node-logger": 6.5.0-alpha.55
"@storybook/semver": ^7.3.2
@ -6907,7 +6907,7 @@ __metadata:
"@storybook/channels": 6.5.0-alpha.55
"@storybook/client-logger": 6.5.0-alpha.55
"@storybook/core-events": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/router": 6.5.0-alpha.55
"@storybook/semver": ^7.3.2
"@storybook/theming": 6.5.0-alpha.55
@ -7192,7 +7192,7 @@ __metadata:
"@storybook/channels": 6.5.0-alpha.55
"@storybook/client-logger": 6.5.0-alpha.55
"@storybook/core-events": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/store": 6.5.0-alpha.55
"@types/qs": ^6.9.5
"@types/webpack-env": ^1.16.0
@ -7248,7 +7248,7 @@ __metadata:
dependencies:
"@babel/types": ^7.12.11
"@mdx-js/mdx": ^1.6.22
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/csf-tools": 6.5.0-alpha.55
"@storybook/node-logger": 6.5.0-alpha.55
core-js: ^3.8.2
@ -7270,7 +7270,7 @@ __metadata:
dependencies:
"@popperjs/core": ^2.6.0
"@storybook/client-logger": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/theming": 6.5.0-alpha.55
"@types/color-convert": ^2.0.0
"@types/overlayscrollbars": ^1.12.0
@ -7329,7 +7329,7 @@ __metadata:
"@storybook/client-api": 6.5.0-alpha.55
"@storybook/client-logger": 6.5.0-alpha.55
"@storybook/core-events": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/preview-web": 6.5.0-alpha.55
"@storybook/store": 6.5.0-alpha.55
"@storybook/ui": 6.5.0-alpha.55
@ -7449,7 +7449,7 @@ __metadata:
"@storybook/core-client": 6.5.0-alpha.55
"@storybook/core-common": 6.5.0-alpha.55
"@storybook/core-events": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/csf-tools": 6.5.0-alpha.55
"@storybook/manager-webpack4": 6.5.0-alpha.55
"@storybook/node-logger": 6.5.0-alpha.55
@ -7537,7 +7537,7 @@ __metadata:
"@babel/preset-env": ^7.12.11
"@babel/traverse": ^7.12.11
"@babel/types": ^7.12.11
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/mdx1-csf": canary
"@storybook/mdx2-csf": canary
"@types/fs-extra": ^9.0.6
@ -7564,6 +7564,15 @@ __metadata:
languageName: node
linkType: hard
"@storybook/csf@npm:0.0.2--canary.7c6c115.0":
version: 0.0.2--canary.7c6c115.0
resolution: "@storybook/csf@npm:0.0.2--canary.7c6c115.0"
dependencies:
lodash: ^4.17.15
checksum: 85a179664d18eeca8462c1b6ff36f9b68b856c9f9c5143aa6f19b17e4cc97bc08ed69921a5287a61d8c90f61366ff6a5ab89930d158402e7c04d07a3ffaad8bb
languageName: node
linkType: hard
"@storybook/csf@npm:0.0.2--canary.87bc651.0":
version: 0.0.2--canary.87bc651.0
resolution: "@storybook/csf@npm:0.0.2--canary.87bc651.0"
@ -7610,7 +7619,7 @@ __metadata:
resolution: "@storybook/docs-tools@workspace:lib/docs-tools"
dependencies:
"@babel/core": ^7.12.10
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/store": 6.5.0-alpha.55
core-js: ^3.8.2
doctrine: ^3.0.0
@ -7733,7 +7742,7 @@ __metadata:
"@storybook/addons": 6.5.0-alpha.55
"@storybook/core": 6.5.0-alpha.55
"@storybook/core-common": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/docs-tools": 6.5.0-alpha.55
"@storybook/preview-web": 6.5.0-alpha.55
"@storybook/store": 6.5.0-alpha.55
@ -8001,7 +8010,7 @@ __metadata:
"@storybook/addons": 6.5.0-alpha.55
"@storybook/core": 6.5.0-alpha.55
"@storybook/core-common": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/store": 6.5.0-alpha.55
"@types/node": ^14.14.20 || ^16.0.0
"@types/webpack-env": ^1.16.0
@ -8063,7 +8072,7 @@ __metadata:
"@storybook/channel-postmessage": 6.5.0-alpha.55
"@storybook/client-logger": 6.5.0-alpha.55
"@storybook/core-events": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/store": 6.5.0-alpha.55
ansi-to-html: ^0.6.11
core-js: ^3.8.2
@ -8110,7 +8119,7 @@ __metadata:
"@storybook/client-logger": 6.5.0-alpha.55
"@storybook/core": 6.5.0-alpha.55
"@storybook/core-common": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/docs-tools": 6.5.0-alpha.55
"@storybook/node-logger": 6.5.0-alpha.55
"@storybook/react-docgen-typescript-plugin": 1.0.2-canary.6.9d540b91e815f8fc2f8829189deb00553559ff63.0
@ -8479,7 +8488,7 @@ __metadata:
"@storybook/client-api": 6.5.0-alpha.55
"@storybook/core": 6.5.0-alpha.55
"@storybook/core-common": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/node-logger": 6.5.0-alpha.55
"@storybook/preview-web": 6.5.0-alpha.55
"@storybook/store": 6.5.0-alpha.55
@ -8509,7 +8518,7 @@ __metadata:
dependencies:
"@storybook/addons": 6.5.0-alpha.55
"@storybook/client-logger": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
core-js: ^3.8.2
estraverse: ^5.2.0
global: ^4.4.0
@ -8530,7 +8539,7 @@ __metadata:
"@storybook/addons": 6.5.0-alpha.55
"@storybook/client-logger": 6.5.0-alpha.55
"@storybook/core-events": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
core-js: ^3.8.2
fast-deep-equal: ^3.1.3
global: ^4.4.0
@ -8556,7 +8565,7 @@ __metadata:
"@storybook/client-logger": 6.5.0-alpha.55
"@storybook/core": 6.5.0-alpha.55
"@storybook/core-common": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/docs-tools": 6.5.0-alpha.55
"@storybook/node-logger": 6.5.0-alpha.55
"@storybook/store": 6.5.0-alpha.55
@ -8721,7 +8730,7 @@ __metadata:
"@storybook/addons": 6.5.0-alpha.55
"@storybook/core": 6.5.0-alpha.55
"@storybook/core-common": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/docs-tools": 6.5.0-alpha.55
"@storybook/store": 6.5.0-alpha.55
"@types/node": ^14.14.20 || ^16.0.0
@ -8760,7 +8769,7 @@ __metadata:
"@storybook/client-logger": 6.5.0-alpha.55
"@storybook/core": 6.5.0-alpha.55
"@storybook/core-common": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/docs-tools": 6.5.0-alpha.55
"@storybook/store": 6.5.0-alpha.55
"@types/node": ^14.14.20 || ^16.0.0
@ -8805,7 +8814,7 @@ __metadata:
"@storybook/client-logger": 6.5.0-alpha.55
"@storybook/core": 6.5.0-alpha.55
"@storybook/core-common": 6.5.0-alpha.55
"@storybook/csf": 0.0.2--canary.507502b.0
"@storybook/csf": 0.0.2--canary.7c6c115.0
"@storybook/docs-tools": 6.5.0-alpha.55
"@storybook/preview-web": 6.5.0-alpha.55
"@storybook/store": 6.5.0-alpha.55