@nswds/app 1.117.0 → 1.118.0

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.
Files changed (10) hide show
  1. package/dist/globals.css +618 -706
  2. package/dist/index.cjs +390 -305
  3. package/dist/index.cjs.map +1 -1
  4. package/dist/index.d.cts +7 -8
  5. package/dist/index.d.ts +7 -8
  6. package/dist/index.js +390 -305
  7. package/dist/index.js.map +1 -1
  8. package/dist/styles.css +618 -706
  9. package/dist/styles.css.map +1 -1
  10. package/package.json +1 -1
package/dist/index.cjs CHANGED
@@ -18241,25 +18241,101 @@ function DynamicFavicon({ lightModeFavicon, darkModeFavicon }) {
18241
18241
  }, [lightModeFavicon, darkModeFavicon]);
18242
18242
  return null;
18243
18243
  }
18244
+ var expandableSearchSurfaceVariants = classVarianceAuthority.cva("", {
18245
+ variants: {
18246
+ variant: {
18247
+ default: "bg-grey-100 text-grey-800",
18248
+ "primary-800": "bg-primary-800 text-white",
18249
+ "primary-600": "bg-primary-600 text-white",
18250
+ "primary-400": "bg-primary-400 text-primary-800",
18251
+ "primary-200": "bg-primary-200 text-primary-800",
18252
+ "grey-800": "bg-grey-800 text-white",
18253
+ "grey-600": "bg-grey-600 text-white",
18254
+ "grey-400": "bg-grey-400 text-grey-800",
18255
+ "grey-200": "bg-grey-200 text-grey-800",
18256
+ "accent-800": "bg-accent-800 text-white",
18257
+ "accent-600": "bg-accent-600 text-white",
18258
+ "accent-400": "bg-accent-400 text-accent-800",
18259
+ "accent-200": "bg-accent-200 text-accent-800",
18260
+ white: "bg-white text-grey-800"
18261
+ }
18262
+ },
18263
+ defaultVariants: {
18264
+ variant: "default"
18265
+ }
18266
+ });
18267
+ var expandableSearchCollapsedVariants = classVarianceAuthority.cva("", {
18268
+ variants: {
18269
+ variant: {
18270
+ default: "bg-grey-100 hover:bg-primary-800/10",
18271
+ "primary-800": "bg-primary-800",
18272
+ "primary-600": "bg-primary-600",
18273
+ "primary-400": "bg-primary-400",
18274
+ "primary-200": "bg-primary-200",
18275
+ "grey-800": "bg-grey-800",
18276
+ "grey-600": "bg-grey-600",
18277
+ "grey-400": "bg-grey-400",
18278
+ "grey-200": "bg-grey-200",
18279
+ "accent-800": "bg-accent-800",
18280
+ "accent-600": "bg-accent-600",
18281
+ "accent-400": "bg-accent-400",
18282
+ "accent-200": "bg-accent-200",
18283
+ white: "bg-white"
18284
+ }
18285
+ },
18286
+ defaultVariants: {
18287
+ variant: "default"
18288
+ }
18289
+ });
18290
+ var expandableSearchButtonVariants = classVarianceAuthority.cva("", {
18291
+ variants: {
18292
+ variant: {
18293
+ default: "text-primary group-focus-within:bg-primary-800/10 hover:bg-primary-800/10",
18294
+ "primary-800": "text-white group-focus-within:bg-white/10 hover:bg-white/10",
18295
+ "primary-600": "text-white group-focus-within:bg-white/10 hover:bg-white/10",
18296
+ "primary-400": "text-primary-800 group-focus-within:bg-black/5 hover:bg-black/5",
18297
+ "primary-200": "text-primary-800 group-focus-within:bg-black/5 hover:bg-black/5",
18298
+ "grey-800": "text-white group-focus-within:bg-white/10 hover:bg-white/10",
18299
+ "grey-600": "text-white group-focus-within:bg-white/10 hover:bg-white/10",
18300
+ "grey-400": "text-grey-800 group-focus-within:bg-black/5 hover:bg-black/5",
18301
+ "grey-200": "text-grey-800 group-focus-within:bg-black/5 hover:bg-black/5",
18302
+ "accent-800": "text-white group-focus-within:bg-white/10 hover:bg-white/10",
18303
+ "accent-600": "text-white group-focus-within:bg-white/10 hover:bg-white/10",
18304
+ "accent-400": "text-accent-800 group-focus-within:bg-black/5 hover:bg-black/5",
18305
+ "accent-200": "text-accent-800 group-focus-within:bg-black/5 hover:bg-black/5",
18306
+ white: "text-grey-800 group-focus-within:bg-grey-100 hover:bg-grey-100"
18307
+ }
18308
+ },
18309
+ defaultVariants: {
18310
+ variant: "default"
18311
+ }
18312
+ });
18244
18313
  var ExpandableSearchContext = React5__namespace.createContext(null);
