@konce-pt/angular 0.7.11 → 0.8.0

package/src/lib/galleria/llms.txt

@@ -1,15 +1,15 @@
 # KptGalleria (kpt-galleria)
 
-Duży podgląd obrazu z paskiem miniatur i nawigacją.
+A large image preview with a thumbnail strip and navigation.
 Import: `import { KptGalleria } from '@konce-pt/angular';`
 
-## Wejścia / model
+## Inputs / model
 - `items`: KptGalleriaItem[] — { src, thumbnail?, alt? }
-- `activeIndex`: model<number> (dwukierunkowe)
-- `showThumbnails`: boolean (domyślnie true)
+- `activeIndex`: model<number> (two-way)
+- `showThumbnails`: boolean (default true)
 
-## Przykład
+## Example
     <kpt-galleria [items]="photos" [(activeIndex)]="idx" />
 
-## Tokeny
-Scena `--kpt-color-muted`; aktywna miniatura `--kpt-color-primary`.
+## Tokens
+The stage `--kpt-color-muted`; the active thumbnail `--kpt-color-primary`.

package/src/lib/i18n/llms.txt

@@ -1,35 +1,41 @@
 # 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.
+Translations for component labels. Base languages: EN (default), PL. Signal-based (zoneless-friendly), with no external dependencies.
 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).
