hotwire-spark 0.1.7 → 0.1.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.
- checksums.yaml +4 -4
- data/app/assets/javascripts/hotwire_spark.js +4 -2132
- data/app/assets/javascripts/hotwire_spark.min.js +1 -1
- data/app/assets/javascripts/hotwire_spark.min.js.map +1 -1
- data/app/javascript/hotwire/spark/channels/consumer.js +1 -1
- data/app/javascript/hotwire/spark/reloaders/stimulus_reloader.js +1 -2
- data/lib/hotwire/spark/action_cable/server.rb +7 -0
- data/lib/hotwire/spark/engine.rb +6 -2
- data/lib/hotwire/spark/installer.rb +12 -10
- data/lib/hotwire/spark/version.rb +1 -1
- data/lib/hotwire-spark.rb +5 -1
- metadata +7 -8
- data/lib/hotwire/spark/action_cable/persistent_cable_middleware.rb +0 -43
- data/lib/hotwire/spark/action_cable/persistent_cable_server.rb +0 -25
@@ -310,7 +310,7 @@ var HotwireSpark = (function () {
|
|
310
310
|
}
|
311
311
|
};
|
312
312
|
|
313
|
-
const extend
|
313
|
+
const extend = function(object, properties) {
|
314
314
|
if (properties != null) {
|
315
315
|
for (let key in properties) {
|
316
316
|
const value = properties[key];
|
@@ -324,7 +324,7 @@ var HotwireSpark = (function () {
|
|
324
324
|
constructor(consumer, params = {}, mixin) {
|
325
325
|
this.consumer = consumer;
|
326
326
|
this.identifier = JSON.stringify(params);
|
327
|
-
extend
|
327
|
+
extend(this, mixin);
|
328
328
|
}
|
329
329
|
perform(action, data = {}) {
|
330
330
|
data.action = action;
|
@@ -512,7 +512,7 @@ var HotwireSpark = (function () {
|
|
512
512
|
}
|
513
513
|
}
|
514
514
|
|
515
|
-
var consumer = createConsumer();
|
515
|
+
var consumer = createConsumer("/hotwire-spark");
|
516
516
|
|
517
517
|
function assetNameFromPath(path) {
|
518
518
|
return path.split("/").pop().split(".")[0];
|
@@ -1395,2134 +1395,6 @@ var HotwireSpark = (function () {
|
|
1395
1395
|
}
|
1396
1396
|
}
|
1397
1397
|
|
1398
|
-
/*
|
1399
|
-
Stimulus 3.2.1
|
1400
|
-
Copyright © 2023 Basecamp, LLC
|
1401
|
-
*/
|
1402
|
-
class EventListener {
|
1403
|
-
constructor(eventTarget, eventName, eventOptions) {
|
1404
|
-
this.eventTarget = eventTarget;
|
1405
|
-
this.eventName = eventName;
|
1406
|
-
this.eventOptions = eventOptions;
|
1407
|
-
this.unorderedBindings = new Set();
|
1408
|
-
}
|
1409
|
-
connect() {
|
1410
|
-
this.eventTarget.addEventListener(this.eventName, this, this.eventOptions);
|
1411
|
-
}
|
1412
|
-
disconnect() {
|
1413
|
-
this.eventTarget.removeEventListener(this.eventName, this, this.eventOptions);
|
1414
|
-
}
|
1415
|
-
bindingConnected(binding) {
|
1416
|
-
this.unorderedBindings.add(binding);
|
1417
|
-
}
|
1418
|
-
bindingDisconnected(binding) {
|
1419
|
-
this.unorderedBindings.delete(binding);
|
1420
|
-
}
|
1421
|
-
handleEvent(event) {
|
1422
|
-
const extendedEvent = extendEvent(event);
|
1423
|
-
for (const binding of this.bindings) {
|
1424
|
-
if (extendedEvent.immediatePropagationStopped) {
|
1425
|
-
break;
|
1426
|
-
}
|
1427
|
-
else {
|
1428
|
-
binding.handleEvent(extendedEvent);
|
1429
|
-
}
|
1430
|
-
}
|
1431
|
-
}
|
1432
|
-
hasBindings() {
|
1433
|
-
return this.unorderedBindings.size > 0;
|
1434
|
-
}
|
1435
|
-
get bindings() {
|
1436
|
-
return Array.from(this.unorderedBindings).sort((left, right) => {
|
1437
|
-
const leftIndex = left.index, rightIndex = right.index;
|
1438
|
-
return leftIndex < rightIndex ? -1 : leftIndex > rightIndex ? 1 : 0;
|
1439
|
-
});
|
1440
|
-
}
|
1441
|
-
}
|
1442
|
-
function extendEvent(event) {
|
1443
|
-
if ("immediatePropagationStopped" in event) {
|
1444
|
-
return event;
|
1445
|
-
}
|
1446
|
-
else {
|
1447
|
-
const { stopImmediatePropagation } = event;
|
1448
|
-
return Object.assign(event, {
|
1449
|
-
immediatePropagationStopped: false,
|
1450
|
-
stopImmediatePropagation() {
|
1451
|
-
this.immediatePropagationStopped = true;
|
1452
|
-
stopImmediatePropagation.call(this);
|
1453
|
-
},
|
1454
|
-
});
|
1455
|
-
}
|
1456
|
-
}
|
1457
|
-
|
1458
|
-
class Dispatcher {
|
1459
|
-
constructor(application) {
|
1460
|
-
this.application = application;
|
1461
|
-
this.eventListenerMaps = new Map();
|
1462
|
-
this.started = false;
|
1463
|
-
}
|
1464
|
-
start() {
|
1465
|
-
if (!this.started) {
|
1466
|
-
this.started = true;
|
1467
|
-
this.eventListeners.forEach((eventListener) => eventListener.connect());
|
1468
|
-
}
|
1469
|
-
}
|
1470
|
-
stop() {
|
1471
|
-
if (this.started) {
|
1472
|
-
this.started = false;
|
1473
|
-
this.eventListeners.forEach((eventListener) => eventListener.disconnect());
|
1474
|
-
}
|
1475
|
-
}
|
1476
|
-
get eventListeners() {
|
1477
|
-
return Array.from(this.eventListenerMaps.values()).reduce((listeners, map) => listeners.concat(Array.from(map.values())), []);
|
1478
|
-
}
|
1479
|
-
bindingConnected(binding) {
|
1480
|
-
this.fetchEventListenerForBinding(binding).bindingConnected(binding);
|
1481
|
-
}
|
1482
|
-
bindingDisconnected(binding, clearEventListeners = false) {
|
1483
|
-
this.fetchEventListenerForBinding(binding).bindingDisconnected(binding);
|
1484
|
-
if (clearEventListeners)
|
1485
|
-
this.clearEventListenersForBinding(binding);
|
1486
|
-
}
|
1487
|
-
handleError(error, message, detail = {}) {
|
1488
|
-
this.application.handleError(error, `Error ${message}`, detail);
|
1489
|
-
}
|
1490
|
-
clearEventListenersForBinding(binding) {
|
1491
|
-
const eventListener = this.fetchEventListenerForBinding(binding);
|
1492
|
-
if (!eventListener.hasBindings()) {
|
1493
|
-
eventListener.disconnect();
|
1494
|
-
this.removeMappedEventListenerFor(binding);
|
1495
|
-
}
|
1496
|
-
}
|
1497
|
-
removeMappedEventListenerFor(binding) {
|
1498
|
-
const { eventTarget, eventName, eventOptions } = binding;
|
1499
|
-
const eventListenerMap = this.fetchEventListenerMapForEventTarget(eventTarget);
|
1500
|
-
const cacheKey = this.cacheKey(eventName, eventOptions);
|
1501
|
-
eventListenerMap.delete(cacheKey);
|
1502
|
-
if (eventListenerMap.size == 0)
|
1503
|
-
this.eventListenerMaps.delete(eventTarget);
|
1504
|
-
}
|
1505
|
-
fetchEventListenerForBinding(binding) {
|
1506
|
-
const { eventTarget, eventName, eventOptions } = binding;
|
1507
|
-
return this.fetchEventListener(eventTarget, eventName, eventOptions);
|
1508
|
-
}
|
1509
|
-
fetchEventListener(eventTarget, eventName, eventOptions) {
|
1510
|
-
const eventListenerMap = this.fetchEventListenerMapForEventTarget(eventTarget);
|
1511
|
-
const cacheKey = this.cacheKey(eventName, eventOptions);
|
1512
|
-
let eventListener = eventListenerMap.get(cacheKey);
|
1513
|
-
if (!eventListener) {
|
1514
|
-
eventListener = this.createEventListener(eventTarget, eventName, eventOptions);
|
1515
|
-
eventListenerMap.set(cacheKey, eventListener);
|
1516
|
-
}
|
1517
|
-
return eventListener;
|
1518
|
-
}
|
1519
|
-
createEventListener(eventTarget, eventName, eventOptions) {
|
1520
|
-
const eventListener = new EventListener(eventTarget, eventName, eventOptions);
|
1521
|
-
if (this.started) {
|
1522
|
-
eventListener.connect();
|
1523
|
-
}
|
1524
|
-
return eventListener;
|
1525
|
-
}
|
1526
|
-
fetchEventListenerMapForEventTarget(eventTarget) {
|
1527
|
-
let eventListenerMap = this.eventListenerMaps.get(eventTarget);
|
1528
|
-
if (!eventListenerMap) {
|
1529
|
-
eventListenerMap = new Map();
|
1530
|
-
this.eventListenerMaps.set(eventTarget, eventListenerMap);
|
1531
|
-
}
|
1532
|
-
return eventListenerMap;
|
1533
|
-
}
|
1534
|
-
cacheKey(eventName, eventOptions) {
|
1535
|
-
const parts = [eventName];
|
1536
|
-
Object.keys(eventOptions)
|
1537
|
-
.sort()
|
1538
|
-
.forEach((key) => {
|
1539
|
-
parts.push(`${eventOptions[key] ? "" : "!"}${key}`);
|
1540
|
-
});
|
1541
|
-
return parts.join(":");
|
1542
|
-
}
|
1543
|
-
}
|
1544
|
-
|
1545
|
-
const defaultActionDescriptorFilters = {
|
1546
|
-
stop({ event, value }) {
|
1547
|
-
if (value)
|
1548
|
-
event.stopPropagation();
|
1549
|
-
return true;
|
1550
|
-
},
|
1551
|
-
prevent({ event, value }) {
|
1552
|
-
if (value)
|
1553
|
-
event.preventDefault();
|
1554
|
-
return true;
|
1555
|
-
},
|
1556
|
-
self({ event, value, element }) {
|
1557
|
-
if (value) {
|
1558
|
-
return element === event.target;
|
1559
|
-
}
|
1560
|
-
else {
|
1561
|
-
return true;
|
1562
|
-
}
|
1563
|
-
},
|
1564
|
-
};
|
1565
|
-
const descriptorPattern = /^(?:(?:([^.]+?)\+)?(.+?)(?:\.(.+?))?(?:@(window|document))?->)?(.+?)(?:#([^:]+?))(?::(.+))?$/;
|
1566
|
-
function parseActionDescriptorString(descriptorString) {
|
1567
|
-
const source = descriptorString.trim();
|
1568
|
-
const matches = source.match(descriptorPattern) || [];
|
1569
|
-
let eventName = matches[2];
|
1570
|
-
let keyFilter = matches[3];
|
1571
|
-
if (keyFilter && !["keydown", "keyup", "keypress"].includes(eventName)) {
|
1572
|
-
eventName += `.${keyFilter}`;
|
1573
|
-
keyFilter = "";
|
1574
|
-
}
|
1575
|
-
return {
|
1576
|
-
eventTarget: parseEventTarget(matches[4]),
|
1577
|
-
eventName,
|
1578
|
-
eventOptions: matches[7] ? parseEventOptions(matches[7]) : {},
|
1579
|
-
identifier: matches[5],
|
1580
|
-
methodName: matches[6],
|
1581
|
-
keyFilter: matches[1] || keyFilter,
|
1582
|
-
};
|
1583
|
-
}
|
1584
|
-
function parseEventTarget(eventTargetName) {
|
1585
|
-
if (eventTargetName == "window") {
|
1586
|
-
return window;
|
1587
|
-
}
|
1588
|
-
else if (eventTargetName == "document") {
|
1589
|
-
return document;
|
1590
|
-
}
|
1591
|
-
}
|
1592
|
-
function parseEventOptions(eventOptions) {
|
1593
|
-
return eventOptions
|
1594
|
-
.split(":")
|
1595
|
-
.reduce((options, token) => Object.assign(options, { [token.replace(/^!/, "")]: !/^!/.test(token) }), {});
|
1596
|
-
}
|
1597
|
-
function stringifyEventTarget(eventTarget) {
|
1598
|
-
if (eventTarget == window) {
|
1599
|
-
return "window";
|
1600
|
-
}
|
1601
|
-
else if (eventTarget == document) {
|
1602
|
-
return "document";
|
1603
|
-
}
|
1604
|
-
}
|
1605
|
-
|
1606
|
-
function camelize(value) {
|
1607
|
-
return value.replace(/(?:[_-])([a-z0-9])/g, (_, char) => char.toUpperCase());
|
1608
|
-
}
|
1609
|
-
function namespaceCamelize(value) {
|
1610
|
-
return camelize(value.replace(/--/g, "-").replace(/__/g, "_"));
|
1611
|
-
}
|
1612
|
-
function capitalize(value) {
|
1613
|
-
return value.charAt(0).toUpperCase() + value.slice(1);
|
1614
|
-
}
|
1615
|
-
function dasherize(value) {
|
1616
|
-
return value.replace(/([A-Z])/g, (_, char) => `-${char.toLowerCase()}`);
|
1617
|
-
}
|
1618
|
-
function tokenize(value) {
|
1619
|
-
return value.match(/[^\s]+/g) || [];
|
1620
|
-
}
|
1621
|
-
function hasProperty(object, property) {
|
1622
|
-
return Object.prototype.hasOwnProperty.call(object, property);
|
1623
|
-
}
|
1624
|
-
|
1625
|
-
const allModifiers = ["meta", "ctrl", "alt", "shift"];
|
1626
|
-
class Action {
|
1627
|
-
constructor(element, index, descriptor, schema) {
|
1628
|
-
this.element = element;
|
1629
|
-
this.index = index;
|
1630
|
-
this.eventTarget = descriptor.eventTarget || element;
|
1631
|
-
this.eventName = descriptor.eventName || getDefaultEventNameForElement(element) || error("missing event name");
|
1632
|
-
this.eventOptions = descriptor.eventOptions || {};
|
1633
|
-
this.identifier = descriptor.identifier || error("missing identifier");
|
1634
|
-
this.methodName = descriptor.methodName || error("missing method name");
|
1635
|
-
this.keyFilter = descriptor.keyFilter || "";
|
1636
|
-
this.schema = schema;
|
1637
|
-
}
|
1638
|
-
static forToken(token, schema) {
|
1639
|
-
return new this(token.element, token.index, parseActionDescriptorString(token.content), schema);
|
1640
|
-
}
|
1641
|
-
toString() {
|
1642
|
-
const eventFilter = this.keyFilter ? `.${this.keyFilter}` : "";
|
1643
|
-
const eventTarget = this.eventTargetName ? `@${this.eventTargetName}` : "";
|
1644
|
-
return `${this.eventName}${eventFilter}${eventTarget}->${this.identifier}#${this.methodName}`;
|
1645
|
-
}
|
1646
|
-
shouldIgnoreKeyboardEvent(event) {
|
1647
|
-
if (!this.keyFilter) {
|
1648
|
-
return false;
|
1649
|
-
}
|
1650
|
-
const filters = this.keyFilter.split("+");
|
1651
|
-
if (this.keyFilterDissatisfied(event, filters)) {
|
1652
|
-
return true;
|
1653
|
-
}
|
1654
|
-
const standardFilter = filters.filter((key) => !allModifiers.includes(key))[0];
|
1655
|
-
if (!standardFilter) {
|
1656
|
-
return false;
|
1657
|
-
}
|
1658
|
-
if (!hasProperty(this.keyMappings, standardFilter)) {
|
1659
|
-
error(`contains unknown key filter: ${this.keyFilter}`);
|
1660
|
-
}
|
1661
|
-
return this.keyMappings[standardFilter].toLowerCase() !== event.key.toLowerCase();
|
1662
|
-
}
|
1663
|
-
shouldIgnoreMouseEvent(event) {
|
1664
|
-
if (!this.keyFilter) {
|
1665
|
-
return false;
|
1666
|
-
}
|
1667
|
-
const filters = [this.keyFilter];
|
1668
|
-
if (this.keyFilterDissatisfied(event, filters)) {
|
1669
|
-
return true;
|
1670
|
-
}
|
1671
|
-
return false;
|
1672
|
-
}
|
1673
|
-
get params() {
|
1674
|
-
const params = {};
|
1675
|
-
const pattern = new RegExp(`^data-${this.identifier}-(.+)-param$`, "i");
|
1676
|
-
for (const { name, value } of Array.from(this.element.attributes)) {
|
1677
|
-
const match = name.match(pattern);
|
1678
|
-
const key = match && match[1];
|
1679
|
-
if (key) {
|
1680
|
-
params[camelize(key)] = typecast(value);
|
1681
|
-
}
|
1682
|
-
}
|
1683
|
-
return params;
|
1684
|
-
}
|
1685
|
-
get eventTargetName() {
|
1686
|
-
return stringifyEventTarget(this.eventTarget);
|
1687
|
-
}
|
1688
|
-
get keyMappings() {
|
1689
|
-
return this.schema.keyMappings;
|
1690
|
-
}
|
1691
|
-
keyFilterDissatisfied(event, filters) {
|
1692
|
-
const [meta, ctrl, alt, shift] = allModifiers.map((modifier) => filters.includes(modifier));
|
1693
|
-
return event.metaKey !== meta || event.ctrlKey !== ctrl || event.altKey !== alt || event.shiftKey !== shift;
|
1694
|
-
}
|
1695
|
-
}
|
1696
|
-
const defaultEventNames = {
|
1697
|
-
a: () => "click",
|
1698
|
-
button: () => "click",
|
1699
|
-
form: () => "submit",
|
1700
|
-
details: () => "toggle",
|
1701
|
-
input: (e) => (e.getAttribute("type") == "submit" ? "click" : "input"),
|
1702
|
-
select: () => "change",
|
1703
|
-
textarea: () => "input",
|
1704
|
-
};
|
1705
|
-
function getDefaultEventNameForElement(element) {
|
1706
|
-
const tagName = element.tagName.toLowerCase();
|
1707
|
-
if (tagName in defaultEventNames) {
|
1708
|
-
return defaultEventNames[tagName](element);
|
1709
|
-
}
|
1710
|
-
}
|
1711
|
-
function error(message) {
|
1712
|
-
throw new Error(message);
|
1713
|
-
}
|
1714
|
-
function typecast(value) {
|
1715
|
-
try {
|
1716
|
-
return JSON.parse(value);
|
1717
|
-
}
|
1718
|
-
catch (o_O) {
|
1719
|
-
return value;
|
1720
|
-
}
|
1721
|
-
}
|
1722
|
-
|
1723
|
-
class Binding {
|
1724
|
-
constructor(context, action) {
|
1725
|
-
this.context = context;
|
1726
|
-
this.action = action;
|
1727
|
-
}
|
1728
|
-
get index() {
|
1729
|
-
return this.action.index;
|
1730
|
-
}
|
1731
|
-
get eventTarget() {
|
1732
|
-
return this.action.eventTarget;
|
1733
|
-
}
|
1734
|
-
get eventOptions() {
|
1735
|
-
return this.action.eventOptions;
|
1736
|
-
}
|
1737
|
-
get identifier() {
|
1738
|
-
return this.context.identifier;
|
1739
|
-
}
|
1740
|
-
handleEvent(event) {
|
1741
|
-
const actionEvent = this.prepareActionEvent(event);
|
1742
|
-
if (this.willBeInvokedByEvent(event) && this.applyEventModifiers(actionEvent)) {
|
1743
|
-
this.invokeWithEvent(actionEvent);
|
1744
|
-
}
|
1745
|
-
}
|
1746
|
-
get eventName() {
|
1747
|
-
return this.action.eventName;
|
1748
|
-
}
|
1749
|
-
get method() {
|
1750
|
-
const method = this.controller[this.methodName];
|
1751
|
-
if (typeof method == "function") {
|
1752
|
-
return method;
|
1753
|
-
}
|
1754
|
-
throw new Error(`Action "${this.action}" references undefined method "${this.methodName}"`);
|
1755
|
-
}
|
1756
|
-
applyEventModifiers(event) {
|
1757
|
-
const { element } = this.action;
|
1758
|
-
const { actionDescriptorFilters } = this.context.application;
|
1759
|
-
const { controller } = this.context;
|
1760
|
-
let passes = true;
|
1761
|
-
for (const [name, value] of Object.entries(this.eventOptions)) {
|
1762
|
-
if (name in actionDescriptorFilters) {
|
1763
|
-
const filter = actionDescriptorFilters[name];
|
1764
|
-
passes = passes && filter({ name, value, event, element, controller });
|
1765
|
-
}
|
1766
|
-
else {
|
1767
|
-
continue;
|
1768
|
-
}
|
1769
|
-
}
|
1770
|
-
return passes;
|
1771
|
-
}
|
1772
|
-
prepareActionEvent(event) {
|
1773
|
-
return Object.assign(event, { params: this.action.params });
|
1774
|
-
}
|
1775
|
-
invokeWithEvent(event) {
|
1776
|
-
const { target, currentTarget } = event;
|
1777
|
-
try {
|
1778
|
-
this.method.call(this.controller, event);
|
1779
|
-
this.context.logDebugActivity(this.methodName, { event, target, currentTarget, action: this.methodName });
|
1780
|
-
}
|
1781
|
-
catch (error) {
|
1782
|
-
const { identifier, controller, element, index } = this;
|
1783
|
-
const detail = { identifier, controller, element, index, event };
|
1784
|
-
this.context.handleError(error, `invoking action "${this.action}"`, detail);
|
1785
|
-
}
|
1786
|
-
}
|
1787
|
-
willBeInvokedByEvent(event) {
|
1788
|
-
const eventTarget = event.target;
|
1789
|
-
if (event instanceof KeyboardEvent && this.action.shouldIgnoreKeyboardEvent(event)) {
|
1790
|
-
return false;
|
1791
|
-
}
|
1792
|
-
if (event instanceof MouseEvent && this.action.shouldIgnoreMouseEvent(event)) {
|
1793
|
-
return false;
|
1794
|
-
}
|
1795
|
-
if (this.element === eventTarget) {
|
1796
|
-
return true;
|
1797
|
-
}
|
1798
|
-
else if (eventTarget instanceof Element && this.element.contains(eventTarget)) {
|
1799
|
-
return this.scope.containsElement(eventTarget);
|
1800
|
-
}
|
1801
|
-
else {
|
1802
|
-
return this.scope.containsElement(this.action.element);
|
1803
|
-
}
|
1804
|
-
}
|
1805
|
-
get controller() {
|
1806
|
-
return this.context.controller;
|
1807
|
-
}
|
1808
|
-
get methodName() {
|
1809
|
-
return this.action.methodName;
|
1810
|
-
}
|
1811
|
-
get element() {
|
1812
|
-
return this.scope.element;
|
1813
|
-
}
|
1814
|
-
get scope() {
|
1815
|
-
return this.context.scope;
|
1816
|
-
}
|
1817
|
-
}
|
1818
|
-
|
1819
|
-
class ElementObserver {
|
1820
|
-
constructor(element, delegate) {
|
1821
|
-
this.mutationObserverInit = { attributes: true, childList: true, subtree: true };
|
1822
|
-
this.element = element;
|
1823
|
-
this.started = false;
|
1824
|
-
this.delegate = delegate;
|
1825
|
-
this.elements = new Set();
|
1826
|
-
this.mutationObserver = new MutationObserver((mutations) => this.processMutations(mutations));
|
1827
|
-
}
|
1828
|
-
start() {
|
1829
|
-
if (!this.started) {
|
1830
|
-
this.started = true;
|
1831
|
-
this.mutationObserver.observe(this.element, this.mutationObserverInit);
|
1832
|
-
this.refresh();
|
1833
|
-
}
|
1834
|
-
}
|
1835
|
-
pause(callback) {
|
1836
|
-
if (this.started) {
|
1837
|
-
this.mutationObserver.disconnect();
|
1838
|
-
this.started = false;
|
1839
|
-
}
|
1840
|
-
callback();
|
1841
|
-
if (!this.started) {
|
1842
|
-
this.mutationObserver.observe(this.element, this.mutationObserverInit);
|
1843
|
-
this.started = true;
|
1844
|
-
}
|
1845
|
-
}
|
1846
|
-
stop() {
|
1847
|
-
if (this.started) {
|
1848
|
-
this.mutationObserver.takeRecords();
|
1849
|
-
this.mutationObserver.disconnect();
|
1850
|
-
this.started = false;
|
1851
|
-
}
|
1852
|
-
}
|
1853
|
-
refresh() {
|
1854
|
-
if (this.started) {
|
1855
|
-
const matches = new Set(this.matchElementsInTree());
|
1856
|
-
for (const element of Array.from(this.elements)) {
|
1857
|
-
if (!matches.has(element)) {
|
1858
|
-
this.removeElement(element);
|
1859
|
-
}
|
1860
|
-
}
|
1861
|
-
for (const element of Array.from(matches)) {
|
1862
|
-
this.addElement(element);
|
1863
|
-
}
|
1864
|
-
}
|
1865
|
-
}
|
1866
|
-
processMutations(mutations) {
|
1867
|
-
if (this.started) {
|
1868
|
-
for (const mutation of mutations) {
|
1869
|
-
this.processMutation(mutation);
|
1870
|
-
}
|
1871
|
-
}
|
1872
|
-
}
|
1873
|
-
processMutation(mutation) {
|
1874
|
-
if (mutation.type == "attributes") {
|
1875
|
-
this.processAttributeChange(mutation.target, mutation.attributeName);
|
1876
|
-
}
|
1877
|
-
else if (mutation.type == "childList") {
|
1878
|
-
this.processRemovedNodes(mutation.removedNodes);
|
1879
|
-
this.processAddedNodes(mutation.addedNodes);
|
1880
|
-
}
|
1881
|
-
}
|
1882
|
-
processAttributeChange(element, attributeName) {
|
1883
|
-
if (this.elements.has(element)) {
|
1884
|
-
if (this.delegate.elementAttributeChanged && this.matchElement(element)) {
|
1885
|
-
this.delegate.elementAttributeChanged(element, attributeName);
|
1886
|
-
}
|
1887
|
-
else {
|
1888
|
-
this.removeElement(element);
|
1889
|
-
}
|
1890
|
-
}
|
1891
|
-
else if (this.matchElement(element)) {
|
1892
|
-
this.addElement(element);
|
1893
|
-
}
|
1894
|
-
}
|
1895
|
-
processRemovedNodes(nodes) {
|
1896
|
-
for (const node of Array.from(nodes)) {
|
1897
|
-
const element = this.elementFromNode(node);
|
1898
|
-
if (element) {
|
1899
|
-
this.processTree(element, this.removeElement);
|
1900
|
-
}
|
1901
|
-
}
|
1902
|
-
}
|
1903
|
-
processAddedNodes(nodes) {
|
1904
|
-
for (const node of Array.from(nodes)) {
|
1905
|
-
const element = this.elementFromNode(node);
|
1906
|
-
if (element && this.elementIsActive(element)) {
|
1907
|
-
this.processTree(element, this.addElement);
|
1908
|
-
}
|
1909
|
-
}
|
1910
|
-
}
|
1911
|
-
matchElement(element) {
|
1912
|
-
return this.delegate.matchElement(element);
|
1913
|
-
}
|
1914
|
-
matchElementsInTree(tree = this.element) {
|
1915
|
-
return this.delegate.matchElementsInTree(tree);
|
1916
|
-
}
|
1917
|
-
processTree(tree, processor) {
|
1918
|
-
for (const element of this.matchElementsInTree(tree)) {
|
1919
|
-
processor.call(this, element);
|
1920
|
-
}
|
1921
|
-
}
|
1922
|
-
elementFromNode(node) {
|
1923
|
-
if (node.nodeType == Node.ELEMENT_NODE) {
|
1924
|
-
return node;
|
1925
|
-
}
|
1926
|
-
}
|
1927
|
-
elementIsActive(element) {
|
1928
|
-
if (element.isConnected != this.element.isConnected) {
|
1929
|
-
return false;
|
1930
|
-
}
|
1931
|
-
else {
|
1932
|
-
return this.element.contains(element);
|
1933
|
-
}
|
1934
|
-
}
|
1935
|
-
addElement(element) {
|
1936
|
-
if (!this.elements.has(element)) {
|
1937
|
-
if (this.elementIsActive(element)) {
|
1938
|
-
this.elements.add(element);
|
1939
|
-
if (this.delegate.elementMatched) {
|
1940
|
-
this.delegate.elementMatched(element);
|
1941
|
-
}
|
1942
|
-
}
|
1943
|
-
}
|
1944
|
-
}
|
1945
|
-
removeElement(element) {
|
1946
|
-
if (this.elements.has(element)) {
|
1947
|
-
this.elements.delete(element);
|
1948
|
-
if (this.delegate.elementUnmatched) {
|
1949
|
-
this.delegate.elementUnmatched(element);
|
1950
|
-
}
|
1951
|
-
}
|
1952
|
-
}
|
1953
|
-
}
|
1954
|
-
|
1955
|
-
class AttributeObserver {
|
1956
|
-
constructor(element, attributeName, delegate) {
|
1957
|
-
this.attributeName = attributeName;
|
1958
|
-
this.delegate = delegate;
|
1959
|
-
this.elementObserver = new ElementObserver(element, this);
|
1960
|
-
}
|
1961
|
-
get element() {
|
1962
|
-
return this.elementObserver.element;
|
1963
|
-
}
|
1964
|
-
get selector() {
|
1965
|
-
return `[${this.attributeName}]`;
|
1966
|
-
}
|
1967
|
-
start() {
|
1968
|
-
this.elementObserver.start();
|
1969
|
-
}
|
1970
|
-
pause(callback) {
|
1971
|
-
this.elementObserver.pause(callback);
|
1972
|
-
}
|
1973
|
-
stop() {
|
1974
|
-
this.elementObserver.stop();
|
1975
|
-
}
|
1976
|
-
refresh() {
|
1977
|
-
this.elementObserver.refresh();
|
1978
|
-
}
|
1979
|
-
get started() {
|
1980
|
-
return this.elementObserver.started;
|
1981
|
-
}
|
1982
|
-
matchElement(element) {
|
1983
|
-
return element.hasAttribute(this.attributeName);
|
1984
|
-
}
|
1985
|
-
matchElementsInTree(tree) {
|
1986
|
-
const match = this.matchElement(tree) ? [tree] : [];
|
1987
|
-
const matches = Array.from(tree.querySelectorAll(this.selector));
|
1988
|
-
return match.concat(matches);
|
1989
|
-
}
|
1990
|
-
elementMatched(element) {
|
1991
|
-
if (this.delegate.elementMatchedAttribute) {
|
1992
|
-
this.delegate.elementMatchedAttribute(element, this.attributeName);
|
1993
|
-
}
|
1994
|
-
}
|
1995
|
-
elementUnmatched(element) {
|
1996
|
-
if (this.delegate.elementUnmatchedAttribute) {
|
1997
|
-
this.delegate.elementUnmatchedAttribute(element, this.attributeName);
|
1998
|
-
}
|
1999
|
-
}
|
2000
|
-
elementAttributeChanged(element, attributeName) {
|
2001
|
-
if (this.delegate.elementAttributeValueChanged && this.attributeName == attributeName) {
|
2002
|
-
this.delegate.elementAttributeValueChanged(element, attributeName);
|
2003
|
-
}
|
2004
|
-
}
|
2005
|
-
}
|
2006
|
-
|
2007
|
-
function add(map, key, value) {
|
2008
|
-
fetch$1(map, key).add(value);
|
2009
|
-
}
|
2010
|
-
function del(map, key, value) {
|
2011
|
-
fetch$1(map, key).delete(value);
|
2012
|
-
prune(map, key);
|
2013
|
-
}
|
2014
|
-
function fetch$1(map, key) {
|
2015
|
-
let values = map.get(key);
|
2016
|
-
if (!values) {
|
2017
|
-
values = new Set();
|
2018
|
-
map.set(key, values);
|
2019
|
-
}
|
2020
|
-
return values;
|
2021
|
-
}
|
2022
|
-
function prune(map, key) {
|
2023
|
-
const values = map.get(key);
|
2024
|
-
if (values != null && values.size == 0) {
|
2025
|
-
map.delete(key);
|
2026
|
-
}
|
2027
|
-
}
|
2028
|
-
|
2029
|
-
class Multimap {
|
2030
|
-
constructor() {
|
2031
|
-
this.valuesByKey = new Map();
|
2032
|
-
}
|
2033
|
-
get keys() {
|
2034
|
-
return Array.from(this.valuesByKey.keys());
|
2035
|
-
}
|
2036
|
-
get values() {
|
2037
|
-
const sets = Array.from(this.valuesByKey.values());
|
2038
|
-
return sets.reduce((values, set) => values.concat(Array.from(set)), []);
|
2039
|
-
}
|
2040
|
-
get size() {
|
2041
|
-
const sets = Array.from(this.valuesByKey.values());
|
2042
|
-
return sets.reduce((size, set) => size + set.size, 0);
|
2043
|
-
}
|
2044
|
-
add(key, value) {
|
2045
|
-
add(this.valuesByKey, key, value);
|
2046
|
-
}
|
2047
|
-
delete(key, value) {
|
2048
|
-
del(this.valuesByKey, key, value);
|
2049
|
-
}
|
2050
|
-
has(key, value) {
|
2051
|
-
const values = this.valuesByKey.get(key);
|
2052
|
-
return values != null && values.has(value);
|
2053
|
-
}
|
2054
|
-
hasKey(key) {
|
2055
|
-
return this.valuesByKey.has(key);
|
2056
|
-
}
|
2057
|
-
hasValue(value) {
|
2058
|
-
const sets = Array.from(this.valuesByKey.values());
|
2059
|
-
return sets.some((set) => set.has(value));
|
2060
|
-
}
|
2061
|
-
getValuesForKey(key) {
|
2062
|
-
const values = this.valuesByKey.get(key);
|
2063
|
-
return values ? Array.from(values) : [];
|
2064
|
-
}
|
2065
|
-
getKeysForValue(value) {
|
2066
|
-
return Array.from(this.valuesByKey)
|
2067
|
-
.filter(([_key, values]) => values.has(value))
|
2068
|
-
.map(([key, _values]) => key);
|
2069
|
-
}
|
2070
|
-
}
|
2071
|
-
|
2072
|
-
class SelectorObserver {
|
2073
|
-
constructor(element, selector, delegate, details) {
|
2074
|
-
this._selector = selector;
|
2075
|
-
this.details = details;
|
2076
|
-
this.elementObserver = new ElementObserver(element, this);
|
2077
|
-
this.delegate = delegate;
|
2078
|
-
this.matchesByElement = new Multimap();
|
2079
|
-
}
|
2080
|
-
get started() {
|
2081
|
-
return this.elementObserver.started;
|
2082
|
-
}
|
2083
|
-
get selector() {
|
2084
|
-
return this._selector;
|
2085
|
-
}
|
2086
|
-
set selector(selector) {
|
2087
|
-
this._selector = selector;
|
2088
|
-
this.refresh();
|
2089
|
-
}
|
2090
|
-
start() {
|
2091
|
-
this.elementObserver.start();
|
2092
|
-
}
|
2093
|
-
pause(callback) {
|
2094
|
-
this.elementObserver.pause(callback);
|
2095
|
-
}
|
2096
|
-
stop() {
|
2097
|
-
this.elementObserver.stop();
|
2098
|
-
}
|
2099
|
-
refresh() {
|
2100
|
-
this.elementObserver.refresh();
|
2101
|
-
}
|
2102
|
-
get element() {
|
2103
|
-
return this.elementObserver.element;
|
2104
|
-
}
|
2105
|
-
matchElement(element) {
|
2106
|
-
const { selector } = this;
|
2107
|
-
if (selector) {
|
2108
|
-
const matches = element.matches(selector);
|
2109
|
-
if (this.delegate.selectorMatchElement) {
|
2110
|
-
return matches && this.delegate.selectorMatchElement(element, this.details);
|
2111
|
-
}
|
2112
|
-
return matches;
|
2113
|
-
}
|
2114
|
-
else {
|
2115
|
-
return false;
|
2116
|
-
}
|
2117
|
-
}
|
2118
|
-
matchElementsInTree(tree) {
|
2119
|
-
const { selector } = this;
|
2120
|
-
if (selector) {
|
2121
|
-
const match = this.matchElement(tree) ? [tree] : [];
|
2122
|
-
const matches = Array.from(tree.querySelectorAll(selector)).filter((match) => this.matchElement(match));
|
2123
|
-
return match.concat(matches);
|
2124
|
-
}
|
2125
|
-
else {
|
2126
|
-
return [];
|
2127
|
-
}
|
2128
|
-
}
|
2129
|
-
elementMatched(element) {
|
2130
|
-
const { selector } = this;
|
2131
|
-
if (selector) {
|
2132
|
-
this.selectorMatched(element, selector);
|
2133
|
-
}
|
2134
|
-
}
|
2135
|
-
elementUnmatched(element) {
|
2136
|
-
const selectors = this.matchesByElement.getKeysForValue(element);
|
2137
|
-
for (const selector of selectors) {
|
2138
|
-
this.selectorUnmatched(element, selector);
|
2139
|
-
}
|
2140
|
-
}
|
2141
|
-
elementAttributeChanged(element, _attributeName) {
|
2142
|
-
const { selector } = this;
|
2143
|
-
if (selector) {
|
2144
|
-
const matches = this.matchElement(element);
|
2145
|
-
const matchedBefore = this.matchesByElement.has(selector, element);
|
2146
|
-
if (matches && !matchedBefore) {
|
2147
|
-
this.selectorMatched(element, selector);
|
2148
|
-
}
|
2149
|
-
else if (!matches && matchedBefore) {
|
2150
|
-
this.selectorUnmatched(element, selector);
|
2151
|
-
}
|
2152
|
-
}
|
2153
|
-
}
|
2154
|
-
selectorMatched(element, selector) {
|
2155
|
-
this.delegate.selectorMatched(element, selector, this.details);
|
2156
|
-
this.matchesByElement.add(selector, element);
|
2157
|
-
}
|
2158
|
-
selectorUnmatched(element, selector) {
|
2159
|
-
this.delegate.selectorUnmatched(element, selector, this.details);
|
2160
|
-
this.matchesByElement.delete(selector, element);
|
2161
|
-
}
|
2162
|
-
}
|
2163
|
-
|
2164
|
-
class StringMapObserver {
|
2165
|
-
constructor(element, delegate) {
|
2166
|
-
this.element = element;
|
2167
|
-
this.delegate = delegate;
|
2168
|
-
this.started = false;
|
2169
|
-
this.stringMap = new Map();
|
2170
|
-
this.mutationObserver = new MutationObserver((mutations) => this.processMutations(mutations));
|
2171
|
-
}
|
2172
|
-
start() {
|
2173
|
-
if (!this.started) {
|
2174
|
-
this.started = true;
|
2175
|
-
this.mutationObserver.observe(this.element, { attributes: true, attributeOldValue: true });
|
2176
|
-
this.refresh();
|
2177
|
-
}
|
2178
|
-
}
|
2179
|
-
stop() {
|
2180
|
-
if (this.started) {
|
2181
|
-
this.mutationObserver.takeRecords();
|
2182
|
-
this.mutationObserver.disconnect();
|
2183
|
-
this.started = false;
|
2184
|
-
}
|
2185
|
-
}
|
2186
|
-
refresh() {
|
2187
|
-
if (this.started) {
|
2188
|
-
for (const attributeName of this.knownAttributeNames) {
|
2189
|
-
this.refreshAttribute(attributeName, null);
|
2190
|
-
}
|
2191
|
-
}
|
2192
|
-
}
|
2193
|
-
processMutations(mutations) {
|
2194
|
-
if (this.started) {
|
2195
|
-
for (const mutation of mutations) {
|
2196
|
-
this.processMutation(mutation);
|
2197
|
-
}
|
2198
|
-
}
|
2199
|
-
}
|
2200
|
-
processMutation(mutation) {
|
2201
|
-
const attributeName = mutation.attributeName;
|
2202
|
-
if (attributeName) {
|
2203
|
-
this.refreshAttribute(attributeName, mutation.oldValue);
|
2204
|
-
}
|
2205
|
-
}
|
2206
|
-
refreshAttribute(attributeName, oldValue) {
|
2207
|
-
const key = this.delegate.getStringMapKeyForAttribute(attributeName);
|
2208
|
-
if (key != null) {
|
2209
|
-
if (!this.stringMap.has(attributeName)) {
|
2210
|
-
this.stringMapKeyAdded(key, attributeName);
|
2211
|
-
}
|
2212
|
-
const value = this.element.getAttribute(attributeName);
|
2213
|
-
if (this.stringMap.get(attributeName) != value) {
|
2214
|
-
this.stringMapValueChanged(value, key, oldValue);
|
2215
|
-
}
|
2216
|
-
if (value == null) {
|
2217
|
-
const oldValue = this.stringMap.get(attributeName);
|
2218
|
-
this.stringMap.delete(attributeName);
|
2219
|
-
if (oldValue)
|
2220
|
-
this.stringMapKeyRemoved(key, attributeName, oldValue);
|
2221
|
-
}
|
2222
|
-
else {
|
2223
|
-
this.stringMap.set(attributeName, value);
|
2224
|
-
}
|
2225
|
-
}
|
2226
|
-
}
|
2227
|
-
stringMapKeyAdded(key, attributeName) {
|
2228
|
-
if (this.delegate.stringMapKeyAdded) {
|
2229
|
-
this.delegate.stringMapKeyAdded(key, attributeName);
|
2230
|
-
}
|
2231
|
-
}
|
2232
|
-
stringMapValueChanged(value, key, oldValue) {
|
2233
|
-
if (this.delegate.stringMapValueChanged) {
|
2234
|
-
this.delegate.stringMapValueChanged(value, key, oldValue);
|
2235
|
-
}
|
2236
|
-
}
|
2237
|
-
stringMapKeyRemoved(key, attributeName, oldValue) {
|
2238
|
-
if (this.delegate.stringMapKeyRemoved) {
|
2239
|
-
this.delegate.stringMapKeyRemoved(key, attributeName, oldValue);
|
2240
|
-
}
|
2241
|
-
}
|
2242
|
-
get knownAttributeNames() {
|
2243
|
-
return Array.from(new Set(this.currentAttributeNames.concat(this.recordedAttributeNames)));
|
2244
|
-
}
|
2245
|
-
get currentAttributeNames() {
|
2246
|
-
return Array.from(this.element.attributes).map((attribute) => attribute.name);
|
2247
|
-
}
|
2248
|
-
get recordedAttributeNames() {
|
2249
|
-
return Array.from(this.stringMap.keys());
|
2250
|
-
}
|
2251
|
-
}
|
2252
|
-
|
2253
|
-
class TokenListObserver {
|
2254
|
-
constructor(element, attributeName, delegate) {
|
2255
|
-
this.attributeObserver = new AttributeObserver(element, attributeName, this);
|
2256
|
-
this.delegate = delegate;
|
2257
|
-
this.tokensByElement = new Multimap();
|
2258
|
-
}
|
2259
|
-
get started() {
|
2260
|
-
return this.attributeObserver.started;
|
2261
|
-
}
|
2262
|
-
start() {
|
2263
|
-
this.attributeObserver.start();
|
2264
|
-
}
|
2265
|
-
pause(callback) {
|
2266
|
-
this.attributeObserver.pause(callback);
|
2267
|
-
}
|
2268
|
-
stop() {
|
2269
|
-
this.attributeObserver.stop();
|
2270
|
-
}
|
2271
|
-
refresh() {
|
2272
|
-
this.attributeObserver.refresh();
|
2273
|
-
}
|
2274
|
-
get element() {
|
2275
|
-
return this.attributeObserver.element;
|
2276
|
-
}
|
2277
|
-
get attributeName() {
|
2278
|
-
return this.attributeObserver.attributeName;
|
2279
|
-
}
|
2280
|
-
elementMatchedAttribute(element) {
|
2281
|
-
this.tokensMatched(this.readTokensForElement(element));
|
2282
|
-
}
|
2283
|
-
elementAttributeValueChanged(element) {
|
2284
|
-
const [unmatchedTokens, matchedTokens] = this.refreshTokensForElement(element);
|
2285
|
-
this.tokensUnmatched(unmatchedTokens);
|
2286
|
-
this.tokensMatched(matchedTokens);
|
2287
|
-
}
|
2288
|
-
elementUnmatchedAttribute(element) {
|
2289
|
-
this.tokensUnmatched(this.tokensByElement.getValuesForKey(element));
|
2290
|
-
}
|
2291
|
-
tokensMatched(tokens) {
|
2292
|
-
tokens.forEach((token) => this.tokenMatched(token));
|
2293
|
-
}
|
2294
|
-
tokensUnmatched(tokens) {
|
2295
|
-
tokens.forEach((token) => this.tokenUnmatched(token));
|
2296
|
-
}
|
2297
|
-
tokenMatched(token) {
|
2298
|
-
this.delegate.tokenMatched(token);
|
2299
|
-
this.tokensByElement.add(token.element, token);
|
2300
|
-
}
|
2301
|
-
tokenUnmatched(token) {
|
2302
|
-
this.delegate.tokenUnmatched(token);
|
2303
|
-
this.tokensByElement.delete(token.element, token);
|
2304
|
-
}
|
2305
|
-
refreshTokensForElement(element) {
|
2306
|
-
const previousTokens = this.tokensByElement.getValuesForKey(element);
|
2307
|
-
const currentTokens = this.readTokensForElement(element);
|
2308
|
-
const firstDifferingIndex = zip(previousTokens, currentTokens).findIndex(([previousToken, currentToken]) => !tokensAreEqual(previousToken, currentToken));
|
2309
|
-
if (firstDifferingIndex == -1) {
|
2310
|
-
return [[], []];
|
2311
|
-
}
|
2312
|
-
else {
|
2313
|
-
return [previousTokens.slice(firstDifferingIndex), currentTokens.slice(firstDifferingIndex)];
|
2314
|
-
}
|
2315
|
-
}
|
2316
|
-
readTokensForElement(element) {
|
2317
|
-
const attributeName = this.attributeName;
|
2318
|
-
const tokenString = element.getAttribute(attributeName) || "";
|
2319
|
-
return parseTokenString(tokenString, element, attributeName);
|
2320
|
-
}
|
2321
|
-
}
|
2322
|
-
function parseTokenString(tokenString, element, attributeName) {
|
2323
|
-
return tokenString
|
2324
|
-
.trim()
|
2325
|
-
.split(/\s+/)
|
2326
|
-
.filter((content) => content.length)
|
2327
|
-
.map((content, index) => ({ element, attributeName, content, index }));
|
2328
|
-
}
|
2329
|
-
function zip(left, right) {
|
2330
|
-
const length = Math.max(left.length, right.length);
|
2331
|
-
return Array.from({ length }, (_, index) => [left[index], right[index]]);
|
2332
|
-
}
|
2333
|
-
function tokensAreEqual(left, right) {
|
2334
|
-
return left && right && left.index == right.index && left.content == right.content;
|
2335
|
-
}
|
2336
|
-
|
2337
|
-
class ValueListObserver {
|
2338
|
-
constructor(element, attributeName, delegate) {
|
2339
|
-
this.tokenListObserver = new TokenListObserver(element, attributeName, this);
|
2340
|
-
this.delegate = delegate;
|
2341
|
-
this.parseResultsByToken = new WeakMap();
|
2342
|
-
this.valuesByTokenByElement = new WeakMap();
|
2343
|
-
}
|
2344
|
-
get started() {
|
2345
|
-
return this.tokenListObserver.started;
|
2346
|
-
}
|
2347
|
-
start() {
|
2348
|
-
this.tokenListObserver.start();
|
2349
|
-
}
|
2350
|
-
stop() {
|
2351
|
-
this.tokenListObserver.stop();
|
2352
|
-
}
|
2353
|
-
refresh() {
|
2354
|
-
this.tokenListObserver.refresh();
|
2355
|
-
}
|
2356
|
-
get element() {
|
2357
|
-
return this.tokenListObserver.element;
|
2358
|
-
}
|
2359
|
-
get attributeName() {
|
2360
|
-
return this.tokenListObserver.attributeName;
|
2361
|
-
}
|
2362
|
-
tokenMatched(token) {
|
2363
|
-
const { element } = token;
|
2364
|
-
const { value } = this.fetchParseResultForToken(token);
|
2365
|
-
if (value) {
|
2366
|
-
this.fetchValuesByTokenForElement(element).set(token, value);
|
2367
|
-
this.delegate.elementMatchedValue(element, value);
|
2368
|
-
}
|
2369
|
-
}
|
2370
|
-
tokenUnmatched(token) {
|
2371
|
-
const { element } = token;
|
2372
|
-
const { value } = this.fetchParseResultForToken(token);
|
2373
|
-
if (value) {
|
2374
|
-
this.fetchValuesByTokenForElement(element).delete(token);
|
2375
|
-
this.delegate.elementUnmatchedValue(element, value);
|
2376
|
-
}
|
2377
|
-
}
|
2378
|
-
fetchParseResultForToken(token) {
|
2379
|
-
let parseResult = this.parseResultsByToken.get(token);
|
2380
|
-
if (!parseResult) {
|
2381
|
-
parseResult = this.parseToken(token);
|
2382
|
-
this.parseResultsByToken.set(token, parseResult);
|
2383
|
-
}
|
2384
|
-
return parseResult;
|
2385
|
-
}
|
2386
|
-
fetchValuesByTokenForElement(element) {
|
2387
|
-
let valuesByToken = this.valuesByTokenByElement.get(element);
|
2388
|
-
if (!valuesByToken) {
|
2389
|
-
valuesByToken = new Map();
|
2390
|
-
this.valuesByTokenByElement.set(element, valuesByToken);
|
2391
|
-
}
|
2392
|
-
return valuesByToken;
|
2393
|
-
}
|
2394
|
-
parseToken(token) {
|
2395
|
-
try {
|
2396
|
-
const value = this.delegate.parseValueForToken(token);
|
2397
|
-
return { value };
|
2398
|
-
}
|
2399
|
-
catch (error) {
|
2400
|
-
return { error };
|
2401
|
-
}
|
2402
|
-
}
|
2403
|
-
}
|
2404
|
-
|
2405
|
-
class BindingObserver {
|
2406
|
-
constructor(context, delegate) {
|
2407
|
-
this.context = context;
|
2408
|
-
this.delegate = delegate;
|
2409
|
-
this.bindingsByAction = new Map();
|
2410
|
-
}
|
2411
|
-
start() {
|
2412
|
-
if (!this.valueListObserver) {
|
2413
|
-
this.valueListObserver = new ValueListObserver(this.element, this.actionAttribute, this);
|
2414
|
-
this.valueListObserver.start();
|
2415
|
-
}
|
2416
|
-
}
|
2417
|
-
stop() {
|
2418
|
-
if (this.valueListObserver) {
|
2419
|
-
this.valueListObserver.stop();
|
2420
|
-
delete this.valueListObserver;
|
2421
|
-
this.disconnectAllActions();
|
2422
|
-
}
|
2423
|
-
}
|
2424
|
-
get element() {
|
2425
|
-
return this.context.element;
|
2426
|
-
}
|
2427
|
-
get identifier() {
|
2428
|
-
return this.context.identifier;
|
2429
|
-
}
|
2430
|
-
get actionAttribute() {
|
2431
|
-
return this.schema.actionAttribute;
|
2432
|
-
}
|
2433
|
-
get schema() {
|
2434
|
-
return this.context.schema;
|
2435
|
-
}
|
2436
|
-
get bindings() {
|
2437
|
-
return Array.from(this.bindingsByAction.values());
|
2438
|
-
}
|
2439
|
-
connectAction(action) {
|
2440
|
-
const binding = new Binding(this.context, action);
|
2441
|
-
this.bindingsByAction.set(action, binding);
|
2442
|
-
this.delegate.bindingConnected(binding);
|
2443
|
-
}
|
2444
|
-
disconnectAction(action) {
|
2445
|
-
const binding = this.bindingsByAction.get(action);
|
2446
|
-
if (binding) {
|
2447
|
-
this.bindingsByAction.delete(action);
|
2448
|
-
this.delegate.bindingDisconnected(binding);
|
2449
|
-
}
|
2450
|
-
}
|
2451
|
-
disconnectAllActions() {
|
2452
|
-
this.bindings.forEach((binding) => this.delegate.bindingDisconnected(binding, true));
|
2453
|
-
this.bindingsByAction.clear();
|
2454
|
-
}
|
2455
|
-
parseValueForToken(token) {
|
2456
|
-
const action = Action.forToken(token, this.schema);
|
2457
|
-
if (action.identifier == this.identifier) {
|
2458
|
-
return action;
|
2459
|
-
}
|
2460
|
-
}
|
2461
|
-
elementMatchedValue(element, action) {
|
2462
|
-
this.connectAction(action);
|
2463
|
-
}
|
2464
|
-
elementUnmatchedValue(element, action) {
|
2465
|
-
this.disconnectAction(action);
|
2466
|
-
}
|
2467
|
-
}
|
2468
|
-
|
2469
|
-
class ValueObserver {
|
2470
|
-
constructor(context, receiver) {
|
2471
|
-
this.context = context;
|
2472
|
-
this.receiver = receiver;
|
2473
|
-
this.stringMapObserver = new StringMapObserver(this.element, this);
|
2474
|
-
this.valueDescriptorMap = this.controller.valueDescriptorMap;
|
2475
|
-
}
|
2476
|
-
start() {
|
2477
|
-
this.stringMapObserver.start();
|
2478
|
-
this.invokeChangedCallbacksForDefaultValues();
|
2479
|
-
}
|
2480
|
-
stop() {
|
2481
|
-
this.stringMapObserver.stop();
|
2482
|
-
}
|
2483
|
-
get element() {
|
2484
|
-
return this.context.element;
|
2485
|
-
}
|
2486
|
-
get controller() {
|
2487
|
-
return this.context.controller;
|
2488
|
-
}
|
2489
|
-
getStringMapKeyForAttribute(attributeName) {
|
2490
|
-
if (attributeName in this.valueDescriptorMap) {
|
2491
|
-
return this.valueDescriptorMap[attributeName].name;
|
2492
|
-
}
|
2493
|
-
}
|
2494
|
-
stringMapKeyAdded(key, attributeName) {
|
2495
|
-
const descriptor = this.valueDescriptorMap[attributeName];
|
2496
|
-
if (!this.hasValue(key)) {
|
2497
|
-
this.invokeChangedCallback(key, descriptor.writer(this.receiver[key]), descriptor.writer(descriptor.defaultValue));
|
2498
|
-
}
|
2499
|
-
}
|
2500
|
-
stringMapValueChanged(value, name, oldValue) {
|
2501
|
-
const descriptor = this.valueDescriptorNameMap[name];
|
2502
|
-
if (value === null)
|
2503
|
-
return;
|
2504
|
-
if (oldValue === null) {
|
2505
|
-
oldValue = descriptor.writer(descriptor.defaultValue);
|
2506
|
-
}
|
2507
|
-
this.invokeChangedCallback(name, value, oldValue);
|
2508
|
-
}
|
2509
|
-
stringMapKeyRemoved(key, attributeName, oldValue) {
|
2510
|
-
const descriptor = this.valueDescriptorNameMap[key];
|
2511
|
-
if (this.hasValue(key)) {
|
2512
|
-
this.invokeChangedCallback(key, descriptor.writer(this.receiver[key]), oldValue);
|
2513
|
-
}
|
2514
|
-
else {
|
2515
|
-
this.invokeChangedCallback(key, descriptor.writer(descriptor.defaultValue), oldValue);
|
2516
|
-
}
|
2517
|
-
}
|
2518
|
-
invokeChangedCallbacksForDefaultValues() {
|
2519
|
-
for (const { key, name, defaultValue, writer } of this.valueDescriptors) {
|
2520
|
-
if (defaultValue != undefined && !this.controller.data.has(key)) {
|
2521
|
-
this.invokeChangedCallback(name, writer(defaultValue), undefined);
|
2522
|
-
}
|
2523
|
-
}
|
2524
|
-
}
|
2525
|
-
invokeChangedCallback(name, rawValue, rawOldValue) {
|
2526
|
-
const changedMethodName = `${name}Changed`;
|
2527
|
-
const changedMethod = this.receiver[changedMethodName];
|
2528
|
-
if (typeof changedMethod == "function") {
|
2529
|
-
const descriptor = this.valueDescriptorNameMap[name];
|
2530
|
-
try {
|
2531
|
-
const value = descriptor.reader(rawValue);
|
2532
|
-
let oldValue = rawOldValue;
|
2533
|
-
if (rawOldValue) {
|
2534
|
-
oldValue = descriptor.reader(rawOldValue);
|
2535
|
-
}
|
2536
|
-
changedMethod.call(this.receiver, value, oldValue);
|
2537
|
-
}
|
2538
|
-
catch (error) {
|
2539
|
-
if (error instanceof TypeError) {
|
2540
|
-
error.message = `Stimulus Value "${this.context.identifier}.${descriptor.name}" - ${error.message}`;
|
2541
|
-
}
|
2542
|
-
throw error;
|
2543
|
-
}
|
2544
|
-
}
|
2545
|
-
}
|
2546
|
-
get valueDescriptors() {
|
2547
|
-
const { valueDescriptorMap } = this;
|
2548
|
-
return Object.keys(valueDescriptorMap).map((key) => valueDescriptorMap[key]);
|
2549
|
-
}
|
2550
|
-
get valueDescriptorNameMap() {
|
2551
|
-
const descriptors = {};
|
2552
|
-
Object.keys(this.valueDescriptorMap).forEach((key) => {
|
2553
|
-
const descriptor = this.valueDescriptorMap[key];
|
2554
|
-
descriptors[descriptor.name] = descriptor;
|
2555
|
-
});
|
2556
|
-
return descriptors;
|
2557
|
-
}
|
2558
|
-
hasValue(attributeName) {
|
2559
|
-
const descriptor = this.valueDescriptorNameMap[attributeName];
|
2560
|
-
const hasMethodName = `has${capitalize(descriptor.name)}`;
|
2561
|
-
return this.receiver[hasMethodName];
|
2562
|
-
}
|
2563
|
-
}
|
2564
|
-
|
2565
|
-
class TargetObserver {
|
2566
|
-
constructor(context, delegate) {
|
2567
|
-
this.context = context;
|
2568
|
-
this.delegate = delegate;
|
2569
|
-
this.targetsByName = new Multimap();
|
2570
|
-
}
|
2571
|
-
start() {
|
2572
|
-
if (!this.tokenListObserver) {
|
2573
|
-
this.tokenListObserver = new TokenListObserver(this.element, this.attributeName, this);
|
2574
|
-
this.tokenListObserver.start();
|
2575
|
-
}
|
2576
|
-
}
|
2577
|
-
stop() {
|
2578
|
-
if (this.tokenListObserver) {
|
2579
|
-
this.disconnectAllTargets();
|
2580
|
-
this.tokenListObserver.stop();
|
2581
|
-
delete this.tokenListObserver;
|
2582
|
-
}
|
2583
|
-
}
|
2584
|
-
tokenMatched({ element, content: name }) {
|
2585
|
-
if (this.scope.containsElement(element)) {
|
2586
|
-
this.connectTarget(element, name);
|
2587
|
-
}
|
2588
|
-
}
|
2589
|
-
tokenUnmatched({ element, content: name }) {
|
2590
|
-
this.disconnectTarget(element, name);
|
2591
|
-
}
|
2592
|
-
connectTarget(element, name) {
|
2593
|
-
var _a;
|
2594
|
-
if (!this.targetsByName.has(name, element)) {
|
2595
|
-
this.targetsByName.add(name, element);
|
2596
|
-
(_a = this.tokenListObserver) === null || _a === void 0 ? void 0 : _a.pause(() => this.delegate.targetConnected(element, name));
|
2597
|
-
}
|
2598
|
-
}
|
2599
|
-
disconnectTarget(element, name) {
|
2600
|
-
var _a;
|
2601
|
-
if (this.targetsByName.has(name, element)) {
|
2602
|
-
this.targetsByName.delete(name, element);
|
2603
|
-
(_a = this.tokenListObserver) === null || _a === void 0 ? void 0 : _a.pause(() => this.delegate.targetDisconnected(element, name));
|
2604
|
-
}
|
2605
|
-
}
|
2606
|
-
disconnectAllTargets() {
|
2607
|
-
for (const name of this.targetsByName.keys) {
|
2608
|
-
for (const element of this.targetsByName.getValuesForKey(name)) {
|
2609
|
-
this.disconnectTarget(element, name);
|
2610
|
-
}
|
2611
|
-
}
|
2612
|
-
}
|
2613
|
-
get attributeName() {
|
2614
|
-
return `data-${this.context.identifier}-target`;
|
2615
|
-
}
|
2616
|
-
get element() {
|
2617
|
-
return this.context.element;
|
2618
|
-
}
|
2619
|
-
get scope() {
|
2620
|
-
return this.context.scope;
|
2621
|
-
}
|
2622
|
-
}
|
2623
|
-
|
2624
|
-
function readInheritableStaticArrayValues(constructor, propertyName) {
|
2625
|
-
const ancestors = getAncestorsForConstructor(constructor);
|
2626
|
-
return Array.from(ancestors.reduce((values, constructor) => {
|
2627
|
-
getOwnStaticArrayValues(constructor, propertyName).forEach((name) => values.add(name));
|
2628
|
-
return values;
|
2629
|
-
}, new Set()));
|
2630
|
-
}
|
2631
|
-
function getAncestorsForConstructor(constructor) {
|
2632
|
-
const ancestors = [];
|
2633
|
-
while (constructor) {
|
2634
|
-
ancestors.push(constructor);
|
2635
|
-
constructor = Object.getPrototypeOf(constructor);
|
2636
|
-
}
|
2637
|
-
return ancestors.reverse();
|
2638
|
-
}
|
2639
|
-
function getOwnStaticArrayValues(constructor, propertyName) {
|
2640
|
-
const definition = constructor[propertyName];
|
2641
|
-
return Array.isArray(definition) ? definition : [];
|
2642
|
-
}
|
2643
|
-
|
2644
|
-
class OutletObserver {
|
2645
|
-
constructor(context, delegate) {
|
2646
|
-
this.started = false;
|
2647
|
-
this.context = context;
|
2648
|
-
this.delegate = delegate;
|
2649
|
-
this.outletsByName = new Multimap();
|
2650
|
-
this.outletElementsByName = new Multimap();
|
2651
|
-
this.selectorObserverMap = new Map();
|
2652
|
-
this.attributeObserverMap = new Map();
|
2653
|
-
}
|
2654
|
-
start() {
|
2655
|
-
if (!this.started) {
|
2656
|
-
this.outletDefinitions.forEach((outletName) => {
|
2657
|
-
this.setupSelectorObserverForOutlet(outletName);
|
2658
|
-
this.setupAttributeObserverForOutlet(outletName);
|
2659
|
-
});
|
2660
|
-
this.started = true;
|
2661
|
-
this.dependentContexts.forEach((context) => context.refresh());
|
2662
|
-
}
|
2663
|
-
}
|
2664
|
-
refresh() {
|
2665
|
-
this.selectorObserverMap.forEach((observer) => observer.refresh());
|
2666
|
-
this.attributeObserverMap.forEach((observer) => observer.refresh());
|
2667
|
-
}
|
2668
|
-
stop() {
|
2669
|
-
if (this.started) {
|
2670
|
-
this.started = false;
|
2671
|
-
this.disconnectAllOutlets();
|
2672
|
-
this.stopSelectorObservers();
|
2673
|
-
this.stopAttributeObservers();
|
2674
|
-
}
|
2675
|
-
}
|
2676
|
-
stopSelectorObservers() {
|
2677
|
-
if (this.selectorObserverMap.size > 0) {
|
2678
|
-
this.selectorObserverMap.forEach((observer) => observer.stop());
|
2679
|
-
this.selectorObserverMap.clear();
|
2680
|
-
}
|
2681
|
-
}
|
2682
|
-
stopAttributeObservers() {
|
2683
|
-
if (this.attributeObserverMap.size > 0) {
|
2684
|
-
this.attributeObserverMap.forEach((observer) => observer.stop());
|
2685
|
-
this.attributeObserverMap.clear();
|
2686
|
-
}
|
2687
|
-
}
|
2688
|
-
selectorMatched(element, _selector, { outletName }) {
|
2689
|
-
const outlet = this.getOutlet(element, outletName);
|
2690
|
-
if (outlet) {
|
2691
|
-
this.connectOutlet(outlet, element, outletName);
|
2692
|
-
}
|
2693
|
-
}
|
2694
|
-
selectorUnmatched(element, _selector, { outletName }) {
|
2695
|
-
const outlet = this.getOutletFromMap(element, outletName);
|
2696
|
-
if (outlet) {
|
2697
|
-
this.disconnectOutlet(outlet, element, outletName);
|
2698
|
-
}
|
2699
|
-
}
|
2700
|
-
selectorMatchElement(element, { outletName }) {
|
2701
|
-
const selector = this.selector(outletName);
|
2702
|
-
const hasOutlet = this.hasOutlet(element, outletName);
|
2703
|
-
const hasOutletController = element.matches(`[${this.schema.controllerAttribute}~=${outletName}]`);
|
2704
|
-
if (selector) {
|
2705
|
-
return hasOutlet && hasOutletController && element.matches(selector);
|
2706
|
-
}
|
2707
|
-
else {
|
2708
|
-
return false;
|
2709
|
-
}
|
2710
|
-
}
|
2711
|
-
elementMatchedAttribute(_element, attributeName) {
|
2712
|
-
const outletName = this.getOutletNameFromOutletAttributeName(attributeName);
|
2713
|
-
if (outletName) {
|
2714
|
-
this.updateSelectorObserverForOutlet(outletName);
|
2715
|
-
}
|
2716
|
-
}
|
2717
|
-
elementAttributeValueChanged(_element, attributeName) {
|
2718
|
-
const outletName = this.getOutletNameFromOutletAttributeName(attributeName);
|
2719
|
-
if (outletName) {
|
2720
|
-
this.updateSelectorObserverForOutlet(outletName);
|
2721
|
-
}
|
2722
|
-
}
|
2723
|
-
elementUnmatchedAttribute(_element, attributeName) {
|
2724
|
-
const outletName = this.getOutletNameFromOutletAttributeName(attributeName);
|
2725
|
-
if (outletName) {
|
2726
|
-
this.updateSelectorObserverForOutlet(outletName);
|
2727
|
-
}
|
2728
|
-
}
|
2729
|
-
connectOutlet(outlet, element, outletName) {
|
2730
|
-
var _a;
|
2731
|
-
if (!this.outletElementsByName.has(outletName, element)) {
|
2732
|
-
this.outletsByName.add(outletName, outlet);
|
2733
|
-
this.outletElementsByName.add(outletName, element);
|
2734
|
-
(_a = this.selectorObserverMap.get(outletName)) === null || _a === void 0 ? void 0 : _a.pause(() => this.delegate.outletConnected(outlet, element, outletName));
|
2735
|
-
}
|
2736
|
-
}
|
2737
|
-
disconnectOutlet(outlet, element, outletName) {
|
2738
|
-
var _a;
|
2739
|
-
if (this.outletElementsByName.has(outletName, element)) {
|
2740
|
-
this.outletsByName.delete(outletName, outlet);
|
2741
|
-
this.outletElementsByName.delete(outletName, element);
|
2742
|
-
(_a = this.selectorObserverMap
|
2743
|
-
.get(outletName)) === null || _a === void 0 ? void 0 : _a.pause(() => this.delegate.outletDisconnected(outlet, element, outletName));
|
2744
|
-
}
|
2745
|
-
}
|
2746
|
-
disconnectAllOutlets() {
|
2747
|
-
for (const outletName of this.outletElementsByName.keys) {
|
2748
|
-
for (const element of this.outletElementsByName.getValuesForKey(outletName)) {
|
2749
|
-
for (const outlet of this.outletsByName.getValuesForKey(outletName)) {
|
2750
|
-
this.disconnectOutlet(outlet, element, outletName);
|
2751
|
-
}
|
2752
|
-
}
|
2753
|
-
}
|
2754
|
-
}
|
2755
|
-
updateSelectorObserverForOutlet(outletName) {
|
2756
|
-
const observer = this.selectorObserverMap.get(outletName);
|
2757
|
-
if (observer) {
|
2758
|
-
observer.selector = this.selector(outletName);
|
2759
|
-
}
|
2760
|
-
}
|
2761
|
-
setupSelectorObserverForOutlet(outletName) {
|
2762
|
-
const selector = this.selector(outletName);
|
2763
|
-
const selectorObserver = new SelectorObserver(document.body, selector, this, { outletName });
|
2764
|
-
this.selectorObserverMap.set(outletName, selectorObserver);
|
2765
|
-
selectorObserver.start();
|
2766
|
-
}
|
2767
|
-
setupAttributeObserverForOutlet(outletName) {
|
2768
|
-
const attributeName = this.attributeNameForOutletName(outletName);
|
2769
|
-
const attributeObserver = new AttributeObserver(this.scope.element, attributeName, this);
|
2770
|
-
this.attributeObserverMap.set(outletName, attributeObserver);
|
2771
|
-
attributeObserver.start();
|
2772
|
-
}
|
2773
|
-
selector(outletName) {
|
2774
|
-
return this.scope.outlets.getSelectorForOutletName(outletName);
|
2775
|
-
}
|
2776
|
-
attributeNameForOutletName(outletName) {
|
2777
|
-
return this.scope.schema.outletAttributeForScope(this.identifier, outletName);
|
2778
|
-
}
|
2779
|
-
getOutletNameFromOutletAttributeName(attributeName) {
|
2780
|
-
return this.outletDefinitions.find((outletName) => this.attributeNameForOutletName(outletName) === attributeName);
|
2781
|
-
}
|
2782
|
-
get outletDependencies() {
|
2783
|
-
const dependencies = new Multimap();
|
2784
|
-
this.router.modules.forEach((module) => {
|
2785
|
-
const constructor = module.definition.controllerConstructor;
|
2786
|
-
const outlets = readInheritableStaticArrayValues(constructor, "outlets");
|
2787
|
-
outlets.forEach((outlet) => dependencies.add(outlet, module.identifier));
|
2788
|
-
});
|
2789
|
-
return dependencies;
|
2790
|
-
}
|
2791
|
-
get outletDefinitions() {
|
2792
|
-
return this.outletDependencies.getKeysForValue(this.identifier);
|
2793
|
-
}
|
2794
|
-
get dependentControllerIdentifiers() {
|
2795
|
-
return this.outletDependencies.getValuesForKey(this.identifier);
|
2796
|
-
}
|
2797
|
-
get dependentContexts() {
|
2798
|
-
const identifiers = this.dependentControllerIdentifiers;
|
2799
|
-
return this.router.contexts.filter((context) => identifiers.includes(context.identifier));
|
2800
|
-
}
|
2801
|
-
hasOutlet(element, outletName) {
|
2802
|
-
return !!this.getOutlet(element, outletName) || !!this.getOutletFromMap(element, outletName);
|
2803
|
-
}
|
2804
|
-
getOutlet(element, outletName) {
|
2805
|
-
return this.application.getControllerForElementAndIdentifier(element, outletName);
|
2806
|
-
}
|
2807
|
-
getOutletFromMap(element, outletName) {
|
2808
|
-
return this.outletsByName.getValuesForKey(outletName).find((outlet) => outlet.element === element);
|
2809
|
-
}
|
2810
|
-
get scope() {
|
2811
|
-
return this.context.scope;
|
2812
|
-
}
|
2813
|
-
get schema() {
|
2814
|
-
return this.context.schema;
|
2815
|
-
}
|
2816
|
-
get identifier() {
|
2817
|
-
return this.context.identifier;
|
2818
|
-
}
|
2819
|
-
get application() {
|
2820
|
-
return this.context.application;
|
2821
|
-
}
|
2822
|
-
get router() {
|
2823
|
-
return this.application.router;
|
2824
|
-
}
|
2825
|
-
}
|
2826
|
-
|
2827
|
-
class Context {
|
2828
|
-
constructor(module, scope) {
|
2829
|
-
this.logDebugActivity = (functionName, detail = {}) => {
|
2830
|
-
const { identifier, controller, element } = this;
|
2831
|
-
detail = Object.assign({ identifier, controller, element }, detail);
|
2832
|
-
this.application.logDebugActivity(this.identifier, functionName, detail);
|
2833
|
-
};
|
2834
|
-
this.module = module;
|
2835
|
-
this.scope = scope;
|
2836
|
-
this.controller = new module.controllerConstructor(this);
|
2837
|
-
this.bindingObserver = new BindingObserver(this, this.dispatcher);
|
2838
|
-
this.valueObserver = new ValueObserver(this, this.controller);
|
2839
|
-
this.targetObserver = new TargetObserver(this, this);
|
2840
|
-
this.outletObserver = new OutletObserver(this, this);
|
2841
|
-
try {
|
2842
|
-
this.controller.initialize();
|
2843
|
-
this.logDebugActivity("initialize");
|
2844
|
-
}
|
2845
|
-
catch (error) {
|
2846
|
-
this.handleError(error, "initializing controller");
|
2847
|
-
}
|
2848
|
-
}
|
2849
|
-
connect() {
|
2850
|
-
this.bindingObserver.start();
|
2851
|
-
this.valueObserver.start();
|
2852
|
-
this.targetObserver.start();
|
2853
|
-
this.outletObserver.start();
|
2854
|
-
try {
|
2855
|
-
this.controller.connect();
|
2856
|
-
this.logDebugActivity("connect");
|
2857
|
-
}
|
2858
|
-
catch (error) {
|
2859
|
-
this.handleError(error, "connecting controller");
|
2860
|
-
}
|
2861
|
-
}
|
2862
|
-
refresh() {
|
2863
|
-
this.outletObserver.refresh();
|
2864
|
-
}
|
2865
|
-
disconnect() {
|
2866
|
-
try {
|
2867
|
-
this.controller.disconnect();
|
2868
|
-
this.logDebugActivity("disconnect");
|
2869
|
-
}
|
2870
|
-
catch (error) {
|
2871
|
-
this.handleError(error, "disconnecting controller");
|
2872
|
-
}
|
2873
|
-
this.outletObserver.stop();
|
2874
|
-
this.targetObserver.stop();
|
2875
|
-
this.valueObserver.stop();
|
2876
|
-
this.bindingObserver.stop();
|
2877
|
-
}
|
2878
|
-
get application() {
|
2879
|
-
return this.module.application;
|
2880
|
-
}
|
2881
|
-
get identifier() {
|
2882
|
-
return this.module.identifier;
|
2883
|
-
}
|
2884
|
-
get schema() {
|
2885
|
-
return this.application.schema;
|
2886
|
-
}
|
2887
|
-
get dispatcher() {
|
2888
|
-
return this.application.dispatcher;
|
2889
|
-
}
|
2890
|
-
get element() {
|
2891
|
-
return this.scope.element;
|
2892
|
-
}
|
2893
|
-
get parentElement() {
|
2894
|
-
return this.element.parentElement;
|
2895
|
-
}
|
2896
|
-
handleError(error, message, detail = {}) {
|
2897
|
-
const { identifier, controller, element } = this;
|
2898
|
-
detail = Object.assign({ identifier, controller, element }, detail);
|
2899
|
-
this.application.handleError(error, `Error ${message}`, detail);
|
2900
|
-
}
|
2901
|
-
targetConnected(element, name) {
|
2902
|
-
this.invokeControllerMethod(`${name}TargetConnected`, element);
|
2903
|
-
}
|
2904
|
-
targetDisconnected(element, name) {
|
2905
|
-
this.invokeControllerMethod(`${name}TargetDisconnected`, element);
|
2906
|
-
}
|
2907
|
-
outletConnected(outlet, element, name) {
|
2908
|
-
this.invokeControllerMethod(`${namespaceCamelize(name)}OutletConnected`, outlet, element);
|
2909
|
-
}
|
2910
|
-
outletDisconnected(outlet, element, name) {
|
2911
|
-
this.invokeControllerMethod(`${namespaceCamelize(name)}OutletDisconnected`, outlet, element);
|
2912
|
-
}
|
2913
|
-
invokeControllerMethod(methodName, ...args) {
|
2914
|
-
const controller = this.controller;
|
2915
|
-
if (typeof controller[methodName] == "function") {
|
2916
|
-
controller[methodName](...args);
|
2917
|
-
}
|
2918
|
-
}
|
2919
|
-
}
|
2920
|
-
|
2921
|
-
function bless(constructor) {
|
2922
|
-
return shadow(constructor, getBlessedProperties(constructor));
|
2923
|
-
}
|
2924
|
-
function shadow(constructor, properties) {
|
2925
|
-
const shadowConstructor = extend(constructor);
|
2926
|
-
const shadowProperties = getShadowProperties(constructor.prototype, properties);
|
2927
|
-
Object.defineProperties(shadowConstructor.prototype, shadowProperties);
|
2928
|
-
return shadowConstructor;
|
2929
|
-
}
|
2930
|
-
function getBlessedProperties(constructor) {
|
2931
|
-
const blessings = readInheritableStaticArrayValues(constructor, "blessings");
|
2932
|
-
return blessings.reduce((blessedProperties, blessing) => {
|
2933
|
-
const properties = blessing(constructor);
|
2934
|
-
for (const key in properties) {
|
2935
|
-
const descriptor = blessedProperties[key] || {};
|
2936
|
-
blessedProperties[key] = Object.assign(descriptor, properties[key]);
|
2937
|
-
}
|
2938
|
-
return blessedProperties;
|
2939
|
-
}, {});
|
2940
|
-
}
|
2941
|
-
function getShadowProperties(prototype, properties) {
|
2942
|
-
return getOwnKeys(properties).reduce((shadowProperties, key) => {
|
2943
|
-
const descriptor = getShadowedDescriptor(prototype, properties, key);
|
2944
|
-
if (descriptor) {
|
2945
|
-
Object.assign(shadowProperties, { [key]: descriptor });
|
2946
|
-
}
|
2947
|
-
return shadowProperties;
|
2948
|
-
}, {});
|
2949
|
-
}
|
2950
|
-
function getShadowedDescriptor(prototype, properties, key) {
|
2951
|
-
const shadowingDescriptor = Object.getOwnPropertyDescriptor(prototype, key);
|
2952
|
-
const shadowedByValue = shadowingDescriptor && "value" in shadowingDescriptor;
|
2953
|
-
if (!shadowedByValue) {
|
2954
|
-
const descriptor = Object.getOwnPropertyDescriptor(properties, key).value;
|
2955
|
-
if (shadowingDescriptor) {
|
2956
|
-
descriptor.get = shadowingDescriptor.get || descriptor.get;
|
2957
|
-
descriptor.set = shadowingDescriptor.set || descriptor.set;
|
2958
|
-
}
|
2959
|
-
return descriptor;
|
2960
|
-
}
|
2961
|
-
}
|
2962
|
-
const getOwnKeys = (() => {
|
2963
|
-
if (typeof Object.getOwnPropertySymbols == "function") {
|
2964
|
-
return (object) => [...Object.getOwnPropertyNames(object), ...Object.getOwnPropertySymbols(object)];
|
2965
|
-
}
|
2966
|
-
else {
|
2967
|
-
return Object.getOwnPropertyNames;
|
2968
|
-
}
|
2969
|
-
})();
|
2970
|
-
const extend = (() => {
|
2971
|
-
function extendWithReflect(constructor) {
|
2972
|
-
function extended() {
|
2973
|
-
return Reflect.construct(constructor, arguments, new.target);
|
2974
|
-
}
|
2975
|
-
extended.prototype = Object.create(constructor.prototype, {
|
2976
|
-
constructor: { value: extended },
|
2977
|
-
});
|
2978
|
-
Reflect.setPrototypeOf(extended, constructor);
|
2979
|
-
return extended;
|
2980
|
-
}
|
2981
|
-
function testReflectExtension() {
|
2982
|
-
const a = function () {
|
2983
|
-
this.a.call(this);
|
2984
|
-
};
|
2985
|
-
const b = extendWithReflect(a);
|
2986
|
-
b.prototype.a = function () { };
|
2987
|
-
return new b();
|
2988
|
-
}
|
2989
|
-
try {
|
2990
|
-
testReflectExtension();
|
2991
|
-
return extendWithReflect;
|
2992
|
-
}
|
2993
|
-
catch (error) {
|
2994
|
-
return (constructor) => class extended extends constructor {
|
2995
|
-
};
|
2996
|
-
}
|
2997
|
-
})();
|
2998
|
-
|
2999
|
-
function blessDefinition(definition) {
|
3000
|
-
return {
|
3001
|
-
identifier: definition.identifier,
|
3002
|
-
controllerConstructor: bless(definition.controllerConstructor),
|
3003
|
-
};
|
3004
|
-
}
|
3005
|
-
|
3006
|
-
class Module {
|
3007
|
-
constructor(application, definition) {
|
3008
|
-
this.application = application;
|
3009
|
-
this.definition = blessDefinition(definition);
|
3010
|
-
this.contextsByScope = new WeakMap();
|
3011
|
-
this.connectedContexts = new Set();
|
3012
|
-
}
|
3013
|
-
get identifier() {
|
3014
|
-
return this.definition.identifier;
|
3015
|
-
}
|
3016
|
-
get controllerConstructor() {
|
3017
|
-
return this.definition.controllerConstructor;
|
3018
|
-
}
|
3019
|
-
get contexts() {
|
3020
|
-
return Array.from(this.connectedContexts);
|
3021
|
-
}
|
3022
|
-
connectContextForScope(scope) {
|
3023
|
-
const context = this.fetchContextForScope(scope);
|
3024
|
-
this.connectedContexts.add(context);
|
3025
|
-
context.connect();
|
3026
|
-
}
|
3027
|
-
disconnectContextForScope(scope) {
|
3028
|
-
const context = this.contextsByScope.get(scope);
|
3029
|
-
if (context) {
|
3030
|
-
this.connectedContexts.delete(context);
|
3031
|
-
context.disconnect();
|
3032
|
-
}
|
3033
|
-
}
|
3034
|
-
fetchContextForScope(scope) {
|
3035
|
-
let context = this.contextsByScope.get(scope);
|
3036
|
-
if (!context) {
|
3037
|
-
context = new Context(this, scope);
|
3038
|
-
this.contextsByScope.set(scope, context);
|
3039
|
-
}
|
3040
|
-
return context;
|
3041
|
-
}
|
3042
|
-
}
|
3043
|
-
|
3044
|
-
class ClassMap {
|
3045
|
-
constructor(scope) {
|
3046
|
-
this.scope = scope;
|
3047
|
-
}
|
3048
|
-
has(name) {
|
3049
|
-
return this.data.has(this.getDataKey(name));
|
3050
|
-
}
|
3051
|
-
get(name) {
|
3052
|
-
return this.getAll(name)[0];
|
3053
|
-
}
|
3054
|
-
getAll(name) {
|
3055
|
-
const tokenString = this.data.get(this.getDataKey(name)) || "";
|
3056
|
-
return tokenize(tokenString);
|
3057
|
-
}
|
3058
|
-
getAttributeName(name) {
|
3059
|
-
return this.data.getAttributeNameForKey(this.getDataKey(name));
|
3060
|
-
}
|
3061
|
-
getDataKey(name) {
|
3062
|
-
return `${name}-class`;
|
3063
|
-
}
|
3064
|
-
get data() {
|
3065
|
-
return this.scope.data;
|
3066
|
-
}
|
3067
|
-
}
|
3068
|
-
|
3069
|
-
class DataMap {
|
3070
|
-
constructor(scope) {
|
3071
|
-
this.scope = scope;
|
3072
|
-
}
|
3073
|
-
get element() {
|
3074
|
-
return this.scope.element;
|
3075
|
-
}
|
3076
|
-
get identifier() {
|
3077
|
-
return this.scope.identifier;
|
3078
|
-
}
|
3079
|
-
get(key) {
|
3080
|
-
const name = this.getAttributeNameForKey(key);
|
3081
|
-
return this.element.getAttribute(name);
|
3082
|
-
}
|
3083
|
-
set(key, value) {
|
3084
|
-
const name = this.getAttributeNameForKey(key);
|
3085
|
-
this.element.setAttribute(name, value);
|
3086
|
-
return this.get(key);
|
3087
|
-
}
|
3088
|
-
has(key) {
|
3089
|
-
const name = this.getAttributeNameForKey(key);
|
3090
|
-
return this.element.hasAttribute(name);
|
3091
|
-
}
|
3092
|
-
delete(key) {
|
3093
|
-
if (this.has(key)) {
|
3094
|
-
const name = this.getAttributeNameForKey(key);
|
3095
|
-
this.element.removeAttribute(name);
|
3096
|
-
return true;
|
3097
|
-
}
|
3098
|
-
else {
|
3099
|
-
return false;
|
3100
|
-
}
|
3101
|
-
}
|
3102
|
-
getAttributeNameForKey(key) {
|
3103
|
-
return `data-${this.identifier}-${dasherize(key)}`;
|
3104
|
-
}
|
3105
|
-
}
|
3106
|
-
|
3107
|
-
class Guide {
|
3108
|
-
constructor(logger) {
|
3109
|
-
this.warnedKeysByObject = new WeakMap();
|
3110
|
-
this.logger = logger;
|
3111
|
-
}
|
3112
|
-
warn(object, key, message) {
|
3113
|
-
let warnedKeys = this.warnedKeysByObject.get(object);
|
3114
|
-
if (!warnedKeys) {
|
3115
|
-
warnedKeys = new Set();
|
3116
|
-
this.warnedKeysByObject.set(object, warnedKeys);
|
3117
|
-
}
|
3118
|
-
if (!warnedKeys.has(key)) {
|
3119
|
-
warnedKeys.add(key);
|
3120
|
-
this.logger.warn(message, object);
|
3121
|
-
}
|
3122
|
-
}
|
3123
|
-
}
|
3124
|
-
|
3125
|
-
function attributeValueContainsToken(attributeName, token) {
|
3126
|
-
return `[${attributeName}~="${token}"]`;
|
3127
|
-
}
|
3128
|
-
|
3129
|
-
class TargetSet {
|
3130
|
-
constructor(scope) {
|
3131
|
-
this.scope = scope;
|
3132
|
-
}
|
3133
|
-
get element() {
|
3134
|
-
return this.scope.element;
|
3135
|
-
}
|
3136
|
-
get identifier() {
|
3137
|
-
return this.scope.identifier;
|
3138
|
-
}
|
3139
|
-
get schema() {
|
3140
|
-
return this.scope.schema;
|
3141
|
-
}
|
3142
|
-
has(targetName) {
|
3143
|
-
return this.find(targetName) != null;
|
3144
|
-
}
|
3145
|
-
find(...targetNames) {
|
3146
|
-
return targetNames.reduce((target, targetName) => target || this.findTarget(targetName) || this.findLegacyTarget(targetName), undefined);
|
3147
|
-
}
|
3148
|
-
findAll(...targetNames) {
|
3149
|
-
return targetNames.reduce((targets, targetName) => [
|
3150
|
-
...targets,
|
3151
|
-
...this.findAllTargets(targetName),
|
3152
|
-
...this.findAllLegacyTargets(targetName),
|
3153
|
-
], []);
|
3154
|
-
}
|
3155
|
-
findTarget(targetName) {
|
3156
|
-
const selector = this.getSelectorForTargetName(targetName);
|
3157
|
-
return this.scope.findElement(selector);
|
3158
|
-
}
|
3159
|
-
findAllTargets(targetName) {
|
3160
|
-
const selector = this.getSelectorForTargetName(targetName);
|
3161
|
-
return this.scope.findAllElements(selector);
|
3162
|
-
}
|
3163
|
-
getSelectorForTargetName(targetName) {
|
3164
|
-
const attributeName = this.schema.targetAttributeForScope(this.identifier);
|
3165
|
-
return attributeValueContainsToken(attributeName, targetName);
|
3166
|
-
}
|
3167
|
-
findLegacyTarget(targetName) {
|
3168
|
-
const selector = this.getLegacySelectorForTargetName(targetName);
|
3169
|
-
return this.deprecate(this.scope.findElement(selector), targetName);
|
3170
|
-
}
|
3171
|
-
findAllLegacyTargets(targetName) {
|
3172
|
-
const selector = this.getLegacySelectorForTargetName(targetName);
|
3173
|
-
return this.scope.findAllElements(selector).map((element) => this.deprecate(element, targetName));
|
3174
|
-
}
|
3175
|
-
getLegacySelectorForTargetName(targetName) {
|
3176
|
-
const targetDescriptor = `${this.identifier}.${targetName}`;
|
3177
|
-
return attributeValueContainsToken(this.schema.targetAttribute, targetDescriptor);
|
3178
|
-
}
|
3179
|
-
deprecate(element, targetName) {
|
3180
|
-
if (element) {
|
3181
|
-
const { identifier } = this;
|
3182
|
-
const attributeName = this.schema.targetAttribute;
|
3183
|
-
const revisedAttributeName = this.schema.targetAttributeForScope(identifier);
|
3184
|
-
this.guide.warn(element, `target:${targetName}`, `Please replace ${attributeName}="${identifier}.${targetName}" with ${revisedAttributeName}="${targetName}". ` +
|
3185
|
-
`The ${attributeName} attribute is deprecated and will be removed in a future version of Stimulus.`);
|
3186
|
-
}
|
3187
|
-
return element;
|
3188
|
-
}
|
3189
|
-
get guide() {
|
3190
|
-
return this.scope.guide;
|
3191
|
-
}
|
3192
|
-
}
|
3193
|
-
|
3194
|
-
class OutletSet {
|
3195
|
-
constructor(scope, controllerElement) {
|
3196
|
-
this.scope = scope;
|
3197
|
-
this.controllerElement = controllerElement;
|
3198
|
-
}
|
3199
|
-
get element() {
|
3200
|
-
return this.scope.element;
|
3201
|
-
}
|
3202
|
-
get identifier() {
|
3203
|
-
return this.scope.identifier;
|
3204
|
-
}
|
3205
|
-
get schema() {
|
3206
|
-
return this.scope.schema;
|
3207
|
-
}
|
3208
|
-
has(outletName) {
|
3209
|
-
return this.find(outletName) != null;
|
3210
|
-
}
|
3211
|
-
find(...outletNames) {
|
3212
|
-
return outletNames.reduce((outlet, outletName) => outlet || this.findOutlet(outletName), undefined);
|
3213
|
-
}
|
3214
|
-
findAll(...outletNames) {
|
3215
|
-
return outletNames.reduce((outlets, outletName) => [...outlets, ...this.findAllOutlets(outletName)], []);
|
3216
|
-
}
|
3217
|
-
getSelectorForOutletName(outletName) {
|
3218
|
-
const attributeName = this.schema.outletAttributeForScope(this.identifier, outletName);
|
3219
|
-
return this.controllerElement.getAttribute(attributeName);
|
3220
|
-
}
|
3221
|
-
findOutlet(outletName) {
|
3222
|
-
const selector = this.getSelectorForOutletName(outletName);
|
3223
|
-
if (selector)
|
3224
|
-
return this.findElement(selector, outletName);
|
3225
|
-
}
|
3226
|
-
findAllOutlets(outletName) {
|
3227
|
-
const selector = this.getSelectorForOutletName(outletName);
|
3228
|
-
return selector ? this.findAllElements(selector, outletName) : [];
|
3229
|
-
}
|
3230
|
-
findElement(selector, outletName) {
|
3231
|
-
const elements = this.scope.queryElements(selector);
|
3232
|
-
return elements.filter((element) => this.matchesElement(element, selector, outletName))[0];
|
3233
|
-
}
|
3234
|
-
findAllElements(selector, outletName) {
|
3235
|
-
const elements = this.scope.queryElements(selector);
|
3236
|
-
return elements.filter((element) => this.matchesElement(element, selector, outletName));
|
3237
|
-
}
|
3238
|
-
matchesElement(element, selector, outletName) {
|
3239
|
-
const controllerAttribute = element.getAttribute(this.scope.schema.controllerAttribute) || "";
|
3240
|
-
return element.matches(selector) && controllerAttribute.split(" ").includes(outletName);
|
3241
|
-
}
|
3242
|
-
}
|
3243
|
-
|
3244
|
-
class Scope {
|
3245
|
-
constructor(schema, element, identifier, logger) {
|
3246
|
-
this.targets = new TargetSet(this);
|
3247
|
-
this.classes = new ClassMap(this);
|
3248
|
-
this.data = new DataMap(this);
|
3249
|
-
this.containsElement = (element) => {
|
3250
|
-
return element.closest(this.controllerSelector) === this.element;
|
3251
|
-
};
|
3252
|
-
this.schema = schema;
|
3253
|
-
this.element = element;
|
3254
|
-
this.identifier = identifier;
|
3255
|
-
this.guide = new Guide(logger);
|
3256
|
-
this.outlets = new OutletSet(this.documentScope, element);
|
3257
|
-
}
|
3258
|
-
findElement(selector) {
|
3259
|
-
return this.element.matches(selector) ? this.element : this.queryElements(selector).find(this.containsElement);
|
3260
|
-
}
|
3261
|
-
findAllElements(selector) {
|
3262
|
-
return [
|
3263
|
-
...(this.element.matches(selector) ? [this.element] : []),
|
3264
|
-
...this.queryElements(selector).filter(this.containsElement),
|
3265
|
-
];
|
3266
|
-
}
|
3267
|
-
queryElements(selector) {
|
3268
|
-
return Array.from(this.element.querySelectorAll(selector));
|
3269
|
-
}
|
3270
|
-
get controllerSelector() {
|
3271
|
-
return attributeValueContainsToken(this.schema.controllerAttribute, this.identifier);
|
3272
|
-
}
|
3273
|
-
get isDocumentScope() {
|
3274
|
-
return this.element === document.documentElement;
|
3275
|
-
}
|
3276
|
-
get documentScope() {
|
3277
|
-
return this.isDocumentScope
|
3278
|
-
? this
|
3279
|
-
: new Scope(this.schema, document.documentElement, this.identifier, this.guide.logger);
|
3280
|
-
}
|
3281
|
-
}
|
3282
|
-
|
3283
|
-
class ScopeObserver {
|
3284
|
-
constructor(element, schema, delegate) {
|
3285
|
-
this.element = element;
|
3286
|
-
this.schema = schema;
|
3287
|
-
this.delegate = delegate;
|
3288
|
-
this.valueListObserver = new ValueListObserver(this.element, this.controllerAttribute, this);
|
3289
|
-
this.scopesByIdentifierByElement = new WeakMap();
|
3290
|
-
this.scopeReferenceCounts = new WeakMap();
|
3291
|
-
}
|
3292
|
-
start() {
|
3293
|
-
this.valueListObserver.start();
|
3294
|
-
}
|
3295
|
-
stop() {
|
3296
|
-
this.valueListObserver.stop();
|
3297
|
-
}
|
3298
|
-
get controllerAttribute() {
|
3299
|
-
return this.schema.controllerAttribute;
|
3300
|
-
}
|
3301
|
-
parseValueForToken(token) {
|
3302
|
-
const { element, content: identifier } = token;
|
3303
|
-
return this.parseValueForElementAndIdentifier(element, identifier);
|
3304
|
-
}
|
3305
|
-
parseValueForElementAndIdentifier(element, identifier) {
|
3306
|
-
const scopesByIdentifier = this.fetchScopesByIdentifierForElement(element);
|
3307
|
-
let scope = scopesByIdentifier.get(identifier);
|
3308
|
-
if (!scope) {
|
3309
|
-
scope = this.delegate.createScopeForElementAndIdentifier(element, identifier);
|
3310
|
-
scopesByIdentifier.set(identifier, scope);
|
3311
|
-
}
|
3312
|
-
return scope;
|
3313
|
-
}
|
3314
|
-
elementMatchedValue(element, value) {
|
3315
|
-
const referenceCount = (this.scopeReferenceCounts.get(value) || 0) + 1;
|
3316
|
-
this.scopeReferenceCounts.set(value, referenceCount);
|
3317
|
-
if (referenceCount == 1) {
|
3318
|
-
this.delegate.scopeConnected(value);
|
3319
|
-
}
|
3320
|
-
}
|
3321
|
-
elementUnmatchedValue(element, value) {
|
3322
|
-
const referenceCount = this.scopeReferenceCounts.get(value);
|
3323
|
-
if (referenceCount) {
|
3324
|
-
this.scopeReferenceCounts.set(value, referenceCount - 1);
|
3325
|
-
if (referenceCount == 1) {
|
3326
|
-
this.delegate.scopeDisconnected(value);
|
3327
|
-
}
|
3328
|
-
}
|
3329
|
-
}
|
3330
|
-
fetchScopesByIdentifierForElement(element) {
|
3331
|
-
let scopesByIdentifier = this.scopesByIdentifierByElement.get(element);
|
3332
|
-
if (!scopesByIdentifier) {
|
3333
|
-
scopesByIdentifier = new Map();
|
3334
|
-
this.scopesByIdentifierByElement.set(element, scopesByIdentifier);
|
3335
|
-
}
|
3336
|
-
return scopesByIdentifier;
|
3337
|
-
}
|
3338
|
-
}
|
3339
|
-
|
3340
|
-
class Router {
|
3341
|
-
constructor(application) {
|
3342
|
-
this.application = application;
|
3343
|
-
this.scopeObserver = new ScopeObserver(this.element, this.schema, this);
|
3344
|
-
this.scopesByIdentifier = new Multimap();
|
3345
|
-
this.modulesByIdentifier = new Map();
|
3346
|
-
}
|
3347
|
-
get element() {
|
3348
|
-
return this.application.element;
|
3349
|
-
}
|
3350
|
-
get schema() {
|
3351
|
-
return this.application.schema;
|
3352
|
-
}
|
3353
|
-
get logger() {
|
3354
|
-
return this.application.logger;
|
3355
|
-
}
|
3356
|
-
get controllerAttribute() {
|
3357
|
-
return this.schema.controllerAttribute;
|
3358
|
-
}
|
3359
|
-
get modules() {
|
3360
|
-
return Array.from(this.modulesByIdentifier.values());
|
3361
|
-
}
|
3362
|
-
get contexts() {
|
3363
|
-
return this.modules.reduce((contexts, module) => contexts.concat(module.contexts), []);
|
3364
|
-
}
|
3365
|
-
start() {
|
3366
|
-
this.scopeObserver.start();
|
3367
|
-
}
|
3368
|
-
stop() {
|
3369
|
-
this.scopeObserver.stop();
|
3370
|
-
}
|
3371
|
-
loadDefinition(definition) {
|
3372
|
-
this.unloadIdentifier(definition.identifier);
|
3373
|
-
const module = new Module(this.application, definition);
|
3374
|
-
this.connectModule(module);
|
3375
|
-
const afterLoad = definition.controllerConstructor.afterLoad;
|
3376
|
-
if (afterLoad) {
|
3377
|
-
afterLoad.call(definition.controllerConstructor, definition.identifier, this.application);
|
3378
|
-
}
|
3379
|
-
}
|
3380
|
-
unloadIdentifier(identifier) {
|
3381
|
-
const module = this.modulesByIdentifier.get(identifier);
|
3382
|
-
if (module) {
|
3383
|
-
this.disconnectModule(module);
|
3384
|
-
}
|
3385
|
-
}
|
3386
|
-
getContextForElementAndIdentifier(element, identifier) {
|
3387
|
-
const module = this.modulesByIdentifier.get(identifier);
|
3388
|
-
if (module) {
|
3389
|
-
return module.contexts.find((context) => context.element == element);
|
3390
|
-
}
|
3391
|
-
}
|
3392
|
-
proposeToConnectScopeForElementAndIdentifier(element, identifier) {
|
3393
|
-
const scope = this.scopeObserver.parseValueForElementAndIdentifier(element, identifier);
|
3394
|
-
if (scope) {
|
3395
|
-
this.scopeObserver.elementMatchedValue(scope.element, scope);
|
3396
|
-
}
|
3397
|
-
else {
|
3398
|
-
console.error(`Couldn't find or create scope for identifier: "${identifier}" and element:`, element);
|
3399
|
-
}
|
3400
|
-
}
|
3401
|
-
handleError(error, message, detail) {
|
3402
|
-
this.application.handleError(error, message, detail);
|
3403
|
-
}
|
3404
|
-
createScopeForElementAndIdentifier(element, identifier) {
|
3405
|
-
return new Scope(this.schema, element, identifier, this.logger);
|
3406
|
-
}
|
3407
|
-
scopeConnected(scope) {
|
3408
|
-
this.scopesByIdentifier.add(scope.identifier, scope);
|
3409
|
-
const module = this.modulesByIdentifier.get(scope.identifier);
|
3410
|
-
if (module) {
|
3411
|
-
module.connectContextForScope(scope);
|
3412
|
-
}
|
3413
|
-
}
|
3414
|
-
scopeDisconnected(scope) {
|
3415
|
-
this.scopesByIdentifier.delete(scope.identifier, scope);
|
3416
|
-
const module = this.modulesByIdentifier.get(scope.identifier);
|
3417
|
-
if (module) {
|
3418
|
-
module.disconnectContextForScope(scope);
|
3419
|
-
}
|
3420
|
-
}
|
3421
|
-
connectModule(module) {
|
3422
|
-
this.modulesByIdentifier.set(module.identifier, module);
|
3423
|
-
const scopes = this.scopesByIdentifier.getValuesForKey(module.identifier);
|
3424
|
-
scopes.forEach((scope) => module.connectContextForScope(scope));
|
3425
|
-
}
|
3426
|
-
disconnectModule(module) {
|
3427
|
-
this.modulesByIdentifier.delete(module.identifier);
|
3428
|
-
const scopes = this.scopesByIdentifier.getValuesForKey(module.identifier);
|
3429
|
-
scopes.forEach((scope) => module.disconnectContextForScope(scope));
|
3430
|
-
}
|
3431
|
-
}
|
3432
|
-
|
3433
|
-
const defaultSchema = {
|
3434
|
-
controllerAttribute: "data-controller",
|
3435
|
-
actionAttribute: "data-action",
|
3436
|
-
targetAttribute: "data-target",
|
3437
|
-
targetAttributeForScope: (identifier) => `data-${identifier}-target`,
|
3438
|
-
outletAttributeForScope: (identifier, outlet) => `data-${identifier}-${outlet}-outlet`,
|
3439
|
-
keyMappings: Object.assign(Object.assign({ enter: "Enter", tab: "Tab", esc: "Escape", space: " ", up: "ArrowUp", down: "ArrowDown", left: "ArrowLeft", right: "ArrowRight", home: "Home", end: "End", page_up: "PageUp", page_down: "PageDown" }, objectFromEntries("abcdefghijklmnopqrstuvwxyz".split("").map((c) => [c, c]))), objectFromEntries("0123456789".split("").map((n) => [n, n]))),
|
3440
|
-
};
|
3441
|
-
function objectFromEntries(array) {
|
3442
|
-
return array.reduce((memo, [k, v]) => (Object.assign(Object.assign({}, memo), { [k]: v })), {});
|
3443
|
-
}
|
3444
|
-
|
3445
|
-
class Application {
|
3446
|
-
constructor(element = document.documentElement, schema = defaultSchema) {
|
3447
|
-
this.logger = console;
|
3448
|
-
this.debug = false;
|
3449
|
-
this.logDebugActivity = (identifier, functionName, detail = {}) => {
|
3450
|
-
if (this.debug) {
|
3451
|
-
this.logFormattedMessage(identifier, functionName, detail);
|
3452
|
-
}
|
3453
|
-
};
|
3454
|
-
this.element = element;
|
3455
|
-
this.schema = schema;
|
3456
|
-
this.dispatcher = new Dispatcher(this);
|
3457
|
-
this.router = new Router(this);
|
3458
|
-
this.actionDescriptorFilters = Object.assign({}, defaultActionDescriptorFilters);
|
3459
|
-
}
|
3460
|
-
static start(element, schema) {
|
3461
|
-
const application = new this(element, schema);
|
3462
|
-
application.start();
|
3463
|
-
return application;
|
3464
|
-
}
|
3465
|
-
async start() {
|
3466
|
-
await domReady();
|
3467
|
-
this.logDebugActivity("application", "starting");
|
3468
|
-
this.dispatcher.start();
|
3469
|
-
this.router.start();
|
3470
|
-
this.logDebugActivity("application", "start");
|
3471
|
-
}
|
3472
|
-
stop() {
|
3473
|
-
this.logDebugActivity("application", "stopping");
|
3474
|
-
this.dispatcher.stop();
|
3475
|
-
this.router.stop();
|
3476
|
-
this.logDebugActivity("application", "stop");
|
3477
|
-
}
|
3478
|
-
register(identifier, controllerConstructor) {
|
3479
|
-
this.load({ identifier, controllerConstructor });
|
3480
|
-
}
|
3481
|
-
registerActionOption(name, filter) {
|
3482
|
-
this.actionDescriptorFilters[name] = filter;
|
3483
|
-
}
|
3484
|
-
load(head, ...rest) {
|
3485
|
-
const definitions = Array.isArray(head) ? head : [head, ...rest];
|
3486
|
-
definitions.forEach((definition) => {
|
3487
|
-
if (definition.controllerConstructor.shouldLoad) {
|
3488
|
-
this.router.loadDefinition(definition);
|
3489
|
-
}
|
3490
|
-
});
|
3491
|
-
}
|
3492
|
-
unload(head, ...rest) {
|
3493
|
-
const identifiers = Array.isArray(head) ? head : [head, ...rest];
|
3494
|
-
identifiers.forEach((identifier) => this.router.unloadIdentifier(identifier));
|
3495
|
-
}
|
3496
|
-
get controllers() {
|
3497
|
-
return this.router.contexts.map((context) => context.controller);
|
3498
|
-
}
|
3499
|
-
getControllerForElementAndIdentifier(element, identifier) {
|
3500
|
-
const context = this.router.getContextForElementAndIdentifier(element, identifier);
|
3501
|
-
return context ? context.controller : null;
|
3502
|
-
}
|
3503
|
-
handleError(error, message, detail) {
|
3504
|
-
var _a;
|
3505
|
-
this.logger.error(`%s\n\n%o\n\n%o`, message, error, detail);
|
3506
|
-
(_a = window.onerror) === null || _a === void 0 ? void 0 : _a.call(window, message, "", 0, 0, error);
|
3507
|
-
}
|
3508
|
-
logFormattedMessage(identifier, functionName, detail = {}) {
|
3509
|
-
detail = Object.assign({ application: this }, detail);
|
3510
|
-
this.logger.groupCollapsed(`${identifier} #${functionName}`);
|
3511
|
-
this.logger.log("details:", Object.assign({}, detail));
|
3512
|
-
this.logger.groupEnd();
|
3513
|
-
}
|
3514
|
-
}
|
3515
|
-
function domReady() {
|
3516
|
-
return new Promise((resolve) => {
|
3517
|
-
if (document.readyState == "loading") {
|
3518
|
-
document.addEventListener("DOMContentLoaded", () => resolve());
|
3519
|
-
}
|
3520
|
-
else {
|
3521
|
-
resolve();
|
3522
|
-
}
|
3523
|
-
});
|
3524
|
-
}
|
3525
|
-
|
3526
1398
|
class StimulusReloader {
|
3527
1399
|
static async reload(filePattern) {
|
3528
1400
|
const document = await reloadHtmlDocument();
|
@@ -3532,7 +1404,7 @@ var HotwireSpark = (function () {
|
|
3532
1404
|
let filePattern = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : /./;
|
3533
1405
|
this.document = document;
|
3534
1406
|
this.filePattern = filePattern;
|
3535
|
-
this.application = window.Stimulus
|
1407
|
+
this.application = window.Stimulus;
|
3536
1408
|
}
|
3537
1409
|
async reload() {
|
3538
1410
|
log("Reload Stimulus controllers...");
|