@tomny-dev/uzi 0.2.12 → 0.3.0

package/dist/index45.cjs

@@ -1,24 +1,35 @@
 const require_cx = require("./index4.cjs");
-const require_progress_module = require("./index44.cjs");
+const require_page_header_module = require("./index44.cjs");
 let react_jsx_runtime = require("react/jsx-runtime");
-//#region src/components/progress/Progress.tsx
-function Progress({ value, tone = "default", className, "aria-label": ariaLabel, ...rest }) {
-	const clamped = Math.max(0, Math.min(100, value));
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: require_cx.cx(require_progress_module.default.track, className),
-		role: "progressbar",
-		"aria-valuenow": clamped,
-		"aria-valuemin": 0,
-		"aria-valuemax": 100,
-		"aria-label": ariaLabel,
+//#region src/components/page-header/PageHeader.tsx
+function PageHeader({ title, description, eyebrow, actions, headingLevel = 1, className, ...rest }) {
+	const Heading = `h${headingLevel}`;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("header", {
+		className: require_cx.cx(require_page_header_module.default.header, className),
 		...rest,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: require_cx.cx(require_progress_module.default.fill, require_progress_module.default[`tone-${tone}`]),
-			style: { width: `${clamped}%` }
-		})
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: require_page_header_module.default.content,
+			children: [
+				eyebrow != null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: require_page_header_module.default.eyebrow,
+					children: eyebrow
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Heading, {
+					className: require_page_header_module.default.title,
+					children: title
+				}),
+				description != null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: require_page_header_module.default.description,
+					children: description
+				})
+			]
+		}), actions != null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: require_page_header_module.default.actions,
+			children: actions
+		})]
 	});
 }
 //#endregion
-exports.Progress = Progress;
+exports.PageHeader = PageHeader;
 
 //# sourceMappingURL=index45.cjs.map

package/dist/index45.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index45.cjs","names":[],"sources":["../src/components/progress/Progress.tsx"],"sourcesContent":["import type { HTMLAttributes } from \"react\";\nimport { cx } from \"../../utils/cx\";\nimport styles from \"./progress.module.css\";\n\nexport type ProgressTone = \"default\" | \"success\" | \"warning\" | \"danger\";\n\nexport type ProgressProps = HTMLAttributes<HTMLDivElement> & {\n  /** Value 0–100. */\n  value: number;\n  /** Visual tone. Defaults to \"default\". */\n  tone?: ProgressTone;\n  /** Accessible label. */\n  \"aria-label\"?: string;\n};\n\nexport function Progress({\n  value,\n  tone = \"default\",\n  className,\n  \"aria-label\": ariaLabel,\n  ...rest\n}: ProgressProps) {\n  const clamped = Math.max(0, Math.min(100, value));\n  return (\n    <div\n      className={cx(styles.track, className)}\n      role=\"progressbar\"\n      aria-valuenow={clamped}\n      aria-valuemin={0}\n      aria-valuemax={100}\n      aria-label={ariaLabel}\n      {...rest}\n    >\n      <div\n        className={cx(styles.fill, styles[`tone-${tone}`])}\n        style={{ width: `${clamped}%` }}\n      />\n    </div>\n  );\n}\n"],"mappings":";;;;AAeA,SAAgB,SAAS,EACvB,OACA,OAAO,WACP,WACA,cAAc,WACd,GAAG,QACa;CAChB,MAAM,UAAU,KAAK,IAAI,GAAG,KAAK,IAAI,KAAK,KAAK,CAAC;CAChD,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,WAAW,WAAA,GAAG,wBAAA,QAAO,OAAO,SAAS;EACrC,MAAK;EACL,iBAAe;EACf,iBAAe;EACf,iBAAe;EACf,cAAY;EACZ,GAAI;YAEJ,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;GACE,WAAW,WAAA,GAAG,wBAAA,QAAO,MAAM,wBAAA,QAAO,QAAQ,OAAO;GACjD,OAAO,EAAE,OAAO,GAAG,QAAQ,GAAG;EAC/B,CAAA;CACE,CAAA;AAET"}
+{"version":3,"file":"index45.cjs","names":[],"sources":["../src/components/page-header/PageHeader.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cx } from \"../../utils/cx\";\nimport styles from \"./page-header.module.css\";\n\nexport type PageHeaderHeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;\n\nexport type PageHeaderProps = Omit<HTMLAttributes<HTMLElement>, \"title\"> & {\n  title: ReactNode;\n  description?: ReactNode;\n  eyebrow?: ReactNode;\n  actions?: ReactNode;\n  headingLevel?: PageHeaderHeadingLevel;\n};\n\nexport function PageHeader({\n  title,\n  description,\n  eyebrow,\n  actions,\n  headingLevel = 1,\n  className,\n  ...rest\n}: PageHeaderProps) {\n  const Heading = `h${headingLevel}` as `h${PageHeaderHeadingLevel}`;\n\n  return (\n    <header className={cx(styles.header, className)} {...rest}>\n      <div className={styles.content}>\n        {eyebrow != null && <div className={styles.eyebrow}>{eyebrow}</div>}\n        <Heading className={styles.title}>{title}</Heading>\n        {description != null && <div className={styles.description}>{description}</div>}\n      </div>\n      {actions != null && <div className={styles.actions}>{actions}</div>}\n    </header>\n  );\n}\n"],"mappings":";;;;AAcA,SAAgB,WAAW,EACzB,OACA,aACA,SACA,SACA,eAAe,GACf,WACA,GAAG,QACe;CAClB,MAAM,UAAU,IAAI;CAEpB,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,UAAD;EAAQ,WAAW,WAAA,GAAG,2BAAA,QAAO,QAAQ,SAAS;EAAG,GAAI;YAArD,CACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;GAAK,WAAW,2BAAA,QAAO;aAAvB;IACG,WAAW,QAAQ,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;KAAK,WAAW,2BAAA,QAAO;eAAU;IAAa,CAAA;IAClE,iBAAA,GAAA,kBAAA,IAAA,CAAC,SAAD;KAAS,WAAW,2BAAA,QAAO;eAAQ;IAAe,CAAA;IACjD,eAAe,QAAQ,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;KAAK,WAAW,2BAAA,QAAO;eAAc;IAAiB,CAAA;GAC3E;MACJ,WAAW,QAAQ,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;GAAK,WAAW,2BAAA,QAAO;aAAU;EAAa,CAAA,CAC5D;;AAEZ"}

package/dist/index45.js

