@codegouvfr/react-dsfr
Version:
French State Design System React integration library
1,640 lines (1,321 loc) • 399 kB
JavaScript
/*! DSFR v1.12.1 | SPDX-License-Identifier: MIT | License-Filename: LICENSE.md | restricted use (see terms and conditions) */
(function () {
'use strict';
var State = function State () {
this.modules = {};
};
var prototypeAccessors$b = { isActive: { configurable: true },isLegacy: { configurable: true } };
State.prototype.create = function create (ModuleClass) {
var module = new ModuleClass();
this.modules[module.type] = module;
};
State.prototype.getModule = function getModule (type) {
return this.modules[type];
};
State.prototype.add = function add (type, item) {
this.modules[type].add(item);
};
State.prototype.remove = function remove (type, item) {
this.modules[type].remove(item);
};
prototypeAccessors$b.isActive.get = function () {
return this._isActive;
};
prototypeAccessors$b.isActive.set = function (value) {
var this$1$1 = this;
if (value === this._isActive) { return; }
this._isActive = value;
var values = Object.keys(this.modules).map(function (e) {
return this$1$1.modules[e];
});
if (value) {
for (var i = 0, list = values; i < list.length; i += 1) {
var module = list[i];
module.activate();
}
} else {
for (var i$1 = 0, list$1 = values; i$1 < list$1.length; i$1 += 1) {
var module$1 = list$1[i$1];
module$1.deactivate();
}
}
};
prototypeAccessors$b.isLegacy.get = function () {
return this._isLegacy;
};
prototypeAccessors$b.isLegacy.set = function (value) {
if (value === this._isLegacy) { return; }
this._isLegacy = value;
};
Object.defineProperties( State.prototype, prototypeAccessors$b );
var state = new State();
var config = {
prefix: 'fr',
namespace: 'dsfr',
organisation: '@gouvfr',
version: '1.12.1'
};
var LogLevel = function LogLevel (level, light, dark, logger) {
this.level = level;
this.light = light;
this.dark = dark;
switch (logger) {
case 'warn':
this.logger = console.warn;
break;
case 'error':
this.logger = console.error;
break;
default:
this.logger = console.log;
}
};
var prototypeAccessors$a = { color: { configurable: true } };
LogLevel.prototype.log = function log () {
var values = [], len = arguments.length;
while ( len-- ) values[ len ] = arguments[ len ];
var message = new Message(config.namespace);
for (var i = 0, list = values; i < list.length; i += 1) {
var value = list[i];
message.add(value);
}
this.print(message);
};
LogLevel.prototype.print = function print (message) {
message.setColor(this.color);
this.logger.apply(console, message.getMessage());
};
prototypeAccessors$a.color.get = function () {
return window.matchMedia('(prefers-color-scheme: dark)').matches ? this.dark : this.light;
};
Object.defineProperties( LogLevel.prototype, prototypeAccessors$a );
var Message = function Message (domain) {
this.inputs = ['%c'];
this.styles = ['font-family:Marianne', 'line-height: 1.5'];
this.objects = [];
if (domain) { this.add((domain + " :")); }
};
Message.prototype.add = function add (value) {
switch (typeof value) {
case 'object':
case 'function':
this.inputs.push('%o ');
this.objects.push(value);
break;
default:
this.inputs.push((value + " "));
}
};
Message.prototype.setColor = function setColor (color) {
this.styles.push(("color:" + color));
};
Message.prototype.getMessage = function getMessage () {
return [this.inputs.join(''), this.styles.join(';') ].concat( this.objects);
};
var LEVELS = {
log: new LogLevel(0, '#616161', '#989898'),
debug: new LogLevel(1, '#000091', '#8B8BFF'),
info: new LogLevel(2, '#007c3b', '#00ed70'),
warn: new LogLevel(3, '#ba4500', '#fa5c00', 'warn'),
error: new LogLevel(4, '#D80600', '#FF4641', 'error')
};
var Inspector = function Inspector () {
var this$1$1 = this;
this.level = 2;
var loop = function ( id ) {
var level = LEVELS[id];
this$1$1[id] = function () {
var msgs = [], len = arguments.length;
while ( len-- ) msgs[ len ] = arguments[ len ];
if (this$1$1.level <= level.level) { level.log.apply(level, msgs); }
};
this$1$1[id].print = level.print.bind(level);
};
for (var id in LEVELS) loop( id );
};
Inspector.prototype.state = function state$1 () {
var message = new Message();
message.add(state);
this.log.print(message);
};
Inspector.prototype.tree = function tree () {
var stage = state.getModule('stage');
if (!stage) { return; }
var message = new Message();
this._branch(stage.root, 0, message);
this.log.print(message);
};
Inspector.prototype._branch = function _branch (element, space, message) {
var branch = '';
if (space > 0) {
var indent = '';
for (var i = 0; i < space; i++) { indent += ' '; }
// branch += indent + '|\n';
branch += indent + '└─ ';
}
branch += "[" + (element.id) + "] " + (element.html);
message.add(branch);
message.add({ '@': element });
message.add('\n');
for (var i$1 = 0, list = element.children; i$1 < list.length; i$1 += 1) {
var child = list[i$1];
branch += this._branch(child, space + 1, message);
}
};
var inspector = new Inspector();
var startAtDomContentLoaded = function (callback) {
if (document.readyState !== 'loading') { window.requestAnimationFrame(callback); }
else { document.addEventListener('DOMContentLoaded', callback); }
};
var startAuto = function (callback) {
// detect
startAtDomContentLoaded(callback);
};
var Modes = {
AUTO: 'auto',
MANUAL: 'manual',
RUNTIME: 'runtime',
LOADED: 'loaded',
VUE: 'vue',
ANGULAR: 'angular',
REACT: 'react'
};
var Options = function Options () {
this._mode = Modes.AUTO;
this.isStarted = false;
this.starting = this.start.bind(this);
this.preventManipulation = false;
};
var prototypeAccessors$9 = { mode: { configurable: true } };
Options.prototype.configure = function configure (settings, start, query) {
if ( settings === void 0 ) settings = {};
this.startCallback = start;
var isProduction = settings.production && (!query || query.production !== 'false');
switch (true) {
case query && !isNaN(query.level):
inspector.level = Number(query.level);
break;
case query && query.verbose && (query.verbose === 'true' || query.verbose === 1):
inspector.level = 0;
break;
case isProduction:
inspector.level = 999;
break;
case settings.verbose:
inspector.level = 0;
break;
}
inspector.info(("version " + (config.version)));
this.mode = settings.mode || Modes.AUTO;
};
prototypeAccessors$9.mode.set = function (value) {
switch (value) {
case Modes.AUTO:
this.preventManipulation = false;
startAuto(this.starting);
break;
case Modes.LOADED:
this.preventManipulation = false;
startAtDomContentLoaded(this.starting);
break;
case Modes.RUNTIME:
this.preventManipulation = false;
this.start();
break;
case Modes.MANUAL:
this.preventManipulation = false;
break;
case Modes.VUE:
this.preventManipulation = true;
break;
case Modes.ANGULAR:
this.preventManipulation = true;
break;
case Modes.REACT:
this.preventManipulation = true;
break;
default:
inspector.error('Illegal mode');
return;
}
this._mode = value;
inspector.info(("mode set to " + value));
};
prototypeAccessors$9.mode.get = function () {
return this._mode;
};
Options.prototype.start = function start () {
inspector.info('start');
this.startCallback();
};
Object.defineProperties( Options.prototype, prototypeAccessors$9 );
var options = new Options();
var Collection = function Collection () {
this._collection = [];
};
var prototypeAccessors$8 = { length: { configurable: true },collection: { configurable: true } };
Collection.prototype.forEach = function forEach (callback) {
this._collection.forEach(callback);
};
Collection.prototype.map = function map (callback) {
return this._collection.map(callback);
};
prototypeAccessors$8.length.get = function () {
return this._collection.length;
};
Collection.prototype.add = function add (collectable) {
if (this._collection.indexOf(collectable) > -1) { return false; }
this._collection.push(collectable);
if (this.onAdd) { this.onAdd(); }
if (this.onPopulate && this._collection.length === 1) { this.onPopulate(); }
return true;
};
Collection.prototype.remove = function remove (collectable) {
var index = this._collection.indexOf(collectable);
if (index === -1) { return false; }
this._collection.splice(index, 1);
if (this.onRemove) { this.onRemove(); }
if (this.onEmpty && this._collection.length === 0) { this.onEmpty(); }
};
Collection.prototype.execute = function execute () {
var args = [], len = arguments.length;
while ( len-- ) args[ len ] = arguments[ len ];
for (var i = 0, list = this._collection; i < list.length; i += 1) {
var collectable = list[i];
if (collectable) { collectable.apply(null, args);
} }
};
Collection.prototype.clear = function clear () {
this._collection.length = 0;
};
Collection.prototype.clone = function clone () {
var clone = new Collection();
clone._collection = this._collection.slice();
return clone;
};
prototypeAccessors$8.collection.get = function () {
return this._collection;
};
Object.defineProperties( Collection.prototype, prototypeAccessors$8 );
var Module = /*@__PURE__*/(function (Collection) {
function Module (type) {
Collection.call(this);
this.type = type;
this.isActive = false;
}
if ( Collection ) Module.__proto__ = Collection;
Module.prototype = Object.create( Collection && Collection.prototype );
Module.prototype.constructor = Module;
Module.prototype.activate = function activate () {};
Module.prototype.deactivate = function deactivate () {};
return Module;
}(Collection));
var ns = function (name) { return ((config.prefix) + "-" + name); };
ns.selector = function (name, notation) {
if (notation === undefined) { notation = '.'; }
return ("" + notation + (ns(name)));
};
ns.attr = function (name) { return ("data-" + (ns(name))); };
ns.attr.selector = function (name, value) {
var result = ns.attr(name);
if (value !== undefined) { result += "=\"" + value + "\""; }
return ("[" + result + "]");
};
ns.event = function (type) { return ((config.namespace) + "." + type); };
ns.emission = function (domain, type) { return ("emission:" + domain + "." + type); };
var querySelectorAllArray = function (element, selectors) { return Array.prototype.slice.call(element.querySelectorAll(selectors)); };
var queryParentSelector = function (element, selectors) {
var parent = element.parentElement;
if (parent.matches(selectors)) { return parent; }
if (parent === document.documentElement) { return null; }
return queryParentSelector(parent, selectors);
};
var Registration = function Registration (selector, InstanceClass, creator) {
this.selector = selector;
this.InstanceClass = InstanceClass;
this.creator = creator;
this.instances = new Collection();
this.isIntroduced = false;
this._instanceClassName = this.InstanceClass.instanceClassName;
this._instanceClassNames = this.getInstanceClassNames(this.InstanceClass);
this._property = this._instanceClassName.substring(0, 1).toLowerCase() + this._instanceClassName.substring(1);
var dashed = this._instanceClassName
.replace(/[^a-zA-Z0-9]+/g, '-')
.replace(/([A-Z]+)([A-Z][a-z])/g, '$1-$2')
.replace(/([a-z])([A-Z])/g, '$1-$2')
.replace(/([0-9])([^0-9])/g, '$1-$2')
.replace(/([^0-9])([0-9])/g, '$1-$2')
.toLowerCase();
this._attribute = ns.attr(("js-" + dashed));
};
var prototypeAccessors$7 = { instanceClassName: { configurable: true },instanceClassNames: { configurable: true },property: { configurable: true },attribute: { configurable: true } };
Registration.prototype.getInstanceClassNames = function getInstanceClassNames (InstanceClass) {
var prototype = Object.getPrototypeOf(InstanceClass);
if (!prototype || prototype.instanceClassName === 'Instance') { return [InstanceClass.instanceClassName]; }
return this.getInstanceClassNames(prototype).concat( [InstanceClass.instanceClassName]);
};
Registration.prototype.hasInstanceClassName = function hasInstanceClassName (instanceClassName) {
return this._instanceClassNames.indexOf(instanceClassName) > -1;
};
Registration.prototype.introduce = function introduce () {
if (this.isIntroduced) { return; }
this.isIntroduced = true;
state.getModule('stage').parse(document.documentElement, this);
};
Registration.prototype.parse = function parse (node, nonRecursive) {
var nodes = [];
if (node.matches && node.matches(this.selector)) { nodes.push(node); }
// eslint-disable-next-line no-useless-call
if (!nonRecursive && node.querySelectorAll && node.querySelector(this.selector)) { nodes.push.apply(nodes, querySelectorAllArray(node, this.selector)); }
return nodes;
};
Registration.prototype.create = function create (element) {
if (!element.node.matches(this.selector)) { return; }
var instance = new this.InstanceClass();
this.instances.add(instance);
return instance;
};
Registration.prototype.remove = function remove (instance) {
this.instances.remove(instance);
};
Registration.prototype.dispose = function dispose () {
var instances = this.instances.collection;
for (var i = instances.length - 1; i > -1; i--) { instances[i]._dispose(); }
this.creator = null;
};
prototypeAccessors$7.instanceClassName.get = function () {
return this._instanceClassName;
};
prototypeAccessors$7.instanceClassNames.get = function () {
return this._instanceClassNames;
};
prototypeAccessors$7.property.get = function () {
return this._property;
};
prototypeAccessors$7.attribute.get = function () {
return this._attribute;
};
Object.defineProperties( Registration.prototype, prototypeAccessors$7 );
var Register = /*@__PURE__*/(function (Module) {
function Register () {
Module.call(this, 'register');
}
if ( Module ) Register.__proto__ = Module;
Register.prototype = Object.create( Module && Module.prototype );
Register.prototype.constructor = Register;
Register.prototype.register = function register (selector, InstanceClass, creator) {
var registration = new Registration(selector, InstanceClass, creator);
this.add(registration);
if (state.isActive) { registration.introduce(); }
return registration;
};
Register.prototype.activate = function activate () {
for (var i = 0, list = this.collection; i < list.length; i += 1) {
var registration = list[i];
registration.introduce();
}
};
Register.prototype.remove = function remove (registration) {
registration.dispose();
Module.prototype.remove.call(this, registration);
};
return Register;
}(Module));
var count = 0;
var Element$1 = function Element (node, id) {
if (!id) {
count++;
this.id = count;
} else { this.id = id; }
this.node = node;
this.attributeNames = [];
this.instances = [];
this._children = [];
this._parent = null;
this._projects = [];
};
var prototypeAccessors$6 = { proxy: { configurable: true },html: { configurable: true },parent: { configurable: true },ascendants: { configurable: true },children: { configurable: true },descendants: { configurable: true } };
prototypeAccessors$6.proxy.get = function () {
var scope = this;
if (!this._proxy) {
this._proxy = {
id: this.id,
get parent () {
return scope.parent ? scope.parent.proxy : null;
},
get children () {
return scope.children.map(function (child) { return child.proxy; });
}
};
for (var i = 0, list = this.instances; i < list.length; i += 1) {
var instance = list[i];
this._proxy[instance.registration.property] = instance.proxy;
}
}
return this._proxy;
};
prototypeAccessors$6.html.get = function () {
if (!this.node || !this.node.outerHTML) { return ''; }
var end = this.node.outerHTML.indexOf('>');
return this.node.outerHTML.substring(0, end + 1);
};
Element$1.prototype.project = function project (registration) {
if (this._projects.indexOf(registration) === -1) { this._projects.push(registration); }
};
Element$1.prototype.populate = function populate () {
var projects = this._projects.slice();
this._projects.length = 0;
for (var i = 0, list = projects; i < list.length; i += 1) {
var registration = list[i];
this.create(registration);
}
};
Element$1.prototype.create = function create (registration) {
if (this.hasInstance(registration.instanceClassName)) {
// inspector.debug(`failed creation, instance of ${registration.instanceClassName} already exists on element [${this.id}]`);
return;
}
inspector.debug(("create instance of " + (registration.instanceClassName) + " on element [" + (this.id) + "]"));
var instance = registration.create(this);
this.instances.push(instance);
instance._config(this, registration);
if (this._proxy) { this._proxy[registration.property] = instance.proxy; }
};
Element$1.prototype.remove = function remove (instance) {
var index = this.instances.indexOf(instance);
if (index > -1) { this.instances.splice(index, 1); }
if (this._proxy) { delete this._proxy[instance.registration.property]; }
};
prototypeAccessors$6.parent.get = function () {
return this._parent;
};
prototypeAccessors$6.ascendants.get = function () {
return [this.parent ].concat( this.parent.ascendants);
};
prototypeAccessors$6.children.get = function () {
return this._children;
};
prototypeAccessors$6.descendants.get = function () {
var descendants = [].concat( this._children );
this._children.forEach(function (child) { return descendants.push.apply(descendants, child.descendants); });
return descendants;
};
// TODO : emit ascendant et descendant de changement ?
Element$1.prototype.addChild = function addChild (child, index) {
if (this._children.indexOf(child) > -1) { return null; }
child._parent = this;
if (!isNaN(index) && index > -1 && index < this._children.length) { this._children.splice(index, 0, child); }
else { this._children.push(child); }
return child;
};
Element$1.prototype.removeChild = function removeChild (child) {
var index = this._children.indexOf(child);
if (index === -1) { return null; }
child._parent = null;
this._children.splice(index, 1);
};
Element$1.prototype.emit = function emit (type, data) {
var elements = state.getModule('stage').collection;
var response = [];
for (var i = 0, list = elements; i < list.length; i += 1) {
var element = list[i];
response.push.apply(response, element._emit(type, data));
}
return response;
};
Element$1.prototype._emit = function _emit (type, data) {
var response = [];
for (var i = 0, list = this.instances; i < list.length; i += 1) {
var instance = list[i];
response.push.apply(response, instance._emitter.emit(type, data));
}
return response;
};
Element$1.prototype.ascend = function ascend (type, data) {
if (this._parent) { return this._parent._ascend(type, data); }
return [];
};
Element$1.prototype._ascend = function _ascend (type, data) {
var response = [];
for (var i = 0, list = this.instances; i < list.length; i += 1) {
var instance = list[i];
response.push.apply(response, instance._ascent.emit(type, data));
}
if (this._parent) { response.push.apply(response, this._parent._ascend(type, data)); }
return response;
};
Element$1.prototype.descend = function descend (type, data) {
var response = [];
for (var i = 0, list = this._children; i < list.length; i += 1) {
var child = list[i];
response.push.apply(response, child._descend(type, data));
}
return response;
};
Element$1.prototype._descend = function _descend (type, data) {
var response = [];
for (var i = 0, list = this.instances; i < list.length; i += 1) {
var instance = list[i];
response.push.apply(response, instance._descent.emit(type, data));
}
for (var i$1 = 0, list$1 = this._children; i$1 < list$1.length; i$1 += 1) {
var child = list$1[i$1];
response.push.apply(response, child._descend(type, data));
}
return response;
};
Element$1.prototype.getInstance = function getInstance (instanceClassName) {
for (var i = 0, list = this.instances; i < list.length; i += 1) {
var instance = list[i];
if (instance.registration.hasInstanceClassName(instanceClassName)) { return instance;
} }
return null;
};
Element$1.prototype.hasInstance = function hasInstance (instanceClassName) {
return this.getInstance(instanceClassName) !== null;
};
Element$1.prototype.getDescendantInstances = function getDescendantInstances (instanceClassName, stopAtInstanceClassName, stopAtFirstInstance) {
if (!instanceClassName) { return []; }
var instances = [];
for (var i = 0, list = this._children; i < list.length; i += 1) {
var child = list[i];
var instance = child.getInstance(instanceClassName);
if (instance) {
instances.push(instance);
if (stopAtFirstInstance) { continue; }
}
if ((!stopAtInstanceClassName || !child.hasInstance(stopAtInstanceClassName)) && child.children.length) { instances.push.apply(instances, child.getDescendantInstances(instanceClassName, stopAtInstanceClassName, stopAtFirstInstance)); }
}
return instances;
};
Element$1.prototype.getAscendantInstance = function getAscendantInstance (instanceClassName, stopAtInstanceClassName) {
if (!instanceClassName || !this._parent) { return null; }
var instance = this._parent.getInstance(instanceClassName);
if (instance) { return instance; }
if (stopAtInstanceClassName && this._parent.hasInstance(stopAtInstanceClassName)) { return null; }
return this._parent.getAscendantInstance(instanceClassName, stopAtInstanceClassName);
};
Element$1.prototype.dispose = function dispose () {
for (var i = this.instances.length - 1; i >= 0; i--) {
var instance = this.instances[i];
if (instance) { instance._dispose(); }
}
this.instances.length = 0;
state.remove('stage', this);
this.parent.removeChild(this);
this._children.length = 0;
inspector.debug(("remove element [" + (this.id) + "] " + (this.html)));
};
Element$1.prototype.prepare = function prepare (attributeName) {
if (this.attributeNames.indexOf(attributeName) === -1) { this.attributeNames.push(attributeName); }
};
Element$1.prototype.examine = function examine () {
var attributeNames = this.attributeNames.slice();
this.attributeNames.length = 0;
for (var i = this.instances.length - 1; i > -1; i--) { this.instances[i].examine(attributeNames); }
};
Object.defineProperties( Element$1.prototype, prototypeAccessors$6 );
var RootEmission = {
CLICK: ns.emission('root', 'click'),
KEYDOWN: ns.emission('root', 'keydown'),
KEYUP: ns.emission('root', 'keyup')
};
var KeyCodes = {
TAB: {
id: 'tab',
value: 9
},
ESCAPE: {
id: 'escape',
value: 27
},
END: {
id: 'end',
value: 35
},
HOME: {
id: 'home',
value: 36
},
LEFT: {
id: 'left',
value: 37
},
UP: {
id: 'up',
value: 38
},
RIGHT: {
id: 'right',
value: 39
},
DOWN: {
id: 'down',
value: 40
}
};
var getKeyCode = function (keyCode) { return Object.values(KeyCodes).filter(function (entry) { return entry.value === keyCode; })[0]; };
var Root = /*@__PURE__*/(function (Element) {
function Root () {
Element.call(this, document.documentElement, 'root');
this.node.setAttribute(ns.attr('js'), true);
this.listen();
}
if ( Element ) Root.__proto__ = Element;
Root.prototype = Object.create( Element && Element.prototype );
Root.prototype.constructor = Root;
Root.prototype.listen = function listen () {
// TODO v2 => listener au niveau des éléments qui redistribuent aux instances.
document.documentElement.addEventListener('click', this.click.bind(this), { capture: true });
document.documentElement.addEventListener('keydown', this.keydown.bind(this), { capture: true });
document.documentElement.addEventListener('keyup', this.keyup.bind(this), { capture: true });
};
Root.prototype.click = function click (e) {
this.emit(RootEmission.CLICK, e.target);
};
Root.prototype.keydown = function keydown (e) {
this.emit(RootEmission.KEYDOWN, getKeyCode(e.keyCode));
};
Root.prototype.keyup = function keyup (e) {
this.emit(RootEmission.KEYUP, getKeyCode(e.keyCode));
};
return Root;
}(Element$1));
var Stage = /*@__PURE__*/(function (Module) {
function Stage () {
Module.call(this, 'stage');
this.root = new Root();
Module.prototype.add.call(this, this.root);
this.observer = new MutationObserver(this.mutate.bind(this));
this.modifications = [];
this.willModify = false;
this.modifying = this.modify.bind(this);
}
if ( Module ) Stage.__proto__ = Module;
Stage.prototype = Object.create( Module && Module.prototype );
Stage.prototype.constructor = Stage;
Stage.prototype.hasElement = function hasElement (node) {
for (var i = 0, list = this.collection; i < list.length; i += 1) {
var element = list[i];
if (element.node === node) { return true;
} }
return false;
};
Stage.prototype.getElement = function getElement (node) {
for (var i = 0, list = this.collection; i < list.length; i += 1) {
var element$1 = list[i];
if (element$1.node === node) { return element$1;
} }
var element = new Element$1(node);
this.add(element);
inspector.debug(("add element [" + (element.id) + "] " + (element.html)));
return element;
};
Stage.prototype.getProxy = function getProxy (node) {
if (!this.hasElement(node)) { return null; }
var element = this.getElement(node);
return element.proxy;
};
Stage.prototype.add = function add (element) {
Module.prototype.add.call(this, element);
this.put(element, this.root);
};
Stage.prototype.put = function put (element, branch) {
var index = 0;
for (var i = branch.children.length - 1; i > -1; i--) {
var child = branch.children[i];
var position = element.node.compareDocumentPosition(child.node);
if (position & Node.DOCUMENT_POSITION_CONTAINS) {
this.put(element, child);
return;
} else if (position & Node.DOCUMENT_POSITION_CONTAINED_BY) {
branch.removeChild(child);
element.addChild(child, 0);
} else if (position & Node.DOCUMENT_POSITION_PRECEDING) {
index = i + 1;
break;
}
}
branch.addChild(element, index);
};
Stage.prototype.activate = function activate () {
this.observer.observe(document.documentElement, { childList: true, subtree: true, attributes: true });
};
Stage.prototype.deactivate = function deactivate () {
this.observer.disconnect();
};
Stage.prototype.mutate = function mutate (mutations) {
var this$1$1 = this;
var examinations = [];
mutations.forEach(function (mutation) {
switch (mutation.type) {
case 'childList':
mutation.removedNodes.forEach(function (node) { return this$1$1.dispose(node); });
mutation.addedNodes.forEach(function (node) { return this$1$1.parse(node); });
break;
case 'attributes':
if (this$1$1.hasElement(mutation.target)) {
var element = this$1$1.getElement(mutation.target);
element.prepare(mutation.attributeName);
if (examinations.indexOf(element) === -1) { examinations.push(element); }
for (var i = 0, list = element.descendants; i < list.length; i += 1) {
var descendant = list[i];
if (examinations.indexOf(descendant) === -1) { examinations.push(descendant);
} }
}
if (this$1$1.modifications.indexOf(mutation.target) === -1) { this$1$1.modifications.push(mutation.target); }
break;
}
});
examinations.forEach(function (element) { return element.examine(); });
if (this.modifications.length && !this.willModify) {
this.willModify = true;
window.requestAnimationFrame(this.modifying);
}
};
Stage.prototype.modify = function modify () {
this.willModify = false;
var targets = this.modifications.slice();
this.modifications.length = 0;
for (var i = 0, list = targets; i < list.length; i += 1) {
var target = list[i];
if (document.documentElement.contains(target)) { this.parse(target);
} }
};
Stage.prototype.dispose = function dispose (node) {
var disposables = [];
this.forEach(function (element) {
if (node.contains(element.node)) { disposables.push(element); }
});
for (var i = 0, list = disposables; i < list.length; i += 1) {
var disposable = list[i];
disposable.dispose();
this.remove(disposable);
}
};
Stage.prototype.parse = function parse (node, registration, nonRecursive) {
var registrations = registration ? [registration] : state.getModule('register').collection;
var creations = [];
for (var i$1 = 0, list$1 = registrations; i$1 < list$1.length; i$1 += 1) {
var registration$1 = list$1[i$1];
var nodes = registration$1.parse(node, nonRecursive);
for (var i = 0, list = nodes; i < list.length; i += 1) {
var n = list[i];
var element = this.getElement(n);
element.project(registration$1);
if (creations.indexOf(element) === -1) { creations.push(element); }
}
}
for (var i$2 = 0, list$2 = creations; i$2 < list$2.length; i$2 += 1) {
var element$1 = list$2[i$2];
element$1.populate();
}
};
return Stage;
}(Module));
var Renderer = /*@__PURE__*/(function (Module) {
function Renderer () {
Module.call(this, 'render');
this.rendering = this.render.bind(this);
this.nexts = new Collection();
}
if ( Module ) Renderer.__proto__ = Module;
Renderer.prototype = Object.create( Module && Module.prototype );
Renderer.prototype.constructor = Renderer;
Renderer.prototype.activate = function activate () {
window.requestAnimationFrame(this.rendering);
};
Renderer.prototype.request = function request (instance) {
this.nexts.add(instance);
};
Renderer.prototype.render = function render () {
if (!state.isActive) { return; }
window.requestAnimationFrame(this.rendering);
this.forEach(function (instance) { return instance.render(); });
if (!this.nexts.length) { return; }
var nexts = this.nexts.clone();
this.nexts.clear();
nexts.forEach(function (instance) { return instance.next(); });
};
return Renderer;
}(Module));
var Resizer = /*@__PURE__*/(function (Module) {
function Resizer () {
Module.call(this, 'resize');
this.requireResize = false;
this.resizing = this.resize.bind(this);
var requesting = this.request.bind(this);
if (document.fonts) {
document.fonts.ready.then(requesting);
}
window.addEventListener('resize', requesting);
window.addEventListener('orientationchange', requesting);
}
if ( Module ) Resizer.__proto__ = Module;
Resizer.prototype = Object.create( Module && Module.prototype );
Resizer.prototype.constructor = Resizer;
Resizer.prototype.activate = function activate () {
this.request();
};
Resizer.prototype.request = function request () {
if (this.requireResize) { return; }
this.requireResize = true;
window.requestAnimationFrame(this.resizing);
};
Resizer.prototype.resize = function resize () {
if (!this.requireResize) { return; }
this.forEach(function (instance) { return instance.resize(); });
this.requireResize = false;
};
return Resizer;
}(Module));
var ScrollLocker = /*@__PURE__*/(function (Module) {
function ScrollLocker () {
Module.call(this, 'lock');
this._isLocked = false;
this._scrollY = 0;
this.onPopulate = this.lock.bind(this);
this.onEmpty = this.unlock.bind(this);
}
if ( Module ) ScrollLocker.__proto__ = Module;
ScrollLocker.prototype = Object.create( Module && Module.prototype );
ScrollLocker.prototype.constructor = ScrollLocker;
var prototypeAccessors = { isLocked: { configurable: true } };
prototypeAccessors.isLocked.get = function () {
return this._isLocked;
};
ScrollLocker.prototype.lock = function lock () {
if (!this._isLocked) {
this._isLocked = true;
this._scrollY = window.scrollY;
var scrollBarGap = window.innerWidth - document.documentElement.clientWidth;
document.documentElement.setAttribute(ns.attr('scrolling'), 'false');
document.body.style.top = (-this._scrollY) + "px";
this.behavior = getComputedStyle(document.documentElement).getPropertyValue('scroll-behavior');
if (this.behavior === 'smooth') { document.documentElement.style.scrollBehavior = 'auto'; }
if (scrollBarGap > 0) {
document.documentElement.style.setProperty('--scrollbar-width', (scrollBarGap + "px"));
}
}
};
ScrollLocker.prototype.unlock = function unlock () {
if (this._isLocked) {
this._isLocked = false;
document.documentElement.removeAttribute(ns.attr('scrolling'));
document.body.style.top = '';
window.scrollTo(0, this._scrollY);
if (this.behavior === 'smooth') { document.documentElement.style.removeProperty('scroll-behavior'); }
document.documentElement.style.removeProperty('--scrollbar-width');
}
};
ScrollLocker.prototype.move = function move (value) {
if (this._isLocked) {
this._scrollY += value;
document.body.style.top = (-this._scrollY) + "px";
} else {
window.scrollTo(0, window.scrollY + value);
}
};
Object.defineProperties( ScrollLocker.prototype, prototypeAccessors );
return ScrollLocker;
}(Module));
var Load = /*@__PURE__*/(function (Module) {
function Load () {
Module.call(this, 'load');
this.loading = this.load.bind(this);
}
if ( Module ) Load.__proto__ = Module;
Load.prototype = Object.create( Module && Module.prototype );
Load.prototype.constructor = Load;
Load.prototype.activate = function activate () {
window.addEventListener('load', this.loading);
};
Load.prototype.load = function load () {
this.forEach(function (instance) { return instance.load(); });
};
return Load;
}(Module));
var FONT_FAMILIES = ['Marianne', 'Spectral'];
var FontSwap = /*@__PURE__*/(function (Module) {
function FontSwap () {
Module.call(this, 'font-swap');
this.swapping = this.swap.bind(this);
}
if ( Module ) FontSwap.__proto__ = Module;
FontSwap.prototype = Object.create( Module && Module.prototype );
FontSwap.prototype.constructor = FontSwap;
FontSwap.prototype.activate = function activate () {
if (document.fonts) {
document.fonts.addEventListener('loadingdone', this.swapping);
}
};
FontSwap.prototype.swap = function swap () {
var families = FONT_FAMILIES.filter(function (family) { return document.fonts.check(("16px " + family)); });
this.forEach(function (instance) { return instance.swapFont(families); });
};
return FontSwap;
}(Module));
var MouseMove = /*@__PURE__*/(function (Module) {
function MouseMove () {
Module.call(this, 'mouse-move');
this.requireMove = false;
this._isMoving = false;
this.moving = this.move.bind(this);
this.requesting = this.request.bind(this);
this.onPopulate = this.listen.bind(this);
this.onEmpty = this.unlisten.bind(this);
}
if ( Module ) MouseMove.__proto__ = Module;
MouseMove.prototype = Object.create( Module && Module.prototype );
MouseMove.prototype.constructor = MouseMove;
MouseMove.prototype.listen = function listen () {
if (this._isMoving) { return; }
this._isMoving = true;
this.requireMove = false;
document.documentElement.addEventListener('mousemove', this.requesting);
};
MouseMove.prototype.unlisten = function unlisten () {
if (!this._isMoving) { return; }
this._isMoving = false;
this.requireMove = false;
document.documentElement.removeEventListener('mousemove', this.requesting);
};
MouseMove.prototype.request = function request (e) {
if (!this._isMoving) { return; }
this.point = { x: e.clientX, y: e.clientY };
if (this.requireMove) { return; }
this.requireMove = true;
window.requestAnimationFrame(this.moving);
};
MouseMove.prototype.move = function move () {
var this$1$1 = this;
if (!this.requireMove) { return; }
this.forEach(function (instance) { return instance.mouseMove(this$1$1.point); });
this.requireMove = false;
};
return MouseMove;
}(Module));
var Hash = /*@__PURE__*/(function (Module) {
function Hash () {
Module.call(this, 'hash');
this.handling = this.handle.bind(this);
this.getLocationHash();
}
if ( Module ) Hash.__proto__ = Module;
Hash.prototype = Object.create( Module && Module.prototype );
Hash.prototype.constructor = Hash;
var prototypeAccessors = { hash: { configurable: true } };
Hash.prototype.activate = function activate () {
window.addEventListener('hashchange', this.handling);
};
Hash.prototype.deactivate = function deactivate () {
window.removeEventListener('hashchange', this.handling);
};
Hash.prototype._sanitize = function _sanitize (hash) {
if (hash.charAt(0) === '#') { return hash.substring(1); }
return hash;
};
prototypeAccessors.hash.set = function (value) {
var hash = this._sanitize(value);
if (this._hash !== hash) { window.location.hash = hash; }
};
prototypeAccessors.hash.get = function () {
return this._hash;
};
Hash.prototype.getLocationHash = function getLocationHash () {
var hash = window.location.hash;
this._hash = this._sanitize(hash);
};
Hash.prototype.handle = function handle (e) {
var this$1$1 = this;
this.getLocationHash();
this.forEach(function (instance) { return instance.handleHash(this$1$1._hash, e); });
};
Object.defineProperties( Hash.prototype, prototypeAccessors );
return Hash;
}(Module));
var Engine = function Engine () {
state.create(Register);
state.create(Stage);
state.create(Renderer);
state.create(Resizer);
state.create(ScrollLocker);
state.create(Load);
state.create(FontSwap);
state.create(MouseMove);
state.create(Hash);
var registerModule = state.getModule('register');
this.register = registerModule.register.bind(registerModule);
};
var prototypeAccessors$5 = { isActive: { configurable: true } };
prototypeAccessors$5.isActive.get = function () {
return state.isActive;
};
Engine.prototype.start = function start () {
inspector.debug('START');
state.isActive = true;
};
Engine.prototype.stop = function stop () {
inspector.debug('STOP');
state.isActive = false;
};
Object.defineProperties( Engine.prototype, prototypeAccessors$5 );
var engine = new Engine();
var Colors = function Colors () {};
Colors.prototype.getColor = function getColor (context, use, tint, options) {
if ( options === void 0 ) options = {};
var option = getOption(options);
var decision = "--" + context + "-" + use + "-" + tint + option;
return getComputedStyle(document.documentElement).getPropertyValue(decision).trim() || null;
};
var getOption = function (options) {
switch (true) {
case options.hover:
return '-hover';
case options.active:
return '-active';
default:
return '';
}
};
var colors = new Colors();
var sanitize = function (className) { return className.charAt(0) === '.' ? className.substr(1) : className; };
var getClassNames = function (element) {
switch (true) {
case !element.className:
return [];
case typeof element.className === 'string':
return element.className.split(' ');
case typeof element.className.baseVal === 'string':
return element.className.baseVal.split(' ');
}
return [];
};
var modifyClass = function (element, className, remove) {
className = sanitize(className);
var classNames = getClassNames(element);
var index = classNames.indexOf(className);
if (remove === true) {
if (index > -1) { classNames.splice(index, 1); }
} else if (index === -1) { classNames.push(className); }
element.className = classNames.join(' ');
};
var addClass = function (element, className) { return modifyClass(element, className); };
var removeClass = function (element, className) { return modifyClass(element, className, true); };
var hasClass = function (element, className) { return getClassNames(element).indexOf(sanitize(className)) > -1; };
var ACTIONS = [
'[tabindex]:not([tabindex="-1"])',
'a[href]',
'button:not([disabled])',
'input:not([disabled])',
'select:not([disabled])',
'textarea:not([disabled])',
'audio[controls]',
'video[controls]',
'[contenteditable]:not([contenteditable="false"])',
'details>summary:first-of-type',
'details',
'iframe'
];
var ACTIONS_SELECTOR = ACTIONS.join();
var queryActions = function (element) {
return element.querySelectorAll(ACTIONS_SELECTOR);
};
var counter = 0;
var uniqueId = function (id) {
if (!document.getElementById(id)) { return id; }
var element = true;
var base = id;
while (element) {
counter++;
id = base + "-" + counter;
element = document.getElementById(id);
}
return id;
};
var dom = {
addClass: addClass,
hasClass: hasClass,
removeClass: removeClass,
queryParentSelector: queryParentSelector,
querySelectorAllArray: querySelectorAllArray,
queryActions: queryActions,
uniqueId: uniqueId
};
var DataURISVG = function DataURISVG (width, height) {
if ( width === void 0 ) width = 0;
if ( height === void 0 ) height = 0;
this._width = width;
this._height = height;
this._content = '';
};
var prototypeAccessors$4 = { width: { configurable: true },height: { configurable: true },content: { configurable: true } };
prototypeAccessors$4.width.get = function () {
return this._width;
};
prototypeAccessors$4.width.set = function (value) {
this._width = value;
};
prototypeAccessors$4.height.get = function () {
return this._height;
};
prototypeAccessors$4.height.set = function (value) {
this._height = value;
};
prototypeAccessors$4.content.get = function () {
return this._content;
};
prototypeAccessors$4.content.set = function (value) {
this._content = value;
};
DataURISVG.prototype.getDataURI = function getDataURI (isLegacy) {
if ( isLegacy === void 0 ) isLegacy = false;
var svg = "<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 " + (this._width) + " " + (this._height) + "' width='" + (this._width) + "px' height='" + (this._height) + "px'>" + (this._content) + "</svg>";
svg = svg.replace(/#/gi, '%23');
if (isLegacy) {
svg = svg.replace(/</gi, '%3C');
svg = svg.replace(/>/gi, '%3E');
svg = svg.replace(/"/gi, '\'');
svg = svg.replace(/{/gi, '%7B');
svg = svg.replace(/}/gi, '%7D');
}
return ("data:image/svg+xml;charset=utf8," + svg);
};
Object.defineProperties( DataURISVG.prototype, prototypeAccessors$4 );
var image = {
DataURISVG: DataURISVG
};
var supportLocalStorage = function () {
try {
return 'localStorage' in window && window.localStorage !== null;
} catch (e) {
return false;
}
};
var supportAspectRatio = function () {
if (!window.CSS) { return false; }
return CSS.supports('aspect-ratio: 16 / 9');
};
var support = {
supportLocalStorage: supportLocalStorage,
supportAspectRatio: supportAspectRatio
};
var TransitionSelector = {
NONE: ns.selector('transition-none')
};
var selector = {
TransitionSelector: TransitionSelector
};
/**
* Copy properties from multiple sources including accessors.
* source : https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Global_Objects/Object/assign#copier_des_accesseurs
*
* @param {object} [target] - Target object to copy into
* @param {...objects} [sources] - Multiple objects
* @return {object} A new object
*
* @example
*
* const obj1 = {
* key: 'value'
* };
* const obj2 = {
* get function01 () {
* return a-value;
* }
* set function01 () {
* return a-value;
* }
* };
* completeAssign(obj1, obj2)
*/
var completeAssign = function (target) {
var sources = [], len = arguments.length - 1;
while ( len-- > 0 ) sources[ len ] = arguments[ len + 1 ];
sources.forEach(function (source) {
var descriptors = Object.keys(source).reduce(function (descriptors, key) {
descriptors[key] = Object.getOwnPropertyDescriptor(source, key);
return descriptors;
}, {});
Object.getOwnPropertySymbols(source).forEach(function (sym) {
var descriptor = Object.getOwnPropertyDescriptor(source, sym);
if (descriptor.enumerable) {
descriptors[sym] = descriptor;
}
});
Object.defineProperties(target, descriptors);
});
return target;
};
var property = {
completeAssign: completeAssign
};
/**
* Return an object of query params or null
*
* @method
* @name searchParams
* @param {string} url - an url
* @returns {Object} object of query params or null
*/
var searchParams = function (url) {
if (url && url.search) {
var params = new URLSearchParams(window.location.search);
var entries = params.entries();
return Object.fromEntries(entries);
}
return null;
};
var internals = {};
var legacy = {};
Object.defineProperty(legacy, 'isLegacy', {
get: function () { return state.isLegacy; }
});
legacy.setLegacy = function () {
state.isLegacy = true;
};
internals.legacy = legacy;
internals.dom = dom;
internals.image = image;
internals.support = support;
internals.motion = selector;
internals.property = property;
internals.ns = ns;
internals.register = engine.register;
internals.state = state;
internals.query = searchParams(window.location);
Object.defineProperty(internals, 'preventManipulation', {
get: function () { return options.preventManipulation; }
});
Object.defineProperty(internals, 'stage', {
get: function () { return state.getModule('stage'); }
});
var api$1 = function (node) {
var stage = state.getModule('stage');
return stage.getProxy(node);
};
api$1.version = config.version;
api$1.prefix = config.prefix;
api$1.organisation = config.organisation;
api$1.Modes = Modes;
Object.defineProperty(api$1, 'mode', {
set: function (value) { options.mode = value; },
get: function () { return options.mode; }
});
api$1.internals = internals;
api$1.version = config.version;
api$1.start = engine.start;
api$1.stop = engine.stop;
api$1.inspector = inspector;
api$1.colors = colors;
var configuration = window[config.namespace];
api$1.internals.configuration = configuration;
options.configure(configuration, api$1.start, api$1.internals.query);
window[config.namespace] = api$1;
var Emitter = function Emitter () {
this.emissions = {};
};
Emitter.prototype.add = function add (type, closure) {
if (typeof closure !== 'function') { throw new Error('closure must be a function'); }
if (!this.emissions[type]) { this.emissions[type] = []; }
this.emissions[type].push(closu