@studiometa/ui 1.0.0-alpha.1 → 1.0.0-alpha.3

package/molecules/Menu/Menu.cjs

@@ -1,177 +0,0 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// packages/ui/molecules/Menu/Menu.ts
-var Menu_exports = {};
-__export(Menu_exports, {
-  Menu: () => Menu
-});
-module.exports = __toCommonJS(Menu_exports);
-var import_js_toolkit = require("@studiometa/js-toolkit");
-var import_utils = require("@studiometa/js-toolkit/utils");
-var import_MenuBtn = require("./MenuBtn.cjs");
-var import_MenuList = require("./MenuList.cjs");
-var Menu = class _Menu extends import_js_toolkit.Base {
-  /**
-   * Config.
-   */
-  static config = {
-    name: "Menu",
-    components: {
-      MenuBtn: import_MenuBtn.MenuBtn,
-      MenuList: import_MenuList.MenuList,
-      Menu: _Menu
-    },
-    options: {
-      mode: {
-        type: String,
-        default: "click"
-        // or 'hover'
-      }
-    }
-  };
-  /**
-   * Get the first `MenuList` instance.
-   */
-  get menuList() {
-    return (0, import_js_toolkit.getDirectChildren)(this, "Menu", "MenuList")[0];
-  }
-  /**
-   * Get the first `MenuBtn` instance.
-   */
-  get menuBtn() {
-    return (0, import_js_toolkit.getDirectChildren)(this, "Menu", "MenuBtn")[0];
-  }
-  /**
-   * Test which mode to use.
-   */
-  get shouldReactOnClick() {
-    return this.$options.mode === "click";
-  }
-  /**
-   * Wether the button or the items are hovered.
-   */
-  get isHover() {
-    return this.menuBtn.isHover || this.menuList.isHover;
-  }
-  /**
-   * Set attributes on mounted, destroy the component if it is missing required
-   * child components.
-   */
-  mounted() {
-    if (!this.menuBtn || !this.menuList) {
-      this.$destroy();
-      return;
-    }
-    this.menuBtn.$el.setAttribute("aria-controls", this.$id);
-    this.menuList.$el.setAttribute("id", this.$id);
-    this.menuList.close();
-  }
-  /**
-   * Keyboard management.
-   */
-  keyed({ ENTER, ESC, isUp }) {
-    if (!isUp) {
-      return;
-    }
-    if (ESC) {
-      this.close();
-      return;
-    }
-    if (!this.shouldReactOnClick) {
-      const hasFocusElementWithin = document.activeElement === this.menuBtn.$el;
-      if (ENTER && hasFocusElementWithin) {
-        this.toggle();
-      }
-    }
-  }
-  /**
-   * Toggle menu items on button click.
-   */
-  onMenuBtnClick(index, event) {
-    if ((0, import_js_toolkit.isDirectChild)(this, "Menu", "MenuBtn", this.$children.MenuBtn[index]) && this.shouldReactOnClick) {
-      event.preventDefault();
-      this.toggle();
-    }
-  }
-  /**
-   * Open menu items on button mouse enter.
-   */
-  onMenuBtnMouseenter(index) {
-    if (this.$children.MenuBtn[index] === this.menuBtn && !this.shouldReactOnClick) {
-      this.open();
-    }
-  }
-  /**
-   * Close menu items on button mouse leave.
-   */
-  onMenuBtnMouseleave() {
-    if (this.shouldReactOnClick) {
-      return;
-    }
-    (0, import_utils.nextTick)(() => {
-      if (!this.isHover) {
-        this.close();
-      }
-    });
-  }
-  /**
-   * Close menu items on button mouse leave.
-   */
-  onMenuListMouseleave() {
-    if (this.shouldReactOnClick) {
-      return;
-    }
-    (0, import_utils.nextTick)(() => {
-      if (!this.isHover) {
-        this.close();
-      }
-    });
-  }
-  /**
-   * Close other non-parent menu items on menu items open.
-   */
-  onMenuListItemsOpen(index) {
-    const targetMenu = this.$children.MenuList[index];
-    this.$children.MenuList.forEach((menuItem) => {
-      if (!menuItem.$el.contains(targetMenu.$el)) {
-        menuItem.close();
-      }
-    });
-  }
-  /**
-   * Close the menu.
-   */
-  close() {
-    this.menuList.close();
-  }
-  /**
-   * Open the menu.
-   */
-  open() {
-    this.menuList.open();
-  }
-  /**
-   * Toggle the menu.
-   */
-  toggle() {
-    this.menuList.toggle();
-  }
-};
-if (module.exports.default) module.exports = module.exports.default;
-//# sourceMappingURL=Menu.cjs.map

