@ziyarago/ui 0.13.0 → 0.15.0

package/types/react.d.ts

@@ -22,108 +22,6 @@ export interface UiAccordionProps {
 }
 export const UiAccordion: ComponentType<UiAccordionProps>;
 
-/**
- * Card with a title and built-in collapse, refresh and remove controls.
- * Note: With collapsed set, update it from the collapse event, otherwise the card will not toggle.
- * Note: Removing hides the card until the component is remounted; also remove it from your data on the remove event.
- */
-export interface UiActionCardProps {
-  /** Card title. */
-  title: string;
-  /** Text under the title. */
-  subtitle?: string;
-  /** Controlled collapsed state. When omitted the card keeps it internally. */
-  collapsed?: boolean;
-  /** Controlled refresh spinner. When omitted, Refresh shows the spinner for 1.8s by itself. */
-  loading?: boolean;
-  /**
-   * Card padding and font size.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with the new collapsed boolean when the collapse button is clicked.
-   * @event collapse
-   */
-  onCollapse?: (collapsed: boolean) => void;
-  /**
-   * Refresh button clicked. Pass loading to show your own spinner.
-   * @event refresh
-   */
-  onRefresh?: () => void;
-  /**
-   * Remove button clicked; the card hides itself afterwards.
-   * @event remove
-   */
-  onRemove?: () => void;
-  children?: ReactNode;
-}
-export const UiActionCard: ComponentType<UiActionCardProps>;
-
-/**
- * Floating vertical or horizontal rail of icon buttons with a highlighted active item.
- * Note: Items other than the active one are shown as ghost buttons; label is the accessible name.
- */
-export interface UiActionRailProps {
-  /**
-   * Rail entries. An item with separator: true renders a divider instead of a button.
-   * @default []
-   */
-  items: { value?: string; icon?: string; label?: string; separator?: boolean }[];
-  /** Value of the active item. Changed via the change event. */
-  value?: string;
-  /**
-   * Button size inside the rail.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with the value of the clicked item.
-   * @event change
-   */
-  onChange?: (value: string) => void;
-  children?: ReactNode;
-}
-export const UiActionRail: ComponentType<UiActionRailProps>;
-
-/** Bottom sheet with a list of actions and a Cancel button; use for mobile "more actions" menus. */
-export interface UiActionsheetProps {
-  /**
-   * Shows the sheet when true; renders nothing when false.
-   * @default false
-   */
-  open?: boolean;
-  /** Optional heading. */
-  title?: string;
-  /**
-   * Actions. Each item runs its own onClick, then select, then the sheet closes. Tone "danger" colors it red.
-   * @default []
-   */
-  items?: { label: string; icon?: string; tone?: 'danger'; disabled?: boolean; onClick?: () => void }[];
-  /**
-   * Text of the cancel row.
-   * @default 'Cancel'
-   */
-  cancelLabel?: string;
-  /**
-   * Scale of sheet width and padding.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with the whole clicked item after its onClick.
-   * @event select
-   */
-  onSelect?: (item: NonNullable<UiActionsheetProps['items']>[number]) => void;
-  /**
-   * Called after any item is chosen, on Cancel, on the Escape key and on a scrim click.
-   * @event close
-   */
-  onClose?: () => void;
-  children?: ReactNode;
-}
-export const UiActionsheet: ComponentType<UiActionsheetProps>;
-
 /**
  * Inline message block with a tone icon, optional title and close button; use for form errors, notices and results inside a page.
  * Note: Has role="alert", so screen readers announce it when it appears.
@@ -236,44 +134,6 @@ export interface UiAuthLayoutProps {
 }
 export const UiAuthLayout: ComponentType<UiAuthLayoutProps>;
 
-/**
- * Sign-in layout with a media panel: dark photo card with floating avatars, light gradient card with a social-proof pill, or a tinted panel with a glass caption. The default slot is the form.
- * Note: logo, footer, image, people are props in both Vue and React. The media panel is hidden below the form on narrow screens (stacks under it).
- */
-export interface UiAuthShowcaseProps {
-  /**
-   * 'photo': one framed card, media on the left. 'light': gradient form card, proof pill below, glass caption on the media. 'tint': like light, with a coloured panel, a heading on the media and cyan accent.
-   * @default 'photo'
-   */
-  variant?: 'photo' | 'light' | 'tint';
-  /** Form heading. */
-  title: string;
-  /** Text under the heading. */
-  subtitle?: string;
-  /** Logo node above the heading. */
-  logo?: ReactNode;
-  /** Content under the fields, for example "No account? Sign up". */
-  footer?: ReactNode;
-  /** URL of the media image. Without it the panel shows an accent gradient. */
-  image?: string;
-  /** Large text on the media panel (photo and tint). */
-  headline?: string;
-  /** Small text on the media panel (photo) or inside the glass bar (light, tint). */
-  caption?: string;
-  /** Line at the bottom of the media panel; photo only. */
-  quote?: string;
-  /** Pill labels inside the glass bar; light and tint. */
-  chips?: string[];
-  /** Avatars: floating on the photo, stacked in the proof pill. */
-  people?: { name: string; src?: string }[];
-  /** Social-proof title, e.g. "Join 20k+ users"; light and tint. Shows the pill under the form. */
-  proof?: string;
-  /** Second line of the proof pill. */
-  proofHint?: string;
-  children?: ReactNode;
-}
-export const UiAuthShowcase: ComponentType<UiAuthShowcaseProps>;
-
 /**
  * Two-column sign-in layout with a brand panel on the left and the form on the right.
  * Note: logo and aside are props in both Vue and React (pass a VNode / element).
@@ -384,29 +244,6 @@ export interface UiBannerProps {
 }
 export const UiBanner: ComponentType<UiBannerProps>;
 
-/** Compact booking summary: code, status, guest, hotel, dates and total. */
-export interface UiBookingCardProps {
-  /** Booking reference, monospaced. */
-  code: string;
-  /** Status text. Confirmed is green, Pending amber, Cancelled red; any other value gets a neutral badge. */
-  status?: 'Confirmed' | 'Pending' | 'Cancelled' | string;
-  /** Guest name, also drives the avatar initials. */
-  guest?: string;
-  /** Hotel name under the guest. */
-  hotel?: string;
-  /** Preformatted date range, e.g. "12-19 Mar". */
-  dates?: string;
-  /** Total, formatted as "SAR 1 200". */
-  amount?: number;
-  /**
-   * Scales padding, text and avatars.
-   * @default 'md'
-   */
-  size?: Size;
-  children?: ReactNode;
-}
-export const UiBookingCard: ComponentType<UiBookingCardProps>;
-
 /**
  * Panel anchored to the bottom of the screen with a grab handle; use for mobile pickers and short forms.
  * Note: The handle is decorative: it does not support dragging.
@@ -584,106 +421,6 @@ export interface UiCalendarProps {
 }
 export const UiCalendar: ComponentType<UiCalendarProps>;
 
-/** Month calendar that marks days with events, wrapping Calendar with a list-style events prop. */
-export interface UiCalendarViewProps {
-  /**
-   * Marked days. date is "YYYY-MM-DD"; label shows as the day tooltip.
-   * @default []
-   */
-  events?: { date: string; label: string }[];
-  /**
-   * Selected date. Vue v-model, React modelValue + onChange.
-   * @remarks Forwarded to the inner element.
-   */
-  modelValue?: string | number | Date;
-  /**
-   * BCP 47 locale for month and weekday names.
-   * @default 'en-GB'
-   * @remarks Forwarded to the inner element.
-   */
-  locale?: string;
-  /**
-   * First day of the week, 0 is Sunday and 1 is Monday.
-   * @default 1
-   * @remarks Forwarded to the inner element.
-   */
-  weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
-  /**
-   * Called with the clicked Date (local time). Forwarded to Calendar.
-   * @event change
-   */
-  onChange?: (date: Date) => void;
-  children?: ReactNode;
-}
-export const UiCalendarView: ComponentType<UiCalendarViewProps>;
-
-/** Call recording card with status badge, a playback progress bar and duration. */
-export interface UiCallCardProps {
-  /** Caller name. */
-  name: string;
-  /** Phone number. */
-  phone?: string;
-  /** Badge text. Known statuses (case-insensitive): Answered green, Missed and Declined red, Voicemail and Busy amber, Ringing blue. Any other value is neutral. The badge is hidden when empty. */
-  status?: 'Answered' | 'Missed' | 'Voicemail' | 'Busy' | 'Declined' | string;
-  /** Extra or overriding status to tone mapping, e.g. { "No answer": "warning" }. */
-  statusTones?: Record<string, 'success' | 'danger' | 'warning' | 'info' | 'brand'>;
-  /**
-   * Playback progress 0-100.
-   * @default 0
-   */
-  progress?: number;
-  /** Duration in seconds. */
-  duration?: number;
-  /**
-   * Minute and second unit labels for the duration.
-   * @default { m: 'm', s: 's' }
-   */
-  durUnits?: { m?: string; s?: string };
-  /** Override built-in English strings. play is the aria-label of the play button. */
-  labels?: { play?: string };
-  /**
-   * Scales padding, text and avatars.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with no arguments when the play button is clicked.
-   * @event play
-   */
-  onPlay?: () => void;
-  children?: ReactNode;
-}
-export const UiCallCard: ComponentType<UiCallCardProps>;
-
-/** One-line call log row with avatar, status, duration and a play button. */
-export interface UiCallRowProps {
-  /** Caller name. */
-  name: string;
-  /** Status text before the duration, e.g. "Answered". */
-  status?: string;
-  /** Duration in seconds, formatted as "3 m 05 s" (units from durUnits); shows a dash when missing. */
-  duration?: number;
-  /**
-   * Minute and second unit labels for localized durations, e.g. { m: "min", s: "sec" }.
-   * @default { m: 'm', s: 's' }
-   */
-  durUnits?: { m?: string; s?: string };
-  /** Override built-in English strings. play is the aria-label of the play button. */
-  labels?: { play?: string };
-  /**
-   * Scales padding, text and avatars.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with no arguments when the play button is clicked.
-   * @event play
-   */
-  onPlay?: () => void;
-  children?: ReactNode;
-}
-export const UiCallRow: ComponentType<UiCallRowProps>;
-
 /**
  * Glass surface container with an optional title header, used to group related content.
  * Note: Vue slot names are React props (actions) and children (default).
@@ -738,42 +475,6 @@ export interface UiCardProps {
 }
 export const UiCard: ComponentType<UiCardProps>;
 
-/**
- * Slideshow of image slides with captions, arrows and dot pagination.
- * Note: Arrows wrap around at both ends and are hidden with fewer than 2 slides; an empty items array renders an empty frame.
- * Note: Autoplay has no visible pause button; hover or focus pauses it. Prefer a manual carousel for essential content.
- */
-export interface UiCarouselProps {
-  /**
-   * Slides. title and sub form the caption over the image.
-   * @default []
-   */
-  items: { image?: string; title: string; sub?: string }[];
-  /** Controlled active slide index. When set, the carousel only changes slide when you update it from onChange; when omitted it keeps its own state starting at 0. */
-  index?: number;
-  /** Advance automatically every N milliseconds (true = 5000). Starts only in the browser, pauses while the pointer is over or focus is inside the carousel and while the tab is hidden, and is disabled for prefers-reduced-motion and data-motion="off". Needs at least 2 slides. */
-  autoplay?: number | boolean;
-  /** Accessible name of the carousel region. */
-  label?: string;
-  /**
-   * Override the aria-labels of the arrows and dots.
-   * @default { prev: 'Previous', next: 'Next', slide: 'Slide' }
-   */
-  labels?: { prev?: string; next?: string; slide?: string };
-  /**
-   * Slide aspect ratio and caption size: xs 16/6, sm 16/7, md 16/8, lg 16/9, xl 16/10.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with the new slide index on arrow, dot, keyboard (left and right arrows) and autoplay changes.
-   * @event change
-   */
-  onChange?: (index: number) => void;
-  children?: ReactNode;
-}
-export const UiCarousel: ComponentType<UiCarouselProps>;
-
 /** Centers its children horizontally and vertically. */
 export interface UiCenterProps {
   /**
@@ -787,64 +488,6 @@ export interface UiCenterProps {
 }
 export const UiCenter: ComponentType<UiCenterProps>;
 
-/** Card shell for a chart with title, subtitle and an optional overflow menu; put the chart in the default slot. */
-export interface UiChartCardProps {
-  /** Card title. */
-  title: string;
-  /** Muted line under the title. */
-  subtitle?: string;
-  /** Labels of overflow menu items shown behind a three-dot button. An item named "Delete" is styled as danger. */
-  menu?: string[];
-  /**
-   * Padding, gap and title size.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with the clicked menu item label (the string from menu); the menu closes afterwards.
-   * @event menu
-   */
-  onMenu?: (label: string) => void;
-  children?: ReactNode;
-}
-export const UiChartCard: ComponentType<UiChartCardProps>;
-
-/**
- * Chat panel with message bubbles, a typing indicator and an input, for AI assistant UIs.
- * Note: Append the user message and the reply to messages yourself; set loading while waiting.
- */
-export interface UiChatAiProps {
-  /**
-   * Conversation in order. Any role other than "user" renders as an assistant bubble.
-   * @default []
-   */
-  messages: { role: 'user' | 'ai'; text: string }[];
-  /**
-   * Shows the typing dots and disables sending.
-   * @default false
-   */
-  loading?: boolean;
-  /**
-   * Header title; also the aria-label. The header renders only when set.
-   * @default 'Assistant'
-   */
-  title?: string;
-  /** Muted text next to the title. */
-  subtitle?: string;
-  /**
-   * Input placeholder.
-   * @default Ask anything…
-   */
-  placeholder?: string;
-  /**
-   * Called with the trimmed message text when the user presses Enter or the send button. The component does not append it to messages.
-   * @event send
-   */
-  onSend?: (text: string) => void;
-  children?: ReactNode;
-}
-export const UiChatAi: ComponentType<UiChatAiProps>;
-
 /**
  * Boolean checkbox with an inline label. Use for opt-ins and independent yes/no choices.
  * Note: Rendered as a button with role="checkbox". When disabled it is dimmed, shows a not-allowed cursor and ignores clicks.
@@ -923,49 +566,6 @@ export interface UiChipProps {
 }
 export const UiChip: ComponentType<UiChipProps>;
 
-/**
- * Input that turns typed text into removable chips. Use for tags, keywords and email lists.
- * Note: Enter or comma adds a chip, Backspace on empty input removes the last one. Duplicates are ignored.
- */
-export interface UiChipInputProps {
-  /**
-   * Current chips.
-   * @default []
-   */
-  modelValue?: string[];
-  /** Maximum number of chips. Extra entries are ignored. */
-  maxItems?: number;
-  /**
-   * Label shown above the control.
-   * @remarks Forwarded to the inner element.
-   */
-  label?: string;
-  /** Placeholder, shown only while there are no chips. */
-  placeholder?: string;
-  /**
-   * Helper text under the control. Hidden while error is set.
-   * @remarks Forwarded to the inner element.
-   */
-  hint?: string;
-  /**
-   * Error message under the control. Turns the control red and is announced with role="alert".
-   * @remarks Forwarded to the inner element.
-   */
-  error?: string;
-  /**
-   * Control height, font and padding scale.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with the new array when a chip is added or removed.
-   * @event change
-   */
-  onChange?: (value: string[]) => void;
-  children?: ReactNode;
-}
-export const UiChipInput: ComponentType<UiChipInputProps>;
-
 /**
  * Code block with a header (title or language) and a copy button; use for snippets and commands.
  * Note: The header falls back to the text "code" when neither title nor language is set.
@@ -1026,37 +626,6 @@ export interface UiCodeInputProps {
 }
 export const UiCodeInput: ComponentType<UiCodeInputProps>;
 
-/**
- * Swatch row for choosing a color from presets. Use for tags, labels and theme accents.
- * Note: Preset-only: there is no free color input.
- */
-export interface UiColorPickerProps {
-  /** Selected color, same string as in presets. */
-  modelValue?: string;
-  /**
-   * CSS colors offered as swatches.
-   * @default ['#BC926A', '#5FAACC', '#3FD13F', '#E26E5F', '#E8B964', '#A98BD6', '#1B1919']
-   */
-  presets?: string[];
-  /**
-   * Label shown above the control.
-   * @remarks Forwarded to the inner element.
-   */
-  label?: string;
-  /**
-   * Swatch size.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with the clicked color string.
-   * @event change
-   */
-  onChange?: (value: string) => void;
-  children?: ReactNode;
-}
-export const UiColorPicker: ComponentType<UiColorPickerProps>;
-
 /**
  * Searchable single-choice dropdown. Use for long option lists where typing to filter is faster than scrolling.
  * Note: Selecting from the list is the only way to set a value: free text is never emitted.
@@ -1118,27 +687,6 @@ export interface UiComboboxProps {
 }
 export const UiCombobox: ComponentType<UiComboboxProps>;
 
-/** Floating glass toolbar of icon buttons; use for selection actions or editor tools. */
-export interface UiCommandBarProps {
-  /**
-   * Buttons. label is the tooltip and aria-label, icon defaults to "circle", separator true draws a divider.
-   * @default []
-   */
-  items?: { id: string; icon?: string; label: string; disabled?: boolean; separator?: boolean }[];
-  /**
-   * Scale of button size and padding.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with the item id when a button is clicked.
-   * @event action
-   */
-  onAction?: (id: string) => void;
-  children?: ReactNode;
-}
-export const UiCommandBar: ComponentType<UiCommandBarProps>;
-
 /**
  * Searchable list of commands in a top-aligned dialog; use for a Cmd+K launcher.
  * Note: Keyboard: ArrowDown/ArrowUp move the active command (wraps around, aria-selected), Enter runs it, Escape closes. The active item resets to the first one when the query changes.
@@ -1233,41 +781,6 @@ export interface UiConfirmDialogProps {
 }
 export const UiConfirmDialog: ComponentType<UiConfirmDialogProps>;
 
-/** Contact detail card with avatar, role, contact fields and Call / Message buttons. */
-export interface UiContactPanelProps {
-  /** Contact name. */
-  name: string;
-  /** Role or company under the name. */
-  role?: string;
-  /** Phone row. */
-  phone?: string;
-  /** Telegram handle row. */
-  telegram?: string;
-  /** Email row. */
-  email?: string;
-  /** City row. */
-  city?: string;
-  /** Override built-in English strings. */
-  labels?: { call?: string; message?: string };
-  /**
-   * Scales padding, text and avatars.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with no arguments when Call is clicked.
-   * @event call
-   */
-  onCall?: () => void;
-  /**
-   * Called with no arguments when Message is clicked.
-   * @event message
-   */
-  onMessage?: () => void;
-  children?: ReactNode;
-}
-export const UiContactPanel: ComponentType<UiContactPanelProps>;
-
 /**
  * Wraps an area and shows a menu at the cursor on right click; use for row and canvas actions.
  * Note: The native context menu is prevented inside the area. Clicking outside, right-clicking again or pressing Escape closes it.
@@ -1326,46 +839,6 @@ export interface UiCopyButtonProps {
 }
 export const UiCopyButton: ComponentType<UiCopyButtonProps>;
 
-/** Row with a country code badge, amount, country name and a percentage change. */
-export interface UiCountryRowProps {
-  /** Short code shown in the circle, such as "UZ". */
-  code: string;
-  /** Country name. */
-  name: string;
-  /** Formatted amount shown in bold. */
-  amount: string | number;
-  /** Percentage change such as "+8%" or "-2%". */
-  pct?: string;
-  children?: ReactNode;
-}
-export const UiCountryRow: ComponentType<UiCountryRowProps>;
-
-/**
- * Table whose rows are collapsed into labeled groups, with optional per-row expandable details.
- * Note: Open/collapsed state is internal; groups start expanded.
- */
-export interface UiDataGroupProps {
-  /**
-   * Column definitions, same shape as DataTable without sorting.
-   * @default []
-   */
-  columns: { key: string; label: string; num?: boolean; render?: (value: any, row: any) => ReactNode | string }[];
-  /**
-   * Groups shown as collapsible header rows with a row count. Group labels must be unique.
-   * @default []
-   */
-  groups: { label: string; rows: ({ id: string | number; [key: string]: any })[] }[];
-  /** Renders the detail panel under a row. When set, an expand chevron column appears. */
-  expand?: (row: any) => ReactNode | string;
-  /**
-   * Row density and font size.
-   * @default 'md'
-   */
-  size?: Size;
-  children?: ReactNode;
-}
-export const UiDataGroup: ComponentType<UiDataGroupProps>;
-
 /** Switches between loading, empty, error, offline and the real content based on one state value; wrap any data-driven block with it. */
 export interface UiDataStateProps {
   /**
@@ -1530,37 +1003,6 @@ export interface UiDatePickerProps {
 }
 export const UiDatePicker: ComponentType<UiDatePickerProps>;
 
-/** CRM deal card with stage badge, amount, win probability and owner; the card type inside PipelineBoard. */
-export interface UiDealCardProps {
-  /** Deal title. */
-  title: string;
-  /** Stage badge text; no badge when omitted. */
-  stage?: string;
-  /**
-   * Badge tone for the stage.
-   * @default 'info'
-   */
-  tone?: 'default' | 'brand' | 'success' | 'warning' | 'danger' | 'info';
-  /** Large amount, rendered as given. */
-  amount?: string | number;
-  /**
-   * Win probability 0-100, shown as a progress bar and percent.
-   * @default 0
-   */
-  probability?: number;
-  /** Owner name with avatar. */
-  owner?: string;
-  /** Due date caption, right aligned. */
-  due?: string;
-  /**
-   * Scales padding, text and avatars.
-   * @default 'md'
-   */
-  size?: Size;
-  children?: ReactNode;
-}
-export const UiDealCard: ComponentType<UiDealCardProps>;
-
 /** Definition list of label and value pairs for record details. */
 export interface UiDescriptionsProps {
   /**
@@ -1705,32 +1147,6 @@ export interface UiErrorPageProps {
 }
 export const UiErrorPage: ComponentType<UiErrorPageProps>;
 
-/**
- * Floating action button for the main action of a screen; extended when a label is given.
- * Note: Always pass label: it is the accessible name. Without it the button falls back to the icon name as aria-label (for example "plus"), which is rarely a good description.
- */
-export interface UiFabProps {
-  /**
-   * Icon name.
-   * @default 'plus'
-   */
-  icon?: string;
-  /** Text next to the icon (extended FAB) and the accessible name. */
-  label?: string;
-  /**
-   * Button height: xs 36px, sm 44px, md 56px, lg 64px, xl 72px.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Native click event.
-   * @event click
-   */
-  onClick?: (event: MouseEvent<HTMLElement>) => void;
-  children?: ReactNode;
-}
-export const UiFab: ComponentType<UiFabProps>;
-
 /**
  * Drop-zone style file picker. Use for documents and attachments.
  * Note: Click, Enter or Space opens the picker; files can also be dropped onto the zone, which highlights while dragging.
@@ -1873,73 +1289,6 @@ export interface UiFormFieldProps {
 }
 export const UiFormField: ComponentType<UiFormFieldProps>;
 
-/**
- * Full-screen dialog with a close button, title and Save action in the header; use for long editing flows on mobile.
- * Note: Has aria-modal. Escape calls close; on open focus moves into the dialog, Tab is trapped inside it and focus returns to the previously focused element on close.
- */
-export interface UiFullscreenDialogProps {
-  /**
-   * Shows the dialog when true; renders nothing when false.
-   * @default false
-   */
-  open?: boolean;
-  /** Header text and aria-label. */
-  title?: string;
-  /**
-   * Text of the save button in the header.
-   * @default 'Save'
-   */
-  saveLabel?: string;
-  /**
-   * Called on the close icon button or the Escape key.
-   * @event close
-   */
-  onClose?: () => void;
-  /**
-   * Called on the header save button.
-   * @event save
-   */
-  onSave?: () => void;
-  children?: ReactNode;
-}
-export const UiFullscreenDialog: ComponentType<UiFullscreenDialogProps>;
-
-/**
- * Large image with a counter and a thumbnail strip for browsing a set of photos.
- * Note: An empty or missing images array renders an empty frame (no counter, no thumbnails). Invalid index values are clamped to the available range.
- */
-export interface UiGalleryProps {
-  /**
-   * Image URLs. The first one is shown initially; clicking a thumbnail switches the main image.
-   * @default []
-   */
-  images: string[];
-  /**
-   * Accessible description of the main image.
-   * @default ''
-   */
-  alt?: string;
-  /** Controlled active image index. When set, the gallery only changes image when you update it from onChange; when omitted it keeps its own state starting at 0. */
-  index?: number;
-  /**
-   * Override the thumbnail aria-label prefix.
-   * @default { photo: 'Photo' }
-   */
-  labels?: { photo?: string };
-  /**
-   * Thumbnail strip size.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with the new image index when a thumbnail is clicked.
-   * @event change
-   */
-  onChange?: (index: number) => void;
-  children?: ReactNode;
-}
-export const UiGallery: ComponentType<UiGalleryProps>;
-
 /** CSS grid with a fixed column count or auto-fit columns of a minimum width. */
 export interface UiGridProps {
   /** Fixed number of equal columns. When set, min is ignored. */
@@ -1965,71 +1314,6 @@ export interface UiGridProps {
 }
 export const UiGrid: ComponentType<UiGridProps>;
 
-/**
- * Single-choice dropdown with option groups under headings. Use for long lists that have natural categories.
- * Note: The popup closes on outside click and on Escape.
- */
-export interface UiGroupedSelectProps {
-  /** Value of the selected option. */
-  modelValue?: string | number;
-  /**
-   * Groups with a heading and their options. Option values must be unique across groups. An option with disabled: true cannot be chosen.
-   * @default []
-   */
-  groups?: { label: string; options: { value: string | number; label: string; disabled?: boolean }[] }[];
-  /**
-   * Label shown above the control.
-   * @remarks Forwarded to the inner element.
-   */
-  label?: string;
-  /** Shown when nothing is selected. Defaults to "—". */
-  placeholder?: string;
-  /**
-   * Disables the control.
-   * @default false
-   */
-  disabled?: boolean;
-  /**
-   * Control height, font and padding scale.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with the value of the chosen option.
-   * @event change
-   */
-  onChange?: (value: string | number) => void;
-  children?: ReactNode;
-}
-export const UiGroupedSelect: ComponentType<UiGroupedSelectProps>;
-
-/** Guest profile card with avatar, country, stay length and tags. */
-export interface UiGuestCardProps {
-  /** Guest name. */
-  name: string;
-  /** Country shown in the subtitle. */
-  country?: string;
-  /** Number of nights, shown as "N nights". */
-  nights?: number;
-  /**
-   * Shows a VIP badge.
-   * @default false
-   */
-  vip?: boolean;
-  /**
-   * Preference tags, e.g. "Halal", "Late check-in".
-   * @default []
-   */
-  tags?: string[];
-  /**
-   * Scales padding, text and avatars.
-   * @default 'md'
-   */
-  size?: Size;
-  children?: ReactNode;
-}
-export const UiGuestCard: ComponentType<UiGuestCardProps>;
-
 /** Horizontal flex row with a configurable gap. */
 export interface UiHStackProps {
   /**
@@ -2093,83 +1377,6 @@ export interface UiHeadingProps {
 }
 export const UiHeading: ComponentType<UiHeadingProps>;
 
-/** Wide promotional banner with title, text, a big value, optional action and a background image. */
-export interface UiHeroBannerProps {
-  /** Banner heading. */
-  title: string;
-  /** Supporting paragraph. */
-  text?: string;
-  /** Large number or price shown under the text. */
-  value?: string | number;
-  /** Label of the primary button. The button renders only when set. */
-  cta?: string;
-  /** Image URL shown on the right side. */
-  image?: string;
-  /**
-   * Called when the call-to-action button is clicked.
-   * @event cta
-   */
-  onCta?: () => void;
-  children?: ReactNode;
-}
-export const UiHeroBanner: ComponentType<UiHeroBannerProps>;
-
-/**
- * Hotel listing card with photo, tags, stars, distance, rating and nightly price; use in catalogs and search results.
- * Note: Currency is hard-coded to SAR.
- * Note: Wrap in a clickable element yourself; the card has no click handler.
- */
-export interface UiHotelCardProps {
-  /** Hotel name. */
-  name: string;
-  /** Photo URL, used as the card background image. */
-  image?: string;
-  /**
-   * Brand badges over the photo, e.g. "Haram view".
-   * @default []
-   */
-  tags?: string[];
-  /**
-   * Star class 0-5, rendered as repeated stars.
-   * @default 0
-   */
-  stars?: number;
-  /** Distance caption next to the stars, e.g. "120 m to the Haram". */
-  distance?: string;
-  /** Guest rating shown in a green badge, e.g. 9.2. */
-  rating?: string | number;
-  /** Price per unit, formatted with thousand separators; the currency label is fixed to SAR. */
-  price?: number;
-  /**
-   * Unit after "SAR /", e.g. "night".
-   * @default 'night'
-   */
-  night?: string;
-  /**
-   * Scales padding, text and avatars.
-   * @default 'md'
-   */
-  size?: Size;
-  children?: ReactNode;
-}
-export const UiHotelCard: ComponentType<UiHotelCardProps>;
-
-/**
- * Rich card shown on hover or keyboard focus of a trigger; use for previews of users, links or entities.
- * Note: The wrapper is focusable (tabIndex 0), so the card also opens on focus.
- */
-export interface UiHoverCardProps {
-  /** Content that triggers the card. */
-  trigger?: string | ReactNode;
-  /**
-   * Scale of card width (200 to 400 px) and padding.
-   * @default 'md'
-   */
-  size?: Size;
-  children?: ReactNode;
-}
-export const UiHoverCard: ComponentType<UiHoverCardProps>;
-
 /**
  * Renders a named icon from the library at a chosen size.
  * Note: The icon is aria-hidden; add a label on the surrounding control for accessibility.
@@ -2242,298 +1449,68 @@ export interface UiIconTileProps {
 export const UiIconTile: ComponentType<UiIconTileProps>;
 
 /**
- * Image picker with a live preview, square or circular. Use for avatars, covers and logos.
- * Note: The preview is kept in internal state, so it updates even without updating modelValue.
+ * Keyboard key cap for shortcuts such as Ctrl or K.
+ * Note: Render one Kbd per key and combine them in a row for chords.
  */
-export interface UiImageUploadProps {
-  /** Image URL or data URL to show before the user picks a new file. */
-  modelValue?: string;
-  /**
-   * circle gives a round avatar-style crop, otherwise rounded corners.
-   * @default 'square'
-   */
-  shape?: 'square' | 'circle';
+export interface UiKbdProps {
   /**
-   * CSS aspect-ratio of the box, e.g. "16/9".
-   * @default '1/1'
+   * Key cap size.
+   * @default 'md'
    */
-  aspect?: string;
+  size?: Size;
+  children?: ReactNode;
+}
+export const UiKbd: ComponentType<UiKbdProps>;
+
+/** Key metric tile with a label, large value and optional delta, for dashboards. */
+export interface UiKpiTileProps {
+  /** Metric name. */
+  label: string;
+  /** Main value, shown large. */
+  value: string | number;
+  /** Small text next to the delta. */
+  sub?: string;
+  /** Change indicator such as "+12%" or "-3.4%". A leading "-" renders as a decrease, anything else as an increase. */
+  delta?: string;
+  /** Filled brand tile or dark inverse tile. Omit for the default glass tile. */
+  variant?: 'brand' | 'inverse';
   /**
-   * Text shown in the empty state.
-   * @default 'Upload'
+   * Padding and value size.
+   * @default 'md'
    */
-  hint?: string;
+  size?: Size;
+  children?: ReactNode;
+}
+export const UiKpiTile: ComponentType<UiKpiTileProps>;
+
+/** Image box with a fixed aspect ratio and rounded corners, rendered as a background image. */
+export interface UiLazyImageProps {
+  /** Image URL. An empty placeholder is shown without it. */
+  src?: string;
   /**
-   * Label shown above the control.
-   * @remarks Forwarded to the inner element.
+   * Accessible description, exposed as aria-label on role="img".
+   * @default ''
    */
-  label?: string;
+  alt?: string;
   /**
-   * Maximum width: 112, 128, 160, 192 or 224 px. A number is used as px directly.
-   * @default 'md'
+   * CSS aspect-ratio value such as "1/1" or "4/3".
+   * @default '16/9'
    */
-  size?: Size;
+  aspectRatio?: string;
   /**
-   * Called with (dataUrl, file): the picked image as a data URL and the original File.
-   * @event change
+   * Corner radius in px.
+   * @default 20
    */
-  onChange?: (dataUrl: string, file: File) => void;
+  rounded?: number;
   children?: ReactNode;
 }
-export const UiImageUpload: ComponentType<UiImageUploadProps>;
+export const UiLazyImage: ComponentType<UiLazyImageProps>;
 
 /**
- * Full-screen lightbox for one or several images with previous/next buttons and a counter.
- * Note: Navigation buttons appear only when there is more than one image.
+ * Styled anchor for in-text and standalone links, with optional external-link behavior.
+ * Note: Without href the link points to "#"; for SPA routing use onClick and prevent default.
  */
-export interface UiImageViewerProps {
-  /**
-   * Shows the viewer when true; renders nothing when false.
-   * @default false
-   */
-  open?: boolean;
-  /**
-   * Image URLs.
-   * @default []
-   */
-  images?: string[];
-  /**
-   * Index of the image to start on.
-   * @default 0
-   */
-  index?: number;
-  /** Alt text of the image and aria-label of the dialog (default "Image viewer"). */
-  alt?: string;
-  /**
-   * Called on the close button or a click on the backdrop.
-   * @event close
-   */
-  onClose?: () => void;
-  children?: ReactNode;
-}
-export const UiImageViewer: ComponentType<UiImageViewerProps>;
-
-/** Glass banner for an incoming call with Decline and Answer buttons. */
-export interface UiIncomingCallProps {
-  /** Caller name. */
-  name: string;
-  /** Caller number. */
-  phone?: string;
-  /**
-   * Caption above the name.
-   * @default Incoming call
-   */
-  label?: string;
-  /** Decline button click. */
-  onDecline?: () => void;
-  /** Answer button click. */
-  onAnswer?: () => void;
-  /**
-   * Scales padding, text and avatars.
-   * @default 'md'
-   */
-  size?: Size;
-  children?: ReactNode;
-}
-export const UiIncomingCall: ComponentType<UiIncomingCallProps>;
-
-/** Text that turns into an input on click. Use for renaming and quick edits without a form. */
-export interface UiInlineEditProps {
-  /**
-   * Current text.
-   * @default ''
-   */
-  modelValue?: string;
-  /**
-   * Shown when the value is empty.
-   * @default Click to edit
-   */
-  emptyText?: string;
-  /**
-   * Control height, font and padding scale.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with the edited text on Enter or on the save button. Escape cancels.
-   * @event change
-   */
-  onChange?: (value: string) => void;
-  children?: ReactNode;
-}
-export const UiInlineEdit: ComponentType<UiInlineEditProps>;
-
-/**
- * Card for a third-party integration showing its connection status and a connect or manage button.
- * Note: Translate badge and button texts with labels.
- * Note: Unknown status values behave as "off".
- */
-export interface UiIntegrationCardProps {
-  /** Integration name. */
-  name: string;
-  /** Short explanation under the name. */
-  description?: string;
-  /**
-   * Connection state. Sets the badge (Connected, Error, Not linked) and button (Manage, Reconnect, Link).
-   * @default 'off'
-   */
-  status?: 'connected' | 'error' | 'off';
-  /**
-   * Badge and button texts per status; missing keys keep the English defaults.
-   * @default { connected: 'Connected', error: 'Error', off: 'Not linked', manage: 'Manage', reconnect: 'Reconnect', link: 'Link' }
-   */
-  labels?: { connected?: string; error?: string; off?: string; manage?: string; reconnect?: string; link?: string };
-  /**
-   * Card padding and title size.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called when the button is clicked, for connecting, reconnecting or managing.
-   * @event toggle
-   */
-  onToggle?: () => void;
-  children?: ReactNode;
-}
-export const UiIntegrationCard: ComponentType<UiIntegrationCardProps>;
-
-/** Simple kanban card with title, subtitle, free content and an optional tag. */
-export interface UiKanbanCardProps {
-  /** Card title. */
-  title: string;
-  /** Subtitle under the title. */
-  sub?: string;
-  /** Badge at the bottom. */
-  tag?: string;
-  /** Badge tone for tag. */
-  tone?: 'default' | 'brand' | 'success' | 'warning' | 'danger' | 'info';
-  /**
-   * Scales padding, text and avatars.
-   * @default 'md'
-   */
-  size?: Size;
-  children?: ReactNode;
-}
-export const UiKanbanCard: ComponentType<UiKanbanCardProps>;
-
-/** Single kanban column with a title, count badge and stacked cards. */
-export interface UiKanbanColumnProps {
-  /** Column heading. */
-  title: string;
-  /** Count badge; defaults to the number of children. */
-  count?: number;
-  /**
-   * Scales padding, text and avatars.
-   * @default 'md'
-   */
-  size?: Size;
-  children?: ReactNode;
-}
-export const UiKanbanColumn: ComponentType<UiKanbanColumnProps>;
-
-/**
- * Keyboard key cap for shortcuts such as Ctrl or K.
- * Note: Render one Kbd per key and combine them in a row for chords.
- */
-export interface UiKbdProps {
-  /**
-   * Key cap size.
-   * @default 'md'
-   */
-  size?: Size;
-  children?: ReactNode;
-}
-export const UiKbd: ComponentType<UiKbdProps>;
-
-/** Compact inline metric with a label, value and delta, for toolbars and card headers. */
-export interface UiKpiInlineProps {
-  /** Metric name. */
-  label: string;
-  /** Main value. */
-  value: string | number;
-  /** Change indicator such as "+12%" or "-3.4%". A leading "-" renders as a decrease, anything else as an increase. */
-  delta?: string;
-  /**
-   * Value font size.
-   * @default 'md'
-   */
-  size?: Size;
-  children?: ReactNode;
-}
-export const UiKpiInline: ComponentType<UiKpiInlineProps>;
-
-/** Key metric tile with a label, large value and optional delta, for dashboards. */
-export interface UiKpiTileProps {
-  /** Metric name. */
-  label: string;
-  /** Main value, shown large. */
-  value: string | number;
-  /** Small text next to the delta. */
-  sub?: string;
-  /** Change indicator such as "+12%" or "-3.4%". A leading "-" renders as a decrease, anything else as an increase. */
-  delta?: string;
-  /** Filled brand tile or dark inverse tile. Omit for the default glass tile. */
-  variant?: 'brand' | 'inverse';
-  /**
-   * Padding and value size.
-   * @default 'md'
-   */
-  size?: Size;
-  children?: ReactNode;
-}
-export const UiKpiTile: ComponentType<UiKpiTileProps>;
-
-/** Image box with a fixed aspect ratio and rounded corners, rendered as a background image. */
-export interface UiLazyImageProps {
-  /** Image URL. An empty placeholder is shown without it. */
-  src?: string;
-  /**
-   * Accessible description, exposed as aria-label on role="img".
-   * @default ''
-   */
-  alt?: string;
-  /**
-   * CSS aspect-ratio value such as "1/1" or "4/3".
-   * @default '16/9'
-   */
-  aspectRatio?: string;
-  /**
-   * Corner radius in px.
-   * @default 20
-   */
-  rounded?: number;
-  children?: ReactNode;
-}
-export const UiLazyImage: ComponentType<UiLazyImageProps>;
-
-/** CRM lead card with avatar, code, phone and amount. */
-export interface UiLeadCardProps {
-  /** Lead name. */
-  name: string;
-  /** Lead or deal code under the name, monospaced. */
-  code?: string;
-  /** Optional badge text, e.g. a source or status. */
-  tag?: string;
-  /** Badge tone for tag; neutral when omitted. */
-  tone?: 'default' | 'brand' | 'success' | 'warning' | 'danger' | 'info';
-  /** Phone number with a phone icon. */
-  phone?: string;
-  /** Amount shown on the right, rendered as given (format it yourself). */
-  amount?: string | number;
-  /**
-   * Scales padding, text and avatars.
-   * @default 'md'
-   */
-  size?: Size;
-  children?: ReactNode;
-}
-export const UiLeadCard: ComponentType<UiLeadCardProps>;
-
-/**
- * Styled anchor for in-text and standalone links, with optional external-link behavior.
- * Note: Without href the link points to "#"; for SPA routing use onClick and prevent default.
- */
-export interface UiLinkProps {
+export interface UiLinkProps {
   /**
    * Link target.
    * @default '#'
@@ -2563,30 +1540,6 @@ export interface UiLinkProps {
 }
 export const UiLink: ComponentType<UiLinkProps>;
 
-/**
- * Frosted liquid-glass panel with adjustable corner radius and blur.
- * Note: Backdrop blur is visible only over a colorful or image background.
- */
-export interface UiLiquidGlassProps {
-  /**
-   * Corner radius. Numbers are pixels.
-   * @default 24
-   */
-  radius?: number | string;
-  /**
-   * Backdrop blur radius. Numbers are pixels.
-   * @default 18
-   */
-  blur?: number | string;
-  /**
-   * Inner padding.
-   * @default 'md'
-   */
-  size?: Size;
-  children?: ReactNode;
-}
-export const UiLiquidGlass: ComponentType<UiLiquidGlassProps>;
-
 /** Wrapper that dims its content and shows a spinner on top while loading; use over cards, tables or forms during a refresh. */
 export interface UiLoadingOverlayProps {
   /**
@@ -2652,76 +1605,6 @@ export interface UiLoginFormProps {
 }
 export const UiLoginForm: ComponentType<UiLoginFormProps>;
 
-/**
- * Interactive raster map with panning, zoom buttons and clickable markers, using OpenStreetMap data via CARTO tiles.
- * Note: The center and zoom props are initial values; user panning and zooming is kept in internal state. Listen to move/zoom to track it.
- * Note: Drag or touch to pan, wheel or double click to zoom around the pointer. The tile theme follows the page data-theme after mount (light tiles on the server render) unless theme or style is set.
- * Note: Tiles come from a third-party CDN, so it needs network access.
- */
-export interface UiMapProps {
-  /**
-   * Initial center latitude.
-   * @default 21.4225
-   */
-  lat?: number;
-  /**
-   * Initial center longitude.
-   * @default 39.8262
-   */
-  lon?: number;
-  /**
-   * Initial zoom level; the zoom buttons clamp it to 3..18.
-   * @default 14
-   */
-  zoom?: number;
-  /**
-   * Pins. label is the tooltip, icon defaults to "map-pin".
-   * @default []
-   */
-  markers?: { lat: number; lon: number; label?: string; icon?: string; tone?: 'brand' | 'sky' | 'success' | 'warning' | 'danger' | 'neutral' }[];
-  /**
-   * Pixel width used to compute which tiles to load; the map element itself fills its container.
-   * @default 640
-   */
-  width?: number;
-  /**
-   * Height in px.
-   * @default 360
-   */
-  height?: number;
-  /** Tile theme. If omitted, dark is used when the page is inside a dark data-theme. */
-  theme?: 'light' | 'dark';
-  /** CARTO tile style path, for example "light_all" or "dark_all". Overrides theme. */
-  style?: string;
-  /**
-   * aria-label of the map region.
-   * @default 'Map'
-   */
-  label?: string;
-  /**
-   * Accessible names of the zoom buttons.
-   * @default { zoomIn: 'Zoom in', zoomOut: 'Zoom out' }
-   */
-  labels?: { zoomIn?: string; zoomOut?: string };
-  /**
-   * Called with the marker object when a marker is clicked.
-   * @event select
-   */
-  onSelect?: (marker: NonNullable<UiMapProps['markers']>[number]) => void;
-  /**
-   * Called with { lat, lon, zoom } while the user pans or zooms (drag, touch, wheel, double click or the +/- buttons).
-   * @event move
-   */
-  onMove?: () => void;
-  /**
-   * Called with the new zoom level when it changes.
-   * @event zoom
-   */
-  onZoom?: () => void;
-  children?: ReactNode;
-}
-export const UiMap: ComponentType<UiMapProps>;
-
 /**
  * Static vertical list of actions rendered inline; use in sidebars and custom popovers.
  * Note: Always visible unless open is set. For a self-toggling menu use Dropdown, for a right-click menu use ContextMenu.
@@ -2877,41 +1760,6 @@ export interface UiMultiSelectProps {
 }
 export const UiMultiSelect: ComponentType<UiMultiSelectProps>;
 
-/**
- * Bell icon button with an unread counter and a dropdown list of notifications.
- * Note: If you handle read or markAllRead the component is controlled: it trusts only the read flags in items, so update them in your state. Without these handlers it marks items read internally.
- * Note: The dropdown opens and closes internally, and closes on outside click or Escape.
- */
-export interface UiNotificationBellProps {
-  /**
-   * Notifications. Items without read: true count as unread and show a dot.
-   * @default []
-   */
-  items?: { id: string | number; title: string; message?: string; time?: string; read?: boolean }[];
-  /**
-   * Bell button size.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with the item id when an unread item is clicked.
-   * @event read
-   */
-  onRead?: (id: string | number) => void;
-  /**
-   * Called when "Mark all read" is clicked (shown while something is unread).
-   * @event markAllRead
-   */
-  onMarkAllRead?: () => void;
-  /**
-   * Called with the item when any item is clicked.
-   * @event select
-   */
-  onSelect?: (item: NonNullable<UiNotificationBellProps['items']>[number]) => void;
-  children?: ReactNode;
-}
-export const UiNotificationBell: ComponentType<UiNotificationBellProps>;
-
 /**
  * Numeric stepper with minus and plus buttons and a typed value. Use for quantities, guest counts and small integers.
  * Note: The field can be fully cleared (null); the + and - buttons start from 0 when empty.
@@ -2960,285 +1808,30 @@ export interface UiNumberInputProps {
 }
 export const UiNumberInput: ComponentType<UiNumberInputProps>;
 
-/** Bar chart of percentages by label, such as hotel occupancy per day or month. */
-export interface UiOccupancyChartProps {
+/**
+ * Sign-in page template without the app shell, as a centered card or a split layout.
+ * Note: Designed for the dark theme and used without AppShell.
+ */
+export interface UiPageAuthProps {
   /**
-   * Percentages from 0 to 100, one per bar. Values above 90 are highlighted in brand color.
-   * @default []
+   * 'split' uses AuthSplit with a side panel. 'photo', 'light' and 'tint' use AuthShowcase with a media panel (Pro: needs @ziyarago/ui-pro, otherwise they fall back to the centered card). Anything else renders a centered AuthLayout card over the background.
+   * @default 'card'
+   * @remarks Forwarded to the inner element.
    */
-  values: number[];
+  layout?: 'card' | 'split' | 'photo' | 'light' | 'tint';
   /**
-   * Axis label under each bar, matched by index.
-   * @default []
+   * Media image URL; photo, light and tint layouts.
+   * @remarks Forwarded to the inner element.
    */
-  labels?: string[];
-  children?: ReactNode;
-}
-export const UiOccupancyChart: ComponentType<UiOccupancyChartProps>;
-
-/** Selectable card with title, description, price and optional image or icon. Usually rendered by OptionCards. */
-export interface UiOptionCardProps {
-  /** Main text. */
-  title?: string;
-  /** Secondary text under the title. */
-  desc?: string;
-  /** Right-aligned price or value text. */
-  price?: string;
-  /** Image URL shown on the left. Takes priority over icon. */
   image?: string;
-  /** Icon name shown in a tile on the left. */
-  icon?: string;
   /**
-   * Selected state.
-   * @default false
+   * Large text on the media panel; photo and tint.
+   * @remarks Forwarded to the inner element.
    */
-  checked?: boolean;
+  headline?: string;
   /**
-   * Checkbox look and role instead of radio.
-   * @default false
-   */
-  multiple?: boolean;
-  /**
-   * Control height, font and padding scale.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called when the card is pressed. Toggle checked yourself.
-   * @event click
-   */
-  onClick?: (event: MouseEvent<HTMLElement>) => void;
-  children?: ReactNode;
-}
-export const UiOptionCard: ComponentType<UiOptionCardProps>;
-
-/** Grid of selectable OptionCards, single or multiple choice. Use for plans, room types and delivery options. */
-export interface UiOptionCardsProps {
-  /** Selected value, or an array of values when multiple is true. */
-  modelValue?: string | number | (string | number)[];
-  /**
-   * Cards to show. Fields are passed to OptionCard.
-   * @default []
-   */
-  options?: { value: string | number; title: string; desc?: string; price?: string; image?: string; icon?: string }[];
-  /**
-   * Allow several selected cards. modelValue becomes an array.
-   * @default false
-   */
-  multiple?: boolean;
-  /**
-   * Minimum card width in px before the grid wraps.
-   * @default 220
-   */
-  min?: number;
-  /**
-   * Label shown above the control.
-   * @remarks Forwarded to the inner element.
-   */
-  label?: string;
-  /**
-   * Control height, font and padding scale.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with the value (single) or the new array of values (multiple).
-   * @event change
-   */
-  onChange?: (value: string | number | (string | number)[]) => void;
-  children?: ReactNode;
-}
-export const UiOptionCards: ComponentType<UiOptionCardsProps>;
-
-/**
- * Account settings template with pill tabs and a swappable panel.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: The template does not switch panels by itself: keep the active tab in your own state (PillTabs v-model) and render only that tab content in the panel slot.
- */
-export interface UiPageAccountProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Section tabs (account, security, billing, notifications); PillTabs.
-   * @slot tabs (React: pass as a prop)
-   */
-  tabs?: ReactNode;
-  /**
-   * Content of the active tab; Card or SettingsSection with Switch and TextField.
-   * @slot panel (React: pass as a prop)
-   */
-  panel?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageAccount: ComponentType<UiPageAccountProps>;
-
-/**
- * Analytics template: period picker, KPI strip, trend charts, a breakdown block and a table. Put Export in actions.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: Trend and breakdown share a row and wrap on narrow screens. Put Export in the actions slot.
- */
-export interface UiPageAnalyticsProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Period presets and compare toggle; SegmentedControl, Select, Switch.
-   * @slot period (React: pass as a prop)
-   */
-  period?: ReactNode;
-  /**
-   * Headline numbers with deltas; KpiTile, StatLine.
-   * @slot kpis (React: pass as a prop)
-   */
-  kpis?: ReactNode;
-  /**
-   * Main time series; ChartCard with MiniChart.
-   * @slot trend (React: pass as a prop)
-   */
-  trend?: ReactNode;
-  /**
-   * Split by channel or country; ChartCard with SegBar and CountryRow.
-   * @slot breakdown (React: pass as a prop)
-   */
-  breakdown?: ReactNode;
-  /**
-   * Rows behind the numbers; DataTable.
-   * @slot table (React: pass as a prop)
-   */
-  table?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageAnalytics: ComponentType<UiPageAnalyticsProps>;
-
-/**
- * Article template: cover, post body, sticky table of contents, share row and related posts.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: Body, share and related share the main column; the table of contents stays visible on the right while the body scrolls and drops under the body below 860 px.
- */
-export interface UiPageArticleProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Cover image area with title and author line; a gradient Card or LazyImage.
-   * @slot cover (React: pass as a prop)
-   */
-  cover?: ReactNode;
-  /**
-   * Article text; Heading, Text, Code, Alert.
-   * @slot body (React: pass as a prop)
-   */
-  body?: ReactNode;
-  /**
-   * Sticky table of contents; Card with a list of anchor links.
-   * @slot toc (React: pass as a prop)
-   */
-  toc?: ReactNode;
-  /**
-   * Share and reaction row; Button, IconButton, CopyButton.
-   * @slot share (React: pass as a prop)
-   */
-  share?: ReactNode;
-  /**
-   * Related posts; Card grid.
-   * @slot related (React: pass as a prop)
-   */
-  related?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageArticle: ComponentType<UiPageArticleProps>;
-
-/**
- * Sign-in page template without the app shell, as a centered card or a split layout.
- * Note: Designed for the dark theme and used without AppShell.
- */
-export interface UiPageAuthProps {
-  /**
-   * 'split' uses AuthSplit with a side panel. 'photo', 'light' and 'tint' use AuthShowcase with a media panel. Anything else renders a centered AuthLayout card over the background.
-   * @default 'card'
-   * @remarks Forwarded to the inner element.
-   */
-  layout?: 'card' | 'split' | 'photo' | 'light' | 'tint';
-  /**
-   * Media image URL; photo, light and tint layouts.
-   * @remarks Forwarded to the inner element.
-   */
-  image?: string;
-  /**
-   * Large text on the media panel; photo and tint.
-   * @remarks Forwarded to the inner element.
-   */
-  headline?: string;
-  /**
-   * Small text on the media panel or glass bar.
-   * @remarks Forwarded to the inner element.
+   * Small text on the media panel or glass bar.
+   * @remarks Forwarded to the inner element.
    */
   caption?: string;
   /**
@@ -3306,71 +1899,11 @@ export interface UiPageAuthProps {
 export const UiPageAuth: ComponentType<UiPageAuthProps>;
 
 /**
- * Billing template: current plan, usage meters, invoices, payment methods and an upgrade card.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: Plan, usage and invoices share the main column; methods and upgrade form the side column.
- */
-export interface UiPageBillingProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Current plan; Card with Badge and Buttons.
-   * @slot plan (React: pass as a prop)
-   */
-  plan?: ReactNode;
-  /**
-   * Usage meters; Progress.
-   * @slot usage (React: pass as a prop)
-   */
-  usage?: ReactNode;
-  /**
-   * Invoices; DataTable.
-   * @slot invoices (React: pass as a prop)
-   */
-  invoices?: ReactNode;
-  /**
-   * Saved cards; Card, IconTile, Badge.
-   * @slot methods (React: pass as a prop)
-   */
-  methods?: ReactNode;
-  /**
-   * Upgrade call to action; Card variant="inverse" or PricingCard.
-   * @slot upgrade (React: pass as a prop)
-   */
-  upgrade?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageBilling: ComponentType<UiPageBillingProps>;
-
-/**
- * Booking flow template: stepper, the active step content, back and continue buttons and a sticky summary card.
+ * Dashboard template: greeting hero, KPI tiles, occupancy chart, sales funnel, top list and activity feed.
  * Note: Place inside AppShell; fill only the slots you need.
- * Note: Render only the active step in content. The summary stays visible on the right and goes below the step under 860 px.
+ * Note: hero and kpis share a row, as do occupancy/funnel and top/activity; they wrap on narrow screens.
  */
-export interface UiPageBookingFlowProps {
+export interface UiPageDashboardProps {
   /**
    * Page heading. The built-in header renders only when title is set and the header slot is empty.
    * @remarks Forwarded to the inner element.
@@ -3397,1523 +1930,66 @@ export interface UiPageBookingFlowProps {
    */
   actions?: ReactNode;
   /**
-   * Progress; Stepper.
-   * @slot steps (React: pass as a prop)
-   */
-  steps?: ReactNode;
-  /**
-   * Content of the active step (search, pick, guests, confirm); Card, DatePicker, OptionCards, NumberInput.
-   * @slot content (React: pass as a prop)
-   */
-  content?: ReactNode;
-  /**
-   * Back and Continue buttons.
-   * @slot nav (React: pass as a prop)
-   */
-  nav?: ReactNode;
-  /**
-   * Booking summary; Card, Descriptions.
-   * @slot summary (React: pass as a prop)
-   */
-  summary?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageBookingFlow: ComponentType<UiPageBookingFlowProps>;
-
-/**
- * Bookings list template: stats, toolbar, bulk-action bar, table and pagination.
- * Note: Place inside AppShell; fill only the slots you need.
- */
-export interface UiPageBookingsProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
+   * Large greeting/plan block; Card variant="inverse" with Ring and a Button.
+   * @slot hero (React: pass as a prop)
    */
-  title?: string;
+  hero?: ReactNode;
   /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
+   * Four key figures; KpiTile, StatsCard or KpiInline.
+   * @slot kpis (React: pass as a prop)
    */
-  subtitle?: string;
+  kpis?: ReactNode;
   /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Booking figures for the period; StatsCard.
-   * @slot stats (React: pass as a prop)
-   */
-  stats?: ReactNode;
-  /**
-   * Search, quick filters and export menu above the table; SearchInput, FilterChips, Dropdown.
-   * @slot toolbar (React: pass as a prop)
-   */
-  toolbar?: ReactNode;
-  /**
-   * Selection bar shown when rows are selected; Alert with Buttons. Render it conditionally.
-   * @slot bulk (React: pass as a prop)
-   */
-  bulk?: ReactNode;
-  /**
-   * Sortable, selectable table; DataTable.
-   * @slot table (React: pass as a prop)
-   */
-  table?: ReactNode;
-  /**
-   * Page numbers below the table; Pagination.
-   * @slot pager (React: pass as a prop)
-   */
-  pager?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageBookings: ComponentType<UiPageBookingsProps>;
-
-/**
- * Calendar template: view switch, time grid, mini calendar and event details.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: The grid sits beside the mini calendar and details; they stack under 860 px.
- */
-export interface UiPageCalendarProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * SegmentedControl, Button, IconButton.
-   * @slot toolbar (React: pass as a prop)
-   */
-  toolbar?: ReactNode;
-  /**
-   * Time grid with events; Card with custom grid, or CalendarView for the month.
-   * @slot grid (React: pass as a prop)
-   */
-  grid?: ReactNode;
-  /**
-   * Month picker; Calendar.
-   * @slot mini (React: pass as a prop)
-   */
-  mini?: ReactNode;
-  /**
-   * Selected event; Card, Descriptions, Avatar, Button.
-   * @slot details (React: pass as a prop)
-   */
-  details?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageCalendar: ComponentType<UiPageCalendarProps>;
-
-/**
- * Catalog template with a filter sidebar and a card grid (hotels, tours).
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: The filter column is 260 px wide; on phones put filters in a Drawer yourself.
- */
-export interface UiPageCatalogProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Left filter column (price, rating, services); Slider, Rating, RadioGroup, Checkbox.
-   * @slot filters (React: pass as a prop)
-   */
-  filters?: ReactNode;
-  /**
-   * Search, view switch and sort above the grid; SearchInput, ToggleGroup, Select.
-   * @slot toolbar (React: pass as a prop)
-   */
-  toolbar?: ReactNode;
-  /**
-   * Responsive grid of cards; HotelCard or TourCard.
-   * @slot grid (React: pass as a prop)
-   */
-  grid?: ReactNode;
-  /**
-   * Pagination at the bottom; Pagination.
-   * @slot pager (React: pass as a prop)
-   */
-  pager?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageCatalog: ComponentType<UiPageCatalogProps>;
-
-/**
- * Changelog template: release timeline grouped by version with new, fix and improved tags, a filter and a subscribe card.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: Filters and timeline share the main column; the subscribe card is a sticky side column.
- */
-export interface UiPageChangelogProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Tag filter; FilterChips, SearchInput.
-   * @slot filters (React: pass as a prop)
-   */
-  filters?: ReactNode;
-  /**
-   * Releases grouped by version; Card, Chip, Divider.
-   * @slot timeline (React: pass as a prop)
-   */
-  timeline?: ReactNode;
-  /**
-   * Sticky subscribe card; Card, TextField, Button.
-   * @slot subscribe (React: pass as a prop)
-   */
-  subscribe?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageChangelog: ComponentType<UiPageChangelogProps>;
-
-/**
- * Checkout template: step indicator, cart items, delivery address, payment and an order summary column.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: Summary sits in the side column and drops below the form on narrow screens.
- */
-export interface UiPageCheckoutProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Checkout steps above the content; Stepper.
-   * @slot steps (React: pass as a prop)
-   */
-  steps?: ReactNode;
-  /**
-   * Cart lines with quantity and price; Card with NumberInput.
-   * @slot items (React: pass as a prop)
-   */
-  items?: ReactNode;
-  /**
-   * Contact and delivery fields; Card with TextField and Select.
-   * @slot address (React: pass as a prop)
-   */
-  address?: ReactNode;
-  /**
-   * Payment method and card fields; OptionCards, TextField.
-   * @slot payment (React: pass as a prop)
-   */
-  payment?: ReactNode;
-  /**
-   * Totals, promo code and the pay button; Card, Descriptions, Button.
-   * @slot summary (React: pass as a prop)
-   */
-  summary?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageCheckout: ComponentType<UiPageCheckoutProps>;
-
-/**
- * CRM template: summary tiles, filters, pipeline board and call queue.
- * Note: Place inside AppShell; fill only the slots you need.
- */
-export interface UiPageCrmProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Tiles above the board (leads, amount, conversion, overdue); StatsCard or KpiTile.
-   * @slot summary (React: pass as a prop)
-   */
-  summary?: ReactNode;
-  /**
-   * Status tabs, search and period switch; Tabs, SearchInput, SegmentedControl, FilterChips.
-   * @slot filters (React: pass as a prop)
-   */
-  filters?: ReactNode;
-  /**
-   * Stage columns with deal cards; PipelineBoard, KanbanColumn, DealCard.
-   * @slot board (React: pass as a prop)
-   */
-  board?: ReactNode;
-  /**
-   * Recent call queue; CallRow, CallCard, IncomingCall.
-   * @slot calls (React: pass as a prop)
-   */
-  calls?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageCrm: ComponentType<UiPageCrmProps>;
-
-/**
- * Dashboard template: greeting hero, KPI tiles, occupancy chart, sales funnel, top list and activity feed.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: hero and kpis share a row, as do occupancy/funnel and top/activity; they wrap on narrow screens.
- */
-export interface UiPageDashboardProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Large greeting/plan block; Card variant="inverse" with Ring and a Button.
-   * @slot hero (React: pass as a prop)
-   */
-  hero?: ReactNode;
-  /**
-   * Four key figures; KpiTile, StatsCard or KpiInline.
-   * @slot kpis (React: pass as a prop)
-   */
-  kpis?: ReactNode;
-  /**
-   * Per-day occupancy chart; OccupancyChart or MiniChart.
-   * @slot occupancy (React: pass as a prop)
-   */
-  occupancy?: ReactNode;
-  /**
-   * Inquiry-to-payment funnel; SalesFunnel.
-   * @slot funnel (React: pass as a prop)
-   */
-  funnel?: ReactNode;
-  /**
-   * Revenue leaderboard; DataTable with Progress share bars.
-   * @slot top (React: pass as a prop)
-   */
-  top?: ReactNode;
-  /**
-   * Recent actions, newest first; Timeline.
-   * @slot activity (React: pass as a prop)
-   */
-  activity?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageDashboard: ComponentType<UiPageDashboardProps>;
-
-/**
- * Detail page template (hotel, tour): gallery, summary, tabs, history and a booking side card.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: gallery, summary, tabs and history are the main column; booking is the side column.
- */
-export interface UiPageDetailProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Main photo with thumbnails; Gallery, Carousel, LazyImage.
-   * @slot gallery (React: pass as a prop)
-   */
-  gallery?: ReactNode;
-  /**
-   * Name, stars, rating, badges; Card with Badge and Rating.
-   * @slot summary (React: pass as a prop)
-   */
-  summary?: ReactNode;
-  /**
-   * Description, amenities, reviews; Tabs with Descriptions or Accordion.
-   * @slot tabs (React: pass as a prop)
-   */
-  tabs?: ReactNode;
-  /**
-   * What changed (status, notes, price); Timeline.
-   * @slot history (React: pass as a prop)
-   */
-  history?: ReactNode;
-  /**
-   * Right-hand booking card with dates, guests, price and CTA; Card, Select, NumberInput, Button.
-   * @slot booking (React: pass as a prop)
-   */
-  booking?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageDetail: ComponentType<UiPageDetailProps>;
-
-/**
- * Help center template: search, categories, answers accordion and a contact block.
- * Note: Place inside AppShell; fill only the slots you need.
- */
-export interface UiPageFaqProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Large search field; SearchInput.
-   * @slot search (React: pass as a prop)
-   */
-  search?: ReactNode;
-  /**
-   * Category list on the left; vertical PillTabs.
-   * @slot cats (React: pass as a prop)
-   */
-  cats?: ReactNode;
-  /**
-   * Answers on the right; Accordion.
-   * @slot answers (React: pass as a prop)
-   */
-  answers?: ReactNode;
-  /**
-   * Contact cards below; Card, IconTile, Button.
-   * @slot contact (React: pass as a prop)
-   */
-  contact?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageFaq: ComponentType<UiPageFaqProps>;
-
-/**
- * Create/edit form template: main column, media, side column and header actions.
- * Note: Place inside AppShell; fill only the slots you need.
- */
-export interface UiPageFormProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Discard, Save draft and Publish buttons in the top-right of the built-in header; Button. Rendered right-aligned on their own when title is not set.
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Main column cards (info, options); Card, TextField, Textarea.
-   * @slot main (React: pass as a prop)
-   */
-  main?: ReactNode;
-  /**
-   * Below main; upload dropzone; FileUpload or Gallery.
-   * @slot media (React: pass as a prop)
-   */
-  media?: ReactNode;
-  /**
-   * Side column cards (price, status, tags); Card, NumberInput, Select, ChipInput.
-   * @slot side (React: pass as a prop)
-   */
-  side?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageForm: ComponentType<UiPageFormProps>;
-
-/**
- * Group manager template: trip summary, pilgrims table with document and visa status, bulk actions, rooming and a sticky payments summary.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: The payments card stays visible on the right and goes below the table under 860 px.
- */
-export interface UiPageGroupManagerProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Trip header with dates, route and counters; Card, StatStrip, Progress.
-   * @slot trip (React: pass as a prop)
-   */
-  trip?: ReactNode;
-  /**
-   * Search and status filters; SearchInput, FilterChips.
-   * @slot toolbar (React: pass as a prop)
-   */
-  toolbar?: ReactNode;
-  /**
-   * Actions for the selected pilgrims; Button, Badge.
-   * @slot bulk (React: pass as a prop)
-   */
-  bulk?: ReactNode;
-  /**
-   * Pilgrims table with documents and visa; Card, DataTable, Badge.
-   * @slot pilgrims (React: pass as a prop)
-   */
-  pilgrims?: ReactNode;
-  /**
-   * Rooming assignment; Card, RoomGrid.
-   * @slot rooms (React: pass as a prop)
-   */
-  rooms?: ReactNode;
-  /**
-   * Payments summary and manager contact; Card, Progress, ContactPanel.
-   * @slot payments (React: pass as a prop)
-   */
-  payments?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageGroupManager: ComponentType<UiPageGroupManagerProps>;
-
-/** Page title block with optional breadcrumbs, subtitle and an actions area. */
-export interface UiPageHeaderProps {
-  /** Page title (rendered as h1). */
-  title: string;
-  /** Secondary text below the title. */
-  subtitle?: string;
-  /** Breadcrumb items shown above the title. */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Title and subtitle size.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Right side of the header, usually buttons.
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageHeader: ComponentType<UiPageHeaderProps>;
-
-/**
- * Help center home: search, category grid, popular articles and a contact card.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: Popular articles and contact share a row and wrap on narrow screens. For a single question list use PageFaq.
- */
-export interface UiPageHelpProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Large search field; SearchInput.
-   * @slot search (React: pass as a prop)
-   */
-  search?: ReactNode;
-  /**
-   * Category tiles; Card with IconTile.
-   * @slot categories (React: pass as a prop)
-   */
-  categories?: ReactNode;
-  /**
-   * Popular articles list; Card.
-   * @slot popular (React: pass as a prop)
-   */
-  popular?: ReactNode;
-  /**
-   * Contact options; Card, Button.
-   * @slot contact (React: pass as a prop)
-   */
-  contact?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageHelp: ComponentType<UiPageHelpProps>;
-
-/**
- * Inbox template: filters and conversation list, the open thread with a composer, and a customer panel.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: List, thread and customer panel sit side by side and stack in that order at 860px and below. Keep the selected conversation in your own state.
- */
-export interface UiPageInboxProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Search and folder chips above the list; SearchInput, FilterChips.
-   * @slot filters (React: pass as a prop)
-   */
-  filters?: ReactNode;
-  /**
-   * Conversation rows with unread marks; Card, Avatar, Badge.
-   * @slot list (React: pass as a prop)
-   */
-  list?: ReactNode;
-  /**
-   * Messages of the open conversation; Card, Avatar.
-   * @slot thread (React: pass as a prop)
-   */
-  thread?: ReactNode;
-  /**
-   * Reply field and send button; Textarea, Button.
-   * @slot composer (React: pass as a prop)
-   */
-  composer?: ReactNode;
-  /**
-   * Customer details; ContactPanel, Descriptions, Tag.
-   * @slot customer (React: pass as a prop)
-   */
-  customer?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageInbox: ComponentType<UiPageInboxProps>;
-
-/**
- * Integrations template: connection cards, API keys and webhooks.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: Keys and webhooks share a row and wrap on narrow screens.
- */
-export interface UiPageIntegrationsProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * SearchInput, FilterChips.
-   * @slot filters (React: pass as a prop)
-   */
-  filters?: ReactNode;
-  /**
-   * IntegrationCard grid.
-   * @slot connections (React: pass as a prop)
-   */
-  connections?: ReactNode;
-  /**
-   * Keys; DataTable with CopyButton and IconButton.
-   * @slot keys (React: pass as a prop)
-   */
-  keys?: ReactNode;
-  /**
-   * Webhooks list; Card, Switch, Chip.
-   * @slot webhooks (React: pass as a prop)
-   */
-  webhooks?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageIntegrations: ComponentType<UiPageIntegrationsProps>;
-
-/**
- * Itinerary template: day tabs, a timeline of stops for the chosen day, transport and hotel blocks and a sticky trip summary card.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: Render only the active day in timeline, transport and hotel. The summary stays visible on the right and goes below the day under 860 px.
- */
-export interface UiPageItineraryProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Day switcher; Tabs or PillTabs.
-   * @slot days (React: pass as a prop)
-   */
-  days?: ReactNode;
-  /**
-   * Stops of the active day with times and places; Card, Timeline, StatRow.
-   * @slot timeline (React: pass as a prop)
-   */
-  timeline?: ReactNode;
-  /**
-   * Flights, buses and transfers of the day; Card, StatRow.
-   * @slot transport (React: pass as a prop)
-   */
-  transport?: ReactNode;
-  /**
-   * Where the group stays that night; Card, Badge, IconTile.
-   * @slot hotel (React: pass as a prop)
-   */
-  hotel?: ReactNode;
-  /**
-   * Trip summary; Card, Descriptions, Progress.
-   * @slot summary (React: pass as a prop)
-   */
-  summary?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageItinerary: ComponentType<UiPageItineraryProps>;
-
-/**
- * Kanban template: filters, task board columns and a card detail panel.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: Board scrolls horizontally inside its area; detail goes below it under 860 px.
- */
-export interface UiPageKanbanProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * SearchInput, FilterChips, Select.
-   * @slot filters (React: pass as a prop)
-   */
-  filters?: ReactNode;
-  /**
-   * Columns with cards; KanbanColumn, KanbanCard.
-   * @slot board (React: pass as a prop)
-   */
-  board?: ReactNode;
-  /**
-   * Selected card; Card, Descriptions, Checkbox, Timeline.
-   * @slot detail (React: pass as a prop)
-   */
-  detail?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageKanban: ComponentType<UiPageKanbanProps>;
-
-/**
- * Landing template: hero, logo strip, features, social proof, pricing teaser, call to action and footer. Used without the app shell.
- * Note: Landing does not use the app shell: render it on its own page. Blocks stack in one column; each block may use its own grid and wraps on narrow screens.
- */
-export interface UiPageLandingProps {
-  /**
-   * Hero block; HeroBanner, Card, Button.
-   * @slot hero (React: pass as a prop)
-   */
-  hero?: ReactNode;
-  /**
-   * Partner row; Chip or Text.
-   * @slot logos (React: pass as a prop)
-   */
-  logos?: ReactNode;
-  /**
-   * Feature cards; Card, IconTile.
-   * @slot features (React: pass as a prop)
-   */
-  features?: ReactNode;
-  /**
-   * Numbers and quotes; StatStrip, Card, Avatar.
-   * @slot proof (React: pass as a prop)
-   */
-  proof?: ReactNode;
-  /**
-   * Plan cards; PricingCard.
-   * @slot pricing (React: pass as a prop)
-   */
-  pricing?: ReactNode;
-  /**
-   * Closing block; Card variant="gradient", Button.
-   * @slot cta (React: pass as a prop)
-   */
-  cta?: ReactNode;
-  /**
-   * Page footer; Footer.
-   * @slot footer (React: pass as a prop)
-   */
-  footer?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageLanding: ComponentType<UiPageLandingProps>;
-
-/**
- * Legal document template: last-updated line, sticky table of contents, numbered sections and a contact card.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: The table of contents sits left of the document and stacks above it under 860 px.
- */
-export interface UiPageLegalProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Version, last-updated date and print or download buttons; Chip, Button.
-   * @slot meta (React: pass as a prop)
-   */
-  meta?: ReactNode;
-  /**
-   * Sticky table of contents; Card with anchor links.
-   * @slot toc (React: pass as a prop)
-   */
-  toc?: ReactNode;
-  /**
-   * Document sections; Card, Heading, Text.
-   * @slot document (React: pass as a prop)
-   */
-  document?: ReactNode;
-  /**
-   * Questions card; Card, Button.
-   * @slot contact (React: pass as a prop)
-   */
-  contact?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageLegal: ComponentType<UiPageLegalProps>;
-
-/**
- * Locations template: filters, a scrollable list of places and a sticky map panel.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: The list is a fixed-width column left of the map; under 860 px the map goes below the list.
- */
-export interface UiPageLocationsProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Search and category filters; SearchInput, FilterChips.
-   * @slot filters (React: pass as a prop)
-   */
-  filters?: ReactNode;
-  /**
-   * Places list; Card rows.
-   * @slot list (React: pass as a prop)
-   */
-  list?: ReactNode;
-  /**
-   * Map panel; Map, or a gradient placeholder.
-   * @slot map (React: pass as a prop)
-   */
-  map?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageLocations: ComponentType<UiPageLocationsProps>;
-
-/**
- * Notifications template: filters, a feed grouped by day and an empty state. Put Mark all read in actions.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: Fill empty only when the feed has no rows. Mark all read goes in the actions slot.
- */
-export interface UiPageNotificationsProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Filter chips such as all, unread and mentions; FilterChips.
-   * @slot filters (React: pass as a prop)
-   */
-  filters?: ReactNode;
-  /**
-   * Notification rows grouped by day; Card, IconTile, Badge, Divider.
-   * @slot feed (React: pass as a prop)
-   */
-  feed?: ReactNode;
-  /**
-   * Shown instead of the feed when nothing matches; EmptyState.
-   * @slot empty (React: pass as a prop)
-   */
-  empty?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageNotifications: ComponentType<UiPageNotificationsProps>;
-
-/**
- * Onboarding template: progress block, active step content, setup checklist and a column of tips.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: Keep the active step in your own state; the template does not switch steps. Steps and checklist share the main column, tips go to the side and stack below it on narrow screens.
- */
-export interface UiPageOnboardingProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Stepper and a completion bar above the content; Stepper, Progress.
-   * @slot progress (React: pass as a prop)
-   */
-  progress?: ReactNode;
-  /**
-   * Content of the active step; Card with form fields.
-   * @slot steps (React: pass as a prop)
-   */
-  steps?: ReactNode;
-  /**
-   * Remaining setup tasks; Card with Checkbox rows.
-   * @slot checklist (React: pass as a prop)
-   */
-  checklist?: ReactNode;
-  /**
-   * Side column with help cards; Card, IconTile, Button.
-   * @slot tips (React: pass as a prop)
-   */
-  tips?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageOnboarding: ComponentType<UiPageOnboardingProps>;
-
-/**
- * Order/booking details template: status chips, items table, timeline and side info cards.
- * Note: Place inside AppShell; fill only the slots you need.
- */
-export interface UiPageOrderProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Payment and fulfillment chips; Chip (tone success, warning, danger).
-   * @slot status (React: pass as a prop)
-   */
-  status?: ReactNode;
-  /**
-   * Items table with totals; DataTable.
-   * @slot items (React: pass as a prop)
-   */
-  items?: ReactNode;
-  /**
-   * Event timeline; Timeline.
-   * @slot shipping (React: pass as a prop)
-   */
-  shipping?: ReactNode;
-  /**
-   * Customer, address and payment cards; UserCell, Descriptions, Button.
-   * @slot side (React: pass as a prop)
-   */
-  side?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageOrder: ComponentType<UiPageOrderProps>;
-
-/**
- * Showcase template combining twelve recurring dashboard card patterns (banner, strips, stat lines, charts, lists).
- * Note: Place inside AppShell; fill only the slots you need.
- */
-export interface UiPagePatternsProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Large banner; HeroBanner.
-   * @slot hero (React: pass as a prop)
-   */
-  hero?: ReactNode;
-  /**
-   * One card with four metrics; StatStrip with IconTile.
-   * @slot strip (React: pass as a prop)
-   */
-  strip?: ReactNode;
-  /**
-   * Row of toned stat lines; StatLine (tone brand, sky, success, warning, danger).
-   * @slot statlines (React: pass as a prop)
-   */
-  statlines?: ReactNode;
-  /**
-   * Titled chart with menu and period select; ChartCard with PillSelect and OccupancyChart or MiniChart.
-   * @slot chartcard (React: pass as a prop)
-   */
-  chartcard?: ReactNode;
-  /**
-   * Selectable tiles plus an add tile; TabTiles.
-   * @slot tiles (React: pass as a prop)
-   */
-  tiles?: ReactNode;
-  /**
-   * Icon, title and value rows; StatRow.
-   * @slot listrows (React: pass as a prop)
-   */
-  listrows?: ReactNode;
-  /**
-   * Country amount rows; CountryRow.
-   * @slot countries (React: pass as a prop)
-   */
-  countries?: ReactNode;
-  /**
-   * Two values with a share bar; VersusBar.
-   * @slot versus (React: pass as a prop)
-   */
-  versus?: ReactNode;
-  /**
-   * Composition bar with legend; SegBar.
-   * @slot segbar (React: pass as a prop)
-   */
-  segbar?: ReactNode;
-  /**
-   * Timeline of events; Timeline.
-   * @slot activity (React: pass as a prop)
-   */
-  activity?: ReactNode;
-  /**
-   * Card with collapse, refresh and close actions; ActionCard.
-   * @slot actioncard (React: pass as a prop)
-   */
-  actioncard?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPagePatterns: ComponentType<UiPagePatternsProps>;
-
-/**
- * Prayer times template: a location picker, today's times with the next prayer highlighted, a month table and a sticky Qibla compass.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: The Qibla card stays visible on the right and goes below the times under 860 px.
- */
-export interface UiPagePrayerProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * City and method pickers; Select, PillSelect, SegmentedControl.
-   * @slot location (React: pass as a prop)
-   */
-  location?: ReactNode;
-  /**
-   * Today's prayers and the countdown to the next one; Card, PrayerTimes.
-   * @slot today (React: pass as a prop)
-   */
-  today?: ReactNode;
-  /**
-   * Prayer times for the whole month; Card, DataTable.
-   * @slot month (React: pass as a prop)
-   */
-  month?: ReactNode;
-  /**
-   * Qibla direction; Card, QiblaCompass.
-   * @slot qibla (React: pass as a prop)
-   */
-  qibla?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPagePrayer: ComponentType<UiPagePrayerProps>;
-
-/**
- * Pricing template: billing-period toggle, plan cards and an FAQ.
- * Note: Place inside AppShell; fill only the slots you need.
- */
-export interface UiPagePricingProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Monthly/annual switch with a savings badge; Switch, Chip.
-   * @slot toggle (React: pass as a prop)
-   */
-  toggle?: ReactNode;
-  /**
-   * Plan cards, one marked featured; PricingCard.
-   * @slot plans (React: pass as a prop)
-   */
-  plans?: ReactNode;
-  /**
-   * Questions accordion; Accordion.
-   * @slot faq (React: pass as a prop)
-   */
-  faq?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPagePricing: ComponentType<UiPagePricingProps>;
-
-/**
- * User profile template: cover header, tabs and two columns of about, activity and plan cards.
- * Note: Place inside AppShell; fill only the slots you need.
- */
-export interface UiPageProfileProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Cover with avatar, name and meta; ProfileHeader.
-   * @slot profile (React: pass as a prop)
+   * Per-day occupancy chart; OccupancyChart or MiniChart.
+   * @slot occupancy (React: pass as a prop)
    */
-  profile?: ReactNode;
+  occupancy?: ReactNode;
   /**
-   * Section tabs; PillTabs.
-   * @slot tabs (React: pass as a prop)
+   * Inquiry-to-payment funnel; SalesFunnel.
+   * @slot funnel (React: pass as a prop)
    */
-  tabs?: ReactNode;
+  funnel?: ReactNode;
   /**
-   * Left column key-value info; Card with Descriptions.
-   * @slot about (React: pass as a prop)
+   * Revenue leaderboard; DataTable with Progress share bars.
+   * @slot top (React: pass as a prop)
    */
-  about?: ReactNode;
+  top?: ReactNode;
   /**
-   * Right column activity feed; Timeline.
+   * Recent actions, newest first; Timeline.
    * @slot activity (React: pass as a prop)
    */
   activity?: ReactNode;
+  children?: ReactNode;
+}
+export const UiPageDashboard: ComponentType<UiPageDashboardProps>;
+
+/** Page title block with optional breadcrumbs, subtitle and an actions area. */
+export interface UiPageHeaderProps {
+  /** Page title (rendered as h1). */
+  title: string;
+  /** Secondary text below the title. */
+  subtitle?: string;
+  /** Breadcrumb items shown above the title. */
+  crumbs?: { label: string; href?: string }[];
+  /**
+   * Title and subtitle size.
+   * @default 'md'
+   */
+  size?: Size;
   /**
-   * Right column plan card and upgrade button; Card, Badge, Progress, Button.
-   * @slot plan (React: pass as a prop)
+   * Right side of the header, usually buttons.
+   * @slot actions (React: pass as a prop)
    */
-  plan?: ReactNode;
+  actions?: ReactNode;
   children?: ReactNode;
 }
-export const UiPageProfile: ComponentType<UiPageProfileProps>;
+export const UiPageHeader: ComponentType<UiPageHeaderProps>;
 
 /**
- * Search template: query field, filter sidebar, result groups and an empty state.
+ * Pricing template: billing-period toggle, plan cards and an FAQ.
  * Note: Place inside AppShell; fill only the slots you need.
- * Note: Filters sit left of the results and stack above them under 860 px. Fill empty only when there are no results.
  */
-export interface UiPageSearchProps {
+export interface UiPagePricingProps {
   /**
    * Page heading. The built-in header renders only when title is set and the header slot is empty.
    * @remarks Forwarded to the inner element.
@@ -4940,28 +2016,23 @@ export interface UiPageSearchProps {
    */
   actions?: ReactNode;
   /**
-   * SearchInput, Tabs.
-   * @slot search (React: pass as a prop)
-   */
-  search?: ReactNode;
-  /**
-   * Filters; Card, Checkbox, Select.
-   * @slot filters (React: pass as a prop)
+   * Monthly/annual switch with a savings badge; Switch, Chip.
+   * @slot toggle (React: pass as a prop)
    */
-  filters?: ReactNode;
+  toggle?: ReactNode;
   /**
-   * Result groups; Card, Chip, Divider.
-   * @slot results (React: pass as a prop)
+   * Plan cards, one marked featured; PricingCard.
+   * @slot plans (React: pass as a prop)
    */
-  results?: ReactNode;
+  plans?: ReactNode;
   /**
-   * Shown only when there are no results; EmptyState.
-   * @slot empty (React: pass as a prop)
+   * Questions accordion; Accordion.
+   * @slot faq (React: pass as a prop)
    */
-  empty?: ReactNode;
+  faq?: ReactNode;
   children?: ReactNode;
 }
-export const UiPageSearch: ComponentType<UiPageSearchProps>;
+export const UiPagePricing: ComponentType<UiPagePricingProps>;
 
 /**
  * Settings template with a section sub-navigation and stacked settings sections.
@@ -5022,76 +2093,6 @@ export interface UiPageSettingsProps {
 }
 export const UiPageSettings: ComponentType<UiPageSettingsProps>;
 
-/**
- * State gallery: empty list, no results, no permission, offline, error with retry, loading and success on one page.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: The first six slots sit in two rows of auto-fit cards; success spans the full width.
- */
-export interface UiPageStatesProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Empty list; EmptyState with a primary action.
-   * @slot empty (React: pass as a prop)
-   */
-  empty?: ReactNode;
-  /**
-   * No search results; EmptyState with a reset action.
-   * @slot noresults (React: pass as a prop)
-   */
-  noresults?: ReactNode;
-  /**
-   * No permission; EmptyState with a request-access action.
-   * @slot forbidden (React: pass as a prop)
-   */
-  forbidden?: ReactNode;
-  /**
-   * Offline; DataState state="offline".
-   * @slot offline (React: pass as a prop)
-   */
-  offline?: ReactNode;
-  /**
-   * Error with retry; DataState state="error".
-   * @slot error (React: pass as a prop)
-   */
-  error?: ReactNode;
-  /**
-   * Loading; Skeleton or DataState state="loading".
-   * @slot loading (React: pass as a prop)
-   */
-  loading?: ReactNode;
-  /**
-   * Success confirmation; Alert tone="success" or EmptyState.
-   * @slot success (React: pass as a prop)
-   */
-  success?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageStates: ComponentType<UiPageStatesProps>;
-
 /**
  * Full-page status screen (404, 401, maintenance, coming soon) with one action.
  * Note: Slots replace only their own part: fill message and the preset code and button remain; kind, title, description, onAction and actionLabel apply to the parts whose slot is empty.
@@ -5157,126 +2158,6 @@ export interface UiPageStatusProps {
 }
 export const UiPageStatus: ComponentType<UiPageStatusProps>;
 
-/**
- * Team template: member stats, members table, roles and permissions matrix, and an invite form.
- * Note: Place inside AppShell; fill only the slots you need.
- * Note: Members and roles share the main column; the invite form is the side column.
- */
-export interface UiPageTeamProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Counters; KpiTile, StatsCard.
-   * @slot stats (React: pass as a prop)
-   */
-  stats?: ReactNode;
-  /**
-   * Members; DataTable with UserCell, Select, Badge.
-   * @slot members (React: pass as a prop)
-   */
-  members?: ReactNode;
-  /**
-   * Permissions matrix; DataTable with Checkbox cells.
-   * @slot roles (React: pass as a prop)
-   */
-  roles?: ReactNode;
-  /**
-   * Invite form; Card, TextField, Select, Button.
-   * @slot invite (React: pass as a prop)
-   */
-  invite?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageTeam: ComponentType<UiPageTeamProps>;
-
-/**
- * Public tour page: header, gradient gallery area, highlights, itinerary accordion, included and excluded lists, reviews and a sticky price and booking card. Has no shell and follows the theme.
- * Note: Render the page on its own, without AppShell: it supplies its own width and padding in your layout.
- * Note: The booking card stays visible on the right and goes below the content under 860 px.
- */
-export interface UiPageTourPublicProps {
-  /**
-   * Page heading. The built-in header renders only when title is set and the header slot is empty.
-   * @remarks Forwarded to the inner element.
-   */
-  title?: string;
-  /**
-   * Caption under the heading.
-   * @remarks Forwarded to the inner element.
-   */
-  subtitle?: string;
-  /**
-   * Breadcrumb trail above the title.
-   * @remarks Forwarded to the inner element.
-   */
-  crumbs?: { label: string; href?: string }[];
-  /**
-   * Custom page header; replaces the built-in title/subtitle/crumbs header.
-   * @slot header (React: pass as a prop)
-   */
-  header?: ReactNode;
-  /**
-   * Buttons on the right of the built-in header. With a title they sit beside it; without a title they render alone, right-aligned (unless the header slot is filled).
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  /**
-   * Hero area made of gradients or photos; Gallery, Card.
-   * @slot gallery (React: pass as a prop)
-   */
-  gallery?: ReactNode;
-  /**
-   * Key facts and highlights; StatStrip, IconTile.
-   * @slot highlights (React: pass as a prop)
-   */
-  highlights?: ReactNode;
-  /**
-   * Day by day program; Accordion.
-   * @slot itinerary (React: pass as a prop)
-   */
-  itinerary?: ReactNode;
-  /**
-   * What the price includes and excludes; Card, Descriptions.
-   * @slot included (React: pass as a prop)
-   */
-  included?: ReactNode;
-  /**
-   * Pilgrim reviews; Card, Rating, Avatar.
-   * @slot reviews (React: pass as a prop)
-   */
-  reviews?: ReactNode;
-  /**
-   * Price, dates, seats and the booking button; Card, Button.
-   * @slot booking (React: pass as a prop)
-   */
-  booking?: ReactNode;
-  children?: ReactNode;
-}
-export const UiPageTourPublic: ComponentType<UiPageTourPublicProps>;
-
 /**
  * User or customer list template: stats, filters, toolbar, table and a right-hand add/edit drawer.
  * Note: Place inside AppShell; fill only the slots you need.
@@ -5490,41 +2371,6 @@ export interface UiPhoneInputProps {
 }
 export const UiPhoneInput: ComponentType<UiPhoneInputProps>;
 
-/**
- * Small pill-shaped dropdown button. Use for inline filters and sort controls in toolbars.
- * Note: The menu closes on outside click and on Escape.
- */
-export interface UiPillSelectProps {
-  /** Value of the selected option. */
-  modelValue?: string | number;
-  /** Alias of modelValue, used when modelValue is not set. */
-  value?: string | number;
-  /**
-   * Available options. A missing list renders an empty menu. An option with disabled: true cannot be chosen.
-   * @default []
-   */
-  options?: { value: string | number; label: string; disabled?: boolean }[];
-  /** Shown when value matches no option. */
-  placeholder?: string;
-  /**
-   * Disables the control.
-   * @default false
-   */
-  disabled?: boolean;
-  /**
-   * Pill height and font size.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with the value of the chosen option.
-   * @event change
-   */
-  onChange?: (value: string | number) => void;
-  children?: ReactNode;
-}
-export const UiPillSelect: ComponentType<UiPillSelectProps>;
-
 /**
  * Pill-style tab buttons with optional icons, horizontal or vertical; use for settings and profile sections.
  * Note: Renders only the tab buttons; you show the matching panel yourself.
@@ -5556,32 +2402,6 @@ export interface UiPillTabsProps {
 }
 export const UiPillTabs: ComponentType<UiPillTabsProps>;
 
-/**
- * Horizontally scrolling kanban pipeline of stage columns filled with DealCards.
- * Note: Drag and drop is enabled only when a move handler is passed; without it the board renders and behaves as before.
- * Note: Uses HTML5 drag and drop (mouse and desktop browsers); there is no keyboard alternative, so also offer a stage select on the card if you need one.
- * Note: Cards are fixed to DealCard; for custom cards compose KanbanColumn and KanbanCard.
- */
-export interface UiPipelineBoardProps {
-  /**
-   * Columns in order; cards take the DealCard props (title, stage, tone, amount, probability, owner, due). The column count badge is cards.length. Give cards an id so onMove can report which one moved (the index is used otherwise).
-   * @default []
-   */
-  stages?: { id: string | number; title: string; cards: UiDealCardProps[] }[];
-  /**
-   * Scales padding, text and avatars.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with { id, from, to } (card id, source stage id, target stage id) when a card is dropped on another stage. The board does not reorder itself: update stages in your state.
-   * @event move
-   */
-  onMove?: (move: { id: string | number; from: string | number; to: string | number }) => void;
-  children?: ReactNode;
-}
-export const UiPipelineBoard: ComponentType<UiPipelineBoardProps>;
-
 /**
  * Button that opens a small confirmation popover with cancel/confirm buttons (No/Yes by default); use for quick inline confirmation of a single action.
  * Note: Open state is internal. The popover closes on outside click and on Escape.
@@ -5647,105 +2467,31 @@ export interface UiPortalProps {
 }
 export const UiPortal: ComponentType<UiPortalProps>;
 
-/** Row of daily prayer times with the upcoming prayer highlighted. */
-export interface UiPrayerTimesProps {
-  /**
-   * Prayers in display order; time is shown as-is, e.g. "05:12".
-   * @default []
-   */
-  items?: { name: string; time: string }[];
-  /** Index in items of the next prayer; sets aria-current on it. */
-  next?: number;
-  /**
-   * Scales padding, text and avatars.
-   * @default 'md'
-   */
-  size?: Size;
-  children?: ReactNode;
-}
-export const UiPrayerTimes: ComponentType<UiPrayerTimesProps>;
-
 /**
  * Unstyled pressable wrapper that makes any content a button with press feedback.
  * Note: For a non-button tag add role and keyboard handling yourself.
  */
 export interface UiPressableProps {
   /**
-   * HTML tag. type="button" is set only when this is button.
-   * @default 'button'
-   */
-  as?: string;
-  /** Accessible name (aria-label). */
-  label?: string;
-  /**
-   * Blocks interaction.
-   * @default false
-   */
-  disabled?: boolean;
-  /**
-   * Native click event.
-   * @event click
-   */
-  onClick?: (event: MouseEvent<HTMLElement>) => void;
-  children?: ReactNode;
-}
-export const UiPressable: ComponentType<UiPressableProps>;
-
-/** Pricing plan card with price, feature list and a select button. */
-export interface UiPricingCardProps {
-  /** Plan name. */
-  name: string;
-  /** Price text, shown large. */
-  price: string | number;
-  /** Suffix after the price, such as "/mo". */
-  period?: string;
-  /**
-   * Feature bullets with check icons.
-   * @default []
-   */
-  features?: string[];
-  /** Brand badge next to the name, such as "Popular". */
-  badge?: string;
-  /**
-   * Highlights the card and makes the button primary.
-   * @default false
-   */
-  featured?: boolean;
-  /**
-   * Button label.
-   * @default 'Choose'
-   */
-  cta?: string;
-  /**
-   * Card padding and title size.
-   * @default 'md'
+   * HTML tag. type="button" is set only when this is button.
+   * @default 'button'
    */
-  size?: Size;
+  as?: string;
+  /** Accessible name (aria-label). */
+  label?: string;
   /**
-   * Called when the button is clicked.
-   * @event select
+   * Blocks interaction.
+   * @default false
    */
-  onSelect?: () => void;
-  children?: ReactNode;
-}
-export const UiPricingCard: ComponentType<UiPricingCardProps>;
-
-/** Profile card with a cover image, large avatar, name and a row of meta items. */
-export interface UiProfileHeaderProps {
-  /** Person or organization name. */
-  name: string;
-  /** Avatar image URL; initials are shown without it. */
-  src?: string;
-  /** Cover image URL. */
-  cover?: string;
+  disabled?: boolean;
   /**
-   * Facts under the name such as location or join date. label must be unique.
-   * @default []
+   * Native click event.
+   * @event click
    */
-  meta?: { icon: string; label: string }[];
+  onClick?: (event: MouseEvent<HTMLElement>) => void;
   children?: ReactNode;
 }
-export const UiProfileHeader: ComponentType<UiProfileHeaderProps>;
+export const UiPressable: ComponentType<UiPressableProps>;
 
 /**
  * Horizontal progress bar with optional label and meta text; use for uploads, quotas and completion.
@@ -5772,32 +2518,6 @@ export interface UiProgressProps {
 }
 export const UiProgress: ComponentType<UiProgressProps>;
 
-/**
- * Compass dial with a Kaaba marker pointing to the Qibla and the bearing in degrees below it.
- * Note: Exposed as role="img" with a label that states the bearing. Compute the bearing and heading yourself (geolocation and DeviceOrientation); the component only draws them.
- */
-export interface UiQiblaCompassProps {
-  /**
-   * Qibla bearing in degrees clockwise from true north, 0 to 360; other values wrap.
-   * @default 0
-   */
-  bearing: number;
-  /**
-   * Direction the device points to, in degrees. The dial turns against it so the marker follows the real Qibla; 0 keeps north up.
-   * @default 0
-   */
-  heading?: number;
-  /** Optional small caption under the bearing, such as "4 210 km to the Kaaba". */
-  distance?: string;
-  /**
-   * Diameter: xs 120, sm 160, md 200, lg 250, xl 300 px; a number is used as px.
-   * @default 'md'
-   */
-  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | number;
-  children?: ReactNode;
-}
-export const UiQiblaCompass: ComponentType<UiQiblaCompassProps>;
-
 /** Group of radio options with optional hints. Use for a short single-choice list that should stay visible. */
 export interface UiRadioGroupProps {
   /** Value of the selected option. */
@@ -5846,95 +2566,6 @@ export interface UiRadioGroupProps {
 }
 export const UiRadioGroup: ComponentType<UiRadioGroupProps>;
 
-/**
- * Thirty-day Ramadan progress strip; the last ten days and odd nights are marked.
- * Note: Exposed as role="img" with aria-label "Day N of 30".
- */
-export interface UiRamadanTrackerProps {
-  /** Current day 1-30. Earlier days render as past, later days as upcoming. */
-  day: number;
-  /**
-   * Scales padding, text and avatars.
-   * @default 'md'
-   */
-  size?: Size;
-  children?: ReactNode;
-}
-export const UiRamadanTracker: ComponentType<UiRamadanTrackerProps>;
-
-/**
- * Month grid for picking a date range with hover preview. Use for stays, trips and report periods.
- * Note: Pass modelValue to control the selection; pick a date earlier than the start to restart the range.
- */
-export interface UiRangeCalendarProps {
-  /** Controlled range [start, end]; either end may be null. Date-only ISO strings are read as local dates. When omitted the selection is kept internally. */
-  modelValue?: [Date | string | number | null, Date | string | number | null];
-  /** Month to show initially when no range is set. Does not preselect a range. */
-  start?: Date | string | number;
-  /**
-   * BCP 47 locale for month and weekday names.
-   * @default 'en-GB'
-   */
-  locale?: string;
-  /**
-   * First day of the week: 0 = Sunday, 1 = Monday.
-   * @default 1
-   */
-  weekStartsOn?: number;
-  /**
-   * Day cell and header size.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with [start, end] Date objects. In controlled mode (modelValue set) it also fires after the first click with [start, null]; uncontrolled it fires once the second date is picked.
-   * @event change
-   */
-  onChange?: (range: [Date | null, Date | null]) => void;
-  children?: ReactNode;
-}
-export const UiRangeCalendar: ComponentType<UiRangeCalendarProps>;
-
-/** Two-handle slider for a min-max range. Use for price, duration or date-number filters. */
-export interface UiRangeSliderProps {
-  /** Tuple [from, to]. Defaults to [min, max]. */
-  modelValue?: [number, number];
-  /**
-   * Lowest value.
-   * @default 0
-   */
-  min?: number;
-  /**
-   * Highest value.
-   * @default 100
-   */
-  max?: number;
-  /**
-   * Step between values.
-   * @default 1
-   */
-  step?: number;
-  /** Formats both ends in the readout. */
-  formatValue?: (value: number) => string;
-  /**
-   * Label shown above the control.
-   * @remarks Forwarded to the inner element.
-   */
-  label?: string;
-  /**
-   * Track and thumb size.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with a new [from, to] tuple; the handles cannot cross.
-   * @event change
-   */
-  onChange?: (value: [number, number]) => void;
-  children?: ReactNode;
-}
-export const UiRangeSlider: ComponentType<UiRangeSliderProps>;
-
 /** Star rating input. Use for reviews and quick feedback. */
 export interface UiRatingProps {
   /**
@@ -5971,44 +2602,6 @@ export interface UiRatingProps {
 }
 export const UiRating: ComponentType<UiRatingProps>;
 
-/**
- * Rich text editor with a formatting toolbar, built on contenteditable. Use for formatted descriptions and notes.
- * Note: The editor only rewrites its content when modelValue differs from what is already in the DOM, so the caret is kept while typing.
- * Note: sanitize is a best-effort allowlist, not a full XSS guarantee: sanitize on the server too before storing or rendering the HTML elsewhere.
- * Note: Toolbar: bold, italic, underline, strikethrough, alignment, lists, quote and code block.
- */
-export interface UiRichEditorProps {
-  /**
-   * HTML string.
-   * @default ''
-   */
-  modelValue?: string;
-  /**
-   * Label above the editor. Also the accessible name.
-   * @default 'Editor'
-   */
-  label?: string;
-  /** Placeholder shown when empty. Defaults to "Write something…". */
-  placeholder?: string;
-  /**
-   * Strip script, style, iframe, object, embed and similar tags plus on* and javascript: attributes from the emitted HTML, using a small allowlist sanitizer.
-   * @default false
-   */
-  sanitize?: boolean;
-  /**
-   * Control height, font and padding scale.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with the editor innerHTML on every edit or toolbar action (sanitized when sanitize is set).
-   * @event change
-   */
-  onChange?: (value: string) => void;
-  children?: ReactNode;
-}
-export const UiRichEditor: ComponentType<UiRichEditorProps>;
-
 /** Circular progress gauge with a percentage in the center and a tick scale around it. */
 export interface UiRingProps {
   /**
@@ -6041,106 +2634,6 @@ export interface UiRingProps {
 }
 export const UiRing: ComponentType<UiRingProps>;
 
-/**
- * Gantt-style occupancy calendar: rooms as rows, days as columns, bookings as bars.
- * Note: Day headers are plain numbers 1..days; offset them yourself for a month view.
- */
-export interface UiRoomCalendarProps {
-  /**
-   * Rooms with their bookings; from is the zero-based day index of check-in, nights its length. guest is the cell tooltip.
-   * @default []
-   */
-  rooms?: { no: string; bookings?: { from: number; nights: number; guest: string }[] }[];
-  /**
-   * Number of day columns, labelled 1..days.
-   * @default 14
-   */
-  days?: number;
-  /**
-   * Scales padding, text and avatars.
-   * @default 'md'
-   */
-  size?: Size;
-  children?: ReactNode;
-}
-export const UiRoomCalendar: ComponentType<UiRoomCalendarProps>;
-
-/**
- * Tile grid of rooms colored by housekeeping status; use for front-desk room selection.
- * Note: Each tile is a button; status is conveyed by color only, so add a legend.
- */
-export interface UiRoomGridProps {
-  /**
-   * Rooms; no is the room number and the unique key, type is the room class label, status sets the tile color (any other value renders neutral).
-   * @default []
-   */
-  rooms?: { no: string; type: string; status: "occupied" | "clean" | "dirty" | "blocked" }[];
-  /**
-   * Maps a room status to a tile tone. Merged over the defaults, so you can add custom statuses (e.g. { maintenance: "sky" }) or recolor known ones. Statuses without a tone render neutral.
-   * @default { occupied: 'brand', clean: 'success', dirty: 'warning', blocked: 'danger' }
-   */
-  statusTones?: Record<string, 'brand' | 'sky' | 'success' | 'warning' | 'danger' | 'neutral'>;
-  /**
-   * Scales padding, text and avatars.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with the room number (room.no) of the clicked tile.
-   * @event select
-   */
-  onSelect?: (no: string) => void;
-  children?: ReactNode;
-}
-export const UiRoomGrid: ComponentType<UiRoomGridProps>;
-
-/** Horizontal funnel of steps with bars scaled to the largest value, for conversion flows. */
-export interface UiSalesFunnelProps {
-  /**
-   * Steps from top to bottom. Bars scale to the max value; the last step is highlighted in brand color.
-   * @default []
-   */
-  steps: { label: string; value: number }[];
-  children?: ReactNode;
-}
-export const UiSalesFunnel: ComponentType<UiSalesFunnelProps>;
-
-/**
- * Full-screen idle screen with a large clock, date and the brand mark; show it after inactivity.
- * Note: The clock re-renders from one interval created when the screensaver opens and cleared when it closes; the idle timer is re-armed on each interaction. Nothing runs during server rendering.
- */
-export interface UiScreensaverProps {
-  /**
-   * Shows the screensaver when true; renders nothing when false.
-   * @default false
-   */
-  open?: boolean;
-  /**
-   * BCP 47 locale for the date line.
-   * @default 'en-GB'
-   */
-  locale?: string;
-  /** Small hint under the date, e.g. "Tap to continue". */
-  hint?: string;
-  /**
-   * When greater than 0 and the screensaver is closed, a hidden sentinel listens for pointer, key, wheel and touch activity and calls idle after this many milliseconds without any. 0 disables it.
-   * @default 0
-   */
-  idleMs?: number;
-  /**
-   * Called on click or any key (including Escape) while open.
-   * @event close
-   */
-  onClose?: () => void;
-  /**
-   * Called once the idleMs period passes without activity while closed; set open to true in the handler.
-   * @event idle
-   */
-  onIdle?: () => void;
-  children?: ReactNode;
-}
-export const UiScreensaver: ComponentType<UiScreensaverProps>;
-
 /** Vertically scrollable container with a max height and styled scrollbar. */
 export interface UiScrollAreaProps {
   /**
@@ -6183,17 +2676,6 @@ export interface UiSearchInputProps {
 }
 export const UiSearchInput: ComponentType<UiSearchInputProps>;
 
-/** Single stacked bar split into proportional segments with a legend, for distributions. */
-export interface UiSegBarProps {
-  /**
-   * Segments; widths are value / sum of values. color is any CSS color; the default cycles brand, sky, green, amber, red.
-   * @default []
-   */
-  segments: { label: string; value: number; color?: string }[];
-  children?: ReactNode;
-}
-export const UiSegBar: ComponentType<UiSegBarProps>;
-
 /** Segmented switch for choosing exactly one of a few options. */
 export interface UiSegmentedControlProps {
   /**
@@ -6503,33 +2985,6 @@ export interface UiSocialAuthProps {
 }
 export const UiSocialAuth: ComponentType<UiSocialAuthProps>;
 
-/**
- * Drag-and-drop reorderable list with grip handles and up/down buttons.
- * Note: Controlled: the parent must store the array from change and pass it back as items.
- * Note: Keyboard-friendly reordering is available through the up/down buttons.
- */
-export interface UiSortableProps {
-  /**
-   * Items in current order. id is used as the key, falling back to the index.
-   * @default []
-   */
-  items: { id?: string | number; label: string }[];
-  /** Custom item renderer. Defaults to the bold item label. */
-  render?: (item: any, index: any) => ReactNode;
-  /**
-   * Row padding, gap and font size.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with the reordered items array after a drop or up/down click.
-   * @event change
-   */
-  onChange?: (items: any[]) => void;
-  children?: ReactNode;
-}
-export const UiSortable: ComponentType<UiSortableProps>;
-
 /**
  * Inline loading indicator; use inside buttons, cards or next to a loading label.
  * Note: Has role="status" and aria-label="Loading".
@@ -6551,88 +3006,22 @@ export const UiSpinner: ComponentType<UiSpinnerProps>;
 export interface UiSplitLayoutProps {
   /**
    * CSS grid-template-columns value, for example "280px 1fr".
-   * @default 1fr 1fr
-   */
-  columns?: string;
-  /**
-   * First column. Falls back to the first child.
-   * @slot left (React: pass as a prop)
-   */
-  left?: ReactNode;
-  /**
-   * Second column. Falls back to the second child.
-   * @slot right (React: pass as a prop)
-   */
-  right?: ReactNode;
-  children?: ReactNode;
-}
-export const UiSplitLayout: ComponentType<UiSplitLayoutProps>;
-
-/** Card with a large value, icon tile, label and an accent bar, for a single headline number. */
-export interface UiStatLineProps {
-  /** Metric name under the value. */
-  label: string;
-  /** Main value. */
-  value: string | number;
-  /** Icon name for the tile. */
-  icon?: string;
-  /**
-   * Accent color of the tile and bar. Unknown values fall back to brand.
-   * @default 'brand'
-   */
-  tone?: Tone;
-  /** Change indicator such as "+12%" or "-3.4%". A leading "-" renders as a decrease, anything else as an increase. */
-  delta?: string;
-  /**
-   * Icon tile size. Named sizes map to 28/34/40/48/56 px; a number is used in px.
-   * @default 'md'
-   */
-  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | number;
-  children?: ReactNode;
-}
-export const UiStatLine: ComponentType<UiStatLineProps>;
-
-/** List row with an icon tile, title, subtitle and a right-aligned value with delta. */
-export interface UiStatRowProps {
-  /** Primary text. */
-  title: string;
-  /** Muted secondary text. */
-  sub?: string;
-  /** Right-aligned value. */
-  value?: string | number;
-  /** Change shown under the value. A leading "-" is a decrease; the sign is stripped and an arrow added. */
-  delta?: string;
-  /** Icon name for the leading tile. */
-  icon?: string;
-  /**
-   * Color of the icon tile. Unknown values fall back to brand.
-   * @default 'brand'
-   */
-  tone?: Tone;
-  /**
-   * Row height and icon tile size. Named sizes map to a 28/34/40/48/56 px tile; a number is used as the tile size in px.
-   * @default 'md'
-   */
-  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | number;
-  children?: ReactNode;
-}
-export const UiStatRow: ComponentType<UiStatRowProps>;
-
-/** Horizontal strip of several icon, value and label stats in one card. */
-export interface UiStatStripProps {
+   * @default 1fr 1fr
+   */
+  columns?: string;
   /**
-   * Stats shown side by side. tone defaults to brand.
-   * @default []
+   * First column. Falls back to the first child.
+   * @slot left (React: pass as a prop)
    */
-  items: { icon?: string; tone?: 'brand' | 'sky' | 'success' | 'warning' | 'danger' | 'neutral'; value: string | number; label: string }[];
+  left?: ReactNode;
   /**
-   * Icon tile size. Named sizes map to 30/36/44/52/60 px; a number is used in px.
-   * @default 'md'
+   * Second column. Falls back to the second child.
+   * @slot right (React: pass as a prop)
    */
-  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | number;
+  right?: ReactNode;
   children?: ReactNode;
 }
-export const UiStatStrip: ComponentType<UiStatStripProps>;
+export const UiSplitLayout: ComponentType<UiSplitLayoutProps>;
 
 /** Metric card with an optional icon, value and an up or down trend. */
 export interface UiStatsCardProps {
@@ -6730,97 +3119,6 @@ export interface UiStatusPageProps {
 }
 export const UiStatusPage: ComponentType<UiStatusPageProps>;
 
-/**
- * Wide Modal with a vertical step list on the left and Previous/Next buttons; use for multi-step wizards.
- * Note: You own the current index: update it in the back and next handlers.
- * Note: Has aria-modal. Escape calls close; on open focus moves into the dialog, Tab is trapped inside it and focus returns to the previously focused element on close.
- */
-export interface UiStepDialogProps {
-  /**
-   * Shows the dialog when true; renders nothing when false.
-   * @default false
-   */
-  open?: boolean;
-  /** Header text and aria-label. */
-  title?: string;
-  /**
-   * Steps in the left rail; sub is a hint under the title.
-   * @default []
-   */
-  steps?: { title: string; sub?: string }[];
-  /** Zero-based index of the active step. Earlier steps are shown as done. */
-  current?: number;
-  /**
-   * Scale of dialog width (640 to 1100 px) and padding.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Previous button; disabled on the first step.
-   * @event back
-   */
-  onBack?: () => void;
-  /**
-   * Next button; labelled "Submit" on the last step, so also handle submit here.
-   * @event next
-   */
-  onNext?: () => void;
-  /**
-   * Close icon, scrim click or the Escape key.
-   * @event close
-   */
-  onClose?: () => void;
-  children?: ReactNode;
-}
-export const UiStepDialog: ComponentType<UiStepDialogProps>;
-
-/**
- * Multi-step form shell: stepper, current step content and Back/Next buttons. Use for wizards and onboarding.
- * Note: The current step is internal; Next never validates, so guard the content yourself.
- */
-export interface UiStepFormProps {
-  /**
-   * Steps in order. content is rendered while the step is active.
-   * @default []
-   */
-  steps?: { label: string; content: ReactNode }[];
-  /**
-   * Text of the Next button on the last step.
-   * @default 'Finish'
-   */
-  finishLabel?: string;
-  /**
-   * Also sets the size of the Back/Next buttons.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called when Next is pressed on the last step.
-   * @event finish
-   */
-  onFinish?: () => void;
-  children?: ReactNode;
-}
-export const UiStepForm: ComponentType<UiStepFormProps>;
-
-/** Horizontal progress indicator with numbered steps. Use to show position in a multi-step flow. */
-export interface UiStepperProps {
-  /**
-   * Step labels in order.
-   * @default []
-   */
-  steps?: string[];
-  /** Zero-based index of the active step. Earlier steps show a check mark. */
-  current: number;
-  /**
-   * Step circle and label size.
-   * @default 'md'
-   */
-  size?: Size;
-  children?: ReactNode;
-}
-export const UiStepper: ComponentType<UiStepperProps>;
-
 /** Compact vertical list of sections with an optional title; use for settings and secondary page navigation. */
 export interface UiSubNavProps {
   /** Small heading above the list; also the aria-label. */
@@ -6886,48 +3184,6 @@ export interface UiSwitchProps {
 }
 export const UiSwitch: ComponentType<UiSwitchProps>;
 
-/** List of services with a status dot and a value such as uptime or latency. */
-export interface UiSystemStatusProps {
-  /**
-   * Services. state sets the color: ok green (default), warn amber, down red.
-   * @default []
-   */
-  items: { name: string; value: string; state?: 'ok' | 'warn' | 'down' }[];
-  children?: ReactNode;
-}
-export const UiSystemStatus: ComponentType<UiSystemStatusProps>;
-
-/**
- * Row of icon tiles that work as tabs, with an optional add button.
- * Note: Active state is exposed as aria-pressed on buttons, not as a tablist.
- */
-export interface UiTabTilesProps {
-  /**
-   * Tiles. icon defaults to circle.
-   * @default []
-   */
-  items: { value: string; label: string; icon?: string }[];
-  /** Value of the active tile. Controlled; change it in the change handler. */
-  value?: string;
-  /**
-   * Shows a trailing plus tile that fires the add event.
-   * @default false
-   */
-  addable?: boolean;
-  /**
-   * Called with the value of the clicked tile.
-   * @event change
-   */
-  onChange?: (value: string) => void;
-  /**
-   * Called when the plus tile is clicked.
-   * @event add
-   */
-  onAdd?: () => void;
-  children?: ReactNode;
-}
-export const UiTabTiles: ComponentType<UiTabTilesProps>;
-
 /**
  * Underlined tab strip for switching between views of the same page.
  * Note: Renders only the tab buttons (role="tablist"); you show the matching panel yourself.
@@ -7434,188 +3690,6 @@ export interface UiTopNavProps {
 }
 export const UiTopNav: ComponentType<UiTopNavProps>;
 
-/**
- * Guided product tour that dims the page, highlights a target element and shows a step popover.
- * Note: Keyboard: ArrowRight/ArrowLeft go to the next/previous step (reversed in RTL), Escape closes. Focus is not moved, so the page stays usable.
- * Note: Targets are looked up with document.querySelector and scrolled into view.
- * Note: The internal step resets to 0 whenever the tour closes.
- */
-export interface UiTourProps {
-  /**
-   * Shows the tour when true; renders nothing when false.
-   * @default false
-   */
-  open?: boolean;
-  /**
-   * Steps. target is a CSS selector of the element to highlight; without it the step is shown centered over a full dim.
-   * @default []
-   */
-  steps?: { target?: string; title: string; text: string }[];
-  /** Controlled zero-based step index. When omitted the tour keeps it internally (reset to 0 on close). Update it from the step event. */
-  step?: number;
-  /**
-   * Called on the close icon, the Escape key and after Finish on the last step.
-   * @event close
-   */
-  onClose?: () => void;
-  /**
-   * Called with the new zero-based step index on Next, Back and the arrow keys.
-   * @event step
-   */
-  onStep?: (index: number) => void;
-  children?: ReactNode;
-}
-export const UiTour: ComponentType<UiTourProps>;
-
-/**
- * Tour or virtual-tour card with session count and a seat-occupancy bar.
- * Note: A fixed "360°" badge is always shown.
- * Note: With seats = 0 or missing the bar is empty (0%) and the meta reads "0/0".
- */
-export interface UiTourCardProps {
-  /** Tour title. */
-  name: string;
-  /** City shown in the subtitle. */
-  city?: string;
-  /** Number of sessions, shown as "N sessions". */
-  sessions?: number;
-  /** Seats already booked. */
-  booked: number;
-  /** Total seats; the bar shows booked / seats. */
-  seats: number;
-  /**
-   * Scales padding, text and avatars.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Footer actions, usually Buttons.
-   * @slot actions (React: pass as a prop)
-   */
-  actions?: ReactNode;
-  children?: ReactNode;
-}
-export const UiTourCard: ComponentType<UiTourCardProps>;
-
-/** Step card of a tour with title, text, step counter and Back/Next buttons; used by Tour and usable standalone. */
-export interface UiTourPopoverProps {
-  /** Step heading. */
-  title?: string;
-  /** Step body text. */
-  text?: string;
-  /** Counter text such as "2 / 5". */
-  step?: string;
-  /**
-   * Changes the Next button label to "Finish".
-   * @default false
-   */
-  last?: boolean;
-  /**
-   * Back button; the button is rendered only when this handler is set.
-   * @event back
-   */
-  onBack?: () => void;
-  /**
-   * Next or Finish button.
-   * @event next
-   */
-  onNext?: () => void;
-  /**
-   * Close icon.
-   * @event close
-   */
-  onClose?: () => void;
-  children?: ReactNode;
-}
-export const UiTourPopover: ComponentType<UiTourPopoverProps>;
-
-/**
- * Dropdown with a searchable tree. Use for hierarchical choices such as regions, categories or org units.
- * Note: Typing in the search box expands all matching branches.
- * Note: The popup closes on outside click and on Escape.
- */
-export interface UiTreeSelectProps {
-  /** id of the selected node. */
-  modelValue?: string | number;
-  /**
-   * Tree nodes. A node with disabled: true cannot be clicked. Top level is expanded by default.
-   * @default []
-   */
-  nodes?: { id: string | number; label: string; children?: any[]; disabled?: boolean }[];
-  /**
-   * Allow selecting nodes that have children. By default clicking a parent only expands it.
-   * @default false
-   */
-  selectGroups?: boolean;
-  /**
-   * Label shown above the control.
-   * @remarks Forwarded to the inner element.
-   */
-  label?: string;
-  /** Shown when nothing is selected. Defaults to "—". */
-  placeholder?: string;
-  /**
-   * Disables the control.
-   * @default false
-   */
-  disabled?: boolean;
-  /**
-   * Control height, font and padding scale.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with the id of the chosen node.
-   * @event change
-   */
-  onChange?: (value: string | number) => void;
-  children?: ReactNode;
-}
-export const UiTreeSelect: ComponentType<UiTreeSelectProps>;
-
-/**
- * Expandable tree of nodes for hierarchies such as folders, categories or regions.
- * Note: The first level is open by default; deeper levels start collapsed.
- */
-export interface UiTreeViewProps {
-  /**
-   * Root nodes. children nest recursively; icon is an icon name. Ids must be unique.
-   * @default []
-   */
-  nodes: { id: string; label: string; icon?: string; children?: any[] }[];
-  /** Id of the highlighted node. */
-  selected?: string;
-  /**
-   * Row height and font size.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with the node id when a node is clicked. Nodes with children also toggle open.
-   * @event select
-   */
-  onSelect?: (id: string | number) => void;
-  children?: ReactNode;
-}
-export const UiTreeView: ComponentType<UiTreeViewProps>;
-
-/** Avatar with a name and optional subtitle, for table cells and lists of people. */
-export interface UiUserCellProps {
-  /** Display name, also used for avatar initials. */
-  name: string;
-  /** Muted line under the name, such as an email or role. */
-  sub?: string;
-  /** Avatar image URL. Initials are shown without it. */
-  src?: string;
-  /**
-   * Avatar diameter: xs 24, sm 30, md 36, lg 44, xl 56 px; a number is used as px.
-   * @default 'md'
-   */
-  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | number;
-  children?: ReactNode;
-}
-export const UiUserCell: ComponentType<UiUserCellProps>;
-
 /** Vertical flex column with a configurable gap. */
 export interface UiVStackProps {
   /**
@@ -7655,87 +3729,8 @@ export interface UiVStackProps {
 }
 export const UiVStack: ComponentType<UiVStackProps>;
 
-/**
- * TextField (or PasswordInput) with built-in validation rules. Use for simple client-side validation without a form library.
- * Note: Rules start running after the first edit, so an untouched field shows no error.
- * Note: All other props are forwarded to TextField / PasswordInput.
- */
-export interface UiValidatedFieldProps {
-  /**
-   * Current value.
-   * @default ''
-   */
-  modelValue?: string;
-  /**
-   * Validators run in order; return true when valid or an error message. The first failure is shown.
-   * @default []
-   */
-  rules?: ((value: string) => true | string)[];
-  /**
-   * "password" renders PasswordInput, any other value is passed to TextField as the input type.
-   * @default 'text'
-   */
-  type?: 'text' | 'password' | string;
-  /** External error. Takes priority over rules. */
-  error?: string;
-  /**
-   * Label shown above the control.
-   * @remarks Forwarded to the inner element.
-   */
-  label?: string;
-  /**
-   * Placeholder text.
-   * @remarks Forwarded to the inner element.
-   */
-  placeholder?: string;
-  /**
-   * Helper text under the control. Hidden while error is set.
-   * @remarks Forwarded to the inner element.
-   */
-  hint?: string;
-  /**
-   * Leading icon name (TextField only).
-   * @remarks Forwarded to the inner element.
-   */
-  icon?: string;
-  /**
-   * Disables the control.
-   * @default false
-   * @remarks Forwarded to the inner element.
-   */
-  disabled?: boolean;
-  /**
-   * Control height, font and padding scale.
-   * @default 'md'
-   */
-  size?: Size;
-  /**
-   * Called with the new string on every keystroke.
-   * @event change
-   */
-  onChange?: (value: string) => void;
-  children?: ReactNode;
-}
-export const UiValidatedField: ComponentType<UiValidatedFieldProps>;
-
-/**
- * Head-to-head comparison of two values with a proportional two-color bar.
- * Note: A missing side renders an empty label and 0; with both at 0 the bar is split with no brand share.
- */
-export interface UiVersusBarProps {
-  /** Left side. Its share of the bar is value / (left.value + right.value) in the brand color. */
-  left: { label: string; value: number };
-  /** Right side, filling the remainder of the bar in sky. */
-  right: { label: string; value: number };
-  /**
-   * Value font size and bar thickness.
-   * @default 'md'
-   */
-  size?: Size;
-  children?: ReactNode;
-}
-export const UiVersusBar: ComponentType<UiVersusBarProps>;
-
 export const rules: typeof import('./shared').rules;
 export { useUiTheme } from './theme';
 export { fmt, setIconBase } from './shared';
+/** Extension API: wraps plugin component definitions like the built-in ones, registers them (C.Name cross references work) and returns { UiName: Component }. */
+export function defineUiComponents(defs: Record<string, import('./core').ComponentDefinition>, options?: { override?: boolean }): Record<string, ComponentType<any>>;