@sme.up/ketchup 9.1.0 → 9.3.0

package/dist/cjs/f-text-field-2fac8078.js

@@ -0,0 +1,216 @@
+'use strict';
+
+const index = require('./index-8f2f4159.js');
+const kupManager = require('./kup-manager-c63f4fb9.js');
+
+const dom = document.documentElement;
+/*-------------------------------------------------*/
+/*                C o m p o n e n t                */
+/*-------------------------------------------------*/
+const FTextField = (props, children) => {
+    return (index.h("div", Object.assign({ class: `f-text-field ${props.danger ? 'kup-danger' : ''} ${props.fullHeight ? 'kup-full-height' : ''} ${props.fullWidth ? 'kup-full-width' : ''}  ${props.info ? 'kup-info' : ''} ${props.secondary ? 'kup-secondary' : ''} ${props.shaped ? 'kup-shaped' : ''} ${props.success ? 'kup-success' : ''} ${props.warning ? 'kup-warning' : ''}  ${props.wrapperClass ? props.wrapperClass : ''}` }, props.dataSet, { id: props.id, title: props.title }),
+        props.leadingLabel || props.trailingLabel ? (index.h("div", { class: `mdc-form-field ${props.leadingLabel ? 'mdc-form-field--align-end' : ''}` }, [
+            setContent(props),
+            setHelper(props),
+            index.h("label", null, props.label),
+        ])) : ([setContent(props), setHelper(props)]),
+        children));
+};
+/*-------------------------------------------------*/
+/*                  M e t h o d s                  */
+/*-------------------------------------------------*/
+function setContent(props) {
+    var _a, _b;
+    const isOutlined = props.textArea || props.outlined;
+    let labelEl;
+    let iconEl;
+    if (props.label && !props.leadingLabel && !props.trailingLabel) {
+        labelEl = (index.h("label", { class: "mdc-floating-label", htmlFor: "kup-input" }, props.label));
+    }
+    if (props.icon) {
+        let iconStyle;
+        let iconClass = '';
+        if (Object.values(kupManager.KupThemeIconValues).indexOf(props.icon) > -1) {
+            iconClass = props.icon.replace('--', '');
+        }
+        else {
+            let svg = `url('${index.getAssetPath(`./assets/svg/${props.icon}.svg`)}') no-repeat center`;
+            iconStyle = {
+                mask: svg,
+                webkitMask: svg,
+            };
+        }
+        iconEl = (index.h("span", { style: iconStyle, onClick: props.onIconClick, class: `mdc-text-field__icon kup-icon action ${iconClass}` }));
+    }
+    const classObj = {
+        'is-clearable': props.isClearable,
+        'mdc-text-field': true,
+        'mdc-text-field--disabled': props.disabled,
+        'mdc-text-field--filled': !props.fullWidth && !isOutlined,
+        'mdc-text-field--no-label': !props.label,
+        'mdc-text-field--fullwidth': props.fullWidth,
+        'mdc-text-field--outlined': isOutlined,
+        'mdc-text-field--textarea': props.textArea,
+        'mdc-text-field--with-leading-icon': props.icon && !props.trailingIcon,
+        'mdc-text-field--with-trailing-icon': props.icon && props.trailingIcon,
+    };
+    let value = props.value;
+    let inputType = (_a = props.inputType) !== null && _a !== void 0 ? _a : 'text';
+    let persManageForNumberFormat = false;
+    if (props.inputType === 'number' &&
+        ((props.decimals && props.decimals > 0) || props.group)) {
+        inputType = 'text';
+        persManageForNumberFormat = true;
+    }
+    if (props.inputType === 'number') {
+        const options = {
+            allowNegative: (_b = props.allowNegative) !== null && _b !== void 0 ? _b : true,
+            decimal: props.decimals,
+            group: props.group,
+            integer: props.integers,
+        };
+        value = formatValue(value, options, false);
+    }
+    return (index.h("div", { class: classObj },
+        props.textArea && props.maxLength ? (index.h("div", { class: "mdc-text-field-character-counter" },
+            "'0 / ' + ",
+            props.maxLength)) : undefined,
+        !props.trailingIcon ? iconEl : undefined,
+        props.textArea ? (index.h("span", { class: "mdc-text-field__resizer" },
+            index.h("textarea", { class: "mdc-text-field__input", disabled: props.disabled, readOnly: props.readOnly, maxlength: props.maxLength, value: value, onBlur: props.onBlur, onClick: props.onClick, onChange: props.onChange, onFocus: props.onFocus, onInput: props.onInput, onKeyDown: props.onKeyDown }))) : (index.h("input", { inputmode: props.inputMode ? props.inputMode : undefined, type: inputType, step: props.step, min: props.min, max: props.max, name: props.name, class: "mdc-text-field__input", disabled: props.disabled, readOnly: props.readOnly, placeholder: props.fullWidth && !props.outlined
+                ? props.label
+                : undefined, maxlength: props.maxLength, size: props.size, value: value, onBlur: (e) => {
+                var _a;
+                if (persManageForNumberFormat) {
+                    const options = {
+                        allowNegative: (_a = props.allowNegative) !== null && _a !== void 0 ? _a : true,
+                        decimal: props.decimals,
+                        group: props.group,
+                        integer: props.integers,
+                    };
+                    e.target.value = formatValue(e.target.value, options, true);
+                }
+                if (props.onBlur) {
+                    props.onBlur(e);
+                }
+            }, onChange: (e) => {
+                var _a;
+                if (persManageForNumberFormat) {
+                    const options = {
+                        allowNegative: (_a = props.allowNegative) !== null && _a !== void 0 ? _a : true,
+                        decimal: props.decimals,
+                        group: props.group,
+                        integer: props.integers,
+                    };
+                    if (props.min !== undefined &&
+                        props.min !== null &&
+                        props.min >
+                            parseFloat(e.target.value)) {
+                        e.target.value =
+                            formatValue(props.min.toString(), options, true);
+                    }
+                    else if (props.max !== undefined &&
+                        props.max !== null &&
+                        props.max <
+                            parseFloat(e.target.value)) {
+                        e.target.value =
+                            formatValue(props.max.toString(), options, true);
+                    }
+                    else {
+                        e.target.value =
+                            formatValue(e.target.value, options, true);
+                    }
+                }
+                else {
+                    if (props.min !== undefined &&
+                        props.min !== null &&
+                        props.min >
+                            parseFloat(e.target.value)) {
+                        e.target.value =
+                            props.min.toString();
+                    }
+                    else if (props.max !== undefined &&
+                        props.max !== null &&
+                        props.max <
+                            parseFloat(e.target.value)) {
+                        e.target.value =
+                            props.max.toString();
+                    }
+                }
+                if (props.onChange) {
+                    props.onChange(e);
+                }
+            }, onClick: props.onClick, onFocus: props.onFocus, onInput: props.onInput, onKeyDown: props.onKeyDown, onKeyPress: (e) => {
+                var _a;
+                if (!persManageForNumberFormat) {
+                    return;
+                }
+                if (e.ctrlKey) {
+                    return;
+                }
+                if (e.key.length > 1) {
+                    return;
+                }
+                const options = {
+                    allowNegative: (_a = props.allowNegative) !== null && _a !== void 0 ? _a : true,
+                    decimal: props.decimals,
+                    group: props.group,
+                    integer: props.integers,
+                };
+                let component = e.target;
+                let value = component.value;
+                let beginVal = value.substring(0, component.selectionStart);
+                let endVal = value.substring(component.selectionEnd, component.selectionEnd + value.length - 1);
+                let val = beginVal + e.key + endVal;
+                if (!dom.ketchup.math.matchNumericValueWithOptions(val, options)) {
+                    e.preventDefault();
+                    return;
+                }
+            } })),
+        props.isClearable ? (index.h("span", { class: `mdc-text-field__icon kup-icon ${kupManager.KupThemeIconValues.CLEAR.replace('--', '')}`, onClick: props.onClearIconClick })) : undefined,
+        props.trailingIcon ? iconEl : undefined,
+        !props.fullWidth && !isOutlined ? labelEl : undefined,
+        isOutlined ? (index.h("div", { class: "mdc-notched-outline" },
+            index.h("div", { class: "mdc-notched-outline__leading" }),
+            index.h("div", { class: "mdc-notched-outline__notch" }, labelEl),
+            index.h("div", { class: "mdc-notched-outline__trailing" }))) : (index.h("span", { class: "mdc-line-ripple" }))));
+}
+function setHelper(props) {
+    if (props.helperEnabled !== false) {
+        if (props.helper) {
+            const classObj = {
+                'mdc-text-field-helper-text': true,
+                'mdc-text-field-helper-text--persistent': !props.helperWhenFocused,
+            };
+            return (index.h("div", { class: "mdc-text-field-helper-line" },
+                index.h("div", { class: classObj }, props.helper),
+                props.hiddenCounter !== true &&
+                    props.maxLength &&
+                    !props.textArea ? (index.h("div", { class: "mdc-text-field-character-counter" },
+                    "'0 / ' + ",
+                    props.maxLength.toString())) : undefined));
+        }
+        else {
+            if (props.hiddenCounter !== true &&
+                props.maxLength &&
+                !props.textArea) {
+                return (index.h("div", { class: "mdc-text-field-helper-line" },
+                    index.h("div", { class: "mdc-text-field-character-counter" },
+                        "'0 / ' + ",
+                        props.maxLength)));
+            }
+        }
+    }
+}
+const formatValue = function (value, options, inputIsLocalized) {
+    let formatedValue = value;
+    if (!formatedValue) {
+        return formatedValue;
+    }
+    if (formatedValue == '-') {
+        return '';
+    }
+    return dom.ketchup.math.format(formatedValue, dom.ketchup.math.createFormatPattern(options.group, options.decimal), inputIsLocalized);
+};
+
+exports.FTextField = FTextField;

package/dist/cjs/{f-text-field-mdc-4fda9705.js → f-text-field-mdc-08a06162.js}

@@ -2544,26 +2544,26 @@ var MDCFormField = /** @class */ (function (_super) {
  * @see https://material-components.github.io/material-components-web-catalog/#/component/text-field
  */
 function FTextFieldMDC(el) {
-  const component = new MDCTextField(el.querySelector('.mdc-text-field'));
-  const form = el.querySelector('.mdc-form-field');
-  const helper = el.querySelector('.mdc-text-field-helper-text');
-  const counter = el.querySelector('.mdc-text-field-character-counter');
-  const icon = el.querySelector('.mdc-text-field-icon');
-  if (form) {
-    const formField = MDCFormField.attachTo(form);
-    if (formField) {
-      formField.input = component;
+    const component = new MDCTextField(el.querySelector('.mdc-text-field'));
+    const form = el.querySelector('.mdc-form-field');
+    const helper = el.querySelector('.mdc-text-field-helper-text');
+    const counter = el.querySelector('.mdc-text-field-character-counter');
+    const icon = el.querySelector('.mdc-text-field-icon');
+    if (form) {
+        const formField = MDCFormField.attachTo(form);
+        if (formField) {
+            formField.input = component;
+        }
+    }
+    if (helper) {
+        new MDCTextFieldHelperText(helper);
+    }
+    if (counter) {
+        new MDCTextFieldCharacterCounter(counter);
+    }
+    if (icon) {
+        new MDCTextFieldIcon(icon);
     }
-  }
-  if (helper) {
-    new MDCTextFieldHelperText(helper);
-  }
-  if (counter) {
-    new MDCTextFieldCharacterCounter(counter);
-  }
-  if (icon) {
-    new MDCTextFieldIcon(icon);
-  }
 }
 
 exports.FTextFieldMDC = FTextFieldMDC;

package/dist/cjs/{index-4b3a5567.js → index-8f2f4159.js}

@@ -54,6 +54,13 @@ const uniqueTime = (key, measureText) => {
     }
 };
 const HYDRATED_CSS = '{visibility:hidden}.hydrated{visibility:inherit}';
+/**
+ * Constant for styles to be globally applied to `slot-fb` elements for pseudo-slot behavior.
+ *
+ * Two cascading rules must be used instead of a `:not()` selector due to Stencil browser
+ * support as of Stencil v4.
+ */
+const SLOT_FB_CSS = 'slot-fb{display:contents}slot-fb[hidden]{display:none}';
 const XLINK_NS = 'http://www.w3.org/1999/xlink';
 /**
  * Default style mode id
@@ -364,6 +371,10 @@ const addStyle = (styleContainerNode, cmpMeta, mode) => {
                     }
                     styleContainerNode.insertBefore(styleElm, styleContainerNode.querySelector('link'));
                 }
+                // Add styles for `slot-fb` elements if we're using slots outside the Shadow DOM
+                if (cmpMeta.$flags$ & 4 /* CMP_FLAGS.hasSlotRelocation */) {
+                    styleElm.innerHTML += SLOT_FB_CSS;
+                }
                 if (appliedStyles) {
                     appliedStyles.add(scopeId);
                 }
@@ -494,11 +505,19 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
                 // except for the first character, we keep the event name case
                 memberName = ln[2] + memberName.slice(3);
             }
