@dfds-ui/storybook-design 2.2.1 → 3.0.0

package/markdown/Markdown.js

@@ -1,55 +1,18 @@
-var _excluded = ["children"];
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-function _extends() { _extends = Object.assign ? Object.assign.bind() : 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; }
-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; }
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import React from 'react';
-import ReactMarkdown from 'react-markdown';
-import renderers from 'react-markdown-github-renderers';
-
-// the ListItem renderer from react-markdown-github-renderers does not render checkboxes so we create our own
-import { jsx as ___EmotionJSX } from "@emotion/react";
-var ListItemRenderer = function ListItemRenderer(props) {
-  var checkbox = null;
-  if (props.checked !== null) {
-    var checked = props.checked;
-    checkbox = /*#__PURE__*/React.createElement('input', {
-      type: 'checkbox',
-      checked: checked,
-      readOnly: true,
-      style: {
-        margin: '4px'
-      }
-    });
-  }
-  return /*#__PURE__*/React.createElement('li', {
-    style: {
-      marginTop: 4,
-      lineHeight: 1.5
-    }
-  }, checkbox, props.children);
-};
-var TableRenderer = function TableRenderer(props) {
-  return /*#__PURE__*/React.createElement('table', {
-    className: 'markdown-table'
-  }, props.children);
-};
-var customRenderers = _objectSpread(_objectSpread({}, renderers), {}, {
-  listItem: ListItemRenderer,
-  table: TableRenderer
+import { marked } from 'marked';
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+marked.setOptions({
+  gfm: true,
+  breaks: false
 });
 var Markdown = function Markdown(_ref) {
-  var children = _ref.children,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  return ___EmotionJSX(ReactMarkdown, _extends({
-    escapeHtml: false,
-    source: children,
-    renderers: customRenderers
-  }, rest));
+  var children = _ref.children;
+  var html = marked.parse(children);
+  return _jsx("div", {
+    className: "markdown-body",
+    dangerouslySetInnerHTML: {
+      __html: html
+    }
+  });
 };
 export default Markdown;

package/markdown/Md.d.ts

@@ -1,2 +1,3 @@
-export declare const Md: (strings: TemplateStringsArray, ...values: string[]) => JSX.Element;
+import React from 'react';
+export declare const Md: (strings: TemplateStringsArray, ...values: string[]) => React.JSX.Element;
 export default Md;

package/markdown/Md.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import Markdown from './Markdown';
-import { jsx as ___EmotionJSX } from "@emotion/react";
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
 export var Md = function Md(strings) {
   for (var _len = arguments.length, values = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
     values[_key - 1] = arguments[_key];
@@ -8,6 +8,8 @@ export var Md = function Md(strings) {
   var source = strings.reduce(function (res, str, i) {
     return "".concat(res).concat(str).concat(values[i] || '');
   });
-  return ___EmotionJSX(Markdown, null, source);
+  return _jsx(Markdown, {
+    children: source
+  });
 };
 export default Md;

package/package.json

@@ -3,22 +3,21 @@
   "description": "Components and utils for use with Storybook within DFDS",
   "license": "MIT",
   "private": false,
-  "version": "2.2.1",
+  "version": "3.0.0",
   "sideEffects": false,
   "main": "./cjs/index.js",
   "module": "./index.js",
   "esnext": "./index.js",
   "typings": "./index.d.ts",
   "peerDependencies": {
-    "@emotion/react": "11.11.4",
-    "@emotion/styled": "11.11.5"
+    "@emotion/react": "11.14.0",
+    "@emotion/styled": "11.14.1"
   },
   "dependencies": {
-    "@dfds-ui/icons": "2.2.1",
-    "react-markdown": "^5.0.3",
-    "react-markdown-github-renderers": "^1.0.3"
+    "@dfds-ui/icons": "3.0.0",
+    "marked": "18.0.3"
   },
-  "gitHead": "ff968cd26c278c656e617042759efdea213c0661",
+  "gitHead": "35ec63ee8364ec7145ae710c4f0db9e1d602b05d",
   "publishConfig": {
     "access": "public"
   }

package/cjs/components/GlobalStorybookStyles.d.ts

@@ -1,2 +0,0 @@
-declare const GlobalStorybookStyles: () => JSX.Element;
-export default GlobalStorybookStyles;

package/cjs/components/GlobalStorybookStyles.js

@@ -1,28 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _react2 = require("@emotion/react");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
-var _ref = process.env.NODE_ENV === "production" ? {
-  name: "ka24jl",
-  styles: "html,body{font-size:16px;background-color:#fcfcfd;}.docblock-source{border-radius:0!important;background-color:#ffffff!important;box-shadow:none!important;}.docblock-propstable{margin:16px 0!important;th{padding:6px 13px!important;border:1px solid rgba(0, 0, 0, 0.1)!important;color:black!important;border-radius:0!important;}tr{background-color:#fff!important;}tbody{box-shadow:none!important;}td{background-color:transparent!important;padding:6px 13px!important;border:0!important;border-top:1px solid rgba(0, 0, 0, 0.1)!important;&:first-of-type{span:first-of-type{border:1px solid #eee;padding:3px 5px;background-color:#f8f8f8;font-family:monospace;font-weight:normal;}}&:nth-of-type(2){width:60%;& div:last-of-type{span{color:#0000ff;font-size:12px;}}}}}.markdown-table{border:1px solid #b0afaf;font-size:14px;thead{text-align:left;font-weight:bold;}tr:nth-of-type(even){background-color:#f8f8f8;}td,th{border:1px solid #b0afaf;padding:10px;code{padding:1px!important;}}}"
-} : {
-  name: "1ooil5x-styles",
-  styles: "html,body{font-size:16px;background-color:#fcfcfd;}.docblock-source{border-radius:0!important;background-color:#ffffff!important;box-shadow:none!important;}.docblock-propstable{margin:16px 0!important;th{padding:6px 13px!important;border:1px solid rgba(0, 0, 0, 0.1)!important;color:black!important;border-radius:0!important;}tr{background-color:#fff!important;}tbody{box-shadow:none!important;}td{background-color:transparent!important;padding:6px 13px!important;border:0!important;border-top:1px solid rgba(0, 0, 0, 0.1)!important;&:first-of-type{span:first-of-type{border:1px solid #eee;padding:3px 5px;background-color:#f8f8f8;font-family:monospace;font-weight:normal;}}&:nth-of-type(2){width:60%;& div:last-of-type{span{color:#0000ff;font-size:12px;}}}}}.markdown-table{border:1px solid #b0afaf;font-size:14px;thead{text-align:left;font-weight:bold;}tr:nth-of-type(even){background-color:#f8f8f8;}td,th{border:1px solid #b0afaf;padding:10px;code{padding:1px!important;}}};label:styles;",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0dsb2JhbFN0b3J5Ym9va1N0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBSW9CIiwiZmlsZSI6Ii4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0dsb2JhbFN0b3J5Ym9va1N0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBHbG9iYWwsIGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xuXG5jb25zdCBHbG9iYWxTdG9yeWJvb2tTdHlsZXMgPSAoKSA9PiB7XG4gIGNvbnN0IHN0eWxlcyA9IGNzc2BcbiAgICBodG1sLFxuICAgIGJvZHkge1xuICAgICAgZm9udC1zaXplOiAxNnB4O1xuICAgICAgYmFja2dyb3VuZC1jb2xvcjogI2ZjZmNmZDtcbiAgICB9XG4gICAgLyogc3R5bGVsaW50LWRpc2FibGUgKi9cbiAgICAuZG9jYmxvY2stc291cmNlIHtcbiAgICAgIGJvcmRlci1yYWRpdXM6IDAgIWltcG9ydGFudDtcbiAgICAgIGJhY2tncm91bmQtY29sb3I6ICNmZmZmZmYgIWltcG9ydGFudDtcbiAgICAgIGJveC1zaGFkb3c6IG5vbmUgIWltcG9ydGFudDtcbiAgICB9XG5cbiAgICAuZG9jYmxvY2stcHJvcHN0YWJsZSB7XG4gICAgICBtYXJnaW46IDE2cHggMCAhaW1wb3J0YW50O1xuICAgICAgdGgge1xuICAgICAgICBwYWRkaW5nOiA2cHggMTNweCAhaW1wb3J0YW50O1xuICAgICAgICBib3JkZXI6IDFweCBzb2xpZCByZ2JhKDAsIDAsIDAsIDAuMSkgIWltcG9ydGFudDtcbiAgICAgICAgY29sb3I6IGJsYWNrICFpbXBvcnRhbnQ7XG4gICAgICAgIGJvcmRlci1yYWRpdXM6IDAgIWltcG9ydGFudDtcbiAgICAgIH1cbiAgICAgIHRyIHtcbiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogI2ZmZiAhaW1wb3J0YW50O1xuICAgICAgfVxuICAgICAgLyogdHI6bnRoLW9mLXR5cGUoZXZlbikge1xuICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjZjhmOGY4ICFpbXBvcnRhbnQ7XG4gICAgICB9ICovXG4gICAgICB0Ym9keSB7XG4gICAgICAgIGJveC1zaGFkb3c6IG5vbmUgIWltcG9ydGFudDtcbiAgICAgIH1cbiAgICAgIHRkIHtcbiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQgIWltcG9ydGFudDtcbiAgICAgICAgcGFkZGluZzogNnB4IDEzcHggIWltcG9ydGFudDtcbiAgICAgICAgYm9yZGVyOiAwICFpbXBvcnRhbnQ7XG4gICAgICAgIGJvcmRlci10b3A6IDFweCBzb2xpZCByZ2JhKDAsIDAsIDAsIDAuMSkgIWltcG9ydGFudDtcbiAgICAgICAgJjpmaXJzdC1vZi10eXBlIHtcbiAgICAgICAgICBzcGFuOmZpcnN0LW9mLXR5cGUge1xuICAgICAgICAgICAgYm9yZGVyOiAxcHggc29saWQgI2VlZTtcbiAgICAgICAgICAgIHBhZGRpbmc6IDNweCA1cHg7XG4gICAgICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjZjhmOGY4O1xuICAgICAgICAgICAgZm9udC1mYW1pbHk6IG1vbm9zcGFjZTtcbiAgICAgICAgICAgIGZvbnQtd2VpZ2h0OiBub3JtYWw7XG4gICAgICAgICAgfVxuICAgICAgICB9XG4gICAgICAgICY6bnRoLW9mLXR5cGUoMikge1xuICAgICAgICAgIHdpZHRoOiA2MCU7XG4gICAgICAgICAgJiBkaXY6bGFzdC1vZi10eXBlIHtcbiAgICAgICAgICAgIHNwYW4ge1xuICAgICAgICAgICAgICBjb2xvcjogIzAwMDBmZjtcbiAgICAgICAgICAgICAgZm9udC1zaXplOiAxMnB4O1xuICAgICAgICAgICAgfVxuICAgICAgICAgIH1cbiAgICAgICAgfVxuICAgICAgfVxuICAgIH1cblxuICAgIC8qIHN0eWxlbGludC1lbmFibGUgKi9cblxuICAgIC5tYXJrZG93bi10YWJsZSB7XG4gICAgICBib3JkZXI6IDFweCBzb2xpZCAjYjBhZmFmO1xuICAgICAgZm9udC1zaXplOiAxNHB4O1xuXG4gICAgICB0aGVhZCB7XG4gICAgICAgIHRleHQtYWxpZ246IGxlZnQ7XG4gICAgICAgIGZvbnQtd2VpZ2h0OiBib2xkO1xuICAgICAgfVxuXG4gICAgICB0cjpudGgtb2YtdHlwZShldmVuKSB7XG4gICAgICAgIGJhY2tncm91bmQtY29sb3I6ICNmOGY4Zjg7XG4gICAgICB9XG5cbiAgICAgIHRkLFxuICAgICAgdGgge1xuICAgICAgICBib3JkZXI6IDFweCBzb2xpZCAjYjBhZmFmO1xuICAgICAgICBwYWRkaW5nOiAxMHB4O1xuICAgICAgICBjb2RlIHtcbiAgICAgICAgICAvKiBzdHlsZWxpbnQtZGlzYWJsZSAqL1xuICAgICAgICAgIHBhZGRpbmc6IDFweCAhaW1wb3J0YW50O1xuICAgICAgICAgIC8qIHN0eWxlbGludC1lbmFibGUgKi9cbiAgICAgICAgfVxuICAgICAgfVxuICAgIH1cbiAgYFxuICByZXR1cm4gPEdsb2JhbCBkYXRhLXRlc3Q9XCJ0ZXN0LXRoaW5nXCIgc3R5bGVzPXtzdHlsZXN9IC8+XG59XG5cbmV4cG9ydCBkZWZhdWx0IEdsb2JhbFN0b3J5Ym9va1N0eWxlc1xuIl19 */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-};
-const GlobalStorybookStyles = () => {
-  const styles = _ref;
-  return (0, _react2.jsx)(_react2.Global, {
-    "data-test": "test-thing",
-    styles: styles
-  });
-};
-var _default = GlobalStorybookStyles;
-exports.default = _default;

package/cjs/components/MarkdownStory.d.ts

@@ -1,8 +0,0 @@
-declare type MarkdownStoryProps = {
-    file: string;
-    content: Promise<{
-        default: string;
-    }>;
-};
-declare const MarkdownStory: ({ file, content }: MarkdownStoryProps) => JSX.Element;
-export default MarkdownStory;

package/cjs/components/MarkdownStory.js

@@ -1,42 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _ = require("./");
-var _markdown = require("../markdown");
-var _react2 = require("@emotion/react");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-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(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-const MarkdownStory = ({
-  file,
-  content
-}) => {
-  const _React$useState = _react.default.useState(true),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    loading = _React$useState2[0],
-    setLoading = _React$useState2[1];
-  const _React$useState3 = _react.default.useState(''),
-    _React$useState4 = _slicedToArray(_React$useState3, 2),
-    markdown = _React$useState4[0],
-    setMarkdown = _React$useState4[1];
-  _react.default.useEffect(() => {
-    void content.then(c => {
-      setMarkdown(c.default);
-      setLoading(false);
-    });
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-  return (0, _react2.jsx)(_.StoryPage, null, (0, _react2.jsx)(_.ExampleContainer, {
-    headline: file
-  }, (0, _react2.jsx)(_markdown.Markdown, null, loading ? `loading...` : markdown)));
-};
-var _default = MarkdownStory;
-exports.default = _default;

package/cjs/createDfdsTheme.d.ts

@@ -1 +0,0 @@
-export default function createDfdsTheme(title: string, logo: string): import("@storybook/theming").ThemeVars;

package/cjs/createDfdsTheme.js

@@ -1,14 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = createDfdsTheme;
-var _theming = require("@storybook/theming");
-function createDfdsTheme(title, logo) {
-  return (0, _theming.create)({
-    base: 'light',
-    brandTitle: title,
-    brandImage: logo
-  });
-}

package/cjs/helpers/components.d.ts

@@ -1,40 +0,0 @@
-import React, { ReactNode } from 'react';
-export declare type PreviewProps = {
-    children: React.ReactNode;
-    gray?: boolean;
-    height?: string;
-    width?: string;
-    className?: string;
-    mdxSource?: string;
-    sourcePath?: string;
-};
-export declare const Canvas: ({ gray, height, width, ...rest }: PreviewProps) => JSX.Element;
-/** @deprecated use Canvas */
-export declare const Preview: ({ gray, height, width, ...rest }: PreviewProps) => JSX.Element;
-export declare const Source: (props: any) => JSX.Element;
-export declare const LabWarningBanner: () => JSX.Element;
-export declare const DeprecatedBanner: ({ headline, children }: {
-    headline: string;
-    children: ReactNode;
-}) => JSX.Element;
-export declare const Meta: ({ title, ...rest }: any) => JSX.Element;
-export declare const DocsContainer: ({ children, ...rest }: any) => JSX.Element;
-export declare const ArgsTable: (props: any) => JSX.Element;
-/** @deprecated use ArgsTable */
-export declare const Props: (props: any) => JSX.Element;
-export declare const Story: (props: any) => JSX.Element;
-export declare const Description: (props: any) => JSX.Element;
-declare type StoryLinkProps = {
-    kind: string;
-    name: string;
-    mode?: 'docs' | 'canvas';
-    target?: '_self' | '_blank';
-    children?: React.ReactNode;
-};
-export declare const StoryLink: ({ kind, name, mode, target, children }: StoryLinkProps) => JSX.Element | null;
-export declare const DownloadButton: ({ children, href, className, }: {
-    children: React.ReactNode;
-    href: string;
-    className?: string | undefined;
-}) => JSX.Element;
-export {};