@ionic/vue 8.8.6-dev.11777928681.1e4919af → 8.8.6-dev.11778015413.1dc85fcb

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 (56) hide show
  1. package/css/core.css +1 -1
  2. package/css/core.css.map +1 -1
  3. package/css/display.css +1 -1
  4. package/css/display.css.map +1 -1
  5. package/css/flex-utils.css +1 -1
  6. package/css/flex-utils.css.map +1 -1
  7. package/css/float-elements.css.map +1 -1
  8. package/css/global.bundle.css.map +1 -1
  9. package/css/ionic-swiper.css +1 -1
  10. package/css/ionic-swiper.css.map +1 -1
  11. package/css/ionic.bundle.css +1 -1
  12. package/css/ionic.bundle.css.map +1 -1
  13. package/css/normalize.css.map +1 -1
  14. package/css/padding.css.map +1 -1
  15. package/css/palettes/dark.always.css.map +1 -1
  16. package/css/palettes/dark.class.css.map +1 -1
  17. package/css/palettes/dark.system.css.map +1 -1
  18. package/css/palettes/high-contrast-dark.always.css.map +1 -1
  19. package/css/palettes/high-contrast-dark.class.css.map +1 -1
  20. package/css/palettes/high-contrast-dark.system.css.map +1 -1
  21. package/css/palettes/high-contrast.always.css.map +1 -1
  22. package/css/palettes/high-contrast.class.css.map +1 -1
  23. package/css/palettes/high-contrast.system.css.map +1 -1
  24. package/css/structure.css.map +1 -1
  25. package/css/text-alignment.css.map +1 -1
  26. package/css/text-transformation.css.map +1 -1
  27. package/css/typography.css.map +1 -1
  28. package/css/utils.bundle.css +1 -1
  29. package/css/utils.bundle.css.map +1 -1
  30. package/dist/index.js +213 -235
  31. package/dist/index.js.map +1 -1
  32. package/dist/types/components/IonRouterOutlet.d.ts +14 -2
  33. package/dist/types/components/Overlays.d.ts +0 -1
  34. package/dist/types/controllers.d.ts +1 -9
  35. package/dist/types/index.d.ts +2 -2
  36. package/dist/types/proxies.d.ts +0 -1
  37. package/dist/vetur/attributes.json +106 -1642
  38. package/dist/vetur/tags.json +45 -248
  39. package/dist/web-types.json +150 -1879
  40. package/package.json +3 -3
  41. package/css/ionic/bundle.ionic.css +0 -1
  42. package/css/ionic/bundle.ionic.css.map +0 -1
  43. package/css/ionic/core.ionic.css +0 -1
  44. package/css/ionic/core.ionic.css.map +0 -1
  45. package/css/ionic/global.bundle.ionic.css +0 -1
  46. package/css/ionic/global.bundle.ionic.css.map +0 -1
  47. package/css/ionic/ionic-swiper.ionic.css +0 -1
  48. package/css/ionic/ionic-swiper.ionic.css.map +0 -1
  49. package/css/ionic/link.ionic.css +0 -1
  50. package/css/ionic/link.ionic.css.map +0 -1
  51. package/css/ionic/structure.ionic.css +0 -1
  52. package/css/ionic/structure.ionic.css.map +0 -1
  53. package/css/ionic/typography.ionic.css +0 -1
  54. package/css/ionic/typography.ionic.css.map +0 -1
  55. package/css/ionic/utils.bundle.ionic.css +0 -1
  56. package/css/ionic/utils.bundle.ionic.css.map +0 -1
package/dist/index.js CHANGED
@@ -19,82 +19,80 @@ import { defineCustomElement as defineCustomElement$g } from '@ionic/core/compon
19
19
  import { defineCustomElement as defineCustomElement$h } from '@ionic/core/components/ion-content.js';
20
20
  import { defineCustomElement as defineCustomElement$i } from '@ionic/core/components/ion-datetime.js';
21
21
  import { defineCustomElement as defineCustomElement$j } from '@ionic/core/components/ion-datetime-button.js';
