@shoper/phoenix_design_system 1.2.0-6 → 1.2.1

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

@@ -0,0 +1,11 @@
+import { IToggle } from './toggle_types';
+import { PhoenixLightLitElement } from "../../core/phoenix_light_lit_element/phoenix_light_lit_element";
+export declare class HToggle extends PhoenixLightLitElement implements IToggle {
+    opened: boolean;
+    private _toggleContext;
+    private _reactiveOpened;
+    private _$content;
+    connectedCallback(): void;
+    toggle(): void;
+    render(): import("lit-html").TemplateResult<1>;
+}

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

@@ -0,0 +1,41 @@
+import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.js';
+import { html, nothing } from 'lit';
+import { property } from 'lit/decorators';
+import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
+import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
+import { BehaviorSubject } from '../../core/classes/behavior_subject/behavior_subject.js';
+import { ContextProviderController } from '../../core/context/context_provider_controller.js';
+import { templateContent as o } from '../../../../../external/lit/external/lit-html/directives/template-content.js';
+import { TOGGLE_CONTEXT_NAME, TOGGLE_EVENT_NAME } from './toggle_constants.js';
+
+let HToggle = class HToggle extends PhoenixLightLitElement {
+    constructor() {
+        super(...arguments);
+        this.opened = false;
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this._reactiveOpened = new BehaviorSubject(this.opened);
+        this._toggleContext = new ContextProviderController(this);
+        this._$content = this.querySelector('template');
+        this._toggleContext.provide(TOGGLE_CONTEXT_NAME, this._reactiveOpened);
+        this.addEventListener(TOGGLE_EVENT_NAME, this.toggle);
+    }
+    toggle() {
+        this.opened = !this.opened;
+        this._reactiveOpened.notify(this.opened);
+    }
+    render() {
+        return html `${this.opened && this._$content ? o(this._$content) : nothing}`;
+    }
+};
+__decorate([
+    property({ type: Boolean, reflect: true }),
+    __metadata("design:type", Object)
+], HToggle.prototype, "opened", void 0);
+HToggle = __decorate([
+    phoenixCustomElement('h-toggle')
+], HToggle);
+
+export { HToggle };
+//# sourceMappingURL=toggle.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA,qCAAqC,8EAAsF;AAC3H;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/toggle/toggle_button.d.ts

@@ -0,0 +1,14 @@
+import { PhoenixLightLitElement } from "../../core/phoenix_light_lit_element/phoenix_light_lit_element";
+export declare class HToggleBtn extends PhoenixLightLitElement {
+    private _toggleContextConsumer;
+    private _btnController;
+    private _visibilityController;
+    private _opened$;
+    private _openedObserver;
+    action: "collapse";
+    private _visibility;
+    constructor();
+    connectedCallback(): Promise<void>;
+    disconnectedCallback(): void;
+    private _dispatchToggleEvent;
+}

package/build/esm/packages/phoenix/src/components/toggle/toggle_button.js

@@ -0,0 +1,55 @@
+import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.js';
+import { property } from 'lit/decorators';
+import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
+import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
+import { BtnController } from '../../controllers/btn_controller/btn_controller.js';
+import { Observer } from '../../core/classes/observer/observer.js';
+import { ContextConsumerController } from '../../core/context/context_consumer_controller.js';
+import { VisibilityController } from '../../controllers/visibility_controller/visibility_controller.js';
+import { TOGGLE_ACTIONS, TOGGLE_EVENT_NAME, TOGGLE_CONTEXT_NAME } from './toggle_constants.js';
+
+let HToggleBtn = class HToggleBtn extends PhoenixLightLitElement {
+    constructor() {
+        super();
+        this.action = TOGGLE_ACTIONS.collapse;
+        this._visibility = {
+            collapse: (isOpened) => {
+                isOpened ? this._visibilityController.show() : this._visibilityController.hide();
+            },
+            expand: (isOpened) => {
+                isOpened ? this._visibilityController.hide() : this._visibilityController.show();
+            }
+        };
+        this._dispatchToggleEvent = () => {
+            this.dispatchEvent(new CustomEvent(TOGGLE_EVENT_NAME, {
+                bubbles: true
+            }));
+        };
+        this._btnController = new BtnController(this, this._dispatchToggleEvent);
+        this._visibilityController = new VisibilityController(this);
+    }
+    async connectedCallback() {
+        super.connectedCallback();
+        this._toggleContextConsumer = new ContextConsumerController(this);
+        this._opened$ = await this._toggleContextConsumer.consumeAsync(TOGGLE_CONTEXT_NAME);
+        this._openedObserver = new Observer((isOpened) => {
+            this._visibility[this.action](isOpened);
+        });
+        this._opened$.subscribe(this._openedObserver);
+        this.addEventListener('click', this._dispatchToggleEvent);
+    }
+    disconnectedCallback() {
+        this._opened$.unsubscribe(this._openedObserver);
+    }
+};
+__decorate([
+    property({ type: String }),
+    __metadata("design:type", Object)
+], HToggleBtn.prototype, "action", void 0);
+HToggleBtn = __decorate([
+    phoenixCustomElement('h-toggle-btn'),
+    __metadata("design:paramtypes", [])
+], HToggleBtn);
+
+export { HToggleBtn };
+//# sourceMappingURL=toggle_button.js.map