+## Configuration (provider)
+- `provideKptI18n({ locale?, messages? }): EnvironmentProviders` — in `bootstrapApplication`.
+- `locale`: 'en' | 'pl' | any string (default 'en').
+- `messages`: `Record<locale, DeepPartial<KptMessages>>` — registers a new language or overrides an existing one (deep merge, missing keys fall back to 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}`.
+## The KptI18n service (providedIn: 'root')
+- `locale: Signal<KptLocale>` — the current language.
+- `setLocale(locale)` — a runtime change (reactive across every component).
+- `registerMessages(locale, patch)` — adds to or overrides a dictionary at runtime.
+- `t(key, params?)` — translates a dotted key (`'paginator.range'`) with `{name}` interpolation.
 
-## Dodanie własnego języka (jeden plik JSON)
-    import de from './i18n/de.json'; // kształt = interfejs KptMessages
+## Adding your own language (one JSON file)
+    import de from './i18n/de.json'; // the shape is the KptMessages interface
     provideKptI18n({ locale: 'de', messages: { de } });
-    // runtime: inject(KptI18n).registerMessages('de', de); inject(KptI18n).setLocale('de');
+    // at runtime: inject(KptI18n).registerMessages('de', de); inject(KptI18n).setLocale('de');
 
-## Przełączanie języka w runtime
+## Switching language at 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),
+## The key contract (KptMessages)
+Namespaces: `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`, `auth` (w tym `auth.promo.*`). Interpolacje: `paginator.range` ({start},{end},{total}), `dataTable.filter*` ({column}),
-`richText.styleHeading` ({level}), `auth.continueWith` ({provider}), `auth.passwordHint` i `auth.errorMinLength` ({min}). Nazwy dni/miesięcy w kalendarzach są wyliczane z `Intl` wg locale (nie ze słownika).
+`pickList`, `orderList`, `inputNumber`, `password`, `rating`, `spinner`, `speedDial`, `scrollTop`, `splitButton`, `panel`,
+`breadcrumb`, `richText`, `auth` (including `auth.promo.*`). Interpolations: `paginator.range` ({start},{end},{total}), `dataTable.filter*` ({column}),
+`richText.styleHeading` ({level}), `auth.continueWith` ({provider}), `auth.passwordHint` and `auth.errorMinLength` ({min}), `rating.star` ({value},{max}). Day and month names in calendars are derived from `Intl` per locale (not from the dictionary).
 
-## Uwaga
-Pojedyncze etykiety można też nadpisać per-komponent przez odpowiedni `input()` (np. `emptyMessage`, `acceptLabel`) —
-input ma priorytet nad słownikiem i18n.
+## Note
+Individual labels can also be overridden per component through the matching `input()` (e.g. `emptyMessage`, `acceptLabel`) —
+the input takes priority over the i18n dictionary.
+
+## Where the dictionaries live
+The contract (`KptMessages`), the base EN/PL dictionaries and the translation core (`translate`, `deepMerge`)
+live in `@konce-pt/i18n` — a pure-TypeScript package with no framework dependency, shared with the React port
+so both render identical labels. `@konce-pt/angular` re-exports all of it, so the imports above stay unchanged;
+you never need to install `@konce-pt/i18n` yourself.

package/src/lib/icon/llms.txt

@@ -1,40 +1,40 @@
 # KptIcon (kpt-icon)
 
-Ikona inline SVG (zestaw Tabler Icons — MIT). Rozmiar dziedziczy z `font-size` (1em),
-kolor z `currentColor`. Import: `import { KptIcon } from '@konce-pt/angular';`
+An inline SVG icon (the Tabler Icons set — MIT). The size is inherited from `font-size` (1em),
+the color from `currentColor`. Import: `import { KptIcon } from '@konce-pt/angular';`
 
-## Selektor
+## Selector
 `kpt-icon`
 
-## Wejścia
-- `name`: KptIconName (wymagane) — nazwa ikony z rejestru
-- `size`: string (opcjonalnie, np. '1.25rem') — inaczej dziedziczy z font-size
+## Inputs
+- `name`: KptIconName (required) — an icon name from the registry
+- `size`: string (optional, e.g. '1.25rem') — otherwise inherited from font-size
 
-## Dostępne nazwy (wbudowane)
+## Available names (built in)
 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,
 star, phone, map-pin, world, clock, align-left, align-center, align-right, align-justified,
 palette, highlight, clipboard, clipboard-text, table, mail, share, external-link, crosshair
-(pełna lista w `icons.ts`).
+(the full list lives in `icons.ts`).
 
-## Pełny zestaw (5130 ikon Tabler)
-Opcjonalny entry point `@konce-pt/angular/icons` (pobierany tylko przy imporcie):
+## The full set (5130 Tabler icons)
+An optional entry point `@konce-pt/angular/icons` (downloaded only when imported):
 
     import { provideKptTablerIcons } from '@konce-pt/angular/icons';
     bootstrapApplication(App, { providers: [provideKptTablerIcons()] });
-    // potem: <kpt-icon name="rocket" />, <kpt-icon name="arrow-left" /> …
+    // then: <kpt-icon name="rocket" />, <kpt-icon name="arrow-left" /> …
 
-Można też rejestrować własne przez `KptIconRegistry.register({ nazwa: 'inner svg' })` — treść jest
-sanityzowana do allowlisty geometrii SVG (`path`/`circle`/`rect`/`g`/`line`/`polygon`/`polyline`/
-`ellipse` + atrybuty kształtu/stylu), ale `register()` wolno wołać wyłącznie z treścią kontrolowaną
-build-time przez developera, nigdy bezpośrednio z danych runtime/CMS/uploadu.
-`kpt-icon` reaguje na późną rejestrację (sygnał `version`).
+You can also register your own through `KptIconRegistry.register({ name: 'inner svg' })` — the content is
+sanitized down to an allowlist of SVG geometry (`path`/`circle`/`rect`/`g`/`line`/`polygon`/`polyline`/
+`ellipse` + shape/style attributes), but `register()` may only be called with content the developer controls
+at build time, never straight from runtime/CMS/upload data.
+`kpt-icon` reacts to late registration (the `version` signal).
 
-## Przykład
+## Example
     <kpt-icon name="check" />
     <kpt-icon name="chevron-down" size="1.25rem" />
     <button><kpt-icon name="x" /></button>
 
-## Licencja ikon
-Tabler Icons (MIT). Ikony wyodrębnione inline do `icons.ts`. Zob. ICONS-LICENSE w root.
-Dodanie ikony: dołóż wpis do `KPT_ICONS`/`KptIconName` (siatka 24×24, stroke 2px).
+## Icon license
+Tabler Icons (MIT). The icons are extracted inline into `icons.ts`. See ICONS-LICENSE at the root.
+Adding an icon: add an entry to `KPT_ICONS`/`KptIconName` (a 24×24 grid, 2px stroke).

package/src/lib/icon-button/llms.txt

@@ -1,15 +1,16 @@
 # KptIconButton (kpt-icon-button)
 
-Przycisk ikonowy (tylko ikona). Wymaga `ariaLabel`.
+An icon-only button. `ariaLabel` is required.
 Import: `import { KptIconButton } from '@konce-pt/angular';`
 
-## Wejścia
+## Inputs
 - `variant`: 'filled'|'tonal'|'outline'|'text'|'danger'; `size`: 'sm'|'md'|'lg'; `shape`: 'round'|'square'
-- `type`, `disabled`, `loading`, `ariaLabel` (wymagane)
+- `type`, `disabled`, `loading`, `ariaLabel` (required)
+- `ariaPressed`: `boolean | null` = `null` — toggle state; lands on the inner `<button>`, so a screen reader announces it (`[attr.aria-pressed]` on the tag would sit on the host, which has no button role)
 
-## Przykłady
-    <kpt-icon-button ariaLabel="Ustawienia"><kpt-icon name="menu" /></kpt-icon-button>
-    <kpt-icon-button variant="danger" shape="square" ariaLabel="Usuń"><kpt-icon name="x" /></kpt-icon-button>
+## Examples
+    <kpt-icon-button ariaLabel="Settings"><kpt-icon name="menu" /></kpt-icon-button>
+    <kpt-icon-button variant="danger" shape="square" ariaLabel="Delete"><kpt-icon name="x" /></kpt-icon-button>
 
-## Tokeny
-Współdzieli z kpt-button (`--kpt-color-primary`, `--kpt-color-muted`, …).
+## Tokens
+Shared with kpt-button (`--kpt-color-primary`, `--kpt-color-muted`, …).

package/src/lib/image/llms.txt

@@ -1,15 +1,15 @@
 # KptImage (kpt-image)
 
-Obraz z opcjonalnym podglądem pełnoekranowym (zoom).
+An image with an optional full-screen preview (zoom).
 Import: `import { KptImage } from '@konce-pt/angular';`
 
-## Wejścia
-- `src`: string (wymagane); `alt`: string
-- `width`: string | null (np. '240px')
-- `preview`: boolean — klik otwiera overlay z powiększeniem
+## Inputs
+- `src`: string (required); `alt`: string
+- `width`: string | null (e.g. '240px')
+- `preview`: boolean — a click opens a magnifying overlay
 
-## Przykład
-    <kpt-image src="/foto.jpg" alt="Zdjęcie" preview width="240px" />
+## Example
+    <kpt-image src="/photo.jpg" alt="Photo" preview width="240px" />
 
-## Tokeny
-Maska podglądu półprzezroczysta; ikona `zoom-in`; overlay ciemny.
+## Tokens
+A semi-transparent preview mask; the `zoom-in` icon; a dark overlay.

package/src/lib/input/llms.txt

@@ -1,50 +1,50 @@
 # KptInput (kpt-input)
 
-Pole tekstowe Koncept UI zintegrowane z Angular Signal Forms. Implementuje
-`FormValueControl<string>` — wiąż dyrektywą `FormField` (`@angular/forms/signals`).
-Bez `ControlValueAccessor`. Import: `import { KptInput } from '@konce-pt/angular';`
+The Koncept UI text field, integrated with Angular Signal Forms. It implements
+`FormValueControl<string>` — bind it with the `FormField` directive (`@angular/forms/signals`).
+No `ControlValueAccessor`. Import: `import { KptInput } from '@konce-pt/angular';`
 
-## Selektor
+## Selector
 `kpt-input`
 
-## Użycie z Signal Forms
+## Usage with Signal Forms
 
     import { form, FormField, required, email } from '@angular/forms/signals';
 
     model = signal({ email: '' });
     loginForm = form(this.model, (p) => {
-      required(p.email, { message: 'E-mail jest wymagany' });
-      email(p.email, { message: 'Podaj poprawny adres e-mail' });
+      required(p.email, { message: 'E-mail is required' });
+      email(p.email, { message: 'Enter a valid e-mail address' });
     });
 
-    // szablon (imports: [KptInput, FormField, FormRoot, KptButton])
+    // template (imports: [KptInput, FormField, FormRoot, KptButton])
     <form [formRoot]="loginForm" (submit)="onSubmit()">
       <kpt-input [formField]="loginForm.email" type="email" id="f-email" />
-      <kpt-button type="submit" [disabled]="loginForm().invalid()">Zaloguj</kpt-button>
+      <kpt-button type="submit" [disabled]="loginForm().invalid()">Sign in</kpt-button>
     </form>
 
-`[formRoot]` sam ustawia `novalidate` i woła `submit()`; `submit()` sam robi `markAsTouched()`.
-Nie warunkuj walidatorów przez `when: state.touched()` — psuje to `valid()`.
-Pełny przepływ: sekcja `## Formularz od zera (Signal Forms)` w głównym llms.txt.
+`[formRoot]` sets `novalidate` and calls `submit()` on its own; `submit()` does `markAsTouched()` on its own.
+Do not gate validators with `when: state.touched()` — it breaks `valid()`.
+The full flow: the `## A form from scratch (Signal Forms)` section in the root llms.txt.
 
