kuinetic 0.2.2 → 0.2.3

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 (52) hide show
  1. package/README.md +2 -2
  2. package/dist/esm/{chunk-K2M7O6W5.mjs → chunk-FASAEQDR.mjs} +32 -1
  3. package/dist/esm/{chunk-XDDJVANU.mjs → chunk-FYMZW5N2.mjs} +2301 -528
  4. package/dist/esm/{chunk-BBQ22D7A.mjs → chunk-MZQG2VMG.mjs} +202 -2
  5. package/dist/esm/core/index.mjs +21 -3
  6. package/dist/esm/effects/index.mjs +2 -2
  7. package/dist/esm/index.mjs +35 -4
  8. package/dist/esm/notes/index.mjs +1075 -0
  9. package/dist/kuinetic.all.js +2502 -501
  10. package/dist/kuinetic.all.min.js +2 -2
  11. package/dist/kuinetic.css +238 -65
  12. package/dist/kuinetic.js +2501 -500
  13. package/dist/kuinetic.min.css +1 -1
  14. package/dist/kuinetic.min.js +1 -1
  15. package/dist/kuinetic.notes.js +1 -0
  16. package/dist/types/3d/flattening.d.ts +8 -7
  17. package/dist/types/core/deck-viewer.d.ts +87 -0
  18. package/dist/types/core/describe.d.ts +174 -0
  19. package/dist/types/core/gesture.d.ts +10 -0
  20. package/dist/types/core/index.d.ts +6 -2
  21. package/dist/types/core/target.d.ts +28 -0
  22. package/dist/types/core/timing-contract.d.ts +61 -0
  23. package/dist/types/core/types.d.ts +59 -0
  24. package/dist/types/effects/auto-motion.d.ts +169 -0
  25. package/dist/types/effects/carousel/deck.d.ts +170 -0
  26. package/dist/types/effects/carousel/drag.d.ts +6 -0
  27. package/dist/types/effects/carousel/fit.d.ts +130 -0
  28. package/dist/types/effects/carousel/index.d.ts +6 -23
  29. package/dist/types/effects/carousel/stack.d.ts +77 -0
  30. package/dist/types/effects/catalog/interaction-reveal.d.ts +69 -9
  31. package/dist/types/effects/forms/primitives.d.ts +1 -2
  32. package/dist/types/effects/gestures/index.d.ts +3 -4
  33. package/dist/types/effects/shared.d.ts +3 -30
  34. package/dist/types/effects/step-index.d.ts +48 -10
  35. package/dist/types/effects/swipe-event.d.ts +75 -0
  36. package/dist/types/index.d.ts +26 -0
  37. package/dist/types/notes/catalog-core.d.ts +3 -0
  38. package/dist/types/notes/catalog.d.ts +3 -0
  39. package/dist/types/notes/index.d.ts +13 -0
  40. package/dist/types/notes/interaction-reveal.d.ts +3 -0
  41. package/dist/types/notes/interaction.d.ts +6 -0
  42. package/dist/types/notes/keys.d.ts +7 -0
  43. package/dist/types/notes/mechanics.d.ts +7 -0
  44. package/dist/types/notes/scroll-nav-forms.d.ts +6 -0
  45. package/dist/types/notes/shared.d.ts +6 -0
  46. package/dist/types/notes/showcase.d.ts +7 -0
  47. package/dist/types/notes/text.d.ts +3 -0
  48. package/dist/types/showcase/compare.d.ts +9 -0
  49. package/dist/types/showcase/index.d.ts +3 -0
  50. package/dist/types/showcase/lightbox.d.ts +23 -1
  51. package/dist/types/showcase/modal-shell.d.ts +11 -0
  52. package/package.json +7 -3
@@ -1,5 +1,7 @@
1
1
  import {
2
+ ALL_TIMING_TOKENS,
2
3
  ATTR,
4
+ BREAKPOINT_NAMES,
3
5
  KUI_EVENT,
4
6
  Registry,
5
7
  SEGMENT_HOIST_KEYS,
@@ -13,6 +15,7 @@ import {
13
15
  createRootResolver,
14
16
  createScrollScheduler,
15
17
  cssEasingValue,
18
+ decimalNumber,
16
19
  directionValue,
17
20
  emitLifecycle,
18
21
  gateMatches,
@@ -37,11 +40,13 @@ import {
37
40
  splitTopLevel,
38
41
  startKindOf,
39
42
  suggest,
43
+ timingContractOf,
40
44
  timingProperty,
41
45
  toMilliseconds,
46
+ validate,
42
47
  warnAboutActivation,
43
48
  warnAboutToggleActions
44
- } from "./chunk-K2M7O6W5.mjs";
49
+ } from "./chunk-FASAEQDR.mjs";
45
50
  import {
46
51
  createLedgerSet
47
52
  } from "./chunk-AEQGC2KM.mjs";
@@ -3442,11 +3447,206 @@ function runQuietly(cleanup) {
3442
3447
  }
3443
3448
  }