22
- import { defineCustomElement as defineCustomElement$k } from '@ionic/core/components/ion-divider.js';
23
- import { defineCustomElement as defineCustomElement$l } from '@ionic/core/components/ion-fab.js';
24
- import { defineCustomElement as defineCustomElement$m } from '@ionic/core/components/ion-fab-button.js';
25
- import { defineCustomElement as defineCustomElement$n } from '@ionic/core/components/ion-fab-list.js';
26
- import { defineCustomElement as defineCustomElement$o } from '@ionic/core/components/ion-footer.js';
27
- import { defineCustomElement as defineCustomElement$p } from '@ionic/core/components/ion-grid.js';
28
- import { defineCustomElement as defineCustomElement$q } from '@ionic/core/components/ion-header.js';
29
- import { defineCustomElement as defineCustomElement$r } from '@ionic/core/components/ion-img.js';
30
- import { defineCustomElement as defineCustomElement$s } from '@ionic/core/components/ion-infinite-scroll.js';
31
- import { defineCustomElement as defineCustomElement$t } from '@ionic/core/components/ion-infinite-scroll-content.js';
32
- import { defineCustomElement as defineCustomElement$u } from '@ionic/core/components/ion-input.js';
33
- import { defineCustomElement as defineCustomElement$v } from '@ionic/core/components/ion-input-otp.js';
34
- import { defineCustomElement as defineCustomElement$w } from '@ionic/core/components/ion-input-password-toggle.js';
35
- import { defineCustomElement as defineCustomElement$x } from '@ionic/core/components/ion-item.js';
36
- import { defineCustomElement as defineCustomElement$y } from '@ionic/core/components/ion-item-divider.js';
37
- import { defineCustomElement as defineCustomElement$z } from '@ionic/core/components/ion-item-group.js';
38
- import { defineCustomElement as defineCustomElement$A } from '@ionic/core/components/ion-item-option.js';
39
- import { defineCustomElement as defineCustomElement$B } from '@ionic/core/components/ion-item-options.js';
40
- import { defineCustomElement as defineCustomElement$C } from '@ionic/core/components/ion-item-sliding.js';
41
- import { defineCustomElement as defineCustomElement$D } from '@ionic/core/components/ion-label.js';
42
- import { defineCustomElement as defineCustomElement$E } from '@ionic/core/components/ion-list.js';
43
- import { defineCustomElement as defineCustomElement$F } from '@ionic/core/components/ion-list-header.js';
44
- import { defineCustomElement as defineCustomElement$G } from '@ionic/core/components/ion-menu.js';
45
- import { defineCustomElement as defineCustomElement$H } from '@ionic/core/components/ion-menu-button.js';
46
- import { defineCustomElement as defineCustomElement$I } from '@ionic/core/components/ion-menu-toggle.js';
47
- import { defineCustomElement as defineCustomElement$1k } from '@ionic/core/components/ion-nav.js';
48
- import { defineCustomElement as defineCustomElement$J } from '@ionic/core/components/ion-nav-link.js';
49
- import { defineCustomElement as defineCustomElement$K } from '@ionic/core/components/ion-note.js';
50
- import { defineCustomElement as defineCustomElement$L } from '@ionic/core/components/ion-picker.js';
51
- import { defineCustomElement as defineCustomElement$M } from '@ionic/core/components/ion-picker-column.js';
52
- import { defineCustomElement as defineCustomElement$N } from '@ionic/core/components/ion-picker-column-option.js';
53
- import { defineCustomElement as defineCustomElement$O } from '@ionic/core/components/ion-progress-bar.js';
54
- import { defineCustomElement as defineCustomElement$P } from '@ionic/core/components/ion-radio.js';
55
- import { defineCustomElement as defineCustomElement$Q } from '@ionic/core/components/ion-radio-group.js';
56
- import { defineCustomElement as defineCustomElement$R } from '@ionic/core/components/ion-range.js';
57
- import { defineCustomElement as defineCustomElement$S } from '@ionic/core/components/ion-refresher.js';
58
- import { defineCustomElement as defineCustomElement$T } from '@ionic/core/components/ion-refresher-content.js';
59
- import { defineCustomElement as defineCustomElement$U } from '@ionic/core/components/ion-reorder.js';
60
- import { defineCustomElement as defineCustomElement$V } from '@ionic/core/components/ion-reorder-group.js';
61
- import { defineCustomElement as defineCustomElement$W } from '@ionic/core/components/ion-ripple-effect.js';
62
- import { defineCustomElement as defineCustomElement$X } from '@ionic/core/components/ion-row.js';
63
- import { defineCustomElement as defineCustomElement$Y } from '@ionic/core/components/ion-searchbar.js';
64
- import { defineCustomElement as defineCustomElement$Z } from '@ionic/core/components/ion-segment.js';
65
- import { defineCustomElement as defineCustomElement$_ } from '@ionic/core/components/ion-segment-button.js';
66
- import { defineCustomElement as defineCustomElement$$ } from '@ionic/core/components/ion-segment-content.js';
67
- import { defineCustomElement as defineCustomElement$10 } from '@ionic/core/components/ion-segment-view.js';
68
- import { defineCustomElement as defineCustomElement$11 } from '@ionic/core/components/ion-select.js';
69
- import { defineCustomElement as defineCustomElement$12 } from '@ionic/core/components/ion-select-modal.js';
70
- import { defineCustomElement as defineCustomElement$13 } from '@ionic/core/components/ion-select-option.js';
71
- import { defineCustomElement as defineCustomElement$14 } from '@ionic/core/components/ion-skeleton-text.js';
72
- import { defineCustomElement as defineCustomElement$15 } from '@ionic/core/components/ion-spinner.js';
73
- import { defineCustomElement as defineCustomElement$16 } from '@ionic/core/components/ion-split-pane.js';
74
- import { defineCustomElement as defineCustomElement$17 } from '@ionic/core/components/ion-tab.js';
75
- import { defineCustomElement as defineCustomElement$18 } from '@ionic/core/components/ion-text.js';
76
- import { defineCustomElement as defineCustomElement$19 } from '@ionic/core/components/ion-textarea.js';
77
- import { defineCustomElement as defineCustomElement$1a } from '@ionic/core/components/ion-thumbnail.js';
78
- import { defineCustomElement as defineCustomElement$1b } from '@ionic/core/components/ion-title.js';
79
- import { defineCustomElement as defineCustomElement$1c } from '@ionic/core/components/ion-toggle.js';
80
- import { defineCustomElement as defineCustomElement$1d } from '@ionic/core/components/ion-toolbar.js';
81
- import { LIFECYCLE_WILL_ENTER, LIFECYCLE_DID_ENTER, LIFECYCLE_WILL_LEAVE, LIFECYCLE_DID_LEAVE, initialize, modalController as modalController$1, popoverController as popoverController$1, alertController as alertController$1, actionSheetController as actionSheetController$1, loadingController as loadingController$1, pickerController as pickerController$1, toastController as toastController$1 } from '@ionic/core/components';
22
+ import { defineCustomElement as defineCustomElement$k } from '@ionic/core/components/ion-fab.js';
23
+ import { defineCustomElement as defineCustomElement$l } from '@ionic/core/components/ion-fab-button.js';
24
+ import { defineCustomElement as defineCustomElement$m } from '@ionic/core/components/ion-fab-list.js';
25
+ import { defineCustomElement as defineCustomElement$n } from '@ionic/core/components/ion-footer.js';
26
+ import { defineCustomElement as defineCustomElement$o } from '@ionic/core/components/ion-grid.js';
27
+ import { defineCustomElement as defineCustomElement$p } from '@ionic/core/components/ion-header.js';
28
+ import { defineCustomElement as defineCustomElement$q } from '@ionic/core/components/ion-img.js';
29
+ import { defineCustomElement as defineCustomElement$r } from '@ionic/core/components/ion-infinite-scroll.js';
30
+ import { defineCustomElement as defineCustomElement$s } from '@ionic/core/components/ion-infinite-scroll-content.js';
31
+ import { defineCustomElement as defineCustomElement$t } from '@ionic/core/components/ion-input.js';
32
+ import { defineCustomElement as defineCustomElement$u } from '@ionic/core/components/ion-input-otp.js';
33
+ import { defineCustomElement as defineCustomElement$v } from '@ionic/core/components/ion-input-password-toggle.js';
34
+ import { defineCustomElement as defineCustomElement$w } from '@ionic/core/components/ion-item.js';
35
+ import { defineCustomElement as defineCustomElement$x } from '@ionic/core/components/ion-item-divider.js';
36
+ import { defineCustomElement as defineCustomElement$y } from '@ionic/core/components/ion-item-group.js';
37
+ import { defineCustomElement as defineCustomElement$z } from '@ionic/core/components/ion-item-option.js';
38
+ import { defineCustomElement as defineCustomElement$A } from '@ionic/core/components/ion-item-options.js';
39
+ import { defineCustomElement as defineCustomElement$B } from '@ionic/core/components/ion-item-sliding.js';
40
+ import { defineCustomElement as defineCustomElement$C } from '@ionic/core/components/ion-label.js';
41
+ import { defineCustomElement as defineCustomElement$D } from '@ionic/core/components/ion-list.js';
42
+ import { defineCustomElement as defineCustomElement$E } from '@ionic/core/components/ion-list-header.js';
43
+ import { defineCustomElement as defineCustomElement$F } from '@ionic/core/components/ion-menu.js';
44
+ import { defineCustomElement as defineCustomElement$G } from '@ionic/core/components/ion-menu-button.js';
45
+ import { defineCustomElement as defineCustomElement$H } from '@ionic/core/components/ion-menu-toggle.js';
46
+ import { defineCustomElement as defineCustomElement$1j } from '@ionic/core/components/ion-nav.js';
47
+ import { defineCustomElement as defineCustomElement$I } from '@ionic/core/components/ion-nav-link.js';
48
+ import { defineCustomElement as defineCustomElement$J } from '@ionic/core/components/ion-note.js';
49
+ import { defineCustomElement as defineCustomElement$K } from '@ionic/core/components/ion-picker.js';
50
+ import { defineCustomElement as defineCustomElement$L } from '@ionic/core/components/ion-picker-column.js';
51
+ import { defineCustomElement as defineCustomElement$M } from '@ionic/core/components/ion-picker-column-option.js';
52
+ import { defineCustomElement as defineCustomElement$N } from '@ionic/core/components/ion-progress-bar.js';
53
+ import { defineCustomElement as defineCustomElement$O } from '@ionic/core/components/ion-radio.js';
54
+ import { defineCustomElement as defineCustomElement$P } from '@ionic/core/components/ion-radio-group.js';
55
+ import { defineCustomElement as defineCustomElement$Q } from '@ionic/core/components/ion-range.js';
56
+ import { defineCustomElement as defineCustomElement$R } from '@ionic/core/components/ion-refresher.js';
57
+ import { defineCustomElement as defineCustomElement$S } from '@ionic/core/components/ion-refresher-content.js';
58
+ import { defineCustomElement as defineCustomElement$T } from '@ionic/core/components/ion-reorder.js';
59
+ import { defineCustomElement as defineCustomElement$U } from '@ionic/core/components/ion-reorder-group.js';
60
+ import { defineCustomElement as defineCustomElement$V } from '@ionic/core/components/ion-ripple-effect.js';
61
+ import { defineCustomElement as defineCustomElement$W } from '@ionic/core/components/ion-row.js';
62
+ import { defineCustomElement as defineCustomElement$X } from '@ionic/core/components/ion-searchbar.js';
63
+ import { defineCustomElement as defineCustomElement$Y } from '@ionic/core/components/ion-segment.js';
64
+ import { defineCustomElement as defineCustomElement$Z } from '@ionic/core/components/ion-segment-button.js';
65
+ import { defineCustomElement as defineCustomElement$_ } from '@ionic/core/components/ion-segment-content.js';
66
+ import { defineCustomElement as defineCustomElement$$ } from '@ionic/core/components/ion-segment-view.js';
67
+ import { defineCustomElement as defineCustomElement$10 } from '@ionic/core/components/ion-select.js';
68
+ import { defineCustomElement as defineCustomElement$11 } from '@ionic/core/components/ion-select-modal.js';
69
+ import { defineCustomElement as defineCustomElement$12 } from '@ionic/core/components/ion-select-option.js';
70
+ import { defineCustomElement as defineCustomElement$13 } from '@ionic/core/components/ion-skeleton-text.js';
71
+ import { defineCustomElement as defineCustomElement$14 } from '@ionic/core/components/ion-spinner.js';
72
+ import { defineCustomElement as defineCustomElement$15 } from '@ionic/core/components/ion-split-pane.js';
73
+ import { defineCustomElement as defineCustomElement$16 } from '@ionic/core/components/ion-tab.js';
74
+ import { defineCustomElement as defineCustomElement$17 } from '@ionic/core/components/ion-text.js';
75
+ import { defineCustomElement as defineCustomElement$18 } from '@ionic/core/components/ion-textarea.js';
76
+ import { defineCustomElement as defineCustomElement$19 } from '@ionic/core/components/ion-thumbnail.js';
77
+ import { defineCustomElement as defineCustomElement$1a } from '@ionic/core/components/ion-title.js';
78
+ import { defineCustomElement as defineCustomElement$1b } from '@ionic/core/components/ion-toggle.js';
79
+ import { defineCustomElement as defineCustomElement$1c } from '@ionic/core/components/ion-toolbar.js';
80
+ import { LIFECYCLE_WILL_ENTER, LIFECYCLE_DID_ENTER, LIFECYCLE_WILL_LEAVE, LIFECYCLE_DID_LEAVE, initialize, modalController as modalController$1, popoverController as popoverController$1, alertController as alertController$1, actionSheetController as actionSheetController$1, loadingController as loadingController$1, toastController as toastController$1 } from '@ionic/core/components';
82
81
  export { IonicSafeString, IonicSlides, createAnimation, createGesture, getIonPageElement, getPlatforms, getTimeGivenProgression, iosTransitionAnimation, isPlatform, mdTransitionAnimation, menuController, openURL } from '@ionic/core/components';
83
- import { defineCustomElement as defineCustomElement$1e } from '@ionic/core/components/ion-back-button.js';
84
- import { defineCustomElement as defineCustomElement$1f } from '@ionic/core/components/ion-router-outlet.js';
82
+ import { defineCustomElement as defineCustomElement$1d } from '@ionic/core/components/ion-back-button.js';
83
+ import { defineCustomElement as defineCustomElement$1e } from '@ionic/core/components/ion-router-outlet.js';
85
84
  import { routeLocationKey, useRoute, matchedRouteKey } from 'vue-router';
