@konce-pt/react 0.8.0

package/dist/panel/panel.d.ts

@@ -0,0 +1,31 @@
+import { type ComponentPropsWithRef, type ReactNode } from 'react';
+import { type KptI18nOverrides } from '../i18n/i18n-context.tsx';
+export interface KptPanelProps extends ComponentPropsWithRef<'div'>, KptI18nOverrides {
+    header?: string;
+    /** Dokłada przycisk zwijania w nagłówku. */
+    toggleable?: boolean;
+    collapsed?: boolean;
+    defaultCollapsed?: boolean;
+    onCollapsedChange?: (collapsed: boolean) => void;
+    animated?: boolean;
+    animationDuration?: number;
+    children?: ReactNode;
+}
+/**
+ * Panel z nagłówkiem i opcjonalnym zwijaniem. Akcje nagłówka wstaw przez `<KptPanel.Actions>`.
+ *
+ * Zwinięta treść zostaje w DOM, ale dostaje `inert` i `aria-hidden` — dzięki temu wysokość da się
+ * animować, a mimo to nic z jej wnętrza nie łapie fokusu ani nie trafia do czytnika ekranu.
+ *
+ * @example
+ * <KptPanel header="Ustawienia" toggleable>Treść…</KptPanel>
+ */
+export declare function KptPanel({ header, toggleable, collapsed, defaultCollapsed, onCollapsedChange, animated, animationDuration, locale, dictionary, className, style, children, ...rest }: Readonly<KptPanelProps>): import("react").JSX.Element;
+export declare namespace KptPanel {
+    var Actions: typeof KptPanelActions;
+}
+/** Akcje w nagłówku panelu, obok tytułu. */
+export declare function KptPanelActions({ className, ...rest }: Readonly<ComponentPropsWithRef<'span'>>): import("react").JSX.Element;
+export declare namespace KptPanelActions {
+    var kptPanelSlot: "actions";
+}

package/dist/panel/panel.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Children, isValidElement } from 'react';
+import { cn } from "../internal/cn.js";
+import { useControllableState } from "../internal/use-controllable-state.js";
+import { useKptMessages } from "../i18n/i18n-context.js";
+import { KptIcon } from "../icon/icon.js";
+/**
+ * Panel z nagłówkiem i opcjonalnym zwijaniem. Akcje nagłówka wstaw przez `<KptPanel.Actions>`.
+ *
+ * Zwinięta treść zostaje w DOM, ale dostaje `inert` i `aria-hidden` — dzięki temu wysokość da się
+ * animować, a mimo to nic z jej wnętrza nie łapie fokusu ani nie trafia do czytnika ekranu.
+ *
+ * @example
+ * <KptPanel header="Ustawienia" toggleable>Treść…</KptPanel>
+ */
+export function KptPanel({ header = '', toggleable = false, collapsed, defaultCollapsed = false, onCollapsedChange, animated = true, animationDuration = 500, locale, dictionary, className, style, children, ...rest }) {
+    const { t } = useKptMessages({ locale, dictionary });
+    const [isCollapsed, setCollapsed] = useControllableState({
+        value: collapsed,
+        defaultValue: defaultCollapsed,
+        onChange: onCollapsedChange,
+    });
+    const actions = [];
+    const body = [];
+    Children.forEach(children, (child) => {
+        const isActions = isValidElement(child) && child.type?.kptPanelSlot === 'actions';
+        (isActions ? actions : body).push(child);
+    });
+    return (_jsx("div", { className: cn('kpt-panel-host', className), style: { ['--kpt-anim-duration']: `${animated ? animationDuration : 0}ms`, ...style }, ...rest, children: _jsxs("div", { className: "kpt-panel", children: [_jsxs("div", { className: "kpt-panel__header", children: [_jsx("span", { className: "kpt-panel__title", children: header }), _jsx("span", { className: "kpt-panel__actions", children: actions }), toggleable ? (_jsx("button", { type: "button", className: "kpt-panel__toggle", onClick: () => setCollapsed(!isCollapsed), "aria-expanded": !isCollapsed, "aria-label": t('panel.toggle'), children: _jsx(KptIcon, { name: isCollapsed ? 'chevron-down' : 'chevron-up' }) })) : null] }), _jsx("div", { className: cn('kpt-panel__collapse', !isCollapsed && 'is-open'), inert: isCollapsed, "aria-hidden": isCollapsed, children: _jsx("div", { className: "kpt-panel__collapse-inner", children: _jsx("div", { className: "kpt-panel__body", children: body }) }) })] }) }));
+}
+/** Akcje w nagłówku panelu, obok tytułu. */
+export function KptPanelActions({ className, ...rest }) {
+    return _jsx("span", { className: className, ...rest });
+}
+KptPanelActions.kptPanelSlot = 'actions';
+KptPanel.Actions = KptPanelActions;

package/dist/password/password.d.ts