-## Wejścia prezentacyjne
-- `type`: 'text'|'email'|'password'|'number'|'search'|'tel'|'url'|'time' (domyślnie 'text')
+## Presentational inputs
+- `type`: 'text'|'email'|'password'|'number'|'search'|'tel'|'url'|'time' (default 'text')
 - `placeholder`: string
-- `id`: string — trafia na wewnętrzny `<input>` (do `label[for]`); host go nie nosi
+- `id`: string — lands on the inner `<input>` (for `label[for]`); the host does not carry it
 - `ariaLabel`: string | null
-- `autocomplete`: string | null — podpowiedź dla przeglądarki i menedżera haseł
-  (np. `email`, `username`, `one-time-code`); bez niej autouzupełnianie nie działa
+- `autocomplete`: string | null — a hint for the browser and the password manager
+  (e.g. `email`, `username`, `one-time-code`); without it autofill does not work
 
-## Stan wiązany automatycznie przez FormField
-`value` (model, wymagane), `disabled`, `readonly`, `required`, `invalid`, `errors`,
-`touched`; output `touch` (emitowany na blur). Nie ustawiaj ich ręcznie przy użyciu z formularzem.
+## State bound automatically by FormField
+`value` (model, required), `disabled`, `readonly`, `required`, `invalid`, `errors`,
+`touched`; the `touch` output (emitted on blur). Do not set them by hand when used with a form.
 