3444
3449
 
3450
+ // src/core/describe.ts
3451
+ var POSITIONAL = [
3452
+ { slot: "duration", accepts: "time" },
3453
+ { slot: "delay", accepts: "time" },
3454
+ { slot: "ease", accepts: "easing" }
3455
+ ];
3456
+ function describeEffect(registry, name, notes = {}) {
3457
+ const resolved = registry.resolve(name);
3458
+ if (!resolved) return void 0;
3459
+ const { preset, primitive } = resolved;
3460
+ const declared = primitive.parameters;
3461
+ const contract = timingContractOf(primitive);
3462
+ const honours = contract ? contract.honours ?? [] : ALL_TIMING_TOKENS;
3463
+ const positionalOrder = POSITIONAL.map((slot) => ({
3464
+ ...slot,
3465
+ ...Object.hasOwn(declared, slot.slot) ? { param: slot.slot } : {},
3466
+ honoured: honours.includes(slot.slot)
3467
+ }));
3468
+ const params = Object.entries(declared).map(([param, spec]) => {
3469
+ const override = preset.params?.[param];
3470
+ const note = findNote(spec.note, notes, [preset.name, primitive.id, "*"], param);
3471
+ return {
3472
+ name: param,
3473
+ type: spec.type,
3474
+ default: override ?? spec.default,
3475
+ presetDefault: override !== void 0,
3476
+ required: note?.required === true,
3477
+ spellings: spellingsFor(spec, override ?? spec.default),
3478
+ ...optionalFields(spec, param, note)
3479
+ };
3480
+ });
3481
+ const described = {
3482
+ name: preset.name,
3483
+ primitive: primitive.id,
3484
+ renderer: primitive.renderer,
3485
+ params,
3486
+ positionalOrder
3487
+ };
3488
+ if (contract && honours.length < ALL_TIMING_TOKENS.length) described.unhonouredBecause = contract.because;
3489
+ return described;
3490
+ }
3491
+ function optionalFields(spec, param, note) {
3492
+ const out = {};
3493
+ if (spec.keywords) out.keywords = spec.keywords;
3494
+ if (spec.minimum !== void 0) out.minimum = spec.minimum;
3495
+ if (spec.maximum !== void 0) out.maximum = spec.maximum;
3496
+ if (spec.integer) out.integer = true;
3497
+ const index = POSITIONAL.findIndex((slot) => slot.slot === param);
3498
+ if (index >= 0) out.positionalIndex = index;
3499
+ if (note) out.note = note.why;
3500
+ if (note?.whenOmitted) out.whenOmitted = note.whenOmitted;
3501
+ return out;
3502
+ }
3503
+ function describeAttribute(registry, value, notes = {}) {
3504
+ return describeSpecs(registry, parse(value).specs, notes);
3505
+ }
3506
+ function describeElementAttribute(registry, value, notes = {}) {
3507
+ const parsed = parse(value);
3508
+ const written = {};
3509
+ for (const [field, key] of Object.entries(ELEMENT_KEYS)) {
3510
+ const set = parsed[field];
3511
+ if (set !== void 0) written[key.key] = set;
3512
+ }
3513
+ return { steps: describeSpecs(registry, parsed.specs, notes), keys: describeKeys(notes), written };
3514
+ }
3515
+ function describeKeys(notes = {}) {
3516
+ const element = Object.values(ELEMENT_KEYS).map((key) => keyRow(key, "element", notes));
3517
+ return [...element, ...STEP_KEY_LIST.map((key) => keyRow(key, "step", notes))];
3518
+ }
3519
+ function describeSpecs(registry, specs, notes) {
3520
+ return specs.map((spec) => {
3521
+ const written = { written: writtenArgs(spec), writtenKeys: writtenStepKeys(spec) };
3522
+ const described = describeEffect(registry, spec.name, notes);
3523
+ if (described) return { ...described, ...written };
3524
+ const suggestion = suggest(spec.name, registry.names());
3525
+ const unknown = suggestion ? { name: spec.name, unknown: true, suggestion } : { name: spec.name, unknown: true };
3526
+ return { ...unknown, ...written };
3527
+ });
3528
+ }
3529
+ function writtenArgs(spec) {
3530
+ const written = { ...spec.params };
3531
+ if (spec.duration !== void 0) written.duration = spec.duration;
3532
+ if (spec.delay !== void 0) written.delay = spec.delay;
3533
+ if (spec.easing !== void 0) written.ease = spec.easing;
3534
+ return written;
3535
+ }
3536
+ function writtenStepKeys(spec) {
3537
+ const written = {};
3538
+ if (spec.at !== void 0) written.at = spec.at;
3539
+ Object.assign(written, spec.gate);
3540
+ if (spec.repeat !== void 0) written.repeat = spec.repeat;
3541
+ if (spec.yoyo !== void 0) written.yoyo = String(spec.yoyo);
3542
+ for (const [field, value] of Object.entries(spec.hoists ?? {})) {
3543
+ written[ELEMENT_KEYS[field].key] = value;
3544
+ }
3545
+ return written;
3546
+ }
3547
+ var KEY_NOTE_OWNER = "data-kui";
3548
+ function keyRow(key, scope, notes) {
3549
+ const note = findNote(void 0, notes, [KEY_NOTE_OWNER], key.key);
3550
+ const row = {
3551
+ name: key.key,
3552
+ type: key.type,
3553
+ default: key.default,
3554
+ presetDefault: false,
3555
+ required: false,
3556
+ spellings: [...key.spellings],
3557
+ scope
3558
+ };
3559
+ if (key.keywords) row.keywords = key.keywords;
3560
+ if (note) row.note = note.why;
3561
+ if (note?.whenOmitted) row.whenOmitted = note.whenOmitted;
3562
+ return row;
3563
+ }
3564
+ var TIMELINES2 = Object.keys({ time: 0, view: 0, scroll: 0, pointer: 0, pin: 0 });
3565
+ var RM_POLICIES = Object.keys({ shorten: 0, crossfade: 0, disable: 0 });
3566
+ var ELEMENT_KEYS = {
3567
+ activation: { key: "on", type: "text", default: "", spellings: ["enter", "load", "hover", "click", "hover/unhover"] },
3568
+ actions: { key: "actions", type: "text", default: "", spellings: ["play/pause/resume/reset", "play/none/none/reset"] },
3569
+ timeline: { key: "timeline", type: "keyword", default: "", spellings: TIMELINES2, keywords: TIMELINES2 },
3570
+ threshold: { key: "threshold", type: "percentage", default: "", spellings: ["0%", "25%"] },
3571
+ cascade: { key: "cascade", type: "time", default: "", spellings: ["90ms", "0.09s"] },
3572
+ spread: { key: "spread", type: "time", default: "", spellings: ["600ms", "0.6s"] },
3573
+ order: { key: "order", type: "text", default: "", spellings: ["start", "end", "center", "edges", "random", "3"] },
3574
+ cols: { key: "cols", type: "text", default: "", spellings: ["auto", "4"] },
3575
+ along: { key: "along", type: "keyword", default: "", spellings: ["x", "y"], keywords: ["x", "y"] },
3576
+ rm: { key: "rm", type: "keyword", default: "", spellings: RM_POLICIES, keywords: RM_POLICIES },
3577
+ func: { key: "func", type: "text", default: "", spellings: ["onRevealDone"] }
3578
+ };
3579
+ var gateKey = (key) => ({
3580
+ key,
3581
+ type: "keyword",
3582
+ default: "",
3583
+ spellings: BREAKPOINT_NAMES,
3584
+ keywords: BREAKPOINT_NAMES
3585
+ });
3586
+ var STEP_KEYS = {
3587
+ at: { key: "at", type: "text", default: "", spellings: ["after", "with", "-200ms", "with+100ms"] },
3588
+ gate: { above: gateKey("above"), below: gateKey("below"), wide: gateKey("wide"), narrow: gateKey("narrow") },
3589
+ repeat: { key: "repeat", type: "text", default: "", spellings: ["infinite", "3"] },
3590
+ yoyo: { key: "yoyo", type: "keyword", default: "", spellings: ["true", "false"], keywords: ["true", "false"] }
3591
+ };
3592
+ var STEP_KEY_LIST = Object.values(STEP_KEYS).flatMap(
3593
+ (entry) => "key" in entry ? [entry] : Object.values(entry)
3594
+ );
3595
+ function findNote(inline, notes, owners, param) {
3596
+ const key = owners.map((owner) => `${owner}.${param}`).find((k) => Object.hasOwn(notes, k));
3597
+ const note = inline ?? (key === void 0 ? void 0 : notes[key]);
3598
+ if (note === void 0) return void 0;
3599
+ return typeof note === "string" ? { why: note } : note;
3600
+ }
3601
+ var NUMBER = /^-?(?:\d+(?:\.\d+)?|\.\d+)/;
3602
+ function spellingsFor(spec, fallback = spec.default) {
3603
+ const value = validate(fallback, spec).ok ? fallback.trim() : "";
3604
+ return EXAMPLES[spec.type](value, spec.keywords ?? []);
3605
+ }
3606
+ var EXAMPLES = {
3607
+ angle: (value) => angleForms(value),
3608
+ "angle|keyword": (value, keywords) => [...angleForms(keywords.includes(value) ? "" : value), ...keywords],
3609
+ keyword: (_, keywords) => [...keywords],
3610
+ time: timeForms,
3611
+ number: (value) => [value || "1"],
3612
+ percentage: (value) => [value || "50%"],
3613
+ "number|percentage": alphaForms,
3614
+ length: (value) => [value || "24px", "calc(1rem + 4px)"],
3615
+ "length|percentage": (value) => [value || "24px", "50%"],
3616
+ color: (value) => [value || "#e4f222", "rgb(228 242 34)", "currentcolor"],
3617
+ easing: (value) => [value || "ease-out", "linear", "cubic-bezier(.2, .8, .2, 1)", "spring"],
3618
+ path: () => ["M0,0L100,0"],
3619
+ text: () => []
3620
+ };
3621
+ function angleForms(value) {
3622
+ const n = NUMBER.exec(value)?.[0];
3623
+ const degrees = value.endsWith("deg") || /^-?[\d.]+d?$/.test(value);
3624
+ const base = degrees && n ? n : "45";
3625
+ const forms = [base, `${base}d`, `${base}deg`];
3626
+ return degrees || !value ? forms : [value, ...forms];
3627
+ }
3628
+ function timeForms(value) {
3629
+ const n = NUMBER.exec(value)?.[0];
3630
+ if (!n) return ["600ms", "0.6s"];
3631
+ return value.endsWith("ms") ? [value, `${decimalNumber(n, -3)}s`] : [value, `${decimalNumber(n, 3)}ms`];
3632
+ }
3633
+ function alphaForms(value) {
3634
+ const n = NUMBER.exec(value)?.[0];
3635
+ if (!n) return ["0.5", "50%"];
3636
+ return value.endsWith("%") ? [`${decimalNumber(n, -2)}`, value] : [value, `${decimalNumber(n, 2)}%`];
3637
+ }
3638
+
3445
3639
  export {
3446
3640
  detect,
3447
3641
  consoleReporter,
3448
3642
  silentReporter,
3449
3643
  collectingReporter,
3450
3644
  Animator,
3451
- createAnimator
3645
+ createAnimator,
3646
+ describeEffect,
3647
+ describeAttribute,
3648
+ describeElementAttribute,
3649
+ describeKeys,
3650
+ KEY_NOTE_OWNER,
3651
+ spellingsFor
3452
3652
  };
