@cdx-ui/components 0.2.3 → 0.2.5

package/docs/patterns/empty-states/content.md

@@ -0,0 +1,32 @@
+# Empty States (https://design.candescent.com/docs/patterns/empty-states)
+
+## No Transactions
+
+An empty state shown when no transaction history is available.
+
+**Platforms:** iOS, Android, Web
+
+```tsx
+import { Avatar, Button, Heading, Text, VStack } from '@cdx-ui/components';
+import { ReceiptLong } from '@cdx-ui/icons';
+
+export default function NoTransactionsBlock() {
+  return (
+    <VStack space="lg" className="w-full max-w-sm items-center py-12 px-6">
+      {/* TODO(forge-ui): Avatar has no size larger than 2xl for an empty-state illustration; using 2xl. */}
+      <Avatar size="2xl" color="neutral">
+        <Avatar.Icon as={ReceiptLong} />
+      </Avatar>
+      <VStack space="sm" className="items-center">
+        <Heading size="md">No transactions yet</Heading>
+        <Text color="secondary" className="text-center">
+          Once you make your first transaction, it will appear here.
+        </Text>
+      </VStack>
+      <Button>
+        <Button.Label>Make a transfer</Button.Label>
+      </Button>
+    </VStack>
+  );
+}
+```

package/docs/patterns/forms/content.md

@@ -0,0 +1,108 @@
+# Forms (https://design.candescent.com/docs/patterns/forms)
+
+## Contact Information Form
+
+A form card for editing personal contact details.
+
+**Platforms:** iOS, Android, Web
+
+```tsx
+import { Button, Card, Field, Heading, Input, VStack } from '@cdx-ui/components';
+
+export default function ContactInfoFormBlock() {
+  return (
+    <Card className="w-full max-w-md">
+      <Card.Header>
+        <VStack space="xs">
+          <Heading size="md">Contact information</Heading>
+        </VStack>
+      </Card.Header>
+      <Card.Content>
+        <VStack space="lg">
+          <Field>
+            <Field.Label>First name</Field.Label>
+            <Input>
+              <Input.Field placeholder="Bernadette" />
+            </Input>
+          </Field>
+          <Field>
+            <Field.Label>Last name</Field.Label>
+            <Input>
+              <Input.Field placeholder="Miller" />
+            </Input>
+          </Field>
+          <Field>
+            <Field.Label>Email address</Field.Label>
+            <Input>
+              <Input.Field placeholder="bernadette@example.com" keyboardType="email-address" />
+            </Input>
+          </Field>
+          <Field>
+            <Field.Label>Phone number</Field.Label>
+            <Input>
+              <Input.Field placeholder="(555) 123-4567" keyboardType="phone-pad" />
+            </Input>
+          </Field>
+        </VStack>
+      </Card.Content>
+      <Card.Footer>
+        <Button fullWidth>
+          <Button.Label>Save changes</Button.Label>
+        </Button>
+      </Card.Footer>
+    </Card>
+  );
+}
+```
+
+## Date range
+
+A card that reveals a date range picker for choosing a start and end date.
+
+**Platforms:** iOS, Android, Web
+
+```tsx
+import { useState } from 'react';
+import {
+  Accordion,
+  Avatar,
+  Card,
+  DateField,
+  DateRangePicker,
+  type DateRangeValue,
+} from '@cdx-ui/components';
+import { CalendarToday } from '@cdx-ui/icons';
+
+export default function DateRangeBlock() {
+  const [value, setValue] = useState<DateRangeValue | undefined>();
+
+  return (
+    <Card className="w-full max-w-sm">
+      <Accordion type="single" defaultValue="date-range" aria-label="Date range">
+        <Accordion.Item value="date-range" showSeparator={false}>
+          <Accordion.Trigger>
+            <Accordion.LeadingSlot>
+              <Avatar size="lg" color="info">
+                <Avatar.Icon as={CalendarToday} />
+              </Avatar>
+            </Accordion.LeadingSlot>
+            <Accordion.Label>
+              <Accordion.Title>Date range</Accordion.Title>
+            </Accordion.Label>
+          </Accordion.Trigger>
+          <Accordion.Content>
+            <DateRangePicker value={value} onValueChange={setValue} className="w-full">
+              <DateField.Group fullWidth>
+                <DateField.Input slot="start" />
+                <DateRangePicker.RangeSeparator />
+                <DateField.Input slot="end" />
+              </DateField.Group>
+              <DateRangePicker.Calendar accessibilityLabel="Date range" />
+            </DateRangePicker>
+          </Accordion.Content>
+        </Accordion.Item>
+      </Accordion>
+    </Card>
+  );
+}
+```

