@orion-studios/payload-studio 0.6.0-beta.8 → 0.7.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 (66) hide show
  1. package/README.md +6 -1
  2. package/bin/init.js +329 -0
  3. package/dist/admin/client.js +2106 -585
  4. package/dist/admin/client.mjs +2161 -653
  5. package/dist/admin/index.d.mts +2 -2
  6. package/dist/admin/index.d.ts +2 -2
  7. package/dist/admin/index.js +201 -37
  8. package/dist/admin/index.mjs +2 -2
  9. package/dist/admin-app/client.js +14 -5
  10. package/dist/admin-app/client.mjs +1 -1
  11. package/dist/admin-app/index.d.mts +2 -2
  12. package/dist/admin-app/index.d.ts +2 -2
  13. package/dist/admin-app/styles.css +361 -41
  14. package/dist/admin.css +98 -2
  15. package/dist/blocks/index.mjs +1 -2
  16. package/dist/builder-v2/client.d.mts +18 -0
  17. package/dist/builder-v2/client.d.ts +18 -0
  18. package/dist/builder-v2/client.js +4287 -0
  19. package/dist/builder-v2/client.mjs +4162 -0
  20. package/dist/builder-v2/index.d.mts +249 -0
  21. package/dist/builder-v2/index.d.ts +249 -0
  22. package/dist/builder-v2/index.js +836 -0
  23. package/dist/builder-v2/index.mjs +786 -0
  24. package/dist/builder-v2/styles.css +2705 -0
  25. package/dist/{chunk-PF3EBZXF.mjs → chunk-7ZMXZRBP.mjs} +39 -3
  26. package/dist/{chunk-XKUTZ7IU.mjs → chunk-DTHBPJXU.mjs} +246 -25
  27. package/dist/{chunk-JQAHXYAM.mjs → chunk-KMYMSR7W.mjs} +163 -3
  28. package/dist/{chunk-5FNTVRCR.mjs → chunk-MMJNHBOF.mjs} +204 -40
  29. package/dist/{chunk-KPIX7OSV.mjs → chunk-NF37A575.mjs} +14 -5
  30. package/dist/{chunk-OTHERBGX.mjs → chunk-OF6BATTO.mjs} +57 -112
  31. package/dist/chunk-VA545CHJ.mjs +202 -0
  32. package/dist/forms/index.d.mts +25 -0
  33. package/dist/forms/index.d.ts +25 -0
  34. package/dist/forms/index.js +237 -0
  35. package/dist/forms/index.mjs +25 -0
  36. package/dist/forms/server.d.mts +35 -0
  37. package/dist/forms/server.d.ts +35 -0
  38. package/dist/forms/server.js +442 -0
  39. package/dist/forms/server.mjs +228 -0
  40. package/dist/{index-Crx_MtPw.d.ts → index-0xXWuOuz.d.ts} +38 -6
  41. package/dist/{index-Cv-6qnrw.d.mts → index-BU82akSL.d.mts} +38 -6
  42. package/dist/{index-DyMmaRfI.d.mts → index-BbTcimgH.d.mts} +5 -2
  43. package/dist/{index-D8BNfUJb.d.mts → index-Cen-9wcc.d.mts} +17 -5
  44. package/dist/{index-52HdVLQq.d.ts → index-DAdN56fM.d.ts} +1 -1
  45. package/dist/{index-QPDAedIX.d.ts → index-DV-nW43e.d.ts} +5 -2
  46. package/dist/{index-DEQC3Dwj.d.mts → index-G_uTNffQ.d.mts} +1 -1
  47. package/dist/{index-DD_E2UfJ.d.ts → index-gxcMPpm-.d.ts} +17 -5
  48. package/dist/index.d.mts +5 -5
  49. package/dist/index.d.ts +5 -5
  50. package/dist/index.js +533 -172
  51. package/dist/index.mjs +10 -11
  52. package/dist/nextjs/index.d.mts +1 -1
  53. package/dist/nextjs/index.d.ts +1 -1
  54. package/dist/nextjs/index.js +95 -114
  55. package/dist/nextjs/index.mjs +2 -2
  56. package/dist/{sitePreviewTypes-BkHCWxNW.d.mts → sitePreviewTypes-BrJwGzJj.d.mts} +1 -1
  57. package/dist/{sitePreviewTypes-BkHCWxNW.d.ts → sitePreviewTypes-BrJwGzJj.d.ts} +1 -1
  58. package/dist/studio-pages/builder.css +66 -5
  59. package/dist/studio-pages/client.js +618 -73
  60. package/dist/studio-pages/client.mjs +641 -96
  61. package/dist/studio-pages/index.d.mts +1 -1
  62. package/dist/studio-pages/index.d.ts +1 -1
  63. package/dist/studio-pages/index.js +1893 -24
  64. package/dist/studio-pages/index.mjs +11 -3
  65. package/package.json +38 -3
  66. package/dist/chunk-OQSEJXC4.mjs +0 -166
@@ -25,7 +25,17 @@
25
25
  --orion-cms-accent-border,
