@storybook/react 7.0.0-alpha.6 → 7.0.0-alpha.60

package/template/stories/docgen-components/8140-js-prop-types-oneof/properties.snapshot

@@ -0,0 +1,89 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`react component properties 8140-js-prop-types-oneof 1`] = `
+Object {
+  "rows": Array [
+    Object {
+      "defaultValue": Object {
+        "detail": undefined,
+        "summary": "'static'",
+      },
+      "description": "",
+      "name": "mode",
+      "required": false,
+      "sbType": Object {
+        "name": "enum",
+        "value": Array [
+          "static",
+          "timed",
+        ],
+      },
+      "type": Object {
+        "detail": undefined,
+        "summary": "'static' | 'timed'",
+      },
+    },
+    Object {
+      "defaultValue": Object {
+        "detail": undefined,
+        "summary": "'warning'",
+      },
+      "description": "",
+      "name": "type",
+      "required": false,
+      "sbType": Object {
+        "name": "enum",
+        "value": Array [
+          "success",
+          "warning",
+          "error",
+          "primary",
+        ],
+      },
+      "type": Object {
+        "detail": undefined,
+        "summary": "'success' | 'warning' | 'error' | 'primary'",
+      },
+    },
+    Object {
+      "defaultValue": null,
+      "description": "",
+      "name": "message",
+      "required": true,
+      "sbType": Object {
+        "name": "string",
+      },
+      "type": Object {
+        "detail": undefined,
+        "summary": "string",
+      },
+    },
+    Object {
+      "defaultValue": null,
+      "description": "No background or border if static alert",
+      "name": "blank",
+      "required": false,
+      "sbType": Object {
+        "name": "boolean",
+      },
+      "type": Object {
+        "detail": undefined,
+        "summary": "bool",
+      },
+    },
+    Object {
+      "defaultValue": null,
+      "description": "Allows icon override, accepts material icon name",
+      "name": "icon",
+      "required": false,
+      "sbType": Object {
+        "name": "string",
+      },
+      "type": Object {
+        "detail": undefined,
+        "summary": "string",
+      },
+    },
+  ],
+}
+`;

package/template/stories/docgen-components/8143-ts-imported-types/argTypes.snapshot

@@ -0,0 +1,27 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`react component properties 8143-ts-imported-types 1`] = `
+Object {
+  "bar": Object {
+    "control": Object {
+      "type": "object",
+    },
+    "description": "",
+    "name": "bar",
+    "table": Object {
+      "defaultValue": null,
+      "jsDocTags": undefined,
+      "type": Object {
+        "detail": undefined,
+        "summary": "Foo['bar']",
+      },
+    },
+    "type": Object {
+      "name": "other",
+      "raw": "Foo['bar']",
+      "required": true,
+      "value": "Foo['bar']",
+    },
+  },
+}
+`;

package/template/stories/docgen-components/8143-ts-imported-types/docgen.snapshot

@@ -0,0 +1,22 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`react component properties 8143-ts-imported-types 1`] = `
+"import React from 'react';
+export const FooComponent = foo => /*#__PURE__*/React.createElement(React.Fragment, null, JSON.stringify(foo));
+export const component = FooComponent;
+FooComponent.__docgenInfo = {
+  \\"description\\": \\"\\",
+  \\"methods\\": [],
+  \\"displayName\\": \\"FooComponent\\",
+  \\"props\\": {
+    \\"bar\\": {
+      \\"required\\": true,
+      \\"tsType\\": {
+        \\"name\\": \\"Foo['bar']\\",
+        \\"raw\\": \\"Foo['bar']\\"
+      },
+      \\"description\\": \\"\\"
+    }
+  }
+};"
+`;

package/template/stories/docgen-components/8143-ts-imported-types/input.tsx

@@ -0,0 +1,10 @@
+import React from 'react';
+import type { Foo } from './types';
+
+interface FooProps {
+  bar: Foo['bar'];
+}
+
+export const FooComponent = (foo: FooProps) => <>{JSON.stringify(foo)}</>;
+
+export const component = FooComponent;

package/template/stories/docgen-components/8143-ts-imported-types/properties.snapshot

@@ -0,0 +1,23 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`react component properties 8143-ts-imported-types 1`] = `
+Object {
+  "rows": Array [
+    Object {
+      "defaultValue": null,
+      "description": "",
+      "name": "bar",
+      "required": true,
+      "sbType": Object {
+        "name": "other",
+        "raw": "Foo['bar']",
+        "value": "Foo['bar']",
+      },
+      "type": Object {
+        "detail": undefined,
+        "summary": "Foo['bar']",
+      },
+    },
+  ],
+}
+`;