@@ -1,13 +1,17 @@
-//#region src/components/segmented-toggle/segmented-toggle.module.css
-var track = "uzi-segmented-toggle-module__track__M4fjm";
-var option = "uzi-segmented-toggle-module__option__7cEZJ";
-var label = "uzi-segmented-toggle-module__label__bDAIv";
-var segmented_toggle_module_default = {
-	track,
-	option,
-	label
+//#region src/components/section-header/section-header.module.css
+var header = "uzi-section-header-module__header__tTqQQ";
+var content = "uzi-section-header-module__content__6prWG";
+var title = "uzi-section-header-module__title__7ddbh";
+var description = "uzi-section-header-module__description__T8tck";
+var actions = "uzi-section-header-module__actions__kS-uK";
+var section_header_module_default = {
+	header,
+	content,
+	title,
+	description,
+	actions
 };
 //#endregion
-export { segmented_toggle_module_default as default, label, option, track };
+export { actions, content, section_header_module_default as default, description, header, title };
 
 //# sourceMappingURL=index45.js.map

package/dist/index45.js.map

@@ -1 +1 @@
-{"version":3,"file":"index45.js","names":[],"sources":["../src/components/segmented-toggle/segmented-toggle.module.css"],"sourcesContent":[".track {\n  display: inline-flex;\n  border-radius: 999px;\n  border: 1px solid var(--border);\n  background: var(--card);\n  padding: 4px;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);\n  gap: 2px;\n}\n\n.option {\n  border-radius: 999px;\n  padding: 6px 16px;\n  font-size: var(--uzi-control-font-size);\n  font-weight: 500;\n  line-height: var(--uzi-control-line-height);\n  background: transparent;\n  color: var(--muted-foreground);\n  border: none;\n  cursor: pointer;\n  transition:\n    color 120ms ease,\n    background 120ms ease;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  white-space: nowrap;\n}\n\n.label {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.option:hover:not([aria-checked=\"true\"]):not(:disabled) {\n  color: var(--foreground);\n}\n\n.option[aria-checked=\"true\"] {\n  background: var(--foreground);\n  color: var(--background);\n}\n\n.option:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n.option:focus-visible {\n  outline: var(--focus-ring);\n  outline-offset: var(--focus-ring-offset);\n}\n"],"mappings":""}
+{"version":3,"file":"index45.js","names":[],"sources":["../src/components/section-header/section-header.module.css"],"sourcesContent":[".header {\n  display: flex;\n  align-items: flex-end;\n  justify-content: space-between;\n  gap: 1rem;\n}\n\n.content {\n  min-width: 0;\n  display: grid;\n  gap: 0.375rem;\n}\n\n.title {\n  margin: 0;\n  color: var(--foreground);\n  font-size: clamp(1.25rem, 2vw, 1.625rem);\n  line-height: 1.2;\n  letter-spacing: -0.015em;\n}\n\n.description {\n  max-width: 44rem;\n  color: var(--muted-foreground);\n  font-size: 0.875rem;\n  line-height: 1.6;\n}\n\n.actions {\n  display: flex;\n  flex: 0 0 auto;\n  flex-wrap: wrap;\n  align-items: center;\n  justify-content: flex-end;\n  gap: 0.5rem;\n}\n\n@media (max-width: 40rem) {\n  .header {\n    align-items: flex-start;\n    flex-direction: column;\n  }\n\n  .actions {\n    width: 100%;\n    justify-content: flex-start;\n  }\n}\n"],"mappings":""}

package/dist/index46.cjs

@@ -1,16 +1,22 @@
-//#region src/components/segmented-toggle/segmented-toggle.module.css
-var track = "uzi-segmented-toggle-module__track__M4fjm";
-var option = "uzi-segmented-toggle-module__option__7cEZJ";
-var label = "uzi-segmented-toggle-module__label__bDAIv";
-var segmented_toggle_module_default = {
-	track,
-	option,
-	label
+//#region src/components/section-header/section-header.module.css
+var header = "uzi-section-header-module__header__tTqQQ";
+var content = "uzi-section-header-module__content__6prWG";
+var title = "uzi-section-header-module__title__7ddbh";
+var description = "uzi-section-header-module__description__T8tck";
+var actions = "uzi-section-header-module__actions__kS-uK";
+var section_header_module_default = {
+	header,
+	content,
+	title,
+	description,
+	actions
 };
 //#endregion
-exports.default = segmented_toggle_module_default;
-exports.label = label;
-exports.option = option;
-exports.track = track;
+exports.actions = actions;
+exports.content = content;
+exports.default = section_header_module_default;
+exports.description = description;
+exports.header = header;
+exports.title = title;
 
 //# sourceMappingURL=index46.cjs.map

package/dist/index46.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index46.cjs","names":[],"sources":["../src/components/segmented-toggle/segmented-toggle.module.css"],"sourcesContent":[".track {\n  display: inline-flex;\n  border-radius: 999px;\n  border: 1px solid var(--border);\n  background: var(--card);\n  padding: 4px;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);\n  gap: 2px;\n}\n\n.option {\n  border-radius: 999px;\n  padding: 6px 16px;\n  font-size: var(--uzi-control-font-size);\n  font-weight: 500;\n  line-height: var(--uzi-control-line-height);\n  background: transparent;\n  color: var(--muted-foreground);\n  border: none;\n  cursor: pointer;\n  transition:\n    color 120ms ease,\n    background 120ms ease;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  white-space: nowrap;\n}\n\n.label {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.option:hover:not([aria-checked=\"true\"]):not(:disabled) {\n  color: var(--foreground);\n}\n\n.option[aria-checked=\"true\"] {\n  background: var(--foreground);\n  color: var(--background);\n}\n\n.option:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n.option:focus-visible {\n  outline: var(--focus-ring);\n  outline-offset: var(--focus-ring-offset);\n}\n"],"mappings":""}
+{"version":3,"file":"index46.cjs","names":[],"sources":["../src/components/section-header/section-header.module.css"],"sourcesContent":[".header {\n  display: flex;\n  align-items: flex-end;\n  justify-content: space-between;\n  gap: 1rem;\n}\n\n.content {\n  min-width: 0;\n  display: grid;\n  gap: 0.375rem;\n}\n\n.title {\n  margin: 0;\n  color: var(--foreground);\n  font-size: clamp(1.25rem, 2vw, 1.625rem);\n  line-height: 1.2;\n  letter-spacing: -0.015em;\n}\n\n.description {\n  max-width: 44rem;\n  color: var(--muted-foreground);\n  font-size: 0.875rem;\n  line-height: 1.6;\n}\n\n.actions {\n  display: flex;\n  flex: 0 0 auto;\n  flex-wrap: wrap;\n  align-items: center;\n  justify-content: flex-end;\n  gap: 0.5rem;\n}\n\n@media (max-width: 40rem) {\n  .header {\n    align-items: flex-start;\n    flex-direction: column;\n  }\n\n  .actions {\n    width: 100%;\n    justify-content: flex-start;\n  }\n}\n"],"mappings":""}

package/dist/index46.js

@@ -1,96 +1,28 @@
-"use client";
 import { cx } from "./index3.js";
-import segmented_toggle_module_default from "./index45.js";
-import * as React from "react";
-import { jsx } from "react/jsx-runtime";
-//#region src/components/segmented-toggle/SegmentedToggle.tsx
-function SegmentedToggle({ options, value, onChange, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, className }) {
-	const itemRefs = React.useRef([]);
-	const selectedIndex = options.findIndex((opt) => opt.value === value);
-	const fallbackIndex = options.findIndex((opt) => !opt.disabled);
-	let lastEnabledIndex = -1;
-	for (let index = options.length - 1; index >= 0; index -= 1) if (!options[index]?.disabled) {
-		lastEnabledIndex = index;
-		break;
-	}
-	const tabbableIndex = selectedIndex >= 0 && !options[selectedIndex]?.disabled ? selectedIndex : fallbackIndex;
-	const focusItem = (index) => {
-		itemRefs.current[index]?.focus();
-	};
-	const findEnabledIndex = (startIndex, direction) => {
-		if (options.length === 0) return -1;
-		let nextIndex = startIndex;
-		for (let i = 0; i < options.length; i += 1) {
-			nextIndex = (nextIndex + direction + options.length) % options.length;
-			if (!options[nextIndex]?.disabled) return nextIndex;
-		}
-		return startIndex;
-	};
-	const selectIndex = (index) => {
-		const nextOption = options[index];
-		if (!nextOption || nextOption.disabled || nextOption.value === value) return;
-		onChange(nextOption.value);
-	};
-	const handleKeyDown = (event, index) => {
-		switch (event.key) {
-			case "ArrowRight":
-			case "ArrowDown": {
-				event.preventDefault();
-				const nextIndex = findEnabledIndex(index, 1);
-				focusItem(nextIndex);
-				selectIndex(nextIndex);
-				break;
-			}
-			case "ArrowLeft":
-			case "ArrowUp": {
-				event.preventDefault();
-				const nextIndex = findEnabledIndex(index, -1);
-				focusItem(nextIndex);
-				selectIndex(nextIndex);
-				break;
-			}
-			case "Home":
-				event.preventDefault();
-				focusItem(fallbackIndex);
-				if (fallbackIndex >= 0) selectIndex(fallbackIndex);
-				break;
-			case "End":
-				event.preventDefault();
-				if (lastEnabledIndex >= 0) {
-					focusItem(lastEnabledIndex);
-					selectIndex(lastEnabledIndex);
-				}
-				break;
-			default: break;
-		}
-	};
-	return /* @__PURE__ */ jsx("div", {
-		className: cx(segmented_toggle_module_default.track, className),
-		role: "radiogroup",
-		"aria-label": ariaLabel,
-		"aria-labelledby": ariaLabelledBy,
-		children: options.map((opt, index) => /* @__PURE__ */ jsx("button", {
-			ref: (node) => {
-				itemRefs.current[index] = node;
-			},
-			type: "button",
-			role: "radio",
-			"aria-checked": opt.value === value,
-			disabled: opt.disabled,
-			tabIndex: opt.disabled ? -1 : index === tabbableIndex ? 0 : -1,
-			onClick: () => {
-				if (opt.value !== value) onChange(opt.value);
-			},
-			onKeyDown: (event) => handleKeyDown(event, index),
-			className: cx(segmented_toggle_module_default.option),
-			children: /* @__PURE__ */ jsx("span", {
-				className: segmented_toggle_module_default.label,
-				children: opt.label
-			})
-		}, opt.value))
+import section_header_module_default from "./index45.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/section-header/SectionHeader.tsx
+function SectionHeader({ title, description, actions, headingLevel = 2, className, ...rest }) {
+	const Heading = `h${headingLevel}`;
+	return /* @__PURE__ */ jsxs("div", {
+		className: cx(section_header_module_default.header, className),
+		...rest,
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: section_header_module_default.content,
+			children: [/* @__PURE__ */ jsx(Heading, {
+				className: section_header_module_default.title,
+				children: title
+			}), description != null && /* @__PURE__ */ jsx("div", {
+				className: section_header_module_default.description,
+				children: description
+			})]
+		}), actions != null && /* @__PURE__ */ jsx("div", {
+			className: section_header_module_default.actions,
+			children: actions
+		})]
 	});
 }
 //#endregion
-export { SegmentedToggle };
+export { SectionHeader };
 
 //# sourceMappingURL=index46.js.map

package/dist/index46.js.map

@@ -1 +1 @@
-{"version":3,"file":"index46.js","names":[],"sources":["../src/components/segmented-toggle/SegmentedToggle.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport type { ReactNode } from \"react\";\nimport { cx } from \"../../utils/cx\";\nimport styles from \"./segmented-toggle.module.css\";\n\nexport type SegmentedToggleOption<T extends string = string> = {\n  label: ReactNode;\n  value: T;\n  disabled?: boolean;\n};\n\nexport type SegmentedToggleProps<T extends string = string> = {\n  options: SegmentedToggleOption<T>[];\n  value: T;\n  onChange: (value: T) => void;\n  \"aria-label\"?: string;\n  \"aria-labelledby\"?: string;\n  className?: string;\n};\n\nexport function SegmentedToggle<T extends string = string>({\n  options,\n  value,\n  onChange,\n  \"aria-label\": ariaLabel,\n  \"aria-labelledby\": ariaLabelledBy,\n  className,\n}: SegmentedToggleProps<T>) {\n  const itemRefs = React.useRef<Array<HTMLButtonElement | null>>([]);\n  const selectedIndex = options.findIndex((opt) => opt.value === value);\n  const fallbackIndex = options.findIndex((opt) => !opt.disabled);\n  let lastEnabledIndex = -1;\n  for (let index = options.length - 1; index >= 0; index -= 1) {\n    if (!options[index]?.disabled) {\n      lastEnabledIndex = index;\n      break;\n    }\n  }\n  const tabbableIndex =\n    selectedIndex >= 0 && !options[selectedIndex]?.disabled\n      ? selectedIndex\n      : fallbackIndex;\n\n  const focusItem = (index: number) => {\n    itemRefs.current[index]?.focus();\n  };\n\n  const findEnabledIndex = (\n    startIndex: number,\n    direction: 1 | -1,\n  ): number => {\n    if (options.length === 0) return -1;\n\n    let nextIndex = startIndex;\n    for (let i = 0; i < options.length; i += 1) {\n      nextIndex = (nextIndex + direction + options.length) % options.length;\n      if (!options[nextIndex]?.disabled) {\n        return nextIndex;\n      }\n    }\n\n    return startIndex;\n  };\n\n  const selectIndex = (index: number) => {\n    const nextOption = options[index];\n    if (!nextOption || nextOption.disabled || nextOption.value === value) {\n      return;\n    }\n    onChange(nextOption.value);\n  };\n\n  const handleKeyDown = (\n    event: React.KeyboardEvent<HTMLButtonElement>,\n    index: number,\n  ) => {\n    switch (event.key) {\n      case \"ArrowRight\":\n      case \"ArrowDown\": {\n        event.preventDefault();\n        const nextIndex = findEnabledIndex(index, 1);\n        focusItem(nextIndex);\n        selectIndex(nextIndex);\n        break;\n      }\n      case \"ArrowLeft\":\n      case \"ArrowUp\": {\n        event.preventDefault();\n        const nextIndex = findEnabledIndex(index, -1);\n        focusItem(nextIndex);\n        selectIndex(nextIndex);\n        break;\n      }\n      case \"Home\": {\n        event.preventDefault();\n        focusItem(fallbackIndex);\n        if (fallbackIndex >= 0) {\n          selectIndex(fallbackIndex);\n        }\n        break;\n      }\n      case \"End\": {\n        event.preventDefault();\n        if (lastEnabledIndex >= 0) {\n          focusItem(lastEnabledIndex);\n          selectIndex(lastEnabledIndex);\n        }\n        break;\n      }\n      default:\n        break;\n    }\n  };\n\n  return (\n    <div\n      className={cx(styles.track, className)}\n      role=\"radiogroup\"\n      aria-label={ariaLabel}\n      aria-labelledby={ariaLabelledBy}\n    >\n      {options.map((opt, index) => (\n        <button\n          key={opt.value}\n          ref={(node) => {\n            itemRefs.current[index] = node;\n          }}\n          type=\"button\"\n          role=\"radio\"\n          aria-checked={opt.value === value}\n          disabled={opt.disabled}\n          tabIndex={\n            opt.disabled\n              ? -1\n              : index === tabbableIndex\n                ? 0\n                : -1\n          }\n          onClick={() => {\n            if (opt.value !== value) {\n              onChange(opt.value);\n            }\n          }}\n          onKeyDown={(event) => handleKeyDown(event, index)}\n          className={cx(styles.option)}\n        >\n          <span className={styles.label}>{opt.label}</span>\n        </button>\n      ))}\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAsBA,SAAgB,gBAA2C,EACzD,SACA,OACA,UACA,cAAc,WACd,mBAAmB,gBACnB,aAC0B;CAC1B,MAAM,WAAW,MAAM,OAAwC,CAAC,CAAC;CACjE,MAAM,gBAAgB,QAAQ,WAAW,QAAQ,IAAI,UAAU,KAAK;CACpE,MAAM,gBAAgB,QAAQ,WAAW,QAAQ,CAAC,IAAI,QAAQ;CAC9D,IAAI,mBAAmB;CACvB,KAAK,IAAI,QAAQ,QAAQ,SAAS,GAAG,SAAS,GAAG,SAAS,GACxD,IAAI,CAAC,QAAQ,MAAM,EAAE,UAAU;EAC7B,mBAAmB;EACnB;CACF;CAEF,MAAM,gBACJ,iBAAiB,KAAK,CAAC,QAAQ,cAAc,EAAE,WAC3C,gBACA;CAEN,MAAM,aAAa,UAAkB;EACnC,SAAS,QAAQ,MAAM,EAAE,MAAM;CACjC;CAEA,MAAM,oBACJ,YACA,cACW;EACX,IAAI,QAAQ,WAAW,GAAG,OAAO;EAEjC,IAAI,YAAY;EAChB,KAAK,IAAI,IAAI,GAAG,IAAI,QAAQ,QAAQ,KAAK,GAAG;GAC1C,aAAa,YAAY,YAAY,QAAQ,UAAU,QAAQ;GAC/D,IAAI,CAAC,QAAQ,UAAU,EAAE,UACvB,OAAO;EAEX;EAEA,OAAO;CACT;CAEA,MAAM,eAAe,UAAkB;EACrC,MAAM,aAAa,QAAQ;EAC3B,IAAI,CAAC,cAAc,WAAW,YAAY,WAAW,UAAU,OAC7D;EAEF,SAAS,WAAW,KAAK;CAC3B;CAEA,MAAM,iBACJ,OACA,UACG;EACH,QAAQ,MAAM,KAAd;GACE,KAAK;GACL,KAAK,aAAa;IAChB,MAAM,eAAe;IACrB,MAAM,YAAY,iBAAiB,OAAO,CAAC;IAC3C,UAAU,SAAS;IACnB,YAAY,SAAS;IACrB;GACF;GACA,KAAK;GACL,KAAK,WAAW;IACd,MAAM,eAAe;IACrB,MAAM,YAAY,iBAAiB,OAAO,EAAE;IAC5C,UAAU,SAAS;IACnB,YAAY,SAAS;IACrB;GACF;GACA,KAAK;IACH,MAAM,eAAe;IACrB,UAAU,aAAa;IACvB,IAAI,iBAAiB,GACnB,YAAY,aAAa;IAE3B;GAEF,KAAK;IACH,MAAM,eAAe;IACrB,IAAI,oBAAoB,GAAG;KACzB,UAAU,gBAAgB;KAC1B,YAAY,gBAAgB;IAC9B;IACA;GAEF,SACE;EACJ;CACF;CAEA,OACE,oBAAC,OAAD;EACE,WAAW,GAAG,gCAAO,OAAO,SAAS;EACrC,MAAK;EACL,cAAY;EACZ,mBAAiB;YAEhB,QAAQ,KAAK,KAAK,UACjB,oBAAC,UAAD;GAEE,MAAM,SAAS;IACb,SAAS,QAAQ,SAAS;GAC5B;GACA,MAAK;GACL,MAAK;GACL,gBAAc,IAAI,UAAU;GAC5B,UAAU,IAAI;GACd,UACE,IAAI,WACA,KACA,UAAU,gBACR,IACA;GAER,eAAe;IACb,IAAI,IAAI,UAAU,OAChB,SAAS,IAAI,KAAK;GAEtB;GACA,YAAY,UAAU,cAAc,OAAO,KAAK;GAChD,WAAW,GAAG,gCAAO,MAAM;aAE3B,oBAAC,QAAD;IAAM,WAAW,gCAAO;cAAQ,IAAI;GAAY,CAAA;EAC1C,GAxBD,IAAI,KAwBH,CACT;CACE,CAAA;AAET"}
+{"version":3,"file":"index46.js","names":[],"sources":["../src/components/section-header/SectionHeader.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cx } from \"../../utils/cx\";\nimport styles from \"./section-header.module.css\";\n\nexport type SectionHeaderHeadingLevel = 2 | 3 | 4 | 5 | 6;\n\nexport type SectionHeaderProps = Omit<HTMLAttributes<HTMLDivElement>, \"title\"> & {\n  title: ReactNode;\n  description?: ReactNode;\n  actions?: ReactNode;\n  headingLevel?: SectionHeaderHeadingLevel;\n};\n\nexport function SectionHeader({\n  title,\n  description,\n  actions,\n  headingLevel = 2,\n  className,\n  ...rest\n}: SectionHeaderProps) {\n  const Heading = `h${headingLevel}` as `h${SectionHeaderHeadingLevel}`;\n\n  return (\n    <div className={cx(styles.header, className)} {...rest}>\n      <div className={styles.content}>\n        <Heading className={styles.title}>{title}</Heading>\n        {description != null && <div className={styles.description}>{description}</div>}\n      </div>\n      {actions != null && <div className={styles.actions}>{actions}</div>}\n    </div>\n  );\n}\n"],"mappings":";;;;AAaA,SAAgB,cAAc,EAC5B,OACA,aACA,SACA,eAAe,GACf,WACA,GAAG,QACkB;CACrB,MAAM,UAAU,IAAI;CAEpB,OACE,qBAAC,OAAD;EAAK,WAAW,GAAG,8BAAO,QAAQ,SAAS;EAAG,GAAI;YAAlD,CACE,qBAAC,OAAD;GAAK,WAAW,8BAAO;aAAvB,CACE,oBAAC,SAAD;IAAS,WAAW,8BAAO;cAAQ;GAAe,CAAA,GACjD,eAAe,QAAQ,oBAAC,OAAD;IAAK,WAAW,8BAAO;cAAc;GAAiB,CAAA,CAC3E;MACJ,WAAW,QAAQ,oBAAC,OAAD;GAAK,WAAW,8BAAO;aAAU;EAAa,CAAA,CAC/D;;AAET"}

package/dist/index47.cjs

@@ -1,98 +1,28 @@
-"use client";
-const require_runtime = require("./index2.cjs");
 const require_cx = require("./index4.cjs");
-const require_segmented_toggle_module = require("./index46.cjs");
-let react = require("react");
-react = require_runtime.__toESM(react, 1);
+const require_section_header_module = require("./index46.cjs");
 let react_jsx_runtime = require("react/jsx-runtime");
-//#region src/components/segmented-toggle/SegmentedToggle.tsx
-function SegmentedToggle({ options, value, onChange, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, className }) {
-	const itemRefs = react.useRef([]);
-	const selectedIndex = options.findIndex((opt) => opt.value === value);
-	const fallbackIndex = options.findIndex((opt) => !opt.disabled);
-	let lastEnabledIndex = -1;
-	for (let index = options.length - 1; index >= 0; index -= 1) if (!options[index]?.disabled) {
-		lastEnabledIndex = index;
-		break;
-	}
-	const tabbableIndex = selectedIndex >= 0 && !options[selectedIndex]?.disabled ? selectedIndex : fallbackIndex;
-	const focusItem = (index) => {
-		itemRefs.current[index]?.focus();
-	};
-	const findEnabledIndex = (startIndex, direction) => {
-		if (options.length === 0) return -1;
-		let nextIndex = startIndex;
-		for (let i = 0; i < options.length; i += 1) {
-			nextIndex = (nextIndex + direction + options.length) % options.length;
-			if (!options[nextIndex]?.disabled) return nextIndex;
-		}
-		return startIndex;
-	};
-	const selectIndex = (index) => {
-		const nextOption = options[index];
-		if (!nextOption || nextOption.disabled || nextOption.value === value) return;
-		onChange(nextOption.value);
-	};
-	const handleKeyDown = (event, index) => {
-		switch (event.key) {
-			case "ArrowRight":
-			case "ArrowDown": {
-				event.preventDefault();
-				const nextIndex = findEnabledIndex(index, 1);
-				focusItem(nextIndex);
-				selectIndex(nextIndex);
-				break;
-			}
-			case "ArrowLeft":
-			case "ArrowUp": {
-				event.preventDefault();
-				const nextIndex = findEnabledIndex(index, -1);
-				focusItem(nextIndex);
-				selectIndex(nextIndex);
-				break;
-			}
-			case "Home":
-				event.preventDefault();
-				focusItem(fallbackIndex);
-				if (fallbackIndex >= 0) selectIndex(fallbackIndex);
-				break;
-			case "End":
-				event.preventDefault();
-				if (lastEnabledIndex >= 0) {
-					focusItem(lastEnabledIndex);
-					selectIndex(lastEnabledIndex);
-				}
-				break;
-			default: break;
-		}
-	};
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: require_cx.cx(require_segmented_toggle_module.default.track, className),
-		role: "radiogroup",
-		"aria-label": ariaLabel,
-		"aria-labelledby": ariaLabelledBy,
-		children: options.map((opt, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-			ref: (node) => {
-				itemRefs.current[index] = node;
-			},
-			type: "button",
-			role: "radio",
-			"aria-checked": opt.value === value,
-			disabled: opt.disabled,
-			tabIndex: opt.disabled ? -1 : index === tabbableIndex ? 0 : -1,
-			onClick: () => {
-				if (opt.value !== value) onChange(opt.value);
-			},
-			onKeyDown: (event) => handleKeyDown(event, index),
-			className: require_cx.cx(require_segmented_toggle_module.default.option),
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				className: require_segmented_toggle_module.default.label,
-				children: opt.label
-			})
-		}, opt.value))
+//#region src/components/section-header/SectionHeader.tsx
+function SectionHeader({ title, description, actions, headingLevel = 2, className, ...rest }) {
+	const Heading = `h${headingLevel}`;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: require_cx.cx(require_section_header_module.default.header, className),
+		...rest,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: require_section_header_module.default.content,
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Heading, {
+				className: require_section_header_module.default.title,
+				children: title
+			}), description != null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: require_section_header_module.default.description,
+				children: description
+			})]
+		}), actions != null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: require_section_header_module.default.actions,
+			children: actions
+		})]
 	});
 }
 //#endregion
