ni · rajsite · Apr 30, 2024 · Apr 30, 2024 · Apr 30, 2024 · Apr 30, 2024
diff --git a/change/@ni-nimble-components-a50e3677-9a73-4e8a-ba2b-efcccf48fd57.json b/change/@ni-nimble-components-a50e3677-9a73-4e8a-ba2b-efcccf48fd57.json
@@ -0,0 +1,7 @@
+{
+  "type": "none",
+  "comment": "Storybook updates",
+  "packageName": "@ni/nimble-components",
+  "email": "rajsite@users.noreply.github.com",
+  "dependentChangeType": "none"
+}
@@ -111,7 +111,7 @@ export const _banner: StoryObj<BannerArgs> = {
         toggle: {
             description:
                 'Event emitted by the banner when the `open` state changes. The event details include the booleans `oldState` and `newState`.',
-            control: { type: 'none' }
+            control: false
         }
     },
     args: {

@@ -28,6 +28,6 @@ ${tokenContent}
 
 See the "Tokens/Label Providers" docs page for more information.
 `,
-        control: { type: 'none' }
+        control: false
     };
 }
@@ -23,27 +23,27 @@ export const iconMapping: StoryObj = {
     argTypes: {
         key: {
             description: mappingKeyDescription('the mapped icon'),
-            control: { type: 'none' }
+            control: false
         },
         icon: {
-            control: { type: 'none' },
+            control: false,
             description: `The tag name of the Nimble icon to render, e.g. \`nimble-icon-check\`. Alternatively, set \`icon\` to \`undefined\` to render
                 no icon for the mapping while still providing a label to be used when grouping. Space will always be reserved for the icon so
                 that the text in cells and group rows associated with icon mappings will always be aligned.`
         },
         severity: {
-            control: { type: 'none' },
+            control: false,
             description:
                 'Must be one of the values in the `IconSeverity` enum. Controls the color of the icon.'
         },
         text: {
-            control: { type: 'none' },
+            control: false,
             description: `A textual description of the value. The text will be displayed next to the icon in a cell if \`text-hidden\` is not set,
             or as the tooltip and accessible  name of the icon if \`text-hidden\` is set. The text is also displayed next to the icon
             in a group header. This attribute is required.`
         },
         textHidden: {
-            control: { type: 'none' },
+            control: false,
             name: 'text-hidden',
             description:
                 "When set, the text is hidden within the table's cells. When unset, the text is rendered next to the icon within the cell."

@@ -23,16 +23,16 @@ export const spinnerMapping: StoryObj = {
     argTypes: {
         key: {
             description: mappingKeyDescription('a spinner'),
-            control: { type: 'none' }
+            control: false
         },
         text: {
-            control: { type: 'none' },
+            control: false,
             description: `A textual description of the value. The text will be displayed next to the spinner in a cell if \`text-hidden\` is not set,
                 or as the tooltip and accessible  name of the spinner if \`text-hidden\` is set. The text is also displayed next to the spinner
                 in a group header. This attribute is required.`
         },
         textHidden: {
-            control: { type: 'none' },
+            control: false,
             name: 'text-hidden',
             description:
                 "When set, the text is hidden within the table's cells. When unset, the text is rendered next to the spinner within the cell."

@@ -23,7 +23,7 @@ export const textMapping: StoryObj = {
     argTypes: {
         key: {
             description: mappingKeyDescription('the mapped display text'),
-            control: { type: 'none' }
+            control: false
         },
         text: {
             description: 'The display text.'

@@ -22,7 +22,7 @@ export const userMapping: StoryObj = {
     argTypes: {
         key: {
             description: 'A key (url) for each user that maps to a user',
-            control: { type: 'none' }
+            control: false
         },
         displayName: {
             name: 'display-name',

@@ -55,7 +55,7 @@ export const richTextMentionUsers: StoryObj = {
     argTypes: {
         pattern: {
             description: patternDescription,
-            control: { type: 'none' }
+            control: false
         },
         checkValidity: {
             name: 'checkValidity()',

@@ -108,7 +108,7 @@ export const anchorColumn: StoryObj<AnchorColumnTableArgs> = {
             name: 'href-field-name',
             description:
                 'Set this attribute to identify which field in the data record contains the link url for each cell in the column. If the field is not defined in a particular record, that cell will be displayed as plain text instead of a link. The field values must be of type `string`.',
-            control: { type: 'none' }
+            control: false
         },
         appearance: {
             options: Object.keys(AnchorAppearance),

@@ -163,7 +163,7 @@ export const dateTextColumn: StoryObj<TextColumnTableArgs> = {
             name: 'field-name',
             description:
                 'Set this attribute to identify which field in the data record should be displayed in each column. The field values must be of type `number` and represent the number of milliseconds since January 1, 1970 UTC. This is the representation used by the `Date` type.',
-            control: { type: 'none' }
+            control: false
         },
         placeholder: {
             description:

@@ -95,7 +95,7 @@ export const durationTextColumn: StoryObj<TextColumnTableArgs> = {
             name: 'field-name',
             description:
                 'Set this attribute to identify which field in the data record should be displayed in each column. The field values must be of type `number` and represent a total number of milliseconds.',
-            control: { type: 'none' }
+            control: false
         },
         placeholder: {
             description:

@@ -114,11 +114,11 @@ export const iconColumn: StoryObj<IconColumnTableArgs> = {
             name: 'field-name',
             description:
                 "Set this attribute to identify which field in the data record contains the value for each cell in the column. The field values' type must match the type specified by the `key-type` attribute.",
-            control: { type: 'none' }
+            control: false
         },
         keyType: {
             name: 'key-type',
-            control: { type: 'none' },
+            control: false,
             defaultValue: { summary: '"string"' },
             description:
                 'The data type of the key values used for this column. Must be one of `"string"`, `"number"`, or `"boolean"`. Defaults to `"string"` if unspecified.'

@@ -178,7 +178,7 @@ export const numberTextColumn: StoryObj<NumberTextColumnTableArgs> = {
             name: 'field-name',
             description:
                 'Set this attribute to identify which field in the data record should be displayed in each column. The field values must be of type `number`.',
-            control: { type: 'none' }
+            control: false
         },
         placeholder: {
             description:

@@ -620,7 +620,7 @@ const metadata: Meta<TableArgs> = {
             }
         },
         status: {
-            options: statusOptions,
+            options: [...statusOptions],
             control: {
                 type: 'radio'
             }