https://www.georisques.gouv.fr/libraries/dsfr/dist/dsfr.module.js?tlugul

1/*! DSFR v1.12.1 | SPDX-License-Identifier: MIT | License-Filename: LICENSE.md | restricted use (see terms and conditions) */
2
3class State {
4  constructor () {
5    this.modules = {};
6  }
7
8  create (ModuleClass) {
9    const module = new ModuleClass();
10    this.modules[module.type] = module;
11  }
12
13  getModule (type) {
14    return this.modules[type];
15  }
16
17  add (type, item) {
18    this.modules[type].add(item);
19  }
20
21  remove (type, item) {
22    this.modules[type].remove(item);
23  }
24
25  get isActive () {
26    return this._isActive;
27  }
28
29  set isActive (value) {
30    if (value === this._isActive) return;
31    this._isActive = value;
32    const values = Object.keys(this.modules).map((e) => {
33      return this.modules[e];
34    });
35    if (value) {
36      for (const module of values) {
37        module.activate();
38      }
39    } else {
40      for (const module of values) {
41        module.deactivate();
42      }
43    }
44  }
45
46  get isLegacy () {
47    return this._isLegacy;
48  }
49
50  set isLegacy (value) {
51    if (value === this._isLegacy) return;
52    this._isLegacy = value;
53  }
54}
55
56const state = new State();
57
58const config = {
59  prefix: 'fr',
60  namespace: 'dsfr',
61  organisation: '@gouvfr',
62  version: '1.12.1'
63};
64
65class LogLevel {
66  constructor (level, light, dark, logger) {
67    this.level = level;
68    this.light = light;
69    this.dark = dark;
70
71    switch (logger) {
72      case 'warn':
73        this.logger = console.warn;
74        break;
75
76      case 'error':
77        this.logger = console.error;
78        break;
79
80      default:
81        this.logger = console.log;
82    }
83  }
84
85  log (...values) {
86    const message = new Message(config.namespace);
87    for (const value of values) message.add(value);
88    this.print(message);
89  }
90
91  print (message) {
92    message.setColor(this.color);
93    this.logger.apply(console, message.getMessage());
94  }
95
96  get color () {
97    return window.matchMedia('(prefers-color-scheme: dark)').matches ? this.dark : this.light;
98  }
99}
100
101class Message {
102  constructor (domain) {
103    this.inputs = ['%c'];
104    this.styles = ['font-family:Marianne', 'line-height: 1.5'];
105    this.objects = [];
106
107    if (domain) this.add(`${domain} :`);
108  }
109
110  add (value) {
111    switch (typeof value) {
112      case 'object':
113      case 'function':
114        this.inputs.push('%o ');
115        this.objects.push(value);
116        break;
117
118      default:
119        this.inputs.push(`${value} `);
120    }
121  }
122
123  setColor (color) {
124    this.styles.push(`color:${color}`);
125  }
126
127  getMessage () {
128    return [this.inputs.join(''), this.styles.join(';'), ...this.objects];
129  }
130}
131
132const LEVELS = {
133  log: new LogLevel(0, '#616161', '#989898'),
134  debug: new LogLevel(1, '#000091', '#8B8BFF'),
135  info: new LogLevel(2, '#007c3b', '#00ed70'),
136  warn: new LogLevel(3, '#ba4500', '#fa5c00', 'warn'),
137  error: new LogLevel(4, '#D80600', '#FF4641', 'error')
138};
139
140class Inspector {
141  constructor () {
142    this.level = 2;
143
144    for (const id in LEVELS) {
145      const level = LEVELS[id];
146      this[id] = (...msgs) => {
147        if (this.level <= level.level) level.log.apply(level, msgs);
148      };
149      this[id].print = level.print.bind(level);
150    }
151  }
152
153  state () {
154    const message = new Message();
155    message.add(state);
156    this.log.print(message);
157  }
158
159  tree () {
160    const stage = state.getModule('stage');
161    if (!stage) return;
162    const message = new Message();
163    this._branch(stage.root, 0, message);
164    this.log.print(message);
165  }
166
167  _branch (element, space, message) {
168    let branch = '';
169    if (space > 0) {
170      let indent = '';
171      for (let i = 0; i < space; i++) indent += '    ';
172      // branch += indent + '|\n';
173      branch += indent + '└─ ';
174    }
175    branch += `[${element.id}] ${element.html}`;
176    message.add(branch);
177    message.add({ '@': element });
178    message.add('\n');
179    for (const child of element.children) branch += this._branch(child, space + 1, message);
180  }
181}
182
183const inspector = new Inspector();
184
185const startAtDomContentLoaded = (callback) => {
186  if (document.readyState !== 'loading') window.requestAnimationFrame(callback);
187  else document.addEventListener('DOMContentLoaded', callback);
188};
189
190const startAuto = (callback) => {
191  // detect
192  startAtDomContentLoaded(callback);
193};
194
195const Modes = {
196  AUTO: 'auto',
197  MANUAL: 'manual',
198  RUNTIME: 'runtime',
199  LOADED: 'loaded',
200  VUE: 'vue',
201  ANGULAR: 'angular',
202  REACT: 'react'
203};
204
205class Options {
206  constructor () {
207    this._mode = Modes.AUTO;
208    this.isStarted = false;
209    this.starting = this.start.bind(this);
210    this.preventManipulation = false;
211  }
212
213  configure (settings = {}, start, query) {
214    this.startCallback = start;
215    const isProduction = settings.production && (!query || query.production !== 'false');
216    switch (true) {
217      case query && !isNaN(query.level):
218        inspector.level = Number(query.level);
219        break;
220
221      case query && query.verbose && (query.verbose === 'true' || query.verbose === 1):
222        inspector.level = 0;
223        break;
224
225      case isProduction:
226        inspector.level = 999;
227        break;
228
229      case settings.verbose:
230        inspector.level = 0;
231        break;
232    }
233    inspector.info(`version ${config.version}`);
234    this.mode = settings.mode || Modes.AUTO;
235  }
236
237  set mode (value) {
238    switch (value) {
239      case Modes.AUTO:
240        this.preventManipulation = false;
241        startAuto(this.starting);
242        break;
243
244      case Modes.LOADED:
245        this.preventManipulation = false;
246        startAtDomContentLoaded(this.starting);
247        break;
248
249      case Modes.RUNTIME:
250        this.preventManipulation = false;
251        this.start();
252        break;
253
254      case Modes.MANUAL:
255        this.preventManipulation = false;
256        break;
257
258      case Modes.VUE:
259        this.preventManipulation = true;
260        break;
261
262      case Modes.ANGULAR:
263        this.preventManipulation = true;
264        break;
265
266      case Modes.REACT:
267        this.preventManipulation = true;
268        break;
269
270      default:
271        inspector.error('Illegal mode');
272        return;
273    }
274
275    this._mode = value;
276    inspector.info(`mode set to ${value}`);
277  }
278
279  get mode () {
280    return this._mode;
281  }
282
283  start () {
284    inspector.info('start');
285    this.startCallback();
286  }
287}
288
289const options = new Options();
290
291class Collection {
292  constructor () {
293    this._collection = [];
294  }
295
296  forEach (callback) {
297    this._collection.forEach(callback);
298  }
299
300  map (callback) {
301    return this._collection.map(callback);
302  }
303
304  get length () {
305    return this._collection.length;
306  }
307
308  add (collectable) {
309    if (this._collection.indexOf(collectable) > -1) return false;
310    this._collection.push(collectable);
311    if (this.onAdd) this.onAdd();
312    if (this.onPopulate && this._collection.length === 1) this.onPopulate();
313    return true;
314  }
315
316  remove (collectable) {
317    const index = this._collection.indexOf(collectable);
318    if (index === -1) return false;
319    this._collection.splice(index, 1);
320    if (this.onRemove) this.onRemove();
321    if (this.onEmpty && this._collection.length === 0) this.onEmpty();
322  }
323
324  execute (...args) {
325    for (const collectable of this._collection) if (collectable) collectable.apply(null, args);
326  }
327
328  clear () {
329    this._collection.length = 0;
330  }
331
332  clone () {
333    const clone = new Collection();
334    clone._collection = this._collection.slice();
335    return clone;
336  }
337
338  get collection () {
339    return this._collection;
340  }
341}
342
343class Module extends Collection {
344  constructor (type) {
345    super();
346    this.type = type;
347    this.isActive = false;
348  }
349
350  activate () {}
351  deactivate () {}
352}
353
354const ns = name => `${config.prefix}-${name}`;
355
356ns.selector = (name, notation) => {
357  if (notation === undefined) notation = '.';
358  return `${notation}${ns(name)}`;
359};
360
361ns.attr = (name) => `data-${ns(name)}`;
362
363ns.attr.selector = (name, value) => {
364  let result = ns.attr(name);
365  if (value !== undefined) result += `="${value}"`;
366  return `[${result}]`;
367};
368
369ns.event = (type) => `${config.namespace}.${type}`;
370
371ns.emission = (domain, type) => `emission:${domain}.${type}`;

