@shoper/phoenix_design_system 0.22.5-2 → 0.22.5-4

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

@@ -311,7 +311,7 @@ tslib_es6.__decorate([
 ], exports.HDropdown.prototype, "opened", void 0);
 tslib_es6.__decorate([
     decorators_js.property({ type: String, reflect: true }),
-    tslib_es6.__metadata("design:type", Object)
+    tslib_es6.__metadata("design:type", String)
 ], exports.HDropdown.prototype, "direction", void 0);
 tslib_es6.__decorate([
     decorators_js.property({ type: Boolean }),

package/build/cjs/packages/phoenix/src/components/messages/base_message.js

@@ -0,0 +1,130 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib_es6 = require('../../../../../external/tslib/tslib.es6.js');
+var decorators = require('lit/decorators');
+var utilities = require('@dreamcommerce/utilities');
+var phoenix_light_lit_element = require('../../core/phoenix_light_lit_element/phoenix_light_lit_element.js');
+var portal_constants = require('../portal/portal_constants.js');
+var keystrokes_controller = require('../../controllers/keystrokes_controller/keystrokes_controller.js');
+var relative_position_controller_constants = require('../../controllers/relative_position_controller/relative_position_controller_constants.js');
+var click_outside_controller = require('../../controllers/click_outside_controller/click_outside_controller.js');
+var relative_position_controller = require('../../controllers/relative_position_controller/relative_position_controller.js');
+var base_message_constants = require('./base_message_constants.js');
+
+class BaseMessage extends phoenix_light_lit_element.PhoenixLightLitElement {
+    constructor() {
+        super();
+        this.opened = false;
+        this.portalTarget = base_message_constants.DEFAULT_MESSAGE_PORTAL_NAME;
+        this.direction = relative_position_controller_constants.DIRECTIONS.topCenter;
+        this.offset = base_message_constants.DEFAULT_MESSAGE_OFFSET;
+        this._setupEventListeners = () => {
+            this.addEventListener('mouseenter', this._open);
+            this.addEventListener('mouseout', this._close);
+            this.addEventListener('focus', this._open);
+        };
+        this._positionMessage = () => {
+            requestAnimationFrame(() => {
+                var _a;
+                (_a = this._$messageContent) === null || _a === void 0 ? void 0 : _a.setAttribute('direction', this._positionController.position());
+            });
+        };
+        this._open = () => {
+            if (this.opened)
+                return;
+            this.opened = true;
+        };
+        this._close = () => {
+            if (!this.opened)
+                return;
+            const transitionDuration = parseFloat(getComputedStyle(this._$messageContent || this).transitionDuration) * 1000;
+            window.requestAnimationFrame(() => {
+                var _a;
+                (_a = this._$messageContent) === null || _a === void 0 ? void 0 : _a.classList.add(base_message_constants.MESSAGE_REMOVED_CLASS_NAME);
+                setTimeout(() => {
+                    this.opened = false;
+                }, transitionDuration);
+            });
+        };
+        this._handleFocusWithinMessage = (ev) => {
+            var _a;
+            if (((_a = document.activeElement) === null || _a === void 0 ? void 0 : _a.closest(`.${base_message_constants.MESSAGE_CLASS_NAME}`)) !== this)
+                this._close();
+            if (!document.activeElement)
+                return;
+            const $focusableElements = utilities.UiDomUtils.getFocusableElements(this);
+            const activeElementIndex = $focusableElements.indexOf(document.activeElement);
+            // jeśli jest przedostatni, to następnym elementem jest sentinel
+            const isPenultimate = activeElementIndex + 1 === $focusableElements.length - 1;
+            if (!isPenultimate)
+                return;
+            this._close();
+            ev.preventDefault();
+            const $focusableParentElements = utilities.UiDomUtils.getFocusableElements(this.parentElement);
+            const sentinelIndex = $focusableParentElements.indexOf(document.activeElement) + 1;
+            $focusableParentElements[sentinelIndex + 1].focus();
+        };
+        this._clickOutsideController = new click_outside_controller.ClickOutsideController({
+            host: this,
+            container: this,
+            action: this._close
+        });
+        new keystrokes_controller.KeystrokesController({
+            host: this,
+            keys: ['tab'],
+            callback: this._handleFocusWithinMessage
+        });
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        BaseMessage._appendMessagePortal();
+        if (!this._$messageContent)
+            this._$messageContent = this.querySelector('h-tooltip-content');
+        if (!this._positionController && this._$messageContent)
+            this._positionController = new relative_position_controller.RelativePositionController({
+                host: this,
+                direction: this.direction,
+                relativeElement: this,
+                elementToPosition: this._$messageContent,
+                offset: this.offset
+            });
+        this.setAttribute('tabindex', '0');
+        this._setupEventListeners();
+        this.className = base_message_constants.MESSAGE_CLASS_NAME;
+    }
+    static _appendMessagePortal() {
+        const $messagePortalTarget = document.querySelector(`[name="${base_message_constants.DEFAULT_MESSAGE_PORTAL_NAME}"]`);
+        if ($messagePortalTarget)
+            return;
+        const $portalTarget = document.createElement(portal_constants.PORTAL_TARGET_COMPONENT_NAME);
+        $portalTarget.setAttribute(portal_constants.PORTAL_TARGET_NAME_PROP, base_message_constants.DEFAULT_MESSAGE_PORTAL_NAME);
+        document.body.appendChild($portalTarget);
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this.removeEventListener('mouseenter', this._open);
+        this.removeEventListener('mouseout', this._close);
+        this.removeEventListener('focus', this._open);
+    }
+}
+tslib_es6.__decorate([
+    decorators.property({ type: Boolean, reflect: true }),
+    tslib_es6.__metadata("design:type", Object)
+], BaseMessage.prototype, "opened", void 0);
+tslib_es6.__decorate([
+    decorators.property({ type: String, attribute: portal_constants.PORTAL_TARGET_ATTRIBUTE_NAME }),
+    tslib_es6.__metadata("design:type", Object)
+], BaseMessage.prototype, "portalTarget", void 0);
+tslib_es6.__decorate([
+    decorators.property({ type: String, reflect: true }),
+    tslib_es6.__metadata("design:type", String)
+], BaseMessage.prototype, "direction", void 0);
+tslib_es6.__decorate([
+    decorators.property({ type: String }),
+    tslib_es6.__metadata("design:type", Number)
+], BaseMessage.prototype, "offset", void 0);
+
+exports.BaseMessage = BaseMessage;
+//# sourceMappingURL=base_message.js.map

package/build/cjs/packages/phoenix/src/components/{color_swatches/color_swatches.js.map → messages/base_message.js.map}

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/cjs/packages/phoenix/src/components/messages/base_message_constants.js

@@ -0,0 +1,16 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const DEFAULT_MESSAGE_PORTAL_NAME = 'message-portal';
+const MESSAGE_CONTENT_SLOT_NAME = 'message-content';
+const MESSAGE_CLASS_NAME = 'message';
+const MESSAGE_REMOVED_CLASS_NAME = `${MESSAGE_CLASS_NAME}_removed`;
+const DEFAULT_MESSAGE_OFFSET = 8;
+
+exports.DEFAULT_MESSAGE_OFFSET = DEFAULT_MESSAGE_OFFSET;
+exports.DEFAULT_MESSAGE_PORTAL_NAME = DEFAULT_MESSAGE_PORTAL_NAME;
+exports.MESSAGE_CLASS_NAME = MESSAGE_CLASS_NAME;
+exports.MESSAGE_CONTENT_SLOT_NAME = MESSAGE_CONTENT_SLOT_NAME;
+exports.MESSAGE_REMOVED_CLASS_NAME = MESSAGE_REMOVED_CLASS_NAME;
+//# sourceMappingURL=base_message_constants.js.map

package/build/cjs/packages/phoenix/src/components/{color_swatches/color_swatches_constants.js.map → messages/base_message_constants.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;"}
+{"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;"}

package/build/cjs/packages/phoenix/src/components/messages/base_message_content.js

@@ -0,0 +1,32 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib_es6 = require('../../../../../external/tslib/tslib.es6.js');
+var decorators = require('lit/decorators');
+var phoenix_light_lit_element = require('../../core/phoenix_light_lit_element/phoenix_light_lit_element.js');
+var portal_constants = require('../portal/portal_constants.js');
+var base_message_constants = require('./base_message_constants.js');
+
+class BaseMessageContent extends phoenix_light_lit_element.PhoenixLightLitElement {
+    constructor() {
+        super(...arguments);
+        this.portalTarget = base_message_constants.DEFAULT_MESSAGE_PORTAL_NAME;
+        this._setupAriaAttributes = () => {
+            this.setAttribute('role', 'tooltip');
+            this.setAttribute('inert', '');
+        };
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.slot = base_message_constants.MESSAGE_CONTENT_SLOT_NAME;
+        this._setupAriaAttributes();
+    }
+}
+tslib_es6.__decorate([
+    decorators.property({ type: String, attribute: portal_constants.PORTAL_TARGET_ATTRIBUTE_NAME }),
+    tslib_es6.__metadata("design:type", Object)
+], BaseMessageContent.prototype, "portalTarget", void 0);
+
+exports.BaseMessageContent = BaseMessageContent;
+//# sourceMappingURL=base_message_content.js.map

package/build/cjs/packages/phoenix/src/components/messages/base_message_content.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;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/cjs/packages/phoenix/src/components/messages/hints/hint.js

@@ -0,0 +1,30 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib_es6 = require('../../../../../../external/tslib/tslib.es6.js');
+var phoenix_custom_element = require('../../../core/decorators/phoenix_custom_element.js');
+var litHtml = require('lit-html');
+var base_message_constants = require('../base_message_constants.js');
+var base_message = require('../base_message.js');
+var hint_constants = require('./hint_constants.js');
+
+exports.HHint = class HHint extends base_message.BaseMessage {
+    connectedCallback() {
+        super.connectedCallback();
+        this.classList.add(hint_constants.HINT_CLASS_NAME);
+    }
+    render() {
+        super.render();
+        return litHtml.html `
+            <h-portal ?disabled="${!this.opened}" @portal.open="${this._positionMessage}" to="${this.portalTarget}" hidden>
+                ${this.getSlot(base_message_constants.MESSAGE_CONTENT_SLOT_NAME)}
+            </h-portal>
+            <div tabindex="0"></div>
+        `;
+    }
+};
+exports.HHint = tslib_es6.__decorate([
+    phoenix_custom_element.phoenixCustomElement(hint_constants.HINT_ELEMENT_NAME)
+], exports.HHint);
+//# sourceMappingURL=hint.js.map

package/build/cjs/packages/phoenix/src/components/messages/hints/hint.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,+CAAmD;AAC3E;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/phoenix/src/components/messages/hints/hint_constants.js

@@ -0,0 +1,14 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const HINT_ELEMENT_NAME = 'h-hint';
+const HINT_CONTENT_ELEMENT_NAME = 'h-hint-content';
+const HINT_CLASS_NAME = 'hint';
+const HINT_CONTENT_CLASS_NAME = `${HINT_CLASS_NAME}__content`;
+
+exports.HINT_CLASS_NAME = HINT_CLASS_NAME;
+exports.HINT_CONTENT_CLASS_NAME = HINT_CONTENT_CLASS_NAME;
+exports.HINT_CONTENT_ELEMENT_NAME = HINT_CONTENT_ELEMENT_NAME;
+exports.HINT_ELEMENT_NAME = HINT_ELEMENT_NAME;
+//# sourceMappingURL=hint_constants.js.map

package/build/{esm/packages/phoenix/src/components/color_swatches/color_swatches_constants.js.map → cjs/packages/phoenix/src/components/messages/hints/hint_constants.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;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/phoenix/src/components/messages/hints/hint_content.js

@@ -0,0 +1,19 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib_es6 = require('../../../../../../external/tslib/tslib.es6.js');
+var phoenix_custom_element = require('../../../core/decorators/phoenix_custom_element.js');
+var hint_constants = require('./hint_constants.js');
+var base_message_content = require('../base_message_content.js');
+
+exports.HHintContent = class HHintContent extends base_message_content.BaseMessageContent {
+    connectedCallback() {
+        super.connectedCallback();
+        this.className = hint_constants.HINT_CONTENT_CLASS_NAME;
+    }
+};
+exports.HHintContent = tslib_es6.__decorate([
+    phoenix_custom_element.phoenixCustomElement(hint_constants.HINT_CONTENT_ELEMENT_NAME)
+], exports.HHintContent);
+//# sourceMappingURL=hint_content.js.map

package/build/cjs/packages/phoenix/src/components/messages/hints/hint_content.js.map

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

package/build/cjs/packages/phoenix/src/components/messages/tooltips/tooltip.js

@@ -0,0 +1,30 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib_es6 = require('../../../../../../external/tslib/tslib.es6.js');
+var phoenix_custom_element = require('../../../core/decorators/phoenix_custom_element.js');
+var litHtml = require('lit-html');
+var base_message_constants = require('../base_message_constants.js');
+var base_message = require('../base_message.js');
+var tooltip_constants = require('./tooltip_constants.js');
+
+exports.HTooltip = class HTooltip extends base_message.BaseMessage {
+    connectedCallback() {
+        super.connectedCallback();
+        this.classList.add(tooltip_constants.TOOLTIP_CLASS_NAME);
+    }
+    render() {
+        super.render();
+        return litHtml.html `
+            <h-portal ?disabled="${!this.opened}" @portal.open="${this._positionMessage}" to="${this.portalTarget}" hidden>
+                ${this.getSlot(base_message_constants.MESSAGE_CONTENT_SLOT_NAME)}
+            </h-portal>
+            <div tabindex="0"></div>
+        `;
+    }
+};
+exports.HTooltip = tslib_es6.__decorate([
+    phoenix_custom_element.phoenixCustomElement(tooltip_constants.TOOLTIP_ELEMENT_NAME)
+], exports.HTooltip);
+//# sourceMappingURL=tooltip.js.map

package/build/cjs/packages/phoenix/src/components/messages/tooltips/tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,+CAAmD;AAC3E;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/phoenix/src/components/messages/tooltips/tooltip_constants.js

@@ -0,0 +1,14 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const TOOLTIP_ELEMENT_NAME = 'h-tooltip';
+const TOOLTIP_CONTENT_ELEMENT_NAME = 'h-tooltip-content';
+const TOOLTIP_CLASS_NAME = 'tooltip';
+const TOOLTIP_CONTENT_CLASS_NAME = `${TOOLTIP_CLASS_NAME}__content`;
+
+exports.TOOLTIP_CLASS_NAME = TOOLTIP_CLASS_NAME;
+exports.TOOLTIP_CONTENT_CLASS_NAME = TOOLTIP_CONTENT_CLASS_NAME;
+exports.TOOLTIP_CONTENT_ELEMENT_NAME = TOOLTIP_CONTENT_ELEMENT_NAME;
+exports.TOOLTIP_ELEMENT_NAME = TOOLTIP_ELEMENT_NAME;
+//# sourceMappingURL=tooltip_constants.js.map

package/build/cjs/packages/phoenix/src/components/{color_swatches/color_item/color_item_constants.js.map → messages/tooltips/tooltip_constants.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;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/phoenix/src/components/messages/tooltips/tooltip_content.js

@@ -0,0 +1,19 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib_es6 = require('../../../../../../external/tslib/tslib.es6.js');
+var phoenix_custom_element = require('../../../core/decorators/phoenix_custom_element.js');
+var base_message_content = require('../base_message_content.js');
+var tooltip_constants = require('./tooltip_constants.js');
+
+exports.HTooltipContent = class HTooltipContent extends base_message_content.BaseMessageContent {
+    connectedCallback() {
+        super.connectedCallback();
+        this.className = tooltip_constants.TOOLTIP_CONTENT_CLASS_NAME;
+    }
+};
+exports.HTooltipContent = tslib_es6.__decorate([
+    phoenix_custom_element.phoenixCustomElement(tooltip_constants.TOOLTIP_CONTENT_ELEMENT_NAME)
+], exports.HTooltipContent);
+//# sourceMappingURL=tooltip_content.js.map

package/build/cjs/packages/phoenix/src/components/messages/tooltips/tooltip_content.js.map

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

package/build/cjs/packages/phoenix/src/components/portal/portal_constants.js

@@ -7,9 +7,11 @@ const PORTAL_EVENTS = {
     close: 'portal.close'
 };
 const PORTAL_TARGET_NAME_PROP = 'name';
-const PORTAL_TARGET_COMPONENT_NAME = 'h-portal-target';
+const PORTAL_TARGET_COMPONENT_NAME = 'h-portal-target';
+const PORTAL_TARGET_ATTRIBUTE_NAME = 'portal-target';
 
 exports.PORTAL_EVENTS = PORTAL_EVENTS;
+exports.PORTAL_TARGET_ATTRIBUTE_NAME = PORTAL_TARGET_ATTRIBUTE_NAME;
 exports.PORTAL_TARGET_COMPONENT_NAME = PORTAL_TARGET_COMPONENT_NAME;
 exports.PORTAL_TARGET_NAME_PROP = PORTAL_TARGET_NAME_PROP;
 //# sourceMappingURL=portal_constants.js.map

package/build/cjs/packages/phoenix/src/components/portal/portal_constants.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;"}
+{"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;"}

package/build/cjs/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller.js

@@ -11,7 +11,7 @@ var throttle = require('../../../../../external/lodash/throttle.js');
 
 var _RelativePositionController_host, _RelativePositionController_container, _RelativePositionController_nearestNonStaticElementFromElementToPosition, _RelativePositionController_direction, _RelativePositionController_nearestScrollableElement, _RelativePositionController_relativeElement, _RelativePositionController_elementToPosition, _RelativePositionController_disablePositioningOnCondition, _RelativePositionController_portalElementsNames, _RelativePositionController_isInitiallyScrollable, _RelativePositionController_initialMaxHeight, _RelativePositionController_initialHeight, _RelativePositionController_calculatedDirection, _RelativePositionController_hasPositioningBeenDisabled, _RelativePositionController_doesCurrentlyHaveShrinkMode, _RelativePositionController_offset, _RelativePositionController_throttledReposition, _RelativePositionController_throttledRepositionForScroll;
 class RelativePositionController {
-    constructor({ host, container, direction, relativeElement, elementToPosition, disablePositioningOnCondition = () => true, portalElementsNames = [], offset = 0 }) {
+    constructor({ host, container, direction, relativeElement, elementToPosition, disablePositioningOnCondition = () => false, portalElementsNames = [], offset = 0 }) {
         _RelativePositionController_host.set(this, void 0);
         _RelativePositionController_container.set(this, void 0);
         _RelativePositionController_nearestNonStaticElementFromElementToPosition.set(this, void 0);

package/build/cjs/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller_constants.js

@@ -2,13 +2,15 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const DIRECTIONS = {
+const VERTICAL_DIRECTIONS = {
     bottomLeft: 'bottom-left',
     bottomRight: 'bottom-right',
     bottomCenter: 'bottom-center',
     topLeft: 'top-left',
     topRight: 'top-right',
-    topCenter: 'top-center',
+    topCenter: 'top-center'
+};
+const HORIZONTAL_DIRECTIONS = {
     rightTop: 'right-top',
     rightCenter: 'right-center',
     rightBottom: 'right-bottom',
@@ -16,6 +18,21 @@ const DIRECTIONS = {
     leftCenter: 'left-center',
     leftBottom: 'left-bottom'
 };
+const CENTER_DIRECTIONS = {
+    centerTop: 'center-top',
+    centerRight: 'center-right',
+    centerBottom: 'center-bottom',
+    centerLeft: 'center-left',
+    top: 'top',
+    right: 'right',
+    bottom: 'bottom',
+    left: 'left'
+};
+const DIRECTIONS = {
+    ...HORIZONTAL_DIRECTIONS,
+    ...VERTICAL_DIRECTIONS,
+    ...CENTER_DIRECTIONS
+};
 const CALCULATOR_DIRECTIONS = {
     bottom: 'bottom',
     top: 'top',
@@ -37,13 +54,16 @@ const RELATIVE_POSITION_CONTROLLER_EVENTS = {
 };
 
 exports.CALCULATOR_DIRECTIONS = CALCULATOR_DIRECTIONS;
+exports.CENTER_DIRECTIONS = CENTER_DIRECTIONS;
 exports.DEFAULT_SCROLL_THROTTLE_WAIT_TIME = DEFAULT_SCROLL_THROTTLE_WAIT_TIME;
 exports.DEFAULT_THROTTLE_WAIT_TIME = DEFAULT_THROTTLE_WAIT_TIME;
 exports.DIRECTIONS = DIRECTIONS;
+exports.HORIZONTAL_DIRECTIONS = HORIZONTAL_DIRECTIONS;
 exports.NON_STATIC_POSITIONS = NON_STATIC_POSITIONS;
 exports.OVERFLOW_AUTO = OVERFLOW_AUTO;
 exports.OVERFLOW_SCROLL = OVERFLOW_SCROLL;
 exports.RELATIVE_POSITION_CONTROLLER_EVENTS = RELATIVE_POSITION_CONTROLLER_EVENTS;
 exports.SHRINK_MODE_BOTTOM_MARGIN = SHRINK_MODE_BOTTOM_MARGIN;
 exports.SHRINK_MODE_MIN_HEIGHT = SHRINK_MODE_MIN_HEIGHT;
+exports.VERTICAL_DIRECTIONS = VERTICAL_DIRECTIONS;
 //# sourceMappingURL=relative_position_controller_constants.js.map

package/build/cjs/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller_constants.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;"}
+{"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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/phoenix/src/index.js

@@ -60,8 +60,6 @@ var toggle_button_group = require('./components/groups/toggle_button_group/toggl
 var toggle_button = require('./components/groups/toggle_button_group/toggle_button.js');
 var click_outside_controller_messages = require('./controllers/click_outside_controller/click_outside_controller_messages.js');
 var backdrop = require('./components/backdrop/backdrop.js');
-var color_item = require('./components/color_swatches/color_item/color_item.js');
-var color_swatches = require('./components/color_swatches/color_swatches.js');
 var visibility_controller = require('./controllers/visibility_controller/visibility_controller.js');
 var slider = require('./components/slider/slider.js');
 var tab = require('./components/tabs/tab/tab.js');
@@ -69,6 +67,11 @@ var tab_panel = require('./components/tabs/tab_panel.js');
 var tabs_constants = require('./components/tabs/tabs_constants.js');
 var tabs = require('./components/tabs/tabs.js');
 var scroll_to = require('./components/scroll_to/scroll_to.js');
+var base_message = require('./components/messages/base_message.js');
+var hint = require('./components/messages/hints/hint.js');
+var hint_content = require('./components/messages/hints/hint_content.js');
+var tooltip = require('./components/messages/tooltips/tooltip.js');
+var tooltip_content = require('./components/messages/tooltips/tooltip_content.js');
 
 
 
@@ -344,18 +347,6 @@ Object.defineProperty(exports, 'HBackdrop', {
 		return backdrop.HBackdrop;
 	}
 });
-Object.defineProperty(exports, 'HColorItem', {
-	enumerable: true,
-	get: function () {
-		return color_item.HColorItem;
-	}
-});
-Object.defineProperty(exports, 'HColorSwatches', {
-	enumerable: true,
-	get: function () {
-		return color_swatches.HColorSwatches;
-	}
-});
 exports.VisibilityController = visibility_controller.VisibilityController;
 Object.defineProperty(exports, 'HSlider', {
 	enumerable: true,
@@ -388,4 +379,29 @@ Object.defineProperty(exports, 'HScrollTo', {
 		return scroll_to.HScrollTo;
 	}
 });
+exports.BaseMessage = base_message.BaseMessage;
+Object.defineProperty(exports, 'HHint', {
+	enumerable: true,
+	get: function () {
+		return hint.HHint;
+	}
+});
+Object.defineProperty(exports, 'HHintContent', {
+	enumerable: true,
+	get: function () {
+		return hint_content.HHintContent;
+	}
+});
+Object.defineProperty(exports, 'HTooltip', {
+	enumerable: true,
+	get: function () {
+		return tooltip.HTooltip;
+	}
+});
+Object.defineProperty(exports, 'HTooltipContent', {
+	enumerable: true,
+	get: function () {
+		return tooltip_content.HTooltipContent;
+	}
+});
 //# sourceMappingURL=index.js.map

package/build/cjs/packages/phoenix/src/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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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

@@ -1,11 +1,11 @@
-import { IDropdown } from "./dropdown_types";
+import type { IDropdown, TDropdownDirection } from "./dropdown_types";
 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";
 export declare class HDropdown extends PhoenixLightLitElement implements IDropdown {
     opened: boolean;
-    direction: "bottom-center";
+    direction: TDropdownDirection;
     toggleOnHover: boolean;
     name: string;
     transition: string;

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

@@ -307,7 +307,7 @@ __decorate([
 ], HDropdown.prototype, "opened", void 0);
 __decorate([
     property({ type: String, reflect: true }),
-    __metadata("design:type", Object)
+    __metadata("design:type", String)
 ], HDropdown.prototype, "direction", void 0);
 __decorate([
     property({ type: Boolean }),

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

@@ -1,3 +1,5 @@
+import { Any } from 'ts-toolbelt';
+import { VERTICAL_DIRECTIONS } from "../../controllers/relative_position_controller/relative_position_controller_constants";
 export declare type TDropdownSelectors = {
     getDropdownPortalTargetName(): string;
     getDropdownContainerName(): string;
@@ -13,3 +15,4 @@ export declare type TDropdownHideEvent = Event & {
         name: string;
     };
 };
+export declare type TDropdownDirection = typeof VERTICAL_DIRECTIONS[Any.Keys<typeof VERTICAL_DIRECTIONS>];

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

@@ -1,2 +1,3 @@
-export {};
+import 'ts-toolbelt';
+import '@phoenixRoot/controllers/relative_position_controller/relative_position_controller_constants';
 //# sourceMappingURL=dropdown_types.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"dropdown_types.js","sourceRoot":"","sources":["../../../../../../../src/components/dropdown/dropdown_types.ts"],"names":[],"mappings":""}
+{"version":3,"file":"dropdown_types.js","sourceRoot":"","sources":["../../../../../../../src/components/dropdown/dropdown_types.ts"],"names":[],"mappings":"AAAA,OAAoB,aAAa,CAAC;AAClC,OAAoC,8FAA8F,CAAC"}

package/build/esm/packages/phoenix/src/components/messages/base_message.d.ts

@@ -0,0 +1,20 @@
+import { PhoenixLightLitElement } from "../../core/phoenix_light_lit_element/phoenix_light_lit_element";
+import type { TDirection } from "../../controllers/relative_position_controller/relative_position_controller_types";
+export declare class BaseMessage extends PhoenixLightLitElement {
+    opened: boolean;
+    portalTarget: string;
+    direction: TDirection;
+    offset: number;
+    private _positionController;
+    private _clickOutsideController;
+    private _$messageContent;
+    constructor();
+    connectedCallback(): void;
+    private static _appendMessagePortal;
+    private _setupEventListeners;
+    protected _positionMessage: () => void;
+    private _open;
+    private _close;
+    private _handleFocusWithinMessage;
+    disconnectedCallback(): void;
+}