@konce-pt/angular 0.2.0 → 0.4.0

package/dist/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@konce-pt/angular",
-  "version": "0.2.0",
+  "version": "0.4.0",
   "description": "Open-source Angular 22 component library on Signals & Signal Forms — 70+ components, rich data table, zoneless, fully tokenized. Selektory kpt-*, klasy Kpt*.",
   "license": "MIT",
   "author": "konce.pt",

package/dist/src/lib/accordion/llms.txt

@@ -5,6 +5,8 @@ Import: `import { KptAccordion, KptAccordionPanel } from '@konce-pt/angular';`
 
 ## KptAccordion
 - `multi`: boolean — pozwala otworzyć wiele naraz (domyślnie: tylko jeden)
+- `animated`: boolean (domyślnie true) — animacja rozwijania paneli (CSS grid, czysty CSS)
+- `animationDuration`: number (domyślnie 500) — czas animacji w ms (dziedziczone przez panele)
 
 ## KptAccordionPanel
 - `title`: string (wymagane); `disabled`: boolean; `expanded`: model<boolean>

package/dist/src/lib/card/llms.txt

@@ -9,16 +9,37 @@ Import: `import { KptCard } from '@konce-pt/angular';`
 ## Wejścia
 - `variant`: 'elevated' | 'outlined' (domyślnie 'elevated')
 - `header`: string — opcjonalny tekst nagłówka
+- `flush`: boolean — body bez paddingu (dla bogatych układów zarządzających sekcjami)
 
 ## Projekcja
 - treść domyślna → body karty
 - element z atrybutem `kptCardFooter` (bezpośrednie dziecko `kpt-card`) → stopka
 
+## Reużywalne klasy układu (media / profil)
+- `kpt-card__media` — obraz na całą szerokość (przycięty do promienia; ustaw `aspect-ratio`/`height` inline)
+- `kpt-card__lead` — wiersz nagłówka (awatar + tytuły), padding
+- `kpt-card__title`, `kpt-card__subtitle` — typografia tytułu/podtytułu
+- `kpt-card__section` — sekcja z paddingiem (kolumna z odstępami)
+- `kpt-card__tags` — wiersz chipów; `kpt-card__meta` — wiersz ikona+tekst (ocena/lokalizacja)
+- `kpt-card__avatar` — nachodzący awatar z ringiem (na okładce)
+- `kpt-card__actions` — wiersz przycisków (równe szerokości)
+
 ## Przykład
     <kpt-card header="Ustawienia" variant="outlined">
       <p>Treść…</p>
       <div kptCardFooter><kpt-button>Zapisz</kpt-button></div>
     </kpt-card>
 
+    <!-- media card -->
+    <kpt-card variant="outlined" flush>
+      <div class="kpt-card__lead">
+        <kpt-avatar src="/u.jpg" />
+        <div><div class="kpt-card__title">Shiba Inu</div><div class="kpt-card__subtitle">Dog Breed</div></div>
+      </div>
+      <img class="kpt-card__media" src="/foto.jpg" alt="" style="aspect-ratio: 4/3" />
+      <div class="kpt-card__section">Opis…</div>
+      <div kptCardFooter><kpt-button variant="text" size="sm">LIKE</kpt-button></div>
+    </kpt-card>
+
 ## Tokeny
 `--kpt-card-{bg,fg,border,radius,padding,shadow}`.

package/dist/src/lib/confirm/llms.txt

