@storybook/addon-themes 0.0.0-pr-23611-sha-cb880262 → 0.0.0-pr-23724-sha-4dae46aa
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/manager.js +1 -1
- package/dist/manager.mjs +3 -2
- package/package.json +8 -8
package/dist/manager.js
CHANGED
@@ -1 +1 @@
|
|
1
|
-
"use strict";var __create=Object.create;var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __getProtoOf=Object.getPrototypeOf,__hasOwnProp=Object.prototype.hasOwnProperty;var __copyProps=(to,from,except,desc)=>{if(from&&typeof from=="object"||typeof from=="function")for(let key of __getOwnPropNames(from))!__hasOwnProp.call(to,key)&&key!==except&&__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable});return to};var __toESM=(mod,isNodeMode,target)=>(target=mod!=null?__create(__getProtoOf(mod)):{},__copyProps(isNodeMode||!mod||!mod.__esModule?__defProp(target,"default",{value:mod,enumerable:!0}):target,mod));var import_manager_api2=require("@storybook/manager-api");var PARAM_KEY="themes",ADDON_ID=`storybook/${PARAM_KEY}}`;var THEME_SWITCHER_ID=`${ADDON_ID}/theme-switcher`,DEFAULT_ADDON_STATE={themesList:[],themeDefault:void 0},DEFAULT_THEME_PARAMETERS={},THEMING_EVENTS={REGISTER_THEMES:`${ADDON_ID}/REGISTER_THEMES`};var import_react=__toESM(require("react")),import_manager_api=require("@storybook/manager-api"),import_theming=require("@storybook/theming"),import_components=require("@storybook/components");var IconButtonLabel=import_theming.styled.div(({theme})=>({fontSize:theme.typography.size.s2-1,marginLeft:10})),hasMultipleThemes=themesList=>themesList.length>1,ThemeSwitcher=()=>{let{themeOverride}=(0,import_manager_api.useParameter)(PARAM_KEY,DEFAULT_THEME_PARAMETERS),[{theme:selected},updateGlobals]=(0,import_manager_api.useGlobals)(),[{themesList,themeDefault},updateState]=(0,import_manager_api.useAddonState)(THEME_SWITCHER_ID,DEFAULT_ADDON_STATE);(0,import_manager_api.useChannel)({[THEMING_EVENTS.REGISTER_THEMES]:({themes,defaultTheme})=>{updateState(state=>({...state,themesList:themes,themeDefault:defaultTheme}))}});let label=(0,import_react.useMemo)(()=>{if(themeOverride)return import_react.default.createElement(import_react.default.Fragment,null,"Story override");let themeName=selected||themeDefault;return themeName&&import_react.default.createElement(import_react.default.Fragment,null,`${themeName} theme`)},[themeOverride,themeDefault,selected]);return hasMultipleThemes(themesList)?import_react.default.createElement(import_react.Fragment,null,import_react.default.createElement(import_components.WithTooltip,{placement:"top",trigger:"click",closeOnClick:!0,tooltip:({onHide})=>import_react.default.createElement(import_components.TooltipLinkList,{links:themesList.map(theme=>({id:theme,title:theme,active:selected===theme,onClick:()=>{updateGlobals({theme}),onHide()}}))})},import_react.default.createElement(import_components.IconButton,{key:THEME_SWITCHER_ID,active:!themeOverride,title:"Theme"},import_react.default.createElement(
|
1
|
+
"use strict";var __create=Object.create;var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __getProtoOf=Object.getPrototypeOf,__hasOwnProp=Object.prototype.hasOwnProperty;var __copyProps=(to,from,except,desc)=>{if(from&&typeof from=="object"||typeof from=="function")for(let key of __getOwnPropNames(from))!__hasOwnProp.call(to,key)&&key!==except&&__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable});return to};var __toESM=(mod,isNodeMode,target)=>(target=mod!=null?__create(__getProtoOf(mod)):{},__copyProps(isNodeMode||!mod||!mod.__esModule?__defProp(target,"default",{value:mod,enumerable:!0}):target,mod));var import_manager_api2=require("@storybook/manager-api");var PARAM_KEY="themes",ADDON_ID=`storybook/${PARAM_KEY}}`;var THEME_SWITCHER_ID=`${ADDON_ID}/theme-switcher`,DEFAULT_ADDON_STATE={themesList:[],themeDefault:void 0},DEFAULT_THEME_PARAMETERS={},THEMING_EVENTS={REGISTER_THEMES:`${ADDON_ID}/REGISTER_THEMES`};var import_react=__toESM(require("react")),import_manager_api=require("@storybook/manager-api"),import_theming=require("@storybook/theming"),import_components=require("@storybook/components"),import_experimental=require("@storybook/components/experimental");var IconButtonLabel=import_theming.styled.div(({theme})=>({fontSize:theme.typography.size.s2-1,marginLeft:10})),hasMultipleThemes=themesList=>themesList.length>1,ThemeSwitcher=()=>{let{themeOverride}=(0,import_manager_api.useParameter)(PARAM_KEY,DEFAULT_THEME_PARAMETERS),[{theme:selected},updateGlobals]=(0,import_manager_api.useGlobals)(),[{themesList,themeDefault},updateState]=(0,import_manager_api.useAddonState)(THEME_SWITCHER_ID,DEFAULT_ADDON_STATE);(0,import_manager_api.useChannel)({[THEMING_EVENTS.REGISTER_THEMES]:({themes,defaultTheme})=>{updateState(state=>({...state,themesList:themes,themeDefault:defaultTheme}))}});let label=(0,import_react.useMemo)(()=>{if(themeOverride)return import_react.default.createElement(import_react.default.Fragment,null,"Story override");let themeName=selected||themeDefault;return themeName&&import_react.default.createElement(import_react.default.Fragment,null,`${themeName} theme`)},[themeOverride,themeDefault,selected]);return hasMultipleThemes(themesList)?import_react.default.createElement(import_react.Fragment,null,import_react.default.createElement(import_components.WithTooltip,{placement:"top",trigger:"click",closeOnClick:!0,tooltip:({onHide})=>import_react.default.createElement(import_components.TooltipLinkList,{links:themesList.map(theme=>({id:theme,title:theme,active:selected===theme,onClick:()=>{updateGlobals({theme}),onHide()}}))})},import_react.default.createElement(import_components.IconButton,{key:THEME_SWITCHER_ID,active:!themeOverride,title:"Theme"},import_react.default.createElement(import_experimental.Icon.PaintBrush,null),label&&import_react.default.createElement(IconButtonLabel,null,label)))):null};import_manager_api2.addons.register(ADDON_ID,()=>{import_manager_api2.addons.add(THEME_SWITCHER_ID,{title:"Themes",type:import_manager_api2.types.TOOL,match:({viewMode})=>!!(viewMode&&viewMode.match(/^(story|docs)$/)),render:ThemeSwitcher,paramKey:PARAM_KEY})});
|
package/dist/manager.mjs
CHANGED
@@ -2,6 +2,7 @@ import { ADDON_ID, THEME_SWITCHER_ID, PARAM_KEY, DEFAULT_THEME_PARAMETERS, DEFAU
|
|
2
2
|
import { addons, types, useParameter, useGlobals, useAddonState, useChannel } from '@storybook/manager-api';
|
3
3
|
import React, { useMemo, Fragment } from 'react';
|
4
4
|
import { styled } from '@storybook/theming';
|
5
|
-
import { WithTooltip, TooltipLinkList, IconButton
|
5
|
+
import { WithTooltip, TooltipLinkList, IconButton } from '@storybook/components';
|
6
|
+
import { Icon } from '@storybook/components/experimental';
|
6
7
|
|
7
|
-
var IconButtonLabel=styled.div(({theme})=>({fontSize:theme.typography.size.s2-1,marginLeft:10})),hasMultipleThemes=themesList=>themesList.length>1,ThemeSwitcher=()=>{let{themeOverride}=useParameter(PARAM_KEY,DEFAULT_THEME_PARAMETERS),[{theme:selected},updateGlobals]=useGlobals(),[{themesList,themeDefault},updateState]=useAddonState(THEME_SWITCHER_ID,DEFAULT_ADDON_STATE);useChannel({[THEMING_EVENTS.REGISTER_THEMES]:({themes,defaultTheme})=>{updateState(state=>({...state,themesList:themes,themeDefault:defaultTheme}));}});let label=useMemo(()=>{if(themeOverride)return React.createElement(React.Fragment,null,"Story override");let themeName=selected||themeDefault;return themeName&&React.createElement(React.Fragment,null,`${themeName} theme`)},[themeOverride,themeDefault,selected]);return hasMultipleThemes(themesList)?React.createElement(Fragment,null,React.createElement(WithTooltip,{placement:"top",trigger:"click",closeOnClick:!0,tooltip:({onHide})=>React.createElement(TooltipLinkList,{links:themesList.map(theme=>({id:theme,title:theme,active:selected===theme,onClick:()=>{updateGlobals({theme}),onHide();}}))})},React.createElement(IconButton,{key:THEME_SWITCHER_ID,active:!themeOverride,title:"Theme"},React.createElement(
|
8
|
+
var IconButtonLabel=styled.div(({theme})=>({fontSize:theme.typography.size.s2-1,marginLeft:10})),hasMultipleThemes=themesList=>themesList.length>1,ThemeSwitcher=()=>{let{themeOverride}=useParameter(PARAM_KEY,DEFAULT_THEME_PARAMETERS),[{theme:selected},updateGlobals]=useGlobals(),[{themesList,themeDefault},updateState]=useAddonState(THEME_SWITCHER_ID,DEFAULT_ADDON_STATE);useChannel({[THEMING_EVENTS.REGISTER_THEMES]:({themes,defaultTheme})=>{updateState(state=>({...state,themesList:themes,themeDefault:defaultTheme}));}});let label=useMemo(()=>{if(themeOverride)return React.createElement(React.Fragment,null,"Story override");let themeName=selected||themeDefault;return themeName&&React.createElement(React.Fragment,null,`${themeName} theme`)},[themeOverride,themeDefault,selected]);return hasMultipleThemes(themesList)?React.createElement(Fragment,null,React.createElement(WithTooltip,{placement:"top",trigger:"click",closeOnClick:!0,tooltip:({onHide})=>React.createElement(TooltipLinkList,{links:themesList.map(theme=>({id:theme,title:theme,active:selected===theme,onClick:()=>{updateGlobals({theme}),onHide();}}))})},React.createElement(IconButton,{key:THEME_SWITCHER_ID,active:!themeOverride,title:"Theme"},React.createElement(Icon.PaintBrush,null),label&&React.createElement(IconButtonLabel,null,label)))):null};addons.register(ADDON_ID,()=>{addons.add(THEME_SWITCHER_ID,{title:"Themes",type:types.TOOL,match:({viewMode})=>!!(viewMode&&viewMode.match(/^(story|docs)$/)),render:ThemeSwitcher,paramKey:PARAM_KEY});});
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@storybook/addon-themes",
|
3
|
-
"version": "0.0.0-pr-
|
3
|
+
"version": "0.0.0-pr-23724-sha-4dae46aa",
|
4
4
|
"description": "Switch between multiple themes for you components in Storybook",
|
5
5
|
"keywords": [
|
6
6
|
"css",
|
@@ -72,13 +72,13 @@
|
|
72
72
|
"prep": "../../../scripts/prepare/bundle.ts"
|
73
73
|
},
|
74
74
|
"dependencies": {
|
75
|
-
"@storybook/client-logger": "0.0.0-pr-
|
76
|
-
"@storybook/components": "0.0.0-pr-
|
77
|
-
"@storybook/core-events": "0.0.0-pr-
|
78
|
-
"@storybook/manager-api": "0.0.0-pr-
|
79
|
-
"@storybook/preview-api": "0.0.0-pr-
|
80
|
-
"@storybook/theming": "0.0.0-pr-
|
81
|
-
"@storybook/types": "0.0.0-pr-
|
75
|
+
"@storybook/client-logger": "0.0.0-pr-23724-sha-4dae46aa",
|
76
|
+
"@storybook/components": "0.0.0-pr-23724-sha-4dae46aa",
|
77
|
+
"@storybook/core-events": "0.0.0-pr-23724-sha-4dae46aa",
|
78
|
+
"@storybook/manager-api": "0.0.0-pr-23724-sha-4dae46aa",
|
79
|
+
"@storybook/preview-api": "0.0.0-pr-23724-sha-4dae46aa",
|
80
|
+
"@storybook/theming": "0.0.0-pr-23724-sha-4dae46aa",
|
81
|
+
"@storybook/types": "0.0.0-pr-23724-sha-4dae46aa",
|
82
82
|
"ts-dedent": "^2.0.0"
|
83
83
|
},
|
84
84
|
"devDependencies": {
|