@konce-pt/react 0.12.0 → 0.15.0

package/dist/rich-text/sanitize.js

@@ -1,6 +1,6 @@
 /*
- * Sanityzacja treści edytora. Kod nie zna frameworka — operuje wyłącznie na DOM. Bliźniak
- * w porcie Angulara: `rich-text/sanitize.ts` — zmiana w obu (docelowo wspólna paczka pure-TS).
+ * Sanityzacja treści edytora. Kod nie zna frameworka - operuje wyłącznie na DOM. Bliźniak
+ * w porcie Angulara: `rich-text/sanitize.ts` - zmiana w obu (docelowo wspólna paczka pure-TS).
  */
 /** Znaczniki dopuszczone w treści; pozostałe rozwijamy do dzieci, nie usuwając tekstu. */
 const ALLOWED_TAGS = new Set([
@@ -15,7 +15,7 @@ const ALLOWED_STYLES = new Set([
 /*
  * `data-mention` i `contenteditable` są tu dla wzmianek: identyfikator musi przeżyć zapis treści,
  * a `contenteditable="false"` trzyma wzmiankę jako jeden kawałek, w którego środku nie da się
- * pisać. Oba atrybuty są bierne — nie wykonują niczego i nie wskazują zasobów, więc wpuszczenie
+ * pisać. Oba atrybuty są bierne - nie wykonują niczego i nie wskazują zasobów, więc wpuszczenie
  * ich nie otwiera nowej furtki. `class` przechodzi osobno, tylko z klasami samego edytora.
  */
 const ALLOWED_ATTRS = new Set([
@@ -23,12 +23,12 @@ const ALLOWED_ATTRS = new Set([
     'data-mention', 'contenteditable',
 ]);
 /**
- * Klasy, które zostawia sam edytor (`kpt-rt-table`, `kpt-mention`). Obce klasy z wklejki — aplikacji,
- * biblioteki (`kpt-dialog`, `kpt-visually-hidden`) czy Tailwinda — przejęłyby ich wygląd tam,
+ * Klasy, które zostawia sam edytor (`kpt-rt-table`, `kpt-mention`). Obce klasy z wklejki - aplikacji,
+ * biblioteki (`kpt-dialog`, `kpt-visually-hidden`) czy Tailwinda - przejęłyby ich wygląd tam,
  * gdzie aplikacja wyświetla treść.
  */
 const EDITOR_CLASS = /^kpt-(rt-[a-z0-9-]+|mention)$/;
-// Schematy dopuszczone w `href` — ta sama allowlista dla narzędzia „link” i dla wklejonego HTML.
+// Schematy dopuszczone w `href` - ta sama allowlista dla narzędzia "link" i dla wklejonego HTML.
 const SAFE_URL_SCHEME = /^(https?:|mailto:|tel:)/i;
 const HAS_URL_SCHEME = /^[a-z][a-z0-9+.-]*:/i;
 /** Znaki sterujące, które przeglądarka pomija przy parsowaniu URL-a (`jav\tascript:`). */
@@ -63,7 +63,7 @@ function sanitizeAttribute(el, attr, report) {
         if (kept === null)
             remove();
         else if (kept.split('; ').length !== declared) {
-            // Zmiana tylko wtedy, gdy wypadła deklaracja — samo przeformatowanie zapisu się nie liczy.
+            // Zmiana tylko wtedy, gdy wypadła deklaracja - samo przeformatowanie zapisu się nie liczy.
             el.setAttribute('style', kept);
             report.changed = true;
         }
@@ -79,11 +79,11 @@ function sanitizeAttribute(el, attr, report) {
         }
     }
     else if (!ALLOWED_ATTRS.has(name)) {
-        // Także `on*` i `src` — żaden dopuszczony znacznik nie ładuje zasobów.
+        // Także `on*` i `src` - żaden dopuszczony znacznik nie ładuje zasobów.
         remove();
     }
 }
-/** Link otwierany w nowej karcie dostaje `noopener noreferrer` — bez tego karta sięga do `opener`. */
+/** Link otwierany w nowej karcie dostaje `noopener noreferrer` - bez tego karta sięga do `opener`. */
 function secureTarget(el, report) {
     if (el.tagName !== 'A' || !el.hasAttribute('target'))
         return;
@@ -107,7 +107,7 @@ function sanitizeElement(el, report) {
     secureTarget(el, report);
 }
 /**
- * Czyści HTML i mówi, czy coś usunął. `changed: false` znaczy, że treść była czysta — wtedy
+ * Czyści HTML i mówi, czy coś usunął. `changed: false` znaczy, że treść była czysta - wtedy
  * wołający nie musi nadpisywać wartości modelu (serializacja DOM potrafi zmienić zapis, np.
  * cudzysłowy, bez zmiany treści, a taka różnica nie może brudzić formularza).
  */
@@ -127,8 +127,8 @@ export function sanitizeHtml(html) {
     return sanitizeHtmlReport(html).html;
 }
 /**
- * Waliduje URL z narzędzia „link". Brak schematu → dopisujemy `https://`; `#` i `/` przechodzą
- * bez zmian; schemat spoza allowlisty → `null`, czyli link nie zostaje wstawiony.
+ * Waliduje URL z narzędzia "link". Brak schematu -> dopisujemy `https://`; `#` i `/` przechodzą
+ * bez zmian; schemat spoza allowlisty -> `null`, czyli link nie zostaje wstawiony.
  */
 export function sanitizeUrl(url) {
     const trimmed = url.trim().replace(URL_CONTROL, '');

package/dist/rich-text/tables.d.ts

@@ -14,7 +14,7 @@ export interface Bounds {
 }
 /** Klasa znacząca komórki objęte zaznaczeniem prostokątnym. */
 export declare const CELL_SELECTED = "kpt-rt-cell-sel";
-/** Macierz komórek: pozycja w siatce, a nie w DOM — scalona komórka zajmuje kilka pól. */
+/** Macierz komórek: pozycja w siatce, a nie w DOM - scalona komórka zajmuje kilka pól. */
 export declare function buildGrid(table: HTMLTableElement): {
     grid: HTMLTableCellElement[][];
     pos: GridPos;
@@ -23,7 +23,7 @@ export declare function buildGrid(table: HTMLTableElement): {
 export declare function cellsInRegion(grid: HTMLTableCellElement[][], b: Bounds): Set<HTMLTableCellElement>;
 /**
  * Prostokątne zaznaczenie od komórki-kotwicy do komórki pod kursorem. Granice rosną, aż region
- * w pełni obejmie scalone komórki na brzegach — inaczej scalanie działałoby na pół komórki.
+ * w pełni obejmie scalone komórki na brzegach - inaczej scalanie działałoby na pół komórki.
  */
 export declare function regionBetween(anchor: HTMLTableCellElement, focus: HTMLTableCellElement): Set<HTMLTableCellElement>;
 /** Równe szerokości kolumn po wstawieniu albo usunięciu kolumny. */
@@ -34,7 +34,7 @@ export declare function insertColumn(cell: HTMLTableCellElement, dir: 'left' | '
 export declare function deleteColumn(cell: HTMLTableCellElement): void;
 export declare function insertRow(cell: HTMLTableCellElement, dir: 'above' | 'below'): void;
 export declare function deleteRow(cell: HTMLTableCellElement): void;
-/** Podmienia znacznik komórki `td` ↔ `th`, zachowując atrybuty i treść. */
+/** Podmienia znacznik komórki `td` <-> `th`, zachowując atrybuty i treść. */
 export declare function swapCellTag(cell: HTMLTableCellElement, tag: 'td' | 'th'): void;
 export declare function toggleHeaderRow(cell: HTMLTableCellElement): void;
 export declare function toggleHeaderColumn(cell: HTMLTableCellElement): void;

package/dist/rich-text/tables.js

@@ -4,7 +4,7 @@
  */
 /** Klasa znacząca komórki objęte zaznaczeniem prostokątnym. */
 export const CELL_SELECTED = 'kpt-rt-cell-sel';
-/** Macierz komórek: pozycja w siatce, a nie w DOM — scalona komórka zajmuje kilka pól. */
+/** Macierz komórek: pozycja w siatce, a nie w DOM - scalona komórka zajmuje kilka pól. */
 export function buildGrid(table) {
     const grid = [];
     const pos = new Map();
@@ -65,7 +65,7 @@ function growBounds(grid, pos, b) {
 }
 /**
  * Prostokątne zaznaczenie od komórki-kotwicy do komórki pod kursorem. Granice rosną, aż region
- * w pełni obejmie scalone komórki na brzegach — inaczej scalanie działałoby na pół komórki.
+ * w pełni obejmie scalone komórki na brzegach - inaczej scalanie działałoby na pół komórki.
  */
 export function regionBetween(anchor, focus) {
     const table = anchor.closest('table');
@@ -153,7 +153,7 @@ export function deleteRow(cell) {
     }
     tr.remove();
 }
-/** Podmienia znacznik komórki `td` ↔ `th`, zachowując atrybuty i treść. */
+/** Podmienia znacznik komórki `td` <-> `th`, zachowując atrybuty i treść. */
 export function swapCellTag(cell, tag) {
     if (cell.tagName.toLowerCase() === tag)
         return;

package/dist/roadmap/llms.txt

@@ -9,40 +9,40 @@ A separate subpath, because the geometry, the styles and the data model are heav
 library core and not every app needs them.
 
 ## Props
-- `config`: `KptRoadmapConfig` (required) — the data and every option
-- `scrollHeight`: string | null — a fixed height, e.g. '420px'; enables the sticky header
-- `labelWidth`: string — the width of the label column (default '14rem')
-- `cellWidthPx`: number | null — the width of an axis column; without it the value depends on the zoom
-- `showToday`: boolean — the "today" marker (default true)
-- `virtual`: boolean — renders only the visible rows; worth it from roughly 100 rows up
-- `collapsedGroups` / `defaultCollapsedGroups` / `onCollapsedGroupsChange` — the ids of collapsed
+- `config`: `KptRoadmapConfig` (required) - the data and every option
+- `scrollHeight`: string | null - a fixed height, e.g. '420px'; enables the sticky header
+- `labelWidth`: string - the width of the label column (default '14rem')
+- `cellWidthPx`: number | null - the width of an axis column; without it the value depends on the zoom
+- `showToday`: boolean - the "today" marker (default true)
+- `virtual`: boolean - renders only the visible rows; worth it from roughly 100 rows up
+- `collapsedGroups` / `defaultCollapsedGroups` / `onCollapsedGroupsChange` - the ids of collapsed
   groups, controlled or uncontrolled
-- `onItemClick(item)`, `onRangeChange(range)` — the click on a bar and the computed axis range
+- `onItemClick(item)`, `onRangeChange(range)` - the click on a bar and the computed axis range
 - `className`, `ref` and every other `<div>` prop go to the host
-- `locale`, `dictionary` — the per-component i18n overrides
+- `locale`, `dictionary` - the per-component i18n overrides
 
 ## The config is the API
 `{ items, groups?, links?, zoom?, range?, locale?, today?, timeline?, rows?, dependencies?,
-interaction? }` — the same shape the Angular port takes, because both read it from
+interaction? }` - the same shape the Angular port takes, because both read it from
 `@konce-pt/roadmap`. An item is `{ id, label, start, end?, sublabel?, variant?, color?, progress?,
 groupId?, dependsOn?, milestone?, meta? }`; no `end` means a milestone diamond, and a bare string in
 `dependsOn` is an 'FS' dependency.
 
 ## The geometry lives in a package
 The calendar arithmetic, the timeline bands and cells, the row layout, lane packing and the
-dependency polylines come from `@konce-pt/roadmap` — pure functions with `node --test` coverage,
+dependency polylines come from `@konce-pt/roadmap` - pure functions with `node --test` coverage,
 shared with the Angular port. The component only turns them into DOM and SVG.
 
 ## Collapsing has two sources
 `group.collapsed` in the data and the `collapsedGroups` prop are kept apart, so an app that controls
 the state keeps control while a group collapsed declaratively still works. Expanding removes the
-group from both — otherwise `group.collapsed` would immediately collapse it again. The declarative
+group from both - otherwise `group.collapsed` would immediately collapse it again. The declarative
 set is recomputed during render whenever the `groups` array identity changes; an effect would do it
 one render too late, that is after the group flashed open.
 
 ## Measuring, not guessing
 The SVG dependency layer works in pixels, so the lane width and the scroll viewport are measured
-with a `ResizeObserver` in a layout effect. Before the first measurement no link is drawn — half a
+with a `ResizeObserver` in a layout effect. Before the first measurement no link is drawn - half a
 frame without arrows beats arrows in the wrong place.
 
 ## Examples
@@ -63,7 +63,7 @@ frame without arrows beats arrows in the wrong place.
   different lengths; inside a column the position is interpolated linearly.
 - An item extending past the axis range is cut off on the side where it is clipped.
 - Tooltips use `KptTooltip`, mostly with `onlyWhenTruncated`: a tooltip shows what cannot be seen.
-  Milestones and header cells carry one unconditionally — a diamond shows no text at all.
+  Milestones and header cells carry one unconditionally - a diamond shows no text at all.
 - Dependencies: 'FS' (the default), 'SS', 'FF', 'SF'; violated ones are drawn as a dashed line in
   the danger color.
 - Entries with an invalid date or a duplicate `id` are skipped, with a warning in a development build.
@@ -79,7 +79,7 @@ Sizes: `--kpt-roadmap-label-w`, `--kpt-roadmap-cell-w` (both can be overridden f
 
 ## Accessibility
 Bars and milestones are `role="button"` with an accessible name built from the label, sublabel, date range
-and progress (`Design, 3–14 Mar 2026, 40% complete`) — the end is exclusive, so the last occupied day is
+and progress (`Design, 3-14 Mar 2026, 40% complete`) - the end is exclusive, so the last occupied day is
 announced. The whole bar grid is one Tab stop (roving tabindex): Left/Right move within a row, Up/Down go to
 the bar with the nearest start in the neighbouring row, Home/End jump to the row's edge, Ctrl+Home/End to the
 first/last bar; Enter and Space act like a click. With `virtual` on, moving to a row outside the window

package/dist/roadmap/roadmap.d.ts

@@ -8,15 +8,15 @@ export interface KptRoadmapProps<TItem = unknown, TGroup = unknown> extends Omit
     scrollHeight?: string | null;
     /** Szerokość kolumny etykiet. */
     labelWidth?: string;
-    /** Szerokość kolumny osi czasu; brak ⇒ wartość zależna od zoomu. */
+    /** Szerokość kolumny osi czasu; brak => wartość zależna od zoomu. */
     cellWidthPx?: number | null;
-    /** Znacznik „dziś". */
+    /** Znacznik "dziś". */
     showToday?: boolean;
     /** Renderowanie tylko widocznych wierszy. Warto włączyć od ~100 wierszy. */
     virtual?: boolean;
-    /** Zwinięte grupy — tryb kontrolowany. */
+    /** Zwinięte grupy - tryb kontrolowany. */
     collapsedGroups?: string[];
-    /** Zwinięte grupy na starcie — tryb niekontrolowany. */
+    /** Zwinięte grupy na starcie - tryb niekontrolowany. */
     defaultCollapsedGroups?: string[];
     onCollapsedGroupsChange?: (ids: string[]) => void;
     onItemClick?: (item: KptRoadmapItem<TItem>) => void;
@@ -24,11 +24,11 @@ export interface KptRoadmapProps<TItem = unknown, TGroup = unknown> extends Omit
     onRangeChange?: (range: KptTimeRange) => void;
 }
 /**
- * Roadmapa — wiersze zadań na poziomej osi czasu (widok typu Gantt).
+ * Roadmapa - wiersze zadań na poziomej osi czasu (widok typu Gantt).
  *
  * Układ opiera się na DOM i `position: sticky` (kolumna etykiet oraz nagłówek),
  * paski są pozycjonowane procentowo w torze, a zależności rysuje warstwa SVG
- * rozpięta nad torami. Cała geometria pochodzi z `@konce-pt/roadmap` — tej samej
+ * rozpięta nad torami. Cała geometria pochodzi z `@konce-pt/roadmap` - tej samej
  * paczki, z której korzysta port Angulara.
  *
  * @example

package/dist/roadmap/roadmap.js

@@ -16,16 +16,16 @@ const CELL_WIDTH = {
     day: 44,
     hour: 46,
 };
-/** Wysokość paska w trybie „jeden item na wiersz" (px). */
+/** Wysokość paska w trybie "jeden item na wiersz" (px). */
 const BAR_HEIGHT = 22;
-/** Odstęp między pasami w trybie „pack" (px). */
+/** Odstęp między pasami w trybie "pack" (px). */
 const LANE_GAP = 4;
 /**
- * Roadmapa — wiersze zadań na poziomej osi czasu (widok typu Gantt).
+ * Roadmapa - wiersze zadań na poziomej osi czasu (widok typu Gantt).
  *
  * Układ opiera się na DOM i `position: sticky` (kolumna etykiet oraz nagłówek),
  * paski są pozycjonowane procentowo w torze, a zależności rysuje warstwa SVG
- * rozpięta nad torami. Cała geometria pochodzi z `@konce-pt/roadmap` — tej samej
+ * rozpięta nad torami. Cała geometria pochodzi z `@konce-pt/roadmap` - tej samej
  * paczki, z której korzysta port Angulara.
  *
  * @example
@@ -41,7 +41,7 @@ export function KptRoadmap({ config, scrollHeight = null, labelWidth = '14rem',
     /**
      * Grupy zwinięte na starcie przez `group.collapsed`. Trzymamy je osobno od stanu aplikacji,
      * żeby sterowanie z zewnątrz pozostało w jej rękach, a zwinięcie zadeklarowane w danych
-     * nadal działało. Wyliczamy w trakcie renderu i resetujemy, gdy zmieni się lista grup —
+     * nadal działało. Wyliczamy w trakcie renderu i resetujemy, gdy zmieni się lista grup -
      * efekt zrobiłby to samo o jeden render za późno, czyli po mignięciu rozwiniętej grupy.
      */
     const [fromConfig, setFromConfig] = useState(() => declaredCollapsed(config.groups));
@@ -50,13 +50,13 @@ export function KptRoadmap({ config, scrollHeight = null, labelWidth = '14rem',
         setPrevGroups(config.groups);
         setFromConfig(declaredCollapsed(config.groups));
     }
-    /** Suma obu źródeł — stan faktycznie użyty do budowy wierszy. */
+    /** Suma obu źródeł - stan faktycznie użyty do budowy wierszy. */
     const collapsedIds = useMemo(() => new Set([...fromConfig, ...collapsed]), [fromConfig, collapsed]);
     const scrollRef = useRef(null);
     const laneRef = useRef(null);
     const [scrollTop, setScrollTop] = useState(0);
     const [viewportHeight, setViewportHeight] = useState(0);
-    /** Szerokość toru w px — potrzebna warstwie SVG, która pracuje w pikselach. */
+    /** Szerokość toru w px - potrzebna warstwie SVG, która pracuje w pikselach. */
     const [laneWidth, setLaneWidth] = useState(0);
     const zoom = config.zoom ?? 'week';
     const cellWidth = cellWidthPx ?? CELL_WIDTH[zoom];
@@ -71,7 +71,7 @@ export function KptRoadmap({ config, scrollHeight = null, labelWidth = '14rem',
     const layout = useMemo(() => buildRows(config.items, config.groups, collapsedIds, config.rows), [config.items, config.groups, config.rows, collapsedIds]);
     const itemLocale = config.locale ?? config.timeline?.locale ?? locale;
     /**
-     * Paski widoczne na osi, wiersz po wierszu — mapa dla nawigacji strzałkami. Liczona ze wszystkich
+     * Paski widoczne na osi, wiersz po wierszu - mapa dla nawigacji strzałkami. Liczona ze wszystkich
      * wierszy, nie z okna wirtualizacji: strzałka w dół z ostatniego wyrenderowanego wiersza ma dokąd iść.
      */
     const navGrid = useMemo(() => layout.rows.map((row) => row.kind === 'group'
@@ -83,7 +83,7 @@ export function KptRoadmap({ config, scrollHeight = null, labelWidth = '14rem',
     /** Pasek, na którym ostatnio był fokus. */
     const [activeId, setActiveId] = useState(null);
     /**
-     * Jedyny przystanek Tab w siatce pasków (roving tabindex) — ostatnio aktywny pasek, a gdy zniknął
+     * Jedyny przystanek Tab w siatce pasków (roving tabindex) - ostatnio aktywny pasek, a gdy zniknął
      * (zwinięta grupa, inne dane), pierwszy. Bez tego roadmapa ze stu zadaniami to sto przystanków Tab.
      */
     const tabStopId = useMemo(() => {
@@ -91,13 +91,13 @@ export function KptRoadmap({ config, scrollHeight = null, labelWidth = '14rem',
             return activeId;
         return navGrid.find((row) => row.length > 0)?.[0].id ?? null;
     }, [navGrid, activeId]);
-    /** Wiersze faktycznie renderowane — całość albo okno wirtualizacji. */
+    /** Wiersze faktycznie renderowane - całość albo okno wirtualizacji. */
     const visibleRows = useMemo(() => {
         if (!virtual || viewportHeight <= 0)
             return layout.rows;
         return sliceRows(layout, scrollTop, viewportHeight).rows;
     }, [virtual, viewportHeight, layout, scrollTop]);
-    // Zakres jest wielkością wyliczaną — informujemy o nim po każdym przeliczeniu.
+    // Zakres jest wielkością wyliczaną - informujemy o nim po każdym przeliczeniu.
     useEffect(() => {
         onRangeChange?.(range);
     }, [range, onRangeChange]);
@@ -126,14 +126,14 @@ export function KptRoadmap({ config, scrollHeight = null, labelWidth = '14rem',
             console.warn('[kpt-roadmap] Pominięto elementy:', invalid.map((entry) => `${entry.id} (${entry.reason})`).join(', '));
         }
     }, [layout]);
-    /** Wysokość paska wraz z odstępem — wspólna dla widoku i geometrii zależności. */
+    /** Wysokość paska wraz z odstępem - wspólna dla widoku i geometrii zależności. */
     const laneStep = barHeight + LANE_GAP;
     /** Offset pionowy paska wewnątrz wiersza (px). */
     const barTop = useCallback((row, lane) => {
         const total = row.laneCount * barHeight + (row.laneCount - 1) * LANE_GAP;
         return Math.max(0, (row.height - total) / 2) + lane * laneStep;
     }, [barHeight, laneStep]);
-    /** Nazwa dostępna paska: „Etykieta, 3–14 mar 2026, ukończono 40%". */
+    /** Nazwa dostępna paska: "Etykieta, 3-14 mar 2026, ukończono 40%". */
     const itemAriaLabel = useCallback((item) => {
         const source = item.source;
         const dates = roadmapItemDates(item.start, item.end, itemLocale, {
@@ -163,7 +163,7 @@ export function KptRoadmap({ config, scrollHeight = null, labelWidth = '14rem',
                 top: barTop(row, item.lane),
                 height: barHeight,
                 label: source.label,
-                title: source.sublabel ? `${source.label} — ${source.sublabel}` : source.label,
+                title: source.sublabel ? `${source.label} - ${source.sublabel}` : source.label,
                 variant: source.variant ?? 'primary',
                 color: source.color,
                 progress: source.progress ?? null,
@@ -268,7 +268,7 @@ export function KptRoadmap({ config, scrollHeight = null, labelWidth = '14rem',
     };
     /**
      * Klawiatura na pasku: Enter/Spacja działają jak kliknięcie, strzałki przenoszą fokus po siatce
-     * (w poziomie po wierszu, w pionie między wierszami), Home/End na skraj wiersza, z Ctrl — roadmapy.
+     * (w poziomie po wierszu, w pionie między wierszami), Home/End na skraj wiersza, z Ctrl - roadmapy.
      */
     const handleItemKeydown = (event, item) => {
         if (event.key === 'Enter' || event.key === ' ') {
@@ -293,17 +293,17 @@ export function KptRoadmap({ config, scrollHeight = null, labelWidth = '14rem',
     };
     /**
      * Treść dymka dla kolumny etykiet. Pusta tam, gdzie dymek nie miałby czego
-     * uzupełnić — komponent pomija wtedy podpowiedź.
+     * uzupełnić - komponent pomija wtedy podpowiedź.
      */
     const labelTooltip = (row) => {
         // Wiersz grupy ma własny dymek, osadzony głębiej (na stosie etykiet).
         if (row.kind === 'group')
             return '';
-        // Tryb 'pack' mieści wiele zadań w jednym wierszu — nie ma jednej etykiety.
+        // Tryb 'pack' mieści wiele zadań w jednym wierszu - nie ma jednej etykiety.
         if (row.items.length !== 1)
             return '';
         const source = row.items[0].source;
-        return source.sublabel ? `${source.label} — ${source.sublabel}` : source.label;
+        return source.sublabel ? `${source.label} - ${source.sublabel}` : source.label;
     };
     const onScroll = (event) => {
         setScrollTop(event.currentTarget.scrollTop);
@@ -319,7 +319,7 @@ export function KptRoadmap({ config, scrollHeight = null, labelWidth = '14rem',
                             const group = row.group;
                             const first = row.items[0];
                             const sum = row.kind === 'group' ? summary(row) : null;
-                            return (_jsxs("div", { className: cn('kpt-roadmap__row', row.kind === 'group' && 'kpt-roadmap__row--group'), style: { insetBlockStart: `${row.top}px`, blockSize: `${row.height}px` }, children: [_jsx(KptTooltip, { text: labelTooltip(row), onlyWhenTruncated: true, children: _jsx("div", { className: cn('kpt-roadmap__label', row.kind === 'group' && 'kpt-roadmap__label--group'), style: { paddingInlineStart: `${0.75 + row.depth * 1}rem` }, children: group ? (_jsxs(_Fragment, { children: [_jsx(KptTooltip, { text: isCollapsed(group) ? t('roadmap.expandGroup') : t('roadmap.collapseGroup'), children: _jsx("button", { type: "button", className: "kpt-roadmap__toggle", "aria-expanded": !isCollapsed(group), "aria-label": group.label, onClick: () => toggleGroup(group), children: _jsx("span", { className: cn('kpt-roadmap__toggle-icon', !isCollapsed(group) && 'kpt-roadmap__toggle-icon--open') }) }) }), _jsx(KptTooltip, { text: group.sublabel ? `${group.label} — ${group.sublabel}` : group.label, onlyWhenTruncated: true, children: _jsxs("span", { className: "kpt-roadmap__label-stack", children: [_jsx("span", { className: "kpt-roadmap__label-text kpt-roadmap__label-text--group", children: group.label }), group.sublabel && _jsx("span", { className: "kpt-roadmap__label-sub", children: group.sublabel })] }) }), row.groupState?.itemCount ? (_jsx("span", { className: "kpt-roadmap__label-count", children: row.groupState.itemCount })) : null] })) : (first && (_jsxs(_Fragment, { children: [_jsx("span", { className: "kpt-roadmap__label-text", children: first.source.label }), row.items.length === 1 && first.source.sublabel && (_jsx("span", { className: "kpt-roadmap__label-sub", children: first.source.sublabel }))] }))) }) }), _jsx("div", { className: "kpt-roadmap__lane", children: row.kind === 'group'
+                            return (_jsxs("div", { className: cn('kpt-roadmap__row', row.kind === 'group' && 'kpt-roadmap__row--group'), style: { insetBlockStart: `${row.top}px`, blockSize: `${row.height}px` }, children: [_jsx(KptTooltip, { text: labelTooltip(row), onlyWhenTruncated: true, children: _jsx("div", { className: cn('kpt-roadmap__label', row.kind === 'group' && 'kpt-roadmap__label--group'), style: { paddingInlineStart: `${0.75 + row.depth * 1}rem` }, children: group ? (_jsxs(_Fragment, { children: [_jsx(KptTooltip, { text: isCollapsed(group) ? t('roadmap.expandGroup') : t('roadmap.collapseGroup'), children: _jsx("button", { type: "button", className: "kpt-roadmap__toggle", "aria-expanded": !isCollapsed(group), "aria-label": group.label, onClick: () => toggleGroup(group), children: _jsx("span", { className: cn('kpt-roadmap__toggle-icon', !isCollapsed(group) && 'kpt-roadmap__toggle-icon--open') }) }) }), _jsx(KptTooltip, { text: group.sublabel ? `${group.label} - ${group.sublabel}` : group.label, onlyWhenTruncated: true, children: _jsxs("span", { className: "kpt-roadmap__label-stack", children: [_jsx("span", { className: "kpt-roadmap__label-text kpt-roadmap__label-text--group", children: group.label }), group.sublabel && _jsx("span", { className: "kpt-roadmap__label-sub", children: group.sublabel })] }) }), row.groupState?.itemCount ? (_jsx("span", { className: "kpt-roadmap__label-count", children: row.groupState.itemCount })) : null] })) : (first && (_jsxs(_Fragment, { children: [_jsx("span", { className: "kpt-roadmap__label-text", children: first.source.label }), row.items.length === 1 && first.source.sublabel && (_jsx("span", { className: "kpt-roadmap__label-sub", children: first.source.sublabel }))] }))) }) }), _jsx("div", { className: "kpt-roadmap__lane", children: row.kind === 'group'
                                             ? sum && (_jsx("div", { className: "kpt-roadmap__summary", "data-variant": sum.variant, style: {
                                                     insetInlineStart: `${sum.left}%`,
                                                     inlineSize: `${sum.width}%`,

package/dist/roadmap-entry/public-api.js

@@ -1,7 +1,7 @@
 /*
- * @konce-pt/react/roadmap — oś czasu typu Gantt. Osobny subpath, bo geometria, style i dane
+ * @konce-pt/react/roadmap - oś czasu typu Gantt. Osobny subpath, bo geometria, style i dane
  * roadmapy są ciężkie względem rdzenia biblioteki i nie każda aplikacja ich potrzebuje.
  */
 export { KptRoadmap } from "../roadmap/roadmap.js";
-// Rdzeń obliczeniowy (pure TS) — przydatny do własnych rozszerzeń, SSR i testów.
+// Rdzeń obliczeniowy (pure TS) - przydatny do własnych rozszerzeń, SSR i testów.
 export { buildTimeline, buildRows, normalizeItems, packLanes, sliceRows, spanOf, rollupProgress, resolveLinks, linkGeometry, roundedPolyline, arrowHead, autoRange, resolveRange, isoWeekNumber, isoWeekYear, isoWeekday, isoWeeksInYear, startOfIsoWeek, startOfDay, addDays, addHours, addMonths, addUnits, floorToUnit, ceilToUnit, countUnits, diffDays, daysInMonth, isSameDay, toTimestamp, } from '@konce-pt/roadmap';

package/dist/scroll-top/llms.txt

@@ -1,20 +1,20 @@
 # KptScrollTop (@konce-pt/react)
 
-A "back to top" button — appears once the scroll passes `threshold` px.
+A "back to top" button - appears once the scroll passes `threshold` px.
 Import: `import { KptScrollTop } from '@konce-pt/react';`
 
 ## DOM
     <div class="kpt-scroll-top-host">
-      <button class="kpt-scroll-top is-visible" tabindex="0" aria-label="Scroll to top">…</button>
+      <button class="kpt-scroll-top is-visible" tabindex="0" aria-label="Scroll to top">...</button>
     </div>
 
 ## Props
 - `threshold`: number (px, default 300)
-- `target`: string | null — a selector for the scrolled element; the window by default
+- `target`: string | null - a selector for the scrolled element; the window by default
 - `className`, `ref` and every other `<div>` prop go to the host
 
 ## `target` is not optional in a shell
-Whenever the app scrolls a container rather than the page — an `KptAppShell` layout, for instance —
+Whenever the app scrolls a container rather than the page - an `KptAppShell` layout, for instance -
 the window never scrolls and the button would never appear. Point it at the container:
 `target=".kpt-app-shell__content"`.
 
@@ -24,7 +24,7 @@ component, and on the server it does not exist at all. The listener is removed o
 position is read once on mount, because the page may already be scrolled (arriving at an anchor).
 
 ## The hidden button stays in the DOM
-It fades in and out, so hiding it is `tabindex="-1"` plus the CSS class, not a conditional render —
+It fades in and out, so hiding it is `tabindex="-1"` plus the CSS class, not a conditional render -
 otherwise the animation would have nothing to run on.
 
 ## Examples
@@ -42,4 +42,4 @@ A real `<button>` labelled from `scrollTop.label`; while hidden it is `visibilit
 out of the tab order and the accessibility tree. It sits in the bottom-end corner
 (`inset-inline-end`), so it moves to the left in RTL. With `prefers-reduced-motion` the scroll is a
 jump instead of smooth and the button appears without a transition. Focus stays on the button after
-the jump — move it to your page heading if that matters.
+the jump - move it to your page heading if that matters.

package/dist/scroll-top/scroll-top.d.ts

@@ -7,7 +7,7 @@ export interface KptScrollTopProps extends ComponentPropsWithRef<'div'>, KptI18n
     target?: string | null;
 }
 /**
- * Przycisk „do góry" — pojawia się po przewinięciu ponad `threshold` px.
+ * Przycisk "do góry" - pojawia się po przewinięciu ponad `threshold` px.
  *
  * @example
  * <KptScrollTop threshold={300} />

package/dist/scroll-top/scroll-top.js

@@ -5,7 +5,7 @@ import { cn } from "../internal/cn.js";
 import { useKptMessages } from "../i18n/i18n-context.js";
 import { KptIcon } from "../icon/icon.js";
 /**
- * Przycisk „do góry" — pojawia się po przewinięciu ponad `threshold` px.
+ * Przycisk "do góry" - pojawia się po przewinięciu ponad `threshold` px.
  *
  * @example
  * <KptScrollTop threshold={300} />

package/dist/select/llms.txt

@@ -6,21 +6,21 @@ A select on its own panel. Variants: single, with a search box (`filter`) and mu
 ## DOM
     <span class="kpt-select-host">
       <div class="kpt-select" role="combobox" tabindex="0" aria-expanded="false">
-        <div class="kpt-select__value"><span class="kpt-select__placeholder">Choose…</span></div>
-        <span class="kpt-icon-host kpt-select__chevron">…</span>
+        <div class="kpt-select__value"><span class="kpt-select__placeholder">Choose...</span></div>
+        <span class="kpt-icon-host kpt-select__chevron">...</span>
       </div>
     </span>
     <!-- while open, in a portal on document.body: -->
-    <div class="kpt-select__panel"><ul class="kpt-select__list" role="listbox">…</ul></div>
+    <div class="kpt-select__panel"><ul class="kpt-select__list" role="listbox">...</ul></div>
 
 ## Props
-- `options`: `KptOption<T>[]` — `{ label, value, disabled? }`
-- `value` / `defaultValue` / `onValueChange` — a single `T`, or `T[]` in `multiple` mode
-- `open` / `defaultOpen` / `onOpenChange` — the panel state, so the list can be opened from outside
+- `options`: `KptOption<T>[]` - `{ label, value, disabled? }`
+- `value` / `defaultValue` / `onValueChange` - a single `T`, or `T[]` in `multiple` mode
+- `open` / `defaultOpen` / `onOpenChange` - the panel state, so the list can be opened from outside
 - `placeholder`, `multiple`, `filter`, `disabled`, `invalid`, `touched`
-- `onTouch()` — fires when the panel closes or focus leaves the closed trigger
+- `onTouch()` - fires when the panel closes or focus leaves the closed trigger
 - `aria-label` (through the rest props) names the trigger when no `<label for>` describes it
-- `locale`, `dictionary` — i18n overrides for this component only
+- `locale`, `dictionary` - i18n overrides for this component only
 - `className`, `ref` and every other `<div>` prop go to the trigger
 
 ## The panel is a portal
@@ -35,20 +35,20 @@ through `aria-activedescendant` (with `filter`, focus moves to the search field)
 ArrowUp, Enter, Space, Home and End open the list, typing letters opens it on the first match, and
 in `multiple` mode Backspace/Delete removes the last chip. Open: ArrowUp/ArrowDown move by one,
 Home/End to the ends, PageUp/PageDown by ten, skipping disabled options without wrapping; Enter (and
-Space on the trigger) picks — a single select closes and returns focus to the trigger; typing jumps
+Space on the trigger) picks - a single select closes and returns focus to the trigger; typing jumps
 to the next match, diacritics ignored; Escape and Tab close. Hovering an option makes it active, so
 the mouse and the keyboard share one highlight, and clicking it does not take focus from the trigger.
 
 ## Inside KptFormField
 There is no native field for the wrapper to read, so the select reports its filled state with
-`useKptFormFieldFilled` — the float label then floats over the chosen value.
+`useKptFormFieldFilled` - the float label then floats over the chosen value.
 
 ## i18n
 `select.search` (the search placeholder), `select.noResults` (the empty list),
 `select.removeChip` (the chip's remove button).
 
 ## Examples
-    <KptSelect options={roles} value={role} onValueChange={setRole} placeholder="Choose…" />
+    <KptSelect options={roles} value={role} onValueChange={setRole} placeholder="Choose..." />
     <KptSelect options={roles} value={role} onValueChange={setRole} filter />
     <KptSelect options={tags} value={tags} onValueChange={setTags} multiple filter />
 
@@ -56,9 +56,16 @@ There is no native field for the wrapper to read, so the select reports its fill
 `id` goes to the focusable element, not the host; without one it comes from `KptFormField` or is
 generated. A `div` with a role is not named by `label[for]`, so inside `KptFormField` it gets
 `aria-labelledby` pointing at the wrapper's label (unless `aria-label` is set), and the hint or
-error is added to `aria-describedby`. New: `id` and `required` (→ `aria-required`); the list gets
+error is added to `aria-describedby`. New: `id` and `required` (-> `aria-required`); the list gets
 the same name as the trigger.
 
+## Motion
+With `multiple`, a chip of a newly picked option pops in at its place (chips follow the order of
+`options`), a removed one - by its "x", by unpicking it in the list or by `Backspace` - fades and shrinks in
+place while the rest slide over on a spring. Several changes at once (e.g. a new value set from code) go
+without motion. Follows `enter` from `KptMotionProvider` (`spring` / `fade` / `none`); `enabled: false` and the
+system "reduce motion" setting always win.
+
 ## Tokens
 `--kpt-form-field-{bg,text,placeholder,border,border-hover,border-focus,border-error,radius}`,
 `--kpt-color-surface-raised` and `--kpt-elevation-3` for the panel, `--kpt-z-overlay` for the layer.

package/dist/select/select.d.ts

@@ -4,16 +4,16 @@ import type { KptOption } from '../shared/types.ts';
 export interface KptSelectProps<T> extends Omit<ComponentPropsWithRef<'div'>, 'children' | 'onChange' | 'defaultValue'>, KptI18nOverrides {
     options?: readonly KptOption<T>[];
     placeholder?: string;
-    /** Wybór wielokrotny — wartością jest tablica, a wybrane opcje pokazują się jako chipy. */
+    /** Wybór wielokrotny - wartością jest tablica, a wybrane opcje pokazują się jako chipy. */
     multiple?: boolean;
     /** Pole wyszukiwania nad listą. */
     filter?: boolean;
-    /** Id wyzwalacza; bez niego generowane, w `KptFormField` — z wrappera. */
+    /** Id wyzwalacza; bez niego generowane, w `KptFormField` - z wrappera. */
     id?: string;
     /** Oznacza pole jako wymagane atrybutem `aria-required`. */
     required?: boolean;
     disabled?: boolean;
-    /** Tylko do odczytu — wybór widać, panel się nie otwiera (`aria-readonly`). */
+    /** Tylko do odczytu - wybór widać, panel się nie otwiera (`aria-readonly`). */
     readOnly?: boolean;
     invalid?: boolean;
     touched?: boolean;
@@ -21,7 +21,7 @@ export interface KptSelectProps<T> extends Omit<ComponentPropsWithRef<'div'>, 'c
     value?: T | T[] | null;
     defaultValue?: T | T[] | null;
     onValueChange?: (value: T | T[] | null) => void;
-    /** Stan panelu — pozwala otworzyć listę z zewnątrz i wiedzieć, kiedy user skończył wybierać. */
+    /** Stan panelu - pozwala otworzyć listę z zewnątrz i wiedzieć, kiedy user skończył wybierać. */
     open?: boolean;
     defaultOpen?: boolean;
     onOpenChange?: (open: boolean) => void;
@@ -32,19 +32,19 @@ export interface KptSelectProps<T> extends Omit<ComponentPropsWithRef<'div'>, 'c
  * Lista wyboru (select) na własnym panelu. Warianty: pojedynczy, z wyszukiwarką (`filter`)
  * i wielokrotny (`multiple`, chipy).
  *
- * Klawiatura według wzorca WAI-ARIA „select-only combobox”: fokus zostaje na polu, a aktywna opcja
- * idzie przez `aria-activedescendant`. `↓`/`↑`/`Enter`/`Spacja` otwierają listę na wybranej opcji,
+ * Klawiatura według wzorca WAI-ARIA "select-only combobox": fokus zostaje na polu, a aktywna opcja
+ * idzie przez `aria-activedescendant`. `ArrowDown`/`ArrowUp`/`Enter`/`Spacja` otwierają listę na wybranej opcji,
  * strzałki, `Home`/`End`, `PageUp`/`PageDown` chodzą po opcjach (z pominięciem wyłączonych),
  * wpisywane litery skaczą do pasującej opcji (bez polskich znaków), `Enter` wybiera, `Escape`
  * zamyka. Z `filter` fokus przechodzi do pola wyszukiwania, które obsługuje te same klawisze.
  * W trybie `multiple` `Backspace` na zamkniętym polu usuwa ostatni wybór.
  *
  * Wewnątrz `KptFormField` zgłasza wypełnienie hookiem `useKptFormFieldFilled`, więc etykieta
- * Float Label unosi się nad wybraną wartością — natywnego pola, z którego wrapper mógłby to
+ * Float Label unosi się nad wybraną wartością - natywnego pola, z którego wrapper mógłby to
  * odczytać, tu nie ma.
  *
  * @example
- * <KptSelect options={roles} value={role} onValueChange={setRole} placeholder="Wybierz…" />
+ * <KptSelect options={roles} value={role} onValueChange={setRole} placeholder="Wybierz..." />
  * <KptSelect options={tags} multiple filter value={tags} onValueChange={setTags} />
  */
 export declare function KptSelect<T>({ options, placeholder, multiple, filter, disabled, readOnly, invalid, touched, value, defaultValue, onValueChange, open, defaultOpen, onOpenChange, onTouch, locale, dictionary, className, onBlur, id, required, 'aria-label': ariaLabel, 'aria-describedby': ariaDescribedBy, ...rest }: Readonly<KptSelectProps<T>>): import("react").JSX.Element;