@@ -11,6 +11,10 @@ Import: `import { KptConfirmService, KptConfirmContainer } from '@konce-pt/angul
 - `message`: string (wymagane); `header?`: string
 - `acceptLabel?`/`rejectLabel?`: string; `variant?`: 'filled' | 'danger'; `icon?`: string
 
+## i18n
+Domyślne etykiety (nagłówek, Potwierdź, Anuluj) z i18n (namespace `confirm`); pola opcji mają priorytet.
+Domyślnie EN; konfiguracja przez `provideKptI18n` — patrz `i18n/llms.txt`.
+
 ## Przykład
     const ok = await this.confirm.confirm({
       message: 'Usunąć rekord?', variant: 'danger', acceptLabel: 'Usuń', icon: 'alert-triangle',

package/dist/src/lib/data-table/llms.txt

@@ -2,26 +2,39 @@
 
 Flagowa tabela danych: kolumny konfiguracją, sortowanie, filtr globalny,
 paginacja, zaznaczanie wierszy i własne szablony komórek. Sygnałowa, OnPush.
-Import: `import { KptDataTable, KptColumn, KptCellDef } from '@konce-pt/angular';`
+Import: `import { KptDataTable, KptColumn, KptCellDef, KptRowDetailDef } from '@konce-pt/angular';`
 
 ## Selektor
 `kpt-data-table`
 
 ## Model kolumny (KptColumn)
-`{ field: string; header: string; sortable?: boolean; align?: 'start'|'center'|'end'; width?: string; frozen?: boolean }`
+`{ field: string; header: string; sortable?: boolean; align?: 'start'|'center'|'end'; width?: string; frozen?: boolean; filter?: KptColumnFilter }`
 Kolumny `frozen` (wiodące, sąsiadujące) przyklejają się przy poziomym przewijaniu — wymagają `width`.
 
+### Filtr kolumny (KptColumnFilter)
+`{ type: 'text'|'number'|'select'|'dateRange'|'numberRange'|'slider'; options?: KptOption[]; multiple?: boolean; placeholder?: string; min?: number; max?: number; step?: number }`
+Gdy którakolwiek kolumna ma `filter`, w nagłówku renderuje się wiersz filtrów:
+- `text` — input tekstowy (dopasowanie „zawiera"), `number` — input tylko cyfry (dopasowanie po cyfrach),
+- `select` — lista wyboru (z `multiple` = wiele; dopasowanie OR). Gdy wartość pola jest **tablicą** (np. lista tagów/członków), dopasowuje, gdy tablica zawiera dowolną z wybranych wartości,
+- `numberRange` — dwa pola (min–max); dopasowuje, gdy liczbowa wartość pola mieści się w zakresie (puste ograniczenie = otwarte),
+- `slider` — suwak zakresu (dwa uchwyty; `min`/`max`/`step`); wartość filtra to `[lo, hi]`, dopasowuje liczbę w `[lo, hi]`,
+- `dateRange` — zakres dat (pole ISO/Date w `[start,end]`).
+Filtry kolumn łączą się AND ze sobą i z filtrem globalnym; zmiana resetuje stronę.
+Filtry działają na **surowej wartości pola** (`row[field]`), niezależnie od własnego szablonu `kptCell` — można filtrować także kolumny z custom cell (np. status-badge).
+Filtry `select`/`dateRange` wymagają `import '@angular/cdk/overlay-prebuilt.css';`.
+
 ## Wejścia
 - `columns`: KptColumn[] (wymagane)
 - `data`: T[] (domyślnie [])
 - `filterable`: boolean — pole filtra globalnego
+- `filterRowPosition`: 'top' | 'bottom' (domyślnie 'bottom') — wiersz filtrów kolumn nad/pod etykietami
 - `pageSize`: number — 0 wyłącza paginację
 - `pageSizeOptions`: number[] (domyślnie [5,10,20,50])
 - `selectable`: 'none' | 'single' | 'multiple'
 - `loading`: boolean — wiersz „Ładowanie…"
-- `emptyMessage`: string (domyślnie „Brak danych")
+- `emptyMessage`: string — bez wartości używa i18n (`dataTable.empty`); input ma priorytet
 - `rowKey`: string | null — pole identyfikujące wiersz (dla zaznaczania); bez niego porównanie po referencji
-- `reorderable`: boolean — przestawianie kolumn przeciągnij-i-upuść (natywny HTML5 DnD)
+- `reorderable`: boolean — przestawianie kolumn przeciągnij-i-upuść (natywny HTML5 DnD); kolumny `frozen` są wyłączone z przenoszenia (pozostają wiodące) i nie można upuszczać innych kolumn przed nie
 - `exportable`: boolean — przycisk „Eksport CSV" w toolbarze
 - `exportFilename`: string (domyślnie 'export.csv')
 - `lazy`: boolean — tryb serwerowy (bez filtr/sort/paginacji po stronie klienta)
@@ -29,11 +42,14 @@ Kolumny `frozen` (wiodące, sąsiadujące) przyklejają się przy poziomym przew
 - `scrollHeight`: string | null — wysokość przewijalnego obszaru (np. '400px'); sticky header pozostaje
 - `virtualScroll`: boolean — wirtualizacja wierszy (renderuje tylko widoczne); wymaga `scrollHeight`
 - `rowHeight`: number — stała wysokość wiersza w px (domyślnie 41), potrzebna przy virtualScroll
+- `expandable`: boolean — kolumna z przełącznikiem rozwijającym wiersz (renderuje szablon `kptRowDetail`)
+- `multiExpand`: boolean (domyślnie true) — pozwala rozwinąć wiele wierszy naraz; false = tylko jeden
 
 ## Model / zdarzenia
 - `selection`: model<T[]> — dwukierunkowe `[(selection)]`
+- `expandedRows`: model<T[]> — dwukierunkowe `[(expandedRows)]` (rozwinięte wiersze)
 - `rowClick`: output<T>
-- `lazyLoad`: output<KptTableLazyState> — { pageIndex, pageSize, sortField, sortDir, filter }; emitowane w trybie lazy przy każdej zmianie stanu
+- `lazyLoad`: output<KptTableLazyState> — { pageIndex, pageSize, sortField, sortDir, filter, columnFilters }; emitowane w trybie lazy przy każdej zmianie stanu
 
 ## Eksport / metody
 - `exportCsv()`: publiczna metoda — eksportuje bieżące (filtr+sort) dane do CSV (separator `;`, BOM dla Excela).
@@ -48,15 +64,33 @@ Kontekst: `$implicit` = wiersz, `value` = wartość pola.
       </ng-template>
     </kpt-data-table>
 
+## Rozwijane wiersze (dyrektywa kptRowDetail)
+Włącz `expandable` i podaj szablon `kptRowDetail` (kontekst: `$implicit` = wiersz).
+Dodaje wiodącą kolumnę z przełącznikiem; rozwinięty wiersz renderuje szablon w pełnej szerokości pod wierszem.
+Stan przez `[(expandedRows)]`; `multiExpand=false` ogranicza do jednego otwartego naraz.
+Niezależne od `selectable` (można łączyć z zaznaczaniem). Nieaktywne przy `virtualScroll`.
+
+    <kpt-data-table [columns]="cols" [data]="rows" expandable rowKey="id" [(expandedRows)]="open">
+      <ng-template kptRowDetail let-row>
+        <div class="detale">{{ row.opis }}</div>
+      </ng-template>
+    </kpt-data-table>
+
 ## Zachowanie
 - Sortowanie: klik w nagłówek sortowalnej kolumny cyklicznie asc → desc → brak.
 - Filtr: dopasowanie tekstu we wszystkich polach kolumn; reset strony do 0.
 - Zaznaczanie 'multiple': nagłówkowy checkbox zaznacza/odznacza bieżącą stronę.
 - Sticky header, stany pusty/ładowanie, wyrównanie i szerokości per kolumna.
 
+## i18n
+Etykiety toolbaru/stanów/aria (Szukaj, Eksport CSV, Ładowanie, Brak danych, zaznaczanie, filtry kolumn:
+Filtr/Filtr min/Filtr max z `{column}`, Wszystkie, min, max, Zakres dat) pochodzą z i18n (namespace `dataTable`).
+Domyślnie EN; konfiguracja przez `provideKptI18n` — patrz `i18n/llms.txt`.
+
 ## Tokeny
 `--kpt-table-{bg,fg,border,radius,header-bg,header-fg,row-hover,row-selected,cell-padding}`.
+Rozwijany wiersz: `--kpt-table-detail-bg` (fallback: surface-variant → row-hover).
 Paginacja: komponent `kpt-paginator`.
 
 ## Do zrobienia (roadmap)
-Kolumny grupowane, edycja komórek inline, wiersze rozwijane.
+Kolumny grupowane, edycja komórek inline.

package/dist/src/lib/date-range/llms.txt

@@ -1,18 +1,23 @@
 # KptDateRange (kpt-date-range)
 
-Wybór zakresu dat z kalendarzem (CDK Overlay) na Signal Forms.
-Wartość: `{ start: 'RRRR-MM-DD', end: 'RRRR-MM-DD' }` (KptDateRangeValue).
+Wybór zakresu dat/godzin z kalendarzem (CDK Overlay) na Signal Forms.
+`mode`: 'date' (domyślnie), 'datetime' (data+godzina, tarcza zegara `kpt-clock`), 'time' (sama godzina).
+Wartość `{ start, end }` (KptDateRangeValue): daty 'RRRR-MM-DD', datetime 'RRRR-MM-DDTHH:mm', godziny 'HH:mm'.
 Import: `import { KptDateRange, KptDateRangeValue } from '@konce-pt/angular';`
 Wymaga `import '@angular/cdk/overlay-prebuilt.css';`
 
 ## Wejścia / model
 - `value`: model<KptDateRangeValue> (lub `formField`)
-- `placeholder`: string (domyślnie 'Wybierz zakres')
+- `mode`: 'date' | 'datetime' | 'time' (domyślnie 'date')
+- `hourFormat`: 12 | 24 (domyślnie 24) — tarcza z AM/PM lub 24h; czas zawsze 24h w wartości
+- `minuteStep`: number (domyślnie 1) — snap minut na tarczy
+- `placeholder`: string — bez wartości używa i18n (`dateRange.placeholder`); input ma priorytet
+- `displayFormat`: 'pl' | 'iso' (domyślnie 'pl') — format wyświetlania start/end
 - `disabled`/`invalid`/`touched`: boolean; `touch`: output
 
 ## Zachowanie
-Pierwszy klik ustawia `start`, drugi `end` (kolejność jest normalizowana). Zakres podświetlany;
-przycisk „×" czyści wartość.
+Pierwszy klik ustawia `start`, drugi `end` (kolejność normalizowana). Zakres podświetlany; „×" czyści.
+Tryby datetime/time: przełącznik „Od / Koniec" + tarcza zegara, zatwierdzenie przyciskiem „Gotowe".
 
 ## Przykład
     <kpt-date-range [formField]="f.period" />
@@ -20,5 +25,9 @@ przycisk „×" czyści wartość.
 
     period = signal<KptDateRangeValue>({ start: '', end: '' });
 
+## i18n
+Nazwy dni/miesięcy z `Intl` wg locale; etykiety („Od/Koniec", nawigacja, „Gotowe", placeholder) z i18n
+(namespace `dateRange` + `datepicker`/`common`). Domyślnie EN — patrz `i18n/llms.txt`.
+
 ## Tokeny
 Pole `--kpt-form-field-*`; kalendarz `--kpt-color-surface-raised`, zakres `--kpt-color-primary`.

package/dist/src/lib/datepicker/llms.txt

@@ -1,17 +1,35 @@
 # KptDatepicker (kpt-datepicker)
 
-Wybór daty z własnym kalendarzem (CDK Overlay), Signal Forms. Wartość ISO 'RRRR-MM-DD',
-wyświetlana jako 'DD.MM.RRRR'. Tydzień od poniedziałku, dziś zaznaczone, zakres min/max.
+Wybór daty/godziny z własnym kalendarzem (CDK Overlay), Signal Forms. Granulacja przez
+`selectionMode`: data (domyślnie), miesiąc+rok, rok, miesiąc, data+godzina, sama godzina.
+Godzina na tarczy zegara (dwa etapy: godziny → minuty, klik lub przeciąganie), format 12/24h.
+Wyświetlanie wg `displayFormat` ('pl'/'iso'). Tydzień od poniedziałku, dziś zaznaczone, zakres min/max.
 Wymaga stylów overlay CDK: `import '@angular/cdk/overlay-prebuilt.css';`
 Import: `import { KptDatepicker } from '@konce-pt/angular';`
 
 ## Użycie
     <kpt-datepicker [formField]="f.birthDate" minDate="1900-01-01" maxDate="2030-12-31" />
+    <kpt-datepicker selectionMode="monthYear" [(value)]="period" />
+    <kpt-datepicker selectionMode="month" monthDisplay="long" [(value)]="month" />
+    <kpt-datepicker selectionMode="datetime" [hourFormat]="12" [(value)]="meetingAt" />
+    <kpt-datepicker selectionMode="time" [(value)]="alarm" />
 
 ## Wejścia
-- `value`: model<string> (ISO); `minDate`/`maxDate`: string|null; `placeholder`: string
+- `value`: model<string>; `minDate`/`maxDate`: string|null; `placeholder`: string
+- `selectionMode`: 'date' | 'monthYear' | 'year' | 'month' | 'datetime' | 'time' (domyślnie 'date').
+  Format wartości zależny od trybu: 'RRRR-MM-DD' / 'RRRR-MM' / 'RRRR' / 'MM' / 'RRRR-MM-DDTHH:mm' (datetime) / 'HH:mm' (time).
+- `hourFormat`: 12 | 24 (domyślnie 24) — tarcza z AM/PM (12) lub pierścieniem 13–00 (24); wartość zawsze 24h.
+- `minuteStep`: number (domyślnie 1) — snap minut na tarczy.
+- `monthDisplay`: 'long' | 'number' (domyślnie 'long') — w trybie 'month' i etykietach miesięcy: słownie (styczeń) lub liczbą (01)
+- `displayFormat`: 'pl' | 'iso' (domyślnie 'pl') — format wyświetlania i domyślnego placeholdera
 - `disabled`/`invalid`/`touched`: boolean; output `touch`.
-- Panel: nawigacja miesięcy (‹ ›), przycisk czyszczenia (×).
+- Panel: nawigacja (‹ ›) miesięcy/lat/dekad wg trybu; tarcza zegara z „Gotowe"; przycisk czyszczenia (×).
+
+## i18n
+Nazwy dni tygodnia i miesięcy są wyliczane z `Intl` wg aktywnego locale i18n (nie ze słownika).
+Etykiety nawigacji/aria i „Gotowe" z i18n (namespace `datepicker` + `common`). Domyślnie EN;
+konfiguracja przez `provideKptI18n` — patrz `i18n/llms.txt`. Uwaga: `displayFormat` ('pl'/'iso')
+steruje wyłącznie formatem daty i jest niezależny od języka etykiet.
 
 ## Tokeny
 `--kpt-form-field-{bg,text,border,border-focus,border-error,radius}`.

package/dist/src/lib/fieldset/llms.txt

@@ -6,6 +6,8 @@ Import: `import { KptFieldset } from '@konce-pt/angular';`
 ## Wejścia / model
 - `legend`: string
 - `toggleable`: boolean; `collapsed`: model<boolean>
+- `animated`: boolean (domyślnie true) — animacja zwijania (CSS grid, czysty CSS)
+- `animationDuration`: number (domyślnie 500) — czas animacji w ms
 - Treść: `<ng-content>`.
 
 ## Przykład

package/dist/src/lib/form-field/llms.txt

@@ -13,6 +13,22 @@ Import: `import { KptFormField } from '@konce-pt/angular';`
 - `error`: string | null — komunikat błędu; gdy niepusty, pole jest oznaczone jako nieprawidłowe
 - `required`: boolean — gwiazdka przy etykiecie
 - `controlId`: string — id kontrolki dla powiązania `label[for]`
+- `labelType`: 'fixed' | 'over' | 'in' | 'on' — wariant etykiety (domyślnie `fixed`)
+
+## Warianty etykiety (labelType)
+- `fixed` (domyślny) — statyczna etykieta nad kontrolką (jak dotychczas).
+- `over` — Float Label: etykieta unosi się nad obramowanie pola.
+- `in` — Float Label: etykieta unosi się do górnej części wewnątrz pola (pole wyższe, styl „filled").
+- `on` — Float Label: etykieta siada na górnym obramowaniu (notch, styl „outlined").
+
+Warianty float mają animowane przejście etykiety (pozycja spoczynkowa w miejscu placeholdera →
+uniesiona). Uniesienie następuje przy focusie kontrolki **lub** gdy pole ma wartość. Wykrywanie
+wypełnienia jest po stronie komponentu (zdarzenia `input`/`change` + wartość początkowa) — **nie**
+wymaga ustawiania placeholdera na kontrolce. Uwaga: wzorzec działa dla kontrolek `input`/`textarea`.
+
+    <kpt-form-field label="E-mail" labelType="over">
+      <kpt-input />
+    </kpt-form-field>
 
 ## Projekcja
 Kontrolkę umieszcza się w treści (ng-content):
@@ -31,6 +47,10 @@ Kontrolkę umieszcza się w treści (ng-content):
 
 ## Tokeny
 `--kpt-form-field-label`, `--kpt-form-field-hint`, `--kpt-form-field-error`, `--kpt-color-danger`.
+Warianty float dodatkowo: `--kpt-form-field-placeholder` (etykieta spoczynkowa),
+`--kpt-form-field-border-focus` (uniesiona), `--kpt-form-field-border-error` (stan błędu),
+`--kpt-form-field-bg` (maska notcha w `on`). Animacja: `--kpt-motion-duration-fast`,
+`--kpt-motion-easing-standard`; respektuje `prefers-reduced-motion`.
 
 ## Dostępność
 - Komunikat błędu ma `role="alert"`.

package/dist/src/lib/i18n/llms.txt

@@ -0,0 +1,35 @@
+# i18n (provideKptI18n / KptI18n)
+
+Tłumaczenia etykiet komponentów. Języki bazowe: EN (domyślny), PL. Oparte o sygnały (zoneless-friendly), bez zależności zewnętrznych.
+Import: `import { provideKptI18n, KptI18n } from '@konce-pt/angular';`
+
+## Konfiguracja (provider)
+- `provideKptI18n({ locale?, messages? }): EnvironmentProviders` — w `bootstrapApplication`.
+- `locale`: 'en' | 'pl' | dowolny string (domyślnie 'en').
+- `messages`: `Record<locale, DeepPartial<KptMessages>>` — rejestruje nowy język lub nadpisuje istniejący (deep-merge, brakujące klucze → EN).
+
+## Serwis KptI18n (providedIn: 'root')
+- `locale: Signal<KptLocale>` — bieżący język.
+- `setLocale(locale)` — zmiana w runtime (reaktywna dla wszystkich komponentów).
+- `registerMessages(locale, patch)` — dodaje/nadpisuje słownik w runtime.
+- `t(key, params?)` — tłumaczy klucz w notacji kropkowej (`'paginator.range'`) z interpolacją `{name}`.
+
+## Dodanie własnego języka (jeden plik JSON)
+    import de from './i18n/de.json'; // kształt = interfejs KptMessages
+    provideKptI18n({ locale: 'de', messages: { de } });
+    // runtime: inject(KptI18n).registerMessages('de', de); inject(KptI18n).setLocale('de');
+
+## Przełączanie języka w runtime
+    const i18n = inject(KptI18n);
+    i18n.setLocale('pl');
+
+## Kontrakt kluczy (KptMessages)
+Namespace'y: `common` (close/remove/previous/next/clear/done/all), `paginator` (rowsPerPage/range/prevPage/nextPage),
+`select`, `listbox`, `dataView`, `dataTable`, `confirm`, `fileUpload`, `chipsInput`, `dateRange`, `datepicker`,
+`pickList`, `orderList`, `inputNumber`, `password`, `spinner`, `speedDial`, `scrollTop`, `splitButton`, `panel`,
+`breadcrumb`, `richText`. Interpolacje: `paginator.range` ({start},{end},{total}), `dataTable.filter*` ({column}),
+`richText.styleHeading` ({level}). Nazwy dni/miesięcy w kalendarzach są wyliczane z `Intl` wg locale (nie ze słownika).
+
+## Uwaga
+Pojedyncze etykiety można też nadpisać per-komponent przez odpowiedni `input()` (np. `emptyMessage`, `acceptLabel`) —
+input ma priorytet nad słownikiem i18n.

package/dist/src/lib/icon/llms.txt

@@ -12,7 +12,9 @@ kolor z `currentColor`. Import: `import { KptIcon } from '@konce-pt/angular';`
 
 ## Dostępne nazwy (wbudowane)
 menu, x, chevron-up, chevron-down, chevron-left, chevron-right, check, search,
-grip-vertical, info, alert-triangle, circle-check, circle-x, calendar, copy, link, code.
+grip-vertical, info, alert-triangle, circle-check, circle-x, calendar, copy, link, code,
+star, phone, map-pin, world, clock, align-left, align-center, align-right, align-justified,
+palette, highlight, clipboard, clipboard-text, table (pełna lista w `icons.ts`).
 
 ## Pełny zestaw (5130 ikon Tabler)
 Opcjonalny entry point `@konce-pt/angular/icons` (pobierany tylko przy imporcie):

package/dist/src/lib/megamenu/llms.txt

@@ -2,6 +2,8 @@
 
 Mega-menu — pozioma belka z szerokim, wielokolumnowym panelem.
 Struktura: pozycja górna → `items` (kolumny) → każda kolumna `items` (odnośniki).
+Panel na CDK Overlay (doczepiany do `body`, nieprzycinany przez `overflow: hidden`).
+Wymaga `import '@angular/cdk/overlay-prebuilt.css';`
 Import: `import { KptMegamenu } from '@konce-pt/angular';`
 
 ## Wejścia / wyjścia

package/dist/src/lib/menubar/llms.txt

@@ -1,6 +1,8 @@
 # KptMenubar (kpt-menubar)
 
 Pozioma belka menu z rozwijanymi pod-menu. Pozycje bez `items` działają jak akcje.
+Pod-menu na CDK Overlay (doczepiane do `body`, nieprzycinane przez `overflow: hidden`).
+Wymaga `import '@angular/cdk/overlay-prebuilt.css';`
 Import: `import { KptMenubar } from '@konce-pt/angular';`
 
 ## Wejścia / wyjścia

package/dist/src/lib/paginator/llms.txt

@@ -16,3 +16,7 @@ Paginator sterowany sygnałami. Import: `import { KptPaginator } from '@konce-pt
 
 Pokazuje „X–Y z Z", wybór rozmiaru strony oraz przyciski poprzednia/następna.
 Przy zmianie długości/rozmiaru samoczynnie koryguje `pageIndex` (effect).