26
26
  var(--orion-cms-accent-border-resolved, color-mix(in srgb, var(--orion-admin-accent) 36%, transparent))
27
27
  );
28
- --orion-admin-selection-bg: color-mix(in srgb, var(--orion-admin-accent) 18%, var(--orion-admin-main-bg));
28
+ --orion-admin-selection-bg: var(
29
+ --orion-cms-selection-bg,
30
+ var(
31
+ --orion-cms-selection-bg-resolved,
32
+ color-mix(in srgb, var(--orion-admin-accent) 18%, var(--orion-admin-main-bg))
33
+ )
34
+ );
35
+ --orion-admin-selection-text: var(
36
+ --orion-cms-selection-text,
37
+ var(--orion-cms-selection-text-resolved, var(--orion-admin-text))
38
+ );
29
39
  --orion-admin-radius-xs: var(--orion-cms-radius-xs, var(--orion-cms-radius-xs-resolved, 8px));
30
40
  --orion-admin-radius-sm: var(--orion-cms-radius-sm, var(--orion-cms-radius-sm-resolved, 12px));
31
41
  --orion-admin-radius-md: var(--orion-cms-radius-md, var(--orion-cms-radius-md-resolved, 16px));
@@ -35,6 +45,11 @@
35
45
  --orion-cms-logo-radius,
36
46
  var(--orion-cms-logo-radius-resolved, var(--orion-admin-radius-md))
37
47
  );
