@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.js CHANGED
@@ -18185,25 +18185,101 @@ function DynamicFavicon({ lightModeFavicon, darkModeFavicon }) {
18185
18185
  }, [lightModeFavicon, darkModeFavicon]);
18186
18186
  return null;
18187
18187
  }
18188
+ var expandableSearchSurfaceVariants = cva("", {
18189
+ variants: {
18190
+ variant: {
18191
+ default: "bg-grey-100 text-grey-800",
18192
+ "primary-800": "bg-primary-800 text-white",
18193
+ "primary-600": "bg-primary-600 text-white",
18194
+ "primary-400": "bg-primary-400 text-primary-800",
18195
+ "primary-200": "bg-primary-200 text-primary-800",
18196
+ "grey-800": "bg-grey-800 text-white",
18197
+ "grey-600": "bg-grey-600 text-white",
18198
+ "grey-400": "bg-grey-400 text-grey-800",
18199
+ "grey-200": "bg-grey-200 text-grey-800",
18200
+ "accent-800": "bg-accent-800 text-white",
18201
+ "accent-600": "bg-accent-600 text-white",
18202
+ "accent-400": "bg-accent-400 text-accent-800",
18203
+ "accent-200": "bg-accent-200 text-accent-800",
18204
+ white: "bg-white text-grey-800"
18205
+ }
18206
+ },
18207
+ defaultVariants: {
18208
+ variant: "default"
18209
+ }
18210
+ });
18211
+ var expandableSearchCollapsedVariants = cva("", {
18212
+ variants: {
18213
+ variant: {
18214
+ default: "bg-grey-100 hover:bg-primary-800/10",
18215
+ "primary-800": "bg-primary-800",
18216
+ "primary-600": "bg-primary-600",
18217
+ "primary-400": "bg-primary-400",
18218
+ "primary-200": "bg-primary-200",
18219
+ "grey-800": "bg-grey-800",
18220
+ "grey-600": "bg-grey-600",
18221
+ "grey-400": "bg-grey-400",
18222
+ "grey-200": "bg-grey-200",
18223
+ "accent-800": "bg-accent-800",
18224
+ "accent-600": "bg-accent-600",
18225
+ "accent-400": "bg-accent-400",
18226
+ "accent-200": "bg-accent-200",
18227
+ white: "bg-white"
18228
+ }
18229
+ },
18230
+ defaultVariants: {
18231
+ variant: "default"
18232
+ }
18233
+ });
18234
+ var expandableSearchButtonVariants = cva("", {
18235
+ variants: {
18236
+ variant: {
18237
+ default: "text-primary group-focus-within:bg-primary-800/10 hover:bg-primary-800/10",
18238
+ "primary-800": "text-white group-focus-within:bg-white/10 hover:bg-white/10",
18239
+ "primary-600": "text-white group-focus-within:bg-white/10 hover:bg-white/10",
18240
+ "primary-400": "text-primary-800 group-focus-within:bg-black/5 hover:bg-black/5",
18241
+ "primary-200": "text-primary-800 group-focus-within:bg-black/5 hover:bg-black/5",
18242
+ "grey-800": "text-white group-focus-within:bg-white/10 hover:bg-white/10",
18243
+ "grey-600": "text-white group-focus-within:bg-white/10 hover:bg-white/10",
18244
+ "grey-400": "text-grey-800 group-focus-within:bg-black/5 hover:bg-black/5",
18245
+ "grey-200": "text-grey-800 group-focus-within:bg-black/5 hover:bg-black/5",
18246
+ "accent-800": "text-white group-focus-within:bg-white/10 hover:bg-white/10",
18247
+ "accent-600": "text-white group-focus-within:bg-white/10 hover:bg-white/10",
18248
+ "accent-400": "text-accent-800 group-focus-within:bg-black/5 hover:bg-black/5",
18249
+ "accent-200": "text-accent-800 group-focus-within:bg-black/5 hover:bg-black/5",
18250
+ white: "text-grey-800 group-focus-within:bg-grey-100 hover:bg-grey-100"
18251
+ }
18252
+ },
18253
+ defaultVariants: {
18254
+ variant: "default"
18255
+ }
18256
+ });
18188
18257
  var ExpandableSearchContext = React5.createContext(null);