-exports.SegmentedToggle = SegmentedToggle;
+exports.SectionHeader = SectionHeader;
 
 //# sourceMappingURL=index47.cjs.map

package/dist/index47.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index47.cjs","names":[],"sources":["../src/components/segmented-toggle/SegmentedToggle.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport type { ReactNode } from \"react\";\nimport { cx } from \"../../utils/cx\";\nimport styles from \"./segmented-toggle.module.css\";\n\nexport type SegmentedToggleOption<T extends string = string> = {\n  label: ReactNode;\n  value: T;\n  disabled?: boolean;\n};\n\nexport type SegmentedToggleProps<T extends string = string> = {\n  options: SegmentedToggleOption<T>[];\n  value: T;\n  onChange: (value: T) => void;\n  \"aria-label\"?: string;\n  \"aria-labelledby\"?: string;\n  className?: string;\n};\n\nexport function SegmentedToggle<T extends string = string>({\n  options,\n  value,\n  onChange,\n  \"aria-label\": ariaLabel,\n  \"aria-labelledby\": ariaLabelledBy,\n  className,\n}: SegmentedToggleProps<T>) {\n  const itemRefs = React.useRef<Array<HTMLButtonElement | null>>([]);\n  const selectedIndex = options.findIndex((opt) => opt.value === value);\n  const fallbackIndex = options.findIndex((opt) => !opt.disabled);\n  let lastEnabledIndex = -1;\n  for (let index = options.length - 1; index >= 0; index -= 1) {\n    if (!options[index]?.disabled) {\n      lastEnabledIndex = index;\n      break;\n    }\n  }\n  const tabbableIndex =\n    selectedIndex >= 0 && !options[selectedIndex]?.disabled\n      ? selectedIndex\n      : fallbackIndex;\n\n  const focusItem = (index: number) => {\n    itemRefs.current[index]?.focus();\n  };\n\n  const findEnabledIndex = (\n    startIndex: number,\n    direction: 1 | -1,\n  ): number => {\n    if (options.length === 0) return -1;\n\n    let nextIndex = startIndex;\n    for (let i = 0; i < options.length; i += 1) {\n      nextIndex = (nextIndex + direction + options.length) % options.length;\n      if (!options[nextIndex]?.disabled) {\n        return nextIndex;\n      }\n    }\n\n    return startIndex;\n  };\n\n  const selectIndex = (index: number) => {\n    const nextOption = options[index];\n    if (!nextOption || nextOption.disabled || nextOption.value === value) {\n      return;\n    }\n    onChange(nextOption.value);\n  };\n\n  const handleKeyDown = (\n    event: React.KeyboardEvent<HTMLButtonElement>,\n    index: number,\n  ) => {\n    switch (event.key) {\n      case \"ArrowRight\":\n      case \"ArrowDown\": {\n        event.preventDefault();\n        const nextIndex = findEnabledIndex(index, 1);\n        focusItem(nextIndex);\n        selectIndex(nextIndex);\n        break;\n      }\n      case \"ArrowLeft\":\n      case \"ArrowUp\": {\n        event.preventDefault();\n        const nextIndex = findEnabledIndex(index, -1);\n        focusItem(nextIndex);\n        selectIndex(nextIndex);\n        break;\n      }\n      case \"Home\": {\n        event.preventDefault();\n        focusItem(fallbackIndex);\n        if (fallbackIndex >= 0) {\n          selectIndex(fallbackIndex);\n        }\n        break;\n      }\n      case \"End\": {\n        event.preventDefault();\n        if (lastEnabledIndex >= 0) {\n          focusItem(lastEnabledIndex);\n          selectIndex(lastEnabledIndex);\n        }\n        break;\n      }\n      default:\n        break;\n    }\n  };\n\n  return (\n    <div\n      className={cx(styles.track, className)}\n      role=\"radiogroup\"\n      aria-label={ariaLabel}\n      aria-labelledby={ariaLabelledBy}\n    >\n      {options.map((opt, index) => (\n        <button\n          key={opt.value}\n          ref={(node) => {\n            itemRefs.current[index] = node;\n          }}\n          type=\"button\"\n          role=\"radio\"\n          aria-checked={opt.value === value}\n          disabled={opt.disabled}\n          tabIndex={\n            opt.disabled\n              ? -1\n              : index === tabbableIndex\n                ? 0\n                : -1\n          }\n          onClick={() => {\n            if (opt.value !== value) {\n              onChange(opt.value);\n            }\n          }}\n          onKeyDown={(event) => handleKeyDown(event, index)}\n          className={cx(styles.option)}\n        >\n          <span className={styles.label}>{opt.label}</span>\n        </button>\n      ))}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;AAsBA,SAAgB,gBAA2C,EACzD,SACA,OACA,UACA,cAAc,WACd,mBAAmB,gBACnB,aAC0B;CAC1B,MAAM,WAAW,MAAM,OAAwC,CAAC,CAAC;CACjE,MAAM,gBAAgB,QAAQ,WAAW,QAAQ,IAAI,UAAU,KAAK;CACpE,MAAM,gBAAgB,QAAQ,WAAW,QAAQ,CAAC,IAAI,QAAQ;CAC9D,IAAI,mBAAmB;CACvB,KAAK,IAAI,QAAQ,QAAQ,SAAS,GAAG,SAAS,GAAG,SAAS,GACxD,IAAI,CAAC,QAAQ,MAAM,EAAE,UAAU;EAC7B,mBAAmB;EACnB;CACF;CAEF,MAAM,gBACJ,iBAAiB,KAAK,CAAC,QAAQ,cAAc,EAAE,WAC3C,gBACA;CAEN,MAAM,aAAa,UAAkB;EACnC,SAAS,QAAQ,MAAM,EAAE,MAAM;CACjC;CAEA,MAAM,oBACJ,YACA,cACW;EACX,IAAI,QAAQ,WAAW,GAAG,OAAO;EAEjC,IAAI,YAAY;EAChB,KAAK,IAAI,IAAI,GAAG,IAAI,QAAQ,QAAQ,KAAK,GAAG;GAC1C,aAAa,YAAY,YAAY,QAAQ,UAAU,QAAQ;GAC/D,IAAI,CAAC,QAAQ,UAAU,EAAE,UACvB,OAAO;EAEX;EAEA,OAAO;CACT;CAEA,MAAM,eAAe,UAAkB;EACrC,MAAM,aAAa,QAAQ;EAC3B,IAAI,CAAC,cAAc,WAAW,YAAY,WAAW,UAAU,OAC7D;EAEF,SAAS,WAAW,KAAK;CAC3B;CAEA,MAAM,iBACJ,OACA,UACG;EACH,QAAQ,MAAM,KAAd;GACE,KAAK;GACL,KAAK,aAAa;IAChB,MAAM,eAAe;IACrB,MAAM,YAAY,iBAAiB,OAAO,CAAC;IAC3C,UAAU,SAAS;IACnB,YAAY,SAAS;IACrB;GACF;GACA,KAAK;GACL,KAAK,WAAW;IACd,MAAM,eAAe;IACrB,MAAM,YAAY,iBAAiB,OAAO,EAAE;IAC5C,UAAU,SAAS;IACnB,YAAY,SAAS;IACrB;GACF;GACA,KAAK;IACH,MAAM,eAAe;IACrB,UAAU,aAAa;IACvB,IAAI,iBAAiB,GACnB,YAAY,aAAa;IAE3B;GAEF,KAAK;IACH,MAAM,eAAe;IACrB,IAAI,oBAAoB,GAAG;KACzB,UAAU,gBAAgB;KAC1B,YAAY,gBAAgB;IAC9B;IACA;GAEF,SACE;EACJ;CACF;CAEA,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,WAAW,WAAA,GAAG,gCAAA,QAAO,OAAO,SAAS;EACrC,MAAK;EACL,cAAY;EACZ,mBAAiB;YAEhB,QAAQ,KAAK,KAAK,UACjB,iBAAA,GAAA,kBAAA,IAAA,CAAC,UAAD;GAEE,MAAM,SAAS;IACb,SAAS,QAAQ,SAAS;GAC5B;GACA,MAAK;GACL,MAAK;GACL,gBAAc,IAAI,UAAU;GAC5B,UAAU,IAAI;GACd,UACE,IAAI,WACA,KACA,UAAU,gBACR,IACA;GAER,eAAe;IACb,IAAI,IAAI,UAAU,OAChB,SAAS,IAAI,KAAK;GAEtB;GACA,YAAY,UAAU,cAAc,OAAO,KAAK;GAChD,WAAW,WAAA,GAAG,gCAAA,QAAO,MAAM;aAE3B,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;IAAM,WAAW,gCAAA,QAAO;cAAQ,IAAI;GAAY,CAAA;EAC1C,GAxBD,IAAI,KAwBH,CACT;CACE,CAAA;AAET"}
+{"version":3,"file":"index47.cjs","names":[],"sources":["../src/components/section-header/SectionHeader.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cx } from \"../../utils/cx\";\nimport styles from \"./section-header.module.css\";\n\nexport type SectionHeaderHeadingLevel = 2 | 3 | 4 | 5 | 6;\n\nexport type SectionHeaderProps = Omit<HTMLAttributes<HTMLDivElement>, \"title\"> & {\n  title: ReactNode;\n  description?: ReactNode;\n  actions?: ReactNode;\n  headingLevel?: SectionHeaderHeadingLevel;\n};\n\nexport function SectionHeader({\n  title,\n  description,\n  actions,\n  headingLevel = 2,\n  className,\n  ...rest\n}: SectionHeaderProps) {\n  const Heading = `h${headingLevel}` as `h${SectionHeaderHeadingLevel}`;\n\n  return (\n    <div className={cx(styles.header, className)} {...rest}>\n      <div className={styles.content}>\n        <Heading className={styles.title}>{title}</Heading>\n        {description != null && <div className={styles.description}>{description}</div>}\n      </div>\n      {actions != null && <div className={styles.actions}>{actions}</div>}\n    </div>\n  );\n}\n"],"mappings":";;;;AAaA,SAAgB,cAAc,EAC5B,OACA,aACA,SACA,eAAe,GACf,WACA,GAAG,QACkB;CACrB,MAAM,UAAU,IAAI;CAEpB,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;EAAK,WAAW,WAAA,GAAG,8BAAA,QAAO,QAAQ,SAAS;EAAG,GAAI;YAAlD,CACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;GAAK,WAAW,8BAAA,QAAO;aAAvB,CACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,SAAD;IAAS,WAAW,8BAAA,QAAO;cAAQ;GAAe,CAAA,GACjD,eAAe,QAAQ,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;IAAK,WAAW,8BAAA,QAAO;cAAc;GAAiB,CAAA,CAC3E;MACJ,WAAW,QAAQ,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;GAAK,WAAW,8BAAA,QAAO;aAAU;EAAa,CAAA,CAC/D;;AAET"}

