@telesign/boreal-web-components 0.1.0-alpha.0

package/dist/cjs/app-globals-V2Kpy_OQ.js

@@ -0,0 +1,5 @@
+'use strict';
+
+const globalScripts = () => {};
+
+exports.globalScripts = globalScripts;

package/dist/cjs/attributes-RPVEtBdj.js

@@ -0,0 +1,90 @@
+'use strict';
+
+const STATES = {
+    DEFAULT: 'default',
+    ERROR: 'error',
+    DISABLED: 'disabled'};
+const STATUS_VARIANT = {
+    INFO: 'info'};
+
+/**
+ * Taken from StencilJS Ionic team
+ * This helper pass the attributes passed to components directly to the inner element
+ * e.g. <my-component aria-hidden="true">Text</my-component>
+ * will pass the aria-hidden to the inner element inside my-component
+ * <span { ...myComponentAttr }>Hidden</span>
+ */
+const inheritAttributes = (el, attributes = []) => {
+    const attributeObject = {};
+    attributes.forEach(attr => {
+        if (el.hasAttribute(attr)) {
+            const value = el.getAttribute(attr);
+            if (value !== null) {
+                attributeObject[attr] = value;
+            }
+            el.removeAttribute(attr);
+        }
+    });
+    return attributeObject;
+};
+const ariaAttributes = [
+    'role',
+    'aria-activedescendant',
+    'aria-atomic',
+    'aria-autocomplete',
+    'aria-braillelabel',
+    'aria-brailleroledescription',
+    'aria-busy',
+    'aria-checked',
+    'aria-colcount',
+    'aria-colindex',
+    'aria-colindextext',
+    'aria-colspan',
+    'aria-controls',
+    'aria-current',
+    'aria-describedby',
+    'aria-description',
+    'aria-details',
+    'aria-disabled',
+    'aria-errormessage',
+    'aria-expanded',
+    'aria-flowto',
+    'aria-haspopup',
+    'aria-hidden',
+    'aria-invalid',
+    'aria-keyshortcuts',
+    'aria-label',
+    'aria-labelledby',
+    'aria-level',
+    'aria-live',
+    'aria-multiline',
+    'aria-multiselectable',
+    'aria-orientation',
+    'aria-owns',
+    'aria-placeholder',
+    'aria-posinset',
+    'aria-pressed',
+    'aria-readonly',
+    'aria-relevant',
+    'aria-required',
+    'aria-roledescription',
+    'aria-rowcount',
+    'aria-rowindex',
+    'aria-rowindextext',
+    'aria-rowspan',
+    'aria-selected',
+    'aria-setsize',
+    'aria-sort',
+    'aria-valuemax',
+    'aria-valuemin',
+    'aria-valuenow',
+    'aria-valuetext',
+];
+const inheritAriaAttributes = (el, ignoreList) => {
+    let attributesToInherit = ariaAttributes;
+    return inheritAttributes(el, attributesToInherit);
+};
+
+exports.STATES = STATES;
+exports.STATUS_VARIANT = STATUS_VARIANT;
+exports.inheritAriaAttributes = inheritAriaAttributes;

package/dist/cjs/bds-banner.cjs.entry.js

