@kosmeo-ui/react 0.1.0

package/dist/components/navigation/tabButton/index.d.ts

@@ -0,0 +1,11 @@
+import { PropsWithSize, PropsWithVariant } from "../../types.js";
+import "./styles.css";
+interface TabButtonProps extends PropsWithSize, PropsWithVariant {
+    active?: boolean;
+    onClick?: () => void;
+    children: React.ReactNode;
+    disabled?: boolean;
+}
+declare const TabButton: ({ active, onClick, children, disabled, size, variant, }: TabButtonProps) => import("react").JSX.Element;
+export default TabButton;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/navigation/tabButton/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/navigation/tabButton/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AACjE,OAAO,cAAc,CAAC;AAEtB,UAAU,cAAe,SAAQ,aAAa,EAAE,gBAAgB;IAC9D,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,QAAA,MAAM,SAAS,GAAI,yDAOhB,cAAc,gCAqBhB,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/components/navigation/tabButton/index.js

@@ -0,0 +1,17 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import "./styles.css";
+const TabButton = ({ active = false, onClick, children, disabled = false, size = "md", variant = "primary", }) => {
+    const buttonClasses = [
+        "k-tab-button",
+        `k-tab-button-${size}`,
+        `k-tab-button-${variant}`,
+        active && "k-tab-button-active",
+        disabled && "k-tab-button-disabled",
+    ]
+        .filter(Boolean)
+        .join(" ");
+    return (_jsx("button", { className: buttonClasses, onClick: onClick, disabled: disabled, type: "button", children: children }));
+};
+export default TabButton;
+//# sourceMappingURL=index.js.map

package/dist/components/navigation/tabButton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/navigation/tabButton/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,cAAc,CAAC;AAStB,MAAM,SAAS,GAAG,CAAC,EACjB,MAAM,GAAG,KAAK,EACd,OAAO,EACP,QAAQ,EACR,QAAQ,GAAG,KAAK,EAChB,IAAI,GAAG,IAAI,EACX,OAAO,GAAG,SAAS,GACJ,EAAE,EAAE;IACnB,MAAM,aAAa,GAAG;QACpB,cAAc;QACd,gBAAgB,IAAI,EAAE;QACtB,gBAAgB,OAAO,EAAE;QACzB,MAAM,IAAI,qBAAqB;QAC/B,QAAQ,IAAI,uBAAuB;KACpC;SACE,MAAM,CAAC,OAAO,CAAC;SACf,IAAI,CAAC,GAAG,CAAC,CAAC;IAEb,OAAO,CACL,iBACE,SAAS,EAAE,aAAa,EACxB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAC,QAAQ,YAEZ,QAAQ,GACF,CACV,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/components/navigation/tabButton/styles.css

