@redis-ui/components 43.2.1 → 44.0.1

package/skills/redis-ui-components/references/Loader.md

@@ -12,7 +12,7 @@ import { Loader } from '@redislabsdev/redis-ui-components';
 
 | Prop | Type | Default | Description |
 |------|------|---------|-------------|
-| size | `string` | theme default | Custom loader size |
+| size | `LoaderSize` | `'XL'` | Predefined loader size |
 | inline | `boolean` | `false` | Renders the loader inline with surrounding content |
 | loaderText | `string` | - | Text shown next to the loader |
 | dataTestId | `string` | - | Deprecated test id for the SVG element |
@@ -23,6 +23,10 @@ import { Loader } from '@redislabsdev/redis-ui-components';
 
 `'regular' | 'pending' | 'inverse'`
 
+### `LoaderSize`
+
+`'XS' | 'S' | 'M' | 'L' | 'XL'`
+
 ## Examples
 
 ### Playground
@@ -30,20 +34,22 @@ import { Loader } from '@redislabsdev/redis-ui-components';
 ```tsx
 import { Loader } from '@redislabsdev/redis-ui-components';
 
-<Loader size="5rem" inline={false} loaderText="" variant="regular" />
+<Loader size="XL" inline={false} loaderText="" variant="regular" />
 ```
 
-### CustomSize
+### Sizes
 
-> Loaders can have a custom size by providing a value to the `size` prop. If you do not provide a value to the `size` prop, the size of the loader will be set to `5rem`.
+> Loaders support predefined t-shirt sizes. If you do not provide a value to the `size` prop, the size of the loader will default to `XL`.
 
 ```tsx
 import { Loader } from '@redislabsdev/redis-ui-components';
 
 <>
-  <Loader size="3rem" />
-  <Loader />
-  <Loader size="7rem" />
+  <Loader size="XS" />
+  <Loader size="S" />
+  <Loader size="M" />
+  <Loader size="L" />
+  <Loader size="XL" />
 </>
 ```
 
@@ -94,7 +100,7 @@ const inverseBackground = theme.semantic.color.icon.neutral500;
 
 ## Notes
 
-- `size` falls back to the theme default when omitted.
+- `size` falls back to `M` when omitted.
 - `loaderText` replaces the hidden accessibility label.
 - `inline` changes the layout but not the loading semantics.
 - `dataTestId` is deprecated; use `data-testid` instead.

package/skills/redis-ui-components/references/Popover.md

@@ -506,7 +506,7 @@ function AsyncContentComponent() {
   }, []);
 
   return loading ? (
-    <Loader size="15" />
+    <Loader size="S" />
   ) : (
     <div>
       <p>Async content:</p>

package/skills/redis-ui-components/references/Tooltip.md

@@ -550,7 +550,7 @@ function AsyncContentComponent() {
   }, []);
 
   return loading ? (
-    <Loader size="15" />
+    <Loader size="S" />
   ) : (
     <div>
       <p>Async content:</p>