18245
- var ExpandableSearch = React5__namespace.forwardRef(({ className, onAction, defaultValue = "", ...props }, ref) => {
18314
+ var ExpandableSearch = React5__namespace.forwardRef(({ className, onAction, defaultValue = "", variant = "default", ...props }, ref) => {
18246
18315
  const [value, setValue] = React5__namespace.useState(defaultValue);
18247
18316
  const formRef = React5__namespace.useRef(null);
18317
+ const resolvedVariant = variant ?? "default";
18248
18318
  const handleAction = (e) => {
18249
18319
  e.preventDefault();
18250
18320
  if (onAction) {
18251
18321
  onAction(value);
18252
18322
  }
18253
18323
  };
18254
- return /* @__PURE__ */ jsxRuntime.jsx(ExpandableSearchContext.Provider, { value: { value, setValue, formRef }, children: /* @__PURE__ */ jsxRuntime.jsx(
18255
- "form",
18324
+ return /* @__PURE__ */ jsxRuntime.jsx(
18325
+ ExpandableSearchContext.Provider,
18256
18326
  {
18257
- ref,
18258
- className: cn("relative inline-block select-none", className),
18259
- onSubmit: handleAction,
18260
- ...props
18327
+ value: { value, setValue, formRef, variant: resolvedVariant },
18328
+ children: /* @__PURE__ */ jsxRuntime.jsx(
18329
+ "form",
18330
+ {
18331
+ ref,
18332
+ className: cn("relative inline-block select-none", className),
18333
+ onSubmit: handleAction,
18334
+ ...props
18335
+ }
18336
+ )
18261
18337
  }
18262
- ) });
18338
+ );
18263
18339
  });
18264
18340
  ExpandableSearch.displayName = "ExpandableSearch";
18265
18341
  var ExpandableSearchField = React5__namespace.forwardRef(({ className, ...props }, ref) => {
@@ -18267,6 +18343,7 @@ var ExpandableSearchField = React5__namespace.forwardRef(({ className, ...props
18267
18343
  if (!context) throw new Error("ExpandableSearchField must be used within ExpandableSearch");
18268
18344
  const [isFocused, setIsFocused] = React5__namespace.useState(false);
18269
18345
  const isActive = context.value.length > 0 || isFocused;
18346
+ const variant = context.variant;
18270
18347
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex-1", children: [
18271
18348
  /* @__PURE__ */ jsxRuntime.jsx("label", { className: "sr-only", htmlFor: "expandable-search", children: "Search" }),
18272
18349
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -18278,17 +18355,19 @@ var ExpandableSearchField = React5__namespace.forwardRef(({ className, ...props
18278
18355
  onFocus: () => setIsFocused(true),
18279
18356
  onBlur: () => setIsFocused(false),
18280
18357
  className: cn(
18281
- "peer align-center flex h-12 w-12 cursor-pointer overflow-hidden rounded-sm border-0 bg-grey-100 text-transparent placeholder:text-grey-500 hover:bg-primary-800/10",
18358
+ "peer align-center flex h-12 w-12 cursor-pointer overflow-hidden rounded-sm border-0 text-transparent",
18282
18359
  "ring-offset-white focus-visible:ring-2 focus-visible:ring-primary-650/70 focus-visible:ring-offset-2 focus-visible:outline-none",
18283
18360
  "transition-[width,box-shadow,background-color] duration-300 ease-in-out",
18284
18361
  "placeholder:text-transparent placeholder:opacity-0",
18285
18362
  "expandable-search__input",
18363
+ expandableSearchCollapsedVariants({ variant }),
18286
18364
  // Conditionally apply classes based on active state
18287
18365
  {
18288
18366
  "p-0": !isActive,
18289
- "w-96 cursor-auto bg-grey-100 pt-0 pr-12 pb-0 pl-4 text-grey-800 outline-none select-auto": isActive,
18290
- "placeholder:text-grey-700 placeholder:opacity-100": isActive
18367
+ "w-96 cursor-auto pt-0 pr-12 pb-0 pl-4 outline-none select-auto": isActive
18291
18368
  },
18369
+ isActive && expandableSearchSurfaceVariants({ variant }),
18370
+ isActive && (variant === "default" ? "placeholder:text-grey-700 placeholder:opacity-100" : "placeholder:text-current placeholder:opacity-70"),
18292
18371
  className
18293
18372
  ),
18294
18373
  ...props
@@ -18298,8 +18377,11 @@ var ExpandableSearchField = React5__namespace.forwardRef(({ className, ...props
18298
18377
  "button",
18299
18378
  {
18300
18379
  type: "button",
18301
- className: "pointer-events-none absolute top-0 right-0 z-10 flex h-12 w-12 rounded-sm transition-colors duration-200 group-focus-within:bg-primary-800/10 peer-focus:pointer-events-auto hover:bg-primary-800/10",
18302
- children: /* @__PURE__ */ jsxRuntime.jsx(Icons.search, { className: "m-auto block h-8 w-8 shrink-0 fill-primary leading-none" })
18380
+ className: cn(
18381
+ "pointer-events-none absolute top-0 right-0 z-10 flex h-12 w-12 rounded-sm transition-colors duration-200 peer-focus:pointer-events-auto",
18382
+ expandableSearchButtonVariants({ variant })
18383
+ ),
18384
+ children: /* @__PURE__ */ jsxRuntime.jsx(Icons.search, { className: "m-auto block h-8 w-8 shrink-0 fill-current leading-none" })
18303
18385
  }
18304
18386
  )
18305
18387
  ] });
@@ -18404,101 +18486,106 @@ function ErrorMessage({
18404
18486
  }
18405
18487
  );
18406
18488
  }
18407
- var footerVariants = classVarianceAuthority.cva(
18408
- "bg-(--footer-bg) text-(--footer-text) [--footer-social-hover:var(--footer-social)]",
18409
- {
18410
- variants: {
18411
- color: {
18412
- "primary/grey": [
18413
- "[--footer-bg:var(--color-primary-800)] [--footer-text:var(--color-white)] [--footer-muted:var(--color-primary-100)]",
18414
- "dark:[--footer-bg:var(--color-grey-800)] dark:[--footer-text:var(--color-white)] dark:[--footer-muted:var(--color-grey-100)]",
18415
- "[--footer-border:var(--color-white)]/15",
18416
- "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18417
- "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18418
- ],
18419
- light: [
18420
- "[--footer-bg:var(--color-grey-200)] [--footer-text:var(--color-grey-800)] [--footer-muted:var(--color-grey-700)]",
18421
- "dark:[--footer-bg:var(--color-grey-800)] dark:[--footer-text:var(--color-white)] dark:[--footer-muted:var(--color-grey-100)]",
18422
- "[--footer-border:var(--color-grey-300)] dark:[--footer-border:var(--color-white)]/15",
18423
- "[--footer-link:var(--color-grey-700)] [--footer-link-hover-bg:var(--color-grey-800)]/10 [--footer-link-hover-text:var(--color-grey-900)]",
18424
- "dark:[--footer-link:var(--color-white)] dark:[--footer-link-hover-bg:var(--color-white)]/10 dark:[--footer-link-hover-text:var(--color-white)]",
18425
- "[--footer-social:var(--color-grey-800)] [--footer-social-hover:var(--color-grey-900)] [--footer-social-hover-bg:var(--color-grey-800)]/10",
18426
- "dark:[--footer-social:var(--color-white)] dark:[--footer-social-hover:var(--color-white)] dark:[--footer-social-hover-bg:var(--color-white)]/10"
18427
- ],
18428
- "primary/white": [
18429
- "[--footer-bg:var(--color-primary-800)] [--footer-text:var(--color-white)] [--footer-muted:var(--color-primary-100)]",
18430
- "dark:[--footer-bg:var(--color-primary-800)] dark:[--footer-text:var(--color-white)] dark:[--footer-muted:var(--color-primary-100)]",
18431
- "[--footer-border:var(--color-white)]/15",
18432
- "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18433
- "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18434
- ],
18435
- white: [
18436
- "[--footer-bg:var(--color-white)] [--footer-text:var(--color-grey-800)] [--footer-muted:var(--color-grey-600)]",
18437
- "dark:[--footer-bg:var(--color-grey-800)] dark:[--footer-text:var(--color-white)] dark:[--footer-muted:var(--color-grey-100)]",
18438
- "[--footer-border:var(--color-grey-200)] dark:[--footer-border:var(--color-white)]/15",
18439
- "[--footer-link:var(--color-grey-600)] [--footer-link-hover-bg:var(--color-primary-800)]/10 [--footer-link-hover-text:var(--color-grey-800)]",
18440
- "dark:[--footer-link:var(--color-white)] dark:[--footer-link-hover-bg:var(--color-white)]/10 dark:[--footer-link-hover-text:var(--color-white)]",
18441
- "[--footer-social:var(--color-grey-700)] [--footer-social-hover:var(--color-grey-900)] [--footer-social-hover-bg:var(--color-primary-800)]/10",
18442
- "dark:[--footer-social:var(--color-white)] dark:[--footer-social-hover:var(--color-white)] dark:[--footer-social-hover-bg:var(--color-white)]/10"
18443
- ],
18444
- "grey-600": [
18445
- "[--footer-bg:var(--color-grey-600)] [--footer-text:var(--color-white)] [--footer-muted:var(--color-grey-100)]",
18446
- "[--footer-border:var(--color-white)]/15",
18447
- "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18448
- "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18449
- ],
18450
- "grey-800": [
18451
- "[--footer-bg:var(--color-grey-800)] [--footer-text:var(--color-white)] [--footer-muted:var(--color-grey-100)]",
18452
- "[--footer-border:var(--color-white)]/15",
18453
- "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18454
- "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18455
- ],
18456
- "accent-200": [
18457
- "[--footer-bg:var(--color-accent-200)] [--footer-text:var(--color-accent-800)] [--footer-muted:var(--color-accent-700)]",
18458
- "dark:[--footer-bg:var(--color-accent-800)] dark:[--footer-text:var(--color-white)] dark:[--footer-muted:var(--color-accent-100)]",
18459
- "[--footer-border:var(--color-accent-800)]/15 dark:[--footer-border:var(--color-white)]/15",
18460
- "[--footer-link:var(--color-accent-800)] [--footer-link-hover-bg:var(--color-accent-800)]/10 [--footer-link-hover-text:var(--color-accent-800)]",
18461
- "dark:[--footer-link:var(--color-white)] dark:[--footer-link-hover-bg:var(--color-white)]/10 dark:[--footer-link-hover-text:var(--color-white)]",
18462
- "[--footer-social:var(--color-accent-800)] [--footer-social-hover-bg:var(--color-accent-800)]/10",
18463
- "dark:[--footer-social:var(--color-white)] dark:[--footer-social-hover-bg:var(--color-white)]/10"
18464
- ],
18465
- primary: [
18466
- "[--footer-bg:var(--color-primary-800)] [--footer-text:var(--color-white)] [--footer-muted:var(--color-primary-100)]",
18467
- "dark:[--footer-bg:var(--color-primary-800)] dark:[--footer-text:var(--color-white)] dark:[--footer-muted:var(--color-primary-100)]",
18468
- "[--footer-border:var(--color-white)]/15",
18469
- "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18470
- "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18471
- ],
18472
- secondary: [
18473
- "[--footer-bg:var(--color-primary-200)] [--footer-text:var(--color-primary-800)] [--footer-muted:var(--color-primary-700)]",
18474
- "dark:[--footer-bg:var(--color-primary-900)] dark:[--footer-text:var(--color-white)] dark:[--footer-muted:var(--color-primary-100)]",
18475
- "[--footer-border:var(--color-primary-800)]/15 dark:[--footer-border:var(--color-white)]/15",
18476
- "[--footer-link:var(--color-primary-800)] [--footer-link-hover-bg:var(--color-primary-800)]/10 [--footer-link-hover-text:var(--color-primary-800)]",
18477
- "dark:[--footer-link:var(--color-white)] dark:[--footer-link-hover-bg:var(--color-white)]/10 dark:[--footer-link-hover-text:var(--color-white)]",
18478
- "[--footer-social:var(--color-primary-800)] [--footer-social-hover-bg:var(--color-primary-800)]/10",
18479
- "dark:[--footer-social:var(--color-white)] dark:[--footer-social-hover-bg:var(--color-white)]/10"
18480
- ],
18481
- accent: [
18482
- "[--footer-bg:var(--color-accent-800)] [--footer-text:var(--color-white)] [--footer-muted:var(--color-accent-100)]",
18483
- "dark:[--footer-bg:var(--color-accent-800)] dark:[--footer-text:var(--color-white)] dark:[--footer-muted:var(--color-accent-100)]",
18484
- "[--footer-border:var(--color-white)]/15",
18485
- "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18486
- "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18487
- ],
18488
- danger: [
18489
- "[--footer-bg:var(--color-danger-600)] [--footer-text:var(--color-white)] [--footer-muted:var(--color-danger-100)]",
18490
- "dark:[--footer-bg:var(--color-danger-600)] dark:[--footer-text:var(--color-white)] dark:[--footer-muted:var(--color-danger-100)]",
18491
- "[--footer-border:var(--color-white)]/15",
18492
- "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18493
- "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18494
- ]
18495
- }
18496
- },
18497
- defaultVariants: {
18498
- color: "white"
18489
+ var footerVariants = classVarianceAuthority.cva("[--footer-social-hover:var(--footer-social)]", {
18490
+ variants: {
18491
+ color: {
18492
+ "primary-800": [
18493
+ "bg-primary-800 text-white",
18494
+ "[--footer-text:var(--color-white)]",
18495
+ "[--footer-border:var(--color-white)]/15",
18496
+ "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18497
+ "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18498
+ ],
18499
+ "primary-600": [
18500
+ "bg-primary-600 text-white",
18501
+ "[--footer-text:var(--color-white)]",
18502
+ "[--footer-border:var(--color-white)]/15",
18503
+ "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18504
+ "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18505
+ ],
18506
+ "primary-400": [
18507
+ "bg-primary-400 text-primary-800",
18508
+ "[--footer-text:var(--color-primary-800)]",
18509
+ "[--footer-border:var(--color-primary-800)]/15",
18510
+ "[--footer-link:var(--color-primary-800)] [--footer-link-hover-bg:var(--color-primary-800)]/10 [--footer-link-hover-text:var(--color-primary-800)]",
18511
+ "[--footer-social:var(--color-primary-800)] [--footer-social-hover-bg:var(--color-primary-800)]/10"
18512
+ ],
18513
+ "primary-200": [
18514
+ "bg-primary-200 text-primary-800",
18515
+ "[--footer-text:var(--color-primary-800)]",
18516
+ "[--footer-border:var(--color-primary-800)]/15",
18517
+ "[--footer-link:var(--color-primary-800)] [--footer-link-hover-bg:var(--color-primary-800)]/10 [--footer-link-hover-text:var(--color-primary-800)]",
18518
+ "[--footer-social:var(--color-primary-800)] [--footer-social-hover-bg:var(--color-primary-800)]/10"
18519
+ ],
18520
+ "grey-800": [
18521
+ "bg-grey-800 text-white",
18522
+ "[--footer-text:var(--color-white)]",
18523
+ "[--footer-border:var(--color-white)]/15",
18524
+ "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18525
+ "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18526
+ ],
18527
+ "grey-600": [
18528
+ "bg-grey-600 text-white",
18529
+ "[--footer-text:var(--color-white)]",
18530
+ "[--footer-border:var(--color-white)]/15",
18531
+ "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18532
+ "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18533
+ ],
18534
+ "grey-400": [
18535
+ "bg-grey-400 text-grey-800",
18536
+ "[--footer-text:var(--color-grey-800)]",
18537
+ "[--footer-border:var(--color-grey-800)]/15",
18538
+ "[--footer-link:var(--color-grey-800)] [--footer-link-hover-bg:var(--color-grey-800)]/10 [--footer-link-hover-text:var(--color-grey-800)]",
18539
+ "[--footer-social:var(--color-grey-800)] [--footer-social-hover-bg:var(--color-grey-800)]/10"
18540
+ ],
18541
+ "grey-200": [
18542
+ "bg-grey-200 text-grey-800",
18543
+ "[--footer-text:var(--color-grey-800)]",
18544
+ "[--footer-border:var(--color-grey-800)]/15",
18545
+ "[--footer-link:var(--color-grey-800)] [--footer-link-hover-bg:var(--color-grey-800)]/10 [--footer-link-hover-text:var(--color-grey-800)]",
18546
+ "[--footer-social:var(--color-grey-800)] [--footer-social-hover-bg:var(--color-grey-800)]/10"
18547
+ ],
18548
+ "accent-800": [
18549
+ "bg-accent-800 text-white",
18550
+ "[--footer-text:var(--color-white)]",
18551
+ "[--footer-border:var(--color-white)]/15",
18552
+ "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18553
+ "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18554
+ ],
18555
+ "accent-600": [
18556
+ "bg-accent-600 text-white",
18557
+ "[--footer-text:var(--color-white)]",
18558
+ "[--footer-border:var(--color-white)]/15",
18559
+ "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18560
+ "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18561
+ ],
18562
+ "accent-400": [
18563
+ "bg-accent-400 text-accent-800",
18564
+ "[--footer-text:var(--color-accent-800)]",
18565
+ "[--footer-border:var(--color-accent-800)]/15",
18566
+ "[--footer-link:var(--color-accent-800)] [--footer-link-hover-bg:var(--color-accent-800)]/10 [--footer-link-hover-text:var(--color-accent-800)]",
18567
+ "[--footer-social:var(--color-accent-800)] [--footer-social-hover-bg:var(--color-accent-800)]/10"
18568
+ ],
18569
+ "accent-200": [
18570
+ "bg-accent-200 text-accent-800",
18571
+ "[--footer-text:var(--color-accent-800)]",
18572
+ "[--footer-border:var(--color-accent-800)]/15",
18573
+ "[--footer-link:var(--color-accent-800)] [--footer-link-hover-bg:var(--color-accent-800)]/10 [--footer-link-hover-text:var(--color-accent-800)]",
18574
+ "[--footer-social:var(--color-accent-800)] [--footer-social-hover-bg:var(--color-accent-800)]/10"
18575
+ ],
18576
+ white: [
18577
+ "bg-white text-grey-800",
18578
+ "[--footer-text:var(--color-grey-800)]",
18579
+ "[--footer-border:var(--color-grey-200)]",
18580
+ "[--footer-link:var(--color-grey-800)] [--footer-link-hover-bg:var(--color-grey-800)]/10 [--footer-link-hover-text:var(--color-grey-800)]",
18581
+ "[--footer-social:var(--color-grey-800)] [--footer-social-hover-bg:var(--color-grey-800)]/10"
18582
+ ]
18499
18583
  }
18584
+ },
18585
+ defaultVariants: {
18586
+ color: "white"
18500
18587
  }
18501
- );
18588
+ });
18502
18589
  var footerSocialLinkClassName = [
18503
18590
  "group",
18504
18591
  "[--btn-bg:var(--footer-social)]",
@@ -18827,7 +18914,7 @@ function FormatToggle({ format, setFormat }) {
18827
18914
 
18828
18915
  // package.json
18829
18916
  var package_default = {
18830
- version: "1.116.0"};
18917
+ version: "1.117.0"};
18831
18918
  var SluggerContext = React5__namespace.default.createContext(null);
18832
18919
  function flattenText(nodes) {
18833
18920
  if (nodes == null || typeof nodes === "boolean") return "";
@@ -19213,7 +19300,6 @@ var heroBannerVariants2 = classVarianceAuthority.cva("relative", {
19213
19300
  "grey-600": "bg-grey-600 text-white",
19214
19301
  "grey-400": "bg-grey-400 text-grey-800",
19215
19302
  "grey-200": "bg-grey-200 text-grey-800",
19216
- "grey-150": "bg-grey-200 text-grey-800",
19217
19303
  "accent-800": "bg-accent-800 text-white",
19218
19304
  "accent-600": "bg-accent-600 text-white",
19219
19305
  "accent-400": "bg-accent-400 text-accent-800",
@@ -29782,141 +29868,146 @@ function NavigationMenuIndicator({
29782
29868
  }
29783
29869
  );
29784
29870
  }
29785
- var navigationMenuMainNavigationSurfaceStyles = classVarianceAuthority.cva("", {
29786
- variants: {
29787
- variant: {
29788
- primary: "bg-primary-800 dark:bg-primary-900",
29789
- secondary: "bg-[#f5f2ff] dark:bg-[#261447]",
29790
- tertiary: "bg-primary-600 dark:bg-primary-700",
29791
- white: "bg-white dark:bg-grey-950",
29792
- grey: "bg-grey-100 dark:bg-grey-900"
29793
- }
29794
- },
29795
- defaultVariants: {
29796
- variant: "grey"
29797
- }
29798
- });
29799
- var navigationMenuMainNavigationBorderStyles = classVarianceAuthority.cva("", {
29800
- variants: {
29801
- variant: {
29802
- primary: "border-primary-700 dark:border-primary-600",
29803
- secondary: "border-[#d9ccff] dark:border-[#4e3a86]",
29804
- tertiary: "border-primary-500 dark:border-primary-600",
29805
- white: "border-grey-200 dark:border-grey-800",
29806
- grey: "border-grey-200 dark:border-grey-800"
29807
- }
29808
- },
29809
- defaultVariants: {
29810
- variant: "grey"
29811
- }
29812
- });
29813
- var navigationMenuMainNavigationTriggerToneStyles = classVarianceAuthority.cva("", {
29814
- variants: {
29815
- variant: {
29816
- primary: "text-white dark:text-primary-50",
29817
- secondary: "text-primary-800 dark:text-primary-100",
29818
- tertiary: "text-white dark:text-primary-50",
29819
- white: "text-grey-900 dark:text-white",
29820
- grey: "text-grey-800 dark:text-grey-100"
29821
- }
29822
- },
29823
- defaultVariants: {
29824
- variant: "grey"
29825
- }
29826
- });
29827
- var navigationMenuMainNavigationTriggerActiveStyles = classVarianceAuthority.cva("", {
29828
- variants: {
29829
- variant: {
29830
- primary: "hover:bg-primary-700 hover:text-white focus:bg-primary-700 focus:text-white data-[state=open]:bg-primary-700 data-[state=open]:text-white dark:hover:bg-primary-800 dark:hover:text-white dark:focus:bg-primary-800 dark:focus:text-white dark:data-[state=open]:bg-primary-800 dark:data-[state=open]:text-white",
29831
- secondary: "hover:bg-[#e8e2ff] hover:text-primary-800 focus:bg-[#e8e2ff] focus:text-primary-800 data-[state=open]:bg-[#e8e2ff] data-[state=open]:text-primary-800 dark:hover:bg-[#32205a] dark:hover:text-primary-200 dark:focus:bg-[#32205a] dark:focus:text-primary-200 dark:data-[state=open]:bg-[#32205a] dark:data-[state=open]:text-primary-200",
29832
- tertiary: "hover:bg-primary-500 hover:text-white focus:bg-primary-500 focus:text-white data-[state=open]:bg-primary-500 data-[state=open]:text-white dark:hover:bg-primary-600 dark:hover:text-white dark:focus:bg-primary-600 dark:focus:text-white dark:data-[state=open]:bg-primary-600 dark:data-[state=open]:text-white",
29833
- white: "hover:bg-grey-100 hover:text-primary-800 focus:bg-grey-100 focus:text-primary-800 data-[state=open]:bg-grey-100 data-[state=open]:text-primary-800 dark:hover:bg-grey-800 dark:hover:text-primary-200 dark:focus:bg-grey-800 dark:focus:text-primary-200 dark:data-[state=open]:bg-grey-800 dark:data-[state=open]:text-primary-200",
29834
- grey: "hover:bg-grey-200 hover:text-primary-800 focus:bg-grey-200 focus:text-primary-800 data-[state=open]:bg-grey-200 data-[state=open]:text-primary-800 dark:hover:bg-grey-800 dark:hover:text-primary-200 dark:focus:bg-grey-800 dark:focus:text-primary-200 dark:data-[state=open]:bg-grey-800 dark:data-[state=open]:text-primary-200"
29835
- }
29836
- },
29837
- defaultVariants: {
29838
- variant: "grey"
29839
- }
29840
- });
29841
- var navigationMenuMainNavigationTriggerEdgeStyles = classVarianceAuthority.cva("", {
29842
- variants: {
29843
- variant: {
29844
- primary: "hover:before:bg-primary-700 hover:after:bg-primary-700 focus:before:bg-primary-700 focus:after:bg-primary-700 data-[state=open]:before:bg-primary-700 data-[state=open]:after:bg-primary-700 dark:hover:before:bg-primary-800 dark:hover:after:bg-primary-800 dark:focus:before:bg-primary-800 dark:focus:after:bg-primary-800 dark:data-[state=open]:before:bg-primary-800 dark:data-[state=open]:after:bg-primary-800",
29845
- secondary: "hover:before:bg-[#e8e2ff] hover:after:bg-[#e8e2ff] focus:before:bg-[#e8e2ff] focus:after:bg-[#e8e2ff] data-[state=open]:before:bg-[#e8e2ff] data-[state=open]:after:bg-[#e8e2ff] dark:hover:before:bg-[#32205a] dark:hover:after:bg-[#32205a] dark:focus:before:bg-[#32205a] dark:focus:after:bg-[#32205a] dark:data-[state=open]:before:bg-[#32205a] dark:data-[state=open]:after:bg-[#32205a]",
29846
- tertiary: "hover:before:bg-primary-500 hover:after:bg-primary-500 focus:before:bg-primary-500 focus:after:bg-primary-500 data-[state=open]:before:bg-primary-500 data-[state=open]:after:bg-primary-500 dark:hover:before:bg-primary-600 dark:hover:after:bg-primary-600 dark:focus:before:bg-primary-600 dark:focus:after:bg-primary-600 dark:data-[state=open]:before:bg-primary-600 dark:data-[state=open]:after:bg-primary-600",
29847
- white: "hover:before:bg-grey-100 hover:after:bg-grey-100 focus:before:bg-grey-100 focus:after:bg-grey-100 data-[state=open]:before:bg-grey-100 data-[state=open]:after:bg-grey-100 dark:hover:before:bg-grey-800 dark:hover:after:bg-grey-800 dark:focus:before:bg-grey-800 dark:focus:after:bg-grey-800 dark:data-[state=open]:before:bg-grey-800 dark:data-[state=open]:after:bg-grey-800",
29848
- grey: "hover:before:bg-grey-200 hover:after:bg-grey-200 focus:before:bg-grey-200 focus:after:bg-grey-200 data-[state=open]:before:bg-grey-200 data-[state=open]:after:bg-grey-200 dark:hover:before:bg-grey-800 dark:hover:after:bg-grey-800 dark:focus:before:bg-grey-800 dark:focus:after:bg-grey-800 dark:data-[state=open]:before:bg-grey-800 dark:data-[state=open]:after:bg-grey-800"
29849
- }
29850
- },
29851
- defaultVariants: {
29852
- variant: "grey"
29853
- }
29854
- });
29855
- var navigationMenuMainNavigationDropdownSurfaceStyles = classVarianceAuthority.cva(
29856
- "w-full shadow dark:shadow-black/40",
29857
- {
29858
- variants: {
29859
- variant: {
29860
- primary: "bg-white dark:bg-grey-950",
29861
- secondary: "bg-white dark:bg-grey-900",
29862
- tertiary: "bg-white dark:bg-grey-950",
29863
- white: "bg-white dark:bg-grey-950",
29864
- grey: "bg-white dark:bg-grey-950"
29865
- }
29866
- },
29867
- defaultVariants: {
29868
- variant: "grey"
29869
- }
29870
- }
29871
- );
29872
- var navigationMenuMainNavigationFeaturedLinkStyles = classVarianceAuthority.cva(
29873
- "group relative flex items-center px-8 py-8 text-xl font-bold whitespace-normal",
29874
- {
29875
- variants: {
29876
- variant: {
29877
- primary: "text-primary-800 hover:bg-primary-800/8 dark:text-primary-200 dark:hover:bg-primary-900/80",
29878
- secondary: "text-primary-800 hover:bg-[#f5f2ff] dark:text-primary-200 dark:hover:bg-[#32205a]/70",
29879
- tertiary: "text-primary-700 hover:bg-primary-100 dark:text-primary-200 dark:hover:bg-primary-900/70",
29880
- white: "text-primary-800 hover:bg-grey-100 dark:text-primary-200 dark:hover:bg-grey-800/80",
29881
- grey: "text-primary-800 hover:bg-grey-100 dark:text-primary-200 dark:hover:bg-grey-800/80"
29882
- }
29883
- },
29884
- defaultVariants: {
29885
- variant: "grey"
29886
- }
29887
- }
29888
- );
29889
- var navigationMenuMainNavigationSectionLinkStyles = classVarianceAuthority.cva(
29890
- "relative mx-2 rounded-none border-t p-4 whitespace-normal focus-within:rounded-sm focus-within:outline focus-within:outline-inherit [&:nth-last-child(-n+3)]:border-b",
29891
- {
29892
- variants: {
29893
- variant: {
29894
- primary: "border-primary-100 bg-white hover:bg-primary-50 hover:font-bold hover:text-primary-800 dark:border-primary-900 dark:bg-grey-950 dark:hover:bg-primary-900/60 dark:hover:text-primary-200",
29895
- secondary: "border-[#ece3ff] bg-white hover:bg-[#f8f4ff] hover:font-bold hover:text-primary-800 dark:border-[#45356e] dark:bg-grey-900 dark:hover:bg-[#32205a]/60 dark:hover:text-primary-200",
29896
- tertiary: "border-primary-100 bg-white hover:bg-primary-50 hover:font-bold hover:text-primary-700 dark:border-primary-900 dark:bg-grey-950 dark:hover:bg-primary-900/60 dark:hover:text-primary-200",
29897
- white: "border-grey-200 bg-white hover:bg-grey-50 hover:font-bold hover:text-primary-800 dark:border-grey-800 dark:bg-grey-950 dark:hover:bg-grey-800/80 dark:hover:text-primary-200",
29898
- grey: "border-grey-200 bg-white hover:bg-grey-50 hover:font-bold hover:text-primary-800 dark:border-grey-800 dark:bg-grey-950 dark:hover:bg-grey-800/80 dark:hover:text-primary-200"
29899
- }
29900
- },
29901
- defaultVariants: {
29902
- variant: "grey"
29903
- }
29904
- }
29905
- );
29906
- var navigationMenuMainNavigationSectionLinkTitleStyles = classVarianceAuthority.cva("text-base font-semibold", {
29907
- variants: {
29908
- variant: {
29909
- primary: "text-grey-900 dark:text-primary-50",
29910
- secondary: "text-grey-900 dark:text-grey-100",
29911
- tertiary: "text-grey-900 dark:text-primary-50",
29912
- white: "text-grey-900 dark:text-white",
29913
- grey: "text-grey-900 dark:text-grey-100"
29914
- }
29915
- },
29916
- defaultVariants: {
29917
- variant: "grey"
29918
- }
29919
- });
29871
+ function createVariantStyles({
29872
+ surface,
29873
+ border,
29874
+ triggerTone,
29875
+ triggerActive,
29876
+ triggerEdge,
29877
+ featuredLink,
29878
+ sectionLink
29879
+ }) {
29880
+ return {
29881
+ surface,
29882
+ border,
29883
+ triggerTone,
29884
+ triggerActive,
29885
+ triggerEdge,
29886
+ dropdownSurface: "bg-white",
29887
+ featuredLink,
29888
+ sectionLink,
29889
+ sectionLinkTitle: "text-grey-900"
29890
+ };
29891
+ }
29892
+ var navigationMenuMainNavigationVariantStyles = {
29893
+ "primary-800": createVariantStyles({
29894
+ surface: "bg-primary-800 text-white",
29895
+ border: "border-primary-700",
29896
+ triggerTone: "text-white",
29897
+ triggerActive: "hover:bg-primary-700 hover:text-white focus:bg-primary-700 focus:text-white data-[state=open]:bg-primary-700 data-[state=open]:text-white",
29898
+ triggerEdge: "hover:before:bg-primary-700 hover:after:bg-primary-700 focus:before:bg-primary-700 focus:after:bg-primary-700 data-[state=open]:before:bg-primary-700 data-[state=open]:after:bg-primary-700",
29899
+ featuredLink: "text-primary-800 hover:bg-primary-800/5",
29900
+ sectionLink: "border-grey-200 bg-white hover:bg-primary-800/5 hover:font-bold hover:text-primary-800"
29901
+ }),
29902
+ "primary-600": createVariantStyles({
29903
+ surface: "bg-primary-600 text-white",
29904
+ border: "border-primary-600",
29905
+ triggerTone: "text-white",
29906
+ triggerActive: "hover:bg-primary-700 hover:text-white focus:bg-primary-700 focus:text-white data-[state=open]:bg-primary-700 data-[state=open]:text-white",
29907
+ triggerEdge: "hover:before:bg-primary-700 hover:after:bg-primary-700 focus:before:bg-primary-700 focus:after:bg-primary-700 data-[state=open]:before:bg-primary-700 data-[state=open]:after:bg-primary-700",
29908
+ featuredLink: "text-primary-800 hover:bg-primary-800/5",
29909
+ sectionLink: "border-grey-200 bg-white hover:bg-primary-800/5 hover:font-bold hover:text-primary-800"
29910
+ }),
29911
+ "primary-400": createVariantStyles({
29912
+ surface: "bg-primary-400 text-primary-800",
29913
+ border: "border-primary-200",
29914
+ triggerTone: "text-primary-800",
29915
+ triggerActive: "hover:bg-primary-200 hover:text-primary-800 focus:bg-primary-200 focus:text-primary-800 data-[state=open]:bg-primary-200 data-[state=open]:text-primary-800",
29916
+ triggerEdge: "hover:before:bg-primary-200 hover:after:bg-primary-200 focus:before:bg-primary-200 focus:after:bg-primary-200 data-[state=open]:before:bg-primary-200 data-[state=open]:after:bg-primary-200",
29917
+ featuredLink: "text-primary-800 hover:bg-primary-800/5",
29918
+ sectionLink: "border-grey-200 bg-white hover:bg-primary-800/5 hover:font-bold hover:text-primary-800"
29919
+ }),
29920
+ "primary-200": createVariantStyles({
29921
+ surface: "bg-primary-200 text-primary-800",
29922
+ border: "border-primary-200",
29923
+ triggerTone: "text-primary-800",
29924
+ triggerActive: "hover:bg-primary-100 hover:text-primary-800 focus:bg-primary-100 focus:text-primary-800 data-[state=open]:bg-primary-100 data-[state=open]:text-primary-800",
29925
+ triggerEdge: "hover:before:bg-primary-100 hover:after:bg-primary-100 focus:before:bg-primary-100 focus:after:bg-primary-100 data-[state=open]:before:bg-primary-100 data-[state=open]:after:bg-primary-100",
29926
+ featuredLink: "text-primary-800 hover:bg-primary-800/5",
29927
+ sectionLink: "border-grey-200 bg-white hover:bg-primary-800/5 hover:font-bold hover:text-primary-800"
29928
+ }),
29929
+ "grey-800": createVariantStyles({
29930
+ surface: "bg-grey-800 text-white",
29931
+ border: "border-grey-700",
29932
+ triggerTone: "text-white",
29933
+ triggerActive: "hover:bg-grey-700 hover:text-white focus:bg-grey-700 focus:text-white data-[state=open]:bg-grey-700 data-[state=open]:text-white",
29934
+ triggerEdge: "hover:before:bg-grey-700 hover:after:bg-grey-700 focus:before:bg-grey-700 focus:after:bg-grey-700 data-[state=open]:before:bg-grey-700 data-[state=open]:after:bg-grey-700",
29935
+ featuredLink: "text-grey-800 hover:bg-grey-800/5",
29936
+ sectionLink: "border-grey-200 bg-white hover:bg-grey-800/5 hover:font-bold hover:text-grey-800"
29937
+ }),
29938
+ "grey-600": createVariantStyles({
29939
+ surface: "bg-grey-600 text-white",
29940
+ border: "border-grey-600",
29941
+ triggerTone: "text-white",
29942
+ triggerActive: "hover:bg-grey-700 hover:text-white focus:bg-grey-700 focus:text-white data-[state=open]:bg-grey-700 data-[state=open]:text-white",
29943
+ triggerEdge: "hover:before:bg-grey-700 hover:after:bg-grey-700 focus:before:bg-grey-700 focus:after:bg-grey-700 data-[state=open]:before:bg-grey-700 data-[state=open]:after:bg-grey-700",
29944
+ featuredLink: "text-grey-800 hover:bg-grey-800/5",
29945
+ sectionLink: "border-grey-200 bg-white hover:bg-grey-800/5 hover:font-bold hover:text-grey-800"
29946
+ }),
29947
+ "grey-400": createVariantStyles({
29948
+ surface: "bg-grey-400 text-grey-800",
29949
+ border: "border-grey-300",
29950
+ triggerTone: "text-grey-800",
29951
+ triggerActive: "hover:bg-grey-200 hover:text-grey-800 focus:bg-grey-200 focus:text-grey-800 data-[state=open]:bg-grey-200 data-[state=open]:text-grey-800",
29952
+ triggerEdge: "hover:before:bg-grey-200 hover:after:bg-grey-200 focus:before:bg-grey-200 focus:after:bg-grey-200 data-[state=open]:before:bg-grey-200 data-[state=open]:after:bg-grey-200",
29953
+ featuredLink: "text-grey-800 hover:bg-grey-800/5",
29954
+ sectionLink: "border-grey-200 bg-white hover:bg-grey-800/5 hover:font-bold hover:text-grey-800"
29955
+ }),
29956
+ "grey-200": createVariantStyles({
29957
+ surface: "bg-grey-200 text-grey-800",
29958
+ border: "border-grey-200",
29959
+ triggerTone: "text-grey-800",
29960
+ triggerActive: "hover:bg-grey-100 hover:text-grey-800 focus:bg-grey-100 focus:text-grey-800 data-[state=open]:bg-grey-100 data-[state=open]:text-grey-800",
29961
+ triggerEdge: "hover:before:bg-grey-100 hover:after:bg-grey-100 focus:before:bg-grey-100 focus:after:bg-grey-100 data-[state=open]:before:bg-grey-100 data-[state=open]:after:bg-grey-100",
29962
+ featuredLink: "text-grey-800 hover:bg-grey-800/5",
29963
+ sectionLink: "border-grey-200 bg-white hover:bg-grey-800/5 hover:font-bold hover:text-grey-800"
29964
+ }),
29965
+ "accent-800": createVariantStyles({
29966
+ surface: "bg-accent-800 text-white",
29967
+ border: "border-accent-600",
29968
+ triggerTone: "text-white",
29969
+ triggerActive: "hover:bg-accent-600 hover:text-white focus:bg-accent-600 focus:text-white data-[state=open]:bg-accent-600 data-[state=open]:text-white",
29970
+ triggerEdge: "hover:before:bg-accent-600 hover:after:bg-accent-600 focus:before:bg-accent-600 focus:after:bg-accent-600 data-[state=open]:before:bg-accent-600 data-[state=open]:after:bg-accent-600",
29971
+ featuredLink: "text-accent-800 hover:bg-accent-800/5",
29972
+ sectionLink: "border-grey-200 bg-white hover:bg-accent-800/5 hover:font-bold hover:text-accent-800"
29973
+ }),
29974
+ "accent-600": createVariantStyles({
29975
+ surface: "bg-accent-600 text-white",
29976
+ border: "border-accent-600",
29977
+ triggerTone: "text-white",
29978
+ triggerActive: "hover:bg-accent-800 hover:text-white focus:bg-accent-800 focus:text-white data-[state=open]:bg-accent-800 data-[state=open]:text-white",
29979
+ triggerEdge: "hover:before:bg-accent-800 hover:after:bg-accent-800 focus:before:bg-accent-800 focus:after:bg-accent-800 data-[state=open]:before:bg-accent-800 data-[state=open]:after:bg-accent-800",
29980
+ featuredLink: "text-accent-800 hover:bg-accent-800/5",
29981
+ sectionLink: "border-grey-200 bg-white hover:bg-accent-800/5 hover:font-bold hover:text-accent-800"
29982
+ }),
29983
+ "accent-400": createVariantStyles({
29984
+ surface: "bg-accent-400 text-accent-800",
29985
+ border: "border-accent-200",
29986
+ triggerTone: "text-accent-800",
29987
+ triggerActive: "hover:bg-accent-200 hover:text-accent-800 focus:bg-accent-200 focus:text-accent-800 data-[state=open]:bg-accent-200 data-[state=open]:text-accent-800",
29988
+ triggerEdge: "hover:before:bg-accent-200 hover:after:bg-accent-200 focus:before:bg-accent-200 focus:after:bg-accent-200 data-[state=open]:before:bg-accent-200 data-[state=open]:after:bg-accent-200",
29989
+ featuredLink: "text-accent-800 hover:bg-accent-800/5",
29990
+ sectionLink: "border-grey-200 bg-white hover:bg-accent-800/5 hover:font-bold hover:text-accent-800"
29991
+ }),
29992
+ "accent-200": createVariantStyles({
29993
+ surface: "bg-accent-200 text-accent-800",
29994
+ border: "border-accent-200",
29995
+ triggerTone: "text-accent-800",
29996
+ triggerActive: "hover:bg-accent-50 hover:text-accent-800 focus:bg-accent-50 focus:text-accent-800 data-[state=open]:bg-accent-50 data-[state=open]:text-accent-800",
29997
+ triggerEdge: "hover:before:bg-accent-50 hover:after:bg-accent-50 focus:before:bg-accent-50 focus:after:bg-accent-50 data-[state=open]:before:bg-accent-50 data-[state=open]:after:bg-accent-50",
29998
+ featuredLink: "text-accent-800 hover:bg-accent-800/5",
29999
+ sectionLink: "border-grey-200 bg-white hover:bg-accent-800/5 hover:font-bold hover:text-accent-800"
30000
+ }),
30001
+ white: createVariantStyles({
30002
+ surface: "bg-white text-grey-800",
30003
+ border: "border-grey-200",
30004
+ triggerTone: "text-grey-800",
30005
+ triggerActive: "hover:bg-grey-100 hover:text-grey-800 focus:bg-grey-100 focus:text-grey-800 data-[state=open]:bg-grey-100 data-[state=open]:text-grey-800",
30006
+ triggerEdge: "hover:before:bg-grey-100 hover:after:bg-grey-100 focus:before:bg-grey-100 focus:after:bg-grey-100 data-[state=open]:before:bg-grey-100 data-[state=open]:after:bg-grey-100",
30007
+ featuredLink: "text-grey-800 hover:bg-grey-100",
30008
+ sectionLink: "border-grey-200 bg-white hover:bg-grey-50 hover:font-bold hover:text-grey-800"
30009
+ })
30010
+ };
29920
30011
  var PANEL_CLOSE_DELAY_MS = 220;
29921
30012
  function TopLevelItem({
29922
30013
  href = "#",
@@ -29927,18 +30018,19 @@ function TopLevelItem({
29927
30018
  triggerActiveClassName,
29928
30019
  triggerActiveBorderClassName
29929
30020
  }) {
30021
+ const styles5 = navigationMenuMainNavigationVariantStyles[variant];
29930
30022
  return /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuItem, { className: "shrink-0", children: /* @__PURE__ */ jsxRuntime.jsx(
29931
30023
  NavigationMenuLink,
29932
30024
  {
29933
30025
  asChild: true,
29934
30026
  className: cn(
29935
30027
  "relative inline-flex h-auto min-h-14 w-auto flex-row items-center justify-start gap-x-1 rounded-none bg-transparent p-4 text-base leading-6 font-bold transition lg:px-8",
29936
- navigationMenuMainNavigationTriggerToneStyles({ variant }),
29937
- navigationMenuMainNavigationTriggerActiveStyles({ variant }),
30028
+ styles5.triggerTone,
30029
+ styles5.triggerActive,
29938
30030
  triggerClassName,
29939
30031
  triggerActiveClassName,
29940
30032
  syncBorderToSurface && "before:absolute before:inset-x-0 before:top-0 before:h-px before:bg-transparent after:absolute after:inset-x-0 after:bottom-0 after:h-px after:bg-transparent",
29941
- syncBorderToSurface && navigationMenuMainNavigationTriggerEdgeStyles({ variant }),
30033
+ syncBorderToSurface && styles5.triggerEdge,
29942
30034
  syncBorderToSurface && triggerActiveBorderClassName
29943
30035
  ),
29944
30036
  children: /* @__PURE__ */ jsxRuntime.jsx(Link14__default.default, { href, children: title })
@@ -29951,11 +30043,16 @@ function FeaturedSectionLink({
29951
30043
  variant,
29952
30044
  className
29953
30045
  }) {
30046
+ const styles5 = navigationMenuMainNavigationVariantStyles[variant];
29954
30047
  return /* @__PURE__ */ jsxRuntime.jsxs(
29955
30048
  Link14__default.default,
29956
30049
  {
29957
30050
  href,
29958
- className: cn(navigationMenuMainNavigationFeaturedLinkStyles({ variant }), className),
30051
+ className: cn(
30052
+ "group relative flex items-center px-8 py-8 text-xl font-bold whitespace-normal",
30053
+ styles5.featuredLink,
30054
+ className
30055
+ ),
29959
30056
  children: [
29960
30057
  /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", className: "absolute inset-0" }),
29961
30058
  title,
@@ -29970,23 +30067,19 @@ function SectionLink({
29970
30067
  className,
29971
30068
  titleClassName
29972
30069
  }) {
30070
+ const styles5 = navigationMenuMainNavigationVariantStyles[variant];
29973
30071
  return /* @__PURE__ */ jsxRuntime.jsx(
29974
30072
  NavigationMenuLink,
29975
30073
  {
29976
30074
  asChild: true,
29977
- className: cn(navigationMenuMainNavigationSectionLinkStyles({ variant }), className),
30075
+ className: cn(
30076
+ "relative mx-2 rounded-none border-t p-4 whitespace-normal focus-within:rounded-sm focus-within:outline focus-within:outline-inherit [&:nth-last-child(-n+3)]:border-b",
30077
+ styles5.sectionLink,
30078
+ className
30079
+ ),
29978
30080
  children: /* @__PURE__ */ jsxRuntime.jsxs(Link14__default.default, { href: link.href, className: "outline-none", children: [
29979
30081
  /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", className: "absolute inset-0" }),
29980
- /* @__PURE__ */ jsxRuntime.jsx(
29981
- "span",
29982
- {
29983
- className: cn(
29984
- navigationMenuMainNavigationSectionLinkTitleStyles({ variant }),
29985
- titleClassName
29986
- ),
29987
- children: link.title
29988
- }
29989
- )
30082
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("text-base font-semibold", styles5.sectionLinkTitle, titleClassName), children: link.title })
29990
30083
  ] })
29991
30084
  }
29992
30085
  );
@@ -30006,6 +30099,7 @@ function MegaNavigationItem({
30006
30099
  sectionLinkClassName,
30007
30100
  sectionLinkTitleClassName
30008
30101
  }) {
30102
+ const styles5 = navigationMenuMainNavigationVariantStyles[variant];
30009
30103
  if (!section.links?.length) {
30010
30104
  return /* @__PURE__ */ jsxRuntime.jsx(
30011
30105
  TopLevelItem,
@@ -30026,13 +30120,13 @@ function MegaNavigationItem({
30026
30120
  {
30027
30121
  className: cn(
30028
30122
  "relative mb-0 h-auto min-h-14 w-auto justify-start rounded-none bg-transparent p-4 text-base leading-6 font-bold lg:px-8 [&_svg]:h-6 [&_svg]:w-6",
30029
- navigationMenuMainNavigationTriggerToneStyles({ variant }),
30030
- navigationMenuMainNavigationTriggerActiveStyles({ variant }),
30123
+ styles5.triggerTone,
30124
+ styles5.triggerActive,
30031
30125
  triggerClassName,
30032
30126
  triggerActiveClassName,
30033
- "data-[state=open]:shadow-[inset_0_-2px_0_0_currentColor]",
30127
+ "data-[state=open]:shadow-[inset_0_-4px_0_0_currentColor]",
30034
30128
  syncBorderToSurface && "before:absolute before:inset-x-0 before:top-0 before:h-px before:bg-transparent after:absolute after:inset-x-0 after:bottom-0 after:h-px after:bg-transparent",
30035
- syncBorderToSurface && navigationMenuMainNavigationTriggerEdgeStyles({ variant }),
30129
+ syncBorderToSurface && styles5.triggerEdge,
30036
30130
  syncBorderToSurface && triggerActiveBorderClassName
30037
30131
  ),
30038
30132
  onPointerEnter: onOpenIntent,
@@ -30043,54 +30137,45 @@ function MegaNavigationItem({
30043
30137
  NavigationMenuContent,
30044
30138
  {
30045
30139
  className: cn(
30046
- "left-0 w-full p-0 pr-0 whitespace-normal group-data-[viewport=false]/navigation-menu:mt-0 group-data-[viewport=false]/navigation-menu:rounded-none group-data-[viewport=false]/navigation-menu:border-0 group-data-[viewport=false]/navigation-menu:bg-transparent group-data-[viewport=false]/navigation-menu:shadow-none md:w-full"
30140
+ "left-0 w-full p-0 pr-0 whitespace-normal group-data-[viewport=false]/navigation-menu:mt-0 group-data-[viewport=false]/navigation-menu:rounded-none group-data-[viewport=false]/navigation-menu:border-0 group-data-[viewport=false]/navigation-menu:bg-transparent group-data-[viewport=false]/navigation-menu:shadow-none data-[motion=from-end]:[--tw-enter-translate-x:0] data-[motion=from-start]:[--tw-enter-translate-x:0] data-[motion=to-end]:[--tw-exit-translate-x:0] data-[motion=to-start]:[--tw-exit-translate-x:0] data-[motion^=from-]:!animate-none data-[motion^=from-]:[--tw-enter-opacity:1] data-[motion^=from-]:[--tw-enter-rotate:0] data-[motion^=from-]:[--tw-enter-scale:1] data-[motion^=from-]:[--tw-enter-translate-y:0] data-[motion^=to-]:!animate-none data-[motion^=to-]:[--tw-exit-opacity:1] data-[motion^=to-]:[--tw-exit-rotate:0] data-[motion^=to-]:[--tw-exit-scale:1] data-[motion^=to-]:[--tw-exit-translate-y:0] group-data-[viewport=false]/navigation-menu:data-[state=closed]:!animate-none group-data-[viewport=false]/navigation-menu:data-[state=closed]:[--tw-exit-opacity:1] group-data-[viewport=false]/navigation-menu:data-[state=closed]:[--tw-exit-scale:1] group-data-[viewport=false]/navigation-menu:data-[state=open]:!animate-none group-data-[viewport=false]/navigation-menu:data-[state=open]:[--tw-enter-opacity:1] group-data-[viewport=false]/navigation-menu:data-[state=open]:[--tw-enter-scale:1] md:w-full"
30047
30141
  ),
30048
30142
  style: fullBleed && panelMetrics ? {
30049
30143
  left: `${-panelMetrics.left}px`,
30050
30144
  width: `${panelMetrics.viewportWidth}px`
30051
30145
  } : void 0,
30052
30146
  onPointerEnter: onOpenIntent,
30053
- children: /* @__PURE__ */ jsxRuntime.jsx(
30147
+ children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("w-full shadow", styles5.dropdownSurface, dropdownBackgroundClassName), children: /* @__PURE__ */ jsxRuntime.jsxs(
30054
30148
  "div",
30055
30149
  {
30056
- className: cn(
30057
- navigationMenuMainNavigationDropdownSurfaceStyles({ variant }),
30058
- dropdownBackgroundClassName
30059
- ),
30060
- children: /* @__PURE__ */ jsxRuntime.jsxs(
30061
- "div",
30062
- {
30063
- className: "grid w-full",
30064
- style: fullBleed && panelMetrics ? {
30065
- width: `${panelMetrics.width}px`,
30066
- marginLeft: "auto",
30067
- marginRight: "auto"
30068
- } : void 0,
30069
- children: [
30070
- /* @__PURE__ */ jsxRuntime.jsx(
30071
- FeaturedSectionLink,
30072
- {
30073
- href: section.href,
30074
- title: section.title,
30075
- variant,
30076
- className: featuredLinkClassName
30077
- }
30078
- ),
30079
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-1 overflow-hidden px-4 pb-12 sm:grid-cols-2 lg:grid-cols-3", children: section.links.map((link, index) => /* @__PURE__ */ jsxRuntime.jsx(
30080
- SectionLink,
30081
- {
30082
- link,
30083
- variant,
30084
- className: sectionLinkClassName,
30085
- titleClassName: sectionLinkTitleClassName
30086
- },
30087
- `${link.title}-${link.href}-${index}`
30088
- )) })
30089
- ]
30090
- }
30091
- )
30150
+ className: "grid w-full",
30151
+ style: fullBleed && panelMetrics ? {
30152
+ width: `${panelMetrics.width}px`,
30153
+ marginLeft: "auto",
30154
+ marginRight: "auto"
30155
+ } : void 0,
30156
+ children: [
30157
+ /* @__PURE__ */ jsxRuntime.jsx(
30158
+ FeaturedSectionLink,
30159
+ {
30160
+ href: section.href,
30161
+ title: section.title,
30162
+ variant,
30163
+ className: featuredLinkClassName
30164
+ }
30165
+ ),
30166
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-1 overflow-hidden px-4 pb-12 sm:grid-cols-2 lg:grid-cols-3", children: section.links.map((link, index) => /* @__PURE__ */ jsxRuntime.jsx(
30167
+ SectionLink,
30168
+ {
30169
+ link,
30170
+ variant,
30171
+ className: sectionLinkClassName,
30172
+ titleClassName: sectionLinkTitleClassName
30173
+ },
30174
+ `${link.title}-${link.href}-${index}`
30175
+ )) })
30176
+ ]
30092
30177
  }
30093
- )
30178
+ ) })
30094
30179
  }
30095
30180
  )
30096
30181
  ] });
@@ -30098,12 +30183,12 @@ function MegaNavigationItem({
30098
30183
  function NavigationMenuMainNavigation({
30099
30184
  navigation,
30100
30185
  id: id3 = "nsw-main-navigation",
30101
- variant = "grey",
30186
+ variant = "white",
30102
30187
  borderPosition = "none",
30103
30188
  className,
30104
30189
  responsive = true,
30105
30190
  sticky = true,
30106
- fullBleed = false,
30191
+ fullBleed = true,
30107
30192
  backgroundClassName,
30108
30193
  dropdownBackgroundClassName,
30109
30194
  borderClassName,
@@ -30193,9 +30278,9 @@ function NavigationMenuMainNavigation({
30193
30278
  id: id3,
30194
30279
  className: cn(
30195
30280
  "z-40 shadow-md shadow-grey-900/5 dark:shadow-none",
30196
- navigationMenuMainNavigationSurfaceStyles({ variant }),
30281
+ navigationMenuMainNavigationVariantStyles[variant].surface,
30197
30282
  backgroundClassName,
30198
- hasBorder && navigationMenuMainNavigationBorderStyles({ variant }),
30283
+ hasBorder && navigationMenuMainNavigationVariantStyles[variant].border,
30199
30284
  hasBorder && borderClassName,
30200
30285
  hasTopBorder && "border-t",
30201
30286
  hasBottomBorder && "border-b",