86
- import { defineCustomElement as defineCustomElement$1g } from '@ionic/core/components/ion-tab-button.js';
87
- import { defineCustomElement as defineCustomElement$1h } from '@ionic/core/components/ion-tabs.js';
88
- import { defineCustomElement as defineCustomElement$1i } from '@ionic/core/components/ion-tab-bar.js';
89
- import { defineCustomElement as defineCustomElement$1j } from '@ionic/core/components/ion-app.js';
90
- import { defineCustomElement as defineCustomElement$1l } from 'ionicons/components/ion-icon.js';
91
- import { defineCustomElement as defineCustomElement$1m } from '@ionic/core/components/ion-action-sheet.js';
92
- import { defineCustomElement as defineCustomElement$1n } from '@ionic/core/components/ion-alert.js';
93
- import { defineCustomElement as defineCustomElement$1o } from '@ionic/core/components/ion-loading.js';
94
- import { defineCustomElement as defineCustomElement$1p } from '@ionic/core/components/ion-modal.js';
95
- import { defineCustomElement as defineCustomElement$1q } from '@ionic/core/components/ion-picker-legacy.js';
96
- import { defineCustomElement as defineCustomElement$1r } from '@ionic/core/components/ion-popover.js';
97
- import { defineCustomElement as defineCustomElement$1s } from '@ionic/core/components/ion-toast.js';
85
+ import { defineCustomElement as defineCustomElement$1f } from '@ionic/core/components/ion-tab-button.js';
86
+ import { defineCustomElement as defineCustomElement$1g } from '@ionic/core/components/ion-tabs.js';
87
+ import { defineCustomElement as defineCustomElement$1h } from '@ionic/core/components/ion-tab-bar.js';
88
+ import { defineCustomElement as defineCustomElement$1i } from '@ionic/core/components/ion-app.js';
89
+ import { defineCustomElement as defineCustomElement$1k } from 'ionicons/components/ion-icon.js';
90
+ import { defineCustomElement as defineCustomElement$1l } from '@ionic/core/components/ion-action-sheet.js';
91
+ import { defineCustomElement as defineCustomElement$1m } from '@ionic/core/components/ion-alert.js';
92
+ import { defineCustomElement as defineCustomElement$1n } from '@ionic/core/components/ion-loading.js';
93
+ import { defineCustomElement as defineCustomElement$1o } from '@ionic/core/components/ion-modal.js';
94
+ import { defineCustomElement as defineCustomElement$1p } from '@ionic/core/components/ion-popover.js';
95
+ import { defineCustomElement as defineCustomElement$1q } from '@ionic/core/components/ion-toast.js';
98
96
 
99
97
  const UPDATE_VALUE_EVENT = 'update:modelValue';
100
98
  const MODEL_VALUE = 'modelValue';
@@ -116,8 +114,19 @@ const DEFAULT_EMPTY_PROP$1 = { default: EMPTY_PROP$1 };
116
114
  const getComponentClasses = (classes) => {
117
115
  return classes?.split(' ') || [];
118
116
  };