-## Tokeny
+## Tokens
 `--kpt-form-field-{bg,text,placeholder,border,border-hover,border-focus,border-error,radius}`.
 
-## Dostępność
-- `aria-invalid="true"` dopiero gdy pole jest nieprawidłowe **i** dotknięte (`blur`) — świeży,
-  pusty formularz nie jest malowany na czerwono.
-- `aria-required="true"` przy `required` — celowo nie natywny atrybut `required`, który
-  blokowałby zdarzenie submit i uruchamiał walidację przeglądarki obok Signal Forms.
-- Komunikaty błędów wyświetla zwykle `kpt-form-field` (`role="alert"`).
+## Accessibility
+- `aria-invalid="true"` only once the field is invalid **and** touched (`blur`) — a fresh,
+  empty form is not painted red.
+- `aria-required="true"` with `required` — deliberately not the native `required` attribute, which
+  would block the submit event and run browser validation alongside Signal Forms.
+- Error messages are usually rendered by `kpt-form-field` (`role="alert"`).

package/src/lib/input-mask/llms.txt

@@ -1,20 +1,20 @@
 # KptInputMask (kpt-input-mask)
 
-Pole z maską znakową na Signal Forms. Wartość = string.
+A field with a character mask on Signal Forms. The value is a string.
 Import: `import { KptInputMask } from '@konce-pt/angular';`
 
