@dfds-ui/storybook-design 2.2.0-alpha.50e30e78 → 2.2.0-alpha.5e7ff910

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (41) hide show
  1. package/cjs/components/ExampleContainer.d.ts +8 -0
  2. package/cjs/components/ExampleContainer.js +15 -0
  3. package/cjs/components/Paper.d.ts +8 -0
  4. package/cjs/components/Paper.js +17 -0
  5. package/cjs/components/Placeholder.d.ts +8 -0
  6. package/cjs/components/Placeholder.js +21 -0
  7. package/cjs/components/StoryPage.d.ts +5 -0
  8. package/cjs/components/StoryPage.js +23 -0
  9. package/cjs/components/index.d.ts +4 -0
  10. package/cjs/components/index.js +34 -0
  11. package/cjs/index.d.ts +2 -0
  12. package/cjs/index.js +27 -0
  13. package/cjs/markdown/Markdown.d.ts +6 -0
  14. package/cjs/markdown/Markdown.js +26 -0
  15. package/cjs/markdown/Md.d.ts +3 -0
  16. package/cjs/markdown/Md.js +20 -0
  17. package/cjs/markdown/index.d.ts +2 -0
  18. package/cjs/markdown/index.js +20 -0
  19. package/cjs/mdx/index.js +3 -0
  20. package/cjs/mdx/mdxLoaderRenderer.js +17 -0
  21. package/components/ExampleContainer.d.ts +8 -0
  22. package/components/ExampleContainer.js +16 -0
  23. package/components/Paper.d.ts +8 -0
  24. package/components/Paper.js +11 -0
  25. package/components/Placeholder.d.ts +8 -0
  26. package/components/Placeholder.js +21 -0
  27. package/components/StoryPage.d.ts +5 -0
  28. package/components/StoryPage.js +16 -0
  29. package/components/index.d.ts +4 -0
  30. package/components/index.js +4 -0
  31. package/index.d.ts +2 -0
  32. package/index.js +2 -0
  33. package/markdown/Markdown.d.ts +6 -0
  34. package/markdown/Markdown.js +18 -0
  35. package/markdown/Md.d.ts +3 -0
  36. package/markdown/Md.js +15 -0
  37. package/markdown/index.d.ts +2 -0
  38. package/markdown/index.js +2 -0
  39. package/mdx/index.js +1 -0
  40. package/mdx/mdxLoaderRenderer.js +4 -0
  41. package/package.json +3 -3
