@shoper/phoenix_design_system 0.1.3 → 0.2.1

package/build/cjs/external/uuid/dist/esm-browser/regex.js

@@ -0,0 +1,8 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var REGEX = /^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000)$/i;
+
+exports.default = REGEX;
+//# sourceMappingURL=regex.js.map

package/build/cjs/external/uuid/dist/esm-browser/regex.js.map

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

package/build/cjs/external/uuid/dist/esm-browser/rng.js

@@ -0,0 +1,26 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+// Unique ID creation requires a high quality random # generator. In the browser we therefore
+// require the crypto API and do not support built-in fallback to lower quality random number
+// generators (like Math.random()).
+var getRandomValues;
+var rnds8 = new Uint8Array(16);
+function rng() {
+  // lazy load so that environments that need to polyfill have a chance to do so
+  if (!getRandomValues) {
+    // getRandomValues needs to be invoked in a context where "this" is a Crypto implementation. Also,
+    // find the complete implementation of crypto (msCrypto) on IE11.
+    getRandomValues = typeof crypto !== 'undefined' && crypto.getRandomValues && crypto.getRandomValues.bind(crypto) || typeof msCrypto !== 'undefined' && typeof msCrypto.getRandomValues === 'function' && msCrypto.getRandomValues.bind(msCrypto);
+
+    if (!getRandomValues) {
+      throw new Error('crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported');
+    }
+  }
+
+  return getRandomValues(rnds8);
+}
+
+exports.default = rng;
+//# sourceMappingURL=rng.js.map

package/build/cjs/external/uuid/dist/esm-browser/rng.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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/external/uuid/dist/esm-browser/stringify.js

@@ -0,0 +1,36 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var validate = require('./validate.js');
+
+/**
+ * Convert array of 16 byte values to UUID string format of the form:
+ * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
+ */
+
+var byteToHex = [];
+
+for (var i = 0; i < 256; ++i) {
+  byteToHex.push((i + 0x100).toString(16).substr(1));
+}
+
+function stringify(arr) {
+  var offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  // Note: Be careful editing this code!  It's been tuned for performance
+  // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434
+  var uuid = (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase(); // Consistency check for valid UUID.  If this throws, it's likely due to one
+  // of the following:
+  // - One or more input array values don't map to a hex octet (leading to
+  // "undefined" in the uuid)
+  // - Invalid input values for the RFC `version` or `variant` fields
+
+  if (!validate['default'](uuid)) {
+    throw TypeError('Stringified UUID is invalid');
+  }
+
+  return uuid;
+}
+
+exports.default = stringify;
+//# sourceMappingURL=stringify.js.map

package/build/cjs/external/uuid/dist/esm-browser/stringify.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;AACA;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/external/uuid/dist/esm-browser/v4.js

@@ -0,0 +1,29 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var rng = require('./rng.js');
+var stringify = require('./stringify.js');
+
+function v4(options, buf, offset) {
+  options = options || {};
+  var rnds = options.random || (options.rng || rng['default'])(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`
+
+  rnds[6] = rnds[6] & 0x0f | 0x40;
+  rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided
+
+  if (buf) {
+    offset = offset || 0;
+
+    for (var i = 0; i < 16; ++i) {
+      buf[offset + i] = rnds[i];
+    }
+
+    return buf;
+  }
+
+  return stringify['default'](rnds);
+}
+
+exports.default = v4;
+//# sourceMappingURL=v4.js.map

package/build/cjs/external/uuid/dist/esm-browser/v4.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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/external/uuid/dist/esm-browser/validate.js

@@ -0,0 +1,12 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var regex = require('./regex.js');
+
+function validate(uuid) {
+  return typeof uuid === 'string' && regex['default'].test(uuid);
+}
+
+exports.default = validate;
+//# sourceMappingURL=validate.js.map

package/build/cjs/external/uuid/dist/esm-browser/validate.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;AACA;"}

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

@@ -0,0 +1,80 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib_es6 = require('../../../../../external/tslib/tslib.es6.js');
+var phoenix_light_lit_element = require('../../core/phoenix_light_lit_element.js');
+var decorators = require('lit/decorators');
+var portal_constants = require('./portal_constants.js');
+var v4 = require('../../../../../external/uuid/dist/esm-browser/v4.js');
+
+exports.HPortal = class HPortal extends phoenix_light_lit_element.PhoenixLightLitElement {
+    constructor() {
+        super();
+        this._id = v4['default']();
+        this._initialChildren = [];
+        this.to = '';
+        this.disabled = false;
+        this._initialChildren = [...this.children];
+    }
+    firstUpdated() {
+        const shouldOpenPortal = this._initialChildren.length > 0 && !this.disabled;
+        if (shouldOpenPortal) {
+            this.openPortal();
+        }
+    }
+    updated(changedProps) {
+        const disabledValue = changedProps.get('disabled');
+        if (disabledValue === true) {
+            this.closePortal();
+        }
+        else if (disabledValue === false) {
+            this.openPortal();
+        }
+    }
+    disconnectedCallback() {
+        this.closePortal();
+    }
+    openPortal() {
+        const openPortalEvent = new CustomEvent(portal_constants.PORTAL_EVENTS.open, {
+            composed: true,
+            detail: {
+                portalId: this._id,
+                to: this.to,
+                content: [...this._initialChildren]
+            }
+        });
+        document.dispatchEvent(openPortalEvent);
+    }
+    closePortal() {
+        const closePortalEvent = new CustomEvent(portal_constants.PORTAL_EVENTS.close, {
+            composed: true,
+            detail: {
+                portalId: this._id,
+                to: this.to
+            }
+        });
+        document.dispatchEvent(closePortalEvent);
+    }
+};
+tslib_es6.__decorate([
+    decorators.state(),
+    tslib_es6.__metadata("design:type", Object)
+], exports.HPortal.prototype, "_id", void 0);
+tslib_es6.__decorate([
+    decorators.state(),
+    tslib_es6.__metadata("design:type", Array)
+], exports.HPortal.prototype, "_initialChildren", void 0);
+tslib_es6.__decorate([
+    decorators.property({ type: String }),
+    tslib_es6.__metadata("design:type", Object)
+], exports.HPortal.prototype, "to", void 0);
+tslib_es6.__decorate([
+    decorators.property({ type: Boolean }),
+    tslib_es6.__metadata("design:type", Object)
+], exports.HPortal.prototype, "disabled", void 0);
+exports.HPortal = tslib_es6.__decorate([
+    decorators.customElement('h-portal'),
+    tslib_es6.__metadata("design:paramtypes", [])
+], exports.HPortal);
+//# sourceMappingURL=portal.js.map

package/build/cjs/packages/phoenix/src/components/portal/portal.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,iBAAiB,qDAAyD;AAC1E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/portal/portal_constants.js

@@ -0,0 +1,11 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const PORTAL_EVENTS = {
+    open: `portal.open`,
+    close: 'portal.close'
+};
+
+exports.PORTAL_EVENTS = PORTAL_EVENTS;
+//# sourceMappingURL=portal_constants.js.map

package/build/cjs/packages/phoenix/src/components/portal/portal_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/cjs/packages/phoenix/src/components/portal/portal_target.js

@@ -0,0 +1,76 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib_es6 = require('../../../../../external/tslib/tslib.es6.js');
+var phoenix_light_lit_element = require('../../core/phoenix_light_lit_element.js');
+var decorators = require('lit/decorators');
+var portal_constants = require('./portal_constants.js');
+var portal_target_error = require('./portal_target_error.js');
+
+var HPortalTarget_1;
+exports.HPortalTarget = HPortalTarget_1 = class HPortalTarget extends phoenix_light_lit_element.PhoenixLightLitElement {
+    constructor() {
+        super(...arguments);
+        this.name = '';
+        this._portalElementsMap = {};
+        this.portalElements = ({ detail: { portalId, content, to } }) => {
+            var _a;
+            if (!this.doesDestinationMatch(to))
+                return;
+            const newPortalElements = [...content].map((el) => this.appendChild(el));
+            const elementsInProtal = (_a = this._portalElementsMap[portalId]) !== null && _a !== void 0 ? _a : [];
+            this._portalElementsMap[portalId] = [...newPortalElements, ...elementsInProtal];
+        };
+        this.removeTeleportedItems = ({ detail: { portalId, to } }) => {
+            var _a;
+            if (!this.doesDestinationMatch(to))
+                return;
+            (_a = this._portalElementsMap[portalId]) === null || _a === void 0 ? void 0 : _a.forEach((el) => {
+                if (el.parentElement === this) {
+                    this.removeChild(el);
+                }
+            });
+            this._portalElementsMap[portalId] = [];
+        };
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.allowOnlyOnePortalTargetWithName();
+        document.addEventListener(portal_constants.PORTAL_EVENTS.open, this.portalElements, {
+            capture: true
+        });
+        document.addEventListener(portal_constants.PORTAL_EVENTS.close, this.removeTeleportedItems, {
+            capture: true
+        });
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        document.removeEventListener(portal_constants.PORTAL_EVENTS.open, this.portalElements);
+        document.removeEventListener(portal_constants.PORTAL_EVENTS.close, this.removeTeleportedItems);
+        HPortalTarget_1.portalTargetsNames.delete(this.name);
+    }
+    doesDestinationMatch(destination) {
+        return destination === this.name;
+    }
+    allowOnlyOnePortalTargetWithName() {
+        if (HPortalTarget_1.portalTargetsNames.has(this.name)) {
+            this.remove();
+            throw new portal_target_error.PortalTargetError(`Portal target with name "${this.name}" already exists.`);
+        }
+        HPortalTarget_1.portalTargetsNames.add(this.name);
+    }
+};
+exports.HPortalTarget.portalTargetsNames = new Set();
+tslib_es6.__decorate([
+    decorators.property({ type: String }),
+    tslib_es6.__metadata("design:type", Object)
+], exports.HPortalTarget.prototype, "name", void 0);
+tslib_es6.__decorate([
+    decorators.state(),
+    tslib_es6.__metadata("design:type", Object)
+], exports.HPortalTarget.prototype, "_portalElementsMap", void 0);
+exports.HPortalTarget = HPortalTarget_1 = tslib_es6.__decorate([
+    decorators.customElement('h-portal-target')
+], exports.HPortalTarget);
+//# sourceMappingURL=portal_target.js.map

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

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

@@ -0,0 +1,9 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+class PortalTargetError extends Error {
+}
+
+exports.PortalTargetError = PortalTargetError;
+//# sourceMappingURL=portal_target_error.js.map

package/build/cjs/packages/phoenix/src/components/portal/portal_target_error.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/cjs/packages/phoenix/src/{core/hello_button.js → hello_button.js}

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../../../../external/tslib/tslib.es6.js');
+var tslib_es6 = require('../../../external/tslib/tslib.es6.js');
 var lit = require('lit');
 var decorators = require('lit/decorators');
 

package/build/cjs/packages/phoenix/src/{core/hello_button.js.map → hello_button.js.map}

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

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

@@ -5,7 +5,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var context_provider_controller = require('./core/context/context_provider_controller.js');
 var context_consumer_controller = require('./core/context/context_consumer_controller.js');
 var phoenix_light_lit_element = require('./core/phoenix_light_lit_element.js');
-var hello_button = require('./core/hello_button.js');
+var hello_button = require('./hello_button.js');
+var portal = require('./components/portal/portal.js');
+var portal_target = require('./components/portal/portal_target.js');
 
 
 
@@ -18,4 +20,16 @@ Object.defineProperty(exports, 'HelloButton', {
 		return hello_button.HelloButton;
 	}
 });
+Object.defineProperty(exports, 'HPortal', {
+	enumerable: true,
+	get: function () {
+		return portal.HPortal;
+	}
+});
+Object.defineProperty(exports, 'HPortalTarget', {
+	enumerable: true,
+	get: function () {
+		return portal_target.HPortalTarget;
+	}
+});
 //# sourceMappingURL=index.js.map

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

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

package/build/cjs/packages/star_core/build/esm/external/tslib/tslib.es6.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-/******************************************************************************
+/*! *****************************************************************************
 Copyright (c) Microsoft Corporation.
 
 Permission to use, copy, modify, and/or distribute this software for any

package/build/esm/external/uuid/dist/esm-browser/regex.js

@@ -0,0 +1,4 @@
+var REGEX = /^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000)$/i;
+
+export default REGEX;
+//# sourceMappingURL=regex.js.map

package/build/esm/external/uuid/dist/esm-browser/regex.js.map

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

package/build/esm/external/uuid/dist/esm-browser/rng.js

@@ -0,0 +1,22 @@
+// Unique ID creation requires a high quality random # generator. In the browser we therefore
+// require the crypto API and do not support built-in fallback to lower quality random number
+// generators (like Math.random()).
+var getRandomValues;
+var rnds8 = new Uint8Array(16);
+function rng() {
+  // lazy load so that environments that need to polyfill have a chance to do so
+  if (!getRandomValues) {
+    // getRandomValues needs to be invoked in a context where "this" is a Crypto implementation. Also,
+    // find the complete implementation of crypto (msCrypto) on IE11.
+    getRandomValues = typeof crypto !== 'undefined' && crypto.getRandomValues && crypto.getRandomValues.bind(crypto) || typeof msCrypto !== 'undefined' && typeof msCrypto.getRandomValues === 'function' && msCrypto.getRandomValues.bind(msCrypto);
+
+    if (!getRandomValues) {
+      throw new Error('crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported');
+    }
+  }
+
+  return getRandomValues(rnds8);
+}
+
+export default rng;
+//# sourceMappingURL=rng.js.map

package/build/esm/external/uuid/dist/esm-browser/rng.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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/external/uuid/dist/esm-browser/stringify.js

@@ -0,0 +1,32 @@
+import validate from './validate.js';
+
+/**
+ * Convert array of 16 byte values to UUID string format of the form:
+ * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
+ */
+
+var byteToHex = [];
+
+for (var i = 0; i < 256; ++i) {
+  byteToHex.push((i + 0x100).toString(16).substr(1));
+}
+
+function stringify(arr) {
+  var offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  // Note: Be careful editing this code!  It's been tuned for performance
+  // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434
+  var uuid = (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase(); // Consistency check for valid UUID.  If this throws, it's likely due to one
+  // of the following:
+  // - One or more input array values don't map to a hex octet (leading to
+  // "undefined" in the uuid)
+  // - Invalid input values for the RFC `version` or `variant` fields
+
+  if (!validate(uuid)) {
+    throw TypeError('Stringified UUID is invalid');
+  }
+
+  return uuid;
+}
+
+export default stringify;
+//# sourceMappingURL=stringify.js.map

package/build/esm/external/uuid/dist/esm-browser/stringify.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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/external/uuid/dist/esm-browser/v4.js

@@ -0,0 +1,25 @@
+import rng from './rng.js';
+import stringify from './stringify.js';
+
+function v4(options, buf, offset) {
+  options = options || {};
+  var rnds = options.random || (options.rng || rng)(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`
+
+  rnds[6] = rnds[6] & 0x0f | 0x40;
+  rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided
+
+  if (buf) {
+    offset = offset || 0;
+
+    for (var i = 0; i < 16; ++i) {
+      buf[offset + i] = rnds[i];
+    }
+
+    return buf;
+  }
+
+  return stringify(rnds);
+}
+
+export default v4;
+//# sourceMappingURL=v4.js.map

package/build/esm/external/uuid/dist/esm-browser/v4.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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/external/uuid/dist/esm-browser/validate.js

@@ -0,0 +1,8 @@
+import REGEX from './regex.js';
+
+function validate(uuid) {
+  return typeof uuid === 'string' && REGEX.test(uuid);
+}
+
+export default validate;
+//# sourceMappingURL=validate.js.map

package/build/esm/external/uuid/dist/esm-browser/validate.js.map

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

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

@@ -0,0 +1,13 @@
+import { PhoenixLightLitElement } from "../../core/phoenix_light_lit_element";
+export declare class HPortal extends PhoenixLightLitElement {
+    _id: string;
+    _initialChildren: Element[];
+    to: string;
+    disabled: boolean;
+    constructor();
+    firstUpdated(): void;
+    updated(changedProps: Map<string, any>): void;
+    disconnectedCallback(): void;
+    openPortal(): void;
+    closePortal(): void;
+}

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

@@ -0,0 +1,78 @@
+import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.js';
+import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element.js';
+import { state, property, customElement } from 'lit/decorators';
+import { PORTAL_EVENTS } from './portal_constants.js';
+import v4 from '../../../../../external/uuid/dist/esm-browser/v4.js';
+
+let HPortal = class HPortal extends PhoenixLightLitElement {
+    constructor() {
+        super();
+        this._id = v4();
+        this._initialChildren = [];
+        this.to = '';
+        this.disabled = false;
+        this._initialChildren = [...this.children];
+    }
+    firstUpdated() {
+        const shouldOpenPortal = this._initialChildren.length > 0 && !this.disabled;
+        if (shouldOpenPortal) {
+            this.openPortal();
+        }
+    }
+    updated(changedProps) {
+        const disabledValue = changedProps.get('disabled');
+        if (disabledValue === true) {
+            this.closePortal();
+        }
+        else if (disabledValue === false) {
+            this.openPortal();
+        }
+    }
+    disconnectedCallback() {
+        this.closePortal();
+    }
+    openPortal() {
+        const openPortalEvent = new CustomEvent(PORTAL_EVENTS.open, {
+            composed: true,
+            detail: {
+                portalId: this._id,
+                to: this.to,
+                content: [...this._initialChildren]
+            }
+        });
+        document.dispatchEvent(openPortalEvent);
+    }
+    closePortal() {
+        const closePortalEvent = new CustomEvent(PORTAL_EVENTS.close, {
+            composed: true,
+            detail: {
+                portalId: this._id,
+                to: this.to
+            }
+        });
+        document.dispatchEvent(closePortalEvent);
+    }
+};
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], HPortal.prototype, "_id", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Array)
+], HPortal.prototype, "_initialChildren", void 0);
+__decorate([
+    property({ type: String }),
+    __metadata("design:type", Object)
+], HPortal.prototype, "to", void 0);
+__decorate([
+    property({ type: Boolean }),
+    __metadata("design:type", Object)
+], HPortal.prototype, "disabled", void 0);
+HPortal = __decorate([
+    customElement('h-portal'),
+    __metadata("design:paramtypes", [])
+], HPortal);
+
+export { HPortal };
+//# sourceMappingURL=portal.js.map

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

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

package/build/esm/packages/phoenix/src/components/portal/portal_constants.d.ts

@@ -0,0 +1,10 @@
+import { HPortal } from './portal';
+export declare const PORTAL_EVENTS: {
+    open: string;
+    close: string;
+};
+declare global {
+    interface HTMLElementTagNameMap {
+        'h-portal': HPortal;
+    }
+}

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

@@ -0,0 +1,7 @@
+const PORTAL_EVENTS = {
+    open: `portal.open`,
+    close: 'portal.close'
+};
+
+export { PORTAL_EVENTS };
+//# sourceMappingURL=portal_constants.js.map

package/build/esm/packages/phoenix/src/components/portal/portal_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/components/portal/portal_target.d.ts

@@ -0,0 +1,13 @@
+import { PhoenixLightLitElement } from "../../core/phoenix_light_lit_element";
+import { TPortalEventData } from './portal_types';
+export declare class HPortalTarget extends PhoenixLightLitElement {
+    static portalTargetsNames: Set<string>;
+    name: string;
+    _portalElementsMap: Record<string, HTMLElement[]>;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    portalElements: ({ detail: { portalId, content, to } }: CustomEvent<TPortalEventData>) => void;
+    removeTeleportedItems: ({ detail: { portalId, to } }: CustomEvent<TPortalEventData>) => void;
+    doesDestinationMatch(destination: string): boolean;
+    allowOnlyOnePortalTargetWithName(): void;
+}

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

