From 1ce56a4ed8bf457ee5fb77cd1a3d2b47847da2e8 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Fri, 10 Jul 2020 21:38:10 +0800
Subject: [PATCH] Fix controls annotation typo

---
 addons/controls/README.md | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/addons/controls/README.md b/addons/controls/README.md
index 8633407e161..dc13c652fc8 100644
--- a/addons/controls/README.md
+++ b/addons/controls/README.md
@@ -337,8 +337,7 @@ export default {
   component: Widget,
   argTypes: {
     loadingState: {
-      type: 'inline-radio',
-      options: ['loading', 'error', 'ready'],
+      control: { type: 'inline-radio', options: ['loading', 'error', 'ready'] },
     },
   },
 };
@@ -351,7 +350,9 @@ export default {
   title: 'Gizmo',
   component: Gizmo,
   argTypes: {
-    width: { type: 'range', min: 400, max: 1200, step: 50 };
+    width: {
+      control: { type: 'range', min: 400, max: 1200, step: 50 },
+    },
   },
 };
 ```
@@ -473,7 +474,9 @@ export const Reflow = ({ count, label, ...args }) => (
   <>{range(count).map((i) => <Button label={`${label} ${i}` {...args}} />)}</>
 );
 Reflow.args = { count: 3, label: 'reflow' };
-Reflow.argTypes = { count: { control: { type: 'range', min: 0, max: 20 } } };
+Reflow.argTypes = {
+  count: { control: { type: 'range', min: 0, max: 20 } }
+};
 ```
 
 ### My controls aren't being auto-generated. What should I do?