From 76faa448324925c169a73313615cec3259c85f26 Mon Sep 17 00:00:00 2001
From: Taylor Jones <tay1orjones@users.noreply.github.com>
Date: Fri, 17 Jun 2022 12:34:16 -0500
Subject: [PATCH] docs(link): provide playground with working controls (#11614)

* docs(link): provide playground with working controls

* docs(link): clean up unused pieces

Co-authored-by: Josh Black <josh@josh.black>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
---
 .../react/src/components/Link/Link-story.js   | 68 -------------------
 packages/react/src/components/Link/Link.js    |  6 +-
 .../react/src/components/Link/Link.stories.js | 52 ++++++++++++++
 3 files changed, 55 insertions(+), 71 deletions(-)
 delete mode 100644 packages/react/src/components/Link/Link-story.js
 create mode 100644 packages/react/src/components/Link/Link.stories.js

diff --git a/packages/react/src/components/Link/Link-story.js b/packages/react/src/components/Link/Link-story.js
deleted file mode 100644
index c97c1fead78f..000000000000
--- a/packages/react/src/components/Link/Link-story.js
+++ /dev/null
@@ -1,68 +0,0 @@
-/**
- * Copyright IBM Corp. 2016, 2018
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-/* eslint-disable no-console */
-
-import React from 'react';
-import { action } from '@storybook/addon-actions';
-import { withKnobs, text, boolean, select } from '@storybook/addon-knobs';
-import { Download } from '@carbon/icons-react';
-import Link from '../Link';
-import mdx from './Link.mdx';
-
-const sizes = {
-  'Small  (sm)': 'sm',
-  'Medium (md) - default': undefined,
-  'Large  (lg)': 'lg',
-};
-
-const props = () => ({
-  className: 'some-class',
-  href: text('The link href (href)', '#'),
-  inline: boolean('Use the in-line variant (inline)', false),
-  visited: boolean('Allow visited styles', false),
-  onClick: ((handler) => (evt) => {
-    evt.preventDefault(); // Prevent link from being followed for demo purpose
-    handler(evt);
-  })(action('onClick')),
-  disabled: boolean('Disabled', false),
-  size: select('Field size (size)', sizes, undefined) || undefined,
-});
-
-export default {
-  title: 'Components/Link',
-  component: Link,
-  decorators: [withKnobs],
-  parameters: {
-    docs: {
-      page: mdx,
-    },
-  },
-  argTypes: {
-    disabled: {
-      control: { type: 'boolean' },
-    },
-  },
-};
-
-export const _Default = (args) => (
-  <Link href="http://www.carbondesignsystem.com" {...args}>
-    Link
-  </Link>
-);
-
-_Default.story = {
-  name: 'Link',
-};
-
-export const PairedWithIcon = () => (
-  <Link href="http://www.carbondesignsystem.com" renderIcon={Download}>
-    Download
-  </Link>
-);
-
-export const Playground = () => <Link {...props()}>Link</Link>;
diff --git a/packages/react/src/components/Link/Link.js b/packages/react/src/components/Link/Link.js
index d940b486bfcd..74e2c81a7d08 100644
--- a/packages/react/src/components/Link/Link.js
+++ b/packages/react/src/components/Link/Link.js
@@ -15,9 +15,9 @@ const Link = React.forwardRef(function Link(
     children,
     className: customClassName,
     href,
-    disabled,
-    inline,
-    visited,
+    disabled = false,
+    inline = false,
+    visited = false,
     renderIcon: Icon,
     size,
     ...rest
diff --git a/packages/react/src/components/Link/Link.stories.js b/packages/react/src/components/Link/Link.stories.js
new file mode 100644
index 000000000000..e095dc80565a
--- /dev/null
+++ b/packages/react/src/components/Link/Link.stories.js
@@ -0,0 +1,52 @@
+/**
+ * Copyright IBM Corp. 2016, 2018
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import React from 'react';
+import { Download } from '@carbon/icons-react';
+import Link from './Link';
+import mdx from './Link.mdx';
+
+export default {
+  title: 'Components/Link',
+  component: Link,
+  parameters: {
+    docs: {
+      page: mdx,
+    },
+  },
+  args: {
+    disabled: false,
+    inline: false,
+    visited: false,
+  },
+  argTypes: {
+    children: {
+      table: {
+        disable: true,
+      },
+    },
+    renderIcon: {
+      table: {
+        disable: true,
+      },
+    },
+  },
+};
+
+export const Default = () => <Link href="#">Link</Link>;
+
+export const PairedWithIcon = () => (
+  <Link href="#" renderIcon={Download}>
+    Download
+  </Link>
+);
+
+export const Playground = (args) => (
+  <Link href="#" {...args}>
+    Link
+  </Link>
+);