diff --git a/addon/src/hooks/useTokenTabs.ts b/addon/src/hooks/useTokenTabs.ts index cfa6a5f..7d857ad 100644 --- a/addon/src/hooks/useTokenTabs.ts +++ b/addon/src/hooks/useTokenTabs.ts @@ -39,18 +39,25 @@ export function useTokenTabs(config?: Config) { new Set(categories.map((category) => category?.name)) ); - return categoryNames.map((name) => ({ + let tabs = categoryNames.map((name) => ({ label: name, categories: categories.filter( (category) => category?.name === name ) as Category[], })); + + if ((config?.tabs ?? []).length !== 0) { + tabs = tabs.filter(tab => config.tabs.includes(tab.label)) + } + + return tabs; }, [ cssCategories, lessCategories, scssCategories, svgIconCategories, imageCategories, + config ]); useEffect(() => { diff --git a/addon/src/stories/Button.stories.ts b/addon/src/stories/Button.stories.ts index 35c969a..ecba43d 100644 --- a/addon/src/stories/Button.stories.ts +++ b/addon/src/stories/Button.stories.ts @@ -25,5 +25,14 @@ export const Primary: Story = { args: { primary: true, label: "Button", - }, + }, }; + +export const ColorsOnly: Story = { + args: { ...Primary.args }, + parameters: { + designToken: { + tabs: ['Colors'] + } + } +} \ No newline at end of file diff --git a/addon/src/types/config.types.ts b/addon/src/types/config.types.ts index a3577fa..f02cbbf 100644 --- a/addon/src/types/config.types.ts +++ b/addon/src/types/config.types.ts @@ -6,6 +6,7 @@ export interface Config { styleInjection?: string; pageSize?: number; presenters?: PresenterMapType; + tabs?: string[]; } export interface File {