@motor-hero/ui-kit 0.46.1 → 0.48.0

package/dist/components/base-dialog.d.ts

@@ -49,15 +49,26 @@ export interface BaseDialogProps {
 }
 /**
  * Standardized, responsive dialog shell:
- * - mobile: bottom sheet (full width, up to 92dvh tall)
+ * - mobile: bottom sheet that can grow to nearly the whole screen
  * - desktop: centered dialog (up to 92dvh tall)
  * Header and footer stay fixed; only the body scrolls.
  *
+ * The mobile ceiling is the screen minus a slim top gap (safe area or
+ * 0.75rem, whichever is larger): a long form gets virtually the whole
+ * screen — the old 92dvh cap wasted ~70px on the one device where height is
+ * scarce — while the rounded top and the sliver of scrim above it keep the
+ * sheet language every other mobile surface in this kit speaks (combobox,
+ * pickers, menus are all `rounded-t-2xl` bottom sheets). An edge-to-edge
+ * square dialog here read as a foreign screen, not a layer of this app.
+ * Short dialogs still hug their content instead of stretching.
+ *
  * Heights use `dvh`, not `vh`: on iOS `vh` is locked to the large viewport
- * (toolbars collapsed), so `92vh` can exceed the visible area by 10-15%. With
- * the sheet anchored to `bottom-0` the overflow leaves through the top, and
- * since the body is the only scrollable child, what goes off-screen is the
- * header - title and close button. Does not reproduce outside real iOS.
+ * (toolbars collapsed), so a `vh` cap can exceed the visible area by
+ * 10-15%. With the sheet anchored to `bottom-0` the overflow leaves
+ * through the top, and since the body is the only scrollable child, what
+ * goes off-screen is the header - title and close button. Does not
+ * reproduce outside real iOS. The footer pads for the home indicator
+ * (`env(safe-area-inset-bottom)`); the top gap already clears the notch.
  *
  * Also fixes the known Radix bug where `body { pointer-events: none }`
  * can persist after closing a dialog that contained a Select/Popover,

package/dist/components/base-dialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"base-dialog.d.ts","sourceRoot":"","sources":["../../src/components/base-dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAKtC,QAAA,MAAM,WAAW;;;;;;;;;;;CAWP,CAAA;AAEV,MAAM,MAAM,cAAc,GAAG,MAAM,OAAO,WAAW,CAAA;AAErD,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACrC,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,QAAQ,EAAE,SAAS,CAAA;IACnB,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,IAAI,CAAC,EAAE,cAAc,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,OAAO,CAAA;IACf;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB;;;;;OAKG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B;;;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,SAAS,KAAK,SAAS,CAAA;CACnD;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,UAAU,CAAC,EACzB,IAAI,EACJ,YAAY,EACZ,KAAK,EACL,WAAW,EACX,QAAQ,EACR,MAAM,EACN,IAAW,EACX,SAAS,EACT,KAAK,EACL,YAAmB,EACnB,iBAAiB,EACjB,cAAqC,GACtC,EAAE,eAAe,qBAuFjB"}
+{"version":3,"file":"base-dialog.d.ts","sourceRoot":"","sources":["../../src/components/base-dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAKtC,QAAA,MAAM,WAAW;;;;;;;;;;;CAWP,CAAA;AAEV,MAAM,MAAM,cAAc,GAAG,MAAM,OAAO,WAAW,CAAA;AAErD,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACrC,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,QAAQ,EAAE,SAAS,CAAA;IACnB,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,IAAI,CAAC,EAAE,cAAc,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,OAAO,CAAA;IACf;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB;;;;;OAKG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B;;;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,SAAS,KAAK,SAAS,CAAA;CACnD;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,UAAU,CAAC,EACzB,IAAI,EACJ,YAAY,EACZ,KAAK,EACL,WAAW,EACX,QAAQ,EACR,MAAM,EACN,IAAW,EACX,SAAS,EACT,KAAK,EACL,YAAmB,EACnB,iBAAiB,EACjB,cAAqC,GACtC,EAAE,eAAe,qBA2FjB"}

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

@@ -1 +1 @@
-{"version":3,"file":"pagination.d.ts","sourceRoot":"","sources":["../../src/components/pagination.tsx"],"names":[],"mappings":"AAAA,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,MAAM,CAAA;IACZ,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IACpC,WAAW,EAAE,OAAO,CAAA;IACpB,eAAe,EAAE,OAAO,CAAA;IACxB,yFAAyF;IACzF,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,uGAAuG;IACvG,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,gBAAgB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IACzC,eAAe,CAAC,EAAE,MAAM,EAAE,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAKD,wBAAgB,UAAU,CAAC,EACzB,IAAI,EACJ,YAAY,EACZ,WAAW,EACX,eAAe,EACf,UAAU,EACV,oBAA4B,EAC5B,QAAQ,EACR,gBAAgB,EAChB,eAAe,EACf,SAAS,GACV,EAAE,eAAe,+BAgDjB"}
+{"version":3,"file":"pagination.d.ts","sourceRoot":"","sources":["../../src/components/pagination.tsx"],"names":[],"mappings":"AAAA,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,MAAM,CAAA;IACZ,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IACpC,WAAW,EAAE,OAAO,CAAA;IACpB,eAAe,EAAE,OAAO,CAAA;IACxB,yFAAyF;IACzF,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,uGAAuG;IACvG,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,gBAAgB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IACzC,eAAe,CAAC,EAAE,MAAM,EAAE,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAMD,wBAAgB,UAAU,CAAC,EACzB,IAAI,EACJ,YAAY,EACZ,WAAW,EACX,eAAe,EACf,UAAU,EACV,oBAA4B,EAC5B,QAAQ,EACR,gBAAgB,EAChB,eAAe,EACf,SAAS,GACV,EAAE,eAAe,+BAmDjB"}

package/dist/components/responsive-data-view.d.ts

@@ -16,7 +16,14 @@ interface ResponsiveDataViewProps {
     /** CTA do estado vazio — normalmente o mesmo botão "Adicionar X" da página. */
     emptyAction?: ReactNode;
     pagination?: ReactNode;
