chore: sync staging

src/components/tickets/new-ticket-dialog.tsx

@@ -36,6 +36,8 @@ import { normalizeCustomFieldInputs } from "@/lib/ticket-form-helpers"
 import type { TicketFormDefinition, TicketFormFieldDefinition } from "@/lib/ticket-form-types"
 import { Calendar as CalendarIcon } from "lucide-react"
 
+type TriggerVariant = "button" | "card"
+
 type CustomerOption = {
   id: string
   name: string
@@ -113,7 +115,13 @@ const schema = z.object({
   subcategoryId: z.string().min(1, "Selecione uma categoria secundária"),
 })
 
-export function NewTicketDialog({ triggerClassName }: { triggerClassName?: string } = {}) {
+export function NewTicketDialog({
+  triggerClassName,
+  triggerVariant = "button",
+}: {
+  triggerClassName?: string
+  triggerVariant?: TriggerVariant
+} = {}) {
   const [open, setOpen] = useState(false)
   const [loading, setLoading] = useState(false)
   const calendarTimeZone = useLocalTimeZone()
@@ -558,18 +566,41 @@ export function NewTicketDialog({ triggerClassName }: { triggerClassName?: strin
     }
   }
 
+  const cardTrigger = (
+    <button
+      type="button"
+      className={cn(
+        "rounded-2xl border border-slate-900 bg-neutral-950 px-4 py-4 text-left text-white shadow-lg shadow-black/30 transition hover:-translate-y-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/40",
+        "flex h-28 min-w-[220px] flex-1 flex-col justify-between",
+        triggerClassName
+      )}
+    >
+      <span className="text-xs font-semibold uppercase tracking-wide text-white/60">Atalho</span>
+      <div className="space-y-1">
+        <p className="text-lg font-semibold leading-tight">Novo ticket</p>
+        <p className="text-xs text-white/70">Abrir chamado manualmente</p>
+      </div>
+    </button>
+  )
+
+  const buttonTrigger = (
+    <Button
+      size="sm"
+      className={cn(
+        "rounded-lg border border-black bg-black px-3 py-1.5 text-sm font-semibold text-white transition hover:bg-[#18181b]/85 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#18181b]/30",
+        triggerClassName
+      )}
+    >
+      Novo ticket
+    </Button>
+  )
+
   return (
     <Dialog open={open} onOpenChange={setOpen}>
       <DialogTrigger asChild>
-        <Button
-          size="sm"
-          className={cn(
-            "rounded-lg border border-black bg-black px-3 py-1.5 text-sm font-semibold text-white transition hover:bg-[#18181b]/85 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#18181b]/30",
-            triggerClassName
-          )}
-        >
-          Novo ticket
-        </Button>
+        {triggerVariant === "card"
+          ? cardTrigger
+          : buttonTrigger}
       </DialogTrigger>
       <DialogContent className="max-w-4xl gap-0 overflow-hidden rounded-3xl border border-slate-200 bg-white p-0 shadow-2xl lg:max-w-5xl">
         <div className="max-h-[88vh] overflow-y-auto">