@getforma/core 1.2.0 → 1.3.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/index.cjs CHANGED
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var chunkE3FV2VSU_cjs = require('./chunk-E3FV2VSU.cjs');
3
+ var chunkFBM7V4NE_cjs = require('./chunk-FBM7V4NE.cjs');
4
4
  var chunkKUXNZ5MG_cjs = require('./chunk-KUXNZ5MG.cjs');
5
5
  var chunkH7MDUHS5_cjs = require('./chunk-H7MDUHS5.cjs');
6
6
 
@@ -26,7 +26,7 @@ function mount(component, container) {
26
26
  if (target.hasAttribute("data-forma-ssr")) {
27
27
  chunkKUXNZ5MG_cjs.createUnownedRoot((dispose) => {
28
28
  disposeRoot = dispose;
29
- chunkE3FV2VSU_cjs.hydrateIsland(component, target);
29
+ chunkFBM7V4NE_cjs.hydrateIsland(component, target);
30
30
  });
31
31
  } else {
32
32
  const dom = chunkKUXNZ5MG_cjs.createUnownedRoot((dispose) => {
@@ -215,8 +215,14 @@ function createSuspense(fallback, children2) {
215
215
  const isPending = pending() > 0;
216
216
  const newNode = isPending ? fallbackNode ??= fallback() : resolvedNode;
217
217
  if (newNode === currentNode) return;
218
- if (currentNode && currentNode.parentNode === parent2) {
219
- parent2.removeChild(currentNode);
218
+ if (currentNode) {
219
+ if (currentNode.parentNode === parent2) {
220
+ parent2.removeChild(currentNode);
221
+ } else if (currentNode.nodeType === 11) {
222
+ while (startMarker.nextSibling && startMarker.nextSibling !== endMarker) {
223
+ currentNode.appendChild(startMarker.nextSibling);
224
+ }
225
+ }
220
226
  }
221
227
  if (newNode) {
222
228
  parent2.insertBefore(newNode, endMarker);
@@ -272,6 +278,10 @@ function activateIslands(registry) {
272
278
  const sharedProps = scriptBlock ? JSON.parse(scriptBlock.textContent) : null;
273
279
  const islands = document.querySelectorAll("[data-forma-island]");
274
280
  for (const root of islands) {
281
+ const status = root.getAttribute("data-forma-status");
282
+ if (status === "active" || status === "hydrating" || status === "disposed" || status === "error") continue;
283
+ if (root.__formaScheduled) continue;
284
+ delete root.__formaDisposed;
275
285
  const id = parseInt(root.getAttribute("data-forma-island"), 10);
276
286
  const componentName = root.getAttribute("data-forma-component");
277
287
  const hydrateFn = registry[componentName];
@@ -282,30 +292,39 @@ function activateIslands(registry) {
282
292
  }
283
293
  const trigger2 = root.getAttribute("data-forma-hydrate") || "load";
284
294
  if (trigger2 === "visible") {
295
+ root.__formaScheduled = true;
285
296
  const observer = new IntersectionObserver(
286
297
  (entries) => {
287
298
  for (const entry of entries) {
288
299
  if (!entry.isIntersecting) continue;
289
300
  observer.disconnect();
301
+ delete root.__formaObserver;
290
302
  hydrateIslandRoot(root, id, componentName, hydrateFn, sharedProps);
291
303
  }
292
304
  },
293
305
  { rootMargin: "200px" }
294
306
  );
307
+ root.__formaObserver = observer;
295
308
  observer.observe(root);
296
309
  } else if (trigger2 === "idle") {
310
+ root.__formaScheduled = true;
297
311
  const hydrate = () => hydrateIslandRoot(root, id, componentName, hydrateFn, sharedProps);
298
312
  if (typeof requestIdleCallback === "function") {
299
- requestIdleCallback(hydrate);
313
+ const handle = requestIdleCallback(hydrate);
314
+ root.__formaIdleCancel = () => cancelIdleCallback(handle);
300
315
  } else {
301
- setTimeout(hydrate, 200);
316
+ const handle = setTimeout(hydrate, 200);
317
+ root.__formaIdleCancel = () => clearTimeout(handle);
302
318
  }
303
319
  } else if (trigger2 === "interaction") {
320
+ root.__formaScheduled = true;
304
321
  const hydrate = () => {
305
322
  root.removeEventListener("pointerdown", hydrate, true);
306
323
  root.removeEventListener("focusin", hydrate, true);
324
+ delete root.__formaInteractionHandler;
307
325
  hydrateIslandRoot(root, id, componentName, hydrateFn, sharedProps);
308
326
  };
327
+ root.__formaInteractionHandler = hydrate;
309
328
  root.addEventListener("pointerdown", hydrate, { capture: true, once: true });
310
329
  root.addEventListener("focusin", hydrate, { capture: true, once: true });
311
330
  } else {
@@ -314,6 +333,24 @@ function activateIslands(registry) {
314
333
  }
315
334
  }
316
335
  function deactivateIsland(el) {
336
+ const observer = el.__formaObserver;
337
+ if (observer) {
338
+ observer.disconnect();
339
+ delete el.__formaObserver;
340
+ }
341
+ const interactionHandler = el.__formaInteractionHandler;
342
+ if (interactionHandler) {
343
+ el.removeEventListener("pointerdown", interactionHandler, true);
344
+ el.removeEventListener("focusin", interactionHandler, true);
345
+ delete el.__formaInteractionHandler;
346
+ }
347
+ const idleCancel = el.__formaIdleCancel;
348
+ if (idleCancel) {
349
+ idleCancel();
350
+ delete el.__formaIdleCancel;
351
+ }
352
+ delete el.__formaScheduled;
353
+ el.__formaDisposed = true;
317
354
  const dispose = el.__formaDispose;
318
355
  if (typeof dispose === "function") {
319
356
  dispose();
@@ -322,18 +359,20 @@ function deactivateIsland(el) {
322
359
  }
323
360
  }
324
361
  function deactivateAllIslands(root = document) {
325
- const islands = root.querySelectorAll('[data-forma-status="active"]');
362
+ const islands = root.querySelectorAll("[data-forma-island]");
326
363
  for (const island of islands) {
327
364
  deactivateIsland(island);
328
365
  }
329
366
  }
330
367
  function hydrateIslandRoot(root, id, componentName, hydrateFn, sharedProps) {
368
+ if (root.__formaDisposed) return;
331
369
  try {
370
+ delete root.__formaScheduled;
332
371
  const props = loadIslandProps(root, id, sharedProps);
333
372
  root.setAttribute("data-forma-status", "hydrating");
334
373
  let activeRoot = root;
335
374
  chunkKUXNZ5MG_cjs.createUnownedRoot((dispose) => {
336
- activeRoot = chunkE3FV2VSU_cjs.hydrateIsland(() => hydrateFn(root, props), root);
375
+ activeRoot = chunkFBM7V4NE_cjs.hydrateIsland(() => hydrateFn(root, props), root);
337
376
  activeRoot.__formaDispose = dispose;
338
377
  });
339
378
  activeRoot.setAttribute("data-forma-status", "active");
@@ -1144,35 +1183,39 @@ function onMutation(el, handler, options) {
1144
1183
 
1145
1184
  Object.defineProperty(exports, "Fragment", {
1146
1185
  enumerable: true,
1147
- get: function () { return chunkE3FV2VSU_cjs.Fragment; }
1186
+ get: function () { return chunkFBM7V4NE_cjs.Fragment; }
1148
1187
  });
1149
1188
  Object.defineProperty(exports, "cleanup", {
1150
1189
  enumerable: true,
1151
- get: function () { return chunkE3FV2VSU_cjs.cleanup; }
1190
+ get: function () { return chunkFBM7V4NE_cjs.cleanup; }
1152
1191
  });
1153
1192
  Object.defineProperty(exports, "createList", {
1154
1193
  enumerable: true,
1155
- get: function () { return chunkE3FV2VSU_cjs.createList; }
1194
+ get: function () { return chunkFBM7V4NE_cjs.createList; }
1156
1195
  });
1157
1196
  Object.defineProperty(exports, "createShow", {
1158
1197
  enumerable: true,
1159
- get: function () { return chunkE3FV2VSU_cjs.createShow; }
1198
+ get: function () { return chunkFBM7V4NE_cjs.createShow; }
1160
1199
  });
1161
1200
  Object.defineProperty(exports, "fragment", {
1162
1201
  enumerable: true,
1163
- get: function () { return chunkE3FV2VSU_cjs.fragment; }
1202
+ get: function () { return chunkFBM7V4NE_cjs.fragment; }
1164
1203
  });
1165
1204
  Object.defineProperty(exports, "h", {
1166
1205
  enumerable: true,
1167
- get: function () { return chunkE3FV2VSU_cjs.h; }
1206
+ get: function () { return chunkFBM7V4NE_cjs.h; }
1168
1207
  });
1169
1208
  Object.defineProperty(exports, "hydrateIsland", {
1170
1209
  enumerable: true,
1171
- get: function () { return chunkE3FV2VSU_cjs.hydrateIsland; }
1210
+ get: function () { return chunkFBM7V4NE_cjs.hydrateIsland; }
1172
1211
  });
1173
1212
  Object.defineProperty(exports, "reconcileList", {
1174
1213
  enumerable: true,
1175
- get: function () { return chunkE3FV2VSU_cjs.reconcileList; }
1214
+ get: function () { return chunkFBM7V4NE_cjs.reconcileList; }
1215
+ });
1216
+ Object.defineProperty(exports, "svg", {
1217
+ enumerable: true,
1218
+ get: function () { return chunkFBM7V4NE_cjs.svg; }
1176
1219
  });
1177
1220
  Object.defineProperty(exports, "batch", {
1178
1221
  enumerable: true,