@@ -0,0 +1,28 @@
+import { type ComponentPropsWithRef } from 'react';
+import { type KptI18nOverrides } from '../i18n/i18n-context.tsx';
+export interface KptPasswordProps extends Omit<ComponentPropsWithRef<'div'>, 'onChange' | 'defaultValue'>, KptI18nOverrides {
+    value?: string;
+    defaultValue?: string;
+    onValueChange?: (value: string) => void;
+    placeholder?: string;
+    /** Id natywnego pola — pozwala związać etykietę `KptFormField`. */
+    id?: string;
+    /**
+     * Podpowiedź autouzupełniania. Rejestracja i reset hasła wymagają `new-password` — inaczej
+     * menedżer haseł podstawia stare hasło zamiast zaproponować nowe.
+     */
+    autoComplete?: string | null;
+    /** Miernik siły pod polem. */
+    feedback?: boolean;
+    disabled?: boolean;
+    invalid?: boolean;
+    touched?: boolean;
+    onTouch?: () => void;
+}
+/**
+ * Pole hasła z przełącznikiem widoczności i opcjonalnym miernikiem siły.
+ *
+ * @example
+ * <KptPassword value={password} onValueChange={setPassword} feedback autoComplete="new-password" />
+ */
+export declare function KptPassword({ value, defaultValue, onValueChange, placeholder, id, autoComplete, feedback, disabled, invalid, touched, onTouch, locale, dictionary, className, ...rest }: Readonly<KptPasswordProps>): import("react").JSX.Element;

package/dist/password/password.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { cn } from "../internal/cn.js";
+import { useControllableState } from "../internal/use-controllable-state.js";
+import { useKptId } from "../internal/use-id.js";
+import { useKptMessages } from "../i18n/i18n-context.js";
+import { useKptFormFieldContext } from "../form-field/form-field-context.js";
+import { KptIcon } from "../icon/icon.js";
+/** Cztery niezależne kryteria; każde spełnione podnosi wynik o jeden. */
+function scoreOf(password) {
+    let score = 0;
+    if (password.length >= 8)
+        score++;
+    if (/[A-Z]/.test(password) && /[a-z]/.test(password))
+        score++;
+    if (/\d/.test(password))
+        score++;
+    if (/[^A-Za-z0-9]/.test(password))
+        score++;
+    return Math.min(score, 4);
+}
+/**
+ * Pole hasła z przełącznikiem widoczności i opcjonalnym miernikiem siły.
+ *
+ * @example
+ * <KptPassword value={password} onValueChange={setPassword} feedback autoComplete="new-password" />
+ */
+export function KptPassword({ value, defaultValue = '', onValueChange, placeholder = '', id, autoComplete = 'current-password', feedback = false, disabled = false, invalid = false, touched, onTouch, locale, dictionary, className, ...rest }) {
+    const { t, messages } = useKptMessages({ locale, dictionary });
+    const field = useKptFormFieldContext();
+    const inputId = useKptId(id ?? field?.controlId, 'kpt-password');
+    const [current, setCurrent] = useControllableState({ value, defaultValue, onChange: onValueChange });
+    const [visible, setVisible] = useState(false);
+    const showInvalid = invalid && (touched ?? true);
+    const score = scoreOf(current);
+    return (_jsxs("div", { className: cn('kpt-password-host', className), ...rest, children: [_jsxs("div", { className: cn('kpt-password', disabled && 'kpt-password--disabled', showInvalid && 'kpt-password--invalid'), children: [_jsx("input", { className: "kpt-password__input", id: inputId, type: visible ? 'text' : 'password', value: current, disabled: disabled, placeholder: placeholder, autoComplete: autoComplete ?? undefined, onChange: (event) => setCurrent(event.target.value), onBlur: () => onTouch?.() }), _jsx("button", { type: "button", className: "kpt-password__toggle", disabled: disabled, onClick: () => setVisible(!visible), "aria-label": visible ? t('password.hide') : t('password.show'), children: _jsx(KptIcon, { name: visible ? 'eye-off' : 'eye' }) })] }), feedback && current ? (_jsxs("div", { className: "kpt-password__meter", "data-score": score, children: [_jsx("div", { className: "kpt-password__bars", children: [0, 1, 2, 3].map((index) => (_jsx("span", { className: cn('kpt-password__bar', index < score && 'is-on') }, index))) }), _jsx("span", { className: "kpt-password__hint", children: messages.password.strength[score] })] })) : null] }));
+}

package/dist/pick-list/pick-list.d.ts

@@ -0,0 +1,28 @@
+import { type ComponentPropsWithRef, type ReactNode } from 'react';
+import { type KptI18nOverrides } from '../i18n/i18n-context.tsx';
+export interface KptPickListProps<T> extends Omit<ComponentPropsWithRef<'div'>, 'onChange' | 'children'>, KptI18nOverrides {
+    source?: T[];
+    defaultSource?: T[];
+    onSourceChange?: (items: T[]) => void;
+    target?: T[];
+    defaultTarget?: T[];
+    onTargetChange?: (items: T[]) => void;
+    /** Nagłówek listy źródłowej; bez niego `pickList.available`. */
+    sourceHeader?: string;
+    /** Nagłówek listy docelowej; bez niego `pickList.selected`. */
+    targetHeader?: string;
+    /** Szablon elementu — odpowiednik `<ng-template let-item>` z Angulara. */
+    renderItem: (item: T, index: number) => ReactNode;
+}
+/**
+ * PickList — transfer elementów między dwiema listami. Klik zaznacza, przyciski pośrodku
+ * przenoszą zaznaczone albo wszystko.
+ *
+ * @example
+ * <KptPickList
+ *   source={available} onSourceChange={setAvailable}
+ *   target={selected} onTargetChange={setSelected}
+ *   renderItem={(item) => item.name}
+ * />
+ */
+export declare function KptPickList<T>({ source, defaultSource, onSourceChange, target, defaultTarget, onTargetChange, sourceHeader, targetHeader, renderItem, locale, dictionary, className, ...rest }: Readonly<KptPickListProps<T>>): import("react").JSX.Element;