@@ -0,0 +1,148 @@
+.k-tab-button {
+  background: var(--background-color);
+  border: 0.0625rem solid var(--border-color);
+  border-bottom: 0.125rem solid transparent;
+  border-radius: 0.375rem 0.375rem 0 0;
+  padding: 0.5rem 1rem;
+  cursor: pointer;
+  transition: all 0.2s ease;
+  font-weight: 500;
+  position: relative;
+  outline: none;
+  margin-right: 0.25rem;
+}
+
+/* Size variations */
+.k-tab-button-sm {
+  padding: 0.375rem 0.75rem;
+  font-size: var(--text-size-sm);
+}
+
+.k-tab-button-md {
+  padding: 0.5rem 1rem;
+  font-size: var(--text-size-md);
+}
+
+.k-tab-button-lg {
+  padding: 0.625rem 1.25rem;
+  font-size: var(--text-size-lg);
+}
+
+/* Variant styles - all keep white background, only text and border colors change */
+.k-tab-button-primary {
+  color: var(--text-color);
+  background-color: var(--background-color);
+}
+
+.k-tab-button-primary:hover:not(.k-tab-button-disabled) {
+  color: var(--primary-color);
+  background-color: var(--background-color);
+}
+
+.k-tab-button-primary.k-tab-button-active {
+  color: var(--primary-color);
+  background-color: var(--background-color);
+  border-bottom-color: var(--primary-color);
+  border-color: var(--primary-color) var(--primary-color) transparent
+    var(--primary-color);
+}
+
+.k-tab-button-secondary {
+  color: var(--text-color-secondary);
+  background-color: var(--background-color);
+}
+
+.k-tab-button-secondary:hover:not(.k-tab-button-disabled) {
+  color: var(--text-color);
+  background-color: var(--background-color);
+}
+
+.k-tab-button-secondary.k-tab-button-active {
+  color: var(--text-color);
+  background-color: var(--background-color);
+  border-bottom-color: var(--secondary-color);
+  border-color: var(--secondary-color) var(--secondary-color) transparent
+    var(--secondary-color);
+}
+
+.k-tab-button-success {
+  color: var(--text-color);
+  background-color: var(--background-color);
+}
+
+.k-tab-button-success:hover:not(.k-tab-button-disabled) {
+  color: var(--success-color);
+  background-color: var(--background-color);
+}
+
+.k-tab-button-success.k-tab-button-active {
+  color: var(--success-color);
+  background-color: var(--background-color);
+  border-bottom-color: var(--success-color);
+  border-color: var(--success-color) var(--success-color) transparent
+    var(--success-color);
+}
+
+.k-tab-button-danger {
+  color: var(--text-color);
+  background-color: var(--background-color);
+}
+
+.k-tab-button-danger:hover:not(.k-tab-button-disabled) {
+  color: var(--danger-color);
+  background-color: var(--background-color);
+}
+
+.k-tab-button-danger.k-tab-button-active {
+  color: var(--danger-color);
+  background-color: var(--background-color);
+  border-bottom-color: var(--danger-color);
+  border-color: var(--danger-color) var(--danger-color) transparent
+    var(--danger-color);
+}
+
+.k-tab-button-warning {
+  color: var(--text-color);
+  background-color: var(--background-color);
+}
+
+.k-tab-button-warning:hover:not(.k-tab-button-disabled) {
+  color: var(--warning-color);
+  background-color: var(--background-color);
+}
+
+.k-tab-button-warning.k-tab-button-active {
+  color: var(--warning-color);
+  background-color: var(--background-color);
+  border-bottom-color: var(--warning-color);
+  border-color: var(--warning-color) var(--warning-color) transparent
+    var(--warning-color);
+}
+
+.k-tab-button-light {
+  color: var(--text-color-secondary);
+  background-color: var(--background-color);
+}
+
+.k-tab-button-light:hover:not(.k-tab-button-disabled) {
+  color: var(--text-color);
+  background-color: var(--background-color);
+}
+
+.k-tab-button-light.k-tab-button-active {
+  color: var(--text-color);
+  background-color: var(--background-color);
+  border-bottom-color: var(--border-color);
+  border-color: var(--border-color) var(--border-color) transparent
+    var(--border-color);
+}
+
+/* Disabled state */
+.k-tab-button-disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+.k-tab-button-disabled:hover {
+  background-color: transparent;
+}

package/dist/components/navigation/tabs/index.d.ts

@@ -0,0 +1,18 @@
+import { ReactNode } from "react";
+import "./styles.css";
+export interface TabItem {
+    key: string;
+    label: ReactNode;
+    content?: ReactNode;
+    disabled?: boolean;
+}
+export interface TabsProps {
+    tabs: TabItem[];
+    active: string;
+    onChange: (key: string) => void;
+    /** Render strip only — caller controls content placement. Defaults to false (component renders both). */
+    stripOnly?: boolean;
+}
+declare const Tabs: ({ tabs, active, onChange, stripOnly }: TabsProps) => import("react").JSX.Element;
+export default Tabs;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/navigation/tabs/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/navigation/tabs/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,cAAc,CAAC;AAEtB,MAAM,WAAW,OAAO;IACtB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,SAAS,CAAC;IACjB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,OAAO,EAAE,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,yGAAyG;IACzG,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,QAAA,MAAM,IAAI,GAAI,uCAAuC,SAAS,gCA0B7D,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/dist/components/navigation/tabs/index.js