package/molecules/Menu/Menu.cjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../packages/ui/molecules/Menu/Menu.ts"],
-  "sourcesContent": ["import { Base, isDirectChild, getDirectChildren } from '@studiometa/js-toolkit';\nimport type { BaseConfig, BaseProps, KeyServiceProps } from '@studiometa/js-toolkit';\nimport { nextTick } from '@studiometa/js-toolkit/utils';\nimport { MenuBtn } from './MenuBtn.js';\nimport { MenuList } from './MenuList.js';\n\nexport interface MenuProps extends BaseProps {\n  $children: {\n    // eslint-disable-next-line no-use-before-define\n    Menu: Menu[];\n    MenutBtn: MenuBtn[];\n    MenuList: MenuList[];\n  };\n  $options: {\n    mode: 'click' | 'hover';\n  };\n}\n\n/**\n * Menu class.\n */\nexport class Menu<T extends BaseProps = BaseProps> extends Base<T & MenuProps> {\n  /**\n   * Config.\n   */\n  static config: BaseConfig = {\n    name: 'Menu',\n    components: {\n      MenuBtn,\n      MenuList,\n      Menu,\n    },\n    options: {\n      mode: {\n        type: String,\n        default: 'click', // or 'hover'\n      },\n    },\n  };\n\n  /**\n   * Get the first `MenuList` instance.\n   */\n  get menuList(): MenuList {\n    return getDirectChildren<MenuList>(this, 'Menu', 'MenuList')[0];\n  }\n\n  /**\n   * Get the first `MenuBtn` instance.\n   */\n  get menuBtn(): MenuBtn {\n    return getDirectChildren<MenuBtn>(this, 'Menu', 'MenuBtn')[0];\n  }\n\n  /**\n   * Test which mode to use.\n   */\n  get shouldReactOnClick(): boolean {\n    return this.$options.mode === 'click';\n  }\n\n  /**\n   * Wether the button or the items are hovered.\n   */\n  get isHover(): boolean {\n    return this.menuBtn.isHover || this.menuList.isHover;\n  }\n\n  /**\n   * Set attributes on mounted, destroy the component if it is missing required\n   * child components.\n   */\n  mounted() {\n    if (!this.menuBtn || !this.menuList) {\n      this.$destroy();\n      return;\n    }\n\n    this.menuBtn.$el.setAttribute('aria-controls', this.$id);\n    this.menuList.$el.setAttribute('id', this.$id);\n    this.menuList.close();\n  }\n\n  /**\n   * Keyboard management.\n   */\n  keyed({ ENTER, ESC, isUp }: KeyServiceProps) {\n    if (!isUp) {\n      return;\n    }\n\n    if (ESC) {\n      this.close();\n      return;\n    }\n\n    if (!this.shouldReactOnClick) {\n      const hasFocusElementWithin = document.activeElement === this.menuBtn.$el;\n\n      if (ENTER && hasFocusElementWithin) {\n        this.toggle();\n      }\n    }\n  }\n\n  /**\n   * Toggle menu items on button click.\n   */\n  onMenuBtnClick(index: number, event: MouseEvent) {\n    if (\n      isDirectChild(this, 'Menu', 'MenuBtn', this.$children.MenuBtn[index]) &&\n      this.shouldReactOnClick\n    ) {\n      event.preventDefault();\n      this.toggle();\n    }\n  }\n\n  /**\n   * Open menu items on button mouse enter.\n   */\n  onMenuBtnMouseenter(index: number) {\n    if (this.$children.MenuBtn[index] === this.menuBtn && !this.shouldReactOnClick) {\n      this.open();\n    }\n  }\n\n  /**\n   * Close menu items on button mouse leave.\n   */\n  onMenuBtnMouseleave() {\n    if (this.shouldReactOnClick) {\n      return;\n    }\n\n    nextTick(() => {\n      if (!this.isHover) {\n        this.close();\n      }\n    });\n  }\n\n  /**\n   * Close menu items on button mouse leave.\n   */\n  onMenuListMouseleave() {\n    if (this.shouldReactOnClick) {\n      return;\n    }\n\n    nextTick(() => {\n      if (!this.isHover) {\n        this.close();\n      }\n    });\n  }\n\n  /**\n   * Close other non-parent menu items on menu items open.\n   */\n  onMenuListItemsOpen(index: number) {\n    const targetMenu = this.$children.MenuList[index];\n    this.$children.MenuList.forEach((menuItem) => {\n      if (!menuItem.$el.contains(targetMenu.$el)) {\n        menuItem.close();\n      }\n    });\n  }\n\n  /**\n   * Close the menu.\n   */\n  close() {\n    this.menuList.close();\n  }\n\n  /**\n   * Open the menu.\n   */\n  open() {\n    this.menuList.open();\n  }\n\n  /**\n   * Toggle the menu.\n   */\n  toggle() {\n    this.menuList.toggle();\n  }\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAAuD;AAEvD,mBAAyB;AACzB,qBAAwB;AACxB,sBAAyB;AAiBlB,IAAM,OAAN,MAAM,cAA8C,uBAAoB;AAAA;AAAA;AAAA;AAAA,EAI7E,OAAO,SAAqB;AAAA,IAC1B,MAAM;AAAA,IACN,YAAY;AAAA,MACV;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,SAAS;AAAA,MACP,MAAM;AAAA,QACJ,MAAM;AAAA,QACN,SAAS;AAAA;AAAA,MACX;AAAA,IACF;AAAA,EACF;AAAA;AAAA;AAAA;AAAA,EAKA,IAAI,WAAqB;AACvB,eAAO,qCAA4B,MAAM,QAAQ,UAAU,EAAE,CAAC;AAAA,EAChE;AAAA;AAAA;AAAA;AAAA,EAKA,IAAI,UAAmB;AACrB,eAAO,qCAA2B,MAAM,QAAQ,SAAS,EAAE,CAAC;AAAA,EAC9D;AAAA;AAAA;AAAA;AAAA,EAKA,IAAI,qBAA8B;AAChC,WAAO,KAAK,SAAS,SAAS;AAAA,EAChC;AAAA;AAAA;AAAA;AAAA,EAKA,IAAI,UAAmB;AACrB,WAAO,KAAK,QAAQ,WAAW,KAAK,SAAS;AAAA,EAC/C;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,UAAU;AACR,QAAI,CAAC,KAAK,WAAW,CAAC,KAAK,UAAU;AACnC,WAAK,SAAS;AACd;AAAA,IACF;AAEA,SAAK,QAAQ,IAAI,aAAa,iBAAiB,KAAK,GAAG;AACvD,SAAK,SAAS,IAAI,aAAa,MAAM,KAAK,GAAG;AAC7C,SAAK,SAAS,MAAM;AAAA,EACtB;AAAA;AAAA;AAAA;AAAA,EAKA,MAAM,EAAE,OAAO,KAAK,KAAK,GAAoB;AAC3C,QAAI,CAAC,MAAM;AACT;AAAA,IACF;AAEA,QAAI,KAAK;AACP,WAAK,MAAM;AACX;AAAA,IACF;AAEA,QAAI,CAAC,KAAK,oBAAoB;AAC5B,YAAM,wBAAwB,SAAS,kBAAkB,KAAK,QAAQ;AAEtE,UAAI,SAAS,uBAAuB;AAClC,aAAK,OAAO;AAAA,MACd;AAAA,IACF;AAAA,EACF;AAAA;AAAA;AAAA;AAAA,EAKA,eAAe,OAAe,OAAmB;AAC/C,YACE,iCAAc,MAAM,QAAQ,WAAW,KAAK,UAAU,QAAQ,KAAK,CAAC,KACpE,KAAK,oBACL;AACA,YAAM,eAAe;AACrB,WAAK,OAAO;AAAA,IACd;AAAA,EACF;AAAA;AAAA;AAAA;AAAA,EAKA,oBAAoB,OAAe;AACjC,QAAI,KAAK,UAAU,QAAQ,KAAK,MAAM,KAAK,WAAW,CAAC,KAAK,oBAAoB;AAC9E,WAAK,KAAK;AAAA,IACZ;AAAA,EACF;AAAA;AAAA;AAAA;AAAA,EAKA,sBAAsB;AACpB,QAAI,KAAK,oBAAoB;AAC3B;AAAA,IACF;AAEA,+BAAS,MAAM;AACb,UAAI,CAAC,KAAK,SAAS;AACjB,aAAK,MAAM;AAAA,MACb;AAAA,IACF,CAAC;AAAA,EACH;AAAA;AAAA;AAAA;AAAA,EAKA,uBAAuB;AACrB,QAAI,KAAK,oBAAoB;AAC3B;AAAA,IACF;AAEA,+BAAS,MAAM;AACb,UAAI,CAAC,KAAK,SAAS;AACjB,aAAK,MAAM;AAAA,MACb;AAAA,IACF,CAAC;AAAA,EACH;AAAA;AAAA;AAAA;AAAA,EAKA,oBAAoB,OAAe;AACjC,UAAM,aAAa,KAAK,UAAU,SAAS,KAAK;AAChD,SAAK,UAAU,SAAS,QAAQ,CAAC,aAAa;AAC5C,UAAI,CAAC,SAAS,IAAI,SAAS,WAAW,GAAG,GAAG;AAC1C,iBAAS,MAAM;AAAA,MACjB;AAAA,IACF,CAAC;AAAA,EACH;AAAA;AAAA;AAAA;AAAA,EAKA,QAAQ;AACN,SAAK,SAAS,MAAM;AAAA,EACtB;AAAA;AAAA;AAAA;AAAA,EAKA,OAAO;AACL,SAAK,SAAS,KAAK;AAAA,EACrB;AAAA;AAAA;AAAA;AAAA,EAKA,SAAS;AACP,SAAK,SAAS,OAAO;AAAA,EACvB;AACF;",
-  "names": []
-}

