@shoper/phoenix_design_system 0.22.2 → 0.22.3

package/build/cjs/packages/utilities/build/esm/json_utils.js

@@ -0,0 +1,25 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+class JsonUtils {
+    static toJson(value) {
+        try {
+            return JSON.stringify(value);
+        }
+        catch (error) {
+            console.error(error);
+        }
+    }
+    static fromJson(value) {
+        try {
+            return JSON.parse(value);
+        }
+        catch (error) {
+            console.error(error);
+        }
+    }
+}
+
+exports.JsonUtils = JsonUtils;
+//# sourceMappingURL=json_utils.js.map

package/build/{esm/packages/phoenix/src/components/tabs/tab_panel.js.map → cjs/packages/utilities/build/esm/json_utils.js.map}

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/utilities/build/esm/web_components_utils.js

@@ -0,0 +1,18 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+class WebComponentsUtils {
+    static isWebComponentDefined($element) {
+        if (!this.isWebComponent($element))
+            return false;
+        const customElementClass = window.customElements.get($element.tagName.toLowerCase());
+        return !!customElementClass && $element instanceof customElementClass;
+    }
+    static isWebComponent($element) {
+        return $element.tagName.includes('-');
+    }
+}
+
+exports.WebComponentsUtils = WebComponentsUtils;
+//# sourceMappingURL=web_components_utils.js.map

package/build/cjs/packages/{phoenix/src/components/tabs/tabs_constants.js.map → utilities/build/esm/web_components_utils.js.map}

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/{external → packages/phoenix/external}/classnames/index.js

@@ -1,7 +1,7 @@
-import { createCommonjsModule } from '../../_virtual/_commonjsHelpers.js';
+import { createCommonjsModule } from '../../../../_virtual/_commonjsHelpers.js';
 
 /*!
-  Copyright (c) 2017 Jed Watson.
+  Copyright (c) 2018 Jed Watson.
   Licensed under the MIT License (MIT), see
   http://jedwatson.github.io/classnames
 */
