chore: wip decorators

Author: zettca

apps/docs/src/content/components/blade.mdx

@@ -27,7 +27,6 @@ import { Header } from "../../components/Header";
       },
     },
   }}
-  decorator={(component) => <div className="flex w-full">{component}</div>}
 >
   <div className="p-xs">The answer to all things is 42.</div>
 </Header>

apps/docs/src/content/components/blades.mdx

@@ -15,7 +15,6 @@ import { Header } from "../../components/Header";
     atLeastOneExpanded: { defaultValue: false },
     fullWidthBlades: { defaultValue: true },
   }}
-  decorator={(component) => <div className="w-full">{component}</div>}
 >
   <HvBlade label="1">
     <div className="flex items-center p-xs">Content 1</div>

apps/docs/src/content/components/carousel.mdx

@@ -18,7 +18,6 @@ import { Header } from "../../components/Header";
     showFullscreen: { defaultValue: true },
     controlsPosition: { defaultValue: "top" },
   }}
-  decorator={(children) => <div className="overflow">{children}</div>}
 >
   {[...Array(7).keys()].map((i) => (
     <HvCarouselSlide

apps/docs/src/content/components/global-actions.mdx

@@ -26,7 +26,6 @@ import { Header } from "../../components/Header";
       </HvIconButton>
     ),
   }}
-  decorator={(component) => <div className="w-full">{component}</div>}
 >
   <HvButton variant="primary">Save</HvButton>
   <HvButton variant="secondarySubtle">Reset</HvButton>

apps/docs/src/content/components/number-input.mdx

@@ -18,11 +18,8 @@ import { Header } from "../../components/Header";
     readOnly: { defaultValue: false },
     disabled: { defaultValue: false },
   }}
-  decorator={(c) => <div className="w-full">{c}</div>}
 />
 
-<br />
-
 <Callout type="info">
   The `HvNumberInput` component shares the same API as `HvInput`. For full
   documentation, see the [HvInput component page](/components/input).

apps/docs/src/content/components/overflow-tooltip.mdx

@@ -24,5 +24,4 @@ import { Header } from "../../components/Header";
         "This is a very long text that should be cut because it so long that it doesn't fit",
     },
   }}
-  decorator={(children) => <div className="max-w-160px">{children}</div>}
 />

apps/docs/src/content/components/query-builder.mdx

@@ -30,7 +30,6 @@ import { Header } from "../../components/Header";
       },
     },
   }}
-  decorator={(component) => <div className="w-full">{component}</div>}
 />
 
 ### How to use

apps/docs/src/content/components/search-input.mdx

@@ -6,12 +6,6 @@ import {
 
 import { Header } from "../../components/Header";
 
-<Callout type="info">
-  The `HvSearchInput` component shares the same API as the `HvInput` component.
-  Please check the [HvInput component page](/components/input) for
-  documentation.
-</Callout>
-
 <Header
   params={{ name: "SearchInput", classes }}
   Component={HvSearchInput}
@@ -24,5 +18,10 @@ import { Header } from "../../components/Header";
     readOnly: { defaultValue: false },
     disabled: { defaultValue: false },
   }}
-  decorator={(c) => <div className="w-full">{c}</div>}
 />
+
+<Callout type="info">
+  The `HvSearchInput` component shares the same API as the `HvInput` component.
+  Please check the [HvInput component page](/components/input) for
+  documentation.
+</Callout>

apps/docs/src/content/components/skeleton.mdx

@@ -20,7 +20,6 @@ import { Header } from "../../components/Header";
       defaultValue: false,
     },
   }}
-  decorator={(children) => <div className="w-190px">{children}</div>}
   children={<div>My skeleton example content</div>}
 />
 

apps/docs/src/content/components/tree-view.mdx

@@ -16,7 +16,6 @@ import { Header } from "../../components/Header";
     multiSelect: { defaultValue: false },
     disableSelection: { defaultValue: false },
   }}
-  decorator={(children) => <HvPanel className="w-300px">{children}</HvPanel>}
 >
   <HvTreeItem nodeId="1" label="Applications">
     <HvTreeItem nodeId="10" label="Calendar.app" />

apps/docs/src/content/components/typography.mdx

@@ -23,10 +23,7 @@ import { Header } from "../../components/Header";
       defaultValue: false,
     },
   }}
-  decorator={(children) => (
-    <div className="w-200px text-balance">{children}</div>
-  )}
-  children={"Welcome to Hitachi Vantara's UI Kit."}
+  children="Welcome to UI Kit."
 />
 
 ### Root component