@shoper/phoenix_design_system 0.27.1 → 0.28.0-2

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

@@ -0,0 +1,65 @@
+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 { BASE_FORM_CONTROL_PROPS } from '../controllers/props_synchronizing/control_props_sync_controller_constants.js';
+import { ControlPropsSyncProviderController } from '../controllers/props_synchronizing/control_props_sync_provider_controller.js';
+import { CHECKBOX_PROPS_TO_SYNC } from '../checkbox/checkbox_constants.js';
+import classnames from '../../../../../../external/classnames/index.js';
+import { SELECT_CONTROL_CSS_CLASSES } from './select_constants.js';
+
+let HSelect = class HSelect extends PhoenixLightLitElement {
+    constructor() {
+        super();
+        new ControlPropsSyncProviderController({
+            host: this,
+            propsToSync: [...Object.keys(BASE_FORM_CONTROL_PROPS), CHECKBOX_PROPS_TO_SYNC.checked]
+        });
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.classList.add(SELECT_CONTROL_CSS_CLASSES.select);
+        const cssClasses = classnames({
+            [SELECT_CONTROL_CSS_CLASSES.selectDisabled]: this.disabled,
+            [SELECT_CONTROL_CSS_CLASSES.selectReadonly]: this.readonly,
+            [SELECT_CONTROL_CSS_CLASSES.selectError]: this.error
+        });
+        if (cssClasses)
+            this.classList.add(cssClasses);
+    }
+};
+__decorate([
+    property({ type: String }),
+    __metadata("design:type", String)
+], HSelect.prototype, "controlId", void 0);
+__decorate([
+    property({ type: String }),
+    __metadata("design:type", String)
+], HSelect.prototype, "controlName", void 0);
+__decorate([
+    property({ type: Boolean }),
+    __metadata("design:type", Boolean)
+], HSelect.prototype, "disabled", void 0);
+__decorate([
+    property({ type: Boolean }),
+    __metadata("design:type", Boolean)
+], HSelect.prototype, "required", void 0);
+__decorate([
+    property({ type: Boolean }),
+    __metadata("design:type", Boolean)
+], HSelect.prototype, "hidden", void 0);
+__decorate([
+    property({ type: Boolean }),
+    __metadata("design:type", Boolean)
+], HSelect.prototype, "readonly", void 0);
+__decorate([
+    property({ type: Boolean }),
+    __metadata("design:type", Boolean)
+], HSelect.prototype, "error", void 0);
+HSelect = __decorate([
+    phoenixCustomElement('h-select'),
+    __metadata("design:paramtypes", [])
+], HSelect);
+
+export { HSelect };
+//# sourceMappingURL=select.js.map

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

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

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

@@ -0,0 +1,7 @@
+export declare const SELECT_CONTROL_CSS_CLASSES: {
+    readonly select: "select";
+    readonly selectError: "select_error";
+    readonly selectDisabled: "select_disabled";
+    readonly selectReadonly: "select_readonly";
+    readonly selectControl: "select__control";
+};

package/build/esm/packages/phoenix/src/components/form/select/select_constants.js

@@ -0,0 +1,11 @@
+const baseSelectControlClass = 'select';
+const SELECT_CONTROL_CSS_CLASSES = {
+    select: baseSelectControlClass,
+    selectError: `${baseSelectControlClass}_error`,
+    selectDisabled: `${baseSelectControlClass}_disabled`,
+    selectReadonly: `${baseSelectControlClass}_readonly`,
+    selectControl: `${baseSelectControlClass}__control`
+};
+
+export { SELECT_CONTROL_CSS_CLASSES };
+//# sourceMappingURL=select_constants.js.map

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

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

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

@@ -0,0 +1,8 @@
+import { HSelect } from "./select";
+import { HSelectControl } from "./control/select_control";
+declare global {
+    interface HTMLElementTagNameMap {
+        'h-select': HSelect;
+        'h-select-control': HSelectControl;
+    }
+}

