@storybook/components 6.5.0-alpha.2 → 6.5.0-alpha.23

package/dist/esm/tooltip/TooltipNote.js

@@ -1,10 +1,12 @@
+import "core-js/modules/es.object.keys.js";
+import "core-js/modules/es.symbol.js";
+var _excluded = ["note"];
+
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
 import "core-js/modules/es.string.bold.js";
-import "core-js/modules/es.object.keys.js";
-import "core-js/modules/es.symbol.js";
 import React from 'react';
 import { styled } from '@storybook/theming';
 var Note = styled.div(function (_ref) {
@@ -26,7 +28,7 @@ var Note = styled.div(function (_ref) {
 });
 export var TooltipNote = function TooltipNote(_ref2) {
   var note = _ref2.note,
-      props = _objectWithoutProperties(_ref2, ["note"]);
+      props = _objectWithoutProperties(_ref2, _excluded);
 
   return /*#__PURE__*/React.createElement(Note, props, note);
 };

package/dist/esm/tooltip/WithTooltip.js

@@ -4,16 +4,19 @@ import "core-js/modules/es.object.keys.js";
 import "core-js/modules/es.symbol.js";
 import "core-js/modules/es.object.assign.js";
 import "core-js/modules/es.symbol.description.js";
-import "core-js/modules/es.object.to-string.js";
 import "core-js/modules/es.symbol.iterator.js";
 import "core-js/modules/es.array.iterator.js";
 import "core-js/modules/web.dom-collections.iterator.js";
 import "core-js/modules/es.function.name.js";
+import "core-js/modules/es.regexp.exec.js";
+var _excluded = ["svg", "trigger", "closeOnClick", "placement", "modifiers", "hasChrome", "tooltip", "children", "tooltipShown", "onVisibilityChange"],
+    _excluded2 = ["startOpen", "onVisibilityChange"];
 
 var _templateObject, _templateObject2;
 
 import "core-js/modules/es.array.from.js";
 import "core-js/modules/es.string.iterator.js";
+import "core-js/modules/es.object.to-string.js";
 import "core-js/modules/web.dom-collections.for-each.js";
 
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
@@ -24,7 +27,7 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
-function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
@@ -62,7 +65,7 @@ var WithTooltipPure = function WithTooltipPure(_ref) {
       children = _ref.children,
       tooltipShown = _ref.tooltipShown,
       onVisibilityChange = _ref.onVisibilityChange,
-      props = _objectWithoutProperties(_ref, ["svg", "trigger", "closeOnClick", "placement", "modifiers", "hasChrome", "tooltip", "children", "tooltipShown", "onVisibilityChange"]);
+      props = _objectWithoutProperties(_ref, _excluded);
 
   var Container = svg ? TargetSvgContainer : TargetContainer;
   return /*#__PURE__*/React.createElement(TooltipTrigger, {
@@ -131,7 +134,7 @@ WithTooltipPure.defaultProps = {
 var WithToolTipState = function WithToolTipState(_ref4) {
   var startOpen = _ref4.startOpen,
       onChange = _ref4.onVisibilityChange,
-      rest = _objectWithoutProperties(_ref4, ["startOpen", "onVisibilityChange"]);
+      rest = _objectWithoutProperties(_ref4, _excluded2);
 
   var _useState = useState(startOpen || false),
       _useState2 = _slicedToArray(_useState, 2),

package/dist/esm/tooltip/lazy-WithTooltip.js

@@ -1,5 +1,5 @@
-import "core-js/modules/es.promise.js";
 import "core-js/modules/es.object.to-string.js";
+import "core-js/modules/es.promise.js";
 import React, { Suspense } from 'react';
 var LazyWithTooltip = /*#__PURE__*/React.lazy(function () {
   return import('./WithTooltip').then(function (mod) {

package/dist/esm/typings.d.ts

@@ -0,0 +1,4 @@
+declare module 'global';
+declare module 'markdown-to-jsx';
+declare module '*.md';
+declare module '@storybook/semver';

package/dist/esm/typography/DocumentFormatting.js

@@ -1,13 +1,18 @@
+import "core-js/modules/es.object.keys.js";
+import "core-js/modules/es.symbol.js";
+var _excluded = ["href", "children"],
+    _excluded2 = ["className", "children"];
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+import "core-js/modules/es.regexp.exec.js";
 import "core-js/modules/es.object.assign.js";
 import "core-js/modules/es.string.match.js";
-import "core-js/modules/es.regexp.exec.js";
+import "core-js/modules/es.object.to-string.js";
+import "core-js/modules/es.promise.js";
 import "core-js/modules/es.array.filter.js";
 import "core-js/modules/es.array.join.js";
 import "core-js/modules/es.array.concat.js";
-import "core-js/modules/es.object.keys.js";
-import "core-js/modules/es.symbol.js";
-
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 
@@ -101,7 +106,7 @@ export var Pre = styled.pre(withReset, withMargin, function (_ref7) {
 var Link = function Link(_ref8) {
   var input = _ref8.href,
       children = _ref8.children,
-      props = _objectWithoutProperties(_ref8, ["href", "children"]);
+      props = _objectWithoutProperties(_ref8, _excluded);
 
   var isStorybookPath = /^\//.test(input);
   var isAnchorUrl = /^#.*/.test(input);
@@ -377,7 +382,7 @@ export var Code = function Code(_ref17) {
 
   var className = _ref17.className,
       children = _ref17.children,
-      props = _objectWithoutProperties(_ref17, ["className", "children"]);
+      props = _objectWithoutProperties(_ref17, _excluded2);
 
   var language = (className || '').match(/lang-(\S+)/);
   var childrenArray = React.Children.toArray(children);

package/dist/esm/typography/link/link.js

@@ -1,6 +1,7 @@
 import "core-js/modules/es.object.keys.js";
 import "core-js/modules/es.symbol.js";
 import "core-js/modules/es.object.assign.js";
+var _excluded = ["cancel", "children", "onClick", "withArrow", "containsIcon", "className"];
 
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
@@ -163,7 +164,7 @@ export var Link = function Link(_ref8) {
       withArrow = _ref8.withArrow,
       containsIcon = _ref8.containsIcon,
       className = _ref8.className,
-      rest = _objectWithoutProperties(_ref8, ["cancel", "children", "onClick", "withArrow", "containsIcon", "className"]);
+      rest = _objectWithoutProperties(_ref8, _excluded);
 
   return /*#__PURE__*/React.createElement(A, _extends({}, rest, {
     onClick: onClick && cancel ? function (e) {

package/dist/esm/utils/getStoryHref.js

@@ -0,0 +1,46 @@
+import "core-js/modules/es.regexp.exec.js";
+import "core-js/modules/es.string.split.js";
+import "core-js/modules/es.object.assign.js";
+import "core-js/modules/es.array.concat.js";
+import "core-js/modules/es.symbol.js";
+import "core-js/modules/es.symbol.description.js";
+import "core-js/modules/es.object.to-string.js";
+import "core-js/modules/es.symbol.iterator.js";
+import "core-js/modules/es.array.iterator.js";
+import "core-js/modules/es.string.iterator.js";
+import "core-js/modules/web.dom-collections.iterator.js";
+import "core-js/modules/es.array.slice.js";
+import "core-js/modules/es.function.name.js";
+import "core-js/modules/es.array.from.js";
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+import qs from 'qs';
+export var getStoryHref = function getStoryHref(baseUrl, storyId) {
+  var additionalParams = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+
+  var _baseUrl$split = baseUrl.split('?'),
+      _baseUrl$split2 = _slicedToArray(_baseUrl$split, 2),
+      url = _baseUrl$split2[0],
+      paramsStr = _baseUrl$split2[1];
+
+  var params = paramsStr ? Object.assign({}, qs.parse(paramsStr), additionalParams, {
+    id: storyId
+  }) : Object.assign({}, additionalParams, {
+    id: storyId
+  });
+  return "".concat(url).concat(qs.stringify(params, {
+    addQueryPrefix: true,
+    encode: false
+  }));
+};

package/dist/modern/ActionBar/ActionBar.js

@@ -1,3 +1,5 @@
+const _excluded = ["actionItems"];
+
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
 import React from 'react';
@@ -50,11 +52,11 @@ export const ActionButton = styled.button(({
   opacity: 0.5
 });
 ActionButton.displayName = 'ActionButton';
-export const ActionBar = (_ref) => {
+export const ActionBar = _ref => {
   let {
     actionItems
   } = _ref,
-      props = _objectWithoutPropertiesLoose(_ref, ["actionItems"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   return /*#__PURE__*/React.createElement(Container, props, actionItems.map(({
     title,

package/dist/modern/Badge/Badge.js

@@ -71,7 +71,7 @@ const BadgeWrapper = styled.div(({
       }
   }
 });
-export const Badge = (_ref) => {
+export const Badge = _ref => {
   let props = Object.assign({}, _ref);
   return /*#__PURE__*/React.createElement(BadgeWrapper, props);
 };

package/dist/modern/Button/Button.js

@@ -1,3 +1,5 @@
+const _excluded = ["isLink", "children"];
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -213,7 +215,7 @@ export const Button = Object.assign( /*#__PURE__*/forwardRef((_ref, ref) => {
     isLink,
     children
   } = _ref,
-      props = _objectWithoutPropertiesLoose(_ref, ["isLink", "children"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   if (isLink) {
     return /*#__PURE__*/React.createElement(ButtonLink, _extends({}, props, {

package/dist/modern/Loader/Loader.js

@@ -1,3 +1,5 @@
+const _excluded = ["progress", "error", "size"];
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -98,13 +100,13 @@ const Ellipsis = styled.span({
     height: 'auto'
   }
 });
-export const PureLoader = (_ref) => {
+export const PureLoader = _ref => {
   let {
     progress,
     error,
     size
   } = _ref,
-      props = _objectWithoutPropertiesLoose(_ref, ["progress", "error", "size"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   if (error) {
     return /*#__PURE__*/React.createElement(ProgressWrapper, _extends({

package/dist/modern/ScrollArea/OverlayScrollbars.js

@@ -1,3 +1,5 @@
+const _excluded = ["options", "extensions", "className", "children"];
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -11,14 +13,14 @@ import OverlayScrollbars from 'overlayscrollbars';
  * A PR is submitted that may fix this:
  * https://github.com/KingSora/OverlayScrollbars/pull/218
  * */
-export const OverlayScrollbarsComponent = (_ref) => {
+export const OverlayScrollbarsComponent = _ref => {
   let {
     options = {},
     extensions,
     className,
     children
   } = _ref,
-      rest = _objectWithoutPropertiesLoose(_ref, ["options", "extensions", "className", "children"]);
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   const osTargetRef = React.useRef();
   const osInstance = React.useRef();

package/dist/modern/ScrollArea/ScrollArea.js

@@ -1,3 +1,5 @@
+const _excluded = ["horizontal", "vertical"];
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -7,8 +9,8 @@ import { styled } from '@storybook/theming';
 const GlobalScrollAreaStyles = /*#__PURE__*/React.lazy(() => import('./GlobalScrollAreaStyles'));
 const OverlayScrollbars = /*#__PURE__*/React.lazy(() => import('./OverlayScrollbars'));
 
-const Scroller = (_ref) => {
-  let props = _objectWithoutPropertiesLoose(_ref, ["horizontal", "vertical"]);
+const Scroller = _ref => {
+  let props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   return /*#__PURE__*/React.createElement(Suspense, {
     fallback: /*#__PURE__*/React.createElement("div", props)

package/dist/modern/bar/bar.js

@@ -1,3 +1,5 @@
+const _excluded = ["children", "backgroundColor"];
+
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
 import React, { Children } from 'react';
@@ -60,12 +62,12 @@ const BarInner = styled.div(({
   height: 40,
   backgroundColor: bgColor || ''
 }));
-export const FlexBar = (_ref) => {
+export const FlexBar = _ref => {
   let {
     children,
     backgroundColor
   } = _ref,
-      rest = _objectWithoutPropertiesLoose(_ref, ["children", "backgroundColor"]);
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   const [left, right] = Children.toArray(children);
   return /*#__PURE__*/React.createElement(Bar, rest, /*#__PURE__*/React.createElement(BarInner, {

package/dist/modern/bar/button.js

@@ -1,3 +1,5 @@
+const _excluded = ["children"];
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -7,11 +9,11 @@ import { styled, isPropValid } from '@storybook/theming';
 import { transparentize } from 'polished';
 import { auto } from '@popperjs/core';
 
-const ButtonOrLink = (_ref) => {
+const ButtonOrLink = _ref => {
   let {
     children
   } = _ref,
-      restProps = _objectWithoutPropertiesLoose(_ref, ["children"]);
+      restProps = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   return restProps.href != null ? /*#__PURE__*/React.createElement("a", restProps, children) : /*#__PURE__*/React.createElement("button", _extends({
     type: "button"

package/dist/modern/blocks/ArgsTable/TabbedArgsTable.js

@@ -1,3 +1,5 @@
+const _excluded = ["tabs"];
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -5,11 +7,11 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 import React from 'react';
 import { ArgsTable } from './ArgsTable';
 import { TabsState } from '../../tabs/tabs';
-export const TabbedArgsTable = (_ref) => {
+export const TabbedArgsTable = _ref => {
   let {
     tabs
   } = _ref,
-      props = _objectWithoutPropertiesLoose(_ref, ["tabs"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   const entries = Object.entries(tabs);
 

package/dist/modern/blocks/ColorPalette.js

@@ -1,3 +1,5 @@
+const _excluded = ["children"];
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -162,11 +164,11 @@ ColorItem.displayName = "ColorItem";
  * Styleguide documentation for colors, including names, captions, and color swatches,
  * all specified as `ColorItem` children of this wrapper component.
  */
-export const ColorPalette = (_ref) => {
+export const ColorPalette = _ref => {
   let {
     children
   } = _ref,
-      props = _objectWithoutPropertiesLoose(_ref, ["children"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   return /*#__PURE__*/React.createElement(ResetWrapper, null, /*#__PURE__*/React.createElement(List, _extends({}, props, {
     className: "docblock-colorpalette"

package/dist/modern/blocks/IFrame.js

@@ -1,3 +1,5 @@
+const _excluded = ["id", "title", "src", "allowFullScreen", "scale"];
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -49,7 +51,7 @@ export class IFrame extends Component {
       src,
       allowFullScreen
     } = _this$props,
-          rest = _objectWithoutPropertiesLoose(_this$props, ["id", "title", "src", "allowFullScreen", "scale"]);
+          rest = _objectWithoutPropertiesLoose(_this$props, _excluded);
 
     return /*#__PURE__*/React.createElement("iframe", _extends({
       id: id,

package/dist/modern/blocks/IconGallery.js

@@ -1,3 +1,5 @@
+const _excluded = ["children"];
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -55,11 +57,11 @@ IconItem.displayName = "IconItem";
 /**
  * Show a grid of icons, as specified by `IconItem`.
  */
-export const IconGallery = (_ref) => {
+export const IconGallery = _ref => {
   let {
     children
   } = _ref,
-      props = _objectWithoutPropertiesLoose(_ref, ["children"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   return /*#__PURE__*/React.createElement(ResetWrapper, null, /*#__PURE__*/React.createElement(List, _extends({}, props, {
     className: "docblock-icongallery"

package/dist/modern/blocks/Preview.js

@@ -1,3 +1,5 @@
+const _excluded = ["isLoading", "isColumn", "columns", "children", "withSource", "withToolbar", "isExpanded", "additionalActions", "className"];
+
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
 import "core-js/modules/es.array.reduce.js";
@@ -178,7 +180,7 @@ const getLayout = children => {
  */
 
 
-export const Preview = (_ref) => {
+export const Preview = _ref => {
   let {
     isLoading,
     isColumn,
@@ -190,7 +192,7 @@ export const Preview = (_ref) => {
     additionalActions,
     className
   } = _ref,
-      props = _objectWithoutPropertiesLoose(_ref, ["isLoading", "isColumn", "columns", "children", "withSource", "withToolbar", "isExpanded", "additionalActions", "className"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   const [expanded, setExpanded] = useState(isExpanded);
   const {

package/dist/modern/blocks/Source.js

@@ -1,3 +1,5 @@
+const _excluded = ["language", "code", "dark", "format"];
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -90,7 +92,7 @@ const Source = props => {
     dark,
     format
   } = _ref,
-        rest = _objectWithoutPropertiesLoose(_ref, ["language", "code", "dark", "format"]);
+        rest = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   const syntaxHighlighter = /*#__PURE__*/React.createElement(StyledSyntaxHighlighter, _extends({
     bordered: true,

package/dist/modern/blocks/Story.js

@@ -1,11 +1,18 @@
+const _excluded = ["children", "error", "inline"];
+
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
+import global from 'global';
 import React, { createElement, Fragment } from 'react';
 import { IFrame } from './IFrame';
 import { EmptyBlock } from './EmptyBlock';
 import { ZoomContext } from './ZoomContext';
 import { Loader } from '..';
-const BASE_URL = 'iframe.html';
+import { getStoryHref } from '../utils/getStoryHref';
+const {
+  PREVIEW_URL
+} = global;
+const BASE_URL = PREVIEW_URL || 'iframe.html';
 export let StoryError;
 /** error message for Story with null storyFn
  * if the story id exists, it must be pointing to a non-existing story
@@ -42,7 +49,9 @@ const IFrameStory = ({
     key: "iframe",
     id: `iframe--${id}`,
     title: title,
-    src: `${BASE_URL}?id=${id}&viewMode=story`,
+    src: getStoryHref(BASE_URL, id, {
+      viewMode: 'story'
+    }),
     allowFullScreen: true,
     scale: scale,
     style: {
@@ -59,12 +68,12 @@ IFrameStory.displayName = "IFrameStory";
  * A story element, either rendered inline or in an iframe,
  * with configurable height.
  */
-const Story = (_ref) => {
+const Story = _ref => {
   let {
     error,
     inline
   } = _ref,
-      props = _objectWithoutPropertiesLoose(_ref, ["children", "error", "inline"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   const {
     id,

package/dist/modern/blocks/Toolbar.js

@@ -1,3 +1,5 @@
+const _excluded = ["isLoading", "storyId", "baseUrl", "zoom", "resetZoom"];
+
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
 import React, { Fragment } from 'react';
@@ -5,6 +7,7 @@ import { styled } from '@storybook/theming';
 import { FlexBar } from '../bar/bar';
 import { Icons } from '../icon/icon';
 import { IconButton, IconButtonSkeleton } from '../bar/button';
+import { getStoryHref } from '../utils/getStoryHref';
 
 const Zoom = ({
   zoom,
@@ -43,7 +46,7 @@ const Eject = ({
   storyId
 }) => /*#__PURE__*/React.createElement(IconButton, {
   key: "opener",
-  href: `${baseUrl}?id=${storyId}`,
+  href: getStoryHref(baseUrl, storyId),
   target: "_blank",
   title: "Open canvas in new tab"
 }, /*#__PURE__*/React.createElement(Icons, {
@@ -58,7 +61,7 @@ const Bar = styled(FlexBar)({
   top: 0,
   transition: 'transform .2s linear'
 });
-export const Toolbar = (_ref) => {
+export const Toolbar = _ref => {
   let {
     isLoading,
     storyId,
@@ -66,7 +69,7 @@ export const Toolbar = (_ref) => {
     zoom,
     resetZoom
   } = _ref,
-      rest = _objectWithoutPropertiesLoose(_ref, ["isLoading", "storyId", "baseUrl", "zoom", "resetZoom"]);
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   return /*#__PURE__*/React.createElement(Bar, rest, /*#__PURE__*/React.createElement(Fragment, {
     key: "left"

package/dist/modern/blocks/Typeset.js

@@ -1,3 +1,5 @@
+const _excluded = ["fontFamily", "fontSizes", "fontWeight", "sampleText"];
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -38,14 +40,14 @@ const Wrapper = styled.div(withReset, ({
  * Convenient styleguide documentation showing examples of type
  * with different sizes and weights and configurable sample text.
  */
-export const Typeset = (_ref) => {
+export const Typeset = _ref => {
   let {
     fontFamily,
     fontSizes,
     fontWeight,
     sampleText
   } = _ref,
-      props = _objectWithoutPropertiesLoose(_ref, ["fontFamily", "fontSizes", "fontWeight", "sampleText"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   return /*#__PURE__*/React.createElement(Wrapper, _extends({}, props, {
     className: "docblock-typeset"

package/dist/modern/brand/StorybookIcon.js

@@ -1,7 +1,7 @@
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 import React from 'react';
-export const StorybookIcon = (_ref) => {
+export const StorybookIcon = _ref => {
   let props = Object.assign({}, _ref);
   return /*#__PURE__*/React.createElement("svg", _extends({
     viewBox: "0 0 64 64"

package/dist/modern/brand/StorybookLogo.js

@@ -1,13 +1,15 @@
+const _excluded = ["alt"];
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
 import React from 'react';
-export const StorybookLogo = (_ref) => {
+export const StorybookLogo = _ref => {
   let {
     alt
   } = _ref,
-      props = _objectWithoutPropertiesLoose(_ref, ["alt"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   return /*#__PURE__*/React.createElement("svg", _extends({
     width: "200px",

package/dist/modern/controls/Color.js

@@ -1,3 +1,5 @@
+const _excluded = ["value", "active", "onClick", "style"];
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -59,14 +61,14 @@ const SwatchColor = styled.div(({
 }));
 const swatchBackground = `url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill-opacity=".05"><path d="M8 0h8v8H8zM0 8h8v8H0z"/></svg>')`;
 
-const Swatch = (_ref) => {
+const Swatch = _ref => {
   let {
     value,
     active,
     onClick,
     style
   } = _ref,
-      props = _objectWithoutPropertiesLoose(_ref, ["value", "active", "onClick", "style"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   const backgroundImage = `linear-gradient(${value}, ${value}), ${swatchBackground}, linear-gradient(#fff, #fff)`;
   return /*#__PURE__*/React.createElement(SwatchColor, _extends({}, props, {