package/template/stories/docgen-components/8143-ts-imported-types/types.ts

@@ -0,0 +1,3 @@
+export interface Foo {
+  bar: number;
+}

package/template/stories/docgen-components/8143-ts-react-fc-generics/argTypes.snapshot

@@ -0,0 +1,27 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`react component properties 8143-ts-react-fc-generics 1`] = `
+Object {
+  "padding": Object {
+    "control": Object {
+      "type": "object",
+    },
+    "description": undefined,
+    "name": "padding",
+    "table": Object {
+      "defaultValue": Object {
+        "detail": undefined,
+        "summary": "'0'",
+      },
+      "jsDocTags": undefined,
+      "type": Object {
+        "detail": undefined,
+        "summary": "unknown",
+      },
+    },
+    "type": Object {
+      "required": false,
+    },
+  },
+}
+`;

package/template/stories/docgen-components/8143-ts-react-fc-generics/docgen.snapshot

@@ -0,0 +1,24 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`react component properties 8143-ts-react-fc-generics 1`] = `
+"import React from 'react';
+export const Text = ({
+  padding = '0',
+  margin
+}) => /*#__PURE__*/React.createElement(React.Fragment, null, \\"Text\\");
+export const component = Text;
+Text.__docgenInfo = {
+  \\"description\\": \\"\\",
+  \\"methods\\": [],
+  \\"displayName\\": \\"Text\\",
+  \\"props\\": {
+    \\"padding\\": {
+      \\"defaultValue\\": {
+        \\"value\\": \\"'0'\\",
+        \\"computed\\": false
+      },
+      \\"required\\": false
+    }
+  }
+};"
+`;

package/template/stories/docgen-components/8143-ts-react-fc-generics/input.tsx

@@ -0,0 +1,10 @@
+import React from 'react';
+
+interface Props {
+  padding: string;
+  margin: number;
+}
+
+export const Text: React.FC<Props> = ({ padding = '0', margin }) => <>Text</>;
+
+export const component = Text;

package/template/stories/docgen-components/8143-ts-react-fc-generics/properties.snapshot

@@ -0,0 +1,21 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`react component properties 8143-ts-react-fc-generics 1`] = `
+Object {
+  "rows": Array [
+    Object {
+      "defaultValue": Object {
+        "detail": undefined,
+        "summary": "'0'",
+      },
+      "description": undefined,
+      "name": "padding",
+      "required": false,
+      "type": Object {
+        "detail": undefined,
+        "summary": "unknown",
+      },
+    },
+  ],
+}
+`;

package/template/stories/docgen-components/8428-js-static-prop-types/argTypes.snapshot

@@ -0,0 +1,25 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`react component properties 8428-js-static-prop-types 1`] = `
+Object {
+  "test": Object {
+    "control": Object {
+      "type": "text",
+    },
+    "description": "Please work...",
+    "name": "test",
+    "table": Object {
+      "defaultValue": null,
+      "jsDocTags": undefined,
+      "type": Object {
+        "detail": undefined,
+        "summary": "string",
+      },
+    },
+    "type": Object {
+      "name": "string",
+      "required": false,
+    },
+  },
+}
+`;

package/template/stories/docgen-components/8428-js-static-prop-types/docgen.snapshot

@@ -0,0 +1,39 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`react component properties 8428-js-static-prop-types 1`] = `
+"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(arg) { var key = _toPrimitive(arg, \\"string\\"); return typeof key === \\"symbol\\" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== \\"object\\" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || \\"default\\"); if (typeof res !== \\"object\\") return res; throw new TypeError(\\"@@toPrimitive must return a primitive value.\\"); } return (hint === \\"string\\" ? String : Number)(input); }
+/* eslint-disable react/no-unused-prop-types */
+/* eslint-disable react/require-default-props */
+import React from 'react';
+import PropTypes from 'prop-types';
+
+// eslint-disable-next-line react/prefer-stateless-function
+export default class Test extends React.Component {
+  render() {
+    return /*#__PURE__*/React.createElement(\\"div\\", null, \\"test\\");
+  }
+}
+_defineProperty(Test, \\"propTypes\\", {
+  /**
+   * Please work...
+   */
+  test: PropTypes.string
+});
+export const component = Test;
+Test.__docgenInfo = {
+  \\"description\\": \\"\\",
+  \\"methods\\": [],
+  \\"displayName\\": \\"Test\\",
+  \\"props\\": {
+    \\"test\\": {
+      \\"description\\": \\"Please work...\\",
+      \\"type\\": {
+        \\"name\\": \\"string\\"
+      },
+      \\"required\\": false
+    }
+  }
+};"
+`;

