@pygmalionjs/pygmalion 0.19.0 → 0.20.1

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/README.md CHANGED
@@ -396,6 +396,62 @@ identity. Selecting an already visible frame in the sidebar preserves the
396
396
  camera; an offscreen frame is revealed with the smallest pan possible and never
397
397
  changes the user's zoom.
398
398
 
399
+ ### Declare catalog conditions
400
+
401
+ A product is often several products at once: a color scheme, an account level
402
+ or a feature entitlement decides which screens exist and how every one of them
403
+ looks. A session preset is one runtime choice for the whole catalog, and a
404
+ preview environment control only dresses the live preview. Independent flags
405
+ are condition axes:
406
+
407
+ ```tsx
408
+ const conditionAxes = [
409
+ {
410
+ id: 'theme',
411
+ label: 'Theme',
412
+ defaultValue: 'authored',
413
+ options: [
414
+ { value: 'authored', label: 'Auto' },
415
+ { value: 'dark', label: 'Dark', environment: { localStorage: { 'app:theme': 'dark' } } },
416
+ ],
417
+ },
418
+ {
419
+ id: 'tier',
420
+ label: 'Plan tier',
421
+ options: [{ value: 'basic', label: 'Basic' }, { value: 'plus', label: 'Plus' }],
422
+ },
423
+ ];
424
+
425
+ <PygmalionEditor conditionAxes={conditionAxes} />
426
+ ```
427
+
428
+ The Conditions panel lists every axis. The effective value is the explicit
429
+ choice, then `defaultValue`, then nothing: an axis without a default constrains
430
+ nothing until chosen, the same way the Default session shows every runtime.
431
+
432
+ Each option's `environment` joins the storyboard baseline underneath every
433
+ frame's own declared environment, in declared axis order and on top of the
434
+ selected session preset. Capture fingerprints, flow sessions and Application
435
+ runs already derive from that baseline, so choosing a value re-resolves the
436
+ catalog under it instead of reusing frames captured under the previous one. An
437
+ option without an environment is a pure catalog choice and leaves existing
438
+ capture identities intact; a default with an environment participates from the
439
+ start.
440
+
441
+ A screen names the values it exists under with `conditions`; an axis it does
442
+ not name means every value:
443
+
444
+ ```tsx
445
+ { id: 'billing', route: '/billing', conditions: { tier: ['plus'] } }
446
+ ```
447
+
448
+ Unknown axis ids or values never widen the catalog: the revision catalog
449
+ validator rejects them, and at runtime such a screen is hidden and reported by
450
+ `conditionDeclarationIssues`. Frame-level condition axes from
451
+ `screenStateAxes` stay frame states and are not promoted to catalog filters. The
452
+ core evaluates the declarations; which product screens exist under which values,
453
+ and what each value means to the application, remain host declarations.
454
+
399
455
  ## Capture artifact lifecycle
400
456
 
401
457
  Import the reusable capture primitives from
@@ -1,5 +1,5 @@
1
1
  import { jsx as p } from "react/jsx-runtime";
2
- import { n as C, R as g, aM as P, ck as R, cl as k, Y as E, cm as I, a7 as m, a4 as b } from "./runtime-DlZpODq8.js";
2
+ import { n as C, R as g, aM as P, ck as R, cl as k, Y as E, cm as I, a7 as m, a4 as b } from "./runtime-Du2Qf5G-.js";
3
3
  import { useRef as L, useLayoutEffect as h } from "react";
4
4
  function v(n) {
5
5
  return `translate(${n.panX}px, ${n.panY}px) scale(${n.zoom})`;