@shoper/phoenix_design_system 1.9.0-7 → 1.10.0

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

@@ -23,7 +23,7 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
     constructor() {
         super();
         this.opened = false;
-        this.direction = utilities.DIRECTIONS.bottomCenter;
+        this.direction = relative_position_controller_constants.DIRECTIONS.bottomCenter;
         this.toggleOnHover = false;
         this.name = '';
         this.transition = 'direction';

package/build/cjs/packages/phoenix/src/components/form/select/model/select_option_mapper.js

@@ -7,19 +7,19 @@ var select_option = require('./select_option.js');
 
 class SelectOptionMapper {
     static toModel($option) {
-        const $optionContent = $option.querySelector(select_components_constatns.SELECT_RELATED_COMPONENTS_NAMES.optionContent);
-        const optionContentText = ($optionContent === null || $optionContent === void 0 ? void 0 : $optionContent.textContent) || ($optionContent === null || $optionContent === void 0 ? void 0 : $optionContent.innerText);
+        var _a;
+        const optionContent = (_a = $option.querySelector(select_components_constatns.SELECT_RELATED_COMPONENTS_NAMES.optionContent)) === null || _a === void 0 ? void 0 : _a.textContent;
         const value = $option.getAttribute('value');
         if (!value)
             throw new Error('h-option must contain a unique value');
-        if (!optionContentText)
+        if (!optionContent)
             throw new Error('h-options must contains a h-option-content element inside');
         return select_option.SelectOption.create({
             value,
             disabled: $option.hasAttribute('disabled'),
             hidden: $option.hasAttribute('hidden'),
             inactive: $option.hasAttribute('inactive'),
-            content: optionContentText,
+            content: optionContent,
             selected: $option.hasAttribute('selected')
         });
     }

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

@@ -11,8 +11,7 @@ var decorators_js = require('@lit/reactive-element/decorators.js');
 var select_components_constatns = require('./components/select_components_constatns.js');
 var observer = require('../../../core/classes/observer/observer.js');
 var icon = require('../../icon/icon.js');
-var select_option$1 = require('./components/option/select_option.js');
-var select_option = require('./model/select_option.js');
+var select_option = require('./components/option/select_option.js');
 var select_constants = require('./select_constants.js');
 var observable_directive = require('../../../directives/observable_directive.js');
 var select_toggler = require('./components/toggler/select_toggler.js');
@@ -28,7 +27,6 @@ var multi_select_controller = require('./controllers/multi_select_controller.js'
 var select_utils = require('./select_utils.js');
 var select_controller = require('./controllers/select_controller.js');
 var select_option_mapper = require('./model/select_option_mapper.js');
-var repeat = require('lit/directives/repeat');
 
 exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLitElement {
     constructor() {
@@ -39,7 +37,6 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
         this.offset = 2;
         this.searchDisabled = false;
         this.type = select_constants.SELECT_TYPES.select;
-        this.noDeselect = false;
         this._searchValue = '';
         this._$options = {};
         this._$dropdown = ref_js.createRef();
@@ -47,40 +44,6 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
         this._$optionsList = ref_js.createRef();
         this._$dropdownContent = ref_js.createRef();
         this._selectContext = new context_provider_controller.ContextProviderController(this);
-        this._updateOptions = () => {
-            const $options = this._getOptions();
-            this._$options = $options.reduce((acc, $option) => {
-                const value = $option.getAttribute('value');
-                if (!value)
-                    throw Error('Select option must hava a value');
-                if (acc[value] !== undefined)
-                    throw Error('Select options must hava a unique values.');
-                return {
-                    ...acc,
-                    [value]: $option
-                };
-            }, {});
-            const options = $options.map(select_option_mapper.SelectOptionMapper.toModel);
-            this._selectController.options$.notify(options);
-            if (options.length)
-                this._selectController.selectedOptions$.notify(options.filter((option) => option.selected));
-        };
-        this._getOptions = () => {
-            let $options;
-            if (this.optionsList) {
-                $options = this.optionsList.map(option => {
-                    return select_utils.SelectControlUtils.createHTMLOption(select_option.SelectOption.create(option));
-                });
-            }
-            else {
-                $options = this.hasSlot(select_constants.SELECT_SLOT_NAMES.content)
-                    ? this.getSlot(select_constants.SELECT_SLOT_NAMES.content)
-                        .map((litElement) => litElement.values[0])
-                        .filter((element) => element instanceof select_option$1.HOption)
-                    : Array.from(this.querySelectorAll(select_components_constatns.SELECT_RELATED_COMPONENTS_NAMES.option));
-            }
-            return $options;
-        };
         this._handleOptionDeselect = (event) => {
             const selectedOption = this._selectController.getOption(event.detail);
             if (!selectedOption)
@@ -180,9 +143,6 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
                 this.classList.remove(select_constants.SELECT_CSS_CLASSES.selectOpened);
             }
         }
-        if (changedProperties.has('optionsList')) {
-            this._updateOptions();
-        }
         if (this._$optionsList.value && !this._listBoxController)
             this._listBoxController = new list_box_keyboard_controller.ListBoxKeyboardController({
                 host: this,
@@ -203,9 +163,28 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
         this._selectController = this.multiple ? new multi_select_controller.MultiSelectController({ host: this }) : new select_controller.SelectController({ host: this });
         this._selectContext.provide(select_constants.SELECT_CONTEXTS.selectedOptions$, this._selectController.selectedOptions$);
         this._selectContext.provide(select_constants.SELECT_CONTEXTS.isMultiselect, this.multiple);
+        const $options = this.hasSlot(select_constants.SELECT_SLOT_NAMES.content)
+            ? this.getSlot(select_constants.SELECT_SLOT_NAMES.content)
+                .map((litElement) => litElement.values[0])
+                .filter((element) => element instanceof select_option.HOption)
+            : Array.from(this.querySelectorAll(select_components_constatns.SELECT_RELATED_COMPONENTS_NAMES.option));
         this._optionsObserver = new observer.Observer((selectedOptions) => this._updateOptionsView(selectedOptions));
         this._selectController.options$.subscribe(this._optionsObserver);
-        this._updateOptions();
+        this._$options = $options.reduce((acc, $option) => {
+            const value = $option.getAttribute('value');
+            if (!value)
+                throw Error('Select option must hava a value');
+            if (acc[value] !== undefined)
+                throw Error('Select options must hava a unique values.');
+            return {
+                ...acc,
+                [value]: $option
+            };
+        }, {});
+        const options = $options.map(select_option_mapper.SelectOptionMapper.toModel);
+        this._selectController.options$.notify(options);
+        if (options.length)
+            this._selectController.selectedOptions$.notify(options.filter((option) => option.selected));
         this._setupEvents();
     }
     attributeChangedCallback(name, _old, value) {
@@ -245,7 +224,7 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
         const option = this._selectController.getOption(value);
         if (!option)
             return;
-        this.noDeselect ? this._selectController.select(option) : this._selectController.toggle(option);
+        this._selectController.toggle(option);
         if (!this.multiple)
             this._closeSelect();
         this._dispatchChangeEvent();
@@ -278,11 +257,6 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
     _searchNoResult() {
         return Boolean(!this._selectController.visibleOptionsCount && Object.keys(this._$options).length);
     }
-    _renderOption(option) {
-        const fragment = document.createDocumentFragment();
-        fragment.appendChild(option);
-        return fragment;
-    }
     render() {
         var _a;
         const options = (_a = this._selectController.options$.getValue()) !== null && _a !== void 0 ? _a : [];
@@ -318,18 +292,20 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
                               @selectSearch.search=${this._handleSearch}
                           ></h-select-search>`
             : lit.nothing}
-
-                        <h-options
-                            class="${select_constants.SELECT_CSS_CLASSES.selectOptions} ${this._searchNoResult()
-            ? select_constants.SELECT_CSS_CLASSES.selectOptionsEmpty
-            : ''}"
-                            ${ref_js.ref(this._$optionsList)}
-                            @selectOptions.clicked=${this._handleOptionClicked}
-                            @selectOptions.updated=${this._handleOptionUpdated}
-                        >
-                            ${this._$options ? repeat.repeat(Object.values(this._$options), (option) => option.value, (option) => this._renderOption(option)) : lit.nothing}
-                        </h-options>
-
+                    ${this.hasSlot(select_constants.SELECT_SLOT_NAMES.content)
+            ? lit.html `
+                              <h-options
+                                  class="${select_constants.SELECT_CSS_CLASSES.selectOptions} ${this._searchNoResult()
+                ? select_constants.SELECT_CSS_CLASSES.selectOptionsEmpty
+                : ''}"
+                                  ${ref_js.ref(this._$optionsList)}
+                                  @selectOptions.clicked=${this._handleOptionClicked}
+                                  @selectOptions.updated=${this._handleOptionUpdated}
+                              >
+                                  ${this.getSlot(select_constants.SELECT_SLOT_NAMES.content)}
+                              </h-options>
+                          `
+            : lit.nothing}
                     ${this._searchNoResult()
             ? lit.html ` <div>
                               <p class=${select_constants.SELECT_CSS_CLASSES.selectNoResult}>
@@ -403,14 +379,6 @@ tslib_es6.__decorate([
     decorators_js.property({ type: Boolean }),
     tslib_es6.__metadata("design:type", Boolean)
 ], exports.HSelect.prototype, "required", void 0);
-tslib_es6.__decorate([
-    decorators_js.property({ type: Array }),
-    tslib_es6.__metadata("design:type", Array)
-], exports.HSelect.prototype, "optionsList", void 0);
-tslib_es6.__decorate([
-    decorators_js.property({ type: Boolean, attribute: 'no-deselect' }),
-    tslib_es6.__metadata("design:type", Boolean)
-], exports.HSelect.prototype, "noDeselect", void 0);
 tslib_es6.__decorate([
     decorators.state(),
     tslib_es6.__metadata("design:type", String)

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

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

@@ -7,6 +7,7 @@ var decorators = require('lit/decorators');
 var utilities = require('@dreamcommerce/utilities');
 var phoenix_light_lit_element = require('../../core/phoenix_light_lit_element/phoenix_light_lit_element.js');
 var keystrokes_controller = require('../../controllers/keystrokes_controller/keystrokes_controller.js');
+var relative_position_controller_constants = require('../../controllers/relative_position_controller/relative_position_controller_constants.js');
 var portal_constants = require('../portal/portal_constants.js');
 var click_outside_controller = require('../../controllers/click_outside_controller/click_outside_controller.js');
 var relative_position_controller = require('../../controllers/relative_position_controller/relative_position_controller.js');
@@ -17,7 +18,7 @@ class BaseMessage extends phoenix_light_lit_element.PhoenixLightLitElement {
         super();
         this.opened = false;
         this.portalTarget = base_message_constants.DEFAULT_MESSAGE_PORTAL_NAME;
-        this.direction = utilities.DIRECTIONS.topCenter;
+        this.direction = relative_position_controller_constants.DIRECTIONS.topCenter;
         this.offset = base_message_constants.DEFAULT_MESSAGE_OFFSET;
         this._setupEventListeners = () => {
             this.addEventListener('mouseenter', this.open);

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

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/controllers/relative_position_controller/relative_position_calculator.js

@@ -0,0 +1,229 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib_es6 = require('../../../../../external/tslib/tslib.es6.js');
+var relative_position_controller_constants = require('./relative_position_controller_constants.js');
+
+var _PositionCalculator_direction, _PositionCalculator_relativeElementRect, _PositionCalculator_positionElementRect, _PositionCalculator_containerRect, _PositionCalculator_documentHeight, _PositionCalculator_documentWidth, _PositionCalculator_shouldNotReposition, _PositionCalculator_offset;
+class PositionCalculator {
+    constructor({ direction, relativeElementRect, positionElementRect, container = document.body, offset = 0, shouldNotReposition }) {
+        _PositionCalculator_direction.set(this, void 0);
+        _PositionCalculator_relativeElementRect.set(this, void 0);
+        _PositionCalculator_positionElementRect.set(this, void 0);
+        _PositionCalculator_containerRect.set(this, void 0);
+        _PositionCalculator_documentHeight.set(this, void 0);
+        _PositionCalculator_documentWidth.set(this, void 0);
+        _PositionCalculator_shouldNotReposition.set(this, void 0);
+        _PositionCalculator_offset.set(this, void 0);
+        tslib_es6.__classPrivateFieldSet(this, _PositionCalculator_direction, direction, "f");
+        tslib_es6.__classPrivateFieldSet(this, _PositionCalculator_relativeElementRect, relativeElementRect, "f");
+        tslib_es6.__classPrivateFieldSet(this, _PositionCalculator_positionElementRect, positionElementRect, "f");
+        tslib_es6.__classPrivateFieldSet(this, _PositionCalculator_containerRect, container.getBoundingClientRect(), "f");
+        tslib_es6.__classPrivateFieldSet(this, _PositionCalculator_shouldNotReposition, !!shouldNotReposition, "f");
+        tslib_es6.__classPrivateFieldSet(this, _PositionCalculator_offset, offset, "f");
+        const body = document.body;
+        const documentElement = document.documentElement;
+        tslib_es6.__classPrivateFieldSet(this, _PositionCalculator_documentHeight, Math.max(body.scrollHeight, body.offsetHeight, documentElement.clientHeight, documentElement.scrollHeight, documentElement.offsetHeight), "f");
+        tslib_es6.__classPrivateFieldSet(this, _PositionCalculator_documentWidth, Math.max(body.scrollWidth, body.offsetWidth, documentElement.clientWidth, documentElement.scrollWidth, documentElement.offsetWidth), "f");
+    }
+    calculatePosition() {
+        const [side, alignment = relative_position_controller_constants.CALCULATOR_DIRECTIONS.center] = tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_direction, "f").split('-');
+        const sidePosition = this._calculateSidePosition(side, alignment);
+        const alignmentPosition = this.calculateAlignmentPosition(alignment, side);
+        return {
+            ...sidePosition,
+            ...alignmentPosition,
+            calculatedSide: `${sidePosition.calculatedSide || ''}-${alignmentPosition.calculatedSide || ''}`
+        };
+    }
+    _canFitTopSide() {
+        const elementPositionTop = tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_relativeElementRect, "f").top - tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_positionElementRect, "f").height - tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_offset, "f");
+        return elementPositionTop > tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_containerRect, "f").top && elementPositionTop > 0;
+    }
+    _canFitBottomSide() {
+        const elementPositionBottom = tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_relativeElementRect, "f").bottom + tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_positionElementRect, "f").height + tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_offset, "f");
+        return elementPositionBottom < tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_containerRect, "f").bottom && elementPositionBottom < tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_documentHeight, "f");
+    }
+    _canFitCenter(centerPosition) {
+        return centerPosition + tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_positionElementRect, "f").height - window.scrollY < window.innerHeight && centerPosition - window.scrollY > 0;
+    }
+    _canFitLeftSide() {
+        const positionElementLeftSide = tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_relativeElementRect, "f").left + window.scrollX - tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_positionElementRect, "f").width - tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_offset, "f");
+        return positionElementLeftSide >= tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_containerRect, "f").left && positionElementLeftSide > 0;
+    }
+    _canFitRightSide() {
+        const positionElementRightSide = tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_relativeElementRect, "f").right + window.scrollX + tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_positionElementRect, "f").width + tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_offset, "f");
+        return positionElementRightSide <= tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_containerRect, "f").width && positionElementRightSide < tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_documentWidth, "f");
+    }
+    _calculateSidePosition(side, alignment) {
+        const topSideOfRelativeElement = tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_relativeElementRect, "f").top + window.scrollY - tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_positionElementRect, "f").height - tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_offset, "f");
+        const bottomSideOfRelativeElement = tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_relativeElementRect, "f").bottom + window.scrollY + tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_offset, "f");
+        const leftSideOfRelativeElement = tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_relativeElementRect, "f").left + window.scrollX - tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_positionElementRect, "f").width - tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_offset, "f");
+        const rightSideOfRelativeElement = tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_relativeElementRect, "f").right + window.scrollX + tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_offset, "f");
+        const verticalCenterOfRelativeElement = (topSideOfRelativeElement + bottomSideOfRelativeElement) / 2;
+        const horizontalCenterOfRelativeElement = (leftSideOfRelativeElement + rightSideOfRelativeElement) / 2;
+        switch (side) {
+            case relative_position_controller_constants.CALCULATOR_DIRECTIONS.top:
+                return this._calculateTopSide({
+                    topSide: topSideOfRelativeElement,
+                    bottomSide: bottomSideOfRelativeElement,
+                    verticalCenter: verticalCenterOfRelativeElement
+                });
+            case relative_position_controller_constants.CALCULATOR_DIRECTIONS.bottom:
+                return this._calculateBottomSide({
+                    topSide: topSideOfRelativeElement,
+                    bottomSide: bottomSideOfRelativeElement,
+                    verticalCenter: verticalCenterOfRelativeElement
+                });
+            case relative_position_controller_constants.CALCULATOR_DIRECTIONS.center:
+                return this._calculateCenterSide({
+                    verticalCenter: verticalCenterOfRelativeElement,
+                    horizontalCenter: horizontalCenterOfRelativeElement,
+                    alignment
+                });
+            case relative_position_controller_constants.CALCULATOR_DIRECTIONS.left:
+                return this._calculateLeftSide({
+                    leftSide: leftSideOfRelativeElement,
+                    rightSide: rightSideOfRelativeElement
+                });
+            case relative_position_controller_constants.CALCULATOR_DIRECTIONS.right:
+                return this._calculateRightSide({
+                    leftSide: leftSideOfRelativeElement,
+                    rightSide: rightSideOfRelativeElement
+                });
+            default:
+                return { top: 0 };
+        }
+    }
+    _calculateTopSide({ topSide, bottomSide, verticalCenter }) {
+        if (tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_shouldNotReposition, "f"))
+            return { top: topSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.top };
+        if (!this._canFitTopSide() && !this._canFitBottomSide() && !this._canFitCenter(verticalCenter))
+            return { top: bottomSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.bottom, shrinkMode: true };
+        if (!this._canFitTopSide() && !this._canFitBottomSide())
+            return { top: verticalCenter, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.center };
+        if (!this._canFitTopSide())
+            return { top: bottomSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.bottom };
+        return { top: topSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.top };
+    }
+    _calculateBottomSide({ topSide, bottomSide, verticalCenter }) {
+        if (tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_shouldNotReposition, "f"))
+            return { top: bottomSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.bottom };
+        if (!this._canFitTopSide() && !this._canFitBottomSide() && !this._canFitCenter(verticalCenter))
+            return { top: bottomSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.bottom, shrinkMode: true };
+        if (!this._canFitTopSide() && !this._canFitBottomSide())
+            return { top: verticalCenter, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.center };
+        if (!this._canFitBottomSide())
+            return { top: topSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.top };
+        return { top: bottomSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.bottom };
+    }
+    _calculateCenterSide({ verticalCenter, horizontalCenter, alignment }) {
+        if (alignment === relative_position_controller_constants.CALCULATOR_DIRECTIONS.left || alignment === relative_position_controller_constants.CALCULATOR_DIRECTIONS.right)
+            return { top: verticalCenter, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.center };
+        return { left: horizontalCenter, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.center };
+    }
+    _calculateLeftSide({ leftSide, rightSide }) {
+        if (tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_shouldNotReposition, "f"))
+            return { left: leftSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.left };
+        if (!this._canFitLeftSide() && !this._canFitRightSide())
+            return { left: leftSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.left };
+        if (!this._canFitLeftSide())
+            return { left: rightSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.right };
+        return { left: leftSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.left };
+    }
+    _calculateRightSide({ leftSide, rightSide }) {
+        if (tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_shouldNotReposition, "f"))
+            return { left: rightSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.right };
+        if (!this._canFitRightSide() && !this._canFitLeftSide())
+            return { left: rightSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.right };
+        if (!this._canFitRightSide())
+            return { left: leftSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.left };
+        return { left: rightSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.right };
+    }
+    calculateAlignmentPosition(alignment, side) {
+        const alignmentToLeftSide = tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_relativeElementRect, "f").left + window.scrollX;
+        const alignmentToRightSide = tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_relativeElementRect, "f").right + window.scrollX - tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_positionElementRect, "f").width;
+        const alignmentToTopSide = tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_relativeElementRect, "f").top + window.scrollY;
+        const alignmentToBottomSide = tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_relativeElementRect, "f").bottom + window.scrollY - tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_positionElementRect, "f").height;
+        const verticalCenterOfRelativeElement = (alignmentToTopSide + alignmentToBottomSide) / 2;
+        const horizontalCenterOfRelativeElement = (alignmentToLeftSide + alignmentToRightSide) / 2;
+        const isSideCenter = side === relative_position_controller_constants.CALCULATOR_DIRECTIONS.center;
+        switch (alignment) {
+            case relative_position_controller_constants.CALCULATOR_DIRECTIONS.top: {
+                return this._calculateTopAlignment({ topAlignment: alignmentToTopSide, isSideCenter });
+            }
+            case relative_position_controller_constants.CALCULATOR_DIRECTIONS.bottom: {
+                return this._calculateBottomAlignment({ bottomAlignment: alignmentToBottomSide, isSideCenter });
+            }
+            case relative_position_controller_constants.CALCULATOR_DIRECTIONS.left: {
+                return this._calculateLeftAlignment({
+                    leftAlignment: alignmentToLeftSide,
+                    rightAlignment: alignmentToRightSide,
+                    isSideCenter
+                });
+            }
+            case relative_position_controller_constants.CALCULATOR_DIRECTIONS.right: {
+                return this._calculateRightAlignment({
+                    leftAlignment: alignmentToLeftSide,
+                    rightAlignment: alignmentToRightSide,
+                    isSideCenter
+                });
+            }
+            case relative_position_controller_constants.CALCULATOR_DIRECTIONS.center:
+                return this._calculateCenterAlignment({
+                    horizontalCenter: horizontalCenterOfRelativeElement,
+                    verticalCenter: verticalCenterOfRelativeElement,
+                    side
+                });
+            default:
+                return { left: 0 };
+        }
+    }
+    _calculateTopAlignment({ topAlignment, isSideCenter }) {
+        const alignmentToTop = isSideCenter ? topAlignment - tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_positionElementRect, "f").height - tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_offset, "f") : topAlignment;
+        return {
+            top: alignmentToTop,
+            calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.top
+        };
+    }
+    _calculateBottomAlignment({ bottomAlignment, isSideCenter }) {
+        const alignmentToBottom = isSideCenter ? bottomAlignment + tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_positionElementRect, "f").height + tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_offset, "f") : bottomAlignment;
+        return { top: alignmentToBottom, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.bottom };
+    }
+    _calculateLeftAlignment({ leftAlignment, rightAlignment, isSideCenter }) {
+        const alignmentToLeftSide = isSideCenter ? leftAlignment - tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_positionElementRect, "f").width : leftAlignment;
+        const alignmentToRightSide = rightAlignment + tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_positionElementRect, "f").width + tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_offset, "f");
+        if (!isSideCenter)
+            return { left: alignmentToLeftSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.left };
+        if (tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_shouldNotReposition, "f"))
+            return { left: alignmentToLeftSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.left };
+        if (!this._canFitLeftSide() && !this._canFitRightSide())
+            return { left: alignmentToLeftSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.left };
+        if (!this._canFitLeftSide())
+            return { left: alignmentToRightSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.right };
+        return { left: alignmentToLeftSide - tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_offset, "f"), calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.left };
+    }
+    _calculateRightAlignment({ leftAlignment, rightAlignment, isSideCenter }) {
+        const alignmentToRightSide = isSideCenter ? rightAlignment + tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_positionElementRect, "f").width : rightAlignment;
+        const alignmentToLeftSide = leftAlignment - tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_positionElementRect, "f").width - tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_offset, "f");
+        if (!isSideCenter)
+            return { left: alignmentToRightSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.right };
+        if (tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_shouldNotReposition, "f"))
+            return { left: alignmentToRightSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.right };
+        if (!this._canFitLeftSide() && !this._canFitRightSide())
+            return { left: alignmentToRightSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.right };
+        if (!this._canFitRightSide())
+            return { left: alignmentToLeftSide, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.left };
+        return { left: alignmentToRightSide + tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_offset, "f"), calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.right };
+    }
+    _calculateCenterAlignment({ horizontalCenter, verticalCenter, side }) {
+        if (side === relative_position_controller_constants.CALCULATOR_DIRECTIONS.top || side === relative_position_controller_constants.CALCULATOR_DIRECTIONS.bottom)
+            return { left: horizontalCenter, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.center };
+        return { top: verticalCenter, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.center };
+    }
+}
+_PositionCalculator_direction = new WeakMap(), _PositionCalculator_relativeElementRect = new WeakMap(), _PositionCalculator_positionElementRect = new WeakMap(), _PositionCalculator_containerRect = new WeakMap(), _PositionCalculator_documentHeight = new WeakMap(), _PositionCalculator_documentWidth = new WeakMap(), _PositionCalculator_shouldNotReposition = new WeakMap(), _PositionCalculator_offset = new WeakMap();
+
+exports.PositionCalculator = PositionCalculator;
+//# sourceMappingURL=relative_position_calculator.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/controllers/relative_position_controller/relative_position_controller.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var tslib_es6 = require('../../../../../external/tslib/tslib.es6.js');
 require('lit');