+    /**
+     * A partir de qual largura a tabela substitui os cards. Padrão `md`. Use
+     * `lg`/`xl` quando a tabela tem colunas demais para caber ao lado da barra
+     * lateral num tablet — os cards leem melhor do que uma tabela rolando de lado.
+     */
+    breakpoint?: ResponsiveDataViewBreakpoint;
 }
-export declare function ResponsiveDataView({ table, cards, isEmpty, isLoading, isBusy, emptyIcon, emptyTitle, emptyDescription, emptyAction, pagination, }: ResponsiveDataViewProps): import("react").JSX.Element;
+export type ResponsiveDataViewBreakpoint = "md" | "lg" | "xl";
+export declare function ResponsiveDataView({ table, cards, isEmpty, isLoading, isBusy, emptyIcon, emptyTitle, emptyDescription, emptyAction, pagination, breakpoint, }: ResponsiveDataViewProps): import("react").JSX.Element;
 export {};
 //# sourceMappingURL=responsive-data-view.d.ts.map

package/dist/components/responsive-data-view.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"responsive-data-view.d.ts","sourceRoot":"","sources":["../../src/components/responsive-data-view.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAKtC,UAAU,uBAAuB;IAC/B,KAAK,EAAE,SAAS,CAAA;IAChB,KAAK,EAAE,SAAS,CAAA;IAChB,OAAO,EAAE,OAAO,CAAA;IAChB,SAAS,EAAE,OAAO,CAAA;IAClB;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,+EAA+E;IAC/E,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,UAAU,CAAC,EAAE,SAAS,CAAA;CACvB;AAED,wBAAgB,kBAAkB,CAAC,EACjC,KAAK,EACL,KAAK,EACL,OAAO,EACP,SAAS,EACT,MAAc,EACd,SAAS,EACT,UAAyC,EACzC,gBAAgB,EAChB,WAAW,EACX,UAAU,GACX,EAAE,uBAAuB,+BAmCzB"}
+{"version":3,"file":"responsive-data-view.d.ts","sourceRoot":"","sources":["../../src/components/responsive-data-view.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAKtC,UAAU,uBAAuB;IAC/B,KAAK,EAAE,SAAS,CAAA;IAChB,KAAK,EAAE,SAAS,CAAA;IAChB,OAAO,EAAE,OAAO,CAAA;IAChB,SAAS,EAAE,OAAO,CAAA;IAClB;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,+EAA+E;IAC/E,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB;;;;OAIG;IACH,UAAU,CAAC,EAAE,4BAA4B,CAAA;CAC1C;AAED,MAAM,MAAM,4BAA4B,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;AAY7D,wBAAgB,kBAAkB,CAAC,EACjC,KAAK,EACL,KAAK,EACL,OAAO,EACP,SAAS,EACT,MAAc,EACd,SAAS,EACT,UAAyC,EACzC,gBAAgB,EAChB,WAAW,EACX,UAAU,EACV,UAAiB,GAClB,EAAE,uBAAuB,+BAqCzB"}

package/dist/components/row-actions-menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"row-actions-menu.d.ts","sourceRoot":"","sources":["../../src/components/row-actions-menu.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,SAAS,EAAY,MAAM,OAAO,CAAA;AAIhD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAGzC,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAGlB,QAAQ,CAAC,EAAE,SAAS,EAAE,CAAA;CACvB;AAED,MAAM,WAAW,mBAAmB;IAClC,OAAO,EAAE,SAAS,EAAE,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAA;IAClC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,UAAU,CAAC,EAAE,UAAU,CAAA;CACxB;AAWD,wBAAgB,cAAc,CAAC,EAC7B,OAAO,EACP,QAAgB,EAChB,KAAa,EACb,KAAe,EACf,UAA8B,GAC/B,EAAE,mBAAmB,sCA2LrB"}
+{"version":3,"file":"row-actions-menu.d.ts","sourceRoot":"","sources":["../../src/components/row-actions-menu.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,SAAS,EAAY,MAAM,OAAO,CAAA;AAIhD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAGzC,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAGlB,QAAQ,CAAC,EAAE,SAAS,EAAE,CAAA;CACvB;AAED,MAAM,WAAW,mBAAmB;IAClC,OAAO,EAAE,SAAS,EAAE,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAA;IAClC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,UAAU,CAAC,EAAE,UAAU,CAAA;CACxB;AAYD,wBAAgB,cAAc,CAAC,EAC7B,OAAO,EACP,QAAgB,EAChB,KAAa,EACb,KAAe,EACf,UAA8B,GAC/B,EAAE,mBAAmB,sCA2LrB"}

package/dist/index.cjs

@@ -186,7 +186,7 @@ function UserMenu({
     "button",
     {
       type: "button",
-      className: "inline-flex h-9 w-9 items-center justify-center overflow-hidden rounded-full border border-input bg-background text-xs font-semibold shadow-sm transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+      className: "inline-flex h-9 w-9 max-sm:h-10 max-sm:w-10 items-center justify-center overflow-hidden rounded-full border border-input bg-background text-xs font-semibold shadow-sm transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
       "aria-label": "Menu do usu\xE1rio",
       "data-testid": "user-menu",
       children: user?.avatarUrl ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
@@ -421,7 +421,7 @@ function AppShell({
           {
             type: "button",
             onClick: () => setMobileOpen(true),
-            className: "inline-flex h-9 w-9 items-center justify-center rounded-md border border-input bg-background shadow-sm transition-colors hover:bg-accent hover:text-accent-foreground md:hidden",
+            className: "inline-flex h-9 w-9 max-sm:h-10 max-sm:w-10 items-center justify-center rounded-md border border-input bg-background shadow-sm transition-colors hover:bg-accent hover:text-accent-foreground md:hidden",
             "aria-label": "Abrir menu",
             children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_lucide_react2.Menu, { className: "h-4 w-4" })
           }
@@ -506,7 +506,7 @@ function BaseDialog({
       )
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "min-h-0 flex-1 overflow-y-auto px-6 py-4", children }),
-    footer && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "flex shrink-0 flex-col-reverse gap-2 border-t px-6 py-3 sm:flex-row sm:justify-end", children: footer })
+    footer && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "flex shrink-0 flex-col-reverse gap-2 border-t px-6 py-3 pb-[max(0.75rem,env(safe-area-inset-bottom))] sm:flex-row sm:justify-end", children: footer })
   ] });
   const isModal = modal ?? !isDesktop;
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Dialog.Root, { open, onOpenChange, modal: isModal, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(Dialog.Portal, { children: [
@@ -542,9 +542,13 @@ function BaseDialog({
           document.body.style.pointerEvents = "";
         },
         className: cn(
-          "fixed z-50 flex max-h-[92dvh] flex-col bg-background shadow-lg outline-none",
-          "inset-x-0 bottom-0 rounded-t-2xl",
-          "sm:inset-x-auto sm:bottom-auto sm:left-1/2 sm:top-1/2 sm:max-h-[92dvh] sm:w-full sm:-translate-x-1/2 sm:-translate-y-1/2 sm:rounded-lg",
+          "fixed z-50 flex w-full flex-col bg-background shadow-lg outline-none",
+          "inset-x-0 bottom-0 rounded-t-2xl max-h-[calc(100dvh_-_max(0.75rem,env(safe-area-inset-top)))]",
+          // Entra deslizando de baixo, como os drawers (vaul) do restante do
+          // kit; no desktop os slides sairiam brigando com o translate de
+          // centralização, então ficam restritos ao mobile.
+          "max-sm:slide-in-from-bottom-8 max-sm:slide-out-to-bottom-8",
+          "sm:inset-x-auto sm:bottom-auto sm:left-1/2 sm:top-1/2 sm:max-h-[92dvh] sm:-translate-x-1/2 sm:-translate-y-1/2 sm:rounded-lg",
           "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
           sizeClasses[size],
           className
@@ -1253,7 +1257,7 @@ function DatePickerImpl({
         "aria-haspopup": "dialog",
         "aria-expanded": open,
         onClick: () => setOpen(!open),
-        className: "absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground transition-colors hover:text-foreground disabled:pointer-events-none disabled:opacity-50",
+        className: "absolute right-1 top-1/2 inline-flex size-8 -translate-y-1/2 items-center justify-center rounded-md text-muted-foreground transition-colors hover:text-foreground disabled:pointer-events-none disabled:opacity-50",
         children: withTime ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_lucide_react7.Clock, { className: "h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_lucide_react7.CalendarIcon, { className: "h-4 w-4" })
       }
     )
@@ -1784,7 +1788,7 @@ function ModeToggle() {
       "button",
       {
         type: "button",
-        className: "relative inline-flex h-9 w-9 items-center justify-center rounded-md border border-input bg-background text-sm font-medium shadow-sm transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring",
+        className: "relative inline-flex h-9 w-9 max-sm:h-10 max-sm:w-10 items-center justify-center rounded-md border border-input bg-background text-sm font-medium shadow-sm transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring",
         "aria-label": "Alternar tema",
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react9.Sun, { className: "h-4 w-4 rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" }),
@@ -2040,7 +2044,7 @@ function PageHeader({ title, description, action, className }) {
 
 // src/components/pagination.tsx
 var import_jsx_runtime23 = require("react/jsx-runtime");
-var navButtonClass2 = "inline-flex h-8 items-center justify-center rounded-md border border-input bg-background px-3 text-xs font-medium shadow-sm transition-colors hover:bg-accent hover:text-accent-foreground cursor-pointer disabled:pointer-events-none disabled:opacity-50";
+var navButtonClass2 = "inline-flex h-8 max-sm:h-10 items-center justify-center rounded-md border border-input bg-background px-3 text-xs font-medium shadow-sm transition-colors hover:bg-accent hover:text-accent-foreground cursor-pointer disabled:pointer-events-none disabled:opacity-50";
 function Pagination({
   page,
   onPageChange,
@@ -2056,7 +2060,7 @@ function Pagination({
   return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
     "div",
     {
-      className: `flex items-center ${showPageSizeSelector ? "justify-between" : "justify-end"} gap-4 ${className ?? ""}`,
+      className: `flex flex-wrap items-center ${showPageSizeSelector ? "justify-between" : "justify-end"} gap-x-4 gap-y-2 ${className ?? ""}`,
       children: [
         showPageSizeSelector && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex items-center gap-2", children: [
           /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("label", { htmlFor: "pagination-page-size", className: "text-sm text-muted-foreground", children: "Itens por p\xE1gina" }),
@@ -2066,7 +2070,7 @@ function Pagination({
               id: "pagination-page-size",
               value: pageSize,
               onChange: (e) => onPageSizeChange?.(Number(e.target.value)),
-              className: "h-8 rounded-md border border-input bg-background px-2 text-xs font-medium shadow-sm transition-colors hover:bg-accent focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring cursor-pointer",
+              className: "h-8 max-sm:h-10 rounded-md border border-input bg-background px-2 text-xs font-medium shadow-sm transition-colors hover:bg-accent focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring cursor-pointer",
               children: (pageSizeOptions ?? []).map((size) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("option", { value: size, children: size }, size))
             }
           )
@@ -2126,7 +2130,7 @@ var PasswordInput = React9.forwardRef(({ containerClassName, className, ...props
         onClick: () => setVisible((prev) => !prev),
         "aria-label": visible ? "Ocultar senha" : "Mostrar senha",
         tabIndex: -1,
-        className: "absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground transition-colors hover:text-foreground",
+        className: "absolute right-1 top-1/2 inline-flex size-8 -translate-y-1/2 items-center justify-center rounded-md text-muted-foreground transition-colors hover:text-foreground",
         children: visible ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react11.EyeOff, { className: "h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react11.Eye, { className: "h-4 w-4" })
       }
     )
@@ -2172,6 +2176,11 @@ function ProgressBar({
 
 // src/components/responsive-data-view.tsx
 var import_jsx_runtime26 = require("react/jsx-runtime");
+var BREAKPOINT_CLASSES = {
+  md: { table: "md:block", cards: "md:hidden" },
+  lg: { table: "lg:block", cards: "lg:hidden" },
+  xl: { table: "xl:block", cards: "xl:hidden" }
+};
 function ResponsiveDataView({
   table,
   cards,
@@ -2182,7 +2191,8 @@ function ResponsiveDataView({
   emptyTitle = "Nenhum registro encontrado",
   emptyDescription,
   emptyAction,
-  pagination
+  pagination,
+  breakpoint = "md"
 }) {
   if (!isLoading && !isBusy && isEmpty) {
     return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "rounded-md border", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
@@ -2196,19 +2206,21 @@ function ResponsiveDataView({
     ) });
   }
   const busyClass = isBusy && "pointer-events-none opacity-50";
+  const visibility = BREAKPOINT_CLASSES[breakpoint];
   return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "space-y-4", children: [
     /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
       "div",
       {
         "aria-busy": isBusy,
         className: cn(
-          "hidden overflow-x-auto rounded-md border transition-opacity md:block",
+          "hidden overflow-x-auto rounded-md border transition-opacity",
+          visibility.table,
           busyClass
         ),
         children: table
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { "aria-busy": isBusy, className: cn("transition-opacity md:hidden", busyClass), children: cards }),
+    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { "aria-busy": isBusy, className: cn("transition-opacity", visibility.cards, busyClass), children: cards }),
     pagination
   ] });
 }
@@ -2219,7 +2231,7 @@ var import_lucide_react12 = require("lucide-react");
 var import_react7 = require("react");
 var import_vaul6 = require("vaul");
 var import_jsx_runtime27 = require("react/jsx-runtime");
-var triggerClass = "inline-flex h-8 w-8 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50";
+var triggerClass = "inline-flex h-8 w-8 max-sm:h-10 max-sm:w-10 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50";
 var itemClass2 = "flex w-full cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors hover:bg-accent focus:bg-accent data-[disabled]:pointer-events-none data-[disabled]:opacity-50";
 var sheetItemClass2 = "flex w-full cursor-pointer select-none items-center gap-3 rounded-md px-3 py-3 text-base outline-none transition-colors hover:bg-accent active:bg-accent disabled:pointer-events-none disabled:opacity-50";
 function RowActionsMenu({