@shoper/phoenix_design_system 1.2.3-4 → 1.2.3-5

package/build/cjs/external/lit/external/lit-html/directives/template-content.js

@@ -0,0 +1,15 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var litHtml = require('../lit-html.js');
+var directive = require('../directive.js');
+
+/**
+ * @license
+ * Copyright 2020 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const o=directive.directive(class extends directive.Directive{constructor(t){if(super(t),t.type!==directive.PartType.CHILD)throw Error("templateContent can only be used in child bindings")}render(r){return this.ft===r?litHtml.noChange:(this.ft=r,document.importNode(r.content,!0))}});
+
+exports.templateContent = o;
+//# sourceMappingURL=template-content.js.map

package/build/cjs/{packages/phoenix/src/components/form/file_picker/file/file_model.js.map → external/lit/external/lit-html/directives/template-content.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;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var tslib_es6 = require('../../../../../external/tslib/tslib.es6.js');
-var decorators = require('lit/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 phoenix_custom_element = require('../../core/decorators/phoenix_custom_element.js');
@@ -31,7 +31,6 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
         this.offset = 0;
         this.portalTarget = dropdown_constants.DEFAULT_DROPDOWN_PORTAL_NAME;
         this._backdropController = new backdrop_controller.BackdropController();
-        this._lastFocusableElement = undefined;
         this._handleClickOutside = async (target) => {
             var _a, _b;
             if (!this.opened)
@@ -64,12 +63,10 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
                     }, 0);
                     const transitionDuration = parseFloat(getComputedStyle(this.$dropdownContent || this).transitionDuration) * 1000;
                     setTimeout(() => {
-                        var _a, _b;
+                        var _a;
                         this._dispatchShowDropdownEvent();
                         (_a = this.$dropdownContent) === null || _a === void 0 ? void 0 : _a.classList.remove(`${dropdown_constants.DROPDOWN_CONTENT_SHOW}-${this.transition}-start`, `${dropdown_constants.DROPDOWN_CONTENT_SHOW}-${this.transition}-end`);
                         this._toggleScroll();
-                        if (!this._lastFocusableElement)
-                            this._lastFocusableElement = (_b = this.$dropdownContent) === null || _b === void 0 ? void 0 : _b.lastElementChild;
                         resolve();
                     }, transitionDuration);
                 });
@@ -155,14 +152,11 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
                 this._handleFocusOnNextElement(ev);
         };
         this._handleFocusOnNextElement = async (ev) => {
+            var _a;
             ev.preventDefault();
             const $focusableElements = utilities.UiDomUtils.getFocusableElements(document.body);
             const indexOfDropdownToggler = $focusableElements.indexOf(this.$dropdownToggler);
-            const $nextElementToFocus = $focusableElements.find((currentElement, index) => {
-                if (index > indexOfDropdownToggler && !currentElement.closest(`${dropdown_constants.DROPDOWN_TOGGLER_NAME}[name="${this.name}"]`))
-                    return currentElement;
-                return null;
-            });
+            const $nextElementToFocus = (_a = $focusableElements[indexOfDropdownToggler + 1]) !== null && _a !== void 0 ? _a : $focusableElements[0];
             await this._hideDropdownsSequentially();
             await this.hide();
             this._focusOnNextElementAfterToggler($nextElementToFocus);
@@ -223,12 +217,8 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
         });
     }
     async connectedCallback() {
-        var _a;
         super.connectedCallback();
         HDropdown_1._appendDropdownPortal();
-        if (!this._rootDropdown)
-            this._rootDropdown =
-                ((_a = this.parentElement) === null || _a === void 0 ? void 0 : _a.tagName.toLowerCase()) === 'h-dropdown-content' ? this._findRootDropdown(this.parentElement) : this;
         if (!this.$dropdownContent)
             this.$dropdownContent = this.querySelector(dropdown_constants.DROPDOWN_CONTENT_NAME);
         if (!this.$dropdownToggler)
@@ -374,10 +364,6 @@ tslib_es6.__decorate([
     decorators_js.property({ type: String }),
     tslib_es6.__metadata("design:type", Object)
 ], exports.HDropdown.prototype, "portalTarget", void 0);
-tslib_es6.__decorate([
-    decorators.state(),
-    tslib_es6.__metadata("design:type", Object)
-], exports.HDropdown.prototype, "_lastFocusableElement", void 0);
 exports.HDropdown = HDropdown_1 = tslib_es6.__decorate([
     phoenix_custom_element.phoenixCustomElement('h-dropdown'),
     tslib_es6.__metadata("design:paramtypes", [])

package/build/cjs/packages/phoenix/src/components/dropdown/dropdown.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,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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,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;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/dropdown/dropdown_content.js

@@ -11,14 +11,14 @@ var dropdown_constants = require('./dropdown_constants.js');
 
 exports.HDropdownContent = class HDropdownContent extends phoenix_light_lit_element.PhoenixLightLitElement {
     constructor() {
-        super(...arguments);
+        super();
         this.name = '';
+        this.slot = this.hasAttribute('slot') ? this.slot : 'content';
     }
     connectedCallback() {
         super.connectedCallback();
         this.classList.add(dropdown_constants.DROPDOWN_CONTENT_CSS_CLASS);
         this.setAttribute('role', 'menu');
-        this.slot = this.hasAttribute('slot') ? this.slot : 'content';
         Array.from(this.children).forEach((element) => {
             element.setAttribute('role', 'menuitem');
         });
@@ -33,6 +33,7 @@ tslib_es6.__decorate([
     tslib_es6.__metadata("design:type", Object)
 ], exports.HDropdownContent.prototype, "name", void 0);
 exports.HDropdownContent = tslib_es6.__decorate([
-    phoenix_custom_element.phoenixCustomElement('h-dropdown-content')
+    phoenix_custom_element.phoenixCustomElement('h-dropdown-content'),
+    tslib_es6.__metadata("design:paramtypes", [])
 ], exports.HDropdownContent);
 //# sourceMappingURL=dropdown_content.js.map

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

package/build/cjs/packages/phoenix/src/components/form/input_stepper/display_input.js

@@ -0,0 +1,54 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib_es6 = require('../../../../../../external/tslib/tslib.es6.js');
+var lit = require('lit');
+var decorators = require('lit/decorators');
+var phoenix_light_lit_element = require('../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js');
+var phoenix_custom_element = require('../../../core/decorators/phoenix_custom_element.js');
+var ref_js = require('lit-html/directives/ref.js');
+var input_stepper_constants = require('./input_stepper_constants.js');
+
+exports.HDisplayInput = class HDisplayInput extends phoenix_light_lit_element.PhoenixLightLitElement {
+    constructor() {
+        super(...arguments);
+        this.inputRef = ref_js.createRef();
+        this._testDispatchValueChanged = () => {
+            var _a;
+            const valueChangeEvent = new CustomEvent(input_stepper_constants.DISPLAY_INPUT_EVENT_NAMES.change, {
+                bubbles: true,
+                detail: {
+                    value: (_a = this.inputRef.value) === null || _a === void 0 ? void 0 : _a.value
+                }
+            });
+            this.dispatchEvent(valueChangeEvent);
+            if (this.inputRef.value) {
+                this.inputRef.value.value = this.value;
+            }
+        };
+    }
+    _setInputBehavior(event) {
+        const input = event.target;
+        input.focus();
+        input.select();
+    }
+    render() {
+        return lit.html `<input
+            class="${input_stepper_constants.INPUT_STEPPER_CLASS_NAMES.input}"
+            type="text"
+            ${ref_js.ref(this.inputRef)}
+            .value="${this.value}"
+            @input=${this._testDispatchValueChanged}
+            @click=${(event) => this._setInputBehavior(event)}
+        />`;
+    }
+};
+tslib_es6.__decorate([
+    decorators.property({ type: String, attribute: 'value', reflect: true }),
+    tslib_es6.__metadata("design:type", String)
+], exports.HDisplayInput.prototype, "value", void 0);
+exports.HDisplayInput = tslib_es6.__decorate([
+    phoenix_custom_element.phoenixCustomElement('h-display-input')
+], exports.HDisplayInput);
+//# sourceMappingURL=display_input.js.map

package/build/cjs/packages/phoenix/src/components/form/{file_picker/file_picker_label.js.map → input_stepper/display_input.js.map}

@@ -1 +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;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,+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;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/form/input_stepper/input_stepper.js

@@ -0,0 +1,96 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib_es6 = require('../../../../../../external/tslib/tslib.es6.js');
+require('lit');
+var decorators = require('lit/decorators');
+var phoenix_light_lit_element = require('../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js');
+var phoenix_custom_element = require('../../../core/decorators/phoenix_custom_element.js');
+var input_stepper_constants = require('./input_stepper_constants.js');
+
+exports.HInputStepper = class HInputStepper extends phoenix_light_lit_element.PhoenixLightLitElement {
+    constructor() {
+        super(...arguments);
+        this.step = 1;
+        this.min = -Infinity;
+        this.max = Infinity;
+        this._handleInputChange = (event) => {
+            var _a;
+            ((_a = event.target) === null || _a === void 0 ? void 0 : _a.action) === input_stepper_constants.INPUT_STEPPER_ACTION_TYPES.increment ? this._increment() : this._decrement();
+        };
+        this._handleDisplayChange = (event) => {
+            if (event.detail.value > this.max)
+                return;
+            this._value = Number(event.detail.value);
+        };
+        this._handleUpdateValue = () => {
+            this._value = Number(this._$inputElement.value) || 0;
+        };
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        const $element = this.querySelector('h-display-input');
+        if (!$element) {
+            throw new Error();
+        }
+        this._$inputElement = $element;
+        this._value = Number($element.value) || 0;
+        this._setupEvents();
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this._$inputElement.removeEventListener('input', this._handleUpdateValue);
+    }
+    updated(changedProperties) {
+        super.updated(changedProperties);
+        if (changedProperties.has('_value')) {
+            this._dispatchValueChanged();
+            this._$inputElement.value = String(this._value);
+        }
+    }
+    _setupEvents() {
+        this.addEventListener(input_stepper_constants.INPUT_STEPPER_EVENT_NAMES.change, this._handleInputChange);
+        this.addEventListener(input_stepper_constants.DISPLAY_INPUT_EVENT_NAMES.change, this._handleDisplayChange);
+        this._$inputElement.addEventListener('input', this._handleUpdateValue);
+    }
+    _increment() {
+        if (this._value >= this.max)
+            return;
+        this._value += this.step;
+    }
+    _decrement() {
+        if (this._value <= this.min)
+            return;
+        this._value -= this.step;
+    }
+    _dispatchValueChanged() {
+        const valueChangeEvent = new CustomEvent(input_stepper_constants.INPUT_STEPPER_EVENT_NAMES.valueChanged, {
+            bubbles: true,
+            detail: {
+                value: this._value
+            }
+        });
+        this.dispatchEvent(valueChangeEvent);
+    }
+};
+tslib_es6.__decorate([
+    decorators.property({ type: Number, attribute: 'step', reflect: true }),
+    tslib_es6.__metadata("design:type", Number)
+], exports.HInputStepper.prototype, "step", void 0);
+tslib_es6.__decorate([
+    decorators.property({ type: Number, attribute: 'min', reflect: true }),
+    tslib_es6.__metadata("design:type", Number)
+], exports.HInputStepper.prototype, "min", void 0);
+tslib_es6.__decorate([
+    decorators.property({ type: Number, attribute: 'max', reflect: true }),
+    tslib_es6.__metadata("design:type", Number)
+], exports.HInputStepper.prototype, "max", void 0);
+tslib_es6.__decorate([
+    decorators.state(),
+    tslib_es6.__metadata("design:type", Number)
+], exports.HInputStepper.prototype, "_value", void 0);
+exports.HInputStepper = tslib_es6.__decorate([
+    phoenix_custom_element.phoenixCustomElement('h-input-stepper')
+], exports.HInputStepper);
+//# sourceMappingURL=input_stepper.js.map

package/build/cjs/packages/phoenix/src/components/form/{file_picker/file_picker.js.map → input_stepper/input_stepper.js.map}

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,+CAAmD;AAC3E;AACA;AACA;AACA;AACA,oBAAoB,0CAA8C;AAClE;AACA,iBAAiB,wDAA4D;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,+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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/form/input_stepper/input_stepper_constants.js

@@ -0,0 +1,24 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const INPUT_STEPPER_EVENT_NAMES = {
+    change: 'inputStepper.change',
+    valueChanged: 'inputStepper.valueChanged'
+};
+const DISPLAY_INPUT_EVENT_NAMES = {
+    change: 'displayInput.change'
+};
+const INPUT_STEPPER_ACTION_TYPES = {
+    increment: 'increment',
+    decrement: 'decrement'
+};
+const INPUT_STEPPER_CLASS_NAMES = {
+    input: 'control-display__input'
+};
+
+exports.DISPLAY_INPUT_EVENT_NAMES = DISPLAY_INPUT_EVENT_NAMES;
+exports.INPUT_STEPPER_ACTION_TYPES = INPUT_STEPPER_ACTION_TYPES;
+exports.INPUT_STEPPER_CLASS_NAMES = INPUT_STEPPER_CLASS_NAMES;
+exports.INPUT_STEPPER_EVENT_NAMES = INPUT_STEPPER_EVENT_NAMES;
+//# sourceMappingURL=input_stepper_constants.js.map

package/build/{esm/packages/phoenix/src/components/form/file_picker/file_picker_constants.js.map → cjs/packages/phoenix/src/components/form/input_stepper/input_stepper_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;"}
+{"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;"}

package/build/cjs/packages/phoenix/src/components/form/input_stepper/stepper_action_button.js

@@ -0,0 +1,39 @@
+'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 phoenix_custom_element = require('../../../core/decorators/phoenix_custom_element.js');
+var btn_controller = require('../../../controllers/btn_controller/btn_controller.js');
+var input_stepper_constants = require('./input_stepper_constants.js');
+
+exports.HStepperActionButton = class HStepperActionButton extends phoenix_light_lit_element.PhoenixLightLitElement {
+    constructor() {
+        super();
+        this._dispatchChangeEvent = () => {
+            const unitaryValueChangeEvent = new CustomEvent(input_stepper_constants.INPUT_STEPPER_EVENT_NAMES.change, {
+                bubbles: true,
+                detail: {
+                    action: this.action
+                }
+            });
+            this.dispatchEvent(unitaryValueChangeEvent);
+        };
+        new btn_controller.BtnController(this, this._dispatchChangeEvent);
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.addEventListener('click', this._dispatchChangeEvent);
+    }
+};
+tslib_es6.__decorate([
+    decorators.property({ type: String, attribute: 'action', reflect: true }),
+    tslib_es6.__metadata("design:type", String)
+], exports.HStepperActionButton.prototype, "action", void 0);
+exports.HStepperActionButton = tslib_es6.__decorate([
+    phoenix_custom_element.phoenixCustomElement('h-stepper-action-button'),
+    tslib_es6.__metadata("design:paramtypes", [])
+], exports.HStepperActionButton);
+//# sourceMappingURL=stepper_action_button.js.map

package/build/cjs/packages/phoenix/src/components/form/input_stepper/stepper_action_button.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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/phoenix/src/components/form/select/components/option/select_option.js

@@ -9,6 +9,7 @@ var decorators_js = require('@lit/reactive-element/decorators.js');
 var select_components_constatns = require('../select_components_constatns.js');
 var btn_controller = require('../../../../../controllers/btn_controller/btn_controller.js');
 var select_option_constants = require('./select_option_constants.js');
+require('@lit/reactive-element');
 
 exports.HOption = class HOption extends phoenix_light_lit_element.PhoenixLightLitElement {
     constructor() {
@@ -37,12 +38,10 @@ exports.HOption = class HOption extends phoenix_light_lit_element.PhoenixLightLi
     _setupEvents() {
         this.addEventListener('click', this._dispatchClickedEvent);
     }
-    attributeChangedCallback(name, _old, value) {
-        super.attributeChangedCallback(name, _old, value);
-        switch (name) {
-            case 'selected':
-                this.selected ? this._addSelectedIcon() : this._removeSelectedIcon();
-        }
+    updated(changedProperties) {
+        super.updated(changedProperties);
+        if (changedProperties.has('selected'))
+            this.selected ? this._addSelectedIcon() : this._removeSelectedIcon();
     }
     _addSelectedIcon() {
         this._$checkedIcon = document.createElement('h-icon');

package/build/cjs/packages/phoenix/src/components/form/select/components/option/select_option.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,qDAAyD;AACjF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,qDAAyD;AACjF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/form/select/components/toggler/select_toggler.js

@@ -55,7 +55,7 @@ exports.HSelectToggler = class HSelectToggler extends phoenix_light_lit_element.
             ${observable_directive.observe(this.selectedOptions$, (selectOptions) => {
             var _a;
             if (!selectOptions.length)
-                return litHtml.html `${(_a = this.getSlot(select_components_constatns.SELECT_INPUT_PLACEHOLDER_SLOT_NAME)) !== null && _a !== void 0 ? _a : 'Select'}`;
+                return litHtml.html `${(_a = this.getSlot(select_components_constatns.SELECT_INPUT_PLACEHOLDER_SLOT_NAME)) !== null && _a !== void 0 ? _a : litHtml.html `<span class=${select_toggler_constants.SELECT_TOGGLER_CSS_CLASSES.selectTogglerPlaceholder}>Select</span>`}`;
             return litHtml.html ` <ul class=${select_toggler_constants.SELECT_TOGGLER_CSS_CLASSES.selectTogglerValues}>
                     ${this.isMultiselect
                 ? selectOptions.map((option) => litHtml.html ` <li>

package/build/cjs/packages/phoenix/src/components/form/select/controllers/base_select_controller.js

@@ -29,16 +29,16 @@ class BaseSelectController {
         this._optionsObserver = new observer.Observer(this._calculateValuesRelatedToOptions);
         this.options$.subscribe(this._optionsObserver);
     }
-    toggleOption(option) {
-        option.selected ? this.deselectOption(option) : this.selectOption(option);
+    toggle(option) {
+        option.selected ? this.deselect(option) : this.select(option);
     }
-    removeOption(optionValue) {
+    remove(optionValue) {
         const options = this.options$.getValue();
         if (!options)
             return;
         this.options$.notify(options.filter((option) => option.value !== optionValue));
     }
-    addOption(option, position) {
+    add(option, position) {
         var _a;
         const options = (_a = this.options$.getValue()) !== null && _a !== void 0 ? _a : [];
         if (position === undefined) {
@@ -48,22 +48,22 @@ class BaseSelectController {
         }
         this.options$.notify([...options.slice(0, position - 1), option, ...options.slice(position - 1)]);
     }
-    replaceOptions(options) {
+    replace(options) {
         this.options$.notify(options);
     }
-    deselectOptions() {
+    deselectAll() {
         var _a;
         (_a = this.options$.getValue()) === null || _a === void 0 ? void 0 : _a.forEach((option) => (option.selected = false));
         this.selectedOptions$.notify([]);
-        this.requestOptionsUpdate();
+        this.requestUpdate();
     }
-    deselectOption(option) {
+    deselect(option) {
         var _a;
         (_a = this.options$.getValue()) === null || _a === void 0 ? void 0 : _a.forEach((option) => (option.selected = false));
         this.selectedOptions$.notify([]);
-        this.requestOptionsUpdate();
+        this.requestUpdate();
     }
-    filterOptions(value) {
+    filter(value) {
         const selectOptions = this.options$.getValue();
         if (!selectOptions)
             return;
@@ -72,16 +72,16 @@ class BaseSelectController {
         filtered.forEach((option) => {
             option.hidden = false;
         });
-        this.requestOptionsUpdate();
+        this.requestUpdate();
     }
-    requestOptionsUpdate() {
+    requestUpdate() {
         const selectOptions = this.options$.getValue();
         if (!selectOptions)
             return;
         this.options$.notify([...selectOptions]);
         this.host.requestUpdate();
     }
-    getSelectOption(selectValue) {
+    getOption(selectValue) {
         var _a;
         return (_a = this.options$.getValue()) === null || _a === void 0 ? void 0 : _a.find((option) => option.value === selectValue);
     }

package/build/cjs/packages/phoenix/src/components/form/select/controllers/multi_select_controller.js

@@ -5,18 +5,18 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var base_select_controller = require('./base_select_controller.js');
 
 class MultiSelectController extends base_select_controller.BaseSelectController {
-    toggleOption(option) {
-        option.selected ? this.deselectOption(option) : this.selectOption(option);
+    toggle(option) {
+        option.selected ? this.deselect(option) : this.select(option);
     }
-    selectOption(option) {
+    select(option) {
         option.selected = true;
         this.selectedOptions$.notify((selectedOptions) => [...selectedOptions, option]);
-        this.requestOptionsUpdate();
+        this.requestUpdate();
     }
-    deselectOption(option) {
+    deselect(option) {
         option.selected = false;
         this.selectedOptions$.notify((selectedOptions) => selectedOptions.filter((currOption) => currOption.value !== option.value));
-        this.requestOptionsUpdate();
+        this.requestUpdate();
     }
 }
 

package/build/cjs/packages/phoenix/src/components/form/select/controllers/select_controller.js

@@ -5,13 +5,13 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var base_select_controller = require('./base_select_controller.js');
 
 class SelectController extends base_select_controller.BaseSelectController {
-    selectOption(option) {
+    select(option) {
         var _a;
         const selectedOptions = (_a = this.options$.getValue()) !== null && _a !== void 0 ? _a : [];
         selectedOptions.forEach((option) => (option.selected = false));
         option.selected = true;
         this.selectedOptions$.notify([option]);
-        this.requestOptionsUpdate();
+        this.requestUpdate();
     }
 }