package/molecules/Menu/MenuBtn.cjs

@@ -1,66 +0,0 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// packages/ui/molecules/Menu/MenuBtn.ts
-var MenuBtn_exports = {};
-__export(MenuBtn_exports, {
-  MenuBtn: () => MenuBtn
-});
-module.exports = __toCommonJS(MenuBtn_exports);
-var import_js_toolkit = require("@studiometa/js-toolkit");
-var MenuBtn = class extends import_js_toolkit.Base {
-  /**
-   * Config.
-   */
-  static config = {
-    name: "MenuBtn"
-  };
-  /**
-   * Wether the button is hovered or not.
-   * @type {boolean}
-   */
-  isHover = false;
-  /**
-   * Dispatch the click event.
-   * @param   {MouseEvent} event
-   * @returns {void}
-   */
-  onClick(event) {
-    event.stopPropagation();
-  }
-  /**
-   * Dispatch the mouseenter event.
-   * @param   {MouseEvent} event
-   * @returns {void}
-   */
-  onMouseenter(event) {
-    this.isHover = true;
-    event.stopPropagation();
-  }
-  /**
-   * Dispatch the mouseleave event.
-   * @param   {MouseEvent} event
-   * @returns {void}
-   */
-  onMouseleave(event) {
-    this.isHover = false;
-    event.stopPropagation();
-  }
-};
-if (module.exports.default) module.exports = module.exports.default;
-//# sourceMappingURL=MenuBtn.cjs.map