package/dist/pick-list/pick-list.js

@@ -0,0 +1,65 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { cn } from "../internal/cn.js";
+import { useControllableState } from "../internal/use-controllable-state.js";
+import { useKptMessages } from "../i18n/i18n-context.js";
+import { KptIcon } from "../icon/icon.js";
+const EMPTY = [];
+/**
+ * PickList — transfer elementów między dwiema listami. Klik zaznacza, przyciski pośrodku
+ * przenoszą zaznaczone albo wszystko.
+ *
+ * @example
+ * <KptPickList
+ *   source={available} onSourceChange={setAvailable}
+ *   target={selected} onTargetChange={setSelected}
+ *   renderItem={(item) => item.name}
+ * />
+ */
+export function KptPickList({ source, defaultSource = EMPTY, onSourceChange, target, defaultTarget = EMPTY, onTargetChange, sourceHeader, targetHeader, renderItem, locale, dictionary, className, ...rest }) {
+    const { t } = useKptMessages({ locale, dictionary });
+    const [left, setLeft] = useControllableState({
+        value: source,
+        defaultValue: defaultSource,
+        onChange: onSourceChange,
+    });
+    const [right, setRight] = useControllableState({
+        value: target,
+        defaultValue: defaultTarget,
+        onChange: onTargetChange,
+    });
+    // Zaznaczenie trzymamy jako zbiory referencji, nie indeksów: po przeniesieniu elementu indeksy
+    // po obu stronach się przesuwają, a referencja zostaje ta sama.
+    const [selLeft, setSelLeft] = useState(new Set());
+    const [selRight, setSelRight] = useState(new Set());
+    const toggle = (side, item) => {
+        const [selection, setSelection] = side === 'source' ? [selLeft, setSelLeft] : [selRight, setSelRight];
+        const next = new Set(selection);
+        if (next.has(item))
+            next.delete(item);
+        else
+            next.add(item);
+        setSelection(next);
+    };
+    const move = (from, all) => {
+        const fromItems = from === 'source' ? left : right;
+        const toItems = from === 'source' ? right : left;
+        const setFrom = from === 'source' ? setLeft : setRight;
+        const setTo = from === 'source' ? setRight : setLeft;
+        const selection = from === 'source' ? selLeft : selRight;
+        const setSelection = from === 'source' ? setSelLeft : setSelRight;
+        const moving = all ? fromItems : fromItems.filter((item) => selection.has(item));
+        if (!moving.length)
+            return;
+        setFrom(fromItems.filter((item) => !moving.includes(item)));
+        setTo([...toItems, ...moving]);
+        setSelection(new Set());
+    };
+    const column = (side) => {
+        const items = side === 'source' ? left : right;
+        const selection = side === 'source' ? selLeft : selRight;
+        const header = side === 'source' ? (sourceHeader ?? t('pickList.available')) : (targetHeader ?? t('pickList.selected'));
+        return (_jsxs("div", { className: "kpt-pick-list__col", children: [_jsx("div", { className: "kpt-pick-list__header", children: header }), _jsx("ul", { className: "kpt-pick-list__items", children: items.map((item, index) => (_jsx("li", { className: cn('kpt-pick-list__item', selection.has(item) && 'is-selected'), onClick: () => toggle(side, item), children: renderItem(item, index) }, index))) })] }));
+    };
+    return (_jsx("div", { className: cn('kpt-pick-list-host', className), ...rest, children: _jsxs("div", { className: "kpt-pick-list", children: [column('source'), _jsxs("div", { className: "kpt-pick-list__controls", children: [_jsxs("button", { type: "button", "aria-label": t('pickList.moveAllRight'), onClick: () => move('source', true), children: [_jsx(KptIcon, { name: "chevron-right" }), _jsx(KptIcon, { name: "chevron-right" })] }), _jsx("button", { type: "button", "aria-label": t('pickList.moveRight'), onClick: () => move('source', false), children: _jsx(KptIcon, { name: "chevron-right" }) }), _jsx("button", { type: "button", "aria-label": t('pickList.moveLeft'), onClick: () => move('target', false), children: _jsx(KptIcon, { name: "chevron-left" }) }), _jsxs("button", { type: "button", "aria-label": t('pickList.moveAllLeft'), onClick: () => move('target', true), children: [_jsx(KptIcon, { name: "chevron-left" }), _jsx(KptIcon, { name: "chevron-left" })] })] }), column('target')] }) }));
+}

package/dist/popover/popover.d.ts

@@ -0,0 +1,23 @@
+import { type ComponentPropsWithRef, type ReactNode } from 'react';
+export interface KptPopoverProps extends Omit<ComponentPropsWithRef<'span'>, 'content'> {
+    /** Element otwierający dymek — renderowany w miejscu popovera. */
+    trigger: ReactNode;
+    /** Treść panelu. */
+    children?: ReactNode;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+}
+/**
+ * Popover — dowolna treść w dymku przypiętym do wyzwalacza (bogatszy niż tooltip).
+ *
+ * Port Angulara stoi na CDK Overlay; tutaj panel renderuje się w portalu do `document.body`,
+ * z tym samym zachowaniem: pozycja pod wyzwalaczem z odbiciem w górę przy braku miejsca,
+ * zamykanie kliknięciem poza panelem i klawiszem Escape.
+ *
+ * @example
+ * <KptPopover trigger={<KptButton variant="outline">Szczegóły</KptButton>}>
+ *   <div>Bogata treść popovera…</div>
+ * </KptPopover>
+ */
+export declare function KptPopover({ trigger, children, open, defaultOpen, onOpenChange, className, ...rest }: Readonly<KptPopoverProps>): import("react").JSX.Element;

