@poppy-ui/vue 0.3.3 → 0.3.5

package/dist/index.js

@@ -1,4 +1,4 @@
-import { defineComponent, ref, getCurrentInstance, inject, h, withDirectives } from 'vue';
+import { defineContainer, defineStencilSSRComponent } from '@stencil/vue-output-target/runtime';
 import { defineCustomElement } from '@poppy-ui/core/components/pop-accordion.js';
 import { defineCustomElement as defineCustomElement$1 } from '@poppy-ui/core/components/pop-accordion-group.js';
 import { defineCustomElement as defineCustomElement$2 } from '@poppy-ui/core/components/pop-avatar.js';
@@ -37,221 +37,68 @@ import { defineCustomElement as defineCustomElement$y } from '@poppy-ui/core/com
 import { defineCustomElement as defineCustomElement$z } from '@poppy-ui/core/components/pop-tooltip.js';
 import { initialize } from '@poppy-ui/core/components';
 
-// @ts-nocheck
-// It's easier and safer for Volar to disable typechecking and let the return type inference do its job.
-const UPDATE_VALUE_EVENT = 'update:modelValue';
-const MODEL_VALUE = 'modelValue';
-const ROUTER_LINK_VALUE = 'routerLink';
-const NAV_MANAGER = 'navManager';
-const ROUTER_PROP_PREFIX = 'router';
-const ARIA_PROP_PREFIX = 'aria';
-/**
- * Starting in Vue 3.1.0, all properties are
- * added as keys to the props object, even if
- * they are not being used. In order to correctly
- * account for both value props and v-model props,
- * we need to check if the key exists for Vue <3.1.0
- * and then check if it is not undefined for Vue >= 3.1.0.
- * See https://github.com/vuejs/vue-next/issues/3889
- */
-const EMPTY_PROP = Symbol();
-const DEFAULT_EMPTY_PROP = { default: EMPTY_PROP };
-const getComponentClasses = (classes) => {
-    return (classes === null || classes === void 0 ? void 0 : classes.split(' ')) || [];
-};
-const getElementClasses = (ref, componentClasses, defaultClasses = []) => {
-    var _a;
-    return [...Array.from(((_a = ref.value) === null || _a === void 0 ? void 0 : _a.classList) || []), ...defaultClasses].filter((c, i, self) => !componentClasses.has(c) && self.indexOf(c) === i);
-};
-/**
- * Create a callback to define a Vue component wrapper around a Web Component.
- *
- * @prop name - The component tag name (i.e. `ion-button`)
- * @prop componentProps - An array of properties on the
- * component. These usually match up with the @Prop definitions
- * in each component's TSX file.
- * @prop customElement - An option custom element instance to pass
- * to customElements.define. Only set if `includeImportCustomElements: true` in your config.
- * @prop modelProp - The prop that v-model binds to (i.e. value)
- * @prop modelUpdateEvent - The event that is fired from your Web Component when the value changes (i.e. ionChange)
- */
-const defineContainer = (name, defineCustomElement, componentProps = [], modelProp, modelUpdateEvent) => {
-    /**
-     * Create a Vue component wrapper around a Web Component.
-     * Note: The `props` here are not all properties on a component.
-     * They refer to whatever properties are set on an instance of a component.
-     */
-    if (defineCustomElement !== undefined) {
-        defineCustomElement();
-    }
-    const Container = defineComponent((props, { attrs, slots, emit }) => {
-        var _a;
-        let modelPropValue = props[modelProp];
-        const containerRef = ref();
-        const classes = new Set(getComponentClasses(attrs.class));
-        /**
-         * This directive is responsible for updating any reactive
-         * reference associated with v-model on the component.
-         * This code must be run inside of the "created" callback.
-         * Since the following listener callbacks as well as any potential
-         * event callback defined in the developer's app are set on
-         * the same element, we need to make sure the following callbacks
-         * are set first so they fire first. If the developer's callback fires first
-         * then the reactive reference will not have been updated yet.
-         */
-        const vModelDirective = {
-            created: (el) => {
-                const eventsNames = Array.isArray(modelUpdateEvent) ? modelUpdateEvent : [modelUpdateEvent];
-                eventsNames.forEach((eventName) => {
-                    el.addEventListener(eventName.toLowerCase(), (e) => {
-                        /**
-                         * Only update the v-model binding if the event's target is the element we are
-                         * listening on. For example, Component A could emit ionChange, but it could also
-                         * have a descendant Component B that also emits ionChange. We only want to update
-                         * the v-model for Component A when ionChange originates from that element and not
-                         * when ionChange bubbles up from Component B.
-                         */
-                        if (e.target.tagName === el.tagName) {
-                            modelPropValue = (e === null || e === void 0 ? void 0 : e.target)[modelProp];
-                            emit(UPDATE_VALUE_EVENT, modelPropValue);
-                        }
-                    });
-                });
-            },
-        };
-        const currentInstance = getCurrentInstance();
-        const hasRouter = (_a = currentInstance === null || currentInstance === void 0 ? void 0 : currentInstance.appContext) === null || _a === void 0 ? void 0 : _a.provides[NAV_MANAGER];
-        const navManager = hasRouter ? inject(NAV_MANAGER) : undefined;
-        const handleRouterLink = (ev) => {
-            const { routerLink } = props;
-            if (routerLink === EMPTY_PROP)
-                return;
-            if (navManager !== undefined) {
-                /**
-                 * This prevents the browser from
-                 * performing a page reload when pressing
-                 * an Ionic component with routerLink.
-                 * The page reload interferes with routing
-                 * and causes ion-back-button to disappear
-                 * since the local history is wiped on reload.
-                 */
-                ev.preventDefault();
-                let navigationPayload = { event: ev };
-                for (const key in props) {
-                    const value = props[key];
-                    if (props.hasOwnProperty(key) && key.startsWith(ROUTER_PROP_PREFIX) && value !== EMPTY_PROP) {
-                        navigationPayload[key] = value;
-                    }
-                }
-                navManager.navigate(navigationPayload);
-            }
-            else {
-                console.warn('Tried to navigate, but no router was found. Make sure you have mounted Vue Router.');
-            }
-        };
-        return () => {
-            modelPropValue = props[modelProp];
-            getComponentClasses(attrs.class).forEach((value) => {
-                classes.add(value);
-            });
-            const oldClick = props.onClick;
-            const handleClick = (ev) => {
-                if (oldClick !== undefined) {
-                    oldClick(ev);
-                }
-                if (!ev.defaultPrevented) {
-                    handleRouterLink(ev);
-                }
-            };
-            let propsToAdd = {
-                ref: containerRef,
-                class: getElementClasses(containerRef, classes),
-                onClick: handleClick,
-            };
-            /**
-             * We can use Object.entries here
-             * to avoid the hasOwnProperty check,
-             * but that would require 2 iterations
-             * where as this only requires 1.
-             */
-            for (const key in props) {
-                const value = props[key];
-                if ((props.hasOwnProperty(key) && value !== EMPTY_PROP) || key.startsWith(ARIA_PROP_PREFIX)) {
-                    propsToAdd[key] = value;
-                }
-            }
-            if (modelProp) {
-                /**
-                 * If form value property was set using v-model
-                 * then we should use that value.
-                 * Otherwise, check to see if form value property
-                 * was set as a static value (i.e. no v-model).
-                 */
-                if (props[MODEL_VALUE] !== EMPTY_PROP) {
-                    propsToAdd = Object.assign(Object.assign({}, propsToAdd), { [modelProp]: props[MODEL_VALUE] });
-                }
-                else if (modelPropValue !== EMPTY_PROP) {
-                    propsToAdd = Object.assign(Object.assign({}, propsToAdd), { [modelProp]: modelPropValue });
-                }
-            }
-            // If router link is defined, add href to props
-            // in order to properly render an anchor tag inside
-            // of components that should become activatable and
-            // focusable with router link.
-            if (props[ROUTER_LINK_VALUE] !== EMPTY_PROP) {
-                propsToAdd = Object.assign(Object.assign({}, propsToAdd), { href: props[ROUTER_LINK_VALUE] });
-            }
-            /**
-             * vModelDirective is only needed on components that support v-model.
-             * As a result, we conditionally call withDirectives with v-model components.
-             */
-            const node = h(name, propsToAdd, slots.default && slots.default());
-            return modelProp === undefined ? node : withDirectives(node, [[vModelDirective]]);
-        };
-    });
-    if (typeof Container !== 'function') {
-        Container.name = name;
-        Container.props = {
-            [ROUTER_LINK_VALUE]: DEFAULT_EMPTY_PROP,
-        };
-        componentProps.forEach((componentProp) => {
-            Container.props[componentProp] = DEFAULT_EMPTY_PROP;
-        });
-        if (modelProp) {
-            Container.props[MODEL_VALUE] = DEFAULT_EMPTY_PROP;
-            Container.emits = [UPDATE_VALUE_EVENT];
-        }
-    }
-    return Container;
-};
-
 /* eslint-disable */
 /* tslint:disable */
 /* auto-generated vue proxies */