-## Tokeny maski
-- `9` = cyfra, `a` = litera, `*` = alfanumeryczny. Pozostałe znaki maski to literały (spacje, nawiasy, myślniki).
+## Mask tokens
+- `9` = a digit, `a` = a letter, `*` = alphanumeric. Every other character in the mask is a literal (spaces, parentheses, hyphens).
 
-## Wejścia / model
-- `value`: model<string> (lub `formField`)
-- `mask`: string (np. `(999) 999-99-99`)
-- `placeholder`: string (domyślnie = maska)
+## Inputs / model
+- `value`: model<string> (or `formField`)
+- `mask`: string (e.g. `(999) 999-99-99`)
+- `placeholder`: string (defaults to the mask)
 - `disabled`/`invalid`/`touched`: boolean; `touch`: output
 
-## Przykład
+## Example
     <kpt-input-mask [formField]="f.phone" mask="(999) 999-99-99" />
     <kpt-input-mask [(value)]="zip" mask="99-999" />
 
-## Tokeny
-Pole `--kpt-form-field-*`.
+## Tokens
+The field uses `--kpt-form-field-*`.

package/src/lib/input-number/llms.txt

@@ -1,40 +1,40 @@
 # KptInputNumber (kpt-input-number)
 
-Pole liczbowe ze strzałkami krokowania na Signal Forms. Wartość = number | null.
-`showButtons="false"` daje wariant bez strzałek — do zakresów „od–do".
+A numeric field with stepper arrows on Signal Forms. The value is number | null.
+`showButtons="false"` gives the arrow-less variant — for "from–to" ranges.
 Import: `import { KptInputNumber } from '@konce-pt/angular';`
 
-## Wejścia / model
-- `value`: model<number | null> (lub `formField`)
-- `min`/`max`: number | undefined; `step`: number (domyślnie 1). Pod `[formField]` granic
-  NIE bindujemy — deklarują je `min()`/`max()` w `form()`, a `FormField` sam wstrzykuje je
-  w te wejścia; `[min]`/`[max]` obok `[formField]` to błąd kompilacji
-  (FORM_FIELD_UNSUPPORTED_BINDING). Bindowanie wprost tylko z `[(value)]`.
-- `suffix`: string (np. ' %'); `placeholder`: string
-- `showButtons`: boolean (domyślnie `true`) — `false` chowa strzałki `−`/`+`; treść pola
-  wyrównuje się wtedy do lewej, jak w `kpt-input` (modyfikator `.kpt-input-number--plain`)
+## Inputs / model
+- `value`: model<number | null> (or `formField`)
+- `min`/`max`: number | undefined; `step`: number (default 1). Under `[formField]` do NOT
+  bind the bounds — they are declared by `min()`/`max()` in `form()`, and `FormField` injects them
+  into these inputs itself; `[min]`/`[max]` next to `[formField]` is a compilation error
+  (FORM_FIELD_UNSUPPORTED_BINDING). Bind them directly only together with `[(value)]`.
+- `suffix`: string (e.g. ' %'); `placeholder`: string
+- `showButtons`: boolean (default `true`) — `false` hides the `−`/`+` arrows; the field content
+  then aligns left, as in `kpt-input` (the `.kpt-input-number--plain` modifier)
 - `disabled`/`invalid`/`touched`: boolean; `touch`: output
 
-## Przykład
+## Example
     <kpt-input-number [formField]="f.qty" [step]="1" />