package/dist/popover/popover.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useRef } from 'react';
+import { cn } from "../internal/cn.js";
+import { KptOverlay } from "../internal/overlay.js";
+import { useControllableState } from "../internal/use-controllable-state.js";
+/**
+ * Popover — dowolna treść w dymku przypiętym do wyzwalacza (bogatszy niż tooltip).
+ *
+ * Port Angulara stoi na CDK Overlay; tutaj panel renderuje się w portalu do `document.body`,
+ * z tym samym zachowaniem: pozycja pod wyzwalaczem z odbiciem w górę przy braku miejsca,
+ * zamykanie kliknięciem poza panelem i klawiszem Escape.
+ *
+ * @example
+ * <KptPopover trigger={<KptButton variant="outline">Szczegóły</KptButton>}>
+ *   <div>Bogata treść popovera…</div>
+ * </KptPopover>
+ */
+export function KptPopover({ trigger, children, open, defaultOpen = false, onOpenChange, className, ...rest }) {
+    const triggerRef = useRef(null);
+    const [isOpen, setOpen] = useControllableState({
+        value: open,
+        defaultValue: defaultOpen,
+        onChange: onOpenChange,
+    });
+    const close = useCallback(() => setOpen(false), [setOpen]);
+    return (_jsxs("span", { className: cn('kpt-popover-host', className), ...rest, children: [_jsx("span", { className: "kpt-popover__trigger", ref: triggerRef, onClick: () => setOpen(!isOpen), children: trigger }), _jsx(KptOverlay, { open: isOpen, anchor: triggerRef.current, onClose: close, offset: 6, children: _jsx("div", { className: "kpt-popover__panel", role: "dialog", children: children }) })] }));
+}

package/dist/progress/progress.d.ts

@@ -0,0 +1,19 @@
+import type { ComponentPropsWithRef } from 'react';
+export type KptProgressVariant = 'primary' | 'success' | 'danger' | 'warning' | 'info';
+export interface KptProgressProps extends Omit<ComponentPropsWithRef<'div'>, 'children'> {
+    /** 0–100 albo `null` = postęp nieokreślony. */
+    value?: number | null;
+    variant?: KptProgressVariant;
+    type?: 'linear' | 'circular';
+    /** Średnica wariantu kołowego w pikselach. */
+    diameter?: number;
+}
+/**
+ * Wskaźnik postępu — liniowy lub kołowy, określony (0–100) albo nieokreślony (`value` = null).
+ *
+ * @example
+ * <KptProgress value={60} />
+ * <KptProgress type="circular" value={75} variant="success" />
+ * <KptProgress value={null} />
+ */
+export declare function KptProgress({ value, variant, type, diameter, className, ...rest }: Readonly<KptProgressProps>): import("react").JSX.Element;

package/dist/progress/progress.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../internal/cn.js";
+/** Promień okręgu w viewBox 0 0 40 40 — obwód liczymy z niego, nie ze średnicy w pikselach. */
+const RADIUS = 16;
+const CIRCUMFERENCE = 2 * Math.PI * RADIUS;
+/**
+ * Wskaźnik postępu — liniowy lub kołowy, określony (0–100) albo nieokreślony (`value` = null).
+ *
+ * @example
+ * <KptProgress value={60} />
+ * <KptProgress type="circular" value={75} variant="success" />
+ * <KptProgress value={null} />
+ */
+export function KptProgress({ value = null, variant = 'primary', type = 'linear', diameter = 40, className, ...rest }) {
+    const indeterminate = value == null;
+    // Nieokreślony postęp pokazuje wycinek 25% obwodu, który obraca CSS — stąd stały offset.
+    const offset = indeterminate
+        ? CIRCUMFERENCE * 0.75
+        : CIRCUMFERENCE * (1 - Math.min(100, Math.max(0, value)) / 100);
+    return (_jsx("div", { className: cn('kpt-progress-host', className), ...rest, children: type === 'circular' ? (_jsxs("svg", { className: cn('kpt-progress__circular', indeterminate && 'kpt-progress--indeterminate'), "data-variant": variant, width: diameter, height: diameter, viewBox: "0 0 40 40", role: "progressbar", "aria-valuenow": value ?? undefined, children: [_jsx("circle", { className: "kpt-progress__track", cx: "20", cy: "20", r: RADIUS }), _jsx("circle", { className: "kpt-progress__bar", cx: "20", cy: "20", r: RADIUS, style: { strokeDasharray: CIRCUMFERENCE, strokeDashoffset: offset } })] })) : (_jsx("div", { className: "kpt-progress__linear", "data-variant": variant, role: "progressbar", "aria-valuenow": value ?? undefined, children: _jsx("div", { className: cn('kpt-progress__bar', indeterminate && 'kpt-progress--indeterminate'), style: { width: `${value ?? 0}%` } }) })) }));
+}

