@stackone/malachite 0.49.0 → 0.50.1

package/COMPONENTS.md

@@ -6,7 +6,7 @@ The catalog of components exported from `@stackone/malachite`. **Reach for one o
 
 ## Layout & containers
 
-- **`Surface`** — Rounded, bordered card container with the standard elevation shadow. Set `overflow="visible"` when a descendant must escape the card box (e.g. a sticky row). _Key props:_ `children`, `padding`, `overflow`, `className`, `style`.
+- **`Surface`** — Rounded, bordered card container with the standard elevation shadow. Use `overflow="clip"` to keep the rounded clipping while letting a `position: sticky` descendant still pin (`hidden` would trap it); `visible` disables clipping. _Key props:_ `children`, `padding`, `overflow`, `className`, `style`.
 - **`SurfaceRow`** — A full-bleed row inside a Surface (used as `Surface.Row`). Owns hover highlight, colour transition and an optional bottom divider. Pass `onClick`/`href` to make the whole row clickable (renders as a real button/anchor, so keyboard nav works). For a selectable row use `role="radio"` + `selected` and put a presentational `<Radio>` inside as the indicator. _Key props:_ `divider`, `disabled`, `onClick`, `href`, `selected`, `role`, `className`, `style`.
 - **`Card`** — Generic content card.
 - **`SplitScreenLayout`** — Two-pane full-screen layout (content + preview/aside) with an optional dismiss button.
@@ -20,7 +20,7 @@ The catalog of components exported from `@stackone/malachite`. **Reach for one o
 ## Lists, rows & navigation
 
 - **`ButtonList`** — Vertical list of pill-style button/link rows with built-in hover/focus/active states. _Key props:_ `buttons[]` (`key`, `children`, `onClick`, `href`), `compact`.
-- **`Accordion`** — Expand/collapse section with a clickable header (disclosure arrow + title/header + trailing slot). Use `header` for rich content and `trailing` for an interactive control (e.g. a Checkbox) — trailing sits outside the toggle button, so a selectable+expandable row is just an Accordion. Controlled or uncontrolled. Pass `stickyHeader` (+ optional `stickyTopOffset`) to pin the header while the body scrolls — needs an unclipped scroll ancestor (e.g. `<Surface overflow="visible">`); `roundTop`/`roundBottom` round the first/last row inside such a Surface. _Key props:_ `title` or `header`, `trailing`, `disabled`, `isExpanded`/`defaultExpanded`, `onToggle`, `stickyHeader`, `stickyTopOffset`, `roundTop`, `roundBottom`, `animate`.
+- **`Accordion`** — Expand/collapse section with a clickable header (disclosure arrow + title/header + trailing slot). Use `header` for rich content and `trailing` for an interactive control (e.g. a Checkbox) — trailing sits outside the toggle button, so a selectable+expandable row is just an Accordion. Controlled or uncontrolled. Pass `stickyHeader` (+ optional `stickyTopOffset`) to pin the header while the body scrolls — needs a scroll ancestor that clips without trapping sticky (e.g. `<Surface overflow="clip">`). `animate={false}` opens instantly. _Key props:_ `title` or `header`, `trailing`, `disabled`, `isExpanded`/`defaultExpanded`, `onToggle`, `stickyHeader`, `stickyTopOffset`, `animate`.
 - **`DefinitionRow`** — Row showing an icon, label, optional tag and description — for definition/detail lists. _Key props:_ `icon`, `label`, `tag`, `description`.
 - **`PreviewTree`** — Nested, indented tree for previewing hierarchical structure.
 - **`PreviewTreeRow`** — A single labelled row within a PreviewTree. _Key props:_ `label`.

package/dist/index.d.ts

@@ -25,16 +25,12 @@ declare interface AccordionBaseProps {
     disabled?: boolean;
     /**
      * Pin the header row to the top of the nearest scroll container so it stays
-     * reachable while the body scrolls. Needs an unclipped scroll ancestor — e.g. a
-     * `<Surface overflow="visible">`, since `overflow: hidden` traps sticky.
+     * reachable while the body scrolls. Needs a scroll ancestor that clips without
+     * trapping sticky — e.g. a `<Surface overflow="clip">` (`overflow: hidden` traps it).
      */
     stickyHeader?: boolean;
     /** Offset (px) from the top of the scroll container when `stickyHeader` is set. */
     stickyTopOffset?: number;
-    /** Round the top corners — for the first row inside an `overflow="visible"` Surface. */
-    roundTop?: boolean;
-    /** Round the bottom corners — for the last row inside an `overflow="visible"` Surface. */
-    roundBottom?: boolean;
     /**
      * Animate the expand/collapse height (default `true`). Set `false` for an instant
      * open — the body isn't clipped, so a `position: sticky` child pins immediately with
@@ -1415,10 +1411,11 @@ export declare interface SurfaceProps {
     padding?: boolean;
     /**
      * Content overflow. Defaults to `hidden` so children are clipped to the rounded
-     * corners. Set to `visible` when a descendant needs to escape the card box —
-     * e.g. a `position: sticky` row, which `overflow: hidden` would otherwise trap.
+     * corners. Use `clip` to keep the rounded clipping WITHOUT creating a scroll
+     * container — so a `position: sticky` descendant still pins (unlike `hidden`,
+     * which traps it). `visible` disables clipping entirely.
      */
-    overflow?: 'hidden' | 'visible';
+    overflow?: 'hidden' | 'visible' | 'clip';
     role?: default_2.AriaRole;
     'aria-label'?: string;
     'aria-labelledby'?: string;