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.
41 lines
1.3 KiB
41 lines
1.3 KiB
import type { Morfo } from '../types';
|
|
|
|
/**
|
|
* Float — CSS-`float` primitive that pulls a child to the start or end
|
|
* of a text flow so adjacent inline content wraps around it (layout
|
|
* primitive).
|
|
*
|
|
* Eidos-native: composes through `<Box>` and sets `float:inline-start`
|
|
* / `float:inline-end` plus a margin from the surrounding text via
|
|
* `--float-gap`. Typical use cases: inline images, pull-quotes, drop
|
|
* caps, side notes in long-form content.
|
|
*
|
|
* Justification for 0-event surface: Float is a pure visual /
|
|
* structural primitive. It changes how its child participates in the
|
|
* surrounding text flow and nothing else — no commit, no emerge, no
|
|
* keyboard, no ARIA. Same passive justification as `box.ts`.
|
|
*
|
|
* Note on naming: this is NOT the legacy `air/Float` 9-zone external
|
|
* placement primitive (that one was an absolutely-positioned overlay
|
|
* relative to an anchor). The CSS-`float` semantic is closer to Radix
|
|
* Themes `Inset` and MUI's pull-quote pattern — see the README's
|
|
* "Baseline" section for the design history.
|
|
*/
|
|
export const floatMorfo = {
|
|
name: 'Float',
|
|
kebab: 'float',
|
|
scope: ['eidos'],
|
|
parts: [
|
|
{
|
|
name: 'Provider',
|
|
kebab: 'provider',
|
|
archetype: 'provider',
|
|
kind: 'public',
|
|
defaultElement: 'div',
|
|
optional: false,
|
|
data: [],
|
|
aria: []
|
|
}
|
|
]
|
|
} as const satisfies Morfo;
|