@sbkbs/ui 1.0.3 → 1.0.4

package/dist/components/Combobox/Combobox.js

@@ -0,0 +1,143 @@
+import { jsxs as $, jsx as t } from "react/jsx-runtime";
+import { useState as w, useRef as y, useEffect as R } from "react";
+import { cn as c } from "../../utils/cn.js";
+const S = ({
+  label: g,
+  helperText: m,
+  error: o,
+  options: v,
+  value: f,
+  onChange: p,
+  placeholder: z = "Selecione ou pesquise...",
+  disabled: E = !1,
+  className: L
+}) => {
+  const [b, u] = w(""), [n, s] = w(!1), [l, i] = w(-1), x = y(null), N = y(null), I = y(null), h = v.find((e) => e.value === f), d = b ? v.filter((e) => e.label.toLowerCase().includes(b.toLowerCase())) : v, M = n ? b : (h == null ? void 0 : h.label) ?? "";
+  R(() => {
+    const e = (r) => {
+      x.current && !x.current.contains(r.target) && (s(!1), u(""));
+    };
+    return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
+  }, []);
+  const k = (e) => {
+    var r;
+    p == null || p(e.value), u(""), s(!1), (r = N.current) == null || r.blur();
+  }, A = (e) => {
+    if (!n) {
+      (e.key === "ArrowDown" || e.key === "Enter") && (s(!0), i(0), e.preventDefault());
+      return;
+    }
+    e.key === "ArrowDown" ? (e.preventDefault(), i((r) => Math.min(r + 1, d.length - 1))) : e.key === "ArrowUp" ? (e.preventDefault(), i((r) => Math.max(r - 1, 0))) : e.key === "Enter" ? (e.preventDefault(), l >= 0 && d[l] && k(d[l])) : e.key === "Escape" && (s(!1), u(""));
+  }, a = `combobox-${Math.random().toString(36).slice(2, 9)}`, D = `${a}-list`;
+  return /* @__PURE__ */ $("div", { className: c("flex flex-col gap-[var(--spacing-xs)]", L), ref: x, children: [
+    g && /* @__PURE__ */ t(
+      "label",
+      {
+        className: "text-[var(--font-size-sm)] font-[var(--font-weight-semibold)] text-[var(--md-on-surface)]",
+        htmlFor: a,
+        children: g
+      }
+    ),
+    /* @__PURE__ */ $("div", { className: "relative", children: [
+      /* @__PURE__ */ t(
+        "input",
+        {
+          ref: N,
+          "aria-activedescendant": l >= 0 ? `${a}-option-${l}` : void 0,
+          "aria-autocomplete": "list",
+          "aria-controls": D,
+          "aria-describedby": o ? `${a}-error` : m ? `${a}-helper` : void 0,
+          "aria-expanded": n,
+          "aria-invalid": o ? !0 : void 0,
+          autoComplete: "off",
+          className: c(
+            "w-full rounded-[var(--border-radius-md)] border border-[var(--md-outline-variant)] bg-[var(--md-surface)] px-3.5 py-2 text-[var(--font-size-base)] text-[var(--md-on-surface)] outline-none transition placeholder:text-[var(--md-on-surface-variant)] placeholder:opacity-70 focus:border-[var(--border-color-focus)] focus:[box-shadow:0_0_0_0.1875rem_rgba(47,93,140,0.15)] disabled:cursor-not-allowed disabled:opacity-60",
+            o && "border-[var(--md-error)]"
+          ),
+          disabled: E,
+          id: a,
+          placeholder: z,
+          role: "combobox",
+          type: "text",
+          value: M,
+          onChange: (e) => {
+            u(e.target.value), s(!0), i(0);
+          },
+          onFocus: () => s(!0),
+          onKeyDown: A
+        }
+      ),
+      /* @__PURE__ */ t(
+        "span",
+        {
+          "aria-hidden": "true",
+          className: c(
+            "pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 text-[var(--text-muted)] transition",
+            n && "rotate-180"
+          ),
+          children: /* @__PURE__ */ t(
+            "svg",
+            {
+              className: "h-4 w-4",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "2",
+              viewBox: "0 0 24 24",
+              children: /* @__PURE__ */ t("path", { d: "m6 9 6 6 6-6", strokeLinecap: "round", strokeLinejoin: "round" })
+            }
+          )
+        }
+      ),
+      n && d.length > 0 && /* @__PURE__ */ t(
+        "ul",
+        {
+          ref: I,
+          className: "absolute z-[var(--z-index-dropdown)] mt-1 max-h-60 w-full overflow-auto rounded-[var(--border-radius-md)] border border-[var(--md-outline-variant)] bg-[var(--md-surface)] py-1 shadow-[var(--shadow-md)]",
+          id: D,
+          role: "listbox",
+          children: d.map((e, r) => /* @__PURE__ */ t(
+            "li",
+            {
+              "aria-selected": e.value === f,
+              className: c(
+                "cursor-pointer px-3.5 py-2 text-sm transition",
+                r === l ? "bg-[var(--md-primary)] text-[var(--md-on-primary)]" : e.value === f ? "bg-[var(--bg-tertiary)] text-[var(--text-primary)]" : "text-[var(--text-primary)] hover:bg-[var(--bg-hover)]"
+              ),
+              id: `${a}-option-${r}`,
+              role: "option",
+              onMouseDown: (C) => {
+                C.preventDefault(), k(e);
+              },
+              onMouseEnter: () => i(r),
+              children: e.label
+            },
+            e.value
+          ))
+        }
+      ),
+      n && d.length === 0 && /* @__PURE__ */ t("div", { className: "absolute z-[var(--z-index-dropdown)] mt-1 w-full rounded-[var(--border-radius-md)] border border-[var(--md-outline-variant)] bg-[var(--md-surface)] px-3.5 py-3 text-sm text-[var(--text-muted)] shadow-[var(--shadow-md)]", children: "Nenhum resultado encontrado." })
+    ] }),
+    o && /* @__PURE__ */ t(
+      "span",
+      {
+        className: "text-[var(--font-size-xs)] text-[var(--md-error)]",
+        id: `${a}-error`,
+        role: "alert",
+        children: o
+      }
+    ),
+    m && !o && /* @__PURE__ */ t(
+      "span",
+      {
+        className: "text-[var(--font-size-xs)] text-[var(--md-on-surface-variant)]",
+        id: `${a}-helper`,
+        children: m
+      }
+    )
+  ] });
+};
+S.displayName = "Combobox";
+export {
+  S as Combobox
+};
+//# sourceMappingURL=Combobox.js.map