package/build/esm/packages/phoenix/src/components/form/select/select_types.js

@@ -0,0 +1,3 @@
+import '@phoenixRoot/components/form/select/select';
+import '@phoenixRoot/components/form/select/control/select_control';
+//# sourceMappingURL=select_types.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"select_types.js","sourceRoot":"","sources":["../../../../../../../../src/components/form/select/select_types.ts"],"names":[],"mappings":"AAAA,OAAwB,4CAA4C,CAAC;AACrE,OAA+B,4DAA4D,CAAC"}

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

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

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

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

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

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

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

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

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

@@ -3,7 +3,7 @@ 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 classnames from '../../../external/classnames/index.js';
+import classnames from '../../../../../external/classnames/index.js';
 import { ICON_CSS_CLASSES, ICON_SIZES_CSS_CLASS_MAP } from './icon_constants.js';
 import { namespacedAttribute } from '../../directives/namespaced_attribure_directive.js';
 

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

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA,uBAAuB,uCAA2C;AAClE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,uBAAuB,6CAAiD;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;"}

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

@@ -2,9 +2,9 @@ import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.
 import { property } from 'lit/decorators';
 import { UiDomUtils } from '@dreamcommerce/utilities';
 import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
-import { PORTAL_TARGET_COMPONENT_NAME, PORTAL_TARGET_NAME_PROP, PORTAL_TARGET_ATTRIBUTE_NAME } from '../portal/portal_constants.js';
 import { KeystrokesController } from '../../controllers/keystrokes_controller/keystrokes_controller.js';
 import { DIRECTIONS } from '../../controllers/relative_position_controller/relative_position_controller_constants.js';
+import { PORTAL_TARGET_COMPONENT_NAME, PORTAL_TARGET_NAME_PROP, PORTAL_TARGET_ATTRIBUTE_NAME } from '../portal/portal_constants.js';
 import { ClickOutsideController } from '../../controllers/click_outside_controller/click_outside_controller.js';
 import { RelativePositionController } from '../../controllers/relative_position_controller/relative_position_controller.js';
 import { DEFAULT_MESSAGE_PORTAL_NAME, DEFAULT_MESSAGE_OFFSET, MESSAGE_SHOW_DELAY_IN_MS, MESSAGE_TIME_TO_DELAY_CLOSING_IN_MS, MESSAGE_REMOVED_CLASS_NAME, MESSAGE_CLOSE_DELAY_IN_MS, MESSAGE_CONTENT_ELEMENTS, MESSAGE_ELEMENTS } from './base_message_constants.js';

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

@@ -1,13 +1,13 @@
 import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.js';
 import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
 import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
-import { PORTAL_TARGET_NAME_PROP } from '../portal/portal_constants.js';
-import { MODAL_OPENED_PROP, FOCUSABLE_ELEMENTS_WITHIN_MODAL, MODALS_PORTAL_NAME, MODAL_EVENTS } from './modal_constants.js';
-import { html } from 'lit-html';
-import { BackdropController } from '../backdrop/controller/backdrop_controller.js';
 import { property, state } from '@lit/reactive-element/decorators.js';
+import { html } from 'lit-html';
 import { createRef, ref } from 'lit-html/directives/ref.js';
+import { PORTAL_TARGET_NAME_PROP } from '../portal/portal_constants.js';
+import { BackdropController } from '../backdrop/controller/backdrop_controller.js';
 import '@lit/reactive-element';