-var utilities = require('@dreamcommerce/utilities');
 var global_constants = require('../../global_constants.js');
 var relative_position_controller_constants = require('./relative_position_controller_constants.js');
+var relative_position_calculator = require('./relative_position_calculator.js');
 var throttle = require('../../../../../external/lodash/throttle.js');
 
 var _RelativePositionController_host, _RelativePositionController_container, _RelativePositionController_direction, _RelativePositionController_nearestScrollableElement, _RelativePositionController_relativeElement, _RelativePositionController_elementToPosition, _RelativePositionController_disablePositioningOnCondition, _RelativePositionController_portalElementsNames, _RelativePositionController_isInitiallyScrollable, _RelativePositionController_initialMaxHeight, _RelativePositionController_initialHeight, _RelativePositionController_calculatedDirection, _RelativePositionController_hasPositioningBeenDisabled, _RelativePositionController_doesCurrentlyHaveShrinkMode, _RelativePositionController_offset, _RelativePositionController_mobileElementPosition, _RelativePositionController_throttledReposition, _RelativePositionController_throttledRepositionForScroll;
@@ -75,7 +75,7 @@ class RelativePositionController {
         const positionElementRect = tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_initialHeight, "f")
             ? { ...tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").getBoundingClientRect().toJSON(), height: tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_initialHeight, "f") }
             : tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").getBoundingClientRect();
-        const position = new utilities.RelativePositionCalculator({
+        const position = new relative_position_calculator.PositionCalculator({
             direction: shouldNotReposition && tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_calculatedDirection, "f") ? tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_calculatedDirection, "f") : tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_direction, "f"),
             relativeElementRect: tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_relativeElement, "f").getBoundingClientRect(),
             positionElementRect,

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

@@ -2,6 +2,44 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+const VERTICAL_DIRECTIONS = {
+    bottomLeft: 'bottom-left',
+    bottomRight: 'bottom-right',
+    bottomCenter: 'bottom-center',
+    topLeft: 'top-left',
+    topRight: 'top-right',
+    topCenter: 'top-center'
+};
+const HORIZONTAL_DIRECTIONS = {
+    rightTop: 'right-top',
+    rightCenter: 'right-center',
+    rightBottom: 'right-bottom',
+    leftTop: 'left-top',
+    leftCenter: 'left-center',
+    leftBottom: 'left-bottom'
+};
+const CENTER_DIRECTIONS = {
+    centerTop: 'center-top',
+    centerRight: 'center-right',
+    centerBottom: 'center-bottom',
+    centerLeft: 'center-left',
+    top: 'top',
+    right: 'right',
+    bottom: 'bottom',
+    left: 'left'
+};
+const DIRECTIONS = {
+    ...HORIZONTAL_DIRECTIONS,
+    ...VERTICAL_DIRECTIONS,
+    ...CENTER_DIRECTIONS
+};
+const CALCULATOR_DIRECTIONS = {
+    bottom: 'bottom',
+    top: 'top',
+    left: 'left',
+    right: 'right',
+    center: 'center'
+};
 const NON_STATIC_POSITIONS = ['relative', 'absolute', 'fixed', 'sticky'];
 const OVERFLOW_SCROLL = 'scroll';
 const OVERFLOW_AUTO = 'auto';
@@ -19,8 +57,12 @@ const MOBILE_ELEMENT_POSITIONS = {
     right: 'right'
 };
 
+exports.CALCULATOR_DIRECTIONS = CALCULATOR_DIRECTIONS;
+exports.CENTER_DIRECTIONS = CENTER_DIRECTIONS;
 exports.DEFAULT_SCROLL_THROTTLE_WAIT_TIME = DEFAULT_SCROLL_THROTTLE_WAIT_TIME;
 exports.DEFAULT_THROTTLE_WAIT_TIME = DEFAULT_THROTTLE_WAIT_TIME;
+exports.DIRECTIONS = DIRECTIONS;
+exports.HORIZONTAL_DIRECTIONS = HORIZONTAL_DIRECTIONS;
 exports.MOBILE_ELEMENT_POSITIONS = MOBILE_ELEMENT_POSITIONS;
 exports.NON_STATIC_POSITIONS = NON_STATIC_POSITIONS;
 exports.OVERFLOW_AUTO = OVERFLOW_AUTO;
@@ -28,4 +70,5 @@ exports.OVERFLOW_SCROLL = OVERFLOW_SCROLL;
 exports.RELATIVE_POSITION_CONTROLLER_EVENTS = RELATIVE_POSITION_CONTROLLER_EVENTS;
 exports.SHRINK_MODE_BOTTOM_MARGIN = SHRINK_MODE_BOTTOM_MARGIN;
 exports.SHRINK_MODE_MIN_HEIGHT = SHRINK_MODE_MIN_HEIGHT;
+exports.VERTICAL_DIRECTIONS = VERTICAL_DIRECTIONS;
 //# sourceMappingURL=relative_position_controller_constants.js.map

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

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

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

@@ -1,5 +1,5 @@
 import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.js';
-import { DIRECTIONS, UiDomUtils } from '@dreamcommerce/utilities';
+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 { property } from '@lit/reactive-element/decorators.js';
@@ -7,7 +7,7 @@ import { KeystrokesController } from '../../controllers/keystrokes_controller/ke
 import { html } from 'lit-html';
 import { BREAKPOINTS, SCROLLABLE_CLASS_NAME } from '../../global_constants.js';
 import { DEFAULT_DROPDOWN_PORTAL_NAME, DROPDOWN_CONTENT_CSS_CLASSES, DROPDOWN_EVENTS, DROPDOWN_CONTAINER_NAME, DROPDOWN_CONTENT_NAME, DROPDOWN_CONTENT_WIDTH, DROPDOWN_TOGGLER_NAME } from './dropdown_constants.js';
-import { RELATIVE_POSITION_CONTROLLER_EVENTS, DEFAULT_THROTTLE_WAIT_TIME } from '../../controllers/relative_position_controller/relative_position_controller_constants.js';
+import { DIRECTIONS, RELATIVE_POSITION_CONTROLLER_EVENTS, DEFAULT_THROTTLE_WAIT_TIME } from '../../controllers/relative_position_controller/relative_position_controller_constants.js';
 import { PORTAL_TARGET_COMPONENT_NAME, PORTAL_TARGET_NAME_PROP } from '../portal/portal_constants.js';
 import { BackdropController } from '../backdrop/controller/backdrop_controller.js';
 import { ClickOutsideController } from '../../controllers/click_outside_controller/click_outside_controller.js';

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

@@ -1,6 +1,6 @@
 import { Any } from 'ts-toolbelt';
 import { DROPDOWN_CONTENT_WIDTH } from "./dropdown_constants";
-import { VERTICAL_DIRECTIONS } from '@dreamcommerce/utilities';
+import { VERTICAL_DIRECTIONS } from "../../controllers/relative_position_controller/relative_position_controller_constants";
 export declare type TDropdownSelectors = {
     getDropdownPortalTargetName(): string;
     getDropdownContainerName(): string;

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

@@ -1,4 +1,4 @@
 import 'ts-toolbelt';
 import '@phoenixRoot/components/dropdown/dropdown_constants';
-import '@dreamcommerce/utilities';
+import '@phoenixRoot/controllers/relative_position_controller/relative_position_controller_constants';
 //# sourceMappingURL=dropdown_types.js.map

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

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

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

@@ -1,4 +1,4 @@
-import { TSelectOptionConstructorOptions } from "./select_option_types";
+import { TSelectOptionConstructorOptions } from "./select_option_constants";
 export declare class SelectOption {
     selected: boolean;
     disabled: boolean;