package/dist/components/Combobox/Combobox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Combobox.js","sources":["../../../src/components/Combobox/Combobox.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { cn } from '../../utils/cn';\n\nexport interface ComboboxOption {\n  label: string;\n  value: string;\n}\n\nexport interface ComboboxProps {\n  className?: string;\n  disabled?: boolean;\n  error?: string;\n  helperText?: string;\n  label?: string;\n  onChange?: (value: string) => void;\n  options: ComboboxOption[];\n  placeholder?: string;\n  value?: string;\n}\n\nexport const Combobox: React.FC<ComboboxProps> = ({\n  label,\n  helperText,\n  error,\n  options,\n  value,\n  onChange,\n  placeholder = 'Selecione ou pesquise...',\n  disabled = false,\n  className,\n}) => {\n  const [query, setQuery] = useState('');\n  const [isOpen, setIsOpen] = useState(false);\n  const [activeIndex, setActiveIndex] = useState(-1);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const inputRef = useRef<HTMLInputElement>(null);\n  const listRef = useRef<HTMLUListElement>(null);\n\n  const selectedOption = options.find((o) => o.value === value);\n\n  const filtered = query\n    ? options.filter((o) => o.label.toLowerCase().includes(query.toLowerCase()))\n    : options;\n\n  const displayValue = isOpen ? query : (selectedOption?.label ?? '');\n\n  // Fechar ao clicar fora\n  useEffect(() => {\n    const handleClickOutside = (e: MouseEvent) => {\n      if (containerRef.current && !containerRef.current.contains(e.target as Node)) {\n        setIsOpen(false);\n        setQuery('');\n      }\n    };\n    document.addEventListener('mousedown', handleClickOutside);\n    return () => document.removeEventListener('mousedown', handleClickOutside);\n  }, []);\n\n  const handleSelect = (option: ComboboxOption) => {\n    onChange?.(option.value);\n    setQuery('');\n    setIsOpen(false);\n    inputRef.current?.blur();\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    if (!isOpen) {\n      if (e.key === 'ArrowDown' || e.key === 'Enter') {\n        setIsOpen(true);\n        setActiveIndex(0);\n        e.preventDefault();\n      }\n      return;\n    }\n\n    if (e.key === 'ArrowDown') {\n      e.preventDefault();\n      setActiveIndex((i) => Math.min(i + 1, filtered.length - 1));\n    } else if (e.key === 'ArrowUp') {\n      e.preventDefault();\n      setActiveIndex((i) => Math.max(i - 1, 0));\n    } else if (e.key === 'Enter') {\n      e.preventDefault();\n      if (activeIndex >= 0 && filtered[activeIndex]) {\n        handleSelect(filtered[activeIndex]);\n      }\n    } else if (e.key === 'Escape') {\n      setIsOpen(false);\n      setQuery('');\n    }\n  };\n\n  const inputId = `combobox-${Math.random().toString(36).slice(2, 9)}`;\n  const listId = `${inputId}-list`;\n\n  return (\n    <div className={cn('flex flex-col gap-[var(--spacing-xs)]', className)} ref={containerRef}>\n      {label && (\n        <label\n          className=\"text-[var(--font-size-sm)] font-[var(--font-weight-semibold)] text-[var(--md-on-surface)]\"\n          htmlFor={inputId}\n        >\n          {label}\n        </label>\n      )}\n      <div className=\"relative\">\n        <input\n          ref={inputRef}\n          aria-activedescendant={activeIndex >= 0 ? `${inputId}-option-${activeIndex}` : undefined}\n          aria-autocomplete=\"list\"\n          aria-controls={listId}\n          aria-describedby={\n            error ? `${inputId}-error` : helperText ? `${inputId}-helper` : undefined\n          }\n          aria-expanded={isOpen}\n          aria-invalid={error ? true : undefined}\n          autoComplete=\"off\"\n          className={cn(\n            'w-full rounded-[var(--border-radius-md)] border border-[var(--md-outline-variant)] bg-[var(--md-surface)] px-3.5 py-2 text-[var(--font-size-base)] text-[var(--md-on-surface)] outline-none transition placeholder:text-[var(--md-on-surface-variant)] placeholder:opacity-70 focus:border-[var(--border-color-focus)] focus:[box-shadow:0_0_0_0.1875rem_rgba(47,93,140,0.15)] disabled:cursor-not-allowed disabled:opacity-60',\n            error && 'border-[var(--md-error)]',\n          )}\n          disabled={disabled}\n          id={inputId}\n          placeholder={placeholder}\n          role=\"combobox\"\n          type=\"text\"\n          value={displayValue}\n          onChange={(e) => {\n            setQuery(e.target.value);\n            setIsOpen(true);\n            setActiveIndex(0);\n          }}\n          onFocus={() => setIsOpen(true)}\n          onKeyDown={handleKeyDown}\n        />\n        {/* Chevron */}\n        <span\n          aria-hidden=\"true\"\n          className={cn(\n            'pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 text-[var(--text-muted)] transition',\n            isOpen && 'rotate-180',\n          )}\n        >\n          <svg\n            className=\"h-4 w-4\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeWidth=\"2\"\n            viewBox=\"0 0 24 24\"\n          >\n            <path d=\"m6 9 6 6 6-6\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n          </svg>\n        </span>\n\n        {/* Dropdown */}\n        {isOpen && filtered.length > 0 && (\n          <ul\n            ref={listRef}\n            className=\"absolute z-[var(--z-index-dropdown)] mt-1 max-h-60 w-full overflow-auto rounded-[var(--border-radius-md)] border border-[var(--md-outline-variant)] bg-[var(--md-surface)] py-1 shadow-[var(--shadow-md)]\"\n            id={listId}\n            role=\"listbox\"\n          >\n            {filtered.map((option, index) => (\n              <li\n                aria-selected={option.value === value}\n                className={cn(\n                  'cursor-pointer px-3.5 py-2 text-sm transition',\n                  index === activeIndex\n                    ? 'bg-[var(--md-primary)] text-[var(--md-on-primary)]'\n                    : option.value === value\n                      ? 'bg-[var(--bg-tertiary)] text-[var(--text-primary)]'\n                      : 'text-[var(--text-primary)] hover:bg-[var(--bg-hover)]',\n                )}\n                id={`${inputId}-option-${index}`}\n                key={option.value}\n                role=\"option\"\n                onMouseDown={(e) => {\n                  e.preventDefault();\n                  handleSelect(option);\n                }}\n                onMouseEnter={() => setActiveIndex(index)}\n              >\n                {option.label}\n              </li>\n            ))}\n          </ul>\n        )}\n        {isOpen && filtered.length === 0 && (\n          <div className=\"absolute z-[var(--z-index-dropdown)] mt-1 w-full rounded-[var(--border-radius-md)] border border-[var(--md-outline-variant)] bg-[var(--md-surface)] px-3.5 py-3 text-sm text-[var(--text-muted)] shadow-[var(--shadow-md)]\">\n            Nenhum resultado encontrado.\n          </div>\n        )}\n      </div>\n      {error && (\n        <span\n          className=\"text-[var(--font-size-xs)] text-[var(--md-error)]\"\n          id={`${inputId}-error`}\n          role=\"alert\"\n        >\n          {error}\n        </span>\n      )}\n      {helperText && !error && (\n        <span\n          className=\"text-[var(--font-size-xs)] text-[var(--md-on-surface-variant)]\"\n          id={`${inputId}-helper`}\n        >\n          {helperText}\n        </span>\n      )}\n    </div>\n  );\n};\n\nCombobox.displayName = 'Combobox';\n"],"names":["Combobox","label","helperText","error","options","value","onChange","placeholder","disabled","className","query","setQuery","useState","isOpen","setIsOpen","activeIndex","setActiveIndex","containerRef","useRef","inputRef","listRef","selectedOption","o","filtered","displayValue","useEffect","handleClickOutside","e","handleSelect","option","_a","handleKeyDown","i","inputId","listId","jsxs","cn","jsx","index"],"mappings":"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"}

package/dist/components/Combobox/Combobox.stories.d.ts

@@ -0,0 +1,9 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { Combobox } from './Combobox';
+declare const meta: Meta<typeof Combobox>;
+export default meta;
+type Story = StoryObj<typeof Combobox>;
+export declare const Playground: Story;
+export declare const Controlled: Story;
+export declare const WithError: Story;
+export declare const Disabled: Story;

package/dist/components/Divider/Divider.js

@@ -0,0 +1,22 @@
+import { jsx as t } from "react/jsx-runtime";
+import { cn as a } from "../../utils/cn.js";
+const p = ({
+  orientation: r = "horizontal",
+  className: o,
+  ...l
+}) => /* @__PURE__ */ t(
+  "div",
+  {
+    className: a(
+      "bg-[var(--border-color)]",
+      r === "horizontal" ? "h-px w-full" : "h-full w-px",
+      o
+    ),
+    role: "separator",
+    ...l
+  }
+);
+export {
+  p as Divider
+};
+//# sourceMappingURL=Divider.js.map

package/dist/components/Divider/Divider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Divider.js","sources":["../../../src/components/Divider/Divider.tsx"],"sourcesContent":["import type React from 'react';\nimport { cn } from '../../utils/cn';\n\nexport interface DividerProps extends React.HTMLAttributes<HTMLDivElement> {\n  orientation?: 'horizontal' | 'vertical';\n}\n\nexport const Divider: React.FC<DividerProps> = ({\n  orientation = 'horizontal',\n  className,\n  ...props\n}) => {\n  return (\n    <div\n      className={cn(\n        'bg-[var(--border-color)]',\n        orientation === 'horizontal' ? 'h-px w-full' : 'h-full w-px',\n        className,\n      )}\n      role=\"separator\"\n      {...props}\n    />\n  );\n};\n"],"names":["Divider","orientation","className","props","jsx","cn"],"mappings":";;AAOO,MAAMA,IAAkC,CAAC;AAAA,EAC9C,aAAAC,IAAc;AAAA,EACd,WAAAC;AAAA,EACA,GAAGC;AACL,MAEI,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC;AAAA,MACT;AAAA,MACAJ,MAAgB,eAAe,gBAAgB;AAAA,MAC/CC;AAAA,IAAA;AAAA,IAEF,MAAK;AAAA,IACJ,GAAGC;AAAA,EAAA;AAAA;"}

package/dist/components/EmptyState/EmptyState.js

@@ -0,0 +1,29 @@
+import { jsxs as o, jsx as e } from "react/jsx-runtime";
+import { cn as c } from "../../utils/cn.js";
+const i = ({
+  icon: r,
+  title: d,
+  description: t,
+  action: a,
+  className: s,
+  ...m
+}) => /* @__PURE__ */ o(
+  "div",
+  {
+    className: c(
+      "grid justify-items-center gap-3 rounded-[var(--border-radius-lg)] border border-dashed border-[var(--border-color)] bg-[var(--bg-secondary)] p-6 text-center",
+      s
+    ),
+    ...m,
+    children: [
+      r && /* @__PURE__ */ e("div", { className: "text-[var(--text-muted)]", children: r }),
+      /* @__PURE__ */ e("h3", { className: "m-0 text-lg font-semibold text-[var(--text-primary)]", children: d }),
+      t && /* @__PURE__ */ e("p", { className: "m-0 max-w-[30rem] text-sm text-[var(--text-secondary)]", children: t }),
+      a && /* @__PURE__ */ e("div", { className: "mt-1", children: a })
+    ]
+  }
+);
+export {
+  i as EmptyState
+};
+//# sourceMappingURL=EmptyState.js.map

package/dist/components/EmptyState/EmptyState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyState.js","sources":["../../../src/components/EmptyState/EmptyState.tsx"],"sourcesContent":["import type React from 'react';\nimport { cn } from '../../utils/cn';\n\nexport interface EmptyStateProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {\n  action?: React.ReactNode;\n  description?: React.ReactNode;\n  icon?: React.ReactNode;\n  title: React.ReactNode;\n}\n\nexport const EmptyState: React.FC<EmptyStateProps> = ({\n  icon,\n  title,\n  description,\n  action,\n  className,\n  ...props\n}) => {\n  return (\n    <div\n      className={cn(\n        'grid justify-items-center gap-3 rounded-[var(--border-radius-lg)] border border-dashed border-[var(--border-color)] bg-[var(--bg-secondary)] p-6 text-center',\n        className,\n      )}\n      {...props}\n    >\n      {icon && <div className=\"text-[var(--text-muted)]\">{icon}</div>}\n      <h3 className=\"m-0 text-lg font-semibold text-[var(--text-primary)]\">{title}</h3>\n      {description && (\n        <p className=\"m-0 max-w-[30rem] text-sm text-[var(--text-secondary)]\">{description}</p>\n      )}\n      {action && <div className=\"mt-1\">{action}</div>}\n    </div>\n  );\n};\n"],"names":["EmptyState","icon","title","description","action","className","props","jsxs","cn","jsx"],"mappings":";;AAUO,MAAMA,IAAwC,CAAC;AAAA,EACpD,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACL,MAEI,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC;AAAA,MACT;AAAA,MACAH;AAAA,IAAA;AAAA,IAED,GAAGC;AAAA,IAEH,UAAA;AAAA,MAAAL,KAAQ,gBAAAQ,EAAC,OAAA,EAAI,WAAU,4BAA4B,UAAAR,GAAK;AAAA,MACzD,gBAAAQ,EAAC,MAAA,EAAG,WAAU,wDAAwD,UAAAP,GAAM;AAAA,MAC3EC,KACC,gBAAAM,EAAC,KAAA,EAAE,WAAU,0DAA0D,UAAAN,GAAY;AAAA,MAEpFC,KAAU,gBAAAK,EAAC,OAAA,EAAI,WAAU,QAAQ,UAAAL,EAAA,CAAO;AAAA,IAAA;AAAA,EAAA;AAAA;"}

package/dist/components/FileUpload/FileUpload.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+export interface FileUploadProps {
+    accept?: string;
+    className?: string;
+    disabled?: boolean;
+    error?: string;
+    helperText?: string;
+    label?: string;
+    maxSizeBytes?: number;
+    multiple?: boolean;
+    onChange?: (files: File[]) => void;
+}
+export declare const FileUpload: React.FC<FileUploadProps>;

package/dist/components/FileUpload/FileUpload.js

@@ -0,0 +1,116 @@
+import { jsxs as a, jsx as t } from "react/jsx-runtime";
+import { useRef as q, useState as h } from "react";
+import { cn as g } from "../../utils/cn.js";
+const E = ({
+  label: v,
+  helperText: f,
+  error: y,
+  accept: i,
+  multiple: D = !1,
+  maxSizeBytes: n,
+  disabled: e = !1,
+  onChange: l,
+  className: N
+}) => {
+  const c = q(null), [b, d] = h(!1), [k, u] = h(null), p = (r) => {
+    if (!r) return;
+    const o = Array.from(r);
+    if (n) {
+      const x = o.find((m) => m.size > n);
+      if (x) {
+        const m = (n / 1024 / 1024).toFixed(0);
+        u(`Arquivo "${x.name}" excede o tamanho máximo de ${m} MB.`);
+        return;
+      }
+    }
+    u(null), l == null || l(o);
+  }, w = (r) => {
+    r.preventDefault(), e || d(!0);
+  }, F = () => d(!1), A = (r) => {
+    r.preventDefault(), d(!1), e || p(r.dataTransfer.files);
+  }, j = (r) => {
+    var o;
+    (r.key === "Enter" || r.key === " ") && (r.preventDefault(), (o = c.current) == null || o.click());
+  }, s = y ?? k;
+  return /* @__PURE__ */ a("div", { className: g("flex flex-col gap-[var(--spacing-xs)]", N), children: [
+    v && /* @__PURE__ */ t("span", { className: "text-[var(--font-size-sm)] font-[var(--font-weight-semibold)] text-[var(--md-on-surface)]", children: v }),
+    /* @__PURE__ */ a(
+      "div",
+      {
+        "aria-disabled": e,
+        className: g(
+          "flex cursor-pointer flex-col items-center justify-center gap-2 rounded-[var(--border-radius-lg)] border-2 border-dashed p-8 text-center transition",
+          b ? "border-[var(--md-primary)] bg-[var(--md-primary-container)]" : "border-[var(--md-outline-variant)] hover:border-[var(--md-primary)] hover:bg-[var(--bg-tertiary)]",
+          s && "border-[var(--md-error)]",
+          e && "pointer-events-none cursor-not-allowed opacity-60"
+        ),
+        onClick: () => {
+          var r;
+          return !e && ((r = c.current) == null ? void 0 : r.click());
+        },
+        onDragLeave: F,
+        onDragOver: w,
+        onDrop: A,
+        onKeyDown: j,
+        role: "button",
+        tabIndex: e ? -1 : 0,
+        children: [
+          /* @__PURE__ */ t(
+            "svg",
+            {
+              className: "h-8 w-8 text-[var(--md-primary)]",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "1.5",
+              viewBox: "0 0 24 24",
+              children: /* @__PURE__ */ t(
+                "path",
+                {
+                  d: "M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5m-13.5-9L12 3m0 0 4.5 4.5M12 3v13.5",
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round"
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ a("div", { children: [
+            /* @__PURE__ */ a("p", { className: "text-sm font-medium text-[var(--text-primary)]", children: [
+              "Arraste arquivos aqui ou",
+              " ",
+              /* @__PURE__ */ t("span", { className: "text-[var(--md-primary)] underline", children: "clique para selecionar" })
+            ] }),
+            i && /* @__PURE__ */ a("p", { className: "mt-0.5 text-xs text-[var(--text-muted)]", children: [
+              "Formatos aceitos: ",
+              i
+            ] }),
+            n && /* @__PURE__ */ a("p", { className: "text-xs text-[var(--text-muted)]", children: [
+              "Tamanho máximo: ",
+              (n / 1024 / 1024).toFixed(0),
+              " MB"
+            ] })
+          ] })
+        ]
+      }
+    ),
+    /* @__PURE__ */ t(
+      "input",
+      {
+        ref: c,
+        accept: i,
+        className: "sr-only",
+        disabled: e,
+        multiple: D,
+        tabIndex: -1,
+        type: "file",
+        onChange: (r) => p(r.target.files)
+      }
+    ),
+    s && /* @__PURE__ */ t("span", { className: "text-[var(--font-size-xs)] text-[var(--md-error)]", role: "alert", children: s }),
+    f && !s && /* @__PURE__ */ t("span", { className: "text-[var(--font-size-xs)] text-[var(--md-on-surface-variant)]", children: f })
+  ] });
+};
+E.displayName = "FileUpload";
+export {
+  E as FileUpload
+};
+//# sourceMappingURL=FileUpload.js.map

package/dist/components/FileUpload/FileUpload.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileUpload.js","sources":["../../../src/components/FileUpload/FileUpload.tsx"],"sourcesContent":["import React, { useRef, useState } from 'react';\nimport { cn } from '../../utils/cn';\n\nexport interface FileUploadProps {\n  accept?: string;\n  className?: string;\n  disabled?: boolean;\n  error?: string;\n  helperText?: string;\n  label?: string;\n  maxSizeBytes?: number;\n  multiple?: boolean;\n  onChange?: (files: File[]) => void;\n}\n\nexport const FileUpload: React.FC<FileUploadProps> = ({\n  label,\n  helperText,\n  error,\n  accept,\n  multiple = false,\n  maxSizeBytes,\n  disabled = false,\n  onChange,\n  className,\n}) => {\n  const inputRef = useRef<HTMLInputElement>(null);\n  const [isDragging, setIsDragging] = useState(false);\n  const [sizeError, setSizeError] = useState<string | null>(null);\n\n  const handleFiles = (fileList: FileList | null) => {\n    if (!fileList) return;\n    const files = Array.from(fileList);\n\n    if (maxSizeBytes) {\n      const oversized = files.find((f) => f.size > maxSizeBytes);\n      if (oversized) {\n        const mb = (maxSizeBytes / 1024 / 1024).toFixed(0);\n        setSizeError(`Arquivo \"${oversized.name}\" excede o tamanho máximo de ${mb} MB.`);\n        return;\n      }\n    }\n\n    setSizeError(null);\n    onChange?.(files);\n  };\n\n  const handleDragOver = (e: React.DragEvent) => {\n    e.preventDefault();\n    if (!disabled) setIsDragging(true);\n  };\n\n  const handleDragLeave = () => setIsDragging(false);\n\n  const handleDrop = (e: React.DragEvent) => {\n    e.preventDefault();\n    setIsDragging(false);\n    if (!disabled) handleFiles(e.dataTransfer.files);\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      inputRef.current?.click();\n    }\n  };\n\n  const displayError = error ?? sizeError;\n\n  return (\n    <div className={cn('flex flex-col gap-[var(--spacing-xs)]', className)}>\n      {label && (\n        <span className=\"text-[var(--font-size-sm)] font-[var(--font-weight-semibold)] text-[var(--md-on-surface)]\">\n          {label}\n        </span>\n      )}\n      <div\n        aria-disabled={disabled}\n        className={cn(\n          'flex cursor-pointer flex-col items-center justify-center gap-2 rounded-[var(--border-radius-lg)] border-2 border-dashed p-8 text-center transition',\n          isDragging\n            ? 'border-[var(--md-primary)] bg-[var(--md-primary-container)]'\n            : 'border-[var(--md-outline-variant)] hover:border-[var(--md-primary)] hover:bg-[var(--bg-tertiary)]',\n          displayError && 'border-[var(--md-error)]',\n          disabled && 'pointer-events-none cursor-not-allowed opacity-60',\n        )}\n        onClick={() => !disabled && inputRef.current?.click()}\n        onDragLeave={handleDragLeave}\n        onDragOver={handleDragOver}\n        onDrop={handleDrop}\n        onKeyDown={handleKeyDown}\n        role=\"button\"\n        tabIndex={disabled ? -1 : 0}\n      >\n        {/* Upload icon */}\n        <svg\n          className=\"h-8 w-8 text-[var(--md-primary)]\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          strokeWidth=\"1.5\"\n          viewBox=\"0 0 24 24\"\n        >\n          <path\n            d=\"M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5m-13.5-9L12 3m0 0 4.5 4.5M12 3v13.5\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n          />\n        </svg>\n        <div>\n          <p className=\"text-sm font-medium text-[var(--text-primary)]\">\n            Arraste arquivos aqui ou{' '}\n            <span className=\"text-[var(--md-primary)] underline\">clique para selecionar</span>\n          </p>\n          {accept && (\n            <p className=\"mt-0.5 text-xs text-[var(--text-muted)]\">Formatos aceitos: {accept}</p>\n          )}\n          {maxSizeBytes && (\n            <p className=\"text-xs text-[var(--text-muted)]\">\n              Tamanho máximo: {(maxSizeBytes / 1024 / 1024).toFixed(0)} MB\n            </p>\n          )}\n        </div>\n      </div>\n      <input\n        ref={inputRef}\n        accept={accept}\n        className=\"sr-only\"\n        disabled={disabled}\n        multiple={multiple}\n        tabIndex={-1}\n        type=\"file\"\n        onChange={(e) => handleFiles(e.target.files)}\n      />\n      {displayError && (\n        <span className=\"text-[var(--font-size-xs)] text-[var(--md-error)]\" role=\"alert\">\n          {displayError}\n        </span>\n      )}\n      {helperText && !displayError && (\n        <span className=\"text-[var(--font-size-xs)] text-[var(--md-on-surface-variant)]\">\n          {helperText}\n        </span>\n      )}\n    </div>\n  );\n};\n\nFileUpload.displayName = 'FileUpload';\n"],"names":["FileUpload","label","helperText","error","accept","multiple","maxSizeBytes","disabled","onChange","className","inputRef","useRef","isDragging","setIsDragging","useState","sizeError","setSizeError","handleFiles","fileList","files","oversized","f","mb","handleDragOver","e","handleDragLeave","handleDrop","handleKeyDown","_a","displayError","cn","jsx","jsxs"],"mappings":"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"}

package/dist/components/FileUpload/FileUpload.stories.d.ts

@@ -0,0 +1,10 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { FileUpload } from './FileUpload';
+declare const meta: Meta<typeof FileUpload>;
+export default meta;
+type Story = StoryObj<typeof FileUpload>;
+export declare const Playground: Story;
+export declare const WithRestrictions: Story;
+export declare const Multiple: Story;
+export declare const Disabled: Story;
+export declare const WithError: Story;

package/dist/components/Footer/Footer.js

@@ -0,0 +1,54 @@
+import { jsx as r, jsxs as n } from "react/jsx-runtime";
+import { useState as c } from "react";
+const p = ({
+  poweredByText: t = "Powered by",
+  logoSrc: e,
+  logoAlt: i = "Logo",
+  logoFallbackText: s,
+  className: o = ""
+}) => {
+  const [a, l] = c(!0);
+  return /* @__PURE__ */ r(
+    "footer",
+    {
+      className: [
+        "relative z-[1] flex w-full shrink-0 items-center justify-center border-t border-[var(--border-color)] bg-[var(--bg-secondary)] px-[var(--spacing-2xl)] py-[var(--spacing-lg)]",
+        o
+      ].filter(Boolean).join(" "),
+      children: /* @__PURE__ */ n("div", { className: "flex items-center gap-[var(--spacing-md)]", children: [
+        t && /* @__PURE__ */ r("span", { className: "text-[0.95rem] font-normal text-[var(--text-secondary)]", children: t }),
+        (e || s) && /* @__PURE__ */ n("div", { className: "flex items-center", children: [
+          e && a && /* @__PURE__ */ r(
+            "img",
+            {
+              alt: i,
+              className: "h-6 w-auto object-contain",
+              onError: (m) => {
+                l(!1);
+              },
+              src: e,
+              style: {
+                filter: "brightness(0)"
+              }
+            }
+          ),
+          s && /* @__PURE__ */ r(
+            "span",
+            {
+              className: "flex items-center text-base font-bold tracking-[0.1em] text-[var(--md-primary)]",
+              style: {
+                display: e && a ? "none" : "flex",
+                fontFamily: '"Orbitron", sans-serif'
+              },
+              children: s
+            }
+          )
+        ] })
+      ] })
+    }
+  );
+};
+export {
+  p as Footer
+};
+//# sourceMappingURL=Footer.js.map

package/dist/components/Footer/Footer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Footer.js","sources":["../../../src/components/Footer/Footer.tsx"],"sourcesContent":["import type React from 'react';\nimport { useState } from 'react';\n\nexport interface FooterProps {\n  /** Classe CSS adicional */\n  className?: string;\n  /** Texto alternativo do logo */\n  logoAlt?: string;\n  /** Texto exibido se a imagem do logo falhar (ex.: \"SBK\") */\n  logoFallbackText?: string;\n  /** URL da imagem do logo */\n  logoSrc?: string;\n  /** Texto antes do logo (ex.: \"Powered by\") */\n  poweredByText?: string;\n}\n\nexport const Footer: React.FC<FooterProps> = ({\n  poweredByText = 'Powered by',\n  logoSrc,\n  logoAlt = 'Logo',\n  logoFallbackText,\n  className = '',\n}) => {\n  const [logoVisible, setLogoVisible] = useState(true);\n  return (\n    <footer\n      className={[\n        'relative z-[1] flex w-full shrink-0 items-center justify-center border-t border-[var(--border-color)] bg-[var(--bg-secondary)] px-[var(--spacing-2xl)] py-[var(--spacing-lg)]',\n        className,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      <div className=\"flex items-center gap-[var(--spacing-md)]\">\n        {poweredByText && (\n          <span className=\"text-[0.95rem] font-normal text-[var(--text-secondary)]\">\n            {poweredByText}\n          </span>\n        )}\n        {(logoSrc || logoFallbackText) && (\n          <div className=\"flex items-center\">\n            {logoSrc && logoVisible && (\n              <img\n                alt={logoAlt}\n                className=\"h-6 w-auto object-contain\"\n                onError={(_e) => {\n                  setLogoVisible(false);\n                }}\n                src={logoSrc}\n                style={{\n                  filter: 'brightness(0)',\n                }}\n              />\n            )}\n            {logoFallbackText && (\n              <span\n                className=\"flex items-center text-base font-bold tracking-[0.1em] text-[var(--md-primary)]\"\n                style={{\n                  display: logoSrc && logoVisible ? 'none' : 'flex',\n                  fontFamily: '\"Orbitron\", sans-serif',\n                }}\n              >\n                {logoFallbackText}\n              </span>\n            )}\n          </div>\n        )}\n      </div>\n    </footer>\n  );\n};\n"],"names":["Footer","poweredByText","logoSrc","logoAlt","logoFallbackText","className","logoVisible","setLogoVisible","useState","jsx","jsxs","_e"],"mappings":";;AAgBO,MAAMA,IAAgC,CAAC;AAAA,EAC5C,eAAAC,IAAgB;AAAA,EAChB,SAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,kBAAAC;AAAA,EACA,WAAAC,IAAY;AACd,MAAM;AACJ,QAAM,CAACC,GAAaC,CAAc,IAAIC,EAAS,EAAI;AACnD,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACAJ;AAAA,MAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,MAEX,UAAA,gBAAAK,EAAC,OAAA,EAAI,WAAU,6CACZ,UAAA;AAAA,QAAAT,KACC,gBAAAQ,EAAC,QAAA,EAAK,WAAU,2DACb,UAAAR,GACH;AAAA,SAEAC,KAAWE,MACX,gBAAAM,EAAC,OAAA,EAAI,WAAU,qBACZ,UAAA;AAAA,UAAAR,KAAWI,KACV,gBAAAG;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,KAAKN;AAAA,cACL,WAAU;AAAA,cACV,SAAS,CAACQ,MAAO;AACf,gBAAAJ,EAAe,EAAK;AAAA,cACtB;AAAA,cACA,KAAKL;AAAA,cACL,OAAO;AAAA,gBACL,QAAQ;AAAA,cAAA;AAAA,YACV;AAAA,UAAA;AAAA,UAGHE,KACC,gBAAAK;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,OAAO;AAAA,gBACL,SAASP,KAAWI,IAAc,SAAS;AAAA,gBAC3C,YAAY;AAAA,cAAA;AAAA,cAGb,UAAAF;AAAA,YAAA;AAAA,UAAA;AAAA,QACH,EAAA,CAEJ;AAAA,MAAA,EAAA,CAEJ;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/Header/Header.js

@@ -0,0 +1,114 @@
+import { jsxs as a, jsx as r } from "react/jsx-runtime";
+import { useState as u, useEffect as x } from "react";
+const v = () => typeof document > "u" ? "light" : document.documentElement.getAttribute("data-theme") === "dark" ? "dark" : "light", M = ({
+  logoSrc: h,
+  logoDarkSrc: i,
+  logoAlt: p = "Logo",
+  title: l,
+  subtitle: d,
+  theme: s,
+  onLogoClick: e,
+  rightContent: m,
+  className: b = ""
+}) => {
+  const [o, w] = u(!1), [y, c] = u(() => s ?? v()), f = y === "dark" && i ? i : h;
+  x(() => {
+    const t = () => w(window.scrollY > 10);
+    return window.addEventListener("scroll", t, { passive: !0 }), () => window.removeEventListener("scroll", t);
+  }, []), x(() => {
+    if (s) {
+      c(s);
+      return;
+    }
+    const t = () => c(v());
+    if (t(), typeof MutationObserver > "u")
+      return;
+    const n = new MutationObserver(t);
+    return n.observe(document.documentElement, {
+      attributes: !0,
+      attributeFilter: ["data-theme"]
+    }), () => n.disconnect();
+  }, [s]);
+  const N = () => e == null ? void 0 : e(), E = (t) => {
+    t.key === "Enter" && (e == null || e());
+  };
+  return /* @__PURE__ */ a(
+    "header",
+    {
+      className: ["fixed inset-x-0 top-0 z-[1000] w-full backdrop-blur-[12px]", b].filter(Boolean).join(" "),
+      children: [
+        /* @__PURE__ */ r("div", { className: "h-0.5 w-full bg-[var(--md-primary)]" }),
+        /* @__PURE__ */ a(
+          "div",
+          {
+            className: "flex items-center justify-between px-6 py-2 shadow-[var(--shadow-sm)] max-md:flex-col max-md:gap-3 max-md:px-4 max-md:py-3",
+            style: {
+              color: "var(--md-on-surface)",
+              background: `color-mix(in srgb, var(--md-surface) ${o ? "14%" : "18%"}, transparent)`,
+              borderBottom: `1px solid color-mix(in srgb, var(--md-outline-variant) ${o ? "22%" : "30%"}, transparent)`
+            },
+            children: [
+              /* @__PURE__ */ a(
+                "div",
+                {
+                  className: "flex cursor-pointer items-center gap-3 transition-opacity duration-200 ease-in-out hover:opacity-80",
+                  onClick: e ? N : void 0,
+                  onKeyDown: e ? E : void 0,
+                  role: e ? "button" : void 0,
+                  tabIndex: e ? 0 : void 0,
+                  children: [
+                    f && /* @__PURE__ */ a("div", { className: "flex h-16 w-16 shrink-0 items-center justify-center", children: [
+                      /* @__PURE__ */ r(
+                        "img",
+                        {
+                          alt: p,
+                          className: "h-full w-full object-contain",
+                          onError: (t) => {
+                            t.target.style.display = "none";
+                            const n = t.target.nextElementSibling;
+                            n && (n.style.display = "block");
+                          },
+                          src: f
+                        }
+                      ),
+                      /* @__PURE__ */ a(
+                        "svg",
+                        {
+                          className: "hidden h-full w-full",
+                          fill: "none",
+                          stroke: "currentColor",
+                          strokeWidth: "2",
+                          viewBox: "0 0 24 24",
+                          children: [
+                            /* @__PURE__ */ r("path", { d: "M12 2L2 7l10 5 10-5-10-5z" }),
+                            /* @__PURE__ */ r("path", { d: "M2 17l10 5 10-5M2 12l10 5 10-5" })
+                          ]
+                        }
+                      )
+                    ] }),
+                    (l || d) && /* @__PURE__ */ a("div", { className: "flex flex-col gap-1", children: [
+                      l && /* @__PURE__ */ r(
+                        "h1",
+                        {
+                          className: "m-0 inline-flex items-baseline text-[1.375rem] font-bold leading-[1.2] tracking-[0.05em] text-[var(--md-on-surface)] max-md:text-xl",
+                          style: { fontFamily: "var(--font-logo)" },
+                          children: l
+                        }
+                      ),
+                      d && /* @__PURE__ */ r("p", { className: "m-0 text-[0.8125rem] font-normal text-[var(--md-on-surface-variant)] max-md:text-xs", children: d })
+                    ] })
+                  ]
+                }
+              ),
+              m && /* @__PURE__ */ r("div", { className: "flex shrink-0 items-center gap-3 max-md:w-full max-md:flex-wrap max-md:justify-between", children: m })
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  M as Header
+};
+//# sourceMappingURL=Header.js.map

package/dist/components/Header/Header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Header.js","sources":["../../../src/components/Header/Header.tsx"],"sourcesContent":["import type React from 'react';\nimport { useEffect, useState } from 'react';\nimport type { Theme } from '../../theme/ThemeProvider';\n\nexport interface HeaderProps {\n  /** Classe CSS adicional */\n  className?: string;\n  /** Texto alternativo do logo */\n  logoAlt?: string;\n  /** URL da imagem do logo (tema escuro). Se não informado, usa logoSrc. */\n  logoDarkSrc?: string;\n  /** URL da imagem do logo (tema claro) */\n  logoSrc?: string;\n  /** Callback ao clicar na área do logo/título */\n  onLogoClick?: () => void;\n  /** Conteúdo da área direita (ex.: seletor de idioma, toggle tema, menu usuário) */\n  rightContent?: React.ReactNode;\n  /** Subtítulo abaixo do título */\n  subtitle?: React.ReactNode;\n  /** Tema opcional para escolher o logo correto sem depender do ThemeProvider do UI */\n  theme?: Theme;\n  /** Título exibido ao lado do logo (ex.: \"OFÍCIO.IA\") */\n  title?: React.ReactNode;\n}\n\nconst detectTheme = (): Theme => {\n  if (typeof document === 'undefined') {\n    return 'light';\n  }\n\n  return document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light';\n};\n\nexport const Header: React.FC<HeaderProps> = ({\n  logoSrc,\n  logoDarkSrc,\n  logoAlt = 'Logo',\n  title,\n  subtitle,\n  theme,\n  onLogoClick,\n  rightContent,\n  className = '',\n}) => {\n  const [isScrolled, setIsScrolled] = useState(false);\n  const [resolvedTheme, setResolvedTheme] = useState<Theme>(() => theme ?? detectTheme());\n\n  const logoSrcResolved = resolvedTheme === 'dark' && logoDarkSrc ? logoDarkSrc : logoSrc;\n\n  useEffect(() => {\n    const handleScroll = () => setIsScrolled(window.scrollY > 10);\n    window.addEventListener('scroll', handleScroll, { passive: true });\n    return () => window.removeEventListener('scroll', handleScroll);\n  }, []);\n\n  useEffect(() => {\n    if (theme) {\n      setResolvedTheme(theme);\n      return;\n    }\n\n    const syncTheme = () => setResolvedTheme(detectTheme());\n    syncTheme();\n\n    if (typeof MutationObserver === 'undefined') {\n      return;\n    }\n\n    const observer = new MutationObserver(syncTheme);\n    observer.observe(document.documentElement, {\n      attributes: true,\n      attributeFilter: ['data-theme'],\n    });\n\n    return () => observer.disconnect();\n  }, [theme]);\n\n  const handleClick = () => onLogoClick?.();\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    if (e.key === 'Enter') {\n      onLogoClick?.();\n    }\n  };\n\n  return (\n    <header\n      className={['fixed inset-x-0 top-0 z-[1000] w-full backdrop-blur-[12px]', className]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      <div className=\"h-0.5 w-full bg-[var(--md-primary)]\" />\n      <div\n        className=\"flex items-center justify-between px-6 py-2 shadow-[var(--shadow-sm)] max-md:flex-col max-md:gap-3 max-md:px-4 max-md:py-3\"\n        style={{\n          color: 'var(--md-on-surface)',\n          background: `color-mix(in srgb, var(--md-surface) ${\n            isScrolled ? '14%' : '18%'\n          }, transparent)`,\n          borderBottom: `1px solid color-mix(in srgb, var(--md-outline-variant) ${\n            isScrolled ? '22%' : '30%'\n          }, transparent)`,\n        }}\n      >\n        <div\n          className=\"flex cursor-pointer items-center gap-3 transition-opacity duration-200 ease-in-out hover:opacity-80\"\n          onClick={onLogoClick ? handleClick : undefined}\n          onKeyDown={onLogoClick ? handleKeyDown : undefined}\n          role={onLogoClick ? 'button' : undefined}\n          tabIndex={onLogoClick ? 0 : undefined}\n        >\n          {logoSrcResolved && (\n            <div className=\"flex h-16 w-16 shrink-0 items-center justify-center\">\n              <img\n                alt={logoAlt}\n                className=\"h-full w-full object-contain\"\n                onError={(e) => {\n                  (e.target as HTMLImageElement).style.display = 'none';\n                  const next = (e.target as HTMLElement).nextElementSibling as HTMLElement;\n                  if (next) {\n                    next.style.display = 'block';\n                  }\n                }}\n                src={logoSrcResolved}\n              />\n              <svg\n                className=\"hidden h-full w-full\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                strokeWidth=\"2\"\n                viewBox=\"0 0 24 24\"\n              >\n                <path d=\"M12 2L2 7l10 5 10-5-10-5z\" />\n                <path d=\"M2 17l10 5 10-5M2 12l10 5 10-5\" />\n              </svg>\n            </div>\n          )}\n          {(title || subtitle) && (\n            <div className=\"flex flex-col gap-1\">\n              {title && (\n                <h1\n                  className=\"m-0 inline-flex items-baseline text-[1.375rem] font-bold leading-[1.2] tracking-[0.05em] text-[var(--md-on-surface)] max-md:text-xl\"\n                  style={{ fontFamily: 'var(--font-logo)' }}\n                >\n                  {title}\n                </h1>\n              )}\n              {subtitle && (\n                <p className=\"m-0 text-[0.8125rem] font-normal text-[var(--md-on-surface-variant)] max-md:text-xs\">\n                  {subtitle}\n                </p>\n              )}\n            </div>\n          )}\n        </div>\n        {rightContent && (\n          <div className=\"flex shrink-0 items-center gap-3 max-md:w-full max-md:flex-wrap max-md:justify-between\">\n            {rightContent}\n          </div>\n        )}\n      </div>\n    </header>\n  );\n};\n"],"names":["detectTheme","Header","logoSrc","logoDarkSrc","logoAlt","title","subtitle","theme","onLogoClick","rightContent","className","isScrolled","setIsScrolled","useState","resolvedTheme","setResolvedTheme","logoSrcResolved","useEffect","handleScroll","syncTheme","observer","handleClick","handleKeyDown","e","jsxs","jsx","next"],"mappings":"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"}

package/dist/components/Input/Input.d.ts

@@ -1,4 +1,4 @@
-import type React from 'react';
+import React from 'react';
 export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'> {
     error?: string;
     fullWidth?: boolean;
@@ -8,4 +8,4 @@ export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElem
     rightIcon?: React.ReactNode;
     size?: 'sm' | 'md' | 'lg';
 }
-export declare const Input: React.FC<InputProps>;
+export declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;