domify-ui 1.0.2 → 1.0.3

package/dist/index.js

@@ -0,0 +1,828 @@
+// src/button.tsx
+import * as React from "react";
+
+// src/utils.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/button.tsx
+import { jsx } from "react/jsx-runtime";
+var Button = React.forwardRef(
+  ({ className, variant = "default", size = "default", ...props }, ref) => {
+    return /* @__PURE__ */ jsx(
+      "button",
+      {
+        className: cn(
+          "inline-flex items-center justify-center text-sm transition-all",
+          "font-medium rounded-[10px]",
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[#0052CC]",
+          "disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed",
+          {
+            "bg-[#0052CC] text-white hover:bg-[#003d99] active:bg-[#002d73] shadow-sm hover:shadow-md": variant === "default",
+            "bg-[#FF7A00] text-white hover:bg-[#e66d00] active:bg-[#cc6000] shadow-sm hover:shadow-md": variant === "secondary",
+            "bg-red-600 text-white hover:bg-red-700 active:bg-red-800 shadow-sm hover:shadow-md": variant === "destructive",
+            "border-2 border-[#0052CC] bg-white text-[#0052CC] hover:bg-[#f0f5ff] hover:border-[#003d99]": variant === "outline",
+            "text-[#4A4A4A] hover:bg-gray-100 active:bg-gray-200": variant === "ghost"
+          },
+          {
+            "h-11 px-5 py-2.5": size === "default",
+            "h-9 px-3 py-2 text-xs": size === "sm",
+            "h-12 px-8 py-3": size === "lg"
+          },
+          className
+        ),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+
+// src/input.tsx
+import * as React2 from "react";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var Input = React2.forwardRef(
+  ({ className, type, ...props }, ref) => {
+    return /* @__PURE__ */ jsx2(
+      "input",
+      {
+        type,
+        className: cn(
+          "flex h-11 w-full rounded-lg border-2 border-gray-300 bg-white px-4 py-2.5 text-sm text-[#0B2346] placeholder:text-[#888888] transition-all",
+          "hover:border-gray-400",
+          "focus:outline-none focus:ring-2 focus:ring-[#0052CC] focus:border-[#0052CC]",
+          "disabled:cursor-not-allowed disabled:opacity-50 disabled:bg-gray-50",
+          className
+        ),
+        style: { fontFamily: "Inter, sans-serif" },
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Input.displayName = "Input";
+
+// src/select.tsx
+import * as React3 from "react";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var Select = React3.forwardRef(
+  ({ className, ...props }, ref) => {
+    return /* @__PURE__ */ jsx3(
+      "select",
+      {
+        className: cn(
+          "flex h-11 w-full rounded-lg border-2 border-gray-300 bg-white px-4 py-2.5 text-sm text-gray-900 transition-all",
+          "hover:border-gray-400",
+          "focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500",
+          "disabled:cursor-not-allowed disabled:opacity-50 disabled:bg-gray-50",
+          className
+        ),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Select.displayName = "Select";
+
+// src/textarea.tsx
+import * as React4 from "react";
+import { jsx as jsx4 } from "react/jsx-runtime";
+var Textarea = React4.forwardRef(
+  ({ className, ...props }, ref) => {
+    return /* @__PURE__ */ jsx4(
+      "textarea",
+      {
+        className: cn(
+          "flex min-h-[100px] w-full rounded-lg border-2 border-gray-300 bg-white px-4 py-3 text-sm text-gray-900 placeholder:text-gray-500 transition-all",
+          "hover:border-gray-400",
+          "focus:outline-none focus:ring-2 focus:ring-[#0052CC] focus:border-[#0052CC]",
+          "disabled:cursor-not-allowed disabled:opacity-50 disabled:bg-gray-50",
+          "resize-y",
+          className
+        ),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Textarea.displayName = "Textarea";
+
+// src/checkbox.tsx
+import * as React5 from "react";
+import { jsx as jsx5, jsxs } from "react/jsx-runtime";
+var Checkbox = React5.forwardRef(
+  ({ className, label, ...props }, ref) => {
+    return /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-2 cursor-pointer", children: [
+      /* @__PURE__ */ jsx5(
+        "input",
+        {
+          type: "checkbox",
+          className: cn(
+            "w-5 h-5 rounded border-2 border-gray-300 text-blue-600 transition-all",
+            "hover:border-gray-400",
+            "focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2",
+            "disabled:cursor-not-allowed disabled:opacity-50",
+            "cursor-pointer",
+            className
+          ),
+          ref,
+          ...props
+        }
+      ),
+      label ? /* @__PURE__ */ jsx5("span", { className: "text-sm font-medium text-gray-700 select-none", children: label }) : null
+    ] });
+  }
+);
+Checkbox.displayName = "Checkbox";
+
+// src/switch.tsx
+import * as React6 from "react";
+import { jsx as jsx6 } from "react/jsx-runtime";
+var Switch = React6.forwardRef(
+  ({ id, checked = false, onCheckedChange, disabled = false, className }, ref) => {
+    const handleClick = () => {
+      if (!disabled && onCheckedChange) {
+        onCheckedChange(!checked);
+      }
+    };
+    return /* @__PURE__ */ jsx6(
+      "button",
+      {
+        type: "button",
+        id,
+        role: "switch",
+        "aria-checked": checked,
+        disabled,
+        onClick: handleClick,
+        ref,
+        className: cn(
+          "relative inline-flex h-6 w-11 items-center rounded-full transition-colors",
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2",
+          "disabled:cursor-not-allowed disabled:opacity-50",
+          checked ? "bg-[#0052CC]" : "bg-gray-300",
+          className
+        ),
+        children: /* @__PURE__ */ jsx6(
+          "span",
+          {
+            className: cn(
+              "inline-block h-5 w-5 transform rounded-full bg-white shadow-sm transition-transform",
+              checked ? "translate-x-6" : "translate-x-0.5"
+            )
+          }
+        )
+      }
+    );
+  }
+);
+Switch.displayName = "Switch";
+
+// src/tabs.tsx
+import * as React7 from "react";
+import { jsx as jsx7 } from "react/jsx-runtime";
+var TabsContext = React7.createContext(void 0);
+function useTabsContext() {
+  const context = React7.useContext(TabsContext);
+  if (!context) {
+    throw new Error("Tabs components must be used within a Tabs component");
+  }
+  return context;
+}
+function Tabs({
+  defaultValue,
+  onValueChange,
+  children,
+  className,
+  ...props
+}) {
+  const [value, setValue] = React7.useState(defaultValue);
+  const handleValueChange = React7.useCallback(
+    (newValue) => {
+      setValue(newValue);
+      onValueChange?.(newValue);
+    },
+    [onValueChange]
+  );
+  return /* @__PURE__ */ jsx7(TabsContext.Provider, { value: { value, onValueChange: handleValueChange }, children: /* @__PURE__ */ jsx7("div", { className: cn("w-full", className), ...props, children }) });
+}
+function TabsList({ children, className, ...props }) {
+  return /* @__PURE__ */ jsx7(
+    "div",
+    {
+      className: cn(
+        "inline-flex h-10 items-center justify-center rounded-lg bg-gray-100 p-1 text-gray-500",
+        className
+      ),
+      ...props,
+      children
+    }
+  );
+}
+function TabsTrigger({
+  value,
+  children,
+  className,
+  ...props
+}) {
+  const { value: selectedValue, onValueChange } = useTabsContext();
+  const isSelected = value === selectedValue;
+  return /* @__PURE__ */ jsx7(
+    "button",
+    {
+      type: "button",
+      role: "tab",
+      "aria-selected": isSelected,
+      onClick: () => onValueChange(value),
+      className: cn(
+        "inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1.5 text-sm font-medium transition-all",
+        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2",
+        "disabled:pointer-events-none disabled:opacity-50",
+        isSelected ? "bg-white text-gray-900 shadow-sm" : "text-gray-600 hover:bg-gray-50 hover:text-gray-900",
+        className
+      ),
+      ...props,
+      children
+    }
+  );
+}
+function TabsContent({
+  value,
+  children,
+  className,
+  ...props
+}) {
+  const { value: selectedValue } = useTabsContext();
+  if (value !== selectedValue) return null;
+  return /* @__PURE__ */ jsx7("div", { role: "tabpanel", className: cn("mt-2", className), ...props, children });
+}
+
+// src/pagination.tsx
+import { ChevronLeft, ChevronRight, ChevronsLeft, ChevronsRight } from "lucide-react";
+import { jsx as jsx8, jsxs as jsxs2 } from "react/jsx-runtime";
+function Pagination({
+  currentPage,
+  totalPages,
+  totalItems,
+  perPage,
+  onPageChange,
+  className = ""
+}) {
+  const startItem = (currentPage - 1) * perPage + 1;
+  const endItem = Math.min(currentPage * perPage, totalItems);
+  const getPageNumbers = () => {
+    const pages = [];
+    const maxVisiblePages = 5;
+    if (totalPages <= maxVisiblePages) {
+      for (let i = 1; i <= totalPages; i++) pages.push(i);
+      return pages;
+    }
+    pages.push(1);
+    if (currentPage > 3) pages.push("...");
+    const start = Math.max(2, currentPage - 1);
+    const end = Math.min(totalPages - 1, currentPage + 1);
+    for (let i = start; i <= end; i++) {
+      if (!pages.includes(i)) pages.push(i);
+    }
+    if (currentPage < totalPages - 2) pages.push("...");
+    if (!pages.includes(totalPages)) pages.push(totalPages);
+    return pages;
+  };
+  if (totalPages <= 1) {
+    return /* @__PURE__ */ jsxs2("div", { className: `flex items-center justify-center text-sm text-[#888888] ${className}`, children: [
+      "Mostrando ",
+      totalItems,
+      " de ",
+      totalItems,
+      " ",
+      totalItems === 1 ? "item" : "itens"
+    ] });
+  }
+  return /* @__PURE__ */ jsxs2("div", { className: `flex flex-col sm:flex-row items-center justify-between gap-4 ${className}`, children: [
+    /* @__PURE__ */ jsxs2("div", { className: "text-sm text-[#888888]", style: { fontFamily: "Inter" }, children: [
+      "Mostrando ",
+      startItem,
+      " a ",
+      endItem,
+      " de ",
+      totalItems,
+      " ",
+      totalItems === 1 ? "item" : "itens"
+    ] }),
+    /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-1", children: [
+      /* @__PURE__ */ jsx8(
+        Button,
+        {
+          variant: "outline",
+          size: "sm",
+          onClick: () => onPageChange(1),
+          disabled: currentPage === 1,
+          className: "hidden sm:flex",
+          children: /* @__PURE__ */ jsx8(ChevronsLeft, { size: 16 })
+        }
+      ),
+      /* @__PURE__ */ jsx8(
+        Button,
+        {
+          variant: "outline",
+          size: "sm",
+          onClick: () => onPageChange(currentPage - 1),
+          disabled: currentPage === 1,
+          children: /* @__PURE__ */ jsx8(ChevronLeft, { size: 16 })
+        }
+      ),
+      /* @__PURE__ */ jsx8("div", { className: "flex items-center gap-1", children: getPageNumbers().map(
+        (page, index) => page === "..." ? /* @__PURE__ */ jsx8("span", { className: "px-2 text-[#888888]", children: "..." }, `ellipsis-${index}`) : /* @__PURE__ */ jsx8(
+          Button,
+          {
+            variant: currentPage === page ? "default" : "outline",
+            size: "sm",
+            onClick: () => onPageChange(page),
+            className: "min-w-[36px]",
+            children: page
+          },
+          page
+        )
+      ) }),
+      /* @__PURE__ */ jsx8(
+        Button,
+        {
+          variant: "outline",
+          size: "sm",
+          onClick: () => onPageChange(currentPage + 1),
+          disabled: currentPage === totalPages,
+          children: /* @__PURE__ */ jsx8(ChevronRight, { size: 16 })
+        }
+      ),
+      /* @__PURE__ */ jsx8(
+        Button,
+        {
+          variant: "outline",
+          size: "sm",
+          onClick: () => onPageChange(totalPages),
+          disabled: currentPage === totalPages,
+          className: "hidden sm:flex",
+          children: /* @__PURE__ */ jsx8(ChevronsRight, { size: 16 })
+        }
+      )
+    ] })
+  ] });
+}
+function PaginationCompact({
+  currentPage,
+  totalPages,
+  onPageChange
+}) {
+  if (totalPages <= 1) return null;
+  return /* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-center gap-4", children: [
+    /* @__PURE__ */ jsxs2(
+      Button,
+      {
+        variant: "outline",
+        size: "sm",
+        onClick: () => onPageChange(currentPage - 1),
+        disabled: currentPage === 1,
+        children: [
+          /* @__PURE__ */ jsx8(ChevronLeft, { size: 16 }),
+          "Anterior"
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs2("span", { className: "text-sm text-[#888888]", style: { fontFamily: "Inter" }, children: [
+      "Pagina ",
+      currentPage,
+      " de ",
+      totalPages
+    ] }),
+    /* @__PURE__ */ jsxs2(
+      Button,
+      {
+        variant: "outline",
+        size: "sm",
+        onClick: () => onPageChange(currentPage + 1),
+        disabled: currentPage === totalPages,
+        children: [
+          "Proxima",
+          /* @__PURE__ */ jsx8(ChevronRight, { size: 16 })
+        ]
+      }
+    )
+  ] });
+}
+
+// src/skeleton.tsx
+import { jsx as jsx9, jsxs as jsxs3 } from "react/jsx-runtime";
+function Skeleton({ className }) {
+  return /* @__PURE__ */ jsx9("div", { className: cn("animate-pulse rounded-md bg-gray-200", className) });
+}
+function PropertyCardSkeleton() {
+  return /* @__PURE__ */ jsxs3("div", { className: "bg-white rounded-lg shadow overflow-hidden", children: [
+    /* @__PURE__ */ jsx9(Skeleton, { className: "h-48 w-full rounded-none" }),
+    /* @__PURE__ */ jsxs3("div", { className: "p-4 space-y-3", children: [
+      /* @__PURE__ */ jsx9(Skeleton, { className: "h-4 w-1/4" }),
+      /* @__PURE__ */ jsx9(Skeleton, { className: "h-6 w-3/4" }),
+      /* @__PURE__ */ jsx9(Skeleton, { className: "h-4 w-1/2" }),
+      /* @__PURE__ */ jsxs3("div", { className: "flex gap-4 pt-2", children: [
+        /* @__PURE__ */ jsx9(Skeleton, { className: "h-4 w-16" }),
+        /* @__PURE__ */ jsx9(Skeleton, { className: "h-4 w-16" }),
+        /* @__PURE__ */ jsx9(Skeleton, { className: "h-4 w-16" })
+      ] }),
+      /* @__PURE__ */ jsxs3("div", { className: "flex justify-between pt-4", children: [
+        /* @__PURE__ */ jsx9(Skeleton, { className: "h-6 w-24" }),
+        /* @__PURE__ */ jsx9(Skeleton, { className: "h-8 w-20" })
+      ] })
+    ] })
+  ] });
+}
+function TableRowSkeleton({ columns = 5 }) {
+  return /* @__PURE__ */ jsx9("tr", { className: "border-b border-gray-100", children: Array.from({ length: columns }).map((_, i) => /* @__PURE__ */ jsx9("td", { className: "px-4 py-3", children: /* @__PURE__ */ jsx9(Skeleton, { className: "h-4 w-full" }) }, i)) });
+}
+function TableSkeleton({
+  rows = 5,
+  columns = 5
+}) {
+  return /* @__PURE__ */ jsx9("div", { className: "bg-white rounded-lg shadow overflow-hidden", children: /* @__PURE__ */ jsx9("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs3("table", { className: "w-full", children: [
+    /* @__PURE__ */ jsx9("thead", { className: "bg-gray-50", children: /* @__PURE__ */ jsx9("tr", { children: Array.from({ length: columns }).map((_, i) => /* @__PURE__ */ jsx9("th", { className: "px-4 py-3 text-left", children: /* @__PURE__ */ jsx9(Skeleton, { className: "h-4 w-20" }) }, i)) }) }),
+    /* @__PURE__ */ jsx9("tbody", { children: Array.from({ length: rows }).map((_, i) => /* @__PURE__ */ jsx9(TableRowSkeleton, { columns }, i)) })
+  ] }) }) });
+}
+function ListItemSkeleton() {
+  return /* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-4 p-4 bg-white rounded-lg shadow", children: [
+    /* @__PURE__ */ jsx9(Skeleton, { className: "h-12 w-12 rounded-full" }),
+    /* @__PURE__ */ jsxs3("div", { className: "flex-1 space-y-2", children: [
+      /* @__PURE__ */ jsx9(Skeleton, { className: "h-4 w-1/3" }),
+      /* @__PURE__ */ jsx9(Skeleton, { className: "h-3 w-1/2" })
+    ] }),
+    /* @__PURE__ */ jsx9(Skeleton, { className: "h-8 w-20" })
+  ] });
+}
+function StatsCardSkeleton() {
+  return /* @__PURE__ */ jsx9("div", { className: "bg-white rounded-lg shadow p-6", children: /* @__PURE__ */ jsxs3("div", { className: "flex items-center justify-between", children: [
+    /* @__PURE__ */ jsxs3("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsx9(Skeleton, { className: "h-4 w-24" }),
+      /* @__PURE__ */ jsx9(Skeleton, { className: "h-8 w-16" })
+    ] }),
+    /* @__PURE__ */ jsx9(Skeleton, { className: "h-12 w-12 rounded-full" })
+  ] }) });
+}
+function FormSkeleton({ fields = 4 }) {
+  return /* @__PURE__ */ jsxs3("div", { className: "bg-white rounded-lg shadow p-6 space-y-6", children: [
+    Array.from({ length: fields }).map((_, i) => /* @__PURE__ */ jsxs3("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsx9(Skeleton, { className: "h-4 w-24" }),
+      /* @__PURE__ */ jsx9(Skeleton, { className: "h-10 w-full" })
+    ] }, i)),
+    /* @__PURE__ */ jsxs3("div", { className: "flex justify-end gap-4 pt-4", children: [
+      /* @__PURE__ */ jsx9(Skeleton, { className: "h-10 w-24" }),
+      /* @__PURE__ */ jsx9(Skeleton, { className: "h-10 w-32" })
+    ] })
+  ] });
+}
+function DetailPageSkeleton() {
+  return /* @__PURE__ */ jsxs3("div", { className: "space-y-6", children: [
+    /* @__PURE__ */ jsxs3("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxs3("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx9(Skeleton, { className: "h-8 w-48" }),
+        /* @__PURE__ */ jsx9(Skeleton, { className: "h-4 w-32" })
+      ] }),
+      /* @__PURE__ */ jsxs3("div", { className: "flex gap-2", children: [
+        /* @__PURE__ */ jsx9(Skeleton, { className: "h-10 w-24" }),
+        /* @__PURE__ */ jsx9(Skeleton, { className: "h-10 w-24" })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs3("div", { className: "grid grid-cols-1 lg:grid-cols-3 gap-6", children: [
+      /* @__PURE__ */ jsxs3("div", { className: "lg:col-span-2 space-y-6", children: [
+        /* @__PURE__ */ jsxs3("div", { className: "bg-white rounded-lg shadow p-6 space-y-4", children: [
+          /* @__PURE__ */ jsx9(Skeleton, { className: "h-6 w-32" }),
+          /* @__PURE__ */ jsx9(Skeleton, { className: "h-4 w-full" }),
+          /* @__PURE__ */ jsx9(Skeleton, { className: "h-4 w-full" }),
+          /* @__PURE__ */ jsx9(Skeleton, { className: "h-4 w-3/4" })
+        ] }),
+        /* @__PURE__ */ jsxs3("div", { className: "bg-white rounded-lg shadow p-6 space-y-4", children: [
+          /* @__PURE__ */ jsx9(Skeleton, { className: "h-6 w-32" }),
+          /* @__PURE__ */ jsx9("div", { className: "grid grid-cols-2 gap-4", children: Array.from({ length: 6 }).map((_, i) => /* @__PURE__ */ jsxs3("div", { className: "space-y-1", children: [
+            /* @__PURE__ */ jsx9(Skeleton, { className: "h-4 w-20" }),
+            /* @__PURE__ */ jsx9(Skeleton, { className: "h-4 w-28" })
+          ] }, i)) })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx9("div", { className: "space-y-6", children: /* @__PURE__ */ jsxs3("div", { className: "bg-white rounded-lg shadow p-6 space-y-4", children: [
+        /* @__PURE__ */ jsx9(Skeleton, { className: "h-6 w-24" }),
+        /* @__PURE__ */ jsx9(Skeleton, { className: "h-8 w-full" }),
+        /* @__PURE__ */ jsx9(Skeleton, { className: "h-4 w-full" })
+      ] }) })
+    ] })
+  ] });
+}
+function DashboardSkeleton() {
+  return /* @__PURE__ */ jsxs3("div", { className: "space-y-6", children: [
+    /* @__PURE__ */ jsx9("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4", children: Array.from({ length: 4 }).map((_, i) => /* @__PURE__ */ jsx9(StatsCardSkeleton, {}, i)) }),
+    /* @__PURE__ */ jsxs3("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-6", children: [
+      /* @__PURE__ */ jsxs3("div", { className: "bg-white rounded-lg shadow p-6", children: [
+        /* @__PURE__ */ jsx9(Skeleton, { className: "h-6 w-32 mb-4" }),
+        /* @__PURE__ */ jsx9(Skeleton, { className: "h-64 w-full" })
+      ] }),
+      /* @__PURE__ */ jsxs3("div", { className: "bg-white rounded-lg shadow p-6", children: [
+        /* @__PURE__ */ jsx9(Skeleton, { className: "h-6 w-32 mb-4" }),
+        /* @__PURE__ */ jsx9("div", { className: "space-y-4", children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ jsx9(ListItemSkeleton, {}, i)) })
+      ] })
+    ] })
+  ] });
+}
+
+// src/searchable-select.tsx
+import * as React8 from "react";
+import { Search, ChevronDown } from "lucide-react";
+import { jsx as jsx10, jsxs as jsxs4 } from "react/jsx-runtime";
+var SearchableSelect = React8.forwardRef(
+  ({
+    options,
+    value,
+    onChange,
+    onBlur,
+    placeholder = "Selecione uma opcao...",
+    disabled = false,
+    className,
+    getOptionLabel = (option) => option.label,
+    filterFunction,
+    emptyMessage = "Nenhuma opcao encontrada",
+    name
+  }, ref) => {
+    const [isOpen, setIsOpen] = React8.useState(false);
+    const [searchTerm, setSearchTerm] = React8.useState("");
+    const containerRef = React8.useRef(null);
+    const inputRef = React8.useRef(null);
+    const listRef = React8.useRef(null);
+    const selectedOption = React8.useMemo(
+      () => options.find((opt) => opt.id === value) || null,
+      [options, value]
+    );
+    const filteredOptions = React8.useMemo(() => {
+      if (!searchTerm.trim()) return options;
+      const term = searchTerm.toLowerCase().trim();
+      if (filterFunction) return options.filter((option) => filterFunction(option, term));
+      return options.filter((option) => getOptionLabel(option).toLowerCase().includes(term));
+    }, [options, searchTerm, getOptionLabel, filterFunction]);
+    React8.useEffect(() => {
+      const handleClickOutside = (event) => {
+        if (containerRef.current && !containerRef.current.contains(event.target)) {
+          setIsOpen(false);
+          setSearchTerm("");
+        }
+      };
+      if (!isOpen) return;
+      document.addEventListener("mousedown", handleClickOutside);
+      return () => document.removeEventListener("mousedown", handleClickOutside);
+    }, [isOpen]);
+    React8.useEffect(() => {
+      if (!isOpen || !listRef.current || !selectedOption) return;
+      const selectedIndex = filteredOptions.findIndex((opt) => opt.id === selectedOption.id);
+      if (selectedIndex < 0) return;
+      const selectedElement = listRef.current.children[selectedIndex];
+      selectedElement?.scrollIntoView({ block: "nearest" });
+    }, [isOpen, selectedOption, filteredOptions]);
+    const handleSelect = (option) => {
+      onChange?.(option.id);
+      setIsOpen(false);
+      setSearchTerm("");
+      onBlur?.();
+    };
+    const handleToggle = () => {
+      if (disabled) return;
+      setIsOpen((prev) => !prev);
+      setTimeout(() => inputRef.current?.focus(), 0);
+    };
+    const displayValue = selectedOption ? getOptionLabel(selectedOption) : "";
+    return /* @__PURE__ */ jsxs4("div", { ref: containerRef, className: cn("relative w-full", className), children: [
+      /* @__PURE__ */ jsxs4(
+        "div",
+        {
+          className: cn(
+            "flex h-11 w-full rounded-lg border-2 bg-white px-4 py-2.5 text-sm text-gray-900 transition-all cursor-pointer",
+            "hover:border-gray-400",
+            "focus-within:outline-none focus-within:ring-2 focus-within:ring-blue-500 focus-within:border-blue-500",
+            disabled && "cursor-not-allowed opacity-50 bg-gray-50 hover:border-gray-300",
+            !isOpen && "border-gray-300"
+          ),
+          onClick: handleToggle,
+          children: [
+            /* @__PURE__ */ jsxs4("div", { className: "flex items-center flex-1 min-w-0", children: [
+              !isOpen && !displayValue ? /* @__PURE__ */ jsx10("span", { className: "text-gray-500", children: placeholder }) : null,
+              !isOpen && displayValue ? /* @__PURE__ */ jsx10("span", { className: "truncate", children: displayValue }) : null,
+              isOpen ? /* @__PURE__ */ jsx10(
+                "input",
+                {
+                  ref: inputRef,
+                  type: "text",
+                  value: searchTerm,
+                  onChange: (e) => {
+                    if (disabled) return;
+                    setSearchTerm(e.target.value);
+                    setIsOpen(true);
+                  },
+                  placeholder,
+                  className: "flex-1 outline-none bg-transparent text-gray-900 placeholder:text-gray-500",
+                  onClick: (e) => e.stopPropagation(),
+                  disabled
+                }
+              ) : null
+            ] }),
+            /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-2 ml-2", children: [
+              /* @__PURE__ */ jsx10(Search, { size: 18, className: cn("text-gray-500 transition-transform", isOpen && "rotate-90") }),
+              /* @__PURE__ */ jsx10(
+                ChevronDown,
+                {
+                  size: 18,
+                  className: cn("text-gray-500 transition-transform", isOpen && "rotate-180")
+                }
+              )
+            ] })
+          ]
+        }
+      ),
+      isOpen ? /* @__PURE__ */ jsx10("div", { className: "absolute z-50 w-full mt-1 bg-white border-2 border-gray-300 rounded-lg shadow-lg max-h-60 overflow-hidden", children: /* @__PURE__ */ jsx10("ul", { ref: listRef, className: "overflow-y-auto max-h-60 py-1", role: "listbox", children: filteredOptions.length === 0 ? /* @__PURE__ */ jsx10("li", { className: "px-4 py-3 text-sm text-gray-500 text-center", children: emptyMessage }) : filteredOptions.map((option) => {
+        const isSelected = option.id === value;
+        const label = getOptionLabel(option);
+        return /* @__PURE__ */ jsx10(
+          "li",
+          {
+            role: "option",
+            "aria-selected": isSelected,
+            className: cn(
+              "px-4 py-2 cursor-pointer text-sm transition-colors",
+              "hover:bg-blue-50 hover:text-blue-900",
+              isSelected && "bg-blue-100 text-blue-900 font-medium"
+            ),
+            onClick: () => handleSelect(option),
+            children: label
+          },
+          option.id
+        );
+      }) }) }) : null,
+      name ? /* @__PURE__ */ jsx10("input", { ref, type: "hidden", name, value: value || "", readOnly: true }) : null
+    ] });
+  }
+);
+SearchableSelect.displayName = "SearchableSelect";
+
+// src/currency-input.tsx
+import * as React9 from "react";
+
+// src/masks.ts
+function maskCurrency(value) {
+  const numValue = typeof value === "string" ? parseFloat(value.replace(/\D/g, "")) / 100 : typeof value === "number" ? value : 0;
+  if (isNaN(numValue) || numValue === 0) return "";
+  return new Intl.NumberFormat("pt-BR", {
+    minimumFractionDigits: 2,
+    maximumFractionDigits: 2
+  }).format(numValue);
+}
+function unmaskCurrency(value) {
+  if (!value || value.trim() === "") return 0;
+  const cleaned = value.replace(/[^\d,.-]/g, "");
+  if (cleaned === "") return 0;
+  if (cleaned.includes(",")) {
+    const normalized = cleaned.replace(/\./g, "").replace(",", ".");
+    const numValue = parseFloat(normalized);
+    return isNaN(numValue) ? 0 : numValue;
+  }
+  const parts = cleaned.split(".");
+  if (parts.length === 2 && parts[1].length <= 2) {
+    return parseFloat(cleaned) || 0;
+  }
+  if (parts.length > 1) {
+    return parseFloat(cleaned.replace(/\./g, "")) || 0;
+  }
+  return parseFloat(cleaned) || 0;
+}
+
+// src/currency-input.tsx
+import { jsx as jsx11, jsxs as jsxs5 } from "react/jsx-runtime";
+var CurrencyInput = React9.forwardRef(
+  ({ className, value, onChange, error, ...props }, ref) => {
+    const [displayValue, setDisplayValue] = React9.useState("");
+    React9.useEffect(() => {
+      if (value === void 0 || value === null || value === "" || value === 0) {
+        setDisplayValue("");
+        return;
+      }
+      const numValue = typeof value === "string" ? parseFloat(value) : value;
+      setDisplayValue(!isNaN(numValue) && numValue > 0 ? maskCurrency(numValue) : "");
+    }, [value]);
+    const handleChange = (e) => {
+      const inputValue = e.target.value;
+      const cleaned = inputValue.replace(/[^\d,.-]/g, "");
+      if (cleaned === "" || cleaned.replace(/\D/g, "") === "") {
+        setDisplayValue("");
+        onChange?.(0);
+        return;
+      }
+      setDisplayValue(cleaned);
+      onChange?.(unmaskCurrency(cleaned));
+    };
+    const handleBlur = (e) => {
+      const cleaned = e.target.value.replace(/[^\d,.-]/g, "");
+      if (cleaned === "" || cleaned.replace(/\D/g, "") === "") {
+        setDisplayValue("");
+        onChange?.(0);
+      } else {
+        const numericValue = unmaskCurrency(cleaned);
+        setDisplayValue(maskCurrency(numericValue));
+        onChange?.(numericValue);
+      }
+      props.onBlur?.(e);
+    };
+    return /* @__PURE__ */ jsxs5("div", { className: "relative", children: [
+      /* @__PURE__ */ jsx11("span", { className: "absolute left-4 top-1/2 -translate-y-1/2 text-gray-500 text-sm", children: "R$" }),
+      /* @__PURE__ */ jsx11(
+        Input,
+        {
+          ...props,
+          ref,
+          type: "text",
+          value: displayValue,
+          onChange: handleChange,
+          onBlur: handleBlur,
+          className: cn("pl-10", error && "border-red-500 focus:ring-red-500 focus:border-red-500", className),
+          placeholder: "0,00"
+        }
+      )
+    ] });
+  }
+);
+CurrencyInput.displayName = "CurrencyInput";
+
+// src/logo.tsx
+import * as React10 from "react";
+import Image from "next/image";
+import { jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
+var sizeClasses = {
+  sm: { width: 100, height: 30 },
+  md: { width: 140, height: 42 },
+  lg: { width: 180, height: 54 },
+  xl: { width: 220, height: 66 }
+};
+var DomifyLogo = React10.forwardRef(
+  ({ className, size = "md", showTagline = false, variant = "orange", ...props }, ref) => {
+    const taglineColor = variant === "orange" ? "text-[#FF7A00]" : "text-gray-300";
+    const logoSrc = `/logo_${variant}.png`;
+    const dimensions = sizeClasses[size];
+    return /* @__PURE__ */ jsxs6("div", { ref, className: cn("inline-block", className), ...props, children: [
+      /* @__PURE__ */ jsx12(
+        Image,
+        {
+          src: logoSrc,
+          alt: "Domify",
+          width: dimensions.width,
+          height: dimensions.height,
+          priority: true,
+          className: "object-contain",
+          style: { width: "auto", height: "auto" }
+        }
+      ),
+      showTagline ? /* @__PURE__ */ jsx12(
+        "p",
+        {
+          className: cn("text-xs mt-1", taglineColor, {
+            "mt-0.5": size === "sm"
+          }),
+          style: { fontFamily: "Inter", fontWeight: 300 },
+          children: "Gestao Inteligente de Imoveis"
+        }
+      ) : null
+    ] });
+  }
+);
+DomifyLogo.displayName = "DomifyLogo";
+export {
+  Button,
+  Checkbox,
+  CurrencyInput,
+  DashboardSkeleton,
+  DetailPageSkeleton,
+  DomifyLogo,
+  FormSkeleton,
+  Input,
+  ListItemSkeleton,
+  Pagination,
+  PaginationCompact,
+  PropertyCardSkeleton,
+  SearchableSelect,
+  Select,
+  Skeleton,
+  StatsCardSkeleton,
+  Switch,
+  TableRowSkeleton,
+  TableSkeleton,
+  Tabs,
+  TabsContent,
+  TabsList,
+  TabsTrigger,
+  Textarea
+};
+//# sourceMappingURL=index.js.map