48
+ --orion-admin-logo-bg: var(--orion-cms-logo-bg, transparent);
49
+ --orion-admin-logo-border: var(--orion-cms-logo-border, transparent);
50
+ --orion-admin-logo-shadow: var(--orion-cms-logo-shadow, none);
51
+ --orion-admin-logo-padding: var(--orion-cms-logo-padding, 0px);
52
+ --orion-admin-logo-fit: var(--orion-cms-logo-fit, contain);
38
53
  --orion-admin-control-bg: var(--orion-cms-surface, var(--orion-cms-surface-resolved, #ffffff));
39
54
  --orion-admin-control-hover-bg: color-mix(in srgb, var(--orion-admin-control-bg) 78%, white);
40
55
  --orion-admin-input-bg: var(
@@ -111,6 +126,15 @@
111
126
  .orion-admin-page ::selection,
112
127
  .orion-admin-login-shell ::selection {
113
128
  background: var(--orion-admin-selection-bg);
129
+ color: var(--orion-admin-selection-text);
130
+ }
131
+
132
+ .orion-admin-shell ::-moz-selection,
133
+ .orion-admin-main ::-moz-selection,
134
+ .orion-admin-page ::-moz-selection,
135
+ .orion-admin-login-shell ::-moz-selection {
136
+ background: var(--orion-admin-selection-bg);
137
+ color: var(--orion-admin-selection-text);
114
138
  }
115
139
 
116
140
  .orion-admin-shell {
@@ -164,19 +188,47 @@
164
188
  }
165
189
 
166
190
  .orion-admin-brand-logo {
191
+ align-items: center;
192
+ background: var(--orion-admin-logo-bg);
193
+ border: 1px solid var(--orion-admin-logo-border);
167
194
  border-radius: var(--orion-admin-logo-radius);
195
+ box-shadow: var(--orion-admin-logo-shadow);
196
+ box-sizing: border-box;
197
+ display: flex;
168
198
  flex: 0 0 auto;
169
199
  height: 48px;
200
+ justify-content: center;
170
201
  overflow: hidden;
202
+ padding: var(--orion-admin-logo-padding);
171
203
  width: 48px;
172
204
  }
173
205
 
174
206
  .orion-admin-brand-logo img {
175
207
  height: 100%;
176
- object-fit: cover;
208
+ object-fit: var(--orion-admin-logo-fit);
177
209
  width: 100%;
178
210
  }
179
211
 
212
+ .orion-admin-logo-mark {
213
+ background: var(--orion-admin-logo-bg);
214
+ border: 1px solid var(--orion-admin-logo-border);
215
+ border-radius: var(--orion-admin-logo-radius);
216
+ box-shadow: var(--orion-admin-logo-shadow);
217
+ box-sizing: border-box;
218
+ padding: var(--orion-admin-logo-padding);
219
+ }
220
+
221
+ .orion-admin-logo-image {
222
+ display: block;
223
+ height: 100%;
224
+ object-fit: var(--orion-admin-logo-fit);
225
+ width: 100%;
226
+ }
227
+
228
+ .orion-admin-logo-image--dark {
229
+ display: none;
230
+ }
231
+
180
232
  .orion-admin-brand-text {
181
233
  min-width: 0;
182
234
  }
@@ -247,16 +299,34 @@
247
299
  }
248
300
 
249
301
  .orion-admin-logout {
302
+ align-items: center;
250
303
  background: transparent;
251
304
  border: 1px solid var(--orion-admin-border);
252
305
  border-radius: var(--orion-admin-radius-xs);
253
306
  color: var(--orion-admin-text);
254
307
  cursor: pointer;
308
+ display: inline-flex;
255
309
  font-weight: 700;
310
+ gap: 0.45rem;
311
+ justify-content: center;
256
312
  margin-top: 0.6rem;
257
313
  padding: 0.4rem 0.65rem;
258
314
  }
259
315
 
316
+ .orion-admin-logout svg {
317
+ flex: 0 0 auto;
318
+ }
319
+
320
+ .is-collapsed .orion-admin-logout {
321
+ height: 48px;
322
+ padding: 0;
323
+ width: 48px;
324
+ }
325
+
326
+ .is-collapsed .orion-admin-logout span {
327
+ display: none;
328
+ }
329
+
260
330
  .orion-admin-logout:hover:not(:disabled) {
261
331
  background: var(--orion-admin-control-hover-bg);
262
332
  }
@@ -945,12 +1015,34 @@
945
1015
  }
946
1016
 
947
1017
  .template-minimal.login .login__brand .orion-admin-logo-mark {
1018
+ --orion-admin-logo-bg: var(
1019
+ --orion-cms-logo-dark-bg,
1020
+ color-mix(in srgb, var(--orion-admin-login-panel-bg) 88%, white)
1021
+ );
1022
+ --orion-admin-logo-border: var(
1023
+ --orion-cms-logo-dark-border,
1024
+ color-mix(in srgb, var(--brand-secondary) 26%, rgba(255, 255, 255, 0.28))
1025
+ );
1026
+ --orion-admin-logo-fit: var(--orion-cms-logo-dark-fit, contain);
1027
+ --orion-admin-logo-padding: var(--orion-cms-logo-dark-padding, clamp(0.32rem, 0.8vw, 0.48rem));
1028
+ --orion-admin-logo-shadow: var(
1029
+ --orion-cms-logo-dark-shadow,
1030
+ 0 18px 36px rgba(7, 13, 24, 0.18),
1031
+ inset 0 1px 0 rgba(255, 255, 255, 0.72)
1032
+ );
948
1033
  border-radius: var(--orion-admin-logo-radius) !important;
949
- box-shadow: var(--orion-admin-shadow-card);
950
1034
  height: 58px !important;
951
1035
  width: 58px !important;
952
1036
  }
953
1037
 
1038
+ .template-minimal.login .login__brand .orion-admin-logo-mark .orion-admin-logo-image--dark {
1039
+ display: block;
1040
+ }
1041
+
1042
+ .template-minimal.login .login__brand .orion-admin-logo-mark .orion-admin-logo-image--default:not(.is-only-logo) {
1043
+ display: none;
1044
+ }
1045
+
954
1046
  .template-minimal.login .login__brand .orion-admin-logo-wordmark {
955
1047
  color: var(--orion-admin-login-hero-text) !important;
956
1048
  font-family: var(--orion-cms-font-heading, var(--orion-cms-font-heading-resolved, Georgia, 'Times New Roman', serif));
@@ -962,7 +1054,8 @@
962
1054
  .orion-admin-login-intro {
963
1055
  color: var(--orion-admin-login-hero-text);
964
1056
  display: grid;
965
- gap: 1.15rem;
1057
+ align-content: end;
1058
+ gap: 0.95rem;
966
1059
  padding: clamp(1.6rem, 4vw, 2.75rem) clamp(2rem, 4vw, 3rem) clamp(2.2rem, 5vw, 3.25rem);
967
1060
  }
968
1061
 
@@ -984,45 +1077,29 @@
984
1077
  .orion-admin-login-intro h1 {
985
1078
  color: var(--orion-admin-login-hero-text);
986
1079
  font-family: var(--orion-cms-font-heading, var(--orion-cms-font-heading-resolved, Georgia, 'Times New Roman', serif));
987
- font-size: clamp(2.4rem, 3.8vw, 3.6rem);
988
- letter-spacing: -0.05em;
989
- line-height: 0.98;
1080
+ font-size: clamp(2.35rem, 3.4vw, 3.25rem);
1081
+ letter-spacing: -0.045em;
1082
+ line-height: 1;
990
1083
  margin: 0;
991
- max-width: 10ch;
1084
+ max-width: 11ch;
992
1085
  }
993
1086
 
994
1087
  .orion-admin-login-intro > p {
995
1088
  color: var(--orion-admin-login-hero-muted);
996
- font-size: 1.02rem;
997
- line-height: 1.75;
1089
+ font-size: 0.98rem;
1090
+ line-height: 1.7;
998
1091
  margin: 0;
999
- max-width: 34rem;
1000
- }
1001
-
1002
- .orion-admin-login-note-grid {
1003
- display: grid;
1004
- gap: 0.85rem;
1005
- margin-top: 0.35rem;
1092
+ max-width: 28rem;
1006
1093
  }
1007
1094
 
1008
- .orion-admin-login-note {
1009
- background: color-mix(in srgb, var(--orion-admin-login-hero-text) 8%, transparent);
1010
- border: 1px solid color-mix(in srgb, var(--orion-admin-login-hero-text) 12%, transparent);
1011
- border-radius: var(--orion-admin-radius-md);
1012
- display: grid;
1013
- gap: 0.3rem;
1014
- padding: 1rem 1.05rem;
1015
- }
1016
-
1017
- .orion-admin-login-note strong {
1018
- color: var(--orion-admin-login-hero-text);
1019
- font-size: 0.96rem;
1020
- }
1021
-
1022
- .orion-admin-login-note span {
1095
+ .orion-admin-login-caption {
1096
+ border-top: 1px solid color-mix(in srgb, var(--orion-admin-login-hero-text) 14%, transparent);
1023
1097
  color: var(--orion-admin-login-hero-muted);
1024
1098
  font-size: 0.9rem;
1099
+ font-weight: 600;
1025
1100
  line-height: 1.55;
1101
+ margin-top: 0.2rem !important;
1102
+ padding-top: 1rem;
1026
1103
  }
1027
1104
 
1028
1105
  .template-minimal.login .login__form {
@@ -1042,8 +1119,8 @@
1042
1119
 
1043
1120
  .template-minimal.login .login__form::before {
1044
1121
  color: var(--brand-secondary);
1045
- content: 'Welcome back';
1046
- font-size: 0.76rem;
1122
+ content: 'Sign in';
1123
+ font-size: 0.78rem;
1047
1124
  font-weight: 800;
1048
1125
  letter-spacing: 0.18em;
1049
1126
  margin-bottom: -0.1rem;
@@ -1051,20 +1128,24 @@
1051
1128
  }
1052
1129
 
1053
1130
  .template-minimal.login .login__form::after {
1054
- color: var(--orion-admin-login-panel-text);
1055
- content: 'Sign in to continue into your studio workspace.';
1056
- font-family: var(--orion-cms-font-heading, var(--orion-cms-font-heading-resolved, Georgia, 'Times New Roman', serif));
1057
- font-size: clamp(1.6rem, 2.3vw, 2.15rem);
1058
- letter-spacing: -0.035em;
1059
- line-height: 1.1;
1060
- margin-bottom: 0.35rem;
1131
+ content: none;
1061
1132
  }
1062
1133
 
1063
1134
  .template-minimal.login .login__form__inputWrap {
1135
+ display: grid;
1064
1136
  gap: 1rem;
1065
1137
  margin-bottom: 0;
1066
1138
  }
1067
1139
 
1140
+ .template-minimal.login .login__form__inputWrap::before {
1141
+ color: var(--orion-admin-login-panel-muted);
1142
+ content: 'Use the email and password for your admin account.';
1143
+ display: block;
1144
+ font-size: 0.96rem;
1145
+ line-height: 1.55;
1146
+ margin-bottom: 0.15rem;
1147
+ }
1148
+
1068
1149
  .template-minimal.login .login__form .field-type {
1069
1150
  display: grid;
1070
1151
  gap: 0.42rem;
@@ -1564,6 +1645,245 @@
1564
1645
  gap: 0.75rem;
1565
1646
  }
1566
1647
 
1648
+ .orion-admin-workflow-editor {
1649
+ gap: 1rem;
1650
+ }
1651
+
1652
+ .orion-admin-workflow-editor-header,
1653
+ .orion-admin-field-list-header {
1654
+ align-items: flex-start;
1655
+ display: flex;
1656
+ flex-wrap: wrap;
1657
+ gap: 0.8rem;
1658
+ justify-content: space-between;
1659
+ }
1660
+
1661
+ .orion-admin-workflow-node {
1662
+ align-items: center;
1663
+ background:
1664
+ linear-gradient(180deg, color-mix(in srgb, var(--orion-admin-card-bg) 88%, white), var(--orion-admin-card-bg));
1665
+ border: 1px solid color-mix(in srgb, var(--orion-admin-card-border) 80%, transparent);
1666
+ border-radius: var(--orion-admin-radius-md);
1667
+ display: grid;
1668
+ gap: 0.75rem;
1669
+ grid-template-columns: auto minmax(0, 1fr) auto;
1670
+ padding: 0.85rem;
1671
+ position: relative;
1672
+ }
1673
+
1674
+ .orion-admin-step-editor:not(:last-child)::after {
1675
+ background: color-mix(in srgb, var(--orion-admin-accent) 34%, var(--orion-admin-card-border));
1676
+ bottom: -0.85rem;
1677
+ content: '';
1678
+ height: 0.85rem;
1679
+ left: 1.42rem;
1680
+ position: absolute;
1681
+ width: 2px;
1682
+ }
1683
+
1684
+ .orion-admin-workflow-node-number,
1685
+ .orion-admin-step-editor-index,
1686
+ .orion-admin-field-order {
1687
+ align-items: center;
1688
+ background: var(--orion-admin-accent-subtle);
1689
+ border: 1px solid var(--orion-admin-accent-border);
1690
+ border-radius: var(--orion-admin-radius-pill);
1691
+ color: var(--orion-admin-accent);
1692
+ display: inline-flex;
1693
+ flex: 0 0 auto;
1694
+ font-size: 0.78rem;
1695
+ font-variant-numeric: tabular-nums;
1696
+ font-weight: 900;
1697
+ justify-content: center;
1698
+ line-height: 1;
1699
+ text-align: center;
1700
+ }
1701
+
1702
+ .orion-admin-workflow-node-number {
1703
+ box-sizing: border-box;
1704
+ height: 2rem;
1705
+ padding-top: 5px;
1706
+ width: 2rem;
1707
+ }
1708
+
1709
+ .orion-admin-workflow-node-body {
1710
+ display: grid;
1711
+ gap: 0.18rem;
1712
+ min-width: 0;
1713
+ }
1714
+
1715
+ .orion-admin-workflow-node-body strong,
1716
+ .orion-admin-step-editor-title,
1717
+ .orion-admin-field-editor-title {
1718
+ color: var(--orion-admin-text);
1719
+ overflow-wrap: anywhere;
1720
+ }
1721
+
1722
+ .orion-admin-workflow-node-body span,
1723
+ .orion-admin-workflow-node-destination,
1724
+ .orion-admin-step-editor-meta,
1725
+ .orion-admin-field-editor-meta,
1726
+ .orion-admin-field-list-header span {
1727
+ color: var(--orion-admin-muted);
1728
+ font-size: 0.86rem;
1729
+ }
1730
+
1731
+ .orion-admin-workflow-node-destination {
1732
+ background: color-mix(in srgb, var(--orion-admin-card-bg) 78%, white);
1733
+ border: 1px solid color-mix(in srgb, var(--orion-admin-card-border) 72%, transparent);
1734
+ border-radius: var(--orion-admin-radius-pill);
1735
+ font-weight: 800;
1736
+ padding: 0.35rem 0.65rem;
1737
+ white-space: nowrap;
1738
+ }
1739
+
1740
+ .orion-admin-step-editor-list,
1741
+ .orion-admin-field-editor-list {
1742
+ display: grid;
1743
+ gap: 0.85rem;
1744
+ }
1745
+
1746
+ .orion-admin-step-editor,
1747
+ .orion-admin-field-editor {
1748
+ background: color-mix(in srgb, var(--orion-admin-card-bg) 92%, white);
1749
+ border: 1px solid color-mix(in srgb, var(--orion-admin-card-border) 84%, transparent);
1750
+ border-radius: var(--orion-admin-radius-md);
1751
+ overflow: hidden;
1752
+ position: relative;
1753
+ }
1754
+
1755
+ .orion-admin-step-editor {
1756
+ background:
1757
+ linear-gradient(180deg, color-mix(in srgb, var(--orion-admin-card-bg) 97%, white), var(--orion-admin-card-bg));
1758
+ box-shadow:
1759
+ 0 1px 0 color-mix(in srgb, var(--orion-admin-card-bg) 88%, white) inset,
1760
+ 0 10px 24px color-mix(in srgb, var(--orion-admin-text) 5%, transparent);
1761
+ }
1762
+
1763
+ .orion-admin-step-editor[open] {
1764
+ background:
1765
+ linear-gradient(180deg, color-mix(in srgb, var(--orion-admin-accent-subtle) 38%, var(--orion-admin-card-bg)), var(--orion-admin-card-bg));
1766
+ border-color: color-mix(in srgb, var(--orion-admin-accent) 34%, var(--orion-admin-card-border));
1767
+ }
1768
+
1769
+ .orion-admin-step-editor[open]::before {
1770
+ background: linear-gradient(180deg, var(--orion-admin-accent), color-mix(in srgb, var(--orion-admin-accent) 46%, var(--brand-secondary)));
1771
+ bottom: 0;
1772
+ content: '';
1773
+ left: 0;
1774
+ position: absolute;
1775
+ top: 0;
1776
+ width: 4px;
1777
+ }
1778
+
1779
+ .orion-admin-step-editor-summary,
1780
+ .orion-admin-field-editor-summary {
1781
+ align-items: center;
1782
+ cursor: pointer;
1783
+ display: grid;
1784
+ gap: 0.65rem;
1785
+ grid-template-columns: auto minmax(0, 1fr) minmax(96px, auto) auto auto;
1786
+ list-style: none;
1787
+ min-height: 52px;
1788
+ padding: 0.75rem 0.9rem;
1789
+ }
1790
+
1791
+ .orion-admin-step-editor-summary {
1792
+ padding-left: 1rem;
1793
+ }
1794
+
1795
+ .orion-admin-step-editor-summary::-webkit-details-marker,
1796
+ .orion-admin-field-editor-summary::-webkit-details-marker {
1797
+ display: none;
1798
+ }
1799
+
1800
+ .orion-admin-step-editor-summary::after,
1801
+ .orion-admin-field-editor-summary::after {
1802
+ color: var(--orion-admin-muted);
1803
+ content: 'Edit';
1804
+ font-size: 0.78rem;
1805
+ font-weight: 900;
1806
+ justify-self: end;
1807
+ text-transform: uppercase;
1808
+ }
1809
+
1810
+ .orion-admin-step-editor[open] > .orion-admin-step-editor-summary::after,
1811
+ .orion-admin-field-editor[open] > .orion-admin-field-editor-summary::after {
1812
+ content: 'Hide';
1813
+ }
1814
+
1815
+ .orion-admin-step-editor-index {
1816
+ min-height: 1.8rem;
1817
+ padding: 0 0.58rem;
1818
+ }
1819
+
1820
+ .orion-admin-field-order {
1821
+ box-sizing: border-box;
1822
+ height: 1.75rem;
1823
+ padding-top: 5px;
1824
+ width: 1.75rem;
1825
+ }
1826
+
1827
+ .orion-admin-step-editor-body,
1828
+ .orion-admin-field-editor-body {
1829
+ border-top: 1px solid color-mix(in srgb, var(--orion-admin-card-border) 72%, transparent);
1830
+ display: grid;
1831
+ gap: 0.85rem;
1832
+ padding: 0.95rem;
1833
+ }
1834
+
1835
+ .orion-admin-step-editor-body {
1836
+ background: color-mix(in srgb, var(--orion-admin-card-bg) 86%, var(--orion-admin-main-bg));
1837
+ padding-left: 1.15rem;
1838
+ }
1839
+
1840
+ .orion-admin-step-editor-actions {
1841
+ display: flex;
1842
+ flex-wrap: wrap;
1843
+ gap: 0.55rem;
1844
+ }
1845
+
1846
+ .orion-admin-step-settings-grid {
1847
+ display: grid;
1848
+ gap: 0.75rem;
1849
+ grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
1850
+ }
1851
+
1852
+ .orion-admin-field-editor {
1853
+ background: color-mix(in srgb, var(--orion-admin-main-bg) 72%, var(--orion-admin-card-bg));
1854
+ border-color: color-mix(in srgb, var(--brand-secondary) 22%, var(--orion-admin-card-border));
1855
+ border-radius: var(--orion-admin-radius-sm);
1856
+ box-shadow: none;
1857
+ }
1858
+
1859
+ .orion-admin-field-editor-summary {
1860
+ grid-template-columns: auto minmax(0, 1fr) minmax(96px, auto) auto;
1861
+ padding: 0.68rem 0.75rem;
1862
+ }
1863
+
1864
+ .orion-admin-field-editor-list {
1865
+ background:
1866
+ linear-gradient(180deg, color-mix(in srgb, var(--orion-admin-main-bg) 74%, var(--orion-admin-card-bg)), color-mix(in srgb, var(--orion-admin-main-bg) 88%, white));
1867
+ border: 1px solid color-mix(in srgb, var(--brand-secondary) 18%, var(--orion-admin-card-border));
1868
+ border-radius: var(--orion-admin-radius-md);
1869
+ padding: 0.7rem;
1870
+ }
1871
+
1872
+ .orion-admin-field-order {
1873
+ background: color-mix(in srgb, var(--brand-secondary) 10%, var(--orion-admin-card-bg));
1874
+ border-color: color-mix(in srgb, var(--brand-secondary) 32%, var(--orion-admin-card-border));
1875
+ color: color-mix(in srgb, var(--brand-secondary) 74%, var(--orion-admin-text));
1876
+ }
1877
+
1878
+ .orion-admin-field-editor-meta {
1879
+ background: color-mix(in srgb, var(--brand-secondary) 8%, var(--orion-admin-card-bg));
1880
+ border: 1px solid color-mix(in srgb, var(--brand-secondary) 18%, transparent);
1881
+ border-radius: var(--orion-admin-radius-pill);
1882
+ font-weight: 800;
1883
+ justify-self: end;
1884
+ padding: 0.28rem 0.55rem;
1885
+ }
1886
+
1567
1887
  .orion-admin-response-stack.is-scrollable {
1568
1888
  mask-image: linear-gradient(180deg, #000 0%, #000 92%, transparent 100%);
1569
1889
  max-height: 34rem;
package/dist/admin.css CHANGED
@@ -260,6 +260,8 @@ html[data-orion-brand]:not([data-theme='dark']) {
260
260
  --color-base-50: color-mix(in srgb, var(--brand-primary) 2%, rgb(245, 245, 245));
261
261
  --color-base-100: color-mix(in srgb, var(--brand-primary) 3%, rgb(235, 235, 235));
262
262
  --color-base-150: color-mix(in srgb, var(--brand-primary) 4%, rgb(221, 221, 221));
263
+ --orion-cms-selection-bg-resolved: color-mix(in srgb, var(--brand-primary) 16%, white);
264
+ --orion-cms-selection-text-resolved: var(--theme-text);
263
265
  }
264
266
 
265
267
  /* ============================================================
@@ -311,6 +313,8 @@ html[data-orion-brand][data-theme='dark'] {
311
313
  --color-base-900: color-mix(in srgb, var(--brand-primary) 4%, rgb(20, 20, 20));
312
314
  --color-base-850: color-mix(in srgb, var(--brand-primary) 3%, rgb(34, 34, 34));
313
315
  --color-base-800: color-mix(in srgb, var(--brand-primary) 2%, rgb(47, 47, 47));
316
+ --orion-cms-selection-bg-resolved: color-mix(in srgb, var(--brand-primary) 28%, var(--color-base-900));
317
+ --orion-cms-selection-text-resolved: var(--theme-text);
314
318
  }
315
319
 
316
320
  /* ============================================================
@@ -321,11 +325,23 @@ html {
321
325
  }
322
326
 
323
327
  html[data-orion-brand] ::selection {
324
- background: color-mix(in srgb, var(--brand-primary) 18%, white);
328
+ background: var(--orion-cms-selection-bg, var(--orion-cms-selection-bg-resolved));
329
+ color: var(--orion-cms-selection-text, var(--orion-cms-selection-text-resolved));
325
330
  }
326
331
 
327
332
  html[data-orion-brand][data-theme='dark'] ::selection {
328
- background: color-mix(in srgb, var(--brand-primary) 26%, black);
333
+ background: var(--orion-cms-selection-bg, var(--orion-cms-selection-bg-resolved));
334
+ color: var(--orion-cms-selection-text, var(--orion-cms-selection-text-resolved));
335
+ }
336
+
337
+ html[data-orion-brand] ::-moz-selection {
338
+ background: var(--orion-cms-selection-bg, var(--orion-cms-selection-bg-resolved));
339
+ color: var(--orion-cms-selection-text, var(--orion-cms-selection-text-resolved));
340
+ }
341
+
342
+ html[data-orion-brand][data-theme='dark'] ::-moz-selection {
343
+ background: var(--orion-cms-selection-bg, var(--orion-cms-selection-bg-resolved));
344
+ color: var(--orion-cms-selection-text, var(--orion-cms-selection-text-resolved));
329
345
  }
330
346
 
331
347
  /* ============================================================
@@ -546,6 +562,86 @@ body.orion-studio-shell-active .template-default__nav-toggler-wrapper {
546
562
  min-width: 0 !important;
547
563
  }
548
564
 
565
+ /* Payload fallback pages, including /admin/unauthorized, do not use the custom
566
+ Studio shell. Keep them readable and aligned with the Orion CMS theme. */
567
+ body:not(.orion-studio-shell-active) .template-default,
568
+ body:not(.orion-studio-shell-active) .template-minimal:not(.login) {
569
+ background:
570
+ radial-gradient(circle at top left, color-mix(in srgb, var(--brand-secondary) 10%, transparent), transparent 30rem),
571
+ linear-gradient(180deg, var(--admin-bg), color-mix(in srgb, var(--admin-bg) 90%, white)) !important;
572
+ color: var(--admin-text) !important;
573
+ }
574
+
575
+ body:not(.orion-studio-shell-active) .template-default__wrap,
576
+ body:not(.orion-studio-shell-active) .template-minimal:not(.login) .template-minimal__wrap {
577
+ align-items: center !important;
578
+ display: flex !important;
579
+ justify-content: center !important;
580
+ min-height: 100vh !important;
581
+ padding: clamp(1.5rem, 4vw, 4rem) !important;
582
+ }
583
+
584
+ body:not(.orion-studio-shell-active) .template-default__wrap > *:not(.template-default__nav-toggler-wrapper),
585
+ body:not(.orion-studio-shell-active) .template-minimal:not(.login) .template-minimal__wrap > * {
586
+ background: var(--admin-card-bg) !important;
587
+ border: 1px solid var(--admin-card-border) !important;
588
+ border-radius: var(--admin-radius-lg) !important;
589
+ box-shadow: var(--admin-card-shadow-hover) !important;
590
+ color: var(--admin-text) !important;
591
+ max-width: 34rem !important;
592
+ padding: clamp(1.5rem, 4vw, 2.5rem) !important;
593
+ width: min(100%, 34rem) !important;
594
+ }
595
+
596
+ body:not(.orion-studio-shell-active) .template-default__wrap h1,
597
+ body:not(.orion-studio-shell-active) .template-default__wrap h2,
598
+ body:not(.orion-studio-shell-active) .template-default__wrap h3,
599
+ body:not(.orion-studio-shell-active) .template-default__wrap p,
600
+ body:not(.orion-studio-shell-active) .template-default__wrap span,
601
+ body:not(.orion-studio-shell-active) .template-default__wrap div,
602
+ body:not(.orion-studio-shell-active) .template-minimal:not(.login) .template-minimal__wrap h1,
603
+ body:not(.orion-studio-shell-active) .template-minimal:not(.login) .template-minimal__wrap h2,
604
+ body:not(.orion-studio-shell-active) .template-minimal:not(.login) .template-minimal__wrap h3,
605
+ body:not(.orion-studio-shell-active) .template-minimal:not(.login) .template-minimal__wrap p,
606
+ body:not(.orion-studio-shell-active) .template-minimal:not(.login) .template-minimal__wrap span,
607
+ body:not(.orion-studio-shell-active) .template-minimal:not(.login) .template-minimal__wrap div {
608
+ color: var(--admin-text) !important;
609
+ }
610
+
611
+ body:not(.orion-studio-shell-active) .template-default__wrap p,
612
+ body:not(.orion-studio-shell-active) .template-default__wrap .description,
613
+ body:not(.orion-studio-shell-active) .template-default__wrap [class*='description'],
614
+ body:not(.orion-studio-shell-active) .template-minimal:not(.login) .template-minimal__wrap p,
615
+ body:not(.orion-studio-shell-active) .template-minimal:not(.login) .template-minimal__wrap .description,
616
+ body:not(.orion-studio-shell-active) .template-minimal:not(.login) .template-minimal__wrap [class*='description'] {
617
+ color: var(--admin-text-muted) !important;
618
+ }
619
+
620
+ body:not(.orion-studio-shell-active) .template-default__wrap .btn,
621
+ body:not(.orion-studio-shell-active) .template-default__wrap button,
622
+ body:not(.orion-studio-shell-active) .template-default__wrap a[href*='logout'],
623
+ body:not(.orion-studio-shell-active) .template-minimal:not(.login) .template-minimal__wrap .btn,
624
+ body:not(.orion-studio-shell-active) .template-minimal:not(.login) .template-minimal__wrap button,
625
+ body:not(.orion-studio-shell-active) .template-minimal:not(.login) .template-minimal__wrap a[href*='logout'] {
626
+ background: var(--admin-accent) !important;
627
+ border: 1px solid var(--admin-accent) !important;
628
+ border-radius: var(--admin-radius-sm) !important;
629
+ color: var(--admin-text-inverse) !important;
630
+ font-weight: 800 !important;
631
+ min-height: 2.75rem !important;
632
+ padding: 0.75rem 1rem !important;
633
+ }
634
+
635
+ body:not(.orion-studio-shell-active) .template-default__wrap .btn:hover,
636
+ body:not(.orion-studio-shell-active) .template-default__wrap button:hover,
637
+ body:not(.orion-studio-shell-active) .template-default__wrap a[href*='logout']:hover,
638
+ body:not(.orion-studio-shell-active) .template-minimal:not(.login) .template-minimal__wrap .btn:hover,
639
+ body:not(.orion-studio-shell-active) .template-minimal:not(.login) .template-minimal__wrap button:hover,
640
+ body:not(.orion-studio-shell-active) .template-minimal:not(.login) .template-minimal__wrap a[href*='logout']:hover {
641
+ background: var(--admin-accent-hover) !important;
642
+ border-color: var(--admin-accent-hover) !important;
643
+ }
644
+
549
645
  .admin-studio-brand {
550
646
  padding-left: 0 !important;
551
647
  }
@@ -17,8 +17,7 @@ import {
17
17
  defaultPageLayoutBlocks,
18
18
  sectionPresets,
19
19
  templateStarterPresets
20
- } from "../chunk-JQAHXYAM.mjs";
21
- import "../chunk-OQSEJXC4.mjs";
20
+ } from "../chunk-KMYMSR7W.mjs";
22
21
  import "../chunk-6BWS3CLP.mjs";
23
22
  export {
24
23
  BeforeAfterBlock,
@@ -0,0 +1,18 @@
1
+ import type { FC } from 'react'
2
+
3
+ export type {
4
+ BuilderV2EditorInitialData,
5
+ BuilderV2EditorProps,
6
+ BuilderV2PageTreeNode,
7
+ BuilderV2PermissionSet,
8
+ BuilderV2ProjectAdapter,
9
+ BuilderV2ProjectComponentDefinition,
10
+ BuilderV2RuntimeComponent,
11
+ BuilderV2RuntimeComponentProps,
12
+ BuilderV2TraitDefinition,
13
+ BuilderV2ThemeTokens,
14
+ BuilderV2ValidationIssue,
15
+ BuilderV2VersionSnapshot,
16
+ } from './types'
17
+
18
+ export declare const GrapesPageEditor: FC<import('./types').BuilderV2EditorProps>
@@ -0,0 +1,18 @@
1
+ import type { FC } from 'react'
2
+
3
+ export type {
4
+ BuilderV2EditorInitialData,
5
+ BuilderV2EditorProps,
6
+ BuilderV2PageTreeNode,
7
+ BuilderV2PermissionSet,
8
+ BuilderV2ProjectAdapter,
9
+ BuilderV2ProjectComponentDefinition,
10
+ BuilderV2RuntimeComponent,
11
+ BuilderV2RuntimeComponentProps,
12
+ BuilderV2TraitDefinition,
13
+ BuilderV2ThemeTokens,
14
+ BuilderV2ValidationIssue,
15
+ BuilderV2VersionSnapshot,
16
+ } from './types'
17
+
18
+ export declare const GrapesPageEditor: FC<import('./types').BuilderV2EditorProps>