Typen Komponenten

Insight UI verwendet Typ-Literale, um die Typsicherheit zu gewährleisten und die Autovervollständigung in der IDE zu ermöglichen. Diese Typen definieren die zulässigen Werte für Komponentenparameter wie Größen, Farben und Positionen. Alle Typen sind in insight_ui.configs.types definiert und können für Typ-Annotationen importiert werden.

Anwendungsbeispiel

from insight_ui.configs.types import Size, ColorType # Type hints for function parameters def create_button(size: Size = "m", color: ColorType = "primary"): ... # Direct value usage in templates {% button label="Click" size="l" type="secondary" %}

Schnellnavigation

AlertType BadgeType ButtonType ColorType CornerPosition FilterFieldType FormFieldType GeoMapMarkerType HtmlButtonType HtmlInputType HttpMethod HtmxSwapMethod IconColor InlinePosition Size SliderLegendMode StepStatus ToggleViewType

Typenübersicht

AlertType

Semantic types for alerts and notifications.

Werte

info success warning error

BadgeType

Extended color palette for badges, includes 'disabled' state.

Werte

primary secondary neutral info success warning danger disabled

ButtonType

Extended color palette for buttons, includes 'link' variant.

Werte

primary secondary neutral info success warning danger link

ColorType

Base color palette for semantic coloring of components.

Werte

primary secondary neutral info success warning danger

CornerPosition

Corner positions for ribbons, badges, and overlays.

Werte

top-right top-left bottom-right bottom-left

FilterFieldType

Field types for query builder and filter components.

Werte

text number date datetime time boolean choice

FormFieldType

High-level form field types for the form component.

Werte

text password email number tel url date textarea select

GeoMapMarkerType

Marker types for the geo map component.

Werte

marker circle

HtmlButtonType

Native HTML button type attribute values.

Werte

button submit reset

HtmlInputType

Native HTML input type attribute values.

Werte

text password email number tel url date time datetime-local month week color file hidden checkbox radio

HttpMethod

HTTP methods for requests.

Werte

get post

HtmxSwapMethod

HTMX swap methods for content replacement.

Werte

innerHTML outerHTML beforebegin afterbegin beforeend afterend delete none

IconColor

Color tokens for icons (semantic colors and text colors).

Werte

"" primary secondary success warning danger info text-headline text-body text-muted text-link

InlinePosition

Inline positions respecting text direction (RTL-aware).

Werte

start end

Size

Standard size scale used for spacing, icons, and component dimensions.

Werte

xs s m l xl

SliderLegendMode

Legend display modes for the range slider component.

Werte

static skip rotate

StepStatus

Status values for stepper components indicating step progress.

Werte

active success failed ""

ToggleViewType

View types for the toggle view component.

Werte

card table carousel

Validierung

Jeder Typ verfügt über eine entsprechende Validierungsfunktion, welche einen ValueError auslöst, wenn ein ungültiger Wert übergeben wird. Diese Validatoren werden bei der Initialisierung automatisch in den Konfigurations-Dataklassen aufgerufen.

from insight_ui.configs.types import validate_size, validate_color_type # Raises ValueError for invalid values validate_size("invalid") # ValueError: Invalid size 'invalid'. ... validate_color_type("primary") # OK # Validators support custom field names for error messages validate_size("xl", field_name="icon_size") # Uses 'icon_size' in error message