npm - @baloise/ds-react - Versions diffs - 19.2.0 → 19.3.0-nightly.20250630 - Mend

@baloise/ds-react 19.2.0 → 19.3.0-nightly.20250630

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/index.esm.js +357 -567
package/package.json +5 -3
package/src/generated/components.d.ts +5 -2
package/index.cjs.d.ts +0 -1
package/index.cjs.js +0 -1578

package/index.esm.js CHANGED Viewed

@@ -1,121 +1,122 @@
 import { initialize } from '@baloise/ds-core';
-import { defineCustomElement, BalAccordionDetails as BalAccordionDetails$1 } from '@baloise/ds-core/components/bal-accordion-details.js';
-import { defineCustomElement as defineCustomElement$1, BalAccordionSummary as BalAccordionSummary$1 } from '@baloise/ds-core/components/bal-accordion-summary.js';
-import { defineCustomElement as defineCustomElement$2, BalAccordionTrigger as BalAccordionTrigger$1 } from '@baloise/ds-core/components/bal-accordion-trigger.js';
-import { defineCustomElement as defineCustomElement$1Q, BalAccordion as BalAccordion$1 } from '@baloise/ds-core/components/bal-accordion.js';
-import { defineCustomElement as defineCustomElement$3, BalApp as BalApp$1 } from '@baloise/ds-core/components/bal-app.js';
-import { defineCustomElement as defineCustomElement$4, BalBadge as BalBadge$1 } from '@baloise/ds-core/components/bal-badge.js';
-import { defineCustomElement as defineCustomElement$6, BalButtonGroup as BalButtonGroup$1 } from '@baloise/ds-core/components/bal-button-group.js';
-import { defineCustomElement as defineCustomElement$5, BalButton as BalButton$1 } from '@baloise/ds-core/components/bal-button.js';
-import { defineCustomElement as defineCustomElement$8, BalCardActions as BalCardActions$1 } from '@baloise/ds-core/components/bal-card-actions.js';
-import { defineCustomElement as defineCustomElement$9, BalCardButton as BalCardButton$1 } from '@baloise/ds-core/components/bal-card-button.js';
-import { defineCustomElement as defineCustomElement$a, BalCardContent as BalCardContent$1 } from '@baloise/ds-core/components/bal-card-content.js';
-import { defineCustomElement as defineCustomElement$b, BalCardSubtitle as BalCardSubtitle$1 } from '@baloise/ds-core/components/bal-card-subtitle.js';
-import { defineCustomElement as defineCustomElement$c, BalCardTitle as BalCardTitle$1 } from '@baloise/ds-core/components/bal-card-title.js';
-import { defineCustomElement as defineCustomElement$7, BalCard as BalCard$1 } from '@baloise/ds-core/components/bal-card.js';
-import { defineCustomElement as defineCustomElement$e, BalCarouselItem as BalCarouselItem$1 } from '@baloise/ds-core/components/bal-carousel-item.js';
-import { defineCustomElement as defineCustomElement$d, BalCarousel as BalCarousel$1 } from '@baloise/ds-core/components/bal-carousel.js';
-import { defineCustomElement as defineCustomElement$f, BalCheck as BalCheck$1 } from '@baloise/ds-core/components/bal-check.js';
-import { defineCustomElement as defineCustomElement$h, BalCheckboxGroup as BalCheckboxGroup$1 } from '@baloise/ds-core/components/bal-checkbox-group.js';
-import { defineCustomElement as defineCustomElement$g, BalCheckbox as BalCheckbox$1 } from '@baloise/ds-core/components/bal-checkbox.js';
-import { defineCustomElement as defineCustomElement$i, BalClose as BalClose$1 } from '@baloise/ds-core/components/bal-close.js';
-import { defineCustomElement as defineCustomElement$j, BalContent as BalContent$1 } from '@baloise/ds-core/components/bal-content.js';
-import { defineCustomElement as defineCustomElement$l, BalDataItem as BalDataItem$1 } from '@baloise/ds-core/components/bal-data-item.js';
-import { defineCustomElement as defineCustomElement$m, BalDataLabel as BalDataLabel$1 } from '@baloise/ds-core/components/bal-data-label.js';
-import { defineCustomElement as defineCustomElement$n, BalDataValue as BalDataValue$1 } from '@baloise/ds-core/components/bal-data-value.js';
-import { defineCustomElement as defineCustomElement$k, BalData as BalData$1 } from '@baloise/ds-core/components/bal-data.js';
-import { defineCustomElement as defineCustomElement$q, BalDateCalendarCell as BalDateCalendarCell$1 } from '@baloise/ds-core/components/bal-date-calendar-cell.js';
-import { defineCustomElement as defineCustomElement$p, BalDateCalendar as BalDateCalendar$1 } from '@baloise/ds-core/components/bal-date-calendar.js';
-import { defineCustomElement as defineCustomElement$o, BalDate as BalDate$1 } from '@baloise/ds-core/components/bal-date.js';
-import { defineCustomElement as defineCustomElement$r, BalDivider as BalDivider$1 } from '@baloise/ds-core/components/bal-divider.js';
-import { defineCustomElement as defineCustomElement$s, BalDropdown as BalDropdown$1 } from '@baloise/ds-core/components/bal-dropdown.js';
-import { defineCustomElement as defineCustomElement$u, BalFieldControl as BalFieldControl$1 } from '@baloise/ds-core/components/bal-field-control.js';
-import { defineCustomElement as defineCustomElement$v, BalFieldHint as BalFieldHint$1 } from '@baloise/ds-core/components/bal-field-hint.js';
-import { defineCustomElement as defineCustomElement$w, BalFieldLabel as BalFieldLabel$1 } from '@baloise/ds-core/components/bal-field-label.js';
-import { defineCustomElement as defineCustomElement$x, BalFieldMessage as BalFieldMessage$1 } from '@baloise/ds-core/components/bal-field-message.js';
-import { defineCustomElement as defineCustomElement$t, BalField as BalField$1 } from '@baloise/ds-core/components/bal-field.js';
-import { defineCustomElement as defineCustomElement$y, BalFileUpload as BalFileUpload$1 } from '@baloise/ds-core/components/bal-file-upload.js';
-import { defineCustomElement as defineCustomElement$z, BalFooter as BalFooter$1 } from '@baloise/ds-core/components/bal-footer.js';
-import { defineCustomElement as defineCustomElement$B, BalFormCol as BalFormCol$1 } from '@baloise/ds-core/components/bal-form-col.js';
-import { defineCustomElement as defineCustomElement$C, BalFormGrid as BalFormGrid$1 } from '@baloise/ds-core/components/bal-form-grid.js';
-import { defineCustomElement as defineCustomElement$A, BalForm as BalForm$1 } from '@baloise/ds-core/components/bal-form.js';
-import { defineCustomElement as defineCustomElement$D, BalHeading as BalHeading$1 } from '@baloise/ds-core/components/bal-heading.js';
-import { defineCustomElement as defineCustomElement$F, BalHintText as BalHintText$1 } from '@baloise/ds-core/components/bal-hint-text.js';
-import { defineCustomElement as defineCustomElement$G, BalHintTitle as BalHintTitle$1 } from '@baloise/ds-core/components/bal-hint-title.js';
-import { defineCustomElement as defineCustomElement$E, BalHint as BalHint$1 } from '@baloise/ds-core/components/bal-hint.js';
-import { defineCustomElement as defineCustomElement$H, BalIcon as BalIcon$1 } from '@baloise/ds-core/components/bal-icon.js';
-import { defineCustomElement as defineCustomElement$J, BalInputDate as BalInputDate$1 } from '@baloise/ds-core/components/bal-input-date.js';
-import { defineCustomElement as defineCustomElement$K, BalInputGroup as BalInputGroup$1 } from '@baloise/ds-core/components/bal-input-group.js';
-import { defineCustomElement as defineCustomElement$L, BalInputSlider as BalInputSlider$1 } from '@baloise/ds-core/components/bal-input-slider.js';
-import { defineCustomElement as defineCustomElement$M, BalInputStepper as BalInputStepper$1 } from '@baloise/ds-core/components/bal-input-stepper.js';
-import { defineCustomElement as defineCustomElement$I, BalInput as BalInput$1 } from '@baloise/ds-core/components/bal-input.js';
-import { defineCustomElement as defineCustomElement$N, BalLabel as BalLabel$1 } from '@baloise/ds-core/components/bal-label.js';
-import { defineCustomElement as defineCustomElement$Q, BalListItemAccordionBody as BalListItemAccordionBody$1 } from '@baloise/ds-core/components/bal-list-item-accordion-body.js';
-import { defineCustomElement as defineCustomElement$R, BalListItemAccordionHead as BalListItemAccordionHead$1 } from '@baloise/ds-core/components/bal-list-item-accordion-head.js';
-import { defineCustomElement as defineCustomElement$S, BalListItemContent as BalListItemContent$1 } from '@baloise/ds-core/components/bal-list-item-content.js';
-import { defineCustomElement as defineCustomElement$T, BalListItemIcon as BalListItemIcon$1 } from '@baloise/ds-core/components/bal-list-item-icon.js';
-import { defineCustomElement as defineCustomElement$U, BalListItemSubtitle as BalListItemSubtitle$1 } from '@baloise/ds-core/components/bal-list-item-subtitle.js';
-import { defineCustomElement as defineCustomElement$V, BalListItemTitle as BalListItemTitle$1 } from '@baloise/ds-core/components/bal-list-item-title.js';
-import { defineCustomElement as defineCustomElement$P, BalListItem as BalListItem$1 } from '@baloise/ds-core/components/bal-list-item.js';
-import { defineCustomElement as defineCustomElement$O, BalList as BalList$1 } from '@baloise/ds-core/components/bal-list.js';
-import { defineCustomElement as defineCustomElement$W, BalLogo as BalLogo$1 } from '@baloise/ds-core/components/bal-logo.js';
-import { defineCustomElement as defineCustomElement$Y, BalModalBody as BalModalBody$1 } from '@baloise/ds-core/components/bal-modal-body.js';
-import { defineCustomElement as defineCustomElement$Z, BalModalHeader as BalModalHeader$1 } from '@baloise/ds-core/components/bal-modal-header.js';
-import { defineCustomElement as defineCustomElement$X, BalModal as BalModal$1 } from '@baloise/ds-core/components/bal-modal.js';
-import { defineCustomElement as defineCustomElement$11, BalNavLinkGridCol as BalNavLinkGridCol$1 } from '@baloise/ds-core/components/bal-nav-link-grid-col.js';
-import { defineCustomElement as defineCustomElement$10, BalNavLinkGrid as BalNavLinkGrid$1 } from '@baloise/ds-core/components/bal-nav-link-grid.js';
-import { defineCustomElement as defineCustomElement$12, BalNavLinkGroup as BalNavLinkGroup$1 } from '@baloise/ds-core/components/bal-nav-link-group.js';
-import { defineCustomElement as defineCustomElement$$, BalNavLink as BalNavLink$1 } from '@baloise/ds-core/components/bal-nav-link.js';
-import { defineCustomElement as defineCustomElement$13, BalNavMenuBar as BalNavMenuBar$1 } from '@baloise/ds-core/components/bal-nav-menu-bar.js';
-import { defineCustomElement as defineCustomElement$14, BalNavMenuFlyout as BalNavMenuFlyout$1 } from '@baloise/ds-core/components/bal-nav-menu-flyout.js';
-import { defineCustomElement as defineCustomElement$15, BalNavMetaBar as BalNavMetaBar$1 } from '@baloise/ds-core/components/bal-nav-meta-bar.js';
-import { defineCustomElement as defineCustomElement$_, BalNav as BalNav$1 } from '@baloise/ds-core/components/bal-nav.js';
-import { defineCustomElement as defineCustomElement$17, BalNavbarBrand as BalNavbarBrand$1 } from '@baloise/ds-core/components/bal-navbar-brand.js';
-import { defineCustomElement as defineCustomElement$19, BalNavbarMenuEnd as BalNavbarMenuEnd$1 } from '@baloise/ds-core/components/bal-navbar-menu-end.js';
-import { defineCustomElement as defineCustomElement$1a, BalNavbarMenuStart as BalNavbarMenuStart$1 } from '@baloise/ds-core/components/bal-navbar-menu-start.js';
-import { defineCustomElement as defineCustomElement$18, BalNavbarMenu as BalNavbarMenu$1 } from '@baloise/ds-core/components/bal-navbar-menu.js';
-import { defineCustomElement as defineCustomElement$16, BalNavbar as BalNavbar$1 } from '@baloise/ds-core/components/bal-navbar.js';
-import { defineCustomElement as defineCustomElement$1b, BalNotices as BalNotices$1 } from '@baloise/ds-core/components/bal-notices.js';
-import { defineCustomElement as defineCustomElement$1c, BalNotification as BalNotification$1 } from '@baloise/ds-core/components/bal-notification.js';
-import { defineCustomElement as defineCustomElement$1d, BalNumberInput as BalNumberInput$1 } from '@baloise/ds-core/components/bal-number-input.js';
-import { defineCustomElement as defineCustomElement$1f, BalOptionList as BalOptionList$1 } from '@baloise/ds-core/components/bal-option-list.js';
-import { defineCustomElement as defineCustomElement$1e, BalOption as BalOption$1 } from '@baloise/ds-core/components/bal-option.js';
-import { defineCustomElement as defineCustomElement$1g, BalPagination as BalPagination$1 } from '@baloise/ds-core/components/bal-pagination.js';
-import { defineCustomElement as defineCustomElement$1i, BalPopoverContent as BalPopoverContent$1 } from '@baloise/ds-core/components/bal-popover-content.js';
-import { defineCustomElement as defineCustomElement$1h, BalPopover as BalPopover$1 } from '@baloise/ds-core/components/bal-popover.js';
-import { defineCustomElement as defineCustomElement$1j, BalPopup as BalPopup$1 } from '@baloise/ds-core/components/bal-popup.js';
-import { defineCustomElement as defineCustomElement$1k, BalProgressBar as BalProgressBar$1 } from '@baloise/ds-core/components/bal-progress-bar.js';
-import { defineCustomElement as defineCustomElement$1m, BalRadioGroup as BalRadioGroup$1 } from '@baloise/ds-core/components/bal-radio-group.js';
-import { defineCustomElement as defineCustomElement$1n, BalRadioIcon as BalRadioIcon$1 } from '@baloise/ds-core/components/bal-radio-icon.js';
-import { defineCustomElement as defineCustomElement$1l, BalRadio as BalRadio$1 } from '@baloise/ds-core/components/bal-radio.js';
-import { defineCustomElement as defineCustomElement$1p, BalSegmentItem as BalSegmentItem$1 } from '@baloise/ds-core/components/bal-segment-item.js';
-import { defineCustomElement as defineCustomElement$1o, BalSegment as BalSegment$1 } from '@baloise/ds-core/components/bal-segment.js';
-import { defineCustomElement as defineCustomElement$1r, BalSelectOption as BalSelectOption$1 } from '@baloise/ds-core/components/bal-select-option.js';
-import { defineCustomElement as defineCustomElement$1q, BalSelect as BalSelect$1 } from '@baloise/ds-core/components/bal-select.js';
-import { defineCustomElement as defineCustomElement$1s, BalShape as BalShape$1 } from '@baloise/ds-core/components/bal-shape.js';
-import { defineCustomElement as defineCustomElement$1t, BalSheet as BalSheet$1 } from '@baloise/ds-core/components/bal-sheet.js';
-import { defineCustomElement as defineCustomElement$1u, BalSnackbar as BalSnackbar$1 } from '@baloise/ds-core/components/bal-snackbar.js';
-import { defineCustomElement as defineCustomElement$1v, BalSpinner as BalSpinner$1 } from '@baloise/ds-core/components/bal-spinner.js';
-import { defineCustomElement as defineCustomElement$1w, BalStack as BalStack$1 } from '@baloise/ds-core/components/bal-stack.js';
-import { defineCustomElement as defineCustomElement$1y, BalStageBackLink as BalStageBackLink$1 } from '@baloise/ds-core/components/bal-stage-back-link.js';
-import { defineCustomElement as defineCustomElement$1z, BalStageBody as BalStageBody$1 } from '@baloise/ds-core/components/bal-stage-body.js';
-import { defineCustomElement as defineCustomElement$1A, BalStageFoot as BalStageFoot$1 } from '@baloise/ds-core/components/bal-stage-foot.js';
-import { defineCustomElement as defineCustomElement$1B, BalStageHead as BalStageHead$1 } from '@baloise/ds-core/components/bal-stage-head.js';
-import { defineCustomElement as defineCustomElement$1C, BalStageImage as BalStageImage$1 } from '@baloise/ds-core/components/bal-stage-image.js';
-import { defineCustomElement as defineCustomElement$1x, BalStage as BalStage$1 } from '@baloise/ds-core/components/bal-stage.js';
-import { defineCustomElement as defineCustomElement$1D, BalStepItem as BalStepItem$1 } from '@baloise/ds-core/components/bal-step-item.js';
-import { defineCustomElement as defineCustomElement$1E, BalSteps as BalSteps$1 } from '@baloise/ds-core/components/bal-steps.js';
-import { defineCustomElement as defineCustomElement$1F, BalSwitch as BalSwitch$1 } from '@baloise/ds-core/components/bal-switch.js';
-import { defineCustomElement as defineCustomElement$1G, BalTabItem as BalTabItem$1 } from '@baloise/ds-core/components/bal-tab-item.js';
-import { defineCustomElement as defineCustomElement$1H, BalTable as BalTable$1 } from '@baloise/ds-core/components/bal-table.js';
-import { defineCustomElement as defineCustomElement$1I, BalTabs as BalTabs$1 } from '@baloise/ds-core/components/bal-tabs.js';
-import { defineCustomElement as defineCustomElement$1K, BalTagGroup as BalTagGroup$1 } from '@baloise/ds-core/components/bal-tag-group.js';
-import { defineCustomElement as defineCustomElement$1J, BalTag as BalTag$1 } from '@baloise/ds-core/components/bal-tag.js';
-import { defineCustomElement as defineCustomElement$1L, BalText as BalText$1 } from '@baloise/ds-core/components/bal-text.js';
-import { defineCustomElement as defineCustomElement$1M, BalTextarea as BalTextarea$1 } from '@baloise/ds-core/components/bal-textarea.js';
-import { defineCustomElement as defineCustomElement$1N, BalTimeInput as BalTimeInput$1 } from '@baloise/ds-core/components/bal-time-input.js';
-import { defineCustomElement as defineCustomElement$1O, BalToast as BalToast$1 } from '@baloise/ds-core/components/bal-toast.js';
-import { defineCustomElement as defineCustomElement$1P, BalTooltip as BalTooltip$1 } from '@baloise/ds-core/components/bal-tooltip.js';
+import { defineCustomElement as defineCustomElement$1, BalAccordionDetails as BalAccordionDetails$1 } from '@baloise/ds-core/components/bal-accordion-details.js';
+import { defineCustomElement as defineCustomElement$2, BalAccordionSummary as BalAccordionSummary$1 } from '@baloise/ds-core/components/bal-accordion-summary.js';
+import { defineCustomElement as defineCustomElement$3, BalAccordionTrigger as BalAccordionTrigger$1 } from '@baloise/ds-core/components/bal-accordion-trigger.js';
+import { defineCustomElement, BalAccordion as BalAccordion$1 } from '@baloise/ds-core/components/bal-accordion.js';
+import { defineCustomElement as defineCustomElement$4, BalApp as BalApp$1 } from '@baloise/ds-core/components/bal-app.js';
+import { defineCustomElement as defineCustomElement$5, BalBadge as BalBadge$1 } from '@baloise/ds-core/components/bal-badge.js';
+import { defineCustomElement as defineCustomElement$7, BalButtonGroup as BalButtonGroup$1 } from '@baloise/ds-core/components/bal-button-group.js';
+import { defineCustomElement as defineCustomElement$6, BalButton as BalButton$1 } from '@baloise/ds-core/components/bal-button.js';
+import { defineCustomElement as defineCustomElement$9, BalCardActions as BalCardActions$1 } from '@baloise/ds-core/components/bal-card-actions.js';
+import { defineCustomElement as defineCustomElement$a, BalCardButton as BalCardButton$1 } from '@baloise/ds-core/components/bal-card-button.js';
+import { defineCustomElement as defineCustomElement$b, BalCardContent as BalCardContent$1 } from '@baloise/ds-core/components/bal-card-content.js';
+import { defineCustomElement as defineCustomElement$c, BalCardSubtitle as BalCardSubtitle$1 } from '@baloise/ds-core/components/bal-card-subtitle.js';
+import { defineCustomElement as defineCustomElement$d, BalCardTitle as BalCardTitle$1 } from '@baloise/ds-core/components/bal-card-title.js';
+import { defineCustomElement as defineCustomElement$8, BalCard as BalCard$1 } from '@baloise/ds-core/components/bal-card.js';
+import { defineCustomElement as defineCustomElement$f, BalCarouselItem as BalCarouselItem$1 } from '@baloise/ds-core/components/bal-carousel-item.js';
+import { defineCustomElement as defineCustomElement$e, BalCarousel as BalCarousel$1 } from '@baloise/ds-core/components/bal-carousel.js';
+import { defineCustomElement as defineCustomElement$g, BalCheck as BalCheck$1 } from '@baloise/ds-core/components/bal-check.js';
+import { defineCustomElement as defineCustomElement$i, BalCheckboxGroup as BalCheckboxGroup$1 } from '@baloise/ds-core/components/bal-checkbox-group.js';
+import { defineCustomElement as defineCustomElement$h, BalCheckbox as BalCheckbox$1 } from '@baloise/ds-core/components/bal-checkbox.js';
+import { defineCustomElement as defineCustomElement$j, BalClose as BalClose$1 } from '@baloise/ds-core/components/bal-close.js';
+import { defineCustomElement as defineCustomElement$k, BalContent as BalContent$1 } from '@baloise/ds-core/components/bal-content.js';
+import { defineCustomElement as defineCustomElement$m, BalDataItem as BalDataItem$1 } from '@baloise/ds-core/components/bal-data-item.js';
+import { defineCustomElement as defineCustomElement$n, BalDataLabel as BalDataLabel$1 } from '@baloise/ds-core/components/bal-data-label.js';
+import { defineCustomElement as defineCustomElement$o, BalDataValue as BalDataValue$1 } from '@baloise/ds-core/components/bal-data-value.js';
+import { defineCustomElement as defineCustomElement$l, BalData as BalData$1 } from '@baloise/ds-core/components/bal-data.js';
+import { defineCustomElement as defineCustomElement$r, BalDateCalendarCell as BalDateCalendarCell$1 } from '@baloise/ds-core/components/bal-date-calendar-cell.js';
+import { defineCustomElement as defineCustomElement$q, BalDateCalendar as BalDateCalendar$1 } from '@baloise/ds-core/components/bal-date-calendar.js';
+import { defineCustomElement as defineCustomElement$p, BalDate as BalDate$1 } from '@baloise/ds-core/components/bal-date.js';
+import { defineCustomElement as defineCustomElement$s, BalDivider as BalDivider$1 } from '@baloise/ds-core/components/bal-divider.js';
+import { defineCustomElement as defineCustomElement$t, BalDropdown as BalDropdown$1 } from '@baloise/ds-core/components/bal-dropdown.js';
+import { defineCustomElement as defineCustomElement$v, BalFieldControl as BalFieldControl$1 } from '@baloise/ds-core/components/bal-field-control.js';
+import { defineCustomElement as defineCustomElement$w, BalFieldHint as BalFieldHint$1 } from '@baloise/ds-core/components/bal-field-hint.js';
+import { defineCustomElement as defineCustomElement$x, BalFieldLabel as BalFieldLabel$1 } from '@baloise/ds-core/components/bal-field-label.js';
+import { defineCustomElement as defineCustomElement$y, BalFieldMessage as BalFieldMessage$1 } from '@baloise/ds-core/components/bal-field-message.js';
+import { defineCustomElement as defineCustomElement$u, BalField as BalField$1 } from '@baloise/ds-core/components/bal-field.js';
+import { defineCustomElement as defineCustomElement$z, BalFileUpload as BalFileUpload$1 } from '@baloise/ds-core/components/bal-file-upload.js';
+import { defineCustomElement as defineCustomElement$A, BalFooter as BalFooter$1 } from '@baloise/ds-core/components/bal-footer.js';
+import { defineCustomElement as defineCustomElement$C, BalFormCol as BalFormCol$1 } from '@baloise/ds-core/components/bal-form-col.js';
+import { defineCustomElement as defineCustomElement$D, BalFormGrid as BalFormGrid$1 } from '@baloise/ds-core/components/bal-form-grid.js';
+import { defineCustomElement as defineCustomElement$B, BalForm as BalForm$1 } from '@baloise/ds-core/components/bal-form.js';
+import { defineCustomElement as defineCustomElement$E, BalHeading as BalHeading$1 } from '@baloise/ds-core/components/bal-heading.js';
+import { defineCustomElement as defineCustomElement$G, BalHintText as BalHintText$1 } from '@baloise/ds-core/components/bal-hint-text.js';
+import { defineCustomElement as defineCustomElement$H, BalHintTitle as BalHintTitle$1 } from '@baloise/ds-core/components/bal-hint-title.js';
+import { defineCustomElement as defineCustomElement$F, BalHint as BalHint$1 } from '@baloise/ds-core/components/bal-hint.js';
+import { defineCustomElement as defineCustomElement$I, BalIcon as BalIcon$1 } from '@baloise/ds-core/components/bal-icon.js';
+import { defineCustomElement as defineCustomElement$K, BalInputDate as BalInputDate$1 } from '@baloise/ds-core/components/bal-input-date.js';
+import { defineCustomElement as defineCustomElement$L, BalInputGroup as BalInputGroup$1 } from '@baloise/ds-core/components/bal-input-group.js';
+import { defineCustomElement as defineCustomElement$M, BalInputSlider as BalInputSlider$1 } from '@baloise/ds-core/components/bal-input-slider.js';
+import { defineCustomElement as defineCustomElement$N, BalInputStepper as BalInputStepper$1 } from '@baloise/ds-core/components/bal-input-stepper.js';
+import { defineCustomElement as defineCustomElement$J, BalInput as BalInput$1 } from '@baloise/ds-core/components/bal-input.js';
+import { defineCustomElement as defineCustomElement$O, BalLabel as BalLabel$1 } from '@baloise/ds-core/components/bal-label.js';
+import { defineCustomElement as defineCustomElement$R, BalListItemAccordionBody as BalListItemAccordionBody$1 } from '@baloise/ds-core/components/bal-list-item-accordion-body.js';
+import { defineCustomElement as defineCustomElement$S, BalListItemAccordionHead as BalListItemAccordionHead$1 } from '@baloise/ds-core/components/bal-list-item-accordion-head.js';
+import { defineCustomElement as defineCustomElement$T, BalListItemContent as BalListItemContent$1 } from '@baloise/ds-core/components/bal-list-item-content.js';
+import { defineCustomElement as defineCustomElement$U, BalListItemIcon as BalListItemIcon$1 } from '@baloise/ds-core/components/bal-list-item-icon.js';
+import { defineCustomElement as defineCustomElement$V, BalListItemSubtitle as BalListItemSubtitle$1 } from '@baloise/ds-core/components/bal-list-item-subtitle.js';
+import { defineCustomElement as defineCustomElement$W, BalListItemTitle as BalListItemTitle$1 } from '@baloise/ds-core/components/bal-list-item-title.js';
+import { defineCustomElement as defineCustomElement$Q, BalListItem as BalListItem$1 } from '@baloise/ds-core/components/bal-list-item.js';
+import { defineCustomElement as defineCustomElement$P, BalList as BalList$1 } from '@baloise/ds-core/components/bal-list.js';
+import { defineCustomElement as defineCustomElement$X, BalLogo as BalLogo$1 } from '@baloise/ds-core/components/bal-logo.js';
+import { defineCustomElement as defineCustomElement$Z, BalModalBody as BalModalBody$1 } from '@baloise/ds-core/components/bal-modal-body.js';
+import { defineCustomElement as defineCustomElement$_, BalModalHeader as BalModalHeader$1 } from '@baloise/ds-core/components/bal-modal-header.js';
+import { defineCustomElement as defineCustomElement$Y, BalModal as BalModal$1 } from '@baloise/ds-core/components/bal-modal.js';
+import { defineCustomElement as defineCustomElement$12, BalNavLinkGridCol as BalNavLinkGridCol$1 } from '@baloise/ds-core/components/bal-nav-link-grid-col.js';
+import { defineCustomElement as defineCustomElement$11, BalNavLinkGrid as BalNavLinkGrid$1 } from '@baloise/ds-core/components/bal-nav-link-grid.js';
+import { defineCustomElement as defineCustomElement$13, BalNavLinkGroup as BalNavLinkGroup$1 } from '@baloise/ds-core/components/bal-nav-link-group.js';
+import { defineCustomElement as defineCustomElement$10, BalNavLink as BalNavLink$1 } from '@baloise/ds-core/components/bal-nav-link.js';
+import { defineCustomElement as defineCustomElement$14, BalNavMenuBar as BalNavMenuBar$1 } from '@baloise/ds-core/components/bal-nav-menu-bar.js';
+import { defineCustomElement as defineCustomElement$15, BalNavMenuFlyout as BalNavMenuFlyout$1 } from '@baloise/ds-core/components/bal-nav-menu-flyout.js';
+import { defineCustomElement as defineCustomElement$16, BalNavMetaBar as BalNavMetaBar$1 } from '@baloise/ds-core/components/bal-nav-meta-bar.js';
+import { defineCustomElement as defineCustomElement$$, BalNav as BalNav$1 } from '@baloise/ds-core/components/bal-nav.js';
+import { defineCustomElement as defineCustomElement$18, BalNavbarBrand as BalNavbarBrand$1 } from '@baloise/ds-core/components/bal-navbar-brand.js';
+import { defineCustomElement as defineCustomElement$1a, BalNavbarMenuEnd as BalNavbarMenuEnd$1 } from '@baloise/ds-core/components/bal-navbar-menu-end.js';
+import { defineCustomElement as defineCustomElement$1b, BalNavbarMenuStart as BalNavbarMenuStart$1 } from '@baloise/ds-core/components/bal-navbar-menu-start.js';
+import { defineCustomElement as defineCustomElement$19, BalNavbarMenu as BalNavbarMenu$1 } from '@baloise/ds-core/components/bal-navbar-menu.js';
+import { defineCustomElement as defineCustomElement$17, BalNavbar as BalNavbar$1 } from '@baloise/ds-core/components/bal-navbar.js';
+import { defineCustomElement as defineCustomElement$1c, BalNotices as BalNotices$1 } from '@baloise/ds-core/components/bal-notices.js';
+import { defineCustomElement as defineCustomElement$1d, BalNotification as BalNotification$1 } from '@baloise/ds-core/components/bal-notification.js';
+import { defineCustomElement as defineCustomElement$1e, BalNumberInput as BalNumberInput$1 } from '@baloise/ds-core/components/bal-number-input.js';
+import { defineCustomElement as defineCustomElement$1g, BalOptionList as BalOptionList$1 } from '@baloise/ds-core/components/bal-option-list.js';
+import { defineCustomElement as defineCustomElement$1f, BalOption as BalOption$1 } from '@baloise/ds-core/components/bal-option.js';
+import { defineCustomElement as defineCustomElement$1h, BalPagination as BalPagination$1 } from '@baloise/ds-core/components/bal-pagination.js';
+import { defineCustomElement as defineCustomElement$1j, BalPopoverContent as BalPopoverContent$1 } from '@baloise/ds-core/components/bal-popover-content.js';
+import { defineCustomElement as defineCustomElement$1i, BalPopover as BalPopover$1 } from '@baloise/ds-core/components/bal-popover.js';
+import { defineCustomElement as defineCustomElement$1k, BalPopup as BalPopup$1 } from '@baloise/ds-core/components/bal-popup.js';
+import { defineCustomElement as defineCustomElement$1l, BalProgressBar as BalProgressBar$1 } from '@baloise/ds-core/components/bal-progress-bar.js';
+import { defineCustomElement as defineCustomElement$1n, BalRadioGroup as BalRadioGroup$1 } from '@baloise/ds-core/components/bal-radio-group.js';
+import { defineCustomElement as defineCustomElement$1o, BalRadioIcon as BalRadioIcon$1 } from '@baloise/ds-core/components/bal-radio-icon.js';
+import { defineCustomElement as defineCustomElement$1m, BalRadio as BalRadio$1 } from '@baloise/ds-core/components/bal-radio.js';
+import { defineCustomElement as defineCustomElement$1q, BalSegmentItem as BalSegmentItem$1 } from '@baloise/ds-core/components/bal-segment-item.js';
+import { defineCustomElement as defineCustomElement$1p, BalSegment as BalSegment$1 } from '@baloise/ds-core/components/bal-segment.js';
+import { defineCustomElement as defineCustomElement$1s, BalSelectOption as BalSelectOption$1 } from '@baloise/ds-core/components/bal-select-option.js';
+import { defineCustomElement as defineCustomElement$1r, BalSelect as BalSelect$1 } from '@baloise/ds-core/components/bal-select.js';
+import { defineCustomElement as defineCustomElement$1t, BalShape as BalShape$1 } from '@baloise/ds-core/components/bal-shape.js';
+import { defineCustomElement as defineCustomElement$1u, BalSheet as BalSheet$1 } from '@baloise/ds-core/components/bal-sheet.js';
+import { defineCustomElement as defineCustomElement$1v, BalSnackbar as BalSnackbar$1 } from '@baloise/ds-core/components/bal-snackbar.js';
+import { defineCustomElement as defineCustomElement$1w, BalSpinner as BalSpinner$1 } from '@baloise/ds-core/components/bal-spinner.js';
+import { defineCustomElement as defineCustomElement$1x, BalStack as BalStack$1 } from '@baloise/ds-core/components/bal-stack.js';
+import { defineCustomElement as defineCustomElement$1z, BalStageBackLink as BalStageBackLink$1 } from '@baloise/ds-core/components/bal-stage-back-link.js';
+import { defineCustomElement as defineCustomElement$1A, BalStageBody as BalStageBody$1 } from '@baloise/ds-core/components/bal-stage-body.js';
+import { defineCustomElement as defineCustomElement$1B, BalStageFoot as BalStageFoot$1 } from '@baloise/ds-core/components/bal-stage-foot.js';
+import { defineCustomElement as defineCustomElement$1C, BalStageHead as BalStageHead$1 } from '@baloise/ds-core/components/bal-stage-head.js';
+import { defineCustomElement as defineCustomElement$1D, BalStageImage as BalStageImage$1 } from '@baloise/ds-core/components/bal-stage-image.js';
+import { defineCustomElement as defineCustomElement$1y, BalStage as BalStage$1 } from '@baloise/ds-core/components/bal-stage.js';
+import { defineCustomElement as defineCustomElement$1E, BalStepItem as BalStepItem$1 } from '@baloise/ds-core/components/bal-step-item.js';
+import { defineCustomElement as defineCustomElement$1F, BalSteps as BalSteps$1 } from '@baloise/ds-core/components/bal-steps.js';
+import { defineCustomElement as defineCustomElement$1G, BalSwitch as BalSwitch$1 } from '@baloise/ds-core/components/bal-switch.js';
+import { defineCustomElement as defineCustomElement$1H, BalTabItem as BalTabItem$1 } from '@baloise/ds-core/components/bal-tab-item.js';
+import { defineCustomElement as defineCustomElement$1I, BalTable as BalTable$1 } from '@baloise/ds-core/components/bal-table.js';
+import { defineCustomElement as defineCustomElement$1J, BalTabs as BalTabs$1 } from '@baloise/ds-core/components/bal-tabs.js';
+import { defineCustomElement as defineCustomElement$1L, BalTagGroup as BalTagGroup$1 } from '@baloise/ds-core/components/bal-tag-group.js';
+import { defineCustomElement as defineCustomElement$1K, BalTag as BalTag$1 } from '@baloise/ds-core/components/bal-tag.js';
+import { defineCustomElement as defineCustomElement$1M, BalText as BalText$1 } from '@baloise/ds-core/components/bal-text.js';
+import { defineCustomElement as defineCustomElement$1N, BalTextarea as BalTextarea$1 } from '@baloise/ds-core/components/bal-textarea.js';
+import { defineCustomElement as defineCustomElement$1O, BalTimeInput as BalTimeInput$1 } from '@baloise/ds-core/components/bal-time-input.js';
+import { defineCustomElement as defineCustomElement$1P, BalToast as BalToast$1 } from '@baloise/ds-core/components/bal-toast.js';
+import { defineCustomElement as defineCustomElement$1Q, BalTooltip as BalTooltip$1 } from '@baloise/ds-core/components/bal-tooltip.js';
+import { createComponent } from '@stencil/react-output-target/runtime';
 import React from 'react';
 function _extends() {
@@ -129,221 +130,7 @@ function _extends() {
     return _extends.apply(this, arguments);
 }
-/**
- * @license
- * Copyright 2018 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */ function _array_like_to_array(arr, len) {
-    if (len == null || len > arr.length) len = arr.length;
-    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
-    return arr2;
-}
-function _array_with_holes(arr) {
-    if (Array.isArray(arr)) return arr;
-}
-function _define_property(obj, key, value) {
-    if (key in obj) {
-        Object.defineProperty(obj, key, {
-            value: value,
-            enumerable: true,
-            configurable: true,
-            writable: true
-        });
-    } else {
-        obj[key] = value;
-    }
-    return obj;
-}
-function _iterable_to_array_limit(arr, i) {
-    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
-    if (_i == null) return;
-    var _arr = [];
-    var _n = true;
-    var _d = false;
-    var _s, _e;
-    try {
-        for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
-            _arr.push(_s.value);
-            if (i && _arr.length === i) break;
-        }
-    } catch (err) {
-        _d = true;
-        _e = err;
-    } finally{
-        try {
-            if (!_n && _i["return"] != null) _i["return"]();
-        } finally{
-            if (_d) throw _e;
-        }
-    }
-    return _arr;
-}
-function _non_iterable_rest() {
-    throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-}
-function _object_spread(target) {
-    for(var i = 1; i < arguments.length; i++){
-        var source = arguments[i] != null ? arguments[i] : {};
-        var ownKeys = Object.keys(source);
-        if (typeof Object.getOwnPropertySymbols === "function") {
-            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
-                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
-            }));
-        }
-        ownKeys.forEach(function(key) {
-            _define_property(target, key, source[key]);
-        });
-    }
-    return target;
-}
-function ownKeys(object, enumerableOnly) {
-    var keys = Object.keys(object);
-    if (Object.getOwnPropertySymbols) {
-        var symbols = Object.getOwnPropertySymbols(object);
-        keys.push.apply(keys, symbols);
-    }
-    return keys;
-}
-function _object_spread_props(target, source) {
-    source = source != null ? source : {};
-    if (Object.getOwnPropertyDescriptors) {
-        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
-    } else {
-        ownKeys(Object(source)).forEach(function(key) {
-            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-        });
-    }
-    return target;
-}
-function _sliced_to_array(arr, i) {
-    return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
-}
-function _unsupported_iterable_to_array(o, minLen) {
-    if (!o) return;
-    if (typeof o === "string") return _array_like_to_array(o, minLen);
-    var n = Object.prototype.toString.call(o).slice(8, -1);
-    if (n === "Object" && o.constructor) n = o.constructor.name;
-    if (n === "Map" || n === "Set") return Array.from(n);
-    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
-}
-var e = new Set([
-    "children",
-    "localName",
-    "ref",
-    "style",
-    "className"
-]), n = new WeakMap, t = function(e, t, o, l, a) {
-    var s = a === null || a === undefined ? undefined : a[t];
-    undefined === s ? (e[t] = o, null == o && t in HTMLElement.prototype && e.removeAttribute(t)) : o !== l && function(e, t, o) {
-        var _$l = n.get(e);
-        undefined === _$l && n.set(e, _$l = new Map);
-        var _$a = _$l.get(t);
-        undefined !== o ? undefined === _$a ? (_$l.set(t, _$a = {
-            handleEvent: o
-        }), e.addEventListener(t, _$a)) : _$a.handleEvent = o : undefined !== _$a && (_$l.delete(t), e.removeEventListener(t, _$a));
-    }(e, s, o);
-}, o = function(param) {
-    var n = param.react, o = param.tagName, l = param.elementClass, a = param.events, s = param.displayName;
-    var c = new Set(Object.keys(a !== null && a !== undefined ? a : {})), r = n.forwardRef(function(s, r) {
-        var i = n.useRef(new Map), d = n.useRef(null), f = {}, u = {};
-        var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = undefined;
-        try {
-            for(var _iterator = Object.entries(s)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true){
-                var _step_value = _sliced_to_array(_step.value, 2), n1 = _step_value[0], t1 = _step_value[1];
-                e.has(n1) ? f["className" === n1 ? "class" : n1] = t1 : c.has(n1) || n1 in l.prototype ? u[n1] = t1 : f[n1] = t1;
-            }
-        } catch (err) {
-            _didIteratorError = true;
-            _iteratorError = err;
-        } finally{
-            try {
-                if (!_iteratorNormalCompletion && _iterator.return != null) {
-                    _iterator.return();
-                }
-            } finally{
-                if (_didIteratorError) {
-                    throw _iteratorError;
-                }
-            }
-        }
-        return n.useLayoutEffect(function() {
-            if (null === d.current) return;
-            var e = new Map;
-            for(var n in u)t(d.current, n, s[n], i.current.get(n), a), i.current.delete(n), e.set(n, s[n]);
-            var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = undefined;
-            try {
-                for(var _iterator = i.current[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true){
-                    var _step_value = _sliced_to_array(_step.value, 2), e1 = _step_value[0], n1 = _step_value[1];
-                    t(d.current, e1, void 0, n1, a);
-                }
-            } catch (err) {
-                _didIteratorError = true;
-                _iteratorError = err;
-            } finally{
-                try {
-                    if (!_iteratorNormalCompletion && _iterator.return != null) {
-                        _iterator.return();
-                    }
-                } finally{
-                    if (_didIteratorError) {
-                        throw _iteratorError;
-                    }
-                }
-            }
-            i.current = e;
-        }), n.useLayoutEffect(function() {
-            var _d_current;
-            (_d_current = d.current) === null || _d_current === undefined ? undefined : _d_current.removeAttribute("defer-hydration");
-        }, []), f.suppressHydrationWarning = true, n.createElement(o, _object_spread_props(_object_spread({}, f), {
-            ref: n.useCallback(function(e) {
-                d.current = e, "function" == typeof r ? r(e) : null !== r && (r.current = e);
-            }, [
-                r
-            ])
-        }));
-    });
-    return r.displayName = s !== null && s !== undefined ? s : l.name, r;
-};
-function _object_without_properties(source, excluded) {
-    if (source == null) return {};
-    var target = _object_without_properties_loose(source, excluded);
-    var key, i;
-    if (Object.getOwnPropertySymbols) {
-        var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
-        for(i = 0; i < sourceSymbolKeys.length; i++){
-            key = sourceSymbolKeys[i];
-            if (excluded.indexOf(key) >= 0) continue;
-            if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
-            target[key] = source[key];
-        }
-    }
-    return target;
-}
-function _object_without_properties_loose(source, excluded) {
-    if (source == null) return {};
-    var target = {};
-    var sourceKeys = Object.keys(source);
-    var key, i;
-    for(i = 0; i < sourceKeys.length; i++){
-        key = sourceKeys[i];
-        if (excluded.indexOf(key) >= 0) continue;
-        target[key] = source[key];
-    }
-    return target;
-}
-function _type_of(obj) {
-    "@swc/helpers - typeof";
-    return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
-}
-var r = function(_param) {
-    var e = _param.defineCustomElement, o$1 = _object_without_properties(_param, [
-        "defineCustomElement"
-    ]);
-    return (typeof e === "undefined" ? "undefined" : _type_of(e)) < "u" && e(), o(o$1);
-};
-var BalAccordion = /*@__PURE__*/ r({
+var BalAccordion = /*@__PURE__*/ createComponent({
     tagName: 'bal-accordion',
     elementClass: BalAccordion$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -353,49 +140,49 @@ var BalAccordion = /*@__PURE__*/ r({
         onBalWillAnimate: 'balWillAnimate',
         onBalDidAnimate: 'balDidAnimate'
     },
-    defineCustomElement: defineCustomElement$1Q
+    defineCustomElement: defineCustomElement
 });
-var BalAccordionDetails = /*@__PURE__*/ r({
+var BalAccordionDetails = /*@__PURE__*/ createComponent({
     tagName: 'bal-accordion-details',
     elementClass: BalAccordionDetails$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement
+    defineCustomElement: defineCustomElement$1
 });
-var BalAccordionSummary = /*@__PURE__*/ r({
+var BalAccordionSummary = /*@__PURE__*/ createComponent({
     tagName: 'bal-accordion-summary',
     elementClass: BalAccordionSummary$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1
+    defineCustomElement: defineCustomElement$2
 });
-var BalAccordionTrigger = /*@__PURE__*/ r({
+var BalAccordionTrigger = /*@__PURE__*/ createComponent({
     tagName: 'bal-accordion-trigger',
     elementClass: BalAccordionTrigger$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$2
+    defineCustomElement: defineCustomElement$3
 });
-var BalApp = /*@__PURE__*/ r({
+var BalApp = /*@__PURE__*/ createComponent({
     tagName: 'bal-app',
     elementClass: BalApp$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$3
+    defineCustomElement: defineCustomElement$4
 });
-var BalBadge = /*@__PURE__*/ r({
+var BalBadge = /*@__PURE__*/ createComponent({
     tagName: 'bal-badge',
     elementClass: BalBadge$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$4
+    defineCustomElement: defineCustomElement$5
 });
-var BalButton = /*@__PURE__*/ r({
+var BalButton = /*@__PURE__*/ createComponent({
     tagName: 'bal-button',
     elementClass: BalButton$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -407,65 +194,65 @@ var BalButton = /*@__PURE__*/ r({
         onBalBlur: 'balBlur',
         onBalDidRender: 'balDidRender'
     },
-    defineCustomElement: defineCustomElement$5
+    defineCustomElement: defineCustomElement$6
 });
-var BalButtonGroup = /*@__PURE__*/ r({
+var BalButtonGroup = /*@__PURE__*/ createComponent({
     tagName: 'bal-button-group',
     elementClass: BalButtonGroup$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$6
+    defineCustomElement: defineCustomElement$7
 });
-var BalCard = /*@__PURE__*/ r({
+var BalCard = /*@__PURE__*/ createComponent({
     tagName: 'bal-card',
     elementClass: BalCard$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$7
+    defineCustomElement: defineCustomElement$8
 });
-var BalCardActions = /*@__PURE__*/ r({
+var BalCardActions = /*@__PURE__*/ createComponent({
     tagName: 'bal-card-actions',
     elementClass: BalCardActions$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$8
+    defineCustomElement: defineCustomElement$9
 });
-var BalCardButton = /*@__PURE__*/ r({
+var BalCardButton = /*@__PURE__*/ createComponent({
     tagName: 'bal-card-button',
     elementClass: BalCardButton$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$9
+    defineCustomElement: defineCustomElement$a
 });
-var BalCardContent = /*@__PURE__*/ r({
+var BalCardContent = /*@__PURE__*/ createComponent({
     tagName: 'bal-card-content',
     elementClass: BalCardContent$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$a
+    defineCustomElement: defineCustomElement$b
 });
-var BalCardSubtitle = /*@__PURE__*/ r({
+var BalCardSubtitle = /*@__PURE__*/ createComponent({
     tagName: 'bal-card-subtitle',
     elementClass: BalCardSubtitle$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$b
+    defineCustomElement: defineCustomElement$c
 });
-var BalCardTitle = /*@__PURE__*/ r({
+var BalCardTitle = /*@__PURE__*/ createComponent({
     tagName: 'bal-card-title',
     elementClass: BalCardTitle$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$c
+    defineCustomElement: defineCustomElement$d
 });
-var BalCarousel = /*@__PURE__*/ r({
+var BalCarousel = /*@__PURE__*/ createComponent({
     tagName: 'bal-carousel',
     elementClass: BalCarousel$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -473,9 +260,9 @@ var BalCarousel = /*@__PURE__*/ r({
     events: {
         onBalChange: 'balChange'
     },
-    defineCustomElement: defineCustomElement$d
+    defineCustomElement: defineCustomElement$e
 });
-var BalCarouselItem = /*@__PURE__*/ r({
+var BalCarouselItem = /*@__PURE__*/ createComponent({
     tagName: 'bal-carousel-item',
     elementClass: BalCarouselItem$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -485,17 +272,17 @@ var BalCarouselItem = /*@__PURE__*/ r({
         onBalFocus: 'balFocus',
         onBalBlur: 'balBlur'
     },
-    defineCustomElement: defineCustomElement$e
+    defineCustomElement: defineCustomElement$f
 });
-var BalCheck = /*@__PURE__*/ r({
+var BalCheck = /*@__PURE__*/ createComponent({
     tagName: 'bal-check',
     elementClass: BalCheck$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$f
+    defineCustomElement: defineCustomElement$g
 });
-var BalCheckbox = /*@__PURE__*/ r({
+var BalCheckbox = /*@__PURE__*/ createComponent({
     tagName: 'bal-checkbox',
     elementClass: BalCheckbox$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -505,9 +292,9 @@ var BalCheckbox = /*@__PURE__*/ r({
         onBalBlur: 'balBlur',
         onBalChange: 'balChange'
     },
-    defineCustomElement: defineCustomElement$g
+    defineCustomElement: defineCustomElement$h
 });
-var BalCheckboxGroup = /*@__PURE__*/ r({
+var BalCheckboxGroup = /*@__PURE__*/ createComponent({
     tagName: 'bal-checkbox-group',
     elementClass: BalCheckboxGroup$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -517,49 +304,49 @@ var BalCheckboxGroup = /*@__PURE__*/ r({
         onBalFocus: 'balFocus',
         onBalBlur: 'balBlur'
     },
-    defineCustomElement: defineCustomElement$h
+    defineCustomElement: defineCustomElement$i
 });
-var BalClose = /*@__PURE__*/ r({
+var BalClose = /*@__PURE__*/ createComponent({
     tagName: 'bal-close',
     elementClass: BalClose$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$i
+    defineCustomElement: defineCustomElement$j
 });
-var BalContent = /*@__PURE__*/ r({
+var BalContent = /*@__PURE__*/ createComponent({
     tagName: 'bal-content',
     elementClass: BalContent$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$j
+    defineCustomElement: defineCustomElement$k
 });
-var BalData = /*@__PURE__*/ r({
+var BalData = /*@__PURE__*/ createComponent({
     tagName: 'bal-data',
     elementClass: BalData$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$k
+    defineCustomElement: defineCustomElement$l
 });
-var BalDataItem = /*@__PURE__*/ r({
+var BalDataItem = /*@__PURE__*/ createComponent({
     tagName: 'bal-data-item',
     elementClass: BalDataItem$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$l
+    defineCustomElement: defineCustomElement$m
 });
-var BalDataLabel = /*@__PURE__*/ r({
+var BalDataLabel = /*@__PURE__*/ createComponent({
     tagName: 'bal-data-label',
     elementClass: BalDataLabel$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$m
+    defineCustomElement: defineCustomElement$n
 });
-var BalDataValue = /*@__PURE__*/ r({
+var BalDataValue = /*@__PURE__*/ createComponent({
     tagName: 'bal-data-value',
     elementClass: BalDataValue$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -569,9 +356,9 @@ var BalDataValue = /*@__PURE__*/ r({
         onBalFocus: 'balFocus',
         onBalBlur: 'balBlur'
     },
-    defineCustomElement: defineCustomElement$n
+    defineCustomElement: defineCustomElement$o
 });
-var BalDate = /*@__PURE__*/ r({
+var BalDate = /*@__PURE__*/ createComponent({
     tagName: 'bal-date',
     elementClass: BalDate$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -586,9 +373,9 @@ var BalDate = /*@__PURE__*/ r({
         onBalInputClick: 'balInputClick',
         onBalIconClick: 'balIconClick'
     },
-    defineCustomElement: defineCustomElement$o
+    defineCustomElement: defineCustomElement$p
 });
-var BalDateCalendar = /*@__PURE__*/ r({
+var BalDateCalendar = /*@__PURE__*/ createComponent({
     tagName: 'bal-date-calendar',
     elementClass: BalDateCalendar$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -596,9 +383,9 @@ var BalDateCalendar = /*@__PURE__*/ r({
     events: {
         onBalChange: 'balChange'
     },
-    defineCustomElement: defineCustomElement$p
+    defineCustomElement: defineCustomElement$q
 });
-var BalDateCalendarCell = /*@__PURE__*/ r({
+var BalDateCalendarCell = /*@__PURE__*/ createComponent({
     tagName: 'bal-date-calendar-cell',
     elementClass: BalDateCalendarCell$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -606,17 +393,17 @@ var BalDateCalendarCell = /*@__PURE__*/ r({
     events: {
         onBalSelectDay: 'balSelectDay'
     },
-    defineCustomElement: defineCustomElement$q
+    defineCustomElement: defineCustomElement$r
 });
-var BalDivider = /*@__PURE__*/ r({
+var BalDivider = /*@__PURE__*/ createComponent({
     tagName: 'bal-divider',
     elementClass: BalDivider$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$r
+    defineCustomElement: defineCustomElement$s
 });
-var BalDropdown = /*@__PURE__*/ r({
+var BalDropdown = /*@__PURE__*/ createComponent({
     tagName: 'bal-dropdown',
     elementClass: BalDropdown$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -626,9 +413,9 @@ var BalDropdown = /*@__PURE__*/ r({
         onBalFocus: 'balFocus',
         onBalBlur: 'balBlur'
     },
-    defineCustomElement: defineCustomElement$s
+    defineCustomElement: defineCustomElement$t
 });
-var BalField = /*@__PURE__*/ r({
+var BalField = /*@__PURE__*/ createComponent({
     tagName: 'bal-field',
     elementClass: BalField$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -636,41 +423,41 @@ var BalField = /*@__PURE__*/ r({
     events: {
         onBalFormControlDidLoad: 'balFormControlDidLoad'
     },
-    defineCustomElement: defineCustomElement$t
+    defineCustomElement: defineCustomElement$u
 });
-var BalFieldControl = /*@__PURE__*/ r({
+var BalFieldControl = /*@__PURE__*/ createComponent({
     tagName: 'bal-field-control',
     elementClass: BalFieldControl$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$u
+    defineCustomElement: defineCustomElement$v
 });
-var BalFieldHint = /*@__PURE__*/ r({
+var BalFieldHint = /*@__PURE__*/ createComponent({
     tagName: 'bal-field-hint',
     elementClass: BalFieldHint$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$v
+    defineCustomElement: defineCustomElement$w
 });
-var BalFieldLabel = /*@__PURE__*/ r({
+var BalFieldLabel = /*@__PURE__*/ createComponent({
     tagName: 'bal-field-label',
     elementClass: BalFieldLabel$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$w
+    defineCustomElement: defineCustomElement$x
 });
-var BalFieldMessage = /*@__PURE__*/ r({
+var BalFieldMessage = /*@__PURE__*/ createComponent({
     tagName: 'bal-field-message',
     elementClass: BalFieldMessage$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$x
+    defineCustomElement: defineCustomElement$y
 });
-var BalFileUpload = /*@__PURE__*/ r({
+var BalFileUpload = /*@__PURE__*/ createComponent({
     tagName: 'bal-file-upload',
     elementClass: BalFileUpload$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -684,81 +471,81 @@ var BalFileUpload = /*@__PURE__*/ r({
         onBalBlur: 'balBlur',
         onBalFocus: 'balFocus'
     },
-    defineCustomElement: defineCustomElement$y
+    defineCustomElement: defineCustomElement$z
 });
-var BalFooter = /*@__PURE__*/ r({
+var BalFooter = /*@__PURE__*/ createComponent({
     tagName: 'bal-footer',
     elementClass: BalFooter$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$z
+    defineCustomElement: defineCustomElement$A
 });
-var BalForm = /*@__PURE__*/ r({
+var BalForm = /*@__PURE__*/ createComponent({
     tagName: 'bal-form',
     elementClass: BalForm$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$A
+    defineCustomElement: defineCustomElement$B
 });
-var BalFormCol = /*@__PURE__*/ r({
+var BalFormCol = /*@__PURE__*/ createComponent({
     tagName: 'bal-form-col',
     elementClass: BalFormCol$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$B
+    defineCustomElement: defineCustomElement$C
 });
-var BalFormGrid = /*@__PURE__*/ r({
+var BalFormGrid = /*@__PURE__*/ createComponent({
     tagName: 'bal-form-grid',
     elementClass: BalFormGrid$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$C
+    defineCustomElement: defineCustomElement$D
 });
-var BalHeading = /*@__PURE__*/ r({
+var BalHeading = /*@__PURE__*/ createComponent({
     tagName: 'bal-heading',
     elementClass: BalHeading$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$D
+    defineCustomElement: defineCustomElement$E
 });
-var BalHint = /*@__PURE__*/ r({
+var BalHint = /*@__PURE__*/ createComponent({
     tagName: 'bal-hint',
     elementClass: BalHint$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$E
+    defineCustomElement: defineCustomElement$F
 });
-var BalHintText = /*@__PURE__*/ r({
+var BalHintText = /*@__PURE__*/ createComponent({
     tagName: 'bal-hint-text',
     elementClass: BalHintText$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$F
+    defineCustomElement: defineCustomElement$G
 });
-var BalHintTitle = /*@__PURE__*/ r({
+var BalHintTitle = /*@__PURE__*/ createComponent({
     tagName: 'bal-hint-title',
     elementClass: BalHintTitle$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$G
+    defineCustomElement: defineCustomElement$H
 });
-var BalIcon = /*@__PURE__*/ r({
+var BalIcon = /*@__PURE__*/ createComponent({
     tagName: 'bal-icon',
     elementClass: BalIcon$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$H
+    defineCustomElement: defineCustomElement$I
 });
-var BalInput = /*@__PURE__*/ r({
+var BalInput = /*@__PURE__*/ createComponent({
     tagName: 'bal-input',
     elementClass: BalInput$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -770,9 +557,9 @@ var BalInput = /*@__PURE__*/ r({
         onBalFocus: 'balFocus',
         onBalChange: 'balChange'
     },
-    defineCustomElement: defineCustomElement$I
+    defineCustomElement: defineCustomElement$J
 });
-var BalInputDate = /*@__PURE__*/ r({
+var BalInputDate = /*@__PURE__*/ createComponent({
     tagName: 'bal-input-date',
     elementClass: BalInputDate$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -784,17 +571,17 @@ var BalInputDate = /*@__PURE__*/ r({
         onBalBlur: 'balBlur',
         onBalFocus: 'balFocus'
     },
-    defineCustomElement: defineCustomElement$J
+    defineCustomElement: defineCustomElement$K
 });
-var BalInputGroup = /*@__PURE__*/ r({
+var BalInputGroup = /*@__PURE__*/ createComponent({
     tagName: 'bal-input-group',
     elementClass: BalInputGroup$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$K
+    defineCustomElement: defineCustomElement$L
 });
-var BalInputSlider = /*@__PURE__*/ r({
+var BalInputSlider = /*@__PURE__*/ createComponent({
     tagName: 'bal-input-slider',
     elementClass: BalInputSlider$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -806,9 +593,9 @@ var BalInputSlider = /*@__PURE__*/ r({
         onBalFocus: 'balFocus',
         onBalChange: 'balChange'
     },
-    defineCustomElement: defineCustomElement$L
+    defineCustomElement: defineCustomElement$M
 });
-var BalInputStepper = /*@__PURE__*/ r({
+var BalInputStepper = /*@__PURE__*/ createComponent({
     tagName: 'bal-input-stepper',
     elementClass: BalInputStepper$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -821,25 +608,25 @@ var BalInputStepper = /*@__PURE__*/ r({
         onBalFocus: 'balFocus',
         onBalBlur: 'balBlur'
     },
-    defineCustomElement: defineCustomElement$M
+    defineCustomElement: defineCustomElement$N
 });
-var BalLabel = /*@__PURE__*/ r({
+var BalLabel = /*@__PURE__*/ createComponent({
     tagName: 'bal-label',
     elementClass: BalLabel$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$N
+    defineCustomElement: defineCustomElement$O
 });
-var BalList = /*@__PURE__*/ r({
+var BalList = /*@__PURE__*/ createComponent({
     tagName: 'bal-list',
     elementClass: BalList$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$O
+    defineCustomElement: defineCustomElement$P
 });
-var BalListItem = /*@__PURE__*/ r({
+var BalListItem = /*@__PURE__*/ createComponent({
     tagName: 'bal-list-item',
     elementClass: BalListItem$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -850,17 +637,17 @@ var BalListItem = /*@__PURE__*/ r({
         onBalWillAnimate: 'balWillAnimate',
         onBalDidAnimate: 'balDidAnimate'
     },
-    defineCustomElement: defineCustomElement$P
+    defineCustomElement: defineCustomElement$Q
 });
-var BalListItemAccordionBody = /*@__PURE__*/ r({
+var BalListItemAccordionBody = /*@__PURE__*/ createComponent({
     tagName: 'bal-list-item-accordion-body',
     elementClass: BalListItemAccordionBody$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$Q
+    defineCustomElement: defineCustomElement$R
 });
-var BalListItemAccordionHead = /*@__PURE__*/ r({
+var BalListItemAccordionHead = /*@__PURE__*/ createComponent({
     tagName: 'bal-list-item-accordion-head',
     elementClass: BalListItemAccordionHead$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -868,49 +655,49 @@ var BalListItemAccordionHead = /*@__PURE__*/ r({
     events: {
         onBalAccordionChange: 'balAccordionChange'
     },
-    defineCustomElement: defineCustomElement$R
+    defineCustomElement: defineCustomElement$S
 });
-var BalListItemContent = /*@__PURE__*/ r({
+var BalListItemContent = /*@__PURE__*/ createComponent({
     tagName: 'bal-list-item-content',
     elementClass: BalListItemContent$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$S
+    defineCustomElement: defineCustomElement$T
 });
-var BalListItemIcon = /*@__PURE__*/ r({
+var BalListItemIcon = /*@__PURE__*/ createComponent({
     tagName: 'bal-list-item-icon',
     elementClass: BalListItemIcon$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$T
+    defineCustomElement: defineCustomElement$U
 });
-var BalListItemSubtitle = /*@__PURE__*/ r({
+var BalListItemSubtitle = /*@__PURE__*/ createComponent({
     tagName: 'bal-list-item-subtitle',
     elementClass: BalListItemSubtitle$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$U
+    defineCustomElement: defineCustomElement$V
 });
-var BalListItemTitle = /*@__PURE__*/ r({
+var BalListItemTitle = /*@__PURE__*/ createComponent({
     tagName: 'bal-list-item-title',
     elementClass: BalListItemTitle$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$V
+    defineCustomElement: defineCustomElement$W
 });
-var BalLogo = /*@__PURE__*/ r({
+var BalLogo = /*@__PURE__*/ createComponent({
     tagName: 'bal-logo',
     elementClass: BalLogo$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$W
+    defineCustomElement: defineCustomElement$X
 });
-var BalModal = /*@__PURE__*/ r({
+var BalModal = /*@__PURE__*/ createComponent({
     tagName: 'bal-modal',
     elementClass: BalModal$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -921,25 +708,25 @@ var BalModal = /*@__PURE__*/ r({
         onBalModalWillDismiss: 'balModalWillDismiss',
         onBalModalDidDismiss: 'balModalDidDismiss'
     },
-    defineCustomElement: defineCustomElement$X
+    defineCustomElement: defineCustomElement$Y
 });
-var BalModalBody = /*@__PURE__*/ r({
+var BalModalBody = /*@__PURE__*/ createComponent({
     tagName: 'bal-modal-body',
     elementClass: BalModalBody$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$Y
+    defineCustomElement: defineCustomElement$Z
 });
-var BalModalHeader = /*@__PURE__*/ r({
+var BalModalHeader = /*@__PURE__*/ createComponent({
     tagName: 'bal-modal-header',
     elementClass: BalModalHeader$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$Z
+    defineCustomElement: defineCustomElement$_
 });
-var BalNav = /*@__PURE__*/ r({
+var BalNav = /*@__PURE__*/ createComponent({
     tagName: 'bal-nav',
     elementClass: BalNav$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -947,73 +734,75 @@ var BalNav = /*@__PURE__*/ r({
     events: {
         onBalNavItemClick: 'balNavItemClick'
     },
-    defineCustomElement: defineCustomElement$_
+    defineCustomElement: defineCustomElement$$
 });
-var BalNavLink = /*@__PURE__*/ r({
+var BalNavLink = /*@__PURE__*/ createComponent({
     tagName: 'bal-nav-link',
     elementClass: BalNavLink$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$$
+    defineCustomElement: defineCustomElement$10
 });
-var BalNavLinkGrid = /*@__PURE__*/ r({
+var BalNavLinkGrid = /*@__PURE__*/ createComponent({
     tagName: 'bal-nav-link-grid',
     elementClass: BalNavLinkGrid$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$10
+    defineCustomElement: defineCustomElement$11
 });
-var BalNavLinkGridCol = /*@__PURE__*/ r({
+var BalNavLinkGridCol = /*@__PURE__*/ createComponent({
     tagName: 'bal-nav-link-grid-col',
     elementClass: BalNavLinkGridCol$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$11
+    defineCustomElement: defineCustomElement$12
 });
-var BalNavLinkGroup = /*@__PURE__*/ r({
+var BalNavLinkGroup = /*@__PURE__*/ createComponent({
     tagName: 'bal-nav-link-group',
     elementClass: BalNavLinkGroup$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$12
+    defineCustomElement: defineCustomElement$13
 });
-var BalNavMenuBar = /*@__PURE__*/ r({
+var BalNavMenuBar = /*@__PURE__*/ createComponent({
     tagName: 'bal-nav-menu-bar',
     elementClass: BalNavMenuBar$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$13
+    defineCustomElement: defineCustomElement$14
 });
-var BalNavMenuFlyout = /*@__PURE__*/ r({
+var BalNavMenuFlyout = /*@__PURE__*/ createComponent({
     tagName: 'bal-nav-menu-flyout',
     elementClass: BalNavMenuFlyout$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
-    events: {},
-    defineCustomElement: defineCustomElement$14
+    events: {
+        onBalFocusOut: 'balFocusOut'
+    },
+    defineCustomElement: defineCustomElement$15
 });
-var BalNavMetaBar = /*@__PURE__*/ r({
+var BalNavMetaBar = /*@__PURE__*/ createComponent({
     tagName: 'bal-nav-meta-bar',
     elementClass: BalNavMetaBar$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$15
+    defineCustomElement: defineCustomElement$16
 });
-var BalNavbar = /*@__PURE__*/ r({
+var BalNavbar = /*@__PURE__*/ createComponent({
     tagName: 'bal-navbar',
     elementClass: BalNavbar$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$16
+    defineCustomElement: defineCustomElement$17
 });
-var BalNavbarBrand = /*@__PURE__*/ r({
+var BalNavbarBrand = /*@__PURE__*/ createComponent({
     tagName: 'bal-navbar-brand',
     elementClass: BalNavbarBrand$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -1023,49 +812,49 @@ var BalNavbarBrand = /*@__PURE__*/ r({
         onBalWillAnimate: 'balWillAnimate',
         onBalDidAnimate: 'balDidAnimate'
     },
-    defineCustomElement: defineCustomElement$17
+    defineCustomElement: defineCustomElement$18
 });
-var BalNavbarMenu = /*@__PURE__*/ r({
+var BalNavbarMenu = /*@__PURE__*/ createComponent({
     tagName: 'bal-navbar-menu',
     elementClass: BalNavbarMenu$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$18
+    defineCustomElement: defineCustomElement$19
 });
-var BalNavbarMenuEnd = /*@__PURE__*/ r({
+var BalNavbarMenuEnd = /*@__PURE__*/ createComponent({
     tagName: 'bal-navbar-menu-end',
     elementClass: BalNavbarMenuEnd$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$19
+    defineCustomElement: defineCustomElement$1a
 });
-var BalNavbarMenuStart = /*@__PURE__*/ r({
+var BalNavbarMenuStart = /*@__PURE__*/ createComponent({
     tagName: 'bal-navbar-menu-start',
     elementClass: BalNavbarMenuStart$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1a
+    defineCustomElement: defineCustomElement$1b
 });
-var BalNotices = /*@__PURE__*/ r({
+var BalNotices = /*@__PURE__*/ createComponent({
     tagName: 'bal-notices',
     elementClass: BalNotices$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1b
+    defineCustomElement: defineCustomElement$1c
 });
-var BalNotification = /*@__PURE__*/ r({
+var BalNotification = /*@__PURE__*/ createComponent({
     tagName: 'bal-notification',
     elementClass: BalNotification$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1c
+    defineCustomElement: defineCustomElement$1d
 });
-var BalNumberInput = /*@__PURE__*/ r({
+var BalNumberInput = /*@__PURE__*/ createComponent({
     tagName: 'bal-number-input',
     elementClass: BalNumberInput$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -1077,9 +866,9 @@ var BalNumberInput = /*@__PURE__*/ r({
         onBalFocus: 'balFocus',
         onBalKeyPress: 'balKeyPress'
     },
-    defineCustomElement: defineCustomElement$1d
+    defineCustomElement: defineCustomElement$1e
 });
-var BalOption = /*@__PURE__*/ r({
+var BalOption = /*@__PURE__*/ createComponent({
     tagName: 'bal-option',
     elementClass: BalOption$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -1087,17 +876,17 @@ var BalOption = /*@__PURE__*/ r({
     events: {
         onBalOptionChange: 'balOptionChange'
     },
-    defineCustomElement: defineCustomElement$1e
+    defineCustomElement: defineCustomElement$1f
 });
-var BalOptionList = /*@__PURE__*/ r({
+var BalOptionList = /*@__PURE__*/ createComponent({
     tagName: 'bal-option-list',
     elementClass: BalOptionList$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1f
+    defineCustomElement: defineCustomElement$1g
 });
-var BalPagination = /*@__PURE__*/ r({
+var BalPagination = /*@__PURE__*/ createComponent({
     tagName: 'bal-pagination',
     elementClass: BalPagination$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -1105,9 +894,9 @@ var BalPagination = /*@__PURE__*/ r({
     events: {
         onBalChange: 'balChange'
     },
-    defineCustomElement: defineCustomElement$1g
+    defineCustomElement: defineCustomElement$1h
 });
-var BalPopover = /*@__PURE__*/ r({
+var BalPopover = /*@__PURE__*/ createComponent({
     tagName: 'bal-popover',
     elementClass: BalPopover$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -1117,17 +906,17 @@ var BalPopover = /*@__PURE__*/ r({
         onBalWillAnimate: 'balWillAnimate',
         onBalDidAnimate: 'balDidAnimate'
     },
-    defineCustomElement: defineCustomElement$1h
+    defineCustomElement: defineCustomElement$1i
 });
-var BalPopoverContent = /*@__PURE__*/ r({
+var BalPopoverContent = /*@__PURE__*/ createComponent({
     tagName: 'bal-popover-content',
     elementClass: BalPopoverContent$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1i
+    defineCustomElement: defineCustomElement$1j
 });
-var BalPopup = /*@__PURE__*/ r({
+var BalPopup = /*@__PURE__*/ createComponent({
     tagName: 'bal-popup',
     elementClass: BalPopup$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -1137,17 +926,17 @@ var BalPopup = /*@__PURE__*/ r({
         onBalWillAnimate: 'balWillAnimate',
         onBalDidAnimate: 'balDidAnimate'
     },
-    defineCustomElement: defineCustomElement$1j
+    defineCustomElement: defineCustomElement$1k
 });
-var BalProgressBar = /*@__PURE__*/ r({
+var BalProgressBar = /*@__PURE__*/ createComponent({
     tagName: 'bal-progress-bar',
     elementClass: BalProgressBar$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1k
+    defineCustomElement: defineCustomElement$1l
 });
-var BalRadio = /*@__PURE__*/ r({
+var BalRadio = /*@__PURE__*/ createComponent({
     tagName: 'bal-radio',
     elementClass: BalRadio$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -1157,9 +946,9 @@ var BalRadio = /*@__PURE__*/ r({
         onBalBlur: 'balBlur',
         onBalChange: 'balChange'
     },
-    defineCustomElement: defineCustomElement$1l
+    defineCustomElement: defineCustomElement$1m
 });
-var BalRadioGroup = /*@__PURE__*/ r({
+var BalRadioGroup = /*@__PURE__*/ createComponent({
     tagName: 'bal-radio-group',
     elementClass: BalRadioGroup$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -1169,17 +958,17 @@ var BalRadioGroup = /*@__PURE__*/ r({
         onBalFocus: 'balFocus',
         onBalBlur: 'balBlur'
     },
-    defineCustomElement: defineCustomElement$1m
+    defineCustomElement: defineCustomElement$1n
 });
-var BalRadioIcon = /*@__PURE__*/ r({
+var BalRadioIcon = /*@__PURE__*/ createComponent({
     tagName: 'bal-radio-icon',
     elementClass: BalRadioIcon$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1n
+    defineCustomElement: defineCustomElement$1o
 });
-var BalSegment = /*@__PURE__*/ r({
+var BalSegment = /*@__PURE__*/ createComponent({
     tagName: 'bal-segment',
     elementClass: BalSegment$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -1189,17 +978,17 @@ var BalSegment = /*@__PURE__*/ r({
         onBalBlur: 'balBlur',
         onBalChange: 'balChange'
     },
-    defineCustomElement: defineCustomElement$1o
+    defineCustomElement: defineCustomElement$1p
 });
-var BalSegmentItem = /*@__PURE__*/ r({
+var BalSegmentItem = /*@__PURE__*/ createComponent({
     tagName: 'bal-segment-item',
     elementClass: BalSegmentItem$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1p
+    defineCustomElement: defineCustomElement$1q
 });
-var BalSelect = /*@__PURE__*/ r({
+var BalSelect = /*@__PURE__*/ createComponent({
     tagName: 'bal-select',
     elementClass: BalSelect$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -1213,33 +1002,33 @@ var BalSelect = /*@__PURE__*/ r({
         onBalCancel: 'balCancel',
         onBalKeyPress: 'balKeyPress'
     },
-    defineCustomElement: defineCustomElement$1q
+    defineCustomElement: defineCustomElement$1r
 });
-var BalSelectOption = /*@__PURE__*/ r({
+var BalSelectOption = /*@__PURE__*/ createComponent({
     tagName: 'bal-select-option',
     elementClass: BalSelectOption$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1r
+    defineCustomElement: defineCustomElement$1s
 });
-var BalShape = /*@__PURE__*/ r({
+var BalShape = /*@__PURE__*/ createComponent({
     tagName: 'bal-shape',
     elementClass: BalShape$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1s
+    defineCustomElement: defineCustomElement$1t
 });
-var BalSheet = /*@__PURE__*/ r({
+var BalSheet = /*@__PURE__*/ createComponent({
     tagName: 'bal-sheet',
     elementClass: BalSheet$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1t
+    defineCustomElement: defineCustomElement$1u
 });
-var BalSnackbar = /*@__PURE__*/ r({
+var BalSnackbar = /*@__PURE__*/ createComponent({
     tagName: 'bal-snackbar',
     elementClass: BalSnackbar$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -1248,73 +1037,73 @@ var BalSnackbar = /*@__PURE__*/ r({
         onBalClose: 'balClose',
         onBalAction: 'balAction'
     },
-    defineCustomElement: defineCustomElement$1u
+    defineCustomElement: defineCustomElement$1v
 });
-var BalSpinner = /*@__PURE__*/ r({
+var BalSpinner = /*@__PURE__*/ createComponent({
     tagName: 'bal-spinner',
     elementClass: BalSpinner$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1v
+    defineCustomElement: defineCustomElement$1w
 });
-var BalStack = /*@__PURE__*/ r({
+var BalStack = /*@__PURE__*/ createComponent({
     tagName: 'bal-stack',
     elementClass: BalStack$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1w
+    defineCustomElement: defineCustomElement$1x
 });
-var BalStage = /*@__PURE__*/ r({
+var BalStage = /*@__PURE__*/ createComponent({
     tagName: 'bal-stage',
     elementClass: BalStage$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1x
+    defineCustomElement: defineCustomElement$1y
 });
-var BalStageBackLink = /*@__PURE__*/ r({
+var BalStageBackLink = /*@__PURE__*/ createComponent({
     tagName: 'bal-stage-back-link',
     elementClass: BalStageBackLink$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1y
+    defineCustomElement: defineCustomElement$1z
 });
-var BalStageBody = /*@__PURE__*/ r({
+var BalStageBody = /*@__PURE__*/ createComponent({
     tagName: 'bal-stage-body',
     elementClass: BalStageBody$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1z
+    defineCustomElement: defineCustomElement$1A
 });
-var BalStageFoot = /*@__PURE__*/ r({
+var BalStageFoot = /*@__PURE__*/ createComponent({
     tagName: 'bal-stage-foot',
     elementClass: BalStageFoot$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1A
+    defineCustomElement: defineCustomElement$1B
 });
-var BalStageHead = /*@__PURE__*/ r({
+var BalStageHead = /*@__PURE__*/ createComponent({
     tagName: 'bal-stage-head',
     elementClass: BalStageHead$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1B
+    defineCustomElement: defineCustomElement$1C
 });
-var BalStageImage = /*@__PURE__*/ r({
+var BalStageImage = /*@__PURE__*/ createComponent({
     tagName: 'bal-stage-image',
     elementClass: BalStageImage$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1C
+    defineCustomElement: defineCustomElement$1D
 });
-var BalStepItem = /*@__PURE__*/ r({
+var BalStepItem = /*@__PURE__*/ createComponent({
     tagName: 'bal-step-item',
     elementClass: BalStepItem$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -1322,9 +1111,9 @@ var BalStepItem = /*@__PURE__*/ r({
     events: {
         onBalNavigate: 'balNavigate'
     },
-    defineCustomElement: defineCustomElement$1D
+    defineCustomElement: defineCustomElement$1E
 });
-var BalSteps = /*@__PURE__*/ r({
+var BalSteps = /*@__PURE__*/ createComponent({
     tagName: 'bal-steps',
     elementClass: BalSteps$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -1332,35 +1121,36 @@ var BalSteps = /*@__PURE__*/ r({
     events: {
         onBalChange: 'balChange'
     },
-    defineCustomElement: defineCustomElement$1E
+    defineCustomElement: defineCustomElement$1F
 });
-var BalSwitch = /*@__PURE__*/ r({
+var BalSwitch = /*@__PURE__*/ createComponent({
     tagName: 'bal-switch',
     elementClass: BalSwitch$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1F
+    defineCustomElement: defineCustomElement$1G
 });
-var BalTabItem = /*@__PURE__*/ r({
+var BalTabItem = /*@__PURE__*/ createComponent({
     tagName: 'bal-tab-item',
     elementClass: BalTabItem$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {
-        onBalNavigate: 'balNavigate'
+        onBalNavigate: 'balNavigate',
+        onBalKeyDown: 'balKeyDown'
     },
-    defineCustomElement: defineCustomElement$1G
+    defineCustomElement: defineCustomElement$1H
 });
-var BalTable = /*@__PURE__*/ r({
+var BalTable = /*@__PURE__*/ createComponent({
     tagName: 'bal-table',
     elementClass: BalTable$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1H
+    defineCustomElement: defineCustomElement$1I
 });
-var BalTabs = /*@__PURE__*/ r({
+var BalTabs = /*@__PURE__*/ createComponent({
     tagName: 'bal-tabs',
     elementClass: BalTabs$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -1370,9 +1160,9 @@ var BalTabs = /*@__PURE__*/ r({
         onBalWillAnimate: 'balWillAnimate',
         onBalDidAnimate: 'balDidAnimate'
     },
-    defineCustomElement: defineCustomElement$1I
+    defineCustomElement: defineCustomElement$1J
 });
-var BalTag = /*@__PURE__*/ r({
+var BalTag = /*@__PURE__*/ createComponent({
     tagName: 'bal-tag',
     elementClass: BalTag$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -1380,25 +1170,25 @@ var BalTag = /*@__PURE__*/ r({
     events: {
         onBalCloseClick: 'balCloseClick'
     },
-    defineCustomElement: defineCustomElement$1J
+    defineCustomElement: defineCustomElement$1K
 });
-var BalTagGroup = /*@__PURE__*/ r({
+var BalTagGroup = /*@__PURE__*/ createComponent({
     tagName: 'bal-tag-group',
     elementClass: BalTagGroup$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1K
+    defineCustomElement: defineCustomElement$1L
 });
-var BalText = /*@__PURE__*/ r({
+var BalText = /*@__PURE__*/ createComponent({
     tagName: 'bal-text',
     elementClass: BalText$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
     events: {},
-    defineCustomElement: defineCustomElement$1L
+    defineCustomElement: defineCustomElement$1M
 });
-var BalTextarea = /*@__PURE__*/ r({
+var BalTextarea = /*@__PURE__*/ createComponent({
     tagName: 'bal-textarea',
     elementClass: BalTextarea$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -1410,9 +1200,9 @@ var BalTextarea = /*@__PURE__*/ r({
         onBalKeyPress: 'balKeyPress',
         onBalFocus: 'balFocus'
     },
-    defineCustomElement: defineCustomElement$1M
+    defineCustomElement: defineCustomElement$1N
 });
-var BalTimeInput = /*@__PURE__*/ r({
+var BalTimeInput = /*@__PURE__*/ createComponent({
     tagName: 'bal-time-input',
     elementClass: BalTimeInput$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -1425,9 +1215,9 @@ var BalTimeInput = /*@__PURE__*/ r({
         onBalKeyPress: 'balKeyPress',
         onBalClick: 'balClick'
     },
-    defineCustomElement: defineCustomElement$1N
+    defineCustomElement: defineCustomElement$1O
 });
-var BalToast = /*@__PURE__*/ r({
+var BalToast = /*@__PURE__*/ createComponent({
     tagName: 'bal-toast',
     elementClass: BalToast$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -1435,9 +1225,9 @@ var BalToast = /*@__PURE__*/ r({
     events: {
         onBalClose: 'balClose'
     },
-    defineCustomElement: defineCustomElement$1O
+    defineCustomElement: defineCustomElement$1P
 });
-var BalTooltip = /*@__PURE__*/ r({
+var BalTooltip = /*@__PURE__*/ createComponent({
     tagName: 'bal-tooltip',
     elementClass: BalTooltip$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -1446,7 +1236,7 @@ var BalTooltip = /*@__PURE__*/ r({
         onBalWillAnimate: 'balWillAnimate',
         onBalDidAnimate: 'balDidAnimate'
     },
-    defineCustomElement: defineCustomElement$1P
+    defineCustomElement: defineCustomElement$1Q
 });
 var useBaloiseDesignSystem = function(config) {