@phpsoftbox/react-softbox 0.1.0

package/dist/components/Notifier/Notifier.module.css

@@ -0,0 +1,182 @@
+.container {
+  position: fixed;
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-3);
+  z-index: 48;
+}
+
+.topRight {
+  top: var(--spacing-6);
+  right: var(--spacing-6);
+}
+
+.topLeft {
+  top: var(--spacing-6);
+  left: var(--spacing-6);
+}
+
+.bottomRight {
+  bottom: var(--spacing-6);
+  right: var(--spacing-6);
+}
+
+.bottomLeft {
+  bottom: var(--spacing-6);
+  left: var(--spacing-6);
+}
+
+.toast {
+  min-width: 260px;
+  max-width: 360px;
+  display: flex;
+  gap: var(--spacing-3);
+  align-items: flex-start;
+  padding: var(--spacing-4);
+  border-radius: var(--radius-md);
+  border: 1px solid transparent;
+  background: var(--surface-panel);
+  color: var(--color-text);
+  box-shadow: var(--shadow-soft);
+  animation: toast-in 0.18s ease;
+  position: relative;
+  overflow: hidden;
+}
+
+.toastClosing {
+  animation: toast-out 0.22s ease forwards;
+  pointer-events: none;
+}
+
+.content {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  flex: 1;
+  min-width: 0;
+}
+
+.title {
+  font-weight: 600;
+  font-size: 14px;
+}
+
+.message {
+  font-size: 13px;
+  color: var(--color-muted);
+}
+
+.actions {
+  display: flex;
+  gap: 8px;
+}
+
+.close {
+  border: none;
+  background: transparent;
+  color: var(--color-muted);
+  cursor: pointer;
+  font-size: 18px;
+  line-height: 1;
+}
+
+.timer {
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  height: 3px;
+  background: var(--toast-accent, rgba(20, 201, 214, 0.9));
+  transform-origin: left;
+  animation: toast-timer var(--toast-duration, 0ms) linear forwards;
+  pointer-events: none;
+}
+
+.toast[data-paused="true"] .timer {
+  animation-play-state: paused;
+}
+
+.default {
+  border-color: rgba(30, 51, 85, 0.6);
+  --toast-accent: rgba(30, 51, 85, 0.8);
+}
+
+.primary {
+  border-color: rgba(20, 201, 214, 0.55);
+  --toast-accent: rgba(20, 201, 214, 0.9);
+}
+
+.info {
+  border-color: rgba(30, 99, 233, 0.4);
+  --toast-accent: rgba(30, 99, 233, 0.9);
+}
+
+.success {
+  border-color: rgba(79, 230, 163, 0.5);
+  --toast-accent: rgba(79, 230, 163, 0.9);
+}
+
+.warning {
+  border-color: rgba(246, 200, 106, 0.5);
+  --toast-accent: rgba(246, 200, 106, 0.9);
+}
+
+.danger {
+  border-color: rgba(255, 107, 107, 0.5);
+  --toast-accent: rgba(255, 107, 107, 0.9);
+}
+
+@keyframes toast-in {
+  from {
+    opacity: 0;
+    transform: translateY(-6px);
+  }
+
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+@keyframes toast-out {
+  from {
+    opacity: 1;
+    transform: translateY(0);
+  }
+
+  to {
+    opacity: 0;
+    transform: translateY(-6px);
+  }
+}
+
+@keyframes toast-timer {
+  from {
+    transform: scaleX(1);
+  }
+
+  to {
+    transform: scaleX(0);
+  }
+}
+
+@media (max-width: 720px) {
+  .container {
+    left: var(--spacing-4);
+    right: var(--spacing-4);
+  }
+
+  .toast {
+    max-width: 100%;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .toast {
+    animation: none;
+  }
+
+  .timer {
+    animation: none;
+  }
+}

package/dist/components/Pagination/Pagination.d.ts

@@ -0,0 +1,28 @@
+export type PaginationLinks = {
+    first?: string | null;
+    last?: string | null;
+    prev?: string | null;
+    next?: string | null;
+};
+export type PaginationMeta = {
+    current_page: number;
+    last_page: number;
+    per_page: number;
+    total: number;
+    from?: number | null;
+    to?: number | null;
+    path?: string;
+};
+type Props = {
+    meta: PaginationMeta;
+    links?: PaginationLinks;
+    pageParam?: string;
+    window?: number;
+    showEdges?: boolean;
+    showInfo?: boolean;
+    buildUrl?: (page: number) => string;
+    onNavigate?: (page: number, url: string) => void;
+    className?: string;
+};
+export default function Pagination({ meta, links, pageParam, window, showEdges, showInfo, buildUrl, onNavigate, className, }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Pagination/Pagination.js

@@ -0,0 +1,70 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styles from './Pagination.module.css';
+const sanitizeBase = (url, pageParam) => {
+    const cleaned = url.replace(new RegExp(`([?&])${pageParam}=[^&]*`, 'g'), '$1');
+    return cleaned.replace(/[?&]$/, '');
+};
+const buildDefaultUrl = (page, pageParam, base) => {
+    if (!base) {
+        return '';
+    }
+    const normalized = sanitizeBase(base, pageParam);
+    const separator = normalized.includes('?') ? '&' : '?';
+    return `${normalized}${separator}${pageParam}=${page}`;
+};
+const clamp = (value, min, max) => Math.min(Math.max(value, min), max);
+export default function Pagination({ meta, links, pageParam = 'page', window = 2, showEdges = true, showInfo = true, buildUrl, onNavigate, className, }) {
+    const current = clamp(meta.current_page, 1, meta.last_page);
+    const last = Math.max(meta.last_page, 1);
+    const base = meta.path ?? links?.first ?? '';
+    const resolveUrl = (page) => {
+        if (buildUrl) {
+            return buildUrl(page);
+        }
+        return buildDefaultUrl(page, pageParam, base);
+    };
+    const pages = [];
+    const start = Math.max(1, current - window);
+    const end = Math.min(last, current + window);
+    if (showEdges && start > 1) {
+        pages.push({ type: 'page', page: 1, active: current === 1 });
+        if (start > 2) {
+            pages.push({ type: 'ellipsis', key: 'start' });
+        }
+    }
+    for (let page = start; page <= end; page += 1) {
+        pages.push({ type: 'page', page, active: page === current });
+    }
+    if (showEdges && end < last) {
+        if (end < last - 1) {
+            pages.push({ type: 'ellipsis', key: 'end' });
+        }
+        pages.push({ type: 'page', page: last, active: current === last });
+    }
+    const prevPage = current > 1 ? current - 1 : null;
+    const nextPage = current < last ? current + 1 : null;
+    const prevUrl = links?.prev ?? (prevPage ? resolveUrl(prevPage) : '');
+    const nextUrl = links?.next ?? (nextPage ? resolveUrl(nextPage) : '');
+    const firstUrl = links?.first ?? resolveUrl(1);
+    const lastUrl = links?.last ?? resolveUrl(last);
+    const handleNavigate = (event, page, url) => {
+        if (!page || !url) {
+            event.preventDefault();
+            return;
+        }
+        if (onNavigate) {
+            event.preventDefault();
+            onNavigate(page, url);
+        }
+    };
+    const from = meta.from ?? (current - 1) * meta.per_page + 1;
+    const to = meta.to ?? Math.min(current * meta.per_page, meta.total);
+    return (_jsxs("nav", { className: [styles.pagination, className].filter(Boolean).join(' '), "aria-label": "Pagination", children: [showInfo ? (_jsx("div", { className: styles.info, children: meta.total === 0 ? 'Нет записей' : `${from}–${to} из ${meta.total}` })) : null, _jsxs("div", { className: styles.controls, children: [showEdges ? (_jsx("a", { href: firstUrl, className: [styles.control, current === 1 ? styles.disabled : null].filter(Boolean).join(' '), "aria-disabled": current === 1, onClick: (event) => handleNavigate(event, 1, firstUrl), children: "\u00AB" })) : null, _jsx("a", { href: prevUrl, className: [styles.control, !prevPage ? styles.disabled : null].filter(Boolean).join(' '), "aria-disabled": !prevPage, onClick: (event) => handleNavigate(event, prevPage, prevUrl), children: "\u2039" }), _jsx("div", { className: styles.pages, children: pages.map((item) => {
+                            if (item.type === 'ellipsis') {
+                                return (_jsx("span", { className: styles.ellipsis, children: "\u2026" }, item.key));
+                            }
+                            const url = resolveUrl(item.page);
+                            return (_jsx("a", { href: url, className: [styles.page, item.active ? styles.active : null].filter(Boolean).join(' '), "aria-current": item.active ? 'page' : undefined, onClick: (event) => handleNavigate(event, item.page, url), children: item.page }, item.page));
+                        }) }), _jsx("a", { href: nextUrl, className: [styles.control, !nextPage ? styles.disabled : null].filter(Boolean).join(' '), "aria-disabled": !nextPage, onClick: (event) => handleNavigate(event, nextPage, nextUrl), children: "\u203A" }), showEdges ? (_jsx("a", { href: lastUrl, className: [styles.control, current === last ? styles.disabled : null].filter(Boolean).join(' '), "aria-disabled": current === last, onClick: (event) => handleNavigate(event, last, lastUrl), children: "\u00BB" })) : null] })] }));
+}
+//# sourceMappingURL=Pagination.js.map

package/dist/components/Pagination/Pagination.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.js","sourceRoot":"","sources":["../../../src/components/Pagination/Pagination.tsx"],"names":[],"mappings":"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"}

package/dist/components/Pagination/Pagination.module.css

@@ -0,0 +1,93 @@
+.pagination {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--spacing-4);
+  flex-wrap: wrap;
+}
+
+.info {
+  font-size: 13px;
+  color: var(--color-muted);
+}
+
+.controls {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-2);
+  flex-wrap: wrap;
+}
+
+.pages {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  flex-wrap: wrap;
+}
+
+.page,
+.control {
+  min-width: 36px;
+  height: 36px;
+  padding: 0 10px;
+  border-radius: 10px;
+  border: 1px solid rgba(30, 99, 233, 0.25);
+  background: var(--surface-control);
+  color: var(--color-text);
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  font-weight: 600;
+  font-size: 13px;
+  text-decoration: none;
+  transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
+}
+
+.page:hover,
+.control:hover {
+  border-color: rgba(79, 230, 163, 0.4);
+  background: rgba(79, 230, 163, 0.08);
+}
+
+.page:focus-visible,
+.control:focus-visible {
+  outline: none;
+  border-color: rgba(20, 201, 214, 0.8);
+  box-shadow: 0 0 0 3px rgba(20, 201, 214, 0.2);
+}
+
+.active {
+  border-color: rgba(20, 201, 214, 0.6);
+  color: var(--color-teal);
+  background: rgba(20, 201, 214, 0.18);
+}
+
+.disabled {
+  opacity: 0.45;
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.ellipsis {
+  padding: 0 6px;
+  color: var(--color-muted);
+}
+
+@media (max-width: 720px) {
+  .pagination {
+    align-items: flex-start;
+    flex-direction: column;
+  }
+
+  .controls {
+    width: 100%;
+    justify-content: flex-start;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .page,
+  .control {
+    transition: none;
+  }
+}

package/dist/components/Progress/Progress.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import type { UiVariant } from '../../types';
+type ProgressVariant = UiVariant;
+type ProgressSize = 'sm' | 'md' | 'lg';
+type Props = {
+    value?: number;
+    max?: number;
+    label?: React.ReactNode;
+    showValue?: boolean;
+    variant?: ProgressVariant;
+    size?: ProgressSize;
+    indeterminate?: boolean;
+    className?: string;
+};
+export default function Progress({ value, max, label, showValue, variant, size, indeterminate, className, }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Progress/Progress.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styles from './Progress.module.css';
+const clamp = (value, min, max) => Math.min(Math.max(value, min), max);
+const variantMap = {
+    default: styles.default,
+    primary: styles.primary,
+    info: styles.info,
+    success: styles.success,
+    warning: styles.warning,
+    danger: styles.danger,
+};
+const sizeMap = {
+    sm: styles.sm,
+    md: styles.md,
+    lg: styles.lg,
+};
+export default function Progress({ value = 0, max = 100, label, showValue = false, variant = 'default', size = 'md', indeterminate = false, className, }) {
+    const safeMax = max > 0 ? max : 100;
+    const normalized = clamp(value, 0, safeMax);
+    const percent = Math.round((normalized / safeMax) * 100);
+    const wrapperClasses = [
+        styles.progress,
+        variantMap[variant],
+        sizeMap[size],
+        indeterminate ? styles.indeterminate : null,
+        className,
+    ]
+        .filter(Boolean)
+        .join(' ');
+    return (_jsxs("div", { className: wrapperClasses, children: [label ? _jsx("div", { className: styles.label, children: label }) : null, _jsx("div", { className: styles.track, role: "progressbar", "aria-valuemin": indeterminate ? undefined : 0, "aria-valuemax": indeterminate ? undefined : safeMax, "aria-valuenow": indeterminate ? undefined : normalized, "aria-busy": indeterminate ? 'true' : undefined, children: _jsx("div", { className: styles.bar, style: indeterminate ? undefined : { width: `${percent}%` } }) }), showValue ? _jsx("div", { className: styles.value, children: indeterminate ? '…' : `${percent}%` }) : null] }));
+}
+//# sourceMappingURL=Progress.js.map

package/dist/components/Progress/Progress.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Progress.js","sourceRoot":"","sources":["../../../src/components/Progress/Progress.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,MAAM,uBAAuB,CAAC;AAiB3C,MAAM,KAAK,GAAG,CAAC,KAAa,EAAE,GAAW,EAAE,GAAW,EAAE,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC;AAE/F,MAAM,UAAU,GAAoC;IAClD,OAAO,EAAE,MAAM,CAAC,OAAO;IACvB,OAAO,EAAE,MAAM,CAAC,OAAO;IACvB,IAAI,EAAE,MAAM,CAAC,IAAI;IACjB,OAAO,EAAE,MAAM,CAAC,OAAO;IACvB,OAAO,EAAE,MAAM,CAAC,OAAO;IACvB,MAAM,EAAE,MAAM,CAAC,MAAM;CACtB,CAAC;AAEF,MAAM,OAAO,GAAiC;IAC5C,EAAE,EAAE,MAAM,CAAC,EAAE;IACb,EAAE,EAAE,MAAM,CAAC,EAAE;IACb,EAAE,EAAE,MAAM,CAAC,EAAE;CACd,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAC/B,KAAK,GAAG,CAAC,EACT,GAAG,GAAG,GAAG,EACT,KAAK,EACL,SAAS,GAAG,KAAK,EACjB,OAAO,GAAG,SAAS,EACnB,IAAI,GAAG,IAAI,EACX,aAAa,GAAG,KAAK,EACrB,SAAS,GACH;IACN,MAAM,OAAO,GAAG,GAAG,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC;IACpC,MAAM,UAAU,GAAG,KAAK,CAAC,KAAK,EAAE,CAAC,EAAE,OAAO,CAAC,CAAC;IAC5C,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,UAAU,GAAG,OAAO,CAAC,GAAG,GAAG,CAAC,CAAC;IAEzD,MAAM,cAAc,GAAG;QACrB,MAAM,CAAC,QAAQ;QACf,UAAU,CAAC,OAAO,CAAC;QACnB,OAAO,CAAC,IAAI,CAAC;QACb,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI;QAC3C,SAAS;KACV;SACE,MAAM,CAAC,OAAO,CAAC;SACf,IAAI,CAAC,GAAG,CAAC,CAAC;IAEb,OAAO,CACL,eAAK,SAAS,EAAE,cAAc,aAC3B,KAAK,CAAC,CAAC,CAAC,cAAK,SAAS,EAAE,MAAM,CAAC,KAAK,YAAG,KAAK,GAAO,CAAC,CAAC,CAAC,IAAI,EAC3D,cACE,SAAS,EAAE,MAAM,CAAC,KAAK,EACvB,IAAI,EAAC,aAAa,mBACH,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,mBAC7B,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,mBACnC,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,eAC1C,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,YAE7C,cAAK,SAAS,EAAE,MAAM,CAAC,GAAG,EAAE,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,GAAG,OAAO,GAAG,EAAE,GAAI,GACvF,EACL,SAAS,CAAC,CAAC,CAAC,cAAK,SAAS,EAAE,MAAM,CAAC,KAAK,YAAG,aAAa,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,OAAO,GAAG,GAAO,CAAC,CAAC,CAAC,IAAI,IACzF,CACP,CAAC;AACJ,CAAC"}

package/dist/components/Progress/Progress.module.css

@@ -0,0 +1,110 @@
+.progress {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.label {
+  font-size: 13px;
+  color: var(--color-muted);
+}
+
+.track {
+  width: 100%;
+  background: var(--surface-control);
+  border: 1px solid rgba(30, 99, 233, 0.2);
+  border-radius: 999px;
+  overflow: hidden;
+  position: relative;
+}
+
+.bar {
+  height: 100%;
+  width: 0;
+  background: linear-gradient(90deg, rgba(79, 230, 163, 0.9), rgba(20, 201, 214, 0.9));
+  transition: width 0.2s ease;
+}
+
+.value {
+  font-size: 12px;
+  color: var(--color-muted);
+  text-align: right;
+}
+
+.sm .track {
+  height: 6px;
+}
+
+.md .track {
+  height: 10px;
+}
+
+.lg .track {
+  height: 14px;
+}
+
+.default .bar {
+  background: linear-gradient(90deg, rgba(79, 230, 163, 0.9), rgba(20, 201, 214, 0.9));
+}
+
+.primary .bar {
+  background: linear-gradient(90deg, rgba(30, 99, 233, 0.9), rgba(20, 201, 214, 0.9));
+}
+
+.info .bar {
+  background: linear-gradient(90deg, rgba(20, 201, 214, 0.9), rgba(79, 230, 163, 0.9));
+}
+
+.success .bar {
+  background: linear-gradient(90deg, rgba(79, 230, 163, 0.9), rgba(20, 201, 214, 0.9));
+}
+
+.warning .bar {
+  background: linear-gradient(90deg, rgba(255, 214, 90, 0.9), rgba(255, 176, 59, 0.9));
+}
+
+.danger .bar {
+  background: linear-gradient(90deg, rgba(255, 94, 126, 0.9), rgba(255, 120, 106, 0.9));
+}
+
+.indeterminate .bar {
+  width: 100%;
+  position: absolute;
+  left: 0;
+  animation: progress-sweep 1.6s linear infinite;
+  clip-path: inset(0 100% 0 0);
+  will-change: clip-path;
+}
+
+@keyframes progress-sweep {
+  0% {
+    clip-path: inset(0 100% 0 0);
+  }
+
+  25% {
+    clip-path: inset(0 50% 0 0);
+  }
+
+  50% {
+    clip-path: inset(0 0 0 0);
+  }
+
+  75% {
+    clip-path: inset(0 0 0 50%);
+  }
+
+  100% {
+    clip-path: inset(0 0 0 100%);
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .bar {
+    transition: none;
+  }
+
+  .indeterminate .bar {
+    animation: none;
+    clip-path: inset(0 0 0 0);
+  }
+}

package/dist/components/Tabs/Tabs.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+export type TabItem = {
+    id: string;
+    label: React.ReactNode;
+    content: React.ReactNode;
+    disabled?: boolean;
+    badge?: React.ReactNode;
+};
+type Props = {
+    items: TabItem[];
+    activeId?: string;
+    defaultActiveId?: string;
+    orientation?: 'horizontal' | 'vertical';
+    className?: string;
+    listClassName?: string;
+    panelClassName?: string;
+    onChange?: (id: string) => void;
+};
+export default function Tabs({ items, activeId, defaultActiveId, orientation, className, listClassName, panelClassName, onChange, }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Tabs/Tabs.js

@@ -0,0 +1,115 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import styles from './Tabs.module.css';
+const getFirstEnabled = (items) => items.find((item) => !item.disabled)?.id;
+export default function Tabs({ items, activeId, defaultActiveId, orientation = 'horizontal', className, listClassName, panelClassName, onChange, }) {
+    const isControlled = activeId !== undefined;
+    const baseId = React.useId();
+    const listRef = React.useRef(null);
+    const fallbackId = React.useMemo(() => getFirstEnabled(items), [items]);
+    const [internalId, setInternalId] = React.useState(defaultActiveId ?? fallbackId);
+    React.useEffect(() => {
+        if (isControlled) {
+            return;
+        }
+        const isValid = internalId && items.some((item) => item.id === internalId && !item.disabled);
+        if (!isValid) {
+            setInternalId(defaultActiveId ?? fallbackId);
+        }
+    }, [items, internalId, defaultActiveId, fallbackId, isControlled]);
+    const currentId = React.useMemo(() => {
+        if (isControlled) {
+            const valid = activeId && items.some((item) => item.id === activeId && !item.disabled);
+            return valid ? activeId : fallbackId;
+        }
+        return internalId ?? fallbackId;
+    }, [activeId, fallbackId, internalId, isControlled, items]);
+    const handleSelect = (id, disabled) => {
+        if (disabled) {
+            return;
+        }
+        if (!isControlled) {
+            setInternalId(id);
+        }
+        onChange?.(id);
+    };
+    const handleKeyDown = (event) => {
+        if (!listRef.current) {
+            return;
+        }
+        const focusable = Array.from(listRef.current.querySelectorAll('[role="tab"]')).filter((el) => {
+            if (el.getAttribute('aria-disabled') === 'true') {
+                return false;
+            }
+            if (el instanceof HTMLButtonElement && el.disabled) {
+                return false;
+            }
+            return true;
+        });
+        if (focusable.length === 0) {
+            return;
+        }
+        const enabledIds = focusable.map((el) => el.getAttribute('data-tab-id')).filter(Boolean);
+        const activeElement = document.activeElement;
+        const focusedIndex = activeElement ? focusable.indexOf(activeElement) : -1;
+        const resolvedIndex = focusedIndex >= 0 ? focusedIndex : enabledIds.indexOf(currentId ?? '');
+        const currentIndex = resolvedIndex >= 0 ? resolvedIndex : 0;
+        const moveTo = (nextIndex) => {
+            const tab = focusable[nextIndex];
+            tab?.focus();
+            const id = tab?.getAttribute('data-tab-id');
+            if (id) {
+                handleSelect(id);
+            }
+        };
+        const lastIndex = focusable.length - 1;
+        const isVertical = orientation === 'vertical';
+        switch (event.key) {
+            case 'ArrowRight':
+                if (!isVertical) {
+                    event.preventDefault();
+                    moveTo(currentIndex >= lastIndex ? 0 : currentIndex + 1);
+                }
+                break;
+            case 'ArrowLeft':
+                if (!isVertical) {
+                    event.preventDefault();
+                    moveTo(currentIndex <= 0 ? lastIndex : currentIndex - 1);
+                }
+                break;
+            case 'ArrowDown':
+                if (isVertical) {
+                    event.preventDefault();
+                    moveTo(currentIndex >= lastIndex ? 0 : currentIndex + 1);
+                }
+                break;
+            case 'ArrowUp':
+                if (isVertical) {
+                    event.preventDefault();
+                    moveTo(currentIndex <= 0 ? lastIndex : currentIndex - 1);
+                }
+                break;
+            case 'Home':
+                event.preventDefault();
+                moveTo(0);
+                break;
+            case 'End':
+                event.preventDefault();
+                moveTo(lastIndex);
+                break;
+            default:
+                break;
+        }
+    };
+    const classes = [styles.tabs, styles[orientation], className].filter(Boolean).join(' ');
+    const listClasses = [styles.list, listClassName].filter(Boolean).join(' ');
+    const panelClasses = [styles.panel, panelClassName].filter(Boolean).join(' ');
+    const activeItem = items.find((item) => item.id === currentId && !item.disabled);
+    return (_jsxs("div", { className: classes, children: [_jsx("div", { className: listClasses, role: "tablist", "aria-orientation": orientation, onKeyDown: handleKeyDown, ref: listRef, children: items.map((item) => {
+                    const selected = item.id === currentId && !item.disabled;
+                    const tabId = `${baseId}-tab-${item.id}`;
+                    const panelId = `${baseId}-panel-${item.id}`;
+                    return (_jsxs("button", { id: tabId, type: "button", role: "tab", className: [styles.tab, selected ? styles.active : null].filter(Boolean).join(' '), "aria-selected": selected, "aria-controls": panelId, "aria-disabled": item.disabled ? 'true' : undefined, tabIndex: selected ? 0 : -1, "data-tab-id": item.id, onClick: () => handleSelect(item.id, item.disabled), disabled: item.disabled, children: [_jsx("span", { className: styles.tabLabel, children: item.label }), item.badge ? _jsx("span", { className: styles.tabBadge, children: item.badge }) : null] }, item.id));
+                }) }), _jsx("div", { className: panelClasses, children: activeItem ? (_jsx("div", { id: `${baseId}-panel-${activeItem.id}`, role: "tabpanel", "aria-labelledby": `${baseId}-tab-${activeItem.id}`, children: activeItem.content })) : (_jsx("div", { className: styles.empty, children: "\u041D\u0435\u0442 \u0434\u043E\u0441\u0442\u0443\u043F\u043D\u044B\u0445 \u0432\u043A\u043B\u0430\u0434\u043E\u043A" })) })] }));
+}
+//# sourceMappingURL=Tabs.js.map