-const PopAccordion = /*@__PURE__*/ defineContainer('pop-accordion', defineCustomElement, [
+const PopAccordion =  globalThis.window ? defineContainer('pop-accordion', defineCustomElement, [
     'readonly',
     'disabled',
     'name',
     'open'
-]);
-const PopAccordionGroup = /*@__PURE__*/ defineContainer('pop-accordion-group', defineCustomElement$1, [
+]) : defineStencilSSRComponent({
+    tagName: 'pop-accordion',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'readonly': [Boolean, "readonly"],
+        'disabled': [Boolean, "disabled"],
+        'name': [String, "name"],
+        'open': [Boolean, "open"]
+    }
+});
+const PopAccordionGroup =  globalThis.window ? defineContainer('pop-accordion-group', defineCustomElement$1, [
     'readonly',
     'disabled',
     'multiple',
     'active',
     'popChange',
     'popActiveChange'
-], 'active', 'pop-change');
-const PopAvatar = /*@__PURE__*/ defineContainer('pop-avatar', defineCustomElement$2, [
+], 'active', 'pop-change') : defineStencilSSRComponent({
+    tagName: 'pop-accordion-group',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'readonly': [Boolean, "readonly"],
+        'disabled': [Boolean, "disabled"],
+        'multiple': [Boolean, "multiple"],
+        'active': [String, "active"],
+        'onPopChange': [Function],
+        'onPopActiveChange': [Function]
+    }
+});
+const PopAvatar =  globalThis.window ? defineContainer('pop-avatar', defineCustomElement$2, [
     'placeholder'
-]);
-const PopBadge = /*@__PURE__*/ defineContainer('pop-badge', defineCustomElement$3, [
+]) : defineStencilSSRComponent({
+    tagName: 'pop-avatar',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'placeholder': [Boolean, "placeholder"]
+    }
+});
+const PopBadge =  globalThis.window ? defineContainer('pop-badge', defineCustomElement$3, [
     'color',
     'size',
     'outlined',
     'as'
-]);
-const PopButton = /*@__PURE__*/ defineContainer('pop-button', defineCustomElement$4, [
+]) : defineStencilSSRComponent({
+    tagName: 'pop-badge',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'color': [String, "color"],
+        'size': [String, "size"],
+        'outlined': [Boolean, "outlined"],
+        'as': [String, "as"]
+    }
+});
+const PopButton =  globalThis.window ? defineContainer('pop-button', defineCustomElement$4, [
     'type',
     'form',
     'disabled',
@@ -263,14 +110,48 @@ const PopButton = /*@__PURE__*/ defineContainer('pop-button', defineCustomElemen
     'active',
     'popFocus',
     'popBlur'
-]);
-const PopCard = /*@__PURE__*/ defineContainer('pop-card', defineCustomElement$5, [
+]) : defineStencilSSRComponent({
+    tagName: 'pop-button',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'type': [String, "type"],
+        'form': [String, "form"],
+        'disabled': [Boolean, "disabled"],
+        'color': [String, "color"],
+        'size': [String, "size"],
+        'outlined': [Boolean, "outlined"],
+        'shape': [String, "shape"],
+        'expand': [String, "expand"],
+        'active': [Boolean, "active"],
+        'onPopFocus': [Function],
+        'onPopBlur': [Function]
+    }
+});
+const PopCard =  globalThis.window ? defineContainer('pop-card', defineCustomElement$5, [
     'compact'
-]);
-const PopCardActions = /*@__PURE__*/ defineContainer('pop-card-actions', defineCustomElement$6);
-const PopCardBody = /*@__PURE__*/ defineContainer('pop-card-body', defineCustomElement$7);
-const PopCardTitle = /*@__PURE__*/ defineContainer('pop-card-title', defineCustomElement$8);
-const PopCheckbox = /*@__PURE__*/ defineContainer('pop-checkbox', defineCustomElement$9, [
+]) : defineStencilSSRComponent({
+    tagName: 'pop-card',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'compact': [Boolean, "compact"]
+    }
+});
+const PopCardActions =  globalThis.window ? defineContainer('pop-card-actions', defineCustomElement$6) : defineStencilSSRComponent({
+    tagName: 'pop-card-actions',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {}
+});
+const PopCardBody =  globalThis.window ? defineContainer('pop-card-body', defineCustomElement$7) : defineStencilSSRComponent({
+    tagName: 'pop-card-body',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {}
+});
+const PopCardTitle =  globalThis.window ? defineContainer('pop-card-title', defineCustomElement$8) : defineStencilSSRComponent({
+    tagName: 'pop-card-title',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {}
+});
+const PopCheckbox =  globalThis.window ? defineContainer('pop-checkbox', defineCustomElement$9, [
     'name',
     'value',
     'required',
@@ -284,21 +165,58 @@ const PopCheckbox = /*@__PURE__*/ defineContainer('pop-checkbox', defineCustomEl
     'popChange',
     'popFocus',
     'popBlur'
-], 'checked', 'pop-change');
-const PopDivider = /*@__PURE__*/ defineContainer('pop-divider', defineCustomElement$a, [
+], 'checked', 'pop-change') : defineStencilSSRComponent({
+    tagName: 'pop-checkbox',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'name': [String, "name"],
+        'value': [String, "value"],
+        'required': [Boolean, "required"],
+        'readonly': [Boolean, "readonly"],
+        'checked': [Boolean, "checked"],
+        'indeterminate': [Boolean, "indeterminate"],
+        'disabled': [Boolean, "disabled"],
+        'color': [String, "color"],
+        'size': [String, "size"],
+        'placement': [String, "placement"],
+        'onPopChange': [Function],
+        'onPopFocus': [Function],
+        'onPopBlur': [Function]
+    }
+});
+const PopDivider =  globalThis.window ? defineContainer('pop-divider', defineCustomElement$a, [
     'orientation',
     'placement',
     'color'
-]);
-const PopDrawer = /*@__PURE__*/ defineContainer('pop-drawer', defineCustomElement$b, [
+]) : defineStencilSSRComponent({
+    tagName: 'pop-divider',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'orientation': [String, "orientation"],
+        'placement': [String, "placement"],
+        'color': [String, "color"]
+    }
+});
+const PopDrawer =  globalThis.window ? defineContainer('pop-drawer', defineCustomElement$b, [
     'trigger',
     'triggerAction',
     'side',
     'open',
     'popDidPresent',
     'popDidDismiss'
-]);
-const PopDropdown = /*@__PURE__*/ defineContainer('pop-dropdown', defineCustomElement$c, [
+]) : defineStencilSSRComponent({
+    tagName: 'pop-drawer',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'trigger': [String, "trigger"],
+        'triggerAction': [String, "trigger-action"],
+        'side': [String, "side"],
+        'open': [Boolean, "open"],
+        'onPopDidPresent': [Function],
+        'onPopDidDismiss': [Function]
+    }
+});
+const PopDropdown =  globalThis.window ? defineContainer('pop-dropdown', defineCustomElement$c, [
     'side',
     'align',
     'open',
@@ -307,19 +225,49 @@ const PopDropdown = /*@__PURE__*/ defineContainer('pop-dropdown', defineCustomEl
     'showBackdrop',
     'didPresent',
     'didDismiss'
-]);
-const PopImg = /*@__PURE__*/ defineContainer('pop-img', defineCustomElement$d, [
+]) : defineStencilSSRComponent({
+    tagName: 'pop-dropdown',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'side': [String, "side"],
+        'align': [String, "align"],
+        'open': [Boolean, "open"],
+        'triggerAction': [String, "trigger-action"],
+        'debounce': [Number, "debounce"],
+        'showBackdrop': [Boolean, "show-backdrop"],
+        'onDidPresent': [Function],
+        'onDidDismiss': [Function]
+    }
+});
+const PopImg =  globalThis.window ? defineContainer('pop-img', defineCustomElement$d, [
     'src',
     'alt',
     'popWillLoad',
     'popDidLoad',
     'popError'
-]);
-const PopIndicator = /*@__PURE__*/ defineContainer('pop-indicator', defineCustomElement$e, [
+]) : defineStencilSSRComponent({
+    tagName: 'pop-img',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'src': [String, "src"],
+        'alt': [String, "alt"],
+        'onPopWillLoad': [Function],
+        'onPopDidLoad': [Function],
+        'onPopError': [Function]
+    }
+});
+const PopIndicator =  globalThis.window ? defineContainer('pop-indicator', defineCustomElement$e, [
     'side',
     'position'
-]);
-const PopInput = /*@__PURE__*/ defineContainer('pop-input', defineCustomElement$f, [
+]) : defineStencilSSRComponent({
+    tagName: 'pop-indicator',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'side': [String, "side"],
+        'position': [String, "position"]
+    }
+});
+const PopInput =  globalThis.window ? defineContainer('pop-input', defineCustomElement$f, [
     'name',
     'type',
     'placeholder',
@@ -352,8 +300,42 @@ const PopInput = /*@__PURE__*/ defineContainer('pop-input', defineCustomElement$
     'popInput',
     'popFocus',
     'popBlur'
-], 'value', 'pop-input');
-const PopInputFile = /*@__PURE__*/ defineContainer('pop-input-file', defineCustomElement$g, [
+], 'value', 'pop-input') : defineStencilSSRComponent({
+    tagName: 'pop-input',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'name': [String, "name"],
+        'type': [String, "type"],
+        'placeholder': [String, "placeholder"],
+        'min': [Number, "min"],
+        'step': [String, "step"],
+        'minLength': [Number, "min-length"],
+        'maxLength': [Number, "max-length"],
+        'multiple': [Boolean, "multiple"],
+        'pattern': [String, "pattern"],
+        'required': [Boolean, "required"],
+        'readonly': [Boolean, "readonly"],
+        'disabled': [Boolean, "disabled"],
+        'autoFocus': [Boolean, "auto-focus"],
+        'keyboard': [String, "keyboard"],
+        'enterkeyhint': [String, "enterkeyhint"],
+        'spellcheck': [Boolean, "spellcheck"],
+        'autoComplete': [String, "auto-complete"],
+        'autoCapitalize': [String, "auto-capitalize"],
+        'bordered': [Boolean, "bordered"],
+        'color': [String, "color"],
+        'size': [String, "size"],
+        'helperText': [String, "helper-text"],
+        'errorText': [String, "error-text"],
+        'counter': [Boolean, "counter"],
+        'debounce': [Number, "debounce"],
+        'onPopChange': [Function],
+        'onPopInput': [Function],
+        'onPopFocus': [Function],
+        'onPopBlur': [Function]
+    }
+});
+const PopInputFile =  globalThis.window ? defineContainer('pop-input-file', defineCustomElement$g, [
     'name',
     'value',
     'multiple',
@@ -369,28 +351,85 @@ const PopInputFile = /*@__PURE__*/ defineContainer('pop-input-file', defineCusto
     'popChange',
     'popFocus',
     'popBlur'
-]);
-const PopItem = /*@__PURE__*/ defineContainer('pop-item', defineCustomElement$h, [
+]) : defineStencilSSRComponent({
+    tagName: 'pop-input-file',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'name': [String, "name"],
+        'multiple': [Boolean, "multiple"],
+        'required': [Boolean, "required"],
+        'readonly': [Boolean, "readonly"],
+        'disabled': [Boolean, "disabled"],
+        'autoFocus': [Boolean, "auto-focus"],
+        'bordered': [Boolean, "bordered"],
+        'color': [String, "color"],
+        'size': [String, "size"],
+        'helperText': [String, "helper-text"],
+        'errorText': [String, "error-text"],
+        'onPopChange': [Function],
+        'onPopFocus': [Function],
+        'onPopBlur': [Function]
+    }
+});
+const PopItem =  globalThis.window ? defineContainer('pop-item', defineCustomElement$h, [
     'disabled'
-]);
-const PopJoin = /*@__PURE__*/ defineContainer('pop-join', defineCustomElement$i, [
+]) : defineStencilSSRComponent({
+    tagName: 'pop-item',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'disabled': [Boolean, "disabled"]
+    }
+});
+const PopJoin =  globalThis.window ? defineContainer('pop-join', defineCustomElement$i, [
     'orientation'
-]);
-const PopKbd = /*@__PURE__*/ defineContainer('pop-kbd', defineCustomElement$j, [
+]) : defineStencilSSRComponent({
+    tagName: 'pop-join',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'orientation': [String, "orientation"]
+    }
+});
+const PopKbd =  globalThis.window ? defineContainer('pop-kbd', defineCustomElement$j, [
     'size'
-]);
-const PopList = /*@__PURE__*/ defineContainer('pop-list', defineCustomElement$k, [
+]) : defineStencilSSRComponent({
+    tagName: 'pop-kbd',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'size': [String, "size"]
+    }
+});
+const PopList =  globalThis.window ? defineContainer('pop-list', defineCustomElement$k, [
     'size',
     'orientation'
-]);
-const PopLoading = /*@__PURE__*/ defineContainer('pop-loading', defineCustomElement$l, [
+]) : defineStencilSSRComponent({
+    tagName: 'pop-list',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'size': [String, "size"],
+        'orientation': [String, "orientation"]
+    }
+});
+const PopLoading =  globalThis.window ? defineContainer('pop-loading', defineCustomElement$l, [
     'type',
     'size'
-]);
-const PopMask = /*@__PURE__*/ defineContainer('pop-mask', defineCustomElement$m, [
+]) : defineStencilSSRComponent({
+    tagName: 'pop-loading',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'type': [String, "type"],
+        'size': [String, "size"]
+    }
+});
+const PopMask =  globalThis.window ? defineContainer('pop-mask', defineCustomElement$m, [
     'type'
-]);
-const PopModal = /*@__PURE__*/ defineContainer('pop-modal', defineCustomElement$n, [
+]) : defineStencilSSRComponent({
+    tagName: 'pop-mask',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'type': [String, "type"]
+    }
+});
+const PopModal =  globalThis.window ? defineContainer('pop-modal', defineCustomElement$n, [
     'trigger',
     'component',
     'componentProps',
@@ -399,9 +438,25 @@ const PopModal = /*@__PURE__*/ defineContainer('pop-modal', defineCustomElement$
     'open',
     'didPresent',
     'didDismiss'
-]);
-const PopNavbar = /*@__PURE__*/ defineContainer('pop-navbar', defineCustomElement$o);
-const PopPopover = /*@__PURE__*/ defineContainer('pop-popover', defineCustomElement$p, [
+]) : defineStencilSSRComponent({
+    tagName: 'pop-modal',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'trigger': [String, "trigger"],
+        'component': [String, "component"],
+        'showBackdrop': [Boolean, "show-backdrop"],
+        'backdropDismiss': [Boolean, "backdrop-dismiss"],
+        'open': [Boolean, "open"],
+        'onDidPresent': [Function],
+        'onDidDismiss': [Function]
+    }
+});
+const PopNavbar =  globalThis.window ? defineContainer('pop-navbar', defineCustomElement$o) : defineStencilSSRComponent({
+    tagName: 'pop-navbar',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {}
+});
+const PopPopover =  globalThis.window ? defineContainer('pop-popover', defineCustomElement$p, [
     'open',
     'animated',
     'showBackdrop',
@@ -415,13 +470,36 @@ const PopPopover = /*@__PURE__*/ defineContainer('pop-popover', defineCustomElem
     'didPresent',
     'willDismiss',
     'didDismiss'
-]);
-const PopProgress = /*@__PURE__*/ defineContainer('pop-progress', defineCustomElement$q, [
+]) : defineStencilSSRComponent({
+    tagName: 'pop-popover',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'open': [Boolean, "open"],
+        'showBackdrop': [Boolean, "show-backdrop"],
+        'backdropDismiss': [Boolean, "backdrop-dismiss"],
+        'trigger': [String, "trigger"],
+        'triggerAction': [String, "trigger-action"],
+        'component': [String, "component"],
+        'onWillPresent': [Function],
+        'onDidPresent': [Function],
+        'onWillDismiss': [Function],
+        'onDidDismiss': [Function]
+    }
+});
+const PopProgress =  globalThis.window ? defineContainer('pop-progress', defineCustomElement$q, [
     'value',
     'max',
     'color'
-]);
-const PopRadio = /*@__PURE__*/ defineContainer('pop-radio', defineCustomElement$r, [
+]) : defineStencilSSRComponent({
+    tagName: 'pop-progress',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'value': [Number, "value"],
+        'max': [Number, "max"],
+        'color': [String, "color"]
+    }
+});
+const PopRadio =  globalThis.window ? defineContainer('pop-radio', defineCustomElement$r, [
     'name',
     'value',
     'checked',
@@ -432,8 +510,22 @@ const PopRadio = /*@__PURE__*/ defineContainer('pop-radio', defineCustomElement$
     'size',
     'popFocus',
     'popBlur'
-], 'value', 'pop-change');
-const PopRadioGroup = /*@__PURE__*/ defineContainer('pop-radio-group', defineCustomElement$s, [
+], 'value', 'pop-change') : defineStencilSSRComponent({
+    tagName: 'pop-radio',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'name': [String, "name"],
+        'checked': [Boolean, "checked"],
+        'required': [Boolean, "required"],
+        'disabled': [Boolean, "disabled"],
+        'autoFocus': [Boolean, "auto-focus"],
+        'color': [String, "color"],
+        'size': [String, "size"],
+        'onPopFocus': [Function],
+        'onPopBlur': [Function]
+    }
+});
+const PopRadioGroup =  globalThis.window ? defineContainer('pop-radio-group', defineCustomElement$s, [
     'name',
     'value',
     'required',
@@ -444,8 +536,22 @@ const PopRadioGroup = /*@__PURE__*/ defineContainer('pop-radio-group', defineCus
     'size',
     'popChange',
     'popValueChange'
-], 'value', 'pop-change');
-const PopRange = /*@__PURE__*/ defineContainer('pop-range', defineCustomElement$t, [
+], 'value', 'pop-change') : defineStencilSSRComponent({
+    tagName: 'pop-radio-group',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'name': [String, "name"],
+        'required': [Boolean, "required"],
+        'disabled': [Boolean, "disabled"],
+        'allowEmpty': [Boolean, "allow-empty"],
+        'compare': [String, "compare"],
+        'color': [String, "color"],
+        'size': [String, "size"],
+        'onPopChange': [Function],
+        'onPopValueChange': [Function]
+    }
+});
+const PopRange =  globalThis.window ? defineContainer('pop-range', defineCustomElement$t, [
     'name',
     'value',
     'min',
@@ -460,8 +566,27 @@ const PopRange = /*@__PURE__*/ defineContainer('pop-range', defineCustomElement$
     'popChange',
     'popFocus',
     'popBlur'
-], 'value', 'pop-change');
-const PopSelect = /*@__PURE__*/ defineContainer('pop-select', defineCustomElement$u, [
+], 'value', 'pop-change') : defineStencilSSRComponent({
+    tagName: 'pop-range',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'name': [String, "name"],
+        'value': [Number, "value"],
+        'min': [Number, "min"],
+        'max': [Number, "max"],
+        'step': [Number, "step"],
+        'required': [Boolean, "required"],
+        'disabled': [Boolean, "disabled"],
+        'autoFocus': [Boolean, "auto-focus"],
+        'color': [String, "color"],
+        'size': [String, "size"],
+        'debounce': [Number, "debounce"],
+        'onPopChange': [Function],
+        'onPopFocus': [Function],
+        'onPopBlur': [Function]
+    }
+});
+const PopSelect =  globalThis.window ? defineContainer('pop-select', defineCustomElement$u, [
     'name',
     'placeholder',
     'value',
@@ -483,19 +608,60 @@ const PopSelect = /*@__PURE__*/ defineContainer('pop-select', defineCustomElemen
     'popChange',
     'popFocus',
     'popBlur'
-], 'value', 'pop-change');
-const PopSelectOption = /*@__PURE__*/ defineContainer('pop-select-option', defineCustomElement$v, [
+], 'value', 'pop-change') : defineStencilSSRComponent({
+    tagName: 'pop-select',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'name': [String, "name"],
+        'placeholder': [String, "placeholder"],
+        'multiple': [Boolean, "multiple"],
+        'min': [Number, "min"],
+        'max': [Number, "max"],
+        'required': [Boolean, "required"],
+        'disabled': [Boolean, "disabled"],
+        'autoFocus': [Boolean, "auto-focus"],
+        'bordered': [Boolean, "bordered"],
+        'color': [String, "color"],
+        'size': [String, "size"],
+        'selectedText': [String, "selected-text"],
+        'helperText': [String, "helper-text"],
+        'notEnoughErrorText': [String, "not-enough-error-text"],
+        'tooManyErrorText': [String, "too-many-error-text"],
+        'compare': [String, "compare"],
+        'onPopDismiss': [Function],
+        'onPopChange': [Function],
+        'onPopFocus': [Function],
+        'onPopBlur': [Function]
+    }
+});
+const PopSelectOption =  globalThis.window ? defineContainer('pop-select-option', defineCustomElement$v, [
     'value',
     'disabled',
     'color',
     'size'
-]);
-const PopSwap = /*@__PURE__*/ defineContainer('pop-swap', defineCustomElement$w, [
+]) : defineStencilSSRComponent({
+    tagName: 'pop-select-option',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'disabled': [Boolean, "disabled"],
+        'color': [String, "color"],
+        'size': [String, "size"]
+    }
+});
+const PopSwap =  globalThis.window ? defineContainer('pop-swap', defineCustomElement$w, [
     'type',
     'active',
     'popSwap'
-], 'active', 'pop-change');
-const PopTextarea = /*@__PURE__*/ defineContainer('pop-textarea', defineCustomElement$x, [
+], 'active', 'pop-change') : defineStencilSSRComponent({
+    tagName: 'pop-swap',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'type': [String, "type"],
+        'active': [Boolean, "active"],
+        'onPopSwap': [Function]
+    }
+});
+const PopTextarea =  globalThis.window ? defineContainer('pop-textarea', defineCustomElement$x, [
     'name',
     'placeholder',
     'value',
@@ -524,8 +690,40 @@ const PopTextarea = /*@__PURE__*/ defineContainer('pop-textarea', defineCustomEl
     'popInput',
     'popFocus',
     'popBlur'
-], 'value', 'pop-input');
-const PopToggle = /*@__PURE__*/ defineContainer('pop-toggle', defineCustomElement$y, [
+], 'value', 'pop-input') : defineStencilSSRComponent({
+    tagName: 'pop-textarea',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'name': [String, "name"],
+        'placeholder': [String, "placeholder"],
+        'value': [String, "value"],
+        'minLength': [Number, "min-length"],
+        'maxLength': [Number, "max-length"],
+        'cols': [Number, "cols"],
+        'rows': [Number, "rows"],
+        'required': [Boolean, "required"],
+        'readonly': [Boolean, "readonly"],
+        'disabled': [Boolean, "disabled"],
+        'autoFocus': [Boolean, "auto-focus"],
+        'keyboard': [String, "keyboard"],
+        'enterkeyhint': [String, "enterkeyhint"],
+        'spellcheck': [Boolean, "spellcheck"],
+        'autoCapitalize': [String, "auto-capitalize"],
+        'wrap': [String, "wrap"],
+        'bordered': [Boolean, "bordered"],
+        'color': [String, "color"],
+        'size': [String, "size"],
+        'helperText': [String, "helper-text"],
+        'errorText': [String, "error-text"],
+        'counter': [Boolean, "counter"],
+        'debounce': [Number, "debounce"],
+        'onPopChange': [Function],
+        'onPopInput': [Function],
+        'onPopFocus': [Function],
+        'onPopBlur': [Function]
+    }
+});
+const PopToggle =  globalThis.window ? defineContainer('pop-toggle', defineCustomElement$y, [
     'name',
     'value',
     'required',
@@ -538,13 +736,39 @@ const PopToggle = /*@__PURE__*/ defineContainer('pop-toggle', defineCustomElemen
     'popChange',
     'popFocus',
     'popBlur'
-], 'checked', 'pop-change');
-const PopTooltip = /*@__PURE__*/ defineContainer('pop-tooltip', defineCustomElement$z, [
+], 'checked', 'pop-change') : defineStencilSSRComponent({
+    tagName: 'pop-toggle',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'name': [String, "name"],
+        'value': [String, "value"],
+        'required': [Boolean, "required"],
+        'readonly': [Boolean, "readonly"],
+        'checked': [Boolean, "checked"],
+        'indeterminate': [Boolean, "indeterminate"],
+        'disabled': [Boolean, "disabled"],
+        'color': [String, "color"],
+        'size': [String, "size"],
+        'onPopChange': [Function],
+        'onPopFocus': [Function],
+        'onPopBlur': [Function]
+    }
+});
+const PopTooltip =  globalThis.window ? defineContainer('pop-tooltip', defineCustomElement$z, [
     'value',
     'color',
     'position',
     'open'
-]);
+]) : defineStencilSSRComponent({
+    tagName: 'pop-tooltip',
+    hydrateModule: import('@poppy-ui/core/hydrate'),
+    props: {
+        'value': [String, "value"],
+        'color': [String, "color"],
+        'position': [String, "position"],
+        'open': [Boolean, "open"]
+    }
+});
 
 const toKebabCase = (eventName) => {
     return eventName.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, '$1-$2').toLowerCase();