package/molecules/Menu/MenuBtn.cjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../packages/ui/molecules/Menu/MenuBtn.ts"],
-  "sourcesContent": ["import { Base } from '@studiometa/js-toolkit';\nimport type { BaseConfig, BaseProps } from '@studiometa/js-toolkit';\n\n/**\n * MenuBtn class.\n */\nexport class MenuBtn<T extends BaseProps = BaseProps> extends Base<T> {\n  /**\n   * Config.\n   */\n  static config: BaseConfig = {\n    name: 'MenuBtn',\n  };\n\n  /**\n   * Wether the button is hovered or not.\n   * @type {boolean}\n   */\n  isHover = false;\n\n  /**\n   * Dispatch the click event.\n   * @param   {MouseEvent} event\n   * @returns {void}\n   */\n  onClick(event) {\n    event.stopPropagation();\n  }\n\n  /**\n   * Dispatch the mouseenter event.\n   * @param   {MouseEvent} event\n   * @returns {void}\n   */\n  onMouseenter(event) {\n    this.isHover = true;\n    event.stopPropagation();\n  }\n\n  /**\n   * Dispatch the mouseleave event.\n   * @param   {MouseEvent} event\n   * @returns {void}\n   */\n  onMouseleave(event) {\n    this.isHover = false;\n    event.stopPropagation();\n  }\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAAqB;AAMd,IAAM,UAAN,cAAuD,uBAAQ;AAAA;AAAA;AAAA;AAAA,EAIpE,OAAO,SAAqB;AAAA,IAC1B,MAAM;AAAA,EACR;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOV,QAAQ,OAAO;AACb,UAAM,gBAAgB;AAAA,EACxB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,aAAa,OAAO;AAClB,SAAK,UAAU;AACf,UAAM,gBAAgB;AAAA,EACxB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,aAAa,OAAO;AAClB,SAAK,UAAU;AACf,UAAM,gBAAgB;AAAA,EACxB;AACF;",
-  "names": []
-}