-    <kpt-input-number [(value)]="qty" [min]="0" [max]="99" suffix=" szt." />
-    <kpt-input-number [formField]="f.priceFrom" [showButtons]="false" suffix=" zł" />
+    <kpt-input-number [(value)]="qty" [min]="0" [max]="99" suffix=" pcs" />
+    <kpt-input-number [formField]="f.priceFrom" [showButtons]="false" suffix=" USD" />
 
-## Zakres „od–do" (walidacja między polami)
+## A "from–to" range (cross-field validation)
 
-Dwa osobne pola formularza; regułę „do ≥ od" wpina się przez `validateTree` na korzeniu.
-Błąd celuje się w konkretne pole właściwością `fieldTree` — inaczej wylądowałby na formularzu
-i nie pokazałby się pod żadną kontrolką.
+Two separate form fields; the "to ≥ from" rule is attached through `validateTree` on the root.
+The error is aimed at a specific field with the `fieldTree` property — otherwise it would land on the form
+and would not show up under any control.
 
     import { form, max, min, validateTree } from '@angular/forms/signals';
 
     model = signal({ priceFrom: null as number | null, priceTo: null as number | null });
 
     rangeForm = form(this.model, (path) => {
-      min(path.priceFrom, 0, { message: 'Wartość nie może być ujemna' });
-      max(path.priceFrom, 9999, { message: 'Wartość nie może przekroczyć 9999' });
-      min(path.priceTo, 0, { message: 'Wartość nie może być ujemna' });
-      max(path.priceTo, 9999, { message: 'Wartość nie może przekroczyć 9999' });
+      min(path.priceFrom, 0, { message: 'The value cannot be negative' });
+      max(path.priceFrom, 9999, { message: 'The value cannot exceed 9999' });
+      min(path.priceTo, 0, { message: 'The value cannot be negative' });
+      max(path.priceTo, 9999, { message: 'The value cannot exceed 9999' });
 
       validateTree(path, (ctx) => {
         const from = ctx.valueOf(path.priceFrom);
@@ -42,25 +42,25 @@ i nie pokazałby się pod żadną kontrolką.
         if (from === null || to === null || from <= to) return null;
         return {
           kind: 'range',
-          message: 'Wartość „do" nie może być mniejsza niż „od"',
-          fieldTree: ctx.fieldTreeOf(path.priceTo),   // błąd ląduje na polu „do"
+          message: 'The "to" value cannot be lower than "from"',
+          fieldTree: ctx.fieldTreeOf(path.priceTo),   // the error lands on the "to" field
         };
       });
     });
 
-    // szablon — dwie kolumny od md (klasy utility z @konce-pt/grid)
+    // template — two columns from md up (utility classes from @konce-pt/grid)
     <form class="kpt-grid" [formRoot]="rangeForm" (submit)="onSubmit()">
-      <kpt-form-field class="kpt-col-12 kpt-col-md-6" label="Cena od" [error]="fromError()">
-        <kpt-input-number [formField]="rangeForm.priceFrom" [showButtons]="false" suffix=" zł" />
+      <kpt-form-field class="kpt-col-12 kpt-col-md-6" label="Price from" [error]="fromError()">
+        <kpt-input-number [formField]="rangeForm.priceFrom" [showButtons]="false" suffix=" USD" />
       </kpt-form-field>
-      <kpt-form-field class="kpt-col-12 kpt-col-md-6" label="Cena do" [error]="toError()">
-        <kpt-input-number [formField]="rangeForm.priceTo" [showButtons]="false" suffix=" zł" />
+      <kpt-form-field class="kpt-col-12 kpt-col-md-6" label="Price to" [error]="toError()">
+        <kpt-input-number [formField]="rangeForm.priceTo" [showButtons]="false" suffix=" USD" />
       </kpt-form-field>
     </form>
 