@@ -0,0 +1,130 @@
+'use strict';
+
+var index = require('./index-Cdb66Tqj.js');
+var attributes = require('./attributes-RPVEtBdj.js');
+
+/**
+ * Ensure the given component instance has an auto-generated id if one wasn't provided.
+ * Designed to be called from `componentWillLoad` on a Stencil component.
+ */
+function createId(component) {
+    if (!component.idComponent)
+        component.idComponent = `bds-${Math.random().toString(36).substr(2, 9)}`;
+}
+/**
+ * Components can spread the result into their host.
+ */
+function getBaseAttributes(component) {
+    createId(component);
+    return {
+        id: component.idComponent,
+    };
+}
+
+const bdsBannerCss = () => `.bds-banner{position:relative;display:-ms-flexbox;display:flex;border:var(--boreal-spacing-4xs) solid var(--boreal-stroke-info-base);border-radius:var(--boreal-radius-xs);border-left:0;font-family:var(--boreal-typography-font-family-primary);height:100%;-webkit-transition:all 0.3s ease-out;transition:all 0.3s ease-out}.bds-banner__vertical-line{width:var(--boreal-spacing-2xs);border-top-left-radius:var(--boreal-radius-xs);border-bottom-left-radius:var(--boreal-radius-xs);background-color:var(--boreal-stroke-info-base)}.bds-banner__container{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;width:100%;gap:var(--boreal-spacing-xs);padding:var(--boreal-spacing-s)}.bds-banner__content{width:100%}.bds-banner__title{font-weight:var(--boreal-typography-font-weight-semibold);font-size:var(--boreal-typography-font-size-md);line-height:var(--boreal-typography-line-height-md)}.bds-banner__body{padding-top:var(--boreal-spacing-2xs);font-size:var(--boreal-typography-font-size-sm);line-height:var(--boreal-typography-line-height-sm)}.bds-banner__actions{padding-top:var(--boreal-spacing-s);min-height:0px}.bds-banner__actions:empty{display:none}.bds-banner__status-icon{font-size:var(--boreal-typography-font-size-md);line-height:var(--boreal-typography-line-height-md);margin-top:var(--boreal-spacing-3xs)}.bds-banner__close-icon{background:none;border:none;-ms-flex-item-align:start;align-self:start;font-size:var(--boreal-typography-font-size-md);line-height:var(--boreal-typography-line-height-md);color:var(--boreal-neutral-base);cursor:pointer}.bds-banner--info{border-color:var(--boreal-stroke-info-base);background-color:var(--boreal-ui-info-lighter)}.bds-banner--info .bds-banner__vertical-line{background-color:var(--boreal-stroke-info-base)}.bds-banner--info .bds-banner__status-icon{color:var(--boreal-stroke-info-base)}.bds-banner--success{border-color:var(--boreal-stroke-success-base);background-color:var(--boreal-ui-success-lighter)}.bds-banner--success .bds-banner__vertical-line{background-color:var(--boreal-stroke-success-base)}.bds-banner--success .bds-banner__status-icon{color:var(--boreal-stroke-success-base)}.bds-banner--warning{border-color:var(--boreal-stroke-warning);background-color:var(--boreal-ui-warning-lighter)}.bds-banner--warning .bds-banner__vertical-line{background-color:var(--boreal-stroke-warning)}.bds-banner--warning .bds-banner__status-icon{color:var(--boreal-stroke-warning)}.bds-banner--danger{border-color:var(--boreal-stroke-danger-base);background-color:var(--boreal-ui-danger-lighter)}.bds-banner--danger .bds-banner__vertical-line{background-color:var(--boreal-stroke-danger-base)}.bds-banner--danger .bds-banner__status-icon{color:var(--boreal-stroke-danger-base)}.bds-banner--closing{opacity:0;height:0}`;
+
+const BdsBanner = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.close = index.createEvent(this, "close");
+        this.inheritedAttributes = {};
+        /**
+         * Internal state tracking the banner's closing animation.
+         */
+        this.isClosing = false;
+        /**
+         * Controls the visibility of the banner. Set to false to hide the banner.
+         */
+        this.isOpen = true;
+        /**
+         * Unique identifier for the banner element.
+         */
+        this.idComponent = '';
+        /**
+         * Visual style variant: 'info', 'success', 'warning', or 'danger'.
+         * @default "info"
+         */
+        this.variant = attributes.STATUS_VARIANT.INFO;
+        /**
+         * Shows a close button that allows users to dismiss the banner.
+         * @default false
+         */
+        this.enableClose = false;
+        this.handleAnimationEnd = () => {
+            if (this.isClosing)
+                requestAnimationFrame(() => {
+                    this.isClosing = false;
+                    this.isOpen = false;
+                });
+        };
+    }
+    componentWillLoad() {
+        this.inheritedAttributes = {
+            ...attributes.inheritAriaAttributes(this.el),
+            ...getBaseAttributes(this),
+        };
+    }
+    /**
+     * Programmatic method to close the banner and emit the `close` event
+     */
+    async closeBanner() {
+        this.handleCloseBanner();
+    }
+    handleCloseBanner(e) {
+        if (e !== undefined)
+            e.preventDefault();
+        this.isClosing = true;
+        this.close.emit();
+    }
+    handleEscapeKeyClose(e) {
+        if (!this.enableClose)
+            return;
+        if (e.key === 'Escape')
+            this.handleCloseBanner();
+    }
+    getIconName() {
+        const iconMap = {
+            info: 'bds-icon-info-circle-fill',
+            success: 'bds-icon-check-circle-fill',
+            warning: 'bds-icon-info-major-triangle-up-fill',
+            danger: 'bds-icon-alert-circle-fill',
+        };
+        if (iconMap[this.variant] === undefined)
+            return iconMap['info'];
+        return iconMap[this.variant];
+    }
+    getAttributes() {
+        return {
+            ...this.inheritedAttributes,
+            role: 'alert',
+            'aria-describedby': this.isOpen ? 'bds-banner__content' : null,
+            'aria-live': 'polite',
+            'aria-hidden': `${!this.isOpen}`,
+            tabIndex: this.isOpen ? 0 : -1,
+        };
+    }
+    getStyles() {
+        return {
+            'bds-banner': true,
+            [`bds-banner--${this.variant}`]: true,
+            'bds-banner--closing': this.isClosing,
+        };
+    }
+    renderCloseIcon() {
+        return (
+        // TODO how to pass this inner aria attr from outside?
+        index.h("button", { role: "close-button", class: "bds-banner__close-icon", "aria-label": "Alert close button", onClick: e => this.handleCloseBanner(e) }, index.h("em", { class: "bds-icon-close" })));
+    }
+    render() {
+        if (!this.isOpen)
+            return;
+        const closeIcon = this.renderCloseIcon();
+        const classes = this.getStyles();
+        const iconName = this.getIconName();
+        return (index.h(index.Host, { class: classes, ...this.getAttributes(), onTransitionEnd: this.handleAnimationEnd, onKeyDown: (e) => this.handleEscapeKeyClose(e) }, index.h("div", { class: "bds-banner__vertical-line" }), index.h("div", { class: "bds-banner__container" }, index.h("div", { class: "bds-banner__status-icon", role: "status", "aria-live": "polite", "aria-label": `status ${this.variant}` }, index.h("em", { "aria-hidden": "true", class: iconName })), index.h("div", { class: "bds-banner__content" }, index.h("div", { class: "bds-banner__title" }, index.h("slot", { name: "title" })), index.h("div", { class: "bds-banner__body" }, index.h("slot", null)), index.h("div", { class: "bds-banner__actions" }, index.h("slot", { name: "actions" }))), this.enableClose && closeIcon)));
+    }
+    get el() { return index.getElement(this); }
+};
+BdsBanner.style = bdsBannerCss();
+
+exports.bds_banner = BdsBanner;

