sy-ui-lib 1.0.35 → 1.0.36

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -10,9 +10,11 @@ import { StatsListProp } from './StatsList.types';
10
10
  * - On hover, a tooltip displays additional details for the card.
11
11
  * - In `linear` mode: shows stats inline with the title and value.
12
12
  * - In `gradient` mode: Displays stats in a flexible layout with a transparent gradient background.
13
+ * - Set `vertical` to `true` to stack items vertically instead of using the default horizontal layout.
13
14
  *
14
15
  * Props:
15
16
  * @param {"card" | "linear" | "gradient"} [type="linear"] - Determines the layout style of the stats list.
17
+ * @param {boolean} [vertical=false] - When `true`, renders stat items in a vertical layout. Defaults to a horizontal layout.
16
18
  * @param {StatItem[]} [statItems] - Array of stat items with name and value object.
17
19
  * StatItem[statTitle] Optional. In `card` variant, shows an info icon with tooltip.
18
20
  * - `title`: Tooltip text.
@@ -5,7 +5,13 @@ export default meta;
5
5
  type Story = StoryObj<typeof StatsList>;
6
6
  /** Card Story: Displays the StatsList in a card layout. */
7
7
  export declare const Card: Story;
8
+ /** Card Vertical Story: Displays the StatsList in a Vertical card layout. */
9
+ export declare const CardVertical: Story;
8
10
  /** Linear Story: Displays the stats in a horizontal linear layout. */
9
11
  export declare const Linear: Story;
12
+ /** Linear Vertical Story: Displays the stats in a Vertical linear layout. */
13
+ export declare const LinearVertical: Story;
10
14
  /** Gradient Story: Displays the stats in a gradient-styled layout */
11
15
  export declare const Gradient: Story;
16
+ /** Gradient Vertical Story: Displays the stats in a gradient-styled in Vertical layout */
17
+ export declare const GradientVertical: Story;
@@ -36,4 +36,6 @@ export interface StatsListProp {
36
36
  type?: StatType;
37
37
  /** Array of the stats item to display. */
38
38
  statItems: StatItem[];
39
+ /** renders stat items in a vertical layout */
40
+ vertical?: boolean;
39
41
  }