@@ -0,0 +1,74 @@
+import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.js';
+import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element.js';
+import { property, state, customElement } from 'lit/decorators';
+import { PORTAL_EVENTS } from './portal_constants.js';
+import { PortalTargetError } from './portal_target_error.js';
+
+var HPortalTarget_1;
+let HPortalTarget = HPortalTarget_1 = class HPortalTarget extends PhoenixLightLitElement {
+    constructor() {
+        super(...arguments);
+        this.name = '';
+        this._portalElementsMap = {};
+        this.portalElements = ({ detail: { portalId, content, to } }) => {
+            var _a;
+            if (!this.doesDestinationMatch(to))
+                return;
+            const newPortalElements = [...content].map((el) => this.appendChild(el));
+            const elementsInProtal = (_a = this._portalElementsMap[portalId]) !== null && _a !== void 0 ? _a : [];
+            this._portalElementsMap[portalId] = [...newPortalElements, ...elementsInProtal];
+        };
+        this.removeTeleportedItems = ({ detail: { portalId, to } }) => {
+            var _a;
+            if (!this.doesDestinationMatch(to))
+                return;
+            (_a = this._portalElementsMap[portalId]) === null || _a === void 0 ? void 0 : _a.forEach((el) => {
+                if (el.parentElement === this) {
+                    this.removeChild(el);
+                }
+            });
+            this._portalElementsMap[portalId] = [];
+        };
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.allowOnlyOnePortalTargetWithName();
+        document.addEventListener(PORTAL_EVENTS.open, this.portalElements, {
+            capture: true
+        });
+        document.addEventListener(PORTAL_EVENTS.close, this.removeTeleportedItems, {
+            capture: true
+        });
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        document.removeEventListener(PORTAL_EVENTS.open, this.portalElements);
+        document.removeEventListener(PORTAL_EVENTS.close, this.removeTeleportedItems);
+        HPortalTarget_1.portalTargetsNames.delete(this.name);
+    }
+    doesDestinationMatch(destination) {
+        return destination === this.name;
+    }
+    allowOnlyOnePortalTargetWithName() {
+        if (HPortalTarget_1.portalTargetsNames.has(this.name)) {
+            this.remove();
+            throw new PortalTargetError(`Portal target with name "${this.name}" already exists.`);
+        }
+        HPortalTarget_1.portalTargetsNames.add(this.name);
+    }
+};
+HPortalTarget.portalTargetsNames = new Set();
+__decorate([
+    property({ type: String }),
+    __metadata("design:type", Object)
+], HPortalTarget.prototype, "name", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], HPortalTarget.prototype, "_portalElementsMap", void 0);
+HPortalTarget = HPortalTarget_1 = __decorate([
+    customElement('h-portal-target')
+], HPortalTarget);
+
+export { HPortalTarget };
+//# sourceMappingURL=portal_target.js.map