package/template/stories/docgen-components/8428-js-static-prop-types/input.jsx

@@ -0,0 +1,20 @@
+/* eslint-disable react/no-unused-prop-types */
+/* eslint-disable react/require-default-props */
+import React from 'react';
+import PropTypes from 'prop-types';
+
+// eslint-disable-next-line react/prefer-stateless-function
+export default class Test extends React.Component {
+  static propTypes = {
+    /**
+     * Please work...
+     */
+    test: PropTypes.string,
+  };
+
+  render() {
+    return <div>test</div>;
+  }
+}
+
+export const component = Test;

package/template/stories/docgen-components/8428-js-static-prop-types/properties.snapshot

@@ -0,0 +1,21 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`react component properties 8428-js-static-prop-types 1`] = `
+Object {
+  "rows": Array [
+    Object {
+      "defaultValue": null,
+      "description": "Please work...",
+      "name": "test",
+      "required": false,
+      "sbType": Object {
+        "name": "string",
+      },
+      "type": Object {
+        "detail": undefined,
+        "summary": "string",
+      },
+    },
+  ],
+}
+`;

package/template/stories/docgen-components/8740-ts-multi-props/argTypes.snapshot

@@ -0,0 +1,27 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`react component properties 8740-ts-multi-props 1`] = `
+Object {
+  "size": Object {
+    "control": Object {
+      "type": "object",
+    },
+    "description": undefined,
+    "name": "size",
+    "table": Object {
+      "defaultValue": Object {
+        "detail": undefined,
+        "summary": "'a'",
+      },
+      "jsDocTags": undefined,
+      "type": Object {
+        "detail": undefined,
+        "summary": "unknown",
+      },
+    },
+    "type": Object {
+      "required": false,
+    },
+  },
+}
+`;

package/template/stories/docgen-components/8740-ts-multi-props/docgen.snapshot

@@ -0,0 +1,49 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`react component properties 8740-ts-multi-props 1`] = `
+"import React from 'react';
+export const Header = ({
+  size = 'a',
+  children
+}) => /*#__PURE__*/React.createElement(\\"div\\", {
+  className: size
+}, children);
+export const Paragraph = ({
+  size,
+  children
+}) => /*#__PURE__*/React.createElement(\\"div\\", {
+  className: size
+}, children);
+Paragraph.defaultProps = {
+  size: 'md'
+};
+export const component = Header;
+Header.__docgenInfo = {
+  \\"description\\": \\"\\",
+  \\"methods\\": [],
+  \\"displayName\\": \\"Header\\",
+  \\"props\\": {
+    \\"size\\": {
+      \\"defaultValue\\": {
+        \\"value\\": \\"'a'\\",
+        \\"computed\\": false
+      },
+      \\"required\\": false
+    }
+  }
+};
+Paragraph.__docgenInfo = {
+  \\"description\\": \\"\\",
+  \\"methods\\": [],
+  \\"displayName\\": \\"Paragraph\\",
+  \\"props\\": {
+    \\"size\\": {
+      \\"defaultValue\\": {
+        \\"value\\": \\"'md'\\",
+        \\"computed\\": false
+      },
+      \\"required\\": false
+    }
+  }
+};"
+`;

package/template/stories/docgen-components/8740-ts-multi-props/input.tsx

@@ -0,0 +1,23 @@
+import React from 'react';
+
+export interface ElemAProps {
+  size?: 'a' | 'b' | 'c' | 'd';
+  children: React.ReactNode;
+}
+
+export const Header: React.FC<ElemAProps> = ({ size = 'a', children }) => (
+  <div className={size}>{children}</div>
+);
+
+export interface ElemBProps {
+  size?: 'sm' | 'md' | 'lg';
+  children: React.ReactNode;
+}
+
+export const Paragraph: React.FC<ElemBProps> = ({ size, children }) => (
+  <div className={size}>{children}</div>
+);
+
+Paragraph.defaultProps = { size: 'md' };
+
+export const component = Header;

package/template/stories/docgen-components/8740-ts-multi-props/properties.snapshot