+import { MODAL_OPENED_PROP, FOCUSABLE_ELEMENTS_WITHIN_MODAL, MODALS_PORTAL_NAME, MODAL_EVENTS } from './modal_constants.js';
 
 var HModal_1;
 let HModal = HModal_1 = class HModal extends PhoenixLightLitElement {

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

@@ -3,8 +3,8 @@ import 'lit';
 import { state, 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 { PORTAL_EVENTS } from './portal_constants.js';
 import v4 from '../../../../../external/uuid/dist/esm-browser/v4.js';
+import { PORTAL_EVENTS } from './portal_constants.js';
 
 let HPortal = class HPortal extends PhoenixLightLitElement {
     constructor() {

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

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

package/build/esm/packages/phoenix/src/components/portal/portal_target.js

@@ -1,8 +1,8 @@
 import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.js';
 import { property, state } from 'lit/decorators';
 import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
-import { PortalTargetError } from './portal_target_error.js';
 import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
+import { PortalTargetError } from './portal_target_error.js';
 import { PORTAL_EVENTS, PORTAL_TARGET_NAME_PROP } from './portal_constants.js';
 
 var HPortalTarget_1;

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

@@ -2,7 +2,7 @@ import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.
 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.js';
+import { BtnController } from '../../controllers/btn_controller/btn_controller.js';
 
 let HScrollTo = class HScrollTo extends PhoenixLightLitElement {
     constructor() {

package/build/esm/packages/phoenix/src/components/tabs/tab/tab.js

@@ -3,7 +3,7 @@ import { property } from 'lit/decorators';
 import { UiDomUtils } from '@dreamcommerce/utilities';
 import { PhoenixLightLitElement } from '../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
 import { phoenixCustomElement } from '../../../core/decorators/phoenix_custom_element.js';
-import { BtnController } from '../../../controllers/btn_controller.js';
+import { BtnController } from '../../../controllers/btn_controller/btn_controller.js';
 import { TAB_EVENT_NAMES, TAB_SELECTED_ATTRIBUTE_NAME } from './tab_constants.js';
 
 let HTab = class HTab extends PhoenixLightLitElement {

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

@@ -2,7 +2,7 @@ import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.
 import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
 import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
 import { property } from '@lit/reactive-element/decorators.js';
-import { BtnController } from '../../controllers/btn_controller.js';
+import { BtnController } from '../../controllers/btn_controller/btn_controller.js';
 import { TAG_EVENT_NAMES, TAG_CSS_CLASSES } from './tag_constants.js';
 
 let HTag = class HTag extends PhoenixLightLitElement {
@@ -10,7 +10,8 @@ let HTag = class HTag extends PhoenixLightLitElement {
         super(...arguments);
         this.clickable = false;
         this.removable = false;
-        this._handleClick = () => {
+        this._handleClick = (event) => {
+            event.stopPropagation();
             /**
              * TODO do zrobienia in fiuczer, jak jest tag klikalny i mamy remove, to klik remove działa na button remove
              * a nie na cały tag

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

package/build/esm/packages/phoenix/src/controllers/{btn_controller.d.ts → btn_controller/btn_controller.d.ts}

@@ -1,8 +1,9 @@
 import { ReactiveController, ReactiveControllerHost } from 'lit';
+import { TBtnControllerOption } from "./btn_controller_types";
 export declare class BtnController implements ReactiveController {
     host: ReactiveControllerHost & HTMLElement;
     private _keystrokesController;
-    constructor(host: ReactiveControllerHost & HTMLElement, callback: (ev: Event) => void);
+    constructor(host: ReactiveControllerHost & HTMLElement, callback: (ev: Event) => void, { isNavigable }?: TBtnControllerOption);
     hostConnected(): void;
     hostDisconnected(): void;
 }

package/build/esm/packages/phoenix/src/controllers/{btn_controller.js → btn_controller/btn_controller.js}

@@ -1,10 +1,11 @@
 import 'lit';
-import { KeystrokesController } from './keystrokes_controller/keystrokes_controller.js';
+import { UiDomUtils } from '@dreamcommerce/utilities';
+import { KeystrokesController } from '../keystrokes_controller/keystrokes_controller.js';
 
 class BtnController {
-    constructor(host, callback) {
+    constructor(host, callback, { isNavigable = true } = {}) {
         (this.host = host).addController(this);
-        this.host.tabIndex = 0;
+        isNavigable ? UiDomUtils.makeNavigable(this.host) : UiDomUtils.makeUnnavigable(this.host);
         this.host.setAttribute('role', 'button');
         this._keystrokesController = new KeystrokesController({
             host,

package/build/{cjs/packages/phoenix/src/controllers → esm/packages/phoenix/src/controllers/btn_controller}/btn_controller.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;"}
+{"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;"}

package/build/esm/packages/phoenix/src/controllers/btn_controller/btn_controller_types.d.ts

@@ -0,0 +1,3 @@
+export declare type TBtnControllerOption = {
+    isNavigable?: boolean;
+};

package/build/esm/packages/phoenix/src/controllers/btn_controller/btn_controller_types.js

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

package/build/esm/packages/phoenix/src/controllers/btn_controller/btn_controller_types.js.map

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

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

@@ -72,16 +72,16 @@ class KeystrokesController {
         this._keys = keys;
         this._callback = callback;
         __classPrivateFieldGet(this, _KeystrokesController_host, "f").addController(this);
-        __classPrivateFieldGet(this, _KeystrokesController_target, "f").addEventListener('keydown', this._saveKey);
-        __classPrivateFieldGet(this, _KeystrokesController_target, "f").addEventListener('keyup', this._removeKey);
     }
     hostConnected() {
         __classPrivateFieldGet(this, _KeystrokesController_host, "f").addEventListener('focusout', this._clearBuffer);
+        __classPrivateFieldGet(this, _KeystrokesController_target, "f").addEventListener('keydown', this._saveKey);
+        __classPrivateFieldGet(this, _KeystrokesController_target, "f").addEventListener('keyup', this._removeKey);
     }
     hostDisconnected() {
         __classPrivateFieldGet(this, _KeystrokesController_host, "f").removeEventListener('focusout', this._clearBuffer);
-        __classPrivateFieldGet(this, _KeystrokesController_target, "f").addEventListener('keydown', this._saveKey);
-        __classPrivateFieldGet(this, _KeystrokesController_target, "f").addEventListener('keyup', this._removeKey);
+        __classPrivateFieldGet(this, _KeystrokesController_target, "f").removeEventListener('keydown', this._saveKey);
+        __classPrivateFieldGet(this, _KeystrokesController_target, "f").removeEventListener('keyup', this._removeKey);
     }
 }
 _KeystrokesController_host = new WeakMap(), _KeystrokesController_target = new WeakMap();

package/build/esm/packages/phoenix/src/controllers/list_box_controller/list_box_controller_constants.d.ts

@@ -0,0 +1,4 @@
+export declare const LIST_BOX_KEYBOARD_NAVIGATION_DIRECTIONS: {
+    readonly horizontal: "horizontal";
+    readonly vertical: "vertical";
+};

package/build/esm/packages/phoenix/src/controllers/list_box_controller/list_box_controller_constants.js

@@ -0,0 +1,7 @@
+const LIST_BOX_KEYBOARD_NAVIGATION_DIRECTIONS = {
+    horizontal: 'horizontal',
+    vertical: 'vertical'
+};
+
+export { LIST_BOX_KEYBOARD_NAVIGATION_DIRECTIONS };
+//# sourceMappingURL=list_box_controller_constants.js.map

package/build/esm/packages/phoenix/src/controllers/list_box_controller/list_box_controller_constants.js.map

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

package/build/esm/packages/phoenix/src/controllers/list_box_controller/list_box_controller_types.d.ts

@@ -0,0 +1,10 @@
+import { Any } from 'ts-toolbelt';
+import { ReactiveControllerHost } from 'lit';
+import { LIST_BOX_KEYBOARD_NAVIGATION_DIRECTIONS } from "./list_box_controller_constants";
+export declare type TListBoxKeyboardNavigationDirection = Any.Keys<typeof LIST_BOX_KEYBOARD_NAVIGATION_DIRECTIONS>;
+export declare type TListBoxKeyboardControllerConstructorOptions = {
+    host: ReactiveControllerHost & HTMLElement;
+    $list: HTMLElement;
+    listItemSelector?: string;
+    orientation?: TListBoxKeyboardNavigationDirection;
+};

package/build/esm/packages/phoenix/src/controllers/list_box_controller/list_box_controller_types.js

@@ -0,0 +1,4 @@
+import 'ts-toolbelt';
+import 'lit';
+import '@phoenixRoot/controllers/list_box_controller/list_box_controller_constants';
+//# sourceMappingURL=list_box_controller_types.js.map

package/build/esm/packages/phoenix/src/controllers/list_box_controller/list_box_controller_types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"list_box_controller_types.js","sourceRoot":"","sources":["../../../../../../../src/controllers/list_box_controller/list_box_controller_types.ts"],"names":[],"mappings":"AAAA,OAAoB,aAAa,CAAC;AAClC,OAAuC,KAAK,CAAC;AAC7C,OAAwD,4EAA4E,CAAC"}

package/build/esm/packages/phoenix/src/controllers/list_box_controller/list_box_keyboard_controller.d.ts

@@ -0,0 +1,10 @@
+import { ReactiveController } from 'lit';
+import { TListBoxKeyboardControllerConstructorOptions } from "./list_box_controller_types";
+export declare class ListBoxKeyboardController implements ReactiveController {
+    #private;
+    constructor({ host, $list, listItemSelector, orientation }: TListBoxKeyboardControllerConstructorOptions);
+    hostConnected(): void;
+    private _handleArrowNavigation;
+    private _getPrevOptionIndex;
+    private _getNextOptionIndex;
+}

package/build/esm/packages/phoenix/src/controllers/list_box_controller/list_box_keyboard_controller.js

@@ -0,0 +1,80 @@
+import { __classPrivateFieldGet, __classPrivateFieldSet } from '../../../../../external/tslib/tslib.es6.js';
+import 'lit';
+import { UiDomUtils } from '@dreamcommerce/utilities';
+import { KeystrokesController } from '../keystrokes_controller/keystrokes_controller.js';
+import { LIST_BOX_KEYBOARD_NAVIGATION_DIRECTIONS } from './list_box_controller_constants.js';
+
+var _ListBoxKeyboardController_host, _ListBoxKeyboardController__$list, _ListBoxKeyboardController_currentOptionIndex, _ListBoxKeyboardController__$options, _ListBoxKeyboardController_listItemSelector, _ListBoxKeyboardController_keys;
+class ListBoxKeyboardController {
+    constructor({ host, $list, listItemSelector = '[role="option"]', orientation = LIST_BOX_KEYBOARD_NAVIGATION_DIRECTIONS.vertical }) {
+        _ListBoxKeyboardController_host.set(this, void 0);
+        _ListBoxKeyboardController__$list.set(this, void 0);
+        _ListBoxKeyboardController_currentOptionIndex.set(this, void 0);
+        _ListBoxKeyboardController__$options.set(this, void 0);
+        _ListBoxKeyboardController_listItemSelector.set(this, void 0);
+        _ListBoxKeyboardController_keys.set(this, void 0);
+        this._handleArrowNavigation = (event) => {
+            event.preventDefault();
+            const { key } = event;
+            const prevOptionIndex = __classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f");
+            let newOptionIndex = key === 'ArrowDown' || key === 'ArrowRight' ? this._getNextOptionIndex() : this._getPrevOptionIndex();
+            if (newOptionIndex === undefined) {
+                const selectedOptionIndex = __classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").findIndex(($option) => $option.selected);
+                newOptionIndex = selectedOptionIndex !== -1 ? selectedOptionIndex : 0;
+            }
+            if (newOptionIndex === __classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f"))
+                return;
+            if (prevOptionIndex !== undefined) {
+                const $prevOption = __classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f")[prevOptionIndex];
+                UiDomUtils.makeUnnavigable($prevOption);
+            }
+            __classPrivateFieldSet(this, _ListBoxKeyboardController_currentOptionIndex, newOptionIndex, "f");
+            const $focusedOption = __classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f")[newOptionIndex];
+            UiDomUtils.makeNavigable($focusedOption);
+            $focusedOption.focus();
+        };
+        __classPrivateFieldSet(this, _ListBoxKeyboardController_host, host, "f");
+        __classPrivateFieldSet(this, _ListBoxKeyboardController__$list, $list, "f");
+        __classPrivateFieldSet(this, _ListBoxKeyboardController_listItemSelector, listItemSelector, "f");
+        __classPrivateFieldSet(this, _ListBoxKeyboardController_keys, orientation === LIST_BOX_KEYBOARD_NAVIGATION_DIRECTIONS.vertical ? ['ArrowUp', 'ArrowDown'] : ['ArrowLeft', 'ArrowRight'], "f");
+        __classPrivateFieldSet(this, _ListBoxKeyboardController__$options, Array.from($list.querySelectorAll(__classPrivateFieldGet(this, _ListBoxKeyboardController_listItemSelector, "f"))), "f");
+        __classPrivateFieldGet(this, _ListBoxKeyboardController_host, "f").addController(this);
+    }
+    hostConnected() {
+        new KeystrokesController({
+            host: __classPrivateFieldGet(this, _ListBoxKeyboardController_host, "f"),
+            keys: __classPrivateFieldGet(this, _ListBoxKeyboardController_keys, "f"),
+            callback: this._handleArrowNavigation,
+            target: __classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f")
+        });
+        UiDomUtils.makeNavigable(__classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f"));
+        __classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f").addEventListener('focusin', (event) => {
+            if (event.target !== __classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f"))
+                return;
+            if (__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") === undefined)
+                return;
+            const $prevOption = __classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f")[__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f")];
+            UiDomUtils.makeUnnavigable($prevOption);
+            __classPrivateFieldSet(this, _ListBoxKeyboardController_currentOptionIndex, undefined, "f");
+        });
+        __classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").forEach(($option) => UiDomUtils.makeUnnavigable($option));
+    }
+    _getPrevOptionIndex() {
+        if (__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") === undefined)
+            return undefined;
+        if (__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") <= 0)
+            return __classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f");
+        return __classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") - 1;
+    }
+    _getNextOptionIndex() {
+        if (__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") === undefined)
+            return undefined;
+        if (__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") >= __classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").length - 1)
+            return __classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f");
+        return __classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") + 1;
+    }
+}
+_ListBoxKeyboardController_host = new WeakMap(), _ListBoxKeyboardController__$list = new WeakMap(), _ListBoxKeyboardController_currentOptionIndex = new WeakMap(), _ListBoxKeyboardController__$options = new WeakMap(), _ListBoxKeyboardController_listItemSelector = new WeakMap(), _ListBoxKeyboardController_keys = new WeakMap();
+
+export { ListBoxKeyboardController };
+//# sourceMappingURL=list_box_keyboard_controller.js.map

package/build/esm/packages/phoenix/src/controllers/list_box_controller/list_box_keyboard_controller.js.map

@@ -0,0 +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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/classes/behavior_subject/behavior_subject.d.ts

@@ -1,8 +1,6 @@
 import { Observer } from "../observer/observer";
 import { Subject } from "../subject/subject";
 export declare class BehaviorSubject<T> extends Subject<T> {
-    private _currentValue?;
     constructor(initialValue?: T);
     subscribe(observer: Observer<T>): void;
-    notify(data: T): void;
 }

package/build/esm/packages/phoenix/src/core/classes/behavior_subject/behavior_subject.js

@@ -3,16 +3,11 @@ import { Subject } from '../subject/subject.js';
 class BehaviorSubject extends Subject {
     constructor(initialValue) {
         super(initialValue);
-        this._currentValue = initialValue;
     }
     subscribe(observer) {
         this.observers.add(observer);
-        if (this._currentValue !== undefined)
-            observer.update(this._currentValue);
-    }
-    notify(data) {
-        this._currentValue = data;
-        this.observers.forEach((observer) => observer.update(data));
+        if (this.currentValue !== undefined)
+            observer.update(this.currentValue);
     }
 }
 

package/build/esm/packages/phoenix/src/core/classes/behavior_subject/behavior_subject.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;"}
+{"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/esm/packages/phoenix/src/core/classes/subject/subject.d.ts

@@ -1,11 +1,13 @@
 import { Observer } from '../observer/observer';
-import { ISubject } from "./subject_types";
+import { ISubject, TSetData } from "./subject_types";
 export declare class Subject<T> implements ISubject<T> {
     protected observers: Set<Observer<T>>;
     protected initialValue?: T;
+    protected currentValue?: T;
     constructor(initialValue?: T);
     get size(): number;
+    getValue(): T | undefined;
     subscribe(observer: Observer<T>): void;
     unsubscribe(observer: Observer<T>): void;
-    notify(data: T): void;
+    notify(data: T | TSetData<T>): void;
 }

package/build/esm/packages/phoenix/src/core/classes/subject/subject.js

@@ -2,10 +2,15 @@ class Subject {
     constructor(initialValue) {
         this.observers = new Set();
         this.initialValue = initialValue;
+        this.currentValue = initialValue;
     }
     get size() {
         return this.observers.size;
     }
+    getValue() {
+        var _a;
+        return (_a = this.currentValue) !== null && _a !== void 0 ? _a : this.initialValue;
+    }
     subscribe(observer) {
         this.observers.add(observer);
         if (this.initialValue !== undefined)
@@ -15,7 +20,9 @@ class Subject {
         this.observers.delete(observer);
     }
     notify(data) {
-        this.observers.forEach((observer) => observer.update(data));
+        const newValue = typeof data === 'function' ? data(this.currentValue) : data;
+        this.currentValue = newValue;
+        this.observers.forEach((observer) => observer.update(newValue));
     }
 }
 

package/build/esm/packages/phoenix/src/core/classes/subject/subject.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;"}
+{"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;"}

package/build/esm/packages/phoenix/src/core/classes/subject/subject_types.d.ts

@@ -2,5 +2,6 @@ import { IObserver } from "../observer/observer_types";
 export interface ISubject<T> {
     subscribe(observer: IObserver<T>): void;
     unsubscribe(observer: IObserver<T>): void;
-    notify(data: T): void;
+    notify(data: T | TSetData<T>): void;
 }
+export declare type TSetData<T> = (data: T | undefined) => T;

package/build/esm/packages/phoenix/src/core/context/context_consumer_controller.js

@@ -1,7 +1,7 @@
 import { __classPrivateFieldSet, __classPrivateFieldGet } from '../../../../../external/tslib/tslib.es6.js';
 import 'lit';
-import { WEB_COMPONENT_CONTEXT_EVENTS } from './context_consumer_messages_names.js';
 import { CONTEXT_ASYNC_CONSUMER_DEFAULT_INTERVAL_RATE, CONTEXT_ASYNC_CONSUMER_DFAULT_MAX_WAITING_TIME } from './context_constants.js';
+import { WEB_COMPONENT_CONTEXT_EVENTS } from './context_consumer_messages_names.js';
 
 var _ContextConsumerController_host, _ContextConsumerController_asyncConsumerSentinelId, _ContextConsumerController_asyncConsumerIntervalId;
 class ContextConsumerController {