@@ -0,0 +1,9 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import "./styles.css";
+const Tabs = ({ tabs, active, onChange, stripOnly }) => {
+    const activeTab = tabs.find((t) => t.key === active);
+    return (_jsxs("div", { className: "k-tabs", children: [_jsx("div", { className: "k-tabs-strip", role: "tablist", children: tabs.map((t) => (_jsx("button", { type: "button", role: "tab", "aria-selected": t.key === active, disabled: t.disabled, className: `k-tabs-button${t.key === active ? " k-tabs-button-active" : ""}`, onClick: () => onChange(t.key), children: t.label }, t.key))) }), !stripOnly && activeTab?.content && (_jsx("div", { className: "k-tabs-content", role: "tabpanel", children: activeTab.content }))] }));
+};
+export default Tabs;
+//# sourceMappingURL=index.js.map

package/dist/components/navigation/tabs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/navigation/tabs/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,cAAc,CAAC;AAiBtB,MAAM,IAAI,GAAG,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAa,EAAE,EAAE;IAChE,MAAM,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,GAAG,KAAK,MAAM,CAAC,CAAC;IACrD,OAAO,CACL,eAAK,SAAS,EAAC,QAAQ,aACrB,cAAK,SAAS,EAAC,cAAc,EAAC,IAAI,EAAC,SAAS,YACzC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CACf,iBAEE,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,KAAK,mBACK,CAAC,CAAC,GAAG,KAAK,MAAM,EAC/B,QAAQ,EAAE,CAAC,CAAC,QAAQ,EACpB,SAAS,EAAE,gBAAgB,CAAC,CAAC,GAAG,KAAK,MAAM,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,EAAE,EAAE,EAC5E,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,YAE7B,CAAC,CAAC,KAAK,IARH,CAAC,CAAC,GAAG,CASH,CACV,CAAC,GACE,EACL,CAAC,SAAS,IAAI,SAAS,EAAE,OAAO,IAAI,CACnC,cAAK,SAAS,EAAC,gBAAgB,EAAC,IAAI,EAAC,UAAU,YAC5C,SAAS,CAAC,OAAO,GACd,CACP,IACG,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/dist/components/navigation/tabs/styles.css

@@ -0,0 +1,46 @@
+.k-tabs {
+  display: flex;
+  flex-direction: column;
+}
+
+.k-tabs-strip {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.25rem;
+  border-bottom: 0.0625rem solid var(--border-color);
+  margin-bottom: 1rem;
+}
+
+.k-tabs-button {
+  appearance: none;
+  background: transparent;
+  border: none;
+  border-bottom: 0.1875rem solid transparent;
+  color: var(--text-color);
+  cursor: pointer;
+  font-size: 0.9375rem;
+  font-weight: 500;
+  padding: 0.625rem 0.9375rem;
+  margin-bottom: -0.0625rem;
+  transition:
+    color 0.15s ease,
+    border-color 0.15s ease;
+}
+
+.k-tabs-button:hover:not(:disabled) {
+  color: var(--primary-color);
+}
+
+.k-tabs-button-active {
+  color: var(--primary-color);
+  border-bottom-color: var(--primary-color);
+}
+
+.k-tabs-button:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+.k-tabs-content {
+  flex: 1;
+}

package/dist/components/overlays/confirmationModal/index.d.ts

@@ -0,0 +1,13 @@
+export interface ConfirmationModalProps {
+    show: boolean;
+    handleHide: () => void;
+    handleConfirm: () => void;
+    title: string;
+    body: string;
+    confirmButtonText: string;
+    cancelButtonText?: string;
+    isLoading?: boolean;
+}
+declare const ConfirmationModal: (props: ConfirmationModalProps) => import("react").JSX.Element;
+export default ConfirmationModal;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/overlays/confirmationModal/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/overlays/confirmationModal/index.tsx"],"names":[],"mappings":"AAKA,MAAM,WAAW,sBAAsB;IACrC,IAAI,EAAE,OAAO,CAAC;IACd,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,iBAAiB,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,QAAA,MAAM,iBAAiB,GAAI,OAAO,sBAAsB,gCA6BvD,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/dist/components/overlays/confirmationModal/index.js

@@ -0,0 +1,12 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import Button from "../../buttons/button/index.js";
+import Modal from "../modal/index.js";
+const ConfirmationModal = (props) => {
+    return (_jsx(Modal, { show: props.show, title: props.title, onClose: props.handleHide, footerButtons: [
+            _jsx(Button, { variant: "secondary", onClick: props.handleHide, disabled: props.isLoading, children: props.cancelButtonText || "Cancel" }, "cancel"),
+            _jsx(Button, { variant: "danger", onClick: props.handleConfirm, isLoading: props.isLoading, disabled: props.isLoading, children: props.confirmButtonText }, "confirm"),
+        ], children: props.body }));
+};
+export default ConfirmationModal;
+//# sourceMappingURL=index.js.map

package/dist/components/overlays/confirmationModal/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/overlays/confirmationModal/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,MAAM,MAAM,+BAA+B,CAAC;AACnD,OAAO,KAAK,MAAM,mBAAmB,CAAC;AAatC,MAAM,iBAAiB,GAAG,CAAC,KAA6B,EAAE,EAAE;IAC1D,OAAO,CACL,KAAC,KAAK,IACJ,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,OAAO,EAAE,KAAK,CAAC,UAAU,EACzB,aAAa,EAAE;YACb,KAAC,MAAM,IAEL,OAAO,EAAC,WAAW,EACnB,OAAO,EAAE,KAAK,CAAC,UAAU,EACzB,QAAQ,EAAE,KAAK,CAAC,SAAS,YAExB,KAAK,CAAC,gBAAgB,IAAI,QAAQ,IAL/B,QAAQ,CAML;YACT,KAAC,MAAM,IAEL,OAAO,EAAC,QAAQ,EAChB,OAAO,EAAE,KAAK,CAAC,aAAa,EAC5B,SAAS,EAAE,KAAK,CAAC,SAAS,EAC1B,QAAQ,EAAE,KAAK,CAAC,SAAS,YAExB,KAAK,CAAC,iBAAiB,IANpB,SAAS,CAON;SACV,YAEA,KAAK,CAAC,IAAI,GACL,CACT,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/dist/components/overlays/modal/index.d.ts

@@ -0,0 +1,22 @@
+import React, { PropsWithChildren } from "react";
+import "./styles.css";
+export type ModalSize = "sm" | "md" | "lg" | "full";
+interface ModalProps extends PropsWithChildren {
+    /** A function that is called when the modal is closed */
+    onClose: () => void;
+    /** **_Optional_** title to appear at the top of the Modal */
+    title?: React.ReactNode;
+    /** **_Optional_** flag for whether or not to show the Modal */
+    show?: boolean;
+    /** Options buttons to add to the bottom of the modal */
+    footerButtons?: React.ReactNode[];
+    /**
+     * **_Optional_** size variant. `full` renders edge-to-edge at ~90% of the
+     * viewport — use for dense content (tables, search results, side-by-side
+     * editors) that would feel cramped at `lg`.
+     */
+    size?: ModalSize;
+}
+declare const Modal: (props: ModalProps) => React.JSX.Element | null;
+export default Modal;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/overlays/modal/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/overlays/modal/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAE,iBAAiB,EAA+B,MAAM,OAAO,CAAC;AAI9E,OAAO,cAAc,CAAC;AAEtB,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AAEpD,UAAU,UAAW,SAAQ,iBAAiB;IAC5C,yDAAyD;IACzD,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,6DAA6D;IAC7D,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,+DAA+D;IAC/D,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,wDAAwD;IACxD,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAC;IAClC;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED,QAAA,MAAM,KAAK,GAAI,OAAO,UAAU,6BA2D/B,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/dist/components/overlays/modal/index.js

@@ -0,0 +1,43 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useEffect, useRef, useState } from "react";
+import useFocusTrap from "../../../hooks/useFocusTrap.js";
+import Button from "../../buttons/button/index.js";
+import Portal from "../portal/index.js";
+import "./styles.css";
+const Modal = (props) => {
+    const { size = "md" } = props;
+    const [shouldRender, setShouldRender] = useState(props.show);
+    const [isAnimating, setIsAnimating] = useState(false);
+    const contentRef = useRef(null);
+    useEffect(() => {
+        if (props.show) {
+            setIsAnimating(false);
+            setShouldRender(true);
+        }
+        else {
+            setIsAnimating(true);
+            const timer = setTimeout(() => {
+                setIsAnimating(false);
+                setShouldRender(false);
+            }, 200);
+            return () => clearTimeout(timer);
+        }
+    }, [props.show]);
+    useEffect(() => {
+        if (!props.show)
+            return;
+        const handler = (e) => {
+            if (e.key === "Escape")
+                props.onClose();
+        };
+        document.addEventListener("keydown", handler);
+        return () => document.removeEventListener("keydown", handler);
+    }, [props.show, props.onClose]);
+    useFocusTrap(contentRef, !!props.show && !!shouldRender);
+    if (!shouldRender)
+        return null;
+    return (_jsx(Portal, { children: _jsx("div", { className: `k-modal-overlay ${isAnimating ? "closing" : ""}`, children: _jsxs("div", { ref: contentRef, className: `k-modal-content ${isAnimating ? "closing" : ""} ${size}`, role: "dialog", "aria-modal": "true", children: [props.title && _jsx("div", { className: "k-modal-header", children: props.title }), _jsx("div", { className: "k-modal-body", children: props.children }), _jsx("div", { className: "k-modal-footer", children: props.footerButtons ? (props.footerButtons.map((button, index) => (_jsx(React.Fragment, { children: button }, index)))) : (_jsx(Button, { onClick: props.onClose, variant: "secondary", children: "Close" })) })] }) }) }));
+};
+export default Modal;
+//# sourceMappingURL=index.js.map

package/dist/components/overlays/modal/index.js.map

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

package/dist/components/overlays/modal/styles.css

@@ -0,0 +1,137 @@
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+@keyframes fadeOut {
+  from {
+    opacity: 1;
+  }
+  to {
+    opacity: 0;
+  }
+}
+
+@keyframes scaleIn {
+  from {
+    transform: scale(0.95);
+  }
+  to {
+    transform: scale(1);
+  }
+}
+
+@keyframes scaleOut {
+  from {
+    transform: scale(1);
+  }
+  to {
+    transform: scale(0.95);
+  }
+}
+
+.k-modal-overlay {
+  position: fixed;
+  inset: 0;
+  background-color: var(--background-color-overlay);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 9999;
+  padding: 1rem;
+  opacity: 1;
+  pointer-events: auto;
+  animation: fadeIn 0.2s ease-out forwards;
+}
+
+.k-modal-content {
+  background-color: var(--background-color-light);
+  border-radius: 0.5rem;
+  padding: 1rem;
+  box-shadow:
+    0 1.25rem 1.5625rem -0.3125rem var(--shadow-color),
+    0 0.5rem 0.625rem -0.375rem var(--shadow-color);
+  max-width: 40rem;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+  opacity: 1;
+  transform: scale(1);
+  pointer-events: auto;
+  animation: scaleIn 0.2s ease-out forwards;
+  max-height: 80vh;
+  overflow: hidden;
+}
+
+.k-modal-content.sm {
+  max-width: 20rem;
+}
+
+.k-modal-content.md {
+  max-width: 40rem;
+}
+
+.k-modal-content.lg {
+  max-width: 60rem;
+}
+
+.k-modal-content.full {
+  max-width: 90vw;
+  max-height: 90vh;
+  width: 90vw;
+  height: 90vh;
+}
+
+.k-modal-overlay.closing {
+  animation: fadeOut 0.2s ease-in forwards;
+  pointer-events: none;
+}
+
+.k-modal-content.closing {
+  animation: scaleOut 0.2s ease-in forwards;
+  pointer-events: none;
+}
+
+.k-modal-header {
+  padding-bottom: 0.5rem;
+  border-bottom: 0.0625rem solid var(--border-color);
+  font-size: var(--text-size-xl);
+  font-weight: 700;
+  color: var(--text-color);
+}
+
+.k-modal-body {
+  display: flex;
+  flex-direction: column;
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+  color: var(--text-color-secondary);
+  overflow-y: auto;
+  min-height: 0;
+  flex: 1;
+}
+
+.k-modal-message {
+  font-size: var(--text-size-lg);
+  font-weight: 600;
+  color: var(--text-color);
+  margin-bottom: 1rem;
+}
+
+.k-modal-footer {
+  padding-top: 0.5rem;
+  border-top: 0.0625rem solid var(--border-color);
+  display: flex;
+  justify-content: end;
+  gap: 0.5rem;
+  flex-wrap: wrap;
+}
+
+.k-modal-close-button {
+  margin-top: 1rem;
+}

package/dist/components/overlays/portal/index.d.ts

@@ -0,0 +1,10 @@
+import { ReactNode } from "react";
+interface PortalProps {
+    children: ReactNode;
+    /** Target node. Defaults to `document.body`. */
+    target?: Element | DocumentFragment;
+}
+/** Thin wrapper around `createPortal` — single seam for overlay-root swaps. */
+declare const Portal: ({ children, target }: PortalProps) => import("react").ReactPortal | null;
+export default Portal;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/overlays/portal/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/overlays/portal/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,UAAU,WAAW;IACnB,QAAQ,EAAE,SAAS,CAAC;IACpB,gDAAgD;IAChD,MAAM,CAAC,EAAE,OAAO,GAAG,gBAAgB,CAAC;CACrC;AAED,+EAA+E;AAC/E,QAAA,MAAM,MAAM,GAAI,sBAAsB,WAAW,uCAGhD,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/dist/components/overlays/portal/index.js

@@ -0,0 +1,10 @@
+"use client";
+import { createPortal } from "react-dom";
+/** Thin wrapper around `createPortal` — single seam for overlay-root swaps. */
+const Portal = ({ children, target }) => {
+    if (typeof document === "undefined")
+        return null;
+    return createPortal(children, target ?? document.body);
+};
+export default Portal;
+//# sourceMappingURL=index.js.map

package/dist/components/overlays/portal/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/overlays/portal/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AASzC,+EAA+E;AAC/E,MAAM,MAAM,GAAG,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAe,EAAE,EAAE;IACnD,IAAI,OAAO,QAAQ,KAAK,WAAW;QAAE,OAAO,IAAI,CAAC;IACjD,OAAO,YAAY,CAAC,QAAQ,EAAE,MAAM,IAAI,QAAQ,CAAC,IAAI,CAAC,CAAC;AACzD,CAAC,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/dist/components/types.d.ts

