You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
63 lines
1.5 KiB
63 lines
1.5 KiB
import type { Morfo } from '../types';
|
|
import { v } from '../types';
|
|
|
|
/**
|
|
* ScrollFrames — scroll-driven media scrubbing (eidos-only, passive).
|
|
*
|
|
* No events: the component reacts to scroll position, it does not emit semantic
|
|
* occurrences. Four structural parts:
|
|
* - `provider` — the tall track that defines the scroll travel.
|
|
* - `viewport` — the sticky child pinned while the track scrolls.
|
|
* - `media` — the `<canvas>` / `<video>` (decorative → `aria-hidden`).
|
|
* - `loader` — optional load-progress readout.
|
|
*/
|
|
export const scrollFramesMorfo = {
|
|
name: 'ScrollFrames',
|
|
kebab: 'scroll-frames',
|
|
scope: ['eidos'],
|
|
parts: [
|
|
{
|
|
name: 'Provider',
|
|
kebab: 'provider',
|
|
archetype: 'provider',
|
|
kind: 'public',
|
|
defaultElement: 'div',
|
|
optional: false,
|
|
data: [],
|
|
aria: []
|
|
},
|
|
{
|
|
name: 'Viewport',
|
|
kebab: 'viewport',
|
|
archetype: 'viewport',
|
|
kind: 'public',
|
|
defaultElement: 'div',
|
|
optional: false,
|
|
data: [],
|
|
aria: []
|
|
},
|
|
{
|
|
name: 'Media',
|
|
kebab: 'media',
|
|
archetype: 'image',
|
|
kind: 'public',
|
|
defaultElement: 'img',
|
|
optional: false,
|
|
data: [],
|
|
// The media is purely decorative — the canvas/video carries no
|
|
// accessible content of its own; the page around it provides meaning.
|
|
aria: [{ attr: 'aria-hidden', value: v.literal('true') }]
|
|
},
|
|
{
|
|
name: 'Loader',
|
|
kebab: 'loader',
|
|
archetype: 'indicator',
|
|
kind: 'public',
|
|
defaultElement: 'div',
|
|
optional: true,
|
|
data: [],
|
|
aria: []
|
|
}
|
|
]
|
|
} as const satisfies Morfo;
|