@@ -0,0 +1,8 @@
1
+ declare const ExampleContainer: import("@emotion/styled").StyledComponent<{
2
+ theme?: import("@emotion/react").Theme;
3
+ as?: React.ElementType;
4
+ } & {
5
+ headline?: string;
6
+ dark?: boolean;
7
+ }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
8
+ export default ExampleContainer;
@@ -0,0 +1,15 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _base = _interopRequireDefault(require("@emotion/styled/base"));
8
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
9
+ const ExampleContainer = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
10
+ target: "e111yhd70"
11
+ } : {
12
+ target: "e111yhd70",
13
+ label: "ExampleContainer"
14
+ })("background-color:", p => p.dark ? '#002b45' : 'white', ";padding:25px 15px 15px;margin-bottom:16px;border:1px solid #f4f6f8;position:relative;::before{position:absolute;top:2px;content:'", p => p.headline || 'example', "';right:2px;font-size:10px;padding:4px 8px;color:", p => p.dark ? 'white' : 'black', ";background-color:", p => p.dark ? '#031c2b' : '#eee', ";text-transform:uppercase;letter-spacing:1.2px;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0V4YW1wbGVDb250YWluZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUUwRSIsImZpbGUiOiIuLi8uLi8uLi9zcmMvY29tcG9uZW50cy9FeGFtcGxlQ29udGFpbmVyLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuXG5jb25zdCBFeGFtcGxlQ29udGFpbmVyID0gc3R5bGVkLmRpdjx7IGhlYWRsaW5lPzogc3RyaW5nOyBkYXJrPzogYm9vbGVhbiB9PmBcbiAgYmFja2dyb3VuZC1jb2xvcjogJHsocCkgPT4gKHAuZGFyayA/ICcjMDAyYjQ1JyA6ICd3aGl0ZScpfTtcbiAgcGFkZGluZzogMjVweCAxNXB4IDE1cHg7XG4gIG1hcmdpbi1ib3R0b206IDE2cHg7XG4gIGJvcmRlcjogMXB4IHNvbGlkICNmNGY2Zjg7XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcblxuICA6OmJlZm9yZSB7XG4gICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgIHRvcDogMnB4O1xuICAgIGNvbnRlbnQ6ICckeyhwKSA9PiBwLmhlYWRsaW5lIHx8ICdleGFtcGxlJ30nO1xuICAgIHJpZ2h0OiAycHg7XG4gICAgZm9udC1zaXplOiAxMHB4O1xuICAgIHBhZGRpbmc6IDRweCA4cHg7XG4gICAgY29sb3I6ICR7KHApID0+IChwLmRhcmsgPyAnd2hpdGUnIDogJ2JsYWNrJyl9O1xuICAgIGJhY2tncm91bmQtY29sb3I6ICR7KHApID0+IChwLmRhcmsgPyAnIzAzMWMyYicgOiAnI2VlZScpfTtcbiAgICB0ZXh0LXRyYW5zZm9ybTogdXBwZXJjYXNlO1xuICAgIGxldHRlci1zcGFjaW5nOiAxLjJweDtcbiAgfVxuYFxuXG5leHBvcnQgZGVmYXVsdCBFeGFtcGxlQ29udGFpbmVyXG4iXX0= */"));
15
+ var _default = exports.default = ExampleContainer;
@@ -0,0 +1,8 @@
1
+ type PaperProps = {
2
+ width?: number | string;
3
+ };
4
+ declare const Paper: import("@emotion/styled").StyledComponent<{
5
+ theme?: import("@emotion/react").Theme;
6
+ as?: React.ElementType;
7
+ } & PaperProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
8
+ export default Paper;
@@ -0,0 +1,17 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _base = _interopRequireDefault(require("@emotion/styled/base"));
8
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
9
+ const Paper = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
10
+ target: "ebnm1b20"
11
+ } : {
12
+ target: "ebnm1b20",
13
+ label: "Paper"
14
+ })("box-sizing:content-box;background-color:#eaf4fb;padding:10px;width:", ({
15
+ width
16
+ }) => width === undefined ? 'auto' : typeof width === 'number' ? `${width}px` : width, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL1BhcGVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFNb0MiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvUGFwZXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5cbnR5cGUgUGFwZXJQcm9wcyA9IHtcbiAgd2lkdGg/OiBudW1iZXIgfCBzdHJpbmdcbn1cblxuY29uc3QgUGFwZXIgPSBzdHlsZWQuZGl2PFBhcGVyUHJvcHM+YFxuICBib3gtc2l6aW5nOiBjb250ZW50LWJveDtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2VhZjRmYjtcbiAgcGFkZGluZzogMTBweDtcbiAgd2lkdGg6ICR7KHsgd2lkdGggfSkgPT4gKHdpZHRoID09PSB1bmRlZmluZWQgPyAnYXV0bycgOiB0eXBlb2Ygd2lkdGggPT09ICdudW1iZXInID8gYCR7d2lkdGh9cHhgIDogd2lkdGgpfTtcbmBcblxuZXhwb3J0IGRlZmF1bHQgUGFwZXJcbiJdfQ== */"));
17
+ var _default = exports.default = Paper;
@@ -0,0 +1,8 @@
1
+ import React from 'react';
2
+ type PlaceholderProps = {
3
+ children?: React.ReactNode;
4
+ width: number;
5
+ height: number;
6
+ };
7
+ declare const Placeholder: React.FunctionComponent<PlaceholderProps>;
8
+ export default Placeholder;
@@ -0,0 +1,21 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _react = _interopRequireDefault(require("react"));
8
+ var _react2 = require("@emotion/react");
9
+ var _jsxRuntime = require("@emotion/react/jsx-runtime");
10
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
11
+ const Placeholder = ({
12
+ width,
13
+ height,
14
+ ...rest
15
+ }) => {
16
+ return (0, _jsxRuntime.jsx)("div", {
17
+ css: /*#__PURE__*/(0, _react2.css)("display:flex;margin-left:0;background-image:radial-gradient(circle at 50% 50%, #f8f9f9, #eef0f1);color:#b8b8b7;text-align:center;justify-content:center;align-items:center;font-size:10px;font-weight:300;width:", width, "px;height:", height, "px;" + (process.env.NODE_ENV === "production" ? "" : ";label:Placeholder;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL1BsYWNlaG9sZGVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFRYyIsImZpbGUiOiIuLi8uLi8uLi9zcmMvY29tcG9uZW50cy9QbGFjZWhvbGRlci50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCdcblxudHlwZSBQbGFjZWhvbGRlclByb3BzID0geyBjaGlsZHJlbj86IFJlYWN0LlJlYWN0Tm9kZTsgd2lkdGg6IG51bWJlcjsgaGVpZ2h0OiBudW1iZXIgfVxuXG5jb25zdCBQbGFjZWhvbGRlcjogUmVhY3QuRnVuY3Rpb25Db21wb25lbnQ8UGxhY2Vob2xkZXJQcm9wcz4gPSAoeyB3aWR0aCwgaGVpZ2h0LCAuLi5yZXN0IH0pID0+IHtcbiAgcmV0dXJuIChcbiAgICA8ZGl2XG4gICAgICBjc3M9e2Nzc2BcbiAgICAgICAgZGlzcGxheTogZmxleDtcbiAgICAgICAgbWFyZ2luLWxlZnQ6IDA7XG4gICAgICAgIGJhY2tncm91bmQtaW1hZ2U6IHJhZGlhbC1ncmFkaWVudChjaXJjbGUgYXQgNTAlIDUwJSwgI2Y4ZjlmOSwgI2VlZjBmMSk7XG4gICAgICAgIGNvbG9yOiAjYjhiOGI3O1xuICAgICAgICB0ZXh0LWFsaWduOiBjZW50ZXI7XG4gICAgICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgICAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgICAgICBmb250LXNpemU6IDEwcHg7XG4gICAgICAgIGZvbnQtd2VpZ2h0OiAzMDA7XG4gICAgICAgIHdpZHRoOiAke3dpZHRofXB4O1xuICAgICAgICBoZWlnaHQ6ICR7aGVpZ2h0fXB4O1xuICAgICAgYH1cbiAgICAgIHsuLi5yZXN0fVxuICAgIC8+XG4gIClcbn1cblxuZXhwb3J0IGRlZmF1bHQgUGxhY2Vob2xkZXJcbiJdfQ== */"),
18
+ ...rest
19
+ });
20
+ };
21
+ var _default = exports.default = Placeholder;
@@ -0,0 +1,5 @@
1
+ declare const StoryPage: import("@emotion/styled").StyledComponent<{
2
+ theme?: import("@emotion/react").Theme;
3
+ as?: React.ElementType;
4
+ }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
5
+ export default StoryPage;
@@ -0,0 +1,23 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _base = _interopRequireDefault(require("@emotion/styled/base"));
8
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
9
+ 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)."; }
10
+ const StoryPage = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
11
+ target: "e1rpk2m0"
12
+ } : {
13
+ target: "e1rpk2m0",
14
+ label: "StoryPage"
15
+ })(process.env.NODE_ENV === "production" ? {
16
+ name: "3hldis",
17
+ styles: "padding:5px 15px;max-width:1600px;&>h2{margin-top:30px!important;}"
18
+ } : {
19
+ name: "3hldis",
20
+ styles: "padding:5px 15px;max-width:1600px;&>h2{margin-top:30px!important;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL1N0b3J5UGFnZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBRTRCIiwiZmlsZSI6Ii4uLy4uLy4uL3NyYy9jb21wb25lbnRzL1N0b3J5UGFnZS50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcblxuY29uc3QgU3RvcnlQYWdlID0gc3R5bGVkLmRpdmBcbiAgcGFkZGluZzogNXB4IDE1cHg7XG4gIG1heC13aWR0aDogMTYwMHB4O1xuICAmID4gaDIge1xuICAgIC8qIHN0eWxlbGludC1kaXNhYmxlICovXG4gICAgbWFyZ2luLXRvcDogMzBweCAhaW1wb3J0YW50O1xuICAgIC8qIHN0eWxlbGludC1lbmFibGUgKi9cbiAgfVxuYFxuXG5leHBvcnQgZGVmYXVsdCBTdG9yeVBhZ2VcbiJdfQ== */",
21
+ toString: _EMOTION_STRINGIFIED_CSS_ERROR__
22
+ });
23
+ var _default = exports.default = StoryPage;
@@ -0,0 +1,4 @@
1
+ export { default as StoryPage } from './StoryPage';
2
+ export { default as ExampleContainer } from './ExampleContainer';
3
+ export { default as Paper } from './Paper';
4
+ export { default as Placeholder } from './Placeholder';
@@ -0,0 +1,34 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ Object.defineProperty(exports, "ExampleContainer", {
7
+ enumerable: true,
8
+ get: function () {
9
+ return _ExampleContainer.default;
10
+ }
11
+ });
12
+ Object.defineProperty(exports, "Paper", {
13
+ enumerable: true,
14
+ get: function () {
15
+ return _Paper.default;
16
+ }
17
+ });
18
+ Object.defineProperty(exports, "Placeholder", {
19
+ enumerable: true,
20
+ get: function () {
21
+ return _Placeholder.default;
22
+ }
23
+ });
24
+ Object.defineProperty(exports, "StoryPage", {
25
+ enumerable: true,
26
+ get: function () {
27
+ return _StoryPage.default;
28
+ }
29
+ });
30
+ var _StoryPage = _interopRequireDefault(require("./StoryPage"));
31
+ var _ExampleContainer = _interopRequireDefault(require("./ExampleContainer"));
32
+ var _Paper = _interopRequireDefault(require("./Paper"));
33
+ var _Placeholder = _interopRequireDefault(require("./Placeholder"));
34
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
package/cjs/index.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ export * from './components';
2
+ export * from './markdown';
package/cjs/index.js ADDED
@@ -0,0 +1,27 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ var _components = require("./components");
7
+ Object.keys(_components).forEach(function (key) {
8
+ if (key === "default" || key === "__esModule") return;
9
+ if (key in exports && exports[key] === _components[key]) return;
10
+ Object.defineProperty(exports, key, {
11
+ enumerable: true,
12
+ get: function () {
13
+ return _components[key];
14
+ }
15
+ });
16
+ });
17
+ var _markdown = require("./markdown");
18
+ Object.keys(_markdown).forEach(function (key) {
19
+ if (key === "default" || key === "__esModule") return;
20
+ if (key in exports && exports[key] === _markdown[key]) return;
21
+ Object.defineProperty(exports, key, {
22
+ enumerable: true,
23
+ get: function () {
24
+ return _markdown[key];
25
+ }
26
+ });
27
+ });
@@ -0,0 +1,6 @@
1
+ import React from 'react';
2
+ declare const Markdown: ({ children }: {
3
+ source?: any;
4
+ children: React.ReactNode;
5
+ }) => React.JSX.Element;
6
+ export default Markdown;
@@ -0,0 +1,26 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _react = _interopRequireDefault(require("react"));
8
+ var _marked = require("marked");
9
+ var _jsxRuntime = require("@emotion/react/jsx-runtime");
10
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
11
+ _marked.marked.setOptions({
12
+ gfm: true,
13
+ breaks: false
14
+ });
15
+ const Markdown = ({
16
+ children
17
+ }) => {
18
+ const html = _marked.marked.parse(children);
19
+ return (0, _jsxRuntime.jsx)("div", {
20
+ className: "markdown-body",
21
+ dangerouslySetInnerHTML: {
22
+ __html: html
23
+ }
24
+ });
25
+ };
26
+ var _default = exports.default = Markdown;
@@ -0,0 +1,3 @@
1
+ import React from 'react';
2
+ export declare const Md: (strings: TemplateStringsArray, ...values: string[]) => React.JSX.Element;
3
+ export default Md;
@@ -0,0 +1,20 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = exports.Md = void 0;
7
+ var _react = _interopRequireDefault(require("react"));
8
+ var _Markdown = _interopRequireDefault(require("./Markdown"));
9
+ var _jsxRuntime = require("@emotion/react/jsx-runtime");
10
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
11
+ const Md = (strings, ...values) => {
12
+ const source = strings.reduce((res, str, i) => {
13
+ return `${res}${str}${values[i] || ''}`;
14
+ });
15
+ return (0, _jsxRuntime.jsx)(_Markdown.default, {
16
+ children: source
17
+ });
18
+ };
19
+ exports.Md = Md;
20
+ var _default = exports.default = Md;
@@ -0,0 +1,2 @@
1
+ export { default as Markdown } from './Markdown';
2
+ export { default as Md } from './Md';
@@ -0,0 +1,20 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ Object.defineProperty(exports, "Markdown", {
7
+ enumerable: true,
8
+ get: function () {
9
+ return _Markdown.default;
10
+ }
11
+ });
12
+ Object.defineProperty(exports, "Md", {
13
+ enumerable: true,
14
+ get: function () {
15
+ return _Md.default;
16
+ }
17
+ });
18
+ var _Markdown = _interopRequireDefault(require("./Markdown"));
19
+ var _Md = _interopRequireDefault(require("./Md"));
20
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -0,0 +1,3 @@
1
+ "use strict";
2
+
3
+ exports.mdxLoaderRenderer = require('./mdxLoaderRenderer');
@@ -0,0 +1,17 @@
1
+ "use strict";
2
+
3
+ // In order to use the css prop (without overwriting) on a component inside mdx
4
+ // stories we need to provide @mdx-js/loader with a custom renderer function.
5
+ // See https://github.com/mdx-js/mdx/tree/master/packages/loader
6
+ module.exports = `
7
+ import React from 'react'
8
+ import { jsx } from '@emotion/react'
9
+ import {mdx as _mdx } from '@mdx-js/react'
10
+ const mdx = (name, props, ...children) => {
11
+ // Sometimes the mdxType prop can bleed into the DOM from components which "spreads the rest props"
12
+ if(props) {
13
+ // delete props.mdxType
14
+ }
15
+ return (typeof name === 'string' || typeof name === 'symbol') && !(props && 'css' in props) ? _mdx(name, props, ...children) : jsx(name, props, ...children)
16
+ }
17
+ `;
@@ -0,0 +1,8 @@
1
+ declare const ExampleContainer: import("@emotion/styled").StyledComponent<{
2
+ theme?: import("@emotion/react").Theme;
3
+ as?: React.ElementType;
4
+ } & {
5
+ headline?: string;
6
+ dark?: boolean;
7
+ }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
8
+ export default ExampleContainer;
@@ -0,0 +1,16 @@
1
+ import _styled from "@emotion/styled/base";
2
+ var ExampleContainer = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
3
+ target: "e111yhd70"
4
+ } : {
5
+ target: "e111yhd70",
6
+ label: "ExampleContainer"
7
+ })("background-color:", function (p) {
8
+ return p.dark ? '#002b45' : 'white';
9
+ }, ";padding:25px 15px 15px;margin-bottom:16px;border:1px solid #f4f6f8;position:relative;::before{position:absolute;top:2px;content:'", function (p) {
10
+ return p.headline || 'example';
11
+ }, "';right:2px;font-size:10px;padding:4px 8px;color:", function (p) {
12
+ return p.dark ? 'white' : 'black';
13
+ }, ";background-color:", function (p) {
14
+ return p.dark ? '#031c2b' : '#eee';
15
+ }, ";text-transform:uppercase;letter-spacing:1.2px;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL0V4YW1wbGVDb250YWluZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUUwRSIsImZpbGUiOiIuLi8uLi9zcmMvY29tcG9uZW50cy9FeGFtcGxlQ29udGFpbmVyLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuXG5jb25zdCBFeGFtcGxlQ29udGFpbmVyID0gc3R5bGVkLmRpdjx7IGhlYWRsaW5lPzogc3RyaW5nOyBkYXJrPzogYm9vbGVhbiB9PmBcbiAgYmFja2dyb3VuZC1jb2xvcjogJHsocCkgPT4gKHAuZGFyayA/ICcjMDAyYjQ1JyA6ICd3aGl0ZScpfTtcbiAgcGFkZGluZzogMjVweCAxNXB4IDE1cHg7XG4gIG1hcmdpbi1ib3R0b206IDE2cHg7XG4gIGJvcmRlcjogMXB4IHNvbGlkICNmNGY2Zjg7XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcblxuICA6OmJlZm9yZSB7XG4gICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgIHRvcDogMnB4O1xuICAgIGNvbnRlbnQ6ICckeyhwKSA9PiBwLmhlYWRsaW5lIHx8ICdleGFtcGxlJ30nO1xuICAgIHJpZ2h0OiAycHg7XG4gICAgZm9udC1zaXplOiAxMHB4O1xuICAgIHBhZGRpbmc6IDRweCA4cHg7XG4gICAgY29sb3I6ICR7KHApID0+IChwLmRhcmsgPyAnd2hpdGUnIDogJ2JsYWNrJyl9O1xuICAgIGJhY2tncm91bmQtY29sb3I6ICR7KHApID0+IChwLmRhcmsgPyAnIzAzMWMyYicgOiAnI2VlZScpfTtcbiAgICB0ZXh0LXRyYW5zZm9ybTogdXBwZXJjYXNlO1xuICAgIGxldHRlci1zcGFjaW5nOiAxLjJweDtcbiAgfVxuYFxuXG5leHBvcnQgZGVmYXVsdCBFeGFtcGxlQ29udGFpbmVyXG4iXX0= */"));
16
+ export default ExampleContainer;
@@ -0,0 +1,8 @@
1
+ type PaperProps = {
2
+ width?: number | string;
3
+ };
4
+ declare const Paper: import("@emotion/styled").StyledComponent<{
5
+ theme?: import("@emotion/react").Theme;
6
+ as?: React.ElementType;
7
+ } & PaperProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
8
+ export default Paper;
@@ -0,0 +1,11 @@
1
+ import _styled from "@emotion/styled/base";
2
+ var Paper = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
3
+ target: "ebnm1b20"
4
+ } : {
5
+ target: "ebnm1b20",
6
+ label: "Paper"
7
+ })("box-sizing:content-box;background-color:#eaf4fb;padding:10px;width:", function (_ref) {
8
+ var width = _ref.width;
9
+ return width === undefined ? 'auto' : typeof width === 'number' ? "".concat(width, "px") : width;
10
+ }, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL1BhcGVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFNb0MiLCJmaWxlIjoiLi4vLi4vc3JjL2NvbXBvbmVudHMvUGFwZXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5cbnR5cGUgUGFwZXJQcm9wcyA9IHtcbiAgd2lkdGg/OiBudW1iZXIgfCBzdHJpbmdcbn1cblxuY29uc3QgUGFwZXIgPSBzdHlsZWQuZGl2PFBhcGVyUHJvcHM+YFxuICBib3gtc2l6aW5nOiBjb250ZW50LWJveDtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2VhZjRmYjtcbiAgcGFkZGluZzogMTBweDtcbiAgd2lkdGg6ICR7KHsgd2lkdGggfSkgPT4gKHdpZHRoID09PSB1bmRlZmluZWQgPyAnYXV0bycgOiB0eXBlb2Ygd2lkdGggPT09ICdudW1iZXInID8gYCR7d2lkdGh9cHhgIDogd2lkdGgpfTtcbmBcblxuZXhwb3J0IGRlZmF1bHQgUGFwZXJcbiJdfQ== */"));
11
+ export default Paper;
@@ -0,0 +1,8 @@
1
+ import React from 'react';
2
+ type PlaceholderProps = {
3
+ children?: React.ReactNode;
4
+ width: number;
5
+ height: number;
6
+ };
7
+ declare const Placeholder: React.FunctionComponent<PlaceholderProps>;
8
+ export default Placeholder;
@@ -0,0 +1,21 @@
1
+ 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); }
2
+ var _excluded = ["width", "height"];
3
+ 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; }
4
+ 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; }
5
+ function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
6
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
7
+ 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); }
8
+ function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
9
+ function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
10
+ import React from 'react';
11
+ import { css } from '@emotion/react';
12
+ import { jsx as _jsx } from "@emotion/react/jsx-runtime";
13
+ var Placeholder = function Placeholder(_ref) {
14
+ var width = _ref.width,
15
+ height = _ref.height,
16
+ rest = _objectWithoutProperties(_ref, _excluded);
17
+ return _jsx("div", _objectSpread({
18
+ css: /*#__PURE__*/css("display:flex;margin-left:0;background-image:radial-gradient(circle at 50% 50%, #f8f9f9, #eef0f1);color:#b8b8b7;text-align:center;justify-content:center;align-items:center;font-size:10px;font-weight:300;width:", width, "px;height:", height, "px;" + (process.env.NODE_ENV === "production" ? "" : ";label:Placeholder;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL1BsYWNlaG9sZGVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFRYyIsImZpbGUiOiIuLi8uLi9zcmMvY29tcG9uZW50cy9QbGFjZWhvbGRlci50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCdcblxudHlwZSBQbGFjZWhvbGRlclByb3BzID0geyBjaGlsZHJlbj86IFJlYWN0LlJlYWN0Tm9kZTsgd2lkdGg6IG51bWJlcjsgaGVpZ2h0OiBudW1iZXIgfVxuXG5jb25zdCBQbGFjZWhvbGRlcjogUmVhY3QuRnVuY3Rpb25Db21wb25lbnQ8UGxhY2Vob2xkZXJQcm9wcz4gPSAoeyB3aWR0aCwgaGVpZ2h0LCAuLi5yZXN0IH0pID0+IHtcbiAgcmV0dXJuIChcbiAgICA8ZGl2XG4gICAgICBjc3M9e2Nzc2BcbiAgICAgICAgZGlzcGxheTogZmxleDtcbiAgICAgICAgbWFyZ2luLWxlZnQ6IDA7XG4gICAgICAgIGJhY2tncm91bmQtaW1hZ2U6IHJhZGlhbC1ncmFkaWVudChjaXJjbGUgYXQgNTAlIDUwJSwgI2Y4ZjlmOSwgI2VlZjBmMSk7XG4gICAgICAgIGNvbG9yOiAjYjhiOGI3O1xuICAgICAgICB0ZXh0LWFsaWduOiBjZW50ZXI7XG4gICAgICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgICAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgICAgICBmb250LXNpemU6IDEwcHg7XG4gICAgICAgIGZvbnQtd2VpZ2h0OiAzMDA7XG4gICAgICAgIHdpZHRoOiAke3dpZHRofXB4O1xuICAgICAgICBoZWlnaHQ6ICR7aGVpZ2h0fXB4O1xuICAgICAgYH1cbiAgICAgIHsuLi5yZXN0fVxuICAgIC8+XG4gIClcbn1cblxuZXhwb3J0IGRlZmF1bHQgUGxhY2Vob2xkZXJcbiJdfQ== */")
19
+ }, rest));
20
+ };
21
+ export default Placeholder;
@@ -0,0 +1,5 @@
1
+ declare const StoryPage: import("@emotion/styled").StyledComponent<{
2
+ theme?: import("@emotion/react").Theme;
3
+ as?: React.ElementType;
4
+ }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
5
+ export default StoryPage;
@@ -0,0 +1,16 @@
1
+ import _styled from "@emotion/styled/base";
2
+ 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)."; }
3
+ var StoryPage = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
4
+ target: "e1rpk2m0"
5
+ } : {
6
+ target: "e1rpk2m0",
7
+ label: "StoryPage"
8
+ })(process.env.NODE_ENV === "production" ? {
9
+ name: "3hldis",
10
+ styles: "padding:5px 15px;max-width:1600px;&>h2{margin-top:30px!important;}"
11
+ } : {
12
+ name: "3hldis",
13
+ styles: "padding:5px 15px;max-width:1600px;&>h2{margin-top:30px!important;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL1N0b3J5UGFnZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBRTRCIiwiZmlsZSI6Ii4uLy4uL3NyYy9jb21wb25lbnRzL1N0b3J5UGFnZS50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcblxuY29uc3QgU3RvcnlQYWdlID0gc3R5bGVkLmRpdmBcbiAgcGFkZGluZzogNXB4IDE1cHg7XG4gIG1heC13aWR0aDogMTYwMHB4O1xuICAmID4gaDIge1xuICAgIC8qIHN0eWxlbGludC1kaXNhYmxlICovXG4gICAgbWFyZ2luLXRvcDogMzBweCAhaW1wb3J0YW50O1xuICAgIC8qIHN0eWxlbGludC1lbmFibGUgKi9cbiAgfVxuYFxuXG5leHBvcnQgZGVmYXVsdCBTdG9yeVBhZ2VcbiJdfQ== */",
14
+ toString: _EMOTION_STRINGIFIED_CSS_ERROR__
15
+ });
16
+ export default StoryPage;
@@ -0,0 +1,4 @@
1
+ export { default as StoryPage } from './StoryPage';
2
+ export { default as ExampleContainer } from './ExampleContainer';
3
+ export { default as Paper } from './Paper';
4
+ export { default as Placeholder } from './Placeholder';
@@ -0,0 +1,4 @@
1
+ export { default as StoryPage } from './StoryPage';
2
+ export { default as ExampleContainer } from './ExampleContainer';
3
+ export { default as Paper } from './Paper';
4
+ export { default as Placeholder } from './Placeholder';
package/index.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ export * from './components';
2
+ export * from './markdown';
package/index.js ADDED
@@ -0,0 +1,2 @@
1
+ export * from './components';
2
+ export * from './markdown';
@@ -0,0 +1,6 @@
1
+ import React from 'react';
2
+ declare const Markdown: ({ children }: {
3
+ source?: any;
4
+ children: React.ReactNode;
5
+ }) => React.JSX.Element;
6
+ export default Markdown;
@@ -0,0 +1,18 @@
1
+ import React from 'react';
2
+ import { marked } from 'marked';
3
+ import { jsx as _jsx } from "@emotion/react/jsx-runtime";
4
+ marked.setOptions({
5
+ gfm: true,
6
+ breaks: false
7
+ });
8
+ var Markdown = function Markdown(_ref) {
9
+ var children = _ref.children;
10
+ var html = marked.parse(children);
11
+ return _jsx("div", {
12
+ className: "markdown-body",
13
+ dangerouslySetInnerHTML: {
14
+ __html: html
15
+ }
16
+ });
17
+ };
18
+ export default Markdown;
@@ -0,0 +1,3 @@
1
+ import React from 'react';
2
+ export declare const Md: (strings: TemplateStringsArray, ...values: string[]) => React.JSX.Element;
3
+ export default Md;
package/markdown/Md.js ADDED
@@ -0,0 +1,15 @@
1
+ import React from 'react';
2
+ import Markdown from './Markdown';
3
+ import { jsx as _jsx } from "@emotion/react/jsx-runtime";
4
+ export var Md = function Md(strings) {
5
+ for (var _len = arguments.length, values = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
6
+ values[_key - 1] = arguments[_key];
7
+ }
8
+ var source = strings.reduce(function (res, str, i) {
9
+ return "".concat(res).concat(str).concat(values[i] || '');
10
+ });
11
+ return _jsx(Markdown, {
12
+ children: source
13
+ });
14
+ };
15
+ export default Md;
@@ -0,0 +1,2 @@
1
+ export { default as Markdown } from './Markdown';
2
+ export { default as Md } from './Md';
@@ -0,0 +1,2 @@
1
+ export { default as Markdown } from './Markdown';
2
+ export { default as Md } from './Md';
package/mdx/index.js ADDED
@@ -0,0 +1 @@
1
+ exports.mdxLoaderRenderer = require('./mdxLoaderRenderer');
@@ -0,0 +1,4 @@
1
+ // In order to use the css prop (without overwriting) on a component inside mdx
2
+ // stories we need to provide @mdx-js/loader with a custom renderer function.
3
+ // See https://github.com/mdx-js/mdx/tree/master/packages/loader
4
+ module.exports = "\nimport React from 'react'\nimport { jsx } from '@emotion/react'\nimport {mdx as _mdx } from '@mdx-js/react'\nconst mdx = (name, props, ...children) => {\n // Sometimes the mdxType prop can bleed into the DOM from components which \"spreads the rest props\"\n if(props) {\n // delete props.mdxType\n }\n return (typeof name === 'string' || typeof name === 'symbol') && !(props && 'css' in props) ? _mdx(name, props, ...children) : jsx(name, props, ...children)\n}\n";
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "Components and utils for use with Storybook within DFDS",
4
4
  "license": "MIT",
5
5
  "private": false,
6
- "version": "2.2.0-alpha.50e30e78",
6
+ "version": "2.2.0-alpha.5e7ff910",
7
7
  "sideEffects": false,
8
8
  "main": "./cjs/index.js",
9
9
  "module": "./index.js",
@@ -14,10 +14,10 @@
14
14
  "@emotion/styled": "11.14.1"
15
15
  },
16
16
  "dependencies": {
17
- "@dfds-ui/icons": "2.2.0-alpha.50e30e78",
17
+ "@dfds-ui/icons": "2.2.0-alpha.5e7ff910",
18
18
  "marked": "18.0.3"
19
19
  },
20
- "gitHead": "50e30e78a552b42c7fd48dc90a72e74c66dda3aa",
20
+ "gitHead": "5e7ff9108d308292e7577ea410dcf2e4b5975cf9",
21
21
  "publishConfig": {
22
22
  "access": "public"
23
23
  }