@carbon/storybook-addon-theme 1.0.0 → 2.0.0-rc.0

package/README.md

@@ -8,10 +8,13 @@ Components!
 - React
 - Vue
 
+No reason to suspect others are not supported, but have not been tested. If you use with another framework then please post an update to the README.md.
+
 ## Install
 
 ```sh
-npm install @carbon/storybook-addon-theme
+npm install --save-dev @carbon/storybook-addon-theme
+yarn instsall --dev @carbon/storybook-addon-theme
 ```
 
 ## Requirements
@@ -35,114 +38,106 @@ and
 
 ```js
 module.exports = {
-  addons: ['@carbon/storybook-addon-theme/register'],
+  // other addons...
+  addons: ['@carbon/storybook-addon-theme/preset.js'],
 };
 ```
 
-Use with a feature flag switch is possible if you construct the addons array.
+### Global Decorator
+
+`.storybook/preview.js`:
 
 ```js
-const addons = [
-  /* other addons */
-];
+import { withCarbonTheme } from '@carbon/storybook-addon-theme/withCarbonTheme';
+import { PARAM_KEY as CARBON_THEME_PARAM_KEY, CARBON_THEMES } from '@carbon/storybook-addon-theme/constants';
 
-if (process.env.CARBON_REACT_STORYBOOK_USE_CUSTOM_PROPERTIES === 'true') {
-  addons.push('@carbon/storybook-addon-theme/register');
-}
+const decorators = [
+  /// other decorators...
+  withCarbonTheme
+];
 
-module.exports = {
-  addons,
-  stories: ['../src/**/*-story.js', '../src/**/*.stories.mdx'],
+const globals = {
+  // other globals...
+  // default value of the theme selector
+  [CARBON_THEME_PARAM_KEY]: CARBON_THEMES.g10,
 };
+
+export { decorators, globals }
 ```
 
-### Global Decorator
+## SCSS
 
-`.storybook/preview.js`:
+`.storybook/index.scss`
 
-```js
-import { withCarbonTheme } from '@carbon/storybook-addon-theme'; // for React
-// import { withCarbonTheme } from '@carbon/storybook-addon-theme/vue'; // for Vue
-// for Angular (not yet supported)
-// .
-// for all (including story decorators)
-import index from './index.scss';
-// .
-addDecorator(withCarbonTheme);
-// .
-```
+### Carbon 11
 
-```js
-// Adding the decorator
-const decorators = [withCarbonTheme];
-const parameters = {
-  carbonTheme: {
-    theme: 'g10',
-  },
-};
-export { decorators, parameters };
-```
+```scss
+@use '@carbon/styles' as styles;
+@use '@carbon/styles/scss/theme' as *;
 
-```js
-// Older storybook versions
-addParameters({
-  // optional
-  carbonTheme: {
-    theme: 'g10', // optional default carbon theme
-    themes: ['g10', 'g90'], // optional carbonTheme filter
-  },
-});
-```
+[storybook-carbon-theme] {
+  @include styles.theme(styles.$white);
 
-### Story decorator
+  /* make sure background and color are set if theme in use */
+  background-color: $background;
+  color: $text-primary;
+}
 
-```js
-import { withCarbonTheme } from '@carbon/storybook-addon-theme'; // for React
-// import { withCarbonTheme } from '@carbon/storybook-addon-theme/vue'; // for Vue
-// for Angular
-// .
-// .
-// .
-storiesOf('Component', module)
-  .addDecorator(withCarbonTheme)
-  .add(() => story, {
-    carbonTheme: {
-      // optional
-      theme: 'g10', // optional default carbon theme
-      themes: ['g10', 'g90'], // optional carbonTheme filter (additive to global)
-    },
-  });
+[storybook-carbon-theme='g10'],
+.sb--use-carbon-theme-g10 {
+  @include styles.theme(styles.$g10);
+}
+
+[storybook-carbon-theme='g90'],
+.sb--use-carbon-theme-g90 {
+  @include styles.theme(styles.$g90);
+}
+
+[storybook-carbon-theme='g100'],
+.sb--use-carbon-theme-g100 {
+  @include styles.theme(styles.$g100);
+}
 ```
 
-## SCSS
+### Carbon 10
 
-`.storybook/index.scss`
+```SCSS
+// Must happen before styles are loaded
+$feature-flags: (
+  ui-shell: true,
+  grid-columns-16: true,
+  enable-css-custom-properties: true
+);
 
