{ "version": 1.1, "tags": [ { "name": "fx-alert", "description": { "kind": "markdown", "value": "`fx-alert` is a headless, accessible alert component. It surfaces a titled\nmessage with an optional icon slot, description, action buttons and a close\ncontrol. It exposes every styleable surface via `part` attributes and its\nstate through `data-*` and ARIA attributes so themes can customize it\nwithout internal styles." }, "attributes": [ { "name": "close", "description": "" }, { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "description", "description": "" }, { "name": "header", "description": "" }, { "name": "orientation", "description": "", "values": [ { "name": "horizontal" }, { "name": "vertical" } ] }, { "name": "variant", "description": "", "values": [ { "name": "outline" }, { "name": "soft" }, { "name": "solid" }, { "name": "subtle" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/alert/alert.tsx" } ] }, { "name": "fx-app", "description": { "kind": "markdown", "value": "`fx-app` is the single root application container, modeled after Ionic's\n`ion-app`. It provides the outermost structural element that other Fx UI\ncomponents expect to live inside.\n\nIt is intentionally headless: no internal styles are shipped. Style it from\na theme via the `base` part." }, "attributes": [], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/app/app.tsx" } ] }, { "name": "fx-avatar", "description": { "kind": "markdown", "value": "`fx-avatar` is a headless, accessible avatar component. It displays an image\nwhen `src` is provided and falls back to text initials when the image is\nmissing or fails to load. Status indicators are rendered as a separate part\nso themes can style them." }, "attributes": [ { "name": "alt", "description": "" }, { "name": "src", "description": "" }, { "name": "status", "description": "", "values": [ { "name": "away" }, { "name": "busy" }, { "name": "offline" }, { "name": "online" }, { "name": "outside" } ] }, { "name": "status-position", "description": "", "values": [ { "name": "bottom" }, { "name": "top" } ] }, { "name": "text", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/avatar/avatar.tsx" } ] }, { "name": "fx-avatar-group", "description": { "kind": "markdown", "value": "`fx-avatar-group` lays out `fx-avatar` children and can collapse the group\nto a configurable maximum, rendering an overflow indicator (`+N`) for any\nhidden avatars." }, "attributes": [ { "name": "max", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/avatar-group/avatar-group.tsx" } ] }, { "name": "fx-backdrop", "description": { "kind": "markdown", "value": "`fx-backdrop` is a full-screen overlay used by components such as side-overs\nand toasts. It is headless: its default styles live in the global theme\n(`core/src/themes/fx-backdrop.scss`) and target `fx-backdrop` and\n`fx-backdrop::part(backdrop)`. Consumers can theme the overlay through those\nselectors and CSS custom properties, while state is reflected via `data-*`\nattributes on the host." }, "attributes": [ { "name": "stop-propagation", "description": "" }, { "name": "tappable", "description": "" }, { "name": "visible", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/backdrop/backdrop.tsx" } ] }, { "name": "fx-badge", "description": { "kind": "markdown", "value": "`fx-badge` is a headless, accessible badge component. It exposes every\nstyleable surface via `part` attributes and its state through `data-*`\nattributes so themes can customize it without internal styles." }, "attributes": [ { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "size", "description": "", "values": [ { "name": "lg" }, { "name": "md" }, { "name": "sm" }, { "name": "xl" }, { "name": "xs" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/badge/badge.tsx" } ] }, { "name": "fx-banner", "description": { "kind": "markdown", "value": "`fx-banner` is a headless, accessible banner used to surface a message with an\noptional title, action buttons and a dismiss control. It exposes every\nstyleable surface via `part` attributes and its state through `data-*` and\nARIA attributes so themes can customize it without internal styles." }, "attributes": [ { "name": "close", "description": "" }, { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "header", "description": "" }, { "name": "href", "description": "" }, { "name": "size", "description": "", "values": [ { "name": "lg" }, { "name": "md" }, { "name": "sm" }, { "name": "xl" }, { "name": "xs" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/banner/banner.tsx" } ] }, { "name": "fx-breadcrumb", "description": { "kind": "markdown", "value": "`fx-breadcrumb` is a headless, accessible breadcrumb link. It exposes the\nstyleable link surface via `part` attributes and its state through `data-*`\nand ARIA attributes so themes can customize it without internal styles." }, "attributes": [ { "name": "current", "description": "" }, { "name": "href", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/breadcrumb/breadcrumb.tsx" } ] }, { "name": "fx-breadcrumbs", "description": { "kind": "markdown", "value": "`fx-breadcrumbs` is a headless, accessible breadcrumb list. It lays out\n`fx-breadcrumb` children, renders separators, and can collapse the middle\nitems behind an expandable ellipsis indicator." }, "attributes": [ { "name": "items-after-collapse", "description": "" }, { "name": "items-before-collapse", "description": "" }, { "name": "max-items", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/breadcrumbs/breadcrumbs.tsx" } ] }, { "name": "fx-button", "description": { "kind": "markdown", "value": "`fx-button` is a headless, accessible button component. It exposes every\nstyleable surface via `part` attributes and its state through `data-*`\nattributes so themes can customize it without internal styles." }, "attributes": [ { "name": "disabled", "description": "" }, { "name": "expand", "description": "", "values": [ { "name": "block" }, { "name": "full" } ] }, { "name": "fill", "description": "", "values": [ { "name": "clear" }, { "name": "link" }, { "name": "outline" }, { "name": "solid" } ] }, { "name": "form", "description": "" }, { "name": "is-circle", "description": "" }, { "name": "size", "description": "", "values": [ { "name": "lg" }, { "name": "md" }, { "name": "sm" }, { "name": "xl" }, { "name": "xs" } ] }, { "name": "type", "description": "", "values": [ { "name": "button" }, { "name": "reset" }, { "name": "submit" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/button/button.tsx" } ] }, { "name": "fx-card", "description": { "kind": "markdown", "value": "`fx-card` is a headless, accessible card container. It exposes its visible\nsurface via a `part` attribute and its state through `data-*` attributes so\nthemes can customize it without internal styles. Compose it with\n`fx-card-header`, `fx-card-title`, `fx-card-subtitle` and `fx-card-content`.\nSet `button` to `true` for an interactive, ripple-enabled card surface." }, "attributes": [ { "name": "button", "description": "When `true`, the card acts as a button and shows a ripple on interaction.\nBecause the host receives `role=\"button\"`, it must not contain independently\ninteractive or focusable descendants such as `fx-button` actions, links, or form controls." }, { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "disabled", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/card/card.tsx" } ] }, { "name": "fx-card-content", "description": { "kind": "markdown", "value": "`fx-card-content` is a headless, structural wrapper for the body of an\n`fx-card`. It exposes its surface via a `part` attribute so themes can\ncustomize it (e.g. padding) without internal styles." }, "attributes": [], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/card-content/card-content.tsx" } ] }, { "name": "fx-card-header", "description": { "kind": "markdown", "value": "`fx-card-header` is a headless, structural wrapper for the header area of an\n`fx-card`. It typically contains an `fx-card-title` and an\n`fx-card-subtitle`. It exposes its surface via a `part` attribute so themes\ncan customize it without internal styles." }, "attributes": [], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/card-header/card-header.tsx" } ] }, { "name": "fx-card-subtitle", "description": { "kind": "markdown", "value": "`fx-card-subtitle` is a headless, structural subheading for an `fx-card`,\nusually placed inside an `fx-card-header` below an `fx-card-title`. It\nexposes its surface via a `part` attribute and its color through\n`data-color` so themes can customize it without internal styles." }, "attributes": [ { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/card-subtitle/card-subtitle.tsx" } ] }, { "name": "fx-card-title", "description": { "kind": "markdown", "value": "`fx-card-title` is a headless, structural heading for an `fx-card`, usually\nplaced inside an `fx-card-header`. It exposes its surface via a `part`\nattribute and its color through `data-color` so themes can customize it\nwithout internal styles." }, "attributes": [ { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/card-title/card-title.tsx" } ] }, { "name": "fx-chat-shimmer", "description": { "kind": "markdown", "value": "`fx-chat-shimmer` renders slotted text with a moving highlight suitable for\nloading and streaming chat content.\n\nWhen nested inside another shadow root, forward the `base` part with\n`exportparts=\"base: shimmer-base\"` and include the\n`fx-chat-shimmer-base` mixin in the host's theme." }, "attributes": [ { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "duration", "description": "" }, { "name": "spread", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/chat-shimmer/chat-shimmer.tsx" } ] }, { "name": "fx-checkbox", "description": { "kind": "markdown", "value": "`fx-checkbox` is a headless, accessible checkbox component. It is\nform-associated and exposes every styleable surface via `part` attributes\nand its state through `data-*` and ARIA attributes so themes can customize\nit without internal styles." }, "attributes": [ { "name": "checked", "description": "" }, { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "disabled", "description": "" }, { "name": "indeterminate", "description": "" }, { "name": "name", "description": "" }, { "name": "readonly", "description": "" }, { "name": "size", "description": "", "values": [ { "name": "lg" }, { "name": "md" }, { "name": "sm" }, { "name": "xl" }, { "name": "xs" } ] }, { "name": "value", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/checkbox/checkbox.tsx" } ] }, { "name": "fx-chip", "description": { "kind": "markdown", "value": "`fx-chip` is a headless, accessible chip component. It exposes its visible\nsurface via a `part` attribute and its state through `data-*` attributes so\nthemes can customize it without internal styles. The chip is non-interactive\nby default; consumers who make it interactive must provide an appropriate\n`role` for `aria-disabled` to be conveyed." }, "attributes": [ { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "disabled", "description": "" }, { "name": "size", "description": "", "values": [ { "name": "lg" }, { "name": "md" }, { "name": "sm" }, { "name": "xl" }, { "name": "xs" } ] }, { "name": "variant", "description": "", "values": [ { "name": "outline" }, { "name": "soft" }, { "name": "solid" }, { "name": "subtle" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/chip/chip.tsx" } ] }, { "name": "fx-collapse", "description": { "kind": "markdown", "value": "`fx-collapse` is a headless, accessible collapse (disclosure) item. The\ndefault slot renders the header trigger and the named `content` slot renders\nthe collapsible body. It can be used standalone or inside an\n`fx-collapse-group` accordion." }, "attributes": [ { "name": "animated", "description": "" }, { "name": "disabled", "description": "" }, { "name": "open", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/collapse/collapse.tsx" } ] }, { "name": "fx-collapse-group", "description": { "kind": "markdown", "value": "`fx-collapse-group` is a headless accordion container for `fx-collapse`\nitems. It controls which items are expanded through its `value` prop,\nsupports single or multiple expansion, propagates `disabled` to all items,\nand provides arrow/Home/End keyboard navigation between item headers.\n\nItems are identified by the `id` attribute on each `fx-collapse`; an\ninternal identifier is assigned when `id` is missing." }, "attributes": [ { "name": "animated", "description": "" }, { "name": "disabled", "description": "" }, { "name": "multiple", "description": "" }, { "name": "value", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/collapse-group/collapse-group.tsx" } ] }, { "name": "fx-color-picker", "description": { "kind": "markdown", "value": "`fx-color-picker` is a headless, accessible color picker. A trigger button\nshows the current color and, when opened, reveals a popover containing a\nsaturation/value square (choose a shade from light to dark) and a vertical\nhue bar (choose the base color). Every styleable surface is exposed via\n`part` attributes and its state through `data-*`/ARIA attributes so themes\ncan customize it without internal styles." }, "attributes": [ { "name": "default-value", "description": "" }, { "name": "disabled", "description": "" }, { "name": "format", "description": "", "values": [ { "name": "cmyk" }, { "name": "hex" }, { "name": "hsl" }, { "name": "lab" }, { "name": "rgb" } ] }, { "name": "name", "description": "" }, { "name": "placeholder", "description": "" }, { "name": "readonly", "description": "" }, { "name": "size", "description": "", "values": [ { "name": "lg" }, { "name": "md" }, { "name": "sm" }, { "name": "xl" }, { "name": "xs" } ] }, { "name": "value", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/color-picker/color-picker.tsx" } ] }, { "name": "fx-content", "description": { "kind": "markdown", "value": "`fx-content` is a scrollable content area, modeled after Ionic's\n`ion-content`. It provides a background layer, a scrollable region for the\ndefault slotted content, and a `fixed` slot for content that should not\nscroll with the rest of the page.\n\nIt is headless: no internal styles are shipped. Scroll behavior is exposed\nas state through the `data-scroll-x` / `data-scroll-y` attributes so a theme\ncan control the overflow of the `scroll` part." }, "attributes": [ { "name": "render-background", "description": "" }, { "name": "scroll-events", "description": "" }, { "name": "scroll-x", "description": "" }, { "name": "scroll-y", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/content/content.tsx" } ] }, { "name": "fx-context-menu", "description": { "kind": "markdown", "value": "`fx-context-menu` is a headless, accessible context menu. It opens **only**\non right-click (`contextmenu`) over its trigger content, renders slotted\n`fx-context-menu-group` / `fx-context-menu-item` children inside a floating\n`role=\"menu\"` surface and keeps that surface inside the viewport by reusing\nthe shared `fitPopoverInViewport` placement helper.\n\nThere is no programmatic or long-press trigger: right-click is the only way\nto open the menu." }, "attributes": [ { "name": "color", "description": "" }, { "name": "disabled", "description": "" }, { "name": "variant", "description": "", "values": [ { "name": "outline" }, { "name": "soft" }, { "name": "solid" }, { "name": "subtle" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/context-menu/context-menu.tsx" } ] }, { "name": "fx-context-menu-group", "description": { "kind": "markdown", "value": "`fx-context-menu-group` groups related `fx-context-menu-item` elements inside\nan `fx-context-menu`. In the default theme every group is separated from the\nnext one with a `border-bottom`." }, "attributes": [ { "name": "label", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/context-menu-group/context-menu-group.tsx" } ] }, { "name": "fx-context-menu-item", "description": { "kind": "markdown", "value": "`fx-context-menu-item` is a headless, accessible item used inside\n`fx-context-menu`. It lays out `[start] Label ---- [end]` with flex, renders\noptional keyboard shortcuts as `fx-kbd` elements and supports a **single**\nlevel of sub-items (Windows Explorer \"New >\" style) revealed on hover.\n\nWhen the `sub-items` slot has content, the item exposes a `submenu-indicator`\npart (themed with the Font Awesome `f105` glyph) in the end area and opens\nits sub-menu on hover, repositioning it with the shared\n`fitPopoverInViewport` helper so it stays inside the viewport." }, "attributes": [ { "name": "disabled", "description": "" }, { "name": "id", "description": "" }, { "name": "kbds", "description": "" }, { "name": "label", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/context-menu-item/context-menu-item.tsx" } ] }, { "name": "fx-date-picker", "description": { "kind": "markdown", "value": "`fx-date-picker` is a headless, accessible date/time picker. It renders a\ntext-field-like trigger that opens a popover containing an `fx-datetime`.\nIt ships no internal styles; every styleable surface is exposed via `part`\nattributes and its state through `data-*` and ARIA attributes so themes can\ncustomize it without internal styles." }, "attributes": [ { "name": "color", "description": "" }, { "name": "day-values", "description": "" }, { "name": "default-today", "description": "" }, { "name": "disable-auto-locale", "description": "" }, { "name": "disabled", "description": "" }, { "name": "first-day-of-week", "description": "" }, { "name": "highlighted-dates", "description": "" }, { "name": "hour-values", "description": "" }, { "name": "locale", "description": "" }, { "name": "max", "description": "" }, { "name": "min", "description": "" }, { "name": "minute-values", "description": "" }, { "name": "month-values", "description": "" }, { "name": "multiple", "description": "" }, { "name": "name", "description": "" }, { "name": "placeholder", "description": "" }, { "name": "presentation", "description": "", "values": [ { "name": "date" }, { "name": "date-time" }, { "name": "month" }, { "name": "month-year" }, { "name": "time" }, { "name": "year" } ] }, { "name": "readonly", "description": "" }, { "name": "show-adjacent-days", "description": "" }, { "name": "size", "description": "", "values": [ { "name": "lg" }, { "name": "md" }, { "name": "sm" }, { "name": "xl" }, { "name": "xs" } ] }, { "name": "value", "description": "" }, { "name": "variant", "description": "", "values": [ { "name": "outline" }, { "name": "soft" }, { "name": "solid" } ] }, { "name": "year-values", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/date-picker/date-picker.tsx" } ] }, { "name": "fx-datetime", "description": { "kind": "markdown", "value": "`fx-datetime` is a headless, accessible date and time picker. It supports\ndate grids, month/year lists, and time columns through the `presentation`\nprop, single and multiple selection, min/max limits, allowed-value\nrestriction, per-day enabling, and per-day highlighting. It ships no\ninternal styles; every styleable surface is exposed via `part` attributes\nand its state through `data-*` and ARIA attributes." }, "attributes": [ { "name": "color", "description": "" }, { "name": "day-values", "description": "" }, { "name": "disable-auto-locale", "description": "" }, { "name": "disabled", "description": "" }, { "name": "first-day-of-week", "description": "" }, { "name": "highlighted-dates", "description": "" }, { "name": "hour-values", "description": "" }, { "name": "locale", "description": "" }, { "name": "max", "description": "" }, { "name": "min", "description": "" }, { "name": "minute-values", "description": "" }, { "name": "month-values", "description": "" }, { "name": "multiple", "description": "" }, { "name": "presentation", "description": "", "values": [ { "name": "date" }, { "name": "date-time" }, { "name": "month" }, { "name": "month-year" }, { "name": "time" }, { "name": "year" } ] }, { "name": "readonly", "description": "" }, { "name": "show-adjacent-days", "description": "" }, { "name": "value", "description": "" }, { "name": "year-values", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/datetime/datetime.tsx" } ] }, { "name": "fx-dialog", "description": { "kind": "markdown", "value": "`fx-dialog` is a headless, accessible modal dialog component. It surfaces a\ncentered dialog box with header, sub-header, message, content, and actions\nareas, supports an optional `fx-backdrop`, traps focus while open, and\nexposes every styleable surface via `part` attributes and state through\n`data-*` / ARIA attributes so themes can customize it without internal\nstyles.\n\nThe dialog understands two action roles, `confirm` and `cancel`, whether the\ndefault `confirmText` / `cancelText` buttons are used or custom buttons are\nslotted into `actions` carrying a `data-role` (or `role`) attribute. When a\n`confirm` action fires, the dialog collects the values of any named form\ncontrols slotted anywhere inside it into a `{ [name]: value }` object and\ndismisses with that object as the event `data` and role `\"confirm\"`." }, "attributes": [ { "name": "backdrop", "description": "" }, { "name": "backdrop-dismiss", "description": "" }, { "name": "cancel-text", "description": "" }, { "name": "close-button", "description": "" }, { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "confirm-text", "description": "" }, { "name": "disabled", "description": "" }, { "name": "header", "description": "" }, { "name": "keyboard-close", "description": "" }, { "name": "message", "description": "" }, { "name": "open", "description": "" }, { "name": "sub-header", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/dialog/dialog.tsx" } ] }, { "name": "fx-fab", "description": { "kind": "markdown", "value": "`fx-fab` is a headless floating action button container. It coordinates a\ndirect `fx-fab-button` trigger with any direct `fx-fab-list` menus.\nPressing Escape while activated closes the lists and returns focus to the\ntrigger. Button dimensions and list dimensions are controlled by the\n`--fx-fab-button-size` and `--fx-fab-list-button-size` theme variables." }, "attributes": [ { "name": "activated", "description": "" }, { "name": "horizontal", "description": "", "values": [ { "name": "center" }, { "name": "end" }, { "name": "start" } ] }, { "name": "vertical", "description": "", "values": [ { "name": "bottom" }, { "name": "center" }, { "name": "top" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/fab/fab.tsx" } ] }, { "name": "fx-fab-button", "description": { "kind": "markdown", "value": "`fx-fab-button` is a headless floating action button trigger or action.\nWhen activated, it replaces the default slot content with a close\nindicator. The host's `aria-label` or `aria-labelledby` is forwarded to the\nnative button; labelled-by references are resolved from the light DOM and\nforwarded as an aria-label. Activated buttons without either attribute use\n`Close actions` as their accessible name. Changes to these attributes,\nincluding `aria-expanded`, are observed and forwarded after initial render.\nThe icon part is present in both states and contains a readable plus or X;\nthe inactive label is rendered beneath it. The fixed button size is\ncontrolled by `--fx-fab-button-size` (default `3.5rem`), with\n`--fx-fab-button-radius` and `--fx-fab-button-label-font-size` available\nfor visual tuning." }, "attributes": [ { "name": "activated", "description": "" }, { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "disabled", "description": "" }, { "name": "size", "description": "", "values": [ { "name": "lg" }, { "name": "md" }, { "name": "sm" }, { "name": "xl" }, { "name": "xs" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/fab-button/fab-button.tsx" } ] }, { "name": "fx-fab-list", "description": { "kind": "markdown", "value": "`fx-fab-list` is a headless group of floating action buttons controlled by\nits closest `fx-fab`. It uses the native `hidden` attribute as well as\n`aria-hidden` while collapsed so it remains inaccessible without a theme.\nThe `side` value is a placement preference and flips to the opposite inline\nside when the FAB's anchoring edge leaves no room. Because buttons in a list\nshare one width, an icon-only button in a list uses that shared width and\nappears as a pill rather than a circle. List buttons use\n`--fx-fab-list-button-size`, which defaults to `--fx-fab-button-size`." }, "attributes": [ { "name": "side", "description": "", "values": [ { "name": "bottom" }, { "name": "left" }, { "name": "right" }, { "name": "top" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/fab-list/fab-list.tsx" } ] }, { "name": "fx-field-group", "description": { "kind": "markdown", "value": "`fx-field-group` is a headless, accessible layout component that groups\nrelated fields and actions (e.g. `fx-button`, `fx-text-field`) into a single\nconnected input group: the slotted controls share one bordered surface, are\nrendered at the same height, and the corners where two controls meet are\nsquared off so the group reads as one continuous box.\n\nIt is headless — it exposes a `base` part and reflects its state through\n`data-*` attributes and host classes so themes control the height, spacing\nand orientation without internal styles." }, "attributes": [ { "name": "label", "description": "Accessible name for the group, exposed as `aria-label` on the host\n(`role=\"group\"`). Set this when the group's purpose is not already clear\nfrom the surrounding context." }, { "name": "orientation", "description": "The layout direction of the group. `horizontal` lays the controls out in a\nrow, `vertical` in a column, and it determines which corners are squared at\neach seam. Reflects to `data-orientation` on the host and adds the\n`fx-field-group--` host class. Defaults to `horizontal`.", "values": [ { "name": "horizontal" }, { "name": "vertical" } ] }, { "name": "size", "description": "The size of the group. Drives the shared height of every control in the\ngroup (and their font-size/padding). Reflects to `data-size` on the host\nand adds the `fx-field-group--` host class. Defaults to `md`.", "values": [ { "name": "lg" }, { "name": "md" }, { "name": "sm" }, { "name": "xl" }, { "name": "xs" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/field-group/field-group.tsx" } ] }, { "name": "fx-field-rating", "description": { "kind": "markdown", "value": "`fx-field-rating` is a headless, accessible star-rating component. It renders\na row of Font Awesome stars, supports fractional fill, hover previews and\nnative form association. Every styleable surface is exposed via `part`\nattributes and its state through `data-*` and ARIA attributes so themes can\ncustomize it without internal styles." }, "attributes": [ { "name": "clearable", "description": "" }, { "name": "color", "description": "" }, { "name": "disabled", "description": "" }, { "name": "hoverable", "description": "" }, { "name": "length", "description": "" }, { "name": "name", "description": "" }, { "name": "readonly", "description": "" }, { "name": "required", "description": "" }, { "name": "size", "description": "", "values": [ { "name": "lg" }, { "name": "md" }, { "name": "sm" }, { "name": "xl" }, { "name": "xs" } ] }, { "name": "step", "description": "" }, { "name": "value", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/field-rating/field-rating.tsx" } ] }, { "name": "fx-footer", "description": { "kind": "markdown", "value": "`fx-footer` is a headless, bottom-aligned page footer modeled after Ionic's\n`ion-footer`. The default theme uses fixed positioning so a root-level\nfooter remains pinned to the viewport bottom. Scrolling content must\nreserve matching bottom padding to prevent the footer from covering content.\nSet `--fx-footer-position` to `sticky` or `static` for another layout\nstrategy." }, "attributes": [], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/footer/footer.tsx" } ] }, { "name": "fx-item", "description": { "kind": "markdown", "value": "`fx-item` is a headless, accessible list item component. It can render as a\nstatic row, a tappable button, or a link. Every styleable surface is exposed\nvia `part` attributes and its state through `data-*` and `aria-*`\nattributes so themes can customize it without internal styles." }, "attributes": [ { "name": "button", "description": "" }, { "name": "color", "description": "" }, { "name": "detail", "description": "" }, { "name": "disabled", "description": "" }, { "name": "href", "description": "" }, { "name": "lines", "description": "", "values": [ { "name": "full" }, { "name": "inset" }, { "name": "none" } ] }, { "name": "target", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/item/item.tsx" } ] }, { "name": "fx-item-divider", "description": { "kind": "markdown", "value": "`fx-item-divider` is a headless list divider / section header. It exposes\nevery styleable surface via `part` attributes and its state through\n`data-*` attributes so themes can customize it without internal styles." }, "attributes": [ { "name": "color", "description": "" }, { "name": "sticky", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/item-divider/item-divider.tsx" } ] }, { "name": "fx-item-group", "description": { "kind": "markdown", "value": "`fx-item-group` is a headless grouping container for related items. It exposes\nevery styleable surface via `part` attributes and state through `data-*`\nand ARIA attributes so themes can customize it without internal styles." }, "attributes": [], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/item-group/item-group.tsx" } ] }, { "name": "fx-item-option", "description": { "kind": "markdown", "value": "`fx-item-option` is a headless, accessible option button for use inside\n`fx-item-options`. It exposes every styleable surface via `part` attributes\nand its state through `data-*` and ARIA attributes." }, "attributes": [ { "name": "color", "description": "" }, { "name": "disabled", "description": "" }, { "name": "expandable", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/item-option/item-option.tsx" } ] }, { "name": "fx-item-options", "description": { "kind": "markdown", "value": "`fx-item-options` groups one or more `fx-item-option` elements and anchors\nthem to a side of an `fx-item-sliding` host. It exposes every styleable\nsurface via `part` attributes and state through `data-*` attributes." }, "attributes": [ { "name": "side", "description": "", "values": [ { "name": "end" }, { "name": "start" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/item-options/item-options.tsx" } ] }, { "name": "fx-item-sliding", "description": { "kind": "markdown", "value": "`fx-item-sliding` is a headless list item that reveals action options through\npointer/touch drag or imperative `open()` / `close()` methods. It supports up to\ntwo `fx-item-options` sets (one on each side) and exposes every styleable\nsurface via `part` attributes and state through `data-*` and ARIA attributes." }, "attributes": [ { "name": "disabled", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/item-sliding/item-sliding.tsx" } ] }, { "name": "fx-kbd", "description": { "kind": "markdown", "value": "`fx-kbd` is a headless, accessible keyboard-key component. It renders a\nnative `` element, exposes every styleable surface via `part`\nattributes, and reflects its state through `data-*` attributes so themes\ncan customize it without internal styles." }, "attributes": [ { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "value", "description": "" }, { "name": "variant", "description": "", "values": [ { "name": "outline" }, { "name": "soft" }, { "name": "solid" }, { "name": "subtle" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/kbd/kbd.tsx" } ] }, { "name": "fx-list", "description": { "kind": "markdown", "value": "`fx-list` is a headless, accessible list container. It exposes its state\nthrough `data-*` and ARIA attributes and provides a method for closing any\nopen `fx-item-sliding` children." }, "attributes": [ { "name": "inset", "description": "" }, { "name": "lines", "description": "", "values": [ { "name": "full" }, { "name": "inset" }, { "name": "none" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/list/list.tsx" } ] }, { "name": "fx-list-header", "description": { "kind": "markdown", "value": "`fx-list-header` is a headless header block for grouping list content. It\nexposes its state through `data-*` attributes and styleable surfaces via\n`part` attributes." }, "attributes": [ { "name": "color", "description": "" }, { "name": "lines", "description": "", "values": [ { "name": "full" }, { "name": "inset" }, { "name": "none" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/list-header/list-header.tsx" } ] }, { "name": "fx-navigation-view", "description": { "kind": "markdown", "value": "`fx-navigation-view` is a headless, accessible navigation container that\nrenders as an inline sidebar on desktop and as an `fx-sideover` on mobile.\nIt supports variants, collapse modes, an edge swipe gesture, and a matching\n`fx-navigation-view-button` opener." }, "attributes": [ { "name": "animation", "description": "" }, { "name": "animation-type", "description": "", "values": [ { "name": "elastic" }, { "name": "static" } ] }, { "name": "collapsible", "description": "", "values": [ { "name": "icon" }, { "name": "none" }, { "name": "offcanvas" } ] }, { "name": "nav-view-id", "description": "" }, { "name": "side", "description": "", "values": [ { "name": "left" }, { "name": "right" } ] }, { "name": "swipe-gesture", "description": "" }, { "name": "variant", "description": "", "values": [ { "name": "floating" }, { "name": "inset" }, { "name": "sidebar" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/navigation-view/navigation-view.tsx" } ] }, { "name": "fx-navigation-view-button", "description": { "kind": "markdown", "value": "`fx-navigation-view-button` is a headless icon button that locates a target\n`fx-navigation-view` by its `nav-view-id` and opens/toggles it. It can also\nauto-hide based on the target's open state." }, "attributes": [ { "name": "auto-hide", "description": "" }, { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "disabled", "description": "" }, { "name": "nav-view-id", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/navigation-view-button/navigation-view-button.tsx" } ] }, { "name": "fx-navigation-view-divider", "description": { "kind": "markdown", "value": "`fx-navigation-view-divider` is a structural separator for navigation content." }, "attributes": [], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/navigation-view-divider/navigation-view-divider.tsx" } ] }, { "name": "fx-navigation-view-footer", "description": { "kind": "markdown", "value": "`fx-navigation-view-footer` is a structural footer for navigation content." }, "attributes": [ { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/navigation-view-footer/navigation-view-footer.tsx" } ] }, { "name": "fx-navigation-view-group", "description": { "kind": "markdown", "value": "`fx-navigation-view-group` groups navigation items under an optional header\nlabel. It can be expanded/collapsed when `collapsible` is `true`." }, "attributes": [ { "name": "collapsible", "description": "" }, { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "disabled", "description": "" }, { "name": "label", "description": "" }, { "name": "open", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/navigation-view-group/navigation-view-group.tsx" } ] }, { "name": "fx-navigation-view-header", "description": { "kind": "markdown", "value": "`fx-navigation-view-header` is a structural header for navigation content." }, "attributes": [ { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/navigation-view-header/navigation-view-header.tsx" } ] }, { "name": "fx-navigation-view-item", "description": { "kind": "markdown", "value": "`fx-navigation-view-item` is a headless, accessible navigation item. It can\nrender as a static row, a tappable button, or a link. Active and disabled\nstates are reflected via `data-*` and `aria-*` attributes for theme and\nassistive-technology use." }, "attributes": [ { "name": "active", "description": "" }, { "name": "button", "description": "" }, { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "detail", "description": "" }, { "name": "disabled", "description": "" }, { "name": "href", "description": "" }, { "name": "target", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/navigation-view-item/navigation-view-item.tsx" } ] }, { "name": "fx-otp-field", "description": { "kind": "markdown", "value": "`fx-otp-field` is a headless, accessible one-time-password (OTP) field. It is a\ncomposite widget made of several single-character input boxes that behave as a\nsingle control, following the ARIA Authoring Practices guidance for composite\nwidgets. It exposes every styleable surface via `part` attributes and its state\nthrough `data-*` and ARIA attributes so themes can customize it without internal\nstyles." }, "attributes": [ { "name": "autocapitalize", "description": "" }, { "name": "color", "description": "" }, { "name": "disabled", "description": "" }, { "name": "inputmode", "description": "", "values": [ { "name": "numeric" }, { "name": "text" } ] }, { "name": "length", "description": "" }, { "name": "pattern", "description": "" }, { "name": "readonly", "description": "" }, { "name": "separators", "description": "" }, { "name": "size", "description": "", "values": [ { "name": "lg" }, { "name": "md" }, { "name": "sm" }, { "name": "xl" }, { "name": "xs" } ] }, { "name": "type", "description": "", "values": [ { "name": "number" }, { "name": "text" } ] }, { "name": "value", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/otp-field/otp-field.tsx" } ] }, { "name": "fx-pagination", "description": { "kind": "markdown", "value": "`fx-pagination` is a headless, accessible pagination component. It renders a\n`nav` with page buttons plus optional first/previous/next/last controls and\ncollapsed-range indicators. It ships no styles: every surface is exposed via\n`part` attributes and its state via `data-*`/ARIA attributes." }, "attributes": [ { "name": "active-color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "controls", "description": "" }, { "name": "disabled", "description": "" }, { "name": "edges", "description": "" }, { "name": "first-label", "description": "" }, { "name": "last-label", "description": "" }, { "name": "next-label", "description": "" }, { "name": "page", "description": "" }, { "name": "per-page", "description": "" }, { "name": "prev-label", "description": "" }, { "name": "show-ellipsis", "description": "" }, { "name": "show-first-last", "description": "" }, { "name": "show-pages", "description": "" }, { "name": "show-per-page", "description": "" }, { "name": "show-prev-next", "description": "" }, { "name": "show-total", "description": "" }, { "name": "size", "description": "", "values": [ { "name": "lg" }, { "name": "md" }, { "name": "sm" }, { "name": "xl" }, { "name": "xs" } ] }, { "name": "total", "description": "" }, { "name": "variant", "description": "", "values": [ { "name": "outline" }, { "name": "soft" }, { "name": "solid" }, { "name": "subtle" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/pagination/pagination.tsx" } ] }, { "name": "fx-progress-bar", "description": { "kind": "markdown", "value": "`fx-progress-bar` is a headless, accessible progress bar component. It\nsupports determinate and indeterminate progress, an optional buffer with an\nanimated buffer stream, and a reversed direction. It ships no internal\nstyles; every styleable surface is exposed via `part` attributes and its\nstate through `data-*` and ARIA attributes so themes can customize it\nfreely." }, "attributes": [ { "name": "buffer", "description": "" }, { "name": "color", "description": "" }, { "name": "max", "description": "" }, { "name": "min", "description": "" }, { "name": "reversed", "description": "" }, { "name": "type", "description": "", "values": [ { "name": "determinate" }, { "name": "indeterminate" } ] }, { "name": "value", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/progress-bar/progress-bar.tsx" } ] }, { "name": "fx-radio", "description": { "kind": "markdown", "value": "`fx-radio` is a headless, accessible radio button component. It is designed to\nbe used inside an `fx-radio-group`, but can also be used standalone. It exposes\nevery styleable surface via `part` attributes and its state through `data-*`\nand ARIA attributes so themes can customize it without internal styles." }, "attributes": [ { "name": "checked", "description": "" }, { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "disabled", "description": "" }, { "name": "name", "description": "" }, { "name": "radio-tab-index", "description": "" }, { "name": "readonly", "description": "" }, { "name": "size", "description": "", "values": [ { "name": "lg" }, { "name": "md" }, { "name": "sm" }, { "name": "xl" }, { "name": "xs" } ] }, { "name": "value", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/radio/radio.tsx" } ] }, { "name": "fx-radio-group", "description": { "kind": "markdown", "value": "`fx-radio-group` is a headless, accessible radio group component. It owns the\nselected `value`, propagates state to child `fx-radio` elements, and is\nform-associated so the selected value is submitted with a native `
`." }, "attributes": [ { "name": "allow-empty-selection", "description": "" }, { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "disabled", "description": "" }, { "name": "name", "description": "" }, { "name": "readonly", "description": "" }, { "name": "value", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/radio-group/radio-group.tsx" } ] }, { "name": "fx-range", "description": { "kind": "markdown", "value": "`fx-range` is a headless, accessible slider component supporting single and\ndual knobs, snapping, ticks, and a value pin. It ships no internal styles;\nevery styleable surface is exposed via `part` attributes and its state\nthrough `data-*` and ARIA attributes so themes can customize it freely." }, "attributes": [ { "name": "color", "description": "" }, { "name": "debounce", "description": "" }, { "name": "disabled", "description": "" }, { "name": "dual-knobs", "description": "" }, { "name": "max", "description": "" }, { "name": "min", "description": "" }, { "name": "name", "description": "" }, { "name": "pin", "description": "" }, { "name": "snaps", "description": "" }, { "name": "step", "description": "" }, { "name": "ticks", "description": "" }, { "name": "value", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/range/range.tsx" } ] }, { "name": "fx-refresher", "description": { "kind": "markdown", "value": "`fx-refresher` provides a pull-to-refresh gesture for a scroll container." }, "attributes": [ { "name": "close-duration", "description": "" }, { "name": "disabled", "description": "" }, { "name": "pull-factor", "description": "" }, { "name": "pull-max", "description": "" }, { "name": "pull-min", "description": "" }, { "name": "snapback-duration", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/refresher/refresher.tsx" } ] }, { "name": "fx-refresher-content", "description": { "kind": "markdown", "value": "Presentational content for `fx-refresher`." }, "attributes": [ { "name": "pulling-icon", "description": "" }, { "name": "refreshing-spinner", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/refresher-content/refresher-content.tsx" } ] }, { "name": "fx-ripple", "description": { "kind": "markdown", "value": "`fx-ripple` is a headless pointer-feedback overlay. Place it inside a\nrelatively positioned parent; the overlay fills that parent and never\nintercepts its pointer events.\n\nIn `discrete` behavior, the ripple grows slowly from nothing to a small\nsize across the full delay, then expands to fill the host and fades. A\npersistent ripple holds at full size until release, while release during\nslow growth fades from the current size without expanding." }, "attributes": [ { "name": "behavior", "description": "Ripple behavior. `expanding` starts immediately; `discrete` grows slowly\nfrom nothing to a small size across the full delay, then expands to fill\nthe host and fades. Defaults to `expanding`.", "values": [ { "name": "discrete" }, { "name": "expanding" } ] }, { "name": "color", "description": "Theme color used by the ripple.", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "delay", "description": "Duration in milliseconds of the discrete ripple's slow growth phase before\nits full expansion begins. Defaults to `2000`." }, { "name": "duration", "description": "Expansion duration in milliseconds. Defaults to `600`." }, { "name": "opacity", "description": "Maximum ripple opacity. Defaults to `0.3`." }, { "name": "persistent", "description": "When `true`, a discrete ripple remains expanded while held and fades after\nrelease. Defaults to `false`." }, { "name": "shape", "description": "Ripple shape. `circular` uses a round surface; `rectangular` uses the\ntheme radius. Defaults to `rectangular`.", "values": [ { "name": "circular" }, { "name": "rectangular" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/ripple/ripple.tsx" } ] }, { "name": "fx-search-field", "description": { "kind": "markdown", "value": "`fx-search-field` is a headless, accessible search input. It exposes every\nstyleable surface via `part` attributes and its state through `data-*` and ARIA\nattributes so themes can customize it without internal styles." }, "attributes": [ { "name": "animated", "description": "" }, { "name": "autocomplete", "description": "" }, { "name": "color", "description": "" }, { "name": "debounce", "description": "" }, { "name": "disabled", "description": "" }, { "name": "kbds", "description": "" }, { "name": "placeholder", "description": "" }, { "name": "readonly", "description": "" }, { "name": "show-clear-button", "description": "" }, { "name": "size", "description": "", "values": [ { "name": "lg" }, { "name": "md" }, { "name": "sm" }, { "name": "xl" }, { "name": "xs" } ] }, { "name": "value", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/search-field/search-field.tsx" } ] }, { "name": "fx-segment", "description": { "kind": "markdown", "value": "`fx-segment` is a headless tab bar that controls an `fx-segment-view`. It\nexposes state via `data-*` attributes, supports roving `tabindex` keyboard\nnavigation, optional scroll and swipe behaviors, and emits `fxChange` when\nthe active segment changes." }, "attributes": [ { "name": "content-id", "description": "" }, { "name": "disabled", "description": "" }, { "name": "scrollable", "description": "" }, { "name": "size", "description": "", "values": [ { "name": "lg" }, { "name": "md" }, { "name": "sm" }, { "name": "xl" }, { "name": "xs" } ] }, { "name": "swipe-gesture", "description": "" }, { "name": "value", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/segment/segment.tsx" } ] }, { "name": "fx-segment-button", "description": { "kind": "markdown", "value": "`fx-segment-button` is a headless tab button used inside `fx-segment`.\nIt exposes its selected/disabled state via `data-*` and ARIA attributes and\nnotifies the parent segment when activated by click, Enter, or Space." }, "attributes": [ { "name": "content-id", "description": "" }, { "name": "disabled", "description": "" }, { "name": "segment-tab-index", "description": "" }, { "name": "selected", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/segment-button/segment-button.tsx" } ] }, { "name": "fx-segment-content", "description": { "kind": "markdown", "value": "`fx-segment-content` is a headless tab panel used inside `fx-segment-view`.\nIt exposes its active/mounted state via `data-*` attributes and lets the\nparent view control visibility for performance." }, "attributes": [ { "name": "active", "description": "" }, { "name": "entering", "description": "" }, { "name": "keep-mounted", "description": "" }, { "name": "leaving", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/segment-content/segment-content.tsx" } ] }, { "name": "fx-segment-view", "description": { "kind": "markdown", "value": "`fx-segment-view` is a headless container for `fx-segment-content` panels.\nIt owns which panel is active, keeps inactive panels hidden for performance,\ncan be swiped, and emits a throttled scroll event." }, "attributes": [ { "name": "disabled", "description": "" }, { "name": "keep-contents-mounted", "description": "" }, { "name": "swipe-gesture", "description": "" }, { "name": "value", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/segment-view/segment-view.tsx" } ] }, { "name": "fx-select", "description": { "kind": "markdown", "value": "`fx-select` is a headless, accessible select component. It renders a trigger\nshowing the selected label(s) and a dropdown list populated by slotted\n`fx-select-option` children. It supports single/multiple selection, search\n(with an optional custom matcher), a loading state, keyboard navigation and\nnative form association. Every styleable surface is exposed via `part`\nattributes and its state via `data-*`/`aria-*` attributes." }, "attributes": [ { "name": "color", "description": "" }, { "name": "disabled", "description": "" }, { "name": "loading", "description": "" }, { "name": "multiple", "description": "" }, { "name": "name", "description": "" }, { "name": "readonly", "description": "" }, { "name": "required", "description": "" }, { "name": "search", "description": "" }, { "name": "size", "description": "", "values": [ { "name": "lg" }, { "name": "md" }, { "name": "sm" }, { "name": "xl" }, { "name": "xs" } ] }, { "name": "value", "description": "" }, { "name": "variant", "description": "", "values": [ { "name": "outline" }, { "name": "soft" }, { "name": "solid" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/select/select.tsx" } ] }, { "name": "fx-select-option", "description": { "kind": "markdown", "value": "`fx-select-option` is a headless option used inside `fx-select`. It registers\nits `value` with the parent select on connect and deregisters on disconnect.\nEvery styleable surface is exposed via `part` attributes and its state via\n`data-*`/`aria-*` attributes plus the `is-hovered`/`is-clicked` host classes." }, "attributes": [ { "name": "active", "description": "" }, { "name": "disabled", "description": "" }, { "name": "filtered", "description": "" }, { "name": "highlight-query", "description": "" }, { "name": "label", "description": "" }, { "name": "selected", "description": "" }, { "name": "value", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/select-option/select-option.tsx" } ] }, { "name": "fx-separator", "description": { "kind": "markdown", "value": "`fx-separator` is a headless, accessible separator component. It draws a\ndividing line between content and can optionally render a label. It exposes\nevery styleable surface via `part` attributes and its state through\n`data-*` and `aria-*` attributes so themes can customize it without\ninternal styles." }, "attributes": [ { "name": "label", "description": "" }, { "name": "orientation", "description": "", "values": [ { "name": "horizontal" }, { "name": "vertical" } ] }, { "name": "position", "description": "", "values": [ { "name": "center" }, { "name": "end" }, { "name": "start" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/separator/separator.tsx" } ] }, { "name": "fx-sideover", "description": { "kind": "markdown", "value": "`fx-sideover` is a headless, accessible sliding panel (side-over) component.\nIt surfaces a titled dialog that slides in from a configured edge, supports\nan optional `fx-backdrop`, and exposes every styleable surface via `part`\nattributes and state through `data-*` / ARIA attributes so themes can\ncustomize it without internal styles." }, "attributes": [ { "name": "backdrop", "description": "" }, { "name": "backdrop-dismiss", "description": "" }, { "name": "can-dismiss", "description": "" }, { "name": "description", "description": "" }, { "name": "header", "description": "" }, { "name": "inset", "description": "" }, { "name": "is-open", "description": "" }, { "name": "position", "description": "", "values": [ { "name": "bottom" }, { "name": "left" }, { "name": "right" }, { "name": "top" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/sideover/sideover.tsx" } ] }, { "name": "fx-skeleton", "description": { "kind": "markdown", "value": "`fx-skeleton` is a headless, accessible skeleton placeholder component.\nIt renders a generic block element that consumers style entirely from the\noutside (dimensions, background, border-radius, shimmer animations, etc.)\nvia the `base` part, the host `fx-skeleton--animated` class, and the\n`data-animated` attribute.\n\nWhen rendered inside a media component (`fx-avatar`, `fx-thumbnail`), the\nhost receives the `in-media` class and `data-in-media=\"true\"` so themes can\napply `width: 100%; height: 100%` and match the container's shape." }, "attributes": [ { "name": "animated", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/skeleton/skeleton.tsx" } ] }, { "name": "fx-spinner", "description": { "kind": "markdown", "value": "`fx-spinner` is a headless, accessible loading spinner. It exposes its\nsurfaces via `part` attributes and its state through `data-*` attributes so\nthemes can customize it without internal styles. The spinner renders inline\nSVG strokes so it stays visible even when no theme is loaded." }, "attributes": [ { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "duration", "description": "" }, { "name": "paused", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/spinner/spinner.tsx" } ] }, { "name": "fx-split-pane", "description": { "kind": "markdown", "value": "`fx-split-pane` is a headless, accessible multi-panel layout component.\nThe `when` and `menuWhen` props independently control when the sub-menu and\nmenu panels dock beside the content panel. Overlay panels can be revealed by\ntrigger buttons and left-to-right edge swipes." }, "attributes": [ { "name": "disabled", "description": "" }, { "name": "menu-max-width", "description": "" }, { "name": "menu-min-width", "description": "" }, { "name": "menu-when", "description": "" }, { "name": "sub-menu-max-width", "description": "" }, { "name": "sub-menu-min-width", "description": "" }, { "name": "when", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/split-pane/split-pane.tsx" } ] }, { "name": "fx-step", "description": { "kind": "markdown", "value": "`fx-step` is a headless, accessible step used inside `fx-stepper`. Its\nheader, description and icon can be provided either through props or through\nthe matching named slots, and its state is reflected via `data-*` attributes\nso themes can customize it without internal styles.\n\nThe `active`, `completed` and `disabled` states are managed by the parent\n`fx-stepper` through its `value` and `disabled` props. The active step is\nmarked with `aria-current=\"step\"`; a step is a progress marker, not a tab,\nso it is neither focusable nor activatable by the user.\n\nThe `icon` slot is `aria-hidden` because the indicator is decorative; put\nany content assistive technology must announce in `header` or `description`." }, "attributes": [ { "name": "active", "description": "" }, { "name": "completed", "description": "" }, { "name": "description", "description": "" }, { "name": "disabled", "description": "" }, { "name": "header", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/step/step.tsx" } ] }, { "name": "fx-stepper", "description": { "kind": "markdown", "value": "`fx-stepper` is a headless, accessible stepper container for `fx-step`\nchildren. It tracks the active step through its `value` prop (a zero-based\nindex), marks previous steps as completed, propagates `disabled` to all\nsteps and exposes its state through `data-*` attributes so themes can\ncustomize it without internal styles.\n\nSteps register themselves with the closest `fx-stepper` on\n`connectedCallback` and unregister on `disconnectedCallback`.\n\nThe stepper is a progress indicator, not a tab list: the active step is\nadvertised with `aria-current=\"step\"` on the step itself and steps are not\nfocusable or activatable by the user. Drive it with `setValue()`." }, "attributes": [ { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "disabled", "description": "" }, { "name": "orientation", "description": "", "values": [ { "name": "horizontal" }, { "name": "vertical" } ] }, { "name": "value", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/stepper/stepper.tsx" } ] }, { "name": "fx-tag-field", "description": { "kind": "markdown", "value": "`fx-tag-field` is a headless, accessible tag field component. It exposes every\nstyleable surface via `part` attributes and its state through `data-*` and ARIA\nattributes so themes can customize it without internal styles." }, "attributes": [ { "name": "disabled", "description": "" }, { "name": "max", "description": "" }, { "name": "placeholder", "description": "" }, { "name": "readonly", "description": "" }, { "name": "size", "description": "", "values": [ { "name": "lg" }, { "name": "md" }, { "name": "sm" }, { "name": "xl" }, { "name": "xs" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/tag-field/tag-field.tsx" } ] }, { "name": "fx-text", "description": { "kind": "markdown", "value": "`fx-text` wraps arbitrary content and applies a theme text color without\nchanging the content's inline-level layout. The base part accepts flow\ncontent while using `display: contents` in the theme." }, "attributes": [ { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/text/text.tsx" } ] }, { "name": "fx-text-field", "description": { "kind": "markdown", "value": "`fx-text-field` is a headless, accessible single-line text input. It exposes\nevery styleable surface via `part` attributes and its state through `data-*`\nand ARIA attributes so themes can customize it without internal styles." }, "attributes": [ { "name": "autocapitalize", "description": "" }, { "name": "autocomplete", "description": "" }, { "name": "autocorrect", "description": "" }, { "name": "autofocus", "description": "" }, { "name": "clear-input", "description": "" }, { "name": "clear-on-edit", "description": "" }, { "name": "color", "description": "" }, { "name": "counter", "description": "" }, { "name": "debounce", "description": "" }, { "name": "disabled", "description": "" }, { "name": "enterkeyhint", "description": "" }, { "name": "inputmode", "description": "" }, { "name": "spellcheck", "description": "" }, { "name": "maxlength", "description": "" }, { "name": "minlength", "description": "" }, { "name": "name", "description": "" }, { "name": "pattern", "description": "" }, { "name": "placeholder", "description": "" }, { "name": "prefix-text", "description": "" }, { "name": "readonly", "description": "" }, { "name": "required", "description": "" }, { "name": "size", "description": "", "values": [ { "name": "lg" }, { "name": "md" }, { "name": "sm" }, { "name": "xl" }, { "name": "xs" } ] }, { "name": "suffix-text", "description": "" }, { "name": "type", "description": "", "values": [ { "name": "date" }, { "name": "datetime-local" }, { "name": "email" }, { "name": "month" }, { "name": "number" }, { "name": "password" }, { "name": "search" }, { "name": "tel" }, { "name": "text" }, { "name": "time" }, { "name": "url" }, { "name": "week" } ] }, { "name": "value", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/text-field/text-field.tsx" } ] }, { "name": "fx-textarea", "description": { "kind": "markdown", "value": "`fx-textarea` is a headless, accessible multi-line text input. It exposes every\nstyleable surface via `part` attributes and its state through `data-*` and ARIA\nattributes so themes can customize it without internal styles." }, "attributes": [ { "name": "auto-grow", "description": "" }, { "name": "autofocus", "description": "" }, { "name": "clear-on-edit", "description": "" }, { "name": "cols", "description": "" }, { "name": "counter", "description": "" }, { "name": "debounce", "description": "" }, { "name": "disabled", "description": "" }, { "name": "inputmode", "description": "", "values": [ { "name": "decimal" }, { "name": "email" }, { "name": "none" }, { "name": "numeric" }, { "name": "search" }, { "name": "tel" }, { "name": "text" }, { "name": "url" } ] }, { "name": "spellcheck", "description": "" }, { "name": "maxlength", "description": "" }, { "name": "minlength", "description": "" }, { "name": "name", "description": "" }, { "name": "placeholder", "description": "" }, { "name": "readonly", "description": "" }, { "name": "required", "description": "" }, { "name": "rows", "description": "" }, { "name": "size", "description": "", "values": [ { "name": "lg" }, { "name": "md" }, { "name": "sm" }, { "name": "xl" }, { "name": "xs" } ] }, { "name": "value", "description": "" }, { "name": "wrap", "description": "", "values": [ { "name": "hard" }, { "name": "off" }, { "name": "soft" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/textarea/textarea.tsx" } ] }, { "name": "fx-title", "description": { "kind": "markdown", "value": "`fx-title` is a headless toolbar title. It exposes the visible title\nsurface through a part and leaves heading semantics to the consumer." }, "attributes": [ { "name": "size", "description": "Controls the title's typographic scale. The shared size scale keeps\ntoolbar components interoperable without introducing a component-local\ntype.", "values": [ { "name": "lg" }, { "name": "md" }, { "name": "sm" }, { "name": "xl" }, { "name": "xs" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/title/title.tsx" } ] }, { "name": "fx-toast", "description": { "kind": "markdown", "value": "`fx-toast` is a headless, accessible toast overlay. It surfaces short\nmessages with an optional header, default content slot, and icon slot.\nThe toast can be presented inline, created through `toastController`, or\nspawned with `createToast` from `@fx-ui/core`. When spawned programmatically,\ntoasts are queued in a position-aware stack so they never overlap.\nIt exposes every styleable surface via `part` attributes and its state\nthrough `data-*` and ARIA attributes so themes can customize it without\ninternal styles." }, "attributes": [ { "name": "close-button", "description": "" }, { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "duration", "description": "" }, { "name": "header", "description": "" }, { "name": "is-open", "description": "" }, { "name": "keyboard-close", "description": "" }, { "name": "message", "description": "" }, { "name": "position", "description": "", "values": [ { "name": "bottom" }, { "name": "middle" }, { "name": "top" } ] }, { "name": "splash", "description": "" }, { "name": "splash-duration", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/toast/toast.tsx" } ] }, { "name": "fx-toggle", "description": { "kind": "markdown", "value": "`fx-toggle` is a headless, accessible form-associated switch component.\nIt exposes every styleable surface via `part` attributes and its state\nthrough `data-*` and ARIA attributes so themes can customize it without\ninternal styles." }, "attributes": [ { "name": "checked", "description": "" }, { "name": "color", "description": "", "values": [ { "name": "danger" }, { "name": "dark" }, { "name": "light" }, { "name": "medium" }, { "name": "primary" }, { "name": "secondary" }, { "name": "success" }, { "name": "tertiary" }, { "name": "warning" } ] }, { "name": "disabled", "description": "" }, { "name": "name", "description": "" }, { "name": "readonly", "description": "" }, { "name": "required", "description": "" }, { "name": "value", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/toggle/toggle.tsx" } ] }, { "name": "fx-toolbar", "description": { "kind": "markdown", "value": "`fx-toolbar` is a headless layout container for toolbar content. It\nprovides named slots for leading, trailing, and title-adjacent content while\nexposing its layout surfaces through shadow parts.\n\nThe `mode` prop controls the placement of the primary and secondary slots.\nThe default `md` mode places secondary content after start content and\nprimary content at the far edge. `ios` places secondary and primary content\non either side of the default content.\n\n The host has `role=\"toolbar\"`. Set `aria-label` or `aria-labelledby` on\n the host to provide an accessible name when the toolbar needs one.\n The default content is centered within the flexible space remaining after\n the edge slots; consumers should keep edge content compact when a\n mathematically centered title is required." }, "attributes": [ { "name": "mode", "description": "The platform layout mode. `md` is the default ordering.", "values": [ { "name": "ios" }, { "name": "md" } ] } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/toolbar/toolbar.tsx" } ] }, { "name": "fx-tooltip", "description": { "kind": "markdown", "value": "`fx-tooltip` is a headless, accessible tooltip. It exposes every styleable\nsurface via `part` attributes and its state through `data-*` and ARIA\nattributes so themes can customize it without internal styles.\n\nThe tooltip shows after a configurable delay when the slotted trigger is\nhovered or focused, and hides when the pointer leaves or the trigger loses\nfocus. The `visible` prop allows manual control." }, "attributes": [ { "name": "animation", "description": "" }, { "name": "delay", "description": "" }, { "name": "position", "description": "", "values": [ { "name": "bottom" }, { "name": "left" }, { "name": "right" }, { "name": "top" } ] }, { "name": "text", "description": "" }, { "name": "visible", "description": "" } ], "references": [ { "name": "Source code", "url": "https:/gitlab.com/nuinalp/open-source/fx/fx-framework/core/src/components/tooltip/tooltip.tsx" } ] } ] }