PageSourceSearch

https://luxuryleasing.de/assets/Styleguide-B4ehwhWr.js

js luxuryleasing.de collected 2026-10-08 07:13:07 UTC 48,708 bytes, 53 lines download raw bytes

1import{j as e}from"./query-vendor-DVmmQ-ki.js";import{r as z}from"./react-vendor-BURXZ51T.js";import{h as b,B as s}from"./index-DpP3iEYK.js";import{C as t,b as l,c as i,d as n,a as r,e as p}from"./card-DwBoygcx.js";import{I as y}from"./input-Bx2apBJb.js";import{L as d}from"./label-CiQuxLS0.js";import{T as W}from"./textarea-DHmKlUYM.js";import{C as k}from"./checkbox-CRf3IHWH.js";import{R as ie,a as U}from"./radio-group-Dnhgh9d-.js";import{S as N}from"./switch-Cp3FZ6fH.js";import{S as B,a as D,b as F,c as T,d as j}from"./select-u_D-otHI.js";import{B as x}from"./badge-BrFuXnAq.js";import{S as c}from"./separator-DkK0XzuW.js";import{T as P,a as L,b as f,c as m,d as A,e as o}from"./table-DGTNs8pb.js";import{T as re,a as ne,b as u,c as g}from"./tabs-CH4KCsyR.js";import{D as de,e as ce,a as xe,b as he,c as me,d as oe,f as je}from"./dialog-BPS4FN9z.js";import{u as ue}from"./index-Rp47IaA2.js";import{T as Z}from"./type-_OE4GBKT.js";import{P as Q}from"./palette-Duc-5q2O.js";import{L as H}from"./layers-CP87q9sX.js";import{S as h}from"./sparkles-BT5dtObF.js";import{E as ge}from"./eye-BOQecZvW.js";import{C as Y}from"./check-Dwauox-g.js";import{C as J}from"./copy-CJmodTUB.js";import{I as pe}from"./image-CMWh5GdR.js";import"./radix-slot-BTvEbTmE.js";import"./ui-radix-LBOF5AHa.js";import"./circle-BqCuy5sH.js";import"./x-CrVVxRiw.js";/**
2 * @license lucide-react v0.462.0 - ISC
3 *
4 * This source code is licensed under the ISC license.
5 * See the LICENSE file in the root directory of this source tree.
6 */const X=b("Moon",[["path",{d:"M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z",key:"a7tn18"}]]);/**
7 * @license lucide-react v0.462.0 - ISC
8 *
9 * This source code is licensed under the ISC license.
10 * See the LICENSE file in the root directory of this source tree.
11 */const _=b("RectangleEllipsis",[["rect",{width:"20",height:"12",x:"2",y:"6",rx:"2",key:"9lu3g6"}],["path",{d:"M12 12h.01",key:"1mp3jc"}],["path",{d:"M17 12h.01",key:"1m0b6t"}],["path",{d:"M7 12h.01",key:"eqddd0"}]]);/**
12 * @license lucide-react v0.462.0 - ISC
13 *
14 * This source code is licensed under the ISC license.
15 * See the LICENSE file in the root directory of this source tree.
16 */const ee=b("Square",[["rect",{width:"18",height:"18",x:"3",y:"3",rx:"2",key:"afitv7"}]]);/**
17 * @license lucide-react v0.462.0 - ISC
18 *
19 * This source code is licensed under the ISC license.
20 * See the LICENSE file in the root directory of this source tree.
21 */const E=b("Sun",[["circle",{cx:"12",cy:"12",r:"4",key:"4exip2"}],["path",{d:"M12 2v2",key:"tus03m"}],["path",{d:"M12 20v2",key:"1lh1kg"}],["path",{d:"m4.93 4.93 1.41 1.41",key:"149t6j"}],["path",{d:"m17.66 17.66 1.41 1.41",key:"ptbguv"}],["path",{d:"M2 12h2",key:"1t8f8n"}],["path",{d:"M20 12h2",key:"1q8mjw"}],["path",{d:"m6.34 17.66-1.41 1.41",key:"1m8zz5"}],["path",{d:"m19.07 4.93-1.41 1.41",key:"1shlcs"}]]);/**
22 * @license lucide-react v0.462.0 - ISC
23 *
24 * This source code is licensed under the ISC license.
25 * See the LICENSE file in the root directory of this source tree.
26 */const se=b("Table",[["path",{d:"M12 3v18",key:"108xh3"}],["rect",{width:"18",height:"18",x:"3",y:"3",rx:"2",key:"afitv7"}],["path",{d:"M3 9h18",key:"1pudct"}],["path",{d:"M3 15h18",key:"5xshup"}]]),fe="/assets/styleguide-bg-DxrfZ379.jpg",Ze=()=>{var $;const[M,I]=z.useState(null),[C,V]=z.useState("slate-purple"),[S,ae]=z.useState("ferrari"),K=(a,w)=>{navigator.clipboard.writeText(a),I(w),ue.success(`${w} kopiert!`),setTimeout(()=>I(null),2e3)},O=[{name:"Background",var:"--background",class:"bg-background"},{name:"Foreground",var:"--foreground",class:"bg-foreground"},{name:"Card",var:"--card",class:"bg-card"},{name:"Card Foreground",var:"--card-foreground",class:"bg-card-foreground"},{name:"Primary",var:"--primary",class:"bg-primary"},{name:"Primary Foreground",var:"--primary-foreground",class:"bg-primary-foreground"},{name:"Secondary",var:"--secondary",class:"bg-secondary"},{name:"Secondary Foreground",var:"--secondary-foreground",class:"bg-secondary-foreground"},{name:"Muted",var:"--muted",class:"bg-muted"},{name:"Muted Foreground",var:"--muted-foreground",class:"bg-muted-foreground"},{name:"Accent",var:"--accent",class:"bg-accent"},{name:"Accent Foreground",var:"--accent-foreground",class:"bg-accent-foreground"},{name:"Destructive",var:"--destructive",class:"bg-destructive"},{name:"Border",var:"--border",class:"bg-border"},{name:"Ring",var:"--ring",class:"bg-ring"}],te=[{name:"glass-lufga",description:"Primärer Glaseffekt mit Blur"},{name:"glass-chrome",description:"Chrome-artiger Glaseffekt"},{name:"glass-card",description:"Card mit Glasmorphismus"},{name:"glass-lufga-strong",description:"Verstärkter Glaseffekt"},{name:"glass-slider-track",description:"Slider Track Effekt"}],v=[{id:"slate-purple",name:"Slate → Purple",class:"bg-gradient-to-br from-slate-900 via-purple-900/50 to-slate-900"},{id:"black-slate",name:"Black → Slate",class:"bg-gradient-to-br from-black via-slate-900 to-black"},{id:"blue-cyan",name:"Blue → Cyan",class:"bg-gradient-to-br from-blue-950 via-cyan-900/30 to-blue-950"},{id:"emerald-teal",name:"Emerald → Teal",class:"bg-gradient-to-br from-emerald-950 via-teal-900/30 to-emerald-950"},{id:"rose-orange",name:"Rose → Orange",class:"bg-gradient-to-br from-rose-950 via-orange-900/30 to-rose-950"},{id:"neutral-dark",name:"Neutral Dark",class:"bg-gradient-to-br from-neutral-950 via-neutral-900 to-neutral-950"},{id:"gray-black",name:"Grau → Schwarz",class:"bg-gradient-to-br from-zinc-800 via-neutral-900 to-black"},{id:"light-gray",name:"Website Grau",class:"bg-gradient-to-br from-[#D1D1D1
26] via-[#BDBDBD] to-[#D1D1D1]"}],q=[{id:"ferrari",name:"Ferrari",icon:pe},{id:"black-gray",name:"Schwarz → Grau",class:"bg-gradient-to-br from-black via-zinc-900 to-gray-800"},{id:"gray-dark",name:"Grau → Dunkel",class:"bg-gradient-to-br from-zinc-800 via-neutral-900 to-black"},{id:"pure-black",name:"Pure Black",class:"bg-gradient-to-br from-black via-neutral-950 to-black"}],le=()=>{var a;return((a=q.find(w=>w.id===S))==null?void 0:a.class)||""},G=[{id:1,name:"BMW M4 Competition",price:"89.900 €",status:"Verfügbar"},{id:2,name:"Porsche 911 GT3",price:"199.500 €",status:"Reserviert"},{id:3,name:"Mercedes AMG GT",price:"159.000 €",status:"Verkauft"}],R=(($=v.find(a=>a.id===C))==null?void 0:$.class)||v[0].class;return e.jsxs("div",{className:"space-y-8 p-6",children:[e.jsx("div",{className:"flex items-center justify-between",children:e.jsxs("div",{children:[e.jsx("h1",{className:"text-3xl font-bold tracking-tight",children:"Styleguide"}),e.jsx("p",{className:"text-muted-foreground",children:"Design System Übersicht – Alle UI-Komponenten auf einen Blick"})]})}),e.jsxs(re,{defaultValue:"typography",className:"space-y-6",children:[e.jsxs(ne,{className:"glass-lufga flex-wrap",children:[e.jsxs(u,{value:"typography",className:"gap-2",children:[e.jsx(Z,{className:"h-4 w-4"}),"Typography"]}),e.jsxs(u,{value:"colors",className:"gap-2",children:[e.jsx(Q,{className:"h-4 w-4"}),"Colors"]}),e.jsxs(u,{value:"buttons",className:"gap-2",children:[e.jsx(ee,{className:"h-4 w-4"}),"Buttons"]}),e.jsxs(u,{value:"cards",className:"gap-2",children:[e.jsx(H,{className:"h-4 w-4"}),"Cards"]}),e.jsxs(u,{value:"inputs",className:"gap-2",children:[e.jsx(_,{className:"h-4 w-4"}),"Inputs"]}),e.jsxs(u,{value:"glass",className:"gap-2",children:[e.jsx(h,{className:"h-4 w-4"}),"Glass"]}),e.jsxs(u,{value:"liquid-glass",className:"gap-2",children:[e.jsx(h,{className:"h-4 w-4"}),"Liquid Glass"]}),e.jsxs(u,{value:"tables",className:"gap-2",children:[e.jsx(se,{className:"h-4 w-4"}),"Tables"]}),e.jsxs(u,{value:"showcase",className:"gap-2",children:[e.jsx(ge,{className:"h-4 w-4"}),"Showcase"]})]}),e.jsxs(g,{value:"typography",className:"space-y-6",children:[e.jsxs(t,{children:[e.jsxs(l,{children:[e.jsx(i,{children:"Headings"}),e.jsx(n,{children:"Überschriften-Hierarchie"})]}),e.jsxs(r,{className:"space-y-4",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-xs text-muted-foreground font-mono",children:"text-4xl font-bold"}),e.jsx("h1",{className:"text-4xl font-bold",children:"Heading 1 – LuxuryLeasing"})]}),e.jsx(c,{}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-xs text-muted-foreground font-mono",children:"text-3xl font-semibold"}),e.jsx("h2",{className:"text-3xl font-semibold",children:"Heading 2 – Premium Fahrzeuge"})]}),e.jsx(c,{}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-xs text-muted-foreground font-mono",children:"text-2xl font-semibold"}),e.jsx("h3",{className:"text-2xl font-semibold",children:"Heading 3 – Kilometerleasing"})]}),e.jsx(c,{}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-xs text-muted-foreground font-mono",children:"text-xl font-medium"}),e.jsx("h4",{className:"text-xl font-medium",children:"Heading 4 – Fahrzeugdetails"})]}),e.jsx(c,{}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-xs text-muted-foreground font-mono",children:"text-lg font-medium"}),e.jsx("h5",{className:"text-lg font-medium",children:"Heading 5 – Ausstattung"})]})]})]}),e.jsxs(t,{children:[e.jsxs(l,{children:[e.jsx(i,{children:"Body Text"}),e.jsx(n,{children:"Fließtext und Absätze"})]}),e.jsxs(r,{className:"space-y-4",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-xs text-muted-foreground font-mono",children:"text-base (default)"}),e.jsx("p",{children:"LuxuryLeasing bietet exklusive Leasinglösungen für Premium- und Luxusfahrzeuge. Unser Service richtet sich an anspruchsvolle Kunden, die Wert auf Qualität und erstklassige Betreuung legen."})]}),e.jsx(c,{}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-xs text-muted-foreground font-mono",children:"text-sm text-muted-foreground"}),e.jsx("p",{className:"text-sm text-muted-foreground",children:"Kleinerer Text für Beschreibungen, Hinweise und sekundäre Informationen. Wird oft für Formular-Labels und Hilfetexte verwendet."})]}),e.jsx(c,{}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-xs text-muted-foreground font-mono",children:"text-xs"}),e.jsx("p",{className:"text-xs",children:"Extra kleiner Text für Copyright, Fußnoten und technische Details."})]})]})]})]}),e.jsxs(g,{value:"colors",className:"space-y-6",children:[e.jsxs(t,{children:[e.jsxs(l,{children:[e.jsx(i,{children:"Farbpalette"}),e.jsx(n,{children:"Semantic Color Tokens – Klicken zum Kopieren"})]}),e.jsx(r,{children:e.jsx("div",{className:"grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5 ga
26p-4",children:O.map(a=>e.jsxs("button",{onClick:()=>K(a.class,a.name),className:"group relative flex flex-col items-center gap-2 p-3 rounded-lg border border-border hover:border-primary transition-colors",children:[e.jsx("div",{className:`w-full h-16 rounded-md ${a.class} border border-border/50`}),e.jsxs("div",{className:"text-center",children:[e.jsx("p",{className:"text-sm font-medium",children:a.name}),e.jsx("p",{className:"text-xs text-muted-foreground font-mono",children:a.var})]}),e.jsx("div",{className:"absolute top-2 right-2 opacity-0 group-hover:opacity-100 transition-opacity",children:M===a.name?e.jsx(Y,{className:"h-4 w-4 text-green-500"}):e.jsx(J,{className:"h-4 w-4 text-muted-foreground"})})]},a.name))})})]}),e.jsxs("div",{className:"grid md:grid-cols-2 gap-6",children:[e.jsxs(t,{children:[e.jsx(l,{children:e.jsxs(i,{className:"flex items-center gap-2",children:[e.jsx(E,{className:"h-5 w-5"}),"Light Mode Preview"]})}),e.jsxs(r,{className:"bg-white text-black p-4 rounded-lg space-y-3",children:[e.jsx("p",{className:"font-semibold",children:"Headline Text"}),e.jsx("p",{className:"text-gray-600 text-sm",children:"Muted description text"}),e.jsxs("div",{className:"flex gap-2",children:[e.jsx("div",{className:"w-8 h-8 rounded bg-gray-100 border"}),e.jsx("div",{className:"w-8 h-8 rounded bg-gray-200"}),e.jsx("div",{className:"w-8 h-8 rounded bg-gray-900"})]})]})]}),e.jsxs(t,{children:[e.jsx(l,{children:e.jsxs(i,{className:"flex items-center gap-2",children:[e.jsx(X,{className:"h-5 w-5"}),"Dark Mode Preview"]})}),e.jsxs(r,{className:"bg-zinc-900 text-white p-4 rounded-lg space-y-3",children:[e.jsx("p",{className:"font-semibold",children:"Headline Text"}),e.jsx("p",{className:"text-zinc-400 text-sm",children:"Muted description text"}),e.jsxs("div",{className:"flex gap-2",children:[e.jsx("div",{className:"w-8 h-8 rounded bg-zinc-800 border border-zinc-700"}),e.jsx("div",{className:"w-8 h-8 rounded bg-zinc-700"}),e.jsx("div",{className:"w-8 h-8 rounded bg-white"})]})]})]})]})]}),e.jsxs(g,{value:"buttons",className:"space-y-6",children:[e.jsxs(t,{children:[e.jsxs(l,{children:[e.jsx(i,{children:"Button Varianten"}),e.jsx(n,{children:"Alle verfügbaren Button-Styles"})]}),e.jsxs(r,{className:"space-y-6",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-sm font-medium text-muted-foreground",children:"Standard Varianten"}),e.jsxs("div",{className:"flex flex-wrap gap-3",children:[e.jsx(s,{variant:"default",children:"Default"}),e.jsx(s,{variant:"secondary",children:"Secondary"}),e.jsx(s,{variant:"outline",children:"Outline"}),e.jsx(s,{variant:"ghost",children:"Ghost"}),e.jsx(s,{variant:"link",children:"Link"}),e.jsx(s,{variant:"destructive",children:"Destructive"})]})]}),e.jsx(c,{}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-sm font-medium text-muted-foreground",children:"Premium Varianten"}),e.jsxs("div",{className:"flex flex-wrap gap-3",children:[e.jsx(s,{variant:"glass",children:"Glass"}),e.jsx(s,{variant:"premium",children:"Premium"}),e.jsx(s,{variant:"floating",children:"Floating"})]})]}),e.jsx(c,{}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-sm font-medium text-muted-foreground",children:"Größen"}),e.jsxs("div",{className:"flex flex-wrap items-center gap-3",children:[e.jsx(s,{size:"sm",children:"Small"}),e.jsx(s,{size:"default",children:"Default"}),e.jsx(s,{size:"lg",children:"Large"}),e.jsx(s,{size:"icon",children:e.jsx(h,{className:"h-4 w-4"})})]})]}),e.jsx(c,{}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-sm font-medium text-muted-foreground",children:"Zustände"}),e.jsxs("div",{className:"flex flex-wrap gap-3",children:[e.jsx(s,{children:"Normal"}),e.jsx(s,{disabled:!0,children:"Disabled"})]})]})]})]}),e.jsxs(t,{children:[e.jsxs(l,{children:[e.jsx(i,{children:"Button Code"}),e.jsx(n,{children:"Verwendung im Code"})]}),e.jsx(r,{children:e.jsx("pre",{className:"bg-muted p-4 rounded-lg text-sm overflow-x-auto",children:`<Button variant="default">Default</Button>
27<Button variant="secondary">Secondary</Button>
28<Button variant="outline">Outline</Button>
29<Button variant="ghost">Ghost</Button>
30<Button variant="glass">Glass</Button>
31<Button variant="premium">Premium</Button>
32<Button variant="floating">Floating</Button>
33<Button variant="destructive">Destructive</Button>`})})]})]}),e.jsxs(g,{value:"cards",className:"space-y-6",children:[e.jsxs("div",{className:"grid md:grid-cols-2 lg:grid-cols-4 gap-6",children:[e.jsxs(t,{variant:"default",children:[e.jsxs(l,{children:[e.jsx(i,{children:"Default Card"}),e.jsx(n,{children:"Standard Card-Komponente"})]}),e.jsx(r,{children:e.jsx("p",{className:"text-sm text-muted-foreground",children:"Die Default-Variante mit solidem Hintergrund und Border."})}),e.jsx(p,{children:e.jsx(s,{variant:"outline",size:"sm",children:"Action"})})]}),e.jsxs(t,{variant:"glass",children:[e.jsxs(l,{children:[e.jsx(i,{children:"Glass Card"}),e.jsx(n,{children:"Glasmorphismus-Effekt"})]}),e.jsx(r,{children:e.jsx("p",{className:"text-sm text-muted-foreground",children:"Transparenter Hintergrund mit Blur-Effekt."})}),e.jsx(p,{children:e.jsx(s,{variant:"glass",size:"sm",children:"Action"})})]}),e.jsxs(t,{variant:"floating",children:[e.jsxs(l,{children:[e.jsx(i,{children:"Floating Card"}),e.jsx(n,{children:"Erhöhter Schatten-Effekt"})]}),e.jsx(r,{children:e.jsx("p",{className:"text-sm text-muted-foreground",children:"Card mit Hover-Lift und Premium-Schatten."})}),e.jsx(p,{children:e.jsx(s,{variant:"floating",size:"sm",children:"Action"})})]}),e.jsxs(t,{variant:"luxury",children:[e.jsxs(l,{children:[e.jsx(i,{children:"Luxury Card"}),e.jsx(n,{children:"Premium-Akzent-Border"})]}),e.jsx(r,{children:e.jsx("p",{className:"text-sm text-muted-foreground",children:"Für besonders hervorgehobene Inhalte."})}),e.jsx(p,{children:e.jsx(s,{variant:"premium",size:"sm",children:"Action"})})]})]}),e.jsxs(t,{children:[e.jsxs(l,{children:[e.jsx(i,{children:"Card Code"}),e.jsx(n,{children:"Verwendung im Code"})]}),e.jsx(r,{children:e.jsx("pre",{className:"bg-muted p-4 rounded-lg text-sm overflow-x-auto",children:`<Card variant="default">...</Card>
34<Card variant="glass">...</Card>
35<Card variant="floating">...</Card>
36<Card variant="luxury">...</Card>`})})]})]}),e.jsxs(g,{value:"inputs",className:"space-y-6",children:[e.jsxs("div",{className:"grid md:grid-cols-2 gap-6",children:[e.jsxs(t,{children:[e.jsxs(l,{children:[e.jsx(i,{children:"Text Inputs"}),e.jsx(n,{children:"Eingabefelder"})]}),e.jsxs(r,{className:"space-y-4",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx(d,{htmlFor:"input-default",children:"Default Input"}),e.jsx(y,{id:"input-default",placeholder:"Placeholder text..."})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(d,{htmlFor:"input-disabled",children:"Disabled Input"}),e.jsx(y,{id:"input-disabled",placeholder:"Disabled...",disabled:!0})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(d,{htmlFor:"textarea",children:"Textarea"}),e.jsx(W,{id:"textarea",placeholder:"Mehrzeiliger Text..."})]})]})]}),e.jsxs(t,{children:[e.jsxs(l,{children:[e.jsx(i,{children:"Select & Dropdown"}),e.jsx(n,{children:"Auswahlfelder"})]}),e.jsx(r,{className:"space-y-4",children:e.jsxs("div",{className:"space-y-2",children:[e.jsx(d,{children:"Select"}),e.jsxs(B,{children:[e.jsx(D,{children:e.jsx(F,{placeholder:"Wählen Sie eine Option..."})}),e.jsxs(T,{children:[e.jsx(j,{value:"bmw",children:"BMW"}),e.jsx(j,{value:"porsche",children:"Porsche"}),e.jsx(j,{value:"mercedes",children:"Mercedes"})]})]})]})})]}),e.jsxs(t,{children:[e.jsxs(l,{children:[e.jsx(i,{children:"Checkbox & Radio"}),e.jsx(n,{children:"Auswahloptionen"})]}),e.jsxs(r,{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center space-x-2",children:[e.jsx(k,{id:"checkbox"}),e.jsx(d,{htmlFor:"checkbox",children:"Checkbox Option"})]}),e.jsxs("div",{className:"flex items-center space-x-2",children:[e.jsx(k,{id:"checkbox-checked",defaultChecked:!0}),e.jsx(d,{htmlFor:"checkbox-checked",children:"Checked Checkbox"})]}),e.jsx(c,{}),e.jsxs(ie,{defaultValue:"option1",children:[e.jsxs("div",{className:"flex items-center space-x-2",children:[e.jsx(U,{value:"option1",id:"r1"}),e.jsx(d,{htmlFor:"r1",children:"Radio Option 1"})]}),e.jsxs("div",{className:"flex items-center space-x-2",children:[e.jsx(U,{value:"option2",id:"r2"}),e.jsx(d,{htmlFor:"r2",children:"Radio Option 2"})]})]})]})]}),e.jsxs(t,{children:[e.jsxs(l,{children:[e.jsx(i,{children:"Switch & Toggle"}),e.jsx(n,{children:"Ein/Aus Schalter"})]}),e.jsxs(r,{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsx(d,{htmlFor:"switch-1",children:"Newsletter aktivieren"}),e.jsx(N,{id:"switch-1"})]}),e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsx(d,{htmlFor:"switch-2",children:"Dark Mode"}),e.jsx(N,{id:"switch-2",defaultChecked:!0})]}),e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsx(d,{htmlFor:"switch-3",children:"Disabled"}),e.jsx(N,{id:"switch-3",disabled:!0})]})]})]})]}),e.jsxs(t,{children:[e.jsxs(l,{children:[e.jsx(i,{children:"Badges"}),e.jsx(n,{children:"Status-Indikatoren"})]}),e.jsx(r,{children:e.jsxs("div",{className:"flex flex-wrap gap-3",children:[e.jsx(x,{children:"Default"}),e.jsx(x,{variant:"secondary",children:"Secondary"}),e.jsx(x,{variant:"outline",children:"Outline"}),e.jsx(x,{variant:"destructive",children:"Destructive"})]})})]})]}),e.jsxs(g,{value:"glass",className:"space-y-6",children:[e.jsxs(t,{children:[e.jsxs(l,{children:[e.jsxs(i,{className:"flex items-center gap-2",children:[e.jsx(h,{className:"h-5 w-5"}),"Interaktive Glass Preview"]}),e.jsx(n,{children:"Wähle einen Gradient-Hintergrund um Glass-Effekte zu testen"})]}),e.jsx(r,{children:e.jsx("div",{className:"flex flex-wrap gap-2 mb-4",children:v.map(a=>e.jsx("button",{onClick:()=>V(a.id),className:`px-3 py-2 rounded-lg text-sm font-medium transition-all ${C===a.id?"bg-primary text-primary-foreground ring-2 ring-primary ring-offset-2 ring-offset-background":"bg-muted hover:bg-muted/80 text-foreground"}`,children:a.name},a.id))})})]}),e.jsxs("div",{className:`${R} p-8 rounded-2xl space-y-6`,children:[e.jsxs("div",{className:"text-center mb-6",children:[e.jsx("h2",{className:"text-2xl font-bold text-white mb-2",children:"Glass Components Preview"}),e.jsx("p",{className:"text-white/70 text-sm",children:"Glasmorphismus-Effekte auf dunklem Gradient"})]}),e.jsx("div",{className:"grid md:grid-cols-2 lg:grid-cols-3 gap-4",children:te.map(a=>e.jsxs("div",{className:`${a.name} p-6 rounded-xl border border-white/20`,children:[e.jsx("p",{className:"font-semibold mb-1 text-white",children:a.name}),e.jsx("p",{className:"text-sm text-white/70",children:a.description}),e.jsxs("code",{className:"text-xs bg-black/30 text-white/90 px-2 py-1 rounded mt-2 inline-block",children:[".",a.name]})]},a.name))}),e.jsxs("div",{className:"glass-lufga p-4 rounded-xl border border-white/20",children:[e.jsx("h3",{className:"text-lg font-semibold mb-3 text-white",children:"Glass Navigation"}),e.jsxs("div",{className:"flex gap-2 flex-wrap",children:[e.jsx(s,{variant:"ghost",size:"sm",className:"text-white hover:bg-white/10",children:"Home"}),e.jsx(s,{variant:"ghost",size:"sm",className:"text-white hover:bg-white/10",children:"Fahrzeuge"}),e.jsx(s,{variant:"ghost",size:"sm",className:"text-white hover:bg-white/10",children:"Über Uns"}),e.jsx(s,{variant:"ghost",size:"sm",className:"text-white hover:bg-white/10",children:"Kontakt"})]})]}),e.jsxs("div",{className:"grid md:grid-cols-3 gap-4",children:[e.jsxs("div",{className:"glass-lufga p-6 rounded-xl border border-white/20",children:[e.jsx("div",{className:"w-12 h-12 rounded-full bg-white/10 flex items-center justify-center mb-4",children:e.jsx(h,{className:"h-6 w-6 text-white"})}),e.jsx("h4",{className:"font-semibold text-white mb-2",children:"Feature Card"}),e.jsx("p",{className:"text-sm text-white/70",children:"Glass-Card mit Icon und Text auf dunklem Hintergrund."})]}),e.jsxs("div",{className:"glass-chrome p-6 rounded-xl border border-white/20",children:[e.jsx("div",{className:"w-12 h-12 rounded-full bg-white/10 flex items-center justify-center mb-4",children:e.jsx(H,{className:"h-6 w-6 text-white"})}),e.jsx("h4",{className:"font-semibold text-white mb-2",children:"Chrome Effect"}),e.jsx("p",{className:"text-sm text-white/70",children:"Chrome-artiger Glaseffekt mit Metallschimmer."})]}),e.jsxs("div",{className:"glass-lufga-strong p-6 rounded-xl border border-white/20",children:[e.jsx("div",{className:"w-12 h-12 rounded-full bg-white/10 flex items-center justify-center mb-4",children:e.jsx(E,{className:"h-6 w-6 text-white"})}),e.jsx("h4",{className:"font-semibold text-white mb-2",children:"Strong Glass"}),e.jsx("p",{className:"text-sm text-white/70",children:"Verstärkter Glaseffekt mit mehr Blur."})]})]}),e.jsxs("div",{className:"glass-lufga p-6 rounded-xl border border-white/20",children:[e.jsx("h3",{className:"text-lg font-semibold mb-4 text-white",children:"Glass Buttons auf Gradient"}),e.jsxs("div",{className:"flex flex-wrap gap-3",children:[e.jsx(s,{variant:"glass",children:"Glass Button"}),e.jsx(s,{variant:"outline",className:"border-white/30 text-white hover:bg-white/10",children:"Outline"}),e.jsx(s,{className:"bg-white/20 hover:bg-white/30 text-white backdrop-blur-sm",children:"Custom Glass"}),e.jsx(s,{variant:"ghost",className:"text-white hover:bg-white/10",children:"Ghost"})]})]}),e.jsxs("div",{className:"glass-lufga p-6 rounded-xl border border-white/20",children:[e.jsx("h3",{className:"text-lg font-semibold mb-4 text-white",children:"Glass Form Elements"}),e.jsxs("div",{className:"grid md:grid-cols-2 gap-4",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx(d,{className:"text-white/90",children:"Glass Input"}),e.jsx(y,{placeholder:"Enter text...",className:"bg-white/10 border-white/20 text-white placeholder:text-white/50 focus:border-white/40"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(d,{className:"text-white/90",children:"Glass Select"}),e.jsxs(B,{children:[e.jsx(D,{className:"bg-white/10 border-white/20 text-white",children:e.jsx(F,{placeholder:"Select option..."})}),e.jsxs(T,{className:"glass-lufga border-white/20",children:[e.jsx(j,{value:"1",children:"Option 1"}),e.jsx(j,{value:"2",children:"Option 2"}),e.jsx(j,{value:"3",children:"Option 3"})]})]})]})]})]})]}),e.jsxs(t,{children:[e.jsxs(l,{children:[e.jsx(i,{children:"Dialog mit Glass-Effekt"}),e.jsx(n,{children:"Modal-Beispiel"})]}),e.jsx(r,{children:e.jsxs(de,{children:[e.jsx(ce,{asChild:!0,children:e.jsx(s,{variant:"glass",children:"Dialog öffnen"})}),e.jsxs(xe,{className:"glass-lufga border-white/20",children:[e.jsxs(he,{children:[e.jsx(me,{children:"Glass Dialog"}),e.jsx(oe,{children:"Ein Dialog mit Glasmorphismus-Effekt für Premium-UI."})]}),e.jsx("div",{className:"py-4",children:e.jsx("p",{className:"text-sm text-muted-foreground",children:"Dialog-Inhalt mit transparentem Hintergrund und Blur-Effekt."})}),e.jsxs(je,{children:[e.jsx(s,{variant:"outline",children:"Abbrechen"}),e.jsx(s,{children:"Bestätigen"})]})]})]})})]})]}),e.jsxs(g,{value:"liquid-glass",className:"space-y-6",children:[e.jsxs(t,{children:[e.jsxs(l,{children:[e.jsxs(i,{className:"flex items-center gap-2",children:[e.jsx(h,{className:"h-5 w-5"}),"Liquid Glass Design System"]}),e.jsx(n,{children:"Premium Glasmorphismus mit Shimmer, Glow und Float-Effekten"})]}),e.jsx(r,{children:e.jsx("div",{className:"flex flex-wrap gap-2",children:v.map(a=>e.jsx("button",{onClick:()=>V(a.id),className:`px-3 py-2 rounded-lg text-sm font-medium transition-all ${C===a.id?"bg-primary text-primary-foreground ring-2 ring-primary ring-offset-2 ring-offset-background":"bg-muted hover:bg-muted/80 text-foreground"}`,children:a.name},a.id))})})]}),e.jsxs("div",{className:`${R} p-8 rounded-2xl space-y-8`,children:[e.jsxs("div",{className:"text-center mb-8",children:[e.jsx("h2",{className:"text-3xl font-bold text-white mb-2",children:"Liquid Glass Components"}),e.jsx("p",{className:"text-white/60 text-sm",children:"Hover über die Komponenten für animierte Effekte"})]}),e.jsxs("div",{className:"space-y-4",children:[e.jsx("h3",{className:"text-xl font-semibold text-white mb-4",children:"Authority Glass Buttons"}),e.jsxs("div",{className:"grid md:grid-cols-2 gap-6",children:[e.jsxs("div
36",{className:"space-y-4",children:[e.jsx("p",{className:"text-sm text-white/60 font-mono",children:'variant="glass"'}),e.jsxs("div",{className:"flex flex-wrap gap-3",children:[e.jsxs(s,{variant:"glass",size:"lg",children:[e.jsx(h,{className:"h-4 w-4 mr-2"}),"Authority Glass"]}),e.jsx(s,{variant:"glass",children:"Default Size"}),e.jsx(s,{variant:"glass",size:"sm",children:"Small"})]})]}),e.jsxs("div",{className:"space-y-4",children:[e.jsx("p",{className:"text-sm text-white/60 font-mono",children:'variant="premium"'}),e.jsxs("div",{className:"flex flex-wrap gap-3",children:[e.jsxs(s,{variant:"premium",size:"lg",children:[e.jsx(h,{className:"h-4 w-4 mr-2"}),"Premium Glass"]}),e.jsx(s,{variant:"premium",children:"Default"}),e.jsx(s,{variant:"premium",size:"sm",children:"Small"})]})]})]}),e.jsxs("div",{className:"space-y-4 mt-4",children:[e.jsx("p",{className:"text-sm text-white/60 font-mono",children:'variant="secondary"'}),e.jsxs("div",{className:"flex flex-wrap gap-3",children:[e.jsx(s,{variant:"secondary",size:"lg",children:"Secondary Glass"}),e.jsx(s,{variant:"secondary",children:"Default"}),e.jsx(s,{variant:"secondary",size:"sm",children:"Small"})]})]})]}),e.jsx(c,{className:"bg-white/10"}),e.jsxs("div",{className:"space-y-4",children:[e.jsx("h3",{className:"text-xl font-semibold text-white mb-4",children:"Floating Glass Cards"}),e.jsx("p",{className:"text-sm text-white/60 mb-4",children:"Hover für Float-Animation und verstärkten Glow"}),e.jsxs("div",{className:"grid md:grid-cols-3 gap-6",children:[e.jsxs("div",{className:"floating-glass-card p-6 rounded-2xl",children:[e.jsx("div",{className:"w-14 h-14 rounded-xl bg-white/10 flex items-center justify-center mb-4",children:e.jsx(h,{className:"h-7 w-7 text-white"})}),e.jsx("h4",{className:"font-semibold text-white text-lg mb-2",children:"Feature Card"}),e.jsx("p",{className:"text-sm text-white/60",children:"Floating Card mit Top-Lichtreflex und Hover-Lift Animation."}),e.jsx(s,{variant:"secondary",size:"sm",className:"mt-4",children:"Mehr erfahren"})]}),e.jsxs("div",{className:"floating-glass-card p-6 rounded-2xl animate-glow-pulse",children:[e.jsx("div",{className:"w-14 h-14 rounded-xl bg-white/10 flex items-center justify-center mb-4",children:e.jsx(E,{className:"h-7 w-7 text-white"})}),e.jsx("h4",{className:"font-semibold text-white text-lg mb-2",children:"Glow Pulse"}),e.jsx("p",{className:"text-sm text-white/60",children:"Card mit kontinuierlicher Glow-Pulse Animation."}),e.jsx(x,{className:"mt-4 bg-white/10 text-white border-white/20",children:"Animiert"})]}),e.jsxs("div",{className:"floating-glass-card p-6 rounded-2xl animate-border-shine",children:[e.jsx("div",{className:"w-14 h-14 rounded-xl bg-white/10 flex items-center justify-center mb-4",children:e.jsx(X,{className:"h-7 w-7 text-white"})}),e.jsx("h4",{className:"font-semibold text-white text-lg mb-2",children:"Border Shine"}),e.jsx("p",{className:"text-sm text-white/60",children:"Card mit animiertem Border-Schimmer Effekt."}),e.jsx(x,{className:"mt-4 bg-white/10 text-white border-white/20",children:"Animiert"})]})]})]}),e.jsx(c,{className:"bg-white/10"}),e.jsxs("div",{className:"space-y-4",children:[e.jsx("h3",{className:"text-xl font-semibold text-white mb-4",children:"Glass Form Elements"}),e.jsx("p",{className:"text-sm text-white/60 mb-4",children:"Inputs mit Blur-Hintergrund und Focus-Glow"}),e.jsxs("div",{className:"grid md:grid-cols-2 gap-6",children:[e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx(d,{className:"text-white/90",children:"Glass Input"}),e.jsx("input",{type:"text",placeholder:"Enter your name...",className:"glass-input w-full px-4 py-2.5 rounded-xl text-sm"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(d,{className:"text-white/90",children:"Glass Email"}),e.jsx("input",{type:"email",placeholder:"[email protected]",className:"glass-input w-full px-4 py-2.5 rounded-xl text-sm"})]})]}),e.jsx("div",{className:"space-y-4",children:e.jsxs("div",{className:"space-y-2",children:[e.jsx(d,{className:"text-white/90",children:"Glass Textarea"}),e.jsx("textarea",{placeholder:"Your message...",className:"glass-textarea w-full px-4 py-2.5 rounded-xl text-sm min-h-[120px]"})]})})]})]}),e.jsx(c,{className:"bg-white/10"}),e.jsxs("div",{className:"space-y-4",children:[e.jsx("h3",{className:"text-xl font-semibold text-white mb-4",children:"Hero Section Preview"}),e.jsx("div",{className:"floating-glass-card p-8 rounded-2xl",children:e.jsxs("div",{className:"text-center max-w-2xl mx-auto",children:[e.jsx(x,{className:"bg-white/10 text-white border-white/20 mb-4",children:"Premium Service"}),e.jsx("h2",{className:"text-4xl font-bold text-white mb-4",children:"Luxusfahrzeuge Leasing"}),e.jsx("p",{className:"text-white/70 mb-8",children:"Entdecken Sie unsere exklusive Auswahl an Premium-Fahrzeugen mit flexiblen Leasingoptionen für anspruchsvolle Kunden."}),e.jsxs("div",{className:"flex gap-4 justify-center",children:[e.jsx(s,{variant:"premium",size:"lg",children:"Fahrzeuge entdecken"}),e.jsx(s,{variant:"glass",size:"lg",children:"Kontakt aufnehmen"})]})]})})]}),e.jsxs("div",{className:"space-y-4",children:[e.jsx("h3",{className:"text-xl font-semibold text-white mb-4",children:"Glass Navigation"}),e.jsx("div",{className:"floating-glass-card p-4 rounded-2xl",children:e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsx("div",{className:"text-xl font-bold text-white",children:"LuxuryLeasing"}),e.jsxs("nav",{className:"flex gap-2",children:[e.jsx(s,{variant:"ghost",size:"sm",children:"Home"}),e.jsx(s,{variant:"ghost",size:"sm",children:"Fahrzeuge"}),e.jsx(s,{variant:"ghost",size:"sm",children:"Über Uns"}),e.jsx(s,{variant:"ghost",size:"sm",children:"Kontakt"})]}),e.jsx(s,{variant:"premium",size:"sm",children:"Anfragen"})]})})]})]}),e.jsxs(t,{children:[e.jsxs(l,{children:[e.jsx(i,{children:"CSS Classes Reference"}),e.jsx(n,{children:"Verfügbare Liquid Glass CSS-Klassen"})]}),e.jsx(r,{children:e.jsx("pre",{className:"bg-muted p-4 rounded-lg text-sm overflow-x-auto",children:`/* Button Variants */
37<Button variant="liquid-glass">Liquid Glass</Button>
38<Button variant="liquid-glass-primary">Primary Glass</Button>
39<Button variant="liquid-glass-subtle">Subtle Glass</Button>
40
41/* CSS Classes */
42.liquid-glass-btn        // Base button with shimmer
43.liquid-glass-btn-primary // Primary with gradient
44.liquid-glass-btn-subtle // Subtle/ghost style
45.floating-glass-card     // Card with hover float
46.glass-input             // Input with blur
47.glass-textarea          // Textarea with blur
48.glass-select            // Select with blur
49
50/* Animation Classes */
51.animate-glow-pulse      // Pulsing glow effect
52.animate-border-shine    // Animated border shimmer
53.animate-float           // Floating animation`})})]})]}),e.jsxs(g,{value:"tables",className:"space-y-6",children:[e.jsxs(t,{children:[e.jsxs(l,{children:[e.jsx(i,{children:"Standard Table"}),e.jsx(n,{children:"Datentabelle mit Hover-Effekten"})]}),e.jsx(r,{children:e.jsxs(P,{children:[e.jsx(L,{children:e.jsxs(f,{children:[e.jsx(m,{className:"w-12",children:"#"}),e.jsx(m,{children:"Fahrzeug"}),e.jsx(m,{children:"Preis"}),e.jsx(m,{children:"Status"})]})}),e.jsx(A,{children:G.map(a=>e.jsxs(f,{className:"hover:bg-muted/50 transition-colors",children:[e.jsx(o,{className:"font-mono",children:a.id}),e.jsx(o,{className:"font-medium",children:a.name}),e.jsx(o,{children:a.price}),e.jsx(o,{children:e.jsx(x,{variant:a.status==="Verfügbar"?"default":a.status==="Reserviert"?"secondary":"outline",children:a.status})})]},a.id))})]})})]}),e.jsxs(t,{variant:"glass",children:[e.jsxs(l,{children:[e.jsx(i,{children:"Glass Table"}),e.jsx(n,{children:"Tabelle mit Glasmorphismus-Card"})]}),e.jsx(r,{children:e.jsxs(P,{children:[e.jsx(L,{children:e.jsxs(f,{children:[e.jsx(m,{className:"w-12",children:"#"}),e.jsx(m,{children:"Fahrzeug"}),e.jsx(m,{children:"Preis"}),e.jsx(m,{children:"Status"})]})}),e.jsx(A,{children:G.map(a=>e.jsxs(f,{className:"hover:bg-white/10 transition-colors",children:[e.jsx(o,{className:"font-mono",children:a.id}),e.jsx(o,{className:"font-medium",children:a.name}),e.jsx(o,{children:a.price}),e.jsx(o,{children:e.jsx(x,{variant:a.status==="Verfügbar"?"default":a.status==="Reserviert"?"secondary":"outline",children:a.status})})]},a.id))})]})})]})]}),e.jsx(g,{value:"showcase",className:"space-y-0",children:e.jsxs("div",{className:"relative min-h-[calc(100vh-200px)] rounded-2xl overflow-hidden",children:[e.jsx("div",{className:"absolute inset-0",children:S==="ferrari"?e.jsxs(e.Fragment,{children:[e.jsx("img",{src:fe,alt:"Showcase Background",className:"w-full h-full object-cover"}),e.jsx("div",{className:"absolute inset-0 bg-gradient-to-b from-black/70 via-black/50 to-black/80"})]}):e.jsx("div",{className:`w-full h-full ${le()}`})}),e.jsxs("div",{className:"relative z-10",children:[e.jsx("div",{className:"sticky top-0 z-20 p-4 glass-lufga border-b border-white/10",children:e.jsxs("div",{className:"flex items-center justify-between flex-wrap gap-4",children:[e.jsx("h2",{className:"text-xl font-bold text-white",children:"Showcase – Alle Komponenten"}),e.jsx("div",{className:"flex flex-wrap gap-2",children:q.map(a=>e.jsxs("button",{onClick:()=>ae(a.id),className:`px-3 py-2 rounded-lg text-sm font-medium transition-all flex items-center gap-2 ${S===a.id?"bg-white/20 text-white ring-2 ring-white/50":"bg-white/10 hover:bg-white/15 text-white/80"}`,children:[a.icon&&e.jsx(a.icon,{className:"h-4 w-4"}),a.name]},a.id))})]})}),e.jsxs("div",{className:"p-8 space-y-16",children:[e.jsxs("section",{className:"space-y-6",children:[e.jsx("div",{className:"glass-lufga p-4 rounded-xl border border-white/20 inline-block",children:e.jsxs("h3",{className:"text-2xl font-bold text-white flex items-center gap-2",children:[e.jsx(Z,{className:"h-6 w-6"}),"Typography"]})}),e.jsxs("div",{className:"glass-lufga p-8 rounded-2xl border border-white/20 space-y-6",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-xs text-white/50 font-mono",children:"text-4xl font-bold"}),e.jsx("h1",{className:"text-4xl font-bold text-white",children:"Heading 1 – LuxuryLeasing"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-xs text-white/50 font-mono",children:"text-3xl font-semibold"}),e.jsx("h2",{className:"text-3xl font-semibold text-white",children:"Heading 2 – Premium Fahrzeuge"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-xs text-white/50 font-mono",children:"text-2xl font-semibold"}),e.jsx("h3",{className:"text-2xl font-semibold text-white",children:"Heading 3 – Kilometerleasing"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-xs text-white/50 font-mono",children:"text-xl font-medium"}),e.jsx("h4",{className:"text-xl font-medium text-white",children:"Heading 4 – Fahrzeugdetails"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-xs text-white/50 font-mono",children:"text-base (Body)"}),e.jsx("p",{className:"text-white/90",children:"LuxuryLeasing bietet exklusive Leasinglösungen für Premium- und Luxusfahrzeuge. Unser Service r
53ichtet sich an anspruchsvolle Kunden."})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-xs text-white/50 font-mono",children:"text-sm text-muted"}),e.jsx("p",{className:"text-sm text-white/60",children:"Kleinerer Text für Beschreibungen, Hinweise und sekundäre Informationen."})]})]})]}),e.jsxs("section",{className:"space-y-6",children:[e.jsx("div",{className:"glass-lufga p-4 rounded-xl border border-white/20 inline-block",children:e.jsxs("h3",{className:"text-2xl font-bold text-white flex items-center gap-2",children:[e.jsx(Q,{className:"h-6 w-6"}),"Colors"]})}),e.jsx("div",{className:"grid grid-cols-2 md:grid-cols-4 lg:grid-cols-5 gap-4",children:O.map(a=>e.jsxs("button",{onClick:()=>K(a.class,a.name),className:"glass-lufga p-4 rounded-xl border border-white/20 hover:border-white/40 transition-all group",children:[e.jsx("div",{className:`w-full h-12 rounded-lg ${a.class} border border-white/20 mb-3`}),e.jsx("p",{className:"text-sm font-medium text-white",children:a.name}),e.jsx("p",{className:"text-xs text-white/50 font-mono",children:a.var}),e.jsx("div",{className:"mt-2 opacity-0 group-hover:opacity-100 transition-opacity",children:M===a.name?e.jsx(Y,{className:"h-4 w-4 text-green-400 mx-auto"}):e.jsx(J,{className:"h-4 w-4 text-white/60 mx-auto"})})]},a.name))})]}),e.jsxs("section",{className:"space-y-6",children:[e.jsx("div",{className:"glass-lufga p-4 rounded-xl border border-white/20 inline-block",children:e.jsxs("h3",{className:"text-2xl font-bold text-white flex items-center gap-2",children:[e.jsx(ee,{className:"h-6 w-6"}),"Buttons"]})}),e.jsxs("div",{className:"glass-lufga p-8 rounded-2xl border border-white/20 space-y-8",children:[e.jsxs("div",{className:"space-y-3",children:[e.jsx("p",{className:"text-sm text-white/60 font-medium",children:"Standard Varianten"}),e.jsxs("div",{className:"flex flex-wrap gap-3",children:[e.jsx(s,{variant:"default",children:"Default"}),e.jsx(s,{variant:"secondary",children:"Secondary"}),e.jsx(s,{variant:"outline",children:"Outline"}),e.jsx(s,{variant:"ghost",children:"Ghost"}),e.jsx(s,{variant:"destructive",children:"Destructive"})]})]}),e.jsxs("div",{className:"space-y-3",children:[e.jsx("p",{className:"text-sm text-white/60 font-medium",children:"Premium Varianten"}),e.jsxs("div",{className:"flex flex-wrap gap-3",children:[e.jsx(s,{variant:"glass",children:"Glass"}),e.jsx(s,{variant:"premium",children:"Premium"}),e.jsx(s,{variant:"floating",children:"Floating"})]})]}),e.jsxs("div",{className:"space-y-3",children:[e.jsx("p",{className:"text-sm text-white/60 font-medium",children:"Authority Glass Varianten"}),e.jsxs("div",{className:"flex flex-wrap gap-3",children:[e.jsxs(s,{variant:"glass",children:[e.jsx(h,{className:"h-4 w-4 mr-2"}),"Authority Glass"]}),e.jsx(s,{variant:"premium",children:"Premium Glass"}),e.jsx(s,{variant:"floating",children:"Floating Glass"})]})]}),e.jsxs("div",{className:"space-y-3",children:[e.jsx("p",{className:"text-sm text-white/60 font-medium",children:"Größen"}),e.jsxs("div",{className:"flex flex-wrap items-center gap-3",children:[e.jsx(s,{size:"sm",children:"Small"}),e.jsx(s,{size:"default",children:"Default"}),e.jsx(s,{size:"lg",children:"Large"}),e.jsx(s,{size:"icon",children:e.jsx(h,{className:"h-4 w-4"})})]})]})]})]}),e.jsxs("section",{className:"space-y-6",children:[e.jsx("div",{className:"glass-lufga p-4 rounded-xl border border-white/20 inline-block",children:e.jsxs("h3",{className:"text-2xl font-bold text-white flex items-center gap-2",children:[e.jsx(H,{className:"h-6 w-6"}),"Cards"]})}),e.jsxs("div",{className:"grid md:grid-cols-2 lg:grid-cols-4 gap-6",children:[e.jsxs(t,{variant:"default",className:"bg-card/80 backdrop-blur-sm",children:[e.jsxs(l,{children:[e.jsx(i,{children:"Default Card"}),e.jsx(n,{children:"Standard Card-Komponente"})]}),e.jsx(r,{children:e.jsx("p",{className:"text-sm text-muted-foreground",children:"Die Default-Variante mit solidem Hintergrund."})}),e.jsx(p,{children:e.jsx(s,{variant:"outline",size:"sm",children:"Action"})})]}),e.jsxs(t,{variant:"glass",children:[e.jsxs(l,{children:[e.jsx(i,{className:"text-white",children:"Glass Card"}),e.jsx(n,{className:"text-white/60",children:"Glasmorphismus-Effekt"})]}),e.jsx(r,{children:e.jsx("p",{className:"text-sm text-white/70",children:"Transparenter Hintergrund mit Blur-Effekt."})}),e.jsx(p,{children:e.jsx(s,{variant:"glass",size:"sm",children:"Action"})})]}),e.jsxs("div",{className:"floating-glass-card p-6 rounded-2xl",children:[e.jsx("h4",{className:"font-semibold text-white mb-2",children:"Floating Glass"}),e.jsx("p",{className:"text-sm text-white/70 mb-4",children:"Float-Animation und Glow auf Hover."}),e.jsx(s,{variant:"glass",size:"sm",children:"Action"})]}),e.jsxs(t,{variant:"luxury",className:"bg-card/80 backdrop-blur-sm",children:[e.jsxs(l,{children:[e.jsx(i,{children:"Luxury Card"}),e.jsx(n,{children:"Premium-Akzent-Border"})]}),e.jsx(r,{children:e.jsx("p",{className:"text-sm text-muted-foreground",children:"Für besonders hervorgehobene Inhalte."})}),e.jsx(p,{children:e.jsx(s,{variant:"premium",size:"sm",children:"Action"})})]})]})]}),e.jsxs("section",{className:"space-y-6",children:[e.jsx("div",{className:"glass-lufga p-4 rounded-xl border border-white/20 inline-block",children:e.jsxs("h3",{className:"text-2xl font-bold text-white flex items-center gap-2",children:[e.jsx(_,{className:"h-6 w-6"}),"Inputs"]}
53)}),e.jsxs("div",{className:"grid md:grid-cols-2 gap-6",children:[e.jsxs("div",{className:"glass-lufga p-6 rounded-2xl border border-white/20 space-y-4",children:[e.jsx("h4",{className:"font-semibold text-white mb-4",children:"Glass Inputs"}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(d,{className:"text-white/90",children:"Text Input"}),e.jsx(y,{placeholder:"Placeholder text...",className:"bg-white/10 border-white/20 text-white placeholder:text-white/50"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(d,{className:"text-white/90",children:"Textarea"}),e.jsx(W,{placeholder:"Mehrzeiliger Text...",className:"bg-white/10 border-white/20 text-white placeholder:text-white/50"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(d,{className:"text-white/90",children:"Select"}),e.jsxs(B,{children:[e.jsx(D,{className:"bg-white/10 border-white/20 text-white",children:e.jsx(F,{placeholder:"Wählen..."})}),e.jsxs(T,{className:"glass-lufga border-white/20",children:[e.jsx(j,{value:"1",children:"Option 1"}),e.jsx(j,{value:"2",children:"Option 2"}),e.jsx(j,{value:"3",children:"Option 3"})]})]})]})]}),e.jsxs("div",{className:"glass-lufga p-6 rounded-2xl border border-white/20 space-y-4",children:[e.jsx("h4",{className:"font-semibold text-white mb-4",children:"Controls"}),e.jsxs("div",{className:"flex items-center space-x-3",children:[e.jsx(k,{id:"showcase-cb",className:"border-white/30"}),e.jsx(d,{htmlFor:"showcase-cb",className:"text-white/90",children:"Checkbox Option"})]}),e.jsxs("div",{className:"flex items-center space-x-3",children:[e.jsx(k,{id:"showcase-cb2",defaultChecked:!0,className:"border-white/30"}),e.jsx(d,{htmlFor:"showcase-cb2",className:"text-white/90",children:"Checked"})]}),e.jsx(c,{className:"bg-white/10"}),e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsx(d,{className:"text-white/90",children:"Switch Option"}),e.jsx(N,{})]}),e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsx(d,{className:"text-white/90",children:"Active Switch"}),e.jsx(N,{defaultChecked:!0})]}),e.jsx(c,{className:"bg-white/10"}),e.jsxs("div",{className:"flex flex-wrap gap-2",children:[e.jsx(x,{children:"Default"}),e.jsx(x,{variant:"secondary",children:"Secondary"}),e.jsx(x,{variant:"outline",children:"Outline"}),e.jsx(x,{variant:"destructive",children:"Destructive"})]})]})]})]}),e.jsxs("section",{className:"space-y-6",children:[e.jsx("div",{className:"glass-lufga p-4 rounded-xl border border-white/20 inline-block",children:e.jsxs("h3",{className:"text-2xl font-bold text-white flex items-center gap-2",children:[e.jsx(se,{className:"h-6 w-6"}),"Tables"]})}),e.jsx("div",{className:"glass-lufga p-6 rounded-2xl border border-white/20",children:e.jsxs(P,{children:[e.jsx(L,{children:e.jsxs(f,{className:"border-white/10 hover:bg-white/5",children:[e.jsx(m,{className:"text-white/70 w-12",children:"#"}),e.jsx(m,{className:"text-white/70",children:"Fahrzeug"}),e.jsx(m,{className:"text-white/70",children:"Preis"}),e.jsx(m,{className:"text-white/70",children:"Status"})]})}),e.jsx(A,{children:G.map(a=>e.jsxs(f,{className:"border-white/10 hover:bg-white/5 transition-colors",children:[e.jsx(o,{className:"font-mono text-white/80",children:a.id}),e.jsx(o,{className:"font-medium text-white",children:a.name}),e.jsx(o,{className:"text-white/80",children:a.price}),e.jsx(o,{children:e.jsx(x,{variant:a.status==="Verfügbar"?"default":a.status==="Reserviert"?"secondary":"outline",children:a.status})})]},a.id))})]})})]}),e.jsxs("section",{className:"space-y-6",children:[e.jsx("div",{className:"glass-lufga p-4 rounded-xl border border-white/20 inline-block",children:e.jsxs("h3",{className:"text-2xl font-bold text-white flex items-center gap-2",children:[e.jsx(h,{className:"h-6 w-6"}),"Combined Examples"]})}),e.jsxs("div",{className:"glass-lufga p-8 rounded-2xl border border-white/20 text-center space-y-6",children:[e.jsx("h1",{className:"text-4xl md:text-5xl font-bold text-white",children:"Premium Fahrzeuge"}),e.jsx("p",{className:"text-xl text-white/70 max-w-2xl mx-auto",children:"Entdecken Sie exklusive Leasingangebote für Luxusfahrzeuge"}),e.jsxs("div",{className:"flex justify-center gap-4 flex-wrap",children:[e.jsxs(s,{variant:"premium",size:"lg",children:[e.jsx(h,{className:"h-4 w-4 mr-2"}),"Fahrzeuge entdecken"]}
53),e.jsx(s,{variant:"glass",size:"lg",children:"Mehr erfahren"})]})]}),e.jsx("div",{className:"glass-lufga p-4 rounded-xl border border-white/20",children:e.jsxs("div",{className:"flex items-center justify-between flex-wrap gap-4",children:[e.jsx("span",{className:"text-xl font-bold text-white",children:"LuxuryLeasing"}),e.jsxs("div",{className:"flex gap-2 flex-wrap",children:[e.jsx(s,{variant:"ghost",size:"sm",className:"text-white hover:bg-white/10",children:"Home"}),e.jsx(s,{variant:"ghost",size:"sm",className:"text-white hover:bg-white/10",children:"Fahrzeuge"}),e.jsx(s,{variant:"ghost",size:"sm",className:"text-white hover:bg-white/10",children:"Über Uns"}),e.jsx(s,{variant:"ghost",size:"sm",className:"text-white hover:bg-white/10",children:"Kontakt"}),e.jsx(s,{variant:"glass",size:"sm",children:"Anfrage"})]})]})})]})]})]})]})})]})]})};export{Ze as default};

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.