@konce-pt/react 0.12.0 → 0.14.0

package/dist/input/input.js

@@ -1,12 +1,15 @@
 'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useCallback } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useRef } from 'react';
 import { cn } from "../internal/cn.js";
+import { composeRefs } from "../internal/compose-refs.js";
+import { KptSpeechButton } from "../speech/speech-button.js";
+import { useKptSpeechRecognition } from "../speech/use-speech-recognition.js";
 import { joinIds, useKptFieldA11y } from "../form-field/form-field-context.js";
 /**
  * Pole tekstowe Koncept UI. Renderuje natywny `<input>` w hoście `.kpt-input-host`.
  *
- * Działa kontrolowane (`value` + `onValueChange`) i niekontrolowane (`defaultValue`) —
+ * Działa kontrolowane (`value` + `onValueChange`) i niekontrolowane (`defaultValue`) -
  * w drugim trybie wartość należy do DOM, więc natywny `<form>`, `<form action>`, reset
  * formularza i React Hook Form (`register`) działają bez adaptera.
  *
@@ -17,10 +20,22 @@ import { joinIds, useKptFieldA11y } from "../form-field/form-field-context.js";
  * <KptInput name="email" type="email" defaultValue="" />
  * <KptInput value={email} onValueChange={setEmail} invalid={!ok} touched={blurred} />
  */