119
- const getElementClasses = (ref, componentClasses, defaultClasses = []) => {
120
- return [...Array.from(ref.value?.classList || []), ...defaultClasses].filter((c, i, self) => !componentClasses.has(c) && self.indexOf(c) === i);
117
+ const syncElementClasses = (ref, componentClasses, defaultClasses = []) => {
118
+ if (ref?.value) {
119
+ const element = ref.value;
120
+ // makes sure vue classes are on the actual element
121
+ componentClasses.forEach((c) => {
122
+ if (!!c && !element.classList.contains(c)) {
123
+ element.classList.add(c);
124
+ }
125
+ });
126
+ }
127
+ return [...Array.from(ref.value?.classList || []), ...defaultClasses].filter((c, i, self) => {
128
+ return !componentClasses.has(c) && self.indexOf(c) === i;
129
+ });
121
130
  };
122
131
  /**
123
132
  * Create a callback to define a Vue component wrapper around a Web Component.
@@ -133,8 +142,9 @@ const getElementClasses = (ref, componentClasses, defaultClasses = []) => {
133
142
  * to customElements.define. Only set if `includeImportCustomElements: true` in your config.
134
143
  * @prop modelProp - The prop that v-model binds to (i.e. value)
135
144
  * @prop modelUpdateEvent - The event that is fired from your Web Component when the value changes (i.e. ionChange)
145
+ * @prop modelUpdateEventAttribute - Property to read value from when the value changes.
136
146
  */
137
- const defineContainer = (name, defineCustomElement, componentProps = [], emitProps = [], modelProp, modelUpdateEvent) => {
147
+ const defineContainer = (name, defineCustomElement, componentProps = [], emitProps = [], modelProp, modelUpdateEvent, modelUpdateEventAttribute, transformTagFn) => {
138
148
  /**
139
149
  * Create a Vue component wrapper around a Web Component.
140
150
  * Note: The `props` here are not all properties on a component.
@@ -179,7 +189,7 @@ const defineContainer = (name, defineCustomElement, componentProps = [], emitPro
179
189
  */
180
190
  const vModelDirective = {
181
191
  created: (el) => {
182
- const eventsNames = (Array.isArray(modelUpdateEvent) ? modelUpdateEvent : [modelUpdateEvent]).map((ev) => ev.replace(/-([a-z])/g, (g) => g[1].toUpperCase()));
192
+ const eventsNames = Array.isArray(modelUpdateEvent) ? modelUpdateEvent : [modelUpdateEvent];
183
193
  eventsNames.forEach((eventName) => {
184
194
  el.addEventListener(eventName, (e) => {
185
195
  /**
@@ -190,7 +200,11 @@ const defineContainer = (name, defineCustomElement, componentProps = [], emitPro
190
200
  * when ionChange bubbles up from Component B.
191
201
  */
192
202
  if (e.target.tagName === el.tagName && modelProp) {
193
- modelPropValue = (e?.target)[modelProp];
203
+ const resolvePath = (object, path) => {
204
+ return path.split('.').reduce((value, key) => (value !== undefined ? value[key] : undefined), object);
205
+ };
206
+ const path = (modelUpdateEventAttribute ?? `target.${modelProp}`);
207
+ const modelPropValue = resolvePath(e, path);
194
208
  emit(UPDATE_VALUE_EVENT, modelPropValue);
195
209
  }
196
210
  });
@@ -244,7 +258,7 @@ const defineContainer = (name, defineCustomElement, componentProps = [], emitPro
244
258
  };
245
259
  const propsToAdd = {
246
260
  ref: containerRef,
247
- class: getElementClasses(containerRef, classes),
261
+ class: syncElementClasses(containerRef, classes),
248
262
  onClick: handleClick,
249
263
  };
250
264
  /**
@@ -292,7 +306,8 @@ const defineContainer = (name, defineCustomElement, componentProps = [], emitPro
292
306
  * vModelDirective is only needed on components that support v-model.
293
307
  * As a result, we conditionally call withDirectives with v-model components.
294
308
  */
295
- const node = h(name, propsToAdd, slots.default && slots.default());
309
+ const tagName = transformTagFn ? transformTagFn(name) : name;
310
+ const node = h(tagName, propsToAdd, slots.default && slots.default());
296
311
  return modelProp === undefined ? node : withDirectives(node, [[vModelDirective]]);
297
312
  };
298
313
  }, {
@@ -319,18 +334,13 @@ const IonAccordionGroup = /*@__PURE__*/ defineContainer('ion-accordion-group', d
319
334
  'disabled',
320
335
  'readonly',
321
336
  'expand',
322
- 'shape',
323
337
  'ionChange',
324
338
  'ionValueChange'
325
339
  ], [
326
340
  'ionChange',
327
341
  'ionValueChange'
328
- ], 'value', 'ion-change');
329
- const IonAvatar = /*@__PURE__*/ defineContainer('ion-avatar', defineCustomElement$2, [
330
- 'size',
331
- 'shape',
332
- 'disabled'
333
- ]);
342
+ ], 'value', 'ionChange', undefined);
343
+ const IonAvatar = /*@__PURE__*/ defineContainer('ion-avatar', defineCustomElement$2);
334
344
  const IonBackdrop = /*@__PURE__*/ defineContainer('ion-backdrop', defineCustomElement$3, [
335
345
  'visible',
336
346
  'tappable',
@@ -340,11 +350,7 @@ const IonBackdrop = /*@__PURE__*/ defineContainer('ion-backdrop', defineCustomEl
340
350
  'ionBackdropTap'
341
351
  ]);
342
352
  const IonBadge = /*@__PURE__*/ defineContainer('ion-badge', defineCustomElement$4, [
343
- 'color',
344
- 'hue',
345
- 'shape',
346
- 'size',
347
- 'vertical'
353
+ 'color'
348
354
  ]);
349
355
  const IonBreadcrumb = /*@__PURE__*/ defineContainer('ion-breadcrumb', defineCustomElement$5, [
350
356
  'collapsed',
@@ -413,7 +419,6 @@ const IonCard = /*@__PURE__*/ defineContainer('ion-card', defineCustomElement$9,
413
419
  'rel',
414
420
  'routerDirection',
415
421
  'routerAnimation',
416
- 'shape',
417
422
  'target'
418
423
  ]);
419
424
  const IonCardContent = /*@__PURE__*/ defineContainer('ion-card-content', defineCustomElement$a);
@@ -440,8 +445,6 @@ const IonCheckbox = /*@__PURE__*/ defineContainer('ion-checkbox', defineCustomEl
440
445
  'justify',
441
446
  'alignment',
442
447
  'required',
443
- 'shape',
444
- 'size',
445
448
  'ionChange',
446
449
  'ionFocus',
447
450
  'ionBlur'
@@ -449,14 +452,11 @@ const IonCheckbox = /*@__PURE__*/ defineContainer('ion-checkbox', defineCustomEl
449
452
  'ionChange',
450
453
  'ionFocus',
451
454
  'ionBlur'
452
- ], 'checked', 'ion-change');
455
+ ], 'checked', 'ionChange', undefined);
453
456
  const IonChip = /*@__PURE__*/ defineContainer('ion-chip', defineCustomElement$f, [
454
457
  'color',
455
458
  'outline',
456
- 'disabled',
457
- 'hue',
458
- 'shape',
459
- 'size'
459
+ 'disabled'
460
460
  ]);
461
461
  const IonCol = /*@__PURE__*/ defineContainer('ion-col', defineCustomElement$g, [
462
462
  'offset',
@@ -465,12 +465,6 @@ const IonCol = /*@__PURE__*/ defineContainer('ion-col', defineCustomElement$g, [
465
465
  'offsetMd',
466
466
  'offsetLg',
467
467
  'offsetXl',
468
- 'order',
469
- 'orderXs',
470
- 'orderSm',
471
- 'orderMd',
472
- 'orderLg',
473
- 'orderXl',
474
468
  'pull',
475
469
  'pullXs',
476
470
  'pullSm',
@@ -553,23 +547,19 @@ const IonDatetime = /*@__PURE__*/ defineContainer('ion-datetime', defineCustomEl
553
547
  'ionBlur',
554
548
  'ionStyle',
555
549
  'ionRender'
556
- ], 'value', 'ion-change');
550
+ ], 'value', 'ionChange', undefined);
557
551
  const IonDatetimeButton = /*@__PURE__*/ defineContainer('ion-datetime-button', defineCustomElement$j, [
558
552
  'color',
559
553
  'disabled',
560
554
  'datetime'
561
555
  ]);
562
- const IonDivider = /*@__PURE__*/ defineContainer('ion-divider', defineCustomElement$k, [
563
- 'spacing',
564
- 'inset'
565
- ]);
566
- const IonFab = /*@__PURE__*/ defineContainer('ion-fab', defineCustomElement$l, [
556
+ const IonFab = /*@__PURE__*/ defineContainer('ion-fab', defineCustomElement$k, [
567
557
  'horizontal',
568
558
  'vertical',
569
559
  'edge',
570
560
  'activated'
571
561
  ]);
572
- const IonFabButton = /*@__PURE__*/ defineContainer('ion-fab-button', defineCustomElement$m, [
562
+ const IonFabButton = /*@__PURE__*/ defineContainer('ion-fab-button', defineCustomElement$l, [
573
563
  'color',
574
564
  'activated',
575
565
  'disabled',
@@ -590,23 +580,22 @@ const IonFabButton = /*@__PURE__*/ defineContainer('ion-fab-button', defineCusto
590
580
  'ionFocus',
591
581
  'ionBlur'
592
582
  ]);
593
- const IonFabList = /*@__PURE__*/ defineContainer('ion-fab-list', defineCustomElement$n, [
583
+ const IonFabList = /*@__PURE__*/ defineContainer('ion-fab-list', defineCustomElement$m, [
594
584
  'activated',
595
585
  'side'
596
586
  ]);
597
- const IonFooter = /*@__PURE__*/ defineContainer('ion-footer', defineCustomElement$o, [
587
+ const IonFooter = /*@__PURE__*/ defineContainer('ion-footer', defineCustomElement$n, [
598
588
  'collapse',
599
589
  'translucent'
600
590
  ]);
601
- const IonGrid = /*@__PURE__*/ defineContainer('ion-grid', defineCustomElement$p, [
591
+ const IonGrid = /*@__PURE__*/ defineContainer('ion-grid', defineCustomElement$o, [
602
592
  'fixed'
603
593
  ]);
604
- const IonHeader = /*@__PURE__*/ defineContainer('ion-header', defineCustomElement$q, [
594
+ const IonHeader = /*@__PURE__*/ defineContainer('ion-header', defineCustomElement$p, [
605
595
  'collapse',
606
- 'divider',
607
596
  'translucent'
608
597
  ]);
609
- const IonImg = /*@__PURE__*/ defineContainer('ion-img', defineCustomElement$r, [
598
+ const IonImg = /*@__PURE__*/ defineContainer('ion-img', defineCustomElement$q, [
610
599
  'alt',
611
600
  'src',
612
601
  'ionImgWillLoad',
@@ -617,20 +606,19 @@ const IonImg = /*@__PURE__*/ defineContainer('ion-img', defineCustomElement$r, [
617
606
  'ionImgDidLoad',
618
607
  'ionError'
619
608
  ]);
620
- const IonInfiniteScroll = /*@__PURE__*/ defineContainer('ion-infinite-scroll', defineCustomElement$s, [
609
+ const IonInfiniteScroll = /*@__PURE__*/ defineContainer('ion-infinite-scroll', defineCustomElement$r, [
621
610
  'threshold',
622
611
  'disabled',
623
612
  'position',
624
- 'preserveRerenderScrollPosition',
625
613
  'ionInfinite'
626
614
  ], [
627
615
  'ionInfinite'
628
616
  ]);
629
- const IonInfiniteScrollContent = /*@__PURE__*/ defineContainer('ion-infinite-scroll-content', defineCustomElement$t, [
617
+ const IonInfiniteScrollContent = /*@__PURE__*/ defineContainer('ion-infinite-scroll-content', defineCustomElement$s, [
630
618
  'loadingSpinner',
631
619
  'loadingText'
632
620
  ]);
633
- const IonInput = /*@__PURE__*/ defineContainer('ion-input', defineCustomElement$u, [
621
+ const IonInput = /*@__PURE__*/ defineContainer('ion-input', defineCustomElement$t, [
634
622
  'color',
635
623
  'autocapitalize',
636
624
  'autocomplete',
@@ -663,7 +651,6 @@ const IonInput = /*@__PURE__*/ defineContainer('ion-input', defineCustomElement$
663
651
  'shape',
664
652
  'spellcheck',
665
653
  'step',
666
- 'size',
667
654
  'type',
668
655
  'value',
669
656
  'ionInput',
@@ -675,8 +662,8 @@ const IonInput = /*@__PURE__*/ defineContainer('ion-input', defineCustomElement$
675
662
  'ionChange',
676
663
  'ionBlur',
677
664
  'ionFocus'
678
- ], 'value', 'ion-input');
679
- const IonInputOtp = /*@__PURE__*/ defineContainer('ion-input-otp', defineCustomElement$v, [
665
+ ], 'value', 'ionInput', undefined);
666
+ const IonInputOtp = /*@__PURE__*/ defineContainer('ion-input-otp', defineCustomElement$u, [
680
667
  'autocapitalize',
681
668
  'color',
682
669
  'disabled',
@@ -701,14 +688,14 @@ const IonInputOtp = /*@__PURE__*/ defineContainer('ion-input-otp', defineCustomE
701
688
  'ionComplete',
702
689
  'ionBlur',
703
690
  'ionFocus'
704
- ], 'value', 'ion-input');
705
- const IonInputPasswordToggle = /*@__PURE__*/ defineContainer('ion-input-password-toggle', defineCustomElement$w, [
691
+ ], 'value', 'ionInput', undefined);
692
+ const IonInputPasswordToggle = /*@__PURE__*/ defineContainer('ion-input-password-toggle', defineCustomElement$v, [
706
693
  'color',
707
694
  'showIcon',
708
695
  'hideIcon',
709
696
  'type'
710
697
  ]);
711
- const IonItem = /*@__PURE__*/ defineContainer('ion-item', defineCustomElement$x, [
698
+ const IonItem = /*@__PURE__*/ defineContainer('ion-item', defineCustomElement$w, [
712
699
  'color',
713
700
  'button',
714
701
  'detail',
@@ -723,36 +710,34 @@ const IonItem = /*@__PURE__*/ defineContainer('ion-item', defineCustomElement$x,
723
710
  'target',
724
711
  'type'
725
712
  ]);
726
- const IonItemDivider = /*@__PURE__*/ defineContainer('ion-item-divider', defineCustomElement$y, [
713
+ const IonItemDivider = /*@__PURE__*/ defineContainer('ion-item-divider', defineCustomElement$x, [
727
714
  'color',
728
715
  'sticky'
729
716
  ]);
730
- const IonItemGroup = /*@__PURE__*/ defineContainer('ion-item-group', defineCustomElement$z);
731
- const IonItemOption = /*@__PURE__*/ defineContainer('ion-item-option', defineCustomElement$A, [
717
+ const IonItemGroup = /*@__PURE__*/ defineContainer('ion-item-group', defineCustomElement$y);
718
+ const IonItemOption = /*@__PURE__*/ defineContainer('ion-item-option', defineCustomElement$z, [
732
719
  'color',
733
720
  'disabled',
734
721
  'download',
735
722
  'expandable',
736
723
  'href',
737
- 'hue',
738
724
  'rel',
739
725
  'target',
740
- 'type',
741
- 'shape'
726
+ 'type'
742
727
  ]);
743
- const IonItemOptions = /*@__PURE__*/ defineContainer('ion-item-options', defineCustomElement$B, [
728
+ const IonItemOptions = /*@__PURE__*/ defineContainer('ion-item-options', defineCustomElement$A, [
744
729
  'side',
745
730
  'ionSwipe'
746
731
  ], [
747
732
  'ionSwipe'
748
733
  ]);
749
- const IonItemSliding = /*@__PURE__*/ defineContainer('ion-item-sliding', defineCustomElement$C, [
734
+ const IonItemSliding = /*@__PURE__*/ defineContainer('ion-item-sliding', defineCustomElement$B, [
750
735
  'disabled',
751
736
  'ionDrag'
752
737
  ], [
753
738
  'ionDrag'
754
739
  ]);
755
- const IonLabel = /*@__PURE__*/ defineContainer('ion-label', defineCustomElement$D, [
740
+ const IonLabel = /*@__PURE__*/ defineContainer('ion-label', defineCustomElement$C, [
756
741
  'color',
757
742
  'position',
758
743
  'ionColor',
@@ -761,16 +746,15 @@ const IonLabel = /*@__PURE__*/ defineContainer('ion-label', defineCustomElement$
761
746
  'ionColor',
762
747
  'ionStyle'
763
748
  ]);
764
- const IonList = /*@__PURE__*/ defineContainer('ion-list', defineCustomElement$E, [
749
+ const IonList = /*@__PURE__*/ defineContainer('ion-list', defineCustomElement$D, [
765
750
  'lines',
766
- 'inset',
767
- 'shape'
751
+ 'inset'
768
752
  ]);
769
- const IonListHeader = /*@__PURE__*/ defineContainer('ion-list-header', defineCustomElement$F, [
753
+ const IonListHeader = /*@__PURE__*/ defineContainer('ion-list-header', defineCustomElement$E, [
770
754
  'color',
771
755
  'lines'
772
756
  ]);
773
- const IonMenu = /*@__PURE__*/ defineContainer('ion-menu', defineCustomElement$G, [
757
+ const IonMenu = /*@__PURE__*/ defineContainer('ion-menu', defineCustomElement$F, [
774
758
  'contentId',
775
759
  'menuId',
776
760
  'type',
@@ -790,32 +774,32 @@ const IonMenu = /*@__PURE__*/ defineContainer('ion-menu', defineCustomElement$G,
790
774
  'ionDidClose',
791
775
  'ionMenuChange'
792
776
  ]);
793
- const IonMenuButton = /*@__PURE__*/ defineContainer('ion-menu-button', defineCustomElement$H, [
777
+ const IonMenuButton = /*@__PURE__*/ defineContainer('ion-menu-button', defineCustomElement$G, [
794
778
  'color',
795
779
  'disabled',
796
780
  'menu',
797
781
  'autoHide',
798
782
  'type'
799
783
  ]);
800
- const IonMenuToggle = /*@__PURE__*/ defineContainer('ion-menu-toggle', defineCustomElement$I, [
784
+ const IonMenuToggle = /*@__PURE__*/ defineContainer('ion-menu-toggle', defineCustomElement$H, [
801
785
  'menu',
802
786
  'autoHide'
803
787
  ]);
804
- const IonNavLink = /*@__PURE__*/ defineContainer('ion-nav-link', defineCustomElement$J, [
788
+ const IonNavLink = /*@__PURE__*/ defineContainer('ion-nav-link', defineCustomElement$I, [
805
789
  'component',
806
790
  'componentProps',
807
791
  'routerDirection',
808
792
  'routerAnimation'
809
793
  ]);
810
- const IonNote = /*@__PURE__*/ defineContainer('ion-note', defineCustomElement$K, [
794
+ const IonNote = /*@__PURE__*/ defineContainer('ion-note', defineCustomElement$J, [
811
795
  'color'
812
796
  ]);
813
- const IonPicker = /*@__PURE__*/ defineContainer('ion-picker', defineCustomElement$L, [
797
+ const IonPicker = /*@__PURE__*/ defineContainer('ion-picker', defineCustomElement$K, [
814
798
  'ionInputModeChange'
815
799
  ], [
816
800
  'ionInputModeChange'
817
801
  ]);
818
- const IonPickerColumn = /*@__PURE__*/ defineContainer('ion-picker-column', defineCustomElement$M, [
802
+ const IonPickerColumn = /*@__PURE__*/ defineContainer('ion-picker-column', defineCustomElement$L, [
819
803
  'disabled',
820
804
  'value',
821
805
  'color',
@@ -824,20 +808,19 @@ const IonPickerColumn = /*@__PURE__*/ defineContainer('ion-picker-column', defin
824
808
  ], [
825
809
  'ionChange'
826
810
  ]);
827
- const IonPickerColumnOption = /*@__PURE__*/ defineContainer('ion-picker-column-option', defineCustomElement$N, [
811
+ const IonPickerColumnOption = /*@__PURE__*/ defineContainer('ion-picker-column-option', defineCustomElement$M, [
828
812
  'disabled',
829
813
  'value',
830
814
  'color'
831
815
  ]);
832
- const IonProgressBar = /*@__PURE__*/ defineContainer('ion-progress-bar', defineCustomElement$O, [
816
+ const IonProgressBar = /*@__PURE__*/ defineContainer('ion-progress-bar', defineCustomElement$N, [
833
817
  'type',
834
818
  'reversed',
835
819
  'value',
836
820
  'buffer',
837
- 'color',
838
- 'shape'
821
+ 'color'
839
822
  ]);
840
- const IonRadio = /*@__PURE__*/ defineContainer('ion-radio', defineCustomElement$P, [
823
+ const IonRadio = /*@__PURE__*/ defineContainer('ion-radio', defineCustomElement$O, [
841
824
  'color',
842
825
  'name',
843
826
  'disabled',
@@ -850,8 +833,8 @@ const IonRadio = /*@__PURE__*/ defineContainer('ion-radio', defineCustomElement$
850
833
  ], [
851
834
  'ionFocus',
852
835
  'ionBlur'
853
- ], 'value', 'ion-change');
854
- const IonRadioGroup = /*@__PURE__*/ defineContainer('ion-radio-group', defineCustomElement$Q, [
836
+ ], 'value', 'ionChange', undefined);
837
+ const IonRadioGroup = /*@__PURE__*/ defineContainer('ion-radio-group', defineCustomElement$P, [
855
838
  'allowEmptySelection',
856
839
  'compareWith',
857
840
  'name',
@@ -863,8 +846,8 @@ const IonRadioGroup = /*@__PURE__*/ defineContainer('ion-radio-group', defineCus
863
846
  ], [
864
847
  'ionChange',
865
848
  'ionValueChange'
866
- ], 'value', 'ion-change');
867
- const IonRange = /*@__PURE__*/ defineContainer('ion-range', defineCustomElement$R, [
849
+ ], 'value', 'ionChange', undefined);
850
+ const IonRange = /*@__PURE__*/ defineContainer('ion-range', defineCustomElement$Q, [
868
851
  'color',
869
852
  'debounce',
870
853
  'name',
@@ -894,8 +877,8 @@ const IonRange = /*@__PURE__*/ defineContainer('ion-range', defineCustomElement$
894
877
  'ionBlur',
895
878
  'ionKnobMoveStart',
896
879
  'ionKnobMoveEnd'
897
- ], 'value', 'ion-input');
898
- const IonRefresher = /*@__PURE__*/ defineContainer('ion-refresher', defineCustomElement$S, [
880
+ ], 'value', 'ionInput', undefined);
881
+ const IonRefresher = /*@__PURE__*/ defineContainer('ion-refresher', defineCustomElement$R, [
899
882
  'pullMin',
900
883
  'pullMax',
901
884
  'closeDuration',
@@ -914,14 +897,14 @@ const IonRefresher = /*@__PURE__*/ defineContainer('ion-refresher', defineCustom
914
897
  'ionPullStart',
915
898
  'ionPullEnd'
916
899
  ]);
917
- const IonRefresherContent = /*@__PURE__*/ defineContainer('ion-refresher-content', defineCustomElement$T, [
900
+ const IonRefresherContent = /*@__PURE__*/ defineContainer('ion-refresher-content', defineCustomElement$S, [
918
901
  'pullingIcon',
919
902
  'pullingText',
920
903
  'refreshingSpinner',
921
904
  'refreshingText'
922
905
  ]);
923
- const IonReorder = /*@__PURE__*/ defineContainer('ion-reorder', defineCustomElement$U);
924
- const IonReorderGroup = /*@__PURE__*/ defineContainer('ion-reorder-group', defineCustomElement$V, [
906
+ const IonReorder = /*@__PURE__*/ defineContainer('ion-reorder', defineCustomElement$T);
907
+ const IonReorderGroup = /*@__PURE__*/ defineContainer('ion-reorder-group', defineCustomElement$U, [
925
908
  'disabled',
926
909
  'ionItemReorder',
927
910
  'ionReorderStart',
@@ -933,11 +916,11 @@ const IonReorderGroup = /*@__PURE__*/ defineContainer('ion-reorder-group', defin
933
916
  'ionReorderMove',
934
917
  'ionReorderEnd'
935
918
  ]);
936
- const IonRippleEffect = /*@__PURE__*/ defineContainer('ion-ripple-effect', defineCustomElement$W, [
919
+ const IonRippleEffect = /*@__PURE__*/ defineContainer('ion-ripple-effect', defineCustomElement$V, [
937
920
  'type'
938
921
  ]);
939
- const IonRow = /*@__PURE__*/ defineContainer('ion-row', defineCustomElement$X);
940
- const IonSearchbar = /*@__PURE__*/ defineContainer('ion-searchbar', defineCustomElement$Y, [
922
+ const IonRow = /*@__PURE__*/ defineContainer('ion-row', defineCustomElement$W);
923
+ const IonSearchbar = /*@__PURE__*/ defineContainer('ion-searchbar', defineCustomElement$X, [
941
924
  'color',
942
925
  'animated',
943
926
  'autocapitalize',
@@ -960,8 +943,6 @@ const IonSearchbar = /*@__PURE__*/ defineContainer('ion-searchbar', defineCustom
960
943
  'spellcheck',
961
944
  'type',
962
945
  'value',
963
- 'shape',
964
- 'size',
965
946
  'ionInput',
966
947
  'ionChange',
967
948
  'ionCancel',
@@ -977,8 +958,8 @@ const IonSearchbar = /*@__PURE__*/ defineContainer('ion-searchbar', defineCustom
977
958
  'ionBlur',
978
959
  'ionFocus',
979
960
  'ionStyle'
980
- ], 'value', 'ion-input');
981
- const IonSegment = /*@__PURE__*/ defineContainer('ion-segment', defineCustomElement$Z, [
961
+ ], 'value', 'ionInput', undefined);
962
+ const IonSegment = /*@__PURE__*/ defineContainer('ion-segment', defineCustomElement$Y, [
982
963
  'color',
983
964
  'disabled',
984
965
  'scrollable',
@@ -992,25 +973,24 @@ const IonSegment = /*@__PURE__*/ defineContainer('ion-segment', defineCustomElem
992
973
  'ionChange',
993
974
  'ionSelect',
994
975
  'ionStyle'
995
- ], 'value', 'ion-change');
996
- const IonSegmentButton = /*@__PURE__*/ defineContainer('ion-segment-button', defineCustomElement$_, [
976
+ ], 'value', 'ionChange', undefined);
977
+ const IonSegmentButton = /*@__PURE__*/ defineContainer('ion-segment-button', defineCustomElement$Z, [
997
978
  'contentId',
998
979
  'disabled',
999
980
  'layout',
1000
981
  'type',
1001
982
  'value'
1002
- ], [], 'value', 'ion-change');
1003
- const IonSegmentContent = /*@__PURE__*/ defineContainer('ion-segment-content', defineCustomElement$$);
1004
- const IonSegmentView = /*@__PURE__*/ defineContainer('ion-segment-view', defineCustomElement$10, [
983
+ ], [], 'value', 'ionChange', undefined);
984
+ const IonSegmentContent = /*@__PURE__*/ defineContainer('ion-segment-content', defineCustomElement$_);
985
+ const IonSegmentView = /*@__PURE__*/ defineContainer('ion-segment-view', defineCustomElement$$, [
1005
986
  'disabled',
1006
987
  'swipeGesture',
1007
988
  'ionSegmentViewScroll'
1008
989
  ], [
1009
990
  'ionSegmentViewScroll'
1010
991
  ]);
1011
- const IonSelect = /*@__PURE__*/ defineContainer('ion-select', defineCustomElement$11, [
992
+ const IonSelect = /*@__PURE__*/ defineContainer('ion-select', defineCustomElement$10, [
1012
993
  'cancelText',
1013
- 'cancelIcon',
1014
994
  'color',
1015
995
  'compareWith',
1016
996
  'disabled',
@@ -1029,10 +1009,9 @@ const IonSelect = /*@__PURE__*/ defineContainer('ion-select', defineCustomElemen
1029
1009
  'selectedText',
1030
1010
  'toggleIcon',
1031
1011
  'expandedIcon',
1032
- 'required',
1033
1012
  'shape',
1034
- 'size',
1035
1013
  'value',
1014
+ 'required',
1036
1015
  'ionChange',
1037
1016
  'ionCancel',
1038
1017
  'ionDismiss',
@@ -1046,33 +1025,30 @@ const IonSelect = /*@__PURE__*/ defineContainer('ion-select', defineCustomElemen
1046
1025
  'ionFocus',
1047
1026
  'ionBlur',
1048
1027
  'ionStyle'
1049
- ], 'value', 'ion-change');
1050
- const IonSelectModal = /*@__PURE__*/ defineContainer('ion-select-modal', defineCustomElement$12, [
1028
+ ], 'value', 'ionChange', undefined);
1029
+ const IonSelectModal = /*@__PURE__*/ defineContainer('ion-select-modal', defineCustomElement$11, [
1051
1030
  'header',
1052
1031
  'cancelText',
1053
- 'cancelIcon',
1054
1032
  'multiple',
1055
1033
  'options'
1056
1034
  ]);
1057
- const IonSelectOption = /*@__PURE__*/ defineContainer('ion-select-option', defineCustomElement$13, [
1035
+ const IonSelectOption = /*@__PURE__*/ defineContainer('ion-select-option', defineCustomElement$12, [
1058
1036
  'disabled',
1059
- 'value',
1060
- 'description'
1037
+ 'value'
1061
1038
  ]);
1062
- const IonSkeletonText = /*@__PURE__*/ defineContainer('ion-skeleton-text', defineCustomElement$14, [
1039
+ const IonSkeletonText = /*@__PURE__*/ defineContainer('ion-skeleton-text', defineCustomElement$13, [
1063
1040
  'animated',
1064
1041
  'ionStyle'
1065
1042
  ], [
1066
1043
  'ionStyle'
1067
1044
  ]);
1068
- const IonSpinner = /*@__PURE__*/ defineContainer('ion-spinner', defineCustomElement$15, [
1045
+ const IonSpinner = /*@__PURE__*/ defineContainer('ion-spinner', defineCustomElement$14, [
1069
1046
  'color',
1070
1047
  'duration',
1071
1048
  'name',
1072
- 'paused',
1073
- 'size'
1049
+ 'paused'
1074
1050
  ]);
1075
- const IonSplitPane = /*@__PURE__*/ defineContainer('ion-split-pane', defineCustomElement$16, [
1051
+ const IonSplitPane = /*@__PURE__*/ defineContainer('ion-split-pane', defineCustomElement$15, [
1076
1052
  'contentId',
1077
1053
  'disabled',
1078
1054
  'when',
@@ -1080,16 +1056,16 @@ const IonSplitPane = /*@__PURE__*/ defineContainer('ion-split-pane', defineCusto
1080
1056
  ], [
1081
1057
  'ionSplitPaneVisible'
1082
1058
  ]);
1083
- const IonTab = /*@__PURE__*/ defineContainer('ion-tab', defineCustomElement$17, [
1059
+ const IonTab = /*@__PURE__*/ defineContainer('ion-tab', defineCustomElement$16, [
1084
1060
  'active',
1085
1061
  'delegate',
1086
1062
  'tab',
1087
1063
  'component'
1088
1064
  ]);
1089
- const IonText = /*@__PURE__*/ defineContainer('ion-text', defineCustomElement$18, [
1065
+ const IonText = /*@__PURE__*/ defineContainer('ion-text', defineCustomElement$17, [
1090
1066
  'color'
1091
1067
  ]);
1092
- const IonTextarea = /*@__PURE__*/ defineContainer('ion-textarea', defineCustomElement$19, [
1068
+ const IonTextarea = /*@__PURE__*/ defineContainer('ion-textarea', defineCustomElement$18, [
1093
1069
  'color',
1094
1070
  'autocapitalize',
1095
1071
  'autofocus',
@@ -1118,7 +1094,6 @@ const IonTextarea = /*@__PURE__*/ defineContainer('ion-textarea', defineCustomEl
1118
1094
  'label',
1119
1095
  'labelPlacement',
1120
1096
  'shape',
1121
- 'size',
1122
1097
  'ionChange',
1123
1098
  'ionInput',
1124
1099
  'ionBlur',
@@ -1128,16 +1103,16 @@ const IonTextarea = /*@__PURE__*/ defineContainer('ion-textarea', defineCustomEl
1128
1103
  'ionInput',
1129
1104
  'ionBlur',
1130
1105
  'ionFocus'
1131
- ], 'value', 'ion-input');
1132
- const IonThumbnail = /*@__PURE__*/ defineContainer('ion-thumbnail', defineCustomElement$1a);
1133
- const IonTitle = /*@__PURE__*/ defineContainer('ion-title', defineCustomElement$1b, [
1106
+ ], 'value', 'ionInput', undefined);
1107
+ const IonThumbnail = /*@__PURE__*/ defineContainer('ion-thumbnail', defineCustomElement$19);
1108
+ const IonTitle = /*@__PURE__*/ defineContainer('ion-title', defineCustomElement$1a, [
1134
1109
  'color',
1135
1110
  'size',
1136
1111
  'ionStyle'
1137
1112
  ], [
1138
1113
  'ionStyle'
1139
1114
  ]);
1140
- const IonToggle = /*@__PURE__*/ defineContainer('ion-toggle', defineCustomElement$1c, [
1115
+ const IonToggle = /*@__PURE__*/ defineContainer('ion-toggle', defineCustomElement$1b, [
1141
1116
  'color',
1142
1117
  'name',
1143
1118
  'checked',
@@ -1157,10 +1132,9 @@ const IonToggle = /*@__PURE__*/ defineContainer('ion-toggle', defineCustomElemen
1157
1132
  'ionChange',
1158
1133
  'ionFocus',
1159
1134
  'ionBlur'
1160
- ], 'checked', 'ion-change');
1161
- const IonToolbar = /*@__PURE__*/ defineContainer('ion-toolbar', defineCustomElement$1d, [
1162
- 'color',
1163
- 'titlePlacement'
1135
+ ], 'checked', 'ionChange', undefined);
1136
+ const IonToolbar = /*@__PURE__*/ defineContainer('ion-toolbar', defineCustomElement$1c, [
1137
+ 'color'
1164
1138
  ]);
1165
1139
 
1166
1140
  const useBackButton = (priority, handler) => {
@@ -1323,7 +1297,7 @@ const IonicVue = {
1323
1297
  };
1324
1298
 
1325
1299
  const IonBackButton = /*@__PURE__*/ defineComponent((_, { attrs, slots }) => {
1326
- defineCustomElement$1e();
1300
+ defineCustomElement$1d();
1327
1301
  // TODO(FW-2969): type
1328
1302
  const ionRouter = inject("navManager");
1329
1303
  const onClick = () => {
@@ -1369,8 +1343,14 @@ const isViewVisible = (enteringEl) => {
1369
1343
  const viewDepthKey = Symbol(0);
1370
1344
  const IonRouterOutlet = /*@__PURE__*/ defineComponent({
1371
1345
  name: "IonRouterOutlet",
1346
+ props: {
1347
+ swipeGesture: {
1348
+ type: Boolean,
1349
+ default: undefined,
1350
+ },
1351
+ },
1372
1352
  setup() {
1373
- defineCustomElement$1f();
1353
+ defineCustomElement$1e();
1374
1354
  const injectedRoute = inject(routeLocationKey);
1375
1355
  const route = useRoute();
1376
1356
  const depth = inject(viewDepthKey, 0);
@@ -1446,11 +1426,6 @@ const IonRouterOutlet = /*@__PURE__*/ defineComponent({
1446
1426
  */
1447
1427
  { deep: true });
1448
1428
  const canStart = () => {
1449
- const config = getConfig();
1450
- const swipeEnabled = config &&
1451
- config.get("swipeBackEnabled", ionRouterOutlet.value.mode === "ios");
1452
- if (!swipeEnabled)
1453
- return false;
1454
1429
  const stack = viewStacks.getViewStack(id);
1455
1430
  if (!stack || stack.length <= 1)
1456
1431
  return false;
@@ -1741,7 +1716,15 @@ See https://ionicframework.com/docs/vue/navigation#ionpage for more information.
1741
1716
  },
1742
1717
  render() {
1743
1718
  const { components, registerIonPage, injectedRoute } = this;
1744
- return h("ion-router-outlet", { ref: "ionRouterOutlet" }, components &&
1719
+ /**
1720
+ * Forward props selectively to avoid setting undefined values
1721
+ * that would override the web component's config-based defaults.
1722
+ */
1723
+ const routerOutletProps = { ref: "ionRouterOutlet" };
1724
+ if (this.$props.swipeGesture !== undefined) {
1725
+ routerOutletProps.swipeGesture = this.$props.swipeGesture;
1726
+ }
1727
+ return h("ion-router-outlet", routerOutletProps, components &&
1745
1728
  components.map((c) => {
1746
1729
  var _a, _b;
1747
1730
  let props = {
@@ -1810,7 +1793,7 @@ const IonTabButton = /*@__PURE__*/ defineComponent({
1810
1793
  },
1811
1794
  },
1812
1795
  setup(props, { slots }) {
1813
- defineCustomElement$1g();
1796
+ defineCustomElement$1f();
1814
1797
  // TODO(FW-2969): type
1815
1798
  const ionRouter = inject("navManager", null);
1816
1799
  const onClick = (ev) => {
@@ -1939,7 +1922,7 @@ const IonTabs = /*@__PURE__*/ defineComponent({
1939
1922
  * `selectedTab` from core, which may occur if the custom
1940
1923
  * element is defined too early in the component's lifecycle.
1941
1924
  */
1942
- defineCustomElement$1h();
1925
+ defineCustomElement$1g();
1943
1926
  },
1944
1927
  render() {
1945
1928
  const { slots, props } = this;
@@ -2217,7 +2200,7 @@ const IonTabBar = defineComponent({
2217
2200
  ionRouter === null || ionRouter === void 0 ? void 0 : ionRouter.registerHistoryChangeListener(() => this.checkActiveTab(ionRouter));
2218
2201
  },
2219
2202
  setup(_, { slots }) {
2220
- defineCustomElement$1i();
2203
+ defineCustomElement$1h();
2221
2204
  return () => {
2222
2205
  return h("ion-tab-bar", { ref: "ionTabBar" }, slots.default && slots.default());
2223
2206
  };
@@ -2226,7 +2209,7 @@ const IonTabBar = defineComponent({
2226
2209
 
2227
2210
  const userComponents = shallowRef([]);
2228
2211
  const IonApp = /*@__PURE__*/ defineComponent((_, { attrs, slots }) => {
2229
- defineCustomElement$1j();
2212
+ defineCustomElement$1i();
2230
2213
  return () => {
2231
2214
  return h("ion-app", Object.assign({ name: "IonApp" }, attrs), [slots.default && slots.default(), ...userComponents.value]);
2232
2215
  };
@@ -2279,7 +2262,7 @@ const VueDelegate = (addFn = addTeleportedUserComponent, removeFn = removeTelepo
2279
2262
  };
2280
2263
 
2281
2264
  const IonNav = /*@__PURE__*/ defineComponent((props) => {
2282
- defineCustomElement$1k();
2265
+ defineCustomElement$1j();
2283
2266
  const views = shallowRef([]);
2284
2267
  /**
2285
2268
  * Allows us to create the component
@@ -2326,7 +2309,7 @@ const IonNav = /*@__PURE__*/ defineComponent((props) => {
2326
2309
  });
2327
2310
 
2328
2311
  const IonIcon = /*@__PURE__*/ defineComponent((props, { slots }) => {
2329
- defineCustomElement$1l();
2312
+ defineCustomElement$1k();
2330
2313
  return () => {
2331
2314
  var _a, _b;
2332
2315
  const { icon, ios, md, mode } = props;
@@ -2578,13 +2561,12 @@ const defineOverlayContainer = (name, defineCustomElement, componentProps = [],
2578
2561
  * This is an autogenerated file created by 'scripts/copy-overlays.js'.
2579
2562
  * Changes made to this file will be overwritten on build.
2580
2563
  */
2581
- const IonActionSheet = /*@__PURE__*/ defineOverlayContainer('ion-action-sheet', defineCustomElement$1m, ['animated', 'backdropDismiss', 'buttons', 'cssClass', 'enterAnimation', 'header', 'htmlAttributes', 'isOpen', 'keyboardClose', 'leaveAnimation', 'mode', 'subHeader', 'theme', 'translucent', 'trigger']);
2582
- const IonAlert = /*@__PURE__*/ defineOverlayContainer('ion-alert', defineCustomElement$1n, ['animated', 'backdropDismiss', 'buttons', 'cssClass', 'enterAnimation', 'header', 'htmlAttributes', 'inputs', 'isOpen', 'keyboardClose', 'leaveAnimation', 'message', 'mode', 'subHeader', 'theme', 'translucent', 'trigger']);
2583
- const IonLoading = /*@__PURE__*/ defineOverlayContainer('ion-loading', defineCustomElement$1o, ['animated', 'backdropDismiss', 'cssClass', 'duration', 'enterAnimation', 'htmlAttributes', 'isOpen', 'keyboardClose', 'leaveAnimation', 'message', 'mode', 'showBackdrop', 'spinner', 'theme', 'translucent', 'trigger']);
2584
- const IonModal = /*@__PURE__*/ defineOverlayContainer('ion-modal', defineCustomElement$1p, ['animated', 'backdropBreakpoint', 'backdropDismiss', 'breakpoints', 'canDismiss', 'enterAnimation', 'expandToScroll', 'focusTrap', 'handle', 'handleBehavior', 'htmlAttributes', 'initialBreakpoint', 'isOpen', 'keepContentsMounted', 'keyboardClose', 'leaveAnimation', 'mode', 'presentingElement', 'shape', 'showBackdrop', 'theme', 'trigger'], true);
2585
- const IonPickerLegacy = /*@__PURE__*/ defineOverlayContainer('ion-picker-legacy', defineCustomElement$1q, ['animated', 'backdropDismiss', 'buttons', 'columns', 'cssClass', 'duration', 'enterAnimation', 'htmlAttributes', 'isOpen', 'keyboardClose', 'leaveAnimation', 'mode', 'showBackdrop', 'theme', 'trigger']);
2586
- const IonPopover = /*@__PURE__*/ defineOverlayContainer('ion-popover', defineCustomElement$1r, ['alignment', 'animated', 'arrow', 'backdropDismiss', 'component', 'componentProps', 'dismissOnSelect', 'enterAnimation', 'event', 'focusTrap', 'htmlAttributes', 'isOpen', 'keepContentsMounted', 'keyboardClose', 'leaveAnimation', 'mode', 'reference', 'showBackdrop', 'side', 'size', 'theme', 'translucent', 'trigger', 'triggerAction']);
2587
- const IonToast = /*@__PURE__*/ defineOverlayContainer('ion-toast', defineCustomElement$1s, ['animated', 'buttons', 'color', 'cssClass', 'duration', 'enterAnimation', 'header', 'htmlAttributes', 'hue', 'icon', 'isOpen', 'keyboardClose', 'layout', 'leaveAnimation', 'message', 'mode', 'position', 'positionAnchor', 'shape', 'swipeGesture', 'theme', 'translucent', 'trigger']);
2564
+ const IonActionSheet = /*@__PURE__*/ defineOverlayContainer('ion-action-sheet', defineCustomElement$1l, ['animated', 'backdropDismiss', 'buttons', 'cssClass', 'enterAnimation', 'header', 'htmlAttributes', 'isOpen', 'keyboardClose', 'leaveAnimation', 'mode', 'subHeader', 'translucent', 'trigger']);
2565
+ const IonAlert = /*@__PURE__*/ defineOverlayContainer('ion-alert', defineCustomElement$1m, ['animated', 'backdropDismiss', 'buttons', 'cssClass', 'enterAnimation', 'header', 'htmlAttributes', 'inputs', 'isOpen', 'keyboardClose', 'leaveAnimation', 'message', 'mode', 'subHeader', 'translucent', 'trigger']);
2566
+ const IonLoading = /*@__PURE__*/ defineOverlayContainer('ion-loading', defineCustomElement$1n, ['animated', 'backdropDismiss', 'cssClass', 'duration', 'enterAnimation', 'htmlAttributes', 'isOpen', 'keyboardClose', 'leaveAnimation', 'message', 'mode', 'showBackdrop', 'spinner', 'translucent', 'trigger']);
2567
+ const IonModal = /*@__PURE__*/ defineOverlayContainer('ion-modal', defineCustomElement$1o, ['animated', 'backdropBreakpoint', 'backdropDismiss', 'breakpoints', 'canDismiss', 'enterAnimation', 'expandToScroll', 'focusTrap', 'handle', 'handleBehavior', 'htmlAttributes', 'initialBreakpoint', 'isOpen', 'keepContentsMounted', 'keyboardClose', 'leaveAnimation', 'mode', 'presentingElement', 'showBackdrop', 'trigger'], true);
2568
+ const IonPopover = /*@__PURE__*/ defineOverlayContainer('ion-popover', defineCustomElement$1p, ['alignment', 'animated', 'arrow', 'backdropDismiss', 'component', 'componentProps', 'dismissOnSelect', 'enterAnimation', 'event', 'focusTrap', 'htmlAttributes', 'isOpen', 'keepContentsMounted', 'keyboardClose', 'leaveAnimation', 'mode', 'reference', 'showBackdrop', 'side', 'size', 'translucent', 'trigger', 'triggerAction']);
2569
+ const IonToast = /*@__PURE__*/ defineOverlayContainer('ion-toast', defineCustomElement$1q, ['animated', 'buttons', 'color', 'cssClass', 'duration', 'enterAnimation', 'header', 'htmlAttributes', 'icon', 'isOpen', 'keyboardClose', 'layout', 'leaveAnimation', 'message', 'mode', 'position', 'positionAnchor', 'swipeGesture', 'translucent', 'trigger']);
2588
2570
 
2589
2571
  // TODO(FW-2969): types
2590
2572
  /**
@@ -2601,16 +2583,12 @@ const createController = (defineCustomElement, oldController, useDelegate = fals
2601
2583
  };
2602
2584
  return oldController;
2603
2585
  };
2604
- const modalController = /*@__PURE__*/ createController(defineCustomElement$1p, modalController$1, true);
2605
- const popoverController = /*@__PURE__*/ createController(defineCustomElement$1r, popoverController$1, true);
2606
- const alertController = /*@__PURE__*/ createController(defineCustomElement$1n, alertController$1);
2607
- const actionSheetController = /*@__PURE__*/ createController(defineCustomElement$1m, actionSheetController$1);
2608
- const loadingController = /*@__PURE__*/ createController(defineCustomElement$1o, loadingController$1);
2609
- /**
2610
- * @deprecated Use the inline ion-picker component instead.
2611
- */
2612
- const pickerController = /*@__PURE__*/ createController(defineCustomElement$1q, pickerController$1);
2613
- const toastController = /*@__PURE__*/ createController(defineCustomElement$1s, toastController$1);
2586
+ const modalController = /*@__PURE__*/ createController(defineCustomElement$1o, modalController$1, true);
2587
+ const popoverController = /*@__PURE__*/ createController(defineCustomElement$1p, popoverController$1, true);
2588
+ const alertController = /*@__PURE__*/ createController(defineCustomElement$1m, alertController$1);
2589
+ const actionSheetController = /*@__PURE__*/ createController(defineCustomElement$1l, actionSheetController$1);
2590
+ const loadingController = /*@__PURE__*/ createController(defineCustomElement$1n, loadingController$1);
2591
+ const toastController = /*@__PURE__*/ createController(defineCustomElement$1q, toastController$1);
2614
2592
 
2615
- export { IonAccordion, IonAccordionGroup, IonActionSheet, IonAlert, IonApp, IonAvatar, IonBackButton, IonBackdrop, IonBadge, IonBreadcrumb, IonBreadcrumbs, IonButton, IonButtons, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonCol, IonContent, IonDatetime, IonDatetimeButton, IonDivider, IonFab, IonFabButton, IonFabList, IonFooter, IonGrid, IonHeader, IonIcon, IonImg, IonInfiniteScroll, IonInfiniteScrollContent, IonInput, IonInputOtp, IonInputPasswordToggle, IonItem, IonItemDivider, IonItemGroup, IonItemOption, IonItemOptions, IonItemSliding, IonLabel, IonList, IonListHeader, IonLoading, IonMenu, IonMenuButton, IonMenuToggle, IonModal, IonNav, IonNavLink, IonNote, IonPage, IonPicker, IonPickerColumn, IonPickerColumnOption, IonPickerLegacy, IonPopover, IonProgressBar, IonRadio, IonRadioGroup, IonRange, IonRefresher, IonRefresherContent, IonReorder, IonReorderGroup, IonRippleEffect, IonRouterOutlet, IonRow, IonSearchbar, IonSegment, IonSegmentButton, IonSegmentContent, IonSegmentView, IonSelect, IonSelectModal, IonSelectOption, IonSkeletonText, IonSpinner, IonSplitPane, IonTab, IonTabBar, IonTabButton, IonTabs, IonText, IonTextarea, IonThumbnail, IonTitle, IonToast, IonToggle, IonToolbar, IonicVue, actionSheetController, alertController, loadingController, modalController, onIonViewDidEnter, onIonViewDidLeave, onIonViewWillEnter, onIonViewWillLeave, pickerController, popoverController, toastController, useBackButton, useIonRouter, useKeyboard };
2593
+ export { IonAccordion, IonAccordionGroup, IonActionSheet, IonAlert, IonApp, IonAvatar, IonBackButton, IonBackdrop, IonBadge, IonBreadcrumb, IonBreadcrumbs, IonButton, IonButtons, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonCol, IonContent, IonDatetime, IonDatetimeButton, IonFab, IonFabButton, IonFabList, IonFooter, IonGrid, IonHeader, IonIcon, IonImg, IonInfiniteScroll, IonInfiniteScrollContent, IonInput, IonInputOtp, IonInputPasswordToggle, IonItem, IonItemDivider, IonItemGroup, IonItemOption, IonItemOptions, IonItemSliding, IonLabel, IonList, IonListHeader, IonLoading, IonMenu, IonMenuButton, IonMenuToggle, IonModal, IonNav, IonNavLink, IonNote, IonPage, IonPicker, IonPickerColumn, IonPickerColumnOption, IonPopover, IonProgressBar, IonRadio, IonRadioGroup, IonRange, IonRefresher, IonRefresherContent, IonReorder, IonReorderGroup, IonRippleEffect, IonRouterOutlet, IonRow, IonSearchbar, IonSegment, IonSegmentButton, IonSegmentContent, IonSegmentView, IonSelect, IonSelectModal, IonSelectOption, IonSkeletonText, IonSpinner, IonSplitPane, IonTab, IonTabBar, IonTabButton, IonTabs, IonText, IonTextarea, IonThumbnail, IonTitle, IonToast, IonToggle, IonToolbar, IonicVue, actionSheetController, alertController, loadingController, modalController, onIonViewDidEnter, onIonViewDidLeave, onIonViewWillEnter, onIonViewWillLeave, popoverController, toastController, useBackButton, useIonRouter, useKeyboard };
2616
2594
  //# sourceMappingURL=index.js.map