@@ -1,41 +1,59 @@
1
1
  import {
2
2
  Animator,
3
+ KEY_NOTE_OWNER,
3
4
  collectingReporter,
4
5
  consoleReporter,
5
6
  createAnimator,
7
+ describeAttribute,
8
+ describeEffect,
9
+ describeElementAttribute,
10
+ describeKeys,
6
11
  detect,
7
- silentReporter
8
- } from "../chunk-BBQ22D7A.mjs";
12
+ silentReporter,
13
+ spellingsFor
14
+ } from "../chunk-MZQG2VMG.mjs";
9
15
  import {
10
16
  ATTR,
11
17
  CHANNEL,
12
18
  KUI_EVENT,
13
19
  Registry,
20
+ SUBTREE_CHANNEL,
21
+ attributeChannel,
14
22
  control,
15
23
  createActivationBinder,
16
24
  inertInstance,
17
25
  play,
18
26
  resolveActivationSpec,
19
27
  resolveTargets,
28
+ timingContractOf,
20
29
  toAttributeValue
21
- } from "../chunk-K2M7O6W5.mjs";
30
+ } from "../chunk-FASAEQDR.mjs";
22
31
  import "../chunk-AEQGC2KM.mjs";
23
32
  export {
24
33
  ATTR,
25
34
  Animator,
26
35
  CHANNEL,
36
+ KEY_NOTE_OWNER,
27
37
  KUI_EVENT,
28
38
  Registry,
39
+ SUBTREE_CHANNEL,
40
+ attributeChannel,
29
41
  collectingReporter,
30
42
  consoleReporter,
31
43
  control,
32
44
  createActivationBinder,
33
45
  createAnimator,
46
+ describeAttribute,
47
+ describeEffect,
48
+ describeElementAttribute,
49
+ describeKeys,
34
50
  detect,
35
51
  inertInstance,
36
52
  play,
37
53
  resolveActivationSpec,
38
54
  resolveTargets,
39
55
  silentReporter,
56
+ spellingsFor,
57
+ timingContractOf,
40
58
  toAttributeValue
41
59
  };
