Feat/collapse

.changeset/accordion-no-first-top-border.md

@@ -0,0 +1,5 @@
+---
+'@perimetre/ui': patch
+---
+
+Drop the top border from the first row of the Acorn brand `Accordion`. The component is almost always nested inside a section or card whose own boundary already provides the top edge, so the `first:border-t` rule was visually doubling up. The `--pui-color-border-accordion-first` semantic token is still exported from `tailwind.css`; consumers who want the top border back can add `pui:first:border-t pui:first:border-t-pui-border-accordion-first` via the Accordion's `className` prop.

.changeset/fruity-seas-grin.md

@@ -0,0 +1,5 @@
+---
+'@perimetre/ui': minor
+---
+
+Add `Collapse` component — a brand-aware, motion-animated disclosure with `CollapseTrigger`, `CollapseHeading`, `CollapseEyebrow`, `CollapseTitle`, `CollapseIcon`, and `CollapseContent` subcomponents for rich-text bodies.

packages/ui/src/components/Accordion/brands/Accordion.acorn.brand.ts

@@ -4,15 +4,20 @@ import { cva } from '@/lib/cva';
  * Acorn brand Accordion variants (default/base theme).
  * Uses semantic tokens for themeable properties:
  * - text-pui-fg-*: title/body/eyebrow colors
- * - border-pui-border-accordion-*: per-position dividers (first / between / last)
+ * - border-pui-border-accordion-*: per-position dividers (between / last)
  * - --pui-typo-accordion-*: title and content typography (applied inline
  *   below — these tokens are accordion-specific, so no `@utility` is needed)
+ *
+ * No top border on the first row: an accordion is almost always nested
+ * inside a section or card whose own boundary already provides the top
+ * edge, and authors who do want a top border can re-add it through the
+ * `pui:first:border-t-pui-border-accordion-first` utility (the semantic
+ * token still ships in tailwind.css for that exact purpose).
  */
 export const accordionAcornVariants = cva({
   base: [
     'pui:flex pui:w-full pui:flex-col',
     'pui:border-b pui:border-pui-border-accordion-between',
-    'pui:first:border-t pui:first:border-t-pui-border-accordion-first',
     'pui:last:border-b-pui-border-accordion-last'
   ]
 });