package/docs/patterns/onboarding/content.md

@@ -0,0 +1,69 @@
+# Onboarding (https://design.candescent.com/docs/patterns/onboarding)
+
+## Welcome Step
+
+A first-step onboarding screen with progress indicator and call-to-action.
+
+**Platforms:** iOS, Android, Web
+
+```tsx
+import { useState } from 'react';
+import { Button, Heading, ProgressSegmented, Text, VStack } from '@cdx-ui/components';
+
+type WelcomePhase = 'welcome' | 'details' | 'skipped';
+
+export default function WelcomeStepBlock() {
+  const [phase, setPhase] = useState<WelcomePhase>('welcome');
+  const step = phase === 'details' ? 2 : 1;
+
+  return (
+    <VStack space="4xl" className="w-full max-w-sm items-center py-8 px-6">
+      <ProgressSegmented step={step} segments={4} />
+      {phase === 'details' ? (
+        <VStack space="md" className="items-center">
+          <Heading size="xl" className="text-center">
+            Secure your account
+          </Heading>
+          <Text color="secondary" className="text-center">
+            Add a recovery method so you can get back in if you are locked out.
+          </Text>
+        </VStack>
+      ) : (
+        <VStack space="md" className="items-center">
+          <Heading size="xl" className="text-center">
+            Welcome to your new account
+          </Heading>
+          <Text color="secondary" className="text-center">
+            Let&apos;s get you set up in a few quick steps. You&apos;ll be banking in no time.
+          </Text>
+        </VStack>
+      )}
+      {phase === 'skipped' ? (
+        <VStack space="md" className="w-full items-center">
+          <Text color="secondary" className="text-center">
+            Setup skipped for now. Resume whenever you are ready.
+          </Text>
+          <Button variant="ghost" fullWidth onPress={() => setPhase('welcome')}>
+            <Button.Label>Resume setup</Button.Label>
+          </Button>
+        </VStack>
+      ) : phase === 'details' ? (
+        <VStack space="md" className="w-full">
+          <Button variant="ghost" fullWidth onPress={() => setPhase('welcome')}>
+            <Button.Label>Back</Button.Label>
+          </Button>
+        </VStack>
+      ) : (
+        <VStack space="md" className="w-full">
+          <Button fullWidth onPress={() => setPhase('details')}>
+            <Button.Label>Get started</Button.Label>
+          </Button>
+          <Button variant="ghost" fullWidth onPress={() => setPhase('skipped')}>
+            <Button.Label>Skip for now</Button.Label>
+          </Button>
+        </VStack>
+      )}
+    </VStack>
+  );
+}
+```

package/docs/patterns/payments/content.md

@@ -0,0 +1,35 @@
+# Payments (https://design.candescent.com/docs/patterns/payments)
+
+## Quick Actions Row
+
+A row of quick-action buttons for common banking tasks like send, transfer, and deposit.
+
+**Platforms:** iOS, Android, Web
+
+```tsx
+import { HStack, QuickActionButton } from '@cdx-ui/components';
+import { Send, SyncAlt, PhotoCamera, ReceiptLong } from '@cdx-ui/icons';
+
+export default function QuickActionsRowBlock() {
+  return (
+    <HStack className="justify-between w-full max-w-md">
+      <QuickActionButton>
+        <QuickActionButton.Icon as={Send} />
+        <QuickActionButton.Label>Send</QuickActionButton.Label>
+      </QuickActionButton>
+      <QuickActionButton>
+        <QuickActionButton.Icon as={SyncAlt} />
+        <QuickActionButton.Label>Transfer</QuickActionButton.Label>
+      </QuickActionButton>
+      <QuickActionButton>
+        <QuickActionButton.Icon as={PhotoCamera} />
+        <QuickActionButton.Label>Deposit</QuickActionButton.Label>
+      </QuickActionButton>
+      <QuickActionButton>
+        <QuickActionButton.Icon as={ReceiptLong} />
+        <QuickActionButton.Label>Bill pay</QuickActionButton.Label>
+      </QuickActionButton>
+    </HStack>
+  );
+}
+```

package/docs/patterns/settings/content.md

