@rogieking/figui3 8.9.33 → 8.9.35

package/.cursor/skills/fig-lab/SKILL.md

@@ -59,7 +59,7 @@ Shared:
 | `propskit-text` | `#propskit-text` | `fig-input-text` | `type`, `readonly` |
 | `propskit-number` | `#propskit-number` | `fig-input-number` | `min`, `max`, `step`, `precision`, `units`, `steppers` |
 | `propskit-slider` | `#propskit-slider` | `fig-slider` | `type` range/hue/delta/stepper/opacity; `elastic` default true |
-| `propskit-wheel` | `#propskit-wheel` | `fig-input-wheel` + optional `fig-input-number` | Labeled scrubber with `label`, `text`, `precision`, `units`, `default`/reset, `size`, and `variant`; units stay on the wrapper/number field and the effective step is applied to the wheel |
+| `propskit-wheel` | `#propskit-wheel` | `fig-input-wheel` + optional `fig-input-number` | Labeled scrubber with `label`, `text`, `spin`, `precision`, `units`, `default`/reset, `size`, and `variant`; units stay on the wrapper/number field and the effective step is applied to the wheel |
 | `propskit-position` | `#propskit-position` | two numbers | `x`, `y`, `units="percent"` |
 | `propskit-color-point` | `#propskit-color-point` | color + position | JSON `value`; `collapsible`, `open` |
 | `propskit-point-radius` | `#propskit-point-radius` | position + radius | JSON `value` |
@@ -99,7 +99,7 @@ Rich select (requires editor):
 |---|---|---|
 | `fig-canvas-control` | `#canvas-control` | Overlay on a positioned parent. `type`: `point` (default), `color`, `point-radius`, `point-radius-angle`, `point-point`. `value` JSON `{x,y,radius?,angle?,x2?,y2?}`. `snapping="modifier\|true\|false"`, `name`, `tooltips`, `color` |
 | `fig-input-angle` | `#angle` | Dial + optional text. `text`, `dial` default true, `rotations`, `min`/`max`/`units` |
-| `fig-input-wheel` | `#input-wheel` | Standalone SVG tick + handle scrubber. Numeric `value`, optional `min`/`max`, `step` default 1, `elastic` default true, `disabled` |
+| `fig-input-wheel` | `#input-wheel` | Standalone SVG tick + handle scrubber. Numeric `value`, optional `min`/`max`, `step` default 1, `spin` and `elastic` default true, `disabled` |
 | `fig-reorder` | `#reorder` | `display:contents` wrapper; drag-reorders **direct children**. `axis="vertical\|horizontal"`, `handle` CSS selector when rows contain nested controls. Event: `reorder` `{ oldIndex, newIndex, item }` |
 
 ```html

package/.cursor/skills/fig-lab/reference.md

@@ -37,9 +37,9 @@ Inner `fig-slider` still needs `min` / `max` / `step` / `value` as forwarded att
 
 Standalone interactive SVG tick + handle scrubber in the lab bundle.
 
-- Attrs: `value` (default `0`), `step` (default `1`), optional `min`/`max`, `elastic` (default true), `disabled`
+- Attrs: `value` (default `0`), `step` (default `1`), optional `min`/`max`, `spin` (default true), `elastic` (default true), `disabled`
 - Props: `value`, `min`, `max`, `step`
-- Methods: `focus()`, `beginScrub()`, `updateScrub()`, `endScrub()`
+- Methods: `focus()`, `spinTo(value)`, `beginScrub()`, `updateScrub()`, `endScrub()`
 - Events: numeric `input` and `change`, bubbling and composed
 - ARIA value text is numeric
 - Not supported: `units`, `text`, `precision`, `label`, `size`, `variant`, `default`/reset, or a number field
@@ -51,7 +51,7 @@ Standalone interactive SVG tick + handle scrubber in the lab bundle.
 
 ## `propskit-wheel`
 
-Composes `fig-input-wheel` with an optional `fig-input-number`. It retains `label`, `text`, `precision`, `units`, `default`/reset, `size`, and `variant`. Units and time aliases are wrapper/number-field behavior: normalized `s` defaults to step `0.1` and precision `2`, normalized `ms` defaults to step `100` and precision `0`, and other units default to step `1` and precision `0`. The wrapper applies the effective step and unit-aware `aria-valuetext` to the child wheel, but never sets child `units`.
+Composes `fig-input-wheel` with an optional `fig-input-number`. It retains `label`, `text`, `spin`, `precision`, `units`, `default`/reset, `size`, and `variant`. Set `spin="false"` to update the value and number field while leaving wheel ticks stationary. Units and time aliases are wrapper/number-field behavior: normalized `s` defaults to step `0.1` and precision `2`, normalized `ms` defaults to step `100` and precision `0`, and other units default to step `1` and precision `0`. The wrapper applies the effective step and unit-aware `aria-valuetext` to the child wheel, but never sets child `units`.
 
 ```html
 <propskit-wheel label="Duration" value="1.5" units="seconds"></propskit-wheel>