-`ctx.valueOf(path.x)` czyta wartość innego pola, `ctx.fieldTreeOf(path.x)` wskazuje pole
-docelowe błędu. Komunikaty podaje się przez `errorFor()` z bramką `touched()` — walidatorów
-nie warunkuj. Pełny przepływ submit: `## Formularz od zera (Signal Forms)` w głównym llms.txt.
+`ctx.valueOf(path.x)` reads another field's value, `ctx.fieldTreeOf(path.x)` points at the field
+the error belongs to. Messages are supplied through `errorFor()` with a `touched()` gate — do not
+gate the validators. The full submit flow: `## A form from scratch (Signal Forms)` in the root llms.txt.
 
-## Tokeny
-Pole `--kpt-form-field-*`; przyciski `--kpt-color-muted`.
+## Tokens
+The field `--kpt-form-field-*`; the buttons `--kpt-color-muted`.

package/src/lib/input-otp/llms.txt

@@ -1,19 +1,19 @@
 # KptInputOtp (kpt-input-otp)
 
-Pole kodu jednorazowego (OTP/PIN) — N osobnych pól z autofocusem i wklejaniem. Signal Forms.
-Wartość = string (sklejone znaki). Import: `import { KptInputOtp } from '@konce-pt/angular';`
+A one-time code field (OTP/PIN) — N separate boxes with autofocus and paste support. Signal Forms.
+The value is a string (the characters joined). Import: `import { KptInputOtp } from '@konce-pt/angular';`
 
-## Wejścia / model
-- `value`: model<string> (lub `formField`)
-- `length`: number (domyślnie 6)
-- `integerOnly`: boolean — tylko cyfry
+## Inputs / model
+- `value`: model<string> (or `formField`)
+- `length`: number (default 6)
+- `integerOnly`: boolean — digits only
 - `disabled`/`invalid`/`touched`: boolean; `touch`: output
 
-## Zachowanie
-Wpisanie znaku przechodzi do następnego pola; Backspace cofa; wklejenie rozkłada kod na pola.
+## Behavior
+Typing a character moves to the next box; Backspace goes back; pasting spreads the code across the boxes.
 
-## Przykład
+## Example
     <kpt-input-otp [formField]="f.code" [length]="6" integerOnly />
 
-## Tokeny
-Komórki `--kpt-form-field-*`.
+## Tokens
+The boxes use `--kpt-form-field-*`.

package/src/lib/knob/llms.txt

@@ -1,23 +1,23 @@
 # KptKnob (kpt-knob)
 
-Pokrętło (knob) — wybór wartości po łuku SVG, myszką (drag) lub klawiszami strzałek. Signal Forms.
+A knob — pick a value along an SVG arc, with the mouse (drag) or the arrow keys. Signal Forms.
 Import: `import { KptKnob } from '@konce-pt/angular';`
 
-## Wejścia / model
-- `value`: model<number> (lub `formField`)
-- `min`/`max`: number | undefined (0/100); `step`: number. Pod `[formField]` zakres bierze się
-  z `min()`/`max()` w `form()` — `[min]`/`[max]` obok `[formField]` to błąd kompilacji
-  (FORM_FIELD_UNSUPPORTED_BINDING); bindowanie wprost tylko z `[(value)]`.
-- `size`: px (domyślnie 96); `stroke`: px (10); `suffix`: string
-- `showValue`: boolean (domyślnie true)
+## Inputs / model
+- `value`: model<number> (or `formField`)
+- `min`/`max`: number | undefined (0/100); `step`: number. Under `[formField]` the bounds come
+  from `min()`/`max()` in `form()` — `[min]`/`[max]` next to `[formField]` is a compilation error
+  (FORM_FIELD_UNSUPPORTED_BINDING); bind them directly only together with `[(value)]`.
+- `size`: px (default 96); `stroke`: px (10); `suffix`: string
+- `showValue`: boolean (default true)
 - `disabled`/`invalid`/`touched`: boolean; `touch`: output
 
