Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
feat: include/exclude controls as function
  • Loading branch information
atanasster committed May 17, 2021
1 parent 3768ca2 commit 8d57d1a
Show file tree
Hide file tree
Showing 4 changed files with 22 additions and 4 deletions.
10 changes: 7 additions & 3 deletions core/core/src/common.ts
@@ -1,8 +1,12 @@
import { ElementType } from 'react';
import { deepMerge } from './deepMerge';
import { StoryRenderFn } from './utility';
import { ComponentControls } from './controls';
import { ComponentControls, ComponentControl } from './controls';
import { PropType } from './components';

export type IncludeFn = (
control: { name: string; prop?: PropType } & ComponentControl,
) => boolean;
export interface SmartControls {
/**
* whether to generate "smart" controls for a story
Expand All @@ -11,12 +15,12 @@ export interface SmartControls {
/**
* include props only
*/
include?: string[];
include?: string[] | IncludeFn;

/**
* exclude props only
*/
exclude?: string[];
exclude?: string[] | IncludeFn;
}

/**
Expand Down
10 changes: 10 additions & 0 deletions core/core/src/controls-utils.ts
Expand Up @@ -440,9 +440,19 @@ export const getStoryControls = (
if (Array.isArray(include) && !include.includes(key)) {
return false;
}
if (typeof include === 'function') {
const prop = component.info?.props[key];
return include({ name: key, ...newControls[key], prop });
}

if (Array.isArray(exclude) && exclude.includes(key)) {
return false;
}

if (typeof exclude === 'function') {
const prop = component.info?.props[key];
return !exclude({ name: key, ...newControls[key], prop });
}
if (usedProps && !usedProps.includes(key)) {
return false;
}
Expand Down
Expand Up @@ -26,6 +26,9 @@ export default {
},
},
description: `This example demonstrates documenting a hypothetical Button component that supports variants, icons, text, and padding`,
smartControls: {
include: p => p.prop?.parentName === 'VariantButtonProps',
},
} as Document;

export const overview: Example<VariantButtonProps> = props => (
Expand Down
3 changes: 2 additions & 1 deletion examples/stories/src/stories/VariantButton/VariantButton.tsx
Expand Up @@ -108,7 +108,8 @@ export interface VariantButtonProps {
/**
* Button with variants
*/
export const VariantButton: FC<VariantButtonProps> = ({
export const VariantButton: FC<VariantButtonProps &
React.HTMLProps<HTMLButtonElement>> = ({
text,
fontSize = 18,
iconSize = 'small',
Expand Down

0 comments on commit 8d57d1a

Please sign in to comment.