fix(ui): types fix in storybook

cloudoperators · Nov 17, 2024 · 1c962ed · 1c962ed
1 parent 10f6e9f
commit 1c962ed
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 3 deletions.
diff --git a/packages/ui-components/src/components/ComboBox/ComboBox.component.tsx b/packages/ui-components/src/components/ComboBox/ComboBox.component.tsx
@@ -463,9 +463,9 @@ export interface ComboBoxProps extends Omit<React.HTMLAttributes<HTMLDivElement>
   /** Whether the ComboBox has an error. Note this refers to an internal error like failing to load options etc., to indicate failed validation use `invalid` instead. */
   error?: boolean
   /** An errortext to display when the ComboBox failed validation or an internal error occurred. */
-  errortext?: JSX.Element | string
+  errortext?: React.ReactNode
   /** A helptext to render to explain meaning and significance of the ComboBox */
-  helptext?: JSX.Element | string
+  helptext?: React.ReactNode
   /** The Id of the ComboBox. Will be assigned to the text input part of the ComboBox. If not passed, an id will be auto-generated. */
   id?: string
   /** Whether the ComboBox failed validation */
@@ -491,7 +491,7 @@ export interface ComboBoxProps extends Omit<React.HTMLAttributes<HTMLDivElement>
   /** Whether the ComboBox is required */
   required?: boolean
   /** A text to display in case the ComboBox was successfully validated. Will set the ComboBox to `valid` when passed. */
-  successtext?: JSX.Element | string
+  successtext?: React.ReactNode
   /** Whether the option labels should be truncated in case they are longer/wider than the available space in an option or not. Default is FALSE. */
   truncateOptions?: boolean
   /** Whether the ComboBox was successfully validated */

diff --git a/packages/ui-components/src/components/ComboBox/ComboBox.stories.tsx b/packages/ui-components/src/components/ComboBox/ComboBox.stories.tsx
@@ -23,12 +23,33 @@ export default {
     },
     errortext: {
       control: false,
+      table: {
+        type: { summary: "ReactNode" },
+      },
     },
     helptext: {
       control: false,
+      table: {
+        type: { summary: "ReactNode" },
+      },
     },
     successtext: {
       control: false,
+      table: {
+        type: { summary: "ReactNode" },
+      },
+    },
+    onBlur: {
+      control: false
+    },
+    onChange: {
+      control: false
+    },
+    onFocus: {
+      control: false
+    },
+    onInputChange: {
+      control: false
     },
   },
   decorators: [

diff --git a/packages/ui-components/src/components/ComboBoxOption/ComboBoxOption.component.tsx b/packages/ui-components/src/components/ComboBoxOption/ComboBoxOption.component.tsx
@@ -100,9 +100,14 @@ export const ComboBoxOption: React.FC<ComboBoxOptionProps> = ({
 }
 
 export interface ComboBoxOptionProps extends React.HTMLProps<HTMLLIElement> {
+  /** Children - will be shown to user */
   children?: string
+  /** If option is disabled */
   disabled?: boolean
+  /** Option value */
   value?: string
+  /** Option label */
   label?: string
+  /** Class for the option */
   className?: string
 }