Socket
Socket
Sign inDemoInstall

@storybook/addon-themes

Package Overview
Dependencies
Maintainers
11
Versions
567
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@storybook/addon-themes - npm Package Compare versions

Comparing version 0.0.0-pr-28768-sha-f4bf860e to 0.0.0-pr-28797-sha-2c38805d

1

dist/index.d.ts

@@ -34,3 +34,2 @@ import { Renderer, DecoratorFunction, StoryContext } from 'storybook/internal/types';

/**
*
* @param StoryContext

@@ -37,0 +36,0 @@ * @returns The global theme name set for your stories

2

dist/manager.js
import { useParameter, useGlobals, addons, useAddonState, useChannel, types } from 'storybook/internal/manager-api';
import React from 'react';
import { IconButton, WithTooltip, TooltipLinkList } from 'storybook/internal/components';
import { styled } from 'storybook/internal/theming';
import { IconButton, WithTooltip, TooltipLinkList } from 'storybook/internal/components';
import { PaintBrushIcon } from '@storybook/icons';
var PARAM_KEY="themes",ADDON_ID=`storybook/${PARAM_KEY}`,GLOBAL_KEY="theme",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 IconButtonLabel=styled.div(({theme})=>({fontSize:theme.typography.size.s2-1})),hasMultipleThemes=themesList=>themesList.length>1,hasTwoThemes=themesList=>themesList.length===2,ThemeSwitcher=React.memo(function(){let{themeOverride,disable}=useParameter(PARAM_KEY,DEFAULT_THEME_PARAMETERS),[{theme:selected},updateGlobals,storyGlobals]=useGlobals(),fromLast=addons.getChannel().last(THEMING_EVENTS.REGISTER_THEMES),initializeThemeState=Object.assign({},DEFAULT_ADDON_STATE,{themesList:fromLast?.[0]?.themes||[],themeDefault:fromLast?.[0]?.defaultTheme||""}),[{themesList,themeDefault},updateState]=useAddonState(THEME_SWITCHER_ID,initializeThemeState),isLocked=GLOBAL_KEY in storyGlobals||!!themeOverride;useChannel({[THEMING_EVENTS.REGISTER_THEMES]:({themes,defaultTheme})=>{updateState(state=>({...state,themesList:themes,themeDefault:defaultTheme}));}});let themeName=selected||themeDefault,label="";if(isLocked?label="Story override":themeName&&(label=`${themeName} theme`),disable)return null;if(hasTwoThemes(themesList)){let currentTheme=selected||themeDefault,alternateTheme=themesList.find(theme=>theme!==currentTheme);return React.createElement(IconButton,{disabled:isLocked,key:THEME_SWITCHER_ID,active:!themeOverride,title:"Theme",onClick:()=>{updateGlobals({theme:alternateTheme});}},React.createElement(PaintBrushIcon,null),label?React.createElement(IconButtonLabel,null,label):null)}return hasMultipleThemes(themesList)?React.createElement(WithTooltip,{placement:"top",trigger:"click",closeOnOutsideClick:!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",disabled:isLocked},React.createElement(PaintBrushIcon,null),label&&React.createElement(IconButtonLabel,null,label))):null});addons.register(ADDON_ID,()=>{addons.add(THEME_SWITCHER_ID,{title:"Themes",type:types.TOOL,match:({viewMode,tabId})=>!!(viewMode&&viewMode.match(/^(story|docs)$/))&&!tabId,render:ThemeSwitcher,paramKey:PARAM_KEY});});
{
"name": "@storybook/addon-themes",
"version": "0.0.0-pr-28768-sha-f4bf860e",
"version": "0.0.0-pr-28797-sha-2c38805d",
"description": "Switch between multiple themes for you components in Storybook",

@@ -32,5 +32,5 @@ "keywords": [

"types": "./dist/index.d.ts",
"node": "./dist/index.js",
"import": "./dist/index.mjs",
"require": "./dist/index.js"
"require": "./dist/index.js",
"node": "./dist/index.js"
},

@@ -57,4 +57,4 @@ "./preview": {

"scripts": {
"check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
"prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/addon-bundle.ts"
"check": "jiti ../../../scripts/prepare/check.ts",
"prep": "jiti ../../../scripts/prepare/addon-bundle.ts"
},

@@ -69,3 +69,3 @@ "dependencies": {

"peerDependencies": {
"storybook": "^0.0.0-pr-28768-sha-f4bf860e"
"storybook": "^0.0.0-pr-28797-sha-2c38805d"
},

@@ -72,0 +72,0 @@ "publishConfig": {

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc