@steez-ui/ui 0.1.0

package/dist/components/LoadingProgressBar.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styles from "./LoadingProgressBar.module.css";
+export const LOADING_PROGRESS_SEGMENT_COUNT = 20;
+const BAR_INDEXES = Array.from({ length: LOADING_PROGRESS_SEGMENT_COUNT }, (_, index) => index);
+export function LoadingProgressBar({ progress, className, valueLabel, }) {
+    const clampedProgress = Math.max(0, Math.min(100, progress));
+    const filledBars = Math.round((clampedProgress / 100) * LOADING_PROGRESS_SEGMENT_COUNT);
+    return (_jsxs("div", { className: className ? `${styles.root} ${className}` : styles.root, children: [_jsx("div", { className: styles.barGroup, children: BAR_INDEXES.map((index) => {
+                    const isFilled = index < filledBars;
+                    return (_jsx("div", { className: `${styles.bar} ${isFilled ? styles.barFilled : ""}`.trim(), style: { ["--bar-delay"]: `${index * 20}ms` } }, index));
+                }) }), _jsx("div", { className: styles.value, children: valueLabel ?? `${Math.round(clampedProgress)}%` })] }));
+}
+//# sourceMappingURL=LoadingProgressBar.js.map

package/dist/components/LoadingProgressBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoadingProgressBar.js","sourceRoot":"","sources":["../../src/components/LoadingProgressBar.tsx"],"names":[],"mappings":";AAEA,OAAO,MAAM,MAAM,iCAAiC,CAAC;AAErD,MAAM,CAAC,MAAM,8BAA8B,GAAG,EAAE,CAAC;AAEjD,MAAM,WAAW,GAAG,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,8BAA8B,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,CAAC;AAQhG,MAAM,UAAU,kBAAkB,CAAC,EACjC,QAAQ,EACR,SAAS,EACT,UAAU,GACc;IACxB,MAAM,eAAe,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,QAAQ,CAAC,CAAC,CAAC;IAC7D,MAAM,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,eAAe,GAAG,GAAG,CAAC,GAAG,8BAA8B,CAAC,CAAC;IAExF,OAAO,CACL,eAAK,SAAS,EAAE,SAAS,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC,IAAI,IAAI,SAAS,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,aACrE,cAAK,SAAS,EAAE,MAAM,CAAC,QAAQ,YAC5B,WAAW,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE;oBACzB,MAAM,QAAQ,GAAG,KAAK,GAAG,UAAU,CAAC;oBACpC,OAAO,CACL,cAEE,SAAS,EAAE,GAAG,MAAM,CAAC,GAAG,IAAI,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,EAAE,EACrE,KAAK,EAAE,EAAE,CAAC,aAAuB,CAAC,EAAE,GAAG,KAAK,GAAG,EAAE,IAAI,EAAE,IAFlD,KAAK,CAGV,CACH,CAAC;gBACJ,CAAC,CAAC,GACE,EACN,cAAK,SAAS,EAAE,MAAM,CAAC,KAAK,YAAG,UAAU,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,eAAe,CAAC,GAAG,GAAO,IACjF,CACP,CAAC;AACJ,CAAC"}

package/dist/components/LoadingProgressBar.module.css

@@ -0,0 +1,42 @@
+.root {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+}
+
+.barGroup {
+  display: flex;
+  width: 100%;
+  max-width: 650px;
+  flex-wrap: wrap;
+  justify-content: center;
+  gap: 3px;
+}
+
+.bar {
+  width: clamp(10px, 2.5vw, 28px);
+  height: clamp(10px, 2.5vw, 28px);
+  box-sizing: border-box;
+  flex-shrink: 0;
+  border: none;
+  border-radius: 4px;
+  background: rgba(203, 203, 204, 0.15);
+  transform: skewX(-15deg);
+  transition: all 0.1s ease-out;
+  transition-delay: var(--bar-delay, 0ms);
+}
+
+.barFilled {
+  background: currentColor;
+}
+
+.value {
+  width: 4ch;
+  margin-left: 16px;
+  text-align: right;
+  font-family: var(--font-mono);
+  font-size: clamp(18px, 5vw, 32px);
+  font-weight: 900;
+  letter-spacing: 2px;
+}
+

package/dist/components/PageHeader.d.ts

@@ -0,0 +1,17 @@
+import { ReactNode } from "react";
+import type { SteezIconName } from "@steez-ui/icons";
+export interface PageHeaderProps {
+    title: string;
+    description?: string;
+    icon?: SteezIconName;
+    extra?: ReactNode;
+    className?: string;
+    brand?: ReactNode;
+    onBrandClick?: () => void;
+    onBack?: () => void;
+    onSettings?: () => void;
+    onViewerToggle?: () => void;
+    viewerVisible?: boolean;
+}
+export declare function PageHeader({ title, description, icon, extra, className, brand, onBrandClick, onBack, onSettings, onViewerToggle, viewerVisible, }: PageHeaderProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=PageHeader.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"PageHeader.d.ts","sourceRoot":"","sources":["../../src/components/PageHeader.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGzC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAIrD,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,WAAW,EACX,IAAI,EACJ,KAAK,EACL,SAAc,EACd,KAAK,EACL,YAAY,EACZ,MAAM,EACN,UAAU,EACV,cAAc,EACd,aAAa,GACd,EAAE,eAAe,2CAgDjB"}

package/dist/components/PageHeader.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { EyeIcon, Icon, SlidersIcon } from "@steez-ui/icons";
+import styles from "./PageHeader.module.css";
+export function PageHeader({ title, description, icon, extra, className = "", brand, onBrandClick, onBack, onSettings, onViewerToggle, viewerVisible, }) {
+    return (_jsx("div", { className: `${styles.header} ${className}`.trim(), children: _jsxs("div", { className: styles.headerRow, children: [_jsxs("div", { className: styles.brandCluster, children: [brand || onBrandClick ? (_jsx("button", { type: "button", className: styles.brandButton, onClick: onBrandClick, children: _jsx("span", { className: styles.brandVisual, children: brand ?? title.slice(0, 1) }) })) : null, _jsxs("div", { className: styles.headerContent, children: [_jsxs("h2", { children: [icon ? (_jsx("span", { className: styles.titleIcon, children: _jsx(Icon, { icon: icon, width: 18, height: 18 }) })) : null, title] }), description ? _jsx("p", { children: description }) : null] })] }), _jsxs("div", { className: styles.headerExtra, children: [extra, onBack ? (_jsx("button", { type: "button", className: styles.iconButton, onClick: onBack, "aria-label": "Go back", children: _jsx(Icon, { icon: "chevronLeft", width: 18, height: 18 }) })) : null, onSettings ? (_jsx("button", { type: "button", className: styles.iconButton, onClick: onSettings, "aria-label": "Open settings", children: _jsx(SlidersIcon, { width: 18, height: 18 }) })) : null, onViewerToggle ? (_jsx("button", { type: "button", className: styles.iconButton, onClick: onViewerToggle, "aria-label": viewerVisible ? "Hide viewer" : "Show viewer", children: _jsx(EyeIcon, { width: 18, height: 18 }) })) : null] })] }) }));
+}
+//# sourceMappingURL=PageHeader.js.map

package/dist/components/PageHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageHeader.js","sourceRoot":"","sources":["../../src/components/PageHeader.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAG7D,OAAO,MAAM,MAAM,yBAAyB,CAAC;AAgB7C,MAAM,UAAU,UAAU,CAAC,EACzB,KAAK,EACL,WAAW,EACX,IAAI,EACJ,KAAK,EACL,SAAS,GAAG,EAAE,EACd,KAAK,EACL,YAAY,EACZ,MAAM,EACN,UAAU,EACV,cAAc,EACd,aAAa,GACG;IAChB,OAAO,CACL,cAAK,SAAS,EAAE,GAAG,MAAM,CAAC,MAAM,IAAI,SAAS,EAAE,CAAC,IAAI,EAAE,YACpD,eAAK,SAAS,EAAE,MAAM,CAAC,SAAS,aAC9B,eAAK,SAAS,EAAE,MAAM,CAAC,YAAY,aAChC,KAAK,IAAI,YAAY,CAAC,CAAC,CAAC,CACvB,iBAAQ,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAE,MAAM,CAAC,WAAW,EAAE,OAAO,EAAE,YAAY,YACxE,eAAM,SAAS,EAAE,MAAM,CAAC,WAAW,YAAG,KAAK,IAAI,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,GAAQ,GACjE,CACV,CAAC,CAAC,CAAC,IAAI,EACR,eAAK,SAAS,EAAE,MAAM,CAAC,aAAa,aAClC,yBACG,IAAI,CAAC,CAAC,CAAC,CACN,eAAM,SAAS,EAAE,MAAM,CAAC,SAAS,YAC/B,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,GAAI,GACtC,CACR,CAAC,CAAC,CAAC,IAAI,EACP,KAAK,IACH,EACJ,WAAW,CAAC,CAAC,CAAC,sBAAI,WAAW,GAAK,CAAC,CAAC,CAAC,IAAI,IACtC,IACF,EACN,eAAK,SAAS,EAAE,MAAM,CAAC,WAAW,aAC/B,KAAK,EACL,MAAM,CAAC,CAAC,CAAC,CACR,iBAAQ,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAE,MAAM,CAAC,UAAU,EAAE,OAAO,EAAE,MAAM,gBAAa,SAAS,YACvF,KAAC,IAAI,IAAC,IAAI,EAAC,aAAa,EAAC,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,GAAI,GAC3C,CACV,CAAC,CAAC,CAAC,IAAI,EACP,UAAU,CAAC,CAAC,CAAC,CACZ,iBAAQ,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAE,MAAM,CAAC,UAAU,EAAE,OAAO,EAAE,UAAU,gBAAa,eAAe,YACjG,KAAC,WAAW,IAAC,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,GAAI,GAC/B,CACV,CAAC,CAAC,CAAC,IAAI,EACP,cAAc,CAAC,CAAC,CAAC,CAChB,iBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,MAAM,CAAC,UAAU,EAC5B,OAAO,EAAE,cAAc,gBACX,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,aAAa,YAEzD,KAAC,OAAO,IAAC,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,GAAI,GAC3B,CACV,CAAC,CAAC,CAAC,IAAI,IACJ,IACF,GACF,CACP,CAAC;AACJ,CAAC"}

package/dist/components/PageHeader.module.css

@@ -0,0 +1,118 @@
+.header {
+  padding: 16px 24px;
+  background: var(--bg-secondary);
+}
+
+.headerRow {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
+.brandCluster {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
+.brandButton {
+  border: none;
+  background: transparent;
+  padding: 0;
+  margin: 0;
+  cursor: pointer;
+  display: inline-flex;
+  align-items: center;
+}
+
+.brandButton:focus-visible {
+  outline: 2px solid var(--color-border-hover);
+  outline-offset: 2px;
+  border-radius: 6px;
+}
+
+.brandVisual {
+  height: 48px;
+  width: 48px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border: 1px solid var(--color-border-default);
+  border-radius: 6px;
+  color: var(--text-primary);
+  background: color-mix(in srgb, var(--bg-primary) 90%, transparent);
+}
+
+.headerContent {
+  line-height: normal;
+}
+
+.headerContent h2 {
+  margin: 0;
+  font-size: 32px;
+  font-weight: 400;
+  font-family: var(--font-display);
+  letter-spacing: 0.03em;
+  color: var(--color-text-primary);
+}
+
+.titleIcon {
+  display: inline-flex;
+  margin-right: 8px;
+  vertical-align: middle;
+}
+
+.headerContent p {
+  margin: 0;
+  font-size: 14px;
+  color: var(--color-text-secondary);
+}
+
+.headerExtra {
+  margin-left: auto;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.iconButton {
+  border: none;
+  background: transparent;
+  padding: 8px;
+  margin: 0;
+  cursor: pointer;
+  display: inline-flex;
+  align-items: center;
+  color: var(--color-text-secondary);
+  transition: color var(--transition-fast);
+}
+
+.iconButton:hover {
+  color: var(--color-text-primary);
+}
+
+.iconButton:focus-visible {
+  outline: 2px solid var(--color-border-hover);
+  outline-offset: 2px;
+  border-radius: 4px;
+}
+
+@media (max-width: 767px) {
+  .header {
+    padding: 12px 16px;
+  }
+
+  .brandVisual {
+    height: 32px;
+    width: 32px;
+  }
+
+  .headerContent h2 {
+    font-size: 22px;
+  }
+
+  .headerContent p {
+    display: none;
+  }
+}
+

package/dist/components/PageTemplate.d.ts

@@ -0,0 +1,20 @@
+import React from "react";
+import { type PageHeaderProps } from "./PageHeader";
+interface SubTab {
+    id: string;
+    label: string;
+}
+export interface PageTemplateProps extends Pick<PageHeaderProps, "title" | "description" | "icon" | "onBack" | "onSettings" | "brand" | "onBrandClick" | "onViewerToggle" | "viewerVisible"> {
+    actions?: React.ReactNode;
+    extra?: React.ReactNode;
+    className?: string;
+    subTabs?: SubTab[];
+    activeSubTab?: string;
+    onSubTabChange?: (tabId: string) => void;
+    children?: React.ReactNode;
+    loading?: boolean;
+    showTitle?: boolean;
+}
+export declare function PageTemplate({ title, actions, extra, description, icon, subTabs, activeSubTab, onSubTabChange, onBack, onSettings, brand, onBrandClick, onViewerToggle, viewerVisible, children, loading, showTitle, className, }: PageTemplateProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=PageTemplate.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"PageTemplate.d.ts","sourceRoot":"","sources":["../../src/components/PageTemplate.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAGhE,UAAU,MAAM;IACd,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,iBACf,SAAQ,IAAI,CACV,eAAe,EACb,OAAO,GACP,aAAa,GACb,MAAM,GACN,QAAQ,GACR,YAAY,GACZ,OAAO,GACP,cAAc,GACd,gBAAgB,GAChB,eAAe,CAClB;IACD,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,OAAO,EACP,KAAK,EACL,WAAW,EACX,IAAI,EACJ,OAAO,EACP,YAAY,EACZ,cAAc,EACd,MAAM,EACN,UAAU,EACV,KAAK,EACL,YAAY,EACZ,cAAc,EACd,aAAa,EACb,QAAQ,EACR,OAAO,EACP,SAAgB,EAChB,SAAc,GACf,EAAE,iBAAiB,2CA4CnB"}

package/dist/components/PageTemplate.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { PageHeader } from "./PageHeader";
+import styles from "./PageTemplate.module.css";
+export function PageTemplate({ title, actions, extra, description, icon, subTabs, activeSubTab, onSubTabChange, onBack, onSettings, brand, onBrandClick, onViewerToggle, viewerVisible, children, loading, showTitle = true, className = "", }) {
+    const headerExtra = extra ?? actions;
+    return (_jsxs("div", { className: `${styles.root} ${className}`.trim(), children: [showTitle ? (_jsx("div", { className: styles.header, children: _jsx(PageHeader, { title: title, description: description, icon: icon, extra: headerExtra, onBack: onBack, onSettings: onSettings, brand: brand, onBrandClick: onBrandClick, onViewerToggle: onViewerToggle, viewerVisible: viewerVisible }) })) : null, subTabs?.length ? (_jsx("div", { className: styles.subTabs, role: "tablist", "aria-label": `${title} sections`, children: subTabs.map((tab) => (_jsx("button", { onClick: () => onSubTabChange?.(tab.id), className: `${styles.subTabButton} ${activeSubTab === tab.id ? styles.subTabButtonActive : ""}`.trim(), type: "button", role: "tab", "aria-selected": activeSubTab === tab.id, children: tab.label }, tab.id))) })) : null, _jsx("div", { className: styles.content, children: loading ? _jsx("div", { className: styles.loading, children: "Loading..." }) : children ?? null })] }));
+}
+//# sourceMappingURL=PageTemplate.js.map

package/dist/components/PageTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageTemplate.js","sourceRoot":"","sources":["../../src/components/PageTemplate.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,UAAU,EAAwB,MAAM,cAAc,CAAC;AAChE,OAAO,MAAM,MAAM,2BAA2B,CAAC;AA+B/C,MAAM,UAAU,YAAY,CAAC,EAC3B,KAAK,EACL,OAAO,EACP,KAAK,EACL,WAAW,EACX,IAAI,EACJ,OAAO,EACP,YAAY,EACZ,cAAc,EACd,MAAM,EACN,UAAU,EACV,KAAK,EACL,YAAY,EACZ,cAAc,EACd,aAAa,EACb,QAAQ,EACR,OAAO,EACP,SAAS,GAAG,IAAI,EAChB,SAAS,GAAG,EAAE,GACI;IAClB,MAAM,WAAW,GAAG,KAAK,IAAI,OAAO,CAAC;IAErC,OAAO,CACL,eAAK,SAAS,EAAE,GAAG,MAAM,CAAC,IAAI,IAAI,SAAS,EAAE,CAAC,IAAI,EAAE,aACjD,SAAS,CAAC,CAAC,CAAC,CACX,cAAK,SAAS,EAAE,MAAM,CAAC,MAAM,YAC3B,KAAC,UAAU,IACT,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,WAAW,EAClB,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,KAAK,EACZ,YAAY,EAAE,YAAY,EAC1B,cAAc,EAAE,cAAc,EAC9B,aAAa,EAAE,aAAa,GAC5B,GACE,CACP,CAAC,CAAC,CAAC,IAAI,EAEP,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,CACjB,cAAK,SAAS,EAAE,MAAM,CAAC,OAAO,EAAE,IAAI,EAAC,SAAS,gBAAa,GAAG,KAAK,WAAW,YAC3E,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CACpB,iBAEE,OAAO,EAAE,GAAG,EAAE,CAAC,cAAc,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EACvC,SAAS,EAAE,GAAG,MAAM,CAAC,YAAY,IAAI,YAAY,KAAK,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,kBAAkB,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,EAAE,EACtG,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,KAAK,mBACK,YAAY,KAAK,GAAG,CAAC,EAAE,YAErC,GAAG,CAAC,KAAK,IAPL,GAAG,CAAC,EAAE,CAQJ,CACV,CAAC,GACE,CACP,CAAC,CAAC,CAAC,IAAI,EAER,cAAK,SAAS,EAAE,MAAM,CAAC,OAAO,YAC3B,OAAO,CAAC,CAAC,CAAC,cAAK,SAAS,EAAE,MAAM,CAAC,OAAO,2BAAkB,CAAC,CAAC,CAAC,QAAQ,IAAI,IAAI,GAC1E,IACF,CACP,CAAC;AACJ,CAAC"}

package/dist/components/PageTemplate.module.css

@@ -0,0 +1,55 @@
+.root {
+  display: flex;
+  flex-direction: column;
+}
+
+.header {
+  flex-shrink: 0;
+  position: sticky;
+  top: 0;
+  z-index: 10;
+}
+
+.subTabs {
+  display: flex;
+  gap: 4px;
+  padding: 0 24px 16px;
+  border-bottom: 1px solid var(--border-color);
+  flex-shrink: 0;
+}
+
+.subTabButton {
+  padding: 10px 16px;
+  background: transparent;
+  border: none;
+  border-bottom: 2px solid transparent;
+  color: var(--text-secondary);
+  cursor: pointer;
+  font-size: 13px;
+  font-family: var(--font-mono);
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.08em;
+  transition: all var(--transition-fast);
+}
+
+.subTabButtonActive {
+  border-bottom-color: var(--accent-primary);
+  color: var(--text-primary);
+  font-weight: 800;
+}
+
+.content {
+  display: flex;
+  flex-direction: column;
+  padding: 1.5rem;
+}
+
+.loading {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 60px;
+  color: var(--text-secondary);
+}
+

package/dist/components/SegmentedControl.d.ts

@@ -0,0 +1,16 @@
+export interface SegmentedControlOption {
+    value: string;
+    label: string;
+}
+export interface SegmentedControlProps {
+    value: string;
+    options: SegmentedControlOption[];
+    onChange: (value: string) => void;
+    label?: string;
+    hint?: string;
+    ariaLabel?: string;
+    className?: string;
+    compact?: boolean;
+}
+export declare function SegmentedControl({ value, options, onChange, label, hint, ariaLabel, className, compact, }: SegmentedControlProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SegmentedControl.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../src/components/SegmentedControl.tsx"],"names":[],"mappings":"AAIA,MAAM,WAAW,sBAAsB;IACrC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,sBAAsB,EAAE,CAAC;IAClC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,KAAK,EACL,OAAO,EACP,QAAQ,EACR,KAAK,EACL,IAAI,EACJ,SAAS,EACT,SAAc,EACd,OAAe,GAChB,EAAE,qBAAqB,2CA4BvB"}

package/dist/components/SegmentedControl.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styles from "./SegmentedControl.module.css";
+export function SegmentedControl({ value, options, onChange, label, hint, ariaLabel, className = "", compact = false, }) {
+    return (_jsxs("div", { className: `${styles.wrapper} ${className}`.trim(), children: [label ? _jsx("div", { className: styles.label, children: label }) : null, _jsx("div", { className: `${styles.track} ${compact ? styles.trackCompact : ""}`.trim(), role: "tablist", "aria-label": ariaLabel || label, children: options.map((option) => {
+                    const isActive = option.value === value;
+                    return (_jsx("button", { type: "button", role: "tab", "aria-selected": isActive, className: `${styles.option} ${isActive ? styles.optionActive : ""} ${compact ? styles.optionCompact : ""}`.trim(), onClick: () => onChange(option.value), children: option.label }, option.value));
+                }) }), hint ? _jsx("div", { className: styles.hint, children: hint }) : null] }));
+}
+//# sourceMappingURL=SegmentedControl.js.map

package/dist/components/SegmentedControl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SegmentedControl.js","sourceRoot":"","sources":["../../src/components/SegmentedControl.tsx"],"names":[],"mappings":";AAEA,OAAO,MAAM,MAAM,+BAA+B,CAAC;AAkBnD,MAAM,UAAU,gBAAgB,CAAC,EAC/B,KAAK,EACL,OAAO,EACP,QAAQ,EACR,KAAK,EACL,IAAI,EACJ,SAAS,EACT,SAAS,GAAG,EAAE,EACd,OAAO,GAAG,KAAK,GACO;IACtB,OAAO,CACL,eAAK,SAAS,EAAE,GAAG,MAAM,CAAC,OAAO,IAAI,SAAS,EAAE,CAAC,IAAI,EAAE,aACpD,KAAK,CAAC,CAAC,CAAC,cAAK,SAAS,EAAE,MAAM,CAAC,KAAK,YAAG,KAAK,GAAO,CAAC,CAAC,CAAC,IAAI,EAC3D,cACE,SAAS,EAAE,GAAG,MAAM,CAAC,KAAK,IAAI,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,EAAE,EACzE,IAAI,EAAC,SAAS,gBACF,SAAS,IAAI,KAAK,YAE7B,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE;oBACtB,MAAM,QAAQ,GAAG,MAAM,CAAC,KAAK,KAAK,KAAK,CAAC;oBACxC,OAAO,CACL,iBAEE,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,KAAK,mBACK,QAAQ,EACvB,SAAS,EAAE,GAAG,MAAM,CAAC,MAAM,IAAI,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,IAAI,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,EAAE,EAClH,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,YAEpC,MAAM,CAAC,KAAK,IAPR,MAAM,CAAC,KAAK,CAQV,CACV,CAAC;gBACJ,CAAC,CAAC,GACE,EACL,IAAI,CAAC,CAAC,CAAC,cAAK,SAAS,EAAE,MAAM,CAAC,IAAI,YAAG,IAAI,GAAO,CAAC,CAAC,CAAC,IAAI,IACpD,CACP,CAAC;AACJ,CAAC"}

package/dist/components/SegmentedControl.module.css

@@ -0,0 +1,51 @@
+.wrapper {
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
+}
+
+.label {
+  color: var(--text-primary);
+  font-size: 0.875rem;
+  font-weight: 500;
+}
+
+.hint {
+  color: var(--text-secondary);
+  font-size: 0.75rem;
+}
+
+.track {
+  display: inline-flex;
+  gap: 4px;
+  padding: 4px;
+  border: 1px solid var(--border-color);
+  background: color-mix(in srgb, var(--bg-secondary) 85%, transparent);
+  border-radius: 999px;
+}
+
+.trackCompact {
+  padding: 2px;
+}
+
+.option {
+  border: none;
+  background: transparent;
+  color: var(--text-secondary);
+  padding: 0.5rem 0.875rem;
+  border-radius: 999px;
+  font-family: var(--font-mono);
+  font-size: 0.8125rem;
+  cursor: pointer;
+  transition: color var(--transition-fast), background-color var(--transition-fast);
+}
+
+.optionCompact {
+  padding: 0.35rem 0.7rem;
+}
+
+.optionActive {
+  background: var(--interactive-primary-bg);
+  color: var(--interactive-primary-fg);
+}
+

package/dist/components/StatusMessage.d.ts

@@ -0,0 +1,6 @@
+export interface StatusMessageProps {
+    message: string;
+    type: "success" | "error" | "info";
+}
+export declare function StatusMessage({ message, type }: StatusMessageProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=StatusMessage.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"StatusMessage.d.ts","sourceRoot":"","sources":["../../src/components/StatusMessage.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,kBAAkB;IACjC,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;CACpC;AAED,wBAAgB,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE,kBAAkB,2CAelE"}

package/dist/components/StatusMessage.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { CheckIcon, ErrorIcon, InfoIcon } from "@steez-ui/icons";
+import styles from "./StatusMessage.module.css";
+export function StatusMessage({ message, type }) {
+    return (_jsxs("div", { className: `${styles.message} ${styles[type]}`.trim(), role: type === "error" ? "alert" : "status", "aria-live": type === "error" ? "assertive" : "polite", children: [_jsxs("span", { className: styles.icon, children: [type === "success" ? _jsx(CheckIcon, { width: 16, height: 16 }) : null, type === "error" ? _jsx(ErrorIcon, { width: 16, height: 16 }) : null, type === "info" ? _jsx(InfoIcon, { width: 16, height: 16 }) : null] }), _jsx("span", { className: styles.text, children: message })] }));
+}
+//# sourceMappingURL=StatusMessage.js.map

package/dist/components/StatusMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusMessage.js","sourceRoot":"","sources":["../../src/components/StatusMessage.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAEjE,OAAO,MAAM,MAAM,4BAA4B,CAAC;AAOhD,MAAM,UAAU,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAsB;IACjE,OAAO,CACL,eACE,SAAS,EAAE,GAAG,MAAM,CAAC,OAAO,IAAI,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,EAAE,EACrD,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,eAChC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,QAAQ,aAEpD,gBAAM,SAAS,EAAE,MAAM,CAAC,IAAI,aACzB,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,KAAC,SAAS,IAAC,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,GAAI,CAAC,CAAC,CAAC,IAAI,EAChE,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,KAAC,SAAS,IAAC,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,GAAI,CAAC,CAAC,CAAC,IAAI,EAC9D,IAAI,KAAK,MAAM,CAAC,CAAC,CAAC,KAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,GAAI,CAAC,CAAC,CAAC,IAAI,IACxD,EACP,eAAM,SAAS,EAAE,MAAM,CAAC,IAAI,YAAG,OAAO,GAAQ,IAC1C,CACP,CAAC;AACJ,CAAC"}

package/dist/components/StatusMessage.module.css

@@ -0,0 +1,60 @@
+.message {
+  position: fixed;
+  bottom: 2rem;
+  right: 2rem;
+  display: flex;
+  align-items: center;
+  gap: 0.75rem;
+  padding: 1rem 1.5rem;
+  background: var(--bg-secondary);
+  border: 1px solid var(--border-color);
+  border-radius: 6px;
+  box-shadow: 0 4px 12px rgba(1, 6, 7, 0.15);
+  font-size: 0.9rem;
+  animation: slideIn 0.3s ease-out;
+  z-index: 1000;
+}
+
+@keyframes slideIn {
+  from {
+    transform: translateX(100%);
+    opacity: 0;
+  }
+  to {
+    transform: translateX(0);
+    opacity: 1;
+  }
+}
+
+.icon {
+  display: inline-flex;
+}
+
+.text {
+  color: var(--text-primary);
+}
+
+.success {
+  border-color: var(--success);
+}
+
+.success .icon {
+  color: var(--success);
+}
+
+.error {
+  border-color: var(--danger);
+}
+
+.error .icon {
+  color: var(--danger);
+}
+
+.info {
+  border-color: var(--info);
+}
+
+.info .icon {
+  color: var(--info);
+}
+

package/dist/components/TabbedPanel.d.ts

@@ -0,0 +1,23 @@
+import React from "react";
+export interface TabbedPanelTab {
+    id: string;
+    label: string;
+    content?: React.ReactNode;
+    panel?: React.ReactNode;
+    disabled?: boolean;
+}
+export interface TabbedPanelProps {
+    tabs: TabbedPanelTab[];
+    activeTab?: string;
+    defaultTab?: string;
+    onTabChange?: (tabId: string) => void;
+    onChange?: (tabId: string) => void;
+    label?: string;
+    hint?: string;
+    ariaLabel?: string;
+    className?: string;
+    navClassName?: string;
+    panelClassName?: string;
+}
+export declare function TabbedPanel({ tabs, activeTab, defaultTab, onTabChange, onChange, label, hint, ariaLabel, className, navClassName, panelClassName, }: TabbedPanelProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=TabbedPanel.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TabbedPanel.d.ts","sourceRoot":"","sources":["../../src/components/TabbedPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,MAAM,WAAW,cAAc;IAC7B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,cAAc,EAAE,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,SAAS,EACT,UAAU,EACV,WAAW,EACX,QAAQ,EACR,KAAK,EACL,IAAI,EACJ,SAAS,EACT,SAAc,EACd,YAAiB,EACjB,cAAmB,GACpB,EAAE,gBAAgB,2CAkElB"}

package/dist/components/TabbedPanel.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from "react";
+import styles from "./TabbedPanel.module.css";
+export function TabbedPanel({ tabs, activeTab, defaultTab, onTabChange, onChange, label, hint, ariaLabel, className = "", navClassName = "", panelClassName = "", }) {
+    const isControlled = typeof activeTab === "string";
+    const initialTabId = defaultTab || activeTab || tabs[0]?.id || "";
+    const [internalTabId, setInternalTabId] = React.useState(initialTabId);
+    const currentTabId = isControlled ? activeTab || tabs[0]?.id || "" : internalTabId;
+    const currentTab = tabs.find((tab) => tab.id === currentTabId) ?? tabs[0];
+    React.useEffect(() => {
+        if (!tabs.length) {
+            return;
+        }
+        if (tabs.some((tab) => tab.id === currentTabId)) {
+            return;
+        }
+        const fallbackTabId = defaultTab || activeTab || tabs[0]?.id || "";
+        if (!isControlled) {
+            setInternalTabId(fallbackTabId);
+        }
+        onTabChange?.(fallbackTabId);
+        onChange?.(fallbackTabId);
+    }, [activeTab, currentTabId, defaultTab, isControlled, onChange, onTabChange, tabs]);
+    const handleSelect = React.useCallback((tabId) => {
+        if (!isControlled) {
+            setInternalTabId(tabId);
+        }
+        onTabChange?.(tabId);
+        onChange?.(tabId);
+    }, [isControlled, onChange, onTabChange]);
+    return (_jsxs("div", { className: `${styles.root} ${className}`.trim(), children: [label || hint ? (_jsxs("div", { className: styles.header, children: [label ? _jsx("div", { className: styles.label, children: label }) : null, hint ? _jsx("div", { className: styles.hint, children: hint }) : null] })) : null, _jsx("div", { className: `${styles.tabs} ${navClassName}`.trim(), role: "tablist", "aria-label": ariaLabel || label, children: tabs.map((tab) => {
+                    const isActive = tab.id === currentTab?.id;
+                    return (_jsx("button", { type: "button", role: "tab", "aria-selected": isActive, disabled: tab.disabled, className: `${styles.tab} ${isActive ? styles.tabActive : ""}`.trim(), onClick: () => handleSelect(tab.id), children: tab.label }, tab.id));
+                }) }), _jsx("div", { className: `${styles.panel} ${panelClassName}`.trim(), role: "tabpanel", children: _jsx("div", { className: styles.panelBody, children: currentTab?.content ?? currentTab?.panel ?? null }) })] }));
+}
+//# sourceMappingURL=TabbedPanel.js.map

package/dist/components/TabbedPanel.js.map

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

package/dist/components/TabbedPanel.module.css

@@ -0,0 +1,61 @@
+.root {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+
+.header {
+  display: flex;
+  justify-content: space-between;
+  align-items: baseline;
+  gap: 1rem;
+}
+
+.label {
+  color: var(--text-primary);
+  font-size: 0.875rem;
+  font-family: var(--font-mono);
+  text-transform: uppercase;
+  letter-spacing: 0.08em;
+}
+
+.hint {
+  color: var(--text-secondary);
+  font-size: 0.8125rem;
+}
+
+.tabs {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.5rem;
+  position: relative;
+}
+
+.tab {
+  border: 1px solid var(--border-color);
+  background: transparent;
+  color: var(--text-secondary);
+  padding: 0.5rem 0.875rem;
+  font-family: var(--font-mono);
+  font-size: 0.8125rem;
+  cursor: pointer;
+  transition: all var(--transition-fast);
+}
+
+.tabActive {
+  background: var(--interactive-primary-bg);
+  color: var(--interactive-primary-fg);
+  border-color: var(--interactive-primary-border);
+}
+
+.panel {
+  border: 1px solid var(--border-color);
+  background: color-mix(in srgb, var(--bg-secondary) 88%, transparent);
+  padding: 1rem;
+}
+
+.panelBody {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}

package/dist/components/ThemeToggle.d.ts

@@ -0,0 +1,8 @@
+export interface ThemeToggleProps {
+    storageKey?: string;
+    defaultTheme?: "dark" | "light";
+    className?: string;
+    onThemeChange?: (theme: "dark" | "light") => void;
+}
+export declare function ThemeToggle({ storageKey, defaultTheme, className, onThemeChange, }: ThemeToggleProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ThemeToggle.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeToggle.d.ts","sourceRoot":"","sources":["../../src/components/ThemeToggle.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,gBAAgB;IAC/B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,KAAK,IAAI,CAAC;CACnD;AAED,wBAAgB,WAAW,CAAC,EAC1B,UAAoB,EACpB,YAAqB,EACrB,SAAc,EACd,aAAa,GACd,EAAE,gBAAgB,2CA6BlB"}