@@ -17,8 +17,8 @@ import {
17
17
  registerThreeD,
18
18
  registerTween,
19
19
  registerViewTransitions
20
- } from "../chunk-XDDJVANU.mjs";
21
- import "../chunk-K2M7O6W5.mjs";
20
+ } from "../chunk-FYMZW5N2.mjs";
21
+ import "../chunk-FASAEQDR.mjs";
22
22
  import "../chunk-AEQGC2KM.mjs";
23
23
  export {
24
24
  COMBOS,
@@ -1,30 +1,39 @@
1
1
  import {
2
2
  Animator,
3
+ KEY_NOTE_OWNER,
3
4
  collectingReporter,
4
5
  consoleReporter,
5
6
  createAnimator,
7
+ describeAttribute,
8
+ describeEffect,
9
+ describeElementAttribute,
10
+ describeKeys,
6
11
  detect,
7
- silentReporter
8
- } from "./chunk-BBQ22D7A.mjs";
12
+ silentReporter,
13
+ spellingsFor
14
+ } from "./chunk-MZQG2VMG.mjs";
9
15
  import {
10
16
  COMBOS,
11
17
  PRESETS,
12
18
  PRIMITIVES,
13
19
  createRegistry
14
- } from "./chunk-XDDJVANU.mjs";
20
+ } from "./chunk-FYMZW5N2.mjs";
15
21
  import {
16
22
  ATTR,
17
23
  CHANNEL,
18
24
  KUI_EVENT,
19
25
  Registry,
26
+ SUBTREE_CHANNEL,
27
+ attributeChannel,
20
28
  control,
21
29
  createActivationBinder,
22
30
  inertInstance,
23
31
  play,
24
32
  resolveActivationSpec,
25
33
  resolveTargets,
34
+ timingContractOf,
26
35
  toAttributeValue
27
- } from "./chunk-K2M7O6W5.mjs";
36
+ } from "./chunk-FASAEQDR.mjs";
28
37
  import "./chunk-AEQGC2KM.mjs";