@@ -0,0 +1,34 @@
+export type Variant = "primary" | "secondary" | "light" | "danger" | "warning" | "success" | "custom" | "link";
+export type Size = "sm" | "md" | "lg";
+export type FlexAlign = "start" | "center" | "end" | "baseline" | "stretch";
+export type FlexJustify = "start" | "center" | "end" | "between" | "around";
+export interface PropsWithVariant {
+    /**
+     * **_Optional_** variant for styling the component. Accepts one of the following:
+     *
+     * - `primary`
+     * - `secondary`
+     * - `light`
+     * - `warning`
+     * - `danger`
+     * - `success`
+     * - `custom` (badge only; requires `color` prop)
+     * - `link` (button only; styled as inline text link)
+     *
+     * Defaults to `primary`
+     */
+    variant?: Variant;
+}
+export interface PropsWithSize {
+    /**
+     * **_Optional_** size for the component. Accepts one of the following:
+     *
+     * - `sm`
+     * - `md`
+     * - `lg`
+     *
+     * Defaults to `md`
+     */
+    size?: Size;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/components/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/components/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,OAAO,GACf,SAAS,GACT,WAAW,GACX,OAAO,GACP,QAAQ,GACR,SAAS,GACT,SAAS,GACT,QAAQ,GACR,MAAM,CAAC;AAEX,MAAM,MAAM,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEtC,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,UAAU,GAAG,SAAS,CAAC;AAC5E,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,GAAG,QAAQ,CAAC;AAE5E,MAAM,WAAW,gBAAgB;IAC/B;;;;;;;;;;;;;OAaG;IAEH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,aAAa;IAC5B;;;;;;;;OAQG;IACH,IAAI,CAAC,EAAE,IAAI,CAAC;CACb"}

package/dist/components/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/components/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/components/types.ts"],"names":[],"mappings":""}

package/dist/hooks/index.d.ts

@@ -0,0 +1,11 @@
+export { default as useInfiniteArchivableCursor } from "./useInfiniteArchivableCursor.js";
+export { default as useInfinite, type UseInfiniteReturn, } from "./useInfinite.js";
+export { default as useInfiniteCursor } from "./useInfiniteCursor.js";
+export { default as useScrollIntoView } from "./useScrollIntoView.js";
+export { default as useDebouncedValue } from "./useDebouncedValue.js";
+export { default as useOutsideClick } from "./useOutsideClick.js";
+export { default as useListKeyboard } from "./useListKeyboard.js";
+export { default as useLocalStorage } from "./useLocalStorage.js";
+export { default as useFocusTrap } from "./useFocusTrap.js";
+export { default as useFloatingPosition, type FloatingPosition, type FloatingSide, } from "./useFloatingPosition.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/hooks/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,2BAA2B,EAAE,MAAM,kCAAkC,CAAC;AAC1F,OAAO,EACL,OAAO,IAAI,WAAW,EACtB,KAAK,iBAAiB,GACvB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EACL,OAAO,IAAI,mBAAmB,EAC9B,KAAK,gBAAgB,EACrB,KAAK,YAAY,GAClB,MAAM,0BAA0B,CAAC"}

package/dist/hooks/index.js

@@ -0,0 +1,11 @@
+export { default as useInfiniteArchivableCursor } from "./useInfiniteArchivableCursor.js";
+export { default as useInfinite, } from "./useInfinite.js";
+export { default as useInfiniteCursor } from "./useInfiniteCursor.js";
+export { default as useScrollIntoView } from "./useScrollIntoView.js";
+export { default as useDebouncedValue } from "./useDebouncedValue.js";
+export { default as useOutsideClick } from "./useOutsideClick.js";
+export { default as useListKeyboard } from "./useListKeyboard.js";
+export { default as useLocalStorage } from "./useLocalStorage.js";
+export { default as useFocusTrap } from "./useFocusTrap.js";
+export { default as useFloatingPosition, } from "./useFloatingPosition.js";
+//# sourceMappingURL=index.js.map

package/dist/hooks/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,2BAA2B,EAAE,MAAM,kCAAkC,CAAC;AAC1F,OAAO,EACL,OAAO,IAAI,WAAW,GAEvB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EACL,OAAO,IAAI,mBAAmB,GAG/B,MAAM,0BAA0B,CAAC"}

package/dist/hooks/useDebouncedValue.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Returns `value` after it has remained unchanged for `delay` milliseconds.
+ * Resets the timer on every change.
+ */
+declare const useDebouncedValue: <T>(value: T, delay: number) => T;
+export default useDebouncedValue;
+//# sourceMappingURL=useDebouncedValue.d.ts.map

package/dist/hooks/useDebouncedValue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDebouncedValue.d.ts","sourceRoot":"","sources":["../../src/hooks/useDebouncedValue.ts"],"names":[],"mappings":"AAIA;;;GAGG;AACH,QAAA,MAAM,iBAAiB,GAAI,CAAC,EAAE,OAAO,CAAC,EAAE,OAAO,MAAM,KAAG,CASvD,CAAC;AAEF,eAAe,iBAAiB,CAAC"}