@utilitywarehouse/hearth-react 0.32.3 → 0.33.1

package/public/llms/components/button.md

@@ -134,20 +134,6 @@ anchor or router link.
 </Flex>
 ```
 
-- [Accessibility](#accessibility)
-  - [Disabled buttons](#disabled-buttons)
-- [Variants](#variants)
-- [Colour schemes](#colour-schemes)
-- [Inverted](#inverted)
-- [Size](#size)
-- [Dead prop combinations](#dead-prop-combinations)
-- [With icons](#with-icons)
-- [Semantic HTML](#semantic-html)
-- [Full width button](#full-width-button)
-- [Padding none](#padding-none)
-- [Usage with Next.js](#usage-with-next.js)
-- [API](#api)
-
 ```tsx
 <Button variant="solid" colorScheme="highlight">
   Button

package/public/llms/components/card-accordion.md

@@ -7,16 +7,6 @@ previously completed steps visible and editable. Compose it with
 `CardAccordionFooter`/`CardAccordionButton` for step navigation. Requires at
 least one `CardAccordionItem` child.
 
-- [Usage](#usage)
-- [Current content](#current-content)
-- [Summary content](#summary-content)
-- [Validation](#validation)
-- [Footer actions](#footer-actions)
-- [Heading levels](#heading-levels)
-- [Accessibility](#accessibility)
-  - [Keyboard interactions](#keyboard-interactions)
-- [API](#api)
-
 ```tsx
 <Box width="600px">
   <CardAccordion>

package/public/llms/components/card.md

@@ -7,17 +7,6 @@ items. Cards are static by default; wrap an interactive child (a link or
 button) in `CardInteraction` to make the whole card clickable. For
 highlighting key marketing messaging, use HighlightBanner instead.
 
-- [Components](#components)
-- [Alternatives](#alternatives)
-- [Variant](#variant)
-- [Color Scheme](#color-scheme)
-- [Grouping related cards](#grouping-related-cards)
-- [Interactive Cards](#interactive-cards)
-  - [Shadow colours](#shadow-colours)
-- [Card Actions](#card-actions)
-- [Banners](#banners)
-- [API](#api)
-
 ```tsx
 <Card {...args} width="400px" marginX="auto">
   <BodyText size="md">{children}</BodyText>

package/public/llms/components/checkbox-tile.md

@@ -8,7 +8,7 @@ state and layout. If not using the `label` prop, provide an `aria-label` or
 `aria-labelledby` so the tile has an accessible name.
 
 ```tsx
-<CheckboxTile {...args} />
+<CheckboxTile label="Label" helperText="Helper text" validationText="Validation text" />
 ```
 
 ## Helper text

package/public/llms/components/checkbox.md

@@ -7,7 +7,7 @@ and layout. If not using the `label` prop, provide an `aria-label` or
 `aria-labelledby` so the checkbox has an accessible name.
 
 ```tsx
-<Checkbox {...args} />
+<Checkbox label="Label" helperText="Helper text" value="1" validationText="Validation text" />
 ```
 
 ## Helper text

package/public/llms/components/chip.md

@@ -4,13 +4,6 @@ Use Chip to represent an input, attribute, or filter that a user can remove
 with a single click. Commonly used to show active filters applied to a list
 of results.
 
-- [Usage](#usage)
-- [Removable](#removable)
-- [Disabled](#disabled)
-- [Chip Group](#chip-group)
-- [Accessibility](#accessibility)
-- [API](#api)
-
 ```tsx
 <Flex gap="200" wrap="wrap">
   <Chip>Default</Chip>
@@ -28,7 +21,7 @@ the user clicks it.
 ```
 
 ```tsx
-<Chip {...args} />
+<Chip>Label</Chip>
 ```
 
 ## Removable

package/public/llms/components/combobox.md

@@ -7,14 +7,6 @@ control. Set `triggerOnlyOnType` when the user must type before options are
 surfaced (e.g. a postcode or address lookup); leave it unset when there is a
 predefined list to choose from by clicking.
 
-- [Usage](#usage)
-- [Trigger only on type](#trigger-only-on-type)
-- [No options found](#no-options-found)
-- [Status text](#status-text)
-- [useComboboxFilter](#usecomboboxfilter)
-- [Virtualised](#virtualised)
-- [API](#api)
-
 ```tsx
 <Combobox {...args} items={fruits} />
 ```

package/public/llms/components/description-list.md

@@ -34,13 +34,6 @@ semantic `dl` element.
 </Box>
 ```
 
-- [Usage](#usage)
-- [Heading](#heading)
-- [Trailing content](#trailing-content)
-- [Direction](#direction)
-- [API](#api)
-- [DescriptionListItem API](#descriptionlistitem-api)
-
 ## Usage
 
 Use the `DescriptionList` element to wrap any number of `DescriptionListItem`

package/public/llms/components/expandable-card.md

@@ -7,17 +7,8 @@ reveal additional content. Group multiple cards with ExpandableCardGroup.
 For multiple sections of content that need to expand and collapse
 independently as a related set, use Accordion instead.
 
-- [Leading icon](#leading-icon)
-- [Default open](#default-open)
-- [Controlled](#controlled)
-- [ExpandableCardGroup](#expandablecardgroup)
-- [Accessibility](#accessibility)
-  - [Keyboard interactions](#keyboard-interactions)
-- [API](#api)
-  - [ExpandableCardGroup](#expandablecardgroup-api)
-
 ```tsx
-<Box width="400px" marginX="auto">
+<Box width="400px">
   <ExpandableCard {...args}>
     <BodyText size="md">
       This is the expandable content area. It can contain any content you need to show when the card
@@ -86,7 +77,7 @@ approach: the card manages its own open/closed state internally after mount.
 ```
 
 ```tsx
-<Box width="400px" marginX="auto">
+<Box width="400px">
   <ExpandableCard
     heading="Heading"
     helperText="This card starts expanded"
@@ -123,7 +114,7 @@ using the `Accordion` component instead, which has built-in support for
 grouping related content.
 
 ```tsx
-<Box width="400px" marginX="auto">
+<Box width="400px">
   <ExpandableCardGroup heading="My services" helperText="Manage your UW services">
     <ExpandableCard
       heading="Broadband"

package/public/llms/components/highlight-banner.md

@@ -11,7 +11,7 @@ for footer content.
     {/* eslint-disable-next-line jsx-a11y/alt-text */}
     <img src={piggies} height="200px" />
     <HighlightBannerFooter>
-      <BodyText size="md" wrap="wrap">
+      <BodyText size="md" textWrap="wrap">
         Homeowners who bundle two or more services with UW and activate the Cashback Card trial will
         receive up to £150 in credit.
       </BodyText>

package/public/llms/components/icon-button.md

@@ -153,17 +153,6 @@ no visible text, a `label` prop is required to provide an accessible name.
 </Flex>
 ```
 
-- [Icons](#icons)
-- [Accessibility](#accessibility)
-  - [Disabled buttons](#disabled-buttons)
-- [Variants](#variants)
-- [Colour schemes](#colour-schemes)
-- [Inverted](#inverted)
-- [Size](#size)
-  - [Responsive icon sizes](#responsive-icon-sizes)
-- [Semantic HTML](#semantic-html)
-- [API](#api)
-
 ```tsx
 <IconButton {...args}>
   <AddMediumIcon />

package/public/llms/components/icon-container.md

@@ -46,15 +46,6 @@ combinations of `colorScheme` and `variant` (e.g. `emphasis` and
 </IconContainer>
 ```
 
-- [Icons](#icons)
-- [Variants](#variants)
-- [Sizes](#sizes)
-- [Color schemes](#color-schemes)
-- [Dead prop combinations](#dead-prop-combinations)
-- [Radius none](#radius-none)
-- [Fill](#fill)
-- [API](#api)
-
 ## Icons
 
 The `IconContainer` component is intended to be used with the `@utilitywarehouse/hearth-react-icons` package.

package/public/llms/components/inline-link.md

@@ -6,13 +6,6 @@ icon and visually-hidden label when `target="_blank"` is set. Use `asChild`
 to render a routing library's link component (e.g. Next.js `Link`) instead.
 For a standalone link not embedded in text, use Link instead.
 
-- [Alternatives](#alternatives)
-- [Semantic HTML](#semantic-html)
-- [Colour](#colour)
-- [Open in new tab](#open-in-new-tab)
-- [Usage with Next.js](#usage-with-next.js)
-- [API](#api)
-
 ```tsx
 <Flex
   direction="column"

package/public/llms/components/label.md

@@ -5,7 +5,7 @@ element by default, styled as `BodyText`. Set `variant="heading"` to style
 it as a `Heading` instead, for labels that need more visual weight.
 
 ```tsx
-<Label marginTop="300">Label</Label>
+<Label>Label</Label>
 ```
 
 ## API

package/public/llms/components/link.md

@@ -7,14 +7,6 @@ on the same page, or to open a resource in a new tab. Renders a semantic
 
 For links within a body of text, use InlineLink instead.
 
-- [Alternatives](#alternatives)
-- [Semantic HTML](#semantic-html)
-- [Open in new tab](#open-in-new-tab)
-- [Icons](#icons)
-- [Inverted colours](#inverted-colours)
-- [Usage with Next.js](#usage-with-next.js)
-- [API](#api)
-
 ```tsx
 <Link href="#">Link</Link>
 ```

package/public/llms/components/list.md

@@ -67,18 +67,6 @@ list falls back to its default appearance.
 </Box>
 ```
 
-- [Usage](#usage)
-- [Appearance](#appearance)
-  - [Variant](#variant)
-  - [ColorScheme](#colorscheme)
-  - [Padding None](#padding-none)
-- [Heading](#heading)
-- [Leading content](#leading-content)
-- [Trailing content](#trailing-content)
-- [Advanced Content](#advanced-content)
-- [List actions](#list-actions)
-- [API](#api)
-
 ## Usage
 
 - The `List` component can be customized with different variants and color schemes.

package/public/llms/components/menu.md

@@ -7,15 +7,6 @@ with MenuTrigger and MenuContent, which wraps any number of MenuItem
 components. Set `modal={false}` when multiple Menu components are used
 together, such as in a navigation bar.
 
-- [Usage](#usage)
-- [MenuTrigger](#menutrigger)
-- [Placement](#placement)
-- [MenuItem](#menuitem)
-- [Accessibility](#accessibility)
-- [SEO](#seo)
-- [Migration](#migration)
-- [API](#api)
-
 ```tsx
 <Menu {...args}>
   <MenuTrigger>

package/public/llms/components/modal.md

@@ -7,16 +7,6 @@ ModalTrigger, ModalContent, ModalFooter, and ModalClose. Pass `heading` and
 `description` for standard content, or custom children alongside
 ModalFooter for more control over layout.
 
-- [Usage Guidelines](#usage-guidelines)
-- [Content](#content)
-- [Accessibility](#accessibility)
-- [Uncontrolled usage](#uncontrolled-usage)
-- [Controlled usage](#controlled-usage)
-- [With Image](#with-image)
-- [Loading](#loading)
-- [Preventing dismissal](#preventing-dismissal)
-- [API](#api)
-
 ```tsx
 <ModalRoot>
   <ModalTrigger>

package/public/llms/components/pagination.md

@@ -7,17 +7,6 @@ Render `as="nav"` when it acts as a standalone navigation landmark — in that
 case also provide an `id` for accessibility. Use the `condensed` prop for
 compact spaces where only a page count needs to be shown.
 
-## Table of Contents
-
-- [Usage Guidelines](#usage-guidelines)
-- [Examples](#examples)
-  - [Condensed](#condensed)
-  - [Without Skip Buttons](#without-skip-buttons)
-  - [Few Pages](#few-pages)
-  - [Many Pages](#many-pages)
-  - [Edge Cases](#edge-cases)
-- [API](#api)
-
 ```tsx
 <Pagination {...args} currentPage={currentPage} onPageChange={setCurrentPage} />
 ```

package/public/llms/components/progress-stepper.md

@@ -7,11 +7,6 @@ triggers an action, or navigates — don't mix step types within the same
 stepper. Render `as="nav"` when the stepper represents site or app
 navigation. For a single continuous task's completion, use ProgressBar instead.
 
-- [Usage](#usage)
-- [Step states](#step-states)
-- [Accessability](#accessability)
-- [API](#api)
-
 ```tsx
 <Flex direction="column" gap="400">
   <BodyText weight="bold">Step {currentStep + 1} Content</BodyText>

package/public/llms/components/radio-group.md

@@ -7,48 +7,9 @@ follows the WAI-ARIA Radio Group pattern for groups not contained in a
 toolbar. For multi-select options, use CheckboxGroup instead.
 
 ```tsx
-<Flex direction="column" gap="400">
-  <Flex direction="row" gap="200">
-    <RadioGroup {...args}>
-      <RadioTile value="england" label="England" />
-      <RadioTile value="wales" label="Wales" />
-      <RadioTile value="scotland" label="Scotland" />
-      <RadioTile value="northern-ireland" label="Northern Ireland" />
-    </RadioGroup>
-    <RadioGroup {...args}>
-      <Radio value="england" label="England" />
-      <Radio value="wales" label="Wales" />
-      <Radio value="scotland" label="Scotland" />
-      <Radio value="northern-ireland" label="Northern Ireland" />
-    </RadioGroup>
-  </Flex>
-  <RadioGroup
-    {...args}
-    label="Do you like living here?"
-    name="do-you-like-living-here"
-    direction="row"
-  >
-    <RadioTile value="y" label="Yes" image={<ThumbsUpSmallIcon />} />
-    <RadioTile value="n" label="No" image={<ThumbsDownSmallIcon />} />
-  </RadioGroup>
-</Flex>
+<RadioGroup label="Label" helperText="Helper text" validationText="Validation text" />
 ```
 
-- [Alternatives](#alternatives)
-- [Usage](#usage)
-- [Accessibility](#accessibility)
-- [Keyboard interactions](#keyboard-interactions)
-- [Custom label](#custom-label)
-- [Helper text](#helper-text)
-- [Validation](#validation)
-- [Content width](#content-width)
-- [Grid layout](#grid-layout)
-- [RadioTile layout](#radiotile-layout)
-- [Controlled](#controlled)
-- [Radio & RadioTile Image](#radio--radiotile-image)
-- [RadioCard](#radiocard)
-- [API](#api)
-
 ## Alternatives
 
 - `CheckboxGroup`: For multi-select.

package/public/llms/components/search-input.md

@@ -7,14 +7,6 @@ fetched. On desktop and tablet it must be paired with a button to trigger
 the search; on mobile the keyboard's search action can trigger it instead.
 For general text entry use TextInput instead.
 
-- [Alternatives](#alternatives)
-- [Accessibility](#accessibility)
-- [Label](#label)
-- [Clear](#clear)
-- [Loading](#loading)
-- [Usage with a button](#usage-with-a-button)
-- [API](#api)
-
 ```tsx
 <SearchInput
   value={value}

package/public/llms/components/segmented-control.md

@@ -7,11 +7,6 @@ be used without a default selected option.
 For navigation between pages or sections, use Tabs instead.
 For binary on/off settings, use Switch instead.
 
-- [Usage](#usage)
-- [Sizes](#sizes)
-- [Icons](#icons)
-- [API](#api)
-
 ```tsx
 <Flex direction="column" gap="400">
   <BodyText as="p" size="md" weight="semibold">

package/public/llms/components/skeleton.md

@@ -4,14 +4,6 @@
 content is loading. It helps improve perceived performance and user experience
 by showing a skeleton of the layout before the actual content is rendered.
 
-- [Usage](#usage)
-- [Accessibility](#accessibility)
-  - [Loading title](#loading-title)
-- [SkeletonBodyText](#skeletonbodytext)
-- [SkeletonHeading](#skeletonheading)
-- [SkeletonBox](#skeletonbox)
-- [API](#api)
-
 ```tsx
 <Skeleton loadingTitle="card placeholder story">
   <Flex direction="column" gap="300" width="320px">

package/public/llms/components/table.md

@@ -6,12 +6,6 @@ it with TableHeader, TableBody, TableRow, TableHeaderCell, and TableCell.
 Pass `variant` to wrap the table in a Card container; omit it for a minimal,
 unwrapped table.
 
-- [Usage](#usage)
-- [Variants](#variants)
-- [Pagination](#pagination)
-- [Header cells](#header-cells)
-- [API](#api)
-
 ```tsx
 <Table {...args}>
   <TableHeader>

package/public/llms/components/tabs.md

@@ -4,16 +4,6 @@ Use Tabs to organize and navigate between content sections within the same
 page context, without leaving the page. Must be used together with
 TabsList, Tab, and TabContent.
 
-- [Usage](#usage)
-- [Examples](#examples)
-  - [Controlled](#controlled)
-  - [Overflow & Scrolling](#overflow--scrolling)
-  - [With icons](#with-icons)
-- [Size variants](#size-variants)
-- [Activation mode](#activation-mode)
-- [Accessibility](#accessibility)
-- [API](#api)
-
 ```tsx
 <Tabs {...args}>
   <TabsList>

package/public/llms/components/text-area.md

@@ -8,15 +8,6 @@ is required and should clearly describe the purpose of the field.
 <TextArea {...args} />
 ```
 
-- [Label](#label)
-- [Helper Text](#helper-text)
-- [Validation](#validation)
-- [Disabled and Read-only](#disabled-and-read-only)
-- [Custom Rows](#custom-rows)
-- [Height](#height)
-- [Controlled Usage](#controlled-usage)
-- [API](#api)
-
 ## Label
 
 A label is required for the `TextArea` component. It should clearly describe

package/public/llms/components/text-input.md

@@ -9,15 +9,6 @@ SearchInput, CurrencyInput, VerificationInput, or DateInput instead. A
 <TextInput {...args} />
 ```
 
-- [Alternatives](#alternatives)
-- [Label](#label)
-- [Required](#required)
-- [Disabled and Read-only](#disabled-and-read-only)
-- [Validation](#validation)
-- [Prefix and Suffix](#prefix-and-suffix)
-- [Grouping inputs](#grouping-inputs)
-- [API](#api)
-
 ## Alternatives
 
 - PasswordInput - For entering