@@ -0,0 +1,72 @@
+# Settings (https://design.candescent.com/docs/patterns/settings)
+
+## Notification Settings
+
+Toggle switches for managing notification preferences.
+
+**Platforms:** iOS, Android, Web
+
+```tsx
+import { Card, Heading, Switch, Text, VStack, HStack, Divider } from '@cdx-ui/components';
+
+function SettingRow({
+  title,
+  description,
+  last,
+}: {
+  title: string;
+  description: string;
+  last?: boolean;
+}) {
+  return (
+    <>
+      <HStack className="items-center justify-between py-3">
+        <VStack space="xs" className="flex-1 pr-4">
+          <Text weight="medium">{title}</Text>
+          <Text size="sm" color="secondary">
+            {description}
+          </Text>
+        </VStack>
+        <Switch />
+      </HStack>
+      {last ? null : <Divider />}
+    </>
+  );
+}
+
+export default function SettingsNotificationsBlock() {
+  return (
+    <Card className="w-full max-w-md">
+      <Card.Header>
+        <VStack space="xs">
+          <Heading size="md">Notifications</Heading>
+          <Text size="sm" color="secondary">
+            Choose what alerts you receive
+          </Text>
+        </VStack>
+      </Card.Header>
+      <Card.Content>
+        <VStack>
+          <SettingRow
+            title="Transaction alerts"
+            description="Get notified for every transaction on your accounts"
+          />
+          <SettingRow
+            title="Balance updates"
+            description="Daily summary of your account balances"
+          />
+          <SettingRow
+            title="Security alerts"
+            description="Important security notifications and login attempts"
+          />
+          <SettingRow
+            title="Promotional offers"
+            description="Special offers and product recommendations"
+            last
+          />
+        </VStack>
+      </Card.Content>
+    </Card>
+  );
+}
+```

package/docs/resources/content.md

