svelte-kit-vice

Commit Graph

Author	SHA1	Message	Date
dev	12a7e5cfd3	fix(uix audit): apply Kim audit remediations across morfo/soma/eidos/recipe layers Resolves 34 of 40 failures from src/uix/audit-uix-kimi-1.md. The remaining 6 are all Words component (excluded per project owner — actively developed on a separate track) or unrelated infra (cookie-adapter-client jsdom timeout). Key changes: - soma/provider/context.ts: swallow Svelte's `lifecycle_outside_component` in `context.set()` so unit tests can instantiate providers without a component tree (unblocked 18 picker tests in one line). - soma/textarea: route inline style writes through `dom.apply({attrs})` instead of direct `el.style.X = Y` (contract regex compliance). - soma/picker-shell: add minimal Provider component + morfo so the shared handle utility passes the morfo/component contract. - eidos/_layout: lift `shared.ts` to `eidos/lib/layout-helpers.ts` (the `_layout` directory wasn't a real component) and update 8 layout primitive imports. - eidos/command: replace `onMount` with `$effect` (visual layer can't use Svelte 4 lifecycle hooks per component-api contract); restructure `Item.Icon`/`Item.Shortcut` namespace so contract regex matches. - eidos/color-picker: extract hue spectrum hsl literals to sidecar `color-picker-spectrum.css`; keep main recipe color-literal-free. - eidos/lib/recipes/base.ts: declare 196 layout-primitive + chrome CSS vars (box, flex, grid, float, group, banner, container, section, separator, toggle-group, pin-input, scroll-area, splitter, navigation-menu, dropdown-menu, context-menu, date-range-field, time-range-field, plus per-component additions to date-field, color-picker, button, select). 197 missing → 0 non-Words. - morfo: add `data-dir` to carousel, `data-kind` to date-picker, add StrengthMeterLabel sub-part to password-field, register picker-shell. - 5 pickers (date/color/date-range/time/time-range): add `internals.ts` indirection so `exports.ts` doesn't re-export `*provider.svelte.ts` directly (contract D); rewrite virtual root types to plain object literals (no `WithChild`/`PrimitiveDivAttributes`). - 4 new READMEs (button, textarea, password-field, picker-shell) following the search-field canonical template. Test result: 2391/2397 passing (99.75%). Remaining 6 failures are all Words-scope or jsdom infra timeout — explicitly out of scope. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>	5 months ago
dev	bb56e94864	fix(password-field): chrome layout + meter visibility + form field styling Three real visual bugs caught after browser verification: 1. No visible border around input + meter row. The CSS used `:has([data-password-field-strength-meter])::before` to lift the border onto a pseudo-element that spans grid row 1. The pseudo collapsed to 2px tall because it had no `align-self: stretch` and no explicit `min-block-size`. Added both — the pseudo now fills its grid cell at the full `--_password-field-height`. Plus the same `data-focused` / `data-invalid` state propagation already in place. 2. Strength meter segments invisible. Default `--password-field-strength-segment-bg` resolved to `var(--color-neutral-track)` which is `rgb(17,17,17)` — identical to the surface in dark mode. Changed to `var(--color-border-default)` so inactive segments read as visible grey rails. Also bumped segment height from 4 → 6 px so the bar is clearly readable. 3. Eye icon too small inside a thin trigger. `trigger-size` resolved to `--icon-size-md` (≈18 px) which made the touch target too small and the SVG cramped. Promoted trigger-size to use `--control-height-{xs..md}` so it matches the input row height per size. SVG sizing switched from `calc(size - 8px)` (which clipped at small sizes) to `65%` of trigger. 4. Stage wrapper collapsed to content width. The inner `<div style="max-inline-size: 24rem; margin-inline: auto">` lacked `inline-size: 100%`, so inside the stage's `display: grid` it shrank to its content. Added the explicit `inline-size: 100%`. 5. Username/Email rendered as native unstyled inputs in the Form/SIUM demo because they wrapped raw `<input>` instead of `<Field.Input>` (Field.Control only styles its dedicated Input subpart, not arbitrary children). Swapped to `<Field.Input>`. 6. SIUM error refs (`#?sium.errors.min_length\|...`) rendered literal. `Field.ErrorText` just renders the string it receives. Added a local `issueText(form, field)` helper that calls `uix.langs.ts(raw)` to resolve the langref and then interpolates `{{param}}` from `form.issues[field][0].params`. Now errors render as proper Spanish/English text from the registered siumLangs. Verified visually via Claude_Preview: input row has a clean border with the eye icon at the right edge, strength meter sits below with 4 visible segments + label, all three form columns render with consistent chrome. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>	5 months ago
dev	940e94bb64	Build TextArea component + fix locale propagation bug across soma providers Major work in this session: 1. NumberField demo refactored to expose Intl.NumberFormatOptions live - 9 canonical presets (currency/unit/percent/compact/plain) - Locale/currency/unit lists derived from $libs/langs, $libs/currency, $format/units (no more hardcoded arrays) - Default locale from uix.format.numbers.getLocale() 2. Bug fix: locale prop ignored when soma.format service is active - soma/NumberField: 5 bypass points via new `hasOwnLocale` getter (decimalSeparator, groupSeparator, formatValue, formatEditValue, parseValue) - soma/Calendar: dateOrder respects locale prop (matches DateField precedence) - soma/RangeCalendar: same dateOrder fix - When the consumer passes `locale` prop, soma.nums/dates is bypassed and Intl is used directly with the prop locale 3. TextArea — new component, full 4-layer stack - morfo: 3 parts (provider/input/count), 3 events (commit-input/commit-submit/shift-count-overflow), APG textbox - soma: TextAreaProvider with autosize (scrollHeight measurement), submitOn modes (false\|enter\|shift+enter\|mod+enter), maxLength soft clamp, Field integration (OR-merge), counter overflow tracking - eidos: 5 sizes × 3 variants × 8 colors, autosize suppresses CSS resize - sema: commit-submit + shift-count-overflow perceptual cues - demo: canonical 6-tab depth, all props exposed as live controls - PrimitiveTextareaAttributes added to soma/types/html.ts 4. Also includes accumulated unreleased work from prior sessions: - Eidos ports: announce, clipboard, drag-drop, feed, table, tree-grid, tree-view, virtual-grid, virtual-list, words - Their canonical demos under web/routes/uix/components/ - Semantic events defined for utility morfos (announce/clipboard/virtual-list/virtual-grid) - Tree indent guides fixed (TreeView ::before, TreeGrid stacked gradients) - Sidebar reorganized with Data + Utilities groups - Eidos words content layer and primitives Reference library survey performed before TextArea API design (Mantine, Radix Themes, Chakra v3, React Aria, Ark UI, Bits UI, shadcn, MUI, Prime). Decision documented: no separate CurrencyField/UnitField — single NumberField with formatOptions is the canon (matches all surveyed headless libs except PrimeReact's mode enum, which still uses 1 component). svelte-check: 0 errors in modified/created files. See CONTINUE.md for full session notes and next steps. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>	5 months ago

Author

SHA1

Message

Date

dev

12a7e5cfd3

fix(uix audit): apply Kim audit remediations across morfo/soma/eidos/recipe layers

Resolves 34 of 40 failures from src/uix/audit-uix-kimi-1.md. The remaining
6 are all Words component (excluded per project owner — actively developed
on a separate track) or unrelated infra (cookie-adapter-client jsdom timeout).

Key changes:

  - soma/provider/context.ts: swallow Svelte's `lifecycle_outside_component`
    in `context.set()` so unit tests can instantiate providers without a
    component tree (unblocked 18 picker tests in one line).

  - soma/textarea: route inline style writes through `dom.apply({attrs})`
    instead of direct `el.style.X = Y` (contract regex compliance).

  - soma/picker-shell: add minimal Provider component + morfo so the shared
    handle utility passes the morfo/component contract.

  - eidos/_layout: lift `shared.ts` to `eidos/lib/layout-helpers.ts` (the
    `_layout` directory wasn't a real component) and update 8 layout
    primitive imports.

  - eidos/command: replace `onMount` with `$effect` (visual layer can't use
    Svelte 4 lifecycle hooks per component-api contract); restructure
    `Item.Icon`/`Item.Shortcut` namespace so contract regex matches.

  - eidos/color-picker: extract hue spectrum hsl literals to sidecar
    `color-picker-spectrum.css`; keep main recipe color-literal-free.

  - eidos/lib/recipes/base.ts: declare 196 layout-primitive + chrome CSS
    vars (box, flex, grid, float, group, banner, container, section,
    separator, toggle-group, pin-input, scroll-area, splitter,
    navigation-menu, dropdown-menu, context-menu, date-range-field,
    time-range-field, plus per-component additions to date-field,
    color-picker, button, select). 197 missing → 0 non-Words.

  - morfo: add `data-dir` to carousel, `data-kind` to date-picker, add
    StrengthMeterLabel sub-part to password-field, register picker-shell.

  - 5 pickers (date/color/date-range/time/time-range): add `internals.ts`
    indirection so `exports.ts` doesn't re-export `*provider.svelte.ts`
    directly (contract D); rewrite virtual root types to plain object
    literals (no `WithChild`/`PrimitiveDivAttributes`).

  - 4 new READMEs (button, textarea, password-field, picker-shell)
    following the search-field canonical template.

Test result: 2391/2397 passing (99.75%). Remaining 6 failures are all
Words-scope or jsdom infra timeout — explicitly out of scope.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

dev

bb56e94864

fix(password-field): chrome layout + meter visibility + form field styling

Three real visual bugs caught after browser verification:

1. **No visible border around input + meter row.** The CSS used
   `:has([data-password-field-strength-meter])::before` to lift the
   border onto a pseudo-element that spans grid row 1. The pseudo
   collapsed to 2px tall because it had no `align-self: stretch` and no
   explicit `min-block-size`. Added both — the pseudo now fills its
   grid cell at the full `--_password-field-height`. Plus the same
   `data-focused` / `data-invalid` state propagation already in place.

2. **Strength meter segments invisible.** Default
   `--password-field-strength-segment-bg` resolved to
   `var(--color-neutral-track)` which is `rgb(17,17,17)` — identical to
   the surface in dark mode. Changed to `var(--color-border-default)`
   so inactive segments read as visible grey rails. Also bumped segment
   height from 4 → 6 px so the bar is clearly readable.

3. **Eye icon too small inside a thin trigger.** `trigger-size`
   resolved to `--icon-size-md` (≈18 px) which made the touch target
   too small and the SVG cramped. Promoted trigger-size to use
   `--control-height-{xs..md}` so it matches the input row height per
   size. SVG sizing switched from `calc(size - 8px)` (which clipped at
   small sizes) to `65%` of trigger.

4. **Stage wrapper collapsed to content width.** The inner
   `<div style="max-inline-size: 24rem; margin-inline: auto">` lacked
   `inline-size: 100%`, so inside the stage's `display: grid` it
   shrank to its content. Added the explicit `inline-size: 100%`.

5. **Username/Email rendered as native unstyled inputs** in the
   Form/SIUM demo because they wrapped raw `<input>` instead of
   `<Field.Input>` (Field.Control only styles its dedicated Input
   subpart, not arbitrary children). Swapped to `<Field.Input>`.

6. **SIUM error refs (`#?sium.errors.min_length|...`) rendered
   literal.** `Field.ErrorText` just renders the string it receives.
   Added a local `issueText(form, field)` helper that calls
   `uix.langs.ts(raw)` to resolve the langref and then interpolates
   `{{param}}` from `form.issues[field][0].params`. Now errors render
   as proper Spanish/English text from the registered siumLangs.

Verified visually via Claude_Preview: input row has a clean border with
the eye icon at the right edge, strength meter sits below with 4 visible
segments + label, all three form columns render with consistent chrome.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

dev

940e94bb64

Build TextArea component + fix locale propagation bug across soma providers

Major work in this session:

1. NumberField demo refactored to expose Intl.NumberFormatOptions live
   - 9 canonical presets (currency/unit/percent/compact/plain)
   - Locale/currency/unit lists derived from $libs/langs, $libs/currency,
     $format/units (no more hardcoded arrays)
   - Default locale from uix.format.numbers.getLocale()

2. Bug fix: locale prop ignored when soma.format service is active
   - soma/NumberField: 5 bypass points via new `hasOwnLocale` getter
     (decimalSeparator, groupSeparator, formatValue, formatEditValue, parseValue)
   - soma/Calendar: dateOrder respects locale prop (matches DateField precedence)
   - soma/RangeCalendar: same dateOrder fix
   - When the consumer passes `locale` prop, soma.nums/dates is bypassed
     and Intl is used directly with the prop locale

3. TextArea — new component, full 4-layer stack
   - morfo: 3 parts (provider/input/count), 3 events
     (commit-input/commit-submit/shift-count-overflow), APG textbox
   - soma: TextAreaProvider with autosize (scrollHeight measurement),
     submitOn modes (false|enter|shift+enter|mod+enter), maxLength soft clamp,
     Field integration (OR-merge), counter overflow tracking
   - eidos: 5 sizes × 3 variants × 8 colors, autosize suppresses CSS resize
   - sema: commit-submit + shift-count-overflow perceptual cues
   - demo: canonical 6-tab depth, all props exposed as live controls
   - PrimitiveTextareaAttributes added to soma/types/html.ts

4. Also includes accumulated unreleased work from prior sessions:
   - Eidos ports: announce, clipboard, drag-drop, feed, table,
     tree-grid, tree-view, virtual-grid, virtual-list, words
   - Their canonical demos under web/routes/uix/components/
   - Semantic events defined for utility morfos
     (announce/clipboard/virtual-list/virtual-grid)
   - Tree indent guides fixed (TreeView ::before, TreeGrid stacked gradients)
   - Sidebar reorganized with Data + Utilities groups
   - Eidos words content layer and primitives

Reference library survey performed before TextArea API design (Mantine,
Radix Themes, Chakra v3, React Aria, Ark UI, Bits UI, shadcn, MUI, Prime).
Decision documented: no separate CurrencyField/UnitField — single
NumberField with formatOptions is the canon (matches all surveyed
headless libs except PrimeReact's mode enum, which still uses 1 component).

svelte-check: 0 errors in modified/created files.

See CONTINUE.md for full session notes and next steps.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

3 Commits (a5243168e5bbc2e0c6c8484fde3557d8c3f18a8e)