@almadar/ui 4.57.5 → 5.0.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 (41) hide show
  1. package/dist/avl/index.cjs +270 -69
  2. package/dist/avl/index.js +270 -69
  3. package/dist/components/index.cjs +101 -68
  4. package/dist/components/index.js +101 -68
  5. package/dist/context/index.cjs +199 -0
  6. package/dist/context/index.js +199 -0
  7. package/dist/context/themeTokens.d.ts +1 -1
  8. package/dist/docs/index.cjs +21 -21
  9. package/dist/docs/index.js +21 -21
  10. package/dist/marketing/index.cjs +18 -18
  11. package/dist/marketing/index.js +18 -18
  12. package/dist/providers/index.cjs +101 -68
  13. package/dist/providers/index.js +101 -68
  14. package/dist/runtime/index.cjs +270 -69
  15. package/dist/runtime/index.js +270 -69
  16. package/package.json +2 -2
  17. package/tailwind-preset.cjs +118 -3
  18. package/themes/_contract.md +198 -0
  19. package/themes/almadar-website.css +212 -0
  20. package/themes/almadar.css +210 -0
  21. package/themes/arctic.css +210 -0
  22. package/themes/atelier.css +427 -0
  23. package/themes/copper.css +210 -0
  24. package/themes/ember.css +210 -0
  25. package/themes/forest.css +210 -0
  26. package/themes/gazette.css +411 -0
  27. package/themes/index.css +7 -0
  28. package/themes/kiosk.css +412 -0
  29. package/themes/lavender.css +210 -0
  30. package/themes/midnight.css +210 -0
  31. package/themes/minimalist.css +210 -0
  32. package/themes/neon.css +210 -0
  33. package/themes/ocean.css +210 -0
  34. package/themes/prism.css +406 -0
  35. package/themes/rose.css +210 -0
  36. package/themes/sand.css +210 -0
  37. package/themes/slate.css +210 -0
  38. package/themes/sunset.css +210 -0
  39. package/themes/terminal.css +422 -0
  40. package/themes/trait-wars.css +210 -0
  41. package/themes/wireframe.css +216 -0
@@ -1140,7 +1140,7 @@ var init_Button = __esm({
1140
1140
  };
1141
1141
  iconSizeStyles = {
1142
1142
  sm: "h-3.5 w-3.5",
1143
- md: "h-4 w-4",
1143
+ md: "h-icon-default w-icon-default",
1144
1144
  lg: "h-5 w-5"
1145
1145
  };
1146
1146
  Button = React83__default.forwardRef(
@@ -1193,7 +1193,7 @@ var init_Button = __esm({
1193
1193
  ...props,
1194
1194
  "data-testid": props["data-testid"] ?? (action ? `action-${action}` : void 0),
1195
1195
  children: [
1196
- isLoading ? /* @__PURE__ */ jsx(Loader2, { className: "h-4 w-4 animate-spin" }) : resolvedLeftIcon && /* @__PURE__ */ jsx("span", { className: "flex-shrink-0", children: resolvedLeftIcon }),
1196
+ isLoading ? /* @__PURE__ */ jsx(Loader2, { className: "h-icon-default w-icon-default animate-spin" }) : resolvedLeftIcon && /* @__PURE__ */ jsx("span", { className: "flex-shrink-0", children: resolvedLeftIcon }),
1197
1197
  children || label,
1198
1198
  resolvedRightIcon && !isLoading && /* @__PURE__ */ jsx("span", { className: "flex-shrink-0", children: resolvedRightIcon })
1199
1199
  ]
@@ -1543,7 +1543,7 @@ var init_Modal = __esm({
1543
1543
  // Reset browser-default dialog chrome — we own styling.
1544
1544
  "m-0 p-0 border-0 bg-transparent",
1545
1545
  // Pre-existing dialog frame
1546
- "pointer-events-auto w-full flex flex-col bg-surface border shadow-lg rounded-md",
1546
+ "pointer-events-auto w-full flex flex-col bg-surface border shadow-elevation-dialog rounded-container",
1547
1547
  // Desktop sizing + viewport-aware floor.
1548
1548
  sizeClasses2[size],
1549
1549
  minWidthClasses[size],
@@ -1970,7 +1970,7 @@ var init_Toast = __esm({
1970
1970
  // `min-w-[300px]` only kicks in at `sm:` and above so a phone
1971
1971
  // viewport doesn't get a toast wider than the screen near the
1972
1972
  // edge. `max-w-[calc(100vw-2rem)]` clamps to viewport too.
1973
- "border-l-4 p-4 shadow min-w-0 sm:min-w-[300px] max-w-md max-w-[calc(100vw-2rem)]",
1973
+ "border-l-4 p-4 shadow-elevation-toast min-w-0 sm:min-w-[300px] max-w-md max-w-[calc(100vw-2rem)]",
1974
1974
  "rounded-sm",
1975
1975
  variantClasses[variant],
1976
1976
  className
@@ -2890,7 +2890,7 @@ var init_Input = __esm({
2890
2890
  ...props
2891
2891
  }, ref) => {
2892
2892
  const type = inputType || htmlType || "text";
2893
- const resolvedLeftIcon = leftIcon || IconComponent && /* @__PURE__ */ jsx(IconComponent, { className: "h-4 w-4" });
2893
+ const resolvedLeftIcon = leftIcon || IconComponent && /* @__PURE__ */ jsx(IconComponent, { className: "h-icon-default w-icon-default" });
2894
2894
  const showClearButton = clearable && value && String(value).length > 0;
2895
2895
  const baseClassName = cn(
2896
2896
  "block w-full rounded-sm transition-all duration-[var(--transition-fast)]",
@@ -2922,7 +2922,7 @@ var init_Input = __esm({
2922
2922
  ]
2923
2923
  }
2924
2924
  ),
2925
- /* @__PURE__ */ jsx("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center pointer-events-none text-muted-foreground", children: /* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4" }) })
2925
+ /* @__PURE__ */ jsx("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center pointer-events-none text-muted-foreground", children: /* @__PURE__ */ jsx(ChevronDown, { className: "h-icon-default w-icon-default" }) })
2926
2926
  ] });
2927
2927
  }
2928
2928
  if (type === "textarea") {
@@ -2976,7 +2976,7 @@ var init_Input = __esm({
2976
2976
  type: "button",
2977
2977
  onClick: onClear,
2978
2978
  className: "absolute inset-y-0 right-0 pr-3 flex items-center text-muted-foreground hover:text-foreground",
2979
- children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
2979
+ children: /* @__PURE__ */ jsx(X, { className: "h-icon-default w-icon-default" })
2980
2980
  }
2981
2981
  ),
2982
2982
  rightIcon && !showClearButton && /* @__PURE__ */ jsx("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center text-muted-foreground", children: rightIcon })
@@ -3076,7 +3076,7 @@ var init_Select = __esm({
3076
3076
  ]
3077
3077
  }
3078
3078
  ),
3079
- /* @__PURE__ */ jsx("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center pointer-events-none", children: /* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4 text-foreground" }) })
3079
+ /* @__PURE__ */ jsx("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center pointer-events-none", children: /* @__PURE__ */ jsx(ChevronDown, { className: "h-icon-default w-icon-default text-foreground" }) })
3080
3080
  ] });
3081
3081
  }