package/dist/index47.js

@@ -1,25 +1,21 @@
-//#region src/components/auth-card/auth-card.module.css
-var authLayout = "uzi-auth-card-module__authLayout__GHr1j";
-var authCard = "uzi-auth-card-module__authCard__ZYYit";
-var authBrand = "uzi-auth-card-module__authBrand__ZCDVm";
-var authHeader = "uzi-auth-card-module__authHeader__NB6UQ";
-var authTitle = "uzi-auth-card-module__authTitle__VtHLn";
-var authSubtitle = "uzi-auth-card-module__authSubtitle__ZupId";
-var authBody = "uzi-auth-card-module__authBody__PTyaL";
-var divider = "uzi-auth-card-module__divider__D8r12";
-var authFooter = "uzi-auth-card-module__authFooter__C5s--";
-var auth_card_module_default = {
-	authLayout,
-	authCard,
-	authBrand,
-	authHeader,
-	authTitle,
-	authSubtitle,
-	authBody,
-	divider,
-	authFooter
+//#region src/components/empty-state/empty-state.module.css
+var root = "uzi-empty-state-module__root__UNTr-";
+var compact = "uzi-empty-state-module__compact__eStzZ";
+var visual = "uzi-empty-state-module__visual__4yzn6";
+var content = "uzi-empty-state-module__content__lZQTI";
+var title = "uzi-empty-state-module__title__Aoaqa";
+var description = "uzi-empty-state-module__description__muQc4";
+var actions = "uzi-empty-state-module__actions__511Kv";
+var empty_state_module_default = {
+	root,
+	compact,
+	visual,
+	content,
+	title,
+	description,
+	actions
 };
 //#endregion
-export { authBody, authBrand, authCard, authFooter, authHeader, authLayout, authSubtitle, authTitle, auth_card_module_default as default, divider };
+export { actions, compact, content, empty_state_module_default as default, description, root, title, visual };
 
 //# sourceMappingURL=index47.js.map

package/dist/index47.js.map

@@ -1 +1 @@
-{"version":3,"file":"index47.js","names":[],"sources":["../src/components/auth-card/auth-card.module.css"],"sourcesContent":[".authLayout {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-height: 100vh;\n  min-height: 100dvh;\n  padding: 24px;\n  background: var(--background);\n}\n\n.authCard {\n  width: 100%;\n  max-width: 400px;\n  border-radius: var(--ts-card-radius, 12px);\n  border: 1px solid var(--ts-card-border, var(--border));\n  background: var(--ts-card-bg, var(--card));\n  color: var(--ts-card-fg, var(--foreground));\n  box-shadow: var(--ts-card-shadow, 0 16px 36px rgba(0, 0, 0, 0.28));\n  padding: 24px;\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n}\n\n.authBrand {\n  display: flex;\n  justify-content: center;\n  margin-bottom: 8px;\n}\n\n.authBrand svg {\n  width: 40px;\n  height: 40px;\n  color: var(--primary);\n}\n\n.authHeader {\n  text-align: center;\n}\n\n.authTitle {\n  font-size: 1.25rem;\n  font-weight: 600;\n  line-height: 1.4;\n  margin: 0;\n  color: var(--foreground);\n}\n\n.authSubtitle {\n  font-size: 0.875rem;\n  color: var(--muted-foreground);\n  margin-top: 8px;\n  margin-bottom: 0;\n  line-height: 1.4;\n}\n\n.authBody {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n}\n\n.divider {\n  border: none;\n  border-top: 1px solid var(--border);\n  margin: 0;\n}\n\n.authFooter {\n  text-align: center;\n  font-size: 0.875rem;\n  color: var(--muted-foreground);\n  margin: 0;\n}\n\n.authFooter a {\n  color: var(--primary);\n  text-decoration: none;\n  font-weight: 500;\n}\n\n.authFooter a:hover {\n  text-decoration: underline;\n}\n"],"mappings":""}
+{"version":3,"file":"index47.js","names":[],"sources":["../src/components/empty-state/empty-state.module.css"],"sourcesContent":[".root {\n  display: grid;\n  place-items: center;\n  gap: 1rem;\n  padding: clamp(2rem, 6vw, 4rem) 1.5rem;\n  text-align: center;\n}\n\n.compact {\n  padding-block: 1.5rem;\n}\n\n.visual {\n  display: grid;\n  place-items: center;\n  color: var(--muted-foreground);\n  font-size: 2rem;\n}\n\n.content {\n  display: grid;\n  gap: 0.5rem;\n  max-width: 34rem;\n}\n\n.title {\n  margin: 0;\n  color: var(--foreground);\n  font-size: 1.25rem;\n  line-height: 1.25;\n}\n\n.description {\n  color: var(--muted-foreground);\n  font-size: 0.9rem;\n  line-height: 1.65;\n}\n\n.actions {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  justify-content: center;\n  gap: 0.625rem;\n}\n"],"mappings":""}

package/dist/index48.cjs

@@ -1,34 +1,28 @@
-//#region src/components/auth-card/auth-card.module.css
-var authLayout = "uzi-auth-card-module__authLayout__GHr1j";
-var authCard = "uzi-auth-card-module__authCard__ZYYit";
-var authBrand = "uzi-auth-card-module__authBrand__ZCDVm";
-var authHeader = "uzi-auth-card-module__authHeader__NB6UQ";
-var authTitle = "uzi-auth-card-module__authTitle__VtHLn";
-var authSubtitle = "uzi-auth-card-module__authSubtitle__ZupId";
-var authBody = "uzi-auth-card-module__authBody__PTyaL";
-var divider = "uzi-auth-card-module__divider__D8r12";
-var authFooter = "uzi-auth-card-module__authFooter__C5s--";
-var auth_card_module_default = {
-	authLayout,
-	authCard,
-	authBrand,
-	authHeader,
-	authTitle,
-	authSubtitle,
-	authBody,
-	divider,
-	authFooter
+//#region src/components/empty-state/empty-state.module.css
+var root = "uzi-empty-state-module__root__UNTr-";
+var compact = "uzi-empty-state-module__compact__eStzZ";
+var visual = "uzi-empty-state-module__visual__4yzn6";
+var content = "uzi-empty-state-module__content__lZQTI";
+var title = "uzi-empty-state-module__title__Aoaqa";
+var description = "uzi-empty-state-module__description__muQc4";
+var actions = "uzi-empty-state-module__actions__511Kv";
+var empty_state_module_default = {
+	root,
+	compact,
+	visual,
+	content,
+	title,
+	description,
+	actions
 };
 //#endregion
-exports.authBody = authBody;
-exports.authBrand = authBrand;
-exports.authCard = authCard;
-exports.authFooter = authFooter;
-exports.authHeader = authHeader;
-exports.authLayout = authLayout;
-exports.authSubtitle = authSubtitle;
-exports.authTitle = authTitle;
-exports.default = auth_card_module_default;
-exports.divider = divider;
+exports.actions = actions;
+exports.compact = compact;
+exports.content = content;
+exports.default = empty_state_module_default;
+exports.description = description;
+exports.root = root;
+exports.title = title;
+exports.visual = visual;
 
 //# sourceMappingURL=index48.cjs.map

package/dist/index48.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index48.cjs","names":[],"sources":["../src/components/auth-card/auth-card.module.css"],"sourcesContent":[".authLayout {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-height: 100vh;\n  min-height: 100dvh;\n  padding: 24px;\n  background: var(--background);\n}\n\n.authCard {\n  width: 100%;\n  max-width: 400px;\n  border-radius: var(--ts-card-radius, 12px);\n  border: 1px solid var(--ts-card-border, var(--border));\n  background: var(--ts-card-bg, var(--card));\n  color: var(--ts-card-fg, var(--foreground));\n  box-shadow: var(--ts-card-shadow, 0 16px 36px rgba(0, 0, 0, 0.28));\n  padding: 24px;\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n}\n\n.authBrand {\n  display: flex;\n  justify-content: center;\n  margin-bottom: 8px;\n}\n\n.authBrand svg {\n  width: 40px;\n  height: 40px;\n  color: var(--primary);\n}\n\n.authHeader {\n  text-align: center;\n}\n\n.authTitle {\n  font-size: 1.25rem;\n  font-weight: 600;\n  line-height: 1.4;\n  margin: 0;\n  color: var(--foreground);\n}\n\n.authSubtitle {\n  font-size: 0.875rem;\n  color: var(--muted-foreground);\n  margin-top: 8px;\n  margin-bottom: 0;\n  line-height: 1.4;\n}\n\n.authBody {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n}\n\n.divider {\n  border: none;\n  border-top: 1px solid var(--border);\n  margin: 0;\n}\n\n.authFooter {\n  text-align: center;\n  font-size: 0.875rem;\n  color: var(--muted-foreground);\n  margin: 0;\n}\n\n.authFooter a {\n  color: var(--primary);\n  text-decoration: none;\n  font-weight: 500;\n}\n\n.authFooter a:hover {\n  text-decoration: underline;\n}\n"],"mappings":""}
+{"version":3,"file":"index48.cjs","names":[],"sources":["../src/components/empty-state/empty-state.module.css"],"sourcesContent":[".root {\n  display: grid;\n  place-items: center;\n  gap: 1rem;\n  padding: clamp(2rem, 6vw, 4rem) 1.5rem;\n  text-align: center;\n}\n\n.compact {\n  padding-block: 1.5rem;\n}\n\n.visual {\n  display: grid;\n  place-items: center;\n  color: var(--muted-foreground);\n  font-size: 2rem;\n}\n\n.content {\n  display: grid;\n  gap: 0.5rem;\n  max-width: 34rem;\n}\n\n.title {\n  margin: 0;\n  color: var(--foreground);\n  font-size: 1.25rem;\n  line-height: 1.25;\n}\n\n.description {\n  color: var(--muted-foreground);\n  font-size: 0.9rem;\n  line-height: 1.65;\n}\n\n.actions {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  justify-content: center;\n  gap: 0.625rem;\n}\n"],"mappings":""}