@vibe/core 3.74.0 → 3.75.0

package/dist/metadata.json

@@ -2880,6 +2880,505 @@
     "parentComponent": "BreadcrumbsBar",
     "subComponents": []
   },
+  {
+    "filePath": "src/Button/Button.tsx",
+    "aggregator": "core",
+    "symbols": [
+      "default as Button",
+      "type ButtonProps",
+      "ButtonType",
+      "ButtonInputType",
+      "ButtonColor",
+      "ButtonSize"
+    ],
+    "displayName": "Button",
+    "description": "",
+    "props": {
+      "className": {
+        "defaultValue": null,
+        "description": "Custom class names to pass to the component",
+        "name": "className",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "activeButtonClassName": {
+        "defaultValue": null,
+        "description": "",
+        "name": "activeButtonClassName",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "kind": {
+        "defaultValue": {
+          "value": "primary"
+        },
+        "description": "The button's kind",
+        "name": "kind",
+        "required": false,
+        "type": {
+          "name": "enum",
+          "raw": "ButtonType",
+          "value": [
+            {
+              "value": "\"primary\""
+            },
+            {
+              "value": "\"secondary\""
+            },
+            {
+              "value": "\"tertiary\""
+            }
+          ]
+        }
+      },
+      "onClick": {
+        "defaultValue": null,
+        "description": "Callback function to run when the button is clicked",
+        "name": "onClick",
+        "required": false,
+        "type": {
+          "name": "(event: React.MouseEvent<HTMLButtonElement>) => void"
+        }
+      },
+      "onMouseDown": {
+        "defaultValue": null,
+        "description": "",
+        "name": "onMouseDown",
+        "required": false,
+        "type": {
+          "name": "(event: React.MouseEvent<HTMLButtonElement>) => void"
+        }
+      },
+      "blurOnMouseUp": {
+        "defaultValue": {
+          "value": "true"
+        },
+        "description": "Blur on button click",
+        "name": "blurOnMouseUp",
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
+      "name": {
+        "defaultValue": null,
+        "description": "Name of the button - for form submit usages",
+        "name": "name",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "size": {
+        "defaultValue": {
+          "value": "medium"
+        },
+        "description": "The button's size",
+        "name": "size",
+        "required": false,
+        "type": {
+          "name": "enum",
+          "raw": "ButtonSize",
+          "value": [
+            {
+              "value": "\"xxs\""
+            },
+            {
+              "value": "\"xs\""
+            },
+            {
+              "value": "\"small\""
+            },
+            {
+              "value": "\"medium\""
+            },
+            {
+              "value": "\"large\""
+            }
+          ]
+        }
+      },
+      "color": {
+        "defaultValue": {
+          "value": "primary"
+        },
+        "description": "The button's color",
+        "name": "color",
+        "required": false,
+        "type": {
+          "name": "enum",
+          "raw": "ButtonColor",
+          "value": [
+            {
+              "value": "\"primary\""
+            },
+            {
+              "value": "\"positive\""
+            },
+            {
+              "value": "\"negative\""
+            },
+            {
+              "value": "\"inverted\""
+            },
+            {
+              "value": "\"on-primary-color\""
+            },
+            {
+              "value": "\"on-inverted-background\""
+            },
+            {
+              "value": "\"brand\""
+            },
+            {
+              "value": "\"fixed-light\""
+            },
+            {
+              "value": "\"fixed-dark\""
+            }
+          ]
+        }
+      },
+      "type": {
+        "defaultValue": {
+          "value": "button"
+        },
+        "description": "The button's type",
+        "name": "type",
+        "required": false,
+        "type": {
+          "name": "enum",
+          "raw": "ButtonInputType",
+          "value": [
+            {
+              "value": "\"button\""
+            },
+            {
+              "value": "\"submit\""
+            },
+            {
+              "value": "\"reset\""
+            }
+          ]
+        }
+      },
+      "disabled": {
+        "defaultValue": {
+          "value": "false"
+        },
+        "description": "Whether the button should be disabled or not",
+        "name": "disabled",
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
+      "rightIcon": {
+        "defaultValue": {
+          "value": "null"
+        },
+        "description": "Icon to place on the right",
+        "name": "rightIcon",
+        "required": false,
+        "type": {
+          "name": "SubIcon"
+        }
+      },
+      "leftIcon": {
+        "defaultValue": {
+          "value": "null"
+        },
+        "description": "Icon to place on the left",
+        "name": "leftIcon",
+        "required": false,
+        "type": {
+          "name": "SubIcon"
+        }
+      },
+      "success": {
+        "defaultValue": {
+          "value": "false"
+        },
+        "description": "the success props are used when you have async action and wants to display a success message",
+        "name": "success",
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
+      "successIcon": {
+        "defaultValue": {
+          "value": "null"
+        },
+        "description": "Success icon name",
+        "name": "successIcon",
+        "required": false,
+        "type": {
+          "name": "SubIcon"
+        }
+      },
+      "successText": {
+        "defaultValue": {
+          "value": ""
+        },
+        "description": "Success text",
+        "name": "successText",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "loading": {
+        "defaultValue": null,
+        "description": "loading boolean which switches the text to a loader",
+        "name": "loading",
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
+      "loaderClassName": {
+        "defaultValue": null,
+        "description": "className which is applied to loader container *",
+        "name": "loaderClassName",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "style": {
+        "defaultValue": null,
+        "description": "",
+        "name": "style",
+        "required": false,
+        "type": {
+          "name": "React.CSSProperties"
+        }
+      },
+      "active": {
+        "defaultValue": {
+          "value": "false"
+        },
+        "description": "displays the active state",
+        "name": "active",
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
+      "id": {
+        "defaultValue": null,
+        "description": "id to pass to the button",
+        "name": "id",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "marginRight": {
+        "defaultValue": {
+          "value": "false"
+        },
+        "description": "adds 8px margin to the right",
+        "name": "marginRight",
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
+      "marginLeft": {
+        "defaultValue": {
+          "value": "false"
+        },
+        "description": "adds 8px margin to the left",
+        "name": "marginLeft",
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
+      "ariaLabeledBy": {
+        "defaultValue": null,
+        "description": "element id to describe the button accordingly",
+        "name": "ariaLabeledBy",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "ariaLabel": {
+        "defaultValue": null,
+        "description": "aria label to provide important when providing only Icon",
+        "name": "ariaLabel",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "ariaHasPopup": {
+        "defaultValue": null,
+        "description": "aria for a button popup",
+        "name": "ariaHasPopup",
+        "required": false,
+        "type": {
+          "name": "React.HTMLProps<HTMLButtonElement>"
+        }
+      },
+      "ariaExpanded": {
+        "defaultValue": null,
+        "description": "aria to be set if the popup is open",
+        "name": "ariaExpanded",
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
+      "ariaControls": {
+        "defaultValue": null,
+        "description": "aria controls - receives id for the controlled region",
+        "name": "ariaControls",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "aria-describedby": {
+        "defaultValue": null,
+        "description": "",
+        "name": "aria-describedby",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "aria-hidden": {
+        "defaultValue": null,
+        "description": "aria to be used for screen reader to know if the button is hidden",
+        "name": "aria-hidden",
+        "required": false,
+        "type": {
+          "name": "Booleanish"
+        }
+      },
+      "aria-pressed": {
+        "defaultValue": null,
+        "description": "Indicates the current \"pressed\" state of toggle buttons",
+        "name": "aria-pressed",
+        "required": false,
+        "type": {
+          "name": "boolean | \"true\" | \"false\" | \"mixed\""
+        }
+      },
+      "onFocus": {
+        "defaultValue": null,
+        "description": "On Button Focus callback",
+        "name": "onFocus",
+        "required": false,
+        "type": {
+          "name": "(event: React.FocusEvent<HTMLButtonElement>) => void"
+        }
+      },
+      "onBlur": {
+        "defaultValue": null,
+        "description": "On Button Blur callback",
+        "name": "onBlur",
+        "required": false,
+        "type": {
+          "name": "(event: React.FocusEvent<HTMLButtonElement>) => void"
+        }
+      },
+      "rightFlat": {
+        "defaultValue": {
+          "value": "false"
+        },
+        "description": "",
+        "name": "rightFlat",
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
+      "leftFlat": {
+        "defaultValue": {
+          "value": "false"
+        },
+        "description": "",
+        "name": "leftFlat",
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
+      "preventClickAnimation": {
+        "defaultValue": {
+          "value": "false"
+        },
+        "description": "",
+        "name": "preventClickAnimation",
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
+      "noSidePadding": {
+        "defaultValue": {
+          "value": "false"
+        },
+        "description": "",
+        "name": "noSidePadding",
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
+      "defaultTextColorOnPrimaryColor": {
+        "defaultValue": {
+          "value": "rgba(0, 0, 0, 0)"
+        },
+        "description": "default color for text color in ON_PRIMARY_COLOR kind (should be any type of css color (rbg, var, hex...)",
+        "name": "defaultTextColorOnPrimaryColor",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "data-testid": {
+        "defaultValue": null,
+        "description": "A unique identifier for testing purposes.",
+        "name": "data-testid",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "insetFocus": {
+        "defaultValue": {
+          "value": "false"
+        },
+        "description": "Change the focus indicator from around the button to within it",
+        "name": "insetFocus",
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
+      "tabIndex": {
+        "defaultValue": null,
+        "description": "Specifies the tab order of an element",
+        "name": "tabIndex",
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      }
+    },
+    "import": "import { Button } from \"@vibe/button\"",
+    "subComponents": []
+  },
   {
     "filePath": "src/components/ButtonGroup/ButtonGroup.tsx",
     "aggregator": "core",
@@ -7853,111 +8352,318 @@
         "required": false,
         "type": {
           "name": "enum",
-          "raw": "TypographyAlign",
+          "raw": "TypographyAlign",
+          "value": [
+            {
+              "value": "\"inherit\""
+            },
+            {
+              "value": "\"start\""
+            },
+            {
+              "value": "\"center\""
+            },
+            {
+              "value": "\"end\""
+            }
+          ]
+        }
+      },
+      "color": {
+        "defaultValue": null,
+        "description": "The text color.",
+        "name": "color",
+        "required": false,
+        "type": {
+          "name": "enum",
+          "raw": "TypographyColor",
+          "value": [
+            {
+              "value": "\"inherit\""
+            },
+            {
+              "value": "\"primary\""
+            },
+            {
+              "value": "\"secondary\""
+            },
+            {
+              "value": "\"onPrimary\""
+            },
+            {
+              "value": "\"onInverted\""
+            },
+            {
+              "value": "\"fixedLight\""
+            },
+            {
+              "value": "\"fixedDark\""
+            },
+            {
+              "value": "\"negative\""
+            }
+          ]
+        }
+      },
+      "children": {
+        "defaultValue": null,
+        "description": "The content inside the heading.",
+        "name": "children",
+        "required": true,
+        "type": {
+          "name": "ReactNode"
+        }
+      },
+      "element": {
+        "defaultValue": null,
+        "description": "The HTML element tag used for the text component.",
+        "name": "element",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "ellipsis": {
+        "defaultValue": null,
+        "description": "If true, truncates overflowing text with an ellipsis.",
+        "name": "ellipsis",
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
+      "maxLines": {
+        "defaultValue": null,
+        "description": "The maximum number of lines before truncating with an ellipsis.",
+        "name": "maxLines",
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      },
+      "tooltipProps": {
+        "defaultValue": null,
+        "description": "Props passed to the tooltip displayed when hovering over the text.",
+        "name": "tooltipProps",
+        "required": false,
+        "type": {
+          "name": "Partial<TooltipProps>"
+        }
+      },
+      "withoutTooltip": {
+        "defaultValue": null,
+        "description": "If true, disables the tooltip that appears when text is truncated.",
+        "name": "withoutTooltip",
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
+      "className": {
+        "defaultValue": null,
+        "description": "A CSS class name to apply to the component.",
+        "name": "className",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "data-testid": {
+        "defaultValue": null,
+        "description": "A unique identifier for testing purposes.",
+        "name": "data-testid",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "id": {
+        "defaultValue": null,
+        "description": "An HTML id attribute for the component.",
+        "name": "id",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      }
+    },
+    "import": "import { Heading } from \"@vibe/core\"",
+    "subComponents": []
+  },
+  {
+    "filePath": "src/components/HiddenText/HiddenText.tsx",
+    "aggregator": "core",
+    "symbols": [
+      "default as HiddenText",
+      "type HiddenTextProps"
+    ],
+    "displayName": "HiddenText",
+    "description": "",
+    "props": {
+      "text": {
+        "defaultValue": null,
+        "description": "The text content that is hidden but available for assistive technologies.",
+        "name": "text",
+        "required": true,
+        "type": {
+          "name": "string"
+        }
+      },
+      "className": {
+        "defaultValue": {
+          "value": ""
+        },
+        "description": "A CSS class name to apply to the component.",
+        "name": "className",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "data-testid": {
+        "defaultValue": null,
+        "description": "A unique identifier for testing purposes.",
+        "name": "data-testid",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "id": {
+        "defaultValue": {
+          "value": "hiddenText"
+        },
+        "description": "An HTML id attribute for the component.",
+        "name": "id",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      }
+    },
+    "import": "import { HiddenText } from \"@vibe/core\"",
+    "subComponents": []
+  },
+  {
+    "filePath": "src/Icon/Icon.tsx",
+    "aggregator": "core",
+    "symbols": [
+      "default as Icon",
+      "type IconProps"
+    ],
+    "displayName": "Icon",
+    "description": "",
+    "props": {
+      "icon": {
+        "defaultValue": {
+          "value": ""
+        },
+        "description": "The icon name, component, or source URL.",
+        "name": "icon",
+        "required": false,
+        "type": {
+          "name": "SubIcon"
+        }
+      },
+      "iconLabel": {
+        "defaultValue": null,
+        "description": "The accessible label for the icon.",
+        "name": "iconLabel",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "iconType": {
+        "defaultValue": {
+          "value": "svg"
+        },
+        "description": "The type of the icon: `svg`, `font`, or `src` (external source).",
+        "name": "iconType",
+        "required": false,
+        "type": {
+          "name": "enum",
+          "raw": "IconType",
           "value": [
             {
-              "value": "\"inherit\""
-            },
-            {
-              "value": "\"start\""
+              "value": "\"svg\""
             },
             {
-              "value": "\"center\""
+              "value": "\"font\""
             },
             {
-              "value": "\"end\""
+              "value": "\"src\""
             }
           ]
         }
       },
-      "color": {
-        "defaultValue": null,
-        "description": "The text color.",
-        "name": "color",
+      "iconSize": {
+        "defaultValue": {
+          "value": "16"
+        },
+        "description": "The size of the icon.",
+        "name": "iconSize",
         "required": false,
         "type": {
-          "name": "enum",
-          "raw": "TypographyColor",
-          "value": [
-            {
-              "value": "\"inherit\""
-            },
-            {
-              "value": "\"primary\""
-            },
-            {
-              "value": "\"secondary\""
-            },
-            {
-              "value": "\"onPrimary\""
-            },
-            {
-              "value": "\"onInverted\""
-            },
-            {
-              "value": "\"fixedLight\""
-            },
-            {
-              "value": "\"fixedDark\""
-            },
-            {
-              "value": "\"negative\""
-            }
-          ]
+          "name": "string | number"
         }
       },
-      "children": {
-        "defaultValue": null,
-        "description": "The content inside the heading.",
-        "name": "children",
-        "required": true,
+      "ignoreFocusStyle": {
+        "defaultValue": {
+          "value": "false"
+        },
+        "description": "If true, removes focus styles from the icon.",
+        "name": "ignoreFocusStyle",
+        "required": false,
         "type": {
-          "name": "ReactNode"
+          "name": "boolean"
         }
       },
-      "element": {
+      "tabindex": {
         "defaultValue": null,
-        "description": "The HTML element tag used for the text component.",
-        "name": "element",
+        "description": "The tab index of the icon for keyboard navigation.",
+        "name": "tabindex",
         "required": false,
         "type": {
-          "name": "string"
+          "name": "string | number"
         }
       },
-      "ellipsis": {
+      "ariaHidden": {
         "defaultValue": null,
-        "description": "If true, truncates overflowing text with an ellipsis.",
-        "name": "ellipsis",
+        "description": "If true, hides the icon from screen readers.",
+        "name": "ariaHidden",
         "required": false,
         "type": {
           "name": "boolean"
         }
       },
-      "maxLines": {
+      "style": {
         "defaultValue": null,
-        "description": "The maximum number of lines before truncating with an ellipsis.",
-        "name": "maxLines",
+        "description": "Inline styles applied to the icon.",
+        "name": "style",
         "required": false,
         "type": {
-          "name": "number"
+          "name": "React.CSSProperties"
         }
       },
-      "tooltipProps": {
-        "defaultValue": null,
-        "description": "Props passed to the tooltip displayed when hovering over the text.",
-        "name": "tooltipProps",
+      "useCurrentColor": {
+        "defaultValue": {
+          "value": "false"
+        },
+        "description": "If true, replaces `fill` property with `currentColor` when using an `src` icon.",
+        "name": "useCurrentColor",
         "required": false,
         "type": {
-          "name": "Partial<TooltipProps>"
+          "name": "boolean"
         }
       },
-      "withoutTooltip": {
+      "customColor": {
         "defaultValue": null,
-        "description": "If true, disables the tooltip that appears when text is truncated.",
-        "name": "withoutTooltip",
+        "description": "Overrides the default color with a custom color.",
+        "name": "customColor",
         "required": false,
         "type": {
-          "name": "boolean"
+          "name": "string"
         }
       },
       "className": {
@@ -7988,32 +8694,113 @@
         }
       }
     },
-    "import": "import { Heading } from \"@vibe/core\"",
+    "import": "import { Icon } from \"@vibe/icon\"",
     "subComponents": []
   },
   {
-    "filePath": "src/components/HiddenText/HiddenText.tsx",
+    "filePath": "src/Icon/CustomSvgIcon/CustomSvgIcon.tsx",
     "aggregator": "core",
     "symbols": [
-      "default as HiddenText",
-      "type HiddenTextProps"
+      "default as CustomSvgIcon",
+      "type CustomSvgIconProps"
     ],
-    "displayName": "HiddenText",
+    "displayName": "CustomSvgIcon",
     "description": "",
     "props": {
-      "text": {
+      "onClick": {
         "defaultValue": null,
-        "description": "The text content that is hidden but available for assistive technologies.",
-        "name": "text",
+        "description": "Callback fired when the icon is clicked.",
+        "name": "onClick",
+        "required": false,
+        "type": {
+          "name": "(event: React.MouseEvent) => void"
+        }
+      },
+      "src": {
+        "defaultValue": null,
+        "description": "The source URL or object of the SVG icon.",
+        "name": "src",
         "required": true,
+        "type": {
+          "name": "string | object"
+        }
+      },
+      "ariaLabel": {
+        "defaultValue": null,
+        "description": "The accessible label for the icon.",
+        "name": "ariaLabel",
+        "required": false,
         "type": {
           "name": "string"
         }
       },
-      "className": {
+      "tabIndex": {
+        "defaultValue": null,
+        "description": "The tab index of the icon for keyboard navigation.",
+        "name": "tabIndex",
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      },
+      "role": {
+        "defaultValue": null,
+        "description": "The ARIA role of the icon.",
+        "name": "role",
+        "required": false,
+        "type": {
+          "name": "AriaRole"
+        }
+      },
+      "ariaHidden": {
+        "defaultValue": null,
+        "description": "If true, hides the icon from screen readers.",
+        "name": "ariaHidden",
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
+      "clickable": {
+        "defaultValue": null,
+        "description": "If true, makes the icon clickable.",
+        "name": "clickable",
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
+      "replaceToCurrentColor": {
         "defaultValue": {
-          "value": ""
+          "value": "false"
         },
+        "description": "If true, replaces the `fill` attribute in the SVG with `currentColor`.",
+        "name": "replaceToCurrentColor",
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
+      "customColor": {
+        "defaultValue": null,
+        "description": "Overrides the default color of the icon.",
+        "name": "customColor",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "ref": {
+        "defaultValue": null,
+        "description": "Reference to the SVG element.",
+        "name": "ref",
+        "required": false,
+        "type": {
+          "name": "Ref<SVGElement>"
+        }
+      },
+      "className": {
+        "defaultValue": null,
         "description": "A CSS class name to apply to the component.",
         "name": "className",
         "required": false,
@@ -8031,9 +8818,7 @@
         }
       },
       "id": {
-        "defaultValue": {
-          "value": "hiddenText"
-        },
+        "defaultValue": null,
         "description": "An HTML id attribute for the component.",
         "name": "id",
         "required": false,
@@ -8042,7 +8827,7 @@
         }
       }
     },
-    "import": "import { HiddenText } from \"@vibe/core\"",
+    "import": "import { CustomSvgIcon } from \"@vibe/icon\"",
     "subComponents": []
   },
   {
@@ -9621,6 +10406,103 @@
     "import": "import { ListItemIcon } from \"@vibe/core\"",
     "subComponents": []
   },
+  {
+    "filePath": "src/Loader/Loader.tsx",
+    "aggregator": "core",
+    "symbols": [
+      "default as Loader",
+      "type LoaderProps",
+      "LoaderColors",
+      "LoaderSizes",
+      "LoaderSize"
+    ],
+    "displayName": "Loader",
+    "description": "",
+    "props": {
+      "size": {
+        "defaultValue": null,
+        "description": "The size of the loader, either a predefined size or a custom number.",
+        "name": "size",
+        "required": false,
+        "type": {
+          "name": "LoaderSize"
+        }
+      },
+      "color": {
+        "defaultValue": null,
+        "description": "The color of the loader.",
+        "name": "color",
+        "required": false,
+        "type": {
+          "name": "enum",
+          "raw": "LoaderColors",
+          "value": [
+            {
+              "value": "\"primary\""
+            },
+            {
+              "value": "\"secondary\""
+            },
+            {
+              "value": "\"onPrimary\""
+            },
+            {
+              "value": "\"dark\""
+            }
+          ]
+        }
+      },
+      "hasBackground": {
+        "defaultValue": {
+          "value": "false"
+        },
+        "description": "If true, a background circle is displayed behind the loader.",
+        "name": "hasBackground",
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
+      "wrapperClassName": {
+        "defaultValue": null,
+        "description": "Class name applied to the wrapper element.",
+        "name": "wrapperClassName",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "className": {
+        "defaultValue": null,
+        "description": "A CSS class name to apply to the component.",
+        "name": "className",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "data-testid": {
+        "defaultValue": null,
+        "description": "A unique identifier for testing purposes.",
+        "name": "data-testid",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "id": {
+        "defaultValue": null,
+        "description": "An HTML id attribute for the component.",
+        "name": "id",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      }
+    },
+    "import": "import { Loader } from \"@vibe/loader\"",
+    "subComponents": []
+  },
   {
     "filePath": "src/components/Menu/Menu/Menu.tsx",
     "aggregator": "core",