3082
3082
  );
@@ -3129,23 +3129,23 @@ var init_Card = __esm({
3129
3129
  default: [
3130
3130
  "bg-card",
3131
3131
  "border-[length:var(--border-width)] border-border",
3132
- "shadow-sm",
3132
+ "shadow-elevation-card",
3133
3133
  "transition-all duration-[var(--transition-normal)]",
3134
- "hover:shadow-lg hover:-translate-y-0.5"
3134
+ "hover:shadow-elevation-dialog hover:-translate-y-0.5"
3135
3135
  ].join(" "),
3136
3136
  bordered: [
3137
3137
  "bg-card",
3138
3138
  "border-[length:var(--border-width)] border-border",
3139
- "shadow-sm",
3139
+ "shadow-elevation-card",
3140
3140
  "transition-all duration-[var(--transition-normal)]",
3141
- "hover:shadow-lg hover:-translate-y-0.5"
3141
+ "hover:shadow-elevation-dialog hover:-translate-y-0.5"
3142
3142
  ].join(" "),
3143
3143
  elevated: [
3144
3144
  "bg-card",
3145
3145
  "border-[length:var(--border-width)] border-border",
3146
3146
  "shadow",
3147
3147
  "transition-all duration-[var(--transition-normal)]",
3148
- "hover:shadow-lg hover:-translate-y-0.5"
3148
+ "hover:shadow-elevation-dialog hover:-translate-y-0.5"
3149
3149
  ].join(" "),
3150
3150
  // Interactive variant with theme-specific hover effects
3151
3151
  interactive: [
@@ -3154,20 +3154,20 @@ var init_Card = __esm({
3154
3154
  "shadow",
3155
3155
  "cursor-pointer",
3156
3156
  "transition-all duration-[var(--transition-normal)]",
3157
- "hover:shadow-lg"
3157
+ "hover:shadow-elevation-dialog"
3158
3158
  ].join(" ")
3159
3159
  };
3160
3160
  paddingStyles2 = {
3161
3161
  none: "",
3162
- sm: "p-3",
3163
- md: "p-4",
3164
- lg: "p-6"
3162
+ sm: "p-card-sm",
3163
+ md: "p-card-md",
3164
+ lg: "p-card-lg"
3165
3165
  };
3166
3166
  shadowStyles2 = {
3167
3167
  none: "shadow-none",
3168
- sm: "shadow-sm",
3168
+ sm: "shadow-elevation-card",
3169
3169
  md: "shadow",
3170
- lg: "shadow-lg"
3170
+ lg: "shadow-elevation-dialog"
3171
3171
  };
3172
3172
  Card = React83__default.forwardRef(
3173
3173
  ({
@@ -3185,7 +3185,7 @@ var init_Card = __esm({
3185
3185
  {
3186
3186
  ref,
3187
3187
  className: cn(
3188
- "rounded-md",
3188
+ "rounded-container",
3189
3189
  "transition-all duration-[var(--transition-normal)]",
3190
3190
  variantStyles4[variant],
3191
3191
  paddingStyles2[padding],
@@ -3314,7 +3314,7 @@ var init_FilterPill = __esm({
3314
3314
  {
3315
3315
  ref,
3316
3316
  className: cn(
3317
- "inline-flex items-center gap-1 font-bold rounded-full",
3317
+ "inline-flex items-center gap-1 font-bold rounded-pill",
3318
3318
  variantStyles5[variant],
3319
3319
  sizeStyles4[size],
3320
3320
  (onClick || clickEvent) && "cursor-pointer",
@@ -3415,8 +3415,8 @@ var init_Avatar = __esm({
3415
3415
  busy: "bg-error"
3416
3416
  };
3417
3417
  badgeSizeClasses = {
3418
- xs: "w-3 h-3 text-[8px]",
3419
- sm: "w-4 h-4 text-[10px]",
3418
+ xs: "w-3 h-3 text-xs",
3419
+ sm: "w-4 h-4 text-xs",
3420
3420
  md: "w-5 h-5 text-xs",
3421
3421
  lg: "w-6 h-6 text-sm",
3422
3422
  xl: "w-7 h-7 text-base"
@@ -3688,7 +3688,7 @@ var init_ProgressBar = __esm({
3688
3688
  "div",
3689
3689
  {
3690
3690
  className: cn(
3691
- "h-full transition-all duration-300 ease-out",
3691
+ "h-full transition-all duration-normal ease-emphasized",
3692
3692
  colorClasses[effectiveColor]
3693
3693
  ),
3694
3694
  style: { width: `${percentage}%` },
@@ -3744,7 +3744,7 @@ var init_ProgressBar = __esm({
3744
3744
  strokeDashoffset: offset,
3745
3745
  strokeLinecap: "round",
3746
3746
  className: cn(
3747
- "transition-all duration-300 ease-out",
3747
+ "transition-all duration-normal ease-emphasized",
3748
3748
  colorClasses[effectiveColor]
3749
3749
  )
3750
3750
  }
@@ -3783,7 +3783,7 @@ var init_ProgressBar = __esm({
3783
3783
  "div",
3784
3784
  {
3785
3785
  className: cn(
3786
- "h-full transition-all duration-300 ease-out",
3786
+ "h-full transition-all duration-normal ease-emphasized",
3787
3787
  (isActive || isPartial) && colorClasses[effectiveColor]
3788
3788
  ),
3789
3789
  style: {
@@ -4368,6 +4368,37 @@ var init_ThemeContext = __esm({
4368
4368
  displayName: "Copper",
4369
4369
  hasLightMode: true,
4370
4370
  hasDarkMode: true
4371
+ },
4372
+ // Layer 1 skin axes — truly-unique themes (compact tech / editorial / brutalist dense / display-heavy / touch-first)
4373
+ {
4374
+ name: "prism",
4375
+ displayName: "Prism",
4376
+ hasLightMode: true,
4377
+ hasDarkMode: true
4378
+ },
4379
+ {
4380
+ name: "gazette",
4381
+ displayName: "Gazette",
4382
+ hasLightMode: true,
4383
+ hasDarkMode: true
4384
+ },
4385
+ {
4386
+ name: "terminal",
4387
+ displayName: "Terminal",
4388
+ hasLightMode: true,
4389
+ hasDarkMode: true
4390
+ },
4391
+ {
4392
+ name: "atelier",
4393
+ displayName: "Atelier",
4394
+ hasLightMode: true,
4395
+ hasDarkMode: true
4396
+ },
4397
+ {
4398
+ name: "kiosk",
4399
+ displayName: "Kiosk",
4400
+ hasLightMode: true,
4401
+ hasDarkMode: true
4371
4402
  }
4372
4403
  ];
4373
4404
  ThemeContext = createContext(void 0);
@@ -4406,7 +4437,7 @@ var init_ThemeToggle = __esm({
4406
4437
  "text-foreground",
4407
4438
  "hover:bg-muted border-[length:var(--border-width)] border-transparent hover:border-border",
4408
4439
  "focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
4409
- "transition-colors duration-200",
4440
+ "transition-colors duration-fast",
4410
4441
  sizeClasses4[size],
4411
4442
  className
4412
4443
  ),
@@ -4453,7 +4484,7 @@ var init_FlipContainer = __esm({
4453
4484
  children: /* @__PURE__ */ jsx(
4454
4485
  Box,
4455
4486
  {
4456
- className: "relative w-full h-full transition-transform duration-500",
4487
+ className: "relative w-full h-full transition-transform duration-slow",
4457
4488
  style: {
4458
4489
  transformStyle: "preserve-3d",
4459
4490
  transform: flipped ? "rotateY(180deg)" : "rotateY(0deg)"
@@ -4511,7 +4542,7 @@ var init_ConditionalWrapper = __esm({
4511
4542
  Box,
4512
4543
  {
4513
4544
  overflow: "hidden",
4514
- className: `transition-all duration-200 ${isVisible ? "opacity-100 max-h-[1000px]" : "opacity-0 max-h-0"}`,
4545
+ className: `transition-all duration-fast ${isVisible ? "opacity-100 max-h-[1000px]" : "opacity-0 max-h-0"}`,
4515
4546
  children: isVisible ? children : fallback
4516
4547
  }
4517
4548
  );
@@ -7899,7 +7930,7 @@ var init_InstallBox = __esm({
7899
7930
  /* @__PURE__ */ jsx(
7900
7931
  Box,
7901
7932
  {
7902
- className: "bg-surface rounded-md border-[length:var(--border-width)] border-border",
7933
+ className: "bg-surface rounded-container border-[length:var(--border-width)] border-border",
7903
7934
  padding: "md",
7904
7935
  children: /* @__PURE__ */ jsxs(Box, { className: "flex items-center gap-3", children: [
7905
7936
  /* @__PURE__ */ jsx(
@@ -8624,7 +8655,7 @@ var init_Tooltip = __esm({
8624
8655
  className: cn(
8625
8656
  "fixed z-50 px-3 py-2 max-w-xs",
8626
8657
  "bg-primary text-primary-foreground",
8627
- "shadow-sm rounded-sm",
8658
+ "shadow-elevation-popover rounded-sm",
8628
8659
  "text-sm pointer-events-none",
8629
8660
  "break-words whitespace-normal",
8630
8661
  "h-auto min-h-fit",
@@ -8779,7 +8810,7 @@ var init_Popover = __esm({
8779
8810
  ref: popoverRef,
8780
8811
  className: cn(
8781
8812
  "fixed z-50 p-4",
8782
- "bg-card border-2 border-border shadow-lg",
8813
+ "bg-card border-2 border-border shadow-elevation-popover",
8783
8814
  positionClasses2[position],
8784
8815
  className
8785
8816
  ),
@@ -8893,7 +8924,7 @@ var init_Menu = __esm({
8893
8924
  const menuContainerStyles = cn(
8894
8925
  "bg-card",
8895
8926
  "border-[length:var(--border-width)] border-border",
8896
- "shadow",
8927
+ "shadow-elevation-popover",
8897
8928
  "rounded-sm",
8898
8929
  "min-w-0 sm:min-w-[200px] max-w-[calc(100vw-1rem)] py-1"
8899
8930
  );
@@ -9061,7 +9092,7 @@ var init_Accordion = __esm({
9061
9092
  "w-full flex items-center justify-between px-4 py-3",
9062
9093
  "bg-card",
9063
9094
  "hover:bg-muted",
9064
- "transition-colors duration-200",
9095
+ "transition-colors duration-fast",
9065
9096
  "focus:outline-none focus:ring-2 focus:ring-ring focus:ring-inset",
9066
9097
  "disabled:opacity-50 disabled:cursor-not-allowed",
9067
9098
  isOpen && "bg-muted font-bold"
@@ -9076,7 +9107,7 @@ var init_Accordion = __esm({
9076
9107
  icon: ChevronDown,
9077
9108
  size: "sm",
9078
9109
  className: cn(
9079
- "transition-transform duration-200",
9110
+ "transition-transform duration-fast",
9080
9111
  isOpen && "transform rotate-180"
9081
9112
  )
9082
9113
  }
@@ -9206,7 +9237,7 @@ var init_FloatingActionButton = __esm({
9206
9237
  {
9207
9238
  align: "center",
9208
9239
  gap: "sm",
9209
- className: "transition-all duration-200",
9240
+ className: "transition-all duration-fast",
9210
9241
  style: {
9211
9242
  opacity: isExpanded ? 1 : 0,
9212
9243
  transform: isExpanded ? "translateY(0)" : "translateY(10px)",
@@ -9244,7 +9275,7 @@ var init_FloatingActionButton = __esm({
9244
9275
  size: "lg",
9245
9276
  icon: isExpanded ? X : Plus,
9246
9277
  onClick: handleMainClick,
9247
- className: "rounded-full shadow-lg transition-all duration-300",
9278
+ className: "rounded-full shadow-lg transition-all duration-normal",
9248
9279
  "aria-label": isExpanded ? "Close actions" : "Open actions",
9249
9280
  "aria-expanded": isExpanded,
9250
9281
  children: /* @__PURE__ */ jsx(Typography, { as: "span", className: "sr-only", children: isExpanded ? t("common.close") : t("common.open") })
@@ -13369,8 +13400,8 @@ function Card2({
13369
13400
  className: `
13370
13401
  bg-card
13371
13402
  border border-border
13372
- rounded-md shadow-sm
13373
- ${isClickable ? "cursor-pointer hover:shadow-lg transition-shadow" : ""}
13403
+ rounded-container shadow-elevation-card
13404
+ ${isClickable ? "cursor-pointer hover:shadow-elevation-dialog transition-shadow" : ""}
13374
13405
  ${className}
13375
13406
  `,
13376
13407
  onClick: isClickable ? handleClick : void 0,
@@ -16175,7 +16206,7 @@ var init_BranchingLogicBuilder = __esm({
16175
16206
  const height = PADDING * 2 + items.length * (NODE_HEIGHT + NODE_GAP_Y);
16176
16207
  return { items, positions, width, height };
16177
16208
  }, [questions]);
16178
- return /* @__PURE__ */ jsx(Box, { className: "overflow-auto rounded-md border border-border bg-card p-2", children: /* @__PURE__ */ jsxs(
16209
+ return /* @__PURE__ */ jsx(Box, { className: "overflow-auto rounded-container border border-border bg-card p-2", children: /* @__PURE__ */ jsxs(
16179
16210
  "svg",
16180
16211
  {
16181
16212
  width: layout.width,
@@ -19006,7 +19037,7 @@ var init_Carousel = __esm({
19006
19037
  Box,
19007
19038
  {
19008
19039
  className: cn(
19009
- "rounded-full cursor-pointer transition-all duration-200"
19040
+ "rounded-full cursor-pointer transition-all duration-fast"
19010
19041
  ),
19011
19042
  style: {
19012
19043
  width: isActive ? 10 : 8,
@@ -20098,7 +20129,7 @@ var init_CodeExample = __esm({
20098
20129
  {
20099
20130
  className: cn(
20100
20131
  "bg-foreground",
20101
- "rounded-md",
20132
+ "rounded-container",
20102
20133
  "border-[length:var(--border-width)] border-border",
20103
20134
  "overflow-hidden",
20104
20135
  className
@@ -22465,7 +22496,7 @@ function DataGrid({
22465
22496
  className: cn(
22466
22497
  "bg-card rounded-lg",
22467
22498
  "border border-border",
22468
- "shadow-sm hover:shadow-lg",
22499
+ "shadow-elevation-card hover:shadow-elevation-dialog",
22469
22500
  "hover:border-primary transition-all",
22470
22501
  "flex flex-col",
22471
22502
  isSelected && "ring-2 ring-primary border-primary"
@@ -22839,7 +22870,7 @@ function DataList({
22839
22870
  {
22840
22871
  variant: "caption",
22841
22872
  className: cn(
22842
- "mt-1 text-[0.65rem]",
22873
+ "mt-1 text-xs",
22843
22874
  isSent ? "opacity-70" : "text-muted-foreground"
22844
22875
  ),
22845
22876
  children: formatDate3(timestamp)
@@ -22904,7 +22935,7 @@ function DataList({
22904
22935
  Box,
22905
22936
  {
22906
22937
  className: cn(
22907
- "group flex items-center gap-4 transition-all duration-200",
22938
+ "group flex items-center gap-4 transition-all duration-fast",
22908
22939
  isCompact ? "px-4 py-2" : "px-6 py-4",
22909
22940
  "hover:bg-muted/80",
22910
22941
  !isCard && !isCompact && "rounded-lg border border-transparent hover:border-border"
@@ -22991,7 +23022,7 @@ function DataList({
22991
23022
  Box,
22992
23023
  {
22993
23024
  className: cn(
22994
- isCard && "bg-card rounded-xl border border-border shadow-lg overflow-hidden",
23025
+ isCard && "bg-card rounded-xl border border-border shadow-elevation-dialog overflow-hidden",
22995
23026
  !isCard && gapClass,
22996
23027
  className
22997
23028
  ),
@@ -23133,7 +23164,7 @@ var init_FileTree = __esm({
23133
23164
  Typography,
23134
23165
  {
23135
23166
  variant: "caption",
23136
- className: `truncate font-mono text-[11px] !text-inherit ${isSelected ? "font-semibold" : ""}`,
23167
+ className: `truncate font-mono text-xs !text-inherit ${isSelected ? "font-semibold" : ""}`,
23137
23168
  children: node.name
23138
23169
  }
23139
23170
  ),
@@ -23519,7 +23550,7 @@ var init_FilterGroup = __esm({
23519
23550
  "div",
23520
23551
  {
23521
23552
  className: cn(
23522
- "p-4 rounded-md",
23553
+ "p-4 rounded-container",
23523
23554
  "bg-card",
23524
23555
  "border-[length:var(--border-width)] border-border",
23525
23556
  className
@@ -24201,7 +24232,7 @@ var init_SidePanel = __esm({
24201
24232
  "border-l-2 border-border",
24202
24233
  position === "left" && "border-l-0 border-r-2",
24203
24234
  "flex flex-col",
24204
- "transition-transform duration-300 ease-in-out",
24235
+ "transition-transform duration-normal ease-standard",
24205
24236
  width,
24206
24237
  position === "right" ? "right-0" : "left-0",
24207
24238
  className
@@ -24603,7 +24634,7 @@ var init_ViolationAlert = __esm({
24603
24634
  Box,
24604
24635
  {
24605
24636
  className: cn(
24606
- "px-3 py-2 rounded-md border",
24637
+ "px-3 py-2 rounded-container border",
24607
24638
  bgColor,
24608
24639
  className
24609
24640
  ),
@@ -24864,7 +24895,7 @@ var init_FlipCard = __esm({
24864
24895
  /* @__PURE__ */ jsx(
24865
24896
  Box,
24866
24897
  {
24867
- className: "absolute inset-0 w-full h-full rounded-lg shadow-lg flex items-center justify-center p-6",
24898
+ className: "absolute inset-0 w-full h-full rounded-lg shadow-elevation-dialog flex items-center justify-center p-6",
24868
24899
  style: { backfaceVisibility: "hidden", transform: "rotateY(0deg)" },
24869
24900
  children: front
24870
24901
  }
@@ -24872,7 +24903,7 @@ var init_FlipCard = __esm({
24872
24903
  /* @__PURE__ */ jsx(
24873
24904
  Box,
24874
24905
  {
24875
- className: "absolute inset-0 w-full h-full rounded-lg shadow-lg flex items-center justify-center p-6",
24906
+ className: "absolute inset-0 w-full h-full rounded-lg shadow-elevation-dialog flex items-center justify-center p-6",
24876
24907
  style: { backfaceVisibility: "hidden", transform: "rotateY(180deg)" },
24877
24908
  children: back
24878
24909
  }
@@ -25217,7 +25248,7 @@ var init_ProgressDots = __esm({
25217
25248
  Box,
25218
25249
  {
25219
25250
  className: cn(
25220
- "rounded-full transition-all duration-200",
25251
+ "rounded-full transition-all duration-fast",
25221
25252
  onDotClick && "cursor-pointer"
25222
25253
  ),
25223
25254
  style: {
@@ -28238,7 +28269,7 @@ var init_Meter = __esm({
28238
28269
  strokeDasharray: circumference,
28239
28270
  strokeDashoffset: offset,
28240
28271
  strokeLinecap: "round",
28241
- className: "transition-all duration-500 ease-out"
28272
+ className: "transition-all duration-slow ease-emphasized"
28242
28273
  }
28243
28274
  )
28244
28275
  ]
@@ -28281,7 +28312,7 @@ var init_Meter = __esm({
28281
28312
  Box,
28282
28313
  {
28283
28314
  className: cn(
28284
- "h-2 flex-1 rounded-sm transition-all duration-300",
28315
+ "h-2 flex-1 rounded-sm transition-all duration-normal",
28285
28316
  !isActive && "bg-muted"
28286
28317
  ),
28287
28318
  style: isActive ? { backgroundColor: segColor } : void 0
@@ -28300,7 +28331,7 @@ var init_Meter = __esm({
28300
28331
  /* @__PURE__ */ jsx(Box, { className: "w-full h-3 bg-muted rounded-full overflow-hidden", children: /* @__PURE__ */ jsx(
28301
28332
  Box,
28302
28333
  {
28303
- className: "h-full rounded-full transition-all duration-500 ease-out",
28334
+ className: "h-full rounded-full transition-all duration-slow ease-emphasized",
28304
28335
  style: {
28305
28336
  width: `${percentage}%`,
28306
28337
  backgroundColor: activeColor
@@ -28688,7 +28719,7 @@ var init_PullToRefresh = __esm({
28688
28719
  className: cn(
28689
28720
  "top-0 left-0 right-0 z-10",
28690
28721
  "items-center justify-center",
28691
- "transition-opacity duration-200",
28722
+ "transition-opacity duration-fast",
28692
28723
  showIndicator ? "opacity-100" : "opacity-0"
28693
28724
  ),
28694
28725
  style: {
@@ -28874,7 +28905,7 @@ var init_PricingCard = __esm({
28874
28905
  "hover:-translate-y-1 transition-all",
28875
28906
  highlighted && [
28876
28907
  "border-[length:2px] border-primary",
28877
- "shadow-lg",
28908
+ "shadow-elevation-dialog",
28878
28909
  "scale-[1.05]",
28879
28910
  "ring-2 ring-primary"
28880
28911
  ],
@@ -30931,7 +30962,7 @@ var init_PositionedCanvas = __esm({
30931
30962
  {
30932
30963
  ref: containerRef,
30933
30964
  "data-testid": "positioned-canvas",
30934
- className: "relative bg-background border border-border rounded-md overflow-hidden",
30965
+ className: "relative bg-background border border-border rounded-container overflow-hidden",
30935
30966
  style: { width, height },
30936
30967
  onClick: handleContainerClick,
30937
30968
  children: items.map((item) => {
@@ -31132,7 +31163,7 @@ function BlockMenu({ block, readOnly, onDelete, onDuplicate, onChangeType }) {
31132
31163
  role: "menu",
31133
31164
  className: cn(
31134
31165
  "absolute right-0 z-10 mt-1 w-44",
31135
- "rounded-md border border-border bg-popover shadow-md",
31166
+ "rounded-container border border-border bg-popover shadow-elevation-popover",
31136
31167
  "py-1 text-sm"
31137
31168
  ),
31138
31169
  children: [
@@ -32408,7 +32439,7 @@ function DocCodeBlock({
32408
32439
  Box,
32409
32440
  {
32410
32441
  className: cn(
32411
- "rounded-md border border-border overflow-hidden",
32442
+ "rounded-container border border-border overflow-hidden",
32412
32443
  className
32413
32444
  ),
32414
32445
  position: "relative",
@@ -32567,11 +32598,11 @@ var init_DocPagination = __esm({
32567
32598
  init_Typography();
32568
32599
  linkCardStyles = [
32569
32600
  "border border-border",
32570
- "rounded-md",
32601
+ "rounded-container",
32571
32602
  "p-4",
32572
32603
  "transition-all",
32573
32604
  "hover:border-primary",
32574
- "hover:shadow-lg",
32605
+ "hover:shadow-elevation-dialog",
32575
32606
  "no-underline",
32576
32607
  "flex-1",
32577
32608
  "min-w-0",
@@ -32708,7 +32739,7 @@ function DocSearch({
32708
32739
  Box,
32709
32740
  {
32710
32741
  position: "absolute",
32711
- className: "top-full left-0 right-0 mt-1 z-50 bg-card border border-border rounded-md shadow-lg max-h-80 overflow-y-auto",
32742
+ className: "top-full left-0 right-0 mt-1 z-50 bg-card border border-border rounded-container shadow-elevation-popover max-h-80 overflow-y-auto",
32712
32743
  children: /* @__PURE__ */ jsx(VStack, { gap: "none", children: results.map((result, index) => /* @__PURE__ */ jsx(
32713
32744
  Box,
32714
32745
  {
@@ -35648,10 +35679,11 @@ var init_Form = __esm({
35648
35679
  type: f3.type,
35649
35680
  required: f3.required,
35650
35681
  defaultValue: f3.default,
35651
- values: f3.values,
35682
+ // EntityField is a discriminated union — `values` lives on Scalar/Enum, `relation` lives on Relation.
35683
+ values: "values" in f3 ? f3.values : void 0,
35652
35684
  min: f3.min,
35653
35685
  max: f3.max,
35654
- relation: f3.relation ? { entity: f3.relation.entity } : void 0
35686
+ relation: "relation" in f3 ? { entity: f3.relation.entity } : void 0
35655
35687
  })
35656
35688
  );
35657
35689
  }, [entity, fields]);
@@ -35879,10 +35911,11 @@ var init_Form = __esm({
35879
35911
  type: entityField.type,
35880
35912
  required: entityField.required,
35881
35913
  defaultValue: entityField.default,
35882
- values: entityField.values,
35914
+ // EntityField is a discriminated union — `values` lives on Scalar/Enum, `relation` lives on Relation.
35915
+ values: "values" in entityField ? entityField.values : void 0,
35883
35916
  min: entityField.min,
35884
35917
  max: entityField.max,
35885
- relation: entityField.relation ? { entity: entityField.relation.entity } : void 0
35918
+ relation: "relation" in entityField ? { entity: entityField.relation.entity } : void 0
35886
35919
  };
35887
35920
  }
35888
35921
  return { name: field, type: "string" };
@@ -47348,8 +47381,176 @@ function themeTokensToCssVars(tokens, mode = "light", darkVariant) {
47348
47381
  vars[`--shadow-${key}`] = value;
47349
47382
  }
47350
47383
  }
47384
+ const pickDensity = isDark && darkVariant?.density ? darkVariant.density : tokens.density;
47385
+ emitDensity(pickDensity, vars);
47386
+ const pickTypeScale = isDark && darkVariant?.typeScale ? darkVariant.typeScale : tokens.typeScale;
47387
+ emitTypeScale(pickTypeScale, vars);
47388
+ const pickMotion = isDark && darkVariant?.motion ? darkVariant.motion : tokens.motion;
47389
+ emitMotion(pickMotion, vars);
47390
+ const pickIconography = isDark && darkVariant?.iconography ? darkVariant.iconography : tokens.iconography;
47391
+ emitIconography(pickIconography, vars);
47392
+ const pickElevation = isDark && darkVariant?.elevation ? darkVariant.elevation : tokens.elevation;
47393
+ emitElevation(pickElevation, vars);
47394
+ const pickGeometry = isDark && darkVariant?.geometry ? darkVariant.geometry : tokens.geometry;
47395
+ emitGeometry(pickGeometry, vars);
47351
47396
  return vars;
47352
47397
  }
47398
+ function emitDensity(density, vars) {
47399
+ if (!density) return;
47400
+ if (density.spacing) {
47401
+ const s = density.spacing;
47402
+ const pairs2 = [
47403
+ ["0", s.space0],
47404
+ ["1", s.space1],
47405
+ ["2", s.space2],
47406
+ ["3", s.space3],
47407
+ ["4", s.space4],
47408
+ ["5", s.space5],
47409
+ ["6", s.space6],
47410
+ ["7", s.space7],
47411
+ ["8", s.space8],
47412
+ ["9", s.space9],
47413
+ ["10", s.space10],
47414
+ ["11", s.space11],
47415
+ ["12", s.space12]
47416
+ ];
47417
+ for (const [k, v] of pairs2) {
47418
+ if (v !== void 0) vars[`--space-${k}`] = v;
47419
+ }
47420
+ }
47421
+ const pairs = [
47422
+ ["button-height-sm", density.buttonHeightSm],
47423
+ ["button-height-md", density.buttonHeightMd],
47424
+ ["button-height-lg", density.buttonHeightLg],
47425
+ ["input-height-sm", density.inputHeightSm],
47426
+ ["input-height-md", density.inputHeightMd],
47427
+ ["input-height-lg", density.inputHeightLg],
47428
+ ["row-height-compact", density.rowHeightCompact],
47429
+ ["row-height-normal", density.rowHeightNormal],
47430
+ ["row-height-spacious", density.rowHeightSpacious],
47431
+ ["card-padding-sm", density.cardPaddingSm],
47432
+ ["card-padding-md", density.cardPaddingMd],
47433
+ ["card-padding-lg", density.cardPaddingLg],
47434
+ ["dialog-padding", density.dialogPadding],
47435
+ ["section-gap", density.sectionGap]
47436
+ ];
47437
+ for (const [k, v] of pairs) {
47438
+ if (v !== void 0) vars[`--${k}`] = v;
47439
+ }
47440
+ }
47441
+ function typeSizeKeyStr(k) {
47442
+ return k;
47443
+ }
47444
+ function typeWeightStr(w) {
47445
+ return w;
47446
+ }
47447
+ function emitTypeIntent(name, intent, vars) {
47448
+ const sizeKey = typeSizeKeyStr(intent.size);
47449
+ const weight = typeWeightStr(intent.weight);
47450
+ vars[`--intent-${name}-size`] = `var(--text-${sizeKey})`;
47451
+ vars[`--intent-${name}-weight`] = `var(--font-weight-${weight})`;
47452
+ vars[`--intent-${name}-leading`] = `var(--leading-${sizeKey})`;
47453
+ }
47454
+ function emitTypeScale(ts, vars) {
47455
+ if (!ts) return;
47456
+ if (ts.displayFamily !== void 0) vars["--font-family-display"] = ts.displayFamily;
47457
+ if (ts.bodyFamily !== void 0) vars["--font-family-body"] = ts.bodyFamily;
47458
+ if (ts.monoFamily !== void 0) vars["--font-family-mono"] = ts.monoFamily;
47459
+ if (ts.scale) {
47460
+ const s = ts.scale;
47461
+ const pairs = [
47462
+ ["xs", s.xs],
47463
+ ["sm", s.sm],
47464
+ ["base", s.base],
47465
+ ["lg", s.lg],
47466
+ ["xl", s.xl],
47467
+ ["2xl", s["2xl"]],
47468
+ ["3xl", s["3xl"]],
47469
+ ["4xl", s["4xl"]],
47470
+ ["display-1", s["display-1"]],
47471
+ ["display-2", s["display-2"]]
47472
+ ];
47473
+ for (const [k, entry] of pairs) {
47474
+ if (entry !== void 0) {
47475
+ vars[`--text-${k}`] = entry.size;
47476
+ vars[`--leading-${k}`] = entry.lineHeight;
47477
+ }
47478
+ }
47479
+ }
47480
+ if (ts.intents) {
47481
+ const i = ts.intents;
47482
+ if (i.headingMajor) emitTypeIntent("heading-major", i.headingMajor, vars);
47483
+ if (i.headingMinor) emitTypeIntent("heading-minor", i.headingMinor, vars);
47484
+ if (i.bodyEmphasis) emitTypeIntent("body-emphasis", i.bodyEmphasis, vars);
47485
+ if (i.bodyDefault) emitTypeIntent("body-default", i.bodyDefault, vars);
47486
+ if (i.bodyQuiet) emitTypeIntent("body-quiet", i.bodyQuiet, vars);
47487
+ if (i.caption) emitTypeIntent("caption", i.caption, vars);
47488
+ if (i.numeric) emitTypeIntent("numeric", i.numeric, vars);
47489
+ }
47490
+ }
47491
+ function emitMotionIntent(name, intent, vars) {
47492
+ vars[`--intent-${name}-duration`] = `var(--duration-${intent.duration})`;
47493
+ vars[`--intent-${name}-easing`] = `var(--easing-${intent.easing})`;
47494
+ }
47495
+ function emitMotion(m, vars) {
47496
+ if (!m) return;
47497
+ if (m.durations) {
47498
+ const d = m.durations;
47499
+ const pairs = [
47500
+ ["instant", d.instant],
47501
+ ["fast", d.fast],
47502
+ ["normal", d.normal],
47503
+ ["slow", d.slow],
47504
+ ["dramatic", d.dramatic]
47505
+ ];
47506
+ for (const [k, v] of pairs) {
47507
+ if (v !== void 0) vars[`--duration-${k}`] = v;
47508
+ }
47509
+ }
47510
+ if (m.easings) {
47511
+ const e = m.easings;
47512
+ const pairs = [
47513
+ ["linear", e.linear],
47514
+ ["standard", e.standard],
47515
+ ["emphasized", e.emphasized],
47516
+ ["spring", e.spring]
47517
+ ];
47518
+ for (const [k, v] of pairs) {
47519
+ if (v !== void 0) vars[`--easing-${k}`] = v;
47520
+ }
47521
+ }
47522
+ if (m.intents) {
47523
+ const i = m.intents;
47524
+ if (i.enter) emitMotionIntent("enter", i.enter, vars);
47525
+ if (i.exit) emitMotionIntent("exit", i.exit, vars);
47526
+ if (i.hover) emitMotionIntent("hover", i.hover, vars);
47527
+ if (i.press) emitMotionIntent("press", i.press, vars);
47528
+ if (i.expand) emitMotionIntent("expand", i.expand, vars);
47529
+ if (i.transition) emitMotionIntent("transition", i.transition, vars);
47530
+ }
47531
+ }
47532
+ function emitIconography(i, vars) {
47533
+ if (!i) return;
47534
+ if (i.family !== void 0) vars["--icon-family"] = i.family;
47535
+ if (i.strokeWidth !== void 0) vars["--icon-stroke-width"] = i.strokeWidth;
47536
+ if (i.defaultSize !== void 0) vars["--icon-default-size"] = i.defaultSize;
47537
+ }
47538
+ function emitElevation(e, vars) {
47539
+ if (!e) return;
47540
+ if (e.cardElevation !== void 0) vars["--elevation-card"] = e.cardElevation;
47541
+ if (e.popoverElevation !== void 0) vars["--elevation-popover"] = e.popoverElevation;
47542
+ if (e.dialogElevation !== void 0) vars["--elevation-dialog"] = e.dialogElevation;
47543
+ if (e.toastElevation !== void 0) vars["--elevation-toast"] = e.toastElevation;
47544
+ }
47545
+ function emitGeometry(g, vars) {
47546
+ if (!g) return;
47547
+ if (g.radiusContainer !== void 0) vars["--radius-container"] = g.radiusContainer;
47548
+ if (g.radiusInteractive !== void 0) vars["--radius-interactive"] = g.radiusInteractive;
47549
+ if (g.radiusPill !== void 0) vars["--radius-pill"] = g.radiusPill;
47550
+ if (g.borderHairline !== void 0) vars["--border-hairline"] = g.borderHairline;
47551
+ if (g.borderStandard !== void 0) vars["--border-standard"] = g.borderStandard;
47552
+ if (g.borderHeavy !== void 0) vars["--border-heavy"] = g.borderHeavy;
47553
+ }
47353
47554
  function resolveThemeForRuntime(theme) {
47354
47555
  if (theme === void 0) return void 0;
47355
47556
  if (typeof theme === "string") return void 0;
@@ -47488,7 +47689,7 @@ function generateEntityRow(entity, idx) {
47488
47689
  return row;
47489
47690
  }
47490
47691
  function generateFieldValue(entityName, field, idx) {
47491
- if (field.values && field.values.length > 0) {
47692
+ if ("values" in field && field.values && field.values.length > 0) {
47492
47693
  return field.values[(idx - 1) % field.values.length];
47493
47694
  }
47494
47695
  const fieldName = field.name ?? "";