@@ -13,7 +13,7 @@ var classnames = createCommonjsModule(function (module) {
 
 	var hasOwn = {}.hasOwnProperty;
 
-	function classNames () {
+	function classNames() {
 		var classes = [];
 
 		for (var i = 0; i < arguments.length; i++) {
@@ -24,16 +24,22 @@ var classnames = createCommonjsModule(function (module) {
 
 			if (argType === 'string' || argType === 'number') {
 				classes.push(arg);
-			} else if (Array.isArray(arg) && arg.length) {
-				var inner = classNames.apply(null, arg);
-				if (inner) {
-					classes.push(inner);
+			} else if (Array.isArray(arg)) {
+				if (arg.length) {
+					var inner = classNames.apply(null, arg);
+					if (inner) {
+						classes.push(inner);
+					}
 				}
 			} else if (argType === 'object') {
-				for (var key in arg) {
-					if (hasOwn.call(arg, key) && arg[key]) {
-						classes.push(key);
+				if (arg.toString === Object.prototype.toString) {
+					for (var key in arg) {
+						if (hasOwn.call(arg, key) && arg[key]) {
+							classes.push(key);
+						}
 					}
+				} else {
+					classes.push(arg.toString());
 				}
 			}
 		}

package/build/esm/{external → packages/phoenix/external}/classnames/index.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/phoenix/src/components/accordion/accordion_content.js

@@ -11,6 +11,13 @@ let HAccordionContent = class HAccordionContent extends PhoenixLightLitElement {
     constructor() {
         super();
         this.transitionName = 'accordion-toggle';
+        this._setStylingOptions = () => {
+            this.style.setProperty('display', 'block', 'important');
+            this.style.height = 'auto';
+            this._originalHeight = `${this.getBoundingClientRect().height}px`;
+            this.style.display = '';
+            this.style.height = this._originalHeight;
+        };
         this._expand = () => {
             this._setHeight(this._originalHeight);
         };
@@ -25,12 +32,7 @@ let HAccordionContent = class HAccordionContent extends PhoenixLightLitElement {
         this._transitionController = new TransitionController(this, this.transitionName);
         this._setStylingOptions();
         this._subscribeObserver();
-    }
-    _setStylingOptions() {
-        this.style.setProperty('display', 'block', 'important');
-        this._originalHeight = `${this.getBoundingClientRect().height}px`;
-        this.style.display = '';
-        this.style.height = this._originalHeight;
+        window.addEventListener('resize', this._setStylingOptions);
     }
     async _subscribeObserver() {
         this._accordionGroupProps = await this._contextConsumer.consumeAsync(ACCORDION_CONTEXTS.accordionGroupProps);
@@ -50,6 +52,7 @@ let HAccordionContent = class HAccordionContent extends PhoenixLightLitElement {
     disconnectedCallback() {
         super.disconnectedCallback();
         this._accordionGroupProps.unsubscribe(this._accordionGroupPropsObserver);
+        window.removeEventListener('resize', this._setStylingOptions);
     }
 };
 __decorate([

package/build/esm/packages/phoenix/src/components/accordion/accordion_content.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/phoenix/src/components/dropdown/dropdown.d.ts

@@ -3,6 +3,7 @@ import { TemplateResult } from 'lit-html';
 import { HDropdownContent } from './dropdown_content';
 import { HDropdownToggler } from './dropdown_toggler';
 import { PhoenixLightLitElement } from "../../core/phoenix_light_lit_element/phoenix_light_lit_element";
+import { PropertyValues } from 'lit';
 export declare class HDropdown extends PhoenixLightLitElement implements IDropdown {
     opened: boolean;
     direction: "bottom-center";
@@ -18,9 +19,13 @@ export declare class HDropdown extends PhoenixLightLitElement implements IDropdo
     private _dropdownContentChildrenHeight;
     private _hasScrollableClassInitially;
     private _backdropController;
+    _firstFocusableElement: HTMLElement | undefined;
     _lastFocusableElement: HTMLElement | undefined;
+    private _focusSentinelStart;
+    private _focusSentinelEnd;
     private _rootDropdown?;
     connectedCallback(): void;
+    firstUpdated(props: PropertyValues): void;
     private static _appendDropdownPortal;
     private _findRootDropdown;
     private _setupListeners;

package/build/esm/packages/phoenix/src/components/dropdown/dropdown.js

@@ -1,12 +1,13 @@
 import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.js';
+import 'lit';
 import { state } from 'lit/decorators';
-import { UiDomUtils } from '@dreamcommerce/utilities';
 import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
 import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
 import { PORTAL_TARGET_COMPONENT_NAME, PORTAL_TARGET_NAME_PROP } from '../portal/portal_constants.js';
 import { html } from 'lit-html';
 import { BackdropController } from '../backdrop/controller/backdrop_controller.js';
 import { property } from '@lit/reactive-element/decorators.js';
+import { createRef, ref } from 'lit-html/directives/ref.js';
 import { BREAKPOINTS, SCROLLABLE_CLASS_NAME } from '../../global_constants.js';
 import { DEFAULT_DROPDOWN_PORTAL_NAME, DROPDOWN_CONTENT_VISIBLE_CLASS, DROPDOWN_CONTENT_SHOW, DROPDOWN_EVENTS, DROPDOWN_CONTAINER_NAME, DROPDOWN_CONTENT_HIDE, DROPDOWN_CONTENT_NAME, DROPDOWN_TOGGLER_NAME } from './dropdown_constants.js';
 import { DIRECTIONS, RELATIVE_POSITION_CONTROLLER_EVENTS, DEFAULT_THROTTLE_WAIT_TIME } from '../../controllers/relative_position_controller/relative_position_controller_constants.js';
@@ -25,7 +26,10 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
         this.transition = 'direction';
         this.portalTarget = DEFAULT_DROPDOWN_PORTAL_NAME;
         this._backdropController = new BackdropController();
+        this._firstFocusableElement = undefined;
         this._lastFocusableElement = undefined;
+        this._focusSentinelStart = createRef();
+        this._focusSentinelEnd = createRef();
         this._handleClickOutside = async (target) => {
             var _a, _b;
             if (!this.opened)
@@ -51,13 +55,11 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
                     }, 0);
                     const transitionDuration = parseFloat(getComputedStyle(this.$dropdownContent || this).transitionDuration) * 1000;
                     setTimeout(() => {
-                        var _a, _b, _c;
+                        var _a, _b;
                         this._dispatchShowDropdownEvent();
                         (_a = this.$dropdownContent) === null || _a === void 0 ? void 0 : _a.classList.remove(`${DROPDOWN_CONTENT_SHOW}-${this.transition}-start`, `${DROPDOWN_CONTENT_SHOW}-${this.transition}-end`);
                         this._toggleScroll();
-                        if (!this._lastFocusableElement)
-                            this._lastFocusableElement = (_b = this.$dropdownContent) === null || _b === void 0 ? void 0 : _b.lastElementChild;
-                        this._focusOnNextSibling((_c = this.$dropdownContent) === null || _c === void 0 ? void 0 : _c.firstElementChild);
+                        (_b = this._firstFocusableElement) === null || _b === void 0 ? void 0 : _b.focus();
                         resolve();
                     }, transitionDuration);
                 });
@@ -131,16 +133,18 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
         this._handleFocusWithinDropdown = async (ev) => {
             var _a;
             const hasTabBeenPressed = ev.key.toLowerCase() === 'tab';
-            if (hasTabBeenPressed && document.activeElement === this._lastFocusableElement) {
-                ev.preventDefault();
-                this._focusOnNextSibling(this.nextElementSibling || this);
-                await this._hideDropdownsSequentially();
-            }
-            const $firstFocusableElement = this.$dropdownContent && UiDomUtils.getFocusableElement(this.$dropdownContent);
-            if (hasTabBeenPressed && ev.shiftKey && document.activeElement === $firstFocusableElement) {
-                ev.preventDefault();
-                (_a = this.$dropdownToggler) === null || _a === void 0 ? void 0 : _a.focus();
-                await this._hideDropdownsSequentially();
+            if (hasTabBeenPressed) {
+                if (ev.shiftKey) {
+                    if (document.activeElement === this._firstFocusableElement) {
+                        (_a = this._lastFocusableElement) === null || _a === void 0 ? void 0 : _a.focus();
+                        ev.preventDefault();
+                    }
+                }
+                else if (document.activeElement === this._lastFocusableElement) {
+                    ev.preventDefault();
+                    this._focusOnNextSibling(this);
+                    await this._hideDropdownsSequentially();
+                }
             }
         };
         this._hoverToggle = async (ev) => {
@@ -199,6 +203,11 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
         this._setupListeners();
         this._setupInitialDropdownProperties();
     }
+    firstUpdated(props) {
+        super.firstUpdated(props);
+        this._firstFocusableElement = this._focusSentinelStart.value;
+        this._lastFocusableElement = this._focusSentinelEnd.value;
+    }
     static _appendDropdownPortal() {
         const $dropdownPortalTarget = document.querySelector(`[name="${DEFAULT_DROPDOWN_PORTAL_NAME}"]`);
         if (!$dropdownPortalTarget) {
@@ -245,12 +254,7 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
         el.focus();
         if (el === document.activeElement)
             return;
-        if (el.firstElementChild) {
-            this._focusOnNextSibling(el.firstElementChild);
-            return;
-        }
-        if (el.nextElementSibling)
-            this._focusOnNextSibling(el.nextElementSibling);
+        this._focusOnNextSibling(el.nextElementSibling);
     }
     _isHoveredWithinDropdown(element) {
         var _a;
@@ -258,8 +262,7 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
             return true;
         if (element === this.$dropdownContent)
             return true;
-        const isDescendantOfDropdown = element.closest(`${DROPDOWN_CONTAINER_NAME}[name="${this.name}"]`) !== null ||
-            element.closest(`${DROPDOWN_CONTENT_NAME}[name="${this.name}"]`) !== null;
+        const isDescendantOfDropdown = element.closest(`${DROPDOWN_CONTAINER_NAME}[name="${this.name}"]`) !== null;
         if (isDescendantOfDropdown)
             return true;
         const $closestDropdownContent = element.closest(DROPDOWN_CONTENT_NAME);
@@ -296,7 +299,9 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
         return html `
             ${this.getSlot('toggler')}
             <h-portal ?disabled="${!this.opened}" @portal.open="${this._positionDropdownContent}" to="${this.portalTarget}" hidden>
+                <div tabindex="0" ${ref(this._focusSentinelStart)}></div>
                 ${this.getSlot('content')}
+                <div tabindex="0" ${ref(this._focusSentinelEnd)}></div>
             </h-portal>
         `;
     }
@@ -325,6 +330,10 @@ __decorate([
     property({ type: String }),
     __metadata("design:type", Object)
 ], HDropdown.prototype, "portalTarget", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], HDropdown.prototype, "_firstFocusableElement", void 0);
 __decorate([
     state(),
     __metadata("design:type", Object)

package/build/esm/packages/phoenix/src/components/dropdown/dropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,uBAAuB,4CAAgD;AACvE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,uBAAuB,4CAAgD;AACvE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/phoenix/src/components/dropdown/dropdown_content.js

@@ -18,10 +18,7 @@ let HDropdownContent = class HDropdownContent extends PhoenixLightLitElement {
     }
     render() {
         super.render();
-        return html `
-            <div role="dialog">${this.getSlot('content')}</div>
-            <div tabindex="0" aria-hidden="true"></div>
-        `;
+        return html ` <div role="dialog">${this.getSlot('content')}</div> `;
     }
 };
 __decorate([

package/build/esm/packages/phoenix/src/components/dropdown/dropdown_content.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/phoenix/src/components/dropdown/dropdown_toggler.js

@@ -14,7 +14,7 @@ let HDropdownToggler = class HDropdownToggler extends PhoenixLightLitElement {
         this._dispatchToggleDropdownEvent = (ev) => {
             ev.preventDefault();
             ev.stopImmediatePropagation();
-            const toggleDropdownEvent = new CustomEvent(DROPDOWN_EVENTS.toggle, {
+            const toggleDropdownEvent = new Event(DROPDOWN_EVENTS.toggle, {
                 bubbles: true
             });
             this.dispatchEvent(toggleDropdownEvent);

package/build/esm/packages/phoenix/src/components/form/checkbox/checkbox.js

@@ -4,7 +4,7 @@ import { PhoenixLightLitElement } from '../../../core/phoenix_light_lit_element/
 import { phoenixCustomElement } from '../../../core/decorators/phoenix_custom_element.js';
 import { BASE_FORM_CONTROL_PROPS } from '../controllers/props_synchronizing/control_props_sync_controller_constants.js';
 import { ControlPropsSyncProviderController } from '../controllers/props_synchronizing/control_props_sync_provider_controller.js';
-import classnames from '../../../../../../external/classnames/index.js';
+import classnames from '../../../../external/classnames/index.js';
 import { CHECKBOX_PROPS_TO_SYNC, CHECKBOX_CONTROL_CSS_CLASSES } from './checkbox_constants.js';
 
 let HCheckbox = class HCheckbox extends PhoenixLightLitElement {

package/build/esm/packages/phoenix/src/components/form/checkbox/checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA,uBAAuB,gDAAoD;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA,uBAAuB,0CAA8C;AACrE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/phoenix/src/components/form/checkbox/checkbox_control.js

@@ -4,7 +4,7 @@ import { phoenixCustomElement } from '../../../core/decorators/phoenix_custom_el
 import { html } from 'lit-html';
 import { property } from '@lit/reactive-element/decorators.js';
 import { createRef, ref } from 'lit-html/directives/ref.js';
-import classnames from '../../../../../../external/classnames/index.js';
+import classnames from '../../../../external/classnames/index.js';
 import { ControlPropsSyncConsumerController } from '../controllers/props_synchronizing/control_props_sync_consumer_controller.js';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
 import { CHECKBOX_CONTROL_EVENTS, CHECKBOX_CONTROL_CSS_CLASSES } from './checkbox_constants.js';

package/build/esm/packages/phoenix/src/components/form/checkbox/checkbox_control.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA,uBAAuB,gDAAoD;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA,uBAAuB,0CAA8C;AACrE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/phoenix/src/components/form/input/input.js

@@ -5,7 +5,7 @@ import { phoenixCustomElement } from '../../../core/decorators/phoenix_custom_el
 import { INPUT_CONTROL_TYPES, INPUT_PROPS_TO_SYNC, INPUT_CONTROL_CSS_CLASSES } from './input_constants.js';
 import { BASE_FORM_CONTROL_PROPS } from '../controllers/props_synchronizing/control_props_sync_controller_constants.js';
 import { ControlPropsSyncProviderController } from '../controllers/props_synchronizing/control_props_sync_provider_controller.js';
-import classnames from '../../../../../../external/classnames/index.js';
+import classnames from '../../../../external/classnames/index.js';
 
 let HInput = class HInput extends PhoenixLightLitElement {
     constructor() {

package/build/esm/packages/phoenix/src/components/form/input/input.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA;AACA,uBAAuB,gDAAoD;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA;AACA,uBAAuB,0CAA8C;AACrE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/phoenix/src/components/form/radio/radio.js

@@ -4,7 +4,7 @@ import { PhoenixLightLitElement } from '../../../core/phoenix_light_lit_element/
 import { phoenixCustomElement } from '../../../core/decorators/phoenix_custom_element.js';
 import { BASE_FORM_CONTROL_PROPS } from '../controllers/props_synchronizing/control_props_sync_controller_constants.js';
 import { ControlPropsSyncProviderController } from '../controllers/props_synchronizing/control_props_sync_provider_controller.js';
-import classnames from '../../../../../../external/classnames/index.js';
+import classnames from '../../../../external/classnames/index.js';
 import { CHECKBOX_PROPS_TO_SYNC } from '../checkbox/checkbox_constants.js';
 import { RADIO_CONTROL_CSS_CLASSES } from './radio_constants.js';
 

package/build/esm/packages/phoenix/src/components/form/radio/radio.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA,uBAAuB,gDAAoD;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA,uBAAuB,0CAA8C;AACrE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/phoenix/src/components/form/switch/switch.js

@@ -4,7 +4,7 @@ import { PhoenixLightLitElement } from '../../../core/phoenix_light_lit_element/
 import { phoenixCustomElement } from '../../../core/decorators/phoenix_custom_element.js';
 import { BASE_FORM_CONTROL_PROPS } from '../controllers/props_synchronizing/control_props_sync_controller_constants.js';
 import { ControlPropsSyncProviderController } from '../controllers/props_synchronizing/control_props_sync_provider_controller.js';
-import classnames from '../../../../../../external/classnames/index.js';
+import classnames from '../../../../external/classnames/index.js';
 import { CHECKBOX_PROPS_TO_SYNC } from '../checkbox/checkbox_constants.js';
 import { SWITCH_CONTROL_CSS_CLASSES } from './switch_constants.js';
 

package/build/esm/packages/phoenix/src/components/form/switch/switch.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA,uBAAuB,gDAAoD;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA,uBAAuB,0CAA8C;AACrE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/phoenix/src/components/form/textarea/textarea.js

@@ -4,7 +4,7 @@ import { PhoenixLightLitElement } from '../../../core/phoenix_light_lit_element/
 import { phoenixCustomElement } from '../../../core/decorators/phoenix_custom_element.js';
 import { BASE_FORM_CONTROL_PROPS } from '../controllers/props_synchronizing/control_props_sync_controller_constants.js';
 import { ControlPropsSyncProviderController } from '../controllers/props_synchronizing/control_props_sync_provider_controller.js';
-import classnames from '../../../../../../external/classnames/index.js';
+import classnames from '../../../../external/classnames/index.js';
 import { TEXTAREA_PROPS_TO_SYNC, TEXTAREA_CONTROL_CSS_CLASSES } from './textarea_constants.js';
 
 let HTextarea = class HTextarea extends PhoenixLightLitElement {

package/build/esm/packages/phoenix/src/components/form/textarea/textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA,uBAAuB,gDAAoD;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA,uBAAuB,0CAA8C;AACrE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/phoenix/src/components/slider/slider.js

@@ -1,6 +1,6 @@
 import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.js';
 import { property } from 'lit/decorators';
-import { JsonUtils } from '@dreamcommerce/utilities';
+import { JsonUtils } from '../../../../utilities/build/esm/json_utils.js';
 import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
 import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
 import { Splide } from '../../../../../external/@splidejs/splide/dist/js/splide.esm.js';

package/build/esm/packages/phoenix/src/controllers/visibility_controller/visibility_controller.js

@@ -16,7 +16,7 @@ class VisibilityController {
         __classPrivateFieldGet(this, _VisibilityController_host, "f").addEventListener('resize', this._handleResize);
     }
     _setVisibilityValue() {
-        const isVisible = this._isVisibleBasedOnCssStyle() && !__classPrivateFieldGet(this, _VisibilityController_host, "f").getAttribute('hidden');
+        const isVisible = this._isVisibleBasedOnCssStyle();
         isVisible ? this.show() : this.hide();
     }
     _isVisibleBasedOnCssStyle() {

package/build/esm/packages/phoenix/src/core/phoenix_light_lit_element/phoenix_light_lit_element.d.ts

@@ -3,21 +3,14 @@ export declare class PhoenixLightLitElement extends LitElement {
     _slots: Record<string, TemplateResult[]>;
     protected childrenToWatch: string[];
     isWebComponentConnected: boolean;
-    isWebComponentRendered: boolean;
-    private _childrenForConnectionToWatch;
-    private _childrenForRenderToWatch;
     firstUpdated(props: PropertyValues): void;
     private _setupChildrenWatch;
-    private _getComponentsNamesForConnectionToWatch;
-    private _getComponentsNamesForRenderedToWatch;
+    private _getComponentsNamesToWatch;
     private _handleComponentConnected;
-    private _handleComponentRendered;
     connectedCallback(): void;
     allChildrenConnected(): void;
-    allChildrenRendered(): void;
     private _assignSlots;
     getSlot(name: string): TemplateResult[] | typeof nothing;
     hasSlot(name: string): boolean;
     createRenderRoot(): PhoenixLightLitElement;
-    private _dispatchLifecycleEvent;
 }

package/build/esm/packages/phoenix/src/core/phoenix_light_lit_element/phoenix_light_lit_element.js

@@ -9,71 +9,41 @@ class PhoenixLightLitElement extends LitElement {
         super(...arguments);
         this._slots = {};
         this.isWebComponentConnected = false;
-        this.isWebComponentRendered = false;
-        this._childrenForConnectionToWatch = [];
-        this._childrenForRenderToWatch = [];
         this._handleComponentConnected = ({ detail }) => {
             const connectedElement = detail.$el.tagName.toLowerCase();
-            if (this._childrenForConnectionToWatch.includes(connectedElement)) {
-                const elToRemoveIndex = this._childrenForConnectionToWatch.findIndex((tagName) => tagName === connectedElement);
-                this._childrenForConnectionToWatch.splice(elToRemoveIndex, elToRemoveIndex + 1);
+            if (this.childrenToWatch.includes(connectedElement)) {
+                const elToRemoveIndex = this.childrenToWatch.findIndex((tagName) => tagName === connectedElement);
+                this.childrenToWatch.splice(elToRemoveIndex, elToRemoveIndex + 1);
             }
-            if (!this._childrenForConnectionToWatch.length) {
+            if (!this.childrenToWatch.length) {
                 this.allChildrenConnected();
                 this.removeEventListener(PHOENIX_LIGHT_LIT_ELEMENTS_EVENT_NAMES.connected, this._handleComponentConnected);
             }
         };
-        this._handleComponentRendered = ({ detail }) => {
-            const renderedElement = detail.$el.tagName.toLowerCase();
-            if (this._childrenForRenderToWatch.includes(renderedElement)) {
-                const elToRemoveIndex = this._childrenForRenderToWatch.findIndex((tagName) => tagName === renderedElement);
-                this._childrenForRenderToWatch.splice(elToRemoveIndex, elToRemoveIndex + 1);
-            }
-            if (!this._childrenForRenderToWatch.length) {
-                this.allChildrenRendered();
-                this.removeEventListener(PHOENIX_LIGHT_LIT_ELEMENTS_EVENT_NAMES.rendered, this._handleComponentConnected);
-            }
-        };
-        this._dispatchLifecycleEvent = (eventName) => {
-            this.dispatchEvent(new CustomEvent(eventName, {
-                detail: {
-                    $el: this
-                },
-                bubbles: true
-            }));
-        };
     }
     firstUpdated(props) {
         super.firstUpdated(props);
         this._slots = this._assignSlots();
         this.requestUpdate();
-        this._dispatchLifecycleEvent(PHOENIX_LIGHT_LIT_ELEMENTS_EVENT_NAMES.rendered);
-        this.isWebComponentRendered = true;
     }
     _setupChildrenWatch() {
-        this._childrenForConnectionToWatch = this.childrenToWatch ? this.childrenToWatch : this._getComponentsNamesForConnectionToWatch();
-        this._childrenForRenderToWatch = this.childrenToWatch ? this.childrenToWatch : this._getComponentsNamesForRenderedToWatch();
-        if (!this._childrenForConnectionToWatch.length)
-            this.allChildrenConnected();
-        if (!this._childrenForRenderToWatch.length)
-            this.allChildrenRendered();
+        this.childrenToWatch = this.childrenToWatch ? this.childrenToWatch : this._getComponentsNamesToWatch();
         this.addEventListener(PHOENIX_LIGHT_LIT_ELEMENTS_EVENT_NAMES.connected, this._handleComponentConnected);
-        this.addEventListener(PHOENIX_LIGHT_LIT_ELEMENTS_EVENT_NAMES.rendered, this._handleComponentRendered);
     }
-    _getComponentsNamesForConnectionToWatch() {
+    _getComponentsNamesToWatch() {
         return PhoenixLightLitElementUtils.getComponentsForWhichToWaitForConnection([...this.querySelectorAll('*')]).map(($element) => $element.tagName.toLowerCase());
     }
-    _getComponentsNamesForRenderedToWatch() {
-        return PhoenixLightLitElementUtils.getComponentsForWhichToWaitForRender([...this.querySelectorAll('*')]).map(($element) => $element.tagName.toLowerCase());
-    }
     connectedCallback() {
         super.connectedCallback();
-        this._dispatchLifecycleEvent(PHOENIX_LIGHT_LIT_ELEMENTS_EVENT_NAMES.connected);
-        this.isWebComponentConnected = true;
+        this.dispatchEvent(new CustomEvent(PHOENIX_LIGHT_LIT_ELEMENTS_EVENT_NAMES.connected, {
+            detail: {
+                $el: this
+            },
+            bubbles: true
+        }));
         this._setupChildrenWatch();
     }
     allChildrenConnected() { }
-    allChildrenRendered() { }
     _assignSlots() {
         return [...this.querySelectorAll(':scope > [slot]')].reduce((acc, $el) => {
             var _a;
@@ -106,11 +76,7 @@ __decorate([
 __decorate([
     property({ type: Boolean }),
     __metadata("design:type", Object)
-], PhoenixLightLitElement.prototype, "isWebComponentConnected", void 0);
-__decorate([
-    property({ type: Boolean }),
-    __metadata("design:type", Object)
-], PhoenixLightLitElement.prototype, "isWebComponentRendered", void 0);
+], PhoenixLightLitElement.prototype, "isWebComponentConnected", void 0);
 
 export { PhoenixLightLitElement };
 //# sourceMappingURL=phoenix_light_lit_element.js.map

package/build/esm/packages/phoenix/src/core/phoenix_light_lit_element/phoenix_light_lit_element.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/phoenix/src/core/phoenix_light_lit_element/phoenix_light_lit_element_utils.d.ts

@@ -1,5 +1,4 @@
 import { PhoenixLightLitElement } from "./phoenix_light_lit_element";
 export declare class PhoenixLightLitElementUtils {
     static getComponentsForWhichToWaitForConnection(components: PhoenixLightLitElement[]): PhoenixLightLitElement[];
-    static getComponentsForWhichToWaitForRender(components: PhoenixLightLitElement[]): PhoenixLightLitElement[];
 }

package/build/esm/packages/phoenix/src/core/phoenix_light_lit_element/phoenix_light_lit_element_utils.js

@@ -1,4 +1,4 @@
-import { WebComponentsUtils } from '@dreamcommerce/utilities';
+import { WebComponentsUtils } from '../../../../utilities/build/esm/web_components_utils.js';
 
 class PhoenixLightLitElementUtils {
     static getComponentsForWhichToWaitForConnection(components) {
@@ -7,12 +7,6 @@ class PhoenixLightLitElementUtils {
                 WebComponentsUtils.isWebComponentDefined($element) &&
                 !$element.isWebComponentConnected));
     }
-    static getComponentsForWhichToWaitForRender(components) {
-        return components.filter(($element) => (WebComponentsUtils.isWebComponent($element) && !WebComponentsUtils.isWebComponentDefined($element)) ||
-            (WebComponentsUtils.isWebComponent($element) &&
-                WebComponentsUtils.isWebComponentDefined($element) &&
-                !$element.isWebComponentRendered));
-    }
 }
 
 export { PhoenixLightLitElementUtils };

package/build/esm/packages/phoenix/src/core/phoenix_light_lit_element/phoenix_light_lit_element_utils.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}