package/build/esm/packages/phoenix/src/components/{form/input_stepper/display_input.js.map → toggle/toggle_button.js.map}

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;"}

package/build/esm/packages/phoenix/src/components/toggle/toggle_constants.d.ts

@@ -0,0 +1,6 @@
+export declare const TOGGLE_ACTIONS: {
+    readonly expand: "expand";
+    readonly collapse: "collapse";
+};
+export declare const TOGGLE_CONTEXT_NAME = "opened";
+export declare const TOGGLE_EVENT_NAME = "toggle";

package/build/esm/packages/phoenix/src/components/toggle/toggle_constants.js

@@ -0,0 +1,9 @@
+const TOGGLE_ACTIONS = {
+    expand: 'expand',
+    collapse: 'collapse'
+};
+const TOGGLE_CONTEXT_NAME = 'opened';
+const TOGGLE_EVENT_NAME = 'toggle';
+
+export { TOGGLE_ACTIONS, TOGGLE_CONTEXT_NAME, TOGGLE_EVENT_NAME };
+//# sourceMappingURL=toggle_constants.js.map

package/build/esm/packages/phoenix/src/components/toggle/toggle_constants.js.map

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

package/build/esm/packages/phoenix/src/components/toggle/toggle_types.d.ts

@@ -0,0 +1,3 @@
+export interface IToggle {
+    toggle(): void;
+}

package/build/esm/packages/phoenix/src/components/toggle/toggle_types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=toggle_types.js.map

package/build/esm/packages/phoenix/src/components/toggle/toggle_types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toggle_types.js","sourceRoot":"","sources":["../../../../../../../src/components/toggle/toggle_types.ts"],"names":[],"mappings":""}

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

