Con `numberOfMonths=2` el calendario tenia un *shift invisible* a medias: al pulsar «siguiente», junio cambiaba sus fechas quieto y julio cruzaba. Medido — un solo sello, sobre el segundo grid. La causa no es el runtime ni el llamador. `grid` es una parte REPETIDA, y un emit sin ancla resuelve a la instancia viva mas reciente (`resolveEmitTarget`). `shift-navigate` apuntaba a `grid` desde el 2026-08-11, cuando se le saco del boton para que dejara de pisar su `contact-activate` (A-36). Era correcto para un mes y falso para dos, y un destino que solo vale para un valor del parametro no es un destino. La ley que este mismo eje escribio ya traia la respuesta (`morfo.md` §Where the stamp lands): *if it isn't the subject, the morfo is wrong*. El sujeto es la VISTA PAGINADA — lo que cruza como unidad bajo cualquier numero de meses. No existia como parte, asi que se declara: `months`, arquetipo `viewport`, con `targetFallback: [grid]` para que una composicion headless sin ella degrade a lo de antes en vez de callarse. Se descartaron tres alternativas, y por que ------------------------------------------- - Emitir N veces ancladas: acuna N ocurrencias para UN gesto, N ids en el arbitro de dominancia y una repeticion en la memoria de frecuencia (C-2 solo exime a `handle`), y luego hay que silenciar N-1 desde el componente. - Un emit con N sellos: `resolveEmitTarget` es UNA resolucion para TRES lectores «so they can never disagree» — y el movimiento de foco a11y necesita uno. Ademas declararia que cruzaron dos cosas; el cap. 27 dice que cruzo una. - Volver al provider con CSS descendiente a mano: el provider no es el sujeto (la cabecera no se mueve), deshace una correccion medida y duplica el shorthand de animacion en cuatro recetas. De paso, dos partes clandestinas legalizadas -------------------------------------------- `data-calendar-month-panel` lo fabricaban a mano los cuatro demos multi-mes y `calendar.css` lo estilizaba igualmente, sin que ningun morfo lo declarara; el contenedor lo montaban con un `style` en linea que rederivaba el numero de meses en cada pagina, o con clases locales (`.range-months`, `.month-stack`) que apuntaban a un `--calendar-month-gap` que NO EXISTE — el fallback `36px`/`32px` hacia todo el trabajo. Ahora son partes, la disposicion vive en la receta (`grid-auto-flow: column`, sin contar meses) y el token es `--calendar-months-gap`. Correccion de lo que dije al proponerlo: `eidos-lint` NO cazaba esa deriva — clasificaba el selector como `eidos-only`, no como invalido. Lo que gana el cambio es mover 2 selectores de eidos-only a morfo-backed. Quien si lo caza es `morfo:check`, contra el DOM real. Medido ------ Navegador, `numberOfMonths=2`: el sello cae en `[data-calendar-months]` con `data-event-direction=forward`, corre `shift-cross-forward 0.32s`, y los DOS grids se desplazan 10 px a los 40 ms del cruce (antes: uno). En RTL, `--motion-shift-sign` pasa a -1 y los dos van a -10 px. El boton conserva su `contact-activate` en su propia ranura. Consola limpia en los cuatro demos; el date-range-picker, que muestra dos meses por defecto, es donde mas mordia. `morfo:check` contra el DOM: calendar y range-calendar PASS. `eidos-lint`: invalid 0 en ambos, morfo-backed 27→29 y 39→41. `docs:check` 0/623. Verificado sobre el ARBOL INDEXADO en un worktree aparte, no sobre el mio: `check` 57 errores, identico a HEAD, cero nuevos; 2154/2154 en morfo + soma + eidos + sema. Los 6 fallos de `contracts.test.ts` que se ven en mi arbol de trabajo son de la otra sesion (waveform, media-player, audio-player, menubar, aura, radio-group, tabs): en el arbol firmado pasan. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>alpha-0.1-dir-prefs
parent
2c555e4be6
commit
e5811e422c
@ -0,0 +1,10 @@
|
||||
<script lang="ts">
|
||||
import * as Calendar from '$soma/components/calendar';
|
||||
import type { CalendarMonthPanelProps } from './types';
|
||||
|
||||
let { children: bodyContent, ...rest }: CalendarMonthPanelProps = $props();
|
||||
</script>
|
||||
|
||||
<Calendar.MonthPanel {...rest}>
|
||||
{@render bodyContent?.()}
|
||||
</Calendar.MonthPanel>
|
||||
@ -0,0 +1,10 @@
|
||||
<script lang="ts">
|
||||
import * as Calendar from '$soma/components/calendar';
|
||||
import type { CalendarMonthsProps } from './types';
|
||||
|
||||
let { children: bodyContent, ...rest }: CalendarMonthsProps = $props();
|
||||
</script>
|
||||
|
||||
<Calendar.Months {...rest}>
|
||||
{@render bodyContent?.()}
|
||||
</Calendar.Months>
|
||||
@ -0,0 +1,10 @@
|
||||
<script lang="ts">
|
||||
import * as DateRangePicker from '$soma/components/date-range-picker';
|
||||
import type { DateRangePickerMonthPanelProps } from './types';
|
||||
|
||||
let { children, ...rest }: DateRangePickerMonthPanelProps = $props();
|
||||
</script>
|
||||
|
||||
<DateRangePicker.MonthPanel {...rest}>
|
||||
{@render children?.()}
|
||||
</DateRangePicker.MonthPanel>
|
||||
@ -0,0 +1,10 @@
|
||||
<script lang="ts">
|
||||
import * as DateRangePicker from '$soma/components/date-range-picker';
|
||||
import type { DateRangePickerMonthsProps } from './types';
|
||||
|
||||
let { children, ...rest }: DateRangePickerMonthsProps = $props();
|
||||
</script>
|
||||
|
||||
<DateRangePicker.Months {...rest}>
|
||||
{@render children?.()}
|
||||
</DateRangePicker.Months>
|
||||
@ -0,0 +1,10 @@
|
||||
<script lang="ts">
|
||||
import * as RangeCalendar from '$soma/components/range-calendar';
|
||||
import type { RangeCalendarMonthPanelProps } from './types';
|
||||
|
||||
let { children: bodyContent, ...rest }: RangeCalendarMonthPanelProps = $props();
|
||||
</script>
|
||||
|
||||
<RangeCalendar.MonthPanel {...rest}>
|
||||
{@render bodyContent?.()}
|
||||
</RangeCalendar.MonthPanel>
|
||||
@ -0,0 +1,10 @@
|
||||
<script lang="ts">
|
||||
import * as RangeCalendar from '$soma/components/range-calendar';
|
||||
import type { RangeCalendarMonthsProps } from './types';
|
||||
|
||||
let { children: bodyContent, ...rest }: RangeCalendarMonthsProps = $props();
|
||||
</script>
|
||||
|
||||
<RangeCalendar.Months {...rest}>
|
||||
{@render bodyContent?.()}
|
||||
</RangeCalendar.Months>
|
||||
@ -0,0 +1,35 @@
|
||||
<script lang="ts">
|
||||
import { partOpts } from '../../../provider';
|
||||
import { mergeProps } from '../../../props';
|
||||
import { createId } from '$active-uix/id';
|
||||
import { CalendarMonthPanelProvider } from '../calendar-provider.svelte';
|
||||
import type { CalendarMonthPanelProps } from '../types';
|
||||
|
||||
const uid = $props.id();
|
||||
|
||||
let {
|
||||
ref = $bindable(null),
|
||||
id = createId(uid, 'calendar-month-panel'),
|
||||
children,
|
||||
child,
|
||||
...restProps
|
||||
}: CalendarMonthPanelProps = $props();
|
||||
|
||||
const state = CalendarMonthPanelProvider.create(
|
||||
partOpts(
|
||||
() => id,
|
||||
() => ref,
|
||||
(v) => (ref = v)
|
||||
)
|
||||
);
|
||||
|
||||
const mergedProps = $derived(mergeProps(restProps, state.props));
|
||||
</script>
|
||||
|
||||
{#if child}
|
||||
{@render child({ props: mergedProps })}
|
||||
{:else}
|
||||
<div {...mergedProps}>
|
||||
{@render children?.()}
|
||||
</div>
|
||||
{/if}
|
||||
@ -0,0 +1,35 @@
|
||||
<script lang="ts">
|
||||
import { partOpts } from '../../../provider';
|
||||
import { mergeProps } from '../../../props';
|
||||
import { createId } from '$active-uix/id';
|
||||
import { CalendarMonthsProvider } from '../calendar-provider.svelte';
|
||||
import type { CalendarMonthsProps } from '../types';
|
||||
|
||||
const uid = $props.id();
|
||||
|
||||
let {
|
||||
ref = $bindable(null),
|
||||
id = createId(uid, 'calendar-months'),
|
||||
children,
|
||||
child,
|
||||
...restProps
|
||||
}: CalendarMonthsProps = $props();
|
||||
|
||||
const state = CalendarMonthsProvider.create(
|
||||
partOpts(
|
||||
() => id,
|
||||
() => ref,
|
||||
(v) => (ref = v)
|
||||
)
|
||||
);
|
||||
|
||||
const mergedProps = $derived(mergeProps(restProps, state.props));
|
||||
</script>
|
||||
|
||||
{#if child}
|
||||
{@render child({ props: mergedProps })}
|
||||
{:else}
|
||||
<div {...mergedProps}>
|
||||
{@render children?.()}
|
||||
</div>
|
||||
{/if}
|
||||
@ -0,0 +1,35 @@
|
||||
<script lang="ts">
|
||||
import { partOpts } from '../../../provider';
|
||||
import { mergeProps } from '../../../props';
|
||||
import { createId } from '$active-uix/id';
|
||||
import { RangeCalendarMonthPanelProvider } from '../range-calendar-provider.svelte';
|
||||
import type { RangeCalendarMonthPanelProps } from '../types';
|
||||
|
||||
const uid = $props.id();
|
||||
|
||||
let {
|
||||
ref = $bindable(null),
|
||||
id = createId(uid, 'range-calendar-month-panel'),
|
||||
children,
|
||||
child,
|
||||
...restProps
|
||||
}: RangeCalendarMonthPanelProps = $props();
|
||||
|
||||
const state = RangeCalendarMonthPanelProvider.create(
|
||||
partOpts(
|
||||
() => id,
|
||||
() => ref,
|
||||
(v) => (ref = v)
|
||||
)
|
||||
);
|
||||
|
||||
const mergedProps = $derived(mergeProps(restProps, state.props));
|
||||
</script>
|
||||
|
||||
{#if child}
|
||||
{@render child({ props: mergedProps })}
|
||||
{:else}
|
||||
<div {...mergedProps}>
|
||||
{@render children?.()}
|
||||
</div>
|
||||
{/if}
|
||||
@ -0,0 +1,35 @@
|
||||
<script lang="ts">
|
||||
import { partOpts } from '../../../provider';
|
||||
import { mergeProps } from '../../../props';
|
||||
import { createId } from '$active-uix/id';
|
||||
import { RangeCalendarMonthsProvider } from '../range-calendar-provider.svelte';
|
||||
import type { RangeCalendarMonthsProps } from '../types';
|
||||
|
||||
const uid = $props.id();
|
||||
|
||||
let {
|
||||
ref = $bindable(null),
|
||||
id = createId(uid, 'range-calendar-months'),
|
||||
children,
|
||||
child,
|
||||
...restProps
|
||||
}: RangeCalendarMonthsProps = $props();
|
||||
|
||||
const state = RangeCalendarMonthsProvider.create(
|
||||
partOpts(
|
||||
() => id,
|
||||
() => ref,
|
||||
(v) => (ref = v)
|
||||
)
|
||||
);
|
||||
|
||||
const mergedProps = $derived(mergeProps(restProps, state.props));
|
||||
</script>
|
||||
|
||||
{#if child}
|
||||
{@render child({ props: mergedProps })}
|
||||
{:else}
|
||||
<div {...mergedProps}>
|
||||
{@render children?.()}
|
||||
</div>
|
||||
{/if}
|
||||
Loading…
Reference in new issue