-            if (oldValue) {
-                plt.rel(elm, memberName, oldValue, false);
-            }
-            if (newValue) {
-                plt.ael(elm, memberName, newValue, false);
+            if (oldValue || newValue) {
+                // Need to account for "capture" events.
+                // If the event name ends with "Capture", we'll update the name to remove
+                // the "Capture" suffix and make sure the event listener is setup to handle the capture event.
+                const capture = memberName.endsWith(CAPTURE_EVENT_SUFFIX);
+                // Make sure we only replace the last instance of "Capture"
+                memberName = memberName.replace(CAPTURE_EVENT_REGEX, '');
+                if (oldValue) {
+                    plt.rel(elm, memberName, oldValue, capture);
+                }
+                if (newValue) {
+                    plt.ael(elm, memberName, newValue, capture);
+                }
             }
         }
         else {
@@ -520,7 +539,11 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
                         elm[memberName] = newValue;
                     }
                 }
-                catch (e) { }
+                catch (e) {
+                    /**
+                     * in case someone tries to set a read-only property, e.g. "namespaceURI", we just ignore it
+                     */
+                }
             }
             /**
              * Need to manually update attribute if:
@@ -559,7 +582,14 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
     }
 };
 const parseClassListRegex = /\s/;
+/**
+ * Parsed a string of classnames into an array
+ * @param value className string, e.g. "foo bar baz"
+ * @returns list of classes, e.g. ["foo", "bar", "baz"]
+ */
 const parseClassList = (value) => (!value ? [] : value.split(parseClassListRegex));
+const CAPTURE_EVENT_SUFFIX = 'Capture';
+const CAPTURE_EVENT_REGEX = new RegExp(CAPTURE_EVENT_SUFFIX + '$');
 const updateElement = (oldVnode, newVnode, isSvgMode, memberName) => {
     // if the element passed in is a shadow root, which is a document fragment
     // then we want to be adding attrs/props to the shadow root's "host" element
@@ -643,6 +673,9 @@ const createElm = (oldParentVNode, newParentVNode, childIndex, parentElm) => {
             }
         }
     }
+    // This needs to always happen so we can hide nodes that are projected
+    // to another component but don't end up in a slot
+    elm['s-hn'] = hostTagName;
     return elm;
 };
 /**
@@ -996,9 +1029,9 @@ const patch = (oldVNode, newVNode) => {
     }
 };
 /**
- * 'Nullify' any VDom `ref` callbacks on a VDom node or its children by
- * calling them with `null`. This signals that the DOM element corresponding to
- * the VDom node has been removed from the DOM.
+ * 'Nullify' any VDom `ref` callbacks on a VDom node or its children by calling
+ * them with `null`. This signals that the DOM element corresponding to the VDom
+ * node has been removed from the DOM.
  *
  * @param vNode a virtual DOM node
  */
@@ -1234,6 +1267,10 @@ const updateComponent = async (hostRef, instance, isInitialLoad) => {
  */
 const callRender = (hostRef, instance, elm, isInitialLoad) => {
     try {
+        /**
+         * minification optimization: `allRenderFn` is `true` if all components have a `render`
+         * method, so we can call the method immediately. If not, check before calling it.
+         */
         instance = instance.render() ;
         {
             hostRef.$flags$ &= ~16 /* HOST_FLAGS.isQueuedForUpdate */;
@@ -1328,6 +1365,16 @@ const appDidLoad = (who) => {
     }
     nextTick(() => emitEvent(win, 'appload', { detail: { namespace: NAMESPACE } }));
 };
+/**
+ * Allows to safely call a method, e.g. `componentDidLoad`, on an instance,
+ * e.g. custom element node. If a build figures out that e.g. no component
+ * has a `componentDidLoad` method, the instance method gets removed from the
+ * output bundle and this function returns `undefined`.
+ * @param instance any object that may or may not contain methods
+ * @param method method name
+ * @param arg single arbitrary argument
+ * @returns result of method call if it exists, otherwise `undefined`
+ */
 const safeCall = (instance, method, arg) => {
     if (instance && instance[method]) {
         try {
@@ -1396,13 +1443,13 @@ const setValue = (ref, propName, newVal, cmpMeta) => {
  */
 const proxyComponent = (Cstr, cmpMeta, flags) => {
     var _a;
+    const prototype = Cstr.prototype;
     if (cmpMeta.$members$) {
         if (Cstr.watchers) {
             cmpMeta.$watchers$ = Cstr.watchers;
         }
         // It's better to have a const than two Object.entries()
         const members = Object.entries(cmpMeta.$members$);
-        const prototype = Cstr.prototype;
         members.map(([memberName, [memberFlags]]) => {
             if ((memberFlags & 31 /* MEMBER_FLAGS.Prop */ ||
                     ((flags & 2 /* PROXY_FLAGS.proxyState */) && memberFlags & 32 /* MEMBER_FLAGS.State */))) {
@@ -1425,8 +1472,9 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
                 // proxyComponent - method
                 Object.defineProperty(prototype, memberName, {
                     value(...args) {
+                        var _a;
                         const ref = getHostRef(this);
-                        return ref.$onInstancePromise$.then(() => ref.$lazyInstance$[memberName](...args));
+                        return (_a = ref === null || ref === void 0 ? void 0 : ref.$onInstancePromise$) === null || _a === void 0 ? void 0 : _a.then(() => { var _a; return (_a = ref.$lazyInstance$) === null || _a === void 0 ? void 0 : _a[memberName](...args); });
                     },
                 });
             }
@@ -1435,6 +1483,7 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
             const attrNameToPropName = new Map();
             prototype.attributeChangedCallback = function (attrName, oldValue, newValue) {
                 plt.jmp(() => {
+                    var _a;
                     const propName = attrNameToPropName.get(attrName);
                     //  In a web component lifecycle the attributeChangedCallback runs prior to connectedCallback
                     //  in the case where an attribute was set inline.
@@ -1490,11 +1539,12 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
                         // 1. The instance is ready
                         // 2. The watchers are ready
                         // 3. The value has changed
-                        if (!(flags & 8 /* HOST_FLAGS.isConstructingInstance */) &&
+                        if (flags &&
+                            !(flags & 8 /* HOST_FLAGS.isConstructingInstance */) &&
                             flags & 128 /* HOST_FLAGS.isWatchReady */ &&
                             newValue !== oldValue) {
                             const instance = hostRef.$lazyInstance$ ;
-                            const entry = cmpMeta.$watchers$[attrName];
+                            const entry = (_a = cmpMeta.$watchers$) === null || _a === void 0 ? void 0 : _a[attrName];
                             entry === null || entry === void 0 ? void 0 : entry.forEach((callbackName) => {
                                 if (instance[callbackName] != null) {
                                     instance[callbackName].call(instance, newValue, oldValue, attrName);
@@ -1516,10 +1566,11 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
                 ...members
                     .filter(([_, m]) => m[0] & 15 /* MEMBER_FLAGS.HasAttribute */)
                     .map(([propName, m]) => {
+                    var _a;
                     const attrName = m[1] || propName;
                     attrNameToPropName.set(attrName, propName);
                     if (m[0] & 512 /* MEMBER_FLAGS.ReflectAttr */) {
-                        cmpMeta.$attrsToReflect$.push([propName, attrName]);
+                        (_a = cmpMeta.$attrsToReflect$) === null || _a === void 0 ? void 0 : _a.push([propName, attrName]);
                     }
                     return attrName;
                 }),
@@ -1528,7 +1579,18 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
     }
     return Cstr;
 };
-const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId, Cstr) => {
+/**
+ * Initialize a Stencil component given a reference to its host element, its
+ * runtime bookkeeping data structure, runtime metadata about the component,
+ * and (optionally) an HMR version ID.
+ *
+ * @param elm a host element
+ * @param hostRef the element's runtime bookkeeping object
+ * @param cmpMeta runtime metadata for the Stencil component
+ * @param hmrVersionId an (optional) HMR version ID
+ */
+const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
+    let Cstr;
     // initializeComponent
     if ((hostRef.$flags$ & 32 /* HOST_FLAGS.hasInitializedComponent */) === 0) {
         // Let the runtime know that the component has been initialized
@@ -1690,12 +1752,13 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
     const customElements = win.customElements;
     const head = doc.head;
     const metaCharset = /*@__PURE__*/ head.querySelector('meta[charset]');
-    const visibilityStyle = /*@__PURE__*/ doc.createElement('style');
+    const dataStyles = /*@__PURE__*/ doc.createElement('style');
     const deferredConnectedCallbacks = [];
     let appLoadFallback;
     let isBootstrapping = true;
     Object.assign(plt, options);
     plt.$resourcesUrl$ = new URL(options.resourcesUrl || './', doc.baseURI).href;
+    let hasSlotRelocation = false;
     lazyBundles.map((lazyBundle) => {
         lazyBundle[1].map((compactMeta) => {
             var _a;
@@ -1705,6 +1768,11 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
                 $members$: compactMeta[2],
                 $listeners$: compactMeta[3],
             };
+            // Check if we are using slots outside the shadow DOM in this component.
+            // We'll use this information later to add styles for `slot-fb` elements
+            if (cmpMeta.$flags$ & 4 /* CMP_FLAGS.hasSlotRelocation */) {
+                hasSlotRelocation = true;
+            }
             {
                 cmpMeta.$members$ = compactMeta[2];
             }
@@ -1764,15 +1832,25 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
             }
         });
     });
+    // Add styles for `slot-fb` elements if any of our components are using slots outside the Shadow DOM
+    if (hasSlotRelocation) {
+        dataStyles.innerHTML += SLOT_FB_CSS;
+    }
+    // Add hydration styles
     {
-        visibilityStyle.innerHTML = cmpTags + HYDRATED_CSS;
-        visibilityStyle.setAttribute('data-styles', '');
+        dataStyles.innerHTML += cmpTags + HYDRATED_CSS;
+    }
+    // If we have styles, add them to the DOM
+    if (dataStyles.innerHTML.length) {
+        dataStyles.setAttribute('data-styles', '');
         // Apply CSP nonce to the style tag if it exists
         const nonce = (_a = plt.$nonce$) !== null && _a !== void 0 ? _a : queryNonceMetaTagContent(doc);
         if (nonce != null) {
-            visibilityStyle.setAttribute('nonce', nonce);
+            dataStyles.setAttribute('nonce', nonce);
         }
-        head.insertBefore(visibilityStyle, metaCharset ? metaCharset.nextSibling : head.firstChild);
+        // Insert the styles into the document head
+        // NOTE: this _needs_ to happen last so we can ensure the nonce (and other attributes) are applied
+        head.insertBefore(dataStyles, metaCharset ? metaCharset.nextSibling : head.firstChild);
     }
     // Process deferred connectedCallbacks now all components have been registered
     isBootstrapping = false;
@@ -1787,6 +1865,7 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
     // Fallback appLoad event
     endBootstrap();
 };
+const Fragment = (_, children) => children;
 const addHostEventListeners = (elm, hostRef, listeners, attachParentListeners) => {
     if (listeners) {
         listeners.map(([flags, name, method]) => {
@@ -1828,13 +1907,40 @@ const hostListenerOpts = (flags) => (flags & 2 /* LISTENER_FLAGS.Capture */) !==
  * @returns void
  */
 const setNonce = (nonce) => (plt.$nonce$ = nonce);
+/**
+ * A WeakMap mapping runtime component references to their corresponding host reference
+ * instances.
+ */
 const hostRefs = /*@__PURE__*/ new WeakMap();
+/**
+ * Given a {@link d.RuntimeRef} retrieve the corresponding {@link d.HostRef}
+ *
+ * @param ref the runtime ref of interest
+ * @returns the Host reference (if found) or undefined
+ */
 const getHostRef = (ref) => hostRefs.get(ref);
+/**
+ * Register a lazy instance with the {@link hostRefs} object so it's
+ * corresponding {@link d.HostRef} can be retrieved later.
+ *
+ * @param lazyInstance the lazy instance of interest
+ * @param hostRef that instances `HostRef` object
+ * @returns a reference to the host ref WeakMap
+ */
 const registerInstance = (lazyInstance, hostRef) => hostRefs.set((hostRef.$lazyInstance$ = lazyInstance), hostRef);
-const registerHost = (elm, cmpMeta) => {
+/**
+ * Register a host element for a Stencil component, setting up various metadata
+ * and callbacks based on {@link BUILD} flags as well as the component's runtime
+ * metadata.
+ *
+ * @param hostElement the host element to register
+ * @param cmpMeta runtime metadata for that component
+ * @returns a reference to the host ref WeakMap
+ */
+const registerHost = (hostElement, cmpMeta) => {
     const hostRef = {
         $flags$: 0,
-        $hostElement$: elm,
+        $hostElement$: hostElement,
         $cmpMeta$: cmpMeta,
         $instanceValues$: new Map(),
     };
@@ -1843,11 +1949,11 @@ const registerHost = (elm, cmpMeta) => {
     }
     {
         hostRef.$onReadyPromise$ = new Promise((r) => (hostRef.$onReadyResolve$ = r));
-        elm['s-p'] = [];
-        elm['s-rc'] = [];
+        hostElement['s-p'] = [];
+        hostElement['s-rc'] = [];
     }
-    addHostEventListeners(elm, hostRef, cmpMeta.$listeners$);
-    return hostRefs.set(elm, hostRef);
+    addHostEventListeners(hostElement, hostRef, cmpMeta.$listeners$);
+    return hostRefs.set(hostElement, hostRef);
 };
 const isMemberInElement = (elm, memberName) => memberName in elm;
 const consoleError = (e, el) => (0, console.error)(e, el);
@@ -1935,9 +2041,10 @@ const flush = () => {
         }
     }
 };
-const nextTick = /*@__PURE__*/ (cb) => promiseResolve().then(cb);
+const nextTick = (cb) => promiseResolve().then(cb);
 const writeTask = /*@__PURE__*/ queueTask(queueDomWrites, true);
 
+exports.Fragment = Fragment;
 exports.Host = Host;
 exports.bootstrapLazy = bootstrapLazy;
 exports.createEvent = createEvent;

package/dist/cjs/index.cjs.js

@@ -1,2 +1,14 @@
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const kupManager = require('./kup-manager-c63f4fb9.js');
+require('./kup-dates-0e59b05d.js');
+require('./index-8f2f4159.js');
+
+/** used for obtain a KupManager instance without a dom document (for UT)  */
+function newKupManager(init) {
+    return new kupManager.KupManager(init);
+}
+
+exports.newKupManager = newKupManager;