-export function KptInput({ type = 'text', required = false, invalid = false, touched, onValueChange, onTouch, hostProps, className, id, onChange, onBlur, 'aria-invalid': ariaInvalid, 'aria-describedby': ariaDescribedBy, ...rest }) {
+export function KptInput({ type = 'text', required = false, invalid = false, touched, onValueChange, onTouch, hostProps, className, id, onChange, onBlur, ref, speech = false, speechLang, speechColor, speechMode = 'insert', 'aria-invalid': ariaInvalid, 'aria-describedby': ariaDescribedBy, ...rest }) {
     const { className: hostClassName, ...hostRest } = hostProps ?? {};
     const field = useKptFieldA11y(id, 'kpt-input');
-    // Stan nieprawidłowy pokazujemy dopiero po dotknięciu pola — jak natywne `:user-invalid`.
+    const innerRef = useRef(null);
+    // Tekst zatwierdzony wchodzi przez zdarzenie `input` pola, więc `onChange` dostaje go jak wpisany;
+    // tymczasowy jest tylko na ekranie. Bez `speech` kontroler nie tworzy sesji.
+    const mic = useKptSpeechRecognition({
+        enabled: speech,
+        target: innerRef,
+        lang: speechLang,
+        mode: speechMode,
+        continuous: speechMode !== 'replace',
+        disabled: !!rest.disabled || !!rest.readOnly,
+    });
+    const speechState = speech && mic.available ? (mic.listening ? 'listening' : 'idle') : undefined;
+    // Stan nieprawidłowy pokazujemy dopiero po dotknięciu pola - jak natywne `:user-invalid`.
     // Bez `touched` nie ma czego bramkować, więc decyduje samo `invalid`.
     const showInvalid = invalid && (touched ?? true);
     const handleChange = useCallback((event) => {
@@ -31,5 +46,5 @@ export function KptInput({ type = 'text', required = false, invalid = false, tou
         onBlur?.(event);
         onTouch?.();
     }, [onBlur, onTouch]);
-    return (_jsx("span", { className: cn('kpt-input-host', hostClassName), ...hostRest, children: _jsx("input", { className: cn('kpt-input__field', className), id: field.id, "aria-describedby": joinIds(ariaDescribedBy, field.describedBy), type: type, "aria-required": required || undefined, "aria-invalid": ariaInvalid ?? (showInvalid || undefined), onChange: handleChange, onBlur: handleBlur, ...rest }) }));
+    return (_jsxs("span", { className: cn('kpt-input-host', hostClassName), "data-speech": speechState, ...hostRest, children: [_jsx("input", { className: cn('kpt-input__field', className), id: field.id, "aria-describedby": joinIds(ariaDescribedBy, field.describedBy), type: type, "aria-required": required || undefined, "aria-invalid": ariaInvalid ?? (showInvalid || undefined), onChange: handleChange, onBlur: handleBlur, ref: composeRefs(innerRef, ref), ...rest }), speech ? (_jsx(KptSpeechButton, { listeningColor: speechColor, speech: mic, size: "sm", unsupported: "hide", disabled: !!rest.disabled || !!rest.readOnly, hostProps: { className: 'kpt-input__speech' } })) : null] }));
 }

package/dist/input/llms.txt

@@ -5,28 +5,28 @@ Import: `import { KptInput } from '@konce-pt/react';`
 
 ## DOM
     <span class="kpt-input-host">
-      <input class="kpt-input__field" id="…" type="text">
+      <input class="kpt-input__field" id="..." type="text">
     </span>
 
 ## Props
 - `type`: 'text' | 'email' | 'password' | 'number' | 'search' | 'tel' | 'url' | 'time' (default 'text')
-- `value` / `defaultValue` — controlled or uncontrolled, exactly like a native input
-- `onValueChange(value)` — the value alone; `onChange` still fires with the full event
-- `onTouch()` — fires on blur, the moment the field becomes touched
-- `required`: boolean — see the note below
-- `invalid`: boolean, `touched`: boolean — the error state
-- `hostProps` — props for the `.kpt-input-host` wrapper
+- `value` / `defaultValue` - controlled or uncontrolled, exactly like a native input
+- `onValueChange(value)` - the value alone; `onChange` still fires with the full event
+- `onTouch()` - fires on blur, the moment the field becomes touched
+- `required`: boolean - see the note below
+- `invalid`: boolean, `touched`: boolean - the error state
+- `hostProps` - props for the `.kpt-input-host` wrapper
 - `className`, `ref`, `name`, `placeholder`, `autoComplete` and every other `<input>` prop go to
   the inner `<input>`
 
 ## Controlled and uncontrolled
 Pass `value` and the field is controlled. Pass `defaultValue` (or nothing) and the value belongs
-to the DOM, so a native `<form>`, `<form action={…}>`, a form reset and React Hook Form's
-`register()` all work without an adapter — there is no internal mirror of the value to fight with.
+to the DOM, so a native `<form>`, `<form action={...}>`, a form reset and React Hook Form's
+`register()` all work without an adapter - there is no internal mirror of the value to fight with.
 
 ## The error state
 `aria-invalid="true"` is set when `invalid` is true. Pass `touched` as well to reproduce the
-Angular port's gate — the error then shows only after the field has been touched, like the native
+Angular port's gate - the error then shows only after the field has been touched, like the native
 `:user-invalid`. With `touched` omitted there is nothing to gate on, so `invalid` decides alone;
 that is the common case in React, where the form library already knows when an error is ready.
 The style hangs off `aria-invalid`, never off a class.
@@ -55,5 +55,19 @@ added to `aria-describedby` (merged with your own). Without a wrapper, name it w
 `--kpt-form-field-{bg,text,placeholder,border,border-hover,border-focus,border-error,radius}`.
 
 ## Accessibility
-A native `<input>` — full keyboard and screen reader support. `aria-required` marks the field as
+A native `<input>` - full keyboard and screen reader support. `aria-required` marks the field as
 required, `aria-invalid` marks it as erroneous, and the focus ring comes from `@konce-pt/styles`.
+
+## Dictation
+- `speech`: boolean = false - a microphone at the end of the field (`KptSpeechButton`, Web Speech
+  API). Without browser support it is not shown and the field keeps its normal padding.
+- `speechLang`: string - BCP 47 tag; without it from `KptI18nProvider`.
+- `speechColor`: `'primary' | 'danger' | 'success' | 'warning' | 'info'` = `'primary'` - colour of "stop" and the wave while listening.
+- `speechMode`: `'insert' | 'append' | 'replace'` = `'insert'`. `replace` clears the field the moment
+  the microphone is clicked (undoable with Ctrl+Z) and stops after one utterance - the search pattern.
+
+Interim words are visible in the field but never reach your state; final text comes through
+`onChange` / `onValueChange` like typed text.
+
+    <KptInput value={title} onValueChange={setTitle} speech />
+    <KptInput type="search" speech speechMode="replace" />

package/dist/input-mask/input-mask.d.ts

@@ -6,7 +6,7 @@ export interface KptInputMaskProps extends Omit<ComponentPropsWithRef<'input'>,
     /** Wzorzec maski; pozostałe znaki to literały (spacje, nawiasy, myślniki). */
     mask?: string;
     /**
-     * Pole wymagane — `aria-required`, a nie natywne `required` (jak w `KptInput`): natywne
+     * Pole wymagane - `aria-required`, a nie natywne `required` (jak w `KptInput`): natywne
      * blokowałoby wysyłkę i uruchamiało walidację przeglądarki obok Twojej.
      */
     required?: boolean;

package/dist/input-mask/input-mask.js

@@ -13,7 +13,7 @@ import { KPT_MASK_TOKENS, kptApplyMask, kptMaskCaret } from "../internal/mask.js
  */
 export function KptInputMask({ value, defaultValue = '', onValueChange, mask = '', placeholder, required = false, invalid = false, touched, onTouch, disabled = false, className, id, onBlur, 'aria-describedby': ariaDescribedBy, inputMode, ...rest }) {
     const field = useKptFieldA11y(id, 'kpt-input-mask');
-    // Klawiatura ekranowa z maski: same tokeny `9` (telefon, kod pocztowy) → numeryczna.
+    // Klawiatura ekranowa z maski: same tokeny `9` (telefon, kod pocztowy) -> numeryczna.
     const tokens = [...mask].filter((char) => char in KPT_MASK_TOKENS);
     const autoInputMode = tokens.length && tokens.every((char) => char === '9') ? 'numeric' : 'text';
     const inputId = field.id;
@@ -25,7 +25,7 @@ export function KptInputMask({ value, defaultValue = '', onValueChange, mask = '
         const caret = el.selectionStart ?? raw.length;
         const formatted = kptApplyMask(raw, mask);
         setCurrent(formatted);
-        // Gdy maska odrzuci znak, wartość się nie zmienia i React nie przerysuje pola —
+        // Gdy maska odrzuci znak, wartość się nie zmienia i React nie przerysuje pola -
         // wpisany znak zostałby na ekranie, więc DOM zrównujemy ręcznie.
         el.value = formatted;
         // Przepisanie `value` przenosi kursor na koniec; wraca za tyle samo znaczących znaków co przed zmianą.

package/dist/input-mask/llms.txt

@@ -9,9 +9,9 @@ Import: `import { KptInputMask } from '@konce-pt/react';`
     </span>
 
 ## Props
-- `value` / `defaultValue` / `onValueChange` — the formatted text
-- `mask`: string — `9` a digit, `a` a letter, `*` alphanumeric; everything else is a literal
-- `placeholder`: string — defaults to the mask itself, which doubles as a hint
+- `value` / `defaultValue` / `onValueChange` - the formatted text
+- `mask`: string - `9` a digit, `a` a letter, `*` alphanumeric; everything else is a literal
+- `placeholder`: string - defaults to the mask itself, which doubles as a hint
 - `invalid`, `touched`, `onTouch()`
 - `className`, `ref` and every other `<input>` prop go to the input
 
@@ -22,7 +22,7 @@ digits therefore produce the same result, and deleting a literal cannot leave a
 pattern. Characters that match nothing are skipped rather than rejected, so stray letters around a
 number still format.
 
-Like the OTP field, the DOM is synced by hand when the mask drops a character — the value did not
+Like the OTP field, the DOM is synced by hand when the mask drops a character - the value did not
 change, so React would not re-render and the character would linger on screen.
 
 ## Examples
@@ -32,7 +32,7 @@ change, so React would not re-render and the character would linger on screen.
 ## Screen reader and keyboard
 The on-screen keyboard follows the mask: only `9` tokens (phone, postal code) give
 `inputMode="numeric"`, otherwise `text`; pass `inputMode` to override it, and `autoComplete` (`tel`,
-`postal-code`…) so the browser can fill the field in.
+`postal-code`...) so the browser can fill the field in.
 
 ## Label and description
 `id` goes to the native field, not the host; without one it comes from `KptFormField` or is

package/dist/input-number/input-number.d.ts

@@ -10,29 +10,29 @@ export interface KptInputNumberProps extends Omit<ComponentPropsWithRef<'div'>,
     placeholder?: string;
     /** Dopisek pokazywany za liczbą, np. ' szt.' albo 'ms'. */
     suffix?: string;
-    /** Przyciski krokowania. `false` daje samo pole — wariant do zakresów „od–do". */
+    /** Przyciski krokowania. `false` daje samo pole - wariant do zakresów "od-do". */
     showButtons?: boolean;
-    /** Id elementu fokusowalnego (nie hosta); bez niego generowane, w `KptFormField` — z wrappera. */
+    /** Id elementu fokusowalnego (nie hosta); bez niego generowane, w `KptFormField` - z wrappera. */
     id?: string;
     /** Nazwa dostępna, gdy kontrolki nie opisuje etykieta (`<label for>` albo `KptFormField`). */
     ariaLabel?: string | null;
     /** Oznacza pole jako wymagane atrybutem `aria-required`. */
     required?: boolean;
     disabled?: boolean;
-    /** Tylko do odczytu — wartość widać i da się ją zaznaczyć, ale nie zmienić (także strzałkami). */
+    /** Tylko do odczytu - wartość widać i da się ją zaznaczyć, ale nie zmienić (także strzałkami). */
     readOnly?: boolean;
     invalid?: boolean;
     touched?: boolean;
     onTouch?: () => void;
 }
 /**
- * Pole liczbowe ze strzałkami krokowania. Wartość to `number | null` — puste pole ma znaczenie,
- * bo „brak wartości" to nie to samo co zero.
+ * Pole liczbowe ze strzałkami krokowania. Wartość to `number | null` - puste pole ma znaczenie,
+ * bo "brak wartości" to nie to samo co zero.
  *
- * Pole to `role="spinbutton"` (z `aria-valuemin`/`max`/`now`, a przy `suffix` — `aria-valuetext`):
- * `↑`/`↓` zmieniają wartość o `step`, `PageUp`/`PageDown` o dziesięć kroków. Wpisywana liczba nie
- * jest przycinana w trakcie pisania (inaczej „150” przy `max` 99 stawało się „99”, zanim user skończył) —
- * granice działają przy krokowaniu i na `blur`. Przyciski `−`/`+` stoją poza kolejnością Tab i nie
+ * Pole to `role="spinbutton"` (z `aria-valuemin`/`max`/`now`, a przy `suffix` - `aria-valuetext`):
+ * `ArrowUp`/`ArrowDown` zmieniają wartość o `step`, `PageUp`/`PageDown` o dziesięć kroków. Wpisywana liczba nie
+ * jest przycinana w trakcie pisania (inaczej "150" przy `max` 99 stawało się "99", zanim user skończył) -
+ * granice działają przy krokowaniu i na `blur`. Przyciski `-`/`+` stoją poza kolejnością Tab i nie
  * zabierają fokusu polu.
  *
  * @example

package/dist/input-number/input-number.js

@@ -10,13 +10,13 @@ import { kptRoundTo } from "../internal/step.js";
 /** Liczba dziesiętna wpisana przez człowieka: bez `0x1A`, `1e3` i `Infinity`, które `Number()` też przyjmuje. */
 const DECIMAL = /^[-+]?(?:\d+\.?\d*|\.\d+)$/;
 /**
- * Pole liczbowe ze strzałkami krokowania. Wartość to `number | null` — puste pole ma znaczenie,
- * bo „brak wartości" to nie to samo co zero.
+ * Pole liczbowe ze strzałkami krokowania. Wartość to `number | null` - puste pole ma znaczenie,
+ * bo "brak wartości" to nie to samo co zero.
  *
- * Pole to `role="spinbutton"` (z `aria-valuemin`/`max`/`now`, a przy `suffix` — `aria-valuetext`):
- * `↑`/`↓` zmieniają wartość o `step`, `PageUp`/`PageDown` o dziesięć kroków. Wpisywana liczba nie
- * jest przycinana w trakcie pisania (inaczej „150” przy `max` 99 stawało się „99”, zanim user skończył) —
- * granice działają przy krokowaniu i na `blur`. Przyciski `−`/`+` stoją poza kolejnością Tab i nie
+ * Pole to `role="spinbutton"` (z `aria-valuemin`/`max`/`now`, a przy `suffix` - `aria-valuetext`):
+ * `ArrowUp`/`ArrowDown` zmieniają wartość o `step`, `PageUp`/`PageDown` o dziesięć kroków. Wpisywana liczba nie
+ * jest przycinana w trakcie pisania (inaczej "150" przy `max` 99 stawało się "99", zanim user skończył) -
+ * granice działają przy krokowaniu i na `blur`. Przyciski `-`/`+` stoją poza kolejnością Tab i nie
  * zabierają fokusu polu.
  *
  * @example
@@ -32,7 +32,7 @@ export function KptInputNumber({ value, defaultValue = null, onValueChange, min,
         onChange: onValueChange,
     });
     const showInvalid = invalid && (touched ?? true);
-    /** Tekst w trakcie pisania — dopóki jest, pole pokazuje go zamiast sformatowanej wartości. */
+    /** Tekst w trakcie pisania - dopóki jest, pole pokazuje go zamiast sformatowanej wartości. */
     const [draft, setDraft] = useState(null);
     const clamp = useCallback((n) => {
         if (min !== undefined && n < min)
@@ -41,17 +41,17 @@ export function KptInputNumber({ value, defaultValue = null, onValueChange, min,
             return max;
         return n;
     }, [min, max]);
-    // Zapis liczby wg aktywnego języka (PL: `12,5`), bez separatorów tysięcy — pole przyjmuje i kropkę,
+    // Zapis liczby wg aktywnego języka (PL: `12,5`), bez separatorów tysięcy - pole przyjmuje i kropkę,
     // i przecinek, a grupowanie cyfr rozjechałoby się z tym, co user wpisuje.
-    // `latn`: cyfry łacińskie także w locale z własnymi (np. `ar`) — inaczej pole pokazywałoby zapis,
+    // `latn`: cyfry łacińskie także w locale z własnymi (np. `ar`) - inaczej pole pokazywałoby zapis,
     // którego parser niżej nie przeczyta.
     const format = new Intl.NumberFormat(activeLocale, { useGrouping: false, maximumFractionDigits: 20, numberingSystem: 'latn' });
     const display = current === null || current === undefined || Number.isNaN(current) ? '' : `${format.format(current)}${suffix}`;
     const canIncrement = max === undefined || (current ?? -Infinity) < max;
     const canDecrement = min === undefined || (current ?? Infinity) > min;
     const onInput = (event) => {
-        // Przecinek jako separator dziesiętny i dopisek trafiają do pola razem z liczbą —
-        // czyścimy je przed parsowaniem, żeby wpisywanie „12,5 zł" działało naturalnie.
+        // Przecinek jako separator dziesiętny i dopisek trafiają do pola razem z liczbą -
+        // czyścimy je przed parsowaniem, żeby wpisywanie "12,5 zł" działało naturalnie.
         setDraft(event.target.value);
         const raw = event.target.value.replace(suffix, '').replace(',', '.').trim();
         if (raw === '') {

package/dist/input-number/llms.txt

@@ -5,20 +5,20 @@ A number field with stepper arrows. Import: `import { KptInputNumber } from '@ko
 ## DOM
     <div class="kpt-input-number-host">
       <div class="kpt-input-number">
-        <button class="kpt-input-number__btn" aria-label="Decrease">…</button>
+        <button class="kpt-input-number__btn" aria-label="Decrease">...</button>
         <input class="kpt-input-number__input" type="text" inputmode="decimal" value="12 zł">
-        <button class="kpt-input-number__btn" aria-label="Increase">…</button>
+        <button class="kpt-input-number__btn" aria-label="Increase">...</button>
       </div>
     </div>
 
 ## Props
-- `value` / `defaultValue` / `onValueChange` — `number | null`
+- `value` / `defaultValue` / `onValueChange` - `number | null`
 - `min`, `max`, `step` (default 1)
-- `placeholder`, `suffix` — text shown after the number, e.g. ' szt.' or 'ms'
-- `showButtons`: boolean (default true) — `false` leaves the bare field
-- `disabled`, `readOnly`, `invalid`, `touched`, `onTouch()` — `readOnly` leaves the value selectable but
+- `placeholder`, `suffix` - text shown after the number, e.g. ' szt.' or 'ms'
+- `showButtons`: boolean (default true) - `false` leaves the bare field
+- `disabled`, `readOnly`, `invalid`, `touched`, `onTouch()` - `readOnly` leaves the value selectable but
   blocks typing, the arrows and the buttons (`aria-readonly`)
-- `locale`, `dictionary` — i18n overrides for this component only
+- `locale`, `dictionary` - i18n overrides for this component only
 
 ## Null is a value
 The value is `number | null`, not `number`: an empty field means "no value", which is not the same
@@ -27,8 +27,8 @@ nothing to step from.
 
 ## A text input, not a number input
 The field is `type="text"` with `inputmode="decimal"`, so the suffix can live inside it and a comma
-works as the decimal separator — typing "12,5 zł" parses correctly. A native `type="number"` would
-reject both. Values out of range are clamped on blur and when stepping — not while typing.
+works as the decimal separator - typing "12,5 zł" parses correctly. A native `type="number"` would
+reject both. Values out of range are clamped on blur and when stepping - not while typing.
 
 ## i18n
 The stepper labels come from `inputNumber.decrement` and `inputNumber.increment`.
@@ -39,16 +39,16 @@ The stepper labels come from `inputNumber.decrement` and `inputNumber.increment`
 
 ## Keyboard
 The field is `role="spinbutton"` with `aria-valuemin`/`aria-valuemax`/`aria-valuenow` (and
-`aria-valuetext` with the `suffix`, "5 pcs"). `↑`/`↓` change the value by `step`,
+`aria-valuetext` with the `suffix`, "5 pcs"). `ArrowUp`/`ArrowDown` change the value by `step`,
 `PageUp`/`PageDown` by ten steps; stepping is rounded to the precision of `step` or of the current
 value, whichever is finer (`1.25` + 1 gives `2.25`, not `2`). Only a plain decimal is accepted while
-typing — `0x1A`, `1e3` and `Infinity` are ignored. A typed value is
-**not** clamped while typing ("150" with `max` 99 stays "150", so the form's `max()` can report it) —
-it is clamped on blur. The `−`/`+` buttons sit outside the Tab order and do not take focus from the
+typing - `0x1A`, `1e3` and `Infinity` are ignored. A typed value is
+**not** clamped while typing ("150" with `max` 99 stays "150", so the form's `max()` can report it) -
+it is clamped on blur. The `-`/`+` buttons sit outside the Tab order and do not take focus from the
 field, so focus never drops to `<body>` when a button goes disabled at a limit.
 
 ## Screen reader and keyboard
-The value is shown in the active locale's notation (PL `12,5`), without thousands separators — the
+The value is shown in the active locale's notation (PL `12,5`), without thousands separators - the
 field accepts both a dot and a comma, and digit grouping would clash with what the user types.
 
 ## Label and description

package/dist/input-otp/input-otp.d.ts

@@ -6,29 +6,29 @@ export interface KptInputOtpProps extends Omit<ComponentPropsWithRef<'div'>, 'on
     onValueChange?: (value: string) => void;
     length?: number;
     /**
-     * Co ile komórek wstawić separator, licząc od lewej (`3` przy `length` 9 → `[][][]–[][][]–[][][]`).
-     * `0` (domyślnie) — bez grup. Separator jest wyłącznie wizualny: wartość to same znaki.
+     * Co ile komórek wstawić separator, licząc od lewej (`3` przy `length` 9 -> `[][][]-[][][]-[][][]`).
+     * `0` (domyślnie) - bez grup. Separator jest wyłącznie wizualny: wartość to same znaki.
      */
     groupSize?: number;
     /** Znak między grupami komórek. */
     groupSeparator?: string;
     /** Dopuszcza wyłącznie cyfry i przełącza klawiaturę mobilną na numeryczną. */
     integerOnly?: boolean;
-    /** Id pierwszej komórki (nie hosta) — klik w etykietę zaczyna wpisywanie od początku. */
+    /** Id pierwszej komórki (nie hosta) - klik w etykietę zaczyna wpisywanie od początku. */
     id?: string;
     /** Nazwa grupy komórek, gdy nie opisuje jej etykieta (`KptFormField`). */
     ariaLabel?: string | null;
     disabled?: boolean;
-    /** Tylko do odczytu — kod widać, nie da się go zmienić. */
+    /** Tylko do odczytu - kod widać, nie da się go zmienić. */
     readOnly?: boolean;
-    /** Pole wymagane — `aria-required` na komórkach. */
+    /** Pole wymagane - `aria-required` na komórkach. */
     required?: boolean;
     invalid?: boolean;
     touched?: boolean;
     onTouch?: () => void;
 }
 /**
- * Pole kodu jednorazowego (OTP/PIN) — N osobnych pól, automatyczne przejście do następnego
+ * Pole kodu jednorazowego (OTP/PIN) - N osobnych pól, automatyczne przejście do następnego
  * i wklejanie całego kodu naraz. Wartością są wpisane znaki **bez dziur** (`'13'`, nie `'1 3'`), więc
  * walidator długości i backend widzą tyle znaków, ile naprawdę wpisano.
  *

package/dist/input-otp/input-otp.js

@@ -6,7 +6,7 @@ import { useControllableState } from "../internal/use-controllable-state.js";
 import { useKptFieldA11y } from "../form-field/form-field-context.js";
 import { useKptMessages } from "../i18n/i18n-context.js";
 /**
- * Pole kodu jednorazowego (OTP/PIN) — N osobnych pól, automatyczne przejście do następnego
+ * Pole kodu jednorazowego (OTP/PIN) - N osobnych pól, automatyczne przejście do następnego
  * i wklejanie całego kodu naraz. Wartością są wpisane znaki **bez dziur** (`'13'`, nie `'1 3'`), więc
  * walidator długości i backend widzą tyle znaków, ile naprawdę wpisano.
  *
@@ -14,7 +14,7 @@ import { useKptMessages } from "../i18n/i18n-context.js";
  * <KptInputOtp value={code} onValueChange={setCode} length={6} integerOnly />
  * <KptInputOtp value={code} onValueChange={setCode} length={9} groupSize={3} />
  */
-export function KptInputOtp({ value, defaultValue = '', onValueChange, length = 6, groupSize = 0, groupSeparator = '–', integerOnly = false, id, ariaLabel = null, disabled = false, readOnly = false, required = false, invalid = false, touched, onTouch, locale, dictionary, className, ...rest }) {
+export function KptInputOtp({ value, defaultValue = '', onValueChange, length = 6, groupSize = 0, groupSeparator = '-', integerOnly = false, id, ariaLabel = null, disabled = false, readOnly = false, required = false, invalid = false, touched, onTouch, locale, dictionary, className, ...rest }) {
     const { t } = useKptMessages({ locale, dictionary });
     const field = useKptFieldA11y(id, 'kpt-input-otp');
     const [current, setCurrent] = useControllableState({ value, defaultValue, onChange: onValueChange });
@@ -22,8 +22,8 @@ export function KptInputOtp({ value, defaultValue = '', onValueChange, length =
     /*
      * Komórki trzymają układ osobno od wartości: wyczyszczenie środkowej zostawia w niej pustkę,
      * zamiast przesuwać resztę kodu w lewo, a wartość to same znaki. Zmiana wartości z zewnątrz
-     * (inna niż złożenie bieżących komórek) układa znaki od początku — wzorzec „poprzednia
-     * wartość w stanie”, bez efektu.
+     * (inna niż złożenie bieżących komórek) układa znaki od początku - wzorzec "poprzednia
+     * wartość w stanie", bez efektu.
      */
     const toCells = (text) => Array.from({ length }, (_, index) => text[index] ?? '');
     const [cells, setCells] = useState(() => toCells(current));
@@ -32,7 +32,7 @@ export function KptInputOtp({ value, defaultValue = '', onValueChange, length =
         setCells(toCells(current));
     const shown = inSync ? cells : toCells(current);
     const charAt = (index) => shown[index] ?? '';
-    /** Zapis komórek i złożonej z nich wartości — jedno miejsce, żeby układ i model się nie rozjechały. */
+    /** Zapis komórek i złożonej z nich wartości - jedno miejsce, żeby układ i model się nie rozjechały. */
     const commitCells = (next) => {
         setCells(next);
         setCurrent(next.join(''));
@@ -42,7 +42,7 @@ export function KptInputOtp({ value, defaultValue = '', onValueChange, length =
         next[index] = char;
         commitCells(next);
     };
-    /** Następna/poprzednia komórka — po polach, nie po rodzeństwie, bo między grupami stoi separator. */
+    /** Następna/poprzednia komórka - po polach, nie po rodzeństwie, bo między grupami stoi separator. */
     const focusSibling = (el, direction) => {
         const cells = [...(el.closest('.kpt-input-otp')?.querySelectorAll('input') ?? [])];
         cells[cells.indexOf(el) + direction]?.focus();
@@ -50,7 +50,7 @@ export function KptInputOtp({ value, defaultValue = '', onValueChange, length =
     /** Czy za komórką `index` kończy się grupa (a nie cały kod). */
     const group = Math.floor(groupSize);
     const separatorAfter = (index) => group >= 1 && (index + 1) % group === 0 && index < length - 1;
-    /** Wpisuje `text` od komórki `start` (bez spacji i — przy `integerOnly` — bez nie-cyfr). */
+    /** Wpisuje `text` od komórki `start` (bez spacji i - przy `integerOnly` - bez nie-cyfr). */
     const fillFrom = (start, text, el) => {
         let chars = text.replace(/\s/g, '');
         if (integerOnly)
@@ -59,7 +59,7 @@ export function KptInputOtp({ value, defaultValue = '', onValueChange, length =
         for (let k = 0; k < chars.length && start + k < length; k += 1)
             arr[start + k] = chars[k];
         commitCells(arr);
-        // Fokus na pierwszą pustą komórkę, a przy komplecie — na ostatnią.
+        // Fokus na pierwszą pustą komórkę, a przy komplecie - na ostatnią.
         const inputs = [...(el.closest('.kpt-input-otp')?.querySelectorAll('input') ?? [])];
         const empty = arr.findIndex((char) => char === '');
         inputs[empty >= 0 ? empty : inputs.length - 1]?.focus();
@@ -69,7 +69,7 @@ export function KptInputOtp({ value, defaultValue = '', onValueChange, length =
         if (readOnly)
             return;
         // Kilka znaków naraz to autouzupełnienie kodu z SMS (`one-time-code`) albo wklejenie przez
-        // klawiaturę ekranową — rozkładamy je po komórkach od bieżącej. Dwa znaki w zajętej komórce
+        // klawiaturę ekranową - rozkładamy je po komórkach od bieżącej. Dwa znaki w zajętej komórce
         // to zwykłe nadpisanie: stary znak + nowy.
         if (el.value.length > 1 && !(el.value.length === 2 && charAt(index))) {
             const text = el.value;
@@ -102,7 +102,7 @@ export function KptInputOtp({ value, defaultValue = '', onValueChange, length =
             return;
         fillFrom(0, event.clipboardData.getData('text'), event.currentTarget);
     };
-    /** „Dotknięcie” dopiero przy wyjściu fokusu z całej grupy, nie przy przejściu między komórkami. */
+    /** "Dotknięcie" dopiero przy wyjściu fokusu z całej grupy, nie przy przejściu między komórkami. */
     const onGroupBlur = (event) => {
         const next = event.relatedTarget;
         if (!next || !event.currentTarget.contains(next))

package/dist/input-otp/llms.txt

@@ -1,25 +1,25 @@
 # KptInputOtp (@konce-pt/react)
 
-A one-time code field (OTP / PIN) — N separate boxes, auto-advance and paste.
+A one-time code field (OTP / PIN) - N separate boxes, auto-advance and paste.
 Import: `import { KptInputOtp } from '@konce-pt/react';`
 
 ## DOM
     <div class="kpt-input-otp-host">
       <div class="kpt-input-otp">
         <input class="kpt-input-otp__cell" type="text" inputmode="numeric" maxlength="1" value="1">
-        …N cells…
+        ...N cells...
       </div>
     </div>
 
 ## Props
-- `value` / `defaultValue` / `onValueChange` — one string, the characters joined
+- `value` / `defaultValue` / `onValueChange` - one string, the characters joined
 - `length`: number (default 6)
-- `integerOnly`: boolean — digits only, and a numeric keyboard on mobile
+- `integerOnly`: boolean - digits only, and a numeric keyboard on mobile
 - `disabled`, `invalid`, `touched`, `onTouch()`
 
 ## One string, N boxes
 The value is a single string while the UI is N inputs, so a gap in the middle has to be
-expressible. Writing pads with spaces, replaces the character and trims trailing spaces — that way
+expressible. Writing pads with spaces, replaces the character and trims trailing spaces - that way
 a code with a hole round-trips and a single character does not turn into one followed by blanks.
 
 The DOM of a cell is also synced by hand after a rejected character: the value did not change, so
@@ -28,7 +28,7 @@ React has nothing to re-render, and the typed character would otherwise stay on
 ## Keyboard and paste
 A character moves focus to the next cell; Backspace in an empty cell moves back; ArrowLeft and
 ArrowRight walk the cells; focus selects the content so typing overwrites. Pasting fills the whole
-code at once — with `integerOnly` everything non-numeric is stripped first, so a copied
+code at once - with `integerOnly` everything non-numeric is stripped first, so a copied
 "123-456" still lands correctly.
 
 ## Examples
@@ -38,7 +38,7 @@ code at once — with `integerOnly` everything non-numeric is stripped first, so
 ## Screen reader and keyboard
 The first cell has `autocomplete="one-time-code"`, so phones offer the code from an SMS; a code that
 arrives in one cell at once (autofill, an on-screen keyboard paste) is spread over the cells like a
-paste. `touch` fires when focus leaves the whole group — not after a paste, and not when moving
+paste. `touch` fires when focus leaves the whole group - not after a paste, and not when moving
 between cells.
 
 ## Label and description
@@ -61,8 +61,8 @@ keypad for a PIN instead of the full keyboard.
 
 ## Groups
 `groupSize` (default `0` = no groups) inserts a separator after every N boxes, counted from the
-left; `groupSeparator` sets the character (default `–`). With `length` 9 and `groupSize` 3 you get
-`[][][]–[][][]–[][][]`. The separator is purely visual (`aria-hidden`): the value is the bare characters
+left; `groupSeparator` sets the character (default `-`). With `length` 9 and `groupSize` 3 you get
+`[][][]-[][][]-[][][]`. The separator is purely visual (`aria-hidden`): the value is the bare characters
 (`"123456789"`), each box keeps its name "Character 4 of 9", and arrows/Backspace jump over it.
 
     <KptInputOtp value={code} onValueChange={setCode} length={9} groupSize={3} integerOnly />

package/dist/internal/calendar-focus.d.ts

@@ -1,7 +1,7 @@
 /** Zawija `Tab` / `Shift+Tab` w obrębie `panel`. */
 export declare function trapTab(panel: HTMLElement, event: KeyboardEvent): void;
 /**
- * Fokus na „aktywną” komórkę panelu: dzień `iso`, przystanek siatki komórek, a bez nich — pierwszy
+ * Fokus na "aktywną" komórkę panelu: dzień `iso`, przystanek siatki komórek, a bez nich - pierwszy
  * element panelu (zegar). Panel w nakładce jest niewidoczny do pierwszego pomiaru, więc wołający
  * odkłada to na `requestAnimationFrame`.
  */

package/dist/internal/calendar-focus.js

@@ -1,9 +1,9 @@
 /*
- * Fokus w panelu kalendarza — wspólny dla `KptDatepicker` i `KptDateRange`. Panel stoi
+ * Fokus w panelu kalendarza - wspólny dla `KptDatepicker` i `KptDateRange`. Panel stoi
  * w nakładce na końcu strony, więc `Tab` z ostatniego elementu uciekłby poza niego; zawijamy go
  * w obrębie panelu, jak w oknie dialogowym.
  *
- * Bliźniak w porcie Angulara: `shared/calendar-focus.ts` — zmiana zachowania w obu.
+ * Bliźniak w porcie Angulara: `shared/calendar-focus.ts` - zmiana zachowania w obu.
  */
 const FOCUSABLE = 'button:not(:disabled):not([tabindex="-1"]), input:not(:disabled), [tabindex="0"]';
 /** Zawija `Tab` / `Shift+Tab` w obrębie `panel`. */
@@ -24,7 +24,7 @@ export function trapTab(panel, event) {
     }
 }
 /**
- * Fokus na „aktywną” komórkę panelu: dzień `iso`, przystanek siatki komórek, a bez nich — pierwszy
+ * Fokus na "aktywną" komórkę panelu: dzień `iso`, przystanek siatki komórek, a bez nich - pierwszy
  * element panelu (zegar). Panel w nakładce jest niewidoczny do pierwszego pomiaru, więc wołający
  * odkłada to na `requestAnimationFrame`.
  */

package/dist/internal/cn.d.ts

@@ -1,5 +1,5 @@
 /**
- * Sklejanie klas CSS. Odpowiednik `clsx` w kilkunastu linijkach — biblioteka
+ * Sklejanie klas CSS. Odpowiednik `clsx` w kilkunastu linijkach - biblioteka
  * zostaje bez zależności runtime, a konsument nie ryzykuje konfliktu wersji.
  *
  * Wartości fałszywe są pomijane, tablice spłaszczane, duplikaty usuwane

package/dist/internal/mask.d.ts

@@ -2,13 +2,13 @@
 export declare const KPT_MASK_TOKENS: Readonly<Record<string, RegExp>>;
 /**
  * Maska przepisuje wejście od zera: z tekstu bierze wyłącznie znaki pasujące do kolejnych
- * tokenów, a literały wstawia sama. Dzięki temu wklejenie „48123456789” i wpisanie „(48) 123…”
+ * tokenów, a literały wstawia sama. Dzięki temu wklejenie "48123456789" i wpisanie "(48) 123..."
  * dają ten sam wynik, a usunięcie literału nie zostawia dziury we wzorcu.
  */
 export declare function kptApplyMask(raw: string, mask: string): string;
 /**
  * Pozycja kursora po przeformatowaniu. Liczy znaczące znaki (te, które maska zabrała) przed
- * kursorem w surowym tekście i stawia kursor za tyloma samymi znakami w wyniku — poprawienie
+ * kursorem w surowym tekście i stawia kursor za tyloma samymi znakami w wyniku - poprawienie
  * cyfry w środku numeru nie przerzuca kursora na koniec pola.
  */
 export declare function kptMaskCaret(raw: string, caret: number, mask: string): number;

package/dist/internal/mask.js

@@ -1,5 +1,5 @@
 /*
- * Maska znakowa `kpt-input-mask`. Bliźniak w porcie Angulara (`shared/mask.ts`) — zmiana w obu.
+ * Maska znakowa `kpt-input-mask`. Bliźniak w porcie Angulara (`shared/mask.ts`) - zmiana w obu.
  */
 /** Tokeny maski: `9` = cyfra, `a` = litera (także `ą`, `ł`, `ß`), `*` = litera albo cyfra. */
 export const KPT_MASK_TOKENS = {
@@ -9,7 +9,7 @@ export const KPT_MASK_TOKENS = {
 };
 /**
  * Maska przepisuje wejście od zera: z tekstu bierze wyłącznie znaki pasujące do kolejnych
- * tokenów, a literały wstawia sama. Dzięki temu wklejenie „48123456789” i wpisanie „(48) 123…”
+ * tokenów, a literały wstawia sama. Dzięki temu wklejenie "48123456789" i wpisanie "(48) 123..."
  * dają ten sam wynik, a usunięcie literału nie zostawia dziury we wzorcu.
  */
 export function kptApplyMask(raw, mask) {
@@ -37,7 +37,7 @@ export function kptApplyMask(raw, mask) {
 }
 /**
  * Pozycja kursora po przeformatowaniu. Liczy znaczące znaki (te, które maska zabrała) przed
- * kursorem w surowym tekście i stawia kursor za tyloma samymi znakami w wyniku — poprawienie
+ * kursorem w surowym tekście i stawia kursor za tyloma samymi znakami w wyniku - poprawienie
  * cyfry w środku numeru nie przerzuca kursora na koniec pola.
  */
 export function kptMaskCaret(raw, caret, mask) {
@@ -45,7 +45,7 @@ export function kptMaskCaret(raw, caret, mask) {
     if (!mask)
         return Math.min(caret, formatted.length);
     const before = kptApplyMask(raw.slice(0, caret), mask);
-    // Ile znaczących znaków jest przed kursorem — liczone na wyniku, więc literały się nie liczą.
+    // Ile znaczących znaków jest przed kursorem - liczone na wyniku, więc literały się nie liczą.
     let significant = 0;
     for (let i = 0; i < before.length; i += 1)
         if (KPT_MASK_TOKENS[mask[i]])

package/dist/internal/option-key.d.ts

@@ -1,6 +1,6 @@
 /**
- * Klucz Reacta dla opcji kontrolki generycznej: wartość prymitywna jako tekst, obiekt — pozycja.
- * `String(obiekt)` dawałby „[object Object]” dla każdej opcji, czyli zdublowane klucze i stan
+ * Klucz Reacta dla opcji kontrolki generycznej: wartość prymitywna jako tekst, obiekt - pozycja.
+ * `String(obiekt)` dawałby "[object Object]" dla każdej opcji, czyli zdublowane klucze i stan
  * przenoszony między opcjami przy zmianie listy.
  */
 export declare function optionKey(value: unknown, index: number): string;

package/dist/internal/option-key.js

@@ -1,6 +1,6 @@
 /**
- * Klucz Reacta dla opcji kontrolki generycznej: wartość prymitywna jako tekst, obiekt — pozycja.
- * `String(obiekt)` dawałby „[object Object]” dla każdej opcji, czyli zdublowane klucze i stan
+ * Klucz Reacta dla opcji kontrolki generycznej: wartość prymitywna jako tekst, obiekt - pozycja.
+ * `String(obiekt)` dawałby "[object Object]" dla każdej opcji, czyli zdublowane klucze i stan
  * przenoszony między opcjami przy zmianie listy.
  */
 export function optionKey(value, index) {