@storybook/addon-themes
Advanced tools
Comparing version 0.0.0-pr-30567-sha-f5452a43 to 0.0.0-pr-30600-sha-1dd6fce2
import * as core_dist_types from 'storybook/internal/types'; | ||
import * as core_dist_csf from 'storybook/internal/csf'; | ||
import { Renderer, DecoratorFunction, StoryContext } from 'storybook/internal/types'; | ||
@@ -68,4 +67,4 @@ | ||
declare const _default: () => core_dist_types.ProjectAnnotations<core_dist_csf.Renderer>; | ||
declare const _default: () => core_dist_types.ProjectAnnotations<core_dist_types.Renderer>; | ||
export { ClassNameStrategyConfiguration, DataAttributeStrategyConfiguration, helpers as DecoratorHelpers, ProviderStrategyConfiguration, ThemesGlobals, ThemesParameters$1 as ThemesParameters, _default as default, withThemeByClassName, withThemeByDataAttribute, withThemeFromJSXProvider }; |
@@ -17,8 +17,8 @@ 'use strict'; | ||
- const { themeOverride } = context.parameters.themes ?? {}; | ||
`),context?context.parameters[PARAM_KEY]??DEFAULT_THEME_PARAMETERS:previewApi.useParameter(PARAM_KEY,DEFAULT_THEME_PARAMETERS)}function initializeThemeState(themeNames,defaultTheme){previewApi.addons.getChannel().emit(THEMING_EVENTS.REGISTER_THEMES,{defaultTheme,themes:themeNames});}var DEFAULT_ELEMENT_SELECTOR="html",classStringToArray=classString=>classString.split(" ").filter(Boolean),withThemeByClassName=({themes,defaultTheme,parentSelector=DEFAULT_ELEMENT_SELECTOR})=>(initializeThemeState(Object.keys(themes),defaultTheme),(storyFn,context)=>{let{themeOverride}=context.parameters[PARAM_KEY]??{},selected=pluckThemeFromContext(context);return previewApi.useEffect(()=>{let selectedThemeName=themeOverride||selected||defaultTheme,parentElement=document.querySelector(parentSelector);if(!parentElement)return;Object.entries(themes).filter(([themeName])=>themeName!==selectedThemeName).forEach(([themeName,className])=>{let classes=classStringToArray(className);classes.length>0&&parentElement.classList.remove(...classes);});let newThemeClasses=classStringToArray(themes[selectedThemeName]);newThemeClasses.length>0&&parentElement.classList.add(...newThemeClasses);},[themeOverride,selected]),storyFn()});var DEFAULT_ELEMENT_SELECTOR2="html",DEFAULT_DATA_ATTRIBUTE="data-theme",withThemeByDataAttribute=({themes,defaultTheme,parentSelector=DEFAULT_ELEMENT_SELECTOR2,attributeName=DEFAULT_DATA_ATTRIBUTE})=>(initializeThemeState(Object.keys(themes),defaultTheme),(storyFn,context)=>{let{themeOverride}=context.parameters[PARAM_KEY]??{},selected=pluckThemeFromContext(context);return previewApi.useEffect(()=>{let parentElement=document.querySelector(parentSelector),themeKey=themeOverride||selected||defaultTheme;parentElement&&parentElement.setAttribute(attributeName,themes[themeKey]);},[themeOverride,selected]),storyFn()});var pluckThemeFromKeyPairTuple=([_,themeConfig])=>themeConfig,withThemeFromJSXProvider=({Provider,GlobalStyles,defaultTheme,themes={}})=>{let themeNames=Object.keys(themes),initialTheme=defaultTheme||themeNames[0];return initializeThemeState(themeNames,initialTheme),(storyFn,context)=>{let{themeOverride}=context.parameters[PARAM_KEY]??{},selected=pluckThemeFromContext(context),theme=previewApi.useMemo(()=>{let selectedThemeName=themeOverride||selected||initialTheme,pairs=Object.entries(themes);return pairs.length===1?pluckThemeFromKeyPairTuple(pairs[0]):themes[selectedThemeName]},[selected,themeOverride]);return Provider?React__default.default.createElement(Provider,{theme},GlobalStyles&&React__default.default.createElement(GlobalStyles,null),storyFn()):React__default.default.createElement(React__default.default.Fragment,null,GlobalStyles&&React__default.default.createElement(GlobalStyles,null),storyFn())}};var src_default=()=>previewApi.definePreview(preview_exports); | ||
`),context?context.parameters[PARAM_KEY]??DEFAULT_THEME_PARAMETERS:previewApi.useParameter(PARAM_KEY,DEFAULT_THEME_PARAMETERS)}function initializeThemeState(themeNames,defaultTheme){previewApi.addons.getChannel().emit(THEMING_EVENTS.REGISTER_THEMES,{defaultTheme,themes:themeNames});}var DEFAULT_ELEMENT_SELECTOR="html",classStringToArray=classString=>classString.split(" ").filter(Boolean),withThemeByClassName=({themes,defaultTheme,parentSelector=DEFAULT_ELEMENT_SELECTOR})=>(initializeThemeState(Object.keys(themes),defaultTheme),(storyFn,context)=>{let{themeOverride}=context.parameters[PARAM_KEY]??{},selected=pluckThemeFromContext(context);return previewApi.useEffect(()=>{let selectedThemeName=themeOverride||selected||defaultTheme,parentElement=document.querySelector(parentSelector);if(!parentElement)return;Object.entries(themes).filter(([themeName])=>themeName!==selectedThemeName).forEach(([themeName,className])=>{let classes=classStringToArray(className);classes.length>0&&parentElement.classList.remove(...classes);});let newThemeClasses=classStringToArray(themes[selectedThemeName]);newThemeClasses.length>0&&parentElement.classList.add(...newThemeClasses);},[themeOverride,selected]),storyFn()});var DEFAULT_ELEMENT_SELECTOR2="html",DEFAULT_DATA_ATTRIBUTE="data-theme",withThemeByDataAttribute=({themes,defaultTheme,parentSelector=DEFAULT_ELEMENT_SELECTOR2,attributeName=DEFAULT_DATA_ATTRIBUTE})=>(initializeThemeState(Object.keys(themes),defaultTheme),(storyFn,context)=>{let{themeOverride}=context.parameters[PARAM_KEY]??{},selected=pluckThemeFromContext(context);return previewApi.useEffect(()=>{let parentElement=document.querySelector(parentSelector),themeKey=themeOverride||selected||defaultTheme;parentElement&&parentElement.setAttribute(attributeName,themes[themeKey]);},[themeOverride,selected]),storyFn()});var pluckThemeFromKeyPairTuple=([_,themeConfig])=>themeConfig,withThemeFromJSXProvider=({Provider,GlobalStyles,defaultTheme,themes={}})=>{let themeNames=Object.keys(themes),initialTheme=defaultTheme||themeNames[0];return initializeThemeState(themeNames,initialTheme),(storyFn,context)=>{let{themeOverride}=context.parameters[PARAM_KEY]??{},selected=pluckThemeFromContext(context),theme=previewApi.useMemo(()=>{let selectedThemeName=themeOverride||selected||initialTheme,pairs=Object.entries(themes);return pairs.length===1?pluckThemeFromKeyPairTuple(pairs[0]):themes[selectedThemeName]},[selected,themeOverride]);return Provider?React__default.default.createElement(Provider,{theme},GlobalStyles&&React__default.default.createElement(GlobalStyles,null),storyFn()):React__default.default.createElement(React__default.default.Fragment,null,GlobalStyles&&React__default.default.createElement(GlobalStyles,null),storyFn())}};var index_default=()=>previewApi.definePreview(preview_exports); | ||
exports.DecoratorHelpers = helpers_exports; | ||
exports.default = src_default; | ||
exports.default = index_default; | ||
exports.withThemeByClassName = withThemeByClassName; | ||
exports.withThemeByDataAttribute = withThemeByDataAttribute; | ||
exports.withThemeFromJSXProvider = withThemeFromJSXProvider; |
{ | ||
"name": "@storybook/addon-themes", | ||
"version": "0.0.0-pr-30567-sha-f5452a43", | ||
"version": "0.0.0-pr-30600-sha-1dd6fce2", | ||
"description": "Switch between multiple themes for you components in Storybook", | ||
@@ -76,3 +76,3 @@ "keywords": [ | ||
"peerDependencies": { | ||
"storybook": "^0.0.0-pr-30567-sha-f5452a43" | ||
"storybook": "^0.0.0-pr-30600-sha-1dd6fce2" | ||
}, | ||
@@ -79,0 +79,0 @@ "publishConfig": { |
Sorry, the diff of this file is not supported yet
20224
158