@@ -0,0 +1,9 @@
+# Resources (https://design.candescent.com/docs/resources)
+
+## Tools
+
+- [Figma libraries](https://design.candescent.com/docs/resources/figma-libraries/content.md) — Access our official design system Figma libraries
+
+## Changelogs
+
+- [Release notes](https://design.candescent.com/docs/resources/release-notes/content.md) — What changed in every published version of the Forge UI packages.

package/docs/resources/figma-libraries/content.md

@@ -0,0 +1,42 @@
+# Figma libraries (https://design.candescent.com/docs/resources/figma-libraries)
+
+## For Candescent designers
+
+The goal of our newest Figma libraries is to match one-to-one with the components that developers use, simplifying handoff and implementation. We also use [Figma Code Connect](https://help.figma.com/hc/en-us/articles/23920389749655-Code-Connect) to provide code snippets that correctly use our code libraries and architecture.
+
+Our main library of components and design tokens. All components are for web and mobile unless
+otherwise noted.
+
+Our library of icons, built from Material Symbols as well as our own custom banking icons.
+
+### Add libraries to your design files
+
+For Candescent designers, our Figma libraries are available inside our Candescent Figma organization. To use our libraries, follow these steps:
+
+**Create a new Design file**
+
+![Step 1](/media/resources/figma-libraries/step_1@2x.png)
+
+**Open the Assets panel**
+
+![Step 2](/media/resources/figma-libraries/step_2@2x.png)
+
+**Open the "Manage libraries" dialog**
+
+![Step 3](/media/resources/figma-libraries/step_3@2x.png)
+
+**Remove any CDS libraries**
+
+![Step 4](/media/resources/figma-libraries/step_4@2x.png)
+
+**Select _Recommended_ under _Browse libraries_**
+
+![Step 5](/media/resources/figma-libraries/step_5@2x.png)
+
+**Add the Forge DS libraries to your design file**
+
+![Step 6](/media/resources/figma-libraries/step_6@2x.png)
+
+## For external partners
+
+Our Figma libraries are not currently available for external partners while the Forge Design System is in **v0**. We look forward to sharing our libraries externally after our first major release is live.

package/docs/resources/release-notes/0.0.1-beta.118/content.md

@@ -0,0 +1,27 @@
+# 0.0.1-beta.118 (https://design.candescent.com/docs/resources/release-notes/0.0.1-beta.118)
+
+Color and variant props are standardised across components; tint and default are renamed.
+
+## Breaking changes
+
+Every component now draws its `color` and `variant` values from one shared set, following
+the `strong` → `solid` rename that landed on Button. The old values still work and still
+render, but each emits a one-time deprecation warning in development and will be removed in
+a future major release (#393).
+
+- **[Chip](https://design.candescent.com/docs/components/chip/content.md)** — `variant="tint"` is now `variant="subtle"`, and
+  `color="default"` is now `color="neutral"`. The subtle variant also switches to the subtle
+  design tokens, so its surface and content colours shift slightly.
+- **[Icon Button](https://design.candescent.com/docs/components/icon-button/content.md)** — `variant="tint"` is now
+  `variant="subtle"`.
+- **[Toast](https://design.candescent.com/docs/components/toast/content.md)** — `color="default"` is now `color="neutral"`, including
+  the provider-level fallback.
+- **[Dialog](https://design.candescent.com/docs/components/dialog/content.md)** — `Dialog.Title` renames the `appearance` prop to
+  `color`, and its `default` value to `neutral`. When both props are passed, `color` wins.
+  [Alert Dialog](https://design.candescent.com/docs/components/alert-dialog/content.md) inherits the same change.
+
+## Utilities and DX
+
+**Alert** — `color` is accepted as an alias for `severity`, so Alert lines up with the
+global colour convention. `severity` still takes precedence when both are set (also updates
+internal tooling).

package/docs/resources/release-notes/0.0.1-beta.122/content.md

@@ -0,0 +1,21 @@
+# 0.0.1-beta.122 (https://design.candescent.com/docs/resources/release-notes/0.0.1-beta.122)
+
+Tabs arrives with a scroll-shadow affordance for overflowing tab strips.
+
+## What's new
+
+**[Tabs](https://design.candescent.com/docs/components/tabs/content.md)** — A compound tab set for switching between sibling views
+without navigating away. Compose `Tabs.List` with `Tabs.Trigger` for the strip and
+`Tabs.Content` for each panel; selection state, roving focus, and the ARIA wiring are
+handled for you on all three platforms. A tab strip that overflows its container now
+fades at the edge through the new `ScrollShadow` helper, so it reads as scrollable
+rather than clipped (#407).
+
+## Internal
+
+- **Tooling** — Added a `component-discovery` skill so component work starts from a
+  structured research pass instead of ad-hoc exploration (#422).
+- **Tooling** — Fixed the skill description quoting that broke the YAML frontmatter
+  parse (#423).
+
+Plus 1 backlog and dependency-sync commit.

package/docs/resources/release-notes/0.0.1-beta.124/content.md

@@ -0,0 +1,16 @@
+# 0.0.1-beta.124 (https://design.candescent.com/docs/resources/release-notes/0.0.1-beta.124)
+
+Breadcrumbs joins the component set for hierarchical navigation trails.
+
+## What's new
+
+**[Breadcrumbs](https://design.candescent.com/docs/components/breadcrumbs/content.md)** — Shows a user where they are inside a nested flow
+and lets them jump back to any ancestor. Compose `Breadcrumbs.Item` for each level and
+`Breadcrumbs.Separator` between them; the trailing item is marked as the current page
+for assistive technology automatically. Reach for it in account and settings flows
+that run more than two levels deep, where a single back affordance loses the trail
+(#419).
+
+## Documentation
+
+- Added the retroactive story covering the Dialog Vite/web fix from PR #416 (#426).

package/docs/resources/release-notes/0.0.1-beta.126/content.md

@@ -0,0 +1,10 @@
+# 0.0.1-beta.126 (https://design.candescent.com/docs/resources/release-notes/0.0.1-beta.126)
+
+ThemeEditor no longer fires onChange on mount before the user edits a control.
+
+## Bug fixes
+
+- **ThemeEditor** — `onChange` no longer fires on mount with the default seed theme, so
+  integrations that treat a null `themeOverride` as untouched no longer show a dirty form
+  or Save bar until the user edits a control
+  ([#427](https://github.com/dfh-candescent-ui/ui-component-framework/pull/427)).

package/docs/resources/release-notes/0.0.1-beta.127/content.md

@@ -0,0 +1,14 @@
+# 0.0.1-beta.127 (https://design.candescent.com/docs/resources/release-notes/0.0.1-beta.127)
+
+Internal release — docs demo drift guard and a CI coverage-threshold gate.
+
+## Internal
+
+- **CI** — Added a coverage-threshold gate so a package dropping below its line
+  coverage floor fails the build (#412).
+- **Tooling** — `validate:demos` now cross-checks every `ComponentPreview` name in the
+  docs MDX against the demo registries and fails the docs build on drift, and the
+  `Dialog.Header` Code Connect template points at its current Figma component set
+  (#428).
+
+Plus 2 backlog and dependency-sync commits.

package/docs/resources/release-notes/0.0.1-beta.128/content.md

@@ -0,0 +1,9 @@
+# 0.0.1-beta.128 (https://design.candescent.com/docs/resources/release-notes/0.0.1-beta.128)
+
+Design token values update from the design system source for poise, prestige, and pulse presets.
+
+## Dependencies
+
+**Design tokens** — Token values updated from the design system source. Review your
+theme if you override specific token values
+([#430](https://github.com/dfh-candescent-ui/ui-component-framework/pull/430)).

package/docs/resources/release-notes/0.0.1-beta.129/content.md

@@ -0,0 +1,18 @@
+# 0.0.1-beta.129 (https://design.candescent.com/docs/resources/release-notes/0.0.1-beta.129)
+
+Tabs and Breadcrumbs documentation ships; Tabs.Tab interaction props are now internal-only.
+
+This release adds documentation for **[Tabs](https://design.candescent.com/docs/components/tabs/content.md)** and **[Breadcrumbs](https://design.candescent.com/docs/components/breadcrumbs/content.md)**, and narrows the public surface of `Tabs.Tab`.
+
+## What's new
+
+**[Tabs](https://design.candescent.com/docs/components/tabs/content.md)** — `Tabs.Tab` interaction props are now marked internal
+and are no longer part of the supported public API. Compose tabs with the documented
+selection pattern instead of passing press handlers directly to `Tabs.Tab`.
+
+## Documentation
+
+- **[Tabs](https://design.candescent.com/docs/components/tabs/content.md)** — New component page with live demos for basic usage,
+  vertical layout, overflow scrolling, visual variants, and disabled tabs.
+- **[Breadcrumbs](https://design.candescent.com/docs/components/breadcrumbs/content.md)** — New component page with live demos for basic trails,
+  custom separators, disabled items, underlined styling, and icons.

package/docs/resources/release-notes/0.0.1-beta.130/content.md

@@ -0,0 +1,18 @@
+# 0.0.1-beta.130 (https://design.candescent.com/docs/resources/release-notes/0.0.1-beta.130)
+
+Import ForgeDesignProvider directly from @cdx-ui/components.
+
+## What's new
+
+**ForgeDesignProvider** — Exported from the `@cdx-ui/components` package root, so you
+can import it alongside other public APIs without a deep import path. The provider and
+its config types follow the same root-export pattern as `ToastProvider`. (#432)
+
+## Internal
+
+Plus 2 backlog and dependency-sync commits.
+
+## Documentation
+
+- Added Textarea component documentation with live demos for basic usage, sizes,
+  states, auto-grow, resizable layout, and Field integration (#437).

package/docs/resources/release-notes/0.0.1-beta.133/content.md

@@ -0,0 +1,7 @@
+# 0.0.1-beta.133 (https://design.candescent.com/docs/resources/release-notes/0.0.1-beta.133)
+
+Button asChild no longer overrides child role and event handlers when composing with Link or other interactive elements.
+
+## Bug fixes
+
+**[Button](https://design.candescent.com/docs/components/button/content.md)** — `asChild` no longer replaces the child’s role or press, focus, and hover handlers, so `<Button asChild><Link>` keeps the link’s `role="link"` and navigation behavior ([#446](https://github.com/dfh-candescent-ui/ui-component-framework/pull/446)).

package/docs/resources/release-notes/0.0.1-beta.134/content.md

@@ -0,0 +1,17 @@
+# 0.0.1-beta.134 (https://design.candescent.com/docs/resources/release-notes/0.0.1-beta.134)
+
+Published @cdx-ui packages declare MIT license metadata; versions published before this release are unchanged.
+
+## What's new
+
+**Package licensing** — `@cdx-ui/utils`, `@cdx-ui/primitives`, `@cdx-ui/styles`, and
+`@cdx-ui/components` now declare `"license": "MIT"` and ship a root `LICENSE` file in
+the published tarball
+([#368](https://github.com/dfh-candescent-ui/ui-component-framework/pull/368)). Legal
+later confirmed MIT and the copyright holder as **Digital First Holdings LLC**; the
+copyright line in package `LICENSE` files is updated on a subsequent publish. npm
+versions are immutable: packages published **before** `0.0.1-beta.134` keep whatever
+metadata they had (no license field) and are not retroactively changed.
+`@cdx-ui/icons` also received provisional license files in this release; a later
+publish reverted icons licensing so the package again ships without a `license`
+field until third-party brand marks are removed.

package/docs/resources/release-notes/0.0.1-beta.136/content.md

@@ -0,0 +1,7 @@
+# 0.0.1-beta.136 (https://design.candescent.com/docs/resources/release-notes/0.0.1-beta.136)
+
+Font overrides applied with applyThemeOverride now persist inside ScopedTheme scopes instead of being shadowed.
+
+## Bug fixes
+
+**[ScopedTheme](https://design.candescent.com/docs/components/scoped-theme/content.md)** — Font overrides and other mode-invariant tokens (such as radii) applied through `applyThemeOverride` now persist inside `ScopedTheme` scopes instead of being shadowed by per-mode CSS variants ([#457](https://github.com/dfh-candescent-ui/ui-component-framework/pull/457)).

package/docs/resources/release-notes/0.0.1-beta.137/content.md

@@ -0,0 +1,10 @@
+# 0.0.1-beta.137 (https://design.candescent.com/docs/resources/release-notes/0.0.1-beta.137)
+
+Tabs indicator animation now completes in 150ms for snappier tab switching.
+
+## What's new
+
+**[Tabs](https://design.candescent.com/docs/components/tabs/content.md)** — The sliding indicator under the active tab now
+animates in 150ms, making tab switches feel snappier when users move between panels.
+No API changes are required — upgrade and the new timing applies automatically
+([#454](https://github.com/dfh-candescent-ui/ui-component-framework/pull/454)).

package/docs/resources/release-notes/0.0.1-beta.138/content.md

@@ -0,0 +1,7 @@
+# 0.0.1-beta.138 (https://design.candescent.com/docs/resources/release-notes/0.0.1-beta.138)
+
+WhatsApp icon is themeable again after reverting a premature fixed-color brand-icon carve-out and package license files.
+
+## Bug fixes
+
+**[Icon](https://design.candescent.com/docs/components/icon/content.md)** — WhatsApp icon is themeable again (`color` and `filled` props apply as with other icons); the fixed-color brand-icon carve-out and premature `@cdx-ui/icons` license files are removed ([#458](https://github.com/dfh-candescent-ui/ui-component-framework/pull/458)).

package/docs/resources/release-notes/0.0.1-beta.139/content.md

@@ -0,0 +1,13 @@
+# 0.0.1-beta.139 (https://design.candescent.com/docs/resources/release-notes/0.0.1-beta.139)
+
+Carousel adds PrevButton and NextButton for ghost icon prev/next navigation, nested in Carousel or composed via useCarousel().
+
+## What's new
+
+**[Carousel](https://design.candescent.com/docs/components/carousel/content.md)** — Adds `Carousel.PrevButton` and
+`Carousel.NextButton`, ghost icon controls for moving between slides without
+swiping. Nest them inside `Carousel` for zero-prop wiring below the track, or
+pair them with `useCarousel()` for sibling placement — for example, flanking the
+track or sitting in a header row. The buttons respect `loop` and disable at the
+first or last slide when looping is off, with direction-aware default icons and
+accessibility labels for horizontal and vertical layouts ([#440](https://github.com/dfh-candescent-ui/ui-component-framework/pull/440)).

package/docs/resources/release-notes/0.0.1-beta.140/content.md

@@ -0,0 +1,26 @@
+# 0.0.1-beta.140 (https://design.candescent.com/docs/resources/release-notes/0.0.1-beta.140)
+
+@cdx-ui/utils re-exports cva and VariantProps; Select documentation consolidates on the docs site with live demos.
+
+This release centralizes CVA imports through `@cdx-ui/utils` and consolidates
+Select documentation on the docs site.
+
+## What's new
+
+**`@cdx-ui/utils`** — Re-exports `cva` and `VariantProps` from
+`class-variance-authority`, so you import variant helpers from the same package
+as other Forge UI utilities instead of adding a direct dependency on
+`class-variance-authority`. Update custom styled components that import `cva`
+directly:
+
+```tsx
+import { cva, type VariantProps } from '@cdx-ui/utils';
+```
+
+([#462](https://github.com/dfh-candescent-ui/ui-component-framework/pull/462)).
+
+**[Select](https://design.candescent.com/docs/components/select/content.md)** — Documentation consolidates onto the docs
+site as the single source of truth, with live demos for basic usage, sizes, a
+custom trigger, and Field integration. Use the page for prop tables, anatomy,
+and accessibility guidance when implementing Select in your app
+([#470](https://github.com/dfh-candescent-ui/ui-component-framework/pull/470)).