package/build/esm/packages/phoenix/src/components/portal/portal_target.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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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_error.d.ts

@@ -0,0 +1,2 @@
+export declare class PortalTargetError extends Error {
+}

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

@@ -0,0 +1,5 @@
+class PortalTargetError extends Error {
+}
+
+export { PortalTargetError };
+//# sourceMappingURL=portal_target_error.js.map

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

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

package/build/esm/packages/phoenix/src/components/portal/portal_types.d.ts

@@ -0,0 +1,5 @@
+export declare type TPortalEventData = {
+    portalId: string;
+    to: string;
+    content: Element[];
+};

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

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

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

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

package/build/esm/packages/phoenix/src/{core/hello_button.js → hello_button.js}

@@ -1,4 +1,4 @@
-import { __decorate, __metadata } from '../../../../external/tslib/tslib.es6.js';
+import { __decorate, __metadata } from '../../../external/tslib/tslib.es6.js';
 import { LitElement, html, css } from 'lit';
 import { state, customElement } from 'lit/decorators';
 

package/build/esm/packages/phoenix/src/{core/hello_button.js.map → hello_button.js.map}

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

package/build/esm/packages/phoenix/src/index.d.ts

@@ -1,4 +1,6 @@
 export { ContextProviderController } from "./core/context/context_provider_controller";
 export { ContextConsumerController } from "./core/context/context_consumer_controller";
 export { PhoenixLightLitElement } from "./core/phoenix_light_lit_element";
