@almadar/ui 6.29.0 → 6.30.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.
- package/dist/{EntityBindingContext-UyeCfEBS.d.cts → EntityBindingContext-ChCONv2W.d.cts} +1 -50
- package/dist/{EntityBindingContext-UyeCfEBS.d.ts → EntityBindingContext-ChCONv2W.d.ts} +1 -50
- package/dist/avl/index.cjs +5 -6
- package/dist/avl/index.js +5 -6
- package/dist/components/index.cjs +4 -5
- package/dist/components/index.js +4 -5
- package/dist/context/index.cjs +135 -105
- package/dist/context/index.d.cts +2 -60
- package/dist/context/index.d.ts +2 -60
- package/dist/context/index.js +135 -105
- package/dist/lib/index.cjs +455 -0
- package/dist/lib/index.d.cts +42 -1
- package/dist/lib/index.d.ts +42 -1
- package/dist/lib/index.js +438 -1
- package/dist/marketing/index.cjs +4 -5
- package/dist/marketing/index.js +4 -5
- package/dist/providers/index.cjs +143 -116
- package/dist/providers/index.d.cts +1 -1
- package/dist/providers/index.d.ts +1 -1
- package/dist/providers/index.js +143 -116
- package/dist/runtime/index.cjs +5 -6
- package/dist/runtime/index.d.cts +2 -2
- package/dist/runtime/index.d.ts +2 -2
- package/dist/runtime/index.js +5 -6
- package/dist/themeTokens-DVRwufw8.d.cts +112 -0
- package/dist/themeTokens-DVRwufw8.d.ts +112 -0
- package/package.json +6 -5
- package/scripts/audit-tailwind-safelist.ts +4 -0
- package/tailwind-preset.cjs +155 -28
- package/themes/almadar-website.css +37 -107
- package/themes/almadar.css +37 -108
- package/themes/atelier.css +145 -240
- package/themes/bloomberg-dense.css +145 -252
- package/themes/clay.css +39 -137
- package/themes/comic.css +39 -145
- package/themes/corporate.css +39 -131
- package/themes/game-adventure.css +22 -87
- package/themes/game-rpg.css +22 -84
- package/themes/game-sci-fi.css +22 -88
- package/themes/game-ui-pack.css +22 -85
- package/themes/gazette.css +43 -135
- package/themes/glass.css +39 -148
- package/themes/kiosk.css +51 -146
- package/themes/linear-clean.css +145 -215
- package/themes/minimalist.css +39 -125
- package/themes/neon.css +39 -132
- package/themes/notion-editorial.css +145 -215
- package/themes/prism.css +37 -100
- package/themes/retro.css +39 -130
- package/themes/terminal.css +61 -152
- package/themes/trait-wars.css +121 -285
- package/themes/wireframe.css +41 -128
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import React__default, { ReactNode } from 'react';
|
|
3
|
-
import { ResolvedEntity, EventPayload, EntityRow, UserContext, OrbitalSchema,
|
|
3
|
+
import { ResolvedEntity, EventPayload, EntityRow, UserContext, OrbitalSchema, OrbitalEventResponse, ResolvedTrait, ResolvedTraitBinding, TraitConfig } from '@almadar/core';
|
|
4
4
|
import { AnyPatternConfig } from '@almadar/core/patterns';
|
|
5
5
|
import { ServerEffectResult, TransitionResult } from '@almadar/runtime';
|
|
6
6
|
|
|
@@ -84,55 +84,6 @@ declare function useEntitySchema(): EntitySchemaContextValue;
|
|
|
84
84
|
*/
|
|
85
85
|
declare function useEntitySchemaOptional(): EntitySchemaContextValue | null;
|
|
86
86
|
|
|
87
|
-
/** Wire-format client effect tuple from the server response. */
|
|
88
|
-
type ClientEffectTuple = ['render-ui', string, AnyPatternConfig | null, ...SExpr[]] | ['navigate', string, ...SExpr[]] | ['navigate-back'];
|
|
89
|
-
interface OrbitalEventResponse {
|
|
90
|
-
success: boolean;
|
|
91
|
-
transitioned: boolean;
|
|
92
|
-
states: Record<string, string>;
|
|
93
|
-
/**
|
|
94
|
-
* Server-cascade events carried back in the response. Each entry has a
|
|
95
|
-
* `source: BusEventSource` stamped by the compiled handler (`emit ...
|
|
96
|
-
* { source: __ORBITAL_SOURCE }`) so the client can re-broadcast on the
|
|
97
|
-
* qualified `UI:Orbital.Trait.EVENT` bus key (gap #13).
|
|
98
|
-
*/
|
|
99
|
-
emittedEvents?: Array<{
|
|
100
|
-
event: string;
|
|
101
|
-
payload?: EventPayload;
|
|
102
|
-
source?: BusEventSource;
|
|
103
|
-
}>;
|
|
104
|
-
data?: Record<string, EntityRow[]>;
|
|
105
|
-
/**
|
|
106
|
-
* The entity row each trait's effects left behind THIS request, keyed by
|
|
107
|
-
* trait name (Fix C, the stateless entity round-trip). The stateless
|
|
108
|
-
* deployment holds no server-side memory across requests — a `set`-only
|
|
109
|
-
* field a trait wrote here would otherwise vanish on the client's next
|
|
110
|
-
* request, since `entityByTrait` in the REQUEST only ever reflects the
|
|
111
|
-
* client's own prior local writes. Undefined on a server that doesn't
|
|
112
|
-
* send it (older servers, the stateful path) — the client simply keeps
|
|
113
|
-
* behaving as it always has.
|
|
114
|
-
*/
|
|
115
|
-
entityByTrait?: Record<string, EntityRow>;
|
|
116
|
-
clientEffects?: ClientEffectTuple[];
|
|
117
|
-
/**
|
|
118
|
-
* Same effects as `clientEffects`, paired with the trait that produced
|
|
119
|
-
* each one. When present, prefer this for trait attribution. Falls back
|
|
120
|
-
* to legacy `clientEffects` parsing on older servers.
|
|
121
|
-
*/
|
|
122
|
-
clientEffectsByTrait?: Array<{
|
|
123
|
-
traitName: string;
|
|
124
|
-
effect: ClientEffectTuple;
|
|
125
|
-
}>;
|
|
126
|
-
/**
|
|
127
|
-
* Results from server-side effects (persist, call-service, set, …) —
|
|
128
|
-
* `ServerEffectResult`, JSON-serialized. Carries the
|
|
129
|
-
* persist effect's real outcome (action, entity, resulting id, denied)
|
|
130
|
-
* so the verification trace can read it instead of inferring success
|
|
131
|
-
* from a row-count delta.
|
|
132
|
-
*/
|
|
133
|
-
effectResults?: ServerEffectResult[];
|
|
134
|
-
error?: string;
|
|
135
|
-
}
|
|
136
87
|
interface ServerClientEffect {
|
|
137
88
|
type: 'render-ui' | 'navigate' | 'navigate-back';
|
|
138
89
|
slot?: string;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import React__default, { ReactNode } from 'react';
|
|
3
|
-
import { ResolvedEntity, EventPayload, EntityRow, UserContext, OrbitalSchema,
|
|
3
|
+
import { ResolvedEntity, EventPayload, EntityRow, UserContext, OrbitalSchema, OrbitalEventResponse, ResolvedTrait, ResolvedTraitBinding, TraitConfig } from '@almadar/core';
|
|
4
4
|
import { AnyPatternConfig } from '@almadar/core/patterns';
|
|
5
5
|
import { ServerEffectResult, TransitionResult } from '@almadar/runtime';
|
|
6
6
|
|
|
@@ -84,55 +84,6 @@ declare function useEntitySchema(): EntitySchemaContextValue;
|
|
|
84
84
|
*/
|
|
85
85
|
declare function useEntitySchemaOptional(): EntitySchemaContextValue | null;
|
|
86
86
|
|
|
87
|
-
/** Wire-format client effect tuple from the server response. */
|
|
88
|
-
type ClientEffectTuple = ['render-ui', string, AnyPatternConfig | null, ...SExpr[]] | ['navigate', string, ...SExpr[]] | ['navigate-back'];
|
|
89
|
-
interface OrbitalEventResponse {
|
|
90
|
-
success: boolean;
|
|
91
|
-
transitioned: boolean;
|
|
92
|
-
states: Record<string, string>;
|
|
93
|
-
/**
|
|
94
|
-
* Server-cascade events carried back in the response. Each entry has a
|
|
95
|
-
* `source: BusEventSource` stamped by the compiled handler (`emit ...
|
|
96
|
-
* { source: __ORBITAL_SOURCE }`) so the client can re-broadcast on the
|
|
97
|
-
* qualified `UI:Orbital.Trait.EVENT` bus key (gap #13).
|
|
98
|
-
*/
|
|
99
|
-
emittedEvents?: Array<{
|
|
100
|
-
event: string;
|
|
101
|
-
payload?: EventPayload;
|
|
102
|
-
source?: BusEventSource;
|
|
103
|
-
}>;
|
|
104
|
-
data?: Record<string, EntityRow[]>;
|
|
105
|
-
/**
|
|
106
|
-
* The entity row each trait's effects left behind THIS request, keyed by
|
|
107
|
-
* trait name (Fix C, the stateless entity round-trip). The stateless
|
|
108
|
-
* deployment holds no server-side memory across requests — a `set`-only
|
|
109
|
-
* field a trait wrote here would otherwise vanish on the client's next
|
|
110
|
-
* request, since `entityByTrait` in the REQUEST only ever reflects the
|
|
111
|
-
* client's own prior local writes. Undefined on a server that doesn't
|
|
112
|
-
* send it (older servers, the stateful path) — the client simply keeps
|
|
113
|
-
* behaving as it always has.
|
|
114
|
-
*/
|
|
115
|
-
entityByTrait?: Record<string, EntityRow>;
|
|
116
|
-
clientEffects?: ClientEffectTuple[];
|
|
117
|
-
/**
|
|
118
|
-
* Same effects as `clientEffects`, paired with the trait that produced
|
|
119
|
-
* each one. When present, prefer this for trait attribution. Falls back
|
|
120
|
-
* to legacy `clientEffects` parsing on older servers.
|
|
121
|
-
*/
|
|
122
|
-
clientEffectsByTrait?: Array<{
|
|
123
|
-
traitName: string;
|
|
124
|
-
effect: ClientEffectTuple;
|
|
125
|
-
}>;
|
|
126
|
-
/**
|
|
127
|
-
* Results from server-side effects (persist, call-service, set, …) —
|
|
128
|
-
* `ServerEffectResult`, JSON-serialized. Carries the
|
|
129
|
-
* persist effect's real outcome (action, entity, resulting id, denied)
|
|
130
|
-
* so the verification trace can read it instead of inferring success
|
|
131
|
-
* from a row-count delta.
|
|
132
|
-
*/
|
|
133
|
-
effectResults?: ServerEffectResult[];
|
|
134
|
-
error?: string;
|
|
135
|
-
}
|
|
136
87
|
interface ServerClientEffect {
|
|
137
88
|
type: 'render-ui' | 'navigate' | 'navigate-back';
|
|
138
89
|
slot?: string;
|
package/dist/avl/index.cjs
CHANGED
|
@@ -17234,11 +17234,10 @@ var init_HeroSection = __esm({
|
|
|
17234
17234
|
};
|
|
17235
17235
|
backgroundStyles = {
|
|
17236
17236
|
dark: "bg-foreground text-background",
|
|
17237
|
-
|
|
17238
|
-
|
|
17239
|
-
|
|
17240
|
-
|
|
17241
|
-
].join(" "),
|
|
17237
|
+
// A single bracket value: joining this as two array entries put a space
|
|
17238
|
+
// inside the class (Tailwind splits utilities on whitespace), so neither
|
|
17239
|
+
// half was a valid utility and the gradient rendered as nothing.
|
|
17240
|
+
gradient: "bg-[radial-gradient(ellipse_at_top,var(--color-primary)/0.08,transparent_60%),radial-gradient(ellipse_at_bottom_right,var(--color-accent)/0.06,transparent_50%)] bg-background",
|
|
17242
17241
|
subtle: "bg-muted/30"
|
|
17243
17242
|
};
|
|
17244
17243
|
MarketingImage = ({ src, alt, className }) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -60754,7 +60753,7 @@ function normalizeChild(child) {
|
|
|
60754
60753
|
function effectResultsToTraces(results) {
|
|
60755
60754
|
if (!results) return [];
|
|
60756
60755
|
return results.map((r2) => {
|
|
60757
|
-
const resultId = r2.data
|
|
60756
|
+
const resultId = typeof r2.data === "object" && r2.data !== null && !Array.isArray(r2.data) && "id" in r2.data && typeof r2.data.id === "string" ? r2.data.id : void 0;
|
|
60758
60757
|
const outcome = r2.denied ? "denied" : r2.success ? "success" : "failed";
|
|
60759
60758
|
return {
|
|
60760
60759
|
type: r2.effect,
|
package/dist/avl/index.js
CHANGED
|
@@ -17158,11 +17158,10 @@ var init_HeroSection = __esm({
|
|
|
17158
17158
|
};
|
|
17159
17159
|
backgroundStyles = {
|
|
17160
17160
|
dark: "bg-foreground text-background",
|
|
17161
|
-
|
|
17162
|
-
|
|
17163
|
-
|
|
17164
|
-
|
|
17165
|
-
].join(" "),
|
|
17161
|
+
// A single bracket value: joining this as two array entries put a space
|
|
17162
|
+
// inside the class (Tailwind splits utilities on whitespace), so neither
|
|
17163
|
+
// half was a valid utility and the gradient rendered as nothing.
|
|
17164
|
+
gradient: "bg-[radial-gradient(ellipse_at_top,var(--color-primary)/0.08,transparent_60%),radial-gradient(ellipse_at_bottom_right,var(--color-accent)/0.06,transparent_50%)] bg-background",
|
|
17166
17165
|
subtle: "bg-muted/30"
|
|
17167
17166
|
};
|
|
17168
17167
|
MarketingImage = ({ src, alt, className }) => /* @__PURE__ */ jsx(
|
|
@@ -60678,7 +60677,7 @@ function normalizeChild(child) {
|
|
|
60678
60677
|
function effectResultsToTraces(results) {
|
|
60679
60678
|
if (!results) return [];
|
|
60680
60679
|
return results.map((r2) => {
|
|
60681
|
-
const resultId = r2.data
|
|
60680
|
+
const resultId = typeof r2.data === "object" && r2.data !== null && !Array.isArray(r2.data) && "id" in r2.data && typeof r2.data.id === "string" ? r2.data.id : void 0;
|
|
60682
60681
|
const outcome = r2.denied ? "denied" : r2.success ? "success" : "failed";
|
|
60683
60682
|
return {
|
|
60684
60683
|
type: r2.effect,
|
|
@@ -7504,11 +7504,10 @@ var init_HeroSection = __esm({
|
|
|
7504
7504
|
};
|
|
7505
7505
|
backgroundStyles = {
|
|
7506
7506
|
dark: "bg-foreground text-background",
|
|
7507
|
-
|
|
7508
|
-
|
|
7509
|
-
|
|
7510
|
-
|
|
7511
|
-
].join(" "),
|
|
7507
|
+
// A single bracket value: joining this as two array entries put a space
|
|
7508
|
+
// inside the class (Tailwind splits utilities on whitespace), so neither
|
|
7509
|
+
// half was a valid utility and the gradient rendered as nothing.
|
|
7510
|
+
gradient: "bg-[radial-gradient(ellipse_at_top,var(--color-primary)/0.08,transparent_60%),radial-gradient(ellipse_at_bottom_right,var(--color-accent)/0.06,transparent_50%)] bg-background",
|
|
7512
7511
|
subtle: "bg-muted/30"
|
|
7513
7512
|
};
|
|
7514
7513
|
MarketingImage = ({ src, alt, className }) => /* @__PURE__ */ jsxRuntime.jsx(
|
package/dist/components/index.js
CHANGED
|
@@ -7429,11 +7429,10 @@ var init_HeroSection = __esm({
|
|
|
7429
7429
|
};
|
|
7430
7430
|
backgroundStyles = {
|
|
7431
7431
|
dark: "bg-foreground text-background",
|
|
7432
|
-
|
|
7433
|
-
|
|
7434
|
-
|
|
7435
|
-
|
|
7436
|
-
].join(" "),
|
|
7432
|
+
// A single bracket value: joining this as two array entries put a space
|
|
7433
|
+
// inside the class (Tailwind splits utilities on whitespace), so neither
|
|
7434
|
+
// half was a valid utility and the gradient rendered as nothing.
|
|
7435
|
+
gradient: "bg-[radial-gradient(ellipse_at_top,var(--color-primary)/0.08,transparent_60%),radial-gradient(ellipse_at_bottom_right,var(--color-accent)/0.06,transparent_50%)] bg-background",
|
|
7437
7436
|
subtle: "bg-muted/30"
|
|
7438
7437
|
};
|
|
7439
7438
|
MarketingImage = ({ src, alt, className }) => /* @__PURE__ */ jsx(
|
package/dist/context/index.cjs
CHANGED
|
@@ -759,17 +759,127 @@ function useTheme() {
|
|
|
759
759
|
var ThemeContext_default = ThemeContext;
|
|
760
760
|
|
|
761
761
|
// lib/themeTokens.ts
|
|
762
|
+
function applyFlat(obj, table, vars) {
|
|
763
|
+
if (!obj) return;
|
|
764
|
+
for (const { cssVar, key } of table) {
|
|
765
|
+
const value = obj[key];
|
|
766
|
+
if (value !== void 0) vars[cssVar] = value;
|
|
767
|
+
}
|
|
768
|
+
}
|
|
769
|
+
var DENSITY_SPACING_VARS = [
|
|
770
|
+
{ cssVar: "--space-0", key: "space0" },
|
|
771
|
+
{ cssVar: "--space-1", key: "space1" },
|
|
772
|
+
{ cssVar: "--space-2", key: "space2" },
|
|
773
|
+
{ cssVar: "--space-3", key: "space3" },
|
|
774
|
+
{ cssVar: "--space-4", key: "space4" },
|
|
775
|
+
{ cssVar: "--space-5", key: "space5" },
|
|
776
|
+
{ cssVar: "--space-6", key: "space6" },
|
|
777
|
+
{ cssVar: "--space-7", key: "space7" },
|
|
778
|
+
{ cssVar: "--space-8", key: "space8" },
|
|
779
|
+
{ cssVar: "--space-9", key: "space9" },
|
|
780
|
+
{ cssVar: "--space-10", key: "space10" },
|
|
781
|
+
{ cssVar: "--space-11", key: "space11" },
|
|
782
|
+
{ cssVar: "--space-12", key: "space12" }
|
|
783
|
+
];
|
|
784
|
+
var DENSITY_ELEMENT_VARS = [
|
|
785
|
+
{ cssVar: "--button-height-sm", key: "buttonHeightSm" },
|
|
786
|
+
{ cssVar: "--button-height-md", key: "buttonHeightMd" },
|
|
787
|
+
{ cssVar: "--button-height-lg", key: "buttonHeightLg" },
|
|
788
|
+
{ cssVar: "--input-height-sm", key: "inputHeightSm" },
|
|
789
|
+
{ cssVar: "--input-height-md", key: "inputHeightMd" },
|
|
790
|
+
{ cssVar: "--input-height-lg", key: "inputHeightLg" },
|
|
791
|
+
{ cssVar: "--row-height-compact", key: "rowHeightCompact" },
|
|
792
|
+
{ cssVar: "--row-height-normal", key: "rowHeightNormal" },
|
|
793
|
+
{ cssVar: "--row-height-spacious", key: "rowHeightSpacious" },
|
|
794
|
+
{ cssVar: "--card-padding-sm", key: "cardPaddingSm" },
|
|
795
|
+
{ cssVar: "--card-padding-md", key: "cardPaddingMd" },
|
|
796
|
+
{ cssVar: "--card-padding-lg", key: "cardPaddingLg" },
|
|
797
|
+
{ cssVar: "--dialog-padding", key: "dialogPadding" },
|
|
798
|
+
{ cssVar: "--section-gap", key: "sectionGap" }
|
|
799
|
+
];
|
|
800
|
+
var TYPE_FAMILY_VARS = [
|
|
801
|
+
{ cssVar: "--font-family-display", key: "displayFamily" },
|
|
802
|
+
{ cssVar: "--font-family-body", key: "bodyFamily" },
|
|
803
|
+
{ cssVar: "--font-family-mono", key: "monoFamily" }
|
|
804
|
+
];
|
|
805
|
+
var TYPE_SIZE_KEYS = [
|
|
806
|
+
"xs",
|
|
807
|
+
"sm",
|
|
808
|
+
"base",
|
|
809
|
+
"lg",
|
|
810
|
+
"xl",
|
|
811
|
+
"2xl",
|
|
812
|
+
"3xl",
|
|
813
|
+
"4xl",
|
|
814
|
+
"display-1",
|
|
815
|
+
"display-2"
|
|
816
|
+
];
|
|
817
|
+
var TYPE_INTENT_VARS = [
|
|
818
|
+
{ key: "headingMajor", cssName: "heading-major" },
|
|
819
|
+
{ key: "headingMinor", cssName: "heading-minor" },
|
|
820
|
+
{ key: "bodyEmphasis", cssName: "body-emphasis" },
|
|
821
|
+
{ key: "bodyDefault", cssName: "body-default" },
|
|
822
|
+
{ key: "bodyQuiet", cssName: "body-quiet" },
|
|
823
|
+
{ key: "caption", cssName: "caption" },
|
|
824
|
+
{ key: "numeric", cssName: "numeric" }
|
|
825
|
+
];
|
|
826
|
+
var MOTION_DURATION_KEYS = [
|
|
827
|
+
"instant",
|
|
828
|
+
"fast",
|
|
829
|
+
"normal",
|
|
830
|
+
"slow",
|
|
831
|
+
"dramatic"
|
|
832
|
+
];
|
|
833
|
+
var MOTION_EASING_KEYS = [
|
|
834
|
+
"linear",
|
|
835
|
+
"standard",
|
|
836
|
+
"emphasized",
|
|
837
|
+
"spring"
|
|
838
|
+
];
|
|
839
|
+
var MOTION_INTENT_VARS = [
|
|
840
|
+
{ key: "enter", cssName: "enter" },
|
|
841
|
+
{ key: "exit", cssName: "exit" },
|
|
842
|
+
{ key: "hover", cssName: "hover" },
|
|
843
|
+
{ key: "press", cssName: "press" },
|
|
844
|
+
{ key: "expand", cssName: "expand" },
|
|
845
|
+
{ key: "transition", cssName: "transition" }
|
|
846
|
+
];
|
|
847
|
+
var ICONOGRAPHY_VARS = [
|
|
848
|
+
{ cssVar: "--icon-family", key: "family" },
|
|
849
|
+
{ cssVar: "--icon-stroke-width", key: "strokeWidth" },
|
|
850
|
+
{ cssVar: "--icon-default-size", key: "defaultSize" }
|
|
851
|
+
];
|
|
852
|
+
var ELEVATION_VARS = [
|
|
853
|
+
{ cssVar: "--elevation-card", key: "cardElevation" },
|
|
854
|
+
{ cssVar: "--elevation-popover", key: "popoverElevation" },
|
|
855
|
+
{ cssVar: "--elevation-dialog", key: "dialogElevation" },
|
|
856
|
+
{ cssVar: "--elevation-toast", key: "toastElevation" }
|
|
857
|
+
];
|
|
858
|
+
var GEOMETRY_VARS = [
|
|
859
|
+
{ cssVar: "--radius-container", key: "radiusContainer" },
|
|
860
|
+
{ cssVar: "--radius-interactive", key: "radiusInteractive" },
|
|
861
|
+
{ cssVar: "--radius-pill", key: "radiusPill" },
|
|
862
|
+
{ cssVar: "--border-hairline", key: "borderHairline" },
|
|
863
|
+
{ cssVar: "--border-standard", key: "borderStandard" },
|
|
864
|
+
{ cssVar: "--border-heavy", key: "borderHeavy" }
|
|
865
|
+
];
|
|
866
|
+
var LEGACY_PREFIXES = {
|
|
867
|
+
colors: "--color-",
|
|
868
|
+
radii: "--radius-",
|
|
869
|
+
spacing: "--space-",
|
|
870
|
+
shadows: "--shadow-"
|
|
871
|
+
};
|
|
762
872
|
function themeTokensToCssVars(tokens, mode = "light", darkVariant) {
|
|
763
873
|
const vars = {};
|
|
764
874
|
const isDark = mode === "dark";
|
|
765
875
|
const pickColors = isDark && darkVariant?.colors ? darkVariant.colors : tokens.colors;
|
|
766
876
|
if (pickColors) {
|
|
767
877
|
for (const [key, value] of Object.entries(pickColors)) {
|
|
768
|
-
vars[
|
|
878
|
+
vars[`${LEGACY_PREFIXES.colors}${key}`] = value;
|
|
769
879
|
}
|
|
770
880
|
if (isDark && darkVariant?.colors && tokens.colors) {
|
|
771
881
|
for (const [key, value] of Object.entries(tokens.colors)) {
|
|
772
|
-
const varName =
|
|
882
|
+
const varName = `${LEGACY_PREFIXES.colors}${key}`;
|
|
773
883
|
if (!(varName in vars)) vars[varName] = value;
|
|
774
884
|
}
|
|
775
885
|
}
|
|
@@ -777,13 +887,13 @@ function themeTokensToCssVars(tokens, mode = "light", darkVariant) {
|
|
|
777
887
|
const pickRadii = isDark && darkVariant?.radii ? darkVariant.radii : tokens.radii;
|
|
778
888
|
if (pickRadii) {
|
|
779
889
|
for (const [key, value] of Object.entries(pickRadii)) {
|
|
780
|
-
vars[
|
|
890
|
+
vars[`${LEGACY_PREFIXES.radii}${key}`] = value;
|
|
781
891
|
}
|
|
782
892
|
}
|
|
783
893
|
const pickSpacing = isDark && darkVariant?.spacing ? darkVariant.spacing : tokens.spacing;
|
|
784
894
|
if (pickSpacing) {
|
|
785
895
|
for (const [key, value] of Object.entries(pickSpacing)) {
|
|
786
|
-
vars[
|
|
896
|
+
vars[`${LEGACY_PREFIXES.spacing}${key}`] = value;
|
|
787
897
|
}
|
|
788
898
|
}
|
|
789
899
|
const pickTypography = isDark && darkVariant?.typography ? darkVariant.typography : tokens.typography;
|
|
@@ -795,7 +905,7 @@ function themeTokensToCssVars(tokens, mode = "light", darkVariant) {
|
|
|
795
905
|
const pickShadows = isDark && darkVariant?.shadows ? darkVariant.shadows : tokens.shadows;
|
|
796
906
|
if (pickShadows) {
|
|
797
907
|
for (const [key, value] of Object.entries(pickShadows)) {
|
|
798
|
-
vars[
|
|
908
|
+
vars[`${LEGACY_PREFIXES.shadows}${key}`] = value;
|
|
799
909
|
}
|
|
800
910
|
}
|
|
801
911
|
const pickDensity = isDark && darkVariant?.density ? darkVariant.density : tokens.density;
|
|
@@ -814,46 +924,8 @@ function themeTokensToCssVars(tokens, mode = "light", darkVariant) {
|
|
|
814
924
|
}
|
|
815
925
|
function emitDensity(density, vars) {
|
|
816
926
|
if (!density) return;
|
|
817
|
-
|
|
818
|
-
|
|
819
|
-
const pairs2 = [
|
|
820
|
-
["0", s.space0],
|
|
821
|
-
["1", s.space1],
|
|
822
|
-
["2", s.space2],
|
|
823
|
-
["3", s.space3],
|
|
824
|
-
["4", s.space4],
|
|
825
|
-
["5", s.space5],
|
|
826
|
-
["6", s.space6],
|
|
827
|
-
["7", s.space7],
|
|
828
|
-
["8", s.space8],
|
|
829
|
-
["9", s.space9],
|
|
830
|
-
["10", s.space10],
|
|
831
|
-
["11", s.space11],
|
|
832
|
-
["12", s.space12]
|
|
833
|
-
];
|
|
834
|
-
for (const [k, v] of pairs2) {
|
|
835
|
-
if (v !== void 0) vars[`--space-${k}`] = v;
|
|
836
|
-
}
|
|
837
|
-
}
|
|
838
|
-
const pairs = [
|
|
839
|
-
["button-height-sm", density.buttonHeightSm],
|
|
840
|
-
["button-height-md", density.buttonHeightMd],
|
|
841
|
-
["button-height-lg", density.buttonHeightLg],
|
|
842
|
-
["input-height-sm", density.inputHeightSm],
|
|
843
|
-
["input-height-md", density.inputHeightMd],
|
|
844
|
-
["input-height-lg", density.inputHeightLg],
|
|
845
|
-
["row-height-compact", density.rowHeightCompact],
|
|
846
|
-
["row-height-normal", density.rowHeightNormal],
|
|
847
|
-
["row-height-spacious", density.rowHeightSpacious],
|
|
848
|
-
["card-padding-sm", density.cardPaddingSm],
|
|
849
|
-
["card-padding-md", density.cardPaddingMd],
|
|
850
|
-
["card-padding-lg", density.cardPaddingLg],
|
|
851
|
-
["dialog-padding", density.dialogPadding],
|
|
852
|
-
["section-gap", density.sectionGap]
|
|
853
|
-
];
|
|
854
|
-
for (const [k, v] of pairs) {
|
|
855
|
-
if (v !== void 0) vars[`--${k}`] = v;
|
|
856
|
-
}
|
|
927
|
+
applyFlat(density.spacing, DENSITY_SPACING_VARS, vars);
|
|
928
|
+
applyFlat(density, DENSITY_ELEMENT_VARS, vars);
|
|
857
929
|
}
|
|
858
930
|
function typeSizeKeyStr(k) {
|
|
859
931
|
return k;
|
|
@@ -870,24 +942,11 @@ function emitTypeIntent(name, intent, vars) {
|
|
|
870
942
|
}
|
|
871
943
|
function emitTypeScale(ts, vars) {
|
|
872
944
|
if (!ts) return;
|
|
873
|
-
|
|
874
|
-
if (ts.bodyFamily !== void 0) vars["--font-family-body"] = ts.bodyFamily;
|
|
875
|
-
if (ts.monoFamily !== void 0) vars["--font-family-mono"] = ts.monoFamily;
|
|
945
|
+
applyFlat(ts, TYPE_FAMILY_VARS, vars);
|
|
876
946
|
if (ts.scale) {
|
|
877
947
|
const s = ts.scale;
|
|
878
|
-
const
|
|
879
|
-
|
|
880
|
-
["sm", s.sm],
|
|
881
|
-
["base", s.base],
|
|
882
|
-
["lg", s.lg],
|
|
883
|
-
["xl", s.xl],
|
|
884
|
-
["2xl", s["2xl"]],
|
|
885
|
-
["3xl", s["3xl"]],
|
|
886
|
-
["4xl", s["4xl"]],
|
|
887
|
-
["display-1", s["display-1"]],
|
|
888
|
-
["display-2", s["display-2"]]
|
|
889
|
-
];
|
|
890
|
-
for (const [k, entry] of pairs) {
|
|
948
|
+
for (const k of TYPE_SIZE_KEYS) {
|
|
949
|
+
const entry = s[k];
|
|
891
950
|
if (entry !== void 0) {
|
|
892
951
|
vars[`--text-${k}`] = entry.size;
|
|
893
952
|
vars[`--leading-${k}`] = entry.lineHeight;
|
|
@@ -896,13 +955,10 @@ function emitTypeScale(ts, vars) {
|
|
|
896
955
|
}
|
|
897
956
|
if (ts.intents) {
|
|
898
957
|
const i = ts.intents;
|
|
899
|
-
|
|
900
|
-
|
|
901
|
-
|
|
902
|
-
|
|
903
|
-
if (i.bodyQuiet) emitTypeIntent("body-quiet", i.bodyQuiet, vars);
|
|
904
|
-
if (i.caption) emitTypeIntent("caption", i.caption, vars);
|
|
905
|
-
if (i.numeric) emitTypeIntent("numeric", i.numeric, vars);
|
|
958
|
+
for (const { key, cssName } of TYPE_INTENT_VARS) {
|
|
959
|
+
const intent = i[key];
|
|
960
|
+
if (intent) emitTypeIntent(cssName, intent, vars);
|
|
961
|
+
}
|
|
906
962
|
}
|
|
907
963
|
}
|
|
908
964
|
function emitMotionIntent(name, intent, vars) {
|
|
@@ -913,60 +969,34 @@ function emitMotion(m, vars) {
|
|
|
913
969
|
if (!m) return;
|
|
914
970
|
if (m.durations) {
|
|
915
971
|
const d = m.durations;
|
|
916
|
-
const
|
|
917
|
-
|
|
918
|
-
["fast", d.fast],
|
|
919
|
-
["normal", d.normal],
|
|
920
|
-
["slow", d.slow],
|
|
921
|
-
["dramatic", d.dramatic]
|
|
922
|
-
];
|
|
923
|
-
for (const [k, v] of pairs) {
|
|
972
|
+
for (const k of MOTION_DURATION_KEYS) {
|
|
973
|
+
const v = d[k];
|
|
924
974
|
if (v !== void 0) vars[`--duration-${k}`] = v;
|
|
925
975
|
}
|
|
926
976
|
}
|
|
927
977
|
if (m.easings) {
|
|
928
978
|
const e = m.easings;
|
|
929
|
-
const
|
|
930
|
-
|
|
931
|
-
["standard", e.standard],
|
|
932
|
-
["emphasized", e.emphasized],
|
|
933
|
-
["spring", e.spring]
|
|
934
|
-
];
|
|
935
|
-
for (const [k, v] of pairs) {
|
|
979
|
+
for (const k of MOTION_EASING_KEYS) {
|
|
980
|
+
const v = e[k];
|
|
936
981
|
if (v !== void 0) vars[`--easing-${k}`] = v;
|
|
937
982
|
}
|
|
938
983
|
}
|
|
939
984
|
if (m.intents) {
|
|
940
985
|
const i = m.intents;
|
|
941
|
-
|
|
942
|
-
|
|
943
|
-
|
|
944
|
-
|
|
945
|
-
if (i.expand) emitMotionIntent("expand", i.expand, vars);
|
|
946
|
-
if (i.transition) emitMotionIntent("transition", i.transition, vars);
|
|
986
|
+
for (const { key, cssName } of MOTION_INTENT_VARS) {
|
|
987
|
+
const intent = i[key];
|
|
988
|
+
if (intent) emitMotionIntent(cssName, intent, vars);
|
|
989
|
+
}
|
|
947
990
|
}
|
|
948
991
|
}
|
|
949
992
|
function emitIconography(i, vars) {
|
|
950
|
-
|
|
951
|
-
if (i.family !== void 0) vars["--icon-family"] = i.family;
|
|
952
|
-
if (i.strokeWidth !== void 0) vars["--icon-stroke-width"] = i.strokeWidth;
|
|
953
|
-
if (i.defaultSize !== void 0) vars["--icon-default-size"] = i.defaultSize;
|
|
993
|
+
applyFlat(i, ICONOGRAPHY_VARS, vars);
|
|
954
994
|
}
|
|
955
995
|
function emitElevation(e, vars) {
|
|
956
|
-
|
|
957
|
-
if (e.cardElevation !== void 0) vars["--elevation-card"] = e.cardElevation;
|
|
958
|
-
if (e.popoverElevation !== void 0) vars["--elevation-popover"] = e.popoverElevation;
|
|
959
|
-
if (e.dialogElevation !== void 0) vars["--elevation-dialog"] = e.dialogElevation;
|
|
960
|
-
if (e.toastElevation !== void 0) vars["--elevation-toast"] = e.toastElevation;
|
|
996
|
+
applyFlat(e, ELEVATION_VARS, vars);
|
|
961
997
|
}
|
|
962
998
|
function emitGeometry(g, vars) {
|
|
963
|
-
|
|
964
|
-
if (g.radiusContainer !== void 0) vars["--radius-container"] = g.radiusContainer;
|
|
965
|
-
if (g.radiusInteractive !== void 0) vars["--radius-interactive"] = g.radiusInteractive;
|
|
966
|
-
if (g.radiusPill !== void 0) vars["--radius-pill"] = g.radiusPill;
|
|
967
|
-
if (g.borderHairline !== void 0) vars["--border-hairline"] = g.borderHairline;
|
|
968
|
-
if (g.borderStandard !== void 0) vars["--border-standard"] = g.borderStandard;
|
|
969
|
-
if (g.borderHeavy !== void 0) vars["--border-heavy"] = g.borderHeavy;
|
|
999
|
+
applyFlat(g, GEOMETRY_VARS, vars);
|
|
970
1000
|
}
|
|
971
1001
|
function resolveThemeForRuntime(theme) {
|
|
972
1002
|
if (theme === void 0) return void 0;
|
package/dist/context/index.d.cts
CHANGED
|
@@ -1,65 +1,7 @@
|
|
|
1
1
|
export { U as UISlotContext, a as UISlotProvider, u as useSlotContent, b as useSlotHasContent, c as useUISlots } from '../UISlotContext-BlRDbHDy.cjs';
|
|
2
2
|
export { B as BUILT_IN_THEMES, C as ColorMode, a as CurrentPagePathContext, b as CurrentPagePathProvider, c as CurrentPagePathProviderProps, D as DesignTheme, d as DesignThemeProvider, O as OrbitalThemeProvider, e as OrbitalThemeProviderProps, R as ResolvedMode, T as ThemeContext, f as ThemeProvider, g as ThemeProviderProps, U as UIThemeDefinition, u as useCurrentPagePath, h as useDesignTheme, i as useTheme } from '../CurrentPagePathContext-J1lqjvAq.cjs';
|
|
3
|
-
|
|
4
|
-
export { ANONYMOUS_USER, UISlot } from '@almadar/core';
|
|
3
|
+
export { T as ThemeMode, r as resolveThemeForRuntime, t as themeTokensToCssVars } from '../themeTokens-DVRwufw8.cjs';
|
|
5
4
|
export { U as UserContext, a as UserContextValue, b as UserData, c as UserProvider, d as UserProviderProps, u as useHasPermission, e as useHasRole, f as useUser, g as useUserForEvaluation } from '../UserContext-D566nfWA.cjs';
|
|
5
|
+
export { ANONYMOUS_USER, UISlot } from '@almadar/core';
|
|
6
6
|
export { S as SlotAnimation, a as SlotChangeCallback, b as SlotContent, c as SlotRenderConfig, U as UISlotManager } from '../useUISlots-GNwGLlW2.cjs';
|
|
7
7
|
import 'react';
|
|
8
|
-
|
|
9
|
-
/**
|
|
10
|
-
* themeTokens — runtime mirror of the orbital compiler's theme codegen.
|
|
11
|
-
*
|
|
12
|
-
* The compile path (orbital-rust/crates/orbital-shell-typescript/src/codegen/theme.rs)
|
|
13
|
-
* reads `OrbitalDefinition.theme.tokens` and emits CSS custom-property
|
|
14
|
-
* declarations into a `[data-theme="<name>-<mode>"]` block. The runtime
|
|
15
|
-
* does not parse compiled CSS — it reads the same `tokens` object directly
|
|
16
|
-
* and produces the same `{ '--color-primary': '…', '--radius-md': '…' }` map
|
|
17
|
-
* that the compiler emits.
|
|
18
|
-
*
|
|
19
|
-
* Keeping the two paths byte-identical at the variable level is the contract:
|
|
20
|
-
* editing tokens via the Studio Design System tab must produce the exact
|
|
21
|
-
* same rendered result as editing them in source and running `orbital
|
|
22
|
-
* compile`. The mapping rules here mirror `generate_tokens_css` /
|
|
23
|
-
* `generate_tokens_css_dark` (theme.rs:122–351).
|
|
24
|
-
*
|
|
25
|
-
* Compile vs runtime difference (intentional):
|
|
26
|
-
* - Compile emits the FULL set: schema overrides on top of defaults. This is
|
|
27
|
-
* needed because the compiled CSS replaces the theme entirely.
|
|
28
|
-
* - Runtime emits ONLY the keys present in `tokens` (and `variants.dark`).
|
|
29
|
-
* Missing keys cascade from the parent `[data-theme]` rule on the document
|
|
30
|
-
* element. The provider scopes overrides to an orbital subtree without
|
|
31
|
-
* shadowing inherited defaults.
|
|
32
|
-
*
|
|
33
|
-
* @packageDocumentation
|
|
34
|
-
*/
|
|
35
|
-
|
|
36
|
-
/** Resolved color mode. Mirrors `ThemeContext.resolvedMode`. */
|
|
37
|
-
type ThemeMode = 'light' | 'dark';
|
|
38
|
-
/**
|
|
39
|
-
* Convert `ThemeTokens` (+ optional dark variant) into a CSS custom-property
|
|
40
|
-
* map keyed by variable name (e.g. `--color-primary`).
|
|
41
|
-
*
|
|
42
|
-
* Mapping rules (mirror theme.rs):
|
|
43
|
-
* - `tokens.colors.<k>` → `--color-<k>`
|
|
44
|
-
* - `tokens.radii.<k>` → `--radius-<k>`
|
|
45
|
-
* - `tokens.spacing.<k>` → `--space-<k>`
|
|
46
|
-
* - `tokens.typography.<k>` → `--<k>` (keys already include their `font-`/
|
|
47
|
-
* `letter-`/`line-` prefix)
|
|
48
|
-
* - `tokens.shadows.<k>` → `--shadow-<k>` (schema key has no prefix)
|
|
49
|
-
*
|
|
50
|
-
* In `'dark'` mode, the `darkVariant` overrides are merged on top of the
|
|
51
|
-
* base tokens per category — same precedence the Rust compiler uses
|
|
52
|
-
* (`generate_tokens_css_dark`). Categories not present in `darkVariant` fall
|
|
53
|
-
* back to the base tokens.
|
|
54
|
-
*/
|
|
55
|
-
declare function themeTokensToCssVars(tokens: ThemeTokens, mode?: ThemeMode, darkVariant?: ThemeVariant): Record<string, string>;
|
|
56
|
-
/**
|
|
57
|
-
* `ThemeRef` is `ThemeDefinition | string`. When it's a string, it's an
|
|
58
|
-
* unresolved import reference (e.g. `"Ocean.theme"`) that should have been
|
|
59
|
-
* inlined by the compiler's import phase before runtime. If we still see a
|
|
60
|
-
* string here, the upstream resolution path didn't run — return `undefined`
|
|
61
|
-
* rather than guess. `OrbitalThemeProvider` falls through to passthrough.
|
|
62
|
-
*/
|
|
63
|
-
declare function resolveThemeForRuntime(theme: ThemeRef | undefined): ThemeDefinition | undefined;
|
|
64
|
-
|
|
65
|
-
export { type ThemeMode, resolveThemeForRuntime, themeTokensToCssVars };
|