package/molecules/Menu/MenuList.cjs

@@ -1,165 +0,0 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// packages/ui/molecules/Menu/MenuList.ts
-var MenuList_exports = {};
-__export(MenuList_exports, {
-  MenuList: () => MenuList
-});
-module.exports = __toCommonJS(MenuList_exports);
-var import_primitives = require("../../primitives/index.cjs");
-var FOCUSABLE_ELEMENTS = [
-  "a[href]:not([inert])",
-  "area[href]:not([inert])",
-  "input:not([disabled]):not([inert])",
-  "select:not([disabled]):not([inert])",
-  "textarea:not([disabled]):not([inert])",
-  "button:not([disabled]):not([inert])",
-  "iframe:not([inert])",
-  "audio:not([inert])",
-  "video:not([inert])",
-  "[contenteditable]:not([inert])",
-  "[tabindex]:not([inert])"
-].join(",");
-var MenuList = class _MenuList extends import_primitives.Transition {
-  /**
-   * Config.
-   */
-  static config = {
-    ...import_primitives.Transition.config,
-    name: "MenuList",
-    emits: ["items-open", "items-close", "items-mouseleave"],
-    components: {
-      MenuList: _MenuList
-    }
-  };
-  /**
-   * Are the menu items visible?
-   */
-  isOpen = false;
-  /**
-   * Wether the component is hovered.
-   */
-  isHover = false;
-  /**
-   * Override `Transition` options.
-   */
-  // @ts-ignore
-  get $options() {
-    const options = super.$options;
-    options.leaveKeep = true;
-    options.enterKeep = true;
-    return options;
-  }
-  /**
-   * Update tab indexes on mount.
-   */
-  mounted() {
-    this.__updateTabIndexes("close");
-  }
-  /**
-   * Set hover state.
-   */
-  onMouseenter() {
-    this.isHover = true;
-  }
-  /**
-   * Unset hover state.
-   */
-  onMouseleave() {
-    this.isHover = false;
-  }
-  /**
-   * Display the menu items.
-   */
-  open() {
-    if (this.isOpen) {
-      return;
-    }
-    const clickOutsideHandler = (event) => {
-      if (!this.$el.contains(event.target)) {
-        document.removeEventListener("click", clickOutsideHandler);
-        this.close();
-      }
-    };
-    document.addEventListener("click", clickOutsideHandler);
-    this.__updateTabIndexes("open");
-    this.$el.setAttribute("aria-hidden", "false");
-    this.isOpen = true;
-    this.enter();
-    this.$emit("items-open");
-  }
-  /**
-   * Hide the menu items.
-   */
-  close() {
-    if (!this.isOpen) {
-      return;
-    }
-    this.$children.MenuList.forEach((menuItem) => {
-      menuItem.close();
-    });
-    if (document.activeElement instanceof HTMLElement && this.$el.contains(document.activeElement)) {
-      document.activeElement.blur();
-    }
-    this.$el.setAttribute("aria-hidden", "true");
-    this.__updateTabIndexes("close");
-    this.isOpen = false;
-    this.leave();
-    this.$emit("items-close");
-  }
-  /**
-   * Toggle the menu items.
-   */
-  toggle() {
-    if (this.isOpen) {
-      this.close();
-    } else {
-      this.open();
-    }
-  }
-  /**
-   * Update `tabindex` attribute of child focusable elements.
-   * @private
-   */
-  __updateTabIndexes(mode = "open") {
-    const focusableItems = Array.from(this.$el.querySelectorAll(FOCUSABLE_ELEMENTS)).filter(
-      (item) => this.__filterFocusableItems(item)
-    );
-    focusableItems.forEach((item) => {
-      if (mode === "close") {
-        item.setAttribute("tabindex", "-1");
-      } else {
-        item.removeAttribute("tabindex");
-      }
-    });
-  }
-  /**
-   * Filter out items which are inside a child `MenuList` instance.
-   * @private
-   */
-  __filterFocusableItems(item) {
-    let ancestor = item.parentElement;
-    while (ancestor && (!ancestor.__base__ || !ancestor.__base__.has(this.constructor))) {
-      ancestor = ancestor.parentElement;
-    }
-    return ancestor === null || ancestor === this.$el;
-  }
-};
-if (module.exports.default) module.exports = module.exports.default;
-//# sourceMappingURL=MenuList.cjs.map