package/dist/cjs/bds-typography.cjs.entry.js

@@ -0,0 +1,167 @@
+'use strict';
+
+var index = require('./index-Cdb66Tqj.js');
+var attributes = require('./attributes-RPVEtBdj.js');
+
+const ALIGNMENT = {
+    START: 'start'};
+
+const SIZES = {
+    XS: 'xs',
+    S: 'sm',
+    M: 'md',
+    L: 'lg',
+    XL: 'xl',
+};
+
+const VARIANT_TYPOGRAPHY = {
+    DISPLAY: 'display',
+    LINK: 'link'};
+const TAG_ELEMENT = {
+    P: 'p',
+    A: 'a'};
+
+/*
+ * LINK consts
+ */
+const FILENAME = 'download';
+/*
+ * Variant map to apply size, state, etc, styles based on variant type
+ */
+const VARIANT_CONFIG = {
+    link: {
+        states: [attributes.STATES.DISABLED /* STATES.VISITED, STATES.HOVER, STATES.ACTIVE, STATES.FOCUS */],
+        size: [SIZES.S, SIZES.M],
+    },
+    label: {
+        states: [attributes.STATES.DISABLED],
+        isRequired: true,
+        canUseTooltip: true,
+    },
+    heading: { canUseTooltip: true },
+    subheading: { canUseTooltip: true },
+    helper: { states: [attributes.STATES.ERROR] },
+    display: { size: [SIZES.XS, SIZES.S, SIZES.M, SIZES.L, SIZES.XL] },
+};
+/*
+ * ATTRIBUTE MAP
+ */
+const getAttributesByTag = (comp, tagName) => {
+    const ATTR_MAP = {
+        a: {
+            href: comp.state !== attributes.STATES.DISABLED ? comp.sanitizedHref : null,
+            target: comp.target,
+            download: comp.isDownloadable ? comp.filename : null,
+            rel: comp.target === '_blank' ? 'noopener noreferrer' : undefined,
+        },
+        label: {
+            htmlFor: comp.htmlFor,
+        },
+    };
+    return ATTR_MAP[tagName] || {};
+};
+
+const bdsTypographyCss = () => `.bds-typography{-webkit-box-sizing:border-box;box-sizing:border-box;font-family:var(--boreal-typography-font-family-primary);font-weight:var(--boreal-typography-font-weight-regular)}.bds-typography__required-indicator{color:var(--boreal-icon-danger-base);font-weight:var(--boreal-typography-font-weight-regular)}.bds-typography__info-icon{color:var(--boreal-icon-default-light)}.bds-typography--heading,.bds-typography--subheading{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;gap:var(--boreal-spacing-3xs)}.bds-typography--label{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;gap:var(--boreal-spacing-3xs)}.bds-typography--display{display:block}.bds-typography--caption,.bds-typography--helper,.bds-typography--link{display:inline-block}.bds-typography--caption{font-size:var(--boreal-typography-font-size-xs);font-weight:var(--boreal-typography-font-weight-regular);line-height:var(--boreal-typography-line-height-md);color:var(--boreal-text-default-light)}.bds-typography--helper{font-size:var(--boreal-typography-font-size-xs);font-weight:var(--boreal-typography-font-weight-regular);line-height:var(--boreal-typography-line-height-sm);color:var(--boreal-text-default-light)}.bds-typography--link{font-size:var(--boreal-typography-font-size-sm);font-weight:var(--boreal-typography-font-weight-regular);line-height:var(--boreal-typography-line-height-md);color:var(--boreal-text-primary-base);text-decoration:none}.bds-typography--link:hover{text-decoration:underline}.bds-typography--link:visited{color:var(--boreal-text-primary-base)}.bds-typography--link:active{color:var(--boreal-text-primary-dark)}.bds-typography--link.bds-typography--size-sm{font-size:var(--boreal-typography-font-size-xs)}.bds-typography--link.bds-typography--size-md{font-size:var(--boreal-typography-font-size-sm)}.bds-typography--code{font-family:var(--boreal-typography-font-family-secondary);font-size:var(--boreal-typography-font-size-xs);font-weight:var(--boreal-typography-font-weight-regular);color:var(--boreal-text-default);line-height:var(--boreal-typography-line-height-md);overflow-wrap:break-word;background-color:var(--boreal-bg-neutral);padding:var(--boreal-spacing-3xs) var(--boreal-spacing-xs);border-radius:var(--boreal-radius-xs);display:inline;box-decoration-break:clone;-webkit-box-decoration-break:clone}.bds-typography--label{font-size:var(--boreal-typography-font-size-xs);font-weight:var(--boreal-typography-font-weight-semibold);line-height:var(--boreal-typography-line-height-md);color:var(--boreal-text-default-darker)}.bds-typography--display{font-weight:var(--boreal-typography-font-weight-regular);color:var(--boreal-text-default)}.bds-typography--display.bds-typography--size-sm{font-size:var(--boreal-typography-font-size-xl);line-height:var(--boreal-typography-line-height-xl)}.bds-typography--display.bds-typography--size-md{font-size:var(--boreal-typography-font-size-2xl);line-height:var(--boreal-typography-line-height-2xl)}.bds-typography--display.bds-typography--size-lg{font-size:var(--boreal-typography-font-size-3xl);line-height:var(--boreal-typography-line-height-3xl);font-weight:var(--boreal-typography-font-weight-light)}.bds-typography--display.bds-typography--size-xl{font-size:var(--boreal-typography-font-size-4xl);line-height:var(--boreal-typography-line-height-4xl);font-weight:var(--boreal-typography-font-weight-light)}.bds-typography--heading{font-size:var(--boreal-typography-font-size-lg);line-height:var(--boreal-typography-line-height-lg);font-weight:var(--boreal-typography-font-weight-regular);color:var(--boreal-text-default)}.bds-typography h1.bds-typography--heading{font-weight:var(--boreal-typography-font-weight-regular);font-size:var(--boreal-typography-font-size-4xl);line-height:var(--boreal-typography-line-height-4xl)}.bds-typography h2.bds-typography--heading{font-weight:var(--boreal-typography-font-weight-regular);font-size:var(--boreal-typography-font-size-3xl);line-height:var(--boreal-typography-line-height-3xl)}.bds-typography h3.bds-typography--heading{font-weight:var(--boreal-typography-font-weight-regular);font-size:var(--boreal-typography-font-size-2xl);line-height:var(--boreal-typography-line-height-2xl)}.bds-typography h4.bds-typography--heading{font-weight:var(--boreal-typography-font-weight-regular);font-size:var(--boreal-typography-font-size-xl);line-height:var(--boreal-typography-line-height-xl)}.bds-typography h5.bds-typography--heading{font-weight:var(--boreal-typography-font-weight-regular);font-size:var(--boreal-typography-font-size-lg);line-height:var(--boreal-typography-line-height-lg)}.bds-typography h6.bds-typography--heading{font-size:var(--boreal-typography-font-size-md);font-weight:var(--boreal-typography-font-weight-semibold);line-height:var(--boreal-typography-line-height-md)}.bds-typography--subheading{font-size:var(--boreal-typography-font-size-md);line-height:var(--boreal-typography-line-height-md);font-weight:var(--boreal-typography-font-weight-semibold)}.bds-typography--align-start{text-align:start}.bds-typography--align-center{text-align:center}.bds-typography--align-end{text-align:end}.bds-typography--align-inherit{text-align:inherit}.bds-typography--error{color:var(--boreal-text-danger-base)}.bds-typography--disabled{color:var(--boreal-text-disabled);pointer-events:none;cursor:not-allowed}.bds-typography--disabled .bds-typography__required-indicator{color:var(--boreal-text-danger-light)}.bds-typography--ellipsis{display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.bds-typography--ellipsis-multiline{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;width:100%}`;
+
+const BdsTypography = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.inheritedAttributes = {};
+        /** Typography visual variant. */
+        this.variant = VARIANT_TYPOGRAPHY.DISPLAY;
+        /** Typography size token. */
+        this.size = SIZES.M;
+        /** Visual state (if supported by variant). */
+        this.state = attributes.STATES.DEFAULT;
+        /** Additional custom CSS class. */
+        this.customClass = '';
+        /** HTML tag used for rendering. */
+        this.element = TAG_ELEMENT.P;
+        /** Text alignment. */
+        this.align = ALIGNMENT.START;
+        /** Enables text ellipsis. */
+        this.ellipsis = false;
+        /** Max lines when ellipsis is enabled. */
+        this.maxLines = 1;
+        /** Tooltip text (variant must support it). */
+        this.tooltipText = '';
+        /** Marks the field as required. */
+        this.isRequired = false;
+        /** For attribute when rendered as a label. */
+        this.htmlFor = undefined;
+        /** Link href when rendered as anchor. */
+        this.href = null;
+        /** Anchor target. */
+        this.target = null;
+        /** Enables download behavior for anchor. */
+        this.isDownloadable = false;
+        /** Suggested download filename. */
+        this.filename = FILENAME;
+        /** Sanitized href for security. */
+        this.sanitizedHref = '';
+    }
+    async updateSanitizedHref() {
+        if (this.getTagName === 'a' && this.href !== null) {
+            const { sanitizeUrl } = await Promise.resolve().then(function () { return require('./index-CD9v53WJ.js'); }).then(function (n) { return n.index; });
+            this.sanitizedHref = sanitizeUrl(this.href);
+        }
+        else
+            this.sanitizedHref = '';
+    }
+    async componentWillLoad() {
+        if (this.getTagName === TAG_ELEMENT.A && this.href !== null)
+            await this.updateSanitizedHref();
+        this.inheritedAttributes = {
+            ...attributes.inheritAriaAttributes(this.el),
+        };
+    }
+    get getTagName() {
+        if (this.variant === VARIANT_TYPOGRAPHY.LINK)
+            return TAG_ELEMENT.A;
+        return this.element.toLowerCase();
+    }
+    getVariantConfig() {
+        return VARIANT_CONFIG[this.variant] ?? {};
+    }
+    getAccessibilityTags() {
+        const { isRequired = null } = this.getVariantConfig();
+        const isInteractiveTag = ['a', 'label'].includes(this.getTagName);
+        return {
+            'aria-required': this.isRequired && isRequired,
+            'aria-disabled': this.state === attributes.STATES.DISABLED && isInteractiveTag,
+        };
+    }
+    getVariantStateStyles() {
+        const config = this.getVariantConfig();
+        return {
+            [`bds-typography--${this.variant}`]: true,
+            [`bds-typography--align-${this.align}`]: true,
+            [`bds-typography--${this.state}`]: !!(config?.states && config?.states.includes(this.state)),
+            [`bds-typography--size-${this.size}`]: !!(config?.size && config?.size.includes(this.size)),
+            'bds-typography--required': !!(config?.isRequired && this.isRequired),
+            'bds-typography--ellipsis': this.ellipsis && this.maxLines <= 1,
+            'bds-typography--ellipsis-multiline': this.ellipsis && this.maxLines > 1,
+            [this.customClass]: this.customClass !== '',
+        };
+    }
+    render() {
+        const TagName = this.getTagName;
+        const attributes = {
+            ...getAttributesByTag(this, TagName),
+            ...this.inheritedAttributes,
+            ...this.getAccessibilityTags(),
+        };
+        const classes = this.getVariantStateStyles();
+        const { canUseTooltip = null, isRequired = null } = this.getVariantConfig();
+        return (index.h(index.Host, { key: '6091692b1cb6bf1d3295f0834c8d25425633d65a', class: "bds-typography" }, index.h(TagName, { key: '0cc91c35fa1cc36c99101a79fae0c8b5cf44de43', class: classes, style: { webkitLineClamp: this.maxLines }, ...attributes }, index.h("slot", { key: '973848fba8211cb5ef869e0e48fb1806bd5efdec' }), this.isRequired && isRequired && (index.h("em", { key: 'dd89574e9dedd55905ae4c7bcd57604f26fbd03b', class: "bds-typography__required-indicator", "aria-hidden": "true" }, "*")), this.tooltipText && canUseTooltip && index.h("em", { key: '473b0de17bd095b97d54d24d2f3aa75f8a8e4922', class: "bds-typography__info-icon bds-icon-info-circle" }))));
+    }
+    get el() { return index.getElement(this); }
+    static get watchers() { return {
+        "href": [{
+                "updateSanitizedHref": 0
+            }]
+    }; }
+};
+BdsTypography.style = bdsTypographyCss();
+
+exports.bds_typography = BdsTypography;