@@ -32,10 +32,14 @@ class ClickOutsideController {
         __classPrivateFieldSet(this, _ClickOutsideController_enabled, false, "f");
     }
     _setupClickEventListener() {
-        document.addEventListener('click', this._dispatchClickedOutsideEvent);
+        document.addEventListener('click', this._dispatchClickedOutsideEvent, {
+            capture: true
+        });
     }
     _removeClickEventListener() {
-        document.removeEventListener('click', this._dispatchClickedOutsideEvent);
+        document.removeEventListener('click', this._dispatchClickedOutsideEvent, {
+            capture: true
+        });
     }
     hostDisconnected() {
         this._removeClickEventListener();

package/build/esm/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,+DAA+D,4CAAgD;AAC/G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,+DAA+D,4CAAgD;AAC/G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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.d.ts

@@ -11,6 +11,7 @@ export declare class PhoenixLightLitElement extends LitElement {
     firstUpdated(props: PropertyValues): void;
     private _setupChildrenConnectedWatch;
     private _setupChildrenRenderWatch;
+    private _getComponentsChildrenToWatch;
     private _getComponentsNamesForConnectionToWatch;
     private _getComponentsNamesForRenderedToWatch;
     private _handleComponentConnected;

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

@@ -54,7 +54,9 @@ class PhoenixLightLitElement extends LitElement {
         this.isWebComponentRendered = true;
     }
     _setupChildrenConnectedWatch() {
-        this._childrenForConnectionToWatch = this.childrenToWatch ? this.childrenToWatch : this._getComponentsNamesForConnectionToWatch();
+        this._childrenForConnectionToWatch = this.childrenToWatch
+            ? this._getComponentsChildrenToWatch()
+            : this._getComponentsNamesForConnectionToWatch();
         if (!this._childrenForConnectionToWatch.length) {
             this.allChildrenConnected();
             return;
@@ -62,13 +64,24 @@ class PhoenixLightLitElement extends LitElement {
         this.addEventListener(PHOENIX_LIGHT_LIT_ELEMENTS_EVENT_NAMES.connected, this._handleComponentConnected);
     }
     _setupChildrenRenderWatch() {
-        this._childrenForRenderToWatch = this.childrenToWatch ? this.childrenToWatch : this._getComponentsNamesForRenderedToWatch();
+        this._childrenForRenderToWatch = this.childrenToWatch
+            ? this._getComponentsChildrenToWatch()
+            : this._getComponentsNamesForRenderedToWatch();
         if (!this._childrenForRenderToWatch.length) {
             this.allChildrenRendered();
             return;
         }
         this.addEventListener(PHOENIX_LIGHT_LIT_ELEMENTS_EVENT_NAMES.rendered, this._handleComponentRendered);
     }
+    _getComponentsChildrenToWatch() {
+        const childrenToWatch = [];
+        this.childrenToWatch.forEach((elementName) => {
+            return [...this.querySelectorAll(elementName)].forEach(($element) => {
+                childrenToWatch.push($element.tagName.toLowerCase());
+            });
+        });
+        return childrenToWatch;
+    }
     _getComponentsNamesForConnectionToWatch() {
         return PhoenixLightLitElementUtils.getComponentsForWhichToWaitForConnection([...this.querySelectorAll('*')]).map(($element) => $element.tagName.toLowerCase());
     }
@@ -77,8 +90,8 @@ class PhoenixLightLitElement extends LitElement {
     }
     connectedCallback() {
         super.connectedCallback();
-        this._dispatchLifecycleEvent(PHOENIX_LIGHT_LIT_ELEMENTS_EVENT_NAMES.connected);
         this.isWebComponentConnected = true;
+        this._dispatchLifecycleEvent(PHOENIX_LIGHT_LIT_ELEMENTS_EVENT_NAMES.connected);
         if (this.watchChildrenConnected)
             this._setupChildrenConnectedWatch();
         if (this.watchChildrenRendered)

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,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;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/index.d.ts

@@ -91,6 +91,7 @@ export { HTooltipContent } from "./components/messages/tooltips/tooltip_content"
 export { HIcon } from "./components/icon/icon";
 export { HTag } from "./components/tag/tag";
 export { HTagRemoveButton } from "./components/tag/tag_remove_button";
-export { HInputStepper } from './components/form/input_stepper/input_stepper';
-export { HDisplayInput } from './components/form/input_stepper/display_input';
-export { HStepperActionButton } from './components/form/input_stepper/stepper_action_button';
+export { HToggle } from './components/toggle/toggle';
+export { HToggleBtn } from './components/toggle/toggle_button';
+export * from './components/toggle/toggle_types';
+export * from './components/toggle/toggle_constants';

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

@@ -79,7 +79,7 @@ export { HTooltip } from './components/messages/tooltips/tooltip.js';
 export { HTooltipContent } from './components/messages/tooltips/tooltip_content.js';
 export { HTag } from './components/tag/tag.js';
 export { HTagRemoveButton } from './components/tag/tag_remove_button.js';
-export { HStepperActionButton } from './components/form/input_stepper/stepper_action_button.js';
-export { HInputStepper } from './components/form/input_stepper/input_stepper.js';
-export { HDisplayInput } from './components/form/input_stepper/display_input.js';
+export { TOGGLE_ACTIONS, TOGGLE_CONTEXT_NAME, TOGGLE_EVENT_NAME } from './components/toggle/toggle_constants.js';
+export { HToggle } from './components/toggle/toggle.js';
+export { HToggleBtn } from './components/toggle/toggle_button.js';
 //# sourceMappingURL=index.js.map

package/package.json

@@ -2,7 +2,7 @@
   "name": "@shoper/phoenix_design_system",
   "packageManager": "yarn@3.2.0",
   "sideEffects": false,
-  "version": "1.2.0-6",
+  "version": "1.2.1",
   "description": "phoenix design system",
   "author": "zefirek",
   "license": "MIT",
@@ -30,7 +30,7 @@
     "@splidejs/splide": "^4.0.7"
   },
   "devDependencies": {
-    "@dreamcommerce/utilities": "^1.2.0",
+    "@dreamcommerce/utilities": "^1.2.2",
     "@shoper/jest_config": "^0.0.0",
     "@shoper/tsconfig": "^0.0.0",
     "@splidejs/splide": "4.0.7",

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

@@ -1,53 +0,0 @@
-'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
-            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/input_stepper/input_stepper.js

@@ -1,96 +0,0 @@
-'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/input_stepper/input_stepper.js.map

@@ -1 +0,0 @@
-{"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

@@ -1,20 +0,0 @@
-'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'
-};
-
-exports.DISPLAY_INPUT_EVENT_NAMES = DISPLAY_INPUT_EVENT_NAMES;
-exports.INPUT_STEPPER_ACTION_TYPES = INPUT_STEPPER_ACTION_TYPES;
-exports.INPUT_STEPPER_EVENT_NAMES = INPUT_STEPPER_EVENT_NAMES;
-//# sourceMappingURL=input_stepper_constants.js.map

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

@@ -1,39 +0,0 @@
-'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

@@ -1 +0,0 @@
-{"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/esm/packages/phoenix/src/components/form/input_stepper/display_input.d.ts

@@ -1,9 +0,0 @@
-import { PhoenixLightLitElement } from "../../../core/phoenix_light_lit_element/phoenix_light_lit_element";
-import { Ref } from 'lit/directives/ref.js';
-export declare class HDisplayInput extends PhoenixLightLitElement {
-    value: string;
-    inputRef: Ref<HTMLInputElement>;
-    private _setInputBehavior;
-    private _testDispatchValueChanged;
-    render(): import("lit-html").TemplateResult<1>;
-}

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

@@ -1,51 +0,0 @@
-import { __decorate, __metadata } from '../../../../../../external/tslib/tslib.es6.js';
-import { html } from 'lit';
-import { property } from 'lit/decorators';
-import { PhoenixLightLitElement } from '../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
-import { phoenixCustomElement } from '../../../core/decorators/phoenix_custom_element.js';
-import { createRef, ref } from 'lit-html/directives/ref.js';
-import { DISPLAY_INPUT_EVENT_NAMES } from './input_stepper_constants.js';
-
-let HDisplayInput = class HDisplayInput extends PhoenixLightLitElement {
-    constructor() {
-        super(...arguments);
-        this.inputRef = createRef();
-        this._testDispatchValueChanged = () => {
-            var _a;
-            const valueChangeEvent = new CustomEvent(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 html `<input
-            type="text"
-            ${ref(this.inputRef)}
-            .value="${this.value}"
-            @input=${this._testDispatchValueChanged}
-            @click=${(event) => this._setInputBehavior(event)}
-        />`;
-    }
-};
-__decorate([
-    property({ type: String, attribute: 'value', reflect: true }),
-    __metadata("design:type", String)
-], HDisplayInput.prototype, "value", void 0);
-HDisplayInput = __decorate([
-    phoenixCustomElement('h-display-input')
-], HDisplayInput);
-
-export { HDisplayInput };
-//# sourceMappingURL=display_input.js.map

package/build/esm/packages/phoenix/src/components/form/input_stepper/input_stepper.d.ts

@@ -1,19 +0,0 @@
-import { PhoenixLightLitElement } from "../../../core/phoenix_light_lit_element/phoenix_light_lit_element";
-import { PropertyValues } from 'lit';
-export declare class HInputStepper extends PhoenixLightLitElement {
-    step: number;
-    min: number;
-    max: number;
-    private _value;
-    private _$inputElement;
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    protected updated(changedProperties: PropertyValues): void;
-    private _setupEvents;
-    private _handleInputChange;
-    private _handleDisplayChange;
-    private _handleUpdateValue;
-    private _increment;
-    private _decrement;
-    private _dispatchValueChanged;
-}