29
38
 
30
39
  // src/index.ts
@@ -32,15 +41,28 @@ function kuinetic(options = {}) {
32
41
  return new Animator({ registry: createRegistry(), ...options });
33
42
  }
34
43
  var src_default = kuinetic;
44
+ var catalog;
45
+ function describe(name, options = {}) {
46
+ return describeEffect(options.registry ?? (catalog ??= createRegistry()), name, options.notes);
47
+ }
48
+ function describeSteps(value, options = {}) {
49
+ return describeAttribute(options.registry ?? (catalog ??= createRegistry()), value, options.notes);
50
+ }
51
+ function describeElement(value, options = {}) {
52
+ return describeElementAttribute(options.registry ?? (catalog ??= createRegistry()), value, options.notes);
53
+ }
35
54
  export {
36
55
  ATTR,
37
56
  Animator,
38
57
  CHANNEL,
39
58
  COMBOS,
59
+ KEY_NOTE_OWNER,
40
60
  KUI_EVENT,
41
61
  PRESETS,
42
62
  PRIMITIVES,
43
63
  Registry,
64
+ SUBTREE_CHANNEL,
65
+ attributeChannel,
44
66
  collectingReporter,
45
67
  consoleReporter,
46
68
  control,
@@ -48,6 +70,13 @@ export {
48
70
  createAnimator,
49
71
  createRegistry,
50
72
  src_default as default,
73
+ describe,
74
+ describeAttribute,
75
+ describeEffect,
76
+ describeElement,
77
+ describeElementAttribute,
78
+ describeKeys,
79
+ describeSteps,
51
80
  detect,
52
81
  inertInstance,
53
82
  kuinetic,
@@ -55,5 +84,7 @@ export {
55
84
  resolveActivationSpec,
56
85
  resolveTargets,
57
86
  silentReporter,
87
+ spellingsFor,
88
+ timingContractOf,
58
89
  toAttributeValue
59
90
  };