cat-framework-core 0.3.1 → 0.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.mjs CHANGED
@@ -1,18 +1,18 @@
1
- import { jsx as e, jsxs as i } from "react/jsx-runtime";
1
+ import { jsx as e, jsxs as o } from "react/jsx-runtime";
2
2
  import { clsx as G } from "clsx";
3
3
  import { twMerge as Z } from "tailwind-merge";
4
- import { cva as P } from "class-variance-authority";
5
- import * as v from "react";
6
- import j, { useState as x, createContext as J, useContext as L, useCallback as Q, useEffect as X } from "react";
7
- import { Slot as $ } from "@radix-ui/react-slot";
8
- import { motion as A } from "framer-motion";
9
- import * as y from "@radix-ui/react-accordion";
10
- import { ChevronDown as F, X as U, Menu as Y, Search as ee, ChevronRight as re, Cloud as te, Star as ae, Check as ne } from "lucide-react";
4
+ import { cva as B } from "class-variance-authority";
5
+ import * as w from "react";
6
+ import S, { useState as v, createContext as J, useContext as L, useCallback as $, useEffect as Q } from "react";
7
+ import { Slot as X } from "@radix-ui/react-slot";
8
+ import { motion as F } from "framer-motion";
9
+ import * as N from "@radix-ui/react-accordion";
10
+ import { ChevronDown as j, X as U, Menu as Y, Search as ee, ChevronRight as re, Cloud as te, Star as ae, Check as ne } from "lucide-react";
11
11
  import * as H from "@radix-ui/react-label";