package/dist/public-api.d.ts

@@ -0,0 +1,181 @@
+export { KptAppShell, useKptAppShell, useKptShellNavToggle } from './app-shell/app-shell.tsx';
+export type { KptAppShellContextValue, KptAppShellProps, KptSidenavMode } from './app-shell/app-shell.tsx';
+export { KptToolbar, KptToolbarSpacer } from './toolbar/toolbar.tsx';
+export type { KptToolbarProps } from './toolbar/toolbar.tsx';
+export { KptSidenav, KptSidenavFooter } from './sidenav/sidenav.tsx';
+export type { KptSidenavProps } from './sidenav/sidenav.tsx';
+export { KptTabs, KptTab } from './tabs/tabs.tsx';
+export type { KptTabProps, KptTabsProps } from './tabs/tabs.tsx';
+export { KptAccordion, KptAccordionPanel } from './accordion/accordion.tsx';
+export type { KptAccordionPanelProps, KptAccordionProps } from './accordion/accordion.tsx';
+export { KptPanel, KptPanelActions } from './panel/panel.tsx';
+export type { KptPanelProps } from './panel/panel.tsx';
+export { KptStepper, KptStep, useKptStepper } from './stepper/stepper.tsx';
+export type { KptStepProps, KptStepperContextValue, KptStepperProps } from './stepper/stepper.tsx';
+export { KptFieldset } from './fieldset/fieldset.tsx';
+export type { KptFieldsetProps } from './fieldset/fieldset.tsx';
+export { KptTimeline } from './timeline/timeline.tsx';
+export type { KptTimelineItem, KptTimelineProps } from './timeline/timeline.tsx';
+export { KptAlert } from './alert/alert.tsx';
+export type { KptAlertProps } from './alert/alert.tsx';
+export { KptDivider } from './divider/divider.tsx';
+export type { KptDividerOrientation, KptDividerProps } from './divider/divider.tsx';
+export { KptEmpty } from './empty/empty.tsx';
+export type { KptEmptyProps } from './empty/empty.tsx';
+export { KptProgress } from './progress/progress.tsx';
+export type { KptProgressProps, KptProgressVariant } from './progress/progress.tsx';
+export { KptSpinner } from './spinner/spinner.tsx';
+export type { KptSpinnerProps } from './spinner/spinner.tsx';
+export { KptSkeleton } from './skeleton/skeleton.tsx';
+export type { KptSkeletonProps, KptSkeletonVariant } from './skeleton/skeleton.tsx';
+export { KptIcon } from './icon/icon.tsx';
+export type { KptIconProps } from './icon/icon.tsx';
+export { getKptIcon, hasKptIcon, registerKptIcons } from './icon/icon-registry.ts';
+export { KptAvatar } from './avatar/avatar.tsx';
+export type { KptAvatarProps, KptAvatarShape, KptAvatarSize } from './avatar/avatar.tsx';
+export { KptBadge } from './badge/badge.tsx';
+export type { KptBadgeProps, KptBadgeSize, KptBadgeVariant } from './badge/badge.tsx';
+export { KptChip } from './chip/chip.tsx';
+export type { KptChipProps, KptChipVariant } from './chip/chip.tsx';
+export { KptDialog, KptDialogFooter } from './dialog/dialog.tsx';
+export type { KptDialogProps } from './dialog/dialog.tsx';
+export { KptDrawer } from './drawer/drawer.tsx';
+export type { KptDrawerPosition, KptDrawerProps } from './drawer/drawer.tsx';
+export { KptBottomSheet } from './bottom-sheet/bottom-sheet.tsx';
+export type { KptBottomSheetProps } from './bottom-sheet/bottom-sheet.tsx';
+export { KptSplitter, KptSplitterStart, KptSplitterEnd } from './splitter/splitter.tsx';
+export type { KptSplitterOrientation, KptSplitterPaneProps, KptSplitterProps } from './splitter/splitter.tsx';
+export { KptScrollTop } from './scroll-top/scroll-top.tsx';
+export type { KptScrollTopProps } from './scroll-top/scroll-top.tsx';
+export { KptImage } from './image/image.tsx';
+export type { KptImageProps } from './image/image.tsx';
+export { KptMeterGroup } from './meter-group/meter-group.tsx';
+export type { KptMeterGroupProps, KptMeterItem } from './meter-group/meter-group.tsx';
+export { KptAvatarGroup } from './avatar-group/avatar-group.tsx';
+export type { KptAvatarGroupProps, KptAvatarItem } from './avatar-group/avatar-group.tsx';
+export { KptSpeedDial } from './speed-dial/speed-dial.tsx';
+export type { KptSpeedDialDirection, KptSpeedDialProps } from './speed-dial/speed-dial.tsx';
+export { KptCarousel } from './carousel/carousel.tsx';
+export type { KptCarouselProps } from './carousel/carousel.tsx';
+export { KptGalleria } from './galleria/galleria.tsx';
+export type { KptGalleriaItem, KptGalleriaProps } from './galleria/galleria.tsx';
+export { KptPickList } from './pick-list/pick-list.tsx';
+export type { KptPickListProps } from './pick-list/pick-list.tsx';
+export { KptDataTable } from './data-table/data-table.tsx';
+export type { KptDataTableProps } from './data-table/data-table.tsx';
+export { exportTableCsv } from './data-table/export-csv.ts';
+export type { KptCellEditContext, KptCellEditEvent, KptCellEditRenderers, KptCellRenderers, KptColumn, KptColumnEdit, KptColumnEditType, KptSortDir, KptTableLazyState, } from './data-table/data-table-types.ts';
+export type { KptColumnFilter, KptColumnFilterType, KptColumnSummary, KptSummaryFn } from '@konce-pt/table';
+export { KptDataView } from './data-view/data-view.tsx';
+export type { KptDataViewLayout, KptDataViewProps } from './data-view/data-view.tsx';
+export { KptTree } from './tree/tree.tsx';
+export type { KptTreeNode, KptTreeProps } from './tree/tree.tsx';
+export { KptOrderList } from './order-list/order-list.tsx';
+export type { KptOrderListProps } from './order-list/order-list.tsx';
+export { KptRichText } from './rich-text/rich-text.tsx';
+export type { KptRichTextProps, KptRichTool, KptRichToolbar } from './rich-text/rich-text.tsx';
+export { KptAuth } from './auth/auth.tsx';
+export type { KptAuthProps } from './auth/auth.tsx';
+export { KPT_AUTH_MIN_PASSWORD } from './auth/auth-types.ts';
+export type { KptAuthErrorKind, KptAuthLayout, KptAuthMode, KptAuthProvider, KptAuthProviderLayout, KptAuthResetValue, KptAuthSignInValue, KptAuthSignUpValue, } from './auth/auth-types.ts';
+export { KptConfirmContainer } from './confirm/confirm-container.tsx';
+export type { KptConfirmContainerProps } from './confirm/confirm-container.tsx';
+export { kptConfirm, useKptConfirmRequest } from './confirm/confirm-store.ts';
+export type { KptConfirmOptions, KptConfirmRequest } from './confirm/confirm-store.ts';
+export { KptToastContainer } from './toast/toast-container.tsx';
+export type { KptToastContainerProps } from './toast/toast-container.tsx';
+export { kptToast, useKptToasts } from './toast/toast-store.ts';
+export type { KptToast, KptToastOptions } from './toast/toast-store.ts';
+export { KptMenu } from './menu/menu.tsx';
+export { KptMenubar } from './menubar/menubar.tsx';
+export type { KptMenubarProps } from './menubar/menubar.tsx';
+export { KptMegamenu } from './megamenu/megamenu.tsx';
+export type { KptMegamenuProps } from './megamenu/megamenu.tsx';
+export { KptBreadcrumb } from './breadcrumb/breadcrumb.tsx';
+export type { KptBreadcrumbItem, KptBreadcrumbProps } from './breadcrumb/breadcrumb.tsx';
+export type { KptMenuProps } from './menu/menu.tsx';
+export type { KptMenuItem, KptMenuItemAvatar } from './menu/menu-item.ts';
+export { KptContextMenu } from './context-menu/context-menu.tsx';
+export type { KptContextMenuProps } from './context-menu/context-menu.tsx';
+export { KptTooltip } from './tooltip/tooltip.tsx';
+export type { KptTooltipPosition, KptTooltipProps } from './tooltip/tooltip.tsx';
+export { KptPopover } from './popover/popover.tsx';
+export type { KptPopoverProps } from './popover/popover.tsx';
+export { KptOverlay } from './internal/overlay.tsx';
+export type { KptOverlayProps } from './internal/overlay.tsx';
+export { KptButtonGroup } from './button-group/button-group.tsx';
+export type { KptButtonGroupProps } from './button-group/button-group.tsx';
+export { KptSelect } from './select/select.tsx';
+export type { KptSelectProps } from './select/select.tsx';
+export type { KptAlertVariant, KptOption } from './shared/types.ts';
+export { KptFormField } from './form-field/form-field.tsx';
+export type { KptFormFieldLabelType, KptFormFieldProps } from './form-field/form-field.tsx';
+export { useKptFormFieldContext, useKptFormFieldFilled } from './form-field/form-field-context.ts';
+export type { KptFormFieldContextValue } from './form-field/form-field-context.ts';
+export { KptCheckbox } from './checkbox/checkbox.tsx';
+export type { KptCheckboxProps } from './checkbox/checkbox.tsx';
+export { KptAutocomplete } from './autocomplete/autocomplete.tsx';
+export type { KptAutocompleteProps } from './autocomplete/autocomplete.tsx';
+export { KptListbox } from './listbox/listbox.tsx';
+export type { KptListboxProps } from './listbox/listbox.tsx';
+export { KptChipsInput } from './chips-input/chips-input.tsx';
+export type { KptChipsInputProps } from './chips-input/chips-input.tsx';
+export { KptInput } from './input/input.tsx';
+export { KptInputNumber } from './input-number/input-number.tsx';
+export { KptPassword } from './password/password.tsx';
+export type { KptPasswordProps } from './password/password.tsx';
+export { KptInputOtp } from './input-otp/input-otp.tsx';
+export type { KptInputOtpProps } from './input-otp/input-otp.tsx';
+export { KptInputMask } from './input-mask/input-mask.tsx';
+export type { KptInputMaskProps } from './input-mask/input-mask.tsx';
+export type { KptInputNumberProps } from './input-number/input-number.tsx';
+export { KptRadioGroup } from './radio-group/radio-group.tsx';
+export type { KptRadioGroupProps } from './radio-group/radio-group.tsx';
+export { KptSlider } from './slider/slider.tsx';
+export type { KptSliderProps, KptSliderValue } from './slider/slider.tsx';
+export type { KptInputProps, KptInputType } from './input/input.tsx';
+export { KptSwitch } from './switch/switch.tsx';
+export type { KptSwitchProps } from './switch/switch.tsx';
+export { KptDatepicker } from './datepicker/datepicker.tsx';
+export type { KptDatepickerMode, KptDatepickerProps, KptDatepickerView } from './datepicker/datepicker.tsx';
+export { KptDateRange } from './date-range/date-range.tsx';
+export type { KptDateRangeMode, KptDateRangeProps, KptDateRangeValue } from './date-range/date-range.tsx';
+export { KptClock } from './clock/clock.tsx';
+export type { KptClockProps } from './clock/clock.tsx';
+export { KptColorPicker } from './color-picker/color-picker.tsx';
+export type { KptColorPickerProps } from './color-picker/color-picker.tsx';
+export { KptFileUpload } from './file-upload/file-upload.tsx';
+export type { KptFileUploadProps } from './file-upload/file-upload.tsx';
+export { KptSwitchGroup } from './switch-group/switch-group.tsx';
+export type { KptSwitchGroupProps } from './switch-group/switch-group.tsx';
+export { KptRating } from './rating/rating.tsx';
+export type { KptRatingProps } from './rating/rating.tsx';
+export { KptKnob } from './knob/knob.tsx';
+export type { KptKnobProps } from './knob/knob.tsx';
+export { KptTextarea } from './textarea/textarea.tsx';
+export type { KptTextareaProps } from './textarea/textarea.tsx';
+export { KptPaginator } from './paginator/paginator.tsx';
+export type { KptPaginatorProps } from './paginator/paginator.tsx';
+export { KptButton } from './button/button.tsx';
+export { KptIconButton } from './icon-button/icon-button.tsx';
+export type { KptIconButtonProps } from './icon-button/icon-button.tsx';
+export { KptFab } from './fab/fab.tsx';
+export type { KptFabProps } from './fab/fab.tsx';
+export { KptSplitButton } from './split-button/split-button.tsx';
+export type { KptSplitButtonProps } from './split-button/split-button.tsx';
+export type { KptButtonProps, KptButtonSize, KptButtonVariant } from './button/button.tsx';
+export { KptCard, KptCardActions, KptCardFooter, KptCardHeader, KptCardLead, KptCardMedia, KptCardMeta, KptCardSection, KptCardSubtitle, KptCardTags, KptCardTitle, } from './card/card.tsx';
+export type { KptCardProps, KptCardVariant } from './card/card.tsx';
+export { KptI18nProvider, useKptI18n, useKptMessages } from './i18n/i18n-context.tsx';
+export type { KptI18nContextValue, KptI18nOverrides, KptI18nProviderProps } from './i18n/i18n-context.tsx';
+export { KPT_MESSAGES_EN, KPT_MESSAGES_PL } from '@konce-pt/i18n';
+export type { DeepPartial, KptLocale, KptMessages } from '@konce-pt/i18n';
+export { cn } from './internal/cn.ts';
+export type { ClassValue } from './internal/cn.ts';
+export { composeRefs } from './internal/compose-refs.ts';
+export { Slot } from './internal/slot.tsx';
+export type { SlotProps } from './internal/slot.tsx';
+export type { AsChildProps, KptHostProps } from './internal/types.ts';
+export { KPT_BREAKPOINTS, useKptBreakpointUp, useKptMediaQuery } from './internal/use-breakpoint.ts';
+export type { KptBreakpoint } from './internal/use-breakpoint.ts';
+export { useControllableState } from './internal/use-controllable-state.ts';