package/molecules/Menu/MenuList.cjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../packages/ui/molecules/Menu/MenuList.ts"],
-  "sourcesContent": ["import type { BaseConfig, BaseProps } from '@studiometa/js-toolkit';\nimport { Transition } from '../../primitives/index.js';\n\nconst FOCUSABLE_ELEMENTS = [\n  'a[href]:not([inert])',\n  'area[href]:not([inert])',\n  'input:not([disabled]):not([inert])',\n  'select:not([disabled]):not([inert])',\n  'textarea:not([disabled]):not([inert])',\n  'button:not([disabled]):not([inert])',\n  'iframe:not([inert])',\n  'audio:not([inert])',\n  'video:not([inert])',\n  '[contenteditable]:not([inert])',\n  '[tabindex]:not([inert])',\n].join(',');\n\nexport interface MenuListProps extends BaseProps {\n  $children: {\n    // eslint-disable-next-line no-use-before-define\n    MenuList: MenuList[];\n  };\n}\n\n/**\n * MenuList class.\n */\nexport class MenuList<T extends BaseProps = BaseProps> extends Transition<T & MenuListProps> {\n  /**\n   * Config.\n   */\n  static config: BaseConfig = {\n    ...Transition.config,\n    name: 'MenuList',\n    emits: ['items-open', 'items-close', 'items-mouseleave'],\n    components: {\n      MenuList,\n    },\n  };\n\n  /**\n   * Are the menu items visible?\n   */\n  isOpen = false;\n\n  /**\n   * Wether the component is hovered.\n   */\n  isHover = false;\n\n  /**\n   * Override `Transition` options.\n   */\n  // @ts-ignore\n  get $options() {\n    const options = super.$options;\n\n    options.leaveKeep = true;\n    options.enterKeep = true;\n\n    return options;\n  }\n\n  /**\n   * Update tab indexes on mount.\n   */\n  mounted() {\n    this.__updateTabIndexes('close');\n  }\n\n  /**\n   * Set hover state.\n   */\n  onMouseenter() {\n    this.isHover = true;\n  }\n\n  /**\n   * Unset hover state.\n   */\n  onMouseleave() {\n    this.isHover = false;\n  }\n\n  /**\n   * Display the menu items.\n   */\n  open() {\n    if (this.isOpen) {\n      return;\n    }\n\n    // @todo Remove event listener when the close method is called.\n    const clickOutsideHandler = (event) => {\n      if (!this.$el.contains(event.target)) {\n        document.removeEventListener('click', clickOutsideHandler);\n        this.close();\n      }\n    };\n    document.addEventListener('click', clickOutsideHandler);\n\n    this.__updateTabIndexes('open');\n    this.$el.setAttribute('aria-hidden', 'false');\n    this.isOpen = true;\n    this.enter();\n    this.$emit('items-open');\n  }\n\n  /**\n   * Hide the menu items.\n   */\n  close() {\n    if (!this.isOpen) {\n      return;\n    }\n\n    // Close child menu items.\n    this.$children.MenuList.forEach((menuItem) => {\n      menuItem.close();\n    });\n\n    if (\n      document.activeElement instanceof HTMLElement &&\n      this.$el.contains(document.activeElement)\n    ) {\n      document.activeElement.blur();\n    }\n\n    this.$el.setAttribute('aria-hidden', 'true');\n    this.__updateTabIndexes('close');\n    this.isOpen = false;\n    this.leave();\n    this.$emit('items-close');\n  }\n\n  /**\n   * Toggle the menu items.\n   */\n  toggle() {\n    if (this.isOpen) {\n      this.close();\n    } else {\n      this.open();\n    }\n  }\n\n  /**\n   * Update `tabindex` attribute of child focusable elements.\n   * @private\n   */\n  __updateTabIndexes(mode: 'open' | 'close' = 'open') {\n    const focusableItems = Array.from(this.$el.querySelectorAll(FOCUSABLE_ELEMENTS)).filter(\n      (item) => this.__filterFocusableItems(item as HTMLElement),\n    );\n\n    focusableItems.forEach((item) => {\n      if (mode === 'close') {\n        item.setAttribute('tabindex', '-1');\n      } else {\n        item.removeAttribute('tabindex');\n      }\n    });\n  }\n\n  /**\n   * Filter out items which are inside a child `MenuList` instance.\n   * @private\n   */\n  __filterFocusableItems(item: HTMLElement): boolean {\n    let ancestor = item.parentElement;\n\n    // @ts-ignore\n    while (ancestor && (!ancestor.__base__ || !ancestor.__base__.has(this.constructor))) {\n      ancestor = ancestor.parentElement;\n    }\n\n    return ancestor === null || ancestor === this.$el;\n  }\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,wBAA2B;AAE3B,IAAM,qBAAqB;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,EAAE,KAAK,GAAG;AAYH,IAAM,WAAN,MAAM,kBAAkD,6BAA8B;AAAA;AAAA;AAAA;AAAA,EAI3F,OAAO,SAAqB;AAAA,IAC1B,GAAG,6BAAW;AAAA,IACd,MAAM;AAAA,IACN,OAAO,CAAC,cAAc,eAAe,kBAAkB;AAAA,IACvD,YAAY;AAAA,MACV;AAAA,IACF;AAAA,EACF;AAAA;AAAA;AAAA;AAAA,EAKA,SAAS;AAAA;AAAA;AAAA;AAAA,EAKT,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,EAMV,IAAI,WAAW;AACb,UAAM,UAAU,MAAM;AAEtB,YAAQ,YAAY;AACpB,YAAQ,YAAY;AAEpB,WAAO;AAAA,EACT;AAAA;AAAA;AAAA;AAAA,EAKA,UAAU;AACR,SAAK,mBAAmB,OAAO;AAAA,EACjC;AAAA;AAAA;AAAA;AAAA,EAKA,eAAe;AACb,SAAK,UAAU;AAAA,EACjB;AAAA;AAAA;AAAA;AAAA,EAKA,eAAe;AACb,SAAK,UAAU;AAAA,EACjB;AAAA;AAAA;AAAA;AAAA,EAKA,OAAO;AACL,QAAI,KAAK,QAAQ;AACf;AAAA,IACF;AAGA,UAAM,sBAAsB,CAAC,UAAU;AACrC,UAAI,CAAC,KAAK,IAAI,SAAS,MAAM,MAAM,GAAG;AACpC,iBAAS,oBAAoB,SAAS,mBAAmB;AACzD,aAAK,MAAM;AAAA,MACb;AAAA,IACF;AACA,aAAS,iBAAiB,SAAS,mBAAmB;AAEtD,SAAK,mBAAmB,MAAM;AAC9B,SAAK,IAAI,aAAa,eAAe,OAAO;AAC5C,SAAK,SAAS;AACd,SAAK,MAAM;AACX,SAAK,MAAM,YAAY;AAAA,EACzB;AAAA;AAAA;AAAA;AAAA,EAKA,QAAQ;AACN,QAAI,CAAC,KAAK,QAAQ;AAChB;AAAA,IACF;AAGA,SAAK,UAAU,SAAS,QAAQ,CAAC,aAAa;AAC5C,eAAS,MAAM;AAAA,IACjB,CAAC;AAED,QACE,SAAS,yBAAyB,eAClC,KAAK,IAAI,SAAS,SAAS,aAAa,GACxC;AACA,eAAS,cAAc,KAAK;AAAA,IAC9B;AAEA,SAAK,IAAI,aAAa,eAAe,MAAM;AAC3C,SAAK,mBAAmB,OAAO;AAC/B,SAAK,SAAS;AACd,SAAK,MAAM;AACX,SAAK,MAAM,aAAa;AAAA,EAC1B;AAAA;AAAA;AAAA;AAAA,EAKA,SAAS;AACP,QAAI,KAAK,QAAQ;AACf,WAAK,MAAM;AAAA,IACb,OAAO;AACL,WAAK,KAAK;AAAA,IACZ;AAAA,EACF;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,mBAAmB,OAAyB,QAAQ;AAClD,UAAM,iBAAiB,MAAM,KAAK,KAAK,IAAI,iBAAiB,kBAAkB,CAAC,EAAE;AAAA,MAC/E,CAAC,SAAS,KAAK,uBAAuB,IAAmB;AAAA,IAC3D;AAEA,mBAAe,QAAQ,CAAC,SAAS;AAC/B,UAAI,SAAS,SAAS;AACpB,aAAK,aAAa,YAAY,IAAI;AAAA,MACpC,OAAO;AACL,aAAK,gBAAgB,UAAU;AAAA,MACjC;AAAA,IACF,CAAC;AAAA,EACH;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,uBAAuB,MAA4B;AACjD,QAAI,WAAW,KAAK;AAGpB,WAAO,aAAa,CAAC,SAAS,YAAY,CAAC,SAAS,SAAS,IAAI,KAAK,WAAW,IAAI;AACnF,iBAAW,SAAS;AAAA,IACtB;AAEA,WAAO,aAAa,QAAQ,aAAa,KAAK;AAAA,EAChD;AACF;",
-  "names": []
-}

package/molecules/Menu/index.cjs

@@ -1,23 +0,0 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// packages/ui/molecules/Menu/index.ts
-var Menu_exports = {};
-module.exports = __toCommonJS(Menu_exports);
-__reExport(Menu_exports, require("./Menu.cjs"), module.exports);
-__reExport(Menu_exports, require("./MenuBtn.cjs"), module.exports);
-__reExport(Menu_exports, require("./MenuList.cjs"), module.exports);
-if (module.exports.default) module.exports = module.exports.default;
-//# sourceMappingURL=index.cjs.map

package/molecules/Menu/index.cjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../packages/ui/molecules/Menu/index.ts"],
-  "sourcesContent": ["export * from './Menu.js';\nexport * from './MenuBtn.js';\nexport * from './MenuList.js';\n"],
-  "mappings": ";;;;;;;;;;;;;;;;AAAA;AAAA;AAAA,yBAAc,uBAAd;AACA,yBAAc,0BADd;AAEA,yBAAc,2BAFd;",
-  "names": []
-}