@smworks-cz/ui-kit 1.5.1 → 1.7.0

package/dist/index.d.mts

@@ -1,7 +1,8 @@
-import React from 'react';
+import * as React from 'react';
+import React__default from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
-type ButtonVariant = 'primary' | 'secondary' | 'outline' | 'danger';
+type ButtonVariant = 'primary' | 'secondary' | 'outline' | 'danger' | 'danger-outline';
 type ButtonSize = 'sm' | 'md' | 'lg';
 type ButtonIconPosition = 'left' | 'right';
 /** Sdílené props pro režim `<button>` i `<a>`. */
@@ -9,9 +10,10 @@ interface ButtonBaseProps {
     /**
      * Vizuální varianta tlačítka.
      * - `primary`   — oranžové vyplnění (#FC4F00)
-     * - `secondary` — průhledné, bez okraje
-     * - `outline`   — průhledné s bílým okrajem
+     * - `secondary` — jemné tónované pozadí bez okraje (viditelné i na kartě)
+     * - `outline`   — průhledné s okrajem
      * - `danger`    — červené vyplnění (#EF3838)
+     * - `danger-outline` — průhledné s červeným okrajem a červeným textem
      * @default 'primary'
      */
     variant?: ButtonVariant;
@@ -24,7 +26,7 @@ interface ButtonBaseProps {
      * Volitelná ikona — libovolný React uzel (SVG, komponenta…).
      * Při použití bez `children` se tlačítko vykreslí jako čtverec.
      */
-    icon?: React.ReactNode;
+    icon?: React__default.ReactNode;
     /**
      * Na které straně se ikona zobrazí vzhledem k textu.
      * @default 'left'
@@ -44,14 +46,15 @@ interface ButtonBaseProps {
      */
     loadingPosition?: 'replace' | 'after-text';
     /**
-     * Roztáhne tlačítko na celou šířku kontejneru.
+     * Roztáhne tlačítko na dostupnou šířku. Ve flex řádku vedle jiných prvků
+     * vyplní zbytek (`flex: 1 1 auto`, `min-width: 0`), nepřeteče rodiče.
      */
     fullWidth?: boolean;
     /**
      * Další inline styly aplikované na kořenový element (`<button>` nebo `<a>`).
      * Sloučeny za všechny variantní / velikostní styly — pro jednorázové přepsání.
      */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /**
      * Dodatečná CSS třída pro kořenový element.
      */
@@ -60,25 +63,25 @@ interface ButtonBaseProps {
      * Textový obsah tlačítka.
      * Při vynechání (pokud je zadána `icon`) se tlačítko vykreslí jako čtverec.
      */
-    children?: React.ReactNode;
+    children?: React__default.ReactNode;
 }
 /** Vykreslení jako nativní `<button>` (výchozí). Dědí všechny standardní atributy — včetně `onClick`, `type`, `form`, `name`, `value`, `aria-*` apod. */
-interface ButtonAsButtonProps extends ButtonBaseProps, Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, keyof ButtonBaseProps> {
+interface ButtonAsButtonProps extends ButtonBaseProps, Omit<React__default.ButtonHTMLAttributes<HTMLButtonElement>, keyof ButtonBaseProps> {
     /** Při vynechání se komponenta vykreslí jako `<button>`. */
     href?: undefined;
 }
 /** Vykreslení jako `<a>` odkaz, pokud je zadáno `href`. Vhodné pro navigační tlačítka. */
-interface ButtonAsAnchorProps extends ButtonBaseProps, Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof ButtonBaseProps> {
+interface ButtonAsAnchorProps extends ButtonBaseProps, Omit<React__default.AnchorHTMLAttributes<HTMLAnchorElement>, keyof ButtonBaseProps> {
     href: string;
 }
 type ButtonProps = ButtonAsButtonProps | ButtonAsAnchorProps;
-declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement | HTMLAnchorElement>>;
+declare const Button: React__default.ForwardRefExoticComponent<ButtonProps & React__default.RefAttributes<HTMLButtonElement | HTMLAnchorElement>>;
 
-interface IconButtonProps {
+interface IconButtonProps extends Omit<React__default.ButtonHTMLAttributes<HTMLButtonElement>, 'onClick' | 'style' | 'className'> {
     /** Ikona. */
-    icon: React.ReactNode;
+    icon: React__default.ReactNode;
     /** Callback při kliknutí. */
-    onClick?: (e: React.MouseEvent) => void;
+    onClick?: (e: React__default.MouseEvent<HTMLButtonElement>) => void;
     /** Povinný aria-label pro přístupnost. */
     label: string;
     /** Varianta. @default 'default' */
@@ -89,10 +92,18 @@ interface IconButtonProps {
     disabled?: boolean;
     /** Zobrazí spinner. @default false */
     loading?: boolean;
+    /**
+     * Sepnutý stav (toggle v toolbaru — tučné písmo, filtr…). Zvýrazní pozadí
+     * a nastaví `aria-pressed`.
+     * @default false
+     */
+    active?: boolean;
     /** Automaticky obalí tooltipem. */
     tooltip?: string;
+    /** Typ nativního tlačítka. @default 'button' */
+    type?: 'button' | 'submit' | 'reset';
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -100,33 +111,35 @@ interface IconButtonProps {
  * Čtvercové tlačítko pro ikonu.
  *
  * Optimalizované pro akce bez textu — klikací plocha je čtvercová,
- * varianta a velikost se řídí samostatně.
+ * varianta a velikost se řídí samostatně. Forwarduje `ref` a propouští
+ * nativní atributy (`type`, `title`, `aria-*`, `data-*`, `form`…).
  *
  * @example
  * ```tsx
  * <IconButton icon={<TrashIcon />} label="Smazat" variant="danger" onClick={handleDelete} />
  * <IconButton icon={<PencilIcon />} label="Upravit" tooltip="Upravit záznam" />
+ * <IconButton icon={<TextBIcon />} label="Tučně" active={isBold} onClick={toggleBold} />
  * ```
  */
-declare const IconButton: React.FC<IconButtonProps>;
+declare const IconButton: React__default.ForwardRefExoticComponent<IconButtonProps & React__default.RefAttributes<HTMLButtonElement>>;
 
 interface FormFieldProps {
     /** Popisek pole. */
-    label?: string | React.ReactNode;
+    label?: string | React__default.ReactNode;
     /** Povinné pole — zobrazí hvězdičku. @default false */
     required?: boolean;
     /** Nápovědný text pod polem. */
-    helperText?: string | React.ReactNode;
+    helperText?: string | React__default.ReactNode;
     /** Chybová zpráva — zobrazí se červeně pod polem. */
-    error?: string | React.ReactNode;
+    error?: string | React__default.ReactNode;
     /** Formulářový prvek (input, select, atd.). */
-    children: React.ReactNode;
+    children: React__default.ReactNode;
     /** Vodorovný layout (label vlevo, field vpravo). @default false */
     inline?: boolean;
     /** Šířka labelu v inline režimu. @default '120px' */
     labelWidth?: number | string;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -147,10 +160,45 @@ interface FormFieldProps {
  * </FormField>
  * ```
  */
-declare const FormField: React.FC<FormFieldProps>;
+declare const FormField: React__default.FC<FormFieldProps>;
+
+interface FieldLabelProps extends Omit<React__default.LabelHTMLAttributes<HTMLLabelElement>, 'children'> {
+    /** Text popisku. */
+    children: React__default.ReactNode;
+    /** Zobrazí hvězdičku povinného pole. @default false */
+    required?: boolean;
+    /** Vykreslit jako `<span>` místo `<label>` (pro prvky, které nejsou formulářové). @default 'label' */
+    as?: 'label' | 'span';
+}
+/**
+ * Samostatný popisek pole ve stylu SM-UI (Zalando Sans Expanded, 10px, verzálky).
+ * Stejná typografie, jakou používá `label` prop u Input / Select / Textarea,
+ * pro vlastní prvky konzumenta.
+ *
+ * @example
+ * ```tsx
+ * <FieldLabel htmlFor="color" required>Barva</FieldLabel>
+ * <FieldLabel as="span">Nastavení</FieldLabel>
+ * ```
+ */
+declare const FieldLabel: React__default.FC<FieldLabelProps>;
 
 type InputSize = 'sm' | 'md' | 'lg';
-interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'> {
+type InputVariant = 'default' | 'inline';
+interface InputProps extends Omit<React__default.InputHTMLAttributes<HTMLInputElement>, 'size'> {
+    /**
+     * Vizuální varianta.
+     * - `'default'` — pole s pozadím a rámečkem
+     * - `'inline'` — bez pozadí a rámečku v klidu (vypadá jako text), rámeček až na hover / focus.
+     *   Pro editaci přímo v buňce tabulky nebo kartě (click-to-edit).
+     * @default 'default'
+     */
+    variant?: InputVariant;
+    /**
+     * Voláno při potvrzení hodnoty — na blur a na Enter — jen pokud se hodnota
+     * od získání fokusu změnila. Vzor click-to-edit: uložení až po dopsání, ne na každý stisk.
+     */
+    onCommit?: (value: string) => void;
     /**
      * Popisek zobrazený nad vstupním polem.
      * Stylizován velkými písmeny dle SM-UI design systému.
@@ -161,7 +209,7 @@ interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, '
      * Ikona vykreslená uvnitř vstupního pole.
      * Typicky SVG nebo komponenta ikony.
      */
-    icon?: React.ReactNode;
+    icon?: React__default.ReactNode;
     /**
      * Na které straně se ikona zobrazí.
      * @default 'left'
@@ -211,7 +259,7 @@ interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, '
      * Další inline styly pro **obalový** `<div>` (ne pro nativní input).
      * Pro stylování nativního `<input>` použijte `inputStyle`.
      */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /**
      * Dodatečná CSS třída pro **obalový** `<div>`.
      */
@@ -219,7 +267,7 @@ interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, '
     /**
      * Další inline styly aplikované přímo na nativní `<input>` element.
      */
-    inputStyle?: React.CSSProperties;
+    inputStyle?: React__default.CSSProperties;
 }
 interface InputGroupProps {
     /**
@@ -236,9 +284,9 @@ interface InputGroupProps {
      * Vstupní element(y) vykreslené uvnitř skupiny.
      * Při vynechání se vykreslí výchozí `<Input />`.
      */
-    children?: React.ReactNode;
+    children?: React__default.ReactNode;
     /** Další inline styly pro obalový `<div>`. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída pro obalový `<div>`. */
     className?: string;
 }
@@ -257,9 +305,10 @@ interface InputGroupProps {
  * <Input icon={<SearchIcon />} placeholder="Hledat…" clearable />
  * <Input error="Toto pole je povinné" value="" />
  * <Input label="Heslo" type="password" helperText="Min. 8 znaků" />
+ * <Input variant="inline" value={name} onChange={...} onCommit={save} />
  * ```
  */
-declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
+declare const Input: React__default.ForwardRefExoticComponent<InputProps & React__default.RefAttributes<HTMLInputElement>>;
 /**
  * Obalí `<Input>` (nebo jiný formulářový prvek) skupinou s popiskem.
  * Popisek je stylizován velkými písmeny dle SM-UI design systému.
@@ -275,15 +324,11 @@ declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttri
  * </InputGroup>
  * ```
  */
-declare const InputGroup: React.FC<InputGroupProps>;
+declare const InputGroup: React__default.FC<InputGroupProps>;
 
 type NumberInputSize = 'sm' | 'md' | 'lg';
-type NumberInputVariant = 'default' | 'compact';
-interface NumberInputProps {
-    /** Aktuální numerická hodnota. */
-    value: number;
-    /** Callback volaný při změně hodnoty. */
-    onChange: (value: number) => void;
+type NumberInputVariant = 'default' | 'compact' | 'inline';
+interface NumberInputBaseProps {
     /** Minimální povolená hodnota. */
     min?: number;
     /** Maximální povolená hodnota. */
@@ -292,8 +337,14 @@ interface NumberInputProps {
     step?: number;
     /** Popisek zobrazený nad polem. Stylizován velkými písmeny dle SM-UI design systému. */
     label?: string;
+    /** Označí pole jako povinné (hvězdička u popisku). */
+    required?: boolean;
+    /** Zástupný text zobrazený při prázdném poli. */
+    placeholder?: string;
     /** Při `true` se pole zobrazí jako nevalidní. Při zadání řetězce se zobrazí chybová zpráva. */
     error?: boolean | string;
+    /** Nápovědný text zobrazený pod polem. Nezobrazí se pokud je aktivní chybová zpráva. */
+    helperText?: string;
     /** Zakáže celé pole včetně tlačítek. */
     disabled?: boolean;
     /**
@@ -308,61 +359,80 @@ interface NumberInputProps {
      * Varianta rozložení.
      * - `'default'` -- tlačítka −/+ po stranách
      * - `'compact'` -- šipky nahoru/dolů vpravo uvnitř pole
+     * - `'inline'` -- bez tlačítek, bez rámečku v klidu (editace v buňce); šipky na klávesnici fungují
      * @default 'default'
      */
     variant?: NumberInputVariant;
+    /**
+     * Roztáhne pole na celou šířku kontejneru.
+     * @default false
+     */
+    fullWidth?: boolean;
     /** Text zobrazený před hodnotou (např. měna). */
     prefix?: string;
     /** Text zobrazený za hodnotou (např. jednotka). */
     suffix?: string;
+    /**
+     * Voláno při potvrzení hodnoty — na blur a na Enter — jen pokud se hodnota
+     * od získání fokusu změnila.
+     */
+    onCommit?: (value: number | null) => void;
+    /** `id` nativního inputu. Automaticky generováno, pokud chybí. */
+    id?: string;
+    /** Atribut `name` nativního inputu. */
+    name?: string;
     /** Další inline styly pro obalový `<div>`. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída pro obalový `<div>`. */
     className?: string;
 }
-/**
- * Numerické vstupní pole s tlačítky +/− dle SM-UI design systému.
- *
- * Podržením tlačítka se hodnota plynule inkrementuje / dekrementuje.
- * Hodnota je automaticky omezena na rozsah `min`–`max`.
- *
- * @example
- * ```tsx
- * <NumberInput value={count} onChange={setCount} min={0} max={100} step={5} />
- * <NumberInput value={price} onChange={setPrice} prefix="$" suffix="USD" />
- * ```
- */
-declare const NumberInput: React.ForwardRefExoticComponent<NumberInputProps & React.RefAttributes<HTMLInputElement>>;
+interface NumberInputStrictProps extends NumberInputBaseProps {
+    /** Pole nemůže být prázdné (výchozí) — blur doplní poslední platnou hodnotu. */
+    allowEmpty?: false;
+    /** Aktuální numerická hodnota. */
+    value: number;
+    /** Callback volaný při změně hodnoty. */
+    onChange(value: number): void;
+}
+interface NumberInputEmptyProps extends NumberInputBaseProps {
+    /**
+     * Povolí prázdné pole ("není nastaveno"). Vymazání pole zavolá `onChange(null)`
+     * a blur prázdné pole nenahradí hodnotou `min`.
+     */
+    allowEmpty: true;
+    /** Aktuální numerická hodnota; `null` = prázdné pole. */
+    value: number | null;
+    /** Callback volaný při změně hodnoty; `null`, když uživatel pole vymaže. */
+    onChange(value: number | null): void;
+}
+type NumberInputProps = NumberInputStrictProps | NumberInputEmptyProps;
+declare const NumberInput: ((props: NumberInputProps & React__default.RefAttributes<HTMLInputElement>) => React__default.ReactElement | null) & {
+    displayName?: string;
+};
 
-interface SelectOption {
+type SelectSize = 'sm' | 'md' | 'lg';
+type SelectValue = string | number;
+interface SelectOption<V = string> {
     /** Unikátní hodnota položky. */
-    value: string;
+    value: V;
     /** Zobrazovaný popisek. Pokud chybí, použije se `value`. */
     label?: string;
     /** Při `true` nelze položku vybrat. */
     disabled?: boolean;
 }
-interface SelectProps {
-    /** Dostupné položky k výběru. */
-    options: SelectOption[];
-    /**
-     * Aktuální hodnota.
-     * - Jednoduchý výběr: `string | null`
-     * - Vícenásobný výběr: `string[]`
-     */
-    value?: string | string[] | null;
-    /**
-     * Voláno při změně výběru.
-     * - Jednoduchý výběr: `(value: string | null) => void`
-     * - Vícenásobný výběr: `(value: string[]) => void`
-     */
-    onChange?: (value: any) => void;
-    /** Umožní vybrat více položek najednou. @default false */
-    multiple?: boolean;
+/** Skupina položek (optgroup) — nadpis + vlastní položky. */
+interface SelectOptionGroup<V = string> {
+    /** Nadpis skupiny. */
+    label: string;
+    /** Položky skupiny. */
+    options: SelectOption<V>[];
+}
+type SelectOptions<V = string> = (SelectOption<V> | SelectOptionGroup<V>)[];
+interface SelectBaseProps<V> {
+    /** Dostupné položky k výběru. Položky lze seskupit: `{ label: 'Skupina', options: [...] }`. */
+    options: SelectOptions<V>;
     /** Zobrazí textové pole pro filtrování položek. @default false */
     searchable?: boolean;
-    /** Zobrazí tlačítko pro vymazání výběru. @default false */
-    clearable?: boolean;
     /** Zakáže celý select. @default false */
     disabled?: boolean;
     /**
@@ -377,7 +447,7 @@ interface SelectProps {
      * Async vyhledávání — když zadáno, filtrace nejede client-side.
      * Voláno s textem hledání, vrací Promise s novými options.
      */
-    onSearch?: (query: string) => Promise<SelectOption[]>;
+    onSearch?: (query: string) => Promise<SelectOption<V>[]>;
     /** Povolí uživateli vytvořit novou hodnotu. @default false */
     creatable?: boolean;
     /** Callback při vytvoření nové hodnoty. */
@@ -389,33 +459,77 @@ interface SelectProps {
      * @default 'inline'
      */
     chipDisplay?: 'inline' | 'count';
-    /** Vlastní renderování položky v seznamu. */
-    renderOption?: (option: SelectOption, selected: boolean) => React.ReactNode;
+    /** Vlastní renderování položky v seznamu (nahrazuje celý obsah řádku včetně fajfky). */
+    renderOption?: (option: SelectOption<V>, selected: boolean) => React__default.ReactNode;
     /** Vlastní renderování vybrané hodnoty v triggeru. */
-    renderValue?: (option: SelectOption) => React.ReactNode;
+    renderValue?: (option: SelectOption<V>) => React__default.ReactNode;
+    /** Voláno při otevření / zavření dropdownu. */
+    onOpenChange?: (open: boolean) => void;
     /**
      * Popisek zobrazený nad selectem.
      * Stylizován velkými písmeny dle SM-UI design systému.
      */
     label?: string;
+    /** Označí select jako povinný (hvězdička u popisku, stejně jako `Input`). */
+    required?: boolean;
     /** Zástupný text zobrazený při prázdném výběru. */
     placeholder?: string;
+    /**
+     * Velikostní preset (shodný s Input / DatePicker / Combobox).
+     * @default 'md'
+     */
+    size?: SelectSize;
     /** Maximální výška (px) rozbalovacího seznamu před scrollováním. @default 240 */
     maxDropdownHeight?: number;
+    /** `id` triggeru (pro `<label htmlFor>`). Automaticky generováno, pokud chybí. */
+    id?: string;
     /** Další inline styly pro kořenový obal. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída pro kořenový obal. */
     className?: string;
 }
+interface SelectSingleProps<V = string> extends SelectBaseProps<V> {
+    /** Jednoduchý výběr (výchozí). */
+    multiple?: false;
+    /** Bez tlačítka pro vymazání (výchozí). */
+    clearable?: false;
+    /** Aktuální hodnota. */
+    value?: NoInfer<V> | null;
+    /** Voláno při změně výběru. */
+    onChange?(value: NoInfer<V>): void;
+}
+interface SelectSingleClearableProps<V = string> extends SelectBaseProps<V> {
+    /** Jednoduchý výběr (výchozí). */
+    multiple?: false;
+    /** Zobrazí tlačítko pro vymazání výběru — `onChange` pak může dostat `null`. */
+    clearable: true;
+    /** Aktuální hodnota. */
+    value?: NoInfer<V> | null;
+    /** Voláno při změně výběru (`null` po vymazání). */
+    onChange?(value: NoInfer<V> | null): void;
+}
+interface SelectMultipleProps<V = string> extends SelectBaseProps<V> {
+    /** Umožní vybrat více položek najednou. */
+    multiple: true;
+    /** Zobrazí tlačítko pro vymazání výběru. @default false */
+    clearable?: boolean;
+    /** Aktuální hodnoty. */
+    value?: NoInfer<V>[] | null;
+    /** Voláno při změně výběru. */
+    onChange?(value: NoInfer<V>[]): void;
+}
+type SelectProps<V = string> = SelectSingleProps<V> | SelectSingleClearableProps<V> | SelectMultipleProps<V>;
 interface SelectGroupProps {
     /** Text popisku nad selectem, velkými písmeny dle SM-UI design systému. */
     label: string;
+    /** Označí skupinu jako povinnou (hvězdička u popisku). */
+    required?: boolean;
     /** `htmlFor` propojující `<label>` se selectem. Automaticky generováno, pokud chybí. */
     htmlFor?: string;
     /** Select element(y) vykreslené uvnitř skupiny. */
-    children?: React.ReactNode;
+    children?: React__default.ReactNode;
     /** Další inline styly pro obal. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída pro obal. */
     className?: string;
 }
@@ -423,10 +537,13 @@ interface SelectGroupProps {
  * Vlastní rozbalovací výběr dle SM-UI design systému.
  *
  * Podporuje jednoduchý / vícenásobný výběr, fulltextové vyhledávání,
- * vymazání hodnoty, chybový stav a tmavý / světlý režim přes `useTheme`.
+ * skupiny položek (optgroup), vymazání hodnoty, chybový stav a tmavý / světlý
+ * režim přes `useTheme`. Hodnoty mohou být `string` i `number`; typ `onChange`
+ * je odvozený z `multiple`.
  *
  * Dropdown se vykresluje přes React portál, takže ho neořízne
- * rodičovský kontejner s `overflow: hidden`.
+ * rodičovský kontejner s `overflow: hidden`. Funguje i uvnitř Popoveru / Sheetu.
+ * Forwarduje `ref` na trigger (`ref.current.focus()`).
  *
  * @example
  * ```tsx
@@ -439,18 +556,23 @@ interface SelectGroupProps {
  *   clearable
  * />
  *
- * // Vícenásobný výběr s vyhledáváním
+ * // Skupiny + číselné hodnoty
  * <Select
- *   options={tagy}
- *   value={vybraneTaxy}
- *   onChange={setVybraneTaxy}
- *   multiple
- *   searchable
- *   placeholder="Vyberte tagy…"
+ *   options={[
+ *     { label: 'Jaro', options: [{ value: 3, label: 'Březen' }, { value: 4, label: 'Duben' }] },
+ *     { label: 'Léto', options: [{ value: 6, label: 'Červen' }] },
+ *   ]}
+ *   value={mesic}
+ *   onChange={(v) => setMesic(v)}
  * />
+ *
+ * // Vícenásobný výběr s vyhledáváním
+ * <Select options={tagy} value={vybrane} onChange={setVybrane} multiple searchable />
  * ```
  */
-declare const Select: React.FC<SelectProps>;
+declare const Select: (<V = string>(props: SelectProps<V> & React__default.RefAttributes<HTMLDivElement>) => React__default.ReactElement | null) & {
+    displayName?: string;
+};
 /**
  * Obalí `<Select>` skupinou s popiskem, vizuálně odpovídá `InputGroup`.
  *
@@ -461,32 +583,37 @@ declare const Select: React.FC<SelectProps>;
  * </SelectGroup>
  * ```
  */
-declare const SelectGroup: React.FC<SelectGroupProps>;
+declare const SelectGroup: React__default.FC<SelectGroupProps>;
 
 type ComboboxSize = 'sm' | 'md' | 'lg';
-interface ComboboxOption {
+type ComboboxValue = string | number;
+interface ComboboxOption<V = string> {
     /** Unikátní hodnota položky. */
-    value: string;
+    value: V;
     /** Zobrazovaný popisek. Pokud chybí, použije se `value`. */
     label?: string;
+    /** Libovolná další pole pro `renderOption` / `filterOption`. */
+    [key: string]: unknown;
 }
-interface ComboboxProps {
+type ComboboxFilter<V = string> = (input: string, option: ComboboxOption<V>) => boolean;
+interface ComboboxBaseProps<V> {
     /** Dostupné položky k výběru. */
-    options: ComboboxOption[];
+    options: ComboboxOption<V>[];
     /**
-     * Aktuální vybraná hodnota.
-     * - Jednoduchý výběr: `string`
-     * - Vícenásobný výběr: `string[]`
+     * Callback volaný při každé změně textu v poli — jak od uživatele, tak když
+     * kit text sám resetuje (blur, outside-click, výběr). Vhodné pro asynchronní filtrování.
      */
-    value: string | string[];
+    onInputChange?: (input: string) => void;
     /**
-     * Callback volaný při výběru položky.
-     * - Jednoduchý výběr: `(value: string) => void`
-     * - Vícenásobný výběr: `(value: string[]) => void`
+     * Klientský filtr položek podle napsaného textu.
+     * - `true` — filtruje podle `label` (case-insensitive `includes`), výchozí
+     * - `false` — žádný klientský filtr (server-side search přes `onInputChange`)
+     * - funkce `(input, option) => boolean` — vlastní filtr
+     * Filtr se uplatní až po prvním reálném stisku klávesy od otevření;
+     * text vybrané položky předvyplněný v poli se za filtr nepovažuje.
+     * @default true
      */
-    onChange: (value: any) => void;
-    /** Callback volaný při změně textu ve vyhledávacím poli. Vhodné pro asynchronní filtrování. */
-    onInputChange?: (input: string) => void;
+    filterOption?: boolean | ComboboxFilter<V>;
     /** Zástupný text zobrazený při prázdném poli. */
     placeholder?: string;
     /** Popisek zobrazený nad polem. Stylizován velkými písmeny dle SM-UI design systému. */
@@ -495,62 +622,96 @@ interface ComboboxProps {
     error?: boolean | string;
     /** Zakáže celou komponentu. */
     disabled?: boolean;
-    /** Zobrazí spinner místo ikony vyhledávání. Vhodné při načítání položek. */
+    /** Zobrazí spinner místo ikony vyhledávání. Pole zůstává editovatelné. */
     loading?: boolean;
-    /** Umožní vybrat více položek najednou. @default false */
-    multiple?: boolean;
-    /** Zobrazí tlačítko pro vymazání výběru. @default false */
-    clearable?: boolean;
     /** Voláno při otevření/zavření dropdownu. */
     onOpenChange?: (open: boolean) => void;
     /** Voláno při výběru položky. */
-    onSelect?: (value: string, option: ComboboxOption) => void;
+    onSelect?: (value: V, option: ComboboxOption<V>) => void;
     /** Voláno při odebrání položky (multiple). */
-    onDeselect?: (value: string, option: ComboboxOption) => void;
+    onDeselect?: (value: V, option: ComboboxOption<V>) => void;
     /** Voláno při vymazání výběru (clearable). */
     onClear?: () => void;
     /** Voláno při focus. */
-    onFocus?: (event: React.FocusEvent) => void;
+    onFocus?: (event: React__default.FocusEvent) => void;
     /** Voláno při blur. */
-    onBlur?: (event: React.FocusEvent) => void;
+    onBlur?: (event: React__default.FocusEvent) => void;
     /** Povolí uživateli zadat vlastní hodnotu, která není v seznamu. @default false */
     allowCustom?: boolean;
     /** Callback volaný při vytvoření vlastní hodnoty (Enter při `allowCustom`). */
     onCreate?: (value: string) => void;
     /** Vlastní renderování položky v seznamu. */
-    renderOption?: (option: {
-        value: string;
-        label?: string;
-    }, highlighted: boolean) => React.ReactNode;
+    renderOption?: (option: ComboboxOption<V>, highlighted: boolean) => React__default.ReactNode;
     /**
      * Obsah zobrazený když žádné výsledky neodpovídají.
      * Může být ReactNode nebo funkce `(close: () => void) => ReactNode`
      * pro přístup k zavření dropdownu.
      * @default "Žádné výsledky"
      */
-    notFoundContent?: React.ReactNode | ((close: () => void) => React.ReactNode);
+    notFoundContent?: React__default.ReactNode | ((close: () => void) => React__default.ReactNode);
     /**
      * Obsah zobrazený pod seznamem položek uvnitř dropdownu.
      * Může být ReactNode nebo funkce `(close: () => void) => ReactNode`
      * pro přístup k zavření dropdownu.
      */
-    footer?: React.ReactNode | ((close: () => void) => React.ReactNode);
+    footer?: React__default.ReactNode | ((close: () => void) => React__default.ReactNode);
     /**
      * Velikostní preset.
      * @default 'md'
      */
     size?: ComboboxSize;
+    /**
+     * Roztáhne pole na celou šířku rodiče (kořen `display: flex; width: 100%`),
+     * stejně jako u `Input`. Rozbalený seznam má šířku pole.
+     * @default false
+     */
+    fullWidth?: boolean;
+    /** `id` nativního inputu. Automaticky generováno, pokud chybí. */
+    id?: string;
     /** Další inline styly pro obalový `<div>`. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída pro obalový `<div>`. */
     className?: string;
 }
+interface ComboboxSingleProps<V = string> extends ComboboxBaseProps<V> {
+    /** Jednoduchý výběr (výchozí). */
+    multiple?: false;
+    /** Bez tlačítka pro vymazání (výchozí). */
+    clearable?: false;
+    /** Aktuální vybraná hodnota. */
+    value: NoInfer<V> | null;
+    /** Callback volaný při výběru položky. */
+    onChange(value: NoInfer<V>): void;
+}
+interface ComboboxSingleClearableProps<V = string> extends ComboboxBaseProps<V> {
+    /** Jednoduchý výběr (výchozí). */
+    multiple?: false;
+    /** Zobrazí tlačítko pro vymazání výběru — `onChange` pak může dostat `null`. */
+    clearable: true;
+    /** Aktuální vybraná hodnota. */
+    value: NoInfer<V> | null;
+    /** Callback volaný při výběru položky (`null` po vymazání). */
+    onChange(value: NoInfer<V> | null): void;
+}
+interface ComboboxMultipleProps<V = string> extends ComboboxBaseProps<V> {
+    /** Umožní vybrat více položek najednou. */
+    multiple: true;
+    /** Zobrazí tlačítko pro vymazání výběru. @default false */
+    clearable?: boolean;
+    /** Aktuální vybrané hodnoty. */
+    value: NoInfer<V>[];
+    /** Callback volaný při změně výběru. */
+    onChange(value: NoInfer<V>[]): void;
+}
+type ComboboxProps<V = string> = ComboboxSingleProps<V> | ComboboxSingleClearableProps<V> | ComboboxMultipleProps<V>;
 /**
  * Kombinované vyhledávací pole se seznamem dle SM-UI design systému.
  *
  * Uživatel zadává text pro filtrování položek. Dropdown se vykresluje
  * přes React portál. Podporuje navigaci klávesami, vlastní hodnoty,
- * vícenásobný výběr a asynchronní filtrování přes `onInputChange`.
+ * vícenásobný výběr a asynchronní filtrování přes `onInputChange`
+ * (s `filterOption={false}` kit klientský filtr vypne). Hodnoty mohou být
+ * `string` i `number`; typ `onChange` je odvozený z `multiple`.
  *
  * @example
  * ```tsx
@@ -562,17 +723,16 @@ interface ComboboxProps {
  *   placeholder="Hledat zemi…"
  * />
  *
+ * // Server-side search bez klientského filtru
+ * <Combobox options={results} value={op} onChange={setOp} onInputChange={search} filterOption={false} loading={loading} />
+ *
  * // Vícenásobný výběr
- * <Combobox
- *   multiple
- *   options={options}
- *   value={selectedCountries}
- *   onChange={setSelectedCountries}
- *   placeholder="Vyberte země…"
- * />
+ * <Combobox multiple options={options} value={selected} onChange={setSelected} />
  * ```
  */
-declare const Combobox: React.ForwardRefExoticComponent<ComboboxProps & React.RefAttributes<HTMLInputElement>>;
+declare const Combobox: (<V = string>(props: ComboboxProps<V> & React__default.RefAttributes<HTMLInputElement>) => React__default.ReactElement | null) & {
+    displayName?: string;
+};
 
 type DatePickerSize = 'sm' | 'md' | 'lg';
 interface DatePickerProps {
@@ -588,6 +748,18 @@ interface DatePickerProps {
      * @default false
      */
     showTime?: boolean;
+    /**
+     * Řízené otevření kalendářového popoveru. Pokud je zadáno, komponenta je
+     * "controlled" — stav otevření řídí rodič a reaguje na `onOpenChange`.
+     */
+    open?: boolean;
+    /**
+     * Výchozí stav otevření pro neřízené (uncontrolled) použití.
+     * @default false
+     */
+    defaultOpen?: boolean;
+    /** Voláno při požadavku na otevření / zavření popoveru (`true` = otevřít). */
+    onOpenChange?: (open: boolean) => void;
     /**
      * Aktuální hodnota.
      * - `single` režim: `Date | null`
@@ -651,7 +823,7 @@ interface DatePickerProps {
      */
     firstDayOfWeek?: number;
     /** Další inline styly pro kořenový obal. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída pro kořenový obal. */
     className?: string;
 }
@@ -661,9 +833,9 @@ interface DatePickerGroupProps {
     /** `htmlFor` propojující `<label>` s DatePickerem. Automaticky generováno, pokud chybí. */
     htmlFor?: string;
     /** DatePicker element(y) vykreslené uvnitř skupiny. */
-    children?: React.ReactNode;
+    children?: React__default.ReactNode;
     /** Další inline styly pro obal. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída pro obal. */
     className?: string;
 }
@@ -696,7 +868,7 @@ interface DatePickerGroupProps {
  * />
  * ```
  */
-declare const DatePicker: React.FC<DatePickerProps>;
+declare const DatePicker: React__default.FC<DatePickerProps>;
 /**
  * Obalí `<DatePicker>` skupinou s popiskem, vizuálně odpovídá `InputGroup`.
  *
@@ -707,10 +879,10 @@ declare const DatePicker: React.FC<DatePickerProps>;
  * </DatePickerGroup>
  * ```
  */
-declare const DatePickerGroup: React.FC<DatePickerGroupProps>;
+declare const DatePickerGroup: React__default.FC<DatePickerGroupProps>;
 
 type CheckboxSize = 'sm' | 'md' | 'lg';
-interface CheckboxProps {
+interface CheckboxProps extends Omit<React__default.InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'size' | 'checked' | 'type' | 'style' | 'className'> {
     /** Stav zaškrtnutí. */
     checked?: boolean;
     /** Callback volaný při změně stavu. */
@@ -731,22 +903,32 @@ interface CheckboxProps {
     size?: CheckboxSize;
     /** Neurčitý stav — zobrazí pomlčku místo zaškrtnutí. */
     indeterminate?: boolean;
+    /**
+     * Blokové vykreslení (`display: flex; width: fit-content`): checkboxy pod sebou
+     * se neslévají do řádku ani bez obalu (`space-y-*`). Výchozí je inline.
+     * @default false
+     */
+    block?: boolean;
+    /** Přístupný název bez viditelného popisku. */
+    'aria-label'?: string;
+    /** ID prvku s přístupným názvem. */
+    'aria-labelledby'?: string;
     /** Dodatečná CSS třída pro obalový element. */
     className?: string;
     /** Další inline styly pro obalový element. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 interface CheckboxGroupProps {
     /** Popisek skupiny. */
     label?: string;
     /** Potomci — typicky komponenty `<Checkbox>`. */
-    children: React.ReactNode;
+    children: React__default.ReactNode;
     /** Chybový stav skupiny. Při řetězci se zobrazí chybová zpráva. */
     error?: boolean | string;
     /** Dodatečná CSS třída. */
     className?: string;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Zaškrtávací pole dle SM-UI design systému.
@@ -754,13 +936,16 @@ interface CheckboxGroupProps {
  * Podporuje vlastní SVG zaškrtnutí, neurčitý stav,
  * chybový stav, velikostní presety a tmavý / světlý režim.
  *
+ * Nativní atributy (`name`, `value`, `aria-label`, `data-*`…) se předávají na `<input>`.
+ *
  * @example
  * ```tsx
- * <Checkbox label="Souhlasím s podmínkami" checked={agreed} onChange={setAgreed} />
+ * <Checkbox label="Souhlasím s podmínkami" checked={agreed} onChange={setAgreed} name="agree" />
  * <Checkbox indeterminate label="Vybrat vše" />
+ * <Checkbox block label="Pod sebou bez obalu" />
  * ```
  */
-declare const Checkbox: React.FC<CheckboxProps>;
+declare const Checkbox: React__default.FC<CheckboxProps>;
 /**
  * Skupina zaškrtávacích polí s volitelným popiskem.
  *
@@ -772,10 +957,10 @@ declare const Checkbox: React.FC<CheckboxProps>;
  * </CheckboxGroup>
  * ```
  */
-declare const CheckboxGroup: React.FC<CheckboxGroupProps>;
+declare const CheckboxGroup: React__default.FC<CheckboxGroupProps>;
 
 type RadioSize = 'sm' | 'md' | 'lg';
-interface RadioProps {
+interface RadioProps extends Omit<React__default.InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'size' | 'checked' | 'type' | 'value' | 'style' | 'className'> {
     /** Hodnota tohoto přepínače. */
     value: string;
     /** Zda je tento přepínač vybrán. */
@@ -784,8 +969,12 @@ interface RadioProps {
     onChange?: (value: string) => void;
     /** Textový popisek. */
     label?: string;
+    /** Vysvětlivka zobrazená tlumeně pod popiskem. */
+    helperText?: string;
     /** Deaktivuje přepínač. */
     disabled?: boolean;
+    /** Atribut `name` — spojuje přepínače do skupiny (šipky, `FormData`). `RadioGroup` ho doplní sám. */
+    name?: string;
     /**
      * Velikostní preset.
      * @default 'md'
@@ -794,13 +983,15 @@ interface RadioProps {
     /** Dodatečná CSS třída. */
     className?: string;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 interface RadioGroupOption {
     /** Hodnota volby. */
     value: string;
     /** Zobrazený popisek. */
     label: string;
+    /** Vysvětlivka zobrazená tlumeně pod popiskem volby. */
+    helperText?: string;
     /** Deaktivuje tuto volbu. */
     disabled?: boolean;
 }
@@ -809,6 +1000,8 @@ interface RadioGroupProps {
     value?: string;
     /** Callback volaný při změně výběru. */
     onChange?: (value: string) => void;
+    /** Atribut `name` pro všechny přepínače ve skupině. Automaticky generováno, pokud chybí. */
+    name?: string;
     /** Popisek skupiny. */
     label?: string;
     /** Seznam voleb. */
@@ -832,7 +1025,7 @@ interface RadioGroupProps {
     /** Dodatečná CSS třída. */
     className?: string;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Přepínací tlačítko (radio) dle SM-UI design systému.
@@ -845,7 +1038,7 @@ interface RadioGroupProps {
  * <Radio value="a" label="Volba A" checked={selected === 'a'} onChange={setSelected} />
  * ```
  */
-declare const Radio: React.FC<RadioProps>;
+declare const Radio: React__default.FC<RadioProps>;
 /**
  * Skupina přepínačů s popiskem, chybovým stavem a nápovědným textem.
  *
@@ -857,15 +1050,15 @@ declare const Radio: React.FC<RadioProps>;
  *   onChange={setGender}
  *   options={[
  *     { value: 'male', label: 'Muž' },
- *     { value: 'female', label: 'Žena' },
+ *     { value: 'female', label: 'Žena', helperText: 'Vysvětlivka pod volbou' },
  *   ]}
  * />
  * ```
  */
-declare const RadioGroup: React.FC<RadioGroupProps>;
+declare const RadioGroup: React__default.FC<RadioGroupProps>;
 
 type SwitchSize = 'sm' | 'md' | 'lg';
-interface SwitchProps {
+interface SwitchProps extends Omit<React__default.InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'size' | 'checked' | 'type' | 'style' | 'className'> {
     /** Stav přepínače. */
     checked?: boolean;
     /** Callback volaný při změně stavu. */
@@ -879,10 +1072,14 @@ interface SwitchProps {
      * @default 'md'
      */
     size?: SwitchSize;
-    /** Dodatečná CSS třída. */
+    /** Přístupný název bez viditelného popisku (matice přepínačů apod.). */
+    'aria-label'?: string;
+    /** ID prvku s přístupným názvem. */
+    'aria-labelledby'?: string;
+    /** Dodatečná CSS třída pro obalový element. */
     className?: string;
-    /** Další inline styly. */
-    style?: React.CSSProperties;
+    /** Další inline styly pro obalový element. */
+    style?: React__default.CSSProperties;
 }
 /**
  * Přepínač (switch/toggle) dle SM-UI design systému.
@@ -890,16 +1087,33 @@ interface SwitchProps {
  * Pilulkový tvar s plynulou animací posunu.
  * Oranžový ve stavu zapnuto, jemný okraj ve stavu vypnuto.
  *
+ * Nativní atributy (`name`, `value`, `aria-label`, `data-*`…) se předávají na `<input>`.
+ *
  * @example
  * ```tsx
  * <Switch label="Noční režim" checked={dark} onChange={setDark} />
+ * <Switch aria-label="E-mail: nové úkoly" checked={on} onChange={setOn} name="email_tasks" />
  * ```
  */
-declare const Switch: React.FC<SwitchProps>;
+declare const Switch: React__default.FC<SwitchProps>;
 
 type TextareaSize = 'sm' | 'md' | 'lg';
 type TextareaResize = 'none' | 'vertical' | 'both';
-interface TextareaProps extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'size'> {
+type TextareaVariant = 'default' | 'inline';
+interface TextareaProps extends Omit<React__default.TextareaHTMLAttributes<HTMLTextAreaElement>, 'size'> {
+    /**
+     * Vizuální varianta.
+     * - `'default'` — pole s pozadím a rámečkem
+     * - `'inline'` — bez pozadí a rámečku v klidu (vypadá jako text), rámeček až na hover / focus.
+     *   Pro editaci přímo v buňce tabulky nebo kartě. Doporučeno s `autoHeight`.
+     * @default 'default'
+     */
+    variant?: TextareaVariant;
+    /**
+     * Voláno při potvrzení hodnoty — na blur a na Ctrl/Cmd+Enter — jen pokud se hodnota
+     * od získání fokusu změnila.
+     */
+    onCommit?: (value: string) => void;
     /**
      * Popisek zobrazený nad textovým polem.
      * Stylizován velkými písmeny dle SM-UI design systému.
@@ -967,7 +1181,7 @@ interface TextareaProps extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaEl
     /**
      * Další inline styly pro **obalový** element.
      */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Víceřádkové textové pole dle SM-UI design systému.
@@ -979,16 +1193,22 @@ interface TextareaProps extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaEl
  * ```tsx
  * <Textarea label="Poznámka" placeholder="Napište poznámku…" rows={5} />
  * <Textarea label="Bio" maxLength={200} helperText="Krátký popis" />
+ * <Textarea variant="inline" autoHeight value={note} onChange={...} onCommit={save} />
  * ```
  */
-declare const Textarea: React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;
+declare const Textarea: React__default.ForwardRefExoticComponent<TextareaProps & React__default.RefAttributes<HTMLTextAreaElement>>;
 
 type SliderSize = 'sm' | 'md' | 'lg';
 interface SliderProps {
     /** Aktuální hodnota. Při `range` je to `[number, number]`. */
     value: number | [number, number];
-    /** Callback volaný při změně hodnoty. */
+    /** Callback volaný při změně hodnoty (během tažení na každý krok). */
     onChange?: (value: number | [number, number]) => void;
+    /**
+     * Voláno jednou po dokončení tažení (uvolnění myši) s finální hodnotou.
+     * Vhodné pro uložení / request bez debounce.
+     */
+    onChangeEnd?: (value: number | [number, number]) => void;
     /**
      * Minimální hodnota.
      * @default 0
@@ -1026,7 +1246,7 @@ interface SliderProps {
     /** Dodatečná CSS třída. */
     className?: string;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Posuvník dle SM-UI design systému.
@@ -1038,9 +1258,10 @@ interface SliderProps {
  * ```tsx
  * <Slider label="Hlasitost" value={volume} onChange={setVolume} showValue />
  * <Slider range value={[20, 80]} onChange={setRange} label="Cenový rozsah" />
+ * <Slider value={density} onChange={setDensity} onChangeEnd={savePreference} />
  * ```
  */
-declare const Slider: React.FC<SliderProps>;
+declare const Slider: React__default.FC<SliderProps>;
 
 interface UploadedFile {
     /** Objekt nativního souboru. */
@@ -1049,6 +1270,7 @@ interface UploadedFile {
     id: string;
 }
 type FileUploadVariant = 'dropzone' | 'button';
+type FileRejectReason = 'size' | 'duplicate';
 interface FileUploadProps {
     /**
      * Vizuální varianta.
@@ -1059,6 +1281,14 @@ interface FileUploadProps {
     variant?: FileUploadVariant;
     /** Callback volaný při přidání souborů. Vrací pole nativních `File` objektů. */
     onFiles?: (files: File[]) => void;
+    /**
+     * Voláno pro soubory, které kit odmítl (nad `maxSize`, duplicita v `multiple`).
+     * Ostatní soubory z dávky se přijmou normálně.
+     */
+    onReject?: (rejected: {
+        file: File;
+        reason: FileRejectReason;
+    }[]) => void;
     /**
      * Povolené typy souborů (atribut `accept`).
      * @example 'image/*,.pdf'
@@ -1066,8 +1296,14 @@ interface FileUploadProps {
     accept?: string;
     /** Povolit výběr více souborů najednou. */
     multiple?: boolean;
-    /** Maximální velikost souboru v bajtech. */
+    /** Maximální velikost souboru v bajtech. Odmítne jen soubory nad limit, zbytek dávky projde. */
     maxSize?: number;
+    /**
+     * V režimu `multiple` přeskočit soubory, které už v seznamu jsou
+     * (shoda `name` + `size` + `lastModified`).
+     * @default true
+     */
+    dedupe?: boolean;
     /** Deaktivuje zónu pro nahrávání. */
     disabled?: boolean;
     /** Popisek nad zónou. */
@@ -1104,7 +1340,7 @@ interface FileUploadProps {
     /** Dodatečná CSS třída. */
     className?: string;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Zóna pro nahrávání souborů dle SM-UI design systému.
@@ -1123,7 +1359,7 @@ interface FileUploadProps {
  * />
  * ```
  */
-declare const FileUpload: React.FC<FileUploadProps>;
+declare const FileUpload: React__default.FC<FileUploadProps>;
 
 type SegmentedControlSize = 'sm' | 'md' | 'lg';
 interface SegmentedControlItem {
@@ -1132,7 +1368,7 @@ interface SegmentedControlItem {
     /** Zobrazovaný text. Výchozí: `value`. */
     label?: string;
     /** Ikona zobrazená v segmentu. Může být samostatně nebo s label. */
-    icon?: React.ReactNode;
+    icon?: React__default.ReactNode;
     /** Zakáže tento segment. */
     disabled?: boolean;
 }
@@ -1169,7 +1405,7 @@ interface SegmentedControlProps {
     /** Dodatečná CSS třída. */
     className?: string;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Segmentovaný přepínač dle SM-UI design systému.
@@ -1188,7 +1424,7 @@ interface SegmentedControlProps {
  * />
  * ```
  */
-declare const SegmentedControl: React.FC<SegmentedControlProps>;
+declare const SegmentedControl: React__default.FC<SegmentedControlProps>;
 
 interface ColorPickerProps {
     /** Aktuální barva v hexadecimálním formátu (např. `#FC4F00`). */
@@ -1202,7 +1438,7 @@ interface ColorPickerProps {
     /** Zakáže celou komponentu. */
     disabled?: boolean;
     /** Další inline styly pro obalový `<div>`. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída pro obalový `<div>`. */
     className?: string;
 }
@@ -1218,7 +1454,7 @@ interface ColorPickerProps {
  * <ColorPicker value={color} onChange={setColor} presets={['#FF0000', '#00FF00', '#0000FF']} />
  * ```
  */
-declare const ColorPicker: React.FC<ColorPickerProps>;
+declare const ColorPicker: React__default.FC<ColorPickerProps>;
 
 type RatingSize = 'sm' | 'md' | 'lg';
 interface RatingProps {
@@ -1238,7 +1474,7 @@ interface RatingProps {
     /** Popisek zobrazený nad komponentou. Stylizován velkými písmeny dle SM-UI design systému. */
     label?: string;
     /** Další inline styly pro obalový `<div>`. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída pro obalový `<div>`. */
     className?: string;
 }
@@ -1255,7 +1491,7 @@ interface RatingProps {
  * <Rating value={4} size="lg" label="Hodnocení" />
  * ```
  */
-declare const Rating: React.FC<RatingProps>;
+declare const Rating: React__default.FC<RatingProps>;
 
 interface OTPInputProps {
     /** Počet polí (číslic). @default 6 */
@@ -1275,9 +1511,9 @@ interface OTPInputProps {
     /** Vloží oddělovač po každých N polích. Např. `separatorAfter={3}` u 6místného kódu vytvoří skupiny 3-3. */
     separatorAfter?: number;
     /** Obsah oddělovače. @default '-' */
-    separator?: React.ReactNode;
+    separator?: React__default.ReactNode;
     /** Další inline styly pro obalový `<div>`. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída pro obalový `<div>`. */
     className?: string;
 }
@@ -1294,7 +1530,7 @@ interface OTPInputProps {
  * <OTPInput value={otp} onChange={setOtp} length={4} error="Neplatný kód" />
  * ```
  */
-declare const OTPInput: React.FC<OTPInputProps>;
+declare const OTPInput: React__default.FC<OTPInputProps>;
 
 interface Country {
     /** ISO 3166-1 alpha-2 kód. */
@@ -1329,7 +1565,7 @@ interface PhoneInputProps {
     /** Placeholder pro číslo. */
     placeholder?: string;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -1349,7 +1585,7 @@ interface PhoneInputProps {
  * />
  * ```
  */
-declare const PhoneInput: React.FC<PhoneInputProps>;
+declare const PhoneInput: React__default.FC<PhoneInputProps>;
 
 type CropShape = 'rect' | 'circle';
 interface CropArea {
@@ -1374,7 +1610,7 @@ interface ImageCropperProps {
     /** Tvar ořezu. @default 'rect' */
     shape?: CropShape;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -1395,7 +1631,7 @@ interface ImageCropperProps {
  * />
  * ```
  */
-declare const ImageCropper: React.FC<ImageCropperProps>;
+declare const ImageCropper: React__default.FC<ImageCropperProps>;
 
 interface TableColumn {
     /** Klíč odpovídající hodnotě v datovém objektu. */
@@ -1407,7 +1643,7 @@ interface TableColumn {
     /** Šířka sloupce (CSS hodnota). */
     width?: string | number;
     /** Vlastní vykreslovací funkce pro buňku. */
-    render?: (value: any, row: any, index: number) => React.ReactNode;
+    render?: (value: any, row: any, index: number) => React__default.ReactNode;
 }
 interface TableProps {
     /** Definice sloupců tabulky. */
@@ -1431,11 +1667,17 @@ interface TableProps {
     /** Callback při kliknutí na řádek. */
     onRowClick?: (row: any, index: number) => void;
     /** Render akčních tlačítek v posledním sloupci. */
-    rowActions?: (row: any) => React.ReactNode;
+    rowActions?: (row: any) => React__default.ReactNode;
+    /**
+     * Rámeček, zaoblení a pozadí tabulky. `false` = bez rámu a s průhledným
+     * pozadím, vhodné do `Card` (jinak se rám i pozadí zdvojí).
+     * @default true
+     */
+    bordered?: boolean;
     /** Dodatečná CSS třída. */
     className?: string;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Datová tabulka dle SM-UI design systému.
@@ -1458,7 +1700,7 @@ interface TableProps {
  * />
  * ```
  */
-declare const Table: React.FC<TableProps>;
+declare const Table: React__default.FC<TableProps>;
 
 /** Definice sloupce pro DataGrid. */
 interface DataGridColumn {
@@ -1477,7 +1719,7 @@ interface DataGridColumn {
     /** Povolí editaci buňky (placeholder pro budoucí implementaci). @default false */
     editable?: boolean;
     /** Vlastní vykreslovací funkce pro buňku. */
-    render?: (value: any, row: any, index: number) => React.ReactNode;
+    render?: (value: any, row: any, index: number) => React__default.ReactNode;
 }
 interface DataGridProps {
     /** Definice sloupců. */
@@ -1498,8 +1740,14 @@ interface DataGridProps {
     stickyHeader?: boolean;
     /** Text zobrazený při prázdných datech. @default 'Žádná data' */
     emptyText?: string;
+    /**
+     * Rámeček, zaoblení a pozadí mřížky. `false` = bez rámu a s průhledným
+     * pozadím, vhodné do `Card`.
+     * @default true
+     */
+    bordered?: boolean;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -1525,7 +1773,7 @@ interface DataGridProps {
  * />
  * ```
  */
-declare const DataGrid: React.FC<DataGridProps>;
+declare const DataGrid: React__default.FC<DataGridProps>;
 
 interface MobileDataCardColumn {
     /** Klíč dat v řádkovém objektu. */
@@ -1533,7 +1781,7 @@ interface MobileDataCardColumn {
     /** Zobrazovaný popisek. */
     header: string;
     /** Vlastní renderování hodnoty — stejný podpis jako Table/DataGrid. */
-    render?: (value: any, row: any, index: number) => React.ReactNode;
+    render?: (value: any, row: any, index: number) => React__default.ReactNode;
     /** Skrýt tento sloupec z karty. */
     hidden?: boolean;
     /** Zobrazit toto pole jako titulek karty. */
@@ -1571,13 +1819,13 @@ interface MobileDataCardProps {
     /** Text prázdného stavu. @default 'Žádná data' */
     emptyText?: string;
     /** Vlastní obsah prázdného stavu. */
-    emptyContent?: React.ReactNode;
+    emptyContent?: React__default.ReactNode;
     /** Mezera mezi kartami v px. @default 12 */
     gap?: number;
     /** Vykreslení akčních tlačítek v patičce karty. */
-    cardActions?: (row: any, index: number) => React.ReactNode;
+    cardActions?: (row: any, index: number) => React__default.ReactNode;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -1608,32 +1856,42 @@ interface MobileDataCardProps {
  * />
  * ```
  */
-declare const MobileDataCard: React.FC<MobileDataCardProps>;
+declare const MobileDataCard: React__default.FC<MobileDataCardProps>;
 
-interface CardProps {
+interface CardProps extends Omit<React__default.HTMLAttributes<HTMLDivElement>, 'title' | 'style' | 'className'> {
     /** Titulek karty. */
-    title?: string;
+    title?: React__default.ReactNode;
     /** Podtitulek karty. */
-    subtitle?: string;
-    /** Vlastní obsah záhlaví — přepíše `title` a `subtitle`. */
-    header?: React.ReactNode;
+    subtitle?: React__default.ReactNode;
+    /**
+     * Akce vpravo v záhlaví vedle titulku (odkaz, tlačítko, badge).
+     * Zachová typografii titulku a odsazení záhlaví.
+     */
+    headerActions?: React__default.ReactNode;
+    /**
+     * Vlastní obsah celého záhlaví — nahrazuje `title`, `subtitle` i `headerActions`
+     * a vykreslí se bez odsazení (odsazení dodává konzument).
+     * Pro titulek + akci použijte raději `headerActions`.
+     */
+    header?: React__default.ReactNode;
     /** Obsah patičky karty. */
-    footer?: React.ReactNode;
+    footer?: React__default.ReactNode;
     /** Obsah karty. */
-    children?: React.ReactNode;
+    children?: React__default.ReactNode;
     /** Při `true` se karta jemně zvedne při najetí myší. @default false */
     hoverable?: boolean;
     /** Zobrazí rámeček kolem karty. @default true */
     bordered?: boolean;
     /**
-     * Velikost vnitřního odsazení.
+     * Velikost vnitřního odsazení **těla a patičky**. Záhlaví (`title`) má vlastní
+     * odsazení: při `'none'` zůstává `md` (20px), aby se titulek nepřilepil k okraji.
      * @default 'md'
      */
     padding?: 'none' | 'sm' | 'md' | 'lg';
     /** Dodatečná CSS třída. */
     className?: string;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Karta dle SM-UI design systému.
@@ -1646,15 +1904,29 @@ interface CardProps {
  * <Card title="Statistiky" subtitle="Přehled za poslední měsíc">
  *   <p>Obsah karty…</p>
  * </Card>
+ *
+ * // Titulek + akce vpravo, tabulka bez odsazení
+ * <Card title="Poslední změny" headerActions={<Link href="/log">Vše</Link>} padding="none">
+ *   <Table bordered={false} … />
+ * </Card>
  * ```
  */
-declare const Card: React.FC<CardProps>;
+declare const Card: React__default.FC<CardProps>;
 
 interface AccordionItemProps {
-    /** Titulek položky. */
-    title: string;
+    /** Titulek položky (text nebo ReactNode, např. s Badge). */
+    title: React__default.ReactNode;
     /** Obsah zobrazený po rozbalení. */
-    children: React.ReactNode;
+    children: React__default.ReactNode;
+    /**
+     * Identifikátor položky pro řízený `Accordion` (`value` / `onChange`).
+     * Bez `id` se použije index položky jako string.
+     */
+    id?: string;
+    /** Ikona vlevo před titulkem. */
+    icon?: React__default.ReactNode;
+    /** Obsah vpravo v hlavičce (badge, počet, akce) — mimo klikací plochu chevronu. */
+    extra?: React__default.ReactNode;
     /** Při `true` bude položka výchozně rozbalena. @default false */
     defaultOpen?: boolean;
     /** Zakáže interakci s položkou. @default false */
@@ -1664,25 +1936,31 @@ interface AccordionProps {
     /**
      * Potomci — typicky komponenty `<AccordionItem>`.
      */
-    children: React.ReactNode;
+    children: React__default.ReactNode;
     /** Povolí více současně otevřených položek. @default false */
     multiple?: boolean;
+    /** Řízený seznam otevřených položek (`id` položek). */
+    value?: string[];
+    /** Výchozí otevřené položky pro neřízený režim (doplňuje `defaultOpen` na položkách). */
+    defaultValue?: string[];
+    /** Voláno při změně otevřených položek. */
+    onChange?: (open: string[]) => void;
     /** Dodatečná CSS třída. */
     className?: string;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Položka akordéonu. Používejte uvnitř `<Accordion>`.
  *
  * @example
  * ```tsx
- * <AccordionItem title="Sekce 1">
+ * <AccordionItem title="Sekce 1" extra={<Badge label="8 kroků" size="sm" variant="neutral" />}>
  *   Obsah první sekce.
  * </AccordionItem>
  * ```
  */
-declare const AccordionItem: React.FC<AccordionItemProps & {
+declare const AccordionItem: React__default.FC<AccordionItemProps & {
     /** @internal Řízeno rodičem Accordion. */
     _controlled?: boolean;
     /** @internal */
@@ -1696,16 +1974,23 @@ declare const AccordionItem: React.FC<AccordionItemProps & {
  * Obalí skupinu `<AccordionItem>` a řídí jejich otevírání.
  * Ve výchozím stavu se otevře vždy pouze jedna položka najednou.
  * Pro více současně otevřených položek nastavte `multiple`.
+ * Otevřené položky lze řídit přes `value` / `onChange` (podle `id` položek).
  *
  * @example
  * ```tsx
  * <Accordion>
  *   <AccordionItem title="Sekce 1">Obsah 1</AccordionItem>
- *   <AccordionItem title="Sekce 2">Obsah 2</AccordionItem>
+ *   <AccordionItem title="Sekce 2" defaultOpen>Obsah 2</AccordionItem>
+ * </Accordion>
+ *
+ * // Řízený
+ * <Accordion multiple value={open} onChange={setOpen}>
+ *   <AccordionItem id="a" title="A">…</AccordionItem>
+ *   <AccordionItem id="b" title="B">…</AccordionItem>
  * </Accordion>
  * ```
  */
-declare const Accordion: React.FC<AccordionProps>;
+declare const Accordion: React__default.FC<AccordionProps>;
 
 interface TabsProps {
     /** Aktuální aktivní hodnota. */
@@ -1713,7 +1998,7 @@ interface TabsProps {
     /** Voláno při změně aktivní záložky. */
     onChange: (value: string) => void;
     /** Potomci — komponenty `<Tab>` a `<TabPanel>`. */
-    children: React.ReactNode;
+    children: React__default.ReactNode;
     /**
      * Vizuální varianta.
      * - `'underline'` — spodní linka na aktivní záložce
@@ -1731,7 +2016,7 @@ interface TabsProps {
     /** Dodatečná CSS třída. */
     className?: string;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 interface TabProps {
     /** Unikátní hodnota záložky. */
@@ -1741,13 +2026,13 @@ interface TabProps {
     /** Zakáže záložku. @default false */
     disabled?: boolean;
     /** Ikona zobrazená před textem. */
-    icon?: React.ReactNode;
+    icon?: React__default.ReactNode;
 }
 interface TabPanelProps {
     /** Hodnota odpovídající záložce — panel se zobrazí, když je aktivní. */
     value: string;
     /** Obsah panelu. */
-    children: React.ReactNode;
+    children: React__default.ReactNode;
 }
 /**
  * Záložka uvnitř `<Tabs>`. Definuje jednu záložku v navigaci.
@@ -1757,7 +2042,7 @@ interface TabPanelProps {
  * <Tab value="general" label="Obecné" />
  * ```
  */
-declare const Tab: React.FC<TabProps>;
+declare const Tab: React__default.FC<TabProps>;
 /**
  * Panel obsahu spojený s konkrétní záložkou.
  *
@@ -1768,7 +2053,7 @@ declare const Tab: React.FC<TabProps>;
  * </TabPanel>
  * ```
  */
-declare const TabPanel: React.FC<TabPanelProps>;
+declare const TabPanel: React__default.FC<TabPanelProps>;
 /**
  * Záložkový komponent dle SM-UI design systému.
  *
@@ -1785,13 +2070,17 @@ declare const TabPanel: React.FC<TabPanelProps>;
  * </Tabs>
  * ```
  */
-declare const Tabs: React.FC<TabsProps>;
+declare const Tabs: React__default.FC<TabsProps>;
 
 interface TooltipProps {
-    /** Obsah tooltipu — text nebo ReactNode. */
-    content: string | React.ReactNode;
+    /**
+     * Obsah tooltipu — text nebo ReactNode.
+     * Při `undefined` / `null` / `''` / `false` se bublina nezobrazí vůbec
+     * (podmíněná nápověda bez nutnosti podmíněně obalovat).
+     */
+    content?: string | React__default.ReactNode;
     /** Trigger element obalený tooltipem. */
-    children: React.ReactElement;
+    children: React__default.ReactElement;
     /**
      * Pozice tooltipu vůči triggeru.
      * @default 'top'
@@ -1831,7 +2120,7 @@ interface TooltipProps {
     /** Dodatečná CSS třída pro tooltip. */
     className?: string;
     /** Další inline styly pro tooltip. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Tooltip dle SM-UI design systému.
@@ -1852,43 +2141,89 @@ interface TooltipProps {
  * </Tooltip>
  * ```
  */
-declare const Tooltip: React.FC<TooltipProps>;
+declare const Tooltip: React__default.FC<TooltipProps>;
 
+type PopoverPosition = 'top' | 'bottom' | 'left' | 'right';
+type PopoverAlign = 'start' | 'center' | 'end';
 interface PopoverProps {
-    /** Obsah popoveru. */
-    content: React.ReactNode;
+    /**
+     * Obsah popoveru. Může být ReactNode nebo funkce `(close) => ReactNode`
+     * pro zavření z obsahu (např. po výběru položky).
+     */
+    content: React__default.ReactNode | ((close: () => void) => React__default.ReactNode);
     /** Trigger element. */
-    children: React.ReactElement;
+    children: React__default.ReactElement;
     /**
      * Pozice popoveru vůči triggeru.
      * @default 'bottom'
      */
-    position?: 'top' | 'bottom' | 'left' | 'right';
+    position?: PopoverPosition;
+    /**
+     * Zarovnání panelu podél osy triggeru (u `top` / `bottom` vodorovně,
+     * u `left` / `right` svisle).
+     * @default 'center'
+     */
+    align?: PopoverAlign;
+    /**
+     * Mezera mezi triggerem a panelem v px.
+     * @default 8
+     */
+    offset?: number;
+    /**
+     * Když se panel na zvolené straně nevejde, otočí se na protilehlou.
+     * Panel se navíc vždy posune tak, aby zůstal celý ve viewportu.
+     * @default true
+     */
+    autoFlip?: boolean;
     /**
      * Způsob otevření.
      * @default 'click'
      */
     trigger?: 'click' | 'hover';
+    /** Řízený stav otevření. Když zadáno, kit stav sám nemění a volá jen `onOpenChange`. */
+    open?: boolean;
+    /** Výchozí stav pro neřízený režim. @default false */
+    defaultOpen?: boolean;
+    /** Voláno při požadavku na otevření / zavření (klik, outside-click, Escape, hover). */
+    onOpenChange?: (open: boolean) => void;
+    /**
+     * Klik kamkoli do obsahu popover zavře. Pro menu-like obsah.
+     * @default false
+     */
+    closeOnClickInside?: boolean;
+    /**
+     * Vypne výchozí vnitřní padding panelu (16px). Pro obsah s vlastním layoutem.
+     * @default false
+     */
+    disablePadding?: boolean;
+    /** Vlastní padding panelu (číslo = px). Přepíše výchozích 16px. */
+    padding?: number | string;
     /** Dodatečná CSS třída pro popover. */
     className?: string;
     /** Další inline styly pro popover. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Popover dle SM-UI design systému.
  *
  * Podobný Tooltipu, ale větší, s kartovým stylem.
  * Otevírá se kliknutím nebo hoverem, zavírá kliknutím mimo nebo Escape.
- * Vykresluje se přes React portál.
+ * Vykresluje se přes React portál. Panel nikdy neopustí viewport —
+ * když se na zvolené straně nevejde, otočí se (`autoFlip`) a posune.
  *
  * @example
  * ```tsx
  * <Popover content={<div>Obsah popoveru</div>} trigger="click">
  *   <button>Klikni</button>
  * </Popover>
+ *
+ * // Řízený + zavření z obsahu
+ * <Popover open={open} onOpenChange={setOpen} content={(close) => <Menu onPick={close} />}>
+ *   <Button>Vybrat</Button>
+ * </Popover>
  * ```
  */
-declare const Popover: React.FC<PopoverProps>;
+declare const Popover: React__default.FC<PopoverProps>;
 
 interface SkeletonProps {
     /**
@@ -1910,7 +2245,7 @@ interface SkeletonProps {
     /** Dodatečná CSS třída. */
     className?: string;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Zástupný prvek zobrazený při načítání obsahu.
@@ -1925,18 +2260,18 @@ interface SkeletonProps {
  * <Skeleton variant="rect" width="100%" height={200} />
  * ```
  */
-declare const Skeleton: React.FC<SkeletonProps>;
+declare const Skeleton: React__default.FC<SkeletonProps>;
 
 type EmptyStatePreset = 'no-data' | 'no-results' | 'no-permission' | 'error' | 'coming-soon';
 interface EmptyStateProps {
-    /** Ikona zobrazená nad titulkem. */
-    icon?: React.ReactNode;
+    /** Ikona zobrazená nad titulkem. Phosphor ikona bez `size` se škáluje podle `size` komponenty. */
+    icon?: React__default.ReactNode;
     /** Hlavní titulek prázdného stavu. */
     title?: string;
     /** Doplňkový popis. */
     description?: string;
     /** Akční prvky — typicky tlačítka. */
-    action?: React.ReactNode;
+    action?: React__default.ReactNode;
     /**
      * Přednastavený prázdný stav s ikonou, titulkem a popisem.
      * Vlastní `icon`, `title`, `description` přepíší preset hodnoty.
@@ -1947,7 +2282,7 @@ interface EmptyStateProps {
     /** Dodatečná CSS třída. */
     className?: string;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Prázdný stav dle SM-UI design systému.
@@ -1970,19 +2305,19 @@ interface EmptyStateProps {
  * />
  * ```
  */
-declare const EmptyState: React.FC<EmptyStateProps>;
+declare const EmptyState: React__default.FC<EmptyStateProps>;
 
 interface StatProps {
     /** Popisek statistiky. */
     label: string;
     /** Hodnota statistiky. */
-    value?: string | number | React.ReactNode;
+    value?: string | number | React__default.ReactNode;
     /** Procentuální změna (zobrazí se se znaménkem). */
     change?: number;
     /** Doplňkový text k procentuální změně. */
     changeLabel?: string;
     /** Ikona zobrazená vedle hodnoty. */
-    icon?: React.ReactNode;
+    icon?: React__default.ReactNode;
     /** Směr trendu. @default 'neutral' */
     trend?: 'up' | 'down' | 'neutral';
     /** Skeleton stav. @default false */
@@ -1990,11 +2325,11 @@ interface StatProps {
     /** Klikatelná karta s hover efektem. */
     onClick?: () => void;
     /** Sekundární text pod hodnotou. */
-    helper?: string | React.ReactNode;
+    helper?: string | React__default.ReactNode;
     /** Dodatečná CSS třída. */
     className?: string;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Statistický ukazatel dle SM-UI design systému.
@@ -2008,15 +2343,21 @@ interface StatProps {
  * <Stat label="Aktivní" value={loading ? undefined : 127} loading={loading} onClick={() => navigate('/tasks')} helper="z toho 12 po termínu" />
  * ```
  */
-declare const Stat: React.FC<StatProps>;
+declare const Stat: React__default.FC<StatProps>;
 
 type AvatarSize = '2xs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | number;
 interface AvatarProps {
     /**
      * Iniciály zobrazené uvnitř avataru (např. `"DC"`, `"JN"`).
      * Automaticky převedeny na velká písmena.
+     * Použijí se i jako fallback, když `src` chybí nebo se obrázek nenačte.
      */
     initials: string;
+    /**
+     * URL obrázku. Pokud je zadán a načte se, vykreslí se místo iniciál.
+     * Při chybě načtení (`onError`) avatar automaticky spadne zpět na iniciály.
+     */
+    src?: string;
     /**
      * Velikost avataru.
      * - `'2xs'` — 16 px
@@ -2033,33 +2374,37 @@ interface AvatarProps {
      * Zaoblení rohů kontejneru avataru.
      * @default '8px'
      */
-    borderRadius?: React.CSSProperties['borderRadius'];
+    borderRadius?: React__default.CSSProperties['borderRadius'];
     /**
      * Přístupný popisek čtený čtečkami obrazovky.
      * Pokud není zadán, použije se `"Avatar {initials}"`.
      */
     'aria-label'?: string;
     /** Další inline styly pro kořenový element. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída pro kořenový element. */
     className?: string;
 }
 /**
- * Kruhový / čtvercový avatar zobrazující iniciály uživatele
- * na oranžovém gradientním pozadí.
+ * Kruhový / čtvercový avatar. Zobrazuje obrázek (`src`), nebo iniciály uživatele
+ * na oranžovém gradientním pozadí. Při selhání načtení obrázku automaticky
+ * spadne zpět na iniciály.
+ *
+ * Předává `ref` na kořenový element, takže ho lze přímo použít jako trigger
+ * pro `Tooltip` / `Popover` bez obalování do `<span>`.
  *
  * @example
  * ```tsx
  * <Avatar initials="DC" />
- * <Avatar initials="JN" size="lg" />
+ * <Avatar initials="JN" size="lg" src="/uploads/jana.jpg" />
  * <Avatar initials="AB" size={56} borderRadius="50%" />
  * ```
  */
-declare const Avatar: React.FC<AvatarProps>;
+declare const Avatar: React__default.ForwardRefExoticComponent<AvatarProps & React__default.RefAttributes<HTMLDivElement>>;
 
 interface AvatarStackProps {
     /** Avatar elementy. Každý dostane forced consistent size a circular shape. */
-    children: React.ReactNode;
+    children: React__default.ReactNode;
     /** Max viditelných avatarů. Ostatní se sbalí do „+N" badge. @default 3 */
     max?: number;
     /** Forced size pro všechny avatary uvnitř. @default 'sm' */
@@ -2071,7 +2416,7 @@ interface AvatarStackProps {
     /** Tooltip nad „+N" badge. String nebo funkce (hiddenCount) => string. */
     overflowTooltip?: string | ((hiddenCount: number) => string);
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -2091,7 +2436,7 @@ interface AvatarStackProps {
  * </AvatarStack>
  * ```
  */
-declare const AvatarStack: React.FC<AvatarStackProps>;
+declare const AvatarStack: React__default.FC<AvatarStackProps>;
 
 interface TagProps {
     /**
@@ -2104,18 +2449,57 @@ interface TagProps {
      */
     onRemove?: () => void;
     /** Další inline styly pro kořenový element. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída pro kořenový element. */
     className?: string;
 }
-interface BadgeProps {
+type BadgeVariant = 'default' | 'brand' | 'neutral' | 'success' | 'info' | 'warning' | 'danger';
+type BadgeSize = 'sm' | 'md';
+/** Barva s protějškem pro tmavý režim. */
+interface ThemedColor {
+    light: string;
+    dark: string;
+}
+interface BadgeProps extends Omit<React__default.HTMLAttributes<HTMLDivElement>, 'color' | 'style' | 'className'> {
     /**
      * Text zobrazený uvnitř badge.
-     * Automaticky převeden na velká písmena dle SM-UI design systému.
+     * Ve výchozím stavu převeden na velká písmena dle SM-UI design systému (viz `uppercase`).
      */
     label: string;
+    /**
+     * Sémantická barevná varianta.
+     * - `'brand'` — oranžová (brand); pro zvýraznění, ne pro stav
+     * - `'default'` — alias pro `'brand'` (zachováno kvůli kompatibilitě), výchozí
+     * - `'neutral'` — tlumená šedá pro tiché stavy („interní", „archiv", „brzy")
+     * - `'success'` — zelená (#00A205)
+     * - `'info'` — modrá
+     * - `'warning'` — žlutá / amber
+     * - `'danger'` — červená (#EF3838)
+     * @default 'default'
+     */
+    variant?: BadgeVariant;
+    /**
+     * Vlastní barva pozadí — přepíše `variant`. Řetězec (i CSS proměnná)
+     * nebo dvojice `{ light, dark }` pro oba motivy.
+     */
+    color?: string | ThemedColor;
+    /** Vlastní barva textu (řetězec nebo `{ light, dark }`). Výchozí podle varianty. */
+    textColor?: string | ThemedColor;
+    /** Ikona vlevo před textem (Phosphor, 10–12px). */
+    icon?: React__default.ReactNode;
+    /** Barevná tečka před textem (barva textu badge). @default false */
+    dot?: boolean;
+    /**
+     * Velikost.
+     * - `'md'` — výchozí (10px písmo, padding 2px 16px)
+     * - `'sm'` — kompaktní do hustých tabulek (9px písmo, padding 1px 8px)
+     * @default 'md'
+     */
+    size?: BadgeSize;
+    /** Převádět text na verzálky. @default true */
+    uppercase?: boolean;
     /** Další inline styly pro kořenový element. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída pro kořenový element. */
     className?: string;
 }
@@ -2146,7 +2530,7 @@ interface TagItemProps {
      */
     showActions?: boolean;
     /** Další inline styly pro kořenový element. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída pro kořenový element. */
     className?: string;
 }
@@ -2160,18 +2544,25 @@ interface TagItemProps {
  * <Tag label="TypeScript" onRemove={() => removeTag('ts')} />
  * ```
  */
-declare const Tag: React.FC<TagProps>;
+declare const Tag: React__default.FC<TagProps>;
 /**
- * Malý stavový badge vykreslený jako oranžová pilulka.
- * Text je automaticky převeden na velká písmena.
+ * Malý stavový badge vykreslený jako barevná pilulka.
+ * Text je ve výchozím stavu převeden na velká písmena.
+ *
+ * Bez `variant` je oranžový (brand, alias `default`). Pro tiché stavy použijte
+ * `variant="neutral"`; sémantické varianty nesou stavovou barvu. Stav nikdy
+ * nekódujte jen barvou — přidejte `icon` nebo `dot`.
  *
  * @example
  * ```tsx
  * <Badge label="Novinka" />
- * <Badge label="Beta" />
+ * <Badge label="Interní" variant="neutral" />
+ * <Badge label="Schváleno" variant="success" icon={<CheckIcon size={10} />} />
+ * <Badge label="Zamítnuto" variant="danger" size="sm" />
+ * <Badge label="Vlastní" color={{ light: '#DDF3E1', dark: '#1E7A2A66' }} textColor={{ light: '#1a1a1a', dark: '#ffffff' }} uppercase={false} />
  * ```
  */
-declare const Badge: React.FC<BadgeProps>;
+declare const Badge: React__default.FC<BadgeProps>;
 /**
  * Řádek seznamu zobrazující pojmenovaný tag s volitelnými akčními tlačítky
  * (filtrování, úprava, smazání).
@@ -2185,7 +2576,7 @@ declare const Badge: React.FC<BadgeProps>;
  * <TagItem label="Blog" showActions={false} />
  * ```
  */
-declare const TagItem: React.FC<TagItemProps>;
+declare const TagItem: React__default.FC<TagItemProps>;
 
 /** Událost zobrazená v kalendáři. */
 interface CalendarEvent {
@@ -2204,7 +2595,7 @@ interface CalendarEvent {
     /** Emoji zobrazené před názvem. */
     emoji?: string;
     /** Obsah tooltipu. Pokud je nastaveno, event bar se obalí tooltipem. */
-    tooltip?: string | React.ReactNode;
+    tooltip?: string | React__default.ReactNode;
 }
 interface CalendarProps {
     /** Aktuálně vybraný datum. */
@@ -2235,8 +2626,15 @@ interface CalendarProps {
     minDate?: Date;
     /** Maximální povolený datum. */
     maxDate?: Date;
+    /**
+     * Velikost kompaktního kalendáře (buňky, písmo, odsazení).
+     * - `'md'` — výchozí (buňka 36px)
+     * - `'sm'` — do popoverů a úzkých sloupců (buňka 28px)
+     * @default 'md'
+     */
+    size?: 'sm' | 'md';
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -2253,6 +2651,7 @@ interface CalendarProps {
  * ```tsx
  * // Kompaktní
  * <Calendar value={date} onChange={setDate} events={events} />
+ * <Calendar size="sm" value={date} onChange={setDate} />
  *
  * // Plnohodnotný
  * <Calendar
@@ -2262,20 +2661,29 @@ interface CalendarProps {
  * />
  * ```
  */
-declare const Calendar: React.FC<CalendarProps>;
+declare const Calendar: React__default.FC<CalendarProps>;
 
 /** Položka časové osy. */
 interface TimelineItem {
-    /** Nadpis události. */
-    title: string;
-    /** Volitelný popis události. */
-    description?: string;
+    /** Nadpis události (text nebo ReactNode, např. s Badge). */
+    title: React__default.ReactNode;
+    /** Volitelný popis události (text nebo ReactNode). */
+    description?: React__default.ReactNode;
     /** Volitelný datum / časový údaj. */
     date?: string;
     /** Vlastní ikona místo výchozí tečky. */
-    icon?: React.ReactNode;
+    icon?: React__default.ReactNode;
     /** Barva tečky nebo pozadí ikony. @default '#FC4F00' */
     color?: string;
+    /** Obsah vpravo od nadpisu (štítek, badge, počet). Vertikální osa. */
+    meta?: React__default.ReactNode;
+    /** Libovolný obsah pod popisem (tlačítka, seznam, vnořený blok). Vertikální osa. */
+    content?: React__default.ReactNode;
+    /**
+     * `'section'` = nadpis skupiny bez tečky (uvozuje blok položek).
+     * @default 'dot'
+     */
+    variant?: 'dot' | 'section';
 }
 interface TimelineProps {
     /** Položky časové osy. */
@@ -2283,7 +2691,7 @@ interface TimelineProps {
     /** Orientace časové osy. @default 'vertical' */
     orientation?: 'vertical' | 'horizontal';
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -2302,16 +2710,22 @@ interface TimelineProps {
  *     { title: 'Doručeno', date: '14:30', color: '#00A205' },
  *   ]}
  * />
+ *
+ * // Sekce, štítky a vlastní obsah
+ * <Timeline items={[
+ *   { variant: 'section', title: 'Fáze 1', meta: <Badge label="8 kroků" size="sm" variant="neutral" /> },
+ *   { title: <>Analýza <Badge label="Vždy" variant="success" size="sm" /></>, content: <Button size="sm">Otevřít</Button> },
+ * ]} />
  * ```
  */
-declare const Timeline: React.FC<TimelineProps>;
+declare const Timeline: React__default.FC<TimelineProps>;
 
 /** Položka klíč-hodnota v seznamu. */
 interface DataListItem {
     /** Popisek (klíč). */
     label: string;
     /** Hodnota — řetězec nebo libovolný React uzel. */
-    value: React.ReactNode;
+    value: React__default.ReactNode;
 }
 interface DataListProps {
     /** Položky k zobrazení. */
@@ -2321,7 +2735,7 @@ interface DataListProps {
     /** Střídání barvy řádků. @default false */
     striped?: boolean;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -2344,7 +2758,7 @@ interface DataListProps {
  * />
  * ```
  */
-declare const DataList: React.FC<DataListProps>;
+declare const DataList: React__default.FC<DataListProps>;
 
 /** Uzel stromové struktury. */
 interface TreeNode {
@@ -2353,7 +2767,7 @@ interface TreeNode {
     /** Zobrazený text uzlu. */
     label: string;
     /** Volitelná ikona vedle popisku. */
-    icon?: React.ReactNode;
+    icon?: React__default.ReactNode;
     /** Podřízené uzly. */
     children?: TreeNode[];
 }
@@ -2367,7 +2781,7 @@ interface TreeProps {
     /** ID uzlů, které jsou ve výchozím stavu rozbalené. */
     defaultExpanded?: string[];
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -2391,7 +2805,7 @@ interface TreeProps {
  * />
  * ```
  */
-declare const Tree: React.FC<TreeProps>;
+declare const Tree: React__default.FC<TreeProps>;
 
 type StatusBadgeStatus = 'online' | 'offline' | 'away' | 'busy' | (string & {});
 interface StatusBadgeProps {
@@ -2406,7 +2820,7 @@ interface StatusBadgeProps {
     /** Vlastní barva indikátoru — přepíše výchozí barvu stavu. */
     color?: string;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -2424,28 +2838,363 @@ interface StatusBadgeProps {
  * <StatusBadge status="streaming" color="#9C27B0" label="Živě" pulse />
  * ```
  */
-declare const StatusBadge: React.FC<StatusBadgeProps>;
+declare const StatusBadge: React__default.FC<StatusBadgeProps>;
+
+/** Default series palette — brand orange first, then a distinct categorical set. */
+declare const CHART_PALETTE: readonly ["#FC4F00", "#2D7FF9", "#00A205", "#F5A623", "#9C27B0", "#00B8D9", "#EF3838", "#7C4DFF"];
+interface ChartSeries {
+    /** Series name shown in legend / tooltip. */
+    name: string;
+    /** Values aligned 1:1 with `categories`. */
+    data: number[];
+    /** Series color. Defaults to the palette by position. */
+    color?: string;
+}
+interface PieDatum {
+    /** Slice label. */
+    label: string;
+    /** Slice value (must be >= 0). */
+    value: number;
+    /** Slice color. Defaults to the palette by position. */
+    color?: string;
+}
+type LegendPosition = 'top' | 'bottom' | 'none';
+
+interface LineChartProps {
+    /** One or more data series, each aligned to `categories`. */
+    series: ChartSeries[];
+    /** X-axis category labels. */
+    categories: string[];
+    /** Chart height in px. @default 260 */
+    height?: number;
+    /** Explicit width in px. When omitted the chart fills its container (responsive). */
+    width?: number;
+    /** Fill the area under each line. @default false (AreaChart sets true) */
+    area?: boolean;
+    /** Line interpolation. @default 'smooth' */
+    curve?: 'smooth' | 'linear';
+    /** Show horizontal grid lines. @default true */
+    showGrid?: boolean;
+    /** Show the x-axis labels. @default true */
+    showXAxis?: boolean;
+    /** Show the y-axis labels. @default true */
+    showYAxis?: boolean;
+    /** Show point markers. @default true */
+    showDots?: boolean;
+    /** Show hover tooltip. @default true */
+    showTooltip?: boolean;
+    /** Legend position. @default 'top' for >1 series, jinak 'none' */
+    legend?: LegendPosition;
+    /** Fixed y domain `[min, max]`. Defaults to a "nice" auto range including 0. */
+    yDomain?: [number, number];
+    /** Approximate number of y-axis ticks. @default 5 */
+    yTickCount?: number;
+    /** Line thickness in px. @default 2 */
+    strokeWidth?: number;
+    /** Area fill opacity. @default 0.15 */
+    fillOpacity?: number;
+    /** Animate the draw-in on mount. @default true */
+    animate?: boolean;
+    /** Format y values / tooltip numbers. @default toLocaleString */
+    valueFormat?: (value: number) => string;
+    /** Plot margins (px). */
+    margin?: {
+        top?: number;
+        right?: number;
+        bottom?: number;
+        left?: number;
+    };
+    /** Called when a point is clicked. */
+    onPointClick?: (info: {
+        category: string;
+        categoryIndex: number;
+        series: string;
+        value: number;
+    }) => void;
+    /** Accessible label for the chart. */
+    ariaLabel?: string;
+    /** Další inline styly pro obal. */
+    style?: React__default.CSSProperties;
+    /** Dodatečná CSS třída pro obal. */
+    className?: string;
+}
+/**
+ * Čárový graf (SVG, bez závislostí) dle SM-UI design systému.
+ *
+ * Více sérií, hladká / linear křivka, mřížka, osy, hover tooltip s crosshairem,
+ * legenda, draw-in animace a tmavý / světlý režim.
+ *
+ * @example
+ * ```tsx
+ * <LineChart
+ *   categories={['Po', 'Út', 'St', 'Čt', 'Pá']}
+ *   series={[{ name: 'Návštěvy', data: [120, 200, 150, 80, 170] }]}
+ * />
+ * ```
+ */
+declare const LineChart: React__default.FC<LineChartProps>;
+/**
+ * Plošný graf — `LineChart` s výplní pod čarou.
+ *
+ * @example
+ * ```tsx
+ * <AreaChart categories={mesice} series={[{ name: 'Tržby', data: trzby }]} />
+ * ```
+ */
+declare const AreaChart: React__default.FC<LineChartProps>;
 
+interface BarChartProps {
+    /** One or more data series, each aligned to `categories`. */
+    series: ChartSeries[];
+    /** Category labels. */
+    categories: string[];
+    /** Chart height in px. @default 260 */
+    height?: number;
+    /** Explicit width in px. When omitted the chart fills its container (responsive). */
+    width?: number;
+    /** Bar direction. @default 'vertical' */
+    orientation?: 'vertical' | 'horizontal';
+    /** Stack series instead of grouping them side by side. @default false */
+    stacked?: boolean;
+    /** Show grid lines on the value axis. @default true */
+    showGrid?: boolean;
+    /** Show category-axis labels. @default true */
+    showCategoryAxis?: boolean;
+    /** Show value-axis labels. @default true */
+    showValueAxis?: boolean;
+    /** Show hover tooltip. @default true */
+    showTooltip?: boolean;
+    /** Print the value on top of each bar. @default false */
+    showValues?: boolean;
+    /** Legend position. @default 'top' for >1 series, jinak 'none' */
+    legend?: LegendPosition;
+    /** Fixed value domain `[min, max]`. Defaults to a "nice" auto range including 0. */
+    valueDomain?: [number, number];
+    /** Approximate number of value-axis ticks. @default 5 */
+    valueTickCount?: number;
+    /** Corner radius of bars. @default 4 */
+    barRadius?: number;
+    /** Max thickness of a single bar (group) in px. */
+    maxBarSize?: number;
+    /** Animate the grow-in on mount. @default true */
+    animate?: boolean;
+    /** Format value-axis / tooltip numbers. @default toLocaleString */
+    valueFormat?: (value: number) => string;
+    /** Plot margins (px). */
+    margin?: {
+        top?: number;
+        right?: number;
+        bottom?: number;
+        left?: number;
+    };
+    /** Called when a bar is clicked. */
+    onBarClick?: (info: {
+        category: string;
+        categoryIndex: number;
+        series: string;
+        value: number;
+    }) => void;
+    /** Accessible label for the chart. */
+    ariaLabel?: string;
+    /** Další inline styly pro obal. */
+    style?: React__default.CSSProperties;
+    /** Dodatečná CSS třída pro obal. */
+    className?: string;
+}
+/**
+ * Sloupcový graf (SVG, bez závislostí) dle SM-UI design systému.
+ *
+ * Vertikální i horizontální orientace, seskupené (grouped) i skládané (stacked)
+ * série, mřížka, osy, hover tooltip, legenda, grow-in animace a tmavý / světlý režim.
+ *
+ * @example
+ * ```tsx
+ * <BarChart
+ *   categories={['Q1', 'Q2', 'Q3', 'Q4']}
+ *   series={[{ name: 'Tržby', data: [120, 200, 150, 280] }]}
+ * />
+ *
+ * <BarChart
+ *   stacked
+ *   categories={['Po', 'Út', 'St']}
+ *   series={[{ name: 'Web', data: [10, 20, 15] }, { name: 'App', data: [5, 8, 12] }]}
+ * />
+ * ```
+ */
+declare const BarChart: React__default.FC<BarChartProps>;
+
+interface PieChartProps {
+    /** Slices to render (values must be >= 0). */
+    data: PieDatum[];
+    /** Diameter of the pie in px. @default 220 */
+    size?: number;
+    /** Inner radius as a fraction of the outer radius (0 = pie, >0 = donut). @default 0 */
+    innerRatio?: number;
+    /** Legend position. @default 'right' */
+    legend?: 'right' | 'bottom' | 'none';
+    /** Render the percentage on each slice. @default false */
+    showLabels?: boolean;
+    /** Show hover tooltip. @default true */
+    showTooltip?: boolean;
+    /** Gap between slices in degrees. @default 0 */
+    padAngle?: number;
+    /** Custom content rendered in the donut center (only meaningful when innerRatio > 0). */
+    centerLabel?: React__default.ReactNode;
+    /** Animate the draw-in on mount. @default true */
+    animate?: boolean;
+    /** Format tooltip / label numbers. @default toLocaleString */
+    valueFormat?: (value: number) => string;
+    /** Called when a slice is clicked. */
+    onSliceClick?: (info: {
+        label: string;
+        value: number;
+        index: number;
+        percent: number;
+    }) => void;
+    /** Accessible label for the chart. */
+    ariaLabel?: string;
+    /** Další inline styly pro obal. */
+    style?: React__default.CSSProperties;
+    /** Dodatečná CSS třída pro obal. */
+    className?: string;
+}
+/**
+ * Koláčový graf (SVG, bez závislostí) dle SM-UI design systému.
+ *
+ * Hover zvýraznění s vysunutím výseče, volitelné popisky s procenty, legenda,
+ * draw-in animace a tmavý / světlý režim.
+ *
+ * @example
+ * ```tsx
+ * <PieChart data={[
+ *   { label: 'Chrome', value: 64 },
+ *   { label: 'Safari', value: 19 },
+ *   { label: 'Firefox', value: 9 },
+ * ]} />
+ * ```
+ */
+declare const PieChart: React__default.FC<PieChartProps>;
+/**
+ * Prstencový graf — `PieChart` s dírou uprostřed (a volitelným `centerLabel`).
+ *
+ * @example
+ * ```tsx
+ * <DonutChart
+ *   data={browsers}
+ *   centerLabel={<strong style={{ fontSize: 22 }}>92%</strong>}
+ * />
+ * ```
+ */
+declare const DonutChart: React__default.FC<PieChartProps>;
+
+interface SparklineProps {
+    /** Data points. */
+    data: number[];
+    /** Width in px. @default 100 */
+    width?: number;
+    /** Height in px. @default 32 */
+    height?: number;
+    /** Visual type. @default 'line' */
+    type?: 'line' | 'area' | 'bar';
+    /** Line / bar / fill color. @default brand orange */
+    color?: string;
+    /** Line interpolation (line/area). @default 'smooth' */
+    curve?: 'smooth' | 'linear';
+    /** Line thickness. @default 1.5 */
+    strokeWidth?: number;
+    /** Area fill opacity. @default 0.18 */
+    fillOpacity?: number;
+    /** Highlight the last point with a dot. @default false */
+    showLastDot?: boolean;
+    /** Animate the draw-in on mount. @default true */
+    animate?: boolean;
+    /** Accessible label. */
+    ariaLabel?: string;
+    /** Další inline styly. */
+    style?: React__default.CSSProperties;
+    /** Dodatečná CSS třída. */
+    className?: string;
+}
+/**
+ * Mini graf bez os a popisků — pro vložení do `Stat` karet, tabulek a řádků.
+ *
+ * Měřítko se přizpůsobuje datům (ne nutně od nuly).
+ *
+ * @example
+ * ```tsx
+ * <Sparkline data={[3, 7, 4, 9, 6, 11, 8]} />
+ * <Sparkline type="area" color="#00A205" data={trend} showLastDot />
+ * <Sparkline type="bar" data={[4, 8, 6, 10, 7]} />
+ * ```
+ */
+declare const Sparkline: React__default.FC<SparklineProps>;
+
+type FocusTrapInitialFocus = 'container' | 'first' | React__default.RefObject<HTMLElement | null>;
+interface UseFocusTrapOptions {
+    /** Zda je past aktivní. */
+    active: boolean;
+    /**
+     * Kam přesunout fokus po aktivaci.
+     * - `'container'` — na kontejner (musí mít `tabIndex={-1}`)
+     * - `'first'` — na první viditelný fokusovatelný prvek
+     * - ref — na konkrétní prvek
+     * @default 'container'
+     */
+    initialFocus?: FocusTrapInitialFocus;
+    /** Po deaktivaci vrátit fokus na prvek, který byl aktivní před otevřením. @default true */
+    returnFocus?: boolean;
+}
+/**
+ * Uzavře Tab / Shift+Tab do kontejneru. Skryté prvky (`display: none`)
+ * se přeskakují, takže wrap funguje i s responzivně schovanými taby.
+ * Reaguje jen pokud je fokus uvnitř kontejneru — vnořené portály
+ * (dropdown Selectu) tak nejsou násilně vraceny zpět.
+ */
+declare function useFocusTrap(containerRef: React__default.RefObject<HTMLElement | null>, { active, initialFocus, returnFocus }: UseFocusTrapOptions): void;
+
+/** Breakpointy pro `fullscreenBelow` (max-width v px). */
+declare const BREAKPOINTS: {
+    readonly sm: 640;
+    readonly md: 768;
+    readonly lg: 1024;
+};
+type ModalBreakpoint = keyof typeof BREAKPOINTS;
 interface ModalProps {
     /** Řídí zobrazení modálního okna. */
     open: boolean;
     /** Voláno při zavření modálu. */
     onClose: () => void;
     /** Titulek zobrazený v záhlaví modálu. String nebo ReactNode pro vlastní hlavičku. */
-    title?: string | React.ReactNode;
+    title?: string | React__default.ReactNode;
     /** Alternativní slot pro celou hlavičku (nahrazuje title + close button). */
-    titleSlot?: React.ReactNode;
+    titleSlot?: React__default.ReactNode;
     /** Obsah těla modálu. */
-    children: React.ReactNode;
+    children: React__default.ReactNode;
     /** Obsah patičky modálu (tlačítka apod.). */
-    footer?: React.ReactNode;
-    /** Velikostní preset modálu. @default 'md' */
-    size?: 'sm' | 'md' | 'lg' | 'fullscreen';
+    footer?: React__default.ReactNode;
+    /** Velikostní preset modálu. `xl` je velký, ale ne fullscreen (1080px / 90vh). @default 'md' */
+    size?: 'sm' | 'md' | 'lg' | 'xl' | 'fullscreen';
+    /**
+     * Pod tímto breakpointem (šířka viewportu) se modál vykreslí jako fullscreen,
+     * nad ním jako karta dle `size`. Breakpointy: sm 640px, md 768px, lg 1024px.
+     */
+    fullscreenBelow?: ModalBreakpoint;
     /**
      * Explicitní šířka modálu. Přepíše `size`.
      * Přijímá číslo (px) nebo CSS string (např. '90vw').
      */
     width?: number | string;
+    /**
+     * Maximální výška karty. Přepíše výšku danou `size`.
+     * Obsah nad tuto výšku scrolluje v těle modálu. Číslo = px, nebo CSS string ('90vh').
+     */
+    maxHeight?: number | string;
+    /**
+     * z-index kořenového overlay kontejneru.
+     * Výchozí hodnota čerpá z CSS proměnné `--sm-ui-z-overlay` (fallback 99998)
+     * a u vnořených overlayů se automaticky zvedá nad rodiče. Tento prop ji přepíše pro jednu instanci.
+     */
+    zIndex?: number;
     /** Zavře modál kliknutím na překryvnou vrstvu. @default true */
     closeOnOverlay?: boolean;
     /** Zavře modál stisknutím klávesy Escape. @default true */
@@ -2460,17 +3209,33 @@ interface ModalProps {
     showClose?: boolean;
     /** Zobrazí oddělovací čáru pod hlavičkou. @default true */
     showHeaderDivider?: boolean;
+    /**
+     * Kam přesunout fokus po otevření: na kartu (`'container'`), první
+     * fokusovatelný prvek (`'first'`) nebo konkrétní ref.
+     * @default 'container'
+     */
+    initialFocus?: FocusTrapInitialFocus;
     /** Dodatečná CSS třída pro kartu modálu. */
     className?: string;
     /** Další inline styly pro kartu modálu. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
+    /**
+     * Vypne výchozí vnitřní padding těla (`20px 24px`).
+     * Vhodné pro full-bleed obsah (tabulky, taby edge-to-edge).
+     * @default false
+     */
+    disableBodyPadding?: boolean;
+    /** Dodatečná CSS třída pro tělo (scrollovací oblast). */
+    bodyClassName?: string;
+    /** Vlastní inline styly pro tělo (scrollovací oblast). */
+    bodyStyle?: React__default.CSSProperties;
 }
 /**
  * Modální dialog dle SM-UI design systému.
  *
  * Vykresluje se přes React portál s překryvnou vrstvou,
  * podporuje animace otevření / zavření, focus trap
- * a zamezení scrollu pozadí.
+ * a zamezení scrollu pozadí. Escape zavře jen nejvyšší otevřený overlay.
  *
  * @example
  * ```tsx
@@ -2479,7 +3244,7 @@ interface ModalProps {
  * </Modal>
  * ```
  */
-declare const Modal: React.FC<ModalProps>;
+declare const Modal: React__default.FC<ModalProps>;
 
 interface DrawerProps {
     /** Řídí zobrazení šuplíku. */
@@ -2488,12 +3253,29 @@ interface DrawerProps {
     onClose: () => void;
     /** Strana, ze které se šuplík vysune. @default 'right' */
     position?: 'left' | 'right';
+    /**
+     * Vzhled panelu.
+     * - `'edge'` — přilepený k okraji viewportu (výchozí)
+     * - `'floating'` — plovoucí karta s odsazením od okrajů a zaoblením
+     * @default 'edge'
+     */
+    variant?: 'edge' | 'floating';
+    /** Odsazení plovoucího panelu od okrajů viewportu v px (`variant="floating"`). @default 16 */
+    floatingOffset?: number;
+    /** Zavře šuplík stisknutím klávesy Escape. @default true */
+    closeOnEscape?: boolean;
+    /**
+     * Kam přesunout fokus po otevření: na panel (`'container'`), první
+     * fokusovatelný prvek (`'first'`) nebo konkrétní ref.
+     * @default 'container'
+     */
+    initialFocus?: FocusTrapInitialFocus;
     /** Titulek zobrazený v záhlaví šuplíku. */
     title?: string;
     /** Obsah těla šuplíku. */
-    children: React.ReactNode;
+    children: React__default.ReactNode;
     /** Obsah patičky šuplíku. */
-    footer?: React.ReactNode;
+    footer?: React__default.ReactNode;
     /** Šířka panelu (px nebo CSS řetězec). @default 400 */
     width?: string | number;
     /** Zobrazí zavírací tlačítko (×). @default true */
@@ -2503,13 +3285,30 @@ interface DrawerProps {
     /** Dodatečná CSS třída pro panel šuplíku. */
     className?: string;
     /** Další inline styly pro panel šuplíku. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
+    /** Vlastní inline styly pro tělo (scrollovací oblast). */
+    bodyStyle?: React__default.CSSProperties;
+    /** Dodatečná CSS třída pro tělo (scrollovací oblast). */
+    bodyClassName?: string;
+    /**
+     * Vypne výchozí vnitřní padding těla (`20px 24px`).
+     * Vhodné pro panely s vlastním layoutem (např. navigace edge-to-edge).
+     * @default false
+     */
+    disableBodyPadding?: boolean;
+    /**
+     * z-index kořenového overlay kontejneru.
+     * Výchozí hodnota čerpá z CSS proměnné `--sm-ui-z-overlay` (fallback 99998)
+     * a u vnořených overlayů se automaticky zvedá nad rodiče. Tento prop ji přepíše pro jednu instanci.
+     */
+    zIndex?: number;
 }
 /**
  * Vysuvný panel (Drawer) dle SM-UI design systému.
  *
  * Vykresluje se přes React portál, vysune se z levé nebo pravé strany
- * s překryvnou vrstvou a plynulou animací.
+ * s překryvnou vrstvou a plynulou animací. Focus trap, Escape zavírá jen
+ * nejvyšší overlay, `variant="floating"` vykreslí plovoucí kartu.
  *
  * @example
  * ```tsx
@@ -2518,7 +3317,7 @@ interface DrawerProps {
  * </Drawer>
  * ```
  */
-declare const Drawer: React.FC<DrawerProps>;
+declare const Drawer: React__default.FC<DrawerProps>;
 
 interface SheetProps {
     /** Řídí zobrazení sheetu. */
@@ -2526,15 +3325,37 @@ interface SheetProps {
     /** Voláno při zavření sheetu. */
     onClose: () => void;
     /** Obsah sheetu. */
-    children: React.ReactNode;
+    children: React__default.ReactNode;
     /** Strana, ze které se sheet vysune. @default 'bottom' */
     side?: 'bottom' | 'right' | 'left' | 'top';
     /** Titulek zobrazený v záhlaví. */
     title?: string;
     /** Zobrazí zavírací tlačítko. @default true */
     showClose?: boolean;
+    /** Zavře sheet kliknutím na překryvnou vrstvu. @default true */
+    closeOnOverlay?: boolean;
+    /** Zavře sheet stisknutím klávesy Escape. @default true */
+    closeOnEscape?: boolean;
+    /**
+     * Kam přesunout fokus po otevření: na panel (`'container'`), první
+     * fokusovatelný prvek (`'first'`) nebo konkrétní ref.
+     * @default 'container'
+     */
+    initialFocus?: FocusTrapInitialFocus;
+    /** Vypne výchozí vnitřní padding těla (`20px 24px`). @default false */
+    disableBodyPadding?: boolean;
+    /** Vlastní inline styly pro tělo (scrollovací oblast). */
+    bodyStyle?: React__default.CSSProperties;
+    /** Dodatečná CSS třída pro tělo (scrollovací oblast). */
+    bodyClassName?: string;
+    /**
+     * z-index kořenového overlay kontejneru.
+     * Výchozí hodnota čerpá z CSS proměnné `--sm-ui-z-overlay` (fallback 99998)
+     * a u vnořených overlayů se automaticky zvedá nad rodiče.
+     */
+    zIndex?: number;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -2551,7 +3372,7 @@ interface SheetProps {
  * </Sheet>
  * ```
  */
-declare const Sheet: React.FC<SheetProps>;
+declare const Sheet: React__default.FC<SheetProps>;
 
 interface BreadcrumbItem {
     /** Zobrazovaný text položky. */
@@ -2559,19 +3380,25 @@ interface BreadcrumbItem {
     /** URL odkazu. Pokud chybí, položka se vykreslí jako prostý text. */
     href?: string;
     /** Voláno při kliknutí na položku. */
-    onClick?: (e: React.MouseEvent) => void;
+    onClick?: (e: React__default.MouseEvent) => void;
     /** Volitelná ikona vykreslená před textem. */
-    icon?: React.ReactNode;
+    icon?: React__default.ReactNode;
 }
 interface BreadcrumbProps {
     /** Seznam položek drobečkové navigace. */
     items: BreadcrumbItem[];
     /** Oddělovací znak mezi položkami. @default '/' */
-    separator?: React.ReactNode;
+    separator?: React__default.ReactNode;
+    /**
+     * Komponenta pro vykreslení odkazu (položky s `href`), např. `Link` z Inertie
+     * nebo react-routeru. Dostane `href`, `onClick`, `style`, `children`.
+     * @default 'a'
+     */
+    linkComponent?: React__default.ElementType;
     /** Dodatečná CSS třída pro obalový element. */
     className?: string;
     /** Další inline styly pro obalový element. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Drobečková navigace dle SM-UI design systému.
@@ -2588,9 +3415,12 @@ interface BreadcrumbProps {
  *     { label: 'Detail' },
  *   ]}
  * />
+ *
+ * // Klientský router (Inertia / react-router)
+ * <Breadcrumb linkComponent={InertiaLink} items={items} />
  * ```
  */
-declare const Breadcrumb: React.FC<BreadcrumbProps>;
+declare const Breadcrumb: React__default.FC<BreadcrumbProps>;
 
 interface PaginationProps {
     /** Aktuální číslo stránky (1-indexed). */
@@ -2610,7 +3440,7 @@ interface PaginationProps {
     /** Dodatečná CSS třída pro obalový element. */
     className?: string;
     /** Další inline styly pro obalový element. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Stránkovací komponenta dle SM-UI design systému.
@@ -2623,7 +3453,7 @@ interface PaginationProps {
  * <Pagination page={3} totalPages={20} onChange={setPage} />
  * ```
  */
-declare const Pagination: React.FC<PaginationProps>;
+declare const Pagination: React__default.FC<PaginationProps>;
 
 interface StepItem {
     /** Popisek kroku. */
@@ -2651,7 +3481,7 @@ interface StepperProps {
     /** Dodatečná CSS třída pro obalový element. */
     className?: string;
     /** Další inline styly pro obalový element. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Kroková komponenta (Stepper) dle SM-UI design systému.
@@ -2678,7 +3508,7 @@ interface StepperProps {
  * />
  * ```
  */
-declare const Stepper: React.FC<StepperProps>;
+declare const Stepper: React__default.FC<StepperProps>;
 
 interface FormWizardStep {
     /** Popisek kroku zobrazený ve Stepperu. */
@@ -2686,7 +3516,7 @@ interface FormWizardStep {
     /** Volitelný popis kroku. */
     description?: string;
     /** Obsah kroku (formulář, komponenta). */
-    content: React.ReactNode;
+    content: React__default.ReactNode;
     /** Validace před pokračováním. Vrací boolean nebo Promise<boolean>. */
     validate?: () => boolean | Promise<boolean>;
 }
@@ -2708,7 +3538,7 @@ interface FormWizardProps {
     /** Text tlačítka Předchozí. @default 'Předchozí' */
     prevLabel?: string;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -2731,13 +3561,14 @@ interface FormWizardProps {
  * />
  * ```
  */
-declare const FormWizard: React.FC<FormWizardProps>;
+declare const FormWizard: React__default.FC<FormWizardProps>;
 
+type DropdownMenuPosition = 'bottom-left' | 'bottom-right' | 'top-left' | 'top-right';
 interface DropdownMenuItem {
     /** Zobrazovaný popisek položky. Může být text nebo ReactNode pro vlastní obsah. */
-    label: React.ReactNode;
+    label: React__default.ReactNode;
     /** Volitelná ikona vykreslená před textem. */
-    icon?: React.ReactNode;
+    icon?: React__default.ReactNode;
     /** Voláno při kliknutí na položku. */
     onClick?: () => void;
     /** Při `true` nelze položku vybrat. @default false */
@@ -2748,33 +3579,56 @@ interface DropdownMenuItem {
     divider?: boolean;
     /** Text kategorie — zobrazí se jako malý nadpis sekce (uppercase label). */
     category?: string;
-    /** Klávesová zkratka zobrazená vpravo (např. '⌘S', '⌘⌫'). */
-    shortcut?: string;
+    /** Klávesová zkratka nebo jiný obsah zobrazený vpravo (např. '⌘S', badge). */
+    shortcut?: React__default.ReactNode;
+    /** Obsah vpravo za popiskem (badge, tečka, počet). Zobrazí se i u položek se `subItems`. */
+    suffix?: React__default.ReactNode;
     /** Při `true` se dropdown po kliknutí nezavře. Pro toggle položky. @default false */
     keepOpenOnClick?: boolean;
     /** Kaskádové submenu. Když nastaveno, klik/hover otevře submenu místo zavření. */
     subItems?: DropdownMenuItem[];
+    /**
+     * Vykreslí `label` bez paddingu a hoveru položky (plně vlastní řádek).
+     * Výchozí je ReactNode label vykreslen se stejným paddingem jako text.
+     * @default false
+     */
+    unstyled?: boolean;
 }
 interface DropdownMenuProps {
     /** Spouštěcí element (tlačítko apod.). */
-    trigger: React.ReactNode;
+    trigger: React__default.ReactNode;
     /** Seznam položek nabídky. */
     items: DropdownMenuItem[];
-    /** Pozice rozbalovací nabídky vůči triggeru. @default 'bottom-left' */
-    position?: 'bottom-left' | 'bottom-right';
+    /**
+     * Pozice rozbalovací nabídky vůči triggeru.
+     * `bottom-*` otevírá pod trigger, `top-*` nad něj; `-left` / `-right` = zarovnání okraje.
+     * @default 'bottom-left'
+     */
+    position?: DropdownMenuPosition;
+    /**
+     * Když se nabídka na zvolené straně nevejde, otočí se na protilehlou.
+     * @default true
+     */
+    autoFlip?: boolean;
     /** Otevřít nabídku pravým kliknutím místo levým. @default false */
     triggerOnRightClick?: boolean;
+    /** Řízený stav otevření. Když zadáno, kit stav sám nemění a volá jen `onOpenChange`. */
+    open?: boolean;
+    /** Výchozí stav pro neřízený režim. @default false */
+    defaultOpen?: boolean;
+    /** Voláno při požadavku na otevření / zavření. */
+    onOpenChange?: (open: boolean) => void;
     /** Dodatečná CSS třída pro obalový element. */
     className?: string;
     /** Další inline styly pro obalový element. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Rozbalovací nabídka dle SM-UI design systému.
  *
  * Otevírá se kliknutím na trigger element, zavírá se kliknutím
  * mimo nebo klávesou Escape. Používá React portál
- * s chytrým pozicováním (otevře se nad triggerem, pokud pod ním není místo).
+ * s chytrým pozicováním (otočí se na druhou stranu, pokud není místo).
  *
  * @example
  * ```tsx
@@ -2789,14 +3643,16 @@ interface DropdownMenuProps {
  * />
  * ```
  */
-declare const DropdownMenu: React.FC<DropdownMenuProps>;
+declare const DropdownMenu: React__default.FC<DropdownMenuProps>;
 
-type LinkVariant = 'default' | 'danger';
-interface LinkProps extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'color'> {
+type LinkVariant = 'default' | 'danger' | 'primary' | 'muted';
+interface LinkProps extends Omit<React__default.AnchorHTMLAttributes<HTMLAnchorElement>, 'color'> {
     /**
      * Barevná varianta.
      * - `'default'` — bílá (tmavý režim) / tmavá (světlý režim)
      * - `'danger'`  — červená `#EF3838` v obou režimech
+     * - `'primary'` — brand oranžová (primární akce v textu)
+     * - `'muted'`   — tlumená šedá (sekundární odkazy)
      * @default 'default'
      */
     variant?: LinkVariant;
@@ -2804,7 +3660,7 @@ interface LinkProps extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>,
      * Ikona vykreslená vedle textu odkazu.
      * Typicky 14×14 SVG nebo komponenta ikony.
      */
-    icon?: React.ReactNode;
+    icon?: React__default.ReactNode;
     /**
      * Na které straně se ikona zobrazí vzhledem k textu.
      * @default 'left'
@@ -2817,7 +3673,7 @@ interface LinkProps extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>,
      */
     showIcon?: boolean;
     /** Další inline styly pro `<a>` element. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída pro `<a>` element. */
     className?: string;
 }
@@ -2836,7 +3692,7 @@ interface LinkProps extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>,
  * <Link icon={<ArrowIcon />} iconPosition="right" href="/dalsi">Další krok</Link>
  * ```
  */
-declare const Link: React.FC<LinkProps>;
+declare const Link: React__default.FC<LinkProps>;
 
 interface SpotlightItem {
     /** Unikátní identifikátor položky. */
@@ -2848,7 +3704,7 @@ interface SpotlightItem {
     /** Kategorie pro vizuální seskupení (např. "Komponenty", "Hooky"). */
     category: string;
     /** Volitelná ikona vedle textu. */
-    icon?: React.ReactNode;
+    icon?: React__default.ReactNode;
     /** Voláno při výběru položky (klik nebo Enter). */
     onSelect: () => void;
 }
@@ -2870,7 +3726,7 @@ interface SpotlightProps {
     /** Dodatečná CSS třída pro kartu spotlightu. */
     className?: string;
     /** Další inline styly pro kartu spotlightu. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Command-palette / spotlight overlay dle SM-UI design systému.
@@ -2893,7 +3749,7 @@ interface SpotlightProps {
  * />
  * ```
  */
-declare const Spotlight: React.FC<SpotlightProps>;
+declare const Spotlight: React__default.FC<SpotlightProps>;
 
 interface CommandItem {
     /** Unikátní identifikátor příkazu. */
@@ -2903,7 +3759,7 @@ interface CommandItem {
     /** Volitelný popis příkazu. */
     description?: string;
     /** Volitelná ikona příkazu. */
-    icon?: React.ReactNode;
+    icon?: React__default.ReactNode;
     /** Klávesová zkratka (zobrazena jako badge). */
     shortcut?: string;
     /** Voláno při výběru příkazu. */
@@ -2925,7 +3781,7 @@ interface CommandMenuProps {
     /** Placeholder text vyhledávacího pole. @default 'Zadejte příkaz...' */
     placeholder?: string;
     /** Další inline styly pro kartu. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -2946,11 +3802,11 @@ interface CommandMenuProps {
  * />
  * ```
  */
-declare const CommandMenu: React.FC<CommandMenuProps>;
+declare const CommandMenu: React__default.FC<CommandMenuProps>;
 
 interface AppSidebarProps {
     /** Obsah postranního panelu (navigace, menu apod.). */
-    children: React.ReactNode;
+    children: React__default.ReactNode;
     /** Zda je panel sbalený. @default false */
     collapsed?: boolean;
     /** Voláno při změně stavu sbalení. */
@@ -2959,33 +3815,56 @@ interface AppSidebarProps {
     width?: number;
     /** Šířka sbalené postranní lišty v px. @default 64 */
     collapsedWidth?: number;
+    /**
+     * Vzhled panelu.
+     * - `'edge'` — přilepený k okraji layoutu, jen pravý rámeček (výchozí)
+     * - `'floating'` — plovoucí karta s odsazením, zaoblením a stínem
+     * @default 'edge'
+     */
+    variant?: 'edge' | 'floating';
+    /** Odsazení plovoucího panelu od okrajů v px (`variant="floating"`). @default 16 */
+    floatingOffset?: number;
+    /**
+     * Vykreslí vestavěné tlačítko pro sbalení / rozbalení v patičce panelu.
+     * Volá `onCollapse(!collapsed)`.
+     * @default false
+     */
+    collapsible?: boolean;
+    /** Přístupný popisek tlačítka sbalení. @default 'Sbalit panel' / 'Rozbalit panel' */
+    collapseLabel?: {
+        collapse: string;
+        expand: string;
+    };
+    /** Obsah hlavičky nad navigací (logo). Nescrolluje. */
+    header?: React__default.ReactNode;
+    /** Obsah patičky pod navigací (profil). Nescrolluje. */
+    footer?: React__default.ReactNode;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
 /**
  * Sbaletelný postranní panel pro navigaci aplikace.
  *
- * Používá glass efekt a plynulou animaci šířky. Tlačítko pro sbalení/rozbalení
- * si řeší konzument sám — komponenta je plně řízená přes `collapsed` a `onCollapse`.
+ * Používá glass efekt a plynulou animaci šířky. Komponenta je řízená přes
+ * `collapsed` a `onCollapse`; s `collapsible` vykreslí vlastní tlačítko sbalení.
  *
  * @example
  * ```tsx
  * const [collapsed, setCollapsed] = useState(false);
- * <AppSidebar collapsed={collapsed} onCollapse={setCollapsed}>
- *   <button onClick={() => setCollapsed(c => !c)}>Toggle</button>
- *   <nav>...</nav>
+ * <AppSidebar collapsed={collapsed} onCollapse={setCollapsed} collapsible variant="floating">
+ *   <SidebarItem label="Dashboard" icon={<HouseIcon />} collapsed={collapsed} />
  * </AppSidebar>
  * ```
  */
-declare const AppSidebar: React.FC<AppSidebarProps>;
+declare const AppSidebar: React__default.FC<AppSidebarProps>;
 
-interface SidebarItemProps {
+interface SidebarItemProps extends Omit<React__default.HTMLAttributes<HTMLElement>, 'onClick' | 'style' | 'className' | 'children'> {
     /** Textový popisek položky. */
     label: string;
     /** Volitelná ikona zobrazená před textem. */
-    icon?: React.ReactNode;
+    icon?: React__default.ReactNode;
     /** Zda je položka aktivní (vybraná). @default false */
     active?: boolean;
     /** Zda je skupina výchozně rozbalená. @default false */
@@ -2995,15 +3874,34 @@ interface SidebarItemProps {
     /** Callback při změně rozbalení. */
     onExpandedChange?: (expanded: boolean) => void;
     /** Callback při kliknutí na položku (ne na chevron). */
-    onClick?: () => void;
+    onClick?: (e: React__default.MouseEvent<HTMLElement>) => void;
+    /**
+     * URL — položka se vykreslí jako `<a href>` (middle-click, kopírování adresy).
+     * S klientským routerem předejte i `as` (např. Inertia `Link`).
+     */
+    href?: string;
+    /** Komponenta pro vykreslení položky s `href` (Inertia / react-router `Link`). @default 'a' */
+    as?: React__default.ElementType;
     /** Potomci — vnořené SidebarItem komponenty. Přítomnost aktivuje rozbalovací režim. */
-    children?: React.ReactNode;
+    children?: React__default.ReactNode;
     /** Zda je sidebar sbalený (jen ikona). @default false */
     collapsed?: boolean;
+    /**
+     * Ve sbaleném režimu zobrazit tooltip s popiskem vpravo od ikony.
+     * @default true
+     */
+    collapsedTooltip?: boolean;
     /** Zakáže interakci. @default false */
     disabled?: boolean;
+    /**
+     * Velikost položky.
+     * - `'sm'` — 13px písmo, výchozí
+     * - `'md'` — 14px písmo, větší odsazení
+     * @default 'sm'
+     */
+    size?: 'sm' | 'md';
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -3011,11 +3909,13 @@ interface SidebarItemProps {
  * Položka navigace pro AppSidebar.
  *
  * Podporuje ikonu, aktivní stav, hover efekt a vnořené položky
- * s animovaným rozbalováním/sbalováním.
+ * s animovaným rozbalováním/sbalováním. Ve sbaleném sidebaru má položka
+ * přístupný název, tooltip a skupina se otevírá jako flyout vpravo.
  *
  * @example
  * ```tsx
  * <SidebarItem label="Dashboard" icon={<HouseIcon size={18} />} active onClick={...} />
+ * <SidebarItem label="Projekty" icon={<FolderIcon size={18} />} href="/projekty" as={Link} />
  *
  * <SidebarItem label="Settings" icon={<GearIcon size={18} />} defaultExpanded>
  *   <SidebarItem label="General" onClick={...} />
@@ -3024,21 +3924,21 @@ interface SidebarItemProps {
  * </SidebarItem>
  * ```
  */
-declare const SidebarItem: React.FC<SidebarItemProps>;
+declare const SidebarItem: React__default.ForwardRefExoticComponent<SidebarItemProps & React__default.RefAttributes<HTMLElement>>;
 
 interface NavbarProps {
     /** Logo nebo název aplikace (vykresleno vlevo). */
-    logo?: React.ReactNode;
+    logo?: React__default.ReactNode;
     /** Navigační obsah (vykresleno uprostřed). */
-    children?: React.ReactNode;
+    children?: React__default.ReactNode;
     /** Akční prvky – tlačítka, avatar apod. (vykresleno vpravo). */
-    actions?: React.ReactNode;
+    actions?: React__default.ReactNode;
     /** Zda je navbar přilepený k hornímu okraji. @default true */
     sticky?: boolean;
     /** Zda použít glass efekt (průhledné pozadí s rozmazáním). @default true */
     glass?: boolean;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -3058,15 +3958,16 @@ interface NavbarProps {
  * </Navbar>
  * ```
  */
-declare const Navbar: React.FC<NavbarProps>;
+declare const Navbar: React__default.FC<NavbarProps>;
 
-type ToastVariant = 'info' | 'success' | 'error';
+type ToastVariant = 'info' | 'success' | 'warning' | 'error';
 interface ToastProps {
     /**
-     * Vizuální varianta určující barvu okraje a tón pozadí.
-     * - `'info'`    — bílý / neutrální okraj, tmavé pozadí
-     * - `'success'` — zelený okraj (#00A205), tmavé nazelenalé pozadí
-     * - `'error'`   — červený okraj (#DE0000), tmavé načervenalé pozadí
+     * Vizuální varianta určující barvu rámečku a ikony.
+     * - `'info'`    — neutrální
+     * - `'success'` — zelená (#00A205)
+     * - `'warning'` — oranžovožlutá (#F5A623), stav „uloženo, ale…"
+     * - `'error'`   — červená (#EF3838)
      * @default 'info'
      */
     variant?: ToastVariant;
@@ -3075,14 +3976,14 @@ interface ToastProps {
      */
     title: string;
     /**
-     * Volitelný sekundární popis vykreslený pod nadpisem menším písmem.
+     * Volitelný popis vykreslený pod nadpisem menším písmem.
      */
-    content?: string;
+    content?: React__default.ReactNode;
     /**
      * Vlastní ikona vykreslená na levé straně.
-     * Pokud chybí, použije se vestavěná SVG ikona odpovídající variantě.
+     * Pokud chybí, použije se vestavěná ikona odpovídající variantě.
      */
-    icon?: React.ReactNode;
+    icon?: React__default.ReactNode;
     /**
      * Callback volaný při kliknutí na tlačítko zavření (✕).
      * Pokud není zadán, tlačítko zavření se nezobrazí.
@@ -3095,13 +3996,14 @@ interface ToastProps {
      */
     role?: 'alert' | 'status' | 'log';
     /** Další inline styly pro kořenový element. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída pro kořenový element. */
     className?: string;
 }
 /**
- * Notifikace se třemi úrovněmi závažnosti.
- * Vykresluje se s efektem rozmazaného skla, vždy v tmavém režimu.
+ * Kompaktní notifikace se čtyřmi úrovněmi závažnosti.
+ * Glass panel jako dropdowny kitu, varianta určuje barvu rámečku
+ * a ikony v tónovaném boxu.
  *
  * Tlačítko zavření se zobrazí pouze pokud je zadáno `onClose`.
  * Vlastní ikona může nahradit výchozí variantní ikonu přes prop `icon`.
@@ -3109,11 +4011,11 @@ interface ToastProps {
  * @example
  * ```tsx
  * <Toast variant="success" title="Uloženo" content="Změny byly uloženy." onClose={dismiss} />
- * <Toast variant="error"   title="Chyba" content="Něco se pokazilo." onClose={dismiss} />
+ * <Toast variant="warning" title="Uloženo, ale nenasazeno" content="Router je nedosažitelný." />
  * <Toast variant="info"    title="Upozornění" onClose={dismiss} />
  * ```
  */
-declare const Toast: React.FC<ToastProps>;
+declare const Toast: React__default.FC<ToastProps>;
 
 type ToastPosition = 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right';
 /** Nastavení předávaná do `toast()` při vyvolání notifikace. */
@@ -3125,13 +4027,13 @@ interface ToastOptions {
     variant?: ToastVariant;
     /** Tučný nadpis notifikace. */
     title: string;
-    /** Volitelný popis vykreslený pod nadpisem. */
-    content?: string;
+    /** Volitelný popis vykreslený pod nadpisem (text nebo ReactNode, např. s odkazem). */
+    content?: React__default.ReactNode;
     /**
      * Vlastní ikona nahrazující vestavěnou variantní ikonu.
      * Libovolný React uzel — SVG, obrázek, komponenta…
      */
-    icon?: React.ReactNode;
+    icon?: React__default.ReactNode;
     /**
      * Časový limit automatického zavření v ms.
      * Nastavte na `0` pro trvalou notifikaci, kterou je nutné zavřít ručně.
@@ -3167,7 +4069,7 @@ interface ToastContextValue {
 }
 /** Props pro `<ToasterProvider>`. */
 interface ToasterProviderProps {
-    children: React.ReactNode;
+    children: React__default.ReactNode;
     /**
      * Pozice notifikací na obrazovce.
      * @default 'bottom-right'
@@ -3175,7 +4077,7 @@ interface ToasterProviderProps {
     position?: ToastPosition;
     /**
      * Šířka jednotlivé notifikace v px.
-     * @default 380
+     * @default 340
      */
     toastWidth?: number;
     /**
@@ -3214,7 +4116,7 @@ interface ToasterProviderProps {
  * </ToasterProvider>
  * ```
  */
-declare const ToasterProvider: React.FC<ToasterProviderProps>;
+declare const ToasterProvider: React__default.FC<ToasterProviderProps>;
 /**
  * Vrací `{ toast, dismiss }` pro vyvolání a zavření notifikací.
  * Musí být volán uvnitř stromu `<ToasterProvider>`.
@@ -3253,12 +4155,12 @@ interface AlertProps {
     /**
      * Volitelný popis vykreslený pod nadpisem menším písmem.
      */
-    children?: React.ReactNode;
+    children?: React__default.ReactNode;
     /**
      * Vlastní ikona vykreslená na levé straně.
      * Pokud chybí, použije se vestavěná SVG ikona odpovídající variantě.
      */
-    icon?: React.ReactNode;
+    icon?: React__default.ReactNode;
     /**
      * Zobrazí tlačítko zavření (✕).
      * @default false
@@ -3271,7 +4173,7 @@ interface AlertProps {
     /** Dodatečná CSS třída pro kořenový element. */
     className?: string;
     /** Další inline styly pro kořenový element. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Statický banner pro zobrazení důležitých informací, varování nebo chyb.
@@ -3288,7 +4190,7 @@ interface AlertProps {
  * <Alert variant="warning" title="Pozor">Tato akce je nevratná.</Alert>
  * ```
  */
-declare const Alert: React.FC<AlertProps>;
+declare const Alert: React__default.FC<AlertProps>;
 
 type BannerVariant = 'info' | 'success' | 'warning' | 'error';
 type BannerPosition = 'top' | 'bottom';
@@ -3298,15 +4200,15 @@ interface BannerProps {
     /** Tučný titulek. */
     title?: string;
     /** Obsah banneru. */
-    children?: React.ReactNode;
+    children?: React__default.ReactNode;
     /** Zobrazí zavírací tlačítko. @default false */
     closable?: boolean;
     /** Callback při zavření. */
     onClose?: () => void;
     /** Vlastní ikona. Pokud není zadána, použije se výchozí dle varianty. */
-    icon?: React.ReactNode;
+    icon?: React__default.ReactNode;
     /** Akční tlačítka na pravé straně. */
-    actions?: React.ReactNode;
+    actions?: React__default.ReactNode;
     /** Persistentní dismiss přes localStorage key. */
     dismissKey?: string;
     /** Pozice akcentního proužku. @default 'top' */
@@ -3314,7 +4216,7 @@ interface BannerProps {
     /** Přilepí banner na pozici. @default false */
     sticky?: boolean;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -3331,7 +4233,7 @@ interface BannerProps {
  * </Banner>
  * ```
  */
-declare const Banner: React.FC<BannerProps>;
+declare const Banner: React__default.FC<BannerProps>;
 
 type NotificationVariant = 'info' | 'success' | 'warning' | 'error';
 interface NotificationProps {
@@ -3340,17 +4242,17 @@ interface NotificationProps {
     /** Titulek notifikace. */
     title: string;
     /** Obsah / popis notifikace. */
-    children?: React.ReactNode;
+    children?: React__default.ReactNode;
     /** Zobrazí tlačítko zavření. @default false */
     closable?: boolean;
     /** Voláno při zavření notifikace. */
     onClose?: () => void;
     /** Vlastní ikona (nahradí výchozí ikonu varianty). */
-    icon?: React.ReactNode;
+    icon?: React__default.ReactNode;
     /** Akční prvek zobrazený na pravé straně (tlačítko apod.). */
-    action?: React.ReactNode;
+    action?: React__default.ReactNode;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -3375,7 +4277,7 @@ interface NotificationProps {
  * </Notification>
  * ```
  */
-declare const Notification: React.FC<NotificationProps>;
+declare const Notification: React__default.FC<NotificationProps>;
 
 type ProgressBarSize = 'xs' | 'sm' | 'md';
 type ProgressVariant = 'default' | 'success' | 'warning' | 'danger';
@@ -3407,7 +4309,7 @@ interface ProgressBarProps {
     /** Dodatečná CSS třída. */
     className?: string;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 interface ProgressCircleProps {
     /** Aktuální hodnota. */
@@ -3425,13 +4327,13 @@ interface ProgressCircleProps {
     /** Zobrazí "X%" uprostřed. @default false */
     showValue?: boolean;
     /** Custom render obsahu uprostřed (override showValue). */
-    valueLabel?: (value: number, max: number) => React.ReactNode;
+    valueLabel?: (value: number, max: number) => React__default.ReactNode;
     /** Volitelný popisek pod kruhem. */
     label?: string;
     /** Dodatečná CSS třída. */
     className?: string;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Horizontální progress indikátor.
@@ -3445,7 +4347,7 @@ interface ProgressCircleProps {
  * <ProgressBar indeterminate />
  * ```
  */
-declare const ProgressBar: React.FC<ProgressBarProps>;
+declare const ProgressBar: React__default.FC<ProgressBarProps>;
 /**
  * Kruhový progress indikátor (SVG).
  *
@@ -3457,7 +4359,7 @@ declare const ProgressBar: React.FC<ProgressBarProps>;
  * <ProgressCircle value={45} max={60} variant="warning" valueLabel={(v, m) => `${v}/${m}`} />
  * ```
  */
-declare const ProgressCircle: React.FC<ProgressCircleProps>;
+declare const ProgressCircle: React__default.FC<ProgressCircleProps>;
 
 type SpinnerSize = 'sm' | 'md' | 'lg';
 interface SpinnerProps {
@@ -3482,7 +4384,7 @@ interface SpinnerProps {
     /** Dodatečná CSS třída pro kořenový element. */
     className?: string;
     /** Další inline styly pro kořenový element. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Animovaný spinner (indikátor načítání) využívající requestAnimationFrame.
@@ -3498,8 +4400,18 @@ interface SpinnerProps {
  * <Spinner size={32} label="Ukládání dat" />
  * ```
  */
-declare const Spinner: React.FC<SpinnerProps>;
+declare const Spinner: React__default.FC<SpinnerProps>;
 
+/** Kontext předaný funkci `content` — umožňuje řídit dialog z vlastního obsahu. */
+interface ConfirmContentContext {
+    /** Potvrdí dialog (stejné jako klik na potvrzovací tlačítko). */
+    confirm: () => void;
+    /** Zruší dialog. */
+    cancel: () => void;
+    /** Zapne / vypne potvrzovací tlačítko (např. type-to-confirm). */
+    setConfirmDisabled: (disabled: boolean) => void;
+}
+type ConfirmContent = React__default.ReactNode | ((ctx: ConfirmContentContext) => React__default.ReactNode);
 interface ConfirmDialogProps {
     /** Řídí zobrazení potvrzovacího dialogu. */
     open: boolean;
@@ -3509,8 +4421,15 @@ interface ConfirmDialogProps {
     onCancel: () => void;
     /** Titulek dialogu. */
     title: string;
-    /** Volitelný popis akce. */
-    description?: string;
+    /** Volitelný popis akce. Text nebo ReactNode (seznam položek, zvýraznění…). */
+    description?: React__default.ReactNode;
+    /**
+     * Vlastní obsah pod popisem (input pro type-to-confirm, checkbox…).
+     * Funkce dostane `{ confirm, cancel, setConfirmDisabled }`.
+     */
+    content?: ConfirmContent;
+    /** Zakáže potvrzovací tlačítko (např. dokud uživatel nepotvrdí vstup). @default false */
+    confirmDisabled?: boolean;
     /** Text potvrzovacího tlačítka. @default 'Potvrdit' */
     confirmLabel?: string;
     /** Text zrušovacího tlačítka. @default 'Zrušit' */
@@ -3519,8 +4438,16 @@ interface ConfirmDialogProps {
     variant?: 'default' | 'danger';
     /** Stav načítání potvrzovacího tlačítka. @default false */
     loading?: boolean;
+    /** z-index overlaye. Výchozí se počítá automaticky nad nadřazený overlay (Drawer, Modal). */
+    zIndex?: number;
+    /** Zavře dialog kliknutím na překryvnou vrstvu. @default true */
+    closeOnOverlay?: boolean;
+    /** Zavře dialog stisknutím klávesy Escape. @default true */
+    closeOnEscape?: boolean;
+    /** Umožní zavření dialogu jinak než tlačítky. @default true */
+    dismissable?: boolean;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -3528,7 +4455,7 @@ interface ConfirmDialogProps {
  * Předpřipravený modální dialog pro potvrzení akce.
  *
  * Interně používá komponentu `Modal`. Podporuje standardní a danger variantu
- * s volitelným stavem načítání.
+ * s volitelným stavem načítání. Otevřený z Draweru / Modalu se vždy vykreslí nad ním.
  *
  * @example
  * ```tsx
@@ -3540,15 +4467,77 @@ interface ConfirmDialogProps {
  *   description="Tato akce je nevratná."
  *   variant="danger"
  * />
+ *
+ * // Type-to-confirm
+ * <ConfirmDialog
+ *   open={open}
+ *   title="Smazat projekt?"
+ *   confirmDisabled
+ *   content={({ setConfirmDisabled }) => (
+ *     <Input placeholder={slug} onChange={(e) => setConfirmDisabled(e.target.value !== slug)} />
+ *   )}
+ *   …
+ * />
+ * ```
+ */
+declare const ConfirmDialog: React__default.FC<ConfirmDialogProps>;
+/** Nastavení předaná do imperativního `confirm()`. */
+interface ConfirmOptions {
+    /** Titulek dialogu. */
+    title: string;
+    /** Volitelný popis akce. Text nebo ReactNode. */
+    description?: React__default.ReactNode;
+    /**
+     * Vlastní obsah pod popisem. Funkce dostane `{ confirm, cancel, setConfirmDisabled }`,
+     * takže lze potvrzení podmínit vstupem (type-to-confirm).
+     */
+    content?: ConfirmContent;
+    /** Počáteční stav potvrzovacího tlačítka. @default false */
+    confirmDisabled?: boolean;
+    /** Text potvrzovacího tlačítka. @default 'Potvrdit' */
+    confirmLabel?: string;
+    /** Text zrušovacího tlačítka. @default 'Zrušit' */
+    cancelLabel?: string;
+    /** Varianta dialogu – 'danger' zvýrazní potvrzovací tlačítko červeně. @default 'default' */
+    variant?: 'default' | 'danger';
+    /** Umožní zavření dialogu overlay klikem / Escape (= zrušení). @default true */
+    dismissable?: boolean;
+}
+/**
+ * Poskytuje imperativní `confirm()` přes hook `useConfirm()`.
+ * Vykresluje jeden sdílený `ConfirmDialog`. Umístěte **jednou** blízko kořene
+ * aplikace (typicky vedle `ToasterProvider`).
+ *
+ * @example
+ * ```tsx
+ * <ConfirmProvider>
+ *   <App />
+ * </ConfirmProvider>
+ * ```
+ */
+declare const ConfirmProvider: React__default.FC<{
+    children: React__default.ReactNode;
+}>;
+/**
+ * Vrací funkci `confirm(options): Promise<boolean>` pro imperativní potvrzení.
+ * Musí být volán uvnitř stromu `<ConfirmProvider>`.
+ *
+ * @throws Při volání mimo `<ConfirmProvider>`.
+ *
+ * @example
+ * ```tsx
+ * const confirm = useConfirm();
+ * const ok = await confirm({ title: 'Smazat položku?', variant: 'danger' });
+ * if (ok) await deleteItem();
  * ```
  */
-declare const ConfirmDialog: React.FC<ConfirmDialogProps>;
+declare const useConfirm: () => ((options: ConfirmOptions) => Promise<boolean>);
 
 interface CopyButtonProps {
     /** Text ke zkopírování do schránky. */
     text: string;
     /** Vlastní obsah tlačítka (nahrazuje výchozí ikonu/text). */
-    children?: React.ReactNode;
+    children?: React__default.ReactNode;
     /** Velikost tlačítka. @default 'md' */
     size?: 'sm' | 'md' | 'lg';
     /** Varianta zobrazení. @default 'icon' */
@@ -3560,7 +4549,7 @@ interface CopyButtonProps {
     /** Callback volaný po úspěšném zkopírování do schránky. */
     onCopy?: () => void;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -3577,7 +4566,7 @@ interface CopyButtonProps {
  * <CopyButton text={code} />
  * ```
  */
-declare const CopyButton: React.FC<CopyButtonProps>;
+declare const CopyButton: React__default.FC<CopyButtonProps>;
 
 type DividerOrientation = 'horizontal' | 'vertical';
 interface DividerProps {
@@ -3596,7 +4585,7 @@ interface DividerProps {
     /** Dodatečná CSS třída pro kořenový element. */
     className?: string;
     /** Další inline styly pro kořenový element. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Vizuální oddělovač obsahu — horizontální nebo vertikální čára.
@@ -3611,7 +4600,7 @@ interface DividerProps {
  * <Divider orientation="vertical" />
  * ```
  */
-declare const Divider: React.FC<DividerProps>;
+declare const Divider: React__default.FC<DividerProps>;
 
 type StackDirection = 'row' | 'column';
 type StackAlign = 'start' | 'center' | 'end' | 'stretch';
@@ -3650,11 +4639,11 @@ interface StackProps {
     /**
      * Potomci rozmístění uvnitř stacku.
      */
-    children?: React.ReactNode;
+    children?: React__default.ReactNode;
     /** Dodatečná CSS třída pro kořenový element. */
     className?: string;
     /** Další inline styly pro kořenový element. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Jednoduchý layout helper využívající CSS flexbox.
@@ -3675,7 +4664,7 @@ interface StackProps {
  * </Stack>
  * ```
  */
-declare const Stack: React.FC<StackProps>;
+declare const Stack: React__default.FC<StackProps>;
 
 type ContainerMaxWidth = 'sm' | 'md' | 'lg' | 'xl';
 interface ContainerProps {
@@ -3702,11 +4691,11 @@ interface ContainerProps {
     /**
      * Potomci vykreslení uvnitř kontejneru.
      */
-    children?: React.ReactNode;
+    children?: React__default.ReactNode;
     /** Dodatečná CSS třída pro kořenový element. */
     className?: string;
     /** Další inline styly pro kořenový element. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Layout kontejner s maximální šířkou a volitelným centrováním.
@@ -3727,15 +4716,16 @@ interface ContainerProps {
  * </Container>
  * ```
  */
-declare const Container: React.FC<ContainerProps>;
+declare const Container: React__default.FC<ContainerProps>;
 
+type DragListSize = 'sm' | 'md';
 interface DragListItem {
     /** Unikátní identifikátor položky. */
     id: string;
     /** Textový popisek položky. */
     label: string;
     /** Volitelná ikona zobrazená před popiskem. */
-    icon?: React.ReactNode;
+    icon?: React__default.ReactNode;
     /** Potomci položky (pro stromový režim). */
     children?: DragListItem[];
     /** Zda je položka rozbalena (pro stromový režim). @default false */
@@ -3747,8 +4737,8 @@ interface DragListItem {
 interface DragHandleProps {
     /** Spread na element, který má sloužit jako drag handle. */
     handleProps: {
-        onMouseDown: (e: React.MouseEvent) => void;
-        style: React.CSSProperties;
+        onMouseDown: (e: React__default.MouseEvent) => void;
+        style: React__default.CSSProperties;
         'aria-label': string;
     };
     /** Zda je položka právě přetahována. */
@@ -3767,6 +4757,12 @@ interface DragListProps {
     items: DragListItem[];
     /** Callback volaný při změně pořadí položek. */
     onReorder: (items: DragListItem[]) => void;
+    /**
+     * Voláno při rozbalení / sbalení uzlu (chevron i auto-expand při přetahování)
+     * s celým stromem s přepnutým `expanded`. Pokud je zadáno, `onReorder` se pro
+     * rozbalení nevolá, takže konzument odliší změnu dat od změny zobrazení.
+     */
+    onExpandedChange?: (id: string, expanded: boolean, items: DragListItem[]) => void;
     /**
      * Vlastní vykreslovací funkce pro položku.
      * Přijímá `item`, `dragHandleProps` a další metadata.
@@ -3782,7 +4778,7 @@ interface DragListProps {
      * )}
      * ```
      */
-    renderItem?: (item: DragListItem, props: DragHandleProps) => React.ReactNode;
+    renderItem?: (item: DragListItem, props: DragHandleProps) => React__default.ReactNode;
     /** Povolí vnořování položek (stromový režim). @default false */
     allowNesting?: boolean;
     /** Maximální hloubka vnoření. @default 3 */
@@ -3793,10 +4789,16 @@ interface DragListProps {
      * @default 'full'
      */
     dragMode?: 'full' | 'handle';
+    /**
+     * Hustota řádků. `'sm'` = kompaktní řádky (36px, menší mezery a odsazení)
+     * pro dlouhé osnovy, `'md'` = výchozí vzhled. Chování přetahování se nemění.
+     * @default 'md'
+     */
+    size?: DragListSize;
     /** Dodatečná CSS třída. */
     className?: string;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * Přetahovací seznam dle SM-UI design systému.
@@ -3820,7 +4822,7 @@ interface DragListProps {
  * />
  * ```
  */
-declare const DragList: React.FC<DragListProps>;
+declare const DragList: React__default.FC<DragListProps>;
 
 interface SortableListProps<T> {
     /** Datové položky. */
@@ -3828,7 +4830,7 @@ interface SortableListProps<T> {
     /** Stable key pro React reconciliation + drag tracking. */
     keyExtractor: (item: T) => string | number;
     /** Render každé položky. dragHandle je DOM node co lze umístit kdekoli. */
-    renderItem: (item: T, dragHandle: React.ReactNode) => React.ReactNode;
+    renderItem: (item: T, dragHandle: React__default.ReactNode) => React__default.ReactNode;
     /** Po dokončení dragu, nové pořadí celého arraye. */
     onReorder: (newOrder: T[]) => void;
     /** Osa řazení. @default 'vertical' */
@@ -3840,7 +4842,7 @@ interface SortableListProps<T> {
     /** Mezera mezi položkami. */
     gap?: number | string;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -3872,7 +4874,7 @@ interface SplitterProps {
     /** Směr rozdělení. horizontal = vertikální separátor. @default 'horizontal' */
     orientation?: 'horizontal' | 'vertical';
     /** Dva nebo více panelů. */
-    children: React.ReactNode[];
+    children: React__default.ReactNode[];
     /** Iniciální velikosti v procentech. @default rovnoměrně */
     defaultSizes?: number[];
     /** Min velikost per panel v px. */
@@ -3888,7 +4890,7 @@ interface SplitterProps {
     /** Vypne resize. @default false */
     disabled?: boolean;
     /** Další inline styly. */
-    style?: React.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Dodatečná CSS třída. */
     className?: string;
 }
@@ -3906,14 +4908,309 @@ interface SplitterProps {
  * </Splitter>
  * ```
  */
-declare const Splitter: React.FC<SplitterProps>;
+declare const Splitter: React__default.FC<SplitterProps>;
 
 type Theme = 'light' | 'dark';
 /**
  * Zjistí aktuální téma aplikace.
  * Výchozí je 'light'. Pokud je na html/body nastaven `data-theme`, použije se.
  * Jinak funguje fallback na systémové preference (prefers-color-scheme).
+ *
+ * Hodnota je správná už při prvním vykreslení (žádné bliknutí světlého motivu)
+ * a hook funguje i bez `matchMedia` (jsdom, SSR).
  */
 declare const useTheme: () => Theme;
 
-export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, Alert, type AlertProps, type AlertVariant, AppSidebar, type AppSidebarProps, Avatar, type AvatarProps, type AvatarSize, AvatarStack, type AvatarStackProps, Badge, type BadgeProps, Banner, type BannerPosition, type BannerProps, type BannerVariant, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Button, type ButtonAsAnchorProps, type ButtonAsButtonProps, type ButtonIconPosition, type ButtonProps, type ButtonSize, type ButtonVariant, Calendar, type CalendarEvent, type CalendarProps, Card, type CardProps, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, type CheckboxSize, ColorPicker, type ColorPickerProps, Combobox, type ComboboxOption, type ComboboxProps, type ComboboxSize, type CommandGroup, type CommandItem, CommandMenu, type CommandMenuProps, ConfirmDialog, type ConfirmDialogProps, Container, type ContainerMaxWidth, type ContainerProps, CopyButton, type CopyButtonProps, type Country, type CropArea, type CropShape, DataGrid, type DataGridColumn, type DataGridProps, DataList, type DataListItem, type DataListProps, DatePicker, DatePickerGroup, type DatePickerGroupProps, type DatePickerProps, type DatePickerSize, Divider, type DividerOrientation, type DividerProps, type DragHandleProps, DragList, type DragListItem, type DragListProps, Drawer, type DrawerProps, DropdownMenu, type DropdownMenuItem, type DropdownMenuProps, EmptyState, type EmptyStatePreset, type EmptyStateProps, FileUpload, type FileUploadProps, FormField, type FormFieldProps, FormWizard, type FormWizardProps, type FormWizardStep, IconButton, type IconButtonProps, ImageCropper, type ImageCropperProps, Input, InputGroup, type InputGroupProps, type InputProps, type InputSize, Link, type LinkProps, type LinkVariant, MobileDataCard, type MobileDataCardColumn, type MobileDataCardProps, Modal, type ModalProps, Navbar, type NavbarProps, Notification, type NotificationProps, type NotificationVariant, NumberInput, type NumberInputProps, type NumberInputSize, type NumberInputVariant, OTPInput, type OTPInputProps, Pagination, type PaginationProps, PhoneInput, type PhoneInputProps, type PhoneInputSize, Popover, type PopoverProps, ProgressBar, type ProgressBarProps, type ProgressBarSize, ProgressCircle, type ProgressCircleProps, type ProgressThreshold, type ProgressVariant, Radio, RadioGroup, type RadioGroupOption, type RadioGroupProps, type RadioProps, type RadioSize, Rating, type RatingProps, type RatingSize, SegmentedControl, type SegmentedControlItem, type SegmentedControlProps, type SegmentedControlSize, Select, SelectGroup, type SelectGroupProps, type SelectOption, type SelectProps, Sheet, type SheetProps, SidebarItem, type SidebarItemProps, Skeleton, type SkeletonProps, Slider, type SliderProps, type SliderSize, SortableList, type SortableListProps, Spinner, type SpinnerProps, type SpinnerSize, Splitter, type SplitterProps, Spotlight, type SpotlightItem, type SpotlightProps, Stack, type StackAlign, type StackDirection, type StackJustify, type StackProps, Stat, type StatProps, StatusBadge, type StatusBadgeProps, type StatusBadgeStatus, type StepItem, Stepper, type StepperProps, Switch, type SwitchProps, type SwitchSize, Tab, TabPanel, type TabPanelProps, type TabProps, Table, type TableColumn, type TableProps, Tabs, type TabsProps, Tag, TagItem, type TagItemProps, type TagProps, Textarea, type TextareaProps, type TextareaResize, type TextareaSize, type Theme, Timeline, type TimelineItem, type TimelineProps, Toast, type ToastContextValue, type ToastOptions, type ToastPosition, type ToastProps, type ToastVariant, ToasterProvider, type ToasterProviderProps, Tooltip, type TooltipProps, Tree, type TreeNode, type TreeProps, type UploadedFile, useTheme, useToast };
+type OverlayKind = 'modal' | 'popover';
+/**
+ * Je `target` uvnitř overlaye `id` nebo uvnitř kteréhokoli overlaye,
+ * který je jeho potomkem (portál Selectu v Popoveru apod.)?
+ */
+declare function isInsideOverlayTree(id: string, target: EventTarget | null): boolean;
+interface OverlayContextValue {
+    id: string;
+    zIndex: number;
+}
+declare const OverlayContext: React.Context<OverlayContextValue | null>;
+/** Nejbližší nadřazený kit overlay (nebo `null` mimo overlay). */
+declare const useOverlayContext: () => OverlayContextValue | null;
+interface UseOverlayOptions {
+    /** Zda je overlay právě otevřený (registrovaný ve stacku). */
+    open: boolean;
+    /** `'modal'` = Modal / Drawer / Sheet / Spotlight, `'popover'` = plovoucí prvky. */
+    kind: OverlayKind;
+    /**
+     * Voláno při Escape, když je tento overlay nejvyšší. Předejte prázdnou
+     * funkci, pokud má overlay Escape pohltit bez zavření.
+     */
+    onEscape?: () => void;
+    /** DOM uzly, které se počítají jako "uvnitř" overlaye (trigger + panel). */
+    getNodes?: () => (Element | null | undefined)[];
+    /** Explicitní z-index; přepíše automatický výpočet. */
+    zIndex?: number;
+    /**
+     * Pasivní vrstva (Tooltip): dostane z-index nad rodiče, ale nepočítá se do
+     * `useOverlayState()` a nepohltí Escape.
+     * @default false
+     */
+    passive?: boolean;
+}
+interface UseOverlayResult {
+    /** Identifikátor overlaye. */
+    id: string;
+    /** Vypočtený z-index (nad rodičem, nad vším otevřeným u modálních). */
+    zIndex: number;
+    /** Hodnota pro `<OverlayContext.Provider>` kolem obsahu overlaye. */
+    contextValue: OverlayContextValue;
+    /** Je `target` uvnitř tohoto overlaye nebo jeho potomků? */
+    contains: (target: EventTarget | null) => boolean;
+}
+/**
+ * Registruje overlay do sdíleného stacku. Použitelné i pro vlastní vrstvy
+ * konzumenta (např. průvodce nad modalem), aby Escape nezavřel kit dialog pod ní.
+ *
+ * @example
+ * ```tsx
+ * const { zIndex, contextValue } = useOverlay({ open, kind: 'modal', onEscape: onClose });
+ * return open ? createPortal(
+ *   <OverlayContext.Provider value={contextValue}>
+ *     <div style={{ position: 'fixed', inset: 0, zIndex }}>…</div>
+ *   </OverlayContext.Provider>, document.body) : null;
+ * ```
+ */
+declare function useOverlay({ open, kind, onEscape, getNodes, zIndex: explicitZ, passive }: UseOverlayOptions): UseOverlayResult;
+interface OverlayState {
+    /** Je otevřený alespoň jeden kit overlay? */
+    open: boolean;
+    /** Počet otevřených overlayů. */
+    count: number;
+    /** Druh nejvyššího overlaye. */
+    topKind: OverlayKind | null;
+}
+/**
+ * Stav sdíleného overlay stacku. Hodí se pro vypnutí globálních klávesových
+ * zkratek, dokud je otevřený modal / dropdown.
+ *
+ * @example
+ * ```tsx
+ * const { open } = useOverlayState();
+ * useHotkey('n', createTask, { enabled: !open });
+ * ```
+ */
+declare function useOverlayState(): OverlayState;
+
+/**
+ * Vrací `true`, pokud má uživatel v systému zapnuté omezení animací
+ * (`prefers-reduced-motion: reduce`). Kit pak animace overlayů vynechá.
+ */
+declare const useReducedMotion: () => boolean;
+
+declare const colors: {
+    readonly primary: "#FC4F00";
+    readonly primaryHover: "#FF6D2A";
+    readonly primaryAlpha: "rgba(246,84,14,0.8)";
+    readonly error: "#EF3838";
+    readonly success: "#00A205";
+    readonly info: "#2D7FF9";
+    readonly warning: "#F5A623";
+};
+declare const themeTokens: {
+    readonly dark: {
+        readonly background: "#1a1a1a";
+        readonly surface: "rgba(24,24,24,0.95)";
+        readonly surfaceGlass: "rgba(24,24,24,0.8)";
+        readonly panelBg: "rgba(24,24,24,0.65)";
+        readonly panelBorder: "rgba(255,255,255,0.1)";
+        readonly inputBg: "rgba(3,3,3,0.75)";
+        readonly inputBorder: "rgba(255,255,255,0.3)";
+        readonly text: "#ffffff";
+        readonly textSecondary: "#eaeaea";
+        readonly textMuted: "#888888";
+        readonly placeholder: "#ACACAC";
+        readonly border: "rgba(255,255,255,0.1)";
+        readonly divider: "rgba(255,255,255,0.08)";
+        readonly hover: "rgba(255,255,255,0.06)";
+        readonly overlay: "rgba(0,0,0,0.4)";
+    };
+    readonly light: {
+        readonly background: "#ffffff";
+        readonly surface: "rgba(255,255,255,0.95)";
+        readonly surfaceGlass: "rgba(255,255,255,0.8)";
+        readonly panelBg: "rgba(255,255,255,0.65)";
+        readonly panelBorder: "rgba(0,0,0,0.08)";
+        readonly inputBg: "rgba(255,255,255,0.85)";
+        readonly inputBorder: "rgba(0,0,0,0.2)";
+        readonly text: "#1a1a1a";
+        readonly textSecondary: "#333333";
+        readonly textMuted: "#999999";
+        readonly placeholder: "#888888";
+        readonly border: "rgba(0,0,0,0.08)";
+        readonly divider: "rgba(0,0,0,0.06)";
+        readonly hover: "rgba(0,0,0,0.04)";
+        readonly overlay: "rgba(0,0,0,0.18)";
+    };
+};
+declare const glass: {
+    /** Dropdowny, popovery, tooltipy. */
+    readonly blur: "blur(20px)";
+    /** Modal, Drawer, Sheet, Spotlight (panely). */
+    readonly panelBlur: "blur(32px) saturate(1.4)";
+    /** Overlay pod panelem. */
+    readonly backdropBlur: "blur(8px)";
+};
+declare const shadows: {
+    readonly dark: {
+        readonly elevated: "0 12px 40px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,255,255,0.04) inset";
+        readonly high: "0 24px 60px rgba(0,0,0,0.6), 0 0 0 1px rgba(255,255,255,0.04) inset";
+    };
+    readonly light: {
+        readonly elevated: "0 12px 40px rgba(0,0,0,0.12), 0 0 0 1px rgba(0,0,0,0.03) inset";
+        readonly high: "0 24px 60px rgba(0,0,0,0.15), 0 0 0 1px rgba(0,0,0,0.03) inset";
+    };
+};
+declare const radius: {
+    readonly tag: 4;
+    readonly kbd: 6;
+    readonly button: 8;
+    readonly input: 8;
+    readonly badge: 12;
+    readonly card: 12;
+    readonly dropdown: 12;
+    readonly modal: 16;
+};
+declare const fonts: {
+    readonly body: "'Zalando Sans', sans-serif";
+    readonly heading: "'Zalando Sans Expanded', sans-serif";
+};
+/** Typografie popisku formulářového pole (uppercase label nad Input / Select…). */
+declare const fieldLabel: {
+    readonly fontFamily: "'Zalando Sans Expanded', sans-serif";
+    readonly fontStyle: "normal";
+    readonly fontWeight: 400;
+    readonly fontSize: "10px";
+    readonly lineHeight: "normal";
+    readonly textTransform: "uppercase";
+    readonly userSelect: "none";
+};
+declare const animation: {
+    readonly duration: 180;
+    readonly easing: "cubic-bezier(0.16, 1, 0.3, 1)";
+    readonly hover: "0.12s ease";
+};
+/**
+ * Výchozí z-index škála. Skutečné hodnoty čtou komponenty z CSS proměnných
+ * `--sm-ui-z-overlay`, `--sm-ui-z-popover`, `--sm-ui-z-toast`; tyto konstanty
+ * jsou jejich fallbacky.
+ *
+ * Vnořené overlaye (Modal v Draweru, Select v Modalu…) dostávají z-index
+ * `rodič + 1`, takže kit může nad základ vystoupat o počet současně otevřených
+ * vrstev. Vlastní vrstvy nad kitem (mimo toasty) umisťujte nad `popover + 20`.
+ */
+declare const Z_INDEX: {
+    readonly overlay: 99998;
+    readonly popover: 99999;
+    readonly toast: 100050;
+};
+type ZIndexKind = keyof typeof Z_INDEX;
+/** Přečte z-index základ z CSS proměnné (fallback `Z_INDEX`). */
+declare function getZIndexBase(kind: ZIndexKind): number;
+declare const tokens: {
+    readonly colors: {
+        readonly primary: "#FC4F00";
+        readonly primaryHover: "#FF6D2A";
+        readonly primaryAlpha: "rgba(246,84,14,0.8)";
+        readonly error: "#EF3838";
+        readonly success: "#00A205";
+        readonly info: "#2D7FF9";
+        readonly warning: "#F5A623";
+    };
+    readonly theme: {
+        readonly dark: {
+            readonly background: "#1a1a1a";
+            readonly surface: "rgba(24,24,24,0.95)";
+            readonly surfaceGlass: "rgba(24,24,24,0.8)";
+            readonly panelBg: "rgba(24,24,24,0.65)";
+            readonly panelBorder: "rgba(255,255,255,0.1)";
+            readonly inputBg: "rgba(3,3,3,0.75)";
+            readonly inputBorder: "rgba(255,255,255,0.3)";
+            readonly text: "#ffffff";
+            readonly textSecondary: "#eaeaea";
+            readonly textMuted: "#888888";
+            readonly placeholder: "#ACACAC";
+            readonly border: "rgba(255,255,255,0.1)";
+            readonly divider: "rgba(255,255,255,0.08)";
+            readonly hover: "rgba(255,255,255,0.06)";
+            readonly overlay: "rgba(0,0,0,0.4)";
+        };
+        readonly light: {
+            readonly background: "#ffffff";
+            readonly surface: "rgba(255,255,255,0.95)";
+            readonly surfaceGlass: "rgba(255,255,255,0.8)";
+            readonly panelBg: "rgba(255,255,255,0.65)";
+            readonly panelBorder: "rgba(0,0,0,0.08)";
+            readonly inputBg: "rgba(255,255,255,0.85)";
+            readonly inputBorder: "rgba(0,0,0,0.2)";
+            readonly text: "#1a1a1a";
+            readonly textSecondary: "#333333";
+            readonly textMuted: "#999999";
+            readonly placeholder: "#888888";
+            readonly border: "rgba(0,0,0,0.08)";
+            readonly divider: "rgba(0,0,0,0.06)";
+            readonly hover: "rgba(0,0,0,0.04)";
+            readonly overlay: "rgba(0,0,0,0.18)";
+        };
+    };
+    readonly glass: {
+        /** Dropdowny, popovery, tooltipy. */
+        readonly blur: "blur(20px)";
+        /** Modal, Drawer, Sheet, Spotlight (panely). */
+        readonly panelBlur: "blur(32px) saturate(1.4)";
+        /** Overlay pod panelem. */
+        readonly backdropBlur: "blur(8px)";
+    };
+    readonly shadows: {
+        readonly dark: {
+            readonly elevated: "0 12px 40px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,255,255,0.04) inset";
+            readonly high: "0 24px 60px rgba(0,0,0,0.6), 0 0 0 1px rgba(255,255,255,0.04) inset";
+        };
+        readonly light: {
+            readonly elevated: "0 12px 40px rgba(0,0,0,0.12), 0 0 0 1px rgba(0,0,0,0.03) inset";
+            readonly high: "0 24px 60px rgba(0,0,0,0.15), 0 0 0 1px rgba(0,0,0,0.03) inset";
+        };
+    };
+    readonly radius: {
+        readonly tag: 4;
+        readonly kbd: 6;
+        readonly button: 8;
+        readonly input: 8;
+        readonly badge: 12;
+        readonly card: 12;
+        readonly dropdown: 12;
+        readonly modal: 16;
+    };
+    readonly fonts: {
+        readonly body: "'Zalando Sans', sans-serif";
+        readonly heading: "'Zalando Sans Expanded', sans-serif";
+    };
+    readonly fieldLabel: {
+        readonly fontFamily: "'Zalando Sans Expanded', sans-serif";
+        readonly fontStyle: "normal";
+        readonly fontWeight: 400;
+        readonly fontSize: "10px";
+        readonly lineHeight: "normal";
+        readonly textTransform: "uppercase";
+        readonly userSelect: "none";
+    };
+    readonly animation: {
+        readonly duration: 180;
+        readonly easing: "cubic-bezier(0.16, 1, 0.3, 1)";
+        readonly hover: "0.12s ease";
+    };
+    readonly zIndex: {
+        readonly overlay: 99998;
+        readonly popover: 99999;
+        readonly toast: 100050;
+    };
+};
+
+export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, Alert, type AlertProps, type AlertVariant, AppSidebar, type AppSidebarProps, AreaChart, Avatar, type AvatarProps, type AvatarSize, AvatarStack, type AvatarStackProps, Badge, type BadgeProps, type BadgeSize, type BadgeVariant, Banner, type BannerPosition, type BannerProps, type BannerVariant, BarChart, type BarChartProps, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Button, type ButtonAsAnchorProps, type ButtonAsButtonProps, type ButtonIconPosition, type ButtonProps, type ButtonSize, type ButtonVariant, CHART_PALETTE, Calendar, type CalendarEvent, type CalendarProps, Card, type CardProps, type ChartSeries, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, type CheckboxSize, ColorPicker, type ColorPickerProps, Combobox, type ComboboxFilter, type ComboboxMultipleProps, type ComboboxOption, type ComboboxProps, type ComboboxSingleClearableProps, type ComboboxSingleProps, type ComboboxSize, type ComboboxValue, type CommandGroup, type CommandItem, CommandMenu, type CommandMenuProps, type ConfirmContent, type ConfirmContentContext, ConfirmDialog, type ConfirmDialogProps, type ConfirmOptions, ConfirmProvider, Container, type ContainerMaxWidth, type ContainerProps, CopyButton, type CopyButtonProps, type Country, type CropArea, type CropShape, DataGrid, type DataGridColumn, type DataGridProps, DataList, type DataListItem, type DataListProps, DatePicker, DatePickerGroup, type DatePickerGroupProps, type DatePickerProps, type DatePickerSize, Divider, type DividerOrientation, type DividerProps, DonutChart, type DragHandleProps, DragList, type DragListItem, type DragListProps, type DragListSize, Drawer, type DrawerProps, DropdownMenu, type DropdownMenuItem, type DropdownMenuPosition, type DropdownMenuProps, EmptyState, type EmptyStatePreset, type EmptyStateProps, FieldLabel, type FieldLabelProps, FileUpload, type FileUploadProps, type FocusTrapInitialFocus, FormField, type FormFieldProps, FormWizard, type FormWizardProps, type FormWizardStep, IconButton, type IconButtonProps, ImageCropper, type ImageCropperProps, Input, InputGroup, type InputGroupProps, type InputProps, type InputSize, type InputVariant, type LegendPosition, LineChart, type LineChartProps, Link, type LinkProps, type LinkVariant, MobileDataCard, type MobileDataCardColumn, type MobileDataCardProps, Modal, type ModalBreakpoint, type ModalProps, Navbar, type NavbarProps, Notification, type NotificationProps, type NotificationVariant, NumberInput, type NumberInputEmptyProps, type NumberInputProps, type NumberInputSize, type NumberInputStrictProps, type NumberInputVariant, OTPInput, type OTPInputProps, OverlayContext, type OverlayContextValue, type OverlayKind, type OverlayState, Pagination, type PaginationProps, PhoneInput, type PhoneInputProps, type PhoneInputSize, PieChart, type PieChartProps, type PieDatum, Popover, type PopoverAlign, type PopoverPosition, type PopoverProps, ProgressBar, type ProgressBarProps, type ProgressBarSize, ProgressCircle, type ProgressCircleProps, type ProgressThreshold, type ProgressVariant, Radio, RadioGroup, type RadioGroupOption, type RadioGroupProps, type RadioProps, type RadioSize, Rating, type RatingProps, type RatingSize, SegmentedControl, type SegmentedControlItem, type SegmentedControlProps, type SegmentedControlSize, Select, SelectGroup, type SelectGroupProps, type SelectMultipleProps, type SelectOption, type SelectOptionGroup, type SelectOptions, type SelectProps, type SelectSingleClearableProps, type SelectSingleProps, type SelectSize, type SelectValue, Sheet, type SheetProps, SidebarItem, type SidebarItemProps, Skeleton, type SkeletonProps, Slider, type SliderProps, type SliderSize, SortableList, type SortableListProps, Sparkline, type SparklineProps, Spinner, type SpinnerProps, type SpinnerSize, Splitter, type SplitterProps, Spotlight, type SpotlightItem, type SpotlightProps, Stack, type StackAlign, type StackDirection, type StackJustify, type StackProps, Stat, type StatProps, StatusBadge, type StatusBadgeProps, type StatusBadgeStatus, type StepItem, Stepper, type StepperProps, Switch, type SwitchProps, type SwitchSize, Tab, TabPanel, type TabPanelProps, type TabProps, Table, type TableColumn, type TableProps, Tabs, type TabsProps, Tag, TagItem, type TagItemProps, type TagProps, Textarea, type TextareaProps, type TextareaResize, type TextareaSize, type Theme, type ThemedColor, Timeline, type TimelineItem, type TimelineProps, Toast, type ToastContextValue, type ToastOptions, type ToastPosition, type ToastProps, type ToastVariant, ToasterProvider, type ToasterProviderProps, Tooltip, type TooltipProps, Tree, type TreeNode, type TreeProps, type UploadedFile, type UseFocusTrapOptions, type UseOverlayOptions, type UseOverlayResult, type ZIndexKind, Z_INDEX, animation, colors, fieldLabel, fonts, getZIndexBase, glass, isInsideOverlayTree, radius, shadows, themeTokens, tokens, useConfirm, useFocusTrap, useOverlay, useOverlayContext, useOverlayState, useReducedMotion, useTheme, useToast };