12
- function c(...a) {
13
- return Z(G(a));
12
+ function l(...t) {
13
+ return Z(G(t));
14
14
  }
15
- const ie = P("", {
15
+ const oe = B("", {
16
16
  variants: {
17
17
  variant: {
18
18
  h1: "font-display text-4xl font-bold tracking-tight sm:text-5xl lg:text-6xl",
@@ -39,7 +39,7 @@ const ie = P("", {
39
39
  variant: "body",
40
40
  color: "default"
41
41
  }
42
- }), oe = {
42
+ }), ie = {
43
43
  h1: "h1",
44
44
  h2: "h2",
45
45
  h3: "h3",
@@ -51,22 +51,22 @@ const ie = P("", {
51
51
  "body-lg": "p",
52
52
  caption: "span",
53
53
  overline: "span"
54
- }, m = j.forwardRef(
55
- ({ className: a, variant: n = "body", tone: r = "default", as: o, children: s, ...t }, d) => {
56
- const u = o || oe[n] || "p";
54
+ }, m = S.forwardRef(
55
+ ({ className: t, variant: n = "body", tone: r = "default", as: i, children: s, ...a }, d) => {
56
+ const h = i || ie[n] || "p";
57
57
  return /* @__PURE__ */ e(
58
- u,
58
+ h,
59
59
  {
60
60
  ref: d,
61
- className: c(ie({ variant: n, color: r, className: a })),
62
- ...t,
61
+ className: l(oe({ variant: n, color: r, className: t })),
62
+ ...a,
63
63
  children: s
64
64
  }
65
65
  );
66
66
  }
67
67
  );
68
68
  m.displayName = "Typography";
69
- const se = P(
69
+ const se = B(
70
70
  "inline-flex items-center rounded-full px-3 py-0.5 font-body text-xs font-medium transition-fast",
71
71
  {
72
72
  variants: {
@@ -81,11 +81,11 @@ const se = P(
81
81
  },
82
82
  defaultVariants: { variant: "default" }
83
83
  }
84
- ), de = j.forwardRef(
85
- ({ className: a, variant: n, ...r }, o) => /* @__PURE__ */ e("span", { ref: o, className: c(se({ variant: n, className: a })), ...r })
84
+ ), de = S.forwardRef(
85
+ ({ className: t, variant: n, ...r }, i) => /* @__PURE__ */ e("span", { ref: i, className: l(se({ variant: n, className: t })), ...r })
86
86
  );
87
87
  de.displayName = "Badge";
88
- const le = P(
88
+ const le = B(
89
89
  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-xl font-medium font-body transition-fast focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
90
90
  {
91
91
  variants: {
@@ -112,64 +112,64 @@ const le = P(
112
112
  size: "default"
113
113
  }
114
114
  }
115
- ), g = v.forwardRef(
116
- ({ className: a, variant: n, size: r, asChild: o = !1, ...s }, t) => /* @__PURE__ */ e(o ? $ : "button", { className: c(le({ variant: n, size: r, className: a })), ref: t, ...s })
115
+ ), b = w.forwardRef(
116
+ ({ className: t, variant: n, size: r, asChild: i = !1, ...s }, a) => /* @__PURE__ */ e(i ? X : "button", { className: l(le({ variant: n, size: r, className: t })), ref: a, ...s })
117
117
  );
118
- g.displayName = "Button";
118
+ b.displayName = "Button";
119
119
  const ke = ({
120
- headline: a,
120
+ headline: t,
121
121
  headlineMobile: n,
122
122
  subheadline: r,
123
- subheadlineMobile: o,
123
+ subheadlineMobile: i,
124
124
  ctaLabel: s,
125
- ctaHref: t = "#",
125
+ ctaHref: a = "#",
126
126
  secondaryCtaLabel: d,
127
- secondaryCtaHref: u = "#",
128
- backgroundImage: h,
129
- backgroundImageMobile: p,
130
- imageAlt: f = "",
131
- className: N,
132
- ...z
133
- }) => /* @__PURE__ */ i("section", { className: c("relative overflow-hidden", N), ...z, children: [
134
- /* @__PURE__ */ i("div", { className: "hidden md:flex relative min-h-[420px] md:min-h-[420px] lg:min-h-[600px]", children: [
135
- h && /* @__PURE__ */ e(
127
+ secondaryCtaHref: h = "#",
128
+ backgroundImage: u,
129
+ backgroundImageMobile: g,
130
+ imageAlt: p = "",
131
+ className: y,
132
+ ...k
133
+ }) => /* @__PURE__ */ o("section", { className: l("relative overflow-hidden", y), ...k, children: [
134
+ /* @__PURE__ */ o("div", { className: "hidden md:flex relative min-h-[420px] md:min-h-[420px] lg:min-h-[600px]", children: [
135
+ u && /* @__PURE__ */ e(
136
136
  "img",
137
137
  {
138
- src: h,
139
- alt: f,
138
+ src: u,
139
+ alt: p,
140
140
  className: "absolute inset-0 h-full w-full object-cover object-right",
141
141
  loading: "eager"
142
142
  }
143
143
  ),
144
144
  /* @__PURE__ */ e("div", { className: "absolute inset-0 bg-gradient-to-r from-black/80 via-black/50 to-transparent" }),
145
- /* @__PURE__ */ e("div", { className: "relative z-10 flex items-center w-full pl-8 lg:pl-16", children: /* @__PURE__ */ i(
146
- A.div,
145
+ /* @__PURE__ */ e("div", { className: "relative z-10 flex items-center w-full pl-8 lg:pl-16", children: /* @__PURE__ */ o(
146
+ F.div,
147
147
  {
148
148
  initial: { opacity: 0, y: 16 },
149
149
  animate: { opacity: 1, y: 0 },
150
150
  transition: { duration: 0.4, ease: "easeOut" },
151
151
  className: "px-6 py-16 lg:px-8 lg:py-20 max-w-[500px] lg:max-w-[480px]",
152
152
  children: [
153
- /* @__PURE__ */ e(m, { variant: "h1", className: "text-white drop-shadow-lg", as: "h1", children: a }),
153
+ /* @__PURE__ */ e(m, { variant: "h1", className: "text-white drop-shadow-lg", as: "h1", children: t }),
154
154
  r && /* @__PURE__ */ e(m, { variant: "body-lg", className: "mt-4 text-white/85 drop-shadow-md", children: r }),
155
- (s || d) && /* @__PURE__ */ i("div", { className: "mt-8 flex flex-wrap gap-4", children: [
155
+ (s || d) && /* @__PURE__ */ o("div", { className: "mt-8 flex flex-wrap gap-4", children: [
156
156
  s && /* @__PURE__ */ e(
157
- g,
157
+ b,
158
158
  {
159
159
  size: "lg",
160
160
  className: "bg-primary text-primary-foreground hover:bg-primary/90 shadow-lg",
161
161
  asChild: !0,
162
- children: /* @__PURE__ */ e("a", { href: t, children: s })
162
+ children: /* @__PURE__ */ e("a", { href: a, children: s })
163
163
  }
164
164
  ),
165
165
  d && /* @__PURE__ */ e(
166
- g,
166
+ b,
167
167
  {
168
168
  size: "lg",
169
169
  variant: "outline",
170
170
  className: "border-white/40 text-foreground bg-white/90 hover:bg-white shadow-lg",
171
171
  asChild: !0,
172
- children: /* @__PURE__ */ e("a", { href: u, children: d })
172
+ children: /* @__PURE__ */ e("a", { href: h, children: d })
173
173
  }
174
174
  )
175
175
  ] })
@@ -177,33 +177,33 @@ const ke = ({
177
177
  }
178
178
  ) })
179
179
  ] }),
180
- /* @__PURE__ */ i("div", { className: "block md:hidden relative min-h-[85vh] flex flex-col", children: [
181
- (p || h) && /* @__PURE__ */ e(
180
+ /* @__PURE__ */ o("div", { className: "block md:hidden relative min-h-[85vh] flex flex-col", children: [
181
+ (g || u) && /* @__PURE__ */ e(
182
182
  "img",
183
183
  {
184
- src: p || h,
185
- alt: f,
184
+ src: g || u,
185
+ alt: p,
186
186
  className: "absolute inset-0 h-full w-full object-cover object-center",
187
187
  loading: "eager"
188
188
  }
189
189
  ),
190
190
  /* @__PURE__ */ e("div", { className: "absolute inset-0 bg-gradient-to-b from-black/70 via-transparent to-black/80" }),
191
- /* @__PURE__ */ i("div", { className: "relative z-10 flex flex-1 flex-col justify-between px-5 py-10", children: [
192
- /* @__PURE__ */ i(
193
- A.div,
191
+ /* @__PURE__ */ o("div", { className: "relative z-10 flex flex-1 flex-col justify-between px-5 py-10", children: [
192
+ /* @__PURE__ */ o(
193
+ F.div,
194
194
  {
195
195
  initial: { opacity: 0, y: 12 },
196
196
  animate: { opacity: 1, y: 0 },
197
197
  transition: { duration: 0.4 },
198
198
  children: [
199
- /* @__PURE__ */ e(m, { variant: "h2", className: "text-white drop-shadow-lg", as: "h1", children: n || a }),
200
- (o || r) && /* @__PURE__ */ e(m, { variant: "body-lg", className: "mt-3 text-white/90 drop-shadow-lg font-medium leading-relaxed", children: o || r })
199
+ /* @__PURE__ */ e(m, { variant: "h2", className: "text-white drop-shadow-lg", as: "h1", children: n || t }),
200
+ (i || r) && /* @__PURE__ */ e(m, { variant: "body-lg", className: "mt-3 text-white/90 drop-shadow-lg font-medium leading-relaxed", children: i || r })
201
201
  ]
202
202
  }
203
203
  ),
204
204
  /* @__PURE__ */ e("div", { className: "flex-1" }),
205
- (s || d) && /* @__PURE__ */ i(
206
- A.div,
205
+ (s || d) && /* @__PURE__ */ o(
206
+ F.div,
207
207
  {
208
208
  initial: { opacity: 0, y: 12 },
209
209
  animate: { opacity: 1, y: 0 },
@@ -211,22 +211,22 @@ const ke = ({
211
211
  className: "flex flex-col gap-3",
212
212
  children: [
213
213
  s && /* @__PURE__ */ e(
214
- g,
214
+ b,
215
215
  {
216
216
  size: "lg",
217
217
  className: "w-full bg-primary text-primary-foreground hover:bg-primary/90 shadow-lg",
218
218
  asChild: !0,
219
- children: /* @__PURE__ */ e("a", { href: t, children: s })
219
+ children: /* @__PURE__ */ e("a", { href: a, children: s })
220
220
  }
221
221
  ),
222
222
  d && /* @__PURE__ */ e(
223
- g,
223
+ b,
224
224
  {
225
225
  size: "lg",
226
226
  variant: "outline",
227
227
  className: "w-full border-white/40 text-foreground bg-white/90 hover:bg-white shadow-lg",
228
228
  asChild: !0,
229
- children: /* @__PURE__ */ e("a", { href: u, children: d })
229
+ children: /* @__PURE__ */ e("a", { href: h, children: d })
230
230
  }
231
231
  )
232
232
  ]
@@ -234,20 +234,20 @@ const ke = ({
234
234
  )
235
235
  ] })
236
236
  ] })
237
- ] }), Ce = ({
238
- heading: a,
237
+ ] }), Pe = ({
238
+ heading: t,
239
239
  text: n,
240
240
  imageSrc: r,
241
- imageAlt: o,
241
+ imageAlt: i,
242
242
  ctaLabel: s,
243
- ctaHref: t = "#",
243
+ ctaHref: a = "#",
244
244
  imagePosition: d = "left",
245
- className: u,
246
- ...h
247
- }) => /* @__PURE__ */ e("section", { className: c("section-padding", u), ...h, children: /* @__PURE__ */ i(
245
+ className: h,
246
+ ...u
247
+ }) => /* @__PURE__ */ e("section", { className: l("section-padding", h), ...u, children: /* @__PURE__ */ o(
248
248
  "div",
249
249
  {
250
- className: c(
250
+ className: l(
251
251
  "container-wide grid items-center gap-8 md:grid-cols-2 lg:gap-16",
252
252
  d === "right" && "md:[&>*:first-child]:order-2"
253
253
  ),
@@ -256,104 +256,104 @@ const ke = ({
256
256
  "img",
257
257
  {
258
258
  src: r,
259
- alt: o,
259
+ alt: i,
260
260
  className: "h-full w-full object-cover",
261
261
  loading: "lazy"
262
262
  }
263
263
  ) }),
264
- /* @__PURE__ */ i("div", { children: [
265
- /* @__PURE__ */ e(m, { variant: "h2", children: a }),
264
+ /* @__PURE__ */ o("div", { children: [
265
+ /* @__PURE__ */ e(m, { variant: "h2", children: t }),
266
266
  /* @__PURE__ */ e(m, { variant: "body", color: "muted", className: "mt-4", children: n }),
267
- s && /* @__PURE__ */ e(g, { className: "mt-6", asChild: !0, children: /* @__PURE__ */ e("a", { href: t, children: s }) })
267
+ s && /* @__PURE__ */ e(b, { className: "mt-6", asChild: !0, children: /* @__PURE__ */ e("a", { href: a, children: s }) })
268
268
  ] })
269
269
  ]
270
270
  }
271
- ) }), Pe = ({
272
- heading: a,
271
+ ) }), ze = ({
272
+ heading: t,
273
273
  text: n,
274
274
  imageSrc: r,
275
- imageAlt: o = "",
275
+ imageAlt: i = "",
276
276
  tag: s,
277
- href: t,
277
+ href: a,
278
278
  className: d,
279
- ...u
279
+ ...h
280
280
  }) => {
281
- const h = t ? "a" : "div", p = t ? { href: t } : {};
281
+ const u = a ? "a" : "div", g = a ? { href: a } : {};
282
282
  return /* @__PURE__ */ e(
283
283
  "article",
284
284
  {
285
- className: c(
285
+ className: l(
286
286
  "group overflow-hidden rounded-2xl border border-border bg-card shadow-sm transition-fast hover:shadow-lg",
287
- t && "cursor-pointer",
287
+ a && "cursor-pointer",
288
288
  d
289
289
  ),
290
- ...u,
291
- children: /* @__PURE__ */ i(h, { ...p, className: "block", children: [
290
+ ...h,
291
+ children: /* @__PURE__ */ o(u, { ...g, className: "block", children: [
292
292
  r && /* @__PURE__ */ e("div", { className: "aspect-video overflow-hidden", children: /* @__PURE__ */ e(
293
293
  "img",
294
294
  {
295
295
  src: r,
296
- alt: o,
296
+ alt: i,
297
297
  className: "h-full w-full object-cover transition-fast group-hover:scale-105",
298
298
  loading: "lazy"
299
299
  }
300
300
  ) }),
301
- /* @__PURE__ */ i("div", { className: "p-6", children: [
301
+ /* @__PURE__ */ o("div", { className: "p-6", children: [
302
302
  s && /* @__PURE__ */ e(m, { variant: "overline", className: "mb-2", children: s }),
303
- /* @__PURE__ */ e(m, { variant: "h4", className: "group-hover:text-primary transition-fast", children: a }),
303
+ /* @__PURE__ */ e(m, { variant: "h4", className: "group-hover:text-primary transition-fast", children: t }),
304
304
  /* @__PURE__ */ e(m, { variant: "body-sm", color: "muted", className: "mt-2 line-clamp-3", children: n })
305
305
  ] })
306
306
  ] })
307
307
  }
308
308
  );
309
- }, ce = y.Root, R = v.forwardRef(({ className: a, ...n }, r) => /* @__PURE__ */ e(y.Item, { ref: r, className: c("border-b", a), ...n }));
309
+ }, ce = N.Root, R = w.forwardRef(({ className: t, ...n }, r) => /* @__PURE__ */ e(N.Item, { ref: r, className: l("border-b", t), ...n }));
310
310
  R.displayName = "AccordionItem";
311
- const S = v.forwardRef(({ className: a, children: n, ...r }, o) => /* @__PURE__ */ e(y.Header, { className: "flex", children: /* @__PURE__ */ i(
312
- y.Trigger,
311
+ const M = w.forwardRef(({ className: t, children: n, ...r }, i) => /* @__PURE__ */ e(N.Header, { className: "flex", children: /* @__PURE__ */ o(
312
+ N.Trigger,
313
313
  {
314
- ref: o,
315
- className: c(
314
+ ref: i,
315
+ className: l(
316
316
  "flex flex-1 items-center justify-between py-4 font-medium transition-all hover:underline [&[data-state=open]>svg]:rotate-180",
317
- a
317
+ t
318
318
  ),
319
319
  ...r,
320
320
  children: [
321
321
  n,
322
- /* @__PURE__ */ e(F, { className: "h-4 w-4 shrink-0 transition-transform duration-200" })
322
+ /* @__PURE__ */ e(j, { className: "h-4 w-4 shrink-0 transition-transform duration-200" })
323
323
  ]
324
324
  }
325
325
  ) }));
326
- S.displayName = y.Trigger.displayName;
327
- const T = v.forwardRef(({ className: a, children: n, ...r }, o) => /* @__PURE__ */ e(
328
- y.Content,
326
+ M.displayName = N.Trigger.displayName;
327
+ const D = w.forwardRef(({ className: t, children: n, ...r }, i) => /* @__PURE__ */ e(
328
+ N.Content,
329
329
  {
330
- ref: o,
330
+ ref: i,
331
331
  className: "overflow-hidden text-sm transition-all data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down",
332
332
  ...r,
333
- children: /* @__PURE__ */ e("div", { className: c("pb-4 pt-0", a), children: n })
333
+ children: /* @__PURE__ */ e("div", { className: l("pb-4 pt-0", t), children: n })
334
334
  }
335
335
  ));
336
- T.displayName = y.Content.displayName;
337
- const ze = ({
338
- heading: a,
336
+ D.displayName = N.Content.displayName;
337
+ const Ce = ({
338
+ heading: t,
339
339
  items: n,
340
340
  className: r,
341
- ...o
341
+ ...i
342
342
  }) => {
343
343
  const s = {
344
344
  "@context": "https://schema.org",
345
345
  "@type": "FAQPage",
346
- mainEntity: n.map((t) => ({
346
+ mainEntity: n.map((a) => ({
347
347
  "@type": "Question",
348
- name: t.question,
349
- acceptedAnswer: { "@type": "Answer", text: t.answer }
348
+ name: a.question,
349
+ acceptedAnswer: { "@type": "Answer", text: a.answer }
350
350
  }))
351
351
  };
352
- return /* @__PURE__ */ e("section", { className: c("section-padding", r), ...o, children: /* @__PURE__ */ i("div", { className: "container-narrow", children: [
353
- a && /* @__PURE__ */ e(m, { variant: "h2", className: "mb-8 text-center", children: a }),
354
- /* @__PURE__ */ e(ce, { type: "single", collapsible: !0, className: "w-full", children: n.map((t, d) => /* @__PURE__ */ i(R, { value: `item-${d}`, children: [
355
- /* @__PURE__ */ e(S, { className: "font-display text-left font-semibold", children: t.question }),
356
- /* @__PURE__ */ e(T, { className: "font-body text-muted-foreground", children: t.answer })
352
+ return /* @__PURE__ */ e("section", { className: l("section-padding", r), ...i, children: /* @__PURE__ */ o("div", { className: "container-narrow", children: [
353
+ t && /* @__PURE__ */ e(m, { variant: "h2", className: "mb-8 text-center", children: t }),
354
+ /* @__PURE__ */ e(ce, { type: "single", collapsible: !0, className: "w-full", children: n.map((a, d) => /* @__PURE__ */ o(R, { value: `item-${d}`, children: [
355
+ /* @__PURE__ */ e(M, { className: "font-display text-left font-semibold", children: a.question }),
356
+ /* @__PURE__ */ e(D, { className: "font-body text-muted-foreground", children: a.answer })
357
357
  ] }, d)) }),
358
358
  /* @__PURE__ */ e(
359
359
  "script",
@@ -363,166 +363,166 @@ const ze = ({
363
363
  }
364
364
  )
365
365
  ] }) });
366
- }, C = v.forwardRef(
367
- ({ className: a, type: n, ...r }, o) => /* @__PURE__ */ e(
366
+ }, C = w.forwardRef(
367
+ ({ className: t, type: n, ...r }, i) => /* @__PURE__ */ e(
368
368
  "input",
369
369
  {
370
370
  type: n,
371
- className: c(
371
+ className: l(
372
372
  "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
373
- a
373
+ t
374
374
  ),
375
- ref: o,
375
+ ref: i,
376
376
  ...r
377
377
  }
378
378
  )
379
379
  );
380
380
  C.displayName = "Input";
381
- const M = v.forwardRef(({ className: a, ...n }, r) => /* @__PURE__ */ e(
381
+ const T = w.forwardRef(({ className: t, ...n }, r) => /* @__PURE__ */ e(
382
382
  "textarea",
383
383
  {
384
- className: c(
384
+ className: l(
385
385
  "flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
386
- a
386
+ t
387
387
  ),
388
388
  ref: r,
389
389
  ...n
390
390
  }
391
391
  ));
392
- M.displayName = "Textarea";
393
- const me = P("text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"), k = v.forwardRef(({ className: a, ...n }, r) => /* @__PURE__ */ e(H.Root, { ref: r, className: c(me(), a), ...n }));
394
- k.displayName = H.Root.displayName;
392
+ T.displayName = "Textarea";
393
+ const me = B("text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"), z = w.forwardRef(({ className: t, ...n }, r) => /* @__PURE__ */ e(H.Root, { ref: r, className: l(me(), t), ...n }));
394
+ z.displayName = H.Root.displayName;
395
395
  const Be = ({
396
- heading: a = "Kontakt",
396
+ heading: t = "Kontakt",
397
397
  description: n,
398
398
  onSubmit: r,
399
- className: o,
399
+ className: i,
400
400
  ...s
401
401
  }) => {
402
- const [t, d] = x({ name: "", email: "", message: "" }), [u, h] = x(!1), p = (f) => {
403
- f.preventDefault(), r == null || r(t), h(!0);
402
+ const [a, d] = v({ name: "", email: "", message: "" }), [h, u] = v(!1), g = (p) => {
403
+ p.preventDefault(), r == null || r(a), u(!0);
404
404
  };
405
- return /* @__PURE__ */ e("section", { className: c("section-padding", o), ...s, children: /* @__PURE__ */ i("div", { className: "container-narrow", children: [
406
- /* @__PURE__ */ e(m, { variant: "h2", className: "mb-2", children: a }),
405
+ return /* @__PURE__ */ e("section", { className: l("section-padding", i), ...s, children: /* @__PURE__ */ o("div", { className: "container-narrow", children: [
406
+ /* @__PURE__ */ e(m, { variant: "h2", className: "mb-2", children: t }),
407
407
  n && /* @__PURE__ */ e(m, { variant: "body", color: "muted", className: "mb-8", children: n }),
408
- u ? /* @__PURE__ */ i("div", { className: "rounded-lg border border-success/30 bg-success/5 p-8 text-center", children: [
408
+ h ? /* @__PURE__ */ o("div", { className: "rounded-lg border border-success/30 bg-success/5 p-8 text-center", children: [
409
409
  /* @__PURE__ */ e(m, { variant: "h4", color: "accent", children: "Vielen Dank für Ihre Nachricht!" }),
410
410
  /* @__PURE__ */ e(m, { variant: "body-sm", color: "muted", className: "mt-2", children: "Wir melden uns in Kürze bei Ihnen." })
411
- ] }) : /* @__PURE__ */ i("form", { onSubmit: p, className: "space-y-6", children: [
412
- /* @__PURE__ */ i("div", { className: "grid gap-6 sm:grid-cols-2", children: [
413
- /* @__PURE__ */ i("div", { className: "space-y-2", children: [
414
- /* @__PURE__ */ e(k, { htmlFor: "name", children: "Name" }),
411
+ ] }) : /* @__PURE__ */ o("form", { onSubmit: g, className: "space-y-6", children: [
412
+ /* @__PURE__ */ o("div", { className: "grid gap-6 sm:grid-cols-2", children: [
413
+ /* @__PURE__ */ o("div", { className: "space-y-2", children: [
414
+ /* @__PURE__ */ e(z, { htmlFor: "name", children: "Name" }),
415
415
  /* @__PURE__ */ e(
416
416
  C,
417
417
  {
418
418
  id: "name",
419
419
  required: !0,
420
- value: t.name,
421
- onChange: (f) => d({ ...t, name: f.target.value }),
420
+ value: a.name,
421
+ onChange: (p) => d({ ...a, name: p.target.value }),
422
422
  placeholder: "Max Mustermann"
423
423
  }
424
424
  )
425
425
  ] }),
426
- /* @__PURE__ */ i("div", { className: "space-y-2", children: [
427
- /* @__PURE__ */ e(k, { htmlFor: "email", children: "E-Mail" }),
426
+ /* @__PURE__ */ o("div", { className: "space-y-2", children: [
427
+ /* @__PURE__ */ e(z, { htmlFor: "email", children: "E-Mail" }),
428
428
  /* @__PURE__ */ e(
429
429
  C,
430
430
  {
431
431
  id: "email",
432
432
  type: "email",
433
433
  required: !0,
434
- value: t.email,
435
- onChange: (f) => d({ ...t, email: f.target.value }),
434
+ value: a.email,
435
+ onChange: (p) => d({ ...a, email: p.target.value }),
436
436
  placeholder: "max@beispiel.de"
437
437
  }
438
438
  )
439
439
  ] })
440
440
  ] }),
441
- /* @__PURE__ */ i("div", { className: "space-y-2", children: [
442
- /* @__PURE__ */ e(k, { htmlFor: "message", children: "Nachricht" }),
441
+ /* @__PURE__ */ o("div", { className: "space-y-2", children: [
442
+ /* @__PURE__ */ e(z, { htmlFor: "message", children: "Nachricht" }),
443
443
  /* @__PURE__ */ e(
444
- M,
444
+ T,
445
445
  {
446
446
  id: "message",
447
447
  required: !0,
448
448
  rows: 5,
449
- value: t.message,
450
- onChange: (f) => d({ ...t, message: f.target.value }),
449
+ value: a.message,
450
+ onChange: (p) => d({ ...a, message: p.target.value }),
451
451
  placeholder: "Ihre Nachricht..."
452
452
  }
453
453
  )
454
454
  ] }),
455
- /* @__PURE__ */ e(g, { type: "submit", size: "lg", children: "Nachricht senden" })
455
+ /* @__PURE__ */ e(b, { type: "submit", size: "lg", children: "Nachricht senden" })
456
456
  ] })
457
457
  ] }) });
458
458
  }, Ae = ({
459
- brand: a,
459
+ brand: t,
460
460
  items: n,
461
461
  ctaLabel: r,
462
- ctaHref: o = "#",
462
+ ctaHref: i = "#",
463
463
  className: s,
464
- ...t
464
+ ...a
465
465
  }) => {
466
- const [d, u] = x(!1);
467
- return /* @__PURE__ */ i(
466
+ const [d, h] = v(!1);
467
+ return /* @__PURE__ */ o(
468
468
  "header",
469
469
  {
470
- className: c(
470
+ className: l(
471
471
  "sticky top-0 z-50 border-b border-primary/20 bg-primary text-primary-foreground backdrop-blur",
472
472
  s
473
473
  ),
474
- ...t,
474
+ ...a,
475
475
  children: [
476
- /* @__PURE__ */ i("nav", { className: "container-wide flex h-16 items-center justify-between px-4 sm:px-6 lg:px-8", "aria-label": "Main", children: [
477
- /* @__PURE__ */ e("a", { href: "/", className: "font-display text-lg font-bold text-primary-foreground", children: a }),
478
- /* @__PURE__ */ i("ul", { className: "hidden items-center gap-1 md:flex", children: [
479
- n.map((h) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
476
+ /* @__PURE__ */ o("nav", { className: "container-wide flex h-16 items-center justify-between px-4 sm:px-6 lg:px-8", "aria-label": "Main", children: [
477
+ /* @__PURE__ */ e("a", { href: "/", className: "font-display text-lg font-bold text-primary-foreground", children: t }),
478
+ /* @__PURE__ */ o("ul", { className: "hidden items-center gap-1 md:flex", children: [
479
+ n.map((u) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
480
480
  "a",
481
481
  {
482
- href: h.href,
482
+ href: u.href,
483
483
  className: "rounded-full px-4 py-2 font-body text-sm text-primary-foreground/80 transition-fast hover:bg-primary-foreground/10 hover:text-primary-foreground",
484
- children: h.label
484
+ children: u.label
485
485
  }
486
- ) }, h.href)),
487
- r && /* @__PURE__ */ e("li", { className: "ml-4", children: /* @__PURE__ */ e(g, { size: "sm", className: "bg-primary-foreground text-primary hover:bg-primary-foreground/90", asChild: !0, children: /* @__PURE__ */ e("a", { href: o, children: r }) }) })
486
+ ) }, u.href)),
487
+ r && /* @__PURE__ */ e("li", { className: "ml-4", children: /* @__PURE__ */ e(b, { size: "sm", className: "bg-primary-foreground text-primary hover:bg-primary-foreground/90", asChild: !0, children: /* @__PURE__ */ e("a", { href: i, children: r }) }) })
488
488
  ] }),
489
489
  /* @__PURE__ */ e(
490
490
  "button",
491
491
  {
492
492
  className: "md:hidden rounded-full p-2 text-primary-foreground/80 hover:bg-primary-foreground/10",
493
- onClick: () => u(!d),
493
+ onClick: () => h(!d),
494
494
  "aria-label": "Menu",
495
495
  children: d ? /* @__PURE__ */ e(U, { size: 20 }) : /* @__PURE__ */ e(Y, { size: 20 })
496
496
  }
497
497
  )
498
498
  ] }),
499
- d && /* @__PURE__ */ e("div", { className: "border-t border-primary-foreground/20 bg-primary md:hidden", children: /* @__PURE__ */ i("ul", { className: "container-wide space-y-1 px-4 py-4", children: [
500
- n.map((h) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
499
+ d && /* @__PURE__ */ e("div", { className: "border-t border-primary-foreground/20 bg-primary md:hidden", children: /* @__PURE__ */ o("ul", { className: "container-wide space-y-1 px-4 py-4", children: [
500
+ n.map((u) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
501
501
  "a",
502
502
  {
503
- href: h.href,
503
+ href: u.href,
504
504
  className: "block rounded-xl px-4 py-2 font-body text-sm text-primary-foreground/80 transition-fast hover:bg-primary-foreground/10 hover:text-primary-foreground",
505
- onClick: () => u(!1),
506
- children: h.label
505
+ onClick: () => h(!1),
506
+ children: u.label
507
507
  }
508
- ) }, h.href)),
509
- r && /* @__PURE__ */ e("li", { className: "pt-2", children: /* @__PURE__ */ e(g, { size: "sm", className: "w-full bg-primary-foreground text-primary hover:bg-primary-foreground/90", asChild: !0, children: /* @__PURE__ */ e("a", { href: o, children: r }) }) })
508
+ ) }, u.href)),
509
+ r && /* @__PURE__ */ e("li", { className: "pt-2", children: /* @__PURE__ */ e(b, { size: "sm", className: "w-full bg-primary-foreground text-primary hover:bg-primary-foreground/90", asChild: !0, children: /* @__PURE__ */ e("a", { href: i, children: r }) }) })
510
510
  ] }) })
511
511
  ]
512
512
  }
513
513
  );
514
514
  }, Fe = ({
515
- brand: a,
515
+ brand: t,
516
516
  columns: n,
517
517
  copyright: r,
518
- className: o,
518
+ className: i,
519
519
  ...s
520
- }) => /* @__PURE__ */ e("footer", { className: c("border-t border-border bg-muted section-padding", o), ...s, children: /* @__PURE__ */ i("div", { className: "container-wide", children: [
521
- /* @__PURE__ */ i("div", { className: "grid gap-8 sm:grid-cols-2 lg:grid-cols-4", children: [
522
- /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(m, { variant: "h5", children: a }) }),
523
- n.map((t) => /* @__PURE__ */ i("div", { children: [
524
- /* @__PURE__ */ e(m, { variant: "overline", className: "mb-4", children: t.heading }),
525
- /* @__PURE__ */ e("ul", { className: "space-y-2", children: t.links.map((d) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
520
+ }) => /* @__PURE__ */ e("footer", { className: l("border-t border-border bg-muted section-padding", i), ...s, children: /* @__PURE__ */ o("div", { className: "container-wide", children: [
521
+ /* @__PURE__ */ o("div", { className: "grid gap-8 sm:grid-cols-2 lg:grid-cols-4", children: [
522
+ /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(m, { variant: "h5", children: t }) }),
523
+ n.map((a) => /* @__PURE__ */ o("div", { children: [
524
+ /* @__PURE__ */ e(m, { variant: "overline", className: "mb-4", children: a.heading }),
525
+ /* @__PURE__ */ e("ul", { className: "space-y-2", children: a.links.map((d) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
526
526
  "a",
527
527
  {
528
528
  href: d.href,
@@ -530,16 +530,16 @@ const Be = ({
530
530
  children: d.label
531
531
  }
532
532
  ) }, d.href)) })
533
- ] }, t.heading))
533
+ ] }, a.heading))
534
534
  ] }),
535
535
  r && /* @__PURE__ */ e("div", { className: "mt-12 border-t border-border pt-6", children: /* @__PURE__ */ e(m, { variant: "caption", children: r }) })
536
- ] }) }), he = j.forwardRef(
537
- ({ className: a, onSearch: n, ...r }, o) => /* @__PURE__ */ i("div", { className: c("relative", a), children: [
536
+ ] }) }), ue = S.forwardRef(
537
+ ({ className: t, onSearch: n, ...r }, i) => /* @__PURE__ */ o("div", { className: l("relative", t), children: [
538
538
  /* @__PURE__ */ e(ee, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }),
539
539
  /* @__PURE__ */ e(
540
540
  C,
541
541
  {
542
- ref: o,
542
+ ref: i,
543
543
  className: "pl-10",
544
544
  placeholder: "Suchen...",
545
545
  onChange: (s) => n == null ? void 0 : n(s.target.value),
@@ -548,32 +548,32 @@ const Be = ({
548
548
  )
549
549
  ] })
550
550
  );
551
- he.displayName = "SearchBar";
552
- const je = ({ items: a, className: n, ...r }) => {
553
- const o = {
551
+ ue.displayName = "SearchBar";
552
+ const je = ({ items: t, className: n, ...r }) => {
553
+ const i = {
554
554
  "@context": "https://schema.org",
555
555
  "@type": "BreadcrumbList",
556
- itemListElement: a.map((s, t) => ({
556
+ itemListElement: t.map((s, a) => ({
557
557
  "@type": "ListItem",
558
- position: t + 1,
558
+ position: a + 1,
559
559
  name: s.label,
560
560
  ...s.href ? { item: s.href } : {}
561
561
  }))
562
562
  };
563
- return /* @__PURE__ */ i("nav", { "aria-label": "Breadcrumb", className: c("font-body text-sm", n), ...r, children: [
564
- /* @__PURE__ */ e("ol", { className: "flex items-center gap-1", children: a.map((s, t) => /* @__PURE__ */ i("li", { className: "flex items-center gap-1", children: [
565
- t > 0 && /* @__PURE__ */ e(re, { className: "h-3 w-3 text-muted-foreground" }),
566
- s.href && t < a.length - 1 ? /* @__PURE__ */ e("a", { href: s.href, className: "text-muted-foreground transition-fast hover:text-foreground", children: s.label }) : /* @__PURE__ */ e("span", { className: "text-foreground font-medium", children: s.label })
567
- ] }, t)) }),
563
+ return /* @__PURE__ */ o("nav", { "aria-label": "Breadcrumb", className: l("font-body text-sm", n), ...r, children: [
564
+ /* @__PURE__ */ e("ol", { className: "flex items-center gap-1", children: t.map((s, a) => /* @__PURE__ */ o("li", { className: "flex items-center gap-1", children: [
565
+ a > 0 && /* @__PURE__ */ e(re, { className: "h-3 w-3 text-muted-foreground" }),
566
+ s.href && a < t.length - 1 ? /* @__PURE__ */ e("a", { href: s.href, className: "text-muted-foreground transition-fast hover:text-foreground", children: s.label }) : /* @__PURE__ */ e("span", { className: "text-foreground font-medium", children: s.label })
567
+ ] }, a)) }),
568
568
  /* @__PURE__ */ e(
569
569
  "script",
570
570
  {
571
571
  type: "application/ld+json",
572
- dangerouslySetInnerHTML: { __html: JSON.stringify(o) }
572
+ dangerouslySetInnerHTML: { __html: JSON.stringify(i) }
573
573
  }
574
574
  )
575
575
  ] });
576
- }, ue = [
576
+ }, he = [
577
577
  {
578
578
  id: "50gb",
579
579
  storage: "50 GB",
@@ -647,32 +647,32 @@ const je = ({ items: a, className: n, ...r }) => {
647
647
  ctaLabel: "Zum Angebot",
648
648
  ctaHref: "#"
649
649
  }
650
- ], Ve = ({
651
- heading: a = "Cloud-Speicher erweitern",
650
+ ], Se = ({
651
+ heading: t = "Cloud-Speicher erweitern",
652
652
  subheading: n = "Wählen Sie den passenden Tarif für Ihre Bedürfnisse",
653
- plans: r = ue,
654
- defaultOpenId: o = "100gb",
653
+ plans: r = he,
654
+ defaultOpenId: i = "100gb",
655
655
  defaultBilling: s = "yearly",
656
- className: t,
656
+ className: a,
657
657
  ...d
658
658
  }) => {
659
- const [u, h] = x(o), [p, f] = x(s), [N, z] = x(!1), I = r.some((l) => l.hidden), _ = N ? r : r.filter((l) => !l.hidden), E = (l) => {
660
- h((b) => b === l ? null : l);
661
- }, K = (l) => p === "yearly" ? l.yearlyPrice : l.monthlyPrice, W = (l) => {
662
- const b = l.monthlyPrice - l.yearlyPrice;
663
- return b > 0 ? Math.round(b / l.monthlyPrice * 100) : 0;
659
+ const [h, u] = v(i), [g, p] = v(s), [y, k] = v(!1), f = r.some((c) => c.hidden), _ = y ? r : r.filter((c) => !c.hidden), E = (c) => {
660
+ u((x) => x === c ? null : c);
661
+ }, K = (c) => g === "yearly" ? c.yearlyPrice : c.monthlyPrice, W = (c) => {
662
+ const x = c.monthlyPrice - c.yearlyPrice;
663
+ return x > 0 ? Math.round(x / c.monthlyPrice * 100) : 0;
664
664
  };
665
- return /* @__PURE__ */ e("section", { className: c("section-padding", t), ...d, children: /* @__PURE__ */ i("div", { className: "container-narrow", children: [
666
- a && /* @__PURE__ */ e(m, { variant: "h2", className: "mb-2 text-center", children: a }),
665
+ return /* @__PURE__ */ e("section", { className: l("section-padding", a), ...d, children: /* @__PURE__ */ o("div", { className: "container-narrow", children: [
666
+ t && /* @__PURE__ */ e(m, { variant: "h2", className: "mb-2 text-center", children: t }),
667
667
  n && /* @__PURE__ */ e(m, { variant: "body", tone: "muted", className: "mb-8 text-center", children: n }),
668
- /* @__PURE__ */ e("div", { className: "flex items-center justify-center mb-8", children: /* @__PURE__ */ i("div", { className: "inline-flex rounded-xl border border-border bg-muted p-1 gap-1", children: [
668
+ /* @__PURE__ */ e("div", { className: "flex items-center justify-center mb-8", children: /* @__PURE__ */ o("div", { className: "inline-flex rounded-xl border border-border bg-muted p-1 gap-1", children: [
669
669
  /* @__PURE__ */ e(
670
670
  "button",
671
671
  {
672
- onClick: () => f("monthly"),
673
- className: c(
672
+ onClick: () => p("monthly"),
673
+ className: l(
674
674
  "rounded-lg px-5 py-2.5 font-body text-sm font-medium transition-fast",
675
- p === "monthly" ? "bg-background text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground"
675
+ g === "monthly" ? "bg-background text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground"
676
676
  ),
677
677
  children: "Monatlich kündbar"
678
678
  }
@@ -680,71 +680,71 @@ const je = ({ items: a, className: n, ...r }) => {
680
680
  /* @__PURE__ */ e(
681
681
  "button",
682
682
  {
683
- onClick: () => f("yearly"),
684
- className: c(
683
+ onClick: () => p("yearly"),
684
+ className: l(
685
685
  "rounded-lg px-5 py-2.5 font-body text-sm font-medium transition-fast",
686
- p === "yearly" ? "bg-background text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground"
686
+ g === "yearly" ? "bg-background text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground"
687
687
  ),
688
688
  children: "12 Monate Laufzeit"
689
689
  }
690
690
  )
691
691
  ] }) }),
692
- /* @__PURE__ */ e("div", { className: "space-y-3", children: _.map((l) => {
693
- const b = u === l.id, q = K(l), V = W(l);
694
- return /* @__PURE__ */ i(
692
+ /* @__PURE__ */ e("div", { className: "space-y-3", children: _.map((c) => {
693
+ const x = h === c.id, q = K(c), V = W(c);
694
+ return /* @__PURE__ */ o(
695
695
  "div",
696
696
  {
697
- className: c(
697
+ className: l(
698
698
  "rounded-2xl border transition-fast overflow-hidden",
699
- b ? "border-primary bg-card shadow-md ring-1 ring-primary/20" : "border-border bg-card hover:border-primary/40 hover:shadow-sm"
699
+ x ? "border-primary bg-card shadow-md ring-1 ring-primary/20" : "border-border bg-card hover:border-primary/40 hover:shadow-sm"
700
700
  ),
701
701
  children: [
702
- /* @__PURE__ */ i(
702
+ /* @__PURE__ */ o(
703
703
  "div",
704
704
  {
705
705
  className: "flex items-center gap-4 px-5 py-4 cursor-pointer select-none",
706
- onClick: () => E(l.id),
706
+ onClick: () => E(c.id),
707
707
  children: [
708
708
  /* @__PURE__ */ e(
709
709
  "div",
710
710
  {
711
- className: c(
711
+ className: l(
712
712
  "flex h-10 w-10 shrink-0 items-center justify-center rounded-xl transition-fast",
713
- b ? "bg-primary text-primary-foreground" : "bg-muted text-muted-foreground"
713
+ x ? "bg-primary text-primary-foreground" : "bg-muted text-muted-foreground"
714
714
  ),
715
715
  children: /* @__PURE__ */ e(te, { className: "h-5 w-5" })
716
716
  }
717
717
  ),
718
- /* @__PURE__ */ i("div", { className: "flex items-center gap-3 min-w-0", children: [
719
- /* @__PURE__ */ e(m, { variant: "h4", className: "whitespace-nowrap", children: l.storage }),
720
- l.badge && /* @__PURE__ */ i("span", { className: "hidden sm:inline-flex items-center gap-1 rounded-full bg-primary/10 px-2.5 py-0.5 text-xs font-semibold text-primary", children: [
718
+ /* @__PURE__ */ o("div", { className: "flex items-center gap-3 min-w-0", children: [
719
+ /* @__PURE__ */ e(m, { variant: "h4", className: "whitespace-nowrap", children: c.storage }),
720
+ c.badge && /* @__PURE__ */ o("span", { className: "hidden sm:inline-flex items-center gap-1 rounded-full bg-primary/10 px-2.5 py-0.5 text-xs font-semibold text-primary", children: [
721
721
  /* @__PURE__ */ e(ae, { className: "h-3 w-3" }),
722
- l.badge
722
+ c.badge
723
723
  ] })
724
724
  ] }),
725
- /* @__PURE__ */ i("div", { className: "ml-auto flex items-center gap-3", children: [
726
- /* @__PURE__ */ i("div", { className: "text-right", children: [
727
- /* @__PURE__ */ i("span", { className: "font-display text-xl font-bold text-foreground", children: [
725
+ /* @__PURE__ */ o("div", { className: "ml-auto flex items-center gap-3", children: [
726
+ /* @__PURE__ */ o("div", { className: "text-right", children: [
727
+ /* @__PURE__ */ o("span", { className: "font-display text-xl font-bold text-foreground", children: [
728
728
  q.toFixed(2).replace(".", ","),
729
729
  " €"
730
730
  ] }),
731
731
  /* @__PURE__ */ e("span", { className: "text-sm text-muted-foreground", children: "/Monat" })
732
732
  ] }),
733
- !b && l.ctaHref && /* @__PURE__ */ e(
733
+ !x && c.ctaHref && /* @__PURE__ */ e(
734
734
  "a",
735
735
  {
736
- href: l.ctaHref,
737
- onClick: (B) => B.stopPropagation(),
736
+ href: c.ctaHref,
737
+ onClick: (A) => A.stopPropagation(),
738
738
  className: "hidden sm:inline-flex",
739
- children: /* @__PURE__ */ e(g, { size: "sm", variant: "outline", children: l.ctaLabel || "Auswählen" })
739
+ children: /* @__PURE__ */ e(b, { size: "sm", variant: "outline", children: c.ctaLabel || "Auswählen" })
740
740
  }
741
741
  ),
742
742
  /* @__PURE__ */ e(
743
- F,
743
+ j,
744
744
  {
745
- className: c(
745
+ className: l(
746
746
  "h-5 w-5 shrink-0 text-muted-foreground transition-transform duration-200",
747
- b && "rotate-180"
747
+ x && "rotate-180"
748
748
  )
749
749
  }
750
750
  )
@@ -755,12 +755,12 @@ const je = ({ items: a, className: n, ...r }) => {
755
755
  /* @__PURE__ */ e(
756
756
  "div",
757
757
  {
758
- className: c(
758
+ className: l(
759
759
  "grid transition-all duration-200 ease-in-out",
760
- b ? "grid-rows-[1fr]" : "grid-rows-[0fr]"
760
+ x ? "grid-rows-[1fr]" : "grid-rows-[0fr]"
761
761
  ),
762
- children: /* @__PURE__ */ e("div", { className: "overflow-hidden", children: /* @__PURE__ */ i("div", { className: "px-5 pb-5 pt-1", children: [
763
- p === "monthly" && V > 0 && /* @__PURE__ */ i(
762
+ children: /* @__PURE__ */ e("div", { className: "overflow-hidden", children: /* @__PURE__ */ o("div", { className: "px-5 pb-5 pt-1", children: [
763
+ g === "monthly" && V > 0 && /* @__PURE__ */ o(
764
764
  m,
765
765
  {
766
766
  variant: "body-sm",
@@ -772,41 +772,41 @@ const je = ({ items: a, className: n, ...r }) => {
772
772
  ]
773
773
  }
774
774
  ),
775
- /* @__PURE__ */ e("ul", { className: "grid grid-cols-1 sm:grid-cols-2 gap-2 mb-5", children: l.features.map((B, O) => /* @__PURE__ */ i(
775
+ /* @__PURE__ */ e("ul", { className: "grid grid-cols-1 sm:grid-cols-2 gap-2 mb-5", children: c.features.map((A, O) => /* @__PURE__ */ o(
776
776
  "li",
777
777
  {
778
778
  className: "flex items-start gap-2 font-body text-sm text-muted-foreground",
779
779
  children: [
780
780
  /* @__PURE__ */ e(ne, { className: "h-4 w-4 mt-0.5 shrink-0 text-primary" }),
781
- B
781
+ A
782
782
  ]
783
783
  },
784
784
  O
785
785
  )) }),
786
- l.ctaHref && /* @__PURE__ */ e("a", { href: l.ctaHref, children: /* @__PURE__ */ e(g, { className: "w-full sm:w-auto", size: "lg", children: l.ctaLabel || "Jetzt buchen" }) })
786
+ c.ctaHref && /* @__PURE__ */ e("a", { href: c.ctaHref, children: /* @__PURE__ */ e(b, { className: "w-full sm:w-auto", size: "lg", children: c.ctaLabel || "Jetzt buchen" }) })
787
787
  ] }) })
788
788
  }
789
789
  )
790
790
  ]
791
791
  },
792
- l.id
792
+ c.id
793
793
  );
794
794
  }) }),
795
- I && /* @__PURE__ */ e("div", { className: "flex justify-center mt-4", children: /* @__PURE__ */ i(
796
- g,
795
+ f && /* @__PURE__ */ e("div", { className: "flex justify-center mt-4", children: /* @__PURE__ */ o(
796
+ b,
797
797
  {
798
798
  variant: "ghost",
799
799
  size: "sm",
800
- onClick: () => z((l) => !l),
800
+ onClick: () => k((c) => !c),
801
801
  className: "gap-1.5 text-muted-foreground",
802
802
  children: [
803
- N ? "Weniger Tarife" : "Weitere Tarife",
803
+ y ? "Weniger Tarife" : "Weitere Tarife",
804
804
  /* @__PURE__ */ e(
805
- F,
805
+ j,
806
806
  {
807
- className: c(
807
+ className: l(
808
808
  "h-4 w-4 transition-transform duration-200",
809
- N && "rotate-180"
809
+ y && "rotate-180"
810
810
  )
811
811
  }
812
812
  )
@@ -815,41 +815,105 @@ const je = ({ items: a, className: n, ...r }) => {
815
815
  ) }),
816
816
  /* @__PURE__ */ e(m, { variant: "caption", className: "mt-6 block text-center", children: "Alle Preise inkl. MwSt. Kündigung bis 4 Wochen zum Ende der Vertragslaufzeit möglich." })
817
817
  ] }) });
818
- }, w = [
818
+ }, Ve = ({
819
+ items: t,
820
+ defaultActiveId: n,
821
+ variant: r = "underline",
822
+ onTabChange: i,
823
+ className: s,
824
+ ...a
825
+ }) => {
826
+ var k;
827
+ const [d, h] = v(n || ((k = t[0]) == null ? void 0 : k.id)), u = (f) => {
828
+ h(f), i == null || i(f);
829
+ }, g = t.find((f) => f.id === d), y = {
830
+ underline: {
831
+ list: "border-b border-border",
832
+ tab: (f) => l(
833
+ "relative px-4 py-2.5 font-body text-sm font-medium transition-fast -mb-px",
834
+ f ? "text-primary border-b-2 border-primary" : "text-muted-foreground hover:text-foreground"
835
+ )
836
+ },
837
+ pills: {
838
+ list: "gap-1 bg-muted rounded-lg p-1",
839
+ tab: (f) => l(
840
+ "px-4 py-2 rounded-md font-body text-sm font-medium transition-fast",
841
+ f ? "bg-background text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground"
842
+ )
843
+ },
844
+ enclosed: {
845
+ list: "border-b border-border",
846
+ tab: (f) => l(
847
+ "px-4 py-2.5 font-body text-sm font-medium transition-fast border border-transparent rounded-t-lg -mb-px",
848
+ f ? "bg-background text-foreground border-border border-b-background" : "text-muted-foreground hover:text-foreground hover:bg-muted/50"
849
+ )
850
+ }
851
+ }[r];
852
+ return /* @__PURE__ */ o("div", { className: l("w-full", s), ...a, children: [
853
+ /* @__PURE__ */ e(
854
+ "div",
855
+ {
856
+ role: "tablist",
857
+ className: l("flex items-center", y.list),
858
+ children: t.map((f) => /* @__PURE__ */ e(
859
+ "button",
860
+ {
861
+ role: "tab",
862
+ "aria-selected": f.id === d,
863
+ "aria-controls": `tabpanel-${f.id}`,
864
+ onClick: () => u(f.id),
865
+ className: y.tab(f.id === d),
866
+ children: f.label
867
+ },
868
+ f.id
869
+ ))
870
+ }
871
+ ),
872
+ /* @__PURE__ */ e(
873
+ "div",
874
+ {
875
+ role: "tabpanel",
876
+ id: `tabpanel-${d}`,
877
+ className: "pt-4",
878
+ children: g == null ? void 0 : g.content
879
+ }
880
+ )
881
+ ] });
882
+ }, P = [
819
883
  { id: "default", name: "Core Framework" },
820
884
  { id: "webde", name: "WEB.DE" },
821
885
  { id: "gmx", name: "GMX" }
822
- ], D = J({
823
- brand: w[0],
886
+ ], I = J({
887
+ brand: P[0],
824
888
  setBrand: () => {
825
889
  }
826
- }), fe = () => L(D), He = ({
827
- children: a,
890
+ }), fe = () => L(I), He = ({
891
+ children: t,
828
892
  defaultBrand: n = "default"
829
893
  }) => {
830
- const [r, o] = x(
831
- w.find((t) => t.id === n) || w[0]
832
- ), s = Q((t) => {
833
- const d = w.find((u) => u.id === t);
834
- d && o(d);
894
+ const [r, i] = v(
895
+ P.find((a) => a.id === n) || P[0]
896
+ ), s = $((a) => {
897
+ const d = P.find((h) => h.id === a);
898
+ d && i(d);
835
899
  }, []);
836
- return X(() => {
837
- const t = document.documentElement;
838
- return r.id === "default" ? t.removeAttribute("data-brand") : t.setAttribute("data-brand", r.id), () => t.removeAttribute("data-brand");
839
- }, [r]), /* @__PURE__ */ e(D.Provider, { value: { brand: r, setBrand: s }, children: a });
840
- }, Re = ({ className: a }) => {
900
+ return Q(() => {
901
+ const a = document.documentElement;
902
+ return r.id === "default" ? a.removeAttribute("data-brand") : a.setAttribute("data-brand", r.id), () => a.removeAttribute("data-brand");
903
+ }, [r]), /* @__PURE__ */ e(I.Provider, { value: { brand: r, setBrand: s }, children: t });
904
+ }, Re = ({ className: t }) => {
841
905
  const { brand: n, setBrand: r } = fe();
842
- return /* @__PURE__ */ e("div", { className: c("flex items-center gap-1 rounded-xl border border-border bg-muted p-1", a), children: w.map((o) => /* @__PURE__ */ e(
906
+ return /* @__PURE__ */ e("div", { className: l("flex items-center gap-1 rounded-xl border border-border bg-muted p-1", t), children: P.map((i) => /* @__PURE__ */ e(
843
907
  "button",
844
908
  {
845
- onClick: () => r(o.id),
846
- className: c(
909
+ onClick: () => r(i.id),
910
+ className: l(
847
911
  "rounded-lg px-3 py-1.5 font-body text-xs font-medium transition-fast",
848
- n.id === o.id ? "bg-primary text-primary-foreground shadow-sm" : "text-muted-foreground hover:text-foreground hover:bg-background"
912
+ n.id === i.id ? "bg-primary text-primary-foreground shadow-sm" : "text-muted-foreground hover:text-foreground hover:bg-background"
849
913
  ),
850
- children: o.name
914
+ children: i.name
851
915
  },
852
- o.id
916
+ i.id
853
917
  )) });
854
918
  };
855
919
  export {
@@ -858,16 +922,17 @@ export {
858
922
  Re as BrandSwitcher,
859
923
  je as Breadcrumb,
860
924
  Be as ContactForm,
861
- Pe as ContentCard,
862
- ze as FaqAccordion,
925
+ ze as ContentCard,
926
+ Ce as FaqAccordion,
863
927
  Fe as Footer,
864
928
  ke as Hero,
865
- Ce as ImageTextTeaser,
929
+ Pe as ImageTextTeaser,
866
930
  Ae as Navbar,
867
- he as SearchBar,
868
- Ve as TariffSelect,
931
+ ue as SearchBar,
932
+ Ve as Tabs,
933
+ Se as TariffSelect,
869
934
  m as Typography,
870
- w as brands,
935
+ P as brands,
871
936
  fe as useBrand
872
937
  };
873
938
  //# sourceMappingURL=index.mjs.map