Updates to CancelButton docs and story

performant-software · Sep 27, 2023 · 349bb63 · 349bb63
1 parent f65a414
commit 349bb63
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 1 deletion.
diff --git a/.DS_Store b/.DS_Store
diff --git a/packages/.DS_Store b/packages/.DS_Store
diff --git a/packages/semantic-ui/src/components/CancelButton.js b/packages/semantic-ui/src/components/CancelButton.js
@@ -6,9 +6,13 @@ import i18n from '../i18n/i18n';
 
 type Props = {
   disabled: boolean,
-  onClick: () => void
+  onClick: () => void,
 };
 
+/**
+ * A simple Cancel button component that accepts an onClick method.
+ */
+
 const CancelButton = (props: Props) => (
   <Button
     basic

diff --git a/packages/storybook/src/semantic-ui/CancelButton.stories.js b/packages/storybook/src/semantic-ui/CancelButton.stories.js
@@ -0,0 +1,26 @@
+// @flow
+
+import React from 'react';
+import { action } from '@storybook/addon-actions';
+import { withKnobs, boolean } from '@storybook/addon-knobs';
+import CancelButton from '../../../semantic-ui/src/components/CancelButton';
+
+export default {
+  title: 'Components/Semantic UI/CancelButton',
+  decorators: [withKnobs],
+  component: CancelButton,
+};
+
+export const Default = () => (
+  <CancelButton
+    disabled={boolean('Disabled', false)}
+    onClick={action('click')}
+  />
+);
+
+export const Disabled = () => (
+  <CancelButton
+    disabled={boolean('Disabled', true)}
+    onClick={action('click')}
+  />
+);