-export { HelloButton } from './core/hello_button';
+export { HelloButton } from './hello_button';
+export { HPortal } from './components/portal/portal';
+export { HPortalTarget } from './components/portal/portal_target';

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

@@ -1,5 +1,7 @@
 export { ContextProviderController } from './core/context/context_provider_controller.js';
 export { ContextConsumerController } from './core/context/context_consumer_controller.js';
 export { PhoenixLightLitElement } from './core/phoenix_light_lit_element.js';
-export { HelloButton } from './core/hello_button.js';
+export { HelloButton } from './hello_button.js';
+export { HPortal } from './components/portal/portal.js';
+export { HPortalTarget } from './components/portal/portal_target.js';
 //# sourceMappingURL=index.js.map

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

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

package/build/esm/packages/star_core/build/esm/external/tslib/tslib.es6.js

@@ -1,4 +1,4 @@
-/******************************************************************************
+/*! *****************************************************************************
 Copyright (c) Microsoft Corporation.
 
 Permission to use, copy, modify, and/or distribute this software for any

package/package.json

@@ -2,7 +2,7 @@
   "name": "@shoper/phoenix_design_system",
   "packageManager": "yarn@3.2.0",
   "sideEffects": false,
-  "version": "0.1.3",
+  "version": "0.2.1",
   "description": "phoenix design system",
   "author": "zefirek",
   "license": "MIT",