@charde/core 0.0.4 → 0.0.6

package/dist/esm/index-jZlebn0H.js

@@ -0,0 +1,1419 @@
+const NAMESPACE = 'charde';
+const BUILD = /* charde */ { hotModuleReplacement: false, hydratedSelectorName: "hydrated", lazyLoad: true, prop: true, propChangeCallback: false, updatable: true};
+
+const globalScripts = () => {};
+const globalStyles = "/* src/global/global.css */\n\n/* Import design tokens and utilities - these are dynamically generated */\n:root {\n\n  /* Accent color */\n  --secondary-color: #dcd926ff;\n\n  /* Neutral background/text color */\n  --neutral-color: #cccccc;\n\n  /* Light text color for dark backgrounds */\n  --text-light: #ffffff;\n\n  /* Light background color */\n  --background-light: #f9f9f9;\n\n  /* Base font size for body text */\n  --font-size-base: 1rem;\n\n  /* Large font size for headings */\n  --font-size-lg: 1.2rem;\n\n  /* Small font size */\n  --font-size-sm: 0.875rem;\n\n  /* Extra small font size */\n  --font-size-xs: 0.75rem;\n\n  /* Semibold font weight */\n  --font-weight-semibold: 600;\n\n  /* Monospace font stack */\n  --font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;\n\n  /* Sans-serif font utility class */\n  --font-sans: font-sans;\n\n  --spacing-0: 0px;\n\n  /* 4px */\n  --spacing-1: 0.25rem;\n\n  /* 8px */\n  --spacing-2: 0.5rem;\n\n  /* 12px */\n  --spacing-3: 0.75rem;\n\n  /* 16px */\n  --spacing-4: 1rem;\n\n  /* 24px */\n  --spacing-6: 2.5rem;\n\n  /* 32px */\n  --spacing-8: 2rem;\n\n  /* Default width of the card */\n  --width: 100%;\n\n  /* Maximum width of the card */\n  --max-width: 300rem;\n\n  --border-radius-xs: 2rem;\n\n  --border-radius-sm: 4px;\n\n  --border-radius-md: 6px;\n\n  --border-radius-lg: 8px;\n\n  --border-radius-xl: 2rem;\n\n  --border-radius-2xl: 16px;\n\n  /* For very rounded corners, e.g., rounded-3xl */\n  --border-radius-3xl: 20px;\n\n  /* For circular elements */\n  --border-radius-full: 50%;\n\n  --white: #ffffff;\n\n  --black: #000000;\n\n  --gray-50: #f9f9f9;\n\n  --gray-100: #f3f4f6;\n\n  --gray-200: #67880c;\n\n  --gray-300: #d5d8dc;\n\n  --gray-400: #9ca3af;\n\n  --gray-500: #7af202;\n\n  --gray-600: #4b5563;\n\n  --gray-700: #374151;\n\n  --gray-800: #122be2;\n\n  --gray-900: #76f990;\n\n  --indigo-500: #6366f1;\n\n  /* Light blue background */\n  --blue-50: #eff6ff;\n\n  /* Blue for icons */\n  --blue-600: #2563eb;\n\n  /* Width utility class (3.5rem) */\n  --w-14: w-14;\n\n  /* Height utility class (3.5rem) */\n  --h-14: h-14;\n\n  /* Width utility class (2rem) */\n  --w-8: w-8;\n\n  /* Height utility class (2rem) */\n  --h-8: h-8;\n\n  /* Width utility class (3rem) */\n  --w-12: w-12;\n\n  /* Height utility class (3rem) */\n  --h-12: h-12;\n\n  /* Horizontal spacing utility class */\n  --space-x-2: space-x-2;\n\n  /* Padding utility class */\n  --p-2: p-2;\n\n  /* White text color utility class */\n  --text-white: text-white;\n\n  /* Medium font weight utility class */\n  --font-medium: font-medium;\n\n  /* Bold font weight utility class */\n  --font-bold: font-bold;\n\n  /* Border utility class */\n  --border: border;\n\n  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);\n\n  /* Large shadow for cards and elevated elements */\n  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);\n\n  /* Transition for color properties */\n  --transition-colors: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n\n  /* Standard transition duration for hover effects */\n  --duration-200: 0.2;\n\n  /* Standard 1px border width */\n  --border-width-1: 1rem;\n\n  /* 2px border width */\n  --border-width-2: 2rem;\n\n  /* Solid border style */\n  --border-style-solid: solid;\n\n  /* No border style */\n  --border-style-none: none;\n\n  /* Flex display property */\n  --display-flex: flex;\n\n  /* Center alignment for flex items */\n  --align-items-center: center;\n\n  /* Start alignment for flex items */\n  --align-items-start: flex-start;\n\n  /* Space between flex items */\n  --justify-content-space-between: space-between;\n\n  /* Center justification for flex items */\n  --justify-content-center: center;\n\n  /* Pointer cursor */\n  --cursor-pointer: pointer;\n\n  /* Center text alignment */\n  --text-align-center: center;\n\n  /* Default width for profile images */\n  --image-width: 32px;\n\n  /* Default height for profile images */\n  --image-height: 32px;\n\n  /* Border radius for circular images */\n  --image-border-radius: 50%;\n\n  /* Utility class for white background */\n  --bg-white: bg-white;\n\n  /* Utility class for gray-50 background */\n  --bg-gray-50: bg-gray-50;\n\n  /* Utility class for gray-900 background */\n  --bg-gray-900: bg-gray-900;\n\n  /* Utility class for gray-800 background */\n  --bg-gray-800: bg-gray-800;\n\n  /* Utility class for blue-50 background */\n  --bg-blue-50: bg-blue-50;\n\n  /* Utility class for padding (maps to --spacing-6) */\n  --p-6: p-6;\n\n  /* Utility class for padding (maps to --spacing-4) */\n  --p-4: p-4;\n\n  /* Utility class for horizontal padding (maps to --spacing-6) */\n  --px-6: px-6;\n\n  /* Utility class for bottom padding (maps to --spacing-6) */\n  --pb-6: pb-6;\n\n  /* Utility class for vertical padding (maps to --spacing-6) */\n  --py-6: py-6;\n\n  /* Utility class for margin-top: 0.25rem */\n  --mt-1: mt-1;\n\n  /* Utility class for flex-shrink: 0 */\n  --flex-shrink-0: flex-shrink-0;\n\n  /* Utility class for extra large border radius (maps to --border-radius-xl) */\n  --rounded-xl: rounded-xl;\n\n  /* Utility class for 3X large border radius (maps to --border-radius-3xl) */\n  --rounded-3xl: rounded-3xl;\n\n  /* Utility class for large border radius (maps to --border-radius-lg) */\n  --rounded-lg: rounded-lg;\n\n  /* Utility class for 50% border radius */\n  --rounded-full: rounded-full;\n\n  /* Utility class for full width */\n  --w-full: w-full;\n\n  /* Utility class for medium max-width */\n  --max-w-md: max-w-md;\n\n  /* Utility class for horizontal auto margin (centering) */\n  --mx-auto: mx-auto;\n\n  /* Utility class for overflow: hidden */\n  --overflow-hidden: overflow-hidden;\n\n  /* Utility class for large shadow (maps to --shadow-lg) */\n  --class-shadow-lg: shadow-lg;\n\n  /* Utility class for display: flex */\n  --flex: flex;\n\n  /* Utility class for align-items: center */\n  --items-center: items-center;\n\n  /* Utility class for align-items: flex-start */\n  --items-start: items-start;\n\n  /* Utility class for justify-content: space-between */\n  --justify-between: justify-between;\n\n  /* Utility class for justify-content: center */\n  --justify-center: justify-center;\n\n  /* Utility class for bottom border (maps to --border-width-1, --border-style-solid, --gray-200) */\n  --border-b: border-b;\n\n  /* Utility class for gray-200 border color */\n  --border-gray-200: border-gray-200;\n\n  /* Utility class for gray-300 border color */\n  --border-gray-300: border-gray-300;\n\n  /* Utility class for top border */\n  --border-t: border-t;\n\n  /* Utility class for horizontal gap (maps to 0.75rem / 12px) */\n  --space-x-3: space-x-3;\n\n  /* Utility class for horizontal gap (maps to 1rem / 16px) */\n  --space-x-4: space-x-4;\n\n  /* Utility class for vertical gap (maps to 1.5rem / 24px) */\n  --space-y-6: space-y-6;\n\n  /* Utility class for semibold font weight */\n  --font-semibold: font-semibold;\n\n  /* Utility class for monospace font family */\n  --font-mono: font-mono;\n\n  /* Utility class for extra large text size */\n  --text-xl: text-xl;\n\n  /* Utility class for large text size */\n  --text-lg: text-lg;\n\n  /* Utility class for small text size */\n  --text-sm: text-sm;\n\n  /* Utility class for gray-900 text color */\n  --text-gray-900: text-gray-900;\n\n  /* Utility class for gray-800 text color */\n  --text-gray-800: text-gray-800;\n\n  /* Utility class for gray-700 text color */\n  --text-gray-700: text-gray-700;\n\n  /* Utility class for gray-600 text color */\n  --text-gray-600: text-gray-600;\n\n  /* Utility class for gray-500 text color */\n  --text-gray-500: text-gray-500;\n\n  /* Utility class for gray-300 text color */\n  --text-gray-300: text-gray-300;\n\n  /* Utility class for blue-600 text color */\n  --text-blue-600: text-blue-600;\n\n  /* Utility class for hover state gray-100 background */\n  --hover-bg-gray-100: hover:bg-gray-100;\n\n  /* Utility class for hover state gray-700 background */\n  --hover-bg-gray-700: hover:bg-gray-700;\n\n  /* Utility class for color transition */\n  --class-transition-colors: transition-colors;\n\n  /* Utility class for flex: 1 1 0% */\n  --flex-1: flex-1;\n\n  /* Default sans-serif font stack */\n  --font-family-sans: Inter, system-ui, sans-serif;\n\n  /* Standard transition duration */\n  --duration-150: 150ms;\n\n  /* Z-index for modals */\n  --z-index-modal: 50%;\n\n  /* Z-index for tooltips */\n  --z-index-tooltip: 60;\n\n  /* Opacity for disabled states */\n  --opacity-disabled: 0.6;\n\n  /* Cursor for disabled elements */\n  --cursor-not-allowed: not-allowed;\n\n  /* Grid display property */\n  --display-grid: grid;\n\n  /* 8px gap */\n  --gap-2: 0.5rem;\n\n  /* 16px gap */\n  --gap-4: 1rem;\n\n  /* Default icon size */\n  --icon-size-md: 16px;\n\n  /* Small icon size (1rem) */\n  --icon-size-sm: 16px;\n\n  /* User-added custom property */\n  --custom-primary-color: #6add2c;\n\n  /* Default height for input elements (44px) */\n  --input-height: 2.75rem;\n\n  /* Maximum height for dropdown menu (256px) */\n  --dropdown-max-height: 16px;\n\n  /* Blue focus ring color */\n  --focus-ring-color: #3b82f6;\n\n  /* Focus ring width */\n  --focus-ring-width: 2rem;\n\n  /* Size of chevron icon (20px) */\n  --chevron-size: 1.25rem;\n\n  /* Primary button background color */\n  --button-primary-bg: #dcd926ff;\n\n  /* Primary button hover state background */\n  --button-primary-hover-bg: #1d56b0;\n\n  /* Primary button active/pressed state */\n  --button-primary-active-bg: #174291;\n\n  /* Secondary button background color */\n  --button-secondary-bg: #6b7280;\n\n  /* Secondary button hover state background */\n  --button-secondary-hover-bg: #4b5563;\n\n  /* Danger/error button background */\n  --button-danger-bg: #dc2626;\n\n  /* Danger button hover state */\n  --button-danger-hover-bg: #b91c1c;\n\n  /* Success button background */\n  --button-success-bg: #059669;\n\n  /* Success button hover state */\n  --button-success-hover-bg: #047857;\n\n  /* Outline button border color */\n  --button-outline-border: #d1d5db;\n\n  /* Outline button hover border color */\n  --button-outline-hover-border: #9ca3af;\n\n  /* Default button text color */\n  --button-text-color: 1rem;\n\n  /* Outline button text color */\n  --button-outline-text: #374151;\n\n  /* Disabled button background */\n  --button-disabled-bg: #f3f4f6;\n\n  /* Disabled button text color */\n  --button-disabled-text: #9ca3af;\n\n  /* Disabled button border color */\n  --button-disabled-border: #e5e7eb;\n\n  /* Horizontal padding for medium buttons */\n  --button-padding-x: 1rem;\n\n  /* Vertical padding for medium buttons */\n  --button-padding-y: 0.5rem;\n\n  /* Horizontal padding for small buttons */\n  --button-padding-x-sm: 0.75rem;\n\n  /* Vertical padding for small buttons */\n  --button-padding-y-sm: 0.375rem;\n\n  /* Horizontal padding for large buttons */\n  --button-padding-x-lg: 1.5rem;\n\n  /* Vertical padding for large buttons */\n  --button-padding-y-lg: 0.75rem;\n\n  /* Default button font size */\n  --button-font-size: 1rem;\n\n  /* Small button font size */\n  --button-font-size-sm: 0.875rem;\n\n  /* Large button font size */\n  --button-font-size-lg: 1.125rem;\n\n  /* Button font weight */\n  --button-font-weight: 600;\n\n  /* Default button border radius */\n  --button-border-radius: 6px;\n\n  /* Small button border radius */\n  --button-border-radius-sm: 4px;\n\n  /* Large button border radius */\n  --button-border-radius-lg: 8px;\n\n  /* Button border width */\n  --button-border-width: 1rem;\n\n  /* Button transition animation */\n  --button-transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);\n\n  /* Button focus ring style */\n  --button-focus-ring: 0 0 0 3px rgba(38, 109, 220, 0.25);\n\n  /* Primary button utility classes */\n  --button-primary-class: bg-blue-600 hover:bg-blue-700 active:bg-blue-800;\n\n  /* Secondary button utility classes */\n  --button-secondary-class: bg-gray-600 hover:bg-gray-700 active:bg-gray-800;\n\n  /* Danger button utility classes */\n  --button-danger-class: bg-red-600 hover:bg-red-700 active:bg-red-800;\n\n  /* Success button utility classes */\n  --button-success-class: bg-green-600 hover:bg-green-700 active:bg-green-800;\n\n  /* Outline button utility classes */\n  --button-outline-class: bg-transparent border border-gray-300 text-gray-700 hover:border-gray-400 hover:bg-gray-50;\n\n  /* Disabled button utility classes */\n  --button-disabled-class: bg-gray-100 text-gray-400 cursor-not-allowed border-gray-200;\n\n  /* Base button utility classes */\n  --button-base-class: inline-flex items-center justify-center font-semibold rounded-md transition-all duration-150 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 disabled:opacity-50 disabled:cursor-not-allowed;\n\n  /* Medium button size utility classes */\n  --button-size-md-class: px-4 py-2 text-sm;\n\n  /* Small button size utility classes */\n  --button-size-sm-class: px-3 py-1.5 text-xs;\n\n  /* Large button size utility classes */\n  --button-size-lg-class: px-6 py-3 text-base;\n\n  /* Background color for input fields */\n  --input-bg-color: #ffffff;\n\n  /* Text color for input fields */\n  --input-text-color: #b5d416;\n\n  /* Default border color for input fields */\n  --input-border-color: #d5d8dc;\n\n  /* Border color for input fields when focused */\n  --input-border-color-focus: var(--primary-color);\n\n  /* Placeholder text color */\n  --input-placeholder-color: #7af202;\n\n  /* Horizontal padding for input fields */\n  --input-padding-x: 1rem;\n\n  /* Vertical padding for input fields */\n  --input-padding-y: 0.75rem;\n\n  /* Border radius for input fields */\n  --input-border-radius: 8px;\n\n  /* Border width for input fields */\n  --input-border-width: 1rem;\n\n  /* Font size for input text */\n  --input-font-size: 1rem;\n\n  /* Font family for input fields */\n  --input-font-family: Inter, system-ui, sans-serif;\n\n  /* Transition for input focus/hover states */\n  --input-transition: 0.2;\n\n  /* Box shadow for focused input fields */\n  --input-shadow-focus: 0 0 0 3px rgba(38, 109, 220, 0.1);\n\n  /* Border color on hover */\n  --input-hover-border-color: #9ca3af;\n\n  /* Background color for disabled inputs */\n  --input-disabled-bg: #f3f4f6;\n\n  /* Text color for disabled inputs */\n  --input-disabled-text: #7af202;\n\n  /* Border color for disabled inputs */\n  --input-disabled-border: #67880c;\n\n  /* Color for input labels */\n  --input-label-color: #374151;\n\n  /* Color for error states */\n  --input-error-color: #dc2626;\n\n  /* Color for success states */\n  --input-success-color: #16a34a;\n\n  /* Base input utility class */\n  --input: input;\n\n  /* Primary input variant */\n  --input-primary: input-primary;\n\n  /* Error input variant */\n  --input-error: input-error;\n\n  /* Success input variant */\n  --input-success: input-success;\n\n  /* Disabled input variant */\n  --input-disabled: input-disabled;\n\n  /* Large input size */\n  --input-lg: input-lg;\n\n  /* Small input size */\n  --input-sm: input-sm;\n\n  /* Width utility class (1.25rem) */\n  --w-5: w-5;\n\n  /* Height utility class (1.25rem) */\n  --h-5: h-5;\n\n  /* Horizontal padding utility class (1rem) */\n  --px-4: px-4;\n\n  /* Vertical padding utility class (0.75rem) */\n  --py-3: py-3;\n\n  /* Vertical padding utility class (0.5rem) */\n  --py-2: py-2;\n\n  /* Base text size utility class */\n  --text-base: text-base;\n\n  /* Extra small text size utility class */\n  --text-xs: text-xs;\n\n  /* Bottom margin utility class (0.25rem) */\n  --mb-1: mb-1;\n\n  /* Vertical spacing utility class */\n  --space-y-2: space-y-2;\n\n  /* Transition all properties utility class */\n  --transition-all: transition-all;\n\n  /* Remove outline utility class */\n  --outline-none: outline-none;\n\n  /* Margin left utility class (0.75rem / 12px) */\n  --ml-3: ml-3;\n\n  /* 2px border width utility class */\n  --border-2: border-2;\n\n  /* Solid border style utility class */\n  --border-solid: border-solid;\n\n  /* Medium border radius utility class */\n  --rounded: rounded;\n\n  /* Width utility class (0.75rem / 12px) */\n  --w-3: w-3;\n\n  /* Height utility class (0.75rem / 12px) */\n  --h-3: h-3;\n\n  /* Gray 400 border color utility class */\n  --border-gray-400: border-gray-400;\n\n  /* Blue 600 border color utility class */\n  --border-blue-600: border-blue-600;\n\n  /* Blue 700 border color utility class */\n  --border-blue-700: border-blue-700;\n\n  /* Blue 600 background utility class */\n  --bg-blue-600: bg-blue-600;\n\n  /* Blue 700 background utility class */\n  --bg-blue-700: bg-blue-700;\n\n  /* Gray 100 background utility class */\n  --bg-gray-100: bg-gray-100;\n\n  /* Gray 300 background utility class */\n  --bg-gray-300: bg-gray-300;\n\n  /* Checked state border color */\n  --checked:border-blue-600: checked:border-blue-600;\n\n  /* Checked state background color */\n  --checked:bg-blue-600: checked:bg-blue-600;\n\n  /* Hover state border color */\n  --hover:border-gray-400: hover:border-gray-400;\n\n  /* Hover checked state border color */\n  --hover:checked:border-blue-700: hover:checked:border-blue-700;\n\n  /* Hover checked state background color */\n  --hover:checked:bg-blue-700: hover:checked:bg-blue-700;\n\n  /* Remove default focus outline */\n  --focus:outline-none: focus:outline-none;\n\n  /* Focus ring width */\n  --focus:ring-2: focus:ring-2;\n\n  /* Focus ring color with opacity */\n  --focus:ring-blue-500/30: focus:ring-blue-500/30;\n\n  /* Focus state border color */\n  --focus:border-blue-600: focus:border-blue-600;\n\n  /* Disabled state border color */\n  --disabled:border-gray-200: disabled:border-gray-200;\n\n  /* Disabled state background color */\n  --disabled:bg-gray-100: disabled:bg-gray-100;\n\n  /* Disabled state cursor */\n  --disabled:cursor-not-allowed: disabled:cursor-not-allowed;\n\n  /* Disabled checked state border color */\n  --disabled:checked:border-gray-300: disabled:checked:border-gray-300;\n\n  /* Disabled checked state background color */\n  --disabled:checked:bg-gray-300: disabled:checked:bg-gray-300;\n\n  /* Show checkmark when checked */\n  --group-has-[:checked]:opacity-100: group-has-[:checked]:opacity-100;\n\n  /* Disabled label text color */\n  --group-has-[:disabled]:text-gray-400: group-has-[:disabled]:text-gray-400;\n\n  /* Opacity transition utility class */\n  --transition-opacity: transition-opacity;\n\n  /* CSS transform utility class */\n  --transform: transform;\n\n  /* Horizontal translation utility class */\n  -translate-x-1/2: -translate-x-1/2;\n\n  /* Vertical translation utility class */\n  -translate-y-1/2: -translate-y-1/2;\n\n  /* Top 50% positioning utility class */\n  --top-1/2: top-1/2;\n\n  /* Left 50% positioning utility class */\n  --left-1/2: left-1/2;\n\n  /* Absolute positioning utility class */\n  --absolute: absolute;\n\n  /* Pointer events none utility class */\n  --pointer-events-none: pointer-events-none;\n\n  /* Opacity 0 utility class */\n  --opacity-0: opacity-0;\n\n  /* Text selection none utility class */\n  --select-none: select-none;\n\n  /* Remove default appearance utility class */\n  --appearance-none: appearance-none;\n\n  /* Z-index for modals to appear above other content */\n  --modal-z-index: 50%;\n\n  /* Semi-transparent backdrop behind modal */\n  --modal-backdrop-bg: rgba(0, 0, 0, 0.5);\n\n  /* Backdrop blur amount */\n  --modal-backdrop-blur: 8px;\n\n  /* Maximum width of modal content */\n  --modal-max-width: 32px;\n\n  /* Minimum width of modal content */\n  --modal-min-width: 20px;\n\n  /* Duration of modal open/close animations */\n  --modal-animation-duration: 0.3;\n\n  /* Easing function for modal animations */\n  --modal-easing: cubic-bezier(0.4, 0, 0.2, 1);\n\n  /* Padding inside modal content area */\n  --modal-content-padding: 1.5rem;\n\n  /* Utility class for fixed positioning */\n  --fixed: fixed;\n\n  /* Utility class for top, right, bottom, left: 0 */\n  --inset-0: inset-0;\n\n  /* Utility class for flex-direction: column */\n  --flex-col: flex-col;\n\n  /* Utility class for 1.5rem gap */\n  --gap-6: gap-6;\n\n  /* Utility class for sticky positioning */\n  --sticky: sticky;\n\n  /* Utility class for top: 0 */\n  --top-0: top-0;\n\n  /* Utility class for backdrop blur */\n  --backdrop-blur-sm: backdrop-blur-sm;\n\n  /* Utility class for 300ms transition duration */\n  --duration-300: duration-300;\n\n  /* Utility class for ease-out timing function */\n  --ease-out: ease-out;\n\n  /* Utility class for 95% scale transform */\n  --scale-95: scale-95;\n\n  /* Utility class for 100% scale transform */\n  --scale-100: scale-100;\n\n  /* Utility class for 100% opacity */\n  --opacity-100: opacity-100;\n\n  /* Utility class for z-index: 50 */\n  --z-50: z-50;\n\n  /* Utility class for pointer-events: auto */\n  --pointer-events-auto: pointer-events-auto;\n\n  /* Utility class for scale 105% on hover */\n  --hover-scale-105: hover:scale-105;\n\n  /* Utility class for gray-800 background on hover */\n  --hover-bg-gray-800: hover:bg-gray-800;\n\n  /* Utility class for blue-600 background on hover */\n  --hover-bg-blue-600: hover:bg-blue-600;\n\n  /* Utility class for focus ring */\n  --focus-ring-4: focus:ring-4;\n\n  /* Utility class for blue focus ring */\n  --focus-ring-blue-500: focus:ring-blue-500;\n\n  /* Utility class for focus ring opacity */\n  --focus-ring-opacity-20: focus:ring-opacity-20;\n\n  /* Utility class for no outline on focus */\n  --focus-outline-none: focus:outline-none;\n\n  /* Animation utility class for entrance animations */\n  --animate-in: animate-in;\n\n  /* Fade in animation class */\n  --fade-in: fade-in;\n\n  /* Zoom in animation class */\n  --zoom-in-95: zoom-in-95;\n\n  /* Focus ring utility */\n  --focus-ring-2: focus:ring-2;\n\n  /* Focus ring offset */\n  --focus-ring-offset-2: focus:ring-offset-2;\n\n  /* Hover state for primary button */\n  --hover-bg-blue-700: hover:bg-blue-700;\n\n  /* Placeholder text color */\n  --placeholder-gray-400: placeholder-gray-400;\n\n  /* Line height utility */\n  --leading-relaxed: leading-relaxed;\n\n  /* Top margin utility class (1.5rem) */\n  --mt-6: mt-6;\n\n  /* Medium border radius utility class */\n  --rounded-md: rounded-md;\n\n  /* 2XL border radius utility class */\n  --rounded-2xl: rounded-2xl;\n\n  /* Very light success background color */\n  --success-50: #f0fdf4;\n\n  /* Light success background color */\n  --success-100: #dcfce7;\n\n  /* Primary success color */\n  --success-500: #22c55e;\n\n  /* Dark success color */\n  --success-600: #16a34a;\n\n  /* Darker success color */\n  --success-700: #15803d;\n\n  /* Very light warning background color */\n  --warning-50: #fffbeb;\n\n  /* Light warning background color */\n  --warning-100: #fef3c7;\n\n  /* Primary warning color */\n  --warning-500: #f59e0b;\n\n  /* Dark warning color */\n  --warning-600: #d97706;\n\n  /* Darker warning color */\n  --warning-700: #b45309;\n\n  /* Very light error background color */\n  --error-50: #fef2f2;\n\n  /* Light error background color */\n  --error-100: #fee2e2;\n\n  /* Primary error color */\n  --error-500: #ef4444;\n\n  /* Dark error color */\n  --error-600: #dc2626;\n\n  /* Darker error color */\n  --error-700: #b91c1c;\n\n  /* Very light info background color */\n  --info-50: #eff6ff;\n\n  /* Light info background color */\n  --info-100: #dbeafe;\n\n  /* Primary info color */\n  --info-500: #3b82f6;\n\n  /* Dark info color */\n  --info-600: #2563eb;\n\n  /* Darker info color */\n  --info-700: #1d4ed8;\n\n  /* Primary neutral color */\n  --neutral-500: #6b7280;\n\n  /* Soft shadow for subtle elevation */\n  --shadow-soft: 0 4px 20px rgba(0, 0, 0, 0.08);\n\n  /* Subtle shadow for alerts */\n  --shadow-subtle: 0 2px 10px rgba(0, 0, 0, 0.04);\n\n  /* Base size for alert icons */\n  --icon-size-base: 1.25rem;\n\n  /* Smooth transition for interactive elements */\n  --transition-smooth: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n\n  /* Utility class for success-50 background */\n  --bg-success-50: bg-success-50;\n\n  /* Utility class for warning-50 background */\n  --bg-warning-50: bg-warning-50;\n\n  /* Utility class for error-50 background */\n  --bg-error-50: bg-error-50;\n\n  /* Utility class for info-50 background */\n  --bg-info-50: bg-info-50;\n\n  /* Utility class for success-700 text color */\n  --text-success-700: text-success-700;\n\n  /* Utility class for warning-700 text color */\n  --text-warning-700: text-warning-700;\n\n  /* Utility class for error-700 text color */\n  --text-error-700: text-error-700;\n\n  /* Utility class for info-700 text color */\n  --text-info-700: text-info-700;\n\n  /* Utility class for success-200 border */\n  --border-success-200: border-success-200;\n\n  /* Utility class for warning-200 border */\n  --border-warning-200: border-warning-200;\n\n  /* Utility class for error-200 border */\n  --border-error-200: border-error-200;\n\n  /* Utility class for info-200 border */\n  --border-info-200: border-info-200;\n\n  /* Utility class for soft shadow */\n  --shadow-soft-class: shadow-soft;\n\n  /* Utility class for subtle shadow */\n  --shadow-subtle-class: shadow-subtle;\n\n  /* Utility class for smooth transition */\n  --transition-all-smooth: transition-all-smooth;\n\n  /* Vertical spacing utility class (1rem) */\n  --space-y-4: space-y-4;\n\n  /* Bottom margin utility class (0.5rem) */\n  --mb-2: mb-2;\n\n  /* Padding utility class (0.25rem) */\n  --p-1: p-1;\n\n  /* Bottom margin utility class (0.75rem) */\n  --mb-3: mb-3;\n\n  /* Primary background color for badges */\n  --badge-bg-primary: var(--primary-color);\n\n  /* Text color for primary badges */\n  --badge-text-primary: #ffffff;\n\n  /* Secondary background color for badges */\n  --badge-bg-secondary: #dcd926ff;\n\n  /* Text color for secondary badges */\n  --badge-text-secondary: #76f990;\n\n  /* Success state background color */\n  --badge-bg-success: #10b981;\n\n  /* Text color for success badges */\n  --badge-text-success: #ffffff;\n\n  /* Warning state background color */\n  --badge-bg-warning: #f59e0b;\n\n  /* Text color for warning badges */\n  --badge-text-warning: #ffffff;\n\n  /* Error state background color */\n  --badge-bg-error: #ef4444;\n\n  /* Text color for error badges */\n  --badge-text-error: #ffffff;\n\n  /* Transparent background for outline badges */\n  --badge-bg-outline: transparent;\n\n  /* Border color for outline badges */\n  --badge-border-outline: #d5d8dc;\n\n  /* Text color for outline badges */\n  --badge-text-outline: #374151;\n\n  /* Horizontal padding for badges */\n  --badge-padding-x: 0.75rem;\n\n  /* Vertical padding for badges */\n  --badge-padding-y: 0.25rem;\n\n  /* Border radius for pill-shaped badges */\n  --badge-border-radius: 50%;\n\n  /* Border radius for square badges */\n  --badge-border-radius-square: 6px;\n\n  /* Border width for outline badges */\n  --badge-border-width: 1rem;\n\n  /* Font size for badge text */\n  --badge-font-size: 0.75rem;\n\n  /* Font weight for badge text */\n  --badge-font-weight: 600;\n\n  /* Letter spacing for badge text */\n  --badge-letter-spacing: 0.025em;\n\n  /* Transition for hover states */\n  --badge-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n\n  /* Box shadow for elevated badges */\n  --badge-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);\n\n  /* Scale transform on hover */\n  --badge-hover-scale: 1.05;\n\n  /* Scale transform when active/clicked */\n  --badge-active-scale: 0.95;\n\n  /* Size for icons within badges */\n  --badge-icon-size: 0.75rem;\n\n  /* Gap between badge elements */\n  --badge-gap: 0.5rem;\n\n  /* Primary badge utility class */\n  --badge-primary: badge-primary;\n\n  /* Secondary badge utility class */\n  --badge-secondary: badge-secondary;\n\n  /* Success badge utility class */\n  --badge-success: badge-success;\n\n  /* Warning badge utility class */\n  --badge-warning: badge-warning;\n\n  /* Error badge utility class */\n  --badge-error: badge-error;\n\n  /* Outline badge utility class */\n  --badge-outline: badge-outline;\n\n  /* Pill-shaped badge utility class */\n  --badge-pill: badge-pill;\n\n  /* Badge with icon utility class */\n  --badge-with-icon: badge-with-icon;\n\n  /* Interactive badge utility class */\n  --badge-interactive: badge-interactive;\n\n  /* User-added custom property */\n  --muzingo-primary-color: #dd2c47;\n\n  /* User-added custom property */\n  --muzingo-primary-color-1: #266DDC;\n}\n/* Auto-generated Utility Classes from Design System */\n/* DO NOT EDIT - Generated from your design system API */\n\n:host, :root {\n  display: block;\n  box-sizing: border-box;\n}\n\n*, *::before, *::after {\n  box-sizing: inherit;\n}\n\n.bg-gray-50 {\n  background-color: var(--gray-50, #f9f9f9);\n}\n\n.font-sans {\n  font-family: var(--font-family-sans, Inter, system-ui, sans-serif);\n}\n\n.w-full {\n  width: var(--width, 100%);\n}\n\n.max-w-md {\n  max-width: var(--max-width, 300rem);\n}\n\n.mx-auto {\n  margin-left: auto;\n  margin-right: auto;\n}\n\n.bg-white {\n  background-color: var(--white, #ffffff);\n}\n\n.rounded-3xl {\n  border-radius: var(--border-radius-3xl, 20px);\n}\n\n.shadow-lg {\n  box-shadow: var(--shadow-lg, 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05));\n}\n\n.overflow-hidden {\n  overflow: hidden;\n}\n\n.p-6 {\n  padding: var(--spacing-6, 2.5rem);\n}\n\n.border-b {\n  border-bottom-width: var(--border-width-1, 1px);\n  border-bottom-style: var(--border-style-solid, solid);\n  border-bottom-color: var(--gray-200, #67880c);\n}\n\n.border-gray-200 {\n  border-color: var(--gray-200, #67880c);\n}\n\n.flex {\n  display: flex;\n}\n\n.justify-between {\n  justify-content: space-between;\n}\n\n.items-center {\n  align-items: center;\n}\n\n.text-xl {\n  font-size: 1.25rem;\n  line-height: 1.75rem;\n}\n\n.font-semibold {\n  font-weight: var(--font-weight-semibold, 600);\n}\n\n.text-gray-900 {\n  color: var(--gray-900, #76f990);\n}\n\n.font-mono {\n  font-family: var(--font-family-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace);\n}\n\n.text-gray-800 {\n  color: var(--gray-800, #122be2);\n}\n\n.rounded-xl {\n  border-radius: var(--border-radius-xl, 2px);\n}\n\n.p-4 {\n  padding: var(--spacing-4, 1rem);\n}\n\n.space-x-4 {\n  > * + * { margin-left: var(--spacing-4, 1rem); };\n}\n\n.w-14 {\n  width: 3.5rem;\n}\n\n.h-14 {\n  height: 3.5rem;\n}\n\n.rounded-full {\n  border-radius: var(--border-radius-full, 50%);\n}\n\n.object-cover {\n  object-fit: cover;\n}\n\n.flex-1 {\n  flex: 1 1 0%;\n}\n\n.text-sm {\n  font-size: var(--font-size-sm, 0.875rem);\n  line-height: 1.25rem;\n}\n\n.text-gray-500 {\n  color: var(--gray-500, #7af202);\n}\n\n.space-x-2 {\n  > * + * { margin-left: var(--spacing-2, 0.5rem); };\n}\n\n.p-2 {\n  padding: var(--spacing-2, 0.5rem);\n}\n\n.border {\n  border-width: var(--border-width-1, 1px);\n  border-style: var(--border-style-solid, solid);\n  border-color: var(--gray-200, #67880c);\n}\n\n.border-gray-300 {\n  border-color: var(--gray-300, #d5d8dc);\n}\n\n.transition-colors {\n  transition-property: color, background-color, border-color, box-shadow;\n  transition-duration: var(--duration-200, 0.2);\n  transition-timing-function: ease-in-out;\n}\n\n.bg-gray-800 {\n  background-color: var(--gray-800, #122be2);\n}\n\n.text-white {\n  color: var(--white, #ffffff);\n}\n\n.px-6 {\n  padding-left: var(--spacing-6, 2.5rem);\n  padding-right: var(--spacing-6, 2.5rem);\n}\n\n.pb-6 {\n  padding-bottom: var(--spacing-6, 2.5rem);\n}\n\n.space-y-6 {\n  > * + * { margin-top: var(--spacing-6, 2.5rem); };\n}\n\n.items-start {\n  align-items: flex-start;\n}\n\n.space-x-3 {\n  > * + * { margin-left: var(--spacing-3, 0.75rem); };\n}\n\n.mt-1 {\n  margin-top: var(--spacing-1, 0.25rem);\n}\n\n.flex-shrink-0 {\n  flex-shrink: 0;\n}\n\n.w-8 {\n  width: var(--spacing-8, 2rem);\n}\n\n.h-8 {\n  height: var(--spacing-8, 2rem);\n}\n\n.bg-blue-50 {\n  background-color: var(--blue-50, #eff6ff);\n}\n\n.justify-center {\n  justify-content: center;\n}\n\n.bg-gray-900 {\n  background-color: var(--gray-900, #76f990);\n}\n\n.w-12 {\n  width: 3rem;\n}\n\n.h-12 {\n  height: 3rem;\n}\n\n.font-medium {\n  font-weight: 500;\n}\n\n.text-lg {\n  font-size: var(--font-size-lg, 1.2rem);\n  line-height: 1.75rem;\n}\n\n.text-gray-300 {\n  color: var(--gray-300, #d5d8dc);\n}\n\n.py-6 {\n  padding-top: var(--spacing-6, 2.5rem);\n  padding-bottom: var(--spacing-6, 2.5rem);\n}\n\n.border-t {\n  border-top-width: var(--border-width-1, 1px);\n  border-top-style: var(--border-style-solid, solid);\n  border-top-color: var(--gray-200, #67880c);\n}\n\n.font-bold {\n  font-weight: 700;\n}\n\n.rounded-md {\n  border-radius: var(--border-radius-md, 6px);\n}\n\n.transition-all {\n  transition-property: all;\n  transition-duration: var(--duration-200, 0.2);\n  transition-timing-function: ease-in-out;\n}\n\n.bg-blue-600 {\n  background-color: var(--blue-600, #2563eb);\n}\n\n.px-4 {\n  padding-left: var(--spacing-4, 1rem);\n  padding-right: var(--spacing-4, 1rem);\n}\n\n.py-2 {\n  padding-top: var(--spacing-2, 0.5rem);\n  padding-bottom: var(--spacing-2, 0.5rem);\n}\n\n.text-gray-700 {\n  color: var(--gray-700, #374151);\n}\n\n.mb-1 {\n  margin-bottom: var(--spacing-1, 0.25rem);\n}\n\n.relative {\n  position: relative;\n}\n\n.absolute {\n  position: absolute;\n}\n\n.top-1\\/2 {\n  top: 50%;\n}\n\n.transform {\n  transform: translateX(0) translateY(0) rotate(0) scale(1);\n}\n\n.-translate-y-1\\/2 {\n  transform: translateY(-50%);\n}\n\n.pointer-events-none {\n  pointer-events: none;\n}\n\n.rounded-lg {\n  border-radius: var(--border-radius-lg, 8px);\n}\n\n.text-base {\n  font-size: var(--font-size-base, 1rem);\n  line-height: 1.5rem;\n}\n\n.leading-relaxed {\n  line-height: 1.625;\n}\n\n.duration-200 {\n  transition-duration: var(--duration-200, 0.2);\n}\n\n.outline-none {\n  outline: 2px solid transparent;\n  outline-offset: 2px;\n}\n\n.pl-12 {\n  padding-left: 3rem;\n}\n\n.text-xs {\n  font-size: var(--font-size-xs, 0.75rem);\n  line-height: 1rem;\n}\n\n.grid {\n  display: grid;\n}\n\n.grid-cols-2 {\n  grid-template-columns: repeat(2, minmax(0, 1fr));\n}\n\n.mt-6 {\n  margin-top: var(--spacing-6, 2.5rem);\n}\n\n.flex-col {\n  flex-direction: column;\n}\n\n.space-y-2 {\n  > * + * { margin-top: var(--spacing-2, 0.5rem); };\n}\n\n.text-red-600 {\n  color: #dc2626;\n}\n\n.border-red-500 {\n  border-color: #ef4444;\n}\n\n.border-green-600 {\n  border-color: #16a34a;\n}\n\n.text-green-600 {\n  color: #16a34a;\n}\n\n.cursor-pointer {\n  cursor: pointer;\n}\n\n.select-none {\n  user-select: none;\n}\n\n.appearance-none {\n  appearance: none;\n}\n\n.w-5 {\n  width: 1.25rem;\n}\n\n.h-5 {\n  height: 1.25rem;\n}\n\n.border-2 {\n  border-width: 2px;\n  border-style: solid;\n  border-color: inherit;\n}\n\n.border-solid {\n  border-style: solid;\n}\n\n.rounded {\n  border-radius: var(--border-radius-md, 6px);\n}\n\n.left-1\\/2 {\n  left: 50%;\n}\n\n.-translate-x-1\\/2 {\n  transform: translateX(-50%);\n}\n\n.w-3 {\n  width: 0.75rem;\n}\n\n.h-3 {\n  height: 0.75rem;\n}\n\n.opacity-0 {\n  opacity: 0;\n}\n\n.transition-opacity {\n  transition-property: opacity;\n  transition-duration: var(--duration-200, 0.2);\n  transition-timing-function: ease-in-out;\n}\n\n.ml-3 {\n  margin-left: var(--spacing-3, 0.75rem);\n}\n\n.fixed {\n  position: fixed;\n}\n\n.inset-0 {\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n}\n\n.rounded-2xl {\n  border-radius: var(--border-radius-2xl, 16px);\n}\n\n.duration-300 {\n  transition-duration: 0.3s;\n}\n\n.space-y-4 {\n  > * + * { margin-top: var(--spacing-4, 1rem); };\n}\n\n.mb-2 {\n  margin-bottom: var(--spacing-2, 0.5rem);\n}\n\n.px-3 {\n  padding-left: var(--spacing-3, 0.75rem);\n  padding-right: var(--spacing-3, 0.75rem);\n}\n\n.border-blue-600 {\n  border-color: var(--blue-600, #2563eb);\n}\n\n.text-blue-600 {\n  color: var(--blue-600, #2563eb);\n}\n\n.p-1 {\n  padding: var(--spacing-1, 0.25rem);\n}\n\n.bg-transparent {\n  background-color: transparent;\n}\n\n.mb-3 {\n  margin-bottom: var(--spacing-3, 0.75rem);\n}\n\n.text-gray-600 {\n  color: var(--gray-600, #4b5563);\n}\n\n.py-1 {\n  padding-top: var(--spacing-1, 0.25rem);\n  padding-bottom: var(--spacing-1, 0.25rem);\n}\n\n.shadow-sm {\n  box-shadow: var(--shadow-sm, 0 1px 2px 0 rgba(0, 0, 0, 0.05));\n}\n\n.w-4 {\n  width: 1rem;\n}\n\n.h-4 {\n  height: 1rem;\n}\n\n.bg-gray-100:hover {\n  background-color: var(--gray-100, #f3f4f6);\n}\n\n.outline-none:focus {\n  outline: 2px solid transparent;\n  outline-offset: 2px;\n}\n\n.cursor-not-allowed:disabled {\n  cursor: not-allowed;\n}\n\n.bg-blue-700:hover {\n  background-color: #1d4ed8;\n}\n\n.border-gray-400:hover {\n  border-color: var(--gray-400, #9ca3af);\n}\n\n.border-red-500:focus {\n  border-color: #ef4444;\n}\n\n.border-green-600:focus {\n  border-color: #16a34a;\n}\n\n.border-blue-600:checked {\n  border-color: var(--blue-600, #2563eb);\n}\n\n.bg-blue-600:checked {\n  background-color: var(--blue-600, #2563eb);\n}\n\n.border-blue-600:focus {\n  border-color: var(--blue-600, #2563eb);\n}\n\n.border-gray-200:disabled {\n  border-color: var(--gray-200, #67880c);\n}\n\n.bg-gray-100:disabled {\n  background-color: var(--gray-100, #f3f4f6);\n}\n\n.bg-gray-50:hover {\n  background-color: var(--gray-50, #f9f9f9);\n}\n\n.bg-blue-600:hover {\n  background-color: var(--blue-600, #2563eb);\n}\n\n.bg-green-600:hover {\n  background-color: #16a34a;\n}\n\n.bg-red-600:hover {\n  background-color: #dc2626;\n}\n\n.text-gray-900:hover {\n  color: var(--gray-900, #76f990);\n}\n\n\n/* Global reset */\n*,\n*::before,\n*::after {\n  padding: 0;\n  margin: 0;\n  box-sizing: border-box;\n}\n\n/* Base styles using design tokens */\n:root {\n  font-family: var(--font-family-sans, Inter, system-ui, sans-serif);\n  line-height: 1.5;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\n/* Ensure SVG icons display properly and can be styled via tokens */\nsvg {\n  display: inline-block;\n  vertical-align: middle;\n  fill: currentColor;\n  width: 1em;\n  height: 1em;\n}\n\n/* Allow SVG parts to be styled */\nsvg[part=\"icon\"] {\n  width: var(--icon-size, 1em);\n  height: var(--icon-size, 1em);\n  color: var(--icon-color, currentColor);\n}\n\n/* Host styles for components */\n:host {\n  display: block;\n}\n\n/* Component part styling */\n::part(icon) {\n  width: var(--icon-size, 1.25rem);\n  height: var(--icon-size, 1.25rem);\n}\n\n/* Animation keyframes from design system */\n@keyframes fadeIn {\n  from {\n    opacity: var(--opacity-0, 0);\n  }\n  to {\n    opacity: var(--opacity-100, 1);\n  }\n}\n\n@keyframes slideIn {\n  from {\n    transform: translateY(10px);\n    opacity: 0;\n  }\n  to {\n    transform: translateY(0);\n    opacity: 1;\n  }\n}";
+
+/*
+ Stencil Client Platform v4.43.2 | MIT Licensed | https://stenciljs.com
+ */
+
+
+// src/utils/get-prop-descriptor.ts
+function getPropertyDescriptor(obj, memberName, getOnly) {
+  const stopAt = typeof HTMLElement !== "undefined" ? HTMLElement.prototype : null;
+  while (obj && obj !== stopAt) {
+    const desc = Object.getOwnPropertyDescriptor(obj, memberName);
+    if (desc && (!getOnly || desc.get)) return desc;
+    obj = Object.getPrototypeOf(obj);
+  }
+  return void 0;
+}
+
+// src/utils/es2022-rewire-class-members.ts
+var reWireGetterSetter = (instance, hostRef) => {
+  var _a;
+  const cmpMeta = hostRef.$cmpMeta$;
+  const members = Object.entries((_a = cmpMeta.$members$) != null ? _a : {});
+  members.map(([memberName, [memberFlags]]) => {
+    if ((memberFlags & 31 /* Prop */ || memberFlags & 32 /* State */)) {
+      const ogValue = instance[memberName];
+      const ogDescriptor = getPropertyDescriptor(Object.getPrototypeOf(instance), memberName, true) || Object.getOwnPropertyDescriptor(instance, memberName);
+      if (ogDescriptor) {
+        Object.defineProperty(instance, memberName, {
+          get() {
+            return ogDescriptor.get.call(this);
+          },
+          set(newValue) {
+            ogDescriptor.set.call(this, newValue);
+          },
+          configurable: true,
+          enumerable: true
+        });
+      }
+      if (hostRef.$instanceValues$.has(memberName)) {
+        instance[memberName] = hostRef.$instanceValues$.get(memberName);
+      } else if (ogValue !== void 0) {
+        instance[memberName] = ogValue;
+      }
+    }
+  });
+};
+
+// src/client/client-host-ref.ts
+var getHostRef = (ref) => {
+  if (ref.__stencil__getHostRef) {
+    return ref.__stencil__getHostRef();
+  }
+  return void 0;
+};
+var registerInstance = (lazyInstance, hostRef) => {
+  if (!hostRef) return;
+  lazyInstance.__stencil__getHostRef = () => hostRef;
+  hostRef.$lazyInstance$ = lazyInstance;
+  if (hostRef.$cmpMeta$.$flags$ & 512 /* hasModernPropertyDecls */ && (BUILD.prop)) {
+    reWireGetterSetter(lazyInstance, hostRef);
+  }
+};
+var registerHost = (hostElement, cmpMeta) => {
+  const hostRef = {
+    $flags$: 0,
+    $hostElement$: hostElement,
+    $cmpMeta$: cmpMeta,
+    $instanceValues$: /* @__PURE__ */ new Map(),
+    $serializerValues$: /* @__PURE__ */ new Map()
+  };
+  {
+    hostRef.$onReadyPromise$ = new Promise((r) => hostRef.$onReadyResolve$ = r);
+    hostElement["s-p"] = [];
+    hostElement["s-rc"] = [];
+  }
+  {
+    hostRef.$fetchedCbList$ = [];
+  }
+  const ref = hostRef;
+  hostElement.__stencil__getHostRef = () => ref;
+  return ref;
+};
+var isMemberInElement = (elm, memberName) => memberName in elm;
+var consoleError = (e, el) => (0, console.error)(e, el);
+
+// src/client/client-load-module.ts
+var cmpModules = /* @__PURE__ */ new Map();
+var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
+  const exportName = cmpMeta.$tagName$.replace(/-/g, "_");
+  const bundleId = cmpMeta.$lazyBundleId$;
+  if (!bundleId) {
+    return void 0;
+  }
+  const module = cmpModules.get(bundleId) ;
+  if (module) {
+    return module[exportName];
+  }
+  /*!__STENCIL_STATIC_IMPORT_SWITCH__*/
+  return import(
+    /* @vite-ignore */
+    /* webpackInclude: /\.entry\.js$/ */
+    /* webpackExclude: /\.system\.entry\.js$/ */
+    /* webpackMode: "lazy" */
+    `./${bundleId}.entry.js${""}`
+  ).then(
+    (importedModule) => {
+      {
+        cmpModules.set(bundleId, importedModule);
+      }
+      return importedModule[exportName];
+    },
+    (e) => {
+      consoleError(e, hostRef.$hostElement$);
+    }
+  );
+};
+
+// src/client/client-style.ts
+var styles = /* @__PURE__ */ new Map();
+var HYDRATED_CSS = "{visibility:hidden}.hydrated{visibility:inherit}";
+var SLOT_FB_CSS = "slot-fb{display:contents}slot-fb[hidden]{display:none}";
+var win = typeof window !== "undefined" ? window : {};
+var plt = {
+  $flags$: 0,
+  $resourcesUrl$: "",
+  jmp: (h2) => h2(),
+  raf: (h2) => requestAnimationFrame(h2),
+  ael: (el, eventName, listener, opts) => el.addEventListener(eventName, listener, opts),
+  rel: (el, eventName, listener, opts) => el.removeEventListener(eventName, listener, opts),
+  ce: (eventName, opts) => new CustomEvent(eventName, opts)
+};
+var promiseResolve = (v) => Promise.resolve(v);
+var supportsConstructableStylesheets = /* @__PURE__ */ (() => {
+  try {
+    if (!win.document.adoptedStyleSheets) {
+      return false;
+    }
+    new CSSStyleSheet();
+    return typeof new CSSStyleSheet().replaceSync === "function";
+  } catch (e) {
+  }
+  return false;
+})() ;
+var supportsMutableAdoptedStyleSheets = supportsConstructableStylesheets ? /* @__PURE__ */ (() => !!win.document && Object.getOwnPropertyDescriptor(win.document.adoptedStyleSheets, "length").writable)() : false;
+var queuePending = false;
+var queueDomReads = [];
+var queueDomWrites = [];
+var queueTask = (queue, write) => (cb) => {
+  queue.push(cb);
+  if (!queuePending) {
+    queuePending = true;
+    if (write && plt.$flags$ & 4 /* queueSync */) {
+      nextTick(flush);
+    } else {
+      plt.raf(flush);
+    }
+  }
+};
+var consume = (queue) => {
+  for (let i2 = 0; i2 < queue.length; i2++) {
+    try {
+      queue[i2](performance.now());
+    } catch (e) {
+      consoleError(e);
+    }
+  }
+  queue.length = 0;
+};
+var flush = () => {
+  consume(queueDomReads);
+  {
+    consume(queueDomWrites);
+    if (queuePending = queueDomReads.length > 0) {
+      plt.raf(flush);
+    }
+  }
+};
+var nextTick = (cb) => promiseResolve().then(cb);
+var writeTask = /* @__PURE__ */ queueTask(queueDomWrites, true);
+
+// src/utils/style.ts
+function createStyleSheetIfNeededAndSupported(styles2) {
+  if (!supportsConstructableStylesheets) return void 0;
+  const sheet = new CSSStyleSheet();
+  sheet.replaceSync(styles2);
+  return sheet;
+}
+
+// src/utils/shadow-root.ts
+var globalStyleSheet;
+function createShadowRoot(cmpMeta) {
+  var _a;
+  const opts = { mode: "open" };
+  const shadowRoot = this.attachShadow(opts);
+  if (globalStyleSheet === void 0) globalStyleSheet = (_a = createStyleSheetIfNeededAndSupported(globalStyles)) != null ? _a : null;
+  if (globalStyleSheet) {
+    if (supportsMutableAdoptedStyleSheets) {
+      shadowRoot.adoptedStyleSheets.push(globalStyleSheet);
+    } else {
+      shadowRoot.adoptedStyleSheets = [...shadowRoot.adoptedStyleSheets, globalStyleSheet];
+    }
+  } else if (!supportsConstructableStylesheets) {
+    const styleElm = document.createElement("style");
+    styleElm.innerHTML = globalStyles;
+    shadowRoot.prepend(styleElm);
+  }
+}
+var createTime = (fnName, tagName = "") => {
+  {
+    return () => {
+      return;
+    };
+  }
+};
+var uniqueTime = (key, measureText) => {
+  {
+    return () => {
+      return;
+    };
+  }
+};
+
+// src/utils/query-nonce-meta-tag-content.ts
+function queryNonceMetaTagContent(doc) {
+  var _a, _b, _c;
+  return (_c = (_b = (_a = doc.head) == null ? void 0 : _a.querySelector('meta[name="csp-nonce"]')) == null ? void 0 : _b.getAttribute("content")) != null ? _c : void 0;
+}
+
+// src/runtime/styles.ts
+var rootAppliedStyles = /* @__PURE__ */ new WeakMap();
+var registerStyle = (scopeId2, cssText, allowCS) => {
+  let style = styles.get(scopeId2);
+  if (supportsConstructableStylesheets && allowCS) {
+    style = style || new CSSStyleSheet();
+    if (typeof style === "string") {
+      style = cssText;
+    } else {
+      style.replaceSync(cssText);
+    }
+  } else {
+    style = cssText;
+  }
+  styles.set(scopeId2, style);
+};
+var addStyle = (styleContainerNode, cmpMeta, mode) => {
+  var _a, _b, _c;
+  const scopeId2 = getScopeId(cmpMeta);
+  const style = styles.get(scopeId2);
+  if (!win.document) {
+    return scopeId2;
+  }
+  styleContainerNode = styleContainerNode.nodeType === 11 /* DocumentFragment */ ? styleContainerNode : win.document;
+  if (style) {
+    if (typeof style === "string") {
+      styleContainerNode = styleContainerNode.head || styleContainerNode;
+      let appliedStyles = rootAppliedStyles.get(styleContainerNode);
+      let styleElm;
+      if (!appliedStyles) {
+        rootAppliedStyles.set(styleContainerNode, appliedStyles = /* @__PURE__ */ new Set());
+      }
+      if (!appliedStyles.has(scopeId2)) {
+        styleElm = win.document.createElement("style");
+        styleElm.textContent = style;
+        const nonce = (_a = plt.$nonce$) != null ? _a : queryNonceMetaTagContent(win.document);
+        if (nonce != null) {
+          styleElm.setAttribute("nonce", nonce);
+        }
+        if (!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */)) {
+          if (styleContainerNode.nodeName === "HEAD") {
+            const preconnectLinks = styleContainerNode.querySelectorAll("link[rel=preconnect]");
+            const referenceNode2 = preconnectLinks.length > 0 ? preconnectLinks[preconnectLinks.length - 1].nextSibling : styleContainerNode.querySelector("style");
+            styleContainerNode.insertBefore(
+              styleElm,
+              (referenceNode2 == null ? void 0 : referenceNode2.parentNode) === styleContainerNode ? referenceNode2 : null
+            );
+          } else if ("host" in styleContainerNode) {
+            if (supportsConstructableStylesheets) {
+              const currentWindow = (_b = styleContainerNode.defaultView) != null ? _b : styleContainerNode.ownerDocument.defaultView;
+              const stylesheet = new currentWindow.CSSStyleSheet();
+              stylesheet.replaceSync(style);
+              if (supportsMutableAdoptedStyleSheets) {
+                styleContainerNode.adoptedStyleSheets.unshift(stylesheet);
+              } else {
+                styleContainerNode.adoptedStyleSheets = [stylesheet, ...styleContainerNode.adoptedStyleSheets];
+              }
+            } else {
+              const existingStyleContainer = styleContainerNode.querySelector("style");
+              if (existingStyleContainer && true) {
+                existingStyleContainer.textContent = style + existingStyleContainer.textContent;
+              } else {
+                styleContainerNode.prepend(styleElm);
+              }
+            }
+          } else {
+            styleContainerNode.append(styleElm);
+          }
+        }
+        if (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
+          styleContainerNode.insertBefore(styleElm, null);
+        }
+        if (cmpMeta.$flags$ & 4 /* hasSlotRelocation */) {
+          styleElm.textContent += SLOT_FB_CSS;
+        }
+        if (appliedStyles) {
+          appliedStyles.add(scopeId2);
+        }
+      }
+    } else {
+      let appliedStyles = rootAppliedStyles.get(styleContainerNode);
+      if (!appliedStyles) {
+        rootAppliedStyles.set(styleContainerNode, appliedStyles = /* @__PURE__ */ new Set());
+      }
+      if (!appliedStyles.has(scopeId2)) {
+        const currentWindow = (_c = styleContainerNode.defaultView) != null ? _c : styleContainerNode.ownerDocument.defaultView;
+        let stylesheet;
+        if (style.constructor === currentWindow.CSSStyleSheet) {
+          stylesheet = style;
+        } else {
+          stylesheet = new currentWindow.CSSStyleSheet();
+          for (let i2 = 0; i2 < style.cssRules.length; i2++) {
+            stylesheet.insertRule(style.cssRules[i2].cssText, i2);
+          }
+        }
+        if (supportsMutableAdoptedStyleSheets) {
+          styleContainerNode.adoptedStyleSheets.push(stylesheet);
+        } else {
+          styleContainerNode.adoptedStyleSheets = [...styleContainerNode.adoptedStyleSheets, stylesheet];
+        }
+        appliedStyles.add(scopeId2);
+      }
+    }
+  }
+  return scopeId2;
+};
+var attachStyles = (hostRef) => {
+  const cmpMeta = hostRef.$cmpMeta$;
+  const elm = hostRef.$hostElement$;
+  const flags = cmpMeta.$flags$;
+  const endAttachStyles = createTime("attachStyles", cmpMeta.$tagName$);
+  const scopeId2 = addStyle(
+    elm.shadowRoot ? elm.shadowRoot : elm.getRootNode(),
+    cmpMeta);
+  if (flags & 10 /* needsScopedEncapsulation */) {
+    elm["s-sc"] = scopeId2;
+    elm.classList.add(scopeId2 + "-h");
+  }
+  endAttachStyles();
+};
+var getScopeId = (cmp, mode) => "sc-" + (cmp.$tagName$);
+var isComplexType = (o) => {
+  o = typeof o;
+  return o === "object" || o === "function";
+};
+
+// src/runtime/vdom/h.ts
+var h = (nodeName, vnodeData, ...children) => {
+  if (typeof nodeName === "string") {
+    nodeName = transformTag(nodeName);
+  }
+  let child = null;
+  let key = null;
+  let simple = false;
+  let lastSimple = false;
+  const vNodeChildren = [];
+  const walk = (c) => {
+    for (let i2 = 0; i2 < c.length; i2++) {
+      child = c[i2];
+      if (Array.isArray(child)) {
+        walk(child);
+      } else if (child != null && typeof child !== "boolean") {
+        if (simple = typeof nodeName !== "function" && !isComplexType(child)) {
+          child = String(child);
+        }
+        if (simple && lastSimple) {
+          vNodeChildren[vNodeChildren.length - 1].$text$ += child;
+        } else {
+          vNodeChildren.push(simple ? newVNode(null, child) : child);
+        }
+        lastSimple = simple;
+      }
+    }
+  };
+  walk(children);
+  if (vnodeData) {
+    if (vnodeData.key) {
+      key = vnodeData.key;
+    }
+    {
+      const classData = vnodeData.className || vnodeData.class;
+      if (classData) {
+        vnodeData.class = typeof classData !== "object" ? classData : Object.keys(classData).filter((k) => classData[k]).join(" ");
+      }
+    }
+  }
+  const vnode = newVNode(nodeName, null);
+  vnode.$attrs$ = vnodeData;
+  if (vNodeChildren.length > 0) {
+    vnode.$children$ = vNodeChildren;
+  }
+  {
+    vnode.$key$ = key;
+  }
+  return vnode;
+};
+var newVNode = (tag, text) => {
+  const vnode = {
+    $flags$: 0,
+    $tag$: tag,
+    // Normalize undefined to null to prevent rendering "undefined" as text
+    $text$: text != null ? text : null,
+    $elm$: null,
+    $children$: null
+  };
+  {
+    vnode.$attrs$ = null;
+  }
+  {
+    vnode.$key$ = null;
+  }
+  return vnode;
+};
+var Host = {};
+var isHost = (node) => node && node.$tag$ === Host;
+
+// src/runtime/parse-property-value.ts
+var parsePropertyValue = (propValue, propType, isFormAssociated) => {
+  if (propValue != null && !isComplexType(propValue)) {
+    if (propType & 1 /* String */) {
+      return String(propValue);
+    }
+    return propValue;
+  }
+  return propValue;
+};
+var emitEvent = (elm, name, opts) => {
+  const ev = plt.ce(name, opts);
+  elm.dispatchEvent(ev);
+  return ev;
+};
+var setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags, initialRender) => {
+  if (oldValue === newValue) {
+    return;
+  }
+  let isProp = isMemberInElement(elm, memberName);
+  memberName.toLowerCase();
+  if (memberName === "class") {
+    const classList = elm.classList;
+    const oldClasses = parseClassList(oldValue);
+    let newClasses = parseClassList(newValue);
+    {
+      classList.remove(...oldClasses.filter((c) => c && !newClasses.includes(c)));
+      classList.add(...newClasses.filter((c) => c && !oldClasses.includes(c)));
+    }
+  } else if (memberName === "style") {
+    {
+      for (const prop in oldValue) {
+        if (!newValue || newValue[prop] == null) {
+          if (prop.includes("-")) {
+            elm.style.removeProperty(prop);
+          } else {
+            elm.style[prop] = "";
+          }
+        }
+      }
+    }
+    for (const prop in newValue) {
+      if (!oldValue || newValue[prop] !== oldValue[prop]) {
+        if (prop.includes("-")) {
+          elm.style.setProperty(prop, newValue[prop]);
+        } else {
+          elm.style[prop] = newValue[prop];
+        }
+      }
+    }
+  } else if (memberName === "key") ; else if (memberName[0] === "a" && memberName.startsWith("attr:")) {
+    const propName = memberName.slice(5);
+    let attrName;
+    {
+      const hostRef = getHostRef(elm);
+      if (hostRef && hostRef.$cmpMeta$ && hostRef.$cmpMeta$.$members$) {
+        const memberMeta = hostRef.$cmpMeta$.$members$[propName];
+        if (memberMeta && memberMeta[1]) {
+          attrName = memberMeta[1];
+        }
+      }
+    }
+    if (!attrName) {
+      attrName = propName.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
+    }
+    if (newValue == null || newValue === false) {
+      if (newValue !== false || elm.getAttribute(attrName) === "") {
+        elm.removeAttribute(attrName);
+      }
+    } else {
+      elm.setAttribute(attrName, newValue === true ? "" : newValue);
+    }
+    return;
+  } else if (memberName[0] === "p" && memberName.startsWith("prop:")) {
+    const propName = memberName.slice(5);
+    try {
+      elm[propName] = newValue;
+    } catch (e) {
+    }
+    return;
+  } else {
+    const isComplex = isComplexType(newValue);
+    if ((isProp || isComplex && newValue !== null) && !isSvg) {
+      try {
+        if (!elm.tagName.includes("-")) {
+          const n = newValue == null ? "" : newValue;
+          if (memberName === "list") {
+            isProp = false;
+          } else if (oldValue == null || elm[memberName] !== n) {
+            if (typeof elm.__lookupSetter__(memberName) === "function") {
+              elm[memberName] = n;
+            } else {
+              elm.setAttribute(memberName, n);
+            }
+          }
+        } else if (elm[memberName] !== newValue) {
+          elm[memberName] = newValue;
+        }
+      } catch (e) {
+      }
+    }
+    if (newValue == null || newValue === false) {
+      if (newValue !== false || elm.getAttribute(memberName) === "") {
+        {
+          elm.removeAttribute(memberName);
+        }
+      }
+    } else if ((!isProp || flags & 4 /* isHost */ || isSvg) && !isComplex && elm.nodeType === 1 /* ElementNode */) {
+      newValue = newValue === true ? "" : newValue;
+      {
+        elm.setAttribute(memberName, newValue);
+      }
+    }
+  }
+};
+var parseClassListRegex = /\s/;
+var parseClassList = (value) => {
+  if (typeof value === "object" && value && "baseVal" in value) {
+    value = value.baseVal;
+  }
+  if (!value || typeof value !== "string") {
+    return [];
+  }
+  return value.split(parseClassListRegex);
+};
+
+// src/runtime/vdom/update-element.ts
+var updateElement = (oldVnode, newVnode, isSvgMode2, isInitialRender) => {
+  const elm = newVnode.$elm$.nodeType === 11 /* DocumentFragment */ && newVnode.$elm$.host ? newVnode.$elm$.host : newVnode.$elm$;
+  const oldVnodeAttrs = oldVnode && oldVnode.$attrs$ || {};
+  const newVnodeAttrs = newVnode.$attrs$ || {};
+  {
+    for (const memberName of sortedAttrNames(Object.keys(oldVnodeAttrs))) {
+      if (!(memberName in newVnodeAttrs)) {
+        setAccessor(
+          elm,
+          memberName,
+          oldVnodeAttrs[memberName],
+          void 0,
+          isSvgMode2,
+          newVnode.$flags$);
+      }
+    }
+  }
+  for (const memberName of sortedAttrNames(Object.keys(newVnodeAttrs))) {
+    setAccessor(
+      elm,
+      memberName,
+      oldVnodeAttrs[memberName],
+      newVnodeAttrs[memberName],
+      isSvgMode2,
+      newVnode.$flags$);
+  }
+};
+function sortedAttrNames(attrNames) {
+  return attrNames.includes("ref") ? (
+    // we need to sort these to ensure that `'ref'` is the last attr
+    [...attrNames.filter((attr) => attr !== "ref"), "ref"]
+  ) : (
+    // no need to sort, return the original array
+    attrNames
+  );
+}
+var hostTagName;
+var isSvgMode = false;
+var createElm = (oldParentVNode, newParentVNode, childIndex) => {
+  const newVNode2 = newParentVNode.$children$[childIndex];
+  let i2 = 0;
+  let elm;
+  let childNode;
+  if (newVNode2.$text$ != null) {
+    elm = newVNode2.$elm$ = win.document.createTextNode(newVNode2.$text$);
+  } else {
+    if (!win.document) {
+      throw new Error("You are trying to render a Stencil component in an environment that doesn't support the DOM.");
+    }
+    elm = newVNode2.$elm$ = win.document.createElement(
+      newVNode2.$tag$
+    );
+    {
+      updateElement(null, newVNode2, isSvgMode);
+    }
+    if (newVNode2.$children$) {
+      const appendTarget = newVNode2.$tag$ === "template" ? elm.content : elm;
+      for (i2 = 0; i2 < newVNode2.$children$.length; ++i2) {
+        childNode = createElm(oldParentVNode, newVNode2, i2);
+        if (childNode) {
+          appendTarget.appendChild(childNode);
+        }
+      }
+    }
+  }
+  elm["s-hn"] = hostTagName;
+  return elm;
+};
+var addVnodes = (parentElm, before, parentVNode, vnodes, startIdx, endIdx) => {
+  let containerElm = parentElm;
+  let childNode;
+  if (containerElm.shadowRoot && containerElm.tagName === hostTagName) {
+    containerElm = containerElm.shadowRoot;
+  }
+  if (parentVNode.$tag$ === "template") {
+    containerElm = containerElm.content;
+  }
+  for (; startIdx <= endIdx; ++startIdx) {
+    if (vnodes[startIdx]) {
+      childNode = createElm(null, parentVNode, startIdx);
+      if (childNode) {
+        vnodes[startIdx].$elm$ = childNode;
+        insertBefore(containerElm, childNode, before);
+      }
+    }
+  }
+};
+var removeVnodes = (vnodes, startIdx, endIdx) => {
+  for (let index = startIdx; index <= endIdx; ++index) {
+    const vnode = vnodes[index];
+    if (vnode) {
+      const elm = vnode.$elm$;
+      if (elm) {
+        elm.remove();
+      }
+    }
+  }
+};
+var updateChildren = (parentElm, oldCh, newVNode2, newCh, isInitialRender = false) => {
+  let oldStartIdx = 0;
+  let newStartIdx = 0;
+  let idxInOld = 0;
+  let i2 = 0;
+  let oldEndIdx = oldCh.length - 1;
+  let oldStartVnode = oldCh[0];
+  let oldEndVnode = oldCh[oldEndIdx];
+  let newEndIdx = newCh.length - 1;
+  let newStartVnode = newCh[0];
+  let newEndVnode = newCh[newEndIdx];
+  let node;
+  let elmToMove;
+  const containerElm = newVNode2.$tag$ === "template" ? parentElm.content : parentElm;
+  while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) {
+    if (oldStartVnode == null) {
+      oldStartVnode = oldCh[++oldStartIdx];
+    } else if (oldEndVnode == null) {
+      oldEndVnode = oldCh[--oldEndIdx];
+    } else if (newStartVnode == null) {
+      newStartVnode = newCh[++newStartIdx];
+    } else if (newEndVnode == null) {
+      newEndVnode = newCh[--newEndIdx];
+    } else if (isSameVnode(oldStartVnode, newStartVnode, isInitialRender)) {
+      patch(oldStartVnode, newStartVnode, isInitialRender);
+      oldStartVnode = oldCh[++oldStartIdx];
+      newStartVnode = newCh[++newStartIdx];
+    } else if (isSameVnode(oldEndVnode, newEndVnode, isInitialRender)) {
+      patch(oldEndVnode, newEndVnode, isInitialRender);
+      oldEndVnode = oldCh[--oldEndIdx];
+      newEndVnode = newCh[--newEndIdx];
+    } else if (isSameVnode(oldStartVnode, newEndVnode, isInitialRender)) {
+      patch(oldStartVnode, newEndVnode, isInitialRender);
+      insertBefore(containerElm, oldStartVnode.$elm$, oldEndVnode.$elm$.nextSibling);
+      oldStartVnode = oldCh[++oldStartIdx];
+      newEndVnode = newCh[--newEndIdx];
+    } else if (isSameVnode(oldEndVnode, newStartVnode, isInitialRender)) {
+      patch(oldEndVnode, newStartVnode, isInitialRender);
+      insertBefore(containerElm, oldEndVnode.$elm$, oldStartVnode.$elm$);
+      oldEndVnode = oldCh[--oldEndIdx];
+      newStartVnode = newCh[++newStartIdx];
+    } else {
+      idxInOld = -1;
+      {
+        for (i2 = oldStartIdx; i2 <= oldEndIdx; ++i2) {
+          if (oldCh[i2] && oldCh[i2].$key$ !== null && oldCh[i2].$key$ === newStartVnode.$key$) {
+            idxInOld = i2;
+            break;
+          }
+        }
+      }
+      if (idxInOld >= 0) {
+        elmToMove = oldCh[idxInOld];
+        if (elmToMove.$tag$ !== newStartVnode.$tag$) {
+          node = createElm(oldCh && oldCh[newStartIdx], newVNode2, idxInOld);
+        } else {
+          patch(elmToMove, newStartVnode, isInitialRender);
+          oldCh[idxInOld] = void 0;
+          node = elmToMove.$elm$;
+        }
+        newStartVnode = newCh[++newStartIdx];
+      } else {
+        node = createElm(oldCh && oldCh[newStartIdx], newVNode2, newStartIdx);
+        newStartVnode = newCh[++newStartIdx];
+      }
+      if (node) {
+        {
+          insertBefore(oldStartVnode.$elm$.parentNode, node, oldStartVnode.$elm$);
+        }
+      }
+    }
+  }
+  if (oldStartIdx > oldEndIdx) {
+    addVnodes(
+      parentElm,
+      newCh[newEndIdx + 1] == null ? null : newCh[newEndIdx + 1].$elm$,
+      newVNode2,
+      newCh,
+      newStartIdx,
+      newEndIdx
+    );
+  } else if (newStartIdx > newEndIdx) {
+    removeVnodes(oldCh, oldStartIdx, oldEndIdx);
+  }
+};
+var isSameVnode = (leftVNode, rightVNode, isInitialRender = false) => {
+  if (leftVNode.$tag$ === rightVNode.$tag$) {
+    if (!isInitialRender) {
+      return leftVNode.$key$ === rightVNode.$key$;
+    }
+    if (isInitialRender && !leftVNode.$key$ && rightVNode.$key$) {
+      leftVNode.$key$ = rightVNode.$key$;
+    }
+    return true;
+  }
+  return false;
+};
+var patch = (oldVNode, newVNode2, isInitialRender = false) => {
+  const elm = newVNode2.$elm$ = oldVNode.$elm$;
+  const oldChildren = oldVNode.$children$;
+  const newChildren = newVNode2.$children$;
+  const text = newVNode2.$text$;
+  if (text == null) {
+    {
+      updateElement(oldVNode, newVNode2, isSvgMode);
+    }
+    if (oldChildren !== null && newChildren !== null) {
+      updateChildren(elm, oldChildren, newVNode2, newChildren, isInitialRender);
+    } else if (newChildren !== null) {
+      if (oldVNode.$text$ !== null) {
+        elm.textContent = "";
+      }
+      addVnodes(elm, null, newVNode2, newChildren, 0, newChildren.length - 1);
+    } else if (
+      // don't do this on initial render as it can cause non-hydrated content to be removed
+      !isInitialRender && BUILD.updatable && oldChildren !== null
+    ) {
+      removeVnodes(oldChildren, 0, oldChildren.length - 1);
+    } else ;
+  } else if (oldVNode.$text$ !== text) {
+    elm.data = text;
+  }
+};
+var insertBefore = (parent, newNode, reference, isInitialLoad) => {
+  if (parent.__insertBefore) {
+    return parent.__insertBefore(newNode, reference);
+  } else {
+    return parent == null ? void 0 : parent.insertBefore(newNode, reference);
+  }
+};
+var renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
+  const hostElm = hostRef.$hostElement$;
+  const oldVNode = hostRef.$vnode$ || newVNode(null, null);
+  const isHostElement = isHost(renderFnResults);
+  const rootVnode = isHostElement ? renderFnResults : h(null, null, renderFnResults);
+  hostTagName = hostElm.tagName;
+  if (isInitialLoad && rootVnode.$attrs$) {
+    for (const key of Object.keys(rootVnode.$attrs$)) {
+      if (hostElm.hasAttribute(key) && !["key", "ref", "style", "class"].includes(key)) {
+        rootVnode.$attrs$[key] = hostElm[key];
+      }
+    }
+  }
+  rootVnode.$tag$ = null;
+  rootVnode.$flags$ |= 4 /* isHost */;
+  hostRef.$vnode$ = rootVnode;
+  rootVnode.$elm$ = oldVNode.$elm$ = hostElm.shadowRoot || hostElm ;
+  patch(oldVNode, rootVnode, isInitialLoad);
+};
+
+// src/runtime/update-component.ts
+var attachToAncestor = (hostRef, ancestorComponent) => {
+  if (ancestorComponent && !hostRef.$onRenderResolve$ && ancestorComponent["s-p"]) {
+    const index = ancestorComponent["s-p"].push(
+      new Promise(
+        (r) => hostRef.$onRenderResolve$ = () => {
+          ancestorComponent["s-p"].splice(index - 1, 1);
+          r();
+        }
+      )
+    );
+  }
+};
+var scheduleUpdate = (hostRef, isInitialLoad) => {
+  {
+    hostRef.$flags$ |= 16 /* isQueuedForUpdate */;
+  }
+  if (hostRef.$flags$ & 4 /* isWaitingForChildren */) {
+    hostRef.$flags$ |= 512 /* needsRerender */;
+    return;
+  }
+  attachToAncestor(hostRef, hostRef.$ancestorComponent$);
+  const dispatch = () => dispatchHooks(hostRef, isInitialLoad);
+  if (isInitialLoad) {
+    queueMicrotask(() => {
+      dispatch();
+    });
+    return;
+  }
+  return writeTask(dispatch) ;
+};
+var dispatchHooks = (hostRef, isInitialLoad) => {
+  const elm = hostRef.$hostElement$;
+  const endSchedule = createTime("scheduleUpdate", hostRef.$cmpMeta$.$tagName$);
+  const instance = hostRef.$lazyInstance$ ;
+  if (!instance) {
+    throw new Error(
+      `Can't render component <${elm.tagName.toLowerCase()} /> with invalid Stencil runtime! Make sure this imported component is compiled with a \`externalRuntime: true\` flag. For more information, please refer to https://stenciljs.com/docs/custom-elements#externalruntime`
+    );
+  }
+  let maybePromise;
+  if (isInitialLoad) {
+    {
+      if (hostRef.$fetchedCbList$.length) {
+        hostRef.$fetchedCbList$.forEach((cb) => cb(elm));
+      }
+    }
+    maybePromise = safeCall(instance, "componentWillLoad", void 0, elm);
+  } else {
+    maybePromise = safeCall(instance, "componentWillUpdate", void 0, elm);
+  }
+  maybePromise = enqueue(maybePromise, () => safeCall(instance, "componentWillRender", void 0, elm));
+  endSchedule();
+  return enqueue(maybePromise, () => updateComponent(hostRef, instance, isInitialLoad));
+};
+var enqueue = (maybePromise, fn) => isPromisey(maybePromise) ? maybePromise.then(fn).catch((err) => {
+  console.error(err);
+  fn();
+}) : fn();
+var isPromisey = (maybePromise) => maybePromise instanceof Promise || maybePromise && maybePromise.then && typeof maybePromise.then === "function";
+var updateComponent = async (hostRef, instance, isInitialLoad) => {
+  var _a;
+  const elm = hostRef.$hostElement$;
+  const endUpdate = createTime("update", hostRef.$cmpMeta$.$tagName$);
+  const rc = elm["s-rc"];
+  if (isInitialLoad) {
+    attachStyles(hostRef);
+  }
+  const endRender = createTime("render", hostRef.$cmpMeta$.$tagName$);
+  {
+    callRender(hostRef, instance, elm, isInitialLoad);
+  }
+  if (rc) {
+    rc.map((cb) => cb());
+    elm["s-rc"] = void 0;
+  }
+  endRender();
+  endUpdate();
+  {
+    const childrenPromises = (_a = elm["s-p"]) != null ? _a : [];
+    const postUpdate = () => postUpdateComponent(hostRef);
+    if (childrenPromises.length === 0) {
+      postUpdate();
+    } else {
+      Promise.all(childrenPromises).then(postUpdate).catch(postUpdate);
+      hostRef.$flags$ |= 4 /* isWaitingForChildren */;
+      childrenPromises.length = 0;
+    }
+  }
+};
+var callRender = (hostRef, instance, elm, isInitialLoad) => {
+  try {
+    instance = instance.render() ;
+    {
+      hostRef.$flags$ &= -17 /* isQueuedForUpdate */;
+    }
+    {
+      hostRef.$flags$ |= 2 /* hasRendered */;
+    }
+    {
+      {
+        {
+          renderVdom(hostRef, instance, isInitialLoad);
+        }
+      }
+    }
+  } catch (e) {
+    consoleError(e, hostRef.$hostElement$);
+  }
+  return null;
+};
+var postUpdateComponent = (hostRef) => {
+  const tagName = hostRef.$cmpMeta$.$tagName$;
+  const elm = hostRef.$hostElement$;
+  const endPostUpdate = createTime("postUpdate", tagName);
+  const instance = hostRef.$lazyInstance$ ;
+  const ancestorComponent = hostRef.$ancestorComponent$;
+  safeCall(instance, "componentDidRender", void 0, elm);
+  if (!(hostRef.$flags$ & 64 /* hasLoadedComponent */)) {
+    hostRef.$flags$ |= 64 /* hasLoadedComponent */;
+    {
+      addHydratedFlag(elm);
+    }
+    safeCall(instance, "componentDidLoad", void 0, elm);
+    endPostUpdate();
+    {
+      hostRef.$onReadyResolve$(elm);
+      if (!ancestorComponent) {
+        appDidLoad();
+      }
+    }
+  } else {
+    safeCall(instance, "componentDidUpdate", void 0, elm);
+    endPostUpdate();
+  }
+  {
+    if (hostRef.$onRenderResolve$) {
+      hostRef.$onRenderResolve$();
+      hostRef.$onRenderResolve$ = void 0;
+    }
+    if (hostRef.$flags$ & 512 /* needsRerender */) {
+      nextTick(() => scheduleUpdate(hostRef, false));
+    }
+    hostRef.$flags$ &= -517;
+  }
+};
+var appDidLoad = (who) => {
+  nextTick(() => emitEvent(win, "appload", { detail: { namespace: NAMESPACE } }));
+};
+var safeCall = (instance, method, arg, elm) => {
+  if (instance && instance[method]) {
+    try {
+      return instance[method](arg);
+    } catch (e) {
+      consoleError(e, elm);
+    }
+  }
+  return void 0;
+};
+var addHydratedFlag = (elm) => {
+  var _a;
+  return elm.classList.add((_a = BUILD.hydratedSelectorName) != null ? _a : "hydrated") ;
+};
+
+// src/runtime/set-value.ts
+var getValue = (ref, propName) => getHostRef(ref).$instanceValues$.get(propName);
+var setValue = (ref, propName, newVal, cmpMeta) => {
+  const hostRef = getHostRef(ref);
+  if (!hostRef) {
+    return;
+  }
+  if (!hostRef) {
+    throw new Error(
+      `Couldn't find host element for "${cmpMeta.$tagName$}" as it is unknown to this Stencil runtime. This usually happens when integrating a 3rd party Stencil component with another Stencil component or application. Please reach out to the maintainers of the 3rd party Stencil component or report this on the Stencil Discord server (https://chat.stenciljs.com) or comment on this similar [GitHub issue](https://github.com/stenciljs/core/issues/5457).`
+    );
+  }
+  const oldVal = hostRef.$instanceValues$.get(propName);
+  const flags = hostRef.$flags$;
+  const instance = hostRef.$lazyInstance$ ;
+  newVal = parsePropertyValue(
+    newVal,
+    cmpMeta.$members$[propName][0]);
+  const areBothNaN = Number.isNaN(oldVal) && Number.isNaN(newVal);
+  const didValueChange = newVal !== oldVal && !areBothNaN;
+  if ((!(flags & 8 /* isConstructingInstance */) || oldVal === void 0) && didValueChange) {
+    hostRef.$instanceValues$.set(propName, newVal);
+    if (flags & 2 /* hasRendered */) {
+      if (instance.componentShouldUpdate) {
+        const shouldUpdate = instance.componentShouldUpdate(newVal, oldVal, propName);
+        if (shouldUpdate === false && !(flags & 16 /* isQueuedForUpdate */)) {
+          return;
+        }
+      }
+      if (!(flags & 16 /* isQueuedForUpdate */)) {
+        scheduleUpdate(hostRef, false);
+      }
+    }
+  }
+};
+
+// src/runtime/proxy-component.ts
+var proxyComponent = (Cstr, cmpMeta, flags) => {
+  var _a, _b;
+  const prototype = Cstr.prototype;
+  if (cmpMeta.$members$ || BUILD.propChangeCallback) {
+    const members = Object.entries((_a = cmpMeta.$members$) != null ? _a : {});
+    members.map(([memberName, [memberFlags]]) => {
+      if ((memberFlags & 31 /* Prop */ || (flags & 2 /* proxyState */) && memberFlags & 32 /* State */)) {
+        const { get: origGetter, set: origSetter } = getPropertyDescriptor(prototype, memberName) || {};
+        if (origGetter) cmpMeta.$members$[memberName][0] |= 2048 /* Getter */;
+        if (origSetter) cmpMeta.$members$[memberName][0] |= 4096 /* Setter */;
+        if (flags & 1 /* isElementConstructor */ || !origGetter) {
+          Object.defineProperty(prototype, memberName, {
+            get() {
+              {
+                if ((cmpMeta.$members$[memberName][0] & 2048 /* Getter */) === 0) {
+                  return getValue(this, memberName);
+                }
+                const ref = getHostRef(this);
+                const instance = ref ? ref.$lazyInstance$ : prototype;
+                if (!instance) return;
+                return instance[memberName];
+              }
+            },
+            configurable: true,
+            enumerable: true
+          });
+        }
+        Object.defineProperty(prototype, memberName, {
+          set(newValue) {
+            const ref = getHostRef(this);
+            if (!ref) {
+              return;
+            }
+            if (origSetter) {
+              const currentValue = memberFlags & 32 /* State */ ? this[memberName] : ref.$hostElement$[memberName];
+              if (typeof currentValue === "undefined" && ref.$instanceValues$.get(memberName)) {
+                newValue = ref.$instanceValues$.get(memberName);
+              }
+              origSetter.apply(this, [
+                parsePropertyValue(
+                  newValue,
+                  memberFlags)
+              ]);
+              newValue = memberFlags & 32 /* State */ ? this[memberName] : ref.$hostElement$[memberName];
+              setValue(this, memberName, newValue, cmpMeta);
+              return;
+            }
+            {
+              if ((flags & 1 /* isElementConstructor */) === 0 || (cmpMeta.$members$[memberName][0] & 4096 /* Setter */) === 0) {
+                setValue(this, memberName, newValue, cmpMeta);
+                if (flags & 1 /* isElementConstructor */ && !ref.$lazyInstance$) {
+                  ref.$fetchedCbList$.push(() => {
+                    if (cmpMeta.$members$[memberName][0] & 4096 /* Setter */ && ref.$lazyInstance$[memberName] !== ref.$instanceValues$.get(memberName)) {
+                      ref.$lazyInstance$[memberName] = newValue;
+                    }
+                  });
+                }
+                return;
+              }
+              const setterSetVal = () => {
+                const currentValue = ref.$lazyInstance$[memberName];
+                if (!ref.$instanceValues$.get(memberName) && currentValue) {
+                  ref.$instanceValues$.set(memberName, currentValue);
+                }
+                ref.$lazyInstance$[memberName] = parsePropertyValue(
+                  newValue,
+                  memberFlags);
+                setValue(this, memberName, ref.$lazyInstance$[memberName], cmpMeta);
+              };
+              if (ref.$lazyInstance$) {
+                setterSetVal();
+              } else {
+                ref.$fetchedCbList$.push(() => {
+                  setterSetVal();
+                });
+              }
+            }
+          }
+        });
+      }
+    });
+    if ((flags & 1 /* isElementConstructor */)) {
+      const attrNameToPropName = /* @__PURE__ */ new Map();
+      prototype.attributeChangedCallback = function(attrName, oldValue, newValue) {
+        plt.jmp(() => {
+          var _a2;
+          const propName = attrNameToPropName.get(attrName);
+          const hostRef = getHostRef(this);
+          if (this.hasOwnProperty(propName) && BUILD.lazyLoad) {
+            newValue = this[propName];
+            delete this[propName];
+          }
+          if (prototype.hasOwnProperty(propName) && typeof this[propName] === "number" && // cast type to number to avoid TS compiler issues
+          this[propName] == newValue) {
+            return;
+          } else if (propName == null) {
+            const flags2 = hostRef == null ? void 0 : hostRef.$flags$;
+            if (hostRef && flags2 && !(flags2 & 8 /* isConstructingInstance */) && newValue !== oldValue) {
+              const instance = hostRef.$lazyInstance$ ;
+              const entry = (_a2 = cmpMeta.$watchers$) == null ? void 0 : _a2[attrName];
+              entry == null ? void 0 : entry.forEach((watcher) => {
+                const [[watchMethodName, watcherFlags]] = Object.entries(watcher);
+                if (instance[watchMethodName] != null && (flags2 & 128 /* isWatchReady */ || watcherFlags & 1 /* Immediate */)) {
+                  instance[watchMethodName].call(instance, newValue, oldValue, attrName);
+                }
+              });
+            }
+            return;
+          }
+          const propFlags = members.find(([m]) => m === propName);
+          if (propFlags && propFlags[1][0] & 4 /* Boolean */) {
+            newValue = newValue === null || newValue === "false" ? false : true;
+          }
+          const propDesc = Object.getOwnPropertyDescriptor(prototype, propName);
+          if (newValue != this[propName] && (!propDesc.get || !!propDesc.set)) {
+            this[propName] = newValue;
+          }
+        });
+      };
+      Cstr.observedAttributes = Array.from(
+        /* @__PURE__ */ new Set([
+          ...Object.keys((_b = cmpMeta.$watchers$) != null ? _b : {}),
+          ...members.filter(([_, m]) => m[0] & 31 /* HasAttribute */).map(([propName, m]) => {
+            const attrName = m[1] || propName;
+            attrNameToPropName.set(attrName, propName);
+            return attrName;
+          })
+        ])
+      );
+    }
+  }
+  return Cstr;
+};
+
+// src/runtime/initialize-component.ts
+var initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
+  let Cstr;
+  try {
+    if ((hostRef.$flags$ & 32 /* hasInitializedComponent */) === 0) {
+      hostRef.$flags$ |= 32 /* hasInitializedComponent */;
+      const bundleId = cmpMeta.$lazyBundleId$;
+      if (bundleId) {
+        const CstrImport = loadModule(cmpMeta, hostRef);
+        if (CstrImport && "then" in CstrImport) {
+          const endLoad = uniqueTime();
+          Cstr = await CstrImport;
+          endLoad();
+        } else {
+          Cstr = CstrImport;
+        }
+        if (!Cstr) {
+          throw new Error(`Constructor for "${cmpMeta.$tagName$}#${hostRef.$modeName$}" was not found`);
+        }
+        if (!Cstr.isProxied) {
+          proxyComponent(Cstr, cmpMeta, 2 /* proxyState */);
+          Cstr.isProxied = true;
+        }
+        const endNewInstance = createTime("createInstance", cmpMeta.$tagName$);
+        {
+          hostRef.$flags$ |= 8 /* isConstructingInstance */;
+        }
+        try {
+          new Cstr(hostRef);
+        } catch (e) {
+          consoleError(e, elm);
+        }
+        {
+          hostRef.$flags$ &= -9 /* isConstructingInstance */;
+        }
+        endNewInstance();
+        {
+          fireConnectedCallback(hostRef.$lazyInstance$, elm);
+        }
+      } else {
+        Cstr = elm.constructor;
+        const cmpTag = elm.localName;
+        customElements.whenDefined(cmpTag).then(() => hostRef.$flags$ |= 128 /* isWatchReady */);
+      }
+      if (Cstr && Cstr.style) {
+        let style;
+        if (typeof Cstr.style === "string") {
+          style = Cstr.style;
+        }
+        const scopeId2 = getScopeId(cmpMeta);
+        if (!styles.has(scopeId2) || BUILD.hotModuleReplacement) {
+          const endRegisterStyles = createTime("registerStyles", cmpMeta.$tagName$);
+          registerStyle(scopeId2, style, !!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */));
+          endRegisterStyles();
+        }
+      }
+    }
+    const ancestorComponent = hostRef.$ancestorComponent$;
+    const schedule = () => scheduleUpdate(hostRef, true);
+    if (ancestorComponent && ancestorComponent["s-rc"]) {
+      ancestorComponent["s-rc"].push(schedule);
+    } else {
+      schedule();
+    }
+  } catch (e) {
+    consoleError(e, elm);
+    if (hostRef.$onRenderResolve$) {
+      hostRef.$onRenderResolve$();
+      hostRef.$onRenderResolve$ = void 0;
+    }
+    if (hostRef.$onReadyResolve$) {
+      hostRef.$onReadyResolve$(elm);
+    }
+  }
+};
+var fireConnectedCallback = (instance, elm) => {
+  {
+    safeCall(instance, "connectedCallback", void 0, elm);
+  }
+};
+
+// src/runtime/connected-callback.ts
+var connectedCallback = (elm) => {
+  if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) {
+    const hostRef = getHostRef(elm);
+    if (!hostRef) {
+      return;
+    }
+    const cmpMeta = hostRef.$cmpMeta$;
+    const endConnected = createTime("connectedCallback", cmpMeta.$tagName$);
+    if (!(hostRef.$flags$ & 1 /* hasConnected */)) {
+      hostRef.$flags$ |= 1 /* hasConnected */;
+      {
+        let ancestorComponent = elm;
+        while (ancestorComponent = ancestorComponent.parentNode || ancestorComponent.host) {
+          if (ancestorComponent["s-p"]) {
+            attachToAncestor(hostRef, hostRef.$ancestorComponent$ = ancestorComponent);
+            break;
+          }
+        }
+      }
+      if (cmpMeta.$members$) {
+        Object.entries(cmpMeta.$members$).map(([memberName, [memberFlags]]) => {
+          if (memberFlags & 31 /* Prop */ && Object.prototype.hasOwnProperty.call(elm, memberName)) {
+            const value = elm[memberName];
+            delete elm[memberName];
+            elm[memberName] = value;
+          }
+        });
+      }
+      {
+        initializeComponent(elm, hostRef, cmpMeta);
+      }
+    } else {
+      if (hostRef == null ? void 0 : hostRef.$lazyInstance$) {
+        fireConnectedCallback(hostRef.$lazyInstance$, elm);
+      } else if (hostRef == null ? void 0 : hostRef.$onReadyPromise$) {
+        hostRef.$onReadyPromise$.then(() => fireConnectedCallback(hostRef.$lazyInstance$, elm));
+      }
+    }
+    endConnected();
+  }
+};
+var disconnectInstance = (instance, elm) => {
+  {
+    safeCall(instance, "disconnectedCallback", void 0, elm || instance);
+  }
+};
+var disconnectedCallback = async (elm) => {
+  if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) {
+    const hostRef = getHostRef(elm);
+    if (hostRef == null ? void 0 : hostRef.$lazyInstance$) {
+      disconnectInstance(hostRef.$lazyInstance$, elm);
+    } else if (hostRef == null ? void 0 : hostRef.$onReadyPromise$) {
+      hostRef.$onReadyPromise$.then(() => disconnectInstance(hostRef.$lazyInstance$, elm));
+    }
+  }
+  if (rootAppliedStyles.has(elm)) {
+    rootAppliedStyles.delete(elm);
+  }
+  if (elm.shadowRoot && rootAppliedStyles.has(elm.shadowRoot)) {
+    rootAppliedStyles.delete(elm.shadowRoot);
+  }
+};
+
+// src/runtime/bootstrap-lazy.ts
+var bootstrapLazy = (lazyBundles, options = {}) => {
+  var _a;
+  if (!win.document) {
+    console.warn("Stencil: No document found. Skipping bootstrapping lazy components.");
+    return;
+  }
+  const endBootstrap = createTime();
+  const cmpTags = [];
+  const exclude = options.exclude || [];
+  const customElements2 = win.customElements;
+  const head = win.document.head;
+  const metaCharset = /* @__PURE__ */ head.querySelector("meta[charset]");
+  const dataStyles = /* @__PURE__ */ win.document.createElement("style");
+  const deferredConnectedCallbacks = [];
+  let appLoadFallback;
+  let isBootstrapping = true;
+  Object.assign(plt, options);
+  plt.$resourcesUrl$ = new URL(options.resourcesUrl || "./", win.document.baseURI).href;
+  lazyBundles.map((lazyBundle) => {
+    lazyBundle[1].map((compactMeta) => {
+      const cmpMeta = {
+        $flags$: compactMeta[0],
+        $tagName$: compactMeta[1],
+        $members$: compactMeta[2],
+        $listeners$: compactMeta[3]
+      };
+      {
+        cmpMeta.$members$ = compactMeta[2];
+      }
+      const tagName = transformTag(cmpMeta.$tagName$);
+      const HostElement = class extends HTMLElement {
+        ["s-p"];
+        ["s-rc"];
+        hasRegisteredEventListeners = false;
+        // StencilLazyHost
+        constructor(self) {
+          super(self);
+          self = this;
+          registerHost(self, cmpMeta);
+          if (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
+            {
+              if (!self.shadowRoot) {
+                createShadowRoot.call(self, cmpMeta);
+              } else {
+                if (self.shadowRoot.mode !== "open") {
+                  throw new Error(
+                    `Unable to re-use existing shadow root for ${cmpMeta.$tagName$}! Mode is set to ${self.shadowRoot.mode} but Stencil only supports open shadow roots.`
+                  );
+                }
+              }
+            }
+          }
+        }
+        connectedCallback() {
+          const hostRef = getHostRef(this);
+          if (!hostRef) {
+            return;
+          }
+          if (!this.hasRegisteredEventListeners) {
+            this.hasRegisteredEventListeners = true;
+          }
+          if (appLoadFallback) {
+            clearTimeout(appLoadFallback);
+            appLoadFallback = null;
+          }
+          if (isBootstrapping) {
+            deferredConnectedCallbacks.push(this);
+          } else {
+            plt.jmp(() => connectedCallback(this));
+          }
+        }
+        disconnectedCallback() {
+          plt.jmp(() => disconnectedCallback(this));
+          plt.raf(() => {
+            var _a3;
+            const hostRef = getHostRef(this);
+            if (!hostRef) {
+              return;
+            }
+            const i2 = deferredConnectedCallbacks.findIndex((host) => host === this);
+            if (i2 > -1) {
+              deferredConnectedCallbacks.splice(i2, 1);
+            }
+            if (((_a3 = hostRef == null ? void 0 : hostRef.$vnode$) == null ? void 0 : _a3.$elm$) instanceof Node && !hostRef.$vnode$.$elm$.isConnected) {
+              delete hostRef.$vnode$.$elm$;
+            }
+          });
+        }
+        componentOnReady() {
+          var _a3;
+          return (_a3 = getHostRef(this)) == null ? void 0 : _a3.$onReadyPromise$;
+        }
+      };
+      cmpMeta.$lazyBundleId$ = lazyBundle[0];
+      if (!exclude.includes(tagName) && !customElements2.get(tagName)) {
+        cmpTags.push(tagName);
+        customElements2.define(
+          tagName,
+          proxyComponent(HostElement, cmpMeta, 1 /* isElementConstructor */)
+        );
+      }
+    });
+  });
+  if (cmpTags.length > 0) {
+    {
+      dataStyles.textContent += cmpTags.sort() + HYDRATED_CSS;
+    }
+    if (dataStyles.innerHTML.length) {
+      dataStyles.setAttribute("data-styles", "");
+      const nonce = (_a = plt.$nonce$) != null ? _a : queryNonceMetaTagContent(win.document);
+      if (nonce != null) {
+        dataStyles.setAttribute("nonce", nonce);
+      }
+      head.insertBefore(dataStyles, metaCharset ? metaCharset.nextSibling : head.firstChild);
+    }
+  }
+  isBootstrapping = false;
+  if (deferredConnectedCallbacks.length) {
+    deferredConnectedCallbacks.map((host) => host.connectedCallback());
+  } else {
+    {
+      plt.jmp(() => appLoadFallback = setTimeout(appDidLoad, 30));
+    }
+  }
+  endBootstrap();
+};
+
+// src/runtime/nonce.ts
+var setNonce = (nonce) => plt.$nonce$ = nonce;
+function transformTag(tag) {
+  return tag;
+}
+
+export { bootstrapLazy as b, globalScripts as g, h, promiseResolve as p, registerInstance as r, setNonce as s };