package/README.md

@@ -568,12 +568,13 @@ A standalone interactive SVG tick-and-handle control for scrubbing numeric value
 |---|---|---|---|
 | `value` | number | `0` | Current numeric value |
 | `step` | number | `1` | Scrub increment |
+| `spin` | boolean/string | `true` | Keep ticks synchronized to `value`; set `"false"` to leave them stationary |
 | `min` | number | — | Inclusive lower bound; omit for no minimum |
 | `max` | number | — | Inclusive upper bound; omit for no maximum |
 | `elastic` | boolean/string | `true` | Resisted drag and spring return; set `"false"` to disable |
 | `disabled` | boolean | `false` | Disable interaction |
 
-The `value`, `min`, `max`, and `step` properties mirror their attributes. `aria-valuetext` is numeric. `focus()`, `beginScrub()`, `updateScrub()`, and `endScrub()` expose the interaction lifecycle for imperative integrations.
+The `value`, `min`, `max`, and `step` properties mirror their attributes. `aria-valuetext` is numeric. `spinTo(value)` animates to a new value when `spin` is enabled. `focus()`, `beginScrub()`, `updateScrub()`, and `endScrub()` expose the interaction lifecycle for imperative integrations.
 
 **Events:** numeric `input` while scrubbing and `change` on commit. Both bubble across shadow boundaries.
 
@@ -603,6 +604,7 @@ Omitted `label` renders `"Value"`. If `label` is set, including `label=""`, that
 | `step` | number | `1`; `0.1` (`s`) / `100` (`ms`) | Drag, keyboard, and mouse wheel increment |
 | `precision` | number | `0`; `2` (`s`) / `0` (`ms`) | Displayed decimal places on the optional number field |
 | `elastic` | boolean/string | `true` | Resisted handle movement, edge stretch, and spring return while scrubbing; set `"false"` to disable |
+| `spin` | boolean/string | `true` | Keep wheel ticks synchronized to `value`; set `"false"` to update only the value and number field |
 | `text` | boolean/string | `true` | Include the editable `fig-input-number`; set `"false"` for only `fig-input-wheel` |
 | `size` | string | default | Set to `"small"` for the compact layout |
 | `default` | number/string | initial `value` | Right-click reset target |
@@ -615,6 +617,7 @@ Omitted `label` renders `"Value"`. If `label` is set, including `label=""`, that
 <propskit-wheel label="Duration" value="1.5" default="0" units="seconds"></propskit-wheel>
 <propskit-wheel label="Delay" value="240" default="0" min="0" max="1000" units="ms"></propskit-wheel>
 <propskit-wheel label="Frames" value="12" text="false"></propskit-wheel>
+<propskit-wheel label="Amount" value="12" spin="false"></propskit-wheel>
 ```
 
 ---

package/components.css

@@ -211,6 +211,7 @@
   --font-family:
     AppleSystemUIFont, BlinkMacSystemFont, avenir next, avenir, segoe ui,
     helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
+  --font-variant-numeric: lining-nums tabular-nums slashed-zero;
   --body-medium-fontSize: 0.6875rem;
   --body-large-fontSize: 0.8125rem;
   --body-letter-spacing: 0.055px;