@rogieking/figui3 9.3.0 → 9.4.1

package/CHANGELOG.md

@@ -0,0 +1,3966 @@
+# Changelog
+
+All notable changes to this project will be documented in this file.
+
+## [9.4.1]
+
+### Added
+
+- Added a playground example for authored `fig-group` headers with independent actions.
+
+### Changed
+
+- Collapsible `fig-group` titles and chevrons now own toggle behavior, leaving header actions independent and keeping focus and hover feedback scoped to the toggle.
+- `fig-group compact` now propagates to its direct `fig-header`; playground Compact controls update every group in an example.
+
+### Fixed
+
+- `fig-truncate` now re-renders when its text changes and keeps tooltip behavior synchronized with content, overflow, and the `tooltip` attribute.
+
+## [9.4.0]
+
+### Added
+
+- Added `fig-toolbelt`, `fig-toolbelt-group`, and `fig-toolbelt-item`: a selectable horizontal or vertical toolbar with grouped separators, roving keyboard navigation, overflow fades, and optional paging buttons.
+- Added experimental Lab `fig-input-audio` for single-audio uploads with a responsive waveform preview.
+- Added `items` selector support to `fig-reorder` so only matching children are reorderable.
+- Added playground examples and skill docs for toolbelt, audio input, and reorder items.
+
+### Changed
+
+- Removed the unused `typescript` peer dependency so installs no longer require `--legacy-peer-deps`.
+- `CHANGELOG.md` now ships in the npm package.
+- Lab playground navigation adds an Inputs group and merges same-named nav groups.
+
+## [9.3.0]
+
+### Changed
+
+- Merged all PropsKit examples into the FigUI3 playground with redirects for old `/propskit` routes; Lab now lives at `/lab`.
+- Reorganized playground navigation into focused groups and ordered inputs from common to specialized controls.
+- `fig-reorder` uses the secondary background color for the actively dragged item.
+- Refined migrated examples with clearer names, full-width input fields, and simpler dialog content.
+
+### Fixed
+
+- Prevented `fig-property-button` from receiving generic leading-SVG padding.
+
+## [9.2.3]
+
+### Fixed
+
+- Secondary button and input combos keep one outer border and divider when controls are wrapped in `fig-tooltip`.
+
+### Changed
+
+- FigUI3 playground Input Combo Fields example uses `fig-input-combo full`.
+
+## [9.2.2]
+
+### Added
+
+- Added authored `slot="prepend"` icon support to `fig-property-button`, taking precedence over its generated `icon`.
+
+## [9.2.1]
+
+### Changed
+
+- Made all-secondary button and input combos share one outer border and a non-overlapping internal divider.
+- Added `full` width support to button and input combo wrappers.
+- Added FigUI3 playground examples for `fig-input-combo` fields and property actions.
+
+## [9.2.0]
+
+### Added
+
+- `fig-stack` layout element with `direction="horizontal|vertical|grid"`, token-aware `gap`, `align`, `justify`, `wrap`, `full`, and grid `columns` / `min-width`.
+- `fig-property-button`, a full-width secondary trigger with an explicit generated icon, selected/disabled states, and popup ARIA forwarding.
+
+### Changed
+
+- Deprecated `hstack` / `vstack`; they remain as styling aliases of `fig-stack`. Playground and tests now use `fig-stack`.
+- Changed the default `fig-popup` radius from large to medium.
+
+## [9.1.6]
+
+### Fixed
+
+- Restored the brand icon color on out-of-bounds `fig-origin-grid` handles.
+
+## [9.1.5]
+
+### Changed
+
+- Made `fig-angle` sweeps originate from `default`, preserve signed complete turns, and retain the endpoint arrowhead across all angle units.
+- Made `rotations` display the modulo angle with a signed full-turn counter while preserving the authored value during edits.
+
+### Fixed
+
+- Kept multi-digit `fig-angle` rotation counts such as `×8` visible in the number input append slot.
+
+## [9.1.4]
+
+### Fixed
+
+- Restored the inset outline on color handles with a valid outline value and offset.
+
+## [9.1.3]
+
+### Changed
+
+- Refined menu-item padding, icon spacing, and prepend-slot alignment.
+- Aligned menu separator labels and rules with menu-item content.
+- Updated the icon Menu example to use full-size prepend icons.
+
+## [9.1.2]
+
+### Added
+
+- Added a Menu playground example with icon-leading actions.
+
+### Changed
+
+- Scoped secondary `fig-header` text styling to direct `span` and `label` children.
+
+## [9.1.1]
+
+### Changed
+
+- Added live value tooltips to Bézier and spring easing handles, labeled Bézier handles as Start and End, and allowed spring duration to reach 100%.
+- Matched easing-curve handle interiors to the secondary background token.
+
+### Fixed
+
+- Kept the spring bounce handle on the first overshoot peak at full bounce.
+- Kept the fill-picker saturation and brightness handle above the preview edge highlight.
+- Removed padding from empty `fig-content` containers.
+
+## [9.1.0]
+
+### Added
+
+- Added `variant="ghost"` to `fig-input-number` for a borderless control with secondary hover/focus fill.
+- Added a `tabular` presence attribute to `fig-input-number` that applies Inter tabular numerals (`font-variant-numeric: tabular-nums`).
+- Added core `fig-angle`, replacing the experimental Lab `fig-input-angle` with an instrument-style dial, unit conversion, unbounded winding, reset control, keyboard/scrub input, and reusable rotation icon.
+- Added tertiary dot grids to easing preset icons.
+- Added marked custom fill-picker swatches via `data-fig-fill-picker-swatch`, including solid, gradient, image, video, and webcam previews.
+- Added extra-large and full radius tokens.
+
+### Changed
+
+- Updated semantic UI3 colors, strong heading weight, and elevation contrast.
+- `fig-angle` now always shows a centered ghost number input, uses a default degree step of `1`, and supports `deg`, `°`, `rad`, `turn`, and `grad`.
+
+## [9.0.14]
+
+### Fixed
+
+- Restored `fig-ai-context` tucking under a following `fig-ai-prompt` so the composer stacks as one surface.
+
+## [9.0.13]
+
+### Fixed
+
+- Corrected `fig-select` `menuAnchor` sizing and alignment, including selected-row overlay geometry, small anchors, viewport clamping, live anchor changes, and all explicit `position` values.
+
+## [9.0.12]
+
+### Added
+
+- Added `menu-anchor` / `menuAnchor` on `fig-select` so the open menu can align against another element.
+
+### Fixed
+
+- Honored `fig-select` `position` for popup placement instead of always overlaying the selected option on the trigger.
+- Kept `fig-select` menus inside the viewport by capping listbox height and clamping after overlay alignment.
+- Prevented `fig-popup` clamping from pushing oversized menus past the viewport start edge.
+
+## [9.0.11]
+
+### Changed
+
+- Applied playground overflow fading to the sidebar’s inner scroll content so its border remains visible.
+
+### Fixed
+
+- Prevented native image dragging from overriding `fig-chooser` drag-to-scroll behavior.
+
+## [9.0.10]
+
+### Added
+
+- Added an `optionfocus` event to `fig-select` for previewing keyboard-focused options without changing selection, including playground event output and documentation.
+
+## [9.0.9]
+
+### Changed
+
+- Refined the gradient fill picker with a semantic Stops heading, compact header padding, and a ghost gradient-type select.
+- Added a selection-ring gutter to `fig-chooser` while preserving choice alignment and overflow navigation geometry.
+
+### Fixed
+
+- Prevented pointer-dragged gradient stop handles from displaying keyboard focus outlines.
+- Prevented selected `fig-choice` rings from being clipped by scrollable choosers.
+
+## [9.0.8]
+
+### Added
+
+- Added `size="large"` support to `fig-segmented-control`, including height-matched segment minimum widths, playground controls, documentation, and component coverage.
+- Added dedicated Inputs and Media groups to `/figui3`, with sections and examples sorted alphabetically within each group.
+- Added standalone `fig-fill-picker` mode examples and expanded `fig-input-fill` examples, including a live WebGPU custom shader preview.
+
+### Changed
+
+- Removed CSS containment declarations from core, lab, and editor component styles.
+- Applied overflow fades to playground navigation and scrollbar-overflow choosers.
+- Updated icon-only segments to remove inline padding and card labels to inherit font size.
+- Limited the fill input playground section to sessions with editor components enabled.
+
+### Fixed
+
+- Truncated long `fig-select-option` labels with ellipsis when the menu is width-clamped.
+- Fixed equal segmented-control sizing so every segment remains the same width without clipping its padding.
+- Fixed grid chooser spacing around injected overflow navigation buttons.
+- Fixed labeled separators outside menus and selects hiding their rule, and stopped AI context panels from overlapping prompts.
+
+## [9.0.7]
+
+### Added
+
+- Added `size="large"` support to `fig-input-number`, including large prepend spacing, playground controls and examples, documentation, and component coverage.
+
+## [9.0.6]
+
+### Added
+
+- Added `.fig-overflow-fade` and `.fig-overflow-fade-horizontal`, CSS-only scroll utilities with tokenized, eased, direction-aware edge fades gated behind scroll-timeline support, plus vertical and horizontal playground examples.
+
+## [9.0.5]
+
+### Changed
+
+- Refined padded `fig-choice` spacing, corner radius, and selected-state outline treatment.
+- Added padding to every choice in the image chooser playground example.
+
+### Fixed
+
+- Playground-only action controls now retain their original position and remain available after example markup updates.
+
+## [9.0.4]
+
+### Added
+
+- Added a `fig-select` playground example with a prepended icon.
+
+### Changed
+
+- Select prepend regions now span the trigger height, maintain a matching minimum width, and center their content at default and large sizes.
+
+## [9.0.3]
+
+### Added
+
+- Added `size="large"` support to `fig-dropdown` and `fig-select`, including reactive sizing, playground examples, documentation, and component coverage.
+
+## [9.0.2]
+
+### Added
+
+- Added structured object and serialized JSON values, initial velocity, and a `spring` property to `fig-easing-curve`.
+- Added independent `presets` and `text` visibility controls to `fig-easing-curve`.
+
+### Changed
+
+- Spring curves now use a normalized bounce number input linked to their damping ratio.
+- Easing-curve events now include structured spring detail without leaking internal selector events.
+
+### Fixed
+
+- Fixed easing SVG clipping at non-square aspect ratios while preserving the editor container padding.
+
+## [9.0.1]
+
+### Added
+
+- Added a repository-native Codex publish skill with release verification for GitHub and npm.
+
+### Changed
+
+- Easing-curve SVG containers now keep overflow clipped during hover, active, and focus states.
+- Removed the stale nested Cursor publish-rule duplicate.
+
+## [9.0.0]
+
+### Changed
+
+- Removed the legacy Lab property-control wrappers and their examples, tests, JSX types, and documentation.
+- Removed the unused standalone editor scaffold.
+
+## [8.11.1]
+
+### Added
+
+
+### Changed
+
+- Deleting an unselected editable-select option no longer emits unchanged `input` and `change` events.
+- Added `optionschange` output to the playground, React guidance, README, bundled skills, and component contracts.
+
+## [8.11.0]
+
+### Added
+
+- Added the medium checkmark icon and `size="large"` support to `fig-input-text`.
+
+### Changed
+
+- Refined easing-curve sizing, icon mask rendering, and `fig-choice` selection rings.
+- Expanded playground controls, JSX types, documentation, bundled skills, accessibility coverage, and component contracts for the new components.
+
+## [8.10.1]
+
+### Fixed
+
+
+## [8.10.0]
+
+### Added
+
+- Added `mode="bezier|spring"` to `fig-easing-curve`, including filtered presets and constrained manual entry.
+- Added `subtle`, `aria-label`, `slot="trigger"`, and `slot="prepend-trigger"` support to `fig-select`.
+- Added body typography tokens, `--radius-medium-large`, `--fig-swatch-border-radius`, and button-control spacing variables.
+
+### Changed
+
+- Refined `fig-input-palette` borders, `fig-joystick` axis-label layout, and small body typography.
+- Expanded playground examples, attribute controls, JSX types, README documentation, and bundled skills for the new contracts and components.
+
+### Fixed
+
+- Rich `fig-select` prepend and custom triggers now render, update after selection, preserve accessible names, and align their menus correctly.
+
+## [8.9.49]
+
+### Added
+
+- Added `trash` to `fig-icon` at medium and small sizes, including playground icon and toast controls.
+
+### Changed
+
+
+## [8.9.48]
+
+### Added
+
+- `fig-canvas-control` now supports configurable precision for positions, radius, angle, and internal handle dragging.
+
+### Changed
+
+- Canvas-control radius rings and point-to-point lines reveal their shared halo and thicker stroke on hover.
+- Added generic `--fig-canvas-control-stroke-halo` and `--fig-canvas-control-stroke-halo-hover` customization properties while preserving the previous radius halo property.
+
+### Fixed
+
+- Playground examples and attribute controls now reset reliably when navigating between examples.
+
+## [8.9.47]
+
+### Added
+
+- `fig-handle` now supports `precision` for percentage values and pixel dragging, defaulting to two decimal places.
+
+### Fixed
+
+- Overflow navigation stays pinned to the edges when React appends delayed options, tabs, or choices.
+
+## [8.9.46]
+
+### Changed
+
+- `fig-header` title styles now apply to all heading children, not only the first child.
+
+## [8.9.45]
+
+### Changed
+
+- Split FigUI3, fig-editor, fig-lab, and propkit skills into thinner entry files with separate component catalogs and React usage docs.
+
+## [8.9.44]
+
+### Changed
+
+
+### Fixed
+
+- Group headings retain ellipsis behavior while keeping disclosure chevrons vertically aligned.
+
+## [8.9.43]
+
+### Changed
+
+- Slider handle fading begins at `--spacer-3` and completes at `--spacer-2`.
+- Removed the inset border from avatar images.
+
+### Fixed
+
+- Header titles now truncate overflowing text with an ellipsis.
+
+## [8.9.42]
+
+### Changed
+
+
+## [8.9.41]
+
+### Changed
+
+
+### Fixed
+
+
+## [8.9.40]
+
+### Added
+
+- Added logical `start`, `center`, and `end` content alignment for `fig-button`.
+- Added button playground examples for alignment and prepended icons.
+
+### Changed
+
+- Refined `fig-button` padding when a prepended icon is present, including large buttons.
+
+## [8.9.39]
+
+### Fixed
+
+
+## [8.9.38]
+
+### Fixed
+
+
+## [8.9.37]
+
+### Added
+
+- Fast `fig-input-wheel` scrubbing now applies a brief motion blur to its ticks.
+
+### Changed
+
+- Doubled the horizontal inset around `fig-input-wheel` ticks.
+
+## [8.9.36]
+
+### Changed
+
+- The default font stack now prefers Inter when the consuming app makes it available.
+
+## [8.9.35]
+
+### Added
+
+- Added the shared `--font-variant-numeric` token for lining, tabular, slashed-zero numerals.
+
+### Fixed
+
+- The playground now loads full Inter 3.19.3 so its slashed-zero OpenType glyph renders correctly.
+
+## [8.9.34]
+
+### Added
+
+- Added `fig-input-wheel.spinTo(value)` plus playground controls and a static-wheel example.
+
+### Fixed
+
+
+## [8.9.33]
+
+### Added
+
+- Added the experimental standalone `fig-input-wheel` numeric scrubber with projected ticks, centered handle, bounds, keyboard and pointer controls, and elastic feedback.
+- Added standalone Input Wheel playground examples, attribute controls, JSX support, and component documentation.
+
+### Changed
+
+
+### Fixed
+
+
+## [8.9.32]
+
+### Added
+
+
+### Changed
+
+
+## [8.9.31]
+
+### Added
+
+- `fig-chooser` supports `auto-scroll`, `scroll-behavior`, and `scrollSelectionIntoView()` for independent selection and scrolling control.
+- Playground chooser controls and a manual-scroll example expose the new APIs.
+
+### Changed
+
+- Chooser selection and overflow scrolling respect CSS scroll behavior and reduced-motion preferences.
+
+## [8.9.30]
+
+### Added
+
+- `fig-slider.defaultValue` exposes the resolved slider baseline.
+
+### Fixed
+
+- Slider defaults ignore non-numeric, out-of-range, and off-step values and remain synchronized when constraints change.
+- `fig-group` removes its generated fallback header when authored header content is present.
+
+### Changed
+
+
+## [8.9.29]
+
+### Added
+
+- `fig-button type="select"` automatically generates a small appended chevron; authored append-slot content overrides it.
+
+### Fixed
+
+- `fig-combo-input` now contains its dropdown events and broadcasts `input` and `change` only from the combo host.
+- Playground button type controls no longer inject sample dropdown markup when switching to `type="select"`.
+
+### Changed
+
+- Refined select-button spacing for labeled and icon-only layouts.
+
+## [8.9.28]
+
+### Fixed
+
+- Limit `fig-header` flexible title styling to a heading in the first-child position.
+
+## [8.9.27]
+
+### Changed
+
+- Refined `fig-header` padding and title/action alignment.
+- Added long-title, default dropdown, and ghost dropdown header examples.
+
+## [8.9.26]
+
+### Fixed
+
+- Replacing a video fill clears the previous poster and applies the newly captured poster to both the swatch and dialog preview. Posters from `default-video` or an earlier URL cannot remain after the video URL changes.
+
+## [8.9.25]
+
+### Fixed
+
+- Opening `fig-fill-picker` no longer emits `input` when nothing changed. Default-video apply, same-URL preview `loaded`, and the live webcam still are derived UI.
+- `fig-media` / `fig-image` / `fig-video` fire `loaded` when the src actually loads, not only after a file upload. The fill picker and `fig-input-fill` forward it so playground Event output can show it.
+
+### Changed
+
+- Playground theme switch uses `hstack` and tighter header padding.
+
+## [8.9.24]
+
+### Changed
+
+- Split license: core stays MIT; editor and lab (`fig-editor.js`, `fig-lab.js`, their CSS, dist copies, and those skills) are PolyForm Shield 1.0.0. `package.json` is `SEE LICENSE IN LICENSE`. Copies already shipped under MIT stay MIT.
+
+## [8.9.23]
+
+### Fixed
+
+- Automatic video poster capture paints the swatch without emitting `input`. The still is derived UI, not a fill change.
+
+## [8.9.22]
+
+### Added
+
+- Fill `value` may be a bare video URL (`.mp4`, `.webm`, `.mov`, `.m4v`, `.ogv`, or `data:video/…`). JSON still works.
+
+### Changed
+
+- Fill picker video preview stays paused after upload. First frame shows; play is opt-in.
+- Lab Fill and Fill Input Video examples use a video URL instead of JSON.
+
+### Fixed
+
+- Video fills without a poster paint a `createImageBitmap` still on the closed swatch. Capture runs on the picker when the URL is set, not only when the dialog opens.
+
+## [8.9.21]
+
+### Changed
+
+- `fig-swatch` uses the same focus-inside split as `fig-input-gradient` (`:focus-within:not(:focus)`). Nested color inputs no longer draw their own ring.
+
+### Fixed
+
+
+## [8.9.20]
+
+### Added
+
+
+### Changed
+
+
+### Fixed
+
+- Choosing Webcam on `fig-input-fill` paints the closed swatch from the first real camera frame instead of checkerboard or a black boot still.
+- Built-in cameras that start black (FaceTime) keep retrying and prefer `ImageCapture` until the frame has actual pixels. Host writes of `snapshot: null` no longer wipe a live still.
+
+## [8.9.19]
+
+### Added
+
+- `fig-input-fill` forwards custom `mode-*` slots to the inner picker and uses image-style chrome (type label + opacity) for non-built-in types.
+- Fill picker playground **Custom** example: `slot="mode-shader"` tab with preview + source.
+
+### Changed
+
+- Empty `fig-swatch background=""` shows the checkerboard instead of gray `#D9D9D9`.
+- Webcam and custom fill swatches default to checkerboard unless a background is supplied.
+- Fill picker `fig-preview { overflow: visible }` is limited to solid and gradient tabs.
+- Popup `fig-header` no longer paints an opaque background over the panel.
+- Removed unused `old.html`.
+
+### Fixed
+
+- Custom mode `swatch-background` is read from the live slot before the picker dialog is created.
+- Webcam camera select can switch when the live stream's `deviceId` is unknown.
+
+## [8.9.18]
+
+### Changed
+
+- `fig-fill-picker` hides the gradient interpolation row and locks interpolation to `srgb`.
+- `fig-fill-picker` dialog `fig-content` top padding is `--spacer-2`.
+- `fig-fill-picker` type select is `variant="ghost"`.
+- `fig-media-controls` play button no longer uses `size="small"`.
+- `fig-icon` uses `contain: size` instead of `contain: strict`.
+
+### Fixed
+
+- Video fills pass `poster` to `fig-swatch` `background` the same way image fills pass `url`.
+- Fill picker video preview gets the poster while the clip loads. Playground video fills use a live MDN clip (Google sample bucket is 403).
+- `fig-media-controls` play button stays visible without hover (`fig-tooltip` is a real flex item; `.has-media` only hides the replace overlay).
+
+## [8.9.17]
+
+### Added
+
+- `fig-fill-picker` / `fig-input-fill` webcam JSON is now `{ type: "webcam", webcam: { live, snapshot, deviceId, scaleMode, scale, opacity } }`.
+- `webcamStream`, `releaseWebcam()`, and `webcamstream` for the live `MediaStream` (not stored in `value`).
+- `webcam-mode="live|snapshot"`. Choosing Webcam starts the live camera. Capture writes a still and switches to Image.
+- `default-video` plus `video.poster`. Swatches paint the poster, never `url(file.mp4)`.
+
+### Changed
+
+- Closing the picker no longer stops a live webcam. The stream stops when leaving Webcam, calling `releaseWebcam()`, or disconnecting the element.
+- `fig-input-fill` gradient values include `css`. Solid `alpha` (0–1) stays canonical beside `opacity` (0–100).
+
+### Fixed
+
+- Restoring `{ webcam }` or the legacy `{ type: "webcam", image: { url } }` snapshot no longer drops the still.
+- `fig-input-fill` copies `detail.webcam` and has a video swatch case.
+- Webcam/video blob URLs stay valid and are quoted onto the inner `fig-swatch` (`url("blob:…")`), including after `fig-input-fill` remounts.
+- Choosing Webcam paints the swatch as soon as the live camera has a frame.
+
+## [8.9.16]
+
+### Added
+
+- `fig-chooser value=""` keeps no choice selected. Omitting `value` still selects the first choice.
+
+### Fixed
+
+- `fig-choice` selected outline radius includes the ring offset so corners stay concentric.
+
+## [8.9.15]
+
+### Changed
+
+
+### Fixed
+
+- `fig-field` no longer shows a disclosure chevron when the control is a `fig-fill-picker`.
+- `fig-swatch.focus()` still works when the native color input is gone.
+
+## [8.9.14]
+
+### Fixed
+
+- Vertical `fig-separator`s stay 1px wide instead of picking up labeled-row padding.
+
+## [8.9.13]
+
+### Fixed
+
+- Sticky labeled `fig-separator`s stack above scrolling list items.
+
+## [8.9.12]
+
+### Added
+
+- `fig-popup` `title` auto-generates a header, matching `fig-dialog`.
+- `fig-menu-item` works as a list row outside `fig-menu` — typically in a `fig-popup` with sticky `fig-separator`s and a nested `fig-menu` for row actions.
+
+### Changed
+
+- `fig-menu` now slots `fig-menu-item` / `fig-separator` into the popup instead of relocating them, matching `fig-select`. Triggers get `slot="trigger"` automatically. React can add or remove items without `removeChild` errors.
+
+### Fixed
+
+- `fig-menu-item` color inherits from the parent surface instead of always painting menu-white.
+- Nested `fig-menu` inside a `fig-menu-item` only selects its own items and does not fire the parent row.
+- Sticky labeled `fig-separator`s hide the rule (`::before`) while stuck.
+
+## [8.9.11]
+
+### Added
+
+- `variant="ghost"` on `fig-dropdown` and `fig-select` for a borderless control with secondary hover fill.
+- Shipped Cursor skills for the core, editor, and lab bundles (`figui3`, `fig-editor`, `fig-lab`), plus an updated PropKit skill.
+
+### Changed
+
+- Documented `fig-select` in the README and clarified that `fig-layer` is a separate import, not part of `fig-editor.js`.
+
+## [8.9.10]
+
+### Added
+
+- Select playground Sticky toggle applies `sticky` to each `fig-separator` and persists as `_sticky` in the URL.
+- Expanded the AI models select example with a long grouped model list.
+
+### Changed
+
+- Removed the Popup "With menu" playground example.
+
+### Fixed
+
+- Sticky labeled `fig-separator`s in overflowed `fig-select-options` and `.fig-menu-options` sit below the overflow-start button.
+
+## [8.9.9]
+
+### Added
+
+- Added a Popup playground example with a nested `fig-menu`.
+
+### Fixed
+
+- `fig-menu` now opens on the top layer via `popover`, so nested menus inside `fig-popup` stay anchored to their trigger instead of offsetting by the parent popup.
+
+## [8.9.7]
+
+### Added
+
+- Added subtle menu items with a secondary hover/focus treatment and playground example.
+
+## [8.9.6]
+
+### Added
+
+
+## [8.9.5]
+
+### Added
+
+- Added a theme-aware `--fig-popover-shadow` drop-shadow token for popovers, tooltips, and color tips.
+
+### Changed
+
+- Popup dialogs now use the menu-panel elevation by default.
+- The popup playground defaults to the inherited theme and removes the `theme` attribute when Default is selected.
+
+## [8.9.4]
+
+### Added
+
+- Added the minimal `fig-handle` type and playground example.
+
+### Changed
+
+- `fig-easing-curve` uses minimal handles, edge-aligned curve geometry, 45px preview padding, and horizontal boundary snapping while Shift-dragging.
+- Refined handle shadows, outlines, padding, and easing control-arm colors.
+
+### Fixed
+
+- Handle inner backgrounds now respect the active light or dark color scheme.
+
+## [8.9.3]
+
+### Added
+
+- Added non-removable image attachments to the user message in the Chat Message conversation example.
+
+### Changed
+
+- Chat messages use column layout and consistent internal spacing for composed content.
+- Removed the standalone Interpolation Swatch playground example.
+
+## [8.9.2]
+
+### Added
+
+- Added a verbose `fig-select` playground example with rich version-history options.
+
+### Changed
+
+- Added consistent spacing below headings in select and menu options.
+
+## [8.9.1]
+
+### Fixed
+
+- `fig-select-options` now preserves top spacing when its overflow controls are adjacent in the DOM.
+
+## [8.9.0]
+
+### Added
+
+- Added `copy` to `fig-icon` at medium and small sizes, including playground icon and toast controls.
+
+## [8.8.1]
+
+### Fixed
+
+- `fig-icon` with a slotted `<svg>` no longer paints a solid `color` background block behind the SVG, and now applies the `color` attribute to the SVG via `currentColor`.
+
+## [8.8.0]
+
+### Added
+
+- `fig-icon` `color` aliases map semantic names (`primary`, `brand`, `component`, `danger`, `success`, `warning`, `selected`, `onbrand`, …) to `--figma-color-icon*` tokens.
+- Playground icon color controls use those aliases instead of raw CSS variables.
+
+### Changed
+
+- Renamed the Icon Medium playground example to Default.
+
+## [8.7.0]
+
+### Added
+
+- Added a Processing toast playground example composing a leading `fig-spinner`.
+
+### Changed
+
+- Toasts pull a leading `fig-spinner` flush to the inline edge like a leading icon.
+
+## [8.6.1]
+
+### Fixed
+
+- Dark-theme toasts no longer force the menu background color.
+
+## [8.6.0]
+
+### Added
+
+- `fig-toast` supports optional `icon` (full-size `fig-icon` name) and `dismiss` (ghost close button).
+- `dismiss="true"` inserts a vertical `fig-separator` before the close control.
+- `fig-separator` supports `direction="vertical"`.
+- Added toast playground examples for actions and error states with Retry.
+
+### Fixed
+
+- Open toasts keep a horizontal flex row instead of inheriting the generic dialog column layout.
+
+### Changed
+
+- Toast attribute controls gate the icon name picker behind an Icon switch.
+
+## [8.5.0]
+
+### Added
+
+- Added experimental `fig-ai-context`, a reusable open container for attachments and status rows that can sit above `fig-ai-prompt`.
+- Added AI composer playground examples for attachments, status, and action-needed context.
+
+### Changed
+
+- Renamed the AI Prompt lab section to AI composer and split attachment vs sending examples.
+
+## [8.4.1]
+
+### Fixed
+
+- `fig-input-fill` swatches preserve linear, radial, and angular gradient types while keeping radial previews centered.
+
+## [8.4.0]
+
+### Added
+
+- Added segmented gradient interpolation presets with tooltips and an overflow menu for advanced hue directions.
+- Added regression coverage that prevents HTML parsing sinks in shipped JavaScript.
+
+### Changed
+
+- Simplified gradient editing by removing angle and radial center fields, keeping rotation available for radial gradients, and moving interpolation controls before stops.
+- Moved `fig-interpolation-swatch` from core into the editor bundle (`fig-editor.js` / `fig-editor.css`).
+- Rebuilt dynamic component markup with DOM APIs so authored values remain literal text and attributes.
+- Updated dropdown examples with labeled option groups.
+
+### Fixed
+
+- Fixed fixed-size media collapsing when combined with `full` and `aspect-ratio`.
+- Fixed custom media overlay controls flickering when hovered.
+- Fixed uploaded videos remaining hidden or disabled after selection.
+- Fixed locked webcam pickers failing to report captured snapshots.
+- Fixed disabled slider styling and related component layout regressions.
+
+## [8.3.0]
+
+### Added
+
+- Restored `fig-menu-separator` as a backwards-compatible `FigSeparator` alias.
+
+### Changed
+
+- The no-fields dialog example shows the footer divider again.
+- Empty `fig-content` collapses padding even when it has no element children.
+
+### Fixed
+
+- Gradient handle-mode stops stay selected and focused, so Delete/Backspace reliably removes them.
+
+## [8.2.1]
+
+### Fixed
+
+- Non-range `fig-slider` types (`delta`, `hue`, `stepper`, `opacity`) now pass their resolved value through to the number input instead of showing the placeholder.
+
+## [8.2.0]
+
+### Added
+
+
+### Changed
+
+- Generated image loading indicators use the small spinner size.
+
+### Fixed
+
+- Disabled oscillators stop and resume their playhead animation correctly.
+- Attachments keep a stable square size while loading, and loading spinners are no longer constrained by overlay sizing.
+
+## [8.1.0]
+
+### Added
+
+- Added numeric spatial control event details with explicit `units`.
+
+### Changed
+
+- Lab CSS loads only on lab-enabled playground routes instead of through `fig-editor.css`.
+
+## [8.0.3]
+
+### Changed
+
+- `fig-input-gradient` swatches always preview as a left-to-right linear gradient, regardless of type or angle.
+
+## [8.0.2]
+
+### Fixed
+
+
+## [8.0.1]
+
+### Fixed
+
+
+## [8.0.0]
+
+### Changed
+
+- Moved `fig-select`, `fig-select-option`, and `fig-select-options` from core into the editor bundle (`fig-editor.js` / `fig-editor.css`).
+- Select playground docs now live under Editor components.
+
+### Breaking
+
+- Import `fig-editor.js` (and `fig-editor.css`) to use `fig-select`. Core `fig.js` alone no longer registers it.
+
+## [7.1.0]
+
+### Added
+
+- Added a populated multiline text input example for `fig-field`.
+
+### Changed
+
+- Reduced vertical padding for `fig-tabs` and the maximum field-label height.
+- Dialogs can now grow to the viewport height while retaining outer spacing.
+
+## [7.0.0]
+
+### Added
+
+- Added `fig-chit` as a backwards-compatible alias for `fig-swatch`, including fill-picker support.
+
+### Changed
+
+- `fig-card` now renders generated media and footers as direct children without a `.fig-card-link` wrapper.
+
+### Fixed
+
+- Long `fig-card` sublabels now truncate with an ellipsis.
+- Loading spinners stay centered in `fig-card` images and authored previews.
+
+### Removed
+
+- Removed the `href` and `target` attributes and built-in link behavior from `fig-card`.
+
+## [6.40.1]
+
+### Fixed
+
+- Empty `fig-content` elements no longer reserve padding.
+- Full-width `fig-chooser` elements now account for their inline margins.
+
+### Changed
+
+- Updated dialog and helper-text examples to demonstrate `fig-content` padding behavior.
+
+## [6.40.0]
+
+### Changed
+
+
+## [6.39.0]
+
+### Changed
+
+
+## [6.38.0]
+
+### Changed
+
+
+### Fixed
+
+- Late-set delta slider values now sync to the nested `fig-input-number`.
+
+## [6.37.1]
+
+### Fixed
+
+- Hovering options in an open `fig-select` no longer reopens a wrapping `fig-tooltip`.
+
+## [6.37.0]
+
+### Added
+
+- Added the `borderless` attribute for `fig-separator`.
+
+### Changed
+
+- `fig-select-options` now marks a leading separator as borderless.
+- Replaced the grouped select playground example with grouped AI models.
+
+## [6.36.0]
+
+### Added
+
+- Added the `destructiveLink` variant for `fig-button`.
+
+### Changed
+
+- Attribute controls in the playground now use `fig-select` instead of `fig-dropdown`.
+- Icon button examples now use `fig-icon` with the `visible` icon.
+
+### Fixed
+
+- Button type, variant, and icon content now rehydrates correctly from playground URL state.
+
+## [6.35.0]
+
+### Added
+
+- Added the `destructiveGhost` variant for `fig-button`.
+
+## [6.34.0]
+
+### Added
+
+- Added `destructive` and `destructiveSecondary` variants for `fig-button`.
+
+### Changed
+
+- Button variant controls in the FigUI3 playground now update the example label and correctly represent the default primary variant.
+
+## [6.33.1]
+
+### Fixed
+
+- Checkbox and switch inputs no longer shrink in flex layouts, and `fig-checkbox` and `fig-switch` align multiline content from the top.
+
+## [6.33.0]
+
+### Added
+
+- `fig-image`, `fig-media`, and `fig-video` now re-emit native image and video load lifecycle events from their host elements.
+- `fig-image` and image-mode `fig-media` now show a delayed default spinner while generated images load, with `loading-indicator="false"` as an opt-out.
+- Added a loading-state example for `fig-image`.
+
+### Fixed
+
+- Loaded `fig-media` videos now keep upload overlay buttons hidden until hover or keyboard focus.
+
+## [6.32.2]
+
+### Changed
+
+- `fig-preview` now defaults to a `4/3` aspect ratio, and its playground control uses the shared aspect-ratio dropdown.
+- `fig-avatar` no longer shrinks inside flex layouts.
+- Adjusted the secondary icon token to 50% black in light mode and 70% white in dark mode.
+
+## [6.32.1]
+
+### Changed
+
+- Updated the 24px globe icon token and encoded it as an SVG data URI.
+
+## [6.32.0]
+
+### Added
+
+- Added an `aspect-ratio` attribute to `fig-preview`.
+
+### Changed
+
+- Updated the Card playground descriptions and manual example to document authored media and footer composition.
+
+## [6.31.2]
+
+### Changed
+
+- `fig-card` now renders attribute-driven labels in a compact `fig-footer` and preserves authored footers without generating labels when no label attributes are present.
+
+## [6.31.1]
+
+### Fixed
+
+- `fig-card[size="large"]` no longer adds extra horizontal padding on generated labels and sublabels.
+
+## [6.31.0]
+
+### Added
+
+- Added `size="large"` to `fig-card` for `--spacer-2` card padding and `--spacer-1` label spacing.
+- Added `globe` icon tokens for `fig-icon` (24px and 16px).
+
+### Changed
+
+- The playground Icon name dropdown is now sorted alphabetically.
+
+## [6.30.0]
+
+### Added
+
+- Added experimental `fig-attachment` and `fig-attachments` lab components for removable image previews and wrapping AI prompt attachments.
+
+### Changed
+
+- The playground event output now reports attachment `remove` events.
+
+## [6.29.1]
+
+### Changed
+
+
+## [6.29.0]
+
+### Added
+
+
+### Changed
+
+- Large gradient inputs now size their swatch to the full control height.
+
+## [6.28.1]
+
+### Changed
+
+- Horizontal `fig-field` labels now center within a capped large-control height while preserving ellipsis truncation.
+
+### Fixed
+
+- `fig-input-gradient[edit="picker"]` now opens the gradient fill editor by pointer or keyboard and upgrades when the optional picker registers later.
+
+## [6.28.0]
+
+### Added
+
+- Added `optionhover` support to the playground event output.
+
+## [6.27.0]
+
+### Added
+
+
+### Changed
+
+- Refined oscillator wave controls with a menu-based add action, zero-centered delta fields, and stronger waveform styling.
+
+### Fixed
+
+- Opacity slider number fields remain directly editable above the range surface.
+
+## [6.26.0]
+
+### Added
+
+- Added `--fig-preview-background` for customizing or removing preview surface backgrounds.
+- Added a manual `fig-card` example composed from an authored `fig-preview` and spinner.
+
+### Changed
+
+- Direct color emitters now share additive `{ color, alpha, opacity }` fields while preserving legacy `fig-input-color` payloads.
+- `fig-card` now preserves authored children without `src`, generates media without a `.fig-card-media` wrapper, and uses semantic label elements.
+- Media with an explicit `aspect-ratio` now fills the available width automatically.
+- Refined tab strip inline margins with independent left and right variables.
+
+### Fixed
+
+- `fig-canvas-control` now preserves color alpha aliases from its handle events.
+- Gradient color adapters now accept either fractional `alpha` or percentage `opacity`.
+
+## [6.25.0]
+
+### Changed
+
+- `fig-reorder` now drags from any child surface while preserving nested controls with their own drag behavior.
+
+## [6.24.5]
+
+### Fixed
+
+- Encoded the 24px chevron icon and added size-specific `fig-icon` mappings and playground coverage.
+
+## [6.24.4]
+
+### Added
+
+- Added an AI prompt sending-state example with disabled controls and a spinner.
+
+### Fixed
+
+- Disabled text inputs inside `fig-ai-prompt` no longer show an inner border.
+
+## [6.24.3]
+
+### Fixed
+
+- `fig-ai-prompt` textareas now fill the input height without bottom padding.
+
+## [6.24.2]
+
+### Added
+
+- Added 16px and 24px `send` icons to `fig-icon`, its playground catalogs, and documentation.
+
+### Changed
+
+- Refined `fig-ai-prompt` spacing, input-only focus treatment, and footer layout with model selection and send actions.
+
+## [6.24.1]
+
+### Fixed
+
+- `fig-ai-prompt` now lays out its textarea without absolute positioning and keeps it above the footer action area.
+- AI prompt actions now compose through `fig-footer`.
+
+## [6.24.0]
+
+### Added
+
+- Added `fig-separator`, a reusable labeled divider for menus, selects, and general content.
+- Added experimental `fig-ai-prompt` and `fig-chat-message` styling components with AI playground examples.
+
+### Changed
+
+- Replaced `fig-menu-separator` with `fig-separator` throughout the runtime, docs, and examples.
+- Improved avatar initials and shimmer text defaults for chat compositions.
+
+## [6.23.4]
+
+### Fixed
+
+- `fig-slider` updates bounds and units in place and defers structural regeneration until pointer release.
+
+## [6.23.3]
+
+### Fixed
+
+
+## [6.23.2]
+
+### Changed
+
+
+## [6.23.1]
+
+### Changed
+
+- Removed unintended standalone package entry points, generated bundles, isolation tests, and quickstart artifacts.
+
+## [6.23.0]
+
+### Added
+
+- Added viewport-bounded top and bottom overflow controls to `fig-menu`, with paging, keyboard scrolling, and reconnect-safe behavior.
+- Added core playground examples for `fig-select`, icon-triggered menus, and overflowing menus.
+
+### Changed
+
+- Shared vertical overflow helpers and menu chrome between `fig-select` and `fig-menu`.
+- Moved the `fig-select` playground documentation from Lab to FigUI3 core.
+
+### Fixed
+
+- Regular menu separator labels now align with menu items while select separators retain checkmark-column alignment.
+- Header trailing icon menus now use the same edge alignment as direct icon buttons.
+
+## [6.22.0]
+
+### Added
+
+- Promoted `fig-select`, `fig-select-option`, and `fig-select-options` from Lab into the core runtime and styles, with rich selected-option icons and content-sized menus.
+- Added focused core, editor, Lab, accessibility, layout, and component-contract regression coverage.
+
+### Changed
+
+- Refined `fig-easing-curve` with 2px strokes, horizontal bounds, cleaner endpoints, improved layer order, preset selection via `fig-select`, and dynamic scaling for overshooting Bézier handles.
+- Improved select menu spacing, non-wrapping labels, checkmark geometry, viewport clamping, and selected-option presentation.
+- Migrated rich oscillator options to `fig-select`.
+- Removed legacy `experimental` dropdown styling and no-op fill/color picker attribute passthroughs.
+
+### Fixed
+
+- Fill, gradient, media, field, and overlay controls now preserve consistent sizing, focus, labels, disabled states, and reconnect behavior across core and optional modules.
+
+## [6.21.1]
+
+### Fixed
+
+- Custom elements now register idempotently, preventing duplicate-registration errors when FigUI modules are re-evaluated together.
+
+## [6.21.0]
+
+### Added
+
+- `fig-interpolation-swatch` for compact linear and polar gradient interpolation previews, with small and large sizes.
+- HSL gradient interpolation with shorter, longer, increasing, and decreasing hue paths.
+- Gradient opacity editing in `fig-input-fill`.
+
+### Changed
+
+- Gradient interpolation options are grouped in `fig-fill-picker` with live swatch previews and keyboard preview behavior.
+- Select option panels size to their content up to the viewport and improve edge positioning, keyboard navigation, and disabled-option handling.
+
+### Fixed
+
+- Gradient previews and interpolation swatches stay synchronized when stops, colors, positions, or interpolation settings change.
+- Empty video media disables playback controls until a playable source is available.
+
+## [6.20.2]
+
+### Added
+
+- `FigTooltip.dismissHoverTooltips()` — dismisses open/pending hover tooltips and programmatic `FigTooltip.show()` tips (skips `show`-persisted and `action="click"`).
+
+### Fixed
+
+- Hover tooltips no longer stay open when a non-tooltip `fig-popup` (menu, select, etc.) or `fig-dialog` opens.
+
+## [6.20.1]
+
+### Changed
+
+
+### Fixed
+
+
+## [6.20.0]
+
+### Added
+
+- `fig-card` — media card composing `fig-image`, with `label` / `sublabel`, optional real `<a>` via `href`, attribute-only `selected`, `disabled`, `full`, `aspect-ratio`, `fit`, and `label-line-clamp`.
+- Playground Card examples (default, selected, sublabel, link, aspect ratio, grid) plus README / attribute panel wiring.
+
+### Fixed
+
+- Playground AttributesView string fields no longer remount (and steal focus) on each keystroke.
+
+## [6.19.1]
+
+### Fixed
+
+
+## [6.19.0]
+
+### Added
+
+- `--icon-24-reset` token; `fig-icon name="reset"` resolves medium/small sizes.
+
+### Fixed
+
+
+## [6.18.4]
+
+### Fixed
+
+- `fig-canvas-control` rotate cursor only on the outside hit-area ring; handle body keeps the normal point cursor (point-point + angle).
+- Active rotate drag keeps the rotate cursor (`fig-lab-rotate-active`) instead of switching to move.
+
+### Changed
+
+
+## [6.18.3]
+
+### Fixed
+
+
+## [6.18.2]
+
+### Fixed
+
+
+## [6.18.1]
+
+### Fixed
+
+- `fig-select` listbox now stays fully in-viewport when the trigger sits on viewport edges/corners (`::part(listbox) inset` no longer blocks clamped `left`/`top`).
+- Non-modal `fig-dialog` stacking uses `figGetHighestZIndex` on `show()` / markup `open` so dialogs sit above other FigUI overlays.
+
+## [6.18.0]
+
+### Added
+
+
+### Changed
+
+
+### Fixed
+
+- `fig-field` no longer treats popup hosts (`fig-select`, `fig-menu`, etc.) as disclosures, which was injecting a duplicate field chevron.
+- Disabled `fig-select` trigger label uses tertiary text color.
+
+## [6.17.0]
+
+### Added
+
+- Added `fig-select` with authored `fig-select-options` panel (slot=panel auto), overflow top/bottom buttons, and full-width menu matching.
+- Added optional `label` on `fig-separator` (rule + secondary group text underneath).
+- Added lab Select examples: full width, many options, grouped items; Menu labeled-separator example.
+
+### Changed
+
+- `fig-popup` outside dismiss uses `composedPath()` so slotted menu/select clicks are not treated as outside.
+
+### Fixed
+
+- Select overflow paging no longer gets yanked back by open-time menu repositioning.
+- Select `[full]` popup width now matches the trigger (part listbox width rules no longer win over inline sizing).
+
+## [6.16.0]
+
+### Added
+
+
+### Changed
+
+
+## [6.15.0]
+
+### Added
+
+
+### Changed
+
+
+## [6.14.1]
+
+### Added
+
+- Added `adjust` icon tokens for `fig-icon` (24px and 16px).
+- Added `adjust` to `FIG_ICON_TOKENS` and the playground Icon attribute options.
+
+## [6.14.0]
+
+### Added
+
+- Added `download`, `upload`, `sun`, and `moon` icon tokens for `fig-icon` (24px).
+- Added those names to `FIG_ICON_TOKENS` and the playground Icon attribute options.
+
+### Changed
+
+- PropKit Icons theme example uses `fig-icon` for sun and moon segments.
+
+## [6.13.2]
+
+### Changed
+
+- Added shared `--input-opacity-width` token (`calc(3.5rem - 2px)`) for opacity number fields on `fig-input-fill`, `fig-input-color`, and `fig-slider`.
+
+## [6.13.1]
+
+### Changed
+
+- Changed `fig-slider` paired number input width to use `--slider-number-width` (default `3.5rem`).
+- Removed horizontal `fig-field` flex override from `fig-input-number` so intrinsic sizing matches other inputs.
+
+## [6.13.0]
+
+### Added
+
+- Added `edit`, `eyedropper`, `settings`, and `more` icon tokens for `fig-icon` (24px and 16px where applicable).
+- Added Color visibility toggle playground example.
+- Added `settings` and `more` to Icon playground name options on `/figui3`.
+
+### Changed
+
+- Simplified Icon playground to a single `fig-icon` example driven by the attributes panel.
+- Synced figui3 Color section demos from propkit source.
+- Reduced `fig-3d-rotate` face paint cost by replacing shadows with borders.
+
+## [6.12.0]
+
+### Added
+
+- Added gradient stop reordering in `fig-fill-picker` via `fig-reorder`.
+- Added shared boolean attribute helpers so `attr="false"` is treated as unset across core and lab components.
+- Added CSS tokens for `--figma-color-bg-active`, `--font-size-small`, `--line-height`, `--spacer-half`, `--transition-duration`, `--transition-timing-function`, and `--control-height`.
+- Added browser tests for gradient stop reorder color persistence and audit regressions.
+
+### Changed
+
+- Changed `fig-reorder` to show the grabbing cursor on pointer down, move the item on mouse up, highlight the dragged item with selected background, and raise the drop indicator above fill-picker dialogs.
+- Changed `fig-input-text` and `fig-input-number` to share the same intrinsic default width as `fig-input-color`, and to fill horizontal `fig-field` input columns.
+- Changed presence-style CSS attribute selectors (`icon`, `full`, `open`, `borderless`, `autoresize`, `multiline`, `resizable`, and related) to ignore `"false"`.
+- Styled native `fig-dropdown` option rows for Chromium webviews so popup menus stay readable.
+- Imported `fig-lab` from `fig-editor` so fill-picker reorder works without a lazy-load race.
+
+### Fixed
+
+- Fixed gradient stop color edits so they persist through reorder after `fig-input-color` disconnect/reconnect.
+- Fixed `fig-input-color` hex text display to strip the leading `#`.
+- Fixed parent `disabled` handling for tabs and segments so already-disabled children are not incorrectly cleared.
+
+## [6.11.0]
+
+### Added
+
+- Added `fig-reorder` lab component for drag-reordering direct children, with optional handle selector, axis control, and `reorder` event.
+- Added `size` attribute to `fig-input-gradient`; passes through to the internal `fig-swatch`.
+- Added playground attributes support for `fig-reorder` and `fig-input-gradient` size.
+- Added playground event logging for `reorder` events.
+- Added browser tests and lab fixture coverage for `fig-reorder`.
+
+### Changed
+
+- Moved fill picker gradient color interpolation controls below stops with an updated header and label.
+- Updated oscillator amplitude and frequency handles to show axis-specific drag cursors while dragging.
+- Adjusted `fig-header` spacing when a leading `fig-dropdown` is present.
+
+## [6.10.0]
+
+### Added
+
+- Added `elastic` and `size` attributes to `fig-field-slider`.
+- Added `compact` styling for `fig-header` and `fig-group`.
+- Reworked `fig-input-oscillator` wave rows into collapsible `fig-group` sections with per-row add and remove controls.
+
+### Changed
+
+- Changed `fig-input-oscillator` parameter fields to use `fig-field-slider`.
+- Changed oscillator add-form control to an inline header action that inserts a waveform after the current row.
+- Updated oscillator and field-slider playground attribute panels.
+
+### Fixed
+
+- Fixed `fig-field-slider` drag lock when used inside `fig-input-oscillator`.
+- Fixed duplicate waveform insertion when choosing a type from the add-form menu.
+- Fixed add-form and remove controls toggling wave group collapse.
+
+## [6.9.9]
+
+### Fixed
+
+- Fixed `fig-field-slider` elastic pull so repeated drags keep tracking reliably.
+
+### Changed
+
+- Changed `fig-field-slider` elastic pull to use scale-based stretching with a springier return and slightly longer pull distance.
+
+## [6.9.8]
+
+### Changed
+
+- Changed media caption child support and generated captions to use native `figcaption` instead of `caption`.
+
+## [6.9.7]
+
+### Added
+
+- Added caption support for `fig-media`, `fig-image`, and `fig-video`.
+- Added blank caption fields to the PropKit and FigUI3 attributes panels for media examples.
+
+### Changed
+
+- Refined text wrapping defaults and footer action wrapping.
+
+## [6.9.6]
+
+### Fixed
+
+- Fixed `fig-media` generated controls so duplicate `fig-media-controls` rows are reused and cleaned up.
+- Fixed `fig-tab-content` block layout styling.
+
+### Added
+
+- Added composable oscillator controls.
+
+## [6.9.5]
+
+### Fixed
+
+- Fixed `fig-joystick` rotated side axis labels sitting too far from the edge.
+
+## [6.9.4]
+
+### Fixed
+
+- Fixed `fig-field-slider` handle edge positioning across range, delta, hue, opacity, and stepper variants.
+- Fixed `fig-field-slider` right-click reset menu positioning.
+- Fixed full-width layout behavior for `fig-header`, `fig-group`, and `fig-content`.
+
+### Changed
+
+- Added `fig-field-slider` reset-to-default interactions and elastic edge feedback.
+- Added context menu support for `fig-menu` and documented programmatic `showAt(x, y)` usage.
+- Added support for custom `fig-field-slider` labels and inline SVG content inside `fig-icon`.
+- Refined hue and opacity field slider visual fades.
+
+## [6.9.3]
+
+### Changed
+
+- Refined PropKit playground example alignment.
+
+## [6.9.2]
+
+### Changed
+
+- Documented the `sticky` attribute for `fig-footer`.
+- Updated playground layout spacing for FigUI3 examples.
+
+## [6.9.1]
+
+### Fixed
+
+- Fixed paragraph/list text defaults so plugin content uses secondary text color consistently.
+- Fixed the PropKit plugin alt demo width to better match the embedded panel.
+
+### Changed
+
+- Updated FigUI3 agent guidance to preserve existing dev/playground servers during checks.
+
+## [6.9.0]
+
+### Fixed
+
+- Fixed cross-browser media preview sizing so `fig-image`, `fig-media`, `fig-video`, and `fig-preview` fill their preview surface consistently in Safari and Chrome.
+- Fixed `fig-easing-curve` handle positioning in Safari by avoiding absolute-positioned `fig-handle` children inside SVG `foreignObject` handles.
+- Fixed `fig-input-fill` and `fig-input-color` value cells so solid, gradient, image, and color inputs size and truncate consistently.
+- Fixed fill picker header overflow caused by the color gamut selector and close button layout.
+- Fixed segmented control icon alignment by centering segment contents with flex layout.
+- Fixed horizontal chooser gradient previews from collapsing by preserving a minimum choice and gradient width.
+
+### Changed
+
+- Styled native `<progress>` controls to match FigUI slider tracks, including determinate and indeterminate states.
+- Updated paragraph and content defaults for more predictable text rhythm in plugin layouts.
+- Updated playground video examples to use a larger randomized demo video pool.
+
+## [6.8.8]
+
+### Changed
+
+- Added default section and fieldset padding for plugin content layout.
+- Updated the PropKit iframe demo with a canvas gradient preview.
+
+## [6.8.7]
+
+### Fixed
+
+- Fixed `fig-chooser` selection scrolling so clicked and keyboard-selected choices center reliably after layout or size changes.
+
+## [6.8.6]
+
+### Fixed
+
+- Fixed `fig-joystick` X/Y number fields not syncing when dragging the handle or clicking the plane.
+
+### Changed
+
+- `fig-header` height now uses a `--fig-header-height` custom property; reset `fig-group` header `h3` margin.
+
+## [6.8.5]
+
+### Fixed
+
+- Fixed `fig-tabs` overflow controls to stay pinned while focused tabs scroll into view.
+- Fixed overflow control activation to use click handling instead of pointer-down handling.
+
+### Changed
+
+- Updated `fig-tabs` and `fig-chooser` overflow spacing.
+- Updated Tabs playground examples to show tab content source while keeping child controls out of Attributes View.
+
+## [6.8.4]
+
+### Fixed
+
+- Fixed dialog `fig-content` sizing so content areas can flex and scroll correctly.
+
+## [6.8.3]
+
+### Fixed
+
+- Fixed resizable dialogs forcing a `12rem` minimum width.
+
+## [6.8.2]
+
+### Fixed
+
+- Fixed dialog and popup max width so narrow viewports respect available space.
+
+### Changed
+
+- Restored the PropKit iframe demo header to the standard bordered style.
+
+## [6.8.1]
+
+### Fixed
+
+- Fixed the PropKit iframe demo header to render borderless.
+
+### Changed
+
+- Refined `fig-content` spacing for grouped content layouts.
+
+## [6.8.0]
+
+### Fixed
+
+- Fixed `fig-field` setup so labels inserted after connection get focus/toggle behavior and overflow tooltips.
+
+### Changed
+
+- Updated `fig-spinner` to use encoded icon masks, with small-size mask support.
+- Updated playground controls and PropKit examples for field labels, chooser grid layout, and footer working states.
+
+### Added
+
+- Added `size="small"` support for `fig-spinner`.
+- Added Playwright coverage for dynamic `fig-field` label tooltip behavior.
+
+## [6.7.4]
+
+### Fixed
+
+- Fixed `fig-slider` text inputs not updating the range value after listener binding moved ahead of number input lookup.
+
+### Added
+
+- Added Playwright coverage for `fig-slider` text input and range value synchronization.
+
+## [6.7.3]
+
+### Fixed
+
+- Fixed `fig-tabs` and `fig-chooser` overflow controls so options remain direct light-DOM children for React-safe rendering.
+- Fixed `fig-chooser` start overflow buttons showing before the user scrolls in initially-overflowed examples.
+- Fixed horizontal `fig-chooser` choices shrinking and visually losing gaps in compact color chooser examples.
+- Fixed chooser playground controls so `Columns` only appears for grid layout and chooser overflow/max-size controls appear consistently.
+- Fixed vulnerable dev dependency lockfile entries for Vite, PostCSS, Picomatch, and Brace Expansion.
+
+### Changed
+
+- Updated chooser playground examples with more palette and gradient presets.
+
+## [6.7.2]
+
+### Fixed
+
+- Fixed `fig-header` ghost icon button negative margin applying to clear buttons inside `fig-input-text`.
+
+## [6.7.1]
+
+### Fixed
+
+- Fixed `fig-tooltip` staying open when the pointer leaves the window or document.
+- Fixed `fig-tooltip` staying open when the pointer leaves an iframe: dismisses on `frameElement` mouseleave, `figui:dismiss-tooltips` postMessage from parent `fig-dialog` iframes, and document exit listeners.
+
+### Added
+
+- Added Playwright coverage for tooltip dismiss on document and iframe exit.
+
+## [6.7.0]
+
+### Fixed
+
+- Fixed `fig-tooltip` warmup so hopping between tooltips after one is shown is instant again: warmup now lasts 1s after show/hide, includes open/recently-hidden tooltips, and warm hops show synchronously.
+
+### Changed
+
+- `fig-footer` switches to a vertical layout when there are multiple actions (including tooltip-wrapped buttons).
+- `fig-footer` centers label-only footers with no buttons.
+- Playground footer examples: split long-label variants into separate examples and removed the long-label attributes toggle.
+
+### Added
+
+- Playground footer examples: **Waiting**, **Long label**, **Long label/many actions** (with disabled-button tooltips), and **Lots of things**.
+- `fig-footer` `.fig-footer-action` wrapper pattern for tooltips on disabled buttons.
+
+## [6.6.6]
+
+### Fixed
+
+- Fixed `fig-tooltip` hover tooltips not dismissing when the host uses `display: contents` (e.g. character grid tiles) by binding pointer events to the trigger child instead of the tooltip element.
+- Fixed multiple hover tooltips stacking open at once — only one hover tooltip is shown at a time.
+- Fixed `fig-tooltip` `delay` being ignored when moving between tiles; warmup now applies only when re-hovering the same tooltip, and the popup is created after the delay elapses.
+- Fixed popover tooltips not fully closing on destroy by calling `hidePopup()` before removal.
+
+### Added
+
+- Added playground **Plugin (alt)** example with a static character-finder iframe demo (`plugin-alt.html`).
+- Added Playwright coverage for tooltip delay and `display: contents` hover dismissal.
+
+## [6.6.5]
+
+### Fixed
+
+- Fixed `fig-popup` tooltips not repositioning when shown via the Popover API (`:popover-open` without `:open`).
+- Fixed tooltips stuck at the viewport top edge by flipping below the anchor when top placement overflows.
+- Fixed missing tooltip beaks after edge flip by no longer auto-hiding the pointer when alignment is imperfect.
+- Fixed tooltip popups inflating iframe/plugin autoresize by portaling them into a zero-size `[data-figui-overlay-root]` container.
+
+### Changed
+
+- Updated playground `iframe.html` to load local `/fig.js` + `/fig.css` and include a search `fig-header` example.
+
+### Added
+
+- Added Playwright coverage for popover tooltips, top-edge flip, and bottom beak visibility.
+
+## [6.6.4]
+
+### Fixed
+
+- Fixed `fig-popup` tooltip/popover positioning at viewport edges: anchor-aware clamping keeps the beak on the anchor when possible, uses `visualViewport` bounds, prefers better placements when center overflows, and hides the pointer when alignment is impossible.
+
+### Added
+
+- Added Playwright coverage for edge-anchored tooltip beak alignment.
+
+## [6.6.3]
+
+### Fixed
+
+- Fixed `fig-header` layout when it contains only a `fig-input-text` by applying negative side margins to align with header padding.
+- Removed inherited text color from `fig-popup` tooltips so content uses its own color tokens.
+
+## [6.6.2]
+
+### Fixed
+
+- Fixed `fig-input-text` search clear icon missing after reconnect by using `fig-icon name="close"` instead of imperative `--icon` styling.
+- Fixed framework remount/reconnect bugs across inputs and controls: skip redundant `innerHTML` rebuilds, guard duplicate DOM wiring, and repair generated affordances on reconnect.
+- Fixed `fig-dropdown` duplicating its internal `<select>` when reconnected.
+- Fixed `fig-slider`, `fig-options`, `fig-combo-input`, `fig-input-color`, `fig-origin-grid`, `fig-joystick`, and `fig-3d-rotate` rebuilding duplicate markup or leaking listeners on reconnect.
+- Fixed `fig-button` re-rendering shadow DOM and duplicating click listeners on every reconnect.
+- Added `figNextFrame()` guards so deferred `connectedCallback` work is skipped after disconnect.
+
+### Added
+
+- Added reconnect resilience Playwright coverage for search clear, password toggle, dropdown, slider, options, combo input, color input, origin grid, and joystick.
+
+## [6.6.1]
+
+### Fixed
+
+- Fixed `fig-tabs` so user tab selection emits `input` and `change` events for event output and integrations.
+
+## [6.6.0]
+
+### Added
+
+- Added `columns` support for `fig-chooser layout="grid"` to control grid column count.
+
+### Changed
+
+- Updated the `/figui3` chooser grid example to use 10 full-width random image choices.
+
+### Fixed
+
+- Fixed explicit aspect-ratio media previews so `fig-image full aspect-ratio="1/1"` can render square in narrow grid cells.
+
+## [6.5.1]
+
+### Changed
+
+
+## [6.5.0]
+
+### Added
+
+- Added shared `.fig-overflow` button styling for scroll overflow controls.
+- Added examples for tab overflow plus header accessory text and search header patterns.
+
+### Changed
+
+- Changed `fig-chooser` overflow buttons from sticky in-flow controls to absolute light-DOM overlays.
+- Changed overflowing `fig-tabs` so selecting a tab centers it in the scroll view like `fig-chooser`.
+
+### Fixed
+
+- Fixed `fig-chooser` rebuilds via `innerHTML` so the light-DOM overflow buttons are restored after app code replaces choices.
+- Fixed overflowing `fig-tabs` so they expose start/end overflow buttons without moving the page.
+
+## [6.4.8]
+
+### Fixed
+
+- Fixed `fig-input-text` and multiline textarea focus styling so inner native controls suppress their own ring and the host draws the shared focus outline.
+
+## [6.4.7]
+
+### Added
+
+- Added focused Playwright accessibility coverage for media, form primitives, selection controls, overlays, loading indicators, display swatches, handles, color tips, layers, and toast live regions.
+- Added an axe-powered accessibility smoke suite covering representative form, selection, media, overlay, and loading fixtures.
+- Added regression coverage for combo input labels, fill picker controls, keyboard handles, overlay focus restoration, slider defaults, segmented focus movement, palette expansion, group semantics, image overlays, joystick/origin-grid handles, and skeleton tab suppression.
+- Added performance test scaffolding, budgets, and `npm run test:perf` / `npm run test:all` commands for render and runtime checks.
+- Added `fig-toast` and `fig-layer` registration/coverage in the main component contract flow.
+- Added a playground "Multiple radios" example to show independent, non-grouped radio tab behavior.
+
+### Changed
+
+- Reworked `fig-media`, `fig-image`, and `fig-video` so generated media is contained in `fig-preview` and generated video controls attach below the preview instead of overlaying the media surface.
+- Improved accessible names, ARIA state sync, disabled behavior, and keyboard support across buttons, combo inputs, dropdowns, checkboxes, radios, switches, text inputs, number inputs, fields, sliders, color inputs, fill inputs, fill pickers, tabs, segmented controls, menus, dialogs, popups, toasts, chits, handles, color tips, joystick, origin grid, easing curves, spinners, shimmers, skeletons, and layers.
+- Updated shared focus styling with a stronger `--figma-focus-outline`, component-specific offsets, and the new inheritable `--figma-focus-outline-radius` token.
+- Updated `fig-slider type="range"` so an omitted `value` defaults to the midpoint of `min` and `max`, matching native range behavior.
+- Updated media and image custom overlays to use light-DOM `slot="overlay"` placement instead of reparenting child nodes, preserving framework ownership.
+- Documented accessibility coverage, media preview composition, keyboard patterns, loading semantics, fill/media naming guidance, overlay slots, focus tokens, and verification commands in the README, changelog, contributing guide, and playground component descriptions.
+
+### Fixed
+
+- Fixed `fig-button type="select"` and combo-input select affordances so native controls keep accessible labels while the wrapper shows the correct focus state and opens the picker on keyboard activation.
+- Fixed `fig-fill-picker` icon-only buttons, generated dropdowns, swatches, gradient controls, and media controls so they expose usable labels and keyboard states.
+- Fixed keyboard movement and focus retention for `fig-handle`, `fig-easing-curve`, `fig-joystick`, and `fig-origin-grid`.
+- Fixed focus return for dialogs, popups, and tooltips after Escape or close interactions.
+- Fixed focus outlines for tabs, segments, palette rows, groups, handles, switches, checkboxes, radios, composite color/fill fields, and lab sliders.
+- Fixed `fig-input-palette` so the collapsed palette has one tab stop, expands on Enter/Space, and suppresses chunky nested swatch outlines.
+- Fixed `fig-input-gradient` focus behavior so editable gradients tab to the first stop handle, static gradients focus the host, and picker gradients open the fill picker from Enter/Space.
+- Fixed `fig-group` headers so collapsible groups expose `role`, `aria-expanded`, keyboard toggle behavior, and the shared focus outline.
+- Fixed `fig-image` custom overlay controls so they stay over the preview and remain visible during hover, focus, and active interaction.
+- Fixed `fig-skeleton` so descendant placeholder controls are inert and skipped by Tab.
+- Fixed generated icon-only media/file controls and dialog close controls so they expose accessible names.
+- Fixed generated media upload overlays to remain keyboard reachable while preserving the visible preview surface.
+
+## [6.4.0]
+
+### Added
+
+
+### Changed
+
+- Refined default slider tick sizing.
+
+## [6.3.0]
+
+### Added
+
+- Added Playwright component contract tests covering every `fig.js` web component.
+- Added a playground `/tests` route with visual fixtures generated from the shared component manifest.
+- Added project testing skills for web component and CSS validation.
+
+## [6.2.0]
+
+### Added
+
+
+### Changed
+
+
+### Fixed
+
+
+## [6.1.1]
+
+### Fixed
+
+- Origin grid overflow handles now keep their icon-only treatment.
+
+## [6.1.0]
+
+### Added
+
+
+### Changed
+
+- Refined lab field slider styling.
+
+## [6.0.0]
+
+### Breaking
+
+- `fig-handle` now uses `tip="color"`, `tip="add"`, or `tip="remove"` for persistent color tips. The old handle `color-tip` and `control` attributes were removed.
+
+### Added
+
+- `fig-input-gradient` now supports `mode="handle"` and `mode="tip"` for color stop handle presentation.
+
+### Changed
+
+- `fig-input-gradient` now defaults to `mode="handle"`; use `mode="tip"` for persistent color tips on gradient stops.
+- Refined `fig-input-gradient` handle sizing, border radius, and ghost handle stacking.
+- Disabled `fig-handle`s now render without elevation.
+
+## [5.1.1]
+
+### Fixed
+
+- Restored classic script compatibility by removing module syntax from the built `fig.js` output.
+- Restored direct `fig-slider.value` reads for consumers using the host element property.
+
+## [5.1.0]
+
+### Added
+
+- `fig-input-text type="search"` now adds a search icon and clear action.
+- `fig-input-text type="password"` now adds a show/hide password toggle.
+- Added visible and hidden icon tokens for medium and small `fig-icon` sizes.
+- `fig-fill-picker` image and video tabs now include rotate actions.
+
+### Changed
+
+- Refined `fig-fill-picker` media preview spacing and webcam capture layout.
+- Updated `fig-field` examples and lab styles to use the default horizontal layout.
+- Improved secondary and input button hover/pressed states.
+- Refined easing editor, slider defaults, canvas handles, and layer label styling.
+
+### Fixed
+
+- `fig-fill-picker` webcam captures now preview correctly and use blob URLs.
+- `fig-media` now clears uploaded file previews cleanly.
+
+## [5.0.0]
+
+### Breaking
+
+- `fig-fill-picker` is now optional. Import `fig-editor.js` and `fig-editor.css` to register and style the full picker dialog.
+- `fig-input-color` no longer supports the `picker` attribute. It opens `fig-fill-picker` automatically when registered, otherwise it uses the native color input.
+- `picker-anchor` was removed. Picker popups anchor to the component that opens them.
+
+### Added
+
+- New package exports: `@rogieking/figui3/fig-editor.js` and `@rogieking/figui3/fig-editor.css`.
+- `fig-input-color`, `fig-input-fill`, `fig-input-gradient`, `fig-handle type="color"`, and `fig-color-tip` now check for `fig-fill-picker` at interaction time.
+
+### Changed
+
+- `fig.js` and `components.css` no longer include the full fill picker by default.
+- `fig-slider` now uses the compact modern appearance by default; use `variant="classic"` for the previous appearance.
+- `fig-slider` now shows its text input by default; use `text="false"` for compact slider-only controls.
+- `picker-*` attributes are still forwarded to `fig-fill-picker` when the optional picker is registered.
+- `fig-input-gradient edit="picker"` falls back to inline gradient editing when `fig-fill-picker` is unavailable.
+- `fig-handle type="color"` falls back to the native color picker when `fig-fill-picker` is unavailable.
+- `fig-input-color` now shows alpha/opacity controls by default; use `alpha="false"` to hide them.
+- `fig-color-tip` now preserves opacity from bare 4- and 8-digit hex values such as `CB0FFF5E`.
+- Playground imports the optional picker files explicitly and no longer uses removed `picker` or `picker-anchor` attributes.
+
+## [4.15.10]
+
+### Added
+
+- PropKit Controls in dialogs: added an All Fields example with every field control using default `fig-field` layout.
+
+### Changed
+
+- PropKit Attributes view uses `columns="2/5"` for attribute rows.
+- Playground sidebars use narrower nav and attributes widths.
+- `fig-handle`: default and color handles use clearer custom-property-driven styling.
+- `fig-media`/`fig-image` upload overlays are constrained to the preview width.
+
+## [4.15.9]
+
+### Changed
+
+- `fig-handle type="color"` closes its color picker when dragging starts and uses an 8px popup offset.
+
+### Fixed
+
+- `fig-fill-picker`: internal color-area handles no longer open nested color pickers.
+
+## [4.15.8]
+
+### Changed
+
+- PropKit Design Token Editor keeps the standard 300px dialog width while using default horizontal field columns.
+- `fig-footer` vertical padding now uses `--spacer-2-5`.
+
+## [4.15.7]
+
+### Changed
+
+- PropKit Animated Melty Gif dialog footer now uses the waiting-for-selection layout with an upload prompt before enabling placement.
+- `fig-footer` spacing now better supports label-driven action bars.
+
+## [4.15.6]
+
+### Changed
+
+- PropKit header and footer container examples now focus on default usage, with footer states for waiting on selection and applying to a selection.
+- PropKit footer labels and actions now lay out cleanly with primary buttons pinned to the right.
+
+### Fixed
+
+- PropKit Attributes view now shows `fig-footer` attributes directly instead of field attributes when editing standalone footers.
+- PropKit header attribute control now labels the header action toggle as "Button".
+
+## [4.15.5]
+
+### Added
+
+- `fig-preview`: styled visual preview layer for arbitrary content such as images, canvas, SVG, and generated previews.
+- PropKit container examples for `fig-content`, `fig-header`, and `fig-footer`.
+- PropKit Animated Melty Gif dialog includes a collapsible "About this tool" section.
+
+### Changed
+
+- `fig-fill-picker`: image and video tabs now use `fig-image` and `fig-media` upload components, keeping preview behavior consistent with the rest of FigUI.
+- `hstack`: vertically centers items by default and supports `align` overrides.
+- PropKit Preview canvas example now shows a shader-style preview.
+- PropKit plugin iframe More Info group is collapsed by default.
+
+### Fixed
+
+- `fig-handle`: percentage values now remain responsive instead of being converted to fixed pixels, keeping gradient handles aligned when containers resize.
+- `fig-fill-picker`: gradient stop handles refresh correctly when switching into the Gradient tab from another fill type.
+
+## [4.15.4]
+
+### Added
+
+- PropKit button examples with labeled and unlabeled action rows.
+- `fig-field`: `columns="2/5"` layout ratio for compact dialog rows.
+- Checkerboard sizing tokens for chits, sliders, and handles.
+
+### Changed
+
+- PropKit dialog examples use 300px dialogs and half-column internal fields, with the design token editor using `columns="2/5"`.
+- `fig-input-palette`: expanded color rows always show alpha controls, and palette fields get tighter layout behavior inside `fig-field`.
+- Attribute panel label for `checkerboard` is now "Checkered".
+- PropKit plugin iframe More Info copy now uses short instructional paragraphs.
+- Opacity slider and handle checkerboards use component-specific checkerboard sizing.
+
+## [4.15.3]
+
+### Added
+
+- `fig-handle`: `color-tip` attribute restores the compact color-tip interaction when needed.
+
+### Changed
+
+- `fig-handle type="color"` now opens the solid fill picker directly by default while preserving `{ color, opacity }` input/change events.
+- `fig-input-gradient`: color stop handles opt into `color-tip` to keep the compact gradient-stop editing workflow.
+- `fig-menu`: popup placement happens before reveal and arrow-key navigation works from the trigger.
+- `fig-input-color`: tab flow skips nested swatch color inputs when a text input is present.
+- `fig-input-palette`: inline swatches are passive previews; clicking the inline strip or add button expands the palette; remove buttons include "Remove color" tooltips.
+
+### Fixed
+
+- `fig-input-palette`: remove buttons re-enable after adding colors back above the minimum.
+- `fig-color-tip`: compact tip positioning is anchored correctly for non-drag color handles.
+
+## [4.15.2]
+
+### Fixed
+
+- `fig-menu`: reopening after dismiss (outside click, Escape) works again — `fig-popup` now calls native `dialog.close()` via `:open` so the menu `open` state stays in sync; trigger ignores stale `open` when the popup is not showing.
+
+## [4.15.1]
+
+### Changed
+
+- Propkit plugin iframe demo loads FigUI from `unpkg.com/@rogieking/figui3@latest` again (was local `/fig.css` and `/fig.js`).
+
+## [4.15.0]
+
+### Added
+
+- `fig-icon` component — masked icons via `name`; `size="small"` (1rem) or `medium` (1.5rem, default); `color` sets fill via `background-color` (Figma icon tokens).
+
+### Changed
+
+- **Breaking:** Icon design tokens renamed by artboard size: `--icon-16-*` (16×16) and `--icon-24-*` (24×24). Update custom CSS from e.g. `var(--icon-close)` to `var(--icon-24-close)`.
+- Library internals: `fig-mask-icon` spans replaced with `<fig-icon>` (dialog close, palette add/remove, fill picker, easing curve, chooser nav, media controls, etc.). Legacy `.fig-mask-icon` CSS still supported.
+- `fig-handle`: no longer auto-sets `type="canvas"` when `type` is omitted (default is the base brand dot handle).
+
+## [4.14.1]
+
+### Changed
+
+- `:root.figma-light` / `:root.figma-dark`: set `color-scheme` and `background-color` from `--figma-color-bg`.
+- `fig-dialog`: `--dialog-radius` token; child `iframe` uses matching bottom corner radius.
+
+## [4.14.0]
+
+### Added
+
+- `fig-input-palette` `fixed` attribute — when present or `fixed="true"`, palette length is locked (no add or remove buttons). Expanded rows show alpha controls when fixed.
+
+### Changed
+
+- `fig-input-palette`: replaced `add` with `fixed` (breaking: use `fixed` instead of `add="false"` for preset palettes).
+- `fig-input-palette`: color swatches use the native color picker instead of `fig-fill-picker`.
+- `fig-chit`: checkerboard layer uses new `--checkerboard-chit` token (14px tiles); `fig-handle` color swatch checkerboard matches.
+
+### Fixed
+
+- `fig-input-palette`: inline chit strip layout — nested `fig-chit` styles, swatch dividers, and full-width strip when `fixed`.
+- `fig-combo-input`: joined-border radius rules no longer apply to nested `fig-chit`.
+
+## [4.13.1]
+
+### Added
+
+- `fig-canvas-control` radius ring: new white halo outer circle painted behind the brand-colored radius circle (sandwiched between `.fig-canvas-control-radius-hit` and the brand circle). Both halo and brand strokes thicken to `--fig-canvas-control-line-stroke-width-hover` on hover/active so hover and active drag look identical.
+- `--fig-canvas-control-radius-stroke` / `--fig-canvas-control-radius-stroke-halo` CSS vars to override radius ring colors.
+
+### Changed
+
+- `fig-canvas-control` radius ring default stroke now `--figma-color-border-brand` (was a translucent white).
+- `fig-canvas-control` `type="point-radius-angle"` during radius drag: the angle handle (and its hit-area) is now `pointer-events: none` so the body's rotation/resize cursor wins and the angle tooltip cannot show. Restored on pointer up.
+- `fig-color-tip` popup nudged up another 2px (from `bottom: calc(100% + 6px)` to `+ 8px`) for breathing room above the handle.
+
+### Fixed
+
+- `fig-canvas-control` radius drag: angle tooltip no longer leaks in if the cursor passes over the angle handle mid-drag. Hover guard now also returns early when `#isRadiusDragging` is true, and the tooltip is force-hidden at the start of radius drag.
+
+### Added
+
+- `fig-canvas-control`: hover tooltips for all handles (point, angle, second, radius). Tooltip appears on `pointerenter` and hides on `pointerleave`, gated by drag state so it never flickers during interaction.
+- `fig-canvas-control` radius: the radius tooltip now follows the cursor via a virtual anchor (during both hover and drag) and is nudged 8px above the cursor.
+- `fig-canvas-control` `type="point-point"`: the connecting line is now draggable. A 12px transparent hit-line under the visible line uses `cursor: move` and translates both points by the same delta, clamped so both endpoints stay within `[0%, 100%]`. Emits a single `input`/`change` cycle.
+- `fig-canvas-control` `type="color"`: hover tooltip now shown (previously suppressed). Auto-hides when the color picker (`fig-color-tip`) opens via a MutationObserver on the handle, and re-enables when it closes.
+- `fig-popup` `set anchor`: now accepts any object with a `getBoundingClientRect()` method (virtual anchor), not just `Element` instances. Anchor-dependent code paths (`classList`, `contains`, ResizeObserver) are guarded so virtual anchors work safely.
+
+### Changed
+
+- `fig-canvas-control`: all handle tooltips (point, angle, second, point-point line drag) are now hidden during drag rather than shown. Hover guards also check drag state so tooltips can't be re-shown mid-drag from a stray `pointerenter`.
+- `fig-handle[type="color"]` `fig-color-tip`: nudged the picker popover up by 4px (from `bottom: calc(100% + 2px)` to `+ 6px`).
+- Propkit dialogs (Rename, Shadow, Progressive Blur, Photo Stack, Export Settings, Design Token Editor, Prepress, Animated Melty Gif): dialog body content is now wrapped in `<fig-content>` so the scroll region and `fig-footer` placement matches the recommended structure. The Plugin dialog (which hosts an iframe) is intentionally left alone.
+- Lab Color canvas example: `name` changed from "Position" to "Click to edit color".
+
+### Fixed
+
+- `fig-chooser` `layout="grid"`: the start nav button no longer shows up at the top when scrolled to the start. In grid mode the sticky `position: sticky` + negative-margin chevron trick used by flex layouts didn't collapse, so the nav buttons took real grid rows and pushed `scrollTop` to a non-zero value at "start". Grid mode now skips creating nav buttons entirely (and CSS hides them as a safety belt); use `overflow="scrollbar"` for native scrolling when grid content overflows.
+- `fig-chooser` `#syncOverflow`: added a `scrollable` guard so `overflow-start` / `overflow-end` classes are only applied when the chooser actually has overflow beyond a 2px threshold. Prevents spurious nav buttons when content fits exactly.
+- `fig-chooser`: `layout` is now an observed attribute; switching layout at runtime re-applies overflow mode and re-syncs nav button visibility immediately.
+
+### Changed
+
+- `fig-chooser` `layout="grid"`: now uses `column-gap` + `row-gap` (both `--fig-chooser-gap`) with `fig-choice { margin: 0 !important }` so choices flow naturally into a 2-column grid without doubled spacing from the base flex `margin-block-end`.
+
+### Fixed
+
+- `select > button` (customized select closed-state button): switched from `display: inline-block` (which silently ignored `align-items`/`justify-content`) to `display: inline-flex` with `justify-content: flex-start` so children align left and vertically center as intended.
+- `select`: removed the now-unneeded `&:has(> button) { padding-left: 0 }` override since the flex button already controls its own inner padding.
+
+## [4.12.0]
+
+### Added
+
+- `fig-chooser` nav buttons now render an explicit `.fig-mask-icon.fig-chooser-nav-chevron` span (using `--icon: var(--icon-chevron)` and `--size: 1rem`) instead of a CSS `::after` pseudo-element. Rotation is still handled by class-scoped CSS (180° for nav-start, ±90° for horizontal layout).
+- `fig-chooser` nav buttons: `box-shadow` border edge switched from `--figma-color-border` to `--figma-color-bordertranslucent` for a softer divider.
+
+### Changed
+
+- `fig-chooser`: removed the `padding` attribute entirely (was `padding="false"` to drop internal padding). The chooser no longer reads or styles a `padding` attribute; use `--fig-chooser-gap` and `fig-choice` padding controls instead. `fig-choice`'s own `padding` attribute is unchanged.
+- Propkit Chooser examples (Text, Images, Images + Labels, Colors, Palettes, Gradients): the wrapping `fig-field` now defaults to `direction="vertical"` so the chooser gets full panel width.
+- Propkit Chooser Text + Images + Labels examples: every `fig-choice` now has `padding` set so the selection ring frames the content with breathing room.
+
+### Removed
+
+- `fig-chooser` `padding` from `observedAttributes`, the `&[padding="false"]` CSS block, the playground attributes rule, and the README attributes table row.
+
+### Added
+
+- `fig-media`, `fig-image`, `fig-video`: new `size` attribute (`small` = 2rem, `medium` = 4rem, `large` = 6rem) for quick fixed-size media tiles. Exposes a `--fig-media-size` CSS var that drives both `max-width` and `max-height`.
+- `fig-handle`: new `type="canvas"` variant (used by `fig-canvas-control` for angle/second/non-color handles). Handles now default to `type="canvas"` when no type is set, and the canvas variant renders the `::after` indicator like `type="color"`.
+- Playground attributes panel: `type` enum (default/color/canvas) added for `fig-handle`.
+
+### Changed
+
+- `fig-chooser`: initial scroll-to-selected is now reliable. After connect, the chooser waits for any child `<img>`/`<video>` media to load (or error) and then re-centers the selected choice without animation, so the first paint already lands on the right item. `#scrollToChoice` now measures via `getBoundingClientRect` instead of `offsetTop/Left`, so nested transforms and shadow layouts no longer offset the math.
+- `fig-chooser` nav buttons: replaced the linear-gradient fades with solid `var(--figma-color-bg)` backgrounds + a 1px `box-shadow` border on the leading/trailing edge (top/bottom for vertical, left/right for horizontal). No more hover-only border flash.
+- `fig-lab` `fig-canvas-control`: angle, second-point, and non-color handles now explicitly set `type="canvas"` so they pick up the new shared styling.
+- Propkit Chooser "Style" example: switched the inline `fig-image` tiles from `size="auto"` to `size="small"` for a tighter, consistent thumbnail row.
+
+### Fixed
+
+- `components.css`: invalid `gap: var(--spacer-1),0.25rem;` on `fig-select > button` (stray comma + extra value) reverted to `gap: var(--spacer-1);`.
+- `fig-select`: closed-state padding now reserves room for the chevron (`0 var(--spacer-4) 0 var(--spacer-2)`) so long values no longer collide with the icon.
+- `fig-select` customized-button with a leading `<svg>`: icon now hangs into the left padding via negative `margin-left` instead of removing the padding, keeping text alignment consistent across icon/no-icon buttons.
+
+## [4.10.2]
+
+### Added
+
+- `/propkit` Chooser: new "Gradients" example showcasing four distinct gradient styles (Sunset Glow, Aurora, Bubblegum hard-stops, Holographic 5-stop iridescence) using `fig-input-gradient` with `edit="false"` and `disabled`.
+
+## [4.10.1]
+
+### Added
+
+- `fig-media-controls`: bidirectional sync with parent `fig-media`/`fig-video` is now robust during scrubbing — uses a pending-seek guard so the slider doesn't snap back while the browser settles on a seek target. Adds a `seeked` listener so loop restarts immediately reset the scrubber to 0.
+- Native `<select multiple>` example in the `/figui3` Native elements group.
+- Checkbox group + disabled checkbox examples in `/figui3`.
+- Attribute rules: `checked` switch added to the Attributes panel for `fig-checkbox` and `fig-radio`.
+
+### Changed
+
+- `fig-media-controls`: slider updates are now applied via `setAttribute("value", …)` so `FigSlider`'s interacting-guard keeps the user's drag stable.
+
+### Fixed
+
+- Playground description rendering: section/example names containing HTML-like tokens (e.g. `<select>`) are now escaped before being injected via `dangerouslySetInnerHTML`, preventing a stray native `<select>` from appearing inside the description paragraph.
+
+## [4.10.0]
+
+### Added
+
+- `<fig-media-controls>`: new standalone playback controls element. Renders a play/pause button (with `--icon-play`/`--icon-pause` mask icons), a `fig-slider` scrubber, and a `MM:SS` time display. Holds its own state via `playing` (boolean presence), `duration`, and `time` (number, seconds) attributes/properties. Emits `play`, `pause`, and `seek` events. Supports an `overlay` attribute to render as a bottom overlay over media.
+- `--icon-play` and `--icon-pause` design tokens (matching the `data:image/svg+xml` URL format used by the other `--icon-*` tokens).
+
+### Changed
+
+- `fig-media`/`fig-video`: native `<video controls>` chrome is now always suppressed. When the host's `controls` attribute is enabled (or a user places a `<fig-media-controls>` child), the host wires it up bidirectionally — video → controls for `playing`/`duration`/`time`/`seeked`/loop reset, controls → video for `play`/`pause`/`seek`. Auto-generated controls get `overlay` by default.
+- `fig-media` now exposes a `mediaEl` getter and `play()`/`pause()`/`toggle()` methods.
+
+### Fixed
+
+- `fig-input-palette`: restored the `disabled !== "false"` guard in the add-button click handler that had been accidentally removed (the dangling `&&` was throwing a SyntaxError and breaking the whole class).
+- `--icon-play` / `--icon-pause` tokens: replaced raw inline `<svg>` values with proper `url("data:image/svg+xml,...")` strings so they actually work as mask images.
+
+## [4.9.1]
+
+### Fixed
+
+- `fig-media`, `fig-image`, `fig-video`: `fit="cover"` and other `object-fit` values now correctly apply to the inner `<video>`/`<img>` elements. The cover selector was missing the `>` child combinator and only targeted the generated class, so the rule never matched `<video>`. Inner media now sizes via `width/height: 100%` instead of `min-*` + `auto`, so `cover`, `fill`, and friends all render as expected.
+
+### Changed
+
+- `fig-media`, `fig-image`, `fig-video`: default `aspect-ratio` is now `4/3` (both in CSS and in the connectedCallback) so media elements have a sensible aspect ratio out of the box when no `aspect-ratio` attribute is set.
+- `fig-media`: removed the `type` attribute from the playground attributes panel (type is determined by the example markup, not toggled at runtime).
+
+## [4.9.0]
+
+### Changed
+
+- `fig-input-palette`: layout reworked to a 2-row grid. Row 1: inline palette + add button (right-aligned). Row 2: expanded color list spans the full width. When `add="false"`, the inline palette spans both columns.
+- `fig-input-palette`: expanded `fig-input-color` rows no longer expose alpha (`alpha="false"`) — alpha editing is still available in the inline pickers.
+- `fig-input-gradient`: dropped hardcoded `size="medium"` on the chit so it inherits the default chit sizing.
+- `fig-input-gradient`: stop and ghost handles now use `size="small"` to match Figma's compact gradient affordances.
+
+## [4.8.3]
+
+### Fixed
+
+- Safari: `fig-dialog` and `fig-toast` no longer throw `Cannot access invalid private field` / `Cannot access private method` errors when running through the customized built-in polyfill. The polyfill prototype-swaps existing nodes without invoking the constructor, so all `#privateField` members in `FigDialog` and `FigToast` were converted to underscore-prefixed (`_name`) members and initialized via an idempotent `_figInit()` that runs from both the constructor and lifecycle callbacks.
+- `fig-dialog`: merged duplicate `static get observedAttributes()` and `attributeChangedCallback()` declarations. The second pair was overriding the first, so `autoresize` was never actually observed.
+
+### Changed
+
+- Playground `/propkit` "Plugin" iframe page: load the Inter font from Google Fonts so the iframe content matches the figui3 system font.
+
+## [4.8.2]
+
+### Fixed
+
+- `fig-color-tip`: `selected` attribute now correctly toggles off when the fill picker dialog closes. Replaced the brittle `document.querySelector(".fig-fill-picker-dialog[open]")` watcher with a `MutationObserver` on the inner `fig-chit`'s `selected` attribute, mirroring its state to the host.
+
+## [4.8.1]
+
+### Changed
+
+- Playground `/propkit` "Plugin" iframe page: removed unused IBM Plex Mono Google Fonts stylesheet and a redundant `flex: 1 1 auto` on `body > fig-content`.
+
+## [4.8.0]
+
+### Added
+
+- `fig-dialog[autoresize]`: when a `<fig-content>` is a direct child, it becomes the scroll region (`flex: 1 1 auto; overflow: auto; overscroll-behavior: contain`). The dialog itself sizes to content via `height: max-content` and is capped by the base `dialog` `max-height`. `fig-header` and `fig-footer` siblings remain pinned naturally without `position: sticky` (no rubber-band bounce).
+
+### Changed
+
+- `fig-dialog` autoresize: replaced JS-driven content-height measurement with pure CSS (`height: max-content`). JS only clears stale inline heights now; iframe `postMessage` sizing path is unchanged.
+- `dialog` base styles: removed the unused `&[tooltip]` block (legacy attribute-style tooltip styling that was superseded by `dialog[is="fig-popup"][variant="tooltip"]`).
+- Playground `/propkit` "Plugin" iframe page: scroll moved from `body` to `body > fig-content`; `fig-footer` is no longer `position: sticky` (flex layout pins it naturally).
+- Playground `figui3` Dialog example: wraps content in `<fig-content>` with longer prose so scroll behavior is visible.
+
+## [4.7.1]
+
+### Changed
+
+- Playground `/propkit` "Plugin" iframe page: merged the `.plugin-body` flex/scroll rules into the `body` element directly, eliminating the wrapper div so the footer stays pinned via `margin-top: auto` and content scrolls within body.
+
+## [4.7.0]
+
+### Added
+
+- `fig-dialog`: listens for `{ type: "figui:iframe-resize", height, width }` `postMessage` events from a descendant iframe and resizes itself to fit the broadcasted content, accounting for header/footer/padding chrome. Pairs with the new `dialog` `max-height: calc(100vh - var(--spacer-4))` so dialogs grow up to the viewport and stop there.
+- Playground `/propkit` "Plugin" example: iframe page broadcasts its natural content size (`scrollHeight` of scrollable regions + rendered footer height) on load, on DOM mutations, on font readiness, and on any descendant `ResizeObserver` change so dialog stays in sync.
+
+### Changed
+
+- `dialog` base styles: added `max-height: calc(100vh - var(--spacer-4))` so dialogs never overflow the viewport.
+- `fig-dialog`: cleans up the iframe `message` listener on disconnect.
+- Playground "Plugin" example: iframe `src` is now relative (`/propkit/iframe.html`) so the example always loads the locally deployed version of the iframe page.
+
+## [4.6.1]
+
+### Changed
+
+- Playground "Plugin" dialog example: iframe now points to the absolute `https://rog.ie/propkit/iframe.html` URL so the example works outside the dev playground.
+
+## [4.6.0]
+
+### Added
+
+- `fig-media`: new unified media host component supporting `type="image"` and `type="video"` with shared sizing (`size`, `aspect-ratio`, `fit`), `upload` overlay, and video attributes (`controls`, `autoplay`, `loop`, `muted`, `poster`).
+- `fig-video`: new video component built on the media host with playback attributes and optional upload overlay.
+- `fig-image`: added `alt` attribute, `size` token sizing, and updated default sizing model (host shrinkwraps to intrinsic image size).
+- Base styles: added default `iframe` rules so iframes flex naturally inside dialogs and other flex containers.
+- Playground (`/propkit`): new "Plugin" example under "Controls in dialogs" hosting plugin UI inside an iframe (`/propkit/iframe.html`) with parent/child resize broadcasting.
+- Playground (`/propkit`): new "Media" field example demonstrating `fig-media` inside a `fig-field` row.
+- Playground (`/figui3`): added Image, Media, and Video sections with examples covering image, video, poster, and upload modes.
+- Playground attributes panel: added rules for `fig-media` and `fig-video` (type, fit, upload, checkerboard, controls, autoplay, loop, muted, poster).
+
+### Changed
+
+- `fig-image`: rewritten as a thin wrapper over the new media host. Renders a real `<img>` inside the element; `getBase64()` now uses the inner `<img>` element directly (requires CORS-clean source).
+- `dialog`: `dialog[open]` now uses `display: flex; flex-direction: column;` so dialog contents (including iframes) can flex correctly. Removed the old `fig-header` / `fig-footer` margin rules in `fig-dialog` in favor of in-dialog layout.
+- `fig-segment`: option labels are now `text-transform: capitalize` for consistency with segmented control styling.
+- Playground routing: trailing slashes in `/figui3`, `/propkit`, `/propkit/lab`, and `/sandbox` paths are normalized so `mode` resolution and base path matching no longer break for `/propkit/` style URLs.
+- Playground attribute resolver: enum option matching now normalizes whitespace and `/` separators so values like `16 / 9` resolve correctly against `16/9`-style options.
+
+### Fixed
+
+- `fig-image` / `fig-media` / `fig-video`: chit placeholder is now properly hidden when a real media source (or video poster) is present, and shown when the source is empty.
+- Playground: `fig-image` upload overlay defaults are no longer accidentally toggled when controlling other attributes.
+
+## [4.5.3]
+
+### Fixed
+
+- Playground routing: `/propkit/lab` is now the canonical Lab route, with automatic migration from legacy `/lab` URLs.
+
+### Changed
+
+- `fig-field-slider` lab styling now applies horizontal layout styles to `fig-field[direction="horizontal"]` and adds focus-visible container treatment.
+
+## [4.5.2]
+
+### Changed
+
+- Playground: section list now has vertical padding only for ungrouped lists, while grouped (`fig-group`) lists remain flush.
+
+## [4.5.1]
+
+### Fixed
+
+- `fig-options`: now captures internal `fig-segmented-control` / `fig-dropdown` events and re-emits normalized `input` and `change` events from `fig-options`.
+- `fig-options`: dropdown mode no longer propagates undefined event detail values; emitted event payloads now keep consistent string value shape.
+
+### Changed
+
+- `fig-input-color`: removed `localStorage` persistence for color input mode from `fig.js`.
+
+### Added
+
+- Playground `/propkit` Event output now shows both control `value` and raw `event.detail` (plus detail type) for easier event-shape debugging.
+
+## [4.5.0]
+
+### Fixed
+
+- `fig-input-number`: `units="px"` no longer renders disallowed units by default.
+
+### Added
+
+- `fig-input-number`: new `units-disallow` attribute with comma-separated unit filtering support in component docs and playground attribute controls.
+
+### Changed
+
+- `fig-input-number`: disallowed units are now ignored even when explicitly provided via `units`; default disallow list now includes `"px"`.
+- Playground/dev setup: refreshed dependency lockfiles and launcher wiring for local playground dev startup.
+
+## [4.4.4]
+
+### Fixed
+
+- `fig-input-palette`: expand/collapse no longer causes a flash — toggling `open` now skips unnecessary DOM re-render since CSS handles visibility.
+
+### Changed
+
+- `fig-field`: label gap uses margin instead of padding for more consistent spacing behavior.
+
+## [4.4.3]
+
+### Fixed
+
+- `fig-field`: only-child grid spanning now correctly covers `input1 + gap + input2` columns in label-less horizontal fields.
+
+### Changed
+
+- Playground: added File Input example to FigUI3 tab, removed standalone Angle Input example, set default dev port to 6600.
+
+## [4.4.2]
+
+### Fixed
+
+- `fig-menu`: Hide direct `fig-menu-item` and `fig-separator` children via CSS so items don't flash before JS moves them into the popup.
+- `fig-menu`: Detect late-arriving trigger elements (e.g. React rendering children after `connectedCallback`) via MutationObserver, wiring up click listener and popup anchor when the trigger appears.
+
+## [4.4.1]
+
+### Fixed
+
+- Rebuild dist bundle — `dist/fig.css` and `dist/fig.js` now include all recent component additions (fig-menu, presentational elements, etc.).
+
+## [4.4.0]
+
+### Fixed
+
+- `fig-tooltip`: no longer lingers after dialog close; clears pending show timeout in `disconnectedCallback` and bails from `showPopup` when parent dialog is closed.
+- `fig-tabs`: single-click tab activation now works correctly; fixed `#selectByValue("")` deselecting all tabs when tabs use `content` attribute instead of `value`.
+- `fig-tabs`: click targeting uses `closest("fig-tab")` for reliable hit detection on child elements.
+- `fig-tabs`: keyboard navigation now properly sets `selected` attribute on the new tab.
+
+### Added
+
+- `fig-tabs`: `disabled` attribute fully disables all tab interaction with visual feedback.
+- `fig-tabs` / `fig-tab-content`: full-width by default (`width: 100%`).
+- `fig-palette`: expanded view uses named grid columns with `:has()` for flexible layout with/without remove buttons.
+
+### Changed
+
+- Playground: Tabs example expanded with tabbed content panels; Prepress "Apply To" uses `fig-options`.
+
+## [4.3.0]
+
+### Added
+
+- `fig-options`: supports newline-delimited and JSON array formats for the `options` attribute, enabling values that contain commas.
+- `fig-palette`: remove button (ghost variant, minus icon) on each color in expanded view; respects `min` attribute to prevent removal below minimum count.
+
+## [4.2.0]
+
+### Added
+
+- `fig-footer`: new component mirroring `fig-header` with top border, `borderless` and `sticky` attribute support.
+- `fig-dialog`: `resizable` attribute allows user-resizable dialogs (off by default).
+- `fig-dialog`: auto-generates `fig-header` with title and close button when `title` attribute is set and no header exists.
+- `fig-segmented-control`: label truncation with ellipsis when segments overflow available space.
+- `fig-field`: refactored to CSS grid layout for more consistent label/input alignment.
+
+### Fixed
+
+- `fig-slider`: no longer forces parent dialogs wider than other controls; intrinsic width now matches `fig-input-number` and `fig-input-color` in grid layouts.
+- `fig-slider`: consolidated duplicated range input styles and orphaned CSS blocks.
+- `fig-tab`: removed dead `:has(:checked)` and `[type="radio"]` CSS rules.
+- `input[type="checkbox"].switch`: nested pseudo-class rules for cleaner stylesheet structure.
+
+### Changed
+
+- Dialog footer elements in propkit examples converted from `<footer>` to `<fig-footer>`.
+- Radio group example in `/figui3` now wraps each radio in its own `fig-field` with label passed via attribute.
+
+## [4.1.4]
+
+### Fixed
+
+- `fig-image`: upload preview now works correctly by ignoring bubbled native input change events.
+- `fig-image`: prevent re-entrant clear event from wiping uploaded image source.
+
+### Changed
+
+- `fig-image`: default `--fit` changed from `cover` to `contain`.
+
+## [4.1.3]
+
+### Added
+
+- `fig-menu`: playground attribute controls for position, offset, closed-by, disabled, and open.
+- `fig-menu`: `disabled` attribute now forwards to the trigger element.
+
+## [4.1.2]
+
+### Added
+
+- `fig-menu`: new context menu component with trigger detection, keyboard navigation (arrow keys, Home/End, Enter/Space), ARIA roles, `position`/`offset`/`closedby` forwarding, `open` attribute, and `change` event with `{ value, item }` detail.
+- `fig-menu-item`: menu item element with `value` attribute and `disabled` support.
+- `fig-separator`: visual divider between menu item groups.
+- Playground: added Menu examples (default + disabled items) to `/figui3` Core components.
+- Playground: EventView now serializes DOM elements in event output instead of showing `{}`.
+
+### Fixed
+
+- `fig-button`: SVG fill selector now excludes `fill="none"` to prevent overriding transparent fills.
+- `fig-chooser`: fixed spacing with CSS custom property `--fig-chooser-gap`, updated choice padding and selection ring width.
+- `fig-layer`: removed extra margin-left on layer rows, adjusted padding and chevron position.
+- Playground: EventView now shown for Menu section in `/figui3`.
+
+## [4.1.1]
+
+### Changed
+
+- Playground: added "Native elements" group to `/figui3` with 12 styled HTML element examples (button, select, inputs, textarea, checkbox, switch, radio, color, fieldset, details, hr).
+- Playground: refactored nav to use collapsible `fig-group` wrappers instead of `.nav-group-header` elements.
+- `details`: improved styling with padding, full width, and adjusted summary alignment.
+
+## [4.1.0]
+
+### Fixed
+
+- `fig-combo-input`: rewrote to meet component standards — now emits `input`/`change` events, wires text input changes, uses private methods, synchronous render, proper cleanup in `disconnectedCallback`.
+
+### Changed
+
+- `fig-input-fill`: gradient angle picker replaced with `fig-input-number` (removed internal dependency on `fig-input-angle`).
+- `fig-combo-input`: added `fig-combo-input` CSS display rule for proper flex layout participation.
+- Playground: moved `fig-canvas-control` and `fig-input-angle` to experimental `/lab` route (`fig-lab.js`/`fig-lab.css`).
+- Playground: moved `fig-handle` example from `/propkit` to `/figui3` under Utilities group.
+- Playground: added Radio "Group" and "Disabled" examples in `/figui3`.
+
+## [4.0.0]
+
+### Breaking Changes
+
+- `fig-image`: removed `download` attribute and internal `<div>` wrapper. Upload overlay now uses `fig-input-file` instead of native `<input>` inside `fig-button`.
+- `fig-image`: `loaded` event detail changed from `{ blob, base64 }` to `{ file, src }`. Use the new `async getBase64()` method if base64 is needed.
+- `fig-image`: no longer auto-generates blob URLs or base64 on every load. Component is now synchronous on connect.
+
+### Added
+
+- `fig-image`: `async getBase64()` method for on-demand base64 conversion.
+- `fig-image`: `file` getter to access the raw uploaded File object.
+- `fig-image`: preserves user-provided children (no more innerHTML wipe). Supports composable overlays.
+- `fig-image`: `aspect-ratio="auto"` uses `createImageBitmap` for fast, lazy dimension detection.
+- `fig-image`: auto-generated `fig-input-file` shows "Replace" label when an image is already set.
+- `fig-input-file`: `variant` attribute passthrough to internal `fig-button` (default "input").
+- `fig-input-file`: `url` attribute for display-only file state (extracts filename from URL, no network request).
+- Playground: "Plain" and "Custom Buttons" image examples in /propkit.
+
+### Changed
+
+- `fig-image` CSS: hover-reveal now targets `fig-input-file[data-generated]` instead of `> div`.
+
+## [3.23.0]
+
+### Added
+
+- `fig-input-file`: file upload input with filename display, clear button, accepts tooltip, drag-and-drop, and multiple file support.
+- `fig-truncate`: text truncation utility with `position` (right/left/middle), `tail` preservation, and overflow `tooltip`.
+- `fig-field`: auto-detects toggleable children (elements with `open` property) and injects an expand/collapse chevron.
+- Playground: File examples in /propkit, Truncate examples under Utilities group in /figui3.
+
+### Changed
+
+- Playground EventView now serializes File objects (name, size, type) instead of empty objects.
+- Playground text input fields re-sync correctly when navigating between examples.
+
+## [3.22.0]
+
+### Changed
+
+- Standardized collapse/expand pattern across `fig-layer`, `fig-group`, and `fig-input-palette`: all use `open` attribute and emit `openchange` event.
+- `fig-group`: replaced `collapse` attribute with `collapsible` (presence boolean) + `open` for state.
+- `fig-input-palette`: replaced `expanded` attribute with `open`; added public `open` getter/setter and `openchange` event.
+- `fig-input-color` and `fig-input-fill`: text input now shown by default (unless `text="false"`).
+- Removed `color-strip` attribute from `fig-input-palette`.
+
+### Added
+
+- `fig-field`: auto-detects toggleable children (elements with an `open` property) and injects a chevron for expand/collapse toggle via label click.
+- Playground: palette field added to collapsible group example.
+
+## [3.21.2]
+
+### Fixed
+
+- `fig-input-gradient` now always renders as a horizontal linear gradient at 90 degrees, regardless of the incoming gradient type (angular, radial, etc.) — preserves interpolationSpace, hueInterpolation, and stops.
+- `fig-color-tip` now preserves alpha when opening — extracts alpha from 8-char hex (`#RRGGBBAA`) and rgba strings, passing opacity to the fill picker's initial value.
+- `fig-color-tip` `#syncFromAttributes` no longer strips alpha when re-setting the fill picker value.
+- `fig-fill-picker` gradient stops list color input reads opacity from `e.detail.rgba.a` instead of the `alpha` HTML attribute.
+- `fig-input-fill` gradient opacity input no longer overrides individual stop opacities.
+
+### Changed
+
+- Playground: `fig-switch` attributes view now includes Checked, Indeterminate, and Disabled toggles.
+- Playground: `fig-input-gradient` default example updated to 3 stops with a semi-transparent middle stop.
+
+## [3.21.1]
+
+### Fixed
+
+- `fig-handle` type="color" now renders transparent colors — `#colorWithOpacity` converts hex + opacity to rgba for `--fill`, and events forward opacity from `fig-color-tip`.
+- `fig-color-tip` now derives opacity from `detail.alpha` when `detail.opacity` is absent, fixing the disconnect between `fig-fill-picker` (which emits alpha 0-1) and the color tip (which expected opacity 0-100).
+- `fig-handle` checkerboard behind color swatch — `::after` uses `linear-gradient(var(--fill), var(--fill)), var(--checkerboard)` so transparency is visible.
+- `fig-chit` solid color backgrounds now wrapped as `linear-gradient(color, color)` internally, enabling correct CSS layering with checkerboard for transparent colors.
+- `fig-input-gradient` MutationObserver no longer stores rgba strings back into stop data — skips non-hex color attribute values, preventing `figHexToRGB` NaN errors.
+- `fig-input-gradient` stop handles now display opacity via rgba color strings (`#stopColorCSS`) instead of a separate alpha attribute.
+- `fig-input-fill` gradient opacity input no longer overrides individual stop opacities — each gradient stop manages its own opacity independently.
+- `fig-fill-picker` gradient stops list color input now reads `e.detail.rgba.a` for opacity instead of the `alpha` HTML attribute, which returned `"true"` instead of a numeric value.
+
+### Added
+
+- `fig-swatch` element as an alias for `fig-chit`.
+
+## [3.21.0]
+
+### Added
+
+- `fig-input-gradient` `edit` attribute with three modes: `"true"` (default, full inline editing), `"false"` (display-only chit), and `"picker"` (opens fill picker dialog locked to gradient tab).
+- `fig-input-gradient` now supports color interpolation spaces — `#buildGradientCSS` includes the interpolation clause (`in oklab`, `in oklch shorter hue`, etc.) for correct gradient rendering.
+- `fig-input-gradient` color sampling (`#sampleGradientColor`) now uses the correct interpolation space and hue mode when adding stops, instead of basic sRGB canvas sampling.
+- Shared color math utilities: `figSampleGradientAt`, `figRGBToOklab`, `figOklabToRGB`, `figOklabToOklch`, `figOklchToOklab`, `figInterpolateHue` for accurate color interpolation across OKLab, OKLCH, and sRGB-linear spaces.
+- `fig-input-palette` `color-strip` toggle in playground attributes view.
+
+### Changed
+
+- Fill picker gradient tab now uses an embedded `fig-input-gradient edit="true" size="large"` for visual stop editing, replacing the static gradient bar div.
+- Fill picker gradient stops list updates in-place when stop count is unchanged, preventing flash/flicker during drag interactions.
+- `fig-fill-picker` `#buildGradientCSS` now defaults gradient stop opacity to 100 when undefined, preventing invisible gradients.
+- Playground gradient example in `/figui3` now includes `opacity` and `angle` in the gradient value for correct rendering.
+
+## [3.20.3]
+
+### Fixed
+
+- `fig-input-gradient` click-to-add no longer creates duplicate stops — the pointerdown handler now stops propagation to prevent the click handler from firing a second add.
+- `fig-input-gradient` click-to-add now correctly selects the new stop — the original pointerdown event no longer bubbles to document where the new handle's deselect listener would immediately undo the selection.
+- `fig-input-gradient` color-tip input/change events no longer trigger the drag tooltip — color events are now handled separately from position drag events on the track.
+
+### Changed
+
+- `fig-input-gradient` stop handles now have `hit-area="4"` for easier interaction.
+- `fig-input-gradient` ghost handle uses native `control="add"` and `type="color"` on `fig-handle` instead of manually creating a `fig-color-tip` element.
+- `fig-handle` `control` attribute and color tip rendering now works on gradient ghost handles (removed `#isGhost` exclusion).
+
+## [3.20.2]
+
+### Fixed
+
+- `fig-input-color` events now include `{ value, hex, rgba }` detail.
+- `fig-input-angle` events now include `{ value, angle }` detail.
+- `fig-joystick` events now include `{ value, x, y }` detail.
+- `fig-input-text` and `fig-input-number` mouse-drag events now include `{ detail: value }` (previously missing).
+- Playground event output panel now handles primitive event details (strings, numbers) by wrapping them in `{ value }`.
+
+### Changed
+
+- Playground: number example defaults to steppers on, multiline text example defaults to autoresize on.
+- Playground: event output hidden for skeleton example (no interactive controls).
+
+## [3.20.1]
+
+### Fixed
+
+- `fig-input-text` and `fig-input-number` now correctly update the inner element's placeholder when the `placeholder` attribute changes, and no longer show literal `"null"` when the attribute is removed.
+
+### Changed
+
+- Multiline text input example in `/figui3` now starts empty with placeholder only.
+
+## [3.20.0]
+
+### Added
+
+- `fig-tooltip` `theme` attribute — applies a color scheme to the tooltip popup (`"dark"`, `"light"`, or `"brand"`). Brand theme uses `--figma-color-bg-brand` background.
+- `fig-tooltip` `pointer` attribute — set `pointer="false"` to hide the tooltip arrow/caret.
+- `fig-handle` drag threshold — a 3px movement threshold before a drag begins, preventing accidental drags on click.
+- `fig-handle` color change events — color handle `input` and `change` events now bubble with `{ color }` detail, so parent components (like `fig-canvas-control`) can react to color edits.
+- `fig-canvas-control` color value — `value` getter now includes `color` for `type="color"` controls.
+- `fig-canvas-control` brand-themed tooltips with hidden pointers for a cleaner look during drag.
+- `fig-canvas-control` tooltip text now prefixed with labels ("Radius", "Angle") for clarity.
+- Playground event output panel — `/propkit` examples now show a live event output view in the attributes sidebar.
+- Playground `fig-tooltip` attribute controls for `theme` and `pointer`.
+
+### Changed
+
+- `fig-tooltip` default colors now use `light-dark()` for proper light/dark mode support and `color-scheme: dark` base.
+- `fig-tooltip` box-shadow inner highlight adapts to light/dark mode via `light-dark()`.
+- `fig-canvas-control` line stroke color uses `light-dark()` for better light-mode visibility.
+- `fig-canvas-control` line stroke width reduced from 1.5px to 1.25px.
+- `fig-canvas-control` handle positioning switched from `value` attribute to direct `left`/`top` pixel placement for smoother updates.
+- `fig-canvas-control` dynamic cursor updates throttled to avoid redundant re-renders (only updates when rounded degree changes).
+- `fig-canvas-control` point-radius default changed from percentage to pixel radius in playground examples.
+- `readBooleanValue` in playground now respects `falseValue` for custom bool modes.
+- Playground uses `Fragment` instead of wrapper `div` around attribute panels.
+
+## [3.19.0]
+
+### Added
+
+- `fig-canvas-control` `type="point-point"` — two full-size handles connected by a styled line, with angle and length inferred from the endpoints. Value shape: `{ x, y, x2, y2 }`.
+- `fig-canvas-control` `name` attribute supports comma-separated labels (e.g. `"Start, End"`) for dual-handle types.
+- `fig-canvas-control` point-point handles support direct drag (dynamic directional resize cursor) and rotation via hit area (dragging from hit area rotates around the opposite handle at fixed distance, with rotate cursor and 15-degree snapping).
+
+### Changed
+
+- **BREAKING:** Renamed `fig-canvas-point` to `fig-canvas-control` (and class `FigCanvasPoint` to `FigCanvasControl`).
+
+## [3.18.0]
+
+### Added
+
+- `fig-canvas-control` component — a spatial control for interactive point, radius, and angle editing on a user-provided canvas surface. Supports `type` variants: default (point only), `color` (color handle), `point-radius` (resizable circle), and `point-radius-angle` (circle + rotatable angle handle). Value is a JSON object (`{ x, y, radius?, angle? }`). Includes `name`, `tooltips`, `disabled`, `snapping`, `drag-surface`, and `color` attributes.
+- `fig-handle` `hit-area` attribute — expands the interactive zone around a handle without changing its visual size. Accepts a unitless px padding value, optionally with `circle` keyword (e.g., `hit-area="16"`, `hit-area="16 circle"`).
+- `fig-handle` `hit-area-mode` attribute — controls hit area behavior: `"handle"` (default) proxies interactions to the handle, `"delegate"` emits a `hitareadown` CustomEvent for parent components to define custom behavior.
+- `--fig-handle-hit-area-opacity` CSS custom property for debugging hit area bounds (red overlay, default `0`).
+- `fig-canvas-control` dynamic cursors — radius ring shows a directional resize cursor that rotates to point radially from center on hover and during drag; angle handle hit area shows a rotating cursor reflecting the current angle.
+- `fig-canvas-control` brand color highlight — radius ring, angle line, and angle handle turn `--figma-color-bg-brand` on hover and during drag.
+- `fig-canvas-control` radius ring hit area — invisible 12px-wide stroke for forgiving drag interaction without changing visual size.
+- Playground `/propkit` canvas controls: four `fig-canvas-control` examples (Point, Color, Point + Radius, Point + Radius + Angle) replacing the old standalone Point example.
+- Playground `fig-handle` hit area controls: size slider, shape segmented control, mode segmented control, and debug opacity slider.
+- `fig-canvas-control` and `fig-handle` hit area documented in README.
+
+### Changed
+
+- `fig-handle` drag from hit area now calculates initial pointer-to-center offset to prevent drag jumps.
+
+## [3.17.0]
+
+### Added
+
+- `fig-input-gradient` drag-to-add — pointerdown on empty track space creates a new stop and immediately begins dragging it.
+- CSS minification via lightningcss — `npm run build` now produces minified CSS alongside minified JS in `dist/`.
+- `npm run build:css` script for standalone CSS minification.
+- Unminified source exports via `@rogieking/figui3/src/*` for debugging.
+- README restructured with component index table, domain-grouped sections, per-component event documentation, and playground links.
+- 10 previously undocumented components added to README: field-slider, input-palette, easing-curve, 3d-rotate, origin-grid, skeleton, color-tip, choice, chooser, handle.
+
+### Changed
+
+- Default package exports (`main`, `module`, `exports`) now point to minified `dist/` files instead of unminified source.
+- CDN URLs updated to reference `dist/` paths.
+- `figGetHighestZIndex` replaced with a monotonic counter — eliminates O(n) full DOM scan on every tooltip/popup open.
+- Shared reusable canvas for color normalization — `FigInputGradient`, `FigChit`, and `FigColorTip` no longer create throwaway canvases.
+- Gradient CSS support test results are now cached across `FigFillPicker` instances.
+- `FigHandle` drag path reduces redundant `getBoundingClientRect` calls by reusing the rect from clamp computation.
+- Deduplicated `#syncAspectRatioVar`, `#syncPerspectiveVar`, and `#syncCSSVar` into shared `figSyncCssVar` helper across `FigEasingCurve`, `Fig3DRotate`, `FigOriginGrid`, and `FigInputJoystick`.
+
+### Fixed
+
+- Event listener leaks — `FigTooltip`, `FigTab`, `FigTabs`, `FigSegment`, `FigDialog`, `FigToast`, `FigDropdown`, and `FigInputAngle` now store bound listener references and correctly remove them in `disconnectedCallback`.
+- `FigDropdown` was missing `disconnectedCallback` entirely — added cleanup for slotchange, input, and change listeners.
+- `FigFillPicker` resource leaks — MutationObservers (`#dialogOpenObserver`, `#webcamTabObserver`) are now disconnected, webcam MediaStream tracks are stopped, and video blob URLs are revoked on disconnect.
+- `FigInputGradient` resource leaks — `#colorObserver` is disconnected, tooltip timer is cleared, and track event listeners are removed on disconnect.
+- Duplicate CSS declarations removed: button `color`, tab `content`, color swatch `color-scheme`/`border-radius`, chit pseudo-element sizing, segmented control `display`, switch `margin`, field `flex`, joystick crosshair `height`, 3D rotate `--border-end-color`.
+- Merged duplicate `&:active` blocks inside button `&:hover`.
+- Removed empty `&[expanded]` ruleset.
+
+## [3.16.0]
+
+### Added
+
+- `fig-input-color` `disabled` attribute support — propagates disabled state to hex input, alpha input, fill picker, and chit.
+- `fig-input-fill` `#syncDisabled()` — updates child controls in-place instead of full re-render on disabled change.
+- `fig-input-palette` `add` attribute — set `add="false"` to hide the add-color button.
+- `fig-input-palette` dual-render layout with inline chit strip and expanded color rows always present in DOM, toggled via CSS.
+- `fig-chooser` scroll-snap support (`scroll-snap-type: y mandatory`) for smooth item alignment.
+- `fig-chooser` `padding="false"` attribute — removes internal padding and widens gap for edge-to-edge choice layouts.
+- `fig-choice` `padding="false"` attribute — zeroes choice padding via `--fig-choice-padding` CSS var.
+- `fig-choice` border-radius now derives from `--fig-choice-padding` for consistent inset ring appearance.
+- Disabled toggle in playground attributes for `fig-input-color`, `fig-input-gradient`, and `fig-input-palette`.
+- Padding toggle in playground attributes for `fig-chooser`.
+- `/propkit` nav group headers — sections are now grouped under labelled categories (Field controls, Composite controls, etc.).
+- `/propkit` overhauled sections with new Chooser examples (text, images, images + labels, colors) and consolidated field control catalog.
+- `data-playground-hide-field` attribute — hides the Field controls panel in the attributes sidebar for specific examples.
+- Playground `data-playground-*` attribute preservation during markup merge for roundtrip editing fidelity.
+
+### Changed
+
+- `fig-chit` disabled selector tightened to `:not([disabled="false"])` to support explicit opt-out.
+- `fig-input-palette` layout switched from CSS grid to flex column with separate `.palette-colors-inline` and `.palette-colors-expanded` containers.
+- `fig-input-color` hover state now shows a subtle border outline.
+- `fig-easing-curve` duration bar width increased from 5 to 7 with radius from 3 to 4.
+- `fig-easing-curve` removed nested `fig-handle` sizing rules from `.fig-easing-curve-handle` (handled by component defaults).
+- `fig-choice` selection ring width increased from 1px to 1.25px.
+- `fig-chooser` overflow changed from `hidden auto` to `visible auto`.
+- `/propkit` sections reorganized alphabetically with group labels; removed standalone Handle section from `/figui3`.
+- Removed chooser content mode switcher from attributes sidebar (replaced by separate per-content-type examples).
+- Playground CSS formatting cleanup (whitespace normalization in App.css).
+
+### Fixed
+
+- `fig-input-fill` disabled attribute change no longer triggers a full re-render — uses targeted `#syncDisabled()` instead.
+- `fig-input-palette` expanded state CSS scoping now correctly targets `.palette-colors-expanded` container.
+
+## [3.15.0]
+
+### Added
+
+- `fig-input-color` `text` attribute is now observed and triggers UI rebuild, enabling runtime toggle of hex input visibility.
+- `fig-input-palette` `expanded` attribute for vertical layout with text and alpha inputs per color.
+- `fig-input-palette` incremental add — clicking "Add color" appends without re-rendering existing pickers.
+- `fig-input-palette` wraps color pickers in a `.palette-colors` div, separating them from the add button.
+- `/propkit` Expanded toggle for palette attributes panel.
+- `/propkit` Minimal palette example with two colors.
+- `/propkit` Skeleton example (moved from `/figui3`).
+- `/figui3` Fill segmented control (Solid/Gradient) for chit example.
+- `/figui3` Text toggle for `fig-input-color` attributes panel.
+- `fig-field[direction="horizontal"]:has(> fig-input-palette)` padding rule for proper field alignment.
+
+### Changed
+
+- `fig-input-palette` uses `fig-input-color` instead of `fig-fill-picker` for each color swatch.
+- `fig-input-palette` add button is now a ghost icon button with tooltip in all states.
+- `fig-input-palette` layout uses CSS grid (`inputs` + `button` areas) instead of inline-flex.
+- `fig-chit` reworked selection ring: moved from `::before` box-shadow to element-level `box-shadow` for correct stacking.
+- `fig-chit` swapped `::before` / `::after` roles: `::before` now renders the color/gradient fill, `::after` renders the border overlay with `z-index: 1`.
+- `fig-chit` `::before`/`::after` sizing now respects `--padding` for inset thumbnails at all sizes.
+- `fig-input-gradient` scoped chit selector to direct child (`> fig-chit`).
+- `/propkit` Palette attributes panel header renamed from "Input-palette" to "Palette".
+- Exclude `src` attribute from playground URL parameter serialization.
+
+### Fixed
+
+- `fig-chit` selected ring was invisible due to overlapping box-shadow spreads on `::before`.
+- `fig-chit` checkerboard background now targets `::after` to match the reworked pseudo-element roles.
+- `fig-input-color` `text="false"` now properly hides hex input (strict `=== "true"` check).
+
+## [3.14.1]
+
+### Added
+
+- `fig-handle` `select()` and `deselect()` public API methods for programmatic selection with color tip management.
+- `fig-handle` `showColorTip()` and `hideColorTip()` public API methods to toggle color tip visibility without destroy/recreate.
+- `fig-input-gradient` Tab/Shift+Tab cycles selection through stop handles with wraparound.
+- `fig-input-gradient` Left/Right arrow keys nudge selected stop by 1% (Shift for 10%), with tooltip showing position.
+- `fig-handle` auto-selects on drag start if not already selected.
+
+### Fixed
+
+- `fig-tooltip` `destroy()` now nulls `this.popup` reference, fixing tooltip not reappearing on subsequent show/hide cycles.
+- `fig-input-gradient` track-level click swallower after drag no longer eats clicks on other handles, fixing intermittent selection failures.
+- `fig-input-gradient` hides color tip during drag and arrow key nudge, restoring it when done.
+
+## [3.14.0]
+
+### Added
+
+- `fig-tooltip` `show` attribute — persists the tooltip when present/true, ignoring hover and click interactions. Removing the attribute allows normal hide behavior.
+- `fig-tooltip` `text` getter/setter — updates tooltip content in-place without re-rendering the popup. Repositions automatically if open.
+- `fig-tooltip` `text` observed attribute — setting via `setAttribute("text", ...)` also updates content without re-render.
+- `fig-input-gradient` drag tooltips — each stop handle is wrapped in a `fig-tooltip` that shows the percentage position during drag.
+- `fig-handle` `.dragging` class — added during actual drag, removed on pointer up. Not applied on simple click.
+- `fig-chit` `medium` size (1.5rem) with full-area swatch style.
+- `/figui3` Tooltip playground: action segmented control (hover/click/manual), show switch, and button text updates per action mode.
+
+### Changed
+
+- `fig-tooltip` `show` attribute callback now fires synchronously instead of via `requestAnimationFrame` for immediate persistence.
+- `fig-tooltip` `showPopup()` lazily creates the popup if not yet rendered, fixing manual action mode.
+- `fig-tooltip` `showPopup()` sets `display: block` before repositioning for accurate dimensions.
+- `fig-handle` cursor and `.dragging` class only apply on actual drag movement, not on click.
+- `fig-input-gradient` uses `fig-chit size="medium"` instead of `fig-fill-picker` for gradient preview.
+- `fig-input-gradient` stop handles use `drag-surface` to target the track container through tooltip wrappers.
+- `fig-chit` large size increased to 2rem.
+- `/figui3` Handle playground: merged Color and Color tip toggles into single Color toggle.
+
+### Fixed
+
+- `fig-tooltip` crash when calling `showPopup()` on `action="manual"` tooltip (popup was never created).
+- `fig-input-gradient` drag tooltip not appearing due to `requestAnimationFrame` race in `show` attribute handler.
+- `fig-input-gradient` handle stacking/positioning when wrapped in `fig-tooltip` (`display: contents`).
+
+## [3.13.1]
+
+### Added
+
+- `fig-color-tip` `add` attribute — replaces the internal chit with an add icon and emits an `add` event on click.
+- `fig-handle` `add` attribute — shows a `fig-color-tip` in add mode, always visible and not tied to select/deselect.
+- `fig-input-gradient` ghost handle now uses `add` mode instead of a tooltip, showing the add icon above the handle on hover.
+- Clicking empty gradient track space to add a stop now auto-selects and opens the color tip on the new handle.
+
+### Changed
+
+- `/figui3` Color Tip attributes panel now shows Add toggle at the top; value/color field is hidden when Add is on.
+- `/figui3` Handle attributes panel now shows Add toggle; type and color fields are hidden when Add is on.
+- `/propkit` Gradient description updated to explain interaction model.
+
+### Fixed
+
+- Removed `contain: layout style` from `fig-handle` color/add mode to prevent drag positioning issues.
+
+## [3.13.0]
+
+### Added
+
+- `fig-handle` `type="color"` attribute — clicking a color-type handle opens a `fig-color-tip` positioned above it; deselecting closes it. Color changes from the tip update the handle's fill.
+- `fig-handle` `size="small"` support for compact handles.
+- `fig-handle` selection now uses `click` instead of `pointerdown`, so dragging no longer selects.
+- `fig-color-tip` `alpha` attribute — defaults to `true`, enabling opacity control in the fill picker. Set `alpha="false"` to disable.
+- `fig-color-tip` auto-selects when its picker opens and deselects when the picker dialog closes.
+- `fig-input-gradient` stop handles now use `type="color"` with `size="small"`, allowing inline color editing per stop.
+- `fig-input-gradient` ghost handle — hovering empty track space shows a preview handle at the cursor position with the interpolated gradient color and an "Add color stop" tooltip. Clicking adds a new stop.
+- `fig-tooltip` `action="manual"` mode — skips auto-binding event listeners so `render()`/`showPopup()`/`hidePopup()` can be called programmatically.
+- `fig-handle` now supports `drag-snapping` with `false` (default), `modifier` (hold Shift), and `true` (always) modes to snap drag position to edges, center, and diagonals.
+- New `fig-color-tip` component for compact solid-color picking, built on `fig-fill-picker` and supporting `value`, `selected`, and `disabled`.
+- New `/figui3` Color Tip playground section with default and state examples.
+
+### Changed
+
+- `/figui3` Handle playground example defaults to `type="color"` with a Color toggle in the attributes panel.
+- `/figui3` Attributes View now exposes `fig-color-tip` `value` using `fig-input-color` (Figma picker) with alpha enabled, plus `selected`/`disabled` toggles.
+- Handle attributes panel shows Size segmented control (Default / Small) and hides Color row when type is not "color".
+
+### Fixed
+
+- `fig-tooltip` positioning inside dialogs with `contain: layout` — tooltip popup now offsets by the container's position so tooltips render correctly inside fill picker dialogs.
+- `fig-handle` with `type="color"` no longer repositions on click — only drags move the handle.
+- Clicking inside a `fig-color-tip` picker dialog no longer deselects the parent `fig-handle`.
+- `fig-input-color` now reacts to `alpha` attribute changes so alpha controls appear/disappear reliably during live attribute updates.
+
+## [3.12.1]
+
+### Added
+
+- CSS `contain` properties across components for reduced layout thrashing and paint invalidation:
+  - `contain: strict` on fixed-size controls (switch, checkbox, radio, mask-icon, handle, close icon).
+  - `contain: layout paint` on toast, slider track container, segmented control, avatar, and chit.
+  - `contain: layout` on dialog/popup/tooltip surfaces and fill picker dialog.
+- `fig-handle` example in Propkit playground.
+
+### Changed
+
+- Gradient interpolation UI merged into a single dropdown with optgroups (sRGB / OKLab / OKLCH) and a "Mixing" label, moved below the gradient preview.
+- Default gradient example updated to `#7AEA66` → `#FF00BF` at 90°.
+
+## [3.12.0]
+
+### Added
+
+- Color input mode switcher in solid fill picker — dropdown to choose between Hex, RGB, HSL, HSB, LAB (OKLab), and LCH (OKLCH) input modes.
+- OKLab/OKLCH reverse conversion utilities (`#oklabToRGB`, `#oklchToRGB`) for bidirectional color editing in perceptual color spaces.
+- Tooltips on each color component input (e.g. "Red", "Hue", "Lightness", "Chroma").
+- Gamut selector (sRGB / Display P3) in fill picker dialog header, affecting both solid canvas rendering and gradient stop color format.
+- Eyedropper button repositioned into `.fig-fill-picker-sliders` grid with "Sample color" tooltip.
+- Color input mode preference persisted via localStorage.
+
+### Changed
+
+- Solid fill picker inputs area now uses a `fig-dropdown` + dynamic `input-combo` fields instead of a single `fig-input-color`.
+- `.fig-fill-picker-sliders` uses CSS grid layout with eyedropper spanning the left column.
+- Sliders no longer wrapped in `fig-field` elements inside `.fig-fill-picker-sliders`.
+- Gradient interpolation dropdown trimmed to sRGB Linear, OKLab, and OKLCH (gamut selection moved to top-level header).
+- Default gradient `interpolationSpace` changed from `srgb` to `oklab`.
+
+## [3.11.0]
+
+### Added
+
+- New `fig-input-gradient` component — a gradient-only fill input that opens `fig-fill-picker` locked to gradient mode.
+- Gradient color interpolation support: `interpolationSpace` (`srgb`, `srgb-linear`, `display-p3`, `oklab`, `oklch`) and `hueInterpolation` (`shorter`, `longer`, `increasing`, `decreasing`) for OKLCH.
+- `fig-preview` component for displaying gradient bar previews with stop handles.
+- Gradient interpolation UI in `fig-fill-picker`: space dropdown and hue interpolation dropdown (shown for OKLCH).
+- Playground section and Attributes View support for `fig-input-gradient`.
+- README documentation for `fig-input-gradient` and gradient interpolation spaces.
+
+### Fixed
+
+- Fixed gradient CSS interpolation syntax — the `in <color-space>` clause was incorrectly placed as a separate comma-delimited argument instead of within the same argument group as the direction/angle (e.g. `conic-gradient(from 180deg in oklch shorter hue, ...)` instead of the invalid `conic-gradient(in oklch shorter hue, from 180deg, ...)`). This caused browsers to reject the interpolation and silently fall back to sRGB.
+
+### Changed
+
+- `fig-input-fill` and `fig-fill-picker` gradient value shape now includes `interpolationSpace` (and `hueInterpolation` for OKLCH).
+- Updated `fig-input-fill` and `fig-input-color` focus/popup-open outline styling with `.has-popup-open` class.
+- Refined `fig-input-fill` internal CSS selectors for label/input padding to avoid conflicts with `fig-input-gradient`.
+
+## [3.10.0]
+
+### Added
+
+- `fig-skeleton` component and editor scaffold.
+
+## [3.9.3]
+
+### Changed
+
+- Added `dial` attribute support to `fig-input-angle` (defaults to `true`; `dial="false"` hides the circular dial).
+- Renamed `show-rotations` usage to `rotations` for `fig-input-angle` while keeping backward-compatible alias support.
+- Added `Dial` and `Rotations` controls to playground Attributes View for `fig-input-angle`.
+- Updated `fig-input-angle` layout so its number input keeps intrinsic width by default, while `full` mode still expands as expected.
+- Updated `README` docs for `fig-input-angle` to cover `dial` and `rotations`.
+
+## [3.9.2]
+
+### Changed
+
+- Updated `fig-choice` styling with reusable tokens for padding and selection-ring width, and adjusted selected-state visuals to use a secondary background plus an image outline ring.
+
+### Fixed
+
+- Removed disabled-state opacity dimming from `fig-chit` so disabled chips keep consistent text/icon contrast.
+
+## [3.9.1]
+
+### Fixed
+
+- Synced segmented-control playground examples to explicitly use `sizing="equal"` so Attributes View and code markup stay aligned by default on `/figui3` and `/propkit`.
+
+## [3.9.0]
+
+### Added
+
+- Added `animated` and `sizing` attributes to `fig-segmented-control`.
+- Added a sliding selected-segment indicator for `fig-segmented-control` when `animated` is enabled.
+- Added `Animated` and `Sizing` controls for segmented controls in playground Attributes View.
+
+### Changed
+
+- Updated segmented-control sizing so `sizing="auto"` keeps intrinsic width, including when `full` is present.
+- Updated playground segmented-control examples on `/figui3` and `/propkit` so `Animated` defaults to off in Attributes View.
+- Updated 3D Rotate `fields` options in playground Attributes View to `None`, `X, Y, Z`, and `X, Y`.
+- Updated segmented-control docs in `README.md` to include `animated` and `sizing`.
+
+### Fixed
+
+- Fixed animated segmented-control flicker by stabilizing indicator sync during transient layout/mutation frames.
+- Fixed playground animated segmented-control flashing by avoiding value persistence re-renders for animated controls.
+
+## [3.8.2]
+
+### Changed
+
+- Changed easing curve arm stroke from `--figma-color-border-strong` to `--figma-color-bordertranslucent` for a softer appearance.
+
+## [3.8.1]
+
+### Changed
+
+- Reduced easing curve handle radius from 6 to 5 for bezier and spring handles.
+- Updated duration bar width from 4.25 to 5.
+- Switched `fig-handle` inside easing curve handles to use explicit `--width`/`--height` CSS vars instead of `width: 100%; height: 100%`.
+
+## [3.8.0]
+
+### Added
+
+- Added `fig-handle` component — a reusable, style-customizable handle element with CSS vars for `--width`, `--height`, `--fill`, `--border-radius`, `--box-shadow`, `--outline`, and `--border`.
+- Added `--icon-reset` icon token.
+- Added reset button to `fig-joystick` that appears when the value differs from the default (50% 50%) and resets on click. Exposes `default` attribute and `--is-not-default` CSS var.
+- Added `:host` selectors to `base.css` and `components.css` root rules for shadow DOM compatibility.
+
+### Changed
+
+- Refactored `fig-joystick` to use `fig-handle` instead of a styled div.
+- Refactored `fig-origin-grid` to use `fig-handle` instead of a styled span, setting `--border-radius` to match the original rounded-square shape.
+- Refactored `fig-easing-curve` handles to use `foreignObject` + `fig-handle` instead of SVG circles, and the duration bar to use `foreignObject` + `fig-handle` instead of an SVG rect.
+- Increased easing curve handle size from 8.5 to 12 SVG units.
+- Removed unused easing curve CSS variables (`--easing-duration-bar-fill`, `--easing-duration-bar-stroke`, `--easing-duration-bar-stroke-width`).
+- Added `/sandbox` route documentation to README.
+
+## [3.7.0]
+
+### Added
+
+- Added `steppers` passthrough support to `fig-field-slider`, forwarding to its internal `fig-input-number`.
+- Added a `Steppers` toggle to the `/propkit` field-slider attributes controls.
+
+### Changed
+
+- Updated `fig-origin-grid` and `fig-joystick` handle visuals for a more consistent compact handle treatment.
+- Added configurable slider thumb outline tokens and applied focus-outline styling for `fig-field-slider` thumbs.
+- Refined `fig-field-slider` number-input pill styling with explicit border radius.
+
+### Fixed
+
+- Fixed `fig-field-slider` steppers sync so the internal number input stays in sync after slider re-renders.
+- Fixed overflowed `fig-origin-grid` handles to suppress regular handle box-shadow in arrow-mask overflow states.
+
+## [3.6.0]
+
+### Added
+
+- Added `fig-field-slider` component that composes `fig-field` + `fig-slider`, defaults to `label="Label"`, `direction="horizontal"`, and `text="true"`, and re-emits `input`/`change` events.
+- Added a top-level **Field Slider** section to `/propkit` playground with a dedicated example.
+- Added slider styling tokens: `--slider-thumb-color`, `--slider-thumb-radius`, `--slider-tick-width`, `--slider-tick-height`, `--slider-tick-radius`, `--slider-tick-opacity`, and `--slider-stepper-padding`.
+
+### Changed
+
+- Refined `fig-field-slider` visuals to a full-surface style with custom thumb/tick sizing, opacity, radius, and masking behavior.
+- Updated `/propkit` field-slider attributes view ordering and visibility (type-first; removed direction/value/min/max/step/placeholder/default/precision controls).
+
+### Fixed
+
+- Fixed `fig-field-slider` slider type updates not always reflecting visually by improving initial attribute sync timing.
+- Fixed field-slider type defaults so `type="delta"` and `type="stepper"` enforce `default="50"`, and stepper enforces `step="10"` when not explicitly provided.
+- Fixed blank label handling in `fig-field-slider` so `label=""` removes the rendered label element.
+
+## [3.5.0]
+
+### Added
+
+- Added `checkerboard` attribute for `fig-image` — shows a checkerboard pattern behind the image, passed through to the inner `fig-chit`.
+- Added `checkerboard` attribute for `fig-chit` — displays a checkerboard background via CSS.
+- Added `--chit-bg-repeat` CSS variable to `fig-chit` for controllable background repeat behavior.
+- Added "Checker" toggle to image attributes view in playground.
+
+### Fixed
+
+- Fixed `fig-chit` not resolving CSS variable backgrounds — added `#resolveBackground` that computes actual values from `var()` references.
+- Fixed `fig-chit` `#detectType` treating empty `url()` as an image type — now checks for a non-empty URL source.
+- Fixed `fig-chit` `::after` background shorthand resetting longhand properties (size, position, repeat) — switched to `background-image` with individual longhands.
+- Fixed `fig-image` defaulting to `background="url()"` when no source is set — now uses `var(--figma-color-bg-secondary)` or empty `url()` when checkerboard is active.
+- Fixed `fig-image` always forcing `data-type="image"` on its inner `fig-chit` for consistent thumbnail rendering.
+
+## [3.4.3]
+
+### Fixed
+
+- Fixed drag toggle not syncing correctly in chooser attributes view — bare boolean attributes now read as `true` in string bool mode.
+- Fixed playground `#app` min-width to account for main content padding.
+- Fixed attributes sidebar switching to `absolute` positioning at narrow viewports to prevent overlap when horizontally scrolling.
+
+### Changed
+
+- Added default `axis-labels="X Y"` to joystick example in `/propkit`.
+- Removed stale verification screenshots and reports.
+
+## [3.4.2]
+
+### Fixed
+
+- Fixed `fig-segmented-control[full]` and `fig-dropdown[full]` to respect `full="false"` via `:not([full="false"])` guard.
+- Added missing `full` attribute support for `fig-dropdown`.
+
+## [3.4.1]
+
+### Fixed
+
+- Fixed playground URL path handling to preserve trailing slash style, preventing routing issues when embedded in external sites.
+- Prevented no-op `replaceState` calls in playground navigation that could interfere with host routing.
+
+### Changed
+
+- Removed chooser example from `/figui3` playground (still available in `/propkit`).
+
+## [3.4.0]
+
+### Added
+
+- Added `fig-chooser` component with keyboard navigation, selection management, and scroll overflow detection.
+- Added `overflow` attribute for `fig-chooser` — `overflow="buttons"` (default) uses custom nav buttons with easing gradients, `overflow="scrollbar"` shows native scrollbars.
+- Added `drag` attribute for `fig-chooser` — enables drag-to-scroll (on by default, set `drag="false"` to disable).
+- Added `loop` attribute for `fig-chooser` — when present, arrow key navigation wraps around; when absent, stops at edges.
+- Added `fig-choice` element with selected, hover, and disabled states.
+- Added `--eased-fade-stops` CSS variable to `:root` for reusable easing gradients.
+- Added chooser example to `/propkit` playground with image grid, layout/overflow/max-size/drag/loop controls.
+- Added URL-based state sharing in the playground — attribute changes are reflected in the URL for shareable links.
+- Added right-pinned attributes sidebar to the playground layout.
+
+### Changed
+
+- Moved `AttributesView` panels to a fixed right sidebar with separated sections.
+- Switched playground placeholder images to `picsum.photos` for reliability.
+- Removed `focus-visible` outline from `fig-choice` in favor of selected style for keyboard navigation.
+- Suppressed hover style on selected `fig-choice` elements.
+
+### Fixed
+
+- Fixed `fig-chooser` layout change not syncing max-size style — moved handler from dead code path to dropdown onChange.
+- Fixed playground URL parameters being lost on page refresh.
+- Fixed `fig-field` label toggle state not persisting via URL parameters.
+- Added missing `*.svg?raw` module declaration to fix TypeScript build.
+
+## [3.3.0]
+
+### Fixed
+
+- Fixed `fig-tabs` not selecting the initial tab when `value` attribute is set — `#selectByValue` and `handleClick` now properly set the `selected` attribute on the matching `fig-tab`.
+- Deferred initial tab selection in `fig-tabs` to `requestAnimationFrame` to ensure child elements are upgraded before selection runs.
+
+### Added
+
+- Added `[full]` attribute support for `fig-input-angle` (CSS and playground toggle).
+- Added `theme="auto"` for `fig-toast` — automatically resolves to the opposite of the page's current `color-scheme` at show time.
+- Added `theme="success"` option for `fig-toast`.
+- Added "Icon" toggle and "Borderless" toggle to the `fig-header` playground attributes view.
+- Added "Prepend" field steppers to popup offset inputs in the playground.
+
+### Changed
+
+- Renamed "Input Angle" section to "Angle input" and moved it below "Number input" in the `/figui3` playground nav.
+- Renamed tabs attributes view header to "Tabs" and removed unused `value`, `name`, and `disabled` fields.
+- Refactored copy prompt to derive from the code markup string instead of querying the live DOM, making it work for both `/figui3` and `/propkit` examples.
+- Applied sentence case to all playground attributes view labels and headings.
+- Set `columns="thirds"` on all attributes view fields for consistent layout.
+
+## [3.2.0]
+
+### Added
+
+- Added a new `Icons` segmented control example to the `/figui3` playground, reusing the same icon set as `/propkit` for consistency.
+
+### Changed
+
+- Updated `/figui3` segmented control attributes to hide `value` and `name` fields in the Attributes panel, matching `/propkit`.
+- Renamed the default `/figui3` segmented control example label from `Default` to `Text`.
+
+## [3.1.0]
+
+### Added
+
+- Added value-driven segmented control behavior so setting `fig-segmented-control[value]` selects the matching segment, with fallback matching from `fig-segment` text content when segment `value` is omitted.
+- Added bubbling `input` and `change` events for `fig-segmented-control` with the resolved selected value in `event.detail`.
+
+### Changed
+
+- Updated playground page titles for `/figui3` and `/propkit` routes with framework-agnostic descriptions.
+- Updated Propkit segmented control attributes UI to hide `value` and `name` controls.
+- Updated code/prompt export sanitization to strip `data-playground-*` attributes from generated snippets.
+- Documented segmented control matching rules, precedence, and event behavior in `README.md`.
+
+### Fixed
+
+- Fixed a segmented control mutation-resync feedback loop that could cause the playground to hang on load.
+
+## [3.0.3]
+
+### Changed
+
+- Updated segmented control playground examples in `/figui3` and `/propkit` to hide `value` and `name` in the Attributes panel.
+- Added per-example `data-playground-hide-attrs` support so demo controls can suppress specific attribute fields without changing global rules.
+
+## [3.0.2]
+
+### Changed
+
+- Updated joystick and fill picker handle elevation styling to use `--figma-elevation-100-canvas` for consistent control depth.
+- Simplified related hover-shadow behavior for joystick/fill picker handles and cleaned up nested `fig-layer` open-state selector structure.
+
+## [3.0.1]
+
+### Fixed
+
+- Fixed `fig-joystick` layering so axis labels render below the handle by adjusting z-index order.
+
+## [3.0.0]
+
+### Added
+
+- Added new `fig-joystick` component tag with percentage-first value handling (`50% 50%` default), `fields`, `aspect-ratio`, and `axis-labels` support.
+- Added joystick axis label rendering around the control plane with top/left/right/bottom placement rules and PropKit attributes integration.
+- Added live joystick value persistence in the playground code/preview flow, matching origin-grid behavior to avoid scrub interruption re-renders.
+
+### Changed
+
+- **Breaking:** Renamed joystick tag from `fig-input-joystick` to `fig-joystick` and updated docs/playground/type mappings to use the new element name.
+- Updated joystick handle visuals to match the color picker handle treatment and refined axis label typography styling.
+
+### Fixed
+
+- Fixed joystick X/Y field scrubbing in playground scenarios by aligning commit semantics with origin-grid (`input` during interaction, `change` on focus-out/release).
+
+## [2.39.0]
+
+### Added
+
+- Added WebKit/iOS customized built-in support by loading a vendored `@ungap/custom-elements-builtin` polyfill when native support is unavailable.
+- Added `polyfills/` to published package files so runtime polyfill imports resolve correctly for consumers.
+
+### Changed
+
+- Updated customized built-in registrations (`fig-dialog`, `fig-popup`, `fig-toast`) to use a polyfill-aware define helper and avoid duplicate element definitions.
+- Updated README CDN script examples to use `type="module"` and documented SSR guidance for client-only `fig.js` imports.
+- Refined playground nav list styling with vertical spacing and scroll-edge gradient fades.
+
+### Fixed
+
+- Fixed playground nav behavior by removing wheel-based auto-advance between examples so wheel/trackpad scrolling stays native.
+- Fixed playground dropdown value syncing by binding `<fig-dropdown value>` directly and removing per-option `selected` attributes.
+- Fixed attribute rules typing to allow nullable `trueValue` for boolean controls.
+
+## [2.38.3]
+
+### Changed
+
+- Published a patch release with no runtime code changes to keep package and changelog versions aligned.
+
+## [2.38.2]
+
+### Changed
+
+- Updated playground `/figui3` popup attributes controls so `offset` edits use split X/Y numeric inputs (`fig-input-number` with prepend labels) and serialize back to the single `offset="x y"` attribute.
+- Updated playground `/figui3` popup `viewport-margin` control to use `fig-input-number` for numeric editing.
+
+### Fixed
+
+- Fixed popup `offset` attribute syncing in playground attributes when using numeric inputs by accepting both number and string event payloads.
+
+## [2.38.1]
+
+### Fixed
+
+- Fixed playground layout so `.propkit-code-view` no longer shrinks in flex containers.
+
+## [2.38.0]
+
+### Added
+
+- Added new `fig-origin-grid` component for transform-origin editing with optional `fields`, draggable handle interaction, and click-to-cell-center placement.
+- Added PropKit integration for `fig-origin-grid` including section example, JSX typing, and attributes panel support.
+- Added overflow-aware handle states for out-of-bounds values, including directional classes and masked arrow indicator styling.
+
+### Changed
+
+- Updated `fig-origin-grid` drag and click behavior to separate click vs drag intent, enable freeform out-of-bounds dragging, and support Shift snapping.
+- Updated `fig-origin-grid` value parsing/sync so single-value origins mirror to both axes and X/Y fields stay synchronized with component value changes.
+- Updated origin handle overflow nudge behavior with aspect-ratio-aware offset scaling.
+
+### Fixed
+
+- Fixed playground scrub interruptions for `fig-origin-grid` X/Y number fields by emitting commit `change` on field focus-out instead of every scrub tick.
+- Fixed `fig-origin-grid` drag cursor behavior so grabbing only appears after actual drag threshold crossing.
+
+## [2.37.0]
+
+### Added
+
+- Added `placeholder` passthrough support on `fig-slider` so `text="true"` forwards placeholder text to its internal `fig-input-number`.
+
+### Changed
+
+- `fig-slider` now normalizes missing/empty/invalid `value` inputs with type-aware fallbacks (`min` for standard sliders, `default` then `0` for delta) while keeping drag interaction available.
+- In slider text mode, clearing the value now keeps the numeric field visually blank (showing placeholder when present) while preserving an internal fallback thumb position.
+- Playground attributes now only shows `fig-slider` `placeholder` when `text` is enabled.
+
+## [2.36.0]
+
+### Added
+
+- Added `selected` attribute to `fig-3d-rotate` that applies a `selected` class to the named face (e.g. `selected="front"`).
+- Added `drag` boolean attribute to `fig-3d-rotate` (default true). Setting `drag="false"` disables cube drag rotation and switches the cursor to default.
+- Added `.selected` face styling with `--figma-color-border-strong` background and border radius.
+
+## [2.35.0]
+
+### Added
+
+- Added `perspective-origin` and `transform-origin` attributes to `fig-3d-rotate`, synced to CSS custom properties `--perspective-origin` and `--transform-origin`.
+- `transform-origin` auto-preserves the default `-50cqi` Z depth when only two values (X Y) are provided.
+
+### Fixed
+
+- Fixed `fig-3d-rotate` drag release outside the window by using `setPointerCapture` with `pointercancel` and `lostpointercapture` listeners, matching the color picker fix.
+
+## [2.34.0]
+
+### Added
+
+- Added configurable `perspective` attribute to `fig-3d-rotate` for controlling the 3D depth effect, with a `--perspective` CSS custom property.
+- Added gradient edge borders on each side face of the `fig-3d-rotate` cube that fade from the front face backward, using per-face `border-image` gradients with `--border-start-color` / `--border-end-color` tokens.
+- Added `perspective` toggle and `perspective-distance` slider controls to the playground attributes panel for `fig-3d-rotate`.
+- Added value persistence for `fig-3d-rotate` in the playground so drag interactions survive markup re-renders.
+- Added empty-string option to `fig-3d-rotate` `fields` enum for clearing visible input fields.
+
+### Changed
+
+- Improved `fig-3d-rotate` cube centering with `container-type: inline-size` and `transform-origin: 50% 50% -50cqi` for more accurate 3D rotation.
+- Updated `fig-3d-rotate` to sync the `value` attribute on both `input` and `change` events during drag interactions.
+
+## [2.33.4]
+
+### Changed
+
+- Improved playground nav wheel behavior to be overflow-aware: nav lists now scroll naturally first, then advance examples at scroll boundaries.
+- Updated `.nav-links` overflow styling with thin, low-profile scrollbars for a cleaner navigation panel appearance.
+
+### Fixed
+
+- Fixed fill-picker color handle drag state to reliably end on pointer cancel/lost capture and when pointer buttons are released outside the picker/window.
+- Fixed numeric alt-drag scrubbing (`fig-input-text[type="number"]`, `fig-input-number`) so drag state and cursor reset correctly when release happens outside the window.
+
+## [2.33.3]
+
+### Changed
+
+- Centered the playground example container within the main layout for more consistent `/figui3` presentation.
+- Updated `.propkit-example` spacing to use horizontal zero padding while preserving vertical padding.
+
+## [2.33.2]
+
+### Added
+
+- Added a `Layer` section back to the `/figui3` playground with examples for icon and no-icon rows, including nested child layers.
+
+### Changed
+
+- Updated the icon-based layer example to default to `open` and `selected` on the parent with a selected nested child for clearer selection-state demos.
+- Refined playground panel spacing and related component styling polish for the latest `/figui3` examples.
+
+### Fixed
+
+- Simplified shimmer direction empty-state labeling in attributes view from `Default (horizontal)` to `Default`.
+
+## [2.33.1]
+
+### Changed
+
+- Updated `README.md` to reflect current FigUI3 workflows, including a dedicated playground usage section and refreshed popup/field/toast docs.
+- Updated playground attributes panel spacing by increasing `.propkit-attributes-content` bottom padding to `var(--spacer-2-5)`.
+
+### Fixed
+
+- Removed `index.html` from published package files and retained the docs source in-repo as `old.html`.
+
+## [2.33.0]
+
+### Added
+
+- Added a new `/playground` app flow for both FigUI3 and PropKit examples, including interactive preview, attribute editing, and code view tooling.
+- Added richer FigUI3 field and popup authoring controls in the playground (field input presets, columns presets, popup theme/viewport margin/expanded position options).
+
+### Changed
+
+- Replaced legacy standalone PropKit pages/app files with the unified playground implementation and refreshed related skills/docs references.
+- Updated FigUI3 examples for header, popup, and toast to use more realistic trigger/icon patterns and current component structure.
+
+### Fixed
+
+- Fixed playground code view sanitization to hide internal-only field attributes while preserving them during code-edit roundtrips.
+- Fixed enum/dropdown value syncing in attributes view (including popup theme selection) and improved fig-popup beak alignment calculations on horizontal placements.
+
+## [2.32.0]
+
+### Added
+
+- Added a PropKit nav footer install helper with a readonly `fig-input-text` command field plus copy buttons for both command and install prompt.
+- Added contextual nav copy toasts (`Command copied` / `Prompt copied`) to match existing PropKit copy feedback patterns.
+- Added SVG-focused CodeMirror folding behavior in PropKit code view, with subtle fold placeholder styling.
+- Added an icon-only `Icons` example to the segmented control section.
+
+### Changed
+
+- Renamed the segment section to `Segmented control` and updated the text example label to `Text`.
+- Updated attributes input panel titles to use section-aware names (for example `Segmented control` instead of `Input`).
+- Hid empty attributes input panels when there are no visible controls to render.
+- Constrained PropKit code view/editor height with internal scrolling so long markup does not overflow the viewport.
+
+### Fixed
+
+- Fixed PropKit image upload persistence by writing uploaded image sources into editable markup so subsequent attribute edits keep the uploaded image.
+- Fixed image fit attribute controls by removing `50%` from fit options and treating `fit=auto` as attribute removal for better sync.
+- Added `readonly` support to `fig-input-text` so readonly fields are truly non-editable and reactive to attribute changes.
+
+## [2.31.2]
+
+### Changed
+
+- Tuned PropKit `.propkit-example` dash-inset spacing for cleaner vertical rhythm in preview blocks.
+- Updated units dropdown options in PropKit attributes by removing `turn` and `rem`.
+
+### Fixed
+
+- Fixed PropKit slider variant controls by removing forced slider variant overrides in preview rendering and defaulting variant selection to `default` when no variant attribute is set.
+- Fixed `fig-slider` variant reactivity by observing `variant` attribute changes and regenerating internals when variant updates.
+
+## [2.31.1]
+
+### Changed
+
+- Refined PropKit layout spacing by tightening `main` description spacing and updating `.propkit-example` vertical dash-inset margins.
+
+## [2.31.0]
+
+### Added
+
+- Added context-aware copy toasts in PropKit code actions (`HTML copied` / `Prompt copied`).
+- Added new PropKit examples for dropdown optgroups (`Groups`, `Labelled groups`) and switch `Indeterminate`.
+- Added per-field `Label` toggle controls in PropKit attributes to add/remove the `label` element from each `fig-field`.
+
+### Changed
+
+- Refined PropKit attributes UI into two stacked panels: `Field` controls (`Direction`, `Label`) and `Input` controls.
+- Updated PropKit nav behavior for single-example sections so the parent row is directly selectable without rendering a nested child row.
+- Curated PropKit examples by removing the Dial section and trimming extra Easing Curve and 3D Rotate variants.
+
+### Fixed
+
+- Fixed `fig-input-number` native steppers to honor decimal `step` values (e.g. `0.5`) and keep native `min`/`max`/`step` attributes synchronized.
+- Fixed switch/checkbox indeterminate state syncing so setting `checked` clears indeterminate visuals correctly.
+
+## [2.30.1]
+
+### Fixed
+
+- Ensure `.input-combo > label` uses explicit text-color token resolution so `fig-input-fill` labels render with the correct scheme-driven text color.
+
+## [2.30.0]
+
+### Added
+
+- Added a full `propkit/` React + Vite app for interactive PropKit exploration, including section/example navigation and live preview composition.
+- Added live CodeMirror-to-preview syncing so editing example markup re-renders the active example immediately.
+- Added a dynamic `Attributes` panel in PropKit that parses `fig-field` + primary `fig-*` controls and maps attributes to native FigUI controls.
+- Added a new `Number` section with `fig-input-number` examples and attribute mappings.
+- Added a new project skill: `.cursor/skills/nested-css-selectors/`.
+
+### Changed
+
+- Updated PropKit layout and styles, including nested CSS refactors, top-aligned centered main content, and refined code/attributes panel headers.
+- Updated PropKit example metadata and curation (removed redundant gradient/image/slider variants, removed combined panel, and refined example naming).
+- Renamed example wrapper usage from `.prop-panel` to `.propkit-example`, with backward-compatible unwrap handling and standardized re-wrap behavior.
+- Updated `.propkit-example` styling to remove the border and use opposite `color-scheme` for stronger visual contrast.
+- Updated `Attributes` panel behavior with targeted control rules (segmented control for `direction`, constrained aspect-ratio options, and specialized 3D rotate field labels/options).
+- Removed `fig-popover` and `fig-popover-2` component implementations and associated demo/docs usage; popup guidance now centers on `fig-popup`.
+- Updated `glitch.html` to use a `fig-popup` example instead of `fig-popover`.
+
+### Fixed
+
+- Fixed `fig-image` attribute reactivity for `upload`/`download` by supporting presence-style booleans, observing `download`, and handling each attribute independently in `attributeChangedCallback`.
+- Fixed enum dropdown value handling in PropKit attributes so displayed sentence-case labels no longer corrupt raw attribute values (notably `fig-3d-rotate` fields).
+
+
+## [2.29.3]
+
+### Fixed
+
+- Fix `querySelector` crash in propkit when navigating to `#3d-rotate` (IDs starting with a digit are invalid CSS selectors); switched to `getElementById`.
+
+## [2.29.2]
+
+### Fixed
+
+- Include `propkit.html` and `.cursor/skills/` in published npm package.
+
+## [2.29.1]
+
+### Changed
+
+- Reduced `fig-3d-rotate` field input flex-basis from `4rem` to `3rem` for tighter layouts.
+
+## [2.29.0]
+
+### Added
+
+- `fig-3d-rotate` now supports a `fields` attribute to render `fig-input-number` inputs for specified axes (e.g. `fields="rotateX,rotateY,rotateZ"`), with two-way sync between the cube preview and number fields.
+- Number fields use degree units, `precision="1"`, and flex-wrap responsively with a `4rem` min-width per field.
+- Added propkit examples for fields: all axes, Y only, X & Y, fields with 16:9 aspect ratio and preset values, and fields without a label.
+
+### Changed
+
+- `fig-3d-rotate` layout updated to `flex-wrap: wrap` with gap for proper field stacking below the cube container.
+- `fig-3d-rotate` now constrains properly inside horizontal `fig-field` via `min-width: 0`.
+
+### Fixed
+
+- `fig-3d-rotate` field inputs now intercept both `input` and `change` events from child `fig-input-number` elements, preventing mismatched event detail leaking to consumers.
+
+## [2.28.0]
+
+### Fixed
+
+- Added missing `#wasDragged` private field declaration in `FigPopup` to prevent runtime syntax errors in popup drag/reposition logic.
+
+## [2.27.0]
+
+### Changed
+
+- Refined easing curve editor visuals with rounded stroke caps/joins and padded drawing container for clearer spring/bezier presentation.
+
+### Fixed
+
+- `fig-popup` now stops anchor-based auto-repositioning after the user manually drags an anchored, draggable popup, preserving manual placement.
+
+## [2.26.0]
+
+### Added
+
+- New `fig-easing-curve` component with bezier and spring editing, preset dropdown support, and `input`/`change` events exposing `value`, `cssValue`, `mode`, and `preset`.
+- New `propkit.html` demo page with focused property-field examples, including image, color, fill, slider variants, switch, dropdown, segment, angle, and easing curve sections.
+- Copy-prompt helpers in `propkit.html` section subheaders, including one-click prompt copy and toast feedback.
+
+### Changed
+
+- `fig-easing-curve` spring editor now keeps duration marker behavior aligned to the rendered spring timeline and improves handle interaction/visual consistency.
+- Easing curve icon generation now uses 24x24 icons with 6px padding and dynamic custom preset icon refresh.
+- Sliders in `propkit.html` now use the modern compact slider appearance.
+- `fig-image` now supports `aspect-ratio` and `fit` mapping to internal CSS vars for richer image layout control.
+
+### Fixed
+
+- Tooltip warmup behavior: recently shown tooltips now open instantly during rapid hover transitions.
+- `fig-input-fill` now supports `alpha="false"` and hides opacity controls when alpha is disabled.
+- Easing curve bezier diagonal reference line visibility and spring duration marker rendering issues in demos.
+
+## [2.25.0]
+
+### Added
+
+- Custom mode slots for `fig-fill-picker` — add custom tabs via `slot="mode-*"` children (e.g., `<div slot="mode-shader" label="Shader">`). The mode name must also appear in the `mode` attribute.
+- `modeready` event on `fig-fill-picker` — fires per custom mode with `{ mode, container }` detail, giving frameworks like React a stable DOM target to render into without DOM reparenting.
+- `picker-*` attribute forwarding on `fig-input-color` and `fig-input-fill` — attributes like `picker-anchor` and `picker-dialog-position` are forwarded to the underlying `fig-fill-picker`.
+- `picker-anchor` attribute on `fig-input-color` and `fig-input-fill` — set to `"self"` to anchor the fill picker to the entire input, or pass a CSS selector for a custom anchor element.
+- Custom trigger support examples for `fig-fill-picker` — buttons, icon buttons, inline text, and custom divs as triggers.
+- Custom mode demos: Shader mode with `fig-input-text multiline`, built-in mode override with a palette, and a React mode using `modeready`.
+- Prism.js syntax highlighting for code examples in the demo page.
+
+### Changed
+
+- `fig-input-fill` fill picker now defaults its anchor to the component itself (not just the chit).
+- Custom mode tabs in `fig-fill-picker` automatically get zero padding on `.fig-fill-picker-content`, giving slot content full control over layout.
+- `dialog-position` removed from `FigInputColor.observedAttributes` — use `picker-dialog-position` instead.
+- `fig-fill-picker` trigger detection now skips `slot="mode-*"` children when identifying the trigger element.
+
+### Fixed
+
+- Dropdown inner content now has `width: 100%` for proper sizing.
+- Ghost button active state now uses correct text color (`--figma-color-text`).
+
+## [2.24.0]
+
+### Changed
+
+- Improved FigImage teardown safety.
+
+## [2.23.0]
+
+### Added
+
+- `viewport-margin` attribute for `fig-popup` — defines per-edge safe areas (CSS margin shorthand: `top right bottom left`) that popups avoid during positioning. Useful for keeping popups clear of persistent UI like toolbars.
+- Viewport margin demo in the popup section showing a 64px bottom margin.
+
+### Fixed
+
+- Scroll events originating inside a popup no longer trigger repositioning.
+
+## [2.22.3]
+
+### Fixed
+
+- Large icon buttons now correctly sized at 32px: added `flex-basis` override and `padding: 0` to prevent `[icon]` flex-basis (24px) and `[size="large"]` padding from shrinking/padding the icon area.
+- Removed doubled padding on large text buttons: shadow DOM `:host([size="large"])` rule no longer adds its own padding (host padding suffices).
+
+## [2.22.2]
+
+### Added
+
+- Button combo examples for `variant="input"` and `variant="ghost"` in the demo page.
+- `size="large"` support for segmented controls with corresponding CSS.
+- `size="large"` examples for all icon button variants with 24x24 icons.
+
+### Fixed
+
+- Large buttons: shadow DOM inner `<button>` uses `:host([size="large"])` selectors to properly respond to the host's size attribute.
+
+## [2.22.1]
+
+### Changed
+
+- Popup shorthand positioning (`position="left"`, etc.) now smoothly slides the cross-axis to fit the viewport instead of snapping to discrete top/center/bottom alignments. Stays on the preferred side as long as the primary axis fits.
+- Popup scroll tracking is now synchronous (no RAF delay), eliminating 1-frame lag when scrolling. Scroll listener uses `{ passive: true }` to avoid blocking scroll performance.
+- Demo page sidebar width is now viewport-based (`15vw`, clamped between 180px–280px).
+
+## [2.22.0]
+
+### Added
+
+- `dialog-position` attribute pass-through for `fig-input-color` — allows controlling the popup direction of nested color pickers (defaults to `"left"`).
+- `#isInsideDescendantPopup` method on `fig-popup` — walks the popup anchor chain to determine logical containment across sibling `<dialog>` elements.
+
+### Fixed
+
+- Nested popup dismissal: interacting with a child popup (e.g., a gradient stop's color picker) no longer closes the parent popup. The outside-click handler now recognizes popups whose anchor chain traces back into the current popup.
+- Gradient stop color pickers now open to the right (`dialog-position="right"`) to avoid viewport-edge fallback to top positioning.
+
+### Changed
+
+- Refined popup fallback positioning: single-word `position` values (e.g., `left`) now try opposite then perpendicular axes; two-word values use smarter ordered candidates instead of a 3x3 matrix.
+- Removed hover `grab` cursor on draggable `fig-popup` (only shows `grabbing` while actively dragging).
+
+## [2.21.0]
+
+### Added
+
+- `autoresize` attribute for `fig-popup` (default: true). Set `autoresize="false"` to disable content-driven repositioning and auto-sizing CSS (`width: max-content`, `max-width`, `max-height`, `overflow`).
+- Drag cursor behavior for `fig-dialog` and `fig-popup`: `grab` on hover, `grabbing` while dragging (previously used `move`).
+- Left shorthand popup position example in the demo page.
+
+### Changed
+
+- Popup `position` semantics for two-word values: when vertical is `top` or `bottom`, horizontal `left`/`right` now means edge-alignment (e.g., `top left` = above anchor, left edges aligned) rather than side-placement. `center left`/`center right` retains side-placement behavior.
+- Fill picker popup (`fig-input-fill`, `fig-input-color`) now uses `position="left"` for correct side placement next to the trigger.
+- Nav width increased to 240px in the demo page.
+
+### Fixed
+
+- Fill picker popup anchoring: now anchors to the trigger element (`fig-chit` or button) instead of the `fig-fill-picker` wrapper, which uses `display: contents` and has no bounding box.
+- Fill picker popup sets `autoresize="false"` to prevent unwanted content-driven repositioning.
+
+## [2.20.0]
+
+### Added
+
+- Toolbelt component at the bottom of the demo page with sectioned icon button groups.
+- Non-modal dialog example with code showing `.show()` vs `.showModal()`.
+- `closedby` attribute documentation and live demos (`any`, `closerequest`, `none`) in the dialog section.
+
+### Changed
+
+- Elevation shadow variables (`--figma-elevation-*`, `--handle-shadow`) now use `light-dark()` inline for theme switching, removing the need for separate `.figma-dark` and `@media (prefers-color-scheme: dark)` override blocks.
+
+### Fixed
+
+- Dialog `closedby="none"` and `closedby="closerequest"` now properly prevent outside-click dismissal in the JS fallback handler.
+
+## [2.19.1]
+
+### Fixed
+
+- `@media (prefers-color-scheme)` blocks no longer conflict with manual theme switching via `color-scheme`. Scoped with `:not(.figma-dark):not(.figma-light)` so they only apply as a no-JS fallback; class-based overrides are now the primary mechanism.
+
+## [2.19.0]
+
+### Added
+
+- New `variant="input"` for `fig-button` — styled to match input fields with matching hover, active, and focus-visible states.
+- `--icon-chevron` added to the icons demo page.
+- Button demo examples for the input variant: default, with chevron icon, icon-only, and disabled states.
+
+### Fixed
+
+- `fig-input-fill` gradient label now updates when changing gradient subtype (e.g., Radial → Linear) without switching fill types.
+
+## [2.18.3]
+
+### Fixed
+
+- `fig-input-fill` gradient label now updates when changing gradient subtype (e.g., Radial → Linear) without switching fill types.
+
+## [2.18.2]
+
+### Fixed
+
+- Gradient stop opacity at 0% no longer snaps back to 100% — replaced `|| 100` with `?? 100` (nullish coalescing) so zero is not treated as falsy.
+- Color picker handle now updates its color when the hue slider changes — added missing `#updateHandlePosition()` call.
+
+### Added
+
+- Experimental attribute examples for `fig-fill-picker` and `fig-input-fill` in the demo page.
+
+## [2.18.1]
+
+### Added
+
+- Prepend/append slot elements on `fig-input-number` and `fig-input-text[type="number"]` now act as scrub handles — click and drag to scrub the value without holding alt/option.
+- `cursor: ew-resize` on slot elements in numeric inputs to indicate the drag affordance.
+- `react.html` test page for verifying web component behavior under React state-driven re-renders.
+
+### Changed
+
+- Alt-drag scrubbing no longer stops if the alt key is released mid-drag — once scrubbing starts, it continues until pointer release.
+
+## [2.18.0]
+
+### Fixed
+
+- **Interaction guard for framework re-renders**: Components with drag/scrub interactions no longer get clobbered when React (or other frameworks) set the `value` attribute during an active user gesture. Follows the same `#isDraggingColor` pattern already used by `fig-fill-picker`.
+  - `fig-input-number`: Guards alt-drag scrubbing and keyboard editing (focus/blur)
+  - `fig-input-text`: Guards alt-drag scrubbing for number type
+  - `fig-slider`: Guards native range input drag via pointerdown/pointerup
+  - `fig-input-angle`: Guards handle drag
+  - `fig-input-joystick`: Guards handle drag
+- **`fig-input-fill` no longer destroys DOM mid-interaction**: `attributeChangedCallback` now updates children in-place instead of doing a full re-render when the fill type hasn't changed.
+
+### Changed
+
+- `fig-slider` with `text="true"` now skips the range input in tab order (`tabindex="-1"`), so Tab goes directly to the text input.
+- `fig-input-color`, `fig-input-fill`, and `fig-slider` now properly flex and shrink inside horizontal `fig-field` layouts (`flex: 1; min-width: 0`).
+- Updated horizontal fields demo section with a resizable container and `full` attribute on all inputs.
+
+## [2.17.2]
+
+### Added
+
+- New `FigPopup` foundational floating component implemented as `<dialog is="fig-popup">`.
+- `FigPopup` supports:
+  - `anchor` selector binding (local-first lookup, then document fallback)
+  - `position` with two-value placement (`vertical horizontal`)
+  - single-value shorthand placement (`top`, `bottom`, `left`, `right`)
+  - `offset="x y"` with unitless values treated as pixels
+  - observer-driven repositioning on popup content changes and anchor resize
+- Added comprehensive Popup examples in `index.html`, including:
+  - default and explicit placements
+  - property API usage (`popup.open = true/false`)
+  - position matrix examples and single-value shorthand examples
+  - per-example code snippets
+
+### Changed
+
+- `FigPopup` outside-click behavior now closes by default (`closedby="any"` with fallback handling).
+- Popup open handling is idempotent (repeated open requests do not re-open/reinitialize when already open).
+- Default popup offsets are now `0 0` (both horizontal and vertical).
+- Popup demo anchors now bind directly to the corresponding open button (removed separate anchor-target buttons).
+
+## [2.17.1]
+
+### Changed
+
+- Moved `fig-footer` styles from page-local `index.html` styles into `components.css` for reusable component-level styling.
+- Added component-level sticky support for `fig-footer[sticky]`, including bottom stickiness and theme-aware background treatment.
+- Kept demo markup clean by removing duplicated `fig-footer` style definitions from `index.html`.
+
+## [2.17.0]
+
+### Added
+
+- Added a `fig-footer sticky="true"` demo to the main page with a settings control menu.
+- Added rich dropdown option examples using `fig-checkbox` controls for fill-application actions.
+
+### Changed
+
+- Refined sticky footer behavior in `index.html` to use true sticky semantics (content-bottom when short, sticky on overflow).
+- Updated settings menu trigger to follow the `fig-button type="select"` pattern used in button examples.
+- Improved `fig-dropdown` handling for persistent controls (`fig-checkbox`, `fig-switch`, checkbox inputs) in option content so interaction does not behave like standard pick-and-close selection.
+- Fixed `fig-checkbox` lifecycle behavior to prevent duplicate internal rendering when checkbox elements are cloned inside dropdown option content.
+
+## [2.16.0]
+
+### Added
+
+- `fig-segmented-control` now supports a `disabled` attribute
+- Added disabled segmented control examples in `index.html` for both text and icon variants
+
+## [2.15.0] - Breaking Changes
+
+### Changed
+
+- The `variant` attribute is now reserved for visual styling only.