+
+## i18n
+Etykiety („Wierszy:", separator zakresu, aria stron) pochodzą z i18n (namespace `paginator`).
+Domyślny język EN; przełączenie/nadpisanie przez `provideKptI18n` — patrz `i18n/llms.txt`.

package/dist/src/lib/panel/llms.txt

@@ -6,6 +6,8 @@ Panel z nagłówkiem i opcjonalnym zwijaniem. Import: `import { KptPanel } from
 - `header`: string
 - `toggleable`: boolean — pokazuje przycisk zwijania
 - `collapsed`: model<boolean> (dwukierunkowe)
+- `animated`: boolean (domyślnie true) — animacja zwijania (CSS grid, czysty CSS)
+- `animationDuration`: number (domyślnie 500) — czas animacji w ms
 - Akcje nagłówka: projekcja `[kptPanelActions]`. Treść: `<ng-content>`.
 
 ## Przykład

package/dist/src/lib/rich-text/llms.txt

@@ -1,16 +1,42 @@
 # KptRichText (kpt-rich-text)
 
-Lekki edytor tekstu sformatowanego (contenteditable) z konfigurowalnym paskiem.
+Lekki edytor tekstu sformatowanego (contenteditable) z konfigurowalnym paskiem sekcji.
 Wartość = HTML. Bez zależności zewnętrznych. Signal Forms.
-Import: `import { KptRichText, KptRichTool } from '@konce-pt/angular';`
+Popover kolorów na CDK Overlay — wymaga `import '@angular/cdk/overlay-prebuilt.css';`
+Import: `import { KptRichText, KptRichTool, KptRichToolbar } from '@konce-pt/angular';`
 
 ## Wejścia
 - `value`: model<string> (HTML)
-- `toolbar`: KptRichTool[] = 'bold'|'italic'|'underline'|'strike'|'ul'|'ol'|'link'|'clear'
+- `toolbar`: KptRichToolbar = KptRichTool[] | KptRichTool[][] (płaska lista lub grupy=sekcje).
+  Pominięcie narzędzia/grupy je wyłącza; między grupami separator. Domyślnie pełny pasek w 5 sekcjach.
 - `placeholder`: string; `disabled`/`invalid`/`touched`: boolean; `touch`: output
 
+## Narzędzia (KptRichTool)
+- Schowek: `copy`, `paste` (z formatowaniem, oczyszczone), `pasteText` (bez formatowania)
+- Styl: `heading` (select: Normalny/paragraf + Nagłówek 1–6)
+- Format: `bold`, `italic`, `underline`, `strike`, `ul`, `ol`
+- Kolory: `foreColor` (kolor tekstu), `backColor` (kolor tła) — popover z próbkami + `input type=color`
+- Wyrównanie: `alignLeft`, `alignCenter`, `alignRight`, `alignJustify`
+- `table` (wstaw tabelę: popover z siatką NxM). W komórce prawy klik = menu kontekstowe
+  (wstaw/usuń wiersz i kolumnę, nagłówek wiersza/kolumny — przełącza td↔th, kolor tła i wyrównanie
+  komórki, obramowanie tabeli/komórki — kolor + grubość (cienkie/średnie/grube) lub bez, usuń tabelę).
+  Przeciąganie po komórkach = prostokątne zaznaczenie (podświetlone); scalanie/dzielenie komórek
+  (colspan/rowspan) z menu; operacje komórki (tło, wyrównanie, obramowanie) działają na całym zaznaczeniu.
+  Przeciąganie prawej krawędzi kolumny zmienia jej szerokość.
+  Odłożone: selekcja nieregularna, Ctrl+Backspace, zbiorcze formatowanie z górnego paska.
+- `link` (prompt URL), `clear` (usuń formatowanie), `html` (przełącznik podglądu źródła HTML — edycja surowego HTML)
+
 ## Przykład
-    <kpt-rich-text [formField]="f.body" [toolbar]="['bold','italic','ul','link']" />
+    <kpt-rich-text [formField]="f.body" />  <!-- pełny pasek -->
+    <kpt-rich-text [(value)]="v" [toolbar]="[['bold','italic'],['ul','ol'],['link']]" />
+
+## i18n
+Wszystkie etykiety (aria narzędzi, style „Normalny/Nagłówek N", prompt linku, menu kontekstowe tabeli,
+popover obramowania, „Własny…") pochodzą z i18n (namespace `richText`, w tym `richText.menu.*`,
+`richText.border.*`). Domyślnie EN — patrz `i18n/llms.txt`.
 
 ## Uwagi
-Formatowanie przez document.execCommand (przeglądarkowe). Ikony paska z wbudowanego rejestru.
+Formatowanie przez document.execCommand; aktywne narzędzia podświetlane (queryCommandState).
+Wklejanie (natywne i przyciskami) jest sanityzowane (allowlista tagów/stylów; usuwa script/on*/javascript:).
+Schowek „wklej"/„wklej bez formatowania" używa async Clipboard API (wymaga uprawnień przeglądarki).
+Tabele: odłożone na osobne zadanie.

package/dist/src/lib/select/llms.txt

@@ -18,5 +18,9 @@ Wymaga stylów overlay CDK w aplikacji: `import '@angular/cdk/overlay-prebuilt.c
 - `disabled`/`invalid`/`touched`: boolean; output `touch`.
 - Klawiatura: Enter/↓ otwiera, ↑/↓ nawigacja, Enter wybiera, Esc zamyka.
 
+## i18n
+Etykiety „Szukaj…", „Brak wyników" i aria usuwania chipa z i18n (namespace `select`).
+Domyślnie EN; konfiguracja przez `provideKptI18n` — patrz `i18n/llms.txt`.
+
 ## Tokeny
 `--kpt-form-field-{bg,text,border,border-hover,border-focus,border-error,radius}`.

package/dist/src/lib/slider/llms.txt

@@ -3,11 +3,18 @@
 Suwak wartości na Signal Forms. Import: `import { KptSlider } from '@konce-pt/angular';`
 
 ## Wejścia
-- `value`: model<number>; `min`/`max`: number (zgodne z FormValueControl); `step`: number
+- `value`: model<number | [number, number]> — w trybie `range` para `[min, max]`, inaczej pojedyncza liczba
+- `range`: boolean — dwa uchwyty (zakres); `min`/`max`: number (zgodne z FormValueControl); `step`: number
 - `showValue`: boolean; `disabled`/`invalid`/`touched`; `touch`
 
 ## Przykład
     <kpt-slider [formField]="f.volume" [min]="0" [max]="100" [step]="5" showValue />
+    <!-- zakres: wartość jest tablicą [min, max] -->
+    <kpt-slider range [(value)]="zakres" [min]="0" [max]="100" showValue />
+
+## Uwagi
+- Tryb `range` używa dwóch nałożonych `input[type=range]`; `pointer-events` aktywne tylko na uchwytach (szyna nie przechwytuje).
+- Uchwyty nie mogą się „minąć” — dolny jest klampowany do górnego i odwrotnie.
 
 ## Tokeny
 Track wypełniany `--kpt-color-primary`, tło `--kpt-color-surface-variant`.

package/dist/src/lib/stepper/llms.txt

@@ -5,6 +5,8 @@ Import: `import { KptStepper, KptStep } from '@konce-pt/angular';`
 
 ## KptStepper
 - `activeIndex`: model<number>; metody publiczne: `next()`, `prev()`, `goTo(i)`
+- `animated`: boolean (domyślnie true) — animacja przejścia (fade+slide, czysty CSS)
+- `animationDuration`: number (domyślnie 500) — czas animacji w ms
 
 ## KptStep
 - `label`: string (wymagane)

package/dist/src/lib/switch/llms.txt

@@ -5,9 +5,13 @@ Import: `import { KptSwitch } from '@konce-pt/angular';`
 
 ## Użycie
     <kpt-switch [formField]="f.notifications" label="Powiadomienia" />
+    <!-- tekst stanu zmienia się przy przełączaniu -->
+    <kpt-switch [(checked)]="on" onLabel="Włączony" offLabel="Wyłączony" />
 
 ## Wejścia
-- `checked`: model<boolean>; `label`: string; `disabled`/`invalid`/`touched`: boolean; output `touch`.
+- `checked`: model<boolean>; `label`: string (statyczny); `disabled`/`invalid`/`touched`: boolean; output `touch`.
+- `labelPosition`: 'start' | 'end' (domyślnie 'end') — etykieta `label` z lewej lub z prawej przełącznika.
+- `onLabel`/`offLabel`: string — tekst stanu; wyświetlany wg `checked` (włączony podświetlony `--kpt-color-primary`). Można łączyć ze statycznym `label`.
 
 ## Tokeny
 `--kpt-color-primary`, `--kpt-color-border-strong`, `--kpt-color-surface`, `--kpt-elevation-1`.

package/dist/src/lib/switch-group/llms.txt

@@ -0,0 +1,24 @@
+# KptSwitchGroup (kpt-switch-group)
+
+Grupa przełączników. Domyślnie pojedynczy wybór (wzajemnie wykluczające się) — włączenie jednego wyłącza pozostałe.
+Z `multiple` przechodzi w tryb wielokrotny (wartość to tablica zaznaczonych opcji).
+Na Signal Forms (`FormValueControl<T | T[] | null>`, model `value`). Import: `import { KptSwitchGroup } from '@konce-pt/angular';`
+
+## Użycie
+    <kpt-switch-group [(value)]="plan" [options]="plans" />
+    <!-- wielokrotny wybór: value = T[] -->
+    <kpt-switch-group multiple [(value)]="tags" [options]="tagOptions" />
+    <!-- plans: KptOption<T>[] = [{ label, value, disabled? }, …] -->
+
+## Wejścia
+- `value`: model<T | T[] | null> — pojedynczy: wartość opcji lub `null`; multiple: tablica wartości zaznaczonych opcji.
+- `options`: KptOption<T>[] — lista opcji.
+- `multiple`: boolean (domyślnie false) — tryb wielokrotnego wyboru; wartość staje się tablicą `T[]`.
+- `orientation`: 'vertical' (domyślnie) | 'horizontal'.
+- `allowDeselect`: boolean (domyślnie true) — czy kliknięcie aktywnej opcji ją odznacza (tylko tryb pojedynczy; w multiple odznaczanie zawsze dozwolone).
+- `disabled`/`invalid`/`touched`: boolean; output `touch`.
+
+## Zasada działania
+Każdy element to `kpt-switch` z jednokierunkowym `[checked]`. W trybie pojedynczym włączenie ustawia `value` na daną
+opcję, co automatycznie gasi pozostałe. W trybie `multiple` wartość jest normalizowana do tablicy — włączenie dodaje
+wartość opcji, wyłączenie ją usuwa. Renderuje `kpt-switch`, więc dziedziczy jego wygląd/tokeny.

package/dist/src/lib/tabs/llms.txt

@@ -5,6 +5,8 @@ Import: `import { KptTabs, KptTab } from '@konce-pt/angular';`
 
 ## KptTabs
 - `activeIndex`: model<number> (dwukierunkowe)
+- `animated`: boolean (domyślnie true) — animacja przejścia (fade+slide, czysty CSS)
+- `animationDuration`: number (domyślnie 500) — czas animacji w ms
 
 ## KptTab
 - `label`: string (wymagane); `disabled`: boolean