package/dist/cjs/boreal-web-components.cjs.js

@@ -0,0 +1,46 @@
+'use strict';
+
+var index = require('./index-Cdb66Tqj.js');
+var appGlobals = require('./app-globals-V2Kpy_OQ.js');
+
+var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
+/*
+ Stencil Client Patch Browser v4.42.1 | MIT Licensed | https://stenciljs.com
+ */
+
+var patchBrowser = () => {
+  {
+    patchCloneNodeFix(index.H.prototype);
+  }
+  const importMeta = (typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.tagName.toUpperCase() === 'SCRIPT' && _documentCurrentScript.src || new URL('boreal-web-components.cjs.js', document.baseURI).href));
+  const opts = {};
+  if (importMeta !== "") {
+    opts.resourcesUrl = new URL(".", importMeta).href;
+  }
+  return index.promiseResolve(opts);
+};
+var patchCloneNodeFix = (HTMLElementPrototype) => {
+  const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;
+  HTMLElementPrototype.cloneNode = function(deep) {
+    if (this.nodeName === "TEMPLATE") {
+      return nativeCloneNodeFn.call(this, deep);
+    }
+    const clonedNode = nativeCloneNodeFn.call(this, false);
+    const srcChildNodes = this.childNodes;
+    if (deep) {
+      for (let i = 0; i < srcChildNodes.length; i++) {
+        if (srcChildNodes[i].nodeType !== 2) {
+          clonedNode.appendChild(srcChildNodes[i].cloneNode(true));
+        }
+      }
+    }
+    return clonedNode;
+  };
+};
+
+patchBrowser().then(async (options) => {
+  await appGlobals.globalScripts();
+  return index.bootstrapLazy([["bds-banner.cjs",[[260,"bds-banner",{"idComponent":[1,"id-component"],"variant":[1],"enableClose":[4,"enable-close"],"isClosing":[32],"isOpen":[32],"closeBanner":[64]}]]],["bds-typography.cjs",[[260,"bds-typography",{"variant":[513],"size":[513],"state":[513],"customClass":[1,"custom-class"],"element":[1],"align":[1],"ellipsis":[4],"maxLines":[2,"max-lines"],"tooltipText":[1,"tooltip-text"],"isRequired":[516,"is-required"],"htmlFor":[1,"html-for"],"href":[1],"target":[1],"isDownloadable":[4,"is-downloadable"],"filename":[1],"sanitizedHref":[32]},null,{"href":[{"updateSanitizedHref":0}]}]]],["my-component.cjs",[[0,"my-component",{"first":[1],"middle":[1],"last":[1]}]]]], options);
+});
+
+exports.setNonce = index.setNonce;