18189
- var ExpandableSearch = React5.forwardRef(({ className, onAction, defaultValue = "", ...props }, ref) => {
18258
+ var ExpandableSearch = React5.forwardRef(({ className, onAction, defaultValue = "", variant = "default", ...props }, ref) => {
18190
18259
  const [value, setValue] = React5.useState(defaultValue);
18191
18260
  const formRef = React5.useRef(null);
18261
+ const resolvedVariant = variant ?? "default";
18192
18262
  const handleAction = (e) => {
18193
18263
  e.preventDefault();
18194
18264
  if (onAction) {
18195
18265
  onAction(value);
18196
18266
  }
18197
18267
  };
18198
- return /* @__PURE__ */ jsx(ExpandableSearchContext.Provider, { value: { value, setValue, formRef }, children: /* @__PURE__ */ jsx(
18199
- "form",
18268
+ return /* @__PURE__ */ jsx(
18269
+ ExpandableSearchContext.Provider,
18200
18270
  {
18201
- ref,
18202
- className: cn("relative inline-block select-none", className),
18203
- onSubmit: handleAction,
18204
- ...props
18271
+ value: { value, setValue, formRef, variant: resolvedVariant },
18272
+ children: /* @__PURE__ */ jsx(
18273
+ "form",
18274
+ {
18275
+ ref,
18276
+ className: cn("relative inline-block select-none", className),
18277
+ onSubmit: handleAction,
18278
+ ...props
18279
+ }
18280
+ )
18205
18281
  }
18206
- ) });
18282
+ );
18207
18283
  });
18208
18284
  ExpandableSearch.displayName = "ExpandableSearch";
18209
18285
  var ExpandableSearchField = React5.forwardRef(({ className, ...props }, ref) => {
@@ -18211,6 +18287,7 @@ var ExpandableSearchField = React5.forwardRef(({ className, ...props }, ref) =>
18211
18287
  if (!context) throw new Error("ExpandableSearchField must be used within ExpandableSearch");
18212
18288
  const [isFocused, setIsFocused] = React5.useState(false);
18213
18289
  const isActive = context.value.length > 0 || isFocused;
18290
+ const variant = context.variant;
18214
18291
  return /* @__PURE__ */ jsxs("div", { className: "relative flex-1", children: [
18215
18292
  /* @__PURE__ */ jsx("label", { className: "sr-only", htmlFor: "expandable-search", children: "Search" }),
18216
18293
  /* @__PURE__ */ jsx(
@@ -18222,17 +18299,19 @@ var ExpandableSearchField = React5.forwardRef(({ className, ...props }, ref) =>
18222
18299
  onFocus: () => setIsFocused(true),
18223
18300
  onBlur: () => setIsFocused(false),
18224
18301
  className: cn(
18225
- "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",
18302
+ "peer align-center flex h-12 w-12 cursor-pointer overflow-hidden rounded-sm border-0 text-transparent",
18226
18303
  "ring-offset-white focus-visible:ring-2 focus-visible:ring-primary-650/70 focus-visible:ring-offset-2 focus-visible:outline-none",
18227
18304
  "transition-[width,box-shadow,background-color] duration-300 ease-in-out",
18228
18305
  "placeholder:text-transparent placeholder:opacity-0",
18229
18306
  "expandable-search__input",
18307
+ expandableSearchCollapsedVariants({ variant }),
18230
18308
  // Conditionally apply classes based on active state
18231
18309
  {
18232
18310
  "p-0": !isActive,
18233
- "w-96 cursor-auto bg-grey-100 pt-0 pr-12 pb-0 pl-4 text-grey-800 outline-none select-auto": isActive,
18234
- "placeholder:text-grey-700 placeholder:opacity-100": isActive
18311
+ "w-96 cursor-auto pt-0 pr-12 pb-0 pl-4 outline-none select-auto": isActive
18235
18312
  },
18313
+ isActive && expandableSearchSurfaceVariants({ variant }),
18314
+ isActive && (variant === "default" ? "placeholder:text-grey-700 placeholder:opacity-100" : "placeholder:text-current placeholder:opacity-70"),
18236
18315
  className
18237
18316
  ),
18238
18317
  ...props
@@ -18242,8 +18321,11 @@ var ExpandableSearchField = React5.forwardRef(({ className, ...props }, ref) =>
18242
18321
  "button",
18243
18322
  {
18244
18323
  type: "button",
18245
- 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",
18246
- children: /* @__PURE__ */ jsx(Icons.search, { className: "m-auto block h-8 w-8 shrink-0 fill-primary leading-none" })
18324
+ className: cn(
18325
+ "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",
18326
+ expandableSearchButtonVariants({ variant })
18327
+ ),
18328
+ children: /* @__PURE__ */ jsx(Icons.search, { className: "m-auto block h-8 w-8 shrink-0 fill-current leading-none" })
18247
18329
  }
18248
18330
  )
18249
18331
  ] });
@@ -18348,101 +18430,106 @@ function ErrorMessage({
18348
18430
  }
18349
18431
  );
18350
18432
  }
18351
- var footerVariants = cva(
18352
- "bg-(--footer-bg) text-(--footer-text) [--footer-social-hover:var(--footer-social)]",
18353
- {
18354
- variants: {
18355
- color: {
18356
- "primary/grey": [
18357
- "[--footer-bg:var(--color-primary-800)] [--footer-text:var(--color-white)] [--footer-muted:var(--color-primary-100)]",
18358
- "dark:[--footer-bg:var(--color-grey-800)] dark:[--footer-text:var(--color-white)] dark:[--footer-muted:var(--color-grey-100)]",
18359
- "[--footer-border:var(--color-white)]/15",
18360
- "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18361
- "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18362
- ],
18363
- light: [
18364
- "[--footer-bg:var(--color-grey-200)] [--footer-text:var(--color-grey-800)] [--footer-muted:var(--color-grey-700)]",
18365
- "dark:[--footer-bg:var(--color-grey-800)] dark:[--footer-text:var(--color-white)] dark:[--footer-muted:var(--color-grey-100)]",
18366
- "[--footer-border:var(--color-grey-300)] dark:[--footer-border:var(--color-white)]/15",
18367
- "[--footer-link:var(--color-grey-700)] [--footer-link-hover-bg:var(--color-grey-800)]/10 [--footer-link-hover-text:var(--color-grey-900)]",
18368
- "dark:[--footer-link:var(--color-white)] dark:[--footer-link-hover-bg:var(--color-white)]/10 dark:[--footer-link-hover-text:var(--color-white)]",
18369
- "[--footer-social:var(--color-grey-800)] [--footer-social-hover:var(--color-grey-900)] [--footer-social-hover-bg:var(--color-grey-800)]/10",
18370
- "dark:[--footer-social:var(--color-white)] dark:[--footer-social-hover:var(--color-white)] dark:[--footer-social-hover-bg:var(--color-white)]/10"
18371
- ],
18372
- "primary/white": [
18373
- "[--footer-bg:var(--color-primary-800)] [--footer-text:var(--color-white)] [--footer-muted:var(--color-primary-100)]",
18374
- "dark:[--footer-bg:var(--color-primary-800)] dark:[--footer-text:var(--color-white)] dark:[--footer-muted:var(--color-primary-100)]",
18375
- "[--footer-border:var(--color-white)]/15",
18376
- "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18377
- "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18378
- ],
18379
- white: [
18380
- "[--footer-bg:var(--color-white)] [--footer-text:var(--color-grey-800)] [--footer-muted:var(--color-grey-600)]",
18381
- "dark:[--footer-bg:var(--color-grey-800)] dark:[--footer-text:var(--color-white)] dark:[--footer-muted:var(--color-grey-100)]",
18382
- "[--footer-border:var(--color-grey-200)] dark:[--footer-border:var(--color-white)]/15",
18383
- "[--footer-link:var(--color-grey-600)] [--footer-link-hover-bg:var(--color-primary-800)]/10 [--footer-link-hover-text:var(--color-grey-800)]",
18384
- "dark:[--footer-link:var(--color-white)] dark:[--footer-link-hover-bg:var(--color-white)]/10 dark:[--footer-link-hover-text:var(--color-white)]",
18385
- "[--footer-social:var(--color-grey-700)] [--footer-social-hover:var(--color-grey-900)] [--footer-social-hover-bg:var(--color-primary-800)]/10",
18386
- "dark:[--footer-social:var(--color-white)] dark:[--footer-social-hover:var(--color-white)] dark:[--footer-social-hover-bg:var(--color-white)]/10"
18387
- ],
18388
- "grey-600": [
18389
- "[--footer-bg:var(--color-grey-600)] [--footer-text:var(--color-white)] [--footer-muted:var(--color-grey-100)]",
18390
- "[--footer-border:var(--color-white)]/15",
18391
- "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18392
- "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18393
- ],
18394
- "grey-800": [
18395
- "[--footer-bg:var(--color-grey-800)] [--footer-text:var(--color-white)] [--footer-muted:var(--color-grey-100)]",
18396
- "[--footer-border:var(--color-white)]/15",
18397
- "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18398
- "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18399
- ],
18400
- "accent-200": [
18401
- "[--footer-bg:var(--color-accent-200)] [--footer-text:var(--color-accent-800)] [--footer-muted:var(--color-accent-700)]",
18402
- "dark:[--footer-bg:var(--color-accent-800)] dark:[--footer-text:var(--color-white)] dark:[--footer-muted:var(--color-accent-100)]",
18403
- "[--footer-border:var(--color-accent-800)]/15 dark:[--footer-border:var(--color-white)]/15",
18404
- "[--footer-link:var(--color-accent-800)] [--footer-link-hover-bg:var(--color-accent-800)]/10 [--footer-link-hover-text:var(--color-accent-800)]",
18405
- "dark:[--footer-link:var(--color-white)] dark:[--footer-link-hover-bg:var(--color-white)]/10 dark:[--footer-link-hover-text:var(--color-white)]",
18406
- "[--footer-social:var(--color-accent-800)] [--footer-social-hover-bg:var(--color-accent-800)]/10",
18407
- "dark:[--footer-social:var(--color-white)] dark:[--footer-social-hover-bg:var(--color-white)]/10"
18408
- ],
18409
- primary: [
18410
- "[--footer-bg:var(--color-primary-800)] [--footer-text:var(--color-white)] [--footer-muted:var(--color-primary-100)]",
18411
- "dark:[--footer-bg:var(--color-primary-800)] dark:[--footer-text:var(--color-white)] dark:[--footer-muted:var(--color-primary-100)]",
18412
- "[--footer-border:var(--color-white)]/15",
18413
- "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18414
- "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18415
- ],
18416
- secondary: [
18417
- "[--footer-bg:var(--color-primary-200)] [--footer-text:var(--color-primary-800)] [--footer-muted:var(--color-primary-700)]",
18418
- "dark:[--footer-bg:var(--color-primary-900)] dark:[--footer-text:var(--color-white)] dark:[--footer-muted:var(--color-primary-100)]",
18419
- "[--footer-border:var(--color-primary-800)]/15 dark:[--footer-border:var(--color-white)]/15",
18420
- "[--footer-link:var(--color-primary-800)] [--footer-link-hover-bg:var(--color-primary-800)]/10 [--footer-link-hover-text:var(--color-primary-800)]",
18421
- "dark:[--footer-link:var(--color-white)] dark:[--footer-link-hover-bg:var(--color-white)]/10 dark:[--footer-link-hover-text:var(--color-white)]",
18422
- "[--footer-social:var(--color-primary-800)] [--footer-social-hover-bg:var(--color-primary-800)]/10",
18423
- "dark:[--footer-social:var(--color-white)] dark:[--footer-social-hover-bg:var(--color-white)]/10"
18424
- ],
18425
- accent: [
18426
- "[--footer-bg:var(--color-accent-800)] [--footer-text:var(--color-white)] [--footer-muted:var(--color-accent-100)]",
18427
- "dark:[--footer-bg:var(--color-accent-800)] dark:[--footer-text:var(--color-white)] dark:[--footer-muted:var(--color-accent-100)]",
18428
- "[--footer-border:var(--color-white)]/15",
18429
- "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18430
- "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18431
- ],
18432
- danger: [
18433
- "[--footer-bg:var(--color-danger-600)] [--footer-text:var(--color-white)] [--footer-muted:var(--color-danger-100)]",
18434
- "dark:[--footer-bg:var(--color-danger-600)] dark:[--footer-text:var(--color-white)] dark:[--footer-muted:var(--color-danger-100)]",
18435
- "[--footer-border:var(--color-white)]/15",
18436
- "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18437
- "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18438
- ]
18439
- }
18440
- },
18441
- defaultVariants: {
18442
- color: "white"
18433
+ var footerVariants = cva("[--footer-social-hover:var(--footer-social)]", {
18434
+ variants: {
18435
+ color: {
18436
+ "primary-800": [
18437
+ "bg-primary-800 text-white",
18438
+ "[--footer-text:var(--color-white)]",
18439
+ "[--footer-border:var(--color-white)]/15",
18440
+ "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18441
+ "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18442
+ ],
18443
+ "primary-600": [
18444
+ "bg-primary-600 text-white",
18445
+ "[--footer-text:var(--color-white)]",
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
+ "primary-400": [
18451
+ "bg-primary-400 text-primary-800",
18452
+ "[--footer-text:var(--color-primary-800)]",
18453
+ "[--footer-border:var(--color-primary-800)]/15",
18454
+ "[--footer-link:var(--color-primary-800)] [--footer-link-hover-bg:var(--color-primary-800)]/10 [--footer-link-hover-text:var(--color-primary-800)]",
18455
+ "[--footer-social:var(--color-primary-800)] [--footer-social-hover-bg:var(--color-primary-800)]/10"
18456
+ ],
18457
+ "primary-200": [
18458
+ "bg-primary-200 text-primary-800",
18459
+ "[--footer-text:var(--color-primary-800)]",
18460
+ "[--footer-border:var(--color-primary-800)]/15",
18461
+ "[--footer-link:var(--color-primary-800)] [--footer-link-hover-bg:var(--color-primary-800)]/10 [--footer-link-hover-text:var(--color-primary-800)]",
18462
+ "[--footer-social:var(--color-primary-800)] [--footer-social-hover-bg:var(--color-primary-800)]/10"
18463
+ ],
18464
+ "grey-800": [
18465
+ "bg-grey-800 text-white",
18466
+ "[--footer-text:var(--color-white)]",
18467
+ "[--footer-border:var(--color-white)]/15",
18468
+ "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18469
+ "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18470
+ ],
18471
+ "grey-600": [
18472
+ "bg-grey-600 text-white",
18473
+ "[--footer-text:var(--color-white)]",
18474
+ "[--footer-border:var(--color-white)]/15",
18475
+ "[--footer-link:var(--color-white)] [--footer-link-hover-bg:var(--color-white)]/10 [--footer-link-hover-text:var(--color-white)]",
18476
+ "[--footer-social:var(--color-white)] [--footer-social-hover-bg:var(--color-white)]/10"
18477
+ ],
18478
+ "grey-400": [
18479
+ "bg-grey-400 text-grey-800",
18480
+ "[--footer-text:var(--color-grey-800)]",
18481
+ "[--footer-border:var(--color-grey-800)]/15",
18482
+ "[--footer-link:var(--color-grey-800)] [--footer-link-hover-bg:var(--color-grey-800)]/10 [--footer-link-hover-text:var(--color-grey-800)]",
18483
+ "[--footer-social:var(--color-grey-800)] [--footer-social-hover-bg:var(--color-grey-800)]/10"
18484
+ ],
18485
+ "grey-200": [
18486
+ "bg-grey-200 text-grey-800",
18487
+ "[--footer-text:var(--color-grey-800)]",
18488
+ "[--footer-border:var(--color-grey-800)]/15",
18489
+ "[--footer-link:var(--color-grey-800)] [--footer-link-hover-bg:var(--color-grey-800)]/10 [--footer-link-hover-text:var(--color-grey-800)]",
18490
+ "[--footer-social:var(--color-grey-800)] [--footer-social-hover-bg:var(--color-grey-800)]/10"
18491
+ ],
18492
+ "accent-800": [
18493
+ "bg-accent-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
+ "accent-600": [
18500
+ "bg-accent-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
+ "accent-400": [
18507
+ "bg-accent-400 text-accent-800",
18508
+ "[--footer-text:var(--color-accent-800)]",
18509
+ "[--footer-border:var(--color-accent-800)]/15",
18510
+ "[--footer-link:var(--color-accent-800)] [--footer-link-hover-bg:var(--color-accent-800)]/10 [--footer-link-hover-text:var(--color-accent-800)]",
18511
+ "[--footer-social:var(--color-accent-800)] [--footer-social-hover-bg:var(--color-accent-800)]/10"
18512
+ ],
18513
+ "accent-200": [
18514
+ "bg-accent-200 text-accent-800",
18515
+ "[--footer-text:var(--color-accent-800)]",
18516
+ "[--footer-border:var(--color-accent-800)]/15",
18517
+ "[--footer-link:var(--color-accent-800)] [--footer-link-hover-bg:var(--color-accent-800)]/10 [--footer-link-hover-text:var(--color-accent-800)]",
18518
+ "[--footer-social:var(--color-accent-800)] [--footer-social-hover-bg:var(--color-accent-800)]/10"
18519
+ ],
18520
+ white: [
18521
+ "bg-white text-grey-800",
18522
+ "[--footer-text:var(--color-grey-800)]",
18523
+ "[--footer-border:var(--color-grey-200)]",
18524
+ "[--footer-link:var(--color-grey-800)] [--footer-link-hover-bg:var(--color-grey-800)]/10 [--footer-link-hover-text:var(--color-grey-800)]",
18525
+ "[--footer-social:var(--color-grey-800)] [--footer-social-hover-bg:var(--color-grey-800)]/10"
18526
+ ]
18443
18527
  }
18528
+ },
18529
+ defaultVariants: {
18530
+ color: "white"
18444
18531
  }
18445
- );
18532
+ });
18446
18533
  var footerSocialLinkClassName = [
18447
18534
  "group",
18448
18535
  "[--btn-bg:var(--footer-social)]",
@@ -18771,7 +18858,7 @@ function FormatToggle({ format, setFormat }) {
18771
18858
 
18772
18859
  // package.json
18773
18860
  var package_default = {
18774
- version: "1.116.0"};
18861
+ version: "1.117.0"};
18775
18862
  var SluggerContext = React5__default.createContext(null);
18776
18863
  function flattenText(nodes) {
18777
18864
  if (nodes == null || typeof nodes === "boolean") return "";
@@ -19157,7 +19244,6 @@ var heroBannerVariants2 = cva("relative", {
19157
19244
  "grey-600": "bg-grey-600 text-white",
19158
19245
  "grey-400": "bg-grey-400 text-grey-800",
19159
19246
  "grey-200": "bg-grey-200 text-grey-800",
19160
- "grey-150": "bg-grey-200 text-grey-800",
19161
19247
  "accent-800": "bg-accent-800 text-white",
19162
19248
  "accent-600": "bg-accent-600 text-white",
19163
19249
  "accent-400": "bg-accent-400 text-accent-800",
@@ -29726,141 +29812,146 @@ function NavigationMenuIndicator({
29726
29812
  }
29727
29813
  );
29728
29814
  }
29729
- var navigationMenuMainNavigationSurfaceStyles = cva("", {
29730
- variants: {
29731
- variant: {
29732
- primary: "bg-primary-800 dark:bg-primary-900",
29733
- secondary: "bg-[#f5f2ff] dark:bg-[#261447]",
29734
- tertiary: "bg-primary-600 dark:bg-primary-700",
29735
- white: "bg-white dark:bg-grey-950",
29736
- grey: "bg-grey-100 dark:bg-grey-900"
29737
- }
29738
- },
29739
- defaultVariants: {
29740
- variant: "grey"
29741
- }
29742
- });
29743
- var navigationMenuMainNavigationBorderStyles = cva("", {
29744
- variants: {
29745
- variant: {
29746
- primary: "border-primary-700 dark:border-primary-600",
29747
- secondary: "border-[#d9ccff] dark:border-[#4e3a86]",
29748
- tertiary: "border-primary-500 dark:border-primary-600",
29749
- white: "border-grey-200 dark:border-grey-800",
29750
- grey: "border-grey-200 dark:border-grey-800"
29751
- }
29752
- },
29753
- defaultVariants: {
29754
- variant: "grey"
29755
- }
29756
- });
29757
- var navigationMenuMainNavigationTriggerToneStyles = cva("", {
29758
- variants: {
29759
- variant: {
29760
- primary: "text-white dark:text-primary-50",
29761
- secondary: "text-primary-800 dark:text-primary-100",
29762
- tertiary: "text-white dark:text-primary-50",
29763
- white: "text-grey-900 dark:text-white",
29764
- grey: "text-grey-800 dark:text-grey-100"
29765
- }
29766
- },
29767
- defaultVariants: {
29768
- variant: "grey"
29769
- }
29770
- });
29771
- var navigationMenuMainNavigationTriggerActiveStyles = cva("", {
29772
- variants: {
29773
- variant: {
29774
- 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",
29775
- 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",
29776
- 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",
29777
- 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",
29778
- 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"
29779
- }
29780
- },
29781
- defaultVariants: {
29782
- variant: "grey"
29783
- }
29784
- });
29785
- var navigationMenuMainNavigationTriggerEdgeStyles = cva("", {
29786
- variants: {
29787
- variant: {
29788
- 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",
29789
- 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]",
29790
- 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",
29791
- 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",
29792
- 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"
29793
- }
29794
- },
29795
- defaultVariants: {
29796
- variant: "grey"
29797
- }
29798
- });
29799
- var navigationMenuMainNavigationDropdownSurfaceStyles = cva(
29800
- "w-full shadow dark:shadow-black/40",
29801
- {
29802
- variants: {
29803
- variant: {
29804
- primary: "bg-white dark:bg-grey-950",
29805
- secondary: "bg-white dark:bg-grey-900",
29806
- tertiary: "bg-white dark:bg-grey-950",
29807
- white: "bg-white dark:bg-grey-950",
29808
- grey: "bg-white dark:bg-grey-950"
29809
- }
29810
- },
29811
- defaultVariants: {
29812
- variant: "grey"
29813
- }
29814
- }
29815
- );
29816
- var navigationMenuMainNavigationFeaturedLinkStyles = cva(
29817
- "group relative flex items-center px-8 py-8 text-xl font-bold whitespace-normal",
29818
- {
29819
- variants: {
29820
- variant: {
29821
- primary: "text-primary-800 hover:bg-primary-800/8 dark:text-primary-200 dark:hover:bg-primary-900/80",
29822
- secondary: "text-primary-800 hover:bg-[#f5f2ff] dark:text-primary-200 dark:hover:bg-[#32205a]/70",
29823
- tertiary: "text-primary-700 hover:bg-primary-100 dark:text-primary-200 dark:hover:bg-primary-900/70",
29824
- white: "text-primary-800 hover:bg-grey-100 dark:text-primary-200 dark:hover:bg-grey-800/80",
29825
- grey: "text-primary-800 hover:bg-grey-100 dark:text-primary-200 dark:hover:bg-grey-800/80"
29826
- }
29827
- },
29828
- defaultVariants: {
29829
- variant: "grey"
29830
- }
29831
- }
29832
- );
29833
- var navigationMenuMainNavigationSectionLinkStyles = cva(
29834
- "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",
29835
- {
29836
- variants: {
29837
- variant: {
29838
- 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",
29839
- 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",
29840
- 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",
29841
- 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",
29842
- 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"
29843
- }
29844
- },
29845
- defaultVariants: {
29846
- variant: "grey"
29847
- }
29848
- }
29849
- );
29850
- var navigationMenuMainNavigationSectionLinkTitleStyles = cva("text-base font-semibold", {
29851
- variants: {
29852
- variant: {
29853
- primary: "text-grey-900 dark:text-primary-50",
29854
- secondary: "text-grey-900 dark:text-grey-100",
29855
- tertiary: "text-grey-900 dark:text-primary-50",
29856
- white: "text-grey-900 dark:text-white",
29857
- grey: "text-grey-900 dark:text-grey-100"
29858
- }
29859
- },
29860
- defaultVariants: {
29861
- variant: "grey"
29862
- }
29863
- });
29815
+ function createVariantStyles({
29816
+ surface,
29817
+ border,
29818
+ triggerTone,
29819
+ triggerActive,
29820
+ triggerEdge,
29821
+ featuredLink,
29822
+ sectionLink
29823
+ }) {
29824
+ return {
29825
+ surface,
29826
+ border,
29827
+ triggerTone,
29828
+ triggerActive,
29829
+ triggerEdge,
29830
+ dropdownSurface: "bg-white",
29831
+ featuredLink,
29832
+ sectionLink,
29833
+ sectionLinkTitle: "text-grey-900"
29834
+ };
29835
+ }
29836
+ var navigationMenuMainNavigationVariantStyles = {
29837
+ "primary-800": createVariantStyles({
29838
+ surface: "bg-primary-800 text-white",
29839
+ border: "border-primary-700",
29840
+ triggerTone: "text-white",
29841
+ 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",
29842
+ 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",
29843
+ featuredLink: "text-primary-800 hover:bg-primary-800/5",
29844
+ sectionLink: "border-grey-200 bg-white hover:bg-primary-800/5 hover:font-bold hover:text-primary-800"
29845
+ }),
29846
+ "primary-600": createVariantStyles({
29847
+ surface: "bg-primary-600 text-white",
29848
+ border: "border-primary-600",
29849
+ triggerTone: "text-white",
29850
+ 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",
29851
+ 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",
29852
+ featuredLink: "text-primary-800 hover:bg-primary-800/5",
29853
+ sectionLink: "border-grey-200 bg-white hover:bg-primary-800/5 hover:font-bold hover:text-primary-800"
29854
+ }),
29855
+ "primary-400": createVariantStyles({
29856
+ surface: "bg-primary-400 text-primary-800",
29857
+ border: "border-primary-200",
29858
+ triggerTone: "text-primary-800",
29859
+ 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",
29860
+ 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",
29861
+ featuredLink: "text-primary-800 hover:bg-primary-800/5",
29862
+ sectionLink: "border-grey-200 bg-white hover:bg-primary-800/5 hover:font-bold hover:text-primary-800"
29863
+ }),
29864
+ "primary-200": createVariantStyles({
29865
+ surface: "bg-primary-200 text-primary-800",
29866
+ border: "border-primary-200",
29867
+ triggerTone: "text-primary-800",
29868
+ 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",
29869
+ 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",
29870
+ featuredLink: "text-primary-800 hover:bg-primary-800/5",
29871
+ sectionLink: "border-grey-200 bg-white hover:bg-primary-800/5 hover:font-bold hover:text-primary-800"
29872
+ }),
29873
+ "grey-800": createVariantStyles({
29874
+ surface: "bg-grey-800 text-white",
29875
+ border: "border-grey-700",
29876
+ triggerTone: "text-white",
29877
+ 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",
29878
+ 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",
29879
+ featuredLink: "text-grey-800 hover:bg-grey-800/5",
29880
+ sectionLink: "border-grey-200 bg-white hover:bg-grey-800/5 hover:font-bold hover:text-grey-800"
29881
+ }),
29882
+ "grey-600": createVariantStyles({
29883
+ surface: "bg-grey-600 text-white",
29884
+ border: "border-grey-600",
29885
+ triggerTone: "text-white",
29886
+ 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",
29887
+ 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",
29888
+ featuredLink: "text-grey-800 hover:bg-grey-800/5",
29889
+ sectionLink: "border-grey-200 bg-white hover:bg-grey-800/5 hover:font-bold hover:text-grey-800"
29890
+ }),
29891
+ "grey-400": createVariantStyles({
29892
+ surface: "bg-grey-400 text-grey-800",
29893
+ border: "border-grey-300",
29894
+ triggerTone: "text-grey-800",
29895
+ 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",
29896
+ 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",
29897
+ featuredLink: "text-grey-800 hover:bg-grey-800/5",
29898
+ sectionLink: "border-grey-200 bg-white hover:bg-grey-800/5 hover:font-bold hover:text-grey-800"
29899
+ }),
29900
+ "grey-200": createVariantStyles({
29901
+ surface: "bg-grey-200 text-grey-800",
29902
+ border: "border-grey-200",
29903
+ triggerTone: "text-grey-800",
29904
+ 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",
29905
+ 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",
29906
+ featuredLink: "text-grey-800 hover:bg-grey-800/5",
29907
+ sectionLink: "border-grey-200 bg-white hover:bg-grey-800/5 hover:font-bold hover:text-grey-800"
29908
+ }),
29909
+ "accent-800": createVariantStyles({
29910
+ surface: "bg-accent-800 text-white",
29911
+ border: "border-accent-600",
29912
+ triggerTone: "text-white",
29913
+ 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",
29914
+ 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",
29915
+ featuredLink: "text-accent-800 hover:bg-accent-800/5",
29916
+ sectionLink: "border-grey-200 bg-white hover:bg-accent-800/5 hover:font-bold hover:text-accent-800"
29917
+ }),
29918
+ "accent-600": createVariantStyles({
29919
+ surface: "bg-accent-600 text-white",
29920
+ border: "border-accent-600",
29921
+ triggerTone: "text-white",
29922
+ 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",
29923
+ 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",
29924
+ featuredLink: "text-accent-800 hover:bg-accent-800/5",
29925
+ sectionLink: "border-grey-200 bg-white hover:bg-accent-800/5 hover:font-bold hover:text-accent-800"
29926
+ }),
29927
+ "accent-400": createVariantStyles({
29928
+ surface: "bg-accent-400 text-accent-800",
29929
+ border: "border-accent-200",
29930
+ triggerTone: "text-accent-800",
29931
+ 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",
29932
+ 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",
29933
+ featuredLink: "text-accent-800 hover:bg-accent-800/5",
29934
+ sectionLink: "border-grey-200 bg-white hover:bg-accent-800/5 hover:font-bold hover:text-accent-800"
29935
+ }),
29936
+ "accent-200": createVariantStyles({
29937
+ surface: "bg-accent-200 text-accent-800",
29938
+ border: "border-accent-200",
29939
+ triggerTone: "text-accent-800",
29940
+ 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",
29941
+ 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",
29942
+ featuredLink: "text-accent-800 hover:bg-accent-800/5",
29943
+ sectionLink: "border-grey-200 bg-white hover:bg-accent-800/5 hover:font-bold hover:text-accent-800"
29944
+ }),
29945
+ white: createVariantStyles({
29946
+ surface: "bg-white text-grey-800",
29947
+ border: "border-grey-200",
29948
+ triggerTone: "text-grey-800",
29949
+ 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",
29950
+ 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",
29951
+ featuredLink: "text-grey-800 hover:bg-grey-100",
29952
+ sectionLink: "border-grey-200 bg-white hover:bg-grey-50 hover:font-bold hover:text-grey-800"
29953
+ })
29954
+ };
29864
29955
  var PANEL_CLOSE_DELAY_MS = 220;
29865
29956
  function TopLevelItem({
29866
29957
  href = "#",
@@ -29871,18 +29962,19 @@ function TopLevelItem({
29871
29962
  triggerActiveClassName,
29872
29963
  triggerActiveBorderClassName
29873
29964
  }) {
29965
+ const styles5 = navigationMenuMainNavigationVariantStyles[variant];
29874
29966
  return /* @__PURE__ */ jsx(NavigationMenuItem, { className: "shrink-0", children: /* @__PURE__ */ jsx(
29875
29967
  NavigationMenuLink,
29876
29968
  {
29877
29969
  asChild: true,
29878
29970
  className: cn(
29879
29971
  "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",
29880
- navigationMenuMainNavigationTriggerToneStyles({ variant }),
29881
- navigationMenuMainNavigationTriggerActiveStyles({ variant }),
29972
+ styles5.triggerTone,
29973
+ styles5.triggerActive,
29882
29974
  triggerClassName,
29883
29975
  triggerActiveClassName,
29884
29976
  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",
29885
- syncBorderToSurface && navigationMenuMainNavigationTriggerEdgeStyles({ variant }),
29977
+ syncBorderToSurface && styles5.triggerEdge,
29886
29978
  syncBorderToSurface && triggerActiveBorderClassName
29887
29979
  ),
29888
29980
  children: /* @__PURE__ */ jsx(Link14, { href, children: title })
@@ -29895,11 +29987,16 @@ function FeaturedSectionLink({
29895
29987
  variant,
29896
29988
  className
29897
29989
  }) {
29990
+ const styles5 = navigationMenuMainNavigationVariantStyles[variant];
29898
29991
  return /* @__PURE__ */ jsxs(
29899
29992
  Link14,
29900
29993
  {
29901
29994
  href,
29902
- className: cn(navigationMenuMainNavigationFeaturedLinkStyles({ variant }), className),
29995
+ className: cn(
29996
+ "group relative flex items-center px-8 py-8 text-xl font-bold whitespace-normal",
29997
+ styles5.featuredLink,
29998
+ className
29999
+ ),
29903
30000
  children: [
29904
30001
  /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "absolute inset-0" }),
29905
30002
  title,
@@ -29914,23 +30011,19 @@ function SectionLink({
29914
30011
  className,
29915
30012
  titleClassName
29916
30013
  }) {
30014
+ const styles5 = navigationMenuMainNavigationVariantStyles[variant];
29917
30015
  return /* @__PURE__ */ jsx(
29918
30016
  NavigationMenuLink,
29919
30017
  {
29920
30018
  asChild: true,
29921
- className: cn(navigationMenuMainNavigationSectionLinkStyles({ variant }), className),
30019
+ className: cn(
30020
+ "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",
30021
+ styles5.sectionLink,
30022
+ className
30023
+ ),
29922
30024
  children: /* @__PURE__ */ jsxs(Link14, { href: link.href, className: "outline-none", children: [
29923
30025
  /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "absolute inset-0" }),
29924
- /* @__PURE__ */ jsx(
29925
- "span",
29926
- {
29927
- className: cn(
29928
- navigationMenuMainNavigationSectionLinkTitleStyles({ variant }),
29929
- titleClassName
29930
- ),
29931
- children: link.title
29932
- }
29933
- )
30026
+ /* @__PURE__ */ jsx("span", { className: cn("text-base font-semibold", styles5.sectionLinkTitle, titleClassName), children: link.title })
29934
30027
  ] })
29935
30028
  }
29936
30029
  );
@@ -29950,6 +30043,7 @@ function MegaNavigationItem({
29950
30043
  sectionLinkClassName,
29951
30044
  sectionLinkTitleClassName
29952
30045
  }) {
30046
+ const styles5 = navigationMenuMainNavigationVariantStyles[variant];
29953
30047
  if (!section.links?.length) {
29954
30048
  return /* @__PURE__ */ jsx(
29955
30049
  TopLevelItem,
@@ -29970,13 +30064,13 @@ function MegaNavigationItem({
29970
30064
  {
29971
30065
  className: cn(
29972
30066
  "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",
29973
- navigationMenuMainNavigationTriggerToneStyles({ variant }),
29974
- navigationMenuMainNavigationTriggerActiveStyles({ variant }),
30067
+ styles5.triggerTone,
30068
+ styles5.triggerActive,
29975
30069
  triggerClassName,
29976
30070
  triggerActiveClassName,
29977
- "data-[state=open]:shadow-[inset_0_-2px_0_0_currentColor]",
30071
+ "data-[state=open]:shadow-[inset_0_-4px_0_0_currentColor]",
29978
30072
  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",
29979
- syncBorderToSurface && navigationMenuMainNavigationTriggerEdgeStyles({ variant }),
30073
+ syncBorderToSurface && styles5.triggerEdge,
29980
30074
  syncBorderToSurface && triggerActiveBorderClassName
29981
30075
  ),
29982
30076
  onPointerEnter: onOpenIntent,
@@ -29987,54 +30081,45 @@ function MegaNavigationItem({
29987
30081
  NavigationMenuContent,
29988
30082
  {
29989
30083
  className: cn(
29990
- "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"
30084
+ "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"
29991
30085
  ),
29992
30086
  style: fullBleed && panelMetrics ? {
29993
30087
  left: `${-panelMetrics.left}px`,
29994
30088
  width: `${panelMetrics.viewportWidth}px`
29995
30089
  } : void 0,
29996
30090
  onPointerEnter: onOpenIntent,
29997
- children: /* @__PURE__ */ jsx(
30091
+ children: /* @__PURE__ */ jsx("div", { className: cn("w-full shadow", styles5.dropdownSurface, dropdownBackgroundClassName), children: /* @__PURE__ */ jsxs(
29998
30092
  "div",
29999
30093
  {
30000
- className: cn(
30001
- navigationMenuMainNavigationDropdownSurfaceStyles({ variant }),
30002
- dropdownBackgroundClassName
30003
- ),
30004
- children: /* @__PURE__ */ jsxs(
30005
- "div",
30006
- {
30007
- className: "grid w-full",
30008
- style: fullBleed && panelMetrics ? {
30009
- width: `${panelMetrics.width}px`,
30010
- marginLeft: "auto",
30011
- marginRight: "auto"
30012
- } : void 0,
30013
- children: [
30014
- /* @__PURE__ */ jsx(
30015
- FeaturedSectionLink,
30016
- {
30017
- href: section.href,
30018
- title: section.title,
30019
- variant,
30020
- className: featuredLinkClassName
30021
- }
30022
- ),
30023
- /* @__PURE__ */ 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__ */ jsx(
30024
- SectionLink,
30025
- {
30026
- link,
30027
- variant,
30028
- className: sectionLinkClassName,
30029
- titleClassName: sectionLinkTitleClassName
30030
- },
30031
- `${link.title}-${link.href}-${index}`
30032
- )) })
30033
- ]
30034
- }
30035
- )
30094
+ className: "grid w-full",
30095
+ style: fullBleed && panelMetrics ? {
30096
+ width: `${panelMetrics.width}px`,
30097
+ marginLeft: "auto",
30098
+ marginRight: "auto"
30099
+ } : void 0,
30100
+ children: [
30101
+ /* @__PURE__ */ jsx(
30102
+ FeaturedSectionLink,
30103
+ {
30104
+ href: section.href,
30105
+ title: section.title,
30106
+ variant,
30107
+ className: featuredLinkClassName
30108
+ }
30109
+ ),
30110
+ /* @__PURE__ */ 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__ */ jsx(
30111
+ SectionLink,
30112
+ {
30113
+ link,
30114
+ variant,
30115
+ className: sectionLinkClassName,
30116
+ titleClassName: sectionLinkTitleClassName
30117
+ },
30118
+ `${link.title}-${link.href}-${index}`
30119
+ )) })
30120
+ ]
30036
30121
  }
30037
- )
30122
+ ) })
30038
30123
  }
30039
30124
  )
30040
30125
  ] });
@@ -30042,12 +30127,12 @@ function MegaNavigationItem({
30042
30127
  function NavigationMenuMainNavigation({
30043
30128
  navigation,
30044
30129
  id: id3 = "nsw-main-navigation",
30045
- variant = "grey",
30130
+ variant = "white",
30046
30131
  borderPosition = "none",
30047
30132
  className,
30048
30133
  responsive = true,
30049
30134
  sticky = true,
30050
- fullBleed = false,
30135
+ fullBleed = true,
30051
30136
  backgroundClassName,
30052
30137
  dropdownBackgroundClassName,
30053
30138
  borderClassName,
@@ -30137,9 +30222,9 @@ function NavigationMenuMainNavigation({
30137
30222
  id: id3,
30138
30223
  className: cn(
30139
30224
  "z-40 shadow-md shadow-grey-900/5 dark:shadow-none",
30140
- navigationMenuMainNavigationSurfaceStyles({ variant }),
30225
+ navigationMenuMainNavigationVariantStyles[variant].surface,
30141
30226
  backgroundClassName,
30142
- hasBorder && navigationMenuMainNavigationBorderStyles({ variant }),
30227
+ hasBorder && navigationMenuMainNavigationVariantStyles[variant].border,
30143
30228
  hasBorder && borderClassName,
30144
30229
  hasTopBorder && "border-t",
30145
30230
  hasBottomBorder && "border-b",