@@ -0,0 +1,21 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`react component properties 8740-ts-multi-props 1`] = `
+Object {
+  "rows": Array [
+    Object {
+      "defaultValue": Object {
+        "detail": undefined,
+        "summary": "'a'",
+      },
+      "description": undefined,
+      "name": "size",
+      "required": false,
+      "type": Object {
+        "detail": undefined,
+        "summary": "unknown",
+      },
+    },
+  ],
+}
+`;

package/template/stories/docgen-components/8894-9511-ts-forward-ref/argTypes.snapshot

@@ -0,0 +1,48 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`react component properties 8894-9511-ts-forward-ref 1`] = `
+Object {
+  "disabled": Object {
+    "control": Object {
+      "type": "object",
+    },
+    "description": undefined,
+    "name": "disabled",
+    "table": Object {
+      "defaultValue": Object {
+        "detail": undefined,
+        "summary": "false",
+      },
+      "jsDocTags": undefined,
+      "type": Object {
+        "detail": undefined,
+        "summary": "unknown",
+      },
+    },
+    "type": Object {
+      "required": false,
+    },
+  },
+  "variant": Object {
+    "control": Object {
+      "type": "object",
+    },
+    "description": undefined,
+    "name": "variant",
+    "table": Object {
+      "defaultValue": Object {
+        "detail": undefined,
+        "summary": "'small'",
+      },
+      "jsDocTags": undefined,
+      "type": Object {
+        "detail": undefined,
+        "summary": "unknown",
+      },
+    },
+    "type": Object {
+      "required": false,
+    },
+  },
+}
+`;

package/template/stories/docgen-components/8894-9511-ts-forward-ref/docgen.snapshot

@@ -0,0 +1,39 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`react component properties 8894-9511-ts-forward-ref 1`] = `
+"import React, { forwardRef } from 'react';
+const Button = /*#__PURE__*/forwardRef(function Button({
+  disabled = false,
+  variant = 'small',
+  children
+}, ref) {
+  return /*#__PURE__*/React.createElement(\\"button\\", {
+    type: \\"button\\",
+    disabled: disabled,
+    ref: ref
+  }, children, \\" \\", variant);
+});
+Button.__docgenInfo = {
+  \\"description\\": \\"\\",
+  \\"methods\\": [],
+  \\"displayName\\": \\"Button\\",
+  \\"props\\": {
+    \\"disabled\\": {
+      \\"defaultValue\\": {
+        \\"value\\": \\"false\\",
+        \\"computed\\": false
+      },
+      \\"required\\": false
+    },
+    \\"variant\\": {
+      \\"defaultValue\\": {
+        \\"value\\": \\"'small'\\",
+        \\"computed\\": false
+      },
+      \\"required\\": false
+    }
+  }
+};
+export default Button;
+export const component = Button;"
+`;

package/template/stories/docgen-components/8894-9511-ts-forward-ref/input.tsx

@@ -0,0 +1,31 @@
+import React, { forwardRef } from 'react';
+
+interface ButtonProps {
+  /**
+   * Sets the button size.
+   */
+  variant?: 'small' | 'large';
+  /**
+   * Disables the button.
+   */
+  disabled?: boolean;
+  /**
+   * Content of the button.
+   */
+  children: React.ReactNode;
+}
+
+const Button = forwardRef<HTMLButtonElement, ButtonProps>(function Button(
+  { disabled = false, variant = 'small', children },
+  ref
+) {
+  return (
+    <button type="button" disabled={disabled} ref={ref}>
+      {children} {variant}
+    </button>
+  );
+});
+
+export default Button;
+
+export const component = Button;

package/template/stories/docgen-components/8894-9511-ts-forward-ref/properties.snapshot

@@ -0,0 +1,34 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`react component properties 8894-9511-ts-forward-ref 1`] = `
+Object {
+  "rows": Array [
+    Object {
+      "defaultValue": Object {
+        "detail": undefined,
+        "summary": "false",
+      },
+      "description": undefined,
+      "name": "disabled",
+      "required": false,
+      "type": Object {
+        "detail": undefined,
+        "summary": "unknown",
+      },
+    },
+    Object {
+      "defaultValue": Object {
+        "detail": undefined,
+        "summary": "'small'",
+      },
+      "description": undefined,
+      "name": "variant",
+      "required": false,
+      "type": Object {
+        "detail": undefined,
+        "summary": "unknown",
+      },
+    },
+  ],
+}
+`;