package/dist/cjs/index-CD9v53WJ.js

@@ -0,0 +1,133 @@
+'use strict';
+
+function _mergeNamespaces(n, m) {
+    m.forEach(function (e) {
+        e && typeof e !== 'string' && !Array.isArray(e) && Object.keys(e).forEach(function (k) {
+            if (k !== 'default' && !(k in n)) {
+                var d = Object.getOwnPropertyDescriptor(e, k);
+                Object.defineProperty(n, k, d.get ? d : {
+                    enumerable: true,
+                    get: function () { return e[k]; }
+                });
+            }
+        });
+    });
+    return Object.freeze(n);
+}
+
+var dist = {};
+
+var constants = {};
+
+var hasRequiredConstants;
+
+function requireConstants () {
+	if (hasRequiredConstants) return constants;
+	hasRequiredConstants = 1;
+	Object.defineProperty(constants, "__esModule", { value: true });
+	constants.BLANK_URL = constants.relativeFirstCharacters = constants.whitespaceEscapeCharsRegex = constants.urlSchemeRegex = constants.ctrlCharactersRegex = constants.htmlCtrlEntityRegex = constants.htmlEntitiesRegex = constants.invalidProtocolRegex = void 0;
+	constants.invalidProtocolRegex = /^([^\w]*)(javascript|data|vbscript)/im;
+	constants.htmlEntitiesRegex = /&#(\w+)(^\w|;)?/g;
+	constants.htmlCtrlEntityRegex = /&(newline|tab);/gi;
+	constants.ctrlCharactersRegex = /[\u0000-\u001F\u007F-\u009F\u2000-\u200D\uFEFF]/gim;
+	constants.urlSchemeRegex = /^.+(:|:)/gim;
+	constants.whitespaceEscapeCharsRegex = /(\\|%5[cC])((%(6[eE]|72|74))|[nrt])/g;
+	constants.relativeFirstCharacters = [".", "/"];
+	constants.BLANK_URL = "about:blank";
+	return constants;
+}
+
+var hasRequiredDist;
+
+function requireDist () {
+	if (hasRequiredDist) return dist;
+	hasRequiredDist = 1;
+	Object.defineProperty(dist, "__esModule", { value: true });
+	dist.sanitizeUrl = sanitizeUrl;
+	var constants_1 = requireConstants();
+	function isRelativeUrlWithoutProtocol(url) {
+	    return constants_1.relativeFirstCharacters.indexOf(url[0]) > -1;
+	}
+	function decodeHtmlCharacters(str) {
+	    var removedNullByte = str.replace(constants_1.ctrlCharactersRegex, "");
+	    return removedNullByte.replace(constants_1.htmlEntitiesRegex, function (match, dec) {
+	        return String.fromCharCode(dec);
+	    });
+	}
+	function isValidUrl(url) {
+	    return URL.canParse(url);
+	}
+	function decodeURI(uri) {
+	    try {
+	        return decodeURIComponent(uri);
+	    }
+	    catch (e) {
+	        // Ignoring error
+	        // It is possible that the URI contains a `%` not associated
+	        // with URI/URL-encoding.
+	        return uri;
+	    }
+	}
+	function sanitizeUrl(url) {
+	    if (!url) {
+	        return constants_1.BLANK_URL;
+	    }
+	    var charsToDecode;
+	    var decodedUrl = decodeURI(url.trim());
+	    do {
+	        decodedUrl = decodeHtmlCharacters(decodedUrl)
+	            .replace(constants_1.htmlCtrlEntityRegex, "")
+	            .replace(constants_1.ctrlCharactersRegex, "")
+	            .replace(constants_1.whitespaceEscapeCharsRegex, "")
+	            .trim();
+	        decodedUrl = decodeURI(decodedUrl);
+	        charsToDecode =
+	            decodedUrl.match(constants_1.ctrlCharactersRegex) ||
+	                decodedUrl.match(constants_1.htmlEntitiesRegex) ||
+	                decodedUrl.match(constants_1.htmlCtrlEntityRegex) ||
+	                decodedUrl.match(constants_1.whitespaceEscapeCharsRegex);
+	    } while (charsToDecode && charsToDecode.length > 0);
+	    var sanitizedUrl = decodedUrl;
+	    if (!sanitizedUrl) {
+	        return constants_1.BLANK_URL;
+	    }
+	    if (isRelativeUrlWithoutProtocol(sanitizedUrl)) {
+	        return sanitizedUrl;
+	    }
+	    // Remove any leading whitespace before checking the URL scheme
+	    var trimmedUrl = sanitizedUrl.trimStart();
+	    var urlSchemeParseResults = trimmedUrl.match(constants_1.urlSchemeRegex);
+	    if (!urlSchemeParseResults) {
+	        return sanitizedUrl;
+	    }
+	    var urlScheme = urlSchemeParseResults[0].toLowerCase().trim();
+	    if (constants_1.invalidProtocolRegex.test(urlScheme)) {
+	        return constants_1.BLANK_URL;
+	    }
+	    var backSanitized = trimmedUrl.replace(/\\/g, "/");
+	    // Handle special cases for mailto: and custom deep-link protocols
+	    if (urlScheme === "mailto:" || urlScheme.includes("://")) {
+	        return backSanitized;
+	    }
+	    // For http and https URLs, perform additional validation
+	    if (urlScheme === "http:" || urlScheme === "https:") {
+	        if (!isValidUrl(backSanitized)) {
+	            return constants_1.BLANK_URL;
+	        }
+	        var url_1 = new URL(backSanitized);
+	        url_1.protocol = url_1.protocol.toLowerCase();
+	        url_1.hostname = url_1.hostname.toLowerCase();
+	        return url_1.toString();
+	    }
+	    return backSanitized;
+	}
+	return dist;
+}
+
+var distExports = requireDist();
+
+var index = /*#__PURE__*/_mergeNamespaces({
+    __proto__: null
+}, [distExports]);
+
+exports.index = index;