-```scss
-@import '@carbon/themes/scss/themes';
+@import "carbon-components/scss/globals/scss/styles";
+@import "@carbon/themes/scss/themes";
+
+[storybook-carbon-theme] {
+  background: $ui-background;
+  color: $ui-01;
 
-:root {
   @include carbon--theme(
     $theme: $carbon--theme--white,
     $emit-custom-properties: true
   );
 }
 
-:root[storybook-carbon-theme='g10'] {
+[storybook-carbon-theme="g10"] {
   @include carbon--theme(
     $theme: $carbon--theme--g10,
     $emit-custom-properties: true
   );
 }
 
-:root[storybook-carbon-theme='g90'] {
+[storybook-carbon-theme="g90"] {
+  z-index: 90;
   @include carbon--theme(
     $theme: $carbon--theme--g90,
     $emit-custom-properties: true
   );
 }
 
-:root[storybook-carbon-theme='g100'] {
+[storybook-carbon-theme="g100"] {
   @include carbon--theme(
     $theme: $carbon--theme--g100,
     $emit-custom-properties: true

package/{react.js → constants.js}

@@ -1,7 +1,7 @@
 /**
- * Copyright IBM Corp. 2016, 2018
+ * Copyright IBM Corp. 2023, 2023
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
-export { withCarbonTheme } from './dist/react';
+module.exports = require('./dist/constants.js');

package/dist/Panel.js

@@ -0,0 +1,24 @@
+/**
+ * Copyright IBM Corp. 2023, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import React from 'react';
+import { useGlobals } from '@storybook/manager-api';
+import { AddonPanel } from '@storybook/components';
+import { PARAM_KEY } from './constants';
+import { PanelContent } from './components/PanelContent';
+export const Panel = props => {
+  const [globals, updateGlobals] = useGlobals();
+  const globalCarbonTheme = globals[PARAM_KEY];
+  return /*#__PURE__*/React.createElement(AddonPanel, props, /*#__PURE__*/React.createElement(PanelContent, {
+    theme: globalCarbonTheme,
+    onChange: value => {
+      updateGlobals({
+        [PARAM_KEY]: value
+      });
+    }
+  }));
+};
+//# sourceMappingURL=Panel.js.map

package/dist/Panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Panel.js","names":["React","useGlobals","AddonPanel","PARAM_KEY","PanelContent","Panel","props","globals","updateGlobals","globalCarbonTheme","createElement","theme","onChange","value"],"sources":["../src/Panel.js"],"sourcesContent":["/**\n * Copyright IBM Corp. 2023, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport React from 'react';\nimport { useGlobals } from '@storybook/manager-api';\n\nimport { AddonPanel } from '@storybook/components';\nimport { PARAM_KEY } from './constants';\nimport { PanelContent } from './components/PanelContent';\n\nexport const Panel = (props) => {\n  const [globals, updateGlobals] = useGlobals();\n  const globalCarbonTheme = globals[PARAM_KEY];\n\n  return (\n    <AddonPanel {...props}>\n      <PanelContent\n        theme={globalCarbonTheme}\n        onChange={(value) => {\n          updateGlobals({ [PARAM_KEY]: value });\n        }}\n      />\n    </AddonPanel>\n  );\n};\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU,QAAQ,wBAAwB;AAEnD,SAASC,UAAU,QAAQ,uBAAuB;AAClD,SAASC,SAAS,QAAQ,aAAa;AACvC,SAASC,YAAY,QAAQ,2BAA2B;AAExD,OAAO,MAAMC,KAAK,GAAIC,KAAK,IAAK;EAC9B,MAAM,CAACC,OAAO,EAAEC,aAAa,CAAC,GAAGP,UAAU,CAAC,CAAC;EAC7C,MAAMQ,iBAAiB,GAAGF,OAAO,CAACJ,SAAS,CAAC;EAE5C,oBACEH,KAAA,CAAAU,aAAA,CAACR,UAAU,EAAKI,KAAK,eACnBN,KAAA,CAAAU,aAAA,CAACN,YAAY;IACXO,KAAK,EAAEF,iBAAkB;IACzBG,QAAQ,EAAGC,KAAK,IAAK;MACnBL,aAAa,CAAC;QAAE,CAACL,SAAS,GAAGU;MAAM,CAAC,CAAC;IACvC;EAAE,CACH,CACS,CAAC;AAEjB,CAAC"}

package/dist/components/PanelContent.js

@@ -0,0 +1,34 @@
+/**
+ * Copyright IBM Corp. 2023, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import React from 'react';
+import { Form } from '@storybook/components';
+import PropTypes from 'prop-types';
+import { CARBON_THEMES } from '../constants';
+export const PanelContent = ({
+  theme,
+  onChange
+}) => {
+  const themes = Object.values(CARBON_THEMES);
+  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Form, null, /*#__PURE__*/React.createElement(Form.Field, {
+    label: "Select Carbon theme:"
+  }, /*#__PURE__*/React.createElement(Form.Select, {
+    name: "carbon-theme",
+    value: theme,
+    onChange: ev => {
+      onChange && onChange(ev.target.value);
+    },
+    size: "flex"
+  }, themes.map(option => /*#__PURE__*/React.createElement("option", {
+    key: option,
+    value: option
+  }, option))))));
+};
+PanelContent.propTypes = {
+  onChange: PropTypes.func,
+  theme: PropTypes.string
+};
+//# sourceMappingURL=PanelContent.js.map

package/dist/components/PanelContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PanelContent.js","names":["React","Form","PropTypes","CARBON_THEMES","PanelContent","theme","onChange","themes","Object","values","createElement","Field","label","Select","name","value","ev","target","size","map","option","key","propTypes","func","string"],"sources":["../../src/components/PanelContent.js"],"sourcesContent":["/**\n * Copyright IBM Corp. 2023, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport React from 'react';\nimport { Form } from '@storybook/components';\nimport PropTypes from 'prop-types';\nimport { CARBON_THEMES } from '../constants';\n\nexport const PanelContent = ({ theme, onChange }) => {\n  const themes = Object.values(CARBON_THEMES);\n\n  return (\n    <div>\n      <Form>\n        <Form.Field label=\"Select Carbon theme:\">\n          <Form.Select\n            name=\"carbon-theme\"\n            value={theme}\n            onChange={(ev) => {\n              onChange && onChange(ev.target.value);\n            }}\n            size=\"flex\"\n          >\n            {themes.map((option) => (\n              <option key={option} value={option}>\n                {option}\n              </option>\n            ))}\n          </Form.Select>\n        </Form.Field>\n      </Form>\n    </div>\n  );\n};\n\nPanelContent.propTypes = {\n  onChange: PropTypes.func,\n  theme: PropTypes.string,\n};\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,uBAAuB;AAC5C,OAAOC,SAAS,MAAM,YAAY;AAClC,SAASC,aAAa,QAAQ,cAAc;AAE5C,OAAO,MAAMC,YAAY,GAAGA,CAAC;EAAEC,KAAK;EAAEC;AAAS,CAAC,KAAK;EACnD,MAAMC,MAAM,GAAGC,MAAM,CAACC,MAAM,CAACN,aAAa,CAAC;EAE3C,oBACEH,KAAA,CAAAU,aAAA,2BACEV,KAAA,CAAAU,aAAA,CAACT,IAAI,qBACHD,KAAA,CAAAU,aAAA,CAACT,IAAI,CAACU,KAAK;IAACC,KAAK,EAAC;EAAsB,gBACtCZ,KAAA,CAAAU,aAAA,CAACT,IAAI,CAACY,MAAM;IACVC,IAAI,EAAC,cAAc;IACnBC,KAAK,EAAEV,KAAM;IACbC,QAAQ,EAAGU,EAAE,IAAK;MAChBV,QAAQ,IAAIA,QAAQ,CAACU,EAAE,CAACC,MAAM,CAACF,KAAK,CAAC;IACvC,CAAE;IACFG,IAAI,EAAC;EAAM,GAEVX,MAAM,CAACY,GAAG,CAAEC,MAAM,iBACjBpB,KAAA,CAAAU,aAAA;IAAQW,GAAG,EAAED,MAAO;IAACL,KAAK,EAAEK;EAAO,GAChCA,MACK,CACT,CACU,CACH,CACR,CACH,CAAC;AAEV,CAAC;AAEDhB,YAAY,CAACkB,SAAS,GAAG;EACvBhB,QAAQ,EAAEJ,SAAS,CAACqB,IAAI;EACxBlB,KAAK,EAAEH,SAAS,CAACsB;AACnB,CAAC"}

package/dist/constants.js

@@ -0,0 +1,17 @@
+/**
+ * Copyright IBM Corp. 2023, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+export const ADDON_ID = '@carbon/theme';
+export const PANEL_ID = `${ADDON_ID}/panel`;
+export const TOOL_ID = `${ADDON_ID}/tool`;
+export const PARAM_KEY = 'carbonTheme';
+export const CARBON_THEMES = {
+  white: 'white',
+  g10: 'g10',
+  g90: 'g90',
+  g100: 'g100'
+};
+//# sourceMappingURL=constants.js.map

package/dist/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","names":["ADDON_ID","PANEL_ID","TOOL_ID","PARAM_KEY","CARBON_THEMES","white","g10","g90","g100"],"sources":["../src/constants.js"],"sourcesContent":["/**\n * Copyright IBM Corp. 2023, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\nexport const ADDON_ID = '@carbon/theme';\nexport const PANEL_ID = `${ADDON_ID}/panel`;\nexport const TOOL_ID = `${ADDON_ID}/tool`;\nexport const PARAM_KEY = 'carbonTheme';\nexport const CARBON_THEMES = {\n  white: 'white',\n  g10: 'g10',\n  g90: 'g90',\n  g100: 'g100',\n};\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMA,QAAQ,GAAG,eAAe;AACvC,OAAO,MAAMC,QAAQ,GAAI,GAAED,QAAS,QAAO;AAC3C,OAAO,MAAME,OAAO,GAAI,GAAEF,QAAS,OAAM;AACzC,OAAO,MAAMG,SAAS,GAAG,aAAa;AACtC,OAAO,MAAMC,aAAa,GAAG;EAC3BC,KAAK,EAAE,OAAO;EACdC,GAAG,EAAE,KAAK;EACVC,GAAG,EAAE,KAAK;EACVC,IAAI,EAAE;AACR,CAAC"}

package/dist/decorators/withCarbonTheme.js

@@ -0,0 +1,27 @@
+/**
+ * Copyright IBM Corp. 2023, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { useEffect } from '@storybook/preview-api';
+import { PARAM_KEY } from '../constants';
+export const withCarbonTheme = (StoryFn, context) => {
+  const {
+    globals,
+    parameters
+  } = context;
+  const globalCarbonTheme = globals[PARAM_KEY];
+  const storyCarbonTheme = parameters[PARAM_KEY];
+
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  useEffect(() => {
+    const selector = context.viewMode === 'docs' ? `.sbdocs-preview .docs-story` : '.sb-show-main';
+    const rootElements = document.querySelectorAll(selector);
+    rootElements.forEach(rootElement => {
+      rootElement.setAttribute('storybook-carbon-theme', globalCarbonTheme ?? storyCarbonTheme);
+    });
+  }, [context.id, context.viewMode, globalCarbonTheme, storyCarbonTheme]);
+  return StoryFn();
+};
+//# sourceMappingURL=withCarbonTheme.js.map

package/dist/decorators/withCarbonTheme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"withCarbonTheme.js","names":["useEffect","PARAM_KEY","withCarbonTheme","StoryFn","context","globals","parameters","globalCarbonTheme","storyCarbonTheme","selector","viewMode","rootElements","document","querySelectorAll","forEach","rootElement","setAttribute","id"],"sources":["../../src/decorators/withCarbonTheme.js"],"sourcesContent":["/**\n * Copyright IBM Corp. 2023, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport { useEffect } from '@storybook/preview-api';\nimport { PARAM_KEY } from '../constants';\n\nexport const withCarbonTheme = (StoryFn, context) => {\n  const { globals, parameters } = context;\n\n  const globalCarbonTheme = globals[PARAM_KEY];\n  const storyCarbonTheme = parameters[PARAM_KEY];\n\n  // eslint-disable-next-line react-hooks/rules-of-hooks\n  useEffect(() => {\n    const selector =\n      context.viewMode === 'docs'\n        ? `.sbdocs-preview .docs-story`\n        : '.sb-show-main';\n\n    const rootElements = document.querySelectorAll(selector);\n    rootElements.forEach((rootElement) => {\n      rootElement.setAttribute(\n        'storybook-carbon-theme',\n        globalCarbonTheme ?? storyCarbonTheme\n      );\n    });\n  }, [context.id, context.viewMode, globalCarbonTheme, storyCarbonTheme]);\n\n  return StoryFn();\n};\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,SAAS,QAAQ,wBAAwB;AAClD,SAASC,SAAS,QAAQ,cAAc;AAExC,OAAO,MAAMC,eAAe,GAAGA,CAACC,OAAO,EAAEC,OAAO,KAAK;EACnD,MAAM;IAAEC,OAAO;IAAEC;EAAW,CAAC,GAAGF,OAAO;EAEvC,MAAMG,iBAAiB,GAAGF,OAAO,CAACJ,SAAS,CAAC;EAC5C,MAAMO,gBAAgB,GAAGF,UAAU,CAACL,SAAS,CAAC;;EAE9C;EACAD,SAAS,CAAC,MAAM;IACd,MAAMS,QAAQ,GACZL,OAAO,CAACM,QAAQ,KAAK,MAAM,GACtB,6BAA4B,GAC7B,eAAe;IAErB,MAAMC,YAAY,GAAGC,QAAQ,CAACC,gBAAgB,CAACJ,QAAQ,CAAC;IACxDE,YAAY,CAACG,OAAO,CAAEC,WAAW,IAAK;MACpCA,WAAW,CAACC,YAAY,CACtB,wBAAwB,EACxBT,iBAAiB,IAAIC,gBACvB,CAAC;IACH,CAAC,CAAC;EACJ,CAAC,EAAE,CAACJ,OAAO,CAACa,EAAE,EAAEb,OAAO,CAACM,QAAQ,EAAEH,iBAAiB,EAAEC,gBAAgB,CAAC,CAAC;EAEvE,OAAOL,OAAO,CAAC,CAAC;AAClB,CAAC"}

package/dist/manager.js

@@ -0,0 +1,18 @@
+/**
+ * Copyright IBM Corp. 2023, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { addons, types } from '@storybook/manager-api';
+import { Panel } from './Panel';
+const ADDON_ID = 'carbonTheme';
+const PANEL_ID = `${ADDON_ID}/panel`;
+addons.register(ADDON_ID, () => {
+  addons.add(PANEL_ID, {
+    type: types.PANEL,
+    title: 'Carbon Theme',
+    render: Panel
+  });
+});
+//# sourceMappingURL=manager.js.map

package/dist/manager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"manager.js","names":["addons","types","Panel","ADDON_ID","PANEL_ID","register","add","type","PANEL","title","render"],"sources":["../src/manager.js"],"sourcesContent":["/**\n * Copyright IBM Corp. 2023, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport { addons, types } from '@storybook/manager-api';\n\nimport { Panel } from './Panel';\n\nconst ADDON_ID = 'carbonTheme';\nconst PANEL_ID = `${ADDON_ID}/panel`;\n\naddons.register(ADDON_ID, () => {\n  addons.add(PANEL_ID, {\n    type: types.PANEL,\n    title: 'Carbon Theme',\n    render: Panel,\n  });\n});\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,MAAM,EAAEC,KAAK,QAAQ,wBAAwB;AAEtD,SAASC,KAAK,QAAQ,SAAS;AAE/B,MAAMC,QAAQ,GAAG,aAAa;AAC9B,MAAMC,QAAQ,GAAI,GAAED,QAAS,QAAO;AAEpCH,MAAM,CAACK,QAAQ,CAACF,QAAQ,EAAE,MAAM;EAC9BH,MAAM,CAACM,GAAG,CAACF,QAAQ,EAAE;IACnBG,IAAI,EAAEN,KAAK,CAACO,KAAK;IACjBC,KAAK,EAAE,cAAc;IACrBC,MAAM,EAAER;EACV,CAAC,CAAC;AACJ,CAAC,CAAC"}

package/dist/preset.js

@@ -0,0 +1,14 @@
+/**
+ * Copyright IBM Corp. 2023, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+function managerEntries(entry = []) {
+  return [...entry, require.resolve('./manager')]; //👈 Addon implementation
+}
+
+export default {
+  managerEntries
+};
+//# sourceMappingURL=preset.js.map

package/dist/preset.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"preset.js","names":["managerEntries","entry","require","resolve"],"sources":["../src/preset.js"],"sourcesContent":["/**\n * Copyright IBM Corp. 2023, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\nfunction managerEntries(entry = []) {\n  return [...entry, require.resolve('./manager')]; //👈 Addon implementation\n}\n\nexport default { managerEntries };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,cAAcA,CAACC,KAAK,GAAG,EAAE,EAAE;EAClC,OAAO,CAAC,GAAGA,KAAK,EAAEC,OAAO,CAACC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;AACnD;;AAEA,eAAe;EAAEH;AAAe,CAAC"}

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@carbon/storybook-addon-theme",
   "description": "Carbon theme switcher for Storybook",
-  "version": "1.0.0",
+  "version": "2.0.0-rc.0",
   "license": "Apache-2.0",
   "main": "dist/react.js",
   "repository": {
     "type": "git",
     "url": "https://github.com/carbon-design-system/ibm-products.git",
-    "directory": "packages/storybook-addon-carbon-theme"
+    "directory": "config/storybook-addon-carbon-theme"
   },
   "bugs": "https://github.com/carbon-design-system/ibm-products/issues",
   "homepage": "https://github.com/storybookjs/storybook#readme",
@@ -42,14 +42,14 @@
     "vue": "*"
   },
   "dependencies": {
-    "@storybook/addons": "6.5.16",
-    "@storybook/api": "6.5.16",
-    "@storybook/client-api": "6.5.16",
-    "@storybook/client-logger": "6.5.16",
-    "@storybook/components": "6.5.16",
-    "@storybook/core-events": "6.5.16",
-    "@storybook/theming": "6.5.16",
-    "core-js": "^3.30.2",
+    "@storybook/addons": "^7.0.18",
+    "@storybook/api": "^7.0.18",
+    "@storybook/client-api": "^7.0.18",
+    "@storybook/client-logger": "^7.0.18",
+    "@storybook/components": "^7.0.18",
+    "@storybook/core-events": "^7.0.18",
+    "@storybook/theming": "^7.0.18",
+    "core-js": "^3.28.0",
     "global": "^4.4.0"
   },
   "devDependencies": {

package/{register.js → preset.js}

@@ -1,7 +1,7 @@
 /**
- * Copyright IBM Corp. 2016, 2018
+ * Copyright IBM Corp. 2023, 2023
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
-import './dist/register';
+module.exports = require('./dist/preset.js');

package/{vue.js → withCarbonTheme.js}

@@ -1,7 +1,7 @@
 /**
- * Copyright IBM Corp. 2016, 2018
+ * Copyright IBM Corp. 2023, 2023
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
-export { withCarbonTheme } from './dist/vue';
+module.exports = require('./dist/decorators/withCarbonTheme');

package/dist/components/Panel.js

@@ -1,73 +0,0 @@
-/* eslint-disable react/prop-types */
-/**
- * Copyright IBM Corp. 2016, 2018
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-import React, { useEffect, useState } from 'react';
-import PropTypes from 'prop-types';
-import { Form } from '@storybook/components';
-import { SET_STORIES, STORY_CHANGED } from '@storybook/core-events';
-import { CARBON_CURRENT_THEME, CARBON_THEMES, CARBON_THEME_DEFAULT, CARBON_THEME_PARAM, mergeParams } from '../shared';
-
-/**
- * Storybook add-on panel for Carbon theme switcher.
- */
-export const CarbonThemesPanel = ({
-  api,
-  active,
-  channel
-}) => {
-  const [theme, setTheme] = useState(CARBON_THEME_DEFAULT);
-  const [themes, setThemes] = useState(CARBON_THEMES);
-  useEffect(() => {
-    // on mount sort out initial state
-    const handleStoryChange = () => {
-      const storyData = api.getCurrentStoryData();
-      let params = storyData ? storyData.parameters ? storyData.parameters[CARBON_THEME_PARAM] : {} : {};
-      params = mergeParams(params);
-      setTheme(params.theme);
-      setThemes(params.themes);
-    };
-    api.on(SET_STORIES, handleStoryChange);
-    api.on(STORY_CHANGED, handleStoryChange);
-    return () => {
-      api.off(SET_STORIES, handleStoryChange);
-      api.off(STORY_CHANGED, handleStoryChange);
-    };
-  }, [api]);
-  useEffect(() => {
-    channel.emit(CARBON_CURRENT_THEME, theme);
-  }, [theme, channel]);
-  if (!active) {
-    return null;
-  }
-  return /*#__PURE__*/React.createElement(Form, null, /*#__PURE__*/React.createElement(Form.Field, {
-    label: "Select Carbon theme:"
-  }, /*#__PURE__*/React.createElement(Form.Select, {
-    name: "carbon-theme",
-    value: theme,
-    onChange: ev => setTheme(ev.target.value),
-    size: "flex"
-  }, themes.map(option => /*#__PURE__*/React.createElement("option", {
-    key: option,
-    value: option
-  }, option)))));
-};
-CarbonThemesPanel.propTypes = {
-  /**
-   * `true` if this Storybook add-on panel is active.
-   */
-  active: PropTypes.bool.isRequired,
-  /**
-   * The Storybook API object.
-   */
-  api: PropTypes.any,
-  /**
-   * channel
-   */
-  channel: PropTypes.object
-};
-//# sourceMappingURL=Panel.js.map

package/dist/components/Panel.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Panel.js","names":["React","useEffect","useState","PropTypes","Form","SET_STORIES","STORY_CHANGED","CARBON_CURRENT_THEME","CARBON_THEMES","CARBON_THEME_DEFAULT","CARBON_THEME_PARAM","mergeParams","CarbonThemesPanel","api","active","channel","theme","setTheme","themes","setThemes","handleStoryChange","storyData","getCurrentStoryData","params","parameters","on","off","emit","createElement","Field","label","Select","name","value","onChange","ev","target","size","map","option","key","propTypes","bool","isRequired","any","object"],"sources":["../../src/components/Panel.js"],"sourcesContent":["/* eslint-disable react/prop-types */\n/**\n * Copyright IBM Corp. 2016, 2018\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport React, { useEffect, useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { Form } from '@storybook/components';\nimport { SET_STORIES, STORY_CHANGED } from '@storybook/core-events';\n\nimport {\n  CARBON_CURRENT_THEME,\n  CARBON_THEMES,\n  CARBON_THEME_DEFAULT,\n  CARBON_THEME_PARAM,\n  mergeParams,\n} from '../shared';\n\n/**\n * Storybook add-on panel for Carbon theme switcher.\n */\nexport const CarbonThemesPanel = ({ api, active, channel }) => {\n  const [theme, setTheme] = useState(CARBON_THEME_DEFAULT);\n  const [themes, setThemes] = useState(CARBON_THEMES);\n\n  useEffect(() => {\n    // on mount sort out initial state\n    const handleStoryChange = () => {\n      const storyData = api.getCurrentStoryData();\n\n      let params = storyData\n        ? storyData.parameters\n          ? storyData.parameters[CARBON_THEME_PARAM]\n          : {}\n        : {};\n\n      params = mergeParams(params);\n\n      setTheme(params.theme);\n      setThemes(params.themes);\n    };\n\n    api.on(SET_STORIES, handleStoryChange);\n    api.on(STORY_CHANGED, handleStoryChange);\n\n    return () => {\n      api.off(SET_STORIES, handleStoryChange);\n      api.off(STORY_CHANGED, handleStoryChange);\n    };\n  }, [api]);\n\n  useEffect(() => {\n    channel.emit(CARBON_CURRENT_THEME, theme);\n  }, [theme, channel]);\n\n  if (!active) {\n    return null;\n  }\n\n  return (\n    <Form>\n      <Form.Field label=\"Select Carbon theme:\">\n        <Form.Select\n          name=\"carbon-theme\"\n          value={theme}\n          onChange={(ev) => setTheme(ev.target.value)}\n          size=\"flex\"\n        >\n          {themes.map((option) => (\n            <option key={option} value={option}>\n              {option}\n            </option>\n          ))}\n        </Form.Select>\n      </Form.Field>\n    </Form>\n  );\n};\n\nCarbonThemesPanel.propTypes = {\n  /**\n   * `true` if this Storybook add-on panel is active.\n   */\n  active: PropTypes.bool.isRequired,\n  /**\n   * The Storybook API object.\n   */\n  api: PropTypes.any,\n  /**\n   * channel\n   */\n  channel: PropTypes.object,\n};\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAOA,KAAK,IAAIC,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAClD,OAAOC,SAAS,MAAM,YAAY;AAClC,SAASC,IAAI,QAAQ,uBAAuB;AAC5C,SAASC,WAAW,EAAEC,aAAa,QAAQ,wBAAwB;AAEnE,SACEC,oBAAoB,EACpBC,aAAa,EACbC,oBAAoB,EACpBC,kBAAkB,EAClBC,WAAW,QACN,WAAW;;AAElB;AACA;AACA;AACA,OAAO,MAAMC,iBAAiB,GAAGA,CAAC;EAAEC,GAAG;EAAEC,MAAM;EAAEC;AAAQ,CAAC,KAAK;EAC7D,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGf,QAAQ,CAACO,oBAAoB,CAAC;EACxD,MAAM,CAACS,MAAM,EAAEC,SAAS,CAAC,GAAGjB,QAAQ,CAACM,aAAa,CAAC;EAEnDP,SAAS,CAAC,MAAM;IACd;IACA,MAAMmB,iBAAiB,GAAGA,CAAA,KAAM;MAC9B,MAAMC,SAAS,GAAGR,GAAG,CAACS,mBAAmB,CAAC,CAAC;MAE3C,IAAIC,MAAM,GAAGF,SAAS,GAClBA,SAAS,CAACG,UAAU,GAClBH,SAAS,CAACG,UAAU,CAACd,kBAAkB,CAAC,GACxC,CAAC,CAAC,GACJ,CAAC,CAAC;MAENa,MAAM,GAAGZ,WAAW,CAACY,MAAM,CAAC;MAE5BN,QAAQ,CAACM,MAAM,CAACP,KAAK,CAAC;MACtBG,SAAS,CAACI,MAAM,CAACL,MAAM,CAAC;IAC1B,CAAC;IAEDL,GAAG,CAACY,EAAE,CAACpB,WAAW,EAAEe,iBAAiB,CAAC;IACtCP,GAAG,CAACY,EAAE,CAACnB,aAAa,EAAEc,iBAAiB,CAAC;IAExC,OAAO,MAAM;MACXP,GAAG,CAACa,GAAG,CAACrB,WAAW,EAAEe,iBAAiB,CAAC;MACvCP,GAAG,CAACa,GAAG,CAACpB,aAAa,EAAEc,iBAAiB,CAAC;IAC3C,CAAC;EACH,CAAC,EAAE,CAACP,GAAG,CAAC,CAAC;EAETZ,SAAS,CAAC,MAAM;IACdc,OAAO,CAACY,IAAI,CAACpB,oBAAoB,EAAES,KAAK,CAAC;EAC3C,CAAC,EAAE,CAACA,KAAK,EAAED,OAAO,CAAC,CAAC;EAEpB,IAAI,CAACD,MAAM,EAAE;IACX,OAAO,IAAI;EACb;EAEA,oBACEd,KAAA,CAAA4B,aAAA,CAACxB,IAAI,qBACHJ,KAAA,CAAA4B,aAAA,CAACxB,IAAI,CAACyB,KAAK;IAACC,KAAK,EAAC;EAAsB,gBACtC9B,KAAA,CAAA4B,aAAA,CAACxB,IAAI,CAAC2B,MAAM;IACVC,IAAI,EAAC,cAAc;IACnBC,KAAK,EAAEjB,KAAM;IACbkB,QAAQ,EAAGC,EAAE,IAAKlB,QAAQ,CAACkB,EAAE,CAACC,MAAM,CAACH,KAAK,CAAE;IAC5CI,IAAI,EAAC;EAAM,GAEVnB,MAAM,CAACoB,GAAG,CAAEC,MAAM,iBACjBvC,KAAA,CAAA4B,aAAA;IAAQY,GAAG,EAAED,MAAO;IAACN,KAAK,EAAEM;EAAO,GAChCA,MACK,CACT,CACU,CACH,CACR,CAAC;AAEX,CAAC;AAED3B,iBAAiB,CAAC6B,SAAS,GAAG;EAC5B;AACF;AACA;EACE3B,MAAM,EAAEX,SAAS,CAACuC,IAAI,CAACC,UAAU;EACjC;AACF;AACA;EACE9B,GAAG,EAAEV,SAAS,CAACyC,GAAG;EAClB;AACF;AACA;EACE7B,OAAO,EAAEZ,SAAS,CAAC0C;AACrB,CAAC"}

package/dist/react.js

@@ -1,31 +0,0 @@
-/**
- * Copyright IBM Corp. 2016, 2018
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-import { useEffect, useState } from 'react';
-import addons, { makeDecorator } from '@storybook/addons';
-import { CARBON_CURRENT_THEME, CARBON_THEME_PARAM, WITH_CARBON_THEME } from './shared';
-const Wrapper = (getStory, context, parameters) => {
-  const channel = addons.getChannel();
-  const [carbonTheme, setCarbonTheme] = useState(undefined);
-  const handleCarbonCurrentTheme = theme => {
-    document.documentElement.setAttribute('storybook-carbon-theme', theme);
-    setCarbonTheme(theme);
-  };
-  useEffect(() => {
-    channel.on(CARBON_CURRENT_THEME, handleCarbonCurrentTheme);
-    setCarbonTheme(carbonTheme || parameters.value);
-    return () => {
-      channel.removeListener(CARBON_CURRENT_THEME, handleCarbonCurrentTheme);
-    }; // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-  return getStory(context);
-};
-export const withCarbonTheme = makeDecorator({
-  name: WITH_CARBON_THEME,
-  parameterName: CARBON_THEME_PARAM,
-  wrapper: Wrapper
-});
-//# sourceMappingURL=react.js.map

package/dist/react.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"react.js","names":["useEffect","useState","addons","makeDecorator","CARBON_CURRENT_THEME","CARBON_THEME_PARAM","WITH_CARBON_THEME","Wrapper","getStory","context","parameters","channel","getChannel","carbonTheme","setCarbonTheme","undefined","handleCarbonCurrentTheme","theme","document","documentElement","setAttribute","on","value","removeListener","withCarbonTheme","name","parameterName","wrapper"],"sources":["../src/react.js"],"sourcesContent":["/**\n * Copyright IBM Corp. 2016, 2018\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport { useEffect, useState } from 'react';\nimport addons, { makeDecorator } from '@storybook/addons';\nimport {\n  CARBON_CURRENT_THEME,\n  CARBON_THEME_PARAM,\n  WITH_CARBON_THEME,\n} from './shared';\n\nconst Wrapper = (getStory, context, parameters) => {\n  const channel = addons.getChannel();\n  const [carbonTheme, setCarbonTheme] = useState(undefined);\n\n  const handleCarbonCurrentTheme = (theme) => {\n    document.documentElement.setAttribute('storybook-carbon-theme', theme);\n    setCarbonTheme(theme);\n  };\n\n  useEffect(() => {\n    channel.on(CARBON_CURRENT_THEME, handleCarbonCurrentTheme);\n    setCarbonTheme(carbonTheme || parameters.value);\n\n    return () => {\n      channel.removeListener(CARBON_CURRENT_THEME, handleCarbonCurrentTheme);\n    }; // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  return getStory(context);\n};\n\nexport const withCarbonTheme = makeDecorator({\n  name: WITH_CARBON_THEME,\n  parameterName: CARBON_THEME_PARAM,\n  wrapper: Wrapper,\n});\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAC3C,OAAOC,MAAM,IAAIC,aAAa,QAAQ,mBAAmB;AACzD,SACEC,oBAAoB,EACpBC,kBAAkB,EAClBC,iBAAiB,QACZ,UAAU;AAEjB,MAAMC,OAAO,GAAGA,CAACC,QAAQ,EAAEC,OAAO,EAAEC,UAAU,KAAK;EACjD,MAAMC,OAAO,GAAGT,MAAM,CAACU,UAAU,CAAC,CAAC;EACnC,MAAM,CAACC,WAAW,EAAEC,cAAc,CAAC,GAAGb,QAAQ,CAACc,SAAS,CAAC;EAEzD,MAAMC,wBAAwB,GAAIC,KAAK,IAAK;IAC1CC,QAAQ,CAACC,eAAe,CAACC,YAAY,CAAC,wBAAwB,EAAEH,KAAK,CAAC;IACtEH,cAAc,CAACG,KAAK,CAAC;EACvB,CAAC;EAEDjB,SAAS,CAAC,MAAM;IACdW,OAAO,CAACU,EAAE,CAACjB,oBAAoB,EAAEY,wBAAwB,CAAC;IAC1DF,cAAc,CAACD,WAAW,IAAIH,UAAU,CAACY,KAAK,CAAC;IAE/C,OAAO,MAAM;MACXX,OAAO,CAACY,cAAc,CAACnB,oBAAoB,EAAEY,wBAAwB,CAAC;IACxE,CAAC,CAAC,CAAC;EACL,CAAC,EAAE,EAAE,CAAC;EAEN,OAAOR,QAAQ,CAACC,OAAO,CAAC;AAC1B,CAAC;AAED,OAAO,MAAMe,eAAe,GAAGrB,aAAa,CAAC;EAC3CsB,IAAI,EAAEnB,iBAAiB;EACvBoB,aAAa,EAAErB,kBAAkB;EACjCsB,OAAO,EAAEpB;AACX,CAAC,CAAC"}

package/dist/register.js

@@ -1,28 +0,0 @@
-/* eslint-disable react/prop-types */
-/**
- * Copyright IBM Corp. 2016, 2018
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-import React from 'react';
-import { addons } from '@storybook/addons';
-import { CarbonThemesPanel /*, CarbonTypePanel */ } from './components/Panel';
-import { CARBON_THEMES_ADDON_ID, CARBON_THEME_PANEL_ID } from './shared';
-addons.register(CARBON_THEMES_ADDON_ID, api => {
-  const channel = addons.getChannel();
-  addons.addPanel(CARBON_THEME_PANEL_ID, {
-    title: 'Carbon theme',
-    render: ({
-      active,
-      key
-    }) => /*#__PURE__*/React.createElement(CarbonThemesPanel, {
-      api,
-      active,
-      key,
-      channel
-    })
-  });
-});
-//# sourceMappingURL=register.js.map

package/dist/register.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"register.js","names":["React","addons","CarbonThemesPanel","CARBON_THEMES_ADDON_ID","CARBON_THEME_PANEL_ID","register","api","channel","getChannel","addPanel","title","render","active","key","createElement"],"sources":["../src/register.js"],"sourcesContent":["/* eslint-disable react/prop-types */\n/**\n * Copyright IBM Corp. 2016, 2018\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport React from 'react';\nimport { addons } from '@storybook/addons';\nimport { CarbonThemesPanel /*, CarbonTypePanel */ } from './components/Panel';\nimport { CARBON_THEMES_ADDON_ID, CARBON_THEME_PANEL_ID } from './shared';\n\naddons.register(CARBON_THEMES_ADDON_ID, (api) => {\n  const channel = addons.getChannel();\n  addons.addPanel(CARBON_THEME_PANEL_ID, {\n    title: 'Carbon theme',\n    render: ({ active, key }) => (\n      <CarbonThemesPanel {...{ api, active, key, channel }} />\n    ),\n  });\n});\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SAASC,iBAAiB,CAAC,8BAA8B,oBAAoB;AAC7E,SAASC,sBAAsB,EAAEC,qBAAqB,QAAQ,UAAU;AAExEH,MAAM,CAACI,QAAQ,CAACF,sBAAsB,EAAGG,GAAG,IAAK;EAC/C,MAAMC,OAAO,GAAGN,MAAM,CAACO,UAAU,CAAC,CAAC;EACnCP,MAAM,CAACQ,QAAQ,CAACL,qBAAqB,EAAE;IACrCM,KAAK,EAAE,cAAc;IACrBC,MAAM,EAAEA,CAAC;MAAEC,MAAM;MAAEC;IAAI,CAAC,kBACtBb,KAAA,CAAAc,aAAA,CAACZ,iBAAiB;MAAOI,GAAG;MAAEM,MAAM;MAAEC,GAAG;MAAEN;IAAO,CAAK;EAE3D,CAAC,CAAC;AACJ,CAAC,CAAC"}

package/dist/shared.js

@@ -1,44 +0,0 @@
-/**
- * Copyright IBM Corp. 2016, 2021
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-export const CARBON_THEMES = ['white', 'g10', 'g90', 'g100', 'debug'];
-export const WITH_CARBON_THEME = 'withCarbonTheme';
-export const CARBON_THEME_PARAM = 'carbonTheme';
-export const CARBON_THEME_DEFAULT = 'white';
-export const CARBON_THEMES_ADDON_ID = 'carbon-theme';
-export const CARBON_THEME = `£{CARBON_THEME_PANEL_ID}/carbonTheme`;
-export const CARBON_CURRENT_THEME = `${CARBON_THEMES_ADDON_ID}/current`;
-export const CARBON_THEME_PANEL_ID = `${CARBON_THEMES_ADDON_ID}/panel`;
-const defaultOptions = {
-  theme: CARBON_THEMES[0],
-  themes: CARBON_THEMES
-};
-export const mergeParams = params => {
-  const options = {
-    themes: [],
-    ...params
-  };
-  if (options.themes.length) {
-    // filter to params.themes
-    options.themes = defaultOptions.themes.filter(option => options.themes.indexOf(option) > -1);
-  }
-
-  // check not empty
-  if (options.themes.length === 0) {
-    options.themes = defaultOptions.themes.slice(0);
-  }
-  if (!options.theme) {
-    options.theme = defaultOptions.theme;
-  }
-  if (options.themes.indexOf(options.theme) < 0) {
-    // default theme to one that exists
-    const defaultThemeIndex = options.themes.indexOf(defaultOptions.theme);
-    options.theme = defaultThemeIndex > 0 ? options.themes[defaultThemeIndex] : options.themes[0];
-  }
-  return options;
-};
-//# sourceMappingURL=shared.js.map

package/dist/shared.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"shared.js","names":["CARBON_THEMES","WITH_CARBON_THEME","CARBON_THEME_PARAM","CARBON_THEME_DEFAULT","CARBON_THEMES_ADDON_ID","CARBON_THEME","CARBON_CURRENT_THEME","CARBON_THEME_PANEL_ID","defaultOptions","theme","themes","mergeParams","params","options","length","filter","option","indexOf","slice","defaultThemeIndex"],"sources":["../src/shared.js"],"sourcesContent":["/**\n * Copyright IBM Corp. 2016, 2021\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nexport const CARBON_THEMES = ['white', 'g10', 'g90', 'g100', 'debug'];\nexport const WITH_CARBON_THEME = 'withCarbonTheme';\nexport const CARBON_THEME_PARAM = 'carbonTheme';\nexport const CARBON_THEME_DEFAULT = 'white';\n\nexport const CARBON_THEMES_ADDON_ID = 'carbon-theme';\nexport const CARBON_THEME = `£{CARBON_THEME_PANEL_ID}/carbonTheme`;\nexport const CARBON_CURRENT_THEME = `${CARBON_THEMES_ADDON_ID}/current`;\nexport const CARBON_THEME_PANEL_ID = `${CARBON_THEMES_ADDON_ID}/panel`;\n\nconst defaultOptions = {\n  theme: CARBON_THEMES[0],\n  themes: CARBON_THEMES,\n};\n\nexport const mergeParams = (params) => {\n  const options = { themes: [], ...params };\n\n  if (options.themes.length) {\n    // filter to params.themes\n    options.themes = defaultOptions.themes.filter(\n      (option) => options.themes.indexOf(option) > -1\n    );\n  }\n\n  // check not empty\n  if (options.themes.length === 0) {\n    options.themes = defaultOptions.themes.slice(0);\n  }\n\n  if (!options.theme) {\n    options.theme = defaultOptions.theme;\n  }\n\n  if (options.themes.indexOf(options.theme) < 0) {\n    // default theme to one that exists\n    const defaultThemeIndex = options.themes.indexOf(defaultOptions.theme);\n    options.theme =\n      defaultThemeIndex > 0\n        ? options.themes[defaultThemeIndex]\n        : options.themes[0];\n  }\n\n  return options;\n};\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAO,MAAMA,aAAa,GAAG,CAAC,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,CAAC;AACrE,OAAO,MAAMC,iBAAiB,GAAG,iBAAiB;AAClD,OAAO,MAAMC,kBAAkB,GAAG,aAAa;AAC/C,OAAO,MAAMC,oBAAoB,GAAG,OAAO;AAE3C,OAAO,MAAMC,sBAAsB,GAAG,cAAc;AACpD,OAAO,MAAMC,YAAY,GAAI,sCAAqC;AAClE,OAAO,MAAMC,oBAAoB,GAAI,GAAEF,sBAAuB,UAAS;AACvE,OAAO,MAAMG,qBAAqB,GAAI,GAAEH,sBAAuB,QAAO;AAEtE,MAAMI,cAAc,GAAG;EACrBC,KAAK,EAAET,aAAa,CAAC,CAAC,CAAC;EACvBU,MAAM,EAAEV;AACV,CAAC;AAED,OAAO,MAAMW,WAAW,GAAIC,MAAM,IAAK;EACrC,MAAMC,OAAO,GAAG;IAAEH,MAAM,EAAE,EAAE;IAAE,GAAGE;EAAO,CAAC;EAEzC,IAAIC,OAAO,CAACH,MAAM,CAACI,MAAM,EAAE;IACzB;IACAD,OAAO,CAACH,MAAM,GAAGF,cAAc,CAACE,MAAM,CAACK,MAAM,CAC1CC,MAAM,IAAKH,OAAO,CAACH,MAAM,CAACO,OAAO,CAACD,MAAM,CAAC,GAAG,CAAC,CAChD,CAAC;EACH;;EAEA;EACA,IAAIH,OAAO,CAACH,MAAM,CAACI,MAAM,KAAK,CAAC,EAAE;IAC/BD,OAAO,CAACH,MAAM,GAAGF,cAAc,CAACE,MAAM,CAACQ,KAAK,CAAC,CAAC,CAAC;EACjD;EAEA,IAAI,CAACL,OAAO,CAACJ,KAAK,EAAE;IAClBI,OAAO,CAACJ,KAAK,GAAGD,cAAc,CAACC,KAAK;EACtC;EAEA,IAAII,OAAO,CAACH,MAAM,CAACO,OAAO,CAACJ,OAAO,CAACJ,KAAK,CAAC,GAAG,CAAC,EAAE;IAC7C;IACA,MAAMU,iBAAiB,GAAGN,OAAO,CAACH,MAAM,CAACO,OAAO,CAACT,cAAc,CAACC,KAAK,CAAC;IACtEI,OAAO,CAACJ,KAAK,GACXU,iBAAiB,GAAG,CAAC,GACjBN,OAAO,CAACH,MAAM,CAACS,iBAAiB,CAAC,GACjCN,OAAO,CAACH,MAAM,CAAC,CAAC,CAAC;EACzB;EAEA,OAAOG,OAAO;AAChB,CAAC"}

package/dist/vue.js

@@ -1,31 +0,0 @@
-/**
- * Copyright IBM Corp. 2016, 2018
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-import addons, { makeDecorator } from '@storybook/addons';
-import { CARBON_CURRENT_THEME, CARBON_THEME_PARAM, WITH_CARBON_THEME } from './shared';
-const Wrapper = (getStory, context, {
-  parameters
-}) => {
-  const channel = addons.getChannel();
-  const setCarbonTheme = theme => {
-    document.documentElement.setAttribute('storybook-carbon-theme', theme);
-  };
-  return {
-    template: `<story/>`,
-    mounted() {
-      channel.on(CARBON_CURRENT_THEME, setCarbonTheme);
-      setCarbonTheme(parameters.value);
-    }
-  };
-};
-
-// export decorator
-export const withCarbonTheme = makeDecorator({
-  name: WITH_CARBON_THEME,
-  parameterName: CARBON_THEME_PARAM,
-  wrapper: Wrapper
-});
-//# sourceMappingURL=vue.js.map

package/dist/vue.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"vue.js","names":["addons","makeDecorator","CARBON_CURRENT_THEME","CARBON_THEME_PARAM","WITH_CARBON_THEME","Wrapper","getStory","context","parameters","channel","getChannel","setCarbonTheme","theme","document","documentElement","setAttribute","template","mounted","on","value","withCarbonTheme","name","parameterName","wrapper"],"sources":["../src/vue.js"],"sourcesContent":["/**\n * Copyright IBM Corp. 2016, 2018\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport addons, { makeDecorator } from '@storybook/addons';\nimport {\n  CARBON_CURRENT_THEME,\n  CARBON_THEME_PARAM,\n  WITH_CARBON_THEME,\n} from './shared';\n\nconst Wrapper = (getStory, context, { parameters }) => {\n  const channel = addons.getChannel();\n\n  const setCarbonTheme = (theme) => {\n    document.documentElement.setAttribute('storybook-carbon-theme', theme);\n  };\n\n  return {\n    template: `<story/>`,\n    mounted() {\n      channel.on(CARBON_CURRENT_THEME, setCarbonTheme);\n      setCarbonTheme(parameters.value);\n    },\n  };\n};\n\n// export decorator\nexport const withCarbonTheme = makeDecorator({\n  name: WITH_CARBON_THEME,\n  parameterName: CARBON_THEME_PARAM,\n  wrapper: Wrapper,\n});\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA,OAAOA,MAAM,IAAIC,aAAa,QAAQ,mBAAmB;AACzD,SACEC,oBAAoB,EACpBC,kBAAkB,EAClBC,iBAAiB,QACZ,UAAU;AAEjB,MAAMC,OAAO,GAAGA,CAACC,QAAQ,EAAEC,OAAO,EAAE;EAAEC;AAAW,CAAC,KAAK;EACrD,MAAMC,OAAO,GAAGT,MAAM,CAACU,UAAU,CAAC,CAAC;EAEnC,MAAMC,cAAc,GAAIC,KAAK,IAAK;IAChCC,QAAQ,CAACC,eAAe,CAACC,YAAY,CAAC,wBAAwB,EAAEH,KAAK,CAAC;EACxE,CAAC;EAED,OAAO;IACLI,QAAQ,EAAG,UAAS;IACpBC,OAAOA,CAAA,EAAG;MACRR,OAAO,CAACS,EAAE,CAAChB,oBAAoB,EAAES,cAAc,CAAC;MAChDA,cAAc,CAACH,UAAU,CAACW,KAAK,CAAC;IAClC;EACF,CAAC;AACH,CAAC;;AAED;AACA,OAAO,MAAMC,eAAe,GAAGnB,aAAa,CAAC;EAC3CoB,IAAI,EAAEjB,iBAAiB;EACvBkB,aAAa,EAAEnB,kBAAkB;EACjCoB,OAAO,EAAElB;AACX,CAAC,CAAC"}