-## Dostępność
-`role="slider"` + aria-valuemin/max/now; strzałki, Home/End.
+## Accessibility
+`role="slider"` + aria-valuemin/max/now; arrow keys, Home/End.
 
-## Przykład
-    <kpt-knob [formField]="f.level" [step]="5" />          <!-- zakres z min()/max() w form() -->
+## Example
+    <kpt-knob [formField]="f.level" [step]="5" />          <!-- bounds from min()/max() in form() -->
     <kpt-knob [(value)]="level" [min]="0" [max]="100" [step]="5" />
 
-## Tokeny
-Łuk tła `--kpt-color-border`; wartość `--kpt-color-primary`; tekst `--kpt-color-on-surface`.
+## Tokens
+The background arc `--kpt-color-border`; the value `--kpt-color-primary`; text `--kpt-color-on-surface`.

package/src/lib/listbox/llms.txt

@@ -1,17 +1,17 @@
 # KptListbox (kpt-listbox)
 
-Lista wyboru (listbox) na Signal Forms. Pojedynczy lub wielokrotny wybór, opcjonalny filtr.
-Wartość: `T` (single) lub `T[]` (multiple). Import: `import { KptListbox } from '@konce-pt/angular';`
+A selection list (listbox) on Signal Forms. Single or multiple selection, an optional filter.
+Value: `T` (single) or `T[]` (multiple). Import: `import { KptListbox } from '@konce-pt/angular';`
 
-## Wejścia / model
-- `value`: model<T | T[] | null> (lub `formField`)
+## Inputs / model
+- `value`: model<T | T[] | null> (or `formField`)
 - `options`: KptOption<T>[] — { label, value, disabled? }
-- `multiple`: boolean; `filter`: boolean (pole wyszukiwania)
+- `multiple`: boolean; `filter`: boolean (a search field)
 - `disabled`/`invalid`/`touched`: boolean; `touch`: output
 
-## Przykład
+## Example
     <kpt-listbox [formField]="f.role" [options]="roles" filter />
     <kpt-listbox [(value)]="tags" [options]="tagOptions" multiple />
 
-## Tokeny
-Ramka `--kpt-form-field-*`; zaznaczenie `--kpt-color-primary`.
+## Tokens
+The frame `--kpt-form-field-*`; selection `--kpt-color-primary`.

package/src/lib/megamenu/llms.txt

@@ -1,23 +1,23 @@
 # KptMegamenu (kpt-megamenu)
 
-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';`
+A mega menu — a horizontal bar with a wide, multi-column panel.
+Structure: a top-level entry → `items` (the columns) → each column's `items` (the links).
+The panel sits on CDK Overlay (attached to `body`, never clipped by `overflow: hidden`).
+Requires `import '@angular/cdk/overlay-prebuilt.css';`
 Import: `import { KptMegamenu } from '@konce-pt/angular';`
 
-## Wejścia / wyjścia
-- `items`: KptMenuItem<T>[] (3 poziomy: top → kolumny → linki)
-- `selected`: KptMenuItem<T> (kliknięty odnośnik)
+## Inputs / outputs
+- `items`: KptMenuItem<T>[] (3 levels: top → columns → links)
+- `selected`: KptMenuItem<T> (the clicked link)
 
-## Przykład
+## Example
     items = [{
-      label: 'Produkty',
+      label: 'Products',
       items: [
-        { label: 'Komponenty', items: [{ label: 'Formularze' }, { label: 'Tabele' }] },
-        { label: 'Szablony', items: [{ label: 'Dashboard' }] },
+        { label: 'Components', items: [{ label: 'Forms' }, { label: 'Tables' }] },
+        { label: 'Templates', items: [{ label: 'Dashboard' }] },
       ],
     }];
 
-## Tokeny
-Panel `--kpt-color-surface-raised`, `--kpt-elevation-3`.
+## Tokens
+The panel `--kpt-color-surface-raised`, `--kpt-elevation-3`.