Merge pull request #14267 from storybookjs/tweak-args-docs

Update docs for argType.options
storybookjs · Mar 18, 2021 · 491021d · 491021d
2 parents a748246 + b9580b4
commit 491021d
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 17 deletions.
diff --git a/docs/writing-stories/args.md b/docs/writing-stories/args.md
@@ -143,15 +143,12 @@ Args specified through the URL will extend and override any default values of ar
 
 ## Mapping to complex arg values
 
-Complex values such as JSX elements cannot be serialized to the manager (e.g. the Controls addon) or synced with the URL. To work around this limitation, arg values can be "mapped" from a simple string to a complex type using the `mapping` property in `argTypes`. This works on any type of arg, but makes most sense when used with the 'select' control.
+Complex values such as JSX elements cannot be serialized to the manager (e.g. the Controls addon) or synced with the URL. To work around this limitation, arg values can be "mapped" from a simple string to a complex type using the `mapping` property in `argTypes`. This works on any type of arg, but makes most sense when used with the `select` control type.
 
 ```
 argTypes: {
   label: {
-    control: {
-      type: 'select',
-      options: ['Normal', 'Bold', 'Italic']
-    },
+    options: ['Normal', 'Bold', 'Italic'],
     mapping: {
       Bold: <b>Bold</b>,
       Italic: <i>Italic</i>
@@ -160,17 +157,7 @@ argTypes: {
 }
 ```
 
-Note that `mapping` does not have to be exhaustive. If the arg value is not a property of `mapping`, the value will be used directly. Keys in `mapping` always correspond to arg *values*, even when `options` is an object. Specifying `options` as an object (key-value pairs) is useful if you want to use special characters in the input label. For example:
-
-```
-{
-  control: {
-    type: 'select',
-    options: { да: 'yes', нет: 'no' }
-  },
-  mapping: { yes: 'да', no: 'нет' }
-}
-```
+Note that `mapping` does not have to be exhaustive. If the arg value is not a property of `mapping`, the value will be used directly. Keys in `mapping` always correspond to arg *values*, not their index in the `options` array.
 
 <details>
 <summary>Using args in addons</summary>

diff --git a/lib/client-api/src/inferArgTypes.ts b/lib/client-api/src/inferArgTypes.ts
@@ -20,7 +20,7 @@ const inferType = (value: any, name: string, visited: Set<any>): SBType => {
   if (value) {
     if (visited.has(value)) {
       logger.warn(dedent`
-        We've detected a cycle in arg '${name}'. Args should be JSON-serializable (-ish, functions are ok).
+        We've detected a cycle in arg '${name}'. Args should be JSON-serializable.
 
         More info: https://storybook.js.org/docs/react/essentials/controls#fully-custom-args
       `);