371
372
373const querySelectorAllArray = (element, selectors) => Array.prototype.slice.call(element.querySelectorAll(selectors));
374
375const queryParentSelector = (element, selectors) => {
376  const parent = element.parentElement;
377  if (parent.matches(selectors)) return parent;
378  if (parent === document.documentElement) return null;
379  return queryParentSelector(parent, selectors);
380};
381
382class Registration {
383  constructor (selector, InstanceClass, creator) {
384    this.selector = selector;
385    this.InstanceClass = InstanceClass;
386    this.creator = creator;
387    this.instances = new Collection();
388    this.isIntroduced = false;
389    this._instanceClassName = this.InstanceClass.instanceClassName;
390    this._instanceClassNames = this.getInstanceClassNames(this.InstanceClass);
391    this._property = this._instanceClassName.substring(0, 1).toLowerCase() + this._instanceClassName.substring(1);
392    const dashed = this._instanceClassName
393      .replace(/[^a-zA-Z0-9]+/g, '-')
394      .replace(/([A-Z]+)([A-Z][a-z])/g, '$1-$2')
395      .replace(/([a-z])([A-Z])/g, '$1-$2')
396      .replace(/([0-9])([^0-9])/g, '$1-$2')
397      .replace(/([^0-9])([0-9])/g, '$1-$2')
398      .toLowerCase();
399    this._attribute = ns.attr(`js-${dashed}`);
400  }
401
402  getInstanceClassNames (InstanceClass) {
403    const prototype = Object.getPrototypeOf(InstanceClass);
404    if (!prototype || prototype.instanceClassName === 'Instance') return [InstanceClass.instanceClassName];
405    return [...this.getInstanceClassNames(prototype), InstanceClass.instanceClassName];
406  }
407
408  hasInstanceClassName (instanceClassName) {
409    return this._instanceClassNames.indexOf(instanceClassName) > -1;
410  }
411
412  introduce () {
413    if (this.isIntroduced) return;
414    this.isIntroduced = true;
415    state.getModule('stage').parse(document.documentElement, this);
416  }
417
418  parse (node, nonRecursive) {
419    const nodes = [];
420    if (node.matches && node.matches(this.selector)) nodes.push(node);
421    // eslint-disable-next-line no-useless-call
422    if (!nonRecursive && node.querySelectorAll && node.querySelector(this.selector)) nodes.push.apply(nodes, querySelectorAllArray(node, this.selector));
423    return nodes;
424  }
425
426  create (element) {
427    if (!element.node.matches(this.selector)) return;
428    const instance = new this.InstanceClass();
429    this.instances.add(instance);
430    return instance;
431  }
432
433  remove (instance) {
434    this.instances.remove(instance);
435  }
436
437  dispose () {
438    const instances = this.instances.collection;
439    for (let i = instances.length - 1; i > -1; i--) instances[i]._dispose();
440    this.creator = null;
441  }
442
443  get instanceClassName () {
444    return this._instanceClassName;
445  }
446
447  get instanceClassNames () {
448    return this._instanceClassNames;
449  }
450
451  get property () {
452    return this._property;
453  }
454
455  get attribute () {
456    return this._attribute;
457  }
458}
459
460class Register extends Module {
461  constructor () {
462    super('register');
463  }
464
465  register (selector, InstanceClass, creator) {
466    const registration = new Registration(selector, InstanceClass, creator);
467    this.add(registration);
468    if (state.isActive) registration.introduce();
469    return registration;
470  }
471
472  activate () {
473    for (const registration of this.collection) registration.introduce();
474  }
475
476  remove (registration) {
477    registration.dispose();
478    super.remove(registration);
479  }
480}
481
482let count = 0;
483
484class Element$1 {
485  constructor (node, id) {
486    if (!id) {
487      count++;
488      this.id = count;
489    } else this.id = id;
490    this.node = node;
491    this.attributeNames = [];
492    this.instances = [];
493    this._children = [];
494    this._parent = null;
495    this._projects = [];
496  }
497
498  get proxy () {
499    const scope = this;
500    if (!this._proxy) {
501      this._proxy = {
502        id: this.id,
503        get parent () {
504          return scope.parent ? scope.parent.proxy : null;
505        },
506        get children () {
507          return scope.children.map((child) => child.proxy);
508        }
509      };
510
511      for (const instance of this.instances) this._proxy[instance.registration.property] = instance.proxy;
512    }
513    return this._proxy;
514  }
515
516  get html () {
517    if (!this.node || !this.node.outerHTML) return '';
518    const end = this.node.outerHTML.indexOf('>');
519    return this.node.outerHTML.substring(0, end + 1);
520  }
521
522  project (registration) {
523    if (this._projects.indexOf(registration) === -1) this._projects.push(registration);
524  }
525
526  populate () {
527    const projects = this._projects.slice();
528    this._projects.length = 0;
529    for (const registration of projects) this.create(registration);
530  }
531
532  create (registration) {
533    if (this.hasInstance(registration.instanceClassName)) {
534      // inspector.debug(`failed creation, instance of ${registration.instanceClassName} already exists on element [${this.id}]`);
535      return;
536    }
537    inspector.debug(`create instance of ${registration.instanceClassName} on element [${this.id}]`);
538    const instance = registration.create(this);
539    this.instances.push(instance);
540    instance._config(this, registration);
541    if (this._proxy) this._proxy[registration.property] = instance.proxy;
542  }
543
544  remove (instance) {
545    const index = this.instances.indexOf(instance);
546    if (index > -1) this.instances.splice(index, 1);
547    if (this._proxy) delete this._proxy[instance.registration.property];
548  }
549
550  get parent () {
551    return this._parent;
552  }
553
554  get ascendants () {
555    return [this.parent, ...this.parent.ascendants];
556  }
557
558  get children () {
559    return this._children;
560  }
561
562  get descendants () {
563    const descendants = [...this._children];
564    this._children.forEach(child => descendants.push(...child.descendants));
565    return descendants;
566  }
567
568  // TODO : emit ascendant et descendant de changement ?
569
570  addChild (child, index) {
571    if (this._children.indexOf(child) > -1) return null;
572    child._parent = this;
573    if (!isNaN(index) && index > -1 && index < this._children.length) this._children.splice(index, 0, child);
574    else this._children.push(child);
575    return child;
576  }
577
578  removeChild (child) {
579    const index = this._children.indexOf(child);
580    if (index === -1) return null;
581    child._parent = null;
582    this._children.splice(index, 1);
583  }
584
585  emit (type, data) {
586    const elements = state.getModule('stage').collection;
587    const response = [];
588    for (const element of elements) response.push(...element._emit(type, data));
589    return response;
590  }
591
592  _emit (type, data) {
593    const response = [];
594    for (const instance of this.instances) response.push(...instance._emitter.emit(type, data));
595    return response;
596  }
597
598  ascend (type, data) {
599    if (this._parent) return this._parent._ascend(type, data);
600    return [];
601  }
602
603  _ascend (type, data) {
604    const response = [];
605    for (const instance of this.instances) response.push(...instance._ascent.emit(type, data));
606    if (this._parent) response.push(...this._parent._ascend(type, data));
607    return response;
608  }
609
610  descend (type, data) {
611    const response = [];
612    for (const child of this._children) response.push(...child._descend(type, data));
613    return response;
614  }
615
616  _descend (type, data) {
617    const response = [];
618    for (const instance of this.instances) response.push(...instance._descent.emit(type, data));
619    for (const child of this._children) response.push(...child._descend(type, data));
620    return response;
621  }
622
623  getInstance (instanceClassName) {
624    for (const instance of this.instances) if (instance.registration.hasInstanceClassName(instanceClassName)) return instance;
625    return null;
626  }
627
628  hasInstance (instanceClassName) {
629    return this.getInstance(instanceClassName) !== null;
630  }
631
632  getDescendantInstances (instanceClassName, stopAtInstanceClassName, stopAtFirstInstance) {
633    if (!instanceClassName) return [];
634    const instances = [];
635    for (const child of this._children) {
636      const instance = child.getInstance(instanceClassName);
637      if (instance) {
638        instances.push(instance);
639        if (stopAtFirstInstance) continue;
640      }
641      if ((!stopAtInstanceClassName || !child.hasInstance(stopAtInstanceClassName)) && child.children.length) instances.push.apply(instances, child.getDescendantInstances(instanceClassName, stopAtInstanceClassName, stopAtFirstInstance));
642    }
643    return instances;
644  }
645
646  getAscendantInstance (instanceClassName, stopAtInstanceClassName) {
647    if (!instanceClassName || !this._parent) return null;
648    const instance = this._parent.getInstance(instanceClassName);
649    if (instance) return instance;
650    if (stopAtInstanceClassName && this._parent.hasInstance(stopAtInstanceClassName)) return null;
651    return this._parent.getAscendantInstance(instanceClassName, stopAtInstanceClassName);
652  }
653
654  dispose () {
655    for (let i = this.instances.length - 1; i >= 0; i--) {
656      const instance = this.instances[i];
657      if (instance) instance._dispose();
658    }
659    this.instances.length = 0;
660    state.remove('stage', this);
661    this.parent.removeChild(this);
662    this._children.length = 0;
663    inspector.debug(`remove element [${this.id}] ${this.html}`);
664  }
665
666  prepare (attributeName) {
667    if (this.attributeNames.indexOf(attributeName) === -1) this.attributeNames.push(attributeName);
668  }
669
670  examine () {
671    const attributeNames = this.attributeNames.slice();
672    this.attributeNames.length = 0;
673    for (let i = this.instances.length - 1; i > -1; i--) this.instances[i].examine(attributeNames);
674  }
675}
676
677const RootEmission = {
678  CLICK: ns.emission('root', 'click'),
679  

720class Root extends Element$1 {
721  constructor () {
722    super(document.documentElement, 'root');
723    this.node.setAttribute(ns.attr('js'), true);
724    this.listen();
725  }
726
727  listen () {
728    // TODO v2 => listener au niveau des éléments qui redistribuent aux instances.
729    document.documentElement.addEventListener('click', this.click.bind(this), { capture: true });
730    document.documentElement.addEventListener('keydown', this.keydown.bind(this), { capture: true });
731    document.documentElement.addEventListener('keyup', this.keyup.bind(this), { capture: true });
732  }
733
734  click (e) {
735    this.emit(RootEmission.CLICK, e.target);
736  }
737
738  keydown (e) {
739    this.emit(RootEmission.KEYDOWN, getKeyCode(e.keyCode));
740  }
741
742  keyup (e) {
743    this.emit(RootEmission.KEYUP, getKeyCode(e.keyCode));
744  }
745}
746
747class Stage extends Module {
748  constructor () {
749    super('stage');
750    this.root = new Root();
751    super.add(this.root);
752    this.observer = new MutationObserver(this.mutate.bind(this));
753    this.modifications = [];
754    this.willModify = false;
755    this.modifying = this.modify.bind(this);
756  }
757
758  hasElement (node) {
759    for (const element of this.collection) if (element.node === node) return true;
760    return false;
761  }
762
763  getElement (node) {
764    for (const element of this.collection) if (element.node === node) return element;
765    const element = new Element$1(node);
766    this.add(element);
767    inspector.debug(`add element [${element.id}] ${element.html}`);
768    return element;
769  }
770
771  getProxy (node) {
772    if (!this.hasElement(node)) return null;
773    const element = this.getElement(node);
774    return element.proxy;
775  }
776
777  add (element) {
778    super.add(element);
779    this.put(element, this.root);
780  }
781
782  put (element, branch) {
783    let index = 0;
784    for (let i = branch.children.length - 1; i > -1; i--) {
785      const child = branch.children[i];
786      const position = element.node.compareDocumentPosition(child.node);
787      if (position & Node.DOCUMENT_POSITION_CONTAINS) {
788        this.put(element, child);
789        return;
790      } else if (position & Node.DOCUMENT_POSITION_CONTAINED_BY) {
791        branch.removeChild(child);
792        element.addChild(child, 0);
793      } else if (position & Node.DOCUMENT_POSITION_PRECEDING) {
794        index = i + 1;
795        break;
796      }
797    }
798
799    branch.addChild(element, index);
800  }
801
802  activate () {
803    this.observer.observe(document.documentElement, { childList: true, subtree: true, attributes: true });
804  }
805
806  deactivate () {
807    this.observer.disconnect();
808  }
809
810  mutate (mutations) {
811    const examinations = [];
812    mutations.forEach((mutation) => {
813      switch (mutation.type) {
814        case 'childList':
815          mutation.removedNodes.forEach((node) => this.dispose(node));
816          mutation.addedNodes.forEach((node) => this.parse(node));
817          break;
818
819        case 'attributes':
820          if (this.hasElement(mutation.target)) {
821            const element = this.getElement(mutation.target);
822            element.prepare(mutation.attributeName);
823            if (examinations.indexOf(element) === -1) examinations.push(element);
824            for (const descendant of element.descendants) if (examinations.indexOf(descendant) === -1) examinations.push(descendant);
825          }
826          if (this.modifications.indexOf(mutation.target) === -1) this.modifications.push(mutation.target);
827          break;
828      }
829    });
830
831    examinations.forEach(element => element.examine());
832    if (this.modifications.length && !this.willModify) {
833      this.willModify = true;
834      window.requestAnimationFrame(this.modifying);
835    }
836  }
837
838  modify () {
839    this.willModify = false;
840    const targets = this.modifications.slice();
841    this.modifications.length = 0;
842    for (const target of targets) if (document.documentElement.contains(target)) this.parse(target);
843  }
844
845  dispose (node) {
846    const disposables = [];
847    this.forEach((element) => {
848      if (node.contains(element.node)) disposables.push(element);
849    });
850
851    for (const disposable of disposables) {
852      disposable.dispose();
853      this.remove(disposable);
854    }
855  }
856
857  parse (node, registration, nonRecursive) {
858    const registrations = registration ? [registration] : state.getModule('register').collection;
859    const creations = [];
860
861    for (const registration of registrations) {
862      const nodes = registration.parse(node, nonRecursive);
863
864      for (const n of nodes) {
865        const element = this.getElement(n);
866        element.project(registration);
867        if (creations.indexOf(element) === -1) creations.push(element);
868      }
869    }
870
871    for (const element of creations) element.populate();
872  }
873}
874
875class Renderer extends Module {
876  constructor () {
877    super('render');
878    this.rendering = this.render.bind(this);
879    this.nexts = new Collection();
880  }
881
882  activate () {
883    window.requestAnimationFrame(this.rendering);
884  }
885
886  request (instance) {
887    this.nexts.add(instance);
888  }
889
890  render () {
891    if (!state.isActive) return;
892    window.requestAnimationFrame(this.rendering);
893    this.forEach((instance) => instance.render());
894    if (!this.nexts.length) return;
895    const nexts = this.nexts.clone();
896    this.nexts.clear();
897    nexts.forEach((instance) => instance.next());
898  }
899}
900
901class Resizer extends Module {
902  constructor () {
903    super('resize');
904    this.requireResize = false;
905    this.resizing = this.resize.bind(this);
906    const requesting = this.request.bind(this);
907    if (document.fonts) {
908      document.fonts.ready.then(requesting);
909    }
910    window.addEventListener('resize', requesting);
911    window.addEventListener('orientationchange', requesting);
912  }
913
914  activate () {
915    this.request();
916  }
917
918  request () {
919    if (this.requireResize) return;
920    this.requireResize = true;
921    window.requestAnimationFrame(this.resizing);
922  }
923
924  resize () {
925    if (!this.requireResize) return;
926    this.forEach((instance) => instance.resize());
927    this.requireResize = false;
928  }
929}
930
931class ScrollLocker extends Module {
932  constructor () {
933    super('lock');
934    this._isLocked = false;
935    this._scrollY = 0;
936    this.onPopulate = this.lock.bind(this);
937    this.onEmpty = this.unlock.bind(this);
938  }
939
940  get isLocked () {
941    return this._isLocked;
942  }
943
944  lock () {
945    if (!this._isLocked) {
946      this._isLocked = true;
947      this._scrollY = window.scrollY;
948      const scrollBarGap = window.innerWidth - document.documentElement.clientWidth;
949      document.documentElement.setAttribute(ns.attr('scrolling'), 'false');
950      document.body.style.top = `${-this._scrollY}px`;
951      this.behavior = getComputedStyle(document.documentElement).getPropertyValue('scroll-behavior');
952      if (this.behavior === 'smooth') document.documentElement.style.scrollBehavior = 'auto';
953      if (scrollBarGap > 0) {
954        document.documentElement.style.setProperty('--scrollbar-width', `${scrollBarGap}px`);
955      }
956    }
957  }
958
959  unlock () {
960    if (this._isLocked) {
961      this._isLocked = false;
962      document.documentElement.removeAttribute(ns.attr('scrolling'));
963      document.body.style.top = '';
964      window.scrollTo(0, this._scrollY);
965      if (this.behavior === 'smooth') document.documentElement.style.removeProperty('scroll-behavior');
966      document.documentElement.style.removeProperty('--scrollbar-width');
967    }
968  }
969
970  move (value) {
971    if (this._isLocked) {
972      this._scrollY += value;
973      document.body.style.top = `${-this._scrollY}px`;
974    } else {
975      window.scrollTo(0, window.scrollY + value);
976    }
977  }
978}
979
980class Load extends Module {
981  constructor () {
982    super('load');
983    this.loading = this.load.bind(this);
984  }
985
986  activate () {
987    window.addEventListener('load', this.loading);
988  }
989
990  load () {
991    this.forEach((instance) => instance.load());
992  }
993}
994
995const FONT_FAMILIES = ['Marianne', 'Spectral'];
996
997class FontSwap extends Module {
998  constructor () {
999    super('font-swap');
1000    this.swapping = this.swap.bind(this);
1001  }
1002
1003  activate () {
1004    if (document.fonts) {
1005      document.fonts.addEventListener('loadingdone', this.swapping);
1006    }
1007  }
1008
1009  swap () {
1010    const families = FONT_FAMILIES.filter(family => document.fonts.check(`16px ${family}`));
1011
1012    this.forEach((instance) => instance.swapFont(families));
1013  }
1014}
1015
1016class MouseMove extends Module {
1017  constructor () {
1018    super('mouse-move');
1019    this.requireMove = false;
1020    this._isMoving = false;
1021    this.moving = this.move.bind(this);
1022    this.requesting = this.request.bind(this);
1023    this.onPopulate = this.listen.bind(this);
1024    this.onEmpty = this.unlisten.bind(this);
1025  }
1026
1027  listen () {
1028    if (this._isMoving) return;
1029    this._isMoving = true;
1030    this.requireMove = false;
1031    document.documentElement.addEventListener('mousemove', this.requesting);
1032  }
1033
1034  unlisten () {
1035    if (!this._isMoving) return;
1036    this._isMoving = false;
1037    this.requireMove = false;
1038    document.documentElement.removeEventListener('mousemove', this.requesting);
1039  }
1040
1041  request (e) {
1042    if (!this._isMoving) return;
1043    this.point = { x: e.clientX, y: e.clientY };
1044    if (this.requireMove) return;
1045    this.requireMove = true;
1046    window.requestAnimationFrame(this.moving);
1047  }
1048
1049  move () {
1050    if (!this.requireMove) return;
1051    this.forEach((instance) => instance.mouseMove(this.point));
1052    this.requireMove = false;
1053  }
1054}
1055
1056class Hash extends Module {
1057  constructor () {
1058    super('hash');
1059    this.handling = this.handle.bind(this);
1060    this.getLocationHash();
1061  }
1062
1063  activate () {
1064    window.addEventListener('hashchange', this.handling);
1065  }
1066
1067  deactivate () {
1068    window.removeEventListener('hashchange', this.handling);
1069  }
1070
1071  _sanitize (hash) {
1072    if (hash.charAt(0) === '#') return hash.substring(1);
1073    return hash;
1074  }
1075
1076  set hash (value) {
1077    const hash = this._sanitize(value);
1078    if (this._hash !== hash) window.location.hash = hash;
1079  }
1080
1081  get hash () {
1082    return this._hash;
1083  }
1084
1085  getLocationHash () {
1086    const hash = window.location.hash;
1087    this._hash = this._sanitize(hash);
1088  }
1089
1090  handle (e) {
1091    this.getLocationHash();
1092    this.forEach((instance) => instance.handleHash(this._hash, e));
1093  }
1094}
1095
1096class Engine {
1097  constructor () {
1098    state.create(Register);
1099    state.create(Stage);
1100    state.create(Renderer);
1101    state.create(Resizer);
1102    state.create(ScrollLocker);
1103    state.create(Load);
1104    state.create(FontSwap);
1105    state.create(MouseMove);
1106    state.create(Hash);
1107
1108    const registerModule = state.getModule('register');
1109    this.register = registerModule.register.bind(registerModule);
1110  }
1111
1112  get isActive () {
1113    return state.isActive;
1114  }
1115
1116  start () {
1117    inspector.debug('START');
1118    state.isActive = true;
1119  }
1120
1121  stop () {
1122    inspector.debug('STOP');
1123    state.isActive = false;
1124  }
1125}
1126
1127const engine = new Engine();
1128
1129class Colors {
1130  getColor (context, use, tint, options = {}) {
1131    const option = getOption(options);
1132    const decision = `--${context}-${use}-${tint}${option}`;
1133    return getComputedStyle(document.documentElement).getPropertyValue(decision).trim() || null;
1134  }
1135}
1136
1137const getOption = (options) => {
1138  switch (true) {
1139    case options.hover:
1140      return '-hover';
1141    case options.active:
1142      return '-active';
1143    default:
1144      return '';
1145  }
1146};
1147
1148const colors = new Colors();
1149
1150const sanitize = (className) => className.charAt(0) === '.' ? className.substr(1) : className;
1151
1152const getClassNames = (element) => {
1153  switch (true) {
1154    case !element.className:
1155      return [];
1156
1157    case typeof element.className === 'string':
1158      return element.className.split(' ');
1159
1160    case typeof element.className.baseVal === 'string':
1161      return element.className.baseVal.split(' ');
1162  }
1163
1164  return [];
1165};
1166
1167const modifyClass = (element, className, remove) => {
1168  className = sanitize(className);
1169  const classNames = getClassNames(element);
1170  const index = classNames.indexOf(className);
1171  if (remove === true) {
1172    if (index > -1) classNames.splice(index, 1);
1173  } else if (index === -1) classNames.push(className);
1174  element.className = classNames.join(' ');
1175};
1176
1177const addClass = (element, className) => modifyClass(element, className);
1178
1179const removeClass = (element, className) => modifyClass(element, className, true);
1180
1181const hasClass = (element, className) => getClassNames(element).indexOf(sanitize(className)) > -1;
1182
1183const ACTIONS = [
1184  '[tabindex]:not([tabindex="-1"])',
1185  'a[href]',
1186  'button:not([disabled])',
1187  'input:not([disabled])',
1188  'select:not([disabled])',
1189  'textarea:not([disabled])',
1190  'audio[controls]',
1191  'video[controls]',
1192  '[contenteditable]:not([contenteditable="false"])',
1193  'details>summary:first-of-type',
1194  'details',
1195  'iframe'
1196];
1197
1198const ACTIONS_SELECTOR = ACTIONS.join();
1199
1200const queryActions = (element) => {
1201  return element.querySelectorAll(ACTIONS_SELECTOR);
1202};
1203
1204let counter = 0;
1205
1206const uniqueId = (id) => {
1207  if (!document.getElementById(id)) return id;
1208  let element = true;
1209  const base = id;
1210  while (element) {
1211    counter++;
1212    id = `${base}-${counter}`;
1213    element = document.getElementById(id);
1214  }
1215  return id;
1216};
1217
1218const dom = {
1219  addClass: addClass,
1220  hasClass: hasClass,
1221  removeClass: removeClass,
1222  queryParentSelector: queryParentSelector,
1223  querySelectorAllArray: querySelectorAllArray,
1224  queryActions: queryActions,
1225  uniqueId: uniqueId
1226};
1227
1228class DataURISVG {
1229  constructor (width = 0, height = 0) {
1230    this._width = width;
1231    this._height = height;
1232    this._content = '';
1233  }
1234
1235  get width () {
1236    return this._width;
1237  }
1238
1239  set width (value) {
1240    this._width = value;
1241  }
1242
1243  get height () {
1244    return this._height;
1245  }
1246
1247  set height (value) {
1248    this._height = value;
1249  }
1250
1251  get content () {
1252    return this._content;
1253  }
1254
1255  set content (value) {
1256    this._content = value;
1257  }
1258
1259  getDataURI (isLegacy = false) {
1260    let 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>`;
1261
1262    svg = svg.replace(/#/gi, '%23');
1263    if (isLegacy) {
1264      svg = svg.replace(/</gi, '%3C');
1265      svg = svg.replace(/>/gi, '%3E');
1266      svg = svg.replace(/"/gi, '\'');
1267      svg = svg.replace(/{/gi, '%7B');
1268      svg = svg.replace(/}/gi, '%7D');
1269    }
1270    return `data:image/svg+xml;charset=utf8,${svg}`;
1271  }
1272}
1273
1274const image = {
1275  DataURISVG: DataURISVG
1276};
1277
1278const supportLocalStorage = () => {
1279  try {
1280    return 'localStorage' in window && window.localStorage !== null;
1281  } catch (e) {
1282    return false;
1283  }
1284};
1285
1286const supportAspectRatio = () => {
1287  if (!window.CSS) return false;
1288  return CSS.supports('aspect-ratio: 16 / 9');
1289};
1290
1291const support = {
1292  supportLocalStorage: supportLocalStorage,
1293  supportAspectRatio: supportAspectRatio
1294};
1295
1296const TransitionSelector = {
1297  NONE: ns.selector('transition-none')
1298};
1299
1300const selector = {
1301  TransitionSelector: TransitionSelector
1302};
1303
1304/**
1305 * Copy properties from multiple sources including accessors.
1306 * source : https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Global_Objects/Object/assign#copier_des_accesseurs
1307 *
1308 * @param {object} [target] - Target object to copy into
1309 * @param {...objects} [sources] - Multiple objects
1310 * @return {object} A new object
1311 *
1312 * @example
1313 *
1314 *     const obj1 = {
1315 *        key: 'value'
1316 *     };
1317 *     const obj2 = {
1318 *        get function01 () {
1319 *          return a-value;
1320 *        }
1321 *        set function01 () {
1322 *          return a-value;
1323 *        }
1324 *     };
1325 *     completeAssign(obj1, obj2)
1326 */
1327const completeAssign = (target, ...sources) => {
1328  sources.forEach(source => {
1329    const descriptors = Object.keys(source).reduce((descriptors, key) => {
1330      descriptors[key] = Object.getOwnPropertyDescriptor(source, key);
1331      return descriptors;
1332    }, {});
1333
1334    Object.getOwnPropertySymbols(source).forEach(sym => {
1335      const descriptor = Object.getOwnPropertyDescriptor(source, sym);
1336      if (descriptor.enumerable) {
1337        descriptors[sym] = descriptor;
1338      }
1339    });
1340    Object.defineProperties(target, descriptors);
1341  });
1342  return target;
1343};
1344
1345const property = {
1346  completeAssign: completeAssign
1347};
1348
1349/**
1350 * Return an object of query params or null
1351 *
1352 * @method
1353 * @name searchParams
1354 * @param {string} url - an url
1355 * @returns {Object} object of query params or null
1356 */
1357
1358const searchParams = (url) => {
1359  if (url && url.search) {
1360    const params = new URLSearchParams(window.location.search);
1361    const entries = params.entries();
1362    return Object.fromEntries(entries);
1363  }
1364  return null;
1365};
1366
1367const internals = {};
1368const legacy = {};
1369
1370Object.defineProperty(legacy, 'isLegacy', {
1371  get: () => state.isLegacy
1372});
1373
1374legacy.setLegacy = () => {
1375  state.isLegacy = true;
1376};
1377
1378internals.legacy = legacy;
1379internals.dom = dom;
1380internals.image = image;
1381internals.support = support;
1382internals.motion = selector;
1383internals.property = property;
1384internals.ns = ns;
1385internals.register = engine.register;
1386internals.state = state;
1387internals.query = searchParams(window.location);
1388
1389Object.defineProperty(internals, 'preventManipulation', {
1390  get: () => options.preventManipulation
1391});
1392Object.defineProperty(internals, 'stage', {
1393  get: () => state.getModule('stage')
1394});
1395
1396const api$1 = (node) => {
1397  const stage = state.getModule('stage');
1398  return stage.getProxy(node);
1399};
1400
1401api$1.version = config.version;
1402api$1.prefix = config.prefix;
1403api$1.organisation = config.organisation;
1404api$1.Modes = Modes;
1405
1406Object.defineProperty(api$1, 'mode', {
1407  set: (value) => { options.mode = value; },
1408  get: () => options.mode
1409});
1410
1411api$1.internals = internals;
1412api$1.version = config.version;
1413
1414api$1.start = engine.start;
1415api$1.stop = engine.stop;
1416
1417api$1.inspector = inspector;
1418api$1.colors = colors;
1419
1420const configuration = window[config.namespace];
1421api$1.internals.configuration = configuration;
1422
1423options.configure(configuration, api$1.start, api$1.internals.query);
1424
1425window[config.namespace] = api$1;
1426
1427class Emitter {
1428  constructor () {
1429    this.emissions = {};
1430  }
1431
1432  add (type, closure) {
1433    if (typeof closure !== 'function') throw new Error('closure must be a function');
1434    if (!this.emissions[type]) this.emissions[type] = [];
1435    this.emissions[type].push(closure);
1436  }
1437
1438  remove (type, closure) {
1439    if (!this.emissions[type]) return;
1440    if (!closure) delete this.emissions[type];
1441    else {
1442      const index = this.emissions[type].indexOf(closure);
1443      if (index > -1) this.emissions[type].splice(index);
1444    }
1445  }
1446
1447  emit (type, data) {
1448    if (!this.emissions[type]) return [];
1449    const response = [];
1450    for (const closure of this.emissions[type]) if (closure) response.push(closure(data));
1451    return response;
1452  }
1453
1454  dispose () {
1455    this.emissions = null;
1456  }
1457}
1458
1459class Breakpoint {
1460  constructor (id, minWidth) {
1461    this.id = id;
1462    this.minWidth = minWidth;
1463  }
1464
1465  test () {
1466    return window.matchMedia(`(min-width: ${this.minWidth}em)`).matches;
1467  }
1468}
1469
1470const Breakpoints = {
1471  XS: new Breakpoint('xs', 0),
1472  SM: new Breakpoint('sm', 36),
1473  MD: new Breakpoint('md', 48),
1474  LG: new Breakpoint('lg', 62),
1475  XL: new Breakpoint('xl', 78)
1476};
1477
1478class Instance {
1479  constructor (jsAttribute = true) {
1480    this.jsAttribute = jsAttribute;
1481    this._isRendering = false;
1482    this._isResizing = false;
1483    this._isScrollLocked = false;
1484    this._isLoading = false;
1485    this._isSwappingFont = false;
1486    this._isEnabled = true;
1487    this._isDisposed = false;
1488    this._listeners = {};
1489    this._handlingClick = this.handleClick.bind(this);
1490    this._hashes = [];
1491    this._hash = '';
1492    this._keyListenerTypes = [];
1493    this._keys = [];
1494    this.handlingKey = this.handleKey.bind(this);
1495    this._emitter = new Emitter();
1496    this._ascent = new Emitter();
1497    this._descent = new Emitter();
1498    this._registrations = [];
1499    this._nexts = [];
1500  }
1501
1502  static get instanceClassName () {
1503    return 'Instance';
1504  }
1505
1506  _config (element, registration) {
1507    this.element = element;
1508    this.registration = registration;
1509    this.node = element.node;
1510    this.id = element.node.id;
1511    if (this.jsAttribute) this.setAttribute(registration.attribute, true);
1512    this.init();
1513  }
1514
1515  init () {}
1516
1517  get proxy () {
1518    const scope = this;
1519    const proxy = {
1520      render: () => scope.render(),
1521      resize: () => scope.resize()
1522    };
1523
1524    const proxyAccessors = {
1525      get node () {
1526        return this.node;
1527      },
1528      get isEnabled () {
1529        return scope.isEnabled;
1530      },
1531      set isEnabled (value) {
1532        scope.isEnabled = value;
1533      }
1534    };
1535
1536    return completeAssign(proxy, proxyAccessors);
1537  }
1538
1539  log (...values) {
1540    values.unshift(`${this.registration.instanceClassName} #${this.id} - `);
1541    inspector.log.apply(inspector, values);
1542  }
1543
1544  debug (...values) {
1545    values.unshift(`${this.registration.instanceClassName} #${this.id} - `);
1546    inspector.debug.apply(inspector, values);
1547  }
1548
1549  info (...values) {
1550    values.unshift(`${this.registration.instanceClassName} #${this.id} - `);
1551    inspector.info.apply(inspector, values);
1552  }
1553
1554  warn (...values) {
1555    values.unshift(`${this.registration.instanceClassName} #${this.id} - `);
1556    inspector.warn.apply(inspector, values);
1557  }
1558
1559  error (...values) {
1560    values.unshift(`${this.registration.instanceClassName} #${this.id} - `);
1561    inspector.error.apply(inspector, values);
1562  }
1563
1564  register (selector, InstanceClass) {
1565    const registration = state.getModule('register').register(selector, InstanceClass, this);
1566    this._registrations.push(registration);
1567  }
1568
1569  getRegisteredInstances (instanceClassName) {
1570    for (const registration of this._registrations) if (registration.hasInstanceClassName(instanceClassName)) return registration.instances.collection;
1571    return [];
1572  }
1573
1574  dispatch (type, detail, bubbles, cancelable) {
1575    const event = new CustomEvent(type, { detail: detail, bubble: bubbles === true, cancelable: cancelable === true });
1576    this.node.dispatchEvent(event);
1577  }
1578
1579  // TODO v2 => listener au niveau des éléments qui redistribuent aux instances.
1580  listen (type, closure, options) {
1581    if (!this._listeners[type]) this._listeners[type] = [];
1582    const listeners = this._listeners[type];
1583    // if (listeners.some(listener => listener.closure === closure)) return;
1584    const listener = new Listener(this.node, type, closure, options);
1585    listeners.push(listener);
1586    listener.listen();
1587  }
1588
1589  unlisten (type, closure, options) {
1590    if (!type) {
1591      for (const type in this._listeners) this.unlisten(type);
1592      return;
1593    }
1594
1595    const listeners = this._listeners[type];
1596
1597    if (!listeners) return;
1598
1599    if (!closure) {
1600      listeners.forEach(listener => this.unlisten(type, listener.closure));
1601      return;
1602    }
1603
1604    const removal = listeners.filter(listener => listener.closure === closure && listener.matchOptions(options));
1605    removal.forEach(listener => listener.unlisten());
1606    this._listeners[type] = listeners.filter(listener => removal.indexOf(listener) === -1);
1607  }
1608
1609  listenClick (options) {
1610    this.listen('click', this._handlingClick, options);
1611  }
1612
1613  unlistenClick (options) {
1614    this.unlisten('click', this._handlingClick, options);
1615  }
1616
1617  handleClick (e) {}
1618
1619  set hash (value) {
1620    state.getModule('hash').hash = value;
1621  }
1622
1623  get hash () {
1624    return state.getModule('hash').hash;
1625  }
1626
1627  listenHash (hash, add) {
1628    if (!this._hashes) return;
1629    if (this._hashes.length === 0) state.add('hash', this);
1630    const action = new HashAction(hash, add);
1631    this._hashes = this._hashes.filter(action => action.hash !== hash);
1632    this._hashes.push(action);
1633  }
1634
1635  unlistenHash (hash) {
1636    if (!this._hashes) return;
1637    this._hashes = this._hashes.filter(action => action.hash !== hash);
1638    if (this._hashes.length === 0) state.remove('hash', this);
1639  }
1640
1641  handleHash (hash, e) {
1642    if (!this._hashes) return;
1643    for (const action of this._hashes) action.handle(hash, e);
1644  }
1645
1646  listenKey (keyCode, closure, preventDefault = false, stopPropagation = false, type = 'down') {
1647    if (this._keyListenerTypes.indexOf(type) === -1) {
1648      this.listen(`key${type}`, this.handlingKey);
1649      this._keyListenerTypes.push(type);
1650    }
1651
1652    this._keys.push(new KeyAction(type, keyCode, closure, preventDefault, stopPropagation));
1653  }
1654
1655  unlistenKey (code, closure) {
1656    this._keys = this._keys.filter((key) => key.code !== code || key.closure !== closure);
1657
1658    this._keyListenerTypes.forEach(type => {
1659      if (!this._keys.some(key => key.type === type)) this.unlisten(`key${type}`, this.handlingKey);
1660    });
1661  }
1662
1663  handleKey (e) {
1664    for (const key of this._keys) key.handle(e);
1665  }
1666
1667  get isEnabled () { return this._isEnabled; }
1668
1669  set isEnabled (value) {
1670    this._isEnabled = value;
1671  }
1672
1673  get isRendering () { return this._isRendering; }
1674
1675  set isRendering (value) {
1676    if (this._isRendering === value) return;
1677    if (value) state.add('render', this);
1678    else state.remove('render', this);
1679    this._isRendering = value;
1680  }
1681
1682  render () {}
1683
1684  request (closure) {
1685    this._nexts.push(closure);
1686    state.getModule('render').request(this);
1687  }
1688
1689  next () {
1690    const nexts = this._nexts.slice();
1691    this._nexts.length = 0;
1692    for (const closure of nexts) if (closure) closure();
1693  }
1694
1695  get isResizing () { return this._isResizing; }
1696
1697  set isResizing (value) {
1698    if (this._isResizing === value) return;
1699    if (value) {
1700      state.add('resize', this);
1701      this.resize();
1702    } else state.remove('resize', this);
1703    this._isResizing = value;
1704  }
1705
1706  resize () {}
1707
1708  isBreakpoint (breakpoint) {
1709    switch (true) {
1710      case typeof breakpoint === 'string':
1711        return Breakpoints[breakpoint.toUpperCase()].test();
1712
1713      default:
1714        return breakpoint.test();
1715    }
1716  }
1717
1718  get isScrollLocked () {
1719    return this._isScrollLocked;
1720  }
1721
1722  set isScrollLocked (value) {
1723    if (this._isScrollLocked === value) return;
1724    if (value) state.add('lock', this);
1725    else state.remove('lock', this);
1726    this._isScrollLocked = value;
1727  }
1728
1729  get isLoading () {
1730    return this._isLoading;
1731  }
1732
1733  set isLoading (value) {
1734    if (this._isLoading === value) return;
1735    if (value) state.add('load', this);
1736    else state.remove('load', this);
1737    this._isLoading = value;
1738  }
1739
1740  load () {}
1741
1742  get isSwappingFont () {
1743    return this._isSwappingFont;
1744  }
1745
1746  set isSwappingFont (value) {
1747    if (this._isSwappingFont === value) return;
1748    if (value) state.add('font-swap', this);
1749    else state.remove('font-swap', this);
1750    this._isSwappingFont = value;
1751  }
1752
1753  swapFont () {}
1754
1755  get isMouseMoving () { return this._isMouseMoving; }
1756
1757  set isMouseMoving (value) {
1758    if (this._isMouseMoving === value) return;
1759    if (value) {
1760      state.add('mouse-move', this);
1761    } else {
1762      state.remove('mouse-move', this);
1763    }
1764    this._isMouseMoving = value;
1765  }
1766
1767  mouseMove (point) {}
1768
1769  examine (attributeNames) {
1770    if (!this.node.matches(this.registration.selector)) {
1771      this._dispose();
1772      return;
1773    }
1774
1775    this.mutate(attributeNames);
1776  }
1777
1778  mutate (attributeNames) {}
1779
1780  retrieveNodeId (node, append) {
1781    if (node.id) return node.id;
1782    const id = uniqueId(`${this.id}-${append}`);
1783    this.warn(`add id '${id}' to ${append}`);
1784    node.setAttribute('id', id);
1785    return id;
1786  }
1787
1788  get isDisposed () {
1789    return this._isDisposed;
1790  }
1791
1792  _dispose () {
1793    this.debug(`dispose instance of ${this.registration.instanceClassName} on element [${this.element.id}]`);
1794    this.removeAttribute(this.registration.attribute);
1795    this.unlisten();
1796    state.remove('hash', this);
1797    this._hashes = null;
1798    this._keys = null;
1799    this.isRendering = false;
1800    this.isResizing = false;
1801    this._nexts = null;
1802    state.getModule('render').nexts.remove(this);
1803    this.isScrollLocked = false;
1804    this.isLoading = false;
1805    this.isSwappingFont = false;
1806    this.isMouseMoving = false;
1807    this._emitter.dispose();
1808    this._emitter = null;
1809    this._ascent.dispose();
1810    this._ascent = null;
1811    this._descent.dispose();
1812    this._descent = null;
1813    this.element.remove(this);
1814    for (const registration of this._registrations) state.remove('register', registration);
1815    this._registrations = null;
1816    this.registration.remove(this);
1817    this._isDisposed = true;
1818    this.dispose();
1819  }
1820
1821  dispose () {}
1822
1823  emit (type, data) {
1824    return this.element.emit(type, data);
1825  }
1826
1827  addEmission (type, closure) {
1828    this._emitter.add(type, closure);
1829  }
1830
1831  removeEmission (type, closure) {
1832    this._emitter.remove(type, closure);
1833  }
1834
1835  ascend (type, data) {
1836    return this.element.ascend(type, data);
1837  }
1838
1839  addAscent (type, closure) {
1840    this._ascent.add(type, closure);
1841  }
1842
1843  removeAscent (type, closure) {
1844    this._ascent.remove(type, closure);
1845  }
1846
1847  descend (type, data) {
1848    return this.element.descend(type, data);
1849  }
1850
1851  addDescent (type, closure) {
1852    this._descent.add(type, closure);
1853  }
1854
1855  removeDescent (type, closure) {
1856    this._descent.remove(type, closure);
1857  }
1858
1859  get style () {
1860    return this.node.style;
1861  }
1862
1863  addClass (className) {
1864    addClass(this.node, className);
1865  }
1866
1867  removeClass (className) {
1868    removeClass(this.node, className);
1869  }
1870
1871  hasClass (className) {
1872    return hasClass(this.node, className);
1873  }
1874
1875  get classNames () {
1876    return getClassNames(this.node);
1877  }
1878
1879  remove () {
1880    this.node.parentNode.removeChild(this.node);
1881  }
1882
1883  setAttribute (attributeName, value) {
1884    this.node.setAttribute(attributeName, value);
1885  }
1886
1887  getAttribute (attributeName) {
1888    return this.node.getAttribute(attributeName);
1889  }
1890
1891  hasAttribute (attributeName) {
1892    return this.node.hasAttribute(attributeName);
1893  }
1894
1895  removeAttribute (attributeName) {
1896    this.node.removeAttribute(attributeName);
1897  }
1898
1899  setProperty (propertyName, value) {
1900    this.node.style.setProperty(propertyName, value);
1901  }
1902
1903  removeProperty (propertyName) {
1904    this.node.style.removeProperty(propertyName);
1905  }
1906
1907  focus () {
1908    this.node.focus();
1909  }
1910
1911  blur () {
1912    this.node.blur();
1913  }
1914
1915  focusClosest () {
1916    const closest = this._focusClosest(this.node.parentNode);
1917    if (closest) closest.focus();
1918  }
1919
1920  _focusClosest (parent) {
1921    if (!parent) return null;
1922    const actions = [...queryActions(parent)];
1923    if (actions.length <= 1) {
1924      return this._focusClosest(parent.parentNode);
1925    } else {
1926      const index = actions.indexOf(this.node);
1927      return actions[index + (index < actions.length - 1 ? 1 : -1)];
1928    }
1929  }
1930
1931  get hasFocus () {
1932    return this.node === document.activeElement;
1933  }
1934
1935  scrollIntoView () {
1936    const rect = this.getRect();
1937
1938    const scroll = state.getModule('lock');
1939
1940    if (rect.top < 0) {
1941      scroll.move(rect.top - 50);
1942    }
1943
1944    if (rect.bottom > window.innerHeight) {
1945      scroll.move(rect.bottom - window.innerHeight + 50);
1946    }
1947  }
1948
1949  matches (selectors) {
1950    return this.node.matches(selectors);
1951  }
1952
1953  querySelector (selectors) {
1954    return this.node.querySelector(selectors);
1955  }
1956
1957  querySelectorAll (selectors) {
1958    return querySelectorAllArray(this.node, selectors);
1959  }
1960
1961  queryParentSelector (selectors) {
1962    return queryParentSelector(this.node, selectors);
1963  }
1964
1965  getRect () {
1966    const rect = this.node.getBoundingClientRect();
1967    rect.center = rect.left + rect.width * 0.5;
1968    rect.middle = rect.top + rect.height * 0.5;
1969    return rect;
1970  }
1971
1972  get isLegacy () {
1973    return state.isLegacy;
1974  }
1975}
1976
1977class KeyAction {
1978  constructor (type, keyCode, closure, preventDefault, stopPropagation) {
1979    this.type = type;
1980    this.eventType = `key${type}`;
1981    this.keyCode = keyCode;
1982    this.closure = closure;
1983    this.preventDefault = preventDefault === true;
1984    this.stopPropagation = stopPropagation === true;
1985  }
1986
1987  handle (e) {
1988    if (e.type !== this.eventType) return;
1989    if (e.keyCode === this.keyCode.value) {
1990      this.closure(e);
1991      if (this.preventDefault) {
1992        e.preventDefault();
1993      }
1994      if (this.stopPropagation) {
1995        e.stopPropagation();
1996      }
1997    }
1998  }
1999}
2000
2001class Listener {
2002  constructor (node, type, closure, options) {
2003    this._node = node;
2004    this._type = type;
2005    this._closure = closure;
2006    this._options = options;
2007  }
2008
2009  get closure () {
2010    return this._closure;
2011  }
2012
2013  listen () {
2014    this._node.addEventListener(this._type, this._closure, this._options);
2015  }
2016
2017  matchOptions (options = null) {
2018    switch (true) {
2019      case options === null:
2020      case typeof this._options === 'boolean' && typeof options === 'boolean' && this._options === options:
2021        return true;
2022
2023      case Object.keys(this._options).length !== Object.keys(options).length:
2024        return false;
2025
2026      case Object.keys(options).every(key => this._options[key] === options[key]):
2027        return true;
2028    }
2029
2030    return false;
2031  }
2032
2033  unlisten () {
2034    this._node.removeEventListener(this._type, this._closure, this._options);
2035  }
2036}
2037
2038class HashAction {
2039  constructor (hash, add) {
2040    this.hash = hash;
2041    this.add = add;
2042  }
2043
2044  handle (hash, e) {
2045    if (this.hash === hash) this.add(e);
2046  }
2047}
2048
2049const DisclosureEvent = {
2050  DISCLOSE: ns.event('disclose'),
2051  CONCEAL: ns.event('conceal')
2052};
2053
2054const DisclosureEmission = {
2055  RESET: ns.emission('disclosure', 'reset'),
2056  ADDED: ns.emission('disclosure', 'added'),
2057  RETRIEVE: ns.emission('disclosure', 'retrieve'),
2058  REMOVED: ns.emission('disclosure', 'removed'),
2059  GROUP: ns.emission('disclosure', 'group'),
2060  UNGROUP: ns.emission('disclosure', 'ungroup'),
2061  SPOTLIGHT: ns.emission('disclosure', 'spotlight')
2062};
2063
2064class Disclosure extends Instance {
2065  constructor (type, selector, DisclosureButtonInstanceClass, disclosuresGroupInstanceClassName) {
2066    super();
2067    this.type = type;
2068    this._selector = selector;
2069    this.DisclosureButtonInstanceClass = DisclosureButtonInstanceClass;
2070    this.disclosuresGroupInstanceClassName = disclosuresGroupInstanceClassName;
2071    this.modifier = this._selector + '--' + this.type.id;
2072    this._isPristine = true;
2073    this._isRetrievingPrimaries = false;
2074    this._hasRetrieved = false;
2075    this._primaryButtons = [];
2076  }
2077
2078  static get instanceClassName () {
2079    return 'Disclosure';
2080  }
2081
2082  init () {
2083    this.addDescent(DisclosureEmission.RESET, this.reset.bind(this));
2084    this.addDescent(DisclosureEmission.GROUP, this.update.bind(this));
2085    this.addDescent(DisclosureEmission.UNGROUP, this.update.bind(this));
2086    this.addAscent(DisclosureEmission.SPOTLIGHT, this.disclose.bind(this));
2087    this.register(`[aria-controls="${this.id}"]`, this.DisclosureButtonInstanceClass);
2088    this.ascend(DisclosureEmission.ADDED);
2089    this.listenHash(this.id, this._spotlight.bind(this));
2090    this.update();
2091  }
2092
2093  get isEnabled () { return super.isEnabled; }
2094
2095  set isEnabled (value) {
2096    if (this.isEnabled === value) return;
2097    super.isEnabled = value;
2098    if (value) this.ascend(DisclosureEmission.ADDED);
2099    else this.ascend(DisclosureEmission.REMOVED);
2100  }
2101
2102  get isPristine () {
2103    return this._isPristine;
2104  }
2105
2106  get proxy () {
2107    const scope = this;
2108    const proxy = Object.assign(super.proxy, {
2109      disclose: scope.disclose.bind(scope),
2110      focus: scope.focus.bind(scope)
2111    });
2112
2113    if (this.type.canConceal) proxy.conceal = scope.conceal.bind(scope);
2114
2115    const proxyAccessors = {
2116      get buttons () {
2117        return scope.buttons.map((button) => button.proxy);
2118      },
2119      get group () {
2120        const group = scope.group;
2121        return group ? group.proxy : null;
2122      },
2123      get isDisclosed () {
2124        return scope.isDisclosed;
2125      }
2126    };
2127
2128    return completeAssign(proxy, proxyAccessors);
2129  }
2130
2131  get buttons () {
2132    return this.getRegisteredInstances(this.DisclosureButtonInstanceClass.instanceClassName);
2133  }
2134
2135  update () {
2136    this.getGroup();
2137    this.retrievePrimaries();
2138  }
2139
2140  getGroup () {
2141    if (!this.disclosuresGroupInstanceClassName) {
2142      this._group = null;
2143      return;
2144    }
2145
2146    const group = this.element.getAscendantInstance(this.disclosuresGroupInstanceClassName, this.constructor.instanceClassName);
2147    if (!group || !group.validate(this)) {
2148      this._group = null;
2149      return;
2150    }
2151
2152    this._group = group;
2153  }
2154
2155  get group () {
2156    return this._group;
2157  }
2158
2159  disclose (withhold) {
2160    if (this.isDisclosed === true || !this.isEnabled) return false;
2161    this._isPristine = false;
2162    this.isDisclosed = true;
2163    if (!withhold && this.group) this.group.current = this;
2164    return true;
2165  }
2166
2167  conceal (withhold, preventFocus = true) {
2168    if (this.isDisclosed === false) return false;
2169    if (!this.type.canConceal && this.group && this.group.current === this) return false;
2170    this.isDisclosed = false;
2171    if (!withhold && this.group && this.group.current === this) this.group.current = null;
2172    if (!preventFocus) this.focus();
2173    if (!this._isPristine) this.descend(DisclosureEmission.RESET);
2174    return true;
2175  }
2176
2177  get isDisclosed () {
2178    return this._isDisclosed;
2179  }
2180
2181  set isDisclosed (value) {
2182    if (this._isDisclosed === value || (!this.isEnabled && value === true)) return;
2183    this.dispatch(value ? DisclosureEvent.DISCLOSE : DisclosureEvent.CONCEAL, this.type);
2184    this._isDisclosed = value;
2185    if (value) this.addClass(this.modifier);
2186    else this.removeClass(this.modifier);
2187    for (let i = 0; i < this.buttons.length; i++) this.buttons[i].apply(value);
2188  }
2189
2190  get isInitiallyDisclosed () {
2191    return this.primaryButtons.some(button => button.isInitiallyDisclosed);
2192  }
2193
2194  hasRetrieved () {
2195    return this._hasRetrieved;
2196  }
2197
2198  reset () {}
2199
2200  toggle (canDisclose) {
2201    if (!this.type.canConceal) this.disclose();
2202    else {
2203      switch (true) {
2204        case !canDisclose:
2205        case this.isDisclosed:
2206          this.conceal(false, false);
2207          break;
2208
2209        default:
2210          this.disclose();
2211      }
2212    }
2213  }
2214
2215  get buttonHasFocus () {
2216    return this.buttons.some((button) => { return button.hasFocus; });
2217  }
2218
2219  get hasFocus () {
2220    if (super.hasFocus) return true;
2221    if (this.buttonHasFocus) return true;
2222    return this.querySelectorAll(':focus').length > 0;
2223  }
2224
2225  focus () {
2226    if (this._primaryButtons.length > 0) this._primaryButtons[0].focus();
2227  }
2228
2229  get primaryButtons () {
2230    return this._primaryButtons;
2231  }
2232
2233  retrievePrimaries () {
2234    if (this._isRetrievingPrimaries) return;
2235    this._isRetrievingPrimaries = true;
2236    this.request(this._retrievePrimaries.bind(this));
2237  }
2238
2239  _retrievePrimaries () {
2240    this._isRetrievingPrimaries = false;
2241    this._primaryButtons = this._electPrimaries(this.buttons);
2242
2243    if (this._hasRetrieved || this._primaryButtons.length === 0) return;
2244    this.retrieved();
2245    this._hasRetrieved = true;
2246
2247    this.applyAbility(true);
2248
2249    if (this.group) {
2250      this.group.retrieve();
2251      return;
2252    }
2253
2254    if (this._isPristine && this.isEnabled && !this.group) {
2255      switch (true) {
2256        case this.hash === this.id:
2257          this._spotlight();
2258          break;
2259
2260        case this.isInitiallyDisclosed:
2261          this.disclose();
2262          break;
2263      }
2264    }
2265  }
2266
2267  retrieved () {}
2268
2269  _spotlight () {
2270    this.disclose();
2271    this.request(() => { this.ascend(DisclosureEmission.SPOTLIGHT); });
2272  }
2273
2274  _electPrimaries (candidates) {
2275    return candidates.filter(button => button.canDisclose && !this.node.contains(button.node));
2276  }
2277
2278  applyAbility (withhold = false) {
2279    const isEnabled = !this._primaryButtons.every(button => button.isDisabled);
2280
2281    if (this.isEnabled === isEnabled) return;
2282
2283    this.isEnabled = isEnabled;
2284
2285    if (withhold) return;
2286
2287    if (!this.isEnabled && this.isDisclosed) {
2288      if (this.group) this.ascend(DisclosureEmission.REMOVED);
2289      else if (this.type.canConceal) this.conceal();
2290    }
2291
2292    if (this.isEnabled) {
2293      if (this.group) this.ascend(DisclosureEmission.ADDED);
2294      if (this.hash === this.id) {
2295        this._spotlight();
2296      }
2297    }
2298  }
2299
2300  dispose () {
2301    this._group = null;
2302    this._primaryButtons = null;
2303    super.dispose();
2304    this.ascend(DisclosureEmission.REMOVED);
2305  }
2306}
2307
2308class DisclosureButton extends Instance {
2309  constructor (type) {
2310    super();
2311    this.type = type;
2312    this.attributeName = type.ariaState ? 'aria-' + type.id : ns.attr(type.id);
2313    this._canDisclose = false;
2314  }
2315
2316  static get instanceClassName () {
2317    return 'DisclosureButton';
2318  }
2319
2320  get isPrimary () {
2321    return this.registration.creator.primaryButtons.includes(this);
2322  }
2323
2324  get canDisclose () {
2325    return this._canDisclose;
2326  }
2327
2328  get isDisabled () {
2329    return this.type.canDisable && this.hasAttribute('disabled');
2330  }
2331
2332  init () {
2333    this._canDisclose = this.hasAttribute(this.attributeName);
2334    this._isInitiallyDisclosed = this.isDisclosed;
2335    this._isContained = this.registration.creator.node.contains(this.node);
2336    this.controlsId = this.getAttribute('aria-controls');
2337    this.registration.creator.retrievePrimaries();
2338    this.listenClick();
2339  }
2340
2341  get proxy () {
2342    const scope = this;
2343    return Object.assign(super.proxy, {
2344      focus: scope.focus.bind(scope)
2345    });
2346  }
2347
2348  handleClick (e) {
2349    if (this.registration.creator) this.registration.creator.toggle(this.canDisclose);
2350  }
2351
2352  mutate (attributeNames) {
2353    this._canDisclose = this.hasAttribute(this.attributeName);
2354    this.registration.creator.applyAbility();
2355    if (!this._isApplying && this.isPrimary && attributeNames.indexOf(this.attributeName) > -1 && this.registration.creator) {
2356      if (this.isDisclosed) this.registration.creator.disclose();
2357      else if (this.type.canConceal) this.registration.creator.conceal();
2358    }
2359  }
2360
2361  apply (value) {
2362    if (!this.canDisclose) return;
2363    this._isApplying = true;
2364    this.setAttribute(this.attributeName, value);
2365    this.request(() => { this._isApplying = false; });
2366  }
2367
2368  get isDisclosed () {
2369    return this.getAttribute(this.attributeName) === 'true';
2370  }
2371
2372  get isInitiallyDisclosed () {
2373    return this._isInitiallyDisclosed;
2374  }
2375
2376  focus () {
2377    super.focus();
2378    this.scrollIntoView();
2379  }
2380
2381  measure (rect) {
2382    const buttonRect = this.rect;
2383    this._dx = rect.x - buttonRect.x;
2384    this._dy = rect.y - buttonRect.y;
2385  }
2386
2387  get dx () {
2388    return this._dx;
2389  }
2390
2391  get dy () {
2392    return this._dy;
2393  }
2394}
2395
2396const DisclosureSelector = {
2397  PREVENT_CONCEAL: ns.attr.selector('prevent-conceal'),
2398  GROUP: ns.attr('group')
2399};
2400
2401class DisclosuresGroup extends Instance {
2402  constructor (disclosureInstanceClassName, jsAttribute) {
2403    super(jsAttribute);
2404    this.disclosureInstanceClassName = disclosureInstanceClassName;
2405    this._members = [];
2406    this._index = -1;
2407    this._isRetrieving = false;
2408    this._hasRetrieved = false;
2409    this._isGrouped = true;
2410  }
2411
2412  static get instanceClassName () {
2413    return 'DisclosuresGroup';
2414  }
2415
2416  init () {
2417    this.addAscent(DisclosureEmission.ADDED, this.update.bind(this));
2418    this.addAscent(DisclosureEmission.RETRIEVE, this.retrieve.bind(this));
2419    this.addAscent(DisclosureEmission.REMOVED, this.update.bind(this));
2420    this.descend(DisclosureEmission.GROUP);
2421    this._isGrouped = this.getAttribute(DisclosureSelector.GROUP) !== 'false';
2422    this.update();
2423  }
2424
2425  get proxy () {
2426    const scope = this;
2427
2428    const proxyAccessors = {
2429      set index (value) {
2430        scope.index = value;
2431      },
2432      get index () {
2433        return scope.index;
2434      },
2435      get length () {
2436        return scope.length;
2437      },
2438      get current () {
2439        const current = scope.current;
2440        return current ? current.proxy : null;
2441      },
2442      get members () {
2443        return scope.members.map((member) => member.proxy);
2444      },
2445      get hasFocus () {
2446        return scope.hasFocus;
2447      },
2448      set isGrouped (value) {
2449        scope.isGrouped = value;
2450      },
2451      get isGrouped () {
2452        return scope.isGrouped;
2453      }
2454    };
2455
2456    return completeAssign(super.proxy, proxyAccessors);
2457  }
2458
2459  validate (member) {
2460    return true;
2461  }
2462
2463  getMembers () {
2464    const members = this.element.getDescendantInstances(this.disclosureInstanceClassName, this.constructor.instanceClassName, true);
2465    this._members = members.filter(this.validate.bind(this)).filter(member => member.isEnabled);
2466    const invalids = members.filter(member => !this._members.includes(member));
2467    invalids.forEach(invalid => invalid.conceal());
2468  }
2469
2470  retrieve (bypassPrevention = false) {
2471    if (this._isRetrieving || (this._hasRetrieved && !bypassPrevention)) return;
2472    this._isRetrieving = true;
2473    this.request(this._retrieve.bind(this));
2474  }
2475
2476  _retrieve () {
2477    this.getMembers();
2478    this._isRetrieving = false;
2479    this._hasRetrieved = true;
2480    if (this.hash) {
2481      for (let i = 0; i < this.length; i++) {
2482        const member = this.members[i];
2483        if (this.hash === member.id) {
2484          this.index = i;
2485          this.request(() => { this.ascend(DisclosureEmission.SPOTLIGHT); });
2486          return i;
2487        }
2488      }
2489    }
2490
2491    for (let i = 0; i < this.length; i++) {
2492      const member = this.members[i];
2493      if (member.isInitiallyDisclosed) {
2494        this.index = i;
2495        return i;
2496      }
2497    }
2498
2499    return this.getIndex();
2500  }
2501
2502  update () {
2503    this.getMembers();
2504    if (this._hasRetrieved) this.getIndex();
2505  }
2506
2507  get members () {
2508    return this._members;
2509  }
2510
2511  get length () {
2512    return this.members ? this.members.length : 0;
2513  }
2514
2515  getIndex (defaultIndex = -1) {
2516    this._index = undefined;
2517    let index = defaultIndex;
2518    for (let i = 0; i < this.length; i++) {
2519      if (this.members[i].isDisclosed) {
2520        index = i;
2521        break;
2522      }
2523    }
2524
2525    this.index = index;
2526    return index;
2527  }
2528
2529  get index () {
2530    return this._index;
2531  }
2532
2533  set index (value) {
2534    if (value < -1 || value >= this.length || value === this._index) return;
2535    this._index = value;
2536    for (let i = 0; i < this.length; i++) {
2537      const member = this.members[i];
2538      if (value === i) {
2539        if (!member.isDisclosed) member.disclose(true);
2540      } else {
2541        if ((this.isGrouped || !this.canUngroup) && member.isDisclosed) member.conceal(true);
2542      }
2543    }
2544    this.apply();
2545  }
2546
2547  get current () {
2548    if (this._index === -1 || isNaN(this._index)) return null;
2549    return this._members[this._index] || null;
2550  }
2551
2552  set current (member) {
2553    this.index = this.members.indexOf(member);
2554  }
2555
2556  get hasFocus () {
2557    const current = this.current;
2558    if (current) return current.hasFocus;
2559    return false;
2560  }
2561
2562  set isGrouped (value) {
2563    const isGrouped = !!value;
2564    if (this._isGrouped === isGrouped) return;
2565    this._isGrouped = isGrouped;
2566    this.setAttribute(DisclosureSelector.GROUP, !!value);
2567    this.update();
2568  }
2569
2570  get isGrouped () {
2571    return this._isGrouped;
2572  }
2573
2574  get canUngroup () {
2575    return false;
2576  }
2577
2578  mutate (attributesNames) {
2579    if (attributesNames.includes(DisclosureSelector.GROUP)) {
2580      this.isGrouped = this.getAttribute(DisclosureSelector.GROUP) !== 'false';
2581    }
2582  }
2583
2584  apply () {}
2585
2586  dispose () {
2587    super.dispose();
2588    this.descend(DisclosureEmission.UNGROUP);
2589    this._members = null;
2590  }
2591}
2592
2593const DisclosureType = {
2594  EXPAND: {
2595    id: 'expanded',
2596    ariaState: true,

2597    ariaControls: true,
2598    canConceal: true,
2599    canDisable: true
2600  },
2601  SELECT: {
2602    id: 'selected',
2603    ariaState: true,
2604    ariaControls: true,
2605    canConceal: false,
2606    canDisable: true
2607  },
2608  OPENED: {
2609    id: 'opened',
2610    ariaState: false,
2611    ariaControls: true,
2612    canConceal: true,
2613    canDisable: false
2614  }
2615};
2616
2617class CollapseButton extends DisclosureButton {
2618  constructor () {
2619    super(DisclosureType.EXPAND);
2620  }
2621
2622  static get instanceClassName () {
2623    return 'CollapseButton';
2624  }
2625}
2626
2627const CollapseSelector = {
2628  COLLAPSE: ns.selector('collapse'),
2629  COLLAPSING: ns.selector('collapsing')
2630};
2631
2632/**
2633 * Tab coorespond au panel d'un élement Tabs (tab panel)
2634 * Tab étend disclosure qui ajoute/enleve le modifier --selected,
2635 * et ajoute/eleve l'attribut hidden, sur le panel
2636 */
2637class Collapse extends Disclosure {
2638  constructor () {
2639    super(DisclosureType.EXPAND, CollapseSelector.COLLAPSE, CollapseButton, 'CollapsesGroup');
2640  }
2641
2642  static get instanceClassName () {
2643    return 'Collapse';
2644  }
2645
2646  init () {
2647    super.init();
2648    this.listen('transitionend', this.endCollapsing.bind(this));
2649  }
2650
2651  endCollapsing (e) {
2652    if (!this._isCollpasing) return;
2653    if (this._timeout) clearTimeout(this._timeout);
2654    this._timeout = null;
2655    this._isCollpasing = false;
2656    this.removeClass(CollapseSelector.COLLAPSING);
2657    if (!this.isDisclosed) {
2658      if (this.isLegacy) this.style.maxHeight = '';
2659    }
2660  }
2661
2662  unbound () {
2663    if (this.isLegacy) this.style.maxHeight = 'none';
2664  }
2665
2666  disclose (withhold) {
2667    if (this.isDisclosed === true || !this.isEnabled) return false;
2668    this.unbound();
2669    this.collapsing(() => super.disclose(withhold));
2670  }
2671
2672  conceal (withhold, preventFocus) {
2673    if (this.isDisclosed === false) return false;
2674    this.collapsing(() => super.conceal(withhold, preventFocus));
2675  }
2676
2677  collapsing (request) {
2678    this._isCollpasing = true;
2679    if (this._timeout) clearTimeout(this._timeout);
2680    this.addClass(CollapseSelector.COLLAPSING);
2681    this.adjust();
2682    this.request(() => {
2683      request();
2684      this._timeout = setTimeout(this.endCollapsing.bind(this), 500);
2685    });
2686  }
2687
2688  adjust () {
2689    this.setProperty('--collapser', 'none');
2690    const height = this.node.offsetHeight;
2691    this.setProperty('--collapse', -height + 'px');
2692    this.setProperty('--collapser', '');
2693  }
2694
2695  reset () {
2696    if (!this.isPristine) this.isDisclosed = false;
2697  }
2698
2699  _electPrimaries (candidates) {
2700    const primary = this.element.parent.instances.map(instance => instance.collapsePrimary).filter(button => button !== undefined && candidates.indexOf(button) > -1);
2701    if (primary.length === 1) return primary;
2702    candidates = super._electPrimaries(candidates);
2703    if (candidates.length === 1) return candidates;
2704    const before = candidates.filter(candidate => candidate.dy >= 0);
2705    if (before.length > 0) candidates = before;
2706    if (candidates.length === 1) return candidates;
2707    const min = Math.min(...candidates.map(candidate => candidate.dy));
2708    const mins = candidates.filter(candidate => candidate.dy === min);
2709    if (mins.length > 0) candidates = mins;
2710    if (candidates.length === 1) return candidates;
2711    candidates.sort((a, b) => Math.abs(b.dx) - Math.abs(a.dx));
2712    return candidates;
2713  }
2714}
2715
2716class CollapsesGroup extends DisclosuresGroup {
2717  constructor () {
2718    super('Collapse');
2719  }
2720
2721  static get instanceClassName () {
2722    return 'CollapsesGroup';
2723  }
2724
2725  get canUngroup () {
2726    return true;
2727  }
2728}
2729
2730const EquisizedEmission = {
2731  CHANGE: ns('equisized')
2732};
2733
2734class Equisized extends Instance {
2735  static get instanceClassName () {
2736    return 'Equisized';
2737  }
2738
2739  init () {
2740    this.ascend(EquisizedEmission.CHANGE);
2741  }
2742
2743  measure () {
2744    if (this.isLegacy) this.style.width = 'auto';
2745    return this.getRect().width;
2746  }
2747
2748  adjust (width) {
2749    if (this.isLegacy) this.style.width = `${width}px`;
2750  }
2751
2752  dispose () {
2753    this.ascend(EquisizedEmission.CHANGE);
2754  }
2755}
2756
2757class EquisizedsGroup extends Instance {
2758  static get instanceClassName () {
2759    return 'EquisizedsGroup';
2760  }
2761
2762  init () {
2763    this.isResizing = true;
2764    this.isLoading = true;
2765    this.addAscent(EquisizedEmission.CHANGE, this.resize.bind(this));
2766  }
2767
2768  load () {
2769    this.resize();
2770  }
2771
2772  resize () {
2773    const equisizeds = this.element.getDescendantInstances('Equisized');
2774    if (!this.isLegacy) this.style.setProperty('--equisized-width', 'auto');
2775
2776    const width = Math.max(...equisizeds.map(equisized => equisized.measure()));
2777    if (this.isLegacy) equisizeds.forEach(equisized => equisized.adjust(width));
2778    else this.style.setProperty('--equisized-width', `${width}px`);
2779  }
2780}
2781
2782const ToggleEvent = {
2783  TOGGLE: ns.event('toggle')
2784};
2785
2786class Toggle extends Instance {
2787  static get instanceClassName () {
2788    return 'Toggle';
2789  }
2790
2791  init () {
2792    this.pressed = this.pressed === 'true';
2793    this.listenClick();
2794  }
2795
2796  handleClick () {
2797    this.toggle();
2798  }
2799
2800  toggle () {
2801    this.pressed = this.pressed !== 'true';
2802  }
2803
2804  get pressed () {
2805    return this.getAttribute('aria-pressed');
2806  }
2807
2808  set pressed (value) {
2809    this.setAttribute('aria-pressed', value ? 'true' : 'false');
2810    this.dispatch(ToggleEvent.TOGGLE, value);
2811  }
2812
2813  get proxy () {
2814    const scope = this;
2815    const proxy = Object.assign(super.proxy, {
2816      toggle: scope.toggle.bind(scope)
2817    });
2818
2819    const proxyAccessors = {
2820      get pressed () {
2821        return scope.pressed;
2822      },
2823      set pressed (value) {
2824        scope.pressed = value;
2825      }
2826    };
2827
2828    return completeAssign(proxy, proxyAccessors);
2829  }
2830}
2831
2832const RootSelector = {
2833  ROOT: ':root'
2834};
2835
2836const setAttributes = (el, attrs) => {
2837  Object.keys(attrs).forEach(key => el.setAttribute(key, attrs[key]));
2838};
2839
2840class InjectSvg extends Instance {
2841  static get instanceClassName () {
2842    return 'InjectSvg';
2843  }
2844
2845  init () {
2846    if (this.node) {
2847      this.img = this.node.querySelector('img');
2848    }
2849
2850    if (!this.isLegacy) {
2851      this.replace();
2852    }
2853  }
2854
2855  get proxy () {
2856    const scope = this;
2857    return Object.assign(super.proxy, {
2858      replace: scope.replace.bind(scope),
2859      restore: scope.restore.bind(scope)
2860    });
2861  }
2862
2863  fetch () {
2864    if (this.img) {
2865      this.imgID = this.img.getAttribute('id');
2866      this.imgClass = this.img.getAttribute('class');
2867      this.imgURL = this.img.getAttribute('src');
2868
2869      fetch(this.imgURL)
2870        .then(data => data.text())
2871        .then(response => {
2872          const parser = new DOMParser();
2873          const xmlDoc = parser.parseFromString(response, 'text/html');
2874          this.svg = xmlDoc.querySelector('svg');
2875
2876          if (this.svg) {
2877            this.replace();
2878          }
2879        });
2880    }
2881  }
2882
2883  replace () {
2884    if (!this.svg) {
2885      this.fetch();
2886      return;
2887    }
2888
2889    if (this.imgID && typeof this.imgID !== 'undefined') {
2890      this.svg.setAttribute('id', this.imgID);
2891    }
2892
2893    // gestion de la dépréciation
2894    let name = this.imgURL.match(/[ \w-]+\./)[0];
2895    if (name) {
2896      name = name.slice(0, -1);
2897
2898      if (['dark', 'light', 'system'].includes(name)) {
2899        this.svg.innerHTML = this.svg.innerHTML.replaceAll('id="artwork-', `id="${name}-artwork-`);
2900        this.svg.innerHTML = this.svg.innerHTML.replaceAll('"#artwork-', `"#${name}-artwork-`);
2901      }
2902    }
2903
2904    if (this.imgClass && typeof this.imgClass !== 'undefined') {
2905      this.svg.setAttribute('class', this.imgClass);
2906    }
2907
2908    if (this.svg.hasAttribute('xmlns:a')) {
2909      this.svg.removeAttribute('xmlns:a');
2910    }
2911
2912    this.node.setAttribute('data-fr-inject-svg', true);
2913    const svgAttributes = {
2914      'aria-hidden': true,
2915      focusable: false
2916    };
2917    setAttributes(this.svg, svgAttributes);
2918    this.node.replaceChild(this.svg, this.img);
2919  }
2920
2921  restore () {
2922    if (this.img && this.svg) {
2923      this.node.setAttribute('data-fr-inject-svg', false);
2924      this.node.replaceChild(this.img, this.svg);
2925    }
2926  }
2927}
2928
2929const InjectSvgSelector = {
2930  INJECT_SVG: `[${ns.attr('inject-svg')}]`
2931};
2932
2933class Artwork extends Instance {
2934  static get instanceClassName () {
2935    return 'Artwork';
2936  }
2937
2938  init () {
2939    if (this.isLegacy) {
2940      this.replace();
2941    }
2942  }
2943
2944  get proxy () {
2945    const scope = this;
2946    return Object.assign(super.proxy, {
2947      replace: scope.replace.bind(scope)
2948    });
2949  }
2950
2951  fetch () {
2952    this.xlink = this.node.getAttribute('href');
2953    const splitUrl = this.xlink.split('#');
2954    this.svgUrl = splitUrl[0];
2955    this.svgName = splitUrl[1];
2956
2957    const xhr = new XMLHttpRequest();
2958    xhr.onload = () => {
2959      const parser = new DOMParser();
2960      const xmlDoc = parser.parseFromString(xhr.responseText, 'text/html');
2961      this.realSvgContent = xmlDoc.getElementById(this.svgName);
2962      if (this.realSvgContent) {
2963        if (this.realSvgContent.tagName === 'symbol') {
2964          this.use = xmlDoc.querySelector('use[href="#' + this.svgName + '"]');
2965          if (this.use) this.node.parentNode.insertBefore(this.use, this.node);
2966        } else {
2967          // deprecated svg structure
2968          this.realSvgContent.classList.add(this.node.classList);
2969        }
2970
2971        this.replace();
2972      }
2973    };
2974    xhr.open('GET', this.svgUrl);
2975    xhr.send();
2976  }
2977
2978  replace () {
2979    if (!this.realSvgContent) {
2980      this.fetch();
2981      return;
2982    }
2983
2984    this.node.parentNode.replaceChild(this.realSvgContent, this.node);
2985  }
2986}
2987
2988const ArtworkSelector = {
2989  ARTWORK_USE: `${ns.selector('artwork')} use`
2990};
2991
2992const AssessSelector = {
2993  ASSESS_FILE: `${ns.attr.selector('assess-file')}`,
2994  DETAIL: `${ns.attr.selector('assess-file')} [class$="__detail"], ${ns.attr.selector('assess-file')} [class*="__detail "]`
2995};
2996
2997const AssessEmission = {
2998  UPDATE: ns.emission('assess', 'update'),
2999  ADDED: ns.emission('assess', 'added')
3000};
3001
3002class AssessFile extends Instance {
3003  static get instanceClassName () {
3004    return 'AssessFile';
3005  }
3006
3007  init () {
3008    this.lang = this.getLang(this.node);
3009    this.href = this.getAttribute('href');
3010    this.hreflang = this.getAttribute('hreflang');
3011    this.file = {};
3012    this.gather();
3013    this.addAscent(AssessEmission.ADDED, this.update.bind(this));
3014    this.addDescent(AssessEmission.ADDED, this.update.bind(this));
3015  }
3016
3017  getFileLength () {
3018    if (this.href === undefined) {
3019      this.length = -1;
3020      return;
3021    }
3022
3023    fetch(this.href, { method: 'HEAD', mode: 'cors' }).then(response => {
3024      this.length = response.headers.get('content-length') || -1;
3025      if (this.length === -1) {
3026        inspector.warn('File size unknown: ' + this.href + '\nUnable to get HTTP header: "content-length"');
3027      }
3028      this.gather();
3029    });
3030  }
3031
3032  mutate (attributeNames) {
3033    if (attributeNames.indexOf('href') !== -1) {
3034      this.href = this.getAttribute('href');
3035      this.getFileLength();
3036    }
3037
3038    if (attributeNames.indexOf('hreflang') !== -1) {
3039      this.hreflang = this.getAttribute('hreflang');
3040      this.gather();
3041    }
3042  }
3043
3044  gather () {
3045    // TODO V2: implémenter async
3046    if (this.isLegacy) this.length = -1;
3047
3048    if (!this.length) {
3049      this.getFileLength();
3050      return;
3051    }
3052
3053    this.details = [];
3054
3055    if (this.href) {
3056      const extension = this.parseExtension(this.href);
3057      if (extension) this.details.push(extension.toUpperCase());
3058    }
3059
3060    if (this.length !== -1) {
3061      this.details.push(this.bytesToSize(this.length));
3062    }
3063
3064    if (this.hreflang) {
3065      this.details.push(this.getLangDisplayName(this.hreflang));
3066    }
3067
3068    this.update();
3069  }
3070
3071  update () {
3072    if (!this.details) return;
3073    this.descend(AssessEmission.UPDATE, this.details);
3074    this.ascend(AssessEmission.UPDATE, this.details);
3075  }
3076
3077  getLang (elem) {
3078    // todo: ajouter un listener global de changement de langue
3079    if (elem.lang) return elem.lang;
3080    if (document.documentElement === elem) return window.navigator.language;
3081    return this.getLang(elem.parentElement);
3082  }
3083
3084  parseExtension (url) {
3085    const regexExtension = /\.(\w{1,9})(?:$|[?#])/;
3086    return url.match(regexExtension)[0].replace('.', '');
3087  }
3088
3089  getLangDisplayName (locale) {
3090    if (this.isLegacy) return locale;
3091    const displayNames = new Intl.DisplayNames([this.lang], { type: 'language' });
3092    const name = displayNames.of(locale);
3093    return name.charAt(0).toUpperCase() + name.slice(1);
3094  }
3095
3096  bytesToSize (bytes) {
3097    if (bytes === -1) return null;
3098
3099    let sizeUnits = ['octets', 'ko', 'Mo', 'Go', 'To'];
3100    if (this.getAttribute(ns.attr('assess-file')) === 'bytes') {
3101      sizeUnits = ['bytes', 'KB', 'MB', 'GB', 'TB'];
3102    }
3103
3104    const i = parseInt(Math.floor(Math.log(bytes) / Math.log(1000)), 10);
3105    if (i === 0) return `${bytes} ${sizeUnits[i]}`;
3106
3107    const size = bytes / (1000 ** i);
3108    const roundedSize = Math.round((size + Number.EPSILON) * 100) / 100; // arrondi a 2 décimal
3109    const stringSize = String(roundedSize).replace('.', ',');
3110
3111    return `${stringSize} ${sizeUnits[i]}`;
3112  }
3113}
3114
3115class AssessDetail extends Instance {
3116  static get instanceClassName () {
3117    return 'AssessDetail';
3118  }
3119
3120  init () {
3121    this.addDescent(AssessEmission.UPDATE, this.update.bind(this));
3122    this.ascend(AssessEmission.ADDED);
3123  }
3124
3125  update (details) {
3126    this.node.innerHTML = details.join(' - ');
3127  }
3128}
3129
3130const ratiosImg = ['32x9', '16x9', '3x2', '4x3', '1x1', '3x4', '2x3'];
3131const ratiosVid = ['16x9', '4x3', '1x1'];
3132
3133const ratioSelector = (name, modifiers) => {
3134  return modifiers.map(modifier => ns.selector(`${name}--${modifier}`)).join(',');
3135};
3136
3137const deprecatedRatioSelector = `${ns.selector('responsive-img')}, ${ratioSelector('responsive-img', ratiosImg)}, ${ns.selector('responsive-vid')}