package/dist/public-api.js

@@ -0,0 +1,105 @@
+/*
+ * @konce-pt/react — publiczne API.
+ *
+ * Komponenty renderują te same klasy `kpt-*` i te same tokeny `--kpt-*`, co port
+ * Angulara; warstwa CSS (`@konce-pt/styles`, `@konce-pt/grid`, `@konce-pt/tokens`)
+ * jest wspólna i nie ma tu własnych stylów.
+ */
+// Komponenty — układ
+export { KptAppShell, useKptAppShell, useKptShellNavToggle } from "./app-shell/app-shell.js";
+export { KptToolbar, KptToolbarSpacer } from "./toolbar/toolbar.js";
+export { KptSidenav, KptSidenavFooter } from "./sidenav/sidenav.js";
+// Komponenty — panele
+export { KptTabs, KptTab } from "./tabs/tabs.js";
+export { KptAccordion, KptAccordionPanel } from "./accordion/accordion.js";
+export { KptPanel, KptPanelActions } from "./panel/panel.js";
+export { KptStepper, KptStep, useKptStepper } from "./stepper/stepper.js";
+export { KptFieldset } from "./fieldset/fieldset.js";
+export { KptTimeline } from "./timeline/timeline.js";
+// Komponenty — prezentacja
+export { KptAlert } from "./alert/alert.js";
+export { KptDivider } from "./divider/divider.js";
+export { KptEmpty } from "./empty/empty.js";
+export { KptProgress } from "./progress/progress.js";
+export { KptSpinner } from "./spinner/spinner.js";
+export { KptSkeleton } from "./skeleton/skeleton.js";
+export { KptIcon } from "./icon/icon.js";
+export { getKptIcon, hasKptIcon, registerKptIcons } from "./icon/icon-registry.js";
+export { KptAvatar } from "./avatar/avatar.js";
+export { KptBadge } from "./badge/badge.js";
+export { KptChip } from "./chip/chip.js";
+// Komponenty — nakładki
+export { KptDialog, KptDialogFooter } from "./dialog/dialog.js";
+export { KptDrawer } from "./drawer/drawer.js";
+export { KptBottomSheet } from "./bottom-sheet/bottom-sheet.js";
+export { KptSplitter, KptSplitterStart, KptSplitterEnd } from "./splitter/splitter.js";
+export { KptScrollTop } from "./scroll-top/scroll-top.js";
+export { KptImage } from "./image/image.js";
+export { KptMeterGroup } from "./meter-group/meter-group.js";
+export { KptAvatarGroup } from "./avatar-group/avatar-group.js";
+export { KptSpeedDial } from "./speed-dial/speed-dial.js";
+export { KptCarousel } from "./carousel/carousel.js";
+export { KptGalleria } from "./galleria/galleria.js";
+export { KptPickList } from "./pick-list/pick-list.js";
+export { KptDataTable } from "./data-table/data-table.js";
+export { exportTableCsv } from "./data-table/export-csv.js";
+export { KptDataView } from "./data-view/data-view.js";
+export { KptTree } from "./tree/tree.js";
+export { KptOrderList } from "./order-list/order-list.js";
+export { KptRichText } from "./rich-text/rich-text.js";
+export { KptAuth } from "./auth/auth.js";
+export { KPT_AUTH_MIN_PASSWORD } from "./auth/auth-types.js";
+export { KptConfirmContainer } from "./confirm/confirm-container.js";
+export { kptConfirm, useKptConfirmRequest } from "./confirm/confirm-store.js";
+export { KptToastContainer } from "./toast/toast-container.js";
+export { kptToast, useKptToasts } from "./toast/toast-store.js";
+export { KptMenu } from "./menu/menu.js";
+export { KptMenubar } from "./menubar/menubar.js";
+export { KptMegamenu } from "./megamenu/megamenu.js";
+export { KptBreadcrumb } from "./breadcrumb/breadcrumb.js";
+export { KptContextMenu } from "./context-menu/context-menu.js";
+export { KptTooltip } from "./tooltip/tooltip.js";
+export { KptPopover } from "./popover/popover.js";
+export { KptOverlay } from "./internal/overlay.js";
+// Komponenty — formularze
+export { KptButtonGroup } from "./button-group/button-group.js";
+export { KptSelect } from "./select/select.js";
+export { KptFormField } from "./form-field/form-field.js";
+export { useKptFormFieldContext, useKptFormFieldFilled } from "./form-field/form-field-context.js";
+export { KptCheckbox } from "./checkbox/checkbox.js";
+export { KptAutocomplete } from "./autocomplete/autocomplete.js";
+export { KptListbox } from "./listbox/listbox.js";
+export { KptChipsInput } from "./chips-input/chips-input.js";
+export { KptInput } from "./input/input.js";
+export { KptInputNumber } from "./input-number/input-number.js";
+export { KptPassword } from "./password/password.js";
+export { KptInputOtp } from "./input-otp/input-otp.js";
+export { KptInputMask } from "./input-mask/input-mask.js";
+export { KptRadioGroup } from "./radio-group/radio-group.js";
+export { KptSlider } from "./slider/slider.js";
+export { KptSwitch } from "./switch/switch.js";
+export { KptDatepicker } from "./datepicker/datepicker.js";
+export { KptDateRange } from "./date-range/date-range.js";
+export { KptClock } from "./clock/clock.js";
+export { KptColorPicker } from "./color-picker/color-picker.js";
+export { KptFileUpload } from "./file-upload/file-upload.js";
+export { KptSwitchGroup } from "./switch-group/switch-group.js";
+export { KptRating } from "./rating/rating.js";
+export { KptKnob } from "./knob/knob.js";
+export { KptTextarea } from "./textarea/textarea.js";
+export { KptPaginator } from "./paginator/paginator.js";
+// Komponenty
+export { KptButton } from "./button/button.js";
+export { KptIconButton } from "./icon-button/icon-button.js";
+export { KptFab } from "./fab/fab.js";
+export { KptSplitButton } from "./split-button/split-button.js";
+export { KptCard, KptCardActions, KptCardFooter, KptCardHeader, KptCardLead, KptCardMedia, KptCardMeta, KptCardSection, KptCardSubtitle, KptCardTags, KptCardTitle, } from "./card/card.js";
+// i18n
+export { KptI18nProvider, useKptI18n, useKptMessages } from "./i18n/i18n-context.js";
+export { KPT_MESSAGES_EN, KPT_MESSAGES_PL } from '@konce-pt/i18n';
+// Prymitywy pomocnicze
+export { cn } from "./internal/cn.js";
+export { composeRefs } from "./internal/compose-refs.js";
+export { Slot } from "./internal/slot.js";
+export { KPT_BREAKPOINTS, useKptBreakpointUp, useKptMediaQuery } from "./internal/use-breakpoint.js";
+export { useControllableState } from "./internal/use-controllable-state.js";