@almadar/ui 4.6.5 → 4.6.9
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/avl/index.cjs +1459 -1330
- package/dist/avl/index.js +383 -254
- package/dist/components/index.cjs +1129 -1060
- package/dist/components/index.js +230 -161
- package/dist/lib/index.cjs +19 -14
- package/dist/lib/index.js +19 -14
- package/dist/providers/EventBusProvider.d.ts +0 -21
- package/dist/providers/index.cjs +1028 -916
- package/dist/providers/index.js +277 -165
- package/dist/runtime/index.cjs +176 -87
- package/dist/runtime/index.js +177 -88
- package/dist/runtime/ui/SlotsContext.d.ts +3 -0
- package/package.json +1 -1
package/dist/runtime/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React115 from 'react';
|
|
2
|
-
import React115__default, { createContext, useContext, useRef, useEffect, useCallback, useMemo,
|
|
2
|
+
import React115__default, { createContext, useContext, useRef, useEffect, useCallback, useMemo, useState, Suspense, useLayoutEffect, lazy, useId } from 'react';
|
|
3
3
|
import { EventBusContext, OrbitalProvider, VerificationProvider } from '@almadar/ui/providers';
|
|
4
4
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
5
5
|
import { clsx } from 'clsx';
|
|
@@ -1048,6 +1048,109 @@ var init_verificationRegistry = __esm({
|
|
|
1048
1048
|
exposeOnWindow();
|
|
1049
1049
|
}
|
|
1050
1050
|
});
|
|
1051
|
+
function refId(obj) {
|
|
1052
|
+
if (obj === null || obj === void 0 || typeof obj !== "object") return null;
|
|
1053
|
+
const existing = refIds.get(obj);
|
|
1054
|
+
if (existing !== void 0) return existing;
|
|
1055
|
+
const id = nextRefId++;
|
|
1056
|
+
refIds.set(obj, id);
|
|
1057
|
+
return id;
|
|
1058
|
+
}
|
|
1059
|
+
function slotEntriesInOrder(slot) {
|
|
1060
|
+
if (!slot) return [];
|
|
1061
|
+
const out = [];
|
|
1062
|
+
for (const [sourceKey, entry] of Object.entries(slot)) {
|
|
1063
|
+
if (entry.patterns.length > 0) {
|
|
1064
|
+
out.push({ sourceKey, entry });
|
|
1065
|
+
}
|
|
1066
|
+
}
|
|
1067
|
+
return out;
|
|
1068
|
+
}
|
|
1069
|
+
function SlotsProvider({ children }) {
|
|
1070
|
+
const [slots, setSlots] = useState({});
|
|
1071
|
+
const setSlotPatterns = useCallback((slot, patterns, source) => {
|
|
1072
|
+
const sourceKey = source?.trait ?? DEFAULT_SOURCE_KEY;
|
|
1073
|
+
const entityProp = patterns[0]?.pattern && typeof patterns[0].pattern === "object" ? patterns[0].pattern.entity : void 0;
|
|
1074
|
+
slotLog.debug("setSlotPatterns", {
|
|
1075
|
+
slot,
|
|
1076
|
+
sourceKey,
|
|
1077
|
+
patternCount: patterns.length,
|
|
1078
|
+
firstPatternType: patterns[0]?.pattern && typeof patterns[0].pattern === "object" ? patterns[0].pattern.type : void 0,
|
|
1079
|
+
entityRefId: refId(entityProp)
|
|
1080
|
+
});
|
|
1081
|
+
setSlots((prev) => {
|
|
1082
|
+
const prevSlot = prev[slot] ?? {};
|
|
1083
|
+
return {
|
|
1084
|
+
...prev,
|
|
1085
|
+
[slot]: {
|
|
1086
|
+
...prevSlot,
|
|
1087
|
+
[sourceKey]: { patterns, source }
|
|
1088
|
+
}
|
|
1089
|
+
};
|
|
1090
|
+
});
|
|
1091
|
+
}, []);
|
|
1092
|
+
const clearSlot = useCallback((slot) => {
|
|
1093
|
+
setSlots((prev) => {
|
|
1094
|
+
const existing = prev[slot];
|
|
1095
|
+
if (existing && Object.keys(existing).length === 0) {
|
|
1096
|
+
return prev;
|
|
1097
|
+
}
|
|
1098
|
+
return { ...prev, [slot]: {} };
|
|
1099
|
+
});
|
|
1100
|
+
}, []);
|
|
1101
|
+
const clearSlotForSource = useCallback((slot, sourceTrait) => {
|
|
1102
|
+
setSlots((prev) => {
|
|
1103
|
+
const existing = prev[slot];
|
|
1104
|
+
if (!existing || !(sourceTrait in existing)) return prev;
|
|
1105
|
+
const next = { ...existing };
|
|
1106
|
+
delete next[sourceTrait];
|
|
1107
|
+
return { ...prev, [slot]: next };
|
|
1108
|
+
});
|
|
1109
|
+
}, []);
|
|
1110
|
+
const clearAllSlots = useCallback(() => {
|
|
1111
|
+
setSlots({});
|
|
1112
|
+
}, []);
|
|
1113
|
+
const actionsRef = useRef({
|
|
1114
|
+
setSlotPatterns,
|
|
1115
|
+
clearSlot,
|
|
1116
|
+
clearSlotForSource,
|
|
1117
|
+
clearAllSlots
|
|
1118
|
+
});
|
|
1119
|
+
actionsRef.current = { setSlotPatterns, clearSlot, clearSlotForSource, clearAllSlots };
|
|
1120
|
+
const [stableActions] = useState(() => ({
|
|
1121
|
+
setSlotPatterns: (...args) => actionsRef.current.setSlotPatterns(...args),
|
|
1122
|
+
clearSlot: (...args) => actionsRef.current.clearSlot(...args),
|
|
1123
|
+
clearSlotForSource: (...args) => actionsRef.current.clearSlotForSource(...args),
|
|
1124
|
+
clearAllSlots: () => actionsRef.current.clearAllSlots()
|
|
1125
|
+
}));
|
|
1126
|
+
return /* @__PURE__ */ jsx(SlotsActionsContext.Provider, { value: stableActions, children: /* @__PURE__ */ jsx(SlotsStateContext.Provider, { value: slots, children }) });
|
|
1127
|
+
}
|
|
1128
|
+
function useSlots() {
|
|
1129
|
+
return useContext(SlotsStateContext);
|
|
1130
|
+
}
|
|
1131
|
+
function useSlotContent(slotName) {
|
|
1132
|
+
const slots = useContext(SlotsStateContext);
|
|
1133
|
+
return slots[slotName] || null;
|
|
1134
|
+
}
|
|
1135
|
+
function useSlotsActions() {
|
|
1136
|
+
const actions = useContext(SlotsActionsContext);
|
|
1137
|
+
if (!actions) {
|
|
1138
|
+
throw new Error("useSlotsActions must be used within a SlotsProvider");
|
|
1139
|
+
}
|
|
1140
|
+
return actions;
|
|
1141
|
+
}
|
|
1142
|
+
var slotLog, refIds, nextRefId, DEFAULT_SOURCE_KEY, SlotsStateContext, SlotsActionsContext;
|
|
1143
|
+
var init_SlotsContext = __esm({
|
|
1144
|
+
"runtime/ui/SlotsContext.tsx"() {
|
|
1145
|
+
init_logger();
|
|
1146
|
+
slotLog = createLogger("almadar:ui:slot-render");
|
|
1147
|
+
refIds = /* @__PURE__ */ new WeakMap();
|
|
1148
|
+
nextRefId = 1;
|
|
1149
|
+
DEFAULT_SOURCE_KEY = "__default__";
|
|
1150
|
+
SlotsStateContext = createContext({});
|
|
1151
|
+
SlotsActionsContext = createContext(null);
|
|
1152
|
+
}
|
|
1153
|
+
});
|
|
1051
1154
|
function cn(...inputs) {
|
|
1052
1155
|
return twMerge(clsx(inputs));
|
|
1053
1156
|
}
|
|
@@ -19762,20 +19865,21 @@ var init_InputGroup = __esm({
|
|
|
19762
19865
|
|
|
19763
19866
|
// lib/debug.ts
|
|
19764
19867
|
function isDebugEnabled() {
|
|
19765
|
-
return
|
|
19868
|
+
if (DEBUG_ENABLED) return true;
|
|
19869
|
+
return typeof window !== "undefined" && window.__ALMADAR_DEBUG_VERIFY__ === true;
|
|
19766
19870
|
}
|
|
19767
19871
|
function debug(...args) {
|
|
19768
|
-
if (
|
|
19872
|
+
if (isDebugEnabled()) {
|
|
19769
19873
|
console.log("[DEBUG]", ...args);
|
|
19770
19874
|
}
|
|
19771
19875
|
}
|
|
19772
19876
|
function debugGroup(label) {
|
|
19773
|
-
if (
|
|
19877
|
+
if (isDebugEnabled()) {
|
|
19774
19878
|
console.group(`[DEBUG] ${label}`);
|
|
19775
19879
|
}
|
|
19776
19880
|
}
|
|
19777
19881
|
function debugGroupEnd() {
|
|
19778
|
-
if (
|
|
19882
|
+
if (isDebugEnabled()) {
|
|
19779
19883
|
console.groupEnd();
|
|
19780
19884
|
}
|
|
19781
19885
|
}
|
|
@@ -28288,7 +28392,14 @@ var init_Form = __esm({
|
|
|
28288
28392
|
// Schema-based props
|
|
28289
28393
|
entity,
|
|
28290
28394
|
fields,
|
|
28291
|
-
|
|
28395
|
+
// No `= {}` default: a fresh `{}` evaluated inline on every render
|
|
28396
|
+
// would change the prop reference every tick and bust the useMemo
|
|
28397
|
+
// cache below (`[entity, initialData]` deps), reigniting the
|
|
28398
|
+
// setFormData useEffect on every keystroke and producing an
|
|
28399
|
+
// infinite re-render loop with stuck form inputs. The memo and
|
|
28400
|
+
// submit handler both handle `undefined` already via the
|
|
28401
|
+
// `typeof initialData === 'object'` guard.
|
|
28402
|
+
initialData,
|
|
28292
28403
|
isLoading = false,
|
|
28293
28404
|
error,
|
|
28294
28405
|
submitLabel,
|
|
@@ -28315,9 +28426,11 @@ var init_Form = __esm({
|
|
|
28315
28426
|
const isSchemaEntity = isOrbitalEntitySchema(entity);
|
|
28316
28427
|
const resolvedEntity = isSchemaEntity ? entity : void 0;
|
|
28317
28428
|
const entityName = typeof entity === "string" ? entity : resolvedEntity?.name;
|
|
28318
|
-
const
|
|
28319
|
-
|
|
28320
|
-
|
|
28429
|
+
const normalizedInitialData = React115__default.useMemo(() => {
|
|
28430
|
+
const entityRowAsInitial = isPlainEntityRow(entity) ? entity : void 0;
|
|
28431
|
+
const callerInitial = initialData !== null && typeof initialData === "object" && !Array.isArray(initialData) ? initialData : {};
|
|
28432
|
+
return entityRowAsInitial !== void 0 ? { ...entityRowAsInitial, ...callerInitial } : callerInitial;
|
|
28433
|
+
}, [entity, initialData]);
|
|
28321
28434
|
const entityDerivedFields = React115__default.useMemo(() => {
|
|
28322
28435
|
if (fields && fields.length > 0) return void 0;
|
|
28323
28436
|
if (!resolvedEntity) return void 0;
|
|
@@ -28343,6 +28456,19 @@ var init_Form = __esm({
|
|
|
28343
28456
|
const [collapsedSections, setCollapsedSections] = React115__default.useState(
|
|
28344
28457
|
/* @__PURE__ */ new Set()
|
|
28345
28458
|
);
|
|
28459
|
+
const formMode = props.mode;
|
|
28460
|
+
const mountedRef = React115__default.useRef(false);
|
|
28461
|
+
if (!mountedRef.current) {
|
|
28462
|
+
mountedRef.current = true;
|
|
28463
|
+
debug("forms", "mount", {
|
|
28464
|
+
mode: formMode,
|
|
28465
|
+
submitEvent,
|
|
28466
|
+
cancelEvent,
|
|
28467
|
+
fieldNames: (fields ?? []).map((f3) => f3.name ?? f3.field).filter(Boolean),
|
|
28468
|
+
initialDataKeys: Object.keys(normalizedInitialData),
|
|
28469
|
+
initialData: normalizedInitialData
|
|
28470
|
+
});
|
|
28471
|
+
}
|
|
28346
28472
|
const shouldShowCancel = showCancel ?? (fields && fields.length > 0);
|
|
28347
28473
|
const evalContext = React115__default.useMemo(
|
|
28348
28474
|
() => ({
|
|
@@ -28354,6 +28480,12 @@ var init_Form = __esm({
|
|
|
28354
28480
|
[formData, externalContext]
|
|
28355
28481
|
);
|
|
28356
28482
|
React115__default.useEffect(() => {
|
|
28483
|
+
debug("forms", "initialData-sync", {
|
|
28484
|
+
mode: formMode,
|
|
28485
|
+
normalizedInitialData,
|
|
28486
|
+
prevFormData: formData,
|
|
28487
|
+
willSet: Object.keys(normalizedInitialData).length > 0
|
|
28488
|
+
});
|
|
28357
28489
|
if (Object.keys(normalizedInitialData).length > 0) {
|
|
28358
28490
|
setFormData(normalizedInitialData);
|
|
28359
28491
|
}
|
|
@@ -28410,6 +28542,7 @@ var init_Form = __esm({
|
|
|
28410
28542
|
);
|
|
28411
28543
|
const handleChange = (name, value) => {
|
|
28412
28544
|
const newFormData = { ...formData, [name]: value };
|
|
28545
|
+
debug("forms", "field-change", { mode: formMode, name, value, prevFormData: formData, newFormData });
|
|
28413
28546
|
setFormData(newFormData);
|
|
28414
28547
|
eventBus.emit("UI:FIELD_CHANGED", {
|
|
28415
28548
|
fieldId: name,
|
|
@@ -28448,7 +28581,18 @@ var init_Form = __esm({
|
|
|
28448
28581
|
};
|
|
28449
28582
|
const handleSubmit = (e) => {
|
|
28450
28583
|
e.preventDefault();
|
|
28451
|
-
|
|
28584
|
+
debug("forms", "submit-enter", {
|
|
28585
|
+
mode: formMode,
|
|
28586
|
+
submitEvent,
|
|
28587
|
+
formData,
|
|
28588
|
+
normalizedInitialData
|
|
28589
|
+
});
|
|
28590
|
+
const mergedData = {
|
|
28591
|
+
...normalizedInitialData,
|
|
28592
|
+
...formData
|
|
28593
|
+
};
|
|
28594
|
+
const payload = { data: mergedData };
|
|
28595
|
+
debug("forms", "submit-emit", { mode: formMode, submitEvent: `UI:${submitEvent}`, payloadData: payload.data });
|
|
28452
28596
|
eventBus.emit(`UI:${submitEvent}`, payload);
|
|
28453
28597
|
if (onSubmit) {
|
|
28454
28598
|
eventBus.emit(`UI:${onSubmit}`, payload);
|
|
@@ -37679,6 +37823,14 @@ function SlotContentRenderer({
|
|
|
37679
37823
|
patternPath
|
|
37680
37824
|
}) {
|
|
37681
37825
|
const entityProp = content.props.entity;
|
|
37826
|
+
if (content.pattern === "form-section") {
|
|
37827
|
+
slotLog.debug("SlotContentRenderer:form-section-render", {
|
|
37828
|
+
contentId: content.id,
|
|
37829
|
+
sourceTrait: content.sourceTrait,
|
|
37830
|
+
entityRefId: refId(entityProp),
|
|
37831
|
+
entityIsObject: entityProp !== null && typeof entityProp === "object" && !Array.isArray(entityProp)
|
|
37832
|
+
});
|
|
37833
|
+
}
|
|
37682
37834
|
if (typeof entityProp === "string" && entityProp.length > 0) {
|
|
37683
37835
|
if (typeof process !== "undefined" && process.env && process.env.NODE_ENV !== "production") {
|
|
37684
37836
|
throw new Error(
|
|
@@ -37822,6 +37974,7 @@ var init_UISlotRenderer = __esm({
|
|
|
37822
37974
|
init_Box();
|
|
37823
37975
|
init_Typography();
|
|
37824
37976
|
init_useEventBus();
|
|
37977
|
+
init_SlotsContext();
|
|
37825
37978
|
init_cn();
|
|
37826
37979
|
init_ErrorBoundary();
|
|
37827
37980
|
init_Skeleton();
|
|
@@ -38628,90 +38781,16 @@ function useTrait(traitName) {
|
|
|
38628
38781
|
const context = useTraitContext();
|
|
38629
38782
|
return context.getTrait(traitName);
|
|
38630
38783
|
}
|
|
38631
|
-
|
|
38632
|
-
|
|
38633
|
-
|
|
38634
|
-
const out = [];
|
|
38635
|
-
for (const [sourceKey, entry] of Object.entries(slot)) {
|
|
38636
|
-
if (entry.patterns.length > 0) {
|
|
38637
|
-
out.push({ sourceKey, entry });
|
|
38638
|
-
}
|
|
38639
|
-
}
|
|
38640
|
-
return out;
|
|
38641
|
-
}
|
|
38642
|
-
var SlotsStateContext = createContext({});
|
|
38643
|
-
var SlotsActionsContext = createContext(null);
|
|
38644
|
-
function SlotsProvider({ children }) {
|
|
38645
|
-
const [slots, setSlots] = useState({});
|
|
38646
|
-
const setSlotPatterns = useCallback((slot, patterns, source) => {
|
|
38647
|
-
const sourceKey = source?.trait ?? DEFAULT_SOURCE_KEY;
|
|
38648
|
-
setSlots((prev) => {
|
|
38649
|
-
const prevSlot = prev[slot] ?? {};
|
|
38650
|
-
return {
|
|
38651
|
-
...prev,
|
|
38652
|
-
[slot]: {
|
|
38653
|
-
...prevSlot,
|
|
38654
|
-
[sourceKey]: { patterns, source }
|
|
38655
|
-
}
|
|
38656
|
-
};
|
|
38657
|
-
});
|
|
38658
|
-
}, []);
|
|
38659
|
-
const clearSlot = useCallback((slot) => {
|
|
38660
|
-
setSlots((prev) => {
|
|
38661
|
-
const existing = prev[slot];
|
|
38662
|
-
if (existing && Object.keys(existing).length === 0) {
|
|
38663
|
-
return prev;
|
|
38664
|
-
}
|
|
38665
|
-
return { ...prev, [slot]: {} };
|
|
38666
|
-
});
|
|
38667
|
-
}, []);
|
|
38668
|
-
const clearSlotForSource = useCallback((slot, sourceTrait) => {
|
|
38669
|
-
setSlots((prev) => {
|
|
38670
|
-
const existing = prev[slot];
|
|
38671
|
-
if (!existing || !(sourceTrait in existing)) return prev;
|
|
38672
|
-
const next = { ...existing };
|
|
38673
|
-
delete next[sourceTrait];
|
|
38674
|
-
return { ...prev, [slot]: next };
|
|
38675
|
-
});
|
|
38676
|
-
}, []);
|
|
38677
|
-
const clearAllSlots = useCallback(() => {
|
|
38678
|
-
setSlots({});
|
|
38679
|
-
}, []);
|
|
38680
|
-
const actionsRef = useRef({
|
|
38681
|
-
setSlotPatterns,
|
|
38682
|
-
clearSlot,
|
|
38683
|
-
clearSlotForSource,
|
|
38684
|
-
clearAllSlots
|
|
38685
|
-
});
|
|
38686
|
-
actionsRef.current = { setSlotPatterns, clearSlot, clearSlotForSource, clearAllSlots };
|
|
38687
|
-
const [stableActions] = useState(() => ({
|
|
38688
|
-
setSlotPatterns: (...args) => actionsRef.current.setSlotPatterns(...args),
|
|
38689
|
-
clearSlot: (...args) => actionsRef.current.clearSlot(...args),
|
|
38690
|
-
clearSlotForSource: (...args) => actionsRef.current.clearSlotForSource(...args),
|
|
38691
|
-
clearAllSlots: () => actionsRef.current.clearAllSlots()
|
|
38692
|
-
}));
|
|
38693
|
-
return /* @__PURE__ */ jsx(SlotsActionsContext.Provider, { value: stableActions, children: /* @__PURE__ */ jsx(SlotsStateContext.Provider, { value: slots, children }) });
|
|
38694
|
-
}
|
|
38695
|
-
function useSlots() {
|
|
38696
|
-
return useContext(SlotsStateContext);
|
|
38697
|
-
}
|
|
38698
|
-
function useSlotContent(slotName) {
|
|
38699
|
-
const slots = useContext(SlotsStateContext);
|
|
38700
|
-
return slots[slotName] || null;
|
|
38701
|
-
}
|
|
38702
|
-
function useSlotsActions() {
|
|
38703
|
-
const actions = useContext(SlotsActionsContext);
|
|
38704
|
-
if (!actions) {
|
|
38705
|
-
throw new Error("useSlotsActions must be used within a SlotsProvider");
|
|
38706
|
-
}
|
|
38707
|
-
return actions;
|
|
38708
|
-
}
|
|
38784
|
+
|
|
38785
|
+
// runtime/index.ts
|
|
38786
|
+
init_SlotsContext();
|
|
38709
38787
|
|
|
38710
38788
|
// runtime/OrbPreview.tsx
|
|
38711
38789
|
init_Box();
|
|
38712
38790
|
init_Typography();
|
|
38713
38791
|
init_UISlotRenderer();
|
|
38714
38792
|
init_useEventBus();
|
|
38793
|
+
init_SlotsContext();
|
|
38715
38794
|
init_EntitySchemaContext();
|
|
38716
38795
|
|
|
38717
38796
|
// runtime/ServerBridge.tsx
|
|
@@ -38931,6 +39010,10 @@ function SlotBridge() {
|
|
|
38931
39010
|
const slots = useSlots();
|
|
38932
39011
|
const { render, clear } = useUISlots();
|
|
38933
39012
|
useEffect(() => {
|
|
39013
|
+
slotLog.debug("SlotBridge:effect-fired", {
|
|
39014
|
+
slotCount: Object.keys(slots).length,
|
|
39015
|
+
slots: Object.keys(slots)
|
|
39016
|
+
});
|
|
38934
39017
|
for (const [slotName, slotState] of Object.entries(slots)) {
|
|
38935
39018
|
const entries = slotEntriesInOrder(slotState);
|
|
38936
39019
|
if (entries.length === 0) {
|
|
@@ -38952,6 +39035,12 @@ function SlotBridge() {
|
|
|
38952
39035
|
const only = children[0];
|
|
38953
39036
|
const { type, children: nested, ...rest } = only;
|
|
38954
39037
|
const lastEntry = entries[entries.length - 1];
|
|
39038
|
+
slotLog.debug("SlotBridge:render-single", {
|
|
39039
|
+
slot: slotName,
|
|
39040
|
+
patternType: type,
|
|
39041
|
+
entityRefId: refId(rest.entity),
|
|
39042
|
+
sourceTrait: lastEntry.entry.source?.trait
|
|
39043
|
+
});
|
|
38955
39044
|
render({
|
|
38956
39045
|
target: slotName,
|
|
38957
39046
|
pattern: type,
|
|
@@ -20,6 +20,9 @@
|
|
|
20
20
|
*/
|
|
21
21
|
import React from 'react';
|
|
22
22
|
import type { PatternConfig, EventSource, ResolvedTrait } from '@almadar/core';
|
|
23
|
+
declare const slotLog: import("../../lib").Logger;
|
|
24
|
+
export declare function refId(obj: unknown): number | null;
|
|
25
|
+
export { slotLog };
|
|
23
26
|
/** A single pattern entry in a slot */
|
|
24
27
|
export interface SlotPatternEntry {
|
|
25
28
|
pattern: PatternConfig;
|