feat(Tabs): allow string for TabItem counter value

gravity-ui · Dec 12, 2024 · c083a0a · c083a0a
1 parent 555b186
commit c083a0a
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 13 deletions.
diff --git a/src/components/Tabs/README.md b/src/components/Tabs/README.md
@@ -290,16 +290,16 @@ LANDING_BLOCK-->
 
 ### Tabs.Item properties
 
-| Name     | Description                    |            Type            | Default |
-| :------- | ------------------------------ | :------------------------: | :-----: |
-| id       | Tab ID                         |          `string`          |         |
-| title    | Tab title                      | `string` `React.ReactNode` |         |
-| meta     | Tab description                |          `string`          |         |
-| hint     | HTML title attribute           |          `string`          |         |
-| icon     | Icon displayed at the start    |     `React.ReactNode`      |         |
-| counter  | Number displayed at the end    |     `React.ReactNode`      |         |
-| label    | `<Label>` displayed at the end |     `React.ReactNode`      |         |
-| disabled | Inactive state                 |         `boolean`          |         |
+| Name     | Description                    |       Type        | Default |
+| :------- | ------------------------------ | :---------------: | :-----: |
+| id       | Tab ID                         |     `string`      |         |
+| title    | Tab title                      | `React.ReactNode` |         |
+| meta     | Tab description                |     `string`      |         |
+| hint     | HTML title attribute           |     `string`      |         |
+| icon     | Icon displayed at the start    | `React.ReactNode` |         |
+| counter  | Number displayed at the end    | `number` `string` |         |
+| label    | `<Label>` displayed at the end | `React.ReactNode` |         |
+| disabled | Inactive state                 |     `boolean`     |         |
 
 ## Properties
 

diff --git a/src/components/Tabs/TabsItem.tsx b/src/components/Tabs/TabsItem.tsx
@@ -25,14 +25,14 @@ type ExtraProps = Omit<
 export interface TabsItemProps {
     id: string;
     className?: string;
-    title: string | React.ReactNode;
+    title: React.ReactNode;
     meta?: string;
     hint?: string;
     active?: boolean;
     disabled?: boolean;
     hasOverflow?: boolean;
     icon?: React.ReactNode;
-    counter?: number;
+    counter?: number | string;
     label?: {
         content: React.ReactNode;
         theme?: LabelProps['theme'];
@@ -100,7 +100,7 @@ export function TabsItem({
             <div className={b('item-content')}>
                 {icon && <div className={b('item-icon')}>{icon}</div>}
                 <div className={b('item-title')}>{title || id}</div>
-                {typeof counter === 'number' && <div className={b('item-counter')}>{counter}</div>}
+                {counter !== undefined && <div className={b('item-counter')}>{counter}</div>}
                